@synerise/ds-unordered-list 1.1.53 → 1.1.55

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.1.55](https://github.com/Synerise/synerise-design/compare/@synerise/ds-unordered-list@1.1.54...@synerise/ds-unordered-list@1.1.55) (2026-08-11)
+
+**Note:** Version bump only for package @synerise/ds-unordered-list
+
+## [1.1.54](https://github.com/Synerise/synerise-design/compare/@synerise/ds-unordered-list@1.1.53...@synerise/ds-unordered-list@1.1.54) (2026-07-23)
+
+**Note:** Version bump only for package @synerise/ds-unordered-list
+
 ## [1.1.53](https://github.com/Synerise/synerise-design/compare/@synerise/ds-unordered-list@1.1.52...@synerise/ds-unordered-list@1.1.53) (2026-06-17)
 
 **Note:** Version bump only for package @synerise/ds-unordered-list

package/CLAUDE.md

@@ -0,0 +1,85 @@
+# UnorderedList (`@synerise/ds-unordered-list`)
+
+> A recursive, nestable unordered list with optional index formatter, prefix/suffix slots, and a section label.
+
+## Package structure
+
+```
+src/
+ Unordered-list.tsx — main component; renders label + <ul> + items recursively
+ Unordered-list.types.ts — UnorderedListItem, UnorderedListProps, deprecated ListProps
+ Unordered-list.styles.ts — UnorderedList (ul), Label, ContentAbove styled components
+ index.ts — public exports
+ Elements/
+ Item/Item.tsx — single <li>; renders indexFormatter, prefixel, label, suffixel, and nested NestedList
+ Item/Item.styles.ts — ItemWrapper (li), IndexFormatterWrapper
+ __specs__/
+ Ordered-list.spec.tsx — Vitest tests (note: spec file is misnamed "Ordered-list")
+```
+
+## Public exports
+
+### `UnorderedList` (default export)
+
+| Prop | Type | Default | Description |
+|------|------|---------|-------------|
+| `data` | `UnorderedListItem[]` | — (required) | Items to render |
+| `indexFormatter` | `(index: number) => ReactNode` | — | Renders a custom prefix before each item (e.g. ` - `, ` ● `) |
+| `text` | `ReactNode` | — | Optional section label rendered above the list via `FormFieldLabel` |
+| `className` | `string` | — | CSS class on the root `<div>` |
+
+### `UnorderedListItem`
+
+| Field | Type | Description |
+|-------|------|-------------|
+| `id` | `string` | Required unique key |
+| `label` | `ReactNode` | Item display content |
+| `index` | `number` | Numeric index passed to `indexFormatter` |
+| `prefixel` | `ReactNode` | Rendered before `label` |
+| `suffixel` | `ReactNode` | Rendered after `label` |
+| `subMenu` | `UnorderedListItem[]` | Child items; renders a nested `UnorderedList` when present |
+| `subMenuProps` | `Omit<UnorderedListProps, 'data'>` | Props forwarded to the nested `UnorderedList` (e.g. overriding `indexFormatter` for the sub-level) |
+| `text` | `ReactNode` | Label for the nested list (passed down to nested `UnorderedList.text`) |
+
+### `UnorderedListProps`
+
+Type re-export.
+
+### `ListProps` _(deprecated)_
+
+`@deprecated` alias for `UnorderedListProps`. Do not use.
+
+## Usage patterns
+
+```tsx
+import UnorderedList from '@synerise/ds-unordered-list';
+import type { UnorderedListItem } from '@synerise/ds-unordered-list';
+
+<UnorderedList
+ text="Section heading"
+ indexFormatter={(i) => ` ${i + 1}. `}
+ data={[
+ { id: '0', index: 0, label: 'Item A' },
+ {
+ id: '1', index: 1, label: 'Item B',
+ subMenu: [{ id: '2', index: 0, label: 'Child B1' }],
+ },
+ ]}
+/>
+```
+
+## Styling
+
+`Unordered-list.styles.ts`. The `<ul>` styled component accepts an optional `listStyle` prop that sets `list-style-type`; this is **not** exposed on `UnorderedListProps` — it is an internal styled-component prop. Nested `<ul>` elements get `margin-left: 20px`.
+
+## Key dependencies
+
+- `@synerise/ds-form-field` — `FormFieldLabel` for the optional `text` section label
+- `@synerise/ds-icon` — available for use as `prefixel`/`suffixel` (not imported in main component)
+
+## Implementation notes
+
+- **Circular dependency avoidance** — `Item` does not import `UnorderedList` directly. Instead, the parent passes `NestedList={UnorderedList}` as a prop to `Item`, breaking the circular reference.
+- **`index` field on `UnorderedListItem` is overridden** — the parent maps over `data` and passes `index={i}` (the array index) to `Item`, discarding the `index` field from the item object: `data.map(({ index, ..item }, i) => <Item index={i} ..item />)`. The `index` field on the item itself is effectively unused.
+- **Spec file is misnamed** — `__specs__/Ordered-list.spec.tsx` tests `UnorderedList` but is named "Ordered-list".
+- **Uses Vitest**.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-unordered-list",
-  "version": "1.1.53",
+  "version": "1.1.55",
   "description": "UnorderedList UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -17,6 +17,7 @@
   "files": [
     "/dist",
     "CHANGELOG.md",
+    "CLAUDE.md",
     "README.md",
     "package.json",
     "LICENSE.md"
@@ -41,8 +42,8 @@
   ],
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@synerise/ds-form-field": "^1.3.23",
-    "@synerise/ds-icon": "^1.18.4"
+    "@synerise/ds-form-field": "^1.3.25",
+    "@synerise/ds-icon": "^1.18.5"
   },
   "peerDependencies": {
     "@synerise/ds-core": "*",
@@ -50,5 +51,5 @@
     "styled-components": "^5.3.3",
     "vitest": "4"
   },
-  "gitHead": "d8c64070f58f14e3fb1bfbcbf00d1e3b8fd51eb8"
+  "gitHead": "6df24ed12cd5f276d8eccde730591807982e3385"
 }