@indico-data/design-system 3.19.0 → 3.20.0

package/.eslintrc.js

@@ -7,6 +7,7 @@ module.exports = {
     'eslint:recommended',
     'plugin:@typescript-eslint/recommended',
     'plugin:react/recommended',
+    'plugin:react/jsx-runtime',
   ],
   settings: {
     react: {
@@ -23,13 +24,38 @@ module.exports = {
         sourceType: 'script',
       },
     },
+    // Relaxed rules for test files, stories, examples, and documentation
+    {
+      files: [
+        '**/*.test.ts',
+        '**/*.test.tsx',
+        '**/*.stories.ts',
+        '**/*.stories.tsx',
+        '**/__tests__/**',
+        '**/*.mdx',
+        '**/examples/**',
+        '**/mock-data/**',
+        '**/sampleData.*',
+        '**/docs/**',
+        '**/stylesAndAnimations/**',
+      ],
+      rules: {
+        // i18n rules off for demo/doc files
+        'i18next/no-literal-string': 'off',
+        '@sanity/i18n/no-attribute-string-literals': 'off',
+        // Allow hooks in Storybook render functions (common pattern)
+        'react-hooks/rules-of-hooks': 'off',
+        // Allow console in stories for demos
+        'no-console': 'off',
+      },
+    },
   ],
   parser: '@typescript-eslint/parser',
   parserOptions: {
     ecmaVersion: 'latest',
     sourceType: 'module',
   },
-  plugins: ['@typescript-eslint', 'react', 'react-hooks', 'react/jsx-runtime'],
+  plugins: ['@typescript-eslint', 'react', 'react-hooks', 'i18next', '@sanity/i18n', 'import'],
   rules: {
     'no-debugger': 'error',
     'no-console': ['error', { allow: ['warn', 'error', 'info'] }],
@@ -51,7 +77,10 @@ module.exports = {
     '@typescript-eslint/ban-ts-comment': 'off',
     '@typescript-eslint/ban-types': 'off',
     '@typescript-eslint/no-this-alias': 'off',
-    '@typescript-eslint/no-unused-vars': ['error', { args: 'after-used', argsIgnorePattern: '^_' }],
+    '@typescript-eslint/no-unused-vars': [
+      'error',
+      { args: 'after-used', argsIgnorePattern: '^_', varsIgnorePattern: '^_' },
+    ],
     '@typescript-eslint/no-non-null-assertion': 'off',
     'max-len': [
       'warn',
@@ -64,5 +93,61 @@ module.exports = {
         ignoreTemplateLiterals: true,
       },
     ],
+    // prevent hardcoded strings
+    'i18next/no-literal-string': [
+      'warn',
+      {
+        markupOnly: false,
+        validateTemplate: true,
+        onlyAttribute: [
+          'label',
+          'placeholder',
+          'title',
+          'alt',
+          'aria-label',
+          'ariaLabel',
+          'tooltip',
+        ],
+        ignoreCallee: ['console', 'styled', 'css', 'classNames', 'classnames'],
+        ignoreProperty: ['displayName', 'name', 'testId', 'data-testid', 'className'],
+      },
+    ],
+    '@sanity/i18n/no-attribute-string-literals': [
+      'warn',
+      {
+        only: {
+          attributes: [
+            'label',
+            'placeholder',
+            'title',
+            'alt',
+            'aria-label',
+            'ariaLabel',
+            'tooltip',
+          ],
+        },
+      },
+    ],
+    'import/order': [
+      'warn',
+      {
+        'newlines-between': 'always',
+        groups: ['builtin', 'external', 'internal', ['parent', 'sibling', 'index'], 'type'],
+        pathGroups: [
+          {
+            pattern: '@/**',
+            group: 'internal',
+          },
+        ],
+        alphabetize: { order: 'asc', caseInsensitive: true },
+      },
+    ],
+    '@typescript-eslint/consistent-type-imports': [
+      'warn',
+      {
+        prefer: 'type-imports',
+        fixStyle: 'inline-type-imports',
+      },
+    ],
   },
 };

package/.husky/pre-commit

@@ -0,0 +1,2 @@
+#!/bin/sh
+npx lint-staged

package/.vscode/settings.json

@@ -7,5 +7,14 @@
   "prettier.prettierPath": ".yarn/sdks/prettier/index.cjs",
   "typescript.tsdk": ".yarn/sdks/typescript/lib",
   "typescript.enablePromptUseWorkspaceTsdk": true,
-  "testing.automaticallyOpenTestResults": "neverOpen"
+  "testing.automaticallyOpenTestResults": "neverOpen",
+  "editor.formatOnSave": true,
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": "explicit",
+    "source.organizeImports": "never",
+    "source.sortImports": "never"
+  },
+  "eslint.format.enable": false,
+  "prettier.requireConfig": true
 }

package/lib/components/badge/Badge.d.ts

@@ -1,2 +1,2 @@
-import { BadgeProps } from './types';
+import { type BadgeProps } from './types';
 export declare const Badge: ({ className, children, size, string, ...rest }: BadgeProps) => import("react/jsx-runtime").JSX.Element;

package/lib/components/badge/Badge.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { Badge } from './Badge';
 declare const meta: Meta;
 export default meta;

package/lib/components/button/Button.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
-import { ButtonProps } from './types';
+import { type ButtonProps } from './types';
+import type React from 'react';
 export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/lib/components/button/Button.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { Button } from '@/components';
 declare const meta: Meta;
 type Story = StoryObj<typeof Button>;

package/lib/components/button/types.d.ts

@@ -1,4 +1,4 @@
-import { IconName } from '../../types';
+import { type IconName } from '../../types';
 export type ButtonVariants = 'solid' | 'outline' | 'link' | 'action' | 'destructive' | 'soft';
 export type ButtonSizes = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 export type ButtonTypes = 'button' | 'submit' | 'reset';

package/lib/components/card/Card.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type React from 'react';
 type Props = {
     /** Additional classes for the card component */
     className?: string;

package/lib/components/card/Card.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { Card } from './Card';
 declare const meta: Meta;
 export default meta;

package/lib/components/floatUI/FloatUI.d.ts

@@ -1,2 +1,2 @@
-import { FloatUIProps } from './types';
+import { type FloatUIProps } from './types';
 export declare function FloatUI({ children, ariaLabel, isOpen: controlledIsOpen, setIsOpen: controlledSetIsOpen, isPortal, portalOptions, floatingOptions, className, hover, onOpenChange, disableAutoUpdate, }: FloatUIProps): import("react/jsx-runtime").JSX.Element;

package/lib/components/floatUI/FloatUI.stories.d.ts

@@ -1,6 +1,6 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { FloatUI } from './FloatUI';
-import { FloatUIProps } from './types';
+import { type FloatUIProps } from './types';
 declare const meta: Meta<typeof FloatUI>;
 export default meta;
 type Story = StoryObj<FloatUIProps>;

package/lib/components/floatUI/types.d.ts

@@ -1,5 +1,5 @@
-import { ReactElement } from 'react';
-import { UseFloatingOptions } from '@floating-ui/react-dom';
+import { type UseFloatingOptions } from '@floating-ui/react-dom';
+import { type ReactElement } from 'react';
 export type FloatUIProps = {
     /** An array of exactly two elements: the first element is the trigger that opens the FloatUI, and the second element is the content displayed within the FloatUI. */
     children: [ReactElement, ReactElement];

package/lib/components/forms/checkbox/Checkbox.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { Checkbox } from './Checkbox';
 declare const meta: Meta;
 export default meta;

package/lib/components/forms/date/datePicker/DatePicker.d.ts

@@ -1,3 +1,3 @@
 import 'react-day-picker/style.css';
-import { DatePickerProps } from './types';
+import { type DatePickerProps } from './types';
 export declare const DatePicker: (props: DatePickerProps) => import("react/jsx-runtime").JSX.Element;

package/lib/components/forms/date/datePicker/DatePicker.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { DatePicker } from './DatePicker';
 declare const meta: Meta;
 export default meta;

package/lib/components/forms/date/datePicker/contants.d.ts

@@ -1,4 +1,4 @@
-import { CommonProps } from './types';
+import { type CommonProps } from './types';
 export declare const getCommonProps: (props: CommonProps) => {
     className: string | undefined;
     id: string | undefined;

package/lib/components/forms/date/datePicker/types.d.ts

@@ -1,4 +1,4 @@
-import { CustomComponents, DateRange, DayEventHandler, Formatters, Matcher, Mode, MonthChangeEventHandler, OnSelectHandler } from 'react-day-picker';
+import { type CustomComponents, type DateRange, type DayEventHandler, type Formatters, type Matcher, type Mode, type MonthChangeEventHandler, type OnSelectHandler } from 'react-day-picker';
 /** Customizable text for DatePicker. */
 export interface DatePickerText {
     /** Label for "Select Time" text. Default: "Select Time" */

package/lib/components/forms/date/iconTriggerDatePicker/IconTriggerDatePicker.d.ts

@@ -1,8 +1,8 @@
-import { DateRange, Mode } from 'react-day-picker';
-import { IconName, IconSizes } from '../../../icons/types';
-import { UseFloatingOptions } from '@floating-ui/react-dom';
-import { PortalOptions } from '../datePicker/types';
-import { IconTriggerDatePickerText } from './types';
+import { type UseFloatingOptions } from '@floating-ui/react-dom';
+import { type DateRange, type Mode } from 'react-day-picker';
+import { type IconTriggerDatePickerText } from './types';
+import { type IconName, type IconSizes } from '../../../icons/types';
+import { type PortalOptions } from '../datePicker/types';
 interface Props {
     /** Allows you to select a single day, a range of days, or multiple days. */
     mode?: Mode;

package/lib/components/forms/date/iconTriggerDatePicker/IconTriggerDatePicker.stories.d.ts

@@ -1,5 +1,5 @@
-import type { Meta, StoryObj } from '@storybook/react';
 import { IconTriggerDatePicker } from '@/components/forms/date/iconTriggerDatePicker';
+import type { Meta, StoryObj } from '@storybook/react';
 declare const meta: Meta<typeof IconTriggerDatePicker>;
 export default meta;
 type Story = StoryObj<typeof IconTriggerDatePicker>;

package/lib/components/forms/date/inputDatePicker/SingleInputDatePicker.d.ts

@@ -1,6 +1,6 @@
+import { type UseFloatingOptions } from '@floating-ui/react-dom';
+import { type PortalOptions } from '../datePicker/types';
 import type { IconName } from '../../../icons/types';
-import { UseFloatingOptions } from '@floating-ui/react-dom';
-import { PortalOptions } from '../datePicker/types';
 export interface SingleInputDatePickerProps {
     /** A label for assistive technologies. */
     ariaLabel: string;

package/lib/components/forms/date/inputDatePicker/SingleInputDatePicker.stories.d.ts

@@ -1,5 +1,5 @@
-import type { Meta, StoryObj } from '@storybook/react';
 import { SingleInputDatePicker } from './SingleInputDatePicker';
+import type { Meta, StoryObj } from '@storybook/react';
 declare const meta: Meta<typeof SingleInputDatePicker>;
 export default meta;
 type Story = StoryObj<typeof SingleInputDatePicker>;

package/lib/components/forms/date/inputDateRangePicker/InputDateRangePicker.d.ts

@@ -1,8 +1,8 @@
-import { IconName } from '../../../icons/types';
-import { DateRange } from 'react-day-picker';
-import { UseFloatingOptions } from '@floating-ui/react-dom';
-import { PortalOptions } from '../datePicker/types';
-import { InputDateRangePickerText } from './types';
+import { type UseFloatingOptions } from '@floating-ui/react-dom';
+import { type DateRange } from 'react-day-picker';
+import { type InputDateRangePickerText } from './types';
+import { type IconName } from '../../../icons/types';
+import { type PortalOptions } from '../datePicker/types';
 interface InputDateRangePickerProps {
     /** A label for assistive technologies. */
     ariaLabel: string;

package/lib/components/forms/date/inputDateRangePicker/InputDateRangePicker.stories.d.ts

@@ -1,5 +1,5 @@
-import type { Meta, StoryObj } from '@storybook/react';
 import { InputDateRangePicker } from './InputDateRangePicker';
+import type { Meta, StoryObj } from '@storybook/react';
 declare const meta: Meta<typeof InputDateRangePicker>;
 export default meta;
 type Story = StoryObj<typeof InputDateRangePicker>;

package/lib/components/forms/date/inputDateTimePicker/SingleInputDateTimePicker.d.ts

@@ -1,6 +1,6 @@
+import { type UseFloatingOptions } from '@floating-ui/react-dom';
+import { type PortalOptions } from '../datePicker/types';
 import type { IconName } from '../../../icons/types';
-import { UseFloatingOptions } from '@floating-ui/react-dom';
-import { PortalOptions } from '../datePicker/types';
 export interface SingleInputDateTimePickerProps {
     /** A label for assistive technologies. */
     ariaLabel: string;

package/lib/components/forms/date/inputDateTimePicker/SingleInputDateTimePicker.stories.d.ts

@@ -1,5 +1,5 @@
-import type { Meta, StoryObj } from '@storybook/react';
 import { SingleInputDateTimePicker } from './SingleInputDateTimePicker';
+import type { Meta, StoryObj } from '@storybook/react';
 declare const meta: Meta<typeof SingleInputDateTimePicker>;
 export default meta;
 type Story = StoryObj<typeof SingleInputDateTimePicker>;

package/lib/components/forms/form/Form.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type React from 'react';
 export interface FormProps {
     children: React.ReactNode;
     className?: string;

package/lib/components/forms/form/Form.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { Form } from './Form';
 declare const meta: Meta;
 export default meta;

package/lib/components/forms/input/Input.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import { IconName } from '../../../components/icons/types';
-import { LabelProps } from '../subcomponents/Label';
+import { type IconName } from '../../../components/icons/types';
+import { type LabelProps } from '../subcomponents/Label';
 export interface BaseInputProps {
     id?: string;
     value?: string | undefined;

package/lib/components/forms/input/Input.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { Input } from './Input';
 declare const meta: Meta;
 export default meta;

package/lib/components/forms/numberInput/NumberInput.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import { LabelProps } from '../subcomponents/Label';
-import { BaseInputProps } from '../input/Input';
+import { type BaseInputProps } from '../input/Input';
+import { type LabelProps } from '../subcomponents/Label';
 export interface NumberInputProps extends Omit<BaseInputProps, 'value'>, LabelProps {
     /** The value for the input field */
     value?: number | '';

package/lib/components/forms/numberInput/NumberInput.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { NumberInput } from './NumberInput';
 declare const meta: Meta;
 export default meta;

package/lib/components/forms/passwordInput/PasswordInput.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { LabelProps } from '../subcomponents/Label';
+import { type LabelProps } from '../subcomponents/Label';
 export interface PasswordInputProps extends LabelProps {
     ref?: React.LegacyRef<HTMLInputElement>;
     value?: string | undefined;

package/lib/components/forms/passwordInput/PasswordInput.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { PasswordInput } from './PasswordInput';
 declare const meta: Meta;
 export default meta;

package/lib/components/forms/radio/Radio.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { Radio } from './Radio';
 declare const meta: Meta;
 export default meta;

package/lib/components/forms/select/Select.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import { Props as ReactSelectProps } from 'react-select';
-import { SelectOption, SelectText } from './types';
+import { type Props as ReactSelectProps } from 'react-select';
+import { type SelectOption, type SelectText } from './types';
 export interface SelectProps<OptionType extends SelectOption> extends ReactSelectProps<OptionType> {
     /** Options for the select component */
     options: OptionType[];

package/lib/components/forms/select/Select.stories.d.ts

@@ -1,7 +1,7 @@
-import { Meta, StoryObj } from '@storybook/react';
-import { SelectProps } from './Select';
-import { SelectOption } from './types';
-import { LabelProps } from '../subcomponents/Label';
+import { type Meta, type StoryObj } from '@storybook/react';
+import { type SelectProps } from './Select';
+import { type SelectOption } from './types';
+import { type LabelProps } from '../subcomponents/Label';
 declare const meta: Meta<SelectProps<SelectOption> & LabelProps>;
 export default meta;
 type Story = StoryObj<SelectProps<SelectOption>>;

package/lib/components/forms/select/types.d.ts

@@ -1,5 +1,5 @@
-import { ReactNode } from 'react';
-import { FormLabelText } from '../subcomponents/Label';
+import { type ReactNode } from 'react';
+import { type FormLabelText } from '../subcomponents/Label';
 export type SelectOption = {
     label: string;
     value: string;

package/lib/components/forms/subcomponents/Label.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import { FormLabelText } from './types';
+import { type FormLabelText } from './types';
+import type React from 'react';
 export type { FormLabelText } from './types';
 export interface LabelProps {
     label?: string;

package/lib/components/forms/textarea/Textarea.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { LabelProps } from '../subcomponents/Label';
+import { type LabelProps } from '../subcomponents/Label';
 export interface TextareaProps extends LabelProps {
     ref?: React.LegacyRef<HTMLTextAreaElement>;
     placeholder?: string;

package/lib/components/forms/textarea/Textarea.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { Textarea } from './Textarea';
 declare const meta: Meta;
 export default meta;

package/lib/components/forms/timePicker/TimePicker.d.ts

@@ -1,4 +1,4 @@
-import { TimePickerText } from './types';
+import { type TimePickerText } from './types';
 interface TimePickerProps {
     ref?: React.LegacyRef<HTMLInputElement>;
     /** The time value to be displayed in the input field */

package/lib/components/forms/toggle/Toggle.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { Toggle } from './Toggle';
 declare const meta: Meta;
 export default meta;

package/lib/components/grid/col/Col.d.ts

@@ -1,2 +1,2 @@
-import { ColProps } from 'react-grid-system';
+import { type ColProps } from 'react-grid-system';
 export declare const Col: ({ ref: _ref, ...rest }: ColProps) => import("react/jsx-runtime").JSX.Element;

package/lib/components/grid/col/Col.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { Col } from '@/components';
 declare const meta: Meta;
 export default meta;

package/lib/components/grid/container/Container.d.ts

@@ -1,2 +1,2 @@
-import { ContainerProps } from 'react-grid-system';
+import { type ContainerProps } from 'react-grid-system';
 export declare const Container: ({ ref: _ref, ...rest }: ContainerProps) => import("react/jsx-runtime").JSX.Element;

package/lib/components/grid/container/Container.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { Container } from '@/components';
 declare const meta: Meta;
 export default meta;

package/lib/components/grid/row/Row.d.ts

@@ -1,2 +1,2 @@
-import { RowProps } from 'react-grid-system';
+import { type RowProps } from 'react-grid-system';
 export declare const Row: ({ ref: _ref, ...rest }: RowProps) => import("react/jsx-runtime").JSX.Element;

package/lib/components/grid/row/Row.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { Row } from '@/components';
 declare const meta: Meta;
 export default meta;

package/lib/components/icons/Icon.d.ts

@@ -1,2 +1,2 @@
-import { IconProps } from './types';
+import { type IconProps } from './types';
 export declare const Icon: ({ name, size, className, ariaLabel, faPrefix, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element | null;

package/lib/components/icons/Icon.stories.d.ts

@@ -1,5 +1,5 @@
-import { Meta, StoryObj } from '@storybook/react';
-import { IconProps } from './types';
+import { type Meta, type StoryObj } from '@storybook/react';
+import { type IconProps } from './types';
 declare const meta: Meta;
 export default meta;
 type Story = StoryObj<IconProps>;

package/lib/components/icons/indicons.d.ts

@@ -1,4 +1,4 @@
-import { IconDefinition } from '@fortawesome/fontawesome-svg-core';
+import { type IconDefinition } from '@fortawesome/fontawesome-svg-core';
 declare const indicons: {
     'indico-o-white': import("react/jsx-runtime").JSX.Element;
     account: import("react/jsx-runtime").JSX.Element;

package/lib/components/icons/types.d.ts

@@ -1,7 +1,7 @@
-import { MouseEventHandler, CSSProperties } from 'react';
-import { PermafrostComponent } from '../../types';
-import { IconName as FAIconName, IconPrefix } from '@fortawesome/fontawesome-svg-core';
-import { indicons } from './indicons';
+import { type IconName as FAIconName, type IconPrefix } from '@fortawesome/fontawesome-svg-core';
+import { type MouseEventHandler, type CSSProperties } from 'react';
+import { type indicons } from './indicons';
+import { type PermafrostComponent } from '../../types';
 export type IconSizes = 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl';
 export type IndiconName = keyof typeof indicons;
 export type IconName = IndiconName | `fa-${FAIconName}`;

package/lib/components/loading-indicators/BarSpinner/BarSpinner.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { BarSpinner } from './BarSpinner';
 declare const meta: Meta;
 export default meta;

package/lib/components/loading-indicators/CirclePulse/CirclePulse.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { CirclePulse } from './CirclePulse';
 declare const meta: Meta;
 export default meta;

package/lib/components/menu/Menu.stories.d.ts

@@ -1,5 +1,5 @@
-import { Meta, StoryObj } from '@storybook/react';
-import { Menu, MenuProps } from './Menu';
+import { type Meta, type StoryObj } from '@storybook/react';
+import { Menu, type MenuProps } from './Menu';
 declare const meta: Meta<typeof Menu>;
 export default meta;
 type Story = StoryObj<MenuProps>;

package/lib/components/modal/ConfirmationModal.d.ts

@@ -1,2 +1,2 @@
-import { ConfirmationModalProps } from './types';
+import { type ConfirmationModalProps } from './types';
 export declare const ConfirmationModal: ({ className, overlayClassName, testId, isOpen, onRequestClose, portalClassName, appElement, parentSelector, shouldCloseOnOverlayClick, shouldCloseOnEsc, contentElement, overlayElement, footer, children, onConfirmRequest, onCancelRequest, confirmationButtonVariant, icon, title, status, maxWidthInPixels, hasDontShowAgainCheckbox, text: textProp, }: ConfirmationModalProps) => import("react/jsx-runtime").JSX.Element;

package/lib/components/modal/Modal.d.ts

@@ -1,2 +1,2 @@
-import { ModalProps } from './types';
+import { type ModalProps } from './types';
 export declare const Modal: ({ className, children, isOpen, onRequestClose, portalClassName, overlayClassName, appElement, shouldCloseOnOverlayClick, shouldCloseOnEsc, testId, contentElement, overlayElement, position, parentSelector, title, subtitle, footer, maxWidthInPixels, text: textProp, ...rest }: ModalProps) => import("react/jsx-runtime").JSX.Element;

package/lib/components/modal/Modal.stories.d.ts

@@ -1,6 +1,6 @@
-import { Meta, StoryObj } from '@storybook/react';
-import { Modal } from './Modal';
+import { type Meta, type StoryObj } from '@storybook/react';
 import { ConfirmationModal } from './ConfirmationModal';
+import { Modal } from './Modal';
 declare const meta: Meta;
 export default meta;
 type Story = StoryObj<typeof Modal>;

package/lib/components/modal/types.d.ts

@@ -1,5 +1,5 @@
-import { ButtonVariants } from '../button/types';
-import { IconName } from '../icons/types';
+import { type ButtonVariants } from '../button/types';
+import { type IconName } from '../icons/types';
 /** Customizable text for Modal. */
 export interface ModalText {
     /** Aria label for the close button. Default: "Close" */

package/lib/components/pagination/Pagination.d.ts

@@ -1,2 +1,2 @@
-import { PaginationProps } from './types';
+import { type PaginationProps } from './types';
 export declare const Pagination: ({ totalPages, currentPage, onChange, className, text: textProp, ...rest }: PaginationProps) => import("react/jsx-runtime").JSX.Element;