@twilio-paste/checkbox - npm Package Compare versions

Comparing version 7.0.0 to 7.0.1

CHANGELOG.md

 # Change Log
 
+## 7.0.1
+
+### Patch Changes
+
+- [`c867e3f48`](https://github.com/twilio-labs/paste/commit/c867e3f48d739409d1f54fa18c4d2bee1d9242cf) [#2237](https://github.com/twilio-labs/paste/pull/2237) Thanks [@SiTaggart](https://github.com/SiTaggart)! - Updated a build dependency (esbuild) which changes the output of our builds slightly, without materially changing anything about the code.
+
+* [`563a76ba3`](https://github.com/twilio-labs/paste/commit/563a76ba31d60ee43c1e57907c83c502dc1ba5a7) [#2249](https://github.com/twilio-labs/paste/pull/2249) Thanks [@nkrantz](https://github.com/nkrantz)! - [checkbox]
+
+  - Update the check icon to inherit color from `BaseRadioCheckbox`
+  - Update selectAll background color to default to `colorBackground`, and use `colorBackgroundPrimaryWeakest` when checked and not disabled or indeterminate and not disabled
+  - Update default color to `colorTextWeakest`
+  - Update hover text color to `colorTextWeakest` and border color to `colorBorderPrimaryStronger`
+  - Update focus text color to `colorTextWeakest` and border color to `colorBorderPrimaryStronger`
+  - Update active text color to `colorTextWeakest`
+  - Update checked text color to `colorTextInverse`
+  - Update invalid and hover border color to `colorBorderErrorStronger`
+  - Update checked and hover text color to `colorTextWeakest` and background color to `colorBackgroundPrimaryStronger`
+  - Update checked and focus text color to `colorTextWeakest` and background color to `colorBackgroundPrimaryStronger`
+  - Update checked and disabled text color to `colorTextWeakest`
+  - Update checked and invalid text color to `colorTextInverse`
+  - Update checked and invalid and hover background color to `colorBackgroundErrorStronger` and border color to `colorBorderErrorStronger`
+
 ## 7.0.0
@@ -4,0 +26,0 @@

dist/index.debug.es.js

@@ -0,6 +1,23 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __assign = Object.assign;
-var __rest = (source, exclude) => {
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
   var target = {};
@@ -17,35 +34,98 @@ for (var prop in source)
 };
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module, copyDefault, desc) => {
+  if (module && typeof module === "object" || typeof module === "function") {
+    for (let key of __getOwnPropNames(module))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module[key], enumerable: !(desc = __getOwnPropDesc(module, key)) || desc.enumerable });
+  }
+  return target;
+};
 
-// src/Checkbox.tsx
-import {
-  createElement,
-  forwardRef,
-  useContext,
-  useState
-} from "react";
-import {
-  bool,
-  func,
-  node,
-  oneOfType,
-  string
-} from "prop-types";
-import {useUID} from "@twilio-paste/uid-library";
-import {Box, safelySpreadBoxProps} from "@twilio-paste/box";
-import {CheckboxCheckIcon} from "@twilio-paste/icons/esm/CheckboxCheckIcon";
-import {MinusIcon} from "@twilio-paste/icons/esm/MinusIcon";
-import {
-  BaseRadioCheckboxControl,
-  BaseRadioCheckboxLabel,
-  BaseRadioCheckboxLabelText,
-  BaseRadioCheckboxHelpText
-} from "@twilio-paste/base-radio-checkbox";
-import {MediaObject, MediaFigure, MediaBody} from "@twilio-paste/media-object";
-import {RequiredDot} from "@twilio-paste/label";
+// esm-externals:react
+var react_exports = {};
+__export(react_exports, {
+  default: () => default2
+});
+__reExport(react_exports, react_star);
+import * as default2 from "react";
+import * as react_star from "react";
 
+// esm-externals:prop-types
+var prop_types_exports = {};
+__export(prop_types_exports, {
+  default: () => default3
+});
+__reExport(prop_types_exports, prop_types_star);
+import * as default3 from "prop-types";
+import * as prop_types_star from "prop-types";
+
+// esm-externals:@twilio-paste/uid-library
+var uid_library_exports = {};
+__export(uid_library_exports, {
+  default: () => default4
+});
+__reExport(uid_library_exports, uid_library_star);
+import * as default4 from "@twilio-paste/uid-library";
+import * as uid_library_star from "@twilio-paste/uid-library";
+
+// esm-externals:@twilio-paste/box
+var box_exports = {};
+__export(box_exports, {
+  default: () => default5
+});
+__reExport(box_exports, box_star);
+import * as default5 from "@twilio-paste/box";
+import * as box_star from "@twilio-paste/box";
+
+// esm-externals:@twilio-paste/icons/esm/CheckboxCheckIcon
+var CheckboxCheckIcon_exports = {};
+__export(CheckboxCheckIcon_exports, {
+  default: () => default6
+});
+__reExport(CheckboxCheckIcon_exports, CheckboxCheckIcon_star);
+import * as default6 from "@twilio-paste/icons/esm/CheckboxCheckIcon";
+import * as CheckboxCheckIcon_star from "@twilio-paste/icons/esm/CheckboxCheckIcon";
+
+// esm-externals:@twilio-paste/icons/esm/MinusIcon
+var MinusIcon_exports = {};
+__export(MinusIcon_exports, {
+  default: () => default7
+});
+__reExport(MinusIcon_exports, MinusIcon_star);
+import * as default7 from "@twilio-paste/icons/esm/MinusIcon";
+import * as MinusIcon_star from "@twilio-paste/icons/esm/MinusIcon";
+
+// esm-externals:@twilio-paste/base-radio-checkbox
+var base_radio_checkbox_exports = {};
+__export(base_radio_checkbox_exports, {
+  default: () => default8
+});
+__reExport(base_radio_checkbox_exports, base_radio_checkbox_star);
+import * as default8 from "@twilio-paste/base-radio-checkbox";
+import * as base_radio_checkbox_star from "@twilio-paste/base-radio-checkbox";
+
+// esm-externals:@twilio-paste/media-object
+var media_object_exports = {};
+__export(media_object_exports, {
+  default: () => default9
+});
+__reExport(media_object_exports, media_object_star);
+import * as default9 from "@twilio-paste/media-object";
+import * as media_object_star from "@twilio-paste/media-object";
+
+// esm-externals:@twilio-paste/label
+var label_exports = {};
+__export(label_exports, {
+  default: () => default10
+});
+__reExport(label_exports, label_star);
+import * as default10 from "@twilio-paste/label";
+import * as label_star from "@twilio-paste/label";
+
 // src/CheckboxContext.tsx
-import {
-  createContext
-} from "react";
-var CheckboxContext = createContext({
+var CheckboxContext = react_exports.createContext({
   disabled: false,
@@ -59,3 +139,3 @@ name: void 0,
 // src/Checkbox.tsx
-var HiddenCheckbox = forwardRef((props, ref) => /* @__PURE__ */ createElement(Box, __assign(__assign({}, props), {
+var HiddenCheckbox = react_exports.forwardRef((props, ref) => /* @__PURE__ */ react_exports.createElement(box_exports.Box, __spreadProps(__spreadValues({}, props), {
   ref,
@@ -75,22 +155,21 @@ as: "input",
 HiddenCheckbox.displayName = "HiddenCheckbox";
-var CheckboxIcon = ({checked, element, disabled, indeterminate}) => {
-  const color = disabled && (checked || indeterminate) ? "colorTextIcon" : "colorTextWeakest";
+var CheckboxIcon = ({ checked, element, indeterminate }) => {
   if (indeterminate) {
-    return /* @__PURE__ */ createElement(MinusIcon, {
+    return /* @__PURE__ */ react_exports.createElement(MinusIcon_exports.MinusIcon, {
       element,
       decorative: true,
-      color,
+      color: "inherit",
       size: "sizeIcon10"
     });
   }
-  return /* @__PURE__ */ createElement(CheckboxCheckIcon, {
+  return /* @__PURE__ */ react_exports.createElement(CheckboxCheckIcon_exports.CheckboxCheckIcon, {
     element,
     display: !checked ? "none" : "block",
     decorative: true,
-    color,
+    color: "inherit",
     size: "sizeIcon10"
   });
 };
-var Checkbox = forwardRef((_a, ref) => {
-  var {
+var Checkbox = react_exports.forwardRef((_a, ref) => {
+  var _b = _a, {
     checked: checkedProp,
@@ -105,3 +184,3 @@ element = "CHECKBOX",
     required
-  } = _a, props = __rest(_a, [
+  } = _b, props = __objRest(_b, [
     "checked",
@@ -117,8 +196,8 @@ "element",
   ]);
-  const helpTextId = useUID();
-  const checkboxGroupContext = useContext(CheckboxContext);
+  const helpTextId = (0, uid_library_exports.useUID)();
+  const checkboxGroupContext = react_exports.useContext(CheckboxContext);
   const disabled = props.disabled != null ? props.disabled : checkboxGroupContext.disabled;
   const name = props.name != null ? props.name : checkboxGroupContext.name;
   const hasError = props.hasError != null ? props.hasError : checkboxGroupContext.hasError;
-  const [checkedState, setCheckedState] = useState(!!props.defaultChecked);
+  const [checkedState, setCheckedState] = react_exports.useState(!!props.defaultChecked);
   const isControlled = checkedProp !== void 0;
@@ -139,6 +218,5 @@ const mergedChecked = isControlled ? checkedProp : checkedState;
     paddingLeft = "space20";
-    if (mergedChecked || indeterminate) {
+    checkboxBackground = "colorBackground";
+    if ((mergedChecked || indeterminate) && !disabled) {
       checkboxBackground = "colorBackgroundPrimaryWeakest";
-    } else if (!disabled) {
-      checkboxBackground = "colorBackground";
     }
@@ -149,3 +227,3 @@ }
   }
-  return /* @__PURE__ */ createElement(Box, {
+  return /* @__PURE__ */ react_exports.createElement(box_exports.Box, {
     element,
@@ -162,3 +240,3 @@ backgroundColor: checkboxBackground,
     paddingTop: isSelectAll ? "space20" : null
-  }, /* @__PURE__ */ createElement(HiddenCheckbox, __assign(__assign({}, safelySpreadBoxProps(props)), {
+  }, /* @__PURE__ */ react_exports.createElement(HiddenCheckbox, __spreadProps(__spreadValues({}, (0, box_exports.safelySpreadBoxProps)(props)), {
     checked: checkedProp,
@@ -174,6 +252,6 @@ disabled,
     ref
-  })), /* @__PURE__ */ createElement(BaseRadioCheckboxLabel, {
+  })), /* @__PURE__ */ react_exports.createElement(base_radio_checkbox_exports.BaseRadioCheckboxLabel, {
     disabled,
     htmlFor: id
-  }, /* @__PURE__ */ createElement(BaseRadioCheckboxControl, {
+  }, /* @__PURE__ */ react_exports.createElement(base_radio_checkbox_exports.BaseRadioCheckboxControl, {
     alignItems: "center",
@@ -185,3 +263,3 @@ borderRadius: "borderRadius10",
     type: "checkbox"
-  }, /* @__PURE__ */ createElement(CheckboxIcon, {
+  }, /* @__PURE__ */ react_exports.createElement(CheckboxIcon, {
     element: `${element}_ICON`,
@@ -191,10 +269,10 @@ checked: mergedChecked,
     indeterminate
-  })), /* @__PURE__ */ createElement(BaseRadioCheckboxLabelText, {
+  })), /* @__PURE__ */ react_exports.createElement(base_radio_checkbox_exports.BaseRadioCheckboxLabelText, {
     element: `${element}_LABEL_TEXT`,
     fontWeight: isSelectAll ? null : "fontWeightMedium"
-  }, /* @__PURE__ */ createElement(MediaObject, {
+  }, /* @__PURE__ */ react_exports.createElement(media_object_exports.MediaObject, {
     verticalAlign: "top"
-  }, required && /* @__PURE__ */ createElement(MediaFigure, {
+  }, required && /* @__PURE__ */ react_exports.createElement(media_object_exports.MediaFigure, {
     spacing: "space20"
-  }, /* @__PURE__ */ createElement(RequiredDot, null)), /* @__PURE__ */ createElement(MediaBody, null, children)))), helpText && /* @__PURE__ */ createElement(BaseRadioCheckboxHelpText, {
+  }, /* @__PURE__ */ react_exports.createElement(label_exports.RequiredDot, null)), /* @__PURE__ */ react_exports.createElement(media_object_exports.MediaBody, null, children)))), helpText && /* @__PURE__ */ react_exports.createElement(base_radio_checkbox_exports.BaseRadioCheckboxHelpText, {
     element: `${element}_HELP_TEXT_WRAPPER`,
@@ -206,35 +284,28 @@ helpTextId
 Checkbox.propTypes = {
-  children: node.isRequired,
-  disabled: bool,
-  name: string,
-  onChange: func,
-  hasError: bool,
-  helpText: oneOfType([string, node]),
-  id: string,
-  indeterminate: bool,
-  isSelectAll: bool,
-  isSelectAllChild: bool,
-  element: string,
-  defaultChecked: bool
+  children: prop_types_exports.node.isRequired,
+  disabled: prop_types_exports.bool,
+  name: prop_types_exports.string,
+  onChange: prop_types_exports.func,
+  hasError: prop_types_exports.bool,
+  helpText: prop_types_exports.oneOfType([prop_types_exports.string, prop_types_exports.node]),
+  id: prop_types_exports.string,
+  indeterminate: prop_types_exports.bool,
+  isSelectAll: prop_types_exports.bool,
+  isSelectAllChild: prop_types_exports.bool,
+  element: prop_types_exports.string,
+  defaultChecked: prop_types_exports.bool
 };
 
+// esm-externals:@twilio-paste/inline-control-group
+var inline_control_group_exports = {};
+__export(inline_control_group_exports, {
+  default: () => default11
+});
+__reExport(inline_control_group_exports, inline_control_group_star);
+import * as default11 from "@twilio-paste/inline-control-group";
+import * as inline_control_group_star from "@twilio-paste/inline-control-group";
+
 // src/CheckboxGroup.tsx
-import {
-  Children,
-  cloneElement,
-  createElement as createElement2,
-  forwardRef as forwardRef2,
-  isValidElement,
-  useCallback,
-  useMemo
-} from "react";
-import {
-  bool as bool2,
-  func as func2,
-  oneOf,
-  string as string2
-} from "prop-types";
-import {InlineControlGroup} from "@twilio-paste/inline-control-group";
-var CheckboxGroup = forwardRef2((_a, ref) => {
-  var {
+var CheckboxGroup = react_exports.forwardRef((_a, ref) => {
+  var _b = _a, {
     children,
@@ -248,3 +319,3 @@ element = "CHECKBOX_GROUP",
     orientation = "vertical"
-  } = _a, props = __rest(_a, [
+  } = _b, props = __objRest(_b, [
     "children",
@@ -259,3 +330,3 @@ "element",
   ]);
-  const onChangeHandler = useCallback((event) => {
+  const onChangeHandler = react_exports.useCallback((event) => {
     if (onChange != null) {
@@ -265,3 +336,3 @@ onChange(event.target.checked);
   }, [onChange]);
-  const contextValue = useMemo(() => {
+  const contextValue = react_exports.useMemo(() => {
     return {
@@ -274,5 +345,5 @@ disabled,
   }, [disabled, name, onChangeHandler]);
-  return /* @__PURE__ */ createElement2(CheckboxContext.Provider, {
+  return /* @__PURE__ */ react_exports.createElement(CheckboxContext.Provider, {
     value: contextValue
-  }, /* @__PURE__ */ createElement2(InlineControlGroup, __assign(__assign({}, props), {
+  }, /* @__PURE__ */ react_exports.createElement(inline_control_group_exports.InlineControlGroup, __spreadProps(__spreadValues({}, props), {
     element,
@@ -284,4 +355,4 @@ disabled,
     ref
-  }), Children.map(children, (child, index) => {
-    return isValidElement(child) ? cloneElement(child, {
+  }), react_exports.Children.map(children, (child, index) => {
+    return react_exports.isValidElement(child) ? react_exports.cloneElement(child, {
       isSelectAll: isSelectAll && index === 0,
@@ -295,29 +366,26 @@ isSelectAllChild: isSelectAll && orientation === "vertical" && index !== 0
   CheckboxGroup.propTypes = {
-    isSelectAll: bool2,
-    name: string2.isRequired,
-    element: string2,
-    onChange: func2,
-    disabled: bool2,
-    errorText: string2,
-    helpText: string2,
-    orientation: oneOf(["vertical", "horizontal"])
+    isSelectAll: prop_types_exports.bool,
+    name: prop_types_exports.string.isRequired,
+    element: prop_types_exports.string,
+    onChange: prop_types_exports.func,
+    disabled: prop_types_exports.bool,
+    errorText: prop_types_exports.string,
+    helpText: prop_types_exports.string,
+    orientation: prop_types_exports.oneOf(["vertical", "horizontal"])
   };
 }
 
+// esm-externals:@twilio-paste/help-text
+var help_text_exports = {};
+__export(help_text_exports, {
+  default: () => default12
+});
+__reExport(help_text_exports, help_text_star);
+import * as default12 from "@twilio-paste/help-text";
+import * as help_text_star from "@twilio-paste/help-text";
+
 // src/CheckboxDisclaimer.tsx
-import {
-  Fragment,
-  createElement as createElement3,
-  forwardRef as forwardRef3
-} from "react";
-import {
-  node as node2,
-  oneOfType as oneOfType2,
-  string as string3
-} from "prop-types";
-import {Box as Box2} from "@twilio-paste/box";
-import {HelpText} from "@twilio-paste/help-text";
-var CheckboxDisclaimer = forwardRef3((_a, ref) => {
-  var {children, element = "CHECKBOX_DISCLAIMER", errorText} = _a, props = __rest(_a, ["children", "element", "errorText"]);
-  return /* @__PURE__ */ createElement3(Fragment, null, /* @__PURE__ */ createElement3(Box2, {
+var CheckboxDisclaimer = react_exports.forwardRef((_a, ref) => {
+  var _b = _a, { children, element = "CHECKBOX_DISCLAIMER", errorText } = _b, props = __objRest(_b, ["children", "element", "errorText"]);
+  return /* @__PURE__ */ react_exports.createElement(react_exports.Fragment, null, /* @__PURE__ */ react_exports.createElement(box_exports.Box, {
     element,
@@ -327,10 +395,10 @@ backgroundColor: "colorBackground",
     padding: "space50"
-  }, /* @__PURE__ */ createElement3(Checkbox, __assign(__assign({}, props), {
+  }, /* @__PURE__ */ react_exports.createElement(Checkbox, __spreadProps(__spreadValues({}, props), {
     hasError: errorText != null,
     ref
-  }), children)), errorText && /* @__PURE__ */ createElement3(Box2, {
+  }), children)), errorText && /* @__PURE__ */ react_exports.createElement(box_exports.Box, {
     marginTop: "space30",
     element: `${element}_ERROR_TEXT_WRAPPER`,
     marginLeft: "space50"
-  }, /* @__PURE__ */ createElement3(HelpText, {
+  }, /* @__PURE__ */ react_exports.createElement(help_text_exports.HelpText, {
     variant: "error"
@@ -341,5 +409,5 @@ }, errorText)));
 CheckboxDisclaimer.propTypes = {
-  children: node2.isRequired,
-  errorText: oneOfType2([string3, node2]),
-  element: string3
+  children: prop_types_exports.node.isRequired,
+  errorText: prop_types_exports.oneOfType([prop_types_exports.string, prop_types_exports.node]),
+  element: prop_types_exports.string
 };
@@ -346,0 +414,0 @@ export {

dist/index.debug.js

 var __create = Object.create;
 var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __assign = Object.assign;
-var __markAsModule = (target) => __defProp(target, "__esModule", {value: true});
-var __rest = (source, exclude) => {
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __objRest = (source, exclude) => {
   var target = {};
@@ -24,23 +38,25 @@ for (var prop in source)
 var __export = (target, all) => {
-  __markAsModule(target);
   for (var name in all)
-    __defProp(target, name, {get: all[name], enumerable: true});
+    __defProp(target, name, { get: all[name], enumerable: true });
 };
-var __exportStar = (target, module2, desc) => {
-  __markAsModule(target);
+var __reExport = (target, module2, copyDefault, desc) => {
   if (module2 && typeof module2 === "object" || typeof module2 === "function") {
     for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && key !== "default")
-        __defProp(target, key, {get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable});
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
   }
   return target;
 };
-var __toModule = (module2) => {
-  if (module2 && module2.__esModule)
-    return module2;
-  return __exportStar(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", {value: module2, enumerable: true}), module2);
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
 };
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
 
 // src/index.tsx
-__export(exports, {
+var src_exports = {};
+__export(src_exports, {
   Checkbox: () => Checkbox,
@@ -52,14 +68,14 @@ CheckboxDisclaimer: () => CheckboxDisclaimer,
 // src/Checkbox.tsx
-var React2 = __toModule(require("react"));
-var PropTypes = __toModule(require("prop-types"));
-var import_uid_library = __toModule(require("@twilio-paste/uid-library"));
-var import_box = __toModule(require("@twilio-paste/box"));
-var import_CheckboxCheckIcon = __toModule(require("@twilio-paste/icons/cjs/CheckboxCheckIcon"));
-var import_MinusIcon = __toModule(require("@twilio-paste/icons/cjs/MinusIcon"));
-var import_base_radio_checkbox = __toModule(require("@twilio-paste/base-radio-checkbox"));
-var import_media_object = __toModule(require("@twilio-paste/media-object"));
-var import_label = __toModule(require("@twilio-paste/label"));
+var React2 = __toESM(require("react"));
+var PropTypes = __toESM(require("prop-types"));
+var import_uid_library = require("@twilio-paste/uid-library");
+var import_box = require("@twilio-paste/box");
+var import_CheckboxCheckIcon = require("@twilio-paste/icons/cjs/CheckboxCheckIcon");
+var import_MinusIcon = require("@twilio-paste/icons/cjs/MinusIcon");
+var import_base_radio_checkbox = require("@twilio-paste/base-radio-checkbox");
+var import_media_object = require("@twilio-paste/media-object");
+var import_label = require("@twilio-paste/label");
 
 // src/CheckboxContext.tsx
-var React = __toModule(require("react"));
+var React = __toESM(require("react"));
 var CheckboxContext = React.createContext({
@@ -74,3 +90,3 @@ disabled: false,
 // src/Checkbox.tsx
-var HiddenCheckbox = React2.forwardRef((props, ref) => /* @__PURE__ */ React2.createElement(import_box.Box, __assign(__assign({}, props), {
+var HiddenCheckbox = React2.forwardRef((props, ref) => /* @__PURE__ */ React2.createElement(import_box.Box, __spreadProps(__spreadValues({}, props), {
   ref,
@@ -90,4 +106,3 @@ as: "input",
 HiddenCheckbox.displayName = "HiddenCheckbox";
-var CheckboxIcon = ({checked, element, disabled, indeterminate}) => {
-  const color = disabled && (checked || indeterminate) ? "colorTextIcon" : "colorTextWeakest";
+var CheckboxIcon = ({ checked, element, indeterminate }) => {
   if (indeterminate) {
@@ -97,3 +112,3 @@ return /* @__PURE__ */ React2.createElement(import_MinusIcon.MinusIcon, {
       decorative: true,
-      color,
+      color: "inherit",
       size: "sizeIcon10"
@@ -106,3 +121,3 @@ });
     decorative: true,
-    color,
+    color: "inherit",
     size: "sizeIcon10"
@@ -112,3 +127,3 @@ });
 var Checkbox = React2.forwardRef((_a, ref) => {
-  var {
+  var _b = _a, {
     checked: checkedProp,
@@ -123,3 +138,3 @@ element = "CHECKBOX",
     required
-  } = _a, props = __rest(_a, [
+  } = _b, props = __objRest(_b, [
     "checked",
@@ -135,3 +150,3 @@ "element",
   ]);
-  const helpTextId = import_uid_library.useUID();
+  const helpTextId = (0, import_uid_library.useUID)();
   const checkboxGroupContext = React2.useContext(CheckboxContext);
@@ -157,6 +172,5 @@ const disabled = props.disabled != null ? props.disabled : checkboxGroupContext.disabled;
     paddingLeft = "space20";
-    if (mergedChecked || indeterminate) {
+    checkboxBackground = "colorBackground";
+    if ((mergedChecked || indeterminate) && !disabled) {
       checkboxBackground = "colorBackgroundPrimaryWeakest";
-    } else if (!disabled) {
-      checkboxBackground = "colorBackground";
     }
@@ -179,3 +193,3 @@ }
     paddingTop: isSelectAll ? "space20" : null
-  }, /* @__PURE__ */ React2.createElement(HiddenCheckbox, __assign(__assign({}, import_box.safelySpreadBoxProps(props)), {
+  }, /* @__PURE__ */ React2.createElement(HiddenCheckbox, __spreadProps(__spreadValues({}, (0, import_box.safelySpreadBoxProps)(props)), {
     checked: checkedProp,
@@ -235,7 +249,7 @@ disabled,
 // src/CheckboxGroup.tsx
-var React3 = __toModule(require("react"));
-var PropTypes2 = __toModule(require("prop-types"));
-var import_inline_control_group = __toModule(require("@twilio-paste/inline-control-group"));
+var React3 = __toESM(require("react"));
+var PropTypes2 = __toESM(require("prop-types"));
+var import_inline_control_group = require("@twilio-paste/inline-control-group");
 var CheckboxGroup = React3.forwardRef((_a, ref) => {
-  var {
+  var _b = _a, {
     children,
@@ -249,3 +263,3 @@ element = "CHECKBOX_GROUP",
     orientation = "vertical"
-  } = _a, props = __rest(_a, [
+  } = _b, props = __objRest(_b, [
     "children",
@@ -275,3 +289,3 @@ "element",
     value: contextValue
-  }, /* @__PURE__ */ React3.createElement(import_inline_control_group.InlineControlGroup, __assign(__assign({}, props), {
+  }, /* @__PURE__ */ React3.createElement(import_inline_control_group.InlineControlGroup, __spreadProps(__spreadValues({}, props), {
     element,
@@ -305,8 +319,8 @@ disabled,
 // src/CheckboxDisclaimer.tsx
-var React4 = __toModule(require("react"));
-var PropTypes3 = __toModule(require("prop-types"));
-var import_box2 = __toModule(require("@twilio-paste/box"));
-var import_help_text = __toModule(require("@twilio-paste/help-text"));
+var React4 = __toESM(require("react"));
+var PropTypes3 = __toESM(require("prop-types"));
+var import_box2 = require("@twilio-paste/box");
+var import_help_text = require("@twilio-paste/help-text");
 var CheckboxDisclaimer = React4.forwardRef((_a, ref) => {
-  var {children, element = "CHECKBOX_DISCLAIMER", errorText} = _a, props = __rest(_a, ["children", "element", "errorText"]);
+  var _b = _a, { children, element = "CHECKBOX_DISCLAIMER", errorText } = _b, props = __objRest(_b, ["children", "element", "errorText"]);
   return /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(import_box2.Box, {
@@ -317,3 +331,3 @@ element,
     padding: "space50"
-  }, /* @__PURE__ */ React4.createElement(Checkbox, __assign(__assign({}, props), {
+  }, /* @__PURE__ */ React4.createElement(Checkbox, __spreadProps(__spreadValues({}, props), {
     hasError: errorText != null,
@@ -335,1 +349,8 @@ ref
 };
+module.exports = __toCommonJS(src_exports);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Checkbox,
+  CheckboxDisclaimer,
+  CheckboxGroup
+});

dist/index.es.js

@@ -1,1 +0,1 @@
-var F=Object.prototype.hasOwnProperty;var H=Object.getOwnPropertySymbols,V=Object.prototype.propertyIsEnumerable;var i=Object.assign;var b=(e,r)=>{var t={};for(var o in e)F.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(e!=null&&H)for(var o of H(e))r.indexOf(o)<0&&V.call(e,o)&&(t[o]=e[o]);return t};import{createElement as n,forwardRef as L,useContext as j,useState as K}from"react";import{bool as m,func as U,node as w,oneOfType as J,string as g}from"prop-types";import{useUID as Q}from"@twilio-paste/uid-library";import{Box as M,safelySpreadBoxProps as Y}from"@twilio-paste/box";import{CheckboxCheckIcon as Z}from"@twilio-paste/icons/esm/CheckboxCheckIcon";import{MinusIcon as ee}from"@twilio-paste/icons/esm/MinusIcon";import{BaseRadioCheckboxControl as oe,BaseRadioCheckboxLabel as re,BaseRadioCheckboxLabelText as te,BaseRadioCheckboxHelpText as ne}from"@twilio-paste/base-radio-checkbox";import{MediaObject as ae,MediaFigure as ie,MediaBody as le}from"@twilio-paste/media-object";import{RequiredDot as se}from"@twilio-paste/label";import{createContext as $}from"react";var R=$({disabled:!1,name:void 0,hasError:void 0,onChange:()=>{}});var O=L((e,r)=>n(M,i(i({},e),{ref:r,as:"input",type:"checkbox",size:"size0",border:"none",overflow:"hidden",padding:"space0",margin:"space0",whiteSpace:"nowrap",textTransform:"none",position:"absolute",clip:"rect(0 0 0 0)"})));O.displayName="HiddenCheckbox";var ce=({checked:e,element:r,disabled:t,indeterminate:o})=>{let l=t&&(e||o)?"colorTextIcon":"colorTextWeakest";return o?n(ee,{element:r,decorative:!0,color:l,size:"sizeIcon10"}):n(Z,{element:r,display:e?"block":"none",decorative:!0,color:l,size:"sizeIcon10"})},C=L((x,k)=>{var{checked:e,element:r="CHECKBOX",children:t,helpText:o,id:l,indeterminate:s,isSelectAll:c,isSelectAllChild:h,required:f}=x,a=b(x,["checked","element","children","helpText","id","indeterminate","isSelectAll","isSelectAllChild","required"]);let T=Q(),p=j(R),d=a.disabled!=null?a.disabled:p.disabled,A=a.name!=null?a.name:p.name,z=a.hasError!=null?a.hasError:p.hasError,[W,X]=K(!!a.defaultChecked),I=e!==void 0,v=I?e:W,q=E=>{I?a.onChange?a.onChange(E):p.onChange(E):X(E.target.checked)},y=null,P=null;return c&&(y="space20",v||s?P="colorBackgroundPrimaryWeakest":d||(P="colorBackground")),h&&(y="space30"),n(M,{element:r,backgroundColor:P,borderRadius:c?"borderRadius10":null,display:"inline-flex",position:"relative",flexDirection:"column",padding:c?"space30":null,paddingBottom:c?"space20":null,paddingLeft:y,paddingRight:h?"space30":null,paddingTop:c?"space20":null},n(O,i(i({},Y(a)),{checked:e,disabled:d,name:A,onChange:q,"aria-describedby":T,"aria-checked":s?"mixed":e,"aria-invalid":z,id:l,required:f,ref:k})),n(re,{disabled:d,htmlFor:l},n(oe,{alignItems:"center",borderRadius:"borderRadius10",element:`${r}_CONTROL`,disabled:d,position:"relative",type:"checkbox"},n(ce,{element:`${r}_ICON`,checked:v,disabled:d,indeterminate:s})),n(te,{element:`${r}_LABEL_TEXT`,fontWeight:c?null:"fontWeightMedium"},n(ae,{verticalAlign:"top"},f&&n(ie,{spacing:"space20"},n(se,null)),n(le,null,t)))),o&&n(ne,{element:`${r}_HELP_TEXT_WRAPPER`,helpTextId:T},o))});C.displayName="Checkbox";C.propTypes={children:w.isRequired,disabled:m,name:g,onChange:U,hasError:m,helpText:J([g,w]),id:g,indeterminate:m,isSelectAll:m,isSelectAllChild:m,element:g,defaultChecked:m};import{Children as pe,cloneElement as de,createElement as N,forwardRef as be,isValidElement as me,useCallback as he,useMemo as xe}from"react";import{bool as De,func as Ae,oneOf as ze,string as We}from"prop-types";import{InlineControlGroup as Ce}from"@twilio-paste/inline-control-group";var _=be((k,a)=>{var{children:e,element:r="CHECKBOX_GROUP",disabled:t=!1,errorText:o,isSelectAll:l=!1,name:s,onChange:c,orientation:h="vertical"}=k,f=b(k,["children","element","disabled","errorText","isSelectAll","name","onChange","orientation"]);let x=he(p=>{c!=null&&c(p.target.checked)},[c]),T=xe(()=>({disabled:t,name:s,onChange:x,hasError:o?!0:void 0}),[t,s,x]);return N(R.Provider,{value:T},N(Ce,i(i({},f),{element:r,disabled:t,errorText:o,name:s,orientation:h,ref:a}),pe.map(e,(p,d)=>me(p)?de(p,{isSelectAll:l&&d===0,isSelectAllChild:l&&h==="vertical"&&d!==0}):p)))});_.displayName="CheckboxGroup";import{Fragment as ue,createElement as u,forwardRef as fe}from"react";import{node as G,oneOfType as ke,string as S}from"prop-types";import{Box as D}from"@twilio-paste/box";import{HelpText as Te}from"@twilio-paste/help-text";var B=fe((s,l)=>{var{children:e,element:r="CHECKBOX_DISCLAIMER",errorText:t}=s,o=b(s,["children","element","errorText"]);return u(ue,null,u(D,{element:r,backgroundColor:"colorBackground",borderRadius:"borderRadius20",padding:"space50"},u(C,i(i({},o),{hasError:t!=null,ref:l}),e)),t&&u(D,{marginTop:"space30",element:`${r}_ERROR_TEXT_WRAPPER`,marginLeft:"space50"},u(Te,{variant:"error"},t)))});B.displayName="CheckboxDisclaimer";B.propTypes={children:G.isRequired,errorText:ke([S,G]),element:S};export{C as Checkbox,B as CheckboxDisclaimer,_ as CheckboxGroup};
+var w=Object.defineProperty,pe=Object.defineProperties,se=Object.getOwnPropertyDescriptor,de=Object.getOwnPropertyDescriptors,ce=Object.getOwnPropertyNames,L=Object.getOwnPropertySymbols;var A=Object.prototype.hasOwnProperty,q=Object.prototype.propertyIsEnumerable;var F=(t,o,a)=>o in t?w(t,o,{enumerable:!0,configurable:!0,writable:!0,value:a}):t[o]=a,b=(t,o)=>{for(var a in o||(o={}))A.call(o,a)&&F(t,a,o[a]);if(L)for(var a of L(o))q.call(o,a)&&F(t,a,o[a]);return t},C=(t,o)=>pe(t,de(o));var E=(t,o)=>{var a={};for(var i in t)A.call(t,i)&&o.indexOf(i)<0&&(a[i]=t[i]);if(t!=null&&L)for(var i of L(t))o.indexOf(i)<0&&q.call(t,i)&&(a[i]=t[i]);return a};var m=(t,o)=>{for(var a in o)w(t,a,{get:o[a],enumerable:!0})},n=(t,o,a,i)=>{if(o&&typeof o=="object"||typeof o=="function")for(let p of ce(o))!A.call(t,p)&&(a||p!=="default")&&w(t,p,{get:()=>o[p],enumerable:!(i=se(o,p))||i.enumerable});return t};var e={};m(e,{default:()=>V});n(e,ue);import*as V from"react";import*as ue from"react";var r={};m(r,{default:()=>W});n(r,he);import*as W from"prop-types";import*as he from"prop-types";var k={};m(k,{default:()=>$});n(k,be);import*as $ from"@twilio-paste/uid-library";import*as be from"@twilio-paste/uid-library";var l={};m(l,{default:()=>K});n(l,Ce);import*as K from"@twilio-paste/box";import*as Ce from"@twilio-paste/box";var T={};m(T,{default:()=>j});n(T,ke);import*as j from"@twilio-paste/icons/esm/CheckboxCheckIcon";import*as ke from"@twilio-paste/icons/esm/CheckboxCheckIcon";var R={};m(R,{default:()=>U});n(R,Te);import*as U from"@twilio-paste/icons/esm/MinusIcon";import*as Te from"@twilio-paste/icons/esm/MinusIcon";var d={};m(d,{default:()=>J});n(d,Re);import*as J from"@twilio-paste/base-radio-checkbox";import*as Re from"@twilio-paste/base-radio-checkbox";var f={};m(f,{default:()=>Q});n(f,ge);import*as Q from"@twilio-paste/media-object";import*as ge from"@twilio-paste/media-object";var g={};m(g,{default:()=>Y});n(g,ye);import*as Y from"@twilio-paste/label";import*as ye from"@twilio-paste/label";var M=e.createContext({disabled:!1,name:void 0,hasError:void 0,onChange:()=>{}});var Z=e.forwardRef((t,o)=>e.createElement(l.Box,C(b({},t),{ref:o,as:"input",type:"checkbox",size:"size0",border:"none",overflow:"hidden",padding:"space0",margin:"space0",whiteSpace:"nowrap",textTransform:"none",position:"absolute",clip:"rect(0 0 0 0)"})));Z.displayName="HiddenCheckbox";var me=({checked:t,element:o,indeterminate:a})=>a?e.createElement(R.MinusIcon,{element:o,decorative:!0,color:"inherit",size:"sizeIcon10"}):e.createElement(T.CheckboxCheckIcon,{element:o,display:t?"block":"none",decorative:!0,color:"inherit",size:"sizeIcon10"}),O=e.forwardRef((N,D)=>{var I=N,{checked:t,element:o="CHECKBOX",children:a,helpText:i,id:p,indeterminate:u,isSelectAll:s,isSelectAllChild:B,required:v}=I,c=E(I,["checked","element","children","helpText","id","indeterminate","isSelectAll","isSelectAllChild","required"]);let H=(0,k.useUID)(),x=e.useContext(M),h=c.disabled!=null?c.disabled:x.disabled,te=c.name!=null?c.name:x.name,ne=c.hasError!=null?c.hasError:x.hasError,[ae,ie]=e.useState(!!c.defaultChecked),z=t!==void 0,X=z?t:ae,le=G=>{z?c.onChange?c.onChange(G):x.onChange(G):ie(G.target.checked)},_=null,S=null;return s&&(_="space20",S="colorBackground",(X||u)&&!h&&(S="colorBackgroundPrimaryWeakest")),B&&(_="space30"),e.createElement(l.Box,{element:o,backgroundColor:S,borderRadius:s?"borderRadius10":null,display:"inline-flex",position:"relative",flexDirection:"column",padding:s?"space30":null,paddingBottom:s?"space20":null,paddingLeft:_,paddingRight:B?"space30":null,paddingTop:s?"space20":null},e.createElement(Z,C(b({},(0,l.safelySpreadBoxProps)(c)),{checked:t,disabled:h,name:te,onChange:le,"aria-describedby":H,"aria-checked":u?"mixed":t,"aria-invalid":ne,id:p,required:v,ref:D})),e.createElement(d.BaseRadioCheckboxLabel,{disabled:h,htmlFor:p},e.createElement(d.BaseRadioCheckboxControl,{alignItems:"center",borderRadius:"borderRadius10",element:`${o}_CONTROL`,disabled:h,position:"relative",type:"checkbox"},e.createElement(me,{element:`${o}_ICON`,checked:X,disabled:h,indeterminate:u})),e.createElement(d.BaseRadioCheckboxLabelText,{element:`${o}_LABEL_TEXT`,fontWeight:s?null:"fontWeightMedium"},e.createElement(f.MediaObject,{verticalAlign:"top"},v&&e.createElement(f.MediaFigure,{spacing:"space20"},e.createElement(g.RequiredDot,null)),e.createElement(f.MediaBody,null,a)))),i&&e.createElement(d.BaseRadioCheckboxHelpText,{element:`${o}_HELP_TEXT_WRAPPER`,helpTextId:H},i))});O.displayName="Checkbox";O.propTypes={children:r.node.isRequired,disabled:r.bool,name:r.string,onChange:r.func,hasError:r.bool,helpText:r.oneOfType([r.string,r.node]),id:r.string,indeterminate:r.bool,isSelectAll:r.bool,isSelectAllChild:r.bool,element:r.string,defaultChecked:r.bool};var y={};m(y,{default:()=>ee});n(y,_e);import*as ee from"@twilio-paste/inline-control-group";import*as _e from"@twilio-paste/inline-control-group";var fe=e.forwardRef((D,c)=>{var N=D,{children:t,element:o="CHECKBOX_GROUP",disabled:a=!1,errorText:i,isSelectAll:p=!1,name:u,onChange:s,orientation:B="vertical"}=N,v=E(N,["children","element","disabled","errorText","isSelectAll","name","onChange","orientation"]);let I=e.useCallback(x=>{s!=null&&s(x.target.checked)},[s]),H=e.useMemo(()=>({disabled:a,name:u,onChange:I,hasError:i?!0:void 0}),[a,u,I]);return e.createElement(M.Provider,{value:H},e.createElement(y.InlineControlGroup,C(b({},v),{element:o,disabled:a,errorText:i,name:u,orientation:B,ref:c}),e.Children.map(t,(x,h)=>e.isValidElement(x)?e.cloneElement(x,{isSelectAll:p&&h===0,isSelectAllChild:p&&B==="vertical"&&h!==0}):x)))});fe.displayName="CheckboxGroup";var P={};m(P,{default:()=>oe});n(P,Ae);import*as oe from"@twilio-paste/help-text";import*as Ae from"@twilio-paste/help-text";var re=e.forwardRef((u,p)=>{var s=u,{children:t,element:o="CHECKBOX_DISCLAIMER",errorText:a}=s,i=E(s,["children","element","errorText"]);return e.createElement(e.Fragment,null,e.createElement(l.Box,{element:o,backgroundColor:"colorBackground",borderRadius:"borderRadius20",padding:"space50"},e.createElement(O,C(b({},i),{hasError:a!=null,ref:p}),t)),a&&e.createElement(l.Box,{marginTop:"space30",element:`${o}_ERROR_TEXT_WRAPPER`,marginLeft:"space50"},e.createElement(P.HelpText,{variant:"error"},a)))});re.displayName="CheckboxDisclaimer";re.propTypes={children:r.node.isRequired,errorText:r.oneOfType([r.string,r.node]),element:r.string};export{O as Checkbox,re as CheckboxDisclaimer,fe as CheckboxGroup};

dist/index.js

@@ -1,1 +0,1 @@
-var ee=Object.create,I=Object.defineProperty,oe=Object.getPrototypeOf,S=Object.prototype.hasOwnProperty,re=Object.getOwnPropertyNames,te=Object.getOwnPropertyDescriptor,D=Object.getOwnPropertySymbols,ne=Object.prototype.propertyIsEnumerable;var c=Object.assign,A=e=>I(e,"__esModule",{value:!0});var f=(e,o)=>{var n={};for(var r in e)S.call(e,r)&&o.indexOf(r)<0&&(n[r]=e[r]);if(e!=null&&D)for(var r of D(e))o.indexOf(r)<0&&ne.call(e,r)&&(n[r]=e[r]);return n};var ae=(e,o)=>{A(e);for(var n in o)I(e,n,{get:o[n],enumerable:!0})},ie=(e,o,n)=>{if(A(e),o&&typeof o=="object"||typeof o=="function")for(let r of re(o))!S.call(e,r)&&r!=="default"&&I(e,r,{get:()=>o[r],enumerable:!(n=te(o,r))||n.enumerable});return e},i=e=>e&&e.__esModule?e:ie(I(e!=null?ee(oe(e)):{},"default",{value:e,enumerable:!0}),e);ae(exports,{Checkbox:()=>y,CheckboxDisclaimer:()=>N,CheckboxGroup:()=>j});var t=i(require("react")),a=i(require("prop-types")),W=i(require("@twilio-paste/uid-library")),g=i(require("@twilio-paste/box")),X=i(require("@twilio-paste/icons/cjs/CheckboxCheckIcon")),q=i(require("@twilio-paste/icons/cjs/MinusIcon")),C=i(require("@twilio-paste/base-radio-checkbox")),k=i(require("@twilio-paste/media-object")),F=i(require("@twilio-paste/label"));var z=i(require("react")),v=z.createContext({disabled:!1,name:void 0,hasError:void 0,onChange:()=>{}});var V=t.forwardRef((e,o)=>t.createElement(g.Box,c(c({},e),{ref:o,as:"input",type:"checkbox",size:"size0",border:"none",overflow:"hidden",padding:"space0",margin:"space0",whiteSpace:"nowrap",textTransform:"none",position:"absolute",clip:"rect(0 0 0 0)"})));V.displayName="HiddenCheckbox";var le=({checked:e,element:o,disabled:n,indeterminate:r})=>{let p=n&&(e||r)?"colorTextIcon":"colorTextWeakest";return r?t.createElement(q.MinusIcon,{element:o,decorative:!0,color:p,size:"sizeIcon10"}):t.createElement(X.CheckboxCheckIcon,{element:o,display:e?"block":"none",decorative:!0,color:p,size:"sizeIcon10"})},y=t.forwardRef((R,E)=>{var{checked:e,element:o="CHECKBOX",children:n,helpText:r,id:p,indeterminate:d,isSelectAll:b,isSelectAllChild:T,required:P}=R,s=f(R,["checked","element","children","helpText","id","indeterminate","isSelectAll","isSelectAllChild","required"]);let B=W.useUID(),m=t.useContext(v),x=s.disabled!=null?s.disabled:m.disabled,U=s.name!=null?s.name:m.name,J=s.hasError!=null?s.hasError:m.hasError,[Q,Y]=t.useState(!!s.defaultChecked),_=e!==void 0,G=_?e:Q,Z=M=>{_?s.onChange?s.onChange(M):m.onChange(M):Y(M.target.checked)},L=null,w=null;return b&&(L="space20",G||d?w="colorBackgroundPrimaryWeakest":x||(w="colorBackground")),T&&(L="space30"),t.createElement(g.Box,{element:o,backgroundColor:w,borderRadius:b?"borderRadius10":null,display:"inline-flex",position:"relative",flexDirection:"column",padding:b?"space30":null,paddingBottom:b?"space20":null,paddingLeft:L,paddingRight:T?"space30":null,paddingTop:b?"space20":null},t.createElement(V,c(c({},g.safelySpreadBoxProps(s)),{checked:e,disabled:x,name:U,onChange:Z,"aria-describedby":B,"aria-checked":d?"mixed":e,"aria-invalid":J,id:p,required:P,ref:E})),t.createElement(C.BaseRadioCheckboxLabel,{disabled:x,htmlFor:p},t.createElement(C.BaseRadioCheckboxControl,{alignItems:"center",borderRadius:"borderRadius10",element:`${o}_CONTROL`,disabled:x,position:"relative",type:"checkbox"},t.createElement(le,{element:`${o}_ICON`,checked:G,disabled:x,indeterminate:d})),t.createElement(C.BaseRadioCheckboxLabelText,{element:`${o}_LABEL_TEXT`,fontWeight:b?null:"fontWeightMedium"},t.createElement(k.MediaObject,{verticalAlign:"top"},P&&t.createElement(k.MediaFigure,{spacing:"space20"},t.createElement(F.RequiredDot,null)),t.createElement(k.MediaBody,null,n)))),r&&t.createElement(C.BaseRadioCheckboxHelpText,{element:`${o}_HELP_TEXT_WRAPPER`,helpTextId:B},r))});y.displayName="Checkbox";y.propTypes={children:a.node.isRequired,disabled:a.bool,name:a.string,onChange:a.func,hasError:a.bool,helpText:a.oneOfType([a.string,a.node]),id:a.string,indeterminate:a.bool,isSelectAll:a.bool,isSelectAllChild:a.bool,element:a.string,defaultChecked:a.bool};var l=i(require("react")),H=i(require("prop-types")),$=i(require("@twilio-paste/inline-control-group"));var j=l.forwardRef((E,s)=>{var{children:e,element:o="CHECKBOX_GROUP",disabled:n=!1,errorText:r,isSelectAll:p=!1,name:d,onChange:b,orientation:T="vertical"}=E,P=f(E,["children","element","disabled","errorText","isSelectAll","name","onChange","orientation"]);let R=l.useCallback(m=>{b!=null&&b(m.target.checked)},[b]),B=l.useMemo(()=>({disabled:n,name:d,onChange:R,hasError:r?!0:void 0}),[n,d,R]);return l.createElement(v.Provider,{value:B},l.createElement($.InlineControlGroup,c(c({},P),{element:o,disabled:n,errorText:r,name:d,orientation:T,ref:s}),l.Children.map(e,(m,x)=>l.isValidElement(m)?l.cloneElement(m,{isSelectAll:p&&x===0,isSelectAllChild:p&&T==="vertical"&&x!==0}):m)))});j.displayName="CheckboxGroup";var h=i(require("react")),u=i(require("prop-types")),O=i(require("@twilio-paste/box")),K=i(require("@twilio-paste/help-text"));var N=h.forwardRef((d,p)=>{var{children:e,element:o="CHECKBOX_DISCLAIMER",errorText:n}=d,r=f(d,["children","element","errorText"]);return h.createElement(h.Fragment,null,h.createElement(O.Box,{element:o,backgroundColor:"colorBackground",borderRadius:"borderRadius20",padding:"space50"},h.createElement(y,c(c({},r),{hasError:n!=null,ref:p}),e)),n&&h.createElement(O.Box,{marginTop:"space30",element:`${o}_ERROR_TEXT_WRAPPER`,marginLeft:"space50"},h.createElement(K.HelpText,{variant:"error"},n)))});N.displayName="CheckboxDisclaimer";N.propTypes={children:u.node.isRequired,errorText:u.oneOfType([u.string,u.node]),element:u.string};
+var ae=Object.create;var y=Object.defineProperty,ie=Object.defineProperties,le=Object.getOwnPropertyDescriptor,se=Object.getOwnPropertyDescriptors,pe=Object.getOwnPropertyNames,v=Object.getOwnPropertySymbols,ce=Object.getPrototypeOf,S=Object.prototype.hasOwnProperty,X=Object.prototype.propertyIsEnumerable;var q=(e,o,r)=>o in e?y(e,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[o]=r,C=(e,o)=>{for(var r in o||(o={}))S.call(o,r)&&q(e,r,o[r]);if(v)for(var r of v(o))X.call(o,r)&&q(e,r,o[r]);return e},x=(e,o)=>ie(e,se(o)),F=e=>y(e,"__esModule",{value:!0});var k=(e,o)=>{var r={};for(var t in e)S.call(e,t)&&o.indexOf(t)<0&&(r[t]=e[t]);if(e!=null&&v)for(var t of v(e))o.indexOf(t)<0&&X.call(e,t)&&(r[t]=e[t]);return r};var de=(e,o)=>{for(var r in o)y(e,r,{get:o[r],enumerable:!0})},V=(e,o,r,t)=>{if(o&&typeof o=="object"||typeof o=="function")for(let l of pe(o))!S.call(e,l)&&(r||l!=="default")&&y(e,l,{get:()=>o[l],enumerable:!(t=le(o,l))||t.enumerable});return e},f=(e,o)=>V(F(y(e!=null?ae(ce(e)):{},"default",!o&&e&&e.__esModule?{get:()=>e.default,enumerable:!0}:{value:e,enumerable:!0})),e),me=(e=>(o,r)=>e&&e.get(o)||(r=V(F({}),o,1),e&&e.set(o,r),r))(typeof WeakMap!="undefined"?new WeakMap:0);var be={};de(be,{Checkbox:()=>E,CheckboxDisclaimer:()=>w,CheckboxGroup:()=>Y});var n=f(require("react")),a=f(require("prop-types")),$=require("@twilio-paste/uid-library"),P=require("@twilio-paste/box"),K=require("@twilio-paste/icons/cjs/CheckboxCheckIcon"),j=require("@twilio-paste/icons/cjs/MinusIcon"),b=require("@twilio-paste/base-radio-checkbox"),T=require("@twilio-paste/media-object"),U=require("@twilio-paste/label");var W=f(require("react")),H=W.createContext({disabled:!1,name:void 0,hasError:void 0,onChange:()=>{}});var J=n.forwardRef((e,o)=>n.createElement(P.Box,x(C({},e),{ref:o,as:"input",type:"checkbox",size:"size0",border:"none",overflow:"hidden",padding:"space0",margin:"space0",whiteSpace:"nowrap",textTransform:"none",position:"absolute",clip:"rect(0 0 0 0)"})));J.displayName="HiddenCheckbox";var he=({checked:e,element:o,indeterminate:r})=>r?n.createElement(j.MinusIcon,{element:o,decorative:!0,color:"inherit",size:"sizeIcon10"}):n.createElement(K.CheckboxCheckIcon,{element:o,display:e?"block":"none",decorative:!0,color:"inherit",size:"sizeIcon10"}),E=n.forwardRef((M,A)=>{var g=M,{checked:e,element:o="CHECKBOX",children:r,helpText:t,id:l,indeterminate:m,isSelectAll:s,isSelectAllChild:R,required:B}=g,p=k(g,["checked","element","children","helpText","id","indeterminate","isSelectAll","isSelectAllChild","required"]);let I=(0,$.useUID)(),c=n.useContext(H),h=p.disabled!=null?p.disabled:c.disabled,ee=p.name!=null?p.name:c.name,oe=p.hasError!=null?p.hasError:c.hasError,[re,ne]=n.useState(!!p.defaultChecked),D=e!==void 0,z=D?e:re,te=_=>{D?p.onChange?p.onChange(_):c.onChange(_):ne(_.target.checked)},O=null,N=null;return s&&(O="space20",N="colorBackground",(z||m)&&!h&&(N="colorBackgroundPrimaryWeakest")),R&&(O="space30"),n.createElement(P.Box,{element:o,backgroundColor:N,borderRadius:s?"borderRadius10":null,display:"inline-flex",position:"relative",flexDirection:"column",padding:s?"space30":null,paddingBottom:s?"space20":null,paddingLeft:O,paddingRight:R?"space30":null,paddingTop:s?"space20":null},n.createElement(J,x(C({},(0,P.safelySpreadBoxProps)(p)),{checked:e,disabled:h,name:ee,onChange:te,"aria-describedby":I,"aria-checked":m?"mixed":e,"aria-invalid":oe,id:l,required:B,ref:A})),n.createElement(b.BaseRadioCheckboxLabel,{disabled:h,htmlFor:l},n.createElement(b.BaseRadioCheckboxControl,{alignItems:"center",borderRadius:"borderRadius10",element:`${o}_CONTROL`,disabled:h,position:"relative",type:"checkbox"},n.createElement(he,{element:`${o}_ICON`,checked:z,disabled:h,indeterminate:m})),n.createElement(b.BaseRadioCheckboxLabelText,{element:`${o}_LABEL_TEXT`,fontWeight:s?null:"fontWeightMedium"},n.createElement(T.MediaObject,{verticalAlign:"top"},B&&n.createElement(T.MediaFigure,{spacing:"space20"},n.createElement(U.RequiredDot,null)),n.createElement(T.MediaBody,null,r)))),t&&n.createElement(b.BaseRadioCheckboxHelpText,{element:`${o}_HELP_TEXT_WRAPPER`,helpTextId:I},t))});E.displayName="Checkbox";E.propTypes={children:a.node.isRequired,disabled:a.bool,name:a.string,onChange:a.func,hasError:a.bool,helpText:a.oneOfType([a.string,a.node]),id:a.string,indeterminate:a.bool,isSelectAll:a.bool,isSelectAllChild:a.bool,element:a.string,defaultChecked:a.bool};var i=f(require("react")),L=f(require("prop-types")),Q=require("@twilio-paste/inline-control-group");var Y=i.forwardRef((A,p)=>{var M=A,{children:e,element:o="CHECKBOX_GROUP",disabled:r=!1,errorText:t,isSelectAll:l=!1,name:m,onChange:s,orientation:R="vertical"}=M,B=k(M,["children","element","disabled","errorText","isSelectAll","name","onChange","orientation"]);let g=i.useCallback(c=>{s!=null&&s(c.target.checked)},[s]),I=i.useMemo(()=>({disabled:r,name:m,onChange:g,hasError:t?!0:void 0}),[r,m,g]);return i.createElement(H.Provider,{value:I},i.createElement(Q.InlineControlGroup,x(C({},B),{element:o,disabled:r,errorText:t,name:m,orientation:R,ref:p}),i.Children.map(e,(c,h)=>i.isValidElement(c)?i.cloneElement(c,{isSelectAll:l&&h===0,isSelectAllChild:l&&R==="vertical"&&h!==0}):c)))});Y.displayName="CheckboxGroup";var d=f(require("react")),u=f(require("prop-types")),G=require("@twilio-paste/box"),Z=require("@twilio-paste/help-text");var w=d.forwardRef((m,l)=>{var s=m,{children:e,element:o="CHECKBOX_DISCLAIMER",errorText:r}=s,t=k(s,["children","element","errorText"]);return d.createElement(d.Fragment,null,d.createElement(G.Box,{element:o,backgroundColor:"colorBackground",borderRadius:"borderRadius20",padding:"space50"},d.createElement(E,x(C({},t),{hasError:r!=null,ref:l}),e)),r&&d.createElement(G.Box,{marginTop:"space30",element:`${o}_ERROR_TEXT_WRAPPER`,marginLeft:"space50"},d.createElement(Z.HelpText,{variant:"error"},r)))});w.displayName="CheckboxDisclaimer";w.propTypes={children:u.node.isRequired,errorText:u.oneOfType([u.string,u.node]),element:u.string};module.exports=me(be);0&&(module.exports={Checkbox,CheckboxDisclaimer,CheckboxGroup});

package.json

 {
   "name": "@twilio-paste/checkbox",
-  "version": "7.0.0",
+  "version": "7.0.1",
   "category": "user input",
@@ -49,18 +49,18 @@ "status": "production",
   "devDependencies": {
-    "@twilio-paste/base-radio-checkbox": "^7.0.0",
-    "@twilio-paste/box": "^5.0.0",
-    "@twilio-paste/design-tokens": "^7.0.0",
-    "@twilio-paste/help-text": "^7.0.0",
-    "@twilio-paste/icons": "^6.0.0",
-    "@twilio-paste/inline-control-group": "^7.0.0",
-    "@twilio-paste/label": "^7.0.0",
-    "@twilio-paste/media-object": "^5.0.0",
-    "@twilio-paste/screen-reader-only": "^7.0.0",
-    "@twilio-paste/sibling-box": "^4.0.0",
-    "@twilio-paste/style-props": "^4.0.0",
-    "@twilio-paste/styling-library": "^0.3.5",
-    "@twilio-paste/text": "^5.0.0",
-    "@twilio-paste/theme": "^6.0.0",
-    "@twilio-paste/types": "^3.1.3",
-    "@twilio-paste/uid-library": "^0.2.2",
+    "@twilio-paste/base-radio-checkbox": "^7.0.1",
+    "@twilio-paste/box": "^5.0.1",
+    "@twilio-paste/design-tokens": "^7.1.0",
+    "@twilio-paste/help-text": "^7.0.1",
+    "@twilio-paste/icons": "^6.2.0",
+    "@twilio-paste/inline-control-group": "^7.0.1",
+    "@twilio-paste/label": "^7.0.1",
+    "@twilio-paste/media-object": "^5.0.1",
+    "@twilio-paste/screen-reader-only": "^7.0.1",
+    "@twilio-paste/sibling-box": "^4.0.1",
+    "@twilio-paste/style-props": "^4.0.1",
+    "@twilio-paste/styling-library": "^0.3.6",
+    "@twilio-paste/text": "^5.0.1",
+    "@twilio-paste/theme": "^6.0.1",
+    "@twilio-paste/types": "^3.1.4",
+    "@twilio-paste/uid-library": "^0.2.3",
     "prop-types": "^15.7.2",
@@ -67,0 +67,0 @@ "react": "^17.0.2",

No alert changes

Improved metrics

Total package byte prevSize

498438

1.84%

Lines of code

826

11.77%

No dependency changes