M: Improve transitions and remounting

rsconcept/frontend/src/components/info-error.tsx

@@ -78,8 +78,7 @@ export function InfoError({ error }: InfoErrorProps) {
   return (
     <div
       className={clsx(
-        'cc-fade-in',
+        'min-w-100', //
-        'min-w-100',
         'px-3 py-2 flex flex-col',
         'text-destructive text-sm font-semibold',
         'select-text'

rsconcept/frontend/src/features/auth/components/expected-anonymous.tsx

@@ -15,7 +15,7 @@ export function ExpectedAnonymous() {
   }
 
   return (
-    <div className='cc-fade-in flex flex-col items-center gap-3 py-6'>
+    <div className='flex flex-col items-center gap-3 py-6'>
       <p className='font-semibold'>{`Вы вошли в систему как ${user.username}`}</p>
       <div className='flex gap-3'>
         <TextURL text='Новая схема' href='/library/create' />

rsconcept/frontend/src/features/auth/pages/login-page.tsx

@@ -55,7 +55,7 @@ export function LoginPage() {
   }
   return (
     <form
-      className='cc-column cc-fade-in w-96 mx-auto pt-12 pb-6 px-6'
+      className='cc-column w-96 mx-auto pt-12 pb-6 px-6'
       onSubmit={event => void handleSubmit(onSubmit)(event)}
       onChange={resetErrors}
     >

rsconcept/frontend/src/features/auth/pages/restore-password-page.tsx

@@ -32,7 +32,7 @@ export function Component() {
     );
   } else {
     return (
-      <form className='cc-fade-in cc-column w-96 mx-auto px-6 mt-3' onSubmit={handleSubmit} onChange={clearServerError}>
+      <form className='cc-column w-96 mx-auto px-6 mt-3' onSubmit={handleSubmit} onChange={clearServerError}>
         <TextInput
           id='email'
           autoComplete='email'

rsconcept/frontend/src/features/help/pages/manuals-page/view-topic.tsx

@@ -13,11 +13,7 @@ interface ViewTopicProps {
 export function ViewTopic({ topic }: ViewTopicProps) {
   const mainHeight = useMainHeight();
   return (
-    <div
+    <div key={topic} className='py-2 px-6 mx-auto sm:mx-0 lg:px-12 overflow-y-auto' style={{ maxHeight: mainHeight }}>
-      key={topic}
-      className='cc-fade-in py-2 px-6 mx-auto sm:mx-0 lg:px-12 overflow-y-auto'
-      style={{ maxHeight: mainHeight }}
-    >
       <TopicPage topic={topic} />
     </div>
   );

rsconcept/frontend/src/features/home/database-schema-page.tsx

@@ -16,7 +16,7 @@ export function Component() {
   }, [hideFooter]);
 
   return (
-    <div className='cc-fade-in flex justify-center overflow-hidden' style={{ maxHeight: panelHeight }}>
+    <div className='flex justify-center overflow-hidden' style={{ maxHeight: panelHeight }}>
       <TransformWrapper>
         <TransformComponent>
           <img alt='Схема базы данных' src={resources.db_schema} className='w-fit h-fit' />

rsconcept/frontend/src/features/library/pages/create-item-page/form-create-item.tsx

@@ -99,7 +99,7 @@ export function FormCreateItem() {
 
   return (
     <form
-      className='cc-fade-in cc-column w-120 mx-auto px-6 py-3'
+      className='cc-column w-120 mx-auto px-6 py-3'
       onSubmit={event => void handleSubmit(onSubmit)(event)}
       onChange={resetErrors}
     >

rsconcept/frontend/src/features/oss/pages/oss-page/editor-oss-card/editor-oss-card.tsx

@@ -46,7 +46,7 @@ export function EditorOssCard() {
         className={clsx('md:max-w-fit max-w-128 min-w-fit', 'flex flex-row flex-wrap pt-8 px-6 justify-center')}
       >
         <div className='cc-column px-3'>
-          <FormOSS />
+          <FormOSS key={schema.id} />
           <EditorLibraryItem schema={schema} isAttachedToOSS={false} />
         </div>
 

rsconcept/frontend/src/features/rsform/pages/rsform-page/editor-constituenta/editor-constituenta.tsx

@@ -94,6 +94,7 @@ export function EditorConstituenta() {
       <div className='mx-0 md:mx-auto pt-8 md:w-195 shrink-0 xs:pt-0'>
         {activeCst ? (
           <FormConstituenta
+            key={activeCst.id}
             id={globalIDs.constituenta_editor}
             toggleReset={toggleReset}
             activeCst={activeCst}

rsconcept/frontend/src/features/rsform/pages/rsform-page/editor-rsexpression/editor-rsexpression.tsx

@@ -155,7 +155,7 @@ export function EditorRSExpression({
   }
 
   return (
-    <div className='relative cc-fade-in'>
+    <div className='relative'>
       <ToolbarRSExpression
         className='absolute -top-2 right-0'
         showAST={handleShowAST}

rsconcept/frontend/src/features/rsform/pages/rsform-page/editor-rsform-card/editor-rsform-card.tsx

@@ -41,7 +41,7 @@ export function EditorRSFormCard() {
       />
 
       <div className='cc-column shrink'>
-        <FormRSForm />
+        <FormRSForm key={schema.id} />
         <EditorLibraryItem schema={schema} isAttachedToOSS={isAttachedToOSS} />
       </div>
 

rsconcept/frontend/src/features/rsform/pages/rsform-page/editor-term-graph/tg-flow.tsx

@@ -164,7 +164,7 @@ export function TGFlow() {
   }
 
   return (
-    <div className='cc-fade-in relative' tabIndex={-1} onKeyDown={handleKeyDown}>
+    <div className='relative' tabIndex={-1} onKeyDown={handleKeyDown}>
       <div className='cc-tab-tools flex flex-col items-center rounded-b-2xl backdrop-blur-xs'>
         <ToolbarTermGraph />
         <ToolbarFocusedCst />