@webiny/ui 0.0.0-mt-3 → 0.0.0-unstable.06b2ede40f

package/Button/ButtonPrimary.js

@@ -0,0 +1,16 @@
+import React from "react";
+import { useMappedButtonProps } from "./useMappedButtonProps";
+import { Button as AdminUiButton } from "@webiny/admin-ui";
+
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Button` component from the `@webiny/admin-ui` package instead.
+ */
+export const ButtonPrimary = function ButtonPrimary(props) {
+  const mappedProps = useMappedButtonProps(props);
+  return /*#__PURE__*/React.createElement(AdminUiButton, Object.assign({}, mappedProps, {
+    variant: "primary"
+  }));
+};
+
+//# sourceMappingURL=ButtonPrimary.js.map

package/Button/ButtonPrimary.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useMappedButtonProps","Button","AdminUiButton","ButtonPrimary","props","mappedProps","createElement","Object","assign","variant"],"sources":["ButtonPrimary.tsx"],"sourcesContent":["import React from \"react\";\nimport type { ButtonProps } from \"./Button\";\nimport { useMappedButtonProps } from \"~/Button/useMappedButtonProps\";\nimport { Button as AdminUiButton } from \"@webiny/admin-ui\";\n\n/**\n * @deprecated This component is deprecated and will be removed in future releases.\n * Please use the `Button` component from the `@webiny/admin-ui` package instead.\n */\nexport const ButtonPrimary = function ButtonPrimary(props: ButtonProps) {\n    const mappedProps = useMappedButtonProps(props);\n    return <AdminUiButton {...mappedProps} variant={\"primary\"} />;\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,oBAAoB;AAC7B,SAASC,MAAM,IAAIC,aAAa,QAAQ,kBAAkB;;AAE1D;AACA;AACA;AACA;AACA,OAAO,MAAMC,aAAa,GAAG,SAASA,aAAaA,CAACC,KAAkB,EAAE;EACpE,MAAMC,WAAW,GAAGL,oBAAoB,CAACI,KAAK,CAAC;EAC/C,oBAAOL,KAAA,CAAAO,aAAA,CAACJ,aAAa,EAAAK,MAAA,CAAAC,MAAA,KAAKH,WAAW;IAAEI,OAAO,EAAE;EAAU,EAAE,CAAC;AACjE,CAAC","ignoreList":[]}

package/Button/ButtonSecondary.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import type { ButtonProps } from "./Button";
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Button` component from the `@webiny/admin-ui` package instead.
+ */
+export declare const ButtonSecondary: (props: ButtonProps) => React.JSX.Element;

package/Button/ButtonSecondary.js

@@ -0,0 +1,16 @@
+import React from "react";
+import { useMappedButtonProps } from "./useMappedButtonProps";
+import { Button as AdminUiButton } from "@webiny/admin-ui";
+
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Button` component from the `@webiny/admin-ui` package instead.
+ */
+export const ButtonSecondary = props => {
+  const mappedProps = useMappedButtonProps(props);
+  return /*#__PURE__*/React.createElement(AdminUiButton, Object.assign({}, mappedProps, {
+    variant: "secondary"
+  }));
+};
+
+//# sourceMappingURL=ButtonSecondary.js.map

package/Button/ButtonSecondary.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useMappedButtonProps","Button","AdminUiButton","ButtonSecondary","props","mappedProps","createElement","Object","assign","variant"],"sources":["ButtonSecondary.tsx"],"sourcesContent":["import React from \"react\";\nimport type { ButtonProps } from \"./Button\";\nimport { useMappedButtonProps } from \"~/Button/useMappedButtonProps\";\nimport { Button as AdminUiButton } from \"@webiny/admin-ui\";\n\n/**\n * @deprecated This component is deprecated and will be removed in future releases.\n * Please use the `Button` component from the `@webiny/admin-ui` package instead.\n */\nexport const ButtonSecondary = (props: ButtonProps) => {\n    const mappedProps = useMappedButtonProps(props);\n    return <AdminUiButton {...mappedProps} variant={\"secondary\"} />;\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,oBAAoB;AAC7B,SAASC,MAAM,IAAIC,aAAa,QAAQ,kBAAkB;;AAE1D;AACA;AACA;AACA;AACA,OAAO,MAAMC,eAAe,GAAIC,KAAkB,IAAK;EACnD,MAAMC,WAAW,GAAGL,oBAAoB,CAACI,KAAK,CAAC;EAC/C,oBAAOL,KAAA,CAAAO,aAAA,CAACJ,aAAa,EAAAK,MAAA,CAAAC,MAAA,KAAKH,WAAW;IAAEI,OAAO,EAAE;EAAY,EAAE,CAAC;AACnE,CAAC","ignoreList":[]}

package/Button/CopyButton.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+interface CopyButtonProps {
+    /**
+     * Value to copy to clipboard.
+     */
+    value: string;
+    /**
+     * Callback function that is executed after the value is copied to the clipboard.
+     */
+    onCopy?: () => void;
+}
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `CopyButton` component from the `@webiny/admin-ui` package instead.
+ */
+declare const CopyButton: (props: CopyButtonProps) => React.JSX.Element;
+export { CopyButton, CopyButtonProps };

package/Button/CopyButton.js

@@ -0,0 +1,12 @@
+import React from "react";
+import { CopyButton as AdminUiCopyButton } from "@webiny/admin-ui";
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `CopyButton` component from the `@webiny/admin-ui` package instead.
+ */
+const CopyButton = props => {
+  return /*#__PURE__*/React.createElement(AdminUiCopyButton, props);
+};
+export { CopyButton };
+
+//# sourceMappingURL=CopyButton.js.map

package/Button/CopyButton.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","CopyButton","AdminUiCopyButton","props","createElement"],"sources":["CopyButton.tsx"],"sourcesContent":["import React from \"react\";\nimport { CopyButton as AdminUiCopyButton } from \"@webiny/admin-ui\";\n\ninterface CopyButtonProps {\n    /**\n     * Value to copy to clipboard.\n     */\n    value: string;\n\n    /**\n     * Callback function that is executed after the value is copied to the clipboard.\n     */\n    onCopy?: () => void;\n}\n\n/**\n * @deprecated This component is deprecated and will be removed in future releases.\n * Please use the `CopyButton` component from the `@webiny/admin-ui` package instead.\n */\nconst CopyButton = (props: CopyButtonProps) => {\n    return <AdminUiCopyButton {...props} />;\n};\n\nexport { CopyButton, CopyButtonProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,IAAIC,iBAAiB,QAAQ,kBAAkB;AAclE;AACA;AACA;AACA;AACA,MAAMD,UAAU,GAAIE,KAAsB,IAAK;EAC3C,oBAAOH,KAAA,CAAAI,aAAA,CAACF,iBAAiB,EAAKC,KAAQ,CAAC;AAC3C,CAAC;AAED,SAASF,UAAU","ignoreList":[]}

package/Button/IconButton.d.ts

@@ -0,0 +1,17 @@
+import type { SyntheticEvent } from "react";
+import React from "react";
+import type { ButtonProps } from "./Button";
+export interface IconButtonProps extends ButtonProps {
+    /**
+     * Icon should be provided as an SvgComponent.
+     */
+    icon: React.ReactNode;
+    label?: string;
+    onMouseDown?: (e: SyntheticEvent) => void;
+    onMouseUp?: (e: SyntheticEvent) => void;
+}
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Button` component from the `@webiny/admin-ui` package instead.
+ */
+export declare const IconButton: (props: IconButtonProps) => React.JSX.Element;

package/Button/IconButton.js

@@ -0,0 +1,15 @@
+import React from "react";
+import { useMappedButtonProps } from "./useMappedButtonProps";
+import { IconButton as AdminUiBIconButton } from "@webiny/admin-ui";
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Button` component from the `@webiny/admin-ui` package instead.
+ */
+export const IconButton = props => {
+  const mappedProps = useMappedButtonProps(props);
+  return /*#__PURE__*/React.createElement(AdminUiBIconButton, Object.assign({}, mappedProps, {
+    variant: "ghost"
+  }));
+};
+
+//# sourceMappingURL=IconButton.js.map

package/Button/IconButton.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useMappedButtonProps","IconButton","AdminUiBIconButton","props","mappedProps","createElement","Object","assign","variant"],"sources":["IconButton.tsx"],"sourcesContent":["import type { SyntheticEvent } from \"react\";\nimport React from \"react\";\nimport type { ButtonProps } from \"./Button\";\nimport { useMappedButtonProps } from \"~/Button/useMappedButtonProps\";\nimport { IconButton as AdminUiBIconButton } from \"@webiny/admin-ui\";\n\nexport interface IconButtonProps extends ButtonProps {\n    /**\n     * Icon should be provided as an SvgComponent.\n     */\n    icon: React.ReactNode;\n\n    label?: string;\n\n    onMouseDown?: (e: SyntheticEvent) => void;\n\n    onMouseUp?: (e: SyntheticEvent) => void;\n}\n\n/**\n * @deprecated This component is deprecated and will be removed in future releases.\n * Please use the `Button` component from the `@webiny/admin-ui` package instead.\n */\nexport const IconButton = (props: IconButtonProps) => {\n    const mappedProps = useMappedButtonProps(props);\n    return <AdminUiBIconButton {...mappedProps} variant={\"ghost\"} />;\n};\n"],"mappings":"AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,oBAAoB;AAC7B,SAASC,UAAU,IAAIC,kBAAkB,QAAQ,kBAAkB;AAenE;AACA;AACA;AACA;AACA,OAAO,MAAMD,UAAU,GAAIE,KAAsB,IAAK;EAClD,MAAMC,WAAW,GAAGJ,oBAAoB,CAACG,KAAK,CAAC;EAC/C,oBAAOJ,KAAA,CAAAM,aAAA,CAACH,kBAAkB,EAAAI,MAAA,CAAAC,MAAA,KAAKH,WAAW;IAAEI,OAAO,EAAE;EAAQ,EAAE,CAAC;AACpE,CAAC","ignoreList":[]}

package/Button/index.d.ts

@@ -1,3 +1,8 @@
 export * from "./Button";
-export * from "./IconButton/IconButton";
-export * from "./CopyButton/CopyButton";
+export * from "./ButtonPrimary";
+export * from "./ButtonSecondary";
+export * from "./ButtonDefault";
+export * from "./ButtonFloating";
+export * from "./ButtonIcon";
+export * from "./CopyButton";
+export * from "./IconButton";

package/Button/index.js

@@ -1,3 +1,10 @@
 export * from "./Button";
-export * from "./IconButton/IconButton";
-export * from "./CopyButton/CopyButton";
+export * from "./ButtonPrimary";
+export * from "./ButtonSecondary";
+export * from "./ButtonDefault";
+export * from "./ButtonFloating";
+export * from "./ButtonIcon";
+export * from "./CopyButton";
+export * from "./IconButton";
+
+//# sourceMappingURL=index.js.map

package/Button/index.js.map

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

package/Button/useMappedButtonProps.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import type { ButtonProps } from "./Button";
+export declare const useMappedButtonProps: (props: ButtonProps) => {
+    text?: import("react").ReactNode;
+    size?: "sm" | "md" | "lg" | "xl" | null | undefined;
+    style?: {
+        [key: string]: any;
+    } | undefined;
+    className?: string | undefined;
+    children?: import("react").ReactNode;
+    disabled?: boolean | undefined;
+    onClick?: ((event: import("react").MouseEvent<any, MouseEvent>) => any) | undefined;
+    "data-testid"?: string | undefined;
+};

package/Button/useMappedButtonProps.js

@@ -0,0 +1,21 @@
+import { useMemo } from "react";
+import omit from "lodash/omit";
+export const useMappedButtonProps = props => {
+  return useMemo(() => {
+    const mappedButtonProps = {};
+    if (props.small === true) {
+      mappedButtonProps.size = "sm";
+    }
+    if (props.children) {
+      mappedButtonProps.text = props.children;
+    }
+
+    // Return all remaining props omitting unused ones.
+    return {
+      ...omit(props, ["flat", "ripple", "small"]),
+      ...mappedButtonProps
+    };
+  }, [props]);
+};
+
+//# sourceMappingURL=useMappedButtonProps.js.map

package/Button/useMappedButtonProps.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useMemo","omit","useMappedButtonProps","props","mappedButtonProps","small","size","children","text"],"sources":["useMappedButtonProps.ts"],"sourcesContent":["import { useMemo } from \"react\";\nimport omit from \"lodash/omit\";\nimport type { ButtonProps as AdminUiButtonProps } from \"@webiny/admin-ui\";\nimport type { ButtonProps } from \"~/Button/Button\";\n\nexport const useMappedButtonProps = (props: ButtonProps) => {\n    return useMemo(() => {\n        const mappedButtonProps: Pick<AdminUiButtonProps, \"size\" | \"text\"> = {};\n\n        if (props.small === true) {\n            mappedButtonProps.size = \"sm\";\n        }\n\n        if (props.children) {\n            mappedButtonProps.text = props.children;\n        }\n\n        // Return all remaining props omitting unused ones.\n        return {\n            ...omit(props, [\"flat\", \"ripple\", \"small\"]),\n            ...mappedButtonProps\n        };\n    }, [props]);\n};\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,OAAO;AAC/B,OAAOC,IAAI,MAAM,aAAa;AAI9B,OAAO,MAAMC,oBAAoB,GAAIC,KAAkB,IAAK;EACxD,OAAOH,OAAO,CAAC,MAAM;IACjB,MAAMI,iBAA4D,GAAG,CAAC,CAAC;IAEvE,IAAID,KAAK,CAACE,KAAK,KAAK,IAAI,EAAE;MACtBD,iBAAiB,CAACE,IAAI,GAAG,IAAI;IACjC;IAEA,IAAIH,KAAK,CAACI,QAAQ,EAAE;MAChBH,iBAAiB,CAACI,IAAI,GAAGL,KAAK,CAACI,QAAQ;IAC3C;;IAEA;IACA,OAAO;MACH,GAAGN,IAAI,CAACE,KAAK,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC;MAC3C,GAAGC;IACP,CAAC;EACL,CAAC,EAAE,CAACD,KAAK,CAAC,CAAC;AACf,CAAC","ignoreList":[]}

package/Carousel/Carousel.d.ts

@@ -1,19 +1,10 @@
-import * as React from "react";
-import { CarouselProps, CarouselRenderControl } from "nuka-carousel";
-declare type Props = CarouselProps & {
+import React from "react";
+interface Props extends Record<string, any> {
     children: React.ReactNode;
-    renderNextSlide?: CarouselRenderControl | null;
-    renderPreviousSlide?: CarouselRenderControl | null;
-    renderBottomNav?: CarouselRenderControl | null;
-};
-declare class Carousel extends React.Component<Props> {
-    static defaultProps: {
-        swiping: boolean;
-        dragging: boolean;
-        heightMode: string;
-        easing: string;
-    };
-    static nukaProps: string[];
-    render(): JSX.Element;
 }
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please implement your own `Carousel` component or reach out on Slack.
+ */
+declare const Carousel: (props: Props) => React.JSX.Element;
 export default Carousel;

package/Carousel/Carousel.js

@@ -1,46 +1,12 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _createSuper from "@babel/runtime/helpers/createSuper";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import * as React from "react";
-import NukaCarousel from "nuka-carousel";
-import pick from "lodash/pick";
-
-var Carousel = /*#__PURE__*/function (_React$Component) {
-  _inherits(Carousel, _React$Component);
-
-  var _super = _createSuper(Carousel);
-
-  function Carousel() {
-    _classCallCheck(this, Carousel);
-
-    return _super.apply(this, arguments);
-  }
-
-  _createClass(Carousel, [{
-    key: "render",
-    value: function render() {
-      return /*#__PURE__*/React.createElement(NukaCarousel, Object.assign({}, pick(this.props, Carousel.nukaProps), this.props.renderPreviousSlide ? {
-        renderCenterLeftControls: this.props.renderPreviousSlide
-      } : {}, this.props.renderNextSlide ? {
-        renderCenterRightControls: this.props.renderNextSlide
-      } : {}, this.props.renderBottomNav ? {
-        renderBottomCenterControls: this.props.renderBottomNav
-      } : {}), this.props.children);
-    }
-  }]);
-
-  return Carousel;
-}(React.Component);
-
-_defineProperty(Carousel, "defaultProps", {
-  swiping: true,
-  dragging: false,
-  heightMode: "first",
-  easing: "easeExpInOut"
-});
-
-_defineProperty(Carousel, "nukaProps", ["children", "afterSlide", "autoplay", "autoplayInterval", "beforeSlide", "dragging", "easing", "heightMode", "pauseOnHover", "slideIndex", "speed", "swiping", "transitionMode"]);
-
-export default Carousel;
+import React from "react";
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please implement your own `Carousel` component or reach out on Slack.
+ */
+const Carousel = props => {
+  console.warn("The `Carousel` component is deprecated and will be removed in future releases.");
+  return /*#__PURE__*/React.createElement(React.Fragment, null, props.children);
+};
+export default Carousel;
+
+//# sourceMappingURL=Carousel.js.map

package/Carousel/Carousel.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Carousel","props","console","warn","createElement","Fragment","children"],"sources":["Carousel.tsx"],"sourcesContent":["import React from \"react\";\n\ninterface Props extends Record<string, any> {\n    children: React.ReactNode;\n}\n\n/**\n * @deprecated This component is deprecated and will be removed in future releases.\n * Please implement your own `Carousel` component or reach out on Slack.\n */\nconst Carousel = (props: Props) => {\n    console.warn(\"The `Carousel` component is deprecated and will be removed in future releases.\");\n    return <>{props.children}</>;\n};\n\nexport default Carousel;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAMzB;AACA;AACA;AACA;AACA,MAAMC,QAAQ,GAAIC,KAAY,IAAK;EAC/BC,OAAO,CAACC,IAAI,CAAC,gFAAgF,CAAC;EAC9F,oBAAOJ,KAAA,CAAAK,aAAA,CAAAL,KAAA,CAAAM,QAAA,QAAGJ,KAAK,CAACK,QAAW,CAAC;AAChC,CAAC;AAED,eAAeN,QAAQ","ignoreList":[]}

package/Carousel/index.js

@@ -1 +1,3 @@
-export { default as Carousel } from "./Carousel";
+export { default as Carousel } from "./Carousel";
+
+//# sourceMappingURL=index.js.map

package/Carousel/index.js.map

@@ -0,0 +1 @@
+{"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

@@ -1,25 +1,21 @@
-import * as React from "react";
-import { FormComponentProps } from "../types";
-declare type Props = FormComponentProps & {
-    label?: React.ReactNode;
+import React from "react";
+import type { FormComponentProps } from "../types";
+interface Props extends FormComponentProps {
+    id?: string;
+    label?: string;
     disabled?: boolean;
-    onClick?: Function;
+    onClick?: (value: boolean) => void;
     indeterminate?: boolean;
     description?: string;
-};
+    "data-testid"?: string;
+    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> {
-    static defaultProps: {
-        validation: {
-            isValid: any;
-        };
-    };
-    onChange: (e: React.SyntheticEvent<HTMLInputElement>) => void;
-    render(): JSX.Element;
+    onChange: (checked: boolean) => void;
+    render(): React.JSX.Element;
 }
 export default Checkbox;

package/Checkbox/Checkbox.js

@@ -1,76 +1,38 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _createSuper from "@babel/runtime/helpers/createSuper";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import * as React from "react";
-import { Checkbox as RmwcCheckbox } from "@rmwc/checkbox";
-import { FormElementMessage } from "../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) {
-  _inherits(Checkbox, _React$Component);
-
-  var _super = _createSuper(Checkbox);
-
-  function Checkbox() {
-    var _this;
-
-    _classCallCheck(this, Checkbox);
-
-    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));
-
-    _defineProperty(_assertThisInitialized(_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;
-  }
-
-  _createClass(Checkbox, [{
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-          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;
-      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(RmwcCheckbox, {
-        indeterminate: indeterminate,
-        disabled: disabled,
-        checked: Boolean(value),
-        onChange: this.onChange,
-        onClick: function onClick() {
-          return typeof _onClick === "function" && _onClick(Boolean(value));
-        } // @ts-ignore Although the label is React.ReactNode internally, an error is still thrown.
-        ,
-        label: label
-      }), validation.isValid === false && /*#__PURE__*/React.createElement(FormElementMessage, {
-        error: true
-      }, validation.message), validation.isValid !== false && description && /*#__PURE__*/React.createElement(FormElementMessage, null, description));
-    }
-  }]);
-
-  return Checkbox;
-}(React.Component);
-
-_defineProperty(Checkbox, "defaultProps", {
-  validation: {
-    isValid: null
   }
-});
+}
+export default Checkbox;
 
-export default Checkbox;
+//# sourceMappingURL=Checkbox.js.map

package/Checkbox/Checkbox.js.map

@@ -0,0 +1 @@
+{"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 type { 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,15 +1,19 @@
-import * as React from "react";
-import { FormComponentProps } from "../types";
-interface ChildrenRenderProp {
+import React from "react";
+import type { FormComponentProps } from "../types";
+export interface ChildrenRenderProp {
     onChange: (id: string | number) => () => void;
     getValue: (id: string | number) => boolean;
 }
-declare type Props = FormComponentProps & {
+type Props = FormComponentProps & {
     label?: string;
     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(): JSX.Element;
+    render(): React.JSX.Element;
 }
 export default CheckboxGroup;

package/Checkbox/CheckboxGroup.js

@@ -1,63 +1,49 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _createSuper from "@babel/runtime/helpers/createSuper";
-import * as React from "react";
-import { webinyCheckboxTitle } from "./Checkbox.styles";
-import { FormElementMessage } from "../FormElementMessage";
-
-var CheckboxGroup = /*#__PURE__*/function (_React$Component) {
-  _inherits(CheckboxGroup, _React$Component);
-
-  var _super = _createSuper(CheckboxGroup);
-
-  function CheckboxGroup() {
-    _classCallCheck(this, CheckboxGroup);
-
-    return _super.apply(this, 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
+    }));
   }
+}
+export default CheckboxGroup;
 
-  _createClass(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.createElement(React.Fragment, null, label && /*#__PURE__*/React.createElement("div", {
-        className: "mdc-text-field-helper-text mdc-text-field-helper-text--persistent " + webinyCheckboxTitle
-      }, label), this.props.children({
-        onChange: function onChange(value) {
-          return function () {
-            var values = Array.isArray(_this.props.value) ? _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.createElement(FormElementMessage, {
-        error: true
-      }, validation.message), validation.isValid !== false && description && /*#__PURE__*/React.createElement(FormElementMessage, null, description));
-    }
-  }]);
-
-  return CheckboxGroup;
-}(React.Component);
-
-export default CheckboxGroup;
+//# sourceMappingURL=CheckboxGroup.js.map

package/Checkbox/CheckboxGroup.js.map

@@ -0,0 +1 @@
+{"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 type { 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,2 +1,4 @@
 export { default as Checkbox } from "./Checkbox";
-export { default as CheckboxGroup } from "./CheckboxGroup";
+export { default as CheckboxGroup } from "./CheckboxGroup";
+
+//# sourceMappingURL=index.js.map

package/Checkbox/index.js.map

@@ -0,0 +1 @@
+{"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":[]}