@bspk/ui 1.3.20 → 1.3.22

package/dist/components/TimePicker/TimePicker.d.ts

@@ -9,17 +9,19 @@ export type TimePickerProps = FieldControlProps & Pick<InputProps, 'size'>;
  * For a more complete example with field usage, see the TimePickerField component.
  *
  * @example
- *     import { TimePicker } from '@bspk/ui/TimePicker';
+ *     import { TimePicker } from '-/components/TimePicker';
  *
  *     () => {
  *         const [value, onChange] = useState<string | undefined>('');
  *
  *         return (
  *             <div style={{ width: 320 }}>
- *                 <Field>
- *                     <FieldLabel>Time</FieldLabel>
- *                     <TimePicker name="time" onChange={onChange} value={value} />
- *                     <FieldDescription>The time picker allows you to select a time.</FieldDescription>
+ *                 <Field
+ *                     controlId="destination-time"
+ *                     helperText="The time picker allows you to select a time."
+ *                     label="Time"
+ *                 >
+ *                     <TimePicker id="destination-time" name="time" onChange={onChange} value={value} />
  *                 </Field>
  *             </div>
  *         );
@@ -28,5 +30,5 @@ export type TimePickerProps = FieldControlProps & Pick<InputProps, 'size'>;
  * @name TimePicker
  * @phase Stable
  */
-export declare function TimePicker({ value, disabled, id: idProp, invalid: invalidProp, readOnly, name, size, required, onChange: onChangeProp, 'aria-label': ariaLabel, ...props }: ElementProps<TimePickerProps, 'div'>): import("react/jsx-runtime").JSX.Element;
+export declare function TimePicker({ value, disabled, id: idProp, invalid, readOnly, name, size, onChange: onChangeProp, 'aria-label': ariaLabel, 'aria-describedby': ariaDescribedBy, 'aria-errormessage': ariaErrorMessage, ...props }: ElementProps<TimePickerProps, 'div'>): import("react/jsx-runtime").JSX.Element;
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/TimePicker/TimePicker.js

@@ -7,10 +7,10 @@ import { TimePickerListbox } from './Listbox';
 import { TimePickerSegment } from './Segment';
 import { HOUR_OPTIONS, MINUTE_OPTIONS, MERIDIEM_OPTIONS, partsToStringValue, stringValueToParts, } from './utils';
 import { Button } from '../Button';
-import { useFieldInit } from '../Field';
 import { Menu } from '../Menu';
 import { Portal } from '../Portal';
 import { useFloating } from '../../hooks/useFloating';
+import { useId } from '../../hooks/useId';
 import { useOutsideClick } from '../../hooks/useOutsideClick';
 import { handleKeyDown } from '../../utils/handleKeyDown';
 /**
@@ -20,17 +20,19 @@ import { handleKeyDown } from '../../utils/handleKeyDown';
  * For a more complete example with field usage, see the TimePickerField component.
  *
  * @example
- *     import { TimePicker } from '@bspk/ui/TimePicker';
+ *     import { TimePicker } from '.';
  *
  *     () => {
  *         const [value, onChange] = useState<string | undefined>('');
  *
  *         return (
  *             <div style={{ width: 320 }}>
- *                 <Field>
- *                     <FieldLabel>Time</FieldLabel>
- *                     <TimePicker name="time" onChange={onChange} value={value} />
- *                     <FieldDescription>The time picker allows you to select a time.</FieldDescription>
+ *                 <Field
+ *                     controlId="destination-time"
+ *                     helperText="The time picker allows you to select a time."
+ *                     label="Time"
+ *                 >
+ *                     <TimePicker id="destination-time" name="time" onChange={onChange} value={value} />
  *                 </Field>
  *             </div>
  *         );
@@ -39,14 +41,8 @@ import { handleKeyDown } from '../../utils/handleKeyDown';
  * @name TimePicker
  * @phase Stable
  */
-export function TimePicker({ value, disabled, id: idProp, invalid: invalidProp, readOnly, name, size, required = false, onChange: onChangeProp, 'aria-label': ariaLabel = 'Time picker', ...props }) {
-    const { id, ariaDescribedBy, ariaErrorMessage, invalid } = useFieldInit({
-        idProp,
-        required,
-        disabled,
-        readOnly,
-        invalidProp,
-    });
+export function TimePicker({ value, disabled, id: idProp, invalid = false, readOnly, name, size, onChange: onChangeProp, 'aria-label': ariaLabel = 'Time picker', 'aria-describedby': ariaDescribedBy, 'aria-errormessage': ariaErrorMessage, ...props }) {
+    const id = useId(idProp);
     const menuId = `${id}-time-picker-menu`;
     const { hours, minutes, meridiem } = useMemo(() => stringValueToParts(value || '00:00'), [value]);
     const setValue = useCallback((params) => {

package/dist/components/TimePicker/TimePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimePicker.js","sourceRoot":"","sources":["../../../src/components/TimePicker/TimePicker.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"TimePicker.js","sourceRoot":"","sources":["../../../src/components/TimePicker/TimePicker.tsx"],"names":[],"mappings":"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"}

package/dist/components/TimePicker/TimePickerExample.js

@@ -1,7 +1,7 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { useState } from 'react';
 import { TimePicker } from './TimePicker';
-import { Field, FieldLabel, FieldDescription } from '../Field';
+import { Field } from '../Field';
 export const TimePickerExample = {
     variants: false,
     defaultState: {
@@ -12,6 +12,6 @@ export const TimePickerExample = {
 };
 export const Usage = () => {
     const [value, onChange] = useState('');
-    return (_jsx("div", { style: { width: 320 }, children: _jsxs(Field, { children: [_jsx(FieldLabel, { children: "Time" }), _jsx(TimePicker, { name: "time", onChange: onChange, value: value }), _jsx(FieldDescription, { children: "The time picker allows you to select a time." })] }) }));
+    return (_jsx("div", { style: { width: 320 }, children: _jsx(Field, { controlId: "destination-time", helperText: "The time picker allows you to select a time.", label: "Time", children: _jsx(TimePicker, { id: "destination-time", name: "time", onChange: onChange, value: value }) }) }));
 };
 //# sourceMappingURL=TimePickerExample.js.map

package/dist/components/TimePicker/TimePickerExample.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimePickerExample.js","sourceRoot":"","sources":["../../../src/components/TimePicker/TimePickerExample.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,UAAU,EAAmB,MAAM,cAAc,CAAC;AAC3D,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAGzE,MAAM,CAAC,MAAM,iBAAiB,GAAsC;IAChE,QAAQ,EAAE,KAAK;IACf,YAAY,EAAE;QACV,YAAY,EAAE,wBAAwB;KACzC;IACD,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,KAAC,SAAS,OAAK,KAAK,GAAI;IAC1D,cAAc,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,OAAO,EAAE,CAAC,EAAE;CAC7C,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,EAAE;IACtB,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAqB,EAAE,CAAC,CAAC;IAE3D,OAAO,CACH,cAAK,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,YACtB,MAAC,KAAK,eACF,KAAC,UAAU,uBAAkB,EAC7B,KAAC,UAAU,IAAC,IAAI,EAAC,MAAM,EAAC,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,GAAI,EAC5D,KAAC,gBAAgB,+DAAgE,IAC7E,GACN,CACT,CAAC;AACN,CAAC,CAAC"}
+{"version":3,"file":"TimePickerExample.js","sourceRoot":"","sources":["../../../src/components/TimePicker/TimePickerExample.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,UAAU,EAAmB,MAAM,cAAc,CAAC;AAC3D,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAG3C,MAAM,CAAC,MAAM,iBAAiB,GAAsC;IAChE,QAAQ,EAAE,KAAK;IACf,YAAY,EAAE;QACV,YAAY,EAAE,wBAAwB;KACzC;IACD,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,KAAC,SAAS,OAAK,KAAK,GAAI;IAC1D,cAAc,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,OAAO,EAAE,CAAC,EAAE;CAC7C,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,EAAE;IACtB,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAqB,EAAE,CAAC,CAAC;IAE3D,OAAO,CACH,cAAK,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,YACtB,KAAC,KAAK,IAAC,SAAS,EAAC,kBAAkB,EAAC,UAAU,EAAC,8CAA8C,EAAC,KAAK,EAAC,MAAM,YACtG,KAAC,UAAU,IAAC,EAAE,EAAC,kBAAkB,EAAC,IAAI,EAAC,MAAM,EAAC,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,GAAI,GAC9E,GACN,CACT,CAAC;AACN,CAAC,CAAC"}

package/dist/components/TimePickerField/TimePickerField.d.ts

@@ -1,15 +1,15 @@
-import { FormFieldControlProps } from '-/components/FormField';
+import { FieldControlProps } from '-/components/Field';
 import { TimePickerProps } from '-/components/TimePicker';
-export type TimePickerFieldProps = FormFieldControlProps<TimePickerProps>;
+export type TimePickerFieldProps = FieldControlProps<TimePickerProps>;
 /**
  * A field wrapper for the TimePicker component.
  *
  * This component takes properties from the FormField and TimePicker components.
  *
  * @name TimePickerField
- * @phase Stable
+ * @phase UXReview
  *
  * @generated
  */
-export declare function TimePickerField({ label, helperText, labelTrailing, errorMessage, style, ...controlProps }: TimePickerFieldProps): import("react/jsx-runtime").JSX.Element;
+export declare function TimePickerField({ label, helperText, labelTrailing, errorMessage, style, id: idProp, ...controlProps }: TimePickerFieldProps): import("react/jsx-runtime").JSX.Element;
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/TimePickerField/TimePickerField.js

@@ -1,17 +1,19 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { FormField } from '../FormField';
+import { Field, propsWithAria } from '../Field';
 import { TimePicker } from '../TimePicker';
+import { useId } from '../../hooks/useId';
 /**
  * A field wrapper for the TimePicker component.
  *
  * This component takes properties from the FormField and TimePicker components.
  *
  * @name TimePickerField
- * @phase Stable
+ * @phase UXReview
  *
  * @generated
  */
-export function TimePickerField({ label, helperText, labelTrailing, errorMessage, style, ...controlProps }) {
-    return (_jsx(FormField, { errorMessage: errorMessage, helperText: helperText, label: label, labelTrailing: labelTrailing, style: style, children: _jsx(TimePicker, { ...controlProps }) }));
+export function TimePickerField({ label, helperText, labelTrailing, errorMessage, style, id: idProp, ...controlProps }) {
+    const id = useId(idProp);
+    return (_jsx(Field, { controlId: id, errorMessage: errorMessage, helperText: helperText, label: label, labelTrailing: labelTrailing, style: style, children: _jsx(TimePicker, { ...propsWithAria({ id, controlProps, errorMessage, helperText }) }) }));
 }
 //# sourceMappingURL=TimePickerField.js.map

package/dist/components/TimePickerField/TimePickerField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimePickerField.js","sourceRoot":"","sources":["../../../src/components/TimePickerField/TimePickerField.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAyB,MAAM,wBAAwB,CAAC;AAC1E,OAAO,EAAE,UAAU,EAAmB,MAAM,yBAAyB,CAAC;AAItE;;;;;;;;;GASG;AACH,MAAM,UAAU,eAAe,CAAC,EAC5B,KAAK,EACL,UAAU,EACV,aAAa,EACb,YAAY,EACZ,KAAK,EACL,GAAG,YAAY,EACI;IACnB,OAAO,CACH,KAAC,SAAS,IACN,YAAY,EAAE,YAAY,EAC1B,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,aAAa,EAC5B,KAAK,EAAE,KAAK,YAEZ,KAAC,UAAU,OAAK,YAAY,GAAI,GACxB,CACf,CAAC;AACN,CAAC"}
+{"version":3,"file":"TimePickerField.js","sourceRoot":"","sources":["../../../src/components/TimePickerField/TimePickerField.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAqB,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAC7E,OAAO,EAAE,UAAU,EAAmB,MAAM,yBAAyB,CAAC;AACtE,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAItC;;;;;;;;;GASG;AACH,MAAM,UAAU,eAAe,CAAC,EAC5B,KAAK,EACL,UAAU,EACV,aAAa,EACb,YAAY,EACZ,KAAK,EACL,EAAE,EAAE,MAAM,EACV,GAAG,YAAY,EACI;IACnB,MAAM,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC;IACzB,OAAO,CACH,KAAC,KAAK,IACF,SAAS,EAAE,EAAE,EACb,YAAY,EAAE,YAAY,EAC1B,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,aAAa,EAC5B,KAAK,EAAE,KAAK,YAEZ,KAAC,UAAU,OAAK,aAAa,CAAC,EAAE,EAAE,EAAE,YAAY,EAAE,YAAY,EAAE,UAAU,EAAE,CAAC,GAAI,GAC7E,CACX,CAAC;AACN,CAAC"}

package/dist/types/common.d.ts

@@ -133,6 +133,8 @@ export type FieldControlProps<ValueType = string, ChangeContext = ChangeEvent<HT
      * @required
      */
     onChange: (next: ValueType | undefined, event?: ChangeContext) => void;
+    'aria-describedby'?: string;
+    'aria-errormessage'?: string;
 };
 export type Brand = 'anywhere' | 'better-homes-gardens' | 'cartus' | 'century-21' | 'coldwell-banker' | 'corcoran' | 'denali-boss' | 'era' | 'sothebys';
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/types/common.js.map

@@ -1 +1 @@
-{"version":3,"file":"common.js","sourceRoot":"","sources":["../../src/types/common.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;;AA6KH,sDAAsD"}
+{"version":3,"file":"common.js","sourceRoot":"","sources":["../../src/types/common.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;;AAqLH,sDAAsD"}

package/dist/utils/demo.js

@@ -27,7 +27,7 @@ export function componentToString(componentName, propState, propsMeta) {
         }
         else if (Array.isArray(value)) {
             return ` ${key}={[${value
-                .map((item) => (isValidElement(item) ? convertReactToCodeString(item) : '...')) // Simplified for brevity
+                .map((item) => (isValidElement(item) ? convertReactToCodeString(item) : item))
                 .join(', ')}]}`;
         }
         else if (typeof value === 'object') {

package/dist/utils/demo.js.map

@@ -1 +1 @@
-{"version":3,"file":"demo.js","sourceRoot":"","sources":["../../src/utils/demo.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"demo.js","sourceRoot":"","sources":["../../src/utils/demo.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@bspk/ui",
-    "version": "1.3.20",
+    "version": "1.3.22",
     "license": "CC-BY-4.0",
     "type": "module",
     "files": [
@@ -40,7 +40,8 @@
         "newc": "tsx .scripts/tasks/new-component.ts",
         "create:tests": "tsx .scripts/tasks/create-tests.ts",
         "clean": "tsx .scripts/clean.ts",
-        "pr-check": "npx tsx .scripts/tasks/lint-components.ts && npm run lint && npm run lint:css && npx tsx .scripts/check-css-vars.ts && npm run build && npm run test"
+        "pr-check": "npx tsx .scripts/tasks/lint-components.ts && npm run lint && npm run lint:css && npx tsx .scripts/check-css-vars.ts && npm run build && npm run test",
+        "pr": "npm run pr-check && git push --set-upstream origin origin $(git symbolic-ref --short HEAD) && open \"https://github.com/Anywhererealestate/bspk-ui/compare/dev...$(git symbolic-ref --short HEAD)\""
     },
     "static-exports": {
         "./*": "./dist/*.js"
@@ -107,8 +108,6 @@
         "./FileUploadItem/*": "./dist/components/FileUploadItem/*.js",
         "./Flex": "./dist/components/Flex/index.js",
         "./Flex/*": "./dist/components/Flex/*.js",
-        "./FormField": "./dist/components/FormField/index.js",
-        "./FormField/*": "./dist/components/FormField/*.js",
         "./Grid": "./dist/components/Grid/index.js",
         "./Grid/*": "./dist/components/Grid/*.js",
         "./Img": "./dist/components/Img/index.js",

package/src/components/Accordion/Accordion.tsx

@@ -130,7 +130,7 @@ export function Accordion({ items: itemsProp, singleOpen = true }: AccordionProp
             {items.map(({ children, title, subtitle: subtitle, leading, trailing, disabled, id }, index) => {
                 const isOpen = openSections.includes(id);
                 return (
-                    <section data-disabled={disabled || undefined} id={id} key={id || index}>
+                    <section data-bspk="accordion-item" data-disabled={disabled || undefined} id={id} key={id || index}>
                         <button
                             aria-controls={`${id}-content`}
                             aria-expanded={isOpen}
@@ -147,7 +147,7 @@ export function Accordion({ items: itemsProp, singleOpen = true }: AccordionProp
                             <span data-arrow>{isOpen ? <SvgKeyboardArrowUp /> : <SvgKeyboardArrowDown />}</span>
                         </button>
                         {isOpen && (
-                            <div data-content data-hidden={!isOpen || undefined} id={`${id}-content`}>
+                            <div data-content id={`${id}-content`}>
                                 {children}
                             </div>
                         )}

package/src/components/Accordion/accordion.scss

@@ -1,8 +1,13 @@
 [data-bspk='accordion'] {
+    display: block;
     width: 100%;
     padding: var(--spacing-sizing-02);
 
-    > section {
+    &:empty {
+        display: none;
+    }
+
+    > [data-bspk='accordion-item'] {
         --border-bottom-color: var(--stroke-neutral-base);
 
         display: flex;
@@ -54,6 +59,10 @@
                 align-items: center;
                 justify-content: center;
                 margin-left: var(--spacing-sizing-02);
+
+                svg {
+                    width: var(--spacing-sizing-06);
+                }
             }
 
             &:not(:disabled) {

package/src/components/BottomNavigation/BottomNavigation.tsx

@@ -21,7 +21,6 @@ export type BottomNavigationProps = Pick<TabListProps, 'label' | 'onChange' | 'o
  *
  * @example
  *     import { BottomNavigation } from '@bspk/ui/BottomNavigation';
- *     import { useState } from 'react';
  *
  *     () => {
  *         const [value, setValue] = useState<string>('1');

package/src/components/BottomNavigation/bottom-navigation.scss

@@ -27,6 +27,7 @@ ul[data-bspk-utility='tab-list'][data-bspk='bottom-navigation'] {
         &[data-pseudo='focus'] > &,
         &:focus-visible {
             outline: solid 2px var(--stroke-neutral-focus);
+            isolation: isolate;
         }
 
         &[aria-selected='true'] {

package/src/components/Button/button.scss

@@ -1,4 +1,5 @@
 [data-bspk='button'] {
+    display: flex;
     flex-direction: row;
     gap: var(--spacing-sizing-02);
     border: none;
@@ -137,6 +138,7 @@
             [data-pseudo='focus'] > &,
             &:focus-visible {
                 outline: solid 2px var(--stroke-neutral-focus);
+                isolation: isolate;
             }
         }
 
@@ -173,6 +175,7 @@
             [data-pseudo='focus'] > &,
             &:focus-visible {
                 outline: solid 2px var(--stroke-neutral-focus);
+                isolation: isolate;
             }
         }
 
@@ -207,6 +210,7 @@
             [data-pseudo='focus'] > &,
             &:focus-visible {
                 outline: solid 2px var(--stroke-neutral-focus);
+                isolation: isolate;
             }
         }
 

package/src/components/Checkbox/Checkbox.tsx

@@ -64,14 +64,14 @@ export type CheckboxProps = Omit<FieldControlProps, 'onChange' | 'readOnly' | 'v
  */
 export function Checkbox({
     checked: checkedProp = false,
-    indeterminate: indeterminateProp,
+    indeterminate: indeterminateProp = false,
     invalid,
     disabled,
     required,
     ...props
 }: ElementProps<CheckboxProps, 'input'>) {
+    const checked = !!checkedProp;
     const indeterminate = !!indeterminateProp;
-    const checked = !!checkedProp && !indeterminate;
 
     const inputRef = useRef<HTMLInputElement>();
 
@@ -100,7 +100,7 @@ export function Checkbox({
                 type="checkbox"
             />
             <span aria-hidden>
-                {checked && (
+                {checked && !indeterminate && (
                     <svg data-checked fill="none" viewBox="0 0 14 11" xmlns="http://www.w3.org/2000/svg">
                         <path
                             d="M5.485 10.182a1 1 0 0 1-1.414 0l-3.03-3.03a1 1 0 0 1 0-1.415l.14-.141a1 1 0 0 1 1.415 0l2.182 2.182 6.626-6.627a1 1 0 0 1 1.414 0l.142.142a1 1 0 0 1 0 1.414l-7.475 7.475Z"

package/src/components/CheckboxGroup/CheckboxGroup.tsx

@@ -1,13 +1,11 @@
 import './checkbox-group.scss';
-import { Checkbox, CheckboxProps } from '-/components/Checkbox';
-import { useFieldInit } from '-/components/Field';
-import { ToggleOptionProps, ToggleOption } from '-/components/ToggleOption';
+import { CheckboxOption, CheckboxOptionProps } from '-/components/CheckboxOption';
+import { useId } from '-/hooks/useId';
 import { ElementProps, FieldControlProps } from '-/types/common';
 
 const ALL_LABEL = 'All';
 
-export type CheckboxGroupOption = Pick<CheckboxProps, 'value'> &
-    Pick<ToggleOptionProps, 'description' | 'disabled' | 'label'>;
+export type CheckboxGroupOption = Omit<CheckboxOptionProps, 'name' | 'onChange'>;
 
 export type CheckboxGroupProps = Omit<FieldControlProps<string[]>, 'readOnly'> & {
     /**
@@ -31,7 +29,7 @@ export type CheckboxGroupProps = Omit<FieldControlProps<string[]>, 'readOnly'> &
      */
     selectAll?: boolean;
     /** The props for the select all checkbox. */
-    selectAllProps?: CheckboxGroupOption;
+    selectAllProps?: Pick<CheckboxOptionProps, 'aria-label' | 'description' | 'label'>;
 };
 
 /**
@@ -73,64 +71,51 @@ export function CheckboxGroup({
     selectAll,
     selectAllProps,
     disabled = false,
-    invalid: invalidProp,
-    required,
+    invalid = false,
     id: idProp,
-    'aria-describedby': ariaDescribedByProp,
-    'aria-errormessage': ariaErrorMessageProp,
+    'aria-describedby': ariaDescribedBy,
+    'aria-errormessage': ariaErrorMessage,
+    required,
     ...props
 }: ElementProps<CheckboxGroupProps, 'div'>) {
-    const { id, ariaDescribedBy, ariaErrorMessage, invalid } = useFieldInit({
-        idProp,
-        required,
-        disabled,
-        invalidProp,
-    });
+    const id = useId(idProp);
+    const availableOptions = options.filter((o) => !o.disabled);
 
     return (
-        <div
-            {...props}
-            aria-describedby={ariaDescribedByProp || ariaDescribedBy || undefined}
-            data-bspk="checkbox-group"
-            id={id}
-            role="group"
-        >
+        <div {...props} aria-describedby={ariaDescribedBy || undefined} data-bspk="checkbox-group" id={id} role="group">
             {selectAll && (
-                <ToggleOption label={selectAllProps?.label || ALL_LABEL}>
-                    <Checkbox
-                        aria-errormessage={ariaErrorMessageProp || ariaErrorMessage || undefined}
-                        aria-label={selectAllProps?.label || ALL_LABEL}
-                        checked={!!value.length && value.length === options.length}
-                        data-testid="selectAll-Checkbox"
-                        disabled={disabled}
-                        indeterminate={!!value.length && value.length < options.length}
-                        invalid={invalid || undefined}
-                        name={name}
-                        onChange={(checked) => onChange(checked ? options.map((o) => o.value) : [])}
-                        value="all"
-                    />
-                </ToggleOption>
+                <CheckboxOption
+                    aria-label={ALL_LABEL}
+                    label={ALL_LABEL}
+                    {...selectAllProps}
+                    aria-errormessage={ariaErrorMessage || undefined}
+                    checked={!!value.length && value.length === availableOptions.length}
+                    data-testid="selectAll-Checkbox"
+                    disabled={disabled}
+                    indeterminate={!!value.length && value.length < availableOptions.length}
+                    invalid={invalid || undefined}
+                    name={name}
+                    onChange={(checked) => onChange(checked ? availableOptions.map((o) => o.value) : [])}
+                    value="all"
+                />
             )}
             {options.map(({ label, description, value: optionValue, disabled: optionDisabled }) => (
-                <ToggleOption
+                <CheckboxOption
+                    aria-errormessage={ariaErrorMessage || undefined}
+                    aria-label={label}
+                    checked={value.includes(optionValue)}
                     description={description}
                     disabled={disabled || optionDisabled}
+                    invalid={invalid || undefined}
                     key={optionValue}
                     label={label}
-                >
-                    <Checkbox
-                        aria-errormessage={ariaErrorMessageProp || ariaErrorMessage || undefined}
-                        aria-label={label}
-                        checked={value.includes(optionValue)}
-                        disabled={disabled || optionDisabled}
-                        invalid={invalid || undefined}
-                        name={name}
-                        onChange={(checked) => {
-                            onChange(checked ? [...value, optionValue] : value.filter((v) => v !== optionValue));
-                        }}
-                        value={optionValue}
-                    />
-                </ToggleOption>
+                    name={name}
+                    onChange={(checked) => {
+                        onChange(checked ? [...value, optionValue] : value.filter((v) => v !== optionValue));
+                    }}
+                    required={required}
+                    value={optionValue}
+                />
             ))}
         </div>
     );

package/src/components/CheckboxGroup/CheckboxGroupExample.tsx

@@ -68,6 +68,12 @@ export const CheckboxGroupExample: ComponentExample<CheckboxGroupProps> = {
                 disabled: true,
             },
             { label: 'Option 3', value: 'option3', description: 'Description for option 3' },
+            {
+                label: 'Option 4',
+                value: 'option4',
+                description:
+                    'This is a very long label for option 4 that never seems to end and just goes on and on without stopping',
+            },
         ],
     },
 };

package/src/components/CheckboxGroup/checkbox-group.scss

@@ -6,3 +6,5 @@
 
     --list-item-height: 'auto';
 }
+
+/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/src/components/CheckboxGroupField/CheckboxGroupField.tsx

@@ -1,8 +1,8 @@
 import { CheckboxGroup, CheckboxGroupProps } from '-/components/CheckboxGroup';
-import { Field, FieldDescription, FieldError, FieldLabel } from '-/components/Field';
-import { FormFieldControlProps } from '-/components/FormField';
+import { Fieldset, propsWithAria, FieldControlProps } from '-/components/Field';
+import { useId } from '-/hooks/useId';
 
-export type CheckboxGroupFieldProps = FormFieldControlProps<CheckboxGroupProps>;
+export type CheckboxGroupFieldProps = FieldControlProps<CheckboxGroupProps>;
 
 /**
  * A field wrapper for the CheckboxGroup component.
@@ -20,17 +20,21 @@ export function CheckboxGroupField({
     labelTrailing,
     errorMessage,
     style,
+    id: idProp,
     ...controlProps
 }: CheckboxGroupFieldProps) {
+    const id = useId(idProp);
     return (
-        <Field as="fieldset" style={style}>
-            <FieldLabel as="legend" labelTrailing={labelTrailing} style={style}>
-                {label}
-            </FieldLabel>
-            <CheckboxGroup {...controlProps} />
-            {!errorMessage && helperText && <FieldDescription>{helperText}</FieldDescription>}
-            {errorMessage && <FieldError>{errorMessage}</FieldError>}
-        </Field>
+        <Fieldset
+            controlId={id}
+            errorMessage={errorMessage}
+            helperText={helperText}
+            label={label}
+            labelTrailing={labelTrailing}
+            style={style}
+        >
+            <CheckboxGroup {...propsWithAria({ controlProps, id, errorMessage, helperText })} />
+        </Fieldset>
     );
 }
 

package/src/components/ChipGroup/ChipGroup.tsx

@@ -17,7 +17,6 @@ export type ChipGroupProps = {
  * A component that manages the layout of a group of chips.
  *
  * @example
- *     import { Chip } from '@bspk/ui/Chip';
  *     import { ChipGroup } from '@bspk/ui/ChipGroup';
  *
  *     <ChipGroup

package/src/components/ChipGroup/chip-group.scss

@@ -5,6 +5,10 @@
     flex-flow: row wrap;
     padding-bottom: var(--spacing-sizing-01);
 
+    &:empty {
+        display: none;
+    }
+
     &[data-scroll] {
         overflow: auto;
         flex-wrap: nowrap;