@webiny/ui 5.34.8 → 5.35.0-beta.0

package/Mosaic/Mosaic.js.map

@@ -1 +1 @@
-{"version":3,"names":["Mosaic","children","columns","className","defaultProps"],"sources":["Mosaic.tsx"],"sourcesContent":["import React from \"react\";\n/**\n * Package react-columned does not have types.\n */\n// @ts-ignore\nimport Columned from \"react-columned\";\n\nexport interface MosaicProps {\n    // Number of columns, per max screen size, eg. { \"320\": 1, \"480\": 2, \"800\": 3, \"1366\": 4 }.\n    columns?: {\n        [key: string]: number;\n    };\n\n    // Custom class for the mosaic container.\n    className?: string;\n}\n\nconst Mosaic: React.FC<MosaicProps> = ({ children, columns, className }) => {\n    return (\n        <Columned columns={columns} className={className}>\n            {children}\n        </Columned>\n    );\n};\n\nMosaic.defaultProps = {\n    columns: { 320: 1, 480: 2, 800: 3, 1366: 4 }\n};\n\nexport { Mosaic };\n"],"mappings":";;;;;;;;;AAAA;;AAKA;;AAJA;AACA;AACA;AACA;AAaA,IAAMA,MAA6B,GAAG,SAAhCA,MAAgC,OAAsC;EAAA,IAAnCC,QAAmC,QAAnCA,QAAmC;EAAA,IAAzBC,OAAyB,QAAzBA,OAAyB;EAAA,IAAhBC,SAAgB,QAAhBA,SAAgB;EACxE,oBACI,6BAAC,sBAAD;IAAU,OAAO,EAAED,OAAnB;IAA4B,SAAS,EAAEC;EAAvC,GACKF,QADL,CADJ;AAKH,CAND;;;AAQAD,MAAM,CAACI,YAAP,GAAsB;EAClBF,OAAO,EAAE;IAAE,KAAK,CAAP;IAAU,KAAK,CAAf;IAAkB,KAAK,CAAvB;IAA0B,MAAM;EAAhC;AADS,CAAtB"}
+{"version":3,"names":["Mosaic","children","columns","className","defaultProps"],"sources":["Mosaic.tsx"],"sourcesContent":["import React from \"react\";\n/**\n * Package react-columned does not have types.\n */\n// @ts-ignore\nimport Columned from \"react-columned\";\n\nexport interface MosaicProps {\n    // Number of columns, per max screen size, eg. { \"320\": 1, \"480\": 2, \"800\": 3, \"1366\": 4 }.\n    columns?: {\n        [key: string]: number;\n    };\n\n    // Custom class for the mosaic container.\n    className?: string;\n}\n\nconst Mosaic: React.FC<MosaicProps> = ({ children, columns, className }) => {\n    return (\n        <Columned columns={columns} className={className}>\n            {children}\n        </Columned>\n    );\n};\n\nMosaic.defaultProps = {\n    columns: { 320: 1, 480: 2, 800: 3, 1366: 4 }\n};\n\nexport { Mosaic };\n"],"mappings":";;;;;;;AAAA;AAKA;AAJA;AACA;AACA;AACA;;AAaA,IAAMA,MAA6B,GAAG,SAAhCA,MAA6B,OAAyC;EAAA,IAAnCC,QAAQ,QAARA,QAAQ;IAAEC,OAAO,QAAPA,OAAO;IAAEC,SAAS,QAATA,SAAS;EACjE,oBACI,6BAAC,sBAAQ;IAAC,OAAO,EAAED,OAAQ;IAAC,SAAS,EAAEC;EAAU,GAC5CF,QAAQ,CACF;AAEnB,CAAC;AAAC;AAEFD,MAAM,CAACI,YAAY,GAAG;EAClBF,OAAO,EAAE;IAAE,GAAG,EAAE,CAAC;IAAE,GAAG,EAAE,CAAC;IAAE,GAAG,EAAE,CAAC;IAAE,IAAI,EAAE;EAAE;AAC/C,CAAC"}

package/Mosaic/Mosaic.stories.js

@@ -1,17 +1,11 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _react2 = require("@storybook/react");
-
 var _Story = require("@webiny/storybook-utils/Story");
-
 var _README = _interopRequireDefault(require("./../Mosaic/README.md"));
-
 var _Mosaic = require("./Mosaic");
-
 var story = (0, _react2.storiesOf)("Components/Mosaic", module);
 story.add("usage", function () {
   return /*#__PURE__*/_react.default.createElement(_Story.Story, null, /*#__PURE__*/_react.default.createElement(_Story.StoryReadme, null, _README.default), /*#__PURE__*/_react.default.createElement(_Story.StorySandbox, {

package/Mosaic/Mosaic.stories.js.map

@@ -1 +1 @@
-{"version":3,"names":["story","storiesOf","module","add","readme","info","propTables","Mosaic"],"sources":["Mosaic.stories.tsx"],"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 \"./../Mosaic/README.md\";\n\nimport { Mosaic } from \"./Mosaic\";\n\nconst story = storiesOf(\"Components/Mosaic\", module);\n\nstory.add(\n    \"usage\",\n    () => {\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox title={\"A simple responsive mosaic.\"}>\n                    <StorySandboxExample>\n                        <Mosaic>\n                            <img\n                                alt=\"Image 1\"\n                                src={\"https://via.placeholder.com/800x600/001F3F/FFFFFF.png?text=1\"}\n                            />\n                            <img\n                                alt=\"Image 2\"\n                                src={\"https://via.placeholder.com/400x300/0074D9/FFFFFF.png?text=2\"}\n                            />\n                            <img\n                                alt=\"Image 3\"\n                                src={\n                                    \"https://via.placeholder.com/1024x768/7FDBFF/FFFFFF.png?text=3\"\n                                }\n                            />\n                            <img\n                                alt=\"Image 4\"\n                                src={\n                                    \"https://via.placeholder.com/1280x1024/39CCCC/FFFFFF.png?text=4\"\n                                }\n                            />\n                            <img\n                                alt=\"Image 5\"\n                                src={\"https://via.placeholder.com/640x480/3D9970/FFFFFF.png?text=5\"}\n                            />\n                            <img\n                                alt=\"Image 6\"\n                                src={\n                                    \"https://via.placeholder.com/1000x500/2ECC40/FFFFFF.png?text=6\"\n                                }\n                            />\n                            <img\n                                alt=\"Image 7\"\n                                src={\n                                    \"https://via.placeholder.com/700x1000/01FF70/FFFFFF.png?text=7\"\n                                }\n                            />\n                            <img\n                                alt=\"Image 8\"\n                                src={\"https://via.placeholder.com/800x600/FFDC00/FFFFFF.png?text=8\"}\n                            />\n                            <img\n                                alt=\"Image 9\"\n                                src={\"https://via.placeholder.com/200x100/FF851B/FFFFFF.png?text=9\"}\n                            />\n                            <img\n                                alt=\"Image 10\"\n                                src={\n                                    \"https://via.placeholder.com/200x100/FF4136/FFFFFF.png?text=10\"\n                                }\n                            />\n                        </Mosaic>\n                    </StorySandboxExample>\n                    <StorySandboxCode>\n                        <Mosaic>\n                            <img alt=\"Image 1\" src={\"https://...\"} />\n                            <img alt=\"Image 2\" src={\"https://...\"} />\n                            <img alt=\"Image 3\" src={\"https://...\"} />\n                            <img alt=\"Image 4\" src={\"https://...\"} />\n                            <img alt=\"Image 5\" src={\"https://...\"} />\n                            <img alt=\"Image 6\" src={\"https://...\"} />\n                            <img alt=\"Image 7\" src={\"https://...\"} />\n                            <img alt=\"Image 8\" src={\"https://...\"} />\n                            <img alt=\"Image 9\" src={\"https://...\"} />\n                            <img alt=\"Image 10\" src={\"https://...\"} />\n                        </Mosaic>\n                    </StorySandboxCode>\n                </StorySandbox>\n            </Story>\n        );\n    },\n    { info: { propTables: [Mosaic] } }\n);\n"],"mappings":";;;;AAAA;;AACA;;AACA;;AAOA;;AAEA;;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAA,EAAU,mBAAV,EAA+BC,MAA/B,CAAd;AAEAF,KAAK,CAACG,GAAN,CACI,OADJ,EAEI,YAAM;EACF,oBACI,6BAAC,YAAD,qBACI,6BAAC,kBAAD,QAAcC,eAAd,CADJ,eAEI,6BAAC,mBAAD;IAAc,KAAK,EAAE;EAArB,gBACI,6BAAC,0BAAD,qBACI,6BAAC,cAAD,qBACI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EAAE;EAFT,EADJ,eAKI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EAAE;EAFT,EALJ,eASI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EACC;EAHR,EATJ,eAeI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EACC;EAHR,EAfJ,eAqBI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EAAE;EAFT,EArBJ,eAyBI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EACC;EAHR,EAzBJ,eA+BI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EACC;EAHR,EA/BJ,eAqCI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EAAE;EAFT,EArCJ,eAyCI;IACI,GAAG,EAAC,SADR;IAEI,GAAG,EAAE;EAFT,EAzCJ,eA6CI;IACI,GAAG,EAAC,UADR;IAEI,GAAG,EACC;EAHR,EA7CJ,CADJ,CADJ,eAuDI,6BAAC,uBAAD,qBACI,6BAAC,cAAD,qBACI;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EADJ,eAEI;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EAFJ,eAGI;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EAHJ,eAII;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EAJJ,eAKI;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EALJ,eAMI;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EANJ,eAOI;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EAPJ,eAQI;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EARJ,eASI;IAAK,GAAG,EAAC,SAAT;IAAmB,GAAG,EAAE;EAAxB,EATJ,eAUI;IAAK,GAAG,EAAC,UAAT;IAAoB,GAAG,EAAE;EAAzB,EAVJ,CADJ,CAvDJ,CAFJ,CADJ;AA2EH,CA9EL,EA+EI;EAAEC,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,cAAD;EAAd;AAAR,CA/EJ"}
+{"version":3,"names":["story","storiesOf","module","add","readme","info","propTables","Mosaic"],"sources":["Mosaic.stories.tsx"],"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 \"./../Mosaic/README.md\";\n\nimport { Mosaic } from \"./Mosaic\";\n\nconst story = storiesOf(\"Components/Mosaic\", module);\n\nstory.add(\n    \"usage\",\n    () => {\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox title={\"A simple responsive mosaic.\"}>\n                    <StorySandboxExample>\n                        <Mosaic>\n                            <img\n                                alt=\"Image 1\"\n                                src={\"https://via.placeholder.com/800x600/001F3F/FFFFFF.png?text=1\"}\n                            />\n                            <img\n                                alt=\"Image 2\"\n                                src={\"https://via.placeholder.com/400x300/0074D9/FFFFFF.png?text=2\"}\n                            />\n                            <img\n                                alt=\"Image 3\"\n                                src={\n                                    \"https://via.placeholder.com/1024x768/7FDBFF/FFFFFF.png?text=3\"\n                                }\n                            />\n                            <img\n                                alt=\"Image 4\"\n                                src={\n                                    \"https://via.placeholder.com/1280x1024/39CCCC/FFFFFF.png?text=4\"\n                                }\n                            />\n                            <img\n                                alt=\"Image 5\"\n                                src={\"https://via.placeholder.com/640x480/3D9970/FFFFFF.png?text=5\"}\n                            />\n                            <img\n                                alt=\"Image 6\"\n                                src={\n                                    \"https://via.placeholder.com/1000x500/2ECC40/FFFFFF.png?text=6\"\n                                }\n                            />\n                            <img\n                                alt=\"Image 7\"\n                                src={\n                                    \"https://via.placeholder.com/700x1000/01FF70/FFFFFF.png?text=7\"\n                                }\n                            />\n                            <img\n                                alt=\"Image 8\"\n                                src={\"https://via.placeholder.com/800x600/FFDC00/FFFFFF.png?text=8\"}\n                            />\n                            <img\n                                alt=\"Image 9\"\n                                src={\"https://via.placeholder.com/200x100/FF851B/FFFFFF.png?text=9\"}\n                            />\n                            <img\n                                alt=\"Image 10\"\n                                src={\n                                    \"https://via.placeholder.com/200x100/FF4136/FFFFFF.png?text=10\"\n                                }\n                            />\n                        </Mosaic>\n                    </StorySandboxExample>\n                    <StorySandboxCode>\n                        <Mosaic>\n                            <img alt=\"Image 1\" src={\"https://...\"} />\n                            <img alt=\"Image 2\" src={\"https://...\"} />\n                            <img alt=\"Image 3\" src={\"https://...\"} />\n                            <img alt=\"Image 4\" src={\"https://...\"} />\n                            <img alt=\"Image 5\" src={\"https://...\"} />\n                            <img alt=\"Image 6\" src={\"https://...\"} />\n                            <img alt=\"Image 7\" src={\"https://...\"} />\n                            <img alt=\"Image 8\" src={\"https://...\"} />\n                            <img alt=\"Image 9\" src={\"https://...\"} />\n                            <img alt=\"Image 10\" src={\"https://...\"} />\n                        </Mosaic>\n                    </StorySandboxCode>\n                </StorySandbox>\n            </Story>\n        );\n    },\n    { info: { propTables: [Mosaic] } }\n);\n"],"mappings":";;;AAAA;AACA;AACA;AAOA;AAEA;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAS,EAAC,mBAAmB,EAAEC,MAAM,CAAC;AAEpDF,KAAK,CAACG,GAAG,CACL,OAAO,EACP,YAAM;EACF,oBACI,6BAAC,YAAK,qBACF,6BAAC,kBAAW,QAAEC,eAAM,CAAe,eACnC,6BAAC,mBAAY;IAAC,KAAK,EAAE;EAA8B,gBAC/C,6BAAC,0BAAmB,qBAChB,6BAAC,cAAM,qBACH;IACI,GAAG,EAAC,SAAS;IACb,GAAG,EAAE;EAA+D,EACtE,eACF;IACI,GAAG,EAAC,SAAS;IACb,GAAG,EAAE;EAA+D,EACtE,eACF;IACI,GAAG,EAAC,SAAS;IACb,GAAG,EACC;EACH,EACH,eACF;IACI,GAAG,EAAC,SAAS;IACb,GAAG,EACC;EACH,EACH,eACF;IACI,GAAG,EAAC,SAAS;IACb,GAAG,EAAE;EAA+D,EACtE,eACF;IACI,GAAG,EAAC,SAAS;IACb,GAAG,EACC;EACH,EACH,eACF;IACI,GAAG,EAAC,SAAS;IACb,GAAG,EACC;EACH,EACH,eACF;IACI,GAAG,EAAC,SAAS;IACb,GAAG,EAAE;EAA+D,EACtE,eACF;IACI,GAAG,EAAC,SAAS;IACb,GAAG,EAAE;EAA+D,EACtE,eACF;IACI,GAAG,EAAC,UAAU;IACd,GAAG,EACC;EACH,EACH,CACG,CACS,eACtB,6BAAC,uBAAgB,qBACb,6BAAC,cAAM,qBACH;IAAK,GAAG,EAAC,SAAS;IAAC,GAAG,EAAE;EAAc,EAAG,eACzC;IAAK,GAAG,EAAC,SAAS;IAAC,GAAG,EAAE;EAAc,EAAG,eACzC;IAAK,GAAG,EAAC,SAAS;IAAC,GAAG,EAAE;EAAc,EAAG,eACzC;IAAK,GAAG,EAAC,SAAS;IAAC,GAAG,EAAE;EAAc,EAAG,eACzC;IAAK,GAAG,EAAC,SAAS;IAAC,GAAG,EAAE;EAAc,EAAG,eACzC;IAAK,GAAG,EAAC,SAAS;IAAC,GAAG,EAAE;EAAc,EAAG,eACzC;IAAK,GAAG,EAAC,SAAS;IAAC,GAAG,EAAE;EAAc,EAAG,eACzC;IAAK,GAAG,EAAC,SAAS;IAAC,GAAG,EAAE;EAAc,EAAG,eACzC;IAAK,GAAG,EAAC,SAAS;IAAC,GAAG,EAAE;EAAc,EAAG,eACzC;IAAK,GAAG,EAAC,UAAU;IAAC,GAAG,EAAE;EAAc,EAAG,CACrC,CACM,CACR,CACX;AAEhB,CAAC,EACD;EAAEC,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,cAAM;EAAE;AAAE,CAAC,CACrC"}

package/Mosaic/index.js

@@ -3,9 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
 var _Mosaic = require("./Mosaic");
-
 Object.keys(_Mosaic).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _Mosaic[key]) return;

package/Mosaic/index.js.map

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

package/Progress/CircularProgress.js

@@ -1,21 +1,16 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _styled = _interopRequireDefault(require("@emotion/styled"));
-
 var _reactSpinnerMaterial = _interopRequireDefault(require("react-spinner-material"));
-
 var _Typography = require("../Typography");
-
 // This is just to center the spinner
+
 var SpinnerWrapper = /*#__PURE__*/(0, _styled.default)("div", {
   target: "e1s1fi5k0",
   label: "SpinnerWrapper"
@@ -45,18 +40,16 @@ var Label = /*#__PURE__*/(0, _styled.default)("div", {
 })({
   marginTop: 15
 });
-
 var CircularProgress = function CircularProgress(props) {
   var label = props.label,
-      size = props.size,
-      spinnerWidth = props.spinnerWidth,
-      spinnerColor = props.spinnerColor,
-      visible = props.visible,
-      style = props.style;
+    size = props.size,
+    spinnerWidth = props.spinnerWidth,
+    spinnerColor = props.spinnerColor,
+    visible = props.visible,
+    style = props.style;
   /**
    * We can safely cast because we have default props
    */
-
   return /*#__PURE__*/_react.default.createElement(SpinnerWrapper, {
     style: style
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -70,7 +63,6 @@ var CircularProgress = function CircularProgress(props) {
     use: "overline"
   }, label))));
 };
-
 CircularProgress.defaultProps = {
   size: 45,
   spinnerColor: "var(--mdc-theme-primary)",

package/Progress/CircularProgress.js.map

@@ -1 +1 @@
-{"version":3,"names":["SpinnerWrapper","styled","width","height","position","background","opacity","top","left","zIndex","transform","display","flexDirection","justifyContent","alignItems","Label","marginTop","CircularProgress","props","label","size","spinnerWidth","spinnerColor","visible","style","defaultProps"],"sources":["CircularProgress.tsx"],"sourcesContent":["// This is just to center the spinner\nimport React from \"react\";\nimport styled from \"@emotion/styled\";\nimport Spinner from \"react-spinner-material\";\nimport { Typography } from \"../Typography\";\n\ninterface CircularProgressProps {\n    label?: React.ReactNode;\n    size?: number;\n    spinnerColor?: string;\n    spinnerWidth?: number;\n    visible?: boolean;\n    style?: React.CSSProperties;\n}\n\nconst SpinnerWrapper = styled(\"div\")({\n    width: \"100%\",\n    height: \"100%\",\n    position: \"absolute\",\n    background: \"var(--mdc-theme-surface)\",\n    opacity: 0.92,\n    top: 0,\n    left: 0,\n    zIndex: 3,\n    \"& .spinner__inner-wrapper\": {\n        position: \"absolute\",\n        top: \"50%\",\n        left: \"50%\",\n        transform: \"translate(-50%, -50%)\",\n        display: \"flex\",\n        flexDirection: \"column\",\n        justifyContent: \"center\",\n        alignItems: \"center\"\n    }\n});\n\nconst Label = styled(\"div\")({\n    marginTop: 15\n});\n\nconst CircularProgress: React.FC<CircularProgressProps> = props => {\n    const { label, size, spinnerWidth, spinnerColor, visible, style } = props;\n    /**\n     * We can safely cast because we have default props\n     */\n    return (\n        <SpinnerWrapper style={style}>\n            <div className={\"spinner__inner-wrapper\"}>\n                <Spinner\n                    size={size as number}\n                    spinnerColor={spinnerColor as string}\n                    spinnerWidth={spinnerWidth as number}\n                    visible={visible as boolean}\n                />\n                {label && (\n                    <Label>\n                        <Typography use={\"overline\"}>{label}</Typography>\n                    </Label>\n                )}\n            </div>\n        </SpinnerWrapper>\n    );\n};\n\nCircularProgress.defaultProps = {\n    size: 45,\n    spinnerColor: \"var(--mdc-theme-primary)\",\n    spinnerWidth: 4,\n    visible: true\n};\n\nexport default CircularProgress;\n"],"mappings":";;;;;;;;;AACA;;AACA;;AACA;;AACA;;AAJA;AAeA,IAAMA,cAAc,oBAAGC,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EACjCC,KAAK,EAAE,MAD0B;EAEjCC,MAAM,EAAE,MAFyB;EAGjCC,QAAQ,EAAE,UAHuB;EAIjCC,UAAU,EAAE,0BAJqB;EAKjCC,OAAO,EAAE,IALwB;EAMjCC,GAAG,EAAE,CAN4B;EAOjCC,IAAI,EAAE,CAP2B;EAQjCC,MAAM,EAAE,CARyB;EASjC,6BAA6B;IACzBL,QAAQ,EAAE,UADe;IAEzBG,GAAG,EAAE,KAFoB;IAGzBC,IAAI,EAAE,KAHmB;IAIzBE,SAAS,EAAE,uBAJc;IAKzBC,OAAO,EAAE,MALgB;IAMzBC,aAAa,EAAE,QANU;IAOzBC,cAAc,EAAE,QAPS;IAQzBC,UAAU,EAAE;EARa;AATI,CAAjB,CAApB;AAqBA,IAAMC,KAAK,oBAAGd,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EACxBe,SAAS,EAAE;AADa,CAAjB,CAAX;;AAIA,IAAMC,gBAAiD,GAAG,SAApDA,gBAAoD,CAAAC,KAAK,EAAI;EAC/D,IAAQC,KAAR,GAAoED,KAApE,CAAQC,KAAR;EAAA,IAAeC,IAAf,GAAoEF,KAApE,CAAeE,IAAf;EAAA,IAAqBC,YAArB,GAAoEH,KAApE,CAAqBG,YAArB;EAAA,IAAmCC,YAAnC,GAAoEJ,KAApE,CAAmCI,YAAnC;EAAA,IAAiDC,OAAjD,GAAoEL,KAApE,CAAiDK,OAAjD;EAAA,IAA0DC,KAA1D,GAAoEN,KAApE,CAA0DM,KAA1D;EACA;AACJ;AACA;;EACI,oBACI,6BAAC,cAAD;IAAgB,KAAK,EAAEA;EAAvB,gBACI;IAAK,SAAS,EAAE;EAAhB,gBACI,6BAAC,6BAAD;IACI,IAAI,EAAEJ,IADV;IAEI,YAAY,EAAEE,YAFlB;IAGI,YAAY,EAAED,YAHlB;IAII,OAAO,EAAEE;EAJb,EADJ,EAOKJ,KAAK,iBACF,6BAAC,KAAD,qBACI,6BAAC,sBAAD;IAAY,GAAG,EAAE;EAAjB,GAA8BA,KAA9B,CADJ,CARR,CADJ,CADJ;AAiBH,CAtBD;;AAwBAF,gBAAgB,CAACQ,YAAjB,GAAgC;EAC5BL,IAAI,EAAE,EADsB;EAE5BE,YAAY,EAAE,0BAFc;EAG5BD,YAAY,EAAE,CAHc;EAI5BE,OAAO,EAAE;AAJmB,CAAhC;eAOeN,gB"}
+{"version":3,"names":["SpinnerWrapper","styled","width","height","position","background","opacity","top","left","zIndex","transform","display","flexDirection","justifyContent","alignItems","Label","marginTop","CircularProgress","props","label","size","spinnerWidth","spinnerColor","visible","style","defaultProps"],"sources":["CircularProgress.tsx"],"sourcesContent":["// This is just to center the spinner\nimport React from \"react\";\nimport styled from \"@emotion/styled\";\nimport Spinner from \"react-spinner-material\";\nimport { Typography } from \"../Typography\";\n\ninterface CircularProgressProps {\n    label?: React.ReactNode;\n    size?: number;\n    spinnerColor?: string;\n    spinnerWidth?: number;\n    visible?: boolean;\n    style?: React.CSSProperties;\n}\n\nconst SpinnerWrapper = styled(\"div\")({\n    width: \"100%\",\n    height: \"100%\",\n    position: \"absolute\",\n    background: \"var(--mdc-theme-surface)\",\n    opacity: 0.92,\n    top: 0,\n    left: 0,\n    zIndex: 3,\n    \"& .spinner__inner-wrapper\": {\n        position: \"absolute\",\n        top: \"50%\",\n        left: \"50%\",\n        transform: \"translate(-50%, -50%)\",\n        display: \"flex\",\n        flexDirection: \"column\",\n        justifyContent: \"center\",\n        alignItems: \"center\"\n    }\n});\n\nconst Label = styled(\"div\")({\n    marginTop: 15\n});\n\nconst CircularProgress: React.FC<CircularProgressProps> = props => {\n    const { label, size, spinnerWidth, spinnerColor, visible, style } = props;\n    /**\n     * We can safely cast because we have default props\n     */\n    return (\n        <SpinnerWrapper style={style}>\n            <div className={\"spinner__inner-wrapper\"}>\n                <Spinner\n                    size={size as number}\n                    spinnerColor={spinnerColor as string}\n                    spinnerWidth={spinnerWidth as number}\n                    visible={visible as boolean}\n                />\n                {label && (\n                    <Label>\n                        <Typography use={\"overline\"}>{label}</Typography>\n                    </Label>\n                )}\n            </div>\n        </SpinnerWrapper>\n    );\n};\n\nCircularProgress.defaultProps = {\n    size: 45,\n    spinnerColor: \"var(--mdc-theme-primary)\",\n    spinnerWidth: 4,\n    visible: true\n};\n\nexport default CircularProgress;\n"],"mappings":";;;;;;;AACA;AACA;AACA;AACA;AAJA;;AAeA,IAAMA,cAAc,oBAAGC,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,GAAE;EACjCC,KAAK,EAAE,MAAM;EACbC,MAAM,EAAE,MAAM;EACdC,QAAQ,EAAE,UAAU;EACpBC,UAAU,EAAE,0BAA0B;EACtCC,OAAO,EAAE,IAAI;EACbC,GAAG,EAAE,CAAC;EACNC,IAAI,EAAE,CAAC;EACPC,MAAM,EAAE,CAAC;EACT,2BAA2B,EAAE;IACzBL,QAAQ,EAAE,UAAU;IACpBG,GAAG,EAAE,KAAK;IACVC,IAAI,EAAE,KAAK;IACXE,SAAS,EAAE,uBAAuB;IAClCC,OAAO,EAAE,MAAM;IACfC,aAAa,EAAE,QAAQ;IACvBC,cAAc,EAAE,QAAQ;IACxBC,UAAU,EAAE;EAChB;AACJ,CAAC,CAAC;AAEF,IAAMC,KAAK,oBAAGd,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,GAAE;EACxBe,SAAS,EAAE;AACf,CAAC,CAAC;AAEF,IAAMC,gBAAiD,GAAG,SAApDA,gBAAiD,CAAGC,KAAK,EAAI;EAC/D,IAAQC,KAAK,GAAuDD,KAAK,CAAjEC,KAAK;IAAEC,IAAI,GAAiDF,KAAK,CAA1DE,IAAI;IAAEC,YAAY,GAAmCH,KAAK,CAApDG,YAAY;IAAEC,YAAY,GAAqBJ,KAAK,CAAtCI,YAAY;IAAEC,OAAO,GAAYL,KAAK,CAAxBK,OAAO;IAAEC,KAAK,GAAKN,KAAK,CAAfM,KAAK;EAC/D;AACJ;AACA;EACI,oBACI,6BAAC,cAAc;IAAC,KAAK,EAAEA;EAAM,gBACzB;IAAK,SAAS,EAAE;EAAyB,gBACrC,6BAAC,6BAAO;IACJ,IAAI,EAAEJ,IAAe;IACrB,YAAY,EAAEE,YAAuB;IACrC,YAAY,EAAED,YAAuB;IACrC,OAAO,EAAEE;EAAmB,EAC9B,EACDJ,KAAK,iBACF,6BAAC,KAAK,qBACF,6BAAC,sBAAU;IAAC,GAAG,EAAE;EAAW,GAAEA,KAAK,CAAc,CAExD,CACC,CACO;AAEzB,CAAC;AAEDF,gBAAgB,CAACQ,YAAY,GAAG;EAC5BL,IAAI,EAAE,EAAE;EACRE,YAAY,EAAE,0BAA0B;EACxCD,YAAY,EAAE,CAAC;EACfE,OAAO,EAAE;AACb,CAAC;AAAC,eAEaN,gBAAgB;AAAA"}

package/Progress/index.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -11,5 +10,4 @@ Object.defineProperty(exports, "CircularProgress", {
     return _CircularProgress.default;
   }
 });
-
 var _CircularProgress = _interopRequireDefault(require("./CircularProgress"));

package/Progress/index.js.map

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

package/Radio/Radio.js

@@ -1,73 +1,55 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
 var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
 var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _radio = require("@rmwc/radio");
-
 var _FormElementMessage = require("../FormElementMessage");
-
 /**
  * Wrap Radio components with RadioGroup to create a set of options.
  * Each Radio component must receive value and onChange callback via props.
  */
 var Radio = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2.default)(Radio, _React$Component);
-
   var _super = (0, _createSuper2.default)(Radio);
-
   function Radio() {
     var _this;
-
     (0, _classCallCheck2.default)(this, Radio);
-
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     _this = _super.call.apply(_super, [this].concat(args));
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onChange", function (e) {
       _this.props.onChange && _this.props.onChange(e.target.checked);
     });
     return _this;
   }
-
   (0, _createClass2.default)(Radio, [{
     key: "render",
     value: function render() {
       var _this$props = this.props,
-          value = _this$props.value,
-          label = _this$props.label,
-          disabled = _this$props.disabled,
-          description = _this$props.description,
-          validation = _this$props.validation;
-
+        value = _this$props.value,
+        label = _this$props.label,
+        disabled = _this$props.disabled,
+        description = _this$props.description,
+        validation = _this$props.validation;
       var _ref = validation || {},
-          validationIsValid = _ref.isValid,
-          validationMessage = _ref.message;
-
+        validationIsValid = _ref.isValid,
+        validationMessage = _ref.message;
       return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_radio.Radio, {
         disabled: disabled,
         checked: Boolean(value),
-        onChange: this.onChange // @ts-ignore Although the label is React.ReactNode internally, an error is still thrown.
+        onChange: this.onChange
+        // @ts-ignore Although the label is React.ReactNode internally, an error is still thrown.
         ,
         label: label
       }), validationIsValid === false && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, {
@@ -77,6 +59,5 @@ var Radio = /*#__PURE__*/function (_React$Component) {
   }]);
   return Radio;
 }(_react.default.Component);
-
 var _default = Radio;
 exports.default = _default;

package/Radio/Radio.js.map

@@ -1 +1 @@
-{"version":3,"names":["Radio","e","props","onChange","target","checked","value","label","disabled","description","validation","validationIsValid","isValid","validationMessage","message","Boolean","React","Component"],"sources":["Radio.tsx"],"sourcesContent":["import React from \"react\";\nimport { Radio as RmwcRadio } from \"@rmwc/radio\";\nimport { FormComponentProps } from \"~/types\";\nimport { FormElementMessage } from \"~/FormElementMessage\";\n\ntype Props = FormComponentProps & {\n    // Component label.\n    label?: React.ReactNode;\n\n    // Is radio disabled?\n    disabled?: boolean;\n\n    // Description beneath the radio.\n    description?: string;\n};\n\n/**\n * Wrap Radio components with RadioGroup to create a set of options.\n * Each Radio component must receive value and onChange callback via props.\n */\nclass Radio 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, description, validation } = this.props;\n\n        const { isValid: validationIsValid, message: validationMessage } = validation || {};\n\n        return (\n            <React.Fragment>\n                <RmwcRadio\n                    disabled={disabled}\n                    checked={Boolean(value)}\n                    onChange={this.onChange}\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 Radio;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AAEA;;AAaA;AACA;AACA;AACA;IACMA,K;;;;;;;;;;;;;;;2FACS,UAACC,CAAD,EAA+C;MACtD,MAAKC,KAAL,CAAWC,QAAX,IAAuB,MAAKD,KAAL,CAAWC,QAAX,CAAqBF,CAAC,CAACG,MAAH,CAAkBC,OAAtC,CAAvB;IACH,C;;;;;;WAED,kBAAyB;MACrB,kBAA4D,KAAKH,KAAjE;MAAA,IAAQI,KAAR,eAAQA,KAAR;MAAA,IAAeC,KAAf,eAAeA,KAAf;MAAA,IAAsBC,QAAtB,eAAsBA,QAAtB;MAAA,IAAgCC,WAAhC,eAAgCA,WAAhC;MAAA,IAA6CC,UAA7C,eAA6CA,UAA7C;;MAEA,WAAmEA,UAAU,IAAI,EAAjF;MAAA,IAAiBC,iBAAjB,QAAQC,OAAR;MAAA,IAA6CC,iBAA7C,QAAoCC,OAApC;;MAEA,oBACI,6BAAC,cAAD,CAAO,QAAP,qBACI,6BAAC,YAAD;QACI,QAAQ,EAAEN,QADd;QAEI,OAAO,EAAEO,OAAO,CAACT,KAAD,CAFpB;QAGI,QAAQ,EAAE,KAAKH,QAHnB,CAII;QAJJ;QAKI,KAAK,EAAEI;MALX,EADJ,EAQKI,iBAAiB,KAAK,KAAtB,iBACG,6BAAC,sCAAD;QAAoB,KAAK;MAAzB,GAA2BE,iBAA3B,CATR,EAYKF,iBAAiB,KAAK,KAAtB,IAA+BF,WAA/B,iBACG,6BAAC,sCAAD,QAAqBA,WAArB,CAbR,CADJ;IAkBH;;;EA5BeO,cAAA,CAAMC,S;;eA+BXjB,K"}
+{"version":3,"names":["Radio","e","props","onChange","target","checked","value","label","disabled","description","validation","validationIsValid","isValid","validationMessage","message","Boolean","React","Component"],"sources":["Radio.tsx"],"sourcesContent":["import React from \"react\";\nimport { Radio as RmwcRadio } from \"@rmwc/radio\";\nimport { FormComponentProps } from \"~/types\";\nimport { FormElementMessage } from \"~/FormElementMessage\";\n\ntype Props = FormComponentProps & {\n    // Component label.\n    label?: React.ReactNode;\n\n    // Is radio disabled?\n    disabled?: boolean;\n\n    // Description beneath the radio.\n    description?: string;\n};\n\n/**\n * Wrap Radio components with RadioGroup to create a set of options.\n * Each Radio component must receive value and onChange callback via props.\n */\nclass Radio 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, description, validation } = this.props;\n\n        const { isValid: validationIsValid, message: validationMessage } = validation || {};\n\n        return (\n            <React.Fragment>\n                <RmwcRadio\n                    disabled={disabled}\n                    checked={Boolean(value)}\n                    onChange={this.onChange}\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 Radio;\n"],"mappings":";;;;;;;;;;;;;AAAA;AACA;AAEA;AAaA;AACA;AACA;AACA;AAHA,IAIMA,KAAK;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;MAAA;IAAA;IAAA;IAAA,uFACI,UAACC,CAAyC,EAAK;MACtD,MAAKC,KAAK,CAACC,QAAQ,IAAI,MAAKD,KAAK,CAACC,QAAQ,CAAEF,CAAC,CAACG,MAAM,CAASC,OAAO,CAAC;IACzE,CAAC;IAAA;EAAA;EAAA;IAAA;IAAA,OAED,kBAAyB;MACrB,kBAA4D,IAAI,CAACH,KAAK;QAA9DI,KAAK,eAALA,KAAK;QAAEC,KAAK,eAALA,KAAK;QAAEC,QAAQ,eAARA,QAAQ;QAAEC,WAAW,eAAXA,WAAW;QAAEC,UAAU,eAAVA,UAAU;MAEvD,WAAmEA,UAAU,IAAI,CAAC,CAAC;QAAlEC,iBAAiB,QAA1BC,OAAO;QAA8BC,iBAAiB,QAA1BC,OAAO;MAE3C,oBACI,6BAAC,cAAK,CAAC,QAAQ,qBACX,6BAAC,YAAS;QACN,QAAQ,EAAEN,QAAS;QACnB,OAAO,EAAEO,OAAO,CAACT,KAAK,CAAE;QACxB,QAAQ,EAAE,IAAI,CAACH;QACf;QAAA;QACA,KAAK,EAAEI;MAAM,EACf,EACDI,iBAAiB,KAAK,KAAK,iBACxB,6BAAC,sCAAkB;QAAC,KAAK;MAAA,GAAEE,iBAAiB,CAC/C,EAEAF,iBAAiB,KAAK,KAAK,IAAIF,WAAW,iBACvC,6BAAC,sCAAkB,QAAEA,WAAW,CACnC,CACY;IAEzB;EAAC;EAAA;AAAA,EA5BeO,cAAK,CAACC,SAAS;AAAA,eA+BpBjB,KAAK;AAAA"}

package/Radio/Radio.styles.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.webinyRadioTitle = void 0;
-
 var _emotion = require("emotion");
-
 /**
  * Controls the helper text below the checkbox.
  * @type {string}

package/Radio/Radio.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["webinyRadioTitle","css","paddingLeft","marginBottom"],"sources":["Radio.styles.ts"],"sourcesContent":["import { css } from \"emotion\";\n\n/**\n * Controls the helper text below the checkbox.\n * @type {string}\n */\nconst webinyRadioTitle = 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 { webinyRadioTitle };\n"],"mappings":";;;;;;;AAAA;;AAEA;AACA;AACA;AACA;AACA,IAAMA,gBAAgB,gBAAG,IAAAC,YAAA,EACrB,EADqB,EAErB;EACI,gCAAgC;IAC5BC,WAAW,EAAE,EADe;IAE5B;IACA;IACAC,YAAY,EAAE;EAJc;AADpC,CAFqB,4BAAzB"}
+{"version":3,"names":["webinyRadioTitle","css","paddingLeft","marginBottom"],"sources":["Radio.styles.ts"],"sourcesContent":["import { css } from \"emotion\";\n\n/**\n * Controls the helper text below the checkbox.\n * @type {string}\n */\nconst webinyRadioTitle = 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 { webinyRadioTitle };\n"],"mappings":";;;;;;AAAA;AAEA;AACA;AACA;AACA;AACA,IAAMA,gBAAgB,gBAAG,IAAAC,YAAG,EACxB,CAAC,CAAC,EACF;EACI,8BAA8B,EAAE;IAC5BC,WAAW,EAAE,EAAE;IACf;IACA;IACAC,YAAY,EAAE;EAClB;AACJ,CAAC,4BACJ;AAAC"}

package/Radio/RadioGroup.js

@@ -1,50 +1,35 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
 var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _Radio = require("./Radio.styles");
-
 var _FormElementMessage = require("../FormElementMessage");
-
 var RadioGroup = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2.default)(RadioGroup, _React$Component);
-
   var _super = (0, _createSuper2.default)(RadioGroup);
-
   function RadioGroup() {
     (0, _classCallCheck2.default)(this, RadioGroup);
     return _super.apply(this, arguments);
   }
-
   (0, _createClass2.default)(RadioGroup, [{
     key: "render",
     value: function render() {
       var _this = this;
-
       var _this$props = this.props,
-          description = _this$props.description,
-          label = _this$props.label,
-          validation = _this$props.validation;
-
+        description = _this$props.description,
+        label = _this$props.label,
+        validation = _this$props.validation;
       var _ref = validation || {},
-          validationIsValid = _ref.isValid,
-          validationMessage = _ref.message;
-
+        validationIsValid = _ref.isValid,
+        validationMessage = _ref.message;
       return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, label && /*#__PURE__*/_react.default.createElement("div", {
         className: "mdc-text-field-helper-text mdc-text-field-helper-text--persistent " + _Radio.webinyRadioTitle
       }, label), this.props.children({
@@ -63,6 +48,5 @@ var RadioGroup = /*#__PURE__*/function (_React$Component) {
   }]);
   return RadioGroup;
 }(_react.default.Component);
-
 var _default = RadioGroup;
 exports.default = _default;

package/Radio/RadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"names":["RadioGroup","props","description","label","validation","validationIsValid","isValid","validationMessage","message","webinyRadioTitle","children","onChange","value","getValue","id","React","Component"],"sources":["RadioGroup.tsx"],"sourcesContent":["import React from \"react\";\nimport { FormComponentProps } from \"~/types\";\nimport { webinyRadioTitle } from \"./Radio.styles\";\nimport { FormElementMessage } from \"~/FormElementMessage\";\n\ninterface RadioGroupRenderParams {\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 Radio components.\n    children: (props: RadioGroupRenderParams) => React.ReactNode;\n};\n\nclass RadioGroup extends React.Component<Props> {\n    public override render() {\n        const { description, label, validation } = this.props;\n\n        const { isValid: validationIsValid, message: validationMessage } = validation || {};\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                            webinyRadioTitle\n                        }\n                    >\n                        {label}\n                    </div>\n                )}\n\n                {this.props.children({\n                    onChange: value => () => this.props.onChange && this.props.onChange(value),\n                    getValue: id => this.props.value === id\n                })}\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 RadioGroup;\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AAEA;;AACA;;IAkBMA,U;;;;;;;;;;;;WACF,kBAAyB;MAAA;;MACrB,kBAA2C,KAAKC,KAAhD;MAAA,IAAQC,WAAR,eAAQA,WAAR;MAAA,IAAqBC,KAArB,eAAqBA,KAArB;MAAA,IAA4BC,UAA5B,eAA4BA,UAA5B;;MAEA,WAAmEA,UAAU,IAAI,EAAjF;MAAA,IAAiBC,iBAAjB,QAAQC,OAAR;MAAA,IAA6CC,iBAA7C,QAAoCC,OAApC;;MAEA,oBACI,6BAAC,cAAD,CAAO,QAAP,QACKL,KAAK,iBACF;QACI,SAAS,EACL,uEACAM;MAHR,GAMKN,KANL,CAFR,EAYK,KAAKF,KAAL,CAAWS,QAAX,CAAoB;QACjBC,QAAQ,EAAE,kBAAAC,KAAK;UAAA,OAAI;YAAA,OAAM,KAAI,CAACX,KAAL,CAAWU,QAAX,IAAuB,KAAI,CAACV,KAAL,CAAWU,QAAX,CAAoBC,KAApB,CAA7B;UAAA,CAAJ;QAAA,CADE;QAEjBC,QAAQ,EAAE,kBAAAC,EAAE;UAAA,OAAI,KAAI,CAACb,KAAL,CAAWW,KAAX,KAAqBE,EAAzB;QAAA;MAFK,CAApB,CAZL,EAiBKT,iBAAiB,KAAK,KAAtB,iBACG,6BAAC,sCAAD;QAAoB,KAAK;MAAzB,GAA2BE,iBAA3B,CAlBR,EAqBKF,iBAAiB,KAAK,KAAtB,IAA+BH,WAA/B,iBACG,6BAAC,sCAAD,QAAqBA,WAArB,CAtBR,CADJ;IA2BH;;;EAjCoBa,cAAA,CAAMC,S;;eAoChBhB,U"}
+{"version":3,"names":["RadioGroup","props","description","label","validation","validationIsValid","isValid","validationMessage","message","webinyRadioTitle","children","onChange","value","getValue","id","React","Component"],"sources":["RadioGroup.tsx"],"sourcesContent":["import React from \"react\";\nimport { FormComponentProps } from \"~/types\";\nimport { webinyRadioTitle } from \"./Radio.styles\";\nimport { FormElementMessage } from \"~/FormElementMessage\";\n\ninterface RadioGroupRenderParams {\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 Radio components.\n    children: (props: RadioGroupRenderParams) => React.ReactNode;\n};\n\nclass RadioGroup extends React.Component<Props> {\n    public override render() {\n        const { description, label, validation } = this.props;\n\n        const { isValid: validationIsValid, message: validationMessage } = validation || {};\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                            webinyRadioTitle\n                        }\n                    >\n                        {label}\n                    </div>\n                )}\n\n                {this.props.children({\n                    onChange: value => () => this.props.onChange && this.props.onChange(value),\n                    getValue: id => this.props.value === id\n                })}\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 RadioGroup;\n"],"mappings":";;;;;;;;;;;AAAA;AAEA;AACA;AAA0D,IAkBpDA,UAAU;EAAA;EAAA;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA,OACZ,kBAAyB;MAAA;MACrB,kBAA2C,IAAI,CAACC,KAAK;QAA7CC,WAAW,eAAXA,WAAW;QAAEC,KAAK,eAALA,KAAK;QAAEC,UAAU,eAAVA,UAAU;MAEtC,WAAmEA,UAAU,IAAI,CAAC,CAAC;QAAlEC,iBAAiB,QAA1BC,OAAO;QAA8BC,iBAAiB,QAA1BC,OAAO;MAE3C,oBACI,6BAAC,cAAK,CAAC,QAAQ,QACVL,KAAK,iBACF;QACI,SAAS,EACL,oEAAoE,GACpEM;MACH,GAEAN,KAAK,CAEb,EAEA,IAAI,CAACF,KAAK,CAACS,QAAQ,CAAC;QACjBC,QAAQ,EAAE,kBAAAC,KAAK;UAAA,OAAI;YAAA,OAAM,KAAI,CAACX,KAAK,CAACU,QAAQ,IAAI,KAAI,CAACV,KAAK,CAACU,QAAQ,CAACC,KAAK,CAAC;UAAA;QAAA;QAC1EC,QAAQ,EAAE,kBAAAC,EAAE;UAAA,OAAI,KAAI,CAACb,KAAK,CAACW,KAAK,KAAKE,EAAE;QAAA;MAC3C,CAAC,CAAC,EAEDT,iBAAiB,KAAK,KAAK,iBACxB,6BAAC,sCAAkB;QAAC,KAAK;MAAA,GAAEE,iBAAiB,CAC/C,EAEAF,iBAAiB,KAAK,KAAK,IAAIH,WAAW,iBACvC,6BAAC,sCAAkB,QAAEA,WAAW,CACnC,CACY;IAEzB;EAAC;EAAA;AAAA,EAjCoBa,cAAK,CAACC,SAAS;AAAA,eAoCzBhB,UAAU;AAAA"}

package/Radio/RadioGroup.stories.js

@@ -1,21 +1,13 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _react2 = require("@storybook/react");
-
 var _Story = require("@webiny/storybook-utils/Story");
-
 var _addonKnobs = require("@storybook/addon-knobs");
-
 var _README = _interopRequireDefault(require("./README.md"));
-
 var _form = require("@webiny/form");
-
 var _ = require(".");
-
 var story = (0, _react2.storiesOf)("Components/Radio", module);
 story.addDecorator(_addonKnobs.withKnobs);
 story.add("usage", function () {
@@ -45,10 +37,10 @@ story.add("usage", function () {
       description: "Choose fruit you like the most."
     }, function (_ref2) {
       var onChange = _ref2.onChange,
-          getValue = _ref2.getValue;
+        getValue = _ref2.getValue;
       return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, options.map(function (_ref3) {
         var id = _ref3.id,
-            name = _ref3.name;
+          name = _ref3.name;
         return /*#__PURE__*/_react.default.createElement(_.Radio, {
           disabled: disabled,
           key: id,

package/Radio/RadioGroup.stories.js.map

@@ -1 +1 @@
-{"version":3,"names":["story","storiesOf","module","addDecorator","withKnobs","add","disabled","boolean","options","id","name","readme","fruits","Bind","onChange","getValue","map","info","propTables","Radio","RadioGroup"],"sources":["RadioGroup.stories.tsx"],"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.md\";\n\nimport { Form } from \"@webiny/form\";\nimport { Radio, RadioGroup } from \".\";\n\nconst story = storiesOf(\"Components/Radio\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n    \"usage\",\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 radio with label and description\"}>\n                        <Form data={{ fruits: \"pear\" }}>\n                            {({ Bind }) => (\n                                <Bind name=\"fruits\">\n                                    <RadioGroup\n                                        label=\"Fruit selection\"\n                                        description={\"Choose fruit you like the most.\"}\n                                    >\n                                        {({ onChange, getValue }) => (\n                                            <React.Fragment>\n                                                {options.map(({ id, name }) => (\n                                                    <Radio\n                                                        disabled={disabled}\n                                                        key={id}\n                                                        label={name}\n                                                        value={getValue(id)}\n                                                        onChange={onChange(id)}\n                                                    />\n                                                ))}\n                                            </React.Fragment>\n                                        )}\n                                    </RadioGroup>\n                                </Bind>\n                            )}\n                        </Form>\n                    </StorySandboxExample>\n                    <StorySandboxCode>\n                        {`\n                     <Form data={{fruits: ['pear']}}>\n                        {({ Bind }) => (\n                            <Bind name=\"fruits\">\n                                <RadioGroup\n                                    label=\"Fruits selection\"\n                                    description={\"Choose only fruits you like.\"}\n                                >\n                                    {({ onChange, getValue }) => (\n                                        <React.Fragment>\n                                            {options.map(({id, name}) => (\n                                                <Radio\n                                                    disabled={disabled}\n                                                    key={id}\n                                                    label={name}\n                                                    value={getValue(id)}\n                                                    onChange={onChange(id)}\n                                                />\n                                            ))}\n                                        </React.Fragment>\n                                    )}\n                                </RadioGroup>\n                            </Bind>\n                        )}\n                    </Form>\n                    `}\n                    </StorySandboxCode>\n                </StorySandbox>\n            </Story>\n        );\n    },\n    { info: { propTables: [Radio, RadioGroup] } }\n);\n"],"mappings":";;;;AAAA;;AACA;;AACA;;AAOA;;AACA;;AAEA;;AACA;;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAA,EAAU,kBAAV,EAA8BC,MAA9B,CAAd;AACAF,KAAK,CAACG,YAAN,CAAmBC,qBAAnB;AAEAJ,KAAK,CAACK,GAAN,CACI,OADJ,EAEI,YAAM;EACF,IAAMC,QAAQ,GAAG,IAAAC,mBAAA,EAAQ,UAAR,EAAoB,KAApB,CAAjB;EAEA,IAAMC,OAAO,GAAG,CACZ;IAAEC,EAAE,EAAE,OAAN;IAAeC,IAAI,EAAE;EAArB,CADY,EAEZ;IAAED,EAAE,EAAE,MAAN;IAAcC,IAAI,EAAE;EAApB,CAFY,EAGZ;IAAED,EAAE,EAAE,QAAN;IAAgBC,IAAI,EAAE;EAAtB,CAHY,CAAhB;EAMA,oBACI,6BAAC,YAAD,qBACI,6BAAC,kBAAD,QAAcC,eAAd,CADJ,eAEI,6BAAC,mBAAD,qBACI,6BAAC,0BAAD;IAAqB,KAAK,EAAE;EAA5B,gBACI,6BAAC,UAAD;IAAM,IAAI,EAAE;MAAEC,MAAM,EAAE;IAAV;EAAZ,GACK;IAAA,IAAGC,IAAH,QAAGA,IAAH;IAAA,oBACG,6BAAC,IAAD;MAAM,IAAI,EAAC;IAAX,gBACI,6BAAC,YAAD;MACI,KAAK,EAAC,iBADV;MAEI,WAAW,EAAE;IAFjB,GAIK;MAAA,IAAGC,QAAH,SAAGA,QAAH;MAAA,IAAaC,QAAb,SAAaA,QAAb;MAAA,oBACG,6BAAC,cAAD,CAAO,QAAP,QACKP,OAAO,CAACQ,GAAR,CAAY;QAAA,IAAGP,EAAH,SAAGA,EAAH;QAAA,IAAOC,IAAP,SAAOA,IAAP;QAAA,oBACT,6BAAC,OAAD;UACI,QAAQ,EAAEJ,QADd;UAEI,GAAG,EAAEG,EAFT;UAGI,KAAK,EAAEC,IAHX;UAII,KAAK,EAAEK,QAAQ,CAACN,EAAD,CAJnB;UAKI,QAAQ,EAAEK,QAAQ,CAACL,EAAD;QALtB,EADS;MAAA,CAAZ,CADL,CADH;IAAA,CAJL,CADJ,CADH;EAAA,CADL,CADJ,CADJ,eA2BI,6BAAC,uBAAD,i1CA3BJ,CAFJ,CADJ;AA6DH,CAxEL,EAyEI;EAAEQ,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,OAAD,EAAQC,YAAR;EAAd;AAAR,CAzEJ"}
+{"version":3,"names":["story","storiesOf","module","addDecorator","withKnobs","add","disabled","boolean","options","id","name","readme","fruits","Bind","onChange","getValue","map","info","propTables","Radio","RadioGroup"],"sources":["RadioGroup.stories.tsx"],"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.md\";\n\nimport { Form } from \"@webiny/form\";\nimport { Radio, RadioGroup } from \".\";\n\nconst story = storiesOf(\"Components/Radio\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n    \"usage\",\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 radio with label and description\"}>\n                        <Form data={{ fruits: \"pear\" }}>\n                            {({ Bind }) => (\n                                <Bind name=\"fruits\">\n                                    <RadioGroup\n                                        label=\"Fruit selection\"\n                                        description={\"Choose fruit you like the most.\"}\n                                    >\n                                        {({ onChange, getValue }) => (\n                                            <React.Fragment>\n                                                {options.map(({ id, name }) => (\n                                                    <Radio\n                                                        disabled={disabled}\n                                                        key={id}\n                                                        label={name}\n                                                        value={getValue(id)}\n                                                        onChange={onChange(id)}\n                                                    />\n                                                ))}\n                                            </React.Fragment>\n                                        )}\n                                    </RadioGroup>\n                                </Bind>\n                            )}\n                        </Form>\n                    </StorySandboxExample>\n                    <StorySandboxCode>\n                        {`\n                     <Form data={{fruits: ['pear']}}>\n                        {({ Bind }) => (\n                            <Bind name=\"fruits\">\n                                <RadioGroup\n                                    label=\"Fruits selection\"\n                                    description={\"Choose only fruits you like.\"}\n                                >\n                                    {({ onChange, getValue }) => (\n                                        <React.Fragment>\n                                            {options.map(({id, name}) => (\n                                                <Radio\n                                                    disabled={disabled}\n                                                    key={id}\n                                                    label={name}\n                                                    value={getValue(id)}\n                                                    onChange={onChange(id)}\n                                                />\n                                            ))}\n                                        </React.Fragment>\n                                    )}\n                                </RadioGroup>\n                            </Bind>\n                        )}\n                    </Form>\n                    `}\n                    </StorySandboxCode>\n                </StorySandbox>\n            </Story>\n        );\n    },\n    { info: { propTables: [Radio, RadioGroup] } }\n);\n"],"mappings":";;;AAAA;AACA;AACA;AAOA;AACA;AAEA;AACA;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAS,EAAC,kBAAkB,EAAEC,MAAM,CAAC;AACnDF,KAAK,CAACG,YAAY,CAACC,qBAAS,CAAC;AAE7BJ,KAAK,CAACK,GAAG,CACL,OAAO,EACP,YAAM;EACF,IAAMC,QAAQ,GAAG,IAAAC,mBAAO,EAAC,UAAU,EAAE,KAAK,CAAC;EAE3C,IAAMC,OAAO,GAAG,CACZ;IAAEC,EAAE,EAAE,OAAO;IAAEC,IAAI,EAAE;EAAQ,CAAC,EAC9B;IAAED,EAAE,EAAE,MAAM;IAAEC,IAAI,EAAE;EAAO,CAAC,EAC5B;IAAED,EAAE,EAAE,QAAQ;IAAEC,IAAI,EAAE;EAAS,CAAC,CACnC;EAED,oBACI,6BAAC,YAAK,qBACF,6BAAC,kBAAW,QAAEC,eAAM,CAAe,eACnC,6BAAC,mBAAY,qBACT,6BAAC,0BAAmB;IAAC,KAAK,EAAE;EAA0C,gBAClE,6BAAC,UAAI;IAAC,IAAI,EAAE;MAAEC,MAAM,EAAE;IAAO;EAAE,GAC1B;IAAA,IAAGC,IAAI,QAAJA,IAAI;IAAA,oBACJ,6BAAC,IAAI;MAAC,IAAI,EAAC;IAAQ,gBACf,6BAAC,YAAU;MACP,KAAK,EAAC,iBAAiB;MACvB,WAAW,EAAE;IAAkC,GAE9C;MAAA,IAAGC,QAAQ,SAARA,QAAQ;QAAEC,QAAQ,SAARA,QAAQ;MAAA,oBAClB,6BAAC,cAAK,CAAC,QAAQ,QACVP,OAAO,CAACQ,GAAG,CAAC;QAAA,IAAGP,EAAE,SAAFA,EAAE;UAAEC,IAAI,SAAJA,IAAI;QAAA,oBACpB,6BAAC,OAAK;UACF,QAAQ,EAAEJ,QAAS;UACnB,GAAG,EAAEG,EAAG;UACR,KAAK,EAAEC,IAAK;UACZ,KAAK,EAAEK,QAAQ,CAACN,EAAE,CAAE;UACpB,QAAQ,EAAEK,QAAQ,CAACL,EAAE;QAAE,EACzB;MAAA,CACL,CAAC,CACW;IAAA,CACpB,CACQ,CACV;EAAA,CACV,CACE,CACW,eACtB,6BAAC,uBAAgB,i1CA2BE,CACR,CACX;AAEhB,CAAC,EACD;EAAEQ,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,OAAK,EAAEC,YAAU;EAAE;AAAE,CAAC,CAChD"}

package/Radio/index.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -17,7 +16,5 @@ Object.defineProperty(exports, "RadioGroup", {
     return _RadioGroup.default;
   }
 });
-
 var _Radio = _interopRequireDefault(require("./Radio"));
-
 var _RadioGroup = _interopRequireDefault(require("./RadioGroup"));

package/Radio/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as Radio } from \"./Radio\";\nexport { default as RadioGroup } from \"./RadioGroup\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;;AACA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as Radio } from \"./Radio\";\nexport { default as RadioGroup } from \"./RadioGroup\";\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AACA"}