@lifecorner/angular-ui-kit 3.4.0 → 3.5.0

package/fesm2022/lifecorner-angular-ui-kit-textarea.mjs

@@ -0,0 +1,440 @@
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, afterRenderEffect, computed, forwardRef, input, output, signal, viewChild } from "@angular/core";
+import { NG_VALUE_ACCESSOR } from "@angular/forms";
+let nextUniqueId = 0;
+var TextareaComponent = class TextareaComponent {
+	textareaElement = viewChild("textarea", ...ngDevMode ? [{ debugName: "textareaElement" }] : /* istanbul ignore next */ []);
+	variant = input("outline", ...ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []);
+	size = input("md", ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
+	disabled = input(false, ...ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []);
+	error = input(false, ...ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []);
+	required = input(false, ...ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []);
+	readonly = input(false, ...ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []);
+	placeholder = input("", ...ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []);
+	label = input("", ...ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []);
+	helperText = input("", ...ngDevMode ? [{ debugName: "helperText" }] : /* istanbul ignore next */ []);
+	errorMessage = input("", ...ngDevMode ? [{ debugName: "errorMessage" }] : /* istanbul ignore next */ []);
+	ariaLabel = input(void 0, ...ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []);
+	rows = input(3, ...ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []);
+	maxLength = input(void 0, ...ngDevMode ? [{ debugName: "maxLength" }] : /* istanbul ignore next */ []);
+	showCharacterCount = input(false, ...ngDevMode ? [{ debugName: "showCharacterCount" }] : /* istanbul ignore next */ []);
+	autoResize = input(false, ...ngDevMode ? [{ debugName: "autoResize" }] : /* istanbul ignore next */ []);
+	minRows = input(3, ...ngDevMode ? [{ debugName: "minRows" }] : /* istanbul ignore next */ []);
+	maxRows = input(void 0, ...ngDevMode ? [{ debugName: "maxRows" }] : /* istanbul ignore next */ []);
+	valueChange = output();
+	textareaId = `lc-textarea-${nextUniqueId++}`;
+	errorId = `${this.textareaId}-error`;
+	helperId = `${this.textareaId}-helper`;
+	value = signal("", ...ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []);
+	formDisabled = signal(false, ...ngDevMode ? [{ debugName: "formDisabled" }] : /* istanbul ignore next */ []);
+	isDisabled = computed(() => this.disabled() || this.formDisabled(), ...ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []);
+	currentCharacterCount = computed(() => this.value().length, ...ngDevMode ? [{ debugName: "currentCharacterCount" }] : /* istanbul ignore next */ []);
+	characterCountText = computed(() => {
+		const current = this.currentCharacterCount();
+		const max = this.maxLength();
+		return max !== void 0 ? `${current} / ${max}` : `${current}`;
+	}, ...ngDevMode ? [{ debugName: "characterCountText" }] : /* istanbul ignore next */ []);
+	isOverLimit = computed(() => {
+		const max = this.maxLength();
+		return max !== void 0 && this.currentCharacterCount() > max;
+	}, ...ngDevMode ? [{ debugName: "isOverLimit" }] : /* istanbul ignore next */ []);
+	showsError = computed(() => this.error() && !!this.errorMessage(), ...ngDevMode ? [{ debugName: "showsError" }] : /* istanbul ignore next */ []);
+	showsHelper = computed(() => !this.showsError() && !!this.helperText(), ...ngDevMode ? [{ debugName: "showsHelper" }] : /* istanbul ignore next */ []);
+	describedBy = computed(() => {
+		const ids = [];
+		if (this.showsError()) ids.push(this.errorId);
+		if (this.showsHelper()) ids.push(this.helperId);
+		return ids.length ? ids.join(" ") : null;
+	}, ...ngDevMode ? [{ debugName: "describedBy" }] : /* istanbul ignore next */ []);
+	textareaClasses = computed(() => {
+		const classes = [
+			"lc-textarea",
+			`lc-textarea--${this.variant()}`,
+			`lc-textarea--${this.size()}`
+		];
+		if (this.isDisabled()) classes.push("lc-textarea--disabled");
+		if (this.error()) classes.push("lc-textarea--error");
+		if (this.readonly()) classes.push("lc-textarea--readonly");
+		if (this.autoResize()) classes.push("lc-textarea--auto-resize");
+		return classes.join(" ");
+	}, ...ngDevMode ? [{ debugName: "textareaClasses" }] : /* istanbul ignore next */ []);
+	onChange = () => {};
+	onTouched = () => {};
+	constructor() {
+		afterRenderEffect(() => {
+			this.value();
+			this.minRows();
+			this.maxRows();
+			if (this.autoResize()) this.adjustHeight();
+		});
+	}
+	onInput(value) {
+		if (this.isDisabled() || this.readonly()) return;
+		this.value.set(value);
+		this.onChange(value);
+		this.valueChange.emit(value);
+	}
+	onBlur() {
+		this.onTouched();
+	}
+	writeValue(value) {
+		this.value.set(value || "");
+	}
+	registerOnChange(fn) {
+		this.onChange = fn;
+	}
+	registerOnTouched(fn) {
+		this.onTouched = fn;
+	}
+	setDisabledState(isDisabled) {
+		this.formDisabled.set(isDisabled);
+	}
+	adjustHeight() {
+		const textarea = this.textareaElement()?.nativeElement;
+		if (!textarea) return;
+		textarea.style.height = "auto";
+		const minHeight = this.rowsToHeight(textarea, this.minRows());
+		const maxHeight = this.rowsToHeight(textarea, this.maxRows());
+		let newHeight = textarea.scrollHeight;
+		if (minHeight !== void 0) newHeight = Math.max(newHeight, minHeight);
+		if (maxHeight !== void 0) newHeight = Math.min(newHeight, maxHeight);
+		textarea.style.height = `${newHeight}px`;
+	}
+	rowsToHeight(textarea, rows) {
+		if (rows === void 0) return;
+		const style = getComputedStyle(textarea);
+		const lineHeight = parseFloat(style.lineHeight);
+		const paddingTop = parseFloat(style.paddingTop) || 0;
+		const paddingBottom = parseFloat(style.paddingBottom) || 0;
+		if (!Number.isFinite(lineHeight)) return;
+		return lineHeight * rows + paddingTop + paddingBottom;
+	}
+	getInputValue(event) {
+		return event.target.value;
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: TextareaComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.2",
+		type: TextareaComponent,
+		isStandalone: true,
+		selector: "lc-textarea",
+		inputs: {
+			variant: {
+				classPropertyName: "variant",
+				publicName: "variant",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			size: {
+				classPropertyName: "size",
+				publicName: "size",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			disabled: {
+				classPropertyName: "disabled",
+				publicName: "disabled",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			error: {
+				classPropertyName: "error",
+				publicName: "error",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			required: {
+				classPropertyName: "required",
+				publicName: "required",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			readonly: {
+				classPropertyName: "readonly",
+				publicName: "readonly",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			placeholder: {
+				classPropertyName: "placeholder",
+				publicName: "placeholder",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			label: {
+				classPropertyName: "label",
+				publicName: "label",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			helperText: {
+				classPropertyName: "helperText",
+				publicName: "helperText",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			errorMessage: {
+				classPropertyName: "errorMessage",
+				publicName: "errorMessage",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			ariaLabel: {
+				classPropertyName: "ariaLabel",
+				publicName: "ariaLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			rows: {
+				classPropertyName: "rows",
+				publicName: "rows",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			maxLength: {
+				classPropertyName: "maxLength",
+				publicName: "maxLength",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			showCharacterCount: {
+				classPropertyName: "showCharacterCount",
+				publicName: "showCharacterCount",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			autoResize: {
+				classPropertyName: "autoResize",
+				publicName: "autoResize",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			minRows: {
+				classPropertyName: "minRows",
+				publicName: "minRows",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			maxRows: {
+				classPropertyName: "maxRows",
+				publicName: "maxRows",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: { valueChange: "valueChange" },
+		providers: [{
+			provide: NG_VALUE_ACCESSOR,
+			useExisting: forwardRef(() => TextareaComponent),
+			multi: true
+		}],
+		viewQueries: [{
+			propertyName: "textareaElement",
+			first: true,
+			predicate: ["textarea"],
+			descendants: true,
+			isSignal: true
+		}],
+		ngImport: i0,
+		template: "<div class=\"lc-textarea-wrapper\">\n  @if (label()) {\n    <label [for]=\"textareaId\" class=\"lc-textarea-label\">\n      {{ label() }}\n      @if (required()) {\n        <span class=\"lc-textarea-required-indicator\" aria-hidden=\"true\">*</span>\n      }\n    </label>\n  }\n\n  <div class=\"lc-textarea-input-wrapper\">\n    <textarea\n      #textarea\n      [id]=\"textareaId\"\n      [class]=\"textareaClasses()\"\n      [value]=\"value()\"\n      [placeholder]=\"placeholder()\"\n      [disabled]=\"isDisabled()\"\n      [readonly]=\"readonly()\"\n      [required]=\"required()\"\n      [attr.rows]=\"autoResize() ? null : rows()\"\n      [attr.maxlength]=\"maxLength() ?? null\"\n      [attr.aria-label]=\"ariaLabel() || null\"\n      [attr.aria-required]=\"required() || null\"\n      [attr.aria-invalid]=\"error() || null\"\n      [attr.aria-describedby]=\"describedBy()\"\n      (input)=\"onInput(getInputValue($event))\"\n      (blur)=\"onBlur()\"\n    ></textarea>\n  </div>\n\n  <div class=\"lc-textarea-footer\">\n    <div class=\"lc-textarea-messages\">\n      @if (showsError()) {\n        <span [id]=\"errorId\" class=\"lc-textarea-error-message\" role=\"alert\">{{ errorMessage() }}</span>\n      } @else if (showsHelper()) {\n        <span [id]=\"helperId\" class=\"lc-textarea-helper-text\">{{ helperText() }}</span>\n      }\n    </div>\n\n    @if (showCharacterCount()) {\n      <span\n        class=\"lc-textarea-character-count\"\n        [class.lc-textarea-character-count--over-limit]=\"isOverLimit()\"\n        aria-live=\"polite\"\n      >\n        {{ characterCountText() }}\n      </span>\n    }\n  </div>\n</div>\n",
+		styles: [".lc-textarea-wrapper{display:flex;flex-direction:column;gap:var(--lc-density-gap-sm, var(--spacing-2));width:100%}.lc-textarea-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-primary)}.lc-textarea{width:100%;font-family:var(--font-family-base);font-size:var(--font-size-base);line-height:var(--line-height-base);color:var(--color-text-primary);background-color:var(--color-surface);border:1px solid var(--color-field-border);border-radius:var(--border-radius-md);transition:all var(--animation-duration-base) var(--animation-timing-ease);resize:vertical;outline:none}.lc-textarea::placeholder{color:var(--color-text-tertiary)}.lc-textarea:focus{border-color:var(--color-primary-500);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-primary-500) 20%,transparent)}.lc-textarea--xs{padding:var(--spacing-2) var(--spacing-3);font-size:var(--font-size-xs);min-height:4rem}.lc-textarea--sm{padding:var(--spacing-2-5) var(--spacing-3-5);font-size:var(--font-size-sm);min-height:5rem}.lc-textarea--md{padding:var(--spacing-3) var(--spacing-4);font-size:var(--font-size-base);min-height:6rem}.lc-textarea--lg{padding:var(--spacing-3-5) var(--spacing-5);font-size:var(--font-size-lg);min-height:7rem}.lc-textarea--outline{background-color:var(--color-surface);border-color:var(--color-field-border)}.lc-textarea--outline:hover:not(:disabled):not(:read-only){border-color:var(--color-primary-400)}.lc-textarea--outline:focus{border-color:var(--color-primary-500);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-primary-500) 20%,transparent)}.lc-textarea--filled{background-color:var(--color-surface-sunken);border-color:transparent}.lc-textarea--filled:hover:not(:disabled):not(:read-only){background-color:var(--color-surface-hover)}.lc-textarea--filled:focus{background-color:var(--color-surface);border-color:var(--color-primary-500);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-primary-500) 20%,transparent)}.lc-textarea--disabled{cursor:not-allowed;opacity:.6;background-color:var(--color-surface-muted);color:var(--color-text-tertiary)}.lc-textarea--readonly{cursor:default;background-color:var(--color-surface-muted)}.lc-textarea--error{border-color:var(--color-error-600)}.lc-textarea--error:focus{border-color:var(--color-error-600);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-error-600) 20%,transparent)}.lc-textarea--auto-resize{resize:none;overflow:hidden}.lc-textarea-helper-text{font-size:var(--font-size-xs);color:var(--color-text-secondary)}.lc-textarea-error-message{font-size:var(--font-size-xs);color:var(--color-text-error)}.lc-textarea-char-count,.lc-textarea-character-count{font-size:var(--font-size-xs);color:var(--color-text-tertiary);text-align:right}.lc-textarea-char-count--warning,.lc-textarea-character-count--warning{color:var(--color-warning-600)}.lc-textarea-char-count--error,.lc-textarea-char-count--over-limit,.lc-textarea-character-count--error,.lc-textarea-character-count--over-limit{color:var(--color-text-error)}.lc-textarea-footer{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--lc-density-gap-sm, var(--spacing-2))}.lc-textarea-messages{flex:1}.lc-textarea-input-wrapper{position:relative;width:100%}.lc-textarea-required-indicator{color:var(--color-text-error)}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: TextareaComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "lc-textarea",
+			standalone: true,
+			imports: [],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			providers: [{
+				provide: NG_VALUE_ACCESSOR,
+				useExisting: forwardRef(() => TextareaComponent),
+				multi: true
+			}],
+			template: "<div class=\"lc-textarea-wrapper\">\n  @if (label()) {\n    <label [for]=\"textareaId\" class=\"lc-textarea-label\">\n      {{ label() }}\n      @if (required()) {\n        <span class=\"lc-textarea-required-indicator\" aria-hidden=\"true\">*</span>\n      }\n    </label>\n  }\n\n  <div class=\"lc-textarea-input-wrapper\">\n    <textarea\n      #textarea\n      [id]=\"textareaId\"\n      [class]=\"textareaClasses()\"\n      [value]=\"value()\"\n      [placeholder]=\"placeholder()\"\n      [disabled]=\"isDisabled()\"\n      [readonly]=\"readonly()\"\n      [required]=\"required()\"\n      [attr.rows]=\"autoResize() ? null : rows()\"\n      [attr.maxlength]=\"maxLength() ?? null\"\n      [attr.aria-label]=\"ariaLabel() || null\"\n      [attr.aria-required]=\"required() || null\"\n      [attr.aria-invalid]=\"error() || null\"\n      [attr.aria-describedby]=\"describedBy()\"\n      (input)=\"onInput(getInputValue($event))\"\n      (blur)=\"onBlur()\"\n    ></textarea>\n  </div>\n\n  <div class=\"lc-textarea-footer\">\n    <div class=\"lc-textarea-messages\">\n      @if (showsError()) {\n        <span [id]=\"errorId\" class=\"lc-textarea-error-message\" role=\"alert\">{{ errorMessage() }}</span>\n      } @else if (showsHelper()) {\n        <span [id]=\"helperId\" class=\"lc-textarea-helper-text\">{{ helperText() }}</span>\n      }\n    </div>\n\n    @if (showCharacterCount()) {\n      <span\n        class=\"lc-textarea-character-count\"\n        [class.lc-textarea-character-count--over-limit]=\"isOverLimit()\"\n        aria-live=\"polite\"\n      >\n        {{ characterCountText() }}\n      </span>\n    }\n  </div>\n</div>\n",
+			styles: [".lc-textarea-wrapper{display:flex;flex-direction:column;gap:var(--lc-density-gap-sm, var(--spacing-2));width:100%}.lc-textarea-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-primary)}.lc-textarea{width:100%;font-family:var(--font-family-base);font-size:var(--font-size-base);line-height:var(--line-height-base);color:var(--color-text-primary);background-color:var(--color-surface);border:1px solid var(--color-field-border);border-radius:var(--border-radius-md);transition:all var(--animation-duration-base) var(--animation-timing-ease);resize:vertical;outline:none}.lc-textarea::placeholder{color:var(--color-text-tertiary)}.lc-textarea:focus{border-color:var(--color-primary-500);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-primary-500) 20%,transparent)}.lc-textarea--xs{padding:var(--spacing-2) var(--spacing-3);font-size:var(--font-size-xs);min-height:4rem}.lc-textarea--sm{padding:var(--spacing-2-5) var(--spacing-3-5);font-size:var(--font-size-sm);min-height:5rem}.lc-textarea--md{padding:var(--spacing-3) var(--spacing-4);font-size:var(--font-size-base);min-height:6rem}.lc-textarea--lg{padding:var(--spacing-3-5) var(--spacing-5);font-size:var(--font-size-lg);min-height:7rem}.lc-textarea--outline{background-color:var(--color-surface);border-color:var(--color-field-border)}.lc-textarea--outline:hover:not(:disabled):not(:read-only){border-color:var(--color-primary-400)}.lc-textarea--outline:focus{border-color:var(--color-primary-500);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-primary-500) 20%,transparent)}.lc-textarea--filled{background-color:var(--color-surface-sunken);border-color:transparent}.lc-textarea--filled:hover:not(:disabled):not(:read-only){background-color:var(--color-surface-hover)}.lc-textarea--filled:focus{background-color:var(--color-surface);border-color:var(--color-primary-500);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-primary-500) 20%,transparent)}.lc-textarea--disabled{cursor:not-allowed;opacity:.6;background-color:var(--color-surface-muted);color:var(--color-text-tertiary)}.lc-textarea--readonly{cursor:default;background-color:var(--color-surface-muted)}.lc-textarea--error{border-color:var(--color-error-600)}.lc-textarea--error:focus{border-color:var(--color-error-600);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-error-600) 20%,transparent)}.lc-textarea--auto-resize{resize:none;overflow:hidden}.lc-textarea-helper-text{font-size:var(--font-size-xs);color:var(--color-text-secondary)}.lc-textarea-error-message{font-size:var(--font-size-xs);color:var(--color-text-error)}.lc-textarea-char-count,.lc-textarea-character-count{font-size:var(--font-size-xs);color:var(--color-text-tertiary);text-align:right}.lc-textarea-char-count--warning,.lc-textarea-character-count--warning{color:var(--color-warning-600)}.lc-textarea-char-count--error,.lc-textarea-char-count--over-limit,.lc-textarea-character-count--error,.lc-textarea-character-count--over-limit{color:var(--color-text-error)}.lc-textarea-footer{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--lc-density-gap-sm, var(--spacing-2))}.lc-textarea-messages{flex:1}.lc-textarea-input-wrapper{position:relative;width:100%}.lc-textarea-required-indicator{color:var(--color-text-error)}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		textareaElement: [{
+			type: i0.ViewChild,
+			args: ["textarea", { isSignal: true }]
+		}],
+		variant: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "variant",
+				required: false
+			}]
+		}],
+		size: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "size",
+				required: false
+			}]
+		}],
+		disabled: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disabled",
+				required: false
+			}]
+		}],
+		error: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "error",
+				required: false
+			}]
+		}],
+		required: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "required",
+				required: false
+			}]
+		}],
+		readonly: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "readonly",
+				required: false
+			}]
+		}],
+		placeholder: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "placeholder",
+				required: false
+			}]
+		}],
+		label: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "label",
+				required: false
+			}]
+		}],
+		helperText: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "helperText",
+				required: false
+			}]
+		}],
+		errorMessage: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "errorMessage",
+				required: false
+			}]
+		}],
+		ariaLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "ariaLabel",
+				required: false
+			}]
+		}],
+		rows: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "rows",
+				required: false
+			}]
+		}],
+		maxLength: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "maxLength",
+				required: false
+			}]
+		}],
+		showCharacterCount: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "showCharacterCount",
+				required: false
+			}]
+		}],
+		autoResize: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "autoResize",
+				required: false
+			}]
+		}],
+		minRows: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "minRows",
+				required: false
+			}]
+		}],
+		maxRows: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "maxRows",
+				required: false
+			}]
+		}],
+		valueChange: [{
+			type: i0.Output,
+			args: ["valueChange"]
+		}]
+	}
+});
+export { TextareaComponent };
+
+//# sourceMappingURL=lifecorner-angular-ui-kit-textarea.mjs.map

package/fesm2022/lifecorner-angular-ui-kit-textarea.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"lifecorner-angular-ui-kit-textarea.mjs","names":[],"sources":["../../../../libs/angular-ui-kit/src/lib/textarea/textarea.component.ts","../../../../libs/angular-ui-kit/src/lib/textarea/textarea.component.html"],"sourcesContent":["import {\n  Component,\n  ChangeDetectionStrategy,\n  ElementRef,\n  afterRenderEffect,\n  computed,\n  forwardRef,\n  input,\n  output,\n  signal,\n  viewChild,\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\nlet nextUniqueId = 0;\n\n/**\n * Textarea component for multi-line text input.\n *\n * Features:\n * - Variant styles (outline, filled)\n * - Size presets (xs, sm, md, lg)\n * - Auto-resize with configurable min/max rows\n * - Character count display with maxLength\n * - Validation error message and helper text\n * - Disabled and readonly states\n * - ControlValueAccessor integration for reactive forms\n *\n * @example\n * ```html\n * <lc-textarea placeholder=\"Enter message\" [autoResize]=\"true\" [(ngModel)]=\"message\" />\n * ```\n */\n@Component({\n  selector: 'lc-textarea',\n  standalone: true,\n  imports: [],\n  templateUrl: './textarea.component.html',\n  styleUrl: './textarea.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => TextareaComponent),\n      multi: true,\n    },\n  ],\n})\nexport class TextareaComponent implements ControlValueAccessor {\n  private readonly textareaElement = viewChild<ElementRef<HTMLTextAreaElement>>('textarea');\n\n  /**\n   * Visual variant of the textarea\n   */\n  readonly variant = input<'outline' | 'filled'>('outline');\n\n  /**\n   * Size of the textarea\n   */\n  readonly size = input<'xs' | 'sm' | 'md' | 'lg'>('md');\n\n  /**\n   * Whether the textarea is disabled\n   */\n  readonly disabled = input<boolean>(false);\n\n  /**\n   * Whether the textarea is in error state\n   */\n  readonly error = input<boolean>(false);\n\n  /**\n   * Whether the textarea is required\n   */\n  readonly required = input<boolean>(false);\n\n  /**\n   * Whether the textarea is readonly\n   */\n  readonly readonly = input<boolean>(false);\n\n  /**\n   * Placeholder text\n   */\n  readonly placeholder = input<string>('');\n\n  /**\n   * Label text displayed above the textarea\n   */\n  readonly label = input<string>('');\n\n  /**\n   * Helper text displayed below the textarea\n   */\n  readonly helperText = input<string>('');\n\n  /**\n   * Error message displayed when error is true\n   */\n  readonly errorMessage = input<string>('');\n\n  /**\n   * ARIA label for accessibility\n   */\n  readonly ariaLabel = input<string | undefined>(undefined);\n\n  /**\n   * Number of visible text rows\n   */\n  readonly rows = input<number>(3);\n\n  /**\n   * Maximum number of characters allowed\n   */\n  readonly maxLength = input<number | undefined>(undefined);\n\n  /**\n   * Whether to show character count\n   */\n  readonly showCharacterCount = input<boolean>(false);\n\n  /**\n   * Whether to automatically resize based on content\n   */\n  readonly autoResize = input<boolean>(false);\n\n  /**\n   * Minimum number of rows for auto-resize\n   */\n  readonly minRows = input<number>(3);\n\n  /**\n   * Maximum number of rows for auto-resize\n   */\n  readonly maxRows = input<number | undefined>(undefined);\n\n  /**\n   * Emitted when value changes\n   */\n  readonly valueChange = output<string>();\n\n  /** Per-instance id: links label, error and helper text to the control. */\n  readonly textareaId = `lc-textarea-${nextUniqueId++}`;\n  readonly errorId = `${this.textareaId}-error`;\n  readonly helperId = `${this.textareaId}-helper`;\n\n  // Internal state\n  readonly value = signal<string>('');\n\n  // Internal disabled state (for ControlValueAccessor)\n  private readonly formDisabled = signal<boolean>(false);\n\n  /**\n   * Computed disabled state from both input and form control\n   */\n  readonly isDisabled = computed(() => this.disabled() || this.formDisabled());\n\n  // Computed values\n  readonly currentCharacterCount = computed(() => this.value().length);\n\n  readonly characterCountText = computed(() => {\n    const current = this.currentCharacterCount();\n    const max = this.maxLength();\n    return max !== undefined ? `${current} / ${max}` : `${current}`;\n  });\n\n  readonly isOverLimit = computed(() => {\n    const max = this.maxLength();\n    return max !== undefined && this.currentCharacterCount() > max;\n  });\n\n  /** Whether an error message is shown (drives aria-describedby) */\n  readonly showsError = computed(() => this.error() && !!this.errorMessage());\n\n  /** Whether the helper text is shown (error message takes precedence) */\n  readonly showsHelper = computed(() => !this.showsError() && !!this.helperText());\n\n  readonly describedBy = computed(() => {\n    const ids: string[] = [];\n    if (this.showsError()) ids.push(this.errorId);\n    if (this.showsHelper()) ids.push(this.helperId);\n    return ids.length ? ids.join(' ') : null;\n  });\n\n  /**\n   * Computed classes for the textarea element\n   */\n  readonly textareaClasses = computed(() => {\n    const classes = ['lc-textarea', `lc-textarea--${this.variant()}`, `lc-textarea--${this.size()}`];\n\n    if (this.isDisabled()) {\n      classes.push('lc-textarea--disabled');\n    }\n\n    if (this.error()) {\n      classes.push('lc-textarea--error');\n    }\n\n    if (this.readonly()) {\n      classes.push('lc-textarea--readonly');\n    }\n\n    if (this.autoResize()) {\n      classes.push('lc-textarea--auto-resize');\n    }\n\n    return classes.join(' ');\n  });\n\n  // eslint-disable-next-line @typescript-eslint/no-empty-function\n  private onChange: (value: string) => void = () => {};\n  // eslint-disable-next-line @typescript-eslint/no-empty-function\n  private onTouched: () => void = () => {};\n\n  constructor() {\n    // Re-measure after every render in which the value or the resize\n    // constraints changed — this covers typing, form writes and input changes\n    // without timers, and runs once the DOM already holds the new value.\n    afterRenderEffect(() => {\n      this.value();\n      this.minRows();\n      this.maxRows();\n      if (this.autoResize()) {\n        this.adjustHeight();\n      }\n    });\n  }\n\n  /**\n   * Handle input changes\n   */\n  onInput(value: string): void {\n    if (this.isDisabled() || this.readonly()) {\n      return;\n    }\n\n    this.value.set(value);\n    this.onChange(value);\n    this.valueChange.emit(value);\n  }\n\n  /**\n   * Handle blur event\n   */\n  onBlur(): void {\n    this.onTouched();\n  }\n\n  // ControlValueAccessor implementation\n  writeValue(value: string | null | undefined): void {\n    this.value.set(value || '');\n  }\n\n  registerOnChange(fn: (value: string) => void): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: () => void): void {\n    this.onTouched = fn;\n  }\n\n  setDisabledState(isDisabled: boolean): void {\n    this.formDisabled.set(isDisabled);\n  }\n\n  // Private helper methods\n  private adjustHeight(): void {\n    const textarea = this.textareaElement()?.nativeElement;\n    if (!textarea) {\n      return;\n    }\n\n    // Reset height to get accurate scrollHeight\n    textarea.style.height = 'auto';\n\n    const minHeight = this.rowsToHeight(textarea, this.minRows());\n    const maxHeight = this.rowsToHeight(textarea, this.maxRows());\n    let newHeight = textarea.scrollHeight;\n\n    // Apply constraints\n    if (minHeight !== undefined) {\n      newHeight = Math.max(newHeight, minHeight);\n    }\n    if (maxHeight !== undefined) {\n      newHeight = Math.min(newHeight, maxHeight);\n    }\n\n    textarea.style.height = `${newHeight}px`;\n  }\n\n  /** Pixel height for `rows` lines incl. vertical padding; undefined when it cannot be measured. */\n  private rowsToHeight(textarea: HTMLTextAreaElement, rows: number | undefined): number | undefined {\n    if (rows === undefined) {\n      return undefined;\n    }\n\n    const style = getComputedStyle(textarea);\n    const lineHeight = parseFloat(style.lineHeight);\n    const paddingTop = parseFloat(style.paddingTop) || 0;\n    const paddingBottom = parseFloat(style.paddingBottom) || 0;\n\n    // 'normal' / unmeasurable line-height (e.g. jsdom) → no constraint\n    if (!Number.isFinite(lineHeight)) {\n      return undefined;\n    }\n\n    return lineHeight * rows + paddingTop + paddingBottom;\n  }\n\n  protected getInputValue(event: Event): string {\n    return (event.target as HTMLTextAreaElement).value;\n  }\n}\n","<div class=\"lc-textarea-wrapper\">\n  @if (label()) {\n    <label [for]=\"textareaId\" class=\"lc-textarea-label\">\n      {{ label() }}\n      @if (required()) {\n        <span class=\"lc-textarea-required-indicator\" aria-hidden=\"true\">*</span>\n      }\n    </label>\n  }\n\n  <div class=\"lc-textarea-input-wrapper\">\n    <textarea\n      #textarea\n      [id]=\"textareaId\"\n      [class]=\"textareaClasses()\"\n      [value]=\"value()\"\n      [placeholder]=\"placeholder()\"\n      [disabled]=\"isDisabled()\"\n      [readonly]=\"readonly()\"\n      [required]=\"required()\"\n      [attr.rows]=\"autoResize() ? null : rows()\"\n      [attr.maxlength]=\"maxLength() ?? null\"\n      [attr.aria-label]=\"ariaLabel() || null\"\n      [attr.aria-required]=\"required() || null\"\n      [attr.aria-invalid]=\"error() || null\"\n      [attr.aria-describedby]=\"describedBy()\"\n      (input)=\"onInput(getInputValue($event))\"\n      (blur)=\"onBlur()\"\n    ></textarea>\n  </div>\n\n  <div class=\"lc-textarea-footer\">\n    <div class=\"lc-textarea-messages\">\n      @if (showsError()) {\n        <span [id]=\"errorId\" class=\"lc-textarea-error-message\" role=\"alert\">{{ errorMessage() }}</span>\n      } @else if (showsHelper()) {\n        <span [id]=\"helperId\" class=\"lc-textarea-helper-text\">{{ helperText() }}</span>\n      }\n    </div>\n\n    @if (showCharacterCount()) {\n      <span\n        class=\"lc-textarea-character-count\"\n        [class.lc-textarea-character-count--over-limit]=\"isOverLimit()\"\n        aria-live=\"polite\"\n      >\n        {{ characterCountText() }}\n      </span>\n    }\n  </div>\n</div>\n"],"mappings":"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"}

package/fesm2022/lifecorner-angular-ui-kit-theme.mjs

@@ -0,0 +1,145 @@
+import * as i0 from "@angular/core";
+import { DestroyRef, Injectable, PLATFORM_ID, computed, inject, signal } from "@angular/core";
+import { isPlatformBrowser } from "@angular/common";
+var ThemeService = class ThemeService {
+	static STORAGE_KEY = "lc-theme";
+	static SYSTEM_CLASS = "system";
+	platformId = inject(PLATFORM_ID);
+	isBrowser = isPlatformBrowser(this.platformId);
+	destroyRef = inject(DestroyRef);
+	static META_COLOR = {
+		dark: "#0a121b",
+		light: "#ffffff"
+	};
+	themeState = signal({
+		currentMode: "dark",
+		prefersDark: true
+	}, ...ngDevMode ? [{ debugName: "themeState" }] : /* istanbul ignore next */ []);
+	currentTheme = this.themeState.asReadonly();
+	isDark = computed(() => this.themeState().currentMode === "dark", ...ngDevMode ? [{ debugName: "isDark" }] : /* istanbul ignore next */ []);
+	systemQuery = null;
+	cssFollowsSystem = false;
+	systemChangeHandler = (event) => {
+		this.themeState.update((state) => ({
+			...state,
+			prefersDark: event.matches
+		}));
+		this.applyMode(event.matches ? "dark" : "light");
+	};
+	constructor() {
+		if (this.rootFollowsSystem()) this.useSystemPreference();
+		else {
+			const initial = this.readInitialMode();
+			this.themeState.update((state) => ({
+				...state,
+				currentMode: initial
+			}));
+			this.applyTheme(initial);
+		}
+		this.destroyRef.onDestroy(() => this.stopFollowingSystem());
+	}
+	setTheme(mode) {
+		this.stopFollowingSystem();
+		if (this.cssFollowsSystem) {
+			this.cssFollowsSystem = false;
+			if (this.isBrowser) document.documentElement.classList.remove(ThemeService.SYSTEM_CLASS);
+		}
+		this.applyMode(mode);
+		this.persist(mode);
+	}
+	toggleTheme() {
+		this.setTheme(this.themeState().currentMode === "dark" ? "light" : "dark");
+	}
+	useSystemPreference() {
+		if (!this.isBrowser) return;
+		this.stopFollowingSystem();
+		this.cssFollowsSystem = this.rootFollowsSystem();
+		const query = window.matchMedia?.("(prefers-color-scheme: dark)") ?? null;
+		const prefersDark = query?.matches ?? true;
+		this.themeState.update((state) => ({
+			...state,
+			prefersDark
+		}));
+		this.applyMode(prefersDark ? "dark" : "light");
+		if (query) {
+			this.systemQuery = query;
+			query.addEventListener("change", this.systemChangeHandler);
+		}
+	}
+	stopFollowingSystem() {
+		this.systemQuery?.removeEventListener("change", this.systemChangeHandler);
+		this.systemQuery = null;
+	}
+	applyMode(mode) {
+		this.themeState.update((state) => ({
+			...state,
+			currentMode: mode
+		}));
+		this.applyTheme(mode);
+	}
+	rootFollowsSystem() {
+		if (!this.isBrowser) return false;
+		const root = document.documentElement.classList;
+		return root.contains(ThemeService.SYSTEM_CLASS) && !root.contains("light") && !root.contains("dark");
+	}
+	readInitialMode() {
+		if (!this.isBrowser) return "dark";
+		const root = document.documentElement.classList;
+		if (root.contains("light")) return "light";
+		if (root.contains("dark")) return "dark";
+		return this.readPersisted() ?? "dark";
+	}
+	readPersisted() {
+		try {
+			const value = localStorage.getItem(ThemeService.STORAGE_KEY);
+			return value === "light" || value === "dark" ? value : null;
+		} catch {
+			return null;
+		}
+	}
+	persist(mode) {
+		if (!this.isBrowser) return;
+		try {
+			localStorage.setItem(ThemeService.STORAGE_KEY, mode);
+		} catch {}
+	}
+	applyTheme(mode) {
+		if (!this.isBrowser) return;
+		if (!this.cssFollowsSystem) {
+			const root = document.documentElement;
+			root.classList.toggle("dark", mode === "dark");
+			root.classList.toggle("light", mode === "light");
+		}
+		const metaThemeColor = document.querySelector("meta[name=\"theme-color\"]");
+		if (metaThemeColor) metaThemeColor.setAttribute("content", ThemeService.META_COLOR[mode]);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: ThemeService,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: ThemeService,
+		providedIn: "root"
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ThemeService,
+	decorators: [{
+		type: Injectable,
+		args: [{ providedIn: "root" }]
+	}],
+	ctorParameters: () => []
+});
+export { ThemeService };
+
+//# sourceMappingURL=lifecorner-angular-ui-kit-theme.mjs.map

package/fesm2022/lifecorner-angular-ui-kit-theme.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"lifecorner-angular-ui-kit-theme.mjs","names":[],"sources":["../../../../libs/angular-ui-kit/src/lib/theme/theme.service.ts"],"sourcesContent":["import { Injectable, signal, computed, PLATFORM_ID, inject, DestroyRef } from '@angular/core';\nimport { isPlatformBrowser } from '@angular/common';\nimport type { ThemeMode, ThemeState } from './theme.types';\n\n/**\n * Theme Service\n *\n * Design System 2.0 is dark-first: dark is the default theme. Light remains a\n * fully supported opt-in. Theme is applied via a `dark` / `light` class on the\n * document root (`:root.dark` / `:root.light`), matching the theme stylesheets.\n *\n * On construction the service adopts a theme that is already there instead of\n * overwriting it: a `dark` / `light` class an app put on `<html>` before\n * bootstrap (the usual no-flash inline script) wins, then the mode persisted\n * under {@link ThemeService.STORAGE_KEY} from a previous visit, then the\n * dark-first default. `setTheme` persists the choice; `useSystemPreference`\n * follows the OS setting live until the next explicit `setTheme`.\n *\n * Following the OS without a script (3.3, G-6): with `<html class=\"system\">`\n * the stylesheets themselves switch with `prefers-color-scheme`, from the\n * first paint on. The service then only mirrors the OS (`currentTheme`,\n * `isDark`, the meta theme-color) and adds no `light` / `dark` class, until an\n * explicit `setTheme` replaces `system` with the chosen class.\n */\n@Injectable({\n  providedIn: 'root',\n})\nexport class ThemeService {\n  /** localStorage key under which the chosen mode is persisted. */\n  public static readonly STORAGE_KEY = 'lc-theme';\n\n  /** Root class that lets the stylesheets follow the OS color scheme (G-6). */\n  public static readonly SYSTEM_CLASS = 'system';\n\n  private readonly platformId = inject(PLATFORM_ID);\n  private readonly isBrowser = isPlatformBrowser(this.platformId);\n  private readonly destroyRef = inject(DestroyRef);\n\n  // Meta theme-color values for mobile browser chrome — the app background of\n  // each palette (`--color-background`), so the chrome continues the page.\n  private static readonly META_COLOR: Record<ThemeMode, string> = {\n    dark: '#0a121b',\n    light: '#ffffff',\n  };\n\n  // Reactive theme state using Angular signals. Dark by default (DS 2.0).\n  private readonly themeState = signal<ThemeState>({\n    currentMode: 'dark',\n    prefersDark: true,\n  });\n\n  // Public readonly signals (declared after themeState due to initialization dependency)\n  public readonly currentTheme = this.themeState.asReadonly();\n  public readonly isDark = computed(() => this.themeState().currentMode === 'dark');\n\n  /** OS color-scheme query while `useSystemPreference()` is following it. */\n  private systemQuery: MediaQueryList | null = null;\n  /**\n   * True while the root carries the `system` class: the CSS follows the OS,\n   * so the service mirrors it and leaves the root classes alone.\n   */\n  private cssFollowsSystem = false;\n  private readonly systemChangeHandler = (event: MediaQueryListEvent): void => {\n    this.themeState.update((state) => ({ ...state, prefersDark: event.matches }));\n    this.applyMode(event.matches ? 'dark' : 'light');\n  };\n\n  constructor() {\n    if (this.rootFollowsSystem()) {\n      this.useSystemPreference();\n    } else {\n      const initial = this.readInitialMode();\n      this.themeState.update((state) => ({ ...state, currentMode: initial }));\n      // Applying is idempotent for a class that is already on the root (the\n      // pre-bootstrap case) and additionally syncs the meta theme-color.\n      this.applyTheme(initial);\n    }\n    this.destroyRef.onDestroy(() => this.stopFollowingSystem());\n  }\n\n  /**\n   * Set the active theme mode. Persists the choice and stops following the\n   * OS preference (an explicit choice must not be overridden by the next OS\n   * change).\n   */\n  public setTheme(mode: ThemeMode): void {\n    this.stopFollowingSystem();\n    if (this.cssFollowsSystem) {\n      this.cssFollowsSystem = false;\n      if (this.isBrowser) {\n        document.documentElement.classList.remove(ThemeService.SYSTEM_CLASS);\n      }\n    }\n    this.applyMode(mode);\n    this.persist(mode);\n  }\n\n  /**\n   * Toggle between dark and light.\n   */\n  public toggleTheme(): void {\n    this.setTheme(this.themeState().currentMode === 'dark' ? 'light' : 'dark');\n  }\n\n  /**\n   * Adopt the OS-level color-scheme preference and keep following it: a later\n   * change of the OS setting switches the theme too, until `setTheme` is called.\n   * Under a `system` root class the stylesheets already follow the OS; the\n   * service then only mirrors it and sets no `light` / `dark` class.\n   */\n  public useSystemPreference(): void {\n    if (!this.isBrowser) {\n      return;\n    }\n    this.stopFollowingSystem();\n    this.cssFollowsSystem = this.rootFollowsSystem();\n    const query = window.matchMedia?.('(prefers-color-scheme: dark)') ?? null;\n    const prefersDark = query?.matches ?? true;\n    this.themeState.update((state) => ({ ...state, prefersDark }));\n    this.applyMode(prefersDark ? 'dark' : 'light');\n    if (query) {\n      this.systemQuery = query;\n      query.addEventListener('change', this.systemChangeHandler);\n    }\n  }\n\n  private stopFollowingSystem(): void {\n    this.systemQuery?.removeEventListener('change', this.systemChangeHandler);\n    this.systemQuery = null;\n  }\n\n  /** Update state + DOM without touching persistence or the system listener. */\n  private applyMode(mode: ThemeMode): void {\n    this.themeState.update((state) => ({ ...state, currentMode: mode }));\n    this.applyTheme(mode);\n  }\n\n  /** The root asks the CSS to follow the OS: `system` without `light` / `dark`. */\n  private rootFollowsSystem(): boolean {\n    if (!this.isBrowser) {\n      return false;\n    }\n    const root = document.documentElement.classList;\n    return root.contains(ThemeService.SYSTEM_CLASS) && !root.contains('light') && !root.contains('dark');\n  }\n\n  /**\n   * Mode to start with: a class already on the root, then the persisted\n   * choice, then the dark-first default.\n   */\n  private readInitialMode(): ThemeMode {\n    if (!this.isBrowser) {\n      return 'dark';\n    }\n    const root = document.documentElement.classList;\n    if (root.contains('light')) return 'light';\n    if (root.contains('dark')) return 'dark';\n    const persisted = this.readPersisted();\n    return persisted ?? 'dark';\n  }\n\n  private readPersisted(): ThemeMode | null {\n    try {\n      const value = localStorage.getItem(ThemeService.STORAGE_KEY);\n      return value === 'light' || value === 'dark' ? value : null;\n    } catch {\n      // Storage unavailable (privacy mode, sandboxed iframe, SSR): no persistence.\n      return null;\n    }\n  }\n\n  private persist(mode: ThemeMode): void {\n    if (!this.isBrowser) {\n      return;\n    }\n    try {\n      localStorage.setItem(ThemeService.STORAGE_KEY, mode);\n    } catch {\n      // Storage unavailable or full — the in-memory theme still works.\n    }\n  }\n\n  /**\n   * Apply the theme class + mobile meta color to the document.\n   */\n  private applyTheme(mode: ThemeMode): void {\n    if (!this.isBrowser) {\n      return;\n    }\n\n    // Under `system` the stylesheets follow the OS; a class would pin it.\n    if (!this.cssFollowsSystem) {\n      const root = document.documentElement;\n      root.classList.toggle('dark', mode === 'dark');\n      root.classList.toggle('light', mode === 'light');\n    }\n\n    // Update meta theme-color for mobile browsers\n    const metaThemeColor = document.querySelector('meta[name=\"theme-color\"]');\n    if (metaThemeColor) {\n      metaThemeColor.setAttribute('content', ThemeService.META_COLOR[mode]);\n    }\n  }\n}\n"],"mappings":"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"}