@webiny/admin-ui 0.0.0-unstable.e6f0dc8ca7 → 0.0.0-unstable.eb81deee7e

package/IconPicker/primitives/components/IconPickerGrid.js

@@ -1,4 +1,4 @@
-import React, { useCallback } from "react";
+import react, { useCallback } from "react";
 import { Grid } from "react-virtualized";
 import { Text } from "../../../Text/index.js";
 import { cn } from "../../../utils.js";
@@ -9,50 +9,47 @@ const GRID_WIDTH = 424;
 const GRID_HEIGHT = 270;
 const COLUMN_WIDTH = 80;
 const ROW_HEIGHT = 80;
-const IconPickerGrid = props => {
-  const renderCell = useCallback(() => {
-    return function renderCell({
-      columnIndex,
-      key,
-      rowIndex,
-      style
-    }) {
-      const item = props.icons[rowIndex * COLUMN_COUNT + columnIndex];
-      if (!item) {
-        return null;
-      }
-      return /*#__PURE__*/React.createElement("div", {
-        key: key,
-        style: style,
-        className: cn(["flex flex-col justify-center items-center gap-sm", "text-neutral-strong", "hover:bg-neutral-dimmed hover:text-neutral-strong", "px-xs-plus box-border rounded-xs cursor-pointer overflow-hidden", "transition-colors duration-400 ease-out"]),
-        onClick: () => {
-          if (props.onIconSelect) {
-            props.onIconSelect(IconPickerIconFormatter.formatStringValue(item));
-          }
-        }
-      }, /*#__PURE__*/React.createElement(IconPickerIcon, {
-        name: item.name,
-        prefix: item.prefix,
-        className: "size-lg"
-      }), /*#__PURE__*/React.createElement(Text, {
-        as: "div",
-        size: "sm",
-        className: "w-full truncate text-center text-neutral-muted"
-      }, item.name));
-    };
-  }, [props.icons]);
-  return /*#__PURE__*/React.createElement("div", null, props.iconsLength === 0 ? /*#__PURE__*/React.createElement("div", {
-    className: `px-sm-extra py-md text-neutral-strong`
-  }, /*#__PURE__*/React.createElement(Text, null, "No results found.")) : /*#__PURE__*/React.createElement(Grid, {
-    className: "px-sm-extra py-xs-plus outline-none",
-    cellRenderer: renderCell(),
-    columnCount: COLUMN_COUNT,
-    columnWidth: COLUMN_WIDTH,
-    rowHeight: ROW_HEIGHT,
-    width: GRID_WIDTH,
-    height: GRID_HEIGHT,
-    rowCount: Math.ceil(props.iconsLength / COLUMN_COUNT)
-  }));
+const IconPickerGrid = (props)=>{
+    const renderCell = useCallback(()=>function({ columnIndex, key, rowIndex, style }) {
+            const item = props.icons[rowIndex * COLUMN_COUNT + columnIndex];
+            if (!item) return null;
+            return /*#__PURE__*/ react.createElement("div", {
+                key: key,
+                style: style,
+                className: cn([
+                    "flex flex-col justify-center items-center gap-sm",
+                    "text-neutral-strong",
+                    "hover:bg-neutral-dimmed hover:text-neutral-strong",
+                    "px-xs-plus box-border rounded-xs cursor-pointer overflow-hidden",
+                    "transition-colors duration-400 ease-out"
+                ]),
+                onClick: ()=>{
+                    if (props.onIconSelect) props.onIconSelect(IconPickerIconFormatter.formatStringValue(item));
+                }
+            }, /*#__PURE__*/ react.createElement(IconPickerIcon, {
+                name: item.name,
+                prefix: item.prefix,
+                className: "size-lg"
+            }), /*#__PURE__*/ react.createElement(Text, {
+                as: "div",
+                size: "sm",
+                className: "w-full truncate text-center text-neutral-muted"
+            }, item.name));
+        }, [
+        props.icons
+    ]);
+    return /*#__PURE__*/ react.createElement("div", null, 0 === props.iconsLength ? /*#__PURE__*/ react.createElement("div", {
+        className: "px-sm-extra py-md text-neutral-strong"
+    }, /*#__PURE__*/ react.createElement(Text, null, "No results found.")) : /*#__PURE__*/ react.createElement(Grid, {
+        className: "px-sm-extra py-xs-plus outline-none",
+        cellRenderer: renderCell(),
+        columnCount: COLUMN_COUNT,
+        columnWidth: COLUMN_WIDTH,
+        rowHeight: ROW_HEIGHT,
+        width: GRID_WIDTH,
+        height: GRID_HEIGHT,
+        rowCount: Math.ceil(props.iconsLength / COLUMN_COUNT)
+    }));
 };
 export { IconPickerGrid };
 

package/IconPicker/primitives/components/IconPickerGrid.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","Grid","Text","cn","IconPickerIconFormatter","IconPickerIcon","COLUMN_COUNT","GRID_WIDTH","GRID_HEIGHT","COLUMN_WIDTH","ROW_HEIGHT","IconPickerGrid","props","renderCell","columnIndex","key","rowIndex","style","item","icons","createElement","className","onClick","onIconSelect","formatStringValue","name","prefix","as","size","iconsLength","cellRenderer","columnCount","columnWidth","rowHeight","width","height","rowCount","Math","ceil"],"sources":["IconPickerGrid.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport type { GridCellProps } from \"react-virtualized\";\nimport { Grid } from \"react-virtualized\";\nimport { Text } from \"~/Text/index.js\";\nimport { cn } from \"~/utils.js\";\nimport type { IconPickerFontAwesome } from \"../../domains/index.js\";\nimport { IconPickerIconFormatter } from \"../../domains/index.js\";\nimport { IconPickerIcon } from \"./IconPickerIcon.js\";\n\nconst COLUMN_COUNT = 5;\nconst GRID_WIDTH = 424;\nconst GRID_HEIGHT = 270;\nconst COLUMN_WIDTH = 80;\nconst ROW_HEIGHT = 80;\n\ninterface IconPickerGridProps {\n    icons: IconPickerFontAwesome[];\n    iconsLength: number;\n    onIconSelect: (value: string) => void;\n}\n\nconst IconPickerGrid = (props: IconPickerGridProps) => {\n    const renderCell = useCallback(() => {\n        return function renderCell({\n            columnIndex,\n            key,\n            rowIndex,\n            style\n        }: GridCellProps): React.ReactNode {\n            const item = props.icons[rowIndex * COLUMN_COUNT + columnIndex];\n            if (!item) {\n                return null;\n            }\n\n            return (\n                <div\n                    key={key}\n                    style={style}\n                    className={cn([\n                        \"flex flex-col justify-center items-center gap-sm\",\n                        \"text-neutral-strong\",\n                        \"hover:bg-neutral-dimmed hover:text-neutral-strong\",\n                        \"px-xs-plus box-border rounded-xs cursor-pointer overflow-hidden\",\n                        \"transition-colors duration-400 ease-out\"\n                    ])}\n                    onClick={() => {\n                        if (props.onIconSelect) {\n                            props.onIconSelect(IconPickerIconFormatter.formatStringValue(item));\n                        }\n                    }}\n                >\n                    <IconPickerIcon name={item.name} prefix={item.prefix} className={\"size-lg\"} />\n                    <Text\n                        as={\"div\"}\n                        size={\"sm\"}\n                        className={\"w-full truncate text-center text-neutral-muted\"}\n                    >\n                        {item.name}\n                    </Text>\n                </div>\n            );\n        };\n    }, [props.icons]);\n\n    return (\n        <div>\n            {props.iconsLength === 0 ? (\n                <div className={`px-sm-extra py-md text-neutral-strong`}>\n                    <Text>{\"No results found.\"}</Text>\n                </div>\n            ) : (\n                <Grid\n                    className={\"px-sm-extra py-xs-plus outline-none\"}\n                    cellRenderer={renderCell()}\n                    columnCount={COLUMN_COUNT}\n                    columnWidth={COLUMN_WIDTH}\n                    rowHeight={ROW_HEIGHT}\n                    width={GRID_WIDTH}\n                    height={GRID_HEIGHT}\n                    rowCount={Math.ceil(props.iconsLength / COLUMN_COUNT)}\n                />\n            )}\n        </div>\n    );\n};\n\nexport { IconPickerGrid, type IconPickerGridProps };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAE1C,SAASC,IAAI,QAAQ,mBAAmB;AACxC,SAASC,IAAI;AACb,SAASC,EAAE;AAEX,SAASC,uBAAuB;AAChC,SAASC,cAAc;AAEvB,MAAMC,YAAY,GAAG,CAAC;AACtB,MAAMC,UAAU,GAAG,GAAG;AACtB,MAAMC,WAAW,GAAG,GAAG;AACvB,MAAMC,YAAY,GAAG,EAAE;AACvB,MAAMC,UAAU,GAAG,EAAE;AAQrB,MAAMC,cAAc,GAAIC,KAA0B,IAAK;EACnD,MAAMC,UAAU,GAAGb,WAAW,CAAC,MAAM;IACjC,OAAO,SAASa,UAAUA,CAAC;MACvBC,WAAW;MACXC,GAAG;MACHC,QAAQ;MACRC;IACW,CAAC,EAAmB;MAC/B,MAAMC,IAAI,GAAGN,KAAK,CAACO,KAAK,CAACH,QAAQ,GAAGV,YAAY,GAAGQ,WAAW,CAAC;MAC/D,IAAI,CAACI,IAAI,EAAE;QACP,OAAO,IAAI;MACf;MAEA,oBACInB,KAAA,CAAAqB,aAAA;QACIL,GAAG,EAAEA,GAAI;QACTE,KAAK,EAAEA,KAAM;QACbI,SAAS,EAAElB,EAAE,CAAC,CACV,kDAAkD,EAClD,qBAAqB,EACrB,mDAAmD,EACnD,iEAAiE,EACjE,yCAAyC,CAC5C,CAAE;QACHmB,OAAO,EAAEA,CAAA,KAAM;UACX,IAAIV,KAAK,CAACW,YAAY,EAAE;YACpBX,KAAK,CAACW,YAAY,CAACnB,uBAAuB,CAACoB,iBAAiB,CAACN,IAAI,CAAC,CAAC;UACvE;QACJ;MAAE,gBAEFnB,KAAA,CAAAqB,aAAA,CAACf,cAAc;QAACoB,IAAI,EAAEP,IAAI,CAACO,IAAK;QAACC,MAAM,EAAER,IAAI,CAACQ,MAAO;QAACL,SAAS,EAAE;MAAU,CAAE,CAAC,eAC9EtB,KAAA,CAAAqB,aAAA,CAAClB,IAAI;QACDyB,EAAE,EAAE,KAAM;QACVC,IAAI,EAAE,IAAK;QACXP,SAAS,EAAE;MAAiD,GAE3DH,IAAI,CAACO,IACJ,CACL,CAAC;IAEd,CAAC;EACL,CAAC,EAAE,CAACb,KAAK,CAACO,KAAK,CAAC,CAAC;EAEjB,oBACIpB,KAAA,CAAAqB,aAAA,cACKR,KAAK,CAACiB,WAAW,KAAK,CAAC,gBACpB9B,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAwC,gBACpDtB,KAAA,CAAAqB,aAAA,CAAClB,IAAI,QAAE,mBAA0B,CAChC,CAAC,gBAENH,KAAA,CAAAqB,aAAA,CAACnB,IAAI;IACDoB,SAAS,EAAE,qCAAsC;IACjDS,YAAY,EAAEjB,UAAU,CAAC,CAAE;IAC3BkB,WAAW,EAAEzB,YAAa;IAC1B0B,WAAW,EAAEvB,YAAa;IAC1BwB,SAAS,EAAEvB,UAAW;IACtBwB,KAAK,EAAE3B,UAAW;IAClB4B,MAAM,EAAE3B,WAAY;IACpB4B,QAAQ,EAAEC,IAAI,CAACC,IAAI,CAAC1B,KAAK,CAACiB,WAAW,GAAGvB,YAAY;EAAE,CACzD,CAEJ,CAAC;AAEd,CAAC;AAED,SAASK,cAAc","ignoreList":[]}
+{"version":3,"file":"IconPicker/primitives/components/IconPickerGrid.js","sources":["../../../../src/IconPicker/primitives/components/IconPickerGrid.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport type { GridCellProps } from \"react-virtualized\";\nimport { Grid } from \"react-virtualized\";\nimport { Text } from \"~/Text/index.js\";\nimport { cn } from \"~/utils.js\";\nimport type { IconPickerFontAwesome } from \"../../domains/index.js\";\nimport { IconPickerIconFormatter } from \"../../domains/index.js\";\nimport { IconPickerIcon } from \"./IconPickerIcon.js\";\n\nconst COLUMN_COUNT = 5;\nconst GRID_WIDTH = 424;\nconst GRID_HEIGHT = 270;\nconst COLUMN_WIDTH = 80;\nconst ROW_HEIGHT = 80;\n\ninterface IconPickerGridProps {\n    icons: IconPickerFontAwesome[];\n    iconsLength: number;\n    onIconSelect: (value: string) => void;\n}\n\nconst IconPickerGrid = (props: IconPickerGridProps) => {\n    const renderCell = useCallback(() => {\n        return function renderCell({\n            columnIndex,\n            key,\n            rowIndex,\n            style\n        }: GridCellProps): React.ReactNode {\n            const item = props.icons[rowIndex * COLUMN_COUNT + columnIndex];\n            if (!item) {\n                return null;\n            }\n\n            return (\n                <div\n                    key={key}\n                    style={style}\n                    className={cn([\n                        \"flex flex-col justify-center items-center gap-sm\",\n                        \"text-neutral-strong\",\n                        \"hover:bg-neutral-dimmed hover:text-neutral-strong\",\n                        \"px-xs-plus box-border rounded-xs cursor-pointer overflow-hidden\",\n                        \"transition-colors duration-400 ease-out\"\n                    ])}\n                    onClick={() => {\n                        if (props.onIconSelect) {\n                            props.onIconSelect(IconPickerIconFormatter.formatStringValue(item));\n                        }\n                    }}\n                >\n                    <IconPickerIcon name={item.name} prefix={item.prefix} className={\"size-lg\"} />\n                    <Text\n                        as={\"div\"}\n                        size={\"sm\"}\n                        className={\"w-full truncate text-center text-neutral-muted\"}\n                    >\n                        {item.name}\n                    </Text>\n                </div>\n            );\n        };\n    }, [props.icons]);\n\n    return (\n        <div>\n            {props.iconsLength === 0 ? (\n                <div className={`px-sm-extra py-md text-neutral-strong`}>\n                    <Text>{\"No results found.\"}</Text>\n                </div>\n            ) : (\n                <Grid\n                    className={\"px-sm-extra py-xs-plus outline-none\"}\n                    cellRenderer={renderCell()}\n                    columnCount={COLUMN_COUNT}\n                    columnWidth={COLUMN_WIDTH}\n                    rowHeight={ROW_HEIGHT}\n                    width={GRID_WIDTH}\n                    height={GRID_HEIGHT}\n                    rowCount={Math.ceil(props.iconsLength / COLUMN_COUNT)}\n                />\n            )}\n        </div>\n    );\n};\n\nexport { IconPickerGrid, type IconPickerGridProps };\n"],"names":["COLUMN_COUNT","GRID_WIDTH","GRID_HEIGHT","COLUMN_WIDTH","ROW_HEIGHT","IconPickerGrid","props","renderCell","useCallback","columnIndex","key","rowIndex","style","item","cn","IconPickerIconFormatter","IconPickerIcon","Text","Grid","Math"],"mappings":";;;;;;AASA,MAAMA,eAAe;AACrB,MAAMC,aAAa;AACnB,MAAMC,cAAc;AACpB,MAAMC,eAAe;AACrB,MAAMC,aAAa;AAQnB,MAAMC,iBAAiB,CAACC;IACpB,MAAMC,aAAaC,YAAY,IACpB,SAAoB,EACvBC,WAAW,EACXC,GAAG,EACHC,QAAQ,EACRC,KAAK,EACO;YACZ,MAAMC,OAAOP,MAAM,KAAK,CAACK,WAAWX,eAAeS,YAAY;YAC/D,IAAI,CAACI,MACD,OAAO;YAGX,OAAO,WAAP,GACI,oBAAC;gBACG,KAAKH;gBACL,OAAOE;gBACP,WAAWE,GAAG;oBACV;oBACA;oBACA;oBACA;oBACA;iBACH;gBACD,SAAS;oBACL,IAAIR,MAAM,YAAY,EAClBA,MAAM,YAAY,CAACS,wBAAwB,iBAAiB,CAACF;gBAErE;6BAEA,oBAACG,gBAAcA;gBAAC,MAAMH,KAAK,IAAI;gBAAE,QAAQA,KAAK,MAAM;gBAAE,WAAW;8BACjE,oBAACI,MAAIA;gBACD,IAAI;gBACJ,MAAM;gBACN,WAAW;eAEVJ,KAAK,IAAI;QAI1B,GACD;QAACP,MAAM,KAAK;KAAC;IAEhB,OAAO,WAAP,GACI,oBAAC,aACIA,AAAsB,MAAtBA,MAAM,WAAW,GAAS,WAAJ,GACnB,oBAAC;QAAI,WAAW;qBACZ,oBAACW,MAAIA,MAAE,sCAGX,oBAACC,MAAIA;QACD,WAAW;QACX,cAAcX;QACd,aAAaP;QACb,aAAaG;QACb,WAAWC;QACX,OAAOH;QACP,QAAQC;QACR,UAAUiB,KAAK,IAAI,CAACb,MAAM,WAAW,GAAGN;;AAK5D"}

package/IconPicker/primitives/components/IconPickerIcon.js

@@ -1,16 +1,13 @@
-import React from "react";
+import react from "react";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-const IconPickerIcon = ({
-  name,
-  prefix,
-  ...props
-}) => {
-  return /*#__PURE__*/React.createElement("div", props, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
-    icon: [prefix, name],
-    size: "2x",
-    className: "block size-full!"
-  }));
-};
+const IconPickerIcon = ({ name, prefix, ...props })=>/*#__PURE__*/ react.createElement("div", props, /*#__PURE__*/ react.createElement(FontAwesomeIcon, {
+        icon: [
+            prefix,
+            name
+        ],
+        size: "2x",
+        className: "block size-full!"
+    }));
 export { IconPickerIcon };
 
 //# sourceMappingURL=IconPickerIcon.js.map

package/IconPicker/primitives/components/IconPickerIcon.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","FontAwesomeIcon","IconPickerIcon","name","prefix","props","createElement","icon","size","className"],"sources":["IconPickerIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport type { IconName, IconPrefix } from \"@fortawesome/fontawesome-svg-core\";\n\ninterface IconPickerIconProps extends React.HTMLAttributes<HTMLDivElement> {\n    name: IconName;\n    prefix: IconPrefix;\n}\n\nconst IconPickerIcon = ({ name, prefix, ...props }: IconPickerIconProps) => {\n    return (\n        <div {...props}>\n            <FontAwesomeIcon icon={[prefix, name]} size={\"2x\"} className={\"block size-full!\"} />\n        </div>\n    );\n};\n\nexport { IconPickerIcon, type IconPickerIconProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,QAAQ,gCAAgC;AAQhE,MAAMC,cAAc,GAAGA,CAAC;EAAEC,IAAI;EAAEC,MAAM;EAAE,GAAGC;AAA2B,CAAC,KAAK;EACxE,oBACIL,KAAA,CAAAM,aAAA,QAASD,KAAK,eACVL,KAAA,CAAAM,aAAA,CAACL,eAAe;IAACM,IAAI,EAAE,CAACH,MAAM,EAAED,IAAI,CAAE;IAACK,IAAI,EAAE,IAAK;IAACC,SAAS,EAAE;EAAmB,CAAE,CAClF,CAAC;AAEd,CAAC;AAED,SAASP,cAAc","ignoreList":[]}
+{"version":3,"file":"IconPicker/primitives/components/IconPickerIcon.js","sources":["../../../../src/IconPicker/primitives/components/IconPickerIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport type { IconName, IconPrefix } from \"@fortawesome/fontawesome-svg-core\";\n\ninterface IconPickerIconProps extends React.HTMLAttributes<HTMLDivElement> {\n    name: IconName;\n    prefix: IconPrefix;\n}\n\nconst IconPickerIcon = ({ name, prefix, ...props }: IconPickerIconProps) => {\n    return (\n        <div {...props}>\n            <FontAwesomeIcon icon={[prefix, name]} size={\"2x\"} className={\"block size-full!\"} />\n        </div>\n    );\n};\n\nexport { IconPickerIcon, type IconPickerIconProps };\n"],"names":["IconPickerIcon","name","prefix","props","FontAwesomeIcon"],"mappings":";;AASA,MAAMA,iBAAiB,CAAC,EAAEC,IAAI,EAAEC,MAAM,EAAE,GAAGC,OAA4B,GAC5D,WAAP,GACI,oBAAC,OAAQA,OAAAA,WAAAA,GACL,oBAACC,iBAAeA;QAAC,MAAM;YAACF;YAAQD;SAAK;QAAE,MAAM;QAAM,WAAW"}

package/IconPicker/primitives/components/IconPickerInput.js

@@ -1,36 +1,33 @@
-import React, { useCallback } from "react";
-import { ReactComponent as SearchIcon } from "@webiny/icons/search.svg";
+import react, { useCallback } from "react";
+import { ReactComponent } from "@webiny/icons/search.svg";
 import { Input } from "../../../Input/index.js";
 import { Icon } from "../../../Icon/index.js";
 import { DelayedOnChange } from "../../../DelayedOnChange/index.js";
 import { cn } from "../../../utils.js";
-const IconPickerInput = props => {
-  const onInputChange = useCallback((value, cb) => {
-    props.onChange(value);
-    if (cb) {
-      cb(value);
-    }
-  }, [props.onChange]);
-  return /*#__PURE__*/React.createElement(DelayedOnChange, {
-    value: props.value,
-    onChange: onInputChange
-  }, ({
-    value,
-    onChange
-  }) => /*#__PURE__*/React.createElement("div", {
-    className: cn("p-xs-plus pb-0")
-  }, /*#__PURE__*/React.createElement(Input, {
-    inputRef: props.inputRef,
-    value: value,
-    onChange: onChange,
-    placeholder: "Search icons...",
-    variant: "secondary",
-    size: "md",
-    startIcon: /*#__PURE__*/React.createElement(Icon, {
-      icon: /*#__PURE__*/React.createElement(SearchIcon, null),
-      label: "Search icons"
-    })
-  })));
+const IconPickerInput = (props)=>{
+    const onInputChange = useCallback((value, cb)=>{
+        props.onChange(value);
+        if (cb) cb(value);
+    }, [
+        props.onChange
+    ]);
+    return /*#__PURE__*/ react.createElement(DelayedOnChange, {
+        value: props.value,
+        onChange: onInputChange
+    }, ({ value, onChange })=>/*#__PURE__*/ react.createElement("div", {
+            className: cn("p-xs-plus pb-0")
+        }, /*#__PURE__*/ react.createElement(Input, {
+            inputRef: props.inputRef,
+            value: value,
+            onChange: onChange,
+            placeholder: "Search icons...",
+            variant: "secondary",
+            size: "md",
+            startIcon: /*#__PURE__*/ react.createElement(Icon, {
+                icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+                label: "Search icons"
+            })
+        })));
 };
 export { IconPickerInput };
 

package/IconPicker/primitives/components/IconPickerInput.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","ReactComponent","SearchIcon","Input","Icon","DelayedOnChange","cn","IconPickerInput","props","onInputChange","value","cb","onChange","createElement","className","inputRef","placeholder","variant","size","startIcon","icon","label"],"sources":["IconPickerInput.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport { ReactComponent as SearchIcon } from \"@webiny/icons/search.svg\";\nimport { Input } from \"~/Input/index.js\";\nimport { Icon } from \"~/Icon/index.js\";\nimport type { OnChangeCallable } from \"~/DelayedOnChange/index.js\";\nimport { DelayedOnChange } from \"~/DelayedOnChange/index.js\";\nimport { cn } from \"~/utils.js\";\n\ninterface IconPickerInputProps {\n    value: string;\n    onChange: (value: string) => void;\n    inputRef: React.RefObject<HTMLInputElement>;\n}\n\nconst IconPickerInput = (props: IconPickerInputProps) => {\n    const onInputChange = useCallback<OnChangeCallable>(\n        (value, cb) => {\n            props.onChange(value);\n            if (cb) {\n                cb(value);\n            }\n        },\n        [props.onChange]\n    );\n\n    return (\n        <DelayedOnChange value={props.value} onChange={onInputChange}>\n            {({ value, onChange }) => (\n                <div className={cn(\"p-xs-plus pb-0\")}>\n                    <Input\n                        inputRef={props.inputRef}\n                        value={value}\n                        onChange={onChange}\n                        placeholder={\"Search icons...\"}\n                        variant={\"secondary\"}\n                        size={\"md\"}\n                        startIcon={<Icon icon={<SearchIcon />} label={\"Search icons\"} />}\n                    />\n                </div>\n            )}\n        </DelayedOnChange>\n    );\n};\n\nexport { IconPickerInput, type IconPickerInputProps };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAC1C,SAASC,cAAc,IAAIC,UAAU,QAAQ,0BAA0B;AACvE,SAASC,KAAK;AACd,SAASC,IAAI;AAEb,SAASC,eAAe;AACxB,SAASC,EAAE;AAQX,MAAMC,eAAe,GAAIC,KAA2B,IAAK;EACrD,MAAMC,aAAa,GAAGT,WAAW,CAC7B,CAACU,KAAK,EAAEC,EAAE,KAAK;IACXH,KAAK,CAACI,QAAQ,CAACF,KAAK,CAAC;IACrB,IAAIC,EAAE,EAAE;MACJA,EAAE,CAACD,KAAK,CAAC;IACb;EACJ,CAAC,EACD,CAACF,KAAK,CAACI,QAAQ,CACnB,CAAC;EAED,oBACIb,KAAA,CAAAc,aAAA,CAACR,eAAe;IAACK,KAAK,EAAEF,KAAK,CAACE,KAAM;IAACE,QAAQ,EAAEH;EAAc,GACxD,CAAC;IAAEC,KAAK;IAAEE;EAAS,CAAC,kBACjBb,KAAA,CAAAc,aAAA;IAAKC,SAAS,EAAER,EAAE,CAAC,gBAAgB;EAAE,gBACjCP,KAAA,CAAAc,aAAA,CAACV,KAAK;IACFY,QAAQ,EAAEP,KAAK,CAACO,QAAS;IACzBL,KAAK,EAAEA,KAAM;IACbE,QAAQ,EAAEA,QAAS;IACnBI,WAAW,EAAE,iBAAkB;IAC/BC,OAAO,EAAE,WAAY;IACrBC,IAAI,EAAE,IAAK;IACXC,SAAS,eAAEpB,KAAA,CAAAc,aAAA,CAACT,IAAI;MAACgB,IAAI,eAAErB,KAAA,CAAAc,aAAA,CAACX,UAAU,MAAE,CAAE;MAACmB,KAAK,EAAE;IAAe,CAAE;EAAE,CACpE,CACA,CAEI,CAAC;AAE1B,CAAC;AAED,SAASd,eAAe","ignoreList":[]}
+{"version":3,"file":"IconPicker/primitives/components/IconPickerInput.js","sources":["../../../../src/IconPicker/primitives/components/IconPickerInput.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport { ReactComponent as SearchIcon } from \"@webiny/icons/search.svg\";\nimport { Input } from \"~/Input/index.js\";\nimport { Icon } from \"~/Icon/index.js\";\nimport type { OnChangeCallable } from \"~/DelayedOnChange/index.js\";\nimport { DelayedOnChange } from \"~/DelayedOnChange/index.js\";\nimport { cn } from \"~/utils.js\";\n\ninterface IconPickerInputProps {\n    value: string;\n    onChange: (value: string) => void;\n    inputRef: React.RefObject<HTMLInputElement>;\n}\n\nconst IconPickerInput = (props: IconPickerInputProps) => {\n    const onInputChange = useCallback<OnChangeCallable>(\n        (value, cb) => {\n            props.onChange(value);\n            if (cb) {\n                cb(value);\n            }\n        },\n        [props.onChange]\n    );\n\n    return (\n        <DelayedOnChange value={props.value} onChange={onInputChange}>\n            {({ value, onChange }) => (\n                <div className={cn(\"p-xs-plus pb-0\")}>\n                    <Input\n                        inputRef={props.inputRef}\n                        value={value}\n                        onChange={onChange}\n                        placeholder={\"Search icons...\"}\n                        variant={\"secondary\"}\n                        size={\"md\"}\n                        startIcon={<Icon icon={<SearchIcon />} label={\"Search icons\"} />}\n                    />\n                </div>\n            )}\n        </DelayedOnChange>\n    );\n};\n\nexport { IconPickerInput, type IconPickerInputProps };\n"],"names":["IconPickerInput","props","onInputChange","useCallback","value","cb","DelayedOnChange","onChange","cn","Input","Icon","SearchIcon"],"mappings":";;;;;;AAcA,MAAMA,kBAAkB,CAACC;IACrB,MAAMC,gBAAgBC,YAClB,CAACC,OAAOC;QACJJ,MAAM,QAAQ,CAACG;QACf,IAAIC,IACAA,GAAGD;IAEX,GACA;QAACH,MAAM,QAAQ;KAAC;IAGpB,OAAO,WAAP,GACI,oBAACK,iBAAeA;QAAC,OAAOL,MAAM,KAAK;QAAE,UAAUC;OAC1C,CAAC,EAAEE,KAAK,EAAEG,QAAQ,EAAE,iBACjB,oBAAC;YAAI,WAAWC,GAAG;yBACf,oBAACC,OAAKA;YACF,UAAUR,MAAM,QAAQ;YACxB,OAAOG;YACP,UAAUG;YACV,aAAa;YACb,SAAS;YACT,MAAM;YACN,yBAAW,oBAACG,MAAIA;gBAAC,oBAAM,oBAACC,gBAAUA;gBAAK,OAAO;;;AAMtE"}

package/IconPicker/primitives/components/IconPickerTrigger.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 import { type VariantProps } from "../../../utils.js";
 declare const iconPickerTriggerVariants: (props?: ({
-    size?: "md" | "lg" | "xl" | null | undefined;
+    size?: "lg" | "md" | "xl" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 interface IconPickerTriggerProps extends VariantProps<typeof iconPickerTriggerVariants> {
     value?: string;

package/IconPicker/primitives/components/IconPickerTrigger.js

@@ -1,45 +1,44 @@
-import React, { useMemo } from "react";
-import { ReactComponent as ChevronDown } from "@webiny/icons/keyboard_arrow_down.svg";
-import { Icon as IconComponent } from "../../../Icon/index.js";
+import react, { useMemo } from "react";
+import { ReactComponent } from "@webiny/icons/keyboard_arrow_down.svg";
+import { Icon } from "../../../Icon/index.js";
 import { cn, cva } from "../../../utils.js";
-import { IconPickerIcon as IconPickerIconComponent } from "./IconPickerIcon.js";
-import { IconPickerIcon, IconPickerIconFormatter } from "../../domains/index.js";
+import { IconPickerIcon } from "./IconPickerIcon.js";
+import { IconPickerIcon as index_js_IconPickerIcon, IconPickerIconFormatter } from "../../domains/index.js";
 const iconPickerTriggerVariants = cva("flex items-center", {
-  variants: {
-    size: {
-      md: "gap-xs",
-      lg: "gap-xs",
-      xl: "gap-sm"
+    variants: {
+        size: {
+            md: "gap-xs",
+            lg: "gap-xs",
+            xl: "gap-sm"
+        }
+    },
+    defaultVariants: {
+        size: "lg"
     }
-  },
-  defaultVariants: {
-    size: "lg"
-  }
 });
-const IconPickerTrigger = ({
-  value,
-  size
-}) => {
-  const icon = useMemo(() => {
-    const icon = IconPickerIcon.createFromString(value);
-    return IconPickerIconFormatter.formatFontAwesome(icon);
-  }, [value]);
-  return /*#__PURE__*/React.createElement("div", {
-    className: cn(iconPickerTriggerVariants({
-      size
-    }))
-  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(IconComponent, {
-    size: size === "xl" ? "lg" : "md",
-    icon: /*#__PURE__*/React.createElement(IconPickerIconComponent, {
-      prefix: icon.prefix,
-      name: icon.name
-    }),
-    label: `Selected icon`
-  })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(IconComponent, {
-    size: "sm",
-    icon: /*#__PURE__*/React.createElement(ChevronDown, null),
-    label: "Open list"
-  })));
+const IconPickerTrigger = ({ value, size })=>{
+    const icon = useMemo(()=>{
+        const icon = index_js_IconPickerIcon.createFromString(value);
+        return IconPickerIconFormatter.formatFontAwesome(icon);
+    }, [
+        value
+    ]);
+    return /*#__PURE__*/ react.createElement("div", {
+        className: cn(iconPickerTriggerVariants({
+            size
+        }))
+    }, /*#__PURE__*/ react.createElement("div", null, /*#__PURE__*/ react.createElement(Icon, {
+        size: "xl" === size ? "lg" : "md",
+        icon: /*#__PURE__*/ react.createElement(IconPickerIcon, {
+            prefix: icon.prefix,
+            name: icon.name
+        }),
+        label: "Selected icon"
+    })), /*#__PURE__*/ react.createElement("div", null, /*#__PURE__*/ react.createElement(Icon, {
+        size: "sm",
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+        label: "Open list"
+    })));
 };
 export { IconPickerTrigger };
 

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

@@ -1 +1 @@
-{"version":3,"names":["React","useMemo","ReactComponent","ChevronDown","Icon","IconComponent","cn","cva","IconPickerIcon","IconPickerIconComponent","IconPickerIconFormatter","iconPickerTriggerVariants","variants","size","md","lg","xl","defaultVariants","IconPickerTrigger","value","icon","createFromString","formatFontAwesome","createElement","className","prefix","name","label"],"sources":["IconPickerTrigger.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { ReactComponent as ChevronDown } from \"@webiny/icons/keyboard_arrow_down.svg\";\nimport { Icon as IconComponent } from \"~/Icon/index.js\";\nimport { cn, cva, type VariantProps } from \"~/utils.js\";\nimport { IconPickerIcon as IconPickerIconComponent } from \"./IconPickerIcon.js\";\nimport { IconPickerIcon, IconPickerIconFormatter } from \"../../domains/index.js\";\n\nconst iconPickerTriggerVariants = cva(\"flex items-center\", {\n    variants: {\n        size: {\n            md: \"gap-xs\",\n            lg: \"gap-xs\",\n            xl: \"gap-sm\"\n        }\n    },\n    defaultVariants: {\n        size: \"lg\"\n    }\n});\n\ninterface IconPickerTriggerProps extends VariantProps<typeof iconPickerTriggerVariants> {\n    value?: string;\n}\n\nconst IconPickerTrigger = ({ value, size }: IconPickerTriggerProps) => {\n    const icon = useMemo(() => {\n        const icon = IconPickerIcon.createFromString(value);\n        return IconPickerIconFormatter.formatFontAwesome(icon);\n    }, [value]);\n\n    return (\n        <div className={cn(iconPickerTriggerVariants({ size }))}>\n            <div>\n                <IconComponent\n                    size={size === \"xl\" ? \"lg\" : \"md\"}\n                    icon={<IconPickerIconComponent prefix={icon.prefix} name={icon.name} />}\n                    label={`Selected icon`}\n                />\n            </div>\n            <div>\n                <IconComponent size={\"sm\"} icon={<ChevronDown />} label={\"Open list\"} />\n            </div>\n        </div>\n    );\n};\n\nexport { IconPickerTrigger, type IconPickerTriggerProps };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,SAASC,cAAc,IAAIC,WAAW,QAAQ,uCAAuC;AACrF,SAASC,IAAI,IAAIC,aAAa;AAC9B,SAASC,EAAE,EAAEC,GAAG;AAChB,SAASC,cAAc,IAAIC,uBAAuB;AAClD,SAASD,cAAc,EAAEE,uBAAuB;AAEhD,MAAMC,yBAAyB,GAAGJ,GAAG,CAAC,mBAAmB,EAAE;EACvDK,QAAQ,EAAE;IACNC,IAAI,EAAE;MACFC,EAAE,EAAE,QAAQ;MACZC,EAAE,EAAE,QAAQ;MACZC,EAAE,EAAE;IACR;EACJ,CAAC;EACDC,eAAe,EAAE;IACbJ,IAAI,EAAE;EACV;AACJ,CAAC,CAAC;AAMF,MAAMK,iBAAiB,GAAGA,CAAC;EAAEC,KAAK;EAAEN;AAA6B,CAAC,KAAK;EACnE,MAAMO,IAAI,GAAGnB,OAAO,CAAC,MAAM;IACvB,MAAMmB,IAAI,GAAGZ,cAAc,CAACa,gBAAgB,CAACF,KAAK,CAAC;IACnD,OAAOT,uBAAuB,CAACY,iBAAiB,CAACF,IAAI,CAAC;EAC1D,CAAC,EAAE,CAACD,KAAK,CAAC,CAAC;EAEX,oBACInB,KAAA,CAAAuB,aAAA;IAAKC,SAAS,EAAElB,EAAE,CAACK,yBAAyB,CAAC;MAAEE;IAAK,CAAC,CAAC;EAAE,gBACpDb,KAAA,CAAAuB,aAAA,2BACIvB,KAAA,CAAAuB,aAAA,CAAClB,aAAa;IACVQ,IAAI,EAAEA,IAAI,KAAK,IAAI,GAAG,IAAI,GAAG,IAAK;IAClCO,IAAI,eAAEpB,KAAA,CAAAuB,aAAA,CAACd,uBAAuB;MAACgB,MAAM,EAAEL,IAAI,CAACK,MAAO;MAACC,IAAI,EAAEN,IAAI,CAACM;IAAK,CAAE,CAAE;IACxEC,KAAK,EAAE;EAAgB,CAC1B,CACA,CAAC,eACN3B,KAAA,CAAAuB,aAAA,2BACIvB,KAAA,CAAAuB,aAAA,CAAClB,aAAa;IAACQ,IAAI,EAAE,IAAK;IAACO,IAAI,eAAEpB,KAAA,CAAAuB,aAAA,CAACpB,WAAW,MAAE,CAAE;IAACwB,KAAK,EAAE;EAAY,CAAE,CACtE,CACJ,CAAC;AAEd,CAAC;AAED,SAAST,iBAAiB","ignoreList":[]}
+{"version":3,"file":"IconPicker/primitives/components/IconPickerTrigger.js","sources":["../../../../src/IconPicker/primitives/components/IconPickerTrigger.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { ReactComponent as ChevronDown } from \"@webiny/icons/keyboard_arrow_down.svg\";\nimport { Icon as IconComponent } from \"~/Icon/index.js\";\nimport { cn, cva, type VariantProps } from \"~/utils.js\";\nimport { IconPickerIcon as IconPickerIconComponent } from \"./IconPickerIcon.js\";\nimport { IconPickerIcon, IconPickerIconFormatter } from \"../../domains/index.js\";\n\nconst iconPickerTriggerVariants = cva(\"flex items-center\", {\n    variants: {\n        size: {\n            md: \"gap-xs\",\n            lg: \"gap-xs\",\n            xl: \"gap-sm\"\n        }\n    },\n    defaultVariants: {\n        size: \"lg\"\n    }\n});\n\ninterface IconPickerTriggerProps extends VariantProps<typeof iconPickerTriggerVariants> {\n    value?: string;\n}\n\nconst IconPickerTrigger = ({ value, size }: IconPickerTriggerProps) => {\n    const icon = useMemo(() => {\n        const icon = IconPickerIcon.createFromString(value);\n        return IconPickerIconFormatter.formatFontAwesome(icon);\n    }, [value]);\n\n    return (\n        <div className={cn(iconPickerTriggerVariants({ size }))}>\n            <div>\n                <IconComponent\n                    size={size === \"xl\" ? \"lg\" : \"md\"}\n                    icon={<IconPickerIconComponent prefix={icon.prefix} name={icon.name} />}\n                    label={`Selected icon`}\n                />\n            </div>\n            <div>\n                <IconComponent size={\"sm\"} icon={<ChevronDown />} label={\"Open list\"} />\n            </div>\n        </div>\n    );\n};\n\nexport { IconPickerTrigger, type IconPickerTriggerProps };\n"],"names":["iconPickerTriggerVariants","cva","IconPickerTrigger","value","size","icon","useMemo","IconPickerIcon","IconPickerIconFormatter","cn","IconComponent","IconPickerIconComponent","ChevronDown"],"mappings":";;;;;;AAOA,MAAMA,4BAA4BC,IAAI,qBAAqB;IACvD,UAAU;QACN,MAAM;YACF,IAAI;YACJ,IAAI;YACJ,IAAI;QACR;IACJ;IACA,iBAAiB;QACb,MAAM;IACV;AACJ;AAMA,MAAMC,oBAAoB,CAAC,EAAEC,KAAK,EAAEC,IAAI,EAA0B;IAC9D,MAAMC,OAAOC,QAAQ;QACjB,MAAMD,OAAOE,wBAAAA,gBAA+B,CAACJ;QAC7C,OAAOK,wBAAwB,iBAAiB,CAACH;IACrD,GAAG;QAACF;KAAM;IAEV,OAAO,WAAP,GACI,oBAAC;QAAI,WAAWM,GAAGT,0BAA0B;YAAEI;QAAK;qBAChD,oBAAC,2BACG,oBAACM,MAAaA;QACV,MAAMN,AAAS,SAATA,OAAgB,OAAO;QAC7B,oBAAM,oBAACO,gBAAuBA;YAAC,QAAQN,KAAK,MAAM;YAAE,MAAMA,KAAK,IAAI;;QACnE,OAAO;uBAGf,oBAAC,2BACG,oBAACK,MAAaA;QAAC,MAAM;QAAM,oBAAM,oBAACE,gBAAWA;QAAK,OAAO;;AAIzE"}

package/IconPicker/primitives/components/index.js

@@ -2,5 +2,3 @@ export * from "./IconPickerGrid.js";
 export * from "./IconPickerIcon.js";
 export * from "./IconPickerInput.js";
 export * from "./IconPickerTrigger.js";
-
-//# sourceMappingURL=index.js.map

package/IconPicker/primitives/index.js

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

package/IconPicker/primitives/presenters/IconPickerPresenter.js

@@ -1,42 +1,40 @@
 import { makeAutoObservable } from "mobx";
 import { IconPickerIcon, IconPickerIconFormatter, ListCache } from "../../domains/index.js";
 class IconPickerPresenter {
-  open = false;
-  icons = new ListCache();
-  searchQuery = "";
-  params = undefined;
-  constructor() {
-    makeAutoObservable(this);
-  }
-  init = params => {
-    this.params = params;
-    this.icons.clear();
-    this.icons.addItems(params.icons.map(icon => IconPickerIcon.create(icon)));
-  };
-  get vm() {
-    return {
-      open: this.open,
-      searchQuery: this.searchQuery,
-      icons: this.getIcons().map(icon => IconPickerIconFormatter.formatFontAwesome(icon)),
-      iconsLength: this.getIcons().length || 0
-    };
-  }
-  setListOpenState = open => {
-    this.open = open;
-  };
-  searchIcon = value => {
-    this.searchQuery = value;
-  };
-  setSelectedIcon = icon => {
-    this.setListOpenState(false);
-    this.params?.onChange?.(icon);
-  };
-  getIcons = () => {
-    if (this.searchQuery) {
-      return this.icons.getItems(icon => icon.name.includes(this.searchQuery));
+    constructor(){
+        this.open = false;
+        this.icons = new ListCache();
+        this.searchQuery = "";
+        this.params = void 0;
+        this.init = (params)=>{
+            this.params = params;
+            this.icons.clear();
+            this.icons.addItems(params.icons.map((icon)=>IconPickerIcon.create(icon)));
+        };
+        this.setListOpenState = (open)=>{
+            this.open = open;
+        };
+        this.searchIcon = (value)=>{
+            this.searchQuery = value;
+        };
+        this.setSelectedIcon = (icon)=>{
+            this.setListOpenState(false);
+            this.params?.onChange?.(icon);
+        };
+        this.getIcons = ()=>{
+            if (this.searchQuery) return this.icons.getItems((icon)=>icon.name.includes(this.searchQuery));
+            return this.icons.getItems();
+        };
+        makeAutoObservable(this);
+    }
+    get vm() {
+        return {
+            open: this.open,
+            searchQuery: this.searchQuery,
+            icons: this.getIcons().map((icon)=>IconPickerIconFormatter.formatFontAwesome(icon)),
+            iconsLength: this.getIcons().length || 0
+        };
     }
-    return this.icons.getItems();
-  };
 }
 export { IconPickerPresenter };
 

package/IconPicker/primitives/presenters/IconPickerPresenter.js.map

@@ -1 +1 @@
-{"version":3,"names":["makeAutoObservable","IconPickerIcon","IconPickerIconFormatter","ListCache","IconPickerPresenter","open","icons","searchQuery","params","undefined","constructor","init","clear","addItems","map","icon","create","vm","getIcons","formatFontAwesome","iconsLength","length","setListOpenState","searchIcon","value","setSelectedIcon","onChange","getItems","name","includes"],"sources":["IconPickerPresenter.ts"],"sourcesContent":["import { makeAutoObservable } from \"mobx\";\nimport type { IconPickerIconDto, IconPickerFontAwesome } from \"../../domains/index.js\";\nimport { IconPickerIcon, IconPickerIconFormatter, ListCache } from \"../../domains/index.js\";\n\ninterface IconPickerParams {\n    icons: IconPickerIconDto[];\n    onChange?: (value: string) => void;\n}\n\ninterface IIconPickerPresenter {\n    vm: {\n        open: boolean;\n        icons: IconPickerFontAwesome[];\n        iconsLength: number;\n        searchQuery: string;\n    };\n    init: (params: IconPickerParams) => void;\n    setListOpenState: (open: boolean) => void;\n    searchIcon: (value: string) => void;\n    setSelectedIcon: (icon: string) => void;\n}\n\nclass IconPickerPresenter implements IIconPickerPresenter {\n    private open = false;\n    private icons = new ListCache<IconPickerIcon>();\n    private searchQuery = \"\";\n    private params?: IconPickerParams = undefined;\n\n    constructor() {\n        makeAutoObservable(this);\n    }\n\n    public init = (params: IconPickerParams) => {\n        this.params = params;\n        this.icons.clear();\n        this.icons.addItems(params.icons.map(icon => IconPickerIcon.create(icon)));\n    };\n\n    get vm() {\n        return {\n            open: this.open,\n            searchQuery: this.searchQuery,\n            icons: this.getIcons().map(icon => IconPickerIconFormatter.formatFontAwesome(icon)),\n            iconsLength: this.getIcons().length || 0\n        };\n    }\n\n    public setListOpenState = (open: boolean) => {\n        this.open = open;\n    };\n\n    public searchIcon = (value: string) => {\n        this.searchQuery = value;\n    };\n\n    public setSelectedIcon = (icon: string) => {\n        this.setListOpenState(false);\n        this.params?.onChange?.(icon);\n    };\n\n    private getIcons = () => {\n        if (this.searchQuery) {\n            return this.icons.getItems(icon => icon.name.includes(this.searchQuery));\n        }\n\n        return this.icons.getItems();\n    };\n}\n\nexport { IconPickerPresenter, type IIconPickerPresenter, type IconPickerParams };\n"],"mappings":"AAAA,SAASA,kBAAkB,QAAQ,MAAM;AAEzC,SAASC,cAAc,EAAEC,uBAAuB,EAAEC,SAAS;AAoB3D,MAAMC,mBAAmB,CAAiC;EAC9CC,IAAI,GAAG,KAAK;EACZC,KAAK,GAAG,IAAIH,SAAS,CAAiB,CAAC;EACvCI,WAAW,GAAG,EAAE;EAChBC,MAAM,GAAsBC,SAAS;EAE7CC,WAAWA,CAAA,EAAG;IACVV,kBAAkB,CAAC,IAAI,CAAC;EAC5B;EAEOW,IAAI,GAAIH,MAAwB,IAAK;IACxC,IAAI,CAACA,MAAM,GAAGA,MAAM;IACpB,IAAI,CAACF,KAAK,CAACM,KAAK,CAAC,CAAC;IAClB,IAAI,CAACN,KAAK,CAACO,QAAQ,CAACL,MAAM,CAACF,KAAK,CAACQ,GAAG,CAACC,IAAI,IAAId,cAAc,CAACe,MAAM,CAACD,IAAI,CAAC,CAAC,CAAC;EAC9E,CAAC;EAED,IAAIE,EAAEA,CAAA,EAAG;IACL,OAAO;MACHZ,IAAI,EAAE,IAAI,CAACA,IAAI;MACfE,WAAW,EAAE,IAAI,CAACA,WAAW;MAC7BD,KAAK,EAAE,IAAI,CAACY,QAAQ,CAAC,CAAC,CAACJ,GAAG,CAACC,IAAI,IAAIb,uBAAuB,CAACiB,iBAAiB,CAACJ,IAAI,CAAC,CAAC;MACnFK,WAAW,EAAE,IAAI,CAACF,QAAQ,CAAC,CAAC,CAACG,MAAM,IAAI;IAC3C,CAAC;EACL;EAEOC,gBAAgB,GAAIjB,IAAa,IAAK;IACzC,IAAI,CAACA,IAAI,GAAGA,IAAI;EACpB,CAAC;EAEMkB,UAAU,GAAIC,KAAa,IAAK;IACnC,IAAI,CAACjB,WAAW,GAAGiB,KAAK;EAC5B,CAAC;EAEMC,eAAe,GAAIV,IAAY,IAAK;IACvC,IAAI,CAACO,gBAAgB,CAAC,KAAK,CAAC;IAC5B,IAAI,CAACd,MAAM,EAAEkB,QAAQ,GAAGX,IAAI,CAAC;EACjC,CAAC;EAEOG,QAAQ,GAAGA,CAAA,KAAM;IACrB,IAAI,IAAI,CAACX,WAAW,EAAE;MAClB,OAAO,IAAI,CAACD,KAAK,CAACqB,QAAQ,CAACZ,IAAI,IAAIA,IAAI,CAACa,IAAI,CAACC,QAAQ,CAAC,IAAI,CAACtB,WAAW,CAAC,CAAC;IAC5E;IAEA,OAAO,IAAI,CAACD,KAAK,CAACqB,QAAQ,CAAC,CAAC;EAChC,CAAC;AACL;AAEA,SAASvB,mBAAmB","ignoreList":[]}
+{"version":3,"file":"IconPicker/primitives/presenters/IconPickerPresenter.js","sources":["../../../../src/IconPicker/primitives/presenters/IconPickerPresenter.ts"],"sourcesContent":["import { makeAutoObservable } from \"mobx\";\nimport type { IconPickerIconDto, IconPickerFontAwesome } from \"../../domains/index.js\";\nimport { IconPickerIcon, IconPickerIconFormatter, ListCache } from \"../../domains/index.js\";\n\ninterface IconPickerParams {\n    icons: IconPickerIconDto[];\n    onChange?: (value: string) => void;\n}\n\ninterface IIconPickerPresenter {\n    vm: {\n        open: boolean;\n        icons: IconPickerFontAwesome[];\n        iconsLength: number;\n        searchQuery: string;\n    };\n    init: (params: IconPickerParams) => void;\n    setListOpenState: (open: boolean) => void;\n    searchIcon: (value: string) => void;\n    setSelectedIcon: (icon: string) => void;\n}\n\nclass IconPickerPresenter implements IIconPickerPresenter {\n    private open = false;\n    private icons = new ListCache<IconPickerIcon>();\n    private searchQuery = \"\";\n    private params?: IconPickerParams = undefined;\n\n    constructor() {\n        makeAutoObservable(this);\n    }\n\n    public init = (params: IconPickerParams) => {\n        this.params = params;\n        this.icons.clear();\n        this.icons.addItems(params.icons.map(icon => IconPickerIcon.create(icon)));\n    };\n\n    get vm() {\n        return {\n            open: this.open,\n            searchQuery: this.searchQuery,\n            icons: this.getIcons().map(icon => IconPickerIconFormatter.formatFontAwesome(icon)),\n            iconsLength: this.getIcons().length || 0\n        };\n    }\n\n    public setListOpenState = (open: boolean) => {\n        this.open = open;\n    };\n\n    public searchIcon = (value: string) => {\n        this.searchQuery = value;\n    };\n\n    public setSelectedIcon = (icon: string) => {\n        this.setListOpenState(false);\n        this.params?.onChange?.(icon);\n    };\n\n    private getIcons = () => {\n        if (this.searchQuery) {\n            return this.icons.getItems(icon => icon.name.includes(this.searchQuery));\n        }\n\n        return this.icons.getItems();\n    };\n}\n\nexport { IconPickerPresenter, type IIconPickerPresenter, type IconPickerParams };\n"],"names":["IconPickerPresenter","ListCache","undefined","params","icon","IconPickerIcon","open","value","makeAutoObservable","IconPickerIconFormatter"],"mappings":";;AAsBA,MAAMA;IAMF,aAAc;aALN,IAAI,GAAG;aACP,KAAK,GAAG,IAAIC;aACZ,WAAW,GAAG;aACd,MAAM,GAAsBC;aAM7B,IAAI,GAAG,CAACC;YACX,IAAI,CAAC,MAAM,GAAGA;YACd,IAAI,CAAC,KAAK,CAAC,KAAK;YAChB,IAAI,CAAC,KAAK,CAAC,QAAQ,CAACA,OAAO,KAAK,CAAC,GAAG,CAACC,CAAAA,OAAQC,eAAe,MAAM,CAACD;QACvE;aAWO,gBAAgB,GAAG,CAACE;YACvB,IAAI,CAAC,IAAI,GAAGA;QAChB;aAEO,UAAU,GAAG,CAACC;YACjB,IAAI,CAAC,WAAW,GAAGA;QACvB;aAEO,eAAe,GAAG,CAACH;YACtB,IAAI,CAAC,gBAAgB,CAAC;YACtB,IAAI,CAAC,MAAM,EAAE,WAAWA;QAC5B;aAEQ,QAAQ,GAAG;YACf,IAAI,IAAI,CAAC,WAAW,EAChB,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,CAACA,CAAAA,OAAQA,KAAK,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,WAAW;YAG1E,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ;QAC9B;QArCII,mBAAmB,IAAI;IAC3B;IAQA,IAAI,KAAK;QACL,OAAO;YACH,MAAM,IAAI,CAAC,IAAI;YACf,aAAa,IAAI,CAAC,WAAW;YAC7B,OAAO,IAAI,CAAC,QAAQ,GAAG,GAAG,CAACJ,CAAAA,OAAQK,wBAAwB,iBAAiB,CAACL;YAC7E,aAAa,IAAI,CAAC,QAAQ,GAAG,MAAM,IAAI;QAC3C;IACJ;AAsBJ"}

package/IconPicker/primitives/presenters/index.js

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

package/IconPicker/primitives/useIconPicker.js

@@ -1,29 +1,34 @@
 import { useEffect, useMemo, useState } from "react";
 import { autorun } from "mobx";
 import { IconPickerPresenter } from "./presenters/index.js";
-export const useIconPicker = props => {
-  const params = useMemo(() => ({
-    icons: props.icons,
-    onChange: props.onChange
-  }), [props.icons, props.onChange]);
-  const presenter = useMemo(() => {
-    return new IconPickerPresenter();
-  }, []);
-  const [vm, setVm] = useState(presenter.vm);
-  useEffect(() => {
-    presenter.init(params);
-  }, [params, presenter]);
-  useEffect(() => {
-    return autorun(() => {
-      setVm(presenter.vm);
-    });
-  }, [presenter]);
-  return {
-    vm,
-    setListOpenState: presenter.setListOpenState,
-    searchIcon: presenter.searchIcon,
-    setSelectedIcon: presenter.setSelectedIcon
-  };
+const useIconPicker = (props)=>{
+    const params = useMemo(()=>({
+            icons: props.icons,
+            onChange: props.onChange
+        }), [
+        props.icons,
+        props.onChange
+    ]);
+    const presenter = useMemo(()=>new IconPickerPresenter(), []);
+    const [vm, setVm] = useState(presenter.vm);
+    useEffect(()=>{
+        presenter.init(params);
+    }, [
+        params,
+        presenter
+    ]);
+    useEffect(()=>autorun(()=>{
+            setVm(presenter.vm);
+        }), [
+        presenter
+    ]);
+    return {
+        vm,
+        setListOpenState: presenter.setListOpenState,
+        searchIcon: presenter.searchIcon,
+        setSelectedIcon: presenter.setSelectedIcon
+    };
 };
+export { useIconPicker };
 
 //# sourceMappingURL=useIconPicker.js.map

package/IconPicker/primitives/useIconPicker.js.map

@@ -1 +1 @@
-{"version":3,"names":["useEffect","useMemo","useState","autorun","IconPickerPresenter","useIconPicker","props","params","icons","onChange","presenter","vm","setVm","init","setListOpenState","searchIcon","setSelectedIcon"],"sources":["useIconPicker.ts"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport { autorun } from \"mobx\";\nimport type { IconPickerParams } from \"./presenters/index.js\";\nimport { IconPickerPresenter } from \"./presenters/index.js\";\nimport type { IconPickerPrimitiveProps } from \"./IconPickerPrimitive.js\";\n\nexport const useIconPicker = (props: IconPickerPrimitiveProps) => {\n    const params: IconPickerParams = useMemo(\n        () => ({\n            icons: props.icons,\n            onChange: props.onChange\n        }),\n        [props.icons, props.onChange]\n    );\n\n    const presenter = useMemo(() => {\n        return new IconPickerPresenter();\n    }, []);\n\n    const [vm, setVm] = useState(presenter.vm);\n\n    useEffect(() => {\n        presenter.init(params);\n    }, [params, presenter]);\n\n    useEffect(() => {\n        return autorun(() => {\n            setVm(presenter.vm);\n        });\n    }, [presenter]);\n\n    return {\n        vm,\n        setListOpenState: presenter.setListOpenState,\n        searchIcon: presenter.searchIcon,\n        setSelectedIcon: presenter.setSelectedIcon\n    };\n};\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AACpD,SAASC,OAAO,QAAQ,MAAM;AAE9B,SAASC,mBAAmB;AAG5B,OAAO,MAAMC,aAAa,GAAIC,KAA+B,IAAK;EAC9D,MAAMC,MAAwB,GAAGN,OAAO,CACpC,OAAO;IACHO,KAAK,EAAEF,KAAK,CAACE,KAAK;IAClBC,QAAQ,EAAEH,KAAK,CAACG;EACpB,CAAC,CAAC,EACF,CAACH,KAAK,CAACE,KAAK,EAAEF,KAAK,CAACG,QAAQ,CAChC,CAAC;EAED,MAAMC,SAAS,GAAGT,OAAO,CAAC,MAAM;IAC5B,OAAO,IAAIG,mBAAmB,CAAC,CAAC;EACpC,CAAC,EAAE,EAAE,CAAC;EAEN,MAAM,CAACO,EAAE,EAAEC,KAAK,CAAC,GAAGV,QAAQ,CAACQ,SAAS,CAACC,EAAE,CAAC;EAE1CX,SAAS,CAAC,MAAM;IACZU,SAAS,CAACG,IAAI,CAACN,MAAM,CAAC;EAC1B,CAAC,EAAE,CAACA,MAAM,EAAEG,SAAS,CAAC,CAAC;EAEvBV,SAAS,CAAC,MAAM;IACZ,OAAOG,OAAO,CAAC,MAAM;MACjBS,KAAK,CAACF,SAAS,CAACC,EAAE,CAAC;IACvB,CAAC,CAAC;EACN,CAAC,EAAE,CAACD,SAAS,CAAC,CAAC;EAEf,OAAO;IACHC,EAAE;IACFG,gBAAgB,EAAEJ,SAAS,CAACI,gBAAgB;IAC5CC,UAAU,EAAEL,SAAS,CAACK,UAAU;IAChCC,eAAe,EAAEN,SAAS,CAACM;EAC/B,CAAC;AACL,CAAC","ignoreList":[]}
+{"version":3,"file":"IconPicker/primitives/useIconPicker.js","sources":["../../../src/IconPicker/primitives/useIconPicker.ts"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport { autorun } from \"mobx\";\nimport type { IconPickerParams } from \"./presenters/index.js\";\nimport { IconPickerPresenter } from \"./presenters/index.js\";\nimport type { IconPickerPrimitiveProps } from \"./IconPickerPrimitive.js\";\n\nexport const useIconPicker = (props: IconPickerPrimitiveProps) => {\n    const params: IconPickerParams = useMemo(\n        () => ({\n            icons: props.icons,\n            onChange: props.onChange\n        }),\n        [props.icons, props.onChange]\n    );\n\n    const presenter = useMemo(() => {\n        return new IconPickerPresenter();\n    }, []);\n\n    const [vm, setVm] = useState(presenter.vm);\n\n    useEffect(() => {\n        presenter.init(params);\n    }, [params, presenter]);\n\n    useEffect(() => {\n        return autorun(() => {\n            setVm(presenter.vm);\n        });\n    }, [presenter]);\n\n    return {\n        vm,\n        setListOpenState: presenter.setListOpenState,\n        searchIcon: presenter.searchIcon,\n        setSelectedIcon: presenter.setSelectedIcon\n    };\n};\n"],"names":["useIconPicker","props","params","useMemo","presenter","IconPickerPresenter","vm","setVm","useState","useEffect","autorun"],"mappings":";;;AAMO,MAAMA,gBAAgB,CAACC;IAC1B,MAAMC,SAA2BC,QAC7B,IAAO;YACH,OAAOF,MAAM,KAAK;YAClB,UAAUA,MAAM,QAAQ;QAC5B,IACA;QAACA,MAAM,KAAK;QAAEA,MAAM,QAAQ;KAAC;IAGjC,MAAMG,YAAYD,QAAQ,IACf,IAAIE,uBACZ,EAAE;IAEL,MAAM,CAACC,IAAIC,MAAM,GAAGC,SAASJ,UAAU,EAAE;IAEzCK,UAAU;QACNL,UAAU,IAAI,CAACF;IACnB,GAAG;QAACA;QAAQE;KAAU;IAEtBK,UAAU,IACCC,QAAQ;YACXH,MAAMH,UAAU,EAAE;QACtB,IACD;QAACA;KAAU;IAEd,OAAO;QACHE;QACA,kBAAkBF,UAAU,gBAAgB;QAC5C,YAAYA,UAAU,UAAU;QAChC,iBAAiBA,UAAU,eAAe;IAC9C;AACJ"}

package/Image/Image.js

@@ -1,18 +1,11 @@
-import React from "react";
-
-// Accepts all props that a normal <img> element would accept.
-
-const Image = ({
-  ...rest
-}) => {
-  const finalProps = {
-    ...rest
-  };
-  const srcSet = finalProps.srcSet;
-  if (srcSet && typeof srcSet === "object") {
-    finalProps.srcSet = Object.keys(srcSet).map(key => `${srcSet[key]} ${key}`).join(", ");
-  }
-  return /*#__PURE__*/React.createElement("img", finalProps);
+import react from "react";
+const Image = ({ ...rest })=>{
+    const finalProps = {
+        ...rest
+    };
+    const srcSet = finalProps.srcSet;
+    if (srcSet && "object" == typeof srcSet) finalProps.srcSet = Object.keys(srcSet).map((key)=>`${srcSet[key]} ${key}`).join(", ");
+    return /*#__PURE__*/ react.createElement("img", finalProps);
 };
 export { Image };
 

package/Image/Image.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Image","rest","finalProps","srcSet","Object","keys","map","key","join","createElement"],"sources":["Image.tsx"],"sourcesContent":["import React from \"react\";\n\n// Accepts all props that a normal <img> element would accept.\ninterface ImageProps extends React.DetailedHTMLProps<\n    React.ImgHTMLAttributes<HTMLImageElement>,\n    HTMLImageElement\n> {\n    [key: string]: any;\n}\n\nconst Image = ({ ...rest }: ImageProps) => {\n    const finalProps = { ...rest };\n    const srcSet = finalProps.srcSet;\n    if (srcSet && typeof srcSet === \"object\") {\n        finalProps.srcSet = Object.keys(srcSet)\n            .map(key => `${srcSet[key]} ${key}`)\n            .join(\", \");\n    }\n\n    return <img {...finalProps} />;\n};\n\nexport { Image, type ImageProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;;AAEzB;;AAQA,MAAMC,KAAK,GAAGA,CAAC;EAAE,GAAGC;AAAiB,CAAC,KAAK;EACvC,MAAMC,UAAU,GAAG;IAAE,GAAGD;EAAK,CAAC;EAC9B,MAAME,MAAM,GAAGD,UAAU,CAACC,MAAM;EAChC,IAAIA,MAAM,IAAI,OAAOA,MAAM,KAAK,QAAQ,EAAE;IACtCD,UAAU,CAACC,MAAM,GAAGC,MAAM,CAACC,IAAI,CAACF,MAAM,CAAC,CAClCG,GAAG,CAACC,GAAG,IAAI,GAAGJ,MAAM,CAACI,GAAG,CAAC,IAAIA,GAAG,EAAE,CAAC,CACnCC,IAAI,CAAC,IAAI,CAAC;EACnB;EAEA,oBAAOT,KAAA,CAAAU,aAAA,QAASP,UAAa,CAAC;AAClC,CAAC;AAED,SAASF,KAAK","ignoreList":[]}
+{"version":3,"file":"Image/Image.js","sources":["../../src/Image/Image.tsx"],"sourcesContent":["import React from \"react\";\n\n// Accepts all props that a normal <img> element would accept.\ninterface ImageProps extends React.DetailedHTMLProps<\n    React.ImgHTMLAttributes<HTMLImageElement>,\n    HTMLImageElement\n> {\n    [key: string]: any;\n}\n\nconst Image = ({ ...rest }: ImageProps) => {\n    const finalProps = { ...rest };\n    const srcSet = finalProps.srcSet;\n    if (srcSet && typeof srcSet === \"object\") {\n        finalProps.srcSet = Object.keys(srcSet)\n            .map(key => `${srcSet[key]} ${key}`)\n            .join(\", \");\n    }\n\n    return <img {...finalProps} />;\n};\n\nexport { Image, type ImageProps };\n"],"names":["Image","rest","finalProps","srcSet","Object","key"],"mappings":";AAUA,MAAMA,QAAQ,CAAC,EAAE,GAAGC,MAAkB;IAClC,MAAMC,aAAa;QAAE,GAAGD,IAAI;IAAC;IAC7B,MAAME,SAASD,WAAW,MAAM;IAChC,IAAIC,UAAU,AAAkB,YAAlB,OAAOA,QACjBD,WAAW,MAAM,GAAGE,OAAO,IAAI,CAACD,QAC3B,GAAG,CAACE,CAAAA,MAAO,GAAGF,MAAM,CAACE,IAAI,CAAC,CAAC,EAAEA,KAAK,EAClC,IAAI,CAAC;IAGd,OAAO,WAAP,GAAO,oBAAC,OAAQH;AACpB"}