@uzum-tech/ui 1.3.1 → 1.4.0

package/es/__mocks__/vueuse-core.d.ts

@@ -0,0 +1,5 @@
+export function useClipboard(): {
+    copy: jest.Mock<any, any, any>;
+    text: string;
+    isSupported: boolean;
+};

package/es/__mocks__/vueuse-core.js

@@ -0,0 +1,9 @@
+"use strict";
+/* global jest */
+module.exports = {
+    useClipboard: () => ({
+        copy: jest.fn(),
+        text: '',
+        isSupported: true
+    })
+};

package/es/_internal/checkbox/src/use-checkbox.d.ts

@@ -14,11 +14,11 @@ export declare const checkboxGroupInjectionKey: import("vue").InjectionKey<Check
 export declare const checkboxBaseProps: {
     size: PropType<"small" | "medium" | "large">;
     checked: {
-        type: PropType<string | number | boolean | undefined>;
+        type: PropType<boolean | string | number | undefined>;
         default: undefined;
     };
     defaultChecked: {
-        type: PropType<string | number | boolean>;
+        type: PropType<boolean | string | number>;
         default: boolean;
     };
     value: PropType<string | number>;
@@ -27,11 +27,11 @@ export declare const checkboxBaseProps: {
         default: undefined;
     };
     checkedValue: {
-        type: (BooleanConstructor | StringConstructor | NumberConstructor)[];
+        type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
         default: boolean;
     };
     uncheckedValue: {
-        type: (BooleanConstructor | StringConstructor | NumberConstructor)[];
+        type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
         default: boolean;
     };
     'onUpdate:checked': PropType<MaybeArray<OnUpdateChecked>>;

package/es/_internal/close/src/Close.d.ts

@@ -40,10 +40,10 @@ declare const _default: import("vue").DefineComponent<{
     onClick: PropType<(e: MouseEvent) => void>;
     absolute: BooleanConstructor;
 }>>, {
+    disabled: boolean;
     round: boolean;
     absolute: boolean;
-    disabled: boolean;
-    focusable: boolean;
     isButtonTag: boolean;
+    focusable: boolean;
 }, {}>;
 export default _default;

package/es/_internal/fade-in-expand-transition/src/FadeInExpandTransition.d.ts

@@ -2,7 +2,7 @@ import { type PropType } from 'vue';
 declare const _default: import("vue").DefineComponent<{
     appear: BooleanConstructor;
     group: BooleanConstructor;
-    mode: PropType<"default" | "in-out" | "out-in">;
+    mode: PropType<"in-out" | "out-in" | "default">;
     onLeave: FunctionConstructor;
     onAfterLeave: FunctionConstructor;
     onAfterEnter: FunctionConstructor;
@@ -13,7 +13,7 @@ declare const _default: import("vue").DefineComponent<{
 }>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     appear: BooleanConstructor;
     group: BooleanConstructor;
-    mode: PropType<"default" | "in-out" | "out-in">;
+    mode: PropType<"in-out" | "out-in" | "default">;
     onLeave: FunctionConstructor;
     onAfterLeave: FunctionConstructor;
     onAfterEnter: FunctionConstructor;
@@ -22,7 +22,7 @@ declare const _default: import("vue").DefineComponent<{
 }>>, {
     reverse: boolean;
     width: boolean;
-    appear: boolean;
     group: boolean;
+    appear: boolean;
 }, {}>;
 export default _default;

package/es/_internal/icons/ContentCopy.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+export default _default;

package/es/_internal/icons/ContentCopy.js

@@ -0,0 +1,8 @@
+import { h, defineComponent } from 'vue';
+export default defineComponent({
+    name: 'ContentCopy',
+    render() {
+        return (h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            h("path", { stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", d: "M5 9C4.06812 9 3.60218 9 3.23463 9.15224C2.74458 9.35523 2.35523 9.74458 2.15224 10.2346C2 10.6022 2 11.0681 2 12V18.8C2 19.9201 2 20.4802 2.21799 20.908C2.40973 21.2843 2.71569 21.5903 3.09202 21.782C3.51984 22 4.0799 22 5.2 22H12C12.9319 22 13.3978 22 13.7654 21.8478C14.2554 21.6448 14.6448 21.2554 14.8478 20.7654C15 20.3978 15 19.9319 15 19M12.2 2H18.8C19.9201 2 20.4802 2 20.908 2.21799C21.2843 2.40973 21.5903 2.71569 21.782 3.09202C22 3.51984 22 4.0799 22 5.2V11.8C22 12.9201 22 13.4802 21.782 13.908C21.5903 14.2843 21.2843 14.5903 20.908 14.782C20.4802 15 19.9201 15 18.8 15H12.2C11.0799 15 10.5198 15 10.092 14.782C9.71569 14.5903 9.40973 14.2843 9.21799 13.908C9 13.4802 9 12.9201 9 11.8V5.2C9 4.0799 9 3.51984 9.21799 3.09202C9.40973 2.71569 9.71569 2.40973 10.092 2.21799C10.5198 2 11.0799 2 12.2 2Z" })));
+    }
+});

package/es/_internal/icons/FileHeart.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+export default _default;

package/es/_internal/icons/FileHeart.js

@@ -0,0 +1,8 @@
+import { h, defineComponent } from 'vue';
+export default defineComponent({
+    name: 'FileHeart',
+    render() {
+        return (h("svg", { width: "27", height: "30", viewBox: "0 0 27 30", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            h("path", { d: "M23.6666 12.3333V8.06663C23.6666 5.82642 23.6666 4.70631 23.2306 3.85066C22.8471 3.09802 22.2352 2.48609 21.4825 2.1026C20.6269 1.66663 19.5068 1.66663 17.2666 1.66663H8.73325C6.49304 1.66663 5.37294 1.66663 4.51729 2.1026C3.76464 2.48609 3.15272 3.09802 2.76923 3.85066C2.33325 4.70631 2.33325 5.82642 2.33325 8.06663V21.9333C2.33325 24.1735 2.33325 25.2936 2.76923 26.1493C3.15272 26.9019 3.76464 27.5138 4.51729 27.8973C5.37294 28.3333 6.49304 28.3333 8.73325 28.3333H12.9999M13.6666 13.6666H7.66659M8.99992 19H7.66659M18.3333 8.33329H7.66659M19.6629 18.7741C18.5966 17.5621 16.8185 17.2361 15.4824 18.3459C14.1464 19.4557 13.9583 21.3113 15.0075 22.6239C16.0567 23.9365 19.6629 27 19.6629 27C19.6629 27 23.2692 23.9365 24.3184 22.6239C25.3676 21.3113 25.2024 19.444 23.8434 18.3459C22.4845 17.2477 20.7293 17.5621 19.6629 18.7741Z", stroke: "currentColor", "stroke-width": "3.2", "stroke-linecap": "round", "stroke-linejoin": "round" })));
+    }
+});

package/es/_internal/icons/SiderUnionBorder.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+export default _default;

package/es/_internal/icons/SiderUnionBorder.js

@@ -0,0 +1,8 @@
+import { h, defineComponent } from 'vue';
+export default defineComponent({
+    name: 'SiderUnionBorder',
+    render() {
+        return (h("svg", { viewBox: "0 0 35 82", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            h("path", { d: "M15 0L0 0V82H15V72.0682C15 67.6499 18.7463 64.209 22.7412 62.3215C29.9427 58.9189 35 50.9123 35 41.5775C35 32.2426 29.9427 24.236 22.7412 20.8334C18.7463 18.946 15 15.505 15 11.0867V0Z", fill: "currentColor" })));
+    }
+});

package/es/_internal/icons/index.d.ts

@@ -47,3 +47,6 @@ export { default as ClearSmallIcon } from './ClearSmall';
 export { default as EditIcon } from './Edit';
 export { default as CheckmarkCircleIcon } from './CheckmarkCircle';
 export { default as DismissCircleIcon } from './DismissCircle';
+export { default as FileHeart } from './FileHeart';
+export { default as ContentCopy } from './ContentCopy';
+export { default as SiderUnionBorder } from './SiderUnionBorder';

package/es/_internal/icons/index.js

@@ -47,3 +47,6 @@ export { default as ClearSmallIcon } from './ClearSmall';
 export { default as EditIcon } from './Edit';
 export { default as CheckmarkCircleIcon } from './CheckmarkCircle';
 export { default as DismissCircleIcon } from './DismissCircle';
+export { default as FileHeart } from './FileHeart';
+export { default as ContentCopy } from './ContentCopy';
+export { default as SiderUnionBorder } from './SiderUnionBorder';

package/es/_internal/loading/src/Loading.d.ts

@@ -61,10 +61,10 @@ declare const _default: import("vue").DefineComponent<{
         default: number;
     };
 }>>, {
-    show: boolean;
+    strokeWidth: number;
     stroke: string;
+    show: boolean;
     scale: number;
-    strokeWidth: number;
     radius: number;
 }, {}>;
 export default _default;

package/es/_internal/menu-mask/src/MenuMask.d.ts

@@ -4,7 +4,7 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
     };
 }, {
-    showOnce: (message: string, duration?: number | undefined) => void;
+    showOnce: (message: string, duration?: number) => void;
     message: import("vue").Ref<string | null>;
     show: import("vue").Ref<boolean>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{

package/es/_internal/radio/src/use-radio.d.ts

@@ -18,8 +18,8 @@ export declare const radioBaseProps: {
     };
     readonly label: StringConstructor;
     readonly size: PropType<"small" | "medium" | "large">;
-    readonly onUpdateChecked: PropType<MaybeArray<(value: boolean) => void> | undefined>;
-    readonly 'onUpdate:checked': PropType<MaybeArray<(value: boolean) => void> | undefined>;
+    readonly onUpdateChecked: PropType<undefined | MaybeArray<(value: boolean) => void>>;
+    readonly 'onUpdate:checked': PropType<undefined | MaybeArray<(value: boolean) => void>>;
     readonly checkedValue: {
         readonly type: PropType<boolean | undefined>;
         readonly default: undefined;

package/es/_internal/select-menu/src/SelectGroupHeader.d.ts

@@ -8,7 +8,7 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
     };
     tmNode: {
-        type: PropType<TreeNode<SelectGroupOption, SelectGroupOption, SelectGroupOption>>;
+        type: PropType<TreeNode<SelectGroupOption>>;
         required: true;
     };
 }, {
@@ -22,7 +22,7 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
     };
     tmNode: {
-        type: PropType<TreeNode<SelectGroupOption, SelectGroupOption, SelectGroupOption>>;
+        type: PropType<TreeNode<SelectGroupOption>>;
         required: true;
     };
 }>>, {}, {}>;

package/es/_internal/select-menu/src/SelectMenu.d.ts

@@ -109,12 +109,18 @@ declare const _default: import("vue").DefineComponent<{
             iconSizeMedium: string;
             iconSizeLarge: string;
             iconSizeHuge: string;
-            fontSizeSmall: string;
-            fontSizeMedium: string;
-            fontSizeLarge: string;
-            fontSizeHuge: string;
-            textColor: string;
+            titleFontSizeSmall: string;
+            titleFontSizeMedium: string;
+            titleFontSizeLarge: string;
+            titleFontSizeHuge: string;
+            descriptionFontSizeSmall: string;
+            descriptionFontSizeMedium: string;
+            descriptionFontSizeLarge: string;
+            descriptionFontSizeHuge: string;
+            titleColor: string;
+            descriptionColor: string;
             iconColor: string;
+            iconBgColor: string;
             extraTextColor: string;
         }, any>;
     }>>;
@@ -160,12 +166,18 @@ declare const _default: import("vue").DefineComponent<{
             iconSizeMedium: string;
             iconSizeLarge: string;
             iconSizeHuge: string;
-            fontSizeSmall: string;
-            fontSizeMedium: string;
-            fontSizeLarge: string;
-            fontSizeHuge: string;
-            textColor: string;
+            titleFontSizeSmall: string;
+            titleFontSizeMedium: string;
+            titleFontSizeLarge: string;
+            titleFontSizeHuge: string;
+            descriptionFontSizeSmall: string;
+            descriptionFontSizeMedium: string;
+            descriptionFontSizeLarge: string;
+            descriptionFontSizeHuge: string;
+            titleColor: string;
+            descriptionColor: string;
             iconColor: string;
+            iconBgColor: string;
             extraTextColor: string;
         }, any>;
     }>>>;
@@ -211,133 +223,28 @@ declare const _default: import("vue").DefineComponent<{
             iconSizeMedium: string;
             iconSizeLarge: string;
             iconSizeHuge: string;
-            fontSizeSmall: string;
-            fontSizeMedium: string;
-            fontSizeLarge: string;
-            fontSizeHuge: string;
-            textColor: string;
+            titleFontSizeSmall: string;
+            titleFontSizeMedium: string;
+            titleFontSizeLarge: string;
+            titleFontSizeHuge: string;
+            descriptionFontSizeSmall: string;
+            descriptionFontSizeMedium: string;
+            descriptionFontSizeLarge: string;
+            descriptionFontSizeHuge: string;
+            titleColor: string;
+            descriptionColor: string;
             iconColor: string;
+            iconBgColor: string;
             extraTextColor: string;
         }, any>;
     }>>>;
 }, {
     selfRef: import("vue").Ref<HTMLElement | null>;
-    getPendingTmNode: () => TreeNode<import("../../../select/src/interface").SelectBaseOption<string | number, string | ((option: import("../../../select/src/interface").SelectBaseOption<string | number, string | any>, selected: boolean) => import("vue").VNodeChild)>, import("../../../select/src/interface").SelectBaseOption<string | number, string | ((option: import("../../../select/src/interface").SelectBaseOption<string | number, string | any>, selected: boolean) => import("vue").VNodeChild)>, import("../../../select/src/interface").SelectBaseOption<string | number, string | ((option: import("../../../select/src/interface").SelectBaseOption<string | number, string | any>, selected: boolean) => import("vue").VNodeChild)>> | null;
+    getPendingTmNode: () => TreeNode<import("../../../select/src/interface").SelectBaseOption> | null;
     prev: () => void;
     next: () => void;
     mergedTheme: import("vue").ComputedRef<{
-        common: {
-            scrollbarColor: string;
-            scrollbarColorHover: string;
-            scrollbarWidth: string;
-            scrollbarHeight: string;
-            scrollbarBorderRadius: string;
-            opacityDisabled: string;
-            brandPrimary50: string;
-            brandPrimary100: string;
-            brandPrimary200: string;
-            brandPrimary300: string;
-            brandPrimary400: string;
-            brandPrimary500: string;
-            brandPrimary550: string;
-            brandPrimary600: string;
-            brandSecondary500: string;
-            brandSecondary300: string;
-            brandSecondary600: string;
-            brandTertiary500: string;
-            brandTertiary300: string;
-            brandTertiary600: string;
-            brandQuaternary500: string;
-            brandQuaternary300: string;
-            brandQuaternary600: string;
-            brandQuinary500: string;
-            brandQuinary300: string;
-            brandQuinary600: string;
-            brandQuinary100: string;
-            surfacePrimary: string;
-            surfaceSecondary: string;
-            containerPrimary: string;
-            containerSecondary: string;
-            textPrimary: string;
-            textSecondary: string;
-            textTertiary: string;
-            textQuaternary: string;
-            textBrand: string;
-            elementsPrimary: string;
-            elementsSecondary: string;
-            elementsTertiary: string;
-            elementsQuaternary: string;
-            elementsQuinary: string;
-            elementsDarkQuinary: string;
-            elementsSenary: string;
-            elementsOnContainer: string;
-            transparencyPrimary: string;
-            transparencySecondary: string;
-            transparencyTertiary: string;
-            transparencyQuinary: string;
-            transparencyModal: string;
-            staticBlack: string;
-            staticDarkGrey: string;
-            staticWhite: string;
-            staticRed: string;
-            staticOrange: string;
-            staticGreen: string;
-            staticDeepBlue: string;
-            staticErrorAccent: string;
-            shadowDepth2: string;
-            shadowDepth: string;
-            fontFamily: string;
-            fontFamilyMono: string;
-            cubicBezierEaseInOut: string;
-            cubicBezierEaseOut: string;
-            cubicBezierEaseIn: string;
-            borderRadiusLarge: string;
-            borderRadius: string;
-            borderRadiusMedium: string;
-            borderRadiusSmall: string;
-            borderRadiusTiny: string;
-            heightMini: string;
-            heightTiny: string;
-            heightSmall: string;
-            heightMedium: string;
-            heightLarge: string;
-            heightHuge: string;
-            fontDisplayLarge: string;
-            fontDisplaySmall: string;
-            fontHeadingLarge: string;
-            fontHeadingMedium: string;
-            fontHeadingSmall: string;
-            fontTitleLarge: string;
-            fontTitleMedium: string;
-            fontTitleSmall: string;
-            fontBodyLarge: string;
-            fontBodyMedium: string;
-            fontBodySmall: string;
-            lineHeightDisplayLarge: string;
-            lineHeightDisplaySmall: string;
-            lineHeightHeadingLarge: string;
-            lineHeightHeadingMedium: string;
-            lineHeightHeadingSmall: string;
-            lineHeightTitleLarge: string;
-            lineHeightTitleMedium: string;
-            lineHeightTitleSmall: string;
-            lineHeightBodyLarge: string;
-            lineHeightBodyMedium: string;
-            lineHeightBodySmall: string;
-            fontWeight: string;
-            fontWeightStrong: string;
-            fontWeightBold: string;
-            iconSmall: string;
-            iconMedium: string;
-            iconLarge: string;
-            iconHuge: string;
-            closeSmall: string;
-            closeMedium: string;
-            closeLarge: string;
-            closeHuge: string;
-            closeBorderRadius: string;
-            name: "common";
-        };
+        common: import("../../..").ThemeCommonVars;
         self: {
             height: string;
             paddingSmall: string;
@@ -381,12 +288,18 @@ declare const _default: import("vue").DefineComponent<{
                 iconSizeMedium: string;
                 iconSizeLarge: string;
                 iconSizeHuge: string;
-                fontSizeSmall: string;
-                fontSizeMedium: string;
-                fontSizeLarge: string;
-                fontSizeHuge: string;
-                textColor: string;
+                titleFontSizeSmall: string;
+                titleFontSizeMedium: string;
+                titleFontSizeLarge: string;
+                titleFontSizeHuge: string;
+                descriptionFontSizeSmall: string;
+                descriptionFontSizeMedium: string;
+                descriptionFontSizeLarge: string;
+                descriptionFontSizeHuge: string;
+                titleColor: string;
+                descriptionColor: string;
                 iconColor: string;
+                iconBgColor: string;
                 extraTextColor: string;
             }, any>;
         };
@@ -570,12 +483,18 @@ declare const _default: import("vue").DefineComponent<{
             iconSizeMedium: string;
             iconSizeLarge: string;
             iconSizeHuge: string;
-            fontSizeSmall: string;
-            fontSizeMedium: string;
-            fontSizeLarge: string;
-            fontSizeHuge: string;
-            textColor: string;
+            titleFontSizeSmall: string;
+            titleFontSizeMedium: string;
+            titleFontSizeLarge: string;
+            titleFontSizeHuge: string;
+            descriptionFontSizeSmall: string;
+            descriptionFontSizeMedium: string;
+            descriptionFontSizeLarge: string;
+            descriptionFontSizeHuge: string;
+            titleColor: string;
+            descriptionColor: string;
             iconColor: string;
+            iconBgColor: string;
             extraTextColor: string;
         }, any>;
     }>>;
@@ -621,12 +540,18 @@ declare const _default: import("vue").DefineComponent<{
             iconSizeMedium: string;
             iconSizeLarge: string;
             iconSizeHuge: string;
-            fontSizeSmall: string;
-            fontSizeMedium: string;
-            fontSizeLarge: string;
-            fontSizeHuge: string;
-            textColor: string;
+            titleFontSizeSmall: string;
+            titleFontSizeMedium: string;
+            titleFontSizeLarge: string;
+            titleFontSizeHuge: string;
+            descriptionFontSizeSmall: string;
+            descriptionFontSizeMedium: string;
+            descriptionFontSizeLarge: string;
+            descriptionFontSizeHuge: string;
+            titleColor: string;
+            descriptionColor: string;
             iconColor: string;
+            iconBgColor: string;
             extraTextColor: string;
         }, any>;
     }>>>;
@@ -672,24 +597,30 @@ declare const _default: import("vue").DefineComponent<{
             iconSizeMedium: string;
             iconSizeLarge: string;
             iconSizeHuge: string;
-            fontSizeSmall: string;
-            fontSizeMedium: string;
-            fontSizeLarge: string;
-            fontSizeHuge: string;
-            textColor: string;
+            titleFontSizeSmall: string;
+            titleFontSizeMedium: string;
+            titleFontSizeLarge: string;
+            titleFontSizeHuge: string;
+            descriptionFontSizeSmall: string;
+            descriptionFontSizeMedium: string;
+            descriptionFontSizeLarge: string;
+            descriptionFontSizeHuge: string;
+            titleColor: string;
+            descriptionColor: string;
             iconColor: string;
+            iconBgColor: string;
             extraTextColor: string;
         }, any>;
     }>>>;
 }>>, {
     value: Value | null;
-    size: Size;
-    show: boolean;
-    multiple: boolean;
-    focusable: boolean;
     loading: boolean;
     inlineThemeDisabled: boolean;
+    size: Size;
+    focusable: boolean;
+    show: boolean;
     scrollable: boolean;
+    multiple: boolean;
     account: boolean;
     showCheckmark: boolean;
     labelField: string;

package/es/_internal/select-menu/src/SelectOption.d.ts

@@ -8,7 +8,7 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
     };
     tmNode: {
-        type: PropType<TreeNode<SelectOption, SelectOption, SelectOption>>;
+        type: PropType<TreeNode<SelectOption>>;
         required: true;
     };
 }, {
@@ -31,7 +31,7 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
     };
     tmNode: {
-        type: PropType<TreeNode<SelectOption, SelectOption, SelectOption>>;
+        type: PropType<TreeNode<SelectOption>>;
         required: true;
     };
 }>>, {}, {}>;

package/es/_internal/select-menu/styles/light.d.ts

@@ -75,12 +75,18 @@ declare const internalSelectMenuLight: import("../../../_mixins").Theme<"Interna
         iconSizeMedium: string;
         iconSizeLarge: string;
         iconSizeHuge: string;
-        fontSizeSmall: string;
-        fontSizeMedium: string;
-        fontSizeLarge: string;
-        fontSizeHuge: string;
-        textColor: string;
+        titleFontSizeSmall: string;
+        titleFontSizeMedium: string;
+        titleFontSizeLarge: string;
+        titleFontSizeHuge: string;
+        descriptionFontSizeSmall: string;
+        descriptionFontSizeMedium: string;
+        descriptionFontSizeLarge: string;
+        descriptionFontSizeHuge: string;
+        titleColor: string;
+        descriptionColor: string;
         iconColor: string;
+        iconBgColor: string;
         extraTextColor: string;
     }, any>;
 }>;