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

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

@@ -0,0 +1 @@
+{"version":3,"sources":["FileManagerElementRenderer.tsx"],"names":["React","styled","UIRenderer","FormElementMessage","FileManager","ImageUploadWrapper","position","opacity","pointerEvents","transform","top","left","color","FileManagerElementRenderer","element","props","formProps","Error","Bind","accept","getAccept","label","getLabel","description","getDescription","getName","getValidators","getDefaultValue","value","cb","onBeforeChange","form","onAfterChange","onChange","validation","getOnChangePickAttributes","getMaxSize","getMultipleMaxCount","getMultipleMaxSize","showFileManager","getEmptyStateElement","render","fileManagerElement","isValid","message"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { UIRenderer, UIRenderParams } from \"~/ui/UIRenderer\";\nimport { FormElementMessage } from \"@webiny/ui/FormElementMessage\";\nimport { FileManagerElement } from \"~/ui/elements/form/FileManagerElement\";\nimport { FileManager } from \"~/components\";\nimport { FormFieldElementRenderProps } from \"~/ui/elements/form/FormFieldElement\";\n\nconst ImageUploadWrapper = styled(\"div\")({\n    position: \"relative\",\n    \".disabled\": {\n        opacity: 0.75,\n        pointerEvents: \"none\"\n    },\n    \".mdc-floating-label--float-above\": {\n        transform: \"scale(0.75)\",\n        top: 10,\n        left: 10,\n        color: \"var(--mdc-theme-text-secondary-on-background)\"\n    },\n    \".mdc-text-field-helper-text\": {\n        color: \"var(--mdc-theme-text-secondary-on-background)\"\n    }\n});\n\nexport interface FileManagerElementRenderProps extends FormFieldElementRenderProps {\n    fileManagerElement: FileManagerElement;\n    value: any;\n    showFileManager: () => void;\n    onChange: (value: any) => void;\n}\n\nexport class FileManagerElementRenderer extends UIRenderer<\n    FileManagerElement,\n    FormFieldElementRenderProps\n> {\n    public override render({\n        element,\n        props\n    }: UIRenderParams<FileManagerElement, FormFieldElementRenderProps>): React.ReactNode {\n        if (!props.formProps) {\n            throw Error(`FileManagerElement must be placed inside of a FormElement.`);\n        }\n\n        const { Bind } = props.formProps;\n\n        const accept = element.getAccept();\n        const label = element.getLabel(props);\n        const description = element.getDescription(props);\n\n        return (\n            <Bind\n                name={element.getName()}\n                validators={element.getValidators(props)}\n                defaultValue={element.getDefaultValue(props)}\n                beforeChange={(value: string, cb) => element.onBeforeChange(value, cb)}\n                afterChange={(value: string, form) => element.onAfterChange(value, form)}\n            >\n                {({ value, onChange, validation }) => (\n                    <ImageUploadWrapper>\n                        {label && (\n                            <div className=\"mdc-floating-label mdc-floating-label--float-above\">\n                                {label}\n                            </div>\n                        )}\n\n                        <FileManager\n                            onChange={onChange}\n                            onChangePick={element.getOnChangePickAttributes()}\n                            accept={accept}\n                            images={!accept}\n                            maxSize={element.getMaxSize()}\n                            multipleMaxCount={element.getMultipleMaxCount()}\n                            multipleMaxSize={element.getMultipleMaxSize()}\n                        >\n                            {({ showFileManager }) =>\n                                element.getEmptyStateElement().render({\n                                    ...props,\n                                    fileManagerElement: element,\n                                    showFileManager,\n                                    value,\n                                    onChange\n                                })\n                            }\n                        </FileManager>\n\n                        {validation.isValid === false && (\n                            <FormElementMessage error>{validation.message}</FormElementMessage>\n                        )}\n                        {validation.isValid !== false && description && (\n                            <FormElementMessage>{description}</FormElementMessage>\n                        )}\n                    </ImageUploadWrapper>\n                )}\n            </Bind>\n        );\n    }\n}\n"]}

package/ui/elements/form/FileManagerElement/styled.d.ts

@@ -1,14 +1,17 @@
-/// <reference types="react" />
-export declare const AddImageIconWrapper: 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 AddImageWrapper: 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 AddImageWrapperRound: import("@emotion/styled-base").StyledComponent<Pick<import("react").PropsWithChildren<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Pick<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">, "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"> & {
-    theme?: object;
-}>, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "translate" | "children" | "key" | "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" | "theme"> & {
-    ref?: ((instance: HTMLDivElement) => void) | import("react").RefObject<HTMLDivElement>;
-}, Pick<Pick<import("react").PropsWithChildren<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Pick<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">, "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"> & {
-    theme?: object;
-}>, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "translate" | "children" | "key" | "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" | "theme"> & {
-    ref?: ((instance: HTMLDivElement) => void) | import("react").RefObject<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" | "theme">, object>;
-export declare const RemoveImage: 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 FilePreviewWrapper: 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 AddImageIconWrapper: 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 AddImageWrapper: 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 AddImageWrapperRound: import("@emotion/styled-base").StyledComponent<Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Pick<Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    theme?: object | undefined;
+} & {
+    children?: import("react").ReactNode;
+}, "key" | keyof import("react").HTMLAttributes<HTMLDivElement> | "theme"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, Pick<Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Pick<Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    theme?: object | undefined;
+} & {
+    children?: import("react").ReactNode;
+}, "key" | keyof import("react").HTMLAttributes<HTMLDivElement> | "theme"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("react").HTMLAttributes<HTMLDivElement> | "theme">, object>;
+export declare const RemoveImage: 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 FilePreviewWrapper: 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>;

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

@@ -0,0 +1 @@
+{"version":3,"sources":["styled.ts"],"names":["styled","AddImageIconWrapper","color","width","height","maxWidth","maxHeight","display","opacity","margin","AddImageWrapper","minHeight","minWidth","textAlign","backgroundColor","borderRadius","borderBottom","alignItems","justifyContent","flexDirection","transition","cursor","padding","boxSizing","AddImageWrapperRound","RemoveImage","position","top","right","FilePreviewWrapper","zIndex","left","transform"],"mappings":"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","sourcesContent":["// @ts-nocheck\nimport styled from \"@emotion/styled\";\n\nexport const AddImageIconWrapper = styled(\"div\")({\n    color: \"var(--mdc-theme-text-secondary-on-background)\",\n    \">svg\": {\n        width: \"100%\",\n        height: \"100%\",\n        maxWidth: 50,\n        maxHeight: 50,\n        display: \"block\",\n        opacity: 0.5,\n        margin: \"0 auto\"\n    }\n});\n\nexport const AddImageWrapper = styled(\"div\")({\n    width: \"100%\",\n    height: \"100%\",\n    minHeight: 50,\n    minWidth: 50,\n    textAlign: \"center\",\n    backgroundColor: \"var(--mdc-theme-on-background)\",\n    borderRadius: 0,\n    borderBottom: \"1px solid var(--mdc-theme-text-hint-on-background)\",\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"space-around\",\n    flexDirection: \"column\",\n    transition: \"color 0.2s\",\n    cursor: \"pointer\",\n    padding: 10,\n    boxSizing: \"border-box\",\n    \"&:hover\": {\n        backgroundColor: \"rgba(0,0,0, 0.5)\",\n        borderBottom: \"1px solid var(--mdc-theme-on-surface)\"\n    }\n});\n\nexport const AddImageWrapperRound = styled(AddImageWrapper)({\n    margin: \"auto\",\n    width: \"150px\",\n    height: \"150px\",\n    borderRadius: \"50%\"\n});\n\nexport const RemoveImage = styled(\"div\")({\n    position: \"absolute\",\n    cursor: \"pointer\",\n    top: 10,\n    right: 10,\n    display: \"none\",\n    color: \"white\",\n    opacity: 0.5,\n    \"&:hover\": {\n        opacity: 0.75\n    }\n});\n\nexport const FilePreviewWrapper = styled(\"div\")({\n    width: \"100%\",\n    height: \"100%\",\n    minHeight: 90,\n    minWidth: 50,\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"space-around\",\n    flexDirection: \"column\",\n    boxSizing: \"border-box\",\n    position: \"relative\",\n    backgroundColor: \"var(--mdc-theme-on-background)\",\n    borderRadius: 0,\n    borderBottom: \"1px solid var(--mdc-theme-text-hint-on-background)\",\n    [AddImageWrapper]: {\n        position: \"absolute\",\n        display: \"none\",\n        top: 0,\n        height: \"100%\",\n        zIndex: 1,\n        backgroundColor: \"rgba(0,0,0, 0.75)\",\n        [AddImageIconWrapper]: {\n            top: \"50%\",\n            left: \"50%\",\n            transform: \"translateY(-50%) translateX(-50%)\",\n            position: \"absolute\",\n            color: \"white\"\n        }\n    },\n    \"&:hover\": {\n        [AddImageWrapper]: {\n            display: \"block\"\n        },\n        [RemoveImage]: {\n            display: \"block\",\n            zIndex: 2\n        }\n    }\n});\n"]}

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

@@ -11,14 +11,14 @@ export declare class FileManagerElement extends FormFieldElement<FileManagerElem
     private readonly _emptyStateElement;
     constructor(id: string, config: FileManagerElementConfig);
     getEmptyStateElement(): UIElement<import("@webiny/ui-composer/UIElement").UIElementConfig<any>>;
-    getAccept(): string[];
+    getAccept(): string[] | undefined;
     setAccept(accept: string[]): void;
-    getMaxSize(): string | number;
+    getMaxSize(): string | number | undefined;
     setMaxSize(maxSize: number | string): void;
-    getMultipleMaxCount(): number;
+    getMultipleMaxCount(): number | undefined;
     setMultipleMaxCount(multipleMaxCount: number): void;
-    getMultipleMaxSize(): string | number;
+    getMultipleMaxSize(): string | number | undefined;
     setMultipleMaxSize(multipleMaxSize: number | string): void;
-    getOnChangePickAttributes(): string[];
+    getOnChangePickAttributes(): string[] | undefined;
     setOnChangePickAttributes(attributes: string[]): void;
 }

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

@@ -0,0 +1 @@
+{"version":3,"sources":["FileManagerElement.tsx"],"names":["FormFieldElement","FileManagerElementRenderer","EmptyStateElement","FileManagerElement","id","config","addRenderer","_emptyStateElement","applyPlugins","accept","maxSize","multipleMaxCount","multipleMaxSize","onChangePickAttributes","attributes"],"mappings":";;;;;;AACA,SAASA,gBAAT;AACA,SAASC,0BAAT;AACA,SAASC,iBAAT;AAwBA,WAAaC,kBAAb;AAAA;;AAAA;;AAGI,8BAAmBC,EAAnB,EAA+BC,MAA/B,EAAiE;AAAA;;AAAA;;AAC7D,8BAAMD,EAAN,EAAUC,MAAV;;AAD6D;;AAG7D,UAAKC,WAAL,CAAiB,IAAIL,0BAAJ,EAAjB;;AAEA,UAAKM,kBAAL,GAA0B,IAAIL,iBAAJ,CAAsB,YAAtB,CAA1B;;AAEA,UAAKM,YAAL,CAAkBL,kBAAlB;;AAP6D;AAQhE;;AAXL;AAAA;AAAA,WAaI,gCAA8B;AAC1B,aAAO,KAAKI,kBAAZ;AACH;AAfL;AAAA;AAAA,WAiBI,qBAAmB;AACf,aAAO,KAAKF,MAAL,CAAYI,MAAnB;AACH;AAnBL;AAAA;AAAA,WAqBI,mBAAiBA,MAAjB,EAAmC;AAC/B,WAAKJ,MAAL,CAAYI,MAAZ,GAAqBA,MAArB;AACH;AAvBL;AAAA;AAAA,WAyBI,sBAAoB;AAChB,aAAO,KAAKJ,MAAL,CAAYK,OAAnB;AACH;AA3BL;AAAA;AAAA,WA6BI,oBAAkBA,OAAlB,EAA4C;AACxC,WAAKL,MAAL,CAAYK,OAAZ,GAAsBA,OAAtB;AACH;AA/BL;AAAA;AAAA,WAiCI,+BAA6B;AACzB,aAAO,KAAKL,MAAL,CAAYM,gBAAnB;AACH;AAnCL;AAAA;AAAA,WAqCI,6BAA2BA,gBAA3B,EAAqD;AACjD,WAAKN,MAAL,CAAYM,gBAAZ,GAA+BA,gBAA/B;AACH;AAvCL;AAAA;AAAA,WAyCI,8BAA4B;AACxB,aAAO,KAAKN,MAAL,CAAYO,eAAnB;AACH;AA3CL;AAAA;AAAA,WA6CI,4BAA0BA,eAA1B,EAA4D;AACxD,WAAKP,MAAL,CAAYO,eAAZ,GAA8BA,eAA9B;AACH;AA/CL;AAAA;AAAA,WAiDI,qCAAmC;AAC/B,aAAO,KAAKP,MAAL,CAAYQ,sBAAnB;AACH;AAnDL;AAAA;AAAA,WAqDI,mCAAiCC,UAAjC,EAAuD;AACnD,WAAKT,MAAL,CAAYQ,sBAAZ,GAAqCC,UAArC;AACH;AAvDL;;AAAA;AAAA,EAAwCd,gBAAxC","sourcesContent":["import { UIElement } from \"~/ui/UIElement\";\nimport { FormFieldElement, FormFieldElementConfig } from \"./FormFieldElement\";\nimport { FileManagerElementRenderer } from \"./FileManagerElement/FileManagerElementRenderer\";\nimport { EmptyStateElement } from \"./FileManagerElement/EmptyStateElement\";\n\nexport interface FileManagerElementConfig extends FormFieldElementConfig {\n    // Define mime types that will be shown and accepted by FileManager\n    accept?: string[];\n\n    // Define file's max allowed size (default is \"10mb\").\n    // Uses \"bytes\" (https://www.npmjs.com/package/bytes) library to convert string notation to actual number.\n    maxSize?: number | string;\n\n    // Max number of files in a single batch.\n    multipleMaxCount?: number;\n\n    // Max size of files in a single batch.\n    multipleMaxSize?: number | string;\n\n    // Define properties that are returned on file(s) selection.\n    onChangePickAttributes?: string[];\n\n    // Define whether multiple files can be selected1.\n    // TODO: multiple?: boolean; - create a new renderer for \"multiple=true\" to render multiple files\n    // It should work as in Headless CMS content entry form, see that for an example.\n}\n\nexport class FileManagerElement extends FormFieldElement<FileManagerElementConfig> {\n    private readonly _emptyStateElement: UIElement;\n\n    public constructor(id: string, config: FileManagerElementConfig) {\n        super(id, config);\n\n        this.addRenderer(new FileManagerElementRenderer());\n\n        this._emptyStateElement = new EmptyStateElement(\"emptyState\");\n\n        this.applyPlugins(FileManagerElement);\n    }\n\n    public getEmptyStateElement() {\n        return this._emptyStateElement;\n    }\n\n    public getAccept() {\n        return this.config.accept;\n    }\n\n    public setAccept(accept: string[]) {\n        this.config.accept = accept;\n    }\n\n    public getMaxSize() {\n        return this.config.maxSize;\n    }\n\n    public setMaxSize(maxSize: number | string) {\n        this.config.maxSize = maxSize;\n    }\n\n    public getMultipleMaxCount() {\n        return this.config.multipleMaxCount;\n    }\n\n    public setMultipleMaxCount(multipleMaxCount: number) {\n        this.config.multipleMaxCount = multipleMaxCount;\n    }\n\n    public getMultipleMaxSize() {\n        return this.config.multipleMaxSize;\n    }\n\n    public setMultipleMaxSize(multipleMaxSize: number | string) {\n        this.config.multipleMaxSize = multipleMaxSize;\n    }\n\n    public getOnChangePickAttributes() {\n        return this.config.onChangePickAttributes;\n    }\n\n    public setOnChangePickAttributes(attributes: string[]) {\n        this.config.onChangePickAttributes = attributes;\n    }\n}\n"]}

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

@@ -0,0 +1 @@
+{"version":3,"sources":["FormElement.tsx"],"names":["React","Fragment","Form","UIElement","FormElement","id","config","useGrid","props","onSubmit","getData","formProps"],"mappings":";;;;;;;AAAA,OAAOA,KAAP,IAAgBC,QAAhB,QAAgC,OAAhC;AACA,SAASC,IAAT,QAAyD,cAAzD;AACA,SAASC,SAAT;AAiBA,WAAaC,WAAb;AAAA;;AAAA;;AACI,uBAAmBC,EAAnB,EAA+BC,MAA/B,EAA0D;AAAA;;AAAA;;AACtD,8BAAMD,EAAN,EAAUC,MAAV;;AAEA,UAAKC,OAAL,CAAa,KAAb;;AAHsD;AAIzD;;AALL;AAAA;AAAA,WAOI,gBAAuBC,KAAvB,EAAuE;AAAA;;AACnE,0BACI,oBAAC,IAAD;AAAM,QAAA,QAAQ,EAAE,KAAKF,MAAL,CAAYG,QAA5B;AAAsC,QAAA,IAAI,EAAE,KAAKH,MAAL,CAAYI,OAAZ;AAA5C,SACK,UAAAC,SAAS;AAAA,4BAAI,oBAAC,QAAD,oHAA6BH,KAA7B;AAAoCG,UAAAA,SAAS,EAATA;AAApC,YAAJ;AAAA,OADd,CADJ;AAKH;AAbL;;AAAA;AAAA,EAAiCR,SAAjC","sourcesContent":["import React, { Fragment } from \"react\";\nimport { Form, FormOnSubmit, FormRenderPropParams } from \"@webiny/form\";\nimport { UIElement, UIElementConfig, UiElementRenderProps } from \"~/ui/UIElement\";\n\ninterface FormElementConfig extends UIElementConfig {\n    onSubmit: FormOnSubmit;\n    getData(): Record<string, any>;\n    getInvalidFields?(): Record<string, any>;\n    isDisabled?(): boolean;\n    onChange?: FormOnSubmit;\n    onInvalid?: () => void;\n    submitOnEnter?: boolean;\n    validateOnFirstSubmit?: boolean;\n}\n\nexport interface FormElementRenderProps extends UiElementRenderProps {\n    formProps: FormRenderPropParams;\n}\n\nexport class FormElement extends UIElement<FormElementConfig> {\n    public constructor(id: string, config: FormElementConfig) {\n        super(id, config);\n\n        this.useGrid(false);\n    }\n\n    public override render(props: FormElementRenderProps): React.ReactNode {\n        return (\n            <Form onSubmit={this.config.onSubmit} data={this.config.getData()}>\n                {formProps => <Fragment>{super.render({ ...props, formProps })}</Fragment>}\n            </Form>\n        );\n    }\n}\n"]}

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

@@ -2,10 +2,10 @@ import React from "react";
 import { FormRenderPropParams, FormAPI } from "@webiny/form";
 import { UIElement, UIElementConfig } from "../../UIElement";
 import { FormElementRenderProps } from "./FormElement";
-import { Form } from "@webiny/form/Form";
+import { Validator } from "@webiny/validation/types";
 export interface FormFieldElementConfig<TRenderProps = FormRenderPropParams> extends UIElementConfig<TRenderProps> {
     name: string;
-    validators?: GetterWithProps<Function | Function[]>;
+    validators?: GetterWithProps<Validator | Validator[]>;
     beforeChange?: BeforeChange;
     afterChange?: AfterChange;
     defaultValue?: any | GetterWithProps<any>;
@@ -34,7 +34,7 @@ export declare class FormFieldElement<TConfig extends FormFieldElementConfig = F
     private _afterChange;
     constructor(id: string, config: TConfig);
     getName(): string;
-    getValidators(props?: FormFieldElementRenderProps): Function | Function[];
+    getValidators(props?: FormFieldElementRenderProps): Validator | Validator[];
     getDefaultValue(props?: FormFieldElementRenderProps): any;
     getLabel(props?: FormFieldElementRenderProps): string;
     getDescription(props?: FormFieldElementRenderProps): string | React.ReactElement;
@@ -45,9 +45,9 @@ export declare class FormFieldElement<TConfig extends FormFieldElementConfig = F
     setDefaultValue(value: any | GetterWithProps<any>): void;
     getIsDisabled(props?: FormFieldElementRenderProps): boolean;
     setIsDisabled(isDisabled: boolean | GetterWithProps<boolean>): void;
-    setValidators(validators: GetterWithProps<Function>): void;
+    setValidators(validators: GetterWithProps<Validator>): void;
     onBeforeChange(value: string, cb: (value: string) => void): void;
-    onAfterChange(value: string, form: Form): void;
+    onAfterChange(value: string, form: FormAPI): void;
     addBeforeChange(cb: BeforeChange): void;
     addAfterChange<T = any, D extends Record<string, any> = Record<string, any>>(cb: AfterChange<T, D>): void;
     setBeforeChange(cb: BeforeChange): void;

package/ui/elements/form/FormFieldElement.js

@@ -132,12 +132,14 @@ export var FormFieldElement = /*#__PURE__*/function (_UIElement) {
       var callbacks = _toConsumableArray(this._beforeChange);
 
       var next = function next(val) {
-        if (!callbacks.length) {
+        var callbackCallable = callbacks.pop();
+
+        if (!callbackCallable) {
           cb(val);
           return;
         }
 
-        callbacks.pop()(val, next);
+        callbackCallable(val, next);
       };
 
       next(value);
@@ -148,11 +150,13 @@ export var FormFieldElement = /*#__PURE__*/function (_UIElement) {
       var callbacks = _toConsumableArray(this._afterChange);
 
       var next = function next(val) {
-        if (!callbacks.length) {
+        var callbackCallable = callbacks.pop();
+
+        if (!callbackCallable) {
           return;
         }
 
-        callbacks.pop()(val, form);
+        callbackCallable(val, form);
       };
 
       next(value);
@@ -165,6 +169,10 @@ export var FormFieldElement = /*#__PURE__*/function (_UIElement) {
   }, {
     key: "addAfterChange",
     value: function addAfterChange(cb) {
+      /**
+       * TODO @ts-refactor possibly different subtype. Or so TS complains.
+       */
+      // @ts-ignore
       this._afterChange.push(cb);
     }
   }, {

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

@@ -0,0 +1 @@
+{"version":3,"sources":["FormFieldElement.tsx"],"names":["UIElement","FormFieldElement","id","config","beforeChange","_beforeChange","push","afterChange","_afterChange","applyPlugins","name","props","validators","defaultValue","label","description","placeholder","value","isDisabled","cb","callbacks","next","val","callbackCallable","pop","form"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport { FormRenderPropParams, FormAPI } from \"@webiny/form\";\nimport { UIElement, UIElementConfig } from \"~/ui/UIElement\";\nimport { FormElementRenderProps } from \"~/ui/elements/form/FormElement\";\nimport { Validator } from \"@webiny/validation/types\";\n\nexport interface FormFieldElementConfig<TRenderProps = FormRenderPropParams>\n    extends UIElementConfig<TRenderProps> {\n    name: string;\n    validators?: GetterWithProps<Validator | Validator[]>;\n    beforeChange?: BeforeChange;\n    afterChange?: AfterChange;\n    defaultValue?: any | GetterWithProps<any>;\n    isDisabled?: boolean | GetterWithProps<boolean>;\n    label?: string | GetterWithProps<string>;\n    description?: string | React.ReactElement | GetterWithProps<string | React.ReactElement>;\n    placeholder?: string | GetterWithProps<string>;\n}\n\nexport interface FormFieldElementRenderProps {\n    formProps: FormRenderPropParams;\n}\n\ninterface BeforeChange {\n    (value: any, callback: BeforeChangeCallback): void;\n}\n\ninterface BeforeChangeCallback {\n    (value: any): void;\n}\n\ninterface AfterChange<T = any, D extends Record<string, any> = Record<string, any>> {\n    (value: T, form: FormAPI<D>): void;\n}\n\ninterface GetterWithProps<T> {\n    (props: FormElementRenderProps): T;\n}\n\nexport class FormFieldElement<\n    TConfig extends FormFieldElementConfig = FormFieldElementConfig\n> extends UIElement<TConfig> {\n    private _beforeChange: BeforeChange[] = [];\n    private _afterChange: AfterChange[] = [];\n\n    public constructor(id: string, config: TConfig) {\n        super(id, config);\n\n        if (config.beforeChange) {\n            this._beforeChange.push(config.beforeChange);\n        }\n\n        if (config.afterChange) {\n            this._afterChange.push(config.afterChange);\n        }\n\n        this.applyPlugins(FormFieldElement);\n    }\n\n    public getName(): string {\n        return this.config.name;\n    }\n\n    public getValidators(props?: FormFieldElementRenderProps): Validator | Validator[] {\n        if (!this.config.validators || typeof this.config.validators !== \"function\") {\n            return () => true;\n        }\n\n        return this.config.validators(props as FormFieldElementRenderProps);\n    }\n\n    public getDefaultValue(props?: FormFieldElementRenderProps): any {\n        if (typeof this.config.defaultValue === \"function\") {\n            return this.config.defaultValue(props);\n        }\n\n        return this.config.defaultValue;\n    }\n\n    public getLabel(props?: FormFieldElementRenderProps): string {\n        if (typeof this.config.label === \"function\") {\n            return this.config.label(props as FormFieldElementRenderProps);\n        }\n\n        return this.config.label as string;\n    }\n\n    public getDescription(props?: FormFieldElementRenderProps): string | React.ReactElement {\n        if (typeof this.config.description === \"function\") {\n            return this.config.description(props as FormFieldElementRenderProps);\n        }\n\n        return this.config.description as string;\n    }\n\n    public getPlaceholder(props?: FormFieldElementRenderProps): string {\n        if (typeof this.config.placeholder === \"function\") {\n            return this.config.placeholder(props as FormFieldElementRenderProps);\n        }\n\n        return this.config.placeholder as string;\n    }\n\n    public setLabel(label: string | GetterWithProps<string>): void {\n        this.config.label = label;\n    }\n\n    public setDescription(\n        description: string | React.ReactElement | GetterWithProps<string | React.ReactElement>\n    ): void {\n        this.config.description = description;\n    }\n\n    public setPlaceholder(placeholder: string | GetterWithProps<string>): void {\n        this.config.placeholder = placeholder;\n    }\n\n    public setDefaultValue(value: any | GetterWithProps<any>): void {\n        this.config.defaultValue = value;\n    }\n\n    public getIsDisabled(props?: FormFieldElementRenderProps): boolean {\n        if (typeof this.config.isDisabled === \"function\") {\n            return this.config.isDisabled(props as FormFieldElementRenderProps);\n        }\n        return this.config.isDisabled as boolean;\n    }\n\n    public setIsDisabled(isDisabled: boolean | GetterWithProps<boolean>): void {\n        this.config.isDisabled = isDisabled;\n    }\n\n    public setValidators(validators: GetterWithProps<Validator>): void {\n        this.config.validators = validators;\n    }\n\n    public onBeforeChange(value: string, cb: (value: string) => void): void {\n        const callbacks = [...this._beforeChange];\n        const next = (val: string) => {\n            const callbackCallable = callbacks.pop();\n            if (!callbackCallable) {\n                cb(val);\n                return;\n            }\n            callbackCallable(val, next);\n        };\n\n        next(value);\n    }\n\n    public onAfterChange(value: string, form: FormAPI): void {\n        const callbacks = [...this._afterChange];\n        const next = (val: string) => {\n            const callbackCallable = callbacks.pop();\n            if (!callbackCallable) {\n                return;\n            }\n            callbackCallable(val, form);\n        };\n\n        next(value);\n    }\n\n    public addBeforeChange(cb: BeforeChange): void {\n        this._beforeChange.push(cb);\n    }\n\n    public addAfterChange<T = any, D extends Record<string, any> = Record<string, any>>(\n        cb: AfterChange<T, D>\n    ): void {\n        /**\n         * TODO @ts-refactor possibly different subtype. Or so TS complains.\n         */\n        // @ts-ignore\n        this._afterChange.push(cb);\n    }\n\n    public setBeforeChange(cb: BeforeChange): void {\n        this._beforeChange = [cb];\n    }\n\n    public setAfterChange(cb: AfterChange): void {\n        this._afterChange = [cb];\n    }\n}\n"]}

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

@@ -0,0 +1 @@
+{"version":3,"sources":["HiddenElement.tsx"],"names":["React","FormFieldElement","HiddenElement","id","config","applyPlugins","props","formProps","Error","Bind","getName","getValidators","getDefaultValue","value","cb","onBeforeChange","form","onAfterChange"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SACIC,gBADJ;AAMA,WAAaC,aAAb;AAAA;;AAAA;;AACI,yBAAmBC,EAAnB,EAA+BC,MAA/B,EAA+D;AAAA;;AAAA;;AAC3D,8BAAMD,EAAN,EAAUC,MAAV;;AAEA,UAAKC,YAAL,CAAkBH,aAAlB;;AAH2D;AAI9D;;AALL;AAAA;AAAA,WAOI,gBAAuBI,KAAvB,EAA4E;AAAA;;AACxE,UAAI,CAACA,KAAK,CAACC,SAAX,EAAsB;AAClB,cAAMC,KAAK,yDAAX;AACH;;AAED,UAAQC,IAAR,GAAiBH,KAAK,CAACC,SAAvB,CAAQE,IAAR;AAEA,0BACI,oBAAC,IAAD;AACI,QAAA,IAAI,EAAE,KAAKC,OAAL,EADV;AAEI,QAAA,UAAU,EAAE,KAAKC,aAAL,CAAmBL,KAAnB,CAFhB;AAGI,QAAA,YAAY,EAAE,KAAKM,eAAL,CAAqBN,KAArB,CAHlB;AAII,QAAA,YAAY,EAAE,sBAACO,KAAD,EAAgBC,EAAhB;AAAA,iBAAuB,MAAI,CAACC,cAAL,CAAoBF,KAApB,EAA2BC,EAA3B,CAAvB;AAAA,SAJlB;AAKI,QAAA,WAAW,EAAE,qBAACD,KAAD,EAAgBG,IAAhB;AAAA,iBAAyB,MAAI,CAACC,aAAL,CAAmBJ,KAAnB,EAA0BG,IAA1B,CAAzB;AAAA;AALjB,QADJ;AASH;AAvBL;;AAAA;AAAA,EAAmCf,gBAAnC","sourcesContent":["import React from \"react\";\nimport {\n    FormFieldElement,\n    FormFieldElementConfig,\n    FormFieldElementRenderProps\n} from \"~/ui/elements/form/FormFieldElement\";\n\nexport class HiddenElement extends FormFieldElement {\n    public constructor(id: string, config: FormFieldElementConfig) {\n        super(id, config);\n\n        this.applyPlugins(HiddenElement);\n    }\n\n    public override render(props: FormFieldElementRenderProps): React.ReactNode {\n        if (!props.formProps) {\n            throw Error(`HiddenElement must be placed inside of a FormElement.`);\n        }\n\n        const { Bind } = props.formProps;\n\n        return (\n            <Bind\n                name={this.getName()}\n                validators={this.getValidators(props)}\n                defaultValue={this.getDefaultValue(props)}\n                beforeChange={(value: string, cb) => this.onBeforeChange(value, cb)}\n                afterChange={(value: string, form) => this.onAfterChange(value, form)}\n            />\n        );\n    }\n}\n"]}

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

@@ -0,0 +1 @@
+{"version":3,"sources":["InputElement.tsx"],"names":["React","Input","FormFieldElement","InputElement","id","config","applyPlugins","props","formProps","Error","Bind","getName","getValidators","getDefaultValue","value","cb","onBeforeChange","form","onAfterChange","getLabel","getPlaceholder","getIsDisabled","getDescription"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,KAAT,QAAsB,kBAAtB;AACA,SACIC,gBADJ;AAOA,WAAaC,YAAb;AAAA;;AAAA;;AACI,wBAAmBC,EAAnB,EAA+BC,MAA/B,EAA+D;AAAA;;AAAA;;AAC3D,8BAAMD,EAAN,EAAUC,MAAV;;AAEA,UAAKC,YAAL,CAAkBH,YAAlB;;AAH2D;AAI9D;;AALL;AAAA;AAAA,WAOI,gBAAuBI,KAAvB,EAA4E;AAAA;;AACxE,UAAI,CAACA,KAAK,CAACC,SAAX,EAAsB;AAClB,cAAMC,KAAK,wDAAX;AACH;;AAED,UAAQC,IAAR,GAAiBH,KAAK,CAACC,SAAvB,CAAQE,IAAR;AAEA,0BACI,oBAAC,IAAD;AACI,QAAA,IAAI,EAAE,KAAKC,OAAL,EADV;AAEI,QAAA,UAAU,EAAE,KAAKC,aAAL,CAAmBL,KAAnB,CAFhB;AAGI,QAAA,YAAY,EAAE,KAAKM,eAAL,CAAqBN,KAArB,CAHlB;AAII,QAAA,YAAY,EAAE,sBAACO,KAAD,EAAgBC,EAAhB;AAAA,iBAAuB,MAAI,CAACC,cAAL,CAAoBF,KAApB,EAA2BC,EAA3B,CAAvB;AAAA,SAJlB;AAKI,QAAA,WAAW,EAAE,qBAACD,KAAD,EAAgBG,IAAhB;AAAA,iBAAyB,MAAI,CAACC,aAAL,CAAmBJ,KAAnB,EAA0BG,IAA1B,CAAzB;AAAA;AALjB,sBAOI,oBAAC,KAAD;AACI,QAAA,KAAK,EAAE,KAAKE,QAAL,CAAcZ,KAAd,CADX;AAEI,QAAA,WAAW,EAAE,KAAKa,cAAL,CAAoBb,KAApB,CAFjB;AAGI,QAAA,QAAQ,EAAE,KAAKc,aAAL,CAAmBd,KAAnB,CAHd;AAII,QAAA,WAAW,EAAE,KAAKe,cAAL,CAAoBf,KAApB;AAJjB,QAPJ,CADJ;AAgBH;AA9BL;;AAAA;AAAA,EAAkCL,gBAAlC","sourcesContent":["import React from \"react\";\nimport { Input } from \"@webiny/ui/Input\";\nimport {\n    FormFieldElement,\n    FormFieldElementConfig,\n    FormFieldElementRenderProps\n} from \"~/ui/elements/form/FormFieldElement\";\n\nexport type InputElementRenderProps = FormFieldElementRenderProps;\nexport class InputElement extends FormFieldElement {\n    public constructor(id: string, config: FormFieldElementConfig) {\n        super(id, config);\n\n        this.applyPlugins(InputElement);\n    }\n\n    public override render(props: FormFieldElementRenderProps): React.ReactNode {\n        if (!props.formProps) {\n            throw Error(`InputElement must be placed inside of a FormElement.`);\n        }\n\n        const { Bind } = props.formProps;\n\n        return (\n            <Bind\n                name={this.getName()}\n                validators={this.getValidators(props)}\n                defaultValue={this.getDefaultValue(props)}\n                beforeChange={(value: string, cb) => this.onBeforeChange(value, cb)}\n                afterChange={(value: string, form) => this.onAfterChange(value, form)}\n            >\n                <Input\n                    label={this.getLabel(props)}\n                    placeholder={this.getPlaceholder(props)}\n                    disabled={this.getIsDisabled(props)}\n                    description={this.getDescription(props)}\n                />\n            </Bind>\n        );\n    }\n}\n"]}

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

@@ -0,0 +1 @@
+{"version":3,"sources":["PasswordElement.tsx"],"names":["React","InputElement","Input","PasswordElement","props","formProps","Error","Bind","getName","getValidators","getDefaultValue","value","cb","onBeforeChange","form","onAfterChange","getLabel","getPlaceholder","getIsDisabled","getDescription"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,YAAT;AAEA,SAASC,KAAT,QAAsB,kBAAtB;AAEA,WAAaC,eAAb;AAAA;;AAAA;;AAAA;AAAA;;AAAA;AAAA;;AAAA;AAAA;AAAA,WACI,gBAAuBC,KAAvB,EAA+E;AAAA;;AAC3E,UAAI,CAACA,KAAK,CAACC,SAAX,EAAsB;AAClB,cAAMC,KAAK,2DAAX;AACH;;AAED,UAAQC,IAAR,GAAiBH,KAAK,CAACC,SAAvB,CAAQE,IAAR;AAEA,0BACI,oBAAC,IAAD;AACI,QAAA,IAAI,EAAE,KAAKC,OAAL,EADV;AAEI,QAAA,UAAU,EAAE,KAAKC,aAAL,CAAmBL,KAAnB,CAFhB;AAGI,QAAA,YAAY,EAAE,KAAKM,eAAL,CAAqBN,KAArB,CAHlB;AAII,QAAA,YAAY,EAAE,sBAACO,KAAD,EAAgBC,EAAhB;AAAA,iBAAuB,KAAI,CAACC,cAAL,CAAoBF,KAApB,EAA2BC,EAA3B,CAAvB;AAAA,SAJlB;AAKI,QAAA,WAAW,EAAE,qBAACD,KAAD,EAAgBG,IAAhB;AAAA,iBAAyB,KAAI,CAACC,aAAL,CAAmBJ,KAAnB,EAA0BG,IAA1B,CAAzB;AAAA;AALjB,sBAOI,oBAAC,KAAD;AACI,QAAA,IAAI,EAAE,UADV;AAEI,QAAA,KAAK,EAAE,KAAKE,QAAL,CAAcZ,KAAd,CAFX;AAGI,QAAA,WAAW,EAAE,KAAKa,cAAL,CAAoBb,KAApB,CAHjB;AAII,QAAA,QAAQ,EAAE,KAAKc,aAAL,CAAmBd,KAAnB,CAJd;AAKI,QAAA,WAAW,EAAE,KAAKe,cAAL,CAAoBf,KAApB;AALjB,QAPJ,CADJ;AAiBH;AAzBL;;AAAA;AAAA,EAAqCH,YAArC","sourcesContent":["import React from \"react\";\nimport { InputElement } from \"./InputElement\";\nimport { FormFieldElementRenderProps } from \"~/ui/elements/form/FormFieldElement\";\nimport { Input } from \"@webiny/ui/Input\";\n\nexport class PasswordElement extends InputElement {\n    public override render(props: FormFieldElementRenderProps): React.ReactElement {\n        if (!props.formProps) {\n            throw Error(`PasswordElement must be placed inside of a FormElement.`);\n        }\n\n        const { Bind } = props.formProps;\n\n        return (\n            <Bind\n                name={this.getName()}\n                validators={this.getValidators(props)}\n                defaultValue={this.getDefaultValue(props)}\n                beforeChange={(value: string, cb) => this.onBeforeChange(value, cb)}\n                afterChange={(value: string, form) => this.onAfterChange(value, form)}\n            >\n                <Input\n                    type={\"password\"}\n                    label={this.getLabel(props)}\n                    placeholder={this.getPlaceholder(props)}\n                    disabled={this.getIsDisabled(props)}\n                    description={this.getDescription(props)}\n                />\n            </Bind>\n        );\n    }\n}\n"]}

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

@@ -10,6 +10,6 @@ export interface SelectElementConfig extends FormFieldElementConfig {
 export declare class SelectElement extends FormFieldElement<SelectElementConfig> {
     constructor(id: string, config: SelectElementConfig);
     setOptions(options: SelectElementOption[]): void;
-    getOptions(): SelectElementOption[];
+    getOptions(): SelectElementOption[] | undefined;
     render(props: FormFieldElementRenderProps): React.ReactNode;
 }

package/ui/elements/form/SelectElement.js

@@ -56,7 +56,7 @@ export var SelectElement = /*#__PURE__*/function (_FormFieldElement) {
         label: this.getLabel(props),
         disabled: this.getIsDisabled(props),
         description: this.getDefaultValue(props)
-      }, this.getOptions().map(function (_ref) {
+      }, (this.getOptions() || []).map(function (_ref) {
         var value = _ref.value,
             label = _ref.label;
         return /*#__PURE__*/React.createElement("option", {

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

@@ -0,0 +1 @@
+{"version":3,"sources":["SelectElement.tsx"],"names":["React","Select","FormFieldElement","SelectElement","id","config","applyPlugins","options","props","formProps","Error","Bind","getName","getValidators","getDefaultValue","value","cb","onBeforeChange","form","onAfterChange","getLabel","getIsDisabled","getOptions","map","label"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,MAAT,QAAuB,mBAAvB;AACA,SACIC,gBADJ;AAeA,WAAaC,aAAb;AAAA;;AAAA;;AACI,yBAAmBC,EAAnB,EAA+BC,MAA/B,EAA4D;AAAA;;AAAA;;AACxD,8BAAMD,EAAN,EAAUC,MAAV;;AAEA,UAAKC,YAAL,CAAkBH,aAAlB;;AAHwD;AAI3D;;AALL;AAAA;AAAA,WAOI,oBAAkBI,OAAlB,EAAwD;AACpD,WAAKF,MAAL,CAAYE,OAAZ,GAAsBA,OAAtB;AACH;AATL;AAAA;AAAA,WAWI,sBAAuD;AACnD,aAAO,KAAKF,MAAL,CAAYE,OAAnB;AACH;AAbL;AAAA;AAAA,WAeI,gBAAuBC,KAAvB,EAA4E;AAAA;;AACxE,UAAI,CAACA,KAAK,CAACC,SAAX,EAAsB;AAClB,cAAMC,KAAK,yDAAX;AACH;;AAED,UAAQC,IAAR,GAAiBH,KAAK,CAACC,SAAvB,CAAQE,IAAR;AAEA,0BACI,oBAAC,IAAD;AACI,QAAA,IAAI,EAAE,KAAKC,OAAL,EADV;AAEI,QAAA,UAAU,EAAE,KAAKC,aAAL,CAAmBL,KAAnB,CAFhB;AAGI,QAAA,YAAY,EAAE,KAAKM,eAAL,CAAqBN,KAArB,CAHlB;AAII,QAAA,YAAY,EAAE,sBAACO,KAAD,EAAgBC,EAAhB;AAAA,iBAAuB,MAAI,CAACC,cAAL,CAAoBF,KAApB,EAA2BC,EAA3B,CAAvB;AAAA,SAJlB;AAKI,QAAA,WAAW,EAAE,qBAACD,KAAD,EAAgBG,IAAhB;AAAA,iBAAyB,MAAI,CAACC,aAAL,CAAmBJ,KAAnB,EAA0BG,IAA1B,CAAzB;AAAA;AALjB,sBAOI,oBAAC,MAAD;AACI,QAAA,KAAK,EAAE,KAAKE,QAAL,CAAcZ,KAAd,CADX;AAEI,QAAA,QAAQ,EAAE,KAAKa,aAAL,CAAmBb,KAAnB,CAFd;AAGI,QAAA,WAAW,EAAE,KAAKM,eAAL,CAAqBN,KAArB;AAHjB,SAKK,CAAC,KAAKc,UAAL,MAAqB,EAAtB,EAA0BC,GAA1B,CAA8B;AAAA,YAAGR,KAAH,QAAGA,KAAH;AAAA,YAAUS,KAAV,QAAUA,KAAV;AAAA,4BAC3B;AAAQ,UAAA,GAAG,EAAET,KAAb;AAAoB,UAAA,KAAK,EAAEA;AAA3B,WACKS,KADL,CAD2B;AAAA,OAA9B,CALL,CAPJ,CADJ;AAqBH;AA3CL;;AAAA;AAAA,EAAmCtB,gBAAnC","sourcesContent":["import React from \"react\";\nimport { Select } from \"@webiny/ui/Select\";\nimport {\n    FormFieldElement,\n    FormFieldElementConfig,\n    FormFieldElementRenderProps\n} from \"~/ui/elements/form/FormFieldElement\";\n\nexport interface SelectElementOption {\n    value: string;\n    label: string;\n}\n\nexport interface SelectElementConfig extends FormFieldElementConfig {\n    options?: SelectElementOption[];\n}\n\nexport class SelectElement extends FormFieldElement<SelectElementConfig> {\n    public constructor(id: string, config: SelectElementConfig) {\n        super(id, config);\n\n        this.applyPlugins(SelectElement);\n    }\n\n    public setOptions(options: SelectElementOption[]): void {\n        this.config.options = options;\n    }\n\n    public getOptions(): SelectElementOption[] | undefined {\n        return this.config.options;\n    }\n\n    public override render(props: FormFieldElementRenderProps): React.ReactNode {\n        if (!props.formProps) {\n            throw Error(`SelectElement must be placed inside of a FormElement.`);\n        }\n\n        const { Bind } = props.formProps;\n\n        return (\n            <Bind\n                name={this.getName()}\n                validators={this.getValidators(props)}\n                defaultValue={this.getDefaultValue(props)}\n                beforeChange={(value: string, cb) => this.onBeforeChange(value, cb)}\n                afterChange={(value: string, form) => this.onAfterChange(value, form)}\n            >\n                <Select\n                    label={this.getLabel(props)}\n                    disabled={this.getIsDisabled(props)}\n                    description={this.getDefaultValue(props)}\n                >\n                    {(this.getOptions() || []).map(({ value, label }) => (\n                        <option key={value} value={value}>\n                            {label}\n                        </option>\n                    ))}\n                </Select>\n            </Bind>\n        );\n    }\n}\n"]}

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

@@ -0,0 +1 @@
+{"version":3,"sources":["TextareaElement.tsx"],"names":["React","Input","FormFieldElement","TextareaElement","id","config","applyPlugins","rows","props","formProps","Error","Bind","getName","getValidators","getLabel","getIsDisabled","getRows","getDescription"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,KAAT,QAAsB,kBAAtB;AAEA,SAASC,gBAAT;AAUA,WAAaC,eAAb;AAAA;;AAAA;;AACI,2BAAYC,EAAZ,EAAwBC,MAAxB,EAAuD;AAAA;;AAAA;;AACnD,8BAAMD,EAAN,EAAUC,MAAV;;AAEA,UAAKC,YAAL,CAAkBH,eAAlB;;AAHmD;AAItD;;AALL;AAAA;AAAA,WAOI,iBAAeI,IAAf,EAAmC;AAC/B,WAAKF,MAAL,CAAYE,IAAZ,GAAmBA,IAAnB;AACH;AATL;AAAA;AAAA,WAWI,mBAAyB;AACrB,aAAO,KAAKF,MAAL,CAAYE,IAAnB;AACH;AAbL;AAAA;AAAA,WAeI,gBAAuBC,KAAvB,EAA2E;AACvE,UAAI,CAACA,KAAK,CAACC,SAAX,EAAsB;AAClB,cAAMC,KAAK,2DAAX;AACH;;AAED,UAAQC,IAAR,GAAiBH,KAAK,CAACC,SAAvB,CAAQE,IAAR;AAEA,0BACI,oBAAC,IAAD;AAAM,QAAA,IAAI,EAAE,KAAKC,OAAL,EAAZ;AAA4B,QAAA,UAAU,EAAE,KAAKC,aAAL,CAAmBL,KAAnB;AAAxC,sBACI,oBAAC,KAAD;AACI,QAAA,KAAK,EAAE,KAAKM,QAAL,CAAcN,KAAd,CADX;AAEI,QAAA,QAAQ,EAAE,KAAKO,aAAL,CAAmBP,KAAnB,CAFd;AAGI,QAAA,IAAI,EAAE,KAAKQ,OAAL,EAHV;AAII,QAAA,WAAW,EAAE,KAAKC,cAAL,CAAoBT,KAApB;AAJjB,QADJ,CADJ;AAUH;AAhCL;;AAAA;AAAA,EAAqCN,gBAArC","sourcesContent":["import React from \"react\";\nimport { Input } from \"@webiny/ui/Input\";\nimport { FormRenderPropParams } from \"@webiny/form\";\nimport { FormFieldElement, FormFieldElementConfig } from \"~/ui/elements/form/FormFieldElement\";\n\nexport interface TextareaElementRenderProps {\n    formProps: FormRenderPropParams;\n}\n\nexport interface TextareaElementConfig extends FormFieldElementConfig {\n    rows: number;\n}\n\nexport class TextareaElement extends FormFieldElement<TextareaElementConfig> {\n    constructor(id: string, config: TextareaElementConfig) {\n        super(id, config);\n\n        this.applyPlugins(TextareaElement);\n    }\n\n    public setRows(rows: number): void {\n        this.config.rows = rows;\n    }\n\n    public getRows(): number {\n        return this.config.rows;\n    }\n\n    public override render(props: TextareaElementRenderProps): React.ReactNode {\n        if (!props.formProps) {\n            throw Error(`TextareaElement must be placed inside of a FormElement.`);\n        }\n\n        const { Bind } = props.formProps;\n\n        return (\n            <Bind name={this.getName()} validators={this.getValidators(props)}>\n                <Input\n                    label={this.getLabel(props)}\n                    disabled={this.getIsDisabled(props)}\n                    rows={this.getRows()}\n                    description={this.getDescription(props)}\n                />\n            </Bind>\n        );\n    }\n}\n"]}

package/ui/views/AdminView/ContentElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ContentElement.tsx"],"names":["React","styled","UIElement","UIRenderer","ContentWrapper","width","paddingTop","ContentElementRenderer","next","props","children","ContentElement","id","useGrid","addRenderer","applyPlugins"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,MAAP,MAAmB,iBAAnB;AACA,SAASC,SAAT;AACA,SAASC,UAAT;AAEA,IAAMC,cAAc,gBAAGH,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GAAiB;AACjCI,EAAAA,KAAK,EAAE,MAD0B;AAEjCC,EAAAA,UAAU,EAAE;AAFqB,CAAjB,CAApB;;IAKMC,sB;;;;;;;;;;;;;WACF,sBAAyF;AAAA,UAAhEC,IAAgE,QAAhEA,IAAgE;AAAA,UAA1DC,KAA0D,QAA1DA,KAA0D;AACrF,0BAAO,oBAAC,cAAD,QAAiBA,KAAK,CAACC,QAAN,GAAiBD,KAAK,CAACC,QAAvB,GAAkCF,IAAI,EAAvD,CAAP;AACH;;;;EAHgCL,U;;AAMrC,WAAaQ,cAAb;AAAA;;AAAA;;AACI,0BAAmBC,EAAnB,EAA+B;AAAA;;AAAA;;AAC3B,+BAAMA,EAAN;;AACA,UAAKC,OAAL,CAAa,KAAb;;AACA,UAAKC,WAAL,CAAiB,IAAIP,sBAAJ,EAAjB;;AACA,UAAKQ,YAAL,CAAkBJ,cAAlB;;AAJ2B;AAK9B;;AANL;AAAA,EAAoCT,SAApC","sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { UIElement } from \"~/ui/UIElement\";\nimport { UIRenderer, UIRenderParams } from \"~/ui/UIRenderer\";\n\nconst ContentWrapper = styled(\"div\")({\n    width: \"100%\",\n    paddingTop: 67\n});\n\nclass ContentElementRenderer extends UIRenderer<ContentElement> {\n    public override render({ next, props }: UIRenderParams<ContentElement>): React.ReactNode {\n        return <ContentWrapper>{props.children ? props.children : next()}</ContentWrapper>;\n    }\n}\n\nexport class ContentElement extends UIElement {\n    public constructor(id: string) {\n        super(id);\n        this.useGrid(false);\n        this.addRenderer(new ContentElementRenderer());\n        this.applyPlugins(ContentElement);\n    }\n}\n"]}

package/ui/views/AdminView/HeaderElement.js

@@ -94,14 +94,26 @@ export var HeaderElement = /*#__PURE__*/function (_UIElement) {
     key: "setLogo",
     value: function setLogo(logo) {
       // TODO: extract into a `LogoElement` class
-      this.getElement(ElementID.Logo).replaceWith(new GenericElement(ElementID.Logo, function () {
+      var element = this.getElement(ElementID.Logo);
+
+      if (!element) {
+        return;
+      }
+
+      element.replaceWith(new GenericElement(ElementID.Logo, function () {
         return /*#__PURE__*/React.createElement(TopAppBarTitle, null, logo);
       }));
     }
   }, {
     key: "setMenuButton",
     value: function setMenuButton(menuButton) {
-      this.getElement(ElementID.MenuButton).replaceWith(new GenericElement(ElementID.MenuButton, function () {
+      var button = this.getElement(ElementID.MenuButton);
+
+      if (!button) {
+        return;
+      }
+
+      button.replaceWith(new GenericElement(ElementID.MenuButton, function () {
         return menuButton;
       }));
     }

package/ui/views/AdminView/HeaderElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["HeaderElement.tsx"],"names":["React","UIElement","TopAppBarPrimary","TopAppBarTitle","GenericElement","PlaceholderElement","HeaderSectionLeftElement","HeaderSectionCenterElement","HeaderSectionRightElement","Hamburger","UIRenderer","ElementID","HeaderElementRenderer","next","HeaderElement","id","useGrid","leftSection","addElement","MenuButton","Logo","addRenderer","setMenuButton","applyPlugins","getElement","logo","element","replaceWith","menuButton","button"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT;AACA,SAASC,gBAAT,EAA2BC,cAA3B,QAAiD,sBAAjD;AACA,SAASC,cAAT;AACA,SAASC,kBAAT;AACA,SAASC,wBAAT;AACA,SAASC,0BAAT;AACA,SAASC,yBAAT;AACA,OAAOC,SAAP;AACA,SAASC,UAAT;IAEKC,S;;WAAAA,S;AAAAA,EAAAA,S;AAAAA,EAAAA,S;GAAAA,S,KAAAA,S;;IAKCC,qB;;;;;;;;;;;;;WACF,sBAAiF;AAAA,UAAxDC,IAAwD,QAAxDA,IAAwD;AAC7E,0BAAO,oBAAC,gBAAD;AAAkB,QAAA,KAAK;AAAvB,SAAyBA,IAAI,EAA7B,CAAP;AACH;;;;EAH+BH,U;;AAMpC,WAAaI,aAAb;AAAA;;AAAA;;AACI,yBAAmBC,EAAnB,EAA+B;AAAA;;AAAA;;AAC3B,+BAAMA,EAAN;;AAEA,UAAKC,OAAL,CAAa,KAAb;;AAEA,QAAMC,WAAW,GAAG,MAAKC,UAAL,CAAgB,IAAIZ,wBAAJ,CAA6B,YAA7B,CAAhB,CAApB;;AACAW,IAAAA,WAAW,CAACC,UAAZ,CAAuB,IAAIb,kBAAJ,CAAuBM,SAAS,CAACQ,UAAjC,CAAvB;AACAF,IAAAA,WAAW,CAACC,UAAZ,CAAuB,IAAIb,kBAAJ,CAAuBM,SAAS,CAACS,IAAjC,CAAvB;;AAEA,UAAKF,UAAL,CAAgB,IAAIX,0BAAJ,CAA+B,cAA/B,CAAhB;;AACA,UAAKW,UAAL,CAAgB,IAAIV,yBAAJ,CAA8B,aAA9B,CAAhB;;AAEA,UAAKa,WAAL,CAAiB,IAAIT,qBAAJ,EAAjB;;AAEA,UAAKU,aAAL,eAAmB,oBAAC,SAAD,OAAnB;;AACA,UAAKC,YAAL,CAAkBT,aAAlB;;AAf2B;AAgB9B;;AAjBL;AAAA;AAAA,WAmBI,0BAAkD;AAC9C,aAAO,KAAKU,UAAL,CAAgB,YAAhB,CAAP;AACH;AArBL;AAAA;AAAA,WAuBI,4BAAsD;AAClD,aAAO,KAAKA,UAAL,CAAgB,cAAhB,CAAP;AACH;AAzBL;AAAA;AAAA,WA2BI,2BAAoD;AAChD,aAAO,KAAKA,UAAL,CAAgB,aAAhB,CAAP;AACH;AA7BL;AAAA;AAAA,WA+BI,iBAAeC,IAAf,EAA+C;AAC3C;AACA,UAAMC,OAAO,GAAG,KAAKF,UAAL,CAAgBb,SAAS,CAACS,IAA1B,CAAhB;;AACA,UAAI,CAACM,OAAL,EAAc;AACV;AACH;;AACDA,MAAAA,OAAO,CAACC,WAAR,CACI,IAAIvB,cAAJ,CAAmBO,SAAS,CAACS,IAA7B,EAAmC,YAAM;AACrC,4BAAO,oBAAC,cAAD,QAAiBK,IAAjB,CAAP;AACH,OAFD,CADJ;AAKH;AA1CL;AAAA;AAAA,WA4CI,uBAAqBG,UAArB,EAA2D;AACvD,UAAMC,MAAM,GAAG,KAAKL,UAAL,CAAgBb,SAAS,CAACQ,UAA1B,CAAf;;AACA,UAAI,CAACU,MAAL,EAAa;AACT;AACH;;AACDA,MAAAA,MAAM,CAACF,WAAP,CACI,IAAIvB,cAAJ,CAAmBO,SAAS,CAACQ,UAA7B,EAAyC,YAAM;AAC3C,eAAOS,UAAP;AACH,OAFD,CADJ;AAKH;AAtDL;;AAAA;AAAA,EAAmC3B,SAAnC","sourcesContent":["import React from \"react\";\nimport { UIElement } from \"~/ui/UIElement\";\nimport { TopAppBarPrimary, TopAppBarTitle } from \"@webiny/ui/TopAppBar\";\nimport { GenericElement } from \"~/ui/elements/GenericElement\";\nimport { PlaceholderElement } from \"~/ui/elements/PlaceholderElement\";\nimport { HeaderSectionLeftElement } from \"./HeaderSectionLeftElement\";\nimport { HeaderSectionCenterElement } from \"./HeaderSectionCenterElement\";\nimport { HeaderSectionRightElement } from \"./HeaderSectionRightElement\";\nimport Hamburger from \"./components/Hamburger\";\nimport { UIRenderer, UIRenderParams } from \"~/ui/UIRenderer\";\n\nenum ElementID {\n    MenuButton = \"headerMenuButton\",\n    Logo = \"headerLogo\"\n}\n\nclass HeaderElementRenderer extends UIRenderer<HeaderElement> {\n    public override render({ next }: UIRenderParams<HeaderElement>): React.ReactNode {\n        return <TopAppBarPrimary fixed>{next()}</TopAppBarPrimary>;\n    }\n}\n\nexport class HeaderElement extends UIElement {\n    public constructor(id: string) {\n        super(id);\n\n        this.useGrid(false);\n\n        const leftSection = this.addElement(new HeaderSectionLeftElement(\"headerLeft\"));\n        leftSection.addElement(new PlaceholderElement(ElementID.MenuButton));\n        leftSection.addElement(new PlaceholderElement(ElementID.Logo));\n\n        this.addElement(new HeaderSectionCenterElement(\"headerCenter\"));\n        this.addElement(new HeaderSectionRightElement(\"headerRight\"));\n\n        this.addRenderer(new HeaderElementRenderer());\n\n        this.setMenuButton(<Hamburger />);\n        this.applyPlugins(HeaderElement);\n    }\n\n    public getLeftSection(): HeaderSectionLeftElement {\n        return this.getElement(\"headerLeft\") as HeaderSectionLeftElement;\n    }\n\n    public getCenterSection(): HeaderSectionCenterElement {\n        return this.getElement(\"headerCenter\") as HeaderSectionCenterElement;\n    }\n\n    public getRightSection(): HeaderSectionRightElement {\n        return this.getElement(\"headerRight\") as HeaderSectionRightElement;\n    }\n\n    public setLogo(logo: React.ReactElement): void {\n        // TODO: extract into a `LogoElement` class\n        const element = this.getElement(ElementID.Logo);\n        if (!element) {\n            return;\n        }\n        element.replaceWith(\n            new GenericElement(ElementID.Logo, () => {\n                return <TopAppBarTitle>{logo}</TopAppBarTitle>;\n            })\n        );\n    }\n\n    public setMenuButton(menuButton: React.ReactElement): void {\n        const button = this.getElement(ElementID.MenuButton);\n        if (!button) {\n            return;\n        }\n        button.replaceWith(\n            new GenericElement(ElementID.MenuButton, () => {\n                return menuButton;\n            })\n        );\n    }\n}\n"]}

package/ui/views/AdminView/HeaderSectionCenterElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["HeaderSectionCenterElement.tsx"],"names":["React","css","UIElement","TopAppBarSection","middleBar","width","HeaderSectionCenterElement","id","useGrid","props"],"mappings":";;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,GAAT,QAAoB,SAApB;AACA,SAASC,SAAT;AACA,SAASC,gBAAT,QAAiC,sBAAjC;AAEA,IAAMC,SAAS,gBAAGH,GAAG,CAAC;AAClBI,EAAAA,KAAK,EAAE;AADW,CAAD,qBAArB;AAIA,WAAaC,0BAAb;AAAA;;AAAA;;AACI,sCAAmBC,EAAnB,EAA+B;AAAA;;AAAA;;AAC3B,8BAAMA,EAAN;;AAEA,UAAKC,OAAL,CAAa,KAAb;;AAH2B;AAI9B;;AALL;AAAA;AAAA,WAOI,gBAAuBC,KAAvB,EAAqE;AACjE,0BACI,oBAAC,gBAAD;AAAkB,QAAA,SAAS,EAAEL,SAA7B;AAAwC,QAAA,QAAQ;AAAhD,gGACkBK,KADlB,EADJ;AAKH;AAbL;;AAAA;AAAA,EAAgDP,SAAhD","sourcesContent":["import React from \"react\";\nimport { css } from \"emotion\";\nimport { UIElement, UiElementRenderProps } from \"~/ui/UIElement\";\nimport { TopAppBarSection } from \"@webiny/ui/TopAppBar\";\n\nconst middleBar = css({\n    width: \"50%\"\n});\n\nexport class HeaderSectionCenterElement extends UIElement {\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 (\n            <TopAppBarSection className={middleBar} alignEnd>\n                {super.render(props)}\n            </TopAppBarSection>\n        );\n    }\n}\n"]}

package/ui/views/AdminView/HeaderSectionLeftElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["HeaderSectionLeftElement.tsx"],"names":["React","css","UIElement","TopAppBarSection","edgeBars","width","HeaderSectionLeftElement","id","useGrid","props"],"mappings":";;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,GAAT,QAAoB,SAApB;AACA,SAASC,SAAT;AACA,SAASC,gBAAT,QAAiC,sBAAjC;AAEA,IAAMC,QAAQ,gBAAGH,GAAG,CAAC;AACjBI,EAAAA,KAAK,EAAE;AADU,CAAD,oBAApB;AAIA,WAAaC,wBAAb;AAAA;;AAAA;;AACI,oCAAmBC,EAAnB,EAA+B;AAAA;;AAAA;;AAC3B,8BAAMA,EAAN;;AAEA,UAAKC,OAAL,CAAa,KAAb;;AAH2B;AAI9B;;AALL;AAAA;AAAA,WAOI,gBAAuBC,KAAvB,EAAqE;AACjE,0BACI,oBAAC,gBAAD;AAAkB,QAAA,SAAS,EAAEL,QAA7B;AAAuC,QAAA,UAAU;AAAjD,8FACkBK,KADlB,EADJ;AAKH;AAbL;;AAAA;AAAA,EAA8CP,SAA9C","sourcesContent":["import React from \"react\";\nimport { css } from \"emotion\";\nimport { UIElement, UiElementRenderProps } from \"~/ui/UIElement\";\nimport { TopAppBarSection } from \"@webiny/ui/TopAppBar\";\n\nconst edgeBars = css({\n    width: \"25%\"\n});\n\nexport class HeaderSectionLeftElement extends UIElement {\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 (\n            <TopAppBarSection className={edgeBars} alignStart>\n                {super.render(props)}\n            </TopAppBarSection>\n        );\n    }\n}\n"]}

package/ui/views/AdminView/HeaderSectionRightElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["HeaderSectionRightElement.tsx"],"names":["React","css","UIElement","TopAppBarSection","edgeBars","width","HeaderSectionRightElement","id","useGrid","props"],"mappings":";;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,GAAT,QAAoB,SAApB;AACA,SAASC,SAAT;AACA,SAASC,gBAAT,QAAiC,sBAAjC;AAEA,IAAMC,QAAQ,gBAAGH,GAAG,CAAC;AACjBI,EAAAA,KAAK,EAAE;AADU,CAAD,oBAApB;AAIA,WAAaC,yBAAb;AAAA;;AAAA;;AACI,qCAAmBC,EAAnB,EAA+B;AAAA;;AAAA;;AAC3B,8BAAMA,EAAN;;AAEA,UAAKC,OAAL,CAAa,KAAb;;AAH2B;AAI9B;;AALL;AAAA;AAAA,WAOI,gBAAuBC,KAAvB,EAAqE;AACjE,0BACI,oBAAC,gBAAD;AAAkB,QAAA,SAAS,EAAEL,QAA7B;AAAuC,QAAA,QAAQ;AAA/C,+FACkBK,KADlB,EADJ;AAKH;AAbL;;AAAA;AAAA,EAA+CP,SAA/C","sourcesContent":["import React from \"react\";\nimport { css } from \"emotion\";\nimport { UIElement, UiElementRenderProps } from \"~/ui/UIElement\";\nimport { TopAppBarSection } from \"@webiny/ui/TopAppBar\";\n\nconst edgeBars = css({\n    width: \"25%\"\n});\n\nexport class HeaderSectionRightElement extends UIElement {\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 (\n            <TopAppBarSection className={edgeBars} alignEnd>\n                {super.render(props)}\n            </TopAppBarSection>\n        );\n    }\n}\n"]}

package/ui/views/AdminView/components/Dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Dialog.tsx"],"names":["React","useCallback","useUi","Dialog","DialogAccept","DialogTitle","DialogActions","DialogContent","DialogContainer","ui","message","dataTestId","title","actions","cancel","accept","label","style","hideDialog","setState","dialog","onClick"],"mappings":";;AAAA,OAAOA,KAAP,IAAgBC,WAAhB,QAAmC,OAAnC;AAEA,SAASC,KAAT,QAAsB,yBAAtB;AACA,SAASC,MAAT,EAAiBC,YAAjB,EAA+BC,WAA/B,EAA4CC,aAA5C,EAA2DC,aAA3D,QAAgF,mBAAhF;AAEA,OAAO,IAAMC,eAAyB,GAAG,SAA5BA,eAA4B,GAAM;AAC3C,MAAMC,EAAE,GAAGP,KAAK,EAAhB;;AACA,MAAMQ,OAAO,GAAG,KAAID,EAAJ,EAAQ,gBAAR,CAAhB;;AACA,cAKI,KAAIA,EAAJ,EAAQ,gBAAR,EAA0B,EAA1B,CALJ;AAAA,MACIE,UADJ,SACIA,UADJ;AAAA,MAEIC,KAFJ,SAEIA,KAFJ;AAAA,4BAGIC,OAHJ;AAAA,MAGIA,OAHJ,8BAGc;AAAEC,IAAAA,MAAM,EAAE,IAAV;AAAgBC,IAAAA,MAAM,EAAE;AAAEC,MAAAA,KAAK,EAAE;AAAT;AAAxB,GAHd;AAAA,MAIIC,KAJJ,SAIIA,KAJJ;;AAOA,MAAMC,UAAU,GAAGjB,WAAW,CAAC,YAAM;AACjCQ,IAAAA,EAAE,CAACU,QAAH,CAAY,UAAAV,EAAE;AAAA,6CAAUA,EAAV;AAAcW,QAAAA,MAAM,EAAE;AAAtB;AAAA,KAAd;AACH,GAF6B,EAE3B,CAACX,EAAD,CAF2B,CAA9B;AAIA,sBACI,oBAAC,MAAD;AAAQ,IAAA,IAAI,EAAE,CAAC,CAACC,OAAhB;AAAyB,IAAA,OAAO,EAAEQ,UAAlC;AAA8C,mBAAaP,UAA3D;AAAuE,IAAA,KAAK,EAAEM;AAA9E,KACKL,KAAK,iBAAI,oBAAC,WAAD,QAAcA,KAAd,CADd,eAEI,oBAAC,aAAD,QAAgBF,OAAhB,CAFJ,eAGI,oBAAC,aAAD,QACKG,OAAO,CAACC,MAAR,iBACG,oBAAC,YAAD;AAAc,IAAA,OAAO,EAAED,OAAO,CAACC,MAAR,CAAeO;AAAtC,KACKR,OAAO,CAACC,MAAR,CAAeE,KADpB,CAFR,EAMKH,OAAO,CAACE,MAAR,iBACG,oBAAC,YAAD;AAAc,IAAA,OAAO,EAAEF,OAAO,CAACE,MAAR,CAAeM;AAAtC,KACKR,OAAO,CAACE,MAAR,CAAeC,KADpB,CAPR,CAHJ,CADJ;AAkBH,CAhCM","sourcesContent":["import React, { useCallback } from \"react\";\nimport { get } from \"lodash\";\nimport { useUi } from \"@webiny/app/hooks/useUi\";\nimport { Dialog, DialogAccept, DialogTitle, DialogActions, DialogContent } from \"@webiny/ui/Dialog\";\n\nexport const DialogContainer: React.FC = () => {\n    const ui = useUi();\n    const message = get(ui, \"dialog.message\");\n    const {\n        dataTestId,\n        title,\n        actions = { cancel: null, accept: { label: \"OK\" } },\n        style\n    } = get(ui, \"dialog.options\", {});\n\n    const hideDialog = useCallback(() => {\n        ui.setState(ui => ({ ...ui, dialog: null }));\n    }, [ui]);\n\n    return (\n        <Dialog open={!!message} onClose={hideDialog} data-testid={dataTestId} style={style}>\n            {title && <DialogTitle>{title}</DialogTitle>}\n            <DialogContent>{message}</DialogContent>\n            <DialogActions>\n                {actions.cancel && (\n                    <DialogAccept onClick={actions.cancel.onClick}>\n                        {actions.cancel.label}\n                    </DialogAccept>\n                )}\n                {actions.accept && (\n                    <DialogAccept onClick={actions.accept.onClick}>\n                        {actions.accept.label}\n                    </DialogAccept>\n                )}\n            </DialogActions>\n        </Dialog>\n    );\n};\n"]}

package/ui/views/AdminView/components/Hamburger.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Hamburger.tsx"],"names":["React","useCallback","get","set","useUi","IconButton","ReactComponent","MenuIcon","Hamburger","ui","toggleMenu","setState","color"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,WAAhB,QAAmC,OAAnC;AACA,SAASC,GAAT,EAAcC,GAAd,QAAyB,oBAAzB;AACA,SAASC,KAAT,QAAsB,yBAAtB;AACA,SAASC,UAAT,QAA2B,mBAA3B;AACA,SAASC,cAAc,IAAIC,QAA3B;;AAEA,IAAMC,SAAmB,GAAG,SAAtBA,SAAsB,GAAM;AAC9B,MAAMC,EAAE,GAAGL,KAAK,EAAhB;AAEA,MAAMM,UAAU,GAAGT,WAAW,CAAC,YAAM;AACjCQ,IAAAA,EAAE,CAACE,QAAH,CAAY,UAAAF,EAAE;AAAA,aAAIN,GAAG,CAACM,EAAD,EAAK,eAAL,EAAsB,EAAEP,GAAG,CAACO,EAAD,EAAK,eAAL,CAAH,IAA4B,KAA9B,CAAtB,CAAP;AAAA,KAAd;AACH,GAF6B,EAE3B,CAACA,EAAD,CAF2B,CAA9B;AAIA,sBACI,oBAAC,UAAD;AACI,IAAA,IAAI,eAAE,oBAAC,QAAD;AAAU,MAAA,KAAK,EAAE;AAAEG,QAAAA,KAAK,EAAE;AAAT;AAAjB,MADV;AAEI,IAAA,OAAO,EAAEF,UAFb;AAGI,mBAAa;AAHjB,IADJ;AAOH,CAdD;;AAgBA,eAAeF,SAAf","sourcesContent":["import React, { useCallback } from \"react\";\nimport { get, set } from \"dot-prop-immutable\";\nimport { useUi } from \"@webiny/app/hooks/useUi\";\nimport { IconButton } from \"@webiny/ui/Button\";\nimport { ReactComponent as MenuIcon } from \"~/assets/icons/baseline-menu-24px.svg\";\n\nconst Hamburger: React.FC = () => {\n    const ui = useUi();\n\n    const toggleMenu = useCallback(() => {\n        ui.setState(ui => set(ui, \"appsMenu.show\", !(get(ui, \"appsMenu.show\") || false)));\n    }, [ui]);\n\n    return (\n        <IconButton\n            icon={<MenuIcon style={{ color: \"white\" }} />}\n            onClick={toggleMenu}\n            data-testid={\"apps-menu\"}\n        />\n    );\n};\n\nexport default Hamburger;\n"]}

package/ui/views/AdminView/components/Snackbar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Snackbar.tsx"],"names":["React","useCallback","Snackbar","useUi","SnackbarMain","ui","message","options","hideSnackbar","setState","snackbar"],"mappings":";;AAAA,OAAOA,KAAP,IAAgBC,WAAhB,QAAmC,OAAnC;AACA,SAASC,QAAT,QAAyB,qBAAzB;AAEA,SAASC,KAAT,QAAsB,yBAAtB;;AAEA,IAAMC,YAAsB,GAAG,SAAzBA,YAAyB,GAAM;AACjC,MAAMC,EAAE,GAAGF,KAAK,EAAhB;;AACA,MAAMG,OAAO,GAAG,KAAID,EAAJ,EAAQ,kBAAR,CAAhB;;AACA,MAAME,OAAO,GAAG,KAAIF,EAAJ,EAAQ,kBAAR,EAA4B,EAA5B,CAAhB;;AAEA,MAAMG,YAAY,GAAGP,WAAW,CAAC,YAAM;AACnCI,IAAAA,EAAE,CAACI,QAAH,CAAY,UAAAJ,EAAE;AAAA,6CAAUA,EAAV;AAAcK,QAAAA,QAAQ,EAAE;AAAxB;AAAA,KAAd;AACH,GAF+B,EAE7B,CAACL,EAAD,CAF6B,CAAhC;AAIA,sBAAO,oBAAC,QAAD;AAAU,IAAA,IAAI,EAAE,CAAC,CAACC,OAAlB;AAA2B,IAAA,OAAO,EAAEE,YAApC;AAAkD,IAAA,OAAO,EAAEF;AAA3D,KAAwEC,OAAxE,EAAP;AACH,CAVD;;AAYA,eAAeH,YAAf","sourcesContent":["import React, { useCallback } from \"react\";\nimport { Snackbar } from \"@webiny/ui/Snackbar\";\nimport { get } from \"lodash\";\nimport { useUi } from \"@webiny/app/hooks/useUi\";\n\nconst SnackbarMain: React.FC = () => {\n    const ui = useUi();\n    const message = get(ui, \"snackbar.message\");\n    const options = get(ui, \"snackbar.options\", {});\n\n    const hideSnackbar = useCallback(() => {\n        ui.setState(ui => ({ ...ui, snackbar: null }));\n    }, [ui]);\n\n    return <Snackbar open={!!message} onClose={hideSnackbar} message={message} {...options} />;\n};\n\nexport default SnackbarMain;\n"]}

package/ui/views/FormView/FormContainerElement.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { UIElement, UIElementConfig, UiElementRenderProps } from "../../UIElement";
 interface FormContainerConfig extends UIElementConfig {
     testId?: string;

package/ui/views/FormView/FormContainerElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["FormContainerElement.tsx"],"names":["React","classNames","styled","Elevation","UIElement","FormContainerWrapper","position","margin","FormContainerElement","id","config","useGrid","props","children","className","testId","noElevation"],"mappings":";;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,MAAP,MAAmB,iBAAnB;AACA,SAASC,SAAT,QAA0B,sBAA1B;AACA,SAASC,SAAT;AAEA,IAAMC,oBAAoB,gBAAGH,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GAAiB;AACvCI,EAAAA,QAAQ,EAAE,UAD6B;AAEvCC,EAAAA,MAAM,EAAE;AAF+B,CAAjB,CAA1B;AAWA,WAAaC,oBAAb;AAAA;;AAAA;;AACI,gCAAmBC,EAAnB,EAA+BC,MAA/B,EAA4D;AAAA;;AAAA;;AACxD,8BAAMD,EAAN,EAAUC,MAAV;;AACA,UAAKC,OAAL,CAAa,KAAb;;AAFwD;AAG3D;;AAJL;AAAA;AAAA,WAMI,gBAAuBC,KAAvB,EAAoD;AAChD,UAAMC,QAAQ,oFAAgBD,KAAhB,CAAd;;AAEA,0BACI,oBAAC,oBAAD;AACI,QAAA,SAAS,EAAEX,UAAU,CAAC,kBAAD,EAAqB,KAAKS,MAAL,CAAYI,SAAjC,CADzB;AAEI,uBAAa,KAAKJ,MAAL,CAAYK;AAF7B,SAIK,KAAKL,MAAL,CAAYM,WAAZ,GAA0BH,QAA1B,gBAAqC,oBAAC,SAAD;AAAW,QAAA,CAAC,EAAE;AAAd,SAAkBA,QAAlB,CAJ1C,CADJ;AAQH;AAjBL;;AAAA;AAAA,EAA0CT,SAA1C","sourcesContent":["import React from \"react\";\nimport classNames from \"classnames\";\nimport styled from \"@emotion/styled\";\nimport { Elevation } from \"@webiny/ui/Elevation\";\nimport { UIElement, UIElementConfig, UiElementRenderProps } from \"~/ui/UIElement\";\n\nconst FormContainerWrapper = styled(\"div\")({\n    position: \"relative\",\n    margin: \"17px 50px\"\n});\n\ninterface FormContainerConfig extends UIElementConfig {\n    testId?: string;\n    noElevation?: boolean;\n    className?: string;\n}\n\nexport class FormContainerElement extends UIElement<FormContainerConfig> {\n    public constructor(id: string, config: FormContainerConfig) {\n        super(id, config);\n        this.useGrid(false);\n    }\n\n    public override render(props: UiElementRenderProps) {\n        const children = super.render(props);\n\n        return (\n            <FormContainerWrapper\n                className={classNames(\"webiny-data-list\", this.config.className)}\n                data-testid={this.config.testId}\n            >\n                {this.config.noElevation ? children : <Elevation z={1}>{children}</Elevation>}\n            </FormContainerWrapper>\n        );\n    }\n}\n"]}