@persona/design-system 0.10.12 → 0.10.14

package/dist/components/TableBox/index.d.mts

@@ -1,3 +1,3 @@
 import { t as DragDirection } from "../../useTableBoxDragAndDrop-MwbXWWDQ.mjs";
-import { a as TableBox, o as TableBoxContext, r as InlineEditConfig, s as TableBoxProps } from "../../TableBoxCell-CQOL30et.mjs";
+import { a as TableBox, o as TableBoxContext, r as InlineEditConfig, s as TableBoxProps } from "../../TableBoxCell-B6Z23mby.mjs";
 export { DragDirection, InlineEditConfig, TableBoxContext, TableBoxProps, TableBox as default };

package/dist/components/TableBox/index.mjs

@@ -1,2 +1,2 @@
-import { n as TableBoxContext, t as TableBox } from "../../TableBox-D9NA-s9l.mjs";
+import { n as TableBoxContext, t as TableBox } from "../../TableBox-RxpwflEb.mjs";
 export { TableBoxContext, TableBox as default };

package/dist/components/VersionHistory/index.mjs

@@ -7,7 +7,7 @@ import { n as Stack, t as HStack } from "../../Stack-Bzom2BTR.mjs";
 import { n as Button, t as IconButton } from "../../IconButton-Bj1fry_K.mjs";
 import { n as DropdownMenu_default } from "../../DropdownMenu-Ip75l4Th.mjs";
 import { t as Spinner } from "../../Spinner-k9ZiOdTr.mjs";
-import { i as Modal_default } from "../../Modal-CiPFqr0L.mjs";
+import { i as Modal_default } from "../../Modal-C_vSgqgl.mjs";
 import { t as TextAreaWithStyle } from "../../TextArea-CQ1YNi2b.mjs";
 import { n as StatusIndicator } from "../../StatusIndicator-CzRaEFSz.mjs";
 import { useCallback, useMemo, useState } from "react";

package/dist/fieldPickerOptions.d.mts

@@ -1,4 +1,4 @@
-import { o as ComboboxOptionsOrGroups } from "./ComboboxBase-CrFweFGi.mjs";
+import { o as ComboboxOptionsOrGroups } from "./ComboboxBase-VIGR58Uc.mjs";
 import { t as FieldRegistry } from "./FieldRegistry-CJwGpUVK.mjs";
 
 //#region src/components/DataTable/TableControls/FiltersV2/fieldPickerOptions.d.ts

package/dist/{filters-DW7pqWv3.d.mts → filters-BXtKuft3.d.mts}

@@ -1,4 +1,4 @@
-import { i as BaseFilterConfig, l as FilterTypeDefinition, t as ActiveFilter, u as FilterTypeResolver } from "./types-NO2GRlM-.mjs";
+import { i as BaseFilterConfig, l as FilterTypeDefinition, t as ActiveFilter, u as FilterTypeResolver } from "./types-BvaXqjUm.mjs";
 import { ComponentProps } from "react";
 import * as _$styled_components0 from "styled-components";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
@@ -19,4 +19,4 @@ declare const Filters: <TFilter extends BaseFilterConfig>({
 }) => _$react_jsx_runtime0.JSX.Element;
 //#endregion
 export { resolveFilterTypeDefinition as a, isFilterActive as i, FiltersContainer as n, synchronizeActiveFilters as o, getActiveFilters as r, Filters as t };
-//# sourceMappingURL=filters-DW7pqWv3.d.mts.map
+//# sourceMappingURL=filters-BXtKuft3.d.mts.map

package/dist/filters.d.mts

@@ -1,2 +1,2 @@
-import { a as resolveFilterTypeDefinition, i as isFilterActive, n as FiltersContainer, o as synchronizeActiveFilters, r as getActiveFilters, t as Filters } from "./filters-DW7pqWv3.mjs";
+import { a as resolveFilterTypeDefinition, i as isFilterActive, n as FiltersContainer, o as synchronizeActiveFilters, r as getActiveFilters, t as Filters } from "./filters-BXtKuft3.mjs";
 export { Filters, FiltersContainer, getActiveFilters, isFilterActive, resolveFilterTypeDefinition, synchronizeActiveFilters };

package/dist/{helpers-BTD2kXLs.d.mts → helpers-gpO42h8t.d.mts}

@@ -1,11 +1,12 @@
 import { n as CheckboxProps } from "./Checkbox-Clt9mCTk.mjs";
 import { i as CommonStrings } from "./strings-DQZIO-n7.mjs";
-import { S as RenderValueStickerFormatConfig, b as DatetimeConfig, d as DataTableColumnImageFormat, h as DataTableColumnStringFormat, l as DataTableColumnFormat, p as DataTableColumnPiiFormat, y as DateConfig } from "./types-Dws2XDz2.mjs";
+import { S as RenderValueStickerFormatConfig, b as DatetimeConfig, d as DataTableColumnImageFormat, h as DataTableColumnStringFormat, l as DataTableColumnFormat, p as DataTableColumnPiiFormat, y as DateConfig } from "./types-CuH-sUJ2.mjs";
 import { ReactNode } from "react";
 
 //#region src/components/DataTable/helpers.d.ts
 declare const renderAsCheckbox: ({
   rowId,
+  rowLabel,
   isChecked,
   onChange,
   onValueChange,
@@ -14,7 +15,8 @@ declare const renderAsCheckbox: ({
   indeterminate,
   strings
 }: {
-  rowId: string;
+  rowId: string; /** Names the row in the checkbox's accessible label; the row id when omitted. */
+  rowLabel?: string;
   isChecked: boolean;
   /**
    * Called when the checkbox is clicked
@@ -87,4 +89,4 @@ declare const renderAsLightweightImage: (value: unknown, config?: DataTableColum
 declare const renderAsPDSFormat: <TData = unknown>(value: unknown, format?: DataTableColumnFormat<TData>, row?: TData, options?: PDSFormatOptions) => string | ReactNode;
 //#endregion
 export { renderAsDate as a, renderAsNumber as c, renderAsSticker as d, renderAsString as f, renderAsCopyableString as i, renderAsPDSFormat as l, renderAsCheckbox as n, renderAsDatetime as o, renderAsURL as p, renderAsCheckboxHeader as r, renderAsLightweightImage as s, PDSFormatOptions as t, renderAsPii as u };
-//# sourceMappingURL=helpers-BTD2kXLs.d.mts.map
+//# sourceMappingURL=helpers-gpO42h8t.d.mts.map

package/dist/helpers.d.mts

@@ -1,2 +1,2 @@
-import { a as renderAsDate, c as renderAsNumber, d as renderAsSticker, f as renderAsString, i as renderAsCopyableString, l as renderAsPDSFormat, n as renderAsCheckbox, o as renderAsDatetime, p as renderAsURL, r as renderAsCheckboxHeader, s as renderAsLightweightImage, t as PDSFormatOptions, u as renderAsPii } from "./helpers-BTD2kXLs.mjs";
+import { a as renderAsDate, c as renderAsNumber, d as renderAsSticker, f as renderAsString, i as renderAsCopyableString, l as renderAsPDSFormat, n as renderAsCheckbox, o as renderAsDatetime, p as renderAsURL, r as renderAsCheckboxHeader, s as renderAsLightweightImage, t as PDSFormatOptions, u as renderAsPii } from "./helpers-gpO42h8t.mjs";
 export { PDSFormatOptions, renderAsCheckbox, renderAsCheckboxHeader, renderAsCopyableString, renderAsDate, renderAsDatetime, renderAsLightweightImage, renderAsNumber, renderAsPDSFormat, renderAsPii, renderAsSticker, renderAsString, renderAsURL };

package/dist/{index-B4tE0RxY.d.mts → index-bkzLg85W.d.mts}

@@ -1,5 +1,5 @@
-import { n as ListBoxItemProps, r as ListBoxProps$1 } from "./ListBox-ZDaitaXR.mjs";
-import { n as LogicRowProps } from "./LogicRow-Bzp5o1sL.mjs";
+import { n as ListBoxItemProps, r as ListBoxProps$1 } from "./ListBox-l47zUDj4.mjs";
+import { n as LogicRowProps } from "./LogicRow-7f17CKrW.mjs";
 import * as _$react from "react";
 import * as _$react_aria_components0 from "react-aria-components";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
@@ -52,4 +52,4 @@ declare const ListBox: {
 };
 //#endregion
 export { ListBox as t };
-//# sourceMappingURL=index-B4tE0RxY.d.mts.map
+//# sourceMappingURL=index-bkzLg85W.d.mts.map

package/dist/{inputFields-DnBb3NhK.d.mts → inputFields-B7parF2l.d.mts}

@@ -1,11 +1,11 @@
 import { n as CheckboxProps } from "./Checkbox-Clt9mCTk.mjs";
-import { n as ComboboxMultiSelectProps } from "./ComboboxMultiSelect-Cp5GBGQj.mjs";
-import { r as ComboboxSingleSelectProps } from "./ComboboxSingleSelect-u7fK3Yvy.mjs";
+import { n as ComboboxMultiSelectProps } from "./ComboboxMultiSelect-D5TWGGKZ.mjs";
+import { r as ComboboxSingleSelectProps } from "./ComboboxSingleSelect-D9It8t6W.mjs";
 import { n as FormFieldBaseProps } from "./FormField-BW5uMzId.mjs";
 import { a as InputProps } from "./Input-DH-5dKor.mjs";
 import { n as RadioGroupProps } from "./RadioGroup-D_z37ZOU.mjs";
 import { i as SegmentedControlProps } from "./SegmentedControl-yVK6kkcx.mjs";
-import { i as SelectProps } from "./Select-DsVeAyZy.mjs";
+import { i as SelectProps } from "./Select-boZ6XP8k.mjs";
 import { t as TextAreaProps } from "./TextArea-BJWEaURJ.mjs";
 import { n as ToggleProps } from "./Toggle-CeIDF9yS.mjs";
 import * as _$react from "react";
@@ -68,4 +68,4 @@ type ComboboxMultiSelectFieldProps<T = string> = ImplementsFormField & ComboboxM
 declare const ComboboxField: (props: ComboboxSingleSelectFieldProps | ComboboxMultiSelectFieldProps) => _$react_jsx_runtime0.JSX.Element;
 //#endregion
 export { ToggleField as _, ComboboxSingleSelectFieldProps as a, RadioGroupFieldProps as c, SelectField as d, SelectFieldProps as f, TextFieldProps as g, TextField as h, ComboboxMultiSelectFieldProps as i, SegmentedControlField as l, TextAreaFieldProps as m, CheckboxFieldProps as n, ImplementsFormField as o, TextAreaField as p, ComboboxField as r, RadioGroupField as s, CheckboxField as t, SegmentedControlFieldProps as u, ToggleFieldProps as v, splitOutFormFieldProps as y };
-//# sourceMappingURL=inputFields-DnBb3NhK.d.mts.map
+//# sourceMappingURL=inputFields-B7parF2l.d.mts.map

package/dist/inputFields.d.mts

@@ -1,2 +1,2 @@
-import { _ as ToggleField, a as ComboboxSingleSelectFieldProps, c as RadioGroupFieldProps, d as SelectField, f as SelectFieldProps, g as TextFieldProps, h as TextField, i as ComboboxMultiSelectFieldProps, l as SegmentedControlField, m as TextAreaFieldProps, n as CheckboxFieldProps, o as ImplementsFormField, p as TextAreaField, r as ComboboxField, s as RadioGroupField, t as CheckboxField, u as SegmentedControlFieldProps, v as ToggleFieldProps, y as splitOutFormFieldProps } from "./inputFields-DnBb3NhK.mjs";
+import { _ as ToggleField, a as ComboboxSingleSelectFieldProps, c as RadioGroupFieldProps, d as SelectField, f as SelectFieldProps, g as TextFieldProps, h as TextField, i as ComboboxMultiSelectFieldProps, l as SegmentedControlField, m as TextAreaFieldProps, n as CheckboxFieldProps, o as ImplementsFormField, p as TextAreaField, r as ComboboxField, s as RadioGroupField, t as CheckboxField, u as SegmentedControlFieldProps, v as ToggleFieldProps, y as splitOutFormFieldProps } from "./inputFields-B7parF2l.mjs";
 export { CheckboxField, CheckboxFieldProps, ComboboxField, ComboboxMultiSelectFieldProps, ComboboxSingleSelectFieldProps, ImplementsFormField, RadioGroupField, RadioGroupFieldProps, SegmentedControlField, SegmentedControlFieldProps, SelectField, SelectFieldProps, TextAreaField, TextAreaFieldProps, TextField, TextFieldProps, ToggleField, ToggleFieldProps, splitOutFormFieldProps };

package/dist/lib/PDSProvider.d.mts

@@ -21,7 +21,8 @@ interface PDSProviderProps {
   locale?: string;
   /**
    * Installs the semantic palette for this mode on `theme` (`withPdsTheming(theme, colorMode)`) and
-   * publishes it as `--pds-*` variables on `:root`. Omit it to keep today's behaviour. Pass
+   * publishes it as `--pds-*` variables and `color-scheme` on `:root`; `useColorMode()` returns it.
+   * Omit it to keep today's behaviour. Pass
    * `readDocumentColorMode()` from `@persona/design-system/lib/colorMode` to follow the host
    * dashboard.
    */

package/dist/lib/PDSProvider.mjs

@@ -1,18 +1,19 @@
 import { t as ThemeProvider } from "../styledComponentsInterop-Cs5CCPRy.mjs";
 import defaultTheme, { withPdsTheming } from "../theme.mjs";
-import { SemanticCssVariables } from "./colorMode.mjs";
+import { ColorModeContext, SemanticCssVariables } from "./colorMode.mjs";
 import { s as PDSI18nProvider } from "../i18n-DaOKaFc2.mjs";
 import { n as RouterProvider } from "../RouterContext-DAQHKOv6.mjs";
-import { useMemo } from "react";
+import { useContext, useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/lib/PDSProvider.tsx
 const PDSProvider = ({ children, theme = defaultTheme, router, strings, locale, colorMode }) => {
 	const providedTheme = useMemo(() => colorMode ? withPdsTheming(theme, colorMode) : theme, [theme, colorMode]);
+	const outerColorMode = useContext(ColorModeContext);
 	const routed = router ? /* @__PURE__ */ jsx(RouterProvider, {
 		...router,
 		children
 	}) : children;
-	return /* @__PURE__ */ jsxs(ThemeProvider, {
+	const provided = /* @__PURE__ */ jsxs(ThemeProvider, {
 		theme: providedTheme,
 		children: [colorMode && /* @__PURE__ */ jsx(SemanticCssVariables, { mode: colorMode }), /* @__PURE__ */ jsx(PDSI18nProvider, {
 			strings,
@@ -20,6 +21,10 @@ const PDSProvider = ({ children, theme = defaultTheme, router, strings, locale,
 			children: routed
 		})]
 	});
+	return /* @__PURE__ */ jsx(ColorModeContext.Provider, {
+		value: colorMode ?? outerColorMode,
+		children: provided
+	});
 };
 //#endregion
 export { PDSProvider as default };

package/dist/lib/PDSProvider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"PDSProvider.mjs","names":[],"sources":["../../src/lib/PDSProvider.tsx"],"sourcesContent":["import { type FC, type PropsWithChildren, useMemo } from 'react';\nimport { ThemeProvider } from 'styled-components';\n\nimport defaultTheme, { type PersonaTheme, withPdsTheming } from '@persona/design-system/theme';\n\nimport { type ColorMode, SemanticCssVariables } from '#src/lib/colorMode';\nimport { PDSI18nProvider, type CommonStringOverrides } from '#src/lib/i18n';\nimport { RouterProvider, type RouterAdapter } from '#src/lib/router';\n\ninterface PDSProviderProps {\n  theme?: PersonaTheme;\n  router?: RouterAdapter;\n  /**\n   * Translations for built-in component copy (table footer, column configuration, saved-view\n   * tabs, filters). Keys you omit keep their English defaults. See `CommonStrings` in\n   * `@persona/design-system/lib/i18n` for the keys.\n   */\n  strings?: CommonStringOverrides;\n  /**\n   * BCP 47 locale (e.g. `'fr-CA'`). Table dates and times follow it; omitted or `'en-US'` keeps\n   * the historical English format.\n   */\n  locale?: string;\n  /**\n   * Installs the semantic palette for this mode on `theme` (`withPdsTheming(theme, colorMode)`) and\n   * publishes it as `--pds-*` variables on `:root`. Omit it to keep today's behaviour. Pass\n   * `readDocumentColorMode()` from `@persona/design-system/lib/colorMode` to follow the host\n   * dashboard.\n   */\n  colorMode?: ColorMode;\n}\n\nconst PDSProvider: FC<PropsWithChildren<PDSProviderProps>> = ({\n  children,\n  theme = defaultTheme,\n  router,\n  strings,\n  locale,\n  colorMode,\n}) => {\n  const providedTheme = useMemo(\n    () => (colorMode ? withPdsTheming(theme, colorMode) : theme),\n    [theme, colorMode],\n  );\n  const routed = router ? <RouterProvider {...router}>{children}</RouterProvider> : children;\n  // Always mounted, even without `strings`/`locale` (it then inherits the outer values), so a host\n  // that turns localization on or off later updates context instead of remounting the subtree.\n  return (\n    <ThemeProvider theme={providedTheme}>\n      {colorMode && <SemanticCssVariables mode={colorMode} />}\n      <PDSI18nProvider strings={strings} locale={locale}>\n        {routed}\n      </PDSI18nProvider>\n    </ThemeProvider>\n  );\n};\n\nexport default PDSProvider;\n"],"mappings":";;;;;;;;AAgCA,MAAM,eAAwD,EAC5D,UACA,QAAQ,cACR,QACA,SACA,QACA,gBACI;CACJ,MAAM,gBAAgB,cACb,YAAY,eAAe,OAAO,UAAU,GAAG,OACtD,CAAC,OAAO,UAAU,CACnB;CACD,MAAM,SAAS,SAAS,oBAAC,gBAAD;EAAgB,GAAI;EAAS;EAA0B,CAAA,GAAG;AAGlF,QACE,qBAAC,eAAD;EAAe,OAAO;YAAtB,CACG,aAAa,oBAAC,sBAAD,EAAsB,MAAM,WAAa,CAAA,EACvD,oBAAC,iBAAD;GAA0B;GAAiB;aACxC;GACe,CAAA,CACJ"}
+{"version":3,"file":"PDSProvider.mjs","names":[],"sources":["../../src/lib/PDSProvider.tsx"],"sourcesContent":["import { type FC, type PropsWithChildren, useContext, useMemo } from 'react';\nimport { ThemeProvider } from 'styled-components';\n\nimport defaultTheme, { type PersonaTheme, withPdsTheming } from '@persona/design-system/theme';\n\nimport { type ColorMode, ColorModeContext, SemanticCssVariables } from '#src/lib/colorMode';\nimport { PDSI18nProvider, type CommonStringOverrides } from '#src/lib/i18n';\nimport { RouterProvider, type RouterAdapter } from '#src/lib/router';\n\ninterface PDSProviderProps {\n  theme?: PersonaTheme;\n  router?: RouterAdapter;\n  /**\n   * Translations for built-in component copy (table footer, column configuration, saved-view\n   * tabs, filters). Keys you omit keep their English defaults. See `CommonStrings` in\n   * `@persona/design-system/lib/i18n` for the keys.\n   */\n  strings?: CommonStringOverrides;\n  /**\n   * BCP 47 locale (e.g. `'fr-CA'`). Table dates and times follow it; omitted or `'en-US'` keeps\n   * the historical English format.\n   */\n  locale?: string;\n  /**\n   * Installs the semantic palette for this mode on `theme` (`withPdsTheming(theme, colorMode)`) and\n   * publishes it as `--pds-*` variables and `color-scheme` on `:root`; `useColorMode()` returns it.\n   * Omit it to keep today's behaviour. Pass\n   * `readDocumentColorMode()` from `@persona/design-system/lib/colorMode` to follow the host\n   * dashboard.\n   */\n  colorMode?: ColorMode;\n}\n\nconst PDSProvider: FC<PropsWithChildren<PDSProviderProps>> = ({\n  children,\n  theme = defaultTheme,\n  router,\n  strings,\n  locale,\n  colorMode,\n}) => {\n  const providedTheme = useMemo(\n    () => (colorMode ? withPdsTheming(theme, colorMode) : theme),\n    [theme, colorMode],\n  );\n  const outerColorMode = useContext(ColorModeContext);\n  const routed = router ? <RouterProvider {...router}>{children}</RouterProvider> : children;\n  // Always mounted, even without `strings`/`locale` (it then inherits the outer values), so a host\n  // that turns localization on or off later updates context instead of remounting the subtree.\n  const provided = (\n    <ThemeProvider theme={providedTheme}>\n      {colorMode && <SemanticCssVariables mode={colorMode} />}\n      <PDSI18nProvider strings={strings} locale={locale}>\n        {routed}\n      </PDSI18nProvider>\n    </ThemeProvider>\n  );\n  return (\n    <ColorModeContext.Provider value={colorMode ?? outerColorMode}>\n      {provided}\n    </ColorModeContext.Provider>\n  );\n};\n\nexport default PDSProvider;\n"],"mappings":";;;;;;;;AAiCA,MAAM,eAAwD,EAC5D,UACA,QAAQ,cACR,QACA,SACA,QACA,gBACI;CACJ,MAAM,gBAAgB,cACb,YAAY,eAAe,OAAO,UAAU,GAAG,OACtD,CAAC,OAAO,UAAU,CACnB;CACD,MAAM,iBAAiB,WAAW,iBAAiB;CACnD,MAAM,SAAS,SAAS,oBAAC,gBAAD;EAAgB,GAAI;EAAS;EAA0B,CAAA,GAAG;CAGlF,MAAM,WACJ,qBAAC,eAAD;EAAe,OAAO;YAAtB,CACG,aAAa,oBAAC,sBAAD,EAAsB,MAAM,WAAa,CAAA,EACvD,oBAAC,iBAAD;GAA0B;GAAiB;aACxC;GACe,CAAA,CACJ;;AAElB,QACE,oBAAC,iBAAiB,UAAlB;EAA2B,OAAO,aAAa;YAC5C;EACyB,CAAA"}

package/dist/lib/colorMode.d.mts

@@ -1,5 +1,6 @@
 import { n as SemanticTokens } from "../semantic-BZbvb3LV.mjs";
 import { i as PersonaTheme, r as PdsThemingMode } from "../theme-CeA8jBRG.mjs";
+import * as _$react from "react";
 import { FC, PropsWithChildren } from "react";
 import * as _$styled_components0 from "styled-components";
 
@@ -13,18 +14,28 @@ declare function createPdsTheme(mode: ColorMode, baseTheme?: PersonaTheme): Pers
 declare function semanticCssVariable(token: keyof SemanticTokens): string;
 /** `--pds-*: value;` for every semantic token. */
 declare function semanticCssDeclarations(semantic: SemanticTokens): string;
-/** Global style: publishes the palette for `mode` on `:root`. */
+declare const ColorModeContext: _$react.Context<ColorMode | undefined>;
+/** The mode of the nearest `PDSProvider colorMode` or `ColorModeScope`; `'light'` outside both. */
+declare function useColorMode(): ColorMode;
+/**
+ * Global style: publishes the palette and `color-scheme` for `mode` on `:root`. Print always uses
+ * the light palette.
+ */
 declare const SemanticCssVariables: _$styled_components0.GlobalStyleComponent<{
   mode: ColorMode;
 }, _$styled_components0.DefaultTheme>;
+interface ColorModeScopeProps {
+  mode: ColorMode;
+  theme?: PersonaTheme;
+}
 /**
  * Renders `children` in `mode`, whatever the surrounding mode is: a nested `ThemeProvider` with
- * `withPdsTheming(outerTheme, mode)` and a `display: contents` wrapper carrying `data-color-mode`
- * and the `--pds-*` declarations for `mode`.
+ * `withPdsTheming(theme ?? outerTheme, mode)` and a `display: contents` wrapper carrying
+ * `data-color-mode`, `color-scheme`, the mode's `FgPrimary` text colour and the `--pds-*`
+ * declarations for `mode`. Changing `mode` re-themes the subtree without remounting it. Print always
+ * uses the light palette.
  */
-declare const ColorModeScope: FC<PropsWithChildren<{
-  mode: ColorMode;
-}>>;
+declare const ColorModeScope: FC<PropsWithChildren<ColorModeScopeProps>>;
 //#endregion
-export { ColorMode, ColorModeScope, SemanticCssVariables, createPdsTheme, readDocumentColorMode, semanticCssDeclarations, semanticCssVariable };
+export { ColorMode, ColorModeContext, ColorModeScope, SemanticCssVariables, createPdsTheme, readDocumentColorMode, semanticCssDeclarations, semanticCssVariable, useColorMode };
 //# sourceMappingURL=colorMode.d.mts.map

package/dist/lib/colorMode.mjs

@@ -1,7 +1,7 @@
 import { a as styled, n as createGlobalStyle, o as useTheme, t as ThemeProvider } from "../styledComponentsInterop-Cs5CCPRy.mjs";
 import { semanticDark, semanticLight } from "../variables/semantic.mjs";
 import defaultTheme, { withPdsTheming } from "../theme.mjs";
-import { useMemo } from "react";
+import { createContext, useContext, useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/lib/colorMode.tsx
 /**
@@ -13,7 +13,7 @@ import { jsx } from "react/jsx-runtime";
 * plain stylesheets resolve the same colours as PDS components.
 *
 * Most apps only need `PDSProvider colorMode={readDocumentColorMode()}`. `ColorModeScope` renders
-* part of a page in the other mode.
+* part of a page in the other mode, and `useColorMode()` reads the mode in effect.
 *
 * Portals: PDS overlays portal to `document.body`. styled-components context crosses the portal, so
 * a PDS overlay opened inside a `ColorModeScope` renders in the scope's mode. CSS custom properties
@@ -39,33 +39,67 @@ const semanticCss = {
 	light: semanticCssDeclarations(semanticLight),
 	dark: semanticCssDeclarations(semanticDark)
 };
-/** Global style: publishes the palette for `mode` on `:root`. */
+const semanticPalettes = {
+	light: semanticLight,
+	dark: semanticDark
+};
+const ColorModeContext = createContext(void 0);
+/** The mode of the nearest `PDSProvider colorMode` or `ColorModeScope`; `'light'` outside both. */
+function useColorMode() {
+	return useContext(ColorModeContext) ?? "light";
+}
+const printAsLight = `
+  @media print {
+    color-scheme: light;
+    ${semanticCss.light}
+  }
+`;
+/**
+* Global style: publishes the palette and `color-scheme` for `mode` on `:root`. Print always uses
+* the light palette.
+*/
 const SemanticCssVariables = createGlobalStyle`
   :root {
+    color-scheme: ${({ mode }) => mode};
     ${({ mode }) => semanticCss[mode]}
+    ${printAsLight}
   }
 `;
 const ColorModeScopeRoot = styled.div`
   display: contents;
+  color-scheme: ${({ $mode }) => $mode};
+  color: ${({ $mode }) => semanticPalettes[$mode].FgPrimary};
   ${({ $mode }) => semanticCss[$mode]}
+  ${printAsLight}
+
+  @media print {
+    color: ${semanticLight.FgPrimary};
+  }
 `;
 /**
 * Renders `children` in `mode`, whatever the surrounding mode is: a nested `ThemeProvider` with
-* `withPdsTheming(outerTheme, mode)` and a `display: contents` wrapper carrying `data-color-mode`
-* and the `--pds-*` declarations for `mode`.
+* `withPdsTheming(theme ?? outerTheme, mode)` and a `display: contents` wrapper carrying
+* `data-color-mode`, `color-scheme`, the mode's `FgPrimary` text colour and the `--pds-*`
+* declarations for `mode`. Changing `mode` re-themes the subtree without remounting it. Print always
+* uses the light palette.
 */
-const ColorModeScope = ({ children, mode }) => {
+const ColorModeScope = ({ children, mode, theme }) => {
 	const outerTheme = useTheme();
-	return /* @__PURE__ */ jsx(ThemeProvider, {
-		theme: useMemo(() => withPdsTheming(outerTheme ?? defaultTheme, mode), [outerTheme, mode]),
-		children: /* @__PURE__ */ jsx(ColorModeScopeRoot, {
-			$mode: mode,
-			"data-color-mode": mode,
-			children
+	const baseTheme = theme ?? outerTheme ?? defaultTheme;
+	const scopedTheme = useMemo(() => withPdsTheming(baseTheme, mode), [baseTheme, mode]);
+	return /* @__PURE__ */ jsx(ColorModeContext.Provider, {
+		value: mode,
+		children: /* @__PURE__ */ jsx(ThemeProvider, {
+			theme: scopedTheme,
+			children: /* @__PURE__ */ jsx(ColorModeScopeRoot, {
+				$mode: mode,
+				"data-color-mode": mode,
+				children
+			})
 		})
 	});
 };
 //#endregion
-export { ColorModeScope, SemanticCssVariables, createPdsTheme, readDocumentColorMode, semanticCssDeclarations, semanticCssVariable };
+export { ColorModeContext, ColorModeScope, SemanticCssVariables, createPdsTheme, readDocumentColorMode, semanticCssDeclarations, semanticCssVariable, useColorMode };
 
 //# sourceMappingURL=colorMode.mjs.map

package/dist/lib/colorMode.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"colorMode.mjs","names":[],"sources":["../../src/lib/colorMode.tsx"],"sourcesContent":["/**\n * Colour-mode helpers for apps embedded in the Persona dashboard.\n *\n * The host stamps the dashboard's mode on `<html data-color-mode>` before first paint (an inline\n * script in each app's `index.html`). These helpers read it, install the matching semantic palette\n * on the styled-components theme, and publish that palette as `--pds-*` CSS custom properties so\n * plain stylesheets resolve the same colours as PDS components.\n *\n * Most apps only need `PDSProvider colorMode={readDocumentColorMode()}`. `ColorModeScope` renders\n * part of a page in the other mode.\n *\n * Portals: PDS overlays portal to `document.body`. styled-components context crosses the portal, so\n * a PDS overlay opened inside a `ColorModeScope` renders in the scope's mode. CSS custom properties\n * don't: plain CSS inside a portaled overlay resolves the `:root` palette, not the scope's.\n */\nimport { type FC, type PropsWithChildren, useMemo } from 'react';\nimport styled, { createGlobalStyle, ThemeProvider, useTheme } from 'styled-components';\n\nimport defaultTheme, { type PdsThemingMode, type PersonaTheme, withPdsTheming } from '#src/theme';\nimport { semanticDark, semanticLight, type SemanticTokens } from '#src/variables/semantic';\n\nexport type ColorMode = Exclude<PdsThemingMode, 'off'>;\n\n/** `'dark'` only when `<html data-color-mode=\"dark\">`; anything else (absent, `DARK`, junk) is light. */\nexport function readDocumentColorMode(doc: Document = document): ColorMode {\n  return doc.documentElement.dataset.colorMode === 'dark' ? 'dark' : 'light';\n}\n\n/** `withPdsTheming(baseTheme, mode)`; `baseTheme` defaults to the PDS default theme. */\nexport function createPdsTheme(\n  mode: ColorMode,\n  baseTheme: PersonaTheme = defaultTheme,\n): PersonaTheme {\n  return withPdsTheming(baseTheme, mode);\n}\n\n/** `FgPrimary` -> `--pds-fg-primary`, `FeedbackDanger1` -> `--pds-feedback-danger-1`. */\nexport function semanticCssVariable(token: keyof SemanticTokens): string {\n  return `--pds-${token\n    .replace(/([a-z])([A-Z0-9])/g, '$1-$2')\n    .replace(/([0-9])([A-Z])/g, '$1-$2')\n    .toLowerCase()}`;\n}\n\n/** `--pds-*: value;` for every semantic token. */\nexport function semanticCssDeclarations(semantic: SemanticTokens): string {\n  return (Object.keys(semantic) as (keyof SemanticTokens)[])\n    .map((token) => `${semanticCssVariable(token)}: ${semantic[token]};`)\n    .join('\\n');\n}\n\nconst semanticCss: Record<ColorMode, string> = {\n  light: semanticCssDeclarations(semanticLight),\n  dark: semanticCssDeclarations(semanticDark),\n};\n\n/** Global style: publishes the palette for `mode` on `:root`. */\nexport const SemanticCssVariables = createGlobalStyle<{ mode: ColorMode }>`\n  :root {\n    ${({ mode }) => semanticCss[mode]}\n  }\n`;\n\nconst ColorModeScopeRoot = styled.div<{ $mode: ColorMode }>`\n  display: contents;\n  ${({ $mode }) => semanticCss[$mode]}\n`;\n\n/**\n * Renders `children` in `mode`, whatever the surrounding mode is: a nested `ThemeProvider` with\n * `withPdsTheming(outerTheme, mode)` and a `display: contents` wrapper carrying `data-color-mode`\n * and the `--pds-*` declarations for `mode`.\n */\nexport const ColorModeScope: FC<PropsWithChildren<{ mode: ColorMode }>> = ({ children, mode }) => {\n  const outerTheme = useTheme() as PersonaTheme | undefined;\n  const scopedTheme = useMemo(\n    () => withPdsTheming(outerTheme ?? defaultTheme, mode),\n    [outerTheme, mode],\n  );\n\n  return (\n    <ThemeProvider theme={scopedTheme}>\n      <ColorModeScopeRoot $mode={mode} data-color-mode={mode}>\n        {children}\n      </ColorModeScopeRoot>\n    </ThemeProvider>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAwBA,SAAgB,sBAAsB,MAAgB,UAAqB;AACzE,QAAO,IAAI,gBAAgB,QAAQ,cAAc,SAAS,SAAS;;;AAIrE,SAAgB,eACd,MACA,YAA0B,cACZ;AACd,QAAO,eAAe,WAAW,KAAK;;;AAIxC,SAAgB,oBAAoB,OAAqC;AACvE,QAAO,SAAS,MACb,QAAQ,sBAAsB,QAAQ,CACtC,QAAQ,mBAAmB,QAAQ,CACnC,aAAa;;;AAIlB,SAAgB,wBAAwB,UAAkC;AACxE,QAAQ,OAAO,KAAK,SAAS,CAC1B,KAAK,UAAU,GAAG,oBAAoB,MAAM,CAAC,IAAI,SAAS,OAAO,GAAG,CACpE,KAAK,KAAK;;AAGf,MAAM,cAAyC;CAC7C,OAAO,wBAAwB,cAAc;CAC7C,MAAM,wBAAwB,aAAa;CAC5C;;AAGD,MAAa,uBAAuB,iBAAsC;;OAEnE,EAAE,WAAW,YAAY,MAAM;;;AAItC,MAAM,qBAAqB,OAAO,GAAyB;;KAEtD,EAAE,YAAY,YAAY,OAAO;;;;;;;AAQtC,MAAa,kBAA8D,EAAE,UAAU,WAAW;CAChG,MAAM,aAAa,UAAU;AAM7B,QACE,oBAAC,eAAD;EAAe,OANG,cACZ,eAAe,cAAc,cAAc,KAAK,EACtD,CAAC,YAAY,KAAK,CAIe;YAC/B,oBAAC,oBAAD;GAAoB,OAAO;GAAM,mBAAiB;GAC/C;GACkB,CAAA;EACP,CAAA"}
+{"version":3,"file":"colorMode.mjs","names":[],"sources":["../../src/lib/colorMode.tsx"],"sourcesContent":["/**\n * Colour-mode helpers for apps embedded in the Persona dashboard.\n *\n * The host stamps the dashboard's mode on `<html data-color-mode>` before first paint (an inline\n * script in each app's `index.html`). These helpers read it, install the matching semantic palette\n * on the styled-components theme, and publish that palette as `--pds-*` CSS custom properties so\n * plain stylesheets resolve the same colours as PDS components.\n *\n * Most apps only need `PDSProvider colorMode={readDocumentColorMode()}`. `ColorModeScope` renders\n * part of a page in the other mode, and `useColorMode()` reads the mode in effect.\n *\n * Portals: PDS overlays portal to `document.body`. styled-components context crosses the portal, so\n * a PDS overlay opened inside a `ColorModeScope` renders in the scope's mode. CSS custom properties\n * don't: plain CSS inside a portaled overlay resolves the `:root` palette, not the scope's.\n */\nimport { createContext, type FC, type PropsWithChildren, useContext, useMemo } from 'react';\nimport styled, { createGlobalStyle, ThemeProvider, useTheme } from 'styled-components';\n\nimport defaultTheme, { type PdsThemingMode, type PersonaTheme, withPdsTheming } from '#src/theme';\nimport { semanticDark, semanticLight, type SemanticTokens } from '#src/variables/semantic';\n\nexport type ColorMode = Exclude<PdsThemingMode, 'off'>;\n\n/** `'dark'` only when `<html data-color-mode=\"dark\">`; anything else (absent, `DARK`, junk) is light. */\nexport function readDocumentColorMode(doc: Document = document): ColorMode {\n  return doc.documentElement.dataset.colorMode === 'dark' ? 'dark' : 'light';\n}\n\n/** `withPdsTheming(baseTheme, mode)`; `baseTheme` defaults to the PDS default theme. */\nexport function createPdsTheme(\n  mode: ColorMode,\n  baseTheme: PersonaTheme = defaultTheme,\n): PersonaTheme {\n  return withPdsTheming(baseTheme, mode);\n}\n\n/** `FgPrimary` -> `--pds-fg-primary`, `FeedbackDanger1` -> `--pds-feedback-danger-1`. */\nexport function semanticCssVariable(token: keyof SemanticTokens): string {\n  return `--pds-${token\n    .replace(/([a-z])([A-Z0-9])/g, '$1-$2')\n    .replace(/([0-9])([A-Z])/g, '$1-$2')\n    .toLowerCase()}`;\n}\n\n/** `--pds-*: value;` for every semantic token. */\nexport function semanticCssDeclarations(semantic: SemanticTokens): string {\n  return (Object.keys(semantic) as (keyof SemanticTokens)[])\n    .map((token) => `${semanticCssVariable(token)}: ${semantic[token]};`)\n    .join('\\n');\n}\n\nconst semanticCss: Record<ColorMode, string> = {\n  light: semanticCssDeclarations(semanticLight),\n  dark: semanticCssDeclarations(semanticDark),\n};\n\nconst semanticPalettes: Record<ColorMode, SemanticTokens> = {\n  light: semanticLight,\n  dark: semanticDark,\n};\n\nexport const ColorModeContext = createContext<ColorMode | undefined>(undefined);\n\n/** The mode of the nearest `PDSProvider colorMode` or `ColorModeScope`; `'light'` outside both. */\nexport function useColorMode(): ColorMode {\n  return useContext(ColorModeContext) ?? 'light';\n}\n\nconst printAsLight = `\n  @media print {\n    color-scheme: light;\n    ${semanticCss.light}\n  }\n`;\n\n/**\n * Global style: publishes the palette and `color-scheme` for `mode` on `:root`. Print always uses\n * the light palette.\n */\nexport const SemanticCssVariables = createGlobalStyle<{ mode: ColorMode }>`\n  :root {\n    color-scheme: ${({ mode }) => mode};\n    ${({ mode }) => semanticCss[mode]}\n    ${printAsLight}\n  }\n`;\n\nconst ColorModeScopeRoot = styled.div<{ $mode: ColorMode }>`\n  display: contents;\n  color-scheme: ${({ $mode }) => $mode};\n  color: ${({ $mode }) => semanticPalettes[$mode].FgPrimary};\n  ${({ $mode }) => semanticCss[$mode]}\n  ${printAsLight}\n\n  @media print {\n    color: ${semanticLight.FgPrimary};\n  }\n`;\n\ninterface ColorModeScopeProps {\n  mode: ColorMode;\n  theme?: PersonaTheme;\n}\n\n/**\n * Renders `children` in `mode`, whatever the surrounding mode is: a nested `ThemeProvider` with\n * `withPdsTheming(theme ?? outerTheme, mode)` and a `display: contents` wrapper carrying\n * `data-color-mode`, `color-scheme`, the mode's `FgPrimary` text colour and the `--pds-*`\n * declarations for `mode`. Changing `mode` re-themes the subtree without remounting it. Print always\n * uses the light palette.\n */\nexport const ColorModeScope: FC<PropsWithChildren<ColorModeScopeProps>> = ({\n  children,\n  mode,\n  theme,\n}) => {\n  const outerTheme = useTheme() as PersonaTheme | undefined;\n  const baseTheme = theme ?? outerTheme ?? defaultTheme;\n  const scopedTheme = useMemo(() => withPdsTheming(baseTheme, mode), [baseTheme, mode]);\n\n  return (\n    <ColorModeContext.Provider value={mode}>\n      <ThemeProvider theme={scopedTheme}>\n        <ColorModeScopeRoot $mode={mode} data-color-mode={mode}>\n          {children}\n        </ColorModeScopeRoot>\n      </ThemeProvider>\n    </ColorModeContext.Provider>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAwBA,SAAgB,sBAAsB,MAAgB,UAAqB;AACzE,QAAO,IAAI,gBAAgB,QAAQ,cAAc,SAAS,SAAS;;;AAIrE,SAAgB,eACd,MACA,YAA0B,cACZ;AACd,QAAO,eAAe,WAAW,KAAK;;;AAIxC,SAAgB,oBAAoB,OAAqC;AACvE,QAAO,SAAS,MACb,QAAQ,sBAAsB,QAAQ,CACtC,QAAQ,mBAAmB,QAAQ,CACnC,aAAa;;;AAIlB,SAAgB,wBAAwB,UAAkC;AACxE,QAAQ,OAAO,KAAK,SAAS,CAC1B,KAAK,UAAU,GAAG,oBAAoB,MAAM,CAAC,IAAI,SAAS,OAAO,GAAG,CACpE,KAAK,KAAK;;AAGf,MAAM,cAAyC;CAC7C,OAAO,wBAAwB,cAAc;CAC7C,MAAM,wBAAwB,aAAa;CAC5C;AAED,MAAM,mBAAsD;CAC1D,OAAO;CACP,MAAM;CACP;AAED,MAAa,mBAAmB,cAAqC,KAAA,EAAU;;AAG/E,SAAgB,eAA0B;AACxC,QAAO,WAAW,iBAAiB,IAAI;;AAGzC,MAAM,eAAe;;;MAGf,YAAY,MAAM;;;;;;;AAQxB,MAAa,uBAAuB,iBAAsC;;qBAErD,EAAE,WAAW,KAAK;OAChC,EAAE,WAAW,YAAY,MAAM;MAChC,aAAa;;;AAInB,MAAM,qBAAqB,OAAO,GAAyB;;mBAExC,EAAE,YAAY,MAAM;YAC3B,EAAE,YAAY,iBAAiB,OAAO,UAAU;KACvD,EAAE,YAAY,YAAY,OAAO;IAClC,aAAa;;;aAGJ,cAAc,UAAU;;;;;;;;;;AAgBrC,MAAa,kBAA8D,EACzE,UACA,MACA,YACI;CACJ,MAAM,aAAa,UAAU;CAC7B,MAAM,YAAY,SAAS,cAAc;CACzC,MAAM,cAAc,cAAc,eAAe,WAAW,KAAK,EAAE,CAAC,WAAW,KAAK,CAAC;AAErF,QACE,oBAAC,iBAAiB,UAAlB;EAA2B,OAAO;YAChC,oBAAC,eAAD;GAAe,OAAO;aACpB,oBAAC,oBAAD;IAAoB,OAAO;IAAM,mBAAiB;IAC/C;IACkB,CAAA;GACP,CAAA;EACU,CAAA"}

package/dist/lib/schemaOptions.mjs

@@ -425,7 +425,7 @@ const validatePath = ({ path, jsonSchema, platformObjectJsonSchema = {}, primiti
 	const { methodChain, partial } = parseWithPartialOption(path);
 	const optionsWithPartiallyMatchedFinalLink = methodChain.links.reduce((currentSchema, link) => {
 		if (currentSchema.length === 0) return [];
-		const optionMatch = currentSchema.find((option) => option.property === link.name);
+		const optionMatch = currentSchema.find((option) => option.property === fullNodeName(link));
 		if (optionMatch) return getSchemaOptions({
 			option: optionMatch,
 			optionFilters,