@webiny/app-admin 6.3.0 → 6.4.0-beta.0

package/components/SimpleUI/InputField.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","css","classNames","omit","Typography","FormElementMessage","inputStyle","process","env","NODE_ENV","name","styles","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","labelStyle","getValue","params","value","defaultValue","type","isNaN","InputField","className","onChange","onKeyDown","label","description","validation","isValid","props","createElement","Fragment","use","Object","assign","ev","target","toLowerCase","error","message","memo"],"sources":["InputField.tsx"],"sourcesContent":["import React from \"react\";\nimport { css } from \"@emotion/css\";\nimport classNames from \"classnames\";\nimport omit from \"lodash/omit.js\";\nimport { Typography } from \"@webiny/ui/Typography/index.js\";\nimport { FormElementMessage } from \"@webiny/ui/FormElementMessage/index.js\";\n\nconst inputStyle = css({\n    boxSizing: \"border-box\",\n    border: \"1px solid var(--mdc-theme-on-background)\",\n    width: \"100%\",\n    height: \"100%\",\n    padding: \"4px 8px\",\n    textAlign: \"left\",\n    minHeight: 32,\n    backgroundColor: \"var(--mdc-theme-surface)\",\n    transition: \"150ms all ease-in-out\",\n    \"&:focus:not(:disabled)\": {\n        backgroundColor: \"var(--mdc-theme-on-background)\"\n    },\n    \"&:hover:not(:disabled)\": {\n        backgroundColor: \"var(--mdc-theme-on-background)\"\n    },\n    \"&:disabled\": {\n        opacity: 0.5,\n        cursor: \"not-allowed\"\n    },\n\n    \"&.text-center\": {\n        textAlign: \"center\",\n        padding: 4\n    },\n\n    \"&::-webkit-inner-spin-button\": {\n        WebkitAppearance: \"none\",\n        margin: 0\n    },\n    \"&::-webkit-outer-spin-button\": {\n        WebkitAppearance: \"none\",\n        margin: 0\n    }\n});\n\nconst labelStyle = css({\n    marginBottom: 8,\n    padding: \"0px 8px\",\n    \"& span\": {\n        color: \"var(--mdc-theme-text-primary-on-background)\"\n    }\n});\n\ninterface GetValueParams {\n    value: string | number | undefined;\n    defaultValue: string | number;\n    type: \"number\" | \"string\";\n}\nconst getValue = (params: GetValueParams): string => {\n    const { value, defaultValue, type } = params;\n    if (type === \"number\") {\n        return (isNaN(value as number) ? defaultValue : value) as string;\n    }\n    return (value || defaultValue) as string;\n};\n\nexport type OnKeyDownProps = React.SyntheticEvent<HTMLInputElement, Event> &\n    React.KeyboardEvent<HTMLInputElement>;\n\ninterface InputBoxProps {\n    value?: string | number;\n    onChange?: (value: any) => void;\n    onKeyDown?: (e: OnKeyDownProps) => any;\n    defaultValue?: string | number;\n    type?: \"string\" | \"number\";\n    [key: string]: any;\n}\nconst InputField = ({\n    className,\n    value,\n    onChange,\n    onKeyDown,\n    label,\n    description,\n    validation = { isValid: true },\n    defaultValue = \"\",\n    ...props\n}: InputBoxProps) => {\n    return (\n        <React.Fragment>\n            {label && (\n                <div className={labelStyle}>\n                    <Typography use={\"body2\"}>{label}</Typography>\n                </div>\n            )}\n            <input\n                className={classNames(inputStyle, className)}\n                value={getValue({\n                    value,\n                    type: props.type || \"string\",\n                    defaultValue\n                })}\n                onKeyDown={onKeyDown}\n                onChange={ev => {\n                    if (!onChange) {\n                        return;\n                    }\n                    onChange((ev.target.value || \"\").toLowerCase());\n                }}\n                {...omit(props, \"validate\")}\n            />\n            {validation.isValid === false && (\n                <FormElementMessage error>{validation.message}</FormElementMessage>\n            )}\n            {validation.isValid !== false && description && (\n                <FormElementMessage>{description}</FormElementMessage>\n            )}\n        </React.Fragment>\n    );\n};\n\nexport default React.memo(InputField);\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,GAAG,QAAQ,cAAc;AAClC,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,IAAI,MAAM,gBAAgB;AACjC,SAASC,UAAU,QAAQ,gCAAgC;AAC3D,SAASC,kBAAkB,QAAQ,wCAAwC;AAE3E,MAAMC,UAAU,gBAAGL,GAAG,CAAAM,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,QAAA,EAAAC;AAAA,CAkCrB,CAAC;AAEF,MAAMC,UAAU,gBAAGb,GAAG,CAAAM,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,QAAA,EAAAC;AAAA,CAMrB,CAAC;AAOF,MAAME,QAAQ,GAAIC,MAAsB,IAAa;EACjD,MAAM;IAAEC,KAAK;IAAEC,YAAY;IAAEC;EAAK,CAAC,GAAGH,MAAM;EAC5C,IAAIG,IAAI,KAAK,QAAQ,EAAE;IACnB,OAAQC,KAAK,CAACH,KAAe,CAAC,GAAGC,YAAY,GAAGD,KAAK;EACzD;EACA,OAAQA,KAAK,IAAIC,YAAY;AACjC,CAAC;AAaD,MAAMG,UAAU,GAAGA,CAAC;EAChBC,SAAS;EACTL,KAAK;EACLM,QAAQ;EACRC,SAAS;EACTC,KAAK;EACLC,WAAW;EACXC,UAAU,GAAG;IAAEC,OAAO,EAAE;EAAK,CAAC;EAC9BV,YAAY,GAAG,EAAE;EACjB,GAAGW;AACQ,CAAC,KAAK;EACjB,oBACI7B,KAAA,CAAA8B,aAAA,CAAC9B,KAAK,CAAC+B,QAAQ,QACVN,KAAK,iBACFzB,KAAA,CAAA8B,aAAA;IAAKR,SAAS,EAAER;EAAW,gBACvBd,KAAA,CAAA8B,aAAA,CAAC1B,UAAU;IAAC4B,GAAG,EAAE;EAAQ,GAAEP,KAAkB,CAC5C,CACR,eACDzB,KAAA,CAAA8B,aAAA,UAAAG,MAAA,CAAAC,MAAA;IACIZ,SAAS,EAAEpB,UAAU,CAACI,UAAU,EAAEgB,SAAS,CAAE;IAC7CL,KAAK,EAAEF,QAAQ,CAAC;MACZE,KAAK;MACLE,IAAI,EAAEU,KAAK,CAACV,IAAI,IAAI,QAAQ;MAC5BD;IACJ,CAAC,CAAE;IACHM,SAAS,EAAEA,SAAU;IACrBD,QAAQ,EAAEY,EAAE,IAAI;MACZ,IAAI,CAACZ,QAAQ,EAAE;QACX;MACJ;MACAA,QAAQ,CAAC,CAACY,EAAE,CAACC,MAAM,CAACnB,KAAK,IAAI,EAAE,EAAEoB,WAAW,CAAC,CAAC,CAAC;IACnD;EAAE,GACElC,IAAI,CAAC0B,KAAK,EAAE,UAAU,CAAC,CAC9B,CAAC,EACDF,UAAU,CAACC,OAAO,KAAK,KAAK,iBACzB5B,KAAA,CAAA8B,aAAA,CAACzB,kBAAkB;IAACiC,KAAK;EAAA,GAAEX,UAAU,CAACY,OAA4B,CACrE,EACAZ,UAAU,CAACC,OAAO,KAAK,KAAK,IAAIF,WAAW,iBACxC1B,KAAA,CAAA8B,aAAA,CAACzB,kBAAkB,QAAEqB,WAAgC,CAE7C,CAAC;AAEzB,CAAC;AAED,4BAAe1B,KAAK,CAACwC,IAAI,CAACnB,UAAU,CAAC","ignoreList":[]}
+{"version":3,"file":"components/SimpleUI/InputField.js","sources":["../../../src/components/SimpleUI/InputField.tsx"],"sourcesContent":["import React from \"react\";\nimport { css } from \"@emotion/css\";\nimport classNames from \"classnames\";\nimport omit from \"lodash/omit.js\";\nimport { Text, FormComponentErrorMessage, FormComponentNote } from \"@webiny/admin-ui\";\n\nconst inputStyle = css({\n    boxSizing: \"border-box\",\n    border: \"1px solid var(--mdc-theme-on-background)\",\n    width: \"100%\",\n    height: \"100%\",\n    padding: \"4px 8px\",\n    textAlign: \"left\",\n    minHeight: 32,\n    backgroundColor: \"var(--mdc-theme-surface)\",\n    transition: \"150ms all ease-in-out\",\n    \"&:focus:not(:disabled)\": {\n        backgroundColor: \"var(--mdc-theme-on-background)\"\n    },\n    \"&:hover:not(:disabled)\": {\n        backgroundColor: \"var(--mdc-theme-on-background)\"\n    },\n    \"&:disabled\": {\n        opacity: 0.5,\n        cursor: \"not-allowed\"\n    },\n\n    \"&.text-center\": {\n        textAlign: \"center\",\n        padding: 4\n    },\n\n    \"&::-webkit-inner-spin-button\": {\n        WebkitAppearance: \"none\",\n        margin: 0\n    },\n    \"&::-webkit-outer-spin-button\": {\n        WebkitAppearance: \"none\",\n        margin: 0\n    }\n});\n\nconst labelStyle = css({\n    marginBottom: 8,\n    padding: \"0px 8px\",\n    \"& span\": {\n        color: \"var(--mdc-theme-text-primary-on-background)\"\n    }\n});\n\ninterface GetValueParams {\n    value: string | number | undefined;\n    defaultValue: string | number;\n    type: \"number\" | \"string\";\n}\nconst getValue = (params: GetValueParams): string => {\n    const { value, defaultValue, type } = params;\n    if (type === \"number\") {\n        return (isNaN(value as number) ? defaultValue : value) as string;\n    }\n    return (value || defaultValue) as string;\n};\n\nexport type OnKeyDownProps = React.SyntheticEvent<HTMLInputElement, Event> &\n    React.KeyboardEvent<HTMLInputElement>;\n\ninterface InputBoxProps {\n    value?: string | number;\n    onChange?: (value: any) => void;\n    onKeyDown?: (e: OnKeyDownProps) => any;\n    defaultValue?: string | number;\n    type?: \"string\" | \"number\";\n    [key: string]: any;\n}\nconst InputField = ({\n    className,\n    value,\n    onChange,\n    onKeyDown,\n    label,\n    description,\n    validation = { isValid: true },\n    defaultValue = \"\",\n    ...props\n}: InputBoxProps) => {\n    return (\n        <React.Fragment>\n            {label && (\n                <div className={labelStyle}>\n                    <Text size={\"sm\"}>{label}</Text>\n                </div>\n            )}\n            <input\n                className={classNames(inputStyle, className)}\n                value={getValue({\n                    value,\n                    type: props.type || \"string\",\n                    defaultValue\n                })}\n                onKeyDown={onKeyDown}\n                onChange={ev => {\n                    if (!onChange) {\n                        return;\n                    }\n                    onChange((ev.target.value || \"\").toLowerCase());\n                }}\n                {...omit(props, \"validate\")}\n            />\n            {validation.isValid === false && (\n                <FormComponentErrorMessage text={validation.message} invalid={true} />\n            )}\n            {validation.isValid !== false && description && (\n                <FormComponentNote text={description} />\n            )}\n        </React.Fragment>\n    );\n};\n\nexport default React.memo(InputField);\n"],"names":["inputStyle","css","labelStyle","getValue","params","value","defaultValue","type","isNaN","InputField","className","onChange","onKeyDown","label","description","validation","props","React","Text","classNames","ev","omit","FormComponentErrorMessage","FormComponentNote"],"mappings":";;;;;AAMA,MAAMA,aAAaC,IAAI;IACnB,WAAW;IACX,QAAQ;IACR,OAAO;IACP,QAAQ;IACR,SAAS;IACT,WAAW;IACX,WAAW;IACX,iBAAiB;IACjB,YAAY;IACZ,0BAA0B;QACtB,iBAAiB;IACrB;IACA,0BAA0B;QACtB,iBAAiB;IACrB;IACA,cAAc;QACV,SAAS;QACT,QAAQ;IACZ;IAEA,iBAAiB;QACb,WAAW;QACX,SAAS;IACb;IAEA,gCAAgC;QAC5B,kBAAkB;QAClB,QAAQ;IACZ;IACA,gCAAgC;QAC5B,kBAAkB;QAClB,QAAQ;IACZ;AACJ;AAEA,MAAMC,aAAaD,IAAI;IACnB,cAAc;IACd,SAAS;IACT,UAAU;QACN,OAAO;IACX;AACJ;AAOA,MAAME,WAAW,CAACC;IACd,MAAM,EAAEC,KAAK,EAAEC,YAAY,EAAEC,IAAI,EAAE,GAAGH;IACtC,IAAIG,AAAS,aAATA,MACA,OAAQC,MAAMH,SAAmBC,eAAeD;IAEpD,OAAQA,SAASC;AACrB;AAaA,MAAMG,aAAa,CAAC,EAChBC,SAAS,EACTL,KAAK,EACLM,QAAQ,EACRC,SAAS,EACTC,KAAK,EACLC,WAAW,EACXC,aAAa;IAAE,SAAS;AAAK,CAAC,EAC9BT,eAAe,EAAE,EACjB,GAAGU,OACS,GACL,WAAP,GACI,oBAACC,MAAAA,QAAc,QACVJ,SAAS,WAATA,GACG,oBAAC;QAAI,WAAWX;qBACZ,oBAACgB,MAAIA;QAAC,MAAM;OAAOL,SAAAA,WAAAA,GAG3B,oBAAC;QACG,WAAWM,WAAWnB,YAAYU;QAClC,OAAOP,SAAS;YACZE;YACA,MAAMW,MAAM,IAAI,IAAI;YACpBV;QACJ;QACA,WAAWM;QACX,UAAUQ,CAAAA;YACN,IAAI,CAACT,UACD;YAEJA,SAAUS,AAAAA,CAAAA,GAAG,MAAM,CAAC,KAAK,IAAI,EAAC,EAAG,WAAW;QAChD;QACC,GAAGC,KAAKL,OAAO,WAAW;QAE9BD,AAAuB,UAAvBA,WAAW,OAAO,IAAc,WAAT,GACpB,oBAACO,2BAAyBA;QAAC,MAAMP,WAAW,OAAO;QAAE,SAAS;QAEjEA,AAAuB,UAAvBA,WAAW,OAAO,IAAcD,eAAe,WAAfA,GAC7B,oBAACS,mBAAiBA;QAAC,MAAMT;;AAMzC,0CAAeG,MAAAA,IAAU,CAACR"}

package/components/SingleImageUpload.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
-import type { FileManagerFileItem } from "../index.js";
-import type { FormComponentProps } from "@webiny/ui/types.js";
+import type { FileManagerFileItem } from "../base/ui/FileManager.js";
+import type { FormComponentProps } from "@webiny/admin-ui";
 import { type FilePickerProps } from "@webiny/admin-ui";
 export interface SingleImageUploadProps extends FormComponentProps {
     /**

package/components/SingleImageUpload.js

@@ -1,62 +1,41 @@
-import React, { useCallback } from "react";
-import { FileManager } from "../index.js";
+import react, { useCallback } from "react";
+import { FileManager } from "../base/ui/FileManager.js";
 import { FileItem, FilePicker } from "@webiny/admin-ui";
-const SingleImageUpload = props => {
-  const {
-    accept,
-    className,
-    description,
-    disabled,
-    includeFileMeta = false,
-    label,
-    maxSize,
-    renderFilePreview,
-    renderTrigger,
-    validation,
-    value,
-    variant,
-    type
-  } = props;
-  const onChange = useCallback(value => {
-    if (!props.onChange) {
-      return;
-    }
-    if (value && !includeFileMeta) {
-      props.onChange({
-        id: value.id,
-        src: value.src
-      });
-      return;
-    }
-    if (value && includeFileMeta) {
-      props.onChange(value);
-      return;
-    }
-    props.onChange(null);
-  }, [props.onChange]);
-  return /*#__PURE__*/React.createElement(FileManager, {
-    onChange: onChange,
-    accept: accept,
-    images: !accept,
-    maxSize: maxSize,
-    render: ({
-      showFileManager
-    }) => /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FilePicker, {
-      label: label,
-      description: description,
-      validation: validation,
-      className: className,
-      disabled: disabled,
-      value: value ? FileItem.createFromUrl(value.src) : null,
-      onSelectItem: showFileManager,
-      onRemoveItem: () => onChange(null),
-      renderFilePreview: renderFilePreview,
-      renderTrigger: renderTrigger,
-      variant: variant,
-      type: type
-    }))
-  });
+const SingleImageUpload = (props)=>{
+    const { accept, className, description, disabled, includeFileMeta = false, label, maxSize, renderFilePreview, renderTrigger, validation, value, variant, type } = props;
+    const onChange = useCallback((value)=>{
+        if (!props.onChange) return;
+        if (value && !includeFileMeta) return void props.onChange({
+            id: value.id,
+            src: value.src
+        });
+        if (value && includeFileMeta) return void props.onChange(value);
+        props.onChange(null);
+    }, [
+        props.onChange
+    ]);
+    return /*#__PURE__*/ react.createElement(FileManager, {
+        onChange: onChange,
+        accept: accept,
+        images: !accept,
+        maxSize: maxSize,
+        render: ({ showFileManager })=>/*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(FilePicker, {
+                label: label,
+                description: description,
+                validation: validation,
+                className: className,
+                disabled: disabled,
+                value: value ? FileItem.createFromUrl(value.src) : null,
+                onSelectItem: showFileManager,
+                onRemoveItem: ()=>onChange(null),
+                renderFilePreview: renderFilePreview,
+                renderTrigger: renderTrigger,
+                variant: variant,
+                type: type
+            }))
+    });
 };
-export default SingleImageUpload;
+const components_SingleImageUpload = SingleImageUpload;
+export default components_SingleImageUpload;
 
 //# sourceMappingURL=SingleImageUpload.js.map

package/components/SingleImageUpload.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","FileManager","FileItem","FilePicker","SingleImageUpload","props","accept","className","description","disabled","includeFileMeta","label","maxSize","renderFilePreview","renderTrigger","validation","value","variant","type","onChange","id","src","createElement","images","render","showFileManager","Fragment","createFromUrl","onSelectItem","onRemoveItem"],"sources":["SingleImageUpload.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport type { FileManagerFileItem } from \"~/index.js\";\nimport { FileManager } from \"~/index.js\";\nimport type { FormComponentProps } from \"@webiny/ui/types.js\";\nimport { FileItem, FilePicker, type FilePickerProps } from \"@webiny/admin-ui\";\n\nexport interface SingleImageUploadProps extends FormComponentProps {\n    /**\n     * Accept types\n     */\n    accept?: string[];\n\n    /**\n     * Component label.\n     */\n    label?: string;\n\n    /**\n     * Is component disabled?\n     */\n    disabled?: boolean;\n\n    /**\n     * Description beneath the image.\n     */\n    description?: React.ReactNode;\n\n    /**\n     * A className for the root element.\n     */\n    className?: string;\n\n    /**\n     * Define file's max allowed size (default is \"10mb\").\n     * Uses \"bytes\" (https://www.npmjs.com/package/bytes) library to convert string notation to actual number.\n     */\n    maxSize?: number | string;\n\n    /**\n     * onChange callback when a file is set or unset.\n     * It is marked as `optional` because this component is often used in conjunction with <Bind>, which injects the\n     * `onChange` into its child element. In that case, that prop is not passed by the developer.\n     */\n    onChange?: (value: Pick<FileManagerFileItem, \"id\" | \"src\"> | null) => void;\n\n    /**\n     * Optional custom props, passed to the preview image.\n     */\n    imagePreviewProps?: any;\n\n    /**\n     * By default, file meta is not included in the data passed to `onChange`. If you need it, set this flag to true.\n     */\n    includeFileMeta?: boolean;\n\n    /**\n     * Is the wrapper round?\n     * @deprecated Provide a custom `renderImagePreview` instead.\n     */\n    round?: boolean;\n\n    /**\n     * Render the image preview.\n     */\n    renderFilePreview?: FilePickerProps[\"renderFilePreview\"];\n\n    /**\n     * Render the trigger button.\n     */\n    renderTrigger?: FilePickerProps[\"renderTrigger\"];\n\n    /**\n     * Component type.\n     */\n    type?: FilePickerProps[\"type\"];\n\n    /**\n     * Component variant.\n     */\n    variant?: FilePickerProps[\"variant\"];\n}\n\nconst SingleImageUpload = (props: SingleImageUploadProps) => {\n    const {\n        accept,\n        className,\n        description,\n        disabled,\n        includeFileMeta = false,\n        label,\n        maxSize,\n        renderFilePreview,\n        renderTrigger,\n        validation,\n        value,\n        variant,\n        type\n    } = props;\n\n    const onChange = useCallback(\n        (value: FileManagerFileItem | null) => {\n            if (!props.onChange) {\n                return;\n            }\n\n            if (value && !includeFileMeta) {\n                props.onChange({ id: value.id, src: value.src });\n                return;\n            }\n\n            if (value && includeFileMeta) {\n                props.onChange(value);\n                return;\n            }\n\n            props.onChange(null);\n        },\n        [props.onChange]\n    );\n\n    return (\n        <FileManager\n            onChange={onChange}\n            accept={accept}\n            images={!accept}\n            maxSize={maxSize}\n            render={({ showFileManager }) => (\n                <>\n                    <FilePicker\n                        label={label}\n                        description={description}\n                        validation={validation}\n                        className={className}\n                        disabled={disabled}\n                        value={value ? FileItem.createFromUrl(value.src) : null}\n                        onSelectItem={showFileManager}\n                        onRemoveItem={() => onChange(null)}\n                        renderFilePreview={renderFilePreview}\n                        renderTrigger={renderTrigger}\n                        variant={variant}\n                        type={type}\n                    />\n                </>\n            )}\n        />\n    );\n};\n\nexport default SingleImageUpload;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAE1C,SAASC,WAAW;AAEpB,SAASC,QAAQ,EAAEC,UAAU,QAA8B,kBAAkB;AA8E7E,MAAMC,iBAAiB,GAAIC,KAA6B,IAAK;EACzD,MAAM;IACFC,MAAM;IACNC,SAAS;IACTC,WAAW;IACXC,QAAQ;IACRC,eAAe,GAAG,KAAK;IACvBC,KAAK;IACLC,OAAO;IACPC,iBAAiB;IACjBC,aAAa;IACbC,UAAU;IACVC,KAAK;IACLC,OAAO;IACPC;EACJ,CAAC,GAAGb,KAAK;EAET,MAAMc,QAAQ,GAAGnB,WAAW,CACvBgB,KAAiC,IAAK;IACnC,IAAI,CAACX,KAAK,CAACc,QAAQ,EAAE;MACjB;IACJ;IAEA,IAAIH,KAAK,IAAI,CAACN,eAAe,EAAE;MAC3BL,KAAK,CAACc,QAAQ,CAAC;QAAEC,EAAE,EAAEJ,KAAK,CAACI,EAAE;QAAEC,GAAG,EAAEL,KAAK,CAACK;MAAI,CAAC,CAAC;MAChD;IACJ;IAEA,IAAIL,KAAK,IAAIN,eAAe,EAAE;MAC1BL,KAAK,CAACc,QAAQ,CAACH,KAAK,CAAC;MACrB;IACJ;IAEAX,KAAK,CAACc,QAAQ,CAAC,IAAI,CAAC;EACxB,CAAC,EACD,CAACd,KAAK,CAACc,QAAQ,CACnB,CAAC;EAED,oBACIpB,KAAA,CAAAuB,aAAA,CAACrB,WAAW;IACRkB,QAAQ,EAAEA,QAAS;IACnBb,MAAM,EAAEA,MAAO;IACfiB,MAAM,EAAE,CAACjB,MAAO;IAChBM,OAAO,EAAEA,OAAQ;IACjBY,MAAM,EAAEA,CAAC;MAAEC;IAAgB,CAAC,kBACxB1B,KAAA,CAAAuB,aAAA,CAAAvB,KAAA,CAAA2B,QAAA,qBACI3B,KAAA,CAAAuB,aAAA,CAACnB,UAAU;MACPQ,KAAK,EAAEA,KAAM;MACbH,WAAW,EAAEA,WAAY;MACzBO,UAAU,EAAEA,UAAW;MACvBR,SAAS,EAAEA,SAAU;MACrBE,QAAQ,EAAEA,QAAS;MACnBO,KAAK,EAAEA,KAAK,GAAGd,QAAQ,CAACyB,aAAa,CAACX,KAAK,CAACK,GAAG,CAAC,GAAG,IAAK;MACxDO,YAAY,EAAEH,eAAgB;MAC9BI,YAAY,EAAEA,CAAA,KAAMV,QAAQ,CAAC,IAAI,CAAE;MACnCN,iBAAiB,EAAEA,iBAAkB;MACrCC,aAAa,EAAEA,aAAc;MAC7BG,OAAO,EAAEA,OAAQ;MACjBC,IAAI,EAAEA;IAAK,CACd,CACH;EACJ,CACL,CAAC;AAEV,CAAC;AAED,eAAed,iBAAiB","ignoreList":[]}
+{"version":3,"file":"components/SingleImageUpload.js","sources":["../../src/components/SingleImageUpload.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport type { FileManagerFileItem } from \"~/base/ui/FileManager.js\";\nimport { FileManager } from \"~/base/ui/FileManager.js\";\nimport type { FormComponentProps } from \"@webiny/admin-ui\";\nimport { FileItem, FilePicker, type FilePickerProps } from \"@webiny/admin-ui\";\n\nexport interface SingleImageUploadProps extends FormComponentProps {\n    /**\n     * Accept types\n     */\n    accept?: string[];\n\n    /**\n     * Component label.\n     */\n    label?: string;\n\n    /**\n     * Is component disabled?\n     */\n    disabled?: boolean;\n\n    /**\n     * Description beneath the image.\n     */\n    description?: React.ReactNode;\n\n    /**\n     * A className for the root element.\n     */\n    className?: string;\n\n    /**\n     * Define file's max allowed size (default is \"10mb\").\n     * Uses \"bytes\" (https://www.npmjs.com/package/bytes) library to convert string notation to actual number.\n     */\n    maxSize?: number | string;\n\n    /**\n     * onChange callback when a file is set or unset.\n     * It is marked as `optional` because this component is often used in conjunction with <Bind>, which injects the\n     * `onChange` into its child element. In that case, that prop is not passed by the developer.\n     */\n    onChange?: (value: Pick<FileManagerFileItem, \"id\" | \"src\"> | null) => void;\n\n    /**\n     * Optional custom props, passed to the preview image.\n     */\n    imagePreviewProps?: any;\n\n    /**\n     * By default, file meta is not included in the data passed to `onChange`. If you need it, set this flag to true.\n     */\n    includeFileMeta?: boolean;\n\n    /**\n     * Is the wrapper round?\n     * @deprecated Provide a custom `renderImagePreview` instead.\n     */\n    round?: boolean;\n\n    /**\n     * Render the image preview.\n     */\n    renderFilePreview?: FilePickerProps[\"renderFilePreview\"];\n\n    /**\n     * Render the trigger button.\n     */\n    renderTrigger?: FilePickerProps[\"renderTrigger\"];\n\n    /**\n     * Component type.\n     */\n    type?: FilePickerProps[\"type\"];\n\n    /**\n     * Component variant.\n     */\n    variant?: FilePickerProps[\"variant\"];\n}\n\nconst SingleImageUpload = (props: SingleImageUploadProps) => {\n    const {\n        accept,\n        className,\n        description,\n        disabled,\n        includeFileMeta = false,\n        label,\n        maxSize,\n        renderFilePreview,\n        renderTrigger,\n        validation,\n        value,\n        variant,\n        type\n    } = props;\n\n    const onChange = useCallback(\n        (value: FileManagerFileItem | null) => {\n            if (!props.onChange) {\n                return;\n            }\n\n            if (value && !includeFileMeta) {\n                props.onChange({ id: value.id, src: value.src });\n                return;\n            }\n\n            if (value && includeFileMeta) {\n                props.onChange(value);\n                return;\n            }\n\n            props.onChange(null);\n        },\n        [props.onChange]\n    );\n\n    return (\n        <FileManager\n            onChange={onChange}\n            accept={accept}\n            images={!accept}\n            maxSize={maxSize}\n            render={({ showFileManager }) => (\n                <>\n                    <FilePicker\n                        label={label}\n                        description={description}\n                        validation={validation}\n                        className={className}\n                        disabled={disabled}\n                        value={value ? FileItem.createFromUrl(value.src) : null}\n                        onSelectItem={showFileManager}\n                        onRemoveItem={() => onChange(null)}\n                        renderFilePreview={renderFilePreview}\n                        renderTrigger={renderTrigger}\n                        variant={variant}\n                        type={type}\n                    />\n                </>\n            )}\n        />\n    );\n};\n\nexport default SingleImageUpload;\n"],"names":["SingleImageUpload","props","accept","className","description","disabled","includeFileMeta","label","maxSize","renderFilePreview","renderTrigger","validation","value","variant","type","onChange","useCallback","FileManager","showFileManager","FilePicker","FileItem"],"mappings":";;;AAkFA,MAAMA,oBAAoB,CAACC;IACvB,MAAM,EACFC,MAAM,EACNC,SAAS,EACTC,WAAW,EACXC,QAAQ,EACRC,kBAAkB,KAAK,EACvBC,KAAK,EACLC,OAAO,EACPC,iBAAiB,EACjBC,aAAa,EACbC,UAAU,EACVC,KAAK,EACLC,OAAO,EACPC,IAAI,EACP,GAAGb;IAEJ,MAAMc,WAAWC,YACb,CAACJ;QACG,IAAI,CAACX,MAAM,QAAQ,EACf;QAGJ,IAAIW,SAAS,CAACN,iBAAiB,YAC3BL,MAAM,QAAQ,CAAC;YAAE,IAAIW,MAAM,EAAE;YAAE,KAAKA,MAAM,GAAG;QAAC;QAIlD,IAAIA,SAASN,iBAAiB,YAC1BL,MAAM,QAAQ,CAACW;QAInBX,MAAM,QAAQ,CAAC;IACnB,GACA;QAACA,MAAM,QAAQ;KAAC;IAGpB,OAAO,WAAP,GACI,oBAACgB,aAAWA;QACR,UAAUF;QACV,QAAQb;QACR,QAAQ,CAACA;QACT,SAASM;QACT,QAAQ,CAAC,EAAEU,eAAe,EAAE,iBACxB,wDACI,oBAACC,YAAUA;gBACP,OAAOZ;gBACP,aAAaH;gBACb,YAAYO;gBACZ,WAAWR;gBACX,UAAUE;gBACV,OAAOO,QAAQQ,SAAS,aAAa,CAACR,MAAM,GAAG,IAAI;gBACnD,cAAcM;gBACd,cAAc,IAAMH,SAAS;gBAC7B,mBAAmBN;gBACnB,eAAeC;gBACf,SAASG;gBACT,MAAMC;;;AAM9B;AAEA,qCAAed"}

package/components/SplitView/SplitView.js

@@ -1,65 +1,55 @@
-import * as React from "react";
-import { cn, Separator } from "@webiny/admin-ui";
+import { Separator, cn } from "@webiny/admin-ui";
 import { Panel, PanelGroup, PanelResizeHandle } from "../ResizablePanels/index.js";
 import { useLocalStorage, useLocalStorageValue } from "@webiny/app";
-import { useCallback } from "react";
-export const SplitView = ({
-  children,
-  className,
-  namespace = "splitView",
-  ...props
-}) => {
-  const localStorage = useLocalStorage();
-  const layout = useLocalStorageValue(namespace);
-  const saveLayout = useCallback(layout => {
-    localStorage.set(`${namespace}/panels`, layout);
-  }, [localStorage, namespace]);
-  return /*#__PURE__*/React.createElement(PanelGroup, Object.assign({
-    id: namespace,
-    defaultLayout: layout,
-    className: cn("webiny-split-view", className),
-    onLayoutChanged: saveLayout
-  }, props), children);
+import * as __rspack_external_react from "react";
+const SplitView = ({ children, className, namespace = "splitView", ...props })=>{
+    const localStorage = useLocalStorage();
+    const layout = useLocalStorageValue(namespace);
+    const saveLayout = (0, __rspack_external_react.useCallback)((layout)=>{
+        localStorage.set(`${namespace}/panels`, layout);
+    }, [
+        localStorage,
+        namespace
+    ]);
+    return /*#__PURE__*/ __rspack_external_react.createElement(PanelGroup, {
+        id: namespace,
+        defaultLayout: layout,
+        className: cn("webiny-split-view", className),
+        onLayoutChanged: saveLayout,
+        ...props
+    }, children);
 };
-
-// Get the default size for the panel:
-const getDefaultSize = span => {
-  const spanValue = typeof span === "number" && span > 0 && span <= 12 ? span : 6;
-  return spanValue / 12 * 100;
+const getDefaultSize = (span)=>{
+    const spanValue = "number" == typeof span && span > 0 && span <= 12 ? span : 6;
+    return spanValue / 12 * 100;
 };
-export const LeftPanel = ({
-  children,
-  className,
-  ...props
-}) => {
-  const defaultSize = props.defaultSize ?? getDefaultSize(props.span || 5);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Panel, Object.assign({
-    defaultSize: defaultSize,
-    minSize: 10,
-    id: "leftPanel",
-    className: cn("webiny-split-view__right-panel", className)
-  }, props), children), /*#__PURE__*/React.createElement(PanelResizeHandle, {
-    className: "outline-0"
-  }, /*#__PURE__*/React.createElement(Separator, {
-    orientation: "vertical"
-  })));
+const LeftPanel = ({ children, className, ...props })=>{
+    const defaultSize = props.defaultSize ?? getDefaultSize(props.span || 5);
+    return /*#__PURE__*/ __rspack_external_react.createElement(__rspack_external_react.Fragment, null, /*#__PURE__*/ __rspack_external_react.createElement(Panel, {
+        defaultSize: defaultSize,
+        minSize: 10,
+        id: "leftPanel",
+        className: cn("webiny-split-view__right-panel", className),
+        ...props
+    }, children), /*#__PURE__*/ __rspack_external_react.createElement(PanelResizeHandle, {
+        className: "outline-0"
+    }, /*#__PURE__*/ __rspack_external_react.createElement(Separator, {
+        orientation: "vertical"
+    })));
 };
-export const RightPanel = ({
-  children,
-  className,
-  ...props
-}) => {
-  const defaultSize = props.defaultSize ?? getDefaultSize(props.span || 7);
-  return /*#__PURE__*/React.createElement(Panel, Object.assign({
-    defaultSize: defaultSize,
-    minSize: 30,
-    id: "rightPanel",
-    className: cn("overflow-scroll! webiny-split-view__right-panel", className)
-  }, props, {
-    style: {
-      overflowY: "scroll"
-    }
-  }), children);
+const RightPanel = ({ children, className, ...props })=>{
+    const defaultSize = props.defaultSize ?? getDefaultSize(props.span || 7);
+    return /*#__PURE__*/ __rspack_external_react.createElement(Panel, {
+        defaultSize: defaultSize,
+        minSize: 30,
+        id: "rightPanel",
+        className: cn("overflow-scroll! webiny-split-view__right-panel", className),
+        ...props,
+        style: {
+            overflowY: "scroll"
+        }
+    }, children);
 };
+export { LeftPanel, RightPanel, SplitView };
 
 //# sourceMappingURL=SplitView.js.map

package/components/SplitView/SplitView.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","cn","Separator","Panel","PanelGroup","PanelResizeHandle","useLocalStorage","useLocalStorageValue","useCallback","SplitView","children","className","namespace","props","localStorage","layout","saveLayout","set","createElement","Object","assign","id","defaultLayout","onLayoutChanged","getDefaultSize","span","spanValue","LeftPanel","defaultSize","Fragment","minSize","orientation","RightPanel","style","overflowY"],"sources":["SplitView.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { ColumnProps } from \"@webiny/admin-ui\";\nimport { cn, Separator } from \"@webiny/admin-ui\";\nimport type { PanelProps, PanelGroupProps } from \"~/components/ResizablePanels/index.js\";\nimport {\n    Panel,\n    PanelGroup,\n    PanelResizeHandle,\n    type Layout\n} from \"~/components/ResizablePanels/index.js\";\nimport { useLocalStorage, useLocalStorageValue } from \"@webiny/app\";\nimport { useCallback } from \"react\";\n\ninterface SplitViewProps extends Omit<PanelGroupProps, \"id\"> {\n    namespace?: string;\n}\n\nexport const SplitView = ({\n    children,\n    className,\n    namespace = \"splitView\",\n    ...props\n}: SplitViewProps) => {\n    const localStorage = useLocalStorage();\n\n    const layout = useLocalStorageValue<Layout>(namespace);\n\n    const saveLayout = useCallback(\n        (layout: Layout) => {\n            localStorage.set(`${namespace}/panels`, layout);\n        },\n        [localStorage, namespace]\n    );\n\n    return (\n        <PanelGroup\n            id={namespace}\n            defaultLayout={layout}\n            className={cn(\"webiny-split-view\", className)}\n            onLayoutChanged={saveLayout}\n            {...props}\n        >\n            {children}\n        </PanelGroup>\n    );\n};\n\n// Get the default size for the panel:\nconst getDefaultSize = (span: ColumnProps[\"span\"]) => {\n    const spanValue = typeof span === \"number\" && span > 0 && span <= 12 ? span : 6;\n    return (spanValue / 12) * 100;\n};\n\ninterface SplitViewPanelProps extends Omit<PanelProps, \"id\"> {\n    span?: ColumnProps[\"span\"];\n}\n\nexport const LeftPanel = ({ children, className, ...props }: SplitViewPanelProps) => {\n    const defaultSize = props.defaultSize ?? getDefaultSize(props.span || 5);\n\n    return (\n        <>\n            <Panel\n                defaultSize={defaultSize}\n                minSize={10}\n                id=\"leftPanel\"\n                className={cn(\"webiny-split-view__right-panel\", className)}\n                {...props}\n            >\n                {children}\n            </Panel>\n            <PanelResizeHandle className={\"outline-0\"}>\n                <Separator orientation={\"vertical\"} />\n            </PanelResizeHandle>\n        </>\n    );\n};\n\nexport const RightPanel = ({ children, className, ...props }: SplitViewPanelProps) => {\n    const defaultSize = props.defaultSize ?? getDefaultSize(props.span || 7);\n\n    return (\n        <Panel\n            defaultSize={defaultSize}\n            minSize={30}\n            id=\"rightPanel\"\n            className={cn(\"overflow-scroll! webiny-split-view__right-panel\", className)}\n            {...props}\n            style={{ overflowY: \"scroll\" }}\n        >\n            {children}\n        </Panel>\n    );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,EAAE,EAAEC,SAAS,QAAQ,kBAAkB;AAEhD,SACIC,KAAK,EACLC,UAAU,EACVC,iBAAiB;AAGrB,SAASC,eAAe,EAAEC,oBAAoB,QAAQ,aAAa;AACnE,SAASC,WAAW,QAAQ,OAAO;AAMnC,OAAO,MAAMC,SAAS,GAAGA,CAAC;EACtBC,QAAQ;EACRC,SAAS;EACTC,SAAS,GAAG,WAAW;EACvB,GAAGC;AACS,CAAC,KAAK;EAClB,MAAMC,YAAY,GAAGR,eAAe,CAAC,CAAC;EAEtC,MAAMS,MAAM,GAAGR,oBAAoB,CAASK,SAAS,CAAC;EAEtD,MAAMI,UAAU,GAAGR,WAAW,CACzBO,MAAc,IAAK;IAChBD,YAAY,CAACG,GAAG,CAAC,GAAGL,SAAS,SAAS,EAAEG,MAAM,CAAC;EACnD,CAAC,EACD,CAACD,YAAY,EAAEF,SAAS,CAC5B,CAAC;EAED,oBACIZ,KAAA,CAAAkB,aAAA,CAACd,UAAU,EAAAe,MAAA,CAAAC,MAAA;IACPC,EAAE,EAAET,SAAU;IACdU,aAAa,EAAEP,MAAO;IACtBJ,SAAS,EAAEV,EAAE,CAAC,mBAAmB,EAAEU,SAAS,CAAE;IAC9CY,eAAe,EAAEP;EAAW,GACxBH,KAAK,GAERH,QACO,CAAC;AAErB,CAAC;;AAED;AACA,MAAMc,cAAc,GAAIC,IAAyB,IAAK;EAClD,MAAMC,SAAS,GAAG,OAAOD,IAAI,KAAK,QAAQ,IAAIA,IAAI,GAAG,CAAC,IAAIA,IAAI,IAAI,EAAE,GAAGA,IAAI,GAAG,CAAC;EAC/E,OAAQC,SAAS,GAAG,EAAE,GAAI,GAAG;AACjC,CAAC;AAMD,OAAO,MAAMC,SAAS,GAAGA,CAAC;EAAEjB,QAAQ;EAAEC,SAAS;EAAE,GAAGE;AAA2B,CAAC,KAAK;EACjF,MAAMe,WAAW,GAAGf,KAAK,CAACe,WAAW,IAAIJ,cAAc,CAACX,KAAK,CAACY,IAAI,IAAI,CAAC,CAAC;EAExE,oBACIzB,KAAA,CAAAkB,aAAA,CAAAlB,KAAA,CAAA6B,QAAA,qBACI7B,KAAA,CAAAkB,aAAA,CAACf,KAAK,EAAAgB,MAAA,CAAAC,MAAA;IACFQ,WAAW,EAAEA,WAAY;IACzBE,OAAO,EAAE,EAAG;IACZT,EAAE,EAAC,WAAW;IACdV,SAAS,EAAEV,EAAE,CAAC,gCAAgC,EAAEU,SAAS;EAAE,GACvDE,KAAK,GAERH,QACE,CAAC,eACRV,KAAA,CAAAkB,aAAA,CAACb,iBAAiB;IAACM,SAAS,EAAE;EAAY,gBACtCX,KAAA,CAAAkB,aAAA,CAAChB,SAAS;IAAC6B,WAAW,EAAE;EAAW,CAAE,CACtB,CACrB,CAAC;AAEX,CAAC;AAED,OAAO,MAAMC,UAAU,GAAGA,CAAC;EAAEtB,QAAQ;EAAEC,SAAS;EAAE,GAAGE;AAA2B,CAAC,KAAK;EAClF,MAAMe,WAAW,GAAGf,KAAK,CAACe,WAAW,IAAIJ,cAAc,CAACX,KAAK,CAACY,IAAI,IAAI,CAAC,CAAC;EAExE,oBACIzB,KAAA,CAAAkB,aAAA,CAACf,KAAK,EAAAgB,MAAA,CAAAC,MAAA;IACFQ,WAAW,EAAEA,WAAY;IACzBE,OAAO,EAAE,EAAG;IACZT,EAAE,EAAC,YAAY;IACfV,SAAS,EAAEV,EAAE,CAAC,iDAAiD,EAAEU,SAAS;EAAE,GACxEE,KAAK;IACToB,KAAK,EAAE;MAAEC,SAAS,EAAE;IAAS;EAAE,IAE9BxB,QACE,CAAC;AAEhB,CAAC","ignoreList":[]}
+{"version":3,"file":"components/SplitView/SplitView.js","sources":["../../../src/components/SplitView/SplitView.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { ColumnProps } from \"@webiny/admin-ui\";\nimport { cn, Separator } from \"@webiny/admin-ui\";\nimport type { PanelProps, PanelGroupProps } from \"~/components/ResizablePanels/index.js\";\nimport {\n    Panel,\n    PanelGroup,\n    PanelResizeHandle,\n    type Layout\n} from \"~/components/ResizablePanels/index.js\";\nimport { useLocalStorage, useLocalStorageValue } from \"@webiny/app\";\nimport { useCallback } from \"react\";\n\ninterface SplitViewProps extends Omit<PanelGroupProps, \"id\"> {\n    namespace?: string;\n}\n\nexport const SplitView = ({\n    children,\n    className,\n    namespace = \"splitView\",\n    ...props\n}: SplitViewProps) => {\n    const localStorage = useLocalStorage();\n\n    const layout = useLocalStorageValue<Layout>(namespace);\n\n    const saveLayout = useCallback(\n        (layout: Layout) => {\n            localStorage.set(`${namespace}/panels`, layout);\n        },\n        [localStorage, namespace]\n    );\n\n    return (\n        <PanelGroup\n            id={namespace}\n            defaultLayout={layout}\n            className={cn(\"webiny-split-view\", className)}\n            onLayoutChanged={saveLayout}\n            {...props}\n        >\n            {children}\n        </PanelGroup>\n    );\n};\n\n// Get the default size for the panel:\nconst getDefaultSize = (span: ColumnProps[\"span\"]) => {\n    const spanValue = typeof span === \"number\" && span > 0 && span <= 12 ? span : 6;\n    return (spanValue / 12) * 100;\n};\n\ninterface SplitViewPanelProps extends Omit<PanelProps, \"id\"> {\n    span?: ColumnProps[\"span\"];\n}\n\nexport const LeftPanel = ({ children, className, ...props }: SplitViewPanelProps) => {\n    const defaultSize = props.defaultSize ?? getDefaultSize(props.span || 5);\n\n    return (\n        <>\n            <Panel\n                defaultSize={defaultSize}\n                minSize={10}\n                id=\"leftPanel\"\n                className={cn(\"webiny-split-view__right-panel\", className)}\n                {...props}\n            >\n                {children}\n            </Panel>\n            <PanelResizeHandle className={\"outline-0\"}>\n                <Separator orientation={\"vertical\"} />\n            </PanelResizeHandle>\n        </>\n    );\n};\n\nexport const RightPanel = ({ children, className, ...props }: SplitViewPanelProps) => {\n    const defaultSize = props.defaultSize ?? getDefaultSize(props.span || 7);\n\n    return (\n        <Panel\n            defaultSize={defaultSize}\n            minSize={30}\n            id=\"rightPanel\"\n            className={cn(\"overflow-scroll! webiny-split-view__right-panel\", className)}\n            {...props}\n            style={{ overflowY: \"scroll\" }}\n        >\n            {children}\n        </Panel>\n    );\n};\n"],"names":["SplitView","children","className","namespace","props","localStorage","useLocalStorage","layout","useLocalStorageValue","saveLayout","useCallback","PanelGroup","cn","getDefaultSize","span","spanValue","LeftPanel","defaultSize","Panel","PanelResizeHandle","Separator","RightPanel"],"mappings":";;;;AAiBO,MAAMA,YAAY,CAAC,EACtBC,QAAQ,EACRC,SAAS,EACTC,YAAY,WAAW,EACvB,GAAGC,OACU;IACb,MAAMC,eAAeC;IAErB,MAAMC,SAASC,qBAA6BL;IAE5C,MAAMM,aAAaC,AAAAA,IAAAA,wBAAAA,WAAAA,AAAAA,EACf,CAACH;QACGF,aAAa,GAAG,CAAC,GAAGF,UAAU,OAAO,CAAC,EAAEI;IAC5C,GACA;QAACF;QAAcF;KAAU;IAG7B,OAAO,WAAP,GACI,sCAACQ,YAAUA;QACP,IAAIR;QACJ,eAAeI;QACf,WAAWK,GAAG,qBAAqBV;QACnC,iBAAiBO;QAChB,GAAGL,KAAK;OAERH;AAGb;AAGA,MAAMY,iBAAiB,CAACC;IACpB,MAAMC,YAAY,AAAgB,YAAhB,OAAOD,QAAqBA,OAAO,KAAKA,QAAQ,KAAKA,OAAO;IAC9E,OAAQC,YAAY,KAAM;AAC9B;AAMO,MAAMC,YAAY,CAAC,EAAEf,QAAQ,EAAEC,SAAS,EAAE,GAAGE,OAA4B;IAC5E,MAAMa,cAAcb,MAAM,WAAW,IAAIS,eAAeT,MAAM,IAAI,IAAI;IAEtE,OAAO,WAAP,GACI,4FACI,sCAACc,OAAKA;QACF,aAAaD;QACb,SAAS;QACT,IAAG;QACH,WAAWL,GAAG,kCAAkCV;QAC/C,GAAGE,KAAK;OAERH,WAAAA,WAAAA,GAEL,sCAACkB,mBAAiBA;QAAC,WAAW;qBAC1B,sCAACC,WAASA;QAAC,aAAa;;AAIxC;AAEO,MAAMC,aAAa,CAAC,EAAEpB,QAAQ,EAAEC,SAAS,EAAE,GAAGE,OAA4B;IAC7E,MAAMa,cAAcb,MAAM,WAAW,IAAIS,eAAeT,MAAM,IAAI,IAAI;IAEtE,OAAO,WAAP,GACI,sCAACc,OAAKA;QACF,aAAaD;QACb,SAAS;QACT,IAAG;QACH,WAAWL,GAAG,mDAAmDV;QAChE,GAAGE,KAAK;QACT,OAAO;YAAE,WAAW;QAAS;OAE5BH;AAGb"}

package/components/SplitView/index.js

@@ -1,3 +1 @@
-export { SplitView, LeftPanel, RightPanel } from "./SplitView.js";
-
-//# sourceMappingURL=index.js.map
+export { LeftPanel, RightPanel, SplitView } from "./SplitView.js";

package/components/TeamAutocomplete/graphql.js

@@ -1,5 +1,5 @@
-import gql from "graphql-tag";
-export const LIST_TEAMS = gql`
+import graphql_tag from "graphql-tag";
+const LIST_TEAMS = graphql_tag`
     query listTeams {
         security {
             teams: listTeams {
@@ -14,5 +14,6 @@ export const LIST_TEAMS = gql`
         }
     }
 `;
+export { LIST_TEAMS };
 
 //# sourceMappingURL=graphql.js.map

package/components/TeamAutocomplete/graphql.js.map

@@ -1 +1 @@
-{"version":3,"names":["gql","LIST_TEAMS"],"sources":["graphql.ts"],"sourcesContent":["import gql from \"graphql-tag\";\n\nexport const LIST_TEAMS = gql`\n    query listTeams {\n        security {\n            teams: listTeams {\n                data {\n                    id\n                    slug\n                    name\n                    description\n                    createdOn\n                }\n            }\n        }\n    }\n`;\n"],"mappings":"AAAA,OAAOA,GAAG,MAAM,aAAa;AAE7B,OAAO,MAAMC,UAAU,GAAGD,GAAG;AAC7B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
+{"version":3,"file":"components/TeamAutocomplete/graphql.js","sources":["../../../src/components/TeamAutocomplete/graphql.ts"],"sourcesContent":["import gql from \"graphql-tag\";\n\nexport const LIST_TEAMS = gql`\n    query listTeams {\n        security {\n            teams: listTeams {\n                data {\n                    id\n                    slug\n                    name\n                    description\n                    createdOn\n                }\n            }\n        }\n    }\n`;\n"],"names":["LIST_TEAMS","gql"],"mappings":";AAEO,MAAMA,aAAaC,WAAG,CAAC;;;;;;;;;;;;;;AAc9B,CAAC"}

package/components/TeamAutocomplete/index.d.ts

@@ -1,5 +1,7 @@
 import React from "react";
-import type { AutoCompleteProps } from "@webiny/ui/AutoComplete/index.js";
-type TeamAutocompleteProps = Partial<AutoCompleteProps>;
-export declare const TeamAutocomplete: (props: TeamAutocompleteProps) => React.JSX.Element;
+import { AutoComplete } from "@webiny/admin-ui";
+type TeamAutocompleteProps = Omit<React.ComponentProps<typeof AutoComplete>, "options" | "onValueChange"> & {
+    onChange?: (value: string) => void;
+};
+export declare const TeamAutocomplete: ({ onChange, value, ...props }: TeamAutocompleteProps) => React.JSX.Element;
 export {};

package/components/TeamAutocomplete/index.js

@@ -1,18 +1,26 @@
-import React from "react";
-import { AutoComplete } from "@webiny/ui/AutoComplete/index.js";
+import react, { useCallback, useMemo } from "react";
+import { AutoComplete } from "@webiny/admin-ui";
 import { LIST_TEAMS } from "./graphql.js";
 import { useQuery } from "@apollo/react-hooks";
-export const TeamAutocomplete = props => {
-  const {
-    data,
-    loading
-  } = useQuery(LIST_TEAMS);
-  const options = loading || !data ? [] : data.security.teams.data;
-  return /*#__PURE__*/React.createElement(AutoComplete, Object.assign({}, props, {
-    options: options,
-    valueProp: "id",
-    value: loading ? undefined : props.value
-  }));
+const TeamAutocomplete = ({ onChange, value, ...props })=>{
+    const { data, loading } = useQuery(LIST_TEAMS);
+    const rawOptions = loading || !data ? [] : data.security.teams.data;
+    const options = useMemo(()=>rawOptions.map((team)=>({
+                label: team.name,
+                value: team.id
+            })), [
+        rawOptions
+    ]);
+    const onValueChange = useCallback((id)=>onChange?.(id), [
+        onChange
+    ]);
+    return /*#__PURE__*/ react.createElement(AutoComplete, {
+        ...props,
+        options: options,
+        value: loading ? void 0 : value,
+        onValueChange: onValueChange
+    });
 };
+export { TeamAutocomplete };
 
 //# sourceMappingURL=index.js.map

package/components/TeamAutocomplete/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","AutoComplete","LIST_TEAMS","useQuery","TeamAutocomplete","props","data","loading","options","security","teams","createElement","Object","assign","valueProp","value","undefined"],"sources":["index.tsx"],"sourcesContent":["import React from \"react\";\nimport type { AutoCompleteProps } from \"@webiny/ui/AutoComplete/index.js\";\nimport { AutoComplete } from \"@webiny/ui/AutoComplete/index.js\";\nimport { LIST_TEAMS } from \"./graphql.js\";\nimport { useQuery } from \"@apollo/react-hooks\";\n\ntype TeamAutocompleteProps = Partial<AutoCompleteProps>;\nexport const TeamAutocomplete = (props: TeamAutocompleteProps) => {\n    const { data, loading } = useQuery(LIST_TEAMS);\n\n    const options = loading || !data ? [] : data.security.teams.data;\n\n    return (\n        <AutoComplete\n            {...props}\n            options={options}\n            valueProp={\"id\"}\n            value={loading ? undefined : props.value}\n        />\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,YAAY,QAAQ,kCAAkC;AAC/D,SAASC,UAAU;AACnB,SAASC,QAAQ,QAAQ,qBAAqB;AAG9C,OAAO,MAAMC,gBAAgB,GAAIC,KAA4B,IAAK;EAC9D,MAAM;IAAEC,IAAI;IAAEC;EAAQ,CAAC,GAAGJ,QAAQ,CAACD,UAAU,CAAC;EAE9C,MAAMM,OAAO,GAAGD,OAAO,IAAI,CAACD,IAAI,GAAG,EAAE,GAAGA,IAAI,CAACG,QAAQ,CAACC,KAAK,CAACJ,IAAI;EAEhE,oBACIN,KAAA,CAAAW,aAAA,CAACV,YAAY,EAAAW,MAAA,CAAAC,MAAA,KACLR,KAAK;IACTG,OAAO,EAAEA,OAAQ;IACjBM,SAAS,EAAE,IAAK;IAChBC,KAAK,EAAER,OAAO,GAAGS,SAAS,GAAGX,KAAK,CAACU;EAAM,EAC5C,CAAC;AAEV,CAAC","ignoreList":[]}
+{"version":3,"file":"components/TeamAutocomplete/index.js","sources":["../../../src/components/TeamAutocomplete/index.tsx"],"sourcesContent":["import React, { useMemo, useCallback } from \"react\";\nimport { AutoComplete } from \"@webiny/admin-ui\";\nimport { LIST_TEAMS } from \"./graphql.js\";\nimport { useQuery } from \"@apollo/react-hooks\";\n\ntype TeamAutocompleteProps = Omit<\n    React.ComponentProps<typeof AutoComplete>,\n    \"options\" | \"onValueChange\"\n> & {\n    onChange?: (value: string) => void;\n};\n\nexport const TeamAutocomplete = ({ onChange, value, ...props }: TeamAutocompleteProps) => {\n    const { data, loading } = useQuery(LIST_TEAMS);\n    const rawOptions = loading || !data ? [] : data.security.teams.data;\n\n    const options = useMemo(\n        () => rawOptions.map((team: any) => ({ label: team.name, value: team.id })),\n        [rawOptions]\n    );\n\n    const onValueChange = useCallback((id: string) => onChange?.(id), [onChange]);\n\n    return (\n        <AutoComplete\n            {...props}\n            options={options}\n            value={loading ? undefined : (value as string | undefined)}\n            onValueChange={onValueChange}\n        />\n    );\n};\n"],"names":["TeamAutocomplete","onChange","value","props","data","loading","useQuery","LIST_TEAMS","rawOptions","options","useMemo","team","onValueChange","useCallback","id","AutoComplete","undefined"],"mappings":";;;;AAYO,MAAMA,mBAAmB,CAAC,EAAEC,QAAQ,EAAEC,KAAK,EAAE,GAAGC,OAA8B;IACjF,MAAM,EAAEC,IAAI,EAAEC,OAAO,EAAE,GAAGC,SAASC;IACnC,MAAMC,aAAaH,WAAW,CAACD,OAAO,EAAE,GAAGA,KAAK,QAAQ,CAAC,KAAK,CAAC,IAAI;IAEnE,MAAMK,UAAUC,QACZ,IAAMF,WAAW,GAAG,CAAC,CAACG,OAAe;gBAAE,OAAOA,KAAK,IAAI;gBAAE,OAAOA,KAAK,EAAE;YAAC,KACxE;QAACH;KAAW;IAGhB,MAAMI,gBAAgBC,YAAY,CAACC,KAAeb,WAAWa,KAAK;QAACb;KAAS;IAE5E,OAAO,WAAP,GACI,oBAACc,cAAYA;QACR,GAAGZ,KAAK;QACT,SAASM;QACT,OAAOJ,UAAUW,SAAad;QAC9B,eAAeU;;AAG3B"}

package/components/TeamsMultiAutocomplete/graphql.js

@@ -1,5 +1,5 @@
-import gql from "graphql-tag";
-export const LIST_TEAMS = gql`
+import graphql_tag from "graphql-tag";
+const LIST_TEAMS = graphql_tag`
     query listTeams {
         security {
             teams: listTeams {
@@ -19,5 +19,6 @@ export const LIST_TEAMS = gql`
         }
     }
 `;
+export { LIST_TEAMS };
 
 //# sourceMappingURL=graphql.js.map

package/components/TeamsMultiAutocomplete/graphql.js.map

@@ -1 +1 @@
-{"version":3,"names":["gql","LIST_TEAMS"],"sources":["graphql.ts"],"sourcesContent":["import gql from \"graphql-tag\";\n\nexport const LIST_TEAMS = gql`\n    query listTeams {\n        security {\n            teams: listTeams {\n                data {\n                    id\n                    slug\n                    name\n                    description\n                    createdOn\n                }\n                error {\n                    data\n                    message\n                    code\n                }\n            }\n        }\n    }\n`;\n"],"mappings":"AAAA,OAAOA,GAAG,MAAM,aAAa;AAE7B,OAAO,MAAMC,UAAU,GAAGD,GAAG;AAC7B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
+{"version":3,"file":"components/TeamsMultiAutocomplete/graphql.js","sources":["../../../src/components/TeamsMultiAutocomplete/graphql.ts"],"sourcesContent":["import gql from \"graphql-tag\";\n\nexport const LIST_TEAMS = gql`\n    query listTeams {\n        security {\n            teams: listTeams {\n                data {\n                    id\n                    slug\n                    name\n                    description\n                    createdOn\n                }\n                error {\n                    data\n                    message\n                    code\n                }\n            }\n        }\n    }\n`;\n"],"names":["LIST_TEAMS","gql"],"mappings":";AAEO,MAAMA,aAAaC,WAAG,CAAC;;;;;;;;;;;;;;;;;;;AAmB9B,CAAC"}

package/components/TeamsMultiAutocomplete/index.d.ts

@@ -1,5 +1,7 @@
 import React from "react";
-import type { MultiAutoCompleteProps } from "@webiny/ui/AutoComplete/index.js";
-type TeamsMultiAutocompleteProps = Partial<MultiAutoCompleteProps>;
-export declare const TeamsMultiAutocomplete: (props: TeamsMultiAutocompleteProps) => React.JSX.Element;
+import { MultiAutoComplete } from "@webiny/admin-ui";
+type TeamsMultiAutocompleteProps = Omit<React.ComponentProps<typeof MultiAutoComplete>, "options" | "onValuesChange"> & {
+    onChange?: (values: string[]) => void;
+};
+export declare const TeamsMultiAutocomplete: ({ onChange, values, ...props }: TeamsMultiAutocompleteProps) => React.JSX.Element;
 export {};

package/components/TeamsMultiAutocomplete/index.js

@@ -1,19 +1,26 @@
-import React from "react";
-import { MultiAutoComplete } from "@webiny/ui/AutoComplete/index.js";
+import react, { useCallback, useMemo } from "react";
+import { MultiAutoComplete } from "@webiny/admin-ui";
 import { LIST_TEAMS } from "./graphql.js";
 import { useQuery } from "@apollo/react-hooks";
-export const TeamsMultiAutocomplete = props => {
-  const {
-    data,
-    loading
-  } = useQuery(LIST_TEAMS);
-  const options = loading || !data?.security?.teams?.data ? [] : data.security.teams.data;
-  return /*#__PURE__*/React.createElement(MultiAutoComplete, Object.assign({}, props, {
-    options: options,
-    valueProp: "id",
-    unique: true,
-    value: loading ? undefined : props.value
-  }));
+const TeamsMultiAutocomplete = ({ onChange, values, ...props })=>{
+    const { data, loading } = useQuery(LIST_TEAMS);
+    const rawOptions = loading || !data?.security?.teams?.data ? [] : data.security.teams.data;
+    const options = useMemo(()=>rawOptions.map((team)=>({
+                label: team.name,
+                value: team.id
+            })), [
+        rawOptions
+    ]);
+    const onValuesChange = useCallback((ids)=>onChange?.(ids), [
+        onChange
+    ]);
+    return /*#__PURE__*/ react.createElement(MultiAutoComplete, {
+        ...props,
+        options: options,
+        values: loading ? void 0 : values,
+        onValuesChange: onValuesChange
+    });
 };
+export { TeamsMultiAutocomplete };
 
 //# sourceMappingURL=index.js.map

package/components/TeamsMultiAutocomplete/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","MultiAutoComplete","LIST_TEAMS","useQuery","TeamsMultiAutocomplete","props","data","loading","options","security","teams","createElement","Object","assign","valueProp","unique","value","undefined"],"sources":["index.tsx"],"sourcesContent":["import React from \"react\";\nimport type { MultiAutoCompleteProps } from \"@webiny/ui/AutoComplete/index.js\";\nimport { MultiAutoComplete } from \"@webiny/ui/AutoComplete/index.js\";\nimport { LIST_TEAMS } from \"./graphql.js\";\nimport { useQuery } from \"@apollo/react-hooks\";\n\ntype TeamsMultiAutocompleteProps = Partial<MultiAutoCompleteProps>;\n\nexport const TeamsMultiAutocomplete = (props: TeamsMultiAutocompleteProps) => {\n    const { data, loading } = useQuery(LIST_TEAMS);\n\n    const options = loading || !data?.security?.teams?.data ? [] : data.security.teams.data;\n\n    return (\n        <MultiAutoComplete\n            {...props}\n            options={options}\n            valueProp={\"id\"}\n            unique={true}\n            value={loading ? undefined : props.value}\n        />\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,iBAAiB,QAAQ,kCAAkC;AACpE,SAASC,UAAU;AACnB,SAASC,QAAQ,QAAQ,qBAAqB;AAI9C,OAAO,MAAMC,sBAAsB,GAAIC,KAAkC,IAAK;EAC1E,MAAM;IAAEC,IAAI;IAAEC;EAAQ,CAAC,GAAGJ,QAAQ,CAACD,UAAU,CAAC;EAE9C,MAAMM,OAAO,GAAGD,OAAO,IAAI,CAACD,IAAI,EAAEG,QAAQ,EAAEC,KAAK,EAAEJ,IAAI,GAAG,EAAE,GAAGA,IAAI,CAACG,QAAQ,CAACC,KAAK,CAACJ,IAAI;EAEvF,oBACIN,KAAA,CAAAW,aAAA,CAACV,iBAAiB,EAAAW,MAAA,CAAAC,MAAA,KACVR,KAAK;IACTG,OAAO,EAAEA,OAAQ;IACjBM,SAAS,EAAE,IAAK;IAChBC,MAAM,EAAE,IAAK;IACbC,KAAK,EAAET,OAAO,GAAGU,SAAS,GAAGZ,KAAK,CAACW;EAAM,EAC5C,CAAC;AAEV,CAAC","ignoreList":[]}
+{"version":3,"file":"components/TeamsMultiAutocomplete/index.js","sources":["../../../src/components/TeamsMultiAutocomplete/index.tsx"],"sourcesContent":["import React, { useMemo, useCallback } from \"react\";\nimport { MultiAutoComplete } from \"@webiny/admin-ui\";\nimport { LIST_TEAMS } from \"./graphql.js\";\nimport { useQuery } from \"@apollo/react-hooks\";\n\ntype TeamsMultiAutocompleteProps = Omit<\n    React.ComponentProps<typeof MultiAutoComplete>,\n    \"options\" | \"onValuesChange\"\n> & {\n    onChange?: (values: string[]) => void;\n};\n\nexport const TeamsMultiAutocomplete = ({\n    onChange,\n    values,\n    ...props\n}: TeamsMultiAutocompleteProps) => {\n    const { data, loading } = useQuery(LIST_TEAMS);\n    const rawOptions = loading || !data?.security?.teams?.data ? [] : data.security.teams.data;\n\n    const options = useMemo(\n        () => rawOptions.map((team: any) => ({ label: team.name, value: team.id })),\n        [rawOptions]\n    );\n\n    const onValuesChange = useCallback((ids: string[]) => onChange?.(ids), [onChange]);\n\n    return (\n        <MultiAutoComplete\n            {...props}\n            options={options}\n            values={loading ? undefined : (values as string[] | undefined)}\n            onValuesChange={onValuesChange}\n        />\n    );\n};\n"],"names":["TeamsMultiAutocomplete","onChange","values","props","data","loading","useQuery","LIST_TEAMS","rawOptions","options","useMemo","team","onValuesChange","useCallback","ids","MultiAutoComplete","undefined"],"mappings":";;;;AAYO,MAAMA,yBAAyB,CAAC,EACnCC,QAAQ,EACRC,MAAM,EACN,GAAGC,OACuB;IAC1B,MAAM,EAAEC,IAAI,EAAEC,OAAO,EAAE,GAAGC,SAASC;IACnC,MAAMC,aAAaH,WAAW,CAACD,MAAM,UAAU,OAAO,OAAO,EAAE,GAAGA,KAAK,QAAQ,CAAC,KAAK,CAAC,IAAI;IAE1F,MAAMK,UAAUC,QACZ,IAAMF,WAAW,GAAG,CAAC,CAACG,OAAe;gBAAE,OAAOA,KAAK,IAAI;gBAAE,OAAOA,KAAK,EAAE;YAAC,KACxE;QAACH;KAAW;IAGhB,MAAMI,iBAAiBC,YAAY,CAACC,MAAkBb,WAAWa,MAAM;QAACb;KAAS;IAEjF,OAAO,WAAP,GACI,oBAACc,mBAAiBA;QACb,GAAGZ,KAAK;QACT,SAASM;QACT,QAAQJ,UAAUW,SAAad;QAC/B,gBAAgBU;;AAG5B"}

package/components/Wcp.js

@@ -1,48 +1,37 @@
-import React from "react";
+import react from "react";
 import { useWcp } from "../presentation/wcp/useWcp.js";
-function CanUseMultiTenancy({
-  children
-}) {
-  const wcp = useWcp();
-  return wcp.canUseFeature("multiTenancy") ? /*#__PURE__*/React.createElement(React.Fragment, null, children) : null;
+function CanUseMultiTenancy({ children }) {
+    const wcp = useWcp();
+    return wcp.canUseFeature("multiTenancy") ? /*#__PURE__*/ react.createElement(react.Fragment, null, children) : null;
 }
-function CanUseTeams({
-  children
-}) {
-  const wcp = useWcp();
-  return wcp.canUseTeams() ? /*#__PURE__*/React.createElement(React.Fragment, null, children) : null;
+function CanUseTeams({ children }) {
+    const wcp = useWcp();
+    return wcp.canUseTeams() ? /*#__PURE__*/ react.createElement(react.Fragment, null, children) : null;
 }
-function CanUsePrivateFiles({
-  children
-}) {
-  const wcp = useWcp();
-  return wcp.canUsePrivateFiles() ? /*#__PURE__*/React.createElement(React.Fragment, null, children) : null;
+function CanUsePrivateFiles({ children }) {
+    const wcp = useWcp();
+    return wcp.canUsePrivateFiles() ? /*#__PURE__*/ react.createElement(react.Fragment, null, children) : null;
 }
-function CanUseFileManagerThreatDetection({
-  children
-}) {
-  const wcp = useWcp();
-  return wcp.canUseFileManagerThreatDetection() ? /*#__PURE__*/React.createElement(React.Fragment, null, children) : null;
+function CanUseFileManagerThreatDetection({ children }) {
+    const wcp = useWcp();
+    return wcp.canUseFileManagerThreatDetection() ? /*#__PURE__*/ react.createElement(react.Fragment, null, children) : null;
 }
-function CanUseWorkflows({
-  children
-}) {
-  const wcp = useWcp();
-  return wcp.canUseWorkflows() ? /*#__PURE__*/React.createElement(React.Fragment, null, children) : null;
+function CanUseWorkflows({ children }) {
+    const wcp = useWcp();
+    return wcp.canUseWorkflows() ? /*#__PURE__*/ react.createElement(react.Fragment, null, children) : null;
 }
-function CanUseHcmsFieldPermissions({
-  children
-}) {
-  const wcp = useWcp();
-  return wcp.canUseHcmsFieldPermissions() ? /*#__PURE__*/React.createElement(React.Fragment, null, children) : null;
+function CanUseHcmsFieldPermissions({ children }) {
+    const wcp = useWcp();
+    return wcp.canUseHcmsFieldPermissions() ? /*#__PURE__*/ react.createElement(react.Fragment, null, children) : null;
 }
-export const Wcp = {
-  CanUseMultiTenancy,
-  CanUseTeams,
-  CanUsePrivateFiles,
-  CanUseFileManagerThreatDetection,
-  CanUseWorkflows,
-  CanUseHcmsFieldPermissions
+const Wcp = {
+    CanUseMultiTenancy: CanUseMultiTenancy,
+    CanUseTeams: CanUseTeams,
+    CanUsePrivateFiles: CanUsePrivateFiles,
+    CanUseFileManagerThreatDetection: CanUseFileManagerThreatDetection,
+    CanUseWorkflows: CanUseWorkflows,
+    CanUseHcmsFieldPermissions: CanUseHcmsFieldPermissions
 };
+export { Wcp };
 
 //# sourceMappingURL=Wcp.js.map