@webiny/admin-ui 0.0.0-unstable.6f45466a1d → 0.0.0-unstable.7be00a75a9

package/Tag/Tag.stories.js.map

@@ -1 +1 @@
-{"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":[]}
+{"version":3,"file":"Tag/Tag.stories.js","sources":["../../src/Tag/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"],"names":["meta","Tag","Default","InfoIcon","WithOnClickCallback","evt","console","WithOnDismissCallback","WithCustomDismissIconElement","AddIcon","NeutralBase","NeutralBaseDisabled","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","args","WithSwatchColor","Documentation","undefined"],"mappings":"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"}

package/Tag/TagIcon.js

@@ -1,79 +1,82 @@
-import * as React from "react";
 import { cva } from "../utils.js";
 import { useTagProps } from "./TagPropsProvider.js";
 import { Icon } from "../Icon/Icon.js";
+import * as __rspack_external_react from "react";
 const tagIconVariants = cva("mr-xxs", {
-  variants: {
-    variant: {
-      "neutral-base": "fill-neutral-primary",
-      "neutral-base-outline": "fill-neutral-primary",
-      "neutral-light": "fill-neutral-primary",
-      "neutral-muted": "fill-neutral-primary",
-      "neutral-strong": "fill-neutral-light",
-      "neutral-xstrong": "fill-neutral-light",
-      "neutral-dark": "fill-neutral-light",
-      accent: "fill-neutral-light",
-      "accent-light": "fill-neutral-primary",
-      success: "fill-neutral-light",
-      "success-light": "fill-neutral-primary",
-      warning: "fill-neutral-primary",
-      destructive: "fill-neutral-light"
+    variants: {
+        variant: {
+            "neutral-base": "fill-neutral-primary",
+            "neutral-base-outline": "fill-neutral-primary",
+            "neutral-light": "fill-neutral-primary",
+            "neutral-muted": "fill-neutral-primary",
+            "neutral-strong": "fill-neutral-light",
+            "neutral-xstrong": "fill-neutral-light",
+            "neutral-dark": "fill-neutral-light",
+            accent: "fill-neutral-light",
+            "accent-light": "fill-neutral-primary",
+            success: "fill-neutral-light",
+            "success-light": "fill-neutral-primary",
+            warning: "fill-neutral-primary",
+            destructive: "fill-neutral-light"
+        },
+        disabled: {
+            true: ""
+        }
     },
-    disabled: {
-      true: ""
+    compoundVariants: [
+        {
+            variant: "neutral-base",
+            disabled: true,
+            className: "fill-neutral-disabled"
+        },
+        {
+            variant: "neutral-base-outline",
+            disabled: true,
+            className: "fill-neutral-disabled"
+        },
+        {
+            variant: "neutral-light",
+            disabled: true,
+            className: "fill-neutral-disabled"
+        },
+        {
+            variant: "neutral-muted",
+            disabled: true,
+            className: "fill-neutral-disabled"
+        },
+        {
+            variant: "accent-light",
+            disabled: true,
+            className: "fill-neutral-muted"
+        },
+        {
+            variant: "success-light",
+            disabled: true,
+            className: "fill-neutral-muted"
+        },
+        {
+            variant: "warning",
+            disabled: true,
+            className: "fill-neutral-disabled"
+        }
+    ],
+    defaultVariants: {
+        variant: "neutral-base"
     }
-  },
-  compoundVariants: [{
-    variant: "neutral-base",
-    disabled: true,
-    className: "fill-neutral-disabled"
-  }, {
-    variant: "neutral-base-outline",
-    disabled: true,
-    className: "fill-neutral-disabled"
-  }, {
-    variant: "neutral-light",
-    disabled: true,
-    className: "fill-neutral-disabled"
-  }, {
-    variant: "neutral-muted",
-    disabled: true,
-    className: "fill-neutral-disabled"
-  }, {
-    variant: "accent-light",
-    disabled: true,
-    className: "fill-neutral-muted"
-  }, {
-    variant: "success-light",
-    disabled: true,
-    className: "fill-neutral-muted"
-  }, {
-    variant: "warning",
-    disabled: true,
-    className: "fill-neutral-disabled"
-  }],
-  defaultVariants: {
-    variant: "neutral-base"
-  }
 });
-export const TagIcon = () => {
-  const {
-    icon,
-    variant,
-    disabled
-  } = useTagProps();
-  if (!icon) {
-    return null;
-  }
-  return /*#__PURE__*/React.createElement(Icon, {
-    label: "Tag icon",
-    icon: icon,
-    size: "xs",
-    className: tagIconVariants({
-      variant,
-      disabled
-    })
-  });
+const TagIcon = ()=>{
+    const { icon, variant, disabled } = useTagProps();
+    if (!icon) return null;
+    return /*#__PURE__*/ __rspack_external_react.createElement(Icon, {
+        label: "Tag icon",
+        icon: icon,
+        size: "xs",
+        className: tagIconVariants({
+            variant,
+            disabled
+        })
+    });
 };
+export { TagIcon };
 
 //# sourceMappingURL=TagIcon.js.map

package/Tag/TagIcon.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","cva","useTagProps","Icon","tagIconVariants","variants","variant","accent","success","warning","destructive","disabled","true","compoundVariants","className","defaultVariants","TagIcon","icon","createElement","label","size"],"sources":["TagIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cva } from \"~/utils.js\";\nimport { useTagProps } from \"./TagPropsProvider.js\";\nimport { Icon } from \"~/Icon/Icon.js\";\n\nconst tagIconVariants = cva(\"mr-xxs\", {\n    variants: {\n        variant: {\n            \"neutral-base\": \"fill-neutral-primary\",\n            \"neutral-base-outline\": \"fill-neutral-primary\",\n            \"neutral-light\": \"fill-neutral-primary\",\n            \"neutral-muted\": \"fill-neutral-primary\",\n            \"neutral-strong\": \"fill-neutral-light\",\n            \"neutral-xstrong\": \"fill-neutral-light\",\n            \"neutral-dark\": \"fill-neutral-light\",\n            accent: \"fill-neutral-light\",\n            \"accent-light\": \"fill-neutral-primary\",\n            success: \"fill-neutral-light\",\n            \"success-light\": \"fill-neutral-primary\",\n            warning: \"fill-neutral-primary\",\n            destructive: \"fill-neutral-light\"\n        },\n        disabled: {\n            true: \"\"\n        }\n    },\n    compoundVariants: [\n        { variant: \"neutral-base\", disabled: true, className: \"fill-neutral-disabled\" },\n        { variant: \"neutral-base-outline\", disabled: true, className: \"fill-neutral-disabled\" },\n        { variant: \"neutral-light\", disabled: true, className: \"fill-neutral-disabled\" },\n        { variant: \"neutral-muted\", disabled: true, className: \"fill-neutral-disabled\" },\n        { variant: \"accent-light\", disabled: true, className: \"fill-neutral-muted\" },\n        { variant: \"success-light\", disabled: true, className: \"fill-neutral-muted\" },\n        { variant: \"warning\", disabled: true, className: \"fill-neutral-disabled\" }\n    ],\n    defaultVariants: {\n        variant: \"neutral-base\"\n    }\n});\n\nexport const TagIcon = () => {\n    const { icon, variant, disabled } = useTagProps();\n    if (!icon) {\n        return null;\n    }\n\n    return (\n        <Icon\n            label={\"Tag icon\"}\n            icon={icon}\n            size=\"xs\"\n            className={tagIconVariants({ variant, disabled })}\n        />\n    );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,GAAG;AACZ,SAASC,WAAW;AACpB,SAASC,IAAI;AAEb,MAAMC,eAAe,GAAGH,GAAG,CAAC,QAAQ,EAAE;EAClCI,QAAQ,EAAE;IACNC,OAAO,EAAE;MACL,cAAc,EAAE,sBAAsB;MACtC,sBAAsB,EAAE,sBAAsB;MAC9C,eAAe,EAAE,sBAAsB;MACvC,eAAe,EAAE,sBAAsB;MACvC,gBAAgB,EAAE,oBAAoB;MACtC,iBAAiB,EAAE,oBAAoB;MACvC,cAAc,EAAE,oBAAoB;MACpCC,MAAM,EAAE,oBAAoB;MAC5B,cAAc,EAAE,sBAAsB;MACtCC,OAAO,EAAE,oBAAoB;MAC7B,eAAe,EAAE,sBAAsB;MACvCC,OAAO,EAAE,sBAAsB;MAC/BC,WAAW,EAAE;IACjB,CAAC;IACDC,QAAQ,EAAE;MACNC,IAAI,EAAE;IACV;EACJ,CAAC;EACDC,gBAAgB,EAAE,CACd;IAAEP,OAAO,EAAE,cAAc;IAAEK,QAAQ,EAAE,IAAI;IAAEG,SAAS,EAAE;EAAwB,CAAC,EAC/E;IAAER,OAAO,EAAE,sBAAsB;IAAEK,QAAQ,EAAE,IAAI;IAAEG,SAAS,EAAE;EAAwB,CAAC,EACvF;IAAER,OAAO,EAAE,eAAe;IAAEK,QAAQ,EAAE,IAAI;IAAEG,SAAS,EAAE;EAAwB,CAAC,EAChF;IAAER,OAAO,EAAE,eAAe;IAAEK,QAAQ,EAAE,IAAI;IAAEG,SAAS,EAAE;EAAwB,CAAC,EAChF;IAAER,OAAO,EAAE,cAAc;IAAEK,QAAQ,EAAE,IAAI;IAAEG,SAAS,EAAE;EAAqB,CAAC,EAC5E;IAAER,OAAO,EAAE,eAAe;IAAEK,QAAQ,EAAE,IAAI;IAAEG,SAAS,EAAE;EAAqB,CAAC,EAC7E;IAAER,OAAO,EAAE,SAAS;IAAEK,QAAQ,EAAE,IAAI;IAAEG,SAAS,EAAE;EAAwB,CAAC,CAC7E;EACDC,eAAe,EAAE;IACbT,OAAO,EAAE;EACb;AACJ,CAAC,CAAC;AAEF,OAAO,MAAMU,OAAO,GAAGA,CAAA,KAAM;EACzB,MAAM;IAAEC,IAAI;IAAEX,OAAO;IAAEK;EAAS,CAAC,GAAGT,WAAW,CAAC,CAAC;EACjD,IAAI,CAACe,IAAI,EAAE;IACP,OAAO,IAAI;EACf;EAEA,oBACIjB,KAAA,CAAAkB,aAAA,CAACf,IAAI;IACDgB,KAAK,EAAE,UAAW;IAClBF,IAAI,EAAEA,IAAK;IACXG,IAAI,EAAC,IAAI;IACTN,SAAS,EAAEV,eAAe,CAAC;MAAEE,OAAO;MAAEK;IAAS,CAAC;EAAE,CACrD,CAAC;AAEV,CAAC","ignoreList":[]}
+{"version":3,"file":"Tag/TagIcon.js","sources":["../../src/Tag/TagIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cva } from \"~/utils.js\";\nimport { useTagProps } from \"./TagPropsProvider.js\";\nimport { Icon } from \"~/Icon/Icon.js\";\n\nconst tagIconVariants = cva(\"mr-xxs\", {\n    variants: {\n        variant: {\n            \"neutral-base\": \"fill-neutral-primary\",\n            \"neutral-base-outline\": \"fill-neutral-primary\",\n            \"neutral-light\": \"fill-neutral-primary\",\n            \"neutral-muted\": \"fill-neutral-primary\",\n            \"neutral-strong\": \"fill-neutral-light\",\n            \"neutral-xstrong\": \"fill-neutral-light\",\n            \"neutral-dark\": \"fill-neutral-light\",\n            accent: \"fill-neutral-light\",\n            \"accent-light\": \"fill-neutral-primary\",\n            success: \"fill-neutral-light\",\n            \"success-light\": \"fill-neutral-primary\",\n            warning: \"fill-neutral-primary\",\n            destructive: \"fill-neutral-light\"\n        },\n        disabled: {\n            true: \"\"\n        }\n    },\n    compoundVariants: [\n        { variant: \"neutral-base\", disabled: true, className: \"fill-neutral-disabled\" },\n        { variant: \"neutral-base-outline\", disabled: true, className: \"fill-neutral-disabled\" },\n        { variant: \"neutral-light\", disabled: true, className: \"fill-neutral-disabled\" },\n        { variant: \"neutral-muted\", disabled: true, className: \"fill-neutral-disabled\" },\n        { variant: \"accent-light\", disabled: true, className: \"fill-neutral-muted\" },\n        { variant: \"success-light\", disabled: true, className: \"fill-neutral-muted\" },\n        { variant: \"warning\", disabled: true, className: \"fill-neutral-disabled\" }\n    ],\n    defaultVariants: {\n        variant: \"neutral-base\"\n    }\n});\n\nexport const TagIcon = () => {\n    const { icon, variant, disabled } = useTagProps();\n    if (!icon) {\n        return null;\n    }\n\n    return (\n        <Icon\n            label={\"Tag icon\"}\n            icon={icon}\n            size=\"xs\"\n            className={tagIconVariants({ variant, disabled })}\n        />\n    );\n};\n"],"names":["tagIconVariants","cva","TagIcon","icon","variant","disabled","useTagProps","Icon"],"mappings":";;;;AAKA,MAAMA,kBAAkBC,IAAI,UAAU;IAClC,UAAU;QACN,SAAS;YACL,gBAAgB;YAChB,wBAAwB;YACxB,iBAAiB;YACjB,iBAAiB;YACjB,kBAAkB;YAClB,mBAAmB;YACnB,gBAAgB;YAChB,QAAQ;YACR,gBAAgB;YAChB,SAAS;YACT,iBAAiB;YACjB,SAAS;YACT,aAAa;QACjB;QACA,UAAU;YACN,MAAM;QACV;IACJ;IACA,kBAAkB;QACd;YAAE,SAAS;YAAgB,UAAU;YAAM,WAAW;QAAwB;QAC9E;YAAE,SAAS;YAAwB,UAAU;YAAM,WAAW;QAAwB;QACtF;YAAE,SAAS;YAAiB,UAAU;YAAM,WAAW;QAAwB;QAC/E;YAAE,SAAS;YAAiB,UAAU;YAAM,WAAW;QAAwB;QAC/E;YAAE,SAAS;YAAgB,UAAU;YAAM,WAAW;QAAqB;QAC3E;YAAE,SAAS;YAAiB,UAAU;YAAM,WAAW;QAAqB;QAC5E;YAAE,SAAS;YAAW,UAAU;YAAM,WAAW;QAAwB;KAC5E;IACD,iBAAiB;QACb,SAAS;IACb;AACJ;AAEO,MAAMC,UAAU;IACnB,MAAM,EAAEC,IAAI,EAAEC,OAAO,EAAEC,QAAQ,EAAE,GAAGC;IACpC,IAAI,CAACH,MACD,OAAO;IAGX,OAAO,WAAP,GACI,sCAACI,MAAIA;QACD,OAAO;QACP,MAAMJ;QACN,MAAK;QACL,WAAWH,gBAAgB;YAAEI;YAASC;QAAS;;AAG3D"}

package/Tag/TagPropsProvider.js.map

@@ -1 +1 @@
-{"version":3,"names":["createComponentPropsProvider","TagPropsProvider","useTagProps"],"sources":["TagPropsProvider.ts"],"sourcesContent":["import { createComponentPropsProvider } from \"~/utils.js\";\nimport { type TagProps } from \"./Tag.js\";\n\nconst [TagPropsProvider, useTagProps] = createComponentPropsProvider<TagProps>();\n\nexport { TagPropsProvider, useTagProps };\n"],"mappings":"AAAA,SAASA,4BAA4B;AAGrC,MAAM,CAACC,gBAAgB,EAAEC,WAAW,CAAC,GAAGF,4BAA4B,CAAW,CAAC;AAEhF,SAASC,gBAAgB,EAAEC,WAAW","ignoreList":[]}
+{"version":3,"file":"Tag/TagPropsProvider.js","sources":["../../src/Tag/TagPropsProvider.ts"],"sourcesContent":["import { createComponentPropsProvider } from \"~/utils.js\";\nimport { type TagProps } from \"./Tag.js\";\n\nconst [TagPropsProvider, useTagProps] = createComponentPropsProvider<TagProps>();\n\nexport { TagPropsProvider, useTagProps };\n"],"names":["TagPropsProvider","useTagProps","createComponentPropsProvider"],"mappings":";AAGA,MAAM,CAACA,kBAAkBC,YAAY,GAAGC"}

package/Tag/TagSwatchBox.js

@@ -1,21 +1,17 @@
-import * as React from "react";
 import { useTagProps } from "./TagPropsProvider.js";
-export const TagSwatchBox = () => {
-  const {
-    swatchColor,
-    swatchColorIcon
-  } = useTagProps();
-  if (!swatchColor || swatchColorIcon === false) {
-    return null;
-  }
-  return /*#__PURE__*/React.createElement("div", {
-    className: "mr-xs"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "size-sm rounded-xs",
-    style: {
-      backgroundColor: swatchColor
-    }
-  }));
+import * as __rspack_external_react from "react";
+const TagSwatchBox = ()=>{
+    const { swatchColor, swatchColorIcon } = useTagProps();
+    if (!swatchColor || false === swatchColorIcon) return null;
+    return /*#__PURE__*/ __rspack_external_react.createElement("div", {
+        className: "mr-xs"
+    }, /*#__PURE__*/ __rspack_external_react.createElement("div", {
+        className: "size-sm rounded-xs",
+        style: {
+            backgroundColor: swatchColor
+        }
+    }));
 };
+export { TagSwatchBox };
 
 //# sourceMappingURL=TagSwatchBox.js.map

package/Tag/TagSwatchBox.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useTagProps","TagSwatchBox","swatchColor","swatchColorIcon","createElement","className","style","backgroundColor"],"sources":["TagSwatchBox.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { useTagProps } from \"./TagPropsProvider.js\";\n\nexport const TagSwatchBox = () => {\n    const { swatchColor, swatchColorIcon } = useTagProps();\n\n    if (!swatchColor || swatchColorIcon === false) {\n        return null;\n    }\n\n    return (\n        <div className={\"mr-xs\"}>\n            <div className={\"size-sm rounded-xs\"} style={{ backgroundColor: swatchColor }} />\n        </div>\n    );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,WAAW;AAEpB,OAAO,MAAMC,YAAY,GAAGA,CAAA,KAAM;EAC9B,MAAM;IAAEC,WAAW;IAAEC;EAAgB,CAAC,GAAGH,WAAW,CAAC,CAAC;EAEtD,IAAI,CAACE,WAAW,IAAIC,eAAe,KAAK,KAAK,EAAE;IAC3C,OAAO,IAAI;EACf;EAEA,oBACIJ,KAAA,CAAAK,aAAA;IAAKC,SAAS,EAAE;EAAQ,gBACpBN,KAAA,CAAAK,aAAA;IAAKC,SAAS,EAAE,oBAAqB;IAACC,KAAK,EAAE;MAAEC,eAAe,EAAEL;IAAY;EAAE,CAAE,CAC/E,CAAC;AAEd,CAAC","ignoreList":[]}
+{"version":3,"file":"Tag/TagSwatchBox.js","sources":["../../src/Tag/TagSwatchBox.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { useTagProps } from \"./TagPropsProvider.js\";\n\nexport const TagSwatchBox = () => {\n    const { swatchColor, swatchColorIcon } = useTagProps();\n\n    if (!swatchColor || swatchColorIcon === false) {\n        return null;\n    }\n\n    return (\n        <div className={\"mr-xs\"}>\n            <div className={\"size-sm rounded-xs\"} style={{ backgroundColor: swatchColor }} />\n        </div>\n    );\n};\n"],"names":["TagSwatchBox","swatchColor","swatchColorIcon","useTagProps"],"mappings":";;AAGO,MAAMA,eAAe;IACxB,MAAM,EAAEC,WAAW,EAAEC,eAAe,EAAE,GAAGC;IAEzC,IAAI,CAACF,eAAeC,AAAoB,UAApBA,iBAChB,OAAO;IAGX,OAAO,WAAP,GACI,sCAAC;QAAI,WAAW;qBACZ,sCAAC;QAAI,WAAW;QAAsB,OAAO;YAAE,iBAAiBD;QAAY;;AAGxF"}

package/Tag/index.js

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

package/Tags/Tags.d.ts

@@ -2,21 +2,21 @@ 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, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TagsProps) => React.JSX.Element) & {
-    original: ({ label, description, note, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TagsProps) => React.JSX.Element;
+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;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ label, description, note, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TagsProps) => React.JSX.Element) & {
-        original: ({ label, description, note, 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: ({ label, description, note, hint, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TagsProps) => React.JSX.Element;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ label, description, note, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TagsProps) => React.JSX.Element) & {
-        original: ({ label, description, note, required, disabled, validation, validate, onBlur: originalOnBlur, ...props }: TagsProps) => React.JSX.Element;
+    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;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/Tags/Tags.js

@@ -1,57 +1,51 @@
-import React, { useCallback, useMemo } from "react";
-import { makeDecoratable, generateId } from "../utils.js";
+import react, { useCallback, useMemo } from "react";
+import { generateId, makeDecoratable } from "../utils.js";
 import { TagsPrimitive } from "./primitives/index.js";
 import { FormComponentDescription, FormComponentErrorMessage, FormComponentLabel, FormComponentNote } from "../FormComponent/index.js";
-const DecoratableTags = ({
-  label,
-  description,
-  note,
-  required,
-  disabled,
-  validation,
-  validate,
-  onBlur: originalOnBlur,
-  ...props
-}) => {
-  const {
-    isValid: validationIsValid,
-    message: validationMessage
-  } = validation || {};
-  const id = useMemo(() => generateId(props.id), [props.id]);
-  const invalid = useMemo(() => validationIsValid === false, [validationIsValid]);
-  const onBlur = useCallback(async e => {
-    if (validate) {
-      // Since we are accessing event in an async operation, we need to persist it.
-      // See https://reactjs.org/docs/events.html#event-pooling.
-      e.persist();
-      await validate();
-    }
-    originalOnBlur && originalOnBlur(e);
-  }, [validate, originalOnBlur]);
-  return /*#__PURE__*/React.createElement("div", {
-    className: "w-full"
-  }, /*#__PURE__*/React.createElement(FormComponentLabel, {
-    htmlFor: id,
-    text: label,
-    required: required,
-    disabled: disabled,
-    invalid: invalid
-  }), /*#__PURE__*/React.createElement(FormComponentDescription, {
-    text: description,
-    disabled: disabled
-  }), /*#__PURE__*/React.createElement(TagsPrimitive, Object.assign({}, props, {
-    id: id,
-    disabled: disabled,
-    invalid: invalid,
-    onBlur: onBlur
-  })), /*#__PURE__*/React.createElement(FormComponentErrorMessage, {
-    text: validationMessage,
-    invalid: invalid,
-    disabled: disabled
-  }), /*#__PURE__*/React.createElement(FormComponentNote, {
-    text: note,
-    disabled: disabled
-  }));
+const DecoratableTags = ({ label, description, note, hint, required, disabled, validation, validate, onBlur: originalOnBlur, ...props })=>{
+    const { isValid: validationIsValid, message: validationMessage } = validation || {};
+    const id = useMemo(()=>generateId(props.id), [
+        props.id
+    ]);
+    const invalid = useMemo(()=>false === validationIsValid, [
+        validationIsValid
+    ]);
+    const onBlur = useCallback(async (e)=>{
+        if (validate) {
+            e.persist();
+            await validate();
+        }
+        originalOnBlur && originalOnBlur(e);
+    }, [
+        validate,
+        originalOnBlur
+    ]);
+    return /*#__PURE__*/ react.createElement("div", {
+        className: "w-full"
+    }, /*#__PURE__*/ react.createElement(FormComponentLabel, {
+        htmlFor: id,
+        text: label,
+        hint: hint,
+        required: required,
+        disabled: disabled,
+        invalid: invalid
+    }), /*#__PURE__*/ react.createElement(FormComponentDescription, {
+        text: description,
+        disabled: disabled
+    }), /*#__PURE__*/ react.createElement(TagsPrimitive, {
+        ...props,
+        id: id,
+        disabled: disabled,
+        invalid: invalid,
+        onBlur: onBlur
+    }), /*#__PURE__*/ react.createElement(FormComponentErrorMessage, {
+        text: validationMessage,
+        invalid: invalid,
+        disabled: disabled
+    }), /*#__PURE__*/ react.createElement(FormComponentNote, {
+        text: note,
+        disabled: disabled
+    }));
 };
 const Tags = makeDecoratable("Tags", DecoratableTags);
 export { Tags };

package/Tags/Tags.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useMemo","makeDecoratable","generateId","TagsPrimitive","FormComponentDescription","FormComponentErrorMessage","FormComponentLabel","FormComponentNote","DecoratableTags","label","description","note","required","disabled","validation","validate","onBlur","originalOnBlur","props","isValid","validationIsValid","message","validationMessage","id","invalid","e","persist","createElement","className","htmlFor","text","Object","assign","Tags"],"sources":["Tags.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from \"react\";\nimport { makeDecoratable, generateId } from \"~/utils.js\";\nimport { TagsPrimitive, type TagsPrimitiveProps } from \"./primitives/index.js\";\n\nimport {\n    FormComponentDescription,\n    FormComponentErrorMessage,\n    FormComponentLabel,\n    FormComponentNote,\n    type FormComponentProps\n} from \"~/FormComponent/index.js\";\n\ntype TagsProps = TagsPrimitiveProps & FormComponentProps;\n\nconst DecoratableTags = ({\n    label,\n    description,\n    note,\n    required,\n    disabled,\n    validation,\n    validate,\n    onBlur: originalOnBlur,\n    ...props\n}: TagsProps) => {\n    const { isValid: validationIsValid, message: validationMessage } = validation || {};\n    const id = useMemo(() => generateId(props.id), [props.id]);\n    const invalid = useMemo(() => validationIsValid === false, [validationIsValid]);\n\n    const onBlur = useCallback(\n        async (e: React.FocusEvent<HTMLInputElement>) => {\n            if (validate) {\n                // Since we are accessing event in an async operation, we need to persist it.\n                // See https://reactjs.org/docs/events.html#event-pooling.\n                e.persist();\n                await validate();\n            }\n            originalOnBlur && originalOnBlur(e);\n        },\n        [validate, originalOnBlur]\n    );\n\n    return (\n        <div className={\"w-full\"}>\n            <FormComponentLabel\n                htmlFor={id}\n                text={label}\n                required={required}\n                disabled={disabled}\n                invalid={invalid}\n            />\n            <FormComponentDescription text={description} disabled={disabled} />\n            <TagsPrimitive\n                {...props}\n                id={id}\n                disabled={disabled}\n                invalid={invalid}\n                onBlur={onBlur}\n            />\n            <FormComponentErrorMessage\n                text={validationMessage}\n                invalid={invalid}\n                disabled={disabled}\n            />\n            <FormComponentNote text={note} disabled={disabled} />\n        </div>\n    );\n};\n\nconst Tags = makeDecoratable(\"Tags\", DecoratableTags);\n\nexport { Tags, type TagsProps };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,OAAO,QAAQ,OAAO;AACnD,SAASC,eAAe,EAAEC,UAAU;AACpC,SAASC,aAAa;AAEtB,SACIC,wBAAwB,EACxBC,yBAAyB,EACzBC,kBAAkB,EAClBC,iBAAiB;AAMrB,MAAMC,eAAe,GAAGA,CAAC;EACrBC,KAAK;EACLC,WAAW;EACXC,IAAI;EACJC,QAAQ;EACRC,QAAQ;EACRC,UAAU;EACVC,QAAQ;EACRC,MAAM,EAAEC,cAAc;EACtB,GAAGC;AACI,CAAC,KAAK;EACb,MAAM;IAAEC,OAAO,EAAEC,iBAAiB;IAAEC,OAAO,EAAEC;EAAkB,CAAC,GAAGR,UAAU,IAAI,CAAC,CAAC;EACnF,MAAMS,EAAE,GAAGvB,OAAO,CAAC,MAAME,UAAU,CAACgB,KAAK,CAACK,EAAE,CAAC,EAAE,CAACL,KAAK,CAACK,EAAE,CAAC,CAAC;EAC1D,MAAMC,OAAO,GAAGxB,OAAO,CAAC,MAAMoB,iBAAiB,KAAK,KAAK,EAAE,CAACA,iBAAiB,CAAC,CAAC;EAE/E,MAAMJ,MAAM,GAAGjB,WAAW,CACtB,MAAO0B,CAAqC,IAAK;IAC7C,IAAIV,QAAQ,EAAE;MACV;MACA;MACAU,CAAC,CAACC,OAAO,CAAC,CAAC;MACX,MAAMX,QAAQ,CAAC,CAAC;IACpB;IACAE,cAAc,IAAIA,cAAc,CAACQ,CAAC,CAAC;EACvC,CAAC,EACD,CAACV,QAAQ,EAAEE,cAAc,CAC7B,CAAC;EAED,oBACInB,KAAA,CAAA6B,aAAA;IAAKC,SAAS,EAAE;EAAS,gBACrB9B,KAAA,CAAA6B,aAAA,CAACrB,kBAAkB;IACfuB,OAAO,EAAEN,EAAG;IACZO,IAAI,EAAErB,KAAM;IACZG,QAAQ,EAAEA,QAAS;IACnBC,QAAQ,EAAEA,QAAS;IACnBW,OAAO,EAAEA;EAAQ,CACpB,CAAC,eACF1B,KAAA,CAAA6B,aAAA,CAACvB,wBAAwB;IAAC0B,IAAI,EAAEpB,WAAY;IAACG,QAAQ,EAAEA;EAAS,CAAE,CAAC,eACnEf,KAAA,CAAA6B,aAAA,CAACxB,aAAa,EAAA4B,MAAA,CAAAC,MAAA,KACNd,KAAK;IACTK,EAAE,EAAEA,EAAG;IACPV,QAAQ,EAAEA,QAAS;IACnBW,OAAO,EAAEA,OAAQ;IACjBR,MAAM,EAAEA;EAAO,EAClB,CAAC,eACFlB,KAAA,CAAA6B,aAAA,CAACtB,yBAAyB;IACtByB,IAAI,EAAER,iBAAkB;IACxBE,OAAO,EAAEA,OAAQ;IACjBX,QAAQ,EAAEA;EAAS,CACtB,CAAC,eACFf,KAAA,CAAA6B,aAAA,CAACpB,iBAAiB;IAACuB,IAAI,EAAEnB,IAAK;IAACE,QAAQ,EAAEA;EAAS,CAAE,CACnD,CAAC;AAEd,CAAC;AAED,MAAMoB,IAAI,GAAGhC,eAAe,CAAC,MAAM,EAAEO,eAAe,CAAC;AAErD,SAASyB,IAAI","ignoreList":[]}
+{"version":3,"file":"Tags/Tags.js","sources":["../../src/Tags/Tags.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from \"react\";\nimport { makeDecoratable, generateId } from \"~/utils.js\";\nimport { TagsPrimitive, type TagsPrimitiveProps } from \"./primitives/index.js\";\n\nimport {\n    FormComponentDescription,\n    FormComponentErrorMessage,\n    FormComponentLabel,\n    FormComponentNote,\n    type FormComponentProps\n} from \"~/FormComponent/index.js\";\n\ntype TagsProps = TagsPrimitiveProps & FormComponentProps;\n\nconst DecoratableTags = ({\n    label,\n    description,\n    note,\n    hint,\n    required,\n    disabled,\n    validation,\n    validate,\n    onBlur: originalOnBlur,\n    ...props\n}: TagsProps) => {\n    const { isValid: validationIsValid, message: validationMessage } = validation || {};\n    const id = useMemo(() => generateId(props.id), [props.id]);\n    const invalid = useMemo(() => validationIsValid === false, [validationIsValid]);\n\n    const onBlur = useCallback(\n        async (e: React.FocusEvent<HTMLInputElement>) => {\n            if (validate) {\n                // Since we are accessing event in an async operation, we need to persist it.\n                // See https://reactjs.org/docs/events.html#event-pooling.\n                e.persist();\n                await validate();\n            }\n            originalOnBlur && originalOnBlur(e);\n        },\n        [validate, originalOnBlur]\n    );\n\n    return (\n        <div className={\"w-full\"}>\n            <FormComponentLabel\n                htmlFor={id}\n                text={label}\n                hint={hint}\n                required={required}\n                disabled={disabled}\n                invalid={invalid}\n            />\n            <FormComponentDescription text={description} disabled={disabled} />\n            <TagsPrimitive\n                {...props}\n                id={id}\n                disabled={disabled}\n                invalid={invalid}\n                onBlur={onBlur}\n            />\n            <FormComponentErrorMessage\n                text={validationMessage}\n                invalid={invalid}\n                disabled={disabled}\n            />\n            <FormComponentNote text={note} disabled={disabled} />\n        </div>\n    );\n};\n\nconst Tags = makeDecoratable(\"Tags\", DecoratableTags);\n\nexport { Tags, type TagsProps };\n"],"names":["DecoratableTags","label","description","note","hint","required","disabled","validation","validate","originalOnBlur","props","validationIsValid","validationMessage","id","useMemo","generateId","invalid","onBlur","useCallback","e","FormComponentLabel","FormComponentDescription","TagsPrimitive","FormComponentErrorMessage","FormComponentNote","Tags","makeDecoratable"],"mappings":";;;;AAcA,MAAMA,kBAAkB,CAAC,EACrBC,KAAK,EACLC,WAAW,EACXC,IAAI,EACJC,IAAI,EACJC,QAAQ,EACRC,QAAQ,EACRC,UAAU,EACVC,QAAQ,EACR,QAAQC,cAAc,EACtB,GAAGC,OACK;IACR,MAAM,EAAE,SAASC,iBAAiB,EAAE,SAASC,iBAAiB,EAAE,GAAGL,cAAc,CAAC;IAClF,MAAMM,KAAKC,QAAQ,IAAMC,WAAWL,MAAM,EAAE,GAAG;QAACA,MAAM,EAAE;KAAC;IACzD,MAAMM,UAAUF,QAAQ,IAAMH,AAAsB,UAAtBA,mBAA6B;QAACA;KAAkB;IAE9E,MAAMM,SAASC,YACX,OAAOC;QACH,IAAIX,UAAU;YAGVW,EAAE,OAAO;YACT,MAAMX;QACV;QACAC,kBAAkBA,eAAeU;IACrC,GACA;QAACX;QAAUC;KAAe;IAG9B,OAAO,WAAP,GACI,oBAAC;QAAI,WAAW;qBACZ,oBAACW,oBAAkBA;QACf,SAASP;QACT,MAAMZ;QACN,MAAMG;QACN,UAAUC;QACV,UAAUC;QACV,SAASU;sBAEb,oBAACK,0BAAwBA;QAAC,MAAMnB;QAAa,UAAUI;sBACvD,oBAACgB,eAAaA;QACT,GAAGZ,KAAK;QACT,IAAIG;QACJ,UAAUP;QACV,SAASU;QACT,QAAQC;sBAEZ,oBAACM,2BAAyBA;QACtB,MAAMX;QACN,SAASI;QACT,UAAUV;sBAEd,oBAACkB,mBAAiBA;QAAC,MAAMrB;QAAM,UAAUG;;AAGrD;AAEA,MAAMmB,OAAOC,gBAAgB,QAAQ1B"}