@pantoken/components 0.5.1 → 0.7.0

package/dist/context-view.css

@@ -1 +1 @@
-.instui-context-view{padding:var(--instui-spacing-space-md);background:var(--instui-color-background-elevated-surface-base);color:var(--instui-color-text-base);border:var(--instui-component-context-view-arrow-border-width) solid var(--instui-component-context-view-arrow-border-color);border-radius:var(--instui-component-context-view-border-radius);box-shadow:var(--instui-elevation-above);display:inline-block;position:relative}.instui-context-view:before,.instui-context-view:after{content:"";border-style:solid;border-color:#0000;position:absolute}.instui-context-view:before{border-width:calc(var(--instui-component-context-view-arrow-size) + var(--instui-component-context-view-arrow-border-width))}.instui-context-view:after{border-width:var(--instui-component-context-view-arrow-size)}.instui-context-view:before{border-top-color:var(--instui-component-context-view-arrow-border-color);top:100%;inset-inline-start:calc(var(--instui-spacing-space-lg) - var(--instui-component-context-view-arrow-border-width))}.instui-context-view:after{border-top-color:var(--instui-component-context-view-arrow-background-color);top:100%;inset-inline-start:var(--instui-spacing-space-lg)}.instui-context-view.-placement-bottom:before{border-top-color:#0000;border-bottom-color:var(--instui-component-context-view-arrow-border-color);top:auto;bottom:100%}.instui-context-view.-placement-bottom:after{border-top-color:#0000;border-bottom-color:var(--instui-component-context-view-arrow-background-color);top:auto;bottom:100%}.instui-context-view.-placement-start:before,.instui-context-view.-placement-start:after{top:50%;border-top-color:#0000;inset-inline-start:100%;transform:translateY(-50%)}.instui-context-view.-placement-start:before{border-inline-start-color:var(--instui-component-context-view-arrow-border-color)}.instui-context-view.-placement-start:after{border-inline-start-color:var(--instui-component-context-view-arrow-background-color)}.instui-context-view.-placement-end:before,.instui-context-view.-placement-end:after{top:50%;border-top-color:#0000;inset-inline:auto 100%;transform:translateY(-50%)}.instui-context-view.-placement-end:before{border-inline-end-color:var(--instui-component-context-view-arrow-border-color)}.instui-context-view.-placement-end:after{border-inline-end-color:var(--instui-component-context-view-arrow-background-color)}.instui-context-view.-color-inverse{background:var(--instui-color-background-inverse);color:var(--instui-color-text-inverse);border-color:var(--instui-component-context-view-arrow-border-color-inverse)}.instui-context-view.-color-inverse:before{border-top-color:var(--instui-component-context-view-arrow-border-color-inverse)}.instui-context-view.-color-inverse:after{border-top-color:var(--instui-component-context-view-arrow-background-color-inverse)}.instui-context-view.-color-inverse.-placement-bottom:before{border-top-color:#0000;border-bottom-color:var(--instui-component-context-view-arrow-border-color-inverse)}.instui-context-view.-color-inverse.-placement-bottom:after{border-top-color:#0000;border-bottom-color:var(--instui-component-context-view-arrow-background-color-inverse)}.instui-context-view.-color-inverse.-placement-start:before{border-top-color:#0000;border-inline-start-color:var(--instui-component-context-view-arrow-border-color-inverse)}.instui-context-view.-color-inverse.-placement-start:after{border-top-color:#0000;border-inline-start-color:var(--instui-component-context-view-arrow-background-color-inverse)}.instui-context-view.-color-inverse.-placement-end:before{border-top-color:#0000;border-inline-end-color:var(--instui-component-context-view-arrow-border-color-inverse)}.instui-context-view.-color-inverse.-placement-end:after{border-top-color:#0000;border-inline-end-color:var(--instui-component-context-view-arrow-background-color-inverse)}[popover].instui-context-view{margin:0;position:fixed;overflow:visible}[popover].instui-context-view:not(:popover-open){display:none}@supports (position-area:block-end){[popover].instui-context-view{position-anchor:--pantoken-anchor;position-try-fallbacks:flip-block, flip-inline}[popover].instui-context-view.-placement-top{position-area:block-start}[popover].instui-context-view.-placement-bottom{position-area:block-end}[popover].instui-context-view.-placement-start{position-area:inline-start center}[popover].instui-context-view.-placement-end{position-area:inline-end center}}
+.instui-context-view{padding:var(--instui-spacing-space-md);background:var(--instui-color-background-elevated-surface-base);color:var(--instui-color-text-base);border:var(--instui-component-context-view-arrow-border-width) solid var(--instui-component-context-view-arrow-border-color);border-radius:var(--instui-component-context-view-border-radius);box-shadow:var(--instui-elevation-above);display:inline-block;position:relative}.instui-context-view:before,.instui-context-view:after{content:"";border-style:solid;border-color:#0000;position:absolute}.instui-context-view:before{border-top-color:var(--instui-component-context-view-arrow-border-color);border-width:calc(var(--instui-component-context-view-arrow-size) + var(--instui-component-context-view-arrow-border-width));top:100%;inset-inline-start:calc(var(--instui-spacing-space-lg) - var(--instui-component-context-view-arrow-border-width))}.instui-context-view:after{border-width:var(--instui-component-context-view-arrow-size);border-top-color:var(--instui-component-context-view-arrow-background-color);top:100%;inset-inline-start:var(--instui-spacing-space-lg)}.instui-context-view.-placement-bottom:before{border-top-color:#0000;border-bottom-color:var(--instui-component-context-view-arrow-border-color);top:auto;bottom:100%}.instui-context-view.-placement-bottom:after{border-top-color:#0000;border-bottom-color:var(--instui-component-context-view-arrow-background-color);top:auto;bottom:100%}.instui-context-view.-placement-start:before,.instui-context-view.-placement-start:after{top:50%;border-top-color:#0000;inset-inline-start:100%;transform:translateY(-50%)}.instui-context-view.-placement-start:before{border-inline-start-color:var(--instui-component-context-view-arrow-border-color)}.instui-context-view.-placement-start:after{border-inline-start-color:var(--instui-component-context-view-arrow-background-color)}.instui-context-view.-placement-end:before,.instui-context-view.-placement-end:after{top:50%;border-top-color:#0000;inset-inline:auto 100%;transform:translateY(-50%)}.instui-context-view.-placement-end:before{border-inline-end-color:var(--instui-component-context-view-arrow-border-color)}.instui-context-view.-placement-end:after{border-inline-end-color:var(--instui-component-context-view-arrow-background-color)}.instui-context-view.-color-inverse{background:var(--instui-color-background-inverse);color:var(--instui-color-text-inverse);border-color:var(--instui-component-context-view-arrow-border-color-inverse)}.instui-context-view.-color-inverse:before{border-top-color:var(--instui-component-context-view-arrow-border-color-inverse)}.instui-context-view.-color-inverse:after{border-top-color:var(--instui-component-context-view-arrow-background-color-inverse)}.instui-context-view.-color-inverse.-placement-bottom:before{border-top-color:#0000;border-bottom-color:var(--instui-component-context-view-arrow-border-color-inverse)}.instui-context-view.-color-inverse.-placement-bottom:after{border-top-color:#0000;border-bottom-color:var(--instui-component-context-view-arrow-background-color-inverse)}.instui-context-view.-color-inverse.-placement-start:before{border-top-color:#0000;border-inline-start-color:var(--instui-component-context-view-arrow-border-color-inverse)}.instui-context-view.-color-inverse.-placement-start:after{border-top-color:#0000;border-inline-start-color:var(--instui-component-context-view-arrow-background-color-inverse)}.instui-context-view.-color-inverse.-placement-end:before{border-top-color:#0000;border-inline-end-color:var(--instui-component-context-view-arrow-border-color-inverse)}.instui-context-view.-color-inverse.-placement-end:after{border-top-color:#0000;border-inline-end-color:var(--instui-component-context-view-arrow-background-color-inverse)}[popover].instui-context-view{margin:0;position:fixed;overflow:visible}[popover].instui-context-view:not(:popover-open){display:none}@supports (position-area:block-end){[popover].instui-context-view{position-anchor:--pantoken-anchor;position-try-fallbacks:flip-block, flip-inline}[popover].instui-context-view.-placement-top{position-area:block-start}[popover].instui-context-view.-placement-bottom{position-area:block-end}[popover].instui-context-view.-placement-start{position-area:inline-start center}[popover].instui-context-view.-placement-end{position-area:inline-end center}}

package/dist/index.d.mts

@@ -1,12 +1,5 @@
 import { ELEVATION_NAMES, FOCUSABLE_SELECTOR, elevationDeclarations, focusOutlineDeclarations, focusOutlineRules } from "@pantoken/utils";
 //#region src/lib/helpers.d.ts
-/**
- * Shared primitives for the component builders: the class-prefix namespace helper, the standalone-sheet
- * `wrap` header, the masked-glyph constants, and the spacing scales. These carry no per-record content —
- * every `src/{components,utilities,rules,declarations}` module imports what it needs from here.
- *
- * @module
- */
 /** The default class prefix (`instui` → `.instui-button`). */
 declare const DEFAULT_PREFIX = "instui";
 /** Theme keys emitted by `@pantoken/tokens`. */
@@ -42,14 +35,16 @@ interface Definition {
   css(this: void, options?: ComponentOptions): string;
 }
 //#endregion
-//#region src/rules/prose.d.ts
+//#region src/rules/prose/index.d.ts
 /** Options for {@link proseCss}. */
 interface ProseOptions {
-  /** The content-root selector the rules attach to (default `".pantoken-prose"`). */
+  /** The content-root selector the rules attach to (default `":where(body)"`, applied automatically
+   *  like `base.css` — pass a class like `".vp-doc"` to scope to a different content root instead). */
   scope?: string;
 }
 /**
- * Build the InstUI-look prose stylesheet, scoped to `options.scope` (default `.pantoken-prose`).
+ * Build the InstUI-look prose stylesheet, scoped to `options.scope` (default `:where(body)`, so it
+ * applies automatically without a wrapper class — like `base.css`).
  *
  * @param options - {@link ProseOptions}.
  * @returns The CSS string.
@@ -58,7 +53,7 @@ interface ProseOptions {
  */
 declare function proseCss(options?: ProseOptions): string;
 //#endregion
-//#region src/declarations/elevation.d.ts
+//#region src/declarations/elevation/index.d.ts
 /**
  * Build the elevation token block: `<selector> { --instui-elevation-*: … }`. Shipped inside
  * `components.css` (so shadows are intrinsic — no plugin, no extra import), and reusable by other
@@ -80,7 +75,7 @@ declare function elevationCss(options?: {
   selector?: string;
 }): string;
 //#endregion
-//#region src/declarations/focus.d.ts
+//#region src/declarations/focus/index.d.ts
 /**
  * Build the focus-outline block: the `--instui-focus-outline-*` token defs plus the ring rules.
  * Baked into `base.css` (so focusables get the ring out of the box), and reusable by other layered
@@ -97,203 +92,283 @@ declare function focusOutlineCss(options?: {
   tokenSelector?: string;
 }): string;
 //#endregion
-//#region src/components/button.d.ts
+//#region src/components/button/index.d.ts
 /** Standalone `button` stylesheet — the prefixed CSS for the action button, ready to ship as a `.css` file. */
 declare const buttonCss: Definition["css"];
 //#endregion
-//#region src/components/alert.d.ts
+//#region src/components/alert/index.d.ts
 /** Standalone `alert` stylesheet — the prefixed CSS for the status message, ready to ship as a `.css` file. */
 declare const alertCss: Definition["css"];
 //#endregion
-//#region src/components/badge.d.ts
+//#region src/components/badge/index.d.ts
 /** Standalone `badge` stylesheet — the prefixed CSS for the count-and-status badge, ready to ship as a `.css` file. */
 declare const badgeCss: Definition["css"];
 //#endregion
-//#region src/components/pill.d.ts
+//#region src/components/pill/index.d.ts
 /** Standalone `pill` stylesheet — the prefixed CSS for the status pill, ready to ship as a `.css` file. */
 declare const pillCss: Definition["css"];
 //#endregion
-//#region src/components/tag.d.ts
+//#region src/components/tag/index.d.ts
 /** Standalone `tag` stylesheet — the prefixed CSS for the chip, ready to ship as a `.css` file. */
 declare const tagCss: Definition["css"];
 //#endregion
-//#region src/components/avatar.d.ts
+//#region src/components/avatar/index.d.ts
 /** Standalone `avatar` stylesheet — the prefixed CSS for the avatar, ready to ship as a `.css` file. */
 declare const avatarCss: Definition["css"];
 //#endregion
-//#region src/components/tabs.d.ts
+//#region src/components/tabs/index.d.ts
 /** Standalone `tabs` stylesheet — the prefixed CSS for the tabbed panels, ready to ship as a `.css` file. */
 declare const tabsCss: Definition["css"];
 //#endregion
-//#region src/components/metric.d.ts
+//#region src/components/tabs/members/tab/index.d.ts
+/** Standalone `tabs.tab` stylesheet. */
+declare const tabsTabCss: Definition["css"];
+//#endregion
+//#region src/components/tabs/members/panel/index.d.ts
+/** Standalone `tabs.panel` stylesheet. */
+declare const tabsPanelCss: Definition["css"];
+//#endregion
+//#region src/components/metric/index.d.ts
 /** Standalone `metric` stylesheet — the prefixed CSS for the statistic, ready to ship as a `.css` file. */
 declare const metricCss: Definition["css"];
 //#endregion
-//#region src/components/img.d.ts
+//#region src/components/img/index.d.ts
 /** Standalone `img` stylesheet — the prefixed CSS for the styled image, ready to ship as a `.css` file. */
 declare const imgCss: Definition["css"];
 //#endregion
-//#region src/components/byline.d.ts
+//#region src/components/byline/index.d.ts
 /** Standalone `byline` stylesheet — the prefixed CSS for the media object, ready to ship as a `.css` file. */
 declare const bylineCss: Definition["css"];
 //#endregion
-//#region src/components/table.d.ts
+//#region src/components/table/index.d.ts
 /** Standalone `table` stylesheet — the prefixed CSS for the data table, ready to ship as a `.css` file. */
 declare const tableCss: Definition["css"];
 //#endregion
-//#region src/components/link.d.ts
+//#region src/components/table/members/head/index.d.ts
+/** Standalone `table.head` stylesheet. */
+declare const tableHeadCss: Definition["css"];
+//#endregion
+//#region src/components/table/members/body/index.d.ts
+/** Standalone `table.body` stylesheet. */
+declare const tableBodyCss: Definition["css"];
+//#endregion
+//#region src/components/table/members/row/index.d.ts
+/** Standalone `table.row` stylesheet. */
+declare const tableRowCss: Definition["css"];
+//#endregion
+//#region src/components/table/members/cell/index.d.ts
+/** Standalone `table.cell` stylesheet. */
+declare const tableCellCss: Definition["css"];
+//#endregion
+//#region src/components/table/members/col-header/index.d.ts
+/** Standalone `table.col-header` stylesheet. */
+declare const tableColHeaderCss: Definition["css"];
+//#endregion
+//#region src/components/table/members/row-header/index.d.ts
+/** Standalone `table.row-header` stylesheet. */
+declare const tableRowHeaderCss: Definition["css"];
+//#endregion
+//#region src/components/link/index.d.ts
 /** Standalone `link` stylesheet — the prefixed CSS for the hyperlink, ready to ship as a `.css` file. */
 declare const linkCss: Definition["css"];
 //#endregion
-//#region src/components/list.d.ts
+//#region src/components/list/index.d.ts
 /** Standalone `list` stylesheet — the prefixed CSS for the spaced list, ready to ship as a `.css` file. */
 declare const listCss: Definition["css"];
 //#endregion
-//#region src/components/checkbox.d.ts
+//#region src/components/list/members/item/index.d.ts
+/** Standalone `list.item` stylesheet. */
+declare const listItemCss: Definition["css"];
+//#endregion
+//#region src/components/mask/index.d.ts
+/** The mask component as a standalone, header-wrapped stylesheet. */
+declare const maskCss: Definition["css"];
+//#endregion
+//#region src/components/checkbox/index.d.ts
 /** Standalone `checkbox` stylesheet — the prefixed CSS for the checkbox and switch, ready to ship as a `.css` file. */
 declare const checkboxCss: Definition["css"];
 //#endregion
-//#region src/components/radio.d.ts
+//#region src/components/radio/index.d.ts
 /** Standalone `radio` stylesheet — the prefixed CSS for the radio button, ready to ship as a `.css` file. */
 declare const radioCss: Definition["css"];
 //#endregion
-//#region src/components/spinner.d.ts
+//#region src/components/spinner/index.d.ts
 /** Standalone `spinner` stylesheet — the prefixed CSS for the loading ring, ready to ship as a `.css` file. */
 declare const spinnerCss: Definition["css"];
 //#endregion
-//#region src/components/progress.d.ts
+//#region src/components/progress/index.d.ts
 /** Standalone `progress` stylesheet — the prefixed CSS for the progress bar, ready to ship as a `.css` file. */
 declare const progressCss: Definition["css"];
 //#endregion
-//#region src/components/menu.d.ts
+//#region src/components/menu/index.d.ts
 /** Standalone `menu` stylesheet — the prefixed CSS for the dropdown menu, ready to ship as a `.css` file. */
 declare const menuCss: Definition["css"];
 //#endregion
-//#region src/components/modal.d.ts
+//#region src/components/menu/members/item/index.d.ts
+/** Standalone `menu.item` stylesheet — the prefixed CSS for a menu entry, ready to ship as a `.css` file. */
+declare const menuItemCss: Definition["css"];
+//#endregion
+//#region src/components/menu/members/group/index.d.ts
+/** Standalone `menu.group` stylesheet. */
+declare const menuGroupCss: Definition["css"];
+//#endregion
+//#region src/components/menu/members/separator/index.d.ts
+/** Standalone `menu.separator` stylesheet. */
+declare const menuSeparatorCss: Definition["css"];
+//#endregion
+//#region src/components/modal/index.d.ts
 /** Standalone `modal` stylesheet — the prefixed CSS for the dialog surface, ready to ship as a `.css` file. */
 declare const modalCss: Definition["css"];
 //#endregion
-//#region src/components/breadcrumb.d.ts
+//#region src/components/modal/members/header/index.d.ts
+/** Standalone `modal.header` stylesheet. */
+declare const modalHeaderCss: Definition["css"];
+//#endregion
+//#region src/components/modal/members/body/index.d.ts
+/** Standalone `modal.body` stylesheet. */
+declare const modalBodyCss: Definition["css"];
+//#endregion
+//#region src/components/modal/members/footer/index.d.ts
+/** Standalone `modal.footer` stylesheet. */
+declare const modalFooterCss: Definition["css"];
+//#endregion
+//#region src/components/breadcrumb/index.d.ts
 /** Standalone `breadcrumb` stylesheet — the prefixed CSS for the breadcrumb trail, ready to ship as a `.css` file. */
 declare const breadcrumbCss: Definition["css"];
 //#endregion
-//#region src/components/billboard.d.ts
+//#region src/components/breadcrumb/members/link/index.d.ts
+/** Standalone `breadcrumb.link` stylesheet. */
+declare const breadcrumbLinkCss: Definition["css"];
+//#endregion
+//#region src/components/billboard/index.d.ts
 /** Standalone `billboard` stylesheet — the prefixed CSS for the empty-state block, ready to ship as a `.css` file. */
 declare const billboardCss: Definition["css"];
 //#endregion
-//#region src/components/rating.d.ts
+//#region src/components/rating/index.d.ts
 /** Standalone `rating` stylesheet — the prefixed CSS for the star rating, ready to ship as a `.css` file. */
 declare const ratingCss: Definition["css"];
 //#endregion
-//#region src/components/toggle-group.d.ts
+//#region src/components/toggle-group/index.d.ts
 /** Standalone `toggleGroup` stylesheet — the prefixed CSS for the bordered disclosure, ready to ship as a `.css` file. */
 declare const toggleGroupCss: Definition["css"];
 //#endregion
-//#region src/components/context-view.d.ts
+//#region src/components/context-view/index.d.ts
 /** Standalone `contextView` stylesheet — the prefixed CSS for the caret callout, ready to ship as a `.css` file. */
 declare const contextViewCss: Definition["css"];
 //#endregion
-//#region src/components/progress-circle.d.ts
+//#region src/components/progress-circle/index.d.ts
 /** Standalone `progressCircle` stylesheet — the prefixed CSS for the progress ring, ready to ship as a `.css` file. */
 declare const progressCircleCss: Definition["css"];
 //#endregion
-//#region src/components/pagination.d.ts
+//#region src/components/pagination/index.d.ts
 /** Standalone `pagination` stylesheet — the prefixed CSS for the page navigation, ready to ship as a `.css` file. */
 declare const paginationCss: Definition["css"];
 //#endregion
-//#region src/components/truncate.d.ts
-/** Standalone `truncate` stylesheet — the prefixed CSS for the truncation utility, ready to ship as a `.css` file. */
-declare const truncateCss: Definition["css"];
+//#region src/components/pagination/members/page/index.d.ts
+/** Standalone `pagination.page` stylesheet. */
+declare const paginationPageCss: Definition["css"];
 //#endregion
-//#region src/components/toggle-details.d.ts
+//#region src/components/toggle-details/index.d.ts
 /** Standalone `toggleDetails` stylesheet — the prefixed CSS for the details disclosure, ready to ship as a `.css` file. */
 declare const toggleDetailsCss: Definition["css"];
 //#endregion
-//#region src/components/file-drop.d.ts
+//#region src/components/file-drop/index.d.ts
 /** Standalone `fileDrop` stylesheet — the prefixed CSS for the file dropzone, ready to ship as a `.css` file. */
 declare const fileDropCss: Definition["css"];
 //#endregion
-//#region src/components/side-nav-bar.d.ts
+//#region src/components/side-nav-bar/index.d.ts
 /** Standalone `sideNavBar` stylesheet — the prefixed CSS for the navigation rail, ready to ship as a `.css` file. */
 declare const sideNavBarCss: Definition["css"];
 //#endregion
-//#region src/components/tree-browser.d.ts
+//#region src/components/side-nav-bar/members/item/index.d.ts
+/** Standalone `side-nav-bar.item` stylesheet. */
+declare const sideNavBarItemCss: Definition["css"];
+//#endregion
+//#region src/components/tree-browser/index.d.ts
 /** Standalone `treeBrowser` stylesheet — the prefixed CSS for the disclosure tree, ready to ship as a `.css` file. */
 declare const treeBrowserCss: Definition["css"];
 //#endregion
-//#region src/components/calendar.d.ts
+//#region src/components/calendar/index.d.ts
 /** Standalone `calendar` stylesheet — the prefixed CSS for the month grid, ready to ship as a `.css` file. */
 declare const calendarCss: Definition["css"];
 //#endregion
-//#region src/components/popover.d.ts
+//#region src/components/calendar/members/day/index.d.ts
+/** Standalone `calendar.day` stylesheet. */
+declare const calendarDayCss: Definition["css"];
+//#endregion
+//#region src/components/popover/index.d.ts
 /** Standalone `popover` stylesheet — the prefixed CSS for the popover surface, ready to ship as a `.css` file. */
 declare const popoverCss: Definition["css"];
 //#endregion
-//#region src/components/tray.d.ts
+//#region src/components/tray/index.d.ts
 /** Standalone `tray` stylesheet — the prefixed CSS for the sliding tray, ready to ship as a `.css` file. */
 declare const trayCss: Definition["css"];
 //#endregion
-//#region src/components/tooltip.d.ts
+//#region src/components/tooltip/index.d.ts
 /** Standalone `tooltip` stylesheet — the prefixed CSS for the tooltip bubble, ready to ship as a `.css` file. */
 declare const tooltipCss: Definition["css"];
 //#endregion
-//#region src/components/range-input.d.ts
+//#region src/components/range-input/index.d.ts
 /** Standalone `rangeInput` stylesheet — the prefixed CSS for the range slider, ready to ship as a `.css` file. */
 declare const rangeInputCss: Definition["css"];
 //#endregion
-//#region src/components/heading.d.ts
+//#region src/components/heading/index.d.ts
 /** Standalone `heading` stylesheet — the prefixed CSS for the heading type, ready to ship as a `.css` file. */
 declare const headingCss: Definition["css"];
 //#endregion
-//#region src/components/text.d.ts
+//#region src/components/text/index.d.ts
 /** Standalone `text` stylesheet — the prefixed CSS for the body typography, ready to ship as a `.css` file. */
 declare const textCss: Definition["css"];
 //#endregion
-//#region src/components/close-button.d.ts
+//#region src/components/close-button/index.d.ts
 /** Standalone `closeButton` stylesheet — the prefixed CSS for the close button, ready to ship as a `.css` file. */
 declare const closeButtonCss: Definition["css"];
 //#endregion
-//#region src/components/text-input.d.ts
+//#region src/components/text-input/index.d.ts
 /** Standalone `textInput` stylesheet — the prefixed CSS for the text input, ready to ship as a `.css` file. */
 declare const textInputCss: Definition["css"];
 //#endregion
-//#region src/components/text-area.d.ts
+//#region src/components/text-area/index.d.ts
 /** Standalone `textArea` stylesheet — the prefixed CSS for the textarea, ready to ship as a `.css` file. */
 declare const textAreaCss: Definition["css"];
 //#endregion
-//#region src/components/simple-select.d.ts
+//#region src/components/simple-select/index.d.ts
 /** Standalone `simpleSelect` stylesheet — the prefixed CSS for the native select, ready to ship as a `.css` file. */
 declare const simpleSelectCss: Definition["css"];
 //#endregion
-//#region src/components/input-group.d.ts
+//#region src/components/input-group/index.d.ts
 /** Standalone `inputGroup` stylesheet — the prefixed CSS for the input group, ready to ship as a `.css` file. */
 declare const inputGroupCss: Definition["css"];
 //#endregion
-//#region src/components/number-input.d.ts
+//#region src/components/number-input/index.d.ts
 /** Standalone `numberInput` stylesheet — the prefixed CSS for the number input, ready to ship as a `.css` file. */
 declare const numberInputCss: Definition["css"];
 //#endregion
-//#region src/components/in-place-edit.d.ts
+//#region src/components/in-place-edit/index.d.ts
 /** Standalone `inPlaceEdit` stylesheet — the prefixed CSS for the in-place editor, ready to ship as a `.css` file. */
 declare const inPlaceEditCss: Definition["css"];
 //#endregion
-//#region src/components/form-field-messages.d.ts
+//#region src/components/form-field-messages/index.d.ts
 /** Standalone `formFieldMessages` stylesheet — the prefixed CSS for the field messages, ready to ship as a `.css` file. */
 declare const formFieldMessagesCss: Definition["css"];
 //#endregion
-//#region src/components/form-field.d.ts
+//#region src/components/form-field/index.d.ts
 /** Standalone `formField` stylesheet — the prefixed CSS for the form-field wrapper, ready to ship as a `.css` file. */
 declare const formFieldCss: Definition["css"];
 //#endregion
-//#region src/components/form-field-group.d.ts
+//#region src/components/form-field-group/index.d.ts
 /** Standalone `formFieldGroup` stylesheet — the prefixed CSS for the fieldset group, ready to ship as a `.css` file. */
 declare const formFieldGroupCss: Definition["css"];
 //#endregion
-//#region src/components/radio-input-group.d.ts
+//#region src/components/radio-input-group/index.d.ts
 /** Standalone `radioInputGroup` stylesheet — the prefixed CSS for the radio group, ready to ship as a `.css` file. */
 declare const radioInputGroupCss: Definition["css"];
 //#endregion
-//#region src/components/select.d.ts
+//#region src/components/view/index.d.ts
+/** The View component as a standalone, header-wrapped stylesheet. */
+declare const viewCss: Definition["css"];
+//#endregion
+//#region src/components/select/index.d.ts
 /**
  * The **experimental** customizable-select enhancement for `.<prefix>-simple-select`. Everything is
  * gated behind `@supports (appearance: base-select)` (the CSS Customizable Select model — Chrome 135+,
@@ -318,35 +393,63 @@ declare const radioInputGroupCss: Definition["css"];
  */
 declare function selectCss(options?: ComponentOptions): string;
 //#endregion
-//#region src/utilities/view.d.ts
-/** The View utility as a standalone, header-wrapped stylesheet. */
-declare const viewCss: Definition["css"];
-//#endregion
-//#region src/utilities/spacing.d.ts
+//#region src/utilities/spacing/index.d.ts
 /** The spacing utilities as a standalone, header-wrapped stylesheet. */
 declare const spacingUtilitiesCss: Definition["css"];
 //#endregion
-//#region src/utilities/layout.d.ts
+//#region src/utilities/gap/index.d.ts
+/** The gap utility as a standalone, header-wrapped stylesheet. */
+declare const gapCss: Definition["css"];
+//#endregion
+//#region src/utilities/layout/index.d.ts
 /** The layout utilities as a standalone, header-wrapped stylesheet. */
 declare const layoutUtilitiesCss: Definition["css"];
 //#endregion
-//#region src/utilities/responsive.d.ts
+//#region src/utilities/responsive/index.d.ts
 /** The responsive-visibility utilities as a standalone, header-wrapped stylesheet. */
 declare const responsiveUtilitiesCss: Definition["css"];
 //#endregion
-//#region src/utilities/icon.d.ts
-/** The icon utility as a standalone, header-wrapped stylesheet. */
-declare const iconCss: Definition["css"];
+//#region src/utilities/position/index.d.ts
+/** The position utility as a standalone, header-wrapped stylesheet. */
+declare const positionUtilitiesCss: Definition["css"];
+//#endregion
+//#region src/utilities/overflow/index.d.ts
+/** The overflow utility as a standalone, header-wrapped stylesheet. */
+declare const overflowUtilitiesCss: Definition["css"];
 //#endregion
-//#region src/utilities/mask.d.ts
+//#region src/utilities/cursor/index.d.ts
+/** The cursor utility as a standalone, header-wrapped stylesheet. */
+declare const cursorUtilitiesCss: Definition["css"];
+//#endregion
+//#region src/utilities/stacking/index.d.ts
+/** The stacking utility as a standalone, header-wrapped stylesheet. */
+declare const stackingUtilityCss: Definition["css"];
+//#endregion
+//#region src/utilities/mask/index.d.ts
 /** The mask utility as a standalone, header-wrapped stylesheet. */
-declare const maskCss: Definition["css"];
+declare const maskUtilityCss: Definition["css"];
+//#endregion
+//#region src/utilities/transition/index.d.ts
+/** The transition utility as a standalone, header-wrapped stylesheet. */
+declare const transitionCss: Definition["css"];
+//#endregion
+//#region src/utilities/truncate/index.d.ts
+/** The truncate utility as a standalone, header-wrapped stylesheet. */
+declare const truncateCss: Definition["css"];
 //#endregion
-//#region src/utilities/screen-reader-content.d.ts
+//#region src/utilities/icon/index.d.ts
+/** The icon utility as a standalone, header-wrapped stylesheet. */
+declare const iconCss: Definition["css"];
+//#endregion
+//#region src/utilities/screen-reader-content/index.d.ts
 /** The screen-reader-content utility as a standalone, header-wrapped stylesheet. */
 declare const screenReaderContentCss: Definition["css"];
 //#endregion
-//#region src/utilities/icon-glyphs.d.ts
+//#region src/utilities/visual-debug/index.d.ts
+/** The visual-debug utility as a standalone, header-wrapped stylesheet. */
+declare const visualDebugCss: Definition["css"];
+//#endregion
+//#region src/utilities/icon-glyphs/index.d.ts
 /** Options for {@link iconGlyphsCss}. */
 interface IconGlyphsOptions extends ComponentOptions {
   /**
@@ -394,8 +497,8 @@ declare function iconGlyphsCss(names: readonly string[], options?: IconGlyphsOpt
 declare function baseCss(): string;
 /**
  * Build the aggregated component stylesheet: every component's rules in the `COMPONENTS` concat order.
- * The size-alias and deprecated-alias twins are appended PER COMPONENT (within its own chunk) so each
- * alias documents on its own page — the deprecated aliases are discovered from each record's
+ * The size-alias and alias twins are appended PER COMPONENT (within its own chunk) so each alias
+ * documents on its own page — the aliases are discovered from each record's `@alias {@link -x}` or
  * `@deprecated {@link -x}` metadata (see `withAliases`), not a central hand-kept list. The
  * `--instui-elevation-*` shadow scale the components reference is defined in the token sheet
  * (`@pantoken/css`), so it's no longer inlined here.
@@ -405,4 +508,4 @@ declare function baseCss(): string;
  */
 declare function componentsCss(options?: ComponentOptions): string;
 //#endregion
-export { type ComponentOptions, DEFAULT_PREFIX, ELEVATION_NAMES, FOCUSABLE_SELECTOR, type IconGlyphsOptions, type ProseOptions, alertCss, avatarCss, badgeCss, baseCss, billboardCss, breadcrumbCss, buttonCss, bylineCss, calendarCss, checkboxCss, closeButtonCss, componentsCss, contextViewCss, elevationCss, elevationDeclarations, fileDropCss, focusOutlineCss, focusOutlineDeclarations, focusOutlineRules, formFieldCss, formFieldGroupCss, formFieldMessagesCss, headingCss, iconCss, iconGlyphsCss, imgCss, inPlaceEditCss, inputGroupCss, layoutUtilitiesCss, linkCss, listCss, maskCss, menuCss, metricCss, modalCss, numberInputCss, paginationCss, pillCss, popoverCss, progressCircleCss, progressCss, proseCss, radioCss, radioInputGroupCss, rangeInputCss, ratingCss, responsiveUtilitiesCss, screenReaderContentCss, selectCss, sideNavBarCss, simpleSelectCss, spacingUtilitiesCss, spinnerCss, tableCss, tabsCss, tagCss, textAreaCss, textCss, textInputCss, toggleDetailsCss, toggleGroupCss, tooltipCss, trayCss, treeBrowserCss, truncateCss, viewCss };
+export { type ComponentOptions, DEFAULT_PREFIX, ELEVATION_NAMES, FOCUSABLE_SELECTOR, type IconGlyphsOptions, type ProseOptions, alertCss, avatarCss, badgeCss, baseCss, billboardCss, breadcrumbCss, breadcrumbLinkCss, buttonCss, bylineCss, calendarCss, calendarDayCss, checkboxCss, closeButtonCss, componentsCss, contextViewCss, cursorUtilitiesCss, elevationCss, elevationDeclarations, fileDropCss, focusOutlineCss, focusOutlineDeclarations, focusOutlineRules, formFieldCss, formFieldGroupCss, formFieldMessagesCss, gapCss, headingCss, iconCss, iconGlyphsCss, imgCss, inPlaceEditCss, inputGroupCss, layoutUtilitiesCss, linkCss, listCss, listItemCss, maskCss, maskUtilityCss, menuCss, menuGroupCss, menuItemCss, menuSeparatorCss, metricCss, modalBodyCss, modalCss, modalFooterCss, modalHeaderCss, numberInputCss, overflowUtilitiesCss, paginationCss, paginationPageCss, pillCss, popoverCss, positionUtilitiesCss, progressCircleCss, progressCss, proseCss, radioCss, radioInputGroupCss, rangeInputCss, ratingCss, responsiveUtilitiesCss, screenReaderContentCss, selectCss, sideNavBarCss, sideNavBarItemCss, simpleSelectCss, spacingUtilitiesCss, spinnerCss, stackingUtilityCss, tableBodyCss, tableCellCss, tableColHeaderCss, tableCss, tableHeadCss, tableRowCss, tableRowHeaderCss, tabsCss, tabsPanelCss, tabsTabCss, tagCss, textAreaCss, textCss, textInputCss, toggleDetailsCss, toggleGroupCss, tooltipCss, transitionCss, trayCss, treeBrowserCss, truncateCss, viewCss, visualDebugCss };