@area8975/ui 0.2.2-dev.47 → 0.2.2-dev.49

package/fesm2022/area8975-ui.mjs

@@ -1,8 +1,11 @@
 import * as i0 from "@angular/core";
-import { ChangeDetectorRef, Component, DestroyRef, Directive, ElementRef, Injectable, InjectionToken, Injector, TemplateRef, ViewEncapsulation, afterNextRender, booleanAttribute, computed, contentChild, contentChildren, effect, inject, input, isDevMode, linkedSignal, makeEnvironmentProviders, model, numberAttribute, output, provideAppInitializer, signal, untracked, viewChild } from "@angular/core";
-import { DOCUMENT, NgTemplateOutlet } from "@angular/common";
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, DOCUMENT, DestroyRef, Directive, ElementRef, Injectable, InjectionToken, Injector, TemplateRef, ViewEncapsulation, afterNextRender, afterRenderEffect, booleanAttribute, computed, contentChild, contentChildren, effect, inject, input, isDevMode, linkedSignal, makeEnvironmentProviders, model, numberAttribute, output, provideAppInitializer, signal, untracked, viewChild } from "@angular/core";
+import { DOCUMENT as DOCUMENT$1, NgTemplateOutlet } from "@angular/common";
 import { NgIcon, provideIcons } from "@ng-icons/core";
-import { heroArrowUp, heroArrowUpTray, heroBars2, heroBars3, heroCalendar, heroCalendarDateRange, heroCheck, heroChevronDoubleLeft, heroChevronDown, heroChevronLeft, heroChevronRight, heroClock, heroDocument, heroEye, heroEyeSlash, heroFunnel, heroMagnifyingGlass, heroMinus, heroPlus, heroQuestionMarkCircle, heroViewColumns, heroXMark } from "@ng-icons/heroicons/outline";
+import { heroArrowUp, heroArrowUpTray, heroArrowUturnLeft, heroArrowUturnRight, heroBars2, heroBars3, heroBold, heroCalendar, heroCalendarDateRange, heroChatBubbleLeft, heroCheck, heroChevronDoubleLeft, heroChevronDown, heroChevronLeft, heroChevronRight, heroClock, heroCodeBracket, heroCodeBracketSquare, heroDocument, heroEye, heroEyeSlash, heroFunnel, heroH1, heroH2, heroH3, heroItalic, heroLink, heroListBullet, heroMagnifyingGlass, heroMinus, heroNumberedList, heroPlus, heroQuestionMarkCircle, heroStrikethrough, heroUnderline, heroViewColumns, heroXMark } from "@ng-icons/heroicons/outline";
+import { Editor } from "@tiptap/core";
+import { Placeholder } from "@tiptap/extensions";
+import StarterKit from "@tiptap/starter-kit";
 import { takeUntilDestroyed, toObservable } from "@angular/core/rxjs-interop";
 import { Subject, catchError, debounceTime, filter, of, skip, switchMap } from "rxjs";
 import { autoUpdate, computePosition, flip, offset, shift } from "@floating-ui/dom";
@@ -76,7 +79,7 @@ function injectMoneyFormatter(options = {}) {
 var UiDarkClass = class UiDarkClass {
 	isDark = signal(false, ...ngDevMode ? [{ debugName: "isDark" }] : /* istanbul ignore next */ []);
 	constructor() {
-		const root = inject(DOCUMENT).documentElement;
+		const root = inject(DOCUMENT$1).documentElement;
 		const read = () => this.isDark.set(root.classList.contains("dark"));
 		read();
 		if (typeof MutationObserver === "undefined") return;
@@ -3658,6 +3661,7 @@ var UiDropzoneComponent = class UiDropzoneComponent {
 			value: "valueChange",
 			rejected: "rejected"
 		},
+		host: { properties: { "attr.id": "null" } },
 		providers: [provideIcons({
 			heroArrowUpTray,
 			heroDocument
@@ -3695,6 +3699,7 @@ i0.ɵɵngDeclareClassMetadata({
 		type: Component,
 		args: [{
 			selector: "ui-dropzone",
+			host: { "[attr.id]": "null" },
 			imports: [NgIcon],
 			providers: [provideIcons({
 				heroArrowUpTray,
@@ -3817,9 +3822,25 @@ var UiFieldComponent = class UiFieldComponent {
 	for = input("", ...ngDevMode ? [{ debugName: "for" }] : /* istanbul ignore next */ []);
 	hintId = input("", ...ngDevMode ? [{ debugName: "hintId" }] : /* istanbul ignore next */ []);
 	errorId = input("", ...ngDevMode ? [{ debugName: "errorId" }] : /* istanbul ignore next */ []);
+	labelId = computed(() => this.for() && this.label() ? `${this.for()}-label` : "", ...ngDevMode ? [{ debugName: "labelId" }] : /* istanbul ignore next */ []);
+	document = inject(DOCUMENT);
 	get forAttr() {
 		return this.for() || null;
 	}
+	get labelIdAttr() {
+		return this.labelId() || null;
+	}
+	onClick(event) {
+		const label = event.target.closest("label");
+		if (!label?.classList.contains("ui-field-label")) return;
+		const control = label.control;
+		if (control instanceof HTMLInputElement && (control.type === "checkbox" || control.type === "radio")) return;
+		const target = control ?? (this.for() ? this.document.getElementById(this.for()) : null);
+		if (target) {
+			event.preventDefault();
+			target.focus();
+		}
+	}
 	get hintAttr() {
 		return this.hintId() || null;
 	}
@@ -3891,9 +3912,12 @@ var UiFieldComponent = class UiFieldComponent {
 				transformFunction: null
 			}
 		},
-		host: { classAttribute: "block" },
+		host: {
+			listeners: { "click": "onClick($event)" },
+			classAttribute: "block"
+		},
 		ngImport: i0,
-		template: "@if (label()) {\n    <label\n        [attr.for]=\"forAttr\"\n        class=\"ui-text-body ui-field-label\"\n    >\n        {{ label() }}\n\n        @if (required()) {\n            <span class=\"text-danger-500\" aria-hidden=\"true\">*</span>\n            <span class=\"sr-only\">(required)</span>\n        }\n    </label>\n}\n\n<ng-content />\n\n@if (error()) {\n    <div\n        [attr.id]=\"errorAttr\"\n        class=\"text-danger-600 ui-text-caption ui-field-hint\"\n        role=\"alert\"\n    >\n        {{ error() }}\n    </div>\n} @else if (hint()) {\n    <div\n        [attr.id]=\"hintAttr\"\n        class=\"text-muted-foreground-1 ui-text-caption ui-field-hint\"\n    >\n        {{ hint() }}\n    </div>\n}\n",
+		template: "@if (label()) {\n    <label\n        [attr.id]=\"labelIdAttr\"\n        [attr.for]=\"forAttr\"\n        class=\"ui-text-body ui-field-label\"\n    >\n        {{ label() }}\n\n        @if (required()) {\n            <span class=\"text-danger-500\" aria-hidden=\"true\">*</span>\n            <span class=\"sr-only\">(required)</span>\n        }\n    </label>\n}\n\n<ng-content />\n\n@if (error()) {\n    <div\n        [attr.id]=\"errorAttr\"\n        class=\"text-danger-600 ui-text-caption ui-field-hint\"\n        role=\"alert\"\n    >\n        {{ error() }}\n    </div>\n} @else if (hint()) {\n    <div\n        [attr.id]=\"hintAttr\"\n        class=\"text-muted-foreground-1 ui-text-caption ui-field-hint\"\n    >\n        {{ hint() }}\n    </div>\n}\n",
 		styles: [":host{position:relative}.ui-field-label{margin-bottom:calc(var(--spacing, .25rem) * 1.5);display:inline-flex;align-items:center;column-gap:calc(var(--spacing, .25rem) * 2)}.ui-field-hint{margin-top:calc(var(--spacing, .25rem) * 1.5);display:inline-flex;align-items:center;column-gap:calc(var(--spacing, .25rem) * 2)}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"]
 	});
 };
@@ -3906,8 +3930,11 @@ i0.ɵɵngDeclareClassMetadata({
 		type: Component,
 		args: [{
 			selector: "ui-field",
-			host: { class: "block" },
-			template: "@if (label()) {\n    <label\n        [attr.for]=\"forAttr\"\n        class=\"ui-text-body ui-field-label\"\n    >\n        {{ label() }}\n\n        @if (required()) {\n            <span class=\"text-danger-500\" aria-hidden=\"true\">*</span>\n            <span class=\"sr-only\">(required)</span>\n        }\n    </label>\n}\n\n<ng-content />\n\n@if (error()) {\n    <div\n        [attr.id]=\"errorAttr\"\n        class=\"text-danger-600 ui-text-caption ui-field-hint\"\n        role=\"alert\"\n    >\n        {{ error() }}\n    </div>\n} @else if (hint()) {\n    <div\n        [attr.id]=\"hintAttr\"\n        class=\"text-muted-foreground-1 ui-text-caption ui-field-hint\"\n    >\n        {{ hint() }}\n    </div>\n}\n",
+			host: {
+				class: "block",
+				"(click)": "onClick($event)"
+			},
+			template: "@if (label()) {\n    <label\n        [attr.id]=\"labelIdAttr\"\n        [attr.for]=\"forAttr\"\n        class=\"ui-text-body ui-field-label\"\n    >\n        {{ label() }}\n\n        @if (required()) {\n            <span class=\"text-danger-500\" aria-hidden=\"true\">*</span>\n            <span class=\"sr-only\">(required)</span>\n        }\n    </label>\n}\n\n<ng-content />\n\n@if (error()) {\n    <div\n        [attr.id]=\"errorAttr\"\n        class=\"text-danger-600 ui-text-caption ui-field-hint\"\n        role=\"alert\"\n    >\n        {{ error() }}\n    </div>\n} @else if (hint()) {\n    <div\n        [attr.id]=\"hintAttr\"\n        class=\"text-muted-foreground-1 ui-text-caption ui-field-hint\"\n    >\n        {{ hint() }}\n    </div>\n}\n",
 			styles: [":host{position:relative}.ui-field-label{margin-bottom:calc(var(--spacing, .25rem) * 1.5);display:inline-flex;align-items:center;column-gap:calc(var(--spacing, .25rem) * 2)}.ui-field-hint{margin-top:calc(var(--spacing, .25rem) * 1.5);display:inline-flex;align-items:center;column-gap:calc(var(--spacing, .25rem) * 2)}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"]
 		}]
 	}],
@@ -4279,6 +4306,7 @@ var UiInputComponent = class UiInputComponent {
 			focused: "focused",
 			blurred: "blurred"
 		},
+		host: { properties: { "attr.id": "null" } },
 		providers: [provideIcons({
 			heroEyeSlash,
 			heroEye
@@ -4331,6 +4359,7 @@ i0.ɵɵngDeclareClassMetadata({
 		type: Component,
 		args: [{
 			selector: "ui-input",
+			host: { "[attr.id]": "null" },
 			imports: [NgTemplateOutlet, NgIcon],
 			providers: [provideIcons({
 				heroEyeSlash,
@@ -4937,20 +4966,983 @@ i0.ɵɵngDeclareClassMetadata({
 			type: i0.Input,
 			args: [{
 				isSignal: true,
-				alias: "validationState",
+				alias: "validationState",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["validationStateChange"]
+		}],
+		compareWith: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "compareWith",
+				required: false
+			}]
+		}]
+	}
+});
+const ButtonGroupAppearances = ["attached", "segmented"];
+const UI_BUTTON_GROUP = new InjectionToken("UI_BUTTON_GROUP");
+var UiButtonComponent = class UiButtonComponent {
+	appearance = input("solid", ...ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []);
+	intent = input("primary", ...ngDevMode ? [{ debugName: "intent" }] : /* istanbul ignore next */ []);
+	size = input("md", ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
+	classes = input("", ...ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []);
+	type = input("button", ...ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []);
+	ariaLabel = input("", ...ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []);
+	disabled = input(false, {
+		...ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	loading = input(false, {
+		...ngDevMode ? { debugName: "loading" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	isDisabled = computed(() => this.disabled() || this.loading(), ...ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []);
+	group = inject(UI_BUTTON_GROUP, { optional: true });
+	segmented = computed(() => this.group?.appearance() === "segmented", ...ngDevMode ? [{ debugName: "segmented" }] : /* istanbul ignore next */ []);
+	generatedClasses = computed(() => [
+		"ui-button",
+		this.intentAndAppearanceClasses(),
+		this.sizeClasses(),
+		this.textClasses(),
+		this.classes()
+	].filter(Boolean).join(" "), ...ngDevMode ? [{ debugName: "generatedClasses" }] : /* istanbul ignore next */ []);
+	intentAndAppearanceClasses = computed(() => {
+		if (this.segmented()) return "ui-button--segmented";
+		const intent = this.intent();
+		const appearance = this.appearance();
+		return [intent, appearance].includes("none") ? "" : `ui-button--${intent}-${appearance}`;
+	}, ...ngDevMode ? [{ debugName: "intentAndAppearanceClasses" }] : /* istanbul ignore next */ []);
+	sizeClasses = computed(() => this.segmented() ? "" : `ui-button--${this.size()}`, ...ngDevMode ? [{ debugName: "sizeClasses" }] : /* istanbul ignore next */ []);
+	textClasses = computed(() => this.segmented() ? "ui-text-body-alt" : {
+		sm: "ui-text-caption",
+		md: "ui-text-body",
+		lg: "ui-text-body"
+	}[this.size()], ...ngDevMode ? [{ debugName: "textClasses" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: UiButtonComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: UiButtonComponent,
+		isStandalone: true,
+		selector: "ui-button",
+		inputs: {
+			appearance: {
+				classPropertyName: "appearance",
+				publicName: "appearance",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			intent: {
+				classPropertyName: "intent",
+				publicName: "intent",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			size: {
+				classPropertyName: "size",
+				publicName: "size",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			classes: {
+				classPropertyName: "classes",
+				publicName: "classes",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			type: {
+				classPropertyName: "type",
+				publicName: "type",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			ariaLabel: {
+				classPropertyName: "ariaLabel",
+				publicName: "ariaLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			disabled: {
+				classPropertyName: "disabled",
+				publicName: "disabled",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			loading: {
+				classPropertyName: "loading",
+				publicName: "loading",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: { properties: { "class.pointer-events-none": "isDisabled()" } },
+		ngImport: i0,
+		template: "<button\n    [type]=\"type()\"\n    [disabled]=\"isDisabled()\"\n    [class]=\"generatedClasses()\"\n    [attr.aria-label]=\"ariaLabel() || null\"\n    [attr.aria-busy]=\"loading() || null\"\n>\n    <ng-content></ng-content>\n\n    @if (loading()) {\n        <span class=\"sr-only\">Loading</span>\n\n        <span class=\"flex items-end justify-center\" aria-hidden=\"true\">\n            <span class=\"ms-0.5 inline-flex items-end gap-px pb-px\">\n                <span class=\"ui-button__loading-dot\">.</span>\n                <span class=\"ui-button__loading-dot\">.</span>\n                <span class=\"ui-button__loading-dot\">.</span>\n            </span>\n        </span>\n    }\n</button>\n",
+		styles: ["@layer properties;.ui-button{position:relative;display:inline-flex;align-items:center;column-gap:calc(var(--spacing, .25rem) * 2);border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:1px;transition-property:colors,box-shadow;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.ui-button:focus{--tw-outline-style: none;outline-style:none}.ui-button:focus-visible{z-index:10}.ui-button:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button:disabled{pointer-events:none}.ui-button:disabled{opacity:50%}.ui-button--sm{padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.ui-button--md{padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3)}.ui-button--lg{padding-inline:calc(var(--spacing, .25rem) * 5);padding-block:calc(var(--spacing, .25rem) * 4)}ui-button-group:not(.ui-button-group--segmented)>:host(:first-child:not(:only-child)) .ui-button{border-start-end-radius:0;border-end-end-radius:0;--tw-shadow: 0 0 #0000 !important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}ui-button-group:not(.ui-button-group--segmented)>:host(:not(:first-child):not(:last-child)) .ui-button{border-radius:0;--tw-shadow: 0 0 #0000 !important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}ui-button-group:not(.ui-button-group--segmented)>:host(:last-child:not(:only-child)) .ui-button{border-start-start-radius:0;border-end-start-radius:0;--tw-shadow: 0 0 #0000 !important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}ui-button-group:not(.ui-button-group--segmented)>:host(:not(:first-child)) .ui-button{margin-inline-start:-1px}.ui-button--segmented{min-height:calc(1lh + calc(var(--spacing, .25rem) * 3));cursor:pointer;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 1.5);white-space:nowrap;color:var(--muted-foreground-1);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s;-webkit-user-select:none;user-select:none;justify-content:center;border-color:transparent;--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--segmented:hover{color:var(--foreground)}.ui-button--segmented:hover,.ui-button--segmented:focus-visible{background-color:var(--surface)}ui-input-group>:host .ui-button{border-radius:0!important;border-style:var(--tw-border-style)!important;border-width:0px!important;--tw-shadow: 0 0 #0000 !important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}ui-input-group>:host(:not(:last-child)) .ui-button{border-right-style:var(--tw-border-style)!important;border-right-width:1px!important;border-color:var(--border-line-2)!important}ui-button-group>:host(:not(:first-child)) .ui-button[class*=-outline]{border-inline-start-color:var(--color-gray-200, oklch(92.8% .006 264.531))}@keyframes spinner-ellipsis{0%,70%,to{transform:translateY(0)}35%{transform:translateY(-.4em)}}.ui-button__loading-dot{display:inline-block;animation:spinner-ellipsis 1s ease-in-out infinite}.ui-button__loading-dot:nth-child(2){animation-delay:.12s}.ui-button__loading-dot:nth-child(3){animation-delay:.24s}@media(prefers-reduced-motion:reduce){.ui-button__loading-dot{animation:none}}.ui-button--primary-solid{border-color:transparent;background-color:var(--color-primary-600, var(--color-blue-600));color:var(--color-white, #fff);--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--primary-solid:hover,.ui-button--primary-solid:focus-visible{background-color:var(--color-primary-700, var(--color-blue-700))}.ui-button--primary-outline{border-color:var(--color-primary-600, var(--color-blue-600));background-color:transparent;color:var(--color-primary-600, var(--color-blue-600));--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--primary-outline:hover,.ui-button--primary-outline:focus-visible{border-color:var(--color-primary-700, var(--color-blue-700))}.ui-button--primary-outline:hover,.ui-button--primary-outline:focus-visible{background-color:var(--color-primary-700, var(--color-blue-700))}.ui-button--primary-outline:hover,.ui-button--primary-outline:focus-visible{color:var(--color-white, #fff)}.ui-button--primary-ghost{border-color:transparent;background-color:transparent;color:var(--color-primary-600, var(--color-blue-600));--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--primary-ghost:hover,.ui-button--primary-ghost:focus-visible{background-color:var(--color-primary-100, var(--color-blue-100))}.ui-button--primary-ghost:hover,.ui-button--primary-ghost:focus-visible{color:var(--color-primary-800, var(--color-blue-800))}.ui-button--primary-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--color-primary-600, var(--color-blue-600));--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--primary-white:hover,.ui-button--primary-white:focus-visible{background-color:var(--layer-focus)}.ui-button--primary-link{border-color:transparent;background-color:transparent;color:var(--color-primary-500, var(--color-blue-500))}.ui-button--primary-link:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button--primary-link:hover,.ui-button--primary-link:focus-visible{color:var(--color-primary-600, var(--color-blue-600))}.ui-button--primary-link:hover,.ui-button--primary-link:focus-visible{text-decoration-line:underline}.ui-button--secondary-solid{border-color:transparent;background-color:var(--color-secondary-900, var(--color-gray-900));color:var(--color-white, #fff);--tw-ring-color: var(--color-secondary-200, var(--color-gray-200))}.ui-button--secondary-solid:hover,.ui-button--secondary-solid:focus-visible{background-color:var(--color-secondary-800, var(--color-gray-800))}.ui-button--secondary-outline{border-color:var(--color-secondary-900, var(--color-gray-900));background-color:transparent;color:var(--foreground);--tw-ring-color: var(--color-secondary-200, var(--color-gray-200))}.ui-button--secondary-outline:hover,.ui-button--secondary-outline:focus-visible{border-color:var(--color-secondary-800, var(--color-gray-800))}.ui-button--secondary-outline:hover,.ui-button--secondary-outline:focus-visible{background-color:var(--color-secondary-800, var(--color-gray-800))}.ui-button--secondary-outline:hover,.ui-button--secondary-outline:focus-visible{color:var(--foreground-inverse)}.ui-button--secondary-ghost{border-color:transparent;background-color:transparent;color:var(--foreground);--tw-ring-color: var(--color-secondary-200, var(--color-gray-200))}.ui-button--secondary-ghost:hover,.ui-button--secondary-ghost:focus-visible{background-color:var(--muted-hover)}.ui-button--secondary-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--layer-foreground);--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-secondary-200, var(--color-gray-200))}.ui-button--secondary-white:hover,.ui-button--secondary-white:focus-visible{background-color:var(--layer-hover)}.ui-button--secondary-link{border-color:transparent;background-color:transparent;color:var(--color-secondary-900, var(--color-gray-900))}.ui-button--secondary-link:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button--secondary-link:hover,.ui-button--secondary-link:focus-visible{color:var(--color-secondary-800, var(--color-gray-800))}.ui-button--secondary-link:hover,.ui-button--secondary-link:focus-visible{text-decoration-line:underline}.ui-button--success-solid{border-color:transparent;background-color:var(--color-success-500, var(--color-teal-500));color:var(--color-white, #fff)}.ui-button--success-solid:hover,.ui-button--success-solid:focus-visible{background-color:var(--color-success-600, var(--color-teal-600))}.ui-button--success-outline{border-color:var(--color-success-500, var(--color-teal-500));background-color:transparent;color:var(--color-success-500, var(--color-teal-500));--tw-ring-color: var(--color-success-200, var(--color-teal-200))}.ui-button--success-outline:hover,.ui-button--success-outline:focus-visible{border-color:var(--color-success-600, var(--color-teal-600))}.ui-button--success-outline:hover,.ui-button--success-outline:focus-visible{background-color:var(--color-success-600, var(--color-teal-600))}.ui-button--success-outline:hover,.ui-button--success-outline:focus-visible{color:var(--color-white, #fff)}.ui-button--success-ghost{border-color:transparent;background-color:transparent;color:var(--color-success-500, var(--color-teal-500));--tw-ring-color: var(--color-success-200, var(--color-teal-200))}.ui-button--success-ghost:hover,.ui-button--success-ghost:focus-visible{background-color:var(--color-success-100, var(--color-teal-100))}.ui-button--success-ghost:hover,.ui-button--success-ghost:focus-visible{color:var(--color-success-800, var(--color-teal-800))}.ui-button--success-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--color-success-500, var(--color-teal-500));--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-success-200, var(--color-teal-200))}.ui-button--success-white:hover,.ui-button--success-white:focus-visible{background-color:var(--layer-hover)}.ui-button--success-link{border-color:transparent;background-color:transparent;color:var(--color-success-500, var(--color-teal-500))}.ui-button--success-link:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button--success-link:hover,.ui-button--success-link:focus-visible{color:var(--color-success-600, var(--color-teal-600))}.ui-button--success-link:hover,.ui-button--success-link:focus-visible{text-decoration-line:underline}.ui-button--warning-solid{border-color:transparent;background-color:var(--color-warning-500, var(--color-yellow-500));color:var(--color-white, #fff);--tw-ring-color: var(--color-warning-200, var(--color-yellow-200))}.ui-button--warning-solid:hover,.ui-button--warning-solid:focus-visible{background-color:var(--color-warning-600, var(--color-yellow-600))}.ui-button--warning-outline{border-color:var(--color-warning-500, var(--color-yellow-500));background-color:transparent;color:var(--color-warning-500, var(--color-yellow-500));--tw-ring-color: var(--color-warning-200, var(--color-yellow-200))}.ui-button--warning-outline:hover,.ui-button--warning-outline:focus-visible{border-color:var(--color-warning-600, var(--color-yellow-600))}.ui-button--warning-outline:hover,.ui-button--warning-outline:focus-visible{background-color:var(--color-warning-600, var(--color-yellow-600))}.ui-button--warning-outline:hover,.ui-button--warning-outline:focus-visible{color:var(--color-white, #fff)}.ui-button--warning-ghost{border-color:transparent;background-color:transparent;color:var(--color-warning-500, var(--color-yellow-500));--tw-ring-color: var(--color-warning-200, var(--color-yellow-200))}.ui-button--warning-ghost:hover,.ui-button--warning-ghost:focus-visible{background-color:var(--color-warning-100, var(--color-yellow-100))}.ui-button--warning-ghost:hover,.ui-button--warning-ghost:focus-visible{color:var(--color-warning-800, var(--color-yellow-800))}.ui-button--warning-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--color-warning-500, var(--color-yellow-500));--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-warning-200, var(--color-yellow-200))}.ui-button--warning-white:hover,.ui-button--warning-white:focus-visible{background-color:var(--layer-hover)}.ui-button--warning-link{border-color:transparent;background-color:transparent;color:var(--color-warning-500, var(--color-yellow-500))}.ui-button--warning-link:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button--warning-link:hover,.ui-button--warning-link:focus-visible{color:var(--color-warning-600, var(--color-yellow-600))}.ui-button--warning-link:hover,.ui-button--warning-link:focus-visible{text-decoration-line:underline}.ui-button--danger-solid{border-color:transparent;background-color:var(--color-danger-500, var(--color-red-500));color:var(--color-white, #fff);--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-solid:hover,.ui-button--danger-solid:focus-visible{background-color:var(--color-danger-600, var(--color-red-600))}.ui-button--danger-outline{border-color:var(--color-danger-500, var(--color-red-500));background-color:transparent;color:var(--color-danger-500, var(--color-red-500));--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-outline:hover,.ui-button--danger-outline:focus-visible{border-color:var(--color-danger-600, var(--color-red-600))}.ui-button--danger-outline:hover,.ui-button--danger-outline:focus-visible{background-color:var(--color-danger-600, var(--color-red-600))}.ui-button--danger-outline:hover,.ui-button--danger-outline:focus-visible{color:var(--color-white, #fff)}.ui-button--danger-ghost{border-color:transparent;background-color:transparent;color:var(--color-danger-500, var(--color-red-500));--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-ghost:hover,.ui-button--danger-ghost:focus-visible{background-color:var(--color-danger-100, var(--color-red-100))}.ui-button--danger-ghost:hover,.ui-button--danger-ghost:focus-visible{color:var(--color-danger-800, var(--color-red-800))}.ui-button--danger-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--color-danger-500, var(--color-red-500));--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-white:hover,.ui-button--danger-white:focus-visible{background-color:var(--layer-hover)}.ui-button--danger-link{border-color:transparent;background-color:transparent;color:var(--color-danger-500, var(--color-red-500));--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-link:hover,.ui-button--danger-link:focus-visible{color:var(--color-danger-600, var(--color-red-600))}.ui-button--danger-link:hover,.ui-button--danger-link:focus-visible{text-decoration-line:underline}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-duration: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"]
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: UiButtonComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ui-button",
+			host: { "[class.pointer-events-none]": "isDisabled()" },
+			template: "<button\n    [type]=\"type()\"\n    [disabled]=\"isDisabled()\"\n    [class]=\"generatedClasses()\"\n    [attr.aria-label]=\"ariaLabel() || null\"\n    [attr.aria-busy]=\"loading() || null\"\n>\n    <ng-content></ng-content>\n\n    @if (loading()) {\n        <span class=\"sr-only\">Loading</span>\n\n        <span class=\"flex items-end justify-center\" aria-hidden=\"true\">\n            <span class=\"ms-0.5 inline-flex items-end gap-px pb-px\">\n                <span class=\"ui-button__loading-dot\">.</span>\n                <span class=\"ui-button__loading-dot\">.</span>\n                <span class=\"ui-button__loading-dot\">.</span>\n            </span>\n        </span>\n    }\n</button>\n",
+			styles: ["@layer properties;.ui-button{position:relative;display:inline-flex;align-items:center;column-gap:calc(var(--spacing, .25rem) * 2);border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:1px;transition-property:colors,box-shadow;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.ui-button:focus{--tw-outline-style: none;outline-style:none}.ui-button:focus-visible{z-index:10}.ui-button:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button:disabled{pointer-events:none}.ui-button:disabled{opacity:50%}.ui-button--sm{padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.ui-button--md{padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3)}.ui-button--lg{padding-inline:calc(var(--spacing, .25rem) * 5);padding-block:calc(var(--spacing, .25rem) * 4)}ui-button-group:not(.ui-button-group--segmented)>:host(:first-child:not(:only-child)) .ui-button{border-start-end-radius:0;border-end-end-radius:0;--tw-shadow: 0 0 #0000 !important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}ui-button-group:not(.ui-button-group--segmented)>:host(:not(:first-child):not(:last-child)) .ui-button{border-radius:0;--tw-shadow: 0 0 #0000 !important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}ui-button-group:not(.ui-button-group--segmented)>:host(:last-child:not(:only-child)) .ui-button{border-start-start-radius:0;border-end-start-radius:0;--tw-shadow: 0 0 #0000 !important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}ui-button-group:not(.ui-button-group--segmented)>:host(:not(:first-child)) .ui-button{margin-inline-start:-1px}.ui-button--segmented{min-height:calc(1lh + calc(var(--spacing, .25rem) * 3));cursor:pointer;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 1.5);white-space:nowrap;color:var(--muted-foreground-1);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s;-webkit-user-select:none;user-select:none;justify-content:center;border-color:transparent;--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--segmented:hover{color:var(--foreground)}.ui-button--segmented:hover,.ui-button--segmented:focus-visible{background-color:var(--surface)}ui-input-group>:host .ui-button{border-radius:0!important;border-style:var(--tw-border-style)!important;border-width:0px!important;--tw-shadow: 0 0 #0000 !important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}ui-input-group>:host(:not(:last-child)) .ui-button{border-right-style:var(--tw-border-style)!important;border-right-width:1px!important;border-color:var(--border-line-2)!important}ui-button-group>:host(:not(:first-child)) .ui-button[class*=-outline]{border-inline-start-color:var(--color-gray-200, oklch(92.8% .006 264.531))}@keyframes spinner-ellipsis{0%,70%,to{transform:translateY(0)}35%{transform:translateY(-.4em)}}.ui-button__loading-dot{display:inline-block;animation:spinner-ellipsis 1s ease-in-out infinite}.ui-button__loading-dot:nth-child(2){animation-delay:.12s}.ui-button__loading-dot:nth-child(3){animation-delay:.24s}@media(prefers-reduced-motion:reduce){.ui-button__loading-dot{animation:none}}.ui-button--primary-solid{border-color:transparent;background-color:var(--color-primary-600, var(--color-blue-600));color:var(--color-white, #fff);--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--primary-solid:hover,.ui-button--primary-solid:focus-visible{background-color:var(--color-primary-700, var(--color-blue-700))}.ui-button--primary-outline{border-color:var(--color-primary-600, var(--color-blue-600));background-color:transparent;color:var(--color-primary-600, var(--color-blue-600));--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--primary-outline:hover,.ui-button--primary-outline:focus-visible{border-color:var(--color-primary-700, var(--color-blue-700))}.ui-button--primary-outline:hover,.ui-button--primary-outline:focus-visible{background-color:var(--color-primary-700, var(--color-blue-700))}.ui-button--primary-outline:hover,.ui-button--primary-outline:focus-visible{color:var(--color-white, #fff)}.ui-button--primary-ghost{border-color:transparent;background-color:transparent;color:var(--color-primary-600, var(--color-blue-600));--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--primary-ghost:hover,.ui-button--primary-ghost:focus-visible{background-color:var(--color-primary-100, var(--color-blue-100))}.ui-button--primary-ghost:hover,.ui-button--primary-ghost:focus-visible{color:var(--color-primary-800, var(--color-blue-800))}.ui-button--primary-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--color-primary-600, var(--color-blue-600));--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--primary-white:hover,.ui-button--primary-white:focus-visible{background-color:var(--layer-focus)}.ui-button--primary-link{border-color:transparent;background-color:transparent;color:var(--color-primary-500, var(--color-blue-500))}.ui-button--primary-link:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button--primary-link:hover,.ui-button--primary-link:focus-visible{color:var(--color-primary-600, var(--color-blue-600))}.ui-button--primary-link:hover,.ui-button--primary-link:focus-visible{text-decoration-line:underline}.ui-button--secondary-solid{border-color:transparent;background-color:var(--color-secondary-900, var(--color-gray-900));color:var(--color-white, #fff);--tw-ring-color: var(--color-secondary-200, var(--color-gray-200))}.ui-button--secondary-solid:hover,.ui-button--secondary-solid:focus-visible{background-color:var(--color-secondary-800, var(--color-gray-800))}.ui-button--secondary-outline{border-color:var(--color-secondary-900, var(--color-gray-900));background-color:transparent;color:var(--foreground);--tw-ring-color: var(--color-secondary-200, var(--color-gray-200))}.ui-button--secondary-outline:hover,.ui-button--secondary-outline:focus-visible{border-color:var(--color-secondary-800, var(--color-gray-800))}.ui-button--secondary-outline:hover,.ui-button--secondary-outline:focus-visible{background-color:var(--color-secondary-800, var(--color-gray-800))}.ui-button--secondary-outline:hover,.ui-button--secondary-outline:focus-visible{color:var(--foreground-inverse)}.ui-button--secondary-ghost{border-color:transparent;background-color:transparent;color:var(--foreground);--tw-ring-color: var(--color-secondary-200, var(--color-gray-200))}.ui-button--secondary-ghost:hover,.ui-button--secondary-ghost:focus-visible{background-color:var(--muted-hover)}.ui-button--secondary-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--layer-foreground);--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-secondary-200, var(--color-gray-200))}.ui-button--secondary-white:hover,.ui-button--secondary-white:focus-visible{background-color:var(--layer-hover)}.ui-button--secondary-link{border-color:transparent;background-color:transparent;color:var(--color-secondary-900, var(--color-gray-900))}.ui-button--secondary-link:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button--secondary-link:hover,.ui-button--secondary-link:focus-visible{color:var(--color-secondary-800, var(--color-gray-800))}.ui-button--secondary-link:hover,.ui-button--secondary-link:focus-visible{text-decoration-line:underline}.ui-button--success-solid{border-color:transparent;background-color:var(--color-success-500, var(--color-teal-500));color:var(--color-white, #fff)}.ui-button--success-solid:hover,.ui-button--success-solid:focus-visible{background-color:var(--color-success-600, var(--color-teal-600))}.ui-button--success-outline{border-color:var(--color-success-500, var(--color-teal-500));background-color:transparent;color:var(--color-success-500, var(--color-teal-500));--tw-ring-color: var(--color-success-200, var(--color-teal-200))}.ui-button--success-outline:hover,.ui-button--success-outline:focus-visible{border-color:var(--color-success-600, var(--color-teal-600))}.ui-button--success-outline:hover,.ui-button--success-outline:focus-visible{background-color:var(--color-success-600, var(--color-teal-600))}.ui-button--success-outline:hover,.ui-button--success-outline:focus-visible{color:var(--color-white, #fff)}.ui-button--success-ghost{border-color:transparent;background-color:transparent;color:var(--color-success-500, var(--color-teal-500));--tw-ring-color: var(--color-success-200, var(--color-teal-200))}.ui-button--success-ghost:hover,.ui-button--success-ghost:focus-visible{background-color:var(--color-success-100, var(--color-teal-100))}.ui-button--success-ghost:hover,.ui-button--success-ghost:focus-visible{color:var(--color-success-800, var(--color-teal-800))}.ui-button--success-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--color-success-500, var(--color-teal-500));--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-success-200, var(--color-teal-200))}.ui-button--success-white:hover,.ui-button--success-white:focus-visible{background-color:var(--layer-hover)}.ui-button--success-link{border-color:transparent;background-color:transparent;color:var(--color-success-500, var(--color-teal-500))}.ui-button--success-link:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button--success-link:hover,.ui-button--success-link:focus-visible{color:var(--color-success-600, var(--color-teal-600))}.ui-button--success-link:hover,.ui-button--success-link:focus-visible{text-decoration-line:underline}.ui-button--warning-solid{border-color:transparent;background-color:var(--color-warning-500, var(--color-yellow-500));color:var(--color-white, #fff);--tw-ring-color: var(--color-warning-200, var(--color-yellow-200))}.ui-button--warning-solid:hover,.ui-button--warning-solid:focus-visible{background-color:var(--color-warning-600, var(--color-yellow-600))}.ui-button--warning-outline{border-color:var(--color-warning-500, var(--color-yellow-500));background-color:transparent;color:var(--color-warning-500, var(--color-yellow-500));--tw-ring-color: var(--color-warning-200, var(--color-yellow-200))}.ui-button--warning-outline:hover,.ui-button--warning-outline:focus-visible{border-color:var(--color-warning-600, var(--color-yellow-600))}.ui-button--warning-outline:hover,.ui-button--warning-outline:focus-visible{background-color:var(--color-warning-600, var(--color-yellow-600))}.ui-button--warning-outline:hover,.ui-button--warning-outline:focus-visible{color:var(--color-white, #fff)}.ui-button--warning-ghost{border-color:transparent;background-color:transparent;color:var(--color-warning-500, var(--color-yellow-500));--tw-ring-color: var(--color-warning-200, var(--color-yellow-200))}.ui-button--warning-ghost:hover,.ui-button--warning-ghost:focus-visible{background-color:var(--color-warning-100, var(--color-yellow-100))}.ui-button--warning-ghost:hover,.ui-button--warning-ghost:focus-visible{color:var(--color-warning-800, var(--color-yellow-800))}.ui-button--warning-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--color-warning-500, var(--color-yellow-500));--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-warning-200, var(--color-yellow-200))}.ui-button--warning-white:hover,.ui-button--warning-white:focus-visible{background-color:var(--layer-hover)}.ui-button--warning-link{border-color:transparent;background-color:transparent;color:var(--color-warning-500, var(--color-yellow-500))}.ui-button--warning-link:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button--warning-link:hover,.ui-button--warning-link:focus-visible{color:var(--color-warning-600, var(--color-yellow-600))}.ui-button--warning-link:hover,.ui-button--warning-link:focus-visible{text-decoration-line:underline}.ui-button--danger-solid{border-color:transparent;background-color:var(--color-danger-500, var(--color-red-500));color:var(--color-white, #fff);--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-solid:hover,.ui-button--danger-solid:focus-visible{background-color:var(--color-danger-600, var(--color-red-600))}.ui-button--danger-outline{border-color:var(--color-danger-500, var(--color-red-500));background-color:transparent;color:var(--color-danger-500, var(--color-red-500));--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-outline:hover,.ui-button--danger-outline:focus-visible{border-color:var(--color-danger-600, var(--color-red-600))}.ui-button--danger-outline:hover,.ui-button--danger-outline:focus-visible{background-color:var(--color-danger-600, var(--color-red-600))}.ui-button--danger-outline:hover,.ui-button--danger-outline:focus-visible{color:var(--color-white, #fff)}.ui-button--danger-ghost{border-color:transparent;background-color:transparent;color:var(--color-danger-500, var(--color-red-500));--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-ghost:hover,.ui-button--danger-ghost:focus-visible{background-color:var(--color-danger-100, var(--color-red-100))}.ui-button--danger-ghost:hover,.ui-button--danger-ghost:focus-visible{color:var(--color-danger-800, var(--color-red-800))}.ui-button--danger-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--color-danger-500, var(--color-red-500));--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-white:hover,.ui-button--danger-white:focus-visible{background-color:var(--layer-hover)}.ui-button--danger-link{border-color:transparent;background-color:transparent;color:var(--color-danger-500, var(--color-red-500));--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-link:hover,.ui-button--danger-link:focus-visible{color:var(--color-danger-600, var(--color-red-600))}.ui-button--danger-link:hover,.ui-button--danger-link:focus-visible{text-decoration-line:underline}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-duration: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"]
+		}]
+	}],
+	propDecorators: {
+		appearance: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "appearance",
+				required: false
+			}]
+		}],
+		intent: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "intent",
+				required: false
+			}]
+		}],
+		size: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "size",
+				required: false
+			}]
+		}],
+		classes: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "classes",
+				required: false
+			}]
+		}],
+		type: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "type",
+				required: false
+			}]
+		}],
+		ariaLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "ariaLabel",
+				required: false
+			}]
+		}],
+		disabled: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disabled",
+				required: false
+			}]
+		}],
+		loading: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "loading",
+				required: false
+			}]
+		}]
+	}
+});
+const RichTextTools = [
+	"bold",
+	"italic",
+	"underline",
+	"strike",
+	"code",
+	"heading1",
+	"heading2",
+	"heading3",
+	"bulletList",
+	"orderedList",
+	"blockquote",
+	"codeBlock",
+	"horizontalRule",
+	"link",
+	"undo",
+	"redo"
+];
+const RichTextToolGroups = [
+	[
+		"bold",
+		"italic",
+		"underline",
+		"strike",
+		"code"
+	],
+	[
+		"heading1",
+		"heading2",
+		"heading3"
+	],
+	[
+		"bulletList",
+		"orderedList",
+		"blockquote",
+		"codeBlock",
+		"horizontalRule"
+	],
+	["link"],
+	["undo", "redo"]
+];
+const TOOLS = {
+	bold: {
+		label: "Bold",
+		icon: "heroBold",
+		active: (editor) => editor.isActive("bold"),
+		run: (chain) => chain.toggleBold()
+	},
+	italic: {
+		label: "Italic",
+		icon: "heroItalic",
+		active: (editor) => editor.isActive("italic"),
+		run: (chain) => chain.toggleItalic()
+	},
+	underline: {
+		label: "Underline",
+		icon: "heroUnderline",
+		active: (editor) => editor.isActive("underline"),
+		run: (chain) => chain.toggleUnderline()
+	},
+	strike: {
+		label: "Strikethrough",
+		icon: "heroStrikethrough",
+		active: (editor) => editor.isActive("strike"),
+		run: (chain) => chain.toggleStrike()
+	},
+	code: {
+		label: "Inline code",
+		icon: "heroCodeBracket",
+		active: (editor) => editor.isActive("code"),
+		run: (chain) => chain.toggleCode()
+	},
+	heading1: {
+		label: "Heading 1",
+		icon: "heroH1",
+		active: (editor) => editor.isActive("heading", { level: 1 }),
+		run: (chain) => chain.toggleHeading({ level: 1 })
+	},
+	heading2: {
+		label: "Heading 2",
+		icon: "heroH2",
+		active: (editor) => editor.isActive("heading", { level: 2 }),
+		run: (chain) => chain.toggleHeading({ level: 2 })
+	},
+	heading3: {
+		label: "Heading 3",
+		icon: "heroH3",
+		active: (editor) => editor.isActive("heading", { level: 3 }),
+		run: (chain) => chain.toggleHeading({ level: 3 })
+	},
+	bulletList: {
+		label: "Bulleted list",
+		icon: "heroListBullet",
+		active: (editor) => editor.isActive("bulletList"),
+		run: (chain) => chain.toggleBulletList()
+	},
+	orderedList: {
+		label: "Numbered list",
+		icon: "heroNumberedList",
+		active: (editor) => editor.isActive("orderedList"),
+		run: (chain) => chain.toggleOrderedList()
+	},
+	blockquote: {
+		label: "Quote",
+		icon: "heroChatBubbleLeft",
+		active: (editor) => editor.isActive("blockquote"),
+		run: (chain) => chain.toggleBlockquote()
+	},
+	codeBlock: {
+		label: "Code block",
+		icon: "heroCodeBracketSquare",
+		active: (editor) => editor.isActive("codeBlock"),
+		run: (chain) => chain.toggleCodeBlock()
+	},
+	horizontalRule: {
+		label: "Divider",
+		icon: "heroMinus",
+		run: (chain) => chain.setHorizontalRule()
+	},
+	undo: {
+		label: "Undo",
+		icon: "heroArrowUturnLeft",
+		run: (chain) => chain.undo()
+	},
+	redo: {
+		label: "Redo",
+		icon: "heroArrowUturnRight",
+		run: (chain) => chain.redo()
+	}
+};
+const LINK_TOOL = {
+	label: "Link",
+	icon: "heroLink",
+	active: (editor) => editor.isActive("link"),
+	run: (chain) => chain
+};
+let nextId$5 = 0;
+var UiRichTextEditorComponent = class UiRichTextEditorComponent {
+	value = model.required(...ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []);
+	classes = input("", ...ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []);
+	tools = input(RichTextTools, ...ngDevMode ? [{ debugName: "tools" }] : /* istanbul ignore next */ []);
+	id = input("", ...ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []);
+	placeholder = input("", ...ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []);
+	required = input(false, {
+		...ngDevMode ? { debugName: "required" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	disabled = input(false, {
+		...ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	readonly = input(false, {
+		...ngDevMode ? { debugName: "readonly" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	validationState = model(null, ...ngDevMode ? [{ debugName: "validationState" }] : /* istanbul ignore next */ []);
+	spellcheck = input(true, {
+		...ngDevMode ? { debugName: "spellcheck" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	ariaLabel = input("", ...ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []);
+	describedBy = input("", ...ngDevMode ? [{ debugName: "describedBy" }] : /* istanbul ignore next */ []);
+	labelledBy = input("", ...ngDevMode ? [{ debugName: "labelledBy" }] : /* istanbul ignore next */ []);
+	focused = output();
+	blurred = output();
+	injector = inject(Injector);
+	field = inject(UiFieldComponent, { optional: true });
+	host = inject(ElementRef);
+	content = viewChild.required("content", ...ngDevMode ? [{ debugName: "content" }] : /* istanbul ignore next */ []);
+	editor = signal(null, ...ngDevMode ? [{ debugName: "editor" }] : /* istanbul ignore next */ []);
+	revision = signal(0, ...ngDevMode ? [{ debugName: "revision" }] : /* istanbul ignore next */ []);
+	lastHtml = null;
+	contentId = `ui-rich-text-editor-${nextId$5++}`;
+	linkInputId = `${this.contentId}-link`;
+	linkOpen = signal(false, ...ngDevMode ? [{ debugName: "linkOpen" }] : /* istanbul ignore next */ []);
+	linkHref = signal("", ...ngDevMode ? [{ debugName: "linkHref" }] : /* istanbul ignore next */ []);
+	focusIndex = signal(0, ...ngDevMode ? [{ debugName: "focusIndex" }] : /* istanbul ignore next */ []);
+	resolvedLabelledBy = computed(() => {
+		if (this.labelledBy()) return this.labelledBy();
+		const id = this.id();
+		return id && this.field?.for() === id ? this.field.labelId() : "";
+	}, ...ngDevMode ? [{ debugName: "resolvedLabelledBy" }] : /* istanbul ignore next */ []);
+	editable = computed(() => !this.disabled() && !this.readonly(), ...ngDevMode ? [{ debugName: "editable" }] : /* istanbul ignore next */ []);
+	toolGroups = computed(() => {
+		const tools = new Set(this.tools());
+		return RichTextToolGroups.map((group) => group.filter((tool) => tools.has(tool))).filter((group) => group.length > 0);
+	}, ...ngDevMode ? [{ debugName: "toolGroups" }] : /* istanbul ignore next */ []);
+	flatTools = computed(() => this.toolGroups().flat(), ...ngDevMode ? [{ debugName: "flatTools" }] : /* istanbul ignore next */ []);
+	showToolbar = computed(() => !this.readonly() && this.flatTools().length > 0, ...ngDevMode ? [{ debugName: "showToolbar" }] : /* istanbul ignore next */ []);
+	toolState = computed(() => {
+		this.revision();
+		const editor = this.editor();
+		const editable = this.editable();
+		const state = {};
+		for (const tool of this.flatTools()) {
+			const definition = this.toolDefinition(tool);
+			const runnable = tool === "undo" || tool === "redo" ? !!editor?.can()[tool]() : true;
+			state[tool] = {
+				active: !!editor && !!definition.active?.(editor),
+				enabled: !!editor && editable && runnable
+			};
+		}
+		return state;
+	}, ...ngDevMode ? [{ debugName: "toolState" }] : /* istanbul ignore next */ []);
+	generatedClasses = computed(() => ["ui-rich-text-editor", this.classes()].filter(Boolean).join(" "), ...ngDevMode ? [{ debugName: "generatedClasses" }] : /* istanbul ignore next */ []);
+	contentAttributes = computed(() => {
+		const attributes = {
+			id: this.id() || this.contentId,
+			class: "ui-rich-text-editor__content ui-text-body",
+			role: "textbox",
+			"aria-multiline": "true",
+			spellcheck: String(this.spellcheck())
+		};
+		const optional = {
+			"aria-label": this.ariaLabel(),
+			"aria-labelledby": this.resolvedLabelledBy(),
+			"aria-describedby": this.describedBy(),
+			"aria-required": this.required() && "true",
+			"aria-readonly": this.readonly() && "true",
+			"aria-disabled": this.disabled() && "true",
+			"aria-invalid": this.validationState() === false && "true"
+		};
+		for (const [name, value] of Object.entries(optional)) if (value) attributes[name] = value;
+		return attributes;
+	}, ...ngDevMode ? [{ debugName: "contentAttributes" }] : /* istanbul ignore next */ []);
+	extensions = computed(() => {
+		const tools = new Set(this.tools());
+		const on = (tool) => tools.has(tool) ? {} : false;
+		const levels = [
+			1,
+			2,
+			3
+		].filter((level) => tools.has(`heading${level}`));
+		return [StarterKit.configure({
+			bold: on("bold"),
+			italic: on("italic"),
+			underline: on("underline"),
+			strike: on("strike"),
+			code: on("code"),
+			heading: levels.length ? { levels: [...levels] } : false,
+			bulletList: on("bulletList"),
+			orderedList: on("orderedList"),
+			blockquote: on("blockquote"),
+			codeBlock: on("codeBlock"),
+			horizontalRule: on("horizontalRule"),
+			trailingNode: false,
+			link: tools.has("link") ? {
+				openOnClick: false,
+				autolink: true,
+				defaultProtocol: "https"
+			} : false
+		}), Placeholder.configure({ placeholder: () => this.placeholder() })];
+	}, ...ngDevMode ? [{ debugName: "extensions" }] : /* istanbul ignore next */ []);
+	constructor() {
+		afterRenderEffect(() => {
+			const extensions = this.extensions();
+			untracked(() => this.createEditor(extensions));
+		});
+		effect(() => {
+			this.editor()?.setEditable(this.editable(), false);
+		});
+		effect(() => {
+			this.editor()?.setOptions({ editorProps: { attributes: this.contentAttributes() } });
+		});
+		effect(() => {
+			const value = this.value();
+			const editor = this.editor();
+			if (editor && value !== this.lastHtml) {
+				this.lastHtml = value;
+				editor.commands.setContent(value, { emitUpdate: false });
+			}
+		});
+		inject(DestroyRef).onDestroy(() => this.editor()?.destroy());
+	}
+	toolDefinition(tool) {
+		return tool === "link" ? LINK_TOOL : TOOLS[tool];
+	}
+	runTool = (tool) => {
+		const editor = this.editor();
+		if (!editor || !this.toolState()[tool]?.enabled) return;
+		if (tool === "link") {
+			this.openLink();
+			return;
+		}
+		this.toolDefinition(tool).run(editor.chain().focus()).run();
+	};
+	onToolbarKeydown = (event) => {
+		const count = this.flatTools().length;
+		const current = this.focusIndex();
+		const next = {
+			ArrowRight: (current + 1) % count,
+			ArrowLeft: (current - 1 + count) % count,
+			Home: 0,
+			End: count - 1
+		}[event.key];
+		if (next === void 0) return;
+		event.preventDefault();
+		this.focusIndex.set(next);
+		this.host.nativeElement.querySelectorAll(".ui-rich-text-editor__tool")[next]?.focus();
+	};
+	openLink = () => {
+		const editor = this.editor();
+		if (!editor) return;
+		this.linkHref.set(editor.getAttributes("link")["href"] ?? "");
+		this.linkOpen.set(true);
+		afterNextRender(() => {
+			this.host.nativeElement.querySelector(`#${this.linkInputId}`)?.focus();
+		}, { injector: this.injector });
+	};
+	applyLink = () => {
+		const editor = this.editor();
+		const typed = this.linkHref().trim();
+		if (!editor) return;
+		if (!typed) {
+			this.removeLink();
+			return;
+		}
+		const href = /^([a-z][a-z\d+.-]*:|[/#?])/i.test(typed) ? typed : `https://${typed}`;
+		const chain = editor.chain().focus().extendMarkRange("link");
+		if (editor.state.selection.empty && !editor.isActive("link")) chain.insertContent({
+			type: "text",
+			text: href,
+			marks: [{
+				type: "link",
+				attrs: { href }
+			}]
+		});
+		else chain.setLink({ href });
+		chain.run();
+		this.linkOpen.set(false);
+	};
+	removeLink = () => {
+		this.editor()?.chain().focus().extendMarkRange("link").unsetLink().run();
+		this.linkOpen.set(false);
+	};
+	closeLink = () => {
+		this.linkOpen.set(false);
+		this.editor()?.commands.focus();
+	};
+	onLinkKeydown = (event) => {
+		if (event.key === "Enter") {
+			event.preventDefault();
+			this.applyLink();
+		} else if (event.key === "Escape") {
+			event.preventDefault();
+			this.closeLink();
+		}
+	};
+	createEditor(extensions) {
+		const previous = this.editor();
+		const content = previous ? this.htmlOf(previous) : this.value();
+		previous?.destroy();
+		const editor = new Editor({
+			element: this.content().nativeElement,
+			extensions,
+			content,
+			editable: this.editable(),
+			editorProps: { attributes: this.contentAttributes() },
+			onUpdate: ({ editor }) => {
+				this.lastHtml = this.htmlOf(editor);
+				this.value.set(this.lastHtml);
+			},
+			onTransaction: () => this.revision.update((revision) => revision + 1),
+			onFocus: ({ event }) => this.focused.emit(event),
+			onBlur: ({ event }) => this.blurred.emit(event)
+		});
+		this.lastHtml = content;
+		this.editor.set(editor);
+		if (previous && this.htmlOf(editor) !== content) {
+			this.lastHtml = this.htmlOf(editor);
+			this.value.set(this.lastHtml);
+		}
+	}
+	htmlOf(editor) {
+		return editor.isEmpty ? "" : editor.getHTML();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: UiRichTextEditorComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: UiRichTextEditorComponent,
+		isStandalone: true,
+		selector: "ui-rich-text-editor",
+		inputs: {
+			value: {
+				classPropertyName: "value",
+				publicName: "value",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			classes: {
+				classPropertyName: "classes",
+				publicName: "classes",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			tools: {
+				classPropertyName: "tools",
+				publicName: "tools",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			id: {
+				classPropertyName: "id",
+				publicName: "id",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			placeholder: {
+				classPropertyName: "placeholder",
+				publicName: "placeholder",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			required: {
+				classPropertyName: "required",
+				publicName: "required",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			disabled: {
+				classPropertyName: "disabled",
+				publicName: "disabled",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			readonly: {
+				classPropertyName: "readonly",
+				publicName: "readonly",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			validationState: {
+				classPropertyName: "validationState",
+				publicName: "validationState",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			spellcheck: {
+				classPropertyName: "spellcheck",
+				publicName: "spellcheck",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			ariaLabel: {
+				classPropertyName: "ariaLabel",
+				publicName: "ariaLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			describedBy: {
+				classPropertyName: "describedBy",
+				publicName: "describedBy",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			labelledBy: {
+				classPropertyName: "labelledBy",
+				publicName: "labelledBy",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: {
+			value: "valueChange",
+			validationState: "validationStateChange",
+			focused: "focused",
+			blurred: "blurred"
+		},
+		host: {
+			properties: { "attr.id": "null" },
+			classAttribute: "ui-rich-text-editor-host"
+		},
+		providers: [provideIcons({
+			heroArrowUturnLeft,
+			heroArrowUturnRight,
+			heroBold,
+			heroChatBubbleLeft,
+			heroCodeBracket,
+			heroCodeBracketSquare,
+			heroH1,
+			heroH2,
+			heroH3,
+			heroItalic,
+			heroLink,
+			heroListBullet,
+			heroMinus,
+			heroNumberedList,
+			heroStrikethrough,
+			heroUnderline
+		})],
+		viewQueries: [{
+			propertyName: "content",
+			first: true,
+			predicate: ["content"],
+			descendants: true,
+			isSignal: true
+		}],
+		ngImport: i0,
+		template: "<div\n    [class]=\"generatedClasses()\"\n    [attr.data-invalid]=\"validationState() === false ? '' : null\"\n    [attr.data-valid]=\"validationState() === true ? '' : null\"\n    [attr.data-disabled]=\"disabled() ? '' : null\"\n>\n    @if (showToolbar()) {\n        <div\n            class=\"ui-rich-text-editor__toolbar\"\n            role=\"toolbar\"\n            tabindex=\"-1\"\n            aria-label=\"Formatting\"\n            [attr.aria-controls]=\"id() || contentId\"\n            (keydown)=\"onToolbarKeydown($event)\"\n        >\n            @for (group of toolGroups(); track group[0]) {\n                @if (!$first) {\n                    <span\n                        class=\"ui-rich-text-editor__divider\"\n                        role=\"separator\"\n                        aria-orientation=\"vertical\"\n                    ></span>\n                }\n\n                @for (tool of group; track tool) {\n                    @let definition = toolDefinition(tool);\n                    @let state = toolState()[tool];\n\n                    <button\n                        type=\"button\"\n                        class=\"ui-rich-text-editor__tool\"\n                        [title]=\"definition.label\"\n                        [attr.aria-label]=\"definition.label\"\n                        [attr.aria-pressed]=\"definition.active ? state.active : null\"\n                        [attr.aria-disabled]=\"state.enabled ? null : 'true'\"\n                        [attr.data-active]=\"state.active ? '' : null\"\n                        [tabIndex]=\"flatTools().indexOf(tool) === focusIndex() ? 0 : -1\"\n                        (mousedown)=\"$event.preventDefault()\"\n                        (focus)=\"focusIndex.set(flatTools().indexOf(tool))\"\n                        (click)=\"runTool(tool)\"\n                    >\n                        <ng-icon [name]=\"definition.icon\" aria-hidden=\"true\" />\n                    </button>\n                }\n            }\n        </div>\n    }\n\n    @if (linkOpen()) {\n        <div\n            class=\"ui-rich-text-editor__link\"\n            tabindex=\"-1\"\n            (keydown)=\"onLinkKeydown($event)\"\n        >\n            <ui-input\n                class=\"ui-rich-text-editor__link-input\"\n                type=\"url\"\n                placeholder=\"https://\"\n                ariaLabel=\"Link address\"\n                [id]=\"linkInputId\"\n                [(value)]=\"linkHref\"\n            />\n\n            <ui-button size=\"sm\" (click)=\"applyLink()\">Apply</ui-button>\n\n            @if (toolState()['link']?.active) {\n                <ui-button\n                    size=\"sm\"\n                    appearance=\"ghost\"\n                    intent=\"danger\"\n                    (click)=\"removeLink()\"\n                >\n                    Remove\n                </ui-button>\n            }\n\n            <ui-button\n                size=\"sm\"\n                appearance=\"ghost\"\n                intent=\"secondary\"\n                (click)=\"closeLink()\"\n            >\n                Cancel\n            </ui-button>\n        </div>\n    }\n\n    <div #content class=\"ui-rich-text-editor__body\"></div>\n</div>\n",
+		styles: ["@layer properties;@layer components{.ui-rich-text-editor-host{width:100%}}.ui-rich-text-editor-host{display:block}.ui-rich-text-editor{display:flex;flex-direction:column;overflow:hidden;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:var(--border-line-2);background-color:var(--layer)}.ui-rich-text-editor:focus-within{border-color:var(--primary-focus)}.ui-rich-text-editor:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-rich-text-editor:focus-within{--tw-ring-color: color-mix(in srgb, oklch(88.2% .059 254.128) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-rich-text-editor:focus-within{--tw-ring-color: color-mix(in oklab, var(--color-primary-200, var(--color-blue-200)) 50%, transparent)}}.ui-rich-text-editor[data-disabled]{opacity:50%}.ui-rich-text-editor[data-invalid]{border-color:var(--color-danger-500, var(--color-red-500))}.ui-rich-text-editor[data-invalid]:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-rich-text-editor[data-invalid]:focus-within{--tw-ring-color: color-mix(in srgb, oklch(88.5% .062 18.334) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-rich-text-editor[data-invalid]:focus-within{--tw-ring-color: color-mix(in oklab, var(--color-danger-200, var(--color-red-200)) 50%, transparent)}}.ui-rich-text-editor[data-valid]{border-color:var(--color-success-500, var(--color-teal-500))}.ui-rich-text-editor[data-valid]:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-rich-text-editor[data-valid]:focus-within{--tw-ring-color: color-mix(in srgb, oklch(91% .096 180.426) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-rich-text-editor[data-valid]:focus-within{--tw-ring-color: color-mix(in oklab, var(--color-success-200, var(--color-teal-200)) 50%, transparent)}}.ui-rich-text-editor__toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * .5);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:var(--border-line-2);padding:var(--spacing, .25rem)}.ui-rich-text-editor__divider{margin-inline:var(--spacing, .25rem);height:calc(var(--spacing, .25rem) * 5);width:1px;background-color:var(--border-line-2)}.ui-rich-text-editor__tool{display:inline-flex;width:calc(var(--spacing, .25rem) * 8);height:calc(var(--spacing, .25rem) * 8);align-items:center;justify-content:center;border-radius:var(--radius-md, .375rem);color:var(--muted-foreground-1)}.ui-rich-text-editor__tool:hover{background-color:var(--layer-hover)}.ui-rich-text-editor__tool:hover{color:var(--foreground)}.ui-rich-text-editor__tool:focus{--tw-outline-style: none;outline-style:none}.ui-rich-text-editor__tool:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-rich-text-editor__tool:focus-visible{--tw-ring-color: color-mix(in srgb, oklch(88.2% .059 254.128) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-rich-text-editor__tool:focus-visible{--tw-ring-color: color-mix(in oklab, var(--color-primary-200, var(--color-blue-200)) 50%, transparent)}}.ui-rich-text-editor__tool[data-active]{background-color:var(--color-primary-100, var(--color-blue-100));color:var(--color-primary-700, var(--color-blue-700))}.ui-rich-text-editor__tool[data-active]:where(.dark,.dark *){background-color:color-mix(in srgb,oklch(37.9% .146 265.522) 50%,transparent)}@supports (color: color-mix(in lab,red,red)){.ui-rich-text-editor__tool[data-active]:where(.dark,.dark *){background-color:color-mix(in oklab,var(--color-primary-900, var(--color-blue-900)) 50%,transparent)}}.ui-rich-text-editor__tool[data-active]:where(.dark,.dark *){color:var(--color-primary-300, var(--color-blue-300))}.ui-rich-text-editor__tool[aria-disabled]{pointer-events:none;opacity:40%}.ui-rich-text-editor__link{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:var(--border-line-2);padding:calc(var(--spacing, .25rem) * 2)}.ui-rich-text-editor__link-input{height:calc(var(--spacing, .25rem) * 9);flex:1}.ui-rich-text-editor__body{max-height:32rem;min-height:calc(var(--spacing, .25rem) * 32);overflow-y:auto}.ui-rich-text-editor__content{min-height:calc(var(--spacing, .25rem) * 32);padding:calc(var(--spacing, .25rem) * 3);color:var(--foreground)}.ui-rich-text-editor__content:focus{--tw-outline-style: none;outline-style:none}.ui-rich-text-editor__content>*+*{margin-top:calc(var(--spacing, .25rem) * 3)}.ui-rich-text-editor__content h1{font-size:var(--text-2xl, 1.5rem);line-height:var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.ui-rich-text-editor__content h2{font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.ui-rich-text-editor__content h3{font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.ui-rich-text-editor__content ul{list-style-type:disc;padding-inline-start:calc(var(--spacing, .25rem) * 6)}.ui-rich-text-editor__content ol{list-style-type:decimal;padding-inline-start:calc(var(--spacing, .25rem) * 6)}.ui-rich-text-editor__content li>p{margin-block:calc(var(--spacing, .25rem) * .5)}.ui-rich-text-editor__content blockquote{border-inline-start-style:var(--tw-border-style);border-inline-start-width:4px;border-color:var(--border-line-3);padding-inline-start:calc(var(--spacing, .25rem) * 4);color:var(--muted-foreground-1)}.ui-rich-text-editor__content code{border-radius:.25rem;background-color:var(--muted);padding-inline:var(--spacing, .25rem);padding-block:calc(var(--spacing, .25rem) * .5);font-family:var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);font-size:.875em}.ui-rich-text-editor__content pre{overflow-x:auto;border-radius:var(--radius-md, .375rem);background-color:var(--muted);padding:calc(var(--spacing, .25rem) * 3);font-family:var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.ui-rich-text-editor__content pre code{background-color:transparent;padding:0;color:inherit}.ui-rich-text-editor__content hr{border-color:var(--border-line-2)}.ui-rich-text-editor__content hr.ProseMirror-selectednode{border-color:var(--color-primary-500, var(--color-blue-500))}.ui-rich-text-editor__content a{color:var(--color-primary-600, var(--color-blue-600));text-decoration-line:underline}.ui-rich-text-editor__content a:where(.dark,.dark *){color:var(--color-primary-400, var(--color-blue-400))}.ui-rich-text-editor__content p.is-editor-empty:first-child:before{pointer-events:none;float:inline-start;height:0px;color:var(--muted-foreground-2);content:attr(data-placeholder)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"],
+		dependencies: [
+			{
+				kind: "component",
+				type: NgIcon,
+				selector: "ng-icon",
+				inputs: [
+					"name",
+					"svg",
+					"size",
+					"strokeWidth",
+					"color"
+				]
+			},
+			{
+				kind: "component",
+				type: UiButtonComponent,
+				selector: "ui-button",
+				inputs: [
+					"appearance",
+					"intent",
+					"size",
+					"classes",
+					"type",
+					"ariaLabel",
+					"disabled",
+					"loading"
+				]
+			},
+			{
+				kind: "component",
+				type: UiInputComponent,
+				selector: "ui-input",
+				inputs: [
+					"value",
+					"classes",
+					"type",
+					"id",
+					"name",
+					"placeholder",
+					"autocomplete",
+					"inputmode",
+					"required",
+					"disabled",
+					"readonly",
+					"validationState",
+					"min",
+					"max",
+					"step",
+					"pattern",
+					"minlength",
+					"maxlength",
+					"autofocus",
+					"spellcheck",
+					"revealable",
+					"list",
+					"ariaLabel",
+					"describedBy",
+					"inputRole",
+					"ariaExpanded",
+					"ariaControls",
+					"ariaActiveDescendant",
+					"ariaAutocomplete",
+					"ariaHasPopup"
+				],
+				outputs: [
+					"valueChange",
+					"validationStateChange",
+					"focused",
+					"blurred"
+				]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush,
+		encapsulation: i0.ViewEncapsulation.None
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: UiRichTextEditorComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ui-rich-text-editor",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			encapsulation: ViewEncapsulation.None,
+			imports: [
+				NgIcon,
+				UiButtonComponent,
+				UiInputComponent
+			],
+			providers: [provideIcons({
+				heroArrowUturnLeft,
+				heroArrowUturnRight,
+				heroBold,
+				heroChatBubbleLeft,
+				heroCodeBracket,
+				heroCodeBracketSquare,
+				heroH1,
+				heroH2,
+				heroH3,
+				heroItalic,
+				heroLink,
+				heroListBullet,
+				heroMinus,
+				heroNumberedList,
+				heroStrikethrough,
+				heroUnderline
+			})],
+			host: {
+				class: "ui-rich-text-editor-host",
+				"[attr.id]": "null"
+			},
+			template: "<div\n    [class]=\"generatedClasses()\"\n    [attr.data-invalid]=\"validationState() === false ? '' : null\"\n    [attr.data-valid]=\"validationState() === true ? '' : null\"\n    [attr.data-disabled]=\"disabled() ? '' : null\"\n>\n    @if (showToolbar()) {\n        <div\n            class=\"ui-rich-text-editor__toolbar\"\n            role=\"toolbar\"\n            tabindex=\"-1\"\n            aria-label=\"Formatting\"\n            [attr.aria-controls]=\"id() || contentId\"\n            (keydown)=\"onToolbarKeydown($event)\"\n        >\n            @for (group of toolGroups(); track group[0]) {\n                @if (!$first) {\n                    <span\n                        class=\"ui-rich-text-editor__divider\"\n                        role=\"separator\"\n                        aria-orientation=\"vertical\"\n                    ></span>\n                }\n\n                @for (tool of group; track tool) {\n                    @let definition = toolDefinition(tool);\n                    @let state = toolState()[tool];\n\n                    <button\n                        type=\"button\"\n                        class=\"ui-rich-text-editor__tool\"\n                        [title]=\"definition.label\"\n                        [attr.aria-label]=\"definition.label\"\n                        [attr.aria-pressed]=\"definition.active ? state.active : null\"\n                        [attr.aria-disabled]=\"state.enabled ? null : 'true'\"\n                        [attr.data-active]=\"state.active ? '' : null\"\n                        [tabIndex]=\"flatTools().indexOf(tool) === focusIndex() ? 0 : -1\"\n                        (mousedown)=\"$event.preventDefault()\"\n                        (focus)=\"focusIndex.set(flatTools().indexOf(tool))\"\n                        (click)=\"runTool(tool)\"\n                    >\n                        <ng-icon [name]=\"definition.icon\" aria-hidden=\"true\" />\n                    </button>\n                }\n            }\n        </div>\n    }\n\n    @if (linkOpen()) {\n        <div\n            class=\"ui-rich-text-editor__link\"\n            tabindex=\"-1\"\n            (keydown)=\"onLinkKeydown($event)\"\n        >\n            <ui-input\n                class=\"ui-rich-text-editor__link-input\"\n                type=\"url\"\n                placeholder=\"https://\"\n                ariaLabel=\"Link address\"\n                [id]=\"linkInputId\"\n                [(value)]=\"linkHref\"\n            />\n\n            <ui-button size=\"sm\" (click)=\"applyLink()\">Apply</ui-button>\n\n            @if (toolState()['link']?.active) {\n                <ui-button\n                    size=\"sm\"\n                    appearance=\"ghost\"\n                    intent=\"danger\"\n                    (click)=\"removeLink()\"\n                >\n                    Remove\n                </ui-button>\n            }\n\n            <ui-button\n                size=\"sm\"\n                appearance=\"ghost\"\n                intent=\"secondary\"\n                (click)=\"closeLink()\"\n            >\n                Cancel\n            </ui-button>\n        </div>\n    }\n\n    <div #content class=\"ui-rich-text-editor__body\"></div>\n</div>\n",
+			styles: ["@layer properties;@layer components{.ui-rich-text-editor-host{width:100%}}.ui-rich-text-editor-host{display:block}.ui-rich-text-editor{display:flex;flex-direction:column;overflow:hidden;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:var(--border-line-2);background-color:var(--layer)}.ui-rich-text-editor:focus-within{border-color:var(--primary-focus)}.ui-rich-text-editor:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-rich-text-editor:focus-within{--tw-ring-color: color-mix(in srgb, oklch(88.2% .059 254.128) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-rich-text-editor:focus-within{--tw-ring-color: color-mix(in oklab, var(--color-primary-200, var(--color-blue-200)) 50%, transparent)}}.ui-rich-text-editor[data-disabled]{opacity:50%}.ui-rich-text-editor[data-invalid]{border-color:var(--color-danger-500, var(--color-red-500))}.ui-rich-text-editor[data-invalid]:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-rich-text-editor[data-invalid]:focus-within{--tw-ring-color: color-mix(in srgb, oklch(88.5% .062 18.334) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-rich-text-editor[data-invalid]:focus-within{--tw-ring-color: color-mix(in oklab, var(--color-danger-200, var(--color-red-200)) 50%, transparent)}}.ui-rich-text-editor[data-valid]{border-color:var(--color-success-500, var(--color-teal-500))}.ui-rich-text-editor[data-valid]:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-rich-text-editor[data-valid]:focus-within{--tw-ring-color: color-mix(in srgb, oklch(91% .096 180.426) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-rich-text-editor[data-valid]:focus-within{--tw-ring-color: color-mix(in oklab, var(--color-success-200, var(--color-teal-200)) 50%, transparent)}}.ui-rich-text-editor__toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * .5);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:var(--border-line-2);padding:var(--spacing, .25rem)}.ui-rich-text-editor__divider{margin-inline:var(--spacing, .25rem);height:calc(var(--spacing, .25rem) * 5);width:1px;background-color:var(--border-line-2)}.ui-rich-text-editor__tool{display:inline-flex;width:calc(var(--spacing, .25rem) * 8);height:calc(var(--spacing, .25rem) * 8);align-items:center;justify-content:center;border-radius:var(--radius-md, .375rem);color:var(--muted-foreground-1)}.ui-rich-text-editor__tool:hover{background-color:var(--layer-hover)}.ui-rich-text-editor__tool:hover{color:var(--foreground)}.ui-rich-text-editor__tool:focus{--tw-outline-style: none;outline-style:none}.ui-rich-text-editor__tool:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-rich-text-editor__tool:focus-visible{--tw-ring-color: color-mix(in srgb, oklch(88.2% .059 254.128) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-rich-text-editor__tool:focus-visible{--tw-ring-color: color-mix(in oklab, var(--color-primary-200, var(--color-blue-200)) 50%, transparent)}}.ui-rich-text-editor__tool[data-active]{background-color:var(--color-primary-100, var(--color-blue-100));color:var(--color-primary-700, var(--color-blue-700))}.ui-rich-text-editor__tool[data-active]:where(.dark,.dark *){background-color:color-mix(in srgb,oklch(37.9% .146 265.522) 50%,transparent)}@supports (color: color-mix(in lab,red,red)){.ui-rich-text-editor__tool[data-active]:where(.dark,.dark *){background-color:color-mix(in oklab,var(--color-primary-900, var(--color-blue-900)) 50%,transparent)}}.ui-rich-text-editor__tool[data-active]:where(.dark,.dark *){color:var(--color-primary-300, var(--color-blue-300))}.ui-rich-text-editor__tool[aria-disabled]{pointer-events:none;opacity:40%}.ui-rich-text-editor__link{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:var(--border-line-2);padding:calc(var(--spacing, .25rem) * 2)}.ui-rich-text-editor__link-input{height:calc(var(--spacing, .25rem) * 9);flex:1}.ui-rich-text-editor__body{max-height:32rem;min-height:calc(var(--spacing, .25rem) * 32);overflow-y:auto}.ui-rich-text-editor__content{min-height:calc(var(--spacing, .25rem) * 32);padding:calc(var(--spacing, .25rem) * 3);color:var(--foreground)}.ui-rich-text-editor__content:focus{--tw-outline-style: none;outline-style:none}.ui-rich-text-editor__content>*+*{margin-top:calc(var(--spacing, .25rem) * 3)}.ui-rich-text-editor__content h1{font-size:var(--text-2xl, 1.5rem);line-height:var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.ui-rich-text-editor__content h2{font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.ui-rich-text-editor__content h3{font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.ui-rich-text-editor__content ul{list-style-type:disc;padding-inline-start:calc(var(--spacing, .25rem) * 6)}.ui-rich-text-editor__content ol{list-style-type:decimal;padding-inline-start:calc(var(--spacing, .25rem) * 6)}.ui-rich-text-editor__content li>p{margin-block:calc(var(--spacing, .25rem) * .5)}.ui-rich-text-editor__content blockquote{border-inline-start-style:var(--tw-border-style);border-inline-start-width:4px;border-color:var(--border-line-3);padding-inline-start:calc(var(--spacing, .25rem) * 4);color:var(--muted-foreground-1)}.ui-rich-text-editor__content code{border-radius:.25rem;background-color:var(--muted);padding-inline:var(--spacing, .25rem);padding-block:calc(var(--spacing, .25rem) * .5);font-family:var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);font-size:.875em}.ui-rich-text-editor__content pre{overflow-x:auto;border-radius:var(--radius-md, .375rem);background-color:var(--muted);padding:calc(var(--spacing, .25rem) * 3);font-family:var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.ui-rich-text-editor__content pre code{background-color:transparent;padding:0;color:inherit}.ui-rich-text-editor__content hr{border-color:var(--border-line-2)}.ui-rich-text-editor__content hr.ProseMirror-selectednode{border-color:var(--color-primary-500, var(--color-blue-500))}.ui-rich-text-editor__content a{color:var(--color-primary-600, var(--color-blue-600));text-decoration-line:underline}.ui-rich-text-editor__content a:where(.dark,.dark *){color:var(--color-primary-400, var(--color-blue-400))}.ui-rich-text-editor__content p.is-editor-empty:first-child:before{pointer-events:none;float:inline-start;height:0px;color:var(--muted-foreground-2);content:attr(data-placeholder)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		value: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "value",
+				required: true
+			}]
+		}, {
+			type: i0.Output,
+			args: ["valueChange"]
+		}],
+		classes: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "classes",
+				required: false
+			}]
+		}],
+		tools: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "tools",
+				required: false
+			}]
+		}],
+		id: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "id",
+				required: false
+			}]
+		}],
+		placeholder: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "placeholder",
+				required: false
+			}]
+		}],
+		required: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "required",
+				required: false
+			}]
+		}],
+		disabled: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disabled",
+				required: false
+			}]
+		}],
+		readonly: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "readonly",
+				required: false
+			}]
+		}],
+		validationState: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "validationState",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["validationStateChange"]
+		}],
+		spellcheck: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "spellcheck",
+				required: false
+			}]
+		}],
+		ariaLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "ariaLabel",
+				required: false
+			}]
+		}],
+		describedBy: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "describedBy",
 				required: false
 			}]
-		}, {
-			type: i0.Output,
-			args: ["validationStateChange"]
 		}],
-		compareWith: [{
+		labelledBy: [{
 			type: i0.Input,
 			args: [{
 				isSignal: true,
-				alias: "compareWith",
+				alias: "labelledBy",
 				required: false
 			}]
+		}],
+		focused: [{
+			type: i0.Output,
+			args: ["focused"]
+		}],
+		blurred: [{
+			type: i0.Output,
+			args: ["blurred"]
+		}],
+		content: [{
+			type: i0.ViewChild,
+			args: ["content", { isSignal: true }]
 		}]
 	}
 });
@@ -6115,7 +7107,10 @@ var UiSelectComponent = class UiSelectComponent {
 			selectedItem: "selectedItemChange",
 			selectedItems: "selectedItemsChange"
 		},
-		host: { listeners: { "focusout": "onFocusOut($event)" } },
+		host: {
+			listeners: { "focusout": "onFocusOut($event)" },
+			properties: { "attr.id": "null" }
+		},
 		providers: [provideIcons({
 			heroChevronDown,
 			heroXMark,
@@ -6270,7 +7265,10 @@ i0.ɵɵngDeclareClassMetadata({
 				NgIcon,
 				NgTemplateOutlet
 			],
-			host: { "(focusout)": "onFocusOut($event)" },
+			host: {
+				"[attr.id]": "null",
+				"(focusout)": "onFocusOut($event)"
+			},
 			providers: [provideIcons({
 				heroChevronDown,
 				heroXMark,
@@ -6725,6 +7723,7 @@ var UiTextareaComponent = class UiTextareaComponent {
 			focused: "focused",
 			blurred: "blurred"
 		},
+		host: { properties: { "attr.id": "null" } },
 		ngImport: i0,
 		template: "<textarea\n    [value]=\"value()\"\n    [class]=\"generatedClasses()\"\n    [attr.id]=\"id() || null\"\n    [attr.name]=\"name() || null\"\n    [placeholder]=\"placeholder()\"\n    [disabled]=\"disabled()\"\n    [readOnly]=\"readonly()\"\n    [required]=\"required()\"\n    [rows]=\"rows()\"\n    [style.resize]=\"resize()\"\n    [attr.maxlength]=\"maxlength()\"\n    [attr.minlength]=\"minlength()\"\n   \n    [attr.spellcheck]=\"spellcheck()\"\n    [attr.aria-label]=\"ariaLabel() || null\"\n    [attr.aria-describedby]=\"describedBy() || null\"\n    [attr.data-invalid]=\"validationState() === false ? '' : null\"\n    [attr.data-valid]=\"validationState() === true ? '' : null\"\n    (input)=\"handleInput($event)\"\n    (focus)=\"handleFocus($event)\"\n    (blur)=\"handleBlur($event)\"\n></textarea>\n",
 		styles: ["@layer properties;@layer components{:host{width:100%}}:host{display:block}.ui-textarea{display:block;width:100%;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:var(--border-line-2);background-color:var(--layer);padding:calc(var(--spacing, .25rem) * 3)}.ui-textarea:focus{border-color:var(--primary-focus)}.ui-textarea:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-textarea:focus{--tw-ring-color: color-mix(in srgb, oklch(88.2% .059 254.128) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-textarea:focus{--tw-ring-color: color-mix(in oklab, var(--color-primary-200, var(--color-blue-200)) 50%, transparent)}}.ui-textarea:focus{--tw-outline-style: none;outline-style:none}.ui-textarea:disabled{opacity:50%}.ui-textarea[data-invalid]{border-color:var(--color-danger-500, var(--color-red-500))}.ui-textarea[data-invalid]:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-textarea[data-invalid]:focus{--tw-ring-color: color-mix(in srgb, oklch(88.5% .062 18.334) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-textarea[data-invalid]:focus{--tw-ring-color: color-mix(in oklab, var(--color-danger-200, var(--color-red-200)) 50%, transparent)}}.ui-textarea[data-valid]{border-color:var(--color-success-500, var(--color-teal-500))}.ui-textarea[data-valid]:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-textarea[data-valid]:focus{--tw-ring-color: color-mix(in srgb, oklch(91% .096 180.426) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-textarea[data-valid]:focus{--tw-ring-color: color-mix(in oklab, var(--color-success-200, var(--color-teal-200)) 50%, transparent)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"]
@@ -6739,6 +7738,7 @@ i0.ɵɵngDeclareClassMetadata({
 		type: Component,
 		args: [{
 			selector: "ui-textarea",
+			host: { "[attr.id]": "null" },
 			template: "<textarea\n    [value]=\"value()\"\n    [class]=\"generatedClasses()\"\n    [attr.id]=\"id() || null\"\n    [attr.name]=\"name() || null\"\n    [placeholder]=\"placeholder()\"\n    [disabled]=\"disabled()\"\n    [readOnly]=\"readonly()\"\n    [required]=\"required()\"\n    [rows]=\"rows()\"\n    [style.resize]=\"resize()\"\n    [attr.maxlength]=\"maxlength()\"\n    [attr.minlength]=\"minlength()\"\n   \n    [attr.spellcheck]=\"spellcheck()\"\n    [attr.aria-label]=\"ariaLabel() || null\"\n    [attr.aria-describedby]=\"describedBy() || null\"\n    [attr.data-invalid]=\"validationState() === false ? '' : null\"\n    [attr.data-valid]=\"validationState() === true ? '' : null\"\n    (input)=\"handleInput($event)\"\n    (focus)=\"handleFocus($event)\"\n    (blur)=\"handleBlur($event)\"\n></textarea>\n",
 			styles: ["@layer properties;@layer components{:host{width:100%}}:host{display:block}.ui-textarea{display:block;width:100%;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;border-color:var(--border-line-2);background-color:var(--layer);padding:calc(var(--spacing, .25rem) * 3)}.ui-textarea:focus{border-color:var(--primary-focus)}.ui-textarea:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-textarea:focus{--tw-ring-color: color-mix(in srgb, oklch(88.2% .059 254.128) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-textarea:focus{--tw-ring-color: color-mix(in oklab, var(--color-primary-200, var(--color-blue-200)) 50%, transparent)}}.ui-textarea:focus{--tw-outline-style: none;outline-style:none}.ui-textarea:disabled{opacity:50%}.ui-textarea[data-invalid]{border-color:var(--color-danger-500, var(--color-red-500))}.ui-textarea[data-invalid]:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-textarea[data-invalid]:focus{--tw-ring-color: color-mix(in srgb, oklch(88.5% .062 18.334) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-textarea[data-invalid]:focus{--tw-ring-color: color-mix(in oklab, var(--color-danger-200, var(--color-red-200)) 50%, transparent)}}.ui-textarea[data-valid]{border-color:var(--color-success-500, var(--color-teal-500))}.ui-textarea[data-valid]:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-textarea[data-valid]:focus{--tw-ring-color: color-mix(in srgb, oklch(91% .096 180.426) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-textarea[data-valid]:focus{--tw-ring-color: color-mix(in oklab, var(--color-success-200, var(--color-teal-200)) 50%, transparent)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"]
 		}]
@@ -7010,10 +8010,17 @@ const AlertIntents = [
 	"danger"
 ];
 const AlertAppearances = ["soft", "bordered"];
+const TEXT_CLASSES = {
+	sm: "ui-text-caption",
+	md: "ui-text-caption",
+	lg: "ui-text-body-alt",
+	xl: "ui-text-h3"
+};
 var UiAvatarComponent = class UiAvatarComponent {
 	name = input.required(...ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []);
 	src = input(null, ...ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []);
 	size = input("md", ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
+	colour = input(null, ...ngDevMode ? [{ debugName: "colour" }] : /* istanbul ignore next */ []);
 	failedSrc = signal(null, ...ngDevMode ? [{ debugName: "failedSrc" }] : /* istanbul ignore next */ []);
 	showImage = computed(() => {
 		const src = this.src();
@@ -7023,10 +8030,14 @@ var UiAvatarComponent = class UiAvatarComponent {
 		const words = this.name().trim().split(/\s+/).filter(Boolean);
 		return ((words[0]?.[0] ?? "") + (words.length > 1 ? words[words.length - 1][0] : "")).toUpperCase();
 	}, ...ngDevMode ? [{ debugName: "initials" }] : /* istanbul ignore next */ []);
+	ink = computed(() => {
+		const colour = this.colour();
+		return colour ? chartLabelInk(colour) : null;
+	}, ...ngDevMode ? [{ debugName: "ink" }] : /* istanbul ignore next */ []);
 	generatedClasses = computed(() => [
 		"ui-avatar",
 		`ui-avatar--${this.size()}`,
-		this.size() === "lg" ? "ui-text-body-alt" : "ui-text-caption"
+		TEXT_CLASSES[this.size()]
 	].join(" "), ...ngDevMode ? [{ debugName: "generatedClasses" }] : /* istanbul ignore next */ []);
 	imageFailed() {
 		this.failedSrc.set(this.src());
@@ -7066,286 +8077,108 @@ var UiAvatarComponent = class UiAvatarComponent {
 				isSignal: true,
 				isRequired: false,
 				transformFunction: null
+			},
+			colour: {
+				classPropertyName: "colour",
+				publicName: "colour",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
 			}
 		},
 		host: {
 			attributes: { "role": "img" },
 			properties: {
 				"attr.aria-label": "name()",
-				"class": "generatedClasses()"
+				"class": "generatedClasses()",
+				"style.background-color": "colour()",
+				"style.color": "ink()"
 			}
 		},
 		ngImport: i0,
 		template: "@if (showImage()) {\n    <img class=\"ui-avatar-image\" [src]=\"src()\" alt=\"\" (error)=\"imageFailed()\" />\n} @else {\n    <span aria-hidden=\"true\">{{ initials() }}</span>\n}\n",
-		styles: ["@layer properties;:host(.ui-avatar){display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--radius-full, calc(infinity * 1px));background-color:var(--surface);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:var(--foreground);-webkit-user-select:none;user-select:none}:host(.ui-avatar--sm){width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6)}:host(.ui-avatar--md){width:calc(var(--spacing, .25rem) * 8);height:calc(var(--spacing, .25rem) * 8)}:host(.ui-avatar--lg){width:calc(var(--spacing, .25rem) * 10);height:calc(var(--spacing, .25rem) * 10)}.ui-avatar-image{width:100%;height:100%;object-fit:cover}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"]
-	});
-};
-i0.ɵɵngDeclareClassMetadata({
-	minVersion: "12.0.0",
-	version: "22.2.1",
-	ngImport: i0,
-	type: UiAvatarComponent,
-	decorators: [{
-		type: Component,
-		args: [{
-			selector: "ui-avatar",
-			host: {
-				role: "img",
-				"[attr.aria-label]": "name()",
-				"[class]": "generatedClasses()"
-			},
-			template: "@if (showImage()) {\n    <img class=\"ui-avatar-image\" [src]=\"src()\" alt=\"\" (error)=\"imageFailed()\" />\n} @else {\n    <span aria-hidden=\"true\">{{ initials() }}</span>\n}\n",
-			styles: ["@layer properties;:host(.ui-avatar){display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--radius-full, calc(infinity * 1px));background-color:var(--surface);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:var(--foreground);-webkit-user-select:none;user-select:none}:host(.ui-avatar--sm){width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6)}:host(.ui-avatar--md){width:calc(var(--spacing, .25rem) * 8);height:calc(var(--spacing, .25rem) * 8)}:host(.ui-avatar--lg){width:calc(var(--spacing, .25rem) * 10);height:calc(var(--spacing, .25rem) * 10)}.ui-avatar-image{width:100%;height:100%;object-fit:cover}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"]
-		}]
-	}],
-	propDecorators: {
-		name: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "name",
-				required: true
-			}]
-		}],
-		src: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "src",
-				required: false
-			}]
-		}],
-		size: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "size",
-				required: false
-			}]
-		}]
-	}
-});
-const AvatarSizes = [
-	"sm",
-	"md",
-	"lg"
-];
-const BadgeIntents = [
-	"primary",
-	"secondary",
-	"success",
-	"warning",
-	"danger"
-];
-const BadgeAppearances = [
-	"solid",
-	"outline",
-	"soft"
-];
-const BadgeSizes = [
-	"xs",
-	"sm",
-	"md",
-	"lg"
-];
-const ButtonGroupAppearances = ["attached", "segmented"];
-const UI_BUTTON_GROUP = new InjectionToken("UI_BUTTON_GROUP");
-var UiButtonComponent = class UiButtonComponent {
-	appearance = input("solid", ...ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []);
-	intent = input("primary", ...ngDevMode ? [{ debugName: "intent" }] : /* istanbul ignore next */ []);
-	size = input("md", ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
-	classes = input("", ...ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []);
-	type = input("button", ...ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []);
-	ariaLabel = input("", ...ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []);
-	disabled = input(false, {
-		...ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {},
-		transform: booleanAttribute
-	});
-	loading = input(false, {
-		...ngDevMode ? { debugName: "loading" } : /* istanbul ignore next */ {},
-		transform: booleanAttribute
-	});
-	isDisabled = computed(() => this.disabled() || this.loading(), ...ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []);
-	group = inject(UI_BUTTON_GROUP, { optional: true });
-	segmented = computed(() => this.group?.appearance() === "segmented", ...ngDevMode ? [{ debugName: "segmented" }] : /* istanbul ignore next */ []);
-	generatedClasses = computed(() => [
-		"ui-button",
-		this.intentAndAppearanceClasses(),
-		this.sizeClasses(),
-		this.textClasses(),
-		this.classes()
-	].filter(Boolean).join(" "), ...ngDevMode ? [{ debugName: "generatedClasses" }] : /* istanbul ignore next */ []);
-	intentAndAppearanceClasses = computed(() => {
-		if (this.segmented()) return "ui-button--segmented";
-		const intent = this.intent();
-		const appearance = this.appearance();
-		return [intent, appearance].includes("none") ? "" : `ui-button--${intent}-${appearance}`;
-	}, ...ngDevMode ? [{ debugName: "intentAndAppearanceClasses" }] : /* istanbul ignore next */ []);
-	sizeClasses = computed(() => this.segmented() ? "" : `ui-button--${this.size()}`, ...ngDevMode ? [{ debugName: "sizeClasses" }] : /* istanbul ignore next */ []);
-	textClasses = computed(() => this.segmented() ? "ui-text-body-alt" : {
-		sm: "ui-text-caption",
-		md: "ui-text-body",
-		lg: "ui-text-body"
-	}[this.size()], ...ngDevMode ? [{ debugName: "textClasses" }] : /* istanbul ignore next */ []);
-	static ɵfac = i0.ɵɵngDeclareFactory({
-		minVersion: "12.0.0",
-		version: "22.2.1",
-		ngImport: i0,
-		type: UiButtonComponent,
-		deps: [],
-		target: i0.ɵɵFactoryTarget.Component
-	});
-	static ɵcmp = i0.ɵɵngDeclareComponent({
-		minVersion: "17.0.0",
-		version: "22.2.1",
-		type: UiButtonComponent,
-		isStandalone: true,
-		selector: "ui-button",
-		inputs: {
-			appearance: {
-				classPropertyName: "appearance",
-				publicName: "appearance",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			},
-			intent: {
-				classPropertyName: "intent",
-				publicName: "intent",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			},
-			size: {
-				classPropertyName: "size",
-				publicName: "size",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			},
-			classes: {
-				classPropertyName: "classes",
-				publicName: "classes",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			},
-			type: {
-				classPropertyName: "type",
-				publicName: "type",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			},
-			ariaLabel: {
-				classPropertyName: "ariaLabel",
-				publicName: "ariaLabel",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			},
-			disabled: {
-				classPropertyName: "disabled",
-				publicName: "disabled",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			},
-			loading: {
-				classPropertyName: "loading",
-				publicName: "loading",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			}
-		},
-		host: { properties: { "class.pointer-events-none": "isDisabled()" } },
-		ngImport: i0,
-		template: "<button\n    [type]=\"type()\"\n    [disabled]=\"isDisabled()\"\n    [class]=\"generatedClasses()\"\n    [attr.aria-label]=\"ariaLabel() || null\"\n    [attr.aria-busy]=\"loading() || null\"\n>\n    <ng-content></ng-content>\n\n    @if (loading()) {\n        <span class=\"sr-only\">Loading</span>\n\n        <span class=\"flex items-end justify-center\" aria-hidden=\"true\">\n            <span class=\"ms-0.5 inline-flex items-end gap-px pb-px\">\n                <span class=\"ui-button__loading-dot\">.</span>\n                <span class=\"ui-button__loading-dot\">.</span>\n                <span class=\"ui-button__loading-dot\">.</span>\n            </span>\n        </span>\n    }\n</button>\n",
-		styles: ["@layer properties;.ui-button{position:relative;display:inline-flex;align-items:center;column-gap:calc(var(--spacing, .25rem) * 2);border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:1px;transition-property:colors,box-shadow;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.ui-button:focus{--tw-outline-style: none;outline-style:none}.ui-button:focus-visible{z-index:10}.ui-button:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button:disabled{pointer-events:none}.ui-button:disabled{opacity:50%}.ui-button--sm{padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.ui-button--md{padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3)}.ui-button--lg{padding-inline:calc(var(--spacing, .25rem) * 5);padding-block:calc(var(--spacing, .25rem) * 4)}ui-button-group:not(.ui-button-group--segmented)>:host(:first-child:not(:only-child)) .ui-button{border-start-end-radius:0;border-end-end-radius:0;--tw-shadow: 0 0 #0000 !important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}ui-button-group:not(.ui-button-group--segmented)>:host(:not(:first-child):not(:last-child)) .ui-button{border-radius:0;--tw-shadow: 0 0 #0000 !important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}ui-button-group:not(.ui-button-group--segmented)>:host(:last-child:not(:only-child)) .ui-button{border-start-start-radius:0;border-end-start-radius:0;--tw-shadow: 0 0 #0000 !important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}ui-button-group:not(.ui-button-group--segmented)>:host(:not(:first-child)) .ui-button{margin-inline-start:-1px}.ui-button--segmented{min-height:calc(1lh + calc(var(--spacing, .25rem) * 3));cursor:pointer;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 1.5);white-space:nowrap;color:var(--muted-foreground-1);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s;-webkit-user-select:none;user-select:none;justify-content:center;border-color:transparent;--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--segmented:hover{color:var(--foreground)}.ui-button--segmented:hover,.ui-button--segmented:focus-visible{background-color:var(--surface)}ui-input-group>:host .ui-button{border-radius:0!important;border-style:var(--tw-border-style)!important;border-width:0px!important;--tw-shadow: 0 0 #0000 !important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}ui-input-group>:host(:not(:last-child)) .ui-button{border-right-style:var(--tw-border-style)!important;border-right-width:1px!important;border-color:var(--border-line-2)!important}ui-button-group>:host(:not(:first-child)) .ui-button[class*=-outline]{border-inline-start-color:var(--color-gray-200, oklch(92.8% .006 264.531))}@keyframes spinner-ellipsis{0%,70%,to{transform:translateY(0)}35%{transform:translateY(-.4em)}}.ui-button__loading-dot{display:inline-block;animation:spinner-ellipsis 1s ease-in-out infinite}.ui-button__loading-dot:nth-child(2){animation-delay:.12s}.ui-button__loading-dot:nth-child(3){animation-delay:.24s}@media(prefers-reduced-motion:reduce){.ui-button__loading-dot{animation:none}}.ui-button--primary-solid{border-color:transparent;background-color:var(--color-primary-600, var(--color-blue-600));color:var(--color-white, #fff);--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--primary-solid:hover,.ui-button--primary-solid:focus-visible{background-color:var(--color-primary-700, var(--color-blue-700))}.ui-button--primary-outline{border-color:var(--color-primary-600, var(--color-blue-600));background-color:transparent;color:var(--color-primary-600, var(--color-blue-600));--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--primary-outline:hover,.ui-button--primary-outline:focus-visible{border-color:var(--color-primary-700, var(--color-blue-700))}.ui-button--primary-outline:hover,.ui-button--primary-outline:focus-visible{background-color:var(--color-primary-700, var(--color-blue-700))}.ui-button--primary-outline:hover,.ui-button--primary-outline:focus-visible{color:var(--color-white, #fff)}.ui-button--primary-ghost{border-color:transparent;background-color:transparent;color:var(--color-primary-600, var(--color-blue-600));--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--primary-ghost:hover,.ui-button--primary-ghost:focus-visible{background-color:var(--color-primary-100, var(--color-blue-100))}.ui-button--primary-ghost:hover,.ui-button--primary-ghost:focus-visible{color:var(--color-primary-800, var(--color-blue-800))}.ui-button--primary-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--color-primary-600, var(--color-blue-600));--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--primary-white:hover,.ui-button--primary-white:focus-visible{background-color:var(--layer-focus)}.ui-button--primary-link{border-color:transparent;background-color:transparent;color:var(--color-primary-500, var(--color-blue-500))}.ui-button--primary-link:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button--primary-link:hover,.ui-button--primary-link:focus-visible{color:var(--color-primary-600, var(--color-blue-600))}.ui-button--primary-link:hover,.ui-button--primary-link:focus-visible{text-decoration-line:underline}.ui-button--secondary-solid{border-color:transparent;background-color:var(--color-secondary-900, var(--color-gray-900));color:var(--color-white, #fff);--tw-ring-color: var(--color-secondary-200, var(--color-gray-200))}.ui-button--secondary-solid:hover,.ui-button--secondary-solid:focus-visible{background-color:var(--color-secondary-800, var(--color-gray-800))}.ui-button--secondary-outline{border-color:var(--color-secondary-900, var(--color-gray-900));background-color:transparent;color:var(--foreground);--tw-ring-color: var(--color-secondary-200, var(--color-gray-200))}.ui-button--secondary-outline:hover,.ui-button--secondary-outline:focus-visible{border-color:var(--color-secondary-800, var(--color-gray-800))}.ui-button--secondary-outline:hover,.ui-button--secondary-outline:focus-visible{background-color:var(--color-secondary-800, var(--color-gray-800))}.ui-button--secondary-outline:hover,.ui-button--secondary-outline:focus-visible{color:var(--foreground-inverse)}.ui-button--secondary-ghost{border-color:transparent;background-color:transparent;color:var(--foreground);--tw-ring-color: var(--color-secondary-200, var(--color-gray-200))}.ui-button--secondary-ghost:hover,.ui-button--secondary-ghost:focus-visible{background-color:var(--muted-hover)}.ui-button--secondary-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--layer-foreground);--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-secondary-200, var(--color-gray-200))}.ui-button--secondary-white:hover,.ui-button--secondary-white:focus-visible{background-color:var(--layer-hover)}.ui-button--secondary-link{border-color:transparent;background-color:transparent;color:var(--color-secondary-900, var(--color-gray-900))}.ui-button--secondary-link:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button--secondary-link:hover,.ui-button--secondary-link:focus-visible{color:var(--color-secondary-800, var(--color-gray-800))}.ui-button--secondary-link:hover,.ui-button--secondary-link:focus-visible{text-decoration-line:underline}.ui-button--success-solid{border-color:transparent;background-color:var(--color-success-500, var(--color-teal-500));color:var(--color-white, #fff)}.ui-button--success-solid:hover,.ui-button--success-solid:focus-visible{background-color:var(--color-success-600, var(--color-teal-600))}.ui-button--success-outline{border-color:var(--color-success-500, var(--color-teal-500));background-color:transparent;color:var(--color-success-500, var(--color-teal-500));--tw-ring-color: var(--color-success-200, var(--color-teal-200))}.ui-button--success-outline:hover,.ui-button--success-outline:focus-visible{border-color:var(--color-success-600, var(--color-teal-600))}.ui-button--success-outline:hover,.ui-button--success-outline:focus-visible{background-color:var(--color-success-600, var(--color-teal-600))}.ui-button--success-outline:hover,.ui-button--success-outline:focus-visible{color:var(--color-white, #fff)}.ui-button--success-ghost{border-color:transparent;background-color:transparent;color:var(--color-success-500, var(--color-teal-500));--tw-ring-color: var(--color-success-200, var(--color-teal-200))}.ui-button--success-ghost:hover,.ui-button--success-ghost:focus-visible{background-color:var(--color-success-100, var(--color-teal-100))}.ui-button--success-ghost:hover,.ui-button--success-ghost:focus-visible{color:var(--color-success-800, var(--color-teal-800))}.ui-button--success-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--color-success-500, var(--color-teal-500));--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-success-200, var(--color-teal-200))}.ui-button--success-white:hover,.ui-button--success-white:focus-visible{background-color:var(--layer-hover)}.ui-button--success-link{border-color:transparent;background-color:transparent;color:var(--color-success-500, var(--color-teal-500))}.ui-button--success-link:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button--success-link:hover,.ui-button--success-link:focus-visible{color:var(--color-success-600, var(--color-teal-600))}.ui-button--success-link:hover,.ui-button--success-link:focus-visible{text-decoration-line:underline}.ui-button--warning-solid{border-color:transparent;background-color:var(--color-warning-500, var(--color-yellow-500));color:var(--color-white, #fff);--tw-ring-color: var(--color-warning-200, var(--color-yellow-200))}.ui-button--warning-solid:hover,.ui-button--warning-solid:focus-visible{background-color:var(--color-warning-600, var(--color-yellow-600))}.ui-button--warning-outline{border-color:var(--color-warning-500, var(--color-yellow-500));background-color:transparent;color:var(--color-warning-500, var(--color-yellow-500));--tw-ring-color: var(--color-warning-200, var(--color-yellow-200))}.ui-button--warning-outline:hover,.ui-button--warning-outline:focus-visible{border-color:var(--color-warning-600, var(--color-yellow-600))}.ui-button--warning-outline:hover,.ui-button--warning-outline:focus-visible{background-color:var(--color-warning-600, var(--color-yellow-600))}.ui-button--warning-outline:hover,.ui-button--warning-outline:focus-visible{color:var(--color-white, #fff)}.ui-button--warning-ghost{border-color:transparent;background-color:transparent;color:var(--color-warning-500, var(--color-yellow-500));--tw-ring-color: var(--color-warning-200, var(--color-yellow-200))}.ui-button--warning-ghost:hover,.ui-button--warning-ghost:focus-visible{background-color:var(--color-warning-100, var(--color-yellow-100))}.ui-button--warning-ghost:hover,.ui-button--warning-ghost:focus-visible{color:var(--color-warning-800, var(--color-yellow-800))}.ui-button--warning-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--color-warning-500, var(--color-yellow-500));--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-warning-200, var(--color-yellow-200))}.ui-button--warning-white:hover,.ui-button--warning-white:focus-visible{background-color:var(--layer-hover)}.ui-button--warning-link{border-color:transparent;background-color:transparent;color:var(--color-warning-500, var(--color-yellow-500))}.ui-button--warning-link:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button--warning-link:hover,.ui-button--warning-link:focus-visible{color:var(--color-warning-600, var(--color-yellow-600))}.ui-button--warning-link:hover,.ui-button--warning-link:focus-visible{text-decoration-line:underline}.ui-button--danger-solid{border-color:transparent;background-color:var(--color-danger-500, var(--color-red-500));color:var(--color-white, #fff);--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-solid:hover,.ui-button--danger-solid:focus-visible{background-color:var(--color-danger-600, var(--color-red-600))}.ui-button--danger-outline{border-color:var(--color-danger-500, var(--color-red-500));background-color:transparent;color:var(--color-danger-500, var(--color-red-500));--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-outline:hover,.ui-button--danger-outline:focus-visible{border-color:var(--color-danger-600, var(--color-red-600))}.ui-button--danger-outline:hover,.ui-button--danger-outline:focus-visible{background-color:var(--color-danger-600, var(--color-red-600))}.ui-button--danger-outline:hover,.ui-button--danger-outline:focus-visible{color:var(--color-white, #fff)}.ui-button--danger-ghost{border-color:transparent;background-color:transparent;color:var(--color-danger-500, var(--color-red-500));--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-ghost:hover,.ui-button--danger-ghost:focus-visible{background-color:var(--color-danger-100, var(--color-red-100))}.ui-button--danger-ghost:hover,.ui-button--danger-ghost:focus-visible{color:var(--color-danger-800, var(--color-red-800))}.ui-button--danger-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--color-danger-500, var(--color-red-500));--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-white:hover,.ui-button--danger-white:focus-visible{background-color:var(--layer-hover)}.ui-button--danger-link{border-color:transparent;background-color:transparent;color:var(--color-danger-500, var(--color-red-500));--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-link:hover,.ui-button--danger-link:focus-visible{color:var(--color-danger-600, var(--color-red-600))}.ui-button--danger-link:hover,.ui-button--danger-link:focus-visible{text-decoration-line:underline}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-duration: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"]
+		styles: ["@layer properties;:host(.ui-avatar){display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--radius-full, calc(infinity * 1px));background-color:var(--surface);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:var(--foreground);-webkit-user-select:none;user-select:none}:host(.ui-avatar--sm){width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6)}:host(.ui-avatar--md){width:calc(var(--spacing, .25rem) * 8);height:calc(var(--spacing, .25rem) * 8)}:host(.ui-avatar--lg){width:calc(var(--spacing, .25rem) * 10);height:calc(var(--spacing, .25rem) * 10)}:host(.ui-avatar--xl){width:calc(var(--spacing, .25rem) * 16);height:calc(var(--spacing, .25rem) * 16)}.ui-avatar-image{width:100%;height:100%;object-fit:cover}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"]
 	});
 };
 i0.ɵɵngDeclareClassMetadata({
 	minVersion: "12.0.0",
 	version: "22.2.1",
 	ngImport: i0,
-	type: UiButtonComponent,
-	decorators: [{
-		type: Component,
-		args: [{
-			selector: "ui-button",
-			host: { "[class.pointer-events-none]": "isDisabled()" },
-			template: "<button\n    [type]=\"type()\"\n    [disabled]=\"isDisabled()\"\n    [class]=\"generatedClasses()\"\n    [attr.aria-label]=\"ariaLabel() || null\"\n    [attr.aria-busy]=\"loading() || null\"\n>\n    <ng-content></ng-content>\n\n    @if (loading()) {\n        <span class=\"sr-only\">Loading</span>\n\n        <span class=\"flex items-end justify-center\" aria-hidden=\"true\">\n            <span class=\"ms-0.5 inline-flex items-end gap-px pb-px\">\n                <span class=\"ui-button__loading-dot\">.</span>\n                <span class=\"ui-button__loading-dot\">.</span>\n                <span class=\"ui-button__loading-dot\">.</span>\n            </span>\n        </span>\n    }\n</button>\n",
-			styles: ["@layer properties;.ui-button{position:relative;display:inline-flex;align-items:center;column-gap:calc(var(--spacing, .25rem) * 2);border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:1px;transition-property:colors,box-shadow;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.ui-button:focus{--tw-outline-style: none;outline-style:none}.ui-button:focus-visible{z-index:10}.ui-button:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button:disabled{pointer-events:none}.ui-button:disabled{opacity:50%}.ui-button--sm{padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.ui-button--md{padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3)}.ui-button--lg{padding-inline:calc(var(--spacing, .25rem) * 5);padding-block:calc(var(--spacing, .25rem) * 4)}ui-button-group:not(.ui-button-group--segmented)>:host(:first-child:not(:only-child)) .ui-button{border-start-end-radius:0;border-end-end-radius:0;--tw-shadow: 0 0 #0000 !important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}ui-button-group:not(.ui-button-group--segmented)>:host(:not(:first-child):not(:last-child)) .ui-button{border-radius:0;--tw-shadow: 0 0 #0000 !important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}ui-button-group:not(.ui-button-group--segmented)>:host(:last-child:not(:only-child)) .ui-button{border-start-start-radius:0;border-end-start-radius:0;--tw-shadow: 0 0 #0000 !important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}ui-button-group:not(.ui-button-group--segmented)>:host(:not(:first-child)) .ui-button{margin-inline-start:-1px}.ui-button--segmented{min-height:calc(1lh + calc(var(--spacing, .25rem) * 3));cursor:pointer;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 1.5);white-space:nowrap;color:var(--muted-foreground-1);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s;-webkit-user-select:none;user-select:none;justify-content:center;border-color:transparent;--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--segmented:hover{color:var(--foreground)}.ui-button--segmented:hover,.ui-button--segmented:focus-visible{background-color:var(--surface)}ui-input-group>:host .ui-button{border-radius:0!important;border-style:var(--tw-border-style)!important;border-width:0px!important;--tw-shadow: 0 0 #0000 !important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}ui-input-group>:host(:not(:last-child)) .ui-button{border-right-style:var(--tw-border-style)!important;border-right-width:1px!important;border-color:var(--border-line-2)!important}ui-button-group>:host(:not(:first-child)) .ui-button[class*=-outline]{border-inline-start-color:var(--color-gray-200, oklch(92.8% .006 264.531))}@keyframes spinner-ellipsis{0%,70%,to{transform:translateY(0)}35%{transform:translateY(-.4em)}}.ui-button__loading-dot{display:inline-block;animation:spinner-ellipsis 1s ease-in-out infinite}.ui-button__loading-dot:nth-child(2){animation-delay:.12s}.ui-button__loading-dot:nth-child(3){animation-delay:.24s}@media(prefers-reduced-motion:reduce){.ui-button__loading-dot{animation:none}}.ui-button--primary-solid{border-color:transparent;background-color:var(--color-primary-600, var(--color-blue-600));color:var(--color-white, #fff);--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--primary-solid:hover,.ui-button--primary-solid:focus-visible{background-color:var(--color-primary-700, var(--color-blue-700))}.ui-button--primary-outline{border-color:var(--color-primary-600, var(--color-blue-600));background-color:transparent;color:var(--color-primary-600, var(--color-blue-600));--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--primary-outline:hover,.ui-button--primary-outline:focus-visible{border-color:var(--color-primary-700, var(--color-blue-700))}.ui-button--primary-outline:hover,.ui-button--primary-outline:focus-visible{background-color:var(--color-primary-700, var(--color-blue-700))}.ui-button--primary-outline:hover,.ui-button--primary-outline:focus-visible{color:var(--color-white, #fff)}.ui-button--primary-ghost{border-color:transparent;background-color:transparent;color:var(--color-primary-600, var(--color-blue-600));--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--primary-ghost:hover,.ui-button--primary-ghost:focus-visible{background-color:var(--color-primary-100, var(--color-blue-100))}.ui-button--primary-ghost:hover,.ui-button--primary-ghost:focus-visible{color:var(--color-primary-800, var(--color-blue-800))}.ui-button--primary-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--color-primary-600, var(--color-blue-600));--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-primary-200, var(--color-blue-200))}.ui-button--primary-white:hover,.ui-button--primary-white:focus-visible{background-color:var(--layer-focus)}.ui-button--primary-link{border-color:transparent;background-color:transparent;color:var(--color-primary-500, var(--color-blue-500))}.ui-button--primary-link:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button--primary-link:hover,.ui-button--primary-link:focus-visible{color:var(--color-primary-600, var(--color-blue-600))}.ui-button--primary-link:hover,.ui-button--primary-link:focus-visible{text-decoration-line:underline}.ui-button--secondary-solid{border-color:transparent;background-color:var(--color-secondary-900, var(--color-gray-900));color:var(--color-white, #fff);--tw-ring-color: var(--color-secondary-200, var(--color-gray-200))}.ui-button--secondary-solid:hover,.ui-button--secondary-solid:focus-visible{background-color:var(--color-secondary-800, var(--color-gray-800))}.ui-button--secondary-outline{border-color:var(--color-secondary-900, var(--color-gray-900));background-color:transparent;color:var(--foreground);--tw-ring-color: var(--color-secondary-200, var(--color-gray-200))}.ui-button--secondary-outline:hover,.ui-button--secondary-outline:focus-visible{border-color:var(--color-secondary-800, var(--color-gray-800))}.ui-button--secondary-outline:hover,.ui-button--secondary-outline:focus-visible{background-color:var(--color-secondary-800, var(--color-gray-800))}.ui-button--secondary-outline:hover,.ui-button--secondary-outline:focus-visible{color:var(--foreground-inverse)}.ui-button--secondary-ghost{border-color:transparent;background-color:transparent;color:var(--foreground);--tw-ring-color: var(--color-secondary-200, var(--color-gray-200))}.ui-button--secondary-ghost:hover,.ui-button--secondary-ghost:focus-visible{background-color:var(--muted-hover)}.ui-button--secondary-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--layer-foreground);--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-secondary-200, var(--color-gray-200))}.ui-button--secondary-white:hover,.ui-button--secondary-white:focus-visible{background-color:var(--layer-hover)}.ui-button--secondary-link{border-color:transparent;background-color:transparent;color:var(--color-secondary-900, var(--color-gray-900))}.ui-button--secondary-link:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button--secondary-link:hover,.ui-button--secondary-link:focus-visible{color:var(--color-secondary-800, var(--color-gray-800))}.ui-button--secondary-link:hover,.ui-button--secondary-link:focus-visible{text-decoration-line:underline}.ui-button--success-solid{border-color:transparent;background-color:var(--color-success-500, var(--color-teal-500));color:var(--color-white, #fff)}.ui-button--success-solid:hover,.ui-button--success-solid:focus-visible{background-color:var(--color-success-600, var(--color-teal-600))}.ui-button--success-outline{border-color:var(--color-success-500, var(--color-teal-500));background-color:transparent;color:var(--color-success-500, var(--color-teal-500));--tw-ring-color: var(--color-success-200, var(--color-teal-200))}.ui-button--success-outline:hover,.ui-button--success-outline:focus-visible{border-color:var(--color-success-600, var(--color-teal-600))}.ui-button--success-outline:hover,.ui-button--success-outline:focus-visible{background-color:var(--color-success-600, var(--color-teal-600))}.ui-button--success-outline:hover,.ui-button--success-outline:focus-visible{color:var(--color-white, #fff)}.ui-button--success-ghost{border-color:transparent;background-color:transparent;color:var(--color-success-500, var(--color-teal-500));--tw-ring-color: var(--color-success-200, var(--color-teal-200))}.ui-button--success-ghost:hover,.ui-button--success-ghost:focus-visible{background-color:var(--color-success-100, var(--color-teal-100))}.ui-button--success-ghost:hover,.ui-button--success-ghost:focus-visible{color:var(--color-success-800, var(--color-teal-800))}.ui-button--success-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--color-success-500, var(--color-teal-500));--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-success-200, var(--color-teal-200))}.ui-button--success-white:hover,.ui-button--success-white:focus-visible{background-color:var(--layer-hover)}.ui-button--success-link{border-color:transparent;background-color:transparent;color:var(--color-success-500, var(--color-teal-500))}.ui-button--success-link:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button--success-link:hover,.ui-button--success-link:focus-visible{color:var(--color-success-600, var(--color-teal-600))}.ui-button--success-link:hover,.ui-button--success-link:focus-visible{text-decoration-line:underline}.ui-button--warning-solid{border-color:transparent;background-color:var(--color-warning-500, var(--color-yellow-500));color:var(--color-white, #fff);--tw-ring-color: var(--color-warning-200, var(--color-yellow-200))}.ui-button--warning-solid:hover,.ui-button--warning-solid:focus-visible{background-color:var(--color-warning-600, var(--color-yellow-600))}.ui-button--warning-outline{border-color:var(--color-warning-500, var(--color-yellow-500));background-color:transparent;color:var(--color-warning-500, var(--color-yellow-500));--tw-ring-color: var(--color-warning-200, var(--color-yellow-200))}.ui-button--warning-outline:hover,.ui-button--warning-outline:focus-visible{border-color:var(--color-warning-600, var(--color-yellow-600))}.ui-button--warning-outline:hover,.ui-button--warning-outline:focus-visible{background-color:var(--color-warning-600, var(--color-yellow-600))}.ui-button--warning-outline:hover,.ui-button--warning-outline:focus-visible{color:var(--color-white, #fff)}.ui-button--warning-ghost{border-color:transparent;background-color:transparent;color:var(--color-warning-500, var(--color-yellow-500));--tw-ring-color: var(--color-warning-200, var(--color-yellow-200))}.ui-button--warning-ghost:hover,.ui-button--warning-ghost:focus-visible{background-color:var(--color-warning-100, var(--color-yellow-100))}.ui-button--warning-ghost:hover,.ui-button--warning-ghost:focus-visible{color:var(--color-warning-800, var(--color-yellow-800))}.ui-button--warning-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--color-warning-500, var(--color-yellow-500));--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-warning-200, var(--color-yellow-200))}.ui-button--warning-white:hover,.ui-button--warning-white:focus-visible{background-color:var(--layer-hover)}.ui-button--warning-link{border-color:transparent;background-color:transparent;color:var(--color-warning-500, var(--color-yellow-500))}.ui-button--warning-link:focus-within{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-button--warning-link:hover,.ui-button--warning-link:focus-visible{color:var(--color-warning-600, var(--color-yellow-600))}.ui-button--warning-link:hover,.ui-button--warning-link:focus-visible{text-decoration-line:underline}.ui-button--danger-solid{border-color:transparent;background-color:var(--color-danger-500, var(--color-red-500));color:var(--color-white, #fff);--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-solid:hover,.ui-button--danger-solid:focus-visible{background-color:var(--color-danger-600, var(--color-red-600))}.ui-button--danger-outline{border-color:var(--color-danger-500, var(--color-red-500));background-color:transparent;color:var(--color-danger-500, var(--color-red-500));--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-outline:hover,.ui-button--danger-outline:focus-visible{border-color:var(--color-danger-600, var(--color-red-600))}.ui-button--danger-outline:hover,.ui-button--danger-outline:focus-visible{background-color:var(--color-danger-600, var(--color-red-600))}.ui-button--danger-outline:hover,.ui-button--danger-outline:focus-visible{color:var(--color-white, #fff)}.ui-button--danger-ghost{border-color:transparent;background-color:transparent;color:var(--color-danger-500, var(--color-red-500));--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-ghost:hover,.ui-button--danger-ghost:focus-visible{background-color:var(--color-danger-100, var(--color-red-100))}.ui-button--danger-ghost:hover,.ui-button--danger-ghost:focus-visible{color:var(--color-danger-800, var(--color-red-800))}.ui-button--danger-white{border-color:var(--border-line-2);background-color:var(--layer);color:var(--color-danger-500, var(--color-red-500));--tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-white:hover,.ui-button--danger-white:focus-visible{background-color:var(--layer-hover)}.ui-button--danger-link{border-color:transparent;background-color:transparent;color:var(--color-danger-500, var(--color-red-500));--tw-ring-color: var(--color-danger-200, var(--color-red-200))}.ui-button--danger-link:hover,.ui-button--danger-link:focus-visible{color:var(--color-danger-600, var(--color-red-600))}.ui-button--danger-link:hover,.ui-button--danger-link:focus-visible{text-decoration-line:underline}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-duration: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"]
-		}]
-	}],
-	propDecorators: {
-		appearance: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "appearance",
-				required: false
-			}]
-		}],
-		intent: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "intent",
-				required: false
-			}]
-		}],
-		size: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "size",
-				required: false
-			}]
-		}],
-		classes: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "classes",
-				required: false
-			}]
-		}],
-		type: [{
+	type: UiAvatarComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ui-avatar",
+			host: {
+				role: "img",
+				"[attr.aria-label]": "name()",
+				"[class]": "generatedClasses()",
+				"[style.background-color]": "colour()",
+				"[style.color]": "ink()"
+			},
+			template: "@if (showImage()) {\n    <img class=\"ui-avatar-image\" [src]=\"src()\" alt=\"\" (error)=\"imageFailed()\" />\n} @else {\n    <span aria-hidden=\"true\">{{ initials() }}</span>\n}\n",
+			styles: ["@layer properties;:host(.ui-avatar){display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--radius-full, calc(infinity * 1px));background-color:var(--surface);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:var(--foreground);-webkit-user-select:none;user-select:none}:host(.ui-avatar--sm){width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6)}:host(.ui-avatar--md){width:calc(var(--spacing, .25rem) * 8);height:calc(var(--spacing, .25rem) * 8)}:host(.ui-avatar--lg){width:calc(var(--spacing, .25rem) * 10);height:calc(var(--spacing, .25rem) * 10)}:host(.ui-avatar--xl){width:calc(var(--spacing, .25rem) * 16);height:calc(var(--spacing, .25rem) * 16)}.ui-avatar-image{width:100%;height:100%;object-fit:cover}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"]
+		}]
+	}],
+	propDecorators: {
+		name: [{
 			type: i0.Input,
 			args: [{
 				isSignal: true,
-				alias: "type",
-				required: false
+				alias: "name",
+				required: true
 			}]
 		}],
-		ariaLabel: [{
+		src: [{
 			type: i0.Input,
 			args: [{
 				isSignal: true,
-				alias: "ariaLabel",
+				alias: "src",
 				required: false
 			}]
 		}],
-		disabled: [{
+		size: [{
 			type: i0.Input,
 			args: [{
 				isSignal: true,
-				alias: "disabled",
+				alias: "size",
 				required: false
 			}]
 		}],
-		loading: [{
+		colour: [{
 			type: i0.Input,
 			args: [{
 				isSignal: true,
-				alias: "loading",
+				alias: "colour",
 				required: false
 			}]
 		}]
 	}
 });
+const AvatarSizes = [
+	"sm",
+	"md",
+	"lg",
+	"xl"
+];
+const BadgeIntents = [
+	"primary",
+	"secondary",
+	"success",
+	"warning",
+	"danger"
+];
+const BadgeAppearances = [
+	"solid",
+	"outline",
+	"soft"
+];
+const BadgeSizes = [
+	"xs",
+	"sm",
+	"md",
+	"lg"
+];
 const ButtonIntents = [
 	"primary",
 	"secondary",
@@ -7457,6 +8290,35 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
+var UiCalendarDayDirective = class UiCalendarDayDirective {
+	template = inject(TemplateRef);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: UiCalendarDayDirective,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "14.0.0",
+		version: "22.2.1",
+		type: UiCalendarDayDirective,
+		isStandalone: true,
+		selector: "ng-template[uiCalendarDay]",
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: UiCalendarDayDirective,
+	decorators: [{
+		type: Directive,
+		args: [{ selector: "ng-template[uiCalendarDay]" }]
+	}]
+});
 const ISO_PATTERN = /^(\d{4})-(\d{2})-(\d{2})$/;
 const TIME_PATTERN = /^([01]\d|2[0-3]):([0-5]\d)$/;
 function toIsoDate(date) {
@@ -7514,6 +8376,11 @@ var UiCalendarComponent = class UiCalendarComponent {
 	isDateDisabled = input(() => false, ...ngDevMode ? [{ debugName: "isDateDisabled" }] : /* istanbul ignore next */ []);
 	weekStart = input(1, ...ngDevMode ? [{ debugName: "weekStart" }] : /* istanbul ignore next */ []);
 	locale = input("en-GB", ...ngDevMode ? [{ debugName: "locale" }] : /* istanbul ignore next */ []);
+	dayClass = input(() => "", ...ngDevMode ? [{ debugName: "dayClass" }] : /* istanbul ignore next */ []);
+	hideSelection = input(false, ...ngDevMode ? [{ debugName: "hideSelection" }] : /* istanbul ignore next */ []);
+	dayClick = output();
+	monthChange = output();
+	dayTemplate = contentChild(UiCalendarDayDirective, ...ngDevMode ? [{ debugName: "dayTemplate" }] : /* istanbul ignore next */ []);
 	today = toIsoDate(/* @__PURE__ */ new Date());
 	anchorDate = computed(() => this.mode() === "range" ? this.range().start : this.value(), ...ngDevMode ? [{ debugName: "anchorDate" }] : /* istanbul ignore next */ []);
 	activeDate = linkedSignal(() => parseIsoDate(this.anchorDate()) ?? parseIsoDate(this.today), ...ngDevMode ? [{ debugName: "activeDate" }] : /* istanbul ignore next */ []);
@@ -7557,11 +8424,28 @@ var UiCalendarComponent = class UiCalendarComponent {
 				isDisabled: this.isUnavailable(iso),
 				isInRange: !!start && !!previewEnd && iso > start && iso < previewEnd,
 				isRangeStart: !!previewEnd && iso === start && start !== previewEnd,
-				isRangeEnd: !!start && iso === previewEnd && start !== previewEnd
+				isRangeEnd: !!start && iso === previewEnd && start !== previewEnd,
+				className: this.dayClass()(iso)
 			};
 		});
 	}, ...ngDevMode ? [{ debugName: "days" }] : /* istanbul ignore next */ []);
+	view = computed(() => {
+		const days = this.days();
+		return {
+			month: toIsoDate(new Date(this.viewYear(), this.viewMonth(), 1)),
+			start: days[0].iso,
+			end: days[days.length - 1].iso
+		};
+	}, {
+		...ngDevMode ? { debugName: "view" } : /* istanbul ignore next */ {},
+		equal: (a, b) => a.month === b.month && a.start === b.start
+	});
 	rangeBounds = computed(() => {
+		if (this.hideSelection()) return {
+			start: null,
+			end: null,
+			previewEnd: null
+		};
 		if (this.mode() === "single") return {
 			start: this.value(),
 			end: null,
@@ -7589,6 +8473,9 @@ var UiCalendarComponent = class UiCalendarComponent {
 		const firstOfNext = new Date(this.viewYear(), this.viewMonth() + 1, 1);
 		return !max || toIsoDate(firstOfNext) <= max;
 	}, ...ngDevMode ? [{ debugName: "canGoForward" }] : /* istanbul ignore next */ []);
+	constructor() {
+		effect(() => this.monthChange.emit(this.view()));
+	}
 	focusActiveDate() {
 		this.host.nativeElement.querySelector(`[data-date="${this.tabbableDate()}"]`)?.focus();
 	}
@@ -7599,6 +8486,7 @@ var UiCalendarComponent = class UiCalendarComponent {
 	}
 	select(day) {
 		if (day.isDisabled) return;
+		this.dayClick.emit(day.iso);
 		if (this.mode() === "single") {
 			this.value.set(day.iso);
 			return;
@@ -7715,68 +8603,104 @@ var UiCalendarComponent = class UiCalendarComponent {
 				isSignal: true,
 				isRequired: false,
 				transformFunction: null
+			},
+			dayClass: {
+				classPropertyName: "dayClass",
+				publicName: "dayClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			hideSelection: {
+				classPropertyName: "hideSelection",
+				publicName: "hideSelection",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
 			}
 		},
 		outputs: {
 			value: "valueChange",
-			range: "rangeChange"
+			range: "rangeChange",
+			dayClick: "dayClick",
+			monthChange: "monthChange"
 		},
 		providers: [provideIcons({
 			heroChevronLeft,
 			heroChevronRight
 		})],
+		queries: [{
+			propertyName: "dayTemplate",
+			first: true,
+			predicate: UiCalendarDayDirective,
+			descendants: true,
+			isSignal: true
+		}],
 		ngImport: i0,
-		template: "<div class=\"ui-calendar-header\">\n    <button\n        type=\"button\"\n        class=\"ui-calendar-nav\"\n        aria-label=\"Previous month\"\n        [disabled]=\"!canGoBack()\"\n        (click)=\"showMonth(-1)\"\n    >\n        <ng-icon name=\"heroChevronLeft\" class=\"shrink-0\" />\n    </button>\n\n    <div class=\"ui-calendar-selects\">\n        <ui-select\n            class=\"ui-calendar-month\"\n            [dataSource]=\"monthSource()\"\n            [displayWith]=\"displayMonth\"\n            [pageSize]=\"12\"\n            [(selectedItem)]=\"viewMonth\"\n        />\n        <ui-select\n            class=\"ui-calendar-year\"\n            [dataSource]=\"yearSource()\"\n            [pageSize]=\"500\"\n            [(selectedItem)]=\"viewYear\"\n        />\n    </div>\n\n    <button\n        type=\"button\"\n        class=\"ui-calendar-nav\"\n        aria-label=\"Next month\"\n        [disabled]=\"!canGoForward()\"\n        (click)=\"showMonth(1)\"\n    >\n        <ng-icon name=\"heroChevronRight\" class=\"shrink-0\" />\n    </button>\n</div>\n\n<div class=\"ui-calendar-weekdays\" aria-hidden=\"true\">\n    @for (weekday of weekdays(); track $index) {\n        <span class=\"ui-calendar-weekday ui-text-caption\">{{ weekday }}</span>\n    }\n</div>\n\n<div class=\"ui-calendar-grid\" (mouseleave)=\"preview(null)\">\n    @for (day of days(); track day.iso) {\n        <button\n            type=\"button\"\n            class=\"ui-calendar-day ui-text-body-alt\"\n            [attr.data-date]=\"day.iso\"\n            [attr.data-outside]=\"day.isOutside ? '' : null\"\n            [attr.data-today]=\"day.isToday ? '' : null\"\n            [attr.data-in-range]=\"day.isInRange ? '' : null\"\n            [attr.data-range-start]=\"day.isRangeStart ? '' : null\"\n            [attr.data-range-end]=\"day.isRangeEnd ? '' : null\"\n            [attr.aria-current]=\"day.isToday ? 'date' : null\"\n            [attr.aria-pressed]=\"day.isSelected\"\n            [attr.aria-label]=\"day.label\"\n            [tabindex]=\"day.iso === tabbableDate() ? 0 : -1\"\n            [attr.aria-disabled]=\"day.isDisabled || null\"\n            (click)=\"select(day)\"\n            (keydown)=\"handleKeydown($event)\"\n            (mouseenter)=\"preview(day.iso)\"\n            (focus)=\"preview(day.iso)\"\n        >\n            {{ day.day }}\n        </button>\n    }\n</div>\n",
-		styles: ["@layer properties;:host{display:inline-flex;flex-direction:column;row-gap:calc(var(--spacing, .25rem) * 2)}.ui-calendar-header{display:flex;align-items:center;column-gap:var(--spacing, .25rem);padding-bottom:var(--spacing, .25rem)}.ui-calendar-selects{display:flex;min-width:0px;flex:1;column-gap:var(--spacing, .25rem)}.ui-calendar-month{min-width:0px;flex:1}.ui-calendar-year{width:calc(var(--spacing, .25rem) * 24);flex-shrink:0}.ui-calendar-nav{display:inline-flex;width:calc(var(--spacing, .25rem) * 8);height:calc(var(--spacing, .25rem) * 8);flex-shrink:0;align-items:center;justify-content:center;border-radius:var(--radius-full, calc(infinity * 1px));color:var(--foreground)}.ui-calendar-nav:focus{--tw-outline-style: none;outline-style:none}.ui-calendar-nav:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-calendar-nav:focus-visible{--tw-ring-color: color-mix(in srgb, oklch(88.2% .059 254.128) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-calendar-nav:focus-visible{--tw-ring-color: color-mix(in oklab, var(--color-primary-200, var(--color-blue-200)) 50%, transparent)}}.ui-calendar-nav:disabled{pointer-events:none}.ui-calendar-nav:disabled{opacity:50%}.ui-calendar-nav:hover,.ui-calendar-nav:focus-visible{background-color:var(--surface)}.ui-calendar-weekdays,.ui-calendar-grid{display:grid;grid-template-columns:repeat(7,calc(var(--spacing, .25rem) * 10.5));justify-content:center}.ui-calendar-grid{row-gap:calc(var(--spacing, .25rem) * .5)}.ui-calendar-weekday{width:calc(var(--spacing, .25rem) * 10.5);padding-bottom:var(--spacing, .25rem);text-align:center;color:var(--muted-foreground-1)}.ui-calendar-day{position:relative;display:inline-flex;width:calc(var(--spacing, .25rem) * 10.5);height:calc(var(--spacing, .25rem) * 10.5);align-items:center;justify-content:center;border-radius:var(--radius-full, calc(infinity * 1px));border-style:var(--tw-border-style);border-width:1.5px;border-color:transparent;color:var(--foreground);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.ui-calendar-day:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-calendar-day:focus-visible{--tw-ring-color: color-mix(in srgb, oklch(88.2% .059 254.128) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-calendar-day:focus-visible{--tw-ring-color: color-mix(in oklab, var(--color-primary-200, var(--color-blue-200)) 50%, transparent)}}.ui-calendar-day:focus-visible{--tw-outline-style: none;outline-style:none}.ui-calendar-day:hover,.ui-calendar-day:focus-visible{border-color:var(--color-primary-600, var(--color-blue-600))}.ui-calendar-day:hover,.ui-calendar-day:focus-visible{color:var(--color-primary-600, var(--color-blue-600))}.ui-calendar-day[aria-disabled]{cursor:not-allowed;text-decoration-line:line-through;opacity:40%}.ui-calendar-day[aria-disabled]:hover{border-color:transparent}.ui-calendar-day[aria-disabled]:hover{color:inherit}.ui-calendar-day[data-outside]{color:var(--muted-foreground)}.ui-calendar-day[data-today]{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:var(--color-primary-600, var(--color-blue-600))}.ui-calendar-day[aria-pressed=true]{border-color:var(--color-primary-600, var(--color-blue-600));background-color:var(--color-primary-600, var(--color-blue-600));color:var(--color-white, #fff)}.ui-calendar-day[aria-pressed=true]:hover,.ui-calendar-day[aria-pressed=true]:focus-visible{border-color:var(--color-primary-700, var(--color-blue-700))}.ui-calendar-day[aria-pressed=true]:hover,.ui-calendar-day[aria-pressed=true]:focus-visible{background-color:var(--color-primary-700, var(--color-blue-700))}.ui-calendar-day[aria-pressed=true]:hover,.ui-calendar-day[aria-pressed=true]:focus-visible{color:var(--color-white, #fff)}.ui-calendar-day[data-in-range]{border-radius:0;background-color:var(--color-primary-100, var(--color-blue-100));color:var(--foreground)}.ui-calendar-day[data-range-start]{border-top-right-radius:0;border-bottom-right-radius:0}.ui-calendar-day[data-range-end]{border-top-left-radius:0;border-bottom-left-radius:0}.ui-calendar-day[data-range-end]:not([aria-pressed=true]){background-color:var(--color-primary-100, var(--color-blue-100))}.ui-calendar-day[data-in-range]:not(:nth-child(7n)),.ui-calendar-day[data-range-start]:not(:nth-child(7n)){--tw-shadow: 1px 0 0 var(--tw-shadow-color, var(--color-primary-100));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-calendar-day[data-in-range]:nth-child(7n+1),.ui-calendar-day[data-range-end]:nth-child(7n+1){border-top-left-radius:var(--radius-full, calc(infinity * 1px));border-bottom-left-radius:var(--radius-full, calc(infinity * 1px))}.ui-calendar-day[data-in-range]:nth-child(7n),.ui-calendar-day[data-range-start]:nth-child(7n){border-top-right-radius:var(--radius-full, calc(infinity * 1px));border-bottom-right-radius:var(--radius-full, calc(infinity * 1px))}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-border-style: solid;--tw-duration: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"],
-		dependencies: [{
-			kind: "component",
-			type: NgIcon,
-			selector: "ng-icon",
-			inputs: [
-				"name",
-				"svg",
-				"size",
-				"strokeWidth",
-				"color"
-			]
-		}, {
-			kind: "component",
-			type: UiSelectComponent,
-			selector: "ui-select",
-			inputs: [
-				"placement",
-				"closeBehaviour",
-				"dataSource",
-				"placeholder",
-				"id",
-				"describedBy",
-				"pageSize",
-				"searchMode",
-				"disabled",
-				"validationState",
-				"clearable",
-				"clearLabel",
-				"creatable",
-				"createLabel",
-				"groupBy",
-				"scrollToSelected",
-				"multiple",
-				"multipleDisplay",
-				"counterAfter",
-				"counterLabel",
-				"compareWith",
-				"displayWith",
-				"selectedItem",
-				"selectedItems"
-			],
-			outputs: [
-				"validationStateChange",
-				"selectionChange",
-				"create",
-				"selectedItemChange",
-				"selectedItemsChange"
-			]
-		}]
+		template: "<div class=\"ui-calendar-header\">\n    <button\n        type=\"button\"\n        class=\"ui-calendar-nav\"\n        aria-label=\"Previous month\"\n        [disabled]=\"!canGoBack()\"\n        (click)=\"showMonth(-1)\"\n    >\n        <ng-icon name=\"heroChevronLeft\" class=\"shrink-0\" />\n    </button>\n\n    <div class=\"ui-calendar-selects\">\n        <ui-select\n            class=\"ui-calendar-month\"\n            [dataSource]=\"monthSource()\"\n            [displayWith]=\"displayMonth\"\n            [pageSize]=\"12\"\n            [(selectedItem)]=\"viewMonth\"\n        />\n        <ui-select\n            class=\"ui-calendar-year\"\n            [dataSource]=\"yearSource()\"\n            [pageSize]=\"500\"\n            [(selectedItem)]=\"viewYear\"\n        />\n    </div>\n\n    <button\n        type=\"button\"\n        class=\"ui-calendar-nav\"\n        aria-label=\"Next month\"\n        [disabled]=\"!canGoForward()\"\n        (click)=\"showMonth(1)\"\n    >\n        <ng-icon name=\"heroChevronRight\" class=\"shrink-0\" />\n    </button>\n</div>\n\n<div class=\"ui-calendar-weekdays\" aria-hidden=\"true\">\n    @for (weekday of weekdays(); track $index) {\n        <span class=\"ui-calendar-weekday ui-text-caption\">{{ weekday }}</span>\n    }\n</div>\n\n<div class=\"ui-calendar-grid\" (mouseleave)=\"preview(null)\">\n    @for (day of days(); track day.iso) {\n        <button\n            type=\"button\"\n            class=\"ui-calendar-day ui-text-body-alt\"\n            [class]=\"day.className\"\n            [attr.data-date]=\"day.iso\"\n            [attr.data-outside]=\"day.isOutside ? '' : null\"\n            [attr.data-today]=\"day.isToday ? '' : null\"\n            [attr.data-in-range]=\"day.isInRange ? '' : null\"\n            [attr.data-range-start]=\"day.isRangeStart ? '' : null\"\n            [attr.data-range-end]=\"day.isRangeEnd ? '' : null\"\n            [attr.aria-current]=\"day.isToday ? 'date' : null\"\n            [attr.aria-pressed]=\"hideSelection() ? null : day.isSelected\"\n            [attr.aria-label]=\"day.label\"\n            [tabindex]=\"day.iso === tabbableDate() ? 0 : -1\"\n            [attr.aria-disabled]=\"day.isDisabled || null\"\n            (click)=\"select(day)\"\n            (keydown)=\"handleKeydown($event)\"\n            (mouseenter)=\"preview(day.iso)\"\n            (focus)=\"preview(day.iso)\"\n        >\n            @if (dayTemplate(); as dayTemplate) {\n                <ng-container\n                    [ngTemplateOutlet]=\"dayTemplate.template\"\n                    [ngTemplateOutletContext]=\"{ $implicit: day.iso, day }\"\n                />\n            } @else {\n                {{ day.day }}\n            }\n        </button>\n    }\n</div>\n",
+		styles: ["@layer properties;:host{display:inline-flex;flex-direction:column;row-gap:calc(var(--spacing, .25rem) * 2)}.ui-calendar-header{display:flex;align-items:center;column-gap:var(--spacing, .25rem);padding-bottom:var(--spacing, .25rem)}.ui-calendar-selects{display:flex;min-width:0px;flex:1;column-gap:var(--spacing, .25rem)}.ui-calendar-month{min-width:0px;flex:1}.ui-calendar-year{width:calc(var(--spacing, .25rem) * 24);flex-shrink:0}.ui-calendar-nav{display:inline-flex;width:calc(var(--spacing, .25rem) * 8);height:calc(var(--spacing, .25rem) * 8);flex-shrink:0;align-items:center;justify-content:center;border-radius:var(--radius-full, calc(infinity * 1px));color:var(--foreground)}.ui-calendar-nav:focus{--tw-outline-style: none;outline-style:none}.ui-calendar-nav:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-calendar-nav:focus-visible{--tw-ring-color: color-mix(in srgb, oklch(88.2% .059 254.128) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-calendar-nav:focus-visible{--tw-ring-color: color-mix(in oklab, var(--color-primary-200, var(--color-blue-200)) 50%, transparent)}}.ui-calendar-nav:disabled{pointer-events:none}.ui-calendar-nav:disabled{opacity:50%}.ui-calendar-nav:hover,.ui-calendar-nav:focus-visible{background-color:var(--surface)}.ui-calendar-weekdays,.ui-calendar-grid{display:grid;grid-template-columns:repeat(7,calc(var(--spacing, .25rem) * 10.5));justify-content:center}.ui-calendar-grid{row-gap:calc(var(--spacing, .25rem) * .5)}.ui-calendar-weekday{width:calc(var(--spacing, .25rem) * 10.5);padding-bottom:var(--spacing, .25rem);text-align:center;color:var(--muted-foreground-1)}.ui-calendar-day{position:relative;display:inline-flex;width:calc(var(--spacing, .25rem) * 10.5);height:calc(var(--spacing, .25rem) * 10.5);flex-direction:column;align-items:center;justify-content:center;border-radius:var(--radius-full, calc(infinity * 1px));border-style:var(--tw-border-style);border-width:1.5px;border-color:transparent;color:var(--foreground);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.ui-calendar-day:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-calendar-day:focus-visible{--tw-ring-color: color-mix(in srgb, oklch(88.2% .059 254.128) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-calendar-day:focus-visible{--tw-ring-color: color-mix(in oklab, var(--color-primary-200, var(--color-blue-200)) 50%, transparent)}}.ui-calendar-day:focus-visible{--tw-outline-style: none;outline-style:none}.ui-calendar-day:hover,.ui-calendar-day:focus-visible{border-color:var(--color-primary-600, var(--color-blue-600))}.ui-calendar-day:hover,.ui-calendar-day:focus-visible{color:var(--color-primary-600, var(--color-blue-600))}.ui-calendar-day[aria-disabled]{cursor:not-allowed;text-decoration-line:line-through;opacity:40%}.ui-calendar-day[aria-disabled]:hover{border-color:transparent}.ui-calendar-day[aria-disabled]:hover{color:inherit}.ui-calendar-day[data-outside]{color:var(--muted-foreground)}.ui-calendar-day[data-today]{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:var(--color-primary-600, var(--color-blue-600))}.ui-calendar-day[aria-pressed=true]{border-color:var(--color-primary-600, var(--color-blue-600));background-color:var(--color-primary-600, var(--color-blue-600));color:var(--color-white, #fff)}.ui-calendar-day[aria-pressed=true]:hover,.ui-calendar-day[aria-pressed=true]:focus-visible{border-color:var(--color-primary-700, var(--color-blue-700))}.ui-calendar-day[aria-pressed=true]:hover,.ui-calendar-day[aria-pressed=true]:focus-visible{background-color:var(--color-primary-700, var(--color-blue-700))}.ui-calendar-day[aria-pressed=true]:hover,.ui-calendar-day[aria-pressed=true]:focus-visible{color:var(--color-white, #fff)}.ui-calendar-day[data-in-range]{border-radius:0;background-color:var(--color-primary-100, var(--color-blue-100));color:var(--foreground)}.ui-calendar-day[data-range-start]{border-top-right-radius:0;border-bottom-right-radius:0}.ui-calendar-day[data-range-end]{border-top-left-radius:0;border-bottom-left-radius:0}.ui-calendar-day[data-range-end]:not([aria-pressed=true]){background-color:var(--color-primary-100, var(--color-blue-100))}.ui-calendar-day[data-in-range]:not(:nth-child(7n)),.ui-calendar-day[data-range-start]:not(:nth-child(7n)){--tw-shadow: 1px 0 0 var(--tw-shadow-color, var(--color-primary-100));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-calendar-day[data-in-range]:nth-child(7n+1),.ui-calendar-day[data-range-end]:nth-child(7n+1){border-top-left-radius:var(--radius-full, calc(infinity * 1px));border-bottom-left-radius:var(--radius-full, calc(infinity * 1px))}.ui-calendar-day[data-in-range]:nth-child(7n),.ui-calendar-day[data-range-start]:nth-child(7n){border-top-right-radius:var(--radius-full, calc(infinity * 1px));border-bottom-right-radius:var(--radius-full, calc(infinity * 1px))}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-border-style: solid;--tw-duration: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"],
+		dependencies: [
+			{
+				kind: "component",
+				type: NgIcon,
+				selector: "ng-icon",
+				inputs: [
+					"name",
+					"svg",
+					"size",
+					"strokeWidth",
+					"color"
+				]
+			},
+			{
+				kind: "directive",
+				type: NgTemplateOutlet,
+				selector: "[ngTemplateOutlet]",
+				inputs: [
+					"ngTemplateOutletContext",
+					"ngTemplateOutlet",
+					"ngTemplateOutletInjector"
+				]
+			},
+			{
+				kind: "component",
+				type: UiSelectComponent,
+				selector: "ui-select",
+				inputs: [
+					"placement",
+					"closeBehaviour",
+					"dataSource",
+					"placeholder",
+					"id",
+					"describedBy",
+					"pageSize",
+					"searchMode",
+					"disabled",
+					"validationState",
+					"clearable",
+					"clearLabel",
+					"creatable",
+					"createLabel",
+					"groupBy",
+					"scrollToSelected",
+					"multiple",
+					"multipleDisplay",
+					"counterAfter",
+					"counterLabel",
+					"compareWith",
+					"displayWith",
+					"selectedItem",
+					"selectedItems"
+				],
+				outputs: [
+					"validationStateChange",
+					"selectionChange",
+					"create",
+					"selectedItemChange",
+					"selectedItemsChange"
+				]
+			}
+		]
 	});
 };
 i0.ɵɵngDeclareClassMetadata({
@@ -7788,15 +8712,20 @@ i0.ɵɵngDeclareClassMetadata({
 		type: Component,
 		args: [{
 			selector: "ui-calendar",
-			imports: [NgIcon, UiSelectComponent],
+			imports: [
+				NgIcon,
+				NgTemplateOutlet,
+				UiSelectComponent
+			],
 			providers: [provideIcons({
 				heroChevronLeft,
 				heroChevronRight
 			})],
-			template: "<div class=\"ui-calendar-header\">\n    <button\n        type=\"button\"\n        class=\"ui-calendar-nav\"\n        aria-label=\"Previous month\"\n        [disabled]=\"!canGoBack()\"\n        (click)=\"showMonth(-1)\"\n    >\n        <ng-icon name=\"heroChevronLeft\" class=\"shrink-0\" />\n    </button>\n\n    <div class=\"ui-calendar-selects\">\n        <ui-select\n            class=\"ui-calendar-month\"\n            [dataSource]=\"monthSource()\"\n            [displayWith]=\"displayMonth\"\n            [pageSize]=\"12\"\n            [(selectedItem)]=\"viewMonth\"\n        />\n        <ui-select\n            class=\"ui-calendar-year\"\n            [dataSource]=\"yearSource()\"\n            [pageSize]=\"500\"\n            [(selectedItem)]=\"viewYear\"\n        />\n    </div>\n\n    <button\n        type=\"button\"\n        class=\"ui-calendar-nav\"\n        aria-label=\"Next month\"\n        [disabled]=\"!canGoForward()\"\n        (click)=\"showMonth(1)\"\n    >\n        <ng-icon name=\"heroChevronRight\" class=\"shrink-0\" />\n    </button>\n</div>\n\n<div class=\"ui-calendar-weekdays\" aria-hidden=\"true\">\n    @for (weekday of weekdays(); track $index) {\n        <span class=\"ui-calendar-weekday ui-text-caption\">{{ weekday }}</span>\n    }\n</div>\n\n<div class=\"ui-calendar-grid\" (mouseleave)=\"preview(null)\">\n    @for (day of days(); track day.iso) {\n        <button\n            type=\"button\"\n            class=\"ui-calendar-day ui-text-body-alt\"\n            [attr.data-date]=\"day.iso\"\n            [attr.data-outside]=\"day.isOutside ? '' : null\"\n            [attr.data-today]=\"day.isToday ? '' : null\"\n            [attr.data-in-range]=\"day.isInRange ? '' : null\"\n            [attr.data-range-start]=\"day.isRangeStart ? '' : null\"\n            [attr.data-range-end]=\"day.isRangeEnd ? '' : null\"\n            [attr.aria-current]=\"day.isToday ? 'date' : null\"\n            [attr.aria-pressed]=\"day.isSelected\"\n            [attr.aria-label]=\"day.label\"\n            [tabindex]=\"day.iso === tabbableDate() ? 0 : -1\"\n            [attr.aria-disabled]=\"day.isDisabled || null\"\n            (click)=\"select(day)\"\n            (keydown)=\"handleKeydown($event)\"\n            (mouseenter)=\"preview(day.iso)\"\n            (focus)=\"preview(day.iso)\"\n        >\n            {{ day.day }}\n        </button>\n    }\n</div>\n",
-			styles: ["@layer properties;:host{display:inline-flex;flex-direction:column;row-gap:calc(var(--spacing, .25rem) * 2)}.ui-calendar-header{display:flex;align-items:center;column-gap:var(--spacing, .25rem);padding-bottom:var(--spacing, .25rem)}.ui-calendar-selects{display:flex;min-width:0px;flex:1;column-gap:var(--spacing, .25rem)}.ui-calendar-month{min-width:0px;flex:1}.ui-calendar-year{width:calc(var(--spacing, .25rem) * 24);flex-shrink:0}.ui-calendar-nav{display:inline-flex;width:calc(var(--spacing, .25rem) * 8);height:calc(var(--spacing, .25rem) * 8);flex-shrink:0;align-items:center;justify-content:center;border-radius:var(--radius-full, calc(infinity * 1px));color:var(--foreground)}.ui-calendar-nav:focus{--tw-outline-style: none;outline-style:none}.ui-calendar-nav:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-calendar-nav:focus-visible{--tw-ring-color: color-mix(in srgb, oklch(88.2% .059 254.128) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-calendar-nav:focus-visible{--tw-ring-color: color-mix(in oklab, var(--color-primary-200, var(--color-blue-200)) 50%, transparent)}}.ui-calendar-nav:disabled{pointer-events:none}.ui-calendar-nav:disabled{opacity:50%}.ui-calendar-nav:hover,.ui-calendar-nav:focus-visible{background-color:var(--surface)}.ui-calendar-weekdays,.ui-calendar-grid{display:grid;grid-template-columns:repeat(7,calc(var(--spacing, .25rem) * 10.5));justify-content:center}.ui-calendar-grid{row-gap:calc(var(--spacing, .25rem) * .5)}.ui-calendar-weekday{width:calc(var(--spacing, .25rem) * 10.5);padding-bottom:var(--spacing, .25rem);text-align:center;color:var(--muted-foreground-1)}.ui-calendar-day{position:relative;display:inline-flex;width:calc(var(--spacing, .25rem) * 10.5);height:calc(var(--spacing, .25rem) * 10.5);align-items:center;justify-content:center;border-radius:var(--radius-full, calc(infinity * 1px));border-style:var(--tw-border-style);border-width:1.5px;border-color:transparent;color:var(--foreground);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.ui-calendar-day:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-calendar-day:focus-visible{--tw-ring-color: color-mix(in srgb, oklch(88.2% .059 254.128) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-calendar-day:focus-visible{--tw-ring-color: color-mix(in oklab, var(--color-primary-200, var(--color-blue-200)) 50%, transparent)}}.ui-calendar-day:focus-visible{--tw-outline-style: none;outline-style:none}.ui-calendar-day:hover,.ui-calendar-day:focus-visible{border-color:var(--color-primary-600, var(--color-blue-600))}.ui-calendar-day:hover,.ui-calendar-day:focus-visible{color:var(--color-primary-600, var(--color-blue-600))}.ui-calendar-day[aria-disabled]{cursor:not-allowed;text-decoration-line:line-through;opacity:40%}.ui-calendar-day[aria-disabled]:hover{border-color:transparent}.ui-calendar-day[aria-disabled]:hover{color:inherit}.ui-calendar-day[data-outside]{color:var(--muted-foreground)}.ui-calendar-day[data-today]{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:var(--color-primary-600, var(--color-blue-600))}.ui-calendar-day[aria-pressed=true]{border-color:var(--color-primary-600, var(--color-blue-600));background-color:var(--color-primary-600, var(--color-blue-600));color:var(--color-white, #fff)}.ui-calendar-day[aria-pressed=true]:hover,.ui-calendar-day[aria-pressed=true]:focus-visible{border-color:var(--color-primary-700, var(--color-blue-700))}.ui-calendar-day[aria-pressed=true]:hover,.ui-calendar-day[aria-pressed=true]:focus-visible{background-color:var(--color-primary-700, var(--color-blue-700))}.ui-calendar-day[aria-pressed=true]:hover,.ui-calendar-day[aria-pressed=true]:focus-visible{color:var(--color-white, #fff)}.ui-calendar-day[data-in-range]{border-radius:0;background-color:var(--color-primary-100, var(--color-blue-100));color:var(--foreground)}.ui-calendar-day[data-range-start]{border-top-right-radius:0;border-bottom-right-radius:0}.ui-calendar-day[data-range-end]{border-top-left-radius:0;border-bottom-left-radius:0}.ui-calendar-day[data-range-end]:not([aria-pressed=true]){background-color:var(--color-primary-100, var(--color-blue-100))}.ui-calendar-day[data-in-range]:not(:nth-child(7n)),.ui-calendar-day[data-range-start]:not(:nth-child(7n)){--tw-shadow: 1px 0 0 var(--tw-shadow-color, var(--color-primary-100));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-calendar-day[data-in-range]:nth-child(7n+1),.ui-calendar-day[data-range-end]:nth-child(7n+1){border-top-left-radius:var(--radius-full, calc(infinity * 1px));border-bottom-left-radius:var(--radius-full, calc(infinity * 1px))}.ui-calendar-day[data-in-range]:nth-child(7n),.ui-calendar-day[data-range-start]:nth-child(7n){border-top-right-radius:var(--radius-full, calc(infinity * 1px));border-bottom-right-radius:var(--radius-full, calc(infinity * 1px))}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-border-style: solid;--tw-duration: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"]
+			template: "<div class=\"ui-calendar-header\">\n    <button\n        type=\"button\"\n        class=\"ui-calendar-nav\"\n        aria-label=\"Previous month\"\n        [disabled]=\"!canGoBack()\"\n        (click)=\"showMonth(-1)\"\n    >\n        <ng-icon name=\"heroChevronLeft\" class=\"shrink-0\" />\n    </button>\n\n    <div class=\"ui-calendar-selects\">\n        <ui-select\n            class=\"ui-calendar-month\"\n            [dataSource]=\"monthSource()\"\n            [displayWith]=\"displayMonth\"\n            [pageSize]=\"12\"\n            [(selectedItem)]=\"viewMonth\"\n        />\n        <ui-select\n            class=\"ui-calendar-year\"\n            [dataSource]=\"yearSource()\"\n            [pageSize]=\"500\"\n            [(selectedItem)]=\"viewYear\"\n        />\n    </div>\n\n    <button\n        type=\"button\"\n        class=\"ui-calendar-nav\"\n        aria-label=\"Next month\"\n        [disabled]=\"!canGoForward()\"\n        (click)=\"showMonth(1)\"\n    >\n        <ng-icon name=\"heroChevronRight\" class=\"shrink-0\" />\n    </button>\n</div>\n\n<div class=\"ui-calendar-weekdays\" aria-hidden=\"true\">\n    @for (weekday of weekdays(); track $index) {\n        <span class=\"ui-calendar-weekday ui-text-caption\">{{ weekday }}</span>\n    }\n</div>\n\n<div class=\"ui-calendar-grid\" (mouseleave)=\"preview(null)\">\n    @for (day of days(); track day.iso) {\n        <button\n            type=\"button\"\n            class=\"ui-calendar-day ui-text-body-alt\"\n            [class]=\"day.className\"\n            [attr.data-date]=\"day.iso\"\n            [attr.data-outside]=\"day.isOutside ? '' : null\"\n            [attr.data-today]=\"day.isToday ? '' : null\"\n            [attr.data-in-range]=\"day.isInRange ? '' : null\"\n            [attr.data-range-start]=\"day.isRangeStart ? '' : null\"\n            [attr.data-range-end]=\"day.isRangeEnd ? '' : null\"\n            [attr.aria-current]=\"day.isToday ? 'date' : null\"\n            [attr.aria-pressed]=\"hideSelection() ? null : day.isSelected\"\n            [attr.aria-label]=\"day.label\"\n            [tabindex]=\"day.iso === tabbableDate() ? 0 : -1\"\n            [attr.aria-disabled]=\"day.isDisabled || null\"\n            (click)=\"select(day)\"\n            (keydown)=\"handleKeydown($event)\"\n            (mouseenter)=\"preview(day.iso)\"\n            (focus)=\"preview(day.iso)\"\n        >\n            @if (dayTemplate(); as dayTemplate) {\n                <ng-container\n                    [ngTemplateOutlet]=\"dayTemplate.template\"\n                    [ngTemplateOutletContext]=\"{ $implicit: day.iso, day }\"\n                />\n            } @else {\n                {{ day.day }}\n            }\n        </button>\n    }\n</div>\n",
+			styles: ["@layer properties;:host{display:inline-flex;flex-direction:column;row-gap:calc(var(--spacing, .25rem) * 2)}.ui-calendar-header{display:flex;align-items:center;column-gap:var(--spacing, .25rem);padding-bottom:var(--spacing, .25rem)}.ui-calendar-selects{display:flex;min-width:0px;flex:1;column-gap:var(--spacing, .25rem)}.ui-calendar-month{min-width:0px;flex:1}.ui-calendar-year{width:calc(var(--spacing, .25rem) * 24);flex-shrink:0}.ui-calendar-nav{display:inline-flex;width:calc(var(--spacing, .25rem) * 8);height:calc(var(--spacing, .25rem) * 8);flex-shrink:0;align-items:center;justify-content:center;border-radius:var(--radius-full, calc(infinity * 1px));color:var(--foreground)}.ui-calendar-nav:focus{--tw-outline-style: none;outline-style:none}.ui-calendar-nav:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-calendar-nav:focus-visible{--tw-ring-color: color-mix(in srgb, oklch(88.2% .059 254.128) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-calendar-nav:focus-visible{--tw-ring-color: color-mix(in oklab, var(--color-primary-200, var(--color-blue-200)) 50%, transparent)}}.ui-calendar-nav:disabled{pointer-events:none}.ui-calendar-nav:disabled{opacity:50%}.ui-calendar-nav:hover,.ui-calendar-nav:focus-visible{background-color:var(--surface)}.ui-calendar-weekdays,.ui-calendar-grid{display:grid;grid-template-columns:repeat(7,calc(var(--spacing, .25rem) * 10.5));justify-content:center}.ui-calendar-grid{row-gap:calc(var(--spacing, .25rem) * .5)}.ui-calendar-weekday{width:calc(var(--spacing, .25rem) * 10.5);padding-bottom:var(--spacing, .25rem);text-align:center;color:var(--muted-foreground-1)}.ui-calendar-day{position:relative;display:inline-flex;width:calc(var(--spacing, .25rem) * 10.5);height:calc(var(--spacing, .25rem) * 10.5);flex-direction:column;align-items:center;justify-content:center;border-radius:var(--radius-full, calc(infinity * 1px));border-style:var(--tw-border-style);border-width:1.5px;border-color:transparent;color:var(--foreground);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.ui-calendar-day:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-calendar-day:focus-visible{--tw-ring-color: color-mix(in srgb, oklch(88.2% .059 254.128) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-calendar-day:focus-visible{--tw-ring-color: color-mix(in oklab, var(--color-primary-200, var(--color-blue-200)) 50%, transparent)}}.ui-calendar-day:focus-visible{--tw-outline-style: none;outline-style:none}.ui-calendar-day:hover,.ui-calendar-day:focus-visible{border-color:var(--color-primary-600, var(--color-blue-600))}.ui-calendar-day:hover,.ui-calendar-day:focus-visible{color:var(--color-primary-600, var(--color-blue-600))}.ui-calendar-day[aria-disabled]{cursor:not-allowed;text-decoration-line:line-through;opacity:40%}.ui-calendar-day[aria-disabled]:hover{border-color:transparent}.ui-calendar-day[aria-disabled]:hover{color:inherit}.ui-calendar-day[data-outside]{color:var(--muted-foreground)}.ui-calendar-day[data-today]{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:var(--color-primary-600, var(--color-blue-600))}.ui-calendar-day[aria-pressed=true]{border-color:var(--color-primary-600, var(--color-blue-600));background-color:var(--color-primary-600, var(--color-blue-600));color:var(--color-white, #fff)}.ui-calendar-day[aria-pressed=true]:hover,.ui-calendar-day[aria-pressed=true]:focus-visible{border-color:var(--color-primary-700, var(--color-blue-700))}.ui-calendar-day[aria-pressed=true]:hover,.ui-calendar-day[aria-pressed=true]:focus-visible{background-color:var(--color-primary-700, var(--color-blue-700))}.ui-calendar-day[aria-pressed=true]:hover,.ui-calendar-day[aria-pressed=true]:focus-visible{color:var(--color-white, #fff)}.ui-calendar-day[data-in-range]{border-radius:0;background-color:var(--color-primary-100, var(--color-blue-100));color:var(--foreground)}.ui-calendar-day[data-range-start]{border-top-right-radius:0;border-bottom-right-radius:0}.ui-calendar-day[data-range-end]{border-top-left-radius:0;border-bottom-left-radius:0}.ui-calendar-day[data-range-end]:not([aria-pressed=true]){background-color:var(--color-primary-100, var(--color-blue-100))}.ui-calendar-day[data-in-range]:not(:nth-child(7n)),.ui-calendar-day[data-range-start]:not(:nth-child(7n)){--tw-shadow: 1px 0 0 var(--tw-shadow-color, var(--color-primary-100));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-calendar-day[data-in-range]:nth-child(7n+1),.ui-calendar-day[data-range-end]:nth-child(7n+1){border-top-left-radius:var(--radius-full, calc(infinity * 1px));border-bottom-left-radius:var(--radius-full, calc(infinity * 1px))}.ui-calendar-day[data-in-range]:nth-child(7n),.ui-calendar-day[data-range-start]:nth-child(7n){border-top-right-radius:var(--radius-full, calc(infinity * 1px));border-bottom-right-radius:var(--radius-full, calc(infinity * 1px))}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-border-style: solid;--tw-duration: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"]
 		}]
 	}],
+	ctorParameters: () => [],
 	propDecorators: {
 		mode: [{
 			type: i0.Input,
@@ -7867,6 +8796,34 @@ i0.ɵɵngDeclareClassMetadata({
 				alias: "locale",
 				required: false
 			}]
+		}],
+		dayClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "dayClass",
+				required: false
+			}]
+		}],
+		hideSelection: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "hideSelection",
+				required: false
+			}]
+		}],
+		dayClick: [{
+			type: i0.Output,
+			args: ["dayClick"]
+		}],
+		monthChange: [{
+			type: i0.Output,
+			args: ["monthChange"]
+		}],
+		dayTemplate: [{
+			type: i0.ContentChild,
+			args: [i0.forwardRef(() => UiCalendarDayDirective), { isSignal: true }]
 		}]
 	}
 });
@@ -12159,6 +13116,7 @@ var UiColourComponent = class UiColourComponent {
 			}
 		},
 		outputs: { value: "valueChange" },
+		host: { properties: { "attr.id": "null" } },
 		viewQueries: [{
 			propertyName: "picker",
 			first: true,
@@ -12251,6 +13209,7 @@ i0.ɵɵngDeclareClassMetadata({
 				UiInputGroupComponent,
 				UiButtonComponent
 			],
+			host: { "[attr.id]": "null" },
 			template: "<ui-input-group [validationState]=\"isValid() ? null : false\">\n    <ui-button\n        appearance=\"white\"\n        intent=\"secondary\"\n        size=\"sm\"\n        classes=\"h-full\"\n        ariaLabel=\"Pick colour\"\n        [disabled]=\"disabled()\"\n        (click)=\"openPicker()\"\n    >\n        <span\n            class=\"border border-line-2 rounded size-5\"\n            [style.background-color]=\"isValid() ? value() : 'transparent'\"\n        ></span>\n    </ui-button>\n\n    <input\n        #picker\n        type=\"color\"\n        class=\"sr-only\"\n        tabindex=\"-1\"\n        aria-hidden=\"true\"\n        [value]=\"pickerValue()\"\n        [disabled]=\"disabled()\"\n        (input)=\"handlePick($event)\"\n    />\n\n    <ui-input\n        [(value)]=\"value\"\n        [id]=\"id()\"\n        [disabled]=\"disabled()\"\n        [maxlength]=\"7\"\n        [spellcheck]=\"false\"\n        autocomplete=\"off\"\n        placeholder=\"#000000\"\n    />\n</ui-input-group>\n"
 		}]
 	}],
@@ -12728,7 +13687,10 @@ var UiDateRangePickerComponent = class UiDateRangePickerComponent {
 			}
 		},
 		outputs: { value: "valueChange" },
-		host: { classAttribute: "block" },
+		host: {
+			properties: { "attr.id": "null" },
+			classAttribute: "block"
+		},
 		providers: [provideIcons({
 			heroCalendarDateRange,
 			heroXMark
@@ -12799,9 +13761,16 @@ var UiDateRangePickerComponent = class UiDateRangePickerComponent {
 					"max",
 					"isDateDisabled",
 					"weekStart",
-					"locale"
+					"locale",
+					"dayClass",
+					"hideSelection"
 				],
-				outputs: ["valueChange", "rangeChange"]
+				outputs: [
+					"valueChange",
+					"rangeChange",
+					"dayClick",
+					"monthChange"
+				]
 			},
 			{
 				kind: "component",
@@ -12853,7 +13822,10 @@ i0.ɵɵngDeclareClassMetadata({
 				UiDropdownDirective,
 				NgIcon
 			],
-			host: { class: "block" },
+			host: {
+				class: "block",
+				"[attr.id]": "null"
+			},
 			providers: [provideIcons({
 				heroCalendarDateRange,
 				heroXMark
@@ -13431,7 +14403,10 @@ var UiDatepickerComponent = class UiDatepickerComponent {
 			}
 		},
 		outputs: { value: "valueChange" },
-		host: { classAttribute: "block" },
+		host: {
+			properties: { "attr.id": "null" },
+			classAttribute: "block"
+		},
 		providers: [provideIcons({
 			heroCalendar,
 			heroXMark
@@ -13502,9 +14477,16 @@ var UiDatepickerComponent = class UiDatepickerComponent {
 					"max",
 					"isDateDisabled",
 					"weekStart",
-					"locale"
+					"locale",
+					"dayClass",
+					"hideSelection"
 				],
-				outputs: ["valueChange", "rangeChange"]
+				outputs: [
+					"valueChange",
+					"rangeChange",
+					"dayClick",
+					"monthChange"
+				]
 			},
 			{
 				kind: "component",
@@ -13591,7 +14573,10 @@ i0.ɵɵngDeclareClassMetadata({
 				NgIcon,
 				UiCardComponent
 			],
-			host: { class: "block" },
+			host: {
+				class: "block",
+				"[attr.id]": "null"
+			},
 			providers: [provideIcons({
 				heroCalendar,
 				heroXMark
@@ -14084,6 +15069,7 @@ var UiFileInputComponent = class UiFileInputComponent {
 			value: "valueChange",
 			rejected: "rejected"
 		},
+		host: { properties: { "attr.id": "null" } },
 		providers: [provideIcons({
 			heroArrowUp,
 			heroXMark
@@ -14197,6 +15183,7 @@ i0.ɵɵngDeclareClassMetadata({
 				heroArrowUp,
 				heroXMark
 			})],
+			host: { "[attr.id]": "null" },
 			template: "<ui-input-group [validationState]=\"hasRejection() ? false : null\">\n    <ui-button\n        appearance=\"white\"\n        intent=\"secondary\"\n        size=\"sm\"\n        classes=\"h-full\"\n        [disabled]=\"disabled()\"\n        (click)=\"openPicker()\"\n    >\n        <ng-icon name=\"heroArrowUpTray\" class=\"shrink-0\" />\n        {{ buttonLabel() }}\n    </ui-button>\n\n    <input\n        #picker\n        type=\"file\"\n        class=\"sr-only\"\n        tabindex=\"-1\"\n        aria-hidden=\"true\"\n        [accept]=\"accept()\"\n        [multiple]=\"multiple()\"\n        [disabled]=\"disabled()\"\n        (change)=\"handlePick($event)\"\n    />\n\n    <ui-input\n        [value]=\"summary()\"\n        [id]=\"id()\"\n        [disabled]=\"disabled()\"\n        [placeholder]=\"placeholder()\"\n        [describedBy]=\"describedBy()\"\n        classes=\"truncate cursor-pointer\"\n        readonly\n        (click)=\"openPicker()\"\n    >\n        <ng-template #trailing>\n            @if (value().length && !disabled()) {\n                <button\n                    type=\"button\"\n                    class=\"inline-flex justify-center items-center w-8 self-stretch text-muted-foreground-1 hover:text-foreground\"\n                    aria-label=\"Clear files\"\n                    (click)=\"clear($event)\"\n                >\n                    <ng-icon name=\"heroXMark\" class=\"shrink-0\" />\n                </button>\n            }\n        </ng-template>\n    </ui-input>\n</ui-input-group>\n"
 		}]
 	}],
@@ -14596,6 +15583,7 @@ var UiSwitchComponent = class UiSwitchComponent {
 			}
 		},
 		outputs: { value: "valueChange" },
+		host: { properties: { "attr.id": "null" } },
 		ngImport: i0,
 		template: "<label class=\"inline-flex items-center gap-2 cursor-pointer\" [class.opacity-50]=\"disabled()\">\n    <span class=\"relative inline-flex items-center rounded-full focus-within:ring-2 focus-within:ring-primary-200/50\">\n        <!--\n            reuses ui-checkbox for the real state/behaviour, class-bound track/thumb below\n            react to value() directly instead of peer-checked, since peer-* relies on the\n            input and the styled element being real DOM siblings, which breaks once the\n            input is nested inside ui-checkbox's own host element\n        -->\n        <ui-checkbox\n            [(value)]=\"value\"\n            [disabled]=\"disabled()\"\n            [id]=\"id()\"\n            [name]=\"name()\"\n            classes=\"sr-only\"\n        />\n\n        <span\n            class=\"w-9 h-5 rounded-full transition-colors\"\n            [class.bg-primary-600]=\"value()\"\n            [class.bg-surface-1]=\"!value()\"\n        ></span>\n\n        <span\n            class=\"absolute left-0.5 size-4 rounded-full bg-white shadow transition-transform\"\n            [class.translate-x-4]=\"value()\"\n        ></span>\n    </span>\n\n    <ng-content />\n</label>\n",
 		dependencies: [{
@@ -14626,6 +15614,7 @@ i0.ɵɵngDeclareClassMetadata({
 		args: [{
 			selector: "ui-switch",
 			imports: [UiCheckboxComponent],
+			host: { "[attr.id]": "null" },
 			template: "<label class=\"inline-flex items-center gap-2 cursor-pointer\" [class.opacity-50]=\"disabled()\">\n    <span class=\"relative inline-flex items-center rounded-full focus-within:ring-2 focus-within:ring-primary-200/50\">\n        <!--\n            reuses ui-checkbox for the real state/behaviour, class-bound track/thumb below\n            react to value() directly instead of peer-checked, since peer-* relies on the\n            input and the styled element being real DOM siblings, which breaks once the\n            input is nested inside ui-checkbox's own host element\n        -->\n        <ui-checkbox\n            [(value)]=\"value\"\n            [disabled]=\"disabled()\"\n            [id]=\"id()\"\n            [name]=\"name()\"\n            classes=\"sr-only\"\n        />\n\n        <span\n            class=\"w-9 h-5 rounded-full transition-colors\"\n            [class.bg-primary-600]=\"value()\"\n            [class.bg-surface-1]=\"!value()\"\n        ></span>\n\n        <span\n            class=\"absolute left-0.5 size-4 rounded-full bg-white shadow transition-transform\"\n            [class.translate-x-4]=\"value()\"\n        ></span>\n    </span>\n\n    <ng-content />\n</label>\n"
 		}]
 	}],
@@ -14693,7 +15682,7 @@ var UiTableFiltersComponent = class UiTableFiltersComponent {
 	}, ...ngDevMode ? [{ debugName: "linked" }] : /* istanbul ignore next */ []);
 	appliedCount = computed(() => this.facets().filter((facet) => facet.id in this.value()).length, ...ngDevMode ? [{ debugName: "appliedCount" }] : /* istanbul ignore next */ []);
 	anyApplied = computed(() => this.appliedCount() > 0, ...ngDevMode ? [{ debugName: "anyApplied" }] : /* istanbul ignore next */ []);
-	window = inject(DOCUMENT).defaultView;
+	window = inject(DOCUMENT$1).defaultView;
 	wide = signal(true, ...ngDevMode ? [{ debugName: "wide" }] : /* istanbul ignore next */ []);
 	constructor() {
 		effect((onCleanup) => {
@@ -15255,7 +16244,8 @@ var UiUserMenuComponent = class UiUserMenuComponent {
 				inputs: [
 					"name",
 					"src",
-					"size"
+					"size",
+					"colour"
 				]
 			},
 			{
@@ -15337,7 +16327,7 @@ const PREFERENCES = [
 	"dark"
 ];
 var UiThemeService = class UiThemeService {
-	document = inject(DOCUMENT);
+	document = inject(DOCUMENT$1);
 	storageKey = inject(UI_THEME_CONFIG).storageKey;
 	media = this.document.defaultView?.matchMedia?.("(prefers-color-scheme: dark)");
 	preference = signal(this.stored(), ...ngDevMode ? [{ debugName: "preference" }] : /* istanbul ignore next */ []);
@@ -15525,6 +16515,6 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
-export { AlertAppearances, AlertIntents, AvatarSizes, BadgeAppearances, BadgeIntents, BadgeSizes, BarChartOrientations, ButtonAppearances, ButtonGroupAppearances, ButtonIntents, ButtonSizes, ButtonTypes, CHART_COLOURS, CHART_INK, CHART_INK_DARK, CHART_MAX_LINE_SERIES, CHART_MAX_SERIES, CHART_PALETTE, CHART_PALETTE_DARK, CalendarModes, CardHeadingLevels, CardRadii, DisclosureTriggerAppearances, FileRejectionReasons, InputAriaAutocompletes, InputAriaHasPopups, InputModes, InputTypes, LineChartCurves, MoneySignDisplays, PRIVATE_TEXT_LABEL, PRIVATE_TEXT_MASK, PieChartVariants, ProgressIntents, ProgressLabelPositions, ProgressOrientations, ProgressShapes, ProgressSizes, SelectLocalDataSource, SelectMultipleDisplays, SelectRemoteDataSource, SkeletonShapes, TableFiltersBreakpoints, TableLocalDataSource, TableRemoteDataSource, TextareaResizeOptions, ToastIntents, ToasterPositions, UI_BUTTON_GROUP, UI_FORMAT, UI_FORMAT_DEFAULTS, UI_LOADING_TYPES, UI_PRIVACY, UI_THEME_CONFIG, UiAlertComponent, UiAvatarComponent, UiBadgeComponent, UiBarChartComponent, UiButtonComponent, UiButtonGroupComponent, UiCalendarComponent, UiCardComponent, UiCardHeaderComponent, UiChartComponent, UiChartFrameComponent, UiChartLegendComponent, UiChartTableComponent, UiCheckboxComponent, UiColourComponent, UiContainerComponent, UiCounterComponent, UiDateRangePickerComponent, UiDatepickerComponent, UiDisclosureChevronComponent, UiDisclosureComponent, UiDisclosurePanelDirective, UiDisclosureTriggerComponent, UiDrawerComponent, UiDropdownButtonComponent, UiDropdownComponent, UiDropdownDirective, UiDropdownMenuComponent, UiDropzoneComponent, UiFieldComponent, UiFileInputComponent, UiInputAddonComponent, UiInputComponent, UiInputGroupComponent, UiKpiComponent, UiLayoutComponent, UiLineChartComponent, UiLoadingComponent, UiModalComponent, UiMoneyComponent, UiOverlayComponent, UiPaginationComponent, UiPieChartComponent, UiPrivacies, UiPrivateComponent, UiProgressComponent, UiRadioComponent, UiSearchComponent, UiSegmentedComponent, UiSelectComponent, UiSidebarComponent, UiSidebarGroupComponent, UiSidebarItemComponent, UiSkeletonComponent, UiStatComponent, UiSwitchComponent, UiTabComponent, UiTabDirective, UiTableBarDirective, UiTableCellDirective, UiTableComponent, UiTableFiltersComponent, UiTableRegistry, UiTextareaComponent, UiThemeService, UiThemeSwitchComponent, UiTimeSelectComponent, UiToastComponent, UiToastService, UiToasterComponent, UiTooltipComponent, UiTreemapChartComponent, UiUserMenuComponent, WeekStarts, chartColour, chartInk, chartLabelInk, chartSeriesStyle, defaultDateRangePresets, financialYearPreset, injectMoneyFormatter, injectPrivateText, lastDaysPreset, maskMoney, mixChartColours, moneyFormatterParts, monthPreset, pickedChartColour, provideUiFormat, provideUiPrivacy, provideUiTheme, radiusClasses, thisWeekPreset, todayPreset, yearPreset };
+export { AlertAppearances, AlertIntents, AvatarSizes, BadgeAppearances, BadgeIntents, BadgeSizes, BarChartOrientations, ButtonAppearances, ButtonGroupAppearances, ButtonIntents, ButtonSizes, ButtonTypes, CHART_COLOURS, CHART_INK, CHART_INK_DARK, CHART_MAX_LINE_SERIES, CHART_MAX_SERIES, CHART_PALETTE, CHART_PALETTE_DARK, CalendarModes, CardHeadingLevels, CardRadii, DisclosureTriggerAppearances, FileRejectionReasons, InputAriaAutocompletes, InputAriaHasPopups, InputModes, InputTypes, LineChartCurves, MoneySignDisplays, PRIVATE_TEXT_LABEL, PRIVATE_TEXT_MASK, PieChartVariants, ProgressIntents, ProgressLabelPositions, ProgressOrientations, ProgressShapes, ProgressSizes, RichTextToolGroups, RichTextTools, SelectLocalDataSource, SelectMultipleDisplays, SelectRemoteDataSource, SkeletonShapes, TableFiltersBreakpoints, TableLocalDataSource, TableRemoteDataSource, TextareaResizeOptions, ToastIntents, ToasterPositions, UI_BUTTON_GROUP, UI_FORMAT, UI_FORMAT_DEFAULTS, UI_LOADING_TYPES, UI_PRIVACY, UI_THEME_CONFIG, UiAlertComponent, UiAvatarComponent, UiBadgeComponent, UiBarChartComponent, UiButtonComponent, UiButtonGroupComponent, UiCalendarComponent, UiCalendarDayDirective, UiCardComponent, UiCardHeaderComponent, UiChartComponent, UiChartFrameComponent, UiChartLegendComponent, UiChartTableComponent, UiCheckboxComponent, UiColourComponent, UiContainerComponent, UiCounterComponent, UiDateRangePickerComponent, UiDatepickerComponent, UiDisclosureChevronComponent, UiDisclosureComponent, UiDisclosurePanelDirective, UiDisclosureTriggerComponent, UiDrawerComponent, UiDropdownButtonComponent, UiDropdownComponent, UiDropdownDirective, UiDropdownMenuComponent, UiDropzoneComponent, UiFieldComponent, UiFileInputComponent, UiInputAddonComponent, UiInputComponent, UiInputGroupComponent, UiKpiComponent, UiLayoutComponent, UiLineChartComponent, UiLoadingComponent, UiModalComponent, UiMoneyComponent, UiOverlayComponent, UiPaginationComponent, UiPieChartComponent, UiPrivacies, UiPrivateComponent, UiProgressComponent, UiRadioComponent, UiRichTextEditorComponent, UiSearchComponent, UiSegmentedComponent, UiSelectComponent, UiSidebarComponent, UiSidebarGroupComponent, UiSidebarItemComponent, UiSkeletonComponent, UiStatComponent, UiSwitchComponent, UiTabComponent, UiTabDirective, UiTableBarDirective, UiTableCellDirective, UiTableComponent, UiTableFiltersComponent, UiTableRegistry, UiTextareaComponent, UiThemeService, UiThemeSwitchComponent, UiTimeSelectComponent, UiToastComponent, UiToastService, UiToasterComponent, UiTooltipComponent, UiTreemapChartComponent, UiUserMenuComponent, WeekStarts, chartColour, chartInk, chartLabelInk, chartSeriesStyle, defaultDateRangePresets, financialYearPreset, injectMoneyFormatter, injectPrivateText, lastDaysPreset, maskMoney, mixChartColours, moneyFormatterParts, monthPreset, pickedChartColour, provideUiFormat, provideUiPrivacy, provideUiTheme, radiusClasses, thisWeekPreset, todayPreset, yearPreset };
 
 //# sourceMappingURL=area8975-ui.mjs.map