@webiny/app-admin 0.0.0-unstable.496cf268ac → 0.0.0-unstable.606fc9c866

package/base/ui/FileManager.d.ts

@@ -50,7 +50,7 @@ export declare type FileManagerProps = {
      * @deprecated This prop is no longer used. The file structure was reduced to a bare minimum so picking is no longer necessary.
      */
     onChangePick?: string[];
-    onClose?: Function;
+    onClose?: () => void;
     onUploadCompletion?: (files: FileManagerFileItem[]) => void;
     own?: boolean;
     scope?: string;

package/base/ui/FileManager.js.map

@@ -1 +1 @@
-{"version":3,"names":["getPortalTarget","target","window","document","getElementById","createElement","setAttribute","body","appendChild","FileManagerRenderer","makeComposable","FileManager","children","render","onChange","rest","containerRef","useRef","useState","show","setShow","onChangeRef","useEffect","current","showFileManager","useCallback","ReactDOM","createPortal"],"sources":["FileManager.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef, useState } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport { makeComposable } from \"@webiny/react-composition\";\n\nexport interface FileManagerOnChange<T> {\n    (value: T): void;\n}\n\n/**\n * Represents a file object managed by the File Manager.\n */\nexport interface FileManagerFileItem {\n    id: string;\n    src: string;\n    meta?: Array<FileManagerFileItemMetaItem>;\n}\n\n/**\n * With this we allow developers to add any value to file's meta via component composition, thus the `value: any`.\n */\nexport interface FileManagerFileItemMetaItem {\n    key: string;\n    value: any;\n}\n\nexport type DeprecatedFileManagerRenderPropParams = {\n    showFileManager: (\n        onChange?: FileManagerOnChange<FileManagerFileItem | FileManagerFileItem[]>\n    ) => void;\n};\n\nexport type FileManagerRenderPropParams<TValue> = {\n    showFileManager: (onChange?: FileManagerOnChange<TValue>) => void;\n};\n\ninterface SingleFileRenderProp {\n    (params: FileManagerRenderPropParams<FileManagerFileItem>): React.ReactNode;\n}\n\ninterface MultiFileRenderProp {\n    (params: FileManagerRenderPropParams<FileManagerFileItem[]>): React.ReactNode;\n}\n\nexport type MultipleProps =\n    | {\n          multiple?: never;\n          multipleMaxCount?: never;\n          multipleMaxSize?: never;\n          onChange?: FileManagerOnChange<FileManagerFileItem>;\n          render?: SingleFileRenderProp;\n      }\n    | {\n          multiple: true;\n          multipleMaxCount?: number;\n          multipleMaxSize?: number | string;\n          onChange?: FileManagerOnChange<FileManagerFileItem[]>;\n          render?: MultiFileRenderProp;\n      };\n\nexport type FileManagerProps = {\n    accept?: Array<string>;\n    images?: boolean;\n    maxSize?: number | string;\n    /**\n     * @deprecated This prop is no longer used. The file structure was reduced to a bare minimum so picking is no longer necessary.\n     */\n    onChangePick?: string[];\n    onClose?: Function;\n    onUploadCompletion?: (files: FileManagerFileItem[]) => void;\n    own?: boolean;\n    scope?: string;\n    tags?: Array<string>;\n    /**\n     * @deprecated This prop is no longer used. Use the `render` prop to get better TS autocomplete.\n     */\n    children?: (params: DeprecatedFileManagerRenderPropParams) => React.ReactNode;\n} & MultipleProps;\n\nfunction getPortalTarget() {\n    let target = window.document.getElementById(\"file-manager-container\");\n    if (!target) {\n        target = document.createElement(\"div\");\n        target.setAttribute(\"id\", \"file-manager-container\");\n        document.body && document.body.appendChild(target);\n    }\n    return target;\n}\n\n// This jewel was taken from https://davidgomes.com/pick-omit-over-union-types-in-typescript/. Massive thanks, David!\ntype DistributiveOmit<T, K extends keyof T> = T extends unknown ? Omit<T, K> : never;\n\nexport type FileManagerRendererProps = DistributiveOmit<FileManagerProps, \"render\" | \"children\">;\n\nexport const FileManagerRenderer = makeComposable<FileManagerRendererProps>(\"FileManagerRenderer\");\n\nexport const FileManager: React.FC<FileManagerProps> = ({\n    children,\n    render,\n    onChange,\n    ...rest\n}) => {\n    const containerRef = useRef<HTMLElement>(getPortalTarget());\n    const [show, setShow] = useState(false);\n    const onChangeRef = useRef(onChange);\n\n    useEffect(() => {\n        onChangeRef.current = onChange;\n    }, [onChange]);\n\n    const showFileManager = useCallback(onChange => {\n        if (typeof onChange === \"function\") {\n            onChangeRef.current = onChange;\n        }\n        setShow(true);\n    }, []);\n\n    return (\n        <>\n            {show &&\n                ReactDOM.createPortal(\n                    <FileManagerRenderer\n                        onClose={() => setShow(false)}\n                        onChange={\n                            /* TODO: figure out how to create a conditional type based on the value of `rest.multiple` */\n                            onChangeRef.current as any\n                        }\n                        {...rest}\n                    />,\n                    containerRef.current\n                )}\n            {children ? children({ showFileManager }) : render ? render({ showFileManager }) : null}\n        </>\n    );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AAA2D;AA4E3D,SAASA,eAAe,GAAG;EACvB,IAAIC,MAAM,GAAGC,MAAM,CAACC,QAAQ,CAACC,cAAc,CAAC,wBAAwB,CAAC;EACrE,IAAI,CAACH,MAAM,EAAE;IACTA,MAAM,GAAGE,QAAQ,CAACE,aAAa,CAAC,KAAK,CAAC;IACtCJ,MAAM,CAACK,YAAY,CAAC,IAAI,EAAE,wBAAwB,CAAC;IACnDH,QAAQ,CAACI,IAAI,IAAIJ,QAAQ,CAACI,IAAI,CAACC,WAAW,CAACP,MAAM,CAAC;EACtD;EACA,OAAOA,MAAM;AACjB;;AAEA;;AAKO,IAAMQ,mBAAmB,GAAG,IAAAC,gCAAc,EAA2B,qBAAqB,CAAC;AAAC;AAE5F,IAAMC,WAAuC,GAAG,SAA1CA,WAAuC,OAK9C;EAAA,IAJFC,QAAQ,QAARA,QAAQ;IACRC,MAAM,QAANA,MAAM;IACNC,QAAQ,QAARA,QAAQ;IACLC,IAAI;EAEP,IAAMC,YAAY,GAAG,IAAAC,aAAM,EAAcjB,eAAe,EAAE,CAAC;EAC3D,gBAAwB,IAAAkB,eAAQ,EAAC,KAAK,CAAC;IAAA;IAAhCC,IAAI;IAAEC,OAAO;EACpB,IAAMC,WAAW,GAAG,IAAAJ,aAAM,EAACH,QAAQ,CAAC;EAEpC,IAAAQ,gBAAS,EAAC,YAAM;IACZD,WAAW,CAACE,OAAO,GAAGT,QAAQ;EAClC,CAAC,EAAE,CAACA,QAAQ,CAAC,CAAC;EAEd,IAAMU,eAAe,GAAG,IAAAC,kBAAW,EAAC,UAAAX,QAAQ,EAAI;IAC5C,IAAI,OAAOA,QAAQ,KAAK,UAAU,EAAE;MAChCO,WAAW,CAACE,OAAO,GAAGT,QAAQ;IAClC;IACAM,OAAO,CAAC,IAAI,CAAC;EACjB,CAAC,EAAE,EAAE,CAAC;EAEN,oBACI,4DACKD,IAAI,iBACDO,iBAAQ,CAACC,YAAY,eACjB,6BAAC,mBAAmB;IAChB,OAAO,EAAE;MAAA,OAAMP,OAAO,CAAC,KAAK,CAAC;IAAA,CAAC;IAC9B,QAAQ,EACJ;IACAC,WAAW,CAACE;EACf,GACGR,IAAI,EACV,EACFC,YAAY,CAACO,OAAO,CACvB,EACJX,QAAQ,GAAGA,QAAQ,CAAC;IAAEY,eAAe,EAAfA;EAAgB,CAAC,CAAC,GAAGX,MAAM,GAAGA,MAAM,CAAC;IAAEW,eAAe,EAAfA;EAAgB,CAAC,CAAC,GAAG,IAAI,CACxF;AAEX,CAAC;AAAC"}
+{"version":3,"names":["getPortalTarget","target","window","document","getElementById","createElement","setAttribute","body","appendChild","FileManagerRenderer","makeComposable","FileManager","children","render","onChange","rest","containerRef","useRef","useState","show","setShow","onChangeRef","useEffect","current","showFileManager","useCallback","ReactDOM","createPortal"],"sources":["FileManager.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef, useState } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport { makeComposable } from \"@webiny/react-composition\";\n\nexport interface FileManagerOnChange<T> {\n    (value: T): void;\n}\n\n/**\n * Represents a file object managed by the File Manager.\n */\nexport interface FileManagerFileItem {\n    id: string;\n    src: string;\n    meta?: Array<FileManagerFileItemMetaItem>;\n}\n\n/**\n * With this we allow developers to add any value to file's meta via component composition, thus the `value: any`.\n */\nexport interface FileManagerFileItemMetaItem {\n    key: string;\n    value: any;\n}\n\nexport type DeprecatedFileManagerRenderPropParams = {\n    showFileManager: (\n        onChange?: FileManagerOnChange<FileManagerFileItem | FileManagerFileItem[]>\n    ) => void;\n};\n\nexport type FileManagerRenderPropParams<TValue> = {\n    showFileManager: (onChange?: FileManagerOnChange<TValue>) => void;\n};\n\ninterface SingleFileRenderProp {\n    (params: FileManagerRenderPropParams<FileManagerFileItem>): React.ReactNode;\n}\n\ninterface MultiFileRenderProp {\n    (params: FileManagerRenderPropParams<FileManagerFileItem[]>): React.ReactNode;\n}\n\nexport type MultipleProps =\n    | {\n          multiple?: never;\n          multipleMaxCount?: never;\n          multipleMaxSize?: never;\n          onChange?: FileManagerOnChange<FileManagerFileItem>;\n          render?: SingleFileRenderProp;\n      }\n    | {\n          multiple: true;\n          multipleMaxCount?: number;\n          multipleMaxSize?: number | string;\n          onChange?: FileManagerOnChange<FileManagerFileItem[]>;\n          render?: MultiFileRenderProp;\n      };\n\nexport type FileManagerProps = {\n    accept?: Array<string>;\n    images?: boolean;\n    maxSize?: number | string;\n    /**\n     * @deprecated This prop is no longer used. The file structure was reduced to a bare minimum so picking is no longer necessary.\n     */\n    onChangePick?: string[];\n    onClose?: () => void;\n    onUploadCompletion?: (files: FileManagerFileItem[]) => void;\n    own?: boolean;\n    scope?: string;\n    tags?: Array<string>;\n    /**\n     * @deprecated This prop is no longer used. Use the `render` prop to get better TS autocomplete.\n     */\n    children?: (params: DeprecatedFileManagerRenderPropParams) => React.ReactNode;\n} & MultipleProps;\n\nfunction getPortalTarget() {\n    let target = window.document.getElementById(\"file-manager-container\");\n    if (!target) {\n        target = document.createElement(\"div\");\n        target.setAttribute(\"id\", \"file-manager-container\");\n        document.body && document.body.appendChild(target);\n    }\n    return target;\n}\n\n// This jewel was taken from https://davidgomes.com/pick-omit-over-union-types-in-typescript/. Massive thanks, David!\ntype DistributiveOmit<T, K extends keyof T> = T extends unknown ? Omit<T, K> : never;\n\nexport type FileManagerRendererProps = DistributiveOmit<FileManagerProps, \"render\" | \"children\">;\n\nexport const FileManagerRenderer = makeComposable<FileManagerRendererProps>(\"FileManagerRenderer\");\n\nexport const FileManager: React.FC<FileManagerProps> = ({\n    children,\n    render,\n    onChange,\n    ...rest\n}) => {\n    const containerRef = useRef<HTMLElement>(getPortalTarget());\n    const [show, setShow] = useState(false);\n    const onChangeRef = useRef(onChange);\n\n    useEffect(() => {\n        onChangeRef.current = onChange;\n    }, [onChange]);\n\n    const showFileManager = useCallback(onChange => {\n        if (typeof onChange === \"function\") {\n            onChangeRef.current = onChange;\n        }\n        setShow(true);\n    }, []);\n\n    return (\n        <>\n            {show &&\n                ReactDOM.createPortal(\n                    <FileManagerRenderer\n                        onClose={() => setShow(false)}\n                        onChange={\n                            /* TODO: figure out how to create a conditional type based on the value of `rest.multiple` */\n                            onChangeRef.current as any\n                        }\n                        {...rest}\n                    />,\n                    containerRef.current\n                )}\n            {children ? children({ showFileManager }) : render ? render({ showFileManager }) : null}\n        </>\n    );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AAA2D;AA4E3D,SAASA,eAAe,GAAG;EACvB,IAAIC,MAAM,GAAGC,MAAM,CAACC,QAAQ,CAACC,cAAc,CAAC,wBAAwB,CAAC;EACrE,IAAI,CAACH,MAAM,EAAE;IACTA,MAAM,GAAGE,QAAQ,CAACE,aAAa,CAAC,KAAK,CAAC;IACtCJ,MAAM,CAACK,YAAY,CAAC,IAAI,EAAE,wBAAwB,CAAC;IACnDH,QAAQ,CAACI,IAAI,IAAIJ,QAAQ,CAACI,IAAI,CAACC,WAAW,CAACP,MAAM,CAAC;EACtD;EACA,OAAOA,MAAM;AACjB;;AAEA;;AAKO,IAAMQ,mBAAmB,GAAG,IAAAC,gCAAc,EAA2B,qBAAqB,CAAC;AAAC;AAE5F,IAAMC,WAAuC,GAAG,SAA1CA,WAAuC,OAK9C;EAAA,IAJFC,QAAQ,QAARA,QAAQ;IACRC,MAAM,QAANA,MAAM;IACNC,QAAQ,QAARA,QAAQ;IACLC,IAAI;EAEP,IAAMC,YAAY,GAAG,IAAAC,aAAM,EAAcjB,eAAe,EAAE,CAAC;EAC3D,gBAAwB,IAAAkB,eAAQ,EAAC,KAAK,CAAC;IAAA;IAAhCC,IAAI;IAAEC,OAAO;EACpB,IAAMC,WAAW,GAAG,IAAAJ,aAAM,EAACH,QAAQ,CAAC;EAEpC,IAAAQ,gBAAS,EAAC,YAAM;IACZD,WAAW,CAACE,OAAO,GAAGT,QAAQ;EAClC,CAAC,EAAE,CAACA,QAAQ,CAAC,CAAC;EAEd,IAAMU,eAAe,GAAG,IAAAC,kBAAW,EAAC,UAAAX,QAAQ,EAAI;IAC5C,IAAI,OAAOA,QAAQ,KAAK,UAAU,EAAE;MAChCO,WAAW,CAACE,OAAO,GAAGT,QAAQ;IAClC;IACAM,OAAO,CAAC,IAAI,CAAC;EACjB,CAAC,EAAE,EAAE,CAAC;EAEN,oBACI,4DACKD,IAAI,iBACDO,iBAAQ,CAACC,YAAY,eACjB,6BAAC,mBAAmB;IAChB,OAAO,EAAE;MAAA,OAAMP,OAAO,CAAC,KAAK,CAAC;IAAA,CAAC;IAC9B,QAAQ,EACJ;IACAC,WAAW,CAACE;EACf,GACGR,IAAI,EACV,EACFC,YAAY,CAACO,OAAO,CACvB,EACJX,QAAQ,GAAGA,QAAQ,CAAC;IAAEY,eAAe,EAAfA;EAAgB,CAAC,CAAC,GAAGX,MAAM,GAAGA,MAAM,CAAC;IAAEW,eAAe,EAAfA;EAAgB,CAAC,CAAC,GAAG,IAAI,CACxF;AAEX,CAAC;AAAC"}

package/components/OverlayLayout/OverlayLayout.js

@@ -36,7 +36,7 @@ var OverlayLayoutWrapper = /*#__PURE__*/(0, _styled.default)("div", {
    * Has to be higher than 5 so it's above advanced settings dialog,
    * and below 20, so the image editor & Dialogs can be displayed above.
    */
-  zIndex: 18,
+  zIndex: 21,
   paddingTop: 65,
   top: 0,
   left: 0

package/components/OverlayLayout/OverlayLayout.js.map

@@ -1 +1 @@
-{"version":3,"names":["OverlayLayoutWrapper","styled","position","width","height","backgroundColor","zIndex","paddingTop","top","left","noScroll","css","overflow","defaultStyle","transform","opacity","transitionProperty","transitionTimingFunction","transitionDuration","willChange","transitionStyles","entering","entered","OverlayLayout","props","isVisible","document","body","classList","add","setState","OverlayView","openedViews","remove","onExited","barLeft","barMiddle","barRight","children","style","rest","state","hideComponent","React","Component","noop"],"sources":["OverlayLayout.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Transition } from \"react-transition-group\";\nimport styled from \"@emotion/styled\";\nimport { css } from \"emotion\";\nimport { TopAppBarSecondary, TopAppBarSection } from \"@webiny/ui/TopAppBar\";\nimport { IconButton } from \"@webiny/ui/Button\";\nimport noop from \"lodash/noop\";\n\nimport { ReactComponent as CloseIcon } from \"@material-design-icons/svg/outlined/close.svg\";\nimport { OverlayView } from \"~/ui/views/OverlayView\";\nimport { ExitHandler } from \"react-transition-group/Transition\";\n\nconst OverlayLayoutWrapper = styled(\"div\")({\n    position: \"fixed\",\n    width: \"100%\",\n    height: \"100vh\",\n    backgroundColor: \"var(--mdc-theme-background)\",\n    /**\n     * Has to be higher than 5 so it's above advanced settings dialog,\n     * and below 20, so the image editor & Dialogs can be displayed above.\n     */\n    zIndex: 18,\n    paddingTop: 65,\n    top: 0,\n    left: 0\n});\n\nconst noScroll = css({\n    overflow: \"hidden\",\n    height: \"100vh\"\n});\n\nconst defaultStyle = {\n    transform: \"translateY(75vh)\",\n    opacity: 0,\n    transitionProperty: \"transform, opacity\",\n    transitionTimingFunction: \"cubic-bezier(0, 0, .2, 1)\",\n    transitionDuration: \"225ms\",\n    willChange: \"opacity, transform\"\n};\n\nconst transitionStyles: Record<string, any> = {\n    entering: {\n        transform: \"translateY(75vh)\",\n        opacity: 0\n    },\n    entered: {\n        transform: \"translateY(0px)\",\n        opacity: 1\n    }\n};\n\nexport interface OverlayLayoutProps {\n    barMiddle?: React.ReactNode;\n    barLeft?: React.ReactNode;\n    barRight?: React.ReactNode;\n    children: React.ReactNode;\n    onExited?: ExitHandler<HTMLElement>;\n    style?: React.CSSProperties;\n}\n\ninterface OverlayLayoutState {\n    isVisible: boolean;\n}\n\nexport class OverlayLayout extends React.Component<OverlayLayoutProps, OverlayLayoutState> {\n    constructor(props: OverlayLayoutProps) {\n        super(props);\n        document.body.classList.add(noScroll);\n    }\n\n    static defaultProps: Partial<OverlayLayoutProps> = {\n        onExited: noop\n    };\n\n    public override state: OverlayLayoutState = {\n        isVisible: true\n    };\n\n    public hideComponent(): void {\n        this.setState({ isVisible: false });\n        if (OverlayView.openedViews === 0) {\n            document.body.classList.remove(noScroll);\n        }\n    }\n\n    public override componentWillUnmount(): void {\n        if (OverlayView.openedViews === 0) {\n            document.body.classList.remove(noScroll);\n        }\n    }\n\n    public override render() {\n        const { onExited, barLeft, barMiddle, barRight, children, style, ...rest } = this.props;\n\n        return (\n            <Transition in={this.state.isVisible} timeout={100} appear onExited={onExited}>\n                {state => (\n                    <OverlayLayoutWrapper\n                        {...rest}\n                        style={{ ...defaultStyle, ...style, ...transitionStyles[state] }}\n                    >\n                        <TopAppBarSecondary fixed style={{ top: 0 }}>\n                            <TopAppBarSection style={{ width: \"33%\" }} alignStart>\n                                {barLeft}\n                            </TopAppBarSection>\n                            <TopAppBarSection style={{ width: \"33%\" }}>\n                                {barMiddle}\n                            </TopAppBarSection>\n                            <TopAppBarSection style={{ width: \"33%\" }} alignEnd>\n                                {barRight}\n                                <IconButton\n                                    ripple={false}\n                                    onClick={() => this.hideComponent()}\n                                    icon={<CloseIcon style={{ width: 24, height: 24 }} />}\n                                />\n                            </TopAppBarSection>\n                        </TopAppBarSecondary>\n\n                        {children}\n                    </OverlayLayoutWrapper>\n                )}\n            </Transition>\n        );\n    }\n}\n"],"mappings":"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"}
+{"version":3,"names":["OverlayLayoutWrapper","styled","position","width","height","backgroundColor","zIndex","paddingTop","top","left","noScroll","css","overflow","defaultStyle","transform","opacity","transitionProperty","transitionTimingFunction","transitionDuration","willChange","transitionStyles","entering","entered","OverlayLayout","props","isVisible","document","body","classList","add","setState","OverlayView","openedViews","remove","onExited","barLeft","barMiddle","barRight","children","style","rest","state","hideComponent","React","Component","noop"],"sources":["OverlayLayout.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Transition } from \"react-transition-group\";\nimport styled from \"@emotion/styled\";\nimport { css } from \"emotion\";\nimport { TopAppBarSecondary, TopAppBarSection } from \"@webiny/ui/TopAppBar\";\nimport { IconButton } from \"@webiny/ui/Button\";\nimport noop from \"lodash/noop\";\n\nimport { ReactComponent as CloseIcon } from \"@material-design-icons/svg/outlined/close.svg\";\nimport { OverlayView } from \"~/ui/views/OverlayView\";\nimport { ExitHandler } from \"react-transition-group/Transition\";\n\nconst OverlayLayoutWrapper = styled(\"div\")({\n    position: \"fixed\",\n    width: \"100%\",\n    height: \"100vh\",\n    backgroundColor: \"var(--mdc-theme-background)\",\n    /**\n     * Has to be higher than 5 so it's above advanced settings dialog,\n     * and below 20, so the image editor & Dialogs can be displayed above.\n     */\n    zIndex: 21,\n    paddingTop: 65,\n    top: 0,\n    left: 0\n});\n\nconst noScroll = css({\n    overflow: \"hidden\",\n    height: \"100vh\"\n});\n\nconst defaultStyle = {\n    transform: \"translateY(75vh)\",\n    opacity: 0,\n    transitionProperty: \"transform, opacity\",\n    transitionTimingFunction: \"cubic-bezier(0, 0, .2, 1)\",\n    transitionDuration: \"225ms\",\n    willChange: \"opacity, transform\"\n};\n\nconst transitionStyles: Record<string, any> = {\n    entering: {\n        transform: \"translateY(75vh)\",\n        opacity: 0\n    },\n    entered: {\n        transform: \"translateY(0px)\",\n        opacity: 1\n    }\n};\n\nexport interface OverlayLayoutProps {\n    barMiddle?: React.ReactNode;\n    barLeft?: React.ReactNode;\n    barRight?: React.ReactNode;\n    children: React.ReactNode;\n    onExited?: ExitHandler<HTMLElement>;\n    style?: React.CSSProperties;\n}\n\ninterface OverlayLayoutState {\n    isVisible: boolean;\n}\n\nexport class OverlayLayout extends React.Component<OverlayLayoutProps, OverlayLayoutState> {\n    constructor(props: OverlayLayoutProps) {\n        super(props);\n        document.body.classList.add(noScroll);\n    }\n\n    static defaultProps: Partial<OverlayLayoutProps> = {\n        onExited: noop\n    };\n\n    public override state: OverlayLayoutState = {\n        isVisible: true\n    };\n\n    public hideComponent(): void {\n        this.setState({ isVisible: false });\n        if (OverlayView.openedViews === 0) {\n            document.body.classList.remove(noScroll);\n        }\n    }\n\n    public override componentWillUnmount(): void {\n        if (OverlayView.openedViews === 0) {\n            document.body.classList.remove(noScroll);\n        }\n    }\n\n    public override render() {\n        const { onExited, barLeft, barMiddle, barRight, children, style, ...rest } = this.props;\n\n        return (\n            <Transition in={this.state.isVisible} timeout={100} appear onExited={onExited}>\n                {state => (\n                    <OverlayLayoutWrapper\n                        {...rest}\n                        style={{ ...defaultStyle, ...style, ...transitionStyles[state] }}\n                    >\n                        <TopAppBarSecondary fixed style={{ top: 0 }}>\n                            <TopAppBarSection style={{ width: \"33%\" }} alignStart>\n                                {barLeft}\n                            </TopAppBarSection>\n                            <TopAppBarSection style={{ width: \"33%\" }}>\n                                {barMiddle}\n                            </TopAppBarSection>\n                            <TopAppBarSection style={{ width: \"33%\" }} alignEnd>\n                                {barRight}\n                                <IconButton\n                                    ripple={false}\n                                    onClick={() => this.hideComponent()}\n                                    icon={<CloseIcon style={{ width: 24, height: 24 }} />}\n                                />\n                            </TopAppBarSection>\n                        </TopAppBarSecondary>\n\n                        {children}\n                    </OverlayLayoutWrapper>\n                )}\n            </Transition>\n        );\n    }\n}\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@webiny/app-admin",
-	"version": "0.0.0-unstable.496cf268ac",
+	"version": "0.0.0-unstable.606fc9c866",
 	"main": "index.js",
 	"description": "A collection of plugins that together form a complete admin interface, customizable and extensible with Webiny apps and plugins.",
 	"repository": {
@@ -14,23 +14,23 @@
 		"@apollo/react-hooks": "3.1.5",
 		"@babel/runtime": "7.20.13",
 		"@editorjs/editorjs": "2.26.5",
-		"@emotion/react": "11.10.6",
+		"@emotion/react": "11.10.8",
 		"@emotion/styled": "11.10.6",
 		"@material-design-icons/svg": "0.14.3",
 		"@svgr/webpack": "6.5.1",
 		"@types/mime": "2.0.3",
 		"@types/react": "17.0.39",
-		"@webiny/app": "0.0.0-unstable.496cf268ac",
-		"@webiny/app-security": "0.0.0-unstable.496cf268ac",
-		"@webiny/app-wcp": "0.0.0-unstable.496cf268ac",
-		"@webiny/form": "0.0.0-unstable.496cf268ac",
-		"@webiny/plugins": "0.0.0-unstable.496cf268ac",
-		"@webiny/react-composition": "0.0.0-unstable.496cf268ac",
-		"@webiny/react-router": "0.0.0-unstable.496cf268ac",
-		"@webiny/telemetry": "0.0.0-unstable.496cf268ac",
-		"@webiny/ui": "0.0.0-unstable.496cf268ac",
-		"@webiny/ui-composer": "0.0.0-unstable.496cf268ac",
-		"@webiny/validation": "0.0.0-unstable.496cf268ac",
+		"@webiny/app": "0.0.0-unstable.606fc9c866",
+		"@webiny/app-security": "0.0.0-unstable.606fc9c866",
+		"@webiny/app-wcp": "0.0.0-unstable.606fc9c866",
+		"@webiny/form": "0.0.0-unstable.606fc9c866",
+		"@webiny/plugins": "0.0.0-unstable.606fc9c866",
+		"@webiny/react-composition": "0.0.0-unstable.606fc9c866",
+		"@webiny/react-router": "0.0.0-unstable.606fc9c866",
+		"@webiny/telemetry": "0.0.0-unstable.606fc9c866",
+		"@webiny/ui": "0.0.0-unstable.606fc9c866",
+		"@webiny/ui-composer": "0.0.0-unstable.606fc9c866",
+		"@webiny/validation": "0.0.0-unstable.606fc9c866",
 		"apollo-cache": "1.3.5",
 		"apollo-client": "2.6.10",
 		"apollo-link": "1.2.14",
@@ -60,8 +60,8 @@
 		"@types/bytes": "^3.1.1",
 		"@types/graphlib": "^2.1.8",
 		"@types/store": "^2.0.2",
-		"@webiny/cli": "^0.0.0-unstable.496cf268ac",
-		"@webiny/project-utils": "^0.0.0-unstable.496cf268ac",
+		"@webiny/cli": "^0.0.0-unstable.606fc9c866",
+		"@webiny/project-utils": "^0.0.0-unstable.606fc9c866",
 		"babel-plugin-emotion": "^9.2.8",
 		"babel-plugin-lodash": "^3.3.4",
 		"rimraf": "^3.0.2",
@@ -88,5 +88,5 @@
 			]
 		}
 	},
-	"gitHead": "496cf268acd5b092c860b62d75c7d765c9472043"
+	"gitHead": "606fc9c866aec436f24983abc9bdaf02af2b8746"
 }

package/types.d.ts

@@ -81,7 +81,9 @@ export interface FileItem {
     createdOn: string;
     createdBy: {
         id: string;
+        displayName: string;
     };
+    meta?: Record<string, any>;
 }
 export interface FileManagerSecurityPermission extends SecurityPermission {
     rwd?: string;

package/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport { Plugin } from \"@webiny/plugins/types\";\nimport { ApolloClient } from \"apollo-client\";\nimport { ItemProps, MenuProps, SectionProps } from \"~/plugins/MenuPlugin\";\n\nexport type AdminGlobalSearchPlugin = Plugin & {\n    type: \"admin-global-search\";\n    label: string;\n    route: string;\n    search?: {\n        operator?: \"and\" | \"or\";\n        fields?: Array<string>;\n    };\n};\n\nexport type AdminGlobalSearchPreventHotkeyPlugin = Plugin & {\n    type: \"admin-global-search-prevent-hotkey\";\n    preventOpen(e: React.KeyboardEvent): boolean | void;\n};\n\n/**\n * LEGACY TYPE. Only for backwards compatibility.\n */\nexport type AdminMenuLogoPlugin = Plugin & {\n    name: \"admin-menu-logo\";\n    type: \"admin-menu-logo\";\n    render(): React.ReactElement;\n};\n\n/**\n * Enables adding custom menu sections and items in the main menu, located on the left side of the screen.\n * @see https://docs.webiny.com/docs/webiny-apps/admin/development/plugins-reference/app#admin-menu\n */\nexport type AdminMenuPlugin = Plugin & {\n    type: \"admin-menu\";\n    render(props: {\n        Menu: React.ComponentType<MenuProps>;\n        Section: React.ComponentType<SectionProps>;\n        Item: React.ComponentType<ItemProps>;\n    }): React.ReactNode;\n    order?: number;\n};\n\nexport interface AdminFileManagerFileTypePluginRenderParams {\n    file: FileItem;\n}\nexport type AdminFileManagerFileTypePlugin = Plugin & {\n    type: \"admin-file-manager-file-type\";\n    types: string[];\n    render(params: AdminFileManagerFileTypePluginRenderParams): React.ReactNode;\n    fileDetails?: {\n        actions: Array<React.FC | React.Component>;\n    };\n};\n\nexport interface AdminInstallationPluginRenderParams {\n    onInstalled: () => Promise<void>;\n}\nexport type AdminInstallationPlugin = Plugin & {\n    type: \"admin-installation\";\n    getInstalledVersion(params: { client: ApolloClient<object> }): Promise<string | null>;\n    title: string;\n    dependencies?: string[];\n    secure: boolean;\n    render(params: AdminInstallationPluginRenderParams): React.ReactNode;\n};\n\nexport type AdminAppPermissionRendererPlugin = Plugin & {\n    type: \"admin-app-permissions-renderer\";\n    system?: boolean;\n    render(params: any): ReactElement;\n};\n\nimport { SecurityPermission } from \"@webiny/app-security/types\";\n\n/**\n * Represents a file as we receive from the GraphQL API.\n */\nexport interface FileItem {\n    id: string;\n    name: string;\n    key: string;\n    src: string;\n    size: number;\n    type: string;\n    tags: string[];\n    aliases: string[];\n    createdOn: string;\n    createdBy: {\n        id: string;\n    };\n}\n\nexport interface FileManagerSecurityPermission extends SecurityPermission {\n    rwd?: string;\n    own?: boolean;\n}\n"],"mappings":""}
+{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport { Plugin } from \"@webiny/plugins/types\";\nimport { ApolloClient } from \"apollo-client\";\nimport { ItemProps, MenuProps, SectionProps } from \"~/plugins/MenuPlugin\";\n\nexport type AdminGlobalSearchPlugin = Plugin & {\n    type: \"admin-global-search\";\n    label: string;\n    route: string;\n    search?: {\n        operator?: \"and\" | \"or\";\n        fields?: Array<string>;\n    };\n};\n\nexport type AdminGlobalSearchPreventHotkeyPlugin = Plugin & {\n    type: \"admin-global-search-prevent-hotkey\";\n    preventOpen(e: React.KeyboardEvent): boolean | void;\n};\n\n/**\n * LEGACY TYPE. Only for backwards compatibility.\n */\nexport type AdminMenuLogoPlugin = Plugin & {\n    name: \"admin-menu-logo\";\n    type: \"admin-menu-logo\";\n    render(): React.ReactElement;\n};\n\n/**\n * Enables adding custom menu sections and items in the main menu, located on the left side of the screen.\n * @see https://docs.webiny.com/docs/webiny-apps/admin/development/plugins-reference/app#admin-menu\n */\nexport type AdminMenuPlugin = Plugin & {\n    type: \"admin-menu\";\n    render(props: {\n        Menu: React.ComponentType<MenuProps>;\n        Section: React.ComponentType<SectionProps>;\n        Item: React.ComponentType<ItemProps>;\n    }): React.ReactNode;\n    order?: number;\n};\n\nexport interface AdminFileManagerFileTypePluginRenderParams {\n    file: FileItem;\n}\nexport type AdminFileManagerFileTypePlugin = Plugin & {\n    type: \"admin-file-manager-file-type\";\n    types: string[];\n    render(params: AdminFileManagerFileTypePluginRenderParams): React.ReactNode;\n    fileDetails?: {\n        actions: Array<React.FC | React.Component>;\n    };\n};\n\nexport interface AdminInstallationPluginRenderParams {\n    onInstalled: () => Promise<void>;\n}\nexport type AdminInstallationPlugin = Plugin & {\n    type: \"admin-installation\";\n    getInstalledVersion(params: { client: ApolloClient<object> }): Promise<string | null>;\n    title: string;\n    dependencies?: string[];\n    secure: boolean;\n    render(params: AdminInstallationPluginRenderParams): React.ReactNode;\n};\n\nexport type AdminAppPermissionRendererPlugin = Plugin & {\n    type: \"admin-app-permissions-renderer\";\n    system?: boolean;\n    render(params: any): ReactElement;\n};\n\nimport { SecurityPermission } from \"@webiny/app-security/types\";\n\n/**\n * Represents a file as we receive from the GraphQL API.\n */\nexport interface FileItem {\n    id: string;\n    name: string;\n    key: string;\n    src: string;\n    size: number;\n    type: string;\n    tags: string[];\n    aliases: string[];\n    createdOn: string;\n    createdBy: {\n        id: string;\n        displayName: string;\n    };\n    meta?: Record<string, any>;\n}\n\nexport interface FileManagerSecurityPermission extends SecurityPermission {\n    rwd?: string;\n    own?: boolean;\n}\n"],"mappings":""}

package/ui/views/OverlayView.js

@@ -37,7 +37,7 @@ var OverlayLayoutWrapper = /*#__PURE__*/(0, _styled.default)("div", {
    * Has to be higher than 5 so it's above advanced settings dialog,
    * and below 20, so the image editor & Dialogs can be displayed above.
    */
-  zIndex: 18,
+  zIndex: 21,
   top: 0,
   left: 0
 });

package/ui/views/OverlayView.js.map

@@ -1 +1 @@
-{"version":3,"names":["OverlayLayoutWrapper","styled","position","width","height","backgroundColor","zIndex","top","left","defaultStyle","transform","opacity","transitionProperty","transitionTimingFunction","transitionDuration","willChange","transitionStyles","entering","entered","OverlayView","id","useGrid","addHookDefinition","useOverlayView","addElement","HeaderElement","onClose","setIsVisible","ContentElement","applyPlugins","title","getHeaderElement","setTitle","_onEntered","reverse","forEach","cb","_onExited","push","getHook","visible","getOverlayHook","getElement","props","isVisible","onExited","onEntered","state","UIView"],"sources":["OverlayView.tsx"],"sourcesContent":["import React from \"react\";\nimport { Transition } from \"react-transition-group\";\nimport styled from \"@emotion/styled\";\nimport { UIView, UIViewProps } from \"~/ui/UIView\";\nimport { UseOverlayView, useOverlayView } from \"./OverlayView/useOverlayView\";\nimport { HeaderElement } from \"./OverlayView/HeaderElement\";\nimport { ContentElement } from \"./OverlayView/ContentElement\";\n\n// !GOOD FIRST ISSUE!\n// Extract rendering and styling into an OverlayViewRenderer class.\n\nconst OverlayLayoutWrapper = styled(\"div\")({\n    position: \"fixed\",\n    width: \"100%\",\n    height: \"100vh\",\n    backgroundColor: \"var(--mdc-theme-background)\",\n    /**\n     * Has to be higher than 5 so it's above advanced settings dialog,\n     * and below 20, so the image editor & Dialogs can be displayed above.\n     */\n    zIndex: 18,\n    top: 0,\n    left: 0\n});\n\nconst defaultStyle: Record<string, string | number> = {\n    transform: \"translateY(75vh)\",\n    opacity: 0,\n    transitionProperty: \"transform, opacity\",\n    transitionTimingFunction: \"cubic-bezier(0, 0, .2, 1)\",\n    transitionDuration: \"225ms\",\n    willChange: \"opacity, transform\"\n};\n\nconst transitionStyles: Record<string, any> = {\n    entering: {\n        transform: \"translateY(75vh)\",\n        opacity: 0\n    },\n    entered: {\n        transform: \"translateY(0px)\",\n        opacity: 1\n    }\n};\n\ninterface OnExited {\n    (view: OverlayView): void;\n}\n\ninterface OnEntered {\n    (view: OverlayView): void;\n}\n\nexport class OverlayView extends UIView {\n    /**\n     * This property is used to track the amount of opened overlays. Since we're applying a CSS class to disable\n     * window scroll, we must make sure we don't remove that CSS class until all the overlays are closed.\n     */\n    static openedViews = 0;\n    private _onEntered: OnEntered[] = [];\n    private _onExited: OnExited[] = [];\n\n    public constructor(id = \"OverlayView\") {\n        super(id);\n        this.useGrid(false);\n\n        this.addHookDefinition(\"overlay\", useOverlayView);\n\n        this.addElement(\n            new HeaderElement(\"overlayHeader\", {\n                onClose: () => this.setIsVisible(false)\n            })\n        );\n\n        this.addElement(new ContentElement(\"overlayContent\"));\n\n        this.applyPlugins(OverlayView);\n    }\n\n    public setTitle(title: () => string): void {\n        this.getHeaderElement().setTitle(title);\n    }\n\n    public onEntered(): void {\n        [...this._onEntered].reverse().forEach(cb => cb(this));\n    }\n\n    public onExited(): void {\n        [...this._onExited].reverse().forEach(cb => cb(this));\n    }\n\n    public addOnEntered(cb: OnExited): void {\n        this._onEntered.push(cb);\n    }\n\n    public addOnExited(cb: OnExited): void {\n        this._onExited.push(cb);\n    }\n\n    public getOverlayHook(): UseOverlayView {\n        return this.getHook<UseOverlayView>(\"overlay\");\n    }\n\n    public setIsVisible(visible: boolean): void {\n        this.getOverlayHook().setIsVisible(visible);\n    }\n\n    public getHeaderElement(): HeaderElement {\n        return this.getElement(\"overlayHeader\") as HeaderElement;\n    }\n\n    public getContentElement(): ContentElement {\n        return this.getElement(\"overlayContent\") as HeaderElement;\n    }\n\n    public override render(props: UIViewProps): React.ReactNode {\n        const { isVisible } = this.getOverlayHook();\n        return (\n            <Transition\n                in={isVisible}\n                timeout={100}\n                appear\n                onExited={() => this.onExited()}\n                onEntered={() => this.onEntered()}\n            >\n                {state => (\n                    <OverlayLayoutWrapper style={{ ...defaultStyle, ...transitionStyles[state] }}>\n                        {super.render(props)}\n                    </OverlayLayoutWrapper>\n                )}\n            </Transition>\n        );\n    }\n}\n"],"mappings":"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"}
+{"version":3,"names":["OverlayLayoutWrapper","styled","position","width","height","backgroundColor","zIndex","top","left","defaultStyle","transform","opacity","transitionProperty","transitionTimingFunction","transitionDuration","willChange","transitionStyles","entering","entered","OverlayView","id","useGrid","addHookDefinition","useOverlayView","addElement","HeaderElement","onClose","setIsVisible","ContentElement","applyPlugins","title","getHeaderElement","setTitle","_onEntered","reverse","forEach","cb","_onExited","push","getHook","visible","getOverlayHook","getElement","props","isVisible","onExited","onEntered","state","UIView"],"sources":["OverlayView.tsx"],"sourcesContent":["import React from \"react\";\nimport { Transition } from \"react-transition-group\";\nimport styled from \"@emotion/styled\";\nimport { UIView, UIViewProps } from \"~/ui/UIView\";\nimport { UseOverlayView, useOverlayView } from \"./OverlayView/useOverlayView\";\nimport { HeaderElement } from \"./OverlayView/HeaderElement\";\nimport { ContentElement } from \"./OverlayView/ContentElement\";\n\n// !GOOD FIRST ISSUE!\n// Extract rendering and styling into an OverlayViewRenderer class.\n\nconst OverlayLayoutWrapper = styled(\"div\")({\n    position: \"fixed\",\n    width: \"100%\",\n    height: \"100vh\",\n    backgroundColor: \"var(--mdc-theme-background)\",\n    /**\n     * Has to be higher than 5 so it's above advanced settings dialog,\n     * and below 20, so the image editor & Dialogs can be displayed above.\n     */\n    zIndex: 21,\n    top: 0,\n    left: 0\n});\n\nconst defaultStyle: Record<string, string | number> = {\n    transform: \"translateY(75vh)\",\n    opacity: 0,\n    transitionProperty: \"transform, opacity\",\n    transitionTimingFunction: \"cubic-bezier(0, 0, .2, 1)\",\n    transitionDuration: \"225ms\",\n    willChange: \"opacity, transform\"\n};\n\nconst transitionStyles: Record<string, any> = {\n    entering: {\n        transform: \"translateY(75vh)\",\n        opacity: 0\n    },\n    entered: {\n        transform: \"translateY(0px)\",\n        opacity: 1\n    }\n};\n\ninterface OnExited {\n    (view: OverlayView): void;\n}\n\ninterface OnEntered {\n    (view: OverlayView): void;\n}\n\nexport class OverlayView extends UIView {\n    /**\n     * This property is used to track the amount of opened overlays. Since we're applying a CSS class to disable\n     * window scroll, we must make sure we don't remove that CSS class until all the overlays are closed.\n     */\n    static openedViews = 0;\n    private _onEntered: OnEntered[] = [];\n    private _onExited: OnExited[] = [];\n\n    public constructor(id = \"OverlayView\") {\n        super(id);\n        this.useGrid(false);\n\n        this.addHookDefinition(\"overlay\", useOverlayView);\n\n        this.addElement(\n            new HeaderElement(\"overlayHeader\", {\n                onClose: () => this.setIsVisible(false)\n            })\n        );\n\n        this.addElement(new ContentElement(\"overlayContent\"));\n\n        this.applyPlugins(OverlayView);\n    }\n\n    public setTitle(title: () => string): void {\n        this.getHeaderElement().setTitle(title);\n    }\n\n    public onEntered(): void {\n        [...this._onEntered].reverse().forEach(cb => cb(this));\n    }\n\n    public onExited(): void {\n        [...this._onExited].reverse().forEach(cb => cb(this));\n    }\n\n    public addOnEntered(cb: OnExited): void {\n        this._onEntered.push(cb);\n    }\n\n    public addOnExited(cb: OnExited): void {\n        this._onExited.push(cb);\n    }\n\n    public getOverlayHook(): UseOverlayView {\n        return this.getHook<UseOverlayView>(\"overlay\");\n    }\n\n    public setIsVisible(visible: boolean): void {\n        this.getOverlayHook().setIsVisible(visible);\n    }\n\n    public getHeaderElement(): HeaderElement {\n        return this.getElement(\"overlayHeader\") as HeaderElement;\n    }\n\n    public getContentElement(): ContentElement {\n        return this.getElement(\"overlayContent\") as HeaderElement;\n    }\n\n    public override render(props: UIViewProps): React.ReactNode {\n        const { isVisible } = this.getOverlayHook();\n        return (\n            <Transition\n                in={isVisible}\n                timeout={100}\n                appear\n                onExited={() => this.onExited()}\n                onEntered={() => this.onEntered()}\n            >\n                {state => (\n                    <OverlayLayoutWrapper style={{ ...defaultStyle, ...transitionStyles[state] }}>\n                        {super.render(props)}\n                    </OverlayLayoutWrapper>\n                )}\n            </Transition>\n        );\n    }\n}\n"],"mappings":"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"}

package/components/FileManager/BottomInfoBar/SupportedFileTypes.d.ts

@@ -1,6 +0,0 @@
-import React from "react";
-export interface SupportedFileTypesProps {
-    accept: string[];
-}
-declare const SupportedFileTypes: React.FC<SupportedFileTypesProps>;
-export default SupportedFileTypes;

package/components/FileManager/BottomInfoBar/SupportedFileTypes.js

@@ -1,55 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _lite = _interopRequireDefault(require("mime/lite"));
-
-_lite.default.define({
-  "image/x-icon": ["ico"]
-}, true);
-
-_lite.default.define({
-  "image/jpg": ["jpg"]
-}, true);
-
-_lite.default.define({
-  "image/vnd.microsoft.icon": ["ico"]
-}, true);
-
-var getUniqueFilePlugins = function getUniqueFilePlugins(accept) {
-  var exts = {};
-  accept.forEach(function (item) {
-    var ext = _lite.default.getExtension(item);
-
-    if (!ext) {
-      return;
-    }
-
-    exts[ext] = true;
-  });
-  return Object.keys(exts);
-};
-
-var SupportedFileTypes = function SupportedFileTypes(_ref) {
-  var accept = _ref.accept;
-
-  if (!accept) {
-    return null;
-  }
-
-  if (accept.length === 0) {
-    return /*#__PURE__*/_react.default.createElement("span", null, "Showing all file extensions.");
-  }
-
-  return /*#__PURE__*/_react.default.createElement("span", null, "Showing the following file extensions: ", getUniqueFilePlugins(accept).join(", "), ".");
-};
-
-var _default = SupportedFileTypes;
-exports.default = _default;

package/components/FileManager/BottomInfoBar/SupportedFileTypes.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["mime","define","getUniqueFilePlugins","accept","exts","forEach","item","ext","getExtension","Object","keys","SupportedFileTypes","length","join"],"sources":["SupportedFileTypes.tsx"],"sourcesContent":["import React from \"react\";\nimport mime from \"mime/lite\";\n\nmime.define({ \"image/x-icon\": [\"ico\"] }, true);\nmime.define({ \"image/jpg\": [\"jpg\"] }, true);\nmime.define({ \"image/vnd.microsoft.icon\": [\"ico\"] }, true);\n\nconst getUniqueFilePlugins = (accept: string[]): string[] => {\n    const exts: Record<string, boolean> = {};\n    accept.forEach(item => {\n        const ext = mime.getExtension(item);\n        if (!ext) {\n            return;\n        }\n        exts[ext] = true;\n    });\n\n    return Object.keys(exts);\n};\n\nexport interface SupportedFileTypesProps {\n    accept: string[];\n}\n\nconst SupportedFileTypes: React.FC<SupportedFileTypesProps> = ({ accept }) => {\n    if (!accept) {\n        return null;\n    }\n\n    if (accept.length === 0) {\n        return <span>Showing all file extensions.</span>;\n    }\n\n    return (\n        <span>\n            Showing the following file extensions: {getUniqueFilePlugins(accept).join(\", \")}.\n        </span>\n    );\n};\n\nexport default SupportedFileTypes;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AAEAA,aAAA,CAAKC,MAAL,CAAY;EAAE,gBAAgB,CAAC,KAAD;AAAlB,CAAZ,EAAyC,IAAzC;;AACAD,aAAA,CAAKC,MAAL,CAAY;EAAE,aAAa,CAAC,KAAD;AAAf,CAAZ,EAAsC,IAAtC;;AACAD,aAAA,CAAKC,MAAL,CAAY;EAAE,4BAA4B,CAAC,KAAD;AAA9B,CAAZ,EAAqD,IAArD;;AAEA,IAAMC,oBAAoB,GAAG,SAAvBA,oBAAuB,CAACC,MAAD,EAAgC;EACzD,IAAMC,IAA6B,GAAG,EAAtC;EACAD,MAAM,CAACE,OAAP,CAAe,UAAAC,IAAI,EAAI;IACnB,IAAMC,GAAG,GAAGP,aAAA,CAAKQ,YAAL,CAAkBF,IAAlB,CAAZ;;IACA,IAAI,CAACC,GAAL,EAAU;MACN;IACH;;IACDH,IAAI,CAACG,GAAD,CAAJ,GAAY,IAAZ;EACH,CAND;EAQA,OAAOE,MAAM,CAACC,IAAP,CAAYN,IAAZ,CAAP;AACH,CAXD;;AAiBA,IAAMO,kBAAqD,GAAG,SAAxDA,kBAAwD,OAAgB;EAAA,IAAbR,MAAa,QAAbA,MAAa;;EAC1E,IAAI,CAACA,MAAL,EAAa;IACT,OAAO,IAAP;EACH;;EAED,IAAIA,MAAM,CAACS,MAAP,KAAkB,CAAtB,EAAyB;IACrB,oBAAO,2CAAM,8BAAN,CAAP;EACH;;EAED,oBACI,2CAAM,yCAAN,EAC4CV,oBAAoB,CAACC,MAAD,CAApB,CAA6BU,IAA7B,CAAkC,IAAlC,CAD5C,EACoF,GADpF,CADJ;AAKH,CAdD;;eAgBeF,kB"}

package/components/FileManager/BottomInfoBar/UploadStatus.d.ts

@@ -1,6 +0,0 @@
-import React from "react";
-export interface UploadStatusProps {
-    uploading: boolean;
-}
-declare const UploadStatus: React.FC<UploadStatusProps>;
-export default UploadStatus;

package/components/FileManager/BottomInfoBar/UploadStatus.js

@@ -1,60 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _styled = _interopRequireDefault(require("@emotion/styled"));
-
-var _Progress = require("@webiny/ui/Progress");
-
-var StatusWrapper = /*#__PURE__*/(0, _styled.default)("div", {
-  target: "e8hlyp40",
-  label: "StatusWrapper"
-})({
-  color: "var(--mdc-theme-primary)",
-  position: "absolute",
-  right: 0,
-  bottom: 10,
-  marginRight: 10,
-  display: "flex",
-  alignItems: "center",
-  "> div": {
-    display: "inline-block"
-  }
-});
-var CircularProgressHolder = /*#__PURE__*/(0, _styled.default)("div", {
-  target: "e8hlyp41",
-  label: "CircularProgressHolder"
-})({
-  position: "relative",
-  height: 12,
-  width: 12
-});
-var UploadingLabel = /*#__PURE__*/(0, _styled.default)("div", {
-  target: "e8hlyp42",
-  label: "UploadingLabel"
-})({
-  marginRight: 5
-});
-
-var UploadStatus = function UploadStatus(_ref) {
-  var uploading = _ref.uploading;
-
-  if (!uploading) {
-    return null;
-  }
-
-  return /*#__PURE__*/_react.default.createElement(StatusWrapper, null, /*#__PURE__*/_react.default.createElement(UploadingLabel, null, "Uploading..."), /*#__PURE__*/_react.default.createElement(CircularProgressHolder, null, /*#__PURE__*/_react.default.createElement(_Progress.CircularProgress, {
-    size: 10,
-    spinnerWidth: 1
-  })));
-};
-
-var _default = UploadStatus;
-exports.default = _default;

package/components/FileManager/BottomInfoBar/UploadStatus.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["StatusWrapper","styled","color","position","right","bottom","marginRight","display","alignItems","CircularProgressHolder","height","width","UploadingLabel","UploadStatus","uploading"],"sources":["UploadStatus.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { CircularProgress } from \"@webiny/ui/Progress\";\n\nconst StatusWrapper = styled(\"div\")({\n    color: \"var(--mdc-theme-primary)\",\n    position: \"absolute\",\n    right: 0,\n    bottom: 10,\n    marginRight: 10,\n    display: \"flex\",\n    alignItems: \"center\",\n    \"> div\": {\n        display: \"inline-block\"\n    }\n});\n\nconst CircularProgressHolder = styled(\"div\")({\n    position: \"relative\",\n    height: 12,\n    width: 12\n});\n\nconst UploadingLabel = styled(\"div\")({\n    marginRight: 5\n});\n\nexport interface UploadStatusProps {\n    uploading: boolean;\n}\nconst UploadStatus: React.FC<UploadStatusProps> = ({ uploading }) => {\n    if (!uploading) {\n        return null;\n    }\n\n    return (\n        <StatusWrapper>\n            <UploadingLabel>Uploading...</UploadingLabel>\n            <CircularProgressHolder>\n                <CircularProgress size={10} spinnerWidth={1} />\n            </CircularProgressHolder>\n        </StatusWrapper>\n    );\n};\n\nexport default UploadStatus;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AAEA,IAAMA,aAAa,oBAAGC,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EAChCC,KAAK,EAAE,0BADyB;EAEhCC,QAAQ,EAAE,UAFsB;EAGhCC,KAAK,EAAE,CAHyB;EAIhCC,MAAM,EAAE,EAJwB;EAKhCC,WAAW,EAAE,EALmB;EAMhCC,OAAO,EAAE,MANuB;EAOhCC,UAAU,EAAE,QAPoB;EAQhC,SAAS;IACLD,OAAO,EAAE;EADJ;AARuB,CAAjB,CAAnB;AAaA,IAAME,sBAAsB,oBAAGR,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EACzCE,QAAQ,EAAE,UAD+B;EAEzCO,MAAM,EAAE,EAFiC;EAGzCC,KAAK,EAAE;AAHkC,CAAjB,CAA5B;AAMA,IAAMC,cAAc,oBAAGX,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EACjCK,WAAW,EAAE;AADoB,CAAjB,CAApB;;AAOA,IAAMO,YAAyC,GAAG,SAA5CA,YAA4C,OAAmB;EAAA,IAAhBC,SAAgB,QAAhBA,SAAgB;;EACjE,IAAI,CAACA,SAAL,EAAgB;IACZ,OAAO,IAAP;EACH;;EAED,oBACI,6BAAC,aAAD,qBACI,6BAAC,cAAD,QAAgB,cAAhB,CADJ,eAEI,6BAAC,sBAAD,qBACI,6BAAC,0BAAD;IAAkB,IAAI,EAAE,EAAxB;IAA4B,YAAY,EAAE;EAA1C,EADJ,CAFJ,CADJ;AAQH,CAbD;;eAeeD,Y"}

package/components/FileManager/BottomInfoBar.d.ts

@@ -1,5 +0,0 @@
-import React from "react";
-import { SupportedFileTypesProps } from "./BottomInfoBar/SupportedFileTypes";
-import { UploadStatusProps } from "./BottomInfoBar/UploadStatus";
-declare const BottomInfoBar: React.FC<SupportedFileTypesProps & UploadStatusProps>;
-export default BottomInfoBar;

package/components/FileManager/BottomInfoBar.js

@@ -1,60 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _lite = _interopRequireDefault(require("mime/lite"));
-
-var _styled = _interopRequireDefault(require("@emotion/styled"));
-
-var _SupportedFileTypes = _interopRequireDefault(require("./BottomInfoBar/SupportedFileTypes"));
-
-var _UploadStatus = _interopRequireDefault(require("./BottomInfoBar/UploadStatus"));
-
-_lite.default.define({
-  "image/x-icon": ["ico"]
-}, true);
-
-_lite.default.define({
-  "image/jpg": ["jpg"]
-}, true);
-
-_lite.default.define({
-  "image/vnd.microsoft.icon": ["ico"]
-}, true);
-
-var BottomInfoBarWrapper = /*#__PURE__*/(0, _styled.default)("div", {
-  target: "el4b0yq0",
-  label: "BottomInfoBarWrapper"
-})({
-  fontSize: "0.8rem",
-  position: "sticky",
-  bottom: 0,
-  height: 30,
-  color: "var(--mdc-theme-text-secondary-on-background)",
-  borderTop: "1px solid var(--mdc-theme-on-background)",
-  backgroundColor: "var(--mdc-theme-surface)",
-  width: "100%",
-  transform: "translateZ(0)",
-  overflow: "hidden",
-  display: "flex",
-  alignItems: "center",
-  zIndex: 1,
-  "> div": {
-    padding: "0 10px",
-    width: "100%"
-  }
-});
-
-var BottomInfoBar = function BottomInfoBar(props) {
-  return /*#__PURE__*/_react.default.createElement(BottomInfoBarWrapper, null, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_SupportedFileTypes.default, props), /*#__PURE__*/_react.default.createElement(_UploadStatus.default, props)));
-};
-
-var _default = BottomInfoBar;
-exports.default = _default;

package/components/FileManager/BottomInfoBar.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["mime","define","BottomInfoBarWrapper","styled","fontSize","position","bottom","height","color","borderTop","backgroundColor","width","transform","overflow","display","alignItems","zIndex","padding","BottomInfoBar","props"],"sources":["BottomInfoBar.tsx"],"sourcesContent":["import React from \"react\";\nimport mime from \"mime/lite\";\nimport styled from \"@emotion/styled\";\nimport SupportedFileTypes, { SupportedFileTypesProps } from \"./BottomInfoBar/SupportedFileTypes\";\nimport UploadStatus, { UploadStatusProps } from \"./BottomInfoBar/UploadStatus\";\n\nmime.define({ \"image/x-icon\": [\"ico\"] }, true);\nmime.define({ \"image/jpg\": [\"jpg\"] }, true);\nmime.define({ \"image/vnd.microsoft.icon\": [\"ico\"] }, true);\n\nconst BottomInfoBarWrapper = styled(\"div\")({\n    fontSize: \"0.8rem\",\n    position: \"sticky\",\n    bottom: 0,\n    height: 30,\n    color: \"var(--mdc-theme-text-secondary-on-background)\",\n    borderTop: \"1px solid var(--mdc-theme-on-background)\",\n    backgroundColor: \"var(--mdc-theme-surface)\",\n    width: \"100%\",\n    transform: \"translateZ(0)\",\n    overflow: \"hidden\",\n    display: \"flex\",\n    alignItems: \"center\",\n    zIndex: 1,\n    \"> div\": {\n        padding: \"0 10px\",\n        width: \"100%\"\n    }\n});\n\nconst BottomInfoBar: React.FC<SupportedFileTypesProps & UploadStatusProps> = props => {\n    return (\n        <BottomInfoBarWrapper>\n            <div>\n                <SupportedFileTypes {...props} />\n                <UploadStatus {...props} />\n            </div>\n        </BottomInfoBarWrapper>\n    );\n};\n\nexport default BottomInfoBar;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AAEAA,aAAA,CAAKC,MAAL,CAAY;EAAE,gBAAgB,CAAC,KAAD;AAAlB,CAAZ,EAAyC,IAAzC;;AACAD,aAAA,CAAKC,MAAL,CAAY;EAAE,aAAa,CAAC,KAAD;AAAf,CAAZ,EAAsC,IAAtC;;AACAD,aAAA,CAAKC,MAAL,CAAY;EAAE,4BAA4B,CAAC,KAAD;AAA9B,CAAZ,EAAqD,IAArD;;AAEA,IAAMC,oBAAoB,oBAAGC,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EACvCC,QAAQ,EAAE,QAD6B;EAEvCC,QAAQ,EAAE,QAF6B;EAGvCC,MAAM,EAAE,CAH+B;EAIvCC,MAAM,EAAE,EAJ+B;EAKvCC,KAAK,EAAE,+CALgC;EAMvCC,SAAS,EAAE,0CAN4B;EAOvCC,eAAe,EAAE,0BAPsB;EAQvCC,KAAK,EAAE,MARgC;EASvCC,SAAS,EAAE,eAT4B;EAUvCC,QAAQ,EAAE,QAV6B;EAWvCC,OAAO,EAAE,MAX8B;EAYvCC,UAAU,EAAE,QAZ2B;EAavCC,MAAM,EAAE,CAb+B;EAcvC,SAAS;IACLC,OAAO,EAAE,QADJ;IAELN,KAAK,EAAE;EAFF;AAd8B,CAAjB,CAA1B;;AAoBA,IAAMO,aAAoE,GAAG,SAAvEA,aAAuE,CAAAC,KAAK,EAAI;EAClF,oBACI,6BAAC,oBAAD,qBACI,uDACI,6BAAC,2BAAD,EAAwBA,KAAxB,CADJ,eAEI,6BAAC,qBAAD,EAAkBA,KAAlB,CAFJ,CADJ,CADJ;AAQH,CATD;;eAWeD,a"}

package/components/FileManager/DropFilesHere.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="web" />
-import React from "react";
-export interface DropFilesHereProps {
-    onDragLeave?: (event?: React.DragEvent<HTMLElement>) => void;
-    onDrop?: (event?: React.DragEvent<HTMLElement>) => void;
-    empty?: boolean;
-    onClick?: (event?: React.MouseEvent<HTMLElement>) => void;
-}
-declare const DropFilesHere: React.FC<DropFilesHereProps>;
-export default DropFilesHere;

package/components/FileManager/DropFilesHere.js

@@ -1,76 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _emotion = require("emotion");
-
-var _classnames = _interopRequireDefault(require("classnames"));
-
-var _Icon = require("@webiny/ui/Icon");
-
-var _roundCloud_upload24px = require("./icons/round-cloud_upload-24px.svg");
-
-var styles = /*#__PURE__*/(0, _emotion.css)({
-  margin: "0 auto",
-  paddingTop: 0,
-  height: "100%",
-  zIndex: 2,
-  width: "100%",
-  position: "absolute",
-  backgroundColor: "var(--mdc-theme-text-hint-on-light)",
-  "&.empty": {
-    backgroundColor: "transparent",
-    "> div": {
-      backgroundColor: "var(--mdc-theme-surface)"
-    }
-  },
-  "> div": {
-    textAlign: "center",
-    width: 300,
-    height: 300,
-    backgroundColor: "var(--mdc-theme-background)",
-    borderRadius: "50%",
-    position: "absolute",
-    left: "50%",
-    top: "50%",
-    transform: "translateX(-50%) translateY(-100%)",
-    "> div": {
-      position: "absolute",
-      top: 90,
-      width: 300,
-      color: "var(--mdc-theme-on-surface)",
-      "svg.mdc-button__icon": {
-        width: 100,
-        display: "inline-block",
-        color: "var(--mdc-theme-on-surface)"
-      }
-    }
-  }
-}, "label:styles;");
-
-var DropFilesHere = function DropFilesHere(_ref) {
-  var onDrop = _ref.onDrop,
-      onDragLeave = _ref.onDragLeave,
-      empty = _ref.empty,
-      onClick = _ref.onClick;
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)(styles, {
-      empty: empty
-    }),
-    onDrop: onDrop,
-    onClick: onClick,
-    onDragLeave: onDragLeave
-  }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
-    icon: /*#__PURE__*/_react.default.createElement(_roundCloud_upload24px.ReactComponent, null)
-  }), /*#__PURE__*/_react.default.createElement("div", null, "Drop files here"))));
-};
-
-var _default = DropFilesHere;
-exports.default = _default;

package/components/FileManager/DropFilesHere.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["styles","css","margin","paddingTop","height","zIndex","width","position","backgroundColor","textAlign","borderRadius","left","top","transform","color","display","DropFilesHere","onDrop","onDragLeave","empty","onClick","classNames"],"sources":["DropFilesHere.tsx"],"sourcesContent":["import React from \"react\";\nimport { css } from \"emotion\";\nimport classNames from \"classnames\";\nimport { Icon } from \"@webiny/ui/Icon\";\n\nimport { ReactComponent as UploadIcon } from \"./icons/round-cloud_upload-24px.svg\";\n\nconst styles = css({\n    margin: \"0 auto\",\n    paddingTop: 0,\n    height: \"100%\",\n    zIndex: 2,\n    width: \"100%\",\n    position: \"absolute\",\n    backgroundColor: \"var(--mdc-theme-text-hint-on-light)\",\n    \"&.empty\": {\n        backgroundColor: \"transparent\",\n        \"> div\": {\n            backgroundColor: \"var(--mdc-theme-surface)\"\n        }\n    },\n    \"> div\": {\n        textAlign: \"center\",\n        width: 300,\n        height: 300,\n        backgroundColor: \"var(--mdc-theme-background)\",\n        borderRadius: \"50%\",\n        position: \"absolute\",\n        left: \"50%\",\n        top: \"50%\",\n        transform: \"translateX(-50%) translateY(-100%)\",\n        \"> div\": {\n            position: \"absolute\",\n            top: 90,\n            width: 300,\n            color: \"var(--mdc-theme-on-surface)\",\n            \"svg.mdc-button__icon\": {\n                width: 100,\n                display: \"inline-block\",\n                color: \"var(--mdc-theme-on-surface)\"\n            }\n        }\n    }\n});\n\nexport interface DropFilesHereProps {\n    onDragLeave?: (event?: React.DragEvent<HTMLElement>) => void;\n    onDrop?: (event?: React.DragEvent<HTMLElement>) => void;\n    empty?: boolean;\n    onClick?: (event?: React.MouseEvent<HTMLElement>) => void;\n}\n\nconst DropFilesHere: React.FC<DropFilesHereProps> = ({ onDrop, onDragLeave, empty, onClick }) => {\n    return (\n        <div\n            className={classNames(styles, { empty })}\n            onDrop={onDrop}\n            onClick={onClick}\n            onDragLeave={onDragLeave}\n        >\n            <div>\n                <div>\n                    <Icon icon={<UploadIcon />} />\n                    <div>Drop files here</div>\n                </div>\n            </div>\n        </div>\n    );\n};\nexport default DropFilesHere;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;AAEA,IAAMA,MAAM,gBAAG,IAAAC,YAAA,EAAI;EACfC,MAAM,EAAE,QADO;EAEfC,UAAU,EAAE,CAFG;EAGfC,MAAM,EAAE,MAHO;EAIfC,MAAM,EAAE,CAJO;EAKfC,KAAK,EAAE,MALQ;EAMfC,QAAQ,EAAE,UANK;EAOfC,eAAe,EAAE,qCAPF;EAQf,WAAW;IACPA,eAAe,EAAE,aADV;IAEP,SAAS;MACLA,eAAe,EAAE;IADZ;EAFF,CARI;EAcf,SAAS;IACLC,SAAS,EAAE,QADN;IAELH,KAAK,EAAE,GAFF;IAGLF,MAAM,EAAE,GAHH;IAILI,eAAe,EAAE,6BAJZ;IAKLE,YAAY,EAAE,KALT;IAMLH,QAAQ,EAAE,UANL;IAOLI,IAAI,EAAE,KAPD;IAQLC,GAAG,EAAE,KARA;IASLC,SAAS,EAAE,oCATN;IAUL,SAAS;MACLN,QAAQ,EAAE,UADL;MAELK,GAAG,EAAE,EAFA;MAGLN,KAAK,EAAE,GAHF;MAILQ,KAAK,EAAE,6BAJF;MAKL,wBAAwB;QACpBR,KAAK,EAAE,GADa;QAEpBS,OAAO,EAAE,cAFW;QAGpBD,KAAK,EAAE;MAHa;IALnB;EAVJ;AAdM,CAAJ,kBAAf;;AA6CA,IAAME,aAA2C,GAAG,SAA9CA,aAA8C,OAA6C;EAAA,IAA1CC,MAA0C,QAA1CA,MAA0C;EAAA,IAAlCC,WAAkC,QAAlCA,WAAkC;EAAA,IAArBC,KAAqB,QAArBA,KAAqB;EAAA,IAAdC,OAAc,QAAdA,OAAc;EAC7F,oBACI;IACI,SAAS,EAAE,IAAAC,mBAAA,EAAWrB,MAAX,EAAmB;MAAEmB,KAAK,EAALA;IAAF,CAAnB,CADf;IAEI,MAAM,EAAEF,MAFZ;IAGI,OAAO,EAAEG,OAHb;IAII,WAAW,EAAEF;EAJjB,gBAMI,uDACI,uDACI,6BAAC,UAAD;IAAM,IAAI,eAAE,6BAAC,qCAAD;EAAZ,EADJ,eAEI,0CAAK,iBAAL,CAFJ,CADJ,CANJ,CADJ;AAeH,CAhBD;;eAiBeF,a"}

package/components/FileManager/File.d.ts

@@ -1,17 +0,0 @@
-/// <reference types="react-butterfiles" />
-import React from "react";
-export interface FileProps {
-    file: FileItem;
-    selected: boolean;
-    uploadFile: (item: FileItem[] | FileItem) => Promise<number | null>;
-    onSelect: (event?: React.MouseEvent) => void;
-    onClick?: (event?: React.MouseEvent) => void;
-    options?: Array<{
-        label: string;
-        onClick: (file: Object) => void;
-    }>;
-    children: React.ReactNode;
-    showFileDetails: (event?: React.MouseEvent) => void;
-}
-declare const MemoizedFile: React.NamedExoticComponent<FileProps>;
-export default MemoizedFile;