@useinsider/ab-components 0.0.44 → 0.0.47

package/dist/index.d.ts

@@ -3,6 +3,7 @@ import { ComponentProvideOptions } from 'vue';
 import { DefineComponent } from 'vue';
 import { Placement } from '@floating-ui/vue';
 import { PublicProps } from 'vue';
+import { Ref } from 'vue';
 
 declare const __VLS_component: DefineComponent<__VLS_Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {
 tooltipRef: HTMLDivElement;
@@ -11,11 +12,11 @@ triggerRef: HTMLDivElement;
 }, any>;
 
 declare const __VLS_component_2: DefineComponent<ModalProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
-close: () => any;
 submit: () => any;
+close: () => any;
 }, string, PublicProps, Readonly<ModalProps> & Readonly<{
-onClose?: (() => any) | undefined;
 onSubmit?: (() => any) | undefined;
+onClose?: (() => any) | undefined;
 }>, {
 hasOverlay: boolean;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
@@ -31,6 +32,139 @@ descriptionText: string;
 fullWidthContentStatus: boolean;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
+declare const __VLS_component_4: DefineComponent<InBasicTextInputProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+click: (event: MouseEvent) => any;
+input: (value: string | number) => any;
+blur: (event: FocusEvent) => any;
+change: (value: string | number) => any;
+focus: (event: FocusEvent) => any;
+keypress: (event: KeyboardEvent) => any;
+keyup: (event: KeyboardEvent) => any;
+paste: (event: ClipboardEvent) => any;
+"update:modelValue": (value: string | number) => any;
+leftIconClick: (event: MouseEvent) => any;
+rightIconClick: (event: MouseEvent) => any;
+}, string, PublicProps, Readonly<InBasicTextInputProps> & Readonly<{
+onClick?: ((event: MouseEvent) => any) | undefined;
+onInput?: ((value: string | number) => any) | undefined;
+onBlur?: ((event: FocusEvent) => any) | undefined;
+onChange?: ((value: string | number) => any) | undefined;
+onFocus?: ((event: FocusEvent) => any) | undefined;
+onKeypress?: ((event: KeyboardEvent) => any) | undefined;
+onKeyup?: ((event: KeyboardEvent) => any) | undefined;
+onPaste?: ((event: ClipboardEvent) => any) | undefined;
+"onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
+onLeftIconClick?: ((event: MouseEvent) => any) | undefined;
+onRightIconClick?: ((event: MouseEvent) => any) | undefined;
+}>, {
+leftIconName: IconNames;
+rightIconName: IconNames;
+type: "text" | "number";
+modelValue: string | number;
+preventXss: boolean;
+theme: "grey" | "white";
+labelStatus: boolean;
+labelText: string;
+states: "default" | "error" | "warning";
+disabledStatus: boolean;
+readonly: boolean;
+leftIconStatus: boolean;
+rightIconStatus: boolean;
+suffixTextStatus: boolean;
+suffixText: string;
+autoComplete: string;
+maxCharacterLength: number | string;
+minValue: number | string;
+maxValue: number | string;
+autoFocus: boolean;
+allowDecimal: boolean;
+allowComma: boolean;
+helperMessageStatus: boolean;
+helperMessage: string;
+stateMessage: string;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {
+componentRoot: HTMLFieldSetElement;
+textInput: HTMLInputElement;
+}, HTMLFieldSetElement>;
+
+declare const __VLS_component_5: DefineComponent<InDropdownMenuProps, {
+isOpen: Ref<boolean, boolean>;
+toggleMenu: () => void;
+closeMenu: () => void;
+selectedItem: Ref<    {
+text: string;
+value: string;
+} | null, MenuItem | {
+text: string;
+value: string;
+} | null>;
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+"update:modelValue": (value: string) => any;
+"add-error": (error: string) => any;
+"item-added": (item: MenuItem) => any;
+"select-item": (item: MenuItem) => any;
+}, string, PublicProps, Readonly<InDropdownMenuProps> & Readonly<{
+"onUpdate:modelValue"?: ((value: string) => any) | undefined;
+"onAdd-error"?: ((error: string) => any) | undefined;
+"onItem-added"?: ((item: MenuItem) => any) | undefined;
+"onSelect-item"?: ((item: MenuItem) => any) | undefined;
+}>, {
+modelValue: string;
+menuHeight: number;
+addable: boolean;
+addButtonText: string;
+searchable: boolean;
+validateAddItem: (item: string, items: MenuItem[]) => string | null;
+searchPlaceholder: string;
+showSelectedIcon: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+declare const __VLS_component_6: DefineComponent<PopoverProps, {
+isOpen: Ref<boolean, boolean>;
+toggle: () => void;
+close: () => void;
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+close: () => any;
+"update:modelValue": (value: boolean) => any;
+open: () => any;
+}, string, PublicProps, Readonly<PopoverProps> & Readonly<{
+onClose?: (() => any) | undefined;
+"onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+onOpen?: (() => any) | undefined;
+}>, {
+modelValue: boolean;
+align: "left" | "center" | "right";
+}, {}, {}, {}, string, ComponentProvideOptions, false, {
+popoverRef: HTMLDivElement;
+contentRef: HTMLDivElement;
+}, HTMLDivElement>;
+
+declare const __VLS_component_7: DefineComponent<InBoxProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<InBoxProps> & Readonly<{}>, {
+border: string;
+borderRadius: string;
+borderTriangle: boolean;
+borderTrianglePosition: string;
+borderTriangleAlign: string;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+declare const __VLS_component_8: DefineComponent<ColorPickerProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+close: () => any;
+"color-change": (color: string) => any;
+}, string, PublicProps, Readonly<ColorPickerProps> & Readonly<{
+onClose?: (() => any) | undefined;
+"onColor-change"?: ((color: string) => any) | undefined;
+}>, {
+color: string;
+title: string;
+showSaveButton: boolean;
+presetColors: string[];
+showOpacityInHex: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {
+colorPickerRef: HTMLDivElement;
+hueSliderRef: HTMLDivElement;
+opacitySliderRef: HTMLDivElement;
+}, HTMLDivElement>;
+
 declare type __VLS_Props = {
     id: string;
     text: string;
@@ -72,12 +206,92 @@ declare function __VLS_template_3(): {
     rootEl: HTMLDivElement;
 };
 
+declare function __VLS_template_4(): {
+    attrs: Partial<{}>;
+    slots: {
+        leftSlot?(_: {}): any;
+        rightSlot?(_: {}): any;
+    };
+    refs: {
+        componentRoot: HTMLFieldSetElement;
+        textInput: HTMLInputElement;
+    };
+    rootEl: HTMLFieldSetElement;
+};
+
+declare function __VLS_template_5(): {
+    attrs: Partial<{}>;
+    slots: {
+        trigger?(_: {
+            isOpen: boolean;
+            toggle: () => void;
+        }): any;
+        item?(_: {
+            item: {
+                text: string;
+                value: string;
+            };
+            isSelected: boolean;
+        }): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+
+declare function __VLS_template_6(): {
+    attrs: Partial<{}>;
+    slots: {
+        trigger?(_: {
+            isOpen: boolean;
+            toggle: () => void;
+        }): any;
+        default?(_: {}): any;
+    };
+    refs: {
+        popoverRef: HTMLDivElement;
+        contentRef: HTMLDivElement;
+    };
+    rootEl: HTMLDivElement;
+};
+
+declare function __VLS_template_7(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+
+declare function __VLS_template_8(): {
+    attrs: Partial<{}>;
+    slots: {
+        tabs?(_: {}): any;
+    };
+    refs: {
+        colorPickerRef: HTMLDivElement;
+        hueSliderRef: HTMLDivElement;
+        opacitySliderRef: HTMLDivElement;
+    };
+    rootEl: HTMLDivElement;
+};
+
 declare type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 
 declare type __VLS_TemplateResult_2 = ReturnType<typeof __VLS_template_2>;
 
 declare type __VLS_TemplateResult_3 = ReturnType<typeof __VLS_template_3>;
 
+declare type __VLS_TemplateResult_4 = ReturnType<typeof __VLS_template_4>;
+
+declare type __VLS_TemplateResult_5 = ReturnType<typeof __VLS_template_5>;
+
+declare type __VLS_TemplateResult_6 = ReturnType<typeof __VLS_template_6>;
+
+declare type __VLS_TemplateResult_7 = ReturnType<typeof __VLS_template_7>;
+
+declare type __VLS_TemplateResult_8 = ReturnType<typeof __VLS_template_8>;
+
 declare type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;
@@ -96,45 +310,122 @@ declare type __VLS_WithTemplateSlots_3<T, S> = T & {
     };
 };
 
+declare type __VLS_WithTemplateSlots_4<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_5<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_6<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_7<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_8<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+export declare type AllIconNames = IconNames | CustomIconNames;
+
 export declare const Button: DefineComponent<ButtonProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
 click: (event: MouseEvent) => any;
 }, string, PublicProps, Readonly<ButtonProps> & Readonly<{
 onClick?: ((event: MouseEvent) => any) | undefined;
 }>, {
 size: "default" | "small";
+iconSize: 16 | 24;
 loadingStatus: boolean;
 successStatus: boolean;
 disabled: boolean;
 fill: boolean;
+selected: boolean;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLButtonElement>;
 
 declare interface ButtonProps {
     variant: 'solid' | 'ghost' | 'text' | 'outline';
-    color: 'primary' | 'subtle-primary' | 'secondary' | 'danger' | 'warning' | 'smart';
+    color: 'primary' | 'subtle-primary' | 'secondary' | 'neutral' | 'danger' | 'warning' | 'smart';
     size?: 'default' | 'small';
-    leftIconName?: IconNames;
-    rightIconName?: IconNames;
+    leftIconName?: AllIconNames;
+    rightIconName?: AllIconNames;
+    iconSize?: 16 | 24;
+    iconColor?: string;
     loadingStatus?: boolean;
     successStatus?: boolean;
     label?: string;
     disabled?: boolean;
     fill?: boolean;
+    selected?: boolean;
+    customClass?: string;
 }
 
+export declare const ColorPicker: __VLS_WithTemplateSlots_8<typeof __VLS_component_8, __VLS_TemplateResult_8["slots"]>;
+
+declare interface ColorPickerProps {
+    color?: string;
+    title?: string;
+    showSaveButton?: boolean;
+    presetColors?: string[];
+    showOpacityInHex?: boolean;
+}
+
+declare type CustomIconNames = keyof typeof customIconObjects;
+
+declare const customIconObjects: {
+    readonly 'mixed-text-color-icon': {
+        readonly viewBox: "0 0 24 24";
+        readonly content: "\n        <path d=\"M20 18H4C2.9 18 2 18.9 2 20C2 21.1 2.9 22 4 22H20C21.1 22 22 21.1 22 20C22 18.9 21.1 18 20 18Z\" fill=\"url(#pattern0_5043_65214)\"/>\n        <path d=\"M11.9997 2C12.3784 2 12.7248 2.21401 12.8942 2.55273L18.8942 14.5527C19.1412 15.0467 18.9409 15.6475 18.447 15.8945C17.953 16.1414 17.3521 15.9412 17.1052 15.4473L15.3815 12H8.61785L6.89422 15.4473C6.6472 15.9412 6.04637 16.1415 5.55242 15.8945C5.05863 15.6475 4.85828 15.0466 5.10516 14.5527L11.1052 2.55273L11.1764 2.43164C11.3613 2.16374 11.6683 2.00009 11.9997 2ZM9.61785 10H14.3815L11.9997 5.23633L9.61785 10Z\" fill=\"#495366\"/>\n        <defs>\n        <pattern id=\"pattern0_5043_65214\" patternContentUnits=\"objectBoundingBox\" width=\"1\" height=\"1\">\n        <use xlink:href=\"#image0_5043_65214\" transform=\"matrix(0.05 0 0 0.25 0 -0.25)\"/>\n        </pattern>\n        <image id=\"image0_5043_65214\" width=\"20\" height=\"6\" preserveAspectRatio=\"none\" xlink:href=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAGCAYAAADDl76dAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAADOSURBVHgBrZFLagJBFEXP608K8zGdBGeBBJJpCIS4kEBmWVPWEAi4CRciTh04EBE/TdMqbZVX2qkg4oUzeXXrVnGfBSPQAt5FW3yIN/EMw9TozGL+eg364yd4/Nb8B/wr/A/gt8vFKOcr/aTdemGdGxGxLj+IpmiIlFoVhJDg/CVZfIclGUQyBJ35vTdz3Jjj+jbC3Qdc0yvwkIyTFHFmHRl4/HeTXVdMxFwUYk3dk54yq1hawXTjCdWVuis19HV+KdNkRRFKFrl86n63lC1PDzizA2gvbQAAAABJRU5ErkJggg==\"/>\n        </defs>";
+    };
+    readonly 'mixed-fill-color-icon': {
+        readonly viewBox: "0 0 24 24";
+        readonly content: "\n        <path d=\"M19 2.5C20.3807 2.5 21.5 3.61929 21.5 5V19C21.5 20.3807 20.3807 21.5 19 21.5H5C3.61929 21.5 2.5 20.3807 2.5 19V5C2.5 3.61929 3.61929 2.5 5 2.5H19Z\" fill=\"url(#pattern0_5681_20639)\" stroke=\"#E1E1E1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n        <defs>\n        <pattern id=\"pattern0_5681_20639\" patternContentUnits=\"objectBoundingBox\" width=\"1\" height=\"1\">\n        <use xlink:href=\"#image0_5681_20639\" transform=\"scale(0.0416667)\"/>\n        </pattern>\n        <image id=\"image0_5681_20639\" width=\"24\" height=\"24\" preserveAspectRatio=\"none\" xlink:href=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAATmSURBVHgBTZYJct02EEQHC8mvb9mVVDlJVXKC3CD3v0oqXrQvfyMJYPIalFyWi4a4oKenpzGj8M/f7q25BQ+WrdkQol3Hap/5/Xd3+602++yr/dJm+2Rn25dX2/uNjfWb7dp/NpZ/Wb9YbneW/ADOah6KmYHJ/7kUN/0E7laPPHZbWrCZ11pXr7bwrPGv1pUvL9Z8AehkoR0sA5rbyaLuIcALsAQdzGOD9E8/4JvirS1a4cPCvbJrBFGAwGVeLLYLOGdLBjABFdRC7YzZ2oO8s84o0+Xx/rz1j1CpZ6R8AjfR3/e8BYFZdO/f61kTeAymEFGbkVjfAEB27ExcPTBX4sMQiyWYJ2kI+/z2e0/7PVWeeGexkRCGWDh7Q/KNYUaiMsAqRtXERjamVG3ifuSDtC7AqPhkUSMG4C5kgHUNAAxIOPBsgD2xskA37VNWMPa2D9FqaBs34oz8NsAq1Qo4gF1zveI7mSBSNgJ5HKnNaJ5ZCZgVfAClExbbnr7l9Vc2DUhCmlsx0VG2pdrhKEKRIICWZlpQH9YZM2DquCPQFWaYLGdw0DEImCA2aS1I9EcxH0kpbrUo5FqwcT2xosIC6Joo5MyGmrv+iAhrmA+DlZQsJ4IOCYnIc3CrO7JntYkaLH8WG6ZoMyCx8YCDtQB2PuLqK7Pjzm1/aLa7kOUKEQLIKSXpQmOAFZco1B3dd60H8Wnp2eT1L+sSKb2I7oHDlU/U4dRsvHZW2BxI61SsFU4pNbF4oU4na5mDlY4YgzUv3X2SJXLBlABREnm30w8Trki1Z98FtsiUzoCfITDP1uqMKw+46dE+pAcC3VmMDwC/sPnAbg4fQWLQ2djOS14/A8CNnNRa7xcWrij1guRLtXqh8Ng1rDMKvNjO7+yj3VKKrxC6IcA9wK+9baSydDOQaneeKGf/VLqHk3oNmc28CBRHPaMiSShba5gA+OQPOO0GN31lx3e23/LuAUvT5AD3ebG4oAJxfN3WbOhcW1XTAVQ2JLMdoNgpIMlIY1vswKtH7HjDy6/9ivE7+t4T4Bnm9KIZMtQtnCnwMfbOoH6aw6TCcQHoY0VjpKqOUgsv1VOPfPwC4K2N8Rt+p00TaLQ7SvfCNZsvMBfwsF2mdoNp/EyR83SGPEBDe+uSsGgrhWRTPHfdh/RI+yBA+mL7qAC3trNnmyi41TP10iGEb1KbkI3V7GK3bp7GV+qCWE1958I128CaccQOO472xPrIdW/7/N124YaLgGSV5BoVFhd6TL2jtt5toT9w+LB73ud7ILGghkY4I8vJBieIEyQekeWVxvdkU3jagsQnguIYKhPb1qbVnhLdwBkGft17tDWM0jikeT/c44wTLwWI8ZsAFyQ64RxOeXoBHJmQJBMsI5sKn/Ge2kvIMoROM+eGU9xS6P53MsgTAXYcmEK6hQCaTmIteUYYjqmwIkM4bNML8Gg6sTID7MPaD6fT4iPtvVG/qLlAf3I1RyZsvqJoM4UMUeYlbQZ2RrIoz+qEBI1D3snUKl6Q67ZJJrdo6Gi6uSbclPswW6vaxUThqcE17Gd/tlPUQF9/jEHNXo/qTaUfezXyPpl9m7VNPuzzjecCEh0oN023lLcDRXfNHwG+wLL6q21jZxuBYkmjYPj3vyf6Wni+eawpH5zE1AsbqaJCt20yqqWHRK9vH+x//WrzK98GywMAAAAASUVORK5CYII=\"/>\n        </defs>";
+    };
+    readonly 'mixed-border-color-icon': {
+        readonly viewBox: "0 0 24 24";
+        readonly content: "\n        <path class=\"preserve-fill\" d=\"M19 2.5C20.3807 2.5 21.5 3.61929 21.5 5V19C21.5 20.3807 20.3807 21.5 19 21.5H5C3.61929 21.5 2.5 20.3807 2.5 19V5C2.5 3.61929 3.61929 2.5 5 2.5H19ZM8.11133 7.5C7.77382 7.5 7.5 7.77382 7.5 8.11133V15.8887C7.5 16.2262 7.77382 16.5 8.11133 16.5H15.8887C16.2262 16.5 16.5 16.2262 16.5 15.8887V8.11133C16.5 7.77382 16.2262 7.5 15.8887 7.5H8.11133Z\" fill=\"url(#pattern0_5699_20986)\" stroke=\"#E1E1E1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n        <defs>\n        <pattern id=\"pattern0_5699_20986\" patternContentUnits=\"objectBoundingBox\" width=\"1\" height=\"1\">\n        <use xlink:href=\"#image0_5699_20986\" transform=\"scale(0.0416667)\"/>\n        </pattern>\n        <image id=\"image0_5699_20986\" width=\"24\" height=\"24\" preserveAspectRatio=\"none\" xlink:href=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAATmSURBVHgBTZYJct02EEQHC8mvb9mVVDlJVXKC3CD3v0oqXrQvfyMJYPIalFyWi4a4oKenpzGj8M/f7q25BQ+WrdkQol3Hap/5/Xd3+602++yr/dJm+2Rn25dX2/uNjfWb7dp/NpZ/Wb9YbneW/ADOah6KmYHJ/7kUN/0E7laPPHZbWrCZ11pXr7bwrPGv1pUvL9Z8AehkoR0sA5rbyaLuIcALsAQdzGOD9E8/4JvirS1a4cPCvbJrBFGAwGVeLLYLOGdLBjABFdRC7YzZ2oO8s84o0+Xx/rz1j1CpZ6R8AjfR3/e8BYFZdO/f61kTeAymEFGbkVjfAEB27ExcPTBX4sMQiyWYJ2kI+/z2e0/7PVWeeGexkRCGWDh7Q/KNYUaiMsAqRtXERjamVG3ifuSDtC7AqPhkUSMG4C5kgHUNAAxIOPBsgD2xskA37VNWMPa2D9FqaBs34oz8NsAq1Qo4gF1zveI7mSBSNgJ5HKnNaJ5ZCZgVfAClExbbnr7l9Vc2DUhCmlsx0VG2pdrhKEKRIICWZlpQH9YZM2DquCPQFWaYLGdw0DEImCA2aS1I9EcxH0kpbrUo5FqwcT2xosIC6Joo5MyGmrv+iAhrmA+DlZQsJ4IOCYnIc3CrO7JntYkaLH8WG6ZoMyCx8YCDtQB2PuLqK7Pjzm1/aLa7kOUKEQLIKSXpQmOAFZco1B3dd60H8Wnp2eT1L+sSKb2I7oHDlU/U4dRsvHZW2BxI61SsFU4pNbF4oU4na5mDlY4YgzUv3X2SJXLBlABREnm30w8Trki1Z98FtsiUzoCfITDP1uqMKw+46dE+pAcC3VmMDwC/sPnAbg4fQWLQ2djOS14/A8CNnNRa7xcWrij1guRLtXqh8Ng1rDMKvNjO7+yj3VKKrxC6IcA9wK+9baSydDOQaneeKGf/VLqHk3oNmc28CBRHPaMiSShba5gA+OQPOO0GN31lx3e23/LuAUvT5AD3ebG4oAJxfN3WbOhcW1XTAVQ2JLMdoNgpIMlIY1vswKtH7HjDy6/9ivE7+t4T4Bnm9KIZMtQtnCnwMfbOoH6aw6TCcQHoY0VjpKqOUgsv1VOPfPwC4K2N8Rt+p00TaLQ7SvfCNZsvMBfwsF2mdoNp/EyR83SGPEBDe+uSsGgrhWRTPHfdh/RI+yBA+mL7qAC3trNnmyi41TP10iGEb1KbkI3V7GK3bp7GV+qCWE1958I128CaccQOO472xPrIdW/7/N124YaLgGSV5BoVFhd6TL2jtt5toT9w+LB73ud7ILGghkY4I8vJBieIEyQekeWVxvdkU3jagsQnguIYKhPb1qbVnhLdwBkGft17tDWM0jikeT/c44wTLwWI8ZsAFyQ64RxOeXoBHJmQJBMsI5sKn/Ge2kvIMoROM+eGU9xS6P53MsgTAXYcmEK6hQCaTmIteUYYjqmwIkM4bNML8Gg6sTID7MPaD6fT4iPtvVG/qLlAf3I1RyZsvqJoM4UMUeYlbQZ2RrIoz+qEBI1D3snUKl6Q67ZJJrdo6Gi6uSbclPswW6vaxUThqcE17Gd/tlPUQF9/jEHNXo/qTaUfezXyPpl9m7VNPuzzjecCEh0oN023lLcDRXfNHwG+wLL6q21jZxuBYkmjYPj3vyf6Wni+eawpH5zE1AsbqaJCt20yqqWHRK9vH+x//WrzK98GywMAAAAASUVORK5CYII=\"/>\n        </defs>";
+    };
+    readonly 'transparent-text-color-icon': {
+        readonly viewBox: "0 0 24 24";
+        readonly content: "\n        <path d=\"M20 18H4C2.9 18 2 18.9 2 20C2 21.1 2.9 22 4 22H20C21.1 22 22 21.1 22 20C22 18.9 21.1 18 20 18Z\" fill=\"url(#pattern0_5699_16553)\"/>\n        <path class=\"transparent-fill\" d=\"M20 18H4C2.9 18 2 18.9 2 20C2 21.1 2.9 22 4 22H20C21.1 22 22 21.1 22 20C22 18.9 21.1 18 20 18Z\"/>\n        <path class=\"preserve-fill\" fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M11.9999 2C12.3787 2 12.725 2.21401 12.8945 2.55273L18.8945 14.5527C19.1414 15.0467 18.9412 15.6475 18.4472 15.8945C17.9532 16.1414 17.3523 15.9412 17.1054 15.4473L15.3818 12H8.61809L6.89446 15.4473C6.64743 15.9412 6.0466 16.1415 5.55266 15.8945C5.05887 15.6475 4.85852 15.0466 5.10539 14.5527L11.1054 2.55273L11.1767 2.43164C11.3616 2.16374 11.6686 2.00009 11.9999 2ZM9.61809 10H14.3818L11.9999 5.23633L9.61809 10Z\" fill=\"#495366\"/>\n        <defs>\n        <pattern id=\"pattern0_5699_16553\" patternContentUnits=\"objectBoundingBox\" width=\"1\" height=\"1\">\n        <use xlink:href=\"#image0_5699_16553\" transform=\"scale(0.05 0.25)\"/>\n        </pattern>\n        <image id=\"image0_5699_16553\" width=\"20\" height=\"4\" preserveAspectRatio=\"none\" xlink:href=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAECAYAAACOXx+WAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAuSURBVHgBrY45EQAwDMPcXrCYPx6TyTMEQaxFp00vGzSSRiCJS3+YCdfZtv2wAIDSIZT/uGh0AAAAAElFTkSuQmCC\"/>\n        </defs>";
+    };
+    readonly 'transparent-fill-color-icon': {
+        readonly viewBox: "0 0 24 24";
+        readonly content: "\n        <path class=\"preserve-fill\" d=\"M19 2.5C20.3807 2.5 21.5 3.61929 21.5 5V19C21.5 20.3807 20.3807 21.5 19 21.5H5C3.61929 21.5 2.5 20.3807 2.5 19V5C2.5 3.61929 3.61929 2.5 5 2.5H19Z\" fill=\"url(#pattern0_5699_13077)\"/>\n        <path class=\"transparent-fill\" d=\"M19 2.5C20.3807 2.5 21.5 3.61929 21.5 5V19C21.5 20.3807 20.3807 21.5 19 21.5H5C3.61929 21.5 2.5 20.3807 2.5 19V5C2.5 3.61929 3.61929 2.5 5 2.5H19Z\"/>\n        <path class=\"transparent-fill\" d=\"M19 2.5C20.3807 2.5 21.5 3.61929 21.5 5V19C21.5 20.3807 20.3807 21.5 19 21.5H5C3.61929 21.5 2.5 20.3807 2.5 19V5C2.5 3.61929 3.61929 2.5 5 2.5H19Z\" stroke=\"#E1E1E1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n        <defs>\n        <pattern id=\"pattern0_5699_13077\" patternContentUnits=\"objectBoundingBox\" width=\"1\" height=\"1\">\n        <use xlink:href=\"#image0_5699_13077\" transform=\"scale(0.0416667)\"/>\n        </pattern>\n        <image id=\"image0_5699_13077\" width=\"24\" height=\"24\" preserveAspectRatio=\"none\" xlink:href=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAElSURBVHgB7ZWxioRAEER7jlHQwEAFDUz8/38yUVADDQwUVLjbGq6b9mDXY0HYwIJhe33i2GXZmu+H6Fdd19E0Ta72PI/KsmRETdPQPM+uDsOQiqIQVlUV7fvu6iiKKM9zYV90sS7fwLRtKxbBFiwWWwLBFta2bW79h1n2HIJ38JBPxDNh4ThfCBsPwyAsTVOy1roa19PscoustgTi9vCrGVKiW9dsXVdSYTwwc8f0TKaua7EoCAK3WOM4So3WOSmwQ6fvFbM66zqKeKCaxXF8iKlm8FzHVLPrY6rfQr47CK1qhv/PGGKKBaFzze6Ynso82hOLkiSRmMLLvu/lxCzLZAQsy3IYaK+Y1fMF0nPkGfs7kn3fl5hiA80+54Pz7sfojumpfgBl1ghs9EsbCQAAAABJRU5ErkJggg==\"/>\n        </defs>";
+    };
+    readonly 'transparent-border-color-icon': {
+        readonly viewBox: "0 0 24 24";
+        readonly content: "\n        <path class=\"preserve-fill\" d=\"M19 2.5C20.3807 2.5 21.5 3.61929 21.5 5V19C21.5 20.3807 20.3807 21.5 19 21.5H5C3.61929 21.5 2.5 20.3807 2.5 19V5C2.5 3.61929 3.61929 2.5 5 2.5H19ZM8.11133 7.5C7.77382 7.5 7.5 7.77382 7.5 8.11133V15.8887C7.5 16.2262 7.77382 16.5 8.11133 16.5H15.8887C16.2262 16.5 16.5 16.2262 16.5 15.8887V8.11133C16.5 7.77382 16.2262 7.5 15.8887 7.5H8.11133Z\" fill=\"url(#pattern0_5699_9951)\"/>\n        <path class=\"transparent-fill\" d=\"M19 2.5C20.3807 2.5 21.5 3.61929 21.5 5V19C21.5 20.3807 20.3807 21.5 19 21.5H5C3.61929 21.5 2.5 20.3807 2.5 19V5C2.5 3.61929 3.61929 2.5 5 2.5H19ZM8.11133 7.5C7.77382 7.5 7.5 7.77382 7.5 8.11133V15.8887C7.5 16.2262 7.77382 16.5 8.11133 16.5H15.8887C16.2262 16.5 16.5 16.2262 16.5 15.8887V8.11133C16.5 7.77382 16.2262 7.5 15.8887 7.5H8.11133Z\"/>\n        <path class=\"transparent-fill\" d=\"M19 2.5C20.3807 2.5 21.5 3.61929 21.5 5V19C21.5 20.3807 20.3807 21.5 19 21.5H5C3.61929 21.5 2.5 20.3807 2.5 19V5C2.5 3.61929 3.61929 2.5 5 2.5H19ZM8.11133 7.5C7.77382 7.5 7.5 7.77382 7.5 8.11133V15.8887C7.5 16.2262 7.77382 16.5 8.11133 16.5H15.8887C16.2262 16.5 16.5 16.2262 16.5 15.8887V8.11133C16.5 7.77382 16.2262 7.5 15.8887 7.5H8.11133Z\" stroke=\"#E1E1E1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n        <defs>\n        <pattern id=\"pattern0_5699_9951\" patternContentUnits=\"objectBoundingBox\" width=\"1\" height=\"1\">\n        <use xlink:href=\"#image0_5699_9951\" transform=\"scale(0.0416667)\"/>\n        </pattern>\n        <image id=\"image0_5699_9951\" width=\"24\" height=\"24\" preserveAspectRatio=\"none\" xlink:href=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAElSURBVHgB7ZWxioRAEER7jlHQwEAFDUz8/38yUVADDQwUVLjbGq6b9mDXY0HYwIJhe33i2GXZmu+H6Fdd19E0Ta72PI/KsmRETdPQPM+uDsOQiqIQVlUV7fvu6iiKKM9zYV90sS7fwLRtKxbBFiwWWwLBFta2bW79h1n2HIJ38JBPxDNh4ThfCBsPwyAsTVOy1roa19PscoustgTi9vCrGVKiW9dsXVdSYTwwc8f0TKaua7EoCAK3WOM4So3WOSmwQ6fvFbM66zqKeKCaxXF8iKlm8FzHVLPrY6rfQr47CK1qhv/PGGKKBaFzze6Ynso82hOLkiSRmMLLvu/lxCzLZAQsy3IYaK+Y1fMF0nPkGfs7kn3fl5hiA80+54Pz7sfojumpfgBl1ghs9EsbCQAAAABJRU5ErkJggg==\"/>\n        </defs>";
+    };
+};
+
 export declare const DropdownMenu: DefineComponent<DropdownProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
 "update:modelValue": (value: string) => any;
 "add-error": (error: string) => any;
-"item-added": (item: MenuItem) => any;
-"select-item": (item: MenuItem) => any;
+"item-added": (item: MenuItem_2) => any;
+"select-item": (item: MenuItem_2) => any;
 }, string, PublicProps, Readonly<DropdownProps> & Readonly<{
 "onUpdate:modelValue"?: ((value: string) => any) | undefined;
 "onAdd-error"?: ((error: string) => any) | undefined;
-"onItem-added"?: ((item: MenuItem) => any) | undefined;
-"onSelect-item"?: ((item: MenuItem) => any) | undefined;
+"onItem-added"?: ((item: MenuItem_2) => any) | undefined;
+"onSelect-item"?: ((item: MenuItem_2) => any) | undefined;
 }>, {
 modelValue: string;
 menuHeight: number;
-validateAddItem: (item: string, items: MenuItem[]) => string | null;
+validateAddItem: (item: string, items: MenuItem_2[]) => string | null;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {
 dropdownRef: HTMLDivElement;
 menuRef: HTMLDivElement;
@@ -150,25 +441,83 @@ declare interface DropdownProps {
     addButtonText?: string;
     searchable?: boolean;
     searchPlaceHolder?: string;
-    items: MenuItem[];
-    validateAddItem?: (item: string, items: MenuItem[]) => string | null;
+    items: MenuItem_2[];
+    validateAddItem?: (item: string, items: MenuItem_2[]) => string | null;
 }
 
 export declare const Icon: DefineComponent<IconProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<IconProps> & Readonly<{}>, {
-size: 16 | 24;
-}, {}, {}, {}, string, ComponentProvideOptions, false, {}, SVGSVGElement>;
+size: number | string;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
 /**
  * Automatically generated icon types.
  *
  * NOTE: This file was auto-generated from 'icons.svg'
  */
-export declare type IconNames = 'icon-info-box-error' | 'icon-tooltip-info' | 'filled-info-circle' | 'line-caution-triangle' | 'filled-error-box' | 'filled-info-circle' | 'line-check-natural' | 'loading-circle' | 'icon-smart' | 'line-reset' | 'gamification-icon' | 'popup-icon' | 'line-arrow-left' | 'line-academy-02' | 'line-undo' | 'line-redo' | 'line-ai-message-reply-plus' | 'line-architect-segments-closed' | 'line-ai-send-icon' | 'line-smart-sirius-ai' | 'line-smart-ai' | 'line-minus-netural' | 'line-check-netural' | 'filled-caution-triangle' | 'line-tooltip';
+export declare type IconNames = 'icon-info-box-error' | 'icon-tooltip-info' | 'filled-info-circle' | 'filled-caution-circle' | 'filled-caution-triangle' | 'filled-caution-triangle-colored' | 'filled-error-box-colored' | 'line-plus-netural' | 'line-close-netural' | 'no-color' | 'line-search' | 'filled-dropdown-down' | 'filled-text-bold' | 'filled-text-italic' | 'filled-text-underline' | 'filled-text-strikethrough' | 'line-caution-triangle' | 'filled-error-box' | 'filled-info-circle' | 'line-check-natural' | 'loading-circle' | 'icon-smart' | 'line-reset' | 'line-arrow-left' | 'line-academy-02' | 'line-undo' | 'line-redo' | 'line-ai-message-reply-plus' | 'line-architect-segments-closed' | 'line-ai-send-icon' | 'line-smart-sirius-ai' | 'line-smart-ai' | 'line-minus-netural' | 'line-check-netural' | 'filled-caution-triangle' | 'line-tooltip' | 'gamification-icon' | 'popup-icon';
 
 declare interface IconProps {
-    name: IconNames;
-    size?: 16 | 24;
+    name: AllIconNames;
+    size?: number | string;
     color?: string;
+    fillOpacity?: number | string;
+}
+
+export declare const InBasicTextInput: __VLS_WithTemplateSlots_4<typeof __VLS_component_4, __VLS_TemplateResult_4["slots"]>;
+
+declare interface InBasicTextInputProps {
+    id: string;
+    name: string;
+    theme?: "grey" | "white";
+    modelValue?: string | number;
+    labelStatus?: boolean;
+    labelText?: string;
+    type?: "text" | "number";
+    states?: "default" | "error" | "warning";
+    placeholderText: string;
+    disabledStatus?: boolean;
+    readonly?: boolean;
+    leftIconStatus?: boolean;
+    leftIconName?: IconNames;
+    rightIconStatus?: boolean;
+    rightIconName?: IconNames;
+    suffixTextStatus?: boolean;
+    suffixText?: string;
+    autoComplete?: string;
+    maxCharacterLength?: number | string;
+    minValue?: number | string;
+    maxValue?: number | string;
+    autoFocus?: boolean;
+    allowDecimal?: boolean;
+    allowComma?: boolean;
+    preventXss?: boolean;
+    helperMessageStatus?: boolean;
+    helperMessage?: string;
+    stateMessage?: string;
+}
+
+export declare const InBox: __VLS_WithTemplateSlots_7<typeof __VLS_component_7, __VLS_TemplateResult_7["slots"]>;
+
+declare interface InBoxProps {
+    border?: string;
+    borderRadius?: string;
+    borderTriangle?: boolean;
+    borderTrianglePosition?: string;
+    borderTriangleAlign?: string;
+}
+
+export declare const InDropdownMenu: __VLS_WithTemplateSlots_5<typeof __VLS_component_5, __VLS_TemplateResult_5["slots"]>;
+
+declare interface InDropdownMenuProps {
+    modelValue?: string;
+    items: MenuItem[];
+    menuHeight?: number;
+    searchable?: boolean;
+    searchPlaceholder?: string;
+    addable?: boolean;
+    addButtonText?: string;
+    validateAddItem?: (item: string, items: MenuItem[]) => string | null;
+    showSelectedIcon?: boolean;
 }
 
 export declare const InInfoBox: __VLS_WithTemplateSlots_3<typeof __VLS_component_3, __VLS_TemplateResult_3["slots"]>;
@@ -185,8 +534,62 @@ export declare interface InInfoBoxProps {
     fullWidthContentStatus?: boolean;
 }
 
-export declare const InTextArea: DefineComponent<InTextAreaProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+export declare const InputButton: DefineComponent<InputButtonProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
 click: (event: MouseEvent) => any;
+"input-change": (value: string) => any;
+}, string, PublicProps, Readonly<InputButtonProps> & Readonly<{
+onClick?: ((event: MouseEvent) => any) | undefined;
+"onInput-change"?: ((value: string) => any) | undefined;
+}>, {
+size: "default" | "small";
+iconSize: 16 | 24;
+loadingStatus: boolean;
+successStatus: boolean;
+disabled: boolean;
+fill: boolean;
+inputValue: string;
+inputPlaceholder: string;
+inputType: "text" | "number";
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLButtonElement>;
+
+declare interface InputButtonProps {
+    variant: 'solid' | 'ghost' | 'text' | 'outline';
+    color: 'primary' | 'subtle-primary' | 'secondary' | 'neutral' | 'danger' | 'warning' | 'smart';
+    size?: 'default' | 'small';
+    rightIconName?: IconNames;
+    iconSize?: 16 | 24;
+    loadingStatus?: boolean;
+    successStatus?: boolean;
+    disabled?: boolean;
+    fill?: boolean;
+    customClass?: string;
+    inputValue?: string;
+    inputPlaceholder?: string;
+    inputType?: 'text' | 'number';
+}
+
+export declare const InTabs: DefineComponent<InTabsProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+change: (value: string) => any;
+"update:modelValue": (value: string) => any;
+}, string, PublicProps, Readonly<InTabsProps> & Readonly<{
+onChange?: ((value: string) => any) | undefined;
+"onUpdate:modelValue"?: ((value: string) => any) | undefined;
+}>, {
+disabled: boolean;
+modelValue: string;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+declare interface InTabsProps {
+    tabs: TabItem[];
+    modelValue?: string;
+    disabled?: boolean;
+}
+
+export declare const InTextArea: DefineComponent<InTextAreaProps, {
+textareaRef: Ref<HTMLTextAreaElement | undefined, HTMLTextAreaElement | undefined>;
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+click: (event: MouseEvent) => any;
+blur: (event: FocusEvent) => any;
 cut: (event: ClipboardEvent) => any;
 keypress: (event: KeyboardEvent) => any;
 keyup: (event: KeyboardEvent) => any;
@@ -194,6 +597,7 @@ paste: (event: ClipboardEvent) => any;
 "update:modelValue": (value: string) => any;
 }, string, PublicProps, Readonly<InTextAreaProps> & Readonly<{
 onClick?: ((event: MouseEvent) => any) | undefined;
+onBlur?: ((event: FocusEvent) => any) | undefined;
 onCut?: ((event: ClipboardEvent) => any) | undefined;
 onKeypress?: ((event: KeyboardEvent) => any) | undefined;
 onKeyup?: ((event: KeyboardEvent) => any) | undefined;
@@ -230,7 +634,32 @@ export declare interface InTextAreaProps {
     maxLength?: number;
 }
 
-declare interface MenuItem {
+export declare const InToggle: DefineComponent<InToggleProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+click: (checked: boolean) => any;
+"update:modelValue": (value: boolean) => any;
+}, string, PublicProps, Readonly<InToggleProps> & Readonly<{
+onClick?: ((checked: boolean) => any) | undefined;
+"onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+}>, {
+disabled: boolean;
+checked: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {
+inputRef: HTMLInputElement;
+}, HTMLFieldSetElement>;
+
+declare interface InToggleProps {
+    id: string;
+    name: string;
+    checked?: boolean;
+    disabled?: boolean;
+}
+
+export declare interface MenuItem {
+    text: string;
+    value: string;
+}
+
+declare interface MenuItem_2 {
     text: string;
     value: string;
 }
@@ -263,9 +692,9 @@ onPaste?: ((event: ClipboardEvent) => any) | undefined;
 }>, {
 size: "default" | "small";
 label: string;
+placeholder: string;
 error: string;
 modelValue: number;
-placeholder: string;
 maxLength: number;
 min: number;
 max: number;
@@ -280,6 +709,13 @@ declare interface OnPageMessageProps {
     text: string;
 }
 
+export declare const Popover: __VLS_WithTemplateSlots_6<typeof __VLS_component_6, __VLS_TemplateResult_6["slots"]>;
+
+declare interface PopoverProps {
+    modelValue?: boolean;
+    align?: 'left' | 'center' | 'right';
+}
+
 declare interface Props {
     id: string;
     name: string;
@@ -338,6 +774,12 @@ declare interface SegmentType {
     icon?: IconNames;
 }
 
+export declare interface TabItem {
+    value: string;
+    label: string;
+    disabled?: boolean;
+}
+
 export declare const TextInput: DefineComponent<Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
 input: (event: Event) => any;
 blur: (event: FocusEvent) => any;
@@ -354,9 +796,9 @@ onPaste?: ((event: ClipboardEvent) => any) | undefined;
 "onUpdate:modelValue"?: ((args_0: string | undefined) => any) | undefined;
 }>, {
 label: string;
+placeholder: string;
 error: string;
 modelValue: string;
-placeholder: string;
 maxHeight: number;
 maxLength: number;
 multiline: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/ab-components",
-  "version": "0.0.44",
+  "version": "0.0.47",
   "type": "module",
   "files": [
     "dist"
@@ -29,6 +29,8 @@
     "test:unit": "vitest",
     "build-only": "vite build",
     "type-check": "vue-tsc --build",
+    "pack:move": "npm pack --pack-destination ../design-editor",
+    "publish:def": "npm run build && npm run pack:move && cd ../design-editor && npm i ./useinsider-ab-components-0.0.47.tgz && npm run dev",
     "lint": "eslint . --fix",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build"