@itcase/ui 1.2.29 → 1.2.31

package/dist/components/Text.js

@@ -1,4 +1,4 @@
-export { T as Text, t as textConfig } from '../Text-kxGZButz.js';
+export { T as Text, t as textConfig } from '../Text-DlSG_p4u.js';
 import 'react/jsx-runtime';
 import 'clsx';
 import '../appearance/Text.js';
@@ -7,7 +7,6 @@ import 'react';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import '../hooks/useStyles.js';

package/dist/components/Textarea.js

@@ -6,7 +6,6 @@ import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 

package/dist/components/Tile.js

@@ -1,15 +1,15 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import clsx from 'clsx';
+import { tileAppearance } from '../appearance/Tile.js';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
 import { useStyles } from '../hooks/useStyles.js';
-import { B as Badge } from '../Badge-BZYBmgBK.js';
-import { T as Text } from '../Text-kxGZButz.js';
-import { T as Title } from '../Title-CQ_Fr1hO.js';
+import { B as Badge } from '../Badge-DQnTpE4I.js';
+import { T as Text } from '../Text-DlSG_p4u.js';
+import { T as Title } from '../Title-mkus84Rh.js';
 import 'react';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import 'lodash/maxBy';
@@ -19,8 +19,14 @@ import '../appearance/Badge.js';
 import '../appearance/Text.js';
 import '../appearance/Title.js';
 
+var tileConfig = {
+    appearance: tileAppearance,
+    setAppearance: function (newComponent) {
+        tileConfig.appearance = newComponent;
+    },
+};
 function Tile(props) {
-    var children = props.children, direction = props.direction, after = props.after, badge = props.badge, badgeAppearance = props.badgeAppearance, badgeSize = props.badgeSize, badgeTextColor = props.badgeTextColor, badgeTextSize = props.badgeTextSize, before = props.before, className = props.className, reverse = props.reverse, size = props.size, text = props.text, textColor = props.textColor, textSize = props.textSize, textWrap = props.textWrap, title = props.title, titleTextAlign = props.titleTextAlign, titleTextColor = props.titleTextColor, titleTextSize = props.titleTextSize, titleTextWeight = props.titleTextWeight, titleTextWrap = props.titleTextWrap, type = props.type, onClick = props.onClick;
+    var children = props.children, direction = props.direction, after = props.after, appearance = props.appearance, badge = props.badge, badgeAppearance = props.badgeAppearance, badgeSize = props.badgeSize, badgeTextColor = props.badgeTextColor, badgeTextSize = props.badgeTextSize, before = props.before, className = props.className, reverse = props.reverse, size = props.size, text = props.text, textColor = props.textColor, textSize = props.textSize, textWrap = props.textWrap, title = props.title, titleTextAlign = props.titleTextAlign, titleTextColor = props.titleTextColor, titleTextSize = props.titleTextSize, titleTextWeight = props.titleTextWeight, titleTextWrap = props.titleTextWrap, type = props.type, onClick = props.onClick;
     var fillClass = useDeviceTargetClass(props, {
         prefix: 'fill_',
         propsKey: 'fill',
@@ -55,11 +61,20 @@ function Tile(props) {
     });
     // @ts-expect-error
     var tileStyles = useStyles(props).styles;
-    return (jsx("div", { className: clsx('tile', className, fillClass, shapeClass, alignClass, alignDirectionClass, direction && "direction_".concat(direction), borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, reverse && 'tile_reverse', size && "tile_size_".concat(size), type && "tile_type_".concat(type), badge && "tile_state_badge"), style: tileStyles, onClick: onClick, children: jsxs("div", { className: clsx('tile__wrapper', alignClass, alignDirectionClass), children: [before, title && (jsx(Title, { className: "tile__title", size: titleTextSize, textAlign: titleTextAlign, textColor: titleTextColor, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), text && (jsx(Text, { className: "tile__text", size: textSize, textColor: textColor, textWrap: textWrap, children: text })), badge && (jsx(Badge, { className: "tile__badge", appearance: badgeAppearance, size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, value: badge })), children, after] }) }));
+    var appearanceConfig = appearance && tileConfig.appearance && tileConfig.appearance[appearance];
+    return (jsx("div", { className: clsx('tile', className, fillClass ||
+            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
+                "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), shapeClass ||
+            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.shape) &&
+                "tile_shape_".concat(appearanceConfig.shape).replace(/([A-Z])/g, '-$1').toLowerCase()), alignClass, alignDirectionClass, direction && "direction_".concat(direction), borderColorClass ||
+            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderColor) &&
+                "border-color_".concat(appearanceConfig.borderColor)
+                    .replace(/([A-Z])/g, '-$1')
+                    .toLowerCase()), borderColorHoverClass, borderWidthClass, borderTypeClass, reverse && 'tile_reverse', size && "tile_size_".concat(size), type && "tile_type_".concat(type), badge && "tile_state_badge"), style: tileStyles, onClick: onClick, children: jsxs("div", { className: clsx('tile__wrapper', alignClass, alignDirectionClass), children: [before, title && (jsx(Title, { className: "tile__title", size: titleTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextSize), textAlign: titleTextAlign, textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor), textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), text && (jsx(Text, { className: "tile__text", size: textSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), textWrap: textWrap, children: text })), badge && (jsx(Badge, { className: "tile__badge", appearance: badgeAppearance, size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, value: badge })), children, after] }) }));
 }
 Tile.defaultProps = {
     alignDirection: 'vertical',
     textTag: 'span',
 };
 
-export { Tile };
+export { Tile, tileConfig };

package/dist/components/Title.js

@@ -1,10 +1,9 @@
-export { T as Title, t as titleConfig } from '../Title-CQ_Fr1hO.js';
+export { T as Title, t as titleConfig } from '../Title-mkus84Rh.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';
 import '../appearance/Title.js';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import '../hooks/useDeviceTargetClass.js';

package/dist/components/Tooltip.js

@@ -1,4 +1,4 @@
-export { T as Tooltip, t as tooltipConfig } from '../Tooltip-ccRCMYQM.js';
+export { T as Tooltip, t as tooltipConfig } from '../Tooltip-f5EWhsGj.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';
@@ -7,14 +7,13 @@ import '../hooks/useDeviceTargetClass.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import '../hooks/useStyles.js';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
-import '../Text-kxGZButz.js';
+import '../Text-DlSG_p4u.js';
 import '../appearance/Text.js';
-import '../Title-CQ_Fr1hO.js';
+import '../Title-mkus84Rh.js';
 import '../appearance/Title.js';

package/dist/components/Video.js

@@ -6,7 +6,6 @@ import 'lodash/camelCase';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import '../hooks/styleAttributes.js';

package/dist/components/Wrapper.js

@@ -6,7 +6,6 @@ import 'react';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import 'lodash/maxBy';
@@ -14,7 +13,7 @@ import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
 
 function Wrapper(props) {
-    var after = props.after, before = props.before, children = props.children, className = props.className, id = props.id, _a = props.tag, Tag = _a === void 0 ? 'div' : _a, type = props.type;
+    var id = props.id, children = props.children, after = props.after, before = props.before, _a = props.className, className = _a === void 0 ? 'wrapper' : _a, _b = props.tag, Tag = _b === void 0 ? 'div' : _b, type = props.type;
     var alignDirectionClass = useDeviceTargetClass(props, {
         prefix: 'align_',
         propsKey: 'alignDirection',
@@ -44,12 +43,8 @@ function Wrapper(props) {
         propsKey: 'wrapperPosition',
     });
     // @ts-expect-error
-    var _b = useStyles(props), wrapperStyles = _b.styles, innerStyles = _b.inner;
-    return (jsx(Tag, { id: id, className: clsx(className, type && "".concat(className, "_type_").concat(type), fillClass, resizeHorizontalClass, resizeVerticalClass, positionClass), style: wrapperStyles, children: jsxs("div", { className: clsx("".concat(className, "__inner"), alignDirectionClass, alignClass, wrapperPositionClass), style: innerStyles, children: [before, children, after] }) }));
+    var _c = useStyles(props), innerStyles = _c.inner, wrapperStyles = _c.styles;
+    return (jsx(Tag, { className: clsx(className, type && "".concat(className, "_type_").concat(type), fillClass, resizeHorizontalClass, resizeVerticalClass, positionClass), id: id, style: wrapperStyles, children: jsxs("div", { className: clsx("".concat(className, "__inner"), alignDirectionClass, alignClass, wrapperPositionClass), style: innerStyles, children: [before, children, after] }) }));
 }
-Wrapper.defaultProps = {
-    className: 'wrapper',
-    tag: 'div',
-};
 
 export { Wrapper };

package/dist/context/Notifications.js

@@ -1,8 +1,7 @@
 'use client';
-import { b as __spreadArray } from '../tslib.es6-w7hdJ3oZ.js';
+import { b as __spreadArray } from '../tslib.es6-5FtW-kfi.js';
 import { jsx } from 'react/jsx-runtime';
 import { createContext, useState, useCallback, useMemo, useEffect, useContext } from 'react';
-import PropTypes from 'prop-types';
 import { v4 } from 'uuid';
 
 var STATUSES = {
@@ -92,10 +91,6 @@ function NotificationsProvider(props) {
     }, []);
     return (jsx(NotificationsAPIContext.Provider, { value: notificationsAPI, children: jsx(NotificationsContext.Provider, { value: notificationsList, children: children }) }));
 }
-NotificationsProvider.propTypes = {
-    children: PropTypes.any,
-    initialNotificationsList: PropTypes.array,
-};
 function useNotifications() {
     return useContext(NotificationsContext);
 }

package/dist/context/UIContext.js

@@ -1,7 +1,6 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { createContext, memo, useState, useMemo, useContext } from 'react';
-import PropTypes from 'prop-types';
 import { useMediaQueries } from '../hooks/useMediaQueries.js';
 import 'react-responsive';
 
@@ -27,13 +26,5 @@ var UIProvider = memo(function UIProvider(props) {
     var mediaQueriesDevices = useMediaQueries(userDeviceState);
     return (jsx(UserDeviceContext.Provider, { value: mediaQueriesDevices, children: jsx(SiteMenuContext.Provider, { value: siteMenuContextState, children: children }) }));
 });
-UIProvider.propTypes = {
-    children: PropTypes.any,
-    userDeviceState: PropTypes.shape({
-        isMobile: PropTypes.bool,
-        isTablet: PropTypes.bool,
-        isDesktop: PropTypes.bool,
-    }),
-};
 
 export { UIProvider, useSiteMenuContext, useUserDeviceContext };

package/dist/css/components/ModalSheetBottom/ModalSheetBottom.css

@@ -0,0 +1,29 @@
+.modal-sheet-bottom {
+  &__container {
+    background-color: var(
+      --modal-sheet-bottom-container-background,
+      var(--color-surface-primary)
+    ) !important;
+    border-radius: var(--modal-sheet-bottom-container-border-radius, 8px 8px 0 0) !important;
+  }
+  &__header {
+    & .react-modal-sheet-header {
+      max-height: 32px;
+    }
+    & .react-modal-sheet-drag-indicator {
+      background-color: var(
+        --modal-sheet-bottom-header-grabber,
+        var(--color-surface-item-primary)
+      ) !important;
+    }
+  }
+  &__content {
+    margin: 0 0 32px 0;
+  }
+  &__backdrop {
+    background-color: var(
+      --modal-sheet-bottom-backdrop,
+      var(--color-surface-inverse-50)
+    ) !important;
+  }
+}

package/dist/hooks/useDeviceTargetClass.js

@@ -3,7 +3,6 @@ import castArray from 'lodash/castArray';
 import camelCase from 'lodash/camelCase';
 import { useUserDeviceContext } from '../context/UIContext.js';
 import 'react/jsx-runtime';
-import 'prop-types';
 import './useMediaQueries.js';
 import 'react-responsive';
 

package/dist/hooks/useStyles.js

@@ -5,7 +5,6 @@ import upperFirst from 'lodash/upperFirst';
 import { useUserDeviceContext } from '../context/UIContext.js';
 import styleAttributes from './styleAttributes.js';
 import 'react/jsx-runtime';
-import 'prop-types';
 import './useMediaQueries.js';
 import 'react-responsive';
 

package/dist/stories/Response.stories.js

@@ -18,49 +18,75 @@ const Default = {
   },
 }
 
-export const WithoutProps = {
+export const Dev = {
   args: {
     ...Default.args,
+    padding: 24,
+    appearance: 'dev',
+    imageSrc: 'assets/response/Search.svg',
   },
 }
 
-export const Dev = {
+export const Custom = {
   args: {
     ...Default.args,
     padding: 24,
-    appearance: 'dev',
-    imageSrc: 'assets/search.svg',
+    appearance: 'custom',
   },
 }
 
 export const Success = {
   args: {
     ...Default.args,
-    imageSrc: 'assets/response/success.svg',
-    state: 'success',
+    appearance: 'success',
+    imageSrc: 'assets/response/Success.svg',
   },
 }
 
 export const Warning = {
   args: {
     ...Default.args,
-    imageSrc: 'assets/response/warning.svg',
-    state: 'warning',
+    appearance: 'warning',
+    imageSrc: 'assets/response/Warning.svg',
   },
 }
 
 export const Error = {
   args: {
     ...Default.args,
-    imageSrc: 'assets/response/error.svg',
-    state: 'error',
+    appearance: 'error',
+    imageSrc: 'assets/response/Error.svg',
   },
 }
 
 export const Fail = {
   args: {
     ...Default.args,
-    imageSrc: 'assets/response/fail.svg',
-    state: 'fail',
+    appearance: 'fail',
+    imageSrc: 'assets/response/Fail.svg',
+  },
+}
+
+export const CantLoadData = {
+  args: {
+    ...Default.args,
+    appearance: 'cantLoadData',
+    imageSrc: 'assets/response/CantLoadData.svg',
+  },
+}
+
+export const Refresh = {
+  args: {
+    ...Default.args,
+    appearance: 'refresh',
+    imageSrc: 'assets/response/Refresh.svg',
+  },
+}
+
+export const Search = {
+  args: {
+    ...Default.args,
+    appearance: 'search',
+    imageSrc: 'assets/response/Search.svg',
   },
 }

package/dist/{tslib.es6-w7hdJ3oZ.js → tslib.es6-5FtW-kfi.js}

@@ -53,4 +53,4 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
     return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
-export { __rest as _, __assign as a, __spreadArray as b };
+export { __assign as _, __rest as a, __spreadArray as b };

package/dist/types/appearance/Avatar/index.d.ts

@@ -0,0 +1,2 @@
+import { avatarAppearanceType } from '../../components/Avatar/Avatar.interface';
+export declare const avatarAppearance: avatarAppearanceType;

package/dist/types/appearance/Code/index.d.ts

@@ -0,0 +1,2 @@
+import { codeAppearanceType } from '../../components/Code/Code.interface';
+export declare const codeAppearance: codeAppearanceType;

package/dist/types/appearance/Divider/index.d.ts

@@ -0,0 +1,2 @@
+import { dividerAppearanceType } from '../../components/Divider/Divider.interface';
+export declare const dividerAppearance: dividerAppearanceType;

package/dist/types/appearance/DropdownItem/index.d.ts

@@ -0,0 +1,2 @@
+import { dropdownItemAppearanceType } from '../../components/Dropdown/Dropdown.interface';
+export declare const dropdownItemAppearance: dropdownItemAppearanceType;

package/dist/types/appearance/Modal/index.d.ts

@@ -0,0 +1,2 @@
+import { modalAppearanceType } from '../../components/Modal/Modal.interface';
+export declare const modalAppearance: modalAppearanceType;

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

@@ -0,0 +1,2 @@
+import { siteMenuAppearanceType } from '../../components/SiteMenu/SiteMenu.interface';
+export declare const siteMenuAppearance: siteMenuAppearanceType;

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

@@ -0,0 +1,2 @@
+import { switchAppearanceType } from '../../components/Switch/Switch.interface';
+export declare const switchAppearance: switchAppearanceType;

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

@@ -0,0 +1,2 @@
+import { tileAppearanceType } from '../../components/Tile/Tile.interface';
+export declare const tileAppearance: tileAppearanceType;

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

@@ -1,3 +1,4 @@
-import { IAvatarProps } from './Avatar.interface';
+import { iAvatarConfig, IAvatarProps } from './Avatar.interface';
+declare const avatarConfig: iAvatarConfig;
 declare function Avatar(props: IAvatarProps): import("react/jsx-runtime").JSX.Element;
-export { Avatar };
+export { Avatar, avatarConfig };

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

@@ -1,13 +1,10 @@
 import { ElementType, ReactNode } from 'react';
 import { iStyleAttributes } from '../../hooks/styleAttributes.interface';
-import { tFillHoverProps, tFillProps, iconFillSizePropsType, iconSizePropsType, tItemColorProps, tShapeProps, sizePXPropsType, tTextColorProps, tTextSizeProps, tTextWeightProps } from '../../types';
-export interface IAvatarProps extends iStyleAttributes {
-    Dot?: ReactNode;
-    after?: ReactNode;
-    before?: ReactNode;
-    className?: string;
+import { iconFillSizePropsType, iconSizePropsType, sizePXPropsType, tFillHoverProps, tFillProps, tItemColorProps, tShapeProps, tTextColorProps, tTextSizeProps, tTextWeightProps } from '../../types';
+import { tAppearanceKeysDefault } from '../../types/componentProps/appearanceKeys';
+export interface IAvatarThemeColor {
     fill?: tFillProps;
-    firstName?: string;
+    fillHover?: tFillHoverProps;
     icon?: ElementType;
     iconFill?: tFillProps;
     iconFillHover?: tFillHoverProps;
@@ -16,14 +13,31 @@ export interface IAvatarProps extends iStyleAttributes {
     iconShape?: tShapeProps;
     iconSize?: iconSizePropsType;
     iconSrc?: string;
-    mode?: string;
-    secondName?: string;
     shape?: tShapeProps;
-    size?: sizePXPropsType;
-    src?: string;
     textColor?: tTextColorProps;
     textSize?: tTextSizeProps;
     textWeight?: tTextWeightProps;
+}
+type appearanceKeysType = {} & tAppearanceKeysDefault;
+export type avatarAppearanceType = {
+    [key in appearanceKeysType]?: IAvatarThemeColor;
+};
+export interface iAvatarConfig {
+    appearance: avatarAppearanceType | undefined;
+    setAppearance: (newComponent: avatarAppearanceType) => void;
+}
+export interface IAvatarProps extends IAvatarThemeColor, iStyleAttributes {
+    after?: ReactNode;
+    appearance?: appearanceKeysType;
+    before?: ReactNode;
+    className?: string;
+    Dot?: ReactNode;
+    firstName?: string;
+    mode?: string;
+    secondName?: string;
+    size?: sizePXPropsType;
+    src?: string;
     type?: 'image' | 'text';
     onClick?: () => void;
 }
+export {};

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

@@ -1 +1 @@
-export { Avatar } from './Avatar';
+export { Avatar, avatarConfig } from './Avatar';

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

@@ -1,4 +1,10 @@
 import { IBadgeConfig, IBadgeProps } from './Badge.interface';
 declare const badgeConfig: IBadgeConfig;
 declare function Badge(props: IBadgeProps): import("react/jsx-runtime").JSX.Element;
+declare namespace Badge {
+    var defaultProps: {
+        shape: string;
+        size: string;
+    };
+}
 export { Badge, badgeConfig };

package/dist/types/components/Breadcrumbs/BreadcrumbsItem.d.ts

@@ -1,8 +1,3 @@
 import { IBreadcrumbsItemProps } from './Breadcrumbs.interface';
 declare function BreadcrumbsItem(props: IBreadcrumbsItemProps): import("react/jsx-runtime").JSX.Element;
-declare namespace BreadcrumbsItem {
-    var defaultProps: {
-        set: string;
-    };
-}
 export { BreadcrumbsItem };

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

@@ -1,6 +1,6 @@
 import { CSSProperties, ElementType, ReactNode } from 'react';
 import { iStyleAttributes } from '../../hooks/styleAttributes.interface';
-import { tBorderColorProps, borderTypePropsType, tBorderWidthProps, elevationPropsType, tFillHoverProps, tFillProps, iconFillSizePropsType, iconSizePropsType, tItemColorProps, tShapeProps, tSizeProps, tTextColorHoverProps, tTextColorProps, tTextSizeProps, tTextWeightProps, tTextWrapProps, tWidthProps } from '../../types';
+import { borderTypePropsType, elevationPropsType, iconFillSizePropsType, iconSizePropsType, tBorderColorProps, tBorderWidthProps, tFillHoverProps, tFillProps, tItemColorProps, tShapeProps, tSizeProps, tTextColorHoverProps, tTextColorProps, tTextSizeProps, tTextWeightProps, tTextWrapProps, tWidthProps } from '../../types';
 import { tAppearanceKeysDefault } from '../../types/componentProps/appearanceKeys';
 export interface IButtonThemeColor {
     borderColor?: tBorderColorProps;
@@ -40,7 +40,7 @@ export interface IButtonThemeColor {
     size?: tSizeProps;
     width?: tWidthProps;
 }
-type appearanceKeysType = tAppearanceKeysDefault & {};
+type appearanceKeysType = {} & tAppearanceKeysDefault;
 export type buttonAppearanceType = {
     [key in appearanceKeysType]?: IButtonThemeColor;
 };
@@ -49,13 +49,13 @@ export interface IButtonConfig {
     setAppearance: (newComponent: buttonAppearanceType) => void;
 }
 export interface IButtonProps extends IButtonThemeColor, iStyleAttributes {
-    Badge?: ReactNode;
+    dataTestId?: string;
     after?: ReactNode;
     appearance?: appearanceKeysType;
+    Badge?: ReactNode;
     before?: ReactNode;
     children?: ReactNode;
     className?: string;
-    dataTestId?: string;
     dataTour?: string;
     href?: string;
     htmlType?: ElementType;
@@ -63,15 +63,15 @@ export interface IButtonProps extends IButtonThemeColor, iStyleAttributes {
     iconAfter?: ElementType;
     iconBefore?: ElementType;
     iconSrc?: string;
-    isDisabled?: boolean;
     label?: string;
     link?: string;
     loading?: boolean;
     rel?: string;
     style?: CSSProperties;
     target?: string;
-    set?: string;
+    isDisabled?: boolean;
     onClick?: () => void;
     onMouseDown?: () => void;
+    set?: string;
 }
 export {};

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

@@ -1,13 +1,3 @@
 import { ICardProps } from './Card.interface';
 declare function Card(props: ICardProps): import("react/jsx-runtime").JSX.Element;
-declare namespace Card {
-    var defaultProps: {
-        textSize: string;
-        titleColor: string;
-        titleTag: string;
-        titleSize: string;
-        imageShape: string;
-        textColor: string;
-    };
-}
 export { Card };

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

@@ -1,9 +1,3 @@
 import { ICellProps } from './Cell.interface';
 declare function Cell(props: ICellProps): import("react/jsx-runtime").JSX.Element;
-declare namespace Cell {
-    var defaultProps: {
-        isDisabled: boolean;
-        textSize: string;
-    };
-}
 export { Cell };

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

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

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

@@ -1,21 +1,19 @@
-import { ICodeProps } from './Code.interface';
+import { iCodeConfig, ICodeProps } from './Code.interface';
+declare const codeConfig: iCodeConfig;
 declare function Code(props: ICodeProps): import("react/jsx-runtime").JSX.Element;
 declare namespace Code {
     var defaultProps: {
-        inputCount: number;
-        inputType: string;
-        inputSize: string;
-        inputBorderWidth: number;
-        inputPlaceholder: number;
         inputBorderColor: string;
         inputBorderColorHover: string;
         inputBorderFocusColor: string;
+        inputBorderWidth: number;
+        inputCaretColor: string;
         inputFill: string;
         inputFillHover: string;
         inputShape: string;
+        inputSize: string;
         inputTextColor: string;
         inputTextSize: string;
-        inputCaretColor: string;
     };
 }
-export { Code };
+export { Code, codeConfig };

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

@@ -2,8 +2,26 @@ import { FocusEvent, ReactNode } from 'react';
 import { AllowedInputTypes } from 'react-otp-input';
 import { iStyleAttributes } from '../../hooks/styleAttributes.interface';
 import { borderColorHoverPropsType, tBorderColorProps, tBorderWidthProps, tFillHoverProps, tFillProps, tItemColorProps, tShapeProps, tSizeProps, tTextColorProps, tTextSizeProps, tTextWeightProps, tWidthProps } from '../../types';
-export interface ICodeProps extends iStyleAttributes {
+import { tAppearanceKeysDefault } from '../../types/componentProps/appearanceKeys';
+export interface ICodeThemeColor {
+    borderColor?: tBorderColorProps;
+    fill?: tFillProps;
+    fillHover?: tFillHoverProps;
+    labelTextColor?: tTextColorProps;
+    labelTextSize?: tTextSizeProps;
+    shape?: tShapeProps;
+}
+type appearanceKeysType = {} & tAppearanceKeysDefault;
+export type codeAppearanceType = {
+    [key in appearanceKeysType]?: ICodeThemeColor;
+};
+export interface iCodeConfig {
+    appearance: codeAppearanceType | undefined;
+    setAppearance: (newComponent: codeAppearanceType) => void;
+}
+export interface ICodeProps extends ICodeThemeColor, iStyleAttributes {
     after?: ReactNode;
+    appearance?: appearanceKeysType;
     before?: ReactNode;
     className?: string;
     gap?: string;
@@ -24,10 +42,11 @@ export interface ICodeProps extends iStyleAttributes {
     inputTextSize?: tTextSizeProps;
     inputTextWeight?: tTextWeightProps;
     inputType?: AllowedInputTypes | undefined;
-    otp?: string | number;
+    otp?: number | string;
     separatorComponent?: ReactNode;
     width?: tWidthProps;
     onBlur?: (arg0: FocusEvent) => void;
     onChange?: (otp: string) => void;
     onFocus?: (arg0: FocusEvent) => void;
 }
+export {};

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

@@ -1 +1 @@
-export { Code } from './Code';
+export { Code, codeConfig } from './Code';