@itcase/ui 1.8.179 → 1.9.0

package/dist/types/components/Response/Response.interface.d.ts

@@ -1,6 +1,6 @@
 import { CSSProperties, ReactNode } from 'react';
 import { AppearanceKeysDefault, BorderColorHoverProps, BorderColorProps, BorderTypeProps, BorderWidthProps, FillHoverProps, FillProps, ShapeProps, SizeProps, TextColorProps, TextSizeProps, TextWeightProps, TitleSizeProps, WidthProps } from '@itcase/types';
-import { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
+import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
 export interface ResponseAppearance {
     [key: number | string | symbol]: any;
     borderColor?: BorderColorProps;

package/dist/types/components/SVGContent/SVGContent.interface.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { SvgFillProps } from '@itcase/types';
-import { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
+import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
 export interface SVGContentProps extends StyleAttributes {
     [key: number | string | symbol]: any;
     children?: ReactNode;

package/dist/types/components/ScrollOnDrag/ScrollOnDrag.interface.d.ts

@@ -1,7 +1,7 @@
 import { CSSProperties, ReactNode } from 'react';
 import { ScrollContainer } from 'react-indiana-drag-scroll';
 import { BorderColorProps, BorderTypeProps, BorderWidthProps, ElevationProps, FillHoverProps, FillProps, HeightProps, WidthProps } from '@itcase/types';
-import { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
+import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
 export interface ScrollOnDragProps extends StyleAttributes {
     [key: number | string | symbol]: any;
     borderColor?: BorderColorProps;

package/dist/types/components/Scrollbar/Scrollbar.interface.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
+import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
 export interface ScrollbarProps extends StyleAttributes {
     children?: ReactNode;
     className?: string;

package/dist/types/components/Search/Search.interface.d.ts

@@ -1,6 +1,6 @@
 import { CSSProperties, ReactNode } from 'react';
 import { AppearanceKeysDefault, BorderColorHoverProps, BorderColorProps, BorderTypeProps, BorderWidthProps, FillProps, IconSizeProps, ItemColorProps, ShapeProps, TextColorProps, TextSizeProps, TextStyleProps, TextWeightProps, WidthProps } from '@itcase/types';
-import { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
+import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
 export interface SearchThemeColor {
     [key: number | string | symbol]: any;
     borderColor?: BorderColorProps;

package/dist/types/components/Segmented/Segmented.interface.d.ts

@@ -1,5 +1,5 @@
 import { AppearanceKeysDefault, BorderColorProps, BorderTypeProps, BorderWidthProps, FillHoverProps, FillProps, ItemColorProps, ShapeProps, TextColorActiveProps, TextColorProps, TextSizeProps, TextWrapProps, WidthProps } from '@itcase/types';
-import { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
+import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
 export interface SegmentedThemeColor {
     [key: number | string | symbol]: any;
     borderType?: BorderTypeProps;

package/dist/types/components/Segmented/stories/__mock__/index.d.ts

@@ -10,30 +10,15 @@ declare const segmentedMock: {
     }[];
 };
 declare const segmentedLabelMock: {
-    label: string;
-    value: number;
+    label: any;
+    value: any;
 }[];
 declare const segmentedIconMock: {
-    iconBefore: string | undefined;
+    iconBefore: any;
 }[];
 declare const segmentedMockSize: {
-    14: {
-        iconAfter: string;
-        iconBefore: string;
-        label: string;
-        value: number;
-    }[];
-    16: {
-        iconAfter: string;
-        iconBefore: string;
-        label: string;
-        value: number;
-    }[];
-    20: {
-        iconAfter: string;
-        iconBefore: string;
-        label: string;
-        value: number;
-    }[];
+    14: any[];
+    16: any[];
+    20: any[];
 };
 export { segmentedMock, segmentedLabelMock, segmentedMockSize, segmentedIconMock, };

package/dist/types/components/Swiper/Swiper.interface.d.ts

@@ -2,7 +2,7 @@ import { CSSProperties, ReactNode, type Ref } from 'react';
 import { SwiperClass, type SwiperRef } from 'swiper/react';
 import { SwiperModule, SwiperOptions } from 'swiper/types';
 import { AlignDirectionProps, AlignProps, FillProps, ShapeProps, TextColorProps, TextWeightProps, TitleSizeProps } from '@itcase/types';
-import { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
+import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
 export interface SwiperProps extends StyleAttributes {
     id?: string;
     [key: number | string | symbol]: any;

package/dist/types/components/Switch/Switch.interface.d.ts

@@ -1,5 +1,5 @@
 import { AppearanceKeysDefault } from '@itcase/types';
-import { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
+import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
 export interface SwitchThemeColor {
     size?: string;
     set?: string;

package/dist/types/components/Tab/Tab.interface.d.ts

@@ -1,6 +1,6 @@
 import type { CSSProperties, ReactNode } from 'react';
 import { AlignDirectionProps, AlignProps, AppearanceKeysDefault, BorderColorProps, BorderTypeProps, BorderWidthProps, DirectionProps, FillHoverProps, FillProps, JustifyContentProps, ShapeProps, SizeProps, TextAlignProps, TextColorActiveProps, TextColorHoverProps, TextColorProps, TextGradientProps, TextSizeProps, TextStyleProps, TextWeightProps, TextWrapProps, WidthProps, WrapProps } from '@itcase/types';
-import type { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
+import type { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
 interface TabThemeColor {
     [key: number | string | symbol]: any;
     align?: AlignProps;

package/dist/types/components/Text/Text.interface.d.ts

@@ -1,6 +1,6 @@
 import { CSSProperties, ReactNode } from 'react';
 import { AppearanceKeysDefault, AppearanceShapeKey, AppearanceSizeKey, AppearanceStyleKey, CompositeAppearanceSizePxKey, TextAlignProps, TextColorActiveHoverProps, TextColorActiveProps, TextColorHoverProps, TextColorProps, TextSizeProps, TextTagProps, TextWeightProps, TextWrapProps } from '@itcase/types';
-import { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
+import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
 type TextAppearanceProps = {
     cursor?: string;
     size?: TextSizeProps;

package/dist/types/components/Textarea/Textarea.interface.d.ts

@@ -1,5 +1,5 @@
 import { AppearanceKeysDefault, BorderColorHoverProps, BorderColorProps, FillProps, ItemColorProps, ShapeProps, SizeProps, TextColorProps, TextSizeProps, TextWeightProps, WidthProps } from '@itcase/types';
-import { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
+import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
 export interface TextareaThemeColor {
     [key: number | string | symbol]: any;
     borderColor?: BorderColorProps;

package/dist/types/components/Tile/Tile.interface.d.ts

@@ -1,6 +1,6 @@
 import { CSSProperties, ReactNode } from 'react';
 import { AlignProps, AppearanceKeysDefault, AppearanceShapeKey, AppearanceSizeKey, AppearanceStyleKey, BorderColorHoverProps, BorderColorProps, BorderTypeProps, BorderWidthProps, CompositeAppearanceKey, DirectionProps, FillActiveHoverProps, FillActiveProps, FillHoverProps, FillProps, FillSizeProps, IconSizeProps, ItemFillProps, ShapeProps, ShapeStrengthProps, SizeProps, TextAlignProps, TextColorProps, TextSizeProps, TextWeightProps, TextWrapProps, TitleSizeProps } from '@itcase/types';
-import { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
+import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
 type TileAppearanceProps = {
     badgeAppearanceSize?: AppearanceSizeKey;
     badgeShape?: ShapeProps;

package/dist/types/components/Title/Title.interface.d.ts

@@ -1,6 +1,6 @@
 import { CSSProperties, ReactNode } from 'react';
 import { AppearanceKeysDefault, AppearanceShapeKey, AppearanceStyleKey, AppearanceTitleSizeKey, CompositeAppearanceTitleKey, DirectionHVProps, FillHoverProps, FillProps, SvgFillHoverProps, SvgFillProps, TextAlignProps, TextColorActiveHoverProps, TextColorActiveProps, TextColorHoverProps, TextColorProps, TextSizeProps, TextTagProps, TextWeightProps, TextWrapProps, TitleSizeProps } from '@itcase/types';
-import { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
+import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
 import { IconProps } from '../Icon/Icon.interface';
 type TitleAppearanceProps = {
     direction?: string;

package/dist/types/components/Tooltip/Tooltip.interface.d.ts

@@ -1,6 +1,6 @@
 import { CSSProperties, ReactNode } from 'react';
 import { AppearanceShapeKey, AppearanceSizeKey, AppearanceStateKeysDefault, AppearanceStyleKey, BorderColorProps, BorderTypeProps, BorderWidthProps, CompositeAppearanceStateKeys, ElevationProps, FillHoverProps, FillProps, ShapeProps, ShapeStrengthProps, SizeProps, WrapProps } from '@itcase/types';
-import { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
+import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
 import { TextProps } from '../Text/Text.interface';
 import { TitleProps } from '../Title/Title.interface';
 type TooltipAppearanceProps = {

package/dist/types/components/Video/Video.interface.d.ts

@@ -1,5 +1,5 @@
 import { CSSProperties, ReactNode } from 'react';
-import { StyleAttributes } from 'src/hooks/useStyles/styleAttributes.interface';
+import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
 type Codecs = 'mp4' | 'ogv' | 'webm';
 export interface VideoProps extends StyleAttributes {
     id?: string;

package/dist/types/hoc/urlWithAssetPrefix.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { ComponentType, ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from 'react';
-import { RequireAtLeastOneProp, RequireAtLeastOnePropError } from 'src/types';
+import { RequireAtLeastOneProp, RequireAtLeastOnePropError } from '../types';
 type UrlPropKeys = (typeof urlPropsList)[number];
 type OnePropCheckError = [
     'urlWithAssetPrefix: компонент должен содержать хотя бы один из пропсов',

package/dist/types/hooks/index.helpers.d.ts

@@ -1,3 +1,3 @@
-import { StyleAttributeOrValidator } from 'src/hooks/useStyles/styleAttributes.interface';
-declare const getStyleAttributeKey: (targetStyleAttribute: StyleAttributeOrValidator) => "fixed" | "hug" | "fill" | import("src/hooks/useStyles/styleAttributes.interface").StyleAttributes | import("csstype").Property.Width<0 | (string & {})> | undefined;
+import { StyleAttributeOrValidator } from '../../hooks/useStyles/styleAttributes.interface';
+declare const getStyleAttributeKey: (targetStyleAttribute: StyleAttributeOrValidator) => any;
 export { getStyleAttributeKey };

package/dist/types/hooks/useDevicePropsGenerator/useDevicePropsGenerator.d.ts

@@ -1,4 +1,4 @@
-import { KebabCase, WithClassKeys } from 'src/types';
+import { KebabCase, WithClassKeys } from '../../types';
 import type { AppearanceConfig, ComponentProps, GeneratorGetClassParams as GP } from './useDevicePropsGenerator.interface';
 declare function useDevicePropsGenerator<Props extends ComponentProps>(componentProps: Props, appearanceConfig?: AppearanceConfig): Props & {
     getProp(propKey: string): number | string | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.8.179",
+  "version": "1.9.0",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",
@@ -72,9 +72,9 @@
   "scripts": {
     "build": "npm run build-js && npm run build-css",
     "build-js": "rm -rf dist && NODE_ENV=production rollup -c",
-    "build-css": "rm -rf dist/css && postcss 'src/components/**/!(css)/!(*.tokens.css)*.css' 'src/styles/!(.css)/**/*.css' 'src/mediaqueries/*.css' 'src/mixins/*.css' 'src/tokens/*.css' 'src/styles/bundles.css' --base src --dir dist/css/ --env production",
+    "build-css": "rm -rf dist/css && postcss 'src/styles/bundles.css' --base src --dir dist/css/ --env production",
     "dev-js": "rollup -c -w",
-    "dev-css": "postcss 'src/components/**/!(css)/!(*.tokens.css)*.css' 'src/styles/!(.css)/**/*.css' 'src/mediaqueries/*.css' 'src/mixins/*.css' 'src/tokens/*.css' 'src/styles/bundles.css' --base src --dir dist/css/ --env production -w --verbose",
+    "dev-css": "postcss 'src/styles/bundles.css' --base src --dir dist/css/ --env production -w --verbose",
     "prepare": "husky",
     "prepack": "npm run build",
     "semantic-release": "semantic-release",
@@ -151,8 +151,8 @@
     "@rollup/plugin-terser": "^0.4.4",
     "@rollup/plugin-typescript": "^12.3.0",
     "@semantic-release/changelog": "^6.0.3",
-    "@semantic-release/git": "^10.0.1",
     "@semantic-release/release-notes-generator": "14.1.0",
+    "@semantic-release/git": "^10.0.1",
     "@types/js-cookie": "^3.0.6",
     "@types/lodash": "^4.17.20",
     "@types/luxon": "^3.7.1",
@@ -163,14 +163,11 @@
     "@types/uuid": "^11.0.0",
     "babel-loader": "^10.0.0",
     "babel-plugin-inline-react-svg": "^2.0.2",
-    "babel-plugin-react-docgen": "^4.2.1",
-    "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
     "conventional-changelog-conventionalcommits": "^9.1.0",
     "eslint": "9.39.1",
     "husky": "^9.1.7",
     "lint-staged": "^16.2.6",
     "prettier": "^3.6.2",
-    "react-docgen-typescript": "^2.4.0",
     "rollup": "^4.52.5",
     "rollup-plugin-copy": "^3.5.0",
     "rollup-plugin-dts": "^6.2.3",

package/dist/css/components/Accordion/Accordion.css

@@ -1,197 +0,0 @@
-.accordion {
-  width: 100%;
-}
-.accordion {
-  &_direction {
-    &_horizontal {
-      ^^&__wrapper {
-        display: flex;
-        flex-direction: row;
-      }
-    }
-    &_vertical {
-      ^^&__wrapper {
-        display: flex;
-        flex-direction: column;
-      }
-    }
-      &_row {
-        ^^&__wrapper {
-          display: flex;
-          flex-direction: row;
-        }
-      }
-      &_row-reverse {
-        ^^&__wrapper {
-          display: flex;
-          flex-direction: row-reverse;
-        }
-      }
-      &_column {
-        ^^&__wrapper {
-          display: flex;
-          flex-direction: column;
-        }
-      }
-      &_column-reverse {
-        ^^&__wrapper {
-          display: flex;
-          flex-direction: column-reverse;
-        }
-      }
-  }
-}
-.accordion-item {
-  width: 100%;
-  display: flex;
-  flex-flow: row wrap;
-  align-items: center;
-  &__header {
-    width: 100%;
-    display: flex;
-    align-items: center;
-    ^&__title {
-      position: relative;
-    }
-  }
-  &__action {
-    display: flex;
-    gap: 12px;
-    ^&__badge {
-      position: relative;
-    }
-    ^&__icon {
-      align-self: flex-start;
-      transform-origin: 50% 50%;
-      transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
-    }
-  }
-  &__content {
-    width: 100%;
-  }
-}
-.accordion-item {
-  &_size {
-      &_xxl {
-        ^^&__header {
-          padding: var(--accordion-item-header-xxl-padding);
-          gap: var(--accordion-item-header-xxl-gap);
-        }
-        ^^&__content {
-          &-inner {
-            padding: var(--accordion-item-content-xxl-padding);
-          }
-        }
-      }
-      &_xl {
-        ^^&__header {
-          padding: var(--accordion-item-header-xl-padding);
-          gap: var(--accordion-item-header-xl-gap);
-        }
-        ^^&__content {
-          &-inner {
-            padding: var(--accordion-item-content-xl-padding);
-          }
-        }
-      }
-      &_l {
-        ^^&__header {
-          padding: var(--accordion-item-header-l-padding);
-          gap: var(--accordion-item-header-l-gap);
-        }
-        ^^&__content {
-          &-inner {
-            padding: var(--accordion-item-content-l-padding);
-          }
-        }
-      }
-      &_m {
-        ^^&__header {
-          padding: var(--accordion-item-header-m-padding);
-          gap: var(--accordion-item-header-m-gap);
-        }
-        ^^&__content {
-          &-inner {
-            padding: var(--accordion-item-content-m-padding);
-          }
-        }
-      }
-      &_s {
-        ^^&__header {
-          padding: var(--accordion-item-header-s-padding);
-          gap: var(--accordion-item-header-s-gap);
-        }
-        ^^&__content {
-          &-inner {
-            padding: var(--accordion-item-content-s-padding);
-          }
-        }
-      }
-      &_xs {
-        ^^&__header {
-          padding: var(--accordion-item-header-xs-padding);
-          gap: var(--accordion-item-header-xs-gap);
-        }
-        ^^&__content {
-          &-inner {
-            padding: var(--accordion-item-content-xs-padding);
-          }
-        }
-      }
-      &_xxs {
-        ^^&__header {
-          padding: var(--accordion-item-header-xxs-padding);
-          gap: var(--accordion-item-header-xxs-gap);
-        }
-        ^^&__content {
-          &-inner {
-            padding: var(--accordion-item-content-xxs-padding);
-          }
-        }
-      }
-  }
-}
-.accordion-item {
-  &&_state_open {
-    ^&__icon {
-      transform: rotate(180deg);
-    }
-  }
-}
-.accordion-item {
-  &&_zero-padding {
-    ^&__header {
-      padding: 0;
-    }
-  }
-  &&_zero-gap {
-    ^&__wrapper {
-      padding: 0;
-    }
-  }
-}
-:root {
-  --accordion-item-header-xxl-padding: 14px 12px;
-  --accordion-item-header-xl-padding: 14px 12px;
-  --accordion-item-header-l-padding: 14px 12px;
-  --accordion-item-header-m-padding: 12px;
-  --accordion-item-header-s-padding: 12px;
-  --accordion-item-header-xs-padding: 10px 8px;
-  --accordion-item-header-xxs-padding: 12px;
-
-  --accordion-item-header-xxl-gap: 8px;
-  --accordion-item-header-xl-gap: 8px;
-  --accordion-item-header-l-gap: 8px;
-  --accordion-item-header-m-gap: 8px;
-  --accordion-item-header-s-gap: 8px;
-  --accordion-item-header-xs-gap: 8px;
-  --accordion-item-header-xxs-gap: 8px;
-
-  --accordion-item-content-xxl-padding: 14px 12px;
-  --accordion-item-content-xl-padding: 14px 12px;
-  --accordion-item-content-l-padding: 14px 12px;
-  --accordion-item-content-m-padding: 12px;
-  --accordion-item-content-s-padding: 12px;
-  --accordion-item-content-xs-padding: 10px 8px;
-  --accordion-item-content-xxs-padding: 12px;
-}