@webiny/app-admin 5.24.0 → 5.25.0-beta.2

package/plugins/globalSearch/SearchBar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["SearchBar.tsx"],"names":["React","set","useRouter","Downshift","plugins","classnames","Hotkeys","Icon","Elevation","SearchBarDropdown","ReactComponent","SearchIcon","SearchBarWrapper","SearchBarInputWrapper","SearchShortcut","searchBarInput","icon","searchWrapper","makeComposable","SearchBar","props","active","searchTerm","previous","current","list","byType","hotKeys","undefined","createRef","e","i","state","length","hotKey","preventOpen","preventDefault","input","focus","plugin","setState","newState","query","URLSearchParams","search","JSON","stringify","history","push","pathname","route","toString","find","p","location","parse","get","downshift","item","label","downshiftProps","isOpen","openMenu","closeMenu","getInputProps","width","esc","document","activeElement","blur","handleOpenHotkey","cancelSearchTerm","enter","setTimeout","selectedItem","submitSearchTerm","placeholder","className","ref","value","onClick","onBlur","onFocus","onChange","target","Component","SearchBarContainer","routerProps"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { set } from \"dot-prop-immutable\";\nimport { useRouter, UseRouter } from \"@webiny/react-router\";\nimport Downshift from \"downshift\";\nimport { plugins } from \"@webiny/plugins\";\nimport { AdminGlobalSearchPlugin, AdminGlobalSearchPreventHotkeyPlugin } from \"~/types\";\nimport classnames from \"classnames\";\n/**\n * Package react-hotkeyz does not have types.\n */\n// @ts-ignore\nimport { Hotkeys } from \"react-hotkeyz\";\n\n// UI components\nimport { Icon } from \"@webiny/ui/Icon\";\nimport { Elevation } from \"@webiny/ui/Elevation\";\nimport SearchBarDropdown from \"./SearchBarDropdown\";\n\n// Icons\nimport { ReactComponent as SearchIcon } from \"./icons/round-search-24px.svg\";\n\n// Local components\nimport {\n    SearchBarWrapper,\n    SearchBarInputWrapper,\n    SearchShortcut,\n    searchBarInput,\n    icon,\n    searchWrapper\n} from \"./styled\";\nimport { makeComposable } from \"~/index\";\n\ntype SearchBarProps = UseRouter;\n\nexport interface SearchBarState {\n    active: boolean;\n    searchTerm: { previous: string; current: string };\n    plugins: {\n        list: ReadonlyArray<AdminGlobalSearchPlugin>;\n        hotKeys: ReadonlyArray<AdminGlobalSearchPreventHotkeyPlugin>;\n        current?: AdminGlobalSearchPlugin;\n    };\n}\n\nclass SearchBar extends React.Component<SearchBarProps, SearchBarState> {\n    public override state: SearchBarState = {\n        active: false,\n        searchTerm: {\n            previous: \"\",\n            current: \"\"\n        },\n        plugins: {\n            // List of all registered \"admin-global-search\" plugins.\n            get list() {\n                return plugins.byType<AdminGlobalSearchPlugin>(\"admin-global-search\");\n            },\n            hotKeys: plugins.byType<AdminGlobalSearchPreventHotkeyPlugin>(\n                \"admin-global-search-prevent-hotkey\"\n            ),\n            // Current plugin - set by examining current route and its query params (on construct).\n            current: undefined\n        }\n    };\n\n    /**\n     * Helps us trigger some of the downshift's methods (eg. clearSelection) and helps us to avoid adding state.\n     */\n    public readonly downshift: any = React.createRef();\n\n    /**\n     * At some point we must programmatically focus the input.\n     */\n    private readonly input = React.createRef<HTMLInputElement>();\n\n    /**\n     * Let's check if current route is defined in one of the registered plugins.\n     * If so, then check current route query for search term and set it as default value of search input.\n     * @param props\n     */\n    constructor(props: SearchBarProps) {\n        super(props);\n        this.state.plugins.current = this.state.plugins.list.find(\n            p => p.route === props.location.pathname\n        );\n\n        if (this.state.plugins.current) {\n            let search;\n            const query = new URLSearchParams(props.location.search);\n            try {\n                search = JSON.parse(query.get(\"search\") || \"\").query;\n            } catch (e) {\n                search = query.get(\"search\");\n            }\n\n            this.state.searchTerm.current = search || \"\";\n            this.state.searchTerm.previous = this.state.searchTerm.current;\n        }\n    }\n\n    private readonly handleOpenHotkey = (e: React.KeyboardEvent): void => {\n        for (let i = 0; i < this.state.plugins.hotKeys.length; i++) {\n            const hotKey = this.state.plugins.hotKeys[i];\n            if (hotKey.preventOpen(e)) {\n                return;\n            }\n        }\n\n        e.preventDefault();\n        if (!this.input.current) {\n            return;\n        }\n        this.input.current.focus();\n    };\n\n    /**\n     * Re-routes to given route (provided by the plugin) with needed search query params.\n     * It also manages previous and current search terms and automatically highlighted item in dropdown.\n     * @param plugin\n     */\n    public readonly submitSearchTerm = (plugin: AdminGlobalSearchPlugin): void => {\n        this.setState(\n            state => {\n                const newState = set(state, \"searchTerm.previous\", state.searchTerm.current);\n                return set(newState, \"plugins.current\", plugin) as any;\n            },\n            () => {\n                const query = new URLSearchParams();\n\n                if (this.state.searchTerm.current) {\n                    // If \"search\" key in the plugin was defined, it means SearchInput values were set. Otherwise,\n                    // we need to send the plain string into the \"search\" query param. This behavior was needed\n                    // eg. for pages, since Page entity doesn't use regular SearchInput type, but plain string.\n                    if (plugin.search) {\n                        query.set(\n                            \"search\",\n                            JSON.stringify({\n                                query: this.state.searchTerm.current,\n                                ...plugin.search\n                            })\n                        );\n                    } else {\n                        query.set(\"search\", this.state.searchTerm.current);\n                    }\n                }\n\n                this.props.history.push({\n                    pathname: plugin.route,\n                    search: query.toString()\n                });\n            }\n        );\n    };\n\n    private readonly cancelSearchTerm = (): void => {\n        this.setState(state => {\n            state.searchTerm.current = state.searchTerm.previous;\n            return state;\n        });\n    };\n\n    public override render() {\n        return (\n            <Downshift ref={this.downshift} itemToString={item => item && item.label}>\n                {downshiftProps => {\n                    const { isOpen, openMenu, closeMenu, getInputProps } = downshiftProps;\n\n                    return (\n                        <div style={{ width: \"100%\" }}>\n                            <Hotkeys\n                                zIndex={10}\n                                keys={{\n                                    // @ts-ignore\n                                    esc: () => document.activeElement.blur(),\n                                    \"/\": this.handleOpenHotkey\n                                }}\n                            />\n\n                            <Hotkeys\n                                zIndex={11}\n                                disabled={!isOpen}\n                                keys={{\n                                    esc: () => {\n                                        this.cancelSearchTerm();\n                                        closeMenu();\n                                    },\n                                    enter: () =>\n                                        setTimeout(() => {\n                                            const { selectedItem } = this.downshift.current.state;\n                                            if (selectedItem) {\n                                                closeMenu();\n                                                this.submitSearchTerm(selectedItem);\n                                            }\n                                        })\n                                }}\n                            />\n\n                            <Elevation\n                                className={classnames(searchWrapper, { active: this.state.active })}\n                                z={0}\n                            >\n                                <SearchBarWrapper>\n                                    <SearchBarInputWrapper>\n                                        <Icon className={icon} icon={<SearchIcon />} />\n\n                                        <React.Fragment>\n                                            <input\n                                                {...getInputProps({\n                                                    placeholder: \"Search...\",\n                                                    className: classnames(\n                                                        \"mdc-text-field__input\",\n                                                        searchBarInput\n                                                    ),\n                                                    ref: this.input,\n                                                    value: this.state.searchTerm.current,\n                                                    // @ts-ignore\n                                                    onClick: openMenu,\n                                                    onBlur: () => {\n                                                        this.cancelSearchTerm();\n                                                        this.setState({ active: false });\n                                                    },\n                                                    onFocus: () => {\n                                                        this.setState({ active: true });\n                                                        openMenu();\n                                                    },\n                                                    onChange: (\n                                                        e: React.ChangeEvent<HTMLInputElement>\n                                                    ) => {\n                                                        const value = e.target.value || \"\";\n                                                        this.setState(state => {\n                                                            state.searchTerm.current = value;\n                                                            return state;\n                                                        });\n                                                    }\n                                                })}\n                                            />\n                                        </React.Fragment>\n\n                                        <SearchShortcut>/</SearchShortcut>\n                                    </SearchBarInputWrapper>\n                                </SearchBarWrapper>\n                                {isOpen && <SearchBarDropdown context={this} />}\n                            </Elevation>\n                        </div>\n                    );\n                }}\n            </Downshift>\n        );\n    }\n}\n\nconst SearchBarContainer: React.FC = () => {\n    const routerProps = useRouter();\n\n    return <SearchBar {...routerProps} />;\n};\n\nexport default makeComposable(\"SearchBarContainer\", SearchBarContainer);\n"]}

package/plugins/globalSearch/SearchBarDropdown.d.ts

@@ -2,16 +2,19 @@ import * as React from "react";
 import { AdminGlobalSearchPlugin } from "../../types";
 import { Actions as DownshiftActions, DownshiftState, PropGetters } from "downshift";
 import { SearchBarState } from "./SearchBar";
+interface SearchBarDropdownPropsContextDownshiftCurrent extends DownshiftActions<any>, PropGetters<any> {
+    state: DownshiftState<any>;
+}
+interface SearchBarDropdownPropsContextDownshift {
+    current: SearchBarDropdownPropsContextDownshiftCurrent;
+}
+interface SearchBarDropdownPropsContext {
+    downshift: SearchBarDropdownPropsContextDownshift;
+    submitSearchTerm: (item: AdminGlobalSearchPlugin) => void;
+    state: SearchBarState;
+}
 interface SearchBarDropdownProps {
-    context: {
-        downshift: {
-            current: DownshiftActions<any> & PropGetters<any> & {
-                state: DownshiftState<any>;
-            };
-        };
-        submitSearchTerm: (item: AdminGlobalSearchPlugin) => void;
-        state: SearchBarState;
-    };
+    context: SearchBarDropdownPropsContext;
 }
 export default class SearchBarDropdown extends React.Component<SearchBarDropdownProps> {
     componentDidMount(): void;

package/plugins/globalSearch/SearchBarDropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["SearchBarDropdown.tsx"],"names":["React","classnames","List","ListItem","ListItemGraphic","ListItemText","ListItemMeta","searchBarDropdown","iconSearchType","Elevation","Icon","ReactComponent","SearchIcon","SearchBarDropdown","props","context","downshift","current","plugins","state","selectItem","setHighlightedIndex","list","indexOf","openMenu","submitSearchTerm","searchTerm","getMenuProps","getItemProps","selectedItem","highlightedIndex","map","item","index","itemClassNames","highlighted","selected","route","className","onClick","label","Component"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAASC,IAAT,EAAeC,QAAf,EAAyBC,eAAzB,EAA0CC,YAA1C,EAAwDC,YAAxD,QAA4E,iBAA5E;AACA,SAASC,iBAAT,EAA4BC,cAA5B;AACA,SAASC,SAAT,QAA0B,sBAA1B;AACA,SAASC,IAAT,QAAqB,iBAArB;AAEA,SAASC,cAAc,IAAIC,UAA3B;;IAmBqBC,iB;;;;;;;;;;;;;WACjB,6BAAoC;AAChC,gCAKI,KAAKC,KALT,CACIC,OADJ;AAAA,UAE8BC,SAF9B,uBAEQA,SAFR,CAEqBC,OAFrB;AAAA,UAGiBC,OAHjB,uBAGQC,KAHR,CAGiBD,OAHjB;AAOAF,MAAAA,SAAS,CAACI,UAAV,CAAqBF,OAAO,CAACD,OAA7B;AACAD,MAAAA,SAAS,CAACK,mBAAV,CACIH,OAAO,CAACI,IAAR,CAAaC,OAAb,CAAqBL,OAAO,CAACD,OAA7B,CADJ;AAGAD,MAAAA,SAAS,CAACQ,QAAV;AACH;;;WAED,kBAAyB;AACrB,iCAMI,KAAKV,KANT,CACIC,OADJ;AAAA,UAE8BC,SAF9B,wBAEQA,SAFR,CAEqBC,OAFrB;AAAA,UAGQQ,gBAHR,wBAGQA,gBAHR;AAAA,uDAIQN,KAJR;AAAA,UAIiBD,OAJjB,yBAIiBA,OAJjB;AAAA,UAI0BQ,UAJ1B,yBAI0BA,UAJ1B;AAQA,UACIC,YADJ,GAIIX,SAJJ,CACIW,YADJ;AAAA,UAEIC,YAFJ,GAIIZ,SAJJ,CAEIY,YAFJ;AAAA,6BAIIZ,SAJJ,CAGIG,KAHJ;AAAA,UAGaU,YAHb,oBAGaA,YAHb;AAAA,UAG2BC,gBAH3B,oBAG2BA,gBAH3B;AAMA,0BACI,oBAAC,SAAD;AAAW,QAAA,CAAC,EAAE,CAAd;AAAiB,QAAA,SAAS,EAAEvB;AAA5B,sBACI,oBAAC,IAAD,EAAUoB,YAAY,EAAtB,EACKT,OAAO,CAACI,IAAR,CAAaS,GAAb,CAAiB,UAACC,IAAD,EAAgCC,KAAhC,EAA0C;AACxD;AACA,YAAMC,cAAc,GAAG;AACnBC,UAAAA,WAAW,EAAEL,gBAAgB,KAAKG,KADf;AAEnBG,UAAAA,QAAQ,EAAE;AAFS,SAAvB,CAFwD,CAOxD;;AACA,YAAIP,YAAY,IAAIA,YAAY,KAAKG,IAArC,EAA2C;AACvCE,UAAAA,cAAc,CAACE,QAAf,GAA0B,IAA1B;AACH;;AAED,4BACI,oBAAC,QAAD;AACI,UAAA,GAAG,EAAEJ,IAAI,CAACK;AADd,WAEQT,YAAY,CAAC;AACbK,UAAAA,KAAK,EAALA,KADa;AAEbD,UAAAA,IAAI,EAAJA,IAFa;AAGbM,UAAAA,SAAS,EAAErC,UAAU,CAACiC,cAAD,CAHR;AAIbK,UAAAA,OAAO,EAAE;AAAA,mBAAMd,gBAAgB,CAACO,IAAD,CAAtB;AAAA;AAJI,SAAD,CAFpB,gBASI,oBAAC,eAAD,qBACI,oBAAC,IAAD;AAAM,UAAA,SAAS,EAAExB,cAAjB;AAAiC,UAAA,IAAI,eAAE,oBAAC,UAAD;AAAvC,UADJ,CATJ,eAYI,oBAAC,YAAD,QACKkB,UAAU,CAACT,OAAX,IAAsB,mBAD3B,CAZJ,eAeI,oBAAC,YAAD,eAAkBe,IAAI,CAACQ,KAAvB,CAfJ,CADJ;AAmBH,OA/BA,CADL,CADJ,CADJ;AAsCH;;;;EArE0CxC,KAAK,CAACyC,S;;SAAhC5B,iB","sourcesContent":["import * as React from \"react\";\nimport { AdminGlobalSearchPlugin } from \"~/types\";\nimport classnames from \"classnames\";\nimport { List, ListItem, ListItemGraphic, ListItemText, ListItemMeta } from \"@webiny/ui/List\";\nimport { searchBarDropdown, iconSearchType } from \"./styled\";\nimport { Elevation } from \"@webiny/ui/Elevation\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport { Actions as DownshiftActions, DownshiftState, PropGetters } from \"downshift\";\nimport { ReactComponent as SearchIcon } from \"./icons/round-search-24px.svg\";\nimport { SearchBarState } from \"~/plugins/globalSearch/SearchBar\";\n\ninterface SearchBarDropdownPropsContextDownshiftCurrent\n    extends DownshiftActions<any>,\n        PropGetters<any> {\n    state: DownshiftState<any>;\n}\ninterface SearchBarDropdownPropsContextDownshift {\n    current: SearchBarDropdownPropsContextDownshiftCurrent;\n}\ninterface SearchBarDropdownPropsContext {\n    downshift: SearchBarDropdownPropsContextDownshift;\n    submitSearchTerm: (item: AdminGlobalSearchPlugin) => void;\n    state: SearchBarState;\n}\ninterface SearchBarDropdownProps {\n    context: SearchBarDropdownPropsContext;\n}\nexport default class SearchBarDropdown extends React.Component<SearchBarDropdownProps> {\n    public override componentDidMount() {\n        const {\n            context: {\n                downshift: { current: downshift },\n                state: { plugins }\n            }\n        } = this.props;\n\n        downshift.selectItem(plugins.current);\n        downshift.setHighlightedIndex(\n            plugins.list.indexOf(plugins.current as AdminGlobalSearchPlugin)\n        );\n        downshift.openMenu();\n    }\n\n    public override render() {\n        const {\n            context: {\n                downshift: { current: downshift },\n                submitSearchTerm,\n                state: { plugins, searchTerm }\n            }\n        } = this.props;\n\n        const {\n            getMenuProps,\n            getItemProps,\n            state: { selectedItem, highlightedIndex }\n        } = downshift;\n\n        return (\n            <Elevation z={2} className={searchBarDropdown}>\n                <List {...getMenuProps()}>\n                    {plugins.list.map((item: AdminGlobalSearchPlugin, index) => {\n                        // Base classes.\n                        const itemClassNames = {\n                            highlighted: highlightedIndex === index,\n                            selected: false\n                        };\n\n                        // Add \"selected\" class if the item is selected.\n                        if (selectedItem && selectedItem === item) {\n                            itemClassNames.selected = true;\n                        }\n\n                        return (\n                            <ListItem\n                                key={item.route}\n                                {...getItemProps({\n                                    index,\n                                    item,\n                                    className: classnames(itemClassNames),\n                                    onClick: () => submitSearchTerm(item)\n                                })}\n                            >\n                                <ListItemGraphic>\n                                    <Icon className={iconSearchType} icon={<SearchIcon />} />\n                                </ListItemGraphic>\n                                <ListItemText>\n                                    {searchTerm.current || \"Search for all...\"}\n                                </ListItemText>\n                                <ListItemMeta>in {item.label}</ListItemMeta>\n                            </ListItem>\n                        );\n                    })}\n                </List>\n            </Elevation>\n        );\n    }\n}\n"]}

package/plugins/globalSearch/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.tsx"],"names":["globalSearchHotkey","type","name","preventOpen","e","ignoreNodes","includes","target","nodeName"],"mappings":"AAEA,OAAO,IAAMA,kBAAkB,GAAG;AAC9BC,EAAAA,IAAI,EAAE,oCADwB;AAE9BC,EAAAA,IAAI,EAAE,0CAFwB;AAG9BC,EAAAA,WAH8B,uBAGlBC,CAHkB,EAG+B;AACzD;AACA,QAAMC,WAAW,GAAG,CAAC,OAAD,EAAU,UAAV,CAApB;AAEA,WAAOA,WAAW,CAACC,QAAZ,CAAqBF,CAAC,CAACG,MAAF,CAASC,QAA9B,CAAP;AACH;AAR6B,CAA3B","sourcesContent":["import React from \"react\";\n\nexport const globalSearchHotkey = {\n    type: \"admin-global-search-prevent-hotkey\",\n    name: \"admin-global-search-prevent-hotkey-input\",\n    preventOpen(e: React.ChangeEvent<HTMLInputElement>): boolean {\n        // Define a list of all node types we want to prevent the event from.\n        const ignoreNodes = [\"INPUT\", \"TEXTAREA\"];\n\n        return ignoreNodes.includes(e.target.nodeName);\n    }\n};\n"]}

package/plugins/globalSearch/styled.d.ts

@@ -1,7 +1,6 @@
-/// <reference types="react" />
-export declare const SearchShortcut: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "translate" | "children" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture">, object>;
-export declare const SearchBarWrapper: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "translate" | "children" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture">, object>;
-export declare const SearchBarInputWrapper: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "translate" | "children" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture">, object>;
+export declare const SearchShortcut: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
+export declare const SearchBarWrapper: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
+export declare const SearchBarInputWrapper: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
 export declare const searchBarInput: string;
 export declare const searchBarDropdown: string;
 export declare const icon: string;

package/plugins/globalSearch/styled.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["styled.ts"],"names":["css","styled","SearchShortcut","border","color","borderRadius","width","height","marginTop","textAlign","fontSize","paddingTop","boxSizing","cursor","opacity","SearchBarWrapper","display","SearchBarInputWrapper","position","searchBarInput","lineHeight","outline","backgroundColor","paddingLeft","borderBottom","searchBarDropdown","background","left","top","zIndex","padding","fontWeight","icon","paddingRight","iconSearchType","searchWrapper","transition","boxShadow","input"],"mappings":"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","sourcesContent":["// TODO remove\n// @ts-nocheck\nimport { css } from \"emotion\";\nimport styled from \"@emotion/styled\";\n\nexport const SearchShortcut = styled(\"div\")({\n    border: \"1px solid var(--mdc-theme-surface)\",\n    color: \"var(--mdc-theme-surface)\",\n    borderRadius: 5,\n    width: 20,\n    height: 24,\n    marginTop: 1,\n    textAlign: \"center\",\n    fontSize: \"12px\",\n    paddingTop: \"3px\",\n    boxSizing: \"border-box\",\n    cursor: \"default\",\n    opacity: \"0.8\"\n});\n\nexport const SearchBarWrapper = styled(\"div\")({\n    display: \"flex\",\n    width: \"100%\"\n});\n\nexport const SearchBarInputWrapper = styled(\"div\")({\n    display: \"flex\",\n    width: \"100%\",\n    position: \"relative\"\n});\n\nexport const searchBarInput = css({\n    width: \"100%\",\n    lineHeight: 1,\n    border: \"none\",\n    outline: \"none\",\n    backgroundColor: \"transparent\",\n    \"&.mdc-text-field__input\": {\n        paddingTop: \"5px !important\",\n        paddingLeft: \"10px !important\",\n        borderBottom: \"none !important\",\n        height: \"25px !important\",\n        color: \"var(--mdc-theme-surface)\",\n        \"&::placeholder\": {\n            color: \"var(--mdc-theme-surface) !important\",\n            opacity: \"1 !important\"\n        },\n        \"&:focus::placeholder\": {\n            color: \"var(--mdc-theme-text-secondary-on-background) !important\"\n        }\n    }\n});\n\nexport const searchBarDropdown = css({\n    position: \"absolute\",\n    background: \"white\",\n    left: -1,\n    width: \"calc(100% + 2px)\",\n    top: 45,\n    zIndex: 2,\n    color: \"var(--mdc-theme-on-surface)\",\n    borderRadius: \"0 0 5px 5px\",\n    \".mdc-list\": {\n        padding: 0,\n        \".mdc-list-item\": {\n            \"&.selected\": {\n                fontWeight: \"bold\"\n            },\n            \"&.highlighted\": {\n                backgroundColor: \"var(--mdc-theme-on-background)\"\n            }\n        }\n    }\n});\n\nexport const icon = css({\n    \"&.mdc-button__icon\": {\n        width: \"auto !important\",\n        paddingRight: 5,\n        opacity: 0.75,\n        marginTop: 2\n    }\n});\n\nexport const iconSearchType = css({\n    cursor: \"pointer\",\n    paddingLeft: 5\n});\n\nexport const searchWrapper = css({\n    backgroundColor: \"rgba(0, 0, 0, 0.1)\",\n    display: \"flex\",\n    padding: \"10px 20px\",\n    position: \"relative\",\n    borderRadius: 4,\n    transition: \"background 100ms ease-in,width 100ms ease-out\",\n    color: \"var(--mdc-theme-surface)\",\n    border: \"1px solid transparent\",\n    \"&.active\": {\n        color: \"var(--mdc-theme-on-surface)\",\n        border: \"1px solid var(--mdc-theme-text-hint-on-dark)\",\n        background: \"var(--mdc-theme-surface)\",\n        boxShadow: \"0 1px 1px var(--mdc-theme-text-hint-on-dark)\",\n        input: {\n            color: \"var(--mdc-theme-on-surface)\"\n        },\n        [SearchShortcut]: {\n            display: \"none\"\n        }\n    },\n    input: {\n        color: \"var(--mdc-theme-surface)\"\n    }\n});\n"]}

package/plugins/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 declare const _default: () => (import("./FileManagerFileTypePlugin").FileManagerFileTypePlugin[] | import("@webiny/ui-composer/UILayout").UILayoutPlugin<import("@webiny/ui-composer/UILayout").UILayout> | {
     type: string;
     name: string;

package/plugins/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":["fileManager","uiLayoutRenderer","globalSearchHotkey"],"mappings":"AAAA,OAAOA,WAAP;AACA,OAAOC,gBAAP;AACA,SAASC,kBAAT;AAEA,gBAAe;AAAA,SAAM,CAACF,WAAD,EAAcE,kBAAd,EAAkCD,gBAAlC,CAAN;AAAA,CAAf","sourcesContent":["import fileManager from \"./fileManager\";\nimport uiLayoutRenderer from \"./uiLayoutRenderer\";\nimport { globalSearchHotkey } from \"./globalSearch\";\n\nexport default () => [fileManager, globalSearchHotkey, uiLayoutRenderer];\n"]}

package/plugins/uiLayoutRenderer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.tsx"],"names":["React","Fragment","Cell","Grid","GridInner","UILayoutPlugin","getElementKey","element","constructor","name","id","ElementID","children","layout","setRenderer","props","hasParentGrid","getGrid","getLayout","map","row","index","item","getElement","console","warn","shouldRender","render","GridComponent","width"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,QAAhB,QAAgC,OAAhC;AACA,SAASC,IAAT,EAAeC,IAAf,EAAqBC,SAArB,QAAsC,iBAAtC;AACA,SAASC,cAAT;;AAGA,SAASC,aAAT,CAAuBC,OAAvB,EAA2C;AACvC,mBAAUA,OAAO,CAACC,WAAR,CAAoBC,IAA9B,cAAsCF,OAAO,CAACG,EAA9C;AACH;;AAED,IAAMC,SAAmB,GAAG,SAAtBA,SAAsB,OAAkB;AAAA,MAAfC,QAAe,QAAfA,QAAe;AAC1C,SAAOA,QAAP;AACH,CAFD;;AAIA,eAAe,IAAIP,cAAJ,CAAmB,UAAAQ,MAAM,EAAI;AACxCA,EAAAA,MAAM,CAACC,WAAP,CAAmB,iBAAsC;AAAA,QAAnCD,MAAmC,SAAnCA,MAAmC;AAAA,QAA3BE,KAA2B,SAA3BA,KAA2B;AAAA,QAApBC,aAAoB,SAApBA,aAAoB;;AACrD,QAAI,CAACH,MAAM,CAACI,OAAP,EAAL,EAAuB;AACnB,0BACI,oBAAC,QAAD,QACKJ,MAAM,CAACK,SAAP,GAAmBC,GAAnB,CAAuB,UAACC,GAAD,EAAMC,KAAN;AAAA,4BACpB,oBAAC,QAAD;AAAU,UAAA,GAAG,EAAEA;AAAf,WACKD,GAAG,CAACD,GAAJ,CAAQ,UAAAG,IAAI,EAAI;AACb,cAAMf,OAAO,GAAGM,MAAM,CAACU,UAAP,CAAkBD,IAAI,CAACf,OAAvB,CAAhB;;AAEA,cAAI,CAACA,OAAL,EAAc;AACViB,YAAAA,OAAO,CAACC,IAAR,qBAAyBH,IAAI,CAACf,OAA9B;AACA,mBAAO,IAAP;AACH;;AAED,cAAI,CAACA,OAAO,CAACmB,YAAR,CAAqBX,KAArB,CAAL,EAAkC;AAC9B,mBAAO,IAAP;AACH;;AAED,8BACI,oBAAC,SAAD;AAAW,YAAA,GAAG,EAAET,aAAa,CAACC,OAAD;AAA7B,aACKA,OAAO,CAACoB,MAAR,CAAeZ,KAAf,CADL,CADJ;AAKH,SAjBA,CADL,CADoB;AAAA,OAAvB,CADL,CADJ;AA0BH;;AAED,QAAMa,aAAa,GAAGZ,aAAa,GAAGZ,SAAH,GAAeD,IAAlD;AAEA,wBACI,oBAAC,aAAD,QACKU,MAAM,CAACK,SAAP,GAAmBC,GAAnB,CAAuB,UAACC,GAAD,EAAMC,KAAN;AAAA,0BACpB,oBAAC,QAAD;AAAU,QAAA,GAAG,EAAEA;AAAf,SACKD,GAAG,CAACD,GAAJ,CAAQ,UAAAG,IAAI,EAAI;AACb,YAAMf,OAAO,GAAGM,MAAM,CAACU,UAAP,CAAkBD,IAAI,CAACf,OAAvB,CAAhB;;AACA,YAAI,CAACA,OAAO,CAACmB,YAAR,CAAqBX,KAArB,CAAL,EAAkC;AAC9B,iBAAO,IAAP;AACH;;AACD,4BACI,oBAAC,IAAD;AAAM,UAAA,GAAG,EAAEO,IAAI,CAACf,OAAhB;AAAyB,UAAA,IAAI,EAAEe,IAAI,CAACO;AAApC,wBACI,oBAAC,SAAD;AAAW,UAAA,GAAG,EAAEvB,aAAa,CAACC,OAAD;AAA7B,WACKA,OAAO,CAACoB,MAAR,CAAeZ,KAAf,CADL,CADJ,CADJ;AAOH,OAZA,CADL,CADoB;AAAA,KAAvB,CADL,CADJ;AAqBH,GArDD;AAsDH,CAvDc,CAAf","sourcesContent":["import React, { Fragment } from \"react\";\nimport { Cell, Grid, GridInner } from \"@webiny/ui/Grid\";\nimport { UILayoutPlugin } from \"~/ui/UILayout\";\nimport { UIElement } from \"~/ui/UIElement\";\n\nfunction getElementKey(element: UIElement) {\n    return `${element.constructor.name}:${element.id}`;\n}\n\nconst ElementID: React.FC = ({ children }) => {\n    return children as unknown as React.ReactElement;\n};\n\nexport default new UILayoutPlugin(layout => {\n    layout.setRenderer(({ layout, props, hasParentGrid }) => {\n        if (!layout.getGrid()) {\n            return (\n                <Fragment>\n                    {layout.getLayout().map((row, index) => (\n                        <Fragment key={index}>\n                            {row.map(item => {\n                                const element = layout.getElement(item.element);\n\n                                if (!element) {\n                                    console.warn(`Element \"${item.element}\" was not found!`);\n                                    return null;\n                                }\n\n                                if (!element.shouldRender(props)) {\n                                    return null;\n                                }\n\n                                return (\n                                    <ElementID key={getElementKey(element)}>\n                                        {element.render(props)}\n                                    </ElementID>\n                                );\n                            })}\n                        </Fragment>\n                    ))}\n                </Fragment>\n            );\n        }\n\n        const GridComponent = hasParentGrid ? GridInner : Grid;\n\n        return (\n            <GridComponent>\n                {layout.getLayout().map((row, index) => (\n                    <Fragment key={index}>\n                        {row.map(item => {\n                            const element = layout.getElement(item.element);\n                            if (!element.shouldRender(props)) {\n                                return null;\n                            }\n                            return (\n                                <Cell key={item.element} span={item.width}>\n                                    <ElementID key={getElementKey(element)}>\n                                        {element.render(props)}\n                                    </ElementID>\n                                </Cell>\n                            );\n                        })}\n                    </Fragment>\n                ))}\n            </GridComponent>\n        );\n    });\n});\n"]}

package/types.d.ts

@@ -63,7 +63,7 @@ export declare type AdminFileManagerFileTypePlugin = Plugin & {
     types?: string[];
     render(params: AdminFileManagerFileTypePluginRenderParams): React.ReactNode;
     fileDetails?: {
-        actions: Array<React.FunctionComponent | React.Component>;
+        actions: Array<React.FC | React.Component>;
     };
 };
 export interface AdminInstallationPluginRenderParams {
@@ -73,7 +73,7 @@ export declare type AdminInstallationPlugin = Plugin & {
     type: "admin-installation";
     getInstalledVersion(params: {
         client: ApolloClient<object>;
-    }): Promise<string>;
+    }): Promise<string | null>;
     title: string;
     dependencies?: string[];
     secure: boolean;

package/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}

package/ui/UIElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["UIElement.tsx"],"names":["UIElement","UIElementPlugin"],"mappings":"AAOA,SAASA,SAAT,EAAoBC,eAApB,QAA2C,+BAA3C","sourcesContent":["export type {\n    UIElementConfig,\n    ApplyFunction,\n    ShouldRender,\n    UiElementRenderProps\n} from \"@webiny/ui-composer/UIElement\";\n\nexport { UIElement, UIElementPlugin } from \"@webiny/ui-composer/UIElement\";\n"]}

package/ui/UILayout.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["UILayout.tsx"],"names":["UILayout","UILayoutPlugin"],"mappings":"AAAA,SAASA,QAAT,EAAmBC,cAAnB,QAAyC,8BAAzC","sourcesContent":["export { UILayout, UILayoutPlugin } from \"@webiny/ui-composer/UILayout\";\n"]}

package/ui/UIRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["UIRenderer.tsx"],"names":["UIRenderer"],"mappings":"AAAA,SAASA,UAAT,QAA2B,gCAA3B","sourcesContent":["export { UIRenderer } from \"@webiny/ui-composer/UIRenderer\";\nexport type { UIRenderParams, RenderNext } from \"@webiny/ui-composer/UIRenderer\";\n"]}

package/ui/UIView.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["UIView.tsx"],"names":["UIView","UIViewComponent","UIViewPlugin"],"mappings":"AAMA,SAASA,MAAT,EAAiBC,eAAjB,EAAkCC,YAAlC,QAAsD,4BAAtD","sourcesContent":["export type {\n    ApplyFunction,\n    UIElementWrapperProps,\n    UIElementWrapper,\n    UIViewProps\n} from \"@webiny/ui-composer/UIView\";\nexport { UIView, UIViewComponent, UIViewPlugin } from \"@webiny/ui-composer/UIView\";\n"]}

package/ui/elements/AccordionElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["AccordionElement.tsx"],"names":["React","UIElement","Accordion","AccordionItem","AccordionItemElement","id","config","title","description","props","open","rest","isOpened","AccordionElement","useGrid","items","forEach","item","addElement","getElement"],"mappings":";;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT;AACA,SAASC,SAAT,EAAoBC,aAApB,QAAyC,sBAAzC;AAcA,WAAaC,oBAAb;AAAA;;AAAA;;AACI,gCAAmBC,EAAnB,EAA+BC,MAA/B,EAA6C;AAAA;;AAAA,6BACnCD,EADmC,EAC/BC,MAD+B;AAE5C;;AAHL;AAAA;AAAA,WAKI,kBAAgBC,KAAhB,EAAqC;AACjC,WAAKD,MAAL,CAAYC,KAAZ,GAAoBA,KAApB;AACH;AAPL;AAAA;AAAA,WASI,wBAAsBC,WAAtB,EAAiD;AAC7C,WAAKF,MAAL,CAAYE,WAAZ,GAA0BA,WAA1B;AACH;AAXL;AAAA;AAAA,WAaI,gBAAuBC,KAAvB,EAAqE;AACjE,yBAA0B,KAAKH,MAA/B;AAAA,UAAQI,IAAR,gBAAQA,IAAR;AAAA,UAAiBC,IAAjB;;AACA,UAAMC,QAAQ,GAAG,OAAOF,IAAP,KAAgB,UAAhB,GAA6BA,IAAI,CAACD,KAAD,CAAjC,GAA2CC,IAA5D;AACA,0BACI,oBAAC,aAAD;AAAe,QAAA,IAAI,EAAEE;AAArB,SAAmCD,IAAnC,oFACkBF,KADlB,EADJ;AAKH;AArBL;;AAAA;AAAA,EAA0CR,SAA1C;AA4BA,WAAaY,gBAAb;AAAA;;AAAA;;AACI,4BAAmBR,EAAnB,EAA+BC,MAA/B,EAA+C;AAAA;;AAAA;;AAC3C,+BAAMD,EAAN,EAAUC,MAAV;;AAEA,UAAKQ,OAAL,CAAa,KAAb;;AAEA,UAAKR,MAAL,CAAYS,KAAZ,CAAkBC,OAAlB,CAA0B,UAAAC,IAAI,EAAI;AAC9B,YAAKC,UAAL,CAAgB,IAAId,oBAAJ,CAAyBa,IAAI,CAACZ,EAA9B,EAAkCY,IAAlC,CAAhB;AACH,KAFD;;AAL2C;AAQ9C;;AATL;AAAA;AAAA,WAWI,iCAA+BZ,EAA/B,EAAiE;AAC7D,aAAO,KAAKc,UAAL,CAAgBd,EAAhB,CAAP;AACH;AAbL;AAAA;AAAA,WAeI,gBAAuBI,KAAvB,EAAqE;AACjE;AACR;AACA;AACA;AACQ;AACA,0BAAO,oBAAC,SAAD;AAAW,QAAA,SAAS,EAAE;AAAtB,sFAAuCA,KAAvC,EAAP;AACH;AAtBL;;AAAA;AAAA,EAAsCR,SAAtC","sourcesContent":["import React from \"react\";\nimport { UIElement, UIElementConfig, UiElementRenderProps } from \"~/ui/UIElement\";\nimport { Accordion, AccordionItem } from \"@webiny/ui/Accordion\";\n\ninterface GetterWithProps<TProps, T> {\n    (props: TProps): T;\n}\n\ninterface Item<TProps = any> extends UIElementConfig {\n    id: string;\n    title: string;\n    description: string;\n    icon: React.ReactElement;\n    open?: boolean | GetterWithProps<TProps, boolean>;\n}\n\nexport class AccordionItemElement extends UIElement<Item> {\n    public constructor(id: string, config: Item) {\n        super(id, config);\n    }\n\n    public setTitle(title: string): void {\n        this.config.title = title;\n    }\n\n    public setDescription(description: string): void {\n        this.config.description = description;\n    }\n\n    public override render(props: UiElementRenderProps): React.ReactNode {\n        const { open, ...rest } = this.config;\n        const isOpened = typeof open === \"function\" ? open(props) : open;\n        return (\n            <AccordionItem open={isOpened} {...rest}>\n                {super.render(props)}\n            </AccordionItem>\n        );\n    }\n}\n\ninterface Config extends UIElementConfig {\n    items: Item[];\n}\n\nexport class AccordionElement extends UIElement<Config> {\n    public constructor(id: string, config: Config) {\n        super(id, config);\n\n        this.useGrid(false);\n\n        this.config.items.forEach(item => {\n            this.addElement(new AccordionItemElement(item.id, item));\n        });\n    }\n\n    public getAccordionItemElement(id: string): AccordionItemElement {\n        return this.getElement(id) as AccordionItemElement;\n    }\n\n    public override render(props: UiElementRenderProps): React.ReactNode {\n        /**\n         * Figure out correct way to have props.children typed.\n         * TODO @ts-refactor\n         */\n        // @ts-ignore\n        return <Accordion elevation={0}>{super.render(props)}</Accordion>;\n    }\n}\n"]}

package/ui/elements/ButtonElement.js

@@ -24,12 +24,18 @@ export var ButtonElement = /*#__PURE__*/function (_UIElement) {
   _createClass(ButtonElement, [{
     key: "setLabel",
     value: function setLabel(label) {
+      /**
+       * TODO @ts-refactor
+       * 'TProps' could be instantiated with an arbitrary type which could be unrelated to 'TRenderProps'
+       */
+      // @ts-ignore
       this.config.label = label;
     }
   }, {
     key: "getLabel",
     value: function getLabel(props) {
       if (typeof this.config.label === "function") {
+        // TODO @ts-refactor find out correct types to pass
         return this.config.label(props);
       }
 
@@ -44,6 +50,7 @@ export var ButtonElement = /*#__PURE__*/function (_UIElement) {
     key: "getType",
     value: function getType(props) {
       if (typeof this.config.type === "function") {
+        // TODO @ts-refactor find out correct types to pass
         return this.config.type(props);
       }
 

package/ui/elements/ButtonElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ButtonElement.tsx"],"names":["React","ButtonDefault","ButtonPrimary","ButtonSecondary","UIElement","BUTTONS","default","primary","secondary","ButtonElement","label","config","props","type","onClick","Component","getType","getOnClick","getLabel"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,aAAT,EAAwBC,aAAxB,EAAuCC,eAAvC,QAA8D,mBAA9D;AACA,SAASC,SAAT;AAkBA,IAAMC,OAAO,GAAG;AACZC,EAAAA,OAAO,EAAEL,aADG;AAEZM,EAAAA,OAAO,EAAEL,aAFG;AAGZM,EAAAA,SAAS,EAAEL;AAHC,CAAhB;AAMA,WAAaM,aAAb;AAAA;;AAAA;;AAAA;AAAA;;AAAA;AAAA;;AAAA;AAAA;AAAA,WAGI,kBACIC,KADJ,EAEQ;AACJ;AACR;AACA;AACA;AACQ;AACA,WAAKC,MAAL,CAAYD,KAAZ,GAAoBA,KAApB;AACH;AAZL;AAAA;AAAA,WAcI,kBAAgBE,KAAhB,EAA8C;AAC1C,UAAI,OAAO,KAAKD,MAAL,CAAYD,KAAnB,KAA6B,UAAjC,EAA6C;AACzC;AACA,eAAO,KAAKC,MAAL,CAAYD,KAAZ,CAAkBE,KAAlB,CAAP;AACH;;AACD,aAAO,KAAKD,MAAL,CAAYD,KAAnB;AACH;AApBL;AAAA;AAAA,WAsBI,iBAAeG,IAAf,EAA8C;AAC1C,WAAKF,MAAL,CAAYE,IAAZ,GAAmBA,IAAnB;AACH;AAxBL;AAAA;AAAA,WA0BI,iBAAeD,KAAf,EAAwD;AACpD,UAAI,OAAO,KAAKD,MAAL,CAAYE,IAAnB,KAA4B,UAAhC,EAA4C;AACxC;AACA,eAAO,KAAKF,MAAL,CAAYE,IAAZ,CAAiBD,KAAjB,CAAP;AACH;;AACD,aAAO,KAAKD,MAAL,CAAYE,IAAnB;AACH;AAhCL;AAAA;AAAA,WAkCI,oBAAkBC,OAAlB,EAA8D;AAC1D,WAAKH,MAAL,CAAYG,OAAZ,GAAsBA,OAAtB;AACH;AApCL;AAAA;AAAA,WAsCI,sBAAoB;AAChB,aAAO,KAAKH,MAAL,CAAYG,OAAnB;AACH;AAxCL;AAAA;AAAA,WA0CI,gBAAuBF,KAAvB,EAAgE;AAC5D,UAAMG,SAAS,GAAGV,OAAO,CAAC,KAAKW,OAAL,CAAaJ,KAAb,CAAD,CAAzB;;AACA,UAAME,QAAO,GAAG,KAAKG,UAAL,EAAhB;;AAEA,0BAAO,oBAAC,SAAD;AAAW,QAAA,OAAO,EAAE;AAAA,iBAAMH,QAAO,CAACF,KAAD,CAAb;AAAA;AAApB,SAA2C,KAAKM,QAAL,CAAcN,KAAd,CAA3C,CAAP;AACH;AA/CL;;AAAA;AAAA,EAAuDR,SAAvD","sourcesContent":["import React from \"react\";\nimport { ButtonDefault, ButtonPrimary, ButtonSecondary } from \"@webiny/ui/Button\";\nimport { UIElement, UIElementConfig } from \"../UIElement\";\n\nexport type ButtonElementType = \"default\" | \"primary\" | \"secondary\";\n\nexport interface ButtonOnClick<TRenderProps = any> {\n    (props: TRenderProps): void;\n}\n\ninterface GetterWithProps<TProps, TReturn> {\n    (props: TProps): TReturn;\n}\n\nexport interface ButtonElementConfig<TRenderProps> extends UIElementConfig {\n    type: ButtonElementType | GetterWithProps<TRenderProps, ButtonElementType>;\n    label: string | GetterWithProps<TRenderProps, string>;\n    onClick: ButtonOnClick<TRenderProps>;\n}\n\nconst BUTTONS = {\n    default: ButtonDefault,\n    primary: ButtonPrimary,\n    secondary: ButtonSecondary\n};\n\nexport class ButtonElement<TRenderProps = any> extends UIElement<\n    ButtonElementConfig<TRenderProps>\n> {\n    public setLabel<TProps extends TRenderProps = TRenderProps>(\n        label: string | GetterWithProps<TProps, string>\n    ): void {\n        /**\n         * TODO @ts-refactor\n         * 'TProps' could be instantiated with an arbitrary type which could be unrelated to 'TRenderProps'\n         */\n        // @ts-ignore\n        this.config.label = label;\n    }\n\n    public getLabel(props?: TRenderProps): string {\n        if (typeof this.config.label === \"function\") {\n            // TODO @ts-refactor find out correct types to pass\n            return this.config.label(props as TRenderProps);\n        }\n        return this.config.label;\n    }\n\n    public setType(type: ButtonElementType): void {\n        this.config.type = type;\n    }\n\n    public getType(props?: TRenderProps): ButtonElementType {\n        if (typeof this.config.type === \"function\") {\n            // TODO @ts-refactor find out correct types to pass\n            return this.config.type(props as TRenderProps);\n        }\n        return this.config.type;\n    }\n\n    public setOnClick(onClick: ButtonOnClick<TRenderProps>): void {\n        this.config.onClick = onClick;\n    }\n\n    public getOnClick() {\n        return this.config.onClick;\n    }\n\n    public override render(props: TRenderProps): React.ReactElement {\n        const Component = BUTTONS[this.getType(props)];\n        const onClick = this.getOnClick();\n\n        return <Component onClick={() => onClick(props)}>{this.getLabel(props)}</Component>;\n    }\n}\n"]}

package/ui/elements/ButtonGroupElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ButtonGroupElement.tsx"],"names":["React","UIElement","styled","ButtonGroup","display","height","width","alignItems","justifyContent","marginRight","ButtonGroupElement","id","useGrid","props"],"mappings":";;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAASC,SAAT;AACA,OAAOC,MAAP,MAAmB,iBAAnB;AAEA,IAAMC,WAAW,gBAAGD,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GAAiB;AAC9BE,EAAAA,OAAO,EAAE,MADqB;AAE9BC,EAAAA,MAAM,EAAE,MAFsB;AAG9BC,EAAAA,KAAK,EAAE,MAHuB;AAI9BC,EAAAA,UAAU,EAAE,QAJkB;AAK9BC,EAAAA,cAAc,EAAE,QALc;AAM9B,cAAY;AACRC,IAAAA,WAAW,EAAE;AADL;AANkB,CAAjB,CAAjB;AAWA,WAAaC,kBAAb;AAAA;;AAAA;;AACI,8BAAmBC,EAAnB,EAA+B;AAAA;;AAAA;;AAC3B,8BAAMA,EAAN;;AAEA,UAAKC,OAAL,CAAa,KAAb;;AAH2B;AAI9B;;AALL;AAAA;AAAA,WAOI,gBAAuBC,KAAvB,EAAsE;AAClE,0BAAO,oBAAC,WAAD,uFAA2BA,KAA3B,EAAP;AACH;AATL;;AAAA;AAAA,EAAwCZ,SAAxC","sourcesContent":["import React from \"react\";\n\nimport { UIElement, UiElementRenderProps } from \"~/ui/UIElement\";\nimport styled from \"@emotion/styled\";\n\nconst ButtonGroup = styled(\"div\")({\n    display: \"flex\",\n    height: \"100%\",\n    width: \"100%\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    \"> button\": {\n        marginRight: 15\n    }\n});\n\nexport class ButtonGroupElement extends UIElement<any> {\n    public constructor(id: string) {\n        super(id);\n\n        this.useGrid(false);\n    }\n\n    public override render(props?: UiElementRenderProps): React.ReactNode {\n        return <ButtonGroup>{super.render(props)}</ButtonGroup>;\n    }\n}\n"]}

package/ui/elements/GenericElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["GenericElement.tsx"],"names":[],"mappings":"AAAA,cAAc,6CAAd","sourcesContent":["export * from \"@webiny/ui-composer/elements/GenericElement\";\n"]}

package/ui/elements/LabelElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["LabelElement.tsx"],"names":["UIElement","LabelElement","id","config","applyPlugins","text"],"mappings":";;;;AACA,SAASA,SAAT;;AAMA;AACA;AACA;AACA;AACA;AACA,WAAaC,YAAb;AAAA;;AAAA;;AACI,wBAAmBC,EAAnB,EAA+BC,MAA/B,EAA2D;AAAA;;AAAA;;AACvD,8BAAMD,EAAN,EAAUC,MAAV;;AAEA,UAAKC,YAAL,CAAkBH,YAAlB;;AAHuD;AAI1D;;AALL;AAAA;AAAA,WAOI,mBAAyB;AACrB,aAAO,KAAKE,MAAL,CAAYE,IAAnB;AACH;AATL;AAAA;AAAA,WAWI,iBAAeA,IAAf,EAAmC;AAC/B,WAAKF,MAAL,CAAYE,IAAZ,GAAmBA,IAAnB;AACH;AAbL;AAAA;AAAA,WAeI,kBAA0C;AACtC,aAAO,KAAKF,MAAL,CAAYE,IAAnB;AACH;AAjBL;;AAAA;AAAA,EAAkCL,SAAlC","sourcesContent":["import React from \"react\";\nimport { UIElement, UIElementConfig } from \"~/ui/UIElement\";\n\nexport interface LabelElementConfig extends UIElementConfig {\n    text: string;\n}\n\n/**\n * !GOOD FIRST ISSUE!\n * Add support for `text` config and `setText` setter to accept functions.\n * See example in ButtonElement: packages/app-admin/src/ui/elements/ButtonElement.tsx\n */\nexport class LabelElement extends UIElement<LabelElementConfig> {\n    public constructor(id: string, config: LabelElementConfig) {\n        super(id, config);\n\n        this.applyPlugins(LabelElement);\n    }\n\n    public getText(): string {\n        return this.config.text;\n    }\n\n    public setText(text: string): void {\n        this.config.text = text;\n    }\n\n    public override render(): React.ReactNode {\n        return this.config.text;\n    }\n}\n"]}

package/ui/elements/NavigationMenuElement.d.ts

@@ -1,5 +1,6 @@
 import React from "react";
 import { UIElement, UIElementConfig } from "../UIElement";
+import { UILayoutSorter } from "@webiny/ui-composer/UILayout";
 export interface NavigationMenuElementConfig extends UIElementConfig {
     label: React.ReactNode;
     icon?: React.ReactElement;
@@ -13,15 +14,12 @@ export declare enum TAGS {
     UTILS = "utils",
     APP = "app"
 }
-interface Sorter {
-    (a: NavigationMenuElement, b: NavigationMenuElement): number;
-}
 export declare class NavigationMenuElement<TConfig extends NavigationMenuElementConfig = NavigationMenuElementConfig> extends UIElement<TConfig> {
     private _isExpanded;
     private _sorters;
     constructor(id: string, config: TConfig);
     addElement<TElement extends UIElement = UIElement>(element: TElement): TElement;
-    addSorter(sorter: Sorter): void;
+    addSorter(sorter: UILayoutSorter<NavigationMenuElementConfig>): void;
     get isExpanded(): boolean;
     setIcon(icon: React.ReactElement): void;
     setLabel(label: string): void;
@@ -33,4 +31,3 @@ export declare class NavigationMenuElement<TConfig extends NavigationMenuElement
     private storeState;
     private runSorters;
 }
-export {};

package/ui/elements/NavigationMenuElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["NavigationMenuElement.tsx"],"names":["default","localStorage","UIElement","LOCAL_STORAGE_KEY","TAGS","NavigationMenuElement","id","config","useGrid","state","loadState","_isExpanded","includes","addSorter","a","b","hasTag","APP","UTILS","label","localeCompare","applyPlugins","element","runSorters","sorter","_sorters","push","icon","path","storeState","getView","refresh","splice","indexOf","collapseElement","expandElement","get","split","filter","Boolean","set","join","getLayout","sort"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport { default as localStorage } from \"store\";\nimport { UIElement, UIElementConfig } from \"~/ui/UIElement\";\nimport { UILayoutSorter } from \"@webiny/ui-composer/UILayout\";\n\nexport interface NavigationMenuElementConfig extends UIElementConfig {\n    label: React.ReactNode;\n    icon?: React.ReactElement;\n    path?: string;\n    onClick?: Function;\n    testId?: string;\n    rel?: string;\n    target?: string;\n}\n\nconst LOCAL_STORAGE_KEY = \"webiny_apps_menu_sections\";\n\nexport enum TAGS {\n    UTILS = \"utils\",\n    APP = \"app\"\n}\n\nexport class NavigationMenuElement<\n    TConfig extends NavigationMenuElementConfig = NavigationMenuElementConfig\n> extends UIElement<TConfig> {\n    private _isExpanded = false;\n    private _sorters: UILayoutSorter<NavigationMenuElementConfig>[] = [];\n\n    public constructor(id: string, config: TConfig) {\n        super(id, config);\n\n        this.useGrid(false);\n\n        const state = this.loadState();\n        this._isExpanded = state.includes(this.id);\n\n        this.addSorter((a, b) => {\n            if (a.hasTag(TAGS.APP) && b.hasTag(TAGS.UTILS)) {\n                return -1;\n            }\n\n            if (a.hasTag(TAGS.UTILS) && b.hasTag(TAGS.APP)) {\n                return 1;\n            }\n\n            return (a.config.label as string).localeCompare(b.config.label as string);\n        });\n\n        // Apply plugins\n        this.applyPlugins(NavigationMenuElement);\n    }\n\n    public override addElement<TElement extends UIElement = UIElement>(\n        element: TElement\n    ): TElement {\n        super.addElement(element);\n        this.runSorters();\n        return element;\n    }\n\n    public addSorter(sorter: UILayoutSorter<NavigationMenuElementConfig>): void {\n        this._sorters.push(sorter);\n    }\n\n    get isExpanded(): boolean {\n        return this._isExpanded;\n    }\n\n    public setIcon(icon: React.ReactElement): void {\n        this.config.icon = icon;\n    }\n\n    public setLabel(label: string): void {\n        this.config.label = label;\n    }\n\n    public setPath(path: string): void {\n        this.config.path = path;\n    }\n\n    public expandElement(): void {\n        this._isExpanded = true;\n        const state = this.loadState();\n        if (!state.includes(this.id)) {\n            state.push(this.id);\n        }\n        this.storeState(state);\n        this.getView().refresh();\n    }\n\n    public collapseElement(): void {\n        this._isExpanded = false;\n        const state = this.loadState();\n        if (state.includes(this.id)) {\n            state.splice(state.indexOf(this.id), 1);\n        }\n        this.storeState(state);\n        this.getView().refresh();\n    }\n\n    public toggleElement(): void {\n        if (this._isExpanded) {\n            this.collapseElement();\n            return;\n        }\n        this.expandElement();\n    }\n\n    private loadState(): string[] {\n        return (localStorage.get(LOCAL_STORAGE_KEY) || \"\").split(\",\").filter(Boolean);\n    }\n\n    private storeState(state: string[]): void {\n        localStorage.set(LOCAL_STORAGE_KEY, state.join(\",\"));\n    }\n\n    private runSorters(): void {\n        for (const sorter of this._sorters) {\n            this.getLayout().sort(sorter);\n        }\n    }\n}\n"]}

package/ui/elements/PanelElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["PanelElement.tsx"],"names":["UIElement","PanelElement"],"mappings":";;;;AAAA,SAASA,SAAT;AAEA,WAAaC,YAAb;AAAA;;AAAA;;AAAA;AAAA;;AAAA;AAAA;;AAAA;AAAA,EAAkCD,SAAlC","sourcesContent":["import { UIElement } from \"~/ui/UIElement\";\n\nexport class PanelElement extends UIElement<any> {}\n"]}

package/ui/elements/PlaceholderElement.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { UIElement } from "../UIElement";
 export declare class PlaceholderElement extends UIElement {
     render(): React.ReactNode;

package/ui/elements/PlaceholderElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["PlaceholderElement.tsx"],"names":["UIElement","PlaceholderElement"],"mappings":";;;;AAAA,SAASA,SAAT;AAEA,WAAaC,kBAAb;AAAA;;AAAA;;AAAA;AAAA;;AAAA;AAAA;;AAAA;AAAA;AAAA,WACI,kBAA0C;AACtC,aAAO,IAAP;AACH;AAHL;AAAA;AAAA,WAKI,kBAA+B;AAC3B;AACH;AAPL;;AAAA;AAAA,EAAwCD,SAAxC","sourcesContent":["import { UIElement } from \"../UIElement\";\n\nexport class PlaceholderElement extends UIElement {\n    public override render(): React.ReactNode {\n        return null;\n    }\n\n    public override remove(): void {\n        return;\n    }\n}\n"]}

package/ui/elements/SmallButtonElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["SmallButtonElement.tsx"],"names":["React","ButtonDefault","ButtonPrimary","ButtonSecondary","ButtonElement","BUTTONS","default","primary","secondary","SmallButtonElement","id","config","applyPlugins","props","Component","getType","onClick","getOnClick","getLabel"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,aAAT,EAAwBC,aAAxB,EAAuCC,eAAvC,QAA8D,mBAA9D;AACA,SAASC,aAAT;AAEA,IAAMC,OAAO,GAAG;AACZC,EAAAA,OAAO,EAAEL,aADG;AAEZM,EAAAA,OAAO,EAAEL,aAFG;AAGZM,EAAAA,SAAS,EAAEL;AAHC,CAAhB;AAMA,WAAaM,kBAAb;AAAA;;AAAA;;AACI,8BAAmBC,EAAnB,EAA+BC,MAA/B,EAA0E;AAAA;;AAAA;;AACtE,8BAAMD,EAAN,EAAUC,MAAV;;AAEA,UAAKC,YAAL,CAAkBH,kBAAlB;;AAHsE;AAIzE;;AALL;AAAA;AAAA,WAOI,gBAAuBI,KAAvB,EAAgE;AAC5D,UAAMC,SAAS,GAAGT,OAAO,CAAC,KAAKU,OAAL,EAAD,CAAzB;;AACA,UAAMC,QAAO,GAAG,KAAKC,UAAL,EAAhB;;AAEA,0BACI,oBAAC,SAAD;AAAW,QAAA,KAAK,MAAhB;AAAiB,QAAA,OAAO,EAAE;AAAA,iBAAMD,QAAO,CAACH,KAAD,CAAb;AAAA;AAA1B,SACK,KAAKK,QAAL,EADL,CADJ;AAKH;AAhBL;;AAAA;AAAA,EAA4Dd,aAA5D","sourcesContent":["import React from \"react\";\nimport { ButtonDefault, ButtonPrimary, ButtonSecondary } from \"@webiny/ui/Button\";\nimport { ButtonElement, ButtonElementConfig } from \"~/ui/elements/ButtonElement\";\n\nconst BUTTONS = {\n    default: ButtonDefault,\n    primary: ButtonPrimary,\n    secondary: ButtonSecondary\n};\n\nexport class SmallButtonElement<TRenderProps = any> extends ButtonElement<TRenderProps> {\n    public constructor(id: string, config: ButtonElementConfig<TRenderProps>) {\n        super(id, config);\n\n        this.applyPlugins(SmallButtonElement);\n    }\n\n    public override render(props: TRenderProps): React.ReactElement {\n        const Component = BUTTONS[this.getType()];\n        const onClick = this.getOnClick();\n\n        return (\n            <Component small onClick={() => onClick(props)}>\n                {this.getLabel()}\n            </Component>\n        );\n    }\n}\n"]}

package/ui/elements/TypographyElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["TypographyElement.tsx"],"names":["React","UIElement","Typography","TypographyElement","id","config","useGrid","applyPlugins","typography","props","getTypography"],"mappings":";;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT;AACA,SAASC,UAAT,QAA2B,uBAA3B;AAqBA,WAAaC,iBAAb;AAAA;;AAAA;;AACI,6BAAYC,EAAZ,EAAwBC,MAAxB,EAAyD;AAAA;;AAAA;;AACrD,8BAAMD,EAAN,EAAUC,MAAV;;AACA,UAAKC,OAAL,CAAa,KAAb;;AAEA,UAAKC,YAAL,CAAkBJ,iBAAlB;;AAJqD;AAKxD;;AANL;AAAA;AAAA,WAQI,yBAAoC;AAChC,aAAO,KAAKE,MAAL,CAAYG,UAAnB;AACH;AAVL;AAAA;AAAA,WAYI,uBAAqBA,UAArB,EAAoD;AAChD,WAAKH,MAAL,CAAYG,UAAZ,GAAyBA,UAAzB;AACH;AAdL;AAAA;AAAA,WAgBI,gBAAuBC,KAAvB,EAAoD;AAChD,0BAAO,oBAAC,UAAD;AAAY,QAAA,GAAG,EAAE,KAAKC,aAAL;AAAjB,uFAAqDD,KAArD,EAAP;AACH;AAlBL;;AAAA;AAAA,EAAuCR,SAAvC","sourcesContent":["import React from \"react\";\nimport { UIElement, UIElementConfig } from \"../UIElement\";\nimport { Typography } from \"@webiny/ui/Typography\";\n\nexport type TypographyT =\n    | \"headline1\"\n    | \"headline2\"\n    | \"headline3\"\n    | \"headline4\"\n    | \"headline5\"\n    | \"headline6\"\n    | \"subtitle1\"\n    | \"subtitle2\"\n    | \"body1\"\n    | \"body2\"\n    | \"caption\"\n    | \"button\"\n    | \"overline\";\n\ninterface TypographyElementConfig extends UIElementConfig {\n    typography: TypographyT;\n}\n\nexport class TypographyElement extends UIElement<TypographyElementConfig> {\n    constructor(id: string, config: TypographyElementConfig) {\n        super(id, config);\n        this.useGrid(false);\n\n        this.applyPlugins(TypographyElement);\n    }\n\n    public getTypography(): TypographyT {\n        return this.config.typography;\n    }\n\n    public setTypography(typography: TypographyT): void {\n        this.config.typography = typography;\n    }\n\n    public override render(props: any): React.ReactNode {\n        return <Typography use={this.getTypography()}>{super.render(props)}</Typography>;\n    }\n}\n"]}

package/ui/elements/ViewElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ViewElement.tsx"],"names":[],"mappings":"AAAA,cAAc,0CAAd","sourcesContent":["export * from \"@webiny/ui-composer/elements/ViewElement\";\n"]}

package/ui/elements/form/DynamicFieldsetElement/DynamicFieldsetRowElement.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
-import { UIElement } from "../../../UIElement";
+import { UIElement, UiElementRenderProps } from "../../../UIElement";
 export declare class DynamicFieldsetRowElement extends UIElement<any> {
     constructor(id: string);
-    render(props?: any): React.ReactNode;
+    render(props?: UiElementRenderProps): React.ReactNode;
 }

package/ui/elements/form/DynamicFieldsetElement/DynamicFieldsetRowElement.js

@@ -4,15 +4,11 @@ import _get from "@babel/runtime/helpers/get";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _inherits from "@babel/runtime/helpers/inherits";
 import _createSuper from "@babel/runtime/helpers/createSuper";
-import React from "react";
-import { UIElement } from "../../../UIElement";
-import styled from "@emotion/styled";
-var DynamicFieldsetRow = /*#__PURE__*/styled("div", {
-  target: "e1huneaw0",
-  label: "DynamicFieldsetRow"
-})({
-  paddingBottom: 10
-}); // !GOOD FIRST ISSUE!
+import { UIElement } from "../../../UIElement"; // import styled from "@emotion/styled";
+// const DynamicFieldsetRow = styled("div")({
+//     paddingBottom: 10
+// });
+// !GOOD FIRST ISSUE!
 // Extract rendering and styling into a DynamicFieldsetRowElementRenderer class.
 
 export var DynamicFieldsetRowElement = /*#__PURE__*/function (_UIElement) {
@@ -36,7 +32,11 @@ export var DynamicFieldsetRowElement = /*#__PURE__*/function (_UIElement) {
     key: "render",
     value: function render(props) {
       return _get(_getPrototypeOf(DynamicFieldsetRowElement.prototype), "render", this).call(this, props);
-      return /*#__PURE__*/React.createElement(DynamicFieldsetRow, null);
+      /**
+       * TODO @ts-refactor @pavel
+       * Why was this left here?
+       */
+      // return <DynamicFieldsetRow>{}</DynamicFieldsetRow>;
     }
   }]);
 

package/ui/elements/form/DynamicFieldsetElement/DynamicFieldsetRowElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["DynamicFieldsetRowElement.tsx"],"names":["UIElement","DynamicFieldsetRowElement","id","applyPlugins","props"],"mappings":";;;;;;AACA,SAASA,SAAT,6B,CACA;AAEA;AACA;AACA;AAEA;AACA;;AAEA,WAAaC,yBAAb;AAAA;;AAAA;;AACI,qCAAmBC,EAAnB,EAA+B;AAAA;;AAAA;;AAC3B,8BAAMA,EAAN;;AAEA,UAAKC,YAAL,CAAkBF,yBAAlB;;AAH2B;AAI9B;;AALL;AAAA;AAAA,WAOI,gBAAuBG,KAAvB,EAAsE;AAClE,mGAAoBA,KAApB;AACA;AACR;AACA;AACA;AACQ;AACH;AAdL;;AAAA;AAAA,EAA+CJ,SAA/C","sourcesContent":["import React from \"react\";\nimport { UIElement, UiElementRenderProps } from \"~/ui/UIElement\";\n// import styled from \"@emotion/styled\";\n\n// const DynamicFieldsetRow = styled(\"div\")({\n//     paddingBottom: 10\n// });\n\n// !GOOD FIRST ISSUE!\n// Extract rendering and styling into a DynamicFieldsetRowElementRenderer class.\n\nexport class DynamicFieldsetRowElement extends UIElement<any> {\n    public constructor(id: string) {\n        super(id);\n\n        this.applyPlugins(DynamicFieldsetRowElement);\n    }\n\n    public override render(props?: UiElementRenderProps): React.ReactNode {\n        return super.render(props);\n        /**\n         * TODO @ts-refactor @pavel\n         * Why was this left here?\n         */\n        // return <DynamicFieldsetRow>{}</DynamicFieldsetRow>;\n    }\n}\n"]}

package/ui/elements/form/DynamicFieldsetElement.d.ts

@@ -6,35 +6,36 @@ interface DynamicFieldsetActions {
     add: (index?: number) => () => void;
     remove: (index: number) => () => void;
 }
-export interface DynamicFieldsetElementConfig extends FormFieldElementConfig {
-    createHeader?: (params: {
+interface CreateHeaderCallable {
+    (params: {
         actions: DynamicFieldsetActions;
-    }) => UIElement;
-    createRow?: (params: {
+    }): UIElement;
+}
+interface CreateRowCallable {
+    (params: {
         actions: DynamicFieldsetActions;
         index: number;
         row: DynamicFieldsetRowElement;
-    }) => UIElement;
-    createEmpty?: (params: {
+    }): UIElement;
+}
+interface CreateEmptyCallable {
+    (params: {
         actions: DynamicFieldsetActions;
-    }) => UIElement;
+    }): UIElement;
+}
+export interface DynamicFieldsetElementConfig extends FormFieldElementConfig {
+    createHeader?: CreateHeaderCallable;
+    createRow?: CreateRowCallable;
+    createEmpty?: CreateEmptyCallable;
 }
 export declare class DynamicFieldsetElement extends FormFieldElement<DynamicFieldsetElementConfig> {
     constructor(id: string, config: DynamicFieldsetElementConfig);
-    getCreateHeaderElement(): (params: {
-        actions: DynamicFieldsetActions;
-    }) => UIElement<import("@webiny/ui-composer/UIElement").UIElementConfig<any>>;
+    getCreateHeaderElement(): CreateHeaderCallable | undefined;
     setHeaderElement(element: UIElement): void;
     setCreateHeaderElement(cb: DynamicFieldsetElementConfig["createHeader"]): void;
-    getCreateRowElement(): (params: {
-        actions: DynamicFieldsetActions;
-        index: number;
-        row: DynamicFieldsetRowElement;
-    }) => UIElement<import("@webiny/ui-composer/UIElement").UIElementConfig<any>>;
+    getCreateRowElement(): CreateRowCallable | undefined;
     setCreateRowElement(cb: DynamicFieldsetElementConfig["createRow"]): void;
-    getCreateEmptyElement(): (params: {
-        actions: DynamicFieldsetActions;
-    }) => UIElement<import("@webiny/ui-composer/UIElement").UIElementConfig<any>>;
+    getCreateEmptyElement(): CreateEmptyCallable | undefined;
     setEmptyElement(element: UIElement): void;
     setCreateEmptyElement(cb: DynamicFieldsetElementConfig["createEmpty"]): void;
     render(props: FormFieldElementRenderProps): React.ReactNode;

package/ui/elements/form/DynamicFieldsetElement.js

@@ -92,6 +92,10 @@ export var DynamicFieldsetElement = /*#__PURE__*/function (_FormFieldElement) {
             row = _ref.row,
             empty = _ref.empty;
         return /*#__PURE__*/React.createElement(React.Fragment, null, header(function () {
+          if (!createHeader) {
+            return null;
+          }
+
           var headerElement = createHeader({
             actions: actions
           }); // This element is not created via `this.addElement()` API.
@@ -101,6 +105,11 @@ export var DynamicFieldsetElement = /*#__PURE__*/function (_FormFieldElement) {
           return headerElement ? headerElement.render(props) : null;
         }), row(function (_ref2) {
           var index = _ref2.index;
+
+          if (!createRow) {
+            return null;
+          }
+
           var rowElement = createRow({
             actions: actions,
             index: index,
@@ -111,6 +120,10 @@ export var DynamicFieldsetElement = /*#__PURE__*/function (_FormFieldElement) {
           rowElement && rowElement.setParent(_this2);
           return rowElement ? /*#__PURE__*/React.createElement(Grid, null, rowElement.render(props)) : null;
         }), empty(function () {
+          if (!createEmpty) {
+            return null;
+          }
+
           var emptyElement = createEmpty({
             actions: actions
           }); // This element is not created via `this.addElement()` API.

package/ui/elements/form/DynamicFieldsetElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["DynamicFieldsetElement.tsx"],"names":["React","FormFieldElement","DynamicFieldset","Grid","DynamicFieldsetRowElement","DynamicFieldsetElement","id","config","useGrid","applyPlugins","createHeader","element","cb","createRow","createEmpty","props","formProps","Error","Bind","getCreateHeaderElement","getCreateRowElement","getCreateEmptyElement","getName","getDefaultValue","actions","header","row","empty","headerElement","setParent","render","index","rowElement","emptyElement"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport {\n    FormFieldElement,\n    FormFieldElementConfig,\n    FormFieldElementRenderProps\n} from \"~/ui/elements/form/FormFieldElement\";\nimport { UIElement } from \"~/ui/UIElement\";\nimport { DynamicFieldset } from \"@webiny/ui/DynamicFieldset\";\nimport { Grid } from \"@webiny/ui/Grid\";\nimport { DynamicFieldsetRowElement } from \"./DynamicFieldsetElement/DynamicFieldsetRowElement\";\n\ninterface DynamicFieldsetActions {\n    add: (index?: number) => () => void;\n    remove: (index: number) => () => void;\n}\n\ninterface CreateHeaderCallable {\n    (params: { actions: DynamicFieldsetActions }): UIElement;\n}\n\ninterface CreateRowCallable {\n    (params: {\n        actions: DynamicFieldsetActions;\n        index: number;\n        row: DynamicFieldsetRowElement;\n    }): UIElement;\n}\n\ninterface CreateEmptyCallable {\n    (params: { actions: DynamicFieldsetActions }): UIElement;\n}\n\nexport interface DynamicFieldsetElementConfig extends FormFieldElementConfig {\n    createHeader?: CreateHeaderCallable;\n    createRow?: CreateRowCallable;\n    createEmpty?: CreateEmptyCallable;\n}\n\nexport class DynamicFieldsetElement extends FormFieldElement<DynamicFieldsetElementConfig> {\n    public constructor(id: string, config: DynamicFieldsetElementConfig) {\n        super(id, config);\n\n        this.useGrid(false);\n\n        this.applyPlugins(DynamicFieldsetElement);\n    }\n\n    public getCreateHeaderElement() {\n        return this.config.createHeader;\n    }\n\n    public setHeaderElement(element: UIElement): void {\n        this.config.createHeader = () => element;\n    }\n\n    public setCreateHeaderElement(cb: DynamicFieldsetElementConfig[\"createHeader\"]): void {\n        this.config.createHeader = cb;\n    }\n\n    public getCreateRowElement() {\n        return this.config.createRow;\n    }\n\n    public setCreateRowElement(cb: DynamicFieldsetElementConfig[\"createRow\"]): void {\n        this.config.createRow = cb;\n    }\n\n    public getCreateEmptyElement() {\n        return this.config.createEmpty;\n    }\n\n    public setEmptyElement(element: UIElement): void {\n        this.config.createEmpty = () => element;\n    }\n\n    public setCreateEmptyElement(cb: DynamicFieldsetElementConfig[\"createEmpty\"]): void {\n        this.config.createEmpty = cb;\n    }\n\n    public override render(props: FormFieldElementRenderProps): React.ReactNode {\n        if (!props.formProps) {\n            throw Error(`DynamicFieldsetElement must be placed inside of a FormElement.`);\n        }\n\n        const { Bind } = props.formProps;\n        const createHeader = this.getCreateHeaderElement();\n        const createRow = this.getCreateRowElement();\n        const createEmpty = this.getCreateEmptyElement();\n\n        return (\n            <Bind name={this.getName()} defaultValue={this.getDefaultValue(props)}>\n                <DynamicFieldset>\n                    {({ actions, header, row, empty }) => (\n                        <React.Fragment>\n                            {header(() => {\n                                if (!createHeader) {\n                                    return null;\n                                }\n                                const headerElement = createHeader({\n                                    actions: actions as DynamicFieldsetActions\n                                });\n                                // This element is not created via `this.addElement()` API.\n                                // We need to manually give it a parent to enable proper grid rendering.\n                                headerElement && headerElement.setParent(this);\n\n                                return headerElement ? headerElement.render(props) : null;\n                            })}\n                            {row(({ index }) => {\n                                if (!createRow) {\n                                    return null;\n                                }\n                                const rowElement = createRow({\n                                    actions: actions as DynamicFieldsetActions,\n                                    index,\n                                    row: new DynamicFieldsetRowElement(`${this.id}.row.${index}`)\n                                });\n\n                                // This element is not created via `this.addElement()` API.\n                                // We need to manually give it a parent to enable proper grid rendering.\n                                rowElement && rowElement.setParent(this);\n\n                                return rowElement ? <Grid>{rowElement.render(props)}</Grid> : null;\n                            })}\n                            {empty(() => {\n                                if (!createEmpty) {\n                                    return null;\n                                }\n                                const emptyElement = createEmpty({\n                                    actions: actions as DynamicFieldsetActions\n                                });\n\n                                // This element is not created via `this.addElement()` API.\n                                // We need to manually give it a parent to enable proper grid rendering.\n                                emptyElement && emptyElement.setParent(this);\n\n                                return emptyElement ? emptyElement.render(props) : null;\n                            })}\n                        </React.Fragment>\n                    )}\n                </DynamicFieldset>\n            </Bind>\n        );\n    }\n}\n"]}

package/ui/elements/form/FileManagerElement/EmptyStateElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["EmptyStateElement.tsx"],"names":["UIElement","EmptyStateElementRenderer","EmptyStateElement","id","addRenderer"],"mappings":";;;;AAAA,SAASA,SAAT;AACA,SAASC,yBAAT;AAEA,WAAaC,iBAAb;AAAA;;AAAA;;AACI,6BAAmBC,EAAnB,EAA+B;AAAA;;AAAA;;AAC3B,8BAAMA,EAAN;;AAEA,UAAKC,WAAL,CAAiB,IAAIH,yBAAJ,EAAjB;;AAH2B;AAI9B;;AALL;AAAA,EAAuCD,SAAvC","sourcesContent":["import { UIElement } from \"~/ui/UIElement\";\nimport { EmptyStateElementRenderer } from \"./EmptyStateElementRenderer\";\n\nexport class EmptyStateElement extends UIElement<any> {\n    public constructor(id: string) {\n        super(id);\n\n        this.addRenderer(new EmptyStateElementRenderer());\n    }\n}\n"]}

package/ui/elements/form/FileManagerElement/EmptyStateElementRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["EmptyStateElementRenderer.tsx"],"names":["React","UIRenderer","Ui","Image","AddImageIconWrapper","AddImageWrapper","FilePreviewWrapper","RemoveImage","ReactComponent","AddFileIcon","Typography","RemoveImageIcon","EmptyStateElementRenderer","props","accept","fileManagerElement","getAccept","acceptsOnlyImages","every","el","startsWith","renderImageProps","width","height","value","showFileManager","onChange","src","split","pop"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAASC,UAAT;AACA,OAAO,KAAKC,EAAZ,MAAoB,wBAApB;AACA,SAASC,KAAT,QAAsB,wBAAtB;AAEA,SAASC,mBAAT,EAA8BC,eAA9B,EAA+CC,kBAA/C,EAAmEC,WAAnE;AACA,SAASC,cAAc,IAAIC,WAA3B;AACA,SAASC,UAAT,QAA2B,uBAA3B;AACA,SAASF,cAAc,IAAIG,eAA3B,QAAkD,mDAAlD;AAEA,WAAaC,yBAAb;AAAA;;AAAA;;AAAA;AAAA;;AAAA;AAAA;;AAAA;AAAA;AAAA,WAII,sBAEsF;AAAA,UADlFC,KACkF,QADlFA,KACkF;AAClF,UAAMC,MAAM,GAAGD,KAAK,CAACE,kBAAN,CAAyBC,SAAzB,EAAf;AACA,UAAMC,iBAAiB,GAAG,CAACH,MAAD,IAAWA,MAAM,CAACI,KAAP,CAAa,UAAAC,EAAE;AAAA,eAAIA,EAAE,CAACC,UAAH,CAAc,QAAd,CAAJ;AAAA,OAAf,CAArC;;AAEA,UAAIH,iBAAJ,EAAuB;AACnB,4BACI,oBAAC,EAAD,CAAI,KAAJ;AACI,UAAA,WAAW,EAAE,iBADjB;AAEI,UAAA,kBAAkB,EAAE,4BAAAI,gBAAgB;AAAA,gCAAI,oBAAC,KAAD,EAAWA,gBAAX,CAAJ;AAAA,WAFxC;AAGI,UAAA,KAAK,EAAE;AAAEC,YAAAA,KAAK,EAAE,MAAT;AAAiBC,YAAAA,MAAM,EAAE;AAAzB,WAHX;AAII,UAAA,KAAK,EAAEV,KAAK,CAACW,KAJjB;AAKI,UAAA,WAAW,EAAEX,KAAK,CAACY,eALvB;AAMI,UAAA,WAAW,EAAEZ,KAAK,CAACa;AANvB,UADJ;AAUH;;AAED,UAAIb,KAAK,CAACW,KAAV,EAAiB;AACb,4BACI,oBAAC,kBAAD,qBACI,kEACmB,oCAASX,KAAK,CAACW,KAAN,CAAYG,GAAZ,CAAgBC,KAAhB,CAAsB,GAAtB,EAA2BC,GAA3B,EAAT,CADnB,CADJ,eAKI,oBAAC,WAAD;AAAa,UAAA,OAAO,EAAE;AAAA,mBAAMhB,KAAK,CAACa,QAAN,CAAe,IAAf,CAAN;AAAA;AAAtB,wBACI,oBAAC,eAAD,OADJ,CALJ,eASI,oBAAC,eAAD;AAAiB,uBAAW,aAA5B;AAA2C,UAAA,OAAO,EAAEb,KAAK,CAACY;AAA1D,wBACI,oBAAC,mBAAD,qBACI,oBAAC,WAAD,OADJ,eAEI,oBAAC,UAAD;AAAY,UAAA,GAAG,EAAE;AAAjB,2BAFJ,CADJ,CATJ,CADJ;AAkBH;;AAED,0BACI,oBAAC,eAAD;AAAiB,qBAAW,aAA5B;AAA2C,QAAA,OAAO,EAAEZ,KAAK,CAACY;AAA1D,sBACI,oBAAC,mBAAD,qBACI,oBAAC,WAAD,OADJ,eAEI,oBAAC,UAAD;AAAY,QAAA,GAAG,EAAE;AAAjB,yBAFJ,CADJ,CADJ;AAQH;AApDL;;AAAA;AAAA,EAA+CxB,UAA/C","sourcesContent":["import React from \"react\";\nimport { EmptyStateElement } from \"./EmptyStateElement\";\nimport { UIRenderer, UIRenderParams } from \"~/ui/UIRenderer\";\nimport * as Ui from \"@webiny/ui/ImageUpload\";\nimport { Image } from \"@webiny/app/components\";\nimport { FileManagerElementRenderProps } from \"~/ui/elements/form/FileManagerElement/FileManagerElementRenderer\";\nimport { AddImageIconWrapper, AddImageWrapper, FilePreviewWrapper, RemoveImage } from \"./styled\";\nimport { ReactComponent as AddFileIcon } from \"~/assets/icons/attach_file_black_24dp.svg\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport { ReactComponent as RemoveImageIcon } from \"@webiny/ui/ImageUpload/icons/round-close-24px.svg\";\n\nexport class EmptyStateElementRenderer extends UIRenderer<\n    EmptyStateElement,\n    FileManagerElementRenderProps\n> {\n    public override render({\n        props\n    }: UIRenderParams<EmptyStateElement, FileManagerElementRenderProps>): React.ReactNode {\n        const accept = props.fileManagerElement.getAccept();\n        const acceptsOnlyImages = !accept || accept.every(el => el.startsWith(\"image/\"));\n\n        if (acceptsOnlyImages) {\n            return (\n                <Ui.Image\n                    placeholder={\"Select an image\"}\n                    renderImagePreview={renderImageProps => <Image {...renderImageProps} />}\n                    style={{ width: \"100%\", height: \"auto\" }}\n                    value={props.value}\n                    uploadImage={props.showFileManager}\n                    removeImage={props.onChange}\n                />\n            );\n        }\n\n        if (props.value) {\n            return (\n                <FilePreviewWrapper>\n                    <span>\n                        Attached file: <strong>{props.value.src.split(\"/\").pop()}</strong>\n                    </span>\n\n                    <RemoveImage onClick={() => props.onChange(null)}>\n                        <RemoveImageIcon />\n                    </RemoveImage>\n\n                    <AddImageWrapper data-role={\"select-file\"} onClick={props.showFileManager}>\n                        <AddImageIconWrapper>\n                            <AddFileIcon />\n                            <Typography use={\"caption\"}>Select a file</Typography>\n                        </AddImageIconWrapper>\n                    </AddImageWrapper>\n                </FilePreviewWrapper>\n            );\n        }\n\n        return (\n            <AddImageWrapper data-role={\"select-file\"} onClick={props.showFileManager}>\n                <AddImageIconWrapper>\n                    <AddFileIcon />\n                    <Typography use={\"caption\"}>Select a file</Typography>\n                </AddImageIconWrapper>\n            </AddImageWrapper>\n        );\n    }\n}\n"]}