@webiny/ui 5.24.0-beta.0 → 5.25.0-beta.1

package/AutoComplete/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["utils.ts"],"names":["getOptionValue","option","props","useSimpleValues","valueProp","getOptionText","textProp","findInAliases","search","aliases","some","alias","toLowerCase","includes"],"mappings":"AAYA,OAAO,IAAMA,cAAc,GAAG,SAAjBA,cAAiB,CAACC,MAAD,EAA0BC,KAA1B,EAAmD;AAC7E,MAAID,MAAJ,EAAY;AACR,WAAOC,KAAK,CAACC,eAAN,GACAF,MADA,GAEAA,MAAD,CAAmBC,KAAK,CAACE,SAAzB,CAFN;AAGH;;AAED,SAAOH,MAAP;AACH,CARM;AAUP,OAAO,IAAMI,aAAa,GAAG,SAAhBA,aAAgB,CAACJ,MAAD,EAA0BC,KAA1B,EAAmD;AAC5E,MAAID,MAAJ,EAAY;AACR,WAAOC,KAAK,CAACC,eAAN,GACAF,MADA,GAEAA,MAAD,CAAmBC,KAAK,CAACI,QAAzB,CAFN;AAGH;;AAED,SAAOL,MAAP;AACH,CARM;AAUP,OAAO,IAAMM,aAAa,GAAG,SAAhBA,aAAgB,CAACN,MAAD,EAAiBO,MAAjB,EAA8C;AACvE,SAAO,CAACP,MAAM,CAACQ,OAAP,IAAkB,EAAnB,EAAuBC,IAAvB,CAA4B,UAACC,KAAD,EAA4B;AAC3D,WAAOA,KAAK,CAACC,WAAN,GAAoBC,QAApB,CAA6B,CAACL,MAAM,IAAI,EAAX,EAAeI,WAAf,EAA7B,CAAP;AACH,GAFM,CAAP;AAGH,CAJM","sourcesContent":["interface Option {\n    aliases?: string[];\n    index?: number;\n    name?: string;\n    [key: string]: any;\n}\ninterface Props {\n    useSimpleValues?: boolean;\n    valueProp?: string;\n    textProp?: string;\n}\n\nexport const getOptionValue = (option: Option | string, props: Props): string => {\n    if (option) {\n        return props.useSimpleValues\n            ? (option as string)\n            : (option as Option)[props.valueProp as string];\n    }\n\n    return option as string;\n};\n\nexport const getOptionText = (option: Option | string, props: Props): string => {\n    if (option) {\n        return props.useSimpleValues\n            ? (option as string)\n            : (option as Option)[props.textProp as string];\n    }\n\n    return option as string;\n};\n\nexport const findInAliases = (option: Option, search?: string): boolean => {\n    return (option.aliases || []).some((alias: string): boolean => {\n        return alias.toLowerCase().includes((search || \"\").toLowerCase());\n    });\n};\n"]}

package/Avatar/Avatar.d.ts

@@ -1,5 +1,5 @@
-import * as React from "react";
-export declare type AvatarProps = {
+import React from "react";
+export interface AvatarProps {
     /**
      * CSS class name.
      */
@@ -11,7 +11,7 @@ export declare type AvatarProps = {
     /**
      * Avatar image source.
      */
-    src: string;
+    src?: string | null;
     /**
      * "alt" text.
      */
@@ -36,14 +36,8 @@ export declare type AvatarProps = {
      * Text that will be shown when there is no image (usually user's initials).
      */
     fallbackText: string;
-};
+}
 /**
  * Use Avatar component to display user's avatar.
  */
-export declare const Avatar: {
-    (props: AvatarProps): JSX.Element;
-    defaultProps: {
-        width: number;
-        height: number;
-    };
-};
+export declare const Avatar: React.FC<AvatarProps>;

package/Avatar/Avatar.js

@@ -1,7 +1,7 @@
 import _objectSpread from "@babel/runtime/helpers/objectSpread2";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["className", "width", "height", "src", "alt", "fallbackText", "renderImage"];
-import * as React from "react";
+import React from "react";
 import { css } from "emotion";
 import classNames from "classnames";
 var avatar = /*#__PURE__*/css({
@@ -56,12 +56,17 @@ export var Avatar = function Avatar(props) {
     alt: alt
   };
 
-  if (typeof renderImage === "function") {
-    renderedImage = renderImage(imageProps);
-  } else {
-    renderedImage = /*#__PURE__*/React.createElement("img", Object.assign({}, imageProps, {
-      alt: alt
-    }));
+  if (src) {
+    if (typeof renderImage === "function") {
+      renderedImage = renderImage(_objectSpread(_objectSpread({}, imageProps), {}, {
+        src: src
+      }));
+    } else {
+      renderedImage = /*#__PURE__*/React.createElement("img", Object.assign({}, imageProps, {
+        alt: alt,
+        src: src
+      }));
+    }
   }
 
   return /*#__PURE__*/React.createElement("div", Object.assign({}, rest, {

package/Avatar/Avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Avatar.tsx"],"names":["React","css","classNames","avatar","borderRadius","display","width","height","position","top","right","overflow","background","color","div","textAlign","alignContent","justifyContent","flexDirection","fontSize","span","paddingBottom","img","objectFit","Avatar","props","className","src","alt","fallbackText","renderImage","rest","renderedImage","imageProps","style","split","map","word","charAt","join","toUpperCase","defaultProps"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport { css } from \"emotion\";\nimport classNames from \"classnames\";\nconst avatar = css({\n    borderRadius: \"50%\",\n    display: \"block\",\n    //alignItems: \"center\",\n    //justifyContent: \"center\",\n    width: 38,\n    height: 38,\n    position: \"relative\",\n    top: -7,\n    right: 7,\n    overflow: \"hidden\",\n    background: \"var(--mdc-theme-background)\",\n    color: \"var(--mdc-theme-text-secondary-on-background)\",\n    div: {\n        textAlign: \"center\",\n        display: \"flex\",\n        alignContent: \"center\",\n        justifyContent: \"center\",\n        flexDirection: \"column\",\n        width: 38,\n        height: 38,\n        fontSize: \"1rem\",\n        span: {\n            paddingBottom: 2\n        }\n    },\n    img: {\n        width: \"100% !important\",\n        height: \"100% !important\",\n        objectFit: \"cover\"\n    }\n});\n\nexport interface AvatarProps {\n    /**\n     * CSS class name.\n     */\n    className?: string;\n\n    /**\n     * Style object.\n     */\n    style?: React.CSSProperties;\n\n    /**\n     * Avatar image source.\n     */\n    src?: string | null;\n\n    /**\n     * \"alt\" text.\n     */\n    alt?: string;\n\n    /**\n     * Width.\n     */\n    width?: number;\n\n    /**\n     * Height.\n     */\n    height?: number;\n\n    /**\n     * Pass a custom image component to be rendered instead of a simple <img> element.\n     * @param props\n     */\n    renderImage?: (props: { src: string; alt?: string }) => React.ReactElement;\n\n    /**\n     * Text that will be shown when there is no image (usually user's initials).\n     */\n    fallbackText: string;\n}\n\n/**\n * Use Avatar component to display user's avatar.\n */\nexport const Avatar: React.FC<AvatarProps> = props => {\n    const { className, width, height, src, alt, fallbackText, renderImage, ...rest } = props;\n\n    let renderedImage;\n    const imageProps = { src, alt };\n    if (src) {\n        if (typeof renderImage === \"function\") {\n            renderedImage = renderImage({\n                ...imageProps,\n                src\n            });\n        } else {\n            renderedImage = <img {...imageProps} alt={alt} src={src} />;\n        }\n    }\n\n    return (\n        <div\n            {...rest}\n            className={classNames(avatar, className)}\n            style={{ ...props.style, width, height }}\n        >\n            {props.src ? (\n                renderedImage\n            ) : (\n                <div>\n                    <span>\n                        {fallbackText\n                            .split(\" \")\n                            .map(word => word.charAt(0))\n                            .join(\"\")\n                            .toUpperCase()}\n                    </span>\n                </div>\n            )}\n        </div>\n    );\n};\n\nAvatar.defaultProps = {\n    width: 38,\n    height: 38\n};\n"]}

package/Avatar/Avatar.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Avatar.stories.tsx"],"names":["React","storiesOf","Story","StoryReadme","StorySandbox","readme","Avatar","story","module","add","info","propTables"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,QAA0B,kBAA1B;AACA,SAASC,KAAT,EAAgBC,WAAhB,EAA6BC,YAA7B,QAAiD,+BAAjD;AACA,OAAOC,MAAP;AACA,SAASC,MAAT;AAEA,IAAMC,KAAK,GAAGN,SAAS,CAAC,mBAAD,EAAsBO,MAAtB,CAAvB;AAEAD,KAAK,CAACE,GAAN,CACI,OADJ,EAEI,YAAM;AACF,sBACI,oBAAC,KAAD,qBACI,oBAAC,WAAD,QAAcJ,MAAd,CADJ,eAEI,oBAAC,YAAD;AAAc,IAAA,KAAK,EAAE;AAArB,kBACI,8CACI,oBAAC,MAAD;AACI,IAAA,KAAK,EAAE,EADX;AAEI,IAAA,MAAM,EAAE,EAFZ;AAGI,IAAA,GAAG,EAAC,WAHR;AAII,IAAA,YAAY,EAAC,GAJjB;AAKI,IAAA,GAAG,EAAC;AALR,IADJ,eASI,+BATJ,eAUI,+BAVJ,eAYI,oBAAC,MAAD;AAAQ,IAAA,KAAK,EAAE,EAAf;AAAmB,IAAA,MAAM,EAAE,EAA3B;AAA+B,IAAA,GAAG,EAAC,WAAnC;AAA+C,IAAA,YAAY,EAAC,GAA5D;AAAgE,IAAA,GAAG,EAAE;AAArE,IAZJ,CADJ,CAFJ,CADJ;AAqBH,CAxBL,EAyBI;AAAEK,EAAAA,IAAI,EAAE;AAAEC,IAAAA,UAAU,EAAE,CAACL,MAAD;AAAd;AAAR,CAzBJ","sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport { Story, StoryReadme, StorySandbox } from \"@webiny/storybook-utils/Story\";\nimport readme from \"./../Avatar/README.md\";\nimport { Avatar } from \"./Avatar\";\n\nconst story = storiesOf(\"Components/Avatar\", module);\n\nstory.add(\n    \"usage\",\n    () => {\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox title={\"A simple avatar\"}>\n                    <div>\n                        <Avatar\n                            width={48}\n                            height={48}\n                            alt=\"Test alt.\"\n                            fallbackText=\"T\"\n                            src=\"http://i.pravatar.cc/150?img=49\"\n                        />\n\n                        <br />\n                        <br />\n\n                        <Avatar width={64} height={64} alt=\"Test alt.\" fallbackText=\"T\" src={\"\"} />\n                    </div>\n                </StorySandbox>\n            </Story>\n        );\n    },\n    { info: { propTables: [Avatar] } }\n);\n"]}

package/Avatar/index.js.map

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

package/Button/Button.d.ts

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React from "react";
 import { FabProps } from "@rmwc/fab";
 import { IconProps } from "../Icon/Icon";
 import { SyntheticEvent } from "react";
@@ -17,23 +17,14 @@ export interface ButtonProps {
 }
 /**
  * Shows a default button, used typically when action is not of high priority.
- * @param props
- * @returns {*}
- * @constructor
  */
 export declare const ButtonDefault: React.FC<ButtonProps>;
 /**
  * Shows primary button, eg. for submitting forms.
- * @param props
- * @returns {*}
- * @constructor
  */
 export declare const ButtonPrimary: React.FC<ButtonProps>;
 /**
  * Shows a secondary button - eg. for doing a reset on a form.
- * @param props
- * @returns {*}
- * @constructor
  */
 export declare const ButtonSecondary: React.FC<ButtonProps>;
 export declare type ButtonFloatingProps = ButtonProps & FabProps & {
@@ -44,15 +35,9 @@ export declare type ButtonFloatingProps = ButtonProps & FabProps & {
 };
 /**
  * A floating button, shown on the side of the screen, typically used for creating new content or accessing settings.
- * @param props
- * @returns {*}
- * @constructor
  */
 export declare const ButtonFloating: React.FC<ButtonFloatingProps>;
 /**
  * Shows an icon, suitable to be shown inside of a button.
- * @param props
- * @returns {*}
- * @constructor
  */
 export declare const ButtonIcon: React.FC<IconProps>;

package/Button/Button.js

@@ -1,16 +1,13 @@
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["disabled", "icon", "onClick", "small", "label", "ripple", "className"];
-import * as React from "react";
-import * as R from "@rmwc/button";
+import React from "react";
+import * as RmwcButton from "@rmwc/button";
 import { Fab } from "@rmwc/fab";
 import { Icon } from "../Icon/Icon";
 import classNames from "classnames";
 
 /**
  * Shows a default button, used typically when action is not of high priority.
- * @param props
- * @returns {*}
- * @constructor
  */
 export var ButtonDefault = function ButtonDefault(props) {
   var disabled = props.disabled,
@@ -22,7 +19,7 @@ export var ButtonDefault = function ButtonDefault(props) {
       _props$className = props.className,
       className = _props$className === void 0 ? "" : _props$className,
       style = props.style;
-  return /*#__PURE__*/React.createElement(R.Button, {
+  return /*#__PURE__*/React.createElement(RmwcButton.Button, {
     style: style,
     disabled: disabled,
     dense: small,
@@ -34,9 +31,6 @@ export var ButtonDefault = function ButtonDefault(props) {
 };
 /**
  * Shows primary button, eg. for submitting forms.
- * @param props
- * @returns {*}
- * @constructor
  */
 
 export var ButtonPrimary = function ButtonPrimary(props) {
@@ -50,10 +44,10 @@ export var ButtonPrimary = function ButtonPrimary(props) {
       _props$ripple2 = props.ripple,
       ripple = _props$ripple2 === void 0 ? true : _props$ripple2,
       _props$style = props.style,
-      style = _props$style === void 0 ? null : _props$style,
+      style = _props$style === void 0 ? {} : _props$style,
       _props$className2 = props.className,
       className = _props$className2 === void 0 ? null : _props$className2;
-  return /*#__PURE__*/React.createElement(R.Button, {
+  return /*#__PURE__*/React.createElement(RmwcButton.Button, {
     raised: !flat,
     dense: small,
     disabled: disabled,
@@ -67,9 +61,6 @@ export var ButtonPrimary = function ButtonPrimary(props) {
 };
 /**
  * Shows a secondary button - eg. for doing a reset on a form.
- * @param props
- * @returns {*}
- * @constructor
  */
 
 export var ButtonSecondary = function ButtonSecondary(props) {
@@ -83,8 +74,8 @@ export var ButtonSecondary = function ButtonSecondary(props) {
       _props$className3 = props.className,
       className = _props$className3 === void 0 ? null : _props$className3,
       _props$style2 = props.style,
-      style = _props$style2 === void 0 ? null : _props$style2;
-  return /*#__PURE__*/React.createElement(R.Button, {
+      style = _props$style2 === void 0 ? {} : _props$style2;
+  return /*#__PURE__*/React.createElement(RmwcButton.Button, {
     disabled: disabled,
     outlined: true,
     dense: small,
@@ -98,9 +89,6 @@ export var ButtonSecondary = function ButtonSecondary(props) {
 
 /**
  * A floating button, shown on the side of the screen, typically used for creating new content or accessing settings.
- * @param props
- * @returns {*}
- * @constructor
  */
 export var ButtonFloating = function ButtonFloating(props) {
   var disabled = props.disabled,
@@ -129,9 +117,6 @@ export var ButtonFloating = function ButtonFloating(props) {
 };
 /**
  * Shows an icon, suitable to be shown inside of a button.
- * @param props
- * @returns {*}
- * @constructor
  */
 
 export var ButtonIcon = function ButtonIcon(props) {

package/Button/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Button.tsx"],"names":["React","RmwcButton","Fab","Icon","classNames","ButtonDefault","props","disabled","onClick","children","small","ripple","className","style","ButtonPrimary","flat","ButtonSecondary","ButtonFloating","icon","label","rest","ButtonIcon"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAO,KAAKC,UAAZ,MAA4B,cAA5B;AACA,SAASC,GAAT,QAA8B,WAA9B;AACA,SAASC,IAAT;AACA,OAAOC,UAAP,MAAuB,YAAvB;;AA6BA;AACA;AACA;AACA,OAAO,IAAMC,aAAoC,GAAG,SAAvCA,aAAuC,CAAAC,KAAK,EAAI;AACzD,MAAQC,QAAR,GAAqFD,KAArF,CAAQC,QAAR;AAAA,MAAkBC,OAAlB,GAAqFF,KAArF,CAAkBE,OAAlB;AAAA,MAA2BC,QAA3B,GAAqFH,KAArF,CAA2BG,QAA3B;AAAA,MAAqCC,KAArC,GAAqFJ,KAArF,CAAqCI,KAArC;AAAA,sBAAqFJ,KAArF,CAA4CK,MAA5C;AAAA,MAA4CA,MAA5C,8BAAqD,IAArD;AAAA,yBAAqFL,KAArF,CAA2DM,SAA3D;AAAA,MAA2DA,SAA3D,iCAAuE,EAAvE;AAAA,MAA2EC,KAA3E,GAAqFP,KAArF,CAA2EO,KAA3E;AAEA,sBACI,oBAAC,UAAD,CAAY,MAAZ;AACI,IAAA,KAAK,EAAEA,KADX;AAEI,IAAA,QAAQ,EAAEN,QAFd;AAGI,IAAA,KAAK,EAAEG,KAHX;AAII,IAAA,OAAO,EAAEF,OAJb;AAKI,IAAA,MAAM,EAAEG,MALZ;AAMI,IAAA,SAAS,EAAEP,UAAU,CAAC,kBAAD,EAAqBQ,SAArB,CANzB;AAOI,mBAAaN,KAAK,CAAC,aAAD;AAPtB,KASKG,QATL,CADJ;AAaH,CAhBM;AAkBP;AACA;AACA;;AACA,OAAO,IAAMK,aAAoC,GAAG,SAAvCA,aAAuC,CAAAR,KAAK,EAAI;AACzD,MACIC,QADJ,GASID,KATJ,CACIC,QADJ;AAAA,MAEIC,OAFJ,GASIF,KATJ,CAEIE,OAFJ;AAAA,MAGIC,QAHJ,GASIH,KATJ,CAGIG,QAHJ;AAAA,qBASIH,KATJ,CAIII,KAJJ;AAAA,MAIIA,KAJJ,6BAIY,KAJZ;AAAA,oBASIJ,KATJ,CAKIS,IALJ;AAAA,MAKIA,IALJ,4BAKW,KALX;AAAA,uBASIT,KATJ,CAMIK,MANJ;AAAA,MAMIA,MANJ,+BAMa,IANb;AAAA,qBASIL,KATJ,CAOIO,KAPJ;AAAA,MAOIA,KAPJ,6BAOY,EAPZ;AAAA,0BASIP,KATJ,CAQIM,SARJ;AAAA,MAQIA,SARJ,kCAQgB,IARhB;AAUA,sBACI,oBAAC,UAAD,CAAY,MAAZ;AACI,IAAA,MAAM,EAAE,CAACG,IADb;AAEI,IAAA,KAAK,EAAEL,KAFX;AAGI,IAAA,QAAQ,EAAEH,QAHd;AAII,IAAA,UAAU,EAAEQ,IAJhB;AAKI,IAAA,MAAM,EAAEJ,MALZ;AAMI,IAAA,OAAO,EAAEH,OANb;AAOI,IAAA,KAAK,EAAEK,KAPX;AAQI,IAAA,SAAS,EAAET,UAAU,CAAC,4CAAD,EAA+CQ,SAA/C,CARzB;AASI,mBAAaN,KAAK,CAAC,aAAD;AATtB,KAWKG,QAXL,CADJ;AAeH,CA1BM;AA4BP;AACA;AACA;;AACA,OAAO,IAAMO,eAAsC,GAAG,SAAzCA,eAAyC,CAAAV,KAAK,EAAI;AAC3D,MACIC,QADJ,GAQID,KARJ,CACIC,QADJ;AAAA,MAEIC,OAFJ,GAQIF,KARJ,CAEIE,OAFJ;AAAA,MAGIC,QAHJ,GAQIH,KARJ,CAGIG,QAHJ;AAAA,sBAQIH,KARJ,CAIII,KAJJ;AAAA,MAIIA,KAJJ,8BAIY,KAJZ;AAAA,uBAQIJ,KARJ,CAKIK,MALJ;AAAA,MAKIA,MALJ,+BAKa,IALb;AAAA,0BAQIL,KARJ,CAMIM,SANJ;AAAA,MAMIA,SANJ,kCAMgB,IANhB;AAAA,sBAQIN,KARJ,CAOIO,KAPJ;AAAA,MAOIA,KAPJ,8BAOY,EAPZ;AAUA,sBACI,oBAAC,UAAD,CAAY,MAAZ;AACI,IAAA,QAAQ,EAAEN,QADd;AAEI,IAAA,QAAQ,MAFZ;AAGI,IAAA,KAAK,EAAEG,KAHX;AAII,IAAA,MAAM,EAAEC,MAJZ;AAKI,IAAA,OAAO,EAAEH,OALb;AAMI,IAAA,KAAK,EAAEK,KANX;AAOI,IAAA,SAAS,EAAET,UAAU,CAAC,8CAAD,EAAiDQ,SAAjD,CAPzB;AAQI,mBAAaN,KAAK,CAAC,aAAD;AARtB,KAUKG,QAVL,CADJ;AAcH,CAzBM;;AAmCP;AACA;AACA;AACA,OAAO,IAAMQ,cAA6C,GAAG,SAAhDA,cAAgD,CAAAX,KAAK,EAAI;AAClE,MACIC,QADJ,GASID,KATJ,CACIC,QADJ;AAAA,MAEIW,IAFJ,GASIZ,KATJ,CAEIY,IAFJ;AAAA,MAGIV,OAHJ,GASIF,KATJ,CAGIE,OAHJ;AAAA,sBASIF,KATJ,CAIII,KAJJ;AAAA,MAIIA,KAJJ,8BAIY,KAJZ;AAAA,qBASIJ,KATJ,CAKIa,KALJ;AAAA,MAKIA,KALJ,6BAKY,KALZ;AAAA,uBASIb,KATJ,CAMIK,MANJ;AAAA,MAMIA,MANJ,+BAMa,IANb;AAAA,0BASIL,KATJ,CAOIM,SAPJ;AAAA,MAOIA,SAPJ,kCAOgB,IAPhB;AAAA,MAQOQ,IARP,4BASId,KATJ;;AAUA,sBACI,oBAAC,GAAD;AACI,mBAAaA,KAAK,CAAC,aAAD,CADtB;AAEI,IAAA,QAAQ,EAAEC,QAFd;AAGI,IAAA,IAAI,EAAEG,KAHV;AAII,IAAA,OAAO,EAAEF,OAJb;AAKI,IAAA,KAAK,EAAEW,KALX;AAMI,IAAA,MAAM,EAAER,MANZ;AAOI,IAAA,IAAI,EAAEO,IAPV;AAQI,IAAA,SAAS,EAAEd,UAAU,CAAC,4BAAD,EAA+BQ,SAA/B;AARzB,KASQQ,IATR,EADJ;AAaH,CAxBM;AA0BP;AACA;AACA;;AACA,OAAO,IAAMC,UAA+B,GAAG,SAAlCA,UAAkC,CAAAf,KAAK;AAAA,sBAAI,oBAAC,IAAD,EAAUA,KAAV,CAAJ;AAAA,CAA7C","sourcesContent":["import React from \"react\";\nimport * as RmwcButton from \"@rmwc/button\";\nimport { Fab, FabProps } from \"@rmwc/fab\";\nimport { Icon, IconProps } from \"../Icon/Icon\";\nimport classNames from \"classnames\";\nimport { SyntheticEvent } from \"react\";\n\nexport interface ButtonProps {\n    // Make button flat (only applicable to Primary button).\n    flat?: boolean;\n\n    // Make button smaller.\n    small?: boolean;\n\n    // onClick handler.\n    onClick?: (event: React.MouseEvent<any, MouseEvent>) => void | null;\n\n    // Label and optionally an icon (using Button.Icon component).\n    children?: React.ReactNode;\n\n    // Show ripple effect on button click. Default: true\n    ripple?: boolean;\n\n    className?: string;\n\n    disabled?: boolean;\n\n    style?: { [key: string]: any };\n\n    // For testing purposes.\n    \"data-testid\"?: string;\n}\n\n/**\n * Shows a default button, used typically when action is not of high priority.\n */\nexport const ButtonDefault: React.FC<ButtonProps> = props => {\n    const { disabled, onClick, children, small, ripple = true, className = \"\", style } = props;\n\n    return (\n        <RmwcButton.Button\n            style={style}\n            disabled={disabled}\n            dense={small}\n            onClick={onClick}\n            ripple={ripple}\n            className={classNames(\"webiny-ui-button\", className)}\n            data-testid={props[\"data-testid\"]}\n        >\n            {children}\n        </RmwcButton.Button>\n    );\n};\n\n/**\n * Shows primary button, eg. for submitting forms.\n */\nexport const ButtonPrimary: React.FC<ButtonProps> = props => {\n    const {\n        disabled,\n        onClick,\n        children,\n        small = false,\n        flat = false,\n        ripple = true,\n        style = {},\n        className = null\n    } = props;\n    return (\n        <RmwcButton.Button\n            raised={!flat}\n            dense={small}\n            disabled={disabled}\n            unelevated={flat}\n            ripple={ripple}\n            onClick={onClick}\n            style={style}\n            className={classNames(\"webiny-ui-button webiny-ui-button--primary\", className)}\n            data-testid={props[\"data-testid\"]}\n        >\n            {children}\n        </RmwcButton.Button>\n    );\n};\n\n/**\n * Shows a secondary button - eg. for doing a reset on a form.\n */\nexport const ButtonSecondary: React.FC<ButtonProps> = props => {\n    const {\n        disabled,\n        onClick,\n        children,\n        small = false,\n        ripple = true,\n        className = null,\n        style = {}\n    } = props;\n\n    return (\n        <RmwcButton.Button\n            disabled={disabled}\n            outlined\n            dense={small}\n            ripple={ripple}\n            onClick={onClick}\n            style={style}\n            className={classNames(\"webiny-ui-button webiny-ui-button--secondary\", className)}\n            data-testid={props[\"data-testid\"]}\n        >\n            {children}\n        </RmwcButton.Button>\n    );\n};\n\nexport type ButtonFloatingProps = ButtonProps &\n    FabProps & {\n        label?: React.ReactNode;\n        icon?: React.ReactNode;\n        onMouseDown?: (e: SyntheticEvent) => void;\n        onMouseUp?: (e: SyntheticEvent) => void;\n    };\n\n/**\n * A floating button, shown on the side of the screen, typically used for creating new content or accessing settings.\n */\nexport const ButtonFloating: React.FC<ButtonFloatingProps> = props => {\n    const {\n        disabled,\n        icon,\n        onClick,\n        small = false,\n        label = false,\n        ripple = true,\n        className = null,\n        ...rest\n    } = props;\n    return (\n        <Fab\n            data-testid={props[\"data-testid\"]}\n            disabled={disabled}\n            mini={small}\n            onClick={onClick}\n            label={label}\n            ripple={ripple}\n            icon={icon}\n            className={classNames(\"webiny-ui-button--floating\", className)}\n            {...rest}\n        />\n    );\n};\n\n/**\n * Shows an icon, suitable to be shown inside of a button.\n */\nexport const ButtonIcon: React.FC<IconProps> = props => <Icon {...props} />;\n"]}

package/Button/Button.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Button.stories.tsx"],"names":["React","storiesOf","withKnobs","text","boolean","Story","StoryReadme","StorySandbox","readme","ReactComponent","CloudIcon","ButtonPrimary","ButtonSecondary","ButtonDefault","ButtonFloating","ButtonIcon","story","module","addDecorator","add","label","small","flat","icon","info","propTables"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,QAA0B,kBAA1B;AACA,SAASC,SAAT,EAAoBC,IAApB,EAA0BC,OAA1B,QAAyC,wBAAzC;AACA,SAASC,KAAT,EAAgBC,WAAhB,EAA6BC,YAA7B,QAAiD,+BAAjD;AACA,OAAOC,MAAP;AACA,SAASC,cAAc,IAAIC,SAA3B;AAEA,SACIC,aADJ,EAEIC,eAFJ,EAGIC,aAHJ,EAIIC,cAJJ,EAKIC,UALJ;AAQA,IAAMC,KAAK,GAAGf,SAAS,CAAC,mBAAD,EAAsBgB,MAAtB,CAAvB;AACAD,KAAK,CAACE,YAAN,CAAmBhB,SAAnB;AAEAc,KAAK,CAACG,GAAN,CACI,kBADJ,EAEI,YAAM;AACF,MAAMC,KAAK,GAAGjB,IAAI,CAAC,OAAD,EAAU,kBAAV,CAAlB;AACA,MAAMkB,KAAK,GAAGjB,OAAO,CAAC,OAAD,EAAU,KAAV,CAArB;AACA,MAAMkB,IAAI,GAAGlB,OAAO,CAAC,MAAD,EAAS,KAAT,CAApB;AACA,MAAMmB,IAAI,gBAAG,oBAAC,UAAD;AAAY,IAAA,IAAI,eAAE,oBAAC,SAAD;AAAlB,IAAb;AAEA,sBACI,oBAAC,KAAD,qBACI,oBAAC,WAAD,QAAcf,MAAd,CADJ,eAEI,oBAAC,YAAD;AAAc,IAAA,KAAK,EAAE;AAArB,kBACI,oBAAC,aAAD;AAAe,IAAA,KAAK,EAAEa,KAAtB;AAA6B,IAAA,IAAI,EAAEC;AAAnC,KACKF,KADL,CADJ,CAFJ,eAOI,oBAAC,YAAD;AAAc,IAAA,KAAK,EAAE;AAArB,kBACI,oBAAC,aAAD;AAAe,IAAA,KAAK,EAAEC,KAAtB;AAA6B,IAAA,IAAI,EAAEC;AAAnC,KACKC,IADL,EAEKH,KAFL,CADJ,CAPJ,eAaI,oBAAC,YAAD;AAAc,IAAA,KAAK,EAAE;AAArB,kBACI,oBAAC,eAAD;AAAiB,IAAA,KAAK,EAAEC;AAAxB,KAAgCD,KAAhC,CADJ,CAbJ,eAgBI,oBAAC,YAAD;AAAc,IAAA,KAAK,EAAE;AAArB,kBACI,oBAAC,eAAD;AAAiB,IAAA,KAAK,EAAEC;AAAxB,KACKE,IADL,EAEKH,KAFL,CADJ,CAhBJ,eAsBI,oBAAC,YAAD;AAAc,IAAA,KAAK,EAAE;AAArB,kBACI,oBAAC,aAAD;AAAe,IAAA,KAAK,EAAEC;AAAtB,KAA8BD,KAA9B,CADJ,CAtBJ,eAyBI,oBAAC,YAAD;AAAc,IAAA,KAAK,EAAE;AAArB,kBACI,oBAAC,aAAD;AAAe,IAAA,KAAK,EAAEC;AAAtB,KACKE,IADL,EAEKH,KAFL,CADJ,CAzBJ,eA+BI,oBAAC,YAAD;AAAc,IAAA,KAAK,EAAE;AAArB,kBACI,oBAAC,cAAD;AAAgB,IAAA,KAAK,EAAEC,KAAvB;AAA8B,IAAA,IAAI,EAAEE;AAApC,IADJ,CA/BJ,CADJ;AAqCH,CA7CL,EA8CI;AACIC,EAAAA,IAAI,EAAE;AACFC,IAAAA,UAAU,EAAE,CAACd,aAAD,EAAgBC,eAAhB,EAAiCC,aAAjC,EAAgDC,cAAhD,EAAgEC,UAAhE;AADV;AADV,CA9CJ","sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport { withKnobs, text, boolean } from \"@storybook/addon-knobs\";\nimport { Story, StoryReadme, StorySandbox } from \"@webiny/storybook-utils/Story\";\nimport readme from \"./../Button/README.md\";\nimport { ReactComponent as CloudIcon } from \"./assets/baseline-cloud_done-24px.svg\";\n\nimport {\n    ButtonPrimary,\n    ButtonSecondary,\n    ButtonDefault,\n    ButtonFloating,\n    ButtonIcon\n} from \"./Button\";\n\nconst story = storiesOf(\"Components/Button\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n    \"standard buttons\",\n    () => {\n        const label = text(\"Label\", \"Click to proceed\");\n        const small = boolean(\"Small\", false);\n        const flat = boolean(\"Flat\", false);\n        const icon = <ButtonIcon icon={<CloudIcon />} />;\n\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox title={\"Primary button\"}>\n                    <ButtonPrimary small={small} flat={flat}>\n                        {label}\n                    </ButtonPrimary>\n                </StorySandbox>\n                <StorySandbox title={\"Primary button with icon\"}>\n                    <ButtonPrimary small={small} flat={flat}>\n                        {icon}\n                        {label}\n                    </ButtonPrimary>\n                </StorySandbox>\n                <StorySandbox title={\"Secondary button\"}>\n                    <ButtonSecondary small={small}>{label}</ButtonSecondary>\n                </StorySandbox>\n                <StorySandbox title={\"Secondary button with icon\"}>\n                    <ButtonSecondary small={small}>\n                        {icon}\n                        {label}\n                    </ButtonSecondary>\n                </StorySandbox>\n                <StorySandbox title={\"Default button\"}>\n                    <ButtonDefault small={small}>{label}</ButtonDefault>\n                </StorySandbox>\n                <StorySandbox title={\"Default button with icon\"}>\n                    <ButtonDefault small={small}>\n                        {icon}\n                        {label}\n                    </ButtonDefault>\n                </StorySandbox>\n                <StorySandbox title={\"Floating button\"}>\n                    <ButtonFloating small={small} icon={icon} />\n                </StorySandbox>\n            </Story>\n        );\n    },\n    {\n        info: {\n            propTables: [ButtonPrimary, ButtonSecondary, ButtonDefault, ButtonFloating, ButtonIcon]\n        }\n    }\n);\n"]}

package/Button/CopyButton/CopyButton.d.ts

@@ -1,14 +1,11 @@
-/// <reference types="react" />
+import React from "react";
 import { FormComponentProps } from "../../types";
-export declare type CopyButtonProps = FormComponentProps & {
+export interface CopyButtonProps extends FormComponentProps {
     value: string;
     onCopy?: () => void;
-};
+}
 /**
  * Shows the icon button.
- * @param props
- * @returns {*}
- * @constructor
  */
-declare const CopyButton: (props: CopyButtonProps) => JSX.Element;
+declare const CopyButton: React.FC<CopyButtonProps>;
 export { CopyButton };

package/Button/CopyButton/CopyButton.js

@@ -1,15 +1,12 @@
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["value", "onCopy"];
-import * as React from "react";
+import React from "react";
 import { ReactComponent as CopyToClipboardIcon } from "../assets/file_copy-24px.svg";
 import { IconButton } from "../index";
 import { useCallback } from "react";
 
 /**
  * Shows the icon button.
- * @param props
- * @returns {*}
- * @constructor
  */
 var CopyButton = function CopyButton(props) {
   var value = props.value,

package/Button/CopyButton/CopyButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["CopyButton.tsx"],"names":["React","ReactComponent","CopyToClipboardIcon","IconButton","useCallback","CopyButton","props","value","onCopy","otherProps","copyToClipboard","navigator","clipboard","writeText"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,cAAc,IAAIC,mBAA3B;AACA,SAASC,UAAT;AAEA,SAASC,WAAT,QAA4B,OAA5B;;AAOA;AACA;AACA;AACA,IAAMC,UAAqC,GAAG,SAAxCA,UAAwC,CAAAC,KAAK,EAAI;AACnD,MAAQC,KAAR,GAAyCD,KAAzC,CAAQC,KAAR;AAAA,MAAeC,MAAf,GAAyCF,KAAzC,CAAeE,MAAf;AAAA,MAA0BC,UAA1B,4BAAyCH,KAAzC;;AAEA,MAAMI,eAAe,GAAGN,WAAW,CAAC,YAAM;AACtCO,IAAAA,SAAS,CAACC,SAAV,CAAoBC,SAApB,CAA8BN,KAA9B;;AACA,QAAI,OAAOC,MAAP,KAAkB,UAAtB,EAAkC;AAC9BA,MAAAA,MAAM;AACT;AACJ,GALkC,EAKhC,CAACD,KAAD,CALgC,CAAnC;AAOA,sBAAO,oBAAC,UAAD,oBAAgBE,UAAhB;AAA4B,IAAA,OAAO,EAAEC,eAArC;AAAsD,IAAA,IAAI,eAAE,oBAAC,mBAAD;AAA5D,KAAP;AACH,CAXD;;AAaA,SAASL,UAAT","sourcesContent":["import React from \"react\";\nimport { ReactComponent as CopyToClipboardIcon } from \"../assets/file_copy-24px.svg\";\nimport { IconButton } from \"../index\";\nimport { FormComponentProps } from \"../../types\";\nimport { useCallback } from \"react\";\n\nexport interface CopyButtonProps extends FormComponentProps {\n    value: string;\n    onCopy?: () => void;\n}\n\n/**\n * Shows the icon button.\n */\nconst CopyButton: React.FC<CopyButtonProps> = props => {\n    const { value, onCopy, ...otherProps } = props;\n\n    const copyToClipboard = useCallback(() => {\n        navigator.clipboard.writeText(value);\n        if (typeof onCopy === \"function\") {\n            onCopy();\n        }\n    }, [value]);\n\n    return <IconButton {...otherProps} onClick={copyToClipboard} icon={<CopyToClipboardIcon />} />;\n};\n\nexport { CopyButton };\n"]}

package/Button/CopyButton/CopyButton.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["CopyButton.stories.tsx"],"names":["React","storiesOf","Story","StoryReadme","StorySandbox","readme","Menu","MenuItem","CopyButton","story","module","add","info","propTablesExclude"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,QAA0B,kBAA1B;AACA,SAASC,KAAT,EAAgBC,WAAhB,EAA6BC,YAA7B,QAAiD,+BAAjD;AACA,OAAOC,MAAP;AACA,SAASC,IAAT,EAAeC,QAAf;AAEA,SAASC,UAAT;AAEA,IAAMC,KAAK,GAAGR,SAAS,CAAC,mBAAD,EAAsBS,MAAtB,CAAvB;AAEAD,KAAK,CAACE,GAAN,CACI,aADJ,EAEI,YAAM;AACF,sBACI,oBAAC,KAAD,qBACI,oBAAC,WAAD,QAAcN,MAAd,CADJ,eAEI,oBAAC,YAAD;AAAc,IAAA,KAAK,EAAE;AAArB,kBACI,8CACI,kFADJ,eAEI,oBAAC,UAAD;AAAY,IAAA,KAAK,EAAC;AAAlB,IAFJ,CADJ,CAFJ,CADJ;AAWH,CAdL,EAeI;AACIO,EAAAA,IAAI,EAAE;AACFC,IAAAA,iBAAiB,EAAE,CAACP,IAAD,EAAOC,QAAP,EAAiBL,KAAjB,EAAwBC,WAAxB,EAAqCC,YAArC;AADjB;AADV,CAfJ","sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport { Story, StoryReadme, StorySandbox } from \"@webiny/storybook-utils/Story\";\nimport readme from \"./README.md\";\nimport { Menu, MenuItem } from \"./../../Menu/index\";\n\nimport { CopyButton } from \"./CopyButton\";\n\nconst story = storiesOf(\"Components/Button\", module);\n\nstory.add(\n    \"copy button\",\n    () => {\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox title={\"Copy button\"}>\n                    <div>\n                        <span>Click the button to copy the &quot;Hello&quot; value:</span>\n                        <CopyButton value=\"Hello\" />\n                    </div>\n                </StorySandbox>\n            </Story>\n        );\n    },\n    {\n        info: {\n            propTablesExclude: [Menu, MenuItem, Story, StoryReadme, StorySandbox]\n        }\n    }\n);\n"]}

package/Button/IconButton/IconButton.d.ts

@@ -1,7 +1,7 @@
-import * as React from "react";
+import React from "react";
 import { IconButtonProps as RmwcIconButtonProps } from "@rmwc/icon-button";
 import { FormComponentProps } from "../../types";
-export declare type IconButtonProps = FormComponentProps & RmwcIconButtonProps & {
+export interface IconButtonProps extends Omit<FormComponentProps, "onChange">, RmwcIconButtonProps {
     id?: string;
     /**
      * Icon should be provided as an SvgComponent.
@@ -28,12 +28,9 @@ export declare type IconButtonProps = FormComponentProps & RmwcIconButtonProps &
      * Should icon be disabled?
      */
     disabled?: boolean;
-};
+}
 /**
  * Shows the icon button.
- * @param props
- * @returns {*}
- * @constructor
  */
-declare const IconButton: (props: IconButtonProps) => JSX.Element;
+declare const IconButton: React.FC<IconButtonProps>;
 export { IconButton };

package/Button/IconButton/IconButton.js

@@ -1,11 +1,8 @@
-import * as React from "react";
+import React from "react";
 import { IconButton as RIconButton } from "@rmwc/icon-button";
 
 /**
  * Shows the icon button.
- * @param props
- * @returns {*}
- * @constructor
  */
 var IconButton = function IconButton(props) {
   var id = props.id,

package/Button/IconButton/IconButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["IconButton.tsx"],"names":["React","IconButton","RIconButton","props","id","icon","label","onClick","className","disabled","ripple"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SACIC,UAAU,IAAIC,WADlB,QAGO,mBAHP;;AAyCA;AACA;AACA;AACA,IAAMD,UAAqC,GAAG,SAAxCA,UAAwC,CAAAE,KAAK,EAAI;AACnD,MAAQC,EAAR,GAAyED,KAAzE,CAAQC,EAAR;AAAA,MAAYC,IAAZ,GAAyEF,KAAzE,CAAYE,IAAZ;AAAA,MAAkBC,KAAlB,GAAyEH,KAAzE,CAAkBG,KAAlB;AAAA,MAAyBC,OAAzB,GAAyEJ,KAAzE,CAAyBI,OAAzB;AAAA,MAAkCC,SAAlC,GAAyEL,KAAzE,CAAkCK,SAAlC;AAAA,MAA6CC,QAA7C,GAAyEN,KAAzE,CAA6CM,QAA7C;AAAA,sBAAyEN,KAAzE,CAAuDO,MAAvD;AAAA,MAAuDA,MAAvD,8BAAgE,IAAhE;AAEA,sBACI,oBAAC,WAAD;AACI,IAAA,EAAE,EAAEN,EADR;AAEI,mBAAaD,KAAK,CAAC,aAAD,CAFtB;AAGI,IAAA,OAAO,EAAEI,OAHb;AAII,IAAA,QAAQ,EAAEE,QAJd;AAKI,IAAA,SAAS,EAAED,SALf;AAMI,IAAA,KAAK,EAAEF,KANX;AAOI,IAAA,IAAI,EAAED,IAPV;AAQI,IAAA,MAAM,EAAEK;AARZ,IADJ;AAYH,CAfD;;AAiBA,SAAST,UAAT","sourcesContent":["import React from \"react\";\nimport {\n    IconButton as RIconButton,\n    IconButtonProps as RmwcIconButtonProps\n} from \"@rmwc/icon-button\";\n\nimport { FormComponentProps } from \"../../types\";\n\nexport interface IconButtonProps extends Omit<FormComponentProps, \"onChange\">, RmwcIconButtonProps {\n    id?: string;\n    /**\n     * Icon should be provided as an SvgComponent.\n     */\n    icon: React.ReactNode;\n\n    /**\n     * Button label\n     */\n    label?: string;\n\n    /**\n     * onClick handler\n     * @param event\n     */\n    onClick?: (event: React.MouseEvent) => void;\n\n    /**\n     * Custom CSS class\n     */\n    className?: string;\n    /**\n     * For testing purposes.\n     */\n\n    \"data-testid\"?: string;\n\n    /**\n     * Should icon be disabled?\n     */\n    disabled?: boolean;\n}\n\n/**\n * Shows the icon button.\n */\nconst IconButton: React.FC<IconButtonProps> = props => {\n    const { id, icon, label, onClick, className, disabled, ripple = true } = props;\n\n    return (\n        <RIconButton\n            id={id}\n            data-testid={props[\"data-testid\"]}\n            onClick={onClick}\n            disabled={disabled}\n            className={className}\n            label={label}\n            icon={icon}\n            ripple={ripple}\n        />\n    );\n};\n\nexport { IconButton };\n"]}

package/Button/IconButton/IconButton.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["IconButton.stories.tsx"],"names":["React","storiesOf","Story","StoryReadme","StorySandbox","readme","ReactComponent","CloudIcon","MoreIcon","Menu","MenuItem","IconButton","story","module","add","console","log","info","propTablesExclude"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,QAA0B,kBAA1B;AACA,SAASC,KAAT,EAAgBC,WAAhB,EAA6BC,YAA7B,QAAiD,+BAAjD;AACA,OAAOC,MAAP;AACA,SAASC,cAAc,IAAIC,SAA3B;AACA,SAASD,cAAc,IAAIE,QAA3B;AACA,SAASC,IAAT,EAAeC,QAAf;AAEA,SAASC,UAAT;AAEA,IAAMC,KAAK,GAAGX,SAAS,CAAC,mBAAD,EAAsBY,MAAtB,CAAvB;AAEAD,KAAK,CAACE,GAAN,CACI,aADJ,EAEI,YAAM;AACF,sBACI,oBAAC,KAAD,qBACI,oBAAC,WAAD,QAAcT,MAAd,CADJ,eAEI,oBAAC,YAAD;AAAc,IAAA,KAAK,EAAE;AAArB,kBACI,oBAAC,UAAD;AACI,IAAA,IAAI,eAAE,oBAAC,SAAD,OADV;AAEI,IAAA,KAAK,EAAC,YAFV;AAGI,IAAA,OAAO,EAAE;AAAA,aAAMU,OAAO,CAACC,GAAR,CAAY,gBAAZ,CAAN;AAAA;AAHb,IADJ,CAFJ,eASI,oBAAC,YAAD;AAAc,IAAA,KAAK,EAAE;AAArB,kBACI,oBAAC,IAAD;AACI,IAAA,MAAM,eACF,oBAAC,UAAD;AACI,MAAA,IAAI,eAAE,oBAAC,QAAD,OADV;AAEI,MAAA,KAAK,EAAC,aAFV;AAGI,MAAA,OAAO,EAAE;AAAA,eAAMD,OAAO,CAACC,GAAR,CAAY,gBAAZ,CAAN;AAAA;AAHb;AAFR,kBASI,oBAAC,QAAD;AACI,IAAA,OAAO,EAAE,mBAAM;AACXD,MAAAA,OAAO,CAACC,GAAR,CAAY,iBAAZ;AACH;AAHL,aATJ,eAgBI,oBAAC,QAAD,iBAhBJ,eAiBI,oBAAC,QAAD,qBAjBJ,CADJ,CATJ,CADJ;AAiCH,CApCL,EAqCI;AACIC,EAAAA,IAAI,EAAE;AACFC,IAAAA,iBAAiB,EAAE,CAACT,IAAD,EAAOC,QAAP,EAAiBR,KAAjB,EAAwBC,WAAxB,EAAqCC,YAArC;AADjB;AADV,CArCJ","sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport { Story, StoryReadme, StorySandbox } from \"@webiny/storybook-utils/Story\";\nimport readme from \"./README.md\";\nimport { ReactComponent as CloudIcon } from \"./../assets/baseline-cloud_done-24px.svg\";\nimport { ReactComponent as MoreIcon } from \"./../assets/round-more_vert-24px.svg\";\nimport { Menu, MenuItem } from \"./../../Menu/index\";\n\nimport { IconButton } from \"./IconButton\";\n\nconst story = storiesOf(\"Components/Button\", module);\n\nstory.add(\n    \"icon button\",\n    () => {\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox title={\"Icon button\"}>\n                    <IconButton\n                        icon={<CloudIcon />}\n                        label=\"Icon label\"\n                        onClick={() => console.log(\"Button clicked\")}\n                    />\n                </StorySandbox>\n                <StorySandbox title={\"Menu example\"}>\n                    <Menu\n                        handle={\n                            <IconButton\n                                icon={<MoreIcon />}\n                                label=\"Toggle menu\"\n                                onClick={() => console.log(\"Button clicked\")}\n                            />\n                        }\n                    >\n                        <MenuItem\n                            onClick={() => {\n                                console.log(\"Apple selected!\");\n                            }}\n                        >\n                            Apple\n                        </MenuItem>\n                        <MenuItem>Banana</MenuItem>\n                        <MenuItem>Watermelon</MenuItem>\n                    </Menu>\n                </StorySandbox>\n            </Story>\n        );\n    },\n    {\n        info: {\n            propTablesExclude: [Menu, MenuItem, Story, StoryReadme, StorySandbox]\n        }\n    }\n);\n"]}

package/Button/index.js.map

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

package/Carousel/Carousel.d.ts

@@ -1,11 +1,11 @@
-import * as React from "react";
+import React from "react";
 import { CarouselProps, CarouselRenderControl } from "nuka-carousel";
-declare type Props = CarouselProps & {
+interface Props extends CarouselProps {
     children: React.ReactNode;
     renderNextSlide?: CarouselRenderControl | null;
     renderPreviousSlide?: CarouselRenderControl | null;
     renderBottomNav?: CarouselRenderControl | null;
-};
+}
 declare class Carousel extends React.Component<Props> {
     static defaultProps: {
         swiping: boolean;

package/Carousel/Carousel.js

@@ -3,7 +3,7 @@ import _createClass from "@babel/runtime/helpers/createClass";
 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 NukaCarousel from "nuka-carousel";
 import pick from "lodash/pick";
 

package/Carousel/Carousel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Carousel.tsx"],"names":["React","NukaCarousel","pick","Carousel","props","nukaProps","renderPreviousSlide","renderCenterLeftControls","renderNextSlide","renderCenterRightControls","renderBottomNav","renderBottomCenterControls","children","Component","swiping","dragging","heightMode","easing"],"mappings":";;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,YAAP,MAAmE,eAAnE;AACA,OAAOC,IAAP,MAAiB,aAAjB;;IAgBMC,Q;;;;;;;;;;;;;WAwBF,kBAAyB;AACrB,0BACI,oBAAC,YAAD,oBACQD,IAAI,CAAC,KAAKE,KAAN,EAAaD,QAAQ,CAACE,SAAtB,CADZ,EAES,KAAKD,KAAL,CAAWE,mBAAX,GACC;AAAEC,QAAAA,wBAAwB,EAAE,KAAKH,KAAL,CAAWE;AAAvC,OADD,GAEC,EAJV,EAKS,KAAKF,KAAL,CAAWI,eAAX,GACC;AAAEC,QAAAA,yBAAyB,EAAE,KAAKL,KAAL,CAAWI;AAAxC,OADD,GAEC,EAPV,EAQS,KAAKJ,KAAL,CAAWM,eAAX,GACC;AAAEC,QAAAA,0BAA0B,EAAE,KAAKP,KAAL,CAAWM;AAAzC,OADD,GAEC,EAVV,GAYK,KAAKN,KAAL,CAAWQ,QAZhB,CADJ;AAgBH;;;;EAzCkBZ,KAAK,CAACa,S;;gBAAvBV,Q,kBACoB;AAClBW,EAAAA,OAAO,EAAE,IADS;AAElBC,EAAAA,QAAQ,EAAE,KAFQ;AAGlBC,EAAAA,UAAU,EAAE,OAHM;AAIlBC,EAAAA,MAAM,EAAE;AAJU,C;;gBADpBd,Q,eAQiB,CACf,UADe,EAEf,YAFe,EAGf,UAHe,EAIf,kBAJe,EAKf,aALe,EAMf,UANe,EAOf,QAPe,EAQf,YARe,EASf,cATe,EAUf,YAVe,EAWf,OAXe,EAYf,SAZe,EAaf,gBAbe,C;;AAoCvB,eAAeA,QAAf","sourcesContent":["import React from \"react\";\nimport NukaCarousel, { CarouselProps, CarouselRenderControl } from \"nuka-carousel\";\nimport pick from \"lodash/pick\";\n\ninterface Props extends CarouselProps {\n    // slides as set of HTMLElements\n    children: React.ReactNode;\n\n    // render method for the next slide button\n    renderNextSlide?: CarouselRenderControl | null;\n\n    // render method for the previous slide button\n    renderPreviousSlide?: CarouselRenderControl | null;\n\n    // render method for the central navigation\n    renderBottomNav?: CarouselRenderControl | null;\n}\n\nclass Carousel extends React.Component<Props> {\n    static defaultProps = {\n        swiping: true,\n        dragging: false,\n        heightMode: \"first\",\n        easing: \"easeExpInOut\"\n    };\n\n    static nukaProps = [\n        \"children\",\n        \"afterSlide\",\n        \"autoplay\",\n        \"autoplayInterval\",\n        \"beforeSlide\",\n        \"dragging\",\n        \"easing\",\n        \"heightMode\",\n        \"pauseOnHover\",\n        \"slideIndex\",\n        \"speed\",\n        \"swiping\",\n        \"transitionMode\"\n    ];\n\n    public override render() {\n        return (\n            <NukaCarousel\n                {...pick(this.props, Carousel.nukaProps)}\n                {...(this.props.renderPreviousSlide\n                    ? { renderCenterLeftControls: this.props.renderPreviousSlide }\n                    : {})}\n                {...(this.props.renderNextSlide\n                    ? { renderCenterRightControls: this.props.renderNextSlide }\n                    : {})}\n                {...(this.props.renderBottomNav\n                    ? { renderBottomCenterControls: this.props.renderBottomNav }\n                    : {})}\n            >\n                {this.props.children}\n            </NukaCarousel>\n        );\n    }\n}\n\nexport default Carousel;\n"]}

package/Carousel/Carouser.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Carouser.stories.tsx"],"names":["React","storiesOf","Story","StoryReadme","StorySandboxCode","StorySandbox","StorySandboxExample","withKnobs","readme","Carousel","story","module","addDecorator","add","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,SAAT,QAA0B,wBAA1B;AACA,OAAOC,MAAP;AACA,OAAOC,QAAP;AAEA,IAAMC,KAAK,GAAGT,SAAS,CAAC,qBAAD,EAAwBU,MAAxB,CAAvB;AACAD,KAAK,CAACE,YAAN,CAAmBL,SAAnB;AAEAG,KAAK,CAACG,GAAN,CACI,gBADJ,EAEI,YAAM;AACF,sBACI,oBAAC,KAAD,qBACI,oBAAC,WAAD,QAAcL,MAAd,CADJ,eAEI,oBAAC,YAAD,qBACI,oBAAC,mBAAD;AAAqB,IAAA,KAAK,EAAE;AAA5B,kBACI,oBAAC,QAAD,qBACI;AAAK,IAAA,GAAG,EAAC;AAAT,IADJ,eAEI;AAAK,IAAA,GAAG,EAAC;AAAT,IAFJ,eAGI;AAAK,IAAA,GAAG,EAAC;AAAT,IAHJ,eAII;AAAK,IAAA,GAAG,EAAC;AAAT,IAJJ,eAKI;AAAK,IAAA,GAAG,EAAC;AAAT,IALJ,eAMI;AAAK,IAAA,GAAG,EAAC;AAAT,IANJ,CADJ,CADJ,eAWI,oBAAC,gBAAD,wqBAXJ,CAFJ,CADJ;AA6BH,CAhCL,EAiCI;AAAEM,EAAAA,IAAI,EAAE;AAAEC,IAAAA,UAAU,EAAE,CAACN,QAAD;AAAd;AAAR,CAjCJ","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 { withKnobs } from \"@storybook/addon-knobs\";\nimport readme from \"./README.md\";\nimport Carousel from \"./Carousel\";\n\nconst story = storiesOf(\"Components/Carousel\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n    \"usage - single\",\n    () => {\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox>\n                    <StorySandboxExample title={\"Simple checkbox with a label and description\"}>\n                        <Carousel>\n                            <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide1\" />\n                            <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide2\" />\n                            <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide3\" />\n                            <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide4\" />\n                            <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide5\" />\n                            <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide6\" />\n                        </Carousel>\n                    </StorySandboxExample>\n                    <StorySandboxCode>\n                        {`\n                    <Carousel>\n                        <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide1\" />\n                        <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide2\" />\n                        <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide3\" />\n                        <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide4\" />\n                        <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide5\" />\n                        <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide6\" />\n                    </Carousel>\n                    `}\n                    </StorySandboxCode>\n                </StorySandbox>\n            </Story>\n        );\n    },\n    { info: { propTables: [Carousel] } }\n);\n"]}

package/Carousel/index.js.map

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

package/Checkbox/Checkbox.d.ts

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React from "react";
 import { FormComponentProps } from "../types";
 interface Props extends FormComponentProps {
     label?: React.ReactNode;
@@ -14,7 +14,6 @@ interface Props extends FormComponentProps {
  * In that case, each Checkbox component must receive value and onChange callback via props.
  */
 declare class Checkbox extends React.Component<Props> {
-    static defaultProps: Partial<Props>;
     onChange: (e: React.SyntheticEvent<HTMLInputElement>) => void;
     render(): JSX.Element;
 }

package/Checkbox/Checkbox.js

@@ -4,7 +4,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 { Checkbox as RmwcCheckbox } from "@rmwc/checkbox";
 import { FormElementMessage } from "../FormElementMessage";
 
@@ -48,6 +48,11 @@ var Checkbox = /*#__PURE__*/function (_React$Component) {
           description = _this$props.description,
           validation = _this$props.validation,
           _onClick = _this$props.onClick;
+
+      var _ref = validation || {},
+          validationIsValid = _ref.isValid,
+          validationMessage = _ref.message;
+
       return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(RmwcCheckbox, {
         indeterminate: indeterminate,
         disabled: disabled,
@@ -58,20 +63,13 @@ var Checkbox = /*#__PURE__*/function (_React$Component) {
         } // @ts-ignore Although the label is React.ReactNode internally, an error is still thrown.
         ,
         label: label
-      }), validation.isValid === false && /*#__PURE__*/React.createElement(FormElementMessage, {
+      }), validationIsValid === false && /*#__PURE__*/React.createElement(FormElementMessage, {
         error: true
-      }, validation.message), validation.isValid !== false && description && /*#__PURE__*/React.createElement(FormElementMessage, null, description));
+      }, validationMessage), validationIsValid !== false && description && /*#__PURE__*/React.createElement(FormElementMessage, null, description));
     }
   }]);
 
   return Checkbox;
 }(React.Component);
 
-_defineProperty(Checkbox, "defaultProps", {
-  validation: {
-    isValid: null,
-    message: null
-  }
-});
-
 export default Checkbox;

package/Checkbox/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Checkbox.tsx"],"names":["React","Checkbox","RmwcCheckbox","FormElementMessage","e","props","onChange","target","checked","value","label","disabled","indeterminate","description","validation","onClick","validationIsValid","isValid","validationMessage","message","Boolean","Component"],"mappings":";;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,QAAQ,IAAIC,YAArB,QAAyC,gBAAzC;AACA,SAASC,kBAAT;;AAoBA;AACA;AACA;AACA;AACA;AACA;IACMF,Q;;;;;;;;;;;;;;;;+DACS,UAACG,CAAD,EAA+C;AACtD,YAAKC,KAAL,CAAWC,QAAX,IAAuB,MAAKD,KAAL,CAAWC,QAAX,CAAqBF,CAAC,CAACG,MAAH,CAAkBC,OAAtC,CAAvB;AACH,K;;;;;;;WAED,kBAAyB;AACrB,wBACI,KAAKH,KADT;AAAA,UAAQI,KAAR,eAAQA,KAAR;AAAA,UAAeC,KAAf,eAAeA,KAAf;AAAA,UAAsBC,QAAtB,eAAsBA,QAAtB;AAAA,UAAgCC,aAAhC,eAAgCA,aAAhC;AAAA,UAA+CC,WAA/C,eAA+CA,WAA/C;AAAA,UAA4DC,UAA5D,eAA4DA,UAA5D;AAAA,UAAwEC,QAAxE,eAAwEA,OAAxE;;AAGA,iBAAmED,UAAU,IAAI,EAAjF;AAAA,UAAiBE,iBAAjB,QAAQC,OAAR;AAAA,UAA6CC,iBAA7C,QAAoCC,OAApC;;AAEA,0BACI,oBAAC,KAAD,CAAO,QAAP,qBACI,oBAAC,YAAD;AACI,QAAA,aAAa,EAAEP,aADnB;AAEI,QAAA,QAAQ,EAAED,QAFd;AAGI,QAAA,OAAO,EAAES,OAAO,CAACX,KAAD,CAHpB;AAII,QAAA,QAAQ,EAAE,KAAKH,QAJnB;AAKI,QAAA,OAAO,EAAE;AAAA,iBAAM,OAAOS,QAAP,KAAmB,UAAnB,IAAiCA,QAAO,CAACK,OAAO,CAACX,KAAD,CAAR,CAA9C;AAAA,SALb,CAMI;AANJ;AAOI,QAAA,KAAK,EAAEC;AAPX,QADJ,EAUKM,iBAAiB,KAAK,KAAtB,iBACG,oBAAC,kBAAD;AAAoB,QAAA,KAAK;AAAzB,SAA2BE,iBAA3B,CAXR,EAcKF,iBAAiB,KAAK,KAAtB,IAA+BH,WAA/B,iBACG,oBAAC,kBAAD,QAAqBA,WAArB,CAfR,CADJ;AAoBH;;;;EA/BkBb,KAAK,CAACqB,S;;AAkC7B,eAAepB,QAAf","sourcesContent":["import React from \"react\";\nimport { Checkbox as RmwcCheckbox } from \"@rmwc/checkbox\";\nimport { FormElementMessage } from \"~/FormElementMessage\";\nimport { FormComponentProps } from \"~/types\";\n\ninterface Props extends FormComponentProps {\n    // Component label.\n    label?: React.ReactNode;\n\n    // Is checkbox disabled?\n    disabled?: boolean;\n\n    // onClick callback.\n    onClick?: (value: boolean) => void;\n\n    // Use when checkbox is not checked nor unchecked.\n    indeterminate?: boolean;\n\n    // Description beneath the checkbox.\n    description?: string;\n}\n\n/**\n * Single Checkbox component can be used to store simple boolean values.\n *\n * Grouping multiple Checkbox components with CheckboxGroup will allow to store an array of selected values.\n * In that case, each Checkbox component must receive value and onChange callback via props.\n */\nclass Checkbox extends React.Component<Props> {\n    onChange = (e: React.SyntheticEvent<HTMLInputElement>) => {\n        this.props.onChange && this.props.onChange((e.target as any).checked);\n    };\n\n    public override render() {\n        const { value, label, disabled, indeterminate, description, validation, onClick } =\n            this.props;\n\n        const { isValid: validationIsValid, message: validationMessage } = validation || {};\n\n        return (\n            <React.Fragment>\n                <RmwcCheckbox\n                    indeterminate={indeterminate}\n                    disabled={disabled}\n                    checked={Boolean(value)}\n                    onChange={this.onChange}\n                    onClick={() => typeof onClick === \"function\" && onClick(Boolean(value))}\n                    // @ts-ignore Although the label is React.ReactNode internally, an error is still thrown.\n                    label={label}\n                />\n                {validationIsValid === false && (\n                    <FormElementMessage error>{validationMessage}</FormElementMessage>\n                )}\n\n                {validationIsValid !== false && description && (\n                    <FormElementMessage>{description}</FormElementMessage>\n                )}\n            </React.Fragment>\n        );\n    }\n}\n\nexport default Checkbox;\n"]}

package/Checkbox/Checkbox.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Checkbox.stories.tsx"],"names":["React","storiesOf","Story","StoryReadme","StorySandboxCode","StorySandbox","StorySandboxExample","withKnobs","boolean","readme","Form","Checkbox","story","module","addDecorator","add","disabled","Bind","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,SAAT,EAAoBC,OAApB,QAAmC,wBAAnC;AACA,OAAOC,MAAP;AAEA,SAASC,IAAT,QAAqB,cAArB;AACA,OAAOC,QAAP;AAEA,IAAMC,KAAK,GAAGX,SAAS,CAAC,qBAAD,EAAwBY,MAAxB,CAAvB;AACAD,KAAK,CAACE,YAAN,CAAmBP,SAAnB;AAEAK,KAAK,CAACG,GAAN,CACI,gBADJ,EAEI,YAAM;AACF,MAAMC,QAAQ,GAAGR,OAAO,CAAC,UAAD,EAAa,KAAb,CAAxB;AAEA,sBACI,oBAAC,KAAD,qBACI,oBAAC,WAAD,QAAcC,MAAd,CADJ,eAEI,oBAAC,YAAD,qBACI,oBAAC,mBAAD;AAAqB,IAAA,KAAK,EAAE;AAA5B,kBACI,oBAAC,IAAD,QACK;AAAA,QAAGQ,IAAH,QAAGA,IAAH;AAAA,wBACG,oBAAC,IAAD;AAAM,MAAA,IAAI,EAAC;AAAX,oBACI,oBAAC,QAAD;AACI,MAAA,KAAK,EAAE,aADX;AAEI,MAAA,QAAQ,EAAED,QAFd;AAGI,MAAA,WAAW,EACP;AAJR,MADJ,CADH;AAAA,GADL,CADJ,CADJ,eAgBI,oBAAC,gBAAD,4iBAhBJ,CAFJ,CADJ;AAqCH,CA1CL,EA2CI;AAAEE,EAAAA,IAAI,EAAE;AAAEC,IAAAA,UAAU,EAAE,CAACR,QAAD;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 { withKnobs, boolean } from \"@storybook/addon-knobs\";\nimport readme from \"./README_Checkbox.md\";\n\nimport { Form } from \"@webiny/form\";\nimport Checkbox from \"./Checkbox\";\n\nconst story = storiesOf(\"Components/Checkbox\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n    \"usage - single\",\n    () => {\n        const disabled = boolean(\"Disabled\", false);\n\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox>\n                    <StorySandboxExample title={\"Simple checkbox with a label and description\"}>\n                        <Form>\n                            {({ Bind }) => (\n                                <Bind name=\"rememberMe\">\n                                    <Checkbox\n                                        label={\"Remember me\"}\n                                        disabled={disabled}\n                                        description={\n                                            \"You won't be logged out after you leave the app.\"\n                                        }\n                                    />\n                                </Bind>\n                            )}\n                        </Form>\n                    </StorySandboxExample>\n                    <StorySandboxCode>\n                        {`\n                    <Form>\n                        {({ Bind }) => (\n                            <Bind name=\"rememberMe\">\n                                  <Checkbox\n                                    label={\"Remember me\"}\n                                    disabled={disabled}\n                                    description={\"You won't be logged out after you leave the app.\"}\n                                />\n                            </Bind>\n                        )}\n                    </Form>\n                    `}\n                    </StorySandboxCode>\n                </StorySandbox>\n            </Story>\n        );\n    },\n    { info: { propTables: [Checkbox] } }\n);\n"]}

package/Checkbox/Checkbox.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Checkbox.styles.ts"],"names":["css","webinyCheckboxTitle","textTransform","fontWeight","marginBottom"],"mappings":"AAAA,SAASA,GAAT,QAAoB,SAApB;AAEA;AACA;AACA;AACA;;AACA,IAAMC,mBAAmB,gBAAGD,GAAG,CAC3B,EAD2B,EAE3B;AACI,kCAAgC;AAC5B;AACAE,IAAAA,aAAa,EAAE,WAFa;AAG5BC,IAAAA,UAAU,EAAE,MAHgB;AAI5BC,IAAAA,YAAY,EAAE;AAJc;AADpC,CAF2B,+BAA/B;AAYA,SAASH,mBAAT","sourcesContent":["import { css } from \"emotion\";\n\n/**\n * Controls the helper text below the checkbox.\n * @type {string}\n */\nconst webinyCheckboxTitle = css(\n    {},\n    {\n        \"&.mdc-text-field-helper-text\": {\n            //paddingLeft: 10,\n            textTransform: \"uppercase\",\n            fontWeight: \"bold\",\n            marginBottom: \"5px\"\n        }\n    }\n);\n\nexport { webinyCheckboxTitle };\n"]}

package/Checkbox/CheckboxGroup.d.ts

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React from "react";
 import { FormComponentProps } from "../types";
 interface ChildrenRenderProp {
     onChange: (id: string | number) => () => void;

package/Checkbox/CheckboxGroup.js

@@ -2,7 +2,7 @@ import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _inherits from "@babel/runtime/helpers/inherits";
 import _createSuper from "@babel/runtime/helpers/createSuper";
-import * as React from "react";
+import React from "react";
 import { webinyCheckboxTitle } from "./Checkbox.styles";
 import { FormElementMessage } from "../FormElementMessage";
 

package/Checkbox/CheckboxGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["CheckboxGroup.tsx"],"names":["React","webinyCheckboxTitle","FormElementMessage","CheckboxGroup","props","description","label","validation","isValid","message","children","onChange","value","values","Array","isArray","index","indexOf","splice","push","getValue","id","includes","Component"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAASC,mBAAT;AACA,SAASC,kBAAT;;IAkBMC,a;;;;;;;;;;;;;WACF,kBAAyB;AAAA;;AACrB,wBAA8E,KAAKC,KAAnF;AAAA,UAAQC,WAAR,eAAQA,WAAR;AAAA,UAAqBC,KAArB,eAAqBA,KAArB;AAAA,8CAA4BC,UAA5B;AAAA,UAA4BA,UAA5B,sCAAyC;AAAEC,QAAAA,OAAO,EAAE,IAAX;AAAiBC,QAAAA,OAAO,EAAE;AAA1B,OAAzC;AAEA,0BACI,oBAAC,KAAD,CAAO,QAAP,QACKH,KAAK,iBACF;AACI,QAAA,SAAS,EACL,uEACAL;AAHR,SAMKK,KANL,CAFR,EAYK,KAAKF,KAAL,CAAWM,QAAX,CAAoB;AACjBC,QAAAA,QAAQ,EAAE,kBAAAC,KAAK,EAAI;AACf,iBAAO,YAAM;AACT,gBAAMC,MAAM,GAAGC,KAAK,CAACC,OAAN,CAAc,KAAI,CAACX,KAAL,CAAWQ,KAAzB,IAAkC,KAAI,CAACR,KAAL,CAAWQ,KAA7C,GAAqD,EAApE;AACA,gBAAMI,KAAK,GAAGH,MAAM,CAACI,OAAP,CAAeL,KAAf,CAAd;;AACA,gBAAII,KAAK,GAAG,CAAC,CAAb,EAAgB;AACZH,cAAAA,MAAM,CAACK,MAAP,CAAcF,KAAd,EAAqB,CAArB;AACH,aAFD,MAEO;AACHH,cAAAA,MAAM,CAACM,IAAP,CAAYP,KAAZ;AACH;;AAED,YAAA,KAAI,CAACR,KAAL,CAAWO,QAAX,IAAuB,KAAI,CAACP,KAAL,CAAWO,QAAX,CAAoBE,MAApB,CAAvB;AACH,WAVD;AAWH,SAbgB;AAcjBO,QAAAA,QAAQ,EAAE,kBAAAC,EAAE,EAAI;AACZ,cAAMR,MAAM,GAAGC,KAAK,CAACC,OAAN,CAAc,KAAI,CAACX,KAAL,CAAWQ,KAAzB,IAAkC,KAAI,CAACR,KAAL,CAAWQ,KAA7C,GAAqD,EAApE;AACA,iBAAOC,MAAM,CAACS,QAAP,CAAgBD,EAAhB,CAAP;AACH;AAjBgB,OAApB,CAZL,EAgCKd,UAAU,CAACC,OAAX,KAAuB,KAAvB,iBACG,oBAAC,kBAAD;AAAoB,QAAA,KAAK;AAAzB,SAA2BD,UAAU,CAACE,OAAtC,CAjCR,EAoCKF,UAAU,CAACC,OAAX,KAAuB,KAAvB,IAAgCH,WAAhC,iBACG,oBAAC,kBAAD,QAAqBA,WAArB,CArCR,CADJ;AA0CH;;;;EA9CuBL,KAAK,CAACuB,S;;AAiDlC,eAAepB,aAAf","sourcesContent":["import React from \"react\";\nimport { FormComponentProps } from \"./../types\";\nimport { webinyCheckboxTitle } from \"./Checkbox.styles\";\nimport { FormElementMessage } from \"../FormElementMessage\";\n\ninterface ChildrenRenderProp {\n    onChange: (id: string | number) => () => void;\n    getValue: (id: string | number) => boolean;\n}\n\ntype Props = FormComponentProps & {\n    // Form element's label.\n    label?: string;\n\n    // Form element's description.\n    description?: string;\n\n    // An array of Checkbox components.\n    children: (props: ChildrenRenderProp) => React.ReactNode;\n};\n\nclass CheckboxGroup extends React.Component<Props> {\n    public override render() {\n        const { description, label, validation = { isValid: null, message: null } } = this.props;\n\n        return (\n            <React.Fragment>\n                {label && (\n                    <div\n                        className={\n                            \"mdc-text-field-helper-text mdc-text-field-helper-text--persistent \" +\n                            webinyCheckboxTitle\n                        }\n                    >\n                        {label}\n                    </div>\n                )}\n\n                {this.props.children({\n                    onChange: value => {\n                        return () => {\n                            const values = Array.isArray(this.props.value) ? this.props.value : [];\n                            const index = values.indexOf(value);\n                            if (index > -1) {\n                                values.splice(index, 1);\n                            } else {\n                                values.push(value);\n                            }\n\n                            this.props.onChange && this.props.onChange(values);\n                        };\n                    },\n                    getValue: id => {\n                        const values = Array.isArray(this.props.value) ? this.props.value : [];\n                        return values.includes(id);\n                    }\n                })}\n\n                {validation.isValid === false && (\n                    <FormElementMessage error>{validation.message}</FormElementMessage>\n                )}\n\n                {validation.isValid !== false && description && (\n                    <FormElementMessage>{description}</FormElementMessage>\n                )}\n            </React.Fragment>\n        );\n    }\n}\n\nexport default CheckboxGroup;\n"]}

package/Checkbox/CheckboxGroup.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 { withKnobs, boolean } from "@storybook/addon-knobs";

package/Checkbox/CheckboxGroup.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["CheckboxGroup.stories.tsx"],"names":["React","storiesOf","Story","StoryReadme","StorySandboxCode","StorySandbox","StorySandboxExample","withKnobs","boolean","readme","Form","Checkbox","CheckboxGroup","story","module","addDecorator","add","disabled","options","id","name","fruits","Bind","onChange","getValue","map","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,SAAT,EAAoBC,OAApB,QAAmC,wBAAnC;AACA,OAAOC,MAAP;AAEA,SAASC,IAAT,QAAqB,cAArB;AACA,SAASC,QAAT,EAAmBC,aAAnB,QAAwC,GAAxC;AAEA,IAAMC,KAAK,GAAGZ,SAAS,CAAC,qBAAD,EAAwBa,MAAxB,CAAvB;AACAD,KAAK,CAACE,YAAN,CAAmBR,SAAnB;AAEAM,KAAK,CAACG,GAAN,CACI,eADJ,EAEI,YAAM;AACF,MAAMC,QAAQ,GAAGT,OAAO,CAAC,UAAD,EAAa,KAAb,CAAxB;AAEA,MAAMU,OAAO,GAAG,CACZ;AAAEC,IAAAA,EAAE,EAAE,OAAN;AAAeC,IAAAA,IAAI,EAAE;AAArB,GADY,EAEZ;AAAED,IAAAA,EAAE,EAAE,MAAN;AAAcC,IAAAA,IAAI,EAAE;AAApB,GAFY,EAGZ;AAAED,IAAAA,EAAE,EAAE,QAAN;AAAgBC,IAAAA,IAAI,EAAE;AAAtB,GAHY,CAAhB;AAMA,sBACI,oBAAC,KAAD,qBACI,oBAAC,WAAD,QAAcX,MAAd,CADJ,eAEI,oBAAC,YAAD,qBACI,oBAAC,mBAAD;AAAqB,IAAA,KAAK,EAAE;AAA5B,kBACI,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAE;AAAEY,MAAAA,MAAM,EAAE,CAAC,MAAD;AAAV;AAAZ,KACK;AAAA,QAAGC,IAAH,QAAGA,IAAH;AAAA,wBACG,oBAAC,IAAD;AAAM,MAAA,IAAI,EAAC;AAAX,oBACI,oBAAC,aAAD;AACI,MAAA,KAAK,EAAC,kBADV;AAEI,MAAA,WAAW,EAAE;AAFjB,OAIK;AAAA,UAAGC,QAAH,SAAGA,QAAH;AAAA,UAAaC,QAAb,SAAaA,QAAb;AAAA,0BACG,oBAAC,KAAD,CAAO,QAAP,QACKN,OAAO,CAACO,GAAR,CAAY;AAAA,YAAGN,EAAH,SAAGA,EAAH;AAAA,YAAOC,IAAP,SAAOA,IAAP;AAAA,4BACT,oBAAC,QAAD;AACI,UAAA,QAAQ,EAAEH,QADd;AAEI,UAAA,GAAG,EAAEE,EAFT;AAGI,UAAA,KAAK,EAAEC,IAHX;AAII,UAAA,KAAK,EAAEI,QAAQ,CAACL,EAAD,CAJnB;AAKI,UAAA,QAAQ,EAAEI,QAAQ,CAACJ,EAAD;AALtB,UADS;AAAA,OAAZ,CADL,CADH;AAAA,KAJL,CADJ,CADH;AAAA,GADL,CADJ,CADJ,eA2BI,oBAAC,gBAAD,01CA3BJ,CAFJ,CADJ;AA6DH,CAxEL,EAyEI;AAAEO,EAAAA,IAAI,EAAE;AAAEC,IAAAA,UAAU,EAAE,CAACf,aAAD;AAAd;AAAR,CAzEJ","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 { withKnobs, boolean } from \"@storybook/addon-knobs\";\nimport readme from \"./README_CheckboxGroup.md\";\n\nimport { Form } from \"@webiny/form\";\nimport { Checkbox, CheckboxGroup } from \".\";\n\nconst story = storiesOf(\"Components/Checkbox\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n    \"usage - group\",\n    () => {\n        const disabled = boolean(\"Disabled\", false);\n\n        const options = [\n            { id: \"apple\", name: \"Apple\" },\n            { id: \"pear\", name: \"Pear\" },\n            { id: \"orange\", name: \"Orange\" }\n        ];\n\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox>\n                    <StorySandboxExample title={\"Simple checkbox with label and description\"}>\n                        <Form data={{ fruits: [\"pear\"] }}>\n                            {({ Bind }) => (\n                                <Bind name=\"fruits\">\n                                    <CheckboxGroup\n                                        label=\"Fruits selection\"\n                                        description={\"Choose only fruits you like.\"}\n                                    >\n                                        {({ onChange, getValue }) => (\n                                            <React.Fragment>\n                                                {options.map(({ id, name }) => (\n                                                    <Checkbox\n                                                        disabled={disabled}\n                                                        key={id}\n                                                        label={name}\n                                                        value={getValue(id)}\n                                                        onChange={onChange(id)}\n                                                    />\n                                                ))}\n                                            </React.Fragment>\n                                        )}\n                                    </CheckboxGroup>\n                                </Bind>\n                            )}\n                        </Form>\n                    </StorySandboxExample>\n                    <StorySandboxCode>\n                        {`\n                     <Form data={{fruits: ['pear']}}>\n                        {({ Bind }) => (\n                            <Bind name=\"fruits\">\n                                <CheckboxGroup\n                                    label=\"Fruits selection\"\n                                    description={\"Choose only fruits you like.\"}\n                                >\n                                    {({ onChange, getValue }) => (\n                                        <React.Fragment>\n                                            {options.map(({id, name}) => (\n                                                <Checkbox\n                                                    disabled={disabled}\n                                                    key={id}\n                                                    label={name}\n                                                    value={getValue(id)}\n                                                    onChange={onChange(id)}\n                                                />\n                                            ))}\n                                        </React.Fragment>\n                                    )}\n                                </CheckboxGroup>\n                            </Bind>\n                        )}\n                    </Form>\n                    `}\n                    </StorySandboxCode>\n                </StorySandbox>\n            </Story>\n        );\n    },\n    { info: { propTables: [CheckboxGroup] } }\n);\n"]}

package/Checkbox/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":["default","Checkbox","CheckboxGroup"],"mappings":"AAAA,SAASA,OAAO,IAAIC,QAApB;AACA,SAASD,OAAO,IAAIE,aAApB","sourcesContent":["export { default as Checkbox } from \"./Checkbox\";\nexport { default as CheckboxGroup } from \"./CheckboxGroup\";\n"]}

package/Chips/Chip.d.ts

@@ -1,9 +1,4 @@
-import * as React from "react";
+import React from "react";
 import { ChipProps as RmwcChipProps } from "@rmwc/chip";
-export declare type ChipProps = RmwcChipProps & {
-    /**
-     * Chip content
-     */
-    children?: React.ReactNode;
-};
-export declare const Chip: (props: ChipProps) => JSX.Element;
+export declare type ChipProps = RmwcChipProps;
+export declare const Chip: React.FC<ChipProps>;

package/Chips/Chip.js

@@ -1,6 +1,6 @@
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["children"];
-import * as React from "react";
+import React from "react";
 import { Chip as RmwcChip } from "@rmwc/chip";
 export var Chip = function Chip(props) {
   var children = props.children,