menu.hide()}
- /> : null}
+ />
);
}
diff --git a/rsconcept/frontend/src/components/RefsInput/RefsInput.tsx b/rsconcept/frontend/src/components/RefsInput/RefsInput.tsx
index 060baf87..91d486d7 100644
--- a/rsconcept/frontend/src/components/RefsInput/RefsInput.tsx
+++ b/rsconcept/frontend/src/components/RefsInput/RefsInput.tsx
@@ -6,6 +6,7 @@ import { createTheme } from '@uiw/codemirror-themes';
import CodeMirror, { BasicSetupOptions, ReactCodeMirrorProps, ReactCodeMirrorRef } from '@uiw/react-codemirror';
import clsx from 'clsx';
import { EditorView } from 'codemirror';
+import { AnimatePresence } from 'framer-motion';
import { RefObject, useCallback, useMemo, useRef, useState } from 'react';
import Label from '@/components/Common/Label';
@@ -164,6 +165,7 @@ function RefsInput({
}, [thisRef]);
return (<>
+
{showEditor ?
setShowEditor(false)}
@@ -177,6 +179,8 @@ function RefsInput({
}}
onSave={handleInputReference}
/> : null}
+
+
, HTMLTextAreaElement>;
export type Input = React.DetailedHTMLProps, HTMLInputElement>;
+export type AnimatedButton = Omit, 'type'>;
+
}
\ No newline at end of file
diff --git a/rsconcept/frontend/src/context/ThemeContext.tsx b/rsconcept/frontend/src/context/ThemeContext.tsx
index e7b3f9c2..873b41a4 100644
--- a/rsconcept/frontend/src/context/ThemeContext.tsx
+++ b/rsconcept/frontend/src/context/ThemeContext.tsx
@@ -1,10 +1,11 @@
'use client';
import clsx from 'clsx';
-import { createContext, useContext, useLayoutEffect, useMemo, useState } from 'react';
+import { createContext, useCallback, useContext, useLayoutEffect, useMemo, useState } from 'react';
import ConceptTooltip from '@/components/Common/ConceptTooltip';
import useLocalStorage from '@/hooks/useLocalStorage';
+import { animationDuration } from '@/utils/animations';
import { darkT, IColorTheme, lightT } from '@/utils/color';
import { globalIDs } from '@/utils/constants';
@@ -17,6 +18,7 @@ interface IThemeContext {
darkMode: boolean
toggleDarkMode: () => void
+ noNavigationAnimation: boolean
noNavigation: boolean
toggleNoNavigation: () => void
@@ -44,6 +46,7 @@ export const ThemeState = ({ children }: ThemeStateProps) => {
const [darkMode, setDarkMode] = useLocalStorage('darkMode', false);
const [colors, setColors] = useState(lightT);
const [noNavigation, setNoNavigation] = useState(false);
+ const [noNavigationAnimation, setNoNavigationAnimation] = useState(false);
const [noFooter, setNoFooter] = useState(false);
const [showScroll, setShowScroll] = useState(false);
@@ -65,6 +68,17 @@ export const ThemeState = ({ children }: ThemeStateProps) => {
setColors(darkMode ? darkT : lightT)
}, [darkMode, setColors]);
+ const toggleNoNavigation = useCallback(
+ () => {
+ if (noNavigation) {
+ setNoNavigationAnimation(false);
+ setNoNavigation(false);
+ } else {
+ setNoNavigationAnimation(true);
+ setTimeout(() => setNoNavigation(true), animationDuration.navigationToggle);
+ }
+ }, [noNavigation]);
+
const mainHeight = useMemo(
() => {
return !noNavigation ?
@@ -82,9 +96,9 @@ export const ThemeState = ({ children }: ThemeStateProps) => {
return (
setDarkMode(prev => !prev),
- toggleNoNavigation: () => setNoNavigation(prev => !prev),
+ toggleNoNavigation: toggleNoNavigation,
setNoFooter, setShowScroll,
viewportHeight, mainHeight
}}>
diff --git a/rsconcept/frontend/src/hooks/useDropdown.ts b/rsconcept/frontend/src/hooks/useDropdown.ts
index 6e52e9be..5797494f 100644
--- a/rsconcept/frontend/src/hooks/useDropdown.ts
+++ b/rsconcept/frontend/src/hooks/useDropdown.ts
@@ -5,17 +5,17 @@ import { useRef, useState } from 'react';
import useClickedOutside from './useClickedOutside';
function useDropdown() {
- const [isActive, setIsActive] = useState(false);
+ const [isOpen, setIsOpen] = useState(false);
const ref = useRef(null);
- useClickedOutside({ ref, callback: () => setIsActive(false) });
+ useClickedOutside({ ref, callback: () => setIsOpen(false) });
return {
ref,
- isActive,
- setIsActive,
- toggle: () => setIsActive(!isActive),
- hide: () => setIsActive(false)
+ isOpen,
+ setIsOpen,
+ toggle: () => setIsOpen(!isOpen),
+ hide: () => setIsOpen(false)
};
}
diff --git a/rsconcept/frontend/src/pages/LibraryPage/PickerStrategy.tsx b/rsconcept/frontend/src/pages/LibraryPage/PickerStrategy.tsx
index 636217f9..e702e4cb 100644
--- a/rsconcept/frontend/src/pages/LibraryPage/PickerStrategy.tsx
+++ b/rsconcept/frontend/src/pages/LibraryPage/PickerStrategy.tsx
@@ -48,8 +48,7 @@ function PickerStrategy({ value, onChange }: PickerStrategyProps) {
text={labelLibraryFilter(value)}
onClick={strategyMenu.toggle}
/>
- {strategyMenu.isActive ?
-
+
{Object.values(LibraryFilterStrategy).map(
(enumValue, index) => {
const strategy = enumValue as LibraryFilterStrategy;
@@ -63,7 +62,7 @@ function PickerStrategy({ value, onChange }: PickerStrategyProps) {
disabled={isStrategyDisabled(strategy)}
/>);
})}
- : null}
+
);
}
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/EditorConstituenta.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/EditorConstituenta.tsx
index 8c4e5a21..f66e8c10 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/EditorConstituenta.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/EditorConstituenta.tsx
@@ -1,5 +1,6 @@
'use client';
+import { AnimatePresence } from 'framer-motion';
import { Dispatch, SetStateAction, useMemo, useState } from 'react';
import { useRSForm } from '@/context/RSFormContext';
@@ -149,6 +150,7 @@ function EditorConstituenta({
onEditTerm={onEditTerm}
onRenameCst={onRenameCst}
/>
+
{(showList && windowSize.width && windowSize.width >= SIDELIST_HIDE_THRESHOLD) ?
: null}
+
);
}
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorRSExpression/EditorRSExpression.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorRSExpression/EditorRSExpression.tsx
index edbfc05a..bcd475c0 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorRSExpression/EditorRSExpression.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorRSExpression/EditorRSExpression.tsx
@@ -1,6 +1,7 @@
'use client';
import { ReactCodeMirrorRef } from '@uiw/react-codemirror';
+import { AnimatePresence } from 'framer-motion';
import { useCallback, useLayoutEffect, useRef, useState } from 'react';
import { BiListUl } from 'react-icons/bi';
import { FaRegKeyboard } from 'react-icons/fa6';
@@ -31,7 +32,7 @@ interface EditorRSExpressionProps {
value: string
label: string
placeholder?: string
-
+
disabled?: boolean
toggleReset?: boolean
showList: boolean
@@ -134,12 +135,14 @@ function EditorRSExpression({
}
return (<>
+
{showAST ?
setShowAST(false)}
/> : null}
+
@@ -179,18 +182,18 @@ function EditorRSExpression({
{...restProps}
/>
- {showControls ?
- : null}
+ />
- {(parseData && parseData.errors.length > 0) ?
0}
data={parseData}
disabled={disabled}
onShowError={onShowError}
- />: null}
+ />
);
}
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorRSExpression/ParsingResult.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorRSExpression/ParsingResult.tsx
index 42e52420..ab365fff 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorRSExpression/ParsingResult.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorRSExpression/ParsingResult.tsx
@@ -1,23 +1,39 @@
'use client';
+import clsx from 'clsx';
+import { motion } from 'framer-motion';
+
import { IExpressionParse, IRSErrorDescription } from '@/models/rslang';
+import { animateRSControl } from '@/utils/animations';
import { describeRSError } from '@/utils/labels';
import { getRSErrorPrefix } from '@/utils/misc';
interface ParsingResultProps {
- data: IExpressionParse
+ data: IExpressionParse | undefined
disabled?: boolean
+ isOpen: boolean
onShowError: (error: IRSErrorDescription) => void
}
-function ParsingResult({ data, disabled, onShowError }: ParsingResultProps) {
- const errorCount = data.errors.reduce((total, error) => (error.isCritical ? total + 1 : total), 0);
- const warningsCount = data.errors.length - errorCount;
+function ParsingResult({ isOpen, data, disabled, onShowError }: ParsingResultProps) {
+ const errorCount = data ? data.errors.reduce((total, error) => (error.isCritical ? total + 1 : total), 0) : 0;
+ const warningsCount = data ? data.errors.length - errorCount : 0;
return (
-
+
Ошибок: {errorCount} | Предупреждений: {warningsCount}
- {data.errors.map(
+ {data?.errors.map(
(error, index) => {
return (
{` ${describeRSError(error)}`}
);
})}
-
+
{MAIN_FIRST_ROW.map(
(token) =>
)}
-
);
+ );
}
export default RSEditorControls;
\ No newline at end of file
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorRSList/RSListToolbar.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorRSList/RSListToolbar.tsx
index 4a5f3a09..726c4a4c 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorRSList/RSListToolbar.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorRSList/RSListToolbar.tsx
@@ -70,8 +70,7 @@ function RSListToolbar({
disabled={!isMutable}
onClick={insertMenu.toggle}
/>
- {insertMenu.isActive ?
-
+
{(Object.values(CstType)).map(
(typeStr) =>
)}
- : null}
+
+
{showParamsDialog ?
setShowParamsDialog(false)}
initial={filterParams}
onConfirm={handleChangeParams}
/> : null}
+
{loading ? : null}
{error ? : null}
-
- {showUpload ?
- setShowUpload(false)}
- /> : null}
- {showClone ?
- setShowClone(false)}
- /> : null}
- {showCreateCst ?
- setShowCreateCst(false)}
- onCreate={handleCreateCst}
- schema={schema!}
- initial={createInitialData}
- /> : null}
- {showRenameCst ?
- setShowRenameCst(false)}
- onRename={handleRenameCst}
- initial={renameInitialData!}
- /> : null}
- {showDeleteCst ?
- setShowDeleteCst(false)}
- onDelete={handleDeleteCst}
- selected={toBeDeleted}
- /> : null}
- {showEditTerm ?
- setShowEditTerm(false)}
- onSave={handleSaveWordforms}
- target={activeCst!}
- /> : null}
- {showTemplates ?
- setShowTemplates(false)}
- insertAfter={insertCstID}
- onCreate={handleCreateCst}
- /> : null}
+
+ {showUpload ?
+ setShowUpload(false)}
+ /> : null}
+ {showClone ?
+ setShowClone(false)}
+ /> : null}
+ {showCreateCst ?
+ setShowCreateCst(false)}
+ onCreate={handleCreateCst}
+ schema={schema!}
+ initial={createInitialData}
+ /> : null}
+ {showRenameCst ?
+ setShowRenameCst(false)}
+ onRename={handleRenameCst}
+ initial={renameInitialData!}
+ /> : null}
+ {showDeleteCst ?
+ setShowDeleteCst(false)}
+ onDelete={handleDeleteCst}
+ selected={toBeDeleted}
+ /> : null}
+ {showEditTerm ?
+ setShowEditTerm(false)}
+ onSave={handleSaveWordforms}
+ target={activeCst!}
+ /> : null}
+ {showTemplates ?
+ setShowTemplates(false)}
+ insertAfter={insertCstID}
+ onCreate={handleCreateCst}
+ /> : null}
+
{(schema && !loading) ?
- {schemaMenu.isActive ?
-
-
+ }
+ icon={}
onClick={(!isOwned && user && isClaimable) ? handleClaimOwner : undefined}
/>
}
onClick={handleCreateNew}
/>
- : null}
+