@mmlogic/components 0.3.5 → 0.3.6

package/dist/{collection/components/mrd-form/mrd-form.js → mosterdcomponents/mrd-form.entry.js}

@@ -1,9 +1,19 @@
-import { Host, h } from "@stencil/core";
-import { ClientLayoutItemType, ClientLayoutItemRelationEditBehavior } from "../../types";
-import { t } from "../../utils/i18n";
-import { validateRequired } from "../../utils/validation";
-export class MrdForm {
-    constructor() {
+import { r as registerInstance, a as createEvent, h, d as Host } from './index-B_tPFIvS.js';
+import './index-I5SuYv7a.js';
+import { t } from './i18n-hoGGKbKU.js';
+import { v as validateRequired } from './validation-ixb43cqU.js';
+import { a as ClientLayoutItemType, d as ClientLayoutItemRelationEditBehavior } from './client-layout-D88nn5zf.js';
+
+const mrdFormScss = () => `.sc-mrd-form-h{display:block}.mrd-form.sc-mrd-form{font-family:var(--mrd-font-family);width:100%}.mrd-form__title.sc-mrd-form{font-size:var(--mrd-font-size-2xl);font-weight:var(--mrd-font-weight-bold);color:var(--mrd-color-neutral-900);margin:0 0 var(--mrd-space-6) 0}.mrd-form__body.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-5)}.mrd-form__field.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-1)}.mrd-form__field-error.sc-mrd-form{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}.mrd-form__section.sc-mrd-form{border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius-md);padding:var(--mrd-space-4) var(--mrd-space-5);margin:0}.mrd-form__section-legend.sc-mrd-form{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);font-weight:var(--mrd-font-weight-semibold);color:var(--mrd-color-neutral-700);padding:0 var(--mrd-space-2)}.mrd-form__section-body.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-4);margin-top:var(--mrd-space-2)}.mrd-form__group.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-2)}.mrd-form__group-label.sc-mrd-form{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-semibold);color:var(--mrd-color-neutral-500);text-transform:uppercase;letter-spacing:0.05em}.mrd-form__group-body.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-4);padding-left:var(--mrd-space-4);border-left:3px solid var(--mrd-color-neutral-200)}.mrd-form__footer.sc-mrd-form{margin-top:var(--mrd-space-8);padding-top:var(--mrd-space-5);border-top:var(--mrd-border-width) solid var(--mrd-border-color);display:flex;justify-content:flex-end;gap:var(--mrd-space-3)}.mrd-form__submit.sc-mrd-form{display:inline-flex;align-items:center;justify-content:center;height:var(--mrd-input-height);padding:0 var(--mrd-space-6);background-color:var(--mrd-color-primary);color:var(--mrd-color-white);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);font-weight:var(--mrd-font-weight-medium);border:none;border-radius:var(--mrd-border-radius);cursor:pointer;transition:background-color var(--mrd-transition)}.mrd-form__submit.sc-mrd-form:hover{background-color:var(--mrd-color-primary-hover)}.mrd-form__submit.sc-mrd-form:focus{outline:none;box-shadow:var(--mrd-shadow-focus)}.mrd-form__submit.sc-mrd-form:active{background-color:var(--mrd-color-primary-dark)}.mrd-form__cancel.sc-mrd-form{display:inline-flex;align-items:center;justify-content:center;height:var(--mrd-input-height);padding:0 var(--mrd-space-6);background-color:transparent;color:var(--mrd-color-neutral-600);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);font-weight:var(--mrd-font-weight-medium);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);cursor:pointer;transition:background-color var(--mrd-transition), color var(--mrd-transition)}.mrd-form__cancel.sc-mrd-form:hover{background-color:var(--mrd-color-neutral-100);color:var(--mrd-color-neutral-800)}.mrd-form__cancel.sc-mrd-form:focus{outline:none;box-shadow:var(--mrd-shadow-focus)}.mrd-form__cancel.sc-mrd-form:active{background-color:var(--mrd-color-neutral-200)}`;
+
+const MrdForm = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.mrdSubmit = createEvent(this, "mrdSubmit", 7);
+        this.mrdCancel = createEvent(this, "mrdCancel", 7);
+        this.mrdSearch = createEvent(this, "mrdSearch", 7);
+        this.mrdFetchAll = createEvent(this, "mrdFetchAll", 7);
+        this.mrdUpload = createEvent(this, "mrdUpload", 7);
         this.locale = navigator.language;
         this.values = {};
         /**
@@ -352,305 +362,18 @@ export class MrdForm {
         const dir = this.locale.startsWith('ar') ? 'rtl' : 'ltr';
         return (h(Host, null, h("form", { class: "mrd-form", dir: dir, onSubmit: this.handleSubmit, noValidate: true }, this.layout.title && h("h2", { class: "mrd-form__title" }, this.layout.title), h("div", { class: "mrd-form__body" }, this.renderItems(this.layout.items)), h("div", { class: "mrd-form__footer" }, h("button", { type: "submit", class: "mrd-form__submit" }, t('submit', this.locale)), this.showCancel && (h("button", { type: "button", class: "mrd-form__cancel", onClick: () => this.mrdCancel.emit() }, t('cancel', this.locale)))))));
     }
-    static get is() { return "mrd-form"; }
-    static get encapsulation() { return "scoped"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["mrd-form.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["mrd-form.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "layout": {
-                "type": "unknown",
-                "mutable": false,
-                "complexType": {
-                    "original": "ClientLayout",
-                    "resolved": "ClientLayout",
-                    "references": {
-                        "ClientLayout": {
-                            "location": "import",
-                            "path": "../../types",
-                            "id": "src/types/index.ts::ClientLayout",
-                            "referenceLocation": "ClientLayout"
-                        }
-                    }
-                },
-                "required": true,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false
-            },
-            "locale": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "locale",
-                "defaultValue": "navigator.language"
-            },
-            "values": {
-                "type": "unknown",
-                "mutable": false,
-                "complexType": {
-                    "original": "Record<string, unknown>",
-                    "resolved": "string | unknown",
-                    "references": {
-                        "Record": {
-                            "location": "global",
-                            "id": "global::Record"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "defaultValue": "{}"
-            },
-            "referenceHref": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Absolute href of the parent/reference object (e.g. the clientAgreement href\nwhen creating an invoice from within a client agreement).\nCombined with `referenceClass`, mrd-form will automatically pre-fill the\nmatching relation field so dependent DROPDOWN fields can be fetched on load."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "reference-href",
-                "defaultValue": "''"
-            },
-            "referenceClass": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The `mostSignificantClass` of the parent/reference object\n(e.g. `'clientAgreements'`). Used to locate the matching RELATION field."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "reference-class",
-                "defaultValue": "''"
-            },
-            "showCancel": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "When true, a cancel button is shown next to the submit button."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "show-cancel",
-                "defaultValue": "false"
-            },
-            "me": {
-                "type": "unknown",
-                "mutable": false,
-                "complexType": {
-                    "original": "RelationSearchResult | null",
-                    "resolved": "RelationSearchResult | null",
-                    "references": {
-                        "RelationSearchResult": {
-                            "location": "import",
-                            "path": "../../types",
-                            "id": "src/types/index.ts::RelationSearchResult",
-                            "referenceLocation": "RelationSearchResult"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The currently logged-in user, resolved by the host via /accounts/me.\nUsed to pre-fill RELATION fields whose defaultValue is \"@me\".\nMay be null when not authenticated or not yet resolved."
-                },
-                "getter": false,
-                "setter": false,
-                "defaultValue": "null"
-            }
-        };
-    }
-    static get states() {
-        return {
-            "formValues": {},
-            "errors": {},
-            "submitted": {}
-        };
-    }
-    static get events() {
-        return [{
-                "method": "mrdSubmit",
-                "name": "mrdSubmit",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "Record<string, unknown>",
-                    "resolved": "string | unknown",
-                    "references": {
-                        "Record": {
-                            "location": "global",
-                            "id": "global::Record"
-                        }
-                    }
-                }
-            }, {
-                "method": "mrdCancel",
-                "name": "mrdCancel",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "void",
-                    "resolved": "void",
-                    "references": {}
-                }
-            }, {
-                "method": "mrdSearch",
-                "name": "mrdSearch",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "{ name: string; query: string; relatedClass: string }",
-                    "resolved": "{ name: string; query: string; relatedClass: string; }",
-                    "references": {}
-                }
-            }, {
-                "method": "mrdFetchAll",
-                "name": "mrdFetchAll",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "{ name: string; relatedClass: string; mostSignificantClass?: string; commonRelation?: string; filter?: string; filterValue?: string }",
-                    "resolved": "{ name: string; relatedClass: string; mostSignificantClass?: string | undefined; commonRelation?: string | undefined; filter?: string | undefined; filterValue?: string | undefined; }",
-                    "references": {}
-                }
-            }, {
-                "method": "mrdUpload",
-                "name": "mrdUpload",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "{ name: string; file: File }",
-                    "resolved": "{ name: string; file: File; }",
-                    "references": {
-                        "File": {
-                            "location": "global",
-                            "id": "global::File"
-                        }
-                    }
-                }
-            }];
-    }
-    static get methods() {
-        return {
-            "setFieldValue": {
-                "complexType": {
-                    "signature": "(name: string, value: unknown) => Promise<void>",
-                    "parameters": [{
-                            "name": "name",
-                            "type": "string",
-                            "docs": ""
-                        }, {
-                            "name": "value",
-                            "type": "unknown",
-                            "docs": ""
-                        }],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        }
-                    },
-                    "return": "Promise<void>"
-                },
-                "docs": {
-                    "text": "",
-                    "tags": []
-                }
-            }
-        };
-    }
-    static get watchers() {
-        return [{
-                "propName": "values",
-                "methodName": "valuesChanged"
-            }, {
-                "propName": "me",
-                "methodName": "meChanged"
-            }];
-    }
-}
+    static get watchers() { return {
+        "values": [{
+                "valuesChanged": 0
+            }],
+        "me": [{
+                "meChanged": 0
+            }]
+    }; }
+};
+MrdForm.style = mrdFormScss();
+
+export { MrdForm as mrd_form };
+//# sourceMappingURL=mrd-form.entry.esm.js.map
+
+//# sourceMappingURL=mrd-form.entry.js.map

package/dist/mosterdcomponents/mrd-form.entry.js.map

@@ -0,0 +1 @@
+{"file":"mrd-form.entry.js","mappings":"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","names":[],"sources":["src/components/mrd-form/mrd-form.scss?tag=mrd-form&encapsulation=scoped","src/components/mrd-form/mrd-form.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.mrd-form {\n  font-family: var(--mrd-font-family);\n  width: 100%;\n}\n\n.mrd-form__title {\n  font-size: var(--mrd-font-size-2xl);\n  font-weight: var(--mrd-font-weight-bold);\n  color: var(--mrd-color-neutral-900);\n  margin: 0 0 var(--mrd-space-6) 0;\n}\n\n.mrd-form__body {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mrd-space-5);\n}\n\n.mrd-form__field {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mrd-space-1);\n}\n\n.mrd-form__field-error {\n  font-family: var(--mrd-font-family);\n  font-size: var(--mrd-error-font-size);\n  color: var(--mrd-error-color);\n}\n\n.mrd-form__section {\n  border: var(--mrd-border-width) solid var(--mrd-border-color);\n  border-radius: var(--mrd-border-radius-md);\n  padding: var(--mrd-space-4) var(--mrd-space-5);\n  margin: 0;\n}\n\n.mrd-form__section-legend {\n  font-family: var(--mrd-font-family);\n  font-size: var(--mrd-font-size-base);\n  font-weight: var(--mrd-font-weight-semibold);\n  color: var(--mrd-color-neutral-700);\n  padding: 0 var(--mrd-space-2);\n}\n\n.mrd-form__section-body {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mrd-space-4);\n  margin-top: var(--mrd-space-2);\n}\n\n.mrd-form__group {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mrd-space-2);\n}\n\n.mrd-form__group-label {\n  font-family: var(--mrd-font-family);\n  font-size: var(--mrd-font-size-sm);\n  font-weight: var(--mrd-font-weight-semibold);\n  color: var(--mrd-color-neutral-500);\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n}\n\n.mrd-form__group-body {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mrd-space-4);\n  padding-left: var(--mrd-space-4);\n  border-left: 3px solid var(--mrd-color-neutral-200);\n}\n\n.mrd-form__footer {\n  margin-top: var(--mrd-space-8);\n  padding-top: var(--mrd-space-5);\n  border-top: var(--mrd-border-width) solid var(--mrd-border-color);\n  display: flex;\n  justify-content: flex-end;\n  gap: var(--mrd-space-3);\n}\n\n.mrd-form__submit {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  height: var(--mrd-input-height);\n  padding: 0 var(--mrd-space-6);\n  background-color: var(--mrd-color-primary);\n  color: var(--mrd-color-white);\n  font-family: var(--mrd-font-family);\n  font-size: var(--mrd-font-size-base);\n  font-weight: var(--mrd-font-weight-medium);\n  border: none;\n  border-radius: var(--mrd-border-radius);\n  cursor: pointer;\n  transition: background-color var(--mrd-transition);\n}\n\n.mrd-form__submit:hover {\n  background-color: var(--mrd-color-primary-hover);\n}\n\n.mrd-form__submit:focus {\n  outline: none;\n  box-shadow: var(--mrd-shadow-focus);\n}\n\n.mrd-form__submit:active {\n  background-color: var(--mrd-color-primary-dark);\n}\n\n.mrd-form__cancel {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  height: var(--mrd-input-height);\n  padding: 0 var(--mrd-space-6);\n  background-color: transparent;\n  color: var(--mrd-color-neutral-600);\n  font-family: var(--mrd-font-family);\n  font-size: var(--mrd-font-size-base);\n  font-weight: var(--mrd-font-weight-medium);\n  border: var(--mrd-border-width) solid var(--mrd-border-color);\n  border-radius: var(--mrd-border-radius);\n  cursor: pointer;\n  transition: background-color var(--mrd-transition), color var(--mrd-transition);\n}\n\n.mrd-form__cancel:hover {\n  background-color: var(--mrd-color-neutral-100);\n  color: var(--mrd-color-neutral-800);\n}\n\n.mrd-form__cancel:focus {\n  outline: none;\n  box-shadow: var(--mrd-shadow-focus);\n}\n\n.mrd-form__cancel:active {\n  background-color: var(--mrd-color-neutral-200);\n}\n","import { Component, Host, h, Prop, State, Event, EventEmitter, Method, Watch } from '@stencil/core';\nimport { ClientLayout, ClientLayoutItem, ClientLayoutItemFieldDataType, ClientLayoutItemType, ClientLayoutItemRelationEditBehavior, RelationSearchResult } from '../../types';\nimport { t } from '../../utils/i18n';\nimport { validateRequired } from '../../utils/validation';\n\n@Component({\n  tag: 'mrd-form',\n  styleUrl: 'mrd-form.scss',\n  scoped: true,\n})\nexport class MrdForm {\n  @Prop() layout!: ClientLayout;\n  @Prop() locale: string = navigator.language;\n  @Prop() values: Record<string, unknown> = {};\n  /**\n   * Absolute href of the parent/reference object (e.g. the clientAgreement href\n   * when creating an invoice from within a client agreement).\n   * Combined with `referenceClass`, mrd-form will automatically pre-fill the\n   * matching relation field so dependent DROPDOWN fields can be fetched on load\n   * — without the host app needing to know anything about the form layout.\n   */\n  /**\n   * Absolute href of the parent/reference object (e.g. the clientAgreement href\n   * when creating an invoice from within a client agreement).\n   * Combined with `referenceClass`, mrd-form will automatically pre-fill the\n   * matching relation field so dependent DROPDOWN fields can be fetched on load.\n   */\n  @Prop() referenceHref: string = '';\n  /**\n   * The `mostSignificantClass` of the parent/reference object\n   * (e.g. `'clientAgreements'`). Used to locate the matching RELATION field.\n   */\n  @Prop() referenceClass: string = '';\n  /** When true, a cancel button is shown next to the submit button. */\n  @Prop() showCancel: boolean = false;\n  /**\n   * The currently logged-in user, resolved by the host via /accounts/me.\n   * Used to pre-fill RELATION fields whose defaultValue is \"@me\".\n   * May be null when not authenticated or not yet resolved.\n   */\n  @Prop() me: RelationSearchResult | null = null;\n\n  @State() formValues: Record<string, unknown> = {};\n  @State() errors: Record<string, string> = {};\n  @State() submitted: boolean = false;\n\n  private initialValues: Record<string, unknown> = {};\n\n  @Event() mrdSubmit!: EventEmitter<Record<string, unknown>>;\n  @Event() mrdCancel!: EventEmitter<void>;\n  @Event() mrdSearch!: EventEmitter<{ name: string; query: string; relatedClass: string }>;\n  @Event() mrdFetchAll!: EventEmitter<{ name: string; relatedClass: string; mostSignificantClass?: string; commonRelation?: string; filter?: string; filterValue?: string }>;\n  @Event() mrdUpload!: EventEmitter<{ name: string; file: File }>;\n\n  componentWillLoad() {\n    this.initialValues = { ...(this.values ?? {}) };\n    this.formValues    = { ...(this.values ?? {}) };\n    this.applyDefaultValues();\n  }\n\n  componentDidLoad() {\n    // Apply reference pre-fill and emit mrdFetchAll for dependent DROPDOWN fields.\n    // Deferred so Angular/host prop bindings are settled before we read them.\n    setTimeout(() => {\n      this.applyReferenceValue();\n      this.emitDependentFetchAll();\n    }, 0);\n  }\n\n  /** Sync formValues when the values prop is set from outside after mount\n   *  (e.g. when pre-filling an existing record in edit mode). */\n  @Watch('values')\n  valuesChanged(newValues: Record<string, unknown>) {\n    this.initialValues = { ...(newValues ?? {}) };\n    this.formValues    = { ...(newValues ?? {}) };\n    this.applyReferenceValue();\n    this.applyDefaultValues();\n    this.errors     = {};\n    this.submitted  = false;\n    // Re-check DROPDOWN dependencies now that formValues are updated\n    setTimeout(() => this.emitDependentFetchAll(), 0);\n  }\n\n  /** Re-apply @me defaults when the me prop arrives after mount. */\n  @Watch('me')\n  meChanged() {\n    this.applyDefaultValues();\n  }\n\n  /** Apply defaultValue from layout items to fields that have no value yet.\n   *  Tokens: today() → YYYY-MM-DD, now() → YYYY-MM-DDTHH:mm, @me → this.me. */\n  private applyDefaultValues() {\n    const allFields = this.collectFields(this.layout?.items ?? []);\n    const updates: Record<string, unknown> = {};\n\n    for (const item of allFields) {\n      if (!item.name) continue;\n      const current = this.formValues[item.name];\n      if (current != null && current !== '') continue;\n\n      const dv = item.defaultValue ?? item.field?.defaultValue ?? item.relation?.defaultValue;\n      if (!dv) continue;\n\n      if (item.type === ClientLayoutItemType.FIELD) {\n        const resolved = this.resolveFieldDefault(dv, item.dataType ?? item.field?.dataType);\n        if (resolved != null) updates[item.name] = resolved;\n      } else if (item.type === ClientLayoutItemType.RELATION) {\n        if (dv === 'me()' && this.me) {\n          updates[item.name] = this.me;\n        }\n      }\n    }\n\n    if (Object.keys(updates).length > 0) {\n      this.formValues = { ...this.formValues, ...updates };\n    }\n  }\n\n  private resolveFieldDefault(dv: string, _dataType?: ClientLayoutItemFieldDataType): unknown {\n    if (dv === 'today()') {\n      return new Date().toISOString().slice(0, 10);\n    }\n    if (dv === 'now()') {\n      return new Date().toISOString().replace(/\\.\\d{3}Z$/, 'Z');\n    }\n    return dv;\n  }\n\n  /**\n   * When referenceHref + referenceClass are set, find the matching layout field\n   * and inject its value into formValues. This allows dependent DROPDOWN fields\n   * (those with commonRelation pointing to that field) to be fetched on load\n   * without the host app doing any form-domain logic.\n   *\n   * Two lookup strategies:\n   * 1. Find a RELATION whose mostSignificantClass matches referenceClass.\n   * 2. Fallback: find a DROPDOWN whose commonRelation field is absent from the\n   *    layout (API omitted it because it is implied by the reference context).\n   */\n  private applyReferenceValue() {\n    if (!this.referenceHref || !this.referenceClass) return;\n    const fieldName = this.resolveReferenceFieldName();\n    if (!fieldName) return;\n    // Only set when not already present (don't overwrite an explicit value)\n    if (!this.formValues[fieldName]) {\n      this.formValues = { ...this.formValues, [fieldName]: this.referenceHref };\n    }\n  }\n\n  private resolveReferenceFieldName(): string | null {\n    const allItems = this.collectFields(this.layout?.items ?? []);\n\n    // Strategy 1: direct match on mostSignificantClass\n    const direct = allItems.find(\n      item =>\n        item.type === ClientLayoutItemType.RELATION &&\n        item.mostSignificantClass === this.referenceClass,\n    );\n    if (direct?.name) return direct.name;\n\n    // Strategy 2: a DROPDOWN whose commonRelation field was omitted from the layout\n    const layoutRelationNames = new Set(\n      allItems\n        .filter(item => item.type === ClientLayoutItemType.RELATION)\n        .map(item => item.name!),\n    );\n    for (const item of allItems) {\n      if (\n        item.type === ClientLayoutItemType.RELATION &&\n        item.editBehavior === ClientLayoutItemRelationEditBehavior.DROPDOWN &&\n        item.commonRelation &&\n        !layoutRelationNames.has(item.commonRelation)\n      ) {\n        return item.commonRelation;\n      }\n    }\n\n    return null;\n  }\n\n  @Method()\n  async setFieldValue(name: string, value: unknown) {\n    this.formValues = { ...this.formValues, [name]: value };\n    if (this.errors[name]) {\n      this.errors = { ...this.errors, [name]: '' };\n    }\n  }\n\n  /** Collect all RELATION items that use editBehavior=DROPDOWN with a commonRelation. */\n  private collectDependentDropdowns(): ClientLayoutItem[] {\n    return this.collectFields(this.layout?.items ?? [])\n      .filter(item =>\n        item.type === ClientLayoutItemType.RELATION &&\n        item.editBehavior === ClientLayoutItemRelationEditBehavior.DROPDOWN &&\n        !!item.commonRelation,\n      );\n  }\n\n  /** Emit mrdFetchAll for every dependent DROPDOWN whose filter value is currently set. */\n  private emitDependentFetchAll() {\n    for (const item of this.collectDependentDropdowns()) {\n      const filterValue = this.getHref(this.formValues[item.commonRelation!]);\n      if (filterValue) {\n        this.mrdFetchAll.emit({\n          name: item.name!,\n          relatedClass: item.relatedClass!,\n          mostSignificantClass: item.mostSignificantClass,\n          commonRelation: item.commonRelation,\n          filter: item.commonRelation + '_href',\n          filterValue,\n        });\n      }\n    }\n  }\n\n  /** Extract a plain href string from a form value, which can be a string or\n   *  a RelationSearchResult-like object with an `id` field. */\n  private getHref(value: unknown): string {\n    if (!value) return '';\n    if (typeof value === 'string') return value;\n    if (typeof value === 'object' && 'id' in (value as object)) return (value as { id: string }).id;\n    return '';\n  }\n\n  private handleFieldChange = (e: CustomEvent<{ name: string; value: unknown }>) => {\n    const { name, value } = e.detail;\n    const prevHref = this.getHref(this.formValues[name]);\n    this.formValues = { ...this.formValues, [name]: value };\n    if (this.errors[name]) {\n      this.errors = { ...this.errors, [name]: '' };\n    }\n\n    // When a field changes, check if it is the commonRelation dependency for any\n    // DROPDOWN relation. If so, reset the dependent field and re-fetch its options.\n    // Skip when the effective href did not change (e.g. mrdBlur fires after mrdChange\n    // with the same value, which would otherwise trigger a duplicate fetch).\n    const newHref = this.getHref(value);\n    if (newHref === prevHref) return;\n\n    for (const item of this.collectDependentDropdowns()) {\n      if (item.commonRelation !== name) continue;\n\n      // Clear the dependent field's current selection (options have changed)\n      this.formValues = { ...this.formValues, [item.name!]: null };\n\n      this.mrdFetchAll.emit({\n        name: item.name!,\n        relatedClass: item.relatedClass!,\n        mostSignificantClass: item.mostSignificantClass,\n        commonRelation: item.commonRelation,\n        filter: item.commonRelation + '_href',\n        filterValue: newHref, // empty string when dependency was cleared → host should clear the list\n      });\n    }\n  };\n\n  private handleSearch = (e: CustomEvent<{ name: string; query: string; relatedClass: string }>) => {\n    e.stopPropagation();\n    this.mrdSearch.emit(e.detail);\n  };\n\n  private handleFetchAll = (e: CustomEvent<{ name: string; relatedClass: string; mostSignificantClass?: string; commonRelation?: string; filter?: string; filterValue?: string }>) => {\n    e.stopPropagation();\n    this.mrdFetchAll.emit(e.detail);\n  };\n\n  private handleUpload = (e: CustomEvent<{ name: string; file: File }>) => {\n    e.stopPropagation();\n    this.mrdUpload.emit(e.detail);\n  };\n\n  private collectFields(items: ClientLayoutItem[]): ClientLayoutItem[] {\n    const fields: ClientLayoutItem[] = [];\n    for (const item of items) {\n      if (item.type === ClientLayoutItemType.FIELD || item.type === ClientLayoutItemType.RELATION) {\n        fields.push(item);\n      }\n      if (item.items) {\n        fields.push(...this.collectFields(item.items));\n      }\n    }\n    return fields;\n  }\n\n  private validate(): boolean {\n    const newErrors: Record<string, string> = {};\n    const allFields = this.collectFields(this.layout?.items ?? []);\n\n    for (const item of allFields) {\n      if (!item.name) continue;\n      if (item.required && !validateRequired(this.formValues[item.name])) {\n        newErrors[item.name] = t('required', this.locale);\n      }\n    }\n\n    this.errors = newErrors;\n    return Object.keys(newErrors).length === 0;\n  }\n\n  private normalizeFieldValue(value: unknown): unknown {\n    return (value === '' || value == null) ? null : value;\n  }\n\n  private normalizeRelationValue(value: unknown): string | string[] | null {\n    if (value == null || value === '') return null;\n    if (typeof value === 'string') return value || null;\n    if (Array.isArray(value)) {\n      return (value as unknown[]).map(v =>\n        typeof v === 'object' && v !== null && 'id' in v ? (v as { id: string }).id : String(v),\n      );\n    }\n    if (typeof value === 'object' && 'id' in (value as object)) {\n      return (value as { id: string }).id || null;\n    }\n    return null;\n  }\n\n  private deepEqual(a: unknown, b: unknown): boolean {\n    if (a === b) return true;\n    if (a == null && b == null) return true;\n    if (a == null || b == null) return false;\n    if (Array.isArray(a) && Array.isArray(b)) {\n      if (a.length !== b.length) return false;\n      const sa = [...(a as unknown[])].sort();\n      const sb = [...(b as unknown[])].sort();\n      return JSON.stringify(sa) === JSON.stringify(sb);\n    }\n    return JSON.stringify(a) === JSON.stringify(b);\n  }\n\n  /** Build a submit payload containing only fields that changed relative to\n   *  initialValues. For a new record (POST) initialValues is empty, so every\n   *  non-null field is included. For edit (PATCH) only modified fields are sent,\n   *  including fields explicitly cleared to null.\n   */\n  private buildSubmitPayload(): Record<string, unknown> {\n    const payload: Record<string, unknown> = {};\n    const allFields = this.collectFields(this.layout?.items ?? []);\n\n    for (const item of allFields) {\n      if (!item.name) continue;\n      const name = item.name;\n      if (item.type === ClientLayoutItemType.FIELD) {\n        const rawValue = this.formValues[name];\n        if (rawValue instanceof File) continue;\n        const current = this.normalizeFieldValue(rawValue);\n        const initial = this.normalizeFieldValue(this.initialValues[name]);\n        if (this.deepEqual(current, initial)) continue;\n        payload[name] = current;\n      } else if (item.type === ClientLayoutItemType.RELATION) {\n        const current = this.normalizeRelationValue(this.formValues[name]);\n        const initial = this.normalizeRelationValue(this.initialValues[name]);\n        if (this.deepEqual(current, initial)) continue;\n        payload[name] = current;\n      }\n    }\n\n    return payload;\n  }\n\n  private handleSubmit = (e: Event) => {\n    e.preventDefault();\n    this.submitted = true;\n    if (this.validate()) {\n      this.mrdSubmit.emit(this.buildSubmitPayload());\n    }\n  };\n\n  private renderItems(items: ClientLayoutItem[]) {\n    return items.map(item => {\n      if (item.type === ClientLayoutItemType.SECTION) {\n        return (\n          <fieldset class=\"mrd-form__section\">\n            {item.label && <legend class=\"mrd-form__section-legend\">{item.label}</legend>}\n            <div class=\"mrd-form__section-body\">\n              {item.items && this.renderItems(item.items)}\n            </div>\n          </fieldset>\n        );\n      }\n\n      if (item.type === ClientLayoutItemType.GROUP) {\n        return (\n          <div class=\"mrd-form__group\">\n            {item.label && <div class=\"mrd-form__group-label\">{item.label}</div>}\n            <div class=\"mrd-form__group-body\">\n              {item.items && this.renderItems(item.items)}\n            </div>\n          </div>\n        );\n      }\n\n      const fieldName = item.name ?? '';\n      const fieldValue = this.formValues[fieldName];\n\n      return (\n        <div class=\"mrd-form__field\">\n          <mrd-field\n            item={item}\n            locale={this.locale}\n            value={fieldValue}\n            onMrdChange={this.handleFieldChange}\n            onMrdBlur={this.handleFieldChange}\n            onMrdSearch={this.handleSearch}\n            onMrdFetchAll={this.handleFetchAll}\n            onMrdUpload={this.handleUpload}\n          />\n          {this.errors[fieldName] && (\n            <span class=\"mrd-form__field-error\">{this.errors[fieldName]}</span>\n          )}\n        </div>\n      );\n    });\n  }\n\n  render() {\n    if (!this.layout) {\n      return <Host></Host>;\n    }\n\n    const dir = this.locale.startsWith('ar') ? 'rtl' : 'ltr';\n\n    return (\n      <Host>\n        <form\n          class=\"mrd-form\"\n          dir={dir}\n          onSubmit={this.handleSubmit}\n          noValidate\n        >\n          {this.layout.title && <h2 class=\"mrd-form__title\">{this.layout.title}</h2>}\n          <div class=\"mrd-form__body\">\n            {this.renderItems(this.layout.items)}\n          </div>\n          <div class=\"mrd-form__footer\">\n            <button type=\"submit\" class=\"mrd-form__submit\">\n              {t('submit', this.locale)}\n            </button>\n            {this.showCancel && (\n              <button\n                type=\"button\"\n                class=\"mrd-form__cancel\"\n                onClick={() => this.mrdCancel.emit()}\n              >\n                {t('cancel', this.locale)}\n              </button>\n            )}\n          </div>\n        </form>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/mosterdcomponents/mrd-hyperlink-field.entry.js

@@ -0,0 +1,87 @@
+import { r as registerInstance, a as createEvent, h, d as Host } from './index-B_tPFIvS.js';
+import { t } from './i18n-hoGGKbKU.js';
+import { v as validateRequired, b as validateUrl } from './validation-ixb43cqU.js';
+import './index-I5SuYv7a.js';
+import './client-layout-D88nn5zf.js';
+
+const mrdHyperlinkFieldScss = () => `.sc-mrd-hyperlink-field-h{display:block}.mrd-hyperlink-field.sc-mrd-hyperlink-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%}.mrd-hyperlink-field__label.sc-mrd-hyperlink-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-hyperlink-field__label--required.sc-mrd-hyperlink-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-hyperlink-field__input.sc-mrd-hyperlink-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);transition:border-color var(--mrd-transition), box-shadow var(--mrd-transition);outline:none;appearance:none;box-sizing:border-box}.mrd-hyperlink-field__input.sc-mrd-hyperlink-field::placeholder{color:var(--mrd-input-placeholder-color)}.mrd-hyperlink-field__input.sc-mrd-hyperlink-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-hyperlink-field__input.sc-mrd-hyperlink-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-hyperlink-field__input--error.sc-mrd-hyperlink-field{border-color:var(--mrd-border-color-error)}.mrd-hyperlink-field__input--error.sc-mrd-hyperlink-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-hyperlink-field__input--name.sc-mrd-hyperlink-field{margin-top:var(--mrd-space-1)}.mrd-hyperlink-field__link.sc-mrd-hyperlink-field{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-color-primary);text-decoration:underline;word-break:break-all}.mrd-hyperlink-field__link.sc-mrd-hyperlink-field:hover{opacity:0.8}.mrd-hyperlink-field__empty.sc-mrd-hyperlink-field{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-color-neutral-400)}.mrd-hyperlink-field__error.sc-mrd-hyperlink-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}`;
+
+const MrdHyperlinkField = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.mrdChange = createEvent(this, "mrdChange", 7);
+        this.mrdBlur = createEvent(this, "mrdBlur", 7);
+        this.name = '';
+        this.label = '';
+        this.value = '';
+        this.placeholder = '';
+        this.required = false;
+        this.disabled = false;
+        this.locale = navigator.language;
+        this.internalHref = '';
+        this.internalName = '';
+        this.error = '';
+        this.handleHrefInput = (e) => {
+            this.internalHref = e.target.value;
+            this.mrdChange.emit({ name: this.name, value: this.buildValue() });
+        };
+        this.handleNameInput = (e) => {
+            this.internalName = e.target.value;
+            this.mrdChange.emit({ name: this.name, value: this.buildValue() });
+        };
+        this.handleBlur = () => {
+            if (this.required && !validateRequired(this.internalHref)) {
+                this.error = t('required', this.locale);
+            }
+            else if (this.internalHref && !validateUrl(this.internalHref)) {
+                this.error = t('invalid_url', this.locale);
+            }
+            else {
+                this.error = '';
+            }
+            this.mrdBlur.emit({ name: this.name, value: this.buildValue() });
+        };
+    }
+    componentWillLoad() {
+        this.parseValue(this.value);
+    }
+    valueChanged(val) {
+        this.parseValue(val);
+    }
+    parseValue(val) {
+        var _a, _b, _c;
+        if (val !== null && val !== undefined && typeof val === 'object' && 'href' in val) {
+            this.internalHref = (_a = val.href) !== null && _a !== void 0 ? _a : '';
+            this.internalName = (_b = val.name) !== null && _b !== void 0 ? _b : '';
+        }
+        else {
+            this.internalHref = (_c = val) !== null && _c !== void 0 ? _c : '';
+            this.internalName = '';
+        }
+    }
+    buildValue() {
+        return this.internalName.trim()
+            ? { href: this.internalHref, name: this.internalName }
+            : { href: this.internalHref };
+    }
+    render() {
+        const hasError = !!this.error;
+        if (this.disabled) {
+            return (h(Host, null, h("div", { class: "mrd-hyperlink-field" }, this.label && h("span", { class: "mrd-hyperlink-field__label" }, this.label), this.internalHref
+                ? h("a", { class: "mrd-hyperlink-field__link", href: this.internalHref, target: "_blank", rel: "noopener noreferrer" }, this.internalName || this.internalHref)
+                : h("span", { class: "mrd-hyperlink-field__empty" }, "\u2014"))));
+        }
+        return (h(Host, null, h("div", { class: "mrd-hyperlink-field" }, this.label && (h("label", { class: `mrd-hyperlink-field__label${this.required ? ' mrd-hyperlink-field__label--required' : ''}` }, this.label)), h("input", { class: `mrd-hyperlink-field__input${hasError ? ' mrd-hyperlink-field__input--error' : ''}`, type: "url", name: this.name, value: this.internalHref, placeholder: this.placeholder || 'https://', required: this.required, onInput: this.handleHrefInput, onBlur: this.handleBlur }), h("input", { class: "mrd-hyperlink-field__input mrd-hyperlink-field__input--name", type: "text", value: this.internalName, placeholder: t('hyperlink_name', this.locale), onInput: this.handleNameInput, onBlur: this.handleBlur }), hasError && h("span", { class: "mrd-hyperlink-field__error" }, this.error))));
+    }
+    static get watchers() { return {
+        "value": [{
+                "valueChanged": 0
+            }]
+    }; }
+};
+MrdHyperlinkField.style = mrdHyperlinkFieldScss();
+
+export { MrdHyperlinkField as mrd_hyperlink_field };
+//# sourceMappingURL=mrd-hyperlink-field.entry.esm.js.map
+
+//# sourceMappingURL=mrd-hyperlink-field.entry.js.map

package/dist/mosterdcomponents/mrd-hyperlink-field.entry.js.map

@@ -0,0 +1 @@
+{"file":"mrd-hyperlink-field.entry.js","mappings":"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","names":[],"sources":["src/components/mrd-hyperlink-field/mrd-hyperlink-field.scss?tag=mrd-hyperlink-field&encapsulation=scoped","src/components/mrd-hyperlink-field/mrd-hyperlink-field.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.mrd-hyperlink-field {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mrd-space-1);\n  width: 100%;\n}\n\n.mrd-hyperlink-field__label {\n  display: block;\n  font-family: var(--mrd-font-family);\n  font-size: var(--mrd-label-font-size);\n  font-weight: var(--mrd-label-font-weight);\n  color: var(--mrd-label-color);\n}\n\n.mrd-hyperlink-field__label--required::after {\n  content: ' *';\n  color: var(--mrd-color-danger);\n}\n\n.mrd-hyperlink-field__input {\n  display: block;\n  width: 100%;\n  height: var(--mrd-input-height);\n  padding: var(--mrd-input-padding-y) var(--mrd-input-padding-x);\n  font-family: var(--mrd-font-family);\n  font-size: var(--mrd-font-size-base);\n  color: var(--mrd-input-color);\n  background-color: var(--mrd-input-bg);\n  border: var(--mrd-border-width) solid var(--mrd-border-color);\n  border-radius: var(--mrd-border-radius);\n  transition: border-color var(--mrd-transition), box-shadow var(--mrd-transition);\n  outline: none;\n  appearance: none;\n  box-sizing: border-box;\n}\n\n.mrd-hyperlink-field__input::placeholder {\n  color: var(--mrd-input-placeholder-color);\n}\n\n.mrd-hyperlink-field__input:focus {\n  border-color: var(--mrd-border-color-focus);\n  box-shadow: var(--mrd-shadow-focus);\n}\n\n.mrd-hyperlink-field__input:disabled {\n  background-color: var(--mrd-input-bg-disabled);\n  cursor: not-allowed;\n  opacity: 0.7;\n}\n\n.mrd-hyperlink-field__input--error {\n  border-color: var(--mrd-border-color-error);\n}\n\n.mrd-hyperlink-field__input--error:focus {\n  box-shadow: var(--mrd-shadow-focus-error);\n}\n\n.mrd-hyperlink-field__input--name {\n  margin-top: var(--mrd-space-1);\n}\n\n.mrd-hyperlink-field__link {\n  font-family: var(--mrd-font-family);\n  font-size: var(--mrd-font-size-base);\n  color: var(--mrd-color-primary);\n  text-decoration: underline;\n  word-break: break-all;\n}\n\n.mrd-hyperlink-field__link:hover {\n  opacity: 0.8;\n}\n\n.mrd-hyperlink-field__empty {\n  font-family: var(--mrd-font-family);\n  font-size: var(--mrd-font-size-base);\n  color: var(--mrd-color-neutral-400);\n}\n\n.mrd-hyperlink-field__error {\n  font-family: var(--mrd-font-family);\n  font-size: var(--mrd-error-font-size);\n  color: var(--mrd-error-color);\n}\n","import { Component, Host, h, Prop, State, Event, EventEmitter, Watch } from '@stencil/core';\nimport { t } from '../../utils/i18n';\nimport { validateRequired, validateUrl } from '../../utils/validation';\nimport { HyperlinkValue } from '../../types/client-layout';\n\n@Component({\n  tag: 'mrd-hyperlink-field',\n  styleUrl: 'mrd-hyperlink-field.scss',\n  scoped: true,\n})\nexport class MrdHyperlinkField {\n  @Prop() name: string = '';\n  @Prop() label: string = '';\n  @Prop() value: HyperlinkValue | string = '';\n  @Prop() placeholder: string = '';\n  @Prop() required: boolean = false;\n  @Prop() disabled: boolean = false;\n  @Prop() locale: string = navigator.language;\n\n  @State() internalHref: string = '';\n  @State() internalName: string = '';\n  @State() error: string = '';\n\n  @Event() mrdChange!: EventEmitter<{ name: string; value: HyperlinkValue }>;\n  @Event() mrdBlur!: EventEmitter<{ name: string; value: HyperlinkValue }>;\n\n  componentWillLoad() {\n    this.parseValue(this.value);\n  }\n\n  @Watch('value')\n  valueChanged(val: HyperlinkValue | string) {\n    this.parseValue(val);\n  }\n\n  private parseValue(val: HyperlinkValue | string) {\n    if (val !== null && val !== undefined && typeof val === 'object' && 'href' in (val as object)) {\n      this.internalHref = (val as HyperlinkValue).href ?? '';\n      this.internalName = (val as HyperlinkValue).name ?? '';\n    } else {\n      this.internalHref = (val as string) ?? '';\n      this.internalName = '';\n    }\n  }\n\n  private buildValue(): HyperlinkValue {\n    return this.internalName.trim()\n      ? { href: this.internalHref, name: this.internalName }\n      : { href: this.internalHref };\n  }\n\n  private handleHrefInput = (e: Event) => {\n    this.internalHref = (e.target as HTMLInputElement).value;\n    this.mrdChange.emit({ name: this.name, value: this.buildValue() });\n  };\n\n  private handleNameInput = (e: Event) => {\n    this.internalName = (e.target as HTMLInputElement).value;\n    this.mrdChange.emit({ name: this.name, value: this.buildValue() });\n  };\n\n  private handleBlur = () => {\n    if (this.required && !validateRequired(this.internalHref)) {\n      this.error = t('required', this.locale);\n    } else if (this.internalHref && !validateUrl(this.internalHref)) {\n      this.error = t('invalid_url', this.locale);\n    } else {\n      this.error = '';\n    }\n    this.mrdBlur.emit({ name: this.name, value: this.buildValue() });\n  };\n\n  render() {\n    const hasError = !!this.error;\n\n    if (this.disabled) {\n      return (\n        <Host>\n          <div class=\"mrd-hyperlink-field\">\n            {this.label && <span class=\"mrd-hyperlink-field__label\">{this.label}</span>}\n            {this.internalHref\n              ? <a class=\"mrd-hyperlink-field__link\" href={this.internalHref} target=\"_blank\" rel=\"noopener noreferrer\">\n                  {this.internalName || this.internalHref}\n                </a>\n              : <span class=\"mrd-hyperlink-field__empty\">—</span>\n            }\n          </div>\n        </Host>\n      );\n    }\n\n    return (\n      <Host>\n        <div class=\"mrd-hyperlink-field\">\n          {this.label && (\n            <label class={`mrd-hyperlink-field__label${this.required ? ' mrd-hyperlink-field__label--required' : ''}`}>\n              {this.label}\n            </label>\n          )}\n          <input\n            class={`mrd-hyperlink-field__input${hasError ? ' mrd-hyperlink-field__input--error' : ''}`}\n            type=\"url\"\n            name={this.name}\n            value={this.internalHref}\n            placeholder={this.placeholder || 'https://'}\n            required={this.required}\n            onInput={this.handleHrefInput}\n            onBlur={this.handleBlur}\n          />\n          <input\n            class=\"mrd-hyperlink-field__input mrd-hyperlink-field__input--name\"\n            type=\"text\"\n            value={this.internalName}\n            placeholder={t('hyperlink_name', this.locale)}\n            onInput={this.handleNameInput}\n            onBlur={this.handleBlur}\n          />\n          {hasError && <span class=\"mrd-hyperlink-field__error\">{this.error}</span>}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}