@simplybusiness/mobius 5.3.1 → 5.4.0

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # Changelog
 
+## 5.4.0
+
+### Minor Changes
+
+- b4eec50: Add support for `lastItemDisables` on `CheckboxGroup` component
+
+### Patch Changes
+
+- 2085451: Prevent calling `onChange` on `CheckboxGroup` on initial render
+- 37bf8fa: Package updates
+- Updated dependencies [5bc73ef]
+  - @simplybusiness/icons@4.15.0
+
 ## 5.3.1
 
 ### Patch Changes

package/dist/cjs/components/Checkbox/Checkbox.js

@@ -24,8 +24,7 @@ function _interop_require_default(obj) {
     };
 }
 const Checkbox = /*#__PURE__*/ (0, _react.forwardRef)((props, ref)=>{
-    const { id, label, isDisabled, isRequired, validationState, isInvalid, onChange, className, errorMessage, defaultSelected = false, isReadOnly, name, value, ["aria-describedby"]: ariaDescribedBy, ...rest } = props;
-    const [selected, setSelected] = (0, _react.useState)(defaultSelected);
+    const { id, label, isDisabled, isRequired, validationState, isInvalid, onChange, className, errorMessage, selected, defaultSelected = false, isReadOnly, isLastItem, name, value, ["aria-describedby"]: ariaDescribedBy, ...rest } = props;
     const fallbackRef = (0, _react.useRef)(null);
     const refObj = ref || fallbackRef;
     const inputId = (0, _react.useId)();
@@ -51,25 +50,12 @@ const Checkbox = /*#__PURE__*/ (0, _react.forwardRef)((props, ref)=>{
         ariaDescribedBy
     ]);
     const labelId = (0, _react.useId)();
-    const toggleState = ()=>{
-        setSelected(!selected);
-    };
-    const handleClick = (event)=>{
-        const isMouseEvent = event.clientX;
-        if (isMouseEvent) {
-            toggleState();
-        }
-    };
     const handleChange = (event)=>{
         if (onChange) {
-            onChange(event);
-        }
-    };
-    const handleKeyDown = (event)=>{
-        if (event.code === "Space") {
-            toggleState();
+            onChange(event, isLastItem);
         }
     };
+    const isControlled = typeof props.selected === "boolean";
     return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_Stack.Stack, {
         gap: "xs",
         className: wrapperClasses,
@@ -86,11 +72,10 @@ const Checkbox = /*#__PURE__*/ (0, _react.forwardRef)((props, ref)=>{
                         disabled: isDisabled,
                         ref: refObj,
                         className: inputClasses,
-                        onClick: handleClick,
                         onChange: handleChange,
-                        onKeyDown: handleKeyDown,
                         type: "checkbox",
-                        defaultChecked: defaultSelected,
+                        checked: selected,
+                        defaultChecked: isControlled ? undefined : defaultSelected,
                         required: isRequired,
                         id: id || inputId,
                         name: name,

package/dist/cjs/components/Checkbox/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  ChangeEvent,\n  forwardRef,\n  useRef,\n  useState,\n  KeyboardEvent,\n  MouseEvent,\n  useId,\n} from \"react\";\nimport classNames from \"classnames/dedupe\";\nimport { squareTick, square } from \"@simplybusiness/icons\";\nimport { ErrorMessage } from \"../ErrorMessage\";\nimport { ForwardedRefComponent } from \"../../types/components\";\nimport { CheckboxElementType, CheckboxProps, CheckboxRef } from \"./types\";\nimport { spaceDelimitedList } from \"../../utils/spaceDelimitedList\";\nimport { useValidationClasses } from \"../../hooks\";\nimport { Icon } from \"../Icon\";\nimport { Stack } from \"../Stack\";\n\nexport const Checkbox: ForwardedRefComponent<\n  CheckboxProps,\n  CheckboxElementType\n> = forwardRef((props: CheckboxProps, ref: CheckboxRef) => {\n  const {\n    id,\n    label,\n    isDisabled,\n    isRequired,\n    validationState,\n    isInvalid,\n    onChange,\n    className,\n    errorMessage,\n    defaultSelected = false,\n    isReadOnly,\n    name,\n    value,\n    [\"aria-describedby\"]: ariaDescribedBy,\n    ...rest\n  } = props;\n  const [selected, setSelected] = useState<boolean>(defaultSelected);\n  const fallbackRef = useRef<HTMLInputElement>(null);\n  const refObj = ref || fallbackRef;\n  const inputId = useId();\n  const validationClasses = useValidationClasses({\n    validationState,\n    isInvalid,\n  });\n  const sharedClasses = classNames(\n    {\n      \"--is-disabled\": isDisabled,\n      \"--is-selected\": selected,\n      \"--is-required\": typeof isRequired === \"boolean\" && isRequired,\n      \"--is-optional\": typeof isRequired === \"boolean\" && !isRequired,\n    },\n    validationClasses,\n  );\n  // Append an additional wrapper class name to differenitate from input\n  const wrapperClasses = classNames(\n    \"mobius\",\n    \"mobius-checkbox\",\n    sharedClasses,\n    className,\n  );\n  const labelClasses = classNames(\"mobius-checkbox__label\", sharedClasses);\n  const inputClasses = classNames(\"mobius-checkbox__input\", sharedClasses);\n  const iconClasses = classNames(\"mobius-checkbox__icon\", sharedClasses);\n  const errorMessageId = useId();\n  const shouldErrorMessageShow = errorMessage ? errorMessageId : undefined;\n  const describedBy = spaceDelimitedList([\n    shouldErrorMessageShow,\n    ariaDescribedBy,\n  ]);\n  const labelId = useId();\n\n  const toggleState = () => {\n    setSelected(!selected);\n  };\n\n  const handleClick = (event: MouseEvent<CheckboxElementType>) => {\n    const isMouseEvent = event.clientX;\n\n    if (isMouseEvent) {\n      toggleState();\n    }\n  };\n\n  const handleChange = (event: ChangeEvent<CheckboxElementType>) => {\n    if (onChange) {\n      onChange(event);\n    }\n  };\n\n  const handleKeyDown = (event: KeyboardEvent) => {\n    if (event.code === \"Space\") {\n      toggleState();\n    }\n  };\n\n  return (\n    <Stack gap=\"xs\" className={wrapperClasses}>\n      <label className={labelClasses}>\n        <input\n          aria-describedby={describedBy}\n          aria-errormessage={shouldErrorMessageShow}\n          aria-invalid={isInvalid}\n          aria-labelledby={labelId}\n          readOnly={isReadOnly}\n          disabled={isDisabled}\n          ref={refObj}\n          className={inputClasses}\n          onClick={handleClick}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          type=\"checkbox\"\n          defaultChecked={defaultSelected}\n          required={isRequired}\n          id={id || inputId}\n          name={name}\n          value={value}\n          {...rest}\n        />\n        <Icon\n          icon={selected ? squareTick : square}\n          size=\"md\"\n          className={iconClasses}\n        />\n        <span id={labelId} className=\"mobius-checkbox__visible-label\">\n          {label}\n        </span>\n      </label>\n      <ErrorMessage id={errorMessageId} errorMessage={errorMessage} />\n    </Stack>\n  );\n});\n"],"names":["Checkbox","forwardRef","props","ref","id","label","isDisabled","isRequired","validationState","isInvalid","onChange","className","errorMessage","defaultSelected","isReadOnly","name","value","ariaDescribedBy","rest","selected","setSelected","useState","fallbackRef","useRef","refObj","inputId","useId","validationClasses","useValidationClasses","sharedClasses","classNames","wrapperClasses","labelClasses","inputClasses","iconClasses","errorMessageId","shouldErrorMessageShow","undefined","describedBy","spaceDelimitedList","labelId","toggleState","handleClick","event","isMouseEvent","clientX","handleChange","handleKeyDown","code","Stack","gap","input","aria-describedby","aria-errormessage","aria-invalid","aria-labelledby","readOnly","disabled","onClick","onKeyDown","type","defaultChecked","required","Icon","icon","squareTick","square","size","span","ErrorMessage"],"mappings":"AAAA;;;;;+BAqBaA;;;eAAAA;;;;uBAXN;+DACgB;uBACY;8BACN;oCAGM;uBACE;sBAChB;uBACC;;;;;;AAEf,MAAMA,yBAGTC,IAAAA,iBAAU,EAAC,CAACC,OAAsBC;IACpC,MAAM,EACJC,EAAE,EACFC,KAAK,EACLC,UAAU,EACVC,UAAU,EACVC,eAAe,EACfC,SAAS,EACTC,QAAQ,EACRC,SAAS,EACTC,YAAY,EACZC,kBAAkB,KAAK,EACvBC,UAAU,EACVC,IAAI,EACJC,KAAK,EACL,CAAC,mBAAmB,EAAEC,eAAe,EACrC,GAAGC,MACJ,GAAGhB;IACJ,MAAM,CAACiB,UAAUC,YAAY,GAAGC,IAAAA,eAAQ,EAAUR;IAClD,MAAMS,cAAcC,IAAAA,aAAM,EAAmB;IAC7C,MAAMC,SAASrB,OAAOmB;IACtB,MAAMG,UAAUC,IAAAA,YAAK;IACrB,MAAMC,oBAAoBC,IAAAA,2BAAoB,EAAC;QAC7CpB;QACAC;IACF;IACA,MAAMoB,gBAAgBC,IAAAA,eAAU,EAC9B;QACE,iBAAiBxB;QACjB,iBAAiBa;QACjB,iBAAiB,OAAOZ,eAAe,aAAaA;QACpD,iBAAiB,OAAOA,eAAe,aAAa,CAACA;IACvD,GACAoB;IAEF,sEAAsE;IACtE,MAAMI,iBAAiBD,IAAAA,eAAU,EAC/B,UACA,mBACAD,eACAlB;IAEF,MAAMqB,eAAeF,IAAAA,eAAU,EAAC,0BAA0BD;IAC1D,MAAMI,eAAeH,IAAAA,eAAU,EAAC,0BAA0BD;IAC1D,MAAMK,cAAcJ,IAAAA,eAAU,EAAC,yBAAyBD;IACxD,MAAMM,iBAAiBT,IAAAA,YAAK;IAC5B,MAAMU,yBAAyBxB,eAAeuB,iBAAiBE;IAC/D,MAAMC,cAAcC,IAAAA,sCAAkB,EAAC;QACrCH;QACAnB;KACD;IACD,MAAMuB,UAAUd,IAAAA,YAAK;IAErB,MAAMe,cAAc;QAClBrB,YAAY,CAACD;IACf;IAEA,MAAMuB,cAAc,CAACC;QACnB,MAAMC,eAAeD,MAAME,OAAO;QAElC,IAAID,cAAc;YAChBH;QACF;IACF;IAEA,MAAMK,eAAe,CAACH;QACpB,IAAIjC,UAAU;YACZA,SAASiC;QACX;IACF;IAEA,MAAMI,gBAAgB,CAACJ;QACrB,IAAIA,MAAMK,IAAI,KAAK,SAAS;YAC1BP;QACF;IACF;IAEA,qBACE,sBAACQ,YAAK;QAACC,KAAI;QAAKvC,WAAWoB;;0BACzB,sBAAC1B;gBAAMM,WAAWqB;;kCAChB,qBAACmB;wBACCC,oBAAkBd;wBAClBe,qBAAmBjB;wBACnBkB,gBAAc7C;wBACd8C,mBAAiBf;wBACjBgB,UAAU1C;wBACV2C,UAAUnD;wBACVH,KAAKqB;wBACLb,WAAWsB;wBACXyB,SAAShB;wBACThC,UAAUoC;wBACVa,WAAWZ;wBACXa,MAAK;wBACLC,gBAAgBhD;wBAChBiD,UAAUvD;wBACVH,IAAIA,MAAMqB;wBACVV,MAAMA;wBACNC,OAAOA;wBACN,GAAGE,IAAI;;kCAEV,qBAAC6C,UAAI;wBACHC,MAAM7C,WAAW8C,iBAAU,GAAGC,aAAM;wBACpCC,MAAK;wBACLxD,WAAWuB;;kCAEb,qBAACkC;wBAAKhE,IAAIoC;wBAAS7B,WAAU;kCAC1BN;;;;0BAGL,qBAACgE,0BAAY;gBAACjE,IAAI+B;gBAAgBvB,cAAcA;;;;AAGtD"}
+{"version":3,"sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["\"use client\";\n\nimport { ChangeEvent, forwardRef, useRef, useId } from \"react\";\nimport classNames from \"classnames/dedupe\";\nimport { squareTick, square } from \"@simplybusiness/icons\";\nimport { ErrorMessage } from \"../ErrorMessage\";\nimport { ForwardedRefComponent } from \"../../types/components\";\nimport { CheckboxElementType, CheckboxProps, CheckboxRef } from \"./types\";\nimport { spaceDelimitedList } from \"../../utils/spaceDelimitedList\";\nimport { useValidationClasses } from \"../../hooks\";\nimport { Icon } from \"../Icon\";\nimport { Stack } from \"../Stack\";\n\nexport const Checkbox: ForwardedRefComponent<\n  CheckboxProps,\n  CheckboxElementType\n> = forwardRef((props: CheckboxProps, ref: CheckboxRef) => {\n  const {\n    id,\n    label,\n    isDisabled,\n    isRequired,\n    validationState,\n    isInvalid,\n    onChange,\n    className,\n    errorMessage,\n    selected,\n    defaultSelected = false,\n    isReadOnly,\n    isLastItem,\n    name,\n    value,\n    [\"aria-describedby\"]: ariaDescribedBy,\n    ...rest\n  } = props;\n  const fallbackRef = useRef<HTMLInputElement>(null);\n  const refObj = ref || fallbackRef;\n  const inputId = useId();\n  const validationClasses = useValidationClasses({\n    validationState,\n    isInvalid,\n  });\n  const sharedClasses = classNames(\n    {\n      \"--is-disabled\": isDisabled,\n      \"--is-selected\": selected,\n      \"--is-required\": typeof isRequired === \"boolean\" && isRequired,\n      \"--is-optional\": typeof isRequired === \"boolean\" && !isRequired,\n    },\n    validationClasses,\n  );\n  // Append an additional wrapper class name to differenitate from input\n  const wrapperClasses = classNames(\n    \"mobius\",\n    \"mobius-checkbox\",\n    sharedClasses,\n    className,\n  );\n  const labelClasses = classNames(\"mobius-checkbox__label\", sharedClasses);\n  const inputClasses = classNames(\"mobius-checkbox__input\", sharedClasses);\n  const iconClasses = classNames(\"mobius-checkbox__icon\", sharedClasses);\n  const errorMessageId = useId();\n  const shouldErrorMessageShow = errorMessage ? errorMessageId : undefined;\n  const describedBy = spaceDelimitedList([\n    shouldErrorMessageShow,\n    ariaDescribedBy,\n  ]);\n  const labelId = useId();\n\n  const handleChange = (event: ChangeEvent<CheckboxElementType>) => {\n    if (onChange) {\n      onChange(event, isLastItem);\n    }\n  };\n\n  const isControlled = typeof props.selected === \"boolean\";\n\n  return (\n    <Stack gap=\"xs\" className={wrapperClasses}>\n      <label className={labelClasses}>\n        <input\n          aria-describedby={describedBy}\n          aria-errormessage={shouldErrorMessageShow}\n          aria-invalid={isInvalid}\n          aria-labelledby={labelId}\n          readOnly={isReadOnly}\n          disabled={isDisabled}\n          ref={refObj}\n          className={inputClasses}\n          onChange={handleChange}\n          type=\"checkbox\"\n          checked={selected}\n          defaultChecked={isControlled ? undefined : defaultSelected}\n          required={isRequired}\n          id={id || inputId}\n          name={name}\n          value={value}\n          {...rest}\n        />\n        <Icon\n          icon={selected ? squareTick : square}\n          size=\"md\"\n          className={iconClasses}\n        />\n        <span id={labelId} className=\"mobius-checkbox__visible-label\">\n          {label}\n        </span>\n      </label>\n      <ErrorMessage id={errorMessageId} errorMessage={errorMessage} />\n    </Stack>\n  );\n});\n"],"names":["Checkbox","forwardRef","props","ref","id","label","isDisabled","isRequired","validationState","isInvalid","onChange","className","errorMessage","selected","defaultSelected","isReadOnly","isLastItem","name","value","ariaDescribedBy","rest","fallbackRef","useRef","refObj","inputId","useId","validationClasses","useValidationClasses","sharedClasses","classNames","wrapperClasses","labelClasses","inputClasses","iconClasses","errorMessageId","shouldErrorMessageShow","undefined","describedBy","spaceDelimitedList","labelId","handleChange","event","isControlled","Stack","gap","input","aria-describedby","aria-errormessage","aria-invalid","aria-labelledby","readOnly","disabled","type","checked","defaultChecked","required","Icon","icon","squareTick","square","size","span","ErrorMessage"],"mappings":"AAAA;;;;;+BAaaA;;;eAAAA;;;;uBAX0C;+DAChC;uBACY;8BACN;oCAGM;uBACE;sBAChB;uBACC;;;;;;AAEf,MAAMA,yBAGTC,IAAAA,iBAAU,EAAC,CAACC,OAAsBC;IACpC,MAAM,EACJC,EAAE,EACFC,KAAK,EACLC,UAAU,EACVC,UAAU,EACVC,eAAe,EACfC,SAAS,EACTC,QAAQ,EACRC,SAAS,EACTC,YAAY,EACZC,QAAQ,EACRC,kBAAkB,KAAK,EACvBC,UAAU,EACVC,UAAU,EACVC,IAAI,EACJC,KAAK,EACL,CAAC,mBAAmB,EAAEC,eAAe,EACrC,GAAGC,MACJ,GAAGlB;IACJ,MAAMmB,cAAcC,IAAAA,aAAM,EAAmB;IAC7C,MAAMC,SAASpB,OAAOkB;IACtB,MAAMG,UAAUC,IAAAA,YAAK;IACrB,MAAMC,oBAAoBC,IAAAA,2BAAoB,EAAC;QAC7CnB;QACAC;IACF;IACA,MAAMmB,gBAAgBC,IAAAA,eAAU,EAC9B;QACE,iBAAiBvB;QACjB,iBAAiBO;QACjB,iBAAiB,OAAON,eAAe,aAAaA;QACpD,iBAAiB,OAAOA,eAAe,aAAa,CAACA;IACvD,GACAmB;IAEF,sEAAsE;IACtE,MAAMI,iBAAiBD,IAAAA,eAAU,EAC/B,UACA,mBACAD,eACAjB;IAEF,MAAMoB,eAAeF,IAAAA,eAAU,EAAC,0BAA0BD;IAC1D,MAAMI,eAAeH,IAAAA,eAAU,EAAC,0BAA0BD;IAC1D,MAAMK,cAAcJ,IAAAA,eAAU,EAAC,yBAAyBD;IACxD,MAAMM,iBAAiBT,IAAAA,YAAK;IAC5B,MAAMU,yBAAyBvB,eAAesB,iBAAiBE;IAC/D,MAAMC,cAAcC,IAAAA,sCAAkB,EAAC;QACrCH;QACAhB;KACD;IACD,MAAMoB,UAAUd,IAAAA,YAAK;IAErB,MAAMe,eAAe,CAACC;QACpB,IAAI/B,UAAU;YACZA,SAAS+B,OAAOzB;QAClB;IACF;IAEA,MAAM0B,eAAe,OAAOxC,MAAMW,QAAQ,KAAK;IAE/C,qBACE,sBAAC8B,YAAK;QAACC,KAAI;QAAKjC,WAAWmB;;0BACzB,sBAACzB;gBAAMM,WAAWoB;;kCAChB,qBAACc;wBACCC,oBAAkBT;wBAClBU,qBAAmBZ;wBACnBa,gBAAcvC;wBACdwC,mBAAiBV;wBACjBW,UAAUnC;wBACVoC,UAAU7C;wBACVH,KAAKoB;wBACLZ,WAAWqB;wBACXtB,UAAU8B;wBACVY,MAAK;wBACLC,SAASxC;wBACTyC,gBAAgBZ,eAAeN,YAAYtB;wBAC3CyC,UAAUhD;wBACVH,IAAIA,MAAMoB;wBACVP,MAAMA;wBACNC,OAAOA;wBACN,GAAGE,IAAI;;kCAEV,qBAACoC,UAAI;wBACHC,MAAM5C,WAAW6C,iBAAU,GAAGC,aAAM;wBACpCC,MAAK;wBACLjD,WAAWsB;;kCAEb,qBAAC4B;wBAAKzD,IAAImC;wBAAS5B,WAAU;kCAC1BN;;;;0BAGL,qBAACyD,0BAAY;gBAAC1D,IAAI8B;gBAAgBtB,cAAcA;;;;AAGtD"}

package/dist/cjs/components/Checkbox/CheckboxGroup.js

@@ -10,19 +10,20 @@ Object.defineProperty(exports, "CheckboxGroup", {
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
-const _react = require("react");
 const _dedupe = /*#__PURE__*/ _interop_require_default(require("classnames/dedupe"));
-const _Label = require("../Label");
-const _ErrorMessage = require("../ErrorMessage");
-const _spaceDelimitedList = require("../../utils/spaceDelimitedList");
+const _react = require("react");
 const _hooks = require("../../hooks");
+const _spaceDelimitedList = require("../../utils/spaceDelimitedList");
+const _ErrorMessage = require("../ErrorMessage");
+const _Label = require("../Label");
+const _Checkbox = require("./Checkbox");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
     };
 }
 const CheckboxGroup = /*#__PURE__*/ (0, _react.forwardRef)((props, ref)=>{
-    const { label, isDisabled = false, isRequired, validationState, isInvalid, orientation = "vertical", onChange, className, errorMessage, children, defaultValue = [], isReadOnly, itemsPerRow, ...rest } = props;
+    const { label, isDisabled = false, isRequired, validationState, isInvalid, orientation = "vertical", onChange, className, errorMessage, children, defaultValue = [], isReadOnly, itemsPerRow, lastItemDisables = false, ...rest } = props;
     const [selected, setSelected] = (0, _react.useState)(defaultValue);
     const checkboxGroupClasses = (0, _dedupe.default)("mobius", "mobius-checkbox-group", className, {
         "--is-horizontal": orientation === "horizontal",
@@ -44,11 +45,17 @@ const CheckboxGroup = /*#__PURE__*/ (0, _react.forwardRef)((props, ref)=>{
         props["aria-describedby"]
     ]);
     const labelId = (0, _react.useId)();
-    const handleChange = (event)=>{
+    const handleChange = (event, isLastItem = false)=>{
         const { target: { value, checked } } = event;
         if (!checked) {
             setSelected(selected.filter((item)=>item !== value));
         }
+        if (checked && lastItemDisables && isLastItem) {
+            setSelected([
+                value
+            ]);
+            return;
+        }
         if (checked) {
             setSelected([
                 ...selected,
@@ -56,14 +63,21 @@ const CheckboxGroup = /*#__PURE__*/ (0, _react.forwardRef)((props, ref)=>{
             ]);
         }
     };
+    // HACK: This is a workaround to ensure that the onChange event is not
+    //       fired on the initial render.
+    const renderCount = (0, _hooks.useRenderCount)();
     (0, _react.useEffect)(()=>{
-        if (onChange) {
+        if (onChange && renderCount > 1) {
             onChange(selected);
         }
     }, [
         selected,
-        onChange
+        onChange,
+        renderCount
     ]);
+    const childrenArray = _react.Children.toArray(children);
+    const lastCheckbox = childrenArray.filter((child)=>/*#__PURE__*/ (0, _react.isValidElement)(child) && child.type === _Checkbox.Checkbox).pop();
+    const lastCheckboxIsChecked = lastCheckbox && selected.includes(lastCheckbox.props.value);
     return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
         ...rest,
         "aria-labelledby": props["aria-labelledby"] || labelId,
@@ -82,14 +96,18 @@ const CheckboxGroup = /*#__PURE__*/ (0, _react.forwardRef)((props, ref)=>{
             }),
             /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                 className: "mobius-checkbox-group__wrapper",
-                children: _react.Children.map(children, (child)=>{
+                children: childrenArray.map((child)=>{
                     if (/*#__PURE__*/ (0, _react.isValidElement)(child)) {
+                        // lastItemDisables support
+                        const isLastItem = child === lastCheckbox;
+                        const isChildDisabled = isDisabled || lastItemDisables && lastCheckboxIsChecked && !isLastItem;
                         return /*#__PURE__*/ (0, _react.cloneElement)(child, {
-                            isDisabled,
+                            isDisabled: isChildDisabled,
                             isRequired,
                             isReadOnly,
                             isInvalid,
-                            defaultSelected: selected.includes(child.props.value),
+                            isLastItem,
+                            selected: selected.includes(child.props.value),
                             onChange: handleChange,
                             "aria-describedby": describedBy
                         });

package/dist/cjs/components/Checkbox/CheckboxGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Checkbox/CheckboxGroup.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  Children,\n  forwardRef,\n  ReactElement,\n  cloneElement,\n  isValidElement,\n  useId,\n  ChangeEvent,\n  useState,\n  useEffect,\n} from \"react\";\nimport classNames from \"classnames/dedupe\";\nimport { ForwardedRefComponent } from \"../../types/components\";\nimport {\n  CheckboxElementType,\n  CheckboxGroupElementType,\n  CheckboxGroupProps,\n  CheckboxGroupRef,\n} from \"./types\";\nimport { Label } from \"../Label\";\nimport { ErrorMessage } from \"../ErrorMessage\";\nimport { spaceDelimitedList } from \"../../utils/spaceDelimitedList\";\nimport { useValidationClasses } from \"../../hooks\";\n\nexport const CheckboxGroup: ForwardedRefComponent<\n  CheckboxGroupProps,\n  CheckboxGroupElementType\n> = forwardRef((props: CheckboxGroupProps, ref: CheckboxGroupRef) => {\n  const {\n    label,\n    isDisabled = false,\n    isRequired,\n    validationState,\n    isInvalid,\n    orientation = \"vertical\",\n    onChange,\n    className,\n    errorMessage,\n    children,\n    defaultValue = [],\n    isReadOnly,\n    itemsPerRow,\n    ...rest\n  } = props;\n  const [selected, setSelected] = useState<string[]>(defaultValue);\n  const checkboxGroupClasses = classNames(\n    \"mobius\",\n    \"mobius-checkbox-group\",\n    className,\n    {\n      \"--is-horizontal\": orientation === \"horizontal\",\n      \"--is-vertical\": orientation === \"vertical\",\n      \"--is-required\": typeof isRequired === \"boolean\" && isRequired,\n      \"--is-optional\": typeof isRequired === \"boolean\" && !isRequired,\n    },\n  );\n  const validationClasses = useValidationClasses({\n    validationState,\n    isInvalid,\n  });\n  const labelClasses = classNames(\n    {\n      \"--is-disabled\": isDisabled,\n    },\n    validationClasses,\n  );\n  const errorMessageId = useId();\n  const shouldErrorMessageShow = errorMessage ? errorMessageId : undefined;\n  const describedBy = spaceDelimitedList([\n    shouldErrorMessageShow,\n    props[\"aria-describedby\"],\n  ]);\n  const labelId = useId();\n\n  const handleChange = (event: ChangeEvent<CheckboxElementType>) => {\n    const {\n      target: { value, checked },\n    } = event;\n\n    if (!checked) {\n      setSelected(selected.filter(item => item !== value));\n    }\n\n    if (checked) {\n      setSelected([...selected, value]);\n    }\n  };\n\n  useEffect(() => {\n    if (onChange) {\n      onChange(selected);\n    }\n  }, [selected, onChange]);\n\n  return (\n    <div\n      {...rest}\n      aria-labelledby={props[\"aria-labelledby\"] || labelId}\n      ref={ref}\n      className={checkboxGroupClasses}\n      role=\"group\"\n      style={\n        {\n          \"--checkbox-items-per-row\": itemsPerRow || Children.count(children),\n        } as React.CSSProperties\n      }\n    >\n      {label && (\n        <Label elementType=\"span\" id={labelId} className={labelClasses}>\n          {label}\n        </Label>\n      )}\n      <div className=\"mobius-checkbox-group__wrapper\">\n        {Children.map(children, child => {\n          if (isValidElement(child)) {\n            return cloneElement(child as ReactElement, {\n              isDisabled,\n              isRequired,\n              isReadOnly,\n              isInvalid,\n              defaultSelected: selected.includes(child.props.value),\n              onChange: handleChange,\n              \"aria-describedby\": describedBy,\n            });\n          }\n\n          return child;\n        })}\n      </div>\n      {errorMessage && (\n        <ErrorMessage id={errorMessageId} errorMessage={errorMessage} />\n      )}\n    </div>\n  );\n});\n"],"names":["CheckboxGroup","forwardRef","props","ref","label","isDisabled","isRequired","validationState","isInvalid","orientation","onChange","className","errorMessage","children","defaultValue","isReadOnly","itemsPerRow","rest","selected","setSelected","useState","checkboxGroupClasses","classNames","validationClasses","useValidationClasses","labelClasses","errorMessageId","useId","shouldErrorMessageShow","undefined","describedBy","spaceDelimitedList","labelId","handleChange","event","target","value","checked","filter","item","useEffect","div","aria-labelledby","role","style","Children","count","Label","elementType","id","map","child","isValidElement","cloneElement","defaultSelected","includes","ErrorMessage"],"mappings":"AAAA;;;;;+BA0BaA;;;eAAAA;;;;uBAdN;+DACgB;uBAQD;8BACO;oCACM;uBACE;;;;;;AAE9B,MAAMA,8BAGTC,IAAAA,iBAAU,EAAC,CAACC,OAA2BC;IACzC,MAAM,EACJC,KAAK,EACLC,aAAa,KAAK,EAClBC,UAAU,EACVC,eAAe,EACfC,SAAS,EACTC,cAAc,UAAU,EACxBC,QAAQ,EACRC,SAAS,EACTC,YAAY,EACZC,QAAQ,EACRC,eAAe,EAAE,EACjBC,UAAU,EACVC,WAAW,EACX,GAAGC,MACJ,GAAGf;IACJ,MAAM,CAACgB,UAAUC,YAAY,GAAGC,IAAAA,eAAQ,EAAWN;IACnD,MAAMO,uBAAuBC,IAAAA,eAAU,EACrC,UACA,yBACAX,WACA;QACE,mBAAmBF,gBAAgB;QACnC,iBAAiBA,gBAAgB;QACjC,iBAAiB,OAAOH,eAAe,aAAaA;QACpD,iBAAiB,OAAOA,eAAe,aAAa,CAACA;IACvD;IAEF,MAAMiB,oBAAoBC,IAAAA,2BAAoB,EAAC;QAC7CjB;QACAC;IACF;IACA,MAAMiB,eAAeH,IAAAA,eAAU,EAC7B;QACE,iBAAiBjB;IACnB,GACAkB;IAEF,MAAMG,iBAAiBC,IAAAA,YAAK;IAC5B,MAAMC,yBAAyBhB,eAAec,iBAAiBG;IAC/D,MAAMC,cAAcC,IAAAA,sCAAkB,EAAC;QACrCH;QACA1B,KAAK,CAAC,mBAAmB;KAC1B;IACD,MAAM8B,UAAUL,IAAAA,YAAK;IAErB,MAAMM,eAAe,CAACC;QACpB,MAAM,EACJC,QAAQ,EAAEC,KAAK,EAAEC,OAAO,EAAE,EAC3B,GAAGH;QAEJ,IAAI,CAACG,SAAS;YACZlB,YAAYD,SAASoB,MAAM,CAACC,CAAAA,OAAQA,SAASH;QAC/C;QAEA,IAAIC,SAAS;YACXlB,YAAY;mBAAID;gBAAUkB;aAAM;QAClC;IACF;IAEAI,IAAAA,gBAAS,EAAC;QACR,IAAI9B,UAAU;YACZA,SAASQ;QACX;IACF,GAAG;QAACA;QAAUR;KAAS;IAEvB,qBACE,sBAAC+B;QACE,GAAGxB,IAAI;QACRyB,mBAAiBxC,KAAK,CAAC,kBAAkB,IAAI8B;QAC7C7B,KAAKA;QACLQ,WAAWU;QACXsB,MAAK;QACLC,OACE;YACE,4BAA4B5B,eAAe6B,eAAQ,CAACC,KAAK,CAACjC;QAC5D;;YAGDT,uBACC,qBAAC2C,YAAK;gBAACC,aAAY;gBAAOC,IAAIjB;gBAASrB,WAAWc;0BAC/CrB;;0BAGL,qBAACqC;gBAAI9B,WAAU;0BACZkC,eAAQ,CAACK,GAAG,CAACrC,UAAUsC,CAAAA;oBACtB,kBAAIC,IAAAA,qBAAc,EAACD,QAAQ;wBACzB,qBAAOE,IAAAA,mBAAY,EAACF,OAAuB;4BACzC9C;4BACAC;4BACAS;4BACAP;4BACA8C,iBAAiBpC,SAASqC,QAAQ,CAACJ,MAAMjD,KAAK,CAACkC,KAAK;4BACpD1B,UAAUuB;4BACV,oBAAoBH;wBACtB;oBACF;oBAEA,OAAOqB;gBACT;;YAEDvC,8BACC,qBAAC4C,0BAAY;gBAACP,IAAIvB;gBAAgBd,cAAcA;;;;AAIxD"}
+{"version":3,"sources":["../../../../src/components/Checkbox/CheckboxGroup.tsx"],"sourcesContent":["\"use client\";\n\nimport classNames from \"classnames/dedupe\";\nimport {\n  type ChangeEvent,\n  type ReactElement,\n  Children,\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  useEffect,\n  useId,\n  useState,\n} from \"react\";\nimport { useRenderCount, useValidationClasses } from \"../../hooks\";\nimport { ForwardedRefComponent } from \"../../types/components\";\nimport { spaceDelimitedList } from \"../../utils/spaceDelimitedList\";\nimport { ErrorMessage } from \"../ErrorMessage\";\nimport { Label } from \"../Label\";\nimport { Checkbox } from \"./Checkbox\";\nimport {\n  CheckboxElementType,\n  CheckboxGroupElementType,\n  CheckboxGroupProps,\n  CheckboxGroupRef,\n} from \"./types\";\n\nexport const CheckboxGroup: ForwardedRefComponent<\n  CheckboxGroupProps,\n  CheckboxGroupElementType\n> = forwardRef((props: CheckboxGroupProps, ref: CheckboxGroupRef) => {\n  const {\n    label,\n    isDisabled = false,\n    isRequired,\n    validationState,\n    isInvalid,\n    orientation = \"vertical\",\n    onChange,\n    className,\n    errorMessage,\n    children,\n    defaultValue = [],\n    isReadOnly,\n    itemsPerRow,\n    lastItemDisables = false,\n    ...rest\n  } = props;\n  const [selected, setSelected] = useState<string[]>(defaultValue);\n  const checkboxGroupClasses = classNames(\n    \"mobius\",\n    \"mobius-checkbox-group\",\n    className,\n    {\n      \"--is-horizontal\": orientation === \"horizontal\",\n      \"--is-vertical\": orientation === \"vertical\",\n      \"--is-required\": typeof isRequired === \"boolean\" && isRequired,\n      \"--is-optional\": typeof isRequired === \"boolean\" && !isRequired,\n    },\n  );\n  const validationClasses = useValidationClasses({\n    validationState,\n    isInvalid,\n  });\n  const labelClasses = classNames(\n    {\n      \"--is-disabled\": isDisabled,\n    },\n    validationClasses,\n  );\n  const errorMessageId = useId();\n  const shouldErrorMessageShow = errorMessage ? errorMessageId : undefined;\n  const describedBy = spaceDelimitedList([\n    shouldErrorMessageShow,\n    props[\"aria-describedby\"],\n  ]);\n  const labelId = useId();\n\n  const handleChange = (\n    event: ChangeEvent<CheckboxElementType>,\n    isLastItem = false,\n  ) => {\n    const {\n      target: { value, checked },\n    } = event;\n\n    if (!checked) {\n      setSelected(selected.filter(item => item !== value));\n    }\n\n    if (checked && lastItemDisables && isLastItem) {\n      setSelected([value]);\n      return;\n    }\n\n    if (checked) {\n      setSelected([...selected, value]);\n    }\n  };\n\n  // HACK: This is a workaround to ensure that the onChange event is not\n  //       fired on the initial render.\n  const renderCount = useRenderCount();\n  useEffect(() => {\n    if (onChange && renderCount > 1) {\n      onChange(selected);\n    }\n  }, [selected, onChange, renderCount]);\n\n  const childrenArray = Children.toArray(children);\n  const lastCheckbox = childrenArray\n    .filter(\n      child =>\n        isValidElement(child) && (child as ReactElement).type === Checkbox,\n    )\n    .pop() as ReactElement<CheckboxElementType> | undefined;\n  const lastCheckboxIsChecked =\n    lastCheckbox && selected.includes(lastCheckbox.props.value);\n\n  return (\n    <div\n      {...rest}\n      aria-labelledby={props[\"aria-labelledby\"] || labelId}\n      ref={ref}\n      className={checkboxGroupClasses}\n      role=\"group\"\n      style={\n        {\n          \"--checkbox-items-per-row\": itemsPerRow || Children.count(children),\n        } as React.CSSProperties\n      }\n    >\n      {label && (\n        <Label elementType=\"span\" id={labelId} className={labelClasses}>\n          {label}\n        </Label>\n      )}\n      <div className=\"mobius-checkbox-group__wrapper\">\n        {childrenArray.map(child => {\n          if (isValidElement(child)) {\n            // lastItemDisables support\n            const isLastItem = child === lastCheckbox;\n            const isChildDisabled =\n              isDisabled ||\n              (lastItemDisables && lastCheckboxIsChecked && !isLastItem);\n\n            return cloneElement(child as ReactElement, {\n              isDisabled: isChildDisabled,\n              isRequired,\n              isReadOnly,\n              isInvalid,\n              isLastItem,\n              selected: selected.includes(child.props.value),\n              onChange: handleChange,\n              \"aria-describedby\": describedBy,\n            });\n          }\n\n          return child;\n        })}\n      </div>\n      {errorMessage && (\n        <ErrorMessage id={errorMessageId} errorMessage={errorMessage} />\n      )}\n    </div>\n  );\n});\n"],"names":["CheckboxGroup","forwardRef","props","ref","label","isDisabled","isRequired","validationState","isInvalid","orientation","onChange","className","errorMessage","children","defaultValue","isReadOnly","itemsPerRow","lastItemDisables","rest","selected","setSelected","useState","checkboxGroupClasses","classNames","validationClasses","useValidationClasses","labelClasses","errorMessageId","useId","shouldErrorMessageShow","undefined","describedBy","spaceDelimitedList","labelId","handleChange","event","isLastItem","target","value","checked","filter","item","renderCount","useRenderCount","useEffect","childrenArray","Children","toArray","lastCheckbox","child","isValidElement","type","Checkbox","pop","lastCheckboxIsChecked","includes","div","aria-labelledby","role","style","count","Label","elementType","id","map","isChildDisabled","cloneElement","ErrorMessage"],"mappings":"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"}

package/dist/cjs/hooks/index.js

@@ -11,6 +11,7 @@ _export_star(require("./useDialogPolyfill"), exports);
 _export_star(require("./useLabel"), exports);
 _export_star(require("./useOnClickOutside"), exports);
 _export_star(require("./usePrefersReducedMotion"), exports);
+_export_star(require("./useRenderCount"), exports);
 _export_star(require("./useTextField"), exports);
 _export_star(require("./useValidationClasses"), exports);
 _export_star(require("./useWindowEvent"), exports);

package/dist/cjs/hooks/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/hooks/index.tsx"],"sourcesContent":["export * from \"./useBodyScrollLock\";\nexport * from \"./useBreakpoint\";\nexport * from \"./useButton\";\nexport * from \"./useDeprecationWarning\";\nexport * from \"./useDialog\";\nexport * from \"./useDialogPolyfill\";\nexport * from \"./useLabel\";\nexport * from \"./useOnClickOutside\";\nexport * from \"./usePrefersReducedMotion\";\nexport * from \"./useTextField\";\nexport * from \"./useValidationClasses\";\nexport * from \"./useWindowEvent\";\n"],"names":[],"mappings":";;;;qBAAc;qBACA;qBACA;qBACA;qBACA;qBACA;qBACA;qBACA;qBACA;qBACA;qBACA;qBACA"}
+{"version":3,"sources":["../../../src/hooks/index.tsx"],"sourcesContent":["export * from \"./useBodyScrollLock\";\nexport * from \"./useBreakpoint\";\nexport * from \"./useButton\";\nexport * from \"./useDeprecationWarning\";\nexport * from \"./useDialog\";\nexport * from \"./useDialogPolyfill\";\nexport * from \"./useLabel\";\nexport * from \"./useOnClickOutside\";\nexport * from \"./usePrefersReducedMotion\";\nexport * from \"./useRenderCount\";\nexport * from \"./useTextField\";\nexport * from \"./useValidationClasses\";\nexport * from \"./useWindowEvent\";\n"],"names":[],"mappings":";;;;qBAAc;qBACA;qBACA;qBACA;qBACA;qBACA;qBACA;qBACA;qBACA;qBACA;qBACA;qBACA;qBACA"}

package/dist/cjs/hooks/useRenderCount/index.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+_export_star(require("./useRenderCount"), exports);
+function _export_star(from, to) {
+    Object.keys(from).forEach(function(k) {
+        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
+            Object.defineProperty(to, k, {
+                enumerable: true,
+                get: function() {
+                    return from[k];
+                }
+            });
+        }
+    });
+    return from;
+}
+
+//# sourceMappingURL=index.js.map

package/dist/cjs/hooks/useRenderCount/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/hooks/useRenderCount/index.ts"],"sourcesContent":["export * from \"./useRenderCount\";\n"],"names":[],"mappings":";;;;qBAAc"}

package/dist/cjs/hooks/useRenderCount/useRenderCount.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useRenderCount", {
+    enumerable: true,
+    get: function() {
+        return useRenderCount;
+    }
+});
+const _react = require("react");
+function useRenderCount() {
+    const count = (0, _react.useRef)(1);
+    (0, _react.useEffect)(()=>{
+        count.current += 1;
+    });
+    return count.current;
+}
+
+//# sourceMappingURL=useRenderCount.js.map

package/dist/cjs/hooks/useRenderCount/useRenderCount.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/hooks/useRenderCount/useRenderCount.ts"],"sourcesContent":["import { useEffect, useRef } from \"react\";\n\nexport function useRenderCount() {\n  const count = useRef(1);\n  useEffect(() => {\n    count.current += 1;\n  });\n  return count.current;\n}\n"],"names":["useRenderCount","count","useRef","useEffect","current"],"mappings":";;;;+BAEgBA;;;eAAAA;;;uBAFkB;AAE3B,SAASA;IACd,MAAMC,QAAQC,IAAAA,aAAM,EAAC;IACrBC,IAAAA,gBAAS,EAAC;QACRF,MAAMG,OAAO,IAAI;IACnB;IACA,OAAOH,MAAMG,OAAO;AACtB"}