@itcase/ui 1.2.29 → 1.2.31

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

@@ -1,10 +1,8 @@
 import { ReactNode } from 'react';
 import { iStyleAttributes } from '../../hooks/styleAttributes.interface';
-import { tFillProps, iconSizePropsType, tTextColorHoverProps, tTextColorProps, tTextSizeProps } from '../../types';
-export interface ISiteMenuProps extends iStyleAttributes {
-    children?: ReactNode;
-    className?: string;
-    closeText?: string;
+import { iconSizePropsType, tFillProps, tTextColorHoverProps, tTextColorProps, tTextSizeProps } from '../../types';
+import { tAppearanceKeysDefault } from '../../types/componentProps/appearanceKeys';
+export interface ISiteMenuThemeColor {
     closeTextColor?: tTextColorProps;
     closeTextColorHover?: tTextColorHoverProps;
     closeTextSize?: tTextSizeProps;
@@ -13,6 +11,20 @@ export interface ISiteMenuProps extends iStyleAttributes {
     iconCloseBgFill?: tFillProps;
     iconCloseFill?: tFillProps;
     iconCloseSize?: iconSizePropsType;
+}
+type appearanceKeysType = {} & tAppearanceKeysDefault;
+export type siteMenuAppearanceType = {
+    [key in appearanceKeysType]?: ISiteMenuThemeColor;
+};
+export interface iSiteMenuConfig {
+    appearance: siteMenuAppearanceType | undefined;
+    setAppearance: (newComponent: siteMenuAppearanceType) => void;
+}
+export interface ISiteMenuProps extends ISiteMenuThemeColor, iStyleAttributes {
+    appearance?: appearanceKeysType;
+    children?: ReactNode;
+    className?: string;
+    closeText?: string;
     onClose?: () => void;
 }
 export interface ISiteMenuButtonProps extends iStyleAttributes {
@@ -21,3 +33,4 @@ export interface ISiteMenuButtonProps extends iStyleAttributes {
     text?: string;
     onClick?: () => void;
 }
+export {};

package/dist/types/components/SiteMenu/index.d.ts

@@ -1,3 +1,3 @@
-import { SiteMenu } from './SiteMenu.js';
+import { SiteMenu, siteMenuConfig } from './SiteMenu.js';
 import { SiteMenuButton } from './SiteMenuButton.js';
-export { SiteMenu, SiteMenuButton };
+export { SiteMenu, siteMenuConfig, SiteMenuButton };

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

@@ -2,7 +2,6 @@ import { ISwiperProps } from './Swiper.interface';
 declare function Swiper(props: ISwiperProps): import("react/jsx-runtime").JSX.Element;
 declare namespace Swiper {
     var defaultProps: {
-        activeSlideIndex: number;
         disabledButtonClass: string;
     };
 }

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

@@ -1,4 +1,5 @@
 import React from 'react';
-import { ISwitchProps } from './Switch.interface';
+import { iSwitchConfig, ISwitchProps } from './Switch.interface';
+declare const switchConfig: iSwitchConfig;
 declare const Switch: React.ForwardRefExoticComponent<ISwitchProps & React.RefAttributes<HTMLDivElement>>;
-export { Switch };
+export { Switch, switchConfig };

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

@@ -1,10 +1,23 @@
 import { iStyleAttributes } from '../../hooks/styleAttributes.interface';
-export interface ISwitchProps extends iStyleAttributes {
+import { tAppearanceKeysDefault } from '../../types/componentProps/appearanceKeys';
+export interface iSwitchThemeColor {
+    size?: string;
+    set?: string;
+}
+type appearanceKeysType = {} & tAppearanceKeysDefault;
+export type switchAppearanceType = {
+    [key in appearanceKeysType]?: iSwitchThemeColor;
+};
+export interface iSwitchConfig {
+    appearance: switchAppearanceType | undefined;
+    setAppearance: (newComponent: switchAppearanceType) => void;
+}
+export interface ISwitchProps extends iSwitchThemeColor, iStyleAttributes {
+    id?: string;
+    appearance?: appearanceKeysType;
     checked?: boolean;
     className?: string;
     disabled?: boolean;
-    id?: string;
-    set?: string;
-    size?: string;
     onChange?: () => void;
 }
+export {};

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

@@ -1 +1 @@
-export { Switch } from './Switch';
+export { Switch, switchConfig } from './Switch';

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

@@ -1,9 +1,4 @@
 import type { iTextConfig, iTextProps } from './Text.interface';
 declare const textConfig: iTextConfig;
 declare function Text(props: iTextProps): import("react/jsx-runtime").JSX.Element;
-declare namespace Text {
-    var defaultProps: {
-        tag: string;
-    };
-}
 export { Text, textConfig };

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

@@ -8,6 +8,7 @@ interface iTextThemeColor {
     textColorActive?: tTextColorActiveProps;
     textColorGradient?: tTextGradientProps;
     textColorHover?: tTextColorHoverProps;
+    width?: tWidthProps;
 }
 export type tAppearance = {
     [key in tAppearanceKeysDefault]: iTextThemeColor;
@@ -47,7 +48,6 @@ interface iTextProps extends iTextThemeColor, iStyleAttributes {
     textWeightTablet?: tTextWeightProps;
     textWrap?: tTextWrapProps;
     type?: typePropsType;
-    width?: tWidthProps;
     onClick?: () => void;
     onDoubleClick?: () => void;
 }

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

@@ -1,4 +1,5 @@
-import { ITileProps } from './Tile.interface';
+import { iTileConfig, ITileProps } from './Tile.interface';
+declare const tileConfig: iTileConfig;
 declare function Tile(props: ITileProps): import("react/jsx-runtime").JSX.Element;
 declare namespace Tile {
     var defaultProps: {
@@ -6,4 +7,4 @@ declare namespace Tile {
         textTag: string;
     };
 }
-export { Tile };
+export { Tile, tileConfig };

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

@@ -1,39 +1,51 @@
 import { CSSProperties, ReactNode } from 'react';
-import { tAppearanceKeysDefault } from 'types/componentProps/appearanceKeys';
 import { iStyleAttributes } from '../../hooks/styleAttributes.interface';
 import { borderColorHoverPropsType, borderTypePropsType, tAlignDirectionProps, tAlignProps, tBorderColorProps, tBorderWidthProps, tDirectionProps, tFillProps, titleSizePropsType, tShapeProps, tSizeProps, tTextAlignProps, tTextColorProps, tTextSizeProps, tTextWeightProps, tTextWrapProps } from '../../types';
-export interface ITileProps extends iStyleAttributes {
+import { tAppearanceKeysDefault } from '../../types/componentProps/appearanceKeys';
+export interface ITileThemeColor {
+    borderColor?: tBorderColorProps;
+    fill?: tFillProps;
+    shape?: tShapeProps;
+    textColor?: tTextColorProps;
+    textSize?: tTextSizeProps;
+    titleTextColor?: tTextColorProps;
+    titleTextSize?: titleSizePropsType;
+}
+type appearanceKeysType = {} & tAppearanceKeysDefault;
+export type tileAppearanceType = {
+    [key in appearanceKeysType]?: ITileThemeColor;
+};
+export interface iTileConfig {
+    appearance: tileAppearanceType | undefined;
+    setAppearance: (newComponent: tileAppearanceType) => void;
+}
+export interface ITileProps extends ITileThemeColor, iStyleAttributes {
     after?: ReactNode;
     align?: tAlignProps;
     alignDirection?: tAlignDirectionProps;
+    appearance?: appearanceKeysType;
     badge?: string;
     badgeAppearance?: tAppearanceKeysDefault;
     badgeSize?: tSizeProps;
     badgeTextColor?: tTextColorProps;
     badgeTextSize?: tTextSizeProps;
     before?: ReactNode;
-    borderColor?: tBorderColorProps;
     borderColorHover?: borderColorHoverPropsType;
     borderType?: borderTypePropsType;
     borderWidth?: tBorderWidthProps;
     children?: ReactNode;
     className?: string;
     direction?: tDirectionProps;
-    fill?: tFillProps;
     reverse?: boolean;
-    shape?: tShapeProps;
     size?: string;
     style?: CSSProperties;
     text?: string;
-    textColor?: tTextColorProps;
-    textSize?: tTextSizeProps;
     textWrap?: tTextWrapProps;
     title?: string;
     titleTextAlign?: tTextAlignProps;
-    titleTextColor?: tTextColorProps;
-    titleTextSize?: titleSizePropsType;
     titleTextWeight?: tTextWeightProps;
     titleTextWrap?: tTextWrapProps;
     type?: string;
     onClick?: () => void;
 }
+export {};

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

@@ -1 +1 @@
-export { Tile } from './Tile';
+export { Tile, tileConfig } from './Tile';

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

@@ -1,9 +1,4 @@
 import { ITitleConfig, ITitleProps } from './Title.interface';
 declare const titleConfig: ITitleConfig;
 declare function Title(props: ITitleProps): import("react/jsx-runtime").JSX.Element;
-declare namespace Title {
-    var defaultProps: {
-        size: string;
-    };
-}
 export { Title, titleConfig };

package/dist/types/components/Wrapper/Wrapper.d.ts

@@ -1,9 +1,3 @@
 import { IWrapperProps } from './Wrapper.interface';
 declare function Wrapper(props: IWrapperProps): import("react/jsx-runtime").JSX.Element;
-declare namespace Wrapper {
-    var defaultProps: {
-        className: string;
-        tag: string;
-    };
-}
 export { Wrapper };

package/dist/types/context/Notifications.d.ts

@@ -1,13 +1,6 @@
-import PropTypes from 'prop-types';
 import type { tId } from '@itcase/common';
 import type { iCreatedNotification, iNotificationsProviderProps } from './Notifications.interface';
 declare function NotificationsProvider(props: iNotificationsProviderProps): import("react/jsx-runtime").JSX.Element;
-declare namespace NotificationsProvider {
-    var propTypes: {
-        children: PropTypes.Requireable<any>;
-        initialNotificationsList: PropTypes.Requireable<any[]>;
-    };
-}
 declare function useNotifications(): never[];
 declare function useNotificationsAPI(): {
     hideNotifications: (targetId: tId) => void;

package/dist/types/context/UIContext.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { ReactNode } from 'react';
 declare function useUserDeviceContext(): {
     isMobile: boolean;
     isTablet: boolean;
@@ -8,5 +8,13 @@ declare function useSiteMenuContext(): {
     isSiteMenuOpen: boolean;
     setIsSiteMenuOpen: () => void;
 };
-declare const UIProvider: React.NamedExoticComponent<object>;
+declare const UIProvider: React.NamedExoticComponent<iUIProvider>;
+interface iUIProvider {
+    children?: ReactNode;
+    userDeviceState?: {
+        isDesktop?: boolean;
+        isMobile?: boolean;
+        isTablet?: boolean;
+    };
+}
 export { UIProvider, useUserDeviceContext, useSiteMenuContext };

package/dist/types/icons/index.d.ts

@@ -3,8 +3,8 @@ export namespace icon16 {
     export { ChevronTop16 as ChevronTop };
 }
 export namespace icon24 {
+    export { DoubleArrowLeft24 as doubleArrowLeft };
+    export { DoubleArrowRight24 as doubleArrowRight };
     export { Facebook24 as facebook };
     export { Instagram24 as instagram };
-    export { DoubleArrowRight24 as doubleArrowRight };
-    export { DoubleArrowLeft24 as doubleArrowLeft };
 }

package/dist/types/types/componentProps/appearanceKeys.d.ts

@@ -1 +1 @@
-export type tAppearanceKeysDefault = 'accent' | 'accentSecondary' | 'any' | 'default' | 'dev' | 'disabled' | 'error' | 'fail' | 'gradientPrimary' | 'l' | 'm' | 'primary' | 's' | 'secondary' | 'success' | 'surface' | 'surfaceDisabled' | 'surfacePrimary' | 'surfaceQuaternary' | 'surfaceSecondary' | 'surfaceTertiary' | 'warning' | 'xl' | 'xs';
+export type tAppearanceKeysDefault = 'accent' | 'accentSecondary' | 'any' | 'cantLoadData' | 'custom' | 'default' | 'dev' | 'disabled' | 'error' | 'fail' | 'gradientPrimary' | 'l' | 'm' | 'primary' | 'refresh' | 's' | 'search' | 'secondary' | 'success' | 'surface' | 'surfaceDisabled' | 'surfacePrimary' | 'surfaceQuaternary' | 'surfaceSecondary' | 'surfaceTertiary' | 'warning' | 'xl' | 'xs';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.2.29",
+  "version": "1.2.31",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",
@@ -73,16 +73,15 @@
   "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)/*.css' 'src/styles/!(.css)/**/*.css' 'src/styles/mediaqueries.css' 'src/mixins/*.css' 'src/tokens/*.css' --base src --dir dist/css/ --env production",
+    "build-css": "rm -rf dist/css && postcss 'src/components/**/!(css)/*.css' 'src/styles/!(.css)/**/*.css' 'src/mediaqueries/*.css' 'src/mixins/*.css' 'src/tokens/*.css' --base src --dir dist/css/ --env production",
     "dev-js": "rollup -c -w",
-    "dev-css": "postcss 'src/components/**/!(css)/*.css' 'src/styles/!(.css)/**/*.css' 'src/styles/mediaqueries.css' 'src/mixins/*.css' 'src/tokens/*.css' --base src --dir dist/css/ --env production -w --verbose",
+    "dev-css": "postcss 'src/components/**/!(css)/*.css' 'src/styles/!(.css)/**/*.css' 'src/mediaqueries/*.css' 'src/mixins/*.css' 'src/tokens/*.css' --base src --dir dist/css/ --env production -w --verbose",
     "prepare": "husky",
     "prepack": "npm run build",
     "semantic-release": "semantic-release",
     "typecheck": "tsc --noEmit",
     "storybook": "storybook dev -p 6006",
-    "build-storybook": "storybook build",
-    "test-storybook": "test-storybook -c .storybook --watch"
+    "build-storybook": "storybook build"
   },
   "files": [
     "dist",
@@ -97,12 +96,12 @@
     "registry": "https://registry.npmjs.org/"
   },
   "dependencies": {
-    "@itcase/common": "^1.2.15",
+    "@itcase/common": "^1.2.16",
     "clsx": "^2.1.1",
+    "date-fns": "^4.1.0",
+    "framer-motion": "^11.11.17",
     "js-cookie": "^3.0.5",
     "lodash": "^4.17.21",
-    "luxon": "^3.5.0",
-    "prop-types": "^15.8.1",
     "rc-slider": "^11.1.7",
     "react": "^18.3.1",
     "react-dadata": "^2.23.3",
@@ -111,6 +110,7 @@
     "react-dom": "^18.3.1",
     "react-indiana-drag-scroll": "^3.0.3-alpha",
     "react-inlinesvg": "^4.1.5",
+    "react-modal-sheet": "^3.3.0",
     "react-modern-drawer": "^1.4.0",
     "react-otp-input": "^3.1.1",
     "react-paginate": "^8.2.0",
@@ -118,7 +118,7 @@
     "react-scroll": "^1.9.0",
     "react-scrollbars-custom": "^4.1.1",
     "react-select": "^5.8.3",
-    "swiper": "^11.1.14",
+    "swiper": "^11.1.15",
     "uuid": "^11.0.3"
   },
   "devDependencies": {
@@ -128,9 +128,9 @@
     "@babel/preset-env": "^7.26.0",
     "@babel/preset-react": "^7.25.9",
     "@chromatic-com/storybook": "^3.2.2",
-    "@commitlint/cli": "^19.5.0",
-    "@commitlint/config-conventional": "^19.5.0",
-    "@itcase/lint": "^1.0.16",
+    "@commitlint/cli": "^19.6.0",
+    "@commitlint/config-conventional": "^19.6.0",
+    "@itcase/lint": "^1.0.19",
     "@lehoczky/postcss-fluid": "^1.0.3",
     "@rollup/plugin-babel": "^6.0.4",
     "@rollup/plugin-commonjs": "^28.0.1",
@@ -141,17 +141,17 @@
     "@semantic-release/changelog": "^6.0.3",
     "@semantic-release/git": "^10.0.1",
     "@semantic-release/release-notes-generator": "14.0.1",
-    "@storybook/addon-essentials": "^8.4.4",
-    "@storybook/addon-interactions": "^8.4.4",
-    "@storybook/addon-links": "^8.4.4",
-    "@storybook/addon-onboarding": "^8.4.4",
+    "@storybook/addon-essentials": "^8.4.5",
+    "@storybook/addon-interactions": "^8.4.5",
+    "@storybook/addon-links": "^8.4.5",
+    "@storybook/addon-onboarding": "^8.4.5",
     "@storybook/addon-styling-webpack": "^1.0.1",
-    "@storybook/addon-themes": "^8.4.4",
+    "@storybook/addon-themes": "^8.4.5",
     "@storybook/addon-webpack5-compiler-swc": "^1.0.5",
-    "@storybook/blocks": "^8.4.4",
-    "@storybook/react": "^8.4.4",
-    "@storybook/react-webpack5": "^8.4.4",
-    "@storybook/test": "^8.4.4",
+    "@storybook/blocks": "^8.4.5",
+    "@storybook/react": "^8.4.5",
+    "@storybook/react-webpack5": "^8.4.5",
+    "@storybook/test": "^8.4.5",
     "@types/js-cookie": "^3.0.6",
     "@types/lodash": "^4.17.13",
     "@types/react": "^18",
@@ -162,13 +162,11 @@
     "babel-loader": "^9.2.1",
     "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": "^8.0.0",
     "eslint": "9.15.0",
-    "eslint-plugin-storybook": "^0.11.0",
-    "husky": "^9.1.6",
+    "husky": "^9.1.7",
     "lint-staged": "^15.2.10",
-    "npm": "^10.9.0",
+    "npm": "^10.9.1",
     "postcss": "^8.4.49",
     "postcss-aspect-ratio-polyfill": "^2.0.0",
     "postcss-cli": "^11.0.0",
@@ -190,16 +188,15 @@
     "postcss-preset-env": "^10.1.1",
     "postcss-pxtorem": "^6.1.0",
     "postcss-sort-media-queries": "^5.2.0",
-    "prettier": "^3.3.3",
-    "rollup": "^4.27.2",
+    "prettier": "^3.4.0",
+    "rollup": "^4.27.4",
     "rollup-plugin-copy": "^3.5.0",
     "rollup-plugin-dts": "^6.1.1",
     "rollup-plugin-peer-deps-external": "^2.2.4",
-    "rollup-preserve-directives": "^1.1.2",
+    "rollup-preserve-directives": "^1.1.3",
     "semantic-release": "^24.2.0",
-    "storybook": "^8.4.4",
+    "storybook": "^8.4.5",
     "stylelint": "^16.10.0",
-    "typescript": "^5.6.3"
-  },
-  "packageManager": "pnpm@8.6.2+sha1.343879a68ea9ba1427ee1392072c8ad68537c534"
+    "typescript": "^5.7.2"
+  }
 }

package/dist/Divider-BjB5MD6u.js

@@ -1,50 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var clsx = require('clsx');
-var useDeviceTargetClass = require('./cjs/hooks/useDeviceTargetClass.js');
-var useStyles = require('./cjs/hooks/useStyles.js');
-
-function Divider(props) {
-    var className = props.className;
-    var directionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-        prefix: 'divider_direction_',
-        propsKey: 'direction',
-    });
-    var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-        prefix: 'fill_',
-        propsKey: 'fill',
-    });
-    var fillHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-        prefix: 'fill_hover_',
-        propsKey: 'fillHover',
-    });
-    var fillActiveClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-        prefix: 'fill_active_',
-        propsKey: 'fillActive',
-    });
-    var fillActiveHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-        prefix: 'fill_active_hover_',
-        propsKey: 'fillActiveHover',
-    });
-    var fillDisabledClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-        prefix: 'fill_disabled_',
-        propsKey: 'fillDisabled',
-    });
-    var sizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-        prefix: 'divider_size_',
-        propsKey: 'size',
-    });
-    var widthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-        prefix: 'width_',
-        propsKey: 'width',
-    });
-    // @ts-expect-error
-    var hrStyles = useStyles.useStyles(props).styles;
-    return (jsxRuntime.jsx("hr", { className: clsx(className, 'divider', widthClass, directionClass, sizeClass, fillClass, fillHoverClass, fillActiveClass, fillActiveHoverClass, fillDisabledClass), style: hrStyles }));
-}
-Divider.defaultProps = {
-    size: 'xs',
-};
-
-exports.Divider = Divider;

package/dist/Divider-U5UdY-ef.js

@@ -1,48 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import clsx from 'clsx';
-import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
-import { useStyles } from './hooks/useStyles.js';
-
-function Divider(props) {
-    var className = props.className;
-    var directionClass = useDeviceTargetClass(props, {
-        prefix: 'divider_direction_',
-        propsKey: 'direction',
-    });
-    var fillClass = useDeviceTargetClass(props, {
-        prefix: 'fill_',
-        propsKey: 'fill',
-    });
-    var fillHoverClass = useDeviceTargetClass(props, {
-        prefix: 'fill_hover_',
-        propsKey: 'fillHover',
-    });
-    var fillActiveClass = useDeviceTargetClass(props, {
-        prefix: 'fill_active_',
-        propsKey: 'fillActive',
-    });
-    var fillActiveHoverClass = useDeviceTargetClass(props, {
-        prefix: 'fill_active_hover_',
-        propsKey: 'fillActiveHover',
-    });
-    var fillDisabledClass = useDeviceTargetClass(props, {
-        prefix: 'fill_disabled_',
-        propsKey: 'fillDisabled',
-    });
-    var sizeClass = useDeviceTargetClass(props, {
-        prefix: 'divider_size_',
-        propsKey: 'size',
-    });
-    var widthClass = useDeviceTargetClass(props, {
-        prefix: 'width_',
-        propsKey: 'width',
-    });
-    // @ts-expect-error
-    var hrStyles = useStyles(props).styles;
-    return (jsx("hr", { className: clsx(className, 'divider', widthClass, directionClass, sizeClass, fillClass, fillHoverClass, fillActiveClass, fillActiveHoverClass, fillDisabledClass), style: hrStyles }));
-}
-Divider.defaultProps = {
-    size: 'xs',
-};
-
-export { Divider as D };