@commercetools-uikit/checkbox-input 12.2.2 → 12.2.6

package/dist/commercetools-uikit-checkbox-input.cjs.prod.js

@@ -2,14 +2,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _extends = require('@babel/runtime-corejs3/helpers/extends');
-var _styled = require('@emotion/styled/base');
-require('prop-types');
-var React = require('react');
-var react = require('@emotion/react');
-var designSystem = require('@commercetools-uikit/design-system');
-var utils = require('@commercetools-uikit/utils');
-var Text = require('@commercetools-uikit/text');
 var _Object$keys = require('@babel/runtime-corejs3/core-js-stable/object/keys');
 var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
 var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/filter');
@@ -19,14 +11,19 @@ var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js-
 var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
 var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
 var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
+var _styled = require('@emotion/styled/base');
+require('prop-types');
+var react$1 = require('react');
+var react = require('@emotion/react');
+var designSystem = require('@commercetools-uikit/design-system');
+var utils = require('@commercetools-uikit/utils');
+var Text = require('@commercetools-uikit/text');
 var inputUtils = require('@commercetools-uikit/input-utils');
+var jsxRuntime = require('@emotion/react/jsx-runtime');
 var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
-var _styled__default = /*#__PURE__*/_interopDefault(_styled);
-var React__default = /*#__PURE__*/_interopDefault(React);
-var Text__default = /*#__PURE__*/_interopDefault(Text);
 var _Object$keys__default = /*#__PURE__*/_interopDefault(_Object$keys);
 var _Object$getOwnPropertySymbols__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertySymbols);
 var _filterInstanceProperty__default = /*#__PURE__*/_interopDefault(_filterInstanceProperty);
@@ -35,11 +32,13 @@ var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachIns
 var _Object$getOwnPropertyDescriptors__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptors);
 var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$defineProperties);
 var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
+var _styled__default = /*#__PURE__*/_interopDefault(_styled);
+var Text__default = /*#__PURE__*/_interopDefault(Text);
 var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
 
-function ownKeys$3(object, enumerableOnly) { var keys = _Object$keys__default['default'](object); if (_Object$getOwnPropertySymbols__default['default']) { var symbols = _Object$getOwnPropertySymbols__default['default'](object); if (enumerableOnly) { symbols = _filterInstanceProperty__default['default'](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default['default'](object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$5(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (enumerableOnly) { symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context3; _forEachInstanceProperty__default['default'](_context3 = ownKeys$3(Object(source), true)).call(_context3, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default['default']) { _Object$defineProperties__default['default'](target, _Object$getOwnPropertyDescriptors__default['default'](source)); } else { var _context4; _forEachInstanceProperty__default['default'](_context4 = ownKeys$3(Object(source))).call(_context4, function (key) { _Object$defineProperty__default['default'](target, key, _Object$getOwnPropertyDescriptor__default['default'](source, key)); }); } } return target; }
+function _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context3; _forEachInstanceProperty__default["default"](_context3 = ownKeys$5(Object(source), true)).call(_context3, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context4; _forEachInstanceProperty__default["default"](_context4 = ownKeys$5(Object(source))).call(_context4, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } } return target; }
 var iconSizes$2 = {
   small: 12,
   medium: 16,
@@ -77,17 +76,17 @@ var getSizeStyle$2 = function getSizeStyle(size) {
 
   switch (size) {
     case 'scale':
-      return _concatInstanceProperty__default['default'](_context = "\n        &:not(:root) {\n          width: ".concat(dimensions.width, ";\n          height: ")).call(_context, dimensions.height, ";\n        }\n      ");
+      return _concatInstanceProperty__default["default"](_context = "\n        &:not(:root) {\n          width: ".concat(dimensions.width, ";\n          height: ")).call(_context, dimensions.height, ";\n        }\n      ");
 
     default:
-      return _concatInstanceProperty__default['default'](_context2 = "\n        width: ".concat(dimensions.width, ";\n        height: ")).call(_context2, dimensions.height, ";\n      ");
+      return _concatInstanceProperty__default["default"](_context2 = "\n        width: ".concat(dimensions.width, ";\n        height: ")).call(_context2, dimensions.height, ";\n      ");
   }
 };
 
 var getColor$2 = function getColor(color, theme) {
   if (!color) return 'inherit';
 
-  var overwrittenVars = _objectSpread$3(_objectSpread$3({}, designSystem.customProperties), theme);
+  var overwrittenVars = _objectSpread$5(_objectSpread$5({}, designSystem.customProperties), theme);
 
   var iconColor;
 
@@ -133,59 +132,66 @@ var getColor$2 = function getColor(color, theme) {
 };
 
 var getIconStyles$2 = function getIconStyles(props, theme) {
-  return /*#__PURE__*/react.css("*:not([fill='none']){fill:", getColor$2(props.color, theme), ";}&,image{", getSizeStyle$2(props.size), ";}flex-shrink:0;" + ("" ));
+  return /*#__PURE__*/react.css("*:not([fill='none']){fill:", getColor$2(props.color, theme), ";}&,image{", getSizeStyle$2(props.size), ";}flex-shrink:0;" + ("" ), "" );
 };
 
 var SvgChecked = function SvgChecked(props) {
-  return react.jsx("svg", _extends({
+  return jsxRuntime.jsx("svg", _objectSpread$5(_objectSpread$5({
     width: 16,
     height: 16,
     viewBox: "0 0 16 16",
     xmlns: "http://www.w3.org/2000/svg"
-  }, props), react.jsx("g", {
-    transform: "translate(0 -1)",
-    fillRule: "evenodd"
-  }, react.jsx("rect", {
-    fill: "#FFF",
-    y: 1,
-    width: 16,
-    height: 16,
-    rx: 4
-  }), react.jsx("g", {
-    transform: "translate(0 .5)"
-  }, react.jsx("rect", {
-    "data-style": "checkbox__border",
-    stroke: "#AFAFAF",
-    x: 0.5,
-    y: 1,
-    width: 15,
-    height: 15,
-    rx: 4
-  }), react.jsx("path", {
-    "data-style": "checkbox__content",
-    d: "M12.918 3.759a.497.497 0 00-.7 0L6.011 9.966a.497.497 0 01-.7 0L3.78 8.438a.497.497 0 00-.699 0l-.938.938a.497.497 0 000 .7l3.167 3.165a.497.497 0 00.7 0l7.845-7.845a.496.496 0 000-.7l-.938-.937z",
-    fill: "#20AD92",
-    fillRule: "nonzero"
-  }))));
+  }, props), {}, {
+    children: jsxRuntime.jsxs("g", {
+      transform: "translate(0 -1)",
+      fillRule: "evenodd",
+      children: [jsxRuntime.jsx("rect", {
+        fill: "#FFF",
+        y: 1,
+        width: 16,
+        height: 16,
+        rx: 4
+      }), jsxRuntime.jsxs("g", {
+        transform: "translate(0 .5)",
+        children: [jsxRuntime.jsx("rect", {
+          "data-style": "checkbox__border",
+          stroke: "#AFAFAF",
+          x: 0.5,
+          y: 1,
+          width: 15,
+          height: 15,
+          rx: 4
+        }), jsxRuntime.jsx("path", {
+          "data-style": "checkbox__content",
+          d: "M12.918 3.759a.497.497 0 00-.7 0L6.011 9.966a.497.497 0 01-.7 0L3.78 8.438a.497.497 0 00-.699 0l-.938.938a.497.497 0 000 .7l3.167 3.165a.497.497 0 00.7 0l7.845-7.845a.496.496 0 000-.7l-.938-.937z",
+          fill: "#20AD92",
+          fillRule: "nonzero"
+        })]
+      })]
+    })
+  }));
 };
 
-SvgChecked.propTypes = {};
 SvgChecked.displayName = 'SvgChecked';
 
 var CheckedIcon = function CheckedIcon(props) {
   var theme = react.useTheme();
-  return react.jsx(SvgChecked, _extends({}, props, {
-    css: getIconStyles$2(props, theme)
-  }));
+  return jsxRuntime.jsx(react.ClassNames, {
+    children: function children(_ref) {
+      var createClass = _ref.css;
+      return jsxRuntime.jsx(SvgChecked, _objectSpread$5(_objectSpread$5({}, props), {}, {
+        className: createClass(getIconStyles$2(props, theme))
+      }));
+    }
+  });
 };
 
-CheckedIcon.propTypes = {};
 CheckedIcon.displayName = 'CheckedIcon';
 var CheckedIcon$1 = CheckedIcon;
 
-function ownKeys$2(object, enumerableOnly) { var keys = _Object$keys__default['default'](object); if (_Object$getOwnPropertySymbols__default['default']) { var symbols = _Object$getOwnPropertySymbols__default['default'](object); if (enumerableOnly) { symbols = _filterInstanceProperty__default['default'](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default['default'](object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$4(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (enumerableOnly) { symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context3; _forEachInstanceProperty__default['default'](_context3 = ownKeys$2(Object(source), true)).call(_context3, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default['default']) { _Object$defineProperties__default['default'](target, _Object$getOwnPropertyDescriptors__default['default'](source)); } else { var _context4; _forEachInstanceProperty__default['default'](_context4 = ownKeys$2(Object(source))).call(_context4, function (key) { _Object$defineProperty__default['default'](target, key, _Object$getOwnPropertyDescriptor__default['default'](source, key)); }); } } return target; }
+function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context3; _forEachInstanceProperty__default["default"](_context3 = ownKeys$4(Object(source), true)).call(_context3, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context4; _forEachInstanceProperty__default["default"](_context4 = ownKeys$4(Object(source))).call(_context4, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } } return target; }
 var iconSizes$1 = {
   small: 12,
   medium: 16,
@@ -223,17 +229,17 @@ var getSizeStyle$1 = function getSizeStyle(size) {
 
   switch (size) {
     case 'scale':
-      return _concatInstanceProperty__default['default'](_context = "\n        &:not(:root) {\n          width: ".concat(dimensions.width, ";\n          height: ")).call(_context, dimensions.height, ";\n        }\n      ");
+      return _concatInstanceProperty__default["default"](_context = "\n        &:not(:root) {\n          width: ".concat(dimensions.width, ";\n          height: ")).call(_context, dimensions.height, ";\n        }\n      ");
 
     default:
-      return _concatInstanceProperty__default['default'](_context2 = "\n        width: ".concat(dimensions.width, ";\n        height: ")).call(_context2, dimensions.height, ";\n      ");
+      return _concatInstanceProperty__default["default"](_context2 = "\n        width: ".concat(dimensions.width, ";\n        height: ")).call(_context2, dimensions.height, ";\n      ");
   }
 };
 
 var getColor$1 = function getColor(color, theme) {
   if (!color) return 'inherit';
 
-  var overwrittenVars = _objectSpread$2(_objectSpread$2({}, designSystem.customProperties), theme);
+  var overwrittenVars = _objectSpread$4(_objectSpread$4({}, designSystem.customProperties), theme);
 
   var iconColor;
 
@@ -279,58 +285,65 @@ var getColor$1 = function getColor(color, theme) {
 };
 
 var getIconStyles$1 = function getIconStyles(props, theme) {
-  return /*#__PURE__*/react.css("*:not([fill='none']){fill:", getColor$1(props.color, theme), ";}&,image{", getSizeStyle$1(props.size), ";}flex-shrink:0;" + ("" ));
+  return /*#__PURE__*/react.css("*:not([fill='none']){fill:", getColor$1(props.color, theme), ";}&,image{", getSizeStyle$1(props.size), ";}flex-shrink:0;" + ("" ), "" );
 };
 
 var SvgIndeterminate = function SvgIndeterminate(props) {
-  return react.jsx("svg", _extends({
+  return jsxRuntime.jsx("svg", _objectSpread$4(_objectSpread$4({
     width: 16,
     height: 16,
     viewBox: "0 0 16 16",
     xmlns: "http://www.w3.org/2000/svg"
-  }, props), react.jsx("g", {
-    transform: "translate(0 -1)",
-    fillRule: "evenodd"
-  }, react.jsx("rect", {
-    fill: "#FFF",
-    y: 1,
-    width: 16,
-    height: 16,
-    rx: 4
-  }), react.jsx("g", {
-    transform: "translate(0 .5)"
-  }, react.jsx("rect", {
-    "data-style": "checkbox__border",
-    stroke: "#AFAFAF",
-    x: 0.5,
-    y: 1,
-    width: 15,
-    height: 15,
-    rx: 4
-  }), react.jsx("path", {
-    "data-style": "checkbox__content",
-    fill: "#00B6A1",
-    d: "M3 7.5h10v2H3z"
-  }))));
+  }, props), {}, {
+    children: jsxRuntime.jsxs("g", {
+      transform: "translate(0 -1)",
+      fillRule: "evenodd",
+      children: [jsxRuntime.jsx("rect", {
+        fill: "#FFF",
+        y: 1,
+        width: 16,
+        height: 16,
+        rx: 4
+      }), jsxRuntime.jsxs("g", {
+        transform: "translate(0 .5)",
+        children: [jsxRuntime.jsx("rect", {
+          "data-style": "checkbox__border",
+          stroke: "#AFAFAF",
+          x: 0.5,
+          y: 1,
+          width: 15,
+          height: 15,
+          rx: 4
+        }), jsxRuntime.jsx("path", {
+          "data-style": "checkbox__content",
+          fill: "#00B6A1",
+          d: "M3 7.5h10v2H3z"
+        })]
+      })]
+    })
+  }));
 };
 
-SvgIndeterminate.propTypes = {};
 SvgIndeterminate.displayName = 'SvgIndeterminate';
 
 var IndeterminateIcon = function IndeterminateIcon(props) {
   var theme = react.useTheme();
-  return react.jsx(SvgIndeterminate, _extends({}, props, {
-    css: getIconStyles$1(props, theme)
-  }));
+  return jsxRuntime.jsx(react.ClassNames, {
+    children: function children(_ref) {
+      var createClass = _ref.css;
+      return jsxRuntime.jsx(SvgIndeterminate, _objectSpread$4(_objectSpread$4({}, props), {}, {
+        className: createClass(getIconStyles$1(props, theme))
+      }));
+    }
+  });
 };
 
-IndeterminateIcon.propTypes = {};
 IndeterminateIcon.displayName = 'IndeterminateIcon';
 var IndeterminateIcon$1 = IndeterminateIcon;
 
-function ownKeys$1(object, enumerableOnly) { var keys = _Object$keys__default['default'](object); if (_Object$getOwnPropertySymbols__default['default']) { var symbols = _Object$getOwnPropertySymbols__default['default'](object); if (enumerableOnly) { symbols = _filterInstanceProperty__default['default'](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default['default'](object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$3(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (enumerableOnly) { symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context3; _forEachInstanceProperty__default['default'](_context3 = ownKeys$1(Object(source), true)).call(_context3, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default['default']) { _Object$defineProperties__default['default'](target, _Object$getOwnPropertyDescriptors__default['default'](source)); } else { var _context4; _forEachInstanceProperty__default['default'](_context4 = ownKeys$1(Object(source))).call(_context4, function (key) { _Object$defineProperty__default['default'](target, key, _Object$getOwnPropertyDescriptor__default['default'](source, key)); }); } } return target; }
+function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context3; _forEachInstanceProperty__default["default"](_context3 = ownKeys$3(Object(source), true)).call(_context3, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context4; _forEachInstanceProperty__default["default"](_context4 = ownKeys$3(Object(source))).call(_context4, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } } return target; }
 var iconSizes = {
   small: 12,
   medium: 16,
@@ -368,17 +381,17 @@ var getSizeStyle = function getSizeStyle(size) {
 
   switch (size) {
     case 'scale':
-      return _concatInstanceProperty__default['default'](_context = "\n        &:not(:root) {\n          width: ".concat(dimensions.width, ";\n          height: ")).call(_context, dimensions.height, ";\n        }\n      ");
+      return _concatInstanceProperty__default["default"](_context = "\n        &:not(:root) {\n          width: ".concat(dimensions.width, ";\n          height: ")).call(_context, dimensions.height, ";\n        }\n      ");
 
     default:
-      return _concatInstanceProperty__default['default'](_context2 = "\n        width: ".concat(dimensions.width, ";\n        height: ")).call(_context2, dimensions.height, ";\n      ");
+      return _concatInstanceProperty__default["default"](_context2 = "\n        width: ".concat(dimensions.width, ";\n        height: ")).call(_context2, dimensions.height, ";\n      ");
   }
 };
 
 var getColor = function getColor(color, theme) {
   if (!color) return 'inherit';
 
-  var overwrittenVars = _objectSpread$1(_objectSpread$1({}, designSystem.customProperties), theme);
+  var overwrittenVars = _objectSpread$3(_objectSpread$3({}, designSystem.customProperties), theme);
 
   var iconColor;
 
@@ -424,53 +437,59 @@ var getColor = function getColor(color, theme) {
 };
 
 var getIconStyles = function getIconStyles(props, theme) {
-  return /*#__PURE__*/react.css("*:not([fill='none']){fill:", getColor(props.color, theme), ";}&,image{", getSizeStyle(props.size), ";}flex-shrink:0;" + ("" ));
+  return /*#__PURE__*/react.css("*:not([fill='none']){fill:", getColor(props.color, theme), ";}&,image{", getSizeStyle(props.size), ";}flex-shrink:0;" + ("" ), "" );
 };
 
 var SvgUnchecked = function SvgUnchecked(props) {
-  return react.jsx("svg", _extends({
+  return jsxRuntime.jsx("svg", _objectSpread$3(_objectSpread$3({
     width: 16,
     height: 16,
     viewBox: "0 0 16 16",
     xmlns: "http://www.w3.org/2000/svg"
-  }, props), react.jsx("g", {
-    transform: "translate(0 -1)",
-    fillRule: "evenodd"
-  }, react.jsx("rect", {
-    fill: "#FFF",
-    y: 1,
-    width: 16,
-    height: 16,
-    rx: 4
-  }), react.jsx("rect", {
-    "data-style": "checkbox__border",
-    x: 0.5,
-    y: 1,
-    width: 15,
-    height: 15,
-    rx: 4,
-    transform: "translate(0 .5)",
-    stroke: "#AFAFAF"
-  })));
+  }, props), {}, {
+    children: jsxRuntime.jsxs("g", {
+      transform: "translate(0 -1)",
+      fillRule: "evenodd",
+      children: [jsxRuntime.jsx("rect", {
+        fill: "#FFF",
+        y: 1,
+        width: 16,
+        height: 16,
+        rx: 4
+      }), jsxRuntime.jsx("rect", {
+        "data-style": "checkbox__border",
+        x: 0.5,
+        y: 1,
+        width: 15,
+        height: 15,
+        rx: 4,
+        transform: "translate(0 .5)",
+        stroke: "#AFAFAF"
+      })]
+    })
+  }));
 };
 
-SvgUnchecked.propTypes = {};
 SvgUnchecked.displayName = 'SvgUnchecked';
 
 var UncheckedIcon = function UncheckedIcon(props) {
   var theme = react.useTheme();
-  return react.jsx(SvgUnchecked, _extends({}, props, {
-    css: getIconStyles(props, theme)
-  }));
+  return jsxRuntime.jsx(react.ClassNames, {
+    children: function children(_ref) {
+      var createClass = _ref.css;
+      return jsxRuntime.jsx(SvgUnchecked, _objectSpread$3(_objectSpread$3({}, props), {}, {
+        className: createClass(getIconStyles(props, theme))
+      }));
+    }
+  });
 };
 
-UncheckedIcon.propTypes = {};
 UncheckedIcon.displayName = 'UncheckedIcon';
 var UncheckedIcon$1 = UncheckedIcon;
 
-function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default['default'](object); if (_Object$getOwnPropertySymbols__default['default']) { var symbols = _Object$getOwnPropertySymbols__default['default'](object); if (enumerableOnly) { symbols = _filterInstanceProperty__default['default'](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default['default'](object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$2(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (enumerableOnly) { symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default['default'](_context = ownKeys(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default['default']) { _Object$defineProperties__default['default'](target, _Object$getOwnPropertyDescriptors__default['default'](source)); } else { var _context2; _forEachInstanceProperty__default['default'](_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty__default['default'](target, key, _Object$getOwnPropertyDescriptor__default['default'](source, key)); }); } } return target; }
+function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default["default"](_context = ownKeys$2(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context2; _forEachInstanceProperty__default["default"](_context2 = ownKeys$2(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } } return target; }
 
 var getSvgBorderStroke = function getSvgBorderStroke(vars, props) {
   if (props.isDisabled) {
@@ -509,34 +528,38 @@ var getSvgContentFill = function getSvgContentFill(vars, props) {
 };
 
 var getCheckboxWrapperStyles = function getCheckboxWrapperStyles(props, theme) {
-  var overwrittenVars = _objectSpread(_objectSpread({}, designSystem.customProperties), theme);
+  var overwrittenVars = _objectSpread$2(_objectSpread$2({}, designSystem.customProperties), theme);
   /* resets from createStyledIcon styles */
 
 
-  return /*#__PURE__*/react.css("*{fill:none;}display:flex;align-items:center;svg *[data-style='checkbox__border']{stroke:", getSvgBorderStroke(overwrittenVars, props), ";fill:", overwrittenVars[designSystem.designTokens.backgroundColorForInput], ";}svg *[data-style='checkbox__content']{fill:", getSvgContentFill(overwrittenVars, props), ";}" + ("" ));
+  return /*#__PURE__*/react.css("*{fill:none;}display:flex;align-items:center;svg *[data-style='checkbox__border']{stroke:", getSvgBorderStroke(overwrittenVars, props), ";fill:", overwrittenVars[designSystem.designTokens.backgroundColorForInput], ";}svg *[data-style='checkbox__content']{fill:", getSvgContentFill(overwrittenVars, props), ";}" + ("" ), "" );
 }; // eslint-disable-next-line import/prefer-default-export
 
-var Input = _styled__default['default']("input", {
+function ownKeys$1(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (enumerableOnly) { symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default["default"](_context = ownKeys$1(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context2; _forEachInstanceProperty__default["default"](_context2 = ownKeys$1(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } } return target; }
+
+var Input = _styled__default["default"]("input", {
   target: "e1ccch1p0"
-} )("&:focus+div>svg *[data-style='checkbox__border']{stroke:", designSystem.customProperties.borderColorForInputWhenFocused, ";}");
+} )("&:focus+div>svg *[data-style='checkbox__border']{stroke:", designSystem.customProperties.borderColorForInputWhenFocused, ";}" + ("" ));
 
 var Checkbox = function Checkbox(props) {
-  var ref = React__default['default'].useRef({
+  var ref = react$1.useRef({
     indeterminate: false
   });
-  React__default['default'].useEffect(function () {
+  react$1.useEffect(function () {
     if (props.isIndeterminate) {
       ref.current.indeterminate = true;
     }
   }, [props.isIndeterminate]);
   var onChange = props.onChange;
-  var handleChange = React__default['default'].useCallback(function (event) {
+  var handleChange = react$1.useCallback(function (event) {
     return !props.isReadOnly && onChange && onChange(event);
   }, [props.isReadOnly, onChange]);
-  return react.jsx(Input // @ts-ignore
-  , _extends({
+  return jsxRuntime.jsx(Input // @ts-ignore
+  , _objectSpread$1(_objectSpread$1(_objectSpread$1(_objectSpread$1({
     ref: ref
-  }, utils.filterDataAttributes(props), utils.filterAriaAttributes(props), {
+  }, utils.filterDataAttributes(props)), utils.filterAriaAttributes(props)), {}, {
     /* ARIA */
     "aria-readonly": props.isReadOnly,
     "aria-checked": props.isChecked,
@@ -547,7 +570,7 @@ var Checkbox = function Checkbox(props) {
     disabled: props.isDisabled || props.isReadOnly,
     readOnly: props.isReadOnly,
     checked: props.isChecked && !props.isIndeterminate
-  }, props, {
+  }, props), {}, {
     onChange: handleChange
   }));
 };
@@ -556,6 +579,9 @@ Checkbox.propTypes = {};
 Checkbox.displayName = 'Checkbox';
 var Checkbox$1 = Checkbox;
 
+function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (enumerableOnly) { symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default["default"](_context = ownKeys(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context2; _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } } return target; }
 var sequentialId = utils.createSequentialId('checkbox-input-');
 var defaultProps = {
   isChecked: false,
@@ -565,64 +591,68 @@ var defaultProps = {
 
 var hoverStyles = function hoverStyles(props) {
   if (!props.hasError && !props.readOnly && !props.disabled) {
-    return /*#__PURE__*/react.css("&:hover svg *[data-style='checkbox__border']{stroke:", designSystem.customProperties.borderColorForInputWhenFocused, ";}" + ("" ));
+    return /*#__PURE__*/react.css("&:hover svg *[data-style='checkbox__border']{stroke:", designSystem.customProperties.borderColorForInputWhenFocused, ";}" + ("" ), "" );
   }
 
-  return /*#__PURE__*/react.css("" );
+  return /*#__PURE__*/react.css("" , "" );
 };
 
-var LabelTextWrapper = _styled__default['default']("div", {
+var LabelTextWrapper = _styled__default["default"]("div", {
   target: "e6nn4mw1"
-} )("margin-left:", designSystem.customProperties.spacingS, ";outline:none;border-radius:", designSystem.customProperties.borderRadiusForTag, ";");
+} )("margin-left:", designSystem.customProperties.spacingS, ";outline:none;border-radius:", designSystem.customProperties.borderRadiusForTag, ";" + ("" ));
 
-var Label = _styled__default['default']("label", {
+var Label = _styled__default["default"]("label", {
   target: "e6nn4mw0"
 } )("display:flex;align-items:center;cursor:", function (props) {
   if (props.disabled) return 'not-allowed';
   if (props.readOnly) return 'default';
   return 'pointer';
-}, ";position:relative;", hoverStyles, " &:focus-within div{box-shadow:0 0 0 2px ", designSystem.customProperties.borderColorForInputWhenFocused, ";}");
+}, ";position:relative;", hoverStyles, " &:focus-within div{box-shadow:0 0 0 2px ", designSystem.customProperties.borderColorForInputWhenFocused, ";}" + ("" ));
 
 var CheckboxInput = function CheckboxInput(props) {
   // We generate an id in case no id is provided by the parent to attach the
   // label to the input component.
   var id = props.id || sequentialId();
   var theme = react.useTheme();
-  return react.jsx(Label, {
+  return jsxRuntime.jsxs(Label, {
     htmlFor: id,
     hasError: props.hasError,
     disabled: props.isDisabled,
-    readOnly: props.isReadOnly
-  }, react.jsx(Checkbox$1, _extends({
-    type: "checkbox",
-    id: id,
-    name: props.name,
-    value: props.value,
-    onChange: props.onChange,
-    isDisabled: props.isDisabled,
-    isReadOnly: props.isReadOnly,
-    isChecked: props.isChecked,
-    isIndeterminate: props.isIndeterminate
-  }, utils.filterDataAttributes(props), utils.filterAriaAttributes(props))), react.jsx("div", {
-    css: getCheckboxWrapperStyles(props, theme)
-  }, function () {
-    if (props.isIndeterminate) return react.jsx(IndeterminateIcon$1, {
-      size: "medium"
-    });
-    if (props.isChecked) return react.jsx(CheckedIcon$1, {
-      size: "medium"
-    });
-    return react.jsx(UncheckedIcon$1, {
-      size: "medium"
-    });
-  }()), props.children && react.jsx(LabelTextWrapper // To allow focusing the Label in readOnly mode, because the checkbox gets disabled and therefore unfocusable
-  , {
-    tabIndex: props.isReadOnly ? 0 : -1
-  }, react.jsx(Text__default['default'].Body, {
-    as: "span" // FIXME: add proper tones when we have disabled/primary in tones
-    ,
-    tone: props.isDisabled ? 'secondary' : undefined
-  }, props.children)));
+    readOnly: props.isReadOnly,
+    children: [jsxRuntime.jsx(Checkbox$1, _objectSpread(_objectSpread({
+      type: "checkbox",
+      id: id,
+      name: props.name,
+      value: props.value,
+      onChange: props.onChange,
+      isDisabled: props.isDisabled,
+      isReadOnly: props.isReadOnly,
+      isChecked: props.isChecked,
+      isIndeterminate: props.isIndeterminate
+    }, utils.filterDataAttributes(props)), utils.filterAriaAttributes(props))), jsxRuntime.jsx("div", {
+      css: getCheckboxWrapperStyles(props, theme),
+      children: function () {
+        if (props.isIndeterminate) return jsxRuntime.jsx(IndeterminateIcon$1, {
+          size: "medium"
+        });
+        if (props.isChecked) return jsxRuntime.jsx(CheckedIcon$1, {
+          size: "medium"
+        });
+        return jsxRuntime.jsx(UncheckedIcon$1, {
+          size: "medium"
+        });
+      }()
+    }), props.children && jsxRuntime.jsx(LabelTextWrapper // To allow focusing the Label in readOnly mode, because the checkbox gets disabled and therefore unfocusable
+    , {
+      tabIndex: props.isReadOnly ? 0 : -1,
+      children: jsxRuntime.jsx(Text__default["default"].Body, {
+        as: "span" // FIXME: add proper tones when we have disabled/primary in tones
+        ,
+        tone: props.isDisabled ? 'secondary' : undefined,
+        children: props.children
+      })
+    })]
+  });
 };
 
 CheckboxInput.propTypes = {};
@@ -630,8 +660,8 @@ CheckboxInput.displayName = 'CheckboxInput';
 CheckboxInput.defaultProps = defaultProps;
 var CheckboxInput$1 = CheckboxInput;
 
-// NOTE: This string will be replaced in the `prepare` script by the `scripts/version.js` file.
-var version = '12.2.2';
+// NOTE: This string will be replaced on build time with the package version.
+var version = "12.2.6";
 
-exports['default'] = CheckboxInput$1;
+exports["default"] = CheckboxInput$1;
 exports.version = version;