@elliemae/ds-controlled-form 1.57.1-rc.0 → 2.0.0-alpha.11

package/cjs/controlled-toggle/ControlledToggle.js

@@ -2,72 +2,62 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _extends = require('@babel/runtime/helpers/extends');
-var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('core-js/modules/web.dom-collections.iterator.js');
 var React = require('react');
 var uid = require('uid');
 var reactDesc = require('react-desc');
-var controlledToggle_propTypes = require('./propTypes.js');
-var controlledToggle_styles = require('./styles.js');
-var controlledToggle_defaultProps = require('./defaultProps.js');
-var controlledToggle_utils_addTooltipOnReadOnly = require('./utils/addTooltipOnReadOnly.js');
-require('styled-components');
-require('./utils/styleHelpers.js');
-require('@elliemae/ds-tooltip');
+var propTypes = require('./propTypes.js');
+var styles = require('./styles.js');
+var defaultProps = require('./defaultProps.js');
+var addTooltipOnReadOnly = require('./utils/addTooltipOnReadOnly.js');
+var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
-var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 
-var DSControlledToggle = function DSControlledToggle(_ref) {
-  var labelOn = _ref.labelOn,
-      labelOff = _ref.labelOff,
-      name = _ref.name,
-      value = _ref.value,
-      checked = _ref.checked,
-      onChange = _ref.onChange,
-      size = _ref.size,
-      readOnly = _ref.readOnly,
-      active = _ref.active,
-      disabled = _ref.disabled,
-      containerProps = _ref.containerProps,
-      id = _ref.id;
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-  var _useState = React.useState(false),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
-      isLongerTextRendering = _useState2[0],
-      setIsLongerTextRendering = _useState2[1];
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-  var _useState3 = React.useState(0),
-      _useState4 = _slicedToArray__default['default'](_useState3, 2),
-      width = _useState4[0],
-      setWidth = _useState4[1];
-
-  var labelTextRef = React.useRef(null);
-  var widthTextRef = React.useRef(null);
-  var longerText = React.useMemo(function () {
-    return labelOn.length > labelOff.length ? labelOn : labelOff;
-  }, [labelOff, labelOn]);
-  var instanceUID = React.useMemo(function () {
-    return uid.uid(5);
-  }, []);
-  React.useEffect(function () {
+const DSControlledToggle = ({
+  labelOn,
+  labelOff,
+  name,
+  value,
+  checked,
+  onChange,
+  size,
+  readOnly,
+  active,
+  disabled,
+  containerProps,
+  id
+}) => {
+  const [isLongerTextRendering, setIsLongerTextRendering] = React.useState(false);
+  const [width, setWidth] = React.useState(0);
+  const labelTextRef = React.useRef(null);
+  const widthTextRef = React.useRef(null);
+  const longerText = React.useMemo(() => labelOn.length > labelOff.length ? labelOn : labelOff, [labelOff, labelOn]);
+  const instanceUID = React.useMemo(() => uid.uid(5), []);
+  React.useEffect(() => {
     if (labelTextRef.current) {
       setIsLongerTextRendering(labelTextRef.current.innerText === longerText);
     }
   }, [labelTextRef, longerText, checked]);
-  React.useEffect(function () {
+  React.useEffect(() => {
     if (widthTextRef.current) {
       setWidth(widthTextRef.current.clientWidth);
     }
   }, [widthTextRef]);
-  var handleOnChange = React.useCallback(function () {
+  const handleOnChange = React.useCallback(() => {
     if (disabled || readOnly) return;
     onChange();
   }, [disabled, readOnly, onChange]);
-  var handleKeyDown = React.useCallback(function (e) {
+  const handleKeyDown = React.useCallback(e => {
     if (disabled || readOnly) {
       e.preventDefault();
     }
@@ -77,55 +67,57 @@ var DSControlledToggle = function DSControlledToggle(_ref) {
       onChange();
     }
   }, [disabled, onChange, readOnly]);
-  return controlledToggle_utils_addTooltipOnReadOnly.addTooltipOnReadOnly( /*#__PURE__*/React__default['default'].createElement(controlledToggle_styles.StyledContainer, _extends__default['default']({
+  return addTooltipOnReadOnly.addTooltipOnReadOnly( /*#__PURE__*/jsxRuntime.jsxs(styles.StyledContainer, _objectSpread(_objectSpread({
     size: size,
     "data-testid": "ds-controlled-toggle"
-  }, containerProps), /*#__PURE__*/React__default['default'].createElement(controlledToggle_styles.StyledInput, {
-    type: "checkbox",
-    name: name,
-    value: value,
-    checked: checked,
-    "data-testid": "ds-controlled-toggle-checkbox",
-    id: id || instanceUID,
-    "aria-disabled": disabled,
-    "aria-checked": checked,
-    tabIndex: 0,
-    onChange: handleOnChange,
-    onKeyDown: handleKeyDown
-  }), /*#__PURE__*/React__default['default'].createElement(controlledToggle_styles.StyledLabel, {
-    checked: checked,
-    size: size,
-    width: width
-  }, /*#__PURE__*/React__default['default'].createElement(controlledToggle_styles.StyledVisibleContent, {
-    checked: checked,
-    size: size,
-    readOnly: readOnly,
-    active: active,
-    disabled: disabled,
-    htmlFor: id ? undefined : instanceUID,
-    as: id ? 'p' : 'label'
-  }, /*#__PURE__*/React__default['default'].createElement(controlledToggle_styles.StyledCircle, {
-    checked: checked,
-    size: size,
-    readOnly: readOnly,
-    disabled: disabled
-  }), /*#__PURE__*/React__default['default'].createElement(controlledToggle_styles.StyledText, {
-    ref: labelTextRef,
-    isLongerTextRendering: isLongerTextRendering,
-    checked: checked,
-    size: size,
-    disabled: disabled
-  }, checked ? labelOn : labelOff))), /*#__PURE__*/React__default['default'].createElement(controlledToggle_styles.SetLabelWidth, {
-    size: size,
-    ref: widthTextRef
-  }, longerText)), readOnly);
+  }, containerProps), {}, {
+    children: [/*#__PURE__*/_jsx__default["default"](styles.StyledInput, {
+      type: "checkbox",
+      name: name,
+      value: value,
+      checked: checked,
+      "data-testid": "ds-controlled-toggle-checkbox",
+      id: id || instanceUID,
+      "aria-disabled": disabled,
+      "aria-checked": checked,
+      tabIndex: 0,
+      onChange: handleOnChange,
+      onKeyDown: handleKeyDown
+    }), /*#__PURE__*/_jsx__default["default"](styles.StyledLabel, {
+      checked: checked,
+      size: size,
+      width: width
+    }, void 0, /*#__PURE__*/_jsx__default["default"](styles.StyledVisibleContent, {
+      checked: checked,
+      size: size,
+      readOnly: readOnly,
+      active: active,
+      disabled: disabled,
+      htmlFor: id ? undefined : instanceUID,
+      as: id ? 'span' : 'label'
+    }, void 0, /*#__PURE__*/_jsx__default["default"](styles.StyledCircle, {
+      checked: checked,
+      size: size,
+      readOnly: readOnly,
+      disabled: disabled
+    }), /*#__PURE__*/jsxRuntime.jsx(styles.StyledText, {
+      ref: labelTextRef,
+      isLongerTextRendering: isLongerTextRendering,
+      checked: checked,
+      size: size,
+      disabled: disabled,
+      children: checked ? labelOn : labelOff
+    }))), /*#__PURE__*/jsxRuntime.jsx(styles.SetLabelWidth, {
+      size: size,
+      ref: widthTextRef,
+      children: longerText
+    })]
+  })), readOnly);
 };
 
-DSControlledToggle.defaultProps = controlledToggle_defaultProps.defaultProps;
-DSControlledToggle.propTypes = controlledToggle_propTypes.propTypes;
-var DSControlledToggleWithSchema = reactDesc.describe(DSControlledToggle);
-DSControlledToggleWithSchema.propTypes = controlledToggle_propTypes.propTypes;
+DSControlledToggle.defaultProps = defaultProps.defaultProps;
+const DSControlledToggleWithSchema = reactDesc.describe(DSControlledToggle);
+DSControlledToggleWithSchema.propTypes = propTypes.propTypes;
 
 exports.DSControlledToggle = DSControlledToggle;
 exports.DSControlledToggleWithSchema = DSControlledToggleWithSchema;
-//# sourceMappingURL=ControlledToggle.js.map

package/cjs/controlled-toggle/defaultProps.js

@@ -2,15 +2,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var defaultProps = {
+const defaultProps = {
   labelOn: 'ON',
   labelOff: 'OFF',
   name: '',
   value: '',
   checked: false,
-  onClick: function onClick() {
-    return null;
-  },
+  onClick: () => null,
   size: 'm',
   readonly: false,
   active: false,
@@ -18,4 +16,3 @@ var defaultProps = {
 };
 
 exports.defaultProps = defaultProps;
-//# sourceMappingURL=defaultProps.js.map

package/cjs/controlled-toggle/index.d.js

@@ -1,3 +1,2 @@
 'use strict';
 
-//# sourceMappingURL=index.d.js.map

package/cjs/controlled-toggle/index.js

@@ -2,22 +2,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var controlledToggle_ControlledToggle = require('./ControlledToggle.js');
-require('@babel/runtime/helpers/extends');
-require('@babel/runtime/helpers/slicedToArray');
-require('react');
-require('uid');
-require('react-desc');
-require('./propTypes.js');
-require('./styles.js');
-require('styled-components');
-require('./utils/styleHelpers.js');
-require('./defaultProps.js');
-require('./utils/addTooltipOnReadOnly.js');
-require('@elliemae/ds-tooltip');
+var ControlledToggle = require('./ControlledToggle.js');
 
 
 
-exports.DSControlledToggle = controlledToggle_ControlledToggle.DSControlledToggle;
-exports.DSControlledToggleWithSchema = controlledToggle_ControlledToggle.DSControlledToggleWithSchema;
-//# sourceMappingURL=index.js.map
+exports.DSControlledToggle = ControlledToggle.DSControlledToggle;
+exports.DSControlledToggleWithSchema = ControlledToggle.DSControlledToggleWithSchema;

package/cjs/controlled-toggle/propTypes.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var reactDesc = require('react-desc');
 
-var propTypes = {
+const propTypes = {
   labelOn: reactDesc.PropTypes.string.description('Label when toggle is checked'),
   labelOff: reactDesc.PropTypes.string.description('Label when toggle is unchecked'),
   value: reactDesc.PropTypes.string.description('Value attribute for toggle'),
@@ -20,4 +20,3 @@ var propTypes = {
 };
 
 exports.propTypes = propTypes;
-//# sourceMappingURL=propTypes.js.map

package/cjs/controlled-toggle/styles.js

@@ -3,119 +3,96 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var styled = require('styled-components');
-var controlledToggle_utils_styleHelpers = require('./utils/styleHelpers.js');
+var styleHelpers = require('./utils/styleHelpers.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
-var StyledContainer = /*#__PURE__*/styled__default['default'].div.withConfig({
+const StyledContainer = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-v733m4-0"
-})(["display:inline-flex;width:fit-content;justify-content:center;align-items:center;height:", ";border-radius:", ";outline:none;position:relative;border:2px solid transparent;&:hover,&:focus-within{border:2px solid ", ";&:after{content:'';height:calc(100% + 4px);width:calc(100% + 4px);border:1px solid ", ";border-radius:20px;position:absolute;}}"], function (_ref) {
-  var size = _ref.size;
-  return controlledToggle_utils_styleHelpers.containerHeight[size];
-}, function (_ref2) {
-  var size = _ref2.size;
-  return controlledToggle_utils_styleHelpers.borderRadius[size];
-}, function (_ref3) {
-  var theme = _ref3.theme;
-  return theme.colors.brand[300];
-}, function (_ref4) {
-  var theme = _ref4.theme;
-  return theme.colors.brand[600];
-});
-var StyledLabel = /*#__PURE__*/styled__default['default'].div.withConfig({
+})(["display:inline-flex;width:fit-content;justify-content:center;align-items:center;height:", ";border-radius:", ";outline:none;position:relative;border:2px solid transparent;&:hover,&:focus-within{border:2px solid ", ";&:after{content:'';height:calc(100% + 4px);width:calc(100% + 4px);border:1px solid ", ";border-radius:20px;position:absolute;}}"], ({
+  size
+}) => styleHelpers.containerHeight[size], ({
+  size
+}) => styleHelpers.borderRadius[size], ({
+  theme
+}) => theme.colors.brand[300], ({
+  theme
+}) => theme.colors.brand[600]);
+const StyledLabel = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-v733m4-1"
-})(["width:", ";height:", ";z-index:2;outline:none;border-radius:", ";"], function (_ref5) {
-  var width = _ref5.width,
-      size = _ref5.size;
-  return "calc(".concat(width, "px + ").concat(controlledToggle_utils_styleHelpers.margin[size], ")");
-}, function (_ref6) {
-  var size = _ref6.size;
-  return controlledToggle_utils_styleHelpers.labelHeight[size];
-}, function (_ref7) {
-  var size = _ref7.size;
-  return controlledToggle_utils_styleHelpers.labelHeight[size];
-});
-var StyledVisibleContent = /*#__PURE__*/styled__default['default'].label.withConfig({
+})(["width:", ";height:", ";z-index:2;outline:none;border-radius:", ";"], ({
+  width,
+  size
+}) => "calc(".concat(width, "px + ").concat(styleHelpers.margin[size], ")"), ({
+  size
+}) => styleHelpers.labelHeight[size], ({
+  size
+}) => styleHelpers.labelHeight[size]);
+const StyledVisibleContent = /*#__PURE__*/styled__default["default"].label.withConfig({
   componentId: "sc-v733m4-2"
-})(["display:flex;margin:0;padding:0;align-items:center;height:100%;flex-direction:", ";border-radius:", ";border:", ";transition:background-color 0.2s;background-color:", ";&:hover{cursor:", ";}"], function (_ref8) {
-  var checked = _ref8.checked;
-  return checked ? 'row-reverse' : 'row';
-}, function (_ref9) {
-  var size = _ref9.size;
-  return "calc(".concat(controlledToggle_utils_styleHelpers.labelHeight[size], " - 4px)");
-}, function (_ref10) {
-  var theme = _ref10.theme,
-      size = _ref10.size,
-      checked = _ref10.checked,
-      disabled = _ref10.disabled,
-      readOnly = _ref10.readOnly,
-      active = _ref10.active;
-  return size === 's' ? "1px solid ".concat(controlledToggle_utils_styleHelpers.handleBorderColor(checked, disabled, readOnly, active, theme)) : "\n    2px solid ".concat(controlledToggle_utils_styleHelpers.handleBorderColor(checked, disabled, readOnly, active, theme), "\n    ");
-}, function (_ref11) {
-  var theme = _ref11.theme,
-      checked = _ref11.checked,
-      disabled = _ref11.disabled,
-      readOnly = _ref11.readOnly,
-      active = _ref11.active;
-  return controlledToggle_utils_styleHelpers.handleBackgroundColor(checked, disabled, readOnly, active, theme);
-}, function (_ref12) {
-  var disabled = _ref12.disabled,
-      readOnly = _ref12.readOnly;
-  return controlledToggle_utils_styleHelpers.handleCursors(disabled, readOnly);
-});
-var StyledCircle = /*#__PURE__*/styled__default['default'].div.withConfig({
+})(["display:flex;margin:0;padding:0;align-items:center;height:100%;flex-direction:", ";border-radius:", ";border:", ";transition:background-color 0.2s;background-color:", ";&:hover{cursor:", ";}"], ({
+  checked
+}) => checked ? 'row-reverse' : 'row', ({
+  size
+}) => "calc(".concat(styleHelpers.labelHeight[size], " - 4px)"), ({
+  theme,
+  size,
+  checked,
+  disabled,
+  readOnly,
+  active
+}) => size === 's' ? "1px solid ".concat(styleHelpers.handleBorderColor(checked, disabled, readOnly, active, theme)) : "\n    2px solid ".concat(styleHelpers.handleBorderColor(checked, disabled, readOnly, active, theme), "\n    "), ({
+  theme,
+  checked,
+  disabled,
+  readOnly,
+  active
+}) => styleHelpers.handleBackgroundColor(checked, disabled, readOnly, active, theme), ({
+  disabled,
+  readOnly
+}) => styleHelpers.handleCursors(disabled, readOnly));
+const StyledCircle = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-v733m4-3"
-})(["height:", ";width:", ";border-radius:50%;background-color:", ";"], function (_ref13) {
-  var size = _ref13.size;
-  return controlledToggle_utils_styleHelpers.circleValues[size];
-}, function (_ref14) {
-  var size = _ref14.size;
-  return controlledToggle_utils_styleHelpers.circleValues[size];
-}, function (_ref15) {
-  var theme = _ref15.theme,
-      readOnly = _ref15.readOnly;
-  return readOnly ? theme.colors.neutral[100] : theme.colors.neutral['000'];
-});
-var StyledText = /*#__PURE__*/styled__default['default'].div.withConfig({
+})(["height:", ";width:", ";border-radius:50%;background-color:", ";"], ({
+  size
+}) => styleHelpers.circleValues[size], ({
+  size
+}) => styleHelpers.circleValues[size], ({
+  theme,
+  readOnly
+}) => readOnly ? theme.colors.neutral[100] : theme.colors.neutral['000']);
+const StyledText = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-v733m4-4"
-})(["display:flex;flex-grow:1;line-height:1;margin-bottom:-0.12rem;align-items:center;justify-content:", ";font-size:", ";font-weight:", ";color:", ";", " ", ""], function (_ref16) {
-  var isLongerTextRendering = _ref16.isLongerTextRendering;
-  return isLongerTextRendering ? 'flex-start' : 'center';
-}, function (_ref17) {
-  var theme = _ref17.theme,
-      size = _ref17.size;
-  return controlledToggle_utils_styleHelpers.handleFontSize(size, theme);
-}, function (_ref18) {
-  var theme = _ref18.theme;
-  return theme.fontWeights.semibold;
-}, function (_ref19) {
-  var theme = _ref19.theme,
-      disabled = _ref19.disabled;
-  return disabled ? '#5c6574' : theme.colors.neutral['000'];
-}, function (_ref20) {
-  var isLongerTextRendering = _ref20.isLongerTextRendering,
-      checked = _ref20.checked;
-  return isLongerTextRendering && checked ? "margin-left: 6px;" : undefined;
-}, function (_ref21) {
-  var isLongerTextRendering = _ref21.isLongerTextRendering,
-      checked = _ref21.checked;
-  return isLongerTextRendering && !checked ? "margin-left: 4px;" : undefined;
-});
-var StyledInput = /*#__PURE__*/styled__default['default'].input.withConfig({
+})(["display:flex;flex-grow:1;line-height:1;margin-bottom:-0.12rem;align-items:center;justify-content:", ";font-size:", ";font-weight:", ";color:", ";", " ", ""], ({
+  isLongerTextRendering
+}) => isLongerTextRendering ? 'flex-start' : 'center', ({
+  theme,
+  size
+}) => styleHelpers.handleFontSize(size, theme), ({
+  theme
+}) => theme.fontWeights.semibold, ({
+  theme,
+  disabled
+}) => disabled ? '#5c6574' : theme.colors.neutral['000'], ({
+  isLongerTextRendering,
+  checked
+}) => isLongerTextRendering && checked ? "margin-left: 6px;" : undefined, ({
+  isLongerTextRendering,
+  checked
+}) => isLongerTextRendering && !checked ? "margin-left: 4px;" : undefined);
+const StyledInput = /*#__PURE__*/styled__default["default"].input.withConfig({
   componentId: "sc-v733m4-5"
 })(["position:absolute;opacity:0;z-index:20;height:100%;width:100%;cursor:pointer;"]);
-var SetLabelWidth = /*#__PURE__*/styled__default['default'].div.withConfig({
+const SetLabelWidth = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-v733m4-6"
-})(["font-size:", ";font-weight:", ";width:auto;position:absolute;white-space:nowrap;visibility:hidden;"], function (_ref22) {
-  var theme = _ref22.theme,
-      size = _ref22.size;
-  return controlledToggle_utils_styleHelpers.handleFontSize(size, theme);
-}, function (_ref23) {
-  var theme = _ref23.theme;
-  return theme.fontWeights.semibold;
-});
+})(["font-size:", ";font-weight:", ";width:auto;position:absolute;white-space:nowrap;visibility:hidden;"], ({
+  theme,
+  size
+}) => styleHelpers.handleFontSize(size, theme), ({
+  theme
+}) => theme.fontWeights.semibold);
 
 exports.SetLabelWidth = SetLabelWidth;
 exports.StyledCircle = StyledCircle;
@@ -124,4 +101,3 @@ exports.StyledInput = StyledInput;
 exports.StyledLabel = StyledLabel;
 exports.StyledText = StyledText;
 exports.StyledVisibleContent = StyledVisibleContent;
-//# sourceMappingURL=styles.js.map

package/cjs/controlled-toggle/utils/addTooltipOnReadOnly.js

@@ -2,15 +2,16 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var React = require('react');
-var dsTooltip = require('@elliemae/ds-tooltip');
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('react');
+var Tooltip = require('@elliemae/ds-basic/Tooltip');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 
-var addTooltipOnReadOnly = function addTooltipOnReadOnly(Component, readOnly) {
-  if (readOnly) return /*#__PURE__*/React__default['default'].createElement(dsTooltip.DSTooltipV2, {
+const addTooltipOnReadOnly = (Component, readOnly) => {
+  if (readOnly) return /*#__PURE__*/_jsx__default["default"](Tooltip.DSTooltipV2, {
     title: "Read Only",
     offset: [0, 9],
     triggerComponent: Component
@@ -19,4 +20,3 @@ var addTooltipOnReadOnly = function addTooltipOnReadOnly(Component, readOnly) {
 };
 
 exports.addTooltipOnReadOnly = addTooltipOnReadOnly;
-//# sourceMappingURL=addTooltipOnReadOnly.js.map

package/cjs/controlled-toggle/utils/styleHelpers.js

@@ -2,34 +2,34 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var circleValues = {
+const circleValues = {
   s: '14px',
   m: '20px',
   l: '28px'
 };
-var margin = {
+const margin = {
   s: '26px',
   m: '34px',
   l: '42px'
 };
-var containerHeight = {
+const containerHeight = {
   s: '20px',
   m: '28px',
   l: '36px'
 };
-var labelHeight = {
+const labelHeight = {
   s: '16px',
   m: '24px',
   l: '32px'
 };
-var borderRadius = {
+const borderRadius = {
   s: '16px',
   m: '20px',
   l: '22px'
 };
-var handleFontSize = function handleFontSize(size, _ref) {
-  var fontSizes = _ref.fontSizes;
-
+const handleFontSize = (size, {
+  fontSizes
+}) => {
   switch (size) {
     case 's':
       return fontSizes.microText[200];
@@ -44,9 +44,9 @@ var handleFontSize = function handleFontSize(size, _ref) {
       return '15px';
   }
 };
-var handleBackgroundColor = function handleBackgroundColor(checked, disabled, readOnly, active, _ref2) {
-  var colors = _ref2.colors;
-
+const handleBackgroundColor = (checked, disabled, readOnly, active, {
+  colors
+}) => {
   if (disabled) {
     return colors.neutral[100];
   } else if (readOnly) {
@@ -61,9 +61,9 @@ var handleBackgroundColor = function handleBackgroundColor(checked, disabled, re
     return colors.neutral[600];
   }
 };
-var handleBorderColor = function handleBorderColor(checked, disabled, readOnly, active, _ref3) {
-  var colors = _ref3.colors;
-
+const handleBorderColor = (checked, disabled, readOnly, active, {
+  colors
+}) => {
   if (disabled) {
     return colors.neutral[100];
   } else if (readOnly) {
@@ -78,7 +78,7 @@ var handleBorderColor = function handleBorderColor(checked, disabled, readOnly,
     return colors.neutral[700];
   }
 };
-var handleCursors = function handleCursors(disabled, readOnly) {
+const handleCursors = (disabled, readOnly) => {
   if (disabled) {
     return 'not-allowed';
   } else if (readOnly) {
@@ -95,4 +95,3 @@ exports.handleCursors = handleCursors;
 exports.handleFontSize = handleFontSize;
 exports.labelHeight = labelHeight;
 exports.margin = margin;
-//# sourceMappingURL=styleHelpers.js.map