@webiny/ui 5.23.1 → 5.25.0-beta.0

package/ConfirmationDialog/ConfirmationDialog.d.ts

@@ -1,12 +1,12 @@
-import * as React from "react";
+import React from "react";
 interface ChildrenRenderProp {
-    showConfirmation: (onAccept?: Function, onCancel?: Function) => any;
+    showConfirmation: (onAccept?: () => void, onCancel?: () => void) => any;
 }
 interface ConfirmationCallbacks {
-    onAccept: Function;
-    onCancel: Function;
+    onAccept?: () => void;
+    onCancel?: () => void;
 }
-declare type Props = {
+interface Props {
     title?: React.ReactNode;
     message?: React.ReactNode;
     loading?: React.ReactNode;
@@ -14,15 +14,15 @@ declare type Props = {
     children: (props: ChildrenRenderProp) => React.ReactNode;
     disableConfirm?: boolean;
     style?: React.CSSProperties;
-};
-declare type State = {
+}
+interface ConfirmationDialogState {
     show: boolean;
     loading: boolean;
-};
+}
 /**
  * Use ConfirmationDialog component to display a list of choices, once the handler is triggered.
  */
-declare class ConfirmationDialog extends React.Component<Props, State> {
+declare class ConfirmationDialog extends React.Component<Props, ConfirmationDialogState> {
     static defaultProps: {
         title: string;
         message: string;
@@ -36,10 +36,10 @@ declare class ConfirmationDialog extends React.Component<Props, State> {
     };
     componentDidMount(): void;
     componentWillUnmount(): void;
-    showConfirmation: (onAccept?: Function, onCancel?: Function) => void;
-    hideConfirmation: () => void;
-    onAccept: () => Promise<void>;
-    onCancel: () => Promise<void>;
+    private readonly showConfirmation;
+    private readonly hideConfirmation;
+    private readonly onAccept;
+    private readonly onCancel;
     render(): JSX.Element;
 }
 export { ConfirmationDialog };

package/ConfirmationDialog/ConfirmationDialog.js

@@ -6,8 +6,7 @@ import _inherits from "@babel/runtime/helpers/inherits";
 import _createSuper from "@babel/runtime/helpers/createSuper";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
-import * as React from "react";
-import noop from "lodash/noop";
+import React from "react";
 import { Dialog, DialogButton, DialogCancel, DialogActions, DialogTitle, DialogContent } from "./../Dialog";
 import { CircularProgress } from "../Progress";
 
@@ -33,8 +32,12 @@ var ConfirmationDialog = /*#__PURE__*/function (_React$Component) {
     _defineProperty(_assertThisInitialized(_this), "__isMounted", false);
 
     _defineProperty(_assertThisInitialized(_this), "callbacks", {
-      onAccept: noop,
-      onCancel: noop
+      onAccept: function onAccept() {
+        return void 0;
+      },
+      onCancel: function onCancel() {
+        return void 0;
+      }
     });
 
     _defineProperty(_assertThisInitialized(_this), "state", {

package/ConfirmationDialog/ConfirmationDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ConfirmationDialog.tsx"],"names":["React","Dialog","DialogButton","DialogCancel","DialogActions","DialogTitle","DialogContent","CircularProgress","ConfirmationDialog","onAccept","onCancel","show","loading","callbacks","setState","__isMounted","props","style","state","hideConfirmation","title","message","disableConfirm","children","showConfirmation","Component"],"mappings":"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","sourcesContent":["import React from \"react\";\n\nimport {\n    Dialog,\n    DialogButton,\n    DialogCancel,\n    DialogActions,\n    DialogTitle,\n    DialogContent\n} from \"./../Dialog\";\n\nimport { CircularProgress } from \"../Progress\";\n\ninterface ChildrenRenderProp {\n    showConfirmation: (onAccept?: () => void, onCancel?: () => void) => any;\n}\n\ninterface ConfirmationCallbacks {\n    onAccept?: () => void;\n    onCancel?: () => void;\n}\n\ninterface Props {\n    // Title of confirmation dialog\n    title?: React.ReactNode;\n\n    // Message of confirmation dialog\n    message?: React.ReactNode;\n\n    // This element will be rendered during loading\n    loading?: React.ReactNode;\n\n    // For testing purposes\n    \"data-testid\"?: string;\n\n    // An element that will trigger the confirmation dialog.\n    children: (props: ChildrenRenderProp) => React.ReactNode;\n\n    // Is `Confirm` button disabled\n    disableConfirm?: boolean;\n\n    // Dialog component's custom in-line styles.\n    style?: React.CSSProperties;\n}\n\ninterface ConfirmationDialogState {\n    show: boolean;\n    loading: boolean;\n}\n\n/**\n * Use ConfirmationDialog component to display a list of choices, once the handler is triggered.\n */\nclass ConfirmationDialog extends React.Component<Props, ConfirmationDialogState> {\n    static defaultProps = {\n        title: \"Confirmation\",\n        message: \"Are you sure you want to continue?\",\n        loading: <CircularProgress />\n    };\n\n    __isMounted = false;\n\n    callbacks: ConfirmationCallbacks = {\n        onAccept: () => {\n            return void 0;\n        },\n        onCancel: () => {\n            return void 0;\n        }\n    };\n\n    public override state = {\n        show: false,\n        loading: false\n    };\n\n    public override componentDidMount() {\n        this.__isMounted = true;\n    }\n\n    public override componentWillUnmount() {\n        this.__isMounted = false;\n    }\n\n    private readonly showConfirmation = (onAccept?: () => void, onCancel?: () => void) => {\n        this.callbacks = {\n            onAccept,\n            onCancel\n        };\n        this.setState({ show: true });\n    };\n\n    private readonly hideConfirmation = () => {\n        this.setState({ show: false });\n    };\n\n    private readonly onAccept = async () => {\n        const { onAccept } = this.callbacks;\n        if (typeof onAccept === \"function\") {\n            this.setState({ loading: true });\n            await onAccept();\n            if (this.__isMounted) {\n                this.setState({ loading: false, show: false });\n            }\n        }\n    };\n\n    private readonly onCancel = async () => {\n        const { onCancel } = this.callbacks;\n        if (typeof onCancel === \"function\") {\n            await onCancel();\n        }\n    };\n\n    public override render() {\n        return (\n            <React.Fragment>\n                <Dialog\n                    style={this.props.style}\n                    open={this.state.show}\n                    onClose={this.hideConfirmation}\n                    data-testid={this.props[\"data-testid\"]}\n                >\n                    {this.state.loading ? this.props.loading : null}\n                    <DialogTitle>{this.props.title}</DialogTitle>\n                    <DialogContent>{this.props.message}</DialogContent>\n                    <DialogActions>\n                        <DialogCancel onClick={this.onCancel}>Cancel</DialogCancel>\n                        <DialogButton\n                            data-testid=\"confirmationdialog-confirm-action\"\n                            onClick={this.onAccept}\n                            disabled={this.props.disableConfirm}\n                        >\n                            Confirm\n                        </DialogButton>\n                    </DialogActions>\n                </Dialog>\n                {this.props.children({\n                    showConfirmation: this.showConfirmation\n                })}\n            </React.Fragment>\n        );\n    }\n}\n\nexport { ConfirmationDialog };\n"]}

package/ConfirmationDialog/ConfirmationDialog.stories.js

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React from "react";
 import { storiesOf } from "@storybook/react";
 import { Story, StoryReadme, StorySandboxCode, StorySandbox, StorySandboxExample } from "@webiny/storybook-utils/Story";
 import readme from "./../ConfirmationDialog/README.md";

package/ConfirmationDialog/ConfirmationDialog.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ConfirmationDialog.stories.tsx"],"names":["React","storiesOf","Story","StoryReadme","StorySandboxCode","StorySandbox","StorySandboxExample","readme","ButtonPrimary","ConfirmationDialog","story","module","add","showConfirmation","console","log","info","propTables"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,QAA0B,kBAA1B;AACA,SACIC,KADJ,EAEIC,WAFJ,EAGIC,gBAHJ,EAIIC,YAJJ,EAKIC,mBALJ,QAMO,+BANP;AAOA,OAAOC,MAAP;AACA,SAASC,aAAT;AACA,SAASC,kBAAT;AAEA,IAAMC,KAAK,GAAGT,SAAS,CAAC,+BAAD,EAAkCU,MAAlC,CAAvB;AAEAD,KAAK,CAACE,GAAN,CACI,OADJ,EAEI,YAAM;AACF,sBACI,oBAAC,KAAD,qBACI,oBAAC,WAAD,QAAcL,MAAd,CADJ,eAEI,oBAAC,YAAD;AAAc,IAAA,KAAK,EAAE;AAArB,kBACI,oBAAC,mBAAD,qBACI,oBAAC,kBAAD;AACI,IAAA,KAAK,EAAC,aADV;AAEI,IAAA,OAAO,EAAC;AAFZ,KAIK,gBAA0B;AAAA,QAAvBM,gBAAuB,QAAvBA,gBAAuB;AACvB,wBACI,oBAAC,aAAD;AACI,MAAA,OAAO,EAAE,mBAAM;AACXA,QAAAA,gBAAgB,CACZ;AAAA,iBAAMC,OAAO,CAACC,GAAR,CAAY,SAAZ,CAAN;AAAA,SADY,EAEZ;AAAA,iBAAMD,OAAO,CAACC,GAAR,CAAY,QAAZ,CAAN;AAAA,SAFY,CAAhB;AAIH;AANL,qBADJ;AAYH,GAjBL,CADJ,CADJ,eAsBI,oBAAC,gBAAD,o7BAtBJ,CAFJ,CADJ;AAmDH,CAtDL,EAuDI;AAAEC,EAAAA,IAAI,EAAE;AAAEC,IAAAA,UAAU,EAAE,CAACR,kBAAD;AAAd;AAAR,CAvDJ","sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport {\n    Story,\n    StoryReadme,\n    StorySandboxCode,\n    StorySandbox,\n    StorySandboxExample\n} from \"@webiny/storybook-utils/Story\";\nimport readme from \"./../ConfirmationDialog/README.md\";\nimport { ButtonPrimary } from \"./../Button\";\nimport { ConfirmationDialog } from \"./ConfirmationDialog\";\n\nconst story = storiesOf(\"Components/ConfirmationDialog\", module);\n\nstory.add(\n    \"usage\",\n    () => {\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox title={\"Icon with and without ConfirmationDialog\"}>\n                    <StorySandboxExample>\n                        <ConfirmationDialog\n                            title=\"Pay Invoice\"\n                            message=\"Are you sure you want pay this invoice?\"\n                        >\n                            {({ showConfirmation }) => {\n                                return (\n                                    <ButtonPrimary\n                                        onClick={() => {\n                                            showConfirmation(\n                                                () => console.log(\"Confirm\"),\n                                                () => console.log(\"Cancel\")\n                                            );\n                                        }}\n                                    >\n                                        Pay Invoice\n                                    </ButtonPrimary>\n                                );\n                            }}\n                        </ConfirmationDialog>\n                    </StorySandboxExample>\n                    <StorySandboxCode>\n                        {`\n                     <ConfirmationDialog\n                        title=\"Pay Invoice\"\n                        message=\"Are you sure you want pay this invoice?\"\n                    >\n                        {({ showConfirmation }) => {\n                            return (\n                                <ButtonPrimary\n                                    onClick={() => {\n                                        showConfirmation(\n                                            () => console.log(\"Confirm\"),\n                                            () => console.log(\"Cancel\")\n                                        );\n                                    }}\n                                >\n                                    Pay Invoice\n                                </ButtonPrimary>\n                            );\n                        }}\n                    </ConfirmationDialog>\n                    `}\n                    </StorySandboxCode>\n                </StorySandbox>\n            </Story>\n        );\n    },\n    { info: { propTables: [ConfirmationDialog] } }\n);\n"]}

package/ConfirmationDialog/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA;AACA","sourcesContent":["export * from \"./ConfirmationDialog\";\nexport * from \"./withConfirmation\";\n"]}

package/ConfirmationDialog/withConfirmation.d.ts

@@ -1,9 +1,9 @@
-import * as React from "react";
+import React from "react";
 declare type ConfirmationProps = {
     title?: React.ReactNode;
     message?: React.ReactNode;
 };
-declare type WithConfirmationParams = (props: any) => ConfirmationProps;
+declare type WithConfirmationParams = (props: Record<string, any>) => ConfirmationProps;
 export declare type WithConfirmationProps = {
     showConfirmation: (confirm: Function, cancel: Function) => void;
 };

package/ConfirmationDialog/withConfirmation.js

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React from "react";
 import { ConfirmationDialog } from "./ConfirmationDialog";
 export var withConfirmation = function withConfirmation(dialogProps) {
   return function (Component) {

package/ConfirmationDialog/withConfirmation.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["withConfirmation.tsx"],"names":["React","ConfirmationDialog","withConfirmation","dialogProps","Component","withConfirmationRender","ownProps","props","showConfirmation"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,kBAAT;AAaA,OAAO,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,WAAD,EAAmD;AAC/E,SAAO,UAACC,SAAD,EAAuC;AAC1C,WAAO,SAASC,sBAAT,CAAgCC,QAAhC,EAA+D;AAClE,UAAMC,KAAK,GAAG,OAAOJ,WAAP,KAAuB,UAAvB,GAAoCA,WAAW,CAACG,QAAD,CAA/C,GAA4DH,WAA1E;AACA,0BACI,oBAAC,kBAAD,EAAwBI,KAAxB,EACK;AAAA,YAAGC,gBAAH,QAAGA,gBAAH;AAAA,4BACG,oBAAC,SAAD,oBAAeF,QAAf;AAAyB,UAAA,gBAAgB,EAAEE;AAA3C,WADH;AAAA,OADL,CADJ;AAOH,KATD;AAUH,GAXD;AAYH,CAbM","sourcesContent":["import React from \"react\";\nimport { ConfirmationDialog } from \"./ConfirmationDialog\";\n\ntype ConfirmationProps = {\n    title?: React.ReactNode;\n    message?: React.ReactNode;\n};\n\ntype WithConfirmationParams = (props: Record<string, any>) => ConfirmationProps;\n\nexport type WithConfirmationProps = {\n    showConfirmation: (confirm: Function, cancel: Function) => void;\n};\n\nexport const withConfirmation = (dialogProps: WithConfirmationParams): Function => {\n    return (Component: typeof React.Component) => {\n        return function withConfirmationRender(ownProps: Record<string, any>) {\n            const props = typeof dialogProps === \"function\" ? dialogProps(ownProps) : dialogProps;\n            return (\n                <ConfirmationDialog {...props}>\n                    {({ showConfirmation }) => (\n                        <Component {...ownProps} showConfirmation={showConfirmation} />\n                    )}\n                </ConfirmationDialog>\n            );\n        };\n    };\n};\n"]}

package/Dialog/Dialog.d.ts

@@ -1,29 +1,28 @@
-import * as React from "react";
+import React from "react";
 import { DialogProps as RmwcDialogProps, DialogOnCloseEventT, DialogContentProps as RmwcDialogContentProps, DialogTitleProps as RmwcDialogTitleProps, DialogActionsProps as RmwcDialogActionsProps, DialogButtonProps as RmwcDialogButtonProps } from "@rmwc/dialog";
 export declare type DialogOnClose = (event: DialogOnCloseEventT) => void;
-export declare type DialogProps = RmwcDialogProps & {
-    children: any;
+export interface DialogProps extends RmwcDialogProps {
     className?: string;
     style?: React.CSSProperties;
     open?: boolean;
     onClose?: (evt: DialogOnCloseEventT) => void;
     preventOutsideDismiss?: boolean;
-};
+}
 export declare class Dialog extends React.Component<DialogProps> {
-    container?: Element;
-    constructor(props: any);
+    container: HTMLElement;
+    constructor(props: DialogProps);
     render(): React.ReactPortal;
 }
-export declare type DialogTitleProps = RmwcDialogTitleProps & {
+export interface DialogTitleProps extends RmwcDialogTitleProps {
     /**
      * Title text.
      */
     children: React.ReactNode[] | React.ReactNode;
-};
+}
 /**
  * Dialog's header, which can accept DialogHeaderTitle component or any other set of components.
  */
-export declare const DialogTitle: (props: DialogTitleProps) => JSX.Element;
+export declare const DialogTitle: React.FC<DialogTitleProps>;
 export declare type DialogContentProps = RmwcDialogContentProps & {
     /**
      * Dialog content.
@@ -34,55 +33,47 @@ export declare type DialogContentProps = RmwcDialogContentProps & {
 /**
  * A simple component for showing dialog's body.
  */
-export declare const DialogContent: (props: DialogContentProps) => JSX.Element;
-export declare type DialogActionsProps = RmwcDialogActionsProps & {
+export declare const DialogContent: React.FC<DialogContentProps>;
+export interface DialogActionsProps extends RmwcDialogActionsProps {
     /**
      * Action buttons.
      */
     children: React.ReactNode[] | React.ReactNode;
     style?: React.CSSProperties;
-};
+}
 /**
  * Can be used to show accept and cancel buttons.
  */
-export declare const DialogActions: (props: DialogActionsProps) => JSX.Element;
-declare type DialogButtonProps = RmwcDialogButtonProps & {
+export declare const DialogActions: React.FC<DialogActionsProps>;
+interface DialogButtonProps extends RmwcDialogButtonProps {
     /**
      * Callback to execute then button is clicked.
      */
     onClick?: (e: React.MouseEvent) => void;
     className?: string;
-};
+}
 /**
  * Use this to show a simple button.
  */
-export declare const DialogButton: (props: DialogButtonProps) => JSX.Element;
-declare type DialogCancelProps = RmwcDialogButtonProps & {
-    /**
-     * Children elements.
-     */
-    children: React.ReactNode;
+export declare const DialogButton: React.FC<DialogButtonProps>;
+interface DialogCancelProps extends RmwcDialogButtonProps {
     /**
      * Callback to execute then button is clicked.
      */
     onClick?: (e: React.MouseEvent) => void;
-};
+}
 /**
  * Use this to close the dialog without taking any additional action.
  */
-export declare const DialogCancel: (props: DialogCancelProps) => JSX.Element;
-declare type DialogAcceptProps = RmwcDialogButtonProps & {
-    /**
-     * Children elements.
-     */
-    children: React.ReactNode;
+export declare const DialogCancel: React.FC<DialogCancelProps>;
+interface DialogAcceptProps extends RmwcDialogButtonProps {
     /**
      * Callback to execute then button is clicked.
      */
     onClick?: (e: React.MouseEvent) => void;
-};
+}
 /**
  * Use this to close the dialog without taking any additional action.
  */
-export declare const DialogAccept: (props: DialogAcceptProps) => JSX.Element;
+export declare const DialogAccept: React.FC<DialogAcceptProps>;
 export {};

package/Dialog/Dialog.js

@@ -6,7 +6,7 @@ import _inherits from "@babel/runtime/helpers/inherits";
 import _createSuper from "@babel/runtime/helpers/createSuper";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["children"];
-import * as React from "react";
+import React from "react";
 import ReactDOM from "react-dom";
 import { Dialog as RmwcDialog, DialogContent as RmwcDialogContent, DialogTitle as RmwcDialogTitle, DialogActions as RmwcDialogActions, DialogButton as RmwcDialogButton } from "@rmwc/dialog";
 import { getClasses } from "../Helpers";
@@ -21,6 +21,9 @@ export var Dialog = /*#__PURE__*/function (_React$Component) {
     _classCallCheck(this, Dialog);
 
     _this = _super.call(this, props);
+    /**
+     * We can safely cast
+     */
 
     _defineProperty(_assertThisInitialized(_this), "container", void 0);
 

package/Dialog/Dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Dialog.tsx"],"names":["React","ReactDOM","Dialog","RmwcDialog","DialogContent","RmwcDialogContent","DialogTitle","RmwcDialogTitle","DialogActions","RmwcDialogActions","DialogButton","RmwcDialogButton","getClasses","props","container","document","getElementById","createElement","setAttribute","body","appendChild","children","createPortal","Component","DialogCancel","DialogAccept"],"mappings":";;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,QAAP,MAAqB,WAArB;AACA,SACIC,MAAM,IAAIC,UADd,EAIIC,aAAa,IAAIC,iBAJrB,EAMIC,WAAW,IAAIC,eANnB,EAQIC,aAAa,IAAIC,iBARrB,EAUIC,YAAY,IAAIC,gBAVpB,QAYO,cAZP;AAaA,SAASC,UAAT;AAkBA,WAAaV,MAAb;AAAA;;AAAA;;AAGI,kBAAYW,KAAZ,EAAgC;AAAA;;AAAA;;AAC5B,8BAAMA,KAAN;AACA;AACR;AACA;;AAJoC;;AAK5B,UAAKC,SAAL,GAAiBC,QAAQ,CAACC,cAAT,CAAwB,kBAAxB,CAAjB;;AAEA,QAAI,CAAC,MAAKF,SAAV,EAAqB;AACjB,YAAKA,SAAL,GAAiBC,QAAQ,CAACE,aAAT,CAAuB,KAAvB,CAAjB;;AACA,YAAKH,SAAL,CAAeI,YAAf,CAA4B,IAA5B,EAAkC,kBAAlC;;AACA,UAAMJ,SAAS,GAAG,MAAKA,SAAvB;AACAC,MAAAA,QAAQ,CAACI,IAAT,IAAiBJ,QAAQ,CAACI,IAAT,CAAcC,WAAd,CAA0BN,SAA1B,CAAjB;AACH;;AAZ2B;AAa/B;;AAhBL;AAAA;AAAA,WAkBI,kBAAyB;AACrB,wBAA+B,KAAKD,KAApC;AAAA,UAAQQ,QAAR,eAAQA,QAAR;AAAA,UAAqBR,KAArB;;AACA,UAAMC,SAAS,GAAG,KAAKA,SAAvB,CAFqB,CAIrB;;AACA,0BAAOb,QAAQ,CAACqB,YAAT,eACH,oBAAC,UAAD,EAAgBV,UAAU,CAACC,KAAD,EAAQ,kBAAR,CAA1B,EAAwDQ,QAAxD,CADG,EAEHP,SAFG,CAAP;AAIH;AA3BL;;AAAA;AAAA,EAA4Bd,KAAK,CAACuB,SAAlC;;AAqCA;AACA;AACA;AACA,OAAO,IAAMjB,WAAuC,GAAG,SAA1CA,WAA0C,CAAAO,KAAK;AAAA,sBACxD,oBAAC,eAAD,EAAqBD,UAAU,CAACC,KAAD,EAAQ,yBAAR,CAA/B,CADwD;AAAA,CAArD;;AAaP;AACA;AACA;AACA,OAAO,IAAMT,aAA2C,GAAG,SAA9CA,aAA8C,CAAAS,KAAK;AAAA,sBAC5D,oBAAC,iBAAD,EAAuBD,UAAU,CAACC,KAAD,EAAQ,2BAAR,CAAjC,CAD4D;AAAA,CAAzD;;AAcP;AACA;AACA;AACA,OAAO,IAAML,aAA2C,GAAG,SAA9CA,aAA8C,CAAAK,KAAK;AAAA,sBAC5D,oBAAC,iBAAD,EAAuBD,UAAU,CAACC,KAAD,EAAQ,2BAAR,CAAjC,CAD4D;AAAA,CAAzD;;AAaP;AACA;AACA;AACA,OAAO,IAAMH,YAAyC,GAAG,SAA5CA,YAA4C,CAAAG,KAAK;AAAA,sBAC1D,oBAAC,gBAAD,EAAsBD,UAAU,CAACC,KAAD,EAAQ,0BAAR,CAAhC,CAD0D;AAAA,CAAvD;;AAWP;AACA;AACA;AACA,OAAO,IAAMW,YAAyC,GAAG,SAA5CA,YAA4C,CAAAX,KAAK,EAAI;AAC9D,sBACI,oBAAC,YAAD,oBACQD,UAAU,CAACC,KAAD,EAAQ,2DAAR,CADlB;AAEI,IAAA,MAAM,EAAC;AAFX,MAIKA,KAAK,CAACQ,QAJX,CADJ;AAQH,CATM;;AAkBP;AACA;AACA;AACA,OAAO,IAAMI,YAAyC,GAAG,SAA5CA,YAA4C,CAAAZ,KAAK,EAAI;AAC9D,sBACI,oBAAC,YAAD,oBACQD,UAAU,CAACC,KAAD,EAAQ,2DAAR,CADlB;AAEI,IAAA,MAAM,EAAC;AAFX,MAIKA,KAAK,CAACQ,QAJX,CADJ;AAQH,CATM","sourcesContent":["import React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport {\n    Dialog as RmwcDialog,\n    DialogProps as RmwcDialogProps,\n    DialogOnCloseEventT,\n    DialogContent as RmwcDialogContent,\n    DialogContentProps as RmwcDialogContentProps,\n    DialogTitle as RmwcDialogTitle,\n    DialogTitleProps as RmwcDialogTitleProps,\n    DialogActions as RmwcDialogActions,\n    DialogActionsProps as RmwcDialogActionsProps,\n    DialogButton as RmwcDialogButton,\n    DialogButtonProps as RmwcDialogButtonProps\n} from \"@rmwc/dialog\";\nimport { getClasses } from \"~/Helpers\";\n\nexport type DialogOnClose = (event: DialogOnCloseEventT) => void;\n\nexport interface DialogProps extends RmwcDialogProps {\n    className?: string;\n\n    // Component's custom in-line styles.\n    style?: React.CSSProperties;\n\n    // If true, dialog will be permanently fixed inside of a view (works for temporary and persistent modes).\n    open?: boolean;\n\n    onClose?: (evt: DialogOnCloseEventT) => void;\n\n    preventOutsideDismiss?: boolean;\n}\n\nexport class Dialog extends React.Component<DialogProps> {\n    container: HTMLElement;\n\n    constructor(props: DialogProps) {\n        super(props);\n        /**\n         * We can safely cast\n         */\n        this.container = document.getElementById(\"dialog-container\") as HTMLElement;\n\n        if (!this.container) {\n            this.container = document.createElement(\"div\");\n            this.container.setAttribute(\"id\", \"dialog-container\");\n            const container = this.container;\n            document.body && document.body.appendChild(container);\n        }\n    }\n\n    public override render() {\n        const { children, ...props } = this.props;\n        const container = this.container;\n\n        // Let's pass \"permanent\" / \"persistent\" / \"temporary\" flags as \"mode\" prop instead.\n        return ReactDOM.createPortal(\n            <RmwcDialog {...getClasses(props, \"webiny-ui-dialog\")}>{children}</RmwcDialog>,\n            container\n        );\n    }\n}\n\nexport interface DialogTitleProps extends RmwcDialogTitleProps {\n    /**\n     * Title text.\n     */\n    children: React.ReactNode[] | React.ReactNode;\n}\n\n/**\n * Dialog's header, which can accept DialogHeaderTitle component or any other set of components.\n */\nexport const DialogTitle: React.FC<DialogTitleProps> = props => (\n    <RmwcDialogTitle {...getClasses(props, \"webiny-ui-dialog__title\")} />\n);\n\nexport type DialogContentProps = RmwcDialogContentProps & {\n    /**\n     * Dialog content.\n     */\n    children: React.ReactNode[] | React.ReactNode;\n\n    className?: string;\n};\n\n/**\n * A simple component for showing dialog's body.\n */\nexport const DialogContent: React.FC<DialogContentProps> = props => (\n    <RmwcDialogContent {...getClasses(props, \"webiny-ui-dialog__content\")} />\n);\n\nexport interface DialogActionsProps extends RmwcDialogActionsProps {\n    /**\n     * Action buttons.\n     */\n    children: React.ReactNode[] | React.ReactNode;\n\n    // Dialog component's custom in-line styles.\n    style?: React.CSSProperties;\n}\n\n/**\n * Can be used to show accept and cancel buttons.\n */\nexport const DialogActions: React.FC<DialogActionsProps> = props => (\n    <RmwcDialogActions {...getClasses(props, \"webiny-ui-dialog__actions\")} />\n);\n\ninterface DialogButtonProps extends RmwcDialogButtonProps {\n    /**\n     * Callback to execute then button is clicked.\n     */\n    onClick?: (e: React.MouseEvent) => void;\n\n    className?: string;\n}\n\n/**\n * Use this to show a simple button.\n */\nexport const DialogButton: React.FC<DialogButtonProps> = props => (\n    <RmwcDialogButton {...getClasses(props, \"webiny-ui-dialog__button\")} />\n);\n\ninterface DialogCancelProps extends RmwcDialogButtonProps {\n    /**\n     * Callback to execute then button is clicked.\n     */\n    onClick?: (e: React.MouseEvent) => void;\n}\n\n/**\n * Use this to close the dialog without taking any additional action.\n */\nexport const DialogCancel: React.FC<DialogCancelProps> = props => {\n    return (\n        <DialogButton\n            {...getClasses(props, \"webiny-ui-dialog__button webiny-ui-dialog__button--cancel\")}\n            action=\"close\"\n        >\n            {props.children}\n        </DialogButton>\n    );\n};\n\ninterface DialogAcceptProps extends RmwcDialogButtonProps {\n    /**\n     * Callback to execute then button is clicked.\n     */\n    onClick?: (e: React.MouseEvent) => void;\n}\n\n/**\n * Use this to close the dialog without taking any additional action.\n */\nexport const DialogAccept: React.FC<DialogAcceptProps> = props => {\n    return (\n        <DialogButton\n            {...getClasses(props, \"webiny-ui-dialog__button webiny-ui-dialog__button--accept\")}\n            action=\"accept\"\n        >\n            {props.children}\n        </DialogButton>\n    );\n};\n"]}

package/Dialog/Dialog.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Dialog.stories.tsx"],"names":["React","storiesOf","Story","StoryReadme","StorySandboxCode","StorySandbox","StorySandboxExample","readme","withKnobs","boolean","Dialog","DialogButton","DialogAccept","DialogCancel","DialogActions","DialogTitle","DialogContent","story","module","addDecorator","add","open","console","log","info","propTables"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,QAA0B,kBAA1B;AACA,SACIC,KADJ,EAEIC,WAFJ,EAGIC,gBAHJ,EAIIC,YAJJ,EAKIC,mBALJ,QAMO,+BANP;AAOA,OAAOC,MAAP;AACA,SAASC,SAAT,EAAoBC,OAApB,QAAmC,wBAAnC;AAEA,SACIC,MADJ,EAEIC,YAFJ,EAGIC,YAHJ,EAIIC,YAJJ,EAKIC,aALJ,EAMIC,WANJ,EAOIC,aAPJ,QAQO,GARP;AAUA,IAAMC,KAAK,GAAGhB,SAAS,CAAC,mBAAD,EAAsBiB,MAAtB,CAAvB;AACAD,KAAK,CAACE,YAAN,CAAmBX,SAAnB;AAEAS,KAAK,CAACG,GAAN,CACI,OADJ,EAEI,YAAM;AACF,MAAMC,IAAI,GAAGZ,OAAO,CAAC,MAAD,EAAS,KAAT,CAApB;AAEA,sBACI,oBAAC,KAAD,qBACI,oBAAC,WAAD,QAAcF,MAAd,CADJ,eAEI,oBAAC,YAAD;AAAc,IAAA,KAAK,EAAE;AAArB,kBACI,oBAAC,mBAAD;AAAqB,IAAA,KAAK,EAAE;AAA5B,6BACW,yCADX,8CAEI,+BAFJ,eAGI,+BAHJ,8CAI+B,wDAJ/B,WAIqE,GAJrE,eAKI,2CALJ,uBAK2B,2CAL3B,kCAK2E,GAL3E,eAMI,iDANJ,wBAMkC,iDANlC,4CAQI,oBAAC,MAAD;AAAQ,IAAA,IAAI,EAAEc;AAAd,kBACI,oBAAC,WAAD,8BADJ,eAEI,oBAAC,aAAD,2CAFJ,eAGI,oBAAC,aAAD,qBACI,oBAAC,YAAD;AAAc,IAAA,OAAO,EAAE;AAAA,aAAMC,OAAO,CAACC,GAAR,CAAY,QAAZ,CAAN;AAAA;AAAvB,cADJ,eAII,oBAAC,YAAD;AAAc,IAAA,OAAO,EAAE;AAAA,aAAMD,OAAO,CAACC,GAAR,CAAY,QAAZ,CAAN;AAAA;AAAvB,UAJJ,CAHJ,CARJ,CADJ,eAsBI,oBAAC,gBAAD,sDAEgBF,IAFhB,+iBAtBJ,CAFJ,CADJ;AA0CH,CA/CL,EAgDI;AACIG,EAAAA,IAAI,EAAE;AACFC,IAAAA,UAAU,EAAE,CACRf,MADQ,EAERC,YAFQ,EAGRC,YAHQ,EAIRC,YAJQ,EAKRC,aALQ,EAMRC,WANQ,EAORC,aAPQ;AADV;AADV,CAhDJ","sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport {\n    Story,\n    StoryReadme,\n    StorySandboxCode,\n    StorySandbox,\n    StorySandboxExample\n} from \"@webiny/storybook-utils/Story\";\nimport readme from \"./../Dialog/README.md\";\nimport { withKnobs, boolean } from \"@storybook/addon-knobs\";\n\nimport {\n    Dialog,\n    DialogButton,\n    DialogAccept,\n    DialogCancel,\n    DialogActions,\n    DialogTitle,\n    DialogContent\n} from \".\";\n\nconst story = storiesOf(\"Components/Dialog\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n    \"usage\",\n    () => {\n        const open = boolean(\"Open\", false);\n\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox title={\"dialog\"}>\n                    <StorySandboxExample title={\"A list with all possible options\"}>\n                        Toggle <code>open</code> prop via the bottom knobs.\n                        <br />\n                        <br />\n                        Note that instead of using <code>DialogFooter.Button</code> with{\" \"}\n                        <code>accept</code> or <code>cancel</code> prop, you can use a shorter{\" \"}\n                        <code>DialogAccept</code> and <code>DialogCancel</code> components\n                        respectively.\n                        <Dialog open={open}>\n                            <DialogTitle>Delete confirmation</DialogTitle>\n                            <DialogContent>Are you sure you want to delete?</DialogContent>\n                            <DialogActions>\n                                <DialogCancel onClick={() => console.log(\"Cancel\")}>\n                                    Cancel\n                                </DialogCancel>\n                                <DialogAccept onClick={() => console.log(\"Accept\")}>\n                                    OK\n                                </DialogAccept>\n                            </DialogActions>\n                        </Dialog>\n                    </StorySandboxExample>\n                    <StorySandboxCode>\n                        {`\n                    <Dialog open={${open}}>\n                        <DialogTitle>\n                            Delete confirmation\n                        </DialogTitle>\n                        <DialogBody>Are you sure you want to delete?</DialogBody>\n                        <DialogFooter>\n                            <DialogCancel onClick={() => console.log(\"Cancel\")}>Cancel</DialogCancel>\n                            <DialogAccept onClick={() => console.log(\"Accept\")}>OK</DialogAccept>\n                        </DialogFooter>\n                    </Dialog>\n                    `}\n                    </StorySandboxCode>\n                </StorySandbox>\n            </Story>\n        );\n    },\n    {\n        info: {\n            propTables: [\n                Dialog,\n                DialogButton,\n                DialogAccept,\n                DialogCancel,\n                DialogActions,\n                DialogTitle,\n                DialogContent\n            ]\n        }\n    }\n);\n"]}

package/Dialog/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA","sourcesContent":["export * from \"./Dialog\";\n"]}

package/Drawer/Drawer.d.ts

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React from "react";
 import { DrawerProps as RmwcDrawerProps, DrawerHeaderProps as RmwcDrawerHeaderProps, DrawerContentProps as RmwcDrawerContentProps } from "@rmwc/drawer";
 declare type DrawerHeaderProps = RmwcDrawerHeaderProps & {
     children: any;

package/Drawer/Drawer.js

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React from "react";
 import { Drawer as RmwcDrawer, DrawerContent as RmwcDrawerContent, DrawerHeader as RmwcDrawerHeader } from "@rmwc/drawer";
 
 /**

package/Drawer/Drawer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Drawer.tsx"],"names":["React","Drawer","RmwcDrawer","DrawerContent","RmwcDrawerContent","DrawerHeader","RmwcDrawerHeader","props"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SACIC,MAAM,IAAIC,UADd,EAEIC,aAAa,IAAIC,iBAFrB,EAGIC,YAAY,IAAIC,gBAHpB,QAOO,cAPP;;AAcA;AACA;AACA;AACA,IAAMD,YAAY,GAAG,SAAfA,YAAe,CAACE,KAAD;AAAA,sBAA8B,oBAAC,gBAAD,EAAsBA,KAAtB,CAA9B;AAAA,CAArB;;AAkBA;AACA;AACA;AACA,IAAMJ,aAAa,GAAG,SAAhBA,aAAgB,CAACI,KAAD;AAAA,sBAA+B,oBAAC,iBAAD,EAAuBA,KAAvB,CAA/B;AAAA,CAAtB;;AAiBA;AACA;AACA;AACA,IAAMN,MAAM,GAAG,SAATA,MAAS,CAACM,KAAD,EAAwB;AACnC,sBAAO,oBAAC,UAAD,EAAgBA,KAAhB,CAAP;AACH,CAFD;;AAIA,SAASN,MAAT,EAAiBI,YAAjB,EAA+BF,aAA/B","sourcesContent":["import React from \"react\";\nimport {\n    Drawer as RmwcDrawer,\n    DrawerContent as RmwcDrawerContent,\n    DrawerHeader as RmwcDrawerHeader,\n    DrawerProps as RmwcDrawerProps,\n    DrawerHeaderProps as RmwcDrawerHeaderProps,\n    DrawerContentProps as RmwcDrawerContentProps\n} from \"@rmwc/drawer\";\n\ntype DrawerHeaderProps = RmwcDrawerHeaderProps & {\n    children: any;\n    className?: string;\n};\n\n/**\n * Shows header of the drawer.\n */\nconst DrawerHeader = (props: DrawerHeaderProps) => <RmwcDrawerHeader {...props} />;\n\nexport type DrawerContentProps = RmwcDrawerContentProps & {\n    /**\n     * Drawer direction.\n     */\n    dir?: string;\n    /**\n     * Drawer content.\n     */\n    children: React.ReactNode;\n\n    /**\n     * CSS class name\n     */\n    className?: string;\n};\n\n/**\n * Shows drawer content. It can be anything, but commonly a List component would suffice here.\n */\nconst DrawerContent = (props: DrawerContentProps) => <RmwcDrawerContent {...props} />;\n\ntype DrawerProps = RmwcDrawerProps & {\n    /**\n     * Drawer direction.\n     */\n    dir?: string;\n    /**\n     * Drawer content.\n     */\n    children: React.ReactNode;\n\n    /**\n     * CSS class name\n     */\n    className?: string;\n};\n/**\n * Use Drawer component to display navigation for the whole app or just a small section of it.\n */\nconst Drawer = (props: DrawerProps) => {\n    return <RmwcDrawer {...props} />;\n};\n\nexport { Drawer, DrawerHeader, DrawerContent };\n"]}

package/Drawer/Drawer.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Drawer.stories.tsx"],"names":["React","storiesOf","Story","StoryReadme","StorySandboxCode","StorySandbox","StorySandboxExample","List","ListItem","readme","withKnobs","boolean","Drawer","DrawerHeader","DrawerContent","story","module","addDecorator","add","open","info","propTables"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,QAA0B,kBAA1B;AACA,SACIC,KADJ,EAEIC,WAFJ,EAGIC,gBAHJ,EAIIC,YAJJ,EAKIC,mBALJ,QAMO,+BANP;AAOA,SAASC,IAAT,EAAeC,QAAf;AAEA,OAAOC,MAAP;AACA,SAASC,SAAT,EAAoBC,OAApB,QAAmC,wBAAnC;AACA,SAASC,MAAT,EAAiBC,YAAjB,EAA+BC,aAA/B;AAEA,IAAMC,KAAK,GAAGd,SAAS,CAAC,mBAAD,EAAsBe,MAAtB,CAAvB;AACAD,KAAK,CAACE,YAAN,CAAmBP,SAAnB;AAEAK,KAAK,CAACG,GAAN,CACI,OADJ,EAEI,YAAM;AACF,MAAMC,IAAI,GAAGR,OAAO,CAAC,MAAD,EAAS,IAAT,CAApB;AAEA,sBACI,oBAAC,KAAD,qBACI,oBAAC,WAAD,QAAcF,MAAd,CADJ,eAEI,oBAAC,YAAD;AAAc,IAAA,KAAK,EAAE;AAArB,kBACI,oBAAC,mBAAD;AAAqB,IAAA,KAAK,EAAE;AAA5B,kBACI,oBAAC,MAAD;AAAQ,IAAA,IAAI,EAAEU;AAAd,kBACI,oBAAC,YAAD,oBADJ,eAEI,oBAAC,aAAD,qBACI,oBAAC,IAAD,qBACI,oBAAC,QAAD,gBADJ,eAEI,oBAAC,QAAD,oBAFJ,eAGI,oBAAC,QAAD,iBAHJ,eAII,oBAAC,QAAD,cAJJ,eAKI,oBAAC,QAAD,mBALJ,CADJ,CAFJ,CADJ,CADJ,eAeI,oBAAC,gBAAD,4mBAfJ,CAFJ,CADJ;AAqCH,CA1CL,EA2CI;AAAEC,EAAAA,IAAI,EAAE;AAAEC,IAAAA,UAAU,EAAE,CAACT,MAAD,EAASC,YAAT,EAAuBC,aAAvB;AAAd;AAAR,CA3CJ","sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport {\n    Story,\n    StoryReadme,\n    StorySandboxCode,\n    StorySandbox,\n    StorySandboxExample\n} from \"@webiny/storybook-utils/Story\";\nimport { List, ListItem } from \"./../List\";\n\nimport readme from \"./../Drawer/README.md\";\nimport { withKnobs, boolean } from \"@storybook/addon-knobs\";\nimport { Drawer, DrawerHeader, DrawerContent } from \"./Drawer\";\n\nconst story = storiesOf(\"Components/Drawer\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n    \"usage\",\n    () => {\n        const open = boolean(\"Open\", true);\n\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox title={\"drawer\"}>\n                    <StorySandboxExample title={\"A list with all possible options\"}>\n                        <Drawer open={open}>\n                            <DrawerHeader>Main Menu</DrawerHeader>\n                            <DrawerContent>\n                                <List>\n                                    <ListItem>Users</ListItem>\n                                    <ListItem>Companies</ListItem>\n                                    <ListItem>Brands</ListItem>\n                                    <ListItem>ACL</ListItem>\n                                    <ListItem>Settings</ListItem>\n                                </List>\n                            </DrawerContent>\n                        </Drawer>\n                    </StorySandboxExample>\n                    <StorySandboxCode>\n                        {`\n                    <Drawer>\n                        <DrawerHeader>Main Menu</DrawerHeader>\n                        <DrawerContent>\n                            <List>\n                                <ListItem>Users</ListItem>\n                                <ListItem>Companies</ListItem>\n                                <ListItem>Brands</ListItem>\n                                <ListItem>ACL</ListItem>\n                                <ListItem>Settings</ListItem>\n                            </List>\n                        </DrawerContent>\n                    </Drawer>\n                    `}\n                    </StorySandboxCode>\n                </StorySandbox>\n            </Story>\n        );\n    },\n    { info: { propTables: [Drawer, DrawerHeader, DrawerContent] } }\n);\n"]}

package/Drawer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA","sourcesContent":["export * from \"./Drawer\";\n"]}

package/DynamicFieldset/Fieldset.d.ts

@@ -1,28 +1,38 @@
-import * as React from "react";
+import React from "react";
+interface ChildrenRenderPropRowCallableParams {
+    index: number;
+    data: any;
+}
+interface ChildrenRenderPropRowCallable {
+    (params: ChildrenRenderPropRowCallableParams): React.ReactNode;
+}
+interface ChildrenRenderPropHeaderCallable {
+    (): React.ReactNode;
+}
+interface ChildrenRenderPropEmptyCallable {
+    (): React.ReactNode;
+}
 interface ChildrenRenderProp {
     actions: {
         add: Function;
         remove: Function;
     };
-    header: Function;
-    row: Function;
-    empty: Function;
+    header: (cb: ChildrenRenderPropHeaderCallable) => React.ReactNode;
+    row: (cb: ChildrenRenderPropRowCallable) => React.ReactNode;
+    empty: (cb: ChildrenRenderPropEmptyCallable) => React.ReactNode;
 }
-declare type FieldsetProps = {
-    value?: Array<Object>;
+interface FieldsetProps {
+    value?: any[];
     description?: string;
     validation?: {
         isValid: null | boolean;
         message?: string;
     };
-    onChange?: Function;
+    onChange: Function;
     children: (props: ChildrenRenderProp) => React.ReactNode;
-};
+}
 declare class Fieldset extends React.Component<FieldsetProps> {
-    static defaultProps: {
-        value: any[];
-        description: any;
-    };
+    static defaultProps: Partial<FieldsetProps>;
     header: React.ReactNode;
     rows: React.ReactNode;
     empty: React.ReactNode;
@@ -32,10 +42,10 @@ declare class Fieldset extends React.Component<FieldsetProps> {
     };
     removeData: (index: number) => void;
     addData: (index?: number) => void;
-    renderHeader: (cb: () => React.ReactNode) => void;
-    renderRow: (cb: (params: Object) => React.ReactNode) => void;
-    renderEmpty: (cb: () => React.ReactNode) => void;
-    renderComponent(): {};
+    renderHeader: (cb: () => React.ReactNode) => React.ReactNode;
+    renderRow: (cb: ChildrenRenderPropRowCallable) => React.ReactNode;
+    renderEmpty: (cb: () => React.ReactNode) => React.ReactNode;
+    renderComponent(): React.ReactNode;
     render(): JSX.Element;
 }
 export default Fieldset;

package/DynamicFieldset/Fieldset.js

@@ -5,7 +5,7 @@ import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized
 import _inherits from "@babel/runtime/helpers/inherits";
 import _createSuper from "@babel/runtime/helpers/createSuper";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import * as React from "react";
+import React from "react";
 import dotProp from "dot-prop-immutable";
 import { FormElementMessage } from "../FormElementMessage";
 import styled from "@emotion/styled";
@@ -65,9 +65,12 @@ var Fieldset = /*#__PURE__*/function (_React$Component) {
 
     _defineProperty(_assertThisInitialized(_this), "addData", function () {
       var index = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : -1;
-      var _this$props2 = _this.props,
-          value = _this$props2.value,
-          onChange = _this$props2.onChange;
+      var onChange = _this.props.onChange;
+      var value = _this.props.value;
+
+      if (!value) {
+        value = [];
+      }
 
       if (index < 0) {
         onChange([].concat(_toConsumableArray(value), [{}]));
@@ -78,10 +81,16 @@ var Fieldset = /*#__PURE__*/function (_React$Component) {
 
     _defineProperty(_assertThisInitialized(_this), "renderHeader", function (cb) {
       _this.header = cb();
+      return null;
     });
 
     _defineProperty(_assertThisInitialized(_this), "renderRow", function (cb) {
       var value = _this.props.value;
+
+      if (!value) {
+        return null;
+      }
+
       _this.rows = value.map(function (record, index) {
         return /*#__PURE__*/React.createElement(DynamicFieldsetRow, {
           key: index
@@ -90,10 +99,12 @@ var Fieldset = /*#__PURE__*/function (_React$Component) {
           index: index
         }));
       });
+      return null;
     });
 
     _defineProperty(_assertThisInitialized(_this), "renderEmpty", function (cb) {
       _this.empty = cb();
+      return null;
     });
 
     return _this;
@@ -111,21 +122,21 @@ var Fieldset = /*#__PURE__*/function (_React$Component) {
         empty: this.renderEmpty
       });
 
-      if (value.length) {
-        return /*#__PURE__*/React.createElement(React.Fragment, null, this.header, this.rows);
+      if (!value || value.length === 0) {
+        return this.empty;
       }
 
-      return this.empty;
+      return /*#__PURE__*/React.createElement(React.Fragment, null, this.header, this.rows);
     }
   }, {
     key: "render",
     value: function render() {
-      var _this$props3 = this.props,
-          description = _this$props3.description,
-          _this$props3$validati = _this$props3.validation,
-          validation = _this$props3$validati === void 0 ? {
+      var _this$props2 = this.props,
+          description = _this$props2.description,
+          _this$props2$validati = _this$props2.validation,
+          validation = _this$props2$validati === void 0 ? {
         isValid: null
-      } : _this$props3$validati;
+      } : _this$props2$validati;
       return /*#__PURE__*/React.createElement(React.Fragment, null, this.renderComponent(), validation.isValid === false && /*#__PURE__*/React.createElement(FormElementMessage, {
         error: true
       }, validation.message), validation.isValid !== false && description && /*#__PURE__*/React.createElement(FormElementMessage, null, description));
@@ -136,8 +147,7 @@ var Fieldset = /*#__PURE__*/function (_React$Component) {
 }(React.Component);
 
 _defineProperty(Fieldset, "defaultProps", {
-  value: [],
-  description: null
+  value: []
 });
 
 export default Fieldset;

package/DynamicFieldset/Fieldset.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Fieldset.tsx"],"names":["React","dotProp","FormElementMessage","styled","DynamicFieldsetRow","paddingBottom","padding","Fieldset","add","index","addData","remove","removeData","props","value","onChange","delete","slice","cb","header","rows","map","record","data","empty","children","actions","renderHeader","row","renderRow","renderEmpty","length","description","validation","isValid","renderComponent","message","Component"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport dotProp from \"dot-prop-immutable\";\nimport { FormElementMessage } from \"~/FormElementMessage\";\nimport styled from \"@emotion/styled\";\n\ninterface ChildrenRenderPropRowCallableParams {\n    index: number;\n    data: any;\n}\ninterface ChildrenRenderPropRowCallable {\n    (params: ChildrenRenderPropRowCallableParams): React.ReactNode;\n}\n\ninterface ChildrenRenderPropHeaderCallable {\n    (): React.ReactNode;\n}\ninterface ChildrenRenderPropEmptyCallable {\n    (): React.ReactNode;\n}\ninterface ChildrenRenderProp {\n    actions: {\n        add: Function;\n        remove: Function;\n    };\n    header: (cb: ChildrenRenderPropHeaderCallable) => React.ReactNode;\n    row: (cb: ChildrenRenderPropRowCallable) => React.ReactNode;\n    empty: (cb: ChildrenRenderPropEmptyCallable) => React.ReactNode;\n}\n\ninterface FieldsetProps {\n    value?: any[];\n    description?: string;\n    validation?: { isValid: null | boolean; message?: string };\n    onChange: Function;\n    children: (props: ChildrenRenderProp) => React.ReactNode;\n}\n\nconst DynamicFieldsetRow = styled(\"div\")({\n    paddingBottom: 10,\n    \"> .mdc-layout-grid\": {\n        padding: 0\n    }\n});\n\nclass Fieldset extends React.Component<FieldsetProps> {\n    static defaultProps: Partial<FieldsetProps> = {\n        value: []\n    };\n\n    header: React.ReactNode = null;\n    rows: React.ReactNode = null;\n    empty: React.ReactNode = null;\n\n    actions = {\n        add:\n            (index = -1) =>\n            () =>\n                this.addData(index),\n        remove:\n            (index = -1) =>\n            () =>\n                this.removeData(index)\n    };\n\n    removeData = (index: number) => {\n        const { value, onChange } = this.props;\n        onChange(dotProp.delete(value, index));\n    };\n\n    addData = (index = -1) => {\n        const { onChange } = this.props;\n        let value = this.props.value;\n        if (!value) {\n            value = [];\n        }\n        if (index < 0) {\n            onChange([...value, {}]);\n        } else {\n            onChange([...value.slice(0, index + 1), {}, ...value.slice(index + 1)]);\n        }\n    };\n\n    renderHeader = (cb: () => React.ReactNode): React.ReactNode => {\n        this.header = cb();\n        return null;\n    };\n\n    renderRow = (cb: ChildrenRenderPropRowCallable): React.ReactNode => {\n        const { value } = this.props;\n        if (!value) {\n            return null;\n        }\n        this.rows = value.map((record, index) => {\n            return (\n                <DynamicFieldsetRow key={index}>{cb({ data: record, index })}</DynamicFieldsetRow>\n            );\n        });\n        return null;\n    };\n\n    renderEmpty = (cb: () => React.ReactNode): React.ReactNode => {\n        this.empty = cb();\n        return null;\n    };\n\n    public renderComponent(): React.ReactNode {\n        const { value } = this.props;\n        const { children } = this.props;\n\n        children({\n            actions: this.actions,\n            header: this.renderHeader,\n            row: this.renderRow,\n            empty: this.renderEmpty\n        });\n\n        if (!value || value.length === 0) {\n            return this.empty;\n        }\n\n        return (\n            <React.Fragment>\n                {this.header}\n                {this.rows}\n            </React.Fragment>\n        );\n    }\n\n    public override render() {\n        const { description, validation = { isValid: null } } = this.props;\n\n        return (\n            <>\n                {this.renderComponent()}\n                {validation.isValid === false && (\n                    <FormElementMessage error>{validation.message}</FormElementMessage>\n                )}\n\n                {validation.isValid !== false && description && (\n                    <FormElementMessage>{description}</FormElementMessage>\n                )}\n            </>\n        );\n    }\n}\n\nexport default Fieldset;\n"]}

package/DynamicFieldset/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":["default","DynamicFieldset"],"mappings":"AAAA,SAASA,OAAO,IAAIC,eAApB","sourcesContent":["export { default as DynamicFieldset } from \"./Fieldset\";\n"]}

package/Elevation/Elevation.d.ts

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React from "react";
 export declare type ElevationProps = {
     children?: React.ReactNode;
     z: number;

package/Elevation/Elevation.js

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React from "react";
 import { Elevation as RmwcElevation } from "@rmwc/elevation";
 
 /**

package/Elevation/Elevation.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Elevation.tsx"],"names":["React","Elevation","RmwcElevation","forwardRef","props","ref","children","displayName"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAS,IAAIC,aAAtB,QAA2C,iBAA3C;;AAmBA;AACA;AACA;AACA,IAAMD,SAAS,gBAAGD,KAAK,CAACG,UAAN,CAAiB,UAACC,KAAD,EAAwBC,GAAxB,EAAgD;AAC/E,sBACI,oBAAC,aAAD;AAAe,IAAA,GAAG,EAAEA;AAApB,KAA6BD,KAA7B,GACKA,KAAK,CAACE,QADX,CADJ;AAKH,CANiB,CAAlB;AAQAL,SAAS,CAACM,WAAV,GAAwB,WAAxB;AAEA,SAASN,SAAT","sourcesContent":["import React from \"react\";\nimport { Elevation as RmwcElevation } from \"@rmwc/elevation\";\n\nexport type ElevationProps = {\n    // Any element that needs to be highlighted.\n    children?: React.ReactNode;\n\n    // Increasing this number (from 0 to 24) will increase the amount of shadow applied.\n    z: number;\n\n    // Adds smooth transitions when the z value changes.\n    transition?: boolean;\n\n    // CSS class name\n    className?: string;\n\n    // Style object\n    style?: React.CSSProperties;\n};\n\n/**\n * Elevation component visually raises any content by applying shadow.\n */\nconst Elevation = React.forwardRef((props: ElevationProps, ref: React.Ref<any>) => {\n    return (\n        <RmwcElevation ref={ref} {...props}>\n            {props.children}\n        </RmwcElevation>\n    );\n});\n\nElevation.displayName = \"Elevation\";\n\nexport { Elevation };\n"]}

package/Elevation/Elevation.stories.js

@@ -1,5 +1,5 @@
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
-import * as React from "react";
+import React from "react";
 import { storiesOf } from "@storybook/react";
 import { Story, StoryReadme, StorySandboxCode, StorySandbox, StorySandboxExample } from "@webiny/storybook-utils/Story";
 import readme from "./../Elevation/README.md";

package/Elevation/Elevation.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Elevation.stories.tsx"],"names":["React","storiesOf","Story","StoryReadme","StorySandboxCode","StorySandbox","StorySandboxExample","readme","withKnobs","boolean","select","Elevation","story","module","addDecorator","add","transition","z","Array","keys","style","padding","backgroundColor","info","propTables"],"mappings":";AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,QAA0B,kBAA1B;AACA,SACIC,KADJ,EAEIC,WAFJ,EAGIC,gBAHJ,EAIIC,YAJJ,EAKIC,mBALJ,QAMO,+BANP;AAOA,OAAOC,MAAP;AACA,SAASC,SAAT,EAAoBC,OAApB,EAA6BC,MAA7B,QAA2C,wBAA3C;AACA,SAASC,SAAT;AAEA,IAAMC,KAAK,GAAGX,SAAS,CAAC,sBAAD,EAAyBY,MAAzB,CAAvB;AACAD,KAAK,CAACE,YAAN,CAAmBN,SAAnB;AAEAI,KAAK,CAACG,GAAN,CACI,OADJ,EAEI,YAAM;AACF,MAAMC,UAAU,GAAGP,OAAO,CAAC,YAAD,EAAe,IAAf,CAA1B;AACA,MAAMQ,CAAC,GAAGP,MAAM,CAAC,sBAAD,qBAA6BQ,KAAK,CAAC,EAAD,CAAL,CAAUC,IAAV,EAA7B,GAAgD,CAAhD,CAAhB;AAEA,MAAMC,KAAK,GAAG;AACVC,IAAAA,OAAO,EAAE,EADC;AAEVC,IAAAA,eAAe,EAAE;AAFP,GAAd;AAKA,sBACI,oBAAC,KAAD,qBACI,oBAAC,WAAD,QAAcf,MAAd,CADJ,eAEI,oBAAC,YAAD;AAAc,IAAA,KAAK,EAAE;AAArB,kBACI,oBAAC,mBAAD,qBACI,oBAAC,SAAD;AAAW,IAAA,CAAC,EAAEU,CAAd;AAAiB,IAAA,UAAU,EAAED;AAA7B,kBACI;AAAK,IAAA,KAAK,EAAEI;AAAZ,oCADJ,CADJ,CADJ,eAMI,oBAAC,gBAAD,0DAEoBH,CAFpB,2BAEsCD,UAFtC,yIANJ,CAFJ,CADJ;AAmBH,CA9BL,EA+BI;AAAEO,EAAAA,IAAI,EAAE;AAAEC,IAAAA,UAAU,EAAE,CAACb,SAAD;AAAd;AAAR,CA/BJ","sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport {\n    Story,\n    StoryReadme,\n    StorySandboxCode,\n    StorySandbox,\n    StorySandboxExample\n} from \"@webiny/storybook-utils/Story\";\nimport readme from \"./../Elevation/README.md\";\nimport { withKnobs, boolean, select } from \"@storybook/addon-knobs\";\nimport { Elevation } from \"./Elevation\";\n\nconst story = storiesOf(\"Components/Elevation\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n    \"usage\",\n    () => {\n        const transition = boolean(\"Transition\", true);\n        const z = select(\"Z (elevation height)\", [...Array(25).keys()], 1);\n\n        const style = {\n            padding: 20,\n            backgroundColor: \"white\"\n        };\n\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox title={\"An area with applied elevation\"}>\n                    <StorySandboxExample>\n                        <Elevation z={z} transition={transition}>\n                            <div style={style}>This is an elevated content.</div>\n                        </Elevation>\n                    </StorySandboxExample>\n                    <StorySandboxCode>\n                        {`\n                        <Elevation z={${z}} transition={${transition}}>\n                            <div>This is an elevated content.</div>\n                        </Elevation>\n                    `}\n                    </StorySandboxCode>\n                </StorySandbox>\n            </Story>\n        );\n    },\n    { info: { propTables: [Elevation] } }\n);\n"]}

package/Elevation/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA","sourcesContent":["export * from \"./Elevation\";\n"]}

package/FormElementMessage/FormElementMessage.d.ts

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React from "react";
 declare type Props = {
     children: React.ReactNode;
     className?: string;

package/FormElementMessage/FormElementMessage.js

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React from "react";
 import classnames from "classnames";
 
 var FormElementMessage = function FormElementMessage(props) {

package/FormElementMessage/FormElementMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["FormElementMessage.tsx"],"names":["React","classnames","FormElementMessage","props","classNames","className","error","children"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,UAAP,MAAuB,YAAvB;;AAaA,IAAMC,kBAAkB,GAAG,SAArBA,kBAAqB,CAACC,KAAD,EAAkB;AACzC,MAAMC,UAAU,GAAGH,UAAU,CACzB,mEADyB,EAEzBE,KAAK,CAACE,SAFmB,EAGzB;AAAE,yCAAqCF,KAAK,CAACG;AAA7C,GAHyB,CAA7B;AAMA,sBAAO;AAAK,IAAA,SAAS,EAAEF;AAAhB,KAA6BD,KAAK,CAACI,QAAnC,CAAP;AACH,CARD;;AAUA,SAASL,kBAAT","sourcesContent":["import React from \"react\";\nimport classnames from \"classnames\";\n\ntype Props = {\n    // message to display\n    children: React.ReactNode;\n\n    // optional class name\n    className?: string;\n\n    // is it an error message we're displaying\n    error?: boolean;\n};\n\nconst FormElementMessage = (props: Props) => {\n    const classNames = classnames(\n        \"mdc-text-field-helper-text mdc-text-field-helper-text--persistent\",\n        props.className,\n        { \"mdc-text-field-helper-text--error\": props.error }\n    );\n\n    return <div className={classNames}>{props.children}</div>;\n};\n\nexport { FormElementMessage };\n"]}

package/FormElementMessage/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":["FormElementMessage"],"mappings":"AAAA,SAASA,kBAAT","sourcesContent":["export { FormElementMessage } from \"./FormElementMessage\";\n"]}

package/FullName/FullName.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["FullName.ts"],"names":["FullName","props","data","output","firstName","lastName"],"mappings":"AAOA,IAAMA,QAAQ,GAAG,SAAXA,QAAW,CAACC,KAAD,EAAkB;AAC/B,MAAQC,IAAR,GAAiBD,KAAjB,CAAQC,IAAR;;AAEA,MAAI,CAACA,IAAL,EAAW;AACP,WAAO,KAAP;AACH;;AAED,MAAIC,MAAM,GAAG,EAAb;;AACA,MAAID,IAAI,CAACE,SAAT,EAAoB;AAChBD,IAAAA,MAAM,IAAID,IAAI,CAACE,SAAf;AACH;;AAED,MAAIF,IAAI,CAACG,QAAT,EAAmB;AACfF,IAAAA,MAAM,IAAI,MAAMD,IAAI,CAACG,QAArB;AACH;;AAED,SAAOF,MAAP;AACH,CAjBD;;AAmBA,SAASH,QAAT","sourcesContent":["type Props = {\n    data?: {\n        firstName?: string;\n        lastName?: string;\n    };\n};\n\nconst FullName = (props: Props) => {\n    const { data } = props;\n\n    if (!data) {\n        return \"N/A\";\n    }\n\n    let output = \"\";\n    if (data.firstName) {\n        output += data.firstName;\n    }\n\n    if (data.lastName) {\n        output += \" \" + data.lastName;\n    }\n\n    return output;\n};\n\nexport { FullName };\n"]}

package/FullName/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA","sourcesContent":["export * from \"./FullName\";\n"]}

package/Grid/Grid.d.ts

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React from "react";
 import { GridCellProps as RmwcGridCellProps, GridProps as RmwcGridProps } from "@rmwc/grid";
 import { CSSProperties } from "react";
 export declare type CellProps = RmwcGridCellProps & {