@companycam/slab-web 2.1.3 → 2.2.0

package/lib/InputCheckbox/InputCheckbox.d.ts

@@ -2,14 +2,17 @@ import { ComponentPropsWithRef, ReactNode } from 'react';
 import { UseMessageProps } from '../shared/types';
 type HTMLInputProps = ComponentPropsWithRef<'input'>;
 type FilteredHTMLInputProps = Omit<HTMLInputProps, 'type'>;
+export type InputCheckboxScale = 'medium' | 'large';
 type BaseInputCheckboxProps = FilteredHTMLInputProps & UseMessageProps & {
-    label: ReactNode;
-    value: string;
+    'data-testid'?: string;
+    description?: string;
+    design?: 'default' | 'assetFeed' | 'task';
     hideLabel?: boolean;
-    design?: 'default' | 'assetFeed';
+    label: ReactNode;
+    scale?: InputCheckboxScale;
     /** @deprecated - use `data-testid` */
     testId?: string;
-    'data-testid'?: string;
+    value: string;
 };
 type IndeterminateProps = {
     indeterminate?: false;
@@ -26,18 +29,22 @@ export type InputCheckboxProps = BaseInputCheckboxProps & IndeterminateProps;
 - `id` is required to associate the checkbox with the optional `message`.
 - In general, use sentence case for the required `label` (e.g., "I agree to the terms"; not "I Agree to the Terms").
 - **Indeterminate**: When using `indeterminate={true}`, you must also control the `checked` state. **Recommendation**: Set `checked={false}` when `indeterminate={true}` for consistent behavior (clicking an indeterminate checkbox typically checks it).
+- **aria-disabled**: When set, the checkbox appears visually disabled (dashed border) but remains interactive. Use this when the checkbox should signal "not yet actionable" while still allowing user interaction — for example, to surface a validation message.
+- **`design="assetFeed"` is deprecated.** Use `scale="large"` instead — `large` matches the assetFeed dimensions.
 */
 export declare const InputCheckbox: import('react').ForwardRefExoticComponent<(Omit<FilteredHTMLInputProps & import('../shared/types').GetStatusProps & {
     id: string;
     message?: ReactNode;
 } & {
-    label: ReactNode;
-    value: string;
+    'data-testid'?: string;
+    description?: string;
+    design?: "default" | "assetFeed" | "task";
     hideLabel?: boolean;
-    design?: "default" | "assetFeed";
+    label: ReactNode;
+    scale?: InputCheckboxScale;
     /** @deprecated - use `data-testid` */
     testId?: string;
-    'data-testid'?: string;
+    value: string;
 } & {
     indeterminate?: false;
     checked?: boolean;
@@ -45,13 +52,15 @@ export declare const InputCheckbox: import('react').ForwardRefExoticComponent<(O
     id: string;
     message?: ReactNode;
 } & {
-    label: ReactNode;
-    value: string;
+    'data-testid'?: string;
+    description?: string;
+    design?: "default" | "assetFeed" | "task";
     hideLabel?: boolean;
-    design?: "default" | "assetFeed";
+    label: ReactNode;
+    scale?: InputCheckboxScale;
     /** @deprecated - use `data-testid` */
     testId?: string;
-    'data-testid'?: string;
+    value: string;
 } & {
     indeterminate: true;
     checked: boolean;

package/lib/InputCheckboxGroup/InputCheckboxGroup.d.ts

@@ -1,11 +1,13 @@
 import { ChangeEvent } from 'react';
 import { InputGroupProps } from '../shared/InputGroup/InputGroup';
-import { InputCheckboxProps } from '../InputCheckbox/InputCheckbox';
+import { InputCheckboxProps, InputCheckboxScale } from '../InputCheckbox/InputCheckbox';
 type FilteredInputCheckboxProps = Readonly<Omit<InputCheckboxProps, 'id' | 'name' | 'onChange'>>;
 export type InputCheckboxGroupProps = InputGroupProps & {
     options: readonly FilteredInputCheckboxProps[];
     onChange: (event: ChangeEvent<HTMLInputElement>) => void;
     selectedValues: readonly string[];
+    /** Controls the scale of all checkboxes in the group. Overridden per-item by a `scale` on the option itself. */
+    scale?: InputCheckboxScale;
 };
 /**
  * - InputCheckboxGroup is a controlled component: You must provide an `onChange` handler to update `selectedValues`.
@@ -53,5 +55,5 @@ export type InputCheckboxGroupProps = InputGroupProps & {
  * );
  * ```
  */
-export declare function InputCheckboxGroup({ onChange, options, selectedValues, ...props }: InputCheckboxGroupProps): import("react/jsx-runtime").JSX.Element;
+export declare function InputCheckboxGroup({ onChange, options, selectedValues, scale, ...props }: InputCheckboxGroupProps): import("react/jsx-runtime").JSX.Element;
 export default InputCheckboxGroup;

package/lib/InputRadio/InputRadio.d.ts

@@ -2,11 +2,13 @@ import { ComponentPropsWithRef, ReactNode } from 'react';
 import { GetStatusProps } from '../shared/types.js';
 type HTMLInputProps = ComponentPropsWithRef<'input'>;
 type FilteredHTMLInputProps = Omit<HTMLInputProps, 'type'>;
+export type InputRadioScale = 'medium' | 'large';
 export type InputRadioProps = FilteredHTMLInputProps & GetStatusProps & {
     id: string;
     label: ReactNode;
     value: string;
     name: string;
+    scale?: InputRadioScale;
     /** @deprecated use `data-testid` instead */
     testId?: string;
     'data-testid'?: string;

package/lib/InputRadioGroup/InputRadioGroup.d.ts

@@ -1,11 +1,13 @@
 import { ChangeEvent } from 'react';
 import { InputGroupProps } from '../shared/InputGroup/InputGroup';
-import { InputRadioProps } from '../InputRadio/InputRadio';
+import { InputRadioProps, InputRadioScale } from '../InputRadio/InputRadio';
 type FilteredInputRadioProps = Readonly<Omit<InputRadioProps, 'id' | 'name' | 'onChange'>>;
 export type InputRadioGroupProps = InputGroupProps & {
     options: readonly FilteredInputRadioProps[];
     onChange: (event: ChangeEvent<HTMLInputElement>) => void;
     selectedValue: string;
+    /** Controls the scale of all radio inputs in the group. Overridden per-item by a `scale` on the option itself. */
+    scale?: InputRadioScale;
 };
 /**
  * - InputRadioGroup is a controlled component: You must provide an `onChange` handler to update the `selectedValue`.
@@ -48,5 +50,5 @@ export type InputRadioGroupProps = InputGroupProps & {
  * );
  * ```
  */
-export declare function InputRadioGroup({ onChange, options, selectedValue, ...props }: InputRadioGroupProps): import("react/jsx-runtime").JSX.Element;
+export declare function InputRadioGroup({ onChange, options, selectedValue, scale, ...props }: InputRadioGroupProps): import("react/jsx-runtime").JSX.Element;
 export default InputRadioGroup;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@companycam/slab-web",
-  "version": "2.1.3",
+  "version": "2.2.0",
   "main": "./index.js",
   "module": "./index.mjs",
   "types": "./index.d.ts",