@webiny/ui 5.43.2 → 6.0.0-alpha.0

package/Carousel/index.js

@@ -1,15 +1,3 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "Carousel", {
-  enumerable: true,
-  get: function get() {
-    return _Carousel.default;
-  }
-});
-var _Carousel = _interopRequireDefault(require("./Carousel"));
+export { default as Carousel } from "./Carousel";
 
 //# sourceMappingURL=index.js.map

package/Carousel/index.js.map

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

package/Checkbox/Checkbox.d.ts

@@ -11,13 +11,11 @@ interface Props extends FormComponentProps {
     children?: React.ReactNode;
 }
 /**
- * Single Checkbox component can be used to store simple boolean values.
- *
- * Grouping multiple Checkbox components with CheckboxGroup will allow to store an array of selected values.
- * In that case, each Checkbox component must receive value and onChange callback via props.
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Checkbox` component from the `@webiny/admin-ui` package instead.
  */
 declare class Checkbox extends React.Component<Props> {
-    onChange: (e: React.SyntheticEvent<HTMLInputElement>) => void;
+    onChange: (checked: boolean) => void;
     render(): React.JSX.Element;
 }
 export default Checkbox;

package/Checkbox/Checkbox.js

@@ -1,70 +1,38 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _callSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/callSuper"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireDefault(require("react"));
-var _checkbox = require("@rmwc/checkbox");
-var _FormElementMessage = require("../FormElementMessage");
+import React from "react";
+import { Checkbox as AdminCheckbox } from "@webiny/admin-ui";
 /**
- * Single Checkbox component can be used to store simple boolean values.
- *
- * Grouping multiple Checkbox components with CheckboxGroup will allow to store an array of selected values.
- * In that case, each Checkbox component must receive value and onChange callback via props.
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Checkbox` component from the `@webiny/admin-ui` package instead.
  */
-var Checkbox = /*#__PURE__*/function (_React$Component) {
-  function Checkbox() {
-    var _this;
-    (0, _classCallCheck2.default)(this, Checkbox);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = (0, _callSuper2.default)(this, Checkbox, [].concat(args));
-    (0, _defineProperty2.default)(_this, "onChange", function (e) {
-      _this.props.onChange && _this.props.onChange(e.target.checked);
+class Checkbox extends React.Component {
+  onChange = checked => {
+    this.props.onChange && this.props.onChange(checked);
+  };
+  render() {
+    const {
+      id,
+      value,
+      label,
+      disabled,
+      indeterminate,
+      description,
+      validation,
+      onClick
+    } = this.props;
+    return /*#__PURE__*/React.createElement(AdminCheckbox, {
+      id: id,
+      indeterminate: indeterminate,
+      disabled: disabled,
+      checked: Boolean(value),
+      onChange: this.onChange,
+      onClick: () => typeof onClick === "function" && onClick(Boolean(value)),
+      label: label,
+      "data-testid": this.props["data-testid"],
+      description: description,
+      validation: validation
     });
-    return _this;
   }
-  (0, _inherits2.default)(Checkbox, _React$Component);
-  return (0, _createClass2.default)(Checkbox, [{
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-        id = _this$props.id,
-        value = _this$props.value,
-        label = _this$props.label,
-        disabled = _this$props.disabled,
-        indeterminate = _this$props.indeterminate,
-        description = _this$props.description,
-        validation = _this$props.validation,
-        _onClick = _this$props.onClick;
-      var _ref = validation || {},
-        validationIsValid = _ref.isValid,
-        validationMessage = _ref.message;
-      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_checkbox.Checkbox, {
-        id: id,
-        indeterminate: indeterminate,
-        disabled: disabled,
-        checked: Boolean(value),
-        onChange: this.onChange,
-        onClick: function onClick() {
-          return typeof _onClick === "function" && _onClick(Boolean(value));
-        },
-        label: label,
-        "data-testid": this.props["data-testid"]
-      }), validationIsValid === false && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, {
-        error: true
-      }, validationMessage), validationIsValid !== false && description && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, null, description));
-    }
-  }]);
-}(_react.default.Component);
-var _default = exports.default = Checkbox;
+}
+export default Checkbox;
 
 //# sourceMappingURL=Checkbox.js.map

package/Checkbox/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_checkbox","_FormElementMessage","Checkbox","_React$Component","_this","_classCallCheck2","default","_len","arguments","length","args","Array","_key","_callSuper2","concat","_defineProperty2","e","props","onChange","target","checked","_inherits2","_createClass2","key","value","render","_this$props","id","label","disabled","indeterminate","description","validation","onClick","_ref","validationIsValid","isValid","validationMessage","message","createElement","Fragment","Boolean","FormElementMessage","error","React","Component","_default","exports"],"sources":["Checkbox.tsx"],"sourcesContent":["import React from \"react\";\nimport { Checkbox as RmwcCheckbox } from \"@rmwc/checkbox\";\nimport { FormElementMessage } from \"~/FormElementMessage\";\nimport { FormComponentProps } from \"~/types\";\n\ninterface Props extends FormComponentProps {\n    // Component id.\n    id?: string;\n\n    // Component label.\n    label?: string;\n\n    // Is checkbox disabled?\n    disabled?: boolean;\n\n    // onClick callback.\n    onClick?: (value: boolean) => void;\n\n    // Use when checkbox is not checked nor unchecked.\n    indeterminate?: boolean;\n\n    // Description beneath the checkbox.\n    description?: string;\n\n    // For testing purposes.\n    \"data-testid\"?: string;\n\n    children?: React.ReactNode;\n}\n\n/**\n * Single Checkbox component can be used to store simple boolean values.\n *\n * Grouping multiple Checkbox components with CheckboxGroup will allow to store an array of selected values.\n * In that case, each Checkbox component must receive value and onChange callback via props.\n */\nclass Checkbox extends React.Component<Props> {\n    onChange = (e: React.SyntheticEvent<HTMLInputElement>) => {\n        this.props.onChange && this.props.onChange((e.target as HTMLInputElement).checked);\n    };\n\n    public override render() {\n        const { id, value, label, disabled, indeterminate, description, validation, onClick } =\n            this.props;\n\n        const { isValid: validationIsValid, message: validationMessage } = validation || {};\n\n        return (\n            <React.Fragment>\n                <RmwcCheckbox\n                    id={id}\n                    indeterminate={indeterminate}\n                    disabled={disabled}\n                    checked={Boolean(value)}\n                    onChange={this.onChange}\n                    onClick={() => typeof onClick === \"function\" && onClick(Boolean(value))}\n                    label={label}\n                    data-testid={this.props[\"data-testid\"]}\n                />\n                {validationIsValid === false && (\n                    <FormElementMessage error>{validationMessage}</FormElementMessage>\n                )}\n\n                {validationIsValid !== false && description && (\n                    <FormElementMessage>{description}</FormElementMessage>\n                )}\n            </React.Fragment>\n        );\n    }\n}\n\nexport default Checkbox;\n"],"mappings":";;;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,SAAA,GAAAD,OAAA;AACA,IAAAE,mBAAA,GAAAF,OAAA;AA4BA;AACA;AACA;AACA;AACA;AACA;AALA,IAMMG,QAAQ,0BAAAC,gBAAA;EAAA,SAAAD,SAAA;IAAA,IAAAE,KAAA;IAAA,IAAAC,gBAAA,CAAAC,OAAA,QAAAJ,QAAA;IAAA,SAAAK,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAC,IAAA,OAAAC,KAAA,CAAAJ,IAAA,GAAAK,IAAA,MAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA;MAAAF,IAAA,CAAAE,IAAA,IAAAJ,SAAA,CAAAI,IAAA;IAAA;IAAAR,KAAA,OAAAS,WAAA,CAAAP,OAAA,QAAAJ,QAAA,KAAAY,MAAA,CAAAJ,IAAA;IAAA,IAAAK,gBAAA,CAAAT,OAAA,EAAAF,KAAA,cACC,UAACY,CAAyC,EAAK;MACtDZ,KAAA,CAAKa,KAAK,CAACC,QAAQ,IAAId,KAAA,CAAKa,KAAK,CAACC,QAAQ,CAAEF,CAAC,CAACG,MAAM,CAAsBC,OAAO,CAAC;IACtF,CAAC;IAAA,OAAAhB,KAAA;EAAA;EAAA,IAAAiB,UAAA,CAAAf,OAAA,EAAAJ,QAAA,EAAAC,gBAAA;EAAA,WAAAmB,aAAA,CAAAhB,OAAA,EAAAJ,QAAA;IAAAqB,GAAA;IAAAC,KAAA,EAED,SAAgBC,MAAMA,CAAA,EAAG;MACrB,IAAAC,WAAA,GACI,IAAI,CAACT,KAAK;QADNU,EAAE,GAAAD,WAAA,CAAFC,EAAE;QAAEH,KAAK,GAAAE,WAAA,CAALF,KAAK;QAAEI,KAAK,GAAAF,WAAA,CAALE,KAAK;QAAEC,QAAQ,GAAAH,WAAA,CAARG,QAAQ;QAAEC,aAAa,GAAAJ,WAAA,CAAbI,aAAa;QAAEC,WAAW,GAAAL,WAAA,CAAXK,WAAW;QAAEC,UAAU,GAAAN,WAAA,CAAVM,UAAU;QAAEC,QAAO,GAAAP,WAAA,CAAPO,OAAO;MAGnF,IAAAC,IAAA,GAAmEF,UAAU,IAAI,CAAC,CAAC;QAAlEG,iBAAiB,GAAAD,IAAA,CAA1BE,OAAO;QAA8BC,iBAAiB,GAAAH,IAAA,CAA1BI,OAAO;MAE3C,oBACIzC,MAAA,CAAAS,OAAA,CAAAiC,aAAA,CAAC1C,MAAA,CAAAS,OAAK,CAACkC,QAAQ,qBACX3C,MAAA,CAAAS,OAAA,CAAAiC,aAAA,CAACvC,SAAA,CAAAE,QAAY;QACTyB,EAAE,EAAEA,EAAG;QACPG,aAAa,EAAEA,aAAc;QAC7BD,QAAQ,EAAEA,QAAS;QACnBT,OAAO,EAAEqB,OAAO,CAACjB,KAAK,CAAE;QACxBN,QAAQ,EAAE,IAAI,CAACA,QAAS;QACxBe,OAAO,EAAE,SAATA,OAAOA,CAAA;UAAA,OAAQ,OAAOA,QAAO,KAAK,UAAU,IAAIA,QAAO,CAACQ,OAAO,CAACjB,KAAK,CAAC,CAAC;QAAA,CAAC;QACxEI,KAAK,EAAEA,KAAM;QACb,eAAa,IAAI,CAACX,KAAK,CAAC,aAAa;MAAE,CAC1C,CAAC,EACDkB,iBAAiB,KAAK,KAAK,iBACxBtC,MAAA,CAAAS,OAAA,CAAAiC,aAAA,CAACtC,mBAAA,CAAAyC,kBAAkB;QAACC,KAAK;MAAA,GAAEN,iBAAsC,CACpE,EAEAF,iBAAiB,KAAK,KAAK,IAAIJ,WAAW,iBACvClC,MAAA,CAAAS,OAAA,CAAAiC,aAAA,CAACtC,mBAAA,CAAAyC,kBAAkB,QAAEX,WAAgC,CAE7C,CAAC;IAEzB;EAAC;AAAA,EAhCkBa,cAAK,CAACC,SAAS;AAAA,IAAAC,QAAA,GAAAC,OAAA,CAAAzC,OAAA,GAmCvBJ,QAAQ","ignoreList":[]}
+{"version":3,"names":["React","Checkbox","AdminCheckbox","Component","onChange","checked","props","render","id","value","label","disabled","indeterminate","description","validation","onClick","createElement","Boolean"],"sources":["Checkbox.tsx"],"sourcesContent":["import React from \"react\";\nimport { FormComponentProps } from \"~/types\";\nimport { Checkbox as AdminCheckbox } from \"@webiny/admin-ui\";\n\ninterface Props extends FormComponentProps {\n    // Component id.\n    id?: string;\n\n    // Component label.\n    label?: string;\n\n    // Is checkbox disabled?\n    disabled?: boolean;\n\n    // onClick callback.\n    onClick?: (value: boolean) => void;\n\n    // Use when checkbox is not checked nor unchecked.\n    indeterminate?: boolean;\n\n    // Description beneath the checkbox.\n    description?: string;\n\n    // For testing purposes.\n    \"data-testid\"?: string;\n\n    children?: React.ReactNode;\n}\n\n/**\n * @deprecated This component is deprecated and will be removed in future releases.\n * Please use the `Checkbox` component from the `@webiny/admin-ui` package instead.\n */\nclass Checkbox extends React.Component<Props> {\n    onChange = (checked: boolean) => {\n        this.props.onChange && this.props.onChange(checked);\n    };\n\n    public override render() {\n        const { id, value, label, disabled, indeterminate, description, validation, onClick } =\n            this.props;\n\n        return (\n            <AdminCheckbox\n                id={id}\n                indeterminate={indeterminate}\n                disabled={disabled}\n                checked={Boolean(value)}\n                onChange={this.onChange}\n                onClick={() => typeof onClick === \"function\" && onClick(Boolean(value))}\n                label={label}\n                data-testid={this.props[\"data-testid\"]}\n                description={description}\n                validation={validation}\n            />\n        );\n    }\n}\n\nexport default Checkbox;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,QAAQ,IAAIC,aAAa,QAAQ,kBAAkB;AA2B5D;AACA;AACA;AACA;AACA,MAAMD,QAAQ,SAASD,KAAK,CAACG,SAAS,CAAQ;EAC1CC,QAAQ,GAAIC,OAAgB,IAAK;IAC7B,IAAI,CAACC,KAAK,CAACF,QAAQ,IAAI,IAAI,CAACE,KAAK,CAACF,QAAQ,CAACC,OAAO,CAAC;EACvD,CAAC;EAEeE,MAAMA,CAAA,EAAG;IACrB,MAAM;MAAEC,EAAE;MAAEC,KAAK;MAAEC,KAAK;MAAEC,QAAQ;MAAEC,aAAa;MAAEC,WAAW;MAAEC,UAAU;MAAEC;IAAQ,CAAC,GACjF,IAAI,CAACT,KAAK;IAEd,oBACIN,KAAA,CAAAgB,aAAA,CAACd,aAAa;MACVM,EAAE,EAAEA,EAAG;MACPI,aAAa,EAAEA,aAAc;MAC7BD,QAAQ,EAAEA,QAAS;MACnBN,OAAO,EAAEY,OAAO,CAACR,KAAK,CAAE;MACxBL,QAAQ,EAAE,IAAI,CAACA,QAAS;MACxBW,OAAO,EAAEA,CAAA,KAAM,OAAOA,OAAO,KAAK,UAAU,IAAIA,OAAO,CAACE,OAAO,CAACR,KAAK,CAAC,CAAE;MACxEC,KAAK,EAAEA,KAAM;MACb,eAAa,IAAI,CAACJ,KAAK,CAAC,aAAa,CAAE;MACvCO,WAAW,EAAEA,WAAY;MACzBC,UAAU,EAAEA;IAAW,CAC1B,CAAC;EAEV;AACJ;AAEA,eAAeb,QAAQ","ignoreList":[]}

package/Checkbox/CheckboxGroup.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { FormComponentProps } from "./../types";
+import { FormComponentProps } from "../types";
 export interface ChildrenRenderProp {
     onChange: (id: string | number) => () => void;
     getValue: (id: string | number) => boolean;
@@ -9,6 +9,10 @@ type Props = FormComponentProps & {
     description?: string;
     children: (props: ChildrenRenderProp) => React.ReactNode;
 };
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `CheckboxGroup` component from the `@webiny/admin-ui` package instead.
+ */
 declare class CheckboxGroup extends React.Component<Props> {
     render(): React.JSX.Element;
 }

package/Checkbox/CheckboxGroup.js

@@ -1,61 +1,49 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _callSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/callSuper"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _react = _interopRequireDefault(require("react"));
-var _Checkbox = require("./Checkbox.styles");
-var _FormElementMessage = require("../FormElementMessage");
-var CheckboxGroup = /*#__PURE__*/function (_React$Component) {
-  function CheckboxGroup() {
-    (0, _classCallCheck2.default)(this, CheckboxGroup);
-    return (0, _callSuper2.default)(this, CheckboxGroup, arguments);
+import React from "react";
+import { FormComponentDescription, FormComponentErrorMessage, FormComponentLabel } from "@webiny/admin-ui";
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `CheckboxGroup` component from the `@webiny/admin-ui` package instead.
+ */
+class CheckboxGroup extends React.Component {
+  render() {
+    const {
+      description,
+      label,
+      validation
+    } = this.props;
+    const {
+      isValid: validationIsValid,
+      message: validationMessage
+    } = validation || {};
+    return /*#__PURE__*/React.createElement("div", {
+      className: "w-full"
+    }, /*#__PURE__*/React.createElement(FormComponentLabel, {
+      text: label
+    }), /*#__PURE__*/React.createElement(FormComponentDescription, {
+      text: description
+    }), this.props.children({
+      onChange: value => {
+        return () => {
+          const values = Array.isArray(this.props.value) ? [...this.props.value] : [];
+          const index = values.indexOf(value);
+          if (index > -1) {
+            values.splice(index, 1);
+          } else {
+            values.push(value);
+          }
+          this.props.onChange && this.props.onChange(values);
+        };
+      },
+      getValue: id => {
+        const values = Array.isArray(this.props.value) ? this.props.value : [];
+        return values.includes(id);
+      }
+    }), /*#__PURE__*/React.createElement(FormComponentErrorMessage, {
+      invalid: Boolean(validationIsValid === false),
+      text: validationMessage
+    }));
   }
-  (0, _inherits2.default)(CheckboxGroup, _React$Component);
-  return (0, _createClass2.default)(CheckboxGroup, [{
-    key: "render",
-    value: function render() {
-      var _this = this;
-      var _this$props = this.props,
-        description = _this$props.description,
-        label = _this$props.label,
-        _this$props$validatio = _this$props.validation,
-        validation = _this$props$validatio === void 0 ? {
-          isValid: null,
-          message: null
-        } : _this$props$validatio;
-      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 " + _Checkbox.webinyCheckboxTitle
-      }, label), this.props.children({
-        onChange: function onChange(value) {
-          return function () {
-            var values = Array.isArray(_this.props.value) ? (0, _toConsumableArray2.default)(_this.props.value) : [];
-            var index = values.indexOf(value);
-            if (index > -1) {
-              values.splice(index, 1);
-            } else {
-              values.push(value);
-            }
-            _this.props.onChange && _this.props.onChange(values);
-          };
-        },
-        getValue: function getValue(id) {
-          var values = Array.isArray(_this.props.value) ? _this.props.value : [];
-          return values.includes(id);
-        }
-      }), validation.isValid === false && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, {
-        error: true
-      }, validation.message), validation.isValid !== false && description && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, null, description));
-    }
-  }]);
-}(_react.default.Component);
-var _default = exports.default = CheckboxGroup;
+}
+export default CheckboxGroup;
 
 //# sourceMappingURL=CheckboxGroup.js.map

package/Checkbox/CheckboxGroup.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_Checkbox","_FormElementMessage","CheckboxGroup","_React$Component","_classCallCheck2","default","_callSuper2","arguments","_inherits2","_createClass2","key","value","render","_this","_this$props","props","description","label","_this$props$validatio","validation","isValid","message","createElement","Fragment","className","webinyCheckboxTitle","children","onChange","values","Array","isArray","_toConsumableArray2","index","indexOf","splice","push","getValue","id","includes","FormElementMessage","error","React","Component","_default","exports"],"sources":["CheckboxGroup.tsx"],"sourcesContent":["import React from \"react\";\nimport { FormComponentProps } from \"./../types\";\nimport { webinyCheckboxTitle } from \"./Checkbox.styles\";\nimport { FormElementMessage } from \"../FormElementMessage\";\n\nexport interface ChildrenRenderProp {\n    onChange: (id: string | number) => () => void;\n    getValue: (id: string | number) => boolean;\n}\n\ntype Props = FormComponentProps & {\n    // Form element's label.\n    label?: string;\n\n    // Form element's description.\n    description?: string;\n\n    // An array of Checkbox components.\n    children: (props: ChildrenRenderProp) => React.ReactNode;\n};\n\nclass CheckboxGroup extends React.Component<Props> {\n    public override render() {\n        const { description, label, validation = { isValid: null, message: null } } = this.props;\n\n        return (\n            <React.Fragment>\n                {label && (\n                    <div\n                        className={\n                            \"mdc-text-field-helper-text mdc-text-field-helper-text--persistent \" +\n                            webinyCheckboxTitle\n                        }\n                    >\n                        {label}\n                    </div>\n                )}\n\n                {this.props.children({\n                    onChange: value => {\n                        return () => {\n                            const values = Array.isArray(this.props.value)\n                                ? [...this.props.value]\n                                : [];\n                            const index = values.indexOf(value);\n                            if (index > -1) {\n                                values.splice(index, 1);\n                            } else {\n                                values.push(value);\n                            }\n\n                            this.props.onChange && this.props.onChange(values);\n                        };\n                    },\n                    getValue: id => {\n                        const values = Array.isArray(this.props.value) ? this.props.value : [];\n                        return values.includes(id);\n                    }\n                })}\n\n                {validation.isValid === false && (\n                    <FormElementMessage error>{validation.message}</FormElementMessage>\n                )}\n\n                {validation.isValid !== false && description && (\n                    <FormElementMessage>{description}</FormElementMessage>\n                )}\n            </React.Fragment>\n        );\n    }\n}\n\nexport default CheckboxGroup;\n"],"mappings":";;;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,SAAA,GAAAD,OAAA;AACA,IAAAE,mBAAA,GAAAF,OAAA;AAA2D,IAkBrDG,aAAa,0BAAAC,gBAAA;EAAA,SAAAD,cAAA;IAAA,IAAAE,gBAAA,CAAAC,OAAA,QAAAH,aAAA;IAAA,WAAAI,WAAA,CAAAD,OAAA,QAAAH,aAAA,EAAAK,SAAA;EAAA;EAAA,IAAAC,UAAA,CAAAH,OAAA,EAAAH,aAAA,EAAAC,gBAAA;EAAA,WAAAM,aAAA,CAAAJ,OAAA,EAAAH,aAAA;IAAAQ,GAAA;IAAAC,KAAA,EACf,SAAgBC,MAAMA,CAAA,EAAG;MAAA,IAAAC,KAAA;MACrB,IAAAC,WAAA,GAA8E,IAAI,CAACC,KAAK;QAAhFC,WAAW,GAAAF,WAAA,CAAXE,WAAW;QAAEC,KAAK,GAAAH,WAAA,CAALG,KAAK;QAAAC,qBAAA,GAAAJ,WAAA,CAAEK,UAAU;QAAVA,UAAU,GAAAD,qBAAA,cAAG;UAAEE,OAAO,EAAE,IAAI;UAAEC,OAAO,EAAE;QAAK,CAAC,GAAAH,qBAAA;MAEzE,oBACIrB,MAAA,CAAAQ,OAAA,CAAAiB,aAAA,CAACzB,MAAA,CAAAQ,OAAK,CAACkB,QAAQ,QACVN,KAAK,iBACFpB,MAAA,CAAAQ,OAAA,CAAAiB,aAAA;QACIE,SAAS,EACL,oEAAoE,GACpEC;MACH,GAEAR,KACA,CACR,EAEA,IAAI,CAACF,KAAK,CAACW,QAAQ,CAAC;QACjBC,QAAQ,EAAE,SAAVA,QAAQA,CAAEhB,KAAK,EAAI;UACf,OAAO,YAAM;YACT,IAAMiB,MAAM,GAAGC,KAAK,CAACC,OAAO,CAACjB,KAAI,CAACE,KAAK,CAACJ,KAAK,CAAC,OAAAoB,mBAAA,CAAA1B,OAAA,EACpCQ,KAAI,CAACE,KAAK,CAACJ,KAAK,IACpB,EAAE;YACR,IAAMqB,KAAK,GAAGJ,MAAM,CAACK,OAAO,CAACtB,KAAK,CAAC;YACnC,IAAIqB,KAAK,GAAG,CAAC,CAAC,EAAE;cACZJ,MAAM,CAACM,MAAM,CAACF,KAAK,EAAE,CAAC,CAAC;YAC3B,CAAC,MAAM;cACHJ,MAAM,CAACO,IAAI,CAACxB,KAAK,CAAC;YACtB;YAEAE,KAAI,CAACE,KAAK,CAACY,QAAQ,IAAId,KAAI,CAACE,KAAK,CAACY,QAAQ,CAACC,MAAM,CAAC;UACtD,CAAC;QACL,CAAC;QACDQ,QAAQ,EAAE,SAAVA,QAAQA,CAAEC,EAAE,EAAI;UACZ,IAAMT,MAAM,GAAGC,KAAK,CAACC,OAAO,CAACjB,KAAI,CAACE,KAAK,CAACJ,KAAK,CAAC,GAAGE,KAAI,CAACE,KAAK,CAACJ,KAAK,GAAG,EAAE;UACtE,OAAOiB,MAAM,CAACU,QAAQ,CAACD,EAAE,CAAC;QAC9B;MACJ,CAAC,CAAC,EAEDlB,UAAU,CAACC,OAAO,KAAK,KAAK,iBACzBvB,MAAA,CAAAQ,OAAA,CAAAiB,aAAA,CAACrB,mBAAA,CAAAsC,kBAAkB;QAACC,KAAK;MAAA,GAAErB,UAAU,CAACE,OAA4B,CACrE,EAEAF,UAAU,CAACC,OAAO,KAAK,KAAK,IAAIJ,WAAW,iBACxCnB,MAAA,CAAAQ,OAAA,CAAAiB,aAAA,CAACrB,mBAAA,CAAAsC,kBAAkB,QAAEvB,WAAgC,CAE7C,CAAC;IAEzB;EAAC;AAAA,EAhDuByB,cAAK,CAACC,SAAS;AAAA,IAAAC,QAAA,GAAAC,OAAA,CAAAvC,OAAA,GAmD5BH,aAAa","ignoreList":[]}
+{"version":3,"names":["React","FormComponentDescription","FormComponentErrorMessage","FormComponentLabel","CheckboxGroup","Component","render","description","label","validation","props","isValid","validationIsValid","message","validationMessage","createElement","className","text","children","onChange","value","values","Array","isArray","index","indexOf","splice","push","getValue","id","includes","invalid","Boolean"],"sources":["CheckboxGroup.tsx"],"sourcesContent":["import React from \"react\";\nimport { FormComponentProps } from \"~/types\";\nimport {\n    FormComponentDescription,\n    FormComponentErrorMessage,\n    FormComponentLabel\n} from \"@webiny/admin-ui\";\n\nexport interface ChildrenRenderProp {\n    onChange: (id: string | number) => () => void;\n    getValue: (id: string | number) => boolean;\n}\n\ntype Props = FormComponentProps & {\n    // Form element's label.\n    label?: string;\n\n    // Form element's description.\n    description?: string;\n\n    // An array of Checkbox components.\n    children: (props: ChildrenRenderProp) => React.ReactNode;\n};\n\n/**\n * @deprecated This component is deprecated and will be removed in future releases.\n * Please use the `CheckboxGroup` component from the `@webiny/admin-ui` package instead.\n */\nclass CheckboxGroup extends React.Component<Props> {\n    public override render() {\n        const { description, label, validation } = this.props;\n        const { isValid: validationIsValid, message: validationMessage } = validation || {};\n\n        return (\n            <div className={\"w-full\"}>\n                <FormComponentLabel text={label} />\n                <FormComponentDescription text={description} />\n                {this.props.children({\n                    onChange: value => {\n                        return () => {\n                            const values = Array.isArray(this.props.value)\n                                ? [...this.props.value]\n                                : [];\n                            const index = values.indexOf(value);\n                            if (index > -1) {\n                                values.splice(index, 1);\n                            } else {\n                                values.push(value);\n                            }\n\n                            this.props.onChange && this.props.onChange(values);\n                        };\n                    },\n                    getValue: id => {\n                        const values = Array.isArray(this.props.value) ? this.props.value : [];\n                        return values.includes(id);\n                    }\n                })}\n                <FormComponentErrorMessage\n                    invalid={Boolean(validationIsValid === false)}\n                    text={validationMessage}\n                />\n            </div>\n        );\n    }\n}\n\nexport default CheckboxGroup;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SACIC,wBAAwB,EACxBC,yBAAyB,EACzBC,kBAAkB,QACf,kBAAkB;AAkBzB;AACA;AACA;AACA;AACA,MAAMC,aAAa,SAASJ,KAAK,CAACK,SAAS,CAAQ;EAC/BC,MAAMA,CAAA,EAAG;IACrB,MAAM;MAAEC,WAAW;MAAEC,KAAK;MAAEC;IAAW,CAAC,GAAG,IAAI,CAACC,KAAK;IACrD,MAAM;MAAEC,OAAO,EAAEC,iBAAiB;MAAEC,OAAO,EAAEC;IAAkB,CAAC,GAAGL,UAAU,IAAI,CAAC,CAAC;IAEnF,oBACIT,KAAA,CAAAe,aAAA;MAAKC,SAAS,EAAE;IAAS,gBACrBhB,KAAA,CAAAe,aAAA,CAACZ,kBAAkB;MAACc,IAAI,EAAET;IAAM,CAAE,CAAC,eACnCR,KAAA,CAAAe,aAAA,CAACd,wBAAwB;MAACgB,IAAI,EAAEV;IAAY,CAAE,CAAC,EAC9C,IAAI,CAACG,KAAK,CAACQ,QAAQ,CAAC;MACjBC,QAAQ,EAAEC,KAAK,IAAI;QACf,OAAO,MAAM;UACT,MAAMC,MAAM,GAAGC,KAAK,CAACC,OAAO,CAAC,IAAI,CAACb,KAAK,CAACU,KAAK,CAAC,GACxC,CAAC,GAAG,IAAI,CAACV,KAAK,CAACU,KAAK,CAAC,GACrB,EAAE;UACR,MAAMI,KAAK,GAAGH,MAAM,CAACI,OAAO,CAACL,KAAK,CAAC;UACnC,IAAII,KAAK,GAAG,CAAC,CAAC,EAAE;YACZH,MAAM,CAACK,MAAM,CAACF,KAAK,EAAE,CAAC,CAAC;UAC3B,CAAC,MAAM;YACHH,MAAM,CAACM,IAAI,CAACP,KAAK,CAAC;UACtB;UAEA,IAAI,CAACV,KAAK,CAACS,QAAQ,IAAI,IAAI,CAACT,KAAK,CAACS,QAAQ,CAACE,MAAM,CAAC;QACtD,CAAC;MACL,CAAC;MACDO,QAAQ,EAAEC,EAAE,IAAI;QACZ,MAAMR,MAAM,GAAGC,KAAK,CAACC,OAAO,CAAC,IAAI,CAACb,KAAK,CAACU,KAAK,CAAC,GAAG,IAAI,CAACV,KAAK,CAACU,KAAK,GAAG,EAAE;QACtE,OAAOC,MAAM,CAACS,QAAQ,CAACD,EAAE,CAAC;MAC9B;IACJ,CAAC,CAAC,eACF7B,KAAA,CAAAe,aAAA,CAACb,yBAAyB;MACtB6B,OAAO,EAAEC,OAAO,CAACpB,iBAAiB,KAAK,KAAK,CAAE;MAC9CK,IAAI,EAAEH;IAAkB,CAC3B,CACA,CAAC;EAEd;AACJ;AAEA,eAAeV,aAAa","ignoreList":[]}

package/Checkbox/index.js

@@ -1,22 +1,4 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "Checkbox", {
-  enumerable: true,
-  get: function get() {
-    return _Checkbox.default;
-  }
-});
-Object.defineProperty(exports, "CheckboxGroup", {
-  enumerable: true,
-  get: function get() {
-    return _CheckboxGroup.default;
-  }
-});
-var _Checkbox = _interopRequireDefault(require("./Checkbox"));
-var _CheckboxGroup = _interopRequireDefault(require("./CheckboxGroup"));
+export { default as Checkbox } from "./Checkbox";
+export { default as CheckboxGroup } from "./CheckboxGroup";
 
 //# sourceMappingURL=index.js.map

package/Checkbox/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Checkbox","_interopRequireDefault","require","_CheckboxGroup"],"sources":["index.ts"],"sourcesContent":["export { default as Checkbox } from \"./Checkbox\";\nexport { default as CheckboxGroup } from \"./CheckboxGroup\";\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA,IAAAA,SAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,cAAA,GAAAF,sBAAA,CAAAC,OAAA","ignoreList":[]}
+{"version":3,"names":["default","Checkbox","CheckboxGroup"],"sources":["index.ts"],"sourcesContent":["export { default as Checkbox } from \"./Checkbox\";\nexport { default as CheckboxGroup } from \"./CheckboxGroup\";\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,QAAQ;AAC5B,SAASD,OAAO,IAAIE,aAAa","ignoreList":[]}

package/Chips/Chip.d.ts

@@ -1,7 +1,36 @@
 import React from "react";
-import { ChipProps as RmwcChipProps } from "@rmwc/chip";
+export interface RmwcChipProps {
+    /** Text for your Chip. */
+    label?: React.ReactNode;
+    /** @deprecated makes the Chip appear selected. */
+    selected?: boolean;
+    /** @deprecated Instance of an Icon Component. */
+    icon?: any;
+    /** @deprecated Instance of an Icon Component. */
+    trailingIcon?: any;
+    /** @deprecated Defaults to true. Set this to false if your trailing icon is something other than a remove button. */
+    trailingIconRemovesChip?: boolean;
+    /** An optional chip ID that will be included in callback evt.detail. If this is not passed, RMWC will attempt to use the "key" prop if present.  */
+    id?: string;
+    /** @deprecated Includes an optional checkmark for the chips selected state. */
+    checkmark?: boolean;
+    /** @deprecated Additional children will be rendered in the text area. */
+    children?: React.ReactNode;
+    /** A callback for click or enter key. This should be used over onClick for accessibility reasons. evt.detail = { chipId: string }  */
+    onInteraction?: (evt: any) => void;
+    /** @deprecated A callback for click or enter key for the trailing icon. material-components-web always treats this as an intent to remove the chip. evt.detail = { chipId: string } */
+    onTrailingIconInteraction?: (evt: any) => void;
+    /** A callback that is fired once the chip is in an exited state from removing it. evt.detail = { chipId: string } */
+    onRemove?: (evt: any) => void;
+    /** @deprecated Advanced: A reference to the MDCFoundation. */
+    foundationRef?: any;
+}
 export interface ChipProps extends Omit<RmwcChipProps, "onRemove" | "trailingIcon"> {
-    onRemove: (ev: React.MouseEvent<HTMLSpanElement>) => void;
+    onRemove?: (ev: React.MouseEvent<HTMLSpanElement> | React.SyntheticEvent<HTMLSpanElement>) => void;
     trailingIcon?: React.ReactNode;
 }
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Tag` component from the `@webiny/admin-ui` package instead.
+ */
 export declare const Chip: (props: ChipProps) => React.JSX.Element;

package/Chips/Chip.js

@@ -1,34 +1,51 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Chip = void 0;
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = _interopRequireWildcard(require("react"));
-var _chip = require("@rmwc/chip");
-var _excluded = ["children", "trailingIcon", "onRemove"];
-var Chip = exports.Chip = function Chip(props) {
-  var children = props.children,
-    trailingIcon = props.trailingIcon,
-    onRemove = props.onRemove,
-    rest = (0, _objectWithoutProperties2.default)(props, _excluded);
-  var onRemoveCb = (0, _react.useCallback)(function (ev) {
+import React, { useCallback } from "react";
+import { Tag as AdminTag } from "@webiny/admin-ui";
+import omit from "lodash/omit";
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Tag` component from the `@webiny/admin-ui` package instead.
+ */
+export const Chip = props => {
+  const {
+    children,
+    label,
+    trailingIcon,
+    onRemove,
+    onInteraction,
+    ...rest
+  } = props;
+  const getEventWithDetails = useCallback(ev => {
+    return {
+      ...ev,
+      detail: {
+        chipId: props.id
+      }
+    };
+  }, [props.id]);
+  const onRemoveCb = useCallback(ev => {
     if (!onRemove) {
       return;
     }
-    onRemove(ev);
+    onRemove(getEventWithDetails(ev));
   }, [onRemove]);
-  var trailingIconElement = null;
-  if (trailingIcon) {
-    trailingIconElement = /*#__PURE__*/_react.default.createElement("span", {
-      className: "mdc-chip__icon mdc-chip__icon--trailing",
-      onClick: onRemoveCb
-    }, trailingIcon);
-  }
-  return /*#__PURE__*/_react.default.createElement(_chip.Chip, rest, children, " ", trailingIconElement);
+  const onClick = useCallback(ev => {
+    if (!onInteraction) {
+      return;
+    }
+    onInteraction(getEventWithDetails(ev));
+  }, [onInteraction]);
+  const createIconElement = useCallback(icon => {
+    if (/*#__PURE__*/React.isValidElement(icon)) {
+      return icon;
+    }
+    return undefined;
+  }, []);
+  return /*#__PURE__*/React.createElement(AdminTag, Object.assign({}, omit(rest, ["selected", "icon", "trailingIconRemovesChip", "onTrailingIconInteraction", "checkmark", "foundationRef"]), {
+    content: children || label,
+    dismissIconElement: createIconElement(trailingIcon),
+    onDismiss: onRemove ? onRemoveCb : undefined,
+    onClick: onClick
+  }));
 };
 
 //# sourceMappingURL=Chip.js.map

package/Chips/Chip.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_chip","_excluded","Chip","exports","props","children","trailingIcon","onRemove","rest","_objectWithoutProperties2","default","onRemoveCb","useCallback","ev","trailingIconElement","createElement","className","onClick"],"sources":["Chip.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport { Chip as RmwcChip, ChipProps as RmwcChipProps } from \"@rmwc/chip\";\n\nexport interface ChipProps extends Omit<RmwcChipProps, \"onRemove\" | \"trailingIcon\"> {\n    onRemove: (ev: React.MouseEvent<HTMLSpanElement>) => void;\n    trailingIcon?: React.ReactNode;\n}\n\nexport const Chip = (props: ChipProps) => {\n    const { children, trailingIcon, onRemove, ...rest } = props;\n\n    const onRemoveCb = useCallback(\n        (ev: React.MouseEvent<HTMLSpanElement>) => {\n            if (!onRemove) {\n                return;\n            }\n            onRemove(ev);\n        },\n        [onRemove]\n    );\n\n    let trailingIconElement = null;\n    if (trailingIcon) {\n        trailingIconElement = (\n            <span className={\"mdc-chip__icon mdc-chip__icon--trailing\"} onClick={onRemoveCb}>\n                {trailingIcon}\n            </span>\n        );\n    }\n\n    return (\n        <RmwcChip {...rest}>\n            {children} {trailingIconElement}\n        </RmwcChip>\n    );\n};\n"],"mappings":";;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AAA0E,IAAAE,SAAA;AAOnE,IAAMC,IAAI,GAAAC,OAAA,CAAAD,IAAA,GAAG,SAAPA,IAAIA,CAAIE,KAAgB,EAAK;EACtC,IAAQC,QAAQ,GAAsCD,KAAK,CAAnDC,QAAQ;IAAEC,YAAY,GAAwBF,KAAK,CAAzCE,YAAY;IAAEC,QAAQ,GAAcH,KAAK,CAA3BG,QAAQ;IAAKC,IAAI,OAAAC,yBAAA,CAAAC,OAAA,EAAKN,KAAK,EAAAH,SAAA;EAE3D,IAAMU,UAAU,GAAG,IAAAC,kBAAW,EAC1B,UAACC,EAAqC,EAAK;IACvC,IAAI,CAACN,QAAQ,EAAE;MACX;IACJ;IACAA,QAAQ,CAACM,EAAE,CAAC;EAChB,CAAC,EACD,CAACN,QAAQ,CACb,CAAC;EAED,IAAIO,mBAAmB,GAAG,IAAI;EAC9B,IAAIR,YAAY,EAAE;IACdQ,mBAAmB,gBACfjB,MAAA,CAAAa,OAAA,CAAAK,aAAA;MAAMC,SAAS,EAAE,yCAA0C;MAACC,OAAO,EAAEN;IAAW,GAC3EL,YACC,CACT;EACL;EAEA,oBACIT,MAAA,CAAAa,OAAA,CAAAK,aAAA,CAACf,KAAA,CAAAE,IAAQ,EAAKM,IAAI,EACbH,QAAQ,EAAC,GAAC,EAACS,mBACN,CAAC;AAEnB,CAAC","ignoreList":[]}
+{"version":3,"names":["React","useCallback","Tag","AdminTag","omit","Chip","props","children","label","trailingIcon","onRemove","onInteraction","rest","getEventWithDetails","ev","detail","chipId","id","onRemoveCb","onClick","createIconElement","icon","isValidElement","undefined","createElement","Object","assign","content","dismissIconElement","onDismiss"],"sources":["Chip.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport { Tag as AdminTag } from \"@webiny/admin-ui\";\nimport omit from \"lodash/omit\";\n\nexport interface RmwcChipProps {\n    /** Text for your Chip. */\n    label?: React.ReactNode;\n    /** @deprecated makes the Chip appear selected. */\n    selected?: boolean;\n    /** @deprecated Instance of an Icon Component. */\n    icon?: any;\n    /** @deprecated Instance of an Icon Component. */\n    trailingIcon?: any;\n    /** @deprecated Defaults to true. Set this to false if your trailing icon is something other than a remove button. */\n    trailingIconRemovesChip?: boolean;\n    /** An optional chip ID that will be included in callback evt.detail. If this is not passed, RMWC will attempt to use the \"key\" prop if present.  */\n    id?: string;\n    /** @deprecated Includes an optional checkmark for the chips selected state. */\n    checkmark?: boolean;\n    /** @deprecated Additional children will be rendered in the text area. */\n    children?: React.ReactNode;\n    /** A callback for click or enter key. This should be used over onClick for accessibility reasons. evt.detail = { chipId: string }  */\n    onInteraction?: (evt: any) => void;\n    /** @deprecated A callback for click or enter key for the trailing icon. material-components-web always treats this as an intent to remove the chip. evt.detail = { chipId: string } */\n    onTrailingIconInteraction?: (evt: any) => void;\n    /** A callback that is fired once the chip is in an exited state from removing it. evt.detail = { chipId: string } */\n    onRemove?: (evt: any) => void;\n    /** @deprecated Advanced: A reference to the MDCFoundation. */\n    foundationRef?: any;\n}\n\nexport interface ChipProps extends Omit<RmwcChipProps, \"onRemove\" | \"trailingIcon\"> {\n    onRemove?: (\n        ev: React.MouseEvent<HTMLSpanElement> | React.SyntheticEvent<HTMLSpanElement>\n    ) => void;\n    trailingIcon?: React.ReactNode;\n}\n\n/**\n * @deprecated This component is deprecated and will be removed in future releases.\n * Please use the `Tag` component from the `@webiny/admin-ui` package instead.\n */\nexport const Chip = (props: ChipProps) => {\n    const { children, label, trailingIcon, onRemove, onInteraction, ...rest } = props;\n\n    const getEventWithDetails = useCallback(\n        (ev: React.SyntheticEvent<HTMLSpanElement>) => {\n            return {\n                ...ev,\n                detail: {\n                    chipId: props.id\n                }\n            };\n        },\n        [props.id]\n    );\n\n    const onRemoveCb = useCallback(\n        (ev: React.SyntheticEvent<HTMLSpanElement>) => {\n            if (!onRemove) {\n                return;\n            }\n\n            onRemove(getEventWithDetails(ev));\n        },\n        [onRemove]\n    );\n\n    const onClick = useCallback(\n        (ev: React.SyntheticEvent<HTMLSpanElement>) => {\n            if (!onInteraction) {\n                return;\n            }\n\n            onInteraction(getEventWithDetails(ev));\n        },\n        [onInteraction]\n    );\n\n    const createIconElement = useCallback((icon: React.ReactNode) => {\n        if (React.isValidElement(icon)) {\n            return icon;\n        }\n\n        return undefined;\n    }, []);\n\n    return (\n        <AdminTag\n            {...omit(rest, [\n                \"selected\",\n                \"icon\",\n                \"trailingIconRemovesChip\",\n                \"onTrailingIconInteraction\",\n                \"checkmark\",\n                \"foundationRef\"\n            ])}\n            content={children || label}\n            dismissIconElement={createIconElement(trailingIcon)}\n            onDismiss={onRemove ? onRemoveCb : undefined}\n            onClick={onClick}\n        />\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAC1C,SAASC,GAAG,IAAIC,QAAQ,QAAQ,kBAAkB;AAClD,OAAOC,IAAI,MAAM,aAAa;AAoC9B;AACA;AACA;AACA;AACA,OAAO,MAAMC,IAAI,GAAIC,KAAgB,IAAK;EACtC,MAAM;IAAEC,QAAQ;IAAEC,KAAK;IAAEC,YAAY;IAAEC,QAAQ;IAAEC,aAAa;IAAE,GAAGC;EAAK,CAAC,GAAGN,KAAK;EAEjF,MAAMO,mBAAmB,GAAGZ,WAAW,CAClCa,EAAyC,IAAK;IAC3C,OAAO;MACH,GAAGA,EAAE;MACLC,MAAM,EAAE;QACJC,MAAM,EAAEV,KAAK,CAACW;MAClB;IACJ,CAAC;EACL,CAAC,EACD,CAACX,KAAK,CAACW,EAAE,CACb,CAAC;EAED,MAAMC,UAAU,GAAGjB,WAAW,CACzBa,EAAyC,IAAK;IAC3C,IAAI,CAACJ,QAAQ,EAAE;MACX;IACJ;IAEAA,QAAQ,CAACG,mBAAmB,CAACC,EAAE,CAAC,CAAC;EACrC,CAAC,EACD,CAACJ,QAAQ,CACb,CAAC;EAED,MAAMS,OAAO,GAAGlB,WAAW,CACtBa,EAAyC,IAAK;IAC3C,IAAI,CAACH,aAAa,EAAE;MAChB;IACJ;IAEAA,aAAa,CAACE,mBAAmB,CAACC,EAAE,CAAC,CAAC;EAC1C,CAAC,EACD,CAACH,aAAa,CAClB,CAAC;EAED,MAAMS,iBAAiB,GAAGnB,WAAW,CAAEoB,IAAqB,IAAK;IAC7D,iBAAIrB,KAAK,CAACsB,cAAc,CAACD,IAAI,CAAC,EAAE;MAC5B,OAAOA,IAAI;IACf;IAEA,OAAOE,SAAS;EACpB,CAAC,EAAE,EAAE,CAAC;EAEN,oBACIvB,KAAA,CAAAwB,aAAA,CAACrB,QAAQ,EAAAsB,MAAA,CAAAC,MAAA,KACDtB,IAAI,CAACQ,IAAI,EAAE,CACX,UAAU,EACV,MAAM,EACN,yBAAyB,EACzB,2BAA2B,EAC3B,WAAW,EACX,eAAe,CAClB,CAAC;IACFe,OAAO,EAAEpB,QAAQ,IAAIC,KAAM;IAC3BoB,kBAAkB,EAAER,iBAAiB,CAACX,YAAY,CAAE;IACpDoB,SAAS,EAAEnB,QAAQ,GAAGQ,UAAU,GAAGK,SAAU;IAC7CJ,OAAO,EAAEA;EAAQ,EACpB,CAAC;AAEV,CAAC","ignoreList":[]}

package/Chips/Chips.d.ts

@@ -18,4 +18,8 @@ export interface ChipsProps {
      */
     style?: React.CSSProperties;
 }
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Tag` component from the `@webiny/admin-ui` package instead.
+ */
 export declare const Chips: (props: ChipsProps) => React.JSX.Element;

package/Chips/Chips.js

@@ -1,24 +1,17 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Chips = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = _interopRequireDefault(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _chip = require("@rmwc/chip");
-var _styles = require("./styles");
-var _excluded = ["children", "className", "disabled"];
-var Chips = exports.Chips = function Chips(props) {
-  var children = props.children,
-    className = props.className,
-    disabled = props.disabled,
-    rest = (0, _objectWithoutProperties2.default)(props, _excluded);
-  return /*#__PURE__*/_react.default.createElement(_chip.ChipSet, Object.assign({}, rest, {
-    className: (0, _classnames.default)("mdc-evolution-chip-set", className, _styles.chipIconWrapper, (0, _defineProperty2.default)({}, _styles.disabledChips, disabled))
+import React from "react";
+import { cn } from "@webiny/admin-ui";
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Tag` component from the `@webiny/admin-ui` package instead.
+ */
+export const Chips = props => {
+  const {
+    children,
+    className,
+    ...rest
+  } = props;
+  return /*#__PURE__*/React.createElement("div", Object.assign({}, rest, {
+    className: cn("mdc-evolution-chip-set wby-flex wby-gap-sm wby-py-sm", className)
   }), children);
 };
 

package/Chips/Chips.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_classnames","_chip","_styles","_excluded","Chips","exports","props","children","className","disabled","rest","_objectWithoutProperties2","default","createElement","ChipSet","Object","assign","classNames","chipIconWrapper","_defineProperty2","disabledChips"],"sources":["Chips.tsx"],"sourcesContent":["import React from \"react\";\nimport classNames from \"classnames\";\nimport { ChipSet } from \"@rmwc/chip\";\nimport { Chip } from \"./Chip\";\nimport { chipIconWrapper, disabledChips } from \"./styles\";\n\nexport interface ChipsProps {\n    /**\n     * Chips to show\n     */\n    children?: React.ReactElement<typeof Chip> | React.ReactElement<typeof Chip>[];\n\n    /**\n     * Is chip disabled?\n     */\n    disabled?: boolean;\n\n    /**\n     * CSS class name\n     */\n    className?: string;\n\n    /**\n     * Style object.\n     */\n    style?: React.CSSProperties;\n}\n\nexport const Chips = (props: ChipsProps) => {\n    const { children, className, disabled, ...rest } = props;\n\n    return (\n        <ChipSet\n            {...rest}\n            className={classNames(\"mdc-evolution-chip-set\", className, chipIconWrapper, {\n                [disabledChips]: disabled\n            })}\n        >\n            {children}\n        </ChipSet>\n    );\n};\n"],"mappings":";;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,WAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AAEA,IAAAG,OAAA,GAAAH,OAAA;AAA0D,IAAAI,SAAA;AAwBnD,IAAMC,KAAK,GAAAC,OAAA,CAAAD,KAAA,GAAG,SAARA,KAAKA,CAAIE,KAAiB,EAAK;EACxC,IAAQC,QAAQ,GAAmCD,KAAK,CAAhDC,QAAQ;IAAEC,SAAS,GAAwBF,KAAK,CAAtCE,SAAS;IAAEC,QAAQ,GAAcH,KAAK,CAA3BG,QAAQ;IAAKC,IAAI,OAAAC,yBAAA,CAAAC,OAAA,EAAKN,KAAK,EAAAH,SAAA;EAExD,oBACIN,MAAA,CAAAe,OAAA,CAAAC,aAAA,CAACZ,KAAA,CAAAa,OAAO,EAAAC,MAAA,CAAAC,MAAA,KACAN,IAAI;IACRF,SAAS,EAAE,IAAAS,mBAAU,EAAC,wBAAwB,EAAET,SAAS,EAAEU,uBAAe,MAAAC,gBAAA,CAAAP,OAAA,MACrEQ,qBAAa,EAAGX,QAAQ,CAC5B;EAAE,IAEFF,QACI,CAAC;AAElB,CAAC","ignoreList":[]}
+{"version":3,"names":["React","cn","Chips","props","children","className","rest","createElement","Object","assign"],"sources":["Chips.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn } from \"@webiny/admin-ui\";\nimport { Chip } from \"./Chip\";\n\nexport interface ChipsProps {\n    /**\n     * Chips to show\n     */\n    children?: React.ReactElement<typeof Chip> | React.ReactElement<typeof Chip>[];\n\n    /**\n     * Is chip disabled?\n     */\n    disabled?: boolean;\n\n    /**\n     * CSS class name\n     */\n    className?: string;\n\n    /**\n     * Style object.\n     */\n    style?: React.CSSProperties;\n}\n\n/**\n * @deprecated This component is deprecated and will be removed in future releases.\n * Please use the `Tag` component from the `@webiny/admin-ui` package instead.\n */\nexport const Chips = (props: ChipsProps) => {\n    const { children, className, ...rest } = props;\n\n    return (\n        <div\n            {...rest}\n            className={cn(\"mdc-evolution-chip-set wby-flex wby-gap-sm wby-py-sm\", className)}\n        >\n            {children}\n        </div>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,EAAE,QAAQ,kBAAkB;AAyBrC;AACA;AACA;AACA;AACA,OAAO,MAAMC,KAAK,GAAIC,KAAiB,IAAK;EACxC,MAAM;IAAEC,QAAQ;IAAEC,SAAS;IAAE,GAAGC;EAAK,CAAC,GAAGH,KAAK;EAE9C,oBACIH,KAAA,CAAAO,aAAA,QAAAC,MAAA,CAAAC,MAAA,KACQH,IAAI;IACRD,SAAS,EAAEJ,EAAE,CAAC,sDAAsD,EAAEI,SAAS;EAAE,IAEhFD,QACA,CAAC;AAEd,CAAC","ignoreList":[]}

package/Chips/index.js

@@ -1,29 +1,4 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _Chips = require("./Chips");
-Object.keys(_Chips).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _Chips[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _Chips[key];
-    }
-  });
-});
-var _Chip = require("./Chip");
-Object.keys(_Chip).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _Chip[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _Chip[key];
-    }
-  });
-});
+export * from "./Chips";
+export * from "./Chip";
 
 //# sourceMappingURL=index.js.map

package/Chips/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Chips","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_Chip"],"sources":["index.ts"],"sourcesContent":["export * from \"./Chips\";\nexport * from \"./Chip\";\n"],"mappings":";;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,MAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,MAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,MAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAK,KAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,KAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,KAAA,CAAAL,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAC,KAAA,CAAAL,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Chips\";\nexport * from \"./Chip\";\n"],"mappings":"AAAA;AACA","ignoreList":[]}