@webiny/app-admin 0.0.0-unstable.eb196ccd2f → 0.0.0-unstable.eb81deee7e

package/components/IconPicker/components/IconPickerTrigger.js

@@ -1,52 +1,50 @@
-import React from "react";
-import { ReactComponent as EmptyIcon } from "@webiny/icons/remove.svg";
-import { ReactComponent as ChevronDown } from "@webiny/icons/keyboard_arrow_down.svg";
-import { cn, cva, Icon as IconComponent, inputVariants } from "@webiny/admin-ui";
-import { IconProvider, IconRenderer } from "../IconRenderer";
-const iconPickerTriggerVariants = cva("wby-cursor-pointer fill-neutral-xstrong", {
-  variants: {
-    size: {
-      md: "wby-w-[64px]",
-      lg: "wby-w-[64px]",
-      xl: "wby-w-[76px]"
+import react from "react";
+import { ReactComponent } from "@webiny/icons/remove.svg";
+import { ReactComponent as keyboard_arrow_down_svg_ReactComponent } from "@webiny/icons/keyboard_arrow_down.svg";
+import { Icon, cn, cva, inputVariants } from "@webiny/admin-ui";
+import { IconProvider, IconRenderer } from "../IconRenderer.js";
+const iconPickerTriggerVariants = cva("cursor-pointer fill-neutral-xstrong", {
+    variants: {
+        size: {
+            md: "w-3xl",
+            lg: "w-3xl",
+            xl: "w-[76px]"
+        },
+        disabled: {
+            true: "pointer-events-none"
+        }
     },
-    disabled: {
-      true: "wby-pointer-events-none"
+    defaultVariants: {
+        size: "md"
     }
-  },
-  defaultVariants: {
-    size: "md"
-  }
 });
-const IconPickerTrigger = props => {
-  return /*#__PURE__*/React.createElement("div", {
-    "data-disabled": props.disabled,
-    className: cn(inputVariants({
-      size: props.size,
-      variant: props.variant,
-      invalid: props.invalid
-    }), iconPickerTriggerVariants({
-      size: props.size,
-      disabled: props.disabled
-    }))
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "wby-flex wby-items-center wby-gap-xs"
-  }, /*#__PURE__*/React.createElement("div", null, props.icon ? /*#__PURE__*/React.createElement(IconProvider, {
-    icon: props.icon,
-    size: 24
-  }, /*#__PURE__*/React.createElement(IconComponent, {
-    icon: /*#__PURE__*/React.createElement(IconRenderer, null),
-    label: props.icon.name
-  })) : /*#__PURE__*/React.createElement(IconComponent, {
-    icon: /*#__PURE__*/React.createElement(EmptyIcon, null),
-    label: "Search icons",
-    size: "lg"
-  })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(IconComponent, {
-    size: "sm",
-    icon: /*#__PURE__*/React.createElement(ChevronDown, null),
-    label: "Open list"
-  }))));
-};
+const IconPickerTrigger = (props)=>/*#__PURE__*/ react.createElement("div", {
+        "data-disabled": props.disabled,
+        className: cn(inputVariants({
+            size: props.size,
+            variant: props.variant,
+            invalid: props.invalid
+        }), iconPickerTriggerVariants({
+            size: props.size,
+            disabled: props.disabled
+        }))
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "flex items-center gap-xs"
+    }, /*#__PURE__*/ react.createElement("div", null, props.icon ? /*#__PURE__*/ react.createElement(IconProvider, {
+        icon: props.icon,
+        size: 24
+    }, /*#__PURE__*/ react.createElement(Icon, {
+        icon: /*#__PURE__*/ react.createElement(IconRenderer, null),
+        label: props.icon.name
+    })) : /*#__PURE__*/ react.createElement(Icon, {
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+        label: "Search icons",
+        size: "lg"
+    })), /*#__PURE__*/ react.createElement("div", null, /*#__PURE__*/ react.createElement(Icon, {
+        size: "sm",
+        icon: /*#__PURE__*/ react.createElement(keyboard_arrow_down_svg_ReactComponent, null),
+        label: "Open list"
+    }))));
 export { IconPickerTrigger };
 
 //# sourceMappingURL=IconPickerTrigger.js.map

package/components/IconPicker/components/IconPickerTrigger.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","ReactComponent","EmptyIcon","ChevronDown","cn","cva","Icon","IconComponent","inputVariants","IconProvider","IconRenderer","iconPickerTriggerVariants","variants","size","md","lg","xl","disabled","true","defaultVariants","IconPickerTrigger","props","createElement","className","variant","invalid","icon","label","name"],"sources":["IconPickerTrigger.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as EmptyIcon } from \"@webiny/icons/remove.svg\";\nimport { ReactComponent as ChevronDown } from \"@webiny/icons/keyboard_arrow_down.svg\";\nimport { cn, cva, Icon as IconComponent, inputVariants, type VariantProps } from \"@webiny/admin-ui\";\nimport { IconProvider, IconRenderer } from \"~/components/IconPicker/IconRenderer\";\nimport type { Icon } from \"~/components/IconPicker/types\";\n\nconst iconPickerTriggerVariants = cva(\"wby-cursor-pointer fill-neutral-xstrong\", {\n    variants: {\n        size: {\n            md: \"wby-w-[64px]\",\n            lg: \"wby-w-[64px]\",\n            xl: \"wby-w-[76px]\"\n        },\n        disabled: {\n            true: \"wby-pointer-events-none\"\n        }\n    },\n    defaultVariants: {\n        size: \"md\"\n    }\n});\n\ninterface IconPickerTriggerProps\n    extends VariantProps<typeof inputVariants>,\n        VariantProps<typeof iconPickerTriggerVariants> {\n    icon: Icon | null;\n    disabled?: boolean;\n}\n\nconst IconPickerTrigger = (props: IconPickerTriggerProps) => {\n    return (\n        <div\n            data-disabled={props.disabled}\n            className={cn(\n                inputVariants({\n                    size: props.size,\n                    variant: props.variant,\n                    invalid: props.invalid\n                }),\n                iconPickerTriggerVariants({ size: props.size, disabled: props.disabled })\n            )}\n        >\n            <div className={\"wby-flex wby-items-center wby-gap-xs\"}>\n                <div>\n                    {props.icon ? (\n                        <IconProvider icon={props.icon} size={24}>\n                            <IconComponent icon={<IconRenderer />} label={props.icon.name} />\n                        </IconProvider>\n                    ) : (\n                        <IconComponent icon={<EmptyIcon />} label={\"Search icons\"} size={\"lg\"} />\n                    )}\n                </div>\n                <div>\n                    <IconComponent size={\"sm\"} icon={<ChevronDown />} label={\"Open list\"} />\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport { IconPickerTrigger, type IconPickerTriggerProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,cAAc,IAAIC,SAAS,QAAQ,0BAA0B;AACtE,SAASD,cAAc,IAAIE,WAAW,QAAQ,uCAAuC;AACrF,SAASC,EAAE,EAAEC,GAAG,EAAEC,IAAI,IAAIC,aAAa,EAAEC,aAAa,QAA2B,kBAAkB;AACnG,SAASC,YAAY,EAAEC,YAAY;AAGnC,MAAMC,yBAAyB,GAAGN,GAAG,CAAC,yCAAyC,EAAE;EAC7EO,QAAQ,EAAE;IACNC,IAAI,EAAE;MACFC,EAAE,EAAE,cAAc;MAClBC,EAAE,EAAE,cAAc;MAClBC,EAAE,EAAE;IACR,CAAC;IACDC,QAAQ,EAAE;MACNC,IAAI,EAAE;IACV;EACJ,CAAC;EACDC,eAAe,EAAE;IACbN,IAAI,EAAE;EACV;AACJ,CAAC,CAAC;AASF,MAAMO,iBAAiB,GAAIC,KAA6B,IAAK;EACzD,oBACIrB,KAAA,CAAAsB,aAAA;IACI,iBAAeD,KAAK,CAACJ,QAAS;IAC9BM,SAAS,EAAEnB,EAAE,CACTI,aAAa,CAAC;MACVK,IAAI,EAAEQ,KAAK,CAACR,IAAI;MAChBW,OAAO,EAAEH,KAAK,CAACG,OAAO;MACtBC,OAAO,EAAEJ,KAAK,CAACI;IACnB,CAAC,CAAC,EACFd,yBAAyB,CAAC;MAAEE,IAAI,EAAEQ,KAAK,CAACR,IAAI;MAAEI,QAAQ,EAAEI,KAAK,CAACJ;IAAS,CAAC,CAC5E;EAAE,gBAEFjB,KAAA,CAAAsB,aAAA;IAAKC,SAAS,EAAE;EAAuC,gBACnDvB,KAAA,CAAAsB,aAAA,cACKD,KAAK,CAACK,IAAI,gBACP1B,KAAA,CAAAsB,aAAA,CAACb,YAAY;IAACiB,IAAI,EAAEL,KAAK,CAACK,IAAK;IAACb,IAAI,EAAE;EAAG,gBACrCb,KAAA,CAAAsB,aAAA,CAACf,aAAa;IAACmB,IAAI,eAAE1B,KAAA,CAAAsB,aAAA,CAACZ,YAAY,MAAE,CAAE;IAACiB,KAAK,EAAEN,KAAK,CAACK,IAAI,CAACE;EAAK,CAAE,CACtD,CAAC,gBAEf5B,KAAA,CAAAsB,aAAA,CAACf,aAAa;IAACmB,IAAI,eAAE1B,KAAA,CAAAsB,aAAA,CAACpB,SAAS,MAAE,CAAE;IAACyB,KAAK,EAAE,cAAe;IAACd,IAAI,EAAE;EAAK,CAAE,CAE3E,CAAC,eACNb,KAAA,CAAAsB,aAAA,2BACItB,KAAA,CAAAsB,aAAA,CAACf,aAAa;IAACM,IAAI,EAAE,IAAK;IAACa,IAAI,eAAE1B,KAAA,CAAAsB,aAAA,CAACnB,WAAW,MAAE,CAAE;IAACwB,KAAK,EAAE;EAAY,CAAE,CACtE,CACJ,CACJ,CAAC;AAEd,CAAC;AAED,SAASP,iBAAiB","ignoreList":[]}
+{"version":3,"file":"components/IconPicker/components/IconPickerTrigger.js","sources":["../../../../src/components/IconPicker/components/IconPickerTrigger.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as EmptyIcon } from \"@webiny/icons/remove.svg\";\nimport { ReactComponent as ChevronDown } from \"@webiny/icons/keyboard_arrow_down.svg\";\nimport { cn, cva, Icon as IconComponent, inputVariants, type VariantProps } from \"@webiny/admin-ui\";\nimport { IconProvider, IconRenderer } from \"~/components/IconPicker/IconRenderer.js\";\nimport type { Icon } from \"~/components/IconPicker/types.js\";\n\nconst iconPickerTriggerVariants = cva(\"cursor-pointer fill-neutral-xstrong\", {\n    variants: {\n        size: {\n            md: \"w-3xl\",\n            lg: \"w-3xl\",\n            xl: \"w-[76px]\"\n        },\n        disabled: {\n            true: \"pointer-events-none\"\n        }\n    },\n    defaultVariants: {\n        size: \"md\"\n    }\n});\n\ninterface IconPickerTriggerProps\n    extends VariantProps<typeof inputVariants>, VariantProps<typeof iconPickerTriggerVariants> {\n    icon: Icon | null;\n    disabled?: boolean;\n}\n\nconst IconPickerTrigger = (props: IconPickerTriggerProps) => {\n    return (\n        <div\n            data-disabled={props.disabled}\n            className={cn(\n                inputVariants({\n                    size: props.size,\n                    variant: props.variant,\n                    invalid: props.invalid\n                }),\n                iconPickerTriggerVariants({ size: props.size, disabled: props.disabled })\n            )}\n        >\n            <div className={\"flex items-center gap-xs\"}>\n                <div>\n                    {props.icon ? (\n                        <IconProvider icon={props.icon} size={24}>\n                            <IconComponent icon={<IconRenderer />} label={props.icon.name} />\n                        </IconProvider>\n                    ) : (\n                        <IconComponent icon={<EmptyIcon />} label={\"Search icons\"} size={\"lg\"} />\n                    )}\n                </div>\n                <div>\n                    <IconComponent size={\"sm\"} icon={<ChevronDown />} label={\"Open list\"} />\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport { IconPickerTrigger, type IconPickerTriggerProps };\n"],"names":["iconPickerTriggerVariants","cva","IconPickerTrigger","props","cn","inputVariants","IconProvider","IconComponent","IconRenderer","EmptyIcon","ChevronDown"],"mappings":";;;;;AAOA,MAAMA,4BAA4BC,IAAI,uCAAuC;IACzE,UAAU;QACN,MAAM;YACF,IAAI;YACJ,IAAI;YACJ,IAAI;QACR;QACA,UAAU;YACN,MAAM;QACV;IACJ;IACA,iBAAiB;QACb,MAAM;IACV;AACJ;AAQA,MAAMC,oBAAoB,CAACC,QAChB,WAAP,GACI,oBAAC;QACG,iBAAeA,MAAM,QAAQ;QAC7B,WAAWC,GACPC,cAAc;YACV,MAAMF,MAAM,IAAI;YAChB,SAASA,MAAM,OAAO;YACtB,SAASA,MAAM,OAAO;QAC1B,IACAH,0BAA0B;YAAE,MAAMG,MAAM,IAAI;YAAE,UAAUA,MAAM,QAAQ;QAAC;qBAG3E,oBAAC;QAAI,WAAW;qBACZ,oBAAC,aACIA,MAAM,IAAI,GAAG,WAAH,GACP,oBAACG,cAAYA;QAAC,MAAMH,MAAM,IAAI;QAAE,MAAM;qBAClC,oBAACI,MAAaA;QAAC,oBAAM,oBAACC,cAAYA;QAAK,OAAOL,MAAM,IAAI,CAAC,IAAI;wBAGjE,oBAACI,MAAaA;QAAC,oBAAM,oBAACE,gBAASA;QAAK,OAAO;QAAgB,MAAM;uBAGzE,oBAAC,2BACG,oBAACF,MAAaA;QAAC,MAAM;QAAM,oBAAM,oBAACG,wCAAWA;QAAK,OAAO"}

package/components/IconPicker/components/index.d.ts

@@ -1,4 +1,4 @@
-export * from "./IconPickerCell";
-export * from "./IconPickerContent";
-export * from "./IconPickerRow";
-export * from "./IconPickerTrigger";
+export * from "./IconPickerCell.js";
+export * from "./IconPickerContent.js";
+export * from "./IconPickerRow.js";
+export * from "./IconPickerTrigger.js";

package/components/IconPicker/components/index.js

@@ -1,6 +1,4 @@
-export * from "./IconPickerCell";
-export * from "./IconPickerContent";
-export * from "./IconPickerRow";
-export * from "./IconPickerTrigger";
-
-//# sourceMappingURL=index.js.map
+export * from "./IconPickerCell.js";
+export * from "./IconPickerContent.js";
+export * from "./IconPickerRow.js";
+export * from "./IconPickerTrigger.js";

package/components/IconPicker/config/Emojis.js

@@ -1,24 +1,22 @@
-import React from "react";
-import { IconPickerConfig } from ".";
-export const Emojis = () => {
-  return /*#__PURE__*/React.createElement(IconPickerConfig, null, /*#__PURE__*/React.createElement(IconPickerConfig.IconPack, {
-    name: "default_emojis",
-    provider: async () => {
-      const emojisJson = await import(/* webpackChunkName: "iconpicker-emojis" */
-      "unicode-emoji-json/data-by-emoji.json");
-      const emojis = emojisJson.default;
-      return Object.keys(emojis).map(key => {
-        const emoji = emojis[key];
-        return {
-          type: "emoji",
-          name: emoji.slug,
-          value: key,
-          category: emoji.group,
-          skinToneSupport: emoji.skin_tone_support
-        };
-      });
-    }
-  }));
-};
+import react from "react";
+import { IconPickerConfig } from "./index.js";
+const Emojis = ()=>/*#__PURE__*/ react.createElement(IconPickerConfig, null, /*#__PURE__*/ react.createElement(IconPickerConfig.IconPack, {
+        name: "default_emojis",
+        provider: async ()=>{
+            const emojisJson = await import("unicode-emoji-json/data-by-emoji.json");
+            const emojis = emojisJson.default;
+            return Object.keys(emojis).map((key)=>{
+                const emoji = emojis[key];
+                return {
+                    type: "emoji",
+                    name: emoji.slug,
+                    value: key,
+                    category: emoji.group,
+                    skinToneSupport: emoji.skin_tone_support
+                };
+            });
+        }
+    }));
+export { Emojis };
 
 //# sourceMappingURL=Emojis.js.map

package/components/IconPicker/config/Emojis.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","IconPickerConfig","Emojis","createElement","IconPack","name","provider","emojisJson","emojis","default","Object","keys","map","key","emoji","type","slug","value","category","group","skinToneSupport","skin_tone_support"],"sources":["Emojis.tsx"],"sourcesContent":["import React from \"react\";\nimport { IconPickerConfig } from \".\";\n\ntype EmojiSet = {\n    [key: string]: {\n        name: string;\n        slug: string;\n        group: string;\n        emoji_version: string;\n        unicode_version: string;\n        skin_tone_support: boolean;\n    };\n};\n\nexport const Emojis = () => {\n    return (\n        <IconPickerConfig>\n            <IconPickerConfig.IconPack\n                name=\"default_emojis\"\n                provider={async () => {\n                    const emojisJson = await import(\n                        /* webpackChunkName: \"iconpicker-emojis\" */\n                        \"unicode-emoji-json/data-by-emoji.json\"\n                    );\n\n                    const emojis: EmojiSet = emojisJson.default;\n\n                    return Object.keys(emojis).map(key => {\n                        const emoji = emojis[key];\n                        return {\n                            type: \"emoji\",\n                            name: emoji.slug,\n                            value: key,\n                            category: emoji.group,\n                            skinToneSupport: emoji.skin_tone_support\n                        };\n                    });\n                }}\n            />\n        </IconPickerConfig>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,gBAAgB,QAAQ,GAAG;AAapC,OAAO,MAAMC,MAAM,GAAGA,CAAA,KAAM;EACxB,oBACIF,KAAA,CAAAG,aAAA,CAACF,gBAAgB,qBACbD,KAAA,CAAAG,aAAA,CAACF,gBAAgB,CAACG,QAAQ;IACtBC,IAAI,EAAC,gBAAgB;IACrBC,QAAQ,EAAE,MAAAA,CAAA,KAAY;MAClB,MAAMC,UAAU,GAAG,MAAM,MAAM,CAC3B;MACA,uCACJ,CAAC;MAED,MAAMC,MAAgB,GAAGD,UAAU,CAACE,OAAO;MAE3C,OAAOC,MAAM,CAACC,IAAI,CAACH,MAAM,CAAC,CAACI,GAAG,CAACC,GAAG,IAAI;QAClC,MAAMC,KAAK,GAAGN,MAAM,CAACK,GAAG,CAAC;QACzB,OAAO;UACHE,IAAI,EAAE,OAAO;UACbV,IAAI,EAAES,KAAK,CAACE,IAAI;UAChBC,KAAK,EAAEJ,GAAG;UACVK,QAAQ,EAAEJ,KAAK,CAACK,KAAK;UACrBC,eAAe,EAAEN,KAAK,CAACO;QAC3B,CAAC;MACL,CAAC,CAAC;IACN;EAAE,CACL,CACa,CAAC;AAE3B,CAAC","ignoreList":[]}
+{"version":3,"file":"components/IconPicker/config/Emojis.js","sources":["../../../../src/components/IconPicker/config/Emojis.tsx"],"sourcesContent":["import React from \"react\";\nimport { IconPickerConfig } from \"./index.js\";\n\ntype EmojiSet = {\n    [key: string]: {\n        name: string;\n        slug: string;\n        group: string;\n        emoji_version: string;\n        unicode_version: string;\n        skin_tone_support: boolean;\n    };\n};\n\nexport const Emojis = () => {\n    return (\n        <IconPickerConfig>\n            <IconPickerConfig.IconPack\n                name=\"default_emojis\"\n                provider={async () => {\n                    const emojisJson = await import(\n                        /* webpackChunkName: \"iconpicker-emojis\" */\n                        \"unicode-emoji-json/data-by-emoji.json\"\n                    );\n\n                    const emojis: EmojiSet = emojisJson.default;\n\n                    return Object.keys(emojis).map(key => {\n                        const emoji = emojis[key];\n                        return {\n                            type: \"emoji\",\n                            name: emoji.slug,\n                            value: key,\n                            category: emoji.group,\n                            skinToneSupport: emoji.skin_tone_support\n                        };\n                    });\n                }}\n            />\n        </IconPickerConfig>\n    );\n};\n"],"names":["Emojis","IconPickerConfig","emojisJson","emojis","Object","key","emoji"],"mappings":";;AAcO,MAAMA,SAAS,IACX,WAAP,GACI,oBAACC,kBAAgBA,MAAAA,WAAAA,GACb,oBAACA,iBAAiB,QAAQ;QACtB,MAAK;QACL,UAAU;YACN,MAAMC,aAAa,MAAM,MAAM,CAAN;YAKzB,MAAMC,SAAmBD,WAAW,OAAO;YAE3C,OAAOE,OAAO,IAAI,CAACD,QAAQ,GAAG,CAACE,CAAAA;gBAC3B,MAAMC,QAAQH,MAAM,CAACE,IAAI;gBACzB,OAAO;oBACH,MAAM;oBACN,MAAMC,MAAM,IAAI;oBAChB,OAAOD;oBACP,UAAUC,MAAM,KAAK;oBACrB,iBAAiBA,MAAM,iBAAiB;gBAC5C;YACJ;QACJ"}

package/components/IconPicker/config/FontAwesomeIcons.js

@@ -1,61 +1,57 @@
-import React from "react";
-import { IconPickerConfig } from ".";
-export const FontAwesomeIcons = () => {
-  return /*#__PURE__*/React.createElement(IconPickerConfig, null, /*#__PURE__*/React.createElement(IconPickerConfig.IconPack, {
-    name: "fa6_brands",
-    provider: async () => {
-      const fa6Brands = await import(/* webpackChunkName: "iconpicker-fa6-brands" */
-      "@iconify/json/json/fa6-brands.json");
-      const icons = fa6Brands.icons;
-      const categories = fa6Brands.categories;
-      return Object.keys(icons).map(key => {
-        const icon = icons[key];
-        return {
-          type: "icon",
-          name: `fa6_brands_${key}`,
-          value: icon.body,
-          category: Object.keys(categories).find(categoryKey => categories[categoryKey].includes(key)),
-          width: icon.width
-        };
-      });
-    }
-  }), /*#__PURE__*/React.createElement(IconPickerConfig.IconPack, {
-    name: "fa6_regular",
-    provider: async () => {
-      const fa6Regular = await import(/* webpackChunkName: "iconpicker-fa6-regular" */
-      "@iconify/json/json/fa6-regular.json");
-      const icons = fa6Regular.icons;
-      const categories = fa6Regular.categories;
-      return Object.keys(icons).map(key => {
-        const icon = icons[key];
-        return {
-          type: "icon",
-          name: `fa6_regular_${key}`,
-          value: icon.body,
-          category: Object.keys(categories).find(categoryKey => categories[categoryKey].includes(key)),
-          width: icon.width
-        };
-      });
-    }
-  }), /*#__PURE__*/React.createElement(IconPickerConfig.IconPack, {
-    name: "fa6_solid",
-    provider: async () => {
-      const fa6Solid = await import(/* webpackChunkName: "iconpicker-fa6-solid" */
-      "@iconify/json/json/fa6-solid.json");
-      const icons = fa6Solid.icons;
-      const categories = fa6Solid.categories;
-      return Object.keys(icons).map(key => {
-        const icon = icons[key];
-        return {
-          type: "icon",
-          name: `fa6_solid_${key}`,
-          value: icon.body,
-          category: Object.keys(categories).find(categoryKey => categories[categoryKey].includes(key)),
-          width: icon.width
-        };
-      });
-    }
-  }));
-};
+import react from "react";
+import { IconPickerConfig } from "./index.js";
+const FontAwesomeIcons = ()=>/*#__PURE__*/ react.createElement(IconPickerConfig, null, /*#__PURE__*/ react.createElement(IconPickerConfig.IconPack, {
+        name: "fa6_brands",
+        provider: async ()=>{
+            const fa6Brands = await import("@iconify/json/json/fa6-brands.json");
+            const icons = fa6Brands.icons;
+            const categories = fa6Brands.categories;
+            return Object.keys(icons).map((key)=>{
+                const icon = icons[key];
+                return {
+                    type: "icon",
+                    name: `fa6_brands_${key}`,
+                    value: icon.body,
+                    category: Object.keys(categories).find((categoryKey)=>categories[categoryKey].includes(key)),
+                    width: icon.width
+                };
+            });
+        }
+    }), /*#__PURE__*/ react.createElement(IconPickerConfig.IconPack, {
+        name: "fa6_regular",
+        provider: async ()=>{
+            const fa6Regular = await import("@iconify/json/json/fa6-regular.json");
+            const icons = fa6Regular.icons;
+            const categories = fa6Regular.categories;
+            return Object.keys(icons).map((key)=>{
+                const icon = icons[key];
+                return {
+                    type: "icon",
+                    name: `fa6_regular_${key}`,
+                    value: icon.body,
+                    category: Object.keys(categories).find((categoryKey)=>categories[categoryKey].includes(key)),
+                    width: icon.width
+                };
+            });
+        }
+    }), /*#__PURE__*/ react.createElement(IconPickerConfig.IconPack, {
+        name: "fa6_solid",
+        provider: async ()=>{
+            const fa6Solid = await import("@iconify/json/json/fa6-solid.json");
+            const icons = fa6Solid.icons;
+            const categories = fa6Solid.categories;
+            return Object.keys(icons).map((key)=>{
+                const icon = icons[key];
+                return {
+                    type: "icon",
+                    name: `fa6_solid_${key}`,
+                    value: icon.body,
+                    category: Object.keys(categories).find((categoryKey)=>categories[categoryKey].includes(key)),
+                    width: icon.width
+                };
+            });
+        }
+    }));
+export { FontAwesomeIcons };
 
 //# sourceMappingURL=FontAwesomeIcons.js.map

package/components/IconPicker/config/FontAwesomeIcons.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","IconPickerConfig","FontAwesomeIcons","createElement","IconPack","name","provider","fa6Brands","icons","categories","Object","keys","map","key","icon","type","value","body","category","find","categoryKey","includes","width","fa6Regular","fa6Solid"],"sources":["FontAwesomeIcons.tsx"],"sourcesContent":["import React from \"react\";\nimport { IconPickerConfig } from \".\";\n\ntype FaIconSet = {\n    [key: string]: {\n        body: string;\n        width?: number;\n    };\n};\n\ntype FaCategorySet = {\n    [key: string]: string[];\n};\n\nexport const FontAwesomeIcons = () => {\n    return (\n        <IconPickerConfig>\n            {/* Default Icons Providers */}\n            <IconPickerConfig.IconPack\n                name=\"fa6_brands\"\n                provider={async () => {\n                    const fa6Brands = await import(\n                        /* webpackChunkName: \"iconpicker-fa6-brands\" */\n                        \"@iconify/json/json/fa6-brands.json\"\n                    );\n\n                    const icons: FaIconSet = fa6Brands.icons;\n                    const categories: FaCategorySet = fa6Brands.categories;\n\n                    return Object.keys(icons).map(key => {\n                        const icon = icons[key];\n                        return {\n                            type: \"icon\",\n                            name: `fa6_brands_${key}`,\n                            value: icon.body,\n                            category: Object.keys(categories).find(categoryKey =>\n                                categories[categoryKey].includes(key)\n                            ),\n                            width: icon.width\n                        };\n                    });\n                }}\n            />\n            <IconPickerConfig.IconPack\n                name=\"fa6_regular\"\n                provider={async () => {\n                    const fa6Regular = await import(\n                        /* webpackChunkName: \"iconpicker-fa6-regular\" */\n                        \"@iconify/json/json/fa6-regular.json\"\n                    );\n\n                    const icons: FaIconSet = fa6Regular.icons;\n                    const categories: FaCategorySet = fa6Regular.categories;\n\n                    return Object.keys(icons).map(key => {\n                        const icon = icons[key];\n                        return {\n                            type: \"icon\",\n                            name: `fa6_regular_${key}`,\n                            value: icon.body,\n                            category: Object.keys(categories).find(categoryKey =>\n                                categories[categoryKey].includes(key)\n                            ),\n                            width: icon.width\n                        };\n                    });\n                }}\n            />\n            <IconPickerConfig.IconPack\n                name=\"fa6_solid\"\n                provider={async () => {\n                    const fa6Solid = await import(\n                        /* webpackChunkName: \"iconpicker-fa6-solid\" */\n                        \"@iconify/json/json/fa6-solid.json\"\n                    );\n\n                    const icons: FaIconSet = fa6Solid.icons;\n                    const categories: FaCategorySet = fa6Solid.categories;\n\n                    return Object.keys(icons).map(key => {\n                        const icon = icons[key];\n                        return {\n                            type: \"icon\",\n                            name: `fa6_solid_${key}`,\n                            value: icon.body,\n                            category: Object.keys(categories).find(categoryKey =>\n                                categories[categoryKey].includes(key)\n                            ),\n                            width: icon.width\n                        };\n                    });\n                }}\n            />\n        </IconPickerConfig>\n    );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"components/IconPicker/config/FontAwesomeIcons.js","sources":["../../../../src/components/IconPicker/config/FontAwesomeIcons.tsx"],"sourcesContent":["import React from \"react\";\nimport { IconPickerConfig } from \"./index.js\";\n\ntype FaIconSet = {\n    [key: string]: {\n        body: string;\n        width?: number;\n    };\n};\n\ntype FaCategorySet = {\n    [key: string]: string[];\n};\n\nexport const FontAwesomeIcons = () => {\n    return (\n        <IconPickerConfig>\n            {/* Default Icons Providers */}\n            <IconPickerConfig.IconPack\n                name=\"fa6_brands\"\n                provider={async () => {\n                    const fa6Brands = await import(\n                        /* webpackChunkName: \"iconpicker-fa6-brands\" */\n                        \"@iconify/json/json/fa6-brands.json\"\n                    );\n\n                    const icons: FaIconSet = fa6Brands.icons;\n                    const categories: FaCategorySet = fa6Brands.categories;\n\n                    return Object.keys(icons).map(key => {\n                        const icon = icons[key];\n                        return {\n                            type: \"icon\",\n                            name: `fa6_brands_${key}`,\n                            value: icon.body,\n                            category: Object.keys(categories).find(categoryKey =>\n                                categories[categoryKey].includes(key)\n                            ),\n                            width: icon.width\n                        };\n                    });\n                }}\n            />\n            <IconPickerConfig.IconPack\n                name=\"fa6_regular\"\n                provider={async () => {\n                    const fa6Regular = await import(\n                        /* webpackChunkName: \"iconpicker-fa6-regular\" */\n                        \"@iconify/json/json/fa6-regular.json\"\n                    );\n\n                    const icons: FaIconSet = fa6Regular.icons;\n                    const categories: FaCategorySet = fa6Regular.categories;\n\n                    return Object.keys(icons).map(key => {\n                        const icon = icons[key];\n                        return {\n                            type: \"icon\",\n                            name: `fa6_regular_${key}`,\n                            value: icon.body,\n                            category: Object.keys(categories).find(categoryKey =>\n                                categories[categoryKey].includes(key)\n                            ),\n                            width: icon.width\n                        };\n                    });\n                }}\n            />\n            <IconPickerConfig.IconPack\n                name=\"fa6_solid\"\n                provider={async () => {\n                    const fa6Solid = await import(\n                        /* webpackChunkName: \"iconpicker-fa6-solid\" */\n                        \"@iconify/json/json/fa6-solid.json\"\n                    );\n\n                    const icons: FaIconSet = fa6Solid.icons;\n                    const categories: FaCategorySet = fa6Solid.categories;\n\n                    return Object.keys(icons).map(key => {\n                        const icon = icons[key];\n                        return {\n                            type: \"icon\",\n                            name: `fa6_solid_${key}`,\n                            value: icon.body,\n                            category: Object.keys(categories).find(categoryKey =>\n                                categories[categoryKey].includes(key)\n                            ),\n                            width: icon.width\n                        };\n                    });\n                }}\n            />\n        </IconPickerConfig>\n    );\n};\n"],"names":["FontAwesomeIcons","IconPickerConfig","fa6Brands","icons","categories","Object","key","icon","categoryKey","fa6Regular","fa6Solid"],"mappings":";;AAcO,MAAMA,mBAAmB,IACrB,WAAP,GACI,oBAACC,kBAAgBA,MAAAA,WAAAA,GAEb,oBAACA,iBAAiB,QAAQ;QACtB,MAAK;QACL,UAAU;YACN,MAAMC,YAAY,MAAM,MAAM,CAAN;YAKxB,MAAMC,QAAmBD,UAAU,KAAK;YACxC,MAAME,aAA4BF,UAAU,UAAU;YAEtD,OAAOG,OAAO,IAAI,CAACF,OAAO,GAAG,CAACG,CAAAA;gBAC1B,MAAMC,OAAOJ,KAAK,CAACG,IAAI;gBACvB,OAAO;oBACH,MAAM;oBACN,MAAM,CAAC,WAAW,EAAEA,KAAK;oBACzB,OAAOC,KAAK,IAAI;oBAChB,UAAUF,OAAO,IAAI,CAACD,YAAY,IAAI,CAACI,CAAAA,cACnCJ,UAAU,CAACI,YAAY,CAAC,QAAQ,CAACF;oBAErC,OAAOC,KAAK,KAAK;gBACrB;YACJ;QACJ;sBAEJ,oBAACN,iBAAiB,QAAQ;QACtB,MAAK;QACL,UAAU;YACN,MAAMQ,aAAa,MAAM,MAAM,CAAN;YAKzB,MAAMN,QAAmBM,WAAW,KAAK;YACzC,MAAML,aAA4BK,WAAW,UAAU;YAEvD,OAAOJ,OAAO,IAAI,CAACF,OAAO,GAAG,CAACG,CAAAA;gBAC1B,MAAMC,OAAOJ,KAAK,CAACG,IAAI;gBACvB,OAAO;oBACH,MAAM;oBACN,MAAM,CAAC,YAAY,EAAEA,KAAK;oBAC1B,OAAOC,KAAK,IAAI;oBAChB,UAAUF,OAAO,IAAI,CAACD,YAAY,IAAI,CAACI,CAAAA,cACnCJ,UAAU,CAACI,YAAY,CAAC,QAAQ,CAACF;oBAErC,OAAOC,KAAK,KAAK;gBACrB;YACJ;QACJ;sBAEJ,oBAACN,iBAAiB,QAAQ;QACtB,MAAK;QACL,UAAU;YACN,MAAMS,WAAW,MAAM,MAAM,CAAN;YAKvB,MAAMP,QAAmBO,SAAS,KAAK;YACvC,MAAMN,aAA4BM,SAAS,UAAU;YAErD,OAAOL,OAAO,IAAI,CAACF,OAAO,GAAG,CAACG,CAAAA;gBAC1B,MAAMC,OAAOJ,KAAK,CAACG,IAAI;gBACvB,OAAO;oBACH,MAAM;oBACN,MAAM,CAAC,UAAU,EAAEA,KAAK;oBACxB,OAAOC,KAAK,IAAI;oBAChB,UAAUF,OAAO,IAAI,CAACD,YAAY,IAAI,CAACI,CAAAA,cACnCJ,UAAU,CAACI,YAAY,CAAC,QAAQ,CAACF;oBAErC,OAAOC,KAAK,KAAK;gBACrB;YACJ;QACJ"}

package/components/IconPicker/config/IconPackProvider.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import type { Icon } from "../types";
+import type { Icon } from "../../../components/IconPicker/types.js";
 export type IconPackProviderProps = {
     name: string;
     provider: () => Promise<Icon[]> | Icon[];

package/components/IconPicker/config/IconPackProvider.js

@@ -1,23 +1,21 @@
-import React from "react";
+import react from "react";
 import { Property, useIdGenerator } from "@webiny/react-properties";
-export const IconPackProvider = ({
-  name,
-  provider
-}) => {
-  const getId = useIdGenerator("iconPackProvider");
-  return /*#__PURE__*/React.createElement(Property, {
-    id: getId(name),
-    name: "iconPackProviders",
-    array: true
-  }, /*#__PURE__*/React.createElement(Property, {
-    id: getId(name, "name"),
-    name: "name",
-    value: name
-  }), /*#__PURE__*/React.createElement(Property, {
-    id: getId(name, "load"),
-    name: "load",
-    value: provider
-  }));
+const IconPackProvider = ({ name, provider })=>{
+    const getId = useIdGenerator("iconPackProvider");
+    return /*#__PURE__*/ react.createElement(Property, {
+        id: getId(name),
+        name: "iconPackProviders",
+        array: true
+    }, /*#__PURE__*/ react.createElement(Property, {
+        id: getId(name, "name"),
+        name: "name",
+        value: name
+    }), /*#__PURE__*/ react.createElement(Property, {
+        id: getId(name, "load"),
+        name: "load",
+        value: provider
+    }));
 };
+export { IconPackProvider };
 
 //# sourceMappingURL=IconPackProvider.js.map

package/components/IconPicker/config/IconPackProvider.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Property","useIdGenerator","IconPackProvider","name","provider","getId","createElement","id","array","value"],"sources":["IconPackProvider.tsx"],"sourcesContent":["import React from \"react\";\nimport { Property, useIdGenerator } from \"@webiny/react-properties\";\nimport type { Icon } from \"~/components/IconPicker/types\";\n\nexport type IconPackProviderProps = {\n    name: string;\n    provider: () => Promise<Icon[]> | Icon[];\n};\n\nexport const IconPackProvider = ({ name, provider }: IconPackProviderProps) => {\n    const getId = useIdGenerator(\"iconPackProvider\");\n\n    return (\n        <Property id={getId(name)} name={\"iconPackProviders\"} array={true}>\n            <Property id={getId(name, \"name\")} name={\"name\"} value={name} />\n            <Property id={getId(name, \"load\")} name={\"load\"} value={provider} />\n        </Property>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,EAAEC,cAAc,QAAQ,0BAA0B;AAQnE,OAAO,MAAMC,gBAAgB,GAAGA,CAAC;EAAEC,IAAI;EAAEC;AAAgC,CAAC,KAAK;EAC3E,MAAMC,KAAK,GAAGJ,cAAc,CAAC,kBAAkB,CAAC;EAEhD,oBACIF,KAAA,CAAAO,aAAA,CAACN,QAAQ;IAACO,EAAE,EAAEF,KAAK,CAACF,IAAI,CAAE;IAACA,IAAI,EAAE,mBAAoB;IAACK,KAAK,EAAE;EAAK,gBAC9DT,KAAA,CAAAO,aAAA,CAACN,QAAQ;IAACO,EAAE,EAAEF,KAAK,CAACF,IAAI,EAAE,MAAM,CAAE;IAACA,IAAI,EAAE,MAAO;IAACM,KAAK,EAAEN;EAAK,CAAE,CAAC,eAChEJ,KAAA,CAAAO,aAAA,CAACN,QAAQ;IAACO,EAAE,EAAEF,KAAK,CAACF,IAAI,EAAE,MAAM,CAAE;IAACA,IAAI,EAAE,MAAO;IAACM,KAAK,EAAEL;EAAS,CAAE,CAC7D,CAAC;AAEnB,CAAC","ignoreList":[]}
+{"version":3,"file":"components/IconPicker/config/IconPackProvider.js","sources":["../../../../src/components/IconPicker/config/IconPackProvider.tsx"],"sourcesContent":["import React from \"react\";\nimport { Property, useIdGenerator } from \"@webiny/react-properties\";\nimport type { Icon } from \"~/components/IconPicker/types.js\";\n\nexport type IconPackProviderProps = {\n    name: string;\n    provider: () => Promise<Icon[]> | Icon[];\n};\n\nexport const IconPackProvider = ({ name, provider }: IconPackProviderProps) => {\n    const getId = useIdGenerator(\"iconPackProvider\");\n\n    return (\n        <Property id={getId(name)} name={\"iconPackProviders\"} array={true}>\n            <Property id={getId(name, \"name\")} name={\"name\"} value={name} />\n            <Property id={getId(name, \"load\")} name={\"load\"} value={provider} />\n        </Property>\n    );\n};\n"],"names":["IconPackProvider","name","provider","getId","useIdGenerator","Property"],"mappings":";;AASO,MAAMA,mBAAmB,CAAC,EAAEC,IAAI,EAAEC,QAAQ,EAAyB;IACtE,MAAMC,QAAQC,eAAe;IAE7B,OAAO,WAAP,GACI,oBAACC,UAAQA;QAAC,IAAIF,MAAMF;QAAO,MAAM;QAAqB,OAAO;qBACzD,oBAACI,UAAQA;QAAC,IAAIF,MAAMF,MAAM;QAAS,MAAM;QAAQ,OAAOA;sBACxD,oBAACI,UAAQA;QAAC,IAAIF,MAAMF,MAAM;QAAS,MAAM;QAAQ,OAAOC;;AAGpE"}

package/components/IconPicker/config/IconType.js

@@ -1,89 +1,57 @@
-import React from "react";
+import react from "react";
 import { Property, useIdGenerator } from "@webiny/react-properties";
-import { IconRenderer, useIcon } from "../IconRenderer";
-import { IconPickerTabRenderer } from "../IconPickerTab";
-const IconTypeContext = /*#__PURE__*/React.createContext(undefined);
-export const IconTypeProvider = ({
-  type,
-  children
-}) => {
-  return /*#__PURE__*/React.createElement(IconTypeContext.Provider, {
-    value: {
-      type
-    }
-  }, children);
-};
-export function useIconType() {
-  const context = React.useContext(IconTypeContext);
-  if (!context) {
-    throw Error(`Missing <IconTypeProvider> in the component tree!`);
-  }
-  return context;
+import { IconRenderer as external_IconRenderer_js_IconRenderer, useIcon } from "../IconRenderer.js";
+import { IconPickerTabRenderer as external_IconPickerTab_js_IconPickerTabRenderer } from "../IconPickerTab.js";
+const IconTypeContext = /*#__PURE__*/ react.createContext(void 0);
+const IconTypeProvider = ({ type, children })=>/*#__PURE__*/ react.createElement(IconTypeContext.Provider, {
+        value: {
+            type
+        }
+    }, children);
+function useIconType() {
+    const context = react.useContext(IconTypeContext);
+    if (!context) throw Error("Missing <IconTypeProvider> in the component tree!");
+    return context;
 }
-export const IconType = ({
-  name,
-  before = undefined,
-  after = undefined,
-  remove = false,
-  children
-}) => {
-  const getId = useIdGenerator("iconType");
-  const placeBefore = before !== undefined ? getId(before) : undefined;
-  const placeAfter = after !== undefined ? getId(after) : undefined;
-  return /*#__PURE__*/React.createElement(IconTypeProvider, {
-    type: name
-  }, /*#__PURE__*/React.createElement(Property, {
-    id: getId(name),
-    name: "iconTypes",
-    before: placeBefore,
-    after: placeAfter,
-    remove: remove,
-    array: true
-  }, /*#__PURE__*/React.createElement(Property, {
-    id: getId(name, "name"),
-    name: "name",
-    value: name
-  }), children));
+const IconType = ({ name, before, after, remove = false, children })=>{
+    const getId = useIdGenerator("iconType");
+    const placeBefore = void 0 !== before ? getId(before) : void 0;
+    const placeAfter = void 0 !== after ? getId(after) : void 0;
+    return /*#__PURE__*/ react.createElement(IconTypeProvider, {
+        type: name
+    }, /*#__PURE__*/ react.createElement(Property, {
+        id: getId(name),
+        name: "iconTypes",
+        before: placeBefore,
+        after: placeAfter,
+        remove: remove,
+        array: true
+    }, /*#__PURE__*/ react.createElement(Property, {
+        id: getId(name, "name"),
+        name: "name",
+        value: name
+    }), children));
 };
-export const Icon = ({
-  element
-}) => {
-  const {
-    type: configType
-  } = useIconType();
-  const IconDecorator = IconRenderer.createDecorator(Original => {
-    return function IconRenderer() {
-      const {
-        icon
-      } = useIcon();
-      if (icon.type !== configType) {
-        return /*#__PURE__*/React.createElement(Original, null);
-      }
-      return element;
-    };
-  });
-  return /*#__PURE__*/React.createElement(IconDecorator, null);
+const Icon = ({ element })=>{
+    const { type: configType } = useIconType();
+    const IconDecorator = external_IconRenderer_js_IconRenderer.createDecorator((Original)=>function() {
+            const { icon } = useIcon();
+            if (icon.type !== configType) return /*#__PURE__*/ react.createElement(Original, null);
+            return element;
+        });
+    return /*#__PURE__*/ react.createElement(IconDecorator, null);
 };
-export const Tab = ({
-  element
-}) => {
-  const {
-    type: configType
-  } = useIconType();
-  const IconPickerTabDecorator = IconPickerTabRenderer.createDecorator(Original => {
-    return function IconPickerTabRenderer() {
-      const {
-        type
-      } = useIconType();
-      if (type !== configType) {
-        return /*#__PURE__*/React.createElement(Original, null);
-      }
-      return /*#__PURE__*/React.createElement(React.Fragment, null, element);
-    };
-  });
-  return /*#__PURE__*/React.createElement(IconPickerTabDecorator, null);
+const Tab = ({ element })=>{
+    const { type: configType } = useIconType();
+    const IconPickerTabDecorator = external_IconPickerTab_js_IconPickerTabRenderer.createDecorator((Original)=>function() {
+            const { type } = useIconType();
+            if (type !== configType) return /*#__PURE__*/ react.createElement(Original, null);
+            return /*#__PURE__*/ react.createElement(react.Fragment, null, element);
+        });
+    return /*#__PURE__*/ react.createElement(IconPickerTabDecorator, null);
 };
 IconType.Icon = Icon;
 IconType.Tab = Tab;
+export { Icon, IconType, IconTypeProvider, Tab, useIconType };
 
 //# sourceMappingURL=IconType.js.map