@webiny/ui 0.0.0-mt-3 → 0.0.0-unstable.5e7233243f

package/TopProgressBar/hoc/withTopProgressBar.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["withTopProgressBar","BaseComponent","WithTopProgressBar","props","start","finish","nprogress"],"sources":["withTopProgressBar.tsx"],"sourcesContent":["import React from \"react\";\nimport { TopProgressBar } from \"..\";\n\nconst withTopProgressBar = () => {\n    return (BaseComponent: React.ComponentType<any>) => {\n        const WithTopProgressBar = (props: any) => {\n            return (\n                <TopProgressBar>\n                    {({ start, finish, nprogress }) => (\n                        <BaseComponent\n                            {...props}\n                            startTopProgressBar={start}\n                            finishTopProgressBar={finish}\n                            nprogress={nprogress}\n                        />\n                    )}\n                </TopProgressBar>\n            );\n        };\n\n        return WithTopProgressBar;\n    };\n};\n\nexport default withTopProgressBar;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AAEA,IAAMA,kBAAkB,GAAG,SAArBA,kBAAqB,GAAM;EAC7B,OAAO,UAACC,aAAD,EAA6C;IAChD,IAAMC,kBAAkB,GAAG,SAArBA,kBAAqB,CAACC,KAAD,EAAgB;MACvC,oBACI,6BAAC,gBAAD,QACK;QAAA,IAAGC,KAAH,QAAGA,KAAH;QAAA,IAAUC,MAAV,QAAUA,MAAV;QAAA,IAAkBC,SAAlB,QAAkBA,SAAlB;QAAA,oBACG,6BAAC,aAAD,oBACQH,KADR;UAEI,mBAAmB,EAAEC,KAFzB;UAGI,oBAAoB,EAAEC,MAH1B;UAII,SAAS,EAAEC;QAJf,GADH;MAAA,CADL,CADJ;IAYH,CAbD;;IAeA,OAAOJ,kBAAP;EACH,CAjBD;AAkBH,CAnBD;;eAqBeF,kB"}

package/TopProgressBar/index.js

@@ -1 +1,18 @@
-export * from "./TopProgressBar";
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _TopProgressBar = require("./TopProgressBar");
+
+Object.keys(_TopProgressBar).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _TopProgressBar[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _TopProgressBar[key];
+    }
+  });
+});

package/TopProgressBar/index.js.map

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

package/Typography/Typography.d.ts

@@ -1,13 +1,13 @@
-import * as React from "react";
+import React from "react";
 import { TypographyProps as RmwcTypographyProps } from "@rmwc/typography";
-declare type TypographyProps = RmwcTypographyProps & {
+export interface TypographyProps extends RmwcTypographyProps {
     children?: React.ReactNode;
     className?: string;
     style?: React.CSSProperties;
     tag?: string;
-};
+}
 /**
  * Use Ripple component to display a list of choices, once the handler is triggered.
  */
-declare const Typography: (props: TypographyProps) => JSX.Element;
+declare const Typography: React.FC<TypographyProps>;
 export { Typography };

package/Typography/Typography.js

@@ -1,11 +1,21 @@
-import * as React from "react";
-import { Typography as RwmcTypography } from "@rmwc/typography";
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Typography = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _typography = require("@rmwc/typography");
 
 /**
  * Use Ripple component to display a list of choices, once the handler is triggered.
  */
 var Typography = function Typography(props) {
-  return /*#__PURE__*/React.createElement(RwmcTypography, props, props.children);
+  return /*#__PURE__*/_react.default.createElement(_typography.Typography, props, props.children);
 };
 
-export { Typography };
+exports.Typography = Typography;

package/Typography/Typography.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Typography","props","children"],"sources":["Typography.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n    Typography as RwmcTypography,\n    TypographyProps as RmwcTypographyProps\n} from \"@rmwc/typography\";\n\nexport interface TypographyProps extends RmwcTypographyProps {\n    children?: React.ReactNode;\n    className?: string;\n    style?: React.CSSProperties;\n    tag?: string;\n}\n\n/**\n * Use Ripple component to display a list of choices, once the handler is triggered.\n */\nconst Typography: React.FC<TypographyProps> = props => {\n    return <RwmcTypography {...props}>{props.children}</RwmcTypography>;\n};\n\nexport { Typography };\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AAYA;AACA;AACA;AACA,IAAMA,UAAqC,GAAG,SAAxCA,UAAwC,CAAAC,KAAK,EAAI;EACnD,oBAAO,6BAAC,sBAAD,EAAoBA,KAApB,EAA4BA,KAAK,CAACC,QAAlC,CAAP;AACH,CAFD"}

package/Typography/Typography.stories.js

@@ -1,67 +1,76 @@
-import * as React from "react";
-import { storiesOf } from "@storybook/react";
-import { Story, StoryReadme, StorySandboxCode, StorySandbox, StorySandboxExample } from "@webiny/storybook-utils/Story";
-import readme from "./README.md";
-import { Typography } from "./Typography";
-var story = storiesOf("Components/Typography", module);
+"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("./README.md"));
+
+var _Typography = require("./Typography");
+
+var story = (0, _react2.storiesOf)("Components/Typography", module);
 story.add("usage", function () {
-  return /*#__PURE__*/React.createElement(Story, null, /*#__PURE__*/React.createElement(StoryReadme, null, readme), /*#__PURE__*/React.createElement(StorySandbox, {
+  return /*#__PURE__*/_react.default.createElement(_Story.Story, null, /*#__PURE__*/_react.default.createElement(_Story.StoryReadme, null, _README.default), /*#__PURE__*/_react.default.createElement(_Story.StorySandbox, {
     title: "Typography styles"
-  }, /*#__PURE__*/React.createElement(StorySandboxExample, null, /*#__PURE__*/React.createElement("ul", null, /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+  }, /*#__PURE__*/_react.default.createElement(_Story.StorySandboxExample, null, /*#__PURE__*/_react.default.createElement("ul", null, /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "headline1"
-  }, "headline1")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+  }, "headline1")), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "headline2"
-  }, "headline2")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+  }, "headline2")), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "headline3"
-  }, "headline3")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+  }, "headline3")), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "headline4"
-  }, "headline4")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+  }, "headline4")), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "headline5"
-  }, "headline5")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+  }, "headline5")), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "headline6"
-  }, "headline6")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+  }, "headline6")), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "subtitle1"
-  }, "subtitle1")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+  }, "subtitle1")), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "subtitle2"
-  }, "subtitle2")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+  }, "subtitle2")), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "body1"
-  }, "body1")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+  }, "body1")), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "body2"
-  }, "body2")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+  }, "body2")), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "caption"
-  }, "caption")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+  }, "caption")), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "button"
-  }, "button")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+  }, "button")), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "overline"
-  }, "overline")))), /*#__PURE__*/React.createElement(StorySandboxCode, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Typography, {
+  }, "overline")))), /*#__PURE__*/_react.default.createElement(_Story.StorySandboxCode, null, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "headline1"
-  }, "headline1"), /*#__PURE__*/React.createElement(Typography, {
+  }, "headline1"), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "headline2"
-  }, "headline2"), /*#__PURE__*/React.createElement(Typography, {
+  }, "headline2"), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "headline3"
-  }, "headline3"), /*#__PURE__*/React.createElement(Typography, {
+  }, "headline3"), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "headline4"
-  }, "headline4"), /*#__PURE__*/React.createElement(Typography, {
+  }, "headline4"), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "headline5"
-  }, "headline5"), /*#__PURE__*/React.createElement(Typography, {
+  }, "headline5"), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "headline6"
-  }, "headline6"), /*#__PURE__*/React.createElement(Typography, {
+  }, "headline6"), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "subtitle1"
-  }, "subtitle1"), /*#__PURE__*/React.createElement(Typography, {
+  }, "subtitle1"), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "subtitle2"
-  }, "subtitle2"), /*#__PURE__*/React.createElement(Typography, {
+  }, "subtitle2"), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "body1"
-  }, "body1"), /*#__PURE__*/React.createElement(Typography, {
+  }, "body1"), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "body2"
-  }, "body2"), /*#__PURE__*/React.createElement(Typography, {
+  }, "body2"), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "caption"
-  }, "caption"), /*#__PURE__*/React.createElement(Typography, {
+  }, "caption"), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "button"
-  }, "button"), /*#__PURE__*/React.createElement(Typography, {
+  }, "button"), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "overline"
   }, "overline")))));
 }, {
   info: {
-    propTables: [Typography]
+    propTables: [_Typography.Typography]
   }
 });

package/Typography/Typography.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["story","storiesOf","module","add","readme","info","propTables","Typography"],"sources":["Typography.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\";\n\nimport readme from \"./README.md\";\nimport { Typography } from \"./Typography\";\n\nconst story = storiesOf(\"Components/Typography\", module);\n\nstory.add(\n    \"usage\",\n    () => {\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox title={\"Typography styles\"}>\n                    <StorySandboxExample>\n                        <ul>\n                            <li>\n                                <Typography use=\"headline1\">headline1</Typography>\n                            </li>\n                            <li>\n                                <Typography use=\"headline2\">headline2</Typography>\n                            </li>\n                            <li>\n                                <Typography use=\"headline3\">headline3</Typography>\n                            </li>\n                            <li>\n                                <Typography use=\"headline4\">headline4</Typography>\n                            </li>\n                            <li>\n                                <Typography use=\"headline5\">headline5</Typography>\n                            </li>\n                            <li>\n                                <Typography use=\"headline6\">headline6</Typography>\n                            </li>\n                            <li>\n                                <Typography use=\"subtitle1\">subtitle1</Typography>\n                            </li>\n                            <li>\n                                <Typography use=\"subtitle2\">subtitle2</Typography>\n                            </li>\n                            <li>\n                                <Typography use=\"body1\">body1</Typography>\n                            </li>\n                            <li>\n                                <Typography use=\"body2\">body2</Typography>\n                            </li>\n                            <li>\n                                <Typography use=\"caption\">caption</Typography>\n                            </li>\n                            <li>\n                                <Typography use=\"button\">button</Typography>\n                            </li>\n                            <li>\n                                <Typography use=\"overline\">overline</Typography>\n                            </li>\n                        </ul>\n                    </StorySandboxExample>\n                    <StorySandboxCode>\n                        <div>\n                            <Typography use=\"headline1\">headline1</Typography>\n                            <Typography use=\"headline2\">headline2</Typography>\n                            <Typography use=\"headline3\">headline3</Typography>\n                            <Typography use=\"headline4\">headline4</Typography>\n                            <Typography use=\"headline5\">headline5</Typography>\n                            <Typography use=\"headline6\">headline6</Typography>\n                            <Typography use=\"subtitle1\">subtitle1</Typography>\n                            <Typography use=\"subtitle2\">subtitle2</Typography>\n                            <Typography use=\"body1\">body1</Typography>\n                            <Typography use=\"body2\">body2</Typography>\n                            <Typography use=\"caption\">caption</Typography>\n                            <Typography use=\"button\">button</Typography>\n                            <Typography use=\"overline\">overline</Typography>\n                        </div>\n                    </StorySandboxCode>\n                </StorySandbox>\n            </Story>\n        );\n    },\n    { info: { propTables: [Typography] } }\n);\n"],"mappings":";;;;AAAA;;AACA;;AACA;;AAQA;;AACA;;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAA,EAAU,uBAAV,EAAmCC,MAAnC,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,sDACI,sDACI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,eADJ,CADJ,eAII,sDACI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,eADJ,CAJJ,eAOI,sDACI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,eADJ,CAPJ,eAUI,sDACI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,eADJ,CAVJ,eAaI,sDACI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,eADJ,CAbJ,eAgBI,sDACI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,eADJ,CAhBJ,eAmBI,sDACI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,eADJ,CAnBJ,eAsBI,sDACI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,eADJ,CAtBJ,eAyBI,sDACI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,WADJ,CAzBJ,eA4BI,sDACI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,WADJ,CA5BJ,eA+BI,sDACI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,aADJ,CA/BJ,eAkCI,sDACI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,YADJ,CAlCJ,eAqCI,sDACI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,cADJ,CArCJ,CADJ,CADJ,eA4CI,6BAAC,uBAAD,qBACI,uDACI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,eADJ,eAEI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,eAFJ,eAGI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,eAHJ,eAII,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,eAJJ,eAKI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,eALJ,eAMI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,eANJ,eAOI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,eAPJ,eAQI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,eARJ,eASI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,WATJ,eAUI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,WAVJ,eAWI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,aAXJ,eAYI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,YAZJ,eAaI,6BAAC,sBAAD;IAAY,GAAG,EAAC;EAAhB,cAbJ,CADJ,CA5CJ,CAFJ,CADJ;AAmEH,CAtEL,EAuEI;EAAEC,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,sBAAD;EAAd;AAAR,CAvEJ"}

package/Typography/index.js

@@ -1 +1,18 @@
-export * from "./Typography";
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _Typography = require("./Typography");
+
+Object.keys(_Typography).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Typography[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Typography[key];
+    }
+  });
+});

package/Typography/index.js.map

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

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@webiny/ui",
-	"version": "0.0.0-mt-3",
+	"version": "0.0.0-unstable.5e7233243f",
 	"main": "index.js",
 	"repository": {
 		"type": "git",
@@ -14,50 +14,42 @@
 	],
 	"license": "MIT",
 	"dependencies": {
-		"@babel/runtime": "7.15.4",
-		"@editorjs/editorjs": "2.22.3",
-		"@emotion/core": "10.1.1",
-		"@emotion/styled": "10.0.27",
-		"@material/base": "3.1.0",
-		"@material/textfield": "3.2.0",
-		"@rmwc/base": "5.7.2",
-		"@rmwc/button": "5.7.2",
-		"@rmwc/checkbox": "5.7.2",
-		"@rmwc/chip": "5.7.2",
-		"@rmwc/dialog": "5.7.2",
-		"@rmwc/drawer": "5.7.2",
-		"@rmwc/elevation": "5.7.2",
-		"@rmwc/fab": "5.7.2",
-		"@rmwc/floating-label": "5.7.2",
-		"@rmwc/grid": "5.7.2",
-		"@rmwc/icon": "5.7.2",
-		"@rmwc/icon-button": "5.7.2",
-		"@rmwc/line-ripple": "5.7.2",
-		"@rmwc/list": "5.7.2",
-		"@rmwc/menu": "5.7.2",
-		"@rmwc/notched-outline": "5.7.2",
-		"@rmwc/radio": "5.7.2",
-		"@rmwc/ripple": "5.7.2",
-		"@rmwc/select": "5.7.2",
-		"@rmwc/slider": "5.7.2",
-		"@rmwc/snackbar": "5.7.2",
-		"@rmwc/switch": "5.7.2",
-		"@rmwc/tabs": "5.7.2",
-		"@rmwc/textfield": "file:./rmwc/textfield",
-		"@rmwc/top-app-bar": "5.7.2",
-		"@rmwc/types": "5.6.0",
-		"@rmwc/typography": "5.7.2",
-		"@svgr/webpack": "4.3.3",
+		"@babel/runtime": "7.18.9",
+		"@editorjs/editorjs": "2.25.0",
+		"@emotion/core": "10.3.1",
+		"@emotion/styled": "10.3.0",
+		"@rmwc/button": "7.0.3",
+		"@rmwc/checkbox": "7.0.3",
+		"@rmwc/chip": "7.0.3",
+		"@rmwc/dialog": "7.0.3",
+		"@rmwc/drawer": "7.0.3",
+		"@rmwc/elevation": "7.0.3",
+		"@rmwc/fab": "7.0.3",
+		"@rmwc/grid": "7.0.3",
+		"@rmwc/icon-button": "7.0.3",
+		"@rmwc/list": "7.0.3",
+		"@rmwc/menu": "7.0.3",
+		"@rmwc/radio": "7.0.3",
+		"@rmwc/ripple": "7.0.3",
+		"@rmwc/select": "7.0.3",
+		"@rmwc/slider": "7.0.3",
+		"@rmwc/snackbar": "7.0.3",
+		"@rmwc/switch": "7.0.3",
+		"@rmwc/tabs": "7.0.3",
+		"@rmwc/textfield": "7.0.3",
+		"@rmwc/top-app-bar": "7.0.3",
+		"@rmwc/typography": "7.0.3",
+		"@svgr/webpack": "6.3.1",
 		"brace": "0.11.1",
 		"classnames": "2.3.1",
 		"cropperjs": "1.5.12",
 		"dot-prop-immutable": "2.1.1",
 		"downshift": "2.2.3",
 		"emotion": "10.0.17",
-		"keycode": "2.2.0",
+		"keycode": "2.2.1",
 		"load-script": "1.0.0",
 		"lodash": "4.17.21",
-		"material-components-web": "3.2.0",
+		"material-components-web": "5.1.0",
 		"nprogress": "0.2.0",
 		"nuka-carousel": "4.7.1",
 		"rc-tooltip": "3.7.3",
@@ -68,44 +60,50 @@
 		"react-custom-scrollbars": "4.2.1",
 		"react-loading-skeleton": "0.5.0",
 		"react-spinner-material": "1.1.4",
-		"react-transition-group": "4.4.2",
+		"react-transition-group": "4.4.5",
 		"shortid": "2.2.16"
 	},
 	"devDependencies": {
-		"@babel/cli": "^7.5.5",
-		"@babel/core": "^7.5.5",
-		"@babel/plugin-proposal-class-properties": "^7.5.5",
-		"@babel/preset-env": "^7.5.5",
-		"@babel/preset-typescript": "^7.8.3",
+		"@babel/cli": "^7.16.0",
+		"@babel/core": "^7.16.0",
+		"@babel/plugin-proposal-class-properties": "^7.16.0",
+		"@babel/preset-env": "^7.16.4",
+		"@babel/preset-typescript": "^7.16.0",
 		"@storybook/addon-info": "^5.2.8",
 		"@storybook/addon-knobs": "^5.0.5",
 		"@storybook/addon-links": "^5.0.5",
 		"@storybook/react": "^5.2.8",
-		"@webiny/cli": "^0.0.0-mt-3",
-		"@webiny/form": "^0.0.0-mt-3",
-		"@webiny/project-utils": "^0.0.0-mt-3",
-		"@webiny/storybook-utils": "^0.0.0-mt-3",
-		"@webiny/validation": "^0.0.0-mt-3",
+		"@testing-library/react": "^12.1.2",
+		"@types/classnames": "^2.2.7",
+		"@types/nprogress": "^0.2.0",
+		"@types/rc-tooltip": "^3.7.2",
+		"@types/react-custom-scrollbars": "^4.0.10",
+		"@types/react-transition-group": "^4.4.4",
+		"@types/shortid": "^0.0.29",
+		"@webiny/cli": "^0.0.0-unstable.5e7233243f",
+		"@webiny/form": "^0.0.0-unstable.5e7233243f",
+		"@webiny/project-utils": "^0.0.0-unstable.5e7233243f",
+		"@webiny/storybook-utils": "^0.0.0-unstable.5e7233243f",
+		"@webiny/validation": "^0.0.0-unstable.5e7233243f",
 		"babel-loader": "^8.0.0-beta.6",
 		"babel-plugin-emotion": "^9.2.8",
-		"babel-plugin-named-asset-import": "^1.0.0-next.3e165448",
 		"execa": "^5.0.0",
 		"jest-dom": "^3.0.0",
 		"ncp": "^2.0.0",
 		"raw-loader": "^0.5.1",
 		"react-docgen": "^5.0.0",
 		"react-docgen-typescript-loader": "^3.6.0",
-		"react-testing-library": "^8.0.1",
 		"regenerator-runtime": "^0.13.2",
 		"rimraf": "^3.0.2",
 		"sass": "^1.38.0",
 		"sass-loader": "^12.1.0",
-		"typescript": "^4.1.3",
+		"ttypescript": "^1.5.13",
+		"typescript": "4.7.4",
 		"webpack": "^4.46.0"
 	},
 	"peerDependencies": {
-		"react": "16.14.0",
-		"react-dom": "16.14.0"
+		"react": "^17.0.2",
+		"react-dom": "^17.0.2"
 	},
 	"publishConfig": {
 		"access": "public",
@@ -123,20 +121,14 @@
 		},
 		"setupTestFrameworkScriptFile": "jest-extended"
 	},
-	"svgo": {
-		"plugins": {
-			"removeViewBox": false
-		}
-	},
 	"adio": {
 		"ignore": {
 			"dependencies": [
 				"@svgr/webpack",
 				"material-components-web",
-				"@emotion/core",
-				"@rmwc/base"
+				"@emotion/core"
 			]
 		}
 	},
-	"gitHead": "ebea815be2be99404591cba465cc1fe88355bd48"
+	"gitHead": "995a4b337db9b8497c6615e335dcd206afe26f8f"
 }

package/styles.scss

@@ -28,7 +28,7 @@ $mdc-theme-text-secondary-on-background: $webiny-theme-light-text-secondary-on-b
 $mdc-theme-text-hint-on-dark: $webiny-theme-light-text-hint-on-dark;
 $mdc-typography-font-family: $webiny-theme-typography-font-family;
 
-@import "~material-components-web/material-components-web.scss";
+@import "material-components-web/material-components-web.scss";
 @import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700");
 
 /*

package/types.d.ts

@@ -1,4 +1,4 @@
-export declare type FormComponentProps = {
+export interface FormComponentProps {
     validation?: {
         isValid: boolean;
         message: string;
@@ -9,4 +9,4 @@ export declare type FormComponentProps = {
     validate?: () => Promise<boolean | any>;
     value?: any;
     onChange?: (value: any) => void;
-};
+}

package/types.js

@@ -1 +1,5 @@
-export {};
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["export interface FormComponentProps {\n    validation?: {\n        /* Is form element's value valid? */\n        isValid: boolean;\n        /* Error message if value is not valid. */\n        message: string;\n        /* Any validation result returned by the validator. */\n        results?: { [key: string]: any };\n    };\n\n    /* Provided by <Form> component to perform validation when value has changed. */\n    validate?: () => Promise<boolean | any>;\n\n    /* Form component's value. */\n    value?: any;\n\n    /* A callback that is executed each time a value is changed. */\n    onChange?: (value: any) => void;\n}\n"],"mappings":""}

package/Chips/ChipIcon.d.ts

@@ -1,4 +0,0 @@
-/// <reference types="react" />
-import { ChipIconProps as RmwcChipIconProps } from "@rmwc/chip";
-export declare type ChipIconProps = RmwcChipIconProps;
-export declare const ChipIcon: (props: ChipIconProps) => JSX.Element;

package/Chips/ChipIcon.js

@@ -1,8 +0,0 @@
-import * as React from "react";
-import { ChipIcon as RmwcChipIcon } from "@rmwc/chip";
-import { chipIconWrapper } from "./styles";
-export var ChipIcon = function ChipIcon(props) {
-  return /*#__PURE__*/React.createElement(RmwcChipIcon, Object.assign({
-    className: chipIconWrapper
-  }, props));
-};

package/rmwc/textfield/code/index.d.ts

@@ -1,135 +0,0 @@
-/* eslint-disable */
-import * as RMWC from '@rmwc/types';
-import * as React from 'react';
-import { IconProps } from '@rmwc/icon';
-import { SpecificEventListener } from '@material/base/types';
-import { MDCTextFieldFoundation, MDCTextFieldIconFoundation, MDCTextFieldCharacterCounterFoundation } from '@material/textfield';
-import { FoundationComponent } from '@rmwc/base';
-/*********************************************************************
- * TextField
- *********************************************************************/
-/** A TextField component for accepting text input from a user. */
-export interface TextFieldProps {
-    /** Sets the value for controlled TextFields. */
-    value?: string | number;
-    /** Adds help text to the field */
-    helpText?: React.ReactNode | TextFieldHelperTextProps;
-    /** Shows the character count, must be used in conjunction with maxLength. */
-    characterCount?: boolean;
-    /** Makes the TextField visually invalid. This is sometimes automatically applied in cases where required or pattern is used.  */
-    invalid?: boolean;
-    /** Makes the Textfield disabled.  */
-    disabled?: boolean;
-    /** Makes the Textfield required.  */
-    required?: boolean;
-    /** Outline the TextField */
-    outlined?: boolean;
-    /** A label for the input. */
-    label?: React.ReactNode;
-    /** Makes a multiline TextField. */
-    textarea?: boolean;
-    /** Makes the TextField fullwidth. */
-    fullwidth?: boolean;
-    /** Add a leading icon. */
-    icon?: RMWC.IconPropT;
-    /** Add a trailing icon. */
-    trailingIcon?: RMWC.IconPropT;
-    /** By default, props spread to the input. These props are for the component's root container. */
-    rootProps?: Object;
-    /** A reference to the native input or textarea. */
-    inputRef?: React.MutableRefObject<HTMLInputElement | HTMLTextAreaElement | null> | ((ref: HTMLInputElement | HTMLTextAreaElement | null) => void);
-    /** The type of input field to render, search, number, etc */
-    type?: string;
-}
-export interface DeprecatedTextfieldProps {
-    /** DEPRECATED: Is being removed from MCW. */
-    dense?: boolean;
-    /** DEPRECATED: Use icon. */
-    withLeadingIcon?: RMWC.IconPropT;
-    /** DEPRECATED: Use trailingIcon. */
-    withTrailingIcon?: RMWC.IconPropT;
-}
-/** A TextField component for accepting text input from a user. */
-export declare class TextField extends FoundationComponent<MDCTextFieldFoundation, TextFieldProps & DeprecatedTextfieldProps> {
-    static displayName: string;
-    generatedId: string;
-    private root;
-    private input;
-    private label;
-    private lineRipple;
-    characterCounter?: null | TextFieldCharacterCount;
-    leadingIcon: null | TextFieldIcon;
-    trailingIcon: null | TextFieldIcon;
-    outline: null | any;
-    valueNeedsUpdate: boolean;
-    constructor(props: any);
-    getDefaultFoundation(): MDCTextFieldFoundation;
-    getLabelAdapterMethods(): {
-        shakeLabel: (shouldShake: boolean) => void;
-        floatLabel: (shouldFloat: boolean) => void;
-        hasLabel: () => boolean;
-        getLabelWidth: () => number;
-    };
-    getLineRippleAdapterMethods(): {
-        activateLineRipple: () => void;
-        deactivateLineRipple: () => void;
-        setLineRippleTransformOrigin: (normalizedX: number) => void;
-    };
-    getOutlineAdapterMethods(): {
-        notchOutline: (labelWidth: number) => void;
-        closeOutline: () => any;
-        hasOutline: () => boolean;
-    };
-    getInputAdapterMethods(): {
-        registerInputInteractionHandler: <K extends any>(evtType: K, handler: SpecificEventListener<any>) => void;
-        deregisterInputInteractionHandler: <K extends any>(evtType: K, handler: SpecificEventListener<any>) => void;
-        getNativeInput: () => (HTMLInputElement & HTMLTextAreaElement) | null;
-    };
-    getFoundationMap(): {
-        characterCounter: MDCTextFieldCharacterCounterFoundation | undefined;
-        helperText: undefined;
-        leadingIcon: MDCTextFieldIconFoundation | undefined;
-        trailingIcon: MDCTextFieldIconFoundation | undefined;
-    };
-    renderIcon(icon: RMWC.IconPropT, leadOrTrail: 'leadingIcon' | 'trailingIcon'): JSX.Element;
-    sync(props: TextFieldProps): void;
-    handleOnChange(evt: React.ChangeEvent<HTMLInputElement>): void;
-    renderHelpText(renderedCharacterCounter?: React.ReactNode): JSX.Element | null;
-    render(): JSX.Element;
-}
-/*********************************************************************
- * Helper Text
- *********************************************************************/
-interface TextFieldHelperCharacterCount {
-}
-declare class TextFieldCharacterCount extends FoundationComponent<MDCTextFieldCharacterCounterFoundation, TextFieldHelperCharacterCount> {
-    static displayName: string;
-    state: {
-        content: string;
-    };
-    getDefaultFoundation(): MDCTextFieldCharacterCounterFoundation;
-    render(): JSX.Element;
-}
-export interface TextFieldHelperTextProps {
-    /** Make the help text always visible */
-    persistent?: boolean;
-    /** Make the help a validation message style */
-    validationMsg?: boolean;
-    /** Content for the help text */
-    children: React.ReactNode;
-}
-/** A help text component */
-export declare const TextFieldHelperText: React.ComponentType<RMWC.MergeInterfacesT<TextFieldHelperTextProps, RMWC.ComponentProps>>;
-/*********************************************************************
- * Icon
- *********************************************************************/
-/**
- * An Icon in a TextField
- */
-export declare class TextFieldIcon extends FoundationComponent<MDCTextFieldIconFoundation, IconProps> {
-    static displayName: string;
-    private root;
-    getDefaultFoundation(): MDCTextFieldIconFoundation;
-    render(): JSX.Element;
-}
-export {};