@harborclient/sdk 1.1.8 → 1.1.10

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 (57) hide show
  1. package/dist/components/Resizable/ResizeHandle.d.ts +7 -2
  2. package/dist/components/Resizable/ResizeHandle.d.ts.map +1 -1
  3. package/dist/components/Resizable/ResizeHandle.js +6 -2
  4. package/dist/components/SidebarItem/SidebarColorDot.d.ts.map +1 -1
  5. package/dist/components/SidebarItem/SidebarColorDot.js +1 -1
  6. package/dist/components/SidebarItem/SidebarCommitItem.d.ts +7 -1
  7. package/dist/components/SidebarItem/SidebarCommitItem.d.ts.map +1 -1
  8. package/dist/components/SidebarItem/SidebarCommitItem.js +4 -2
  9. package/dist/components/SidebarItem/SidebarEnvironmentItem.d.ts +23 -15
  10. package/dist/components/SidebarItem/SidebarEnvironmentItem.d.ts.map +1 -1
  11. package/dist/components/SidebarItem/SidebarEnvironmentItem.js +20 -6
  12. package/dist/components/SidebarItem/SidebarFolderItem.d.ts +30 -4
  13. package/dist/components/SidebarItem/SidebarFolderItem.d.ts.map +1 -1
  14. package/dist/components/SidebarItem/SidebarFolderItem.js +26 -5
  15. package/dist/components/SidebarItem/SidebarHistoryItem.d.ts +9 -5
  16. package/dist/components/SidebarItem/SidebarHistoryItem.d.ts.map +1 -1
  17. package/dist/components/SidebarItem/SidebarHistoryItem.js +13 -4
  18. package/dist/components/SidebarItem/SidebarItem.d.ts +94 -3
  19. package/dist/components/SidebarItem/SidebarItem.d.ts.map +1 -1
  20. package/dist/components/SidebarItem/SidebarItem.js +55 -4
  21. package/dist/components/SidebarItem/SidebarList.d.ts +30 -0
  22. package/dist/components/SidebarItem/SidebarList.d.ts.map +1 -0
  23. package/dist/components/SidebarItem/SidebarList.js +17 -0
  24. package/dist/components/SidebarItem/SidebarListbox.d.ts +35 -0
  25. package/dist/components/SidebarItem/SidebarListbox.d.ts.map +1 -0
  26. package/dist/components/SidebarItem/SidebarListbox.js +18 -0
  27. package/dist/components/SidebarItem/SidebarMethodBadge.d.ts.map +1 -1
  28. package/dist/components/SidebarItem/SidebarMethodBadge.js +1 -1
  29. package/dist/components/SidebarItem/SidebarRequestItem.d.ts +39 -24
  30. package/dist/components/SidebarItem/SidebarRequestItem.d.ts.map +1 -1
  31. package/dist/components/SidebarItem/SidebarRequestItem.js +29 -4
  32. package/dist/components/SidebarItem/SidebarRunItem.d.ts +23 -6
  33. package/dist/components/SidebarItem/SidebarRunItem.d.ts.map +1 -1
  34. package/dist/components/SidebarItem/SidebarRunItem.js +15 -4
  35. package/dist/components/SidebarItem/SidebarStatusMarker.js +1 -1
  36. package/dist/components/SidebarItem/SidebarTabGroupItem.d.ts +7 -3
  37. package/dist/components/SidebarItem/SidebarTabGroupItem.d.ts.map +1 -1
  38. package/dist/components/SidebarItem/SidebarTabGroupItem.js +8 -3
  39. package/dist/components/SidebarItem/SidebarTree.d.ts +55 -0
  40. package/dist/components/SidebarItem/SidebarTree.d.ts.map +1 -0
  41. package/dist/components/SidebarItem/SidebarTree.js +30 -0
  42. package/dist/components/SidebarItem/SortableSidebarItem.d.ts +24 -5
  43. package/dist/components/SidebarItem/SortableSidebarItem.d.ts.map +1 -1
  44. package/dist/components/SidebarItem/SortableSidebarItem.js +27 -13
  45. package/dist/components/SidebarItem/index.d.ts +5 -1
  46. package/dist/components/SidebarItem/index.d.ts.map +1 -1
  47. package/dist/components/SidebarItem/index.js +4 -0
  48. package/dist/components/SidebarItem/sidebarItemClasses.d.ts +4 -0
  49. package/dist/components/SidebarItem/sidebarItemClasses.d.ts.map +1 -1
  50. package/dist/components/SidebarItem/sidebarItemClasses.js +4 -0
  51. package/dist/components/SidebarItem/sidebarListOption.d.ts +6 -0
  52. package/dist/components/SidebarItem/sidebarListOption.d.ts.map +1 -0
  53. package/dist/components/SidebarItem/sidebarListOption.js +10 -0
  54. package/dist/components/index.d.ts +1 -1
  55. package/dist/components/index.d.ts.map +1 -1
  56. package/dist/components/index.js +1 -1
  57. package/package.json +1 -1
@@ -2,16 +2,67 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@harborclient
2
2
  import { cn } from '../utils.js';
3
3
  import { SortableSidebarItem } from './SortableSidebarItem.js';
4
4
  import { sourceRow } from './sidebarItemClasses.js';
5
+ import { handleSidebarOptionKeyDown } from './sidebarListOption.js';
5
6
  import { stopSortableDragPointerDown } from './stopSortableDragPointerDown.js';
6
7
  /**
7
8
  * Base shell for sidebar list rows. Applies shared row chrome, optional sortable
8
- * drag behavior, and a trailing actions slot suitable for future Sidebar layout reuse.
9
+ * drag behavior via a leading grip handle, and a trailing actions slot suitable
10
+ * for future Sidebar layout reuse.
9
11
  */
10
- export function SidebarItem({ selected = false, compact = true, sortable, onContextMenu, actions, actionsStopDrag = true, as: Container = 'div', className, children }) {
12
+ export function SidebarItem({ selected = false, compact = true, sortable, listboxOption, treeItem, onContextMenu, actions, actionsStopDrag = true, as: Container = 'div', className, children }) {
11
13
  const rowClassName = cn('hc-sidebar-item', sourceRow(selected, compact), className);
12
14
  const rowContent = (_jsxs(_Fragment, { children: [children, actions != null ? (_jsx("div", { className: "shrink-0", ...(actionsStopDrag ? { onPointerDown: stopSortableDragPointerDown } : {}), children: actions })) : null] }));
15
+ const listboxOptionProps = listboxOption != null
16
+ ? {
17
+ role: 'option',
18
+ 'aria-selected': (listboxOption.ariaSelected ?? selected) ? 'true' : 'false',
19
+ ...(listboxOption.ariaCurrent === true ? { 'aria-current': 'true' } : {}),
20
+ ...(listboxOption.ariaLabel != null ? { 'aria-label': listboxOption.ariaLabel } : {}),
21
+ tabIndex: listboxOption.tabIndex ?? (selected ? 0 : -1),
22
+ ...(listboxOption.onClick != null ? { onClick: listboxOption.onClick } : {}),
23
+ ...(listboxOption.onDoubleClick != null
24
+ ? { onDoubleClick: listboxOption.onDoubleClick }
25
+ : {}),
26
+ onKeyDown: (event) => {
27
+ listboxOption.onKeyDown?.(event);
28
+ if (event.defaultPrevented) {
29
+ return;
30
+ }
31
+ handleSidebarOptionKeyDown(event, () => {
32
+ listboxOption.onClick?.(event);
33
+ });
34
+ }
35
+ }
36
+ : {};
37
+ const treeItemProps = treeItem != null
38
+ ? {
39
+ role: 'treeitem',
40
+ 'aria-selected': selected ? 'true' : 'false',
41
+ ...(treeItem.ariaLabel != null ? { 'aria-label': treeItem.ariaLabel } : {}),
42
+ ...(treeItem.expanded != null
43
+ ? { 'aria-expanded': treeItem.expanded ? 'true' : 'false' }
44
+ : {}),
45
+ ...(treeItem.controlsId != null ? { 'aria-controls': treeItem.controlsId } : {}),
46
+ ...(treeItem.level != null ? { 'aria-level': treeItem.level } : {}),
47
+ ...(treeItem.setSize != null ? { 'aria-setsize': treeItem.setSize } : {}),
48
+ ...(treeItem.posInSet != null ? { 'aria-posinset': treeItem.posInSet } : {}),
49
+ tabIndex: treeItem.tabIndex ?? (selected ? 0 : -1),
50
+ ...(treeItem.onClick != null ? { onClick: treeItem.onClick } : {}),
51
+ ...(treeItem.onDoubleClick != null ? { onDoubleClick: treeItem.onDoubleClick } : {}),
52
+ onKeyDown: (event) => {
53
+ treeItem.onKeyDown?.(event);
54
+ if (event.defaultPrevented) {
55
+ return;
56
+ }
57
+ handleSidebarOptionKeyDown(event, () => {
58
+ treeItem.onClick?.(event);
59
+ });
60
+ }
61
+ }
62
+ : {};
63
+ const interactiveProps = listboxOption != null ? listboxOptionProps : treeItemProps;
13
64
  if (sortable != null) {
14
- return (_jsx(SortableSidebarItem, { id: sortable.id, className: rowClassName, dragHandleLabel: sortable.dragHandleLabel, disabled: sortable.disabled, onRowContextMenu: onContextMenu, children: rowContent }));
65
+ return (_jsx(SortableSidebarItem, { id: sortable.id, as: Container, className: rowClassName, dragHandleLabel: sortable.dragHandleLabel, disabled: sortable.disabled, onRowContextMenu: onContextMenu, ...interactiveProps, children: rowContent }));
15
66
  }
16
- return (_jsx(Container, { className: rowClassName, onContextMenu: onContextMenu, children: rowContent }));
67
+ return (_jsx(Container, { className: rowClassName, onContextMenu: onContextMenu, ...interactiveProps, children: rowContent }));
17
68
  }
@@ -0,0 +1,30 @@
1
+ import type { JSX, ReactNode } from 'react';
2
+ interface Props {
3
+ /**
4
+ * List rows. Each child should render as an `<li>` (e.g. {@link SidebarCommitItem} `as="li"`).
5
+ */
6
+ children: ReactNode;
7
+ /**
8
+ * Accessible name for the list when the section title is not sufficient.
9
+ */
10
+ 'aria-label'?: string;
11
+ /**
12
+ * Additional classes merged onto the list element.
13
+ */
14
+ className?: string;
15
+ }
16
+ /**
17
+ * Accessible list container for non-selectable sidebar rows.
18
+ *
19
+ * Wrap rows rendered with `as="li"` so each child is a `role="listitem"`.
20
+ *
21
+ * @example
22
+ * ```tsx
23
+ * <SidebarList aria-label="Commits">
24
+ * <SidebarCommitItem as="li" message="Fix auth" author="Alex" timestampLabel="2h ago" icon={faCodeBranch} />
25
+ * </SidebarList>
26
+ * ```
27
+ */
28
+ export declare function SidebarList({ children, 'aria-label': ariaLabel, className }: Props): JSX.Element;
29
+ export {};
30
+ //# sourceMappingURL=SidebarList.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SidebarList.d.ts","sourceRoot":"","sources":["../../../src/components/SidebarItem/SidebarList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG5C,UAAU,KAAK;IACb;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAMhG"}
@@ -0,0 +1,17 @@
1
+ import { jsx as _jsx } from "@harborclient/sdk/jsx-runtime";
2
+ import { cn } from '../utils.js';
3
+ /**
4
+ * Accessible list container for non-selectable sidebar rows.
5
+ *
6
+ * Wrap rows rendered with `as="li"` so each child is a `role="listitem"`.
7
+ *
8
+ * @example
9
+ * ```tsx
10
+ * <SidebarList aria-label="Commits">
11
+ * <SidebarCommitItem as="li" message="Fix auth" author="Alex" timestampLabel="2h ago" icon={faCodeBranch} />
12
+ * </SidebarList>
13
+ * ```
14
+ */
15
+ export function SidebarList({ children, 'aria-label': ariaLabel, className }) {
16
+ return (_jsx("ul", { role: "list", "aria-label": ariaLabel, className: cn('m-0 list-none p-0', className), children: children }));
17
+ }
@@ -0,0 +1,35 @@
1
+ import type { JSX, ReactNode } from 'react';
2
+ interface Props {
3
+ /**
4
+ * Listbox option rows. Each child should be a {@link SidebarItem} with `as="li"`.
5
+ */
6
+ children: ReactNode;
7
+ /**
8
+ * When true, multiple options may be selected at once.
9
+ */
10
+ multiselectable?: boolean;
11
+ /**
12
+ * Accessible name for the listbox when the section title is not sufficient.
13
+ */
14
+ 'aria-label'?: string;
15
+ /**
16
+ * Additional classes merged onto the listbox element.
17
+ */
18
+ className?: string;
19
+ }
20
+ /**
21
+ * Accessible listbox container for flat sidebar item lists.
22
+ *
23
+ * Wrap rows rendered with {@link SidebarItem} `as="li"` and `listboxOption` so
24
+ * each row exposes `role="option"` and `aria-selected` correctly.
25
+ *
26
+ * @example
27
+ * ```tsx
28
+ * <SidebarListbox aria-label="Collections">
29
+ * <SidebarRequestItem as="li" name="List users" method="GET" />
30
+ * </SidebarListbox>
31
+ * ```
32
+ */
33
+ export declare function SidebarListbox({ children, multiselectable, 'aria-label': ariaLabel, className }: Props): JSX.Element;
34
+ export {};
35
+ //# sourceMappingURL=SidebarListbox.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SidebarListbox.d.ts","sourceRoot":"","sources":["../../../src/components/SidebarItem/SidebarListbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG5C,UAAU,KAAK;IACb;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,eAAuB,EACvB,YAAY,EAAE,SAAS,EACvB,SAAS,EACV,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAWrB"}
@@ -0,0 +1,18 @@
1
+ import { jsx as _jsx } from "@harborclient/sdk/jsx-runtime";
2
+ import { cn } from '../utils.js';
3
+ /**
4
+ * Accessible listbox container for flat sidebar item lists.
5
+ *
6
+ * Wrap rows rendered with {@link SidebarItem} `as="li"` and `listboxOption` so
7
+ * each row exposes `role="option"` and `aria-selected` correctly.
8
+ *
9
+ * @example
10
+ * ```tsx
11
+ * <SidebarListbox aria-label="Collections">
12
+ * <SidebarRequestItem as="li" name="List users" method="GET" />
13
+ * </SidebarListbox>
14
+ * ```
15
+ */
16
+ export function SidebarListbox({ children, multiselectable = false, 'aria-label': ariaLabel, className }) {
17
+ return (_jsx("ul", { role: "listbox", "aria-multiselectable": multiselectable ? true : undefined, "aria-label": ariaLabel, className: cn('m-0 list-none p-0', className), children: children }));
18
+ }
@@ -1 +1 @@
1
- {"version":3,"file":"SidebarMethodBadge.d.ts","sourceRoot":"","sources":["../../../src/components/SidebarItem/SidebarMethodBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAIjC,UAAU,KAAK;IACb;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;GAEG;AACH,wBAAgB,kBAAkB,CAAC,EAAE,MAAM,EAAE,SAAiB,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAYpF"}
1
+ {"version":3,"file":"SidebarMethodBadge.d.ts","sourceRoot":"","sources":["../../../src/components/SidebarItem/SidebarMethodBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAIjC,UAAU,KAAK;IACb;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;GAEG;AACH,wBAAgB,kBAAkB,CAAC,EAAE,MAAM,EAAE,SAAiB,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CASpF"}
@@ -7,5 +7,5 @@ import { METHOD_CLASSES } from './sidebarItemClasses.js';
7
7
  export function SidebarMethodBadge({ method, uppercase = false }) {
8
8
  const methodKey = method.toLowerCase();
9
9
  const colorClass = METHOD_CLASSES[methodKey] ?? 'text-info';
10
- return (_jsx("span", { className: cn('shrink-0 px-1 py-px', uppercase && 'font-medium uppercase', colorClass), "aria-hidden": uppercase ? true : undefined, children: method }));
10
+ return (_jsx("span", { className: cn('shrink-0 px-1 py-px', uppercase && 'font-medium uppercase', colorClass), children: method }));
11
11
  }
@@ -39,39 +39,46 @@ interface Props {
39
39
  */
40
40
  sortable?: SidebarItemSortableConfig;
41
41
  /**
42
- * Called when the user right-clicks the row container.
42
+ * Accessible label for the listbox option. When omitted, the name is derived
43
+ * from visible row content (method, name, markers).
43
44
  */
44
- onContextMenu?: (event: MouseEvent<HTMLElement>) => void;
45
+ ariaLabel?: string;
45
46
  /**
46
- * Called when the primary label button is clicked.
47
+ * Overrides the `aria-selected` state. When omitted, falls back to `selected`.
48
+ * Use to decouple selection semantics from highlight styling.
47
49
  */
48
- onClick?: (event: MouseEvent<HTMLButtonElement>) => void;
50
+ ariaSelected?: boolean;
49
51
  /**
50
- * Accessible label for the primary button.
52
+ * When true, marks the row as the current item with `aria-current="true"`.
51
53
  */
52
- ariaLabel?: string;
54
+ ariaCurrent?: boolean;
53
55
  /**
54
- * When true, sets aria-current="true" on the primary button.
56
+ * Called when the user right-clicks the row container.
55
57
  */
56
- ariaCurrent?: boolean;
58
+ onContextMenu?: (event: MouseEvent<HTMLElement>) => void;
57
59
  /**
58
- * When true, sets aria-selected="true" on the primary button.
60
+ * Called when the primary label area is activated.
59
61
  */
60
- ariaSelected?: boolean;
62
+ onClick?: (event: MouseEvent<HTMLElement>) => void;
61
63
  /**
62
64
  * Trailing actions slot, typically a row actions menu.
63
65
  */
64
66
  actions?: ReactNode;
65
67
  /**
66
- * HTML element for the row container when not sortable.
68
+ * HTML element for the row container. Use `li` inside {@link SidebarListbox}.
67
69
  */
68
70
  as?: 'div' | 'li';
69
71
  }
70
72
  /**
71
73
  * Renders a saved-request sidebar row with method badge, optional color dot or git
72
74
  * status marker, and shared row chrome. Used in both Collections and Git sidebars.
75
+ *
76
+ * The accessible name defaults to visible row content (method, name, markers) but
77
+ * can be overridden with `ariaLabel` (e.g. to include git status context).
78
+ *
79
+ * Wrap lists in {@link SidebarListbox} and pass `as="li"` for valid listbox semantics.
73
80
  */
74
- export declare function SidebarRequestItem({ method, name, nameClassName, colorDot, statusMarker, selected, sortable, onContextMenu, onClick, ariaLabel, ariaCurrent, ariaSelected, actions, as }: Props): JSX.Element;
81
+ export declare function SidebarRequestItem({ method, name, nameClassName, colorDot, statusMarker, selected, sortable, ariaLabel, ariaSelected, ariaCurrent, onContextMenu, onClick, actions, as }: Props): JSX.Element;
75
82
  interface DocumentProps {
76
83
  /**
77
84
  * Icon shown before the document name. Defaults to a file-lines icon when omitted.
@@ -106,38 +113,46 @@ interface DocumentProps {
106
113
  */
107
114
  selected?: boolean;
108
115
  /**
109
- * Called when the user right-clicks the row container.
116
+ * Accessible label for the listbox option. When omitted, the name is derived
117
+ * from visible row content (name, markers).
110
118
  */
111
- onContextMenu?: (event: MouseEvent<HTMLElement>) => void;
119
+ ariaLabel?: string;
120
+ /**
121
+ * Overrides the `aria-selected` state. When omitted, falls back to `selected`.
122
+ */
123
+ ariaSelected?: boolean;
112
124
  /**
113
- * Called when the primary label button is clicked.
125
+ * When true, marks the row as the current item with `aria-current="true"`.
114
126
  */
115
- onClick?: (event: MouseEvent<HTMLButtonElement>) => void;
127
+ ariaCurrent?: boolean;
116
128
  /**
117
- * Called when the primary label button is double-clicked.
129
+ * Called when the user right-clicks the row container.
118
130
  */
119
- onDoubleClick?: (event: MouseEvent<HTMLButtonElement>) => void;
131
+ onContextMenu?: (event: MouseEvent<HTMLElement>) => void;
120
132
  /**
121
- * Accessible label for the primary button.
133
+ * Called when the primary label area is activated.
122
134
  */
123
- ariaLabel?: string;
135
+ onClick?: (event: MouseEvent<HTMLElement>) => void;
124
136
  /**
125
- * When true, sets aria-current="true" on the primary button.
137
+ * Called when the primary label area is double-clicked.
126
138
  */
127
- ariaCurrent?: boolean;
139
+ onDoubleClick?: (event: MouseEvent<HTMLElement>) => void;
128
140
  /**
129
141
  * Trailing actions slot, typically a row actions menu.
130
142
  */
131
143
  actions?: ReactNode;
132
144
  /**
133
- * HTML element for the row container.
145
+ * HTML element for the row container. Use `li` inside {@link SidebarListbox}.
134
146
  */
135
147
  as?: 'div' | 'li';
136
148
  }
137
149
  /**
138
150
  * Renders a markdown document sidebar row with file icon, optional color dot or git
139
151
  * status marker, and shared row chrome. Used in both Collections and Git sidebars.
152
+ *
153
+ * The accessible name defaults to visible row content (name, markers) but can be
154
+ * overridden with `ariaLabel` (e.g. to include git status context).
140
155
  */
141
- export declare function SidebarDocumentItem({ icon, name, nameClassName, colorDot, statusMarker, selected, onContextMenu, onClick, onDoubleClick, ariaLabel, ariaCurrent, actions, as }: DocumentProps): JSX.Element;
156
+ export declare function SidebarDocumentItem({ icon, name, nameClassName, colorDot, statusMarker, selected, ariaLabel, ariaSelected, ariaCurrent, onContextMenu, onClick, onDoubleClick, actions, as }: DocumentProps): JSX.Element;
142
157
  export {};
143
158
  //# sourceMappingURL=SidebarRequestItem.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"SidebarRequestItem.d.ts","sourceRoot":"","sources":["../../../src/components/SidebarItem/SidebarRequestItem.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"SidebarRequestItem.d.ts","sourceRoot":"","sources":["../../../src/components/SidebarItem/SidebarRequestItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AAExE,OAAO,KAAK,EAAE,GAAG,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGxD,OAAO,EAAe,KAAK,yBAAyB,EAAE,MAAM,kBAAkB,CAAC;AAK/E,UAAU,KAAK;IACb;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IAEb;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;OAEG;IACH,QAAQ,CAAC,EAAE;QACT,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;QACjC,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IAEF;;OAEG;IACH,YAAY,CAAC,EAAE;QACb,MAAM,EAAE,MAAM,CAAC;QACf,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,KAAK,EAAE,MAAM,CAAC;KACf,CAAC;IAEF;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC;IAErC;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAEzD;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAEnD;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,EAAE,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;CACnB;AAED;;;;;;;;GAQG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,MAAM,EACN,IAAI,EACJ,aAAa,EACb,QAAQ,EACR,YAAY,EACZ,QAAgB,EAChB,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,WAAW,EACX,aAAa,EACb,OAAO,EACP,OAAO,EACP,EAAS,EACV,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CA6CrB;AAED,UAAU,aAAa;IACrB;;OAEG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IAEtB;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IAEb;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;OAEG;IACH,QAAQ,CAAC,EAAE;QACT,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;QACjC,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IAEF;;OAEG;IACH,YAAY,CAAC,EAAE;QACb,MAAM,EAAE,MAAM,CAAC;QACf,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,KAAK,EAAE,MAAM,CAAC;KACf,CAAC;IAEF;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAEzD;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAEnD;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAEzD;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,EAAE,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;CACnB;AAED;;;;;;GAMG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,IAAkB,EAClB,IAAI,EACJ,aAAa,EACb,QAAQ,EACR,YAAY,EACZ,QAAgB,EAChB,SAAS,EACT,YAAY,EACZ,WAAW,EACX,aAAa,EACb,OAAO,EACP,aAAa,EACb,OAAO,EACP,EAAS,EACV,EAAE,aAAa,GAAG,GAAG,CAAC,OAAO,CA6C7B"}
@@ -9,14 +9,39 @@ import { SIDEBAR_ITEM_BUTTON_CLASS } from './sidebarItemClasses.js';
9
9
  /**
10
10
  * Renders a saved-request sidebar row with method badge, optional color dot or git
11
11
  * status marker, and shared row chrome. Used in both Collections and Git sidebars.
12
+ *
13
+ * The accessible name defaults to visible row content (method, name, markers) but
14
+ * can be overridden with `ariaLabel` (e.g. to include git status context).
15
+ *
16
+ * Wrap lists in {@link SidebarListbox} and pass `as="li"` for valid listbox semantics.
12
17
  */
13
- export function SidebarRequestItem({ method, name, nameClassName, colorDot, statusMarker, selected = false, sortable, onContextMenu, onClick, ariaLabel, ariaCurrent = false, ariaSelected = false, actions, as = 'div' }) {
14
- return (_jsx(SidebarItem, { selected: selected, sortable: sortable, onContextMenu: onContextMenu, actions: actions, as: as, children: _jsxs("button", { type: "button", className: SIDEBAR_ITEM_BUTTON_CLASS, "aria-current": ariaCurrent ? 'true' : undefined, "aria-selected": ariaSelected ? 'true' : undefined, "aria-label": ariaLabel, onClick: onClick, children: [_jsx(SidebarMethodBadge, { method: method }), colorDot != null ? (_jsxs("span", { className: "inline-flex min-w-0 items-center gap-1.5", children: [_jsx("span", { className: `min-w-0 truncate ${nameClassName ?? ''}`, children: name }), _jsx(SidebarColorDot, { color: colorDot.color, visible: colorDot.visible, label: colorDot.label })] })) : (_jsx("span", { className: `min-w-0 truncate ${nameClassName ?? ''}`, children: name })), statusMarker != null ? (_jsx(SidebarStatusMarker, { marker: statusMarker.marker, className: statusMarker.className, label: statusMarker.label })) : null] }) }));
18
+ export function SidebarRequestItem({ method, name, nameClassName, colorDot, statusMarker, selected = false, sortable, ariaLabel, ariaSelected, ariaCurrent, onContextMenu, onClick, actions, as = 'li' }) {
19
+ const useListboxOption = as === 'li';
20
+ return (_jsx(SidebarItem, { selected: selected, sortable: sortable, onContextMenu: onContextMenu, actions: actions, as: as, listboxOption: useListboxOption
21
+ ? {
22
+ ariaLabel,
23
+ ariaSelected,
24
+ ariaCurrent,
25
+ onClick
26
+ }
27
+ : undefined, children: _jsxs("span", { className: SIDEBAR_ITEM_BUTTON_CLASS, children: [_jsx(SidebarMethodBadge, { method: method }), colorDot != null ? (_jsxs("span", { className: "inline-flex min-w-0 items-center gap-1.5", children: [_jsx("span", { className: `min-w-0 truncate ${nameClassName ?? ''}`, children: name }), _jsx(SidebarColorDot, { color: colorDot.color, visible: colorDot.visible, label: colorDot.label })] })) : (_jsx("span", { className: `min-w-0 truncate ${nameClassName ?? ''}`, children: name })), statusMarker != null ? (_jsx(SidebarStatusMarker, { marker: statusMarker.marker, className: statusMarker.className, label: statusMarker.label })) : null] }) }));
15
28
  }
16
29
  /**
17
30
  * Renders a markdown document sidebar row with file icon, optional color dot or git
18
31
  * status marker, and shared row chrome. Used in both Collections and Git sidebars.
32
+ *
33
+ * The accessible name defaults to visible row content (name, markers) but can be
34
+ * overridden with `ariaLabel` (e.g. to include git status context).
19
35
  */
20
- export function SidebarDocumentItem({ icon = faFileLines, name, nameClassName, colorDot, statusMarker, selected = false, onContextMenu, onClick, onDoubleClick, ariaLabel, ariaCurrent = false, actions, as = 'div' }) {
21
- return (_jsx(SidebarItem, { selected: selected, onContextMenu: onContextMenu, actions: actions, as: as, children: _jsxs("button", { type: "button", className: SIDEBAR_ITEM_BUTTON_CLASS, "aria-current": ariaCurrent ? 'true' : undefined, "aria-label": ariaLabel, onClick: onClick, onDoubleClick: onDoubleClick, children: [_jsx(FaIcon, { icon: icon, className: "h-3.5 w-3.5 shrink-0 text-muted", "aria-hidden": true }), colorDot != null ? (_jsxs("span", { className: "inline-flex min-w-0 items-center gap-1.5", children: [_jsx("span", { className: `min-w-0 truncate ${nameClassName ?? ''}`, children: name }), _jsx(SidebarColorDot, { color: colorDot.color, visible: colorDot.visible, label: colorDot.label })] })) : (_jsx("span", { className: `min-w-0 truncate ${nameClassName ?? ''}`, children: name })), statusMarker != null ? (_jsx(SidebarStatusMarker, { marker: statusMarker.marker, className: statusMarker.className, label: statusMarker.label })) : null] }) }));
36
+ export function SidebarDocumentItem({ icon = faFileLines, name, nameClassName, colorDot, statusMarker, selected = false, ariaLabel, ariaSelected, ariaCurrent, onContextMenu, onClick, onDoubleClick, actions, as = 'li' }) {
37
+ const useListboxOption = as === 'li';
38
+ return (_jsx(SidebarItem, { selected: selected, onContextMenu: onContextMenu, actions: actions, as: as, listboxOption: useListboxOption
39
+ ? {
40
+ ariaLabel,
41
+ ariaSelected,
42
+ ariaCurrent,
43
+ onClick,
44
+ onDoubleClick
45
+ }
46
+ : undefined, children: _jsxs("span", { className: SIDEBAR_ITEM_BUTTON_CLASS, children: [_jsx(FaIcon, { icon: icon, className: "h-3.5 w-3.5 shrink-0 text-muted", "aria-hidden": true }), colorDot != null ? (_jsxs("span", { className: "inline-flex min-w-0 items-center gap-1.5", children: [_jsx("span", { className: `min-w-0 truncate ${nameClassName ?? ''}`, children: name }), _jsx(SidebarColorDot, { color: colorDot.color, visible: colorDot.visible, label: colorDot.label })] })) : (_jsx("span", { className: `min-w-0 truncate ${nameClassName ?? ''}`, children: name })), statusMarker != null ? (_jsx(SidebarStatusMarker, { marker: statusMarker.marker, className: statusMarker.className, label: statusMarker.label })) : null] }) }));
22
47
  }
@@ -25,21 +25,31 @@ interface Props {
25
25
  */
26
26
  selected?: boolean;
27
27
  /**
28
- * Tooltip title for the primary button.
28
+ * Tooltip title for the primary label area.
29
29
  */
30
30
  title?: string;
31
31
  /**
32
- * Accessible label for the primary button.
32
+ * Accessible label for the listbox option. When omitted, the name is derived
33
+ * from visible row content (method, label, connection badge, status summary).
33
34
  */
34
- ariaLabel: string;
35
+ ariaLabel?: string;
36
+ /**
37
+ * Overrides the `aria-selected` state. When omitted, falls back to `selected`.
38
+ * Use to decouple selection semantics from highlight styling.
39
+ */
40
+ ariaSelected?: boolean;
41
+ /**
42
+ * When true, marks the row as the current item with `aria-current="true"`.
43
+ */
44
+ ariaCurrent?: boolean;
35
45
  /**
36
46
  * Called when the user right-clicks the row container.
37
47
  */
38
48
  onContextMenu?: (event: MouseEvent<HTMLElement>) => void;
39
49
  /**
40
- * Called when the primary row button is clicked.
50
+ * Called when the primary row area is activated.
41
51
  */
42
- onClick?: (event: MouseEvent<HTMLButtonElement>) => void;
52
+ onClick?: (event: MouseEvent<HTMLElement>) => void;
43
53
  /**
44
54
  * Trailing actions slot, typically a row actions menu.
45
55
  */
@@ -48,10 +58,17 @@ interface Props {
48
58
  * Optional data attribute value for keyboard navigation focus targets.
49
59
  */
50
60
  dataSidebarRunResultId?: string | number;
61
+ /**
62
+ * HTML element for the row container. Use `li` inside {@link SidebarListbox}.
63
+ */
64
+ as?: 'div' | 'li';
51
65
  }
52
66
  /**
53
67
  * Renders a saved run result row in the Collections sidebar Runs section.
68
+ *
69
+ * The accessible name is derived from visible row content (method, label, connection badge,
70
+ * status summary).
54
71
  */
55
- export declare function SidebarRunItem({ method, label, connectionBadge, statusDotClassName, statusSummary, selected, title, ariaLabel, onContextMenu, onClick, actions, dataSidebarRunResultId }: Props): JSX.Element;
72
+ export declare function SidebarRunItem({ method, label, connectionBadge, statusDotClassName, statusSummary, selected, title, ariaLabel, ariaSelected, ariaCurrent, onContextMenu, onClick, actions, dataSidebarRunResultId, as }: Props): JSX.Element;
56
73
  export {};
57
74
  //# sourceMappingURL=SidebarRunItem.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"SidebarRunItem.d.ts","sourceRoot":"","sources":["../../../src/components/SidebarItem/SidebarRunItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMxD,UAAU,KAAK;IACb;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,kBAAkB,EAAE,MAAM,CAAC;IAE3B;;OAEG;IACH,aAAa,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,SAAS,EAAE,MAAM,CAAC;IAElB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAEzD;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAEzD;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,sBAAsB,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC1C;AAED;;GAEG;AACH,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,KAAK,EACL,eAAe,EACf,kBAAkB,EAClB,aAAa,EACb,QAAgB,EAChB,KAAK,EACL,SAAS,EACT,aAAa,EACb,OAAO,EACP,OAAO,EACP,sBAAsB,EACvB,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CA8BrB"}
1
+ {"version":3,"file":"SidebarRunItem.d.ts","sourceRoot":"","sources":["../../../src/components/SidebarItem/SidebarRunItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMxD,UAAU,KAAK;IACb;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,kBAAkB,EAAE,MAAM,CAAC;IAE3B;;OAEG;IACH,aAAa,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAEzD;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAEnD;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,sBAAsB,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAEzC;;OAEG;IACH,EAAE,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;CACnB;AAED;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,KAAK,EACL,eAAe,EACf,kBAAkB,EAClB,aAAa,EACb,QAAgB,EAChB,KAAK,EACL,SAAS,EACT,YAAY,EACZ,WAAW,EACX,aAAa,EACb,OAAO,EACP,OAAO,EACP,sBAAsB,EACtB,EAAS,EACV,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CA2CrB"}
@@ -1,13 +1,24 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "@harborclient/sdk/jsx-runtime";
2
- import { Button } from '../Button/index.js';
3
2
  import { SidebarItem } from './SidebarItem.js';
4
3
  import { SidebarMethodBadge } from './SidebarMethodBadge.js';
5
4
  import { SidebarStatusDot } from './SidebarStatusDot.js';
5
+ import { SIDEBAR_ITEM_BUTTON_CLASS } from './sidebarItemClasses.js';
6
6
  /**
7
7
  * Renders a saved run result row in the Collections sidebar Runs section.
8
+ *
9
+ * The accessible name is derived from visible row content (method, label, connection badge,
10
+ * status summary).
8
11
  */
9
- export function SidebarRunItem({ method, label, connectionBadge, statusDotClassName, statusSummary, selected = false, title, ariaLabel, onContextMenu, onClick, actions, dataSidebarRunResultId }) {
10
- return (_jsx(SidebarItem, { selected: selected, onContextMenu: onContextMenu, actions: actions, children: _jsxs(Button, { variant: "toolbar", className: "flex min-w-0 flex-1 items-center gap-2 py-0.5 text-left text-text hover:bg-transparent", ...(dataSidebarRunResultId != null
12
+ export function SidebarRunItem({ method, label, connectionBadge, statusDotClassName, statusSummary, selected = false, title, ariaLabel, ariaSelected, ariaCurrent, onContextMenu, onClick, actions, dataSidebarRunResultId, as = 'li' }) {
13
+ const useListboxOption = as === 'li';
14
+ return (_jsx(SidebarItem, { selected: selected, onContextMenu: onContextMenu, actions: actions, as: as, listboxOption: useListboxOption
15
+ ? {
16
+ ariaLabel,
17
+ ariaSelected,
18
+ ariaCurrent,
19
+ onClick
20
+ }
21
+ : undefined, children: _jsxs("span", { className: `${SIDEBAR_ITEM_BUTTON_CLASS} py-0.5`, title: title, ...(dataSidebarRunResultId != null
11
22
  ? { 'data-sidebar-run-result-id': String(dataSidebarRunResultId) }
12
- : {}), title: title, "aria-label": ariaLabel, "aria-selected": selected ? 'true' : undefined, onClick: onClick, children: [method != null && method !== '' ? _jsx(SidebarMethodBadge, { method: method, uppercase: true }) : null, _jsxs("span", { className: "flex min-w-0 flex-1 items-center gap-1.5", children: [_jsx("span", { className: "min-w-0 truncate text-text", children: label }), connectionBadge != null ? (_jsx("span", { className: "shrink-0 rounded bg-info/15 px-1.5 py-0.5 text-[14px] font-medium text-info", title: `Stored in ${connectionBadge}`, children: connectionBadge })) : null] }), _jsx(SidebarStatusDot, { className: statusDotClassName, srOnlyLabel: statusSummary })] }) }));
23
+ : {}), children: [method != null && method !== '' ? _jsx(SidebarMethodBadge, { method: method, uppercase: true }) : null, _jsxs("span", { className: "flex min-w-0 flex-1 items-center gap-1.5", children: [_jsx("span", { className: "min-w-0 truncate text-text", children: label }), connectionBadge != null ? (_jsx("span", { className: "shrink-0 rounded bg-info/15 px-1.5 py-0.5 text-[14px] font-medium text-info", title: `Stored in ${connectionBadge}`, children: connectionBadge })) : null] }), _jsx(SidebarStatusDot, { className: statusDotClassName, srOnlyLabel: statusSummary })] }) }));
13
24
  }
@@ -4,5 +4,5 @@ import { cn } from '../utils.js';
4
4
  * Renders a git change status marker in square brackets after a file name.
5
5
  */
6
6
  export function SidebarStatusMarker({ marker, className, label }) {
7
- return (_jsxs("span", { className: cn('shrink-0', className), title: label, "aria-label": label, children: ["[", marker, "]"] }));
7
+ return (_jsxs("span", { className: cn('shrink-0', className), role: "img", title: label, "aria-label": label, children: ["[", marker, "]"] }));
8
8
  }
@@ -35,17 +35,21 @@ interface Props {
35
35
  */
36
36
  onContextMenu?: (event: MouseEvent<HTMLElement>) => void;
37
37
  /**
38
- * Called when the primary row button is clicked.
38
+ * Called when the primary row area is activated.
39
39
  */
40
- onClick?: (event: MouseEvent<HTMLButtonElement>) => void;
40
+ onClick?: (event: MouseEvent<HTMLElement>) => void;
41
41
  /**
42
42
  * Trailing actions slot, typically a row actions menu.
43
43
  */
44
44
  actions?: ReactNode;
45
+ /**
46
+ * HTML element for the row container. Use `li` inside {@link SidebarListbox}.
47
+ */
48
+ as?: 'div' | 'li';
45
49
  }
46
50
  /**
47
51
  * Renders a tab group row in the Collections sidebar Tab Groups section.
48
52
  */
49
- export declare function SidebarTabGroupItem({ name, summary, icon, colorDot, selected, sortable, onContextMenu, onClick, actions }: Props): JSX.Element;
53
+ export declare function SidebarTabGroupItem({ name, summary, icon, colorDot, selected, sortable, onContextMenu, onClick, actions, as }: Props): JSX.Element;
50
54
  export {};
51
55
  //# sourceMappingURL=SidebarTabGroupItem.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"SidebarTabGroupItem.d.ts","sourceRoot":"","sources":["../../../src/components/SidebarItem/SidebarTabGroupItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,KAAK,EAAE,GAAG,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIxD,OAAO,EAAe,KAAK,yBAAyB,EAAE,MAAM,kBAAkB,CAAC;AAE/E,UAAU,KAAK;IACb;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IAEb;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,IAAI,EAAE,cAAc,CAAC;IAErB;;OAEG;IACH,QAAQ,CAAC,EAAE;QACT,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;QACjC,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IAEF;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC;IAErC;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAEzD;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAEzD;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AAED;;GAEG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,IAAI,EACJ,OAAO,EACP,IAAI,EACJ,QAAQ,EACR,QAAgB,EAChB,QAAQ,EACR,aAAa,EACb,OAAO,EACP,OAAO,EACR,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CA6BrB"}
1
+ {"version":3,"file":"SidebarTabGroupItem.d.ts","sourceRoot":"","sources":["../../../src/components/SidebarItem/SidebarTabGroupItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,KAAK,EAAE,GAAG,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGxD,OAAO,EAAe,KAAK,yBAAyB,EAAE,MAAM,kBAAkB,CAAC;AAG/E,UAAU,KAAK;IACb;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IAEb;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,IAAI,EAAE,cAAc,CAAC;IAErB;;OAEG;IACH,QAAQ,CAAC,EAAE;QACT,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;QACjC,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IAEF;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC;IAErC;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAEzD;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAEnD;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,EAAE,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;CACnB;AAED;;GAEG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,IAAI,EACJ,OAAO,EACP,IAAI,EACJ,QAAQ,EACR,QAAgB,EAChB,QAAQ,EACR,aAAa,EACb,OAAO,EACP,OAAO,EACP,EAAS,EACV,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAkCrB"}
@@ -1,11 +1,16 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "@harborclient/sdk/jsx-runtime";
2
- import { Button } from '../Button/index.js';
3
2
  import { FaIcon } from '../FaIcon/index.js';
4
3
  import { SidebarColorDot } from './SidebarColorDot.js';
5
4
  import { SidebarItem } from './SidebarItem.js';
5
+ import { SIDEBAR_ITEM_BUTTON_CLASS } from './sidebarItemClasses.js';
6
6
  /**
7
7
  * Renders a tab group row in the Collections sidebar Tab Groups section.
8
8
  */
9
- export function SidebarTabGroupItem({ name, summary, icon, colorDot, selected = false, sortable, onContextMenu, onClick, actions }) {
10
- return (_jsx(SidebarItem, { selected: selected, sortable: sortable, onContextMenu: onContextMenu, actions: actions, children: _jsxs(Button, { variant: "toolbar", className: "min-w-0 flex-1 justify-start gap-2 rounded-md px-2 py-1 text-left text-text hover:bg-transparent", "aria-selected": selected ? 'true' : undefined, onClick: onClick, children: [_jsx(FaIcon, { icon: icon, className: "h-3.5 w-3.5 shrink-0 text-muted", "aria-hidden": true }), _jsxs("span", { className: "inline-flex min-w-0 flex-1 items-center gap-1.5", children: [_jsx("span", { className: "min-w-0 truncate", children: name }), colorDot != null ? (_jsx(SidebarColorDot, { color: colorDot.color, visible: colorDot.visible, label: colorDot.label })) : null] }), _jsx("span", { className: "shrink-0 text-muted", children: summary })] }) }));
9
+ export function SidebarTabGroupItem({ name, summary, icon, colorDot, selected = false, sortable, onContextMenu, onClick, actions, as = 'li' }) {
10
+ const useListboxOption = as === 'li';
11
+ return (_jsx(SidebarItem, { selected: selected, sortable: sortable, onContextMenu: onContextMenu, actions: actions, as: as, listboxOption: useListboxOption
12
+ ? {
13
+ onClick
14
+ }
15
+ : undefined, children: _jsxs("span", { className: `${SIDEBAR_ITEM_BUTTON_CLASS} gap-2 rounded-md px-2 py-1`, children: [_jsx(FaIcon, { icon: icon, className: "h-3.5 w-3.5 shrink-0 text-muted", "aria-hidden": true }), _jsxs("span", { className: "inline-flex min-w-0 flex-1 items-center gap-1.5", children: [_jsx("span", { className: "min-w-0 truncate", children: name }), colorDot != null ? (_jsx(SidebarColorDot, { color: colorDot.color, visible: colorDot.visible, label: colorDot.label })) : null] }), _jsx("span", { className: "shrink-0 text-muted", children: summary })] }) }));
11
16
  }
@@ -0,0 +1,55 @@
1
+ import type { JSX, ReactNode } from 'react';
2
+ interface TreeProps {
3
+ /**
4
+ * Tree rows. Each child should be a {@link SidebarFolderItem} with `as="li"`.
5
+ */
6
+ children: ReactNode;
7
+ /**
8
+ * Accessible name for the tree when the section title is not sufficient.
9
+ */
10
+ 'aria-label'?: string;
11
+ /**
12
+ * Additional classes merged onto the tree element.
13
+ */
14
+ className?: string;
15
+ }
16
+ /**
17
+ * Accessible tree container for nested sidebar folder hierarchies.
18
+ *
19
+ * Wrap folder rows rendered with {@link SidebarFolderItem} `as="li"` and
20
+ * `treeItem` so each row exposes `role="treeitem"` with expand/collapse state.
21
+ *
22
+ * @example
23
+ * ```tsx
24
+ * <SidebarTree aria-label="Collections">
25
+ * <SidebarFolderItem as="li" name="Auth" expanded childrenId="auth-children" />
26
+ * <SidebarTreeGroup id="auth-children">
27
+ * <SidebarRequestItem as="li" name="Login" method="POST" />
28
+ * </SidebarTreeGroup>
29
+ * </SidebarTree>
30
+ * ```
31
+ */
32
+ export declare function SidebarTree({ children, 'aria-label': ariaLabel, className }: TreeProps): JSX.Element;
33
+ interface TreeGroupProps {
34
+ /**
35
+ * Child tree rows or nested groups.
36
+ */
37
+ children: ReactNode;
38
+ /**
39
+ * Stable id referenced by the parent treeitem's `aria-controls`.
40
+ */
41
+ id: string;
42
+ /**
43
+ * Additional classes merged onto the group element.
44
+ */
45
+ className?: string;
46
+ }
47
+ /**
48
+ * Child region for an expanded folder treeitem.
49
+ *
50
+ * Renders `role="group"` and must use the same `id` passed to the parent
51
+ * folder's `childrenId` / `aria-controls`.
52
+ */
53
+ export declare function SidebarTreeGroup({ children, id, className }: TreeGroupProps): JSX.Element;
54
+ export {};
55
+ //# sourceMappingURL=SidebarTree.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SidebarTree.d.ts","sourceRoot":"","sources":["../../../src/components/SidebarItem/SidebarTree.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG5C,UAAU,SAAS;IACjB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,YAAY,EAAE,SAAS,EACvB,SAAS,EACV,EAAE,SAAS,GAAG,GAAG,CAAC,OAAO,CAMzB;AAED,UAAU,cAAc;IACtB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IAEX;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,cAAc,GAAG,GAAG,CAAC,OAAO,CAMzF"}