{
  "version": "0.2.0-preview.1",
  "content_digest": "70ac710f4d22dce040e7ac593379ba8aca9dcb59a0b9c0f839819cae0e2bb721",
  "status": "preview",
  "authority": {
    "repository": "cloakedinc/design",
    "path": "packages/design-system",
    "catalog": "packages/design-system/catalog.json",
    "status": "preview"
  },
  "provenance": {
    "repo": "cloakedinc/automation",
    "commit": "f96f416e1c3bfbfaffcd155a88b87b18b8bb25f1",
    "path": "packages/design-system",
    "imported_spec_status": "approved"
  },
  "adaptations": [
    {
      "id": "button-content-gap",
      "status": "preview",
      "description": "Use the specification's 4px content gap instead of the inherited 8px implementation gap."
    },
    {
      "id": "keyboard-focus",
      "status": "preview",
      "description": "Add visible Button and Input keyboard focus and an overridable inset focus default for shared button resets, including FAQ cards and ListItem rows."
    },
    {
      "id": "supporting-text-contrast",
      "status": "preview",
      "description": "Map light secondary text to the existing grey-04-strong primitive for readable helper text on white and cream."
    },
    {
      "id": "danger-text-contrast",
      "status": "preview",
      "description": "Separate readable danger text/borders from destructive fills; preserve the primary danger-button fill and label pair."
    },
    {
      "id": "preview-status",
      "status": "preview",
      "description": "Local components, specs and token adaptations await human sign-off; upstream approved status is provenance only."
    },
    {
      "id": "motion-comparison-accessibility",
      "status": "preview",
      "description": "Preserve the original MotionShowcase comparisons while requiring explicit replay, responding to live reduced-motion changes, and keeping duration tracks usable on small screens."
    },
    {
      "id": "list-item-ownership",
      "status": "preview",
      "description": "List owns listitem wrappers for its content rows, while section labels stay outside the row count and standalone rows retain their existing semantics."
    },
    {
      "id": "card-delta-text-contrast",
      "status": "preview",
      "description": "Mix Card.Delta foregrounds from 60% existing tone solid and 40% primary text for readable contrast in both themes; preserve the four original tone fills."
    },
    {
      "id": "carousel-keyboard-access",
      "status": "preview",
      "description": "Keep all native-scrolling carousel slide controls exposed to assistive technology and keyboard navigation; pause autoplay while focus is inside the carousel."
    }
  ],
  "id": "listitem",
  "name": "ListItem",
  "category": "Organization / List",
  "summary": "A row composed from leading, text and trailing slots, with selection, progress, stat, empty and icon helpers. Public consumers import List and use List.Item; ListItem is not a separate package-root export.",
  "documentation": {
    "summary": "A row composed from leading, text and trailing slots, with selection, progress, stat, empty and icon helpers. Public consumers import List and use List.Item; ListItem is not a separate package-root export.",
    "guidance": [
      {
        "heading": "Overview",
        "body": "A slot-first list row. Compose the base row from named slots — a leading edge (`leadingGlyph` +\n`tone`, or a custom `leading` node), `overline` / `title` / `description`, and a trailing edge\n(`value`, `tag`, `statusLabel`, or `trailing` / `trailingIcon`). Behavior comes from compound parts\nrather than variant props."
      },
      {
        "heading": "Use when",
        "body": "The deciding choice is which compound part you reach for.\n\nA pressable row (`onPress`) normally reveals a chevron. `List` suppresses a direct `List.Item`\ndivider. Compound `Selection`, `Progress` and `Stat` rows keep their own divider setting;\npass `divider={false}` when the container already draws separators."
      },
      {
        "heading": "Leading and trailing slots",
        "body": "A leading tone plate from `leadingGlyph` + `tone`, with a trailing value and status."
      },
      {
        "heading": "Tones",
        "body": "Every `tone` on the generated leading plate — status, `brand`, and product-feature."
      }
    ],
    "usage": [
      {
        "variant": "List.Item",
        "use": "The default informational row — leading marker, text, and a trailing value/tag/status. The workhorse (most rows in the app).",
        "avoid": "Selection, progress, or key-value rows — those have dedicated parts below.",
        "axis": "Part"
      },
      {
        "variant": "List.Item.Selection",
        "use": "Selectable rows — `selectionMode=\"multiple\"` renders a checkbox, `\"single\"` a radio.",
        "avoid": "Titled option cards with supporting copy — use `SelectionCard`.",
        "axis": "Part"
      },
      {
        "variant": "List.Item.Progress",
        "use": "A row carrying progress — `kind` of `steps`, `ring`, or `bar` (removal progress, multi-step tasks).",
        "avoid": "A static count — that is a plain row `value`.",
        "axis": "Part"
      },
      {
        "variant": "List.Item.Stat",
        "use": "A key-value statistic row with an inset divider. Not currently used in app code, but the intended part for stat tables.",
        "avoid": "Rows with a leading marker or press affordance — use the base row.",
        "axis": "Part"
      },
      {
        "variant": "List.Item.Empty",
        "use": "The placeholder row shown when a list has no items.",
        "avoid": "Loading states — this reads as \"nothing here,\" not \"still fetching.\"",
        "axis": "Part"
      },
      {
        "variant": "List.Item.Icon",
        "use": "The leading tone plate, only when you need a custom `leading` marker. A standard row builds it for you from `leadingGlyph` + `tone`.",
        "avoid": "The common case — pass `leadingGlyph` + `tone` and let the row build the plate.",
        "axis": "Part"
      }
    ],
    "examples": [],
    "source": "packages/design-system/src/components/organization/ListItem/ListItem.mdx",
    "status": "local-preview",
    "note": "Guidance is read from local documentation, originally imported from the frozen source. Platform assertions in guidance are not parity verification."
  },
  "source": {
    "path": "packages/design-system/src/components/organization/ListItem/ListItem.tsx",
    "code": "import React from 'react';\nimport {\n    ArrowIcon,\n    ChevronIcon,\n    CopyIcon,\n    MailIcon,\n    MessageIcon,\n    PhoneIcon,\n} from './ListItemActionIcons/ListItemActionIcons';\nimport { ListItemEmpty } from './ListItemEmpty/ListItemEmpty';\nimport { ListItemIcon } from './ListItemIcon/ListItemIcon';\nimport { ListItemRow } from './ListItemRow/ListItemRow';\nimport { ListItemStat } from './ListItemStat/ListItemStat';\nimport { StatusIndicator } from '../../status/StatusIndicator/StatusIndicator';\nimport type { ListItemProgressProps, ListItemProps, ListItemSelectionProps } from './types';\n\nexport type {\n    ListItemDividerMode,\n    ListItemEmptyProps,\n    ListItemIconProps,\n    ListItemInlineProgress,\n    ListItemPadding,\n    ListItemProgress,\n    ListItemProgressKind,\n    ListItemProgressProps,\n    ListItemProps,\n    ListItemRingProgress,\n    ListItemSelectionMode,\n    ListItemSelectionPlacement,\n    ListItemSize,\n    ListItemSelectionProps,\n    ListItemStatProps,\n    ListItemTone,\n} from './types';\n\n/**\n * The default informational row: a leading marker, text, and a trailing value, tag, or status.\n */\nfunction ListItemRoot(props: ListItemProps) {\n    return <ListItemRow {...props} />;\n}\n\n/**\n * A selectable row. `multiple` (the default) renders a checkbox, `single` a radio.\n */\nfunction Selection({\n    selectionMode = 'multiple',\n    selectionPlacement = 'trailing',\n    selected = false,\n    onSelectedChange,\n    ...props\n}: ListItemSelectionProps) {\n    return (\n        <ListItemRow\n            {...props}\n            selectionMode={selectionMode}\n            selectionPlacement={selectionPlacement}\n            selected={selected}\n            onSelectedChange={onSelectedChange}\n        />\n    );\n}\n\n/**\n * A row carrying a progress ring, bar, or step track alongside its text.\n */\nfunction ProgressItem({ progress, ...props }: ListItemProgressProps) {\n    return <ListItemRow {...props} progress={progress} />;\n}\n\n/**\n * Slot-first list row and its compound parts. Behavior comes from picking a part — `.Selection`,\n * `.Progress`, `.Stat`, `.Empty` — rather than from variant props on the base row.\n */\nexport const ListItem = Object.assign(ListItemRoot, {\n    Selection,\n    Progress: ProgressItem,\n    Stat: ListItemStat,\n    Empty: ListItemEmpty,\n    Icon: ListItemIcon,\n    StatusIndicator,\n    ArrowIcon,\n    ChevronIcon,\n    CopyIcon,\n    MailIcon,\n    PhoneIcon,\n    MessageIcon,\n});\n"
  },
  "spec": {
    "$schema": "../../../specs/component-spec.schema.json",
    "identity": {
      "name": "ListItem",
      "status": "preview",
      "version": "0.1.0-preview.1",
      "summary": "A row composed from leading, text and trailing slots, with selection, progress, stat, empty and icon helpers. Public consumers import List and use List.Item; ListItem is not a separate package-root export."
    },
    "parts": [
      {
        "id": "root",
        "label": "Row target",
        "description": "Full-width row; becomes a button only when an action or selection callback exists.",
        "required": true
      },
      {
        "id": "leading",
        "label": "Leading visual",
        "description": "Custom content or a generated tone tile; leading selection replaces this slot.",
        "required": false
      },
      {
        "id": "body",
        "label": "Text body",
        "description": "Required title plus optional overline, description and inline progress.",
        "required": true
      },
      {
        "id": "value",
        "label": "Value",
        "description": "Optional right-aligned value in the title line.",
        "required": false
      },
      {
        "id": "trailing",
        "label": "Trailing accessory",
        "description": "One accessory selected by precedence, followed by a derived or explicit chevron.",
        "required": false
      },
      {
        "id": "separator",
        "label": "Divider",
        "description": "Optional row-owned hairline; List supplies container separators.",
        "required": false
      },
      {
        "id": "selection",
        "label": "Selection mark",
        "description": "Check or dot mark backed by the row interaction semantics.",
        "required": false
      },
      {
        "id": "progress",
        "label": "Progress",
        "description": "Ring at the trailing edge, or bar/steps under the copy.",
        "required": false
      }
    ],
    "allowedDesignChoices": {
      "variants": {
        "row": {
          "label": "List.Item"
        },
        "selection": {
          "label": "List.Item.Selection"
        },
        "progress": {
          "label": "List.Item.Progress"
        },
        "stat": {
          "label": "List.Item.Stat"
        },
        "empty": {
          "label": "List.Item.Empty"
        },
        "icon": {
          "label": "List.Item.Icon"
        }
      },
      "sizes": {
        "sm": {
          "label": "Compact",
          "description": "48px minimum, 8px gap and block padding."
        },
        "md": {
          "label": "Default",
          "description": "Content-dependent 48px, 64px or 80px minimum; progress can increase it."
        }
      },
      "selectionModes": {
        "single": {
          "label": "Single",
          "description": "Radio semantics; pressing the selected row reports true."
        },
        "multiple": {
          "label": "Multiple",
          "description": "Checkbox semantics; activation reports the inverse selected state."
        }
      },
      "selectionPlacements": {
        "leading": {
          "label": "Leading",
          "description": "Replaces an existing leading visual to preserve its column."
        },
        "trailing": {
          "label": "Trailing",
          "description": "Default; suitable for rows without a leading visual."
        }
      },
      "surfaces": {
        "page": {
          "label": "Page"
        },
        "surface": {
          "label": "Surface"
        }
      },
      "padding": {
        "card": {
          "label": "Card"
        },
        "sheet": {
          "label": "Sheet"
        },
        "flush": {
          "label": "Flush"
        }
      }
    },
    "variants": [
      {
        "id": "row",
        "label": "Base row",
        "description": "Informational or pressable row composed from slots.",
        "platforms": [
          "web"
        ]
      },
      {
        "id": "selection",
        "label": "Selection row",
        "description": "Use onSelectedChange with a controlled selected value. Choose single or multiple selection.",
        "platforms": [
          "web"
        ]
      },
      {
        "id": "progress",
        "label": "Progress row",
        "description": "A number is shorthand for a trailing ring; a progress object chooses ring, bar or steps.",
        "platforms": [
          "web"
        ]
      },
      {
        "id": "stat",
        "label": "Statistic row",
        "description": "Noninteractive label/value helper; it has its own divider prop.",
        "platforms": [
          "web"
        ]
      },
      {
        "id": "empty",
        "label": "Empty placeholder",
        "description": "A centered message for an empty list, not a loading indicator.",
        "platforms": [
          "web"
        ]
      },
      {
        "id": "icon",
        "label": "Leading icon helper",
        "description": "Tone plate for a custom leading node; generated leadingGlyph tiles do not need it.",
        "platforms": [
          "web"
        ]
      }
    ],
    "sizes": [
      {
        "id": "sm",
        "label": "Compact",
        "description": "Small density overrides rich-row height and removes inline inset; the container supplies spacing."
      },
      {
        "id": "md",
        "label": "Default",
        "description": "Default density grows with leading/trailing accessories, description, selection and progress."
      }
    ],
    "measurements": [
      {
        "id": "base-min-height",
        "label": "Base row minimum height",
        "kind": "at-least",
        "token": "--cds-size-48",
        "value": 48,
        "unit": "px",
        "appliesTo": [
          "root"
        ]
      },
      {
        "id": "rich-min-height",
        "label": "Rich row minimum height",
        "kind": "at-least",
        "token": "--cds-size-80",
        "value": 80,
        "unit": "px",
        "appliesTo": [
          "root"
        ],
        "notes": "Applies to md rows with leading content, trailing content or description; a tag-only trailing slot does not promote the row."
      },
      {
        "id": "selection-min-height",
        "label": "Copy-only selection minimum height",
        "kind": "at-least",
        "token": "--cds-size-64",
        "value": 64,
        "unit": "px",
        "appliesTo": [
          "selection"
        ],
        "notes": "For trailing selection with card padding and no description or leading slot; compact density is excluded."
      },
      {
        "id": "row-gap",
        "label": "Default row gap",
        "kind": "exact",
        "token": "--cds-space-12",
        "value": 12,
        "unit": "px",
        "appliesTo": [
          "root"
        ]
      },
      {
        "id": "compact-gap",
        "label": "Compact row gap",
        "kind": "exact",
        "token": "--cds-space-8",
        "value": 8,
        "unit": "px",
        "appliesTo": [
          "root"
        ]
      },
      {
        "id": "row-inset",
        "label": "Default inline inset",
        "kind": "exact",
        "token": "--cds-space-20",
        "value": 20,
        "unit": "px",
        "appliesTo": [
          "root"
        ]
      },
      {
        "id": "selection-gap",
        "label": "Trailing selection gap",
        "kind": "exact",
        "token": "--cds-space-24",
        "value": 24,
        "unit": "px",
        "appliesTo": [
          "selection"
        ]
      },
      {
        "id": "empty-min-height",
        "label": "Empty placeholder minimum height",
        "kind": "at-least",
        "token": "--cds-size-240",
        "value": 240,
        "unit": "px",
        "appliesTo": [
          "root"
        ]
      }
    ],
    "layout": {
      "alignment": "Leading visual, text body and trailing accessory align centrally; the body flexes while accessories keep their width.",
      "flow": "Slots run left to right; overline, title, description and inline progress stack within the body.",
      "notes": [
        "Accessory precedence is trailing, tag, status, selection, trailing progress, then trailingIcon. A chevron can follow the chosen accessory.",
        "Explicit value wins over a progress label. Custom leading content wins over a generated glyph tile.",
        "A selected leading control occupies the existing 40px md or 32px sm visual column. Use trailing selection for icon-less rows to avoid adding a column.",
        "List suppresses a direct List.Item divider. Compound Selection, Progress and Stat members retain their own divider; set divider=false when the container already draws separators."
      ]
    },
    "typographyAndColor": {
      "typography": [
        {
          "label": "Title and value",
          "description": "Use the body ramp.",
          "token": "--cds-type-body-size"
        },
        {
          "label": "Description",
          "description": "Uses body-small with a local 1.2 line-height.",
          "token": "--cds-type-body-small-size"
        }
      ],
      "colors": [
        {
          "label": "Primary text",
          "description": "Title and value.",
          "token": "--cds-text-primary"
        },
        {
          "label": "Secondary text",
          "description": "Overline, description, stat label and empty message.",
          "token": "--cds-text-secondary"
        },
        {
          "label": "Default surface",
          "description": "Default and selected row background.",
          "token": "--cds-bg-surface"
        },
        {
          "label": "Page surface",
          "description": "Page-level row background.",
          "token": "--cds-bg-page"
        },
        {
          "label": "Divider",
          "description": "Row-owned and container separators.",
          "token": "--cds-divider"
        }
      ]
    },
    "states": [
      {
        "id": "informational",
        "label": "Informational",
        "description": "Without callbacks the row is not a press target."
      },
      {
        "id": "pressable",
        "label": "Pressable",
        "description": "onPress produces a button and normally a chevron; caller-owned trailing content or chevron=false suppresses the automatic chevron."
      },
      {
        "id": "selected",
        "label": "Selected",
        "description": "The host supplies selected. Single activation reports true; multiple activation reports the inverse value."
      },
      {
        "id": "disabled",
        "label": "Disabled",
        "description": "Prevents action and selection callbacks and dims the row. Disabled interactive selection still exposes its state."
      },
      {
        "id": "progress",
        "label": "Progress",
        "description": "Rings render trailing, bars and steps inline. The host owns progress updates."
      },
      {
        "id": "empty",
        "label": "Empty",
        "description": "List.Item.Empty renders its message in a centered 240px-minimum block."
      }
    ],
    "behavior": [
      {
        "label": "Controlled selection",
        "description": "Selection is host-owned. No callback means no row button; the helper uses a disabled, read-only form control to expose that selection state."
      },
      {
        "label": "Navigation and disclosure",
        "description": "Base onPress is host-owned. ariaControls and expanded can describe a disclosure target but do not implement expansion."
      },
      {
        "label": "Separator ownership",
        "description": "Use List for list structure and separator ownership. Standalone rows do not claim listitem semantics; compound members need an explicit divider decision."
      },
      {
        "label": "No nested interactive slots",
        "description": "A pressable row is already the single control. Keep leading and trailing content noninteractive within it."
      }
    ],
    "accessibility": [
      {
        "label": "Button, checkbox and radio roles",
        "description": "Interactive rows are native buttons. Selection rows expose checkbox or radio role and aria-checked; their visible title labels them and their description is associated when present."
      },
      {
        "label": "Names and disabled state",
        "description": "ariaLabel can replace visible naming when needed. Native disabled blocks keyboard and pointer activation; the selected state stays represented."
      },
      {
        "label": "Group behavior belongs to the host",
        "description": "Single selection announces radio semantics, but this row family does not implement radio-group arrow-key movement or enforce one chosen row. The consumer must define and verify group behavior."
      },
      {
        "label": "Visible keyboard focus",
        "description": "Interactive rows inherit the shared focus-visible outline. Its inset offset preserves the indicator within clipped list or card containers; disabled native buttons do not receive keyboard focus."
      },
      {
        "label": "List ownership",
        "description": "List wraps content rows with role=listitem. A standalone row is a generic container or control, not a listitem by itself."
      }
    ],
    "contentAdaptation": [
      {
        "label": "Clamping",
        "description": "Title and description default to one-line truncation. Positive titleLines and descriptionLines enable multi-line clamping; overline and value remain single-line. Value has a 46% maximum width."
      },
      {
        "label": "Empty versus pending",
        "description": "Use Empty for a known empty result. It does not represent pending data, errors or a retry action."
      },
      {
        "label": "Review dense combinations",
        "description": "Verify long titles, descriptions, values, tags, localized copy and large text at narrow widths. Do not combine every slot by default."
      }
    ],
    "motionHaptics": {
      "motion": [
        {
          "label": "Press feedback",
          "description": "Interactive rows use the shared fast press transform and opacity change; reduced-motion removes the transform. Progress and selection visuals use their own primitives."
        }
      ],
      "haptics": [
        {
          "label": "Action feedback",
          "description": "Enabled action and selection callbacks request light feedback by default; haptic can override or disable it. Delivery depends on provider and host support."
        }
      ]
    },
    "platformDifferences": [
      {
        "platforms": [
          "ios",
          "android"
        ],
        "description": "Native implementations and platform parity are not verified. Vue also has no local implementation.",
        "rationale": "This preview was authored from the local React types, implementation, styles and documentation. Native unit, typography, interaction and accessibility mappings require platform review."
      }
    ]
  },
  "spec_source": "packages/design-system/src/components/organization/ListItem/ListItem.spec.json",
  "guidance_source": {
    "path": "packages/design-system/src/components/organization/ListItem/ListItem.mdx",
    "code": "import { Meta, Canvas, Controls } from '@storybook/addon-docs/blocks';\nimport { ComponentSpec, UsageTable, Do, Dont, Compare } from '../../../../.storybook/blocks';\nimport * as Stories from './ListItem.stories';\nimport listItemSpec from './ListItem.spec.json';\n\n<Meta of={Stories} />\n\n# List.Item\n\nA slot-first list row. Compose the base row from named slots — a leading edge (`leadingGlyph` +\n`tone`, or a custom `leading` node), `overline` / `title` / `description`, and a trailing edge\n(`value`, `tag`, `statusLabel`, or `trailing` / `trailingIcon`). Behavior comes from compound parts\nrather than variant props.\n\n<Canvas of={Stories.Playground} />\n\n## Use when\n\nThe deciding choice is which compound part you reach for.\n\n<UsageTable\n    axis='Part'\n    rows={[\n        {\n            variant: 'List.Item',\n            use: 'The default informational row — leading marker, text, and a trailing value/tag/status. The workhorse (most rows in the app).',\n            avoid: 'Selection, progress, or key-value rows — those have dedicated parts below.',\n        },\n        {\n            variant: 'List.Item.Selection',\n            use: 'Selectable rows — `selectionMode=\"multiple\"` renders a checkbox, `\"single\"` a radio.',\n            avoid: 'Titled option cards with supporting copy — use `SelectionCard`.',\n        },\n        {\n            variant: 'List.Item.Progress',\n            use: 'A row carrying progress — `kind` of `steps`, `ring`, or `bar` (removal progress, multi-step tasks).',\n            avoid: 'A static count — that is a plain row `value`.',\n        },\n        {\n            variant: 'List.Item.Stat',\n            use: 'A key-value statistic row with an inset divider. Not currently used in app code, but the intended part for stat tables.',\n            avoid: 'Rows with a leading marker or press affordance — use the base row.',\n        },\n        {\n            variant: 'List.Item.Empty',\n            use: 'The placeholder row shown when a list has no items.',\n            avoid: 'Loading states — this reads as \"nothing here,\" not \"still fetching.\"',\n        },\n        {\n            variant: 'List.Item.Icon',\n            use: 'The leading tone plate, only when you need a custom `leading` marker. A standard row builds it for you from `leadingGlyph` + `tone`.',\n            avoid: 'The common case — pass `leadingGlyph` + `tone` and let the row build the plate.',\n        },\n    ]}\n/>\n\nA pressable row (`onPress`) normally reveals a chevron. `List` suppresses a direct `List.Item`\ndivider. Compound `Selection`, `Progress` and `Stat` rows keep their own divider setting;\npass `divider={false}` when the container already draws separators.\n\n## Design Guidelines\n\n<ComponentSpec spec={listItemSpec} />\n\n## Leading and trailing slots\n\nA leading tone plate from `leadingGlyph` + `tone`, with a trailing value and status.\n\n<Canvas of={Stories.IconTileLeading} />\n<Canvas of={Stories.WithTag} />\n<Canvas of={Stories.WithStatus} />\n\n## Behavior parts\n\n<Canvas of={Stories.SelectionMultiple} />\n<Canvas of={Stories.SelectionSingle} />\n<Canvas of={Stories.ProgressVariants} />\n<Canvas of={Stories.EmptyState} />\n\n## Tones\n\nEvery `tone` on the generated leading plate — status, `brand`, and product-feature.\n\n<Canvas of={Stories.ToneMatrix} />\n\n## Dark theme\n\n<Canvas of={Stories.DarkTheme} />\n\n## Props\n\n<Controls of={Stories.Playground} />\n"
  },
  "props": [
    {
      "name": "leading",
      "type": "React.ReactNode",
      "declared_type": "React.ReactNode",
      "required": false,
      "description": "Custom leading content (e.g. an `Avatar`, brand logo, or `List.Item.Icon` plate).",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 54
      }
    },
    {
      "name": "leadingGlyph",
      "type": "\"number\" | \"info\" | \"guard\" | \"arrow-left\" | \"arrow-right\" | \"arrow-up\" | \"arrow-down\" | \"chevron-down\" | \"chevron-up\" | \"chevron-left\" | \"chevron-right\" | \"caret-down\" | \"caret-up\" | \"trend-up\" | \"trend-down\" | \"collapse\" | \"expand\" | \"dropdown-collapse\" | \"dropdown-expand\" | \"close\" | \"clear\" | \"menu\" | \"copy\" | \"search\" | \"add\" | \"share\" | \"phone\" | \"sim\" | \"account\" | \"family\" | \"home\" | \"wifi\" | \"cart\" | \"vpn\" | \"lock\" | \"block\" | \"timer\" | \"check\" | \"send\" | \"filter\" | \"scan\" | \"log\" | \"trash\" | \"missed\" | \"call\" | \"voicemail\" | \"sms\" | \"email\" | \"data-removal\" | \"dark-web-monitoring\" | \"cloaked-pay\" | \"cloaked-ai\" | \"sms-guard\" | \"email-guard\" | \"call-guard\" | \"card\" | \"password\" | \"bell\" | \"circle-outline\" | \"dot\" | \"settings\" | \"clock\" | \"mail\" | \"message\" | \"user\" | \"upload\" | undefined",
      "declared_type": "GlyphName",
      "required": false,
      "description": "Registered glyph rendered as a tone `IconTile` in the leading slot.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 56
      },
      "values": [
        "account",
        "add",
        "arrow-down",
        "arrow-left",
        "arrow-right",
        "arrow-up",
        "bell",
        "block",
        "call-guard",
        "call",
        "card",
        "caret-down",
        "caret-up",
        "cart",
        "check",
        "chevron-down",
        "chevron-left",
        "chevron-right",
        "chevron-up",
        "circle-outline",
        "clear",
        "cloaked-ai",
        "cloaked-pay",
        "clock",
        "close",
        "collapse",
        "copy",
        "dark-web-monitoring",
        "data-removal",
        "dot",
        "dropdown-collapse",
        "dropdown-expand",
        "email-guard",
        "email",
        "expand",
        "family",
        "filter",
        "guard",
        "home",
        "info",
        "lock",
        "log",
        "mail",
        "menu",
        "message",
        "missed",
        "number",
        "password",
        "phone",
        "scan",
        "search",
        "send",
        "settings",
        "share",
        "sim",
        "sms-guard",
        "sms",
        "timer",
        "trash",
        "trend-down",
        "trend-up",
        "upload",
        "user",
        "voicemail",
        "vpn",
        "wifi"
      ],
      "values_complete": true
    },
    {
      "name": "tone",
      "type": "ListItemTone | undefined",
      "declared_type": "ListItemTone",
      "required": false,
      "description": "Tone for the generated leading `IconTile`.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 58
      },
      "values": [
        "brand",
        "danger",
        "guard",
        "identity",
        "info",
        "monitoring",
        "neutral",
        "success",
        "warning"
      ],
      "values_complete": true
    },
    {
      "name": "overline",
      "type": "React.ReactNode",
      "declared_type": "React.ReactNode",
      "required": false,
      "description": "Small copy shown above the title.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 60
      }
    },
    {
      "name": "overlineTrailing",
      "type": "React.ReactNode",
      "declared_type": "React.ReactNode",
      "required": false,
      "description": "Accessory pinned to the top-right, aligned with the overline (e.g. a count badge).",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 62
      }
    },
    {
      "name": "title",
      "type": "React.ReactNode",
      "declared_type": "React.ReactNode",
      "required": true,
      "description": "Primary row title.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 64
      }
    },
    {
      "name": "titleLines",
      "type": "number | undefined",
      "declared_type": "number",
      "required": false,
      "description": "Wraps the title across up to this many lines before clamping. Defaults to single-line truncation.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 66
      }
    },
    {
      "name": "description",
      "type": "React.ReactNode",
      "declared_type": "React.ReactNode",
      "required": false,
      "description": "Secondary row copy.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 68
      }
    },
    {
      "name": "descriptionLines",
      "type": "number | undefined",
      "declared_type": "number",
      "required": false,
      "description": "Wraps the description across up to this many lines before clamping. Defaults to single-line truncation.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 70
      }
    },
    {
      "name": "value",
      "type": "React.ReactNode",
      "declared_type": "React.ReactNode",
      "required": false,
      "description": "Right-aligned value shown in the title row.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 72
      }
    },
    {
      "name": "tag",
      "type": "React.ReactNode",
      "declared_type": "React.ReactNode",
      "required": false,
      "description": "Tag slot shown at the trailing edge.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 74
      }
    },
    {
      "name": "statusLabel",
      "type": "React.ReactNode",
      "declared_type": "React.ReactNode",
      "required": false,
      "description": "Status text rendered through ListItem.StatusIndicator.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 76
      }
    },
    {
      "name": "statusTone",
      "type": "\"neutral\" | \"info\" | \"success\" | \"warning\" | \"danger\" | undefined",
      "declared_type": "StatusTone",
      "required": false,
      "description": "Status color treatment for statusLabel.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 78
      },
      "values": [
        "danger",
        "info",
        "neutral",
        "success",
        "warning"
      ],
      "values_complete": true
    },
    {
      "name": "trailing",
      "type": "React.ReactNode",
      "declared_type": "React.ReactNode",
      "required": false,
      "description": "Custom trailing content.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 80
      }
    },
    {
      "name": "trailingIcon",
      "type": "React.ReactNode",
      "declared_type": "React.ReactNode",
      "required": false,
      "description": "Icon slot shown after other trailing content.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 82
      }
    },
    {
      "name": "chevron",
      "type": "boolean | undefined",
      "declared_type": "boolean",
      "required": false,
      "description": "Override for the disclosure chevron. Leave unset to derive it from interaction — any\npressable row shows one, except selection rows and rows with caller-owned trailing\ncontent. Pass `true` to force it on (e.g. a non-interactive row inside a pressable card),\nor `false` to force it off.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 89
      },
      "values": [
        false,
        true
      ],
      "values_complete": true
    },
    {
      "name": "className",
      "type": "string | undefined",
      "declared_type": "string",
      "required": false,
      "description": "",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 90
      }
    },
    {
      "name": "style",
      "type": "React.CSSProperties | undefined",
      "declared_type": "React.CSSProperties",
      "required": false,
      "description": "",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 91
      }
    },
    {
      "name": "divider",
      "type": "boolean | undefined",
      "declared_type": "boolean",
      "required": false,
      "description": "Shows a bottom divider when true.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 93
      },
      "values": [
        false,
        true
      ],
      "values_complete": true
    },
    {
      "name": "dividerMode",
      "type": "ListItemDividerMode | undefined",
      "declared_type": "ListItemDividerMode",
      "required": false,
      "description": "Divider alignment.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 95
      },
      "values": [
        "full-bleed",
        "inset"
      ],
      "values_complete": true
    },
    {
      "name": "padding",
      "type": "ListItemPadding | undefined",
      "declared_type": "ListItemPadding",
      "required": false,
      "description": "Row padding preset.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 97
      },
      "values": [
        "card",
        "flush",
        "sheet"
      ],
      "values_complete": true
    },
    {
      "name": "size",
      "type": "ListItemSize | undefined",
      "declared_type": "ListItemSize",
      "required": false,
      "description": "Row density. `sm` renders a compact row (32px leading slot). Defaults to `md`.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 99
      },
      "values": [
        "md",
        "sm"
      ],
      "values_complete": true
    },
    {
      "name": "surface",
      "type": "\"page\" | \"surface\" | undefined",
      "declared_type": "CdsSurface",
      "required": false,
      "description": "Row background on the `page | surface` scale. Defaults to `surface`\n(elevated card row); `page` sits flush on a page-level background.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 104
      },
      "values": [
        "page",
        "surface"
      ],
      "values_complete": true
    },
    {
      "name": "id",
      "type": "string | undefined",
      "declared_type": "string",
      "required": false,
      "description": "Optional id for the row container or interactive control.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 106
      }
    },
    {
      "name": "ariaControls",
      "type": "string | undefined",
      "declared_type": "string",
      "required": false,
      "description": "Id of content controlled by this row when used as a disclosure trigger.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 108
      }
    },
    {
      "name": "expanded",
      "type": "boolean | undefined",
      "declared_type": "boolean",
      "required": false,
      "description": "Expanded state announced for interactive rows.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 110
      },
      "values": [
        false,
        true
      ],
      "values_complete": true
    },
    {
      "name": "disabled",
      "type": "boolean | undefined",
      "declared_type": "boolean",
      "required": false,
      "description": "Dims the row and blocks presses. A disabled selection row keeps its radio/checkbox\nsemantics so the choice stays announced — it just can't be chosen.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 115
      },
      "values": [
        false,
        true
      ],
      "values_complete": true
    },
    {
      "name": "onPress",
      "type": "(() => void) | undefined",
      "declared_type": "() => void",
      "required": false,
      "description": "Called when the row is pressed.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 117
      }
    },
    {
      "name": "ariaLabel",
      "type": "string | undefined",
      "declared_type": "string",
      "required": false,
      "description": "Accessible label for interactive rows when visible copy is not sufficient.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 119
      }
    },
    {
      "name": "haptic",
      "type": "HapticFeedback | undefined",
      "declared_type": "HapticFeedback",
      "required": false,
      "description": "Haptic feedback for interactive row presses. Defaults to `true` (`light`).",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 121
      },
      "values": [
        "error",
        "heavy",
        "light",
        "medium",
        "selection",
        "success",
        "warning",
        false,
        true
      ],
      "values_complete": true
    },
    {
      "name": "testId",
      "type": "string | undefined",
      "declared_type": "string",
      "required": false,
      "description": "Test selector. Lands on the row's button when it is pressable, otherwise on the container.",
      "source": {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 123
      }
    }
  ],
  "prop_shapes": {},
  "examples": [],
  "tokens": [
    {
      "name": "--cds-size-48",
      "light": "48px",
      "dark": "48px"
    },
    {
      "name": "--cds-size-80",
      "light": "80px",
      "dark": "80px"
    },
    {
      "name": "--cds-size-64",
      "light": "64px",
      "dark": "64px"
    },
    {
      "name": "--cds-space-12",
      "light": "12px",
      "dark": "12px"
    },
    {
      "name": "--cds-space-8",
      "light": "8px",
      "dark": "8px"
    },
    {
      "name": "--cds-space-20",
      "light": "20px",
      "dark": "20px"
    },
    {
      "name": "--cds-space-24",
      "light": "24px",
      "dark": "24px"
    },
    {
      "name": "--cds-size-240",
      "light": "240px",
      "dark": "240px"
    },
    {
      "name": "--cds-type-body-size",
      "light": "1rem",
      "dark": "1rem"
    },
    {
      "name": "--cds-type-body-small-size",
      "light": "0.875rem",
      "dark": "0.875rem"
    },
    {
      "name": "--cds-text-primary",
      "light": "#141410",
      "dark": "#f3f1ed"
    },
    {
      "name": "--cds-text-secondary",
      "light": "#646260",
      "dark": "#ffffff99"
    },
    {
      "name": "--cds-bg-surface",
      "light": "#ffffff",
      "dark": "#1b1b18"
    },
    {
      "name": "--cds-bg-page",
      "light": "#f3f1ed",
      "dark": "#141410"
    },
    {
      "name": "--cds-divider",
      "light": "#e0ddd6",
      "dark": "#ffffff1a"
    }
  ],
  "visual_reference": {
    "stories": [
      {
        "id": "cloaked-design-system-organization-list-item--playground",
        "name": "Playground",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "Playground",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--playground&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--text-card-padding",
        "name": "Text Card Padding",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "TextCardPadding",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--text-card-padding&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--text-sheet-padding",
        "name": "Text Sheet Padding",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "TextSheetPadding",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--text-sheet-padding&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--text-zero-value",
        "name": "Text Zero Value",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "TextZeroValue",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--text-zero-value&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--icon-tile-leading",
        "name": "Icon Tile Leading",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "IconTileLeading",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--icon-tile-leading&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--arrow",
        "name": "Arrow",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "Arrow",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--arrow&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--selection-multiple",
        "name": "Selection Multiple",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "SelectionMultiple",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--selection-multiple&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--selection-single",
        "name": "Selection Single",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "SelectionSingle",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--selection-single&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--avatar-initials-leading",
        "name": "Avatar Initials Leading",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "AvatarInitialsLeading",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--avatar-initials-leading&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--custom-leading-marker",
        "name": "Custom Leading Marker",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "CustomLeadingMarker",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--custom-leading-marker&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--progress-variants",
        "name": "Progress Variants",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "ProgressVariants",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--progress-variants&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--with-tag",
        "name": "With Tag",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "WithTag",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--with-tag&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--with-status",
        "name": "With Status",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "WithStatus",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--with-status&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--mixed-list",
        "name": "Mixed List",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "MixedList",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--mixed-list&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--empty-state",
        "name": "Empty State",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "EmptyState",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--empty-state&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--stat",
        "name": "Stat",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "Stat",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--stat&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--icon-plate",
        "name": "Icon Plate",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "IconPlate",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--icon-plate&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--tone-matrix",
        "name": "Tone Matrix",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "ToneMatrix",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--tone-matrix&viewMode=story"
      },
      {
        "id": "cloaked-design-system-organization-list-item--dark-theme",
        "name": "Dark Theme",
        "title": "Cloaked Design System/Organization/List/Item",
        "exportName": "DarkTheme",
        "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
        "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
        "status": "preview",
        "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--dark-theme&viewMode=story"
      }
    ],
    "name": "ListItem",
    "id": "listitem",
    "category": "Organization / List"
  },
  "stories": [
    {
      "id": "cloaked-design-system-organization-list-item--playground",
      "name": "Playground",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "Playground",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--playground&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--text-card-padding",
      "name": "Text Card Padding",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "TextCardPadding",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--text-card-padding&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--text-sheet-padding",
      "name": "Text Sheet Padding",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "TextSheetPadding",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--text-sheet-padding&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--text-zero-value",
      "name": "Text Zero Value",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "TextZeroValue",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--text-zero-value&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--icon-tile-leading",
      "name": "Icon Tile Leading",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "IconTileLeading",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--icon-tile-leading&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--arrow",
      "name": "Arrow",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "Arrow",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--arrow&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--selection-multiple",
      "name": "Selection Multiple",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "SelectionMultiple",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--selection-multiple&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--selection-single",
      "name": "Selection Single",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "SelectionSingle",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--selection-single&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--avatar-initials-leading",
      "name": "Avatar Initials Leading",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "AvatarInitialsLeading",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--avatar-initials-leading&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--custom-leading-marker",
      "name": "Custom Leading Marker",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "CustomLeadingMarker",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--custom-leading-marker&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--progress-variants",
      "name": "Progress Variants",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "ProgressVariants",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--progress-variants&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--with-tag",
      "name": "With Tag",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "WithTag",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--with-tag&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--with-status",
      "name": "With Status",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "WithStatus",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--with-status&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--mixed-list",
      "name": "Mixed List",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "MixedList",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--mixed-list&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--empty-state",
      "name": "Empty State",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "EmptyState",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--empty-state&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--stat",
      "name": "Stat",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "Stat",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--stat&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--icon-plate",
      "name": "Icon Plate",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "IconPlate",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--icon-plate&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--tone-matrix",
      "name": "Tone Matrix",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "ToneMatrix",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--tone-matrix&viewMode=story"
    },
    {
      "id": "cloaked-design-system-organization-list-item--dark-theme",
      "name": "Dark Theme",
      "title": "Cloaked Design System/Organization/List/Item",
      "exportName": "DarkTheme",
      "source_path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
      "source_digest": "dde33cb538e065f7c9228b2dcaf91feae5c9a37cd1f40fd8b84d52fc664863c1",
      "status": "preview",
      "local_url": "/storybook/iframe.html?id=cloaked-design-system-organization-list-item--dark-theme&viewMode=story"
    }
  ],
  "stories_source": {
    "path": "packages/design-system/src/components/organization/ListItem/ListItem.stories.tsx",
    "code": "import React from 'react';\nimport type { Meta, StoryObj } from '@storybook/react-vite';\nimport { List } from '../List/List';\nimport { Avatar } from '../../primitives/Avatar/Avatar';\nimport { IconTile } from '../../primitives/IconTile/IconTile';\nimport { Tag } from '../../primitives/Tag/Tag';\nimport { HStack } from '../../layout/HStack/HStack';\nimport { hapticArgType, selectArgType, STATUS_TONE_OPTIONS } from '../../../storybook/controlOptions';\nimport { FEATURE_TONES } from '../../../styles/featureTone';\nimport {\n    LIST_ITEM_PLAYGROUND_ARG_TYPES,\n    LIST_ITEM_PLAYGROUND_ARGS,\n    SelectionExample,\n    renderListItemPlayground,\n    renderMixedList,\n    renderProgressExamples,\n    renderStatRows,\n    renderToneMatrix,\n    type ListItemPlaygroundArgs,\n} from './ListItemRow/ListItemRow.stories.fixtures';\nimport type { ListItemTone } from './ListItem';\nimport styles from './ListItem.stories.module.scss';\n\nconst LIST_ITEM_TONES = [...STATUS_TONE_OPTIONS, 'brand', ...FEATURE_TONES] as const satisfies readonly ListItemTone[];\n\nconst meta: Meta<typeof List.Item> = {\n    title: 'Cloaked Design System/Organization/List/Item',\n    component: List.Item,\n    parameters: {\n        docs: {\n            description: {\n                component:\n                    'Slot-first list row: compose it from named slots rather than subclassing — `leadingGlyph` ' +\n                    '+ `tone` (or a custom `leading` node), `overline`/`title`/`description`, and a trailing edge ' +\n                    '(`value`, `tag`, `statusLabel`, or `trailing`/`trailingIcon`). Behavior variants come from ' +\n                    'compound parts: `List.Item.Selection` (checkbox/radio rows), `List.Item.Progress` ' +\n                    '(bar/ring/steps), `List.Item.Stat` (key-value), `List.Item.Empty`, and the `List.Item.Icon` ' +\n                    'tone plate. A pressable row (`onPress`) auto-reveals a chevron. Inside a `List` the container ' +\n                    \"owns separators, so a row's own `divider` is ignored there.\",\n            },\n        },\n    },\n    argTypes: {\n        leading: {\n            control: false,\n            description:\n                'Custom leading node (`Avatar`, brand logo, or a `List.Item.Icon` plate). Overrides `leadingGlyph`.',\n        },\n        leadingGlyph: {\n            ...selectArgType(['data-removal', 'dark-web-monitoring', 'guard', 'password', 'check', 'phone']),\n            description: 'DS icon rendered as a tone `IconTile` in the leading slot; colored by `tone`.',\n        },\n        trailing: {\n            control: false,\n            description: 'Custom trailing node, rendered before `trailingIcon`.',\n        },\n        trailingIcon: {\n            control: false,\n            description: 'Icon slot after trailing content (e.g. `List.Item.ArrowIcon`).',\n        },\n        tag: {\n            control: false,\n            description: 'Trailing `Tag` slot.',\n        },\n        onPress: {\n            control: false,\n            description: 'Press handler. A pressable row auto-shows a chevron unless `chevron` overrides it.',\n        },\n        padding: {\n            ...selectArgType(['card', 'sheet', 'flush']),\n            description: 'Row padding preset: `card` (in-card), `sheet` (bottom-sheet), `flush` (no inline padding).',\n        },\n        dividerMode: {\n            ...selectArgType(['full-bleed', 'inset']),\n            description: 'Bottom hairline alignment: `full-bleed` edge-to-edge, or `inset` under the content.',\n        },\n        tone: {\n            ...selectArgType(LIST_ITEM_TONES),\n            description:\n                'Tone for the generated leading `IconTile`: status | `brand` | feature (monitoring/guard/identity).',\n        },\n        statusTone: {\n            ...selectArgType(STATUS_TONE_OPTIONS),\n            description: 'Color treatment for the `statusLabel` status text.',\n        },\n        haptic: {\n            ...hapticArgType,\n            description: 'Haptic on press for interactive rows. Defaults to `true` (`light`).',\n        },\n    },\n    decorators: [\n        Story => (\n            <div className={styles.frame}>\n                <Story />\n            </div>\n        ),\n    ],\n};\nexport default meta;\ntype Story = StoryObj<typeof List.Item>;\n\nexport const Playground: StoryObj<ListItemPlaygroundArgs> = {\n    args: LIST_ITEM_PLAYGROUND_ARGS,\n    argTypes: LIST_ITEM_PLAYGROUND_ARG_TYPES,\n    render: args => renderListItemPlayground(args),\n};\n\nexport const TextCardPadding: Story = {\n    args: { title: 'Spam calls blocked', value: '1847' },\n};\n\nexport const TextSheetPadding: Story = {\n    args: { padding: 'sheet', title: 'Spam calls blocked', value: '1847' },\n};\n\nexport const TextZeroValue: Story = {\n    args: { title: 'Data removed', value: 0 },\n};\n\nexport const IconTileLeading: Story = {\n    args: {\n        leadingGlyph: 'data-removal',\n        tone: 'monitoring',\n        title: 'Data removal',\n        value: '1,847',\n        statusLabel: 'Active',\n        statusTone: 'success',\n    },\n};\n\nexport const Arrow: Story = {\n    parameters: {\n        docs: {\n            description: {\n                story: 'Pressable row with a trailing `ArrowIcon` affordance instead of the default chevron.',\n            },\n        },\n    },\n    args: {\n        leadingGlyph: 'guard',\n        tone: 'guard',\n        title: 'spokeo.com',\n        description: 'Click to solve the CAPTCHA',\n        trailingIcon: <List.Item.ArrowIcon />,\n        onPress: () => {},\n        testId: 'list-item-arrow',\n    },\n};\n\nexport const SelectionMultiple: StoryObj = {\n    parameters: {\n        docs: { description: { story: '`List.Item.Selection` with `selectionMode=\"multiple\"` — a checkbox row.' } },\n    },\n    render: () => <SelectionExample mode='multiple' />,\n};\n\nexport const SelectionSingle: StoryObj = {\n    parameters: {\n        docs: { description: { story: '`List.Item.Selection` with `selectionMode=\"single\"` — a radio row.' } },\n    },\n    render: () => <SelectionExample mode='single' />,\n};\n\nexport const AvatarInitialsLeading: Story = {\n    args: {\n        leading: <Avatar type='initials' size='md' initial='M' />,\n        title: 'SSN was leaked on dark web',\n        description: 'Bank account was opened',\n    },\n};\n\nexport const CustomLeadingMarker: Story = {\n    args: {\n        leading: <IconTile tone='success' glyph='check' label='Verified' />,\n        title: 'Verified broker match',\n        description: 'Uses IconTile directly only when a custom marker is needed',\n    },\n};\n\nexport const ProgressVariants: StoryObj = {\n    parameters: {\n        docs: { description: { story: '`List.Item.Progress` in all three kinds — `steps`, `ring`, and `bar`.' } },\n    },\n    render: () => renderProgressExamples(),\n};\n\nexport const WithTag: Story = {\n    args: {\n        leadingGlyph: 'guard',\n        tone: 'warning',\n        title: 'Spam call blocked',\n        description: '(322) 142-8932',\n        tag: (\n            <Tag tone='neutral' emphasis='subtle'>\n                SMS\n            </Tag>\n        ),\n    },\n};\n\nexport const WithStatus: Story = {\n    args: {\n        leadingGlyph: 'dark-web-monitoring',\n        tone: 'monitoring',\n        title: 'Dark web monitoring',\n        statusLabel: 'Active',\n        statusTone: 'success',\n    },\n};\n\nexport const MixedList: StoryObj = {\n    parameters: {\n        docs: {\n            description: { story: 'Progress, tagged, and avatar rows composed together — a realistic activity list.' },\n        },\n    },\n    render: () => renderMixedList(),\n};\n\nexport const EmptyState: StoryObj = {\n    parameters: {\n        docs: { description: { story: '`List.Item.Empty` — the placeholder row shown when a list has no items.' } },\n    },\n    render: () => <List.Item.Empty message='No activity yet' />,\n};\n\nexport const Stat: StoryObj = {\n    parameters: {\n        docs: {\n            description: {\n                story: '`List.Item.Stat` — a key-value statistic row with an inset divider (set `divider={false}` on the last).',\n            },\n        },\n    },\n    render: () => renderStatRows(),\n};\n\nexport const IconPlate: StoryObj = {\n    parameters: {\n        docs: {\n            description: {\n                story:\n                    'The `List.Item.Icon` tone plate across all 9 `ListItemTone` values. A standard row builds this ' +\n                    'for you from `leadingGlyph` + `tone`; reach for it directly only for a custom `leading` marker.',\n            },\n        },\n    },\n    render: () => (\n        <HStack gap={12} wrap>\n            {LIST_ITEM_TONES.map(tone => (\n                <List.Item.Icon key={tone} tone={tone} initial={tone.charAt(0)} label={tone} />\n            ))}\n        </HStack>\n    ),\n};\n\nexport const ToneMatrix: StoryObj = {\n    parameters: {\n        docs: {\n            description: {\n                story: 'Every `ListItemTone` on the generated leading `IconTile`: status, `brand`, and product-feature tones.',\n            },\n        },\n    },\n    render: () => renderToneMatrix(),\n};\n\nexport const DarkTheme: StoryObj = {\n    globals: { theme: 'dark' },\n    parameters: {\n        docs: { description: { story: 'A progress row on the dark theme surface.' } },\n    },\n    render: () => (\n        <List.Item.Progress\n            leadingGlyph='data-removal'\n            tone='monitoring'\n            title='Removal request sent'\n            description='Spokeo.com'\n            progress={{ kind: 'steps', current: 1, total: 4, label: '1 of 4', ariaLabel: 'Removal progress' }}\n        />\n    ),\n};\n"
  },
  "links": {
    "human": "/component-listitem",
    "json": "/data/components/listitem.json",
    "markdown": "/data/components/listitem.md",
    "storybook": "/storybook/?path=/story/cloaked-design-system-organization-list-item--playground"
  },
  "contract_status": "preview",
  "contract_kind": "source-derived",
  "approval": "required",
  "api": {
    "method": "typescript-type-checker",
    "typescript_version": "5.9.3",
    "public_export": "List",
    "public_path": "List.Item",
    "import_path": "@cloakedinc/design-system",
    "root_kind": "component",
    "entrypoints": [
      {
        "name": "List.Item",
        "signature": 1,
        "visibility": "public",
        "source": {
          "path": "packages/design-system/src/components/organization/ListItem/ListItem.tsx",
          "line": 39
        },
        "props_type": "ListItemProps",
        "props": [
          {
            "name": "leading",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Custom leading content (e.g. an `Avatar`, brand logo, or `List.Item.Icon` plate).",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 54
            }
          },
          {
            "name": "leadingGlyph",
            "type": "\"number\" | \"info\" | \"guard\" | \"arrow-left\" | \"arrow-right\" | \"arrow-up\" | \"arrow-down\" | \"chevron-down\" | \"chevron-up\" | \"chevron-left\" | \"chevron-right\" | \"caret-down\" | \"caret-up\" | \"trend-up\" | \"trend-down\" | \"collapse\" | \"expand\" | \"dropdown-collapse\" | \"dropdown-expand\" | \"close\" | \"clear\" | \"menu\" | \"copy\" | \"search\" | \"add\" | \"share\" | \"phone\" | \"sim\" | \"account\" | \"family\" | \"home\" | \"wifi\" | \"cart\" | \"vpn\" | \"lock\" | \"block\" | \"timer\" | \"check\" | \"send\" | \"filter\" | \"scan\" | \"log\" | \"trash\" | \"missed\" | \"call\" | \"voicemail\" | \"sms\" | \"email\" | \"data-removal\" | \"dark-web-monitoring\" | \"cloaked-pay\" | \"cloaked-ai\" | \"sms-guard\" | \"email-guard\" | \"call-guard\" | \"card\" | \"password\" | \"bell\" | \"circle-outline\" | \"dot\" | \"settings\" | \"clock\" | \"mail\" | \"message\" | \"user\" | \"upload\" | undefined",
            "declared_type": "GlyphName",
            "required": false,
            "description": "Registered glyph rendered as a tone `IconTile` in the leading slot.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 56
            },
            "values": [
              "account",
              "add",
              "arrow-down",
              "arrow-left",
              "arrow-right",
              "arrow-up",
              "bell",
              "block",
              "call-guard",
              "call",
              "card",
              "caret-down",
              "caret-up",
              "cart",
              "check",
              "chevron-down",
              "chevron-left",
              "chevron-right",
              "chevron-up",
              "circle-outline",
              "clear",
              "cloaked-ai",
              "cloaked-pay",
              "clock",
              "close",
              "collapse",
              "copy",
              "dark-web-monitoring",
              "data-removal",
              "dot",
              "dropdown-collapse",
              "dropdown-expand",
              "email-guard",
              "email",
              "expand",
              "family",
              "filter",
              "guard",
              "home",
              "info",
              "lock",
              "log",
              "mail",
              "menu",
              "message",
              "missed",
              "number",
              "password",
              "phone",
              "scan",
              "search",
              "send",
              "settings",
              "share",
              "sim",
              "sms-guard",
              "sms",
              "timer",
              "trash",
              "trend-down",
              "trend-up",
              "upload",
              "user",
              "voicemail",
              "vpn",
              "wifi"
            ],
            "values_complete": true
          },
          {
            "name": "tone",
            "type": "ListItemTone | undefined",
            "declared_type": "ListItemTone",
            "required": false,
            "description": "Tone for the generated leading `IconTile`.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 58
            },
            "values": [
              "brand",
              "danger",
              "guard",
              "identity",
              "info",
              "monitoring",
              "neutral",
              "success",
              "warning"
            ],
            "values_complete": true
          },
          {
            "name": "overline",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Small copy shown above the title.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 60
            }
          },
          {
            "name": "overlineTrailing",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Accessory pinned to the top-right, aligned with the overline (e.g. a count badge).",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 62
            }
          },
          {
            "name": "title",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": true,
            "description": "Primary row title.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 64
            }
          },
          {
            "name": "titleLines",
            "type": "number | undefined",
            "declared_type": "number",
            "required": false,
            "description": "Wraps the title across up to this many lines before clamping. Defaults to single-line truncation.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 66
            }
          },
          {
            "name": "description",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Secondary row copy.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 68
            }
          },
          {
            "name": "descriptionLines",
            "type": "number | undefined",
            "declared_type": "number",
            "required": false,
            "description": "Wraps the description across up to this many lines before clamping. Defaults to single-line truncation.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 70
            }
          },
          {
            "name": "value",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Right-aligned value shown in the title row.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 72
            }
          },
          {
            "name": "tag",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Tag slot shown at the trailing edge.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 74
            }
          },
          {
            "name": "statusLabel",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Status text rendered through ListItem.StatusIndicator.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 76
            }
          },
          {
            "name": "statusTone",
            "type": "\"neutral\" | \"info\" | \"success\" | \"warning\" | \"danger\" | undefined",
            "declared_type": "StatusTone",
            "required": false,
            "description": "Status color treatment for statusLabel.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 78
            },
            "values": [
              "danger",
              "info",
              "neutral",
              "success",
              "warning"
            ],
            "values_complete": true
          },
          {
            "name": "trailing",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Custom trailing content.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 80
            }
          },
          {
            "name": "trailingIcon",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Icon slot shown after other trailing content.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 82
            }
          },
          {
            "name": "chevron",
            "type": "boolean | undefined",
            "declared_type": "boolean",
            "required": false,
            "description": "Override for the disclosure chevron. Leave unset to derive it from interaction — any\npressable row shows one, except selection rows and rows with caller-owned trailing\ncontent. Pass `true` to force it on (e.g. a non-interactive row inside a pressable card),\nor `false` to force it off.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 89
            },
            "values": [
              false,
              true
            ],
            "values_complete": true
          },
          {
            "name": "className",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 90
            }
          },
          {
            "name": "style",
            "type": "React.CSSProperties | undefined",
            "declared_type": "React.CSSProperties",
            "required": false,
            "description": "",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 91
            }
          },
          {
            "name": "divider",
            "type": "boolean | undefined",
            "declared_type": "boolean",
            "required": false,
            "description": "Shows a bottom divider when true.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 93
            },
            "values": [
              false,
              true
            ],
            "values_complete": true
          },
          {
            "name": "dividerMode",
            "type": "ListItemDividerMode | undefined",
            "declared_type": "ListItemDividerMode",
            "required": false,
            "description": "Divider alignment.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 95
            },
            "values": [
              "full-bleed",
              "inset"
            ],
            "values_complete": true
          },
          {
            "name": "padding",
            "type": "ListItemPadding | undefined",
            "declared_type": "ListItemPadding",
            "required": false,
            "description": "Row padding preset.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 97
            },
            "values": [
              "card",
              "flush",
              "sheet"
            ],
            "values_complete": true
          },
          {
            "name": "size",
            "type": "ListItemSize | undefined",
            "declared_type": "ListItemSize",
            "required": false,
            "description": "Row density. `sm` renders a compact row (32px leading slot). Defaults to `md`.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 99
            },
            "values": [
              "md",
              "sm"
            ],
            "values_complete": true
          },
          {
            "name": "surface",
            "type": "\"page\" | \"surface\" | undefined",
            "declared_type": "CdsSurface",
            "required": false,
            "description": "Row background on the `page | surface` scale. Defaults to `surface`\n(elevated card row); `page` sits flush on a page-level background.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 104
            },
            "values": [
              "page",
              "surface"
            ],
            "values_complete": true
          },
          {
            "name": "id",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Optional id for the row container or interactive control.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 106
            }
          },
          {
            "name": "ariaControls",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Id of content controlled by this row when used as a disclosure trigger.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 108
            }
          },
          {
            "name": "expanded",
            "type": "boolean | undefined",
            "declared_type": "boolean",
            "required": false,
            "description": "Expanded state announced for interactive rows.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 110
            },
            "values": [
              false,
              true
            ],
            "values_complete": true
          },
          {
            "name": "disabled",
            "type": "boolean | undefined",
            "declared_type": "boolean",
            "required": false,
            "description": "Dims the row and blocks presses. A disabled selection row keeps its radio/checkbox\nsemantics so the choice stays announced — it just can't be chosen.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 115
            },
            "values": [
              false,
              true
            ],
            "values_complete": true
          },
          {
            "name": "onPress",
            "type": "(() => void) | undefined",
            "declared_type": "() => void",
            "required": false,
            "description": "Called when the row is pressed.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 117
            }
          },
          {
            "name": "ariaLabel",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Accessible label for interactive rows when visible copy is not sufficient.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 119
            }
          },
          {
            "name": "haptic",
            "type": "HapticFeedback | undefined",
            "declared_type": "HapticFeedback",
            "required": false,
            "description": "Haptic feedback for interactive row presses. Defaults to `true` (`light`).",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 121
            },
            "values": [
              "error",
              "heavy",
              "light",
              "medium",
              "selection",
              "success",
              "warning",
              false,
              true
            ],
            "values_complete": true
          },
          {
            "name": "testId",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Test selector. Lands on the row's button when it is pressable, otherwise on the container.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 123
            }
          }
        ],
        "branches": [],
        "constraints": [],
        "extraction_status": "extracted"
      },
      {
        "name": "List.Item.Selection",
        "signature": 1,
        "visibility": "public",
        "source": {
          "path": "packages/design-system/src/components/organization/ListItem/ListItem.tsx",
          "line": 46
        },
        "props_type": "ListItemSelectionProps",
        "props": [
          {
            "name": "selectionMode",
            "type": "ListItemSelectionMode | undefined",
            "declared_type": "ListItemSelectionMode",
            "required": false,
            "description": "Selection control shape.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 132
            },
            "values": [
              "multiple",
              "single"
            ],
            "values_complete": true,
            "default": "'multiple'",
            "default_kind": "source-expression"
          },
          {
            "name": "selectionPlacement",
            "type": "ListItemSelectionPlacement | undefined",
            "declared_type": "ListItemSelectionPlacement",
            "required": false,
            "description": "Where the control renders; `leading` replaces the leading icon. Defaults to `trailing`.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 134
            },
            "values": [
              "leading",
              "trailing"
            ],
            "values_complete": true,
            "default": "'trailing'",
            "default_kind": "source-expression"
          },
          {
            "name": "selected",
            "type": "boolean | undefined",
            "declared_type": "boolean",
            "required": false,
            "description": "Current selected state.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 136
            },
            "values": [
              false,
              true
            ],
            "values_complete": true,
            "default": "false",
            "default_kind": "source-expression"
          },
          {
            "name": "onSelectedChange",
            "type": "((selected: boolean) => void) | undefined",
            "declared_type": "(selected: boolean) => void",
            "required": false,
            "description": "Called with the next selected state when pressed.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 138
            }
          },
          {
            "name": "surface",
            "type": "\"page\" | \"surface\" | undefined",
            "declared_type": "CdsSurface",
            "required": false,
            "description": "Row background on the `page | surface` scale. Defaults to `surface`\n(elevated card row); `page` sits flush on a page-level background.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 104
            },
            "values": [
              "page",
              "surface"
            ],
            "values_complete": true
          },
          {
            "name": "overline",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Small copy shown above the title.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 60
            }
          },
          {
            "name": "id",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Optional id for the row container or interactive control.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 106
            }
          },
          {
            "name": "style",
            "type": "React.CSSProperties | undefined",
            "declared_type": "React.CSSProperties",
            "required": false,
            "description": "",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 91
            }
          },
          {
            "name": "title",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": true,
            "description": "Primary row title.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 64
            }
          },
          {
            "name": "leading",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Custom leading content (e.g. an `Avatar`, brand logo, or `List.Item.Icon` plate).",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 54
            }
          },
          {
            "name": "leadingGlyph",
            "type": "\"number\" | \"info\" | \"guard\" | \"arrow-left\" | \"arrow-right\" | \"arrow-up\" | \"arrow-down\" | \"chevron-down\" | \"chevron-up\" | \"chevron-left\" | \"chevron-right\" | \"caret-down\" | \"caret-up\" | \"trend-up\" | \"trend-down\" | \"collapse\" | \"expand\" | \"dropdown-collapse\" | \"dropdown-expand\" | \"close\" | \"clear\" | \"menu\" | \"copy\" | \"search\" | \"add\" | \"share\" | \"phone\" | \"sim\" | \"account\" | \"family\" | \"home\" | \"wifi\" | \"cart\" | \"vpn\" | \"lock\" | \"block\" | \"timer\" | \"check\" | \"send\" | \"filter\" | \"scan\" | \"log\" | \"trash\" | \"missed\" | \"call\" | \"voicemail\" | \"sms\" | \"email\" | \"data-removal\" | \"dark-web-monitoring\" | \"cloaked-pay\" | \"cloaked-ai\" | \"sms-guard\" | \"email-guard\" | \"call-guard\" | \"card\" | \"password\" | \"bell\" | \"circle-outline\" | \"dot\" | \"settings\" | \"clock\" | \"mail\" | \"message\" | \"user\" | \"upload\" | undefined",
            "declared_type": "GlyphName",
            "required": false,
            "description": "Registered glyph rendered as a tone `IconTile` in the leading slot.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 56
            },
            "values": [
              "account",
              "add",
              "arrow-down",
              "arrow-left",
              "arrow-right",
              "arrow-up",
              "bell",
              "block",
              "call-guard",
              "call",
              "card",
              "caret-down",
              "caret-up",
              "cart",
              "check",
              "chevron-down",
              "chevron-left",
              "chevron-right",
              "chevron-up",
              "circle-outline",
              "clear",
              "cloaked-ai",
              "cloaked-pay",
              "clock",
              "close",
              "collapse",
              "copy",
              "dark-web-monitoring",
              "data-removal",
              "dot",
              "dropdown-collapse",
              "dropdown-expand",
              "email-guard",
              "email",
              "expand",
              "family",
              "filter",
              "guard",
              "home",
              "info",
              "lock",
              "log",
              "mail",
              "menu",
              "message",
              "missed",
              "number",
              "password",
              "phone",
              "scan",
              "search",
              "send",
              "settings",
              "share",
              "sim",
              "sms-guard",
              "sms",
              "timer",
              "trash",
              "trend-down",
              "trend-up",
              "upload",
              "user",
              "voicemail",
              "vpn",
              "wifi"
            ],
            "values_complete": true
          },
          {
            "name": "tone",
            "type": "ListItemTone | undefined",
            "declared_type": "ListItemTone",
            "required": false,
            "description": "Tone for the generated leading `IconTile`.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 58
            },
            "values": [
              "brand",
              "danger",
              "guard",
              "identity",
              "info",
              "monitoring",
              "neutral",
              "success",
              "warning"
            ],
            "values_complete": true
          },
          {
            "name": "overlineTrailing",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Accessory pinned to the top-right, aligned with the overline (e.g. a count badge).",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 62
            }
          },
          {
            "name": "titleLines",
            "type": "number | undefined",
            "declared_type": "number",
            "required": false,
            "description": "Wraps the title across up to this many lines before clamping. Defaults to single-line truncation.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 66
            }
          },
          {
            "name": "description",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Secondary row copy.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 68
            }
          },
          {
            "name": "descriptionLines",
            "type": "number | undefined",
            "declared_type": "number",
            "required": false,
            "description": "Wraps the description across up to this many lines before clamping. Defaults to single-line truncation.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 70
            }
          },
          {
            "name": "value",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Right-aligned value shown in the title row.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 72
            }
          },
          {
            "name": "tag",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Tag slot shown at the trailing edge.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 74
            }
          },
          {
            "name": "statusLabel",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Status text rendered through ListItem.StatusIndicator.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 76
            }
          },
          {
            "name": "statusTone",
            "type": "\"neutral\" | \"info\" | \"success\" | \"warning\" | \"danger\" | undefined",
            "declared_type": "StatusTone",
            "required": false,
            "description": "Status color treatment for statusLabel.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 78
            },
            "values": [
              "danger",
              "info",
              "neutral",
              "success",
              "warning"
            ],
            "values_complete": true
          },
          {
            "name": "trailing",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Custom trailing content.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 80
            }
          },
          {
            "name": "trailingIcon",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Icon slot shown after other trailing content.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 82
            }
          },
          {
            "name": "chevron",
            "type": "boolean | undefined",
            "declared_type": "boolean",
            "required": false,
            "description": "Override for the disclosure chevron. Leave unset to derive it from interaction — any\npressable row shows one, except selection rows and rows with caller-owned trailing\ncontent. Pass `true` to force it on (e.g. a non-interactive row inside a pressable card),\nor `false` to force it off.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 89
            },
            "values": [
              false,
              true
            ],
            "values_complete": true
          },
          {
            "name": "className",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 90
            }
          },
          {
            "name": "divider",
            "type": "boolean | undefined",
            "declared_type": "boolean",
            "required": false,
            "description": "Shows a bottom divider when true.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 93
            },
            "values": [
              false,
              true
            ],
            "values_complete": true
          },
          {
            "name": "dividerMode",
            "type": "ListItemDividerMode | undefined",
            "declared_type": "ListItemDividerMode",
            "required": false,
            "description": "Divider alignment.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 95
            },
            "values": [
              "full-bleed",
              "inset"
            ],
            "values_complete": true
          },
          {
            "name": "padding",
            "type": "ListItemPadding | undefined",
            "declared_type": "ListItemPadding",
            "required": false,
            "description": "Row padding preset.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 97
            },
            "values": [
              "card",
              "flush",
              "sheet"
            ],
            "values_complete": true
          },
          {
            "name": "size",
            "type": "ListItemSize | undefined",
            "declared_type": "ListItemSize",
            "required": false,
            "description": "Row density. `sm` renders a compact row (32px leading slot). Defaults to `md`.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 99
            },
            "values": [
              "md",
              "sm"
            ],
            "values_complete": true
          },
          {
            "name": "ariaControls",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Id of content controlled by this row when used as a disclosure trigger.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 108
            }
          },
          {
            "name": "expanded",
            "type": "boolean | undefined",
            "declared_type": "boolean",
            "required": false,
            "description": "Expanded state announced for interactive rows.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 110
            },
            "values": [
              false,
              true
            ],
            "values_complete": true
          },
          {
            "name": "disabled",
            "type": "boolean | undefined",
            "declared_type": "boolean",
            "required": false,
            "description": "Dims the row and blocks presses. A disabled selection row keeps its radio/checkbox\nsemantics so the choice stays announced — it just can't be chosen.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 115
            },
            "values": [
              false,
              true
            ],
            "values_complete": true
          },
          {
            "name": "ariaLabel",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Accessible label for interactive rows when visible copy is not sufficient.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 119
            }
          },
          {
            "name": "haptic",
            "type": "HapticFeedback | undefined",
            "declared_type": "HapticFeedback",
            "required": false,
            "description": "Haptic feedback for interactive row presses. Defaults to `true` (`light`).",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 121
            },
            "values": [
              "error",
              "heavy",
              "light",
              "medium",
              "selection",
              "success",
              "warning",
              false,
              true
            ],
            "values_complete": true
          },
          {
            "name": "testId",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Test selector. Lands on the row's button when it is pressable, otherwise on the container.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 123
            }
          }
        ],
        "branches": [],
        "constraints": [],
        "extraction_status": "extracted"
      },
      {
        "name": "List.Item.Progress",
        "signature": 1,
        "visibility": "public",
        "source": {
          "path": "packages/design-system/src/components/organization/ListItem/ListItem.tsx",
          "line": 67
        },
        "props_type": "ListItemProgressProps",
        "props": [
          {
            "name": "progress",
            "type": "number | ListItemProgress",
            "declared_type": "number | ListItemProgress",
            "required": true,
            "description": "Progress configuration rendered in the row.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 147
            }
          },
          {
            "name": "leading",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Custom leading content (e.g. an `Avatar`, brand logo, or `List.Item.Icon` plate).",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 54
            }
          },
          {
            "name": "leadingGlyph",
            "type": "\"number\" | \"info\" | \"guard\" | \"arrow-left\" | \"arrow-right\" | \"arrow-up\" | \"arrow-down\" | \"chevron-down\" | \"chevron-up\" | \"chevron-left\" | \"chevron-right\" | \"caret-down\" | \"caret-up\" | \"trend-up\" | \"trend-down\" | \"collapse\" | \"expand\" | \"dropdown-collapse\" | \"dropdown-expand\" | \"close\" | \"clear\" | \"menu\" | \"copy\" | \"search\" | \"add\" | \"share\" | \"phone\" | \"sim\" | \"account\" | \"family\" | \"home\" | \"wifi\" | \"cart\" | \"vpn\" | \"lock\" | \"block\" | \"timer\" | \"check\" | \"send\" | \"filter\" | \"scan\" | \"log\" | \"trash\" | \"missed\" | \"call\" | \"voicemail\" | \"sms\" | \"email\" | \"data-removal\" | \"dark-web-monitoring\" | \"cloaked-pay\" | \"cloaked-ai\" | \"sms-guard\" | \"email-guard\" | \"call-guard\" | \"card\" | \"password\" | \"bell\" | \"circle-outline\" | \"dot\" | \"settings\" | \"clock\" | \"mail\" | \"message\" | \"user\" | \"upload\" | undefined",
            "declared_type": "GlyphName",
            "required": false,
            "description": "Registered glyph rendered as a tone `IconTile` in the leading slot.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 56
            },
            "values": [
              "account",
              "add",
              "arrow-down",
              "arrow-left",
              "arrow-right",
              "arrow-up",
              "bell",
              "block",
              "call-guard",
              "call",
              "card",
              "caret-down",
              "caret-up",
              "cart",
              "check",
              "chevron-down",
              "chevron-left",
              "chevron-right",
              "chevron-up",
              "circle-outline",
              "clear",
              "cloaked-ai",
              "cloaked-pay",
              "clock",
              "close",
              "collapse",
              "copy",
              "dark-web-monitoring",
              "data-removal",
              "dot",
              "dropdown-collapse",
              "dropdown-expand",
              "email-guard",
              "email",
              "expand",
              "family",
              "filter",
              "guard",
              "home",
              "info",
              "lock",
              "log",
              "mail",
              "menu",
              "message",
              "missed",
              "number",
              "password",
              "phone",
              "scan",
              "search",
              "send",
              "settings",
              "share",
              "sim",
              "sms-guard",
              "sms",
              "timer",
              "trash",
              "trend-down",
              "trend-up",
              "upload",
              "user",
              "voicemail",
              "vpn",
              "wifi"
            ],
            "values_complete": true
          },
          {
            "name": "tone",
            "type": "ListItemTone | undefined",
            "declared_type": "ListItemTone",
            "required": false,
            "description": "Tone for the generated leading `IconTile`.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 58
            },
            "values": [
              "brand",
              "danger",
              "guard",
              "identity",
              "info",
              "monitoring",
              "neutral",
              "success",
              "warning"
            ],
            "values_complete": true
          },
          {
            "name": "overline",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Small copy shown above the title.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 60
            }
          },
          {
            "name": "overlineTrailing",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Accessory pinned to the top-right, aligned with the overline (e.g. a count badge).",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 62
            }
          },
          {
            "name": "title",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": true,
            "description": "Primary row title.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 64
            }
          },
          {
            "name": "titleLines",
            "type": "number | undefined",
            "declared_type": "number",
            "required": false,
            "description": "Wraps the title across up to this many lines before clamping. Defaults to single-line truncation.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 66
            }
          },
          {
            "name": "description",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Secondary row copy.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 68
            }
          },
          {
            "name": "descriptionLines",
            "type": "number | undefined",
            "declared_type": "number",
            "required": false,
            "description": "Wraps the description across up to this many lines before clamping. Defaults to single-line truncation.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 70
            }
          },
          {
            "name": "value",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Right-aligned value shown in the title row.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 72
            }
          },
          {
            "name": "tag",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Tag slot shown at the trailing edge.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 74
            }
          },
          {
            "name": "statusLabel",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Status text rendered through ListItem.StatusIndicator.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 76
            }
          },
          {
            "name": "statusTone",
            "type": "\"neutral\" | \"info\" | \"success\" | \"warning\" | \"danger\" | undefined",
            "declared_type": "StatusTone",
            "required": false,
            "description": "Status color treatment for statusLabel.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 78
            },
            "values": [
              "danger",
              "info",
              "neutral",
              "success",
              "warning"
            ],
            "values_complete": true
          },
          {
            "name": "trailing",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Custom trailing content.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 80
            }
          },
          {
            "name": "trailingIcon",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "Icon slot shown after other trailing content.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 82
            }
          },
          {
            "name": "chevron",
            "type": "boolean | undefined",
            "declared_type": "boolean",
            "required": false,
            "description": "Override for the disclosure chevron. Leave unset to derive it from interaction — any\npressable row shows one, except selection rows and rows with caller-owned trailing\ncontent. Pass `true` to force it on (e.g. a non-interactive row inside a pressable card),\nor `false` to force it off.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 89
            },
            "values": [
              false,
              true
            ],
            "values_complete": true
          },
          {
            "name": "className",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 90
            }
          },
          {
            "name": "style",
            "type": "React.CSSProperties | undefined",
            "declared_type": "React.CSSProperties",
            "required": false,
            "description": "",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 91
            }
          },
          {
            "name": "divider",
            "type": "boolean | undefined",
            "declared_type": "boolean",
            "required": false,
            "description": "Shows a bottom divider when true.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 93
            },
            "values": [
              false,
              true
            ],
            "values_complete": true
          },
          {
            "name": "dividerMode",
            "type": "ListItemDividerMode | undefined",
            "declared_type": "ListItemDividerMode",
            "required": false,
            "description": "Divider alignment.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 95
            },
            "values": [
              "full-bleed",
              "inset"
            ],
            "values_complete": true
          },
          {
            "name": "padding",
            "type": "ListItemPadding | undefined",
            "declared_type": "ListItemPadding",
            "required": false,
            "description": "Row padding preset.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 97
            },
            "values": [
              "card",
              "flush",
              "sheet"
            ],
            "values_complete": true
          },
          {
            "name": "size",
            "type": "ListItemSize | undefined",
            "declared_type": "ListItemSize",
            "required": false,
            "description": "Row density. `sm` renders a compact row (32px leading slot). Defaults to `md`.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 99
            },
            "values": [
              "md",
              "sm"
            ],
            "values_complete": true
          },
          {
            "name": "surface",
            "type": "\"page\" | \"surface\" | undefined",
            "declared_type": "CdsSurface",
            "required": false,
            "description": "Row background on the `page | surface` scale. Defaults to `surface`\n(elevated card row); `page` sits flush on a page-level background.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 104
            },
            "values": [
              "page",
              "surface"
            ],
            "values_complete": true
          },
          {
            "name": "id",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Optional id for the row container or interactive control.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 106
            }
          },
          {
            "name": "ariaControls",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Id of content controlled by this row when used as a disclosure trigger.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 108
            }
          },
          {
            "name": "expanded",
            "type": "boolean | undefined",
            "declared_type": "boolean",
            "required": false,
            "description": "Expanded state announced for interactive rows.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 110
            },
            "values": [
              false,
              true
            ],
            "values_complete": true
          },
          {
            "name": "disabled",
            "type": "boolean | undefined",
            "declared_type": "boolean",
            "required": false,
            "description": "Dims the row and blocks presses. A disabled selection row keeps its radio/checkbox\nsemantics so the choice stays announced — it just can't be chosen.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 115
            },
            "values": [
              false,
              true
            ],
            "values_complete": true
          },
          {
            "name": "onPress",
            "type": "(() => void) | undefined",
            "declared_type": "() => void",
            "required": false,
            "description": "Called when the row is pressed.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 117
            }
          },
          {
            "name": "ariaLabel",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Accessible label for interactive rows when visible copy is not sufficient.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 119
            }
          },
          {
            "name": "haptic",
            "type": "HapticFeedback | undefined",
            "declared_type": "HapticFeedback",
            "required": false,
            "description": "Haptic feedback for interactive row presses. Defaults to `true` (`light`).",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 121
            },
            "values": [
              "error",
              "heavy",
              "light",
              "medium",
              "selection",
              "success",
              "warning",
              false,
              true
            ],
            "values_complete": true
          },
          {
            "name": "testId",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Test selector. Lands on the row's button when it is pressable, otherwise on the container.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 123
            }
          }
        ],
        "branches": [],
        "constraints": [],
        "extraction_status": "extracted"
      },
      {
        "name": "List.Item.Stat",
        "signature": 1,
        "visibility": "public",
        "source": {
          "path": "packages/design-system/src/components/organization/ListItem/ListItemStat/ListItemStat.tsx",
          "line": 10
        },
        "props_type": "ListItemStatProps",
        "props": [
          {
            "name": "label",
            "type": "string",
            "declared_type": "string",
            "required": true,
            "description": "The key, rendered as secondary text on the left.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 156
            }
          },
          {
            "name": "value",
            "type": "string | number",
            "declared_type": "string | number",
            "required": true,
            "description": "The statistic, rendered as primary text on the right.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 158
            }
          },
          {
            "name": "divider",
            "type": "boolean | undefined",
            "declared_type": "boolean",
            "required": false,
            "description": "Shows the row divider when true.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 160
            },
            "values": [
              false,
              true
            ],
            "values_complete": true,
            "default": "true",
            "default_kind": "source-expression"
          },
          {
            "name": "testId",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Test selector; lands on the wrapper around the row and its divider.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 162
            }
          }
        ],
        "branches": [],
        "constraints": [],
        "extraction_status": "extracted"
      },
      {
        "name": "List.Item.Empty",
        "signature": 1,
        "visibility": "public",
        "source": {
          "path": "packages/design-system/src/components/organization/ListItem/ListItemEmpty/ListItemEmpty.tsx",
          "line": 10
        },
        "props_type": "ListItemEmptyProps",
        "props": [
          {
            "name": "message",
            "type": "string",
            "declared_type": "string",
            "required": true,
            "description": "The empty-state copy, rendered as secondary text.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 171
            }
          },
          {
            "name": "testId",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Test selector for the placeholder container.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 173
            }
          }
        ],
        "branches": [],
        "constraints": [],
        "extraction_status": "extracted"
      },
      {
        "name": "List.Item.Icon",
        "signature": 1,
        "visibility": "public",
        "source": {
          "path": "packages/design-system/src/components/organization/ListItem/ListItemIcon/ListItemIcon.tsx",
          "line": 11
        },
        "props_type": "ListItemIconProps",
        "props": [
          {
            "name": "children",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": false,
            "description": "",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 181
            }
          },
          {
            "name": "initial",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Fallback initial shown when children are absent.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 183
            }
          },
          {
            "name": "tone",
            "type": "ListItemTone | undefined",
            "declared_type": "ListItemTone",
            "required": false,
            "description": "Tokenized icon color treatment.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 185
            },
            "values": [
              "brand",
              "danger",
              "guard",
              "identity",
              "info",
              "monitoring",
              "neutral",
              "success",
              "warning"
            ],
            "values_complete": true,
            "default": "'neutral'",
            "default_kind": "source-expression"
          },
          {
            "name": "label",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Accessible label for meaningful icons.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 187
            }
          },
          {
            "name": "background",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Custom background color.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 189
            }
          },
          {
            "name": "foreground",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Custom foreground color.",
            "source": {
              "path": "packages/design-system/src/components/organization/ListItem/types.ts",
              "line": 191
            }
          }
        ],
        "branches": [],
        "constraints": [],
        "extraction_status": "extracted"
      },
      {
        "name": "List.Item.StatusIndicator",
        "signature": 1,
        "visibility": "public",
        "source": {
          "path": "packages/design-system/src/components/status/StatusIndicator/StatusIndicator.tsx",
          "line": 25
        },
        "props_type": "StatusIndicatorProps",
        "props": [
          {
            "name": "children",
            "type": "React.ReactNode",
            "declared_type": "React.ReactNode",
            "required": true,
            "description": "",
            "source": {
              "path": "packages/design-system/src/components/status/StatusIndicator/StatusIndicator.tsx",
              "line": 13
            }
          },
          {
            "name": "tone",
            "type": "\"neutral\" | \"info\" | \"success\" | \"warning\" | \"danger\" | undefined",
            "declared_type": "StatusTone",
            "required": false,
            "description": "Semantic status color for the dot; maps to the `--cds-status-*` tokens. Defaults to `neutral`.",
            "source": {
              "path": "packages/design-system/src/components/status/StatusIndicator/StatusIndicator.tsx",
              "line": 15
            },
            "values": [
              "danger",
              "info",
              "neutral",
              "success",
              "warning"
            ],
            "values_complete": true,
            "default": "'neutral'",
            "default_kind": "source-expression"
          },
          {
            "name": "className",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "",
            "source": {
              "path": "packages/design-system/src/components/status/StatusIndicator/StatusIndicator.tsx",
              "line": 16
            }
          },
          {
            "name": "testId",
            "type": "string | undefined",
            "declared_type": "string",
            "required": false,
            "description": "Optional test selector.",
            "source": {
              "path": "packages/design-system/src/components/status/StatusIndicator/StatusIndicator.tsx",
              "line": 18
            }
          }
        ],
        "branches": [],
        "constraints": [],
        "extraction_status": "extracted"
      },
      {
        "name": "List.Item.ArrowIcon",
        "signature": 1,
        "visibility": "public",
        "source": {
          "path": "packages/design-system/src/components/organization/ListItem/ListItemActionIcons/ListItemActionIcons.tsx",
          "line": 13
        },
        "props_type": null,
        "props": [],
        "branches": [],
        "constraints": [],
        "extraction_status": "extracted"
      },
      {
        "name": "List.Item.ChevronIcon",
        "signature": 1,
        "visibility": "public",
        "source": {
          "path": "packages/design-system/src/components/organization/ListItem/ListItemActionIcons/ListItemActionIcons.tsx",
          "line": 20
        },
        "props_type": null,
        "props": [],
        "branches": [],
        "constraints": [],
        "extraction_status": "extracted"
      },
      {
        "name": "List.Item.CopyIcon",
        "signature": 1,
        "visibility": "public",
        "source": {
          "path": "packages/design-system/src/components/organization/ListItem/ListItemActionIcons/ListItemActionIcons.tsx",
          "line": 27
        },
        "props_type": null,
        "props": [],
        "branches": [],
        "constraints": [],
        "extraction_status": "extracted"
      },
      {
        "name": "List.Item.MailIcon",
        "signature": 1,
        "visibility": "public",
        "source": {
          "path": "packages/design-system/src/components/organization/ListItem/ListItemActionIcons/ListItemActionIcons.tsx",
          "line": 34
        },
        "props_type": null,
        "props": [],
        "branches": [],
        "constraints": [],
        "extraction_status": "extracted"
      },
      {
        "name": "List.Item.PhoneIcon",
        "signature": 1,
        "visibility": "public",
        "source": {
          "path": "packages/design-system/src/components/organization/ListItem/ListItemActionIcons/ListItemActionIcons.tsx",
          "line": 41
        },
        "props_type": null,
        "props": [],
        "branches": [],
        "constraints": [],
        "extraction_status": "extracted"
      },
      {
        "name": "List.Item.MessageIcon",
        "signature": 1,
        "visibility": "public",
        "source": {
          "path": "packages/design-system/src/components/organization/ListItem/ListItemActionIcons/ListItemActionIcons.tsx",
          "line": 48
        },
        "props_type": null,
        "props": [],
        "branches": [],
        "constraints": [],
        "extraction_status": "extracted"
      }
    ],
    "type_sources": [
      {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 9,
        "name": "ListItemDividerMode",
        "code": "export type ListItemDividerMode = 'full-bleed' | 'inset';"
      },
      {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 10,
        "name": "ListItemPadding",
        "code": "export type ListItemPadding = 'card' | 'sheet' | 'flush';"
      },
      {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 14,
        "name": "ListItemSize",
        "code": "export type ListItemSize = 'sm' | 'md';"
      },
      {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 15,
        "name": "ListItemSelectionMode",
        "code": "export type ListItemSelectionMode = 'single' | 'multiple';"
      },
      {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 25,
        "name": "ListItemSelectionPlacement",
        "code": "export type ListItemSelectionPlacement = 'leading' | 'trailing';"
      },
      {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 26,
        "name": "ListItemTone",
        "code": "export type ListItemTone = StatusTone | 'brand' | FeatureTone;"
      },
      {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 29,
        "name": "ListItemProgressBase",
        "code": "interface ListItemProgressBase {\n    /** Progress value used by ring/bar variants. */\n    value?: number;\n    /** Completed step count for step progress. */\n    current?: number;\n    /** Total step count for step progress. */\n    total?: number;\n    /** Optional text shown beside the title. */\n    label?: string;\n    /** Accessible progress label. */\n    ariaLabel?: string;\n}"
      },
      {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 42,
        "name": "ListItemInlineProgress",
        "code": "export type ListItemInlineProgress =\n    | (ListItemProgressBase & { kind: 'bar'; value: number })\n    | (ListItemProgressBase & { kind: 'steps' });"
      },
      {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 45,
        "name": "ListItemRingProgress",
        "code": "export type ListItemRingProgress = ListItemProgressBase & { kind?: 'ring' };"
      },
      {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 46,
        "name": "ListItemProgress",
        "code": "export type ListItemProgress = ListItemInlineProgress | ListItemRingProgress;"
      },
      {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 52,
        "name": "ListItemProps",
        "code": "export interface ListItemProps {\n    /** Custom leading content (e.g. an `Avatar`, brand logo, or `List.Item.Icon` plate). */\n    leading?: React.ReactNode;\n    /** Registered glyph rendered as a tone `IconTile` in the leading slot. */\n    leadingGlyph?: GlyphName;\n    /** Tone for the generated leading `IconTile`. */\n    tone?: ListItemTone;\n    /** Small copy shown above the title. */\n    overline?: React.ReactNode;\n    /** Accessory pinned to the top-right, aligned with the overline (e.g. a count badge). */\n    overlineTrailing?: React.ReactNode;\n    /** Primary row title. */\n    title: React.ReactNode;\n    /** Wraps the title across up to this many lines before clamping. Defaults to single-line truncation. */\n    titleLines?: number;\n    /** Secondary row copy. */\n    description?: React.ReactNode;\n    /** Wraps the description across up to this many lines before clamping. Defaults to single-line truncation. */\n    descriptionLines?: number;\n    /** Right-aligned value shown in the title row. */\n    value?: React.ReactNode;\n    /** Tag slot shown at the trailing edge. */\n    tag?: React.ReactNode;\n    /** Status text rendered through ListItem.StatusIndicator. */\n    statusLabel?: React.ReactNode;\n    /** Status color treatment for statusLabel. */\n    statusTone?: StatusTone;\n    /** Custom trailing content. */\n    trailing?: React.ReactNode;\n    /** Icon slot shown after other trailing content. */\n    trailingIcon?: React.ReactNode;\n    /**\n     * Override for the disclosure chevron. Leave unset to derive it from interaction — any\n     * pressable row shows one, except selection rows and rows with caller-owned trailing\n     * content. Pass `true` to force it on (e.g. a non-interactive row inside a pressable card),\n     * or `false` to force it off.\n     */\n    chevron?: boolean;\n    className?: string;\n    style?: React.CSSProperties;\n    /** Shows a bottom divider when true. */\n    divider?: boolean;\n    /** Divider alignment. */\n    dividerMode?: ListItemDividerMode;\n    /** Row padding preset. */\n    padding?: ListItemPadding;\n    /** Row density. `sm` renders a compact row (32px leading slot). Defaults to `md`. */\n    size?: ListItemSize;\n    /**\n     * Row background on the `page | surface` scale. Defaults to `surface`\n     * (elevated card row); `page` sits flush on a page-level background.\n     */\n    surface?: CdsSurface;\n    /** Optional id for the row container or interactive control. */\n    id?: string;\n    /** Id of content controlled by this row when used as a disclosure trigger. */\n    ariaControls?: string;\n    /** Expanded state announced for interactive rows. */\n    expanded?: boolean;\n    /**\n     * Dims the row and blocks presses. A disabled selection row keeps its radio/checkbox\n     * semantics so the choice stays announced — it just can't be chosen.\n     */\n    disabled?: boolean;\n    /** Called when the row is pressed. */\n    onPress?: () => void;\n    /** Accessible label for interactive rows when visible copy is not sufficient. */\n    ariaLabel?: string;\n    /** Haptic feedback for interactive row presses. Defaults to `true` (`light`). */\n    haptic?: HapticFeedback;\n    /** Test selector. Lands on the row's button when it is pressable, otherwise on the container. */\n    testId?: string;\n}"
      },
      {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 130,
        "name": "ListItemSelectionProps",
        "code": "export interface ListItemSelectionProps extends Omit<ListItemProps, 'onPress'> {\n    /** Selection control shape. */\n    selectionMode?: ListItemSelectionMode;\n    /** Where the control renders; `leading` replaces the leading icon. Defaults to `trailing`. */\n    selectionPlacement?: ListItemSelectionPlacement;\n    /** Current selected state. */\n    selected?: boolean;\n    /** Called with the next selected state when pressed. */\n    onSelectedChange?: (selected: boolean) => void;\n}"
      },
      {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 145,
        "name": "ListItemProgressProps",
        "code": "export interface ListItemProgressProps extends ListItemProps {\n    /** Progress configuration rendered in the row. */\n    progress: number | ListItemProgress;\n}"
      },
      {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 154,
        "name": "ListItemStatProps",
        "code": "export interface ListItemStatProps {\n    /** The key, rendered as secondary text on the left. */\n    label: string;\n    /** The statistic, rendered as primary text on the right. */\n    value: string | number;\n    /** Shows the row divider when true. */\n    divider?: boolean;\n    /** Test selector; lands on the wrapper around the row and its divider. */\n    testId?: string;\n}"
      },
      {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 169,
        "name": "ListItemEmptyProps",
        "code": "export interface ListItemEmptyProps {\n    /** The empty-state copy, rendered as secondary text. */\n    message: string;\n    /** Test selector for the placeholder container. */\n    testId?: string;\n}"
      },
      {
        "path": "packages/design-system/src/components/organization/ListItem/types.ts",
        "line": 180,
        "name": "ListItemIconProps",
        "code": "export interface ListItemIconProps {\n    children?: React.ReactNode;\n    /** Fallback initial shown when children are absent. */\n    initial?: string;\n    /** Tokenized icon color treatment. */\n    tone?: ListItemTone;\n    /** Accessible label for meaningful icons. */\n    label?: string;\n    /** Custom background color. */\n    background?: string;\n    /** Custom foreground color. */\n    foreground?: string;\n}"
      },
      {
        "path": "packages/design-system/src/components/status/StatusIndicator/StatusIndicator.tsx",
        "line": 12,
        "name": "StatusIndicatorProps",
        "code": "export interface StatusIndicatorProps {\n    children: React.ReactNode;\n    /** Semantic status color for the dot; maps to the `--cds-status-*` tokens. Defaults to `neutral`. */\n    tone?: StatusTone;\n    className?: string;\n    /** Optional test selector. */\n    testId?: string;\n}"
      },
      {
        "path": "packages/design-system/src/styles/featureTone.ts",
        "line": 9,
        "name": "FEATURE_TONES",
        "code": "FEATURE_TONES = ['monitoring', 'guard', 'identity'] as const"
      },
      {
        "path": "packages/design-system/src/styles/featureTone.ts",
        "line": 11,
        "name": "FeatureTone",
        "code": "export type FeatureTone = (typeof FEATURE_TONES)[number];"
      },
      {
        "path": "packages/design-system/src/styles/statusTone.ts",
        "line": 7,
        "name": "STATUS_TONES",
        "code": "STATUS_TONES = ['neutral', 'info', 'success', 'warning', 'danger'] as const"
      },
      {
        "path": "packages/design-system/src/styles/statusTone.ts",
        "line": 9,
        "name": "StatusTone",
        "code": "export type StatusTone = (typeof STATUS_TONES)[number];"
      },
      {
        "path": "packages/design-system/src/tokens/CdsHaptic.ts",
        "line": 6,
        "name": "HapticFeedback",
        "code": "export type HapticFeedback = boolean | HapticType;"
      },
      {
        "path": "packages/design-system/src/tokens/CdsSurface.ts",
        "line": 5,
        "name": "PUI_SURFACES",
        "code": "PUI_SURFACES = ['page', 'surface'] as const"
      },
      {
        "path": "packages/design-system/src/tokens/CdsSurface.ts",
        "line": 7,
        "name": "CdsSurface",
        "code": "export type CdsSurface = (typeof PUI_SURFACES)[number];"
      },
      {
        "path": "packages/design-system/src/tokens/HapticType.ts",
        "line": 2,
        "name": "HapticType",
        "code": "export type HapticType = 'light' | 'medium' | 'heavy' | 'success' | 'warning' | 'error' | 'selection';"
      },
      {
        "path": "packages/design-system/src/types/GlyphName.ts",
        "line": 10,
        "name": "GLYPH_NAMES",
        "code": "GLYPH_NAMES = [\n    // Action\n    'arrow-left',\n    'arrow-right',\n    'arrow-up',\n    'arrow-down',\n    'chevron-down',\n    'chevron-up',\n    'chevron-left',\n    'chevron-right',\n    'caret-down',\n    'caret-up',\n    // Trend lines, for a change in a figure over time. Distinct from the arrows and carets above,\n    // which point at a direction without implying a measurement moved.\n    'trend-up',\n    'trend-down',\n    'collapse',\n    'expand',\n    'dropdown-collapse',\n    'dropdown-expand',\n    'close',\n    'clear',\n    'menu',\n    'copy',\n    'search',\n    'add',\n    // Renders the `send` drawing; a separate name for share-sheet actions.\n    'share',\n    // System\n    'phone',\n    'sim',\n    'account',\n    'family',\n    'home',\n    'wifi',\n    'cart',\n    'vpn',\n    'lock',\n    'block',\n    'timer',\n    'check',\n    'send',\n    'info',\n    'number',\n    'filter',\n    'scan',\n    'log',\n    'trash',\n    // Inbox\n    'missed',\n    'call',\n    'voicemail',\n    'sms',\n    'email',\n    // Feature\n    'data-removal',\n    'dark-web-monitoring',\n    'cloaked-pay',\n    'cloaked-ai',\n    'sms-guard',\n    'email-guard',\n    'call-guard',\n    'card',\n    'password',\n    'guard',\n    // Legacy aliases (kept for back-compat; render the Figma glyph)\n    'bell',\n    'circle-outline',\n    'dot',\n    'settings',\n    'clock',\n    'mail',\n    'message',\n    'user',\n    'upload',\n] as const"
      },
      {
        "path": "packages/design-system/src/types/GlyphName.ts",
        "line": 87,
        "name": "GlyphName",
        "code": "export type GlyphName = (typeof GLYPH_NAMES)[number];"
      }
    ],
    "defaults_policy": "Only explicit destructured parameter initializers are extracted. Other runtime defaults remain in implementation source."
  },
  "platforms": {
    "implemented": [
      "web"
    ],
    "native": "Imported design guidance only; no native implementation or parity verification in this preview.",
    "react": {
      "implementation": "local",
      "status": "preview",
      "parity": "web-reference"
    },
    "vue": {
      "implementation": "absent",
      "parity": "not-verified",
      "status": "reference-only"
    },
    "swift": {
      "implementation": "absent",
      "parity": "not-verified",
      "status": "reference-only"
    },
    "kotlin": {
      "implementation": "absent",
      "parity": "not-verified",
      "status": "reference-only"
    }
  },
  "missing_facts": [
    {
      "code": "human-review-pending",
      "detail": "This local preview has no recorded human design or engineering sign-off."
    },
    {
      "code": "platform-parity-unverified",
      "detail": "Vue, Swift and Kotlin implementations are absent from this package; platform parity has not been verified."
    },
    {
      "code": "figma-mapping-unverified",
      "detail": "No current component-level Figma node and immutable revision have been verified for this contract."
    }
  ],
  "review": {
    "local_status": "not-reviewed",
    "source_approval": null,
    "imported_spec_status": null,
    "spec_origin": "local-authored",
    "local_spec_source_status": "preview",
    "imported_source_revision": "f96f416e1c3bfbfaffcd155a88b87b18b8bb25f1",
    "note": "Inherited specification status is provenance, not approval of the current local implementation or extracted contract."
  }
}
