aeico-components 0.1.3 → 0.1.4

package/dist/alert.cjs

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const alert = require("./chunks/alert.cjs");
+exports.Alert = alert.Alert;
+exports.default = alert.Alert;
+//# sourceMappingURL=alert.cjs.map

package/dist/alert.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/dist/alert.js

@@ -0,0 +1,6 @@
+import { A, A as A2 } from "./chunks/alert.js";
+export {
+  A as Alert,
+  A2 as default
+};
+//# sourceMappingURL=alert.js.map

package/dist/alert.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/badge.cjs

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const badge = require("./chunks/badge.cjs");
+exports.Badge = badge.Badge;
+exports.default = badge.Badge;
+//# sourceMappingURL=badge.cjs.map

package/dist/badge.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/dist/badge.js

@@ -0,0 +1,6 @@
+import { B, B as B2 } from "./chunks/badge.js";
+export {
+  B as Badge,
+  B2 as default
+};
+//# sourceMappingURL=badge.js.map

package/dist/badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/breadcrumb.cjs

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const breadcrumbItem = require("./chunks/breadcrumb-item.cjs");
+exports.Breadcrumb = breadcrumbItem.Breadcrumb;
+exports.BreadcrumbItem = breadcrumbItem.BreadcrumbItem;
+exports.default = breadcrumbItem.Breadcrumb;
+//# sourceMappingURL=breadcrumb.cjs.map

package/dist/breadcrumb.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumb.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist/breadcrumb.js

@@ -0,0 +1,7 @@
+import { B, a, B as B2 } from "./chunks/breadcrumb-item.js";
+export {
+  B as Breadcrumb,
+  a as BreadcrumbItem,
+  B2 as default
+};
+//# sourceMappingURL=breadcrumb.js.map

package/dist/breadcrumb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumb.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/button-group.cjs

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const buttonGroup = require("./chunks/button-group.cjs");
+exports.ButtonGroup = buttonGroup.ButtonGroup;
+exports.default = buttonGroup.ButtonGroup;
+//# sourceMappingURL=button-group.cjs.map

package/dist/button-group.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-group.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/dist/button-group.js

@@ -0,0 +1,6 @@
+import { B, B as B2 } from "./chunks/button-group.js";
+export {
+  B as ButtonGroup,
+  B2 as default
+};
+//# sourceMappingURL=button-group.js.map

package/dist/button-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-group.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/button.cjs

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const button = require("./chunks/button.cjs");
+exports.Button = button.Button;
+exports.default = button.Button;
+//# sourceMappingURL=button.cjs.map

package/dist/button.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/dist/button.js

@@ -0,0 +1,6 @@
+import { B, B as B2 } from "./chunks/button.js";
+export {
+  B as Button,
+  B2 as default
+};
+//# sourceMappingURL=button.js.map

package/dist/button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/card.cjs

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const card = require("./chunks/card.cjs");
+exports.Card = card.Card;
+exports.default = card.Card;
+//# sourceMappingURL=card.cjs.map

package/dist/card.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/dist/card.js

@@ -0,0 +1,6 @@
+import { C, C as C2 } from "./chunks/card.js";
+export {
+  C as Card,
+  C2 as default
+};
+//# sourceMappingURL=card.js.map

package/dist/card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/checkbox.cjs

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const checkbox = require("./chunks/checkbox.cjs");
+exports.Checkbox = checkbox.Checkbox;
+exports.default = checkbox.Checkbox;
+//# sourceMappingURL=checkbox.cjs.map

package/dist/checkbox.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/dist/checkbox.js

@@ -0,0 +1,6 @@
+import { C, C as C2 } from "./chunks/checkbox.js";
+export {
+  C as Checkbox,
+  C2 as default
+};
+//# sourceMappingURL=checkbox.js.map

package/dist/checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/chunks/aeico-component.cjs

@@ -0,0 +1,17 @@
+"use strict";
+const aeico = require("aeico");
+const SVG_NS = "http://www.w3.org/2000/svg";
+function toKebab(str) {
+  const cleaned = str.replace(/^[_\d]+/, "");
+  return cleaned.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
+}
+const TAG_NAME_PREFIX = "ae";
+class AeicoComponent extends aeico.AeicoElement {
+  static register(name) {
+    const tagName = name || `${TAG_NAME_PREFIX}-${this.tagName || toKebab(this.name)}`;
+    super.register(tagName);
+  }
+}
+exports.AeicoComponent = AeicoComponent;
+exports.SVG_NS = SVG_NS;
+//# sourceMappingURL=aeico-component.cjs.map

package/dist/chunks/aeico-component.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"aeico-component.cjs","sources":["../../src/utils.ts","../../src/aeico-component.ts"],"sourcesContent":["export const SVG_NS = 'http://www.w3.org/2000/svg';\n\nexport function toKebab(str: string): string {\n  const cleaned = str.replace(/^[_\\d]+/, '');\n\n  return cleaned.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();\n}\n","import { AeicoElement } from 'aeico';\nimport { toKebab } from './utils';\n\nconst TAG_NAME_PREFIX = 'ae';\n\n/**\n * AeicoComponent is the base class for all built-in Aeico components.\n */\nclass AeicoComponent extends AeicoElement {\n  static register(name?: string) {\n    const tagName = name || `${TAG_NAME_PREFIX}-${this.tagName || toKebab(this.name)}`;\n\n    super.register(tagName);\n  }\n}\n\nexport default AeicoComponent;\n"],"names":["AeicoElement"],"mappings":";;AAAO,MAAM,SAAS;AAEf,SAAS,QAAQ,KAAqB;AAC3C,QAAM,UAAU,IAAI,QAAQ,WAAW,EAAE;AAEzC,SAAO,QAAQ,QAAQ,mBAAmB,OAAO,EAAE,YAAA;AACrD;ACHA,MAAM,kBAAkB;AAKxB,MAAM,uBAAuBA,MAAAA,aAAa;AAAA,EACxC,OAAO,SAAS,MAAe;AAC7B,UAAM,UAAU,QAAQ,GAAG,eAAe,IAAI,KAAK,WAAW,QAAQ,KAAK,IAAI,CAAC;AAEhF,UAAM,SAAS,OAAO;AAAA,EACxB;AACF;;;"}

package/dist/chunks/aeico-component.js

@@ -0,0 +1,18 @@
+import { AeicoElement } from "aeico";
+const SVG_NS = "http://www.w3.org/2000/svg";
+function toKebab(str) {
+  const cleaned = str.replace(/^[_\d]+/, "");
+  return cleaned.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
+}
+const TAG_NAME_PREFIX = "ae";
+class AeicoComponent extends AeicoElement {
+  static register(name) {
+    const tagName = name || `${TAG_NAME_PREFIX}-${this.tagName || toKebab(this.name)}`;
+    super.register(tagName);
+  }
+}
+export {
+  AeicoComponent as A,
+  SVG_NS as S
+};
+//# sourceMappingURL=aeico-component.js.map

package/dist/chunks/aeico-component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"aeico-component.js","sources":["../../src/utils.ts","../../src/aeico-component.ts"],"sourcesContent":["export const SVG_NS = 'http://www.w3.org/2000/svg';\n\nexport function toKebab(str: string): string {\n  const cleaned = str.replace(/^[_\\d]+/, '');\n\n  return cleaned.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();\n}\n","import { AeicoElement } from 'aeico';\nimport { toKebab } from './utils';\n\nconst TAG_NAME_PREFIX = 'ae';\n\n/**\n * AeicoComponent is the base class for all built-in Aeico components.\n */\nclass AeicoComponent extends AeicoElement {\n  static register(name?: string) {\n    const tagName = name || `${TAG_NAME_PREFIX}-${this.tagName || toKebab(this.name)}`;\n\n    super.register(tagName);\n  }\n}\n\nexport default AeicoComponent;\n"],"names":[],"mappings":";AAAO,MAAM,SAAS;AAEf,SAAS,QAAQ,KAAqB;AAC3C,QAAM,UAAU,IAAI,QAAQ,WAAW,EAAE;AAEzC,SAAO,QAAQ,QAAQ,mBAAmB,OAAO,EAAE,YAAA;AACrD;ACHA,MAAM,kBAAkB;AAKxB,MAAM,uBAAuB,aAAa;AAAA,EACxC,OAAO,SAAS,MAAe;AAC7B,UAAM,UAAU,QAAQ,GAAG,eAAe,IAAI,KAAK,WAAW,QAAQ,KAAK,IAAI,CAAC;AAEhF,UAAM,SAAS,OAAO;AAAA,EACxB;AACF;"}

package/dist/chunks/aeico-field.cjs

@@ -0,0 +1,179 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+const aeico = require("aeico");
+const aeicoComponent = require("./aeico-component.cjs");
+const aeicoLocalize = require("aeico-localize");
+class AeicoField extends aeicoComponent.AeicoComponent {
+  constructor() {
+    super(...arguments);
+    /**
+     * The underlying form control element (input, select, etc.)
+     * Subclasses should set this to their specific element
+     */
+    __publicField(this, "fieldElement", null);
+    __publicField(this, "resetBtn", null);
+    __publicField(this, "clearBtn", null);
+    __publicField(this, "boundOnChange", () => this.setValue(this.getValue(), { silent: false, action: "change" }));
+    __publicField(this, "boundOnReset", () => this.onReset());
+    __publicField(this, "boundOnClear", () => this.onClear());
+  }
+  /**
+   * Lifecycle: Component connected to DOM
+   */
+  connectedCallback() {
+    super.connectedCallback();
+  }
+  /**
+   * Lifecycle: Component disconnected from DOM
+   */
+  disconnectedCallback() {
+    super.disconnectedCallback();
+  }
+  /**
+   * Render action buttons (clear/reset) using this.builder.
+   * Must be called from within a build() callback.
+   */
+  renderActionButtons(force = false) {
+    this.renderClearButton(force);
+    this.renderResetButton(force);
+  }
+  renderResetButton(force = false) {
+    const { button } = aeico.tags;
+    if (force || this.resettable) {
+      this.resetBtn = button({
+        className: "reset-btn",
+        textContent: this.resetText || "↺",
+        title: aeicoLocalize.t("buttons.reset", "↺"),
+        "@click": this.boundOnReset
+      });
+    }
+  }
+  renderClearButton(force = false) {
+    const { button } = aeico.tags;
+    if (force || this.clearable) {
+      this.clearBtn = button({
+        className: "clear-btn",
+        textContent: this.clearText || "✕",
+        title: aeicoLocalize.t("buttons.clear", "✕"),
+        "@click": this.boundOnClear
+      });
+    }
+  }
+  /**
+   * Watcher for disabled property
+   */
+  onDisabledChanged(newValue) {
+    if (this.fieldElement) {
+      this.fieldElement.disabled = Boolean(newValue);
+    }
+  }
+  /**
+   * Render the field component
+   * Override in subclass to provide custom rendering
+   */
+  render() {
+  }
+  /**
+   * Get current value from the field element
+   * Default implementation returns the value property of fieldElement
+   * Override in subclasses if needed (e.g., checkbox uses checked instead of value)
+   *
+   * @returns Current field value
+   */
+  getValue() {
+    var _a;
+    return ((_a = this.fieldElement) == null ? void 0 : _a.value) || "";
+  }
+  /**
+   * Write value to the underlying UI element and sync props
+   * Subclasses must override this to update their specific UI element
+   *
+   * @param _value New value to write to the element
+   */
+  writeValue(_value) {
+  }
+  /**
+   * Get event payload for change events
+   * Override in subclasses to customize event data (e.g., { checked, oldChecked } for checkbox)
+   *
+   * @param value New value
+   * @param oldValue Previous value
+   * @param action Action type
+   * @returns Event payload object
+   */
+  getEventPayload(value, oldValue, action) {
+    return { value, oldValue, action };
+  }
+  /**
+   * Update field value programmatically (internal method)
+   * Subclasses should provide type-safe public wrappers (e.g., change() method)
+   *
+   * @param value New value
+   * @param options.silent If true, won't emit change event (default: true)
+   * @param options.action Action type for the event (default: 'change')
+   */
+  setValue(value, options) {
+    const oldValue = this.getValue();
+    this.value = value;
+    this.writeValue(value);
+    if ((options == null ? void 0 : options.silent) === false) {
+      const payload = this.getEventPayload(value, oldValue, options.action || "change");
+      this.emit("change", { detail: payload });
+    }
+  }
+  /**
+   * Reset field to specified value or default value
+   *
+   * @param value Value to reset to, defaults to defaultValue prop
+   * @param options.silent If false, will emit reset event (default: true)
+   */
+  reset(value, options) {
+    const resetValue = value !== void 0 ? value : this.defaultValue;
+    this.setValue(resetValue, { ...options, action: "reset" });
+  }
+  /**
+   * Clear the field value
+   *
+   * @param options.silent If false, will emit clear event (default: true)
+   */
+  clear(options) {
+    this.setValue("", { ...options, action: "clear" });
+  }
+  /**
+   * Handle clear button click
+   * Clears the field and dispatches event
+   */
+  onClear() {
+    this.clear({ silent: false });
+  }
+  /**
+   * Handle reset button click
+   * Resets to default value and dispatches event
+   */
+  onReset() {
+    this.reset(void 0, { silent: false });
+  }
+}
+/**
+ * Define base field properties (extends AeicoElement properties)
+ */
+__publicField(AeicoField, "props", {
+  value: { type: String },
+  defaultValue: { type: String },
+  resettable: { type: Boolean },
+  resetText: { type: String },
+  clearable: { type: Boolean },
+  clearText: { type: String },
+  size: { type: String },
+  disabled: { type: Boolean }
+});
+/**
+ * Property watchers
+ */
+__publicField(AeicoField, "watchers", {
+  disabled: "onDisabledChanged"
+});
+exports.AeicoField = AeicoField;
+//# sourceMappingURL=aeico-field.cjs.map

package/dist/chunks/aeico-field.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"aeico-field.cjs","sources":["../../src/aeico-field.ts"],"sourcesContent":["import type { InferProps, Props, Watchers } from 'aeico';\nimport { tags } from 'aeico';\nimport AeicoComponent from './aeico-component';\nimport { t } from 'aeico-localize';\n\nexport type FieldAction = 'clear' | 'reset' | 'change';\nexport type FieldElement = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;\n\n/**\n * Base class for form field components\n *\n * Provides common functionality for field components including:\n * - Theme support\n * - i18n integration (via Localizable mixin)\n * - Reset button management\n * - Value management\n * - Common configuration handling\n */\nclass AeicoField<TValue = string> extends AeicoComponent {\n  /**\n   * Define base field properties (extends AeicoElement properties)\n   */\n  static props: Props = {\n    value: { type: String },\n    defaultValue: { type: String },\n    resettable: { type: Boolean },\n    resetText: { type: String },\n    clearable: { type: Boolean },\n    clearText: { type: String },\n    size: { type: String },\n    disabled: { type: Boolean },\n  };\n\n  /**\n   * Property watchers\n   */\n  static watchers: Watchers = {\n    disabled: 'onDisabledChanged',\n  };\n\n  /**\n   * The underlying form control element (input, select, etc.)\n   * Subclasses should set this to their specific element\n   */\n  protected fieldElement: FieldElement | null = null;\n\n  protected resetBtn: HTMLButtonElement | null = null;\n  protected clearBtn: HTMLButtonElement | null = null;\n\n  protected readonly boundOnChange = () =>\n    this.setValue(this.getValue(), { silent: false, action: 'change' });\n\n  protected readonly boundOnReset = () => this.onReset();\n  protected readonly boundOnClear = () => this.onClear();\n\n  // Declare reactive properties for TypeScript\n  declare value?: TValue;\n  declare defaultValue?: TValue | string;\n  declare resettable?: boolean;\n  declare resetText?: string;\n  declare clearable?: boolean;\n  declare clearText?: string;\n  declare size?: string;\n  declare disabled?: boolean;\n\n  /**\n   * Lifecycle: Component connected to DOM\n   */\n  connectedCallback() {\n    super.connectedCallback();\n  }\n\n  /**\n   * Lifecycle: Component disconnected from DOM\n   */\n  disconnectedCallback() {\n    super.disconnectedCallback();\n  }\n\n  /**\n   * Render action buttons (clear/reset) using this.builder.\n   * Must be called from within a build() callback.\n   */\n  protected renderActionButtons(force: boolean = false) {\n    this.renderClearButton(force);\n    this.renderResetButton(force);\n  }\n\n  protected renderResetButton(force: boolean = false) {\n    const { button } = tags;\n\n    if (force || this.resettable) {\n      this.resetBtn = button({\n        className: 'reset-btn',\n        textContent: this.resetText || '↺',\n        title: t('buttons.reset', '↺'),\n        '@click': this.boundOnReset,\n      });\n    }\n  }\n\n  protected renderClearButton(force: boolean = false) {\n    const { button } = tags;\n\n    if (force || this.clearable) {\n      this.clearBtn = button({\n        className: 'clear-btn',\n        textContent: this.clearText || '✕',\n        title: t('buttons.clear', '✕'),\n        '@click': this.boundOnClear,\n      });\n    }\n  }\n\n  /**\n   * Watcher for disabled property\n   */\n  protected onDisabledChanged(newValue: boolean) {\n    if (this.fieldElement) {\n      (this.fieldElement as HTMLInputElement | HTMLSelectElement).disabled = Boolean(newValue);\n    }\n  }\n\n  /**\n   * Render the field component\n   * Override in subclass to provide custom rendering\n   */\n  render(): void {\n    // Default implementation - subclasses can override\n  }\n\n  /**\n   * Get current value from the field element\n   * Default implementation returns the value property of fieldElement\n   * Override in subclasses if needed (e.g., checkbox uses checked instead of value)\n   *\n   * @returns Current field value\n   */\n  protected getValue(): any {\n    return this.fieldElement?.value || '';\n  }\n\n  /**\n   * Write value to the underlying UI element and sync props\n   * Subclasses must override this to update their specific UI element\n   *\n   * @param _value New value to write to the element\n   */\n  protected writeValue(_value: any): void {\n    // Base implementation - subclasses override\n  }\n\n  /**\n   * Get event payload for change events\n   * Override in subclasses to customize event data (e.g., { checked, oldChecked } for checkbox)\n   *\n   * @param value New value\n   * @param oldValue Previous value\n   * @param action Action type\n   * @returns Event payload object\n   */\n  protected getEventPayload(value: any, oldValue: any, action: FieldAction): Record<string, any> {\n    return { value, oldValue, action };\n  }\n\n  /**\n   * Update field value programmatically (internal method)\n   * Subclasses should provide type-safe public wrappers (e.g., change() method)\n   *\n   * @param value New value\n   * @param options.silent If true, won't emit change event (default: true)\n   * @param options.action Action type for the event (default: 'change')\n   */\n  protected setValue(value: any, options?: { silent?: boolean; action?: FieldAction }): void {\n    const oldValue = this.getValue();\n\n    // Update property value\n    this.value = value;\n\n    // Write to UI element (DOM only)\n    this.writeValue(value);\n\n    // Emit event if not silent\n    if (options?.silent === false) {\n      const payload = this.getEventPayload(value, oldValue, options.action || 'change');\n      this.emit('change', { detail: payload });\n    }\n  }\n\n  /**\n   * Reset field to specified value or default value\n   *\n   * @param value Value to reset to, defaults to defaultValue prop\n   * @param options.silent If false, will emit reset event (default: true)\n   */\n  public reset(value?: any, options?: { silent?: boolean }): void {\n    const resetValue = value !== undefined ? value : this.defaultValue;\n    this.setValue(resetValue, { ...options, action: 'reset' });\n  }\n\n  /**\n   * Clear the field value\n   *\n   * @param options.silent If false, will emit clear event (default: true)\n   */\n  public clear(options?: { silent?: boolean }): void {\n    this.setValue('', { ...options, action: 'clear' });\n  }\n\n  /**\n   * Handle clear button click\n   * Clears the field and dispatches event\n   */\n  protected onClear(): void {\n    this.clear({ silent: false });\n  }\n\n  /**\n   * Handle reset button click\n   * Resets to default value and dispatches event\n   */\n  protected onReset(): void {\n    this.reset(undefined, { silent: false });\n  }\n}\n\nexport default AeicoField;\nexport type AeicoFieldProps = InferProps<typeof AeicoField>;\n"],"names":["AeicoComponent","tags","t"],"mappings":"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"}

package/dist/chunks/aeico-field.js

@@ -0,0 +1,180 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+import { tags } from "aeico";
+import { A as AeicoComponent } from "./aeico-component.js";
+import { t } from "aeico-localize";
+class AeicoField extends AeicoComponent {
+  constructor() {
+    super(...arguments);
+    /**
+     * The underlying form control element (input, select, etc.)
+     * Subclasses should set this to their specific element
+     */
+    __publicField(this, "fieldElement", null);
+    __publicField(this, "resetBtn", null);
+    __publicField(this, "clearBtn", null);
+    __publicField(this, "boundOnChange", () => this.setValue(this.getValue(), { silent: false, action: "change" }));
+    __publicField(this, "boundOnReset", () => this.onReset());
+    __publicField(this, "boundOnClear", () => this.onClear());
+  }
+  /**
+   * Lifecycle: Component connected to DOM
+   */
+  connectedCallback() {
+    super.connectedCallback();
+  }
+  /**
+   * Lifecycle: Component disconnected from DOM
+   */
+  disconnectedCallback() {
+    super.disconnectedCallback();
+  }
+  /**
+   * Render action buttons (clear/reset) using this.builder.
+   * Must be called from within a build() callback.
+   */
+  renderActionButtons(force = false) {
+    this.renderClearButton(force);
+    this.renderResetButton(force);
+  }
+  renderResetButton(force = false) {
+    const { button } = tags;
+    if (force || this.resettable) {
+      this.resetBtn = button({
+        className: "reset-btn",
+        textContent: this.resetText || "↺",
+        title: t("buttons.reset", "↺"),
+        "@click": this.boundOnReset
+      });
+    }
+  }
+  renderClearButton(force = false) {
+    const { button } = tags;
+    if (force || this.clearable) {
+      this.clearBtn = button({
+        className: "clear-btn",
+        textContent: this.clearText || "✕",
+        title: t("buttons.clear", "✕"),
+        "@click": this.boundOnClear
+      });
+    }
+  }
+  /**
+   * Watcher for disabled property
+   */
+  onDisabledChanged(newValue) {
+    if (this.fieldElement) {
+      this.fieldElement.disabled = Boolean(newValue);
+    }
+  }
+  /**
+   * Render the field component
+   * Override in subclass to provide custom rendering
+   */
+  render() {
+  }
+  /**
+   * Get current value from the field element
+   * Default implementation returns the value property of fieldElement
+   * Override in subclasses if needed (e.g., checkbox uses checked instead of value)
+   *
+   * @returns Current field value
+   */
+  getValue() {
+    var _a;
+    return ((_a = this.fieldElement) == null ? void 0 : _a.value) || "";
+  }
+  /**
+   * Write value to the underlying UI element and sync props
+   * Subclasses must override this to update their specific UI element
+   *
+   * @param _value New value to write to the element
+   */
+  writeValue(_value) {
+  }
+  /**
+   * Get event payload for change events
+   * Override in subclasses to customize event data (e.g., { checked, oldChecked } for checkbox)
+   *
+   * @param value New value
+   * @param oldValue Previous value
+   * @param action Action type
+   * @returns Event payload object
+   */
+  getEventPayload(value, oldValue, action) {
+    return { value, oldValue, action };
+  }
+  /**
+   * Update field value programmatically (internal method)
+   * Subclasses should provide type-safe public wrappers (e.g., change() method)
+   *
+   * @param value New value
+   * @param options.silent If true, won't emit change event (default: true)
+   * @param options.action Action type for the event (default: 'change')
+   */
+  setValue(value, options) {
+    const oldValue = this.getValue();
+    this.value = value;
+    this.writeValue(value);
+    if ((options == null ? void 0 : options.silent) === false) {
+      const payload = this.getEventPayload(value, oldValue, options.action || "change");
+      this.emit("change", { detail: payload });
+    }
+  }
+  /**
+   * Reset field to specified value or default value
+   *
+   * @param value Value to reset to, defaults to defaultValue prop
+   * @param options.silent If false, will emit reset event (default: true)
+   */
+  reset(value, options) {
+    const resetValue = value !== void 0 ? value : this.defaultValue;
+    this.setValue(resetValue, { ...options, action: "reset" });
+  }
+  /**
+   * Clear the field value
+   *
+   * @param options.silent If false, will emit clear event (default: true)
+   */
+  clear(options) {
+    this.setValue("", { ...options, action: "clear" });
+  }
+  /**
+   * Handle clear button click
+   * Clears the field and dispatches event
+   */
+  onClear() {
+    this.clear({ silent: false });
+  }
+  /**
+   * Handle reset button click
+   * Resets to default value and dispatches event
+   */
+  onReset() {
+    this.reset(void 0, { silent: false });
+  }
+}
+/**
+ * Define base field properties (extends AeicoElement properties)
+ */
+__publicField(AeicoField, "props", {
+  value: { type: String },
+  defaultValue: { type: String },
+  resettable: { type: Boolean },
+  resetText: { type: String },
+  clearable: { type: Boolean },
+  clearText: { type: String },
+  size: { type: String },
+  disabled: { type: Boolean }
+});
+/**
+ * Property watchers
+ */
+__publicField(AeicoField, "watchers", {
+  disabled: "onDisabledChanged"
+});
+export {
+  AeicoField as A
+};
+//# sourceMappingURL=aeico-field.js.map

package/dist/chunks/aeico-field.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"aeico-field.js","sources":["../../src/aeico-field.ts"],"sourcesContent":["import type { InferProps, Props, Watchers } from 'aeico';\nimport { tags } from 'aeico';\nimport AeicoComponent from './aeico-component';\nimport { t } from 'aeico-localize';\n\nexport type FieldAction = 'clear' | 'reset' | 'change';\nexport type FieldElement = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;\n\n/**\n * Base class for form field components\n *\n * Provides common functionality for field components including:\n * - Theme support\n * - i18n integration (via Localizable mixin)\n * - Reset button management\n * - Value management\n * - Common configuration handling\n */\nclass AeicoField<TValue = string> extends AeicoComponent {\n  /**\n   * Define base field properties (extends AeicoElement properties)\n   */\n  static props: Props = {\n    value: { type: String },\n    defaultValue: { type: String },\n    resettable: { type: Boolean },\n    resetText: { type: String },\n    clearable: { type: Boolean },\n    clearText: { type: String },\n    size: { type: String },\n    disabled: { type: Boolean },\n  };\n\n  /**\n   * Property watchers\n   */\n  static watchers: Watchers = {\n    disabled: 'onDisabledChanged',\n  };\n\n  /**\n   * The underlying form control element (input, select, etc.)\n   * Subclasses should set this to their specific element\n   */\n  protected fieldElement: FieldElement | null = null;\n\n  protected resetBtn: HTMLButtonElement | null = null;\n  protected clearBtn: HTMLButtonElement | null = null;\n\n  protected readonly boundOnChange = () =>\n    this.setValue(this.getValue(), { silent: false, action: 'change' });\n\n  protected readonly boundOnReset = () => this.onReset();\n  protected readonly boundOnClear = () => this.onClear();\n\n  // Declare reactive properties for TypeScript\n  declare value?: TValue;\n  declare defaultValue?: TValue | string;\n  declare resettable?: boolean;\n  declare resetText?: string;\n  declare clearable?: boolean;\n  declare clearText?: string;\n  declare size?: string;\n  declare disabled?: boolean;\n\n  /**\n   * Lifecycle: Component connected to DOM\n   */\n  connectedCallback() {\n    super.connectedCallback();\n  }\n\n  /**\n   * Lifecycle: Component disconnected from DOM\n   */\n  disconnectedCallback() {\n    super.disconnectedCallback();\n  }\n\n  /**\n   * Render action buttons (clear/reset) using this.builder.\n   * Must be called from within a build() callback.\n   */\n  protected renderActionButtons(force: boolean = false) {\n    this.renderClearButton(force);\n    this.renderResetButton(force);\n  }\n\n  protected renderResetButton(force: boolean = false) {\n    const { button } = tags;\n\n    if (force || this.resettable) {\n      this.resetBtn = button({\n        className: 'reset-btn',\n        textContent: this.resetText || '↺',\n        title: t('buttons.reset', '↺'),\n        '@click': this.boundOnReset,\n      });\n    }\n  }\n\n  protected renderClearButton(force: boolean = false) {\n    const { button } = tags;\n\n    if (force || this.clearable) {\n      this.clearBtn = button({\n        className: 'clear-btn',\n        textContent: this.clearText || '✕',\n        title: t('buttons.clear', '✕'),\n        '@click': this.boundOnClear,\n      });\n    }\n  }\n\n  /**\n   * Watcher for disabled property\n   */\n  protected onDisabledChanged(newValue: boolean) {\n    if (this.fieldElement) {\n      (this.fieldElement as HTMLInputElement | HTMLSelectElement).disabled = Boolean(newValue);\n    }\n  }\n\n  /**\n   * Render the field component\n   * Override in subclass to provide custom rendering\n   */\n  render(): void {\n    // Default implementation - subclasses can override\n  }\n\n  /**\n   * Get current value from the field element\n   * Default implementation returns the value property of fieldElement\n   * Override in subclasses if needed (e.g., checkbox uses checked instead of value)\n   *\n   * @returns Current field value\n   */\n  protected getValue(): any {\n    return this.fieldElement?.value || '';\n  }\n\n  /**\n   * Write value to the underlying UI element and sync props\n   * Subclasses must override this to update their specific UI element\n   *\n   * @param _value New value to write to the element\n   */\n  protected writeValue(_value: any): void {\n    // Base implementation - subclasses override\n  }\n\n  /**\n   * Get event payload for change events\n   * Override in subclasses to customize event data (e.g., { checked, oldChecked } for checkbox)\n   *\n   * @param value New value\n   * @param oldValue Previous value\n   * @param action Action type\n   * @returns Event payload object\n   */\n  protected getEventPayload(value: any, oldValue: any, action: FieldAction): Record<string, any> {\n    return { value, oldValue, action };\n  }\n\n  /**\n   * Update field value programmatically (internal method)\n   * Subclasses should provide type-safe public wrappers (e.g., change() method)\n   *\n   * @param value New value\n   * @param options.silent If true, won't emit change event (default: true)\n   * @param options.action Action type for the event (default: 'change')\n   */\n  protected setValue(value: any, options?: { silent?: boolean; action?: FieldAction }): void {\n    const oldValue = this.getValue();\n\n    // Update property value\n    this.value = value;\n\n    // Write to UI element (DOM only)\n    this.writeValue(value);\n\n    // Emit event if not silent\n    if (options?.silent === false) {\n      const payload = this.getEventPayload(value, oldValue, options.action || 'change');\n      this.emit('change', { detail: payload });\n    }\n  }\n\n  /**\n   * Reset field to specified value or default value\n   *\n   * @param value Value to reset to, defaults to defaultValue prop\n   * @param options.silent If false, will emit reset event (default: true)\n   */\n  public reset(value?: any, options?: { silent?: boolean }): void {\n    const resetValue = value !== undefined ? value : this.defaultValue;\n    this.setValue(resetValue, { ...options, action: 'reset' });\n  }\n\n  /**\n   * Clear the field value\n   *\n   * @param options.silent If false, will emit clear event (default: true)\n   */\n  public clear(options?: { silent?: boolean }): void {\n    this.setValue('', { ...options, action: 'clear' });\n  }\n\n  /**\n   * Handle clear button click\n   * Clears the field and dispatches event\n   */\n  protected onClear(): void {\n    this.clear({ silent: false });\n  }\n\n  /**\n   * Handle reset button click\n   * Resets to default value and dispatches event\n   */\n  protected onReset(): void {\n    this.reset(undefined, { silent: false });\n  }\n}\n\nexport default AeicoField;\nexport type AeicoFieldProps = InferProps<typeof AeicoField>;\n"],"names":[],"mappings":"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"}