ng-blatui 1.29.0 → 1.31.0

package/fesm2022/ng-blatui.mjs

@@ -151,8 +151,10 @@ const buttonVariants = cva("inline-flex shrink-0 items-center justify-center gap
  * semantics, focus and keyboard behavior (accessibility for free).
  */
 class BuiButton {
+    /** Visual style of the button. */
     variant = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    /** Size preset controlling height, padding and icon scale. */
     size = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -172,8 +174,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
                 }]
         }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
 
-const BASE$2 = 'inline-flex items-center justify-center rounded-md border font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden';
-const SIZES$6 = {
+const BASE$1 = 'inline-flex items-center justify-center rounded-md border font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden';
+const SIZES$4 = {
     sm: 'px-1.5 py-px text-[0.625rem]',
     default: 'px-2 py-0.5 text-xs',
     lg: 'px-3 py-1 text-sm [&>svg]:size-3.5',
@@ -237,17 +239,20 @@ function intensityFor(variant) {
  * element so it stays in the document flow and screen-reader friendly.
  */
 class BuiBadge {
+    /** Brand variant, or the intensity (`soft`/`solid`/`outline`) when a `tone` is set. */
     variant = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    /** Optional semantic tone; when set it overrides the brand variant's color. */
     tone = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
+    /** Badge size preset. */
     size = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
     computedClass = computed(() => {
         const tone = this.tone();
         const toneOrVariant = tone === null ? brandClass(this.variant()) : TONES$2[tone][intensityFor(this.variant())];
-        return cn(BASE$2, SIZES$6[this.size()], toneOrVariant, this.userClass());
+        return cn(BASE$1, SIZES$4[this.size()], toneOrVariant, this.userClass());
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "computedClass" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: BuiBadge, deps: [], target: i0.ɵɵFactoryTarget.Directive });
@@ -291,8 +296,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
  * `[decorative]="false"` for a semantic `role="separator"` with `aria-orientation`.
  */
 class BuiSeparator {
+    /** Axis the separator runs along, also driving its sizing. */
     orientation = input('horizontal', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
+    /** Whether the separator is purely visual; `false` exposes a semantic `role="separator"`. */
     decorative = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "decorative" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -346,6 +353,7 @@ const CARD_VARIANTS = {
 };
 /** BlatUI card container. Use `variant="sectioned"` with the header/content/footer parts. */
 class BuiCard {
+    /** Card layout style: simple padded box or sectioned container. */
     variant = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -463,8 +471,10 @@ const ALERT_TONES = {
  * (`default | destructive`) or semantic `tone` (`success | warning | danger | info | neutral`).
  */
 class BuiAlert {
+    /** Brand style; ignored when `tone` is set. */
     variant = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    /** Semantic tone; when set, overrides `variant`. */
     tone = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -521,6 +531,7 @@ const INPUT_SIZES = {
 };
 /** Applies BlatUI input styling to a native `<input>` (keeps native validation & a11y). */
 class BuiInput {
+    /** Size preset controlling input height, padding and text size. */
     size = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -547,15 +558,36 @@ const TEXTAREA_SIZES = {
     default: 'min-h-16 px-3 py-2 text-base md:text-sm',
     lg: 'min-h-20 px-4 py-2.5 text-base',
 };
-/** Applies BlatUI textarea styling to a native `<textarea>` (auto-grows via field-sizing). */
+// Vertical padding (top + bottom) baked into each size preset, used to compute the `maxRows`
+// height cap. Mirrors the `py-*` utilities in TEXTAREA_SIZES.
+const TEXTAREA_PADDING_Y = {
+    sm: '0.75rem',
+    default: '1rem',
+    lg: '1.25rem',
+};
+/**
+ * Applies BlatUI textarea styling to a native `<textarea>`. Auto-grows with its content via CSS
+ * `field-sizing-content` (no JS). Set `[maxRows]` to cap the growth — past it the field scrolls.
+ */
 class BuiTextarea {
+    /** Size preset controlling minimum height, padding and text size. */
     size = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** Maximum number of rows before the textarea scrolls instead of growing (null = unlimited). */
+    maxRows = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "maxRows" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
     computedClass = computed(() => cn(TEXTAREA_BASE, TEXTAREA_SIZES[this.size()], this.userClass()), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "computedClass" }] : /* istanbul ignore next */ []));
+    // Cap the auto-grow at `maxRows` lines using the `lh` unit (one line-height) plus the size's
+    // vertical padding and the 1px borders — purely declarative, so it stays SSR-safe.
+    maxHeight = computed(() => {
+        const rows = this.maxRows();
+        return rows === null ? null : `calc(${rows} * 1lh + ${TEXTAREA_PADDING_Y[this.size()]} + 2px)`;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "maxHeight" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: BuiTextarea, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.2", type: BuiTextarea, isStandalone: true, selector: "textarea[buiTextarea]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "textarea" }, properties: { "attr.data-size": "size()", "class": "computedClass()" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.2", type: BuiTextarea, isStandalone: true, selector: "textarea[buiTextarea]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, maxRows: { classPropertyName: "maxRows", publicName: "maxRows", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "textarea" }, properties: { "attr.data-size": "size()", "class": "computedClass()", "style.max-height": "maxHeight()", "style.overflow-y": "maxRows() === null ? null : 'auto'" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: BuiTextarea, decorators: [{
             type: Directive,
@@ -565,17 +597,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
                         'data-slot': 'textarea',
                         '[attr.data-size]': 'size()',
                         '[class]': 'computedClass()',
+                        '[style.max-height]': 'maxHeight()',
+                        '[style.overflow-y]': "maxRows() === null ? null : 'auto'",
                     },
                 }]
-        }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+        }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], maxRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxRows", required: false }] }], userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
 
 /**
  * BlatUI linear progress bar. Exposes the full `progressbar` ARIA contract
  * (valuemin/max/now/text). Set `[indeterminate]="true"` for an unknown-duration bar.
  */
 class BuiProgress {
+    /** Completion percentage from 0 to 100; values are clamped to that range. */
     value = input(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Show an unknown-duration animation instead of a fixed value. */
     indeterminate = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "indeterminate" }] : /* istanbul ignore next */ []));
     /** Render a circular ring instead of a linear bar. */
@@ -587,6 +623,7 @@ class BuiProgress {
     /** Stroke width of the circular ring, in pixels. */
     thickness = input(4, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "thickness" }] : /* istanbul ignore next */ []));
+    /** Accessible label announced for the progress bar. */
     ariaLabel = input('Progress', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -718,8 +755,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
  * the projected fallback (initials, icon). Falls back automatically on load error.
  */
 class BuiAvatar {
+    /** Image URL to display; when unset or on load error the fallback is shown. */
     src = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
+    /** Alternative text for the avatar image. */
     alt = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "alt" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -784,10 +823,13 @@ const CHECKBOX_BASE = 'peer border-input dark:bg-input/30 data-[state=checked]:b
  * with `[(checked)]` two-way binding and tri-state `[(indeterminate)]`.
  */
 class BuiCheckbox {
+    /** Whether the box is checked. Two-way bindable with `[(checked)]`. */
     checked = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
+    /** Whether the box shows the mixed/indeterminate state. Two-way bindable with `[(indeterminate)]`. */
     indeterminate = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "indeterminate" }] : /* istanbul ignore next */ []));
+    /** Whether the checkbox is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -944,10 +986,13 @@ const THUMB_BASE = 'bg-background dark:data-[state=unchecked]:bg-foreground dark
  * binding; keyboard activation (Space/Enter) and focus come from the native button.
  */
 class BuiSwitch {
+    /** Whether the switch is on. Two-way bindable with `[(checked)]`. */
     checked = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
+    /** Whether the switch is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /** Track and thumb size. */
     size = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     /** Optional SVG path `d` shown inside the thumb when checked. */
@@ -2096,8 +2141,10 @@ const noop$g = () => { };
  * `buiRadioItem` buttons; `[(value)]` two-way binds the selected value.
  */
 class BuiRadioGroup {
+    /** Selected radio value. Two-way bindable with `[(value)]`. */
     value = model(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Whether the whole group is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -2163,8 +2210,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
         }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }, { type: i0.Output, args: ["disabledChange"] }], userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
 const ITEM = 'border-input text-primary dark:bg-input/30 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive flex aspect-square size-4 shrink-0 items-center justify-center rounded-full border shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50';
 class BuiRadioGroupItem {
+    /** Value this item contributes to the group when selected. */
     value = input.required(/* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Whether this individual radio item is disabled. */
     disabled = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -2223,6 +2272,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 const CONTENT_BASE = 'z-50 w-fit max-w-xs rounded-md px-3 py-1.5 text-xs shadow-md bg-primary text-primary-foreground';
 /** Floating tooltip bubble rendered into a CDK overlay. */
 class BuiTooltipContent {
+    /** Text rendered inside the tooltip bubble. */
     text = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
     /** Extra classes (e.g. a colour override) merged over the base bubble styles. */
@@ -2260,7 +2310,9 @@ const FALLBACK = {
  * a hover delay with `delay`, and the bubble colour with `tooltipClass`.
  */
 class BuiTooltip {
+    /** Tooltip text; bound via the `buiTooltip` attribute. */
     text = input.required({ ...(ngDevMode ? { debugName: "text" } : /* istanbul ignore next */ {}), alias: 'buiTooltip' });
+    /** Preferred placement side relative to the host, with an automatic flip fallback. */
     side = input('top', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "side" }] : /* istanbul ignore next */ []));
     /** Delay in milliseconds before the tooltip appears on hover/focus. */
@@ -2335,6 +2387,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** Breadcrumb navigation landmark (`<nav aria-label="breadcrumb">`). */
 class BuiBreadcrumb {
+    /** Accessible label for the breadcrumb navigation landmark. */
     label = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
     labelText = buiLabel('breadcrumb', this.label);
@@ -2463,6 +2516,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 /** Collapsed breadcrumb indicator (ellipsis). */
 class BuiBreadcrumbEllipsis {
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Screen-reader text for the collapsed ellipsis indicator. */
     moreLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "moreLabel" }] : /* istanbul ignore next */ []));
     moreText = buiLabel('breadcrumbMore', this.moreLabel);
@@ -2533,6 +2587,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** Constrains projected content to a given aspect ratio (e.g. `16 / 9`). */
 class BuiAspectRatio {
+    /** Aspect ratio for the content, as a CSS `aspect-ratio` value (e.g. `16 / 9`). */
     ratio = input('1 / 1', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ratio" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -2556,6 +2611,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** Groups buttons (and inputs) into a single segmented control. */
 class BuiButtonGroup {
+    /** Layout direction of the grouped controls. */
     orientation = input('horizontal', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -2622,6 +2678,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
                 }]
         }], propDecorators: { userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
 class BuiEmptyMedia {
+    /** Media style; `icon` renders a muted rounded badge sized for an icon. */
     variant = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -2685,7 +2742,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
                 }]
         }], propDecorators: { userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
 
-const SIZES$5 = {
+const SIZES$3 = {
     sm: 'max-w-3xl',
     md: 'max-w-5xl',
     lg: 'max-w-6xl',
@@ -2695,10 +2752,11 @@ const SIZES$5 = {
 };
 /** Centered, padded page container with a max-width scale. */
 class BuiContainer {
+    /** Maximum width preset for the container. */
     size = input('lg', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
-    computedClass = computed(() => cn('mx-auto w-full px-4 sm:px-6 lg:px-8', SIZES$5[this.size()], this.userClass()), /* @ts-ignore */
+    computedClass = computed(() => cn('mx-auto w-full px-4 sm:px-6 lg:px-8', SIZES$3[this.size()], this.userClass()), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "computedClass" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: BuiContainer, deps: [], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.2", type: BuiContainer, isStandalone: true, selector: "[buiContainer]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "container" }, properties: { "class": "computedClass()" } }, ngImport: i0 });
@@ -2718,6 +2776,7 @@ const FIELD_ORIENT = {
 };
 /** A form field row grouping a label, control, description and error. */
 class BuiField {
+    /** How the label and control are arranged within the field. */
     orientation = input('vertical', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -2753,6 +2812,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
                 }]
         }], propDecorators: { userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
 class BuiFieldLegend {
+    /** Whether the legend is styled as a section legend or a smaller label. */
     variant = input('legend', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -2787,6 +2847,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
                 }]
         }], propDecorators: { userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
 class BuiFieldLabel {
+    /** Id of the control this label is associated with (maps to the `for` attribute). */
     forId = input(undefined, { ...(ngDevMode ? { debugName: "forId" } : /* istanbul ignore next */ {}), alias: 'for' });
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
     computedClass = computed(() => cn('flex w-fit gap-2 text-sm leading-snug font-medium select-none group-data-[disabled=true]/field:opacity-50', this.userClass()), /* @ts-ignore */
@@ -2887,6 +2948,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** Accessible disclosure: a trigger toggles the visibility of its content. */
 class BuiCollapsible {
+    /** Whether the content is shown. Two-way bindable with `[(open)]`. */
     open = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
     contentId = inject(_IdGenerator).getId('bui-collapsible-');
@@ -2959,12 +3021,16 @@ const toggleVariants = cva("inline-flex items-center justify-center gap-2 rounde
 });
 /** A two-state toggle button (`aria-pressed`). */
 class BuiToggle {
+    /** Whether the toggle is pressed (on). Two-way bindable with `[(pressed)]`. */
     pressed = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "pressed" }] : /* istanbul ignore next */ []));
+    /** Whether the toggle is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /** Visual style: plain or outlined. */
     variant = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    /** Button size. */
     size = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -3021,6 +3087,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 /** A spinning loading indicator (`role="status"`). */
 class BuiSpinner {
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Overrides the localized accessible status label. */
     label = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
     labelText = buiLabel('spinnerLoading', this.label);
@@ -3071,8 +3138,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** Copy-to-clipboard button: copies `value`, flips to a check, announces "Copied". */
 class BuiCopyButton {
+    /** Text written to the clipboard when clicked. */
     value = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Accessible label shown before copying. */
     label = input('Copy', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -3189,15 +3258,20 @@ const TONES$1 = {
  * the dismissal in localStorage. SSR-safe — localStorage is only touched in the browser.
  */
 class BuiBanner {
+    /** Color tone (`default | primary | info | success | warning | danger`). */
     tone = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
+    /** Whether to show the dismiss button. */
     dismissible = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "dismissible" }] : /* istanbul ignore next */ []));
+    /** When set, the dismissal is remembered in localStorage under this key. */
     persistKey = input(undefined, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "persistKey" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Overrides the localized accessible label for the announcement region. */
     announcementLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "announcementLabel" }] : /* istanbul ignore next */ []));
+    /** Overrides the localized accessible label for the dismiss button. */
     dismissLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "dismissLabel" }] : /* istanbul ignore next */ []));
     announcementText = buiLabel('bannerAnnouncement', this.announcementLabel);
@@ -3292,6 +3366,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** Scroll/border wrapper around a table. `variant="card"` adds a bordered card. */
 class BuiTableContainer {
+    /** Wrapper style; `card` adds a bordered, shadowed card around the table. */
     variant = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -3424,7 +3499,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
                 }]
         }], propDecorators: { userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
 
-const SIZES$4 = {
+const SIZES$2 = {
     sm: { box: 'size-6', overlap: '-ms-2', ring: 'ring-1', text: 'text-xs' },
     default: { box: 'size-8', overlap: '-ms-2.5', ring: 'ring-2', text: 'text-sm' },
     lg: { box: 'size-12', overlap: '-ms-3', ring: 'ring-2', text: 'text-base' },
@@ -3441,10 +3516,13 @@ function initials(name) {
 }
 /** Overlapping stack of avatars with an optional "+N" overflow counter. */
 class BuiAvatarGroup {
+    /** Avatars to display, in order. */
     avatars = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "avatars" }] : /* istanbul ignore next */ []));
+    /** Maximum avatars shown before the rest collapse into a "+N" counter. */
     max = input(4, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
+    /** Avatar size preset, which also controls overlap and ring width. */
     size = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -3456,11 +3534,11 @@ class BuiAvatarGroup {
     ...(ngDevMode ? [{ debugName: "computedClass" }] : /* istanbul ignore next */ []));
     toInitials = initials;
     itemClass(index) {
-        const size = SIZES$4[this.size()];
+        const size = SIZES$2[this.size()];
         return cn(size.box, size.ring, 'ring-background', index > 0 && size.overlap);
     }
     moreClass() {
-        const size = SIZES$4[this.size()];
+        const size = SIZES$2[this.size()];
         return cn('relative z-10 flex shrink-0 items-center justify-center rounded-full bg-muted font-medium text-foreground', size.box, size.ring, 'ring-background', size.text, this.shown().length > 0 && size.overlap);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: BuiAvatarGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
@@ -3516,6 +3594,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** Pagination navigation landmark. */
 class BuiPagination {
+    /** Accessible label for the navigation landmark; falls back to a localized default. */
     ariaLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -3571,8 +3650,10 @@ const LINK_SIZES = {
 };
 /** A pagination link; set `active` for the current page. */
 class BuiPaginationLink {
+    /** Whether this link represents the current page; sets `aria-current="page"`. */
     active = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
+    /** Size variant controlling link dimensions and padding. */
     size = input('icon', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -3598,6 +3679,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 /** Ellipsis indicator for skipped pages. */
 class BuiPaginationEllipsis {
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Visually-hidden label announcing skipped pages; falls back to a localized default. */
     moreLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "moreLabel" }] : /* istanbul ignore next */ []));
     moreText = buiLabel('paginationMore', this.moreLabel);
@@ -3663,7 +3745,9 @@ const POPOVER_FALLBACK = {
  * Closes on outside click and Escape. SSR-safe (the overlay is browser-only, on click).
  */
 class BuiPopover {
+    /** Template rendered as the popover content; bound via `[buiPopover]`. */
     content = input.required({ ...(ngDevMode ? { debugName: "content" } : /* istanbul ignore next */ {}), alias: 'buiPopover' });
+    /** Side of the trigger the popover opens on, with an automatic opposite-side fallback. */
     side = input('bottom', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "side" }] : /* istanbul ignore next */ []));
     overlay = inject(Overlay);
@@ -3759,8 +3843,10 @@ const ITEM_SIZES = {
 };
 /** A list/row item; use on a `<div>` or an `<a>`. */
 class BuiItem {
+    /** Visual style of the item: transparent, outlined, or muted background. */
     variant = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    /** Item density: standard padding or a more compact `sm` size. */
     size = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -3787,6 +3873,7 @@ const MEDIA_VARIANTS = {
     image: 'size-10 overflow-hidden rounded-sm [&_img]:size-full [&_img]:object-cover',
 };
 class BuiItemMedia {
+    /** Media presentation: plain, an icon tile, or a cropped image thumbnail. */
     variant = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -3934,6 +4021,7 @@ const ADDON_ALIGN = {
     'block-end': 'order-last w-full justify-start px-3 pb-3',
 };
 class BuiInputGroupAddon {
+    /** Where the addon sits relative to the input (inline or block, start or end). */
     align = input('inline-start', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -3994,8 +4082,10 @@ const IG_BUTTON_SIZES = {
     'icon-sm': 'size-8 p-0',
 };
 class BuiInputGroupButton {
+    /** Visual style of the addon button. */
     variant = input('ghost', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    /** Size preset for the addon button (text or icon variants). */
     size = input('xs', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -4014,6 +4104,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** Visually hides content while keeping it available to assistive tech (sr-only). */
 class BuiVisuallyHidden {
+    /** Whether the content becomes visible when focused (e.g. skip links). */
     focusable = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "focusable" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -4039,21 +4130,28 @@ const TONES = {
 };
 /** A labelled meter (`role="meter"`) for a measurement within a known range. */
 class BuiMeter {
+    /** Current measurement; clamped between `min` and `max`. */
     value = input(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Minimum value of the meter range. */
     min = input(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
+    /** Maximum value of the meter range. */
     max = input(100, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
+    /** Optional text label shown above the meter bar. */
     label = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /** Fill colour tone; overridden by any matching threshold. */
     tone = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
     /** Auto-pick the fill tone by value: the highest threshold whose `at` ≤ value wins. */
     thresholds = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "thresholds" }] : /* istanbul ignore next */ []));
+    /** Whether to display the formatted value text next to the label. */
     showValue = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "showValue" }] : /* istanbul ignore next */ []));
+    /** Unit suffix appended to the displayed value (e.g. "%"). */
     unit = input('%', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "unit" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -4157,14 +4255,19 @@ const TREND_CLASS = {
 };
 /** A KPI / statistic card: label, big value, and a trend-coloured change. */
 class BuiStat {
+    /** Small caption shown above the value. */
     label = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /** Primary statistic displayed as the large value. */
     value = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Change indicator (e.g. "+12%"); coloured by trend. */
     change = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "change" }] : /* istanbul ignore next */ []));
+    /** Explicit trend direction; inferred from `change`'s sign when null. */
     trend = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "trend" }] : /* istanbul ignore next */ []));
+    /** Muted text shown next to the change value. */
     caption = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "caption" }] : /* istanbul ignore next */ []));
     /** Optional inline sparkline drawn from a series of numbers. */
@@ -4283,9 +4386,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
  * and stays open while the pointer is over the card. SSR-safe (browser-only, on hover).
  */
 class BuiHoverCard {
+    /** Template rendered inside the card; bound via the `buiHoverCard` attribute. */
     content = input.required({ ...(ngDevMode ? { debugName: "content" } : /* istanbul ignore next */ {}), alias: 'buiHoverCard' });
+    /** Delay in milliseconds before the card opens on hover/focus. */
     openDelay = input(400, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "openDelay" }] : /* istanbul ignore next */ []));
+    /** Delay in milliseconds before the card closes after the pointer leaves. */
     closeDelay = input(100, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "closeDelay" }] : /* istanbul ignore next */ []));
     overlay = inject(Overlay);
@@ -4377,15 +4483,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A dark code panel with an optional filename header and a copy button. */
 class BuiCodeBlock {
+    /** Source code shown in the panel and copied to the clipboard. */
     code = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "code" }] : /* istanbul ignore next */ []));
+    /** Optional filename shown in the header; omit for the floating copy button. */
     filename = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "filename" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label for the copy button. */
     copyLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "copyLabel" }] : /* istanbul ignore next */ []));
+    /** Short visible text for the copy button. */
     copyShortLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "copyShortLabel" }] : /* istanbul ignore next */ []));
+    /** Text shown briefly after the code is copied. */
     copiedLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "copiedLabel" }] : /* istanbul ignore next */ []));
     copyText = buiLabel('codeBlockCopy', this.copyLabel);
@@ -4480,23 +4591,31 @@ const noop$e = () => { };
  * only read inside browser event handlers.
  */
 class BuiSlider {
+    /** Current value (lower thumb in range mode). Two-way bindable with `[(value)]`. */
     value = model(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
     /** Enable a second thumb; binds `endValue` as the upper handle. */
     range = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "range" }] : /* istanbul ignore next */ []));
+    /** Upper thumb value in range mode. Two-way bindable with `[(endValue)]`. */
     endValue = model(100, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "endValue" }] : /* istanbul ignore next */ []));
+    /** Minimum selectable value. */
     min = input(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
+    /** Maximum selectable value. */
     max = input(100, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
+    /** Increment between selectable values. */
     step = input(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "step" }] : /* istanbul ignore next */ []));
+    /** Whether the slider is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /** Layout direction of the slider. */
     orientation = input('horizontal', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the thumb(s). */
     ariaLabel = input('Value', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -4754,18 +4873,25 @@ const noop$d = () => { };
 const STAR_SIZE = { sm: 'size-4', default: 'size-5', lg: 'size-6' };
 /** A star rating (`role="radiogroup"`) with hover preview and keyboard support. */
 class BuiRating {
+    /** Current rating. Two-way bindable with `[(value)]`. */
     value = model(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Number of stars shown. */
     max = input(5, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
+    /** Whether the rating is display-only and cannot be changed. */
     readonly = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
+    /** Whether the rating is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /** Size of each star. */
     size = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** Tailwind text-color class applied to filled stars. */
     color = input('text-amber-500', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the rating group. */
     ariaLabel = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -4920,24 +5046,39 @@ const BTN_SIZE$1 = {
     lg: 'w-9 [&_svg]:size-4',
 };
 const FIELD_WIDTH = { sm: 'w-9', default: 'w-10', lg: 'w-12' };
-/** A compact − [n] + quantity stepper (`role="group"` with a `spinbutton` field). */
+/**
+ * @deprecated Use `<bui-number-input [min]="1" size="sm">` instead — it is the same numeric
+ * stepper, so this duplicate was dropped from the registry and docs. Still exported as a thin
+ * compatibility shim; existing usages keep working.
+ *
+ * A compact − [n] + quantity stepper (`role="group"` with a `spinbutton` field).
+ */
 class BuiQuantitySelector {
+    /** Current quantity. Two-way bindable with `[(value)]`. */
     value = model(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Minimum allowed quantity. */
     min = input(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
+    /** Maximum allowed quantity; unbounded when null. */
     max = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
+    /** Increment/decrement applied per button press. */
     step = input(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "step" }] : /* istanbul ignore next */ []));
+    /** Size preset controlling height and button width. */
     size = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** Whether the whole control is disabled. */
     disabled = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the numeric input field. */
     ariaLabel = input('Quantity', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label override for the decrease button. */
     decreaseLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "decreaseLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label override for the increase button. */
     increaseLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "increaseLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -5201,69 +5342,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
                 }]
         }], propDecorators: { userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
 
-const BASE$1 = 'border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:bg-input/30 flex w-full resize-none overflow-hidden rounded-md border bg-transparent shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50';
-const SIZES$3 = {
-    sm: 'min-h-14 px-2.5 py-1.5 text-sm',
-    default: 'min-h-16 px-3 py-2 text-base md:text-sm',
-    lg: 'min-h-20 px-4 py-2.5 text-base',
-};
 /**
- * A textarea that grows with its content. SSR-safe — the height is measured only in the
- * browser (via `afterNextRender` and the `input` event).
+ * @deprecated Use `<textarea buiTextarea [maxRows]="…">` instead — `buiTextarea` already auto-grows
+ * (CSS `field-sizing-content`) and now supports `maxRows`. Kept as a thin alias so existing
+ * `buiAutosizeTextarea` markup keeps working; it inherits every input from {@link BuiTextarea}.
+ *
+ * A textarea that grows with its content, capped at `maxRows`.
  */
-class BuiAutosizeTextarea {
-    size = input('default', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    maxRows = input(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "maxRows" }] : /* istanbul ignore next */ []));
-    userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
-    host = inject(ElementRef);
-    computedClass = computed(() => cn(BASE$1, SIZES$3[this.size()], this.userClass()), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "computedClass" }] : /* istanbul ignore next */ []));
-    constructor() {
-        afterNextRender(() => {
-            this.resize();
-        });
-    }
-    resize() {
-        const element = this.host.nativeElement;
-        element.style.height = 'auto';
-        let target = element.scrollHeight;
-        const maxRows = this.maxRows();
-        if (maxRows !== null) {
-            const styles = getComputedStyle(element);
-            let lineHeight = Number.parseFloat(styles.lineHeight);
-            if (Number.isNaN(lineHeight)) {
-                lineHeight = Number.parseFloat(styles.fontSize) * 1.2;
-            }
-            const padding = Number.parseFloat(styles.paddingTop) + Number.parseFloat(styles.paddingBottom);
-            const border = Number.parseFloat(styles.borderTopWidth) + Number.parseFloat(styles.borderBottomWidth);
-            const cap = lineHeight * maxRows + padding + border;
-            if (target > cap) {
-                target = cap;
-                element.style.overflowY = 'auto';
-            }
-            else {
-                element.style.overflowY = 'hidden';
-            }
-        }
-        element.style.height = `${target}px`;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: BuiAutosizeTextarea, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.2", type: BuiAutosizeTextarea, isStandalone: true, selector: "textarea[buiAutosizeTextarea]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, maxRows: { classPropertyName: "maxRows", publicName: "maxRows", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "autosize-textarea" }, listeners: { "input": "resize()" }, properties: { "attr.data-size": "size()", "class": "computedClass()" } }, ngImport: i0 });
+class BuiAutosizeTextarea extends BuiTextarea {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: BuiAutosizeTextarea, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: BuiAutosizeTextarea, isStandalone: true, selector: "textarea[buiAutosizeTextarea]", host: { attributes: { "data-slot": "autosize-textarea" } }, usesInheritance: true, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: BuiAutosizeTextarea, decorators: [{
             type: Directive,
             args: [{
                     selector: 'textarea[buiAutosizeTextarea]',
-                    host: {
-                        'data-slot': 'autosize-textarea',
-                        '[attr.data-size]': 'size()',
-                        '[class]': 'computedClass()',
-                        '(input)': 'resize()',
-                    },
+                    host: { 'data-slot': 'autosize-textarea' },
                 }]
-        }], ctorParameters: () => [], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], maxRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxRows", required: false }] }], userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+        }] });
 
 class BuiDropdownMenu {
     menu = inject(Menu);
@@ -5387,6 +5483,7 @@ const TYPOGRAPHY = {
 };
 /** Applies a typographic style. Put it on the matching element (e.g. `<h1 buiTypography variant="h1">`). */
 class BuiTypography {
+    /** Typographic style to apply (e.g. `h1`, `lead`, `blockquote`, `gradient`). */
     variant = input('p', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -5409,10 +5506,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** Decorative dotted background layer. Drop inside a `relative` container. */
 class BuiDotPattern {
+    /** Dot radius in pixels. */
     size = input(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** Spacing between dots in pixels. */
     gap = input(16, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "gap" }] : /* istanbul ignore next */ []));
+    /** Whether to fade the pattern with a radial mask toward the edges. */
     mask = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "mask" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -5445,10 +5545,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** Decorative grid background layer. Drop inside a `relative` container. */
 class BuiGridPattern {
+    /** Cell size (spacing between grid lines) in pixels. */
     gap = input(24, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "gap" }] : /* istanbul ignore next */ []));
+    /** Thickness of the grid lines in pixels. */
     lineWidth = input(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "lineWidth" }] : /* istanbul ignore next */ []));
+    /** Whether to fade the pattern with a radial mask toward the edges. */
     mask = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "mask" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -5486,10 +5589,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 const noop$c = () => { };
 /** A single-select segmented control (`role="radiogroup"`) with arrow-key navigation. */
 class BuiSegmentedControl {
+    /** Currently selected segment value. Two-way bindable with `[(value)]`. */
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Available segments; plain strings are used as both value and label. */
     options = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
+    /** Whether all segments are disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -5609,8 +5715,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
  * helper classes `.prompt .ok .dim .path .warn` colour them.
  */
 class BuiTerminal {
+    /** Optional title shown in the terminal title bar. */
     title = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
+    /** Whether to show the macOS-style traffic-light buttons in the title bar. */
     buttons = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "buttons" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -5680,17 +5788,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A data-driven feature-comparison / pricing table. */
 class BuiComparisonTable {
+    /** Column headers, one per pricing/feature tier. */
     tiers = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "tiers" }] : /* istanbul ignore next */ []));
+    /** Feature rows; each holds one value per tier. */
     rows = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
+    /** Tier to emphasize, by index or tier name; `null` highlights none. */
     highlight = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "highlight" }] : /* istanbul ignore next */ []));
+    /** Header text for the leading feature column. */
     featureLabel = input('Feature', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "featureLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label for the included (check) icon. */
     includedLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "includedLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the not-included (dash) marker. */
     notIncludedLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "notIncludedLabel" }] : /* istanbul ignore next */ []));
     includedText = buiLabel('comparisonTableIncluded', this.includedLabel);
@@ -5836,8 +5950,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
  * with `[buiFlipBack]`. `trigger="hover"` (default) or `"click"` (keyboard-accessible).
  */
 class BuiFlipCard {
+    /** What flips the card: hover/focus or click/keypress. */
     trigger = input('hover', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "trigger" }] : /* istanbul ignore next */ []));
+    /** Fixed card height as a CSS length. */
     height = input('16rem', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -5932,8 +6048,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A card with a radial spotlight glow that follows the cursor on hover. */
 class BuiSpotlightCard {
+    /** Spotlight glow colour; defaults to a subtle foreground tint. */
     color = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+    /** Spotlight radius in pixels. */
     size = input(350, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -5989,8 +6107,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A card that tilts in 3D toward the cursor. SSR-safe (geometry read on mousemove). */
 class BuiTiltCard {
+    /** Maximum tilt angle in degrees on each axis. */
     max = input(10, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
+    /** Scale factor applied while the card is tilting. */
     scaleTo = input(1.05, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "scaleTo" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -6060,17 +6180,22 @@ const noop$b = () => { };
  * (arrows, Home/End, Enter, Escape) and outside-click close. SSR-safe.
  */
 class BuiSelect {
+    /** Selected option value (single mode). Two-way bindable with `[(value)]`. */
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
     /** Select several options; binds `values` instead of `value`. */
     multiple = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "multiple" }] : /* istanbul ignore next */ []));
+    /** Selected option values (multiple mode). Two-way bindable with `[(values)]`. */
     values = model([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "values" }] : /* istanbul ignore next */ []));
+    /** Available options to choose from. */
     options = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
+    /** Text shown on the trigger when nothing is selected. */
     placeholder = input('Select…', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Whether the select is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -6446,11 +6571,14 @@ const VARIANTS$1 = {
  * `threshold` px. SSR-safe — the scroll position is only read in the browser.
  */
 class BuiBackToTop {
+    /** Pixel scroll distance before the button appears. */
     threshold = input(300, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "threshold" }] : /* istanbul ignore next */ []));
+    /** Visual style of the button. */
     variant = input('primary', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label for the button; falls back to the i18n default. */
     label = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
     labelText = buiLabel('backToTop', this.label);
@@ -6539,17 +6667,22 @@ const noop$a = () => { };
  * filtered listbox, using the `aria-activedescendant` pattern. Full keyboard + outside-click.
  */
 class BuiCombobox {
+    /** Selected option value (single mode). Two-way bindable with `[(value)]`. */
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
     /** Select several options; binds `values` instead of `value`. */
     multiple = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "multiple" }] : /* istanbul ignore next */ []));
+    /** Selected option values (multiple mode). Two-way bindable with `[(values)]`. */
     values = model([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "values" }] : /* istanbul ignore next */ []));
+    /** Available options to filter and choose from. */
     options = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
+    /** Placeholder text shown in the search input. */
     placeholder = input('Search…', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Whether the combobox is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     /** When false, the field can't be typed in — it just opens the full list (select-like). */
@@ -6852,8 +6985,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A live countdown to a target time (`role="timer"`). SSR-safe — ticks only in the browser. */
 class BuiCountdown {
+    /** Target moment to count down to, as a Date, timestamp, or date string. */
     to = input.required(/* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "to" }] : /* istanbul ignore next */ []));
+    /** Text shown once the target time has passed. */
     expired = input('Expired', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "expired" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -6953,18 +7088,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
  * `aria-hidden`; an sr-only span carries the final value (SSR/no-JS read the real number).
  */
 class BuiNumberTicker {
+    /** Target value to count up to. */
     value = input(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Starting value the animation counts from. */
     from = input(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "from" }] : /* istanbul ignore next */ []));
+    /** Animation length in milliseconds; 0 snaps instantly. */
     duration = input(1500, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "duration" }] : /* istanbul ignore next */ []));
+    /** Number of decimal places to display. */
     decimals = input(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "decimals" }] : /* istanbul ignore next */ []));
+    /** Text prepended before the number. */
     prefix = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "prefix" }] : /* istanbul ignore next */ []));
+    /** Text appended after the number. */
     suffix = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "suffix" }] : /* istanbul ignore next */ []));
+    /** Thousands-group separator character. */
     separator = input(',', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "separator" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -7033,8 +7175,10 @@ const VARIANTS = {
 };
 /** A styled anchor. Set `external` for `target=_blank` + safe `rel`. */
 class BuiLink {
+    /** Visual style of the link: default, muted, or subtle. */
     variant = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    /** Whether the link is external, adding `target=_blank` and safe `rel`. */
     external = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "external" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -7068,14 +7212,19 @@ const PRESETS = {
 };
 /** Renders accessible text painted with a CSS gradient, with an optional shimmer. */
 class BuiGradientText {
+    /** Named colour preset used when from/via/to are not set. */
     preset = input('brand', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "preset" }] : /* istanbul ignore next */ []));
+    /** Gradient start colour; overrides the preset's first stop. */
     from = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "from" }] : /* istanbul ignore next */ []));
+    /** Gradient middle colour; overrides the preset's second stop. */
     via = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "via" }] : /* istanbul ignore next */ []));
+    /** Gradient end colour; overrides the preset's third stop. */
     to = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "to" }] : /* istanbul ignore next */ []));
+    /** Whether to animate a horizontal shimmer across the gradient. */
     animate = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "animate" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -7108,10 +7257,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
  * Provide the title via the `heading` input or by projecting content.
  */
 class BuiPageHeader {
+    /** Title text rendered in the heading (alternative to projecting content). */
     heading = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "heading" }] : /* istanbul ignore next */ []));
+    /** Optional supporting text shown beneath the heading. */
     description = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []));
+    /** Whether to render a bottom border separating the header from the page. */
     separator = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "separator" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -7159,12 +7311,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A styled blockquote / testimonial with optional attribution (author, role, avatar). */
 class BuiQuote {
+    /** Name of the person credited in the attribution. */
     author = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "author" }] : /* istanbul ignore next */ []));
+    /** Role or title shown beneath the author. */
     role = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "role" }] : /* istanbul ignore next */ []));
+    /** URL of the author's avatar image. */
     avatar = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "avatar" }] : /* istanbul ignore next */ []));
+    /** Source URL for the quote, set as the blockquote's `cite` attribute. */
     cite = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "cite" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -7256,18 +7412,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
                 }]
         }], propDecorators: { author: [{ type: i0.Input, args: [{ isSignal: true, alias: "author", required: false }] }], role: [{ type: i0.Input, args: [{ isSignal: true, alias: "role", required: false }] }], avatar: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatar", required: false }] }], cite: [{ type: i0.Input, args: [{ isSignal: true, alias: "cite", required: false }] }], userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
 
-const SIZES$2 = { sm: 'text-sm', default: 'text-base', lg: 'text-2xl' };
+const SIZES$1 = { sm: 'text-sm', default: 'text-base', lg: 'text-2xl' };
 const COMPARE_SIZES = { sm: 'text-xs', default: 'text-sm', lg: 'text-base' };
 /** A price display with optional compare-at (strikethrough) and a discount badge. */
 class BuiPrice {
+    /** Current price amount to display. */
     amount = input(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "amount" }] : /* istanbul ignore next */ []));
+    /** Original price; when higher than amount, shows as struck-through. */
     compareAt = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "compareAt" }] : /* istanbul ignore next */ []));
+    /** Currency symbol prefixed to each value. */
     currency = input('$', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "currency" }] : /* istanbul ignore next */ []));
+    /** Text size preset for the price. */
     size = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** Whether to show the percentage-off discount badge when on sale. */
     showDiscount = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "showDiscount" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -7283,7 +7444,7 @@ class BuiPrice {
             : 0;
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "discount" }] : /* istanbul ignore next */ []));
-    currentClass = computed(() => cn(SIZES$2[this.size()], this.onSale() ? 'text-emerald-700 dark:text-emerald-400' : 'text-foreground'), /* @ts-ignore */
+    currentClass = computed(() => cn(SIZES$1[this.size()], this.onSale() ? 'text-emerald-700 dark:text-emerald-400' : 'text-foreground'), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "currentClass" }] : /* istanbul ignore next */ []));
     compareClass = computed(() => cn(COMPARE_SIZES[this.size()], 'text-muted-foreground'), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "compareClass" }] : /* istanbul ignore next */ []));
@@ -7363,14 +7524,19 @@ const JUSTIFY = {
 };
 /** A flexbox stack layout helper (direction, gap, alignment). */
 class BuiStack {
+    /** Flex direction: vertical (`col`) or horizontal (`row`). */
     direction = input('col', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "direction" }] : /* istanbul ignore next */ []));
+    /** Spacing between items, as a Tailwind gap step. */
     gap = input('4', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "gap" }] : /* istanbul ignore next */ []));
+    /** Cross-axis alignment (`start`/`center`/`end`/`stretch`/`baseline`). */
     align = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
+    /** Main-axis distribution (`start`/`center`/`end`/`between`/`around`/`evenly`). */
     justify = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "justify" }] : /* istanbul ignore next */ []));
+    /** Whether items wrap onto multiple lines when they overflow. */
     wrap = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "wrap" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -7392,8 +7558,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
  * design tokens locally. Renders as `display: contents` so it adds no box.
  */
 class BuiAccent {
+    /** Accent color applied to the primary tokens; `null` leaves the theme unchanged. */
     color = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+    /** Foreground color paired with the accent for text/icons on accented surfaces. */
     foreground = input('#ffffff', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "foreground" }] : /* istanbul ignore next */ []));
     styleVars = computed(() => {
@@ -7439,23 +7607,28 @@ const COLORS = {
     offline: 'bg-gray-400',
 };
 const LABELS = { online: 'Online', away: 'Away', busy: 'Busy', offline: 'Offline' };
-const SIZES$1 = { sm: 'size-2', default: 'size-2.5', lg: 'size-3' };
+const SIZES = { sm: 'size-2', default: 'size-2.5', lg: 'size-3' };
 /** A small status dot (online/away/busy/offline). Status is never colour-only — the label is always present. */
 class BuiPresence {
+    /** Presence state, which sets the dot color and default label. */
     status = input('online', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "status" }] : /* istanbul ignore next */ []));
+    /** Size preset for the status dot. */
     size = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** Whether to show a pulsing ping animation (only when `online`). */
     pulse = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "pulse" }] : /* istanbul ignore next */ []));
+    /** Custom label text; defaults to the status name. */
     label = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /** Whether to render the label visibly; otherwise it stays screen-reader only. */
     showLabel = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "showLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
     colorClass = computed(() => COLORS[this.status()], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "colorClass" }] : /* istanbul ignore next */ []));
-    sizeClass = computed(() => SIZES$1[this.size()], /* @ts-ignore */
+    sizeClass = computed(() => SIZES[this.size()], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "sizeClass" }] : /* istanbul ignore next */ []));
     labelText = computed(() => this.label() || LABELS[this.status()], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "labelText" }] : /* istanbul ignore next */ []));
@@ -7519,10 +7692,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A single timeline entry: a dot + connector line and a content area. */
 class BuiTimelineItem {
+    /** Timestamp label shown above the entry's title. */
     time = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "time" }] : /* istanbul ignore next */ []));
+    /** Heading text for the entry. */
     title = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
+    /** Whether to highlight this entry as the current/active step. */
     active = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -7602,8 +7778,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A description list (`<dl>`). Children should be `bui-description-item`. */
 class BuiDescriptionList {
+    /** Arrangement of each item's term and description, side by side or stacked. */
     layout = input('horizontal', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []));
+    /** Whether to render a bordered card with dividers between items. */
     bordered = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "bordered" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -7624,6 +7802,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A term/description row. Inherits horizontal/bordered layout from its parent list. */
 class BuiDescriptionItem {
+    /** The term label shown in the row's `<dt>`. */
     term = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "term" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -7672,8 +7851,10 @@ const GAPS = {
 };
 /** A Pinterest-style masonry grid using native CSS multi-column layout. */
 class BuiMasonry {
+    /** Maximum number of columns at the widest breakpoint (1-6, responsive). */
     columns = input(3, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
+    /** Spacing between items, as a Tailwind spacing key ('0', '2', '3', '4', '6', '8'). */
     gap = input('4', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "gap" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -7697,6 +7878,7 @@ const COLUMNS$1 = {
 };
 /** A bento grid container. Use `bui-bento-item` for cells. */
 class BuiBentoGrid {
+    /** Number of columns at the largest breakpoint (2, 3 or 4). */
     columns = input(3, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -7717,12 +7899,16 @@ const COL_SPAN = { 1: '', 2: 'lg:col-span-2', 3: 'lg:col-span-3' };
 const ROW_SPAN = { 1: '', 2: 'row-span-2' };
 /** A bento grid cell with optional title/description and configurable span. */
 class BuiBentoItem {
+    /** Optional heading rendered above the projected content. */
     title = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
+    /** Optional muted description rendered below the title. */
     description = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []));
+    /** How many grid columns the cell spans (1-3). */
     colSpan = input(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "colSpan" }] : /* istanbul ignore next */ []));
+    /** How many grid rows the cell spans (1-2). */
     rowSpan = input(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "rowSpan" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -7766,10 +7952,13 @@ const COLUMNS = {
 };
 /** A responsive thumbnail grid. */
 class BuiGallery {
+    /** Images to display, given as URLs or `GalleryImage` objects. */
     images = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "images" }] : /* istanbul ignore next */ []));
+    /** Number of grid columns (1-6). */
     columns = input(3, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
+    /** Tailwind class controlling thumbnail corner rounding. */
     rounded = input('rounded-lg', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "rounded" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -7803,10 +7992,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A veil with a spinner shown over its projected content while `show` is true. */
 class BuiLoadingOverlay {
+    /** Whether the loading veil is shown over the projected content. */
     show = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "show" }] : /* istanbul ignore next */ []));
+    /** Text shown beneath the spinner; defaults to "Loading…" when empty. */
     message = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "message" }] : /* istanbul ignore next */ []));
+    /** Whether the veil blurs the content behind it. */
     blur = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "blur" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -7896,22 +8088,31 @@ const INPUT_SIZE = {
 };
 /** A numeric stepper: − / + buttons around a number field, with min/max/step clamping. */
 class BuiNumberInput {
+    /** Current number. Two-way bindable with `[(value)]`. */
     value = model(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Minimum allowed value, or null for no lower bound. */
     min = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
+    /** Maximum allowed value, or null for no upper bound. */
     max = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
+    /** Amount added or subtracted per step. */
     stepBy = input(1, { ...(ngDevMode ? { debugName: "stepBy" } : /* istanbul ignore next */ {}), alias: 'step' });
+    /** Whether the control is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /** Size preset controlling stepper button and field dimensions. */
     size = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the number field. */
     ariaLabel = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label override for the decrease button. */
     decreaseLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "decreaseLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label override for the increase button. */
     increaseLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "increaseLabel" }] : /* istanbul ignore next */ []));
     decreaseText = buiLabel('numberInputDecrease', this.decreaseLabel);
@@ -8093,14 +8294,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A radio-group of product variants, rendered as pills or colour swatches. */
 class BuiVariantSelector {
+    /** Selected variant value. Two-way bindable with `[(value)]`. */
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Available options, as plain strings or `VariantOption` objects. */
     options = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
+    /** Render style: text pills or colour swatches. */
     type = input('pill', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the radio group. */
     label = input('Variant', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /** Whether the whole group is disabled. */
     disabled = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -8219,16 +8425,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A tiny inline SVG trend chart (line + optional area). Pure, SSR-safe. */
 class BuiSparkline {
+    /** Numeric series to plot; needs at least two points to render. */
     data = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
+    /** SVG width in pixels. */
     width = input(100, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
+    /** SVG height in pixels. */
     height = input(28, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
+    /** Whether to draw the translucent area fill under the line. */
     area = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "area" }] : /* istanbul ignore next */ []));
+    /** Line stroke width in pixels (also used as edge padding). */
     strokeWidth = input(1.5, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "strokeWidth" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the sparkline's `aria-label`. */
     ariaLabel = input('Trend', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -8332,23 +8544,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
                 }]
         }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], area: [{ type: i0.Input, args: [{ isSignal: true, alias: "area", required: false }] }], strokeWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "strokeWidth", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
 
-const SIZES = { default: 'h-9 px-4 py-2', sm: 'h-8 gap-1.5 px-3', lg: 'h-10 px-6' };
 /** A stateful add-to-cart button: idle → adding → added → idle. Emits `triggered` on click. */
 class BuiAddToCart {
+    /** Button text shown in the idle and adding states. */
     label = input('Add to cart', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /** Button text shown briefly in the added (success) state. */
     addedLabel = input('Added', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "addedLabel" }] : /* istanbul ignore next */ []));
+    /** Size preset controlling height and padding. */
     size = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Emitted when the button is clicked to add the item. */
     triggered = output();
     state = signal('idle', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
     timers = [];
-    btnClass = computed(() => cn('inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium transition-all outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:opacity-90', SIZES[this.size()], this.state() === 'added'
-        ? 'bg-emerald-600 text-white'
-        : 'bg-primary text-primary-foreground hover:bg-primary/90', this.userClass()), /* @ts-ignore */
+    // Composes the button's styling (single source of truth via `buttonVariants`); the busy/added
+    // states only recolor on top — tailwind-merge drops the conflicting base background.
+    btnClass = computed(() => cn(buttonVariants({ size: this.size() }), 'disabled:opacity-90', this.state() === 'added' ? 'bg-emerald-600 text-white hover:bg-emerald-600' : '', this.userClass()), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "btnClass" }] : /* istanbul ignore next */ []));
     add() {
         if (this.state() !== 'idle') {
@@ -8516,18 +8731,25 @@ const TEXT_COLORS = [
 ];
 /** A password field with a live strength meter and (optional) requirement checklist. */
 class BuiPasswordStrength {
+    /** Current password value. Two-way bindable with `[(password)]`. */
     password = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "password" }] : /* istanbul ignore next */ []));
+    /** Native `name` attribute for the input. */
     name = input('password', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    /** Input `id`; defaults to `name` when empty. */
     id = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
+    /** Placeholder text for the input. */
     placeholder = input('••••••••', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Whether the requirement checklist is shown. */
     showChecklist = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "showChecklist" }] : /* istanbul ignore next */ []));
+    /** Minimum length required to satisfy the length rule. */
     minLength = input(8, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "minLength" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the input. */
     label = input('Password', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -8705,31 +8927,44 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A product card: image, badge, wishlist, title, rating, price, and an action slot. */
 class BuiProductCard {
+    /** Product title shown as the card heading. */
     title = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
+    /** Optional link; when set the title becomes an anchor to this URL. */
     href = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "href" }] : /* istanbul ignore next */ []));
+    /** Source URL of the product image. */
     image = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "image" }] : /* istanbul ignore next */ []));
+    /** Alt text for the image; falls back to the title when empty. */
     imageAlt = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "imageAlt" }] : /* istanbul ignore next */ []));
+    /** Current price; hides the price block when null. */
     price = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "price" }] : /* istanbul ignore next */ []));
+    /** Original price for showing a strikethrough and discount. */
     compareAt = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "compareAt" }] : /* istanbul ignore next */ []));
+    /** Currency symbol prefixed to the price. */
     currency = input('$', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "currency" }] : /* istanbul ignore next */ []));
+    /** Badge text; auto-coloured for sale/new keywords. */
     badge = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "badge" }] : /* istanbul ignore next */ []));
+    /** Small category label shown above the title. */
     category = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "category" }] : /* istanbul ignore next */ []));
+    /** Star rating value; hides the rating row when null. */
     rating = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "rating" }] : /* istanbul ignore next */ []));
+    /** Review count shown next to the rating, when set. */
     reviews = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "reviews" }] : /* istanbul ignore next */ []));
+    /** Whether to show the wishlist (heart) toggle button. */
     wishlist = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "wishlist" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label override for the wishlist toggle button. */
     wishlistLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "wishlistLabel" }] : /* istanbul ignore next */ []));
     wishlistText = buiLabel('productCardWishlist', this.wishlistLabel);
@@ -8916,16 +9151,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
  * span carries the full word list so assistive tech reads it once. SSR-safe.
  */
 class BuiTypewriter {
+    /** Words cycled through by the typewriter. */
     words = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "words" }] : /* istanbul ignore next */ []));
+    /** Delay between typed characters, in milliseconds. */
     typeSpeed = input(90, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "typeSpeed" }] : /* istanbul ignore next */ []));
+    /** Delay between deleted characters, in milliseconds. */
     deleteSpeed = input(40, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "deleteSpeed" }] : /* istanbul ignore next */ []));
+    /** Pause once a word is fully typed before deleting, in milliseconds. */
     pause = input(1600, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "pause" }] : /* istanbul ignore next */ []));
+    /** Whether to restart from the first word after the last. */
     loop = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "loop" }] : /* istanbul ignore next */ []));
+    /** Whether to show the blinking cursor after the text. */
     cursor = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "cursor" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -9022,14 +9263,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
  * an `aria-live` region carries the full passage up front. SSR-safe.
  */
 class BuiStreamingText {
+    /** Full passage to reveal; also announced up front via an `aria-live` region. */
     text = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
+    /** Delay in milliseconds between each revealed token. */
     speed = input(18, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "speed" }] : /* istanbul ignore next */ []));
+    /** Delay in milliseconds before streaming begins. */
     startDelay = input(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "startDelay" }] : /* istanbul ignore next */ []));
+    /** Granularity of the reveal — one character or one word at a time. */
     by = input('char', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "by" }] : /* istanbul ignore next */ []));
+    /** Whether to show a blinking caret while streaming. */
     caret = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "caret" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -9104,10 +9350,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A card whose border has a light beam continuously travelling around it. */
 class BuiBorderBeam {
+    /** Seconds for the beam to complete one full lap. */
     duration = input(6, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "duration" }] : /* istanbul ignore next */ []));
+    /** Beam colour; defaults to the primary theme colour. */
     color = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+    /** Border/beam thickness in pixels. */
     size = input(2, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -9140,8 +9389,10 @@ function pseudo(seed) {
 }
 /** Animated falling meteor streaks behind content. Decorative + SSR-safe. */
 class BuiMeteors {
+    /** Number of meteor streaks to render. */
     count = input(20, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "count" }] : /* istanbul ignore next */ []));
+    /** Meteor colour; defaults to a translucent foreground tint. */
     color = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -9199,8 +9450,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** An animated aurora / northern-lights gradient background with content overlaid. */
 class BuiAurora {
+    /** Blur radius of the aurora layer in pixels. */
     blur = input(60, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "blur" }] : /* istanbul ignore next */ []));
+    /** Seconds for one full drift animation cycle. */
     speed = input(12, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "speed" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -9226,14 +9479,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A seamless infinite scroll of `items` (logos, badges, testimonials…). */
 class BuiMarquee {
+    /** Items rendered in sequence and scrolled seamlessly. */
     items = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
+    /** Scroll direction; `up`/`down` switch the marquee to a vertical track. */
     direction = input('left', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "direction" }] : /* istanbul ignore next */ []));
+    /** Time for one full loop, as a CSS duration (e.g. `40s`). */
     duration = input('40s', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "duration" }] : /* istanbul ignore next */ []));
+    /** Spacing between items, as a CSS length. */
     gap = input('1rem', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "gap" }] : /* istanbul ignore next */ []));
+    /** Whether hovering pauses the scroll animation. */
     pauseOnHover = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "pauseOnHover" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -9313,6 +9571,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A mobile bottom tab bar. Use `[buiBottomNavItem]` on each `<a>`/`<button>`. */
 class BuiBottomNavigation {
+    /** Accessible label applied to the navigation element. */
     ariaLabel = input('Bottom navigation', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -9335,10 +9594,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A single bottom-navigation tab. Project the icon; pass `label`, `active`, `badge`. */
 class BuiBottomNavigationItem {
+    /** Caption shown beneath the projected icon; hidden when empty. */
     label = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /** Whether this tab is the current page; sets `aria-current="page"`. */
     active = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
+    /** Badge content; `true` renders a dot, a string/number renders a count, `null` shows nothing. */
     badge = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "badge" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -9397,6 +9659,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
  * viewport. Server-renders fully revealed (no-JS safe). SSR-safe.
  */
 class BuiTextReveal {
+    /** Text split into words that brighten one by one as it scrolls into view. */
     text = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -9456,8 +9719,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** Shifts its content relative to scroll for a depth/parallax effect. SSR-safe. */
 class BuiParallax {
+    /** Parallax intensity; higher moves content more per scroll. */
     speed = input(0.3, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "speed" }] : /* istanbul ignore next */ []));
+    /** Axis along which the content shifts. */
     axis = input('y', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "axis" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -9502,9 +9767,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A "on this page" nav that highlights the section currently in view (IntersectionObserver). */
 class BuiScrollspy {
+    /** Sections to track; each item links to and observes its `href` anchor. */
     items = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label for the nav element; falls back to a localized default. */
     label = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
     labelText = buiLabel('scrollspy', this.label);
@@ -9597,18 +9864,25 @@ const noop$8 = () => { };
 const SELECT_CLASS = 'h-9 rounded-md border border-input bg-background px-2 text-sm shadow-xs outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50';
 /** A styled time field: a native `<input type="time">`, or hour/minute selects in `select` mode. */
 class BuiTimeField {
+    /** Selected time as `HH:mm`. Two-way bindable with `[(value)]`. */
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Native `name` attribute for the input. */
     name = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    /** Native `id` attribute for the input. */
     id = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
+    /** Earliest allowed time (`HH:mm`) in `input` mode. */
     min = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
+    /** Latest allowed time (`HH:mm`) in `input` mode. */
     max = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
+    /** Whether to include seconds in `input` mode. */
     seconds = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "seconds" }] : /* istanbul ignore next */ []));
+    /** Whether the field is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     /** `select` renders hour + minute dropdowns instead of a native time input. */
@@ -9617,6 +9891,7 @@ class BuiTimeField {
     /** Minute step used in `select` mode. */
     minuteStep = input(5, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "minuteStep" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the field. */
     ariaLabel = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -9767,10 +10042,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A group of toggle buttons (single or multiple selection). Use `button[buiToggleGroupItem]`. */
 class BuiToggleGroup {
+    /** Selection mode: single value or an array of values. */
     type = input('single', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
+    /** Selected value(s). Two-way bindable with `[(value)]`. */
     value = model(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Layout direction of the group. */
     orientation = input('horizontal', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -9816,8 +10094,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A single item within a `bui-toggle-group`. */
 class BuiToggleGroupItem {
+    /** Value this item contributes to the parent group's selection. */
     value = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Whether this item is disabled. */
     disabled = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -9850,12 +10130,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 const noop$7 = () => { };
 /** A free-text tags input: type and press Enter (or comma) to add chips; Backspace removes. */
 class BuiTagsInput {
+    /** Current tags. Two-way bindable with `[(tags)]`. */
     tags = model([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "tags" }] : /* istanbul ignore next */ []));
+    /** Placeholder text shown in the entry field. */
     placeholder = input('Add tag…', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Maximum number of tags allowed, or `null` for no limit. */
     max = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
+    /** Whether the input is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -9980,10 +10264,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** Click-to-edit inline text: shows a value, swaps to an input on click. Enter commits, Escape cancels. */
 class BuiEditable {
+    /** Current text. Two-way bindable with `[(value)]`. */
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Text shown when the value is empty. */
     placeholder = input('Empty', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Noun used in the field's accessible label. */
     label = input('value', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
     /** Edit in a multi-line textarea instead of a single-line input. */
@@ -10110,10 +10397,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A floating action button that expands to a stack of actions. Closes on Escape / outside click. */
 class BuiSpeedDial {
+    /** Actions revealed when the dial expands. */
     actions = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "actions" }] : /* istanbul ignore next */ []));
+    /** Direction the action stack expands relative to the trigger button. */
     direction = input('up', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "direction" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the trigger button. */
     label = input('Open actions', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -10244,18 +10534,25 @@ const CIRC = 2 * Math.PI * RADIUS;
 const ARC = CIRC * 0.75;
 /** A rotary dial input (role="slider"). Drag, scroll, or use the keyboard. 270° sweep. */
 class BuiKnob {
+    /** Current value. Two-way bindable with `[(value)]`. */
     value = model(50, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Minimum value at the start of the dial's sweep. */
     min = input(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
+    /** Maximum value at the end of the dial's sweep. */
     max = input(100, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
+    /** Increment applied per arrow key, scroll or drag snap. */
     step = input(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "step" }] : /* istanbul ignore next */ []));
+    /** Size preset controlling the knob's diameter and text size. */
     size = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** Accessible label announced for the slider. */
     label = input('Value', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /** Whether the knob is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -10500,16 +10797,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A lazy image with a blurred placeholder / skeleton and a graceful error state. */
 class BuiImage {
+    /** Source URL of the full image to load. */
     src = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
+    /** Alternative text for the image. */
     alt = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "alt" }] : /* istanbul ignore next */ []));
+    /** CSS `aspect-ratio` reserved for the image (e.g. `16 / 9`). */
     ratio = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ratio" }] : /* istanbul ignore next */ []));
+    /** URL of a low-res image shown blurred while the full image loads. */
     placeholder = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Tailwind class controlling corner rounding. */
     rounded = input('rounded-lg', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "rounded" }] : /* istanbul ignore next */ []));
+    /** How the image fills its box: `cover` crops, `contain` letterboxes. */
     fit = input('cover', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "fit" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -10615,10 +10918,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A collapsible "reasoning" / chain-of-thought disclosure. */
 class BuiReasoning {
+    /** Whether the disclosure is expanded. Two-way bindable with `[(open)]`. */
     open = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
+    /** Trigger label shown when no `duration` is set. */
     label = input('Reasoning', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /** When set, the trigger reads "Thought for {duration}" instead of `label`. */
     duration = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "duration" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -10705,14 +11011,19 @@ const STATUS = {
 };
 /** An AI tool-call card with a status indicator and collapsible arguments / result. */
 class BuiToolCall {
+    /** Name of the invoked tool, shown as inline code in the header. */
     name = input('tool', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    /** Execution status; drives the colored status dot and label. */
     status = input('success', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "status" }] : /* istanbul ignore next */ []));
+    /** Tool arguments shown in the collapsible body when present. */
     args = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "args" }] : /* istanbul ignore next */ []));
+    /** Tool result shown in the collapsible body when present. */
     result = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "result" }] : /* istanbul ignore next */ []));
+    /** Whether the arguments/result panel is expanded. Two-way bindable with `[(open)]`. */
     open = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -10814,6 +11125,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A scrollable conversation log (`role="log"`). Use `bui-chat-message` for bubbles. */
 class BuiChat {
+    /** Accessible label announced for the conversation log region. */
     ariaLabel = input('Conversation', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -10839,14 +11151,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A chat bubble. `role="user"` aligns end with a primary bubble; otherwise assistant-styled. */
 class BuiChatMessage {
+    /** Author role; `'user'` aligns the bubble to the end with primary styling, else assistant-styled. */
     role = input('assistant', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "role" }] : /* istanbul ignore next */ []));
+    /** Display name shown above the bubble; also seeds the fallback initials avatar. */
     name = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    /** Optional timestamp text shown beside the name. */
     time = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "time" }] : /* istanbul ignore next */ []));
+    /** Avatar image URL; when empty, initials (or an emoji) are shown instead. */
     avatar = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "avatar" }] : /* istanbul ignore next */ []));
+    /** When true, shows an animated typing indicator instead of the message content. */
     typing = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "typing" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -10960,10 +11277,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 const PALETTE$1 = ['#6366f1', '#ec4899', '#f59e0b', '#10b981', '#3b82f6', '#ef4444'];
 /** A celebratory particle burst. Project a trigger (or use the default button) to fire it. */
 class BuiConfetti {
+    /** Number of particles emitted per burst. */
     count = input(80, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "count" }] : /* istanbul ignore next */ []));
+    /** Horizontal spread factor of the burst. */
     spread = input(70, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "spread" }] : /* istanbul ignore next */ []));
+    /** Particle colours; defaults to the built-in palette. */
     colors = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "colors" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -11048,8 +11368,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A step indicator. The `value` (1-based) marks the active step. Use `li[buiStepperItem]`. */
 class BuiStepper {
+    /** The active step as a 1-based index; items at lower values are marked completed. */
     value = input(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Layout direction of the steps, horizontal or vertical. */
     orientation = input('horizontal', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -11094,6 +11416,7 @@ const INDICATOR = {
 };
 /** A single step within a `bui-stepper`. Resolves completed/active/inactive from the parent. */
 class BuiStepperItem {
+    /** This item's 1-based position; compared against the parent's value to derive its state. */
     step = input(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "step" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -11189,17 +11512,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 const noop$5 = () => { };
 /** A one-time-password input: a row of single-character boxes with focus management + paste. */
 class BuiInputOtp {
+    /** Current code. Two-way bindable with `[(value)]`. */
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Number of character boxes (length of the code). */
     maxlength = input(6, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "maxlength" }] : /* istanbul ignore next */ []));
+    /** Whether the input is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /** Whether to allow letters as well as digits. */
     alphanumeric = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "alphanumeric" }] : /* istanbul ignore next */ []));
     /** Insert a visual separator after every N boxes (0 = none). */
     groupSize = input(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "groupSize" }] : /* istanbul ignore next */ []));
+    /** Base accessible label; each box appends its position. */
     ariaLabel = input('One-time password', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -11341,19 +11669,26 @@ const COUNTRIES = [
 ];
 /** A phone number field with a country-code selector. */
 class BuiPhoneInput {
+    /** Entered phone number. Two-way bindable with `[(value)]`. */
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Selected country code. Two-way bindable with `[(country)]`. */
     country = model('US', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "country" }] : /* istanbul ignore next */ []));
+    /** Name attribute applied to the number input for form submission. */
     name = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    /** Id attribute applied to the number input. */
     id = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
+    /** Placeholder text for the number input. */
     placeholder = input('Phone number', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label override for the country selector. */
     countryLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "countryLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label override for the number input. */
     numberLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "numberLabel" }] : /* istanbul ignore next */ []));
     countryText = buiLabel('phoneInputCountry', this.countryLabel);
@@ -11423,20 +11758,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A chat composer: an autosizing textarea with a send button. Emits `submitted` on send. */
 class BuiPromptInput {
+    /** Current textarea content. Two-way bindable with `[(value)]`. */
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Placeholder text shown when the textarea is empty. */
     placeholder = input('Send a message…', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Whether to show the attachment button. */
     attachable = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "attachable" }] : /* istanbul ignore next */ []));
+    /** Disables the textarea and send button. */
     disabled = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the message textarea. */
     ariaLabel = input('Message', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    /** Overrides the localized accessible label for the attachment button. */
     attachLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "attachLabel" }] : /* istanbul ignore next */ []));
+    /** Overrides the localized accessible label for the send button. */
     sendLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "sendLabel" }] : /* istanbul ignore next */ []));
+    /** Emitted with the trimmed message text when the user sends. */
     submitted = output();
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
     attachText = buiLabel('promptInputAttach', this.attachLabel);
@@ -11606,6 +11949,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A contribution-style heatmap grid (7 rows). Pass `data` or get a deterministic demo. */
 class BuiHeatmap {
+    /** Per-cell counts filled column-first; empty yields a demo dataset. */
     data = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
     /** Smaller cells + tighter gaps. */
@@ -11682,12 +12026,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** An inline citation marker that reveals a source popover on hover / focus / click. */
 class BuiCitation {
+    /** Citation number shown in the inline `[n]` marker. */
     index = input(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "index" }] : /* istanbul ignore next */ []));
+    /** Source title shown at the top of the popover. */
     title = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
+    /** Source URL; its hostname is derived and shown in the popover. */
     url = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "url" }] : /* istanbul ignore next */ []));
+    /** Short excerpt from the source shown in the popover. */
     snippet = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "snippet" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -11809,8 +12157,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A two-panel resizable group. Hosts the shared size; the handle drags it. */
 class BuiResizablePanelGroup {
+    /** Layout axis the panels are arranged and resized along. */
     direction = input('horizontal', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "direction" }] : /* istanbul ignore next */ []));
+    /** Size of the primary panel as a percentage (10-90). Two-way bindable with `[(size)]`. */
     size = model(50, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -11860,6 +12210,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A panel inside a `bui-resizable-panel-group`. Mark one `primary` to make it the sized panel. */
 class BuiResizablePanel {
+    /** Whether this is the sized panel driven by the group's `size`; the other panel flexes. */
     primary = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "primary" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -11883,8 +12234,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** The draggable divider between two resizable panels. */
 class BuiResizableHandle {
+    /** Whether to render a visible grip indicator on the divider. */
     withHandle = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "withHandle" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the handle; falls back to a localized default. */
     ariaLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -11945,23 +12298,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A styled HTML5 video with a poster + play-button facade. */
 class BuiVideo {
+    /** Video source URL for the underlying `<video>` element. */
     src = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
+    /** Poster image URL shown before playback starts. */
     poster = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "poster" }] : /* istanbul ignore next */ []));
+    /** Aspect ratio: `video` (16/9), `square` (1/1), or any CSS ratio. */
     aspect = input('video', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "aspect" }] : /* istanbul ignore next */ []));
+    /** Whether to show native controls once playback has started. */
     controls = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "controls" }] : /* istanbul ignore next */ []));
+    /** Whether to start playing automatically (hides the play facade). */
     autoplay = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "autoplay" }] : /* istanbul ignore next */ []));
+    /** Whether the video loops when it reaches the end. */
     loop = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "loop" }] : /* istanbul ignore next */ []));
+    /** Whether the video starts muted. */
     muted = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "muted" }] : /* istanbul ignore next */ []));
+    /** Tailwind border-radius utility applied to the container. */
     rounded = input('rounded-xl', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "rounded" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label override for the play-button facade. */
     playLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "playLabel" }] : /* istanbul ignore next */ []));
     playText = buiLabel('videoPlay', this.playLabel);
@@ -12088,15 +12450,20 @@ const DEFAULT_SWATCHES = [
 ];
 /** A colour picker: a native colour well, a hex field, and a swatch palette. */
 class BuiColorPicker {
+    /** Selected color as a hex string. Two-way bindable with `[(value)]`. */
     value = model('#6366f1', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Custom swatch palette; falls back to a built-in set when null. */
     swatches = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "swatches" }] : /* istanbul ignore next */ []));
+    /** Whether the picker is disabled. */
     disabled = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label for the native color well. */
     pickLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "pickLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the hex text field. */
     hexLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "hexLabel" }] : /* istanbul ignore next */ []));
     pickText = buiLabel('colorPickerPick', this.pickLabel);
@@ -12197,14 +12564,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A GDPR cookie banner. Persists the choice in localStorage (skipped in `demo` mode). */
 class BuiCookieConsent {
+    /** Consent message shown to the user. */
     message = input('We use cookies to enhance your experience.', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "message" }] : /* istanbul ignore next */ []));
+    /** When true, always shows the banner and skips reading/writing localStorage. */
     demo = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "demo" }] : /* istanbul ignore next */ []));
+    /** localStorage key under which the accept/decline choice is persisted. */
     storageKey = input('bui-cookie-consent', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "storageKey" }] : /* istanbul ignore next */ []));
+    /** Emitted with `true` when the user accepts and `false` when they decline. */
     decided = output();
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Overrides the localized accessible label for the consent region. */
     ariaLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
     ariaLabelText = buiLabel('cookieConsent', this.ariaLabel);
@@ -12287,12 +12659,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
  * "Load more" button is pressed. Drive `loading` / `finished` from the consumer. SSR-safe.
  */
 class BuiInfiniteScroll {
+    /** Whether a load is in progress; shows the spinner and suppresses new emits. */
     loading = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
+    /** Whether all items are loaded; shows the end message and suppresses emits. */
     finished = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "finished" }] : /* istanbul ignore next */ []));
+    /** Pixel margin below the viewport at which the sentinel triggers loading. */
     threshold = input(200, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "threshold" }] : /* istanbul ignore next */ []));
+    /** Emits when the sentinel scrolls into view or the fallback button is pressed. */
     more = output();
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
     sentinel = viewChild('sentinel', /* @ts-ignore */
@@ -12417,26 +12793,35 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A compact audio player around a native `<audio>`: play/pause, seek, time, mute. */
 class BuiAudioPlayer {
+    /** Audio source URL for the underlying `<audio>` element. */
     src = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
+    /** Track title shown next to the controls. */
     title = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
+    /** Artist name shown under the title. */
     artist = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "artist" }] : /* istanbul ignore next */ []));
+    /** Whether to start playback automatically once loaded. */
     autoplay = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "autoplay" }] : /* istanbul ignore next */ []));
     /** Condensed layout: hides the title block and mute button. */
     compact = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "compact" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label override for the seek slider. */
     seekLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "seekLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label override for the play button. */
     playLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "playLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label override for the pause button. */
     pauseLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "pauseLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label override for the mute button. */
     muteLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "muteLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label override for the unmute button. */
     unmuteLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "unmuteLabel" }] : /* istanbul ignore next */ []));
     seekText = buiLabel('audioPlayerSeek', this.seekLabel);
@@ -12646,8 +13031,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A canvas signature pad with draw, undo and clear. SSR-safe (canvas set up in the browser). */
 class BuiSignaturePad {
+    /** Canvas height in pixels. */
     height = input(200, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
+    /** Stroke color; falls back to the current text color when empty. */
     penColor = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "penColor" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -12804,11 +13191,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A macOS-style dock with a cursor-following fisheye magnify. Use `bui-dock-item` tiles. */
 class BuiDock {
+    /** Maximum scale factor applied to the tile directly under the cursor. */
     magnify = input(1.6, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "magnify" }] : /* istanbul ignore next */ []));
+    /** Pixel radius around the cursor within which tiles are magnified. */
     distance = input(120, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "distance" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label for the dock navigation; falls back to the i18n default. */
     label = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
     labelText = buiLabel('dock', this.label);
@@ -12860,6 +13250,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A magnifying tile inside a `bui-dock`. */
 class BuiDockItem {
+    /** Whether to show the active indicator dot beneath the tile. */
     active = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -12916,8 +13307,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A single tree row; renders its own children recursively. */
 class BuiTreeNode {
+    /** Node data for this row, including its label and children. */
     item = input.required(/* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "item" }] : /* istanbul ignore next */ []));
+    /** Depth of this node, used for indentation and `aria-level` (root is 1). */
     level = input(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "level" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -13027,8 +13420,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A collapsible, data-driven hierarchical tree (`role="tree"`). */
 class BuiTree {
+    /** Root nodes of the tree to render. */
     items = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the tree's root element. */
     ariaLabel = input('Tree', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -13061,16 +13456,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A dynamic list of repeatable form rows with add/remove and min/max bounds. */
 class BuiRepeater {
+    /** Column definitions rendered for every row. */
     fields = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "fields" }] : /* istanbul ignore next */ []));
+    /** Row data keyed by field key. Two-way bindable with `[(rows)]`. */
     rows = model([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
+    /** Minimum number of rows that must remain (remove is disabled at this count). */
     min = input(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
+    /** Maximum number of rows allowed, or null for unlimited. */
     max = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
+    /** Text shown on the add-row button. */
     addLabel = input('Add row', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "addLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label override for the remove-row buttons. */
     removeLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "removeLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -13242,17 +13643,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A bell trigger with a dropdown feed of notifications and an unread badge. */
 class BuiNotificationCenter {
+    /** Notification items rendered in the dropdown feed. */
     notifications = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "notifications" }] : /* istanbul ignore next */ []));
+    /** Whether the dropdown is open. Two-way bindable with `[(open)]`. */
     open = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label for the trigger and dropdown region. */
     ariaLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label announced for the per-item unread dot. */
     unreadLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "unreadLabel" }] : /* istanbul ignore next */ []));
+    /** Label for the "mark all as read" action button. */
     markAllReadLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "markAllReadLabel" }] : /* istanbul ignore next */ []));
+    /** Text shown when there are no notifications. */
     emptyLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "emptyLabel" }] : /* istanbul ignore next */ []));
     ariaText = buiLabel('notificationCenter', this.ariaLabel);
@@ -13423,10 +13830,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A single JSON node; renders nested objects/arrays recursively. */
 class BuiJsonViewerNode {
+    /** Arbitrary JSON value rendered by this node. */
     value = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Object key or array index labeling this node, or null at the root. */
     keyName = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "keyName" }] : /* istanbul ignore next */ []));
+    /** Whether this node starts expanded. */
     expanded = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "expanded" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -13608,8 +14018,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A collapsible JSON tree viewer. Accepts an object/array or a JSON string. */
 class BuiJsonViewer {
+    /** Arbitrary JSON value to render; a string is parsed as JSON when possible. */
     data = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
+    /** Whether nodes start expanded. */
     expanded = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "expanded" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -13643,6 +14055,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A single org-chart node (a card + recursive children). Rendered on an `<li>`. */
 class BuiOrgChartNode {
+    /** Node rendered as a card, with its `children` recursed into nested `<li>`s. */
     node = input.required(/* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "node" }] : /* istanbul ignore next */ []));
     children = computed(() => this.node().children ?? [], /* @ts-ignore */
@@ -13719,6 +14132,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A top-down organizational chart with pure-CSS connectors. Recursively renders nodes. */
 class BuiOrgChart {
+    /** Root node of the tree to render; `null` renders nothing. */
     node = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "node" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -13746,15 +14160,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A cart trigger with an item-count badge and a dropdown with line items + subtotal. */
 class BuiMiniCart {
+    /** Line items in the cart, used for count and subtotal. */
     items = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
+    /** Currency symbol prefixed to prices and subtotal. */
     currency = input('$', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "currency" }] : /* istanbul ignore next */ []));
+    /** Whether the dropdown is open. Two-way bindable with `[(open)]`. */
     open = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label override for the cart trigger button. */
     triggerLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "triggerLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label override for the cart dropdown dialog. */
     label = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
     triggerText = buiLabel('miniCartTrigger', this.triggerLabel);
@@ -13935,12 +14354,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** An SVG beam connecting two elements (by selector) with a travelling light. SSR-safe. */
 class BuiAnimatedBeam {
+    /** CSS selector of the element the beam starts from. */
     from = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "from" }] : /* istanbul ignore next */ []));
+    /** CSS selector of the element the beam ends at. */
     to = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "to" }] : /* istanbul ignore next */ []));
+    /** Upward bow of the connecting curve in pixels. */
     curvature = input(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "curvature" }] : /* istanbul ignore next */ []));
+    /** Seconds for the travelling light to traverse the beam. */
     duration = input(3, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "duration" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -14078,10 +14501,13 @@ const ROW_CLASS = {
 const SIGN = { same: ' ', add: '+', del: '-' };
 /** A line-by-line text diff (LCS) rendered with +/- gutters. */
 class BuiDiffViewer {
+    /** Original text; lines removed relative to `after` are marked deleted. */
     before = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "before" }] : /* istanbul ignore next */ []));
+    /** Updated text; lines added relative to `before` are marked added. */
     after = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "after" }] : /* istanbul ignore next */ []));
+    /** Optional filename shown in the header above the diff. */
     filename = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "filename" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -14150,11 +14576,14 @@ const ALIGN$2 = {
 };
 /** A table whose rows can nest and expand/collapse (flattened to visible rows). */
 class BuiTreeTable {
+    /** Column definitions in display order. */
     columns = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
+    /** Top-level rows, each able to nest children via `children`. */
     rows = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label for the expand/collapse toggle button. */
     toggleLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "toggleLabel" }] : /* istanbul ignore next */ []));
     toggleText = buiLabel('treeTableToggle', this.toggleLabel);
@@ -14351,12 +14780,16 @@ function renderMarkdown(markdown) {
 }
 /** A markdown textarea with a live, sanitized HTML preview. */
 class BuiMarkdownEditor {
+    /** Markdown source text. Two-way bindable with `[(value)]`. */
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Name attribute applied to the textarea for form submission. */
     name = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    /** Placeholder text shown while the textarea is empty. */
     placeholder = input('Write markdown…', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Number of visible rows in the write textarea. */
     rows = input(8, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -14444,6 +14877,7 @@ function isoOf(date) {
  * Render several months side by side with `months`. SSR-safe.
  */
 class BuiCalendar {
+    /** Selected day (mode="single") as `yyyy-mm-dd`. Two-way bindable with `[(value)]`. */
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
     /** Selection mode: `single` | `range` | `multiple`. */
@@ -14458,10 +14892,13 @@ class BuiCalendar {
     /** Number of month grids to render side by side. */
     months = input(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "months" }] : /* istanbul ignore next */ []));
+    /** First day of the week (0 = Sunday). */
     weekStart = input(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "weekStart" }] : /* istanbul ignore next */ []));
+    /** Earliest selectable date (`yyyy-mm-dd`). */
     minDate = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "minDate" }] : /* istanbul ignore next */ []));
+    /** Latest selectable date (`yyyy-mm-dd`). */
     maxDate = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "maxDate" }] : /* istanbul ignore next */ []));
     /** Specific ISO dates (yyyy-mm-dd) to disable. */
@@ -14479,15 +14916,20 @@ class BuiCalendar {
     /** Hide days that fall outside the current month. */
     hideOutsideDays = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "hideOutsideDays" }] : /* istanbul ignore next */ []));
+    /** Whether the whole calendar is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label for the previous-month button. */
     previousMonthLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "previousMonthLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the month dropdown. */
     monthSelectLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "monthSelectLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the year dropdown. */
     yearLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "yearLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the next-month button. */
     nextMonthLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "nextMonthLabel" }] : /* istanbul ignore next */ []));
     previousMonthText = buiLabel('calendarPreviousMonth', this.previousMonthLabel);
@@ -14928,6 +15370,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 const noop$3 = () => { };
 /** A date input that opens a calendar popover. */
 class BuiDatePicker {
+    /** Selected date (mode="single") as `yyyy-mm-dd`. Two-way bindable with `[(value)]`. */
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
     /** `single` (default) or `range`. */
@@ -14939,24 +15382,34 @@ class BuiDatePicker {
     /** Month grids shown in the popover (handy for range). */
     months = input(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "months" }] : /* istanbul ignore next */ []));
+    /** Text shown on the trigger when no date is selected. */
     placeholder = input('Pick a date', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Earliest selectable date (`yyyy-mm-dd`). */
     minDate = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "minDate" }] : /* istanbul ignore next */ []));
+    /** Latest selectable date (`yyyy-mm-dd`). */
     maxDate = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "maxDate" }] : /* istanbul ignore next */ []));
+    /** First day of the week (0 = Sunday). */
     weekStart = input(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "weekStart" }] : /* istanbul ignore next */ []));
+    /** Specific ISO dates (yyyy-mm-dd) to disable. */
     disabledDates = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabledDates" }] : /* istanbul ignore next */ []));
+    /** Disable Saturdays and Sundays. */
     disableWeekends = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disableWeekends" }] : /* istanbul ignore next */ []));
+    /** Show an ISO week-number column in the calendar. */
     showWeekNumbers = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "showWeekNumbers" }] : /* istanbul ignore next */ []));
+    /** `dropdown` swaps the month label for month + year selects. */
     captionLayout = input('label', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "captionLayout" }] : /* istanbul ignore next */ []));
+    /** Hide days that fall outside the current month. */
     hideOutsideDays = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "hideOutsideDays" }] : /* istanbul ignore next */ []));
+    /** Whether the picker is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -15129,18 +15582,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A slide carousel. Project slides as direct children; arrows + dots navigate. SSR-safe. */
 class BuiCarousel {
+    /** Zero-based index of the first visible slide; two-way bindable. */
     index = model(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "index" }] : /* istanbul ignore next */ []));
+    /** Scroll axis of the carousel. */
     orientation = input('horizontal', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
     /** Slides visible at once (e.g. 2 or 3 for a multi-item carousel). */
     perView = input(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "perView" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label override for the previous-slide button. */
     previousLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "previousLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label override for the next-slide button. */
     nextLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "nextLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label override (prefix) for the dot navigation buttons. */
     goToSlideLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "goToSlideLabel" }] : /* istanbul ignore next */ []));
     previousText = buiLabel('carouselPrevious', this.previousLabel);
@@ -15333,13 +15791,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A command palette: a filterable, keyboard-navigable list of grouped actions. */
 class BuiCommand {
+    /** Grouped commands shown in the palette and filtered as the user types. */
     groups = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "groups" }] : /* istanbul ignore next */ []));
+    /** Placeholder text for the search input. */
     placeholder = input('Type a command or search…', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
     /** Render a checkmark column; activating an item toggles its checked state. */
     checkable = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "checkable" }] : /* istanbul ignore next */ []));
+    /** Emits the chosen command when an item is activated (click or Enter). */
     selected = output();
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
     checkedValues = signal(new Set(), /* @ts-ignore */
@@ -15582,8 +16043,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A right-click context menu. Project the target; pass menu `items`. */
 class BuiContextMenu {
+    /** Items shown in the menu, in display order. */
     items = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
+    /** Emits the chosen item when a (non-separator) entry is activated. */
     selected = output();
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
     open = signal(false, /* @ts-ignore */
@@ -15840,23 +16303,32 @@ function cellText(value) {
 }
 /** A data table with search, sortable columns, row selection and pagination. */
 class BuiDataTable {
+    /** Column definitions that drive the headers, cell lookup and sort/search keys. */
     columns = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
+    /** Source data rows; each is a key/value map indexed by column keys. */
     rows = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
+    /** Whether to show the search box that filters rows across all columns. */
     searchable = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "searchable" }] : /* istanbul ignore next */ []));
+    /** Placeholder text for the search input. */
     searchPlaceholder = input('Search...', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "searchPlaceholder" }] : /* istanbul ignore next */ []));
+    /** Whether to render row checkboxes and the select-all header checkbox. */
     selectable = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "selectable" }] : /* istanbul ignore next */ []));
+    /** Number of rows displayed per page. */
     pageSize = input(5, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "pageSize" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label override for the search input. */
     searchLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "searchLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label override for the select-all checkbox. */
     selectAllLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "selectAllLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label override for each row's select checkbox. */
     selectRowLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "selectRowLabel" }] : /* istanbul ignore next */ []));
     searchText = buiLabel('dataTableSearch', this.searchLabel);
@@ -16161,14 +16633,19 @@ const WIDTH = 600;
 const PAD = 8;
 /** A lightweight SVG chart (line / area / bar). Pure + SSR-safe. */
 class BuiChart {
+    /** Chart render style: line, bar, or filled area. */
     type = input('line', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
+    /** Series to plot; bar charts use only the first series. */
     series = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "series" }] : /* istanbul ignore next */ []));
+    /** X-axis tick labels rendered below the chart. */
     labels = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "labels" }] : /* istanbul ignore next */ []));
+    /** Chart height in pixels (SVG viewBox height). */
     height = input(220, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the chart's `aria-label`. */
     label = input('Chart', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -16325,6 +16802,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 const noop$2 = () => { };
 /** A combined date + time picker in a popover. Value is `YYYY-MM-DDTHH:mm`. */
 class BuiDatetimePicker {
+    /** Selected date-time (mode="single") as `YYYY-MM-DDTHH:mm`. Two-way bindable with `[(value)]`. */
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
     /** `single` (default) or `range`. */
@@ -16336,16 +16814,22 @@ class BuiDatetimePicker {
     /** Month grids shown in the popover (handy for range). */
     months = input(1, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "months" }] : /* istanbul ignore next */ []));
+    /** Text shown on the trigger when nothing is selected. */
     placeholder = input('Pick date & time', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Earliest selectable date (`yyyy-mm-dd`). */
     minDate = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "minDate" }] : /* istanbul ignore next */ []));
+    /** Latest selectable date (`yyyy-mm-dd`). */
     maxDate = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "maxDate" }] : /* istanbul ignore next */ []));
+    /** `dropdown` swaps the month label for month + year selects. */
     captionLayout = input('label', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "captionLayout" }] : /* istanbul ignore next */ []));
+    /** Whether to include seconds in the time field. */
     seconds = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "seconds" }] : /* istanbul ignore next */ []));
+    /** Whether the picker is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -16576,23 +17060,31 @@ const AC_SIZE = {
 };
 /** A free-text input with a filtered suggestion list. */
 class BuiAutocomplete {
+    /** Current text in the input. Two-way bindable with `[(value)]`. */
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
     /** Pick several values, shown as removable chips; binds `values`. */
     multiple = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "multiple" }] : /* istanbul ignore next */ []));
+    /** Selected values shown as chips (multiple mode). Two-way bindable with `[(values)]`. */
     values = model([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "values" }] : /* istanbul ignore next */ []));
+    /** Suggestions to filter against the typed text. */
     options = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
+    /** Placeholder text for the input. */
     placeholder = input('Search...', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Message shown when no suggestion matches. */
     empty = input('No results found.', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "empty" }] : /* istanbul ignore next */ []));
+    /** Whether the input is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /** Native `name` attribute for the input. */
     name = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    /** Height and font size of the input. */
     size = input('default', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     /** Optional leading icon, given as an SVG path `d` string. */
@@ -16928,21 +17420,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A before/after image comparison with a draggable, keyboard-operable divider. */
 class BuiComparisonSlider {
+    /** Source URL of the "before" image (revealed on the left of the divider). */
     before = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "before" }] : /* istanbul ignore next */ []));
+    /** Source URL of the "after" image (shown on the right of the divider). */
     after = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "after" }] : /* istanbul ignore next */ []));
+    /** Caption badge shown over the "before" image; hidden when empty. */
     beforeLabel = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "beforeLabel" }] : /* istanbul ignore next */ []));
+    /** Caption badge shown over the "after" image; hidden when empty. */
     afterLabel = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "afterLabel" }] : /* istanbul ignore next */ []));
+    /** Alt text for the "before" image. */
     beforeAlt = input('Before', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "beforeAlt" }] : /* istanbul ignore next */ []));
+    /** Alt text for the "after" image. */
     afterAlt = input('After', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "afterAlt" }] : /* istanbul ignore next */ []));
+    /** Divider position as a percentage (0-100); two-way bindable. */
     value = model(50, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Accessible label override for the range slider. */
     positionLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "positionLabel" }] : /* istanbul ignore next */ []));
     positionText = buiLabel('comparisonSliderPosition', this.positionLabel);
@@ -17046,20 +17546,28 @@ function formatSize(bytes) {
 }
 /** A drag-and-drop file upload zone with a selected-files list. */
 class BuiFileUpload {
+    /** Whether multiple files can be selected and accumulated. */
     multiple = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "multiple" }] : /* istanbul ignore next */ []));
+    /** Comma-separated list of accepted file types (the `accept` attribute). */
     accept = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "accept" }] : /* istanbul ignore next */ []));
+    /** Native `name` attribute for the file input. */
     name = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    /** Optional helper text shown under the dropzone label. */
     hint = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
+    /** Whether the upload zone is disabled. */
     disabled = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /** Emitted with the current file list whenever the selection changes. */
     filesChange = output();
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Custom dropzone prompt text. */
     dropzoneLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "dropzoneLabel" }] : /* istanbul ignore next */ []));
+    /** Custom accessible label for each remove button. */
     removeLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "removeLabel" }] : /* istanbul ignore next */ []));
     dropzoneText = buiLabel('fileUploadDropzone', this.dropzoneLabel);
@@ -17251,13 +17759,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
  * or with `top-progress:start` / `top-progress:set` / `top-progress:done` window events.
  */
 class BuiTopProgress {
+    /** CSS color (or gradient) used to fill the bar. */
     color = input('var(--color-primary, #6366f1)', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+    /** Bar thickness in pixels. */
     height = input(2, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
+    /** When true, renders inline within its container instead of fixed at the top of the viewport. */
     demo = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "demo" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+    /** Overrides the localized accessible progressbar label. */
     ariaLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
     ariaLabelText = buiLabel('topProgressLoading', this.ariaLabel);
@@ -17368,10 +17880,13 @@ const POSITION$1 = {
 };
 /** A slide-in panel anchored to a screen edge. Toggle with the `open` model. */
 class BuiDrawer {
+    /** Whether the drawer is open. Two-way bindable with `[(open)]`. */
     open = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
+    /** Screen edge the drawer is anchored to and slides in from. */
     direction = input('bottom', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "direction" }] : /* istanbul ignore next */ []));
+    /** Accessible label applied to the drawer dialog. */
     ariaLabel = input('Drawer', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -17456,16 +17971,22 @@ function applyMask$1(value, mask) {
 }
 /** A text input that formats its value against a mask (9 = digit, a = letter, * = alnum). */
 class BuiInputMask {
+    /** Mask pattern where `9` accepts a digit, `a` a letter, `*` an alphanumeric, and other chars are literals. */
     mask = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "mask" }] : /* istanbul ignore next */ []));
+    /** Current masked value. Two-way bindable with `[(value)]`. */
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Placeholder text shown when the input is empty. */
     placeholder = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Value for the native `inputmode` attribute hinting the virtual keyboard. */
     inputmode = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "inputmode" }] : /* istanbul ignore next */ []));
+    /** Name attribute applied to the underlying input for form submission. */
     name = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    /** Whether the input is disabled. Two-way bindable with `[(disabled)]`. */
     disabled = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -17539,10 +18060,13 @@ const SIDE = {
 };
 /** A sheet overlay sliding in from a screen edge. Toggle with the `open` model. */
 class BuiSheet {
+    /** Whether the sheet is open. Two-way bindable with `[(open)]`. */
     open = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
+    /** Screen edge the sheet slides in from. */
     side = input('right', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "side" }] : /* istanbul ignore next */ []));
+    /** Accessible label applied to the sheet dialog. */
     ariaLabel = input('Sheet', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -17629,10 +18153,13 @@ const TONE = {
 };
 /** The toast viewport. Drives off the {@link BuiToaster} store. */
 class BuiSonner {
+    /** Viewport corner where toasts stack (e.g. `top-left`, `bottom-right`). */
     position = input('bottom-right', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "position" }] : /* istanbul ignore next */ []));
+    /** Overrides the localized accessible label for the toast region. */
     ariaLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    /** Overrides the localized accessible label for each dismiss button. */
     dismissLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "dismissLabel" }] : /* istanbul ignore next */ []));
     ariaLabelText = buiLabel('sonner', this.ariaLabel);
@@ -17751,6 +18278,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A horizontal navigation menu with hover/click dropdown panels. */
 class BuiNavigationMenu {
+    /** Top-level menu entries, each optionally opening a dropdown panel. */
     items = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -17925,16 +18453,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A textarea that suggests mentions when you type the trigger character. */
 class BuiMentionInput {
+    /** Textarea contents. Two-way bindable with `[(value)]`. */
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Mentions offered when the trigger character is typed. */
     mentions = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "mentions" }] : /* istanbul ignore next */ []));
+    /** Character that opens the mention suggestion list. */
     trigger = input('@', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "trigger" }] : /* istanbul ignore next */ []));
+    /** Placeholder text for the textarea. */
     placeholder = input('Type @ to mention…', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Number of visible textarea rows. */
     rows = input(3, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
+    /** Native `name` attribute for the textarea. */
     name = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -18002,11 +18536,11 @@ class BuiMentionInput {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: BuiMentionInput, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: BuiMentionInput, isStandalone: true, selector: "bui-mention-input", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, mentions: { classPropertyName: "mentions", publicName: "mentions", isSignal: true, isRequired: false, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { attributes: { "data-slot": "mention-input" }, properties: { "class": "computedClass()" } }, ngImport: i0, template: `
     <textarea
+      buiTextarea
       [value]="value()"
       [placeholder]="placeholder()"
       [rows]="rows()"
       [attr.name]="name() || null"
-      class="w-full resize-y rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-xs outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50"
       (input)="onInput($event)"
       (keydown)="onKeydown($event)"
     ></textarea>
@@ -18029,20 +18563,21 @@ class BuiMentionInput {
         }
       </ul>
     }
-  `, isInline: true });
+  `, isInline: true, dependencies: [{ kind: "directive", type: BuiTextarea, selector: "textarea[buiTextarea]", inputs: ["size", "maxRows", "class"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: BuiMentionInput, decorators: [{
             type: Component,
             args: [{
                     selector: 'bui-mention-input',
                     host: { 'data-slot': 'mention-input', '[class]': 'computedClass()' },
+                    imports: [BuiTextarea],
                     template: `
     <textarea
+      buiTextarea
       [value]="value()"
       [placeholder]="placeholder()"
       [rows]="rows()"
       [attr.name]="name() || null"
-      class="w-full resize-y rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-xs outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50"
       (input)="onInput($event)"
       (keydown)="onKeydown($event)"
     ></textarea>
@@ -18071,18 +18606,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A keyless OpenStreetMap embed centred on a coordinate. SSR-safe. */
 class BuiMap {
+    /** Latitude of the map centre, in degrees. */
     lat = input(50.8503, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "lat" }] : /* istanbul ignore next */ []));
+    /** Longitude of the map centre, in degrees. */
     lon = input(4.3517, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "lon" }] : /* istanbul ignore next */ []));
+    /** Zoom level; higher values zoom in closer. */
     zoom = input(14, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "zoom" }] : /* istanbul ignore next */ []));
+    /** Accessible title for the map iframe. */
     label = input('Location', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /** Whether to drop a pin at the centre coordinate. */
     marker = input(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "marker" }] : /* istanbul ignore next */ []));
+    /** Map height in pixels; ignored when `ratio` is set. */
     height = input(320, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
+    /** CSS aspect ratio (e.g. `16/9`); overrides `height` when set. */
     ratio = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ratio" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -18192,12 +18734,16 @@ function label(iso) {
 }
 /** A horizontal Gantt chart positioning task bars over a date range. SSR-safe. */
 class BuiGantt {
+    /** Tasks to plot as horizontal bars across the date range. */
     tasks = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "tasks" }] : /* istanbul ignore next */ []));
+    /** Milestones to plot as diamond markers below the task bars. */
     milestones = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "milestones" }] : /* istanbul ignore next */ []));
+    /** ISO start date overriding the computed range minimum; empty derives it from tasks. */
     start = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "start" }] : /* istanbul ignore next */ []));
+    /** ISO end date overriding the computed range maximum; empty derives it from tasks. */
     end = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "end" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -18358,16 +18904,22 @@ function toMinutes(value) {
 }
 /** A week/day calendar grid with positioned events. SSR-safe. */
 class BuiScheduler {
+    /** Events to position within the calendar grid. */
     events = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "events" }] : /* istanbul ignore next */ []));
+    /** Custom day-column headers; empty falls back to weekday names or `Today`. */
     days = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "days" }] : /* istanbul ignore next */ []));
+    /** First hour shown on the time axis (24-hour). */
     startHour = input(8, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "startHour" }] : /* istanbul ignore next */ []));
+    /** Last hour shown on the time axis (24-hour), exclusive of the final row. */
     endHour = input(18, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "endHour" }] : /* istanbul ignore next */ []));
+    /** Layout mode; `day` shows a single column, `week` shows the full week. */
     view = input('week', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "view" }] : /* istanbul ignore next */ []));
+    /** Accessible label applied to the grid's `aria-label`. */
     label = input('Schedule', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -18495,8 +19047,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A drag-and-drop kanban board (Angular CDK drag-drop). */
 class BuiKanban {
+    /** Columns and their cards used to seed the board. */
     columns = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
+    /** Emits the updated board whenever a card is moved. */
     changed = output();
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
     board = linkedSignal(() => this.columns().map((column) => ({ ...column, cards: [...column.cards] })), /* @ts-ignore */
@@ -18614,14 +19168,19 @@ const TOOLS = [
 ];
 /** A contenteditable rich-text editor with a basic formatting toolbar. */
 class BuiRichTextEditor {
+    /** Editor contents as HTML. Two-way bindable with `[(value)]`. */
     value = model('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Placeholder text shown while the editor is empty. */
     placeholder = input('Write something…', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the editable region. */
     ariaLabel = input('Rich text editor', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    /** Accessible label override for the formatting toolbar. */
     formattingLabel = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "formattingLabel" }] : /* istanbul ignore next */ []));
+    /** Name attribute associated with the editor for form submission. */
     name = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -18726,10 +19285,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A collapsible vertical navigation sidebar. Toggle width with the `open` model. */
 class BuiSidebar {
+    /** Whether the sidebar is expanded. Two-way bindable with `[(open)]`. */
     open = model(true, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
+    /** Edge the sidebar is docked to, which sets its border side. */
     side = input('left', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "side" }] : /* istanbul ignore next */ []));
+    /** Collapse behavior: hide entirely (`offcanvas`) or shrink to an icon rail (`icon`). */
     collapsible = input('offcanvas', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "collapsible" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -18755,6 +19317,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
         }], propDecorators: { open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], side: [{ type: i0.Input, args: [{ isSignal: true, alias: "side", required: false }] }], collapsible: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsible", required: false }] }], userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
 /** A styled, accessible item button for a {@link BuiSidebar} menu. */
 class BuiSidebarMenuButton {
+    /** Whether this item is the current page; sets active styling and `aria-current`. */
     isActive = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "isActive" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
@@ -18777,8 +19340,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 
 /** A guided product tour with a spotlight on each step's target element. SSR-safe. */
 class BuiOnboardingTour {
+    /** Whether the tour is open. Two-way bindable with `[(open)]`. */
     open = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
+    /** Ordered steps; each spotlights its `target` element in turn. */
     steps = input([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "steps" }] : /* istanbul ignore next */ []));
     step = signal(0, /* @ts-ignore */
@@ -19372,16 +19937,22 @@ function encodeQr(text) {
 
 /** Renders a value as a scannable QR code (SVG). Level M, byte mode. SSR-safe. */
 class BuiQrCode {
+    /** Text or URL to encode into the QR code. */
     value = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Rendered width and height of the SVG in pixels. */
     size = input(160, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the QR code image. */
     label = input('QR code', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /** Fill colour of the QR modules (dark squares). */
     foreground = input('currentColor', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "foreground" }] : /* istanbul ignore next */ []));
+    /** Background fill colour behind the modules. */
     background = input('transparent', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "background" }] : /* istanbul ignore next */ []));
+    /** Quiet-zone border width, in modules. */
     margin = input(2, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "margin" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });