ng-blatui 1.29.0 → 1.30.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/ng-blatui.mjs +590 -0
- package/fesm2022/ng-blatui.mjs.map +1 -1
- package/package.json +1 -1
- package/types/ng-blatui.d.ts +718 -0
package/fesm2022/ng-blatui.mjs
CHANGED
|
@@ -151,8 +151,10 @@ const buttonVariants = cva("inline-flex shrink-0 items-center justify-center gap
|
|
|
151
151
|
* semantics, focus and keyboard behavior (accessibility for free).
|
|
152
152
|
*/
|
|
153
153
|
class BuiButton {
|
|
154
|
+
/** Visual style of the button. */
|
|
154
155
|
variant = input('default', /* @ts-ignore */
|
|
155
156
|
...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
157
|
+
/** Size preset controlling height, padding and icon scale. */
|
|
156
158
|
size = input('default', /* @ts-ignore */
|
|
157
159
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
158
160
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -237,10 +239,13 @@ function intensityFor(variant) {
|
|
|
237
239
|
* element so it stays in the document flow and screen-reader friendly.
|
|
238
240
|
*/
|
|
239
241
|
class BuiBadge {
|
|
242
|
+
/** Brand variant, or the intensity (`soft`/`solid`/`outline`) when a `tone` is set. */
|
|
240
243
|
variant = input('default', /* @ts-ignore */
|
|
241
244
|
...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
245
|
+
/** Optional semantic tone; when set it overrides the brand variant's color. */
|
|
242
246
|
tone = input(null, /* @ts-ignore */
|
|
243
247
|
...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
|
|
248
|
+
/** Badge size preset. */
|
|
244
249
|
size = input('default', /* @ts-ignore */
|
|
245
250
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
246
251
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -291,8 +296,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
291
296
|
* `[decorative]="false"` for a semantic `role="separator"` with `aria-orientation`.
|
|
292
297
|
*/
|
|
293
298
|
class BuiSeparator {
|
|
299
|
+
/** Axis the separator runs along, also driving its sizing. */
|
|
294
300
|
orientation = input('horizontal', /* @ts-ignore */
|
|
295
301
|
...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
|
|
302
|
+
/** Whether the separator is purely visual; `false` exposes a semantic `role="separator"`. */
|
|
296
303
|
decorative = input(true, /* @ts-ignore */
|
|
297
304
|
...(ngDevMode ? [{ debugName: "decorative" }] : /* istanbul ignore next */ []));
|
|
298
305
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -346,6 +353,7 @@ const CARD_VARIANTS = {
|
|
|
346
353
|
};
|
|
347
354
|
/** BlatUI card container. Use `variant="sectioned"` with the header/content/footer parts. */
|
|
348
355
|
class BuiCard {
|
|
356
|
+
/** Card layout style: simple padded box or sectioned container. */
|
|
349
357
|
variant = input('default', /* @ts-ignore */
|
|
350
358
|
...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
351
359
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -463,8 +471,10 @@ const ALERT_TONES = {
|
|
|
463
471
|
* (`default | destructive`) or semantic `tone` (`success | warning | danger | info | neutral`).
|
|
464
472
|
*/
|
|
465
473
|
class BuiAlert {
|
|
474
|
+
/** Brand style; ignored when `tone` is set. */
|
|
466
475
|
variant = input('default', /* @ts-ignore */
|
|
467
476
|
...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
477
|
+
/** Semantic tone; when set, overrides `variant`. */
|
|
468
478
|
tone = input(null, /* @ts-ignore */
|
|
469
479
|
...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
|
|
470
480
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -521,6 +531,7 @@ const INPUT_SIZES = {
|
|
|
521
531
|
};
|
|
522
532
|
/** Applies BlatUI input styling to a native `<input>` (keeps native validation & a11y). */
|
|
523
533
|
class BuiInput {
|
|
534
|
+
/** Size preset controlling input height, padding and text size. */
|
|
524
535
|
size = input('default', /* @ts-ignore */
|
|
525
536
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
526
537
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -549,6 +560,7 @@ const TEXTAREA_SIZES = {
|
|
|
549
560
|
};
|
|
550
561
|
/** Applies BlatUI textarea styling to a native `<textarea>` (auto-grows via field-sizing). */
|
|
551
562
|
class BuiTextarea {
|
|
563
|
+
/** Size preset controlling minimum height, padding and text size. */
|
|
552
564
|
size = input('default', /* @ts-ignore */
|
|
553
565
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
554
566
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -574,8 +586,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
574
586
|
* (valuemin/max/now/text). Set `[indeterminate]="true"` for an unknown-duration bar.
|
|
575
587
|
*/
|
|
576
588
|
class BuiProgress {
|
|
589
|
+
/** Completion percentage from 0 to 100; values are clamped to that range. */
|
|
577
590
|
value = input(0, /* @ts-ignore */
|
|
578
591
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
592
|
+
/** Show an unknown-duration animation instead of a fixed value. */
|
|
579
593
|
indeterminate = input(false, /* @ts-ignore */
|
|
580
594
|
...(ngDevMode ? [{ debugName: "indeterminate" }] : /* istanbul ignore next */ []));
|
|
581
595
|
/** Render a circular ring instead of a linear bar. */
|
|
@@ -587,6 +601,7 @@ class BuiProgress {
|
|
|
587
601
|
/** Stroke width of the circular ring, in pixels. */
|
|
588
602
|
thickness = input(4, /* @ts-ignore */
|
|
589
603
|
...(ngDevMode ? [{ debugName: "thickness" }] : /* istanbul ignore next */ []));
|
|
604
|
+
/** Accessible label announced for the progress bar. */
|
|
590
605
|
ariaLabel = input('Progress', /* @ts-ignore */
|
|
591
606
|
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
592
607
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -718,8 +733,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
718
733
|
* the projected fallback (initials, icon). Falls back automatically on load error.
|
|
719
734
|
*/
|
|
720
735
|
class BuiAvatar {
|
|
736
|
+
/** Image URL to display; when unset or on load error the fallback is shown. */
|
|
721
737
|
src = input(null, /* @ts-ignore */
|
|
722
738
|
...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
|
|
739
|
+
/** Alternative text for the avatar image. */
|
|
723
740
|
alt = input('', /* @ts-ignore */
|
|
724
741
|
...(ngDevMode ? [{ debugName: "alt" }] : /* istanbul ignore next */ []));
|
|
725
742
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -784,10 +801,13 @@ const CHECKBOX_BASE = 'peer border-input dark:bg-input/30 data-[state=checked]:b
|
|
|
784
801
|
* with `[(checked)]` two-way binding and tri-state `[(indeterminate)]`.
|
|
785
802
|
*/
|
|
786
803
|
class BuiCheckbox {
|
|
804
|
+
/** Whether the box is checked. Two-way bindable with `[(checked)]`. */
|
|
787
805
|
checked = model(false, /* @ts-ignore */
|
|
788
806
|
...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
|
|
807
|
+
/** Whether the box shows the mixed/indeterminate state. Two-way bindable with `[(indeterminate)]`. */
|
|
789
808
|
indeterminate = model(false, /* @ts-ignore */
|
|
790
809
|
...(ngDevMode ? [{ debugName: "indeterminate" }] : /* istanbul ignore next */ []));
|
|
810
|
+
/** Whether the checkbox is disabled. Two-way bindable with `[(disabled)]`. */
|
|
791
811
|
disabled = model(false, /* @ts-ignore */
|
|
792
812
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
793
813
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -944,10 +964,13 @@ const THUMB_BASE = 'bg-background dark:data-[state=unchecked]:bg-foreground dark
|
|
|
944
964
|
* binding; keyboard activation (Space/Enter) and focus come from the native button.
|
|
945
965
|
*/
|
|
946
966
|
class BuiSwitch {
|
|
967
|
+
/** Whether the switch is on. Two-way bindable with `[(checked)]`. */
|
|
947
968
|
checked = model(false, /* @ts-ignore */
|
|
948
969
|
...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
|
|
970
|
+
/** Whether the switch is disabled. Two-way bindable with `[(disabled)]`. */
|
|
949
971
|
disabled = model(false, /* @ts-ignore */
|
|
950
972
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
973
|
+
/** Track and thumb size. */
|
|
951
974
|
size = input('default', /* @ts-ignore */
|
|
952
975
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
953
976
|
/** Optional SVG path `d` shown inside the thumb when checked. */
|
|
@@ -2096,8 +2119,10 @@ const noop$g = () => { };
|
|
|
2096
2119
|
* `buiRadioItem` buttons; `[(value)]` two-way binds the selected value.
|
|
2097
2120
|
*/
|
|
2098
2121
|
class BuiRadioGroup {
|
|
2122
|
+
/** Selected radio value. Two-way bindable with `[(value)]`. */
|
|
2099
2123
|
value = model(null, /* @ts-ignore */
|
|
2100
2124
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
2125
|
+
/** Whether the whole group is disabled. Two-way bindable with `[(disabled)]`. */
|
|
2101
2126
|
disabled = model(false, /* @ts-ignore */
|
|
2102
2127
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
2103
2128
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -2163,8 +2188,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
2163
2188
|
}], 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 }] }] } });
|
|
2164
2189
|
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';
|
|
2165
2190
|
class BuiRadioGroupItem {
|
|
2191
|
+
/** Value this item contributes to the group when selected. */
|
|
2166
2192
|
value = input.required(/* @ts-ignore */
|
|
2167
2193
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
2194
|
+
/** Whether this individual radio item is disabled. */
|
|
2168
2195
|
disabled = input(false, /* @ts-ignore */
|
|
2169
2196
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
2170
2197
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -2223,6 +2250,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
2223
2250
|
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';
|
|
2224
2251
|
/** Floating tooltip bubble rendered into a CDK overlay. */
|
|
2225
2252
|
class BuiTooltipContent {
|
|
2253
|
+
/** Text rendered inside the tooltip bubble. */
|
|
2226
2254
|
text = input('', /* @ts-ignore */
|
|
2227
2255
|
...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
|
|
2228
2256
|
/** Extra classes (e.g. a colour override) merged over the base bubble styles. */
|
|
@@ -2260,7 +2288,9 @@ const FALLBACK = {
|
|
|
2260
2288
|
* a hover delay with `delay`, and the bubble colour with `tooltipClass`.
|
|
2261
2289
|
*/
|
|
2262
2290
|
class BuiTooltip {
|
|
2291
|
+
/** Tooltip text; bound via the `buiTooltip` attribute. */
|
|
2263
2292
|
text = input.required({ ...(ngDevMode ? { debugName: "text" } : /* istanbul ignore next */ {}), alias: 'buiTooltip' });
|
|
2293
|
+
/** Preferred placement side relative to the host, with an automatic flip fallback. */
|
|
2264
2294
|
side = input('top', /* @ts-ignore */
|
|
2265
2295
|
...(ngDevMode ? [{ debugName: "side" }] : /* istanbul ignore next */ []));
|
|
2266
2296
|
/** Delay in milliseconds before the tooltip appears on hover/focus. */
|
|
@@ -2335,6 +2365,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
2335
2365
|
|
|
2336
2366
|
/** Breadcrumb navigation landmark (`<nav aria-label="breadcrumb">`). */
|
|
2337
2367
|
class BuiBreadcrumb {
|
|
2368
|
+
/** Accessible label for the breadcrumb navigation landmark. */
|
|
2338
2369
|
label = input(/* @ts-ignore */
|
|
2339
2370
|
...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
|
|
2340
2371
|
labelText = buiLabel('breadcrumb', this.label);
|
|
@@ -2463,6 +2494,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
2463
2494
|
/** Collapsed breadcrumb indicator (ellipsis). */
|
|
2464
2495
|
class BuiBreadcrumbEllipsis {
|
|
2465
2496
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
2497
|
+
/** Screen-reader text for the collapsed ellipsis indicator. */
|
|
2466
2498
|
moreLabel = input(/* @ts-ignore */
|
|
2467
2499
|
...(ngDevMode ? [undefined, { debugName: "moreLabel" }] : /* istanbul ignore next */ []));
|
|
2468
2500
|
moreText = buiLabel('breadcrumbMore', this.moreLabel);
|
|
@@ -2533,6 +2565,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
2533
2565
|
|
|
2534
2566
|
/** Constrains projected content to a given aspect ratio (e.g. `16 / 9`). */
|
|
2535
2567
|
class BuiAspectRatio {
|
|
2568
|
+
/** Aspect ratio for the content, as a CSS `aspect-ratio` value (e.g. `16 / 9`). */
|
|
2536
2569
|
ratio = input('1 / 1', /* @ts-ignore */
|
|
2537
2570
|
...(ngDevMode ? [{ debugName: "ratio" }] : /* istanbul ignore next */ []));
|
|
2538
2571
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -2556,6 +2589,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
2556
2589
|
|
|
2557
2590
|
/** Groups buttons (and inputs) into a single segmented control. */
|
|
2558
2591
|
class BuiButtonGroup {
|
|
2592
|
+
/** Layout direction of the grouped controls. */
|
|
2559
2593
|
orientation = input('horizontal', /* @ts-ignore */
|
|
2560
2594
|
...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
|
|
2561
2595
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -2622,6 +2656,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
2622
2656
|
}]
|
|
2623
2657
|
}], propDecorators: { userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
|
|
2624
2658
|
class BuiEmptyMedia {
|
|
2659
|
+
/** Media style; `icon` renders a muted rounded badge sized for an icon. */
|
|
2625
2660
|
variant = input('default', /* @ts-ignore */
|
|
2626
2661
|
...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
2627
2662
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -2695,6 +2730,7 @@ const SIZES$5 = {
|
|
|
2695
2730
|
};
|
|
2696
2731
|
/** Centered, padded page container with a max-width scale. */
|
|
2697
2732
|
class BuiContainer {
|
|
2733
|
+
/** Maximum width preset for the container. */
|
|
2698
2734
|
size = input('lg', /* @ts-ignore */
|
|
2699
2735
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
2700
2736
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -2718,6 +2754,7 @@ const FIELD_ORIENT = {
|
|
|
2718
2754
|
};
|
|
2719
2755
|
/** A form field row grouping a label, control, description and error. */
|
|
2720
2756
|
class BuiField {
|
|
2757
|
+
/** How the label and control are arranged within the field. */
|
|
2721
2758
|
orientation = input('vertical', /* @ts-ignore */
|
|
2722
2759
|
...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
|
|
2723
2760
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -2753,6 +2790,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
2753
2790
|
}]
|
|
2754
2791
|
}], propDecorators: { userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
|
|
2755
2792
|
class BuiFieldLegend {
|
|
2793
|
+
/** Whether the legend is styled as a section legend or a smaller label. */
|
|
2756
2794
|
variant = input('legend', /* @ts-ignore */
|
|
2757
2795
|
...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
2758
2796
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -2787,6 +2825,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
2787
2825
|
}]
|
|
2788
2826
|
}], propDecorators: { userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
|
|
2789
2827
|
class BuiFieldLabel {
|
|
2828
|
+
/** Id of the control this label is associated with (maps to the `for` attribute). */
|
|
2790
2829
|
forId = input(undefined, { ...(ngDevMode ? { debugName: "forId" } : /* istanbul ignore next */ {}), alias: 'for' });
|
|
2791
2830
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
2792
2831
|
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 +2926,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
2887
2926
|
|
|
2888
2927
|
/** Accessible disclosure: a trigger toggles the visibility of its content. */
|
|
2889
2928
|
class BuiCollapsible {
|
|
2929
|
+
/** Whether the content is shown. Two-way bindable with `[(open)]`. */
|
|
2890
2930
|
open = model(false, /* @ts-ignore */
|
|
2891
2931
|
...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
|
|
2892
2932
|
contentId = inject(_IdGenerator).getId('bui-collapsible-');
|
|
@@ -2959,12 +2999,16 @@ const toggleVariants = cva("inline-flex items-center justify-center gap-2 rounde
|
|
|
2959
2999
|
});
|
|
2960
3000
|
/** A two-state toggle button (`aria-pressed`). */
|
|
2961
3001
|
class BuiToggle {
|
|
3002
|
+
/** Whether the toggle is pressed (on). Two-way bindable with `[(pressed)]`. */
|
|
2962
3003
|
pressed = model(false, /* @ts-ignore */
|
|
2963
3004
|
...(ngDevMode ? [{ debugName: "pressed" }] : /* istanbul ignore next */ []));
|
|
3005
|
+
/** Whether the toggle is disabled. Two-way bindable with `[(disabled)]`. */
|
|
2964
3006
|
disabled = model(false, /* @ts-ignore */
|
|
2965
3007
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
3008
|
+
/** Visual style: plain or outlined. */
|
|
2966
3009
|
variant = input('default', /* @ts-ignore */
|
|
2967
3010
|
...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
3011
|
+
/** Button size. */
|
|
2968
3012
|
size = input('default', /* @ts-ignore */
|
|
2969
3013
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
2970
3014
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -3021,6 +3065,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
3021
3065
|
/** A spinning loading indicator (`role="status"`). */
|
|
3022
3066
|
class BuiSpinner {
|
|
3023
3067
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
3068
|
+
/** Overrides the localized accessible status label. */
|
|
3024
3069
|
label = input(/* @ts-ignore */
|
|
3025
3070
|
...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
|
|
3026
3071
|
labelText = buiLabel('spinnerLoading', this.label);
|
|
@@ -3071,8 +3116,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
3071
3116
|
|
|
3072
3117
|
/** Copy-to-clipboard button: copies `value`, flips to a check, announces "Copied". */
|
|
3073
3118
|
class BuiCopyButton {
|
|
3119
|
+
/** Text written to the clipboard when clicked. */
|
|
3074
3120
|
value = input('', /* @ts-ignore */
|
|
3075
3121
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
3122
|
+
/** Accessible label shown before copying. */
|
|
3076
3123
|
label = input('Copy', /* @ts-ignore */
|
|
3077
3124
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
3078
3125
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -3189,15 +3236,20 @@ const TONES$1 = {
|
|
|
3189
3236
|
* the dismissal in localStorage. SSR-safe — localStorage is only touched in the browser.
|
|
3190
3237
|
*/
|
|
3191
3238
|
class BuiBanner {
|
|
3239
|
+
/** Color tone (`default | primary | info | success | warning | danger`). */
|
|
3192
3240
|
tone = input('default', /* @ts-ignore */
|
|
3193
3241
|
...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
|
|
3242
|
+
/** Whether to show the dismiss button. */
|
|
3194
3243
|
dismissible = input(true, /* @ts-ignore */
|
|
3195
3244
|
...(ngDevMode ? [{ debugName: "dismissible" }] : /* istanbul ignore next */ []));
|
|
3245
|
+
/** When set, the dismissal is remembered in localStorage under this key. */
|
|
3196
3246
|
persistKey = input(undefined, /* @ts-ignore */
|
|
3197
3247
|
...(ngDevMode ? [{ debugName: "persistKey" }] : /* istanbul ignore next */ []));
|
|
3198
3248
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
3249
|
+
/** Overrides the localized accessible label for the announcement region. */
|
|
3199
3250
|
announcementLabel = input(/* @ts-ignore */
|
|
3200
3251
|
...(ngDevMode ? [undefined, { debugName: "announcementLabel" }] : /* istanbul ignore next */ []));
|
|
3252
|
+
/** Overrides the localized accessible label for the dismiss button. */
|
|
3201
3253
|
dismissLabel = input(/* @ts-ignore */
|
|
3202
3254
|
...(ngDevMode ? [undefined, { debugName: "dismissLabel" }] : /* istanbul ignore next */ []));
|
|
3203
3255
|
announcementText = buiLabel('bannerAnnouncement', this.announcementLabel);
|
|
@@ -3292,6 +3344,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
3292
3344
|
|
|
3293
3345
|
/** Scroll/border wrapper around a table. `variant="card"` adds a bordered card. */
|
|
3294
3346
|
class BuiTableContainer {
|
|
3347
|
+
/** Wrapper style; `card` adds a bordered, shadowed card around the table. */
|
|
3295
3348
|
variant = input('default', /* @ts-ignore */
|
|
3296
3349
|
...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
3297
3350
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -3441,10 +3494,13 @@ function initials(name) {
|
|
|
3441
3494
|
}
|
|
3442
3495
|
/** Overlapping stack of avatars with an optional "+N" overflow counter. */
|
|
3443
3496
|
class BuiAvatarGroup {
|
|
3497
|
+
/** Avatars to display, in order. */
|
|
3444
3498
|
avatars = input([], /* @ts-ignore */
|
|
3445
3499
|
...(ngDevMode ? [{ debugName: "avatars" }] : /* istanbul ignore next */ []));
|
|
3500
|
+
/** Maximum avatars shown before the rest collapse into a "+N" counter. */
|
|
3446
3501
|
max = input(4, /* @ts-ignore */
|
|
3447
3502
|
...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
|
|
3503
|
+
/** Avatar size preset, which also controls overlap and ring width. */
|
|
3448
3504
|
size = input('default', /* @ts-ignore */
|
|
3449
3505
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
3450
3506
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -3516,6 +3572,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
3516
3572
|
|
|
3517
3573
|
/** Pagination navigation landmark. */
|
|
3518
3574
|
class BuiPagination {
|
|
3575
|
+
/** Accessible label for the navigation landmark; falls back to a localized default. */
|
|
3519
3576
|
ariaLabel = input(/* @ts-ignore */
|
|
3520
3577
|
...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
3521
3578
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -3571,8 +3628,10 @@ const LINK_SIZES = {
|
|
|
3571
3628
|
};
|
|
3572
3629
|
/** A pagination link; set `active` for the current page. */
|
|
3573
3630
|
class BuiPaginationLink {
|
|
3631
|
+
/** Whether this link represents the current page; sets `aria-current="page"`. */
|
|
3574
3632
|
active = input(false, /* @ts-ignore */
|
|
3575
3633
|
...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
|
|
3634
|
+
/** Size variant controlling link dimensions and padding. */
|
|
3576
3635
|
size = input('icon', /* @ts-ignore */
|
|
3577
3636
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
3578
3637
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -3598,6 +3657,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
3598
3657
|
/** Ellipsis indicator for skipped pages. */
|
|
3599
3658
|
class BuiPaginationEllipsis {
|
|
3600
3659
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
3660
|
+
/** Visually-hidden label announcing skipped pages; falls back to a localized default. */
|
|
3601
3661
|
moreLabel = input(/* @ts-ignore */
|
|
3602
3662
|
...(ngDevMode ? [undefined, { debugName: "moreLabel" }] : /* istanbul ignore next */ []));
|
|
3603
3663
|
moreText = buiLabel('paginationMore', this.moreLabel);
|
|
@@ -3663,7 +3723,9 @@ const POPOVER_FALLBACK = {
|
|
|
3663
3723
|
* Closes on outside click and Escape. SSR-safe (the overlay is browser-only, on click).
|
|
3664
3724
|
*/
|
|
3665
3725
|
class BuiPopover {
|
|
3726
|
+
/** Template rendered as the popover content; bound via `[buiPopover]`. */
|
|
3666
3727
|
content = input.required({ ...(ngDevMode ? { debugName: "content" } : /* istanbul ignore next */ {}), alias: 'buiPopover' });
|
|
3728
|
+
/** Side of the trigger the popover opens on, with an automatic opposite-side fallback. */
|
|
3667
3729
|
side = input('bottom', /* @ts-ignore */
|
|
3668
3730
|
...(ngDevMode ? [{ debugName: "side" }] : /* istanbul ignore next */ []));
|
|
3669
3731
|
overlay = inject(Overlay);
|
|
@@ -3759,8 +3821,10 @@ const ITEM_SIZES = {
|
|
|
3759
3821
|
};
|
|
3760
3822
|
/** A list/row item; use on a `<div>` or an `<a>`. */
|
|
3761
3823
|
class BuiItem {
|
|
3824
|
+
/** Visual style of the item: transparent, outlined, or muted background. */
|
|
3762
3825
|
variant = input('default', /* @ts-ignore */
|
|
3763
3826
|
...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
3827
|
+
/** Item density: standard padding or a more compact `sm` size. */
|
|
3764
3828
|
size = input('default', /* @ts-ignore */
|
|
3765
3829
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
3766
3830
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -3787,6 +3851,7 @@ const MEDIA_VARIANTS = {
|
|
|
3787
3851
|
image: 'size-10 overflow-hidden rounded-sm [&_img]:size-full [&_img]:object-cover',
|
|
3788
3852
|
};
|
|
3789
3853
|
class BuiItemMedia {
|
|
3854
|
+
/** Media presentation: plain, an icon tile, or a cropped image thumbnail. */
|
|
3790
3855
|
variant = input('default', /* @ts-ignore */
|
|
3791
3856
|
...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
3792
3857
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -3934,6 +3999,7 @@ const ADDON_ALIGN = {
|
|
|
3934
3999
|
'block-end': 'order-last w-full justify-start px-3 pb-3',
|
|
3935
4000
|
};
|
|
3936
4001
|
class BuiInputGroupAddon {
|
|
4002
|
+
/** Where the addon sits relative to the input (inline or block, start or end). */
|
|
3937
4003
|
align = input('inline-start', /* @ts-ignore */
|
|
3938
4004
|
...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
|
|
3939
4005
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -3994,8 +4060,10 @@ const IG_BUTTON_SIZES = {
|
|
|
3994
4060
|
'icon-sm': 'size-8 p-0',
|
|
3995
4061
|
};
|
|
3996
4062
|
class BuiInputGroupButton {
|
|
4063
|
+
/** Visual style of the addon button. */
|
|
3997
4064
|
variant = input('ghost', /* @ts-ignore */
|
|
3998
4065
|
...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
4066
|
+
/** Size preset for the addon button (text or icon variants). */
|
|
3999
4067
|
size = input('xs', /* @ts-ignore */
|
|
4000
4068
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
4001
4069
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -4014,6 +4082,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
4014
4082
|
|
|
4015
4083
|
/** Visually hides content while keeping it available to assistive tech (sr-only). */
|
|
4016
4084
|
class BuiVisuallyHidden {
|
|
4085
|
+
/** Whether the content becomes visible when focused (e.g. skip links). */
|
|
4017
4086
|
focusable = input(false, /* @ts-ignore */
|
|
4018
4087
|
...(ngDevMode ? [{ debugName: "focusable" }] : /* istanbul ignore next */ []));
|
|
4019
4088
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -4039,21 +4108,28 @@ const TONES = {
|
|
|
4039
4108
|
};
|
|
4040
4109
|
/** A labelled meter (`role="meter"`) for a measurement within a known range. */
|
|
4041
4110
|
class BuiMeter {
|
|
4111
|
+
/** Current measurement; clamped between `min` and `max`. */
|
|
4042
4112
|
value = input(0, /* @ts-ignore */
|
|
4043
4113
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
4114
|
+
/** Minimum value of the meter range. */
|
|
4044
4115
|
min = input(0, /* @ts-ignore */
|
|
4045
4116
|
...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
|
|
4117
|
+
/** Maximum value of the meter range. */
|
|
4046
4118
|
max = input(100, /* @ts-ignore */
|
|
4047
4119
|
...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
|
|
4120
|
+
/** Optional text label shown above the meter bar. */
|
|
4048
4121
|
label = input(null, /* @ts-ignore */
|
|
4049
4122
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
4123
|
+
/** Fill colour tone; overridden by any matching threshold. */
|
|
4050
4124
|
tone = input('default', /* @ts-ignore */
|
|
4051
4125
|
...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
|
|
4052
4126
|
/** Auto-pick the fill tone by value: the highest threshold whose `at` ≤ value wins. */
|
|
4053
4127
|
thresholds = input([], /* @ts-ignore */
|
|
4054
4128
|
...(ngDevMode ? [{ debugName: "thresholds" }] : /* istanbul ignore next */ []));
|
|
4129
|
+
/** Whether to display the formatted value text next to the label. */
|
|
4055
4130
|
showValue = input(true, /* @ts-ignore */
|
|
4056
4131
|
...(ngDevMode ? [{ debugName: "showValue" }] : /* istanbul ignore next */ []));
|
|
4132
|
+
/** Unit suffix appended to the displayed value (e.g. "%"). */
|
|
4057
4133
|
unit = input('%', /* @ts-ignore */
|
|
4058
4134
|
...(ngDevMode ? [{ debugName: "unit" }] : /* istanbul ignore next */ []));
|
|
4059
4135
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -4157,14 +4233,19 @@ const TREND_CLASS = {
|
|
|
4157
4233
|
};
|
|
4158
4234
|
/** A KPI / statistic card: label, big value, and a trend-coloured change. */
|
|
4159
4235
|
class BuiStat {
|
|
4236
|
+
/** Small caption shown above the value. */
|
|
4160
4237
|
label = input(null, /* @ts-ignore */
|
|
4161
4238
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
4239
|
+
/** Primary statistic displayed as the large value. */
|
|
4162
4240
|
value = input('', /* @ts-ignore */
|
|
4163
4241
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
4242
|
+
/** Change indicator (e.g. "+12%"); coloured by trend. */
|
|
4164
4243
|
change = input(null, /* @ts-ignore */
|
|
4165
4244
|
...(ngDevMode ? [{ debugName: "change" }] : /* istanbul ignore next */ []));
|
|
4245
|
+
/** Explicit trend direction; inferred from `change`'s sign when null. */
|
|
4166
4246
|
trend = input(null, /* @ts-ignore */
|
|
4167
4247
|
...(ngDevMode ? [{ debugName: "trend" }] : /* istanbul ignore next */ []));
|
|
4248
|
+
/** Muted text shown next to the change value. */
|
|
4168
4249
|
caption = input(null, /* @ts-ignore */
|
|
4169
4250
|
...(ngDevMode ? [{ debugName: "caption" }] : /* istanbul ignore next */ []));
|
|
4170
4251
|
/** Optional inline sparkline drawn from a series of numbers. */
|
|
@@ -4283,9 +4364,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
4283
4364
|
* and stays open while the pointer is over the card. SSR-safe (browser-only, on hover).
|
|
4284
4365
|
*/
|
|
4285
4366
|
class BuiHoverCard {
|
|
4367
|
+
/** Template rendered inside the card; bound via the `buiHoverCard` attribute. */
|
|
4286
4368
|
content = input.required({ ...(ngDevMode ? { debugName: "content" } : /* istanbul ignore next */ {}), alias: 'buiHoverCard' });
|
|
4369
|
+
/** Delay in milliseconds before the card opens on hover/focus. */
|
|
4287
4370
|
openDelay = input(400, /* @ts-ignore */
|
|
4288
4371
|
...(ngDevMode ? [{ debugName: "openDelay" }] : /* istanbul ignore next */ []));
|
|
4372
|
+
/** Delay in milliseconds before the card closes after the pointer leaves. */
|
|
4289
4373
|
closeDelay = input(100, /* @ts-ignore */
|
|
4290
4374
|
...(ngDevMode ? [{ debugName: "closeDelay" }] : /* istanbul ignore next */ []));
|
|
4291
4375
|
overlay = inject(Overlay);
|
|
@@ -4377,15 +4461,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
4377
4461
|
|
|
4378
4462
|
/** A dark code panel with an optional filename header and a copy button. */
|
|
4379
4463
|
class BuiCodeBlock {
|
|
4464
|
+
/** Source code shown in the panel and copied to the clipboard. */
|
|
4380
4465
|
code = input('', /* @ts-ignore */
|
|
4381
4466
|
...(ngDevMode ? [{ debugName: "code" }] : /* istanbul ignore next */ []));
|
|
4467
|
+
/** Optional filename shown in the header; omit for the floating copy button. */
|
|
4382
4468
|
filename = input(null, /* @ts-ignore */
|
|
4383
4469
|
...(ngDevMode ? [{ debugName: "filename" }] : /* istanbul ignore next */ []));
|
|
4384
4470
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
4471
|
+
/** Accessible label for the copy button. */
|
|
4385
4472
|
copyLabel = input(/* @ts-ignore */
|
|
4386
4473
|
...(ngDevMode ? [undefined, { debugName: "copyLabel" }] : /* istanbul ignore next */ []));
|
|
4474
|
+
/** Short visible text for the copy button. */
|
|
4387
4475
|
copyShortLabel = input(/* @ts-ignore */
|
|
4388
4476
|
...(ngDevMode ? [undefined, { debugName: "copyShortLabel" }] : /* istanbul ignore next */ []));
|
|
4477
|
+
/** Text shown briefly after the code is copied. */
|
|
4389
4478
|
copiedLabel = input(/* @ts-ignore */
|
|
4390
4479
|
...(ngDevMode ? [undefined, { debugName: "copiedLabel" }] : /* istanbul ignore next */ []));
|
|
4391
4480
|
copyText = buiLabel('codeBlockCopy', this.copyLabel);
|
|
@@ -4480,23 +4569,31 @@ const noop$e = () => { };
|
|
|
4480
4569
|
* only read inside browser event handlers.
|
|
4481
4570
|
*/
|
|
4482
4571
|
class BuiSlider {
|
|
4572
|
+
/** Current value (lower thumb in range mode). Two-way bindable with `[(value)]`. */
|
|
4483
4573
|
value = model(0, /* @ts-ignore */
|
|
4484
4574
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
4485
4575
|
/** Enable a second thumb; binds `endValue` as the upper handle. */
|
|
4486
4576
|
range = input(false, /* @ts-ignore */
|
|
4487
4577
|
...(ngDevMode ? [{ debugName: "range" }] : /* istanbul ignore next */ []));
|
|
4578
|
+
/** Upper thumb value in range mode. Two-way bindable with `[(endValue)]`. */
|
|
4488
4579
|
endValue = model(100, /* @ts-ignore */
|
|
4489
4580
|
...(ngDevMode ? [{ debugName: "endValue" }] : /* istanbul ignore next */ []));
|
|
4581
|
+
/** Minimum selectable value. */
|
|
4490
4582
|
min = input(0, /* @ts-ignore */
|
|
4491
4583
|
...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
|
|
4584
|
+
/** Maximum selectable value. */
|
|
4492
4585
|
max = input(100, /* @ts-ignore */
|
|
4493
4586
|
...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
|
|
4587
|
+
/** Increment between selectable values. */
|
|
4494
4588
|
step = input(1, /* @ts-ignore */
|
|
4495
4589
|
...(ngDevMode ? [{ debugName: "step" }] : /* istanbul ignore next */ []));
|
|
4590
|
+
/** Whether the slider is disabled. Two-way bindable with `[(disabled)]`. */
|
|
4496
4591
|
disabled = model(false, /* @ts-ignore */
|
|
4497
4592
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
4593
|
+
/** Layout direction of the slider. */
|
|
4498
4594
|
orientation = input('horizontal', /* @ts-ignore */
|
|
4499
4595
|
...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
|
|
4596
|
+
/** Accessible label for the thumb(s). */
|
|
4500
4597
|
ariaLabel = input('Value', /* @ts-ignore */
|
|
4501
4598
|
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
4502
4599
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -4754,18 +4851,25 @@ const noop$d = () => { };
|
|
|
4754
4851
|
const STAR_SIZE = { sm: 'size-4', default: 'size-5', lg: 'size-6' };
|
|
4755
4852
|
/** A star rating (`role="radiogroup"`) with hover preview and keyboard support. */
|
|
4756
4853
|
class BuiRating {
|
|
4854
|
+
/** Current rating. Two-way bindable with `[(value)]`. */
|
|
4757
4855
|
value = model(0, /* @ts-ignore */
|
|
4758
4856
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
4857
|
+
/** Number of stars shown. */
|
|
4759
4858
|
max = input(5, /* @ts-ignore */
|
|
4760
4859
|
...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
|
|
4860
|
+
/** Whether the rating is display-only and cannot be changed. */
|
|
4761
4861
|
readonly = input(false, /* @ts-ignore */
|
|
4762
4862
|
...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
4863
|
+
/** Whether the rating is disabled. Two-way bindable with `[(disabled)]`. */
|
|
4763
4864
|
disabled = model(false, /* @ts-ignore */
|
|
4764
4865
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
4866
|
+
/** Size of each star. */
|
|
4765
4867
|
size = input('default', /* @ts-ignore */
|
|
4766
4868
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
4869
|
+
/** Tailwind text-color class applied to filled stars. */
|
|
4767
4870
|
color = input('text-amber-500', /* @ts-ignore */
|
|
4768
4871
|
...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
|
|
4872
|
+
/** Accessible label for the rating group. */
|
|
4769
4873
|
ariaLabel = input(null, /* @ts-ignore */
|
|
4770
4874
|
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
4771
4875
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -4922,22 +5026,31 @@ const BTN_SIZE$1 = {
|
|
|
4922
5026
|
const FIELD_WIDTH = { sm: 'w-9', default: 'w-10', lg: 'w-12' };
|
|
4923
5027
|
/** A compact − [n] + quantity stepper (`role="group"` with a `spinbutton` field). */
|
|
4924
5028
|
class BuiQuantitySelector {
|
|
5029
|
+
/** Current quantity. Two-way bindable with `[(value)]`. */
|
|
4925
5030
|
value = model(1, /* @ts-ignore */
|
|
4926
5031
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
5032
|
+
/** Minimum allowed quantity. */
|
|
4927
5033
|
min = input(1, /* @ts-ignore */
|
|
4928
5034
|
...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
|
|
5035
|
+
/** Maximum allowed quantity; unbounded when null. */
|
|
4929
5036
|
max = input(null, /* @ts-ignore */
|
|
4930
5037
|
...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
|
|
5038
|
+
/** Increment/decrement applied per button press. */
|
|
4931
5039
|
step = input(1, /* @ts-ignore */
|
|
4932
5040
|
...(ngDevMode ? [{ debugName: "step" }] : /* istanbul ignore next */ []));
|
|
5041
|
+
/** Size preset controlling height and button width. */
|
|
4933
5042
|
size = input('default', /* @ts-ignore */
|
|
4934
5043
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
5044
|
+
/** Whether the whole control is disabled. */
|
|
4935
5045
|
disabled = input(false, /* @ts-ignore */
|
|
4936
5046
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
5047
|
+
/** Accessible label for the numeric input field. */
|
|
4937
5048
|
ariaLabel = input('Quantity', /* @ts-ignore */
|
|
4938
5049
|
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
5050
|
+
/** Accessible label override for the decrease button. */
|
|
4939
5051
|
decreaseLabel = input(/* @ts-ignore */
|
|
4940
5052
|
...(ngDevMode ? [undefined, { debugName: "decreaseLabel" }] : /* istanbul ignore next */ []));
|
|
5053
|
+
/** Accessible label override for the increase button. */
|
|
4941
5054
|
increaseLabel = input(/* @ts-ignore */
|
|
4942
5055
|
...(ngDevMode ? [undefined, { debugName: "increaseLabel" }] : /* istanbul ignore next */ []));
|
|
4943
5056
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -5212,8 +5325,10 @@ const SIZES$3 = {
|
|
|
5212
5325
|
* browser (via `afterNextRender` and the `input` event).
|
|
5213
5326
|
*/
|
|
5214
5327
|
class BuiAutosizeTextarea {
|
|
5328
|
+
/** Size preset controlling minimum height, padding and text size. */
|
|
5215
5329
|
size = input('default', /* @ts-ignore */
|
|
5216
5330
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
5331
|
+
/** Maximum number of rows before the textarea scrolls instead of growing (null = unlimited). */
|
|
5217
5332
|
maxRows = input(null, /* @ts-ignore */
|
|
5218
5333
|
...(ngDevMode ? [{ debugName: "maxRows" }] : /* istanbul ignore next */ []));
|
|
5219
5334
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -5387,6 +5502,7 @@ const TYPOGRAPHY = {
|
|
|
5387
5502
|
};
|
|
5388
5503
|
/** Applies a typographic style. Put it on the matching element (e.g. `<h1 buiTypography variant="h1">`). */
|
|
5389
5504
|
class BuiTypography {
|
|
5505
|
+
/** Typographic style to apply (e.g. `h1`, `lead`, `blockquote`, `gradient`). */
|
|
5390
5506
|
variant = input('p', /* @ts-ignore */
|
|
5391
5507
|
...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
5392
5508
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -5409,10 +5525,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
5409
5525
|
|
|
5410
5526
|
/** Decorative dotted background layer. Drop inside a `relative` container. */
|
|
5411
5527
|
class BuiDotPattern {
|
|
5528
|
+
/** Dot radius in pixels. */
|
|
5412
5529
|
size = input(1, /* @ts-ignore */
|
|
5413
5530
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
5531
|
+
/** Spacing between dots in pixels. */
|
|
5414
5532
|
gap = input(16, /* @ts-ignore */
|
|
5415
5533
|
...(ngDevMode ? [{ debugName: "gap" }] : /* istanbul ignore next */ []));
|
|
5534
|
+
/** Whether to fade the pattern with a radial mask toward the edges. */
|
|
5416
5535
|
mask = input(false, /* @ts-ignore */
|
|
5417
5536
|
...(ngDevMode ? [{ debugName: "mask" }] : /* istanbul ignore next */ []));
|
|
5418
5537
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -5445,10 +5564,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
5445
5564
|
|
|
5446
5565
|
/** Decorative grid background layer. Drop inside a `relative` container. */
|
|
5447
5566
|
class BuiGridPattern {
|
|
5567
|
+
/** Cell size (spacing between grid lines) in pixels. */
|
|
5448
5568
|
gap = input(24, /* @ts-ignore */
|
|
5449
5569
|
...(ngDevMode ? [{ debugName: "gap" }] : /* istanbul ignore next */ []));
|
|
5570
|
+
/** Thickness of the grid lines in pixels. */
|
|
5450
5571
|
lineWidth = input(1, /* @ts-ignore */
|
|
5451
5572
|
...(ngDevMode ? [{ debugName: "lineWidth" }] : /* istanbul ignore next */ []));
|
|
5573
|
+
/** Whether to fade the pattern with a radial mask toward the edges. */
|
|
5452
5574
|
mask = input(false, /* @ts-ignore */
|
|
5453
5575
|
...(ngDevMode ? [{ debugName: "mask" }] : /* istanbul ignore next */ []));
|
|
5454
5576
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -5486,10 +5608,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
5486
5608
|
const noop$c = () => { };
|
|
5487
5609
|
/** A single-select segmented control (`role="radiogroup"`) with arrow-key navigation. */
|
|
5488
5610
|
class BuiSegmentedControl {
|
|
5611
|
+
/** Currently selected segment value. Two-way bindable with `[(value)]`. */
|
|
5489
5612
|
value = model('', /* @ts-ignore */
|
|
5490
5613
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
5614
|
+
/** Available segments; plain strings are used as both value and label. */
|
|
5491
5615
|
options = input([], /* @ts-ignore */
|
|
5492
5616
|
...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
|
|
5617
|
+
/** Whether all segments are disabled. Two-way bindable with `[(disabled)]`. */
|
|
5493
5618
|
disabled = model(false, /* @ts-ignore */
|
|
5494
5619
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
5495
5620
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -5609,8 +5734,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
5609
5734
|
* helper classes `.prompt .ok .dim .path .warn` colour them.
|
|
5610
5735
|
*/
|
|
5611
5736
|
class BuiTerminal {
|
|
5737
|
+
/** Optional title shown in the terminal title bar. */
|
|
5612
5738
|
title = input(null, /* @ts-ignore */
|
|
5613
5739
|
...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
5740
|
+
/** Whether to show the macOS-style traffic-light buttons in the title bar. */
|
|
5614
5741
|
buttons = input(true, /* @ts-ignore */
|
|
5615
5742
|
...(ngDevMode ? [{ debugName: "buttons" }] : /* istanbul ignore next */ []));
|
|
5616
5743
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -5680,17 +5807,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
5680
5807
|
|
|
5681
5808
|
/** A data-driven feature-comparison / pricing table. */
|
|
5682
5809
|
class BuiComparisonTable {
|
|
5810
|
+
/** Column headers, one per pricing/feature tier. */
|
|
5683
5811
|
tiers = input([], /* @ts-ignore */
|
|
5684
5812
|
...(ngDevMode ? [{ debugName: "tiers" }] : /* istanbul ignore next */ []));
|
|
5813
|
+
/** Feature rows; each holds one value per tier. */
|
|
5685
5814
|
rows = input([], /* @ts-ignore */
|
|
5686
5815
|
...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
|
|
5816
|
+
/** Tier to emphasize, by index or tier name; `null` highlights none. */
|
|
5687
5817
|
highlight = input(null, /* @ts-ignore */
|
|
5688
5818
|
...(ngDevMode ? [{ debugName: "highlight" }] : /* istanbul ignore next */ []));
|
|
5819
|
+
/** Header text for the leading feature column. */
|
|
5689
5820
|
featureLabel = input('Feature', /* @ts-ignore */
|
|
5690
5821
|
...(ngDevMode ? [{ debugName: "featureLabel" }] : /* istanbul ignore next */ []));
|
|
5691
5822
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
5823
|
+
/** Accessible label for the included (check) icon. */
|
|
5692
5824
|
includedLabel = input(/* @ts-ignore */
|
|
5693
5825
|
...(ngDevMode ? [undefined, { debugName: "includedLabel" }] : /* istanbul ignore next */ []));
|
|
5826
|
+
/** Accessible label for the not-included (dash) marker. */
|
|
5694
5827
|
notIncludedLabel = input(/* @ts-ignore */
|
|
5695
5828
|
...(ngDevMode ? [undefined, { debugName: "notIncludedLabel" }] : /* istanbul ignore next */ []));
|
|
5696
5829
|
includedText = buiLabel('comparisonTableIncluded', this.includedLabel);
|
|
@@ -5836,8 +5969,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
5836
5969
|
* with `[buiFlipBack]`. `trigger="hover"` (default) or `"click"` (keyboard-accessible).
|
|
5837
5970
|
*/
|
|
5838
5971
|
class BuiFlipCard {
|
|
5972
|
+
/** What flips the card: hover/focus or click/keypress. */
|
|
5839
5973
|
trigger = input('hover', /* @ts-ignore */
|
|
5840
5974
|
...(ngDevMode ? [{ debugName: "trigger" }] : /* istanbul ignore next */ []));
|
|
5975
|
+
/** Fixed card height as a CSS length. */
|
|
5841
5976
|
height = input('16rem', /* @ts-ignore */
|
|
5842
5977
|
...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
|
|
5843
5978
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -5932,8 +6067,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
5932
6067
|
|
|
5933
6068
|
/** A card with a radial spotlight glow that follows the cursor on hover. */
|
|
5934
6069
|
class BuiSpotlightCard {
|
|
6070
|
+
/** Spotlight glow colour; defaults to a subtle foreground tint. */
|
|
5935
6071
|
color = input(null, /* @ts-ignore */
|
|
5936
6072
|
...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
|
|
6073
|
+
/** Spotlight radius in pixels. */
|
|
5937
6074
|
size = input(350, /* @ts-ignore */
|
|
5938
6075
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
5939
6076
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -5989,8 +6126,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
5989
6126
|
|
|
5990
6127
|
/** A card that tilts in 3D toward the cursor. SSR-safe (geometry read on mousemove). */
|
|
5991
6128
|
class BuiTiltCard {
|
|
6129
|
+
/** Maximum tilt angle in degrees on each axis. */
|
|
5992
6130
|
max = input(10, /* @ts-ignore */
|
|
5993
6131
|
...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
|
|
6132
|
+
/** Scale factor applied while the card is tilting. */
|
|
5994
6133
|
scaleTo = input(1.05, /* @ts-ignore */
|
|
5995
6134
|
...(ngDevMode ? [{ debugName: "scaleTo" }] : /* istanbul ignore next */ []));
|
|
5996
6135
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -6060,17 +6199,22 @@ const noop$b = () => { };
|
|
|
6060
6199
|
* (arrows, Home/End, Enter, Escape) and outside-click close. SSR-safe.
|
|
6061
6200
|
*/
|
|
6062
6201
|
class BuiSelect {
|
|
6202
|
+
/** Selected option value (single mode). Two-way bindable with `[(value)]`. */
|
|
6063
6203
|
value = model('', /* @ts-ignore */
|
|
6064
6204
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
6065
6205
|
/** Select several options; binds `values` instead of `value`. */
|
|
6066
6206
|
multiple = input(false, /* @ts-ignore */
|
|
6067
6207
|
...(ngDevMode ? [{ debugName: "multiple" }] : /* istanbul ignore next */ []));
|
|
6208
|
+
/** Selected option values (multiple mode). Two-way bindable with `[(values)]`. */
|
|
6068
6209
|
values = model([], /* @ts-ignore */
|
|
6069
6210
|
...(ngDevMode ? [{ debugName: "values" }] : /* istanbul ignore next */ []));
|
|
6211
|
+
/** Available options to choose from. */
|
|
6070
6212
|
options = input([], /* @ts-ignore */
|
|
6071
6213
|
...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
|
|
6214
|
+
/** Text shown on the trigger when nothing is selected. */
|
|
6072
6215
|
placeholder = input('Select…', /* @ts-ignore */
|
|
6073
6216
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
6217
|
+
/** Whether the select is disabled. Two-way bindable with `[(disabled)]`. */
|
|
6074
6218
|
disabled = model(false, /* @ts-ignore */
|
|
6075
6219
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
6076
6220
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -6446,11 +6590,14 @@ const VARIANTS$1 = {
|
|
|
6446
6590
|
* `threshold` px. SSR-safe — the scroll position is only read in the browser.
|
|
6447
6591
|
*/
|
|
6448
6592
|
class BuiBackToTop {
|
|
6593
|
+
/** Pixel scroll distance before the button appears. */
|
|
6449
6594
|
threshold = input(300, /* @ts-ignore */
|
|
6450
6595
|
...(ngDevMode ? [{ debugName: "threshold" }] : /* istanbul ignore next */ []));
|
|
6596
|
+
/** Visual style of the button. */
|
|
6451
6597
|
variant = input('primary', /* @ts-ignore */
|
|
6452
6598
|
...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
6453
6599
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
6600
|
+
/** Accessible label for the button; falls back to the i18n default. */
|
|
6454
6601
|
label = input(/* @ts-ignore */
|
|
6455
6602
|
...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
|
|
6456
6603
|
labelText = buiLabel('backToTop', this.label);
|
|
@@ -6539,17 +6686,22 @@ const noop$a = () => { };
|
|
|
6539
6686
|
* filtered listbox, using the `aria-activedescendant` pattern. Full keyboard + outside-click.
|
|
6540
6687
|
*/
|
|
6541
6688
|
class BuiCombobox {
|
|
6689
|
+
/** Selected option value (single mode). Two-way bindable with `[(value)]`. */
|
|
6542
6690
|
value = model('', /* @ts-ignore */
|
|
6543
6691
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
6544
6692
|
/** Select several options; binds `values` instead of `value`. */
|
|
6545
6693
|
multiple = input(false, /* @ts-ignore */
|
|
6546
6694
|
...(ngDevMode ? [{ debugName: "multiple" }] : /* istanbul ignore next */ []));
|
|
6695
|
+
/** Selected option values (multiple mode). Two-way bindable with `[(values)]`. */
|
|
6547
6696
|
values = model([], /* @ts-ignore */
|
|
6548
6697
|
...(ngDevMode ? [{ debugName: "values" }] : /* istanbul ignore next */ []));
|
|
6698
|
+
/** Available options to filter and choose from. */
|
|
6549
6699
|
options = input([], /* @ts-ignore */
|
|
6550
6700
|
...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
|
|
6701
|
+
/** Placeholder text shown in the search input. */
|
|
6551
6702
|
placeholder = input('Search…', /* @ts-ignore */
|
|
6552
6703
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
6704
|
+
/** Whether the combobox is disabled. Two-way bindable with `[(disabled)]`. */
|
|
6553
6705
|
disabled = model(false, /* @ts-ignore */
|
|
6554
6706
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
6555
6707
|
/** When false, the field can't be typed in — it just opens the full list (select-like). */
|
|
@@ -6852,8 +7004,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
6852
7004
|
|
|
6853
7005
|
/** A live countdown to a target time (`role="timer"`). SSR-safe — ticks only in the browser. */
|
|
6854
7006
|
class BuiCountdown {
|
|
7007
|
+
/** Target moment to count down to, as a Date, timestamp, or date string. */
|
|
6855
7008
|
to = input.required(/* @ts-ignore */
|
|
6856
7009
|
...(ngDevMode ? [{ debugName: "to" }] : /* istanbul ignore next */ []));
|
|
7010
|
+
/** Text shown once the target time has passed. */
|
|
6857
7011
|
expired = input('Expired', /* @ts-ignore */
|
|
6858
7012
|
...(ngDevMode ? [{ debugName: "expired" }] : /* istanbul ignore next */ []));
|
|
6859
7013
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -6953,18 +7107,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
6953
7107
|
* `aria-hidden`; an sr-only span carries the final value (SSR/no-JS read the real number).
|
|
6954
7108
|
*/
|
|
6955
7109
|
class BuiNumberTicker {
|
|
7110
|
+
/** Target value to count up to. */
|
|
6956
7111
|
value = input(0, /* @ts-ignore */
|
|
6957
7112
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
7113
|
+
/** Starting value the animation counts from. */
|
|
6958
7114
|
from = input(0, /* @ts-ignore */
|
|
6959
7115
|
...(ngDevMode ? [{ debugName: "from" }] : /* istanbul ignore next */ []));
|
|
7116
|
+
/** Animation length in milliseconds; 0 snaps instantly. */
|
|
6960
7117
|
duration = input(1500, /* @ts-ignore */
|
|
6961
7118
|
...(ngDevMode ? [{ debugName: "duration" }] : /* istanbul ignore next */ []));
|
|
7119
|
+
/** Number of decimal places to display. */
|
|
6962
7120
|
decimals = input(0, /* @ts-ignore */
|
|
6963
7121
|
...(ngDevMode ? [{ debugName: "decimals" }] : /* istanbul ignore next */ []));
|
|
7122
|
+
/** Text prepended before the number. */
|
|
6964
7123
|
prefix = input('', /* @ts-ignore */
|
|
6965
7124
|
...(ngDevMode ? [{ debugName: "prefix" }] : /* istanbul ignore next */ []));
|
|
7125
|
+
/** Text appended after the number. */
|
|
6966
7126
|
suffix = input('', /* @ts-ignore */
|
|
6967
7127
|
...(ngDevMode ? [{ debugName: "suffix" }] : /* istanbul ignore next */ []));
|
|
7128
|
+
/** Thousands-group separator character. */
|
|
6968
7129
|
separator = input(',', /* @ts-ignore */
|
|
6969
7130
|
...(ngDevMode ? [{ debugName: "separator" }] : /* istanbul ignore next */ []));
|
|
6970
7131
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -7033,8 +7194,10 @@ const VARIANTS = {
|
|
|
7033
7194
|
};
|
|
7034
7195
|
/** A styled anchor. Set `external` for `target=_blank` + safe `rel`. */
|
|
7035
7196
|
class BuiLink {
|
|
7197
|
+
/** Visual style of the link: default, muted, or subtle. */
|
|
7036
7198
|
variant = input('default', /* @ts-ignore */
|
|
7037
7199
|
...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
7200
|
+
/** Whether the link is external, adding `target=_blank` and safe `rel`. */
|
|
7038
7201
|
external = input(false, /* @ts-ignore */
|
|
7039
7202
|
...(ngDevMode ? [{ debugName: "external" }] : /* istanbul ignore next */ []));
|
|
7040
7203
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -7068,14 +7231,19 @@ const PRESETS = {
|
|
|
7068
7231
|
};
|
|
7069
7232
|
/** Renders accessible text painted with a CSS gradient, with an optional shimmer. */
|
|
7070
7233
|
class BuiGradientText {
|
|
7234
|
+
/** Named colour preset used when from/via/to are not set. */
|
|
7071
7235
|
preset = input('brand', /* @ts-ignore */
|
|
7072
7236
|
...(ngDevMode ? [{ debugName: "preset" }] : /* istanbul ignore next */ []));
|
|
7237
|
+
/** Gradient start colour; overrides the preset's first stop. */
|
|
7073
7238
|
from = input(null, /* @ts-ignore */
|
|
7074
7239
|
...(ngDevMode ? [{ debugName: "from" }] : /* istanbul ignore next */ []));
|
|
7240
|
+
/** Gradient middle colour; overrides the preset's second stop. */
|
|
7075
7241
|
via = input(null, /* @ts-ignore */
|
|
7076
7242
|
...(ngDevMode ? [{ debugName: "via" }] : /* istanbul ignore next */ []));
|
|
7243
|
+
/** Gradient end colour; overrides the preset's third stop. */
|
|
7077
7244
|
to = input(null, /* @ts-ignore */
|
|
7078
7245
|
...(ngDevMode ? [{ debugName: "to" }] : /* istanbul ignore next */ []));
|
|
7246
|
+
/** Whether to animate a horizontal shimmer across the gradient. */
|
|
7079
7247
|
animate = input(false, /* @ts-ignore */
|
|
7080
7248
|
...(ngDevMode ? [{ debugName: "animate" }] : /* istanbul ignore next */ []));
|
|
7081
7249
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -7108,10 +7276,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
7108
7276
|
* Provide the title via the `heading` input or by projecting content.
|
|
7109
7277
|
*/
|
|
7110
7278
|
class BuiPageHeader {
|
|
7279
|
+
/** Title text rendered in the heading (alternative to projecting content). */
|
|
7111
7280
|
heading = input('', /* @ts-ignore */
|
|
7112
7281
|
...(ngDevMode ? [{ debugName: "heading" }] : /* istanbul ignore next */ []));
|
|
7282
|
+
/** Optional supporting text shown beneath the heading. */
|
|
7113
7283
|
description = input('', /* @ts-ignore */
|
|
7114
7284
|
...(ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []));
|
|
7285
|
+
/** Whether to render a bottom border separating the header from the page. */
|
|
7115
7286
|
separator = input(false, /* @ts-ignore */
|
|
7116
7287
|
...(ngDevMode ? [{ debugName: "separator" }] : /* istanbul ignore next */ []));
|
|
7117
7288
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -7159,12 +7330,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
7159
7330
|
|
|
7160
7331
|
/** A styled blockquote / testimonial with optional attribution (author, role, avatar). */
|
|
7161
7332
|
class BuiQuote {
|
|
7333
|
+
/** Name of the person credited in the attribution. */
|
|
7162
7334
|
author = input('', /* @ts-ignore */
|
|
7163
7335
|
...(ngDevMode ? [{ debugName: "author" }] : /* istanbul ignore next */ []));
|
|
7336
|
+
/** Role or title shown beneath the author. */
|
|
7164
7337
|
role = input('', /* @ts-ignore */
|
|
7165
7338
|
...(ngDevMode ? [{ debugName: "role" }] : /* istanbul ignore next */ []));
|
|
7339
|
+
/** URL of the author's avatar image. */
|
|
7166
7340
|
avatar = input('', /* @ts-ignore */
|
|
7167
7341
|
...(ngDevMode ? [{ debugName: "avatar" }] : /* istanbul ignore next */ []));
|
|
7342
|
+
/** Source URL for the quote, set as the blockquote's `cite` attribute. */
|
|
7168
7343
|
cite = input('', /* @ts-ignore */
|
|
7169
7344
|
...(ngDevMode ? [{ debugName: "cite" }] : /* istanbul ignore next */ []));
|
|
7170
7345
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -7260,14 +7435,19 @@ const SIZES$2 = { sm: 'text-sm', default: 'text-base', lg: 'text-2xl' };
|
|
|
7260
7435
|
const COMPARE_SIZES = { sm: 'text-xs', default: 'text-sm', lg: 'text-base' };
|
|
7261
7436
|
/** A price display with optional compare-at (strikethrough) and a discount badge. */
|
|
7262
7437
|
class BuiPrice {
|
|
7438
|
+
/** Current price amount to display. */
|
|
7263
7439
|
amount = input(0, /* @ts-ignore */
|
|
7264
7440
|
...(ngDevMode ? [{ debugName: "amount" }] : /* istanbul ignore next */ []));
|
|
7441
|
+
/** Original price; when higher than amount, shows as struck-through. */
|
|
7265
7442
|
compareAt = input(null, /* @ts-ignore */
|
|
7266
7443
|
...(ngDevMode ? [{ debugName: "compareAt" }] : /* istanbul ignore next */ []));
|
|
7444
|
+
/** Currency symbol prefixed to each value. */
|
|
7267
7445
|
currency = input('$', /* @ts-ignore */
|
|
7268
7446
|
...(ngDevMode ? [{ debugName: "currency" }] : /* istanbul ignore next */ []));
|
|
7447
|
+
/** Text size preset for the price. */
|
|
7269
7448
|
size = input('default', /* @ts-ignore */
|
|
7270
7449
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
7450
|
+
/** Whether to show the percentage-off discount badge when on sale. */
|
|
7271
7451
|
showDiscount = input(true, /* @ts-ignore */
|
|
7272
7452
|
...(ngDevMode ? [{ debugName: "showDiscount" }] : /* istanbul ignore next */ []));
|
|
7273
7453
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -7363,14 +7543,19 @@ const JUSTIFY = {
|
|
|
7363
7543
|
};
|
|
7364
7544
|
/** A flexbox stack layout helper (direction, gap, alignment). */
|
|
7365
7545
|
class BuiStack {
|
|
7546
|
+
/** Flex direction: vertical (`col`) or horizontal (`row`). */
|
|
7366
7547
|
direction = input('col', /* @ts-ignore */
|
|
7367
7548
|
...(ngDevMode ? [{ debugName: "direction" }] : /* istanbul ignore next */ []));
|
|
7549
|
+
/** Spacing between items, as a Tailwind gap step. */
|
|
7368
7550
|
gap = input('4', /* @ts-ignore */
|
|
7369
7551
|
...(ngDevMode ? [{ debugName: "gap" }] : /* istanbul ignore next */ []));
|
|
7552
|
+
/** Cross-axis alignment (`start`/`center`/`end`/`stretch`/`baseline`). */
|
|
7370
7553
|
align = input('', /* @ts-ignore */
|
|
7371
7554
|
...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
|
|
7555
|
+
/** Main-axis distribution (`start`/`center`/`end`/`between`/`around`/`evenly`). */
|
|
7372
7556
|
justify = input('', /* @ts-ignore */
|
|
7373
7557
|
...(ngDevMode ? [{ debugName: "justify" }] : /* istanbul ignore next */ []));
|
|
7558
|
+
/** Whether items wrap onto multiple lines when they overflow. */
|
|
7374
7559
|
wrap = input(false, /* @ts-ignore */
|
|
7375
7560
|
...(ngDevMode ? [{ debugName: "wrap" }] : /* istanbul ignore next */ []));
|
|
7376
7561
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -7392,8 +7577,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
7392
7577
|
* design tokens locally. Renders as `display: contents` so it adds no box.
|
|
7393
7578
|
*/
|
|
7394
7579
|
class BuiAccent {
|
|
7580
|
+
/** Accent color applied to the primary tokens; `null` leaves the theme unchanged. */
|
|
7395
7581
|
color = input(null, /* @ts-ignore */
|
|
7396
7582
|
...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
|
|
7583
|
+
/** Foreground color paired with the accent for text/icons on accented surfaces. */
|
|
7397
7584
|
foreground = input('#ffffff', /* @ts-ignore */
|
|
7398
7585
|
...(ngDevMode ? [{ debugName: "foreground" }] : /* istanbul ignore next */ []));
|
|
7399
7586
|
styleVars = computed(() => {
|
|
@@ -7442,14 +7629,19 @@ const LABELS = { online: 'Online', away: 'Away', busy: 'Busy', offline: 'Offline
|
|
|
7442
7629
|
const SIZES$1 = { sm: 'size-2', default: 'size-2.5', lg: 'size-3' };
|
|
7443
7630
|
/** A small status dot (online/away/busy/offline). Status is never colour-only — the label is always present. */
|
|
7444
7631
|
class BuiPresence {
|
|
7632
|
+
/** Presence state, which sets the dot color and default label. */
|
|
7445
7633
|
status = input('online', /* @ts-ignore */
|
|
7446
7634
|
...(ngDevMode ? [{ debugName: "status" }] : /* istanbul ignore next */ []));
|
|
7635
|
+
/** Size preset for the status dot. */
|
|
7447
7636
|
size = input('default', /* @ts-ignore */
|
|
7448
7637
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
7638
|
+
/** Whether to show a pulsing ping animation (only when `online`). */
|
|
7449
7639
|
pulse = input(false, /* @ts-ignore */
|
|
7450
7640
|
...(ngDevMode ? [{ debugName: "pulse" }] : /* istanbul ignore next */ []));
|
|
7641
|
+
/** Custom label text; defaults to the status name. */
|
|
7451
7642
|
label = input('', /* @ts-ignore */
|
|
7452
7643
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
7644
|
+
/** Whether to render the label visibly; otherwise it stays screen-reader only. */
|
|
7453
7645
|
showLabel = input(false, /* @ts-ignore */
|
|
7454
7646
|
...(ngDevMode ? [{ debugName: "showLabel" }] : /* istanbul ignore next */ []));
|
|
7455
7647
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -7519,10 +7711,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
7519
7711
|
|
|
7520
7712
|
/** A single timeline entry: a dot + connector line and a content area. */
|
|
7521
7713
|
class BuiTimelineItem {
|
|
7714
|
+
/** Timestamp label shown above the entry's title. */
|
|
7522
7715
|
time = input('', /* @ts-ignore */
|
|
7523
7716
|
...(ngDevMode ? [{ debugName: "time" }] : /* istanbul ignore next */ []));
|
|
7717
|
+
/** Heading text for the entry. */
|
|
7524
7718
|
title = input('', /* @ts-ignore */
|
|
7525
7719
|
...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
7720
|
+
/** Whether to highlight this entry as the current/active step. */
|
|
7526
7721
|
active = input(false, /* @ts-ignore */
|
|
7527
7722
|
...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
|
|
7528
7723
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -7602,8 +7797,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
7602
7797
|
|
|
7603
7798
|
/** A description list (`<dl>`). Children should be `bui-description-item`. */
|
|
7604
7799
|
class BuiDescriptionList {
|
|
7800
|
+
/** Arrangement of each item's term and description, side by side or stacked. */
|
|
7605
7801
|
layout = input('horizontal', /* @ts-ignore */
|
|
7606
7802
|
...(ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []));
|
|
7803
|
+
/** Whether to render a bordered card with dividers between items. */
|
|
7607
7804
|
bordered = input(false, /* @ts-ignore */
|
|
7608
7805
|
...(ngDevMode ? [{ debugName: "bordered" }] : /* istanbul ignore next */ []));
|
|
7609
7806
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -7624,6 +7821,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
7624
7821
|
|
|
7625
7822
|
/** A term/description row. Inherits horizontal/bordered layout from its parent list. */
|
|
7626
7823
|
class BuiDescriptionItem {
|
|
7824
|
+
/** The term label shown in the row's `<dt>`. */
|
|
7627
7825
|
term = input('', /* @ts-ignore */
|
|
7628
7826
|
...(ngDevMode ? [{ debugName: "term" }] : /* istanbul ignore next */ []));
|
|
7629
7827
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -7672,8 +7870,10 @@ const GAPS = {
|
|
|
7672
7870
|
};
|
|
7673
7871
|
/** A Pinterest-style masonry grid using native CSS multi-column layout. */
|
|
7674
7872
|
class BuiMasonry {
|
|
7873
|
+
/** Maximum number of columns at the widest breakpoint (1-6, responsive). */
|
|
7675
7874
|
columns = input(3, /* @ts-ignore */
|
|
7676
7875
|
...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
|
|
7876
|
+
/** Spacing between items, as a Tailwind spacing key ('0', '2', '3', '4', '6', '8'). */
|
|
7677
7877
|
gap = input('4', /* @ts-ignore */
|
|
7678
7878
|
...(ngDevMode ? [{ debugName: "gap" }] : /* istanbul ignore next */ []));
|
|
7679
7879
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -7697,6 +7897,7 @@ const COLUMNS$1 = {
|
|
|
7697
7897
|
};
|
|
7698
7898
|
/** A bento grid container. Use `bui-bento-item` for cells. */
|
|
7699
7899
|
class BuiBentoGrid {
|
|
7900
|
+
/** Number of columns at the largest breakpoint (2, 3 or 4). */
|
|
7700
7901
|
columns = input(3, /* @ts-ignore */
|
|
7701
7902
|
...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
|
|
7702
7903
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -7717,12 +7918,16 @@ const COL_SPAN = { 1: '', 2: 'lg:col-span-2', 3: 'lg:col-span-3' };
|
|
|
7717
7918
|
const ROW_SPAN = { 1: '', 2: 'row-span-2' };
|
|
7718
7919
|
/** A bento grid cell with optional title/description and configurable span. */
|
|
7719
7920
|
class BuiBentoItem {
|
|
7921
|
+
/** Optional heading rendered above the projected content. */
|
|
7720
7922
|
title = input('', /* @ts-ignore */
|
|
7721
7923
|
...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
7924
|
+
/** Optional muted description rendered below the title. */
|
|
7722
7925
|
description = input('', /* @ts-ignore */
|
|
7723
7926
|
...(ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []));
|
|
7927
|
+
/** How many grid columns the cell spans (1-3). */
|
|
7724
7928
|
colSpan = input(1, /* @ts-ignore */
|
|
7725
7929
|
...(ngDevMode ? [{ debugName: "colSpan" }] : /* istanbul ignore next */ []));
|
|
7930
|
+
/** How many grid rows the cell spans (1-2). */
|
|
7726
7931
|
rowSpan = input(1, /* @ts-ignore */
|
|
7727
7932
|
...(ngDevMode ? [{ debugName: "rowSpan" }] : /* istanbul ignore next */ []));
|
|
7728
7933
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -7766,10 +7971,13 @@ const COLUMNS = {
|
|
|
7766
7971
|
};
|
|
7767
7972
|
/** A responsive thumbnail grid. */
|
|
7768
7973
|
class BuiGallery {
|
|
7974
|
+
/** Images to display, given as URLs or `GalleryImage` objects. */
|
|
7769
7975
|
images = input([], /* @ts-ignore */
|
|
7770
7976
|
...(ngDevMode ? [{ debugName: "images" }] : /* istanbul ignore next */ []));
|
|
7977
|
+
/** Number of grid columns (1-6). */
|
|
7771
7978
|
columns = input(3, /* @ts-ignore */
|
|
7772
7979
|
...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
|
|
7980
|
+
/** Tailwind class controlling thumbnail corner rounding. */
|
|
7773
7981
|
rounded = input('rounded-lg', /* @ts-ignore */
|
|
7774
7982
|
...(ngDevMode ? [{ debugName: "rounded" }] : /* istanbul ignore next */ []));
|
|
7775
7983
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -7803,10 +8011,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
7803
8011
|
|
|
7804
8012
|
/** A veil with a spinner shown over its projected content while `show` is true. */
|
|
7805
8013
|
class BuiLoadingOverlay {
|
|
8014
|
+
/** Whether the loading veil is shown over the projected content. */
|
|
7806
8015
|
show = input(false, /* @ts-ignore */
|
|
7807
8016
|
...(ngDevMode ? [{ debugName: "show" }] : /* istanbul ignore next */ []));
|
|
8017
|
+
/** Text shown beneath the spinner; defaults to "Loading…" when empty. */
|
|
7808
8018
|
message = input('', /* @ts-ignore */
|
|
7809
8019
|
...(ngDevMode ? [{ debugName: "message" }] : /* istanbul ignore next */ []));
|
|
8020
|
+
/** Whether the veil blurs the content behind it. */
|
|
7810
8021
|
blur = input(true, /* @ts-ignore */
|
|
7811
8022
|
...(ngDevMode ? [{ debugName: "blur" }] : /* istanbul ignore next */ []));
|
|
7812
8023
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -7896,22 +8107,31 @@ const INPUT_SIZE = {
|
|
|
7896
8107
|
};
|
|
7897
8108
|
/** A numeric stepper: − / + buttons around a number field, with min/max/step clamping. */
|
|
7898
8109
|
class BuiNumberInput {
|
|
8110
|
+
/** Current number. Two-way bindable with `[(value)]`. */
|
|
7899
8111
|
value = model(0, /* @ts-ignore */
|
|
7900
8112
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
8113
|
+
/** Minimum allowed value, or null for no lower bound. */
|
|
7901
8114
|
min = input(null, /* @ts-ignore */
|
|
7902
8115
|
...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
|
|
8116
|
+
/** Maximum allowed value, or null for no upper bound. */
|
|
7903
8117
|
max = input(null, /* @ts-ignore */
|
|
7904
8118
|
...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
|
|
8119
|
+
/** Amount added or subtracted per step. */
|
|
7905
8120
|
stepBy = input(1, { ...(ngDevMode ? { debugName: "stepBy" } : /* istanbul ignore next */ {}), alias: 'step' });
|
|
8121
|
+
/** Whether the control is disabled. Two-way bindable with `[(disabled)]`. */
|
|
7906
8122
|
disabled = model(false, /* @ts-ignore */
|
|
7907
8123
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
8124
|
+
/** Size preset controlling stepper button and field dimensions. */
|
|
7908
8125
|
size = input('default', /* @ts-ignore */
|
|
7909
8126
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
8127
|
+
/** Accessible label for the number field. */
|
|
7910
8128
|
ariaLabel = input('', /* @ts-ignore */
|
|
7911
8129
|
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
7912
8130
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
8131
|
+
/** Accessible label override for the decrease button. */
|
|
7913
8132
|
decreaseLabel = input(/* @ts-ignore */
|
|
7914
8133
|
...(ngDevMode ? [undefined, { debugName: "decreaseLabel" }] : /* istanbul ignore next */ []));
|
|
8134
|
+
/** Accessible label override for the increase button. */
|
|
7915
8135
|
increaseLabel = input(/* @ts-ignore */
|
|
7916
8136
|
...(ngDevMode ? [undefined, { debugName: "increaseLabel" }] : /* istanbul ignore next */ []));
|
|
7917
8137
|
decreaseText = buiLabel('numberInputDecrease', this.decreaseLabel);
|
|
@@ -8093,14 +8313,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
8093
8313
|
|
|
8094
8314
|
/** A radio-group of product variants, rendered as pills or colour swatches. */
|
|
8095
8315
|
class BuiVariantSelector {
|
|
8316
|
+
/** Selected variant value. Two-way bindable with `[(value)]`. */
|
|
8096
8317
|
value = model('', /* @ts-ignore */
|
|
8097
8318
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
8319
|
+
/** Available options, as plain strings or `VariantOption` objects. */
|
|
8098
8320
|
options = input([], /* @ts-ignore */
|
|
8099
8321
|
...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
|
|
8322
|
+
/** Render style: text pills or colour swatches. */
|
|
8100
8323
|
type = input('pill', /* @ts-ignore */
|
|
8101
8324
|
...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
|
|
8325
|
+
/** Accessible label for the radio group. */
|
|
8102
8326
|
label = input('Variant', /* @ts-ignore */
|
|
8103
8327
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
8328
|
+
/** Whether the whole group is disabled. */
|
|
8104
8329
|
disabled = input(false, /* @ts-ignore */
|
|
8105
8330
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
8106
8331
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -8219,16 +8444,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
8219
8444
|
|
|
8220
8445
|
/** A tiny inline SVG trend chart (line + optional area). Pure, SSR-safe. */
|
|
8221
8446
|
class BuiSparkline {
|
|
8447
|
+
/** Numeric series to plot; needs at least two points to render. */
|
|
8222
8448
|
data = input([], /* @ts-ignore */
|
|
8223
8449
|
...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
|
|
8450
|
+
/** SVG width in pixels. */
|
|
8224
8451
|
width = input(100, /* @ts-ignore */
|
|
8225
8452
|
...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
|
|
8453
|
+
/** SVG height in pixels. */
|
|
8226
8454
|
height = input(28, /* @ts-ignore */
|
|
8227
8455
|
...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
|
|
8456
|
+
/** Whether to draw the translucent area fill under the line. */
|
|
8228
8457
|
area = input(true, /* @ts-ignore */
|
|
8229
8458
|
...(ngDevMode ? [{ debugName: "area" }] : /* istanbul ignore next */ []));
|
|
8459
|
+
/** Line stroke width in pixels (also used as edge padding). */
|
|
8230
8460
|
strokeWidth = input(1.5, /* @ts-ignore */
|
|
8231
8461
|
...(ngDevMode ? [{ debugName: "strokeWidth" }] : /* istanbul ignore next */ []));
|
|
8462
|
+
/** Accessible label for the sparkline's `aria-label`. */
|
|
8232
8463
|
ariaLabel = input('Trend', /* @ts-ignore */
|
|
8233
8464
|
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
8234
8465
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -8335,13 +8566,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
8335
8566
|
const SIZES = { default: 'h-9 px-4 py-2', sm: 'h-8 gap-1.5 px-3', lg: 'h-10 px-6' };
|
|
8336
8567
|
/** A stateful add-to-cart button: idle → adding → added → idle. Emits `triggered` on click. */
|
|
8337
8568
|
class BuiAddToCart {
|
|
8569
|
+
/** Button text shown in the idle and adding states. */
|
|
8338
8570
|
label = input('Add to cart', /* @ts-ignore */
|
|
8339
8571
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
8572
|
+
/** Button text shown briefly in the added (success) state. */
|
|
8340
8573
|
addedLabel = input('Added', /* @ts-ignore */
|
|
8341
8574
|
...(ngDevMode ? [{ debugName: "addedLabel" }] : /* istanbul ignore next */ []));
|
|
8575
|
+
/** Size preset controlling height and padding. */
|
|
8342
8576
|
size = input('default', /* @ts-ignore */
|
|
8343
8577
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
8344
8578
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
8579
|
+
/** Emitted when the button is clicked to add the item. */
|
|
8345
8580
|
triggered = output();
|
|
8346
8581
|
state = signal('idle', /* @ts-ignore */
|
|
8347
8582
|
...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
|
|
@@ -8516,18 +8751,25 @@ const TEXT_COLORS = [
|
|
|
8516
8751
|
];
|
|
8517
8752
|
/** A password field with a live strength meter and (optional) requirement checklist. */
|
|
8518
8753
|
class BuiPasswordStrength {
|
|
8754
|
+
/** Current password value. Two-way bindable with `[(password)]`. */
|
|
8519
8755
|
password = model('', /* @ts-ignore */
|
|
8520
8756
|
...(ngDevMode ? [{ debugName: "password" }] : /* istanbul ignore next */ []));
|
|
8757
|
+
/** Native `name` attribute for the input. */
|
|
8521
8758
|
name = input('password', /* @ts-ignore */
|
|
8522
8759
|
...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
8760
|
+
/** Input `id`; defaults to `name` when empty. */
|
|
8523
8761
|
id = input('', /* @ts-ignore */
|
|
8524
8762
|
...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
|
|
8763
|
+
/** Placeholder text for the input. */
|
|
8525
8764
|
placeholder = input('••••••••', /* @ts-ignore */
|
|
8526
8765
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
8766
|
+
/** Whether the requirement checklist is shown. */
|
|
8527
8767
|
showChecklist = input(true, /* @ts-ignore */
|
|
8528
8768
|
...(ngDevMode ? [{ debugName: "showChecklist" }] : /* istanbul ignore next */ []));
|
|
8769
|
+
/** Minimum length required to satisfy the length rule. */
|
|
8529
8770
|
minLength = input(8, /* @ts-ignore */
|
|
8530
8771
|
...(ngDevMode ? [{ debugName: "minLength" }] : /* istanbul ignore next */ []));
|
|
8772
|
+
/** Accessible label for the input. */
|
|
8531
8773
|
label = input('Password', /* @ts-ignore */
|
|
8532
8774
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
8533
8775
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -8705,31 +8947,44 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
8705
8947
|
|
|
8706
8948
|
/** A product card: image, badge, wishlist, title, rating, price, and an action slot. */
|
|
8707
8949
|
class BuiProductCard {
|
|
8950
|
+
/** Product title shown as the card heading. */
|
|
8708
8951
|
title = input('', /* @ts-ignore */
|
|
8709
8952
|
...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
8953
|
+
/** Optional link; when set the title becomes an anchor to this URL. */
|
|
8710
8954
|
href = input('', /* @ts-ignore */
|
|
8711
8955
|
...(ngDevMode ? [{ debugName: "href" }] : /* istanbul ignore next */ []));
|
|
8956
|
+
/** Source URL of the product image. */
|
|
8712
8957
|
image = input('', /* @ts-ignore */
|
|
8713
8958
|
...(ngDevMode ? [{ debugName: "image" }] : /* istanbul ignore next */ []));
|
|
8959
|
+
/** Alt text for the image; falls back to the title when empty. */
|
|
8714
8960
|
imageAlt = input('', /* @ts-ignore */
|
|
8715
8961
|
...(ngDevMode ? [{ debugName: "imageAlt" }] : /* istanbul ignore next */ []));
|
|
8962
|
+
/** Current price; hides the price block when null. */
|
|
8716
8963
|
price = input(null, /* @ts-ignore */
|
|
8717
8964
|
...(ngDevMode ? [{ debugName: "price" }] : /* istanbul ignore next */ []));
|
|
8965
|
+
/** Original price for showing a strikethrough and discount. */
|
|
8718
8966
|
compareAt = input(null, /* @ts-ignore */
|
|
8719
8967
|
...(ngDevMode ? [{ debugName: "compareAt" }] : /* istanbul ignore next */ []));
|
|
8968
|
+
/** Currency symbol prefixed to the price. */
|
|
8720
8969
|
currency = input('$', /* @ts-ignore */
|
|
8721
8970
|
...(ngDevMode ? [{ debugName: "currency" }] : /* istanbul ignore next */ []));
|
|
8971
|
+
/** Badge text; auto-coloured for sale/new keywords. */
|
|
8722
8972
|
badge = input('', /* @ts-ignore */
|
|
8723
8973
|
...(ngDevMode ? [{ debugName: "badge" }] : /* istanbul ignore next */ []));
|
|
8974
|
+
/** Small category label shown above the title. */
|
|
8724
8975
|
category = input('', /* @ts-ignore */
|
|
8725
8976
|
...(ngDevMode ? [{ debugName: "category" }] : /* istanbul ignore next */ []));
|
|
8977
|
+
/** Star rating value; hides the rating row when null. */
|
|
8726
8978
|
rating = input(null, /* @ts-ignore */
|
|
8727
8979
|
...(ngDevMode ? [{ debugName: "rating" }] : /* istanbul ignore next */ []));
|
|
8980
|
+
/** Review count shown next to the rating, when set. */
|
|
8728
8981
|
reviews = input(null, /* @ts-ignore */
|
|
8729
8982
|
...(ngDevMode ? [{ debugName: "reviews" }] : /* istanbul ignore next */ []));
|
|
8983
|
+
/** Whether to show the wishlist (heart) toggle button. */
|
|
8730
8984
|
wishlist = input(false, /* @ts-ignore */
|
|
8731
8985
|
...(ngDevMode ? [{ debugName: "wishlist" }] : /* istanbul ignore next */ []));
|
|
8732
8986
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
8987
|
+
/** Accessible label override for the wishlist toggle button. */
|
|
8733
8988
|
wishlistLabel = input(/* @ts-ignore */
|
|
8734
8989
|
...(ngDevMode ? [undefined, { debugName: "wishlistLabel" }] : /* istanbul ignore next */ []));
|
|
8735
8990
|
wishlistText = buiLabel('productCardWishlist', this.wishlistLabel);
|
|
@@ -8916,16 +9171,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
8916
9171
|
* span carries the full word list so assistive tech reads it once. SSR-safe.
|
|
8917
9172
|
*/
|
|
8918
9173
|
class BuiTypewriter {
|
|
9174
|
+
/** Words cycled through by the typewriter. */
|
|
8919
9175
|
words = input([], /* @ts-ignore */
|
|
8920
9176
|
...(ngDevMode ? [{ debugName: "words" }] : /* istanbul ignore next */ []));
|
|
9177
|
+
/** Delay between typed characters, in milliseconds. */
|
|
8921
9178
|
typeSpeed = input(90, /* @ts-ignore */
|
|
8922
9179
|
...(ngDevMode ? [{ debugName: "typeSpeed" }] : /* istanbul ignore next */ []));
|
|
9180
|
+
/** Delay between deleted characters, in milliseconds. */
|
|
8923
9181
|
deleteSpeed = input(40, /* @ts-ignore */
|
|
8924
9182
|
...(ngDevMode ? [{ debugName: "deleteSpeed" }] : /* istanbul ignore next */ []));
|
|
9183
|
+
/** Pause once a word is fully typed before deleting, in milliseconds. */
|
|
8925
9184
|
pause = input(1600, /* @ts-ignore */
|
|
8926
9185
|
...(ngDevMode ? [{ debugName: "pause" }] : /* istanbul ignore next */ []));
|
|
9186
|
+
/** Whether to restart from the first word after the last. */
|
|
8927
9187
|
loop = input(true, /* @ts-ignore */
|
|
8928
9188
|
...(ngDevMode ? [{ debugName: "loop" }] : /* istanbul ignore next */ []));
|
|
9189
|
+
/** Whether to show the blinking cursor after the text. */
|
|
8929
9190
|
cursor = input(true, /* @ts-ignore */
|
|
8930
9191
|
...(ngDevMode ? [{ debugName: "cursor" }] : /* istanbul ignore next */ []));
|
|
8931
9192
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -9022,14 +9283,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
9022
9283
|
* an `aria-live` region carries the full passage up front. SSR-safe.
|
|
9023
9284
|
*/
|
|
9024
9285
|
class BuiStreamingText {
|
|
9286
|
+
/** Full passage to reveal; also announced up front via an `aria-live` region. */
|
|
9025
9287
|
text = input('', /* @ts-ignore */
|
|
9026
9288
|
...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
|
|
9289
|
+
/** Delay in milliseconds between each revealed token. */
|
|
9027
9290
|
speed = input(18, /* @ts-ignore */
|
|
9028
9291
|
...(ngDevMode ? [{ debugName: "speed" }] : /* istanbul ignore next */ []));
|
|
9292
|
+
/** Delay in milliseconds before streaming begins. */
|
|
9029
9293
|
startDelay = input(0, /* @ts-ignore */
|
|
9030
9294
|
...(ngDevMode ? [{ debugName: "startDelay" }] : /* istanbul ignore next */ []));
|
|
9295
|
+
/** Granularity of the reveal — one character or one word at a time. */
|
|
9031
9296
|
by = input('char', /* @ts-ignore */
|
|
9032
9297
|
...(ngDevMode ? [{ debugName: "by" }] : /* istanbul ignore next */ []));
|
|
9298
|
+
/** Whether to show a blinking caret while streaming. */
|
|
9033
9299
|
caret = input(true, /* @ts-ignore */
|
|
9034
9300
|
...(ngDevMode ? [{ debugName: "caret" }] : /* istanbul ignore next */ []));
|
|
9035
9301
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -9104,10 +9370,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
9104
9370
|
|
|
9105
9371
|
/** A card whose border has a light beam continuously travelling around it. */
|
|
9106
9372
|
class BuiBorderBeam {
|
|
9373
|
+
/** Seconds for the beam to complete one full lap. */
|
|
9107
9374
|
duration = input(6, /* @ts-ignore */
|
|
9108
9375
|
...(ngDevMode ? [{ debugName: "duration" }] : /* istanbul ignore next */ []));
|
|
9376
|
+
/** Beam colour; defaults to the primary theme colour. */
|
|
9109
9377
|
color = input(null, /* @ts-ignore */
|
|
9110
9378
|
...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
|
|
9379
|
+
/** Border/beam thickness in pixels. */
|
|
9111
9380
|
size = input(2, /* @ts-ignore */
|
|
9112
9381
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
9113
9382
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -9140,8 +9409,10 @@ function pseudo(seed) {
|
|
|
9140
9409
|
}
|
|
9141
9410
|
/** Animated falling meteor streaks behind content. Decorative + SSR-safe. */
|
|
9142
9411
|
class BuiMeteors {
|
|
9412
|
+
/** Number of meteor streaks to render. */
|
|
9143
9413
|
count = input(20, /* @ts-ignore */
|
|
9144
9414
|
...(ngDevMode ? [{ debugName: "count" }] : /* istanbul ignore next */ []));
|
|
9415
|
+
/** Meteor colour; defaults to a translucent foreground tint. */
|
|
9145
9416
|
color = input(null, /* @ts-ignore */
|
|
9146
9417
|
...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
|
|
9147
9418
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -9199,8 +9470,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
9199
9470
|
|
|
9200
9471
|
/** An animated aurora / northern-lights gradient background with content overlaid. */
|
|
9201
9472
|
class BuiAurora {
|
|
9473
|
+
/** Blur radius of the aurora layer in pixels. */
|
|
9202
9474
|
blur = input(60, /* @ts-ignore */
|
|
9203
9475
|
...(ngDevMode ? [{ debugName: "blur" }] : /* istanbul ignore next */ []));
|
|
9476
|
+
/** Seconds for one full drift animation cycle. */
|
|
9204
9477
|
speed = input(12, /* @ts-ignore */
|
|
9205
9478
|
...(ngDevMode ? [{ debugName: "speed" }] : /* istanbul ignore next */ []));
|
|
9206
9479
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -9226,14 +9499,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
9226
9499
|
|
|
9227
9500
|
/** A seamless infinite scroll of `items` (logos, badges, testimonials…). */
|
|
9228
9501
|
class BuiMarquee {
|
|
9502
|
+
/** Items rendered in sequence and scrolled seamlessly. */
|
|
9229
9503
|
items = input([], /* @ts-ignore */
|
|
9230
9504
|
...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
9505
|
+
/** Scroll direction; `up`/`down` switch the marquee to a vertical track. */
|
|
9231
9506
|
direction = input('left', /* @ts-ignore */
|
|
9232
9507
|
...(ngDevMode ? [{ debugName: "direction" }] : /* istanbul ignore next */ []));
|
|
9508
|
+
/** Time for one full loop, as a CSS duration (e.g. `40s`). */
|
|
9233
9509
|
duration = input('40s', /* @ts-ignore */
|
|
9234
9510
|
...(ngDevMode ? [{ debugName: "duration" }] : /* istanbul ignore next */ []));
|
|
9511
|
+
/** Spacing between items, as a CSS length. */
|
|
9235
9512
|
gap = input('1rem', /* @ts-ignore */
|
|
9236
9513
|
...(ngDevMode ? [{ debugName: "gap" }] : /* istanbul ignore next */ []));
|
|
9514
|
+
/** Whether hovering pauses the scroll animation. */
|
|
9237
9515
|
pauseOnHover = input(true, /* @ts-ignore */
|
|
9238
9516
|
...(ngDevMode ? [{ debugName: "pauseOnHover" }] : /* istanbul ignore next */ []));
|
|
9239
9517
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -9313,6 +9591,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
9313
9591
|
|
|
9314
9592
|
/** A mobile bottom tab bar. Use `[buiBottomNavItem]` on each `<a>`/`<button>`. */
|
|
9315
9593
|
class BuiBottomNavigation {
|
|
9594
|
+
/** Accessible label applied to the navigation element. */
|
|
9316
9595
|
ariaLabel = input('Bottom navigation', /* @ts-ignore */
|
|
9317
9596
|
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
9318
9597
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -9335,10 +9614,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
9335
9614
|
|
|
9336
9615
|
/** A single bottom-navigation tab. Project the icon; pass `label`, `active`, `badge`. */
|
|
9337
9616
|
class BuiBottomNavigationItem {
|
|
9617
|
+
/** Caption shown beneath the projected icon; hidden when empty. */
|
|
9338
9618
|
label = input('', /* @ts-ignore */
|
|
9339
9619
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
9620
|
+
/** Whether this tab is the current page; sets `aria-current="page"`. */
|
|
9340
9621
|
active = input(false, /* @ts-ignore */
|
|
9341
9622
|
...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
|
|
9623
|
+
/** Badge content; `true` renders a dot, a string/number renders a count, `null` shows nothing. */
|
|
9342
9624
|
badge = input(null, /* @ts-ignore */
|
|
9343
9625
|
...(ngDevMode ? [{ debugName: "badge" }] : /* istanbul ignore next */ []));
|
|
9344
9626
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -9397,6 +9679,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
9397
9679
|
* viewport. Server-renders fully revealed (no-JS safe). SSR-safe.
|
|
9398
9680
|
*/
|
|
9399
9681
|
class BuiTextReveal {
|
|
9682
|
+
/** Text split into words that brighten one by one as it scrolls into view. */
|
|
9400
9683
|
text = input('', /* @ts-ignore */
|
|
9401
9684
|
...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
|
|
9402
9685
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -9456,8 +9739,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
9456
9739
|
|
|
9457
9740
|
/** Shifts its content relative to scroll for a depth/parallax effect. SSR-safe. */
|
|
9458
9741
|
class BuiParallax {
|
|
9742
|
+
/** Parallax intensity; higher moves content more per scroll. */
|
|
9459
9743
|
speed = input(0.3, /* @ts-ignore */
|
|
9460
9744
|
...(ngDevMode ? [{ debugName: "speed" }] : /* istanbul ignore next */ []));
|
|
9745
|
+
/** Axis along which the content shifts. */
|
|
9461
9746
|
axis = input('y', /* @ts-ignore */
|
|
9462
9747
|
...(ngDevMode ? [{ debugName: "axis" }] : /* istanbul ignore next */ []));
|
|
9463
9748
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -9502,9 +9787,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
9502
9787
|
|
|
9503
9788
|
/** A "on this page" nav that highlights the section currently in view (IntersectionObserver). */
|
|
9504
9789
|
class BuiScrollspy {
|
|
9790
|
+
/** Sections to track; each item links to and observes its `href` anchor. */
|
|
9505
9791
|
items = input([], /* @ts-ignore */
|
|
9506
9792
|
...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
9507
9793
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
9794
|
+
/** Accessible label for the nav element; falls back to a localized default. */
|
|
9508
9795
|
label = input(/* @ts-ignore */
|
|
9509
9796
|
...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
|
|
9510
9797
|
labelText = buiLabel('scrollspy', this.label);
|
|
@@ -9597,18 +9884,25 @@ const noop$8 = () => { };
|
|
|
9597
9884
|
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';
|
|
9598
9885
|
/** A styled time field: a native `<input type="time">`, or hour/minute selects in `select` mode. */
|
|
9599
9886
|
class BuiTimeField {
|
|
9887
|
+
/** Selected time as `HH:mm`. Two-way bindable with `[(value)]`. */
|
|
9600
9888
|
value = model('', /* @ts-ignore */
|
|
9601
9889
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
9890
|
+
/** Native `name` attribute for the input. */
|
|
9602
9891
|
name = input('', /* @ts-ignore */
|
|
9603
9892
|
...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
9893
|
+
/** Native `id` attribute for the input. */
|
|
9604
9894
|
id = input('', /* @ts-ignore */
|
|
9605
9895
|
...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
|
|
9896
|
+
/** Earliest allowed time (`HH:mm`) in `input` mode. */
|
|
9606
9897
|
min = input('', /* @ts-ignore */
|
|
9607
9898
|
...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
|
|
9899
|
+
/** Latest allowed time (`HH:mm`) in `input` mode. */
|
|
9608
9900
|
max = input('', /* @ts-ignore */
|
|
9609
9901
|
...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
|
|
9902
|
+
/** Whether to include seconds in `input` mode. */
|
|
9610
9903
|
seconds = input(false, /* @ts-ignore */
|
|
9611
9904
|
...(ngDevMode ? [{ debugName: "seconds" }] : /* istanbul ignore next */ []));
|
|
9905
|
+
/** Whether the field is disabled. Two-way bindable with `[(disabled)]`. */
|
|
9612
9906
|
disabled = model(false, /* @ts-ignore */
|
|
9613
9907
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
9614
9908
|
/** `select` renders hour + minute dropdowns instead of a native time input. */
|
|
@@ -9617,6 +9911,7 @@ class BuiTimeField {
|
|
|
9617
9911
|
/** Minute step used in `select` mode. */
|
|
9618
9912
|
minuteStep = input(5, /* @ts-ignore */
|
|
9619
9913
|
...(ngDevMode ? [{ debugName: "minuteStep" }] : /* istanbul ignore next */ []));
|
|
9914
|
+
/** Accessible label for the field. */
|
|
9620
9915
|
ariaLabel = input('', /* @ts-ignore */
|
|
9621
9916
|
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
9622
9917
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -9767,10 +10062,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
9767
10062
|
|
|
9768
10063
|
/** A group of toggle buttons (single or multiple selection). Use `button[buiToggleGroupItem]`. */
|
|
9769
10064
|
class BuiToggleGroup {
|
|
10065
|
+
/** Selection mode: single value or an array of values. */
|
|
9770
10066
|
type = input('single', /* @ts-ignore */
|
|
9771
10067
|
...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
|
|
10068
|
+
/** Selected value(s). Two-way bindable with `[(value)]`. */
|
|
9772
10069
|
value = model(null, /* @ts-ignore */
|
|
9773
10070
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
10071
|
+
/** Layout direction of the group. */
|
|
9774
10072
|
orientation = input('horizontal', /* @ts-ignore */
|
|
9775
10073
|
...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
|
|
9776
10074
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -9816,8 +10114,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
9816
10114
|
|
|
9817
10115
|
/** A single item within a `bui-toggle-group`. */
|
|
9818
10116
|
class BuiToggleGroupItem {
|
|
10117
|
+
/** Value this item contributes to the parent group's selection. */
|
|
9819
10118
|
value = input('', /* @ts-ignore */
|
|
9820
10119
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
10120
|
+
/** Whether this item is disabled. */
|
|
9821
10121
|
disabled = input(false, /* @ts-ignore */
|
|
9822
10122
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
9823
10123
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -9850,12 +10150,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
9850
10150
|
const noop$7 = () => { };
|
|
9851
10151
|
/** A free-text tags input: type and press Enter (or comma) to add chips; Backspace removes. */
|
|
9852
10152
|
class BuiTagsInput {
|
|
10153
|
+
/** Current tags. Two-way bindable with `[(tags)]`. */
|
|
9853
10154
|
tags = model([], /* @ts-ignore */
|
|
9854
10155
|
...(ngDevMode ? [{ debugName: "tags" }] : /* istanbul ignore next */ []));
|
|
10156
|
+
/** Placeholder text shown in the entry field. */
|
|
9855
10157
|
placeholder = input('Add tag…', /* @ts-ignore */
|
|
9856
10158
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
10159
|
+
/** Maximum number of tags allowed, or `null` for no limit. */
|
|
9857
10160
|
max = input(null, /* @ts-ignore */
|
|
9858
10161
|
...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
|
|
10162
|
+
/** Whether the input is disabled. Two-way bindable with `[(disabled)]`. */
|
|
9859
10163
|
disabled = model(false, /* @ts-ignore */
|
|
9860
10164
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
9861
10165
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -9980,10 +10284,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
9980
10284
|
|
|
9981
10285
|
/** Click-to-edit inline text: shows a value, swaps to an input on click. Enter commits, Escape cancels. */
|
|
9982
10286
|
class BuiEditable {
|
|
10287
|
+
/** Current text. Two-way bindable with `[(value)]`. */
|
|
9983
10288
|
value = model('', /* @ts-ignore */
|
|
9984
10289
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
10290
|
+
/** Text shown when the value is empty. */
|
|
9985
10291
|
placeholder = input('Empty', /* @ts-ignore */
|
|
9986
10292
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
10293
|
+
/** Noun used in the field's accessible label. */
|
|
9987
10294
|
label = input('value', /* @ts-ignore */
|
|
9988
10295
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
9989
10296
|
/** Edit in a multi-line textarea instead of a single-line input. */
|
|
@@ -10110,10 +10417,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
10110
10417
|
|
|
10111
10418
|
/** A floating action button that expands to a stack of actions. Closes on Escape / outside click. */
|
|
10112
10419
|
class BuiSpeedDial {
|
|
10420
|
+
/** Actions revealed when the dial expands. */
|
|
10113
10421
|
actions = input([], /* @ts-ignore */
|
|
10114
10422
|
...(ngDevMode ? [{ debugName: "actions" }] : /* istanbul ignore next */ []));
|
|
10423
|
+
/** Direction the action stack expands relative to the trigger button. */
|
|
10115
10424
|
direction = input('up', /* @ts-ignore */
|
|
10116
10425
|
...(ngDevMode ? [{ debugName: "direction" }] : /* istanbul ignore next */ []));
|
|
10426
|
+
/** Accessible label for the trigger button. */
|
|
10117
10427
|
label = input('Open actions', /* @ts-ignore */
|
|
10118
10428
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
10119
10429
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -10244,18 +10554,25 @@ const CIRC = 2 * Math.PI * RADIUS;
|
|
|
10244
10554
|
const ARC = CIRC * 0.75;
|
|
10245
10555
|
/** A rotary dial input (role="slider"). Drag, scroll, or use the keyboard. 270° sweep. */
|
|
10246
10556
|
class BuiKnob {
|
|
10557
|
+
/** Current value. Two-way bindable with `[(value)]`. */
|
|
10247
10558
|
value = model(50, /* @ts-ignore */
|
|
10248
10559
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
10560
|
+
/** Minimum value at the start of the dial's sweep. */
|
|
10249
10561
|
min = input(0, /* @ts-ignore */
|
|
10250
10562
|
...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
|
|
10563
|
+
/** Maximum value at the end of the dial's sweep. */
|
|
10251
10564
|
max = input(100, /* @ts-ignore */
|
|
10252
10565
|
...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
|
|
10566
|
+
/** Increment applied per arrow key, scroll or drag snap. */
|
|
10253
10567
|
step = input(1, /* @ts-ignore */
|
|
10254
10568
|
...(ngDevMode ? [{ debugName: "step" }] : /* istanbul ignore next */ []));
|
|
10569
|
+
/** Size preset controlling the knob's diameter and text size. */
|
|
10255
10570
|
size = input('default', /* @ts-ignore */
|
|
10256
10571
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
10572
|
+
/** Accessible label announced for the slider. */
|
|
10257
10573
|
label = input('Value', /* @ts-ignore */
|
|
10258
10574
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
10575
|
+
/** Whether the knob is disabled. Two-way bindable with `[(disabled)]`. */
|
|
10259
10576
|
disabled = model(false, /* @ts-ignore */
|
|
10260
10577
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
10261
10578
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -10500,16 +10817,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
10500
10817
|
|
|
10501
10818
|
/** A lazy image with a blurred placeholder / skeleton and a graceful error state. */
|
|
10502
10819
|
class BuiImage {
|
|
10820
|
+
/** Source URL of the full image to load. */
|
|
10503
10821
|
src = input('', /* @ts-ignore */
|
|
10504
10822
|
...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
|
|
10823
|
+
/** Alternative text for the image. */
|
|
10505
10824
|
alt = input('', /* @ts-ignore */
|
|
10506
10825
|
...(ngDevMode ? [{ debugName: "alt" }] : /* istanbul ignore next */ []));
|
|
10826
|
+
/** CSS `aspect-ratio` reserved for the image (e.g. `16 / 9`). */
|
|
10507
10827
|
ratio = input('', /* @ts-ignore */
|
|
10508
10828
|
...(ngDevMode ? [{ debugName: "ratio" }] : /* istanbul ignore next */ []));
|
|
10829
|
+
/** URL of a low-res image shown blurred while the full image loads. */
|
|
10509
10830
|
placeholder = input('', /* @ts-ignore */
|
|
10510
10831
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
10832
|
+
/** Tailwind class controlling corner rounding. */
|
|
10511
10833
|
rounded = input('rounded-lg', /* @ts-ignore */
|
|
10512
10834
|
...(ngDevMode ? [{ debugName: "rounded" }] : /* istanbul ignore next */ []));
|
|
10835
|
+
/** How the image fills its box: `cover` crops, `contain` letterboxes. */
|
|
10513
10836
|
fit = input('cover', /* @ts-ignore */
|
|
10514
10837
|
...(ngDevMode ? [{ debugName: "fit" }] : /* istanbul ignore next */ []));
|
|
10515
10838
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -10615,10 +10938,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
10615
10938
|
|
|
10616
10939
|
/** A collapsible "reasoning" / chain-of-thought disclosure. */
|
|
10617
10940
|
class BuiReasoning {
|
|
10941
|
+
/** Whether the disclosure is expanded. Two-way bindable with `[(open)]`. */
|
|
10618
10942
|
open = model(false, /* @ts-ignore */
|
|
10619
10943
|
...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
|
|
10944
|
+
/** Trigger label shown when no `duration` is set. */
|
|
10620
10945
|
label = input('Reasoning', /* @ts-ignore */
|
|
10621
10946
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
10947
|
+
/** When set, the trigger reads "Thought for {duration}" instead of `label`. */
|
|
10622
10948
|
duration = input('', /* @ts-ignore */
|
|
10623
10949
|
...(ngDevMode ? [{ debugName: "duration" }] : /* istanbul ignore next */ []));
|
|
10624
10950
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -10705,14 +11031,19 @@ const STATUS = {
|
|
|
10705
11031
|
};
|
|
10706
11032
|
/** An AI tool-call card with a status indicator and collapsible arguments / result. */
|
|
10707
11033
|
class BuiToolCall {
|
|
11034
|
+
/** Name of the invoked tool, shown as inline code in the header. */
|
|
10708
11035
|
name = input('tool', /* @ts-ignore */
|
|
10709
11036
|
...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
11037
|
+
/** Execution status; drives the colored status dot and label. */
|
|
10710
11038
|
status = input('success', /* @ts-ignore */
|
|
10711
11039
|
...(ngDevMode ? [{ debugName: "status" }] : /* istanbul ignore next */ []));
|
|
11040
|
+
/** Tool arguments shown in the collapsible body when present. */
|
|
10712
11041
|
args = input('', /* @ts-ignore */
|
|
10713
11042
|
...(ngDevMode ? [{ debugName: "args" }] : /* istanbul ignore next */ []));
|
|
11043
|
+
/** Tool result shown in the collapsible body when present. */
|
|
10714
11044
|
result = input('', /* @ts-ignore */
|
|
10715
11045
|
...(ngDevMode ? [{ debugName: "result" }] : /* istanbul ignore next */ []));
|
|
11046
|
+
/** Whether the arguments/result panel is expanded. Two-way bindable with `[(open)]`. */
|
|
10716
11047
|
open = model(false, /* @ts-ignore */
|
|
10717
11048
|
...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
|
|
10718
11049
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -10814,6 +11145,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
10814
11145
|
|
|
10815
11146
|
/** A scrollable conversation log (`role="log"`). Use `bui-chat-message` for bubbles. */
|
|
10816
11147
|
class BuiChat {
|
|
11148
|
+
/** Accessible label announced for the conversation log region. */
|
|
10817
11149
|
ariaLabel = input('Conversation', /* @ts-ignore */
|
|
10818
11150
|
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
10819
11151
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -10839,14 +11171,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
10839
11171
|
|
|
10840
11172
|
/** A chat bubble. `role="user"` aligns end with a primary bubble; otherwise assistant-styled. */
|
|
10841
11173
|
class BuiChatMessage {
|
|
11174
|
+
/** Author role; `'user'` aligns the bubble to the end with primary styling, else assistant-styled. */
|
|
10842
11175
|
role = input('assistant', /* @ts-ignore */
|
|
10843
11176
|
...(ngDevMode ? [{ debugName: "role" }] : /* istanbul ignore next */ []));
|
|
11177
|
+
/** Display name shown above the bubble; also seeds the fallback initials avatar. */
|
|
10844
11178
|
name = input('', /* @ts-ignore */
|
|
10845
11179
|
...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
11180
|
+
/** Optional timestamp text shown beside the name. */
|
|
10846
11181
|
time = input('', /* @ts-ignore */
|
|
10847
11182
|
...(ngDevMode ? [{ debugName: "time" }] : /* istanbul ignore next */ []));
|
|
11183
|
+
/** Avatar image URL; when empty, initials (or an emoji) are shown instead. */
|
|
10848
11184
|
avatar = input('', /* @ts-ignore */
|
|
10849
11185
|
...(ngDevMode ? [{ debugName: "avatar" }] : /* istanbul ignore next */ []));
|
|
11186
|
+
/** When true, shows an animated typing indicator instead of the message content. */
|
|
10850
11187
|
typing = input(false, /* @ts-ignore */
|
|
10851
11188
|
...(ngDevMode ? [{ debugName: "typing" }] : /* istanbul ignore next */ []));
|
|
10852
11189
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -10960,10 +11297,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
10960
11297
|
const PALETTE$1 = ['#6366f1', '#ec4899', '#f59e0b', '#10b981', '#3b82f6', '#ef4444'];
|
|
10961
11298
|
/** A celebratory particle burst. Project a trigger (or use the default button) to fire it. */
|
|
10962
11299
|
class BuiConfetti {
|
|
11300
|
+
/** Number of particles emitted per burst. */
|
|
10963
11301
|
count = input(80, /* @ts-ignore */
|
|
10964
11302
|
...(ngDevMode ? [{ debugName: "count" }] : /* istanbul ignore next */ []));
|
|
11303
|
+
/** Horizontal spread factor of the burst. */
|
|
10965
11304
|
spread = input(70, /* @ts-ignore */
|
|
10966
11305
|
...(ngDevMode ? [{ debugName: "spread" }] : /* istanbul ignore next */ []));
|
|
11306
|
+
/** Particle colours; defaults to the built-in palette. */
|
|
10967
11307
|
colors = input(null, /* @ts-ignore */
|
|
10968
11308
|
...(ngDevMode ? [{ debugName: "colors" }] : /* istanbul ignore next */ []));
|
|
10969
11309
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -11048,8 +11388,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
11048
11388
|
|
|
11049
11389
|
/** A step indicator. The `value` (1-based) marks the active step. Use `li[buiStepperItem]`. */
|
|
11050
11390
|
class BuiStepper {
|
|
11391
|
+
/** The active step as a 1-based index; items at lower values are marked completed. */
|
|
11051
11392
|
value = input(1, /* @ts-ignore */
|
|
11052
11393
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
11394
|
+
/** Layout direction of the steps, horizontal or vertical. */
|
|
11053
11395
|
orientation = input('horizontal', /* @ts-ignore */
|
|
11054
11396
|
...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
|
|
11055
11397
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -11094,6 +11436,7 @@ const INDICATOR = {
|
|
|
11094
11436
|
};
|
|
11095
11437
|
/** A single step within a `bui-stepper`. Resolves completed/active/inactive from the parent. */
|
|
11096
11438
|
class BuiStepperItem {
|
|
11439
|
+
/** This item's 1-based position; compared against the parent's value to derive its state. */
|
|
11097
11440
|
step = input(1, /* @ts-ignore */
|
|
11098
11441
|
...(ngDevMode ? [{ debugName: "step" }] : /* istanbul ignore next */ []));
|
|
11099
11442
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -11189,17 +11532,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
11189
11532
|
const noop$5 = () => { };
|
|
11190
11533
|
/** A one-time-password input: a row of single-character boxes with focus management + paste. */
|
|
11191
11534
|
class BuiInputOtp {
|
|
11535
|
+
/** Current code. Two-way bindable with `[(value)]`. */
|
|
11192
11536
|
value = model('', /* @ts-ignore */
|
|
11193
11537
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
11538
|
+
/** Number of character boxes (length of the code). */
|
|
11194
11539
|
maxlength = input(6, /* @ts-ignore */
|
|
11195
11540
|
...(ngDevMode ? [{ debugName: "maxlength" }] : /* istanbul ignore next */ []));
|
|
11541
|
+
/** Whether the input is disabled. Two-way bindable with `[(disabled)]`. */
|
|
11196
11542
|
disabled = model(false, /* @ts-ignore */
|
|
11197
11543
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
11544
|
+
/** Whether to allow letters as well as digits. */
|
|
11198
11545
|
alphanumeric = input(false, /* @ts-ignore */
|
|
11199
11546
|
...(ngDevMode ? [{ debugName: "alphanumeric" }] : /* istanbul ignore next */ []));
|
|
11200
11547
|
/** Insert a visual separator after every N boxes (0 = none). */
|
|
11201
11548
|
groupSize = input(0, /* @ts-ignore */
|
|
11202
11549
|
...(ngDevMode ? [{ debugName: "groupSize" }] : /* istanbul ignore next */ []));
|
|
11550
|
+
/** Base accessible label; each box appends its position. */
|
|
11203
11551
|
ariaLabel = input('One-time password', /* @ts-ignore */
|
|
11204
11552
|
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
11205
11553
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -11341,19 +11689,26 @@ const COUNTRIES = [
|
|
|
11341
11689
|
];
|
|
11342
11690
|
/** A phone number field with a country-code selector. */
|
|
11343
11691
|
class BuiPhoneInput {
|
|
11692
|
+
/** Entered phone number. Two-way bindable with `[(value)]`. */
|
|
11344
11693
|
value = model('', /* @ts-ignore */
|
|
11345
11694
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
11695
|
+
/** Selected country code. Two-way bindable with `[(country)]`. */
|
|
11346
11696
|
country = model('US', /* @ts-ignore */
|
|
11347
11697
|
...(ngDevMode ? [{ debugName: "country" }] : /* istanbul ignore next */ []));
|
|
11698
|
+
/** Name attribute applied to the number input for form submission. */
|
|
11348
11699
|
name = input('', /* @ts-ignore */
|
|
11349
11700
|
...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
11701
|
+
/** Id attribute applied to the number input. */
|
|
11350
11702
|
id = input('', /* @ts-ignore */
|
|
11351
11703
|
...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
|
|
11704
|
+
/** Placeholder text for the number input. */
|
|
11352
11705
|
placeholder = input('Phone number', /* @ts-ignore */
|
|
11353
11706
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
11354
11707
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
11708
|
+
/** Accessible label override for the country selector. */
|
|
11355
11709
|
countryLabel = input(/* @ts-ignore */
|
|
11356
11710
|
...(ngDevMode ? [undefined, { debugName: "countryLabel" }] : /* istanbul ignore next */ []));
|
|
11711
|
+
/** Accessible label override for the number input. */
|
|
11357
11712
|
numberLabel = input(/* @ts-ignore */
|
|
11358
11713
|
...(ngDevMode ? [undefined, { debugName: "numberLabel" }] : /* istanbul ignore next */ []));
|
|
11359
11714
|
countryText = buiLabel('phoneInputCountry', this.countryLabel);
|
|
@@ -11423,20 +11778,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
11423
11778
|
|
|
11424
11779
|
/** A chat composer: an autosizing textarea with a send button. Emits `submitted` on send. */
|
|
11425
11780
|
class BuiPromptInput {
|
|
11781
|
+
/** Current textarea content. Two-way bindable with `[(value)]`. */
|
|
11426
11782
|
value = model('', /* @ts-ignore */
|
|
11427
11783
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
11784
|
+
/** Placeholder text shown when the textarea is empty. */
|
|
11428
11785
|
placeholder = input('Send a message…', /* @ts-ignore */
|
|
11429
11786
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
11787
|
+
/** Whether to show the attachment button. */
|
|
11430
11788
|
attachable = input(false, /* @ts-ignore */
|
|
11431
11789
|
...(ngDevMode ? [{ debugName: "attachable" }] : /* istanbul ignore next */ []));
|
|
11790
|
+
/** Disables the textarea and send button. */
|
|
11432
11791
|
disabled = input(false, /* @ts-ignore */
|
|
11433
11792
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
11793
|
+
/** Accessible label for the message textarea. */
|
|
11434
11794
|
ariaLabel = input('Message', /* @ts-ignore */
|
|
11435
11795
|
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
11796
|
+
/** Overrides the localized accessible label for the attachment button. */
|
|
11436
11797
|
attachLabel = input(/* @ts-ignore */
|
|
11437
11798
|
...(ngDevMode ? [undefined, { debugName: "attachLabel" }] : /* istanbul ignore next */ []));
|
|
11799
|
+
/** Overrides the localized accessible label for the send button. */
|
|
11438
11800
|
sendLabel = input(/* @ts-ignore */
|
|
11439
11801
|
...(ngDevMode ? [undefined, { debugName: "sendLabel" }] : /* istanbul ignore next */ []));
|
|
11802
|
+
/** Emitted with the trimmed message text when the user sends. */
|
|
11440
11803
|
submitted = output();
|
|
11441
11804
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
11442
11805
|
attachText = buiLabel('promptInputAttach', this.attachLabel);
|
|
@@ -11606,6 +11969,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
11606
11969
|
|
|
11607
11970
|
/** A contribution-style heatmap grid (7 rows). Pass `data` or get a deterministic demo. */
|
|
11608
11971
|
class BuiHeatmap {
|
|
11972
|
+
/** Per-cell counts filled column-first; empty yields a demo dataset. */
|
|
11609
11973
|
data = input([], /* @ts-ignore */
|
|
11610
11974
|
...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
|
|
11611
11975
|
/** Smaller cells + tighter gaps. */
|
|
@@ -11682,12 +12046,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
11682
12046
|
|
|
11683
12047
|
/** An inline citation marker that reveals a source popover on hover / focus / click. */
|
|
11684
12048
|
class BuiCitation {
|
|
12049
|
+
/** Citation number shown in the inline `[n]` marker. */
|
|
11685
12050
|
index = input(1, /* @ts-ignore */
|
|
11686
12051
|
...(ngDevMode ? [{ debugName: "index" }] : /* istanbul ignore next */ []));
|
|
12052
|
+
/** Source title shown at the top of the popover. */
|
|
11687
12053
|
title = input('', /* @ts-ignore */
|
|
11688
12054
|
...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
12055
|
+
/** Source URL; its hostname is derived and shown in the popover. */
|
|
11689
12056
|
url = input('', /* @ts-ignore */
|
|
11690
12057
|
...(ngDevMode ? [{ debugName: "url" }] : /* istanbul ignore next */ []));
|
|
12058
|
+
/** Short excerpt from the source shown in the popover. */
|
|
11691
12059
|
snippet = input('', /* @ts-ignore */
|
|
11692
12060
|
...(ngDevMode ? [{ debugName: "snippet" }] : /* istanbul ignore next */ []));
|
|
11693
12061
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -11809,8 +12177,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
11809
12177
|
|
|
11810
12178
|
/** A two-panel resizable group. Hosts the shared size; the handle drags it. */
|
|
11811
12179
|
class BuiResizablePanelGroup {
|
|
12180
|
+
/** Layout axis the panels are arranged and resized along. */
|
|
11812
12181
|
direction = input('horizontal', /* @ts-ignore */
|
|
11813
12182
|
...(ngDevMode ? [{ debugName: "direction" }] : /* istanbul ignore next */ []));
|
|
12183
|
+
/** Size of the primary panel as a percentage (10-90). Two-way bindable with `[(size)]`. */
|
|
11814
12184
|
size = model(50, /* @ts-ignore */
|
|
11815
12185
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
11816
12186
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -11860,6 +12230,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
11860
12230
|
|
|
11861
12231
|
/** A panel inside a `bui-resizable-panel-group`. Mark one `primary` to make it the sized panel. */
|
|
11862
12232
|
class BuiResizablePanel {
|
|
12233
|
+
/** Whether this is the sized panel driven by the group's `size`; the other panel flexes. */
|
|
11863
12234
|
primary = input(false, /* @ts-ignore */
|
|
11864
12235
|
...(ngDevMode ? [{ debugName: "primary" }] : /* istanbul ignore next */ []));
|
|
11865
12236
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -11883,8 +12254,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
11883
12254
|
|
|
11884
12255
|
/** The draggable divider between two resizable panels. */
|
|
11885
12256
|
class BuiResizableHandle {
|
|
12257
|
+
/** Whether to render a visible grip indicator on the divider. */
|
|
11886
12258
|
withHandle = input(false, /* @ts-ignore */
|
|
11887
12259
|
...(ngDevMode ? [{ debugName: "withHandle" }] : /* istanbul ignore next */ []));
|
|
12260
|
+
/** Accessible label for the handle; falls back to a localized default. */
|
|
11888
12261
|
ariaLabel = input(/* @ts-ignore */
|
|
11889
12262
|
...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
11890
12263
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -11945,23 +12318,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
11945
12318
|
|
|
11946
12319
|
/** A styled HTML5 video with a poster + play-button facade. */
|
|
11947
12320
|
class BuiVideo {
|
|
12321
|
+
/** Video source URL for the underlying `<video>` element. */
|
|
11948
12322
|
src = input('', /* @ts-ignore */
|
|
11949
12323
|
...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
|
|
12324
|
+
/** Poster image URL shown before playback starts. */
|
|
11950
12325
|
poster = input('', /* @ts-ignore */
|
|
11951
12326
|
...(ngDevMode ? [{ debugName: "poster" }] : /* istanbul ignore next */ []));
|
|
12327
|
+
/** Aspect ratio: `video` (16/9), `square` (1/1), or any CSS ratio. */
|
|
11952
12328
|
aspect = input('video', /* @ts-ignore */
|
|
11953
12329
|
...(ngDevMode ? [{ debugName: "aspect" }] : /* istanbul ignore next */ []));
|
|
12330
|
+
/** Whether to show native controls once playback has started. */
|
|
11954
12331
|
controls = input(true, /* @ts-ignore */
|
|
11955
12332
|
...(ngDevMode ? [{ debugName: "controls" }] : /* istanbul ignore next */ []));
|
|
12333
|
+
/** Whether to start playing automatically (hides the play facade). */
|
|
11956
12334
|
autoplay = input(false, /* @ts-ignore */
|
|
11957
12335
|
...(ngDevMode ? [{ debugName: "autoplay" }] : /* istanbul ignore next */ []));
|
|
12336
|
+
/** Whether the video loops when it reaches the end. */
|
|
11958
12337
|
loop = input(false, /* @ts-ignore */
|
|
11959
12338
|
...(ngDevMode ? [{ debugName: "loop" }] : /* istanbul ignore next */ []));
|
|
12339
|
+
/** Whether the video starts muted. */
|
|
11960
12340
|
muted = input(false, /* @ts-ignore */
|
|
11961
12341
|
...(ngDevMode ? [{ debugName: "muted" }] : /* istanbul ignore next */ []));
|
|
12342
|
+
/** Tailwind border-radius utility applied to the container. */
|
|
11962
12343
|
rounded = input('rounded-xl', /* @ts-ignore */
|
|
11963
12344
|
...(ngDevMode ? [{ debugName: "rounded" }] : /* istanbul ignore next */ []));
|
|
11964
12345
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
12346
|
+
/** Accessible label override for the play-button facade. */
|
|
11965
12347
|
playLabel = input(/* @ts-ignore */
|
|
11966
12348
|
...(ngDevMode ? [undefined, { debugName: "playLabel" }] : /* istanbul ignore next */ []));
|
|
11967
12349
|
playText = buiLabel('videoPlay', this.playLabel);
|
|
@@ -12088,15 +12470,20 @@ const DEFAULT_SWATCHES = [
|
|
|
12088
12470
|
];
|
|
12089
12471
|
/** A colour picker: a native colour well, a hex field, and a swatch palette. */
|
|
12090
12472
|
class BuiColorPicker {
|
|
12473
|
+
/** Selected color as a hex string. Two-way bindable with `[(value)]`. */
|
|
12091
12474
|
value = model('#6366f1', /* @ts-ignore */
|
|
12092
12475
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
12476
|
+
/** Custom swatch palette; falls back to a built-in set when null. */
|
|
12093
12477
|
swatches = input(null, /* @ts-ignore */
|
|
12094
12478
|
...(ngDevMode ? [{ debugName: "swatches" }] : /* istanbul ignore next */ []));
|
|
12479
|
+
/** Whether the picker is disabled. */
|
|
12095
12480
|
disabled = input(false, /* @ts-ignore */
|
|
12096
12481
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
12097
12482
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
12483
|
+
/** Accessible label for the native color well. */
|
|
12098
12484
|
pickLabel = input(/* @ts-ignore */
|
|
12099
12485
|
...(ngDevMode ? [undefined, { debugName: "pickLabel" }] : /* istanbul ignore next */ []));
|
|
12486
|
+
/** Accessible label for the hex text field. */
|
|
12100
12487
|
hexLabel = input(/* @ts-ignore */
|
|
12101
12488
|
...(ngDevMode ? [undefined, { debugName: "hexLabel" }] : /* istanbul ignore next */ []));
|
|
12102
12489
|
pickText = buiLabel('colorPickerPick', this.pickLabel);
|
|
@@ -12197,14 +12584,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
12197
12584
|
|
|
12198
12585
|
/** A GDPR cookie banner. Persists the choice in localStorage (skipped in `demo` mode). */
|
|
12199
12586
|
class BuiCookieConsent {
|
|
12587
|
+
/** Consent message shown to the user. */
|
|
12200
12588
|
message = input('We use cookies to enhance your experience.', /* @ts-ignore */
|
|
12201
12589
|
...(ngDevMode ? [{ debugName: "message" }] : /* istanbul ignore next */ []));
|
|
12590
|
+
/** When true, always shows the banner and skips reading/writing localStorage. */
|
|
12202
12591
|
demo = input(false, /* @ts-ignore */
|
|
12203
12592
|
...(ngDevMode ? [{ debugName: "demo" }] : /* istanbul ignore next */ []));
|
|
12593
|
+
/** localStorage key under which the accept/decline choice is persisted. */
|
|
12204
12594
|
storageKey = input('bui-cookie-consent', /* @ts-ignore */
|
|
12205
12595
|
...(ngDevMode ? [{ debugName: "storageKey" }] : /* istanbul ignore next */ []));
|
|
12596
|
+
/** Emitted with `true` when the user accepts and `false` when they decline. */
|
|
12206
12597
|
decided = output();
|
|
12207
12598
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
12599
|
+
/** Overrides the localized accessible label for the consent region. */
|
|
12208
12600
|
ariaLabel = input(/* @ts-ignore */
|
|
12209
12601
|
...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
12210
12602
|
ariaLabelText = buiLabel('cookieConsent', this.ariaLabel);
|
|
@@ -12287,12 +12679,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
12287
12679
|
* "Load more" button is pressed. Drive `loading` / `finished` from the consumer. SSR-safe.
|
|
12288
12680
|
*/
|
|
12289
12681
|
class BuiInfiniteScroll {
|
|
12682
|
+
/** Whether a load is in progress; shows the spinner and suppresses new emits. */
|
|
12290
12683
|
loading = input(false, /* @ts-ignore */
|
|
12291
12684
|
...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
|
|
12685
|
+
/** Whether all items are loaded; shows the end message and suppresses emits. */
|
|
12292
12686
|
finished = input(false, /* @ts-ignore */
|
|
12293
12687
|
...(ngDevMode ? [{ debugName: "finished" }] : /* istanbul ignore next */ []));
|
|
12688
|
+
/** Pixel margin below the viewport at which the sentinel triggers loading. */
|
|
12294
12689
|
threshold = input(200, /* @ts-ignore */
|
|
12295
12690
|
...(ngDevMode ? [{ debugName: "threshold" }] : /* istanbul ignore next */ []));
|
|
12691
|
+
/** Emits when the sentinel scrolls into view or the fallback button is pressed. */
|
|
12296
12692
|
more = output();
|
|
12297
12693
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
12298
12694
|
sentinel = viewChild('sentinel', /* @ts-ignore */
|
|
@@ -12417,26 +12813,35 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
12417
12813
|
|
|
12418
12814
|
/** A compact audio player around a native `<audio>`: play/pause, seek, time, mute. */
|
|
12419
12815
|
class BuiAudioPlayer {
|
|
12816
|
+
/** Audio source URL for the underlying `<audio>` element. */
|
|
12420
12817
|
src = input('', /* @ts-ignore */
|
|
12421
12818
|
...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
|
|
12819
|
+
/** Track title shown next to the controls. */
|
|
12422
12820
|
title = input('', /* @ts-ignore */
|
|
12423
12821
|
...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
12822
|
+
/** Artist name shown under the title. */
|
|
12424
12823
|
artist = input('', /* @ts-ignore */
|
|
12425
12824
|
...(ngDevMode ? [{ debugName: "artist" }] : /* istanbul ignore next */ []));
|
|
12825
|
+
/** Whether to start playback automatically once loaded. */
|
|
12426
12826
|
autoplay = input(false, /* @ts-ignore */
|
|
12427
12827
|
...(ngDevMode ? [{ debugName: "autoplay" }] : /* istanbul ignore next */ []));
|
|
12428
12828
|
/** Condensed layout: hides the title block and mute button. */
|
|
12429
12829
|
compact = input(false, /* @ts-ignore */
|
|
12430
12830
|
...(ngDevMode ? [{ debugName: "compact" }] : /* istanbul ignore next */ []));
|
|
12431
12831
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
12832
|
+
/** Accessible label override for the seek slider. */
|
|
12432
12833
|
seekLabel = input(/* @ts-ignore */
|
|
12433
12834
|
...(ngDevMode ? [undefined, { debugName: "seekLabel" }] : /* istanbul ignore next */ []));
|
|
12835
|
+
/** Accessible label override for the play button. */
|
|
12434
12836
|
playLabel = input(/* @ts-ignore */
|
|
12435
12837
|
...(ngDevMode ? [undefined, { debugName: "playLabel" }] : /* istanbul ignore next */ []));
|
|
12838
|
+
/** Accessible label override for the pause button. */
|
|
12436
12839
|
pauseLabel = input(/* @ts-ignore */
|
|
12437
12840
|
...(ngDevMode ? [undefined, { debugName: "pauseLabel" }] : /* istanbul ignore next */ []));
|
|
12841
|
+
/** Accessible label override for the mute button. */
|
|
12438
12842
|
muteLabel = input(/* @ts-ignore */
|
|
12439
12843
|
...(ngDevMode ? [undefined, { debugName: "muteLabel" }] : /* istanbul ignore next */ []));
|
|
12844
|
+
/** Accessible label override for the unmute button. */
|
|
12440
12845
|
unmuteLabel = input(/* @ts-ignore */
|
|
12441
12846
|
...(ngDevMode ? [undefined, { debugName: "unmuteLabel" }] : /* istanbul ignore next */ []));
|
|
12442
12847
|
seekText = buiLabel('audioPlayerSeek', this.seekLabel);
|
|
@@ -12646,8 +13051,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
12646
13051
|
|
|
12647
13052
|
/** A canvas signature pad with draw, undo and clear. SSR-safe (canvas set up in the browser). */
|
|
12648
13053
|
class BuiSignaturePad {
|
|
13054
|
+
/** Canvas height in pixels. */
|
|
12649
13055
|
height = input(200, /* @ts-ignore */
|
|
12650
13056
|
...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
|
|
13057
|
+
/** Stroke color; falls back to the current text color when empty. */
|
|
12651
13058
|
penColor = input('', /* @ts-ignore */
|
|
12652
13059
|
...(ngDevMode ? [{ debugName: "penColor" }] : /* istanbul ignore next */ []));
|
|
12653
13060
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -12804,11 +13211,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
12804
13211
|
|
|
12805
13212
|
/** A macOS-style dock with a cursor-following fisheye magnify. Use `bui-dock-item` tiles. */
|
|
12806
13213
|
class BuiDock {
|
|
13214
|
+
/** Maximum scale factor applied to the tile directly under the cursor. */
|
|
12807
13215
|
magnify = input(1.6, /* @ts-ignore */
|
|
12808
13216
|
...(ngDevMode ? [{ debugName: "magnify" }] : /* istanbul ignore next */ []));
|
|
13217
|
+
/** Pixel radius around the cursor within which tiles are magnified. */
|
|
12809
13218
|
distance = input(120, /* @ts-ignore */
|
|
12810
13219
|
...(ngDevMode ? [{ debugName: "distance" }] : /* istanbul ignore next */ []));
|
|
12811
13220
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
13221
|
+
/** Accessible label for the dock navigation; falls back to the i18n default. */
|
|
12812
13222
|
label = input(/* @ts-ignore */
|
|
12813
13223
|
...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
|
|
12814
13224
|
labelText = buiLabel('dock', this.label);
|
|
@@ -12860,6 +13270,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
12860
13270
|
|
|
12861
13271
|
/** A magnifying tile inside a `bui-dock`. */
|
|
12862
13272
|
class BuiDockItem {
|
|
13273
|
+
/** Whether to show the active indicator dot beneath the tile. */
|
|
12863
13274
|
active = input(false, /* @ts-ignore */
|
|
12864
13275
|
...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
|
|
12865
13276
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -12916,8 +13327,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
12916
13327
|
|
|
12917
13328
|
/** A single tree row; renders its own children recursively. */
|
|
12918
13329
|
class BuiTreeNode {
|
|
13330
|
+
/** Node data for this row, including its label and children. */
|
|
12919
13331
|
item = input.required(/* @ts-ignore */
|
|
12920
13332
|
...(ngDevMode ? [{ debugName: "item" }] : /* istanbul ignore next */ []));
|
|
13333
|
+
/** Depth of this node, used for indentation and `aria-level` (root is 1). */
|
|
12921
13334
|
level = input(1, /* @ts-ignore */
|
|
12922
13335
|
...(ngDevMode ? [{ debugName: "level" }] : /* istanbul ignore next */ []));
|
|
12923
13336
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -13027,8 +13440,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
13027
13440
|
|
|
13028
13441
|
/** A collapsible, data-driven hierarchical tree (`role="tree"`). */
|
|
13029
13442
|
class BuiTree {
|
|
13443
|
+
/** Root nodes of the tree to render. */
|
|
13030
13444
|
items = input([], /* @ts-ignore */
|
|
13031
13445
|
...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
13446
|
+
/** Accessible label for the tree's root element. */
|
|
13032
13447
|
ariaLabel = input('Tree', /* @ts-ignore */
|
|
13033
13448
|
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
13034
13449
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -13061,16 +13476,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
13061
13476
|
|
|
13062
13477
|
/** A dynamic list of repeatable form rows with add/remove and min/max bounds. */
|
|
13063
13478
|
class BuiRepeater {
|
|
13479
|
+
/** Column definitions rendered for every row. */
|
|
13064
13480
|
fields = input([], /* @ts-ignore */
|
|
13065
13481
|
...(ngDevMode ? [{ debugName: "fields" }] : /* istanbul ignore next */ []));
|
|
13482
|
+
/** Row data keyed by field key. Two-way bindable with `[(rows)]`. */
|
|
13066
13483
|
rows = model([], /* @ts-ignore */
|
|
13067
13484
|
...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
|
|
13485
|
+
/** Minimum number of rows that must remain (remove is disabled at this count). */
|
|
13068
13486
|
min = input(1, /* @ts-ignore */
|
|
13069
13487
|
...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
|
|
13488
|
+
/** Maximum number of rows allowed, or null for unlimited. */
|
|
13070
13489
|
max = input(null, /* @ts-ignore */
|
|
13071
13490
|
...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
|
|
13491
|
+
/** Text shown on the add-row button. */
|
|
13072
13492
|
addLabel = input('Add row', /* @ts-ignore */
|
|
13073
13493
|
...(ngDevMode ? [{ debugName: "addLabel" }] : /* istanbul ignore next */ []));
|
|
13494
|
+
/** Accessible label override for the remove-row buttons. */
|
|
13074
13495
|
removeLabel = input(/* @ts-ignore */
|
|
13075
13496
|
...(ngDevMode ? [undefined, { debugName: "removeLabel" }] : /* istanbul ignore next */ []));
|
|
13076
13497
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -13242,17 +13663,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
13242
13663
|
|
|
13243
13664
|
/** A bell trigger with a dropdown feed of notifications and an unread badge. */
|
|
13244
13665
|
class BuiNotificationCenter {
|
|
13666
|
+
/** Notification items rendered in the dropdown feed. */
|
|
13245
13667
|
notifications = input([], /* @ts-ignore */
|
|
13246
13668
|
...(ngDevMode ? [{ debugName: "notifications" }] : /* istanbul ignore next */ []));
|
|
13669
|
+
/** Whether the dropdown is open. Two-way bindable with `[(open)]`. */
|
|
13247
13670
|
open = model(false, /* @ts-ignore */
|
|
13248
13671
|
...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
|
|
13249
13672
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
13673
|
+
/** Accessible label for the trigger and dropdown region. */
|
|
13250
13674
|
ariaLabel = input(/* @ts-ignore */
|
|
13251
13675
|
...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
13676
|
+
/** Accessible label announced for the per-item unread dot. */
|
|
13252
13677
|
unreadLabel = input(/* @ts-ignore */
|
|
13253
13678
|
...(ngDevMode ? [undefined, { debugName: "unreadLabel" }] : /* istanbul ignore next */ []));
|
|
13679
|
+
/** Label for the "mark all as read" action button. */
|
|
13254
13680
|
markAllReadLabel = input(/* @ts-ignore */
|
|
13255
13681
|
...(ngDevMode ? [undefined, { debugName: "markAllReadLabel" }] : /* istanbul ignore next */ []));
|
|
13682
|
+
/** Text shown when there are no notifications. */
|
|
13256
13683
|
emptyLabel = input(/* @ts-ignore */
|
|
13257
13684
|
...(ngDevMode ? [undefined, { debugName: "emptyLabel" }] : /* istanbul ignore next */ []));
|
|
13258
13685
|
ariaText = buiLabel('notificationCenter', this.ariaLabel);
|
|
@@ -13423,10 +13850,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
13423
13850
|
|
|
13424
13851
|
/** A single JSON node; renders nested objects/arrays recursively. */
|
|
13425
13852
|
class BuiJsonViewerNode {
|
|
13853
|
+
/** Arbitrary JSON value rendered by this node. */
|
|
13426
13854
|
value = input(null, /* @ts-ignore */
|
|
13427
13855
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
13856
|
+
/** Object key or array index labeling this node, or null at the root. */
|
|
13428
13857
|
keyName = input(null, /* @ts-ignore */
|
|
13429
13858
|
...(ngDevMode ? [{ debugName: "keyName" }] : /* istanbul ignore next */ []));
|
|
13859
|
+
/** Whether this node starts expanded. */
|
|
13430
13860
|
expanded = input(true, /* @ts-ignore */
|
|
13431
13861
|
...(ngDevMode ? [{ debugName: "expanded" }] : /* istanbul ignore next */ []));
|
|
13432
13862
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -13608,8 +14038,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
13608
14038
|
|
|
13609
14039
|
/** A collapsible JSON tree viewer. Accepts an object/array or a JSON string. */
|
|
13610
14040
|
class BuiJsonViewer {
|
|
14041
|
+
/** Arbitrary JSON value to render; a string is parsed as JSON when possible. */
|
|
13611
14042
|
data = input(null, /* @ts-ignore */
|
|
13612
14043
|
...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
|
|
14044
|
+
/** Whether nodes start expanded. */
|
|
13613
14045
|
expanded = input(true, /* @ts-ignore */
|
|
13614
14046
|
...(ngDevMode ? [{ debugName: "expanded" }] : /* istanbul ignore next */ []));
|
|
13615
14047
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -13643,6 +14075,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
13643
14075
|
|
|
13644
14076
|
/** A single org-chart node (a card + recursive children). Rendered on an `<li>`. */
|
|
13645
14077
|
class BuiOrgChartNode {
|
|
14078
|
+
/** Node rendered as a card, with its `children` recursed into nested `<li>`s. */
|
|
13646
14079
|
node = input.required(/* @ts-ignore */
|
|
13647
14080
|
...(ngDevMode ? [{ debugName: "node" }] : /* istanbul ignore next */ []));
|
|
13648
14081
|
children = computed(() => this.node().children ?? [], /* @ts-ignore */
|
|
@@ -13719,6 +14152,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
13719
14152
|
|
|
13720
14153
|
/** A top-down organizational chart with pure-CSS connectors. Recursively renders nodes. */
|
|
13721
14154
|
class BuiOrgChart {
|
|
14155
|
+
/** Root node of the tree to render; `null` renders nothing. */
|
|
13722
14156
|
node = input(null, /* @ts-ignore */
|
|
13723
14157
|
...(ngDevMode ? [{ debugName: "node" }] : /* istanbul ignore next */ []));
|
|
13724
14158
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -13746,15 +14180,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
13746
14180
|
|
|
13747
14181
|
/** A cart trigger with an item-count badge and a dropdown with line items + subtotal. */
|
|
13748
14182
|
class BuiMiniCart {
|
|
14183
|
+
/** Line items in the cart, used for count and subtotal. */
|
|
13749
14184
|
items = input([], /* @ts-ignore */
|
|
13750
14185
|
...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
14186
|
+
/** Currency symbol prefixed to prices and subtotal. */
|
|
13751
14187
|
currency = input('$', /* @ts-ignore */
|
|
13752
14188
|
...(ngDevMode ? [{ debugName: "currency" }] : /* istanbul ignore next */ []));
|
|
14189
|
+
/** Whether the dropdown is open. Two-way bindable with `[(open)]`. */
|
|
13753
14190
|
open = model(false, /* @ts-ignore */
|
|
13754
14191
|
...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
|
|
13755
14192
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
14193
|
+
/** Accessible label override for the cart trigger button. */
|
|
13756
14194
|
triggerLabel = input(/* @ts-ignore */
|
|
13757
14195
|
...(ngDevMode ? [undefined, { debugName: "triggerLabel" }] : /* istanbul ignore next */ []));
|
|
14196
|
+
/** Accessible label override for the cart dropdown dialog. */
|
|
13758
14197
|
label = input(/* @ts-ignore */
|
|
13759
14198
|
...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
|
|
13760
14199
|
triggerText = buiLabel('miniCartTrigger', this.triggerLabel);
|
|
@@ -13935,12 +14374,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
13935
14374
|
|
|
13936
14375
|
/** An SVG beam connecting two elements (by selector) with a travelling light. SSR-safe. */
|
|
13937
14376
|
class BuiAnimatedBeam {
|
|
14377
|
+
/** CSS selector of the element the beam starts from. */
|
|
13938
14378
|
from = input('', /* @ts-ignore */
|
|
13939
14379
|
...(ngDevMode ? [{ debugName: "from" }] : /* istanbul ignore next */ []));
|
|
14380
|
+
/** CSS selector of the element the beam ends at. */
|
|
13940
14381
|
to = input('', /* @ts-ignore */
|
|
13941
14382
|
...(ngDevMode ? [{ debugName: "to" }] : /* istanbul ignore next */ []));
|
|
14383
|
+
/** Upward bow of the connecting curve in pixels. */
|
|
13942
14384
|
curvature = input(0, /* @ts-ignore */
|
|
13943
14385
|
...(ngDevMode ? [{ debugName: "curvature" }] : /* istanbul ignore next */ []));
|
|
14386
|
+
/** Seconds for the travelling light to traverse the beam. */
|
|
13944
14387
|
duration = input(3, /* @ts-ignore */
|
|
13945
14388
|
...(ngDevMode ? [{ debugName: "duration" }] : /* istanbul ignore next */ []));
|
|
13946
14389
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -14078,10 +14521,13 @@ const ROW_CLASS = {
|
|
|
14078
14521
|
const SIGN = { same: ' ', add: '+', del: '-' };
|
|
14079
14522
|
/** A line-by-line text diff (LCS) rendered with +/- gutters. */
|
|
14080
14523
|
class BuiDiffViewer {
|
|
14524
|
+
/** Original text; lines removed relative to `after` are marked deleted. */
|
|
14081
14525
|
before = input('', /* @ts-ignore */
|
|
14082
14526
|
...(ngDevMode ? [{ debugName: "before" }] : /* istanbul ignore next */ []));
|
|
14527
|
+
/** Updated text; lines added relative to `before` are marked added. */
|
|
14083
14528
|
after = input('', /* @ts-ignore */
|
|
14084
14529
|
...(ngDevMode ? [{ debugName: "after" }] : /* istanbul ignore next */ []));
|
|
14530
|
+
/** Optional filename shown in the header above the diff. */
|
|
14085
14531
|
filename = input('', /* @ts-ignore */
|
|
14086
14532
|
...(ngDevMode ? [{ debugName: "filename" }] : /* istanbul ignore next */ []));
|
|
14087
14533
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -14150,11 +14596,14 @@ const ALIGN$2 = {
|
|
|
14150
14596
|
};
|
|
14151
14597
|
/** A table whose rows can nest and expand/collapse (flattened to visible rows). */
|
|
14152
14598
|
class BuiTreeTable {
|
|
14599
|
+
/** Column definitions in display order. */
|
|
14153
14600
|
columns = input([], /* @ts-ignore */
|
|
14154
14601
|
...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
|
|
14602
|
+
/** Top-level rows, each able to nest children via `children`. */
|
|
14155
14603
|
rows = input([], /* @ts-ignore */
|
|
14156
14604
|
...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
|
|
14157
14605
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
14606
|
+
/** Accessible label for the expand/collapse toggle button. */
|
|
14158
14607
|
toggleLabel = input(/* @ts-ignore */
|
|
14159
14608
|
...(ngDevMode ? [undefined, { debugName: "toggleLabel" }] : /* istanbul ignore next */ []));
|
|
14160
14609
|
toggleText = buiLabel('treeTableToggle', this.toggleLabel);
|
|
@@ -14351,12 +14800,16 @@ function renderMarkdown(markdown) {
|
|
|
14351
14800
|
}
|
|
14352
14801
|
/** A markdown textarea with a live, sanitized HTML preview. */
|
|
14353
14802
|
class BuiMarkdownEditor {
|
|
14803
|
+
/** Markdown source text. Two-way bindable with `[(value)]`. */
|
|
14354
14804
|
value = model('', /* @ts-ignore */
|
|
14355
14805
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
14806
|
+
/** Name attribute applied to the textarea for form submission. */
|
|
14356
14807
|
name = input('', /* @ts-ignore */
|
|
14357
14808
|
...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
14809
|
+
/** Placeholder text shown while the textarea is empty. */
|
|
14358
14810
|
placeholder = input('Write markdown…', /* @ts-ignore */
|
|
14359
14811
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
14812
|
+
/** Number of visible rows in the write textarea. */
|
|
14360
14813
|
rows = input(8, /* @ts-ignore */
|
|
14361
14814
|
...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
|
|
14362
14815
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -14444,6 +14897,7 @@ function isoOf(date) {
|
|
|
14444
14897
|
* Render several months side by side with `months`. SSR-safe.
|
|
14445
14898
|
*/
|
|
14446
14899
|
class BuiCalendar {
|
|
14900
|
+
/** Selected day (mode="single") as `yyyy-mm-dd`. Two-way bindable with `[(value)]`. */
|
|
14447
14901
|
value = model('', /* @ts-ignore */
|
|
14448
14902
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
14449
14903
|
/** Selection mode: `single` | `range` | `multiple`. */
|
|
@@ -14458,10 +14912,13 @@ class BuiCalendar {
|
|
|
14458
14912
|
/** Number of month grids to render side by side. */
|
|
14459
14913
|
months = input(1, /* @ts-ignore */
|
|
14460
14914
|
...(ngDevMode ? [{ debugName: "months" }] : /* istanbul ignore next */ []));
|
|
14915
|
+
/** First day of the week (0 = Sunday). */
|
|
14461
14916
|
weekStart = input(0, /* @ts-ignore */
|
|
14462
14917
|
...(ngDevMode ? [{ debugName: "weekStart" }] : /* istanbul ignore next */ []));
|
|
14918
|
+
/** Earliest selectable date (`yyyy-mm-dd`). */
|
|
14463
14919
|
minDate = input('', /* @ts-ignore */
|
|
14464
14920
|
...(ngDevMode ? [{ debugName: "minDate" }] : /* istanbul ignore next */ []));
|
|
14921
|
+
/** Latest selectable date (`yyyy-mm-dd`). */
|
|
14465
14922
|
maxDate = input('', /* @ts-ignore */
|
|
14466
14923
|
...(ngDevMode ? [{ debugName: "maxDate" }] : /* istanbul ignore next */ []));
|
|
14467
14924
|
/** Specific ISO dates (yyyy-mm-dd) to disable. */
|
|
@@ -14479,15 +14936,20 @@ class BuiCalendar {
|
|
|
14479
14936
|
/** Hide days that fall outside the current month. */
|
|
14480
14937
|
hideOutsideDays = input(false, /* @ts-ignore */
|
|
14481
14938
|
...(ngDevMode ? [{ debugName: "hideOutsideDays" }] : /* istanbul ignore next */ []));
|
|
14939
|
+
/** Whether the whole calendar is disabled. Two-way bindable with `[(disabled)]`. */
|
|
14482
14940
|
disabled = model(false, /* @ts-ignore */
|
|
14483
14941
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
14484
14942
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
14943
|
+
/** Accessible label for the previous-month button. */
|
|
14485
14944
|
previousMonthLabel = input(/* @ts-ignore */
|
|
14486
14945
|
...(ngDevMode ? [undefined, { debugName: "previousMonthLabel" }] : /* istanbul ignore next */ []));
|
|
14946
|
+
/** Accessible label for the month dropdown. */
|
|
14487
14947
|
monthSelectLabel = input(/* @ts-ignore */
|
|
14488
14948
|
...(ngDevMode ? [undefined, { debugName: "monthSelectLabel" }] : /* istanbul ignore next */ []));
|
|
14949
|
+
/** Accessible label for the year dropdown. */
|
|
14489
14950
|
yearLabel = input(/* @ts-ignore */
|
|
14490
14951
|
...(ngDevMode ? [undefined, { debugName: "yearLabel" }] : /* istanbul ignore next */ []));
|
|
14952
|
+
/** Accessible label for the next-month button. */
|
|
14491
14953
|
nextMonthLabel = input(/* @ts-ignore */
|
|
14492
14954
|
...(ngDevMode ? [undefined, { debugName: "nextMonthLabel" }] : /* istanbul ignore next */ []));
|
|
14493
14955
|
previousMonthText = buiLabel('calendarPreviousMonth', this.previousMonthLabel);
|
|
@@ -14928,6 +15390,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
14928
15390
|
const noop$3 = () => { };
|
|
14929
15391
|
/** A date input that opens a calendar popover. */
|
|
14930
15392
|
class BuiDatePicker {
|
|
15393
|
+
/** Selected date (mode="single") as `yyyy-mm-dd`. Two-way bindable with `[(value)]`. */
|
|
14931
15394
|
value = model('', /* @ts-ignore */
|
|
14932
15395
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
14933
15396
|
/** `single` (default) or `range`. */
|
|
@@ -14939,24 +15402,34 @@ class BuiDatePicker {
|
|
|
14939
15402
|
/** Month grids shown in the popover (handy for range). */
|
|
14940
15403
|
months = input(1, /* @ts-ignore */
|
|
14941
15404
|
...(ngDevMode ? [{ debugName: "months" }] : /* istanbul ignore next */ []));
|
|
15405
|
+
/** Text shown on the trigger when no date is selected. */
|
|
14942
15406
|
placeholder = input('Pick a date', /* @ts-ignore */
|
|
14943
15407
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
15408
|
+
/** Earliest selectable date (`yyyy-mm-dd`). */
|
|
14944
15409
|
minDate = input('', /* @ts-ignore */
|
|
14945
15410
|
...(ngDevMode ? [{ debugName: "minDate" }] : /* istanbul ignore next */ []));
|
|
15411
|
+
/** Latest selectable date (`yyyy-mm-dd`). */
|
|
14946
15412
|
maxDate = input('', /* @ts-ignore */
|
|
14947
15413
|
...(ngDevMode ? [{ debugName: "maxDate" }] : /* istanbul ignore next */ []));
|
|
15414
|
+
/** First day of the week (0 = Sunday). */
|
|
14948
15415
|
weekStart = input(0, /* @ts-ignore */
|
|
14949
15416
|
...(ngDevMode ? [{ debugName: "weekStart" }] : /* istanbul ignore next */ []));
|
|
15417
|
+
/** Specific ISO dates (yyyy-mm-dd) to disable. */
|
|
14950
15418
|
disabledDates = input([], /* @ts-ignore */
|
|
14951
15419
|
...(ngDevMode ? [{ debugName: "disabledDates" }] : /* istanbul ignore next */ []));
|
|
15420
|
+
/** Disable Saturdays and Sundays. */
|
|
14952
15421
|
disableWeekends = input(false, /* @ts-ignore */
|
|
14953
15422
|
...(ngDevMode ? [{ debugName: "disableWeekends" }] : /* istanbul ignore next */ []));
|
|
15423
|
+
/** Show an ISO week-number column in the calendar. */
|
|
14954
15424
|
showWeekNumbers = input(false, /* @ts-ignore */
|
|
14955
15425
|
...(ngDevMode ? [{ debugName: "showWeekNumbers" }] : /* istanbul ignore next */ []));
|
|
15426
|
+
/** `dropdown` swaps the month label for month + year selects. */
|
|
14956
15427
|
captionLayout = input('label', /* @ts-ignore */
|
|
14957
15428
|
...(ngDevMode ? [{ debugName: "captionLayout" }] : /* istanbul ignore next */ []));
|
|
15429
|
+
/** Hide days that fall outside the current month. */
|
|
14958
15430
|
hideOutsideDays = input(false, /* @ts-ignore */
|
|
14959
15431
|
...(ngDevMode ? [{ debugName: "hideOutsideDays" }] : /* istanbul ignore next */ []));
|
|
15432
|
+
/** Whether the picker is disabled. Two-way bindable with `[(disabled)]`. */
|
|
14960
15433
|
disabled = model(false, /* @ts-ignore */
|
|
14961
15434
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
14962
15435
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -15129,18 +15602,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
15129
15602
|
|
|
15130
15603
|
/** A slide carousel. Project slides as direct children; arrows + dots navigate. SSR-safe. */
|
|
15131
15604
|
class BuiCarousel {
|
|
15605
|
+
/** Zero-based index of the first visible slide; two-way bindable. */
|
|
15132
15606
|
index = model(0, /* @ts-ignore */
|
|
15133
15607
|
...(ngDevMode ? [{ debugName: "index" }] : /* istanbul ignore next */ []));
|
|
15608
|
+
/** Scroll axis of the carousel. */
|
|
15134
15609
|
orientation = input('horizontal', /* @ts-ignore */
|
|
15135
15610
|
...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
|
|
15136
15611
|
/** Slides visible at once (e.g. 2 or 3 for a multi-item carousel). */
|
|
15137
15612
|
perView = input(1, /* @ts-ignore */
|
|
15138
15613
|
...(ngDevMode ? [{ debugName: "perView" }] : /* istanbul ignore next */ []));
|
|
15139
15614
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
15615
|
+
/** Accessible label override for the previous-slide button. */
|
|
15140
15616
|
previousLabel = input(/* @ts-ignore */
|
|
15141
15617
|
...(ngDevMode ? [undefined, { debugName: "previousLabel" }] : /* istanbul ignore next */ []));
|
|
15618
|
+
/** Accessible label override for the next-slide button. */
|
|
15142
15619
|
nextLabel = input(/* @ts-ignore */
|
|
15143
15620
|
...(ngDevMode ? [undefined, { debugName: "nextLabel" }] : /* istanbul ignore next */ []));
|
|
15621
|
+
/** Accessible label override (prefix) for the dot navigation buttons. */
|
|
15144
15622
|
goToSlideLabel = input(/* @ts-ignore */
|
|
15145
15623
|
...(ngDevMode ? [undefined, { debugName: "goToSlideLabel" }] : /* istanbul ignore next */ []));
|
|
15146
15624
|
previousText = buiLabel('carouselPrevious', this.previousLabel);
|
|
@@ -15333,13 +15811,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
15333
15811
|
|
|
15334
15812
|
/** A command palette: a filterable, keyboard-navigable list of grouped actions. */
|
|
15335
15813
|
class BuiCommand {
|
|
15814
|
+
/** Grouped commands shown in the palette and filtered as the user types. */
|
|
15336
15815
|
groups = input([], /* @ts-ignore */
|
|
15337
15816
|
...(ngDevMode ? [{ debugName: "groups" }] : /* istanbul ignore next */ []));
|
|
15817
|
+
/** Placeholder text for the search input. */
|
|
15338
15818
|
placeholder = input('Type a command or search…', /* @ts-ignore */
|
|
15339
15819
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
15340
15820
|
/** Render a checkmark column; activating an item toggles its checked state. */
|
|
15341
15821
|
checkable = input(false, /* @ts-ignore */
|
|
15342
15822
|
...(ngDevMode ? [{ debugName: "checkable" }] : /* istanbul ignore next */ []));
|
|
15823
|
+
/** Emits the chosen command when an item is activated (click or Enter). */
|
|
15343
15824
|
selected = output();
|
|
15344
15825
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
15345
15826
|
checkedValues = signal(new Set(), /* @ts-ignore */
|
|
@@ -15582,8 +16063,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
15582
16063
|
|
|
15583
16064
|
/** A right-click context menu. Project the target; pass menu `items`. */
|
|
15584
16065
|
class BuiContextMenu {
|
|
16066
|
+
/** Items shown in the menu, in display order. */
|
|
15585
16067
|
items = input([], /* @ts-ignore */
|
|
15586
16068
|
...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
16069
|
+
/** Emits the chosen item when a (non-separator) entry is activated. */
|
|
15587
16070
|
selected = output();
|
|
15588
16071
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
15589
16072
|
open = signal(false, /* @ts-ignore */
|
|
@@ -15840,23 +16323,32 @@ function cellText(value) {
|
|
|
15840
16323
|
}
|
|
15841
16324
|
/** A data table with search, sortable columns, row selection and pagination. */
|
|
15842
16325
|
class BuiDataTable {
|
|
16326
|
+
/** Column definitions that drive the headers, cell lookup and sort/search keys. */
|
|
15843
16327
|
columns = input([], /* @ts-ignore */
|
|
15844
16328
|
...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
|
|
16329
|
+
/** Source data rows; each is a key/value map indexed by column keys. */
|
|
15845
16330
|
rows = input([], /* @ts-ignore */
|
|
15846
16331
|
...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
|
|
16332
|
+
/** Whether to show the search box that filters rows across all columns. */
|
|
15847
16333
|
searchable = input(true, /* @ts-ignore */
|
|
15848
16334
|
...(ngDevMode ? [{ debugName: "searchable" }] : /* istanbul ignore next */ []));
|
|
16335
|
+
/** Placeholder text for the search input. */
|
|
15849
16336
|
searchPlaceholder = input('Search...', /* @ts-ignore */
|
|
15850
16337
|
...(ngDevMode ? [{ debugName: "searchPlaceholder" }] : /* istanbul ignore next */ []));
|
|
16338
|
+
/** Whether to render row checkboxes and the select-all header checkbox. */
|
|
15851
16339
|
selectable = input(true, /* @ts-ignore */
|
|
15852
16340
|
...(ngDevMode ? [{ debugName: "selectable" }] : /* istanbul ignore next */ []));
|
|
16341
|
+
/** Number of rows displayed per page. */
|
|
15853
16342
|
pageSize = input(5, /* @ts-ignore */
|
|
15854
16343
|
...(ngDevMode ? [{ debugName: "pageSize" }] : /* istanbul ignore next */ []));
|
|
15855
16344
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
16345
|
+
/** Accessible label override for the search input. */
|
|
15856
16346
|
searchLabel = input(/* @ts-ignore */
|
|
15857
16347
|
...(ngDevMode ? [undefined, { debugName: "searchLabel" }] : /* istanbul ignore next */ []));
|
|
16348
|
+
/** Accessible label override for the select-all checkbox. */
|
|
15858
16349
|
selectAllLabel = input(/* @ts-ignore */
|
|
15859
16350
|
...(ngDevMode ? [undefined, { debugName: "selectAllLabel" }] : /* istanbul ignore next */ []));
|
|
16351
|
+
/** Accessible label override for each row's select checkbox. */
|
|
15860
16352
|
selectRowLabel = input(/* @ts-ignore */
|
|
15861
16353
|
...(ngDevMode ? [undefined, { debugName: "selectRowLabel" }] : /* istanbul ignore next */ []));
|
|
15862
16354
|
searchText = buiLabel('dataTableSearch', this.searchLabel);
|
|
@@ -16161,14 +16653,19 @@ const WIDTH = 600;
|
|
|
16161
16653
|
const PAD = 8;
|
|
16162
16654
|
/** A lightweight SVG chart (line / area / bar). Pure + SSR-safe. */
|
|
16163
16655
|
class BuiChart {
|
|
16656
|
+
/** Chart render style: line, bar, or filled area. */
|
|
16164
16657
|
type = input('line', /* @ts-ignore */
|
|
16165
16658
|
...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
|
|
16659
|
+
/** Series to plot; bar charts use only the first series. */
|
|
16166
16660
|
series = input([], /* @ts-ignore */
|
|
16167
16661
|
...(ngDevMode ? [{ debugName: "series" }] : /* istanbul ignore next */ []));
|
|
16662
|
+
/** X-axis tick labels rendered below the chart. */
|
|
16168
16663
|
labels = input([], /* @ts-ignore */
|
|
16169
16664
|
...(ngDevMode ? [{ debugName: "labels" }] : /* istanbul ignore next */ []));
|
|
16665
|
+
/** Chart height in pixels (SVG viewBox height). */
|
|
16170
16666
|
height = input(220, /* @ts-ignore */
|
|
16171
16667
|
...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
|
|
16668
|
+
/** Accessible label for the chart's `aria-label`. */
|
|
16172
16669
|
label = input('Chart', /* @ts-ignore */
|
|
16173
16670
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
16174
16671
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -16325,6 +16822,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
16325
16822
|
const noop$2 = () => { };
|
|
16326
16823
|
/** A combined date + time picker in a popover. Value is `YYYY-MM-DDTHH:mm`. */
|
|
16327
16824
|
class BuiDatetimePicker {
|
|
16825
|
+
/** Selected date-time (mode="single") as `YYYY-MM-DDTHH:mm`. Two-way bindable with `[(value)]`. */
|
|
16328
16826
|
value = model('', /* @ts-ignore */
|
|
16329
16827
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
16330
16828
|
/** `single` (default) or `range`. */
|
|
@@ -16336,16 +16834,22 @@ class BuiDatetimePicker {
|
|
|
16336
16834
|
/** Month grids shown in the popover (handy for range). */
|
|
16337
16835
|
months = input(1, /* @ts-ignore */
|
|
16338
16836
|
...(ngDevMode ? [{ debugName: "months" }] : /* istanbul ignore next */ []));
|
|
16837
|
+
/** Text shown on the trigger when nothing is selected. */
|
|
16339
16838
|
placeholder = input('Pick date & time', /* @ts-ignore */
|
|
16340
16839
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
16840
|
+
/** Earliest selectable date (`yyyy-mm-dd`). */
|
|
16341
16841
|
minDate = input('', /* @ts-ignore */
|
|
16342
16842
|
...(ngDevMode ? [{ debugName: "minDate" }] : /* istanbul ignore next */ []));
|
|
16843
|
+
/** Latest selectable date (`yyyy-mm-dd`). */
|
|
16343
16844
|
maxDate = input('', /* @ts-ignore */
|
|
16344
16845
|
...(ngDevMode ? [{ debugName: "maxDate" }] : /* istanbul ignore next */ []));
|
|
16846
|
+
/** `dropdown` swaps the month label for month + year selects. */
|
|
16345
16847
|
captionLayout = input('label', /* @ts-ignore */
|
|
16346
16848
|
...(ngDevMode ? [{ debugName: "captionLayout" }] : /* istanbul ignore next */ []));
|
|
16849
|
+
/** Whether to include seconds in the time field. */
|
|
16347
16850
|
seconds = input(false, /* @ts-ignore */
|
|
16348
16851
|
...(ngDevMode ? [{ debugName: "seconds" }] : /* istanbul ignore next */ []));
|
|
16852
|
+
/** Whether the picker is disabled. Two-way bindable with `[(disabled)]`. */
|
|
16349
16853
|
disabled = model(false, /* @ts-ignore */
|
|
16350
16854
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
16351
16855
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -16576,23 +17080,31 @@ const AC_SIZE = {
|
|
|
16576
17080
|
};
|
|
16577
17081
|
/** A free-text input with a filtered suggestion list. */
|
|
16578
17082
|
class BuiAutocomplete {
|
|
17083
|
+
/** Current text in the input. Two-way bindable with `[(value)]`. */
|
|
16579
17084
|
value = model('', /* @ts-ignore */
|
|
16580
17085
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
16581
17086
|
/** Pick several values, shown as removable chips; binds `values`. */
|
|
16582
17087
|
multiple = input(false, /* @ts-ignore */
|
|
16583
17088
|
...(ngDevMode ? [{ debugName: "multiple" }] : /* istanbul ignore next */ []));
|
|
17089
|
+
/** Selected values shown as chips (multiple mode). Two-way bindable with `[(values)]`. */
|
|
16584
17090
|
values = model([], /* @ts-ignore */
|
|
16585
17091
|
...(ngDevMode ? [{ debugName: "values" }] : /* istanbul ignore next */ []));
|
|
17092
|
+
/** Suggestions to filter against the typed text. */
|
|
16586
17093
|
options = input([], /* @ts-ignore */
|
|
16587
17094
|
...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
|
|
17095
|
+
/** Placeholder text for the input. */
|
|
16588
17096
|
placeholder = input('Search...', /* @ts-ignore */
|
|
16589
17097
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
17098
|
+
/** Message shown when no suggestion matches. */
|
|
16590
17099
|
empty = input('No results found.', /* @ts-ignore */
|
|
16591
17100
|
...(ngDevMode ? [{ debugName: "empty" }] : /* istanbul ignore next */ []));
|
|
17101
|
+
/** Whether the input is disabled. Two-way bindable with `[(disabled)]`. */
|
|
16592
17102
|
disabled = model(false, /* @ts-ignore */
|
|
16593
17103
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
17104
|
+
/** Native `name` attribute for the input. */
|
|
16594
17105
|
name = input('', /* @ts-ignore */
|
|
16595
17106
|
...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
17107
|
+
/** Height and font size of the input. */
|
|
16596
17108
|
size = input('default', /* @ts-ignore */
|
|
16597
17109
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
16598
17110
|
/** Optional leading icon, given as an SVG path `d` string. */
|
|
@@ -16928,21 +17440,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
16928
17440
|
|
|
16929
17441
|
/** A before/after image comparison with a draggable, keyboard-operable divider. */
|
|
16930
17442
|
class BuiComparisonSlider {
|
|
17443
|
+
/** Source URL of the "before" image (revealed on the left of the divider). */
|
|
16931
17444
|
before = input('', /* @ts-ignore */
|
|
16932
17445
|
...(ngDevMode ? [{ debugName: "before" }] : /* istanbul ignore next */ []));
|
|
17446
|
+
/** Source URL of the "after" image (shown on the right of the divider). */
|
|
16933
17447
|
after = input('', /* @ts-ignore */
|
|
16934
17448
|
...(ngDevMode ? [{ debugName: "after" }] : /* istanbul ignore next */ []));
|
|
17449
|
+
/** Caption badge shown over the "before" image; hidden when empty. */
|
|
16935
17450
|
beforeLabel = input('', /* @ts-ignore */
|
|
16936
17451
|
...(ngDevMode ? [{ debugName: "beforeLabel" }] : /* istanbul ignore next */ []));
|
|
17452
|
+
/** Caption badge shown over the "after" image; hidden when empty. */
|
|
16937
17453
|
afterLabel = input('', /* @ts-ignore */
|
|
16938
17454
|
...(ngDevMode ? [{ debugName: "afterLabel" }] : /* istanbul ignore next */ []));
|
|
17455
|
+
/** Alt text for the "before" image. */
|
|
16939
17456
|
beforeAlt = input('Before', /* @ts-ignore */
|
|
16940
17457
|
...(ngDevMode ? [{ debugName: "beforeAlt" }] : /* istanbul ignore next */ []));
|
|
17458
|
+
/** Alt text for the "after" image. */
|
|
16941
17459
|
afterAlt = input('After', /* @ts-ignore */
|
|
16942
17460
|
...(ngDevMode ? [{ debugName: "afterAlt" }] : /* istanbul ignore next */ []));
|
|
17461
|
+
/** Divider position as a percentage (0-100); two-way bindable. */
|
|
16943
17462
|
value = model(50, /* @ts-ignore */
|
|
16944
17463
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
16945
17464
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
17465
|
+
/** Accessible label override for the range slider. */
|
|
16946
17466
|
positionLabel = input(/* @ts-ignore */
|
|
16947
17467
|
...(ngDevMode ? [undefined, { debugName: "positionLabel" }] : /* istanbul ignore next */ []));
|
|
16948
17468
|
positionText = buiLabel('comparisonSliderPosition', this.positionLabel);
|
|
@@ -17046,20 +17566,28 @@ function formatSize(bytes) {
|
|
|
17046
17566
|
}
|
|
17047
17567
|
/** A drag-and-drop file upload zone with a selected-files list. */
|
|
17048
17568
|
class BuiFileUpload {
|
|
17569
|
+
/** Whether multiple files can be selected and accumulated. */
|
|
17049
17570
|
multiple = input(false, /* @ts-ignore */
|
|
17050
17571
|
...(ngDevMode ? [{ debugName: "multiple" }] : /* istanbul ignore next */ []));
|
|
17572
|
+
/** Comma-separated list of accepted file types (the `accept` attribute). */
|
|
17051
17573
|
accept = input('', /* @ts-ignore */
|
|
17052
17574
|
...(ngDevMode ? [{ debugName: "accept" }] : /* istanbul ignore next */ []));
|
|
17575
|
+
/** Native `name` attribute for the file input. */
|
|
17053
17576
|
name = input('', /* @ts-ignore */
|
|
17054
17577
|
...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
17578
|
+
/** Optional helper text shown under the dropzone label. */
|
|
17055
17579
|
hint = input('', /* @ts-ignore */
|
|
17056
17580
|
...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
|
|
17581
|
+
/** Whether the upload zone is disabled. */
|
|
17057
17582
|
disabled = input(false, /* @ts-ignore */
|
|
17058
17583
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
17584
|
+
/** Emitted with the current file list whenever the selection changes. */
|
|
17059
17585
|
filesChange = output();
|
|
17060
17586
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
17587
|
+
/** Custom dropzone prompt text. */
|
|
17061
17588
|
dropzoneLabel = input(/* @ts-ignore */
|
|
17062
17589
|
...(ngDevMode ? [undefined, { debugName: "dropzoneLabel" }] : /* istanbul ignore next */ []));
|
|
17590
|
+
/** Custom accessible label for each remove button. */
|
|
17063
17591
|
removeLabel = input(/* @ts-ignore */
|
|
17064
17592
|
...(ngDevMode ? [undefined, { debugName: "removeLabel" }] : /* istanbul ignore next */ []));
|
|
17065
17593
|
dropzoneText = buiLabel('fileUploadDropzone', this.dropzoneLabel);
|
|
@@ -17251,13 +17779,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
17251
17779
|
* or with `top-progress:start` / `top-progress:set` / `top-progress:done` window events.
|
|
17252
17780
|
*/
|
|
17253
17781
|
class BuiTopProgress {
|
|
17782
|
+
/** CSS color (or gradient) used to fill the bar. */
|
|
17254
17783
|
color = input('var(--color-primary, #6366f1)', /* @ts-ignore */
|
|
17255
17784
|
...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
|
|
17785
|
+
/** Bar thickness in pixels. */
|
|
17256
17786
|
height = input(2, /* @ts-ignore */
|
|
17257
17787
|
...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
|
|
17788
|
+
/** When true, renders inline within its container instead of fixed at the top of the viewport. */
|
|
17258
17789
|
demo = input(false, /* @ts-ignore */
|
|
17259
17790
|
...(ngDevMode ? [{ debugName: "demo" }] : /* istanbul ignore next */ []));
|
|
17260
17791
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
17792
|
+
/** Overrides the localized accessible progressbar label. */
|
|
17261
17793
|
ariaLabel = input(/* @ts-ignore */
|
|
17262
17794
|
...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
17263
17795
|
ariaLabelText = buiLabel('topProgressLoading', this.ariaLabel);
|
|
@@ -17368,10 +17900,13 @@ const POSITION$1 = {
|
|
|
17368
17900
|
};
|
|
17369
17901
|
/** A slide-in panel anchored to a screen edge. Toggle with the `open` model. */
|
|
17370
17902
|
class BuiDrawer {
|
|
17903
|
+
/** Whether the drawer is open. Two-way bindable with `[(open)]`. */
|
|
17371
17904
|
open = model(false, /* @ts-ignore */
|
|
17372
17905
|
...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
|
|
17906
|
+
/** Screen edge the drawer is anchored to and slides in from. */
|
|
17373
17907
|
direction = input('bottom', /* @ts-ignore */
|
|
17374
17908
|
...(ngDevMode ? [{ debugName: "direction" }] : /* istanbul ignore next */ []));
|
|
17909
|
+
/** Accessible label applied to the drawer dialog. */
|
|
17375
17910
|
ariaLabel = input('Drawer', /* @ts-ignore */
|
|
17376
17911
|
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
17377
17912
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -17456,16 +17991,22 @@ function applyMask$1(value, mask) {
|
|
|
17456
17991
|
}
|
|
17457
17992
|
/** A text input that formats its value against a mask (9 = digit, a = letter, * = alnum). */
|
|
17458
17993
|
class BuiInputMask {
|
|
17994
|
+
/** Mask pattern where `9` accepts a digit, `a` a letter, `*` an alphanumeric, and other chars are literals. */
|
|
17459
17995
|
mask = input('', /* @ts-ignore */
|
|
17460
17996
|
...(ngDevMode ? [{ debugName: "mask" }] : /* istanbul ignore next */ []));
|
|
17997
|
+
/** Current masked value. Two-way bindable with `[(value)]`. */
|
|
17461
17998
|
value = model('', /* @ts-ignore */
|
|
17462
17999
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
18000
|
+
/** Placeholder text shown when the input is empty. */
|
|
17463
18001
|
placeholder = input('', /* @ts-ignore */
|
|
17464
18002
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
18003
|
+
/** Value for the native `inputmode` attribute hinting the virtual keyboard. */
|
|
17465
18004
|
inputmode = input('', /* @ts-ignore */
|
|
17466
18005
|
...(ngDevMode ? [{ debugName: "inputmode" }] : /* istanbul ignore next */ []));
|
|
18006
|
+
/** Name attribute applied to the underlying input for form submission. */
|
|
17467
18007
|
name = input('', /* @ts-ignore */
|
|
17468
18008
|
...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
18009
|
+
/** Whether the input is disabled. Two-way bindable with `[(disabled)]`. */
|
|
17469
18010
|
disabled = model(false, /* @ts-ignore */
|
|
17470
18011
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
17471
18012
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -17539,10 +18080,13 @@ const SIDE = {
|
|
|
17539
18080
|
};
|
|
17540
18081
|
/** A sheet overlay sliding in from a screen edge. Toggle with the `open` model. */
|
|
17541
18082
|
class BuiSheet {
|
|
18083
|
+
/** Whether the sheet is open. Two-way bindable with `[(open)]`. */
|
|
17542
18084
|
open = model(false, /* @ts-ignore */
|
|
17543
18085
|
...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
|
|
18086
|
+
/** Screen edge the sheet slides in from. */
|
|
17544
18087
|
side = input('right', /* @ts-ignore */
|
|
17545
18088
|
...(ngDevMode ? [{ debugName: "side" }] : /* istanbul ignore next */ []));
|
|
18089
|
+
/** Accessible label applied to the sheet dialog. */
|
|
17546
18090
|
ariaLabel = input('Sheet', /* @ts-ignore */
|
|
17547
18091
|
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
17548
18092
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -17629,10 +18173,13 @@ const TONE = {
|
|
|
17629
18173
|
};
|
|
17630
18174
|
/** The toast viewport. Drives off the {@link BuiToaster} store. */
|
|
17631
18175
|
class BuiSonner {
|
|
18176
|
+
/** Viewport corner where toasts stack (e.g. `top-left`, `bottom-right`). */
|
|
17632
18177
|
position = input('bottom-right', /* @ts-ignore */
|
|
17633
18178
|
...(ngDevMode ? [{ debugName: "position" }] : /* istanbul ignore next */ []));
|
|
18179
|
+
/** Overrides the localized accessible label for the toast region. */
|
|
17634
18180
|
ariaLabel = input(/* @ts-ignore */
|
|
17635
18181
|
...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
18182
|
+
/** Overrides the localized accessible label for each dismiss button. */
|
|
17636
18183
|
dismissLabel = input(/* @ts-ignore */
|
|
17637
18184
|
...(ngDevMode ? [undefined, { debugName: "dismissLabel" }] : /* istanbul ignore next */ []));
|
|
17638
18185
|
ariaLabelText = buiLabel('sonner', this.ariaLabel);
|
|
@@ -17751,6 +18298,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
17751
18298
|
|
|
17752
18299
|
/** A horizontal navigation menu with hover/click dropdown panels. */
|
|
17753
18300
|
class BuiNavigationMenu {
|
|
18301
|
+
/** Top-level menu entries, each optionally opening a dropdown panel. */
|
|
17754
18302
|
items = input([], /* @ts-ignore */
|
|
17755
18303
|
...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
17756
18304
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -17925,16 +18473,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
17925
18473
|
|
|
17926
18474
|
/** A textarea that suggests mentions when you type the trigger character. */
|
|
17927
18475
|
class BuiMentionInput {
|
|
18476
|
+
/** Textarea contents. Two-way bindable with `[(value)]`. */
|
|
17928
18477
|
value = model('', /* @ts-ignore */
|
|
17929
18478
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
18479
|
+
/** Mentions offered when the trigger character is typed. */
|
|
17930
18480
|
mentions = input([], /* @ts-ignore */
|
|
17931
18481
|
...(ngDevMode ? [{ debugName: "mentions" }] : /* istanbul ignore next */ []));
|
|
18482
|
+
/** Character that opens the mention suggestion list. */
|
|
17932
18483
|
trigger = input('@', /* @ts-ignore */
|
|
17933
18484
|
...(ngDevMode ? [{ debugName: "trigger" }] : /* istanbul ignore next */ []));
|
|
18485
|
+
/** Placeholder text for the textarea. */
|
|
17934
18486
|
placeholder = input('Type @ to mention…', /* @ts-ignore */
|
|
17935
18487
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
18488
|
+
/** Number of visible textarea rows. */
|
|
17936
18489
|
rows = input(3, /* @ts-ignore */
|
|
17937
18490
|
...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
|
|
18491
|
+
/** Native `name` attribute for the textarea. */
|
|
17938
18492
|
name = input('', /* @ts-ignore */
|
|
17939
18493
|
...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
17940
18494
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -18071,18 +18625,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
18071
18625
|
|
|
18072
18626
|
/** A keyless OpenStreetMap embed centred on a coordinate. SSR-safe. */
|
|
18073
18627
|
class BuiMap {
|
|
18628
|
+
/** Latitude of the map centre, in degrees. */
|
|
18074
18629
|
lat = input(50.8503, /* @ts-ignore */
|
|
18075
18630
|
...(ngDevMode ? [{ debugName: "lat" }] : /* istanbul ignore next */ []));
|
|
18631
|
+
/** Longitude of the map centre, in degrees. */
|
|
18076
18632
|
lon = input(4.3517, /* @ts-ignore */
|
|
18077
18633
|
...(ngDevMode ? [{ debugName: "lon" }] : /* istanbul ignore next */ []));
|
|
18634
|
+
/** Zoom level; higher values zoom in closer. */
|
|
18078
18635
|
zoom = input(14, /* @ts-ignore */
|
|
18079
18636
|
...(ngDevMode ? [{ debugName: "zoom" }] : /* istanbul ignore next */ []));
|
|
18637
|
+
/** Accessible title for the map iframe. */
|
|
18080
18638
|
label = input('Location', /* @ts-ignore */
|
|
18081
18639
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
18640
|
+
/** Whether to drop a pin at the centre coordinate. */
|
|
18082
18641
|
marker = input(true, /* @ts-ignore */
|
|
18083
18642
|
...(ngDevMode ? [{ debugName: "marker" }] : /* istanbul ignore next */ []));
|
|
18643
|
+
/** Map height in pixels; ignored when `ratio` is set. */
|
|
18084
18644
|
height = input(320, /* @ts-ignore */
|
|
18085
18645
|
...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
|
|
18646
|
+
/** CSS aspect ratio (e.g. `16/9`); overrides `height` when set. */
|
|
18086
18647
|
ratio = input('', /* @ts-ignore */
|
|
18087
18648
|
...(ngDevMode ? [{ debugName: "ratio" }] : /* istanbul ignore next */ []));
|
|
18088
18649
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -18192,12 +18753,16 @@ function label(iso) {
|
|
|
18192
18753
|
}
|
|
18193
18754
|
/** A horizontal Gantt chart positioning task bars over a date range. SSR-safe. */
|
|
18194
18755
|
class BuiGantt {
|
|
18756
|
+
/** Tasks to plot as horizontal bars across the date range. */
|
|
18195
18757
|
tasks = input([], /* @ts-ignore */
|
|
18196
18758
|
...(ngDevMode ? [{ debugName: "tasks" }] : /* istanbul ignore next */ []));
|
|
18759
|
+
/** Milestones to plot as diamond markers below the task bars. */
|
|
18197
18760
|
milestones = input([], /* @ts-ignore */
|
|
18198
18761
|
...(ngDevMode ? [{ debugName: "milestones" }] : /* istanbul ignore next */ []));
|
|
18762
|
+
/** ISO start date overriding the computed range minimum; empty derives it from tasks. */
|
|
18199
18763
|
start = input('', /* @ts-ignore */
|
|
18200
18764
|
...(ngDevMode ? [{ debugName: "start" }] : /* istanbul ignore next */ []));
|
|
18765
|
+
/** ISO end date overriding the computed range maximum; empty derives it from tasks. */
|
|
18201
18766
|
end = input('', /* @ts-ignore */
|
|
18202
18767
|
...(ngDevMode ? [{ debugName: "end" }] : /* istanbul ignore next */ []));
|
|
18203
18768
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -18358,16 +18923,22 @@ function toMinutes(value) {
|
|
|
18358
18923
|
}
|
|
18359
18924
|
/** A week/day calendar grid with positioned events. SSR-safe. */
|
|
18360
18925
|
class BuiScheduler {
|
|
18926
|
+
/** Events to position within the calendar grid. */
|
|
18361
18927
|
events = input([], /* @ts-ignore */
|
|
18362
18928
|
...(ngDevMode ? [{ debugName: "events" }] : /* istanbul ignore next */ []));
|
|
18929
|
+
/** Custom day-column headers; empty falls back to weekday names or `Today`. */
|
|
18363
18930
|
days = input([], /* @ts-ignore */
|
|
18364
18931
|
...(ngDevMode ? [{ debugName: "days" }] : /* istanbul ignore next */ []));
|
|
18932
|
+
/** First hour shown on the time axis (24-hour). */
|
|
18365
18933
|
startHour = input(8, /* @ts-ignore */
|
|
18366
18934
|
...(ngDevMode ? [{ debugName: "startHour" }] : /* istanbul ignore next */ []));
|
|
18935
|
+
/** Last hour shown on the time axis (24-hour), exclusive of the final row. */
|
|
18367
18936
|
endHour = input(18, /* @ts-ignore */
|
|
18368
18937
|
...(ngDevMode ? [{ debugName: "endHour" }] : /* istanbul ignore next */ []));
|
|
18938
|
+
/** Layout mode; `day` shows a single column, `week` shows the full week. */
|
|
18369
18939
|
view = input('week', /* @ts-ignore */
|
|
18370
18940
|
...(ngDevMode ? [{ debugName: "view" }] : /* istanbul ignore next */ []));
|
|
18941
|
+
/** Accessible label applied to the grid's `aria-label`. */
|
|
18371
18942
|
label = input('Schedule', /* @ts-ignore */
|
|
18372
18943
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
18373
18944
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -18495,8 +19066,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
18495
19066
|
|
|
18496
19067
|
/** A drag-and-drop kanban board (Angular CDK drag-drop). */
|
|
18497
19068
|
class BuiKanban {
|
|
19069
|
+
/** Columns and their cards used to seed the board. */
|
|
18498
19070
|
columns = input([], /* @ts-ignore */
|
|
18499
19071
|
...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
|
|
19072
|
+
/** Emits the updated board whenever a card is moved. */
|
|
18500
19073
|
changed = output();
|
|
18501
19074
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
18502
19075
|
board = linkedSignal(() => this.columns().map((column) => ({ ...column, cards: [...column.cards] })), /* @ts-ignore */
|
|
@@ -18614,14 +19187,19 @@ const TOOLS = [
|
|
|
18614
19187
|
];
|
|
18615
19188
|
/** A contenteditable rich-text editor with a basic formatting toolbar. */
|
|
18616
19189
|
class BuiRichTextEditor {
|
|
19190
|
+
/** Editor contents as HTML. Two-way bindable with `[(value)]`. */
|
|
18617
19191
|
value = model('', /* @ts-ignore */
|
|
18618
19192
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
19193
|
+
/** Placeholder text shown while the editor is empty. */
|
|
18619
19194
|
placeholder = input('Write something…', /* @ts-ignore */
|
|
18620
19195
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
19196
|
+
/** Accessible label for the editable region. */
|
|
18621
19197
|
ariaLabel = input('Rich text editor', /* @ts-ignore */
|
|
18622
19198
|
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
19199
|
+
/** Accessible label override for the formatting toolbar. */
|
|
18623
19200
|
formattingLabel = input(/* @ts-ignore */
|
|
18624
19201
|
...(ngDevMode ? [undefined, { debugName: "formattingLabel" }] : /* istanbul ignore next */ []));
|
|
19202
|
+
/** Name attribute associated with the editor for form submission. */
|
|
18625
19203
|
name = input('', /* @ts-ignore */
|
|
18626
19204
|
...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
18627
19205
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -18726,10 +19304,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
18726
19304
|
|
|
18727
19305
|
/** A collapsible vertical navigation sidebar. Toggle width with the `open` model. */
|
|
18728
19306
|
class BuiSidebar {
|
|
19307
|
+
/** Whether the sidebar is expanded. Two-way bindable with `[(open)]`. */
|
|
18729
19308
|
open = model(true, /* @ts-ignore */
|
|
18730
19309
|
...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
|
|
19310
|
+
/** Edge the sidebar is docked to, which sets its border side. */
|
|
18731
19311
|
side = input('left', /* @ts-ignore */
|
|
18732
19312
|
...(ngDevMode ? [{ debugName: "side" }] : /* istanbul ignore next */ []));
|
|
19313
|
+
/** Collapse behavior: hide entirely (`offcanvas`) or shrink to an icon rail (`icon`). */
|
|
18733
19314
|
collapsible = input('offcanvas', /* @ts-ignore */
|
|
18734
19315
|
...(ngDevMode ? [{ debugName: "collapsible" }] : /* istanbul ignore next */ []));
|
|
18735
19316
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -18755,6 +19336,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
18755
19336
|
}], 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 }] }] } });
|
|
18756
19337
|
/** A styled, accessible item button for a {@link BuiSidebar} menu. */
|
|
18757
19338
|
class BuiSidebarMenuButton {
|
|
19339
|
+
/** Whether this item is the current page; sets active styling and `aria-current`. */
|
|
18758
19340
|
isActive = input(false, /* @ts-ignore */
|
|
18759
19341
|
...(ngDevMode ? [{ debugName: "isActive" }] : /* istanbul ignore next */ []));
|
|
18760
19342
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|
|
@@ -18777,8 +19359,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
18777
19359
|
|
|
18778
19360
|
/** A guided product tour with a spotlight on each step's target element. SSR-safe. */
|
|
18779
19361
|
class BuiOnboardingTour {
|
|
19362
|
+
/** Whether the tour is open. Two-way bindable with `[(open)]`. */
|
|
18780
19363
|
open = model(false, /* @ts-ignore */
|
|
18781
19364
|
...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
|
|
19365
|
+
/** Ordered steps; each spotlights its `target` element in turn. */
|
|
18782
19366
|
steps = input([], /* @ts-ignore */
|
|
18783
19367
|
...(ngDevMode ? [{ debugName: "steps" }] : /* istanbul ignore next */ []));
|
|
18784
19368
|
step = signal(0, /* @ts-ignore */
|
|
@@ -19372,16 +19956,22 @@ function encodeQr(text) {
|
|
|
19372
19956
|
|
|
19373
19957
|
/** Renders a value as a scannable QR code (SVG). Level M, byte mode. SSR-safe. */
|
|
19374
19958
|
class BuiQrCode {
|
|
19959
|
+
/** Text or URL to encode into the QR code. */
|
|
19375
19960
|
value = input('', /* @ts-ignore */
|
|
19376
19961
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
19962
|
+
/** Rendered width and height of the SVG in pixels. */
|
|
19377
19963
|
size = input(160, /* @ts-ignore */
|
|
19378
19964
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
19965
|
+
/** Accessible label for the QR code image. */
|
|
19379
19966
|
label = input('QR code', /* @ts-ignore */
|
|
19380
19967
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
19968
|
+
/** Fill colour of the QR modules (dark squares). */
|
|
19381
19969
|
foreground = input('currentColor', /* @ts-ignore */
|
|
19382
19970
|
...(ngDevMode ? [{ debugName: "foreground" }] : /* istanbul ignore next */ []));
|
|
19971
|
+
/** Background fill colour behind the modules. */
|
|
19383
19972
|
background = input('transparent', /* @ts-ignore */
|
|
19384
19973
|
...(ngDevMode ? [{ debugName: "background" }] : /* istanbul ignore next */ []));
|
|
19974
|
+
/** Quiet-zone border width, in modules. */
|
|
19385
19975
|
margin = input(2, /* @ts-ignore */
|
|
19386
19976
|
...(ngDevMode ? [{ debugName: "margin" }] : /* istanbul ignore next */ []));
|
|
19387
19977
|
userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
|