@persona/design-system 0.10.8 → 0.10.10

package/dist/patterns/IndexTableLayout/index.mjs

@@ -1,6 +1,6 @@
 import { t as Card_default } from "../../Card-DuQHyroh.mjs";
-import { t as DataTable } from "../../DataTable-BvA2H9D9.mjs";
-import { t as PageHeader } from "../../PageHeader-DEKTopzU.mjs";
+import { t as DataTable } from "../../DataTable-CIZJ1vO8.mjs";
+import { t as PageHeader } from "../../PageHeader-7_Hf6rHl.mjs";
 import { a as Section, i as Container } from "../../PageLayout-DjtGrvJa.mjs";
 import { useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/patterns/LayoutLoadingShimmer/index.mjs

@@ -1,9 +1,9 @@
 import { a as styled } from "../../styledComponentsInterop-Cs5CCPRy.mjs";
 import { n as Stack, t as HStack } from "../../Stack-Bzom2BTR.mjs";
 import { t as LoadingShimmer } from "../../LoadingShimmer-oPIv2ESr.mjs";
-import { t as Card_default } from "../../CardV2-BRJbRSts.mjs";
+import { t as Card_default } from "../../CardV2-CrV6eEQb.mjs";
 import { h as Table, m as TableHeaderCell, n as TableBody, p as TableRow, r as TableHead, s as TableCell } from "../../Table-DPi4Dt5H.mjs";
-import { n as PageHeaderContainer } from "../../PageHeader-DEKTopzU.mjs";
+import { n as PageHeaderContainer } from "../../PageHeader-7_Hf6rHl.mjs";
 import { Color, Spacing } from "@persona/design-tokens";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/patterns/containers.tsx

package/dist/patterns/WizardModal/index.mjs

@@ -1,8 +1,8 @@
 import { a as styled } from "../../styledComponentsInterop-Cs5CCPRy.mjs";
 import { semanticColor } from "../../lib/semanticColor.mjs";
 import { t as HStack } from "../../Stack-Bzom2BTR.mjs";
-import { n as Button } from "../../IconButton-DftINsp7.mjs";
-import { i as Modal_default } from "../../Modal-BGlRX63w.mjs";
+import { n as Button } from "../../IconButton-DxHB2g80.mjs";
+import { i as Modal_default } from "../../Modal-De5_bPJ_.mjs";
 import { t as ProgressIndicator } from "../../ProgressIndicator-zt3ndT9U.mjs";
 import { useState } from "react";
 import { Color, Spacing } from "@persona/design-tokens";

package/dist/theme.mjs

@@ -1,5 +1,5 @@
-import { chartingDark, chartingLight } from "./variables/charting.mjs";
 import { semanticDark, semanticLight } from "./variables/semantic.mjs";
+import { chartingDark, chartingLight } from "./variables/charting.mjs";
 import { Color, FontFamilies, Typography } from "@persona/design-tokens";
 //#region src/theme.ts
 const primary = {

package/dist/{types-BXJ6qAGy.d.mts → types-BEdERA4v.d.mts}

@@ -1,4 +1,4 @@
-import { n as ComboboxProps } from "./Combobox-fYZjpn5-.mjs";
+import { n as ComboboxProps } from "./Combobox-CIKqTYZt.mjs";
 import { n as DateRange } from "./DateRangePicker-DlHC2q--.mjs";
 import { ReactNode } from "react";
 import { DateValue } from "@internationalized/date";
@@ -92,4 +92,4 @@ interface FilterTypeDefinition<TFilter extends BaseFilterConfig = FilterConfig>
 type FilterTypeResolver<TFilter extends BaseFilterConfig = FilterConfig> = (config: TFilter) => FilterTypeDefinition<TFilter> | undefined;
 //#endregion
 export { ComboboxFilterConfig as a, FilterRenderOptions as c, InputFilterConfig as d, MultiSelectFilterConfig as f, BaseFilterConfig as i, FilterTypeDefinition as l, AttributeColumn as n, DateRangeFilterConfig as o, SelectFilterConfig as p, BaseActiveFilter as r, FilterConfig as s, ActiveFilter as t, FilterTypeResolver as u };
-//# sourceMappingURL=types-BXJ6qAGy.d.mts.map
+//# sourceMappingURL=types-BEdERA4v.d.mts.map

package/dist/{types-BeFBvQ1c.d.mts → types-BiqzeNsa.d.mts}

@@ -1,4 +1,4 @@
-import { l as MenuItemProps } from "./Menu-BfjvH8mr.mjs";
+import { l as MenuItemProps } from "./Menu-D6OrKCTC.mjs";
 import { o as StickerProps } from "./Sticker-CLvRB8V5.mjs";
 import { ReactNode } from "react";
 import { Column, DeepKeys, FilterFnOption, Header, RowData, SortingState, Table } from "@tanstack/react-table";
@@ -177,4 +177,4 @@ type BulkAction = {
 };
 //#endregion
 export { RowAction as C, RowDataWithTourTarget as D, RowDataWithSubrowsToAlwaysShowIds as E, SortProps as O, RenderValueStickerFormatConfig as S, RowDataWithSubrows as T, DataTableColumns as _, DataTableColumnBaseFormat as a, DatetimeConfig as b, DataTableColumnDatetimeFormat as c, DataTableColumnImageFormat as d, DataTableColumnNumberFormat as f, DataTableColumnURLFormat as g, DataTableColumnStringFormat as h, ColumnConfig as i, StickerMapping as k, DataTableColumnFormat as l, DataTableColumnStickerFormat as m, ClientFilterConfig as n, DataTableColumnCheckboxFormat as o, DataTableColumnPiiFormat as p, ClientFilterType as r, DataTableColumnDateFormat as s, BulkAction as t, DataTableColumnIDFormat as u, DataTableVariables as v, RowDataWithDetails as w, HeadlessFilterConfig as x, DateConfig as y };
-//# sourceMappingURL=types-BeFBvQ1c.d.mts.map
+//# sourceMappingURL=types-BiqzeNsa.d.mts.map

package/dist/types5.d.mts

@@ -1,2 +1,2 @@
-import { a as ComboboxFilterConfig, c as FilterRenderOptions, d as InputFilterConfig, f as MultiSelectFilterConfig, i as BaseFilterConfig, l as FilterTypeDefinition, n as AttributeColumn, o as DateRangeFilterConfig, p as SelectFilterConfig, r as BaseActiveFilter, s as FilterConfig, t as ActiveFilter, u as FilterTypeResolver } from "./types-BXJ6qAGy.mjs";
+import { a as ComboboxFilterConfig, c as FilterRenderOptions, d as InputFilterConfig, f as MultiSelectFilterConfig, i as BaseFilterConfig, l as FilterTypeDefinition, n as AttributeColumn, o as DateRangeFilterConfig, p as SelectFilterConfig, r as BaseActiveFilter, s as FilterConfig, t as ActiveFilter, u as FilterTypeResolver } from "./types-BEdERA4v.mjs";
 export { ActiveFilter, AttributeColumn, BaseActiveFilter, BaseFilterConfig, ComboboxFilterConfig, DateRangeFilterConfig, FilterConfig, FilterRenderOptions, FilterTypeDefinition, FilterTypeResolver, InputFilterConfig, MultiSelectFilterConfig, SelectFilterConfig };

package/dist/useColumnConfiguration.d.mts

@@ -1,5 +1,5 @@
-import { i as TableViewConfigurationProps } from "./TableViewConfigurationDropdown-BWBBUXCs.mjs";
-import { i as ColumnConfig } from "./types-BeFBvQ1c.mjs";
+import { i as TableViewConfigurationProps } from "./TableViewConfigurationDropdown-Cp7ausV_.mjs";
+import { i as ColumnConfig } from "./types-BiqzeNsa.mjs";
 import { RowData } from "@tanstack/react-table";
 
 //#region src/patterns/IndexTableLayout/useColumnConfiguration.d.ts

package/dist/useComboboxFooterAction.d.mts

@@ -1,4 +1,4 @@
-import { p as FooterAction } from "./ComboboxBase-Mb8HyeAI.mjs";
+import { p as FooterAction } from "./ComboboxBase-BPXqJHaQ.mjs";
 import { KeyboardEvent } from "react";
 
 //#region src/components/Combobox/useComboboxFooterAction.d.ts

package/dist/{useTableColumns-DJFy0Gp8.d.mts → useTableColumns-Xd14vx_h.d.mts}

@@ -1,4 +1,4 @@
-import { C as RowAction, O as SortProps, _ as DataTableColumns, l as DataTableColumnFormat } from "./types-BeFBvQ1c.mjs";
+import { C as RowAction, O as SortProps, _ as DataTableColumns, l as DataTableColumnFormat } from "./types-BiqzeNsa.mjs";
 import { ColumnDef, Row, RowData, Table } from "@tanstack/react-table";
 
 //#region src/components/DataTable/useTableColumns.d.ts
@@ -69,4 +69,4 @@ declare function useTableColumns<TData extends RowData, TFormat extends {
 }[]];
 //#endregion
 export { UseTableColumnsParams as n, useTableColumns as r, RenderFormatFn as t };
-//# sourceMappingURL=useTableColumns-DJFy0Gp8.d.mts.map
+//# sourceMappingURL=useTableColumns-Xd14vx_h.d.mts.map

package/dist/useTableColumns.d.mts

@@ -1,2 +1,2 @@
-import { n as UseTableColumnsParams, r as useTableColumns, t as RenderFormatFn } from "./useTableColumns-DJFy0Gp8.mjs";
+import { n as UseTableColumnsParams, r as useTableColumns, t as RenderFormatFn } from "./useTableColumns-Xd14vx_h.mjs";
 export { RenderFormatFn, UseTableColumnsParams, useTableColumns };

package/dist/useTruncation.d.mts

@@ -1,4 +1,4 @@
-import { i as ComboboxOption } from "./ComboboxBase-Mb8HyeAI.mjs";
+import { i as ComboboxOption } from "./ComboboxBase-BPXqJHaQ.mjs";
 import { MutableRefObject, RefObject } from "react";
 
 //#region src/components/Combobox/useTruncation.d.ts

package/dist/variables/charting.mjs

@@ -100,7 +100,7 @@ const chartingDark = {
 		Color.CoreBlue600,
 		Color.CoreOrange700,
 		Color.CoreTeal900,
-		Color.CoreYellow900,
+		Color.CoreYellow800,
 		Color.CoreBlue700,
 		Color.CoreSlate600,
 		Color.CoreTeal800

package/dist/variables/charting.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"charting.mjs","names":[],"sources":["../../src/variables/charting.ts"],"sourcesContent":["// Generated by design-system/scripts/generate-charting-tokens.mjs from\n//   design-system/tokens/charting/light.json\n//   design-system/tokens/charting/dark.json\n// Do not edit by hand — edit the token source and regenerate.\n// This module is where charting palettes map onto core primitives, per colour mode.\n/* oxlint-disable persona-web/no-core-color-tokens */\nimport { Color } from '@persona/design-tokens';\n\n/** Charting palettes: ordered colour lists, named as `ChartingColors` names them. */\nexport interface ChartingTokens {\n  Sequential: readonly Color[];\n  Categorical: readonly Color[];\n  Qualitative: readonly Color[];\n  SequentialMono: readonly Color[];\n  SequentialDivergent: readonly Color[];\n}\n\nexport const chartingLight: ChartingTokens = {\n  Sequential: [\n    Color.CorePurple400,\n    Color.CorePurple300,\n    Color.CorePurple200,\n    Color.CoreTeal400,\n    Color.CoreTeal200,\n    Color.CoreTeal100,\n    Color.CoreSlate400,\n    Color.CoreSlate300,\n  ],\n  Categorical: [\n    Color.CorePurple500,\n    Color.CorePurple700,\n    Color.CoreTeal400,\n    Color.CoreTeal800,\n    Color.CoreGreen400,\n    Color.CoreGreen800,\n    Color.CoreOrange400,\n    Color.CoreOrange700,\n    Color.CoreYellow400,\n    Color.CoreYellow800,\n    Color.CoreRed400,\n    Color.CoreRed600,\n    Color.CoreBlue400,\n    Color.CoreBlue700,\n  ],\n  Qualitative: [\n    Color.CoreBlue500,\n    Color.CoreYellow1000,\n    Color.CoreOrange800,\n    Color.CoreGreen900,\n    Color.CoreGreen700,\n    Color.CoreBlue800,\n    Color.CoreOrange700,\n    Color.CoreTeal900,\n    Color.CoreYellow900,\n    Color.CoreBlue700,\n    Color.CoreSlate600,\n    Color.CoreTeal800,\n  ],\n  SequentialMono: [\n    Color.CoreBlue900,\n    Color.CoreBlue800,\n    Color.CoreBlue700,\n    Color.CoreBlue600,\n    Color.CoreBlue500,\n    Color.CoreBlue400,\n    Color.CoreBlue300,\n    Color.CoreBlue200,\n  ],\n  SequentialDivergent: [\n    Color.CoreBlue900,\n    Color.CoreBlue800,\n    Color.CoreBlue600,\n    Color.CoreBlue400,\n    Color.CoreBlue200,\n    Color.CoreOrange200,\n    Color.CoreOrange400,\n    Color.CoreOrange600,\n    Color.CoreOrange800,\n    Color.CoreOrange900,\n  ],\n};\n\nexport const chartingDark: ChartingTokens = {\n  Sequential: [\n    Color.CorePurple400,\n    Color.CorePurple300,\n    Color.CorePurple200,\n    Color.CoreTeal400,\n    Color.CoreTeal200,\n    Color.CoreTeal100,\n    Color.CoreSlate400,\n    Color.CoreSlate300,\n  ],\n  Categorical: [\n    Color.CorePurple500,\n    Color.CorePurple700,\n    Color.CoreTeal400,\n    Color.CoreTeal800,\n    Color.CoreGreen400,\n    Color.CoreGreen800,\n    Color.CoreOrange400,\n    Color.CoreOrange700,\n    Color.CoreYellow400,\n    Color.CoreYellow800,\n    Color.CoreRed400,\n    Color.CoreRed600,\n    Color.CoreBlue400,\n    Color.CoreBlue700,\n  ],\n  Qualitative: [\n    Color.CoreBlue500,\n    Color.CoreYellow900,\n    Color.CoreOrange800,\n    Color.CoreGreen800,\n    Color.CoreGreen700,\n    Color.CoreBlue600,\n    Color.CoreOrange700,\n    Color.CoreTeal900,\n    Color.CoreYellow900,\n    Color.CoreBlue700,\n    Color.CoreSlate600,\n    Color.CoreTeal800,\n  ],\n  SequentialMono: [\n    Color.CoreBlue900,\n    Color.CoreBlue800,\n    Color.CoreBlue700,\n    Color.CoreBlue600,\n    Color.CoreBlue500,\n    Color.CoreBlue400,\n    Color.CoreBlue300,\n    Color.CoreBlue200,\n  ],\n  SequentialDivergent: [\n    Color.CoreBlue900,\n    Color.CoreBlue800,\n    Color.CoreBlue600,\n    Color.CoreBlue400,\n    Color.CoreBlue200,\n    Color.CoreOrange200,\n    Color.CoreOrange400,\n    Color.CoreOrange600,\n    Color.CoreOrange800,\n    Color.CoreOrange900,\n  ],\n};\n"],"mappings":";;AAiBA,MAAa,gBAAgC;CAC3C,YAAY;EACV,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACD,aAAa;EACX,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACD,aAAa;EACX,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACD,gBAAgB;EACd,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACD,qBAAqB;EACnB,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACF;AAED,MAAa,eAA+B;CAC1C,YAAY;EACV,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACD,aAAa;EACX,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACD,aAAa;EACX,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACD,gBAAgB;EACd,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACD,qBAAqB;EACnB,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACF"}
+{"version":3,"file":"charting.mjs","names":[],"sources":["../../src/variables/charting.ts"],"sourcesContent":["// Generated by design-system/scripts/generate-charting-tokens.mjs from\n//   design-system/tokens/charting/light.json\n//   design-system/tokens/charting/dark.json\n// Do not edit by hand — edit the token source and regenerate.\n// This module is where charting palettes map onto core primitives, per colour mode.\n/* oxlint-disable persona-web/no-core-color-tokens */\nimport { Color } from '@persona/design-tokens';\n\n/** Charting palettes: ordered colour lists, named as `ChartingColors` names them. */\nexport interface ChartingTokens {\n  Sequential: readonly Color[];\n  Categorical: readonly Color[];\n  Qualitative: readonly Color[];\n  SequentialMono: readonly Color[];\n  SequentialDivergent: readonly Color[];\n}\n\nexport const chartingLight: ChartingTokens = {\n  Sequential: [\n    Color.CorePurple400,\n    Color.CorePurple300,\n    Color.CorePurple200,\n    Color.CoreTeal400,\n    Color.CoreTeal200,\n    Color.CoreTeal100,\n    Color.CoreSlate400,\n    Color.CoreSlate300,\n  ],\n  Categorical: [\n    Color.CorePurple500,\n    Color.CorePurple700,\n    Color.CoreTeal400,\n    Color.CoreTeal800,\n    Color.CoreGreen400,\n    Color.CoreGreen800,\n    Color.CoreOrange400,\n    Color.CoreOrange700,\n    Color.CoreYellow400,\n    Color.CoreYellow800,\n    Color.CoreRed400,\n    Color.CoreRed600,\n    Color.CoreBlue400,\n    Color.CoreBlue700,\n  ],\n  Qualitative: [\n    Color.CoreBlue500,\n    Color.CoreYellow1000,\n    Color.CoreOrange800,\n    Color.CoreGreen900,\n    Color.CoreGreen700,\n    Color.CoreBlue800,\n    Color.CoreOrange700,\n    Color.CoreTeal900,\n    Color.CoreYellow900,\n    Color.CoreBlue700,\n    Color.CoreSlate600,\n    Color.CoreTeal800,\n  ],\n  SequentialMono: [\n    Color.CoreBlue900,\n    Color.CoreBlue800,\n    Color.CoreBlue700,\n    Color.CoreBlue600,\n    Color.CoreBlue500,\n    Color.CoreBlue400,\n    Color.CoreBlue300,\n    Color.CoreBlue200,\n  ],\n  SequentialDivergent: [\n    Color.CoreBlue900,\n    Color.CoreBlue800,\n    Color.CoreBlue600,\n    Color.CoreBlue400,\n    Color.CoreBlue200,\n    Color.CoreOrange200,\n    Color.CoreOrange400,\n    Color.CoreOrange600,\n    Color.CoreOrange800,\n    Color.CoreOrange900,\n  ],\n};\n\nexport const chartingDark: ChartingTokens = {\n  Sequential: [\n    Color.CorePurple400,\n    Color.CorePurple300,\n    Color.CorePurple200,\n    Color.CoreTeal400,\n    Color.CoreTeal200,\n    Color.CoreTeal100,\n    Color.CoreSlate400,\n    Color.CoreSlate300,\n  ],\n  Categorical: [\n    Color.CorePurple500,\n    Color.CorePurple700,\n    Color.CoreTeal400,\n    Color.CoreTeal800,\n    Color.CoreGreen400,\n    Color.CoreGreen800,\n    Color.CoreOrange400,\n    Color.CoreOrange700,\n    Color.CoreYellow400,\n    Color.CoreYellow800,\n    Color.CoreRed400,\n    Color.CoreRed600,\n    Color.CoreBlue400,\n    Color.CoreBlue700,\n  ],\n  Qualitative: [\n    Color.CoreBlue500,\n    Color.CoreYellow900,\n    Color.CoreOrange800,\n    Color.CoreGreen800,\n    Color.CoreGreen700,\n    Color.CoreBlue600,\n    Color.CoreOrange700,\n    Color.CoreTeal900,\n    Color.CoreYellow800,\n    Color.CoreBlue700,\n    Color.CoreSlate600,\n    Color.CoreTeal800,\n  ],\n  SequentialMono: [\n    Color.CoreBlue900,\n    Color.CoreBlue800,\n    Color.CoreBlue700,\n    Color.CoreBlue600,\n    Color.CoreBlue500,\n    Color.CoreBlue400,\n    Color.CoreBlue300,\n    Color.CoreBlue200,\n  ],\n  SequentialDivergent: [\n    Color.CoreBlue900,\n    Color.CoreBlue800,\n    Color.CoreBlue600,\n    Color.CoreBlue400,\n    Color.CoreBlue200,\n    Color.CoreOrange200,\n    Color.CoreOrange400,\n    Color.CoreOrange600,\n    Color.CoreOrange800,\n    Color.CoreOrange900,\n  ],\n};\n"],"mappings":";;AAiBA,MAAa,gBAAgC;CAC3C,YAAY;EACV,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACD,aAAa;EACX,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACD,aAAa;EACX,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACD,gBAAgB;EACd,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACD,qBAAqB;EACnB,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACF;AAED,MAAa,eAA+B;CAC1C,YAAY;EACV,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACD,aAAa;EACX,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACD,aAAa;EACX,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACD,gBAAgB;EACd,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACD,qBAAqB;EACnB,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;CACF"}

package/llms.txt

@@ -16,7 +16,7 @@ For exact prop types, prefer the published type declarations (`dist/**/*.d.mts`,
 - [ui-authoring](skills/ui-authoring/SKILL.md): design tokens, PDS implementation guidelines, table guidelines (DataTable vs TableBox vs TableLayout), routing/link adapters (react-router, TanStack, custom), localization (PDSProvider strings/locale), loading states, testing, Storybook
 - [Product UI standard](skills/ui-authoring/STANDARD.md): the rules every screen meets (11 px minimum for copy and 8 px for labels inside charts and diagrams, WCAG AA contrast, reduced motion, status not by colour alone), the screen brief, the `pds/*` oxlint rules that check it (`@persona/design-system/lint`), and the `new-screen` skill for building one screen
 - [Tokens](skills/ui-authoring/TOKENS.md): semantic color tokens (Fg / Surface / Border / Action / Input / Feedback / Status / Opacity) with recipes and a dark-mode checklist; Spacing / Typography catalog, radius, elevation, charts
-- [Patterns](skills/ui-authoring/PATTERNS.md): forms, layout, index tables, indicators, feedback, empty states, charts, panels
+- [Patterns](skills/ui-authoring/PATTERNS.md): forms, layout, index tables, versioned resource headers, indicators, feedback, empty states, charts, panels
 - [Components](skills/ui-authoring/COMPONENTS.md): which PDS component to use (and its import path); APIs live in that component's `.mdx` when one exists, otherwise in `dist/components/<Name>/index.d.mts`
 - [design-system-component-authoring](skills/design-system-component-authoring/SKILL.md): authoring a new PDS component in this repo — clarifying scope, component conventions, prop interface patterns
 
@@ -39,8 +39,8 @@ their own subpaths.
 - Overlays: `Modal`, `WizardModal` (`patterns/WizardModal`), `RightPanel`, `Popover`, `Tooltip` / `TextUnderlineTooltip`, `DropdownMenu`, `FloatingPanel`
 - Modal close button: localize the default with `PDSProvider strings={{ closeModal: translatedLabel }}` (English: "Close"), or override one modal with `contentProps.closeButtonLabel`.
 - Forms: `ConfigFormGroup`, `FormField` (`TextField`, `TextAreaField`, `TableBoxField`), `Input`, `TextArea`, `Select`, `Combobox`, `Checkbox`, `Radio`, `Toggle`, `DatePicker`, `RichTextEditor` (tiptap-based Markdown/HTML editor with menu bar and optional floating toolbar), `FloatingToolbar` (tiptap bubble-menu toolbar)
-- Status: `Sticker` (status badges), `Badge` (counts), `StatusIndicator`
-- Saved views: `TableControls` (or `DataTable.controls`) requires `onSetDefaultView` and `onUnsetDefaultView` together, or neither. Editable views offer "Set as default" / "Unset default" based on `view.isDefault`; the design system confirms before calling either callback and warns that both changes affect the entire organization. Consumers own persistence and must remove their own confirmations to avoid double prompts. Compact controls omit saved views. Pass `starredDefaultView` to star the default view: the `isDefault` view is pinned first with a star icon, cannot be dragged, hidden, deleted or unset, and its menu offers only Save and Duplicate (its name field still renames it); every other view gets the full menu. Rename and Duplicate on it call `onViewNameChange` / `onDuplicateView` with its id; Save calls `onSaveView()` with no id, saving whatever the consumer treats as the current view. A null `currentView` is shown as the starred view, so `onSaveView` and toolbar Save must treat null as the starred view; while an `isDefault` view exists, pass its id as `currentView` rather than null. A lazy default is a consumer-owned placeholder view with `isDefault: true`. While a view is the default the built-in tab is not shown and a `null` `currentView` is displayed as the starred view; with no `isDefault` view the built-in tab is shown starred and read-only.
+- Status: `StatusIndicator` (named lifecycle status, including version and deployment status), `Badge` (counts); `Sticker` is for tags and complementary labels, not status
+- Saved views: `TableControls` (or `DataTable.controls`) requires `onSetDefaultView` and `onUnsetDefaultView` together, or neither. Editable views offer "Set as default" / "Unset default" based on `view.isDefault`; the design system confirms before calling either callback and warns that both changes affect the entire organization. Consumers own persistence and must remove their own confirmations to avoid double prompts. Compact controls omit saved views. Pass `starredDefaultView` to star the default view: the `isDefault` view is pinned first with a star icon, cannot be dragged, hidden, deleted or unset, and its menu offers only Save, Duplicate and Reset (its name field still renames it); every other view gets the full menu. Rename and Duplicate on it call `onViewNameChange` / `onDuplicateView` with its id; Save calls `onSaveView()` with no id, saving whatever the consumer treats as the current view. A null `currentView` is shown as the starred view, so `onSaveView` and toolbar Save must treat null as the starred view; while an `isDefault` view exists, pass its id as `currentView` rather than null. A lazy default is a consumer-owned placeholder view with `isDefault: true`. While a view is the default the built-in tab is not shown and a `null` `currentView` is displayed as the starred view; with no `isDefault` view the built-in tab is shown starred and read-only.
 - DataTable filters: pass `filtersV2` (`TableControlsFiltersV2Props` / `FilterBarProps`) through `DataTable.controls` or directly to `TableControls` for a first-class FilterBar; defaults visible with size derived from `compact`. Hosts own V2 data filtering and feed `onChange` back to `initialState` for active-filter messaging; hydration needs no remount key. Precedence: `filterPanel` → `filtersV2` → legacy `filters`. Legacy `filters` supports `input`, `select`, `multiselect`, `combobox`, and `daterange` with optional `filterResolver`. With `clientFiltering`, `column.filter` generates legacy-only controls backed by TanStack column-filter state, not V2 filtering.
 - SmartTextInput: when method chains are allowed (`ValueType.MethodChain` or `{{...}}` interpolation), you MUST pass `renderFunctionForm`. PDS does not build the function-parameter form, so without it the dialog opened by placing the cursor in a call like `convert_to(...)` shows only the function name over an empty body. It receives `FunctionFormRenderProps` and must call `onComplete(nodes)` or `onCancel()`. In persona-web, `useDashboardSmartTextInputProps` supplies it (backed by `InputMethodChain/FunctionForm`). See components/SmartTextInput/SmartTextInput.mdx.
 - FilterBar: optional `FilterField.condition`, `pickerGroup`, and `disabledReason` support host-defined individual predicates in pills and native Rules; existing aggregate fields stay unchanged. See components/DataTable/DataTable.mdx. Hosts own feature activation and serialization.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@persona/design-system",
-  "version": "0.10.8",
+  "version": "0.10.10",
   "description": "React components for Persona UI",
   "keywords": [
     "tanstack-intent"
@@ -242,8 +242,8 @@
     "@faker-js/faker": "^10.5.0",
     "@figma/code-connect": "^1.4.4",
     "@oxlint/plugins": "1.72.0",
-    "@persona/design-tokens": "0.4.23",
-    "@persona/icons": "0.1.12",
+    "@persona/design-tokens": "0.4.24",
+    "@persona/icons": "0.1.13",
     "@storybook/react": "^10.6.2",
     "@storybook/react-vite": "^10.6.2",
     "@tanstack/intent": "^0.3.6",

package/skills/ui-authoring/COMPONENTS.md

@@ -63,7 +63,7 @@ exists. If there is no `.mdx`, use the published type declarations
 | `Spinner` | Showing that something is loading | `@persona/design-system/components/Spinner` |
 | `Stack` | Flex column — laying out children vertically with token spacing | `@persona/design-system/components/Stack` |
 | `StatusIndicator` | Showing a named status (open, pending, completed, failed, …) | `@persona/design-system/components/StatusIndicator` |
-| `Sticker` | Status badge — tagging nearby content with status or label metadata | `@persona/design-system/components/Sticker` |
+| `Sticker` | Tags and complementary labels on nearby content — not status (use `StatusIndicator`) | `@persona/design-system/components/Sticker` |
 | `SwatchPicker` | Picking a color from a swatch list. Wrap with `FormField` | `@persona/design-system/components/SwatchPicker` |
 | `TabBar`, `Tab` | Tabs — switching between related views or content sections | `@persona/design-system/components/TabBar` |
 | `Table` | Displaying rows and columns with sticky headers, sort, and checkbox selection. Use `DataTable` when you need filtering, bulk actions, or search | `@persona/design-system/components/Table` |

package/skills/ui-authoring/PATTERNS.md

@@ -20,6 +20,7 @@ Which pattern to use, and for what. Patterns with a dedicated doc link to
 | LayoutLoadingShimmer | Filling space while content loads |
 | [Panels](../../patterns/Panels/Panels.mdx) | Use `RightPanel` when the page should stay visible. Use `Modal` when the task needs full attention. Never a custom drawer. |
 | [WizardModal](../../patterns/WizardModal/WizardModal.mdx) | A linear multi-step task behind a page overlay. |
+| [Versioned resources: Page header](../../patterns/VersionedResources/VersionedResourcePageHeader.mdx) | Header order for a versioned resource (template, workflow, schedule): breadcrumbs → object status (icon) → deployment status (no icon) → version status (no icon) → actions (optional Last updated caption, then buttons, one primary rightmost). A code example, not a component: copy the stories and compose `PageHeader` + `StatusIndicator`; there is nothing to import |
 | [CardGrouping](../../patterns/CardGrouping/CardGrouping.mdx) | Distinct records as cards in collapsible groups, for a clean view rather than querying or filtering. Optional controls sit under the list description |
 
 
@@ -198,6 +199,12 @@ Use `StatusIndicator` for a record’s named lifecycle state. Use `Sticker` for
 | needs review / flagged             | `needs_review` |
 | canceled                           | `canceled`     |
 | archived                           | `archived`     |
+| version: draft / archived          | `type="neutral" showIcon={false}` |
+| version: published / deployment: deployed | `type="success" showIcon={false}` |
+
+When several statuses sit together (a versioned resource header), only the object status keeps its
+icon; version and deployment status are label-only. Don't use `status="archived"` for an archived
+version — it adds a minus icon.
 
 
 ```tsx

package/dist/CardV2-BRJbRSts.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"CardV2-BRJbRSts.mjs","names":["CardLoadingShimmer","Heading","Button","DropdownMenu"],"sources":["../src/components/CardV2/SectionHeading.tsx","../src/components/CardV2/Section.tsx","../src/components/CardV2/Card.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, FC, ReactElement, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Color, Spacing, Typography } from '@persona/design-tokens';\nimport { ChevronDownIcon, MoreIcon } from '@persona/icons';\n\nimport Button, { IconButton } from '#src/components/Button';\nimport DropdownButton from '#src/components/DropdownButton';\nimport DropdownMenu from '#src/components/DropdownMenu';\nimport { LoadingShimmer } from '#src/components/LoadingShimmer';\nimport { HStack } from '#src/components/Stack';\nimport { Heading } from '#src/components/Text';\nimport Tooltip from '#src/components/Tooltip';\nimport { HeadlessAriaButton } from '#src/lib/HeadlessAriaButton';\nimport { semanticColor } from '#src/lib/semanticColor';\nimport { TruncatedText } from '#src/lib/TruncatedText';\nimport { focusStyle } from '#src/mixins/focus';\nimport type { HeadingSize } from '#src/mixins/text';\nimport type { IconAction, MenuAction, TextAction } from '#src/types/Action';\nimport { TransitionDuration } from '#src/variables/transitions';\n\n/**\n * Distance from the top of a card to the underside of an expanded top-section heading: the\n * `Spacing[4]` padding above and below a 24px title line, plus the divider. Sticky content inside\n * the card pins here so the heading's divider stays the only line between them.\n */\nexport const CARD_HEADING_STICKY_OFFSET = `calc(${Spacing[9]} + 1px)`;\n\nconst CardLoadingShimmer = styled(LoadingShimmer)`\n  border-radius: ${({ theme }) => theme.card.borderRadius};\n`;\n\nconst StickerContainer = styled.div`\n  display: flex;\n  max-width: 180px;\n`;\n\ntype AccordionContainerProps = {\n  $isTopSection: boolean;\n  $expanded: boolean;\n};\nconst AccordionContainer = styled.div<AccordionContainerProps>`\n  transition: opacity ${TransitionDuration.Faster};\n  position: absolute;\n  opacity: 0;\n\n  height: 12px;\n  width: 12px;\n  display: flex;\n  align-items: center;\n  /* Because of padding in the top section heading we need to offset differently. */\n  /* We want a 12px icon to be off-center in 24px padding, 4px on the right and 8px on the left */\n  left: ${({ $isTopSection }) => ($isTopSection ? '8px' : '-16px')};\n  /* center the icon vertically */\n  top: calc(50% - 6px);\n\n  border-radius: 1px;\n\n  & svg {\n    transition: transform ${TransitionDuration.Faster} ease-out;\n    transform: rotate(${({ $expanded }) => ($expanded ? '0' : '-90deg')});\n  }\n`;\n\nconst HeaderButton = styled(HeadlessAriaButton)`\n  min-width: 0;\n  flex: 1;\n\n  &:hover ~ ${AccordionContainer} {\n    opacity: 1;\n  }\n\n  &:focus-visible ~ ${AccordionContainer} {\n    opacity: 1;\n    ${focusStyle}\n  }\n`;\n\ntype HeadingContainerProps = {\n  $isTopSection: boolean;\n  $divider: boolean;\n  $hasFooter: boolean;\n  $isExpanded: boolean;\n};\nconst HeadingContainer = styled(HStack)<HeadingContainerProps>`\n  position: relative;\n\n  ${({ $isTopSection }) =>\n    $isTopSection &&\n    css`\n      padding: ${Spacing[4]} ${Spacing[5]};\n    `}\n  ${({ $divider }) =>\n    $divider &&\n    css`\n      border-bottom: 1px solid ${({ theme }) => semanticColor(theme, 'BorderSubtle', Color.BorderDivider)};\n    `}\n  ${({ $isTopSection, $hasFooter, $isExpanded }) =>\n    $isTopSection &&\n    !$hasFooter &&\n    !$isExpanded &&\n    css`\n      // We apply 4px of whitespace to the bottom of the card container so that content has a buffer\n      // when being scrolled and still appears inside the card. Here we adjust, subtracting\n      // 4px from the 16px padding.\n      padding-bottom: ${Spacing[3]};\n    `}\n`;\n\ntype StyledHeadingProps = {\n  $isCollapsible: boolean;\n  $isTopSection: boolean;\n  size: HeadingSize;\n};\nconst StyledHeading = styled(Heading)<StyledHeadingProps>`\n  flex: 1;\n  display: flex;\n  align-items: center;\n  gap: ${Spacing[2]};\n  line-height: 24px; // We want an adjusted line-height to hit the target header size.\n  overflow: hidden;\n\n  ${({ $isCollapsible }) => $isCollapsible && 'cursor: pointer;'}\n  ${({ $isTopSection }) =>\n    !$isTopSection &&\n    css`\n      ${Typography.TextLargeBold};\n    `}\n`;\n\nconst isIconAction = (action: IconAction | TextAction): action is IconAction => 'icon' in action;\n\nconst ButtonRow: FC<{\n  actions: (IconAction | TextAction)[];\n  menuActions: MenuAction[];\n}> = ({ actions, menuActions }) => {\n  const buttons = actions\n    .filter((action) => !action.hidden)\n    .map((action, i) => {\n      const key = isIconAction(action)\n        ? (action.id ?? action.ariaLabel ?? `action-${i}`)\n        : (action.id ?? action.label ?? `action-${i}`);\n\n      const button = isIconAction(action) ? (\n        <IconButton\n          id={action.id}\n          key={key}\n          to={action.to}\n          onClick={(e) => {\n            e.stopPropagation();\n            return action.onClick?.(e);\n          }}\n          disabled={action.disabled}\n          aria-label={action.ariaLabel}\n          size='sm'\n        >\n          {action.icon}\n        </IconButton>\n      ) : (\n        <Button\n          id={action.id}\n          key={key}\n          aria-label={action.ariaLabel}\n          to={action.to}\n          onClick={(e) => {\n            e.stopPropagation();\n            return action.onClick?.(e);\n          }}\n          disabled={action.disabled}\n          variant={action.variant ?? 'basic'}\n          size='sm'\n          width='auto'\n          prefixIcon={action.prefixIcon}\n          suffixIcon={action.suffixIcon}\n        >\n          {action.label}\n        </Button>\n      );\n\n      return action.tooltip ? (\n        <Tooltip key={key} {...action.tooltipProps} trigger={button}>\n          {action.tooltip}\n        </Tooltip>\n      ) : (\n        button\n      );\n    });\n\n  return (\n    <HStack>\n      {buttons}\n      {menuActions.length > 0 && (\n        <DropdownButton\n          variant='text'\n          width='icon'\n          size='sm'\n          suffixIcon={undefined}\n          style={{ justifySelf: 'flex-end' }}\n          aria-label='More actions'\n          menuProps={{\n            portal: true,\n          }}\n          menuItems={menuActions\n            .filter((action) => !action.hidden)\n            .map((action) => (\n              <DropdownMenu.Item\n                id={action.id ?? action.label}\n                key={action.id ?? action.label}\n                onClick={action.onClick}\n                disabled={action.disabled}\n              >\n                {action.label}\n              </DropdownMenu.Item>\n            ))}\n        >\n          <MoreIcon />\n        </DropdownButton>\n      )}\n    </HStack>\n  );\n};\n\n/**\n * Private component for rendering the heading of a section, both the primary card heading and\n * section headings.\n */\nexport const SectionHeading: FC<{\n  /**\n   * Whether this is the top-level section of the card which has different visual treatment.\n   */\n  isTopSection: boolean;\n\n  /**\n   * Whether this heading's section has content.\n   */\n  sectionHasContent: boolean;\n\n  /**\n   * Whether this heading's section has a footer.\n   */\n  hasFooter: boolean;\n\n  loading: boolean;\n\n  /**\n   * Title text to render in the heading.\n   */\n  title: string;\n\n  /**\n   * Optional sticker to render after the title.\n   */\n  sticker?: ReactElement;\n\n  /**\n   * Optional icon to render before the title text.\n   *\n   * Usage of this icon slot should be avoided if possible to maintain left-text alignement. If\n   * using this icon slot for a section heading use it for all sections.\n   */\n  leftDecorativeIcon?: ReactElement;\n\n  /**\n   * Optional actions to render in the heading.\n   * Only accepts IconButton or Button components with specific prop restrictions.\n   */\n  actions?: (IconAction | TextAction | undefined)[];\n\n  /**\n   * Optional actions to render in the heading in a menu.\n   */\n  menuActions?: (MenuAction | undefined)[];\n\n  /**\n   * Optional custom content to render in the heading in the button row. Prefer setting `actions` or\n   * `menuActions` if possible.\n   */\n  headerActionsRowContent?: ReactNode;\n\n  /**\n   * Callback to toggle collapsed state of the section. Omit to disable collapsing.\n   */\n  toggle?: () => void;\n\n  /**\n   * Whether the section is currently expanded or collapsed.\n   */\n  isExpanded: boolean;\n\n  /**\n   * Optional props to pass to the heading element. Accepts an `as` key to override the\n   * rendered heading level. Defaults to `h2` for the top-level card heading and `h3` for\n   * section headings so that the document heading hierarchy reflects the visual hierarchy.\n   */\n  headingProps?: Omit<ComponentPropsWithoutRef<'span'>, 'color'> & {\n    as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n  };\n}> = ({\n  isTopSection,\n  sectionHasContent,\n  hasFooter,\n  loading,\n  title,\n  actions = [],\n  menuActions = [],\n  headerActionsRowContent,\n  sticker,\n  leftDecorativeIcon,\n  toggle,\n  isExpanded,\n  headingProps,\n}) => {\n  const renderButtonRow = actions.length > 0 || menuActions.length > 0;\n  const { as: headingAs, ...restHeadingProps } = headingProps ?? {};\n\n  return (\n    <HeadingContainer\n      $isTopSection={isTopSection}\n      $hasFooter={hasFooter}\n      $isExpanded={isExpanded}\n      $divider={isTopSection && isExpanded && sectionHasContent}\n      align='center'\n      justify='space-between'\n      spacing={Spacing[2]}\n    >\n      {loading ? (\n        <CardLoadingShimmer height='24px' width='200px' />\n      ) : (\n        <>\n          {/* https://github.com/adobe/react-spectrum/issues/7444 */}\n          <HeaderButton slot='trigger' isDisabled={!toggle}>\n            <StyledHeading\n              forwardedAs={headingAs ?? (isTopSection ? 'h2' : 'h3')}\n              size='xsm'\n              $isCollapsible={!!toggle}\n              $isTopSection={isTopSection}\n              aria-label={title}\n              {...restHeadingProps}\n            >\n              {leftDecorativeIcon}\n              <TruncatedText>{title}</TruncatedText>\n              {sticker && <StickerContainer>{sticker}</StickerContainer>}\n            </StyledHeading>\n          </HeaderButton>\n          {headerActionsRowContent}\n          {renderButtonRow && (\n            <ButtonRow\n              actions={actions.filter((action) => action != null)}\n              menuActions={menuActions.filter((action) => action != null)}\n            />\n          )}\n          {toggle && (\n            <AccordionContainer $isTopSection={isTopSection} $expanded={isExpanded}>\n              <ChevronDownIcon />\n            </AccordionContainer>\n          )}\n        </>\n      )}\n    </HeadingContainer>\n  );\n};\n","import type { ComponentProps, FC, ReactNode } from 'react';\nimport { Disclosure, DisclosurePanel } from 'react-aria-components';\nimport styled, { css } from 'styled-components';\n\nimport { Color, Spacing } from '@persona/design-tokens';\n\nimport { SectionHeading } from '#src/components/CardV2/SectionHeading';\nimport { LoadingShimmer } from '#src/components/LoadingShimmer';\nimport { HStack } from '#src/components/Stack';\nimport { Paragraph } from '#src/components/Text';\nimport { intersperse } from '#src/lib/intersperse';\nimport { semanticColor } from '#src/lib/semanticColor';\nimport { Z_INDICES } from '#src/lib/zindex';\n\nconst FooterParagraph = styled(Paragraph)`\n  line-height: 16px;\n`;\n\ntype FooterContainerProps = {\n  $divider: boolean;\n};\nconst FooterContainer = styled.div<FooterContainerProps>`\n  ${({ $divider }) =>\n    $divider &&\n    css`\n      border-top: 1px solid ${({ theme }) => semanticColor(theme, 'BorderSubtle', Color.BorderDivider)};\n    `}\n  padding: ${Spacing[3]} ${Spacing[5]} ${Spacing[2]};\n`;\n\ntype MaybeStickyContainerProps = {\n  $enabled: boolean;\n  $bottom?: boolean;\n};\nconst MaybeStickyContainer = styled.div<MaybeStickyContainerProps>`\n  ${({ $enabled }) =>\n    $enabled &&\n    css`\n      // We are using sticky positioning here to have consistent scrollbar behavior between\n      // different card configurations. Usage of sticky allows us to keep the scroll container at\n      // the top of the card DOM structure regardless of whether the heading or footer is sticky.\n      //\n      // This also afaict helps eliminate the need to carry height values through the card DOM\n      // structure to the content container (and possibly needing to adjust heights for heading and footer).\n      position: sticky;\n      top: 0;\n      background-color: ${({ theme }) => semanticColor(theme, 'SurfacePrimary', theme.color.background.primary)};\n      z-index: ${Z_INDICES.sticky};\n    `}\n\n  ${({ $bottom = false }) =>\n    $bottom &&\n    css`\n      top: unset;\n      bottom: 0;\n    `}\n`;\n\ntype StyledDisclosureProps = {\n  $fullHeight: boolean;\n};\nconst StyledDisclosure = styled(Disclosure)<StyledDisclosureProps>`\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n  ${({ $fullHeight }) =>\n    $fullHeight &&\n    css`\n      height: 100%;\n    `}\n`;\n\ntype StyledDisclosurePanelProps = {\n  $isTopSection: boolean;\n};\nconst StyledDisclosurePanel = styled(DisclosurePanel)<StyledDisclosurePanelProps>`\n  flex: 1;\n  ${({ $isTopSection }) =>\n    $isTopSection &&\n    css`\n      // Safari does not support hidden='until-found' so react-aria uses display: none instead.\n      // Since react-aria is using display to hide content we need to not set display ourselves.\n      &:not([aria-hidden='true']) {\n        display: flex;\n      }\n    `}\n`;\n\nconst CardLoadingShimmer = styled(LoadingShimmer)`\n  border-radius: ${({ theme }) => theme.card.borderRadius};\n`;\n\ntype SectionContentContainerProps = {\n  $isTopSection: boolean;\n  $hasHeading: boolean;\n  $hasFooter: boolean;\n};\nconst SectionContentContainer = styled.div<SectionContentContainerProps>`\n  ${({ $isTopSection }) =>\n    $isTopSection &&\n    css`\n      padding: ${Spacing[5]};\n      display: flex;\n      flex-direction: column;\n      gap: ${Spacing[5]};\n      flex: 1;\n      /* Prevent grid blowout https://css-tricks.com/preventing-a-grid-blowout/ */\n      min-width: 0;\n    `}\n\n  ${({ $isTopSection, $hasHeading }) =>\n    !$isTopSection &&\n    $hasHeading &&\n    css`\n      padding-top: ${Spacing[3]};\n    `}\n\n    ${({ $isTopSection, $hasFooter }) =>\n      $isTopSection &&\n      !$hasFooter &&\n      css`\n      // We apply 4px of whitespace to the bottom of the card container so that content has a buffer\n      // when being scrolled and still appears inside the card. Here we adjust, subtracting\n      // 4px from the 24px padding.\n      padding-bottom: 20px;\n    `}\n`;\n\n/**\n * Private component for rendering sections of the card, both the primary card section and\n * individual sections.\n */\nexport const Section: FC<{\n  children?: ReactNode;\n\n  /**\n   * Whether this is the top-level section of the card which has different visual treatment.\n   */\n  isTopSection: boolean;\n\n  /**\n   * Available props for the section's heading.\n   */\n  heading?: Pick<\n    ComponentProps<typeof SectionHeading>,\n    | 'title'\n    | 'actions'\n    | 'menuActions'\n    | 'headerActionsRowContent'\n    | 'sticker'\n    | 'leftDecorativeIcon'\n    | 'headingProps'\n  >;\n\n  /**\n   * Optional footer to render at the bottom of the card. Footer content is rendered as a\n   * paragraph with the items separated by a dot.\n   */\n  footer?: ReactNode[];\n\n  /**\n   * Optional arbitrary footer content to render as-is.\n   */\n  footerContent?: ReactNode;\n\n  /**\n   * Whether the section is collapsible.\n   */\n  collapsible?: boolean;\n\n  /**\n   * Whether the section heading and footer are sticky.\n   */\n  sticky?: boolean;\n\n  /**\n   * Whether the section is initially collapsed.\n   */\n  defaultCollapsed?: boolean;\n\n  /**\n   * If true, the section will be rendered in a loading state.\n   */\n  loading?: boolean;\n\n  /**\n   * Set height of the loading state.\n   */\n  loadingProps?: {\n    height?: string;\n  };\n\n  /**\n   * Control display of the empty state.\n   */\n  empty?: boolean;\n\n  /**\n   * Props for the empty state.\n   */\n  emptyProps?: {\n    /**\n     * Empty state message.\n     */\n    message?: string;\n  };\n\n  fullHeight?: boolean;\n}> = ({\n  children,\n  isTopSection,\n  heading,\n  footer,\n  footerContent,\n  loading = false,\n  loadingProps,\n  empty = false,\n  emptyProps,\n  defaultCollapsed = false,\n  collapsible = false,\n  sticky = false,\n  fullHeight = false,\n}) => {\n  let content: ReactNode;\n  if (loading) {\n    content = <CardLoadingShimmer height={loadingProps?.height ?? '200px'} width='100%' />;\n  } else if (empty) {\n    content = <Paragraph>{emptyProps?.message ?? 'No data collected'}</Paragraph>;\n  } else {\n    content = children;\n  }\n\n  const hasFooter = !!(footer || footerContent);\n  const hasContent = !!content;\n\n  // Normally we would have `isDisabled` as well but there's a react-aria-components quirk\n  // that sets `hidden` on the disclosure panel if both `defaultExpanded` and `isDisabled` are true.\n  // https://github.com/adobe/react-spectrum/issues/7444\n  return (\n    <StyledDisclosure defaultExpanded={!defaultCollapsed} $fullHeight={fullHeight}>\n      {({ isExpanded, state }) => (\n        <>\n          {heading && (\n            <MaybeStickyContainer $enabled={sticky}>\n              <SectionHeading\n                isTopSection={isTopSection}\n                hasFooter={hasFooter}\n                sectionHasContent={hasContent}\n                loading={loading}\n                toggle={collapsible ? state.toggle : undefined}\n                isExpanded={isExpanded}\n                {...heading}\n              />\n            </MaybeStickyContainer>\n          )}\n          {hasContent && (\n            <StyledDisclosurePanel $isTopSection={isTopSection}>\n              <SectionContentContainer\n                $isTopSection={isTopSection}\n                $hasHeading={!!heading}\n                $hasFooter={hasFooter}\n              >\n                {content}\n              </SectionContentContainer>\n            </StyledDisclosurePanel>\n          )}\n          {hasFooter && (\n            <MaybeStickyContainer $enabled={sticky} $bottom>\n              <FooterContainer $divider={hasContent}>\n                {loading ? (\n                  <HStack>\n                    <CardLoadingShimmer height='16px' width='120px' />\n                    <CardLoadingShimmer height='16px' width='120px' />\n                  </HStack>\n                ) : (\n                  <>\n                    {footer && (\n                      <FooterParagraph size='sm'>\n                        <HStack spacing={Spacing[1]}>\n                          {intersperse(\n                            footer\n                              .filter((item) => item != null)\n                              .map((item, i) => <span key={`footer-item-${i}`}>{item}</span>),\n                            (i) => (\n                              <span key={i}>•</span>\n                            ),\n                          )}\n                        </HStack>\n                      </FooterParagraph>\n                    )}\n                    {footerContent}\n                  </>\n                )}\n              </FooterContainer>\n            </MaybeStickyContainer>\n          )}\n        </>\n      )}\n    </StyledDisclosure>\n  );\n};\n","import { type ComponentProps, createContext, type FC, type ReactNode, useContext } from 'react';\nimport { ErrorBoundary } from 'react-error-boundary';\nimport styled from 'styled-components';\n\nimport { Color } from '@persona/design-tokens';\n\nimport { Section } from '#src/components/CardV2/Section';\nimport { Paragraph } from '#src/components/Text';\nimport ConfigContext from '#src/lib/ConfigContext';\nimport { intersperse } from '#src/lib/intersperse';\nimport { semanticColor } from '#src/lib/semanticColor';\nimport { semanticScrollbar } from '#src/mixins/scrollbar';\n\nconst CardContainer = styled.div`\n  border-radius: ${({ theme }) => theme.card.borderRadius};\n  background-color: ${({ theme }) => semanticColor(theme, 'SurfacePrimary', theme.color.background.primary)};\n  // Height has been tricky here.\n  // inherit seems to work well for both grid and flexbox layouts. In a grid we want this\n  // container to receive the full cell height, In a flexbox we want this container to flex, maintaining\n  // the minimum height for it's content.\n  height: inherit;\n  overflow-y: auto;\n  ${semanticScrollbar}\n\n  box-sizing: border-box;\n  // Small buffer so that content is not scrolling right on the edge of the card.\n  border-bottom: 4px solid ${({ theme }) => semanticColor(theme, 'SurfacePrimary', theme.color.background.primary)};\n`;\n\nconst CardContext = createContext<{ isStacked?: boolean }>({});\n\nconst Divider = styled.hr`\n  margin: 0;\n  border: none;\n  border-top: 1px solid ${({ theme }) => semanticColor(theme, 'BorderSubtle', Color.BorderDivider)};\n`;\n\n/**\n * Renders a card section.\n */\nconst PublicSection: FC<\n  Pick<\n    ComponentProps<typeof Section>,\n    | 'children'\n    | 'collapsible'\n    | 'defaultCollapsed'\n    | 'heading'\n    | 'loading'\n    | 'loadingProps'\n    | 'empty'\n    | 'emptyProps'\n  >\n> = (props) => {\n  return <Section isTopSection={false} {...props} />;\n};\n\n/**\n * Render the card in a \"stacked\" mode. Used for rendering multiple cards on top of each other\n * that appear visually as a single card.\n */\nconst Stacked: FC<{\n  children: ReactNode[];\n}> = ({ children }) => {\n  return (\n    <CardContext.Provider value={{ isStacked: true }}>\n      <CardContainer>\n        {intersperse(children, (i) => (\n          <Divider key={i} />\n        ))}\n      </CardContainer>\n    </CardContext.Provider>\n  );\n};\n\nconst DEFAULT_ERROR_MESSAGE = 'Something went wrong loading this card.';\n\n/**\n * Renders a PDS Card.\n *\n * To render sections of the card use `<Card.Section>...</Card.Section>`\n */\nconst Card: FC<\n  {\n    /**\n     * Optional footer to render at the bottom of the card. Footer content is rendered as a\n     * paragraph with the items separated by a dot.\n     */\n    footer?: ReactNode[];\n\n    /**\n     * Optional arbitrary footer content to render as-is.\n     */\n    footerContent?: ReactNode;\n\n    /**\n     * Whether the card heading and footer are sticky.\n     */\n    sticky?: boolean;\n\n    /**\n     * Force the card to render in an errored state. Errors bubbling up from children will also\n     * render the errored state.\n     */\n    errored?: boolean;\n\n    /**\n     * Props for the errored state.\n     */\n    erroredProps?: {\n      /**\n       * Message to render in the errored state.\n       */\n      message?: string;\n      /**\n       * Callback to handle errors. Note this callback is only called when the error is bubbled up\n       * from children, not when `errored` is set to true.\n       */\n      onError?: (error: Error) => void;\n    };\n\n    containerProps?: ComponentProps<typeof CardContainer>;\n\n    /**\n     * Whether the card should render its content with 100% height. This is a bit of a hack for cards\n     * that want full control of their content and don't use sections.\n     */\n    fullHeight?: boolean;\n  } & ComponentProps<typeof PublicSection>\n> = ({ children, errored, erroredProps, containerProps, sticky = true, ...sectionProps }) => {\n  const { isStacked = false } = useContext(CardContext);\n  const { captureException } = useContext(ConfigContext);\n\n  const errorFallback = (\n    <Section isTopSection {...sectionProps}>\n      <Paragraph>{erroredProps?.message ?? DEFAULT_ERROR_MESSAGE}</Paragraph>\n    </Section>\n  );\n\n  const section = (\n    <Section isTopSection sticky={sticky} {...sectionProps}>\n      {children}\n    </Section>\n  );\n\n  return (\n    <ErrorBoundary\n      fallback={\n        isStacked ? (\n          errorFallback\n        ) : (\n          <CardContainer {...containerProps}>{errorFallback}</CardContainer>\n        )\n      }\n      onError={erroredProps?.onError ?? ((error) => captureException(error))}\n    >\n      {isStacked ? (\n        <>{errored ? <>{errorFallback}</> : <>{section}</>}</>\n      ) : (\n        <CardContainer {...containerProps}>\n          {errored ? <>{errorFallback}</> : <>{section}</>}\n        </CardContainer>\n      )}\n    </ErrorBoundary>\n  );\n};\n\nexport default Object.assign(Card, {\n  Section: PublicSection,\n  Stacked: Stacked,\n});\n"],"mappings":"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"}

package/dist/PageHeader-DEKTopzU.mjs

@@ -1,75 +0,0 @@
-import { a as styled } from "./styledComponentsInterop-Cs5CCPRy.mjs";
-import { semanticColor, semanticOnly } from "./lib/semanticColor.mjs";
-import { i as Paragraph, n as Heading } from "./Text-D0vEReED.mjs";
-import { t as Breadcrumbs } from "./Breadcrumbs-Dft2TR4v.mjs";
-import { Spacing } from "@persona/design-tokens";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-//#region src/components/PageHeader/PageHeader.tsx
-const PageHeaderContainer = styled.header`
-  display: flex;
-  width: 100%;
-  justify-content: space-between;
-  align-items: center;
-  padding: ${Spacing[3]} ${Spacing[5]};
-  background-color: ${({ theme }) => semanticColor(theme, "SurfacePrimary", theme.color.background.primary)};
-  border-bottom: 1px solid ${({ theme }) => semanticColor(theme, "BorderDivider", theme.color.border.primary)};
-  box-sizing: border-box;
-  min-height: 56px; /* Standardize height for most PageHeaders */
-`;
-const TitleContainer = styled.div`
-  display: flex;
-  flex: 0 1 auto;
-  min-width: 0;
-  align-items: center;
-  h1 {
-    margin: 0;
-    ${semanticOnly((tokens) => `color: ${tokens.FgPrimary};`)}
-  }
-  p {
-    margin: 0 0 0 ${Spacing[2]};
-    ${semanticOnly((tokens) => `color: ${tokens.FgSecondary};`)}
-  }
-`;
-const LeftContainer = styled.div`
-  display: flex;
-  flex: 1 1 auto;
-  align-items: center;
-  gap: ${Spacing[2]};
-  min-width: 0;
-  & > :not(${TitleContainer}) {
-    flex-shrink: 0;
-  }
-`;
-const RightContainer = styled.div`
-  display: flex;
-  gap: ${Spacing[2]};
-  margin-left: ${Spacing[3]};
-  flex-shrink: 0;
-`;
-const PageHeader = ({ title, breadcrumbs, subtitle, level = "product", prepend, append, children, ...props }) => /* @__PURE__ */ jsxs(PageHeaderContainer, {
-	...props,
-	children: [/* @__PURE__ */ jsxs(LeftContainer, { children: [
-		prepend,
-		/* @__PURE__ */ jsxs(TitleContainer, { children: [breadcrumbs ? /* @__PURE__ */ jsx(Breadcrumbs, {
-			size: "lg",
-			...breadcrumbs
-		}) : /* @__PURE__ */ jsxs(Fragment, { children: [level === "product" && /* @__PURE__ */ jsx(Heading, {
-			as: "h1",
-			size: "sm",
-			children: title
-		}), level === "detail" && /* @__PURE__ */ jsx(Paragraph, {
-			as: "h1",
-			size: "lg",
-			color: "primary",
-			children: title
-		})] }), subtitle && /* @__PURE__ */ jsx(Paragraph, {
-			size: "md",
-			children: subtitle
-		})] }),
-		append
-	] }), children && /* @__PURE__ */ jsx(RightContainer, { children })]
-});
-//#endregion
-export { PageHeaderContainer as n, PageHeader as t };
-
-//# sourceMappingURL=PageHeader-DEKTopzU.mjs.map

package/dist/PageHeader-DEKTopzU.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"PageHeader-DEKTopzU.mjs","names":[],"sources":["../src/components/PageHeader/PageHeader.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\n\nimport Breadcrumbs, { type BreadcrumbsProps } from '#src/components/Breadcrumbs';\nimport { Heading, Paragraph } from '#src/components/Text';\nimport { semanticColor, semanticOnly } from '#src/lib/semanticColor';\n\nexport const PageHeaderContainer = styled.header`\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n  align-items: center;\n  padding: ${Spacing[3]} ${Spacing[5]};\n  background-color: ${({ theme }) => semanticColor(theme, 'SurfacePrimary', theme.color.background.primary)};\n  border-bottom: 1px solid ${({ theme }) => semanticColor(theme, 'BorderDivider', theme.color.border.primary)};\n  box-sizing: border-box;\n  min-height: 56px; /* Standardize height for most PageHeaders */\n`;\n\nconst TitleContainer = styled.div`\n  display: flex;\n  flex: 0 1 auto;\n  min-width: 0;\n  align-items: center;\n  h1 {\n    margin: 0;\n    ${semanticOnly((tokens) => `color: ${tokens.FgPrimary};`)}\n  }\n  p {\n    margin: 0 0 0 ${Spacing[2]};\n    ${semanticOnly((tokens) => `color: ${tokens.FgSecondary};`)}\n  }\n`;\n\nconst LeftContainer = styled.div`\n  display: flex;\n  flex: 1 1 auto;\n  align-items: center;\n  gap: ${Spacing[2]};\n  min-width: 0;\n  & > :not(${TitleContainer}) {\n    flex-shrink: 0;\n  }\n`;\n\nconst RightContainer = styled.div`\n  display: flex;\n  gap: ${Spacing[2]};\n  margin-left: ${Spacing[3]};\n  flex-shrink: 0;\n`;\n\ninterface PageHeaderCommonProps {\n  level?: 'product' | 'detail';\n  prepend?: ReactNode;\n  append?: ReactNode;\n  children?: ReactNode;\n}\n\n/** Exactly one heading source is required: either `title` or `breadcrumbs`. */\nexport type PageHeaderProps = PageHeaderCommonProps &\n  (\n    | { title: ReactNode; subtitle?: ReactNode; breadcrumbs?: never }\n    | {\n        title?: never;\n        /**\n         * The subtitle is sunset in the breadcrumbs variant (PX-1299); fold the value it\n         * carried (e.g. an object ID) into the current crumb, with a copy action if useful.\n         */\n        subtitle?: never;\n        /** Renders in place of `title`; the current crumb becomes the page `h1`, at `lg` size. */\n        breadcrumbs: BreadcrumbsProps;\n      }\n  );\n\nconst PageHeader = ({\n  title,\n  breadcrumbs,\n  subtitle,\n  level = 'product',\n  prepend,\n  append,\n  children,\n  ...props\n}: PageHeaderProps) => (\n  <PageHeaderContainer {...props}>\n    <LeftContainer>\n      {prepend}\n      <TitleContainer>\n        {breadcrumbs ? (\n          <Breadcrumbs size='lg' {...breadcrumbs} />\n        ) : (\n          <>\n            {level === 'product' && (\n              <Heading as='h1' size='sm'>\n                {title}\n              </Heading>\n            )}\n            {level === 'detail' && (\n              <Paragraph as='h1' size='lg' color='primary'>\n                {title}\n              </Paragraph>\n            )}\n          </>\n        )}\n        {subtitle && <Paragraph size='md'>{subtitle}</Paragraph>}\n      </TitleContainer>\n      {append}\n    </LeftContainer>\n    {children && <RightContainer>{children}</RightContainer>}\n  </PageHeaderContainer>\n);\n\nexport default PageHeader;\n"],"mappings":";;;;;;;AASA,MAAa,sBAAsB,OAAO,MAAM;;;;;aAKnC,QAAQ,GAAG,GAAG,QAAQ,GAAG;uBACf,EAAE,YAAY,cAAc,OAAO,kBAAkB,MAAM,MAAM,WAAW,QAAQ,CAAC;8BAC9E,EAAE,YAAY,cAAc,OAAO,iBAAiB,MAAM,MAAM,OAAO,QAAQ,CAAC;;;;AAK9G,MAAM,iBAAiB,OAAO,GAAG;;;;;;;MAO3B,cAAc,WAAW,UAAU,OAAO,UAAU,GAAG,CAAC;;;oBAG1C,QAAQ,GAAG;MACzB,cAAc,WAAW,UAAU,OAAO,YAAY,GAAG,CAAC;;;AAIhE,MAAM,gBAAgB,OAAO,GAAG;;;;SAIvB,QAAQ,GAAG;;aAEP,eAAe;;;;AAK5B,MAAM,iBAAiB,OAAO,GAAG;;SAExB,QAAQ,GAAG;iBACH,QAAQ,GAAG;;;AA2B5B,MAAM,cAAc,EAClB,OACA,aACA,UACA,QAAQ,WACR,SACA,QACA,UACA,GAAG,YAEH,qBAAC,qBAAD;CAAqB,GAAI;WAAzB,CACE,qBAAC,eAAD,EAAA,UAAA;EACG;EACD,qBAAC,gBAAD,EAAA,UAAA,CACG,cACC,oBAAC,aAAD;GAAa,MAAK;GAAK,GAAI;GAAe,CAAA,GAE1C,qBAAA,UAAA,EAAA,UAAA,CACG,UAAU,aACT,oBAAC,SAAD;GAAS,IAAG;GAAK,MAAK;aACnB;GACO,CAAA,EAEX,UAAU,YACT,oBAAC,WAAD;GAAW,IAAG;GAAK,MAAK;GAAK,OAAM;aAChC;GACS,CAAA,CAEb,EAAA,CAAA,EAEJ,YAAY,oBAAC,WAAD;GAAW,MAAK;aAAM;GAAqB,CAAA,CACzC,EAAA,CAAA;EAChB;EACa,EAAA,CAAA,EACf,YAAY,oBAAC,gBAAD,EAAiB,UAA0B,CAAA,CACpC"}