@webiny/admin-ui 6.4.12-beta.5 → 6.5.0-beta.1

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;

package/Textarea/TextareaPrimitive.d.ts

@@ -1,8 +1,8 @@
 import * as React from "react";
 import { type VariantProps } from "../utils.js";
 declare const textareaVariants: (props?: ({
-    variant?: "primary" | "secondary" | "ghost" | "ghost-negative" | null | undefined;
-    size?: "md" | "lg" | "xl" | null | undefined;
+    variant?: "ghost" | "ghost-negative" | "primary" | "secondary" | null | undefined;
+    size?: "lg" | "md" | "xl" | null | undefined;
     invalid?: boolean | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 interface TextareaPrimitiveProps extends React.ComponentProps<"textarea">, VariantProps<typeof textareaVariants> {
@@ -19,21 +19,22 @@ interface TextareaPrimitiveProps extends React.ComponentProps<"textarea">, Varia
      */
     onEnter?: () => void;
 }
-declare const TextareaPrimitive: (({ className, variant, invalid, size, textareaRef, forwardEventOnChange, onChange: originalOnChange, onEnter, onKeyDown: originalOnKeyDown, value, ...props }: TextareaPrimitiveProps) => React.JSX.Element) & {
-    original: ({ className, variant, invalid, size, textareaRef, forwardEventOnChange, onChange: originalOnChange, onEnter, onKeyDown: originalOnKeyDown, value, ...props }: TextareaPrimitiveProps) => React.JSX.Element;
+declare const DecoratableTextareaPrimitive: ({ className, variant, invalid, size, textareaRef, forwardEventOnChange, onChange: originalOnChange, onEnter, onKeyDown: originalOnKeyDown, value, ...props }: TextareaPrimitiveProps) => React.JSX.Element;
+declare const TextareaPrimitive: typeof DecoratableTextareaPrimitive & {
+    original: typeof DecoratableTextareaPrimitive;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ className, variant, invalid, size, textareaRef, forwardEventOnChange, onChange: originalOnChange, onEnter, onKeyDown: originalOnKeyDown, value, ...props }: TextareaPrimitiveProps) => React.JSX.Element) & {
-        original: ({ className, variant, invalid, size, textareaRef, forwardEventOnChange, onChange: originalOnChange, onEnter, onKeyDown: originalOnKeyDown, value, ...props }: TextareaPrimitiveProps) => React.JSX.Element;
+    original: typeof DecoratableTextareaPrimitive & {
+        original: typeof DecoratableTextareaPrimitive;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types").ComponentDecorator<(({ className, variant, invalid, size, textareaRef, forwardEventOnChange, onChange: originalOnChange, onEnter, onKeyDown: originalOnKeyDown, value, ...props }: TextareaPrimitiveProps) => React.JSX.Element) & {
-        original: ({ className, variant, invalid, size, textareaRef, forwardEventOnChange, onChange: originalOnChange, onEnter, onKeyDown: originalOnKeyDown, value, ...props }: TextareaPrimitiveProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types").ComponentDecorator<typeof DecoratableTextareaPrimitive & {
+        original: typeof DecoratableTextareaPrimitive;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/Toast/Toast.d.ts

@@ -10,21 +10,22 @@ interface ToastProps extends Omit<ToastRootProps, "title" | "content" | "childre
     onCloseClick: () => void;
     dismissible?: boolean;
 }
-declare const Toast: (({ title, description, icon, actions, onCloseClick, dismissible, ...props }: ToastProps) => React.JSX.Element) & {
-    original: ({ title, description, icon, actions, onCloseClick, dismissible, ...props }: ToastProps) => React.JSX.Element;
+declare const DecoratableToast: ({ title, description, icon, actions, onCloseClick, dismissible, ...props }: ToastProps) => React.JSX.Element;
+declare const Toast: typeof DecoratableToast & {
+    original: typeof DecoratableToast;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ title, description, icon, actions, onCloseClick, dismissible, ...props }: ToastProps) => React.JSX.Element) & {
-        original: ({ title, description, icon, actions, onCloseClick, dismissible, ...props }: ToastProps) => React.JSX.Element;
+    original: typeof DecoratableToast & {
+        original: typeof DecoratableToast;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ title, description, icon, actions, onCloseClick, dismissible, ...props }: ToastProps) => React.JSX.Element) & {
-        original: ({ title, description, icon, actions, onCloseClick, dismissible, ...props }: ToastProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableToast & {
+        original: typeof DecoratableToast;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/Toast/components/ToastActions.d.ts

@@ -1,19 +1,20 @@
 import React from "react";
-declare const ToastActions: (({ children, className, ...props }: React.HTMLAttributes<HTMLDivElement>) => React.JSX.Element) & {
-    original: ({ children, className, ...props }: React.HTMLAttributes<HTMLDivElement>) => React.JSX.Element;
+declare const DecoratableToastActions: ({ children, className, ...props }: React.HTMLAttributes<HTMLDivElement>) => React.JSX.Element;
+declare const ToastActions: typeof DecoratableToastActions & {
+    original: typeof DecoratableToastActions;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ children, className, ...props }: React.HTMLAttributes<HTMLDivElement>) => React.JSX.Element) & {
-        original: ({ children, className, ...props }: React.HTMLAttributes<HTMLDivElement>) => React.JSX.Element;
+    original: typeof DecoratableToastActions & {
+        original: typeof DecoratableToastActions;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types").ComponentDecorator<(({ children, className, ...props }: React.HTMLAttributes<HTMLDivElement>) => React.JSX.Element) & {
-        original: ({ children, className, ...props }: React.HTMLAttributes<HTMLDivElement>) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types").ComponentDecorator<typeof DecoratableToastActions & {
+        original: typeof DecoratableToastActions;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/Toast/components/ToastDescription.d.ts

@@ -2,21 +2,22 @@ import React from "react";
 type DescriptionProps = Omit<React.HTMLAttributes<HTMLDivElement>, "children"> & {
     text: React.ReactNode;
 };
-declare const ToastDescription: (({ text, className, ...props }: DescriptionProps) => React.JSX.Element) & {
-    original: ({ text, className, ...props }: DescriptionProps) => React.JSX.Element;
+declare const DecoratableToastDescription: ({ text, className, ...props }: DescriptionProps) => React.JSX.Element;
+declare const ToastDescription: typeof DecoratableToastDescription & {
+    original: typeof DecoratableToastDescription;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ text, className, ...props }: DescriptionProps) => React.JSX.Element) & {
-        original: ({ text, className, ...props }: DescriptionProps) => React.JSX.Element;
+    original: typeof DecoratableToastDescription & {
+        original: typeof DecoratableToastDescription;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types").ComponentDecorator<(({ text, className, ...props }: DescriptionProps) => React.JSX.Element) & {
-        original: ({ text, className, ...props }: DescriptionProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types").ComponentDecorator<typeof DecoratableToastDescription & {
+        original: typeof DecoratableToastDescription;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/Toast/components/ToastTitle.d.ts

@@ -2,21 +2,22 @@ import React from "react";
 type ToastTitleProps = Omit<React.HTMLAttributes<HTMLDivElement>, "children"> & {
     text: React.ReactNode;
 };
-declare const ToastTitle: (({ text, className, ...props }: ToastTitleProps) => React.JSX.Element) & {
-    original: ({ text, className, ...props }: ToastTitleProps) => React.JSX.Element;
+declare const DecoratableToastTitle: ({ text, className, ...props }: ToastTitleProps) => React.JSX.Element;
+declare const ToastTitle: typeof DecoratableToastTitle & {
+    original: typeof DecoratableToastTitle;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ text, className, ...props }: ToastTitleProps) => React.JSX.Element) & {
-        original: ({ text, className, ...props }: ToastTitleProps) => React.JSX.Element;
+    original: typeof DecoratableToastTitle & {
+        original: typeof DecoratableToastTitle;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types").ComponentDecorator<(({ text, className, ...props }: ToastTitleProps) => React.JSX.Element) & {
-        original: ({ text, className, ...props }: ToastTitleProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types").ComponentDecorator<typeof DecoratableToastTitle & {
+        original: typeof DecoratableToastTitle;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/Toast/useToast.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toast/useToast.stories.js","sources":["../../src/Toast/useToast.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { ReactComponent as SettingsIcon } from \"@webiny/icons/settings.svg\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { Toast } from \"./Toast.js\";\nimport { useToast, type ShowToastParams } from \"./useToast.js\";\nimport { Button } from \"~/Button/index.js\";\nimport { Icon } from \"~/Icon/index.js\";\n\nconst ToastComponent = (props: ShowToastParams) => {\n    const [lastToast, setLastToast] = useState<string | number>(\"\");\n    const { showToast, hideToast, hideAllToasts } = useToast();\n    return (\n        <>\n            <Button\n                text={\"Show Toast\"}\n                onClick={() => {\n                    const toast = showToast(props);\n                    setLastToast(toast);\n                }}\n            />\n            <Button text={\"Hide latest toast\"} onClick={() => hideToast(lastToast)} />\n            <Button text={\"Hide all toasts\"} onClick={() => hideAllToasts()} />\n        </>\n    );\n};\n\nconst meta: Meta<ShowToastParams> = {\n    title: \"Components/Toast\",\n    component: ToastComponent,\n    parameters: {\n        layout: \"fullscreen\"\n    },\n    argTypes: {\n        variant: { control: \"select\", options: [\"default\", \"subtle\"] }\n    },\n    decorators: [\n        Story => (\n            <div className=\"w-full h-64 flex justify-center items-center gap-sm\">\n                <Story />\n                <Toast.Provider />\n            </div>\n        )\n    ]\n};\n\nexport default meta;\n\ntype Story = StoryObj<ShowToastParams>;\n\nexport const Default: Story = {\n    args: {\n        title: \"New entry created\"\n    }\n};\n\nexport const SubtleVariant: Story = {\n    args: {\n        ...Default.args,\n        variant: \"subtle\"\n    }\n};\n\nexport const WithTitleComponent: Story = {\n    args: {\n        title: <Toast.Title text={\"New entry created\"} />\n    }\n};\n\nexport const WithDescription: Story = {\n    args: {\n        ...Default.args,\n        description: 'Entry \"Article One\" has been successfully created'\n    }\n};\n\nexport const WithDescriptionComponent: Story = {\n    args: {\n        ...Default.args,\n        description: (\n            <Toast.Description text={'Entry \"Article One\" has been successfully created'} />\n        )\n    }\n};\n\nexport const WithActions: Story = {\n    args: {\n        ...Default.args,\n        actions: (\n            <Toast.Actions>\n                <Button\n                    key={\"action-1\"}\n                    text={\"Do the action\"}\n                    onClick={() => console.log(\"doTheAction\")}\n                />\n                <Button\n                    key={\"action-2\"}\n                    text={\"Dismiss\"}\n                    onClick={() => console.log(\"dismiss\")}\n                    variant={\"secondary\"}\n                />\n            </Toast.Actions>\n        )\n    }\n};\n\nexport const WithDescriptionAndActions: Story = {\n    args: {\n        ...Default.args,\n        description: (\n            <Toast.Description text={'Entry \"Article One\" has been successfully created'} />\n        ),\n        actions: (\n            <Toast.Actions>\n                <Button\n                    key={\"action-1\"}\n                    text={\"Do the action\"}\n                    onClick={() => console.log(\"doTheAction\")}\n                />\n                <Button\n                    key={\"action-2\"}\n                    text={\"Dismiss\"}\n                    onClick={() => console.log(\"dismiss\")}\n                    variant={\"secondary\"}\n                />\n            </Toast.Actions>\n        )\n    }\n};\n\nexport const WithCustomIcon: Story = {\n    args: {\n        ...Default.args,\n        icon: <Icon icon={<SettingsIcon />} label={\"Settings\"} />\n    }\n};\n\nexport const WithInfiniteDuration: Story = {\n    args: {\n        ...Default.args,\n        duration: Infinity\n    }\n};\n\nexport const NotDismissible: Story = {\n    args: {\n        ...Default.args,\n        dismissible: false\n    }\n};\n\nexport const withCustomPosition: Story = {\n    args: {\n        ...Default.args,\n        position: \"bottom-right\"\n    }\n};\n\nexport const Documentation: Story = {\n    args: {\n        title: \"New entry created\",\n        description: \"Entry has been successfully created\",\n        variant: \"default\",\n        position: \"top-right\",\n        duration: 6000,\n        dismissible: true,\n        actions: undefined,\n        icon: undefined\n    },\n    argTypes: {\n        title: {\n            description: \"Please refer to the 'With Title Component' example below for details.\"\n        },\n        description: {\n            description:\n                \"Please refer to the 'With Description' and 'With Description Component' examples below for details.\"\n        },\n        variant: {\n            description: \"Variant of the toast.\"\n        },\n        actions: {\n            description: \"Please refer to the 'With Actions' example below for details.\"\n        },\n        icon: {\n            description: \"Please refer to the 'With Custom Icon' example below for details.\"\n        },\n        duration: {\n            description:\n                \"Duration in milliseconds before the toast auto-dismisses. Please refer to the 'With Infinite Duration' example below for details.\",\n            control: \"number\"\n        },\n        dismissible: {\n            description: \"Please refer to the 'Not Dismissible' example below for details.\"\n        },\n        position: {\n            description: \"Please refer to the 'With Custom Position' example below for details.\",\n            control: \"select\",\n            options: [\n                \"top-left\",\n                \"top-right\",\n                \"bottom-left\",\n                \"bottom-right\",\n                \"top-center\",\n                \"bottom-center\"\n            ]\n        }\n    }\n};\n"],"names":["ToastComponent","props","lastToast","setLastToast","useState","showToast","hideToast","hideAllToasts","useToast","Button","toast","meta","Story","Toast","Default","SubtleVariant","WithTitleComponent","WithDescription","WithDescriptionComponent","WithActions","console","WithDescriptionAndActions","WithCustomIcon","Icon","SettingsIcon","WithInfiniteDuration","Infinity","NotDismissible","withCustomPosition","Documentation","undefined"],"mappings":"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"}
+{"version":3,"file":"Toast/useToast.stories.js","sources":["../../src/Toast/useToast.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { ReactComponent as SettingsIcon } from \"@webiny/icons/settings.svg\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { Toast } from \"./Toast.js\";\nimport { useToast, type ShowToastParams } from \"./useToast.js\";\nimport { Button } from \"~/Button/index.js\";\nimport { Icon } from \"~/Icon/index.js\";\n\nconst ToastComponent = (props: ShowToastParams) => {\n    const [lastToast, setLastToast] = useState<string | number>(\"\");\n    const { showToast, hideToast, hideAllToasts } = useToast();\n    return (\n        <>\n            <Button\n                text={\"Show Toast\"}\n                onClick={() => {\n                    const toast = showToast(props);\n                    setLastToast(toast);\n                }}\n            />\n            <Button text={\"Hide latest toast\"} onClick={() => hideToast(lastToast)} />\n            <Button text={\"Hide all toasts\"} onClick={() => hideAllToasts()} />\n        </>\n    );\n};\n\nconst meta: Meta<ShowToastParams> = {\n    title: \"Components/Toast\",\n    component: ToastComponent,\n    parameters: {\n        layout: \"fullscreen\"\n    },\n    argTypes: {\n        variant: { control: \"select\", options: [\"default\", \"subtle\"] }\n    },\n    decorators: [\n        Story => (\n            <div className=\"w-full h-64 flex justify-center items-center gap-sm\">\n                <Story />\n                <Toast.Provider />\n            </div>\n        )\n    ]\n};\n\nexport default meta;\n\ntype Story = StoryObj<ShowToastParams>;\n\nexport const Default: Story = {\n    args: {\n        title: \"New entry created\"\n    }\n};\n\nexport const SubtleVariant: Story = {\n    args: {\n        ...Default.args,\n        variant: \"subtle\"\n    }\n};\n\nexport const WithTitleComponent: Story = {\n    args: {\n        title: <Toast.Title text={\"New entry created\"} />\n    }\n};\n\nexport const WithDescription: Story = {\n    args: {\n        ...Default.args,\n        description: 'Entry \"Article One\" has been successfully created'\n    }\n};\n\nexport const WithDescriptionComponent: Story = {\n    args: {\n        ...Default.args,\n        description: (\n            <Toast.Description text={'Entry \"Article One\" has been successfully created'} />\n        )\n    }\n};\n\nexport const WithActions: Story = {\n    args: {\n        ...Default.args,\n        actions: (\n            <Toast.Actions>\n                <Button\n                    key={\"action-1\"}\n                    text={\"Do the action\"}\n                    onClick={() => console.log(\"doTheAction\")}\n                />\n                <Button\n                    key={\"action-2\"}\n                    text={\"Dismiss\"}\n                    onClick={() => console.log(\"dismiss\")}\n                    variant={\"secondary\"}\n                />\n            </Toast.Actions>\n        )\n    }\n};\n\nexport const WithDescriptionAndActions: Story = {\n    args: {\n        ...Default.args,\n        description: (\n            <Toast.Description text={'Entry \"Article One\" has been successfully created'} />\n        ),\n        actions: (\n            <Toast.Actions>\n                <Button\n                    key={\"action-1\"}\n                    text={\"Do the action\"}\n                    onClick={() => console.log(\"doTheAction\")}\n                />\n                <Button\n                    key={\"action-2\"}\n                    text={\"Dismiss\"}\n                    onClick={() => console.log(\"dismiss\")}\n                    variant={\"secondary\"}\n                />\n            </Toast.Actions>\n        )\n    }\n};\n\nexport const WithCustomIcon: Story = {\n    args: {\n        ...Default.args,\n        icon: <Icon icon={<SettingsIcon />} label={\"Settings\"} />\n    }\n};\n\nexport const WithInfiniteDuration: Story = {\n    args: {\n        ...Default.args,\n        duration: Infinity\n    }\n};\n\nexport const NotDismissible: Story = {\n    args: {\n        ...Default.args,\n        dismissible: false\n    }\n};\n\nexport const withCustomPosition: Story = {\n    args: {\n        ...Default.args,\n        position: \"bottom-right\"\n    }\n};\n\nexport const Documentation: Story = {\n    args: {\n        title: \"New entry created\",\n        description: \"Entry has been successfully created\",\n        variant: \"default\",\n        position: \"top-right\",\n        duration: 6000,\n        dismissible: true,\n        actions: undefined,\n        icon: undefined\n    },\n    argTypes: {\n        title: {\n            description: \"Please refer to the 'With Title Component' example below for details.\"\n        },\n        description: {\n            description:\n                \"Please refer to the 'With Description' and 'With Description Component' examples below for details.\"\n        },\n        variant: {\n            description: \"Variant of the toast.\"\n        },\n        actions: {\n            description: \"Please refer to the 'With Actions' example below for details.\"\n        },\n        icon: {\n            description: \"Please refer to the 'With Custom Icon' example below for details.\"\n        },\n        duration: {\n            description:\n                \"Duration in milliseconds before the toast auto-dismisses. Please refer to the 'With Infinite Duration' example below for details.\",\n            control: \"number\"\n        },\n        dismissible: {\n            description: \"Please refer to the 'Not Dismissible' example below for details.\"\n        },\n        position: {\n            description: \"Please refer to the 'With Custom Position' example below for details.\",\n            control: \"select\",\n            options: [\n                \"top-left\",\n                \"top-right\",\n                \"bottom-left\",\n                \"bottom-right\",\n                \"top-center\",\n                \"bottom-center\"\n            ]\n        }\n    }\n};\n"],"names":["ToastComponent","props","lastToast","setLastToast","useState","showToast","hideToast","hideAllToasts","useToast","Button","toast","meta","Story","Toast","Default","SubtleVariant","WithTitleComponent","WithDescription","WithDescriptionComponent","WithActions","console","WithDescriptionAndActions","WithCustomIcon","Icon","SettingsIcon","WithInfiniteDuration","Infinity","NotDismissible","withCustomPosition","Documentation","undefined"],"mappings":"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"}

package/Toggle/Toggle.d.ts

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

package/Toggle/primitives/TogglePrimitive.d.ts

@@ -6,9 +6,9 @@ import type { ToggleItemDto, ToggleItemFormatted } from "../domains/index.js";
  * Toggle Renderer
  */
 declare const toggleVariants: (props?: ({
-    variant?: "primary" | "ghost" | "ghost-negative" | "outline" | null | undefined;
-    size?: "sm" | "md" | "lg" | "xl" | null | undefined;
-    contentLayout?: "text" | "icon" | null | undefined;
+    variant?: "ghost" | "ghost-negative" | "outline" | "primary" | null | undefined;
+    size?: "lg" | "md" | "sm" | "xl" | null | undefined;
+    contentLayout?: "icon" | "text" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 type TogglePrimitiveProps = Omit<TogglePrimitives.ToggleProps, "defaultPressed" | "onPressedChange" | "onChange" | "pressed"> & VariantProps<typeof toggleVariants> & ToggleItemDto & {
     onChange?: (checked: boolean) => void;
@@ -16,21 +16,25 @@ type TogglePrimitiveProps = Omit<TogglePrimitives.ToggleProps, "defaultPressed"
 type TogglePrimitivVm = {
     item?: ToggleItemFormatted;
 };
-declare const TogglePrimitive: ((props: TogglePrimitiveProps) => React.JSX.Element | null) & {
-    original: (props: TogglePrimitiveProps) => React.JSX.Element | null;
+/**
+ * Toggle
+ */
+declare const DecoratableTogglePrimitive: (props: TogglePrimitiveProps) => React.JSX.Element | null;
+declare const TogglePrimitive: typeof DecoratableTogglePrimitive & {
+    original: typeof DecoratableTogglePrimitive;
     originalName: string;
     displayName: string;
 } & {
-    original: ((props: TogglePrimitiveProps) => React.JSX.Element | null) & {
-        original: (props: TogglePrimitiveProps) => React.JSX.Element | null;
+    original: typeof DecoratableTogglePrimitive & {
+        original: typeof DecoratableTogglePrimitive;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<((props: TogglePrimitiveProps) => React.JSX.Element | null) & {
-        original: (props: TogglePrimitiveProps) => React.JSX.Element | null;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableTogglePrimitive & {
+        original: typeof DecoratableTogglePrimitive;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/ToggleGroup/ToggleGroup.d.ts

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