@webiny/admin-ui 6.0.0-alpha.4 → 6.0.0-rc.0

package/Tabs/components/Tab.d.ts

@@ -1,6 +1,6 @@
 import type React from "react";
-import { type VariantProps } from "../../utils";
-import type { tabListVariants } from "./List";
+import { type VariantProps } from "../../utils.js";
+import type { tabListVariants } from "./List.js";
 interface TabProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "children" | "content"> {
     value: string;
     trigger: React.ReactNode;
@@ -27,7 +27,7 @@ declare const Tab: ((props: TabProps) => null) & {
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<((props: TabProps) => null) & {
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<((props: TabProps) => null) & {
         original: (props: TabProps) => null;
         originalName: string;
         displayName: string;

package/Tabs/components/Tab.js

@@ -1,6 +1,6 @@
 import { useContext, useEffect, useRef } from "react";
-import { makeDecoratable, generateId } from "../../utils";
-import { TabsContext } from "./Context";
+import { makeDecoratable, generateId } from "../../utils.js";
+import { TabsContext } from "./Context.js";
 const DecoratableTab = props => {
   const tabsContext = useContext(TabsContext);
   const idRef = useRef(generateId());

package/Tabs/components/Tab.js.map

@@ -1 +1 @@
-{"version":3,"names":["useContext","useEffect","useRef","makeDecoratable","generateId","TabsContext","DecoratableTab","props","tabsContext","idRef","addTab","id","current","visible","removeTab","Tab"],"sources":["Tab.tsx"],"sourcesContent":["import type React from \"react\";\nimport { useContext, useEffect, useRef } from \"react\";\nimport { makeDecoratable, generateId, type VariantProps } from \"~/utils\";\nimport { TabsContext } from \"./Context\";\nimport type { tabListVariants } from \"./List\";\n\ninterface TabProps extends Omit<React.HTMLAttributes<HTMLDivElement>, \"children\" | \"content\"> {\n    value: string;\n    trigger: React.ReactNode;\n    content: React.ReactNode;\n    icon?: React.ReactElement;\n    spacing?: VariantProps<typeof tabListVariants>[\"spacing\"];\n    disabled?: boolean;\n    visible?: boolean;\n    \"data-testid\"?: string;\n}\n\ninterface TabItem extends TabProps {\n    id: string;\n}\n\nconst DecoratableTab = (props: TabProps) => {\n    const tabsContext = useContext(TabsContext);\n    const idRef = useRef(generateId());\n\n    useEffect(() => {\n        tabsContext!.addTab({ ...props, id: idRef.current, visible: props.visible ?? true });\n    }, [props]);\n\n    useEffect(() => {\n        return () => {\n            return tabsContext!.removeTab(idRef.current);\n        };\n    }, []);\n\n    return null;\n};\n\nconst Tab = makeDecoratable(\"Tab\", DecoratableTab);\n\nexport { Tab, type TabProps, type TabItem };\n"],"mappings":"AACA,SAASA,UAAU,EAAEC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AACrD,SAASC,eAAe,EAAEC,UAAU;AACpC,SAASC,WAAW;AAkBpB,MAAMC,cAAc,GAAIC,KAAe,IAAK;EACxC,MAAMC,WAAW,GAAGR,UAAU,CAACK,WAAW,CAAC;EAC3C,MAAMI,KAAK,GAAGP,MAAM,CAACE,UAAU,CAAC,CAAC,CAAC;EAElCH,SAAS,CAAC,MAAM;IACZO,WAAW,CAAEE,MAAM,CAAC;MAAE,GAAGH,KAAK;MAAEI,EAAE,EAAEF,KAAK,CAACG,OAAO;MAAEC,OAAO,EAAEN,KAAK,CAACM,OAAO,IAAI;IAAK,CAAC,CAAC;EACxF,CAAC,EAAE,CAACN,KAAK,CAAC,CAAC;EAEXN,SAAS,CAAC,MAAM;IACZ,OAAO,MAAM;MACT,OAAOO,WAAW,CAAEM,SAAS,CAACL,KAAK,CAACG,OAAO,CAAC;IAChD,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,OAAO,IAAI;AACf,CAAC;AAED,MAAMG,GAAG,GAAGZ,eAAe,CAAC,KAAK,EAAEG,cAAc,CAAC;AAElD,SAASS,GAAG","ignoreList":[]}
+{"version":3,"names":["useContext","useEffect","useRef","makeDecoratable","generateId","TabsContext","DecoratableTab","props","tabsContext","idRef","addTab","id","current","visible","removeTab","Tab"],"sources":["Tab.tsx"],"sourcesContent":["import type React from \"react\";\nimport { useContext, useEffect, useRef } from \"react\";\nimport { makeDecoratable, generateId, type VariantProps } from \"~/utils.js\";\nimport { TabsContext } from \"./Context.js\";\nimport type { tabListVariants } from \"./List.js\";\n\ninterface TabProps extends Omit<React.HTMLAttributes<HTMLDivElement>, \"children\" | \"content\"> {\n    value: string;\n    trigger: React.ReactNode;\n    content: React.ReactNode;\n    icon?: React.ReactElement;\n    spacing?: VariantProps<typeof tabListVariants>[\"spacing\"];\n    disabled?: boolean;\n    visible?: boolean;\n    \"data-testid\"?: string;\n}\n\ninterface TabItem extends TabProps {\n    id: string;\n}\n\nconst DecoratableTab = (props: TabProps) => {\n    const tabsContext = useContext(TabsContext);\n    const idRef = useRef(generateId());\n\n    useEffect(() => {\n        tabsContext!.addTab({ ...props, id: idRef.current, visible: props.visible ?? true });\n    }, [props]);\n\n    useEffect(() => {\n        return () => {\n            return tabsContext!.removeTab(idRef.current);\n        };\n    }, []);\n\n    return null;\n};\n\nconst Tab = makeDecoratable(\"Tab\", DecoratableTab);\n\nexport { Tab, type TabProps, type TabItem };\n"],"mappings":"AACA,SAASA,UAAU,EAAEC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AACrD,SAASC,eAAe,EAAEC,UAAU;AACpC,SAASC,WAAW;AAkBpB,MAAMC,cAAc,GAAIC,KAAe,IAAK;EACxC,MAAMC,WAAW,GAAGR,UAAU,CAACK,WAAW,CAAC;EAC3C,MAAMI,KAAK,GAAGP,MAAM,CAACE,UAAU,CAAC,CAAC,CAAC;EAElCH,SAAS,CAAC,MAAM;IACZO,WAAW,CAAEE,MAAM,CAAC;MAAE,GAAGH,KAAK;MAAEI,EAAE,EAAEF,KAAK,CAACG,OAAO;MAAEC,OAAO,EAAEN,KAAK,CAACM,OAAO,IAAI;IAAK,CAAC,CAAC;EACxF,CAAC,EAAE,CAACN,KAAK,CAAC,CAAC;EAEXN,SAAS,CAAC,MAAM;IACZ,OAAO,MAAM;MACT,OAAOO,WAAW,CAAEM,SAAS,CAACL,KAAK,CAACG,OAAO,CAAC;IAChD,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,OAAO,IAAI;AACf,CAAC;AAED,MAAMG,GAAG,GAAGZ,eAAe,CAAC,KAAK,EAAEG,cAAc,CAAC;AAElD,SAASS,GAAG","ignoreList":[]}

package/Tabs/components/Trigger.d.ts

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { Tabs as TabsPrimitive } from "radix-ui";
-import { type VariantProps } from "../../utils";
+import { type VariantProps } from "../../utils.js";
 declare const tabTriggerVariants: (props?: ({
     size?: "sm" | "md" | "lg" | "xl" | null | undefined;
     visible?: boolean | null | undefined;

package/Tabs/components/Trigger.js

@@ -1,30 +1,30 @@
 import * as React from "react";
 import { Tabs as TabsPrimitive } from "radix-ui";
-import { cn, cva } from "../../utils";
-import { Icon } from "../../Icon";
-const tabTriggerVariants = cva(["wby-group wby-inline-flex wby-items-center wby-justify-center wby-whitespace-nowrap wby-outline-none wby-transition-all", "wby-text-neutral-strong hover:text-neutral-primary", "wby-border-b-md wby-border-transparent wby-border-solid", "data-[state=active]:wby-border-accent-default data-[state=active]:wby-text-neutral-primary", "disabled:wby-pointer-events-none disabled:!wby-text-neutral-disabled disabled:!wby-fill-neutral-disabled disabled:!wby-border-transparent"], {
+import { cn, cva } from "../../utils.js";
+import { Icon } from "../../Icon/index.js";
+const tabTriggerVariants = cva(["group inline-flex items-center justify-center whitespace-nowrap outline-none transition-all", "text-neutral-strong hover:text-neutral-primary", "border-b-md border-transparent border-solid", "data-[state=active]:border-accent-default data-[state=active]:text-neutral-primary", "disabled:pointer-events-none disabled:text-neutral-disabled! disabled:fill-neutral-disabled! disabled:border-transparent!"], {
   variants: {
     size: {
-      sm: "wby-text-sm wby-h-[40px]",
-      md: "wby-text-md wby-h-[48px]",
-      lg: "wby-text-lg wby-h-[56px]",
-      xl: "wby-text-xl wby-h-[64px]"
+      sm: "text-sm h-[40px]",
+      md: "text-md h-xxl",
+      lg: "text-lg h-[56px]",
+      xl: "text-xl h-3xl"
     },
     visible: {
-      false: "wby-hidden"
+      false: "hidden"
     }
   },
   defaultVariants: {
     size: "sm"
   }
 });
-const innerTabTriggerVariants = cva(["wby-inline-flex wby-items-center wby-justify-start wby-gap-xs", "group-hover:wby-bg-neutral-dimmed", "group-focus-visible:wby-ring-lg group-focus-visible:wby-ring-primary-dimmed"], {
+const innerTabTriggerVariants = cva(["inline-flex items-center justify-start gap-xs", "group-hover:bg-neutral-dimmed", "group-focus-visible:ring-lg group-focus-visible:ring-primary-dimmed"], {
   variants: {
     size: {
-      sm: "wby-rounded-sm wby-p-xs",
-      md: "wby-rounded-sm wby-px-xs wby-py-xs-plus",
-      lg: "wby-rounded-sm wby-px-xs-plus wby-py-sm-plus",
-      xl: "wby-rounded-lg wby-px-sm wby-py-sm-plus"
+      sm: "rounded-sm p-xs",
+      md: "rounded-sm px-xs py-xs-plus",
+      lg: "rounded-sm px-xs-plus py-sm-plus",
+      xl: "rounded-lg px-sm py-sm-plus"
     }
   },
   defaultVariants: {

package/Tabs/components/Trigger.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Tabs","TabsPrimitive","cn","cva","Icon","tabTriggerVariants","variants","size","sm","md","lg","xl","visible","false","defaultVariants","innerTabTriggerVariants","Trigger","className","icon","text","props","createElement","Object","assign","label","String","color"],"sources":["Trigger.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Tabs as TabsPrimitive } from \"radix-ui\";\nimport { cn, cva, type VariantProps } from \"~/utils\";\nimport { Icon } from \"~/Icon\";\n\nconst tabTriggerVariants = cva(\n    [\n        \"wby-group wby-inline-flex wby-items-center wby-justify-center wby-whitespace-nowrap wby-outline-none wby-transition-all\",\n        \"wby-text-neutral-strong hover:text-neutral-primary\",\n        \"wby-border-b-md wby-border-transparent wby-border-solid\",\n        \"data-[state=active]:wby-border-accent-default data-[state=active]:wby-text-neutral-primary\",\n        \"disabled:wby-pointer-events-none disabled:!wby-text-neutral-disabled disabled:!wby-fill-neutral-disabled disabled:!wby-border-transparent\"\n    ],\n    {\n        variants: {\n            size: {\n                sm: \"wby-text-sm wby-h-[40px]\",\n                md: \"wby-text-md wby-h-[48px]\",\n                lg: \"wby-text-lg wby-h-[56px]\",\n                xl: \"wby-text-xl wby-h-[64px]\"\n            },\n            visible: {\n                false: \"wby-hidden\"\n            }\n        },\n        defaultVariants: {\n            size: \"sm\"\n        }\n    }\n);\n\nconst innerTabTriggerVariants = cva(\n    [\n        \"wby-inline-flex wby-items-center wby-justify-start wby-gap-xs\",\n        \"group-hover:wby-bg-neutral-dimmed\",\n        \"group-focus-visible:wby-ring-lg group-focus-visible:wby-ring-primary-dimmed\"\n    ],\n    {\n        variants: {\n            size: {\n                sm: \"wby-rounded-sm wby-p-xs\",\n                md: \"wby-rounded-sm wby-px-xs wby-py-xs-plus\",\n                lg: \"wby-rounded-sm wby-px-xs-plus wby-py-sm-plus\",\n                xl: \"wby-rounded-lg wby-px-sm wby-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"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,IAAI,IAAIC,aAAa,QAAQ,UAAU;AAChD,SAASC,EAAE,EAAEC,GAAG;AAChB,SAASC,IAAI;AAEb,MAAMC,kBAAkB,GAAGF,GAAG,CAC1B,CACI,yHAAyH,EACzH,oDAAoD,EACpD,yDAAyD,EACzD,4FAA4F,EAC5F,2IAA2I,CAC9I,EACD;EACIG,QAAQ,EAAE;IACNC,IAAI,EAAE;MACFC,EAAE,EAAE,0BAA0B;MAC9BC,EAAE,EAAE,0BAA0B;MAC9BC,EAAE,EAAE,0BAA0B;MAC9BC,EAAE,EAAE;IACR,CAAC;IACDC,OAAO,EAAE;MACLC,KAAK,EAAE;IACX;EACJ,CAAC;EACDC,eAAe,EAAE;IACbP,IAAI,EAAE;EACV;AACJ,CACJ,CAAC;AAED,MAAMQ,uBAAuB,GAAGZ,GAAG,CAC/B,CACI,+DAA+D,EAC/D,mCAAmC,EACnC,6EAA6E,CAChF,EACD;EACIG,QAAQ,EAAE;IACNC,IAAI,EAAE;MACFC,EAAE,EAAE,yBAAyB;MAC7BC,EAAE,EAAE,yCAAyC;MAC7CC,EAAE,EAAE,8CAA8C;MAClDC,EAAE,EAAE;IACR;EACJ,CAAC;EACDG,eAAe,EAAE;IACbP,IAAI,EAAE;EACV;AACJ,CACJ,CAAC;AASD,MAAMS,OAAO,GAAGA,CAAC;EAAEC,SAAS;EAAEV,IAAI;EAAEW,IAAI;EAAEC,IAAI;EAAEP,OAAO;EAAE,GAAGQ;AAAoB,CAAC,kBAC7ErB,KAAA,CAAAsB,aAAA,CAACpB,aAAa,CAACe,OAAO,EAAAM,MAAA,CAAAC,MAAA;EAClBN,SAAS,EAAEf,EAAE,CAACG,kBAAkB,CAAC;IAAEE,IAAI;IAAEK;EAAQ,CAAC,CAAC,EAAEK,SAAS;AAAE,GAC5DG,KAAK,gBAETrB,KAAA,CAAAsB,aAAA;EAAKJ,SAAS,EAAEf,EAAE,CAACa,uBAAuB,CAAC;IAAER;EAAK,CAAC,CAAC;AAAE,GACjDW,IAAI,iBAAInB,KAAA,CAAAsB,aAAA,CAACjB,IAAI;EAACc,IAAI,EAAEA,IAAK;EAACX,IAAI,EAAE,IAAK;EAACiB,KAAK,EAAEC,MAAM,CAACN,IAAI,CAAE;EAACO,KAAK,EAAE;AAAgB,CAAE,CAAC,EACrFP,IACA,CACc,CAC1B;AAED,SAASH,OAAO","ignoreList":[]}
+{"version":3,"names":["React","Tabs","TabsPrimitive","cn","cva","Icon","tabTriggerVariants","variants","size","sm","md","lg","xl","visible","false","defaultVariants","innerTabTriggerVariants","Trigger","className","icon","text","props","createElement","Object","assign","label","String","color"],"sources":["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"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,IAAI,IAAIC,aAAa,QAAQ,UAAU;AAChD,SAASC,EAAE,EAAEC,GAAG;AAChB,SAASC,IAAI;AAEb,MAAMC,kBAAkB,GAAGF,GAAG,CAC1B,CACI,6FAA6F,EAC7F,gDAAgD,EAChD,6CAA6C,EAC7C,oFAAoF,EACpF,2HAA2H,CAC9H,EACD;EACIG,QAAQ,EAAE;IACNC,IAAI,EAAE;MACFC,EAAE,EAAE,kBAAkB;MACtBC,EAAE,EAAE,eAAe;MACnBC,EAAE,EAAE,kBAAkB;MACtBC,EAAE,EAAE;IACR,CAAC;IACDC,OAAO,EAAE;MACLC,KAAK,EAAE;IACX;EACJ,CAAC;EACDC,eAAe,EAAE;IACbP,IAAI,EAAE;EACV;AACJ,CACJ,CAAC;AAED,MAAMQ,uBAAuB,GAAGZ,GAAG,CAC/B,CACI,+CAA+C,EAC/C,+BAA+B,EAC/B,qEAAqE,CACxE,EACD;EACIG,QAAQ,EAAE;IACNC,IAAI,EAAE;MACFC,EAAE,EAAE,iBAAiB;MACrBC,EAAE,EAAE,6BAA6B;MACjCC,EAAE,EAAE,kCAAkC;MACtCC,EAAE,EAAE;IACR;EACJ,CAAC;EACDG,eAAe,EAAE;IACbP,IAAI,EAAE;EACV;AACJ,CACJ,CAAC;AASD,MAAMS,OAAO,GAAGA,CAAC;EAAEC,SAAS;EAAEV,IAAI;EAAEW,IAAI;EAAEC,IAAI;EAAEP,OAAO;EAAE,GAAGQ;AAAoB,CAAC,kBAC7ErB,KAAA,CAAAsB,aAAA,CAACpB,aAAa,CAACe,OAAO,EAAAM,MAAA,CAAAC,MAAA;EAClBN,SAAS,EAAEf,EAAE,CAACG,kBAAkB,CAAC;IAAEE,IAAI;IAAEK;EAAQ,CAAC,CAAC,EAAEK,SAAS;AAAE,GAC5DG,KAAK,gBAETrB,KAAA,CAAAsB,aAAA;EAAKJ,SAAS,EAAEf,EAAE,CAACa,uBAAuB,CAAC;IAAER;EAAK,CAAC,CAAC;AAAE,GACjDW,IAAI,iBAAInB,KAAA,CAAAsB,aAAA,CAACjB,IAAI;EAACc,IAAI,EAAEA,IAAK;EAACX,IAAI,EAAE,IAAK;EAACiB,KAAK,EAAEC,MAAM,CAACN,IAAI,CAAE;EAACO,KAAK,EAAE;AAAgB,CAAE,CAAC,EACrFP,IACA,CACc,CAC1B;AAED,SAASH,OAAO","ignoreList":[]}

package/Tabs/components/index.d.ts

@@ -1,5 +1,5 @@
-export * from "./Content";
-export * from "./Context";
-export * from "./List";
-export * from "./Tab";
-export * from "./Trigger";
+export * from "./Content.js";
+export * from "./Context.js";
+export * from "./List.js";
+export * from "./Tab.js";
+export * from "./Trigger.js";

package/Tabs/components/index.js

@@ -1,7 +1,7 @@
-export * from "./Content";
-export * from "./Context";
-export * from "./List";
-export * from "./Tab";
-export * from "./Trigger";
+export * from "./Content.js";
+export * from "./Context.js";
+export * from "./List.js";
+export * from "./Tab.js";
+export * from "./Trigger.js";
 
 //# sourceMappingURL=index.js.map

package/Tabs/components/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Content\";\nexport * from \"./Context\";\nexport * from \"./List\";\nexport * from \"./Tab\";\nexport * from \"./Trigger\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA","ignoreList":[]}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Content.js\";\nexport * from \"./Context.js\";\nexport * from \"./List.js\";\nexport * from \"./Tab.js\";\nexport * from \"./Trigger.js\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA","ignoreList":[]}

package/Tabs/index.d.ts

@@ -1 +1 @@
-export * from "./Tabs";
+export * from "./Tabs.js";

package/Tabs/index.js

@@ -1,3 +1,3 @@
-export * from "./Tabs";
+export * from "./Tabs.js";
 
 //# sourceMappingURL=index.js.map

package/Tabs/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Tabs\";\n"],"mappings":"AAAA","ignoreList":[]}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Tabs.js\";\n"],"mappings":"AAAA","ignoreList":[]}

package/Tag/Tag.d.ts

@@ -1,33 +1,36 @@
 import * as React from "react";
-import { type VariantProps } from "../utils";
+import { type VariantProps } from "../utils.js";
 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;
-} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+} & import("class-variance-authority/dist/types.js").ClassProp) | undefined) => string;
 export interface TagProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "children" | "content">, VariantProps<typeof tagVariants> {
     content: React.ReactNode;
     onDismiss?: (event: React.SyntheticEvent<HTMLSpanElement>) => void;
     dismissIconElement?: React.ReactElement;
     dismissIconLabel?: string;
+    swatchColor?: string;
+    swatchColorIcon?: boolean;
+    icon?: React.ReactElement | null;
     disabled?: boolean;
 }
-declare const Tag: (({ className, variant, content, onClick, onDismiss, dismissIconElement, dismissIconLabel, disabled, ...props }: TagProps) => React.JSX.Element) & {
-    original: ({ className, variant, content, onClick, onDismiss, dismissIconElement, dismissIconLabel, disabled, ...props }: TagProps) => React.JSX.Element;
+declare const Tag: ((props: TagProps) => React.JSX.Element) & {
+    original: (props: TagProps) => React.JSX.Element;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ className, variant, content, onClick, onDismiss, dismissIconElement, dismissIconLabel, disabled, ...props }: TagProps) => React.JSX.Element) & {
-        original: ({ className, variant, content, onClick, onDismiss, dismissIconElement, dismissIconLabel, disabled, ...props }: TagProps) => React.JSX.Element;
+    original: ((props: TagProps) => React.JSX.Element) & {
+        original: (props: TagProps) => React.JSX.Element;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<(({ className, variant, content, onClick, onDismiss, dismissIconElement, dismissIconLabel, disabled, ...props }: TagProps) => React.JSX.Element) & {
-        original: ({ className, variant, content, onClick, onDismiss, dismissIconElement, dismissIconLabel, disabled, ...props }: TagProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<((props: TagProps) => React.JSX.Element) & {
+        original: (props: TagProps) => React.JSX.Element;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/Tag/Tag.js

@@ -1,51 +1,55 @@
 import * as React from "react";
 import { ReactComponent as Close } from "@webiny/icons/close.svg";
-import { cn, cva, makeDecoratable } from "../utils";
-import { Icon } from "../Icon";
-import { IconButton } from "../Button";
-const tagVariants = cva(["wby-inline-flex wby-items-center wby-gap-xxs wby-rounded-sm wby-text-sm wby-text-regular wby-transition-colors wby-overflow-hidden", "focus:outline-none"], {
+import { cn, cva, makeDecoratable, omit } from "../utils.js";
+import { Icon } from "../Icon/index.js";
+import { IconButton } from "../Button/index.js";
+import { TagPropsProvider } from "./TagPropsProvider.js";
+import { TagSwatchBox } from "./TagSwatchBox.js";
+import { TagIcon } from "./TagIcon.js";
+const tagVariants = cva(["inline-flex items-center gap-xxs rounded-sm text-sm text-regular transition-colors overflow-hidden", "focus:outline-none"], {
   variants: {
     isInteractive: {
-      true: "wby-cursor-pointer"
+      true: "cursor-pointer"
     },
     isDismissible: {
-      true: "wby-pl-xs-plus wby-pt-xxs wby-pb-xxs wby-pr-xs",
-      false: "wby-px-xs-plus wby-py-xxs"
+      true: "pl-xs-plus pt-xxs pb-xxs pr-xs",
+      false: "px-xs-plus py-xxs"
     },
     isDisabled: {
-      true: "wby-cursor-not-allowed wby-pointer-events-none"
+      true: "cursor-not-allowed pointer-events-none"
     },
     variant: {
-      "neutral-base": ["wby-bg-transparent wby-text-neutral-primary", "hover:wby-bg-neutral-light", "aria-disabled:wby-bg-transparent aria-disabled:wby-text-neutral-disabled"],
-      "neutral-base-outline": ["wby-border-sm wby-border-solid wby-px-[calc(theme(padding.xs-plus)-theme(borderWidth.sm))] wby-py-[calc(theme(padding.xxs)-theme(borderWidth.sm))]", "wby-bg-transparent wby-border-neutral-muted wby-text-neutral-primary", "hover:wby-bg-neutral-light", "aria-disabled:wby-bg-transparent aria-disabled:wby-border-neutral-dimmed aria-disabled:wby-text-neutral-disabled"],
-      "neutral-light": ["wby-bg-neutral-light wby-text-neutral-primary", "hover:wby-bg-neutral-muted", "aria-disabled:wby-bg-neutral-light aria-disabled:wby-text-neutral-muted"],
-      "neutral-muted": ["wby-bg-neutral-muted wby-text-neutral-primary", "hover:wby-bg-neutral-strong", "aria-disabled:wby-bg-neutral-muted aria-disabled:wby-text-neutral-muted"],
-      "neutral-strong": ["wby-bg-neutral-strong wby-text-neutral-light", "hover:wby-bg-neutral-xstrong", "aria-disabled:wby-bg-neutral-muted"],
-      "neutral-xstrong": ["wby-bg-neutral-xstrong wby-text-neutral-light", "hover:wby-bg-neutral-dark", "aria-disabled:wby-bg-neutral-strong"],
-      "neutral-dark": ["wby-bg-neutral-dark wby-text-neutral-light", "hover:wby-bg-neutral-xstrong", "aria-disabled:wby-bg-neutral-strong"],
-      accent: ["wby-bg-primary-default wby-text-neutral-light", "hover:wby-bg-primary-strong", "aria-disabled:wby-bg-primary-disabled"],
-      "accent-light": ["wby-bg-primary-subtle wby-text-neutral-primary", "hover:wby-bg-primary-muted", "aria-disabled:wby-bg-primary-subtle aria-disabled:wby-text-neutral-muted"],
-      success: ["wby-bg-success-default wby-text-neutral-light", "hover:wby-bg-success-strong", "aria-disabled:wby-bg-success-disabled"],
-      "success-light": ["wby-bg-success-subtle wby-text-neutral-primary", "hover:wby-bg-success-muted", "aria-disabled:wby-bg-success-subtle aria-disabled:wby-text-neutral-muted"],
-      warning: ["wby-bg-warning-muted wby-text-neutral-primary", "hover:wby-bg-warning-default", "aria-disabled:wby-bg-warning-disabled aria-disabled:wby-text-neutral-disabled"],
-      destructive: ["wby-bg-destructive-default wby-text-neutral-light", "hover:wby-bg-destructive-strong", "aria-disabled:wby-bg-destructive-disabled"]
+      "neutral-base": ["bg-transparent text-neutral-primary", "hover:bg-neutral-light", "aria-disabled:bg-transparent aria-disabled:text-neutral-disabled"],
+      "neutral-base-outline": ["border-sm border-solid px-[calc(var(--padding-xs-plus)-(var(--border-width-sm)))] py-[calc(var(--padding-xxs)-(var(--border-width-sm)))]", "bg-neutral-base border-neutral-muted text-neutral-primary", "hover:bg-neutral-light", "aria-disabled:bg-transparent aria-disabled:border-neutral-dimmed aria-disabled:text-neutral-disabled"],
+      "neutral-light": ["bg-neutral-light text-neutral-primary", "hover:bg-neutral-muted", "aria-disabled:bg-neutral-light aria-disabled:text-neutral-muted"],
+      "neutral-muted": ["bg-neutral-muted text-neutral-primary", "hover:bg-neutral-strong", "aria-disabled:bg-neutral-muted aria-disabled:text-neutral-muted"],
+      "neutral-strong": ["bg-neutral-strong text-neutral-light", "hover:bg-neutral-xstrong", "aria-disabled:bg-neutral-muted"],
+      "neutral-xstrong": ["bg-neutral-xstrong text-neutral-light", "hover:bg-neutral-dark", "aria-disabled:bg-neutral-strong"],
+      "neutral-dark": ["bg-neutral-dark text-neutral-light", "hover:bg-neutral-xstrong", "aria-disabled:bg-neutral-strong"],
+      accent: ["bg-primary text-neutral-light", "hover:bg-primary-strong", "aria-disabled:bg-primary-disabled"],
+      "accent-light": ["bg-primary-subtle text-neutral-primary", "hover:bg-primary-muted", "aria-disabled:bg-primary-subtle aria-disabled:text-neutral-muted"],
+      success: ["bg-success text-neutral-light", "hover:bg-success-strong", "aria-disabled:bg-success-disabled"],
+      "success-light": ["bg-success-subtle text-neutral-primary", "hover:bg-success-muted", "aria-disabled:bg-success-subtle aria-disabled:text-neutral-muted"],
+      warning: ["bg-warning-muted text-neutral-primary", "hover:bg-warning", "aria-disabled:bg-warning-disabled aria-disabled:text-neutral-disabled"],
+      destructive: ["bg-destructive text-neutral-light", "hover:bg-destructive-strong", "aria-disabled:bg-destructive-disabled"]
     }
   },
   defaultVariants: {
     variant: "neutral-base"
   }
 });
-const DecoratableTag = ({
-  className,
-  variant,
-  content,
-  onClick,
-  onDismiss,
-  dismissIconElement = /*#__PURE__*/React.createElement(Close, null),
-  dismissIconLabel = "Close",
-  disabled,
-  ...props
-}) => {
+const DecoratableTag = props => {
+  const {
+    className,
+    variant,
+    content,
+    onClick,
+    onDismiss,
+    dismissIconElement = /*#__PURE__*/React.createElement(Close, null),
+    dismissIconLabel = "Close",
+    disabled,
+    ...rootProps
+  } = omit(props, ["icon", "swatchColor", "swatchColorIcon"]);
   const dismissButtonVariant = React.useMemo(() => {
     if (variant && ["neutral-strong", "neutral-xstrong", "neutral-dark", "success", "accent", "destructive"].includes(variant)) {
       return "ghost-negative";
@@ -61,7 +65,9 @@ const DecoratableTag = ({
     }
     return "neutral-strong-transparent";
   }, [variant]);
-  return /*#__PURE__*/React.createElement("span", Object.assign({}, props, {
+  return /*#__PURE__*/React.createElement(TagPropsProvider, {
+    props: props
+  }, /*#__PURE__*/React.createElement("span", Object.assign({}, rootProps, {
     onClick: onClick,
     className: cn(tagVariants({
       variant,
@@ -70,8 +76,8 @@ const DecoratableTag = ({
       isDisabled: Boolean(disabled)
     }), className),
     "aria-disabled": disabled
-  }), /*#__PURE__*/React.createElement("span", {
-    className: "wby-overflow-hidden wby-truncate wby-whitespace-nowrap"
+  }), /*#__PURE__*/React.createElement(TagSwatchBox, null), /*#__PURE__*/React.createElement(TagIcon, null), /*#__PURE__*/React.createElement("span", {
+    className: "overflow-hidden truncate whitespace-nowrap"
   }, content), onDismiss && /*#__PURE__*/React.createElement(IconButton, {
     icon: /*#__PURE__*/React.createElement(Icon, {
       icon: dismissIconElement,
@@ -86,7 +92,7 @@ const DecoratableTag = ({
       event.stopPropagation();
       onDismiss(event);
     }
-  }));
+  })));
 };
 const Tag = makeDecoratable("Tag", DecoratableTag);
 export { Tag };

package/Tag/Tag.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","ReactComponent","Close","cn","cva","makeDecoratable","Icon","IconButton","tagVariants","variants","isInteractive","true","isDismissible","false","isDisabled","variant","accent","success","warning","destructive","defaultVariants","DecoratableTag","className","content","onClick","onDismiss","dismissIconElement","createElement","dismissIconLabel","disabled","props","dismissButtonVariant","useMemo","includes","dismissIconColor","Object","assign","Boolean","icon","label","color","size","event","stopPropagation","Tag"],"sources":["Tag.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { ReactComponent as Close } from \"@webiny/icons/close.svg\";\nimport { cn, cva, makeDecoratable, type VariantProps } from \"~/utils\";\nimport { Icon, type IconProps } from \"~/Icon\";\nimport type { iconButtonVariants } from \"~/Button\";\nimport { IconButton } from \"~/Button\";\n\nconst tagVariants = cva(\n    [\n        \"wby-inline-flex wby-items-center wby-gap-xxs wby-rounded-sm wby-text-sm wby-text-regular wby-transition-colors wby-overflow-hidden\",\n        \"focus:outline-none\"\n    ],\n    {\n        variants: {\n            isInteractive: {\n                true: \"wby-cursor-pointer\"\n            },\n            isDismissible: {\n                true: \"wby-pl-xs-plus wby-pt-xxs wby-pb-xxs wby-pr-xs\",\n                false: \"wby-px-xs-plus wby-py-xxs\"\n            },\n            isDisabled: {\n                true: \"wby-cursor-not-allowed wby-pointer-events-none\"\n            },\n            variant: {\n                \"neutral-base\": [\n                    \"wby-bg-transparent wby-text-neutral-primary\",\n                    \"hover:wby-bg-neutral-light\",\n                    \"aria-disabled:wby-bg-transparent aria-disabled:wby-text-neutral-disabled\"\n                ],\n                \"neutral-base-outline\": [\n                    \"wby-border-sm wby-border-solid wby-px-[calc(theme(padding.xs-plus)-theme(borderWidth.sm))] wby-py-[calc(theme(padding.xxs)-theme(borderWidth.sm))]\",\n                    \"wby-bg-transparent wby-border-neutral-muted wby-text-neutral-primary\",\n                    \"hover:wby-bg-neutral-light\",\n                    \"aria-disabled:wby-bg-transparent aria-disabled:wby-border-neutral-dimmed aria-disabled:wby-text-neutral-disabled\"\n                ],\n                \"neutral-light\": [\n                    \"wby-bg-neutral-light wby-text-neutral-primary\",\n                    \"hover:wby-bg-neutral-muted\",\n                    \"aria-disabled:wby-bg-neutral-light aria-disabled:wby-text-neutral-muted\"\n                ],\n                \"neutral-muted\": [\n                    \"wby-bg-neutral-muted wby-text-neutral-primary\",\n                    \"hover:wby-bg-neutral-strong\",\n                    \"aria-disabled:wby-bg-neutral-muted aria-disabled:wby-text-neutral-muted\"\n                ],\n                \"neutral-strong\": [\n                    \"wby-bg-neutral-strong wby-text-neutral-light\",\n                    \"hover:wby-bg-neutral-xstrong\",\n                    \"aria-disabled:wby-bg-neutral-muted\"\n                ],\n                \"neutral-xstrong\": [\n                    \"wby-bg-neutral-xstrong wby-text-neutral-light\",\n                    \"hover:wby-bg-neutral-dark\",\n                    \"aria-disabled:wby-bg-neutral-strong\"\n                ],\n                \"neutral-dark\": [\n                    \"wby-bg-neutral-dark wby-text-neutral-light\",\n                    \"hover:wby-bg-neutral-xstrong\",\n                    \"aria-disabled:wby-bg-neutral-strong\"\n                ],\n                accent: [\n                    \"wby-bg-primary-default wby-text-neutral-light\",\n                    \"hover:wby-bg-primary-strong\",\n                    \"aria-disabled:wby-bg-primary-disabled\"\n                ],\n                \"accent-light\": [\n                    \"wby-bg-primary-subtle wby-text-neutral-primary\",\n                    \"hover:wby-bg-primary-muted\",\n                    \"aria-disabled:wby-bg-primary-subtle aria-disabled:wby-text-neutral-muted\"\n                ],\n                success: [\n                    \"wby-bg-success-default wby-text-neutral-light\",\n                    \"hover:wby-bg-success-strong\",\n                    \"aria-disabled:wby-bg-success-disabled\"\n                ],\n                \"success-light\": [\n                    \"wby-bg-success-subtle wby-text-neutral-primary\",\n                    \"hover:wby-bg-success-muted\",\n                    \"aria-disabled:wby-bg-success-subtle aria-disabled:wby-text-neutral-muted\"\n                ],\n                warning: [\n                    \"wby-bg-warning-muted wby-text-neutral-primary\",\n                    \"hover:wby-bg-warning-default\",\n                    \"aria-disabled:wby-bg-warning-disabled aria-disabled:wby-text-neutral-disabled\"\n                ],\n                destructive: [\n                    \"wby-bg-destructive-default wby-text-neutral-light\",\n                    \"hover:wby-bg-destructive-strong\",\n                    \"aria-disabled:wby-bg-destructive-disabled\"\n                ]\n            }\n        },\n        defaultVariants: {\n            variant: \"neutral-base\"\n        }\n    }\n);\n\nexport interface TagProps\n    extends Omit<React.HTMLAttributes<HTMLSpanElement>, \"children\" | \"content\">,\n        VariantProps<typeof tagVariants> {\n    content: React.ReactNode;\n    onDismiss?: (event: React.SyntheticEvent<HTMLSpanElement>) => void;\n    dismissIconElement?: React.ReactElement;\n    dismissIconLabel?: string;\n    disabled?: boolean;\n}\n\nconst DecoratableTag = ({\n    className,\n    variant,\n    content,\n    onClick,\n    onDismiss,\n    dismissIconElement = <Close />,\n    dismissIconLabel = \"Close\",\n    disabled,\n    ...props\n}: TagProps) => {\n    const dismissButtonVariant = React.useMemo((): VariantProps<\n        typeof iconButtonVariants\n    >[\"variant\"] => {\n        if (\n            variant &&\n            [\n                \"neutral-strong\",\n                \"neutral-xstrong\",\n                \"neutral-dark\",\n                \"success\",\n                \"accent\",\n                \"destructive\"\n            ].includes(variant)\n        ) {\n            return \"ghost-negative\";\n        }\n\n        return \"ghost\";\n    }, [variant]);\n\n    const dismissIconColor: IconProps[\"color\"] = React.useMemo(() => {\n        if (\n            variant &&\n            [\n                \"neutral-strong\",\n                \"neutral-xstrong\",\n                \"neutral-dark\",\n                \"accent\",\n                \"success\",\n                \"destructive\"\n            ].includes(variant)\n        ) {\n            return \"neutral-negative\";\n        }\n\n        if (variant && [\"warning\"].includes(variant)) {\n            return \"neutral-strong\";\n        }\n\n        return \"neutral-strong-transparent\";\n    }, [variant]);\n\n    return (\n        <span\n            {...props}\n            onClick={onClick}\n            className={cn(\n                tagVariants({\n                    variant,\n                    isDismissible: Boolean(onDismiss),\n                    isInteractive: Boolean(onClick),\n                    isDisabled: Boolean(disabled)\n                }),\n                className\n            )}\n            aria-disabled={disabled}\n        >\n            <span className={\"wby-overflow-hidden wby-truncate wby-whitespace-nowrap\"}>\n                {content}\n            </span>\n            {onDismiss && (\n                <IconButton\n                    icon={\n                        <Icon\n                            icon={dismissIconElement}\n                            label={dismissIconLabel}\n                            color={dismissIconColor}\n                            size={\"sm\"}\n                        />\n                    }\n                    size={\"xxs\"}\n                    variant={dismissButtonVariant}\n                    disabled={disabled}\n                    onClick={event => {\n                        event.stopPropagation();\n                        onDismiss(event);\n                    }}\n                />\n            )}\n        </span>\n    );\n};\nconst Tag = makeDecoratable(\"Tag\", DecoratableTag);\n\nexport { Tag };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","ReactComponent","Close","cn","cva","makeDecoratable","omit","Icon","IconButton","TagPropsProvider","TagSwatchBox","TagIcon","tagVariants","variants","isInteractive","true","isDismissible","false","isDisabled","variant","accent","success","warning","destructive","defaultVariants","DecoratableTag","props","className","content","onClick","onDismiss","dismissIconElement","createElement","dismissIconLabel","disabled","rootProps","dismissButtonVariant","useMemo","includes","dismissIconColor","Object","assign","Boolean","icon","label","color","size","event","stopPropagation","Tag"],"sources":["Tag.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { ReactComponent as Close } from \"@webiny/icons/close.svg\";\nimport { cn, cva, makeDecoratable, omit, type VariantProps } from \"~/utils.js\";\nimport { Icon, type IconProps } from \"~/Icon/index.js\";\nimport type { iconButtonVariants } from \"~/Button/index.js\";\nimport { IconButton } from \"~/Button/index.js\";\nimport { TagPropsProvider } from \"~/Tag/TagPropsProvider.js\";\nimport { TagSwatchBox } from \"./TagSwatchBox.js\";\nimport { TagIcon } from \"./TagIcon.js\";\n\nconst tagVariants = cva(\n    [\n        \"inline-flex items-center gap-xxs rounded-sm text-sm text-regular transition-colors overflow-hidden\",\n        \"focus:outline-none\"\n    ],\n    {\n        variants: {\n            isInteractive: {\n                true: \"cursor-pointer\"\n            },\n            isDismissible: {\n                true: \"pl-xs-plus pt-xxs pb-xxs pr-xs\",\n                false: \"px-xs-plus py-xxs\"\n            },\n            isDisabled: {\n                true: \"cursor-not-allowed pointer-events-none\"\n            },\n            variant: {\n                \"neutral-base\": [\n                    \"bg-transparent text-neutral-primary\",\n                    \"hover:bg-neutral-light\",\n                    \"aria-disabled:bg-transparent aria-disabled:text-neutral-disabled\"\n                ],\n                \"neutral-base-outline\": [\n                    \"border-sm border-solid px-[calc(var(--padding-xs-plus)-(var(--border-width-sm)))] py-[calc(var(--padding-xxs)-(var(--border-width-sm)))]\",\n                    \"bg-neutral-base border-neutral-muted text-neutral-primary\",\n                    \"hover:bg-neutral-light\",\n                    \"aria-disabled:bg-transparent aria-disabled:border-neutral-dimmed aria-disabled:text-neutral-disabled\"\n                ],\n                \"neutral-light\": [\n                    \"bg-neutral-light text-neutral-primary\",\n                    \"hover:bg-neutral-muted\",\n                    \"aria-disabled:bg-neutral-light aria-disabled:text-neutral-muted\"\n                ],\n                \"neutral-muted\": [\n                    \"bg-neutral-muted text-neutral-primary\",\n                    \"hover:bg-neutral-strong\",\n                    \"aria-disabled:bg-neutral-muted aria-disabled:text-neutral-muted\"\n                ],\n                \"neutral-strong\": [\n                    \"bg-neutral-strong text-neutral-light\",\n                    \"hover:bg-neutral-xstrong\",\n                    \"aria-disabled:bg-neutral-muted\"\n                ],\n                \"neutral-xstrong\": [\n                    \"bg-neutral-xstrong text-neutral-light\",\n                    \"hover:bg-neutral-dark\",\n                    \"aria-disabled:bg-neutral-strong\"\n                ],\n                \"neutral-dark\": [\n                    \"bg-neutral-dark text-neutral-light\",\n                    \"hover:bg-neutral-xstrong\",\n                    \"aria-disabled:bg-neutral-strong\"\n                ],\n                accent: [\n                    \"bg-primary text-neutral-light\",\n                    \"hover:bg-primary-strong\",\n                    \"aria-disabled:bg-primary-disabled\"\n                ],\n                \"accent-light\": [\n                    \"bg-primary-subtle text-neutral-primary\",\n                    \"hover:bg-primary-muted\",\n                    \"aria-disabled:bg-primary-subtle aria-disabled:text-neutral-muted\"\n                ],\n                success: [\n                    \"bg-success text-neutral-light\",\n                    \"hover:bg-success-strong\",\n                    \"aria-disabled:bg-success-disabled\"\n                ],\n                \"success-light\": [\n                    \"bg-success-subtle text-neutral-primary\",\n                    \"hover:bg-success-muted\",\n                    \"aria-disabled:bg-success-subtle aria-disabled:text-neutral-muted\"\n                ],\n                warning: [\n                    \"bg-warning-muted text-neutral-primary\",\n                    \"hover:bg-warning\",\n                    \"aria-disabled:bg-warning-disabled aria-disabled:text-neutral-disabled\"\n                ],\n                destructive: [\n                    \"bg-destructive text-neutral-light\",\n                    \"hover:bg-destructive-strong\",\n                    \"aria-disabled:bg-destructive-disabled\"\n                ]\n            }\n        },\n        defaultVariants: {\n            variant: \"neutral-base\"\n        }\n    }\n);\n\nexport interface TagProps\n    extends Omit<React.HTMLAttributes<HTMLSpanElement>, \"children\" | \"content\">,\n        VariantProps<typeof tagVariants> {\n    content: React.ReactNode;\n    onDismiss?: (event: React.SyntheticEvent<HTMLSpanElement>) => void;\n    dismissIconElement?: React.ReactElement;\n    dismissIconLabel?: string;\n    swatchColor?: string;\n    swatchColorIcon?: boolean;\n    icon?: React.ReactElement | null;\n    disabled?: boolean;\n}\n\nconst DecoratableTag = (props: TagProps) => {\n    const {\n        className,\n        variant,\n        content,\n        onClick,\n        onDismiss,\n        dismissIconElement = <Close />,\n        dismissIconLabel = \"Close\",\n        disabled,\n        ...rootProps\n    } = omit(props, [\"icon\", \"swatchColor\", \"swatchColorIcon\"]);\n\n    const dismissButtonVariant = React.useMemo((): VariantProps<\n        typeof iconButtonVariants\n    >[\"variant\"] => {\n        if (\n            variant &&\n            [\n                \"neutral-strong\",\n                \"neutral-xstrong\",\n                \"neutral-dark\",\n                \"success\",\n                \"accent\",\n                \"destructive\"\n            ].includes(variant)\n        ) {\n            return \"ghost-negative\";\n        }\n\n        return \"ghost\";\n    }, [variant]);\n\n    const dismissIconColor: IconProps[\"color\"] = React.useMemo(() => {\n        if (\n            variant &&\n            [\n                \"neutral-strong\",\n                \"neutral-xstrong\",\n                \"neutral-dark\",\n                \"accent\",\n                \"success\",\n                \"destructive\"\n            ].includes(variant)\n        ) {\n            return \"neutral-negative\";\n        }\n\n        if (variant && [\"warning\"].includes(variant)) {\n            return \"neutral-strong\";\n        }\n\n        return \"neutral-strong-transparent\";\n    }, [variant]);\n\n    return (\n        <TagPropsProvider props={props}>\n            <span\n                {...rootProps}\n                onClick={onClick}\n                className={cn(\n                    tagVariants({\n                        variant,\n                        isDismissible: Boolean(onDismiss),\n                        isInteractive: Boolean(onClick),\n                        isDisabled: Boolean(disabled)\n                    }),\n                    className\n                )}\n                aria-disabled={disabled}\n            >\n                <TagSwatchBox />\n                <TagIcon />\n                <span className={\"overflow-hidden truncate whitespace-nowrap\"}>{content}</span>\n                {onDismiss && (\n                    <IconButton\n                        icon={\n                            <Icon\n                                icon={dismissIconElement}\n                                label={dismissIconLabel}\n                                color={dismissIconColor}\n                                size={\"sm\"}\n                            />\n                        }\n                        size={\"xxs\"}\n                        variant={dismissButtonVariant}\n                        disabled={disabled}\n                        onClick={event => {\n                            event.stopPropagation();\n                            onDismiss(event);\n                        }}\n                    />\n                )}\n            </span>\n        </TagPropsProvider>\n    );\n};\nconst Tag = makeDecoratable(\"Tag\", DecoratableTag);\n\nexport { Tag };\n"],"mappings":"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","ignoreList":[]}

package/Tag/Tag.mdx

@@ -1,4 +1,4 @@
-import { Canvas, Meta, Controls } from '@storybook/blocks';
+import { Canvas, Meta, Controls } from '@storybook/addon-docs/blocks';
 
 import * as TagStories from './Tag.stories';
 
@@ -137,7 +137,7 @@ import { Tag } from "@webiny/admin-ui";
 
 const TagVariantsExample = () => {
     return (
-        <div className={"wby-flex wby-gap-sm"}>
+        <div className={"flex gap-sm"}>
             <Tag content={"Neutral base"} variant={"neutral-base"} onDismiss={() => {}} />
             <Tag content={"Neutral base outline"} variant={"neutral-base-outline"} onDismiss={() => {}} />
             <Tag content={"Neutral light"} variant={"neutral-light"} onDismiss={() => {}} />

package/Tag/Tag.stories.d.ts

@@ -1,5 +1,5 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import { Tag } from "./Tag";
+import type { Meta, StoryObj } from "@storybook/react-webpack5";
+import { Tag } from "./Tag.js";
 declare const meta: Meta<typeof Tag>;
 export default meta;
 type Story = StoryObj<typeof Tag>;
@@ -34,4 +34,5 @@ export declare const WarningDisabled: Story;
 export declare const Destructive: Story;
 export declare const DestructiveDisabled: Story;
 export declare const FullExample: Story;
+export declare const WithSwatchColor: Story;
 export declare const Documentation: Story;

package/Tag/Tag.stories.js

@@ -1,6 +1,7 @@
 import React from "react";
+import { Tag } from "./Tag.js";
+import { ReactComponent as InfoIcon } from "@webiny/icons/info.svg";
 import { ReactComponent as AddIcon } from "@webiny/icons/add.svg";
-import { Tag } from "./Tag";
 const meta = {
   title: "Components/Tag",
   component: Tag,
@@ -11,7 +12,8 @@ const meta = {
 export default meta;
 export const Default = {
   args: {
-    content: "Label"
+    content: "Label",
+    icon: /*#__PURE__*/React.createElement(InfoIcon, null)
   }
 };
 export const WithOnClickCallback = {
@@ -197,7 +199,7 @@ export const FullExample = {
   args: WithOnDismissCallback.args,
   render: args => {
     return /*#__PURE__*/React.createElement("div", {
-      className: "wby-flex wby-gap-sm"
+      className: "flex gap-sm"
     }, /*#__PURE__*/React.createElement(Tag, Object.assign({}, args, {
       content: "Neutral base",
       variant: "neutral-base"
@@ -240,6 +242,14 @@ export const FullExample = {
     })));
   }
 };
+export const WithSwatchColor = {
+  args: {
+    ...WithOnDismissCallback.args,
+    variant: "neutral-base-outline",
+    content: /*#__PURE__*/React.createElement(React.Fragment, null, "An alert that can be closed and also has action button."),
+    swatchColor: "#FF708F"
+  }
+};
 export const Documentation = {
   args: {
     content: "Label",
@@ -264,16 +274,13 @@ export const Documentation = {
       control: "boolean"
     },
     onDismiss: {
-      description: "Callback function when the tag is dismissed. Please refer to the 'Dismissible Tag' example code for details.",
-      control: "none"
+      description: "Callback function when the tag is dismissed. Please refer to the 'Dismissible Tag' example code for details."
     },
     dismissIconElement: {
-      description: "Custom dismiss icon element. Please refer to the 'Custom Dismiss Icon' example code for details.",
-      control: "none"
+      description: "Custom dismiss icon element. Please refer to the 'Custom Dismiss Icon' example code for details."
     },
     dismissIconLabel: {
-      description: "Custom dismiss icon label. Please refer to the 'Custom Dismiss Icon' example code for details.",
-      control: "none"
+      description: "Custom dismiss icon label. Please refer to the 'Custom Dismiss Icon' example code for details."
     }
   }
 };

package/Tag/Tag.stories.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","ReactComponent","AddIcon","Tag","meta","title","component","parameters","layout","Default","args","content","WithOnClickCallback","onClick","evt","console","log","WithOnDismissCallback","onDismiss","WithCustomDismissIconElement","dismissIconElement","createElement","dismissIconLabel","NeutralBase","variant","NeutralBaseDisabled","disabled","NeutralBaseOutline","NeutralBaseOutlineDisabled","NeutralLight","NeutralLightDisabled","NeutralMuted","NeutralMutedDisabled","NeutralStrong","NeutralStrongDisabled","NeutralXStrong","NeutralXStrongDisabled","NeutralDark","NeutralDarkDisabled","Accent","AccentDisabled","AccentLight","AccentLightDisabled","Success","SuccessDisabled","SuccessLight","SuccessLightDisabled","Warning","WarningDisabled","Destructive","DestructiveDisabled","FullExample","render","className","Object","assign","Documentation","undefined","argTypes","description","control","options"],"sources":["Tag.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as AddIcon } from \"@webiny/icons/add.svg\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { Tag } from \"./Tag\";\n\nconst meta: Meta<typeof Tag> = {\n    title: \"Components/Tag\",\n    component: Tag,\n    parameters: {\n        layout: \"padded\"\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Tag>;\n\nexport const Default: Story = {\n    args: {\n        content: \"Label\"\n    }\n};\n\nexport const WithOnClickCallback: Story = {\n    args: {\n        ...Default.args,\n        onClick: evt => {\n            console.log(\"onClick\", evt);\n        }\n    }\n};\n\nexport const WithOnDismissCallback: Story = {\n    args: {\n        ...Default.args,\n        onDismiss: evt => {\n            console.log(\"onDismiss\", evt);\n        }\n    }\n};\n\nexport const WithCustomDismissIconElement: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        dismissIconElement: <AddIcon />,\n        dismissIconLabel: \"Custom dismiss label\"\n    }\n};\n\nexport const NeutralBase: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-base\"\n    }\n};\n\nexport const NeutralBaseDisabled: Story = {\n    args: {\n        ...NeutralBase.args,\n        disabled: true\n    }\n};\n\nexport const NeutralBaseOutline: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-base-outline\"\n    }\n};\n\nexport const NeutralBaseOutlineDisabled: Story = {\n    args: {\n        ...NeutralBaseOutline.args,\n        disabled: true\n    }\n};\n\nexport const NeutralLight: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-light\"\n    }\n};\n\nexport const NeutralLightDisabled: Story = {\n    args: {\n        ...NeutralLight.args,\n        disabled: true\n    }\n};\n\nexport const NeutralMuted: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-muted\"\n    }\n};\n\nexport const NeutralMutedDisabled: Story = {\n    args: {\n        ...NeutralMuted.args,\n        disabled: true\n    }\n};\n\nexport const NeutralStrong: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-strong\"\n    }\n};\n\nexport const NeutralStrongDisabled: Story = {\n    args: {\n        ...NeutralStrong.args,\n        disabled: true\n    }\n};\n\nexport const NeutralXStrong: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-xstrong\"\n    }\n};\n\nexport const NeutralXStrongDisabled: Story = {\n    args: {\n        ...NeutralXStrong.args,\n        disabled: true\n    }\n};\n\nexport const NeutralDark: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-dark\"\n    }\n};\n\nexport const NeutralDarkDisabled: Story = {\n    args: {\n        ...NeutralDark.args,\n        disabled: true\n    }\n};\n\nexport const Accent: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"accent\"\n    }\n};\n\nexport const AccentDisabled: Story = {\n    args: {\n        ...Accent.args,\n        disabled: true\n    }\n};\n\nexport const AccentLight: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"accent-light\"\n    }\n};\n\nexport const AccentLightDisabled: Story = {\n    args: {\n        ...AccentLight.args,\n        disabled: true\n    }\n};\n\nexport const Success: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"success\"\n    }\n};\n\nexport const SuccessDisabled: Story = {\n    args: {\n        ...Success.args,\n        disabled: true\n    }\n};\n\nexport const SuccessLight: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"success-light\"\n    }\n};\n\nexport const SuccessLightDisabled: Story = {\n    args: {\n        ...SuccessLight.args,\n        disabled: true\n    }\n};\n\nexport const Warning: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"warning\"\n    }\n};\n\nexport const WarningDisabled: Story = {\n    args: {\n        ...Warning.args,\n        disabled: true\n    }\n};\n\nexport const Destructive: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"destructive\"\n    }\n};\n\nexport const DestructiveDisabled: Story = {\n    args: {\n        ...Destructive.args,\n        disabled: true\n    }\n};\n\nexport const FullExample: Story = {\n    args: WithOnDismissCallback.args,\n    render: args => {\n        return (\n            <div className={\"wby-flex wby-gap-sm\"}>\n                <Tag {...args} content={\"Neutral base\"} variant={\"neutral-base\"} />\n                <Tag {...args} content={\"Neutral base outline\"} variant={\"neutral-base-outline\"} />\n                <Tag {...args} content={\"Neutral light\"} variant={\"neutral-light\"} />\n                <Tag {...args} content={\"Neutral muted\"} variant={\"neutral-muted\"} />\n                <Tag {...args} content={\"Neutral strong\"} variant={\"neutral-strong\"} />\n                <Tag {...args} content={\"Neutral xstrong\"} variant={\"neutral-xstrong\"} />\n                <Tag {...args} content={\"Neutral dark\"} variant={\"neutral-dark\"} />\n                <Tag {...args} content={\"Success\"} variant={\"success\"} />\n                <Tag {...args} content={\"Success light\"} variant={\"success-light\"} />\n                <Tag {...args} content={\"Warning\"} variant={\"warning\"} />\n                <Tag {...args} content={\"Destructive\"} variant={\"destructive\"} />\n                <Tag {...args} content={\"Accent\"} variant={\"accent\"} />\n                <Tag {...args} content={\"Accent light\"} variant={\"accent-light\"} />\n            </div>\n        );\n    }\n};\n\nexport const Documentation: Story = {\n    args: {\n        content: \"Label\",\n        variant: \"neutral-base\",\n        disabled: false,\n        onDismiss: undefined,\n        dismissIconElement: undefined,\n        dismissIconLabel: undefined\n    },\n    argTypes: {\n        content: {\n            description: \"The content of the tag. Please refer to the example code for details.\",\n            control: \"text\"\n        },\n        variant: {\n            description: \"The color variant of the tag.\",\n            control: \"select\",\n            options: [\n                \"neutral-base\",\n                \"neutral-base-outline\",\n                \"neutral-light\",\n                \"neutral-muted\",\n                \"neutral-strong\",\n                \"neutral-xstrong\",\n                \"neutral-dark\",\n                \"success\",\n                \"success-light\",\n                \"warning\",\n                \"destructive\",\n                \"accent\",\n                \"accent-light\"\n            ]\n        },\n        disabled: {\n            description: \"Whether the tag is disabled.\",\n            control: \"boolean\"\n        },\n        onDismiss: {\n            description:\n                \"Callback function when the tag is dismissed. Please refer to the 'Dismissible Tag' example code for details.\",\n            control: \"none\"\n        },\n        dismissIconElement: {\n            description:\n                \"Custom dismiss icon element. Please refer to the 'Custom Dismiss Icon' example code for details.\",\n            control: \"none\"\n        },\n        dismissIconLabel: {\n            description:\n                \"Custom dismiss icon label. Please refer to the 'Custom Dismiss Icon' example code for details.\",\n            control: \"none\"\n        }\n    }\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","Tag","ReactComponent","InfoIcon","AddIcon","meta","title","component","parameters","layout","Default","args","content","icon","createElement","WithOnClickCallback","onClick","evt","console","log","WithOnDismissCallback","onDismiss","WithCustomDismissIconElement","dismissIconElement","dismissIconLabel","NeutralBase","variant","NeutralBaseDisabled","disabled","NeutralBaseOutline","NeutralBaseOutlineDisabled","NeutralLight","NeutralLightDisabled","NeutralMuted","NeutralMutedDisabled","NeutralStrong","NeutralStrongDisabled","NeutralXStrong","NeutralXStrongDisabled","NeutralDark","NeutralDarkDisabled","Accent","AccentDisabled","AccentLight","AccentLightDisabled","Success","SuccessDisabled","SuccessLight","SuccessLightDisabled","Warning","WarningDisabled","Destructive","DestructiveDisabled","FullExample","render","className","Object","assign","WithSwatchColor","Fragment","swatchColor","Documentation","undefined","argTypes","description","control","options"],"sources":["Tag.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { Tag } from \"./Tag.js\";\nimport { ReactComponent as InfoIcon } from \"@webiny/icons/info.svg\";\nimport { ReactComponent as AddIcon } from \"@webiny/icons/add.svg\";\n\nconst meta: Meta<typeof Tag> = {\n    title: \"Components/Tag\",\n    component: Tag,\n    parameters: {\n        layout: \"padded\"\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Tag>;\n\nexport const Default: Story = {\n    args: {\n        content: \"Label\",\n        icon: <InfoIcon />\n    }\n};\n\nexport const WithOnClickCallback: Story = {\n    args: {\n        ...Default.args,\n        onClick: evt => {\n            console.log(\"onClick\", evt);\n        }\n    }\n};\n\nexport const WithOnDismissCallback: Story = {\n    args: {\n        ...Default.args,\n        onDismiss: evt => {\n            console.log(\"onDismiss\", evt);\n        }\n    }\n};\n\nexport const WithCustomDismissIconElement: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        dismissIconElement: <AddIcon />,\n        dismissIconLabel: \"Custom dismiss label\"\n    }\n};\n\nexport const NeutralBase: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-base\"\n    }\n};\n\nexport const NeutralBaseDisabled: Story = {\n    args: {\n        ...NeutralBase.args,\n        disabled: true\n    }\n};\n\nexport const NeutralBaseOutline: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-base-outline\"\n    }\n};\n\nexport const NeutralBaseOutlineDisabled: Story = {\n    args: {\n        ...NeutralBaseOutline.args,\n        disabled: true\n    }\n};\n\nexport const NeutralLight: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-light\"\n    }\n};\n\nexport const NeutralLightDisabled: Story = {\n    args: {\n        ...NeutralLight.args,\n        disabled: true\n    }\n};\n\nexport const NeutralMuted: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-muted\"\n    }\n};\n\nexport const NeutralMutedDisabled: Story = {\n    args: {\n        ...NeutralMuted.args,\n        disabled: true\n    }\n};\n\nexport const NeutralStrong: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-strong\"\n    }\n};\n\nexport const NeutralStrongDisabled: Story = {\n    args: {\n        ...NeutralStrong.args,\n        disabled: true\n    }\n};\n\nexport const NeutralXStrong: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-xstrong\"\n    }\n};\n\nexport const NeutralXStrongDisabled: Story = {\n    args: {\n        ...NeutralXStrong.args,\n        disabled: true\n    }\n};\n\nexport const NeutralDark: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-dark\"\n    }\n};\n\nexport const NeutralDarkDisabled: Story = {\n    args: {\n        ...NeutralDark.args,\n        disabled: true\n    }\n};\n\nexport const Accent: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"accent\"\n    }\n};\n\nexport const AccentDisabled: Story = {\n    args: {\n        ...Accent.args,\n        disabled: true\n    }\n};\n\nexport const AccentLight: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"accent-light\"\n    }\n};\n\nexport const AccentLightDisabled: Story = {\n    args: {\n        ...AccentLight.args,\n        disabled: true\n    }\n};\n\nexport const Success: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"success\"\n    }\n};\n\nexport const SuccessDisabled: Story = {\n    args: {\n        ...Success.args,\n        disabled: true\n    }\n};\n\nexport const SuccessLight: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"success-light\"\n    }\n};\n\nexport const SuccessLightDisabled: Story = {\n    args: {\n        ...SuccessLight.args,\n        disabled: true\n    }\n};\n\nexport const Warning: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"warning\"\n    }\n};\n\nexport const WarningDisabled: Story = {\n    args: {\n        ...Warning.args,\n        disabled: true\n    }\n};\n\nexport const Destructive: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"destructive\"\n    }\n};\n\nexport const DestructiveDisabled: Story = {\n    args: {\n        ...Destructive.args,\n        disabled: true\n    }\n};\n\nexport const FullExample: Story = {\n    args: WithOnDismissCallback.args,\n    render: args => {\n        return (\n            <div className={\"flex gap-sm\"}>\n                <Tag {...args} content={\"Neutral base\"} variant={\"neutral-base\"} />\n                <Tag {...args} content={\"Neutral base outline\"} variant={\"neutral-base-outline\"} />\n                <Tag {...args} content={\"Neutral light\"} variant={\"neutral-light\"} />\n                <Tag {...args} content={\"Neutral muted\"} variant={\"neutral-muted\"} />\n                <Tag {...args} content={\"Neutral strong\"} variant={\"neutral-strong\"} />\n                <Tag {...args} content={\"Neutral xstrong\"} variant={\"neutral-xstrong\"} />\n                <Tag {...args} content={\"Neutral dark\"} variant={\"neutral-dark\"} />\n                <Tag {...args} content={\"Success\"} variant={\"success\"} />\n                <Tag {...args} content={\"Success light\"} variant={\"success-light\"} />\n                <Tag {...args} content={\"Warning\"} variant={\"warning\"} />\n                <Tag {...args} content={\"Destructive\"} variant={\"destructive\"} />\n                <Tag {...args} content={\"Accent\"} variant={\"accent\"} />\n                <Tag {...args} content={\"Accent light\"} variant={\"accent-light\"} />\n            </div>\n        );\n    }\n};\n\nexport const WithSwatchColor: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-base-outline\",\n        content: <>An alert that can be closed and also has action button.</>,\n        swatchColor: \"#FF708F\"\n    }\n};\n\nexport const Documentation: Story = {\n    args: {\n        content: \"Label\",\n        variant: \"neutral-base\",\n        disabled: false,\n        onDismiss: undefined,\n        dismissIconElement: undefined,\n        dismissIconLabel: undefined\n    },\n    argTypes: {\n        content: {\n            description: \"The content of the tag. Please refer to the example code for details.\",\n            control: \"text\"\n        },\n        variant: {\n            description: \"The color variant of the tag.\",\n            control: \"select\",\n            options: [\n                \"neutral-base\",\n                \"neutral-base-outline\",\n                \"neutral-light\",\n                \"neutral-muted\",\n                \"neutral-strong\",\n                \"neutral-xstrong\",\n                \"neutral-dark\",\n                \"success\",\n                \"success-light\",\n                \"warning\",\n                \"destructive\",\n                \"accent\",\n                \"accent-light\"\n            ]\n        },\n        disabled: {\n            description: \"Whether the tag is disabled.\",\n            control: \"boolean\"\n        },\n        onDismiss: {\n            description:\n                \"Callback function when the tag is dismissed. Please refer to the 'Dismissible Tag' example code for details.\"\n        },\n        dismissIconElement: {\n            description:\n                \"Custom dismiss icon element. Please refer to the 'Custom Dismiss Icon' example code for details.\"\n        },\n        dismissIconLabel: {\n            description:\n                \"Custom dismiss icon label. Please refer to the 'Custom Dismiss Icon' example code for details.\"\n        }\n    }\n};\n"],"mappings":"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","ignoreList":[]}

package/Tag/TagIcon.d.ts

@@ -0,0 +1,2 @@
+import * as React from "react";
+export declare const TagIcon: () => React.JSX.Element | null;