@godxjp/ui 20.0.0 → 20.1.0

package/dist/props/vocabulary/data.prop.d.ts

@@ -3,7 +3,7 @@
  * @see docs/PROPS-VOCABULARY.md#data-collections
  */
 import type * as React from "react";
-import type { ColumnAlignProp, SortDirectionProp } from "./interaction.prop.js";
+import type { BreakpointProp, ColumnAlignProp, SortDirectionProp } from "./interaction.prop.js";
 import type { TableDensityProp } from "./layout.prop.js";
 /** Generic row identifier extractor for tables with selection. */
 export type GetRowIdProp<T> = (row: T) => string;
@@ -54,6 +54,45 @@ export type ColumnDefProp<T> = {
      * — it takes the remaining space.
      */
     priority?: TableColumnPriorityProp;
+    /**
+     * Freeze the column against a scroll edge (antd `ColumnType.fixed`). The offsets are MEASURED
+     * from the rendered header cells and published as `--table-fixed-offset`, so several adjacent
+     * fixed columns stack correctly at any width, in either writing direction. `pin: "end"` is the
+     * older spelling of `fixed: "end"` and still works.
+     */
+    fixed?: ColumnFixedProp;
+    /**
+     * Hold the cell to ONE line and truncate the overflow (antd `ColumnType.ellipsis`). The full text
+     * is kept reachable as the cell's `title`, so nothing is silently lost.
+     */
+    ellipsis?: boolean;
+    /**
+     * Sort declaration (antd `ColumnType.sorter`). `sorter: true` is the same opt-in as `sortable`;
+     * a comparator sorts by it; `{ compare, multiple }` joins the MULTI-column sort, highest
+     * `multiple` first.
+     */
+    sorter?: ColumnSorterProp<T>;
+    /** Controlled sort direction for THIS column (antd `sortOrder`). `null` = not sorted. */
+    sortOrder?: SortDirectionProp | null;
+    /** Initial uncontrolled sort direction (antd `defaultSortOrder`). */
+    defaultSortOrder?: SortDirectionProp;
+    /**
+     * The directions this column cycles through (antd `sortDirections`), in order; the cycle ends by
+     * clearing the sort. Default `["asc", "desc"]`.
+     */
+    sortDirections?: SortDirectionProp[];
+    /** Explain the next sort step in a tooltip on the header (antd `showSorterTooltip`). */
+    showSorterTooltip?: boolean;
+    /** Filter menu options (antd `filters`). Presence of this array is what adds the filter icon. */
+    filters?: ColumnFilterItemProp[];
+    /** Controlled filter selection (antd `filteredValue`). `null` = no filter. */
+    filteredValue?: ColumnFilterStateProp | null;
+    /** Initial uncontrolled filter selection (antd `defaultFilteredValue`). */
+    defaultFilteredValue?: ColumnFilterStateProp;
+    /** `false` makes the menu single-select (antd `filterMultiple`). Default `true`. */
+    filterMultiple?: boolean;
+    /** Row predicate for one selected filter value (antd `onFilter`). Omit for server filtering. */
+    onFilter?: (value: ColumnFilterValueProp, row: T) => boolean;
 };
 /** Set of selected row IDs. */
 export type SelectedIdsProp = Set<string>;
@@ -93,3 +132,142 @@ export type TableColumnPriorityProp = "primary" | "secondary" | "meta" | "action
  * expresses its level instead of hand-rolling `style={{ paddingInlineStart }}` at the call site.
  */
 export type TableCellIndentProp = number;
+/**
+ * Sticky edge a column freezes against while the rest of the table scrolls horizontally. Logical,
+ * not physical: `"start"` is the inline-start edge (visual left in LTR, right in RTL). antd's
+ * `fixed` accepts the physical `left`/`right`; those cannot be mirrored for an RTL locale, which is
+ * why only the logical pair is published here.
+ */
+export type ColumnFixedProp = "start" | "end";
+/** A value a column filter can carry — the closed set a `<Checkbox>`/`<Radio>` option can hold. */
+export type ColumnFilterValueProp = string | number | boolean;
+/** One option in a column's filter menu (antd `ColumnFilterItem`). */
+export type ColumnFilterItemProp = {
+    text: React.ReactNode;
+    value: ColumnFilterValueProp;
+};
+/** The active filter selection for one column (antd `FilterValue`). */
+export type ColumnFilterStateProp = ColumnFilterValueProp[];
+/**
+ * Column-filter change handler — this library's split of the `filters` argument antd hands to the
+ * table-level `onChange`. Keyed by column, so a controlled `filteredValue` has somewhere to be
+ * driven from.
+ */
+export type OnColumnFilterChangeProp = (filters: Record<string, ColumnFilterStateProp>) => void;
+/** Column comparator — the `compare` half of antd's `sorter`. */
+export type ColumnCompareProp<T> = (a: T, b: T) => number;
+/**
+ * Column sort declaration (antd `ColumnType.sorter`). `true` sorts on the column's own value;
+ * a function is the comparator; the object form adds `multiple`, the MULTI-COLUMN sort priority —
+ * a higher number sorts first, exactly as in antd.
+ */
+export type ColumnSorterProp<T> = boolean | ColumnCompareProp<T> | {
+    compare?: ColumnCompareProp<T>;
+    multiple?: number;
+};
+/** One entry in the selection-column dropdown (antd `SelectionItem`). */
+export type TableSelectionItemProp = {
+    key: string;
+    text: React.ReactNode;
+    onSelect: (currentRowKeys: string[]) => void;
+};
+/**
+ * Row-selection configuration (antd `TableRowSelection`). The object form is the full surface;
+ * the older `selectable` / `selected` / `onSelectChange` triple stays and drives the same state.
+ */
+export type TableRowSelectionProp<T> = {
+    /** `"checkbox"` (default, multi) or `"radio"` (single). */
+    type?: "checkbox" | "radio";
+    selectedRowKeys?: string[];
+    defaultSelectedRowKeys?: string[];
+    onChange?: (selectedRowKeys: string[], selectedRows: T[]) => void;
+    /** Per-row checkbox overrides — the standard home for "this row cannot be selected". */
+    getCheckboxProps?: (row: T) => {
+        disabled?: boolean;
+        "aria-label"?: string;
+    };
+    /** Keep keys selected even once their row leaves `data` (server paging / filtering). */
+    preserveSelectedRowKeys?: boolean;
+    /** Extra bulk-select entries under the header checkbox. `true` = the built-in all/none/invert. */
+    selections?: TableSelectionItemProp[] | boolean;
+    hideSelectAll?: boolean;
+    columnTitle?: React.ReactNode;
+};
+/** Expandable-row configuration (antd/rc-table `ExpandableConfig`). */
+export type TableExpandableProp<T> = {
+    /** Renders the detail panel for an expanded row. Omit and nothing is expandable. */
+    expandedRowRender?: (row: T, index: number, expanded: boolean) => React.ReactNode;
+    /** Rows this returns `false` for get no expand affordance. Default: every row is expandable. */
+    rowExpandable?: (row: T) => boolean;
+    defaultExpandAllRows?: boolean;
+    expandedRowKeys?: string[];
+    onExpandedRowsChange?: (expandedRowKeys: string[]) => void;
+    /** Clicking anywhere on the row toggles it (antd `expandRowByClick`). */
+    expandRowByClick?: boolean;
+    columnTitle?: React.ReactNode;
+};
+/** Footer totals row — receives the rows currently rendered (antd/rc-table `summary`). */
+export type TableSummaryProp<T> = (rows: readonly T[]) => React.ReactNode;
+/**
+ * Scroll envelope (antd `scroll`). `x` is the table's minimum inline size (it scrolls horizontally
+ * past it), `y` the body's maximum block size (it scrolls vertically past it). Both are published
+ * as the `--table-scroll-x` / `--table-scroll-y` custom properties, so the LENGTHS stay data while
+ * the geometry that reads them stays in the stylesheet.
+ */
+export type TableScrollProp = {
+    x?: number | string;
+    y?: number | string;
+};
+/**
+ * Sticky header (antd `sticky`). `true` pins the header to its scroll container; the object form
+ * adds the offset a page-level fixed topbar needs, published as `--table-sticky-offset`.
+ */
+export type TableStickyProp = boolean | {
+    offsetHeader?: number | string;
+};
+/**
+ * Per-row DOM props (antd `onRow`) — event handlers and attributes merged onto the `<tr>`.
+ * The `data-*` index signature is deliberate: the commonest reason to reach for `onRow` at all is
+ * to stamp a row key or an E2E hook onto the element, and `React.HTMLAttributes` alone rejects it.
+ */
+export type OnRowProp<T> = (row: T, index: number) => (React.HTMLAttributes<HTMLTableRowElement> & {
+    [dataAttribute: `data-${string}`]: string | number | boolean | undefined;
+}) | undefined;
+/**
+ * Pagination object surface (antd `TablePaginationConfig`). 1-BASED `current`, like antd — the
+ * TanStack-shaped `{ pageIndex, pageSize }` form the prop already accepted is still accepted and
+ * is told apart by its `pageIndex` field. `false` hides the pager entirely.
+ */
+export type TablePaginationProp = {
+    /** 1-based current page. */
+    current?: number;
+    pageSize?: number;
+    /** Total row count on the server — drives the page count under manual pagination. */
+    total?: number;
+    pageSizeOptions?: number[];
+    /** Default `true`. `false` drops the rows-per-page select. */
+    showSizeChanger?: boolean;
+    onChange?: (page: number, pageSize: number) => void;
+};
+/**
+ * Descriptions column count (antd `column`). A plain number keeps this library's own mobile-first
+ * ladder; the `{ sm, md, lg, xl }` object is antd's responsive form, expressed against this
+ * library's own `BreakpointProp` set.
+ */
+export type DescriptionsColumnProp = number | Partial<Record<BreakpointProp, number>>;
+/**
+ * How many columns one Descriptions item occupies (antd `span`). `"filled"` takes the whole
+ * remaining row; the object form spans a different number of columns per breakpoint.
+ */
+export type DescriptionsSpanProp = number | "filled" | Partial<Record<BreakpointProp, number>>;
+/** Declarative Descriptions items (antd `items`) — the alternative to composing children. */
+export type DescriptionsItemsProp = {
+    key?: React.Key;
+    label: React.ReactNode;
+    /** The value. `children` is antd's name for it; `value` is this library's older one. */
+    children?: React.ReactNode;
+    value?: React.ReactNode;
+    mono?: boolean;
+    span?: DescriptionsSpanProp;
+    className?: string;
+}[];

package/dist/props/vocabulary/index.d.ts

@@ -1,7 +1,7 @@
 /** Barrel — all vocabulary prop types. */
-export type { ClassNameProp, ChildrenProp, IdProp, OpenProp, DefaultOpenProp, OnOpenChangeProp, HandlerProp, PendingProp, RequiredProp, DisabledProp, LabelProp, HelperProp, ErrorProp, ErrorBagProp, PlaceholderProp, NameProp, ValueProp, DefaultValueProp, OnValueChangeProp, OnChangeProp, OnClickProp, AsChildProp, FlushProp, WidthProp, ControlWidthProp, } from "./shared.prop.js";
+export type { ClassNameProp, ChildrenProp, IdProp, OpenProp, DefaultOpenProp, OnOpenChangeProp, HandlerProp, PendingProp, RequiredProp, DisabledProp, LabelProp, HelperProp, ErrorProp, ErrorBagProp, PlaceholderProp, NameProp, ValueProp, DefaultValueProp, OnValueChangeProp, OnChangeProp, OnClickProp, AsChildProp, FlushProp, WidthProp, ControlWidthProp, AllowClearProp, MaxTagCountProp, MaxTagPlaceholderProp, NotFoundContentProp, PopupMatchWidthProp, } from "./shared.prop.js";
 export type { TitleProp, SubtitleProp, StatusProp, DescriptionProp, ExtraProp, FooterProp, ActionProp, IconProp, ConfirmLabelProp, CancelLabelProp, ActionsProp, EmptyMessageProp, } from "./content.prop.js";
 export type { PageDensityProp, PageContainerVariantProp, CenteredShellWidthProp, CenteredShellAlignProp, CenteredShellPresetProp, ErrorSurfaceModeProp, ErrorSurfaceStatusProp, AuthShellPresetProp, MobileShellHeightProp, OrientationProp, TableDensityProp, DensityProp, GapNameProp, PadProp, PadRawProp, PadSides, GapProp, GapStepProp, } from "./layout.prop.js";
-export type { ButtonVariantProp, ButtonSizeProp, BadgeVariantProp, AppSettingPickerAppearanceProp, AppSettingToggleAppearanceProp, ShapeProp, AvatarShapeProp, TextSizeProp, TextToneProp, FontWeightProp, HeadingLevelProp, TextAlignProp, SizeProp, FormLayoutProp, DescriptionsLayoutProp, BreakpointProp, ConfirmVariantProp, ToneProp, AlertVariantProp, SortDirectionProp, ColumnAlignProp, SortStateProp, RevealDelayProp, ActivityVariantProp, ActivityAnnounceProp, } from "./interaction.prop.js";
-export type { BreadcrumbItemProp, BreadcrumbProp } from "./navigation.prop.js";
-export type { GetRowIdProp, OnRowClickProp, ColumnDefProp, TablePresetProp, TableColumnPriorityProp, TableCellIndentProp, SelectedIdsProp, OnSelectChangeProp, OnTableDensityChangeProp, OnSortChangeProp, OnSearchChangeProp, OnClearFiltersProp, HasActiveFiltersProp, StickyProp, } from "./data.prop.js";
+export type { ButtonVariantProp, ButtonSizeProp, BadgeVariantProp, AppSettingPickerAppearanceProp, AppSettingToggleAppearanceProp, ShapeProp, AvatarShapeProp, TextSizeProp, TextToneProp, FontWeightProp, HeadingLevelProp, TextAlignProp, TextWhitespaceProp, SizeProp, ControlStatusProp, ControlVariantProp, FormLayoutProp, DescriptionsLayoutProp, BreakpointProp, ConfirmVariantProp, ToneProp, AlertVariantProp, SortDirectionProp, ColumnAlignProp, SortStateProp, RevealDelayProp, ActivityVariantProp, ActivityAnnounceProp, } from "./interaction.prop.js";
+export type { BreadcrumbItemProp, BreadcrumbProp, BreadcrumbItemMenuProp, BreadcrumbItemMenuEntryProp, BreadcrumbSeparatorProp, BreadcrumbItemRenderProp, } from "./navigation.prop.js";
+export type { GetRowIdProp, OnRowClickProp, ColumnDefProp, TablePresetProp, TableColumnPriorityProp, TableCellIndentProp, SelectedIdsProp, OnSelectChangeProp, OnTableDensityChangeProp, OnSortChangeProp, OnSearchChangeProp, OnClearFiltersProp, HasActiveFiltersProp, StickyProp, ColumnFixedProp, ColumnFilterValueProp, ColumnFilterItemProp, ColumnFilterStateProp, OnColumnFilterChangeProp, ColumnCompareProp, ColumnSorterProp, TableSelectionItemProp, TableRowSelectionProp, TableExpandableProp, TableSummaryProp, TableScrollProp, TableStickyProp, OnRowProp, TablePaginationProp, DescriptionsColumnProp, DescriptionsSpanProp, DescriptionsItemsProp, } from "./data.prop.js";

package/dist/props/vocabulary/interaction.prop.d.ts

@@ -2,8 +2,18 @@
  * Interaction & visual variant prop types.
  * @see docs/PROPS-VOCABULARY.md#interaction-variants
  */
-/** Button visual style. */
-export type ButtonVariantProp = "default" | "destructive" | "outline" | "dashed" | "secondary" | "ghost" | "link";
+/**
+ * Button visual style.
+ *
+ * `bare` (gh#404) is the control WITHOUT geometry: a real button — hitbox, focus ring, keyboard
+ * semantics, `aria-label` — around content that already IS the shape (a `Badge`, a truncating
+ * title). Every other variant loads a height and an inline inset from its `size`, so wrapping a
+ * chip meant writing `className="h-auto p-0"`, an audit error with no legal replacement; `link`
+ * was not it either, since it still loads a size class and adds primary colour plus a hover
+ * underline. The 24×24 target WCAG 2.2 SC 2.5.8 requires is kept by a pseudo-element, so the box
+ * stays exactly as big as its content.
+ */
+export type ButtonVariantProp = "default" | "destructive" | "outline" | "dashed" | "secondary" | "ghost" | "link" | "bare";
 /**
  * Corner shape — maps to the radius tokens (default = control/component radius). Shared by Button
  * + Badge.
@@ -29,6 +39,18 @@ export type FontWeightProp = "regular" | "medium" | "semibold" | "bold";
 export type HeadingLevelProp = 1 | 2 | 3 | 4;
 /** Inline text alignment (logical, RTL-safe). */
 export type TextAlignProp = "start" | "center" | "end";
+/**
+ * How a run of text treats the whitespace it was given.
+ *
+ * `normal` is CSS's own behaviour and the default: newlines and runs of spaces collapse. That is
+ * right for a label and wrong for text a PERSON typed into a textarea — a plain-text note, a
+ * pasted log, an issue description — where the line breaks and the indentation ARE content.
+ *
+ * `pre-wrap` keeps both and still wraps at the container's edge, so the block cannot force a
+ * horizontal scrollbar the way `pre` would. It is a closed union rather than a boolean because the
+ * remaining CSS keywords (`pre`, `pre-line`, `nowrap`) are values on the same axis, not more flags.
+ */
+export type TextWhitespaceProp = "normal" | "pre-wrap";
 /** Badge visual style. */
 export type BadgeVariantProp = "default" | "secondary" | "outline" | "dashed";
 /**
@@ -61,6 +83,33 @@ export type AppSettingToggleAppearanceProp = "bar" | "icon";
 export type SizeProp = "xs" | "sm" | "md" | "lg";
 /** Button size preset; icon-only sizes are a documented Button subset. */
 export type ButtonSizeProp = SizeProp | "default" | "icon" | "icon-xs" | "icon-sm" | "icon-lg";
+/**
+ * Validation state a data-entry control PAINTS — Ant Design's `status` axis, which
+ * docs/DESIGN-AUTHORITY.md names the taxonomy authority for this library.
+ *
+ * Two members, not antd's five. `error` and `warning` are the two antd paints from the prop alone;
+ * `success` and `validating` are only ever drawn together with antd's `hasFeedback` icon slot,
+ * which this library does not have (FormField owns the message and the icon), and `""` is antd's
+ * way of spelling "no status" in a required field — `undefined` already says that here.
+ *
+ * `error` and `aria-invalid` are the same state seen from two sides: a control given
+ * `status="error"` also reports `aria-invalid`, so the paint and the announcement can never drift.
+ * `warning` deliberately does NOT set `aria-invalid` — a warning is not a validity failure, and
+ * antd does not announce one either.
+ */
+export type ControlStatusProp = "error" | "warning";
+/**
+ * How much chrome a data-entry control draws — Ant Design's `variant` axis.
+ * - `outlined` (default) — the historical field: boundary, surface and resting shadow.
+ * - `filled` — no boundary at rest, a tinted surface instead; the dense-form treatment.
+ * - `borderless` — neither boundary nor surface, for a field embedded in a box that already draws
+ *   one (a composer inside a Card, an inline edit cell).
+ *
+ * antd's fourth member `underlined` is deliberately absent — see docs/DESIGN-AUTHORITY.md: a
+ * single bottom rule is a Material convention, and SmartHR (the Japanese-UI authority here) draws
+ * every form field as a full box.
+ */
+export type ControlVariantProp = "outlined" | "filled" | "borderless";
 /** Form layout — label position relative to its control (Ant-style). */
 export type FormLayoutProp = "vertical" | "horizontal" | "inline";
 /** Descriptions layout — label over value (`vertical`) or beside it (`horizontal`); the

package/dist/props/vocabulary/navigation.prop.d.ts

@@ -2,12 +2,52 @@
  * Navigation & wayfinding prop types.
  * @see docs/PROPS-VOCABULARY.md#navigation
  */
+import type * as React from "react";
 import type { LabelProp } from "./shared.prop.js";
+/**
+ * One entry of the dropdown a breadcrumb segment can open (Ant Design
+ * `BreadcrumbItemType.menu.items`). `to` makes the entry a link, `onSelect` on the menu makes it
+ * a command; an entry with neither is inert.
+ */
+export type BreadcrumbItemMenuEntryProp = {
+    /** Stable identity, passed to `onSelect`. Also the React key. */
+    value: string;
+    label: LabelProp;
+    to?: string;
+    disabled?: boolean;
+};
+/**
+ * Sibling picker hung off a breadcrumb segment (Ant Design `BreadcrumbItemType.menu`) — the
+ * "switch to another project at this level" affordance. The segment grows a disclosure chevron and
+ * becomes the menu trigger.
+ */
+export type BreadcrumbItemMenuProp = {
+    items: BreadcrumbItemMenuEntryProp[];
+    /** Fires with the chosen entry's `value`. Omit when every entry is a plain `to` link. */
+    onSelect?: (value: string) => void;
+};
 /** Single breadcrumb segment. */
 export type BreadcrumbItemProp = {
     label: LabelProp;
     /** Router path — omit on current (last) segment. */
     to?: string;
+    /** Ant Design `menu` — a sibling dropdown on this segment. @see BreadcrumbItemMenuProp */
+    menu?: BreadcrumbItemMenuProp;
 };
 /** Ordered breadcrumb trail above page title. */
 export type BreadcrumbProp = BreadcrumbItemProp[];
+/**
+ * Ant Design `separator` — what is drawn between two segments. Default is the chevron glyph; a
+ * string (`"/"`) or any node replaces it, and `""` removes the separator entirely.
+ */
+export type BreadcrumbSeparatorProp = React.ReactNode;
+/**
+ * Ant Design `itemRender` — replaces the anchor/text of ONE segment while the library keeps
+ * owning the `<nav>`/`<ol>`/`<li>` structure, the separators and `aria-current`. Use it to hand
+ * the trail a router `<Link>` (Inertia, react-router) instead of a bare `<a>`.
+ */
+export type BreadcrumbItemRenderProp = (item: BreadcrumbItemProp, info: {
+    index: number;
+    isLast: boolean;
+    items: BreadcrumbProp;
+}) => React.ReactNode;

package/dist/props/vocabulary/shared.prop.d.ts

@@ -73,3 +73,36 @@ export type WidthProp = number | string;
  * site (gh#375).
  */
 export type ControlWidthProp = "full" | "auto" | "bounded";
+/**
+ * antd `allowClear`: `true`/`false`, or the object form carrying a replacement icon and the
+ * accessible label for the clear control (antd 6.6.2, `BaseSelectProps.allowClear`).
+ */
+export type AllowClearProp = boolean | {
+    clearIcon?: React.ReactNode;
+    label?: string;
+};
+/**
+ * antd `maxTagCount` — how many selected values stay visible before the rest collapse into the
+ * overflow node. `"responsive"` is NOT supported here (see the PR that introduced this type): it
+ * needs a per-frame width measurement of the value row, which this library resolves through
+ * container queries instead.
+ */
+export type MaxTagCountProp = number;
+/**
+ * antd `maxTagPlaceholder` — the node standing in for the values `maxTagCount` hid. A function
+ * receives the omitted values so a consumer can render "+3 件" or a tooltip listing them.
+ */
+export type MaxTagPlaceholderProp = React.ReactNode | ((omitted: {
+    value: string;
+    label: React.ReactNode;
+}[]) => React.ReactNode);
+/**
+ * antd `notFoundContent` — the node shown when a popup has nothing to list. Supersedes the
+ * string-only `emptyMessage`, which stays for the common case.
+ */
+export type NotFoundContentProp = React.ReactNode;
+/**
+ * antd `popupMatchSelectWidth`: `true` (default) locks the popup to the trigger's width, `false`
+ * lets it size to its content, and a number pins it to that many pixels.
+ */
+export type PopupMatchWidthProp = boolean | number;

package/dist/styles/badge-layout.css

@@ -8,7 +8,8 @@
     vertical-align: middle;
     gap: var(--badge-space-gap);
     padding: var(--badge-space-y) var(--badge-space-x);
-    border-radius: var(--radius-md);
+
+    border-radius: var(--badge-radius);
     border-width: 1px;
     font-size: var(--badge-font-size);
 

package/dist/styles/card-layout.css

@@ -447,11 +447,10 @@
     line-height: var(--line-height-normal);
   }
 
-  [data-slot="card"][data-service-launcher] {
+  [data-slot="card"][data-service-launcher] > [data-slot="card-content"] {
     display: flex;
     flex-direction: column;
     gap: var(--card-service-launcher-space-gap);
-    padding: var(--card-space-inset);
   }
 
   [data-slot="service-launcher-heading"],
@@ -526,13 +525,16 @@
 
   [data-slot="card"][data-service-catalog-cta] {
     min-height: var(--card-service-launcher-cta-min-height);
+    border-style: dashed;
+  }
+
+  [data-slot="card"][data-service-catalog-cta] > [data-slot="card-content"] {
+    flex: 1;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     gap: var(--card-service-launcher-space-gap);
-    border-style: dashed;
-    padding: var(--card-space-inset);
     text-align: center;
   }
 
@@ -580,3 +582,23 @@
     height: var(--control-height);
   }
 }
+
+@layer components {
+  .ui-card-bar[data-surface="muted"] {
+    background: hsl(var(--muted));
+  }
+  .ui-card-bar[data-border="none"] {
+    border-block: 0;
+  }
+  .ui-card-bar[data-border="block-start"] {
+    border-block-end: 0;
+    border-block-start: var(--stroke-hairline) solid hsl(var(--border));
+  }
+  .ui-card-bar[data-border="block-end"] {
+    border-block-start: 0;
+    border-block-end: var(--stroke-hairline) solid hsl(var(--border));
+  }
+  .ui-card-bar[data-border="both"] {
+    border-block: var(--stroke-hairline) solid hsl(var(--border));
+  }
+}

package/dist/styles/chart-layout.css

@@ -119,3 +119,18 @@
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+
+.ui-chart-axis-probe {
+  position: fixed;
+  inset-block-start: 0;
+  inset-inline-start: 0;
+  visibility: hidden;
+  margin-inline-end: var(--chart-category-axis-gap);
+  font-size: var(--font-size-xs);
+  white-space: nowrap;
+  pointer-events: none;
+}
+
+.ui-chart-canvas [tabindex="-1"]:focus:not(:focus-visible) {
+  outline: none;
+}