@magmonium/one 0.4.30 → 0.4.32

package/fesm2022/magmonium-one-base-dropdown-U-cWl3p9.mjs

@@ -0,0 +1,604 @@
+import { c as TranslatePipe, l as TranslateService } from "./magmonium-one-size-converter-BfT0Aw0g.mjs";
+import { t as SelectorDirective } from "./magmonium-one-selector-BowevmOd.mjs";
+import { t as LabelComponent } from "./magmonium-one-label-D2gjTbKX.mjs";
+import { t as ButtonComponent } from "./magmonium-one-button-Bwzaxxn3.mjs";
+import { t as TextOutputComponent } from "./magmonium-one-text-output-CfVeqYM7.mjs";
+import { t as BaseInputComponent } from "./magmonium-one-base-input-CLBOTOUs.mjs";
+import "./magmonium-one-directives-BVKX77zM.mjs";
+import { t as TextInputComponent } from "./magmonium-one-text-B4xKn-EQ.mjs";
+import { t as assetOptions } from "./magmonium-one-options-asset-CDEXIif6.mjs";
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, Directive, ElementRef, computed, effect, inject, input, inputBinding, linkedSignal, model, output, outputBinding, signal, viewChild } from "@angular/core";
+var DropdownBoxComponent = class DropdownBoxComponent {
+	options = input([], ...ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []);
+	selected = input([], ...ngDevMode ? [{ debugName: "selected" }] : /* istanbul ignore next */ []);
+	multiple = input(false, ...ngDevMode ? [{ debugName: "multiple" }] : /* istanbul ignore next */ []);
+	activeIndex = input(-1, ...ngDevMode ? [{ debugName: "activeIndex" }] : /* istanbul ignore next */ []);
+	action = output();
+	host = inject(ElementRef);
+	constructor() {
+		effect(() => {
+			const index = this.activeIndex();
+			if (index < 0) return;
+			this.host.nativeElement.querySelectorAll(".dropdown-box__option")[index]?.scrollIntoView?.({ block: "nearest" });
+		});
+	}
+	isSelected = (value) => this.selected().includes(value);
+	selectOption = (option) => {
+		if (option.disabled) return;
+		this.action.emit(option);
+	};
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: DropdownBoxComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: DropdownBoxComponent,
+		isStandalone: true,
+		selector: "m-dropdown-box",
+		inputs: {
+			options: {
+				classPropertyName: "options",
+				publicName: "options",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			selected: {
+				classPropertyName: "selected",
+				publicName: "selected",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			multiple: {
+				classPropertyName: "multiple",
+				publicName: "multiple",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			activeIndex: {
+				classPropertyName: "activeIndex",
+				publicName: "activeIndex",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: { action: "action" },
+		ngImport: i0,
+		template: `
+    <ul class="dropdown-box" role="listbox">
+      @for (option of options(); track option.value; let i = $index) {
+        @let selectedState = isSelected(option.value);
+        <li
+          class="dropdown-box__option"
+          [class.dropdown-box__option--selected]="selectedState"
+          [class.dropdown-box__option--disabled]="option.disabled"
+          [class.dropdown-box__option--active]="i === activeIndex()"
+          role="option"
+          [attr.aria-selected]="selectedState"
+          [attr.data-value]="option.value"
+          (click)="selectOption(option)"
+          (keydown.enter)="selectOption(option)"
+          tabindex="0"
+        >
+          <!-- A group header is a row, never a choice: no box to tick. -->
+          @if (multiple() && !option.disabled) {
+            <input
+              type="checkbox"
+              class="dropdown-box__checkbox"
+              [checked]="selectedState"
+              tabindex="-1"
+              (click)="$event.preventDefault()"
+            />
+          }
+          @if (option.noTranslate) {
+            {{ option.label }}
+          } @else {
+            {{ option.label | translate }}
+          }
+        </li>
+      } @empty {
+        <li class="dropdown-box__empty">
+          {{ 'no-results-found' | translate }}
+        </li>
+      }
+    </ul>
+  `,
+		isInline: true,
+		styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.dropdown-box{overflow-y:auto;max-height:15rem;margin:0;padding:.375rem;list-style:none;border:var(--m-input-border-width, 1px) solid var(--m-text-input-border, color-mix(in srgb, var(--m-text) 18%, var(--m-background)));border-radius:var(--m-input-radius, .5rem);background:color-mix(in srgb,var(--m-focus) 2%,var(--m-background));box-shadow:0 .75rem 2rem color-mix(in srgb,var(--m-text) 12%,transparent);animation:dropdown-in .2s ease-out}.dropdown-box__checkbox{flex-shrink:0;width:14px;height:14px;margin-right:8px;pointer-events:none;accent-color:var(--m-mm);cursor:pointer}.dropdown-box__option{display:flex;align-items:center;padding:.625rem .75rem;border-radius:.375rem;cursor:pointer;font-size:.875rem;color:var(--m-text);transition:background .15s ease}.dropdown-box__option:hover,.dropdown-box__option--active{background:color-mix(in srgb,var(--m-focus) 8%,transparent)}.dropdown-box__option--selected{font-weight:600;color:var(--m-mm)}.dropdown-box__option--disabled{opacity:.4;pointer-events:none}.dropdown-box__empty{padding:.75rem;text-align:center;color:var(--m-text-tertiary);font-size:.875rem}@keyframes dropdown-in{0%{opacity:0;transform:scale(.95) translateY(-4px)}to{opacity:1;transform:scale(1) translateY(0)}}:host(.open-upward) .dropdown-box{animation:dropdown-in-up .2s ease-out}@keyframes dropdown-in-up{0%{opacity:0;transform:scale(.95) translateY(4px)}to{opacity:1;transform:scale(1) translateY(0)}}:host-context(.align-bottom) .dropdown-box{max-height:70vh;border:none;border-radius:0;background:transparent;box-shadow:none;animation:none}\n"],
+		dependencies: [{
+			kind: "pipe",
+			type: TranslatePipe,
+			name: "translate"
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: DropdownBoxComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "m-dropdown-box",
+			imports: [TranslatePipe],
+			template: `
+    <ul class="dropdown-box" role="listbox">
+      @for (option of options(); track option.value; let i = $index) {
+        @let selectedState = isSelected(option.value);
+        <li
+          class="dropdown-box__option"
+          [class.dropdown-box__option--selected]="selectedState"
+          [class.dropdown-box__option--disabled]="option.disabled"
+          [class.dropdown-box__option--active]="i === activeIndex()"
+          role="option"
+          [attr.aria-selected]="selectedState"
+          [attr.data-value]="option.value"
+          (click)="selectOption(option)"
+          (keydown.enter)="selectOption(option)"
+          tabindex="0"
+        >
+          <!-- A group header is a row, never a choice: no box to tick. -->
+          @if (multiple() && !option.disabled) {
+            <input
+              type="checkbox"
+              class="dropdown-box__checkbox"
+              [checked]="selectedState"
+              tabindex="-1"
+              (click)="$event.preventDefault()"
+            />
+          }
+          @if (option.noTranslate) {
+            {{ option.label }}
+          } @else {
+            {{ option.label | translate }}
+          }
+        </li>
+      } @empty {
+        <li class="dropdown-box__empty">
+          {{ 'no-results-found' | translate }}
+        </li>
+      }
+    </ul>
+  `,
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.dropdown-box{overflow-y:auto;max-height:15rem;margin:0;padding:.375rem;list-style:none;border:var(--m-input-border-width, 1px) solid var(--m-text-input-border, color-mix(in srgb, var(--m-text) 18%, var(--m-background)));border-radius:var(--m-input-radius, .5rem);background:color-mix(in srgb,var(--m-focus) 2%,var(--m-background));box-shadow:0 .75rem 2rem color-mix(in srgb,var(--m-text) 12%,transparent);animation:dropdown-in .2s ease-out}.dropdown-box__checkbox{flex-shrink:0;width:14px;height:14px;margin-right:8px;pointer-events:none;accent-color:var(--m-mm);cursor:pointer}.dropdown-box__option{display:flex;align-items:center;padding:.625rem .75rem;border-radius:.375rem;cursor:pointer;font-size:.875rem;color:var(--m-text);transition:background .15s ease}.dropdown-box__option:hover,.dropdown-box__option--active{background:color-mix(in srgb,var(--m-focus) 8%,transparent)}.dropdown-box__option--selected{font-weight:600;color:var(--m-mm)}.dropdown-box__option--disabled{opacity:.4;pointer-events:none}.dropdown-box__empty{padding:.75rem;text-align:center;color:var(--m-text-tertiary);font-size:.875rem}@keyframes dropdown-in{0%{opacity:0;transform:scale(.95) translateY(-4px)}to{opacity:1;transform:scale(1) translateY(0)}}:host(.open-upward) .dropdown-box{animation:dropdown-in-up .2s ease-out}@keyframes dropdown-in-up{0%{opacity:0;transform:scale(.95) translateY(4px)}to{opacity:1;transform:scale(1) translateY(0)}}:host-context(.align-bottom) .dropdown-box{max-height:70vh;border:none;border-radius:0;background:transparent;box-shadow:none;animation:none}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		options: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "options",
+				required: false
+			}]
+		}],
+		selected: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "selected",
+				required: false
+			}]
+		}],
+		multiple: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "multiple",
+				required: false
+			}]
+		}],
+		activeIndex: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "activeIndex",
+				required: false
+			}]
+		}],
+		action: [{
+			type: i0.Output,
+			args: ["action"]
+		}]
+	}
+});
+const DROPDOWN_TEMPLATE = `
+  @if (config(); as dropdown) {
+    @if (dropdown.label) {
+      <m-label
+        [for]="dropdown.name ?? ''"
+        [placeholder]="dropdown.label"
+        [params]="dropdown.params"
+        [required]="required()"
+        [disabled]="disabled()"
+      />
+    }
+    <div
+      class="trigger-wrap"
+      #wrapper
+      [mSelector]="selectorConfig()"
+      [disabled]="disabled() || readonly() || !!config()?.readonly"
+      (opened)="onOpened()"
+      (closed)="onClosed()"
+      (focusin)="isFocused.set(true)"
+      (focusout)="isFocused.set(false)"
+    >
+      <m-text-input
+        [config]="triggerInputConfig()"
+        [value]="displayValue()"
+        [disabled]="disabled()"
+        [invalid]="invalid()"
+        [hideErrors]="true"
+        [(touched)]="touched"
+        [focused]="focused()"
+        (valueChange)="onInput($event)"
+        (click)="preventToggleWhenOpen($event)"
+        (keydown.space)="$event.stopPropagation()"
+        (keydown.enter)="onEnter($event)"
+        (keydown.arrowdown)="onArrow($event, 1)"
+        (keydown.arrowup)="onArrow($event, -1)"
+        (keydown.tab)="$event.stopPropagation()"
+      />
+      <m-button [disabled]="disabled()" [config]="chevron()" />
+    </div>
+    @if (showErrors()) {
+      @for (error of errors(); track $index) {
+        <m-text-output
+          variant="footer"
+          color="error"
+          [label]="error.message"
+        />
+      }
+    }
+  }
+`;
+const DROPDOWN_IMPORTS = [
+	LabelComponent,
+	TextOutputComponent,
+	TextInputComponent,
+	ButtonComponent,
+	SelectorDirective
+];
+var BaseDropdownComponent = class BaseDropdownComponent extends BaseInputComponent {
+	config = input(...ngDevMode ? [void 0, { debugName: "config" }] : /* istanbul ignore next */ []);
+	required = input(false, ...ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []);
+	disabled = input(false, ...ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []);
+	invalid = input(false, ...ngDevMode ? [{ debugName: "invalid" }] : /* istanbul ignore next */ []);
+	touched = model(false, ...ngDevMode ? [{ debugName: "touched" }] : /* istanbul ignore next */ []);
+	focused = input(false, ...ngDevMode ? [{ debugName: "focused" }] : /* istanbul ignore next */ []);
+	errors = input([], ...ngDevMode ? [{ debugName: "errors" }] : /* istanbul ignore next */ []);
+	showErrors = computed(() => this.touched() && this.invalid(), ...ngDevMode ? [{ debugName: "showErrors" }] : /* istanbul ignore next */ []);
+	options = input(...ngDevMode ? [void 0, { debugName: "options" }] : /* istanbul ignore next */ []);
+	dir = input(...ngDevMode ? [void 0, { debugName: "dir" }] : /* istanbul ignore next */ []);
+	toggle = model(false, ...ngDevMode ? [{ debugName: "toggle" }] : /* istanbul ignore next */ []);
+	searchTerm = signal("", ...ngDevMode ? [{ debugName: "searchTerm" }] : /* istanbul ignore next */ []);
+	isFocused = signal(false, ...ngDevMode ? [{ debugName: "isFocused" }] : /* istanbul ignore next */ []);
+	chevron = computed(() => ({
+		icon: this.toggle() ? "chevron-up" : "chevron-down",
+		one: true,
+		variant: "ghost",
+		type: "button",
+		color: this.showErrors() ? "error" : this.isFocused() ? "focus" : "border",
+		tabindex: -1
+	}), ...ngDevMode ? [{ debugName: "chevron" }] : /* istanbul ignore next */ []);
+	triggerInputConfig = computed(() => {
+		const dropdown = this.config();
+		return {
+			name: dropdown?.name,
+			icon: dropdown?.icon,
+			one: dropdown?.one,
+			placeholder: this.placeholderText(),
+			readonly: this.readonly() || !!dropdown?.readonly
+		};
+	}, ...ngDevMode ? [{ debugName: "triggerInputConfig" }] : /* istanbul ignore next */ []);
+	dropdownOptions = computed(() => {
+		const source = this.options() ?? this.config()?.options;
+		if (typeof source === "function") return source();
+		if (source?.length) return source;
+		return this.assetOptions();
+	}, ...ngDevMode ? [{ debugName: "dropdownOptions" }] : /* istanbul ignore next */ []);
+	translateService = inject(TranslateService);
+	assetOptions = assetOptions(() => this.config()?.optionsAsset);
+	optionLabel = (option) => {
+		if (!option?.label) return "";
+		return option.noTranslate ? option.label : this.translateService.translate(option.label);
+	};
+	filteredOptions = computed(() => {
+		const search = this.searchTerm().toLowerCase();
+		if (!search) return this.dropdownOptions();
+		return this.dropdownOptions().filter((o) => {
+			return this.optionLabel(o).toLowerCase().includes(search) || String(o.value).toLowerCase().includes(search);
+		});
+	}, ...ngDevMode ? [{ debugName: "filteredOptions" }] : /* istanbul ignore next */ []);
+	activeIndex = linkedSignal({
+		...ngDevMode ? { debugName: "activeIndex" } : /* istanbul ignore next */ {},
+		source: this.filteredOptions,
+		computation: (options) => this.searchTerm() ? this.nextEnabled(options, -1, 1) : -1
+	});
+	nextEnabled = (options, from, step) => {
+		for (let i = 1; i <= options.length; i++) {
+			const index = ((from + step * i) % options.length + options.length) % options.length;
+			if (!options[index].disabled) return index;
+		}
+		return from;
+	};
+	selectionLabel = computed(() => {
+		const values = this.selectedValues();
+		if (values.length === 0) return "";
+		if (values.length === 1) return this.optionLabel(this.dropdownOptions().find((o) => o.value === values[0]));
+		const translation = this.translateService.translate(`selected?count=${values.length}`);
+		return translation.includes("selected") ? `${values.length} Selected` : translation;
+	}, ...ngDevMode ? [{ debugName: "selectionLabel" }] : /* istanbul ignore next */ []);
+	displayValue = computed(() => this.toggle() ? this.searchTerm() : this.selectionLabel(), ...ngDevMode ? [{ debugName: "displayValue" }] : /* istanbul ignore next */ []);
+	placeholderText = computed(() => {
+		if (this.toggle()) {
+			const label = this.selectionLabel();
+			if (label) return label;
+		}
+		const placeholder = this.config()?.placeholder;
+		return placeholder ? this.translateService.translate(placeholder) : "";
+	}, ...ngDevMode ? [{ debugName: "placeholderText" }] : /* istanbul ignore next */ []);
+	wrapperRef = viewChild("wrapper", ...ngDevMode ? [{ debugName: "wrapperRef" }] : /* istanbul ignore next */ []);
+	selectorConfig = computed(() => ({
+		component: DropdownBoxComponent,
+		base: "m-dropdown-input",
+		matchTriggerWidth: true,
+		toggle: true,
+		dir: this.dir(),
+		bindings: [
+			inputBinding("options", this.filteredOptions),
+			inputBinding("selected", this.selectedValues),
+			inputBinding("multiple", () => this.multiple),
+			inputBinding("activeIndex", this.activeIndex),
+			outputBinding("action", (option) => this.selectOption(option))
+		]
+	}), ...ngDevMode ? [{ debugName: "selectorConfig" }] : /* istanbul ignore next */ []);
+	closePanel = () => {
+		this.toggle.set(false);
+		this.searchTerm.set("");
+		setTimeout(() => this.wrapperRef()?.nativeElement.click(), 0);
+	};
+	onOpened = () => {
+		this.toggle.set(true);
+		this.searchTerm.set("");
+		const current = this.selectedValues()[0];
+		this.activeIndex.set(this.filteredOptions().findIndex((o) => o.value === current));
+	};
+	onArrow = (event, step) => {
+		if (!this.toggle()) return;
+		event.preventDefault();
+		this.activeIndex.update((index) => this.nextEnabled(this.filteredOptions(), index, step));
+	};
+	onEnter = (event) => {
+		event.stopPropagation();
+		if (!this.toggle()) return;
+		event.preventDefault();
+		const option = this.filteredOptions()[this.activeIndex()];
+		if (option && !option.disabled) this.selectOption(option);
+	};
+	onClosed = () => {
+		this.toggle.set(false);
+		this.searchTerm.set("");
+	};
+	onInput = (value) => {
+		this.searchTerm.set(value);
+	};
+	preventToggleWhenOpen = (event) => {
+		if (this.toggle() || this.readonly() || this.config()?.readonly) event.stopPropagation();
+	};
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: BaseDropdownComponent,
+		deps: null,
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "17.2.0",
+		version: "22.2.1",
+		type: BaseDropdownComponent,
+		isStandalone: true,
+		inputs: {
+			config: {
+				classPropertyName: "config",
+				publicName: "config",
+				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
+			},
+			invalid: {
+				classPropertyName: "invalid",
+				publicName: "invalid",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			touched: {
+				classPropertyName: "touched",
+				publicName: "touched",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			focused: {
+				classPropertyName: "focused",
+				publicName: "focused",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			errors: {
+				classPropertyName: "errors",
+				publicName: "errors",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			options: {
+				classPropertyName: "options",
+				publicName: "options",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			dir: {
+				classPropertyName: "dir",
+				publicName: "dir",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			toggle: {
+				classPropertyName: "toggle",
+				publicName: "toggle",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: {
+			touched: "touchedChange",
+			toggle: "toggleChange"
+		},
+		viewQueries: [{
+			propertyName: "wrapperRef",
+			first: true,
+			predicate: ["wrapper"],
+			descendants: true,
+			isSignal: true
+		}],
+		usesInheritance: true,
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: BaseDropdownComponent,
+	decorators: [{ type: Directive }],
+	propDecorators: {
+		config: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "config",
+				required: false
+			}]
+		}],
+		required: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "required",
+				required: false
+			}]
+		}],
+		disabled: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disabled",
+				required: false
+			}]
+		}],
+		invalid: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "invalid",
+				required: false
+			}]
+		}],
+		touched: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "touched",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["touchedChange"]
+		}],
+		focused: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "focused",
+				required: false
+			}]
+		}],
+		errors: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "errors",
+				required: false
+			}]
+		}],
+		options: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "options",
+				required: false
+			}]
+		}],
+		dir: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "dir",
+				required: false
+			}]
+		}],
+		toggle: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "toggle",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["toggleChange"]
+		}],
+		wrapperRef: [{
+			type: i0.ViewChild,
+			args: ["wrapper", { isSignal: true }]
+		}]
+	}
+});
+export { DROPDOWN_IMPORTS as n, DROPDOWN_TEMPLATE as r, BaseDropdownComponent as t };
+
+//# sourceMappingURL=magmonium-one-base-dropdown-U-cWl3p9.mjs.map

package/fesm2022/magmonium-one-base-dropdown-U-cWl3p9.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"magmonium-one-base-dropdown-U-cWl3p9.mjs","names":[],"sources":["../../../../libs/one/src/lib/shared/ui/input/ui/dropdown/dropdown-box.ts","../../../../libs/one/src/lib/shared/ui/input/ui/dropdown/base-dropdown.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  effect,\n  ElementRef,\n  inject,\n  input,\n  output,\n} from '@angular/core';\nimport { TranslatePipe } from '../../../../pipe/translate';\nimport { DropdownOption, DropdownValue } from '../../model/input';\n\n@Component({\n  selector: 'm-dropdown-box',\n  imports: [TranslatePipe],\n  template: `\n    <ul class=\"dropdown-box\" role=\"listbox\">\n      @for (option of options(); track option.value; let i = $index) {\n        @let selectedState = isSelected(option.value);\n        <li\n          class=\"dropdown-box__option\"\n          [class.dropdown-box__option--selected]=\"selectedState\"\n          [class.dropdown-box__option--disabled]=\"option.disabled\"\n          [class.dropdown-box__option--active]=\"i === activeIndex()\"\n          role=\"option\"\n          [attr.aria-selected]=\"selectedState\"\n          [attr.data-value]=\"option.value\"\n          (click)=\"selectOption(option)\"\n          (keydown.enter)=\"selectOption(option)\"\n          tabindex=\"0\"\n        >\n          <!-- A group header is a row, never a choice: no box to tick. -->\n          @if (multiple() && !option.disabled) {\n            <input\n              type=\"checkbox\"\n              class=\"dropdown-box__checkbox\"\n              [checked]=\"selectedState\"\n              tabindex=\"-1\"\n              (click)=\"$event.preventDefault()\"\n            />\n          }\n          @if (option.noTranslate) {\n            {{ option.label }}\n          } @else {\n            {{ option.label | translate }}\n          }\n        </li>\n      } @empty {\n        <li class=\"dropdown-box__empty\">\n          {{ 'no-results-found' | translate }}\n        </li>\n      }\n    </ul>\n  `,\n  styleUrl: './dropdown-box.sass',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DropdownBoxComponent {\n  readonly options = input<DropdownOption<DropdownValue>[]>([]);\n  /** The values ticked, as a list whichever Field drew the panel. */\n  readonly selected = input<readonly DropdownValue[]>([]);\n  readonly multiple = input<boolean>(false);\n  readonly activeIndex = input<number>(-1);\n  readonly action = output<DropdownOption<DropdownValue>>();\n\n  private readonly host = inject<ElementRef<HTMLElement>>(ElementRef);\n\n  // Keep the keyboard-active option in view as ↑/↓ walk a scrolled list.\n  constructor() {\n    effect(() => {\n      const index = this.activeIndex();\n      if (index < 0) return;\n      this.host.nativeElement\n        .querySelectorAll('.dropdown-box__option')\n        [index]?.scrollIntoView?.({ block: 'nearest' });\n    });\n  }\n\n  protected readonly isSelected = (value: DropdownValue): boolean =>\n    this.selected().includes(value);\n\n  // Only emit a selection event for enabled options.\n  protected readonly selectOption = (\n    option: DropdownOption<DropdownValue>\n  ): void => {\n    if (option.disabled) return;\n    this.action.emit(option);\n  };\n}\n","import {\n  computed,\n  Directive,\n  ElementRef,\n  inject,\n  input,\n  inputBinding,\n  linkedSignal,\n  model,\n  outputBinding,\n  Signal,\n  signal,\n  viewChild,\n} from '@angular/core';\nimport { ValidationError, WithOptionalFieldTree } from '@angular/forms/signals';\nimport { LabelComponent } from '../label';\nimport { TextOutputComponent } from '../../../text-output';\nimport { BaseInputComponent } from '../../lib/base-input';\nimport { Button } from '../../../button/type/button';\nimport { ButtonComponent } from '../../../button/ui/button';\nimport { TranslateService } from '../../../../services';\nimport { SelectorConfig, SelectorDirective } from '../../../../directives';\nimport { Direction } from '../../../../directives/selector/selector-type';\nimport { DropdownBoxComponent } from './dropdown-box';\nimport {\n  DropdownInput,\n  DropdownOption,\n  DropdownValue,\n  TextInput,\n} from '../../model/input';\nimport { TextInputComponent } from '../text/text';\nimport { assetOptions } from '../../lib/options-asset';\n\n/** The trigger both option Fields draw: a searchable text input and a chevron. */\nexport const DROPDOWN_TEMPLATE = `\n  @if (config(); as dropdown) {\n    @if (dropdown.label) {\n      <m-label\n        [for]=\"dropdown.name ?? ''\"\n        [placeholder]=\"dropdown.label\"\n        [params]=\"dropdown.params\"\n        [required]=\"required()\"\n        [disabled]=\"disabled()\"\n      />\n    }\n    <div\n      class=\"trigger-wrap\"\n      #wrapper\n      [mSelector]=\"selectorConfig()\"\n      [disabled]=\"disabled() || readonly() || !!config()?.readonly\"\n      (opened)=\"onOpened()\"\n      (closed)=\"onClosed()\"\n      (focusin)=\"isFocused.set(true)\"\n      (focusout)=\"isFocused.set(false)\"\n    >\n      <m-text-input\n        [config]=\"triggerInputConfig()\"\n        [value]=\"displayValue()\"\n        [disabled]=\"disabled()\"\n        [invalid]=\"invalid()\"\n        [hideErrors]=\"true\"\n        [(touched)]=\"touched\"\n        [focused]=\"focused()\"\n        (valueChange)=\"onInput($event)\"\n        (click)=\"preventToggleWhenOpen($event)\"\n        (keydown.space)=\"$event.stopPropagation()\"\n        (keydown.enter)=\"onEnter($event)\"\n        (keydown.arrowdown)=\"onArrow($event, 1)\"\n        (keydown.arrowup)=\"onArrow($event, -1)\"\n        (keydown.tab)=\"$event.stopPropagation()\"\n      />\n      <m-button [disabled]=\"disabled()\" [config]=\"chevron()\" />\n    </div>\n    @if (showErrors()) {\n      @for (error of errors(); track $index) {\n        <m-text-output\n          variant=\"footer\"\n          color=\"error\"\n          [label]=\"error.message\"\n        />\n      }\n    }\n  }\n`;\n\nexport const DROPDOWN_IMPORTS = [\n  LabelComponent,\n  TextOutputComponent,\n  TextInputComponent,\n  ButtonComponent,\n  SelectorDirective,\n];\n\n/**\n * Everything a Dropdown and a Multiselect share: the options, the search, the\n * keyboard walk and the panel. What differs is only what the Field holds — one\n * value or a list — so a subclass says which values are selected and what a\n * pick does to them.\n */\n@Directive()\nexport abstract class BaseDropdownComponent extends BaseInputComponent<DropdownInput> {\n  public override config = input<Partial<DropdownInput> | undefined>();\n  public override required = input<boolean>(false);\n  public override disabled = input<boolean>(false);\n  public override invalid = input<boolean>(false);\n  public override touched = model<boolean>(false);\n  public override focused = input<boolean>(false);\n  public override errors = input<readonly WithOptionalFieldTree<ValidationError>[]>(\n    []\n  );\n  public override showErrors = computed(() => this.touched() && this.invalid());\n\n  readonly options = input<\n    DropdownOption<DropdownValue>[] | Signal<DropdownOption<DropdownValue>[]>\n  >();\n  readonly dir = input<Direction>();\n  readonly toggle = model(false);\n  readonly searchTerm = signal('');\n  readonly isFocused = signal(false);\n  readonly chevron = computed(\n    () =>\n      <Button>{\n        icon: this.toggle() ? 'chevron-up' : 'chevron-down',\n        one: true,\n        variant: 'ghost',\n        // In-Field control, never the form's submit — without this the Button\n        // reads as the submit control and greys out while the form is invalid.\n        type: 'button',\n        // Chevron tracks the trigger's border like the text input's own icon:\n        // red while the Field shows errors, focus tint while focused, border at rest.\n        color: this.showErrors()\n          ? 'error'\n          : this.isFocused()\n            ? 'focus'\n            : 'border',\n        // The trigger input is the Field's tab stop; the chevron only repeats\n        // what clicking that input already does, so Tab walks past it.\n        tabindex: -1,\n      }\n  );\n\n  /** The values the Field holds now, as a list whichever kind it is. */\n  protected abstract readonly selectedValues: Signal<readonly DropdownValue[]>;\n  /** Whether the panel ticks rows and stays open across picks. */\n  protected abstract readonly multiple: boolean;\n  /** What picking `option` does to the Field's value. */\n  protected abstract selectOption(option: DropdownOption<DropdownValue>): void;\n\n  protected readonly triggerInputConfig = computed(() => {\n    const dropdown = this.config() as DropdownInput | undefined;\n    return <Partial<TextInput>>{\n      name: dropdown?.name,\n      icon: dropdown?.icon,\n      one: dropdown?.one,\n      placeholder: this.placeholderText(),\n      readonly: this.readonly() || !!dropdown?.readonly,\n    };\n  });\n\n  protected readonly dropdownOptions = computed(\n    (): DropdownOption<DropdownValue>[] => {\n      const runtimeOptions = this.options();\n      const source =\n        runtimeOptions ?? (this.config() as DropdownInput | undefined)?.options;\n      if (typeof source === 'function') return source();\n      if (source?.length) return source;\n      return this.assetOptions();\n    }\n  );\n\n  private readonly translateService = inject(TranslateService);\n\n  protected readonly assetOptions = assetOptions(\n    () => (this.config() as DropdownInput | undefined)?.optionsAsset\n  );\n\n  /** An option's text: authored as it stands, a key translated. */\n  private readonly optionLabel = (\n    option?: DropdownOption<DropdownValue>\n  ): string => {\n    if (!option?.label) return '';\n    return option.noTranslate\n      ? option.label\n      : this.translateService.translate(option.label);\n  };\n\n  protected readonly filteredOptions = computed(\n    (): DropdownOption<DropdownValue>[] => {\n      const search = this.searchTerm().toLowerCase();\n      if (!search) return this.dropdownOptions();\n      return this.dropdownOptions().filter((o) => {\n        const label = this.optionLabel(o).toLowerCase();\n        return (\n          label.includes(search) ||\n          String(o.value).toLowerCase().includes(search)\n        );\n      });\n    }\n  );\n\n  /** The option ↑/↓ point at while the panel is open; -1 is none. Reset as the search narrows the list. */\n  protected readonly activeIndex = linkedSignal<\n    DropdownOption<DropdownValue>[],\n    number\n  >({\n    source: this.filteredOptions,\n    computation: (options) =>\n      this.searchTerm() ? this.nextEnabled(options, -1, 1) : -1,\n  });\n\n  /** The enabled option `step` rows past `from`, wrapping; `from` itself when none. */\n  private readonly nextEnabled = (\n    options: DropdownOption<DropdownValue>[],\n    from: number,\n    step: 1 | -1\n  ): number => {\n    for (let i = 1; i <= options.length; i++) {\n      const index =\n        (((from + step * i) % options.length) + options.length) %\n        options.length;\n      if (!options[index].disabled) return index;\n    }\n    return from;\n  };\n\n  /** One pick reads as its option's label, several as a count. */\n  private readonly selectionLabel = computed((): string => {\n    const values = this.selectedValues();\n    if (values.length === 0) return '';\n    if (values.length === 1) {\n      return this.optionLabel(\n        this.dropdownOptions().find((o) => o.value === values[0])\n      );\n    }\n    const translation = this.translateService.translate(\n      `selected?count=${values.length}`\n    );\n    return translation.includes('selected')\n      ? `${values.length} Selected`\n      : translation;\n  });\n\n  protected readonly displayValue = computed((): string =>\n    this.toggle() ? this.searchTerm() : this.selectionLabel()\n  );\n\n  protected readonly placeholderText = computed((): string => {\n    if (this.toggle()) {\n      const label = this.selectionLabel();\n      if (label) return label;\n    }\n    const placeholder = (this.config() as DropdownInput | undefined)\n      ?.placeholder;\n    return placeholder ? this.translateService.translate(placeholder) : '';\n  });\n\n  private readonly wrapperRef =\n    viewChild<ElementRef<HTMLDivElement>>('wrapper');\n\n  protected readonly selectorConfig = computed<\n    SelectorConfig<DropdownBoxComponent>\n  >(() => ({\n    component: DropdownBoxComponent,\n    base: 'm-dropdown-input',\n    matchTriggerWidth: true,\n    toggle: true,\n    dir: this.dir(),\n    bindings: [\n      inputBinding('options', this.filteredOptions),\n      inputBinding('selected', this.selectedValues),\n      inputBinding('multiple', () => this.multiple),\n      inputBinding('activeIndex', this.activeIndex),\n      outputBinding<DropdownOption<DropdownValue>>('action', (option) =>\n        this.selectOption(option)\n      ),\n    ],\n  }));\n\n  /** Shuts the panel after a pick, the way a click on the trigger would. */\n  protected readonly closePanel = (): void => {\n    this.toggle.set(false);\n    this.searchTerm.set('');\n    setTimeout(() => this.wrapperRef()?.nativeElement.click(), 0);\n  };\n\n  protected readonly onOpened = (): void => {\n    this.toggle.set(true);\n    this.searchTerm.set('');\n    const current = this.selectedValues()[0];\n    this.activeIndex.set(\n      this.filteredOptions().findIndex((o) => o.value === current)\n    );\n  };\n\n  // Focus stays in the trigger input (it is the search box), so ↑/↓ move the\n  // active option rather than DOM focus. Closed, ArrowDown bubbles on to\n  // SelectorDirective, which opens the panel.\n  protected readonly onArrow = (event: Event, step: 1 | -1): void => {\n    if (!this.toggle()) return;\n    event.preventDefault();\n    this.activeIndex.update((index) =>\n      this.nextEnabled(this.filteredOptions(), index, step)\n    );\n  };\n\n  // Enter never reaches SelectorDirective (it would toggle the panel); open,\n  // it picks the active option.\n  protected readonly onEnter = (event: Event): void => {\n    event.stopPropagation();\n    if (!this.toggle()) return;\n    event.preventDefault();\n    const option = this.filteredOptions()[this.activeIndex()];\n    if (option && !option.disabled) this.selectOption(option);\n  };\n\n  protected readonly onClosed = (): void => {\n    this.toggle.set(false);\n    this.searchTerm.set('');\n  };\n\n  protected readonly onInput = (value: string): void => {\n    this.searchTerm.set(value);\n  };\n\n  protected readonly preventToggleWhenOpen = (event: Event): void => {\n    if (this.toggle() || this.readonly() || this.config()?.readonly) {\n      event.stopPropagation();\n    }\n  };\n}\n"],"mappings":"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"}