@lifecorner/angular-ui-kit 3.4.0 → 3.5.0

package/fesm2022/lifecorner-angular-ui-kit-tag-input.mjs

@@ -0,0 +1,380 @@
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, computed, forwardRef, input, output, signal, viewChild } from "@angular/core";
+import { NG_VALUE_ACCESSOR } from "@angular/forms";
+var TagInputComponent = class TagInputComponent {
+	static nextId = 0;
+	placeholder = input("Add tag…", ...ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []);
+	maxTags = input(Infinity, ...ngDevMode ? [{ debugName: "maxTags" }] : /* istanbul ignore next */ []);
+	allowDuplicates = input(false, ...ngDevMode ? [{ debugName: "allowDuplicates" }] : /* istanbul ignore next */ []);
+	removable = input(true, ...ngDevMode ? [{ debugName: "removable" }] : /* istanbul ignore next */ []);
+	disabled = input(false, ...ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []);
+	separator = input("both", ...ngDevMode ? [{ debugName: "separator" }] : /* istanbul ignore next */ []);
+	suggestions = input([], ...ngDevMode ? [{ debugName: "suggestions" }] : /* istanbul ignore next */ []);
+	label = input("", ...ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []);
+	maxTagsReachedLabel = input("Maximum of {max} tags reached", ...ngDevMode ? [{ debugName: "maxTagsReachedLabel" }] : /* istanbul ignore next */ []);
+	removeTagAriaLabel = input("Remove", ...ngDevMode ? [{ debugName: "removeTagAriaLabel" }] : /* istanbul ignore next */ []);
+	suggestionsAriaLabel = input("Suggestions", ...ngDevMode ? [{ debugName: "suggestionsAriaLabel" }] : /* istanbul ignore next */ []);
+	tagAdded = output();
+	tagRemoved = output();
+	inputId = `lc-tag-input-${++TagInputComponent.nextId}`;
+	listboxId = `${this.inputId}-listbox`;
+	tags = signal([], ...ngDevMode ? [{ debugName: "tags" }] : /* istanbul ignore next */ []);
+	inputValue = signal("", ...ngDevMode ? [{ debugName: "inputValue" }] : /* istanbul ignore next */ []);
+	focused = signal(false, ...ngDevMode ? [{ debugName: "focused" }] : /* istanbul ignore next */ []);
+	activeIndex = signal(-1, ...ngDevMode ? [{ debugName: "activeIndex" }] : /* istanbul ignore next */ []);
+	suggestionsDismissed = signal(false, ...ngDevMode ? [{ debugName: "suggestionsDismissed" }] : /* istanbul ignore next */ []);
+	formDisabled = signal(false, ...ngDevMode ? [{ debugName: "formDisabled" }] : /* istanbul ignore next */ []);
+	isDisabled = computed(() => this.disabled() || this.formDisabled(), ...ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []);
+	inputEl = viewChild("inputEl", ...ngDevMode ? [{ debugName: "inputEl" }] : /* istanbul ignore next */ []);
+	filteredSuggestions = computed(() => {
+		const val = this.inputValue().toLowerCase().trim();
+		if (!val) return [];
+		return this.suggestions().filter((s) => s.toLowerCase().includes(val) && (this.allowDuplicates() || !this.tags().includes(s)));
+	}, ...ngDevMode ? [{ debugName: "filteredSuggestions" }] : /* istanbul ignore next */ []);
+	hasSuggestions = computed(() => this.suggestions().length > 0, ...ngDevMode ? [{ debugName: "hasSuggestions" }] : /* istanbul ignore next */ []);
+	showSuggestions = computed(() => this.focused() && !this.suggestionsDismissed() && this.filteredSuggestions().length > 0, ...ngDevMode ? [{ debugName: "showSuggestions" }] : /* istanbul ignore next */ []);
+	canAdd = computed(() => this.tags().length < this.maxTags(), ...ngDevMode ? [{ debugName: "canAdd" }] : /* istanbul ignore next */ []);
+	inputPlaceholder = computed(() => {
+		if (!this.canAdd()) return this.maxTagsReachedLabel().replace("{max}", String(this.maxTags()));
+		return this.tags().length ? "" : this.placeholder();
+	}, ...ngDevMode ? [{ debugName: "inputPlaceholder" }] : /* istanbul ignore next */ []);
+	onChange = () => {};
+	onTouched = () => {};
+	writeValue(value) {
+		this.tags.set(value ?? []);
+	}
+	registerOnChange(fn) {
+		this.onChange = fn;
+	}
+	registerOnTouched(fn) {
+		this.onTouched = fn;
+	}
+	setDisabledState(isDisabled) {
+		this.formDisabled.set(isDisabled);
+	}
+	optionId(index) {
+		return `${this.listboxId}-option-${index}`;
+	}
+	addTag(value) {
+		const tag = value.trim();
+		if (!tag || !this.canAdd()) return;
+		if (!this.allowDuplicates() && this.tags().includes(tag)) return;
+		this.tags.update((t) => [...t, tag]);
+		this.inputValue.set("");
+		this.activeIndex.set(-1);
+		this.onChange(this.tags());
+		this.tagAdded.emit(tag);
+	}
+	removeTag(index) {
+		const removed = this.tags()[index];
+		this.tags.update((t) => t.filter((_, i) => i !== index));
+		this.onChange(this.tags());
+		this.tagRemoved.emit(removed);
+	}
+	onKeydown(event) {
+		const sep = this.separator();
+		const val = this.inputValue();
+		const listOpen = this.showSuggestions();
+		switch (event.key) {
+			case "ArrowDown":
+			case "ArrowUp": {
+				const count = this.filteredSuggestions().length;
+				if (!count) return;
+				event.preventDefault();
+				this.suggestionsDismissed.set(false);
+				const delta = event.key === "ArrowDown" ? 1 : -1;
+				const next = (this.activeIndex() + delta + count) % count;
+				this.activeIndex.set(next);
+				document.getElementById(this.optionId(next))?.scrollIntoView?.({ block: "nearest" });
+				return;
+			}
+			case "Escape":
+				if (listOpen) {
+					event.preventDefault();
+					this.suggestionsDismissed.set(true);
+					this.activeIndex.set(-1);
+				}
+				return;
+			case "Enter":
+				if (listOpen && this.activeIndex() >= 0) {
+					event.preventDefault();
+					this.addTag(this.filteredSuggestions()[this.activeIndex()]);
+				} else if (sep === "enter" || sep === "both") {
+					event.preventDefault();
+					this.addTag(val);
+				}
+				return;
+			case ",":
+				if (sep === "comma" || sep === "both") {
+					event.preventDefault();
+					this.addTag(val);
+				}
+				return;
+			case "Backspace":
+				if (!val && this.removable() && this.tags().length > 0) this.removeTag(this.tags().length - 1);
+				return;
+		}
+	}
+	onInput(event) {
+		this.inputValue.set(event.target.value);
+		this.activeIndex.set(-1);
+		this.suggestionsDismissed.set(false);
+	}
+	onFocus() {
+		this.focused.set(true);
+	}
+	onBlur() {
+		this.focused.set(false);
+		this.activeIndex.set(-1);
+		this.onTouched();
+		const val = this.inputValue();
+		if (val.trim()) this.addTag(val);
+	}
+	selectSuggestion(value) {
+		this.addTag(value);
+		this.inputEl()?.nativeElement.focus();
+	}
+	focusInput() {
+		this.inputEl()?.nativeElement.focus();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: TagInputComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.2",
+		type: TagInputComponent,
+		isStandalone: true,
+		selector: "lc-tag-input",
+		inputs: {
+			placeholder: {
+				classPropertyName: "placeholder",
+				publicName: "placeholder",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			maxTags: {
+				classPropertyName: "maxTags",
+				publicName: "maxTags",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			allowDuplicates: {
+				classPropertyName: "allowDuplicates",
+				publicName: "allowDuplicates",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			removable: {
+				classPropertyName: "removable",
+				publicName: "removable",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			disabled: {
+				classPropertyName: "disabled",
+				publicName: "disabled",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			separator: {
+				classPropertyName: "separator",
+				publicName: "separator",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			suggestions: {
+				classPropertyName: "suggestions",
+				publicName: "suggestions",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			label: {
+				classPropertyName: "label",
+				publicName: "label",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			maxTagsReachedLabel: {
+				classPropertyName: "maxTagsReachedLabel",
+				publicName: "maxTagsReachedLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			removeTagAriaLabel: {
+				classPropertyName: "removeTagAriaLabel",
+				publicName: "removeTagAriaLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			suggestionsAriaLabel: {
+				classPropertyName: "suggestionsAriaLabel",
+				publicName: "suggestionsAriaLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: {
+			tagAdded: "tagAdded",
+			tagRemoved: "tagRemoved"
+		},
+		providers: [{
+			provide: NG_VALUE_ACCESSOR,
+			useExisting: forwardRef(() => TagInputComponent),
+			multi: true
+		}],
+		viewQueries: [{
+			propertyName: "inputEl",
+			first: true,
+			predicate: ["inputEl"],
+			descendants: true,
+			isSignal: true
+		}],
+		ngImport: i0,
+		template: "@if (label()) {\n  <label class=\"lc-tag-input__label\" [for]=\"inputId\">{{ label() }}</label>\n}\n\n<!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -- container click only forwards focus to the input, which is focusable itself -->\n<div\n  class=\"lc-tag-input__container\"\n  [class.lc-tag-input__container--focused]=\"focused()\"\n  [class.lc-tag-input__container--disabled]=\"isDisabled()\"\n  (click)=\"focusInput()\"\n>\n  @for (tag of tags(); track $index) {\n    <span class=\"lc-tag-input__tag\">\n      <span class=\"lc-tag-input__tag-text\">{{ tag }}</span>\n      @if (removable() && !isDisabled()) {\n        <button\n          type=\"button\"\n          class=\"lc-tag-input__tag-remove\"\n          (click)=\"removeTag($index); $event.stopPropagation()\"\n          [attr.aria-label]=\"removeTagAriaLabel() + ' ' + tag\"\n        >×</button>\n      }\n    </span>\n  }\n\n  <input\n    #inputEl\n    type=\"text\"\n    [id]=\"inputId\"\n    class=\"lc-tag-input__input\"\n    [attr.role]=\"hasSuggestions() ? 'combobox' : null\"\n    [attr.aria-autocomplete]=\"hasSuggestions() ? 'list' : null\"\n    [attr.aria-expanded]=\"hasSuggestions() ? showSuggestions() : null\"\n    [attr.aria-controls]=\"showSuggestions() ? listboxId : null\"\n    [attr.aria-activedescendant]=\"showSuggestions() && activeIndex() >= 0 ? optionId(activeIndex()) : null\"\n    [placeholder]=\"inputPlaceholder()\"\n    [value]=\"inputValue()\"\n    [disabled]=\"isDisabled()\"\n    [readonly]=\"!canAdd()\"\n    [attr.aria-readonly]=\"!canAdd() ? true : null\"\n    (input)=\"onInput($event)\"\n    (keydown)=\"onKeydown($event)\"\n    (focus)=\"onFocus()\"\n    (blur)=\"onBlur()\"\n  />\n</div>\n\n@if (showSuggestions()) {\n  <ul class=\"lc-tag-input__suggestions\" role=\"listbox\" [id]=\"listboxId\" [attr.aria-label]=\"label() || suggestionsAriaLabel()\">\n    @for (sug of filteredSuggestions(); track sug; let i = $index) {\n      <li\n        class=\"lc-tag-input__suggestion\"\n        [class.lc-tag-input__suggestion--active]=\"i === activeIndex()\"\n        role=\"option\"\n        [id]=\"optionId(i)\"\n        [attr.aria-selected]=\"i === activeIndex()\"\n        (mouseenter)=\"activeIndex.set(i)\"\n        (mousedown)=\"selectSuggestion(sug); $event.preventDefault()\"\n      >{{ sug }}</li>\n    }\n  </ul>\n}\n",
+		styles: [":host{display:block;position:relative}.lc-tag-input__label{display:block;margin-bottom:4px;font-size:var(--typography-font-size-sm, .875rem);font-weight:500;color:var(--color-text-secondary)}.lc-tag-input__container{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:6px 8px;min-height:40px;border:1px solid var(--color-field-border);border-radius:var(--border-radius-md);background:var(--color-surface-2);cursor:text;transition:border-color .15s,box-shadow .15s}.lc-tag-input__container:hover{border-color:var(--color-text-secondary)}.lc-tag-input__container--focused{border-color:var(--color-primary-500);box-shadow:0 0 0 2px #20849740}.lc-tag-input__container--disabled{opacity:.6;background:var(--color-surface-muted);cursor:default}.lc-tag-input__tag{display:inline-flex;align-items:center;gap:2px;padding:2px 8px;border-radius:var(--border-radius-full);background:#20849729;border:1px solid var(--color-border-strong);color:var(--color-primary-500);font-size:var(--typography-font-size-sm, .875rem);line-height:1.4;-webkit-user-select:none;user-select:none}.lc-tag-input__tag-text{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lc-tag-input__tag-remove{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border:none;border-radius:50%;background:transparent;color:currentColor;cursor:pointer;font-size:14px;line-height:1;padding:0;opacity:.7;transition:opacity .1s,background .1s}.lc-tag-input__tag-remove:hover{opacity:1;background:#20849733}.lc-tag-input__input{flex:1;min-width:60px;border:none;outline:none;background:transparent;font-size:var(--typography-font-size-sm, .875rem);color:var(--color-text-primary);padding:2px 0}.lc-tag-input__input::placeholder{color:var(--color-text-tertiary)}.lc-tag-input__input:read-only{cursor:default}.lc-tag-input__suggestions{position:absolute;z-index:50;top:100%;left:0;right:0;margin:4px 0 0;padding:4px 0;list-style:none;border:1px solid var(--color-border-strong);border-radius:var(--border-radius-md);background-color:var(--color-surface);background-image:var(--gradient-surface);box-shadow:var(--elevation-4);max-height:180px;overflow-y:auto}.lc-tag-input__suggestion{padding:6px 12px;font-size:var(--typography-font-size-sm, .875rem);cursor:pointer;color:var(--color-text-secondary)}.lc-tag-input__suggestion:hover,.lc-tag-input__suggestion--active{background:var(--color-surface-hover);color:var(--color-text-primary)}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: TagInputComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "lc-tag-input",
+			standalone: true,
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			providers: [{
+				provide: NG_VALUE_ACCESSOR,
+				useExisting: forwardRef(() => TagInputComponent),
+				multi: true
+			}],
+			template: "@if (label()) {\n  <label class=\"lc-tag-input__label\" [for]=\"inputId\">{{ label() }}</label>\n}\n\n<!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -- container click only forwards focus to the input, which is focusable itself -->\n<div\n  class=\"lc-tag-input__container\"\n  [class.lc-tag-input__container--focused]=\"focused()\"\n  [class.lc-tag-input__container--disabled]=\"isDisabled()\"\n  (click)=\"focusInput()\"\n>\n  @for (tag of tags(); track $index) {\n    <span class=\"lc-tag-input__tag\">\n      <span class=\"lc-tag-input__tag-text\">{{ tag }}</span>\n      @if (removable() && !isDisabled()) {\n        <button\n          type=\"button\"\n          class=\"lc-tag-input__tag-remove\"\n          (click)=\"removeTag($index); $event.stopPropagation()\"\n          [attr.aria-label]=\"removeTagAriaLabel() + ' ' + tag\"\n        >×</button>\n      }\n    </span>\n  }\n\n  <input\n    #inputEl\n    type=\"text\"\n    [id]=\"inputId\"\n    class=\"lc-tag-input__input\"\n    [attr.role]=\"hasSuggestions() ? 'combobox' : null\"\n    [attr.aria-autocomplete]=\"hasSuggestions() ? 'list' : null\"\n    [attr.aria-expanded]=\"hasSuggestions() ? showSuggestions() : null\"\n    [attr.aria-controls]=\"showSuggestions() ? listboxId : null\"\n    [attr.aria-activedescendant]=\"showSuggestions() && activeIndex() >= 0 ? optionId(activeIndex()) : null\"\n    [placeholder]=\"inputPlaceholder()\"\n    [value]=\"inputValue()\"\n    [disabled]=\"isDisabled()\"\n    [readonly]=\"!canAdd()\"\n    [attr.aria-readonly]=\"!canAdd() ? true : null\"\n    (input)=\"onInput($event)\"\n    (keydown)=\"onKeydown($event)\"\n    (focus)=\"onFocus()\"\n    (blur)=\"onBlur()\"\n  />\n</div>\n\n@if (showSuggestions()) {\n  <ul class=\"lc-tag-input__suggestions\" role=\"listbox\" [id]=\"listboxId\" [attr.aria-label]=\"label() || suggestionsAriaLabel()\">\n    @for (sug of filteredSuggestions(); track sug; let i = $index) {\n      <li\n        class=\"lc-tag-input__suggestion\"\n        [class.lc-tag-input__suggestion--active]=\"i === activeIndex()\"\n        role=\"option\"\n        [id]=\"optionId(i)\"\n        [attr.aria-selected]=\"i === activeIndex()\"\n        (mouseenter)=\"activeIndex.set(i)\"\n        (mousedown)=\"selectSuggestion(sug); $event.preventDefault()\"\n      >{{ sug }}</li>\n    }\n  </ul>\n}\n",
+			styles: [":host{display:block;position:relative}.lc-tag-input__label{display:block;margin-bottom:4px;font-size:var(--typography-font-size-sm, .875rem);font-weight:500;color:var(--color-text-secondary)}.lc-tag-input__container{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:6px 8px;min-height:40px;border:1px solid var(--color-field-border);border-radius:var(--border-radius-md);background:var(--color-surface-2);cursor:text;transition:border-color .15s,box-shadow .15s}.lc-tag-input__container:hover{border-color:var(--color-text-secondary)}.lc-tag-input__container--focused{border-color:var(--color-primary-500);box-shadow:0 0 0 2px #20849740}.lc-tag-input__container--disabled{opacity:.6;background:var(--color-surface-muted);cursor:default}.lc-tag-input__tag{display:inline-flex;align-items:center;gap:2px;padding:2px 8px;border-radius:var(--border-radius-full);background:#20849729;border:1px solid var(--color-border-strong);color:var(--color-primary-500);font-size:var(--typography-font-size-sm, .875rem);line-height:1.4;-webkit-user-select:none;user-select:none}.lc-tag-input__tag-text{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lc-tag-input__tag-remove{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border:none;border-radius:50%;background:transparent;color:currentColor;cursor:pointer;font-size:14px;line-height:1;padding:0;opacity:.7;transition:opacity .1s,background .1s}.lc-tag-input__tag-remove:hover{opacity:1;background:#20849733}.lc-tag-input__input{flex:1;min-width:60px;border:none;outline:none;background:transparent;font-size:var(--typography-font-size-sm, .875rem);color:var(--color-text-primary);padding:2px 0}.lc-tag-input__input::placeholder{color:var(--color-text-tertiary)}.lc-tag-input__input:read-only{cursor:default}.lc-tag-input__suggestions{position:absolute;z-index:50;top:100%;left:0;right:0;margin:4px 0 0;padding:4px 0;list-style:none;border:1px solid var(--color-border-strong);border-radius:var(--border-radius-md);background-color:var(--color-surface);background-image:var(--gradient-surface);box-shadow:var(--elevation-4);max-height:180px;overflow-y:auto}.lc-tag-input__suggestion{padding:6px 12px;font-size:var(--typography-font-size-sm, .875rem);cursor:pointer;color:var(--color-text-secondary)}.lc-tag-input__suggestion:hover,.lc-tag-input__suggestion--active{background:var(--color-surface-hover);color:var(--color-text-primary)}\n"]
+		}]
+	}],
+	propDecorators: {
+		placeholder: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "placeholder",
+				required: false
+			}]
+		}],
+		maxTags: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "maxTags",
+				required: false
+			}]
+		}],
+		allowDuplicates: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "allowDuplicates",
+				required: false
+			}]
+		}],
+		removable: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "removable",
+				required: false
+			}]
+		}],
+		disabled: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disabled",
+				required: false
+			}]
+		}],
+		separator: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "separator",
+				required: false
+			}]
+		}],
+		suggestions: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "suggestions",
+				required: false
+			}]
+		}],
+		label: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "label",
+				required: false
+			}]
+		}],
+		maxTagsReachedLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "maxTagsReachedLabel",
+				required: false
+			}]
+		}],
+		removeTagAriaLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "removeTagAriaLabel",
+				required: false
+			}]
+		}],
+		suggestionsAriaLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "suggestionsAriaLabel",
+				required: false
+			}]
+		}],
+		tagAdded: [{
+			type: i0.Output,
+			args: ["tagAdded"]
+		}],
+		tagRemoved: [{
+			type: i0.Output,
+			args: ["tagRemoved"]
+		}],
+		inputEl: [{
+			type: i0.ViewChild,
+			args: ["inputEl", { isSignal: true }]
+		}]
+	}
+});
+export { TagInputComponent };
+
+//# sourceMappingURL=lifecorner-angular-ui-kit-tag-input.mjs.map

package/fesm2022/lifecorner-angular-ui-kit-tag-input.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"lifecorner-angular-ui-kit-tag-input.mjs","names":[],"sources":["../../../../libs/angular-ui-kit/src/lib/tag-input/tag-input.component.ts","../../../../libs/angular-ui-kit/src/lib/tag-input/tag-input.component.html"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  input,\n  signal,\n  computed,\n  output,\n  forwardRef,\n  ElementRef,\n  viewChild,\n} from '@angular/core';\nimport { NG_VALUE_ACCESSOR, ControlValueAccessor } from '@angular/forms';\n\n@Component({\n  selector: 'lc-tag-input',\n  standalone: true,\n  templateUrl: './tag-input.component.html',\n  styleUrls: ['./tag-input.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => TagInputComponent),\n      multi: true,\n    },\n  ],\n})\nexport class TagInputComponent implements ControlValueAccessor {\n  private static nextId = 0;\n\n  readonly placeholder = input('Add tag…');\n  readonly maxTags = input(Infinity);\n  readonly allowDuplicates = input(false);\n  readonly removable = input(true);\n  readonly disabled = input(false);\n  readonly separator = input<'enter' | 'comma' | 'both'>('both');\n  readonly suggestions = input<string[]>([]);\n  readonly label = input('');\n\n  /** Placeholder once `maxTags` is reached; `{max}` is replaced by the limit. */\n  readonly maxTagsReachedLabel = input('Maximum of {max} tags reached');\n\n  /** Accessible name prefix of a tag's remove button, followed by the tag. */\n  readonly removeTagAriaLabel = input('Remove');\n\n  /** Accessible name of the suggestion list when no `label` is set. */\n  readonly suggestionsAriaLabel = input('Suggestions');\n\n  readonly tagAdded = output<string>();\n  readonly tagRemoved = output<string>();\n\n  /** Per-instance id wiring the label, the suggestion listbox and its options to the input. */\n  readonly inputId = `lc-tag-input-${++TagInputComponent.nextId}`;\n  protected readonly listboxId = `${this.inputId}-listbox`;\n\n  protected tags = signal<string[]>([]);\n  protected inputValue = signal('');\n  protected focused = signal(false);\n\n  /** Index of the keyboard-highlighted suggestion; -1 = none. */\n  protected activeIndex = signal(-1);\n\n  /** Set by Escape; hides the list until the text changes again. */\n  private readonly suggestionsDismissed = signal(false);\n\n  /** Disabled through the form control (`setDisabledState`), as opposed to the input. */\n  private readonly formDisabled = signal(false);\n\n  /** Disabled by either route — the one flag the template consults. */\n  protected readonly isDisabled = computed(() => this.disabled() || this.formDisabled());\n\n  protected readonly inputEl = viewChild<ElementRef<HTMLInputElement>>('inputEl');\n\n  protected readonly filteredSuggestions = computed(() => {\n    const val = this.inputValue().toLowerCase().trim();\n    if (!val) return [];\n    return this.suggestions().filter(\n      s => s.toLowerCase().includes(val) && (this.allowDuplicates() || !this.tags().includes(s))\n    );\n  });\n\n  /** Combobox semantics only make sense when there is a list to open. */\n  protected readonly hasSuggestions = computed(() => this.suggestions().length > 0);\n\n  protected readonly showSuggestions = computed(\n    () => this.focused() && !this.suggestionsDismissed() && this.filteredSuggestions().length > 0\n  );\n\n  protected readonly canAdd = computed(() => this.tags().length < this.maxTags());\n\n  /**\n   * The input stays mounted when the limit is reached (removing it would drop\n   * focus to `<body>`); it becomes read-only and says why.\n   */\n  protected readonly inputPlaceholder = computed(() => {\n    if (!this.canAdd()) return this.maxTagsReachedLabel().replace('{max}', String(this.maxTags()));\n    return this.tags().length ? '' : this.placeholder();\n  });\n\n  // eslint-disable-next-line @typescript-eslint/no-empty-function\n  private onChange: (val: string[]) => void = () => {};\n  // eslint-disable-next-line @typescript-eslint/no-empty-function\n  private onTouched: () => void = () => {};\n\n  writeValue(value: string[] | null): void {\n    this.tags.set(value ?? []);\n  }\n\n  registerOnChange(fn: (val: 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  protected optionId(index: number): string {\n    return `${this.listboxId}-option-${index}`;\n  }\n\n  protected addTag(value: string): void {\n    const tag = value.trim();\n    if (!tag || !this.canAdd()) return;\n    if (!this.allowDuplicates() && this.tags().includes(tag)) return;\n\n    this.tags.update(t => [...t, tag]);\n    this.inputValue.set('');\n    this.activeIndex.set(-1);\n    this.onChange(this.tags());\n    this.tagAdded.emit(tag);\n  }\n\n  protected removeTag(index: number): void {\n    const removed = this.tags()[index];\n    this.tags.update(t => t.filter((_, i) => i !== index));\n    this.onChange(this.tags());\n    this.tagRemoved.emit(removed);\n  }\n\n  protected onKeydown(event: KeyboardEvent): void {\n    const sep = this.separator();\n    const val = this.inputValue();\n    const listOpen = this.showSuggestions();\n\n    switch (event.key) {\n      case 'ArrowDown':\n      case 'ArrowUp': {\n        const count = this.filteredSuggestions().length;\n        if (!count) return;\n        event.preventDefault();\n        this.suggestionsDismissed.set(false);\n        const delta = event.key === 'ArrowDown' ? 1 : -1;\n        const next = (this.activeIndex() + delta + count) % count;\n        this.activeIndex.set(next);\n        document.getElementById(this.optionId(next))?.scrollIntoView?.({ block: 'nearest' });\n        return;\n      }\n      case 'Escape':\n        if (listOpen) {\n          event.preventDefault();\n          this.suggestionsDismissed.set(true);\n          this.activeIndex.set(-1);\n        }\n        return;\n      case 'Enter':\n        if (listOpen && this.activeIndex() >= 0) {\n          event.preventDefault();\n          this.addTag(this.filteredSuggestions()[this.activeIndex()]);\n        } else if (sep === 'enter' || sep === 'both') {\n          event.preventDefault();\n          this.addTag(val);\n        }\n        return;\n      case ',':\n        if (sep === 'comma' || sep === 'both') {\n          event.preventDefault();\n          this.addTag(val);\n        }\n        return;\n      case 'Backspace':\n        if (!val && this.removable() && this.tags().length > 0) {\n          this.removeTag(this.tags().length - 1);\n        }\n        return;\n    }\n  }\n\n  protected onInput(event: Event): void {\n    this.inputValue.set((event.target as HTMLInputElement).value);\n    this.activeIndex.set(-1);\n    this.suggestionsDismissed.set(false);\n  }\n\n  protected onFocus(): void {\n    this.focused.set(true);\n  }\n\n  protected onBlur(): void {\n    this.focused.set(false);\n    this.activeIndex.set(-1);\n    this.onTouched();\n    const val = this.inputValue();\n    if (val.trim()) this.addTag(val);\n  }\n\n  protected selectSuggestion(value: string): void {\n    this.addTag(value);\n    this.inputEl()?.nativeElement.focus();\n  }\n\n  protected focusInput(): void {\n    this.inputEl()?.nativeElement.focus();\n  }\n}\n","@if (label()) {\n  <label class=\"lc-tag-input__label\" [for]=\"inputId\">{{ label() }}</label>\n}\n\n<!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -- container click only forwards focus to the input, which is focusable itself -->\n<div\n  class=\"lc-tag-input__container\"\n  [class.lc-tag-input__container--focused]=\"focused()\"\n  [class.lc-tag-input__container--disabled]=\"isDisabled()\"\n  (click)=\"focusInput()\"\n>\n  @for (tag of tags(); track $index) {\n    <span class=\"lc-tag-input__tag\">\n      <span class=\"lc-tag-input__tag-text\">{{ tag }}</span>\n      @if (removable() && !isDisabled()) {\n        <button\n          type=\"button\"\n          class=\"lc-tag-input__tag-remove\"\n          (click)=\"removeTag($index); $event.stopPropagation()\"\n          [attr.aria-label]=\"removeTagAriaLabel() + ' ' + tag\"\n        >×</button>\n      }\n    </span>\n  }\n\n  <input\n    #inputEl\n    type=\"text\"\n    [id]=\"inputId\"\n    class=\"lc-tag-input__input\"\n    [attr.role]=\"hasSuggestions() ? 'combobox' : null\"\n    [attr.aria-autocomplete]=\"hasSuggestions() ? 'list' : null\"\n    [attr.aria-expanded]=\"hasSuggestions() ? showSuggestions() : null\"\n    [attr.aria-controls]=\"showSuggestions() ? listboxId : null\"\n    [attr.aria-activedescendant]=\"showSuggestions() && activeIndex() >= 0 ? optionId(activeIndex()) : null\"\n    [placeholder]=\"inputPlaceholder()\"\n    [value]=\"inputValue()\"\n    [disabled]=\"isDisabled()\"\n    [readonly]=\"!canAdd()\"\n    [attr.aria-readonly]=\"!canAdd() ? true : null\"\n    (input)=\"onInput($event)\"\n    (keydown)=\"onKeydown($event)\"\n    (focus)=\"onFocus()\"\n    (blur)=\"onBlur()\"\n  />\n</div>\n\n@if (showSuggestions()) {\n  <ul class=\"lc-tag-input__suggestions\" role=\"listbox\" [id]=\"listboxId\" [attr.aria-label]=\"label() || suggestionsAriaLabel()\">\n    @for (sug of filteredSuggestions(); track sug; let i = $index) {\n      <li\n        class=\"lc-tag-input__suggestion\"\n        [class.lc-tag-input__suggestion--active]=\"i === activeIndex()\"\n        role=\"option\"\n        [id]=\"optionId(i)\"\n        [attr.aria-selected]=\"i === activeIndex()\"\n        (mouseenter)=\"activeIndex.set(i)\"\n        (mousedown)=\"selectSuggestion(sug); $event.preventDefault()\"\n      >{{ sug }}</li>\n    }\n  </ul>\n}\n"],"mappings":";;;AA2BA,IAAa,oBAAb,MAAa,kBAAiB;CACpB,OAAO,SAAS;CAEf,cAAc,MAAM,YAAW,GAAA,YAAA,CAAA,EAAA,WAAA,cAAA,CAAA,+BAAA,CAAA,CAAA;CAC/B,UAAU,MAAM,UAAS,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CACzB,kBAAkB,MAAM,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,kBAAA,CAAA,+BAAA,CAAA,CAAA;CAC9B,YAAY,MAAM,MAAK,GAAA,YAAA,CAAA,EAAA,WAAA,YAAA,CAAA,+BAAA,CAAA,CAAA;CACvB,WAAW,MAAM,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;CACvB,YAAY,MAAkC,QAAO,GAAA,YAAA,CAAA,EAAA,WAAA,YAAA,CAAA,+BAAA,CAAA,CAAA;CACrD,cAAc,MAAgB,CAAA,GAAG,GAAA,YAAA,CAAA,EAAA,WAAA,cAAA,CAAA,+BAAA,CAAA,CAAA;CACjC,QAAQ,MAAM,IAAG,GAAA,YAAA,CAAA,EAAA,WAAA,QAAA,CAAA,+BAAA,CAAA,CAAA;CAGjB,sBAAsB,MAAM,iCAAgC,GAAA,YAAA,CAAA,EAAA,WAAA,sBAAA,CAAA,+BAAA,CAAA,CAAA;CAG5D,qBAAqB,MAAM,UAAS,GAAA,YAAA,CAAA,EAAA,WAAA,qBAAA,CAAA,+BAAA,CAAA,CAAA;CAGpC,uBAAuB,MAAM,eAAc,GAAA,YAAA,CAAA,EAAA,WAAA,uBAAA,CAAA,+BAAA,CAAA,CAAA;CAE3C,WAAW,OAAM;CACjB,aAAa,OAAM;CAGnB,UAAU,gBAAgB,EAAE,kBAAkB;CACpC,YAAY,GAAG,KAAK,QAAO;CAEpC,OAAO,OAAiB,CAAA,GAAG,GAAA,YAAA,CAAA,EAAA,WAAA,OAAA,CAAA,+BAAA,CAAA,CAAA;CAC3B,aAAa,OAAO,IAAG,GAAA,YAAA,CAAA,EAAA,WAAA,aAAA,CAAA,+BAAA,CAAA,CAAA;CACvB,UAAU,OAAO,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CAGvB,cAAc,OAAO,IAAG,GAAA,YAAA,CAAA,EAAA,WAAA,cAAA,CAAA,+BAAA,CAAA,CAAA;CAGjB,uBAAuB,OAAO,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,uBAAA,CAAA,+BAAA,CAAA,CAAA;CAGpC,eAAe,OAAO,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,eAAA,CAAA,+BAAA,CAAA,CAAA;CAG1B,aAAa,eAAe,KAAK,SAAQ,KAAM,KAAK,aAAY,GAAG,GAAA,YAAA,CAAA,EAAA,WAAA,aAAA,CAAA,+BAAA,CAAA,CAAA;CAEnE,UAAU,UAAwC,WAAU,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CAE5D,sBAAsB,eAAc;EACrD,MAAM,MAAM,KAAK,WAAU,CAAE,CAAC,YAAW,CAAE,CAAC,KAAI;EAChD,IAAI,CAAC,KAAK,OAAO,CAAA;EACjB,OAAO,KAAK,YAAW,CAAE,CAAC,QACxB,MAAK,EAAE,YAAW,CAAE,CAAC,SAAS,GAAG,MAAM,KAAK,gBAAe,KAAM,CAAC,KAAK,KAAI,CAAE,CAAC,SAAS,CAAC,EAAE;CAE9F,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,sBAAA,CAAA,+BAAA,CAAA,CAAA;CAGiB,iBAAiB,eAAe,KAAK,YAAW,CAAE,CAAC,SAAS,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,iBAAA,CAAA,+BAAA,CAAA,CAAA;CAE9D,kBAAkB,eAC7B,KAAK,QAAO,KAAM,CAAC,KAAK,qBAAoB,KAAM,KAAK,oBAAmB,CAAE,CAAC,SAAS,GAC7F,GAAA,YAAA,CAAA,EAAA,WAAA,kBAAA,CAAA,+BAAA,CAAA,CAAA;CAEkB,SAAS,eAAe,KAAK,KAAI,CAAE,CAAC,SAAS,KAAK,QAAO,GAAG,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;CAM5D,mBAAmB,eAAc;EAClD,IAAI,CAAC,KAAK,OAAM,GAAI,OAAO,KAAK,oBAAmB,CAAE,CAAC,QAAQ,SAAS,OAAO,KAAK,QAAO,CAAE,CAAC;EAC7F,OAAO,KAAK,KAAI,CAAE,CAAC,SAAS,KAAK,KAAK,YAAW;CACnD,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,mBAAA,CAAA,+BAAA,CAAA,CAAA;CAGM,iBAAyC,CAAE;CAE3C,kBAA6B,CAAE;CAEvC,WAAW,OAAsB;EAC/B,KAAK,KAAK,IAAI,SAAS,CAAA,CAAE;CAC3B;CAEA,iBAAiB,IAA2B;EAC1C,KAAK,WAAW;CAClB;CAEA,kBAAkB,IAAc;EAC9B,KAAK,YAAY;CACnB;CAEA,iBAAiB,YAAmB;EAClC,KAAK,aAAa,IAAI,UAAU;CAClC;CAEU,SAAS,OAAa;EAC9B,OAAO,GAAG,KAAK,UAAS,UAAW;CACrC;CAEU,OAAO,OAAa;EAC5B,MAAM,MAAM,MAAM,KAAI;EACtB,IAAI,CAAC,OAAO,CAAC,KAAK,OAAM,GAAI;EAC5B,IAAI,CAAC,KAAK,gBAAe,KAAM,KAAK,KAAI,CAAE,CAAC,SAAS,GAAG,GAAG;EAE1D,KAAK,KAAK,QAAO,MAAK,CAAC,GAAG,GAAG,GAAG,CAAC;EACjC,KAAK,WAAW,IAAI,EAAE;EACtB,KAAK,YAAY,IAAI,EAAE;EACvB,KAAK,SAAS,KAAK,KAAI,CAAE;EACzB,KAAK,SAAS,KAAK,GAAG;CACxB;CAEU,UAAU,OAAa;EAC/B,MAAM,UAAU,KAAK,KAAI,CAAE,CAAC;EAC5B,KAAK,KAAK,QAAO,MAAK,EAAE,QAAQ,GAAG,MAAM,MAAM,KAAK,CAAC;EACrD,KAAK,SAAS,KAAK,KAAI,CAAE;EACzB,KAAK,WAAW,KAAK,OAAO;CAC9B;CAEU,UAAU,OAAoB;EACtC,MAAM,MAAM,KAAK,UAAS;EAC1B,MAAM,MAAM,KAAK,WAAU;EAC3B,MAAM,WAAW,KAAK,gBAAe;EAErC,QAAQ,MAAM,KAAd;GACE,KAAK;GACL,KAAK,WAAW;IACd,MAAM,QAAQ,KAAK,oBAAmB,CAAE,CAAC;IACzC,IAAI,CAAC,OAAO;IACZ,MAAM,eAAc;IACpB,KAAK,qBAAqB,IAAI,KAAK;IACnC,MAAM,QAAQ,MAAM,QAAQ,cAAc,IAAI;IAC9C,MAAM,QAAQ,KAAK,YAAW,IAAK,QAAQ,SAAS;IACpD,KAAK,YAAY,IAAI,IAAI;IACzB,SAAS,eAAe,KAAK,SAAS,IAAI,CAAC,CAAC,EAAE,iBAAiB,EAAE,OAAO,UAAS,CAAE;IACnF;GACF;GACA,KAAK;IACH,IAAI,UAAU;KACZ,MAAM,eAAc;KACpB,KAAK,qBAAqB,IAAI,IAAI;KAClC,KAAK,YAAY,IAAI,EAAE;IACzB;IACA;GACF,KAAK;IACH,IAAI,YAAY,KAAK,YAAW,KAAM,GAAG;KACvC,MAAM,eAAc;KACpB,KAAK,OAAO,KAAK,oBAAmB,CAAE,CAAC,KAAK,YAAW,EAAG;IAC5D,OAAO,IAAI,QAAQ,WAAW,QAAQ,QAAQ;KAC5C,MAAM,eAAc;KACpB,KAAK,OAAO,GAAG;IACjB;IACA;GACF,KAAK;IACH,IAAI,QAAQ,WAAW,QAAQ,QAAQ;KACrC,MAAM,eAAc;KACpB,KAAK,OAAO,GAAG;IACjB;IACA;GACF,KAAK;IACH,IAAI,CAAC,OAAO,KAAK,UAAS,KAAM,KAAK,KAAI,CAAE,CAAC,SAAS,GACnD,KAAK,UAAU,KAAK,KAAI,CAAE,CAAC,SAAS,CAAC;IAEvC;EACJ;CACF;CAEU,QAAQ,OAAY;EAC5B,KAAK,WAAW,IAAK,MAAM,OAA4B,KAAK;EAC5D,KAAK,YAAY,IAAI,EAAE;EACvB,KAAK,qBAAqB,IAAI,KAAK;CACrC;CAEU,UAAO;EACf,KAAK,QAAQ,IAAI,IAAI;CACvB;CAEU,SAAM;EACd,KAAK,QAAQ,IAAI,KAAK;EACtB,KAAK,YAAY,IAAI,EAAE;EACvB,KAAK,UAAS;EACd,MAAM,MAAM,KAAK,WAAU;EAC3B,IAAI,IAAI,KAAI,GAAI,KAAK,OAAO,GAAG;CACjC;CAEU,iBAAiB,OAAa;EACtC,KAAK,OAAO,KAAK;EACjB,KAAK,QAAO,CAAE,EAAE,cAAc,MAAK;CACrC;CAEU,aAAU;EAClB,KAAK,QAAO,CAAE,EAAE,cAAc,MAAK;CACrC;CA7LW,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAiB,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAAjB,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAiB,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,aAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,SAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,iBAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,WAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,UAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,WAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,aAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,OAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,qBAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,oBAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,sBAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;EAAA;EAAA,SAAA;GAAA,UAAA;GAAA,YAAA;EAAA;EAAA,WARjB,CACT;GACE,SAAS;GACT,aAAa,iBAAiB,iBAAiB;GAC/C,OAAO;EACR,CACF;EAAA,aAAA,CAAA;GAAA,cAAA;GAAA,OAAA;GAAA,WAAA,CAAA,SAAA;GAAA,aAAA;GAAA,UAAA;EAAA,CAAA;EAAA,UAAA;EAAA,UCzBH;EA8DA,QAAA,CAAA,q5EAAA;EAAA,iBAAA,GAAA,wBAAA;CAAA,CAAA;;ADnCa,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAiB,YAAA,CAAA;EAd7B,MAAA;EACW,MAAA,CAAA;GAAA,UAAA;GAAc,YACZ;GAAI,iBAGC,wBAAwB;GAAM,WACpC,CACT;IACE,SAAS;IACT,aAAa,iBAAgB,iBAAkB;IAC/C,OAAO;GACR,CACF;GAAA,UAAA;GAAA,QAAA,CAAA,q5EAAA;EAAA,CAAA;CA8CoE,CAAA;CAAA,gBAAA;EAAA,aAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA;IAAA,UAAA;IAAA,OAAA;IAAA,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,SAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA;IAAA,UAAA;IAAA,OAAA;IAAA,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,iBAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA;IAAA,UAAA;IAAA,OAAA;IAAA,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,WAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA;IAAA,UAAA;IAAA,OAAA;IAAA,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,UAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA;IAAA,UAAA;IAAA,OAAA;IAAA,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,WAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA;IAAA,UAAA;IAAA,OAAA;IAAA,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,aAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA;IAAA,UAAA;IAAA,OAAA;IAAA,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,OAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA;IAAA,UAAA;IAAA,OAAA;IAAA,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,qBAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA;IAAA,UAAA;IAAA,OAAA;IAAA,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,oBAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA;IAAA,UAAA;IAAA,OAAA;IAAA,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,sBAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA;IAAA,UAAA;IAAA,OAAA;IAAA,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,UAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA,UAAA;EAAA,CAAA;EAAA,YAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA,YAAA;EAAA,CAAA;EAAA,SAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA,WAAS,EAAA,UAAA,KAAA,CAAA;EAAA,CAAA;CAAA;AAAA,CAAA"}