@webiny/ui 5.40.0-beta.2 → 5.40.0-beta.4

package/Ripple/Ripple.js

@@ -11,11 +11,10 @@ var _ripple = require("@rmwc/ripple");
 /**
  * Use Ripple component to display a list of choices, once the handler is triggered.
  */
-var Ripple = function Ripple(props) {
+var Ripple = exports.Ripple = function Ripple(props) {
   // Let's pass "unbounded" / "primary" / "accent" flags as "type" prop instead.
   var type = props.type || "surface";
   return /*#__PURE__*/_react.default.createElement(_ripple.Ripple, Object.assign({}, (0, _defineProperty2.default)({}, type, true), props), props.children);
 };
-exports.Ripple = Ripple;
 
 //# sourceMappingURL=Ripple.js.map

package/Ripple/Ripple.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_ripple","Ripple","props","type","default","createElement","Object","assign","_defineProperty2","children","exports"],"sources":["Ripple.tsx"],"sourcesContent":["import React from \"react\";\nimport { Ripple as RmwcRipple } from \"@rmwc/ripple\";\n\ninterface Props {\n    // Choose the type of ripple.\n    type?: \"unbounded\" | \"primary\" | \"accent\";\n\n    // Makes the ripple disabled.\n    disabled?: boolean;\n\n    children: React.ReactNode;\n}\n\n/**\n * Use Ripple component to display a list of choices, once the handler is triggered.\n */\nconst Ripple = (props: Props) => {\n    // Let's pass \"unbounded\" / \"primary\" / \"accent\" flags as \"type\" prop instead.\n    const type = props.type || \"surface\";\n\n    return (\n        <RmwcRipple {...{ [type]: true }} {...props}>\n            {props.children}\n        </RmwcRipple>\n    );\n};\n\nexport { Ripple };\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AAYA;AACA;AACA;AACA,IAAME,MAAM,GAAG,SAATA,MAAMA,CAAIC,KAAY,EAAK;EAC7B;EACA,IAAMC,IAAI,GAAGD,KAAK,CAACC,IAAI,IAAI,SAAS;EAEpC,oBACIN,MAAA,CAAAO,OAAA,CAAAC,aAAA,CAACL,OAAA,CAAAC,MAAU,EAAAK,MAAA,CAAAC,MAAA,SAAAC,gBAAA,CAAAJ,OAAA,MAAQD,IAAI,EAAG,IAAI,GAAQD,KAAK,GACtCA,KAAK,CAACO,QACC,CAAC;AAErB,CAAC;AAACC,OAAA,CAAAT,MAAA,GAAAA,MAAA"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_ripple","Ripple","exports","props","type","default","createElement","Object","assign","_defineProperty2","children"],"sources":["Ripple.tsx"],"sourcesContent":["import React from \"react\";\nimport { Ripple as RmwcRipple } from \"@rmwc/ripple\";\n\ninterface Props {\n    // Choose the type of ripple.\n    type?: \"unbounded\" | \"primary\" | \"accent\";\n\n    // Makes the ripple disabled.\n    disabled?: boolean;\n\n    children: React.ReactNode;\n}\n\n/**\n * Use Ripple component to display a list of choices, once the handler is triggered.\n */\nconst Ripple = (props: Props) => {\n    // Let's pass \"unbounded\" / \"primary\" / \"accent\" flags as \"type\" prop instead.\n    const type = props.type || \"surface\";\n\n    return (\n        <RmwcRipple {...{ [type]: true }} {...props}>\n            {props.children}\n        </RmwcRipple>\n    );\n};\n\nexport { Ripple };\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AAYA;AACA;AACA;AACA,IAAME,MAAM,GAAAC,OAAA,CAAAD,MAAA,GAAG,SAATA,MAAMA,CAAIE,KAAY,EAAK;EAC7B;EACA,IAAMC,IAAI,GAAGD,KAAK,CAACC,IAAI,IAAI,SAAS;EAEpC,oBACIP,MAAA,CAAAQ,OAAA,CAAAC,aAAA,CAACN,OAAA,CAAAC,MAAU,EAAAM,MAAA,CAAAC,MAAA,SAAAC,gBAAA,CAAAJ,OAAA,MAAQD,IAAI,EAAG,IAAI,GAAQD,KAAK,GACtCA,KAAK,CAACO,QACC,CAAC;AAErB,CAAC","ignoreList":[]}

package/Ripple/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Ripple","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["index.ts"],"sourcesContent":["export * from \"./Ripple\";\n"],"mappings":";;;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,OAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,OAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,OAAA,CAAAK,GAAA;IAAA;EAAA;AAAA"}
+{"version":3,"names":["_Ripple","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["index.ts"],"sourcesContent":["export * from \"./Ripple\";\n"],"mappings":";;;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,OAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,OAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,OAAA,CAAAK,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}

package/Scrollbar/Scrollbar.d.ts

@@ -7,5 +7,5 @@ interface Props extends ScrollbarProps {
 /**
  * Use Scrollbar component to show vertical or horizontal scrollbars.
  */
-declare const Scrollbar: (props: Props) => JSX.Element;
+declare const Scrollbar: (props: Props) => React.JSX.Element;
 export { Scrollbar };

package/Scrollbar/Scrollbar.js

@@ -10,9 +10,8 @@ var _reactCustomScrollbars = require("react-custom-scrollbars");
 /**
  * Use Scrollbar component to show vertical or horizontal scrollbars.
  */
-var Scrollbar = function Scrollbar(props) {
+var Scrollbar = exports.Scrollbar = function Scrollbar(props) {
   return /*#__PURE__*/_react.default.createElement(_reactCustomScrollbars.Scrollbars, props);
 };
-exports.Scrollbar = Scrollbar;
 
 //# sourceMappingURL=Scrollbar.js.map

package/Scrollbar/Scrollbar.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_reactCustomScrollbars","Scrollbar","props","default","createElement","Scrollbars","exports"],"sources":["Scrollbar.tsx"],"sourcesContent":["import React from \"react\";\nimport { ScrollbarProps, Scrollbars } from \"react-custom-scrollbars\";\n\ninterface Props extends ScrollbarProps {\n    style?: React.CSSProperties;\n    [key: string]: any;\n}\n\n/**\n * Use Scrollbar component to show vertical or horizontal scrollbars.\n */\nconst Scrollbar = (props: Props) => {\n    return <Scrollbars {...props} />;\n};\n\nexport { Scrollbar };\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,sBAAA,GAAAD,OAAA;AAOA;AACA;AACA;AACA,IAAME,SAAS,GAAG,SAAZA,SAASA,CAAIC,KAAY,EAAK;EAChC,oBAAOL,MAAA,CAAAM,OAAA,CAAAC,aAAA,CAACJ,sBAAA,CAAAK,UAAU,EAAKH,KAAQ,CAAC;AACpC,CAAC;AAACI,OAAA,CAAAL,SAAA,GAAAA,SAAA"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_reactCustomScrollbars","Scrollbar","exports","props","default","createElement","Scrollbars"],"sources":["Scrollbar.tsx"],"sourcesContent":["import React from \"react\";\nimport { ScrollbarProps, Scrollbars } from \"react-custom-scrollbars\";\n\ninterface Props extends ScrollbarProps {\n    style?: React.CSSProperties;\n    [key: string]: any;\n}\n\n/**\n * Use Scrollbar component to show vertical or horizontal scrollbars.\n */\nconst Scrollbar = (props: Props) => {\n    return <Scrollbars {...props} />;\n};\n\nexport { Scrollbar };\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,sBAAA,GAAAD,OAAA;AAOA;AACA;AACA;AACA,IAAME,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAG,SAAZA,SAASA,CAAIE,KAAY,EAAK;EAChC,oBAAON,MAAA,CAAAO,OAAA,CAAAC,aAAA,CAACL,sBAAA,CAAAM,UAAU,EAAKH,KAAQ,CAAC;AACpC,CAAC","ignoreList":[]}

package/Scrollbar/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Scrollbar","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["index.ts"],"sourcesContent":["export * from \"./Scrollbar\";\n"],"mappings":";;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,UAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,UAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,UAAA,CAAAK,GAAA;IAAA;EAAA;AAAA"}
+{"version":3,"names":["_Scrollbar","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["index.ts"],"sourcesContent":["export * from \"./Scrollbar\";\n"],"mappings":";;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,UAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,UAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,UAAA,CAAAK,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}

package/Section/index.d.ts

@@ -3,5 +3,5 @@ interface SectionProps {
     title?: string;
     children: React.ReactNode;
 }
-declare const Section: ({ children, title, ...props }: SectionProps) => JSX.Element;
+declare const Section: ({ children, title, ...props }: SectionProps) => React.JSX.Element;
 export default Section;

package/Section/index.js

@@ -6,20 +6,28 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _base = _interopRequireDefault(require("@emotion/styled/base"));
 var _react = _interopRequireDefault(require("react"));
-var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _emotion = require("emotion");
 var _Typography = require("../Typography");
 var _Elevation = require("../Elevation");
 var _excluded = ["children", "title"];
-var SectionWrapper = /*#__PURE__*/(0, _styled.default)("div", {
-  target: "e12inb750",
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+var SectionWrapper = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+  target: "e12inb751"
+} : {
+  target: "e12inb751",
   label: "SectionWrapper"
-})({
-  backgroundColor: "var(--mdc-theme-background)",
-  padding: "0 0 25px 0"
+})(process.env.NODE_ENV === "production" ? {
+  name: "15r7252",
+  styles: "background-color:var(--mdc-theme-background);padding:0 0 25px 0"
+} : {
+  name: "15r7252",
+  styles: "background-color:var(--mdc-theme-background);padding:0 0 25px 0",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImluZGV4LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNdUIiLCJmaWxlIjoiaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiZW1vdGlvblwiO1xuaW1wb3J0IHsgVHlwb2dyYXBoeSB9IGZyb20gXCJ+L1R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IEVsZXZhdGlvbiB9IGZyb20gXCJ+L0VsZXZhdGlvblwiO1xuXG5jb25zdCBTZWN0aW9uV3JhcHBlciA9IHN0eWxlZChcImRpdlwiKSh7XG4gICAgYmFja2dyb3VuZENvbG9yOiBcInZhcigtLW1kYy10aGVtZS1iYWNrZ3JvdW5kKVwiLFxuICAgIHBhZGRpbmc6IFwiMCAwIDI1cHggMFwiXG59KTtcblxuY29uc3QgdGl0bGVTdHlsZSA9IGNzcyh7XG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgICBjb2xvcjogXCJ2YXIoLS1tZGMtdGhlbWUtb24tc3VyZmFjZSlcIixcbiAgICBcIi50b29sdGlwLWNvbnRlbnQtd3JhcHBlclwiOiB7XG4gICAgICAgIGxpbmVIZWlnaHQ6IFwiMTAwJVwiLFxuICAgICAgICBzdmc6IHtcbiAgICAgICAgICAgIGhlaWdodDogMTMsXG4gICAgICAgICAgICBjb2xvcjogXCJ2YXIoLS1tZGMtdGhlbWUtb24tc3VyZmFjZSlcIlxuICAgICAgICB9XG4gICAgfVxufSk7XG5cbmNvbnN0IEVsZXZhdGlvbkNvbnRlbnQgPSBzdHlsZWQoXCJkaXZcIikoe1xuICAgIHBhZGRpbmc6IDIwLFxuICAgIGJhY2tncm91bmRDb2xvcjogXCIjZmZmXCJcbn0pO1xuXG5pbnRlcmZhY2UgU2VjdGlvblByb3BzIHtcbiAgICB0aXRsZT86IHN0cmluZztcbiAgICBjaGlsZHJlbjogUmVhY3QuUmVhY3ROb2RlO1xufVxuXG5jb25zdCBTZWN0aW9uID0gKHsgY2hpbGRyZW4sIHRpdGxlLCAuLi5wcm9wcyB9OiBTZWN0aW9uUHJvcHMpID0+IHtcbiAgICByZXR1cm4gKFxuICAgICAgICA8U2VjdGlvbldyYXBwZXIgey4uLnByb3BzfT5cbiAgICAgICAgICAgIDxoND5cbiAgICAgICAgICAgICAgICA8VHlwb2dyYXBoeSBjbGFzc05hbWU9e3RpdGxlU3R5bGV9IHVzZT17XCJvdmVybGluZVwifT5cbiAgICAgICAgICAgICAgICAgICAge3RpdGxlfVxuICAgICAgICAgICAgICAgIDwvVHlwb2dyYXBoeT5cbiAgICAgICAgICAgIDwvaDQ+XG5cbiAgICAgICAgICAgIDxFbGV2YXRpb24gej17Mn0+XG4gICAgICAgICAgICAgICAgPEVsZXZhdGlvbkNvbnRlbnQ+e2NoaWxkcmVufTwvRWxldmF0aW9uQ29udGVudD5cbiAgICAgICAgICAgIDwvRWxldmF0aW9uPlxuICAgICAgICA8L1NlY3Rpb25XcmFwcGVyPlxuICAgICk7XG59O1xuXG5leHBvcnQgZGVmYXVsdCBTZWN0aW9uO1xuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
-var titleStyle = /*#__PURE__*/(0, _emotion.css)({
+var titleStyle = (0, _emotion.css)({
   display: "flex",
   alignItems: "center",
   color: "var(--mdc-theme-on-surface)",
@@ -30,13 +38,20 @@ var titleStyle = /*#__PURE__*/(0, _emotion.css)({
       color: "var(--mdc-theme-on-surface)"
     }
   }
-}, "label:titleStyle;");
-var ElevationContent = /*#__PURE__*/(0, _styled.default)("div", {
-  target: "e12inb751",
+});
+var ElevationContent = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+  target: "e12inb750"
+} : {
+  target: "e12inb750",
   label: "ElevationContent"
-})({
-  padding: 20,
-  backgroundColor: "#fff"
+})(process.env.NODE_ENV === "production" ? {
+  name: "bb8b2n",
+  styles: "padding:20px;background-color:#fff"
+} : {
+  name: "bb8b2n",
+  styles: "padding:20px;background-color:#fff",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImluZGV4LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF3QnlCIiwiZmlsZSI6ImluZGV4LnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSBcImVtb3Rpb25cIjtcbmltcG9ydCB7IFR5cG9ncmFwaHkgfSBmcm9tIFwifi9UeXBvZ3JhcGh5XCI7XG5pbXBvcnQgeyBFbGV2YXRpb24gfSBmcm9tIFwifi9FbGV2YXRpb25cIjtcblxuY29uc3QgU2VjdGlvbldyYXBwZXIgPSBzdHlsZWQoXCJkaXZcIikoe1xuICAgIGJhY2tncm91bmRDb2xvcjogXCJ2YXIoLS1tZGMtdGhlbWUtYmFja2dyb3VuZClcIixcbiAgICBwYWRkaW5nOiBcIjAgMCAyNXB4IDBcIlxufSk7XG5cbmNvbnN0IHRpdGxlU3R5bGUgPSBjc3Moe1xuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gICAgY29sb3I6IFwidmFyKC0tbWRjLXRoZW1lLW9uLXN1cmZhY2UpXCIsXG4gICAgXCIudG9vbHRpcC1jb250ZW50LXdyYXBwZXJcIjoge1xuICAgICAgICBsaW5lSGVpZ2h0OiBcIjEwMCVcIixcbiAgICAgICAgc3ZnOiB7XG4gICAgICAgICAgICBoZWlnaHQ6IDEzLFxuICAgICAgICAgICAgY29sb3I6IFwidmFyKC0tbWRjLXRoZW1lLW9uLXN1cmZhY2UpXCJcbiAgICAgICAgfVxuICAgIH1cbn0pO1xuXG5jb25zdCBFbGV2YXRpb25Db250ZW50ID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgICBwYWRkaW5nOiAyMCxcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IFwiI2ZmZlwiXG59KTtcblxuaW50ZXJmYWNlIFNlY3Rpb25Qcm9wcyB7XG4gICAgdGl0bGU/OiBzdHJpbmc7XG4gICAgY2hpbGRyZW46IFJlYWN0LlJlYWN0Tm9kZTtcbn1cblxuY29uc3QgU2VjdGlvbiA9ICh7IGNoaWxkcmVuLCB0aXRsZSwgLi4ucHJvcHMgfTogU2VjdGlvblByb3BzKSA9PiB7XG4gICAgcmV0dXJuIChcbiAgICAgICAgPFNlY3Rpb25XcmFwcGVyIHsuLi5wcm9wc30+XG4gICAgICAgICAgICA8aDQ+XG4gICAgICAgICAgICAgICAgPFR5cG9ncmFwaHkgY2xhc3NOYW1lPXt0aXRsZVN0eWxlfSB1c2U9e1wib3ZlcmxpbmVcIn0+XG4gICAgICAgICAgICAgICAgICAgIHt0aXRsZX1cbiAgICAgICAgICAgICAgICA8L1R5cG9ncmFwaHk+XG4gICAgICAgICAgICA8L2g0PlxuXG4gICAgICAgICAgICA8RWxldmF0aW9uIHo9ezJ9PlxuICAgICAgICAgICAgICAgIDxFbGV2YXRpb25Db250ZW50PntjaGlsZHJlbn08L0VsZXZhdGlvbkNvbnRlbnQ+XG4gICAgICAgICAgICA8L0VsZXZhdGlvbj5cbiAgICAgICAgPC9TZWN0aW9uV3JhcHBlcj5cbiAgICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgU2VjdGlvbjtcbiJdfQ== */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
 var Section = function Section(_ref) {
   var children = _ref.children,
@@ -49,7 +64,6 @@ var Section = function Section(_ref) {
     z: 2
   }, /*#__PURE__*/_react.default.createElement(ElevationContent, null, children)));
 };
-var _default = Section;
-exports.default = _default;
+var _default = exports.default = Section;
 
 //# sourceMappingURL=index.js.map

package/Section/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_styled","_emotion","_Typography","_Elevation","_excluded","SectionWrapper","styled","target","label","backgroundColor","padding","titleStyle","css","display","alignItems","color","lineHeight","svg","height","ElevationContent","Section","_ref","children","title","props","_objectWithoutProperties2","default","createElement","Typography","className","use","Elevation","z","_default","exports"],"sources":["index.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { css } from \"emotion\";\nimport { Typography } from \"~/Typography\";\nimport { Elevation } from \"~/Elevation\";\n\nconst SectionWrapper = styled(\"div\")({\n    backgroundColor: \"var(--mdc-theme-background)\",\n    padding: \"0 0 25px 0\"\n});\n\nconst titleStyle = css({\n    display: \"flex\",\n    alignItems: \"center\",\n    color: \"var(--mdc-theme-on-surface)\",\n    \".tooltip-content-wrapper\": {\n        lineHeight: \"100%\",\n        svg: {\n            height: 13,\n            color: \"var(--mdc-theme-on-surface)\"\n        }\n    }\n});\n\nconst ElevationContent = styled(\"div\")({\n    padding: 20,\n    backgroundColor: \"#fff\"\n});\n\ninterface SectionProps {\n    title?: string;\n    children: React.ReactNode;\n}\n\nconst Section = ({ children, title, ...props }: SectionProps) => {\n    return (\n        <SectionWrapper {...props}>\n            <h4>\n                <Typography className={titleStyle} use={\"overline\"}>\n                    {title}\n                </Typography>\n            </h4>\n\n            <Elevation z={2}>\n                <ElevationContent>{children}</ElevationContent>\n            </Elevation>\n        </SectionWrapper>\n    );\n};\n\nexport default Section;\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,QAAA,GAAAF,OAAA;AACA,IAAAG,WAAA,GAAAH,OAAA;AACA,IAAAI,UAAA,GAAAJ,OAAA;AAAwC,IAAAK,SAAA;AAExC,IAAMC,cAAc,oBAAGC,eAAM,EAAC,KAAK;EAAAC,MAAA;EAAAC,KAAA;AAAA,GAAE;EACjCC,eAAe,EAAE,6BAA6B;EAC9CC,OAAO,EAAE;AACb,CAAC,CAAC;AAEF,IAAMC,UAAU,gBAAG,IAAAC,YAAG,EAAC;EACnBC,OAAO,EAAE,MAAM;EACfC,UAAU,EAAE,QAAQ;EACpBC,KAAK,EAAE,6BAA6B;EACpC,0BAA0B,EAAE;IACxBC,UAAU,EAAE,MAAM;IAClBC,GAAG,EAAE;MACDC,MAAM,EAAE,EAAE;MACVH,KAAK,EAAE;IACX;EACJ;AACJ,CAAC,sBAAC;AAEF,IAAMI,gBAAgB,oBAAGb,eAAM,EAAC,KAAK;EAAAC,MAAA;EAAAC,KAAA;AAAA,GAAE;EACnCE,OAAO,EAAE,EAAE;EACXD,eAAe,EAAE;AACrB,CAAC,CAAC;AAOF,IAAMW,OAAO,GAAG,SAAVA,OAAOA,CAAAC,IAAA,EAAoD;EAAA,IAA9CC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAEC,KAAK,GAAAF,IAAA,CAALE,KAAK;IAAKC,KAAK,OAAAC,yBAAA,CAAAC,OAAA,EAAAL,IAAA,EAAAjB,SAAA;EACxC,oBACIP,MAAA,CAAA6B,OAAA,CAAAC,aAAA,CAACtB,cAAc,EAAKmB,KAAK,eACrB3B,MAAA,CAAA6B,OAAA,CAAAC,aAAA,0BACI9B,MAAA,CAAA6B,OAAA,CAAAC,aAAA,CAACzB,WAAA,CAAA0B,UAAU;IAACC,SAAS,EAAElB,UAAW;IAACmB,GAAG,EAAE;EAAW,GAC9CP,KACO,CACZ,CAAC,eAEL1B,MAAA,CAAA6B,OAAA,CAAAC,aAAA,CAACxB,UAAA,CAAA4B,SAAS;IAACC,CAAC,EAAE;EAAE,gBACZnC,MAAA,CAAA6B,OAAA,CAAAC,aAAA,CAACR,gBAAgB,QAAEG,QAA2B,CACvC,CACC,CAAC;AAEzB,CAAC;AAAC,IAAAW,QAAA,GAEab,OAAO;AAAAc,OAAA,CAAAR,OAAA,GAAAO,QAAA"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_emotion","_Typography","_Elevation","_excluded","_EMOTION_STRINGIFIED_CSS_ERROR__","SectionWrapper","_base","default","process","env","NODE_ENV","target","label","name","styles","map","toString","titleStyle","css","display","alignItems","color","lineHeight","svg","height","ElevationContent","Section","_ref","children","title","props","_objectWithoutProperties2","createElement","Typography","className","use","Elevation","z","_default","exports"],"sources":["index.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { css } from \"emotion\";\nimport { Typography } from \"~/Typography\";\nimport { Elevation } from \"~/Elevation\";\n\nconst SectionWrapper = styled(\"div\")({\n    backgroundColor: \"var(--mdc-theme-background)\",\n    padding: \"0 0 25px 0\"\n});\n\nconst titleStyle = css({\n    display: \"flex\",\n    alignItems: \"center\",\n    color: \"var(--mdc-theme-on-surface)\",\n    \".tooltip-content-wrapper\": {\n        lineHeight: \"100%\",\n        svg: {\n            height: 13,\n            color: \"var(--mdc-theme-on-surface)\"\n        }\n    }\n});\n\nconst ElevationContent = styled(\"div\")({\n    padding: 20,\n    backgroundColor: \"#fff\"\n});\n\ninterface SectionProps {\n    title?: string;\n    children: React.ReactNode;\n}\n\nconst Section = ({ children, title, ...props }: SectionProps) => {\n    return (\n        <SectionWrapper {...props}>\n            <h4>\n                <Typography className={titleStyle} use={\"overline\"}>\n                    {title}\n                </Typography>\n            </h4>\n\n            <Elevation z={2}>\n                <ElevationContent>{children}</ElevationContent>\n            </Elevation>\n        </SectionWrapper>\n    );\n};\n\nexport default Section;\n"],"mappings":";;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AACA,IAAAG,UAAA,GAAAH,OAAA;AAAwC,IAAAI,SAAA;AAAA,SAAAC,iCAAA;AAExC,IAAMC,cAAc,gBAAG,IAAAC,KAAA,CAAAC,OAAA,EAAO,KAAK,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,EAAC,CAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAZ;AAAA,CAGnC,CAAC;AAEF,IAAMa,UAAU,GAAG,IAAAC,YAAG,EAAC;EACnBC,OAAO,EAAE,MAAM;EACfC,UAAU,EAAE,QAAQ;EACpBC,KAAK,EAAE,6BAA6B;EACpC,0BAA0B,EAAE;IACxBC,UAAU,EAAE,MAAM;IAClBC,GAAG,EAAE;MACDC,MAAM,EAAE,EAAE;MACVH,KAAK,EAAE;IACX;EACJ;AACJ,CAAC,CAAC;AAEF,IAAMI,gBAAgB,gBAAG,IAAAnB,KAAA,CAAAC,OAAA,EAAO,KAAK,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,EAAC,CAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAZ;AAAA,CAGrC,CAAC;AAOF,IAAMsB,OAAO,GAAG,SAAVA,OAAOA,CAAAC,IAAA,EAAoD;EAAA,IAA9CC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAEC,KAAK,GAAAF,IAAA,CAALE,KAAK;IAAKC,KAAK,OAAAC,yBAAA,CAAAxB,OAAA,EAAAoB,IAAA,EAAAxB,SAAA;EACxC,oBACIN,MAAA,CAAAU,OAAA,CAAAyB,aAAA,CAAC3B,cAAc,EAAKyB,KAAK,eACrBjC,MAAA,CAAAU,OAAA,CAAAyB,aAAA,0BACInC,MAAA,CAAAU,OAAA,CAAAyB,aAAA,CAAC/B,WAAA,CAAAgC,UAAU;IAACC,SAAS,EAAEjB,UAAW;IAACkB,GAAG,EAAE;EAAW,GAC9CN,KACO,CACZ,CAAC,eAELhC,MAAA,CAAAU,OAAA,CAAAyB,aAAA,CAAC9B,UAAA,CAAAkC,SAAS;IAACC,CAAC,EAAE;EAAE,gBACZxC,MAAA,CAAAU,OAAA,CAAAyB,aAAA,CAACP,gBAAgB,QAAEG,QAA2B,CACvC,CACC,CAAC;AAEzB,CAAC;AAAC,IAAAU,QAAA,GAAAC,OAAA,CAAAhC,OAAA,GAEamB,OAAO","ignoreList":[]}

package/Select/Select.d.ts

@@ -18,5 +18,5 @@ export declare type SelectProps = FormComponentProps & RmwcSelectProps & {
  * We check for null and undefined in the value because React is complaining about those values.
  * Error says to use the empty string in null/undefined case.
  */
-export declare const Select: (props: SelectProps) => JSX.Element;
+export declare const Select: (props: SelectProps) => React.JSX.Element;
 export default Select;

package/Select/Select.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.Select = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
 var _react = _interopRequireDefault(require("react"));
@@ -13,7 +12,7 @@ var _select = require("@rmwc/select");
 var _FormElementMessage = require("../FormElementMessage");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _styled = require("./styled");
-var _excluded = ["value", "description", "validation"];
+var _excluded = ["value", "description", "validation", "placeholder"];
 /**
  * TODO verify that this is correct method get all options.
  */
@@ -74,10 +73,11 @@ var getRmwcProps = function getRmwcProps(props) {
  * We check for null and undefined in the value because React is complaining about those values.
  * Error says to use the empty string in null/undefined case.
  */
-var Select = function Select(props) {
+var Select = exports.Select = function Select(props) {
   var initialValue = props.value,
     description = props.description,
     validation = props.validation,
+    placeholder = props.placeholder,
     other = (0, _objectWithoutProperties2.default)(props, _excluded);
   var value = initialValue === null || initialValue === undefined ? "" : initialValue;
   var _ref = validation || {},
@@ -85,9 +85,12 @@ var Select = function Select(props) {
     validationMessage = _ref.message;
   var options = getOptions(other.options);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_select.Select, Object.assign({}, getRmwcProps(other), {
+    ref: undefined,
     options: options,
     value: value,
-    className: (0, _classnames.default)("webiny-ui-select mdc-ripple-surface mdc-ripple-upgraded", _styled.webinySelect, props.size ? "webiny-ui-select--size-".concat(props.size) : null, props.className, (0, _defineProperty2.default)({}, _styled.noLabel, !props.label)),
+    placeholder: placeholder ?? "" // Fix RMWC version 14.2.2 to make the label float by default when a predefined value is selected.
+    ,
+    className: (0, _classnames.default)("webiny-ui-select mdc-ripple-surface mdc-ripple-upgraded", _styled.webinySelect, props.size ? "webiny-ui-select--size-".concat(props.size) : null, props.className),
     onChange: function onChange(e) {
       props.onChange && props.onChange(e.target.value);
     }
@@ -95,8 +98,6 @@ var Select = function Select(props) {
     error: true
   }, validationMessage), validationIsValid !== false && description && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, null, description));
 };
-exports.Select = Select;
-var _default = Select;
-exports.default = _default;
+var _default = exports.default = Select;
 
 //# sourceMappingURL=Select.js.map

package/Select/Select.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_select","_FormElementMessage","_classnames","_styled","_excluded","getOptions","initialOptions","Array","isArray","options","_iterator","_createForOfIteratorHelper2","default","_step","s","n","done","option","value","push","label","err","e","f","Object","keys","map","key","skipProps","getRmwcProps","props","newProps","filter","name","includes","forEach","Select","initialValue","description","validation","other","_objectWithoutProperties2","undefined","_ref","validationIsValid","isValid","validationMessage","message","createElement","Fragment","assign","className","classNames","webinySelect","size","concat","_defineProperty2","noLabel","onChange","target","FormElementMessage","error","exports","_default"],"sources":["Select.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n    FormattedOption,\n    Select as RmwcSelect,\n    SelectProps as RmwcSelectProps\n} from \"@rmwc/select\";\nimport { FormElementMessage } from \"~/FormElementMessage\";\nimport { FormComponentProps } from \"~/types\";\nimport classNames from \"classnames\";\nimport { webinySelect, noLabel } from \"./styled\";\n\nexport type SelectProps = FormComponentProps &\n    RmwcSelectProps & {\n        // Component label.\n        label?: string;\n\n        // Is checkbox disabled?\n        disabled?: boolean;\n\n        // Description beneath the select.\n        description?: string;\n\n        // Placeholder text for the form control. Set to a blank string to create a non-floating placeholder label.\n        placeholder?: string;\n\n        // Makes the Select have a visual box.\n        box?: string;\n\n        // One or more <option> or <optgroup> elements.\n        children?: (React.ReactElement<\"option\"> | React.ReactElement<\"optgroup\">)[];\n\n        // IconProps for the root element. By default, additional props spread to the native select element.\n        rootProps?: {\n            [key: string]: any;\n        };\n\n        // A className for the root element.\n        className?: string;\n\n        // Size - small, medium or large\n        size?: \"small\" | \"medium\" | \"large\";\n    };\n\n/**\n * TODO verify that this is correct method get all options.\n */\nconst getOptions = (initialOptions: SelectProps[\"options\"]): FormattedOption[] => {\n    if (!initialOptions) {\n        return [];\n    } else if (Array.isArray(initialOptions)) {\n        const options: FormattedOption[] = [];\n        for (const option of initialOptions) {\n            if (typeof option === \"string\") {\n                options.push({\n                    label: option,\n                    value: option\n                });\n                continue;\n            }\n            options.push({\n                label: option.label,\n                value: option.value,\n                options: option.options\n            });\n        }\n        return options;\n    }\n    return Object.keys(initialOptions).map(key => {\n        return {\n            label: initialOptions[key],\n            value: key\n        };\n    });\n};\n\n/**\n * Select component lets users choose a value from given set of options.\n */\nconst skipProps = [\"validate\", \"form\"];\n\nconst getRmwcProps = (props: SelectProps): FormComponentProps & RmwcSelectProps => {\n    const newProps: FormComponentProps & RmwcSelectProps = {};\n    Object.keys(props)\n        .filter(name => !skipProps.includes(name))\n        // @ts-expect-error\n        .forEach((name: any) => (newProps[name] = props[name]));\n\n    return newProps;\n};\n/**\n * We check for null and undefined in the value because React is complaining about those values.\n * Error says to use the empty string in null/undefined case.\n */\nexport const Select = (props: SelectProps) => {\n    const { value: initialValue, description, validation, ...other } = props;\n\n    const value = initialValue === null || initialValue === undefined ? \"\" : initialValue;\n\n    const { isValid: validationIsValid, message: validationMessage } = validation || {};\n\n    const options = getOptions(other.options);\n\n    return (\n        <React.Fragment>\n            <RmwcSelect\n                {...getRmwcProps(other)}\n                options={options}\n                value={value}\n                className={classNames(\n                    \"webiny-ui-select mdc-ripple-surface mdc-ripple-upgraded\",\n                    webinySelect,\n                    props.size ? `webiny-ui-select--size-${props.size}` : null,\n                    props.className,\n                    {\n                        [noLabel]: !props.label\n                    }\n                )}\n                onChange={e => {\n                    props.onChange && props.onChange((e.target as HTMLInputElement).value);\n                }}\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\nexport default Select;\n"],"mappings":"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"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_select","_FormElementMessage","_classnames","_styled","_excluded","getOptions","initialOptions","Array","isArray","options","_iterator","_createForOfIteratorHelper2","default","_step","s","n","done","option","value","push","label","err","e","f","Object","keys","map","key","skipProps","getRmwcProps","props","newProps","filter","name","includes","forEach","Select","exports","initialValue","description","validation","placeholder","other","_objectWithoutProperties2","undefined","_ref","validationIsValid","isValid","validationMessage","message","createElement","Fragment","assign","ref","className","classNames","webinySelect","size","concat","onChange","target","FormElementMessage","error","_default"],"sources":["Select.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n    FormattedOption,\n    Select as RmwcSelect,\n    SelectProps as RmwcSelectProps\n} from \"@rmwc/select\";\nimport { FormElementMessage } from \"~/FormElementMessage\";\nimport { FormComponentProps } from \"~/types\";\nimport classNames from \"classnames\";\nimport { webinySelect } from \"./styled\";\n\nexport type SelectProps = FormComponentProps &\n    RmwcSelectProps & {\n        // Component label.\n        label?: string;\n\n        // Is checkbox disabled?\n        disabled?: boolean;\n\n        // Description beneath the select.\n        description?: string;\n\n        // Placeholder text for the form control. Set to a blank string to create a non-floating placeholder label.\n        placeholder?: string;\n\n        // Makes the Select have a visual box.\n        box?: string;\n\n        // One or more <option> or <optgroup> elements.\n        children?: (React.ReactElement<\"option\"> | React.ReactElement<\"optgroup\">)[];\n\n        // IconProps for the root element. By default, additional props spread to the native select element.\n        rootProps?: {\n            [key: string]: any;\n        };\n\n        // A className for the root element.\n        className?: string;\n\n        // Size - small, medium or large\n        size?: \"small\" | \"medium\" | \"large\";\n    };\n\n/**\n * TODO verify that this is correct method get all options.\n */\nconst getOptions = (initialOptions: SelectProps[\"options\"]): FormattedOption[] => {\n    if (!initialOptions) {\n        return [];\n    } else if (Array.isArray(initialOptions)) {\n        const options: FormattedOption[] = [];\n        for (const option of initialOptions) {\n            if (typeof option === \"string\") {\n                options.push({\n                    label: option,\n                    value: option\n                });\n                continue;\n            }\n            options.push({\n                label: option.label,\n                value: option.value,\n                options: option.options\n            });\n        }\n        return options;\n    }\n    return Object.keys(initialOptions).map(key => {\n        return {\n            label: initialOptions[key],\n            value: key\n        };\n    });\n};\n\n/**\n * Select component lets users choose a value from given set of options.\n */\nconst skipProps = [\"validate\", \"form\"];\n\nconst getRmwcProps = (props: SelectProps): FormComponentProps & RmwcSelectProps => {\n    const newProps: FormComponentProps & RmwcSelectProps = {};\n    Object.keys(props)\n        .filter(name => !skipProps.includes(name))\n        // @ts-expect-error\n        .forEach((name: any) => (newProps[name] = props[name]));\n\n    return newProps;\n};\n/**\n * We check for null and undefined in the value because React is complaining about those values.\n * Error says to use the empty string in null/undefined case.\n */\nexport const Select = (props: SelectProps) => {\n    const { value: initialValue, description, validation, placeholder, ...other } = props;\n\n    const value = initialValue === null || initialValue === undefined ? \"\" : initialValue;\n\n    const { isValid: validationIsValid, message: validationMessage } = validation || {};\n\n    const options = getOptions(other.options);\n\n    return (\n        <>\n            <RmwcSelect\n                {...getRmwcProps(other)}\n                ref={undefined}\n                options={options}\n                value={value}\n                placeholder={placeholder ?? \"\"} // Fix RMWC version 14.2.2 to make the label float by default when a predefined value is selected.\n                className={classNames(\n                    \"webiny-ui-select mdc-ripple-surface mdc-ripple-upgraded\",\n                    webinySelect,\n                    props.size ? `webiny-ui-select--size-${props.size}` : null,\n                    props.className\n                )}\n                onChange={(e: React.ChangeEvent<HTMLSelectElement>) => {\n                    props.onChange && props.onChange(e.target.value);\n                }}\n            />\n\n            {validationIsValid === false && (\n                <FormElementMessage error>{validationMessage}</FormElementMessage>\n            )}\n\n            {validationIsValid !== false && description && (\n                <FormElementMessage>{description}</FormElementMessage>\n            )}\n        </>\n    );\n};\n\nexport default Select;\n"],"mappings":"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","ignoreList":[]}

package/Select/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Select","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["index.ts"],"sourcesContent":["export * from \"./Select\";\n"],"mappings":";;;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,OAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,OAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,OAAA,CAAAK,GAAA;IAAA;EAAA;AAAA"}
+{"version":3,"names":["_Select","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["index.ts"],"sourcesContent":["export * from \"./Select\";\n"],"mappings":";;;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,OAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,OAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,OAAA,CAAAK,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}

package/Select/styled.js

@@ -1,20 +1,21 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.webinySelect = exports.noLabel = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _emotion = require("emotion");
+var _templateObject, _templateObject2;
 /**
  * @type {string}
  */
-var webinySelect = /*#__PURE__*/(0, _emotion.css)("display:grid;background-color:transparent;border-color:transparent;color:var(--webiny-theme-color-primary);.rmwc-select__native-control{opacity:0;position:absolute;top:0;bottom:0;left:0;right:0;}&.webiny-ui-select--size-medium{&.mdc-select,.mdc-select__anchor{height:40px;.mdc-select__native-control{paddingtop:0;}.mdc-select__dropdown-icon{bottom:8px;}.mdc-select__selected-text{padding-top:6px !important;padding-left:10px;font-size:0.95rem;height:40px;}&.mdc-select--box{.mdc-select__native-control{height:40px;paddingtop:5px;}}}}&.webiny-ui-select--size-small{&.mdc-select,.mdc-select__anchor{height:30px;.mdc-select__native-control{paddingtop:0;}.mdc-select__dropdown-icon{bottom:3px;}.mdc-select__selected-text{padding-top:1px !important;padding-left:10px;font-size:0.9rem;height:30px;}&.mdc-select--box{.mdc-select__native-control{height:30px;paddingtop:5px;}}}}label:webinySelect;");
+var webinySelect = exports.webinySelect = (0, _emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n    display: grid;\n    background-color: transparent;\n    border-color: transparent;\n    color: var(--webiny-theme-color-primary);\n    min-width: 200px;\n\n    .rmwc-select__native-control {\n        opacity: 0;\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        left: 0;\n        right: 0;\n    }\n\n    > .mdc-select__anchor {\n        width: auto !important;\n    }\n\n    &.webiny-ui-select--size-medium {\n        &.mdc-select,\n        .mdc-select__anchor {\n            height: 40px;\n            .mdc-select__selected-text {\n                font-size: 0.95rem;\n            }\n        }\n    }\n\n    &.webiny-ui-select--size-small {\n        &.mdc-select,\n        .mdc-select__anchor {\n            height: 30px;\n            .mdc-select__native-control {\n                padding-top: 0;\n            }\n            .mdc-select__selected-text {\n                font-size: 0.9rem;\n            }\n        }\n    }\n"])));
 
 /**
  * @type {string}
  */
-exports.webinySelect = webinySelect;
-var noLabel = /*#__PURE__*/(0, _emotion.css)("&.mdc-select{height:35px;.mdc-select__native-control{paddingTop:0;}&.mdc-select--box{.mdc-select__native-control{height:35px;paddingTop:5px;}}label:noLabel;");
-exports.noLabel = noLabel;
+var noLabel = exports.noLabel = (0, _emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n    &.mdc-select {\n        height: 35px;\n        .mdc-select__native-control {\n            padding-top: 0;\n        }\n    &.mdc-select--box {\n        .mdc-select__native-control {\n            height: 35px;\n            padding-top: 5px;\n        }\n    }\n"])));
 
 //# sourceMappingURL=styled.js.map

package/Select/styled.js.map

@@ -1 +1 @@
-{"version":3,"names":["_emotion","require","webinySelect","css","exports","noLabel"],"sources":["styled.tsx"],"sourcesContent":["import { css } from \"emotion\";\n\n/**\n * @type {string}\n */\nexport const webinySelect = css`\n    display: grid;\n    background-color: transparent;\n    border-color: transparent;\n    color: var(--webiny-theme-color-primary);\n\n    .rmwc-select__native-control {\n        opacity: 0;\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        left: 0;\n        right: 0;\n    }\n\n    &.webiny-ui-select--size-medium {\n        &.mdc-select,\n        .mdc-select__anchor {\n            height: 40px;\n            .mdc-select__native-control {\n                paddingtop: 0;\n            }\n            .mdc-select__dropdown-icon {\n                bottom: 8px;\n            }\n            .mdc-select__selected-text {\n                padding-top: 6px !important;\n                padding-left: 10px;\n                font-size: 0.95rem;\n                height: 40px;\n            }\n\n            &.mdc-select--box {\n                .mdc-select__native-control {\n                    height: 40px;\n                    paddingtop: 5px;\n                }\n            }\n        }\n    }\n\n    &.webiny-ui-select--size-small {\n        &.mdc-select,\n        .mdc-select__anchor {\n            height: 30px;\n            .mdc-select__native-control {\n                paddingtop: 0;\n            }\n            .mdc-select__dropdown-icon {\n                bottom: 3px;\n            }\n            .mdc-select__selected-text {\n                padding-top: 1px !important;\n                padding-left: 10px;\n                font-size: 0.9rem;\n                height: 30px;\n            }\n            &.mdc-select--box {\n                .mdc-select__native-control {\n                    height: 30px;\n                    paddingtop: 5px;\n                }\n            }\n        }\n    }\n`;\n\n/**\n * @type {string}\n */\nexport const noLabel = css`\n    &.mdc-select {\n        height: 35px;\n        .mdc-select__native-control {\n            paddingTop: 0;\n        }\n    &.mdc-select--box {\n        .mdc-select__native-control {\n            height: 35px;\n            paddingTop: 5px;\n        }\n    }\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,QAAA,GAAAC,OAAA;AAEA;AACA;AACA;AACO,IAAMC,YAAY,oBAAGC,YAAG,63BAiE9B;;AAED;AACA;AACA;AAFAC,OAAA,CAAAF,YAAA,GAAAA,YAAA;AAGO,IAAMG,OAAO,oBAAGF,YAAG,iKAYzB;AAACC,OAAA,CAAAC,OAAA,GAAAA,OAAA"}
+{"version":3,"names":["_emotion","require","_templateObject","_templateObject2","webinySelect","exports","css","_taggedTemplateLiteral2","default","noLabel"],"sources":["styled.tsx"],"sourcesContent":["import { css } from \"emotion\";\n\n/**\n * @type {string}\n */\nexport const webinySelect = css`\n    display: grid;\n    background-color: transparent;\n    border-color: transparent;\n    color: var(--webiny-theme-color-primary);\n    min-width: 200px;\n\n    .rmwc-select__native-control {\n        opacity: 0;\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        left: 0;\n        right: 0;\n    }\n\n    > .mdc-select__anchor {\n        width: auto !important;\n    }\n\n    &.webiny-ui-select--size-medium {\n        &.mdc-select,\n        .mdc-select__anchor {\n            height: 40px;\n            .mdc-select__selected-text {\n                font-size: 0.95rem;\n            }\n        }\n    }\n\n    &.webiny-ui-select--size-small {\n        &.mdc-select,\n        .mdc-select__anchor {\n            height: 30px;\n            .mdc-select__native-control {\n                padding-top: 0;\n            }\n            .mdc-select__selected-text {\n                font-size: 0.9rem;\n            }\n        }\n    }\n`;\n\n/**\n * @type {string}\n */\nexport const noLabel = css`\n    &.mdc-select {\n        height: 35px;\n        .mdc-select__native-control {\n            padding-top: 0;\n        }\n    &.mdc-select--box {\n        .mdc-select__native-control {\n            height: 35px;\n            padding-top: 5px;\n        }\n    }\n`;\n"],"mappings":";;;;;;;;AAAA,IAAAA,QAAA,GAAAC,OAAA;AAA8B,IAAAC,eAAA,EAAAC,gBAAA;AAE9B;AACA;AACA;AACO,IAAMC,YAAY,GAAAC,OAAA,CAAAD,YAAA,OAAGE,YAAG,EAAAJ,eAAA,KAAAA,eAAA,OAAAK,uBAAA,CAAAC,OAAA,s8BA0C9B;;AAED;AACA;AACA;AACO,IAAMC,OAAO,GAAAJ,OAAA,CAAAI,OAAA,OAAGH,YAAG,EAAAH,gBAAA,KAAAA,gBAAA,OAAAI,uBAAA,CAAAC,OAAA,iRAYzB","ignoreList":[]}

package/Skeleton/Skeleton.js

@@ -11,7 +11,7 @@ var _react = _interopRequireDefault(require("react"));
 var _reactLoadingSkeleton = _interopRequireWildcard(require("react-loading-skeleton"));
 require("react-loading-skeleton/dist/skeleton.css");
 var _excluded = ["theme"];
-var Skeleton = function Skeleton(_ref) {
+var Skeleton = exports.Skeleton = function Skeleton(_ref) {
   var theme = _ref.theme,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.SkeletonTheme, {
@@ -19,6 +19,5 @@ var Skeleton = function Skeleton(_ref) {
     highlightColor: theme === "dark" ? "var(--mdc-theme-background)" : "var(--mdc-theme-surface)"
   }, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, props));
 };
-exports.Skeleton = Skeleton;
 
 //# sourceMappingURL=Skeleton.js.map

package/Skeleton/Skeleton.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_reactLoadingSkeleton","_interopRequireWildcard","_excluded","Skeleton","_ref","theme","props","_objectWithoutProperties2","default","createElement","SkeletonTheme","baseColor","highlightColor","exports"],"sources":["Skeleton.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport ReactLoadingSkeleton, {\n    SkeletonProps as BaseSkeletonProps,\n    SkeletonTheme\n} from \"react-loading-skeleton\";\n\nimport \"react-loading-skeleton/dist/skeleton.css\";\n\ninterface SkeletonProps extends BaseSkeletonProps {\n    theme?: \"dark\" | \"light\";\n}\n\nexport const Skeleton = ({ theme, ...props }: SkeletonProps): ReactElement => {\n    return (\n        <SkeletonTheme\n            baseColor={\n                theme === \"dark\" ? \"var(--mdc-theme-on-background)\" : \"var(--mdc-theme-background)\"\n            }\n            highlightColor={\n                theme === \"dark\" ? \"var(--mdc-theme-background)\" : \"var(--mdc-theme-surface)\"\n            }\n        >\n            <ReactLoadingSkeleton {...props} />\n        </SkeletonTheme>\n    );\n};\n"],"mappings":";;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,qBAAA,GAAAC,uBAAA,CAAAF,OAAA;AAKAA,OAAA;AAAkD,IAAAG,SAAA;AAM3C,IAAMC,QAAQ,GAAG,SAAXA,QAAQA,CAAAC,IAAA,EAAyD;EAAA,IAAnDC,KAAK,GAAAD,IAAA,CAALC,KAAK;IAAKC,KAAK,OAAAC,yBAAA,CAAAC,OAAA,EAAAJ,IAAA,EAAAF,SAAA;EACtC,oBACIL,MAAA,CAAAW,OAAA,CAAAC,aAAA,CAACT,qBAAA,CAAAU,aAAa;IACVC,SAAS,EACLN,KAAK,KAAK,MAAM,GAAG,gCAAgC,GAAG,6BACzD;IACDO,cAAc,EACVP,KAAK,KAAK,MAAM,GAAG,6BAA6B,GAAG;EACtD,gBAEDR,MAAA,CAAAW,OAAA,CAAAC,aAAA,CAACT,qBAAA,CAAAQ,OAAoB,EAAKF,KAAQ,CACvB,CAAC;AAExB,CAAC;AAACO,OAAA,CAAAV,QAAA,GAAAA,QAAA"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_reactLoadingSkeleton","_interopRequireWildcard","_excluded","Skeleton","exports","_ref","theme","props","_objectWithoutProperties2","default","createElement","SkeletonTheme","baseColor","highlightColor"],"sources":["Skeleton.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport ReactLoadingSkeleton, {\n    SkeletonProps as BaseSkeletonProps,\n    SkeletonTheme\n} from \"react-loading-skeleton\";\n\nimport \"react-loading-skeleton/dist/skeleton.css\";\n\ninterface SkeletonProps extends BaseSkeletonProps {\n    theme?: \"dark\" | \"light\";\n}\n\nexport const Skeleton = ({ theme, ...props }: SkeletonProps): ReactElement => {\n    return (\n        <SkeletonTheme\n            baseColor={\n                theme === \"dark\" ? \"var(--mdc-theme-on-background)\" : \"var(--mdc-theme-background)\"\n            }\n            highlightColor={\n                theme === \"dark\" ? \"var(--mdc-theme-background)\" : \"var(--mdc-theme-surface)\"\n            }\n        >\n            <ReactLoadingSkeleton {...props} />\n        </SkeletonTheme>\n    );\n};\n"],"mappings":";;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,qBAAA,GAAAC,uBAAA,CAAAF,OAAA;AAKAA,OAAA;AAAkD,IAAAG,SAAA;AAM3C,IAAMC,QAAQ,GAAAC,OAAA,CAAAD,QAAA,GAAG,SAAXA,QAAQA,CAAAE,IAAA,EAAyD;EAAA,IAAnDC,KAAK,GAAAD,IAAA,CAALC,KAAK;IAAKC,KAAK,OAAAC,yBAAA,CAAAC,OAAA,EAAAJ,IAAA,EAAAH,SAAA;EACtC,oBACIL,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACV,qBAAA,CAAAW,aAAa;IACVC,SAAS,EACLN,KAAK,KAAK,MAAM,GAAG,gCAAgC,GAAG,6BACzD;IACDO,cAAc,EACVP,KAAK,KAAK,MAAM,GAAG,6BAA6B,GAAG;EACtD,gBAEDT,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACV,qBAAA,CAAAS,OAAoB,EAAKF,KAAQ,CACvB,CAAC;AAExB,CAAC","ignoreList":[]}

package/Skeleton/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Skeleton","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["index.ts"],"sourcesContent":["export * from \"./Skeleton\";\n"],"mappings":";;;;;AAAA,IAAAA,SAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,SAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,SAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,SAAA,CAAAK,GAAA;IAAA;EAAA;AAAA"}
+{"version":3,"names":["_Skeleton","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["index.ts"],"sourcesContent":["export * from \"./Skeleton\";\n"],"mappings":";;;;;AAAA,IAAAA,SAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,SAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,SAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,SAAA,CAAAK,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}

package/Slider/Slider.d.ts

@@ -10,6 +10,7 @@ declare type Props = FormComponentProps & {
     discrete?: boolean;
     displayMarkers?: boolean;
     onInput?: (value: any) => void;
+    readOnly?: boolean;
 };
 /**
  * Slider component lets users choose a value from given range.
@@ -25,6 +26,6 @@ declare class Slider extends React.Component<Props> {
             value: number;
         };
     }) => void;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
 export default Slider;

package/Slider/Slider.js

@@ -7,47 +7,51 @@ Object.defineProperty(exports, "__esModule", {
 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 _callSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/callSuper"));
 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 _base = _interopRequireDefault(require("@emotion/styled/base"));
 var _react = _interopRequireDefault(require("react"));
 var _slider = require("@rmwc/slider");
-var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _FormElementMessage = require("../FormElementMessage");
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 // wrapper fixes a bug in slider where the slider handle is rendered outside the bounds of the slider box
-var Wrapper = /*#__PURE__*/(0, _styled.default)("div", {
+var Wrapper = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+  target: "e1ll7sdi0"
+} : {
   target: "e1ll7sdi0",
   label: "Wrapper"
-})({
-  width: "100%",
-  ".mdc-slider .mdc-slider__thumb-container": {
-    left: 5
-  }
+})(process.env.NODE_ENV === "production" ? {
+  name: "1y22u0r",
+  styles: "width:100%;.mdc-slider .mdc-slider__thumb-container{left:5px;}"
+} : {
+  name: "1y22u0r",
+  styles: "width:100%;.mdc-slider .mdc-slider__thumb-container{left:5px;}",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlNsaWRlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBc0NnQiIsImZpbGUiOiJTbGlkZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHsgU2xpZGVyIGFzIFJtd2NTbGlkZXIgfSBmcm9tIFwiQHJtd2Mvc2xpZGVyXCI7XG5pbXBvcnQgeyBGb3JtQ29tcG9uZW50UHJvcHMgfSBmcm9tIFwifi90eXBlc1wiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBGb3JtRWxlbWVudE1lc3NhZ2UgfSBmcm9tIFwifi9Gb3JtRWxlbWVudE1lc3NhZ2VcIjtcblxudHlwZSBQcm9wcyA9IEZvcm1Db21wb25lbnRQcm9wcyAmIHtcbiAgICAvLyBDb21wb25lbnQgbGFiZWwuXG4gICAgbGFiZWw/OiBzdHJpbmc7XG5cbiAgICAvLyBJcyBjaGVja2JveCBkaXNhYmxlZD9cbiAgICBkaXNhYmxlZD86IGJvb2xlYW47XG5cbiAgICAvLyBEZXNjcmlwdGlvbiBiZW5lYXRoIHRoZSBzbGlkZXIuXG4gICAgZGVzY3JpcHRpb24/OiBzdHJpbmc7XG5cbiAgICAvLyBUaGUgbWluaW11bSB2YWx1ZSBvZiB0aGUgU2xpZGVyLlxuICAgIG1pbjogbnVtYmVyIHwgc3RyaW5nO1xuXG4gICAgLy8gVGhlIG1heGltdW0gdmFsdWUgb2YgdGhlIFNsaWRlci5cbiAgICBtYXg6IG51bWJlciB8IHN0cmluZztcblxuICAgIC8vIEEgc3RlcCB0byBxdWFudGl6ZSB2YWx1ZXMgYnkuXG4gICAgc3RlcD86IG51bWJlciB8IHN0cmluZztcblxuICAgIC8vIERpc3BsYXlzIHRoZSBleGFjdCB2YWx1ZSBvZiB0aGUgU2xpZGVyIG9uIHRoZSBrbm9iLlxuICAgIGRpc2NyZXRlPzogYm9vbGVhbjtcblxuICAgIC8vIERpc3BsYXlzIHRoZSBpbmRpdmlkdWFsIHN0ZXAgbWFya2VycyBvbiB0aGUgU2xpZGVyIHRyYWNrLlxuICAgIGRpc3BsYXlNYXJrZXJzPzogYm9vbGVhbjtcblxuICAgIC8vIEZ1bmN0aW9uIHRoYXQgZ2V0cyB0cmlnZ2VyZWQgb24gZWFjaCBpbnB1dC5cbiAgICBvbklucHV0PzogKHZhbHVlOiBhbnkpID0+IHZvaWQ7XG5cbiAgICByZWFkT25seT86IGJvb2xlYW47XG59O1xuXG4vLyB3cmFwcGVyIGZpeGVzIGEgYnVnIGluIHNsaWRlciB3aGVyZSB0aGUgc2xpZGVyIGhhbmRsZSBpcyByZW5kZXJlZCBvdXRzaWRlIHRoZSBib3VuZHMgb2YgdGhlIHNsaWRlciBib3hcbmNvbnN0IFdyYXBwZXIgPSBzdHlsZWQoXCJkaXZcIikoe1xuICAgIHdpZHRoOiBcIjEwMCVcIixcbiAgICBcIi5tZGMtc2xpZGVyIC5tZGMtc2xpZGVyX190aHVtYi1jb250YWluZXJcIjoge1xuICAgICAgICBsZWZ0OiA1XG4gICAgfVxufSk7XG5cbi8qKlxuICogU2xpZGVyIGNvbXBvbmVudCBsZXRzIHVzZXJzIGNob29zZSBhIHZhbHVlIGZyb20gZ2l2ZW4gcmFuZ2UuXG4gKi9cbmNsYXNzIFNsaWRlciBleHRlbmRzIFJlYWN0LkNvbXBvbmVudDxQcm9wcz4ge1xuICAgIG9uQ2hhbmdlID0gKGU6IHsgZGV0YWlsOiB7IHZhbHVlOiBudW1iZXIgfSB9KSA9PiB7XG4gICAgICAgIHRoaXMucHJvcHMub25DaGFuZ2UgJiYgdGhpcy5wcm9wcy5vbkNoYW5nZShlLmRldGFpbC52YWx1ZSk7XG4gICAgfTtcblxuICAgIG9uSW5wdXQgPSAoZTogeyBkZXRhaWw6IHsgdmFsdWU6IG51bWJlciB9IH0pID0+IHtcbiAgICAgICAgdGhpcy5wcm9wcy5vbklucHV0ICYmIHRoaXMucHJvcHMub25JbnB1dChlLmRldGFpbC52YWx1ZSk7XG4gICAgfTtcblxuICAgIHB1YmxpYyBvdmVycmlkZSByZW5kZXIoKSB7XG4gICAgICAgIGNvbnN0IHsgdmFsdWUsIGxhYmVsLCBkZXNjcmlwdGlvbiwgdmFsaWRhdGlvbiB9ID0gdGhpcy5wcm9wcztcblxuICAgICAgICBsZXQgc2xpZGVyVmFsdWUgPSB2YWx1ZTtcbiAgICAgICAgaWYgKHZhbHVlID09PSBudWxsIHx8IHR5cGVvZiB2YWx1ZSA9PT0gXCJ1bmRlZmluZWRcIikge1xuICAgICAgICAgICAgc2xpZGVyVmFsdWUgPSB0aGlzLnByb3BzLm1pbiB8fCAwO1xuICAgICAgICB9XG5cbiAgICAgICAgY29uc3QgeyBpc1ZhbGlkOiB2YWxpZGF0aW9uSXNWYWxpZCwgbWVzc2FnZTogdmFsaWRhdGlvbk1lc3NhZ2UgfSA9IHZhbGlkYXRpb24gfHwge307XG5cbiAgICAgICAgcmV0dXJuIChcbiAgICAgICAgICAgIDxSZWFjdC5GcmFnbWVudD5cbiAgICAgICAgICAgICAgICB7bGFiZWwgJiYgKFxuICAgICAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT1cIm1kYy10ZXh0LWZpZWxkLWhlbHBlci10ZXh0IG1kYy10ZXh0LWZpZWxkLWhlbHBlci10ZXh0LS1wZXJzaXN0ZW50XCI+XG4gICAgICAgICAgICAgICAgICAgICAgICB7bGFiZWx9XG4gICAgICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgICAgICl9XG5cbiAgICAgICAgICAgICAgICA8V3JhcHBlcj5cbiAgICAgICAgICAgICAgICAgICAgPFJtd2NTbGlkZXJcbiAgICAgICAgICAgICAgICAgICAgICAgIC8vIEhhZCB0byBhZGQgcmVhZE9ubHkgc28gdGhlIHdhcm5pbmcgZG9lcyBub3QgYXBwZWFyIGluIHRoZSBjb25zb2xlLlxuICAgICAgICAgICAgICAgICAgICAgICAgcmVhZE9ubHk9e3RydWV9XG4gICAgICAgICAgICAgICAgICAgICAgICB7Li4udGhpcy5wcm9wc31cbiAgICAgICAgICAgICAgICAgICAgICAgIHZhbHVlPXtzbGlkZXJWYWx1ZX1cbiAgICAgICAgICAgICAgICAgICAgICAgIG9uQ2hhbmdlPXt0aGlzLm9uQ2hhbmdlfVxuICAgICAgICAgICAgICAgICAgICAgICAgb25JbnB1dD17dGhpcy5vbklucHV0fVxuICAgICAgICAgICAgICAgICAgICAvPlxuICAgICAgICAgICAgICAgIDwvV3JhcHBlcj5cblxuICAgICAgICAgICAgICAgIHt2YWxpZGF0aW9uSXNWYWxpZCA9PT0gZmFsc2UgJiYgKFxuICAgICAgICAgICAgICAgICAgICA8Rm9ybUVsZW1lbnRNZXNzYWdlIGVycm9yPnt2YWxpZGF0aW9uTWVzc2FnZX08L0Zvcm1FbGVtZW50TWVzc2FnZT5cbiAgICAgICAgICAgICAgICApfVxuXG4gICAgICAgICAgICAgICAge3ZhbGlkYXRpb25Jc1ZhbGlkICE9PSBmYWxzZSAmJiBkZXNjcmlwdGlvbiAmJiAoXG4gICAgICAgICAgICAgICAgICAgIDxGb3JtRWxlbWVudE1lc3NhZ2U+e2Rlc2NyaXB0aW9ufTwvRm9ybUVsZW1lbnRNZXNzYWdlPlxuICAgICAgICAgICAgICAgICl9XG4gICAgICAgICAgICA8L1JlYWN0LkZyYWdtZW50PlxuICAgICAgICApO1xuICAgIH1cbn1cblxuZXhwb3J0IGRlZmF1bHQgU2xpZGVyO1xuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
 
 /**
  * Slider component lets users choose a value from given range.
  */
 var Slider = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2.default)(Slider, _React$Component);
-  var _super = (0, _createSuper2.default)(Slider);
   function Slider() {
     var _this;
     (0, _classCallCheck2.default)(this, Slider);
     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 = (0, _callSuper2.default)(this, Slider, [].concat(args));
+    (0, _defineProperty2.default)(_this, "onChange", function (e) {
       _this.props.onChange && _this.props.onChange(e.detail.value);
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onInput", function (e) {
+    (0, _defineProperty2.default)(_this, "onInput", function (e) {
       _this.props.onInput && _this.props.onInput(e.detail.value);
     });
     return _this;
   }
-  (0, _createClass2.default)(Slider, [{
+  (0, _inherits2.default)(Slider, _React$Component);
+  return (0, _createClass2.default)(Slider, [{
     key: "render",
     value: function render() {
       var _this$props = this.props,
@@ -64,7 +68,11 @@ var Slider = /*#__PURE__*/function (_React$Component) {
         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"
-      }, label), /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_slider.Slider, Object.assign({}, this.props, {
+      }, label), /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_slider.Slider
+      // Had to add readOnly so the warning does not appear in the console.
+      , Object.assign({
+        readOnly: true
+      }, this.props, {
         value: sliderValue,
         onChange: this.onChange,
         onInput: this.onInput
@@ -73,9 +81,7 @@ var Slider = /*#__PURE__*/function (_React$Component) {
       }, validationMessage), validationIsValid !== false && description && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, null, description));
     }
   }]);
-  return Slider;
 }(_react.default.Component);
-var _default = Slider;
-exports.default = _default;
+var _default = exports.default = Slider;
 
 //# sourceMappingURL=Slider.js.map

package/Slider/Slider.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_slider","_styled","_FormElementMessage","Wrapper","styled","target","label","width","left","Slider","_React$Component","_inherits2","default","_super","_createSuper2","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","call","apply","concat","_defineProperty2","_assertThisInitialized2","e","props","onChange","detail","value","onInput","_createClass2","key","render","_this$props","description","validation","sliderValue","min","_ref","validationIsValid","isValid","validationMessage","message","createElement","Fragment","className","Object","assign","FormElementMessage","error","React","Component","_default","exports"],"sources":["Slider.tsx"],"sourcesContent":["import React from \"react\";\nimport { Slider as RmwcSlider } from \"@rmwc/slider\";\nimport { FormComponentProps } from \"~/types\";\nimport styled from \"@emotion/styled\";\nimport { FormElementMessage } from \"~/FormElementMessage\";\n\ntype Props = FormComponentProps & {\n    // Component label.\n    label?: string;\n\n    // Is checkbox disabled?\n    disabled?: boolean;\n\n    // Description beneath the slider.\n    description?: string;\n\n    // The minimum value of the Slider.\n    min: number | string;\n\n    // The maximum value of the Slider.\n    max: number | string;\n\n    // A step to quantize values by.\n    step?: number | string;\n\n    // Displays the exact value of the Slider on the knob.\n    discrete?: boolean;\n\n    // Displays the individual step markers on the Slider track.\n    displayMarkers?: boolean;\n\n    // Function that gets triggered on each input.\n    onInput?: (value: any) => void;\n};\n\n// wrapper fixes a bug in slider where the slider handle is rendered outside the bounds of the slider box\nconst Wrapper = styled(\"div\")({\n    width: \"100%\",\n    \".mdc-slider .mdc-slider__thumb-container\": {\n        left: 5\n    }\n});\n\n/**\n * Slider component lets users choose a value from given range.\n */\nclass Slider extends React.Component<Props> {\n    onChange = (e: { detail: { value: number } }) => {\n        this.props.onChange && this.props.onChange(e.detail.value);\n    };\n\n    onInput = (e: { detail: { value: number } }) => {\n        this.props.onInput && this.props.onInput(e.detail.value);\n    };\n\n    public override render() {\n        const { value, label, description, validation } = this.props;\n\n        let sliderValue = value;\n        if (value === null || typeof value === \"undefined\") {\n            sliderValue = this.props.min || 0;\n        }\n\n        const { isValid: validationIsValid, message: validationMessage } = validation || {};\n\n        return (\n            <React.Fragment>\n                {label && (\n                    <div className=\"mdc-text-field-helper-text mdc-text-field-helper-text--persistent\">\n                        {label}\n                    </div>\n                )}\n\n                <Wrapper>\n                    <RmwcSlider\n                        {...this.props}\n                        value={sliderValue}\n                        onChange={this.onChange}\n                        onInput={this.onInput}\n                    />\n                </Wrapper>\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 Slider;\n"],"mappings":"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"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_slider","_FormElementMessage","_EMOTION_STRINGIFIED_CSS_ERROR__","Wrapper","_base","default","process","env","NODE_ENV","target","label","name","styles","map","toString","Slider","_React$Component","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","_callSuper2","concat","_defineProperty2","e","props","onChange","detail","value","onInput","_inherits2","_createClass2","key","render","_this$props","description","validation","sliderValue","min","_ref","validationIsValid","isValid","validationMessage","message","createElement","Fragment","className","Object","assign","readOnly","FormElementMessage","error","React","Component","_default","exports"],"sources":["Slider.tsx"],"sourcesContent":["import React from \"react\";\nimport { Slider as RmwcSlider } from \"@rmwc/slider\";\nimport { FormComponentProps } from \"~/types\";\nimport styled from \"@emotion/styled\";\nimport { FormElementMessage } from \"~/FormElementMessage\";\n\ntype Props = FormComponentProps & {\n    // Component label.\n    label?: string;\n\n    // Is checkbox disabled?\n    disabled?: boolean;\n\n    // Description beneath the slider.\n    description?: string;\n\n    // The minimum value of the Slider.\n    min: number | string;\n\n    // The maximum value of the Slider.\n    max: number | string;\n\n    // A step to quantize values by.\n    step?: number | string;\n\n    // Displays the exact value of the Slider on the knob.\n    discrete?: boolean;\n\n    // Displays the individual step markers on the Slider track.\n    displayMarkers?: boolean;\n\n    // Function that gets triggered on each input.\n    onInput?: (value: any) => void;\n\n    readOnly?: boolean;\n};\n\n// wrapper fixes a bug in slider where the slider handle is rendered outside the bounds of the slider box\nconst Wrapper = styled(\"div\")({\n    width: \"100%\",\n    \".mdc-slider .mdc-slider__thumb-container\": {\n        left: 5\n    }\n});\n\n/**\n * Slider component lets users choose a value from given range.\n */\nclass Slider extends React.Component<Props> {\n    onChange = (e: { detail: { value: number } }) => {\n        this.props.onChange && this.props.onChange(e.detail.value);\n    };\n\n    onInput = (e: { detail: { value: number } }) => {\n        this.props.onInput && this.props.onInput(e.detail.value);\n    };\n\n    public override render() {\n        const { value, label, description, validation } = this.props;\n\n        let sliderValue = value;\n        if (value === null || typeof value === \"undefined\") {\n            sliderValue = this.props.min || 0;\n        }\n\n        const { isValid: validationIsValid, message: validationMessage } = validation || {};\n\n        return (\n            <React.Fragment>\n                {label && (\n                    <div className=\"mdc-text-field-helper-text mdc-text-field-helper-text--persistent\">\n                        {label}\n                    </div>\n                )}\n\n                <Wrapper>\n                    <RmwcSlider\n                        // Had to add readOnly so the warning does not appear in the console.\n                        readOnly={true}\n                        {...this.props}\n                        value={sliderValue}\n                        onChange={this.onChange}\n                        onInput={this.onInput}\n                    />\n                </Wrapper>\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 Slider;\n"],"mappings":"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","ignoreList":[]}

package/Slider/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Slider","_interopRequireDefault","require"],"sources":["index.ts"],"sourcesContent":["export { default as Slider } from \"./Slider\";\n"],"mappings":";;;;;;;;;;;;AAAA,IAAAA,OAAA,GAAAC,sBAAA,CAAAC,OAAA"}
+{"version":3,"names":["_Slider","_interopRequireDefault","require"],"sources":["index.ts"],"sourcesContent":["export { default as Slider } from \"./Slider\";\n"],"mappings":";;;;;;;;;;;;AAAA,IAAAA,OAAA,GAAAC,sBAAA,CAAAC,OAAA","ignoreList":[]}

package/Snackbar/Snackbar.js

@@ -13,23 +13,20 @@ Object.defineProperty(exports, "SnackbarAction", {
 });
 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 _callSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/callSuper"));
 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 _snackbar = require("@rmwc/snackbar");
 /**
  * Use Snackbar component to display an informative or alert message and allow users to act upon it.
  */
-var Snackbar = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2.default)(Snackbar, _React$Component);
-  var _super = (0, _createSuper2.default)(Snackbar);
+var Snackbar = exports.Snackbar = /*#__PURE__*/function (_React$Component) {
   function Snackbar(props) {
     var _this;
     (0, _classCallCheck2.default)(this, Snackbar);
-    _this = _super.call(this, props);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "container", null);
+    _this = (0, _callSuper2.default)(this, Snackbar, [props]);
+    (0, _defineProperty2.default)(_this, "container", null);
     _this.container = document.getElementById("snackbar-container");
     if (!_this.container) {
       _this.container = document.createElement("div");
@@ -39,14 +36,13 @@ var Snackbar = /*#__PURE__*/function (_React$Component) {
     }
     return _this;
   }
-  (0, _createClass2.default)(Snackbar, [{
+  (0, _inherits2.default)(Snackbar, _React$Component);
+  return (0, _createClass2.default)(Snackbar, [{
     key: "render",
     value: function render() {
       return /*#__PURE__*/_react.default.createElement(_snackbar.Snackbar, this.props);
     }
   }]);
-  return Snackbar;
 }(_react.default.Component);
-exports.Snackbar = Snackbar;
 
 //# sourceMappingURL=Snackbar.js.map