@synerise/ds-list-item 1.4.7 → 1.4.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/README.md +27 -9
  3. package/package.json +7 -7
package/CHANGELOG.md CHANGED
@@ -3,6 +3,14 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [1.4.9](https://github.com/Synerise/synerise-design/compare/@synerise/ds-list-item@1.4.8...@synerise/ds-list-item@1.4.9) (2026-03-20)
7
+
8
+ **Note:** Version bump only for package @synerise/ds-list-item
9
+
10
+ ## [1.4.8](https://github.com/Synerise/synerise-design/compare/@synerise/ds-list-item@1.4.7...@synerise/ds-list-item@1.4.8) (2026-03-09)
11
+
12
+ **Note:** Version bump only for package @synerise/ds-list-item
13
+
6
14
  ## [1.4.7](https://github.com/Synerise/synerise-design/compare/@synerise/ds-list-item@1.4.6...@synerise/ds-list-item@1.4.7) (2026-02-23)
7
15
 
8
16
  **Note:** Version bump only for package @synerise/ds-list-item
package/README.md CHANGED
@@ -11,6 +11,8 @@ ListItem UI Component
11
11
  npm i @synerise/ds-list-item
12
12
  or
13
13
  yarn add @synerise/ds-list-item
14
+ or
15
+ pnpm add @synerise/ds-list-item
14
16
  ```
15
17
 
16
18
  ## Usage
@@ -33,19 +35,19 @@ import ListItem from '@synerise/ds-list-item'
33
35
  | className | Extra styles | string | - |
34
36
  | children | ListItem content | React.ReactNode | - |
35
37
  | checked | for type="select" it renders a check icon as suffix, for other types only an additional classname | `boolean` | - |
36
- | copyable | Allow copying value by clicking | `boolean` | - |
37
- | copyHint | Content that disaplys on hover if copyable | `ReactNode` | - |
38
- | copyValue | Value that gets copied to clipboard | `string` | - |
39
- | copyTooltip | Content displayed in tooltip after copying | `ReactNode` | - |
38
+ | copyable | Allow copying value by clicking. Prefer object form `{ copyValue, copiedLabel?, timeToReset?, delayClickEvent? }` | `boolean` | `Copyable` | - |
39
+ | copyHint | **Deprecated** — no longer rendered | `ReactNode` | - |
40
+ | copyValue | **Deprecated** — use `copyable: { copyValue }` instead | `string` | - |
41
+ | copyTooltip | **Deprecated** — no longer rendered | `ReactNode` | - |
40
42
  | description | 2nd line of content in item | `ReactNode` | - |
41
43
  | disabled | renders disabled / unclickable item | `boolean` | - |
42
44
  | higher | Applies to `type "divider"` only | `boolean` | - |
43
45
  | highlight | string to highlight in items | `string` | - |
44
- | hoverTooltipProps | Props for hover tooltip. see rc-trigger for details | `TriggerProps & { ref?: React.LegacyRef<TriggerHandle> }` | - |
46
+ | popoverProps | Options for the hover tooltip popover (used with `renderHoverTooltip`) | `{ placement?, getPopupContainer?, offsetConfig?, flipConfig?, shiftConfig?, initialOpen? }` | - |
45
47
  | key | unique key | `string / number` | - |
46
48
  | level | Applies to `type "divider"` only | `number` | - |
47
49
  | onItemHover | hoverHandler | `(item: ItemData<MouseEvent<HTMLDivElement>>) => void` | - |
48
- | onClick | onClick handler | `(item: ItemData<MouseEvent<HTMLDivElement>>) => void` | - |
50
+ | onClick | onClick/onKeyDown handler | `(item: ItemData<MouseEvent<HTMLDivElement> \| KeyboardEvent<HTMLDivElement>>) => void` | - |
49
51
  | ordered | renders ordinal numbers in items | `boolean` | - |
50
52
  | parent | if true will display an arrow icon next to label | `boolean` | - |
51
53
  | prefixel | prefix element | `ReactNode` &#124; `AddonRenderer` | - |
@@ -55,12 +57,28 @@ import ListItem from '@synerise/ds-list-item'
55
57
  | suffixel | suffix element. Item with type="select" and checked also displays a check icon | `ReactNode` &#124; `AddonRenderer` | - |
56
58
  | suffixVisibilityTrigger | drives suffix visibility | `'hover'` &#124; `'default'` | - |
57
59
  | text | prop alternative to `children` | `ReactNode` | - |
58
- | timeToHideTooltip | copy tooltip delay | `number` | - |
60
+ | timeToHideTooltip | **Deprecated** — no longer rendered | `number` | - |
59
61
  | title | title attribute (a11y prop) | `string` | - |
60
- | tooltipProps | Tooltip props for "copied" tooltip. See @synerise/ds-tooltip | `TooltipProps` | - |
61
- | type | Type of the list item | `"default"` &#124; `"danger"` &#124; `"divider"` &#124; `"select"` | - |
62
+ | tooltipProps | **Deprecated** — no longer rendered | `TooltipProps` | - |
63
+ | type | Type of the list item | `"default"` &#124; `"danger"` &#124; `"divider"` &#124; `"select"` &#124; `"header"` | - |
62
64
  | featured | featured item will have a blue label and blue prefixel / suffixel icons | `boolean` | - |
65
+ | selected | additional selected state | `boolean` | - |
66
+ | itemKey | stable key used in `ItemData` callback payload; falls back to a stable UUID | `string \| number` | - |
67
+ | subMenu | inline collapsible sub-list; clicking the item toggles it open/closed | `ListItemProps[]` | - |
68
+ | indentLevel | left indent depth; each level adds 20px | `number` | - |
69
+ | direction | text direction | `'ltr'` &#124; `'rtl'` | - |
70
+
71
+
72
+ ### Copyable
63
73
 
74
+ ```typescript
75
+ type Copyable = {
76
+ copyValue: string;
77
+ copiedLabel?: ReactNode; // label shown temporarily after copy
78
+ timeToReset?: number; // ms to show copiedLabel (default 1000)
79
+ delayClickEvent?: number | false; // ms to delay onClick after copy (default 700)
80
+ };
81
+ ```
64
82
 
65
83
  ### AddonRenderer
66
84
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@synerise/ds-list-item",
3
- "version": "1.4.7",
3
+ "version": "1.4.9",
4
4
  "description": "ListItem UI Component for the Synerise Design System",
5
5
  "license": "ISC",
6
6
  "repository": "Synerise/synerise-design",
@@ -36,11 +36,11 @@
36
36
  "types": "dist/index.d.ts",
37
37
  "dependencies": {
38
38
  "@floating-ui/react": "^0.27.16",
39
- "@synerise/ds-divider": "^1.2.17",
40
- "@synerise/ds-icon": "^1.14.1",
41
- "@synerise/ds-popover": "^1.5.1",
42
- "@synerise/ds-tooltip": "^1.4.7",
43
- "@synerise/ds-utils": "^1.6.0",
39
+ "@synerise/ds-divider": "^1.3.1",
40
+ "@synerise/ds-icon": "^1.15.0",
41
+ "@synerise/ds-popover": "^1.5.2",
42
+ "@synerise/ds-tooltip": "^1.4.9",
43
+ "@synerise/ds-utils": "^1.7.0",
44
44
  "classnames": "^2.5.1",
45
45
  "uuid": "^8.3.2"
46
46
  },
@@ -50,5 +50,5 @@
50
50
  "react": ">=16.9.0 <= 18.3.1",
51
51
  "styled-components": "^5.3.3"
52
52
  },
53
- "gitHead": "2997f77d657c1aed2fc39901d3e0b8f88b05cc53"
53
+ "gitHead": "8efc031fa688c0b87c7b3915bae93546bb63bcac"
54
54
  }