@pantheon-systems/pds-toolkit-react 2.0.0-alpha.30 → 2.0.0-alpha.32

package/dist/components/{navigation/DashboardSearch/DashboardSearch.d.ts → SiteSearch/SiteSearch.d.ts}

@@ -1,14 +1,14 @@
 import { ComponentPropsWithoutRef } from 'react';
-import { SiteOption } from '../../../libs/components/SiteOptionDisplay/SiteOptionDisplay';
-import './dashboard-search.css';
+import { SiteOption } from '../../libs/components/SiteOptionDisplay/SiteOptionDisplay';
+import './site-search.css';
 type LabelStrings = {
     clearButton?: string;
     inputInstructions?: string;
 };
 /**
- * Prop types for DashboardSearch
+ * Prop types for SiteSearch
  */
-export interface DashboardSearchProps extends ComponentPropsWithoutRef<'div'> {
+export interface SiteSearchProps extends ComponentPropsWithoutRef<'div'> {
     /**
      * Additional class names
      */
@@ -17,11 +17,6 @@ export interface DashboardSearchProps extends ComponentPropsWithoutRef<'div'> {
      * Is the search input disabled?
      */
     disabled?: boolean;
-    /**
-     * Offset for the starting right position for the search input in rems.
-     * @deprecated This prop is no longer used since absolute positioning was removed.
-     */
-    horizontalOffset?: number;
     /**
      * ID for the component.
      */
@@ -64,7 +59,7 @@ export interface DashboardSearchProps extends ComponentPropsWithoutRef<'div'> {
     siteList?: SiteOption[];
 }
 /**
- * DashboardSearch UI component
+ * SiteSearch UI component
  */
-export declare const DashboardSearch: ({ className, disabled, horizontalOffset: _horizontalOffset, id, isLoading, label, labelStrings, loadingText, noResultsText, onFocus, onOptionSelect, placeholder, siteList, ...props }: DashboardSearchProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SiteSearch: ({ className, disabled, id, isLoading, label, labelStrings, loadingText, noResultsText, onFocus, onOptionSelect, placeholder, siteList, ...props }: SiteSearchProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/cards/ActionCard/ActionCard.d.ts

@@ -0,0 +1,64 @@
+import { ComponentPropsWithoutRef, ReactElement, ReactNode } from 'react';
+import { GridGapOptions } from '../../../libs/types/layout-types';
+import { CardBackground, CardImageVariant } from '../../cards/Card/Card';
+import './action-card.css';
+export interface ActionCardPrimaryAction {
+    /**
+     * Accessible label for the card-level action. Required — read by screen readers
+     * as the name of the interactive element that covers the card.
+     */
+    label: string;
+    /**
+     * For link-based actions: pass a native `<a>` or framework link element (e.g.
+     * React Router `<Link>`). The component clones the element and injects the
+     * required class and aria-label. Mutually exclusive with `onClick`.
+     */
+    linkContent?: ReactElement;
+    /**
+     * For button-based actions: callback fired when the card is activated.
+     * Mutually exclusive with `linkContent`.
+     */
+    onClick?: () => void;
+}
+/**
+ * Prop types for ActionCard
+ */
+export interface ActionCardProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Background color of the card.
+     */
+    background?: CardBackground;
+    /**
+     * Card content. Supports `image`, `main`, and `footer` named slots.
+     * Any interactive elements placed inside children (secondary actions) are
+     * naturally positioned above the card-level primary action.
+     */
+    children?: ReactNode;
+    /**
+     * Additional class names
+     */
+    className?: string;
+    /**
+     * Controls how the image slot is presented.
+     * - `bleed` (default): image extends to card edges, top corners rounded only.
+     * - `inset`: image has padding on all sides, all corners rounded.
+     */
+    imageVariant?: CardImageVariant;
+    /**
+     * Relative padding for the `main` and `footer` slots.
+     */
+    padding?: GridGapOptions;
+    /**
+     * The card-level primary action. Provide either `linkContent` (for links) or
+     * `onClick` (for button actions), plus a required accessible `label`.
+     */
+    primaryAction: ActionCardPrimaryAction;
+}
+/**
+ * ActionCard UI component
+ *
+ * A fully-clickable card where the entire surface activates a primary action.
+ * Supports both link and button actions. Secondary interactive elements can be
+ * placed inside children and remain independently clickable above the card action.
+ */
+export declare const ActionCard: ({ background, children, className, imageVariant, padding, primaryAction, ...props }: ActionCardProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/cards/Card/Card.d.ts

@@ -2,6 +2,7 @@ import { ComponentPropsWithoutRef, ReactNode } from 'react';
 import { GridGapOptions } from '../../../libs/types/layout-types';
 import './card.css';
 export type CardBackground = 'default' | 'transparent';
+export type CardImageVariant = 'bleed' | 'inset';
 /**
  * Prop types for Card
  */
@@ -18,6 +19,12 @@ export interface CardProps extends ComponentPropsWithoutRef<'div'> {
      * Additional class names
      */
     className?: string;
+    /**
+     * Controls how the image fills the card top.
+     * - `bleed` (default): image extends to the card edges, top corners rounded only.
+     * - `inset`: image has padding on all sides, all corners rounded.
+     */
+    imageVariant?: CardImageVariant;
     /**
      * Relative padding for the `main` slot.
      */
@@ -26,4 +33,4 @@ export interface CardProps extends ComponentPropsWithoutRef<'div'> {
 /**
  * Card UI component
  */
-export declare const Card: ({ background, children, className, padding, ...props }: CardProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Card: ({ background, children, className, imageVariant, padding, ...props }: CardProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/cards/{CardSelectGroup/CardSelectGroup.d.ts → CardSelect/CardSelect.d.ts}

@@ -1,10 +1,10 @@
 import { ComponentPropsWithoutRef, ReactNode } from 'react';
-import './card-select-group.css';
+import './card-select.css';
 export interface CardOption {
     /**
-     * Option description
+     * Composable content rendered inside the card below the label.
      */
-    description?: string | ReactNode;
+    children?: ReactNode;
     /**
      * Unique ID for the option
      * @default ''
@@ -19,7 +19,8 @@ export interface CardOption {
      */
     value: string;
 }
-export interface CardSelectGroupProps extends Omit<ComponentPropsWithoutRef<'fieldset'>, 'onChange'> {
+export type CardSelectSize = 'm' | 'l';
+export interface CardSelectProps extends Omit<ComponentPropsWithoutRef<'fieldset'>, 'onChange'> {
     /**
      * Additional class names
      */
@@ -29,11 +30,11 @@ export interface CardSelectGroupProps extends Omit<ComponentPropsWithoutRef<'fie
      */
     defaultValue?: string;
     /**
-     * Unique ID for the card select group
+     * Unique ID for the card select
      */
     id: string;
     /**
-     * Label for the card select group
+     * Label for the card select group. Renders as the fieldset legend.
      */
     label: string;
     /**
@@ -53,8 +54,12 @@ export interface CardSelectGroupProps extends Omit<ComponentPropsWithoutRef<'fie
      * Array of card options
      */
     options?: CardOption[];
+    /**
+     * Size of the card label and indicator. Defaults to `'m'`.
+     */
+    size?: CardSelectSize;
 }
 /**
- * CardSelectGroup UI component
+ * CardSelect UI component
  */
-export declare const CardSelectGroup: ({ className, defaultValue, id, label, labelDisplay, layout, onChange, options, ...props }: CardSelectGroupProps) => import("react/jsx-runtime").JSX.Element;
+export declare const CardSelect: ({ className, defaultValue, id, label, labelDisplay, layout, onChange, options, size, ...props }: CardSelectProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/charts/PieChart/PieChart.d.ts

@@ -0,0 +1,59 @@
+import { ComponentPropsWithoutRef } from 'react';
+import type { ColorPalette, LegendVariant } from '../shared/types';
+import '../shared/chart-wrapper.css';
+import './pie-chart.css';
+export type PieChartVariant = 'donut' | 'pie';
+export interface PieSlice {
+    /** Override default token color (CSS custom property or hex). Not theme-aware — use paletteIndex instead when possible. */
+    color?: string;
+    /** Display label for legend and tooltip */
+    label: string;
+    /** Pick a specific color from the selected palette by position (1-based). Theme-aware — automatically adjusts for light/dark mode. */
+    paletteIndex?: number;
+    /** Numeric value for this slice */
+    value: number;
+}
+export interface PieChartLabelStrings {
+    /** Accessible description for the hidden data table */
+    accessibleTableDescription?: string;
+    /** Heading for the empty state */
+    emptyStateHeading?: string;
+    /** Message body for the empty state */
+    emptyStateMessage?: string;
+    /** Loading label for screen readers */
+    loadingLabel?: string;
+}
+export interface PieChartProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children'> {
+    /** Height of the chart area in pixels. Default: 300; 80 when isThumbnail. */
+    chartHeight?: number;
+    /** Maximum width of the component in pixels. Default: 80 when isThumbnail. */
+    chartWidth?: number;
+    /** Color palette to use for slice colors (default: 'categorical') */
+    colorPalette?: ColorPalette;
+    /** Slice data */
+    data: PieSlice[];
+    /** Show loading skeleton */
+    isLoading?: boolean;
+    /** Thumbnail mode — hides legend and tooltip, renders at a small fixed size. Individual show* props can override. */
+    isThumbnail?: boolean;
+    /** Translatable UI strings for i18n. Keys: accessibleTableDescription, emptyStateHeading, emptyStateMessage, loadingLabel. */
+    labelStrings?: PieChartLabelStrings;
+    /** Legend display style (default: 'inline') */
+    legendVariant?: LegendVariant;
+    /** Show accessible data table (visually hidden). Defaults to true. */
+    showAccessibleTable?: boolean;
+    /** Show legend below the chart. Defaults to true; false when isThumbnail is set. */
+    showLegend?: boolean;
+    /** Show tooltip on hover. Defaults to true; false when isThumbnail is set. */
+    showTooltip?: boolean;
+    /** Custom value formatter for legend items. Receives the slice value, total, and label. Defaults to showing percentage. */
+    valueFormatter?: (value: number, total: number, label: string) => string;
+    /** Chart variant (default: 'pie') */
+    variant?: PieChartVariant;
+}
+/**
+ * PieChart UI component
+ *
+ * Renders a responsive pie or donut chart showing proportional data across categories.
+ */
+export declare const PieChart: ({ chartHeight, chartWidth, className, colorPalette, data, isLoading, isThumbnail, labelStrings, legendVariant, showAccessibleTable, showLegend, showTooltip, valueFormatter, variant, ...props }: PieChartProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/charts/ProportionBar/ProportionBar.d.ts

@@ -0,0 +1,57 @@
+import { ComponentPropsWithoutRef } from 'react';
+import type { ColorPalette } from '../shared/types';
+import '../shared/chart-wrapper.css';
+import './proportion-bar.css';
+export interface ProportionSegment {
+    /** Override default token color (CSS custom property or hex). Not theme-aware — use paletteIndex instead when possible. */
+    color?: string;
+    /** Display label for legend and tooltip */
+    label: string;
+    /** Pick a specific color from the selected palette by position (1-based). Theme-aware — automatically adjusts for light/dark mode. */
+    paletteIndex?: number;
+    /** Numeric value for this segment */
+    value: number;
+}
+export interface ProportionBarLabelStrings {
+    /** Accessible description for the hidden data table */
+    accessibleTableDescription?: string;
+    /** Heading for the empty state */
+    emptyStateHeading?: string;
+    /** Message body for the empty state */
+    emptyStateMessage?: string;
+    /** Loading label for screen readers */
+    loadingLabel?: string;
+}
+export interface ProportionBarProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children'> {
+    /** Height of the bar track in pixels (default: 16) */
+    barHeight?: number;
+    /** Maximum width of the component in pixels. The component is responsive and will shrink within this constraint. */
+    chartWidth?: number;
+    /** Color palette to use for segment colors (default: 'categorical') */
+    colorPalette?: ColorPalette;
+    /** Segment data — each segment has a label, numeric value, and optional color override */
+    data: ProportionSegment[];
+    /** Show loading skeleton */
+    isLoading?: boolean;
+    /** Thumbnail mode — hides legend and tooltip. Individual show* props can override. */
+    isThumbnail?: boolean;
+    /** Translatable UI strings for i18n. Keys: accessibleTableDescription, emptyStateHeading, emptyStateMessage, loadingLabel. */
+    labelStrings?: ProportionBarLabelStrings;
+    /** Alignment of the legend (default: 'left') */
+    legendAlignment?: 'center' | 'left';
+    /** Show accessible data table (visually hidden). Defaults to true. */
+    showAccessibleTable?: boolean;
+    /** Show legend below the bar. Defaults to true; false when isThumbnail is set. */
+    showLegend?: boolean;
+    /** Show tooltip on hover. Defaults to true; false when isThumbnail is set. */
+    showTooltip?: boolean;
+    /** Custom value formatter for legend items. Receives the segment value, total, and label. Defaults to showing percentage. */
+    valueFormatter?: (value: number, total: number, label: string) => string;
+}
+/**
+ * ProportionBar UI component
+ *
+ * Renders a single horizontal bar divided into colored segments, showing
+ * the composition of a total. Functions as a linearized pie chart.
+ */
+export declare const ProportionBar: ({ barHeight, chartWidth, className, colorPalette, data, isLoading, isThumbnail, labelStrings, legendAlignment, showAccessibleTable, showLegend, showTooltip, valueFormatter, ...props }: ProportionBarProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/charts/shared/ChartSkeleton.d.ts

@@ -1,7 +1,11 @@
 import type { LegendVariant } from './types';
 export interface ChartSkeletonProps {
+    /** Optional border radius for the skeleton bar area (e.g. 'var(--pds-border-radius-bar)'). When provided, a rectangular skeleton is clipped to this radius. */
+    borderRadius?: string;
     height: number;
+    /** Alignment of the inline legend skeleton (default: 'center') */
+    legendAlignment?: 'center' | 'left';
     legendVariant?: LegendVariant;
     showLegend?: boolean;
 }
-export declare const ChartSkeleton: ({ height, legendVariant, showLegend, }: ChartSkeletonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ChartSkeleton: ({ borderRadius, height, legendAlignment, legendVariant, showLegend, }: ChartSkeletonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/links/CTALink/CTALink.d.ts

@@ -12,7 +12,7 @@ export interface CTALinkProps extends ComponentPropsWithoutRef<'div'> {
     /**
      * Size of link
      */
-    size?: 's' | 'm';
+    size?: 'xs' | 's' | 'm';
 }
 /**
  * CTA Link UI component

package/dist/components/navigation/SideNav/SideNav.d.ts

@@ -13,6 +13,12 @@ export interface SideNavProps extends ComponentPropsWithoutRef<'nav'> {
      * Additional class names
      */
     className?: string;
+    /**
+     * When true, renders a dropdown menu in place of the standard navigation at mobile viewports.
+     * The mobile breakpoint is controlled by the `mobileBreakpoint` prop on `GlobalWrapper`.
+     * Defaults to `false` — the standard navigation is shown at all breakpoints.
+     */
+    hasMobileDropdown?: boolean;
     /**
      * Heading text. If a link is passed, it will be rendered as a link.
      */
@@ -36,4 +42,4 @@ export interface SideNavProps extends ComponentPropsWithoutRef<'nav'> {
 /**
  * SideNav UI component
  */
-export declare const SideNav: ({ ariaLabel, className, headingText, labels, menuItems, mobileMenuSelectTextFallback, ...props }: SideNavProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SideNav: ({ ariaLabel, className, hasMobileDropdown, headingText, labels, menuItems, mobileMenuSelectTextFallback, ...props }: SideNavProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/navigation/TreeNav/TreeNav.d.ts

@@ -0,0 +1,48 @@
+import { ComponentPropsWithoutRef, ReactElement } from 'react';
+import { NavigationItem } from '../../../libs/types/navigation-types';
+import './tree-nav.css';
+export type TreeNavItem = NavigationItem & {
+    /**
+     * A unique identifier for this item — typically its route or URL path (e.g. `/guides/overview`).
+     *
+     * Required on any item that has children (`links` array). The component uses this to
+     * re-find the item's DOM node after a re-render and restore its expanded/collapsed state.
+     * Without it, a user-opened nested submenu will collapse whenever the component re-renders.
+     *
+     * Leaf items (no `links`) do not need `path`.
+     */
+    path?: string;
+};
+/**
+ * Prop types for TreeNav
+ */
+export interface TreeNavProps extends ComponentPropsWithoutRef<'nav'> {
+    /**
+     * Aria label for the navigation.
+     */
+    ariaLabel: string;
+    /**
+     * Additional class names
+     */
+    className?: string;
+    /**
+     * Heading text. If a link is passed, it will be rendered as a link.
+     */
+    headingText?: string | ReactElement;
+    /**
+     * Labels for translatable strings.
+     */
+    labels?: {
+        submenu: string;
+        toggle: string;
+    };
+    /**
+     * Menu items to render.
+     */
+    menuItems: TreeNavItem[];
+}
+/**
+ * TreeNav UI component — a multi-level collapsible tree navigation for dense
+ * hierarchical content such as documentation sites.
+ */
+export declare const TreeNav: ({ ariaLabel, className, headingText, labels, menuItems, ...props }: TreeNavProps) => import("react/jsx-runtime").JSX.Element;

package/dist/css/component-css/pds-action-card.css

@@ -0,0 +1 @@
+.pds-action-card{background-color:var(--pds-color-card-background);border-radius:var(--pds-border-radius-card);box-shadow:var(--pds-elevation-raised);color:var(--pds-color-fg-default);cursor:pointer;display:flex;flex-direction:column;height:100%;position:relative}.pds-action-card:hover{box-shadow:var(--pds-elevation-overlay)}.pds-action-card__primary{background:transparent;border:none;border-radius:inherit;font:inherit;inset:0;padding:0;position:absolute;z-index:0}.pds-action-card__primary:focus-visible{outline:none}.pds-action-card__primary:focus-visible:after{border:var(--pds-border-width-outline) solid var(--pds-color-interactive-focus);border-radius:inherit;bottom:0;content:"";left:0;position:absolute;right:0;top:0;transition:var(--pds-animation-transition-button)}.pds-action-card__inner{display:flex;flex-direction:column;flex-grow:1;pointer-events:none;position:relative;z-index:1}.pds-action-card__inner [role=button],.pds-action-card__inner [tabindex],.pds-action-card__inner a,.pds-action-card__inner button,.pds-action-card__inner input,.pds-action-card__inner select,.pds-action-card__inner textarea{pointer-events:auto}.pds-action-card__image{border-radius:var(--pds-border-radius-card) var(--pds-border-radius-card) 0 0;display:block;overflow:hidden}.pds-action-card__image img{display:block;width:100%}.pds-action-card__main{flex-grow:1;padding:var(--pds-spacing-l) var(--pds-spacing-xl)}.pds-action-card__footer{padding:0 var(--pds-spacing-xl) var(--pds-spacing-l)}.pds-action-card--transparent{background-color:transparent}.pds-action-card--image-inset .pds-action-card__image{border-radius:var(--pds-border-radius-card);margin:var(--pds-spacing-m) var(--pds-spacing-m) 0;overflow:hidden;width:auto}.pds-action-card--pad-narrow .pds-action-card__main{padding:var(--pds-spacing-m)}.pds-action-card--pad-narrow .pds-action-card__footer{padding:0 var(--pds-spacing-m) var(--pds-spacing-m)}.pds-action-card--pad-wide .pds-action-card__main{padding:var(--pds-spacing-xl) var(--pds-spacing-2xl)}.pds-action-card--pad-wide .pds-action-card__footer{padding:0 var(--pds-spacing-2xl) var(--pds-spacing-xl)}

package/dist/css/component-css/pds-breadcrumb.css

@@ -1 +1 @@
-.pds-breadcrumb{color:var(--pds-color-fg-default-secondary);font-family:var(--pds-typography-ff-default);font-size:var(--pds-typography-size-s);font-weight:var(--pds-typography-fw-regular)}.pds-breadcrumb a{color:var(--pds-color-interactive-link-default);text-decoration:none;transition:var(--pds-animation-transition-link)}.pds-breadcrumb a:hover{color:var(--pds-color-interactive-link-hover);text-decoration:underline}.pds-breadcrumb a:active{color:var(--pds-color-interactive-link-active);outline:none}.pds-breadcrumb a:focus-visible{outline:var(--pds-border-width-outline) solid var(--pds-color-interactive-focus);outline-offset:.125rem;text-decoration:none;transition:var(--pds-animation-transition-focus)}.pds-breadcrumb__crumbs{display:flex;flex-wrap:wrap;list-style-type:none;margin:0;padding:0;row-gap:var(--pds-spacing-xs)}.pds-breadcrumb__crumb{align-items:center;display:flex}.pds-breadcrumb__crumb:not(:last-child):after{color:var(--pds-color-border-separator);content:"/";font-size:var(--pds-typography-size-xs);margin-inline:var(--pds-spacing-2xs)}.pds-breadcrumb__crumb--current a{color:var(--pds-color-fg-default-secondary)}
+.pds-breadcrumb{color:var(--pds-color-fg-default-secondary);font-family:var(--pds-typography-ff-default);font-size:var(--pds-typography-size-s);font-weight:var(--pds-typography-fw-regular)}.pds-breadcrumb a{color:var(--pds-color-interactive-link-default);text-decoration:none;transition:var(--pds-animation-transition-link)}.pds-breadcrumb a:hover{color:var(--pds-color-interactive-link-hover);text-decoration:underline}.pds-breadcrumb a:active{color:var(--pds-color-interactive-link-active);outline:none}.pds-breadcrumb a:focus-visible{outline:var(--pds-border-width-outline) solid var(--pds-color-interactive-focus);outline-offset:.125rem;text-decoration:none;transition:var(--pds-animation-transition-focus)}.pds-breadcrumb__crumbs{display:flex;flex-wrap:wrap;list-style-type:none;margin:0;padding:0;row-gap:var(--pds-spacing-xs)}.pds-breadcrumb__crumb{align-items:center;display:flex}.pds-breadcrumb__crumb:not(:last-child):after{color:var(--pds-color-border-separator);content:"/";font-size:var(--pds-typography-size-xs);margin-inline:var(--pds-spacing-2xs)}.pds-breadcrumb__crumb--current a{color:var(--pds-color-fg-default-secondary)}.pds-breadcrumb__crumb--current a:hover{color:var(--pds-color-interactive-ui-hover);text-decoration:underline}

package/dist/css/component-css/pds-card-select.css

@@ -0,0 +1 @@
+.pds-card-select{--label-font-size:var(--pds-typography-size-m);--indicator-size:1.25rem;border:none;color:var(--pds-color-fg-default);display:flex;flex-direction:column;font-family:var(--pds-typography-ff-default);margin-inline:0;padding:0}.pds-card-select--l{--label-font-size:var(--pds-typography-size-l);--indicator-size:1.375rem}.pds-card-select__legend{display:block;font-size:var(--pds-typography-size-m);font-weight:var(--pds-typography-fw-semibold);margin-block-end:0;text-align:left}.pds-card-select__legend--center{text-align:center}.pds-card-select__option input[type=radio]{appearance:none}.pds-card-select__option-label{align-items:center;background-color:var(--pds-color-card-background);border-radius:var(--pds-border-radius-card);box-shadow:var(--pds-elevation-raised);column-gap:var(--pds-spacing-xs);display:grid;font-size:var(--label-font-size);font-weight:var(--pds-typography-fw-semibold);grid-template-columns:var(--indicator-size) 1fr;height:100%;margin-block-end:0;padding:var(--pds-spacing-m);width:100%}.pds-card-select__option-label-indicator .pds-icon{height:var(--indicator-size);width:var(--indicator-size)}.pds-card-select__option-label:hover{box-shadow:var(--pds-elevation-overlay);cursor:pointer}.pds-card-select__option-icon{color:var(--pds-color-border-input)}.pds-card-select__option-icon--selected{color:var(--pds-color-status-success-foreground)}.pds-card-select__option-children{color:var(--pds-color-fg-default-secondary);font-size:var(--pds-typography-size-s);font-weight:var(--pds-typography-fw-regular);grid-column:2;line-height:var(--pds-typography-lh-m);margin-block-start:0}

package/dist/css/component-css/pds-card.css

@@ -1 +1 @@
-.pds-card{background-color:var(--pds-color-card-background);border-radius:var(--pds-border-radius-card);box-shadow:var(--pds-elevation-raised);color:var(--pds-color-fg-default);display:flex;flex-direction:column;min-height:8rem}.pds-card__image{border-radius:var(--pds-border-radius-card) var(--pds-border-radius-card) 0 0;display:block;overflow:hidden}.pds-card__image img{display:block;width:100%}.pds-card__main{flex-grow:1;padding:var(--pds-spacing-l) var(--pds-spacing-xl)}.pds-card--transparent{background-color:transparent}.pds-card--pad-narrow .pds-card__main{padding:var(--pds-spacing-m)}.pds-card--pad-wide .pds-card__main{padding:var(--pds-spacing-xl) var(--pds-spacing-2xl)}
+.pds-card{background-color:var(--pds-color-card-background);border-radius:var(--pds-border-radius-card);box-shadow:var(--pds-elevation-raised);color:var(--pds-color-fg-default);display:flex;flex-direction:column;height:100%;min-height:8rem}.pds-card__image{border-radius:var(--pds-border-radius-card) var(--pds-border-radius-card) 0 0;display:block;overflow:hidden}.pds-card__image img{display:block;width:100%}.pds-card__main{flex-grow:1;padding:var(--pds-spacing-l) var(--pds-spacing-xl)}.pds-card__footer{padding:0 var(--pds-spacing-xl) var(--pds-spacing-l)}.pds-card--transparent{background-color:transparent}.pds-card--image-inset .pds-card__image{border-radius:var(--pds-border-radius-card);margin:var(--pds-spacing-m) var(--pds-spacing-m) 0;overflow:hidden;width:auto}.pds-card--pad-narrow .pds-card__main{padding:var(--pds-spacing-m)}.pds-card--pad-narrow .pds-card__footer{padding:0 var(--pds-spacing-m) var(--pds-spacing-m)}.pds-card--pad-wide .pds-card__main{padding:var(--pds-spacing-xl) var(--pds-spacing-2xl)}.pds-card--pad-wide .pds-card__footer{padding:0 var(--pds-spacing-2xl) var(--pds-spacing-xl)}

package/dist/css/component-css/pds-chart-wrapper.css

@@ -1 +1 @@
-.pds-chart{font-family:var(--pds-typography-ff-default);position:relative;width:100%}.pds-chart__header{align-items:center;display:flex;justify-content:flex-end;margin-block-end:var(--pds-spacing-m)}.pds-chart--loading{display:block}.pds-chart__skeleton{display:flex;flex-direction:column;gap:var(--pds-spacing-m);height:100%;width:100%}.pds-chart__skeleton-area{flex-shrink:0}.pds-chart__skeleton-legend{align-items:center;display:flex;gap:var(--pds-spacing-s)}.pds-chart__skeleton-legend--inline{justify-content:center}.pds-chart__skeleton-legend--table{width:100%}.pds-chart--empty{align-items:center;display:flex;justify-content:center}.recharts-default-tooltip{background-color:var(--pds-color-bg-default)!important;border:var(--pds-border-width-default) solid var(--pds-color-border-default)!important;border-radius:var(--pds-border-radius-container)!important;box-shadow:var(--pds-elevation-overlay)!important;font-family:var(--pds-typography-ff-default)!important;font-size:var(--pds-typography-size-xs)!important;padding:var(--pds-spacing-4xs) var(--pds-spacing-xs)!important}.recharts-tooltip-label{color:var(--pds-color-fg-default)!important;font-weight:var(--pds-typography-fw-semibold)!important;margin:0!important}.recharts-tooltip-item-list li{padding-block:0!important}.recharts-tooltip-item-list{padding:0!important}.recharts-tooltip-item{align-items:center;color:var(--pds-color-fg-default)!important;display:flex;font-size:var(--pds-typography-size-xs)!important;gap:var(--pds-spacing-3xs);margin:0!important;padding:var(--pds-spacing-6xs) 0!important}.recharts-tooltip-item__color{border-radius:2px;display:inline-block;flex-shrink:0;height:8px;width:8px}.pds-bar-chart [aria-hidden=true]:focus,.pds-line-chart [aria-hidden=true]:focus,.recharts-surface:focus,.recharts-wrapper :focus,.recharts-wrapper:focus{outline:none}
+.pds-chart{font-family:var(--pds-typography-ff-default);position:relative;width:100%}.pds-chart__header{align-items:center;display:flex;justify-content:flex-end;margin-block-end:var(--pds-spacing-m)}.pds-chart--loading{display:block}.pds-chart__skeleton{display:flex;flex-direction:column;gap:var(--pds-spacing-m);height:100%;width:100%}.pds-chart__skeleton-area{flex-shrink:0}.pds-chart__skeleton-legend{align-items:center;display:flex;gap:var(--pds-spacing-s)}.pds-chart__skeleton-legend--inline{justify-content:center}.pds-chart__skeleton-legend--inline-left{justify-content:flex-start}.pds-chart__skeleton-legend--table{width:100%}.pds-chart--empty{align-items:center;display:flex;justify-content:center}.recharts-default-tooltip{background-color:var(--pds-color-bg-default)!important;border:var(--pds-border-width-default) solid var(--pds-color-border-default)!important;border-radius:var(--pds-border-radius-container)!important;box-shadow:var(--pds-elevation-overlay)!important;font-family:var(--pds-typography-ff-default)!important;font-size:var(--pds-typography-size-xs)!important;padding:var(--pds-spacing-4xs) var(--pds-spacing-xs)!important}.recharts-tooltip-label{color:var(--pds-color-fg-default)!important;font-weight:var(--pds-typography-fw-semibold)!important;margin:0!important}.recharts-tooltip-item-list li{padding-block:0!important}.recharts-tooltip-item-list{padding:0!important}.recharts-tooltip-item{align-items:center;color:var(--pds-color-fg-default)!important;display:flex;font-size:var(--pds-typography-size-xs)!important;gap:var(--pds-spacing-3xs);margin:0!important;padding:var(--pds-spacing-6xs) 0!important}.recharts-tooltip-item__color{border-radius:2px;display:inline-block;flex-shrink:0;height:8px;width:8px}.pds-bar-chart [aria-hidden=true]:focus,.pds-line-chart [aria-hidden=true]:focus,.recharts-surface:focus,.recharts-wrapper :focus,.recharts-wrapper:focus{outline:none}

package/dist/css/component-css/pds-cta-link.css

@@ -1 +1 @@
-.pds-cta-link{--cta-link-size:var(--pds-typography-size-m);--cta-link-color:var(--pds-color-interactive-link-default);--cta-link-gap:var(--pds-spacing-3xs);align-items:center;display:inline-flex;gap:var(--cta-link-gap);padding:.25rem 0}.pds-cta-link a,.pds-cta-link button{color:var(--cta-link-color);font-family:var(--pds-typography-ff-default);font-size:var(--cta-link-size);font-weight:var(--pds-typography-fw-bold);letter-spacing:var(--pds-typography-ls-s);line-height:var(--pds-typography-lh-s);text-decoration:none;transition:var(--pds-animation-transition-link)}.pds-cta-link a:focus-visible,.pds-cta-link button:focus-visible{border-radius:var(--pds-border-radius-default);outline:var(--pds-border-width-outline) solid var(--pds-color-interactive-focus);outline-offset:.25rem;text-decoration:none}.pds-cta-link button{background:none;border:none;cursor:pointer;padding:0}.pds-cta-link .pds-cta-link__icon{color:var(--cta-link-color);transition:var(--pds-animation-transition-link)}.pds-cta-link:hover{--cta-link-color:var(--pds-color-interactive-link-hover)}.pds-cta-link:active{--cta-link-color:var(--pds-color-interactive-link-active);outline:none;text-decoration:none}.pds-cta-link--m{--cta-link-gap:var(--pds-spacing-2xs);--cta-link-size:var(--pds-typography-size-l)}.pds-link-group{display:flex;flex-direction:column;row-gap:var(--pds-spacing-m)}
+.pds-cta-link{--cta-link-size:var(--pds-typography-size-m);--cta-link-color:var(--pds-color-interactive-link-default);--cta-link-gap:var(--pds-spacing-3xs);align-items:center;display:inline-flex;gap:var(--cta-link-gap);padding:.25rem 0}.pds-cta-link a,.pds-cta-link button{color:var(--cta-link-color);font-family:var(--pds-typography-ff-default);font-size:var(--cta-link-size);font-weight:var(--pds-typography-fw-bold);letter-spacing:var(--pds-typography-ls-s);line-height:var(--pds-typography-lh-s);text-decoration:none;transition:var(--pds-animation-transition-link)}.pds-cta-link a:focus-visible,.pds-cta-link button:focus-visible{border-radius:var(--pds-border-radius-default);outline:var(--pds-border-width-outline) solid var(--pds-color-interactive-focus);outline-offset:.25rem;text-decoration:none}.pds-cta-link button{background:none;border:none;cursor:pointer;padding:0}.pds-cta-link .pds-cta-link__icon{color:var(--cta-link-color);transition:var(--pds-animation-transition-link)}.pds-cta-link:hover{--cta-link-color:var(--pds-color-interactive-link-hover)}.pds-cta-link:active{--cta-link-color:var(--pds-color-interactive-link-active);outline:none;text-decoration:none}.pds-cta-link--xs{--cta-link-gap:var(--pds-spacing-3xs);--cta-link-size:var(--pds-typography-size-s)}.pds-cta-link--m{--cta-link-gap:var(--pds-spacing-2xs);--cta-link-size:var(--pds-typography-size-l)}.pds-link-group{display:flex;flex-direction:column;row-gap:var(--pds-spacing-m)}

package/dist/css/component-css/pds-dropdown-menu.css

@@ -1,2 +1,2 @@
-.pds-dropdown-menu{position:relative}.pds-dropdown-menu__heading{font-weight:var(--pds-typography-fw-semibold);margin-block-end:var(--pds-spacing-s)}.pds-dropdown-menu__heading a{color:var(--pds-color-fg-default);text-decoration:none}.pds-dropdown-menu__heading a:hover{color:var(--pds-color-interactive-ui-hover)}.pds-dropdown-menu__trigger{align-items:center;background-color:var(--pds-color-bg-default);border:var(--pds-border-width-default) solid var(--pds-color-border-input);border-radius:var(--pds-border-radius-input);color:var(--pds-color-fg-default);cursor:pointer;display:flex;height:var(--pds-spacing-input-height-m);justify-content:space-between;padding:0 var(--pds-spacing-s);text-align:left;width:100%}.pds-dropdown-menu__trigger:focus-visible{outline:var(--pds-border-width-outline) solid var(--pds-color-interactive-focus)}.pds-dropdown-menu__trigger-icon{color:var(--pds-color-fg-default-secondary);transition:var(--pds-animation-transition-rotation)}.pds-dropdown-menu__trigger[aria-expanded=true]
+.pds-dropdown-menu{position:relative}.pds-dropdown-menu__heading{font-size:var(--pds-typography-size-m);font-weight:var(--pds-typography-fw-semibold);margin-block-end:var(--pds-spacing-s)}.pds-dropdown-menu__heading a{color:var(--pds-color-fg-default);text-decoration:none}.pds-dropdown-menu__heading a:hover{color:var(--pds-color-interactive-ui-hover)}.pds-dropdown-menu__trigger{align-items:center;background-color:var(--pds-color-bg-default);border:var(--pds-border-width-default) solid var(--pds-color-border-input);border-radius:var(--pds-border-radius-input);color:var(--pds-color-fg-default);cursor:pointer;display:flex;height:var(--pds-spacing-input-height-m);justify-content:space-between;padding:0 var(--pds-spacing-s);text-align:left;width:100%}.pds-dropdown-menu__trigger:focus-visible{outline:var(--pds-border-width-outline) solid var(--pds-color-interactive-focus)}.pds-dropdown-menu__trigger-icon{color:var(--pds-color-fg-default-secondary);transition:var(--pds-animation-transition-rotation)}.pds-dropdown-menu__trigger[aria-expanded=true]
 	.pds-dropdown-menu__trigger-icon{transform:rotate(180deg);transition:var(--pds-animation-transition-rotation)}.pds-dropdown-menu__dropdown{margin-block-start:var(--pds-spacing-xs);max-height:30rem;overflow-y:auto;width:100%}.pds-dropdown-menu__dropdown .pds-dropdown__item>a{color:inherit;flex:1;text-decoration:none}.pds-dropdown-menu__item--second-level>a{padding-inline-start:var(--pds-spacing-2xl)}.pds-dropdown-menu__item--third-level>a{padding-inline-start:calc(var(--pds-spacing-2xl) + var(--pds-spacing-xl))}.pds-dropdown-menu__item--fourth-level>a{padding-inline-start:calc(var(--pds-spacing-2xl) + var(--pds-spacing-xl) + var(--pds-spacing-xl))}.pds-dropdown-menu__active-label{display:flex}.pds-dropdown-menu__active-icon{margin-inline:var(--pds-spacing-m)}.pds-dropdown-menu__separator{background-color:var(--pds-color-border-default);block-size:1px;margin-block:token("spacing.XS" to rem);pointer-events:none}