@magmonium/one 0.4.30 → 0.4.32

package/fesm2022/magmonium-one-base-input-CLBOTOUs.mjs

@@ -0,0 +1,183 @@
+import { i as resolveSize } from "./magmonium-one-size-converter-BfT0Aw0g.mjs";
+import * as i0 from "@angular/core";
+import { Directive, ElementRef, computed, effect, inject, input, model } from "@angular/core";
+var BaseInputComponent = class BaseInputComponent {
+	focused = input(false, ...ngDevMode ? [{ debugName: "focused" }] : /* istanbul ignore next */ []);
+	errors = input([], ...ngDevMode ? [{ debugName: "errors" }] : /* istanbul ignore next */ []);
+	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 */ []);
+	readonly = input(false, ...ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []);
+	elementRef = inject(ElementRef);
+	applyConfigSize = effect(() => {
+		const size = this.config()?.size;
+		const el = this.elementRef.nativeElement;
+		if (size) {
+			const resolved = resolveSize(size);
+			el.style.setProperty("--input-size", resolved);
+			el.style.fontSize = resolved;
+		} else {
+			el.style.removeProperty("--input-size");
+			el.style.removeProperty("font-size");
+		}
+	}, ...ngDevMode ? [{ debugName: "applyConfigSize" }] : /* istanbul ignore next */ []);
+	showErrors = computed(() => (this.touched() === true || this.touched() + "" === "true") && (this.invalid() === true || this.invalid() + "" === "true"), ...ngDevMode ? [{ debugName: "showErrors" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: BaseInputComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "17.1.0",
+		version: "22.2.1",
+		type: BaseInputComponent,
+		isStandalone: true,
+		inputs: {
+			focused: {
+				classPropertyName: "focused",
+				publicName: "focused",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			errors: {
+				classPropertyName: "errors",
+				publicName: "errors",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			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
+			},
+			readonly: {
+				classPropertyName: "readonly",
+				publicName: "readonly",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: { touched: "touchedChange" },
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: BaseInputComponent,
+	decorators: [{
+		type: Directive,
+		args: [{}]
+	}],
+	propDecorators: {
+		focused: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "focused",
+				required: false
+			}]
+		}],
+		errors: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "errors",
+				required: false
+			}]
+		}],
+		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"]
+		}],
+		readonly: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "readonly",
+				required: false
+			}]
+		}]
+	}
+});
+export { BaseInputComponent as t };
+
+//# sourceMappingURL=magmonium-one-base-input-CLBOTOUs.mjs.map

package/fesm2022/magmonium-one-base-input-CLBOTOUs.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"magmonium-one-base-input-CLBOTOUs.mjs","names":[],"sources":["../../../../libs/one/src/lib/shared/ui/input/lib/base-input.ts"],"sourcesContent":["import {\n  Directive,\n  ElementRef,\n  effect,\n  inject,\n  input,\n  model,\n  computed,\n  InputSignal,\n  ModelSignal,\n} from '@angular/core';\nimport { ValidationError, WithOptionalFieldTree } from '@angular/forms/signals';\nimport { Size } from '../../../enum/scaling/size';\nimport { Input } from '../model/input';\nimport { resolveSize } from '../../../functions/size/size-converter';\n\n@Directive({})\nexport class BaseInputComponent<T extends Input = Input> {\n  public focused: InputSignal<boolean> = input<boolean>(false);\n  public errors: InputSignal<readonly WithOptionalFieldTree<ValidationError>[]> =\n    input<readonly WithOptionalFieldTree<ValidationError>[]>([]);\n  public config: InputSignal<Partial<T> | undefined> = input<\n    Partial<T> | undefined\n  >();\n  public required: InputSignal<boolean> = input<boolean>(false);\n  public disabled: InputSignal<boolean> = input<boolean>(false);\n  public invalid: InputSignal<boolean> = input<boolean>(false);\n  public touched: ModelSignal<boolean> = model<boolean>(false);\n  public readonly: InputSignal<boolean> = input<boolean>(false);\n\n  protected readonly elementRef = inject(ElementRef);\n\n  // SectionFormItem stamps Size onto config; inputs scale via CSS var\n  // so size changes update without destroying the field. Uses CSS var because\n  // host may have display: contents, but CSS vars still inherit to children.\n  private readonly applyConfigSize = effect(() => {\n    const configWithSize = this.config() as Partial<Input> & { size?: Size };\n    const size = configWithSize?.size;\n    const el = this.elementRef.nativeElement as HTMLElement;\n    if (size) {\n      const resolved = resolveSize(size);\n      el.style.setProperty('--input-size', resolved);\n      // Some input variants declare their own font-size on the rendered\n      // control. Keep the actual input text synchronized with the size that\n      // drives its geometry instead of relying only on inherited variables.\n      el.style.fontSize = resolved;\n    } else {\n      el.style.removeProperty('--input-size');\n      el.style.removeProperty('font-size');\n    }\n  });\n\n  public showErrors = computed(() => \n    (this.touched() === true || this.touched() + '' === 'true') && \n    (this.invalid() === true || this.invalid() + '' === 'true')\n  );\n}\n"],"mappings":";;;AAiBA,IAAa,qBAAb,MAAa,mBAAkB;CACtB,UAAgC,MAAe,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CACrD,SACL,MAAyD,CAAA,GAAG,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;CACvD,SAA8C,MAElD,GAAA,YAAA,CAAA,QAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;CACI,WAAiC,MAAe,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;CACtD,WAAiC,MAAe,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;CACtD,UAAgC,MAAe,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CACrD,UAAgC,MAAe,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CACrD,WAAiC,MAAe,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;CAE1C,aAAa,OAAO,UAAU;CAKhC,kBAAkB,aAAY;EAE7C,MAAM,OADiB,KAAK,OACf,CAAA,EAAgB;EAC7B,MAAM,KAAK,KAAK,WAAW;EAC3B,IAAI,MAAM;GACR,MAAM,WAAW,YAAY,IAAI;GACjC,GAAG,MAAM,YAAY,gBAAgB,QAAQ;GAI7C,GAAG,MAAM,WAAW;EACtB,OAAO;GACL,GAAG,MAAM,eAAe,cAAc;GACtC,GAAG,MAAM,eAAe,WAAW;EACrC;CACF,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,kBAAA,CAAA,+BAAA,CAAA,CAAA;CAEK,aAAa,gBACjB,KAAK,QAAO,MAAO,QAAQ,KAAK,QAAO,IAAK,OAAO,YACnD,KAAK,QAAO,MAAO,QAAQ,KAAK,QAAO,IAAK,OAAO,SACrD,GAAA,YAAA,CAAA,EAAA,WAAA,aAAA,CAAA,+BAAA,CAAA,CAAA;CAtCU,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAkB,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAAlB,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAkB,cAAA;EAAA,QAAA;GAAA,SAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,QAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,QAAA;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,UAAA;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,SAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,UAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;EAAA;EAAA,SAAA,EAAA,SAAA,gBAAA;EAAA,UAAA;CAAA,CAAA;;AAAlB,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAkB,YAAA,CAAA;EAD9B,MAAA;EAAU,MAAA,CAAA,CAAA,CAAE"}

package/fesm2022/magmonium-one-base-text-Zb0oLNRX.mjs

@@ -0,0 +1,94 @@
+import { t as BaseInputComponent } from "./magmonium-one-base-input-CLBOTOUs.mjs";
+import * as i0 from "@angular/core";
+import { DOCUMENT, Directive, afterRenderEffect, computed, inject, model, signal, viewChild } from "@angular/core";
+var BaseTextInputComponent = class BaseTextInputComponent extends BaseInputComponent {
+	value = model();
+	inputElement = viewChild("inputElement", ...ngDevMode ? [{ debugName: "inputElement" }] : /* istanbul ignore next */ []);
+	document = inject(DOCUMENT);
+	autofocused;
+	constructor() {
+		super();
+		afterRenderEffect(() => {
+			const element = this.inputElement();
+			if (!this.focused() || !element) return;
+			const node = element.nativeElement;
+			if (this.autofocused === node) return;
+			const active = this.document.activeElement;
+			if (active && active !== this.document.body && active !== node) return;
+			this.autofocused = node;
+			node.focus();
+		});
+	}
+	isFocused = signal(false, ...ngDevMode ? [{ debugName: "isFocused" }] : /* istanbul ignore next */ []);
+	iconColor = computed(() => {
+		if (this.showErrors()) return "error";
+		if (this.isFocused()) return "focus";
+		return "border";
+	}, ...ngDevMode ? [{ debugName: "iconColor" }] : /* istanbul ignore next */ []);
+	setValue = (value) => {
+		this.value.set(value);
+		this.touched.set(true);
+	};
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: BaseTextInputComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "17.2.0",
+		version: "22.2.1",
+		type: BaseTextInputComponent,
+		isStandalone: true,
+		inputs: { value: {
+			classPropertyName: "value",
+			publicName: "value",
+			isSignal: true,
+			isRequired: false,
+			transformFunction: null
+		} },
+		outputs: { value: "valueChange" },
+		viewQueries: [{
+			propertyName: "inputElement",
+			first: true,
+			predicate: ["inputElement"],
+			descendants: true,
+			isSignal: true
+		}],
+		usesInheritance: true,
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: BaseTextInputComponent,
+	decorators: [{
+		type: Directive,
+		args: [{}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		value: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "value",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["valueChange"]
+		}],
+		inputElement: [{
+			type: i0.ViewChild,
+			args: ["inputElement", { isSignal: true }]
+		}]
+	}
+});
+export { BaseTextInputComponent as t };
+
+//# sourceMappingURL=magmonium-one-base-text-Zb0oLNRX.mjs.map

package/fesm2022/magmonium-one-base-text-Zb0oLNRX.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"magmonium-one-base-text-Zb0oLNRX.mjs","names":[],"sources":["../../../../libs/one/src/lib/shared/ui/input/ui/text/base-text.ts"],"sourcesContent":["import {\n  afterRenderEffect,\n  computed,\n  Directive,\n  DOCUMENT,\n  ElementRef,\n  inject,\n  model,\n  ModelSignal,\n  signal,\n  viewChild,\n} from '@angular/core';\nimport { FormValueControl } from '@angular/forms/signals';\nimport { Input, TextInput } from '../../model/input';\nimport { BaseInputComponent } from '../../lib/base-input';\n\n@Directive({})\nexport class BaseTextInputComponent<T extends Input = TextInput>\n  extends BaseInputComponent<T>\n  implements FormValueControl<string>\n{\n  public value = model<string>() as ModelSignal<string>;\n\n  private inputElement =\n    viewChild<ElementRef<HTMLInputElement>>('inputElement');\n\n  private readonly document = inject(DOCUMENT);\n\n  /** The element this field has already claimed the caret for, once. */\n  private autofocused: HTMLInputElement | undefined;\n\n  constructor() {\n    super();\n    afterRenderEffect(() => {\n      const element = this.inputElement();\n      if (!this.focused() || !element) return;\n\n      const node = element.nativeElement;\n      // Once per element. A form that re-renders — an inspector rebuilt on\n      // every store change — mounts a fresh input each time, and a focus per\n      // mount is a focus per keystroke somewhere else on the screen.\n      if (this.autofocused === node) return;\n\n      // And never out of a surface the User is already working in. Same rule\n      // the form makes for its own first field: a caret that has been placed\n      // is theirs, not the next form's to take.\n      const active = this.document.activeElement;\n      if (active && active !== this.document.body && active !== node) return;\n\n      this.autofocused = node;\n      node.focus();\n    });\n  }\n\n  public readonly isFocused = signal(false);\n\n  // Icon tracks the wrapper's border: =input-wrapper paints $error on error,\n  // the focus tint on focus, and the border color at rest.\n  public readonly iconColor = computed(() => {\n    if (this.showErrors()) return 'error';\n    if (this.isFocused()) return 'focus';\n    return 'border';\n  });\n\n  protected readonly setValue = (value: string) => {\n    this.value.set(value);\n    this.touched.set(true);\n  };\n}\n"],"mappings":";;;AAiBA,IAAa,yBAAb,MAAa,+BACH,mBAAqB;CAGtB,QAAQ,MAAK;CAEZ,eACN,UAAwC,gBAAe,GAAA,YAAA,CAAA,EAAA,WAAA,eAAA,CAAA,+BAAA,CAAA,CAAA;CAExC,WAAW,OAAO,QAAQ;CAGnC;CAER,cAAA;EACE,MAAK;EACL,wBAAuB;GACrB,MAAM,UAAU,KAAK,aAAY;GACjC,IAAI,CAAC,KAAK,QAAO,KAAM,CAAC,SAAS;GAEjC,MAAM,OAAO,QAAQ;GAIrB,IAAI,KAAK,gBAAgB,MAAM;GAK/B,MAAM,SAAS,KAAK,SAAS;GAC7B,IAAI,UAAU,WAAW,KAAK,SAAS,QAAQ,WAAW,MAAM;GAEhE,KAAK,cAAc;GACnB,KAAK,MAAK;EACZ,CAAC;CACH;CAEgB,YAAY,OAAO,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,YAAA,CAAA,+BAAA,CAAA,CAAA;CAIzB,YAAY,eAAc;EACxC,IAAI,KAAK,WAAU,GAAI,OAAO;EAC9B,IAAI,KAAK,UAAS,GAAI,OAAO;EAC7B,OAAO;CACT,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,YAAA,CAAA,+BAAA,CAAA,CAAA;CAEiB,YAAY,UAAiB;EAC9C,KAAK,MAAM,IAAI,KAAK;EACpB,KAAK,QAAQ,IAAI,IAAI;CACvB;CAlDW,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAsB,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAAtB,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAsB,cAAA;EAAA,QAAA,EAAA,OAAA;GAAA,mBAAA;GAAA,YAAA;GAAA,UAAA;GAAA,YAAA;GAAA,mBAAA;EAAA,EAAA;EAAA,SAAA,EAAA,OAAA,cAAA;EAAA,aAAA,CAAA;GAAA,cAAA;GAAA,OAAA;GAAA,WAAA,CAAA,cAAA;GAAA,aAAA;GAAA,UAAA;EAAA,CAAA;EAAA,iBAAA;EAAA,UAAA;CAAA,CAAA;;AAAtB,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAsB,YAAA,CAAA;EADlC,MAAA;EAAU,MAAA,CAAA,CAAA,CAAE;CAQ+B,CAAA;CAAA,sBAAA,CAAA;CAAA,gBAAA;EAAA,OAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA;IAAA,UAAA;IAAA,OAAA;IAAA,UAAA;GAAA,CAAA;EAAA,GAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA,aAAA;EAAA,CAAA;EAAA,cAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA,gBAAc,EAAA,UAAA,KAAA,CAAA;EAAA,CAAA;CAAA;AAAA,CAAA"}