1mpacto-react-ui 2.0.26 → 2.0.28

package/dist/src/components/Button/Button.config.d.ts

@@ -13,6 +13,10 @@ export declare const configButton: {
         'bill-s': string;
         'bill-xs': string;
         'bill-xxs': string;
+        'fin-l': string;
+        'fin-m': string;
+        'fin-s': string;
+        'fin-xs': string;
     };
     loadingSize: {
         large: string;
@@ -28,6 +32,10 @@ export declare const configButton: {
         'bill-s': string;
         'bill-xs': string;
         'bill-xxs': string;
+        'fin-l': string;
+        'fin-m': string;
+        'fin-s': string;
+        'fin-xs': string;
     };
     variants: {
         'primary-laba-blue-10': string;

package/dist/src/components/ButtonIcon/ButtonIcon.config.d.ts

@@ -13,6 +13,10 @@ export declare const configButton: {
         'bill-s': string;
         'bill-xs': string;
         'bill-xxs': string;
+        'fin-l': string;
+        'fin-m': string;
+        'fin-s': string;
+        'fin-xs': string;
     };
     loadingSize: {
         large: string;
@@ -28,6 +32,10 @@ export declare const configButton: {
         'bill-s': string;
         'bill-xs': string;
         'bill-xxs': string;
+        'fin-l': string;
+        'fin-m': string;
+        'fin-s': string;
+        'fin-xs': string;
     };
     variants: {
         'primary-laba-blue-10': string;
@@ -60,6 +68,9 @@ export declare const configButton: {
         'secondary-bill-secondary-800': string;
         'tertiary-bill-secondary-800': string;
         'primary-bill-red-700': string;
+        'primary-fin-primary-500': string;
+        'secondary-fin-primary-500': string;
+        'tertiary-fin-primary-500': string;
     };
 };
 export declare const keysConfigButtonVariant: string[];

package/dist/src/components/Modal/ModalDialog.config.d.ts

@@ -5,5 +5,17 @@ export declare const configModal: {
         regular: string;
         large: string;
     };
+    brand: {
+        '': string;
+        fin: string;
+    };
+    position: {
+        center: string;
+        'right-top': string;
+        'right-bottom': string;
+        'left-top': string;
+        'left-bottom': string;
+    };
 };
 export declare const keysConfigModalSize: string[];
+export declare const keysConfigModalPosition: string[];

package/dist/src/components/Modal/ModalDialog.d.ts

@@ -1,4 +1,4 @@
 import { ElementType } from 'react';
 import { IModalDialog } from '../../interfaces/components/Modal';
-declare const ModalDialog: <T extends ElementType = "div">({ as, children, id, idModal, withOverlay, show, size, className, classNameContainer, onClose, ...props }: IModalDialog<T>) => import("react/jsx-runtime").JSX.Element;
+declare const ModalDialog: <T extends ElementType = "div">({ as, children, id, idModal, withOverlay, show, size, position, className, classNameContainer, onClose, brand, ...props }: IModalDialog<T>) => import('react').ReactPortal | null;
 export default ModalDialog;

package/dist/src/components/Modal/ModalDialog.stories.d.ts

@@ -1,7 +1,7 @@
 import { StoryObj } from '@storybook/react-vite';
 declare const meta: {
     title: string;
-    component: <T extends import('react').ElementType = "div">({ as, children, id, idModal, withOverlay, show, size, className, classNameContainer, onClose, ...props }: import('../../interfaces/components/Modal').IModalDialog<T>) => import("react/jsx-runtime").JSX.Element;
+    component: <T extends import('react').ElementType = "div">({ as, children, id, idModal, withOverlay, show, size, position, className, classNameContainer, onClose, brand, ...props }: import('../../interfaces/components/Modal').IModalDialog<T>) => import('react').ReactPortal | null;
     parameters: {
         layout: string;
     };
@@ -72,6 +72,22 @@ declare const meta: {
                 };
             };
         };
+        position: {
+            control: {
+                type: "select";
+            };
+            options: string[];
+            description: string;
+            table: {
+                category: string;
+                type: {
+                    summary: string;
+                };
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
         className: {
             control: "text";
             description: string;

package/dist/src/components/Pagination/Pagination.config.d.ts

@@ -2,6 +2,7 @@ export declare const configPagination: {
     kind: {
         box: string;
         nude: string;
+        'box-fin': string;
     };
     fonts: {
         inter: {

package/dist/src/components/Pagination/Pagination.d.ts

@@ -1,3 +1,3 @@
 import { IPaginationProps } from '../../interfaces/components/Pagination';
-declare const Pagination: ({ totalData, totalPage, pageNumber, pageSize, className, id, kind, prevIcon, nextIcon, onChange, optionPageSize, offset, zIndex, withGotoPage, withMorePage, withOptionPageSize, locale, fonts, }: IPaginationProps) => import("react/jsx-runtime").JSX.Element;
+declare const Pagination: ({ totalData, totalPage, pageNumber, pageSize, className, id, kind, prevIcon, nextIcon, onChange, optionPageSize, offset, zIndex, withGotoPage, withMorePage, withOptionPageSize, withPageSize, locale, fonts, }: IPaginationProps) => import("react/jsx-runtime").JSX.Element;
 export default Pagination;

package/dist/src/components/Pagination/Pagination.stories.d.ts

@@ -1,7 +1,7 @@
 import { StoryObj } from '@storybook/react-vite';
 declare const meta: {
     title: string;
-    component: ({ totalData, totalPage, pageNumber, pageSize, className, id, kind, prevIcon, nextIcon, onChange, optionPageSize, offset, zIndex, withGotoPage, withMorePage, withOptionPageSize, locale, fonts, }: import('../../interfaces/components/Pagination').IPaginationProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ totalData, totalPage, pageNumber, pageSize, className, id, kind, prevIcon, nextIcon, onChange, optionPageSize, offset, zIndex, withGotoPage, withMorePage, withOptionPageSize, withPageSize, locale, fonts, }: import('../../interfaces/components/Pagination').IPaginationProps) => import("react/jsx-runtime").JSX.Element;
     parameters: {
         layout: string;
     };
@@ -209,6 +209,19 @@ declare const meta: {
                 };
             };
         };
+        withPageSize: {
+            control: "boolean";
+            description: string;
+            table: {
+                category: string;
+                type: {
+                    summary: string;
+                };
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
         id: {
             control: "text";
             description: string;

package/dist/src/components/Popover/Popover.config.d.ts

@@ -0,0 +1,8 @@
+export declare const configPopover: {
+    variant: {
+        white: string;
+        'white-fin': string;
+        'blue-gray-50': string;
+    };
+};
+export declare const keysConfigPopoverVariant: string[];

package/dist/src/components/RadioCheckbox/RadioCheckbox.config.d.ts

@@ -13,6 +13,8 @@ export declare const configRadioCheckbox: {
         'bill-primary-500': string;
         'bill-primary-600-hv_bg_transparent': string;
         'bill-secondary-800-hv_bg_transparent': string;
+        'fin-primary-500-hv_bg_transparent': string;
+        'fin-primary-500': string;
     };
     variantDisableds: {
         'default-disabled-checkbox': string;

package/dist/src/components/RadioCheckbox/RadioCheckboxLabel.config.d.ts

@@ -21,6 +21,7 @@ export declare const configRadioCheckboxLabel: {
         'laba-blue-01': string;
         'blue-50': string;
         'bill-secondary-50': string;
+        'fin-primary-500': string;
         'transparent-text_orange-700': string;
         'transparent-text_green-700': string;
     };

package/dist/src/components/SelectDropdownContainer/SelectDropdownContainer.config.d.ts

@@ -8,19 +8,29 @@ export declare const configSelectDropdownContainer: {
         laba: import('react-select').StylesConfig;
         payhere: import('react-select').StylesConfig;
         bill: import('react-select').StylesConfig;
+        fin: import('react-select').StylesConfig;
+    };
+    variantPopover: {
+        laba: string;
+        payhere: string;
+        bill: string;
+        fin: string;
     };
     noSearchVariant: {
         laba: import('react-select').StylesConfig;
         payhere: import('react-select').StylesConfig;
         bill: import('react-select').StylesConfig;
+        fin: import('react-select').StylesConfig;
     };
     classNamePopover: {
         laba: string;
         payhere: string;
         bill: string;
+        fin: string;
     };
 };
 export declare const keysConfigSelectDropdownContainerError: string[];
 export declare const keysConfigSelectDropdownContainerVariant: string[];
+export declare const keysConfigSelectDropdownContainerVariantPopover: string[];
 export declare const keysConfigSelectDropdownContainerNoSearchVariant: string[];
 export declare const keysConfigSelectDropdownContainerClassNamePopover: string[];

package/dist/src/components/SelectDropdownContainer/styleConfig.d.ts

@@ -2,6 +2,8 @@ import { StylesConfig } from 'react-select';
 export declare const styleSelectDropdownContainerLaba: StylesConfig;
 export declare const styleSelectDropdownContainerPayhere: StylesConfig;
 export declare const styleSelectDropdownContainerBill: StylesConfig;
+export declare const styleSelectDropdownContainerFin: StylesConfig;
 export declare const styleSelectDropdownContainerNoSearchLaba: StylesConfig;
 export declare const styleSelectDropdownContainerNoSearchPayhere: StylesConfig;
 export declare const styleSelectDropdownContainerNoSearchBill: StylesConfig;
+export declare const styleSelectDropdownContainerNoSearchFin: StylesConfig;

package/dist/src/components/Step/StepIndicator.config.d.ts

@@ -0,0 +1,18 @@
+export declare const configStepIndicator: {
+    variants: {
+        'laba-green-08': string;
+        'teal-600': string;
+    };
+    borderRadius: {
+        '0px': string;
+        '2px': string;
+        '4px': string;
+        '6px': string;
+        '8px': string;
+        '12px': string;
+        '16px': string;
+        '24px': string;
+        full: string;
+    };
+};
+export declare const keysConfigStepIndicatorVariant: string[];

package/dist/src/components/Step/StepIndicator.d.ts

@@ -1,3 +1,3 @@
 import { IStepIndicator } from '../../interfaces/components/Step';
-declare const StepIndicator: ({ activeStep, countStep, classNameActiveStepIndicator, classNameContainer, classNameDesc, classNameStepIndicator, id, locationStepIndicator, widthStepIndicator, dynamicWidthStepIndicator, gapStepIndicator, classNameStepIndicatorContainer, }: IStepIndicator) => import("react/jsx-runtime").JSX.Element;
+declare const StepIndicator: ({ activeStep, countStep, classNameActiveStepIndicator, classNameContainer, classNameDesc, classNameStepIndicator, id, locationStepIndicator, widthStepIndicator, dynamicWidthStepIndicator, gapStepIndicator, classNameStepIndicatorContainer, variant, borderRadius, }: IStepIndicator) => import("react/jsx-runtime").JSX.Element;
 export default StepIndicator;

package/dist/src/components/Step/StepIndicator.stories.d.ts

@@ -1,7 +1,7 @@
 import { StoryObj } from '@storybook/react-vite';
 declare const meta: {
     title: string;
-    component: ({ activeStep, countStep, classNameActiveStepIndicator, classNameContainer, classNameDesc, classNameStepIndicator, id, locationStepIndicator, widthStepIndicator, dynamicWidthStepIndicator, gapStepIndicator, classNameStepIndicatorContainer, }: import('../../interfaces/components/Step').IStepIndicator) => import("react/jsx-runtime").JSX.Element;
+    component: ({ activeStep, countStep, classNameActiveStepIndicator, classNameContainer, classNameDesc, classNameStepIndicator, id, locationStepIndicator, widthStepIndicator, dynamicWidthStepIndicator, gapStepIndicator, classNameStepIndicatorContainer, variant, borderRadius, }: import('../../interfaces/components/Step').IStepIndicator) => import("react/jsx-runtime").JSX.Element;
     parameters: {
         layout: string;
     };
@@ -49,6 +49,19 @@ declare const meta: {
                 };
             };
         };
+        variant: {
+            control: {
+                type: "select";
+            };
+            options: string[];
+            description: string;
+            table: {
+                category: string;
+                type: {
+                    summary: string;
+                };
+            };
+        };
         widthStepIndicator: {
             control: "text";
             description: string;
@@ -62,6 +75,22 @@ declare const meta: {
                 };
             };
         };
+        borderRadius: {
+            control: {
+                type: "select";
+            };
+            options: string[];
+            description: string;
+            table: {
+                category: string;
+                type: {
+                    summary: string;
+                };
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
         dynamicWidthStepIndicator: {
             control: "boolean";
             description: string;

package/dist/src/components/Switch/Switch.config.d.ts

@@ -8,17 +8,20 @@ export declare const configSwitch: {
         laba: string;
         payhere: string;
         bill: string;
+        fin: string;
     };
     text: {
         title: {
             laba: string;
             payhere: string;
             bill: string;
+            fin: string;
         };
         desc: {
             laba: string;
             payhere: string;
             bill: string;
+            fin: string;
         };
     };
 };

package/dist/src/components/Tabs/Tabs.config.d.ts

@@ -6,15 +6,21 @@ export declare const configTabs: {
         'container-laba-blue-10': string;
         'container-laba-blue-10-bg_white': string;
         'container-laba-blue-10-bg_blue-01': string;
-        'original-bill-secondary-800': string;
         'container-bill-secondary-800': string;
+        'container-fin-secondary-500': string;
+        'original-bill-secondary-800': string;
         'original-payhere-primary-700': string;
+        'original-fin-primary-100': string;
     };
     size: {
         'tabs-m': string;
         'tabs-s': string;
         'tabs-medium': string;
         'tabs-small': string;
+        'tabs-bill-m': string;
+        'tabs-bill-s': string;
+        'tabs-fin-m': string;
+        'tabs-fin-s': string;
     };
     borderRadius: {
         '0px': string;

package/dist/src/components/Textarea/TextareaFloatingInner.config.d.ts

@@ -2,5 +2,10 @@ export declare const configTextareaFloatingInner: {
     size: {
         medium: string;
     };
+    variants: {
+        'laba-white': string;
+        'fin-blue-gray-50': string;
+    };
 };
 export declare const keysConfigTextareaFloatingInnerSize: string[];
+export declare const keysConfigTextareaFloatingInnerVariant: string[];

package/dist/src/components/fin/Chat/BubbleChat.d.ts

@@ -0,0 +1,3 @@
+import { IBubbleChat } from '../../../interfaces/components/fin/Chat';
+declare const BubbleChat: ({ id, icon, header, content, onCopy, onDislike, onLike, onReply }: IBubbleChat) => import("react/jsx-runtime").JSX.Element;
+export default BubbleChat;

package/dist/src/components/fin/Chat/BubbleChatOption.d.ts

@@ -0,0 +1,3 @@
+import { IBubbleChatOption } from '../../../interfaces/components/fin/Chat';
+declare const BubbleChatOption: ({ id, icon, type, header, content, options, optionDirection, onClick, onCopy, onDislike, onLike, onReply, }: IBubbleChatOption) => import("react/jsx-runtime").JSX.Element;
+export default BubbleChatOption;

package/dist/src/components/fin/Chat/BubbleChatUser.d.ts

@@ -0,0 +1,3 @@
+import { IBubbleChatUser } from '../../../interfaces/components/fin/Chat';
+declare const BubbleChatUser: ({ id, content, otherContentTop, otherContentBottom, onCopy }: IBubbleChatUser) => import("react/jsx-runtime").JSX.Element;
+export default BubbleChatUser;

package/dist/src/components/fin/Chat/Icons.d.ts

@@ -0,0 +1,5 @@
+import { default as React } from 'react';
+export declare const LikeIcon: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+export declare const DislikeIcon: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+export declare const CopyIcon: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+export declare const ReplyIcon: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/src/components/fin/index.d.ts

@@ -0,0 +1,4 @@
+import { default as BubbleChat } from './Chat/BubbleChat';
+import { default as BubbleChatUser } from './Chat/BubbleChatUser';
+import { default as BubbleChatOption } from './Chat/BubbleChatOption';
+export { BubbleChat, BubbleChatUser, BubbleChatOption };

package/dist/src/components/index.d.ts

@@ -84,8 +84,9 @@ import { default as TextareaInnerLabel } from './Textarea/TextareaInnerLabel';
 import { default as InputInnerLabel } from './Input/InputInnerLabel';
 import { default as Text } from './Text/Text';
 import { default as Slider } from './Slider/Slider';
+import { BubbleChat, BubbleChatOption, BubbleChatUser } from './fin';
 import * as utilTable from '@tanstack/react-table';
 import type * as SelectDropdownContainerType from 'react-select';
 import type * as FilterContainerType from '../interfaces/components/FilterContainer';
-export { TPublish, Button, Popover, Calendar, CalendarRange, DatePicker, DateRangePicker, FilterDate, InputFloatingInner, InputReguler, Pagination, Tabs, TabPanel, Table, TableVirtualization, ListVirtualization, SelectDropdownContainer, utilTable, Switch, ButtonIcon, Badges, Chips, RadioCheckbox, RadioCheckboxLabel, Breadcrumbs, Sidebar, Collapse, ModalDialog, SelectDropdownContainerComponents, Timeline, FilterContainer, NumberFormat, PatternFormat, DefaultCheckedChecboxIcon, DefaultRadioChecboxIcon, ConfigTable, PortalComponent, AlertContainer, UploadFile, TruncateComponent, UploadImage, Textarea, DoughnutChart, MonthYearPicker, CheckboxTable, InputNative, UploadMultipleFile, ErrorMessage, TextareaFloatingInner, Step, LineChart, Tooltip, ButtonPopover, GradientLineChart, GradientBarChart, PieChart, StepIndicator, TextEditor, CollapseV2, TableSubComponent, TimeRange, TextareaInnerLabel, InputInnerLabel, Text, Slider, };
+export { TPublish, Button, Popover, Calendar, CalendarRange, DatePicker, DateRangePicker, FilterDate, InputFloatingInner, InputReguler, Pagination, Tabs, TabPanel, Table, TableVirtualization, ListVirtualization, SelectDropdownContainer, utilTable, Switch, ButtonIcon, Badges, Chips, RadioCheckbox, RadioCheckboxLabel, Breadcrumbs, Sidebar, Collapse, ModalDialog, SelectDropdownContainerComponents, Timeline, FilterContainer, NumberFormat, PatternFormat, DefaultCheckedChecboxIcon, DefaultRadioChecboxIcon, ConfigTable, PortalComponent, AlertContainer, UploadFile, TruncateComponent, UploadImage, Textarea, DoughnutChart, MonthYearPicker, CheckboxTable, InputNative, UploadMultipleFile, ErrorMessage, TextareaFloatingInner, Step, LineChart, Tooltip, ButtonPopover, GradientLineChart, GradientBarChart, PieChart, StepIndicator, TextEditor, CollapseV2, TableSubComponent, TimeRange, TextareaInnerLabel, InputInnerLabel, Text, Slider, BubbleChat, BubbleChatOption, BubbleChatUser, };
 export type { ITableColumnDef, IRefPopover, IRefTableVirtualization, IRefListVirtualization, IRefSelectDropdownContainer, IChildrenSelectDropdownContainer, ISidebarModule, SelectDropdownContainerType, FilterContainerType, IInputReguler, IInputFloatingInner, ITableConfig, TButtonVariants, TButtonSize, ITabsList, TTypeEventTabs, ITextarea, IListVirtualization, ITableVirtualization, IRefSidebar, IChildrenIconCompany, ICloneElementSidebar, IDataDoughnutChart, IDataInnerLabelDoughnutChart, ISelectDropdownContainer, IDatePicker, IPopover, IInputNative, IUploadMultipleFileValue, IDataStepList, IDataLineChart, IChips, IRefButtonPopover, TGradientLineChartCustomTooltip, IGradientLineChart, IGradientLineChartDataSet, IGradientLineChartData, TGradientBarChartCustomTooltip, IGradientBarChart, IGradientBarChartDataSet, IGradientBarChartData, IFilterDateButtonList, TKeyFilterDateButtonListType, IDataGradientBarChartCustomTooltip, IDataGradientLineChartCustomTooltip, IPieChart, IPieChartDataSet, IPieChartData, TPieChartCustomTooltip, IDataPieChartCustomTooltip, IPieChartThreshold, ITextEditorProps, ICollapse, ITableColumnBreakpoint, TTableRenderSubComponent, TTableHandlerRowClick, TKeyLocale, ITimeRangeListTime, ITimeRange, TTimeRangeValue, IButton, TButtonIconVariants, TButtonIconSize, IButtonIcon, ISidebar, ISlider, };

package/dist/src/config/components/typography.d.ts

@@ -1,3 +1,3 @@
-export type Itypography = 'payhere-h1' | 'payhere-h2' | 'payhere-h3' | 'payhere-h4' | 'payhere-h5' | 'payhere-h6' | 'payhere-body-lr' | 'payhere-body-lm' | 'payhere-body-ls' | 'payhere-body-lb' | 'payhere-body-mr' | 'payhere-body-mm' | 'payhere-body-ms' | 'payhere-body-mb' | 'payhere-label-r' | 'payhere-label-m' | 'payhere-label-sb' | 'payhere-label-b' | 'payhere-body-sr' | 'payhere-body-sm' | 'payhere-body-smb' | 'payhere-body-sb' | 'payhere-body-esr' | 'payhere-body-esm' | 'payhere-body-esmb' | 'payhere-body-esb' | 'laba-title-lb' | 'laba-title-ls' | 'laba-title-lr' | 'laba-title-mb' | 'laba-title-ms' | 'laba-title-mr' | 'laba-h1' | 'laba-h1-b' | 'laba-h1-sb' | 'laba-h1-r' | 'laba-h2' | 'laba-h2-b' | 'laba-h2-sb' | 'laba-h2-r' | 'laba-base-rb' | 'laba-base-rs' | 'laba-base-rr' | 'laba-base-sb' | 'laba-base-ss' | 'laba-base-sr' | 'laba-subtitle-rb' | 'laba-subtitle-rs' | 'laba-subtitle-rr' | 'laba-subtitle-sb' | 'laba-subtitle-ss' | 'laba-subtitle-sr' | 'bill-h1' | 'bill-h2' | 'bill-h3' | 'bill-h4' | 'bill-h5' | 'bill-h6' | 'bill-body-lr' | 'bill-body-lm' | 'bill-body-lsm' | 'bill-body-blb' | 'bill-body-mr' | 'bill-body-mm' | 'bill-body-msm' | 'bill-body-mb' | 'bill-label-r' | 'bill-label-m' | 'bill-label-sm' | 'bill-label-b' | 'bill-body-sr' | 'bill-body-sm' | 'bill-body-ssm' | 'bill-body-sb' | 'bill-body-esr' | 'bill-body-ems' | 'bill-body-essm' | 'bill-body-esb';
+export type Itypography = 'payhere-h1' | 'payhere-h2' | 'payhere-h3' | 'payhere-h4' | 'payhere-h5' | 'payhere-h6' | 'payhere-body-lr' | 'payhere-body-lm' | 'payhere-body-ls' | 'payhere-body-lb' | 'payhere-body-mr' | 'payhere-body-mm' | 'payhere-body-ms' | 'payhere-body-mb' | 'payhere-label-r' | 'payhere-label-m' | 'payhere-label-sb' | 'payhere-label-b' | 'payhere-body-sr' | 'payhere-body-sm' | 'payhere-body-smb' | 'payhere-body-sb' | 'payhere-body-esr' | 'payhere-body-esm' | 'payhere-body-esmb' | 'payhere-body-esb' | 'laba-title-lb' | 'laba-title-ls' | 'laba-title-lr' | 'laba-title-mb' | 'laba-title-ms' | 'laba-title-mr' | 'laba-h1' | 'laba-h1-b' | 'laba-h1-sb' | 'laba-h1-r' | 'laba-h2' | 'laba-h2-b' | 'laba-h2-sb' | 'laba-h2-r' | 'laba-base-rb' | 'laba-base-rs' | 'laba-base-rr' | 'laba-base-sb' | 'laba-base-ss' | 'laba-base-sr' | 'laba-subtitle-rb' | 'laba-subtitle-rs' | 'laba-subtitle-rr' | 'laba-subtitle-sb' | 'laba-subtitle-ss' | 'laba-subtitle-sr' | 'bill-h1' | 'bill-h2' | 'bill-h3' | 'bill-h4' | 'bill-h5' | 'bill-h6' | 'bill-body-lr' | 'bill-body-lm' | 'bill-body-lsb' | 'bill-body-lb' | 'bill-body-mr' | 'bill-body-mm' | 'bill-body-msb' | 'bill-body-mb' | 'bill-label-r' | 'bill-label-m' | 'bill-label-sm' | 'bill-label-b' | 'bill-body-sr' | 'bill-body-sm' | 'bill-body-ssb' | 'bill-body-sb' | 'bill-body-esr' | 'bill-body-esm' | 'bill-body-essm' | 'bill-body-esb' | 'fin-h1' | 'fin-h2' | 'fin-h3' | 'fin-h4' | 'fin-h5' | 'fin-h6' | 'fin-body-lr' | 'fin-body-lm' | 'fin-body-lsb' | 'fin-body-lb' | 'fin-body-mr' | 'fin-body-mm' | 'fin-body-msb' | 'fin-body-mb' | 'fin-label-r' | 'fin-label-m' | 'fin-label-sm' | 'fin-label-b' | 'fin-body-sr' | 'fin-body-sr-lh_24' | 'fin-body-sm' | 'fin-body-sm-lh_24' | 'fin-body-ssb' | 'fin-body-ssb-lh_24' | 'fin-body-sb' | 'fin-body-sb-lh_24' | 'fin-body-esr' | 'fin-body-esm' | 'fin-body-essb' | 'fin-body-esb' | 'fin-body-tiny-r' | 'fin-body-tiny-m' | 'fin-body-tiny-sb' | 'fin-body-tiny-b';
 export declare const configtypography: Record<Itypography, string>;
 export declare const keysTypography: string[];

package/dist/src/interfaces/components/Badges/index.d.ts

@@ -2,6 +2,11 @@ import { ReactNode } from 'react';
 import { IBorderRadius } from '../../../config/components/borderRadius';
 import { Itypography } from '../../../config/components/typography';
 import { TFont } from '../../../config/components/font';
+/**
+ * [ID] : Tipe varian Badges yang tersedia.
+ * [EN] : Available Badges variant types.
+ */
+export type TBadgesVariants = 'filled-gray-600' | 'filled-green-600' | 'filled-green-50' | 'filled-blue-gray-50' | 'filled-red-500' | 'filled-blue-600' | 'filled-amber-800' | 'filled-pink-600' | 'filled-lime-700' | 'filled-lime-900-bg_lime-100' | 'filled-red-900' | 'filled-laba-green-10' | 'filled-cyan-800-bg_cyan-100' | 'filled-blue-gray-800' | 'filled-green-700' | 'filled-red-800' | 'filled-light-blue-800' | 'filled-orange-400' | 'ghost-gray-200' | 'ghost-green-100' | 'ghost-red-100' | 'ghost-blue-100' | 'ghost-amber-100' | 'ghost-laba-orange-01' | 'ghost-laba-green-01' | 'ghost-laba-green-02' | 'ghost-laba-blue-02' | 'ghost-laba-blue-01' | 'ghost-laba-grey-05' | 'ghost-laba-red-01' | 'ghost-blue-gray-600' | 'ghost-green-700' | 'ghost-red-600' | 'ghost-light-blue-800' | 'ghost-orange-600' | 'outline-gray-600' | 'outline-green-600' | 'outline-red-500' | 'outline-blue-600' | 'outline-amber-800' | 'outline-laba-blue-01' | 'outline-laba-orange-06' | 'outline-laba-orange-06-bg_laba-orange-01' | 'outline-laba-red-06' | 'outline-laba-green-06' | 'outline-blue-gray-600' | 'outline-green-700' | 'outline-red-600' | 'outline-light-blue-800' | 'outline-orange-600';
 /**
  * [ID] : Interface untuk komponen Badges.
  * [EN] : Interface for Badges component.
@@ -26,7 +31,7 @@ export interface IBadges extends React.HTMLAttributes<HTMLSpanElement> {
      * [ID] : Varian gaya badge (opsional).
      * [EN] : Badge style variant (optional).
      */
-    variants?: 'filled-gray-600' | 'filled-green-600' | 'filled-green-50' | 'filled-blue-gray-50' | 'filled-red-500' | 'filled-blue-600' | 'filled-amber-800' | 'filled-pink-600' | 'filled-lime-700' | 'filled-lime-900-bg_lime-100' | 'filled-red-900' | 'filled-laba-green-10' | 'filled-cyan-800-bg_cyan-100' | 'ghost-gray-200' | 'ghost-green-100' | 'ghost-red-100' | 'ghost-blue-100' | 'ghost-amber-100' | 'ghost-laba-orange-01' | 'ghost-laba-green-01' | 'ghost-laba-green-02' | 'ghost-laba-blue-02' | 'ghost-laba-blue-01' | 'ghost-laba-grey-05' | 'ghost-laba-red-01' | 'outline-gray-600' | 'outline-green-600' | 'outline-red-500' | 'outline-blue-600' | 'outline-amber-800' | 'outline-laba-blue-01' | 'outline-laba-orange-06' | 'outline-laba-orange-06-bg_laba-orange-01' | 'outline-laba-red-06' | 'outline-laba-green-06';
+    variants?: TBadgesVariants;
     /**
      * [ID] : Konfigurasi font (opsional).
      * [EN] : Font configuration (optional).

package/dist/src/interfaces/components/Breadcrumbs/index.d.ts

@@ -21,7 +21,7 @@ export interface IBreadcrumbs<T extends ElementType> extends HTMLAttributes<HTML
      * [ID] : Varian gaya breadcrumbs (opsional).
      * [EN] : Breadcrumbs style variant (optional).
      */
-    variants?: 'laba-blue-10' | 'blue-700' | 'bill-secondary-800';
+    variants?: 'laba-blue-10' | 'blue-700' | 'bill-secondary-800' | 'fin-blue-gray-500';
     /**
      * [ID] : Daftar URL untuk setiap breadcrumb.
      * [EN] : List of URLs for each breadcrumb.

package/dist/src/interfaces/components/Button/index.d.ts

@@ -8,7 +8,7 @@ export type TButtonVariants = 'primary-laba-blue-10' | 'primary-red-700-dsb_laba
  * [ID] : Tipe ukuran tombol.
  * [EN] : Button size type.
  */
-export type TButtonSize = 'large' | 'reguler' | 'small' | 'extra-small' | 'l' | 'm' | 's' | 'xs' | 'bill-l' | 'bill-m' | 'bill-s' | 'bill-xs' | 'bill-xxs';
+export type TButtonSize = 'large' | 'reguler' | 'small' | 'extra-small' | 'l' | 'm' | 's' | 'xs' | 'bill-l' | 'bill-m' | 'bill-s' | 'bill-xs' | 'bill-xxs' | 'fin-l' | 'fin-m' | 'fin-s' | 'fin-xs';
 /**
  * [ID] : Interface untuk komponen Button.
  * [EN] : Interface for Button component.

package/dist/src/interfaces/components/ButtonIcon/index.d.ts

@@ -3,12 +3,12 @@ import { ReactNode } from 'react';
  * [ID] : Tipe varian tombol ikon.
  * [EN] : Button icon variant types.
  */
-export type TButtonIconVariants = 'primary-laba-blue-10' | 'primary-red-700-dsb_laba-grey-06' | 'primary-green-700-dsb_laba-grey-06' | 'filled-laba-white_laba-blue-10' | 'filled-laba-white_laba-red-05' | 'ghost-laba-blue-10' | 'ghost-red-700' | 'ghost-green-700' | 'ghost-blue-gray-100-bg_white' | 'ghost-laba-green-10' | 'nude-laba-blue-10' | 'nude-red-700' | 'nude-green-700' | 'nude-gray-500' | 'nude-laba-red-10' | 'nude-laba-red-05' | 'primary-blue-700' | 'primary-red-700' | 'secondary-blue-700' | 'secondary-red-600' | 'secondary-green-600' | 'tertiary-blue-700' | 'tertiary-red-300' | 'tertiary-red-600' | 'tertiary-gray-500' | 'secondary-red-700' | 'primary-bill-primary-600' | 'secondary-bill-secondary-800' | 'tertiary-bill-secondary-800' | 'primary-bill-red-700';
+export type TButtonIconVariants = 'primary-laba-blue-10' | 'primary-red-700-dsb_laba-grey-06' | 'primary-green-700-dsb_laba-grey-06' | 'filled-laba-white_laba-blue-10' | 'filled-laba-white_laba-red-05' | 'ghost-laba-blue-10' | 'ghost-red-700' | 'ghost-green-700' | 'ghost-blue-gray-100-bg_white' | 'ghost-laba-green-10' | 'nude-laba-blue-10' | 'nude-red-700' | 'nude-green-700' | 'nude-gray-500' | 'nude-laba-red-10' | 'nude-laba-red-05' | 'primary-blue-700' | 'primary-red-700' | 'secondary-blue-700' | 'secondary-red-600' | 'secondary-green-600' | 'tertiary-blue-700' | 'tertiary-red-300' | 'tertiary-red-600' | 'tertiary-gray-500' | 'secondary-red-700' | 'primary-bill-primary-600' | 'secondary-bill-secondary-800' | 'tertiary-bill-secondary-800' | 'primary-bill-red-700' | 'primary-fin-primary-500' | 'secondary-fin-primary-500' | 'tertiary-fin-primary-500';
 /**
  * [ID] : Tipe ukuran tombol ikon.
  * [EN] : Button icon size type.
  */
-export type TButtonIconSize = 'large' | 'reguler' | 'small' | 'extra-small' | 'l' | 'm' | 's' | 'xs' | 'bill-l' | 'bill-m' | 'bill-s' | 'bill-xs' | 'bill-xxs';
+export type TButtonIconSize = 'large' | 'reguler' | 'small' | 'extra-small' | 'l' | 'm' | 's' | 'xs' | 'bill-l' | 'bill-m' | 'bill-s' | 'bill-xs' | 'bill-xxs' | 'fin-l' | 'fin-m' | 'fin-s' | 'fin-xs';
 /**
  * [ID] : Interface untuk komponen ButtonIcon.
  * [EN] : Interface for ButtonIcon component.

package/dist/src/interfaces/components/Modal/index.d.ts

@@ -50,6 +50,16 @@ export interface IModalDialog<T extends ElementType> {
      * [EN] : Show overlay (optional).
      */
     withOverlay?: boolean;
+    /**
+     * [ID] : Merek (opsional).
+     * [EN] : Brand (optional).
+     */
+    brand?: 'fin' | '';
+    /**
+     * [ID] : Posisi modal (opsional).
+     * [EN] : Modal position (optional).
+     */
+    position?: 'center' | 'right-top' | 'right-bottom' | 'left-top' | 'left-bottom';
     /**
      * [ID] : Handler saat modal ditutup (opsional).
      * [EN] : Handler when modal is closed (optional).

package/dist/src/interfaces/components/Pagination/index.d.ts

@@ -6,7 +6,7 @@ import { TFont } from '../../../config/components/font';
  * [ID] : Tipe jenis pagination.
  * [EN] : Pagination kind type.
  */
-export type TKindPaginationType = 'box' | 'nude';
+export type TKindPaginationType = 'box' | 'nude' | 'box-fin';
 /**
  * [ID] : Interface dasar pagination.
  * [EN] : Basic pagination interface.
@@ -89,6 +89,11 @@ export interface IPaginationProps extends IPagination {
      * [EN] : Z-index (optional).
      */
     zIndex?: number | undefined | string;
+    /**
+     * [ID] : Menampilkan ukuran halaman (opsional).
+     * [EN] : Show size options (optional).
+     */
+    withPageSize?: boolean;
     /**
      * [ID] : Menampilkan opsi ukuran halaman (opsional).
      * [EN] : Show page size options (optional).

package/dist/src/interfaces/components/Popover/index.d.ts

@@ -90,6 +90,11 @@ export interface IPopover extends React.HTMLAttributes<HTMLDivElement> {
      * [EN] : Dismiss properties (optional).
      */
     useDismissProps?: UseDismissProps;
+    /**
+     * [ID] : Varian gaya (opsional).
+     * [EN] : Style variant (optional).
+     */
+    variant?: 'white' | 'blue-gray-50' | 'white-fin';
 }
 /**
  * [ID] : Interface untuk referensi Popover.

package/dist/src/interfaces/components/RadioCheckbox/RadioCheckbox.d.ts

@@ -36,7 +36,7 @@ export interface IRadioCheckbox extends InputHTMLAttributes<HTMLInputElement> {
      * [ID] : Varian gaya (opsional).
      * [EN] : Style variant (optional).
      */
-    variants?: 'laba-blue-10' | 'blue-700' | 'blue-700-hv_bg_transparent' | 'laba-blue-10-hv_bg_transparent' | 'bill-primary-500' | 'bill-primary-600-hv_bg_transparent' | 'bill-secondary-800-hv_bg_transparent';
+    variants?: 'laba-blue-10' | 'blue-700' | 'blue-700-hv_bg_transparent' | 'laba-blue-10-hv_bg_transparent' | 'bill-primary-500' | 'bill-primary-600-hv_bg_transparent' | 'bill-secondary-800-hv_bg_transparent' | 'fin-primary-500' | 'fin-primary-500-hv_bg_transparent';
     /**
      * [ID] : Varian gaya non-aktif (opsional).
      * [EN] : Disabled style variant (optional).

package/dist/src/interfaces/components/RadioCheckbox/RadioCheckboxLabel.d.ts

@@ -42,7 +42,7 @@ export interface IRadioCheckboxLabel extends InputHTMLAttributes<HTMLInputElemen
      * [ID] : Varian gaya (opsional).
      * [EN] : Style variant (optional).
      */
-    variants?: 'blue-50' | 'laba-blue-01' | 'bill-secondary-50' | 'transparent-text_orange-700' | 'transparent-text_green-700';
+    variants?: 'blue-50' | 'laba-blue-01' | 'bill-secondary-50' | 'fin-primary-500' | 'transparent-text_orange-700' | 'transparent-text_green-700';
     /**
      * [ID] : Label input.
      * [EN] : Input label.

package/dist/src/interfaces/components/SelectDropdownContainer/index.d.ts

@@ -1,6 +1,7 @@
 import { default as React } from 'react';
 import { Props as SelectProps, ActionMeta, GroupBase, SelectComponentsConfig, MultiValue, SingleValue } from 'react-select';
 import { AutoPlacementOptions, FlipOptions, OffsetOptions, UseFloatingOptions } from '@floating-ui/react';
+import { TKeyLocale } from '../Calendar';
 /**
  * [ID] : Interface untuk komponen SelectDropdownContainer.
  * [EN] : Interface for SelectDropdownContainer component.
@@ -163,7 +164,12 @@ export interface ISelectDropdownContainer<T> extends Omit<SelectProps<T, boolean
      * [ID] : Tipe kontrol (opsional).
      * [EN] : Control type (optional).
      */
-    controlType?: 'laba' | 'payhere' | 'bill';
+    controlType?: 'laba' | 'payhere' | 'bill' | 'fin';
+    /**
+     * [ID] : Lokal bahasa (opsional).
+     * [EN] : Locale (optional).
+     */
+    locale?: TKeyLocale;
 }
 /**
  * [ID] : Interface untuk properti anak SelectDropdownContainer.

package/dist/src/interfaces/components/Step/index.d.ts

@@ -1,4 +1,5 @@
 import { default as React } from 'react';
+import { IBorderRadius } from '../../../config/components/borderRadius';
 /**
  * [ID] : Interface untuk data daftar langkah.
  * [EN] : Interface for step list data.
@@ -173,7 +174,7 @@ export interface IStepIndicator {
      * [ID] : Lokasi indikator langkah (opsional).
      * [EN] : Step indicator location (optional).
      */
-    locationStepIndicator?: 'left' | 'right';
+    locationStepIndicator?: 'left' | 'right' | 'hide';
     /**
      * [ID] : Lebar indikator langkah (opsional).
      * [EN] : Step indicator width (optional).
@@ -188,10 +189,20 @@ export interface IStepIndicator {
      * [ID] : Jarak indikator langkah (opsional).
      * [EN] : Step indicator gap (optional).
      */
-    gapStepIndicator?: string;
+    gapStepIndicator?: string | number;
     /**
      * [ID] : Nama kelas CSS kontainer indikator langkah (opsional).
      * [EN] : Step indicator container CSS class name (optional).
      */
     classNameStepIndicatorContainer?: string;
+    /**
+     * [ID] : Varian warna (opsional).
+     * [EN] : Color variant (optional).
+     */
+    variant?: 'laba-green-08' | 'teal-600';
+    /**
+     * [ID] : Radius sudut (opsional).
+     * [EN] : Border radius (optional).
+     */
+    borderRadius?: IBorderRadius;
 }