@ledgerhq/lumen-ui-rnative 0.1.7 → 0.1.9

package/dist/module/lib/Components/CardButton/CardButton.test.js

@@ -0,0 +1,131 @@
+"use strict";
+
+import { describe, expect, it, jest } from '@jest/globals';
+import { ledgerLiveThemes } from '@ledgerhq/lumen-design-core';
+import { fireEvent, render, screen } from '@testing-library/react-native';
+import React from 'react';
+import { Settings, Plus } from "../../Symbols/index.js";
+import { ThemeProvider } from "../ThemeProvider/ThemeProvider.js";
+import { CardButton } from "./CardButton.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const renderWithProvider = component => {
+  return render(/*#__PURE__*/_jsx(ThemeProvider, {
+    themes: ledgerLiveThemes,
+    colorScheme: "dark",
+    locale: "en",
+    children: component
+  }));
+};
+describe('CardButton Component', () => {
+  describe('Rendering', () => {
+    it('should render with required props', () => {
+      renderWithProvider(/*#__PURE__*/_jsx(CardButton, {
+        testID: "card-button",
+        title: "Test Card Button"
+      }));
+      expect(screen.getByTestId('card-button')).toBeTruthy();
+    });
+    it('should render the title', () => {
+      renderWithProvider(/*#__PURE__*/_jsx(CardButton, {
+        title: "Test Title"
+      }));
+      expect(screen.getByText('Test Title')).toBeTruthy();
+    });
+    it('should render description when provided', () => {
+      renderWithProvider(/*#__PURE__*/_jsx(CardButton, {
+        title: "Test Title",
+        description: "Test Description"
+      }));
+      expect(screen.getByText('Test Description')).toBeTruthy();
+    });
+    it('should have correct accessibility role', () => {
+      renderWithProvider(/*#__PURE__*/_jsx(CardButton, {
+        testID: "card-button",
+        title: "Test Card Button"
+      }));
+      const button = screen.getByTestId('card-button');
+      expect(button.props.accessibilityRole).toBe('button');
+    });
+  });
+  describe('Appearances', () => {
+    it.each(['base', 'outline'])('should render with %s appearance', appearance => {
+      renderWithProvider(/*#__PURE__*/_jsx(CardButton, {
+        testID: "card-button",
+        title: "Test Card Button",
+        appearance: appearance
+      }));
+      expect(screen.getByTestId('card-button')).toBeTruthy();
+    });
+  });
+  describe('Icon', () => {
+    it('should render with icon when provided', () => {
+      renderWithProvider(/*#__PURE__*/_jsx(CardButton, {
+        testID: "card-button",
+        title: "Settings",
+        icon: Settings
+      }));
+      expect(screen.getByTestId('card-button')).toBeTruthy();
+    });
+    it('should render different icons', () => {
+      renderWithProvider(/*#__PURE__*/_jsx(CardButton, {
+        testID: "card-button",
+        title: "Add",
+        icon: Plus
+      }));
+      expect(screen.getByTestId('card-button')).toBeTruthy();
+    });
+  });
+  describe('Chevron', () => {
+    it('should render chevron by default', () => {
+      renderWithProvider(/*#__PURE__*/_jsx(CardButton, {
+        testID: "card-button",
+        title: "Test Card Button"
+      }));
+      // The chevron is rendered inside card-button-content
+      expect(screen.getByTestId('card-button-content')).toBeTruthy();
+    });
+    it('should hide chevron when hideChevron is true', () => {
+      renderWithProvider(/*#__PURE__*/_jsx(CardButton, {
+        testID: "card-button",
+        title: "Test Card Button",
+        hideChevron: true
+      }));
+      expect(screen.getByTestId('card-button')).toBeTruthy();
+    });
+  });
+  describe('States', () => {
+    it('should be disabled when disabled prop is true', () => {
+      renderWithProvider(/*#__PURE__*/_jsx(CardButton, {
+        testID: "card-button",
+        title: "Test Card Button",
+        disabled: true
+      }));
+      const button = screen.getByTestId('card-button');
+      expect(button.props.accessibilityState.disabled).toBe(true);
+    });
+  });
+  describe('Interactions', () => {
+    it('should call onPress when pressed', () => {
+      const handlePress = jest.fn();
+      renderWithProvider(/*#__PURE__*/_jsx(CardButton, {
+        testID: "card-button",
+        title: "Test Card Button",
+        onPress: handlePress
+      }));
+      fireEvent.press(screen.getByTestId('card-button'));
+      expect(handlePress).toHaveBeenCalledTimes(1);
+    });
+    it('should not call onPress when disabled', () => {
+      const handlePress = jest.fn();
+      renderWithProvider(/*#__PURE__*/_jsx(CardButton, {
+        testID: "card-button",
+        title: "Test Card Button",
+        onPress: handlePress,
+        disabled: true
+      }));
+      fireEvent.press(screen.getByTestId('card-button'));
+      expect(handlePress).not.toHaveBeenCalled();
+    });
+  });
+});
+//# sourceMappingURL=CardButton.test.js.map

package/dist/module/lib/Components/CardButton/CardButton.test.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["describe","expect","it","jest","ledgerLiveThemes","fireEvent","render","screen","React","Settings","Plus","ThemeProvider","CardButton","jsx","_jsx","renderWithProvider","component","themes","colorScheme","locale","children","testID","title","getByTestId","toBeTruthy","getByText","description","button","props","accessibilityRole","toBe","each","appearance","icon","hideChevron","disabled","accessibilityState","handlePress","fn","onPress","press","toHaveBeenCalledTimes","not","toHaveBeenCalled"],"sourceRoot":"../../../../../src","sources":["lib/Components/CardButton/CardButton.test.tsx"],"mappings":"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","ignoreList":[]}

package/dist/module/lib/Components/CardButton/index.js

@@ -0,0 +1,5 @@
+"use strict";
+
+export * from "./CardButton.js";
+export * from "./types.js";
+//# sourceMappingURL=index.js.map

package/dist/module/lib/Components/CardButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../../../../src","sources":["lib/Components/CardButton/index.ts"],"mappings":";;AAAA,cAAc,iBAAc;AAC5B,cAAc,YAAS","ignoreList":[]}

package/dist/module/lib/Components/CardButton/types.js

@@ -0,0 +1,4 @@
+"use strict";
+
+export {};
+//# sourceMappingURL=types.js.map

package/dist/module/lib/Components/CardButton/types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../../../../src","sources":["lib/Components/CardButton/types.ts"],"mappings":"","ignoreList":[]}

package/dist/module/lib/Components/Checkbox/BaseCheckbox.js

@@ -0,0 +1,148 @@
+"use strict";
+
+import { createSafeContext } from '@ledgerhq/lumen-utils-shared';
+import { useCallback } from 'react';
+import { Pressable, View, StyleSheet } from 'react-native';
+import { useStyleSheet } from "../../../styles/index.js";
+import { SlotPressable, SlotView } from "../Slot/index.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const ROOT_COMPONENT_NAME = 'BaseCheckbox';
+const TRIGGER_COMPONENT_NAME = 'BaseCheckboxTrigger';
+const INDICATOR_COMPONENT_NAME = 'BaseCheckboxIndicator';
+const [BaseCheckboxProvider, useBaseCheckboxContext] = createSafeContext(ROOT_COMPONENT_NAME);
+const BaseCheckboxRoot = ({
+  disabled = false,
+  checked,
+  onCheckedChange,
+  nativeID,
+  ref,
+  ...props
+}) => {
+  return /*#__PURE__*/_jsx(BaseCheckboxProvider, {
+    value: {
+      disabled,
+      checked,
+      onCheckedChange,
+      nativeID
+    },
+    children: /*#__PURE__*/_jsx(BaseCheckboxTrigger, {
+      ref: ref,
+      ...props
+    })
+  });
+};
+BaseCheckboxRoot.displayName = ROOT_COMPONENT_NAME;
+const BaseCheckboxTrigger = ({
+  asChild,
+  onPress: onPressProp,
+  ref,
+  ...props
+}) => {
+  const {
+    disabled,
+    checked,
+    onCheckedChange,
+    nativeID
+  } = useBaseCheckboxContext({
+    consumerName: TRIGGER_COMPONENT_NAME,
+    contextRequired: true
+  });
+  const styles = useStyles({
+    checked: !!checked,
+    disabled: !!disabled
+  });
+  const onPress = useCallback(ev => {
+    if (disabled) return;
+    const newValue = !checked;
+    onCheckedChange?.(newValue);
+    onPressProp?.(ev);
+  }, [disabled, checked, onCheckedChange, onPressProp]);
+  const Component = asChild ? SlotPressable : Pressable;
+  return /*#__PURE__*/_jsx(Component, {
+    ref: ref,
+    nativeID: nativeID,
+    "aria-disabled": disabled,
+    role: "checkbox",
+    "aria-checked": checked,
+    onPress: onPress,
+    style: styles.trigger,
+    accessibilityState: {
+      checked,
+      disabled
+    },
+    disabled: disabled,
+    ...props
+  });
+};
+BaseCheckboxTrigger.displayName = TRIGGER_COMPONENT_NAME;
+const BaseCheckboxIndicator = ({
+  asChild,
+  forceMount,
+  ref,
+  ...props
+}) => {
+  const {
+    checked,
+    disabled
+  } = useBaseCheckboxContext({
+    consumerName: INDICATOR_COMPONENT_NAME,
+    contextRequired: true
+  });
+  const styles = useStyles({
+    checked: !!checked,
+    disabled: !!disabled
+  });
+  if (!forceMount) {
+    if (!checked) {
+      return null;
+    }
+  }
+  const Component = asChild ? SlotView : View;
+  return /*#__PURE__*/_jsx(Component, {
+    ref: ref,
+    style: styles.indicator,
+    "aria-disabled": disabled,
+    "aria-hidden": !(forceMount || checked),
+    role: 'presentation',
+    ...props
+  });
+};
+const useStyles = ({
+  checked,
+  disabled
+}) => {
+  return useStyleSheet(t => {
+    return {
+      trigger: StyleSheet.flatten([{
+        width: t.sizes.s20,
+        height: t.sizes.s20,
+        flexShrink: 0,
+        borderRadius: t.borderRadius.xs
+      }, !checked && {
+        borderWidth: t.borderWidth.s1
+      }, checked && !disabled && {
+        backgroundColor: t.colors.bg.active,
+        color: t.colors.text.onAccent
+      }, !checked && !disabled && {
+        borderColor: t.colors.border.muted,
+        backgroundColor: t.colors.bg.base
+      }, checked && disabled && {
+        backgroundColor: t.colors.bg.disabled,
+        color: t.colors.text.disabled
+      }, !checked && disabled && {
+        borderColor: t.colors.border.disabled,
+        backgroundColor: t.colors.bg.base
+      }]),
+      indicator: {
+        flex: 1,
+        width: t.sizes.full,
+        height: t.sizes.full,
+        alignItems: 'center',
+        justifyContent: 'center'
+      }
+    };
+  }, [checked, disabled]);
+};
+BaseCheckboxIndicator.displayName = INDICATOR_COMPONENT_NAME;
+export { BaseCheckboxIndicator, BaseCheckboxRoot };
+//# sourceMappingURL=BaseCheckbox.js.map

package/dist/module/lib/Components/Checkbox/BaseCheckbox.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["createSafeContext","useCallback","Pressable","View","StyleSheet","useStyleSheet","SlotPressable","SlotView","jsx","_jsx","ROOT_COMPONENT_NAME","TRIGGER_COMPONENT_NAME","INDICATOR_COMPONENT_NAME","BaseCheckboxProvider","useBaseCheckboxContext","BaseCheckboxRoot","disabled","checked","onCheckedChange","nativeID","ref","props","value","children","BaseCheckboxTrigger","displayName","asChild","onPress","onPressProp","consumerName","contextRequired","styles","useStyles","ev","newValue","Component","role","style","trigger","accessibilityState","BaseCheckboxIndicator","forceMount","indicator","t","flatten","width","sizes","s20","height","flexShrink","borderRadius","xs","borderWidth","s1","backgroundColor","colors","bg","active","color","text","onAccent","borderColor","border","muted","base","flex","full","alignItems","justifyContent"],"sourceRoot":"../../../../../src","sources":["lib/Components/Checkbox/BaseCheckbox.tsx"],"mappings":"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","ignoreList":[]}

package/dist/module/lib/Components/Checkbox/Checkbox.js

@@ -0,0 +1,93 @@
+"use strict";
+
+import { useStyleSheet } from "../../../styles/index.js";
+import { Check } from "../../Symbols/index.js";
+import { useControllableState } from "../../utils/index.js";
+import { Label } from "../Label/index.js";
+import { Box } from "../Utility/index.js";
+import { BaseCheckboxIndicator, BaseCheckboxRoot } from "./BaseCheckbox.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * The checkbox follows the design system tokens and supports checked, unchecked,
+ * disabled, and focus states with proper hover and active interactions.
+ *
+ * @see {@link https://ldls.vercel.app/?path=/docs/react-native_selection-checkbox--docs Storybook}
+ * @see {@link https://ldls.vercel.app/?path=/docs/react-native_selection-checkbox--docs#dos-and-donts Guidelines}
+ *
+ * @warning The `lx` prop should only be used for layout adjustments like margins or positioning.
+ * Do not use it to modify the checkbox's core appearance.
+ *
+ * @example
+ * import { Checkbox } from '@ledgerhq/lumen-ui-rnative';
+ *
+ * // Basic controlled checkbox
+ * const [checked, setChecked] = useState(false);
+ * <Checkbox
+ *   label="My label"
+ *   checked={checked}
+ *   onCheckedChange={setChecked}
+ * />
+ *
+ * // Uncontrolled checkbox with default state
+ * <Checkbox defaultChecked={true} onCheckedChange={handleChange} />
+ */
+export const Checkbox = ({
+  lx,
+  style,
+  checked: checkedProp,
+  onCheckedChange: onCheckedChangeProp,
+  defaultChecked = false,
+  disabled = false,
+  label,
+  ref,
+  ...props
+}) => {
+  const [checked, onCheckedChange] = useControllableState({
+    prop: checkedProp,
+    onChange: onCheckedChangeProp,
+    defaultProp: defaultChecked
+  });
+  const styles = useStyles({
+    disabled
+  });
+  return /*#__PURE__*/_jsxs(Box, {
+    ref: ref,
+    lx: lx,
+    style: [styles.root, style],
+    ...props,
+    children: [/*#__PURE__*/_jsx(BaseCheckboxRoot, {
+      disabled: disabled,
+      checked: checked,
+      onCheckedChange: onCheckedChange,
+      children: /*#__PURE__*/_jsx(BaseCheckboxIndicator, {
+        children: /*#__PURE__*/_jsx(Check, {
+          size: 16,
+          style: styles.icon
+        })
+      })
+    }), label && /*#__PURE__*/_jsx(Label, {
+      disabled: disabled,
+      onPress: () => onCheckedChange(!checked),
+      children: label
+    })]
+  });
+};
+const useStyles = ({
+  disabled
+}) => {
+  return useStyleSheet(t => {
+    return {
+      root: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        gap: t.spacings.s8
+      },
+      icon: {
+        flexShrink: 0,
+        color: disabled ? t.colors.text.disabled : t.colors.text.black
+      }
+    };
+  }, [disabled]);
+};
+Checkbox.displayName = 'Checkbox';
+//# sourceMappingURL=Checkbox.js.map

package/dist/module/lib/Components/Checkbox/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useStyleSheet","Check","useControllableState","Label","Box","BaseCheckboxIndicator","BaseCheckboxRoot","jsx","_jsx","jsxs","_jsxs","Checkbox","lx","style","checked","checkedProp","onCheckedChange","onCheckedChangeProp","defaultChecked","disabled","label","ref","props","prop","onChange","defaultProp","styles","useStyles","root","children","size","icon","onPress","t","flexDirection","alignItems","gap","spacings","s8","flexShrink","color","colors","text","black","displayName"],"sourceRoot":"../../../../../src","sources":["lib/Components/Checkbox/Checkbox.tsx"],"mappings":";;AAAA,SAASA,aAAa,QAAQ,0BAAiB;AAC/C,SAASC,KAAK,QAAQ,wBAAe;AACrC,SAASC,oBAAoB,QAAQ,sBAAa;AAClD,SAASC,KAAK,QAAQ,mBAAU;AAChC,SAASC,GAAG,QAAQ,qBAAY;AAChC,SAASC,qBAAqB,EAAEC,gBAAgB,QAAQ,mBAAgB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAIzE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,QAAQ,GAAGA,CAAC;EACvBC,EAAE;EACFC,KAAK;EACLC,OAAO,EAAEC,WAAW;EACpBC,eAAe,EAAEC,mBAAmB;EACpCC,cAAc,GAAG,KAAK;EACtBC,QAAQ,GAAG,KAAK;EAChBC,KAAK;EACLC,GAAG;EACH,GAAGC;AACU,CAAC,KAAK;EACnB,MAAM,CAACR,OAAO,EAAEE,eAAe,CAAC,GAAGd,oBAAoB,CAAC;IACtDqB,IAAI,EAAER,WAAW;IACjBS,QAAQ,EAAEP,mBAAmB;IAC7BQ,WAAW,EAAEP;EACf,CAAC,CAAC;EAEF,MAAMQ,MAAM,GAAGC,SAAS,CAAC;IAAER;EAAS,CAAC,CAAC;EAEtC,oBACET,KAAA,CAACN,GAAG;IAACiB,GAAG,EAAEA,GAAI;IAACT,EAAE,EAAEA,EAAG;IAACC,KAAK,EAAE,CAACa,MAAM,CAACE,IAAI,EAAEf,KAAK,CAAE;IAAA,GAAKS,KAAK;IAAAO,QAAA,gBAC3DrB,IAAA,CAACF,gBAAgB;MACfa,QAAQ,EAAEA,QAAS;MACnBL,OAAO,EAAEA,OAAQ;MACjBE,eAAe,EAAEA,eAAgB;MAAAa,QAAA,eAEjCrB,IAAA,CAACH,qBAAqB;QAAAwB,QAAA,eACpBrB,IAAA,CAACP,KAAK;UAAC6B,IAAI,EAAE,EAAG;UAACjB,KAAK,EAAEa,MAAM,CAACK;QAAK,CAAE;MAAC,CAClB;IAAC,CACR,CAAC,EAClBX,KAAK,iBACJZ,IAAA,CAACL,KAAK;MAACgB,QAAQ,EAAEA,QAAS;MAACa,OAAO,EAAEA,CAAA,KAAMhB,eAAe,CAAC,CAACF,OAAO,CAAE;MAAAe,QAAA,EACjET;IAAK,CACD,CACR;EAAA,CACE,CAAC;AAEV,CAAC;AAED,MAAMO,SAAS,GAAGA,CAAC;EAAER;AAAgC,CAAC,KAAK;EACzD,OAAOnB,aAAa,CACjBiC,CAAC,IAAK;IACL,OAAO;MACLL,IAAI,EAAE;QACJM,aAAa,EAAE,KAAK;QACpBC,UAAU,EAAE,QAAQ;QACpBC,GAAG,EAAEH,CAAC,CAACI,QAAQ,CAACC;MAClB,CAAC;MACDP,IAAI,EAAE;QACJQ,UAAU,EAAE,CAAC;QACbC,KAAK,EAAErB,QAAQ,GAAGc,CAAC,CAACQ,MAAM,CAACC,IAAI,CAACvB,QAAQ,GAAGc,CAAC,CAACQ,MAAM,CAACC,IAAI,CAACC;MAC3D;IACF,CAAC;EACH,CAAC,EACD,CAACxB,QAAQ,CACX,CAAC;AACH,CAAC;AAEDR,QAAQ,CAACiC,WAAW,GAAG,UAAU","ignoreList":[]}

package/dist/module/lib/Components/Checkbox/Checkbox.mdx

@@ -0,0 +1,224 @@
+import { Meta, Story, Canvas, Controls } from '@storybook/addon-docs/blocks';
+import * as CheckboxStories from './Checkbox.stories';
+import { Checkbox } from './Checkbox';
+import { Box } from '../Utility';
+import { CustomTabs, Tab } from '../../../../.storybook/components';
+import { DoVsDontRow, DoBlockItem, DontBlockItem } from '../../../../.storybook/components/DoVsDont';
+import CommonRulesDoAndDont from '../../../../.storybook/components/DoVsDont/CommonRulesDoAndDont.mdx';
+
+<Meta title="Components/Checkbox" of={CheckboxStories} />
+
+# ☑️ Checkbox
+
+<CustomTabs>
+  <Tab label="Overview">
+
+## Introduction
+
+Checkboxes are form controls that allow users to select one or multiple options from a list. They provide clear visual feedback about the selection state and support various interaction states including hover, focus, and disabled modes.
+
+> View in [Figma](https://www.figma.com/design/JxaLVMTWirCpU0rsbZ30k7/2.-Components-Library?node-id=90-1197&m=dev).
+
+## Anatomy
+
+<Canvas of={CheckboxStories.Base} />
+
+- **Checkbox**: The main interactive element that can be checked or unchecked
+- **Check mark**: Visual indicator shown when the checkbox is in a checked state
+
+## Properties
+
+### Overview
+
+<Canvas of={CheckboxStories.Base} />
+<Controls of={CheckboxStories.Base} />
+
+### States
+
+Checkboxes support multiple states to provide clear feedback to users:
+
+- **Unchecked**: Default state when not selected
+- **Checked**: Selected state with a visible check mark
+- **Disabled**: Non-interactive state for both checked and unchecked variants
+- **Focus**: Accessible focus state with visible ring indicator
+
+<Canvas of={CheckboxStories.AllStates} />
+
+## Usage Guidelines
+
+### Best Practices
+
+- Use checkboxes when users can select multiple options from a list
+- Always provide clear labels that describe what checking the box means
+- Group related checkboxes logically
+- Use consistent spacing between checkbox options
+
+### Accessibility
+
+- Provide descriptive labels for screen readers
+- Ensure sufficient color contrast in all states
+
+
+</Tab>
+<Tab label="Implementation">
+
+## Setup
+Install and set up the library with our [Setup Guide →](?path=/docs/getting-started-setup--docs).
+
+## Basic Usage
+
+```tsx
+import { Checkbox, Box, Text } from '@ledgerhq/lumen-ui-rnative';
+
+function MyForm() {
+  const [isChecked, setIsChecked] = useState(false);
+
+  return (
+    <Box lx={{ flexDirection: 'row', alignItems: 'center', gap: 's8' }}>
+      <Checkbox
+        checked={isChecked}
+        onCheckedChange={setIsChecked}
+      />
+      <Text>Accept terms and conditions</Text>
+    </Box>
+  );
+}
+```
+
+## Controlled vs Uncontrolled
+
+### Controlled
+
+Use the `checked` and `onCheckedChange` props for full control:
+
+```tsx
+const [checked, setChecked] = useState(false);
+
+<Checkbox
+  checked={checked}
+  onCheckedChange={setChecked}
+/>
+```
+
+### Uncontrolled
+
+Use `defaultChecked` for simple cases:
+
+```tsx
+<Checkbox defaultChecked={true} />
+```
+
+## Accessibility Best Practices
+
+### Labels and ARIA
+
+```tsx
+// ✅ Using built-in label prop
+<Checkbox label="I agree to the terms" />
+
+// ✅ ARIA label for standalone checkbox
+<Checkbox accessibilityLabel="Select all items" />
+
+// ✅ Custom layout with Box and Text
+<Box lx={{ flexDirection: 'row', alignItems: 'center', gap: 's8' }}>
+  <Checkbox id="terms" />
+  <Text>I agree to the terms</Text>
+</Box>
+
+// ✅ ARIA described by for complex descriptions
+<Box lx={{ gap: 's4' }}>
+  <Box lx={{ flexDirection: 'row', alignItems: 'center', gap: 's8' }}>
+    <Checkbox
+      id="marketing"
+      aria-describedby="marketing-description"
+    />
+    <Text>Marketing emails</Text>
+  </Box>
+  <Text id="marketing-description" lx={{ color: 'muted' }} typography="body4">
+    Receive promotional offers and product updates
+  </Text>
+</Box>
+```
+
+### Keyboard Navigation
+
+The Checkbox component automatically supports:
+
+- **Tab**: Navigate to the checkbox
+- **Space**: Toggle checked/unchecked state
+- **Enter**: Submit form (when inside a form)
+
+## Do's and Don'ts
+
+The following guidelines ensure consistent usage of the Checkbox component and maintain design system principles.
+
+<Box lx={{ flexDirection: 'column', gap: 's24' }}>
+  <DoVsDontRow>
+    <DoBlockItem
+      title='Use the built-in label prop'
+      description='Use the label prop for simple text labels'
+    >
+
+{/* prettier-ignore */}
+```tsx
+<Checkbox label='Subscribe to newsletter' />
+```
+
+    </DoBlockItem>
+    <DontBlockItem
+      title="Don't use unlabeled checkboxes"
+      description='Always provide labels for accessibility and clarity'
+    >
+
+{/* prettier-ignore */}
+```tsx
+<Checkbox id='newsletter' />
+```
+
+    </DontBlockItem>
+
+  </DoVsDontRow>
+
+  <DoVsDontRow>
+    <DoBlockItem
+      title='Use controlled components for form state'
+      description='Use checked and onCheckedChange props for controlled checkboxes'
+    >
+
+{/* prettier-ignore */}
+```tsx
+const [isChecked, setIsChecked] = useState(false);
+
+<Checkbox 
+  label='Accept terms'
+  checked={isChecked} 
+  onCheckedChange={setIsChecked} 
+/>
+```
+
+    </DoBlockItem>
+    <DontBlockItem
+      title="Don't mix controlled and uncontrolled patterns"
+      description='Avoid using both checked and defaultChecked props together'
+    >
+
+{/* prettier-ignore */}
+```tsx
+const [isChecked, setIsChecked] = useState(false);
+
+<Checkbox 
+  label='Accept terms'
+  checked={isChecked} 
+  defaultChecked={true} 
+/>
+```
+
+    </DontBlockItem>
+
+  </DoVsDontRow>
+
+  <CommonRulesDoAndDont />
+</Box>
+
+</Tab>
+</CustomTabs>