@pantheon-systems/pds-toolkit-react 2.0.0-alpha.85 → 2.0.0-alpha.87

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 (47) hide show
  1. package/codemods/v1-to-v2/mappings.json +31 -14
  2. package/dist/components/Popover/Popover.d.ts +2 -2
  3. package/dist/components/StatusScrim/StatusScrim.d.ts +22 -0
  4. package/dist/components/Table/Table.d.ts +30 -9
  5. package/dist/components/Tooltip/Tooltip.d.ts +2 -2
  6. package/dist/components/buttons/MenuButton/MenuButton.d.ts +17 -1
  7. package/dist/components/buttons/SplitButton/SplitButton.d.ts +20 -1
  8. package/dist/components/icons/Icon/generated-icon-data.d.ts +1 -1
  9. package/dist/components/inputs/Datepicker/Datepicker.d.ts +17 -1
  10. package/dist/components/navigation/BookmarksMenu/BookmarksMenu.d.ts +151 -0
  11. package/dist/components/navigation/Navbar/Navbar.d.ts +20 -7
  12. package/dist/components/panels/BookmarksPanel/BookmarksPanel.d.ts +67 -0
  13. package/dist/components/panels/PanelList/PanelList.d.ts +1 -1
  14. package/dist/css/component-css/pds-Table.stories.css +1 -0
  15. package/dist/css/component-css/pds-banner.css +1 -1
  16. package/dist/css/component-css/pds-bookmarks-menu.css +1 -0
  17. package/dist/css/component-css/pds-bookmarks-panel.css +1 -0
  18. package/dist/css/component-css/pds-datepicker.css +1 -1
  19. package/dist/css/component-css/pds-dropdown.css +1 -1
  20. package/dist/css/component-css/pds-icon.css +1 -1
  21. package/dist/css/component-css/pds-index.css +30 -26
  22. package/dist/css/component-css/pds-input-group.css +1 -1
  23. package/dist/css/component-css/pds-menu-button.css +6 -2
  24. package/dist/css/component-css/pds-nav-menu.css +1 -1
  25. package/dist/css/component-css/pds-navbar.css +2 -2
  26. package/dist/css/component-css/pds-panel-list.css +1 -1
  27. package/dist/css/component-css/pds-panel.css +1 -1
  28. package/dist/css/component-css/pds-row-actions-menu.css +1 -1
  29. package/dist/css/component-css/pds-select.css +1 -1
  30. package/dist/css/component-css/pds-site-footer.css +1 -1
  31. package/dist/css/component-css/pds-status-scrim.css +1 -0
  32. package/dist/css/component-css/pds-table.css +3 -3
  33. package/dist/css/component-css/pds-toaster.css +1 -1
  34. package/dist/css/component-css/pds-user-menu.css +5 -5
  35. package/dist/css/component-css/pds-utility-button.css +2 -2
  36. package/dist/css/component-css/pds-workspace-selector-panel.css +1 -1
  37. package/dist/css/component-css/pds-workspace-selector.css +2 -2
  38. package/dist/css/pds-components.css +30 -26
  39. package/dist/css/pds-core.css +1 -1
  40. package/dist/index.css +1 -1
  41. package/dist/index.d.ts +3 -0
  42. package/dist/index.js +1458 -1294
  43. package/dist/index.js.map +1 -1
  44. package/dist/index.source.d.ts +3 -0
  45. package/dist/libs/types/custom-types.d.ts +1 -1
  46. package/dist/utilities/hooks/useDropdown/useDropdown.d.ts +7 -1
  47. package/package.json +3 -2
@@ -260,7 +260,7 @@
260
260
  "component": "Icon",
261
261
  "from": "iconSize",
262
262
  "to": "size",
263
- "reason": "The iconSize prop has been renamed to size for consistency across V2 icon components. The default ('l') is unchanged, but the 'xs' (10px) value has been removed (see props.typeChanges) use 's' instead."
263
+ "reason": "The iconSize prop has been renamed to size for consistency across V2 icon components. The size scale has since been redesigned (see props.typeChanges) the current default is 'xl' (20px), not v1's default 'l'/20px directly, since every step was renumbered along the way. Net effect for a v1 consumer migrating straight to the current scale: the rendered default size is unchanged (20px), only its name changed."
264
264
  },
265
265
  {
266
266
  "component": "CloseButton",
@@ -272,7 +272,7 @@
272
272
  "component": "PlatformIcon",
273
273
  "from": "iconSize",
274
274
  "to": "size",
275
- "reason": "The iconSize prop has been renamed to size for consistency with V2 component conventions. Size values have also changed to align with the Icon component scale — 'xs', 's', 'm', 'l', 'xl', '2xl', '3xl' — replacing the previous 1.2× ratio scale. The pixel sizes for 'l', 'xl', and '2xl' are different: l is now 1.25rem (was 1.2rem), xl is 1.5rem (was 1.44rem), 2xl is 2rem (was 1.728rem)."
275
+ "reason": "The iconSize prop has been renamed to size for consistency with V2 component conventions. Size values have also changed to align with the Icon component's scale at the time — 'xs', 's', 'm', 'l', 'xl', '2xl', '3xl' — replacing the previous 1.2× ratio scale. The pixel sizes for 'l', 'xl', and '2xl' are different: l is now 1.25rem (was 1.2rem), xl is 1.5rem (was 1.44rem), 2xl is 2rem (was 1.728rem). Note: Icon's own scale has since been redesigned again (see Icon's props.typeChanges) and PlatformIcon was not updated to match — PlatformIcon keeps this xs/s/m/l/xl/2xl/3xl (10-40px) scale, independently of Icon's current one."
276
276
  },
277
277
  {
278
278
  "component": "FileDiff",
@@ -625,6 +625,18 @@
625
625
  "prop": "defaultPresetLabel",
626
626
  "description": "New optional prop naming which presets entry (by its own label) starts out active. The named preset renders pressed in the list, its computed range seeds the selection so the calendar opens on it, and the trigger renders as a real selection rather than muted placeholder text. onChange is deliberately not called for this initial value. Mount-only, like defaultValue on an HTML input, and a no-op (development warning only) when the label matches no entry.",
627
627
  "usage": "Set defaultPresetLabel to one of your presets' labels when the surface's underlying query already has a default window (e.g. a log viewer defaulting to the last 15 minutes), so the trigger reports what is actually on screen. Read your own initial state from the same constant you pass here rather than waiting for onChange. Requires presets and mode='range'."
628
+ },
629
+ {
630
+ "component": "Datepicker",
631
+ "prop": "hourCycle",
632
+ "description": "New optional prop setting the hour format of the showTime field(s), forwarded to each embedded Timepicker. Defaults to 12 (hour + AM/PM, e.g. \"12:30 PM\"); 24 renders a 24-hour segment with no AM/PM (e.g. \"13:30\"). Existing pickers are unchanged.",
633
+ "usage": "Set hourCycle={24} on a surface whose other timestamps are already 24-hour, such as a log viewer. It cannot be reached through locale — the embedded fields always receive an explicit hourCycle, which overrides locale-derived formatting."
634
+ },
635
+ {
636
+ "component": "Datepicker",
637
+ "prop": "showTodayButton",
638
+ "description": "New opt-out prop for the calendar footer's \"Today\" button. Defaults to true, so existing footers are unchanged; false leaves just the end-aligned buttons — Clear, plus Done when mode is \"range\" or showTime is set.",
639
+ "usage": "Set showTodayButton={false} where jumping to today is meaningless or redundant — e.g. a range picker whose presets already cover the current window. Blanking translationStrings.todayButton only empties the label, leaving the button in place."
628
640
  }
629
641
  ],
630
642
  "removals": [
@@ -866,7 +878,7 @@
866
878
  "v1Default": "'sm'",
867
879
  "v2Default": "'m'",
868
880
  "reason": "Default trigger icon size changed from 'sm' to 'm' to align with new standardized size naming and provide better default visibility.",
869
- "migration": "If you relied on the default trigger icon size being small, explicitly pass triggerIconSize='s' to maintain the v1 appearance."
881
+ "migration": "If you relied on the default trigger icon size being small, explicitly pass triggerIconSize='xs' to maintain the v1 appearance (the Icon size scale has since been redesigned — 'xs' is the current name for that same 12px size, not 's', which now means 14px)."
870
882
  },
871
883
  {
872
884
  "component": "ComparisonList",
@@ -897,13 +909,18 @@
897
909
  {
898
910
  "component": "Icon",
899
911
  "prop": "size",
900
- "description": "The 'xs' size value has been removed",
901
- "v1Type": "'xs' | 's' | 'm' | 'l' | 'xl' | '2xl' | '3xl'",
902
- "v2Type": "'s' | 'm' | 'l' | 'xl' | '2xl' | '3xl'",
912
+ "description": "Size scale redesigned twice since v1 — first the 10px 'xs' was dropped (early V2), then the whole scale was later redone to align with the typography scale, reintroducing an 'xs' step at a different (12px) value. This entry describes the net v1 → current-V2 delta.",
913
+ "v1Type": "'xs' (10px) | 's' (12px) | 'm' (16px) | 'l' (20px) | 'xl' (24px) | '2xl' (32px) | '3xl' (40px)",
914
+ "v2Type": "'xs' (12px) | 's' (14px) | 'm' (16px) | 'l' (18px) | 'xl' (20px) | '2xl' (24px) | '3xl' (28px) | '4xl' (32px)",
903
915
  "migration": {
904
- "xs": "s (removed, use 's' instead)"
916
+ "xs": "xs (v1's 10px 'xs' was removed at the initial V2 release, with 's'/12px as the recommended substitute at the time; that same 12px slot is now named 'xs' again — use size='xs' for the closest available match)",
917
+ "s": "xs (same 12px value, renamed)",
918
+ "l": "xl (same 20px value, renamed)",
919
+ "xl": "2xl (same 24px value, renamed)",
920
+ "2xl": "4xl (same 32px value, renamed)",
921
+ "3xl": "removed, no replacement (40px step retired; nearest available is '4xl' at 32px)"
905
922
  },
906
- "reason": "The 10px 'xs' icon size has been removed in v2. It had a single internal usage (the TagsInput remove button, now 's'/12px) and is superseded by 's'. Use size='s' instead."
923
+ "reason": "V1's 10px 'xs' was removed at the initial V2 release (superseded by 's', then 12px). V2's scale was later redesigned to align with the typography scale: every remaining name shifted up one step to keep its pixel value, three new in-between sizes were added ('s' 14px, 'l' 18px, '3xl' 28px), 'xs' was reintroduced at 12px (unrelated to v1's 10px 'xs'), and the old 40px '3xl' step was retired with no replacement."
907
924
  },
908
925
  {
909
926
  "component": "FlexContainer",
@@ -1139,15 +1156,15 @@
1139
1156
  {
1140
1157
  "component": "Tooltip",
1141
1158
  "prop": "triggerIconSize",
1142
- "description": "Size naming convention updated to match standardized naming",
1159
+ "description": "Size naming convention updated to match standardized naming, then later widened to accept the full redesigned Icon size scale.",
1143
1160
  "v1Type": "'sm' | 'md' | 'lg'",
1144
- "v2Type": "'s' | 'm' | 'l'",
1161
+ "v2Type": "IconSize ('xs' | 's' | 'm' | 'l' | 'xl' | '2xl' | '3xl' | '4xl')",
1145
1162
  "migration": {
1146
- "sm": "s",
1147
- "md": "m",
1148
- "lg": "l"
1163
+ "sm": "xs (same 12px value — was briefly 's' under the initial V2 scale, since renamed)",
1164
+ "md": "m (unchanged, 16px)",
1165
+ "lg": "xl (same 20px value — was briefly 'l' under the initial V2 scale, since renamed)"
1149
1166
  },
1150
- "reason": "Standardized size naming across all components. The 'sm', 'md', and 'lg' values have been shortened to 's', 'm', and 'l' for consistency."
1167
+ "reason": "Standardized size naming across all components at the initial V2 release ('sm'/'md'/'lg' 's'/'m'/'l'), then the prop's type was widened to the full Icon size scale once that scale was redesigned to align with typography sizes — every retained value keeps its pixel size but was renamed again in the process (see Icon's props.typeChanges for the full picture)."
1151
1168
  },
1152
1169
  {
1153
1170
  "component": "Badge",
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { FuiPlacement } from '../../libs/types/custom-types';
2
+ import { FuiPlacement, IconSize } from '../../libs/types/custom-types';
3
3
  import './popover.css';
4
4
  export interface PopoverProps extends Omit<ComponentPropsWithoutRef<'div'>, 'content'> {
5
5
  /**
@@ -61,7 +61,7 @@ export interface PopoverProps extends Omit<ComponentPropsWithoutRef<'div'>, 'con
61
61
  /**
62
62
  * Size of the trigger icon. Uses PDS Icon sizing.
63
63
  */
64
- triggerIconSize?: 's' | 'm' | 'l';
64
+ triggerIconSize?: IconSize;
65
65
  }
66
66
  /**
67
67
  * Popover UI component
@@ -0,0 +1,22 @@
1
+ import { ComponentPropsWithoutRef } from 'react';
2
+ import './status-scrim.css';
3
+ export type StatusScrimStatus = 'frozen' | 'restricted';
4
+ export interface StatusScrimProps extends ComponentPropsWithoutRef<'div'> {
5
+ /**
6
+ * Additional class names
7
+ */
8
+ className?: string;
9
+ /**
10
+ * Label text. Defaults to 'Frozen' / 'Restricted' based on status; override
11
+ * for translation.
12
+ */
13
+ label?: string;
14
+ /**
15
+ * Which status the scrim represents. Sets the icon and default label.
16
+ */
17
+ status: StatusScrimStatus;
18
+ }
19
+ /**
20
+ * StatusScrim UI component
21
+ */
22
+ export declare const StatusScrim: ({ className, label, status, ...props }: StatusScrimProps) => import("react/jsx-runtime").JSX.Element;
@@ -47,8 +47,24 @@ export interface TableColumn {
47
47
  * `hasMobileDetailSheet`). Has no effect above the mobile breakpoint.
48
48
  */
49
49
  cardVisible?: boolean;
50
+ /**
51
+ * Additional class name applied to this column's body `<td>` cells
52
+ * (including loading-state skeleton cells). Use for column-specific
53
+ * styling — width, `white-space: nowrap`, padding — that can't be
54
+ * expressed by a prop, without reaching into the table's rendered
55
+ * markup from outside with `:nth-child` selectors. Has no effect on
56
+ * mobile cards.
57
+ */
58
+ cellClassName?: string;
50
59
  /** Content to display in the header cell. */
51
60
  header: ReactNode;
61
+ /**
62
+ * Additional class name applied to this column's `<th>` header cell.
63
+ * See `cellClassName` for the equivalent on body cells — a column
64
+ * needing the same styling in both (e.g. a shared width, for
65
+ * alignment) should pass the same class to both props.
66
+ */
67
+ headerClassName?: string;
52
68
  /** Stable identifier used for rendering cell content from rowData. */
53
69
  id: string;
54
70
  /** When true, renders a sort button next to the header label. */
@@ -85,6 +101,11 @@ export interface TableProps extends ComponentPropsWithoutRef<'table'> {
85
101
  * Only applies in uncontrolled sort mode.
86
102
  */
87
103
  defaultSortOrder?: SortOrder;
104
+ /**
105
+ * Cell padding density. `'compact'` reduces padding for denser data
106
+ * tables. Has no effect on mobile cards (see `hasMobileCards`).
107
+ */
108
+ density?: 'standard' | 'compact';
88
109
  /**
89
110
  * When `true` (default), renders built-in prev/next navigation buttons in
90
111
  * the detail panel footer. Set to `false` to hide the footer entirely.
@@ -211,6 +232,14 @@ export interface TableProps extends ComponentPropsWithoutRef<'table'> {
211
232
  * a sheet and keeps calling `onRowInspect` directly, matching desktop.
212
233
  */
213
234
  hasMobileDetailSheet?: boolean;
235
+ /**
236
+ * When true, renders the table inside a Panel with no padding. Automatically
237
+ * applies first-column spacing and removes the last row's bottom border so
238
+ * it doesn't double up against the footer border. Has no effect at the
239
+ * mobile breakpoint (see `hasMobileCards`) — cards sit flush against the
240
+ * page background instead of inside a Panel.
241
+ */
242
+ hasPanel?: boolean;
214
243
  /**
215
244
  * ID of the currently inspected row. When provided, that row receives a
216
245
  * highlighted background. Use the same ID space as `getRowId`. Only
@@ -314,14 +343,6 @@ export interface TableProps extends ComponentPropsWithoutRef<'table'> {
314
343
  * English defaults are used. Override for translation.
315
344
  */
316
345
  paginationLabels?: PaginationCompactProps['labelStrings'];
317
- /**
318
- * When true, renders the table inside a Panel with no padding. Automatically
319
- * applies first-column spacing and removes the last row's bottom border so
320
- * it doesn't double up against the footer border. Has no effect at the
321
- * mobile breakpoint (see `hasMobileCards`) — cards sit flush against the
322
- * page background instead of inside a Panel.
323
- */
324
- panel?: boolean;
325
346
  /**
326
347
  * Accessible label for the detail panel "previous row" button.
327
348
  * Defaults to `'Previous row'`. Override for translation.
@@ -372,4 +393,4 @@ export interface TableProps extends ComponentPropsWithoutRef<'table'> {
372
393
  */
373
394
  totalItemCount?: number;
374
395
  }
375
- export declare const Table: ({ className, closeDetailPanelLabel, columns, currentPage, defaultSortKey, defaultSortOrder, detailPanelNav, detailPanelTitle, detailPanelWidth, emptyState, emptyStateHeading, emptyStateMessage, footer, getDetailPanelPositionLabel, getPageSizeLabel, getRowClassName, getRowId, getRowSelectDisabledReason, getSelectRowLabel, getSortLabel, hasDesktopDetailPanel, hasMobileCards, hasMobileDetailSheet, inspectedRowId, isLoading, isRowSelectable, itemsPerPage, loadingRowCount, maxHeight, minHeight, nextDetailPanelRowLabel, onDetailPanelNext, onDetailPanelPrev, onPageChange, onPageSizeChange, onRowInspect, onRowSelectionChange, onSort, pageSizeOptions, pageSizeSelectLabel, paginationLabels, panel, prevDetailPanelRowLabel, renderDetailPanel, renderDetailPanelFooter, rowData, selectAllLabel, selectedRows, sortKey, sortOrder, totalItemCount, ...props }: TableProps) => import("react/jsx-runtime").JSX.Element;
396
+ export declare const Table: ({ className, closeDetailPanelLabel, columns, currentPage, defaultSortKey, defaultSortOrder, density, detailPanelNav, detailPanelTitle, detailPanelWidth, emptyState, emptyStateHeading, emptyStateMessage, footer, getDetailPanelPositionLabel, getPageSizeLabel, getRowClassName, getRowId, getRowSelectDisabledReason, getSelectRowLabel, getSortLabel, hasDesktopDetailPanel, hasMobileCards, hasMobileDetailSheet, hasPanel, inspectedRowId, isLoading, isRowSelectable, itemsPerPage, loadingRowCount, maxHeight, minHeight, nextDetailPanelRowLabel, onDetailPanelNext, onDetailPanelPrev, onPageChange, onPageSizeChange, onRowInspect, onRowSelectionChange, onSort, pageSizeOptions, pageSizeSelectLabel, paginationLabels, prevDetailPanelRowLabel, renderDetailPanel, renderDetailPanelFooter, rowData, selectAllLabel, selectedRows, sortKey, sortOrder, totalItemCount, ...props }: TableProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,6 +1,6 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
2
  import { Placement } from '@floating-ui/react';
3
- import { FuiOffset } from '../../libs/types/custom-types';
3
+ import { FuiOffset, IconSize } from '../../libs/types/custom-types';
4
4
  import './tooltip.css';
5
5
  interface TooltipProps extends ComponentPropsWithoutRef<'div'> {
6
6
  /**
@@ -49,7 +49,7 @@ interface TooltipProps extends ComponentPropsWithoutRef<'div'> {
49
49
  /**
50
50
  * Size of the trigger icon. Uses PDS Icon sizing.
51
51
  */
52
- triggerIconSize?: 's' | 'm' | 'l';
52
+ triggerIconSize?: IconSize;
53
53
  /**
54
54
  * Z-index value for the tooltip container. In most cases, the default value should be retained.
55
55
  */
@@ -1,4 +1,5 @@
1
- import { ComponentPropsWithRef, ReactNode } from 'react';
1
+ import { ComponentPropsWithRef, ReactNode, RefObject } from 'react';
2
+ import { type Placement } from '@floating-ui/react';
2
3
  import { StatusDotType } from '../../../libs/components/StatusDot/StatusDot';
3
4
  import { ButtonVariant, HeadingItemType, LinkItemType, MenuItemType, NodeItemType, SeparatorItemType } from '../../../libs/types/custom-types';
4
5
  import { TallyProps } from '../../badges/Tally/Tally';
@@ -65,6 +66,21 @@ export interface MenuButtonProps extends ComponentPropsWithRef<'span'> {
65
66
  * default (which can otherwise leave focus on an ancestor panel).
66
67
  */
67
68
  onOpenChange?: (isOpen: boolean) => void;
69
+ /**
70
+ * Preferred placement of the dropdown panel relative to its anchor.
71
+ * Defaults to `bottom-start` (current behavior). `SplitButton` passes
72
+ * this through unchanged — see its own `placement` prop.
73
+ */
74
+ placement?: Placement;
75
+ /**
76
+ * Ref to an ancestor element that Floating UI should use as the
77
+ * *position* reference (while the trigger button remains the
78
+ * *interaction* reference for click/keyboard). Set internally by
79
+ * `SplitButton` when `isSplitButton` is true, so the panel anchors to
80
+ * the whole split-button control instead of just the caret half. Not
81
+ * intended for direct use outside `SplitButton`.
82
+ */
83
+ positionReferenceRef?: RefObject<HTMLElement | null>;
68
84
  /**
69
85
  * Which size of button to render.
70
86
  */
@@ -1,4 +1,5 @@
1
1
  import { ComponentPropsWithoutRef } from 'react';
2
+ import type { Placement } from '@floating-ui/react';
2
3
  import { ButtonVariant, LinkItemType, MenuItemType } from '../../../libs/types/custom-types';
3
4
  import { PDSIcon } from '../../icons/Icon/Icon';
4
5
  import './split-button.css';
@@ -11,6 +12,16 @@ interface SplitButtonProps extends ComponentPropsWithoutRef<'span'> {
11
12
  * Array of menu items
12
13
  */
13
14
  actionItems: Array<LinkItemType | MenuItemType>;
15
+ /**
16
+ * Anchor the actions menu panel to the whole button (primary action +
17
+ * caret combined) instead of just the caret trigger. Defaults to
18
+ * `false` — the panel positions relative to the caret alone, matching
19
+ * current behavior. Set this when `placement` needs to align the panel
20
+ * with an edge of the whole control (e.g. `bottom-start` under the
21
+ * primary action's left edge, for a table row action) rather than just
22
+ * the caret's narrow width.
23
+ */
24
+ anchorToFullButton?: boolean;
14
25
  /**
15
26
  * Additional class names
16
27
  */
@@ -32,6 +43,14 @@ interface SplitButtonProps extends ComponentPropsWithoutRef<'span'> {
32
43
  * Label for the buttons additional actions menu.
33
44
  */
34
45
  moreActionsLabel?: string;
46
+ /**
47
+ * Preferred placement of the actions menu panel. Defaults to
48
+ * `bottom-start`, matching `MenuButton`'s own default. Aligns relative
49
+ * to the caret trigger alone unless `anchorToFullButton` is set, in
50
+ * which case it aligns relative to the whole control instead. Passed
51
+ * straight through to the underlying `MenuButton`.
52
+ */
53
+ placement?: Placement;
35
54
  /**
36
55
  * Which size of button to render
37
56
  */
@@ -44,5 +63,5 @@ interface SplitButtonProps extends ComponentPropsWithoutRef<'span'> {
44
63
  /**
45
64
  * A component used to render a button with a primary action and a menu of additional options
46
65
  */
47
- export declare const SplitButton: ({ actionItems, className, disabled, iconName, id, moreActionsLabel, size, variant, ...props }: SplitButtonProps) => import("react/jsx-runtime").JSX.Element;
66
+ export declare const SplitButton: ({ actionItems, anchorToFullButton, className, disabled, iconName, id, moreActionsLabel, placement, size, variant, ...props }: SplitButtonProps) => import("react/jsx-runtime").JSX.Element;
48
67
  export {};
@@ -3,7 +3,7 @@
3
3
  *
4
4
  * Generated by: npm run generate:icon-data
5
5
  * Source: icon-registry.ts + Font Awesome packages + custom-icons.tsx
6
- * Generated: 2026-09-11T22:06:16.665Z
6
+ * Generated: 2026-09-16T22:12:38.309Z
7
7
  */
8
8
  import { customIcons } from './custom-icons';
9
9
  export { customIcons };
@@ -137,6 +137,14 @@ interface DatepickerSharedProps extends DatepickerHTMLProps {
137
137
  * doesn't prescribe what goes there.
138
138
  */
139
139
  footerNote?: ReactNode;
140
+ /**
141
+ * Hour format for the `showTime` field(s), forwarded to each embedded
142
+ * `Timepicker`. `12` displays hour + AM/PM (e.g. "12:30 PM"); `24`
143
+ * displays a 24-hour hour segment with no AM/PM (e.g. "13:30"). Not
144
+ * derivable from `locale` — the embedded fields always receive an
145
+ * explicit `hourCycle`, which overrides locale-derived formatting.
146
+ */
147
+ hourCycle?: 12 | 24;
140
148
  /**
141
149
  * Input ID.
142
150
  */
@@ -234,6 +242,14 @@ interface DatepickerSharedProps extends DatepickerHTMLProps {
234
242
  * date. Has no effect unless `showTime` is also true.
235
243
  */
236
244
  showTimeZoneSwitcher?: boolean;
245
+ /**
246
+ * Whether the calendar footer includes its "Today" button. Defaults to
247
+ * `true`. Set to `false` to leave only the end-aligned buttons —
248
+ * `Clear`, plus `Done` when `mode` is `'range'` or `showTime` is set.
249
+ * Blanking `translationStrings.todayButton` only empties the label,
250
+ * leaving the button itself in place.
251
+ */
252
+ showTodayButton?: boolean;
237
253
  /**
238
254
  * IANA time zone identifier (e.g. "America/Los_Angeles", "UTC") used to
239
255
  * combine the selected date with `showTime`'s entered time-of-day into a
@@ -318,5 +334,5 @@ export type DatepickerProps = SingleDatepickerProps | RangeDatepickerProps;
318
334
  /**
319
335
  * Datepicker UI component.
320
336
  */
321
- export declare const Datepicker: ({ allowCustomRange, allowDateRangeSelection, className, defaultPresetLabel, disabled, footerNote, id, inputWidth, inputWidthMin, label, locale, maxDate, message, minDate, mode, onChange, placeholder, presets, required, showLabel, showPresetCalendar, showTime, showTimeZoneSwitcher, timeZone, tooltipText, translationStrings: translationStringsProp, validationMessage, validationStatus, value, visibleMonths, ...props }: DatepickerProps) => import("react/jsx-runtime").JSX.Element;
337
+ export declare const Datepicker: ({ allowCustomRange, allowDateRangeSelection, className, defaultPresetLabel, disabled, footerNote, hourCycle, id, inputWidth, inputWidthMin, label, locale, maxDate, message, minDate, mode, onChange, placeholder, presets, required, showLabel, showPresetCalendar, showTime, showTimeZoneSwitcher, showTodayButton, timeZone, tooltipText, translationStrings: translationStringsProp, validationMessage, validationStatus, value, visibleMonths, ...props }: DatepickerProps) => import("react/jsx-runtime").JSX.Element;
322
338
  export {};
@@ -0,0 +1,151 @@
1
+ import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
+ import { MenuItemType } from '../../../libs/types/custom-types';
3
+ import './bookmarks-menu.css';
4
+ /**
5
+ * A single bookmark row, shared by `BookmarksMenu` and `BookmarksPanel`.
6
+ */
7
+ export type BookmarkItem = {
8
+ /**
9
+ * Stable id, used for React list keys. Omit only if `title` is
10
+ * guaranteed unique across the list.
11
+ */
12
+ id?: string;
13
+ /**
14
+ * Link element the row navigates to on selection (e.g. `<a href='...'>`
15
+ * or a router `Link`).
16
+ */
17
+ linkContent: ReactNode;
18
+ /**
19
+ * Removes the bookmark. Omit to hide the kebab's Remove action.
20
+ */
21
+ onRemove?: () => void;
22
+ /**
23
+ * Renames the bookmark. Omit to hide the kebab's Rename action.
24
+ */
25
+ onRename?: () => void;
26
+ /**
27
+ * Secondary text below the title (e.g. site/team name).
28
+ */
29
+ subtitle?: string;
30
+ /**
31
+ * Bookmark title.
32
+ */
33
+ title: string;
34
+ };
35
+ /**
36
+ * Translation strings shared by `buildBookmarkMenuItems`'s two callers
37
+ * (`BookmarksMenu`, `BookmarksPanel`).
38
+ */
39
+ export type BookmarkMenuItemLabels = {
40
+ /**
41
+ * Returns the accessible label for the Remove action when it's critical
42
+ * (destructive) styled.
43
+ * Defaults to `(bookmark) => \`Remove ${bookmark.title}\``.
44
+ */
45
+ getRemoveCriticalLabel?: (bookmark: BookmarkItem) => string;
46
+ /**
47
+ * Label for the kebab's Remove action.
48
+ * @default 'Remove'
49
+ */
50
+ removeLabel?: string;
51
+ /**
52
+ * Label for the kebab's Rename action.
53
+ * @default 'Rename'
54
+ */
55
+ renameLabel?: string;
56
+ };
57
+ /**
58
+ * Builds the kebab's Rename/Remove menu items for a bookmark row.
59
+ */
60
+ export declare const buildBookmarkMenuItems: (bookmark: BookmarkItem, labels?: BookmarkMenuItemLabels) => MenuItemType[];
61
+ /**
62
+ * Centered icon + message shown in place of the bookmark list when empty.
63
+ */
64
+ export declare const BookmarksEmptyState: ({ text }: {
65
+ text: string;
66
+ }) => import("react/jsx-runtime").JSX.Element;
67
+ /**
68
+ * Prop types for BookmarksMenu
69
+ */
70
+ export interface BookmarksMenuProps extends ComponentPropsWithoutRef<'span'> {
71
+ /**
72
+ * Aria label for the trigger button.
73
+ * @default 'Bookmarks'
74
+ */
75
+ ariaLabel?: string;
76
+ /**
77
+ * The user's bookmarks.
78
+ */
79
+ bookmarks?: BookmarkItem[];
80
+ /**
81
+ * Additional class names
82
+ */
83
+ className?: string;
84
+ /**
85
+ * Label for the header's "+ Create" action.
86
+ * @default 'Create'
87
+ */
88
+ createLabel?: string;
89
+ /**
90
+ * Returns the accessible label for a row's kebab menu.
91
+ * Defaults to `(bookmark) => \`Actions for ${bookmark.title}\``.
92
+ */
93
+ getMenuAriaLabel?: (bookmark: BookmarkItem) => string;
94
+ /**
95
+ * Returns the accessible label for a row's Remove action.
96
+ * Defaults to `(bookmark) => \`Remove ${bookmark.title}\``.
97
+ */
98
+ getRemoveCriticalLabel?: (bookmark: BookmarkItem) => string;
99
+ /**
100
+ * Heading shown in the panel's header.
101
+ * @default 'Bookmarks'
102
+ */
103
+ heading?: string;
104
+ /**
105
+ * Fills the trigger icon to indicate the current page is already
106
+ * bookmarked. The component has no router access of its own, so the
107
+ * consumer derives this from its own current-page/router state.
108
+ */
109
+ isBookmarked?: boolean;
110
+ /**
111
+ * Opt in to swapping the trigger + floating panel for an inline
112
+ * accordion at the mobile breakpoint. Defaults to `false` —
113
+ * BookmarksMenu always renders its normal trigger + panel otherwise,
114
+ * regardless of viewport. Set this explicitly when placing
115
+ * BookmarksMenu inside a mobile nav menu that provides the accordion's
116
+ * expected layout (e.g. `Navbar`'s own mobile menu) — typically
117
+ * `isMobileAccordion={useIsMobile()}`, using the `useIsMobile` hook, so
118
+ * the swap only takes effect at the mobile breakpoint.
119
+ */
120
+ isMobileAccordion?: boolean;
121
+ /**
122
+ * Caps the panel's height in pixels. Omit to size it to the available
123
+ * viewport space only.
124
+ */
125
+ maxHeightValue?: number;
126
+ /**
127
+ * Text shown in place of the list when there are no bookmarks.
128
+ */
129
+ noResultsText?: string;
130
+ /**
131
+ * Called when the "+ Create" action in the panel's header is selected.
132
+ * Omit to hide that action entirely. The consumer owns what happens
133
+ * next (a modal, a new page, etc.).
134
+ */
135
+ onCreateBookmark?: () => void;
136
+ /**
137
+ * Label for a row's kebab Remove action.
138
+ * @default 'Remove'
139
+ */
140
+ removeLabel?: string;
141
+ /**
142
+ * Label for a row's kebab Rename action.
143
+ * @default 'Rename'
144
+ */
145
+ renameLabel?: string;
146
+ }
147
+ /**
148
+ * BookmarksMenu UI component. Top-nav icon trigger that opens a floating
149
+ * panel listing the user's bookmarks.
150
+ */
151
+ export declare const BookmarksMenu: ({ ariaLabel, bookmarks, className, createLabel, getMenuAriaLabel, getRemoveCriticalLabel, heading, isBookmarked, isMobileAccordion, maxHeightValue, noResultsText, onCreateBookmark, removeLabel, renameLabel, ...props }: BookmarksMenuProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,5 +1,6 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
2
  import { ContainerWidth } from '../../../libs/types/custom-types';
3
+ import { GapScale } from '../../../libs/types/layout-types';
3
4
  import './navbar.css';
4
5
  /**
5
6
  * Prop types for Navbar
@@ -26,14 +27,26 @@ export interface NavbarProps extends ComponentPropsWithoutRef<'header'> {
26
27
  */
27
28
  hideBorder?: boolean;
28
29
  /**
29
- * Overrides the horizontal (inline) padding of the desktop navbar bar.
30
- * Accepts any CSS length (e.g. '1rem', '26px', or a token such as
31
- * 'var(--pds-spacing-m)'). Applied symmetrically. Defaults to the
32
- * Container's standard gutter. Useful for aligning navbar content with an
33
- * adjacent app shell (e.g. the AppLayout sidebar) when placed in a `header`
34
- * slot.
30
+ * Overrides the desktop bar's horizontal padding (any CSS length) so it
31
+ * can align with something outside the Navbar, e.g. a sidebar's padding.
32
+ * @default Container's standard gutter
35
33
  */
36
34
  inlinePadding?: string;
35
+ /**
36
+ * Gap between items in the `items-center` slot, desktop only.
37
+ * @default 'm'
38
+ */
39
+ itemsCenterGap?: GapScale;
40
+ /**
41
+ * Gap between items in the `items-left` slot, desktop only.
42
+ * @default 'm'
43
+ */
44
+ itemsLeftGap?: GapScale;
45
+ /**
46
+ * Gap between items in the `items-right` slot, desktop only.
47
+ * @default 'm'
48
+ */
49
+ itemsRightGap?: GapScale;
37
50
  /**
38
51
  * Translation strings for accessibility.
39
52
  */
@@ -45,4 +58,4 @@ export interface NavbarProps extends ComponentPropsWithoutRef<'header'> {
45
58
  /**
46
59
  * Navbar UI component
47
60
  */
48
- export declare const Navbar: ({ children, className, colorType, containerWidth, hideBorder, inlinePadding, translationStrings, ...props }: NavbarProps) => import("react/jsx-runtime").JSX.Element;
61
+ export declare const Navbar: ({ children, className, colorType, containerWidth, hideBorder, inlinePadding, itemsCenterGap, itemsLeftGap, itemsRightGap, translationStrings, ...props }: NavbarProps) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,67 @@
1
+ import { ComponentPropsWithoutRef } from 'react';
2
+ import { BookmarkItem } from '../../navigation/BookmarksMenu/BookmarksMenu';
3
+ import './bookmarks-panel.css';
4
+ /**
5
+ * Prop types for BookmarksPanel
6
+ */
7
+ export interface BookmarksPanelProps extends ComponentPropsWithoutRef<'div'> {
8
+ /**
9
+ * The user's bookmarks.
10
+ */
11
+ bookmarks?: BookmarkItem[];
12
+ /**
13
+ * Additional class names
14
+ */
15
+ className?: string;
16
+ /**
17
+ * Caps the height of the content region only. Passed straight through
18
+ * to `WidgetPanel`.
19
+ */
20
+ contentMaxHeight?: string;
21
+ /**
22
+ * Label for the footer's "Create bookmark" action.
23
+ * @default 'Create bookmark'
24
+ */
25
+ createLabel?: string;
26
+ /**
27
+ * Returns the accessible label for a row's kebab menu.
28
+ * Defaults to `(bookmark) => \`Actions for ${bookmark.title}\``.
29
+ */
30
+ getMenuAriaLabel?: (bookmark: BookmarkItem) => string;
31
+ /**
32
+ * Returns the accessible label for a row's Remove action.
33
+ * Defaults to `(bookmark) => \`Remove ${bookmark.title}\``.
34
+ */
35
+ getRemoveCriticalLabel?: (bookmark: BookmarkItem) => string;
36
+ /**
37
+ * Heading for the panel.
38
+ * @default 'Bookmarks'
39
+ */
40
+ heading?: string;
41
+ /**
42
+ * Text shown in place of the list when there are no bookmarks.
43
+ */
44
+ noResultsText?: string;
45
+ /**
46
+ * Called when the "Create bookmark" footer action is selected. Omit to
47
+ * hide that action entirely. The consumer owns what happens next (a
48
+ * modal, a new page, etc.).
49
+ */
50
+ onCreateBookmark?: () => void;
51
+ /**
52
+ * Label for a row's kebab Remove action.
53
+ * @default 'Remove'
54
+ */
55
+ removeLabel?: string;
56
+ /**
57
+ * Label for a row's kebab Rename action.
58
+ * @default 'Rename'
59
+ */
60
+ renameLabel?: string;
61
+ }
62
+ /**
63
+ * BookmarksPanel UI component. Persistently-visible, embedded variant of
64
+ * the bookmark list for homepage/sidebar widget slots, built on
65
+ * `WidgetPanel`.
66
+ */
67
+ export declare const BookmarksPanel: ({ bookmarks, className, contentMaxHeight, createLabel, getMenuAriaLabel, getRemoveCriticalLabel, heading, noResultsText, onCreateBookmark, removeLabel, renameLabel, ...props }: BookmarksPanelProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,6 +1,6 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
2
  import './panel-list.css';
3
- export type PanelListBackground = 'default' | 'secondary' | 'transparent';
3
+ export type PanelListBackground = 'default' | 'secondary' | 'sunken' | 'transparent';
4
4
  /**
5
5
  * Prop types for PanelList
6
6
  */
@@ -0,0 +1 @@
1
+ @layer pds-v1, pds-v2;@layer pds-v2{.table-story__name-col{width:100%}.table-story__insights-col{min-width:8rem;white-space:nowrap}}