F: Upgrade to tailwind 4. Fix type imports

README.md

@@ -62,8 +62,6 @@ This readme file is used mostly to document project dependencies and conventions
   <summary>npm install -D</summary>
   <pre>
   - tailwindcss
-  - postcss
-  - autoprefixer
   - eslint-plugin-import
   - eslint-plugin-react-compiler
   - eslint-plugin-simple-import-sort
@@ -73,6 +71,7 @@ This readme file is used mostly to document project dependencies and conventions
   - vite
   - jest
   - ts-jest
+  - @vitejs/plugin-react
   - @types/jest
   - @lezer/generator
   - @playwright/test

rsconcept/frontend/eslint.config.js

@@ -11,15 +11,7 @@ export default [
   ...typescriptPlugin.configs.recommendedTypeChecked,
   ...typescriptPlugin.configs.stylisticTypeChecked,
   {
-    ignores: [
-      '**/parser.ts',
-      '**/node_modules/**',
-      '**/public/**',
-      '**/dist/**',
-      'eslint.config.js',
-      'tailwind.config.js',
-      'postcss.config.js'
-    ]
+    ignores: ['**/parser.ts', '**/node_modules/**', '**/public/**', '**/dist/**', 'eslint.config.js']
   },
   {
     languageOptions: {
@@ -43,6 +35,12 @@ export default [
     settings: { react: { version: 'detect' } },
     rules: {
       'react-compiler/react-compiler': 'error',
+      '@typescript-eslint/consistent-type-imports': [
+        'warn',
+        {
+          fixStyle: 'inline-type-imports'
+        }
+      ],
       '@typescript-eslint/no-empty-object-type': ['error', { allowInterfaces: 'with-single-extends' }],
       '@typescript-eslint/prefer-nullish-coalescing': 'off',
       '@typescript-eslint/no-inferrable-types': 'off',

rsconcept/frontend/package.json

@@ -48,6 +48,7 @@
   "devDependencies": {
     "@lezer/generator": "^1.7.2",
     "@playwright/test": "^1.50.1",
+    "@tailwindcss/vite": "^4.0.7",
     "@types/jest": "^29.5.14",
     "@types/node": "^22.13.4",
     "@types/react": "^19.0.10",
@@ -55,7 +56,6 @@
     "@typescript-eslint/eslint-plugin": "^8.0.1",
     "@typescript-eslint/parser": "^8.0.1",
     "@vitejs/plugin-react": "^4.3.4",
-    "autoprefixer": "^10.4.20",
     "babel-plugin-react-compiler": "^19.0.0-beta-21e868a-20250216",
     "eslint": "^9.20.1",
     "eslint-plugin-import": "^2.31.0",
@@ -65,8 +65,7 @@
     "eslint-plugin-simple-import-sort": "^12.1.1",
     "globals": "^16.0.0",
     "jest": "^29.7.0",
-    "postcss": "^8.5.3",
-    "tailwindcss": "^3.4.17",
+    "tailwindcss": "^4.0.7",
     "ts-jest": "^29.2.5",
     "typescript": "^5.7.3",
     "typescript-eslint": "^8.24.1",

rsconcept/frontend/postcss.config.js

@@ -1,8 +0,0 @@
-export default {
-  plugins: {
-    'postcss-import': {},
-    'tailwindcss/nesting': {},
-    'tailwindcss': {},
-    'autoprefixer': {}
-  }
-};

rsconcept/frontend/src/app/Navigation/Navigation.tsx

@@ -1,7 +1,7 @@
 import clsx from 'clsx';
 
 import { IconLibrary2, IconManuals, IconNewItem2 } from '@/components/Icons';
-import { CProps } from '@/components/props';
+import { type EventMouse } from '@/components/props';
 import { useWindowSize } from '@/hooks/useWindowSize';
 import { useAppLayoutStore } from '@/stores/appLayout';
 import { PARAMETER } from '@/utils/constants';
@@ -19,11 +19,10 @@ export function Navigation() {
   const size = useWindowSize();
   const noNavigationAnimation = useAppLayoutStore(state => state.noNavigationAnimation);
 
-  const navigateHome = (event: CProps.EventMouse) => router.push(urls.home, event.ctrlKey || event.metaKey);
-  const navigateLibrary = (event: CProps.EventMouse) => router.push(urls.library, event.ctrlKey || event.metaKey);
-  const navigateHelp = (event: CProps.EventMouse) => router.push(urls.manuals, event.ctrlKey || event.metaKey);
-  const navigateCreateNew = (event: CProps.EventMouse) =>
-    router.push(urls.create_schema, event.ctrlKey || event.metaKey);
+  const navigateHome = (event: EventMouse) => router.push(urls.home, event.ctrlKey || event.metaKey);
+  const navigateLibrary = (event: EventMouse) => router.push(urls.library, event.ctrlKey || event.metaKey);
+  const navigateHelp = (event: EventMouse) => router.push(urls.manuals, event.ctrlKey || event.metaKey);
+  const navigateCreateNew = (event: EventMouse) => router.push(urls.create_schema, event.ctrlKey || event.metaKey);
 
   return (
     <nav

rsconcept/frontend/src/app/Navigation/NavigationButton.tsx

@@ -1,12 +1,12 @@
 import clsx from 'clsx';
 
-import { CProps } from '@/components/props';
+import { type EventMouse, type Styling, type Titled } from '@/components/props';
 import { globalIDs } from '@/utils/constants';
 
-interface NavigationButtonProps extends CProps.Titled, CProps.Styling {
+interface NavigationButtonProps extends Titled, Styling {
   text?: string;
   icon: React.ReactNode;
-  onClick?: (event: CProps.EventMouse) => void;
+  onClick?: (event: EventMouse) => void;
 }
 
 export function NavigationButton({
@@ -29,8 +29,9 @@ export function NavigationButton({
       data-tooltip-hidden={hideTitle}
       onClick={onClick}
       className={clsx(
-        'mr-1 h-full', //
+        'mr-1 h-full',
         'flex items-center gap-1',
+        'cursor-pointer',
         'clr-btn-nav cc-animate-color duration-500',
         'rounded-xl',
         'font-controls whitespace-nowrap',

rsconcept/frontend/src/app/Navigation/UserDropdown.tsx

@@ -15,7 +15,7 @@ import {
   IconRESTapi,
   IconUser
 } from '@/components/Icons';
-import { CProps } from '@/components/props';
+import { type EventMouse } from '@/components/props';
 import { usePreferencesStore } from '@/stores/preferences';
 
 import { urls } from '../urls';
@@ -39,7 +39,7 @@ export function UserDropdown({ isOpen, hideDropdown }: UserDropdownProps) {
   const adminMode = usePreferencesStore(state => state.adminMode);
   const toggleAdminMode = usePreferencesStore(state => state.toggleAdminMode);
 
-  function navigateProfile(event: CProps.EventMouse) {
+  function navigateProfile(event: EventMouse) {
     hideDropdown();
     router.push(urls.profile, event.ctrlKey || event.metaKey);
   }
@@ -54,7 +54,7 @@ export function UserDropdown({ isOpen, hideDropdown }: UserDropdownProps) {
     void logout().then(() => router.push(urls.admin, true));
   }
 
-  function gotoIcons(event: CProps.EventMouse) {
+  function gotoIcons(event: EventMouse) {
     hideDropdown();
     router.push(urls.icons, event.ctrlKey || event.metaKey);
   }
@@ -64,7 +64,7 @@ export function UserDropdown({ isOpen, hideDropdown }: UserDropdownProps) {
     router.push(urls.rest_api, true);
   }
 
-  function gotoDatabaseSchema(event: CProps.EventMouse) {
+  function gotoDatabaseSchema(event: EventMouse) {
     hideDropdown();
     router.push(urls.database_schema, event.ctrlKey || event.metaKey);
   }

rsconcept/frontend/src/backend/apiTransport.ts

@@ -2,7 +2,7 @@
  * Module: generic API for backend REST communications using axios library.
  */
 import { toast } from 'react-toastify';
-import axios, { AxiosError, AxiosRequestConfig } from 'axios';
+import axios, { AxiosError, type AxiosRequestConfig } from 'axios';
 import { z, ZodError } from 'zod';
 
 import { buildConstants } from '@/utils/buildConstants';

rsconcept/frontend/src/components/Container/Divider.tsx

@@ -1,8 +1,8 @@
 import clsx from 'clsx';
 
-import { CProps } from '../props';
+import { type Styling } from '../props';
 
-interface DividerProps extends CProps.Styling {
+interface DividerProps extends Styling {
   /** Indicates whether the divider is vertical. */
   vertical?: boolean;
 

rsconcept/frontend/src/components/Container/FlexColumn.tsx

@@ -1,12 +1,12 @@
 import clsx from 'clsx';
 
-import { CProps } from '../props';
+import { type Div } from '../props';
 
 /**
  * `flex` column container.
  * This component is useful for creating vertical layouts with flexbox.
  */
-export function FlexColumn({ className, children, ...restProps }: CProps.Div) {
+export function FlexColumn({ className, children, ...restProps }: Div) {
   return (
     <div className={clsx('cc-column', className)} {...restProps}>
       {children}

rsconcept/frontend/src/components/Container/Overlay.tsx

@@ -1,8 +1,8 @@
 import clsx from 'clsx';
 
-import { CProps } from '../props';
+import { type Styling } from '../props';
 
-interface OverlayProps extends CProps.Styling {
+interface OverlayProps extends Styling {
   /** Id of the overlay. */
   id?: string;
 

rsconcept/frontend/src/components/Container/Tooltip.tsx

@@ -1,8 +1,8 @@
 'use client';
 
-import { ReactNode } from 'react';
+import { type ReactNode } from 'react';
 import { createPortal } from 'react-dom';
-import { ITooltip, Tooltip as TooltipImpl } from 'react-tooltip';
+import { type ITooltip, Tooltip as TooltipImpl } from 'react-tooltip';
 import clsx from 'clsx';
 
 import { usePreferencesStore } from '@/stores/preferences';

rsconcept/frontend/src/components/Control/Button.tsx

@@ -2,9 +2,9 @@ import clsx from 'clsx';
 
 import { globalIDs } from '@/utils/constants';
 
-import { CProps } from '../props';
+import { type Button as ButtonStyle, type Colors, type Control } from '../props';
 
-interface ButtonProps extends CProps.Control, CProps.Colors, CProps.Button {
+interface ButtonProps extends Control, Colors, ButtonStyle {
   /** Icon to display first. */
   icon?: React.ReactNode;
 
@@ -45,12 +45,12 @@ export function Button({
         'select-none disabled:cursor-auto',
         'cc-animate-color',
         {
-          'border rounded': !noBorder,
+          'border rounded-sm': !noBorder,
           'px-1': dense,
           'px-3 py-1': !dense,
           'cursor-progress': loading,
           'cursor-pointer': !loading,
-          'outline-none': noOutline,
+          'outline-hidden': noOutline,
           'clr-outline': !noOutline
         },
         className,

rsconcept/frontend/src/components/Control/MiniButton.tsx

@@ -2,9 +2,9 @@ import clsx from 'clsx';
 
 import { globalIDs } from '@/utils/constants';
 
-import { CProps } from '../props';
+import { type Button } from '../props';
 
-interface MiniButtonProps extends CProps.Button {
+interface MiniButtonProps extends Button {
   /** Button type. */
   type?: 'button' | 'submit';
 
@@ -43,7 +43,7 @@ export function MiniButton({
         'cursor-pointer disabled:cursor-auto',
         {
           'px-1 py-1': !noPadding,
-          'outline-none': noHover,
+          'outline-hidden': noHover,
           'clr-hover': !noHover
         },
         className

rsconcept/frontend/src/components/Control/SelectorButton.tsx

@@ -2,9 +2,9 @@ import clsx from 'clsx';
 
 import { globalIDs } from '@/utils/constants';
 
-import { CProps } from '../props';
+import { type Button } from '../props';
 
-interface SelectorButtonProps extends CProps.Button {
+interface SelectorButtonProps extends Button {
   /** Text to display in the button. */
   text?: string;
 

rsconcept/frontend/src/components/Control/SubmitButton.tsx

@@ -1,8 +1,8 @@
 import clsx from 'clsx';
 
-import { CProps } from '../props';
+import { type Button } from '../props';
 
-interface SubmitButtonProps extends CProps.Button {
+interface SubmitButtonProps extends Button {
   /** Text to display in the button. */
   text?: string;
 

rsconcept/frontend/src/components/DataTable/DataTable.tsx

@@ -3,21 +3,21 @@
 
 import { useMemo, useState } from 'react';
 import {
-  ColumnSort,
+  type ColumnSort,
   createColumnHelper,
   getCoreRowModel,
   getPaginationRowModel,
   getSortedRowModel,
-  PaginationState,
-  RowData,
+  type PaginationState,
+  type RowData,
   type RowSelectionState,
-  SortingState,
-  TableOptions,
+  type SortingState,
+  type TableOptions,
   useReactTable,
   type VisibilityState
 } from '@tanstack/react-table';
 
-import { CProps } from '../props';
+import { type EventMouse, type Styling } from '../props';
 
 import { DefaultNoData } from './DefaultNoData';
 import { PaginationTools } from './PaginationTools';
@@ -37,7 +37,7 @@ export interface IConditionalStyle<TData> {
 }
 
 export interface DataTableProps<TData extends RowData>
-  extends CProps.Styling,
+  extends Styling,
     Pick<TableOptions<TData>, 'data' | 'columns' | 'onRowSelectionChange' | 'onColumnVisibilityChange'> {
   /** Id of the component. */
   id?: string;
@@ -67,10 +67,10 @@ export interface DataTableProps<TData extends RowData>
   noDataComponent?: React.ReactNode;
 
   /** Callback to be called when a row is clicked. */
-  onRowClicked?: (rowData: TData, event: CProps.EventMouse) => void;
+  onRowClicked?: (rowData: TData, event: EventMouse) => void;
 
   /** Callback to be called when a row is double clicked. */
-  onRowDoubleClicked?: (rowData: TData, event: CProps.EventMouse) => void;
+  onRowDoubleClicked?: (rowData: TData, event: EventMouse) => void;
 
   /** Enable row selection. */
   enableRowSelection?: boolean;

rsconcept/frontend/src/components/DataTable/PaginationTools.tsx

@@ -2,7 +2,7 @@
 'use no memo';
 
 import { useCallback } from 'react';
-import { Table } from '@tanstack/react-table';
+import { type Table } from '@tanstack/react-table';
 import clsx from 'clsx';
 
 import { prefixes } from '@/utils/constants';

rsconcept/frontend/src/components/DataTable/SelectAll.tsx

@@ -1,6 +1,6 @@
 'use no memo';
 
-import { Table } from '@tanstack/react-table';
+import { type Table } from '@tanstack/react-table';
 
 import { CheckboxTristate } from '../Input';
 

rsconcept/frontend/src/components/DataTable/SelectRow.tsx

@@ -1,6 +1,6 @@
 'use no memo';
 
-import { Row } from '@tanstack/react-table';
+import { type Row } from '@tanstack/react-table';
 
 import { Checkbox } from '../Input';
 

rsconcept/frontend/src/components/DataTable/SortingIcon.tsx

@@ -1,6 +1,6 @@
 'use no memo';
 
-import { Column } from '@tanstack/react-table';
+import { type Column } from '@tanstack/react-table';
 
 import { IconSortAsc, IconSortDesc } from '../Icons';
 

rsconcept/frontend/src/components/DataTable/TableBody.tsx

@@ -1,12 +1,12 @@
 'use no memo';
 
-import { Cell, flexRender, Row, Table } from '@tanstack/react-table';
+import { type Cell, flexRender, type Row, type Table } from '@tanstack/react-table';
 import clsx from 'clsx';
 
-import { CProps } from '../props';
+import { type EventMouse } from '../props';
 
 import { SelectRow } from './SelectRow';
-import { IConditionalStyle } from '.';
+import { type IConditionalStyle } from '.';
 
 interface TableBodyProps<TData> {
   table: Table<TData>;
@@ -18,8 +18,8 @@ interface TableBodyProps<TData> {
   lastSelected: string | null;
   onChangeLastSelected: (newValue: string | null) => void;
 
-  onRowClicked?: (rowData: TData, event: CProps.EventMouse) => void;
-  onRowDoubleClicked?: (rowData: TData, event: CProps.EventMouse) => void;
+  onRowClicked?: (rowData: TData, event: EventMouse) => void;
+  onRowDoubleClicked?: (rowData: TData, event: EventMouse) => void;
 }
 
 export function TableBody<TData>({
@@ -33,7 +33,7 @@ export function TableBody<TData>({
   onRowClicked,
   onRowDoubleClicked
 }: TableBodyProps<TData>) {
-  function handleRowClicked(target: Row<TData>, event: CProps.EventMouse) {
+  function handleRowClicked(target: Row<TData>, event: EventMouse) {
     onRowClicked?.(target.original, event);
     if (enableRowSelection && target.getCanSelect()) {
       if (event.shiftKey && !!lastSelected && lastSelected !== target.id) {

rsconcept/frontend/src/components/DataTable/TableFooter.tsx

@@ -1,6 +1,6 @@
 'use no memo';
 
-import { flexRender, Header, HeaderGroup, Table } from '@tanstack/react-table';
+import { flexRender, type Header, type HeaderGroup, type Table } from '@tanstack/react-table';
 
 interface TableFooterProps<TData> {
   table: Table<TData>;

rsconcept/frontend/src/components/DataTable/TableHeader.tsx

@@ -1,6 +1,6 @@
 'use no memo';
 
-import { flexRender, Header, HeaderGroup, Table } from '@tanstack/react-table';
+import { flexRender, type Header, type HeaderGroup, type Table } from '@tanstack/react-table';
 
 import { SelectAll } from './SelectAll';
 import { SortingIcon } from './SortingIcon';

rsconcept/frontend/src/components/DomainIcons.tsx

@@ -14,7 +14,7 @@ import {
   IconHide,
   IconMoveDown,
   IconMoveUp,
-  IconProps,
+  type IconProps,
   IconPublic,
   IconSettings,
   IconShow,

rsconcept/frontend/src/components/Dropdown/Dropdown.tsx

@@ -2,9 +2,9 @@ import clsx from 'clsx';
 
 import { PARAMETER } from '@/utils/constants';
 
-import { CProps } from '../props';
+import { type Styling } from '../props';
 
-interface DropdownProps extends CProps.Styling {
+interface DropdownProps extends Styling {
   /** Indicates whether the dropdown should stretch to the left. */
   stretchLeft?: boolean;
 

rsconcept/frontend/src/components/Dropdown/DropdownButton.tsx

@@ -1,9 +1,9 @@
 import clsx from 'clsx';
 
-import { CProps } from '@/components/props';
+import { type Button } from '@/components/props';
 import { globalIDs } from '@/utils/constants';
 
-interface DropdownButtonProps extends CProps.Button {
+interface DropdownButtonProps extends Button {
   /** Icon to display first (not used if children are provided). */
   icon?: React.ReactNode;
 
@@ -36,7 +36,7 @@ export function DropdownButton({
       onClick={onClick}
       className={clsx(
         'px-3 py-1 inline-flex items-center gap-2',
-        'text-left text-sm overflow-ellipsis whitespace-nowrap',
+        'text-left text-sm text-ellipsis whitespace-nowrap',
         'disabled:clr-text-controls',
         'cc-animate-color',
         {

rsconcept/frontend/src/components/Dropdown/DropdownCheckbox.tsx

@@ -1,6 +1,6 @@
 import clsx from 'clsx';
 
-import { Checkbox, CheckboxProps } from '../Input';
+import { Checkbox, type CheckboxProps } from '../Input';
 
 /** Animated {@link Checkbox} inside a {@link Dropdown} item. */
 export function DropdownCheckbox({ onChange: setValue, disabled, ...restProps }: CheckboxProps) {
@@ -8,7 +8,7 @@ export function DropdownCheckbox({ onChange: setValue, disabled, ...restProps }:
     <div
       className={clsx(
         'px-3 py-1',
-        'text-left overflow-ellipsis whitespace-nowrap',
+        'text-left text-ellipsis whitespace-nowrap',
         'disabled:clr-text-controls cc-animate-color',
         !!setValue && !disabled && 'clr-hover'
       )}

rsconcept/frontend/src/components/Flow/DynamicEdge.tsx

@@ -1,4 +1,4 @@
-import { EdgeProps, getStraightPath } from 'reactflow';
+import { type EdgeProps, getStraightPath } from 'reactflow';
 
 import { PARAMETER } from '@/utils/constants';
 

rsconcept/frontend/src/components/Input/Checkbox.tsx

@@ -3,9 +3,9 @@ import clsx from 'clsx';
 import { globalIDs } from '@/utils/constants';
 
 import { CheckboxChecked } from '../Icons';
-import { CProps } from '../props';
+import { type Button, type EventMouse } from '../props';
 
-export interface CheckboxProps extends Omit<CProps.Button, 'value' | 'onClick' | 'onChange'> {
+export interface CheckboxProps extends Omit<Button, 'value' | 'onClick' | 'onChange'> {
   /** Label to display next to the checkbox. */
   label?: string;
 
@@ -35,7 +35,7 @@ export function Checkbox({
 }: CheckboxProps) {
   const cursor = disabled ? 'cursor-arrow' : onChange ? 'cursor-pointer' : '';
 
-  function handleClick(event: CProps.EventMouse): void {
+  function handleClick(event: EventMouse): void {
     event.preventDefault();
     event.stopPropagation();
     if (disabled || !onChange) {
@@ -49,7 +49,7 @@ export function Checkbox({
       type='button'
       className={clsx(
         'flex items-center gap-2', //
-        'outline-none',
+        'outline-hidden',
         'focus-frame',
         cursor,
         className
@@ -66,7 +66,7 @@ export function Checkbox({
         className={clsx(
           'max-w-[1rem] min-w-[1rem] h-4', //
           'pt-[0.05rem] pl-[0.05rem]',
-          'border rounded-sm',
+          'border rounded-xs',
           'cc-animate-color',
           {
             'bg-sec-600 text-sec-0': value !== false,

rsconcept/frontend/src/components/Input/CheckboxTristate.tsx

@@ -3,9 +3,9 @@ import clsx from 'clsx';
 import { globalIDs } from '@/utils/constants';
 
 import { CheckboxChecked, CheckboxNull } from '../Icons';
-import { CProps } from '../props';
+import { type EventMouse } from '../props';
 
-import { CheckboxProps } from './Checkbox';
+import { type CheckboxProps } from './Checkbox';
 
 export interface CheckboxTristateProps extends Omit<CheckboxProps, 'value' | 'onChange'> {
   /** Current value - `null`, `true` or `false`. */
@@ -31,7 +31,7 @@ export function CheckboxTristate({
 }: CheckboxTristateProps) {
   const cursor = disabled ? 'cursor-arrow' : onChange ? 'cursor-pointer' : '';
 
-  function handleClick(event: CProps.EventMouse): void {
+  function handleClick(event: EventMouse): void {
     event.preventDefault();
     event.stopPropagation();
     if (disabled || !onChange) {
@@ -51,7 +51,7 @@ export function CheckboxTristate({
       type='button'
       className={clsx(
         'flex items-center gap-2', //
-        'outline-none',
+        'outline-hidden',
         'focus-frame',
         cursor,
         className
@@ -68,7 +68,7 @@ export function CheckboxTristate({
         className={clsx(
           'w-4 h-4', //
           'pt-[0.05rem] pl-[0.05rem]',
-          'border rounded-sm',
+          'border rounded-xs',
           'cc-animate-color',
           {
             'bg-sec-600 text-sec-0': value !== false,

rsconcept/frontend/src/components/Input/ErrorField.tsx

@@ -1,9 +1,9 @@
-import { FieldError, GlobalError } from 'react-hook-form';
+import { type FieldError, type GlobalError } from 'react-hook-form';
 import clsx from 'clsx';
 
-import { CProps } from '../props';
+import { type Styling } from '../props';
 
-interface ErrorFieldProps extends CProps.Styling {
+interface ErrorFieldProps extends Styling {
   error?: FieldError | GlobalError;
 }
 

rsconcept/frontend/src/components/Input/FileInput.tsx

@@ -5,11 +5,11 @@ import clsx from 'clsx';
 
 import { Button } from '../Control';
 import { IconUpload } from '../Icons';
-import { CProps } from '../props';
+import { type Input } from '../props';
 
 import { Label } from './Label';
 
-interface FileInputProps extends Omit<CProps.Input, 'accept' | 'type'> {
+interface FileInputProps extends Omit<Input, 'accept' | 'type'> {
   /** Label to display in file upload button. */
   label: string;
 

rsconcept/frontend/src/components/Input/Label.tsx

@@ -1,8 +1,8 @@
 import clsx from 'clsx';
 
-import { CProps } from '../props';
+import { type Label as LabelStyle } from '../props';
 
-interface LabelProps extends CProps.Label {
+interface LabelProps extends LabelStyle {
   /** Text to display. */
   text?: string;
 }

rsconcept/frontend/src/components/Input/SearchBar.tsx

@@ -2,11 +2,11 @@ import clsx from 'clsx';
 
 import { Overlay } from '@/components/Container';
 import { IconSearch } from '@/components/Icons';
-import { CProps } from '@/components/props';
+import { type Styling } from '@/components/props';
 
 import { TextInput } from './TextInput';
 
-interface SearchBarProps extends CProps.Styling {
+interface SearchBarProps extends Styling {
   /** Id of the search bar. */
   id?: string;
 
@@ -50,7 +50,8 @@ export function SearchBar({
         noOutline
         placeholder={placeholder}
         type='search'
-        className={clsx('outline-none bg-transparent', !noIcon && 'pl-10')}
+        colors='bg-transparent'
+        className={clsx(!noIcon && 'pl-10')}
         noBorder={noBorder}
         value={query}
         onChange={event => onChangeQuery?.(event.target.value)}

rsconcept/frontend/src/components/Input/SelectMulti.tsx

@@ -1,12 +1,12 @@
 'use client';
 
 import Select, {
-  ClearIndicatorProps,
+  type ClearIndicatorProps,
   components,
-  DropdownIndicatorProps,
-  GroupBase,
-  Props,
-  StylesConfig
+  type DropdownIndicatorProps,
+  type GroupBase,
+  type Props,
+  type StylesConfig
 } from 'react-select';
 
 import { useWindowSize } from '@/hooks/useWindowSize';

rsconcept/frontend/src/components/Input/SelectSingle.tsx

@@ -1,12 +1,12 @@
 'use client';
 
 import Select, {
-  ClearIndicatorProps,
+  type ClearIndicatorProps,
   components,
-  DropdownIndicatorProps,
-  GroupBase,
-  Props,
-  StylesConfig
+  type DropdownIndicatorProps,
+  type GroupBase,
+  type Props,
+  type StylesConfig
 } from 'react-select';
 
 import { useWindowSize } from '@/hooks/useWindowSize';

rsconcept/frontend/src/components/Input/SelectTree.tsx

@@ -6,9 +6,9 @@ import { globalIDs, PARAMETER } from '@/utils/constants';
 import { Overlay } from '../Container';
 import { MiniButton } from '../Control';
 import { IconDropArrow, IconPageRight } from '../Icons';
-import { CProps } from '../props';
+import { type EventMouse, type Styling } from '../props';
 
-interface SelectTreeProps<ItemType> extends CProps.Styling {
+interface SelectTreeProps<ItemType> extends Styling {
   /** Current value. */
   value: ItemType;
 
@@ -66,13 +66,13 @@ export function SelectTree<ItemType>({
     );
   }
 
-  function handleClickFold(event: CProps.EventMouse, target: ItemType, showChildren: boolean) {
+  function handleClickFold(event: EventMouse, target: ItemType, showChildren: boolean) {
     event.preventDefault();
     event.stopPropagation();
     onFoldItem(target, showChildren);
   }
 
-  function handleSetValue(event: CProps.EventMouse, target: ItemType) {
+  function handleSetValue(event: EventMouse, target: ItemType) {
     event.preventDefault();
     event.stopPropagation();
     onChange(target);

rsconcept/frontend/src/components/Input/TextArea.tsx

@@ -1,11 +1,11 @@
 import clsx from 'clsx';
 
 import { Label } from '../Input/Label';
-import { CProps } from '../props';
+import { type Colors, type Editor, type ErrorProcessing, type TextArea as TextAreaStyle } from '../props';
 
 import { ErrorField } from './ErrorField';
 
-export interface TextAreaProps extends CProps.Editor, CProps.ErrorProcessing, CProps.Colors, CProps.TextArea {
+export interface TextAreaProps extends Editor, ErrorProcessing, Colors, TextAreaStyle {
   /** Indicates that padding should be minimal. */
   dense?: boolean;
 
@@ -40,7 +40,7 @@ export function TextArea({
         'w-full',
         {
           'flex flex-col': !dense,
-          'flex flex-grow items-center gap-3': dense
+          'flex grow items-center gap-3': dense
         },
         dense && className
       )}
@@ -56,7 +56,7 @@ export function TextArea({
             'cc-fit-content': fitContent,
             'resize-none': noResize,
             'border': !noBorder,
-            'flex-grow max-w-full': dense,
+            'grow max-w-full': dense,
             'mt-2': !dense && !!label,
             'clr-outline': !noOutline
           },

rsconcept/frontend/src/components/Input/TextInput.tsx

@@ -1,11 +1,11 @@
 import clsx from 'clsx';
 
 import { Label } from '../Input/Label';
-import { CProps } from '../props';
+import { type Colors, type Editor, type ErrorProcessing, type Input } from '../props';
 
 import { ErrorField } from './ErrorField';
 
-interface TextInputProps extends CProps.Editor, CProps.ErrorProcessing, CProps.Colors, CProps.Input {
+interface TextInputProps extends Editor, ErrorProcessing, Colors, Input {
   /** Indicates that padding should be minimal. */
   dense?: boolean;
 
@@ -54,7 +54,7 @@ export function TextInput({
           'leading-tight truncate hover:text-clip',
           {
             'px-3': !noBorder || !disabled,
-            'flex-grow max-w-full': dense,
+            'grow max-w-full': dense,
             'mt-2': !dense && !!label,
             'border': !noBorder,
             'clr-outline': !noOutline

rsconcept/frontend/src/components/Modal/ModalForm.tsx

@@ -11,11 +11,11 @@ import { prepareTooltip } from '@/utils/utils';
 
 import { Button, MiniButton, SubmitButton } from '../Control';
 import { IconClose } from '../Icons';
-import { CProps } from '../props';
+import { type Styling } from '../props';
 
 import { ModalBackdrop } from './ModalBackdrop';
 
-export interface ModalProps extends CProps.Styling {
+export interface ModalProps extends Styling {
   /** Title of the modal window. */
   header?: string;
 
@@ -115,7 +115,7 @@ export function ModalForm({
 
         <div
           className={clsx(
-            'overscroll-contain max-h-[calc(100svh-8rem)] max-w-[100svw] xs:max-w-[calc(100svw-2rem)] outline-none',
+            'overscroll-contain max-h-[calc(100svh-8rem)] max-w-[100svw] xs:max-w-[calc(100svw-2rem)] outline-hidden',
             {
               'overflow-auto': !overflowVisible,
               'overflow-visible': overflowVisible

rsconcept/frontend/src/components/Modal/ModalView.tsx

@@ -13,7 +13,7 @@ import { Button, MiniButton } from '../Control';
 import { IconClose } from '../Icons';
 
 import { ModalBackdrop } from './ModalBackdrop';
-import { ModalProps } from './ModalForm';
+import { type ModalProps } from './ModalForm';
 
 interface ModalViewProps extends ModalProps {}
 
@@ -60,7 +60,7 @@ export function ModalView({
 
         <div
           className={clsx(
-            'overscroll-contain max-h-[calc(100svh-8rem)] max-w-[100svw] xs:max-w-[calc(100svw-2rem)] outline-none',
+            'overscroll-contain max-h-[calc(100svh-8rem)] max-w-[100svw] xs:max-w-[calc(100svw-2rem)] outline-hidden',
             {
               'overflow-auto': !overflowVisible,
               'overflow-visible': overflowVisible

rsconcept/frontend/src/components/Tabs/TabLabel.tsx

@@ -4,9 +4,9 @@ import clsx from 'clsx';
 
 import { globalIDs } from '@/utils/constants';
 
-import { CProps } from '../props';
+import { type Titled } from '../props';
 
-interface TabLabelProps extends Omit<TabPropsImpl, 'children'>, CProps.Titled {
+interface TabLabelProps extends Omit<TabPropsImpl, 'children'>, Titled {
   /** Label to display in the tab. */
   label?: string;
 }
@@ -23,7 +23,7 @@ export function TabLabel({ label, title, titleHtml, hideTitle, className, ...oth
         'clr-hover cc-animate-color duration-150',
         'text-sm whitespace-nowrap font-controls',
         'select-none hover:cursor-pointer',
-        'outline-none',
+        'outline-hidden',
         className
       )}
       tabIndex='-1'

rsconcept/frontend/src/components/View/Indicator.tsx

@@ -1,9 +1,9 @@
 import clsx from 'clsx';
 
-import { CProps } from '@/components/props';
+import { type Styling, type Titled } from '@/components/props';
 import { globalIDs } from '@/utils/constants';
 
-interface IndicatorProps extends CProps.Titled, CProps.Styling {
+interface IndicatorProps extends Titled, Styling {
   /** Icon to display. */
   icon: React.ReactNode;
 
@@ -19,7 +19,7 @@ export function Indicator({ icon, title, titleHtml, hideTitle, noPadding, classN
     <div
       className={clsx(
         'clr-text-controls',
-        'outline-none',
+        'outline-hidden',
         {
           'px-1 py-1': !noPadding
         },

rsconcept/frontend/src/components/View/NoData.tsx

@@ -1,11 +1,11 @@
 import clsx from 'clsx';
 
-import { CProps } from '@/components/props';
+import { type Div } from '@/components/props';
 
 /**
  * Wraps content in a div with a centered text.
  */
-export function NoData({ className, children, ...restProps }: CProps.Div) {
+export function NoData({ className, children, ...restProps }: Div) {
   return (
     <div className={clsx('p-3 flex flex-col items-center text-center select-none w-full', className)} {...restProps}>
       {children}

rsconcept/frontend/src/components/View/TextContent.tsx

@@ -1,10 +1,11 @@
 import clsx from 'clsx';
 
-import { CProps } from '@/components/props';
 import { globalIDs } from '@/utils/constants';
 import { truncateToLastWord } from '@/utils/utils';
 
-export interface TextContentProps extends CProps.Styling {
+import { type Styling } from '../props';
+
+export interface TextContentProps extends Styling {
   /** Text to display. */
   text: string;
 

rsconcept/frontend/src/components/View/ValueIcon.tsx

@@ -1,11 +1,11 @@
 import clsx from 'clsx';
 
-import { CProps } from '@/components/props';
 import { globalIDs } from '@/utils/constants';
 
 import { MiniButton } from '../Control';
+import { type EventMouse, type Styling, type Titled } from '../props';
 
-interface ValueIconProps extends CProps.Styling, CProps.Titled {
+interface ValueIconProps extends Styling, Titled {
   /** Id of the component. */
   id?: string;
 
@@ -19,7 +19,7 @@ interface ValueIconProps extends CProps.Styling, CProps.Titled {
   textClassName?: string;
 
   /** Callback to be called when the component is clicked. */
-  onClick?: (event: CProps.EventMouse) => void;
+  onClick?: (event: EventMouse) => void;
 
   /** Number of symbols to display in a small size. */
   smallThreshold?: number;

rsconcept/frontend/src/components/View/ValueLabeled.tsx

@@ -1,8 +1,8 @@
 import clsx from 'clsx';
 
-import { CProps } from '@/components/props';
+import { type Styling } from '@/components/props';
 
-interface ValueLabeledProps extends CProps.Styling {
+interface ValueLabeledProps extends Styling {
   /** Id of the component. */
   id?: string;
 

rsconcept/frontend/src/components/View/ValueStats.tsx

@@ -1,9 +1,9 @@
-import { CProps } from '@/components/props';
+import { type Styling, type Titled } from '@/components/props';
 import { PARAMETER } from '@/utils/constants';
 
 import { ValueIcon } from './ValueIcon';
 
-interface ValueStatsProps extends CProps.Styling, CProps.Titled {
+interface ValueStatsProps extends Styling, Titled {
   /** Id of the component. */
   id: string;
 

rsconcept/frontend/src/components/props.d.ts

@@ -2,102 +2,100 @@
 import React from 'react';
 import { FieldError } from 'react-hook-form';
 
-export namespace CProps {
-  /**
-   * Represents an object that can have inline styles and CSS class names for styling.
-   */
-  export interface Styling {
-    /** Optional inline styles for the component. */
-    style?: React.CSSProperties;
+/**
+ * Represents an object that can have inline styles and CSS class names for styling.
+ */
+export interface Styling {
+  /** Optional inline styles for the component. */
+  style?: React.CSSProperties;
 
-    /** Optional CSS class name(s) for the component. */
-    className?: string;
-  }
-
-  /**
-   * Represents an object that can have a color or set of colors.
-   */
-  export interface Colors {
-    /** Optional color or set of colors applied via classNames. */
-    colors?: string;
-  }
-
-  /**
-   * Represents an object that can have a title with optional HTML rendering and a flag to hide the title.
-   */
-  export interface Titled {
-    /** Tooltip: `plain text`. */
-    title?: string;
-
-    /** Tooltip: `HTML formatted`. */
-    titleHtml?: string;
-
-    /** Indicates whether the `title` should be hidden. */
-    hideTitle?: boolean;
-  }
-
-  /**
-   * Represents an object that can have an error message.
-   */
-  export interface ErrorProcessing {
-    error?: FieldError;
-  }
-
-  /**
-   * Represents `control` component with optional title and configuration options.
-   *
-   * @remarks
-   * This type extends the {@link Titled} interface, adding properties to control the visual and interactive behavior of a component.
-   */
-  export type Control = Titled & {
-    /** Indicates whether the control is disabled. */
-    disabled?: boolean;
-
-    /** Indicates whether the control should render without a border. */
-    noBorder?: boolean;
-
-    /** Indicates whether the control should render without an outline. */
-    noOutline?: boolean;
-  };
-
-  /**
-   * Represents `editor` component that includes a label, control features, and optional title properties.
-   *
-   * @remarks
-   * This type extends the {@link Control} type, inheriting title-related properties and additional configuration options, while also adding an optional label.
-   */
-  export type Editor = Control & {
-    /** Text label. */
-    label?: string;
-  };
-
-  /**
-   * Represents `div` component with all standard HTML attributes and React-specific properties.
-   */
-  export type Div = React.ComponentProps<'div'>;
-
-  /**
-   * Represents `button` component with optional title and HTML attributes.
-   */
-  export type Button = Titled & Omit<React.ComponentProps<'button'>, 'children' | 'type'>;
-
-  /**
-   * Represents `label` component with HTML attributes.
-   */
-  export type Label = Omit<React.ComponentProps<'label'>, 'children'>;
-
-  /**
-   * Represents `textarea` component with optional title and HTML attributes.
-   */
-  export type TextArea = Titled & React.ComponentProps<'textarea'>;
-
-  /**
-   * Represents `input` component with optional title and HTML attributes.
-   */
-  export type Input = Titled & React.ComponentProps<'input'>;
-
-  /**
-   * Represents `mouse event` in React.
-   */
-  export type EventMouse = React.MouseEvent<Element, MouseEvent>;
+  /** Optional CSS class name(s) for the component. */
+  className?: string;
 }
+
+/**
+ * Represents an object that can have a color or set of colors.
+ */
+export interface Colors {
+  /** Optional color or set of colors applied via classNames. */
+  colors?: string;
+}
+
+/**
+ * Represents an object that can have a title with optional HTML rendering and a flag to hide the title.
+ */
+export interface Titled {
+  /** Tooltip: `plain text`. */
+  title?: string;
+
+  /** Tooltip: `HTML formatted`. */
+  titleHtml?: string;
+
+  /** Indicates whether the `title` should be hidden. */
+  hideTitle?: boolean;
+}
+
+/**
+ * Represents an object that can have an error message.
+ */
+export interface ErrorProcessing {
+  error?: FieldError;
+}
+
+/**
+ * Represents `control` component with optional title and configuration options.
+ *
+ * @remarks
+ * This type extends the {@link Titled} interface, adding properties to control the visual and interactive behavior of a component.
+ */
+export type Control = Titled & {
+  /** Indicates whether the control is disabled. */
+  disabled?: boolean;
+
+  /** Indicates whether the control should render without a border. */
+  noBorder?: boolean;
+
+  /** Indicates whether the control should render without an outline. */
+  noOutline?: boolean;
+};
+
+/**
+ * Represents `editor` component that includes a label, control features, and optional title properties.
+ *
+ * @remarks
+ * This type extends the {@link Control} type, inheriting title-related properties and additional configuration options, while also adding an optional label.
+ */
+export type Editor = Control & {
+  /** Text label. */
+  label?: string;
+};
+
+/**
+ * Represents `div` component with all standard HTML attributes and React-specific properties.
+ */
+export type Div = React.ComponentProps<'div'>;
+
+/**
+ * Represents `button` component with optional title and HTML attributes.
+ */
+export type Button = Titled & Omit<React.ComponentProps<'button'>, 'children' | 'type'>;
+
+/**
+ * Represents `label` component with HTML attributes.
+ */
+export type Label = Omit<React.ComponentProps<'label'>, 'children'>;
+
+/**
+ * Represents `textarea` component with optional title and HTML attributes.
+ */
+export type TextArea = Titled & React.ComponentProps<'textarea'>;
+
+/**
+ * Represents `input` component with optional title and HTML attributes.
+ */
+export type Input = Titled & React.ComponentProps<'input'>;
+
+/**
+ * Represents `mouse event` in React.
+ */
+export type EventMouse = React.MouseEvent<Element, MouseEvent>;

rsconcept/frontend/src/features/auth/backend/api.ts

@@ -5,12 +5,12 @@ import { DELAYS, KEYS } from '@/backend/configuration';
 import { infoMsg } from '@/utils/labels';
 
 import {
-  IChangePasswordDTO,
-  ICurrentUser,
-  IPasswordTokenDTO,
-  IRequestPasswordDTO,
-  IResetPasswordDTO,
-  IUserLoginDTO
+  type IChangePasswordDTO,
+  type ICurrentUser,
+  type IPasswordTokenDTO,
+  type IRequestPasswordDTO,
+  type IResetPasswordDTO,
+  type IUserLoginDTO
 } from './types';
 
 /**

rsconcept/frontend/src/features/auth/backend/useChangePassword.tsx

@@ -3,7 +3,7 @@ import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { KEYS } from '@/backend/configuration';
 
 import { authApi } from './api';
-import { IChangePasswordDTO } from './types';
+import { type IChangePasswordDTO } from './types';
 
 export const useChangePassword = () => {
   const client = useQueryClient();

rsconcept/frontend/src/features/auth/backend/useLogin.tsx

@@ -3,7 +3,7 @@ import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { KEYS } from '@/backend/configuration';
 
 import { authApi } from './api';
-import { IUserLoginDTO } from './types';
+import { type IUserLoginDTO } from './types';
 
 export const useLogin = () => {
   const client = useQueryClient();

rsconcept/frontend/src/features/auth/backend/useRequestPasswordReset.tsx

@@ -3,7 +3,7 @@ import { useMutation } from '@tanstack/react-query';
 import { KEYS } from '@/backend/configuration';
 
 import { authApi } from './api';
-import { IRequestPasswordDTO } from './types';
+import { type IRequestPasswordDTO } from './types';
 
 export const useRequestPasswordReset = () => {
   const mutation = useMutation({

rsconcept/frontend/src/features/auth/backend/useResetPassword.tsx

@@ -3,7 +3,7 @@ import { useMutation } from '@tanstack/react-query';
 import { KEYS } from '@/backend/configuration';
 
 import { authApi } from './api';
-import { IPasswordTokenDTO, IResetPasswordDTO } from './types';
+import { type IPasswordTokenDTO, type IResetPasswordDTO } from './types';
 
 export const useResetPassword = () => {
   const validateMutation = useMutation({

rsconcept/frontend/src/features/auth/pages/LoginPage.tsx

@@ -8,12 +8,12 @@ import { urls, useConceptNavigation } from '@/app';
 
 import { isAxiosError } from '@/backend/apiTransport';
 import { SubmitButton, TextURL } from '@/components/Control';
-import { ErrorData } from '@/components/InfoError';
+import { type ErrorData } from '@/components/InfoError';
 import { TextInput } from '@/components/Input';
 import { useQueryStrings } from '@/hooks/useQueryStrings';
 import { resources } from '@/utils/constants';
 
-import { IUserLoginDTO, schemaUserLogin } from '../backend/types';
+import { type IUserLoginDTO, schemaUserLogin } from '../backend/types';
 import { useAuthSuspense } from '../backend/useAuth';
 import { useLogin } from '../backend/useLogin';
 import { ExpectedAnonymous } from '../components/ExpectedAnonymous';

rsconcept/frontend/src/features/auth/pages/PasswordChangePage.tsx

@@ -7,7 +7,7 @@ import { urls, useConceptNavigation } from '@/app';
 
 import { isAxiosError } from '@/backend/apiTransport';
 import { SubmitButton } from '@/components/Control';
-import { ErrorData, InfoError } from '@/components/InfoError';
+import { type ErrorData, InfoError } from '@/components/InfoError';
 import { TextInput } from '@/components/Input';
 import { Loader } from '@/components/Loader';
 import { useQueryStrings } from '@/hooks/useQueryStrings';

rsconcept/frontend/src/features/auth/pages/RestorePasswordPage.tsx

@@ -5,7 +5,7 @@ import clsx from 'clsx';
 
 import { isAxiosError } from '@/backend/apiTransport';
 import { SubmitButton, TextURL } from '@/components/Control';
-import { ErrorData } from '@/components/InfoError';
+import { type ErrorData } from '@/components/InfoError';
 import { TextInput } from '@/components/Input';
 
 import { useRequestPasswordReset } from '../backend/useRequestPasswordReset';

rsconcept/frontend/src/features/help/components/BadgeHelp.tsx

@@ -1,10 +1,10 @@
 import React, { Suspense } from 'react';
 
-import { PlacesType, Tooltip } from '@/components/Container';
+import { type PlacesType, Tooltip } from '@/components/Container';
 import { TextURL } from '@/components/Control';
 import { IconHelp } from '@/components/Icons';
 import { Loader } from '@/components/Loader';
-import { CProps } from '@/components/props';
+import { type Styling } from '@/components/props';
 import { usePreferencesStore } from '@/stores/preferences';
 
 import { HelpTopic } from '../models/helpTopic';
@@ -13,7 +13,7 @@ const TopicPage = React.lazy(() =>
   import('@/features/help/pages/ManualsPage/TopicPage').then(module => ({ default: module.TopicPage }))
 );
 
-interface BadgeHelpProps extends CProps.Styling {
+interface BadgeHelpProps extends Styling {
   /** Topic to display in a tooltip. */
   topic: HelpTopic;
 

rsconcept/frontend/src/features/library/backend/api.ts

@@ -1,8 +1,8 @@
 import { queryOptions } from '@tanstack/react-query';
 
 import {
-  IRSFormDTO,
-  IVersionCreatedResponse,
+  type IRSFormDTO,
+  type IVersionCreatedResponse,
   schemaRSForm,
   schemaVersionCreatedResponse
 } from '@/features/rsform/backend/types';
@@ -13,14 +13,14 @@ import { infoMsg } from '@/utils/labels';
 
 import {
   AccessPolicy,
-  ICloneLibraryItemDTO,
-  ICreateLibraryItemDTO,
-  ILibraryItem,
-  IRenameLocationDTO,
-  IUpdateLibraryItemDTO,
-  IVersionCreateDTO,
-  IVersionInfo,
-  IVersionUpdateDTO,
+  type ICloneLibraryItemDTO,
+  type ICreateLibraryItemDTO,
+  type ILibraryItem,
+  type IRenameLocationDTO,
+  type IUpdateLibraryItemDTO,
+  type IVersionCreateDTO,
+  type IVersionInfo,
+  type IVersionUpdateDTO,
   schemaLibraryItem,
   schemaLibraryItemArray,
   schemaVersionInfo

rsconcept/frontend/src/features/library/backend/useApplyLibraryFilter.tsx

@@ -1,6 +1,6 @@
 import { useAuthSuspense } from '@/features/auth';
 
-import { ILibraryFilter } from '../models/library';
+import { type ILibraryFilter } from '../models/library';
 import { matchLibraryItem, matchLibraryItemLocation } from '../models/libraryAPI';
 
 import { useLibrary } from './useLibrary';

rsconcept/frontend/src/features/library/backend/useCloneItem.tsx

@@ -3,7 +3,7 @@ import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { KEYS } from '@/backend/configuration';
 
 import { libraryApi } from './api';
-import { ICloneLibraryItemDTO } from './types';
+import { type ICloneLibraryItemDTO } from './types';
 
 export const useCloneItem = () => {
   const client = useQueryClient();

rsconcept/frontend/src/features/library/backend/useCreateItem.tsx

@@ -3,7 +3,7 @@ import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { KEYS } from '@/backend/configuration';
 
 import { libraryApi } from './api';
-import { ICreateLibraryItemDTO } from './types';
+import { type ICreateLibraryItemDTO } from './types';
 
 export const useCreateItem = () => {
   const client = useQueryClient();

rsconcept/frontend/src/features/library/backend/useRenameLocation.tsx

@@ -3,7 +3,7 @@ import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { KEYS } from '@/backend/configuration';
 
 import { libraryApi } from './api';
-import { IRenameLocationDTO } from './types';
+import { type IRenameLocationDTO } from './types';
 
 export const useRenameLocation = () => {
   const client = useQueryClient();

rsconcept/frontend/src/features/library/backend/useSetAccessPolicy.tsx

@@ -1,12 +1,12 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 
-import { IOperationSchemaDTO } from '@/features/oss/backend/types';
-import { IRSFormDTO } from '@/features/rsform/backend/types';
+import { type IOperationSchemaDTO } from '@/features/oss/backend/types';
+import { type IRSFormDTO } from '@/features/rsform/backend/types';
 
 import { KEYS } from '@/backend/configuration';
 
 import { libraryApi } from './api';
-import { AccessPolicy, ILibraryItem } from './types';
+import { AccessPolicy, type ILibraryItem } from './types';
 
 export const useSetAccessPolicy = () => {
   const client = useQueryClient();

rsconcept/frontend/src/features/library/backend/useSetEditors.tsx

@@ -1,7 +1,7 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 
-import { IOperationSchemaDTO } from '@/features/oss/backend/types';
-import { IRSFormDTO } from '@/features/rsform/backend/types';
+import { type IOperationSchemaDTO } from '@/features/oss/backend/types';
+import { type IRSFormDTO } from '@/features/rsform/backend/types';
 
 import { KEYS } from '@/backend/configuration';
 

rsconcept/frontend/src/features/library/backend/useSetLocation.tsx

@@ -1,12 +1,12 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 
-import { IOperationSchemaDTO } from '@/features/oss/backend/types';
-import { IRSFormDTO } from '@/features/rsform/backend/types';
+import { type IOperationSchemaDTO } from '@/features/oss/backend/types';
+import { type IRSFormDTO } from '@/features/rsform/backend/types';
 
 import { KEYS } from '@/backend/configuration';
 
 import { libraryApi } from './api';
-import { ILibraryItem } from './types';
+import { type ILibraryItem } from './types';
 
 export const useSetLocation = () => {
   const client = useQueryClient();

rsconcept/frontend/src/features/library/backend/useSetOwner.tsx

@@ -1,12 +1,12 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 
-import { IOperationSchemaDTO } from '@/features/oss/backend/types';
-import { IRSFormDTO } from '@/features/rsform/backend/types';
+import { type IOperationSchemaDTO } from '@/features/oss/backend/types';
+import { type IRSFormDTO } from '@/features/rsform/backend/types';
 
 import { KEYS } from '@/backend/configuration';
 
 import { libraryApi } from './api';
-import { ILibraryItem } from './types';
+import { type ILibraryItem } from './types';
 
 export const useSetOwner = () => {
   const client = useQueryClient();

rsconcept/frontend/src/features/library/backend/useUpdateItem.tsx

@@ -1,12 +1,12 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 
-import { IOperationSchemaDTO } from '@/features/oss/backend/types';
-import { IRSFormDTO } from '@/features/rsform/backend/types';
+import { type IOperationSchemaDTO } from '@/features/oss/backend/types';
+import { type IRSFormDTO } from '@/features/rsform/backend/types';
 
 import { KEYS } from '@/backend/configuration';
 
 import { libraryApi } from './api';
-import { ILibraryItem, IUpdateLibraryItemDTO, LibraryItemType } from './types';
+import { type ILibraryItem, type IUpdateLibraryItemDTO, LibraryItemType } from './types';
 
 export const useUpdateItem = () => {
   const client = useQueryClient();

rsconcept/frontend/src/features/library/backend/useUpdateTimestamp.tsx

@@ -1,7 +1,7 @@
 import { useQueryClient } from '@tanstack/react-query';
 
 import { libraryApi } from './api';
-import { ILibraryItem } from './types';
+import { type ILibraryItem } from './types';
 
 export function useUpdateTimestamp() {
   const client = useQueryClient();

rsconcept/frontend/src/features/library/backend/useVersionCreate.tsx

@@ -3,7 +3,7 @@ import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { KEYS } from '@/backend/configuration';
 
 import { libraryApi } from './api';
-import { IVersionCreateDTO } from './types';
+import { type IVersionCreateDTO } from './types';
 import { useUpdateTimestamp } from './useUpdateTimestamp';
 
 export const useVersionCreate = () => {

rsconcept/frontend/src/features/library/backend/useVersionDelete.tsx

@@ -1,6 +1,6 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 
-import { IRSFormDTO } from '@/features/rsform/backend/types';
+import { type IRSFormDTO } from '@/features/rsform/backend/types';
 
 import { KEYS } from '@/backend/configuration';
 

rsconcept/frontend/src/features/library/backend/useVersionUpdate.tsx

@@ -1,11 +1,11 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 
-import { IRSFormDTO } from '@/features/rsform/backend/types';
+import { type IRSFormDTO } from '@/features/rsform/backend/types';
 
 import { KEYS } from '@/backend/configuration';
 
 import { libraryApi } from './api';
-import { IVersionUpdateDTO } from './types';
+import { type IVersionUpdateDTO } from './types';
 
 export const useVersionUpdate = () => {
   const client = useQueryClient();

rsconcept/frontend/src/features/library/components/EditorLibraryItem.tsx

@@ -16,14 +16,14 @@ import {
   IconOwner
 } from '@/components/Icons';
 import { Loader } from '@/components/Loader';
-import { CProps } from '@/components/props';
+import { type EventMouse } from '@/components/props';
 import { ValueIcon } from '@/components/View';
 import { useDialogsStore } from '@/stores/dialogs';
 import { useModificationStore } from '@/stores/modification';
 import { prefixes } from '@/utils/constants';
 import { promptText } from '@/utils/labels';
 
-import { ILibraryItemData } from '../backend/types';
+import { type ILibraryItemData } from '../backend/types';
 import { useMutatingLibrary } from '../backend/useMutatingLibrary';
 import { useSetLocation } from '../backend/useSetLocation';
 import { useSetOwner } from '../backend/useSetOwner';
@@ -62,7 +62,7 @@ export function EditorLibraryItem({ schema, isAttachedToOSS }: EditorLibraryItem
     void setOwner({ itemID: schema.id, owner: newValue });
   };
 
-  function handleOpenLibrary(event: CProps.EventMouse) {
+  function handleOpenLibrary(event: EventMouse) {
     setGlobalLocation(schema.location);
     router.push(urls.library, event.ctrlKey || event.metaKey);
   }
@@ -92,7 +92,7 @@ export function EditorLibraryItem({ schema, isAttachedToOSS }: EditorLibraryItem
           onClick={handleOpenLibrary}
         />
         <ValueIcon
-          className='text-ellipsis flex-grow'
+          className='text-ellipsis grow'
           icon={<IconFolderEdit size='1.25rem' className='icon-primary' />}
           value={schema.location}
           title={isAttachedToOSS ? 'Путь наследуется от ОСС' : 'Путь'}

rsconcept/frontend/src/features/library/components/MiniSelectorOSS.tsx

@@ -6,20 +6,20 @@ import { MiniButton } from '@/components/Control';
 import { Dropdown, DropdownButton, useDropdown } from '@/components/Dropdown';
 import { IconOSS } from '@/components/Icons';
 import { Label } from '@/components/Input';
-import { CProps } from '@/components/props';
+import { type EventMouse, type Styling } from '@/components/props';
 import { prefixes } from '@/utils/constants';
 
-import { ILibraryItemReference } from '../models/library';
+import { type ILibraryItemReference } from '../models/library';
 
-interface MiniSelectorOSSProps extends CProps.Styling {
+interface MiniSelectorOSSProps extends Styling {
   items: ILibraryItemReference[];
-  onSelect: (event: CProps.EventMouse, newValue: ILibraryItemReference) => void;
+  onSelect: (event: EventMouse, newValue: ILibraryItemReference) => void;
 }
 
 export function MiniSelectorOSS({ items, onSelect, className, ...restProps }: MiniSelectorOSSProps) {
   const ossMenu = useDropdown();
 
-  function onToggle(event: CProps.EventMouse) {
+  function onToggle(event: EventMouse) {
     if (items.length > 1) {
       ossMenu.toggle();
     } else {

rsconcept/frontend/src/features/library/components/PickSchema.tsx

@@ -4,20 +4,20 @@ import clsx from 'clsx';
 
 import { FlexColumn } from '@/components/Container';
 import { MiniButton } from '@/components/Control';
-import { createColumnHelper, DataTable, IConditionalStyle } from '@/components/DataTable';
+import { createColumnHelper, DataTable, type IConditionalStyle } from '@/components/DataTable';
 import { Dropdown, useDropdown } from '@/components/Dropdown';
 import { IconClose, IconFolderTree } from '@/components/Icons';
 import { SearchBar } from '@/components/Input';
-import { CProps } from '@/components/props';
+import { type EventMouse, type Styling } from '@/components/props';
 import { APP_COLORS } from '@/styling/colors';
 import { prefixes } from '@/utils/constants';
 
-import { ILibraryItem, LibraryItemType } from '../backend/types';
+import { type ILibraryItem, LibraryItemType } from '../backend/types';
 import { matchLibraryItem } from '../models/libraryAPI';
 
 import { SelectLocation } from './SelectLocation';
 
-interface PickSchemaProps extends CProps.Styling {
+interface PickSchemaProps extends Styling {
   id?: string;
   value: number | null;
   onChange: (newValue: number) => void;
@@ -96,7 +96,7 @@ export function PickSchema({
     }
   ];
 
-  function handleLocationClick(event: CProps.EventMouse, newValue: string) {
+  function handleLocationClick(event: EventMouse, newValue: string) {
     event.preventDefault();
     event.stopPropagation();
     locationMenu.hide();
@@ -108,7 +108,7 @@ export function PickSchema({
       <div className='flex justify-between clr-input items-center pr-1 rounded-t-md'>
         <SearchBar
           id={id ? `${id}__search` : undefined}
-          className='clr-input flex-grow rounded-t-md'
+          className='clr-input grow rounded-t-md'
           noBorder
           query={filterText}
           onChangeQuery={newValue => setFilterText(newValue)}

rsconcept/frontend/src/features/library/components/SelectAccessPolicy.tsx

@@ -1,16 +1,16 @@
 'use client';
 
 import { MiniButton } from '@/components/Control';
-import { DomIconProps } from '@/components/DomainIcons';
+import { type DomIconProps } from '@/components/DomainIcons';
 import { Dropdown, DropdownButton, useDropdown } from '@/components/Dropdown';
 import { IconPrivate, IconProtected, IconPublic } from '@/components/Icons';
-import { CProps } from '@/components/props';
+import { type Styling } from '@/components/props';
 import { prefixes } from '@/utils/constants';
 
 import { AccessPolicy } from '../backend/types';
 import { describeAccessPolicy, labelAccessPolicy } from '../labels';
 
-interface SelectAccessPolicyProps extends CProps.Styling {
+interface SelectAccessPolicyProps extends Styling {
   value: AccessPolicy;
   onChange: (value: AccessPolicy) => void;
 

rsconcept/frontend/src/features/library/components/SelectItemType.tsx

@@ -1,16 +1,16 @@
 'use client';
 
 import { SelectorButton } from '@/components/Control';
-import { DomIconProps } from '@/components/DomainIcons';
+import { type DomIconProps } from '@/components/DomainIcons';
 import { Dropdown, DropdownButton, useDropdown } from '@/components/Dropdown';
 import { IconOSS, IconRSForm } from '@/components/Icons';
-import { CProps } from '@/components/props';
+import { type Styling } from '@/components/props';
 import { prefixes } from '@/utils/constants';
 
 import { LibraryItemType } from '../backend/types';
 import { describeLibraryItemType, labelLibraryItemType } from '../labels';
 
-interface SelectItemTypeProps extends CProps.Styling {
+interface SelectItemTypeProps extends Styling {
   value: LibraryItemType;
   onChange: (value: LibraryItemType) => void;
   disabled?: boolean;

rsconcept/frontend/src/features/library/components/SelectLibraryItem.tsx

@@ -3,12 +3,12 @@
 import clsx from 'clsx';
 
 import { SelectSingle } from '@/components/Input';
-import { CProps } from '@/components/props';
+import { type Styling } from '@/components/props';
 
-import { ILibraryItem } from '../backend/types';
+import { type ILibraryItem } from '../backend/types';
 import { matchLibraryItem } from '../models/libraryAPI';
 
-interface SelectLibraryItemProps extends CProps.Styling {
+interface SelectLibraryItemProps extends Styling {
   value: ILibraryItem | null;
   onChange: (newValue: ILibraryItem | null) => void;
 

rsconcept/frontend/src/features/library/components/SelectLocation.tsx

@@ -5,15 +5,15 @@ import clsx from 'clsx';
 
 import { MiniButton } from '@/components/Control';
 import { IconFolder, IconFolderClosed, IconFolderEmpty, IconFolderOpened } from '@/components/Icons';
-import { CProps } from '@/components/props';
+import { type EventMouse, type Styling } from '@/components/props';
 
 import { useFolders } from '../backend/useFolders';
 import { labelFolderNode } from '../labels';
 import { FolderNode } from '../models/FolderTree';
 
-interface SelectLocationProps extends CProps.Styling {
+interface SelectLocationProps extends Styling {
   value: string;
-  onClick: (event: CProps.EventMouse, target: FolderNode) => void;
+  onClick: (event: EventMouse, target: FolderNode) => void;
 
   prefix: string;
   dense?: boolean;
@@ -44,7 +44,7 @@ export function SelectLocation({ value, dense, prefix, onClick, className, style
     );
   }
 
-  function handleClickFold(event: CProps.EventMouse, target: FolderNode, showChildren: boolean) {
+  function handleClickFold(event: EventMouse, target: FolderNode, showChildren: boolean) {
     event.preventDefault();
     event.stopPropagation();
     onFoldItem(target, showChildren);

rsconcept/frontend/src/features/library/components/SelectLocationContext.tsx

@@ -5,12 +5,12 @@ import clsx from 'clsx';
 import { MiniButton } from '@/components/Control';
 import { Dropdown, useDropdown } from '@/components/Dropdown';
 import { IconFolderTree } from '@/components/Icons';
-import { CProps } from '@/components/props';
+import { type EventMouse, type Styling } from '@/components/props';
 import { prefixes } from '@/utils/constants';
 
 import { SelectLocation } from './SelectLocation';
 
-interface SelectLocationContextProps extends CProps.Styling {
+interface SelectLocationContextProps extends Styling {
   value: string;
   onChange: (newValue: string) => void;
   title?: string;
@@ -26,7 +26,7 @@ export function SelectLocationContext({
 }: SelectLocationContextProps) {
   const menu = useDropdown();
 
-  function handleClick(event: CProps.EventMouse, newValue: string) {
+  function handleClick(event: EventMouse, newValue: string) {
     event.preventDefault();
     event.stopPropagation();
     menu.hide();

rsconcept/frontend/src/features/library/components/SelectLocationHead.tsx

@@ -5,13 +5,13 @@ import clsx from 'clsx';
 import { SelectorButton } from '@/components/Control';
 import { LocationIcon } from '@/components/DomainIcons';
 import { Dropdown, DropdownButton, useDropdown } from '@/components/Dropdown';
-import { CProps } from '@/components/props';
+import { type Styling } from '@/components/props';
 import { prefixes } from '@/utils/constants';
 
 import { describeLocationHead, labelLocationHead } from '../labels';
 import { LocationHead } from '../models/library';
 
-interface SelectLocationHeadProps extends CProps.Styling {
+interface SelectLocationHeadProps extends Styling {
   value: LocationHead;
   onChange: (newValue: LocationHead) => void;
   excluded?: LocationHead[];

rsconcept/frontend/src/features/library/components/SelectVersion.tsx

@@ -3,13 +3,13 @@
 import clsx from 'clsx';
 
 import { SelectSingle } from '@/components/Input';
-import { CProps } from '@/components/props';
+import { type Styling } from '@/components/props';
 
 import { labelVersion } from '../../rsform/labels';
-import { IVersionInfo } from '../backend/types';
-import { CurrentVersion } from '../models/library';
+import { type IVersionInfo } from '../backend/types';
+import { type CurrentVersion } from '../models/library';
 
-interface SelectVersionProps extends CProps.Styling {
+interface SelectVersionProps extends Styling {
   id?: string;
   value: CurrentVersion;
   onChange: (newValue: CurrentVersion) => void;

rsconcept/frontend/src/features/library/components/ToolbarItemAccess.tsx

@@ -8,7 +8,7 @@ import { IconImmutable, IconMutable } from '@/components/Icons';
 import { Label } from '@/components/Input';
 import { PARAMETER } from '@/utils/constants';
 
-import { AccessPolicy, ILibraryItem } from '../backend/types';
+import { AccessPolicy, type ILibraryItem } from '../backend/types';
 import { useMutatingLibrary } from '../backend/useMutatingLibrary';
 import { useSetAccessPolicy } from '../backend/useSetAccessPolicy';
 

rsconcept/frontend/src/features/library/dialogs/DlgCloneLibraryItem.tsx

@@ -13,7 +13,7 @@ import { Checkbox, Label, TextArea, TextInput } from '@/components/Input';
 import { ModalForm } from '@/components/Modal';
 import { useDialogsStore } from '@/stores/dialogs';
 
-import { AccessPolicy, ICloneLibraryItemDTO, ILibraryItem, schemaCloneLibraryItem } from '../backend/types';
+import { AccessPolicy, type ICloneLibraryItemDTO, type ILibraryItem, schemaCloneLibraryItem } from '../backend/types';
 import { useCloneItem } from '../backend/useCloneItem';
 import { SelectAccessPolicy } from '../components/SelectAccessPolicy';
 import { SelectLocationContext } from '../components/SelectLocationContext';

rsconcept/frontend/src/features/library/dialogs/DlgCreateVersion.tsx

@@ -9,7 +9,7 @@ import { ModalForm } from '@/components/Modal';
 import { useDialogsStore } from '@/stores/dialogs';
 import { errorMsg } from '@/utils/labels';
 
-import { IVersionCreateDTO, IVersionInfo, schemaVersionCreate } from '../backend/types';
+import { type IVersionCreateDTO, type IVersionInfo, schemaVersionCreate } from '../backend/types';
 import { useVersionCreate } from '../backend/useVersionCreate';
 import { nextVersion } from '../models/libraryAPI';
 

rsconcept/frontend/src/features/library/dialogs/DlgEditVersions/DlgEditVersions.tsx

@@ -14,7 +14,7 @@ import { ModalView } from '@/components/Modal';
 import { useDialogsStore } from '@/stores/dialogs';
 import { errorMsg } from '@/utils/labels';
 
-import { IVersionUpdateDTO, schemaVersionUpdate } from '../../backend/types';
+import { type IVersionUpdateDTO, schemaVersionUpdate } from '../../backend/types';
 import { useMutatingLibrary } from '../../backend/useMutatingLibrary';
 import { useVersionDelete } from '../../backend/useVersionDelete';
 import { useVersionUpdate } from '../../backend/useVersionUpdate';

rsconcept/frontend/src/features/library/dialogs/DlgEditVersions/TableVersions.tsx

@@ -4,11 +4,11 @@ import { useIntl } from 'react-intl';
 import clsx from 'clsx';
 
 import { MiniButton } from '@/components/Control';
-import { createColumnHelper, DataTable, IConditionalStyle } from '@/components/DataTable';
+import { createColumnHelper, DataTable, type IConditionalStyle } from '@/components/DataTable';
 import { IconRemove } from '@/components/Icons';
 import { APP_COLORS } from '@/styling/colors';
 
-import { IVersionInfo } from '../../backend/types';
+import { type IVersionInfo } from '../../backend/types';
 
 interface TableVersionsProps {
   processing: boolean;

rsconcept/frontend/src/features/library/models/libraryAPI.test.ts

@@ -1,4 +1,4 @@
-import { AccessPolicy, ILibraryItem, LibraryItemType } from '../backend/types';
+import { AccessPolicy, type ILibraryItem, LibraryItemType } from '../backend/types';
 
 import { LocationHead } from './library';
 import { matchLibraryItem, validateLocation } from './libraryAPI';

rsconcept/frontend/src/features/library/models/libraryAPI.ts

@@ -5,7 +5,7 @@
 import { limits } from '@/utils/constants';
 import { TextMatcher } from '@/utils/utils';
 
-import { ILibraryItem } from '../backend/types';
+import { type ILibraryItem } from '../backend/types';
 
 const LOCATION_REGEXP = /^\/[PLUS]((\/[!\d\p{L}]([!\d\p{L}\- ]*[!\d\p{L}])?)*)?$/u; // cspell:disable-line
 

rsconcept/frontend/src/features/library/pages/CreateItemPage/FormCreateItem.tsx

@@ -16,7 +16,12 @@ import { InfoError } from '@/components/InfoError';
 import { Label, TextArea, TextInput } from '@/components/Input';
 import { EXTEOR_TRS_FILE } from '@/utils/constants';
 
-import { AccessPolicy, ICreateLibraryItemDTO, LibraryItemType, schemaCreateLibraryItem } from '../../backend/types';
+import {
+  AccessPolicy,
+  type ICreateLibraryItemDTO,
+  LibraryItemType,
+  schemaCreateLibraryItem
+} from '../../backend/types';
 import { useCreateItem } from '../../backend/useCreateItem';
 import { SelectAccessPolicy } from '../../components/SelectAccessPolicy';
 import { SelectItemType } from '../../components/SelectItemType';
@@ -200,7 +205,7 @@ export function FormCreateItem() {
         error={errors.comment}
       />
 
-      <div className='flex justify-between gap-3 flex-grow'>
+      <div className='flex justify-between gap-3 grow'>
         <div className='flex flex-col gap-2 min-w-[7rem] h-min'>
           <Label text='Корень' />
           <Controller

rsconcept/frontend/src/features/library/pages/LibraryPage/TableLibraryItems.tsx

@@ -9,15 +9,15 @@ import { useLabelUser } from '@/features/users';
 
 import { FlexColumn } from '@/components/Container';
 import { MiniButton, TextURL } from '@/components/Control';
-import { createColumnHelper, DataTable, IConditionalStyle, VisibilityState } from '@/components/DataTable';
+import { createColumnHelper, DataTable, type IConditionalStyle, type VisibilityState } from '@/components/DataTable';
 import { IconFolderTree } from '@/components/Icons';
-import { CProps } from '@/components/props';
+import { type EventMouse } from '@/components/props';
 import { useWindowSize } from '@/hooks/useWindowSize';
 import { useFitHeight } from '@/stores/appLayout';
 import { usePreferencesStore } from '@/stores/preferences';
 import { APP_COLORS } from '@/styling/colors';
 
-import { ILibraryItem, LibraryItemType } from '../../backend/types';
+import { type ILibraryItem, LibraryItemType } from '../../backend/types';
 import { BadgeLocation } from '../../components/BadgeLocation';
 import { useLibrarySearchStore } from '../../stores/librarySearch';
 
@@ -39,7 +39,7 @@ export function TableLibraryItems({ items }: TableLibraryItemsProps) {
   const itemsPerPage = usePreferencesStore(state => state.libraryPagination);
   const setItemsPerPage = usePreferencesStore(state => state.setLibraryPagination);
 
-  function handleOpenItem(item: ILibraryItem, event: CProps.EventMouse) {
+  function handleOpenItem(item: ILibraryItem, event: EventMouse) {
     const selection = window.getSelection();
     if (!!selection && selection.toString().length > 0) {
       return;
@@ -61,7 +61,7 @@ export function TableLibraryItems({ items }: TableLibraryItemsProps) {
     });
   }, [windowSize]);
 
-  function handleToggleFolder(event: CProps.EventMouse) {
+  function handleToggleFolder(event: EventMouse) {
     event.preventDefault();
     event.stopPropagation();
     toggleFolderMode();

rsconcept/frontend/src/features/library/pages/LibraryPage/ToolbarSearch.tsx

@@ -17,7 +17,7 @@ import {
   IconUserSearch
 } from '@/components/Icons';
 import { SearchBar } from '@/components/Input';
-import { CProps } from '@/components/props';
+import { type EventMouse } from '@/components/props';
 import { prefixes } from '@/utils/constants';
 import { tripleToggleColor } from '@/utils/utils';
 
@@ -66,7 +66,7 @@ export function ToolbarSearch({ total, filtered }: ToolbarSearchProps) {
     toggleFolderMode();
   }
 
-  function handleFolderClick(event: CProps.EventMouse) {
+  function handleFolderClick(event: EventMouse) {
     if (event.ctrlKey || event.metaKey) {
       toggleFolderMode();
     } else {
@@ -139,12 +139,12 @@ export function ToolbarSearch({ total, filtered }: ToolbarSearchProps) {
         />
       </div>
 
-      <div className='flex h-full flex-grow pr-4'>
+      <div className='flex h-full grow pr-4'>
         <SearchBar
           id='library_search'
           placeholder='Поиск'
           noBorder
-          className={clsx('min-w-[7rem] sm:min-w-[10rem] max-w-[20rem]', folderMode && 'flex-grow')}
+          className={clsx('min-w-[7rem] sm:min-w-[10rem] max-w-[20rem]', folderMode && 'grow')}
           query={query}
           onChangeQuery={setQuery}
         />
@@ -203,7 +203,7 @@ export function ToolbarSearch({ total, filtered }: ToolbarSearchProps) {
             placeholder='Путь'
             noIcon
             noBorder
-            className='w-[4.5rem] sm:w-[5rem] flex-grow'
+            className='w-[4.5rem] sm:w-[5rem] grow'
             query={path}
             onChangeQuery={setPath}
           />

rsconcept/frontend/src/features/library/pages/LibraryPage/ViewSideLocation.tsx

@@ -7,7 +7,7 @@ import { BadgeHelp, HelpTopic } from '@/features/help';
 import { MiniButton } from '@/components/Control';
 import { SubfoldersIcon } from '@/components/DomainIcons';
 import { IconFolderEdit, IconFolderTree } from '@/components/Icons';
-import { CProps } from '@/components/props';
+import { type EventMouse } from '@/components/props';
 import { useWindowSize } from '@/hooks/useWindowSize';
 import { useFitHeight } from '@/stores/appLayout';
 import { PARAMETER, prefixes } from '@/utils/constants';
@@ -48,7 +48,7 @@ export function ViewSideLocation({ isVisible, onRenameLocation }: ViewSideLocati
 
   const maxHeight = useFitHeight('4.5rem');
 
-  function handleClickFolder(event: CProps.EventMouse, target: FolderNode) {
+  function handleClickFolder(event: EventMouse, target: FolderNode) {
     event.preventDefault();
     event.stopPropagation();
     if (event.ctrlKey || event.metaKey) {

rsconcept/frontend/src/features/library/stores/librarySearch.ts

@@ -3,7 +3,7 @@ import { persist } from 'zustand/middleware';
 
 import { toggleTristateFlag } from '@/utils/utils';
 
-import { ILibraryFilter, LocationHead } from '../models/library';
+import { type ILibraryFilter, LocationHead } from '../models/library';
 
 interface LibrarySearchStore {
   folderMode: boolean;

rsconcept/frontend/src/features/oss/backend/OssLoader.ts

@@ -2,13 +2,13 @@
  * Module: OSS data loading and processing.
  */
 
-import { ILibraryItem } from '@/features/library/backend/types';
+import { type ILibraryItem } from '@/features/library/backend/types';
 
 import { Graph } from '@/models/Graph';
 
-import { IOperation, IOperationSchema, IOperationSchemaStats } from '../models/oss';
+import { type IOperation, type IOperationSchema, type IOperationSchemaStats } from '../models/oss';
 
-import { IOperationSchemaDTO, OperationType } from './types';
+import { type IOperationSchemaDTO, OperationType } from './types';
 
 /**
  * Loads data into an {@link IOperationSchema} based on {@link IOperationSchemaDTO}.

rsconcept/frontend/src/features/oss/backend/api.ts

@@ -1,23 +1,23 @@
 import { queryOptions } from '@tanstack/react-query';
 
-import { ITargetCst } from '@/features/rsform/backend/types';
+import { type ITargetCst } from '@/features/rsform/backend/types';
 
 import { axiosGet, axiosPatch, axiosPost } from '@/backend/apiTransport';
 import { DELAYS, KEYS } from '@/backend/configuration';
 import { infoMsg } from '@/utils/labels';
 
 import {
-  IConstituentaReference,
-  ICstRelocateDTO,
-  IInputCreatedResponse,
-  IInputUpdateDTO,
-  IOperationCreatedResponse,
-  IOperationCreateDTO,
-  IOperationDeleteDTO,
-  IOperationPosition,
-  IOperationSchemaDTO,
-  IOperationUpdateDTO,
-  ITargetOperation,
+  type IConstituentaReference,
+  type ICstRelocateDTO,
+  type IInputCreatedResponse,
+  type IInputUpdateDTO,
+  type IOperationCreatedResponse,
+  type IOperationCreateDTO,
+  type IOperationDeleteDTO,
+  type IOperationPosition,
+  type IOperationSchemaDTO,
+  type IOperationUpdateDTO,
+  type ITargetOperation,
   schemaConstituentaReference,
   schemaOperationCreatedResponse,
   schemaOperationSchema

rsconcept/frontend/src/features/oss/backend/useInputCreate.tsx

@@ -3,7 +3,7 @@ import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { KEYS } from '@/backend/configuration';
 
 import { ossApi } from './api';
-import { ITargetOperation } from './types';
+import { type ITargetOperation } from './types';
 
 export const useInputCreate = () => {
   const client = useQueryClient();

rsconcept/frontend/src/features/oss/backend/useInputUpdate.tsx

@@ -3,7 +3,7 @@ import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { KEYS } from '@/backend/configuration';
 
 import { ossApi } from './api';
-import { IInputUpdateDTO } from './types';
+import { type IInputUpdateDTO } from './types';
 
 export const useInputUpdate = () => {
   const client = useQueryClient();