@webiny/admin-ui 6.4.12-beta.4 → 6.5.0-beta.0

package/Slider/Slider.d.ts

@@ -7,21 +7,22 @@ import type { FormComponentProps } from "../FormComponent/index.js";
 type SliderProps = FormComponentProps & SliderPrimitiveProps & {
     labelPosition?: "top" | "side";
 };
-declare const Slider: (({ description, note, hint, validation, labelPosition, ...props }: SliderProps) => React.JSX.Element) & {
-    original: ({ description, note, hint, validation, labelPosition, ...props }: SliderProps) => React.JSX.Element;
+declare const DecoratableSlider: ({ description, note, hint, validation, labelPosition, ...props }: SliderProps) => React.JSX.Element;
+declare const Slider: typeof DecoratableSlider & {
+    original: typeof DecoratableSlider;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ description, note, hint, validation, labelPosition, ...props }: SliderProps) => React.JSX.Element) & {
-        original: ({ description, note, hint, validation, labelPosition, ...props }: SliderProps) => React.JSX.Element;
+    original: typeof DecoratableSlider & {
+        original: typeof DecoratableSlider;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ description, note, hint, validation, labelPosition, ...props }: SliderProps) => React.JSX.Element) & {
-        original: ({ description, note, hint, validation, labelPosition, ...props }: SliderProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableSlider & {
+        original: typeof DecoratableSlider;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/SteppedProgress/SteppedProgress.d.ts

@@ -3,21 +3,22 @@ import type { ProgressItemParams } from "./domains/index.js";
 interface SteppedProgressProps extends React.HTMLAttributes<HTMLDivElement> {
     items: ProgressItemParams[];
 }
-declare const SteppedProgress: (({ items, ...props }: SteppedProgressProps) => React.JSX.Element) & {
-    original: ({ items, ...props }: SteppedProgressProps) => React.JSX.Element;
+declare const DecoratableSteppedProgress: ({ items, ...props }: SteppedProgressProps) => React.JSX.Element;
+declare const SteppedProgress: typeof DecoratableSteppedProgress & {
+    original: typeof DecoratableSteppedProgress;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ items, ...props }: SteppedProgressProps) => React.JSX.Element) & {
-        original: ({ items, ...props }: SteppedProgressProps) => React.JSX.Element;
+    original: typeof DecoratableSteppedProgress & {
+        original: typeof DecoratableSteppedProgress;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ items, ...props }: SteppedProgressProps) => React.JSX.Element) & {
-        original: ({ items, ...props }: SteppedProgressProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableSteppedProgress & {
+        original: typeof DecoratableSteppedProgress;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/SteppedProgress/SteppedProgressItem.d.ts

@@ -1,21 +1,22 @@
 import React from "react";
 import { type ProgressItemFormatted } from "./domains/index.js";
 type SteppedProgressItemProps = React.HTMLAttributes<HTMLDivElement> & ProgressItemFormatted;
-declare const SteppedProgressItem: (({ label, state, errored, disabled, className, ...props }: SteppedProgressItemProps) => React.JSX.Element) & {
-    original: ({ label, state, errored, disabled, className, ...props }: SteppedProgressItemProps) => React.JSX.Element;
+declare const DecoratableSteppedProgressItem: ({ label, state, errored, disabled, className, ...props }: SteppedProgressItemProps) => React.JSX.Element;
+declare const SteppedProgressItem: typeof DecoratableSteppedProgressItem & {
+    original: typeof DecoratableSteppedProgressItem;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ label, state, errored, disabled, className, ...props }: SteppedProgressItemProps) => React.JSX.Element) & {
-        original: ({ label, state, errored, disabled, className, ...props }: SteppedProgressItemProps) => React.JSX.Element;
+    original: typeof DecoratableSteppedProgressItem & {
+        original: typeof DecoratableSteppedProgressItem;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ label, state, errored, disabled, className, ...props }: SteppedProgressItemProps) => React.JSX.Element) & {
-        original: ({ label, state, errored, disabled, className, ...props }: SteppedProgressItemProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableSteppedProgressItem & {
+        original: typeof DecoratableSteppedProgressItem;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/Switch/Switch.d.ts

@@ -2,21 +2,22 @@ import React from "react";
 import type { SwitchPrimitiveProps } from "./primitives/index.js";
 import type { FormComponentProps } from "../FormComponent/index.js";
 type SwitchProps = SwitchPrimitiveProps & FormComponentProps;
-declare const Switch: (({ note, validation, ...props }: SwitchProps) => React.JSX.Element) & {
-    original: ({ note, validation, ...props }: SwitchProps) => React.JSX.Element;
+declare const DecoratableSwitch: ({ note, validation, ...props }: SwitchProps) => React.JSX.Element;
+declare const Switch: typeof DecoratableSwitch & {
+    original: typeof DecoratableSwitch;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ note, validation, ...props }: SwitchProps) => React.JSX.Element) & {
-        original: ({ note, validation, ...props }: SwitchProps) => React.JSX.Element;
+    original: typeof DecoratableSwitch & {
+        original: typeof DecoratableSwitch;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ note, validation, ...props }: SwitchProps) => React.JSX.Element) & {
-        original: ({ note, validation, ...props }: SwitchProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableSwitch & {
+        original: typeof DecoratableSwitch;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/Switch/primitives/SwitchPrimitive.d.ts

@@ -14,21 +14,25 @@ type SwitchPrimitiveProps = Omit<SwitchPrimitives.SwitchProps, "defaultChecked"
 type SwitchPrimitivVm = {
     item?: SwitchItemFormatted;
 };
-declare const SwitchPrimitive: ((props: SwitchPrimitiveProps) => React.JSX.Element | null) & {
-    original: (props: SwitchPrimitiveProps) => React.JSX.Element | null;
+/**
+ * Switch
+ */
+declare const DecoratableSwitchPrimitive: (props: SwitchPrimitiveProps) => React.JSX.Element | null;
+declare const SwitchPrimitive: typeof DecoratableSwitchPrimitive & {
+    original: typeof DecoratableSwitchPrimitive;
     originalName: string;
     displayName: string;
 } & {
-    original: ((props: SwitchPrimitiveProps) => React.JSX.Element | null) & {
-        original: (props: SwitchPrimitiveProps) => React.JSX.Element | null;
+    original: typeof DecoratableSwitchPrimitive & {
+        original: typeof DecoratableSwitchPrimitive;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<((props: SwitchPrimitiveProps) => React.JSX.Element | null) & {
-        original: (props: SwitchPrimitiveProps) => React.JSX.Element | null;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableSwitchPrimitive & {
+        original: typeof DecoratableSwitchPrimitive;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/Table/Table.d.ts

@@ -1,20 +1,22 @@
 import * as React from "react";
 import { type VariantProps } from "../utils.js";
+import { Body, Caption, Cell, Direction, Footer, Head, Header, Resizer, Row } from "../Table/components/index.js";
 declare const tableVariants: (props?: ({
     bordered?: boolean | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 interface TableProps extends React.HTMLAttributes<HTMLTableElement>, VariantProps<typeof tableVariants> {
     sticky?: boolean;
 }
-declare const Table: (({ className, bordered, sticky, ...props }: TableProps) => React.JSX.Element) & {
-    Body: ({ className, ...props }: React.HTMLAttributes<HTMLTableSectionElement>) => React.JSX.Element;
-    Caption: ({ className, ...props }: React.HTMLAttributes<HTMLTableCaptionElement>) => React.JSX.Element;
-    Cell: ({ className, truncate, ...props }: import("~/Table/components/index.js").CellProps) => React.JSX.Element;
-    Direction: ({ className, direction }: import("~/Table/components/index.js").DirectionProps) => React.JSX.Element | null;
-    Footer: ({ className, ...props }: React.HTMLAttributes<HTMLTableSectionElement>) => React.JSX.Element;
-    Head: ({ className, children, truncate, ...props }: import("~/Table/components/index.js").HeadProps) => React.JSX.Element;
-    Header: ({ className, sticky, ...props }: import("~/Table/components/index.js").HeaderProps) => React.JSX.Element;
-    Resizer: ({ className, isResizing, ...props }: import("~/Table/components/index.js").ResizerProps) => React.JSX.Element;
-    Row: ({ className, selected, ...props }: import("~/Table/components/index.js").RowProps) => React.JSX.Element;
+declare const BaseTable: ({ className, bordered, sticky, ...props }: TableProps) => React.JSX.Element;
+declare const Table: typeof BaseTable & {
+    Body: typeof Body;
+    Caption: typeof Caption;
+    Cell: typeof Cell;
+    Direction: typeof Direction;
+    Footer: typeof Footer;
+    Head: typeof Head;
+    Header: typeof Header;
+    Resizer: typeof Resizer;
+    Row: typeof Row;
 };
 export { Table, type TableProps };

package/Table/components/Direction.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 import { type VariantProps } from "../../utils.js";
 declare const directionVariants: (props?: ({
-    direction?: "desc" | "asc" | null | undefined;
+    direction?: "asc" | "desc" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 interface DirectionProps extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof directionVariants> {
 }

package/Tabs/Tabs.d.ts

@@ -7,22 +7,24 @@ interface TabsProps extends Omit<TabsPrimitive.TabsProps, "children"> {
     size?: VariantProps<typeof tabListVariants>["size"];
     spacing?: VariantProps<typeof tabListVariants>["spacing"];
     separator?: VariantProps<typeof tabListVariants>["separator"];
+    loading?: boolean;
 }
-declare const Tabs: (({ defaultValue: initialValue, size, spacing, separator, tabs: tabComponents, ...props }: TabsProps) => React.JSX.Element) & {
-    original: ({ defaultValue: initialValue, size, spacing, separator, tabs: tabComponents, ...props }: TabsProps) => React.JSX.Element;
+declare const DecoratableTabs: ({ defaultValue: initialValue, size, spacing, separator, loading, tabs: tabComponents, ...props }: TabsProps) => React.JSX.Element;
+declare const Tabs: typeof DecoratableTabs & {
+    original: typeof DecoratableTabs;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ defaultValue: initialValue, size, spacing, separator, tabs: tabComponents, ...props }: TabsProps) => React.JSX.Element) & {
-        original: ({ defaultValue: initialValue, size, spacing, separator, tabs: tabComponents, ...props }: TabsProps) => React.JSX.Element;
+    original: typeof DecoratableTabs & {
+        original: typeof DecoratableTabs;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ defaultValue: initialValue, size, spacing, separator, tabs: tabComponents, ...props }: TabsProps) => React.JSX.Element) & {
-        original: ({ defaultValue: initialValue, size, spacing, separator, tabs: tabComponents, ...props }: TabsProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableTabs & {
+        original: typeof DecoratableTabs;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/Tabs/Tabs.js

@@ -3,7 +3,7 @@ import { Tabs } from "radix-ui";
 import { makeDecoratable, withStaticProps } from "../utils.js";
 import { Content, List, Tab, TabsContext, Trigger } from "./components/index.js";
 const Root = Tabs.Root;
-const DecoratableTabs = ({ defaultValue: initialValue, size, spacing, separator, tabs: tabComponents, ...props })=>{
+const DecoratableTabs = ({ defaultValue: initialValue, size, spacing, separator, loading, tabs: tabComponents, ...props })=>{
     const [tabs, setTabs] = useState([]);
     const defaultValue = useMemo(()=>initialValue || tabComponents.find((tab)=>!tab.props.disabled && false !== tab.props.visible)?.props.value, [
         initialValue,
@@ -19,6 +19,7 @@ const DecoratableTabs = ({ defaultValue: initialValue, size, spacing, separator,
                 disabled: tab.disabled,
                 icon: tab.icon,
                 key: tab.id,
+                loading: loading,
                 size: size,
                 text: tab.trigger,
                 value: tab.value,
@@ -26,7 +27,9 @@ const DecoratableTabs = ({ defaultValue: initialValue, size, spacing, separator,
             }))), [
         tabs,
         size,
-        spacing
+        spacing,
+        separator,
+        loading
     ]);
     const contents = useMemo(()=>tabs.map((tab)=>/*#__PURE__*/ react.createElement(Content, {
                 key: tab.id,

package/Tabs/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs/Tabs.js","sources":["../../src/Tabs/Tabs.tsx"],"sourcesContent":["import React, { useMemo, useState } from \"react\";\nimport { Tabs as TabsPrimitive } from \"radix-ui\";\nimport { makeDecoratable, type VariantProps, withStaticProps } from \"~/utils.js\";\nimport type { ITabsContext, TabItem, TabProps, tabListVariants } from \"./components/index.js\";\nimport { Content, List, Tab, TabsContext, Trigger } from \"./components/index.js\";\n\nconst Root = TabsPrimitive.Root;\n\ninterface TabsProps extends Omit<TabsPrimitive.TabsProps, \"children\"> {\n    tabs: React.ReactElement<TabProps>[];\n    size?: VariantProps<typeof tabListVariants>[\"size\"];\n    spacing?: VariantProps<typeof tabListVariants>[\"spacing\"];\n    separator?: VariantProps<typeof tabListVariants>[\"separator\"];\n}\n\nconst DecoratableTabs = ({\n    defaultValue: initialValue,\n    size,\n    spacing,\n    separator,\n    tabs: tabComponents,\n    ...props\n}: TabsProps) => {\n    const [tabs, setTabs] = useState<TabItem[]>([]);\n\n    const defaultValue = useMemo(() => {\n        return (\n            initialValue ||\n            tabComponents.find(tab => !tab.props.disabled && tab.props.visible !== false)?.props\n                .value\n        );\n    }, [initialValue, tabComponents]);\n\n    const triggers = useMemo(\n        () => (\n            <List\n                key={tabs.map(tab => tab.id).join(\";\")}\n                size={size}\n                spacing={spacing}\n                separator={separator}\n            >\n                {tabs.map(tab => (\n                    <Trigger\n                        data-testid={tab[\"data-testid\"]}\n                        disabled={tab.disabled}\n                        icon={tab.icon}\n                        key={tab.id}\n                        size={size}\n                        text={tab.trigger}\n                        value={tab.value}\n                        visible={tab.visible}\n                    />\n                ))}\n            </List>\n        ),\n        [tabs, size, spacing]\n    );\n\n    const contents = useMemo(\n        () =>\n            tabs.map(tab => (\n                <Content\n                    key={tab.id}\n                    value={tab.value}\n                    content={tab.content}\n                    spacing={tab.spacing ?? spacing}\n                    className={tab.className}\n                />\n            )),\n        [tabs, spacing]\n    );\n\n    const context: ITabsContext = useMemo(\n        () => ({\n            addTab(props) {\n                setTabs(tabs => {\n                    const existingIndex = tabs.findIndex(tab => tab.value === props.value);\n                    if (existingIndex > -1) {\n                        return [\n                            ...tabs.slice(0, existingIndex),\n                            props,\n                            ...tabs.slice(existingIndex + 1)\n                        ];\n                    }\n                    return [...tabs, props];\n                });\n            },\n            removeTab(id) {\n                setTabs(tabs => tabs.filter(tab => tab.id !== id));\n            }\n        }),\n        [setTabs]\n    );\n\n    return (\n        <Root {...props} defaultValue={defaultValue}>\n            {triggers}\n            {contents}\n            <TabsContext.Provider value={context}>{tabComponents}</TabsContext.Provider>\n        </Root>\n    );\n};\n\nconst BaseTabs = makeDecoratable(\"Tabs\", DecoratableTabs);\n\nconst Tabs = withStaticProps(BaseTabs, {\n    Tab\n});\n\nexport { Tabs, type TabsProps };\n"],"names":["Root","TabsPrimitive","DecoratableTabs","initialValue","size","spacing","separator","tabComponents","props","tabs","setTabs","useState","defaultValue","useMemo","tab","triggers","List","Trigger","contents","Content","context","existingIndex","id","TabsContext","BaseTabs","makeDecoratable","Tabs","withStaticProps","Tab"],"mappings":";;;;AAMA,MAAMA,OAAOC,KAAAA,IAAkB;AAS/B,MAAMC,kBAAkB,CAAC,EACrB,cAAcC,YAAY,EAC1BC,IAAI,EACJC,OAAO,EACPC,SAAS,EACT,MAAMC,aAAa,EACnB,GAAGC,OACK;IACR,MAAM,CAACC,MAAMC,QAAQ,GAAGC,SAAoB,EAAE;IAE9C,MAAMC,eAAeC,QAAQ,IAErBV,gBACAI,cAAc,IAAI,CAACO,CAAAA,MAAO,CAACA,IAAI,KAAK,CAAC,QAAQ,IAAIA,AAAsB,UAAtBA,IAAI,KAAK,CAAC,OAAO,GAAa,MAC1E,OAEV;QAACX;QAAcI;KAAc;IAEhC,MAAMQ,WAAWF,QACb,kBACI,oBAACG,MAAIA;YACD,KAAKP,KAAK,GAAG,CAACK,CAAAA,MAAOA,IAAI,EAAE,EAAE,IAAI,CAAC;YAClC,MAAMV;YACN,SAASC;YACT,WAAWC;WAEVG,KAAK,GAAG,CAACK,CAAAA,MAAAA,WAAAA,GACN,oBAACG,SAAOA;gBACJ,eAAaH,GAAG,CAAC,cAAc;gBAC/B,UAAUA,IAAI,QAAQ;gBACtB,MAAMA,IAAI,IAAI;gBACd,KAAKA,IAAI,EAAE;gBACX,MAAMV;gBACN,MAAMU,IAAI,OAAO;gBACjB,OAAOA,IAAI,KAAK;gBAChB,SAASA,IAAI,OAAO;kBAKpC;QAACL;QAAML;QAAMC;KAAQ;IAGzB,MAAMa,WAAWL,QACb,IACIJ,KAAK,GAAG,CAACK,CAAAA,MAAAA,WAAAA,GACL,oBAACK,SAAOA;gBACJ,KAAKL,IAAI,EAAE;gBACX,OAAOA,IAAI,KAAK;gBAChB,SAASA,IAAI,OAAO;gBACpB,SAASA,IAAI,OAAO,IAAIT;gBACxB,WAAWS,IAAI,SAAS;iBAGpC;QAACL;QAAMJ;KAAQ;IAGnB,MAAMe,UAAwBP,QAC1B,IAAO;YACH,QAAOL,KAAK;gBACRE,QAAQD,CAAAA;oBACJ,MAAMY,gBAAgBZ,KAAK,SAAS,CAACK,CAAAA,MAAOA,IAAI,KAAK,KAAKN,MAAM,KAAK;oBACrE,IAAIa,gBAAgB,IAChB,OAAO;2BACAZ,KAAK,KAAK,CAAC,GAAGY;wBACjBb;2BACGC,KAAK,KAAK,CAACY,gBAAgB;qBACjC;oBAEL,OAAO;2BAAIZ;wBAAMD;qBAAM;gBAC3B;YACJ;YACA,WAAUc,EAAE;gBACRZ,QAAQD,CAAAA,OAAQA,KAAK,MAAM,CAACK,CAAAA,MAAOA,IAAI,EAAE,KAAKQ;YAClD;QACJ,IACA;QAACZ;KAAQ;IAGb,OAAO,WAAP,GACI,oBAACV,MAAIA;QAAE,GAAGQ,KAAK;QAAE,cAAcI;OAC1BG,UACAG,UAAAA,WAAAA,GACD,oBAACK,YAAY,QAAQ;QAAC,OAAOH;OAAUb;AAGnD;AAEA,MAAMiB,WAAWC,gBAAgB,QAAQvB;AAEzC,MAAMwB,YAAOC,gBAAgBH,UAAU;IACnCI,KAAGA;AACP"}
+{"version":3,"file":"Tabs/Tabs.js","sources":["../../src/Tabs/Tabs.tsx"],"sourcesContent":["import React, { useMemo, useState } from \"react\";\nimport { Tabs as TabsPrimitive } from \"radix-ui\";\nimport { makeDecoratable, type VariantProps, withStaticProps } from \"~/utils.js\";\nimport type { ITabsContext, TabItem, TabProps, tabListVariants } from \"./components/index.js\";\nimport { Content, List, Tab, TabsContext, Trigger } from \"./components/index.js\";\n\nconst Root = TabsPrimitive.Root;\n\ninterface TabsProps extends Omit<TabsPrimitive.TabsProps, \"children\"> {\n    tabs: React.ReactElement<TabProps>[];\n    size?: VariantProps<typeof tabListVariants>[\"size\"];\n    spacing?: VariantProps<typeof tabListVariants>[\"spacing\"];\n    separator?: VariantProps<typeof tabListVariants>[\"separator\"];\n    loading?: boolean;\n}\n\nconst DecoratableTabs = ({\n    defaultValue: initialValue,\n    size,\n    spacing,\n    separator,\n    loading,\n    tabs: tabComponents,\n    ...props\n}: TabsProps) => {\n    const [tabs, setTabs] = useState<TabItem[]>([]);\n\n    const defaultValue = useMemo(() => {\n        return (\n            initialValue ||\n            tabComponents.find(tab => !tab.props.disabled && tab.props.visible !== false)?.props\n                .value\n        );\n    }, [initialValue, tabComponents]);\n\n    const triggers = useMemo(\n        () => (\n            <List\n                key={tabs.map(tab => tab.id).join(\";\")}\n                size={size}\n                spacing={spacing}\n                separator={separator}\n            >\n                {tabs.map(tab => (\n                    <Trigger\n                        data-testid={tab[\"data-testid\"]}\n                        disabled={tab.disabled}\n                        icon={tab.icon}\n                        key={tab.id}\n                        loading={loading}\n                        size={size}\n                        text={tab.trigger}\n                        value={tab.value}\n                        visible={tab.visible}\n                    />\n                ))}\n            </List>\n        ),\n        [tabs, size, spacing, separator, loading]\n    );\n\n    const contents = useMemo(\n        () =>\n            tabs.map(tab => (\n                <Content\n                    key={tab.id}\n                    value={tab.value}\n                    content={tab.content}\n                    spacing={tab.spacing ?? spacing}\n                    className={tab.className}\n                />\n            )),\n        [tabs, spacing]\n    );\n\n    const context: ITabsContext = useMemo(\n        () => ({\n            addTab(props) {\n                setTabs(tabs => {\n                    const existingIndex = tabs.findIndex(tab => tab.value === props.value);\n                    if (existingIndex > -1) {\n                        return [\n                            ...tabs.slice(0, existingIndex),\n                            props,\n                            ...tabs.slice(existingIndex + 1)\n                        ];\n                    }\n                    return [...tabs, props];\n                });\n            },\n            removeTab(id) {\n                setTabs(tabs => tabs.filter(tab => tab.id !== id));\n            }\n        }),\n        [setTabs]\n    );\n\n    return (\n        <Root {...props} defaultValue={defaultValue}>\n            {triggers}\n            {contents}\n            <TabsContext.Provider value={context}>{tabComponents}</TabsContext.Provider>\n        </Root>\n    );\n};\n\nconst BaseTabs = makeDecoratable(\"Tabs\", DecoratableTabs);\n\nconst Tabs = withStaticProps(BaseTabs, {\n    Tab\n});\n\nexport { Tabs, type TabsProps };\n"],"names":["Root","TabsPrimitive","DecoratableTabs","initialValue","size","spacing","separator","loading","tabComponents","props","tabs","setTabs","useState","defaultValue","useMemo","tab","triggers","List","Trigger","contents","Content","context","existingIndex","id","TabsContext","BaseTabs","makeDecoratable","Tabs","withStaticProps","Tab"],"mappings":";;;;AAMA,MAAMA,OAAOC,KAAAA,IAAkB;AAU/B,MAAMC,kBAAkB,CAAC,EACrB,cAAcC,YAAY,EAC1BC,IAAI,EACJC,OAAO,EACPC,SAAS,EACTC,OAAO,EACP,MAAMC,aAAa,EACnB,GAAGC,OACK;IACR,MAAM,CAACC,MAAMC,QAAQ,GAAGC,SAAoB,EAAE;IAE9C,MAAMC,eAAeC,QAAQ,IAErBX,gBACAK,cAAc,IAAI,CAACO,CAAAA,MAAO,CAACA,IAAI,KAAK,CAAC,QAAQ,IAAIA,AAAsB,UAAtBA,IAAI,KAAK,CAAC,OAAO,GAAa,MAC1E,OAEV;QAACZ;QAAcK;KAAc;IAEhC,MAAMQ,WAAWF,QACb,kBACI,oBAACG,MAAIA;YACD,KAAKP,KAAK,GAAG,CAACK,CAAAA,MAAOA,IAAI,EAAE,EAAE,IAAI,CAAC;YAClC,MAAMX;YACN,SAASC;YACT,WAAWC;WAEVI,KAAK,GAAG,CAACK,CAAAA,MAAAA,WAAAA,GACN,oBAACG,SAAOA;gBACJ,eAAaH,GAAG,CAAC,cAAc;gBAC/B,UAAUA,IAAI,QAAQ;gBACtB,MAAMA,IAAI,IAAI;gBACd,KAAKA,IAAI,EAAE;gBACX,SAASR;gBACT,MAAMH;gBACN,MAAMW,IAAI,OAAO;gBACjB,OAAOA,IAAI,KAAK;gBAChB,SAASA,IAAI,OAAO;kBAKpC;QAACL;QAAMN;QAAMC;QAASC;QAAWC;KAAQ;IAG7C,MAAMY,WAAWL,QACb,IACIJ,KAAK,GAAG,CAACK,CAAAA,MAAAA,WAAAA,GACL,oBAACK,SAAOA;gBACJ,KAAKL,IAAI,EAAE;gBACX,OAAOA,IAAI,KAAK;gBAChB,SAASA,IAAI,OAAO;gBACpB,SAASA,IAAI,OAAO,IAAIV;gBACxB,WAAWU,IAAI,SAAS;iBAGpC;QAACL;QAAML;KAAQ;IAGnB,MAAMgB,UAAwBP,QAC1B,IAAO;YACH,QAAOL,KAAK;gBACRE,QAAQD,CAAAA;oBACJ,MAAMY,gBAAgBZ,KAAK,SAAS,CAACK,CAAAA,MAAOA,IAAI,KAAK,KAAKN,MAAM,KAAK;oBACrE,IAAIa,gBAAgB,IAChB,OAAO;2BACAZ,KAAK,KAAK,CAAC,GAAGY;wBACjBb;2BACGC,KAAK,KAAK,CAACY,gBAAgB;qBACjC;oBAEL,OAAO;2BAAIZ;wBAAMD;qBAAM;gBAC3B;YACJ;YACA,WAAUc,EAAE;gBACRZ,QAAQD,CAAAA,OAAQA,KAAK,MAAM,CAACK,CAAAA,MAAOA,IAAI,EAAE,KAAKQ;YAClD;QACJ,IACA;QAACZ;KAAQ;IAGb,OAAO,WAAP,GACI,oBAACX,MAAIA;QAAE,GAAGS,KAAK;QAAE,cAAcI;OAC1BG,UACAG,UAAAA,WAAAA,GACD,oBAACK,YAAY,QAAQ;QAAC,OAAOH;OAAUb;AAGnD;AAEA,MAAMiB,WAAWC,gBAAgB,QAAQxB;AAEzC,MAAMyB,YAAOC,gBAAgBH,UAAU;IACnCI,KAAGA;AACP"}

package/Tabs/components/Content.d.ts

@@ -2,7 +2,7 @@ import * as React from "react";
 import { Tabs as TabsPrimitive } from "radix-ui";
 import { type VariantProps } from "../../utils.js";
 declare const tabContentVariants: (props?: ({
-    spacing?: "sm" | "md" | "lg" | "xl" | "xs" | "xxl" | null | undefined;
+    spacing?: "lg" | "md" | "sm" | "xl" | "xs" | "xxl" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 type ContentProps = Omit<TabsPrimitive.TabsContentProps, "children" | "content"> & VariantProps<typeof tabContentVariants> & {
     content: React.ReactNode;

package/Tabs/components/List.d.ts

@@ -2,8 +2,8 @@ import * as React from "react";
 import { Tabs as TabsPrimitive } from "radix-ui";
 import { type VariantProps } from "../../utils.js";
 declare const tabListVariants: (props?: ({
-    size?: "sm" | "md" | "lg" | "xl" | null | undefined;
-    spacing?: "sm" | "md" | "lg" | "xl" | "xs" | "xxl" | null | undefined;
+    size?: "lg" | "md" | "sm" | "xl" | null | undefined;
+    spacing?: "lg" | "md" | "sm" | "xl" | "xs" | "xxl" | null | undefined;
     separator?: boolean | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 type ListProps = TabsPrimitive.TabsListProps & VariantProps<typeof tabListVariants>;

package/Tabs/components/Tab.d.ts

@@ -14,21 +14,22 @@ interface TabProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "children"
 interface TabItem extends TabProps {
     id: string;
 }
-declare const Tab: ((props: TabProps) => null) & {
-    original: (props: TabProps) => null;
+declare const DecoratableTab: (props: TabProps) => null;
+declare const Tab: typeof DecoratableTab & {
+    original: typeof DecoratableTab;
     originalName: string;
     displayName: string;
 } & {
-    original: ((props: TabProps) => null) & {
-        original: (props: TabProps) => null;
+    original: typeof DecoratableTab & {
+        original: typeof DecoratableTab;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<((props: TabProps) => null) & {
-        original: (props: TabProps) => null;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableTab & {
+        original: typeof DecoratableTab;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/Tabs/components/Trigger.d.ts

@@ -2,13 +2,14 @@ import * as React from "react";
 import { Tabs as TabsPrimitive } from "radix-ui";
 import { type VariantProps } from "../../utils.js";
 declare const tabTriggerVariants: (props?: ({
-    size?: "sm" | "md" | "lg" | "xl" | null | undefined;
+    size?: "lg" | "md" | "sm" | "xl" | null | undefined;
     visible?: boolean | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 type TriggerProps = Omit<TabsPrimitive.TabsTriggerProps, "children"> & VariantProps<typeof tabTriggerVariants> & {
     text: React.ReactNode;
     icon?: React.ReactElement;
+    loading?: boolean;
     "data-testid"?: string;
 };
-declare const Trigger: ({ className, size, icon, text, visible, ...props }: TriggerProps) => React.JSX.Element;
+declare const Trigger: ({ className, size, icon, text, visible, loading, ...props }: TriggerProps) => React.JSX.Element;
 export { Trigger, type TriggerProps };

package/Tabs/components/Trigger.js

@@ -1,6 +1,7 @@
 import { Tabs } from "radix-ui";
 import { cn, cva } from "../../utils.js";
 import { Icon } from "../../Icon/index.js";
+import { Skeleton } from "../../Skeleton/index.js";
 import * as __rspack_external_react from "react";
 const tabTriggerVariants = cva([
     "group inline-flex items-center justify-center whitespace-nowrap outline-none transition-all",
@@ -41,7 +42,7 @@ const innerTabTriggerVariants = cva([
         size: "sm"
     }
 });
-const Trigger = ({ className, size, icon, text, visible, ...props })=>/*#__PURE__*/ __rspack_external_react.createElement(Tabs.Trigger, {
+const Trigger = ({ className, size, icon, text, visible, loading, ...props })=>/*#__PURE__*/ __rspack_external_react.createElement(Tabs.Trigger, {
         className: cn(tabTriggerVariants({
             size,
             visible
@@ -51,12 +52,16 @@ const Trigger = ({ className, size, icon, text, visible, ...props })=>/*#__PURE_
         className: cn(innerTabTriggerVariants({
             size
         }))
-    }, icon && /*#__PURE__*/ __rspack_external_react.createElement(Icon, {
+    }, loading ? /*#__PURE__*/ __rspack_external_react.createElement(Skeleton, {
+        type: "text",
+        size: "md",
+        className: "w-[64px]"
+    }) : /*#__PURE__*/ __rspack_external_react.createElement(__rspack_external_react.Fragment, null, icon && /*#__PURE__*/ __rspack_external_react.createElement(Icon, {
         icon: icon,
         size: "sm",
         label: String(text),
         color: "neutral-light"
-    }), text));
+    }), text)));
 export { Trigger };
 
 //# sourceMappingURL=Trigger.js.map

package/Tabs/components/Trigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs/components/Trigger.js","sources":["../../../src/Tabs/components/Trigger.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Tabs as TabsPrimitive } from \"radix-ui\";\nimport { cn, cva, type VariantProps } from \"~/utils.js\";\nimport { Icon } from \"~/Icon/index.js\";\n\nconst tabTriggerVariants = cva(\n    [\n        \"group inline-flex items-center justify-center whitespace-nowrap outline-none transition-all\",\n        \"text-neutral-strong hover:text-neutral-primary\",\n        \"border-b-md border-transparent border-solid\",\n        \"data-[state=active]:border-accent-default data-[state=active]:text-neutral-primary\",\n        \"disabled:pointer-events-none disabled:text-neutral-disabled! disabled:fill-neutral-disabled! disabled:border-transparent!\"\n    ],\n    {\n        variants: {\n            size: {\n                sm: \"text-sm h-[40px]\",\n                md: \"text-md h-xxl\",\n                lg: \"text-lg h-[56px]\",\n                xl: \"text-xl h-3xl\"\n            },\n            visible: {\n                false: \"hidden\"\n            }\n        },\n        defaultVariants: {\n            size: \"sm\"\n        }\n    }\n);\n\nconst innerTabTriggerVariants = cva(\n    [\n        \"inline-flex items-center justify-start gap-xs\",\n        \"group-hover:bg-neutral-dimmed\",\n        \"group-focus-visible:ring-lg group-focus-visible:ring-primary-dimmed\"\n    ],\n    {\n        variants: {\n            size: {\n                sm: \"rounded-sm p-xs\",\n                md: \"rounded-sm px-xs py-xs-plus\",\n                lg: \"rounded-sm px-xs-plus py-sm-plus\",\n                xl: \"rounded-lg px-sm py-sm-plus\"\n            }\n        },\n        defaultVariants: {\n            size: \"sm\"\n        }\n    }\n);\n\ntype TriggerProps = Omit<TabsPrimitive.TabsTriggerProps, \"children\"> &\n    VariantProps<typeof tabTriggerVariants> & {\n        text: React.ReactNode;\n        icon?: React.ReactElement;\n        \"data-testid\"?: string;\n    };\n\nconst Trigger = ({ className, size, icon, text, visible, ...props }: TriggerProps) => (\n    <TabsPrimitive.Trigger\n        className={cn(tabTriggerVariants({ size, visible }), className)}\n        {...props}\n    >\n        <div className={cn(innerTabTriggerVariants({ size }))}>\n            {icon && <Icon icon={icon} size={\"sm\"} label={String(text)} color={\"neutral-light\"} />}\n            {text}\n        </div>\n    </TabsPrimitive.Trigger>\n);\n\nexport { Trigger, type TriggerProps };\n"],"names":["tabTriggerVariants","cva","innerTabTriggerVariants","Trigger","className","size","icon","text","visible","props","TabsPrimitive","cn","Icon","String"],"mappings":";;;;AAKA,MAAMA,qBAAqBC,IACvB;IACI;IACA;IACA;IACA;IACA;CACH,EACD;IACI,UAAU;QACN,MAAM;YACF,IAAI;YACJ,IAAI;YACJ,IAAI;YACJ,IAAI;QACR;QACA,SAAS;YACL,OAAO;QACX;IACJ;IACA,iBAAiB;QACb,MAAM;IACV;AACJ;AAGJ,MAAMC,0BAA0BD,IAC5B;IACI;IACA;IACA;CACH,EACD;IACI,UAAU;QACN,MAAM;YACF,IAAI;YACJ,IAAI;YACJ,IAAI;YACJ,IAAI;QACR;IACJ;IACA,iBAAiB;QACb,MAAM;IACV;AACJ;AAUJ,MAAME,UAAU,CAAC,EAAEC,SAAS,EAAEC,IAAI,EAAEC,IAAI,EAAEC,IAAI,EAAEC,OAAO,EAAE,GAAGC,OAAqB,iBAC7E,sCAACC,KAAAA,OAAqB;QAClB,WAAWC,GAAGX,mBAAmB;YAAEK;YAAMG;QAAQ,IAAIJ;QACpD,GAAGK,KAAK;qBAET,sCAAC;QAAI,WAAWE,GAAGT,wBAAwB;YAAEG;QAAK;OAC7CC,QAAQ,WAARA,GAAQ,sCAACM,MAAIA;QAAC,MAAMN;QAAM,MAAM;QAAM,OAAOO,OAAON;QAAO,OAAO;QAClEA"}
+{"version":3,"file":"Tabs/components/Trigger.js","sources":["../../../src/Tabs/components/Trigger.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Tabs as TabsPrimitive } from \"radix-ui\";\nimport { cn, cva, type VariantProps } from \"~/utils.js\";\nimport { Icon } from \"~/Icon/index.js\";\nimport { Skeleton } from \"~/Skeleton/index.js\";\n\nconst tabTriggerVariants = cva(\n    [\n        \"group inline-flex items-center justify-center whitespace-nowrap outline-none transition-all\",\n        \"text-neutral-strong hover:text-neutral-primary\",\n        \"border-b-md border-transparent border-solid\",\n        \"data-[state=active]:border-accent-default data-[state=active]:text-neutral-primary\",\n        \"disabled:pointer-events-none disabled:text-neutral-disabled! disabled:fill-neutral-disabled! disabled:border-transparent!\"\n    ],\n    {\n        variants: {\n            size: {\n                sm: \"text-sm h-[40px]\",\n                md: \"text-md h-xxl\",\n                lg: \"text-lg h-[56px]\",\n                xl: \"text-xl h-3xl\"\n            },\n            visible: {\n                false: \"hidden\"\n            }\n        },\n        defaultVariants: {\n            size: \"sm\"\n        }\n    }\n);\n\nconst innerTabTriggerVariants = cva(\n    [\n        \"inline-flex items-center justify-start gap-xs\",\n        \"group-hover:bg-neutral-dimmed\",\n        \"group-focus-visible:ring-lg group-focus-visible:ring-primary-dimmed\"\n    ],\n    {\n        variants: {\n            size: {\n                sm: \"rounded-sm p-xs\",\n                md: \"rounded-sm px-xs py-xs-plus\",\n                lg: \"rounded-sm px-xs-plus py-sm-plus\",\n                xl: \"rounded-lg px-sm py-sm-plus\"\n            }\n        },\n        defaultVariants: {\n            size: \"sm\"\n        }\n    }\n);\n\ntype TriggerProps = Omit<TabsPrimitive.TabsTriggerProps, \"children\"> &\n    VariantProps<typeof tabTriggerVariants> & {\n        text: React.ReactNode;\n        icon?: React.ReactElement;\n        loading?: boolean;\n        \"data-testid\"?: string;\n    };\n\nconst Trigger = ({ className, size, icon, text, visible, loading, ...props }: TriggerProps) => (\n    <TabsPrimitive.Trigger\n        className={cn(tabTriggerVariants({ size, visible }), className)}\n        {...props}\n    >\n        <div className={cn(innerTabTriggerVariants({ size }))}>\n            {loading ? (\n                <Skeleton type={\"text\"} size={\"md\"} className={\"w-[64px]\"} />\n            ) : (\n                <>\n                    {icon && (\n                        <Icon\n                            icon={icon}\n                            size={\"sm\"}\n                            label={String(text)}\n                            color={\"neutral-light\"}\n                        />\n                    )}\n                    {text}\n                </>\n            )}\n        </div>\n    </TabsPrimitive.Trigger>\n);\n\nexport { Trigger, type TriggerProps };\n"],"names":["tabTriggerVariants","cva","innerTabTriggerVariants","Trigger","className","size","icon","text","visible","loading","props","TabsPrimitive","cn","Skeleton","Icon","String"],"mappings":";;;;;AAMA,MAAMA,qBAAqBC,IACvB;IACI;IACA;IACA;IACA;IACA;CACH,EACD;IACI,UAAU;QACN,MAAM;YACF,IAAI;YACJ,IAAI;YACJ,IAAI;YACJ,IAAI;QACR;QACA,SAAS;YACL,OAAO;QACX;IACJ;IACA,iBAAiB;QACb,MAAM;IACV;AACJ;AAGJ,MAAMC,0BAA0BD,IAC5B;IACI;IACA;IACA;CACH,EACD;IACI,UAAU;QACN,MAAM;YACF,IAAI;YACJ,IAAI;YACJ,IAAI;YACJ,IAAI;QACR;IACJ;IACA,iBAAiB;QACb,MAAM;IACV;AACJ;AAWJ,MAAME,UAAU,CAAC,EAAEC,SAAS,EAAEC,IAAI,EAAEC,IAAI,EAAEC,IAAI,EAAEC,OAAO,EAAEC,OAAO,EAAE,GAAGC,OAAqB,iBACtF,sCAACC,KAAAA,OAAqB;QAClB,WAAWC,GAAGZ,mBAAmB;YAAEK;YAAMG;QAAQ,IAAIJ;QACpD,GAAGM,KAAK;qBAET,sCAAC;QAAI,WAAWE,GAAGV,wBAAwB;YAAEG;QAAK;OAC7CI,UAAU,WAAVA,GACG,sCAACI,UAAQA;QAAC,MAAM;QAAQ,MAAM;QAAM,WAAW;uBAE/C,8EACKP,QAAQ,WAARA,GACG,sCAACQ,MAAIA;QACD,MAAMR;QACN,MAAM;QACN,OAAOS,OAAOR;QACd,OAAO;QAGdA"}

package/Tag/Tag.d.ts

@@ -4,7 +4,7 @@ declare const tagVariants: (props?: ({
     isInteractive?: boolean | null | undefined;
     isDismissible?: boolean | null | undefined;
     isDisabled?: boolean | null | undefined;
-    variant?: "accent" | "neutral-light" | "neutral-strong" | "neutral-base" | "success" | "warning" | "neutral-base-outline" | "neutral-muted" | "neutral-xstrong" | "neutral-dark" | "accent-light" | "success-light" | "destructive" | null | undefined;
+    variant?: "accent" | "accent-light" | "destructive" | "neutral-base" | "neutral-base-outline" | "neutral-dark" | "neutral-light" | "neutral-muted" | "neutral-strong" | "neutral-xstrong" | "success" | "success-light" | "warning" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface TagProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "children" | "content">, VariantProps<typeof tagVariants> {
     content: React.ReactNode;
@@ -16,21 +16,22 @@ export interface TagProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "c
     icon?: React.ReactElement | null;
     disabled?: boolean;
 }
-declare const Tag: ((props: TagProps) => React.JSX.Element) & {
-    original: (props: TagProps) => React.JSX.Element;
+declare const DecoratableTag: (props: TagProps) => React.JSX.Element;
+declare const Tag: typeof DecoratableTag & {
+    original: typeof DecoratableTag;
     originalName: string;
     displayName: string;
 } & {
-    original: ((props: TagProps) => React.JSX.Element) & {
-        original: (props: TagProps) => React.JSX.Element;
+    original: typeof DecoratableTag & {
+        original: typeof DecoratableTag;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<((props: TagProps) => React.JSX.Element) & {
-        original: (props: TagProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableTag & {
+        original: typeof DecoratableTag;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/Tags/Tags.d.ts

@@ -2,21 +2,22 @@ import React from "react";
 import { type TagsPrimitiveProps } from "./primitives/index.js";
 import { type FormComponentProps } from "../FormComponent/index.js";
 type TagsProps = TagsPrimitiveProps & FormComponentProps;
-declare const Tags: (({ label, description, note, hint, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TagsProps) => React.JSX.Element) & {
-    original: ({ label, description, note, hint, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TagsProps) => React.JSX.Element;
+declare const DecoratableTags: ({ label, description, note, hint, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TagsProps) => React.JSX.Element;
+declare const Tags: typeof DecoratableTags & {
+    original: typeof DecoratableTags;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ label, description, note, hint, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TagsProps) => React.JSX.Element) & {
-        original: ({ label, description, note, hint, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TagsProps) => React.JSX.Element;
+    original: typeof DecoratableTags & {
+        original: typeof DecoratableTags;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ label, description, note, hint, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TagsProps) => React.JSX.Element) & {
-        original: ({ label, description, note, hint, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TagsProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableTags & {
+        original: typeof DecoratableTags;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/Tags/primitives/TagsPrimitive.d.ts

@@ -57,21 +57,22 @@ interface TagsPrimitiveProps extends Omit<React.InputHTMLAttributes<HTMLInputEle
      */
     protectedValues?: string[];
 }
-declare const TagsPrimitive: ((props: TagsPrimitiveProps) => React.JSX.Element) & {
-    original: (props: TagsPrimitiveProps) => React.JSX.Element;
+declare const DecoratableTagsPrimitive: (props: TagsPrimitiveProps) => React.JSX.Element;
+declare const TagsPrimitive: typeof DecoratableTagsPrimitive & {
+    original: typeof DecoratableTagsPrimitive;
     originalName: string;
     displayName: string;
 } & {
-    original: ((props: TagsPrimitiveProps) => React.JSX.Element) & {
-        original: (props: TagsPrimitiveProps) => React.JSX.Element;
+    original: typeof DecoratableTagsPrimitive & {
+        original: typeof DecoratableTagsPrimitive;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<((props: TagsPrimitiveProps) => React.JSX.Element) & {
-        original: (props: TagsPrimitiveProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableTagsPrimitive & {
+        original: typeof DecoratableTagsPrimitive;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/Text/Text.d.ts

@@ -2,26 +2,27 @@ import React from "react";
 import { type VariantProps } from "../utils.js";
 type TextTags = "span" | "div";
 declare const textVariants: (props?: ({
-    size?: "sm" | "md" | "lg" | "xl" | null | undefined;
+    size?: "lg" | "md" | "sm" | "xl" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 interface TextProps extends React.HTMLAttributes<HTMLElement>, VariantProps<typeof textVariants> {
     as?: TextTags;
 }
-declare const Text: (({ children, size, className, as: Tag, ...props }: TextProps) => React.JSX.Element) & {
-    original: ({ children, size, className, as: Tag, ...props }: TextProps) => React.JSX.Element;
+declare const TextBase: ({ children, size, className, as: Tag, ...props }: TextProps) => React.JSX.Element;
+declare const Text: typeof TextBase & {
+    original: typeof TextBase;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ children, size, className, as: Tag, ...props }: TextProps) => React.JSX.Element) & {
-        original: ({ children, size, className, as: Tag, ...props }: TextProps) => React.JSX.Element;
+    original: typeof TextBase & {
+        original: typeof TextBase;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types").ComponentDecorator<(({ children, size, className, as: Tag, ...props }: TextProps) => React.JSX.Element) & {
-        original: ({ children, size, className, as: Tag, ...props }: TextProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types").ComponentDecorator<typeof TextBase & {
+        original: typeof TextBase;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/Textarea/Textarea.d.ts

@@ -2,21 +2,22 @@ import React from "react";
 import type { TextareaPrimitiveProps } from "./TextareaPrimitive.js";
 import type { FormComponentProps } from "../FormComponent/index.js";
 type TextareaGroupProps = Omit<TextareaPrimitiveProps, "onChange"> & FormComponentProps;
-declare const Textarea: (({ label, description, note, hint, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TextareaGroupProps) => React.JSX.Element) & {
-    original: ({ label, description, note, hint, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TextareaGroupProps) => React.JSX.Element;
+declare const DecoratableTextarea: ({ label, description, note, hint, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TextareaGroupProps) => React.JSX.Element;
+declare const Textarea: typeof DecoratableTextarea & {
+    original: typeof DecoratableTextarea;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ label, description, note, hint, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TextareaGroupProps) => React.JSX.Element) & {
-        original: ({ label, description, note, hint, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TextareaGroupProps) => React.JSX.Element;
+    original: typeof DecoratableTextarea & {
+        original: typeof DecoratableTextarea;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ label, description, note, hint, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TextareaGroupProps) => React.JSX.Element) & {
-        original: ({ label, description, note, hint, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TextareaGroupProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableTextarea & {
+        original: typeof DecoratableTextarea;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;