@ebrains/vue 0.6.0-alpha.0 → 0.7.0-alpha.0

package/{eds-form.entry-znKH1sqi.mjs → eds-form.entry-BB1gfXVy.mjs}

@@ -1,7 +1,21 @@
-import { r as b, c as h, h as s, g as f } from "./index-Df31uHzU.mjs";
-import { t as g } from "./toastManager-d9eee791-CEYNwx25.mjs";
-import { s as x } from "./analytics-44b1416b-3vYuu4Xs.mjs";
-const m = `@font-face {
+import { r as g, c as x, h as o, g as b } from "./index-E1PpO1J3.mjs";
+import { t as h } from "./toastManager-d9eee791-CEYNwx25.mjs";
+import { s } from "./analytics-44b1416b-3vYuu4Xs.mjs";
+import { p as f } from "./sharedUtils-a550989c-Ci3Tx3jc.mjs";
+import { v as m, b as p, a as u } from "./formUtils-ac68474d-D2e59S7S.mjs";
+async function y(e) {
+  const i = await e.json().catch(() => ({}));
+  return e.ok ? i : null;
+}
+async function a(e, i, n = {}) {
+  const r = i instanceof FormData ? n.headers || {} : Object.assign({ "Content-Type": "application/json" }, n.headers), l = await fetch(e, {
+    method: "POST",
+    headers: r,
+    body: i instanceof FormData ? i : JSON.stringify(i)
+  });
+  return y(l);
+}
+const v = `@font-face {
     font-family: "Inter";
     font-weight: 100 900;
     font-display: swap;
@@ -7153,180 +7167,181 @@ const m = `@font-face {
       padding-right: 0rem;
     }
   }
-  `, p = m, y = class {
+  `, w = v, k = class {
   constructor(e) {
-    b(this, e), this.formSubmitting = h(this, "formSubmitting", 7), this.handleChange = (r, n) => {
-      const i = r.target;
-      this.values = Object.assign(Object.assign({}, this.values), { [n.name]: i.value });
-      const l = Object.assign({}, this.errors);
-      if (n.type === "checkbox" || n.type === "radio")
-        if (n.options) {
-          const t = this.validateFieldGroup(n.name, n.type, n.required);
-          t.length > 0 ? l[n.name] = t : delete l[n.name];
-        } else {
-          const t = this.validateSingleBox(n.name, n.required);
-          t.length > 0 ? l[n.name] = t : delete l[n.name];
-        }
-      else {
-        const t = this.validateField(n.name, i.value, n.type, n.required, n.maxlength);
-        t.length > 0 ? l[n.name] = t : delete l[n.name];
-      }
-      this.errors = l, this.hasError = Object.keys(l).length > 0;
-    }, this.handleSubmit = async (r) => {
-      var n, i, l;
-      if (r.preventDefault(), this.isSubmitting)
-        return;
-      if (this.validateForm(), this.hasError) {
-        x({
-          category: "ui-component",
-          parentContext: null,
-          tag: this.el.tagName.toLowerCase(),
-          name: `${(n = this.submitBtnLabel) === null || n === void 0 ? void 0 : n.toLowerCase()}/error` || "",
-          action: "click"
-        }), this.alertMessage = this.errorMessage;
-        return;
-      }
-      this.isSubmitting = !0, this.formSubmitted = !1, this.alertMessage = null, this.errors = {};
-      const t = await this.getFormData();
-      this.setFormUrl && typeof window < "u" && t.set("form_url", window.location.href), this.authUser && t.set("form_user", (i = this.authUser) === null || i === void 0 ? void 0 : i.email);
-      const d = this.coupleAuth ? { Authorization: `Bearer ${this.authUser.token}` } : {};
-      try {
-        const o = await fetch(this.endpoint, {
-          method: "POST",
-          body: t,
-          headers: d
-        });
-        if (!o.ok) {
-          const c = await o.json();
-          this.hasError = !0, g.show(c.error || this.errorMessage, "error");
-          return;
-        }
-        const a = await o.json();
-        this.formSubmitted = !0, g.show(a.message || this.successMessage, "success"), this.formEl.reset(), x({
-          category: "ui-component",
-          parentContext: null,
-          tag: this.el.tagName.toLowerCase(),
-          name: `${(l = this.submitBtnLabel) === null || l === void 0 ? void 0 : l.toLowerCase()}/success` || "",
-          action: "click"
-        });
-      } catch (o) {
-        this.hasError = !0, g.show(`${o}`, "error");
-      } finally {
-        this.isSubmitting = !1, this.formSubmitting.emit(this.isSubmitting);
-      }
-    }, this.setFormUrl = !0, this.submitBtn = !0, this.submitBtnLabel = "Submit", this.successMessage = "Your message has been sent.", this.errorMessage = "Some fields in your form are incorrect.", this.submitBtnHintMessage = "To participate, please sign in using your EBRAINS account. If you do not have an account yet, you can easily create one on the EBRAINS portal.", this.endpoint = void 0, this.name = "form", this.fields = [], this.values = {}, this.coupleAuth = !1, this.formSubmitted = !1, this.hasError = !1, this.errors = {}, this.isSubmitting = !1, this.alertMessage = null, this.isAuthenticated = !1, this.authUser = void 0, this.parsedFields = [];
+    g(this, e), this.form = x(this, "form", 7), this.setFormUrl = !0, this.submitBtn = !0, this.submitBtnLabel = "Submit", this.successMessage = "Your message has been sent.", this.errorMessage = "Some fields in your form are incorrect.", this.submitBtnHintMessage = "To participate, please sign in using your EBRAINS account. If you do not have an account yet, you can easily create one on the EBRAINS portal.", this.endpoint = void 0, this.name = "eds-form", this.fields = [], this.coupleAuth = !1, this.user = null, this.draft = !1, this.draftData = {}, this.values = {}, this.formSubmitted = !1, this.hasError = !1, this.errors = {}, this.isSubmitting = !1, this.alertMessage = null, this.isAuthenticated = !1, this.parsedFields = [];
   }
-  onAuthStatusChanged(e) {
-    var r;
-    this.isAuthenticated = (r = e.detail) === null || r === void 0 ? void 0 : r.authenticated, this.authUser = e.detail.user;
+  async componentWillLoad() {
+    this.parseFields(this.fields), this.el.querySelectorAll("eds-button").forEach((i) => {
+      this.emitContext(i);
+    });
   }
-  componentDidLoad() {
-    this.parseFields(this.fields);
+  async componentDidLoad() {
+    this.shouldFormProcessDraft && this.loadDraft();
   }
-  /*emitContext(linkElement: HTMLElement) {
-      const event = new CustomEvent<ParentContextDetail>('parentContext', {
-        detail: {
-          componentName: this.el.tagName.toLowerCase(),
-          identifier: null
-        }
-      });
-  
-      linkElement.dispatchEvent(event);
-    }*/
-  // Visibility helper
-  isFieldVisible(e) {
-    return e.condition ? this.values[e.condition.field] === e.condition.value : !0;
+  get shouldFormAcceptDraft() {
+    var e;
+    return !!(!((e = this.user) === null || e === void 0) && e.token && this.draft);
+  }
+  get shouldFormProcessDraft() {
+    var e;
+    return !!(!((e = this.draftData) === null || e === void 0) && e._id);
+  }
+  parseFields(e) {
+    this.parsedFields = f(e);
+  }
+  loadDraft() {
+    var e;
+    if (!((e = this.draftData) === null || e === void 0) && e.completed) {
+      this.formSubmitted = !0, h.show(this.draftData.message, "success"), this.formEl.reset();
+      return;
+    }
+    this.populateFormWithDraftData(this.draftData);
   }
-  // Validate individual fields dynamically
-  validateField(e, r, n, i, l) {
-    const t = [];
-    return i && !r && t.push(`${e} is required.`), l && typeof r == "string" && r.length > l && t.push(`${e} must be at most ${l} characters.`), n === "email" && r && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(r.toString()) && t.push("Invalid email format."), t;
-  }
-  validateFieldGroup(e, r, n) {
-    const t = Array.from(this.formEl.querySelectorAll("eds-input-field")).filter((o) => {
-      var a, c;
-      return ((c = (a = o.shadowRoot) === null || a === void 0 ? void 0 : a.querySelectorAll(`input[name="${e}"]`)) === null || c === void 0 ? void 0 : c.length) > 0;
-    }).flatMap((o) => {
-      var a;
-      return Array.from(((a = o.shadowRoot) === null || a === void 0 ? void 0 : a.querySelectorAll(`input[name="${e}"]`)) || []);
-    }).some((o) => o.checked), d = [];
-    return n && !t && d.push(`At least one option in ${e} is required.`), d;
-  }
-  validateSingleBox(e, r) {
-    var n;
-    const i = [], l = Array.from(this.formEl.querySelectorAll("eds-input-field")).find((d) => {
-      var o;
-      return (o = d.shadowRoot) === null || o === void 0 ? void 0 : o.querySelector(`[name="${e}"]`);
+  emitContext(e) {
+    const i = new CustomEvent("parentContext", {
+      detail: {
+        componentName: this.el.tagName.toLowerCase(),
+        identifier: null
+      }
     });
-    if (!l)
-      return r && i.push(`${e} is required.`), i;
-    const t = (n = l.shadowRoot) === null || n === void 0 ? void 0 : n.querySelector(`[name="${e}"]`);
-    return r && t && !t.checked && i.push(`${e} is required.`), i;
+    e.dispatchEvent(i);
+  }
+  isFieldVisible(e) {
+    return e.condition ? this.values[e.condition.field] === e.condition.value : !0;
   }
   validateForm() {
-    this.errors = {}, this.hasError = !1, this.parsedFields.forEach((e) => {
-      if (e.type !== "hidden")
-        if ((e.type === "checkbox" || e.type === "radio") && !e.options) {
-          const r = this.validateSingleBox(e.name, e.required);
-          r.length > 0 && (this.errors[e.name] = r, this.hasError = !0);
-        } else if (e.options && (e.type === "checkbox" || e.type === "radio")) {
-          const r = this.validateFieldGroup(e.name, e.type, e.required);
-          r.length > 0 && (this.errors[e.name] = r, this.hasError = !0);
-        } else {
-          const r = this.findFieldElement(e.name);
-          if (r) {
-            const n = r.value, i = this.validateField(e.name, n, e.type, e.required, e.maxlength);
-            i.length > 0 && (this.errors[e.name] = i, this.hasError = !0);
-          }
-        }
+    const { errors: e, hasError: i } = m(this.parsedFields, this.formEl, this.values, (n, r) => n.condition ? r[n.condition.field] === n.condition.value : !0);
+    this.errors = e, this.hasError = i;
+  }
+  populateFormWithDraftData(e) {
+    const { updatedValues: i } = p({
+      draftData: e,
+      parsedFields: this.parsedFields,
+      currentValues: this.values,
+      formEl: this.formEl,
+      isFieldVisible: (n, r) => n.condition ? r[n.condition.field] === n.condition.value : !0
     });
-  }
-  // Helper function to find elements in the shadow DOM
-  findFieldElement(e) {
-    const r = Array.from(this.formEl.querySelectorAll("eds-input-field"));
-    for (const n of r)
-      if (n.shadowRoot) {
-        const i = n.shadowRoot.querySelector(`[name="${e}"]`);
-        if (i)
-          return i;
-      }
-    return null;
-  }
-  async getFormData() {
-    const e = new FormData();
-    return e.append("form_name", this.name), Array.from(this.formEl.querySelectorAll("eds-input-field")).forEach((n) => {
-      if (n.shadowRoot) {
-        const i = n.shadowRoot.querySelector("input, textarea, select");
-        if (i && i.name)
-          if (i.type === "checkbox" || i.type === "radio") {
-            const t = Array.from(n.shadowRoot.querySelectorAll(`input[name="${i.name}"]:checked`)).map((d) => d.value);
-            e.append(i.name, t.join(","));
-          } else if (i.type === "file") {
-            const l = i;
-            l.files && l.files.length > 0 && Array.from(l.files).forEach((t) => {
-              e.append(l.name, t);
+    this.values = i;
+  }
+  getFormData() {
+    var e;
+    const i = new FormData();
+    return i.append("form_name", this.name), this.setFormUrl && typeof window < "u" && i.set("form_url", window.location.href), this.user && i.set("form_user", (e = this.user) === null || e === void 0 ? void 0 : e.email), Array.from(this.formEl.querySelectorAll("eds-input-field")).forEach((r) => {
+      if (r.shadowRoot) {
+        const l = r.shadowRoot.querySelector("input, textarea, select");
+        if (l && l.name)
+          if (l.type === "checkbox" || l.type === "radio") {
+            const d = Array.from(r.shadowRoot.querySelectorAll(`input[name="${l.name}"]:checked`)).map((c) => c.value);
+            i.append(l.name, d.join(","));
+          } else if (l.type === "file") {
+            const t = l;
+            t.files && t.files.length > 0 && Array.from(t.files).forEach((d) => {
+              i.append(t.name, d);
             });
           } else
-            e.append(i.name, i.value);
+            i.append(l.name, l.value);
       }
-    }), e;
+    }), i;
+  }
+  handleChange(e, i) {
+    const n = e.target;
+    this.values = Object.assign(Object.assign({}, this.values), { [i.name]: n.value }), this.form.emit({
+      event: "change",
+      field: i.name,
+      value: n.value,
+      message: `${i.name} updated`,
+      data: this.getFormData()
+    }), this.shouldFormAcceptDraft && this.postFormDataWithoutValidation();
+  }
+  handleInput(e, i) {
+    const n = e.target;
+    this.values = Object.assign(Object.assign({}, this.values), { [i.name]: n.value });
+    const r = Object.assign({}, this.errors), l = u(i, n.value, this.formEl);
+    l.length > 0 ? r[i.name] = l : delete r[i.name], this.errors = r, this.hasError = Object.keys(r).length > 0;
+  }
+  async handleSubmit(e) {
+    var i, n;
+    if (e.preventDefault(), this.isSubmitting)
+      return;
+    if (this.validateForm(), this.hasError) {
+      this.form.emit({
+        event: "submit",
+        validated: !1,
+        success: !1,
+        message: this.errorMessage,
+        data: this.getFormData()
+      }), s({
+        category: "ui-component",
+        parentContext: null,
+        tag: this.el.tagName.toLowerCase(),
+        name: `${(i = this.submitBtnLabel) === null || i === void 0 ? void 0 : i.toLowerCase()}/error` || "",
+        action: "click"
+      }), this.alertMessage = this.errorMessage;
+      return;
+    }
+    this.isSubmitting = !0, this.formSubmitted = !1, this.alertMessage = null, this.errors = {};
+    const r = await this.getFormData();
+    if (r.set("draft", "false"), r.set("completed", "true"), !this.endpoint) {
+      this.form.emit({
+        event: "submit",
+        success: !0,
+        validated: !0,
+        message: "Form data validated successfully",
+        data: r
+      }), this.formSubmitted = !0, this.formEl.reset(), this.isSubmitting = !1;
+      return;
+    }
+    const l = { Authorization: `Bearer ${this.user.token}` };
+    try {
+      const t = await a(this.endpoint, r, { headers: l });
+      this.form.emit({
+        event: "submit",
+        success: !0,
+        validated: !0,
+        message: t.message,
+        data: r
+      }), this.formSubmitted = !0, this.formEl.reset(), s({
+        category: "ui-component",
+        parentContext: null,
+        tag: this.el.tagName.toLowerCase(),
+        name: `${(n = this.submitBtnLabel) === null || n === void 0 ? void 0 : n.toLowerCase()}/success` || "",
+        action: "click"
+      });
+    } catch (t) {
+      this.hasError = !0, this.form.emit({
+        event: "submit",
+        success: !1,
+        validated: !0,
+        message: t,
+        data: r
+      });
+    } finally {
+      this.isSubmitting = !1;
+    }
   }
-  parseFields(e) {
+  async postFormDataWithoutValidation() {
+    var e;
+    if (!this.endpoint)
+      return;
+    const i = await this.getFormData();
+    i.set("draft", this.draft.toString());
+    const n = { Authorization: `Bearer ${(e = this.user) === null || e === void 0 ? void 0 : e.token}` };
     try {
-      typeof e == "string" ? this.parsedFields = JSON.parse(e) : Array.isArray(e) ? this.parsedFields = e : e && typeof e == "object" ? this.parsedFields = e : this.parsedFields = [];
+      await a(this.endpoint, i, { headers: n });
     } catch (r) {
-      console.error("Error parsing fields prop:", r), this.parsedFields = [];
+      throw r;
     }
   }
   render() {
-    const e = this.parsedFields.filter((n) => n.type === "hidden"), r = this.parsedFields.filter((n) => n.type !== "hidden");
-    return s("form", { key: "3d4ae34d48c0551f9de6dacb50ceee15b487b5de", ref: (n) => this.formEl = n, enctype: "multipart/form-data", autocomplete: "on", method: "post", onSubmit: this.handleSubmit }, s("div", { key: "344c56dcba3de5a1b55255d794a78fb0f19d04b5" }, s("slot", { key: "3ca6d203458d67fa66840fac55f94d71acc2ee4d" }), e.map((n, i) => s("eds-input", { key: i, type: "hidden", name: n.name, value: n.value })), r.map((n, i) => {
+    const e = this.parsedFields.filter((n) => n.type === "hidden"), i = this.parsedFields.filter((n) => n.type !== "hidden");
+    return o("form", { key: "7ea50f19b8810fb0294bc8527d1c86e74dfc2b69", ref: (n) => this.formEl = n, enctype: "multipart/form-data", autocomplete: "on", method: "post", onSubmit: this.handleSubmit }, o("div", { key: "29e821a2eb706c51fa303b1abf645baeea5ae9d4" }, o("slot", { key: "b45d74e9a147ab1a932891210c7813d3bd118b07" }), e.map((n, r) => o("eds-input", { key: r, type: "hidden", name: n.name, value: n.value })), i.map((n, r) => {
       var l, t;
-      return this.isFieldVisible(n) ? s("eds-input-field", { key: i, name: n.name, id: `${this.name}_${n.name}`, label: n.label, type: n.type, icon: n.icon || null, required: n.required, maxLength: n.maxlength, hint: n.hint, error: ((l = this.errors[n.name]) === null || l === void 0 ? void 0 : l.length) > 0, errorMessage: (t = this.errors[n.name]) === null || t === void 0 ? void 0 : t.join("<br />"), onInput: (d) => this.handleChange(d, n), class: i > 0 ? "mt-20" : "", options: n.options }) : null;
-    })), this.submitBtn && s("div", { key: "22915285f3522f6d260e358eea964c59a9557a55", class: "mt-20" }, s("eds-button", { key: "9e2191ba8cc49d7ac2a6588c0fa468214773c791", intent: "primary", label: this.submitBtnLabel, disabled: this.isSubmitting || this.coupleAuth && !this.isAuthenticated, loading: this.isSubmitting, onClick: (n) => this.handleSubmit(n) }), this.coupleAuth && !this.isAuthenticated ? s("p", { class: "f-ui-05 text-lighter mt-8 ml-8" }, this.submitBtnHintMessage) : null), this.alertMessage && (this.formSubmitted || this.hasError) && s("div", { key: "8045c3dff26286a6735157b82afd56ec9001ba14", class: "mt-20" }, s("eds-alert", { key: "dc8c8f74e8aada9023f110bb862afee1fb629601", message: this.alertMessage, intent: this.hasError ? "error" : "success", direction: "horizontal" })));
+      return this.isFieldVisible(n) ? o("eds-input-field", { key: r, name: n.name, id: `${this.name}_${n.name}`, label: n.label, type: n.type, icon: n.icon || null, required: n.required, maxLength: n.maxlength, hint: n.hint, error: ((l = this.errors[n.name]) === null || l === void 0 ? void 0 : l.length) > 0, errorMessage: (t = this.errors[n.name]) === null || t === void 0 ? void 0 : t.join("<br />"), onInput: (d) => this.handleInput(d, n), onChange: (d) => this.handleChange(d, n), class: r > 0 ? "mt-20" : "", options: n.options }) : null;
+    })), this.submitBtn && o("div", { key: "0a9b9027fc235cd099cc40903bd6711873b9868b", class: "mt-20" }, o("eds-button", { key: "f7181c19d04a117817f556753cc95c1f49c9fa1c", intent: "primary", label: this.submitBtnLabel, disabled: this.isSubmitting || this.coupleAuth && !this.isAuthenticated || this.formSubmitted, loading: this.isSubmitting, onClick: (n) => this.handleSubmit(n) }), this.coupleAuth && !this.isAuthenticated ? o("p", { class: "f-ui-05 text-lighter mt-8 ml-8" }, this.submitBtnHintMessage) : null), this.alertMessage && (this.formSubmitted || this.hasError) && o("div", { key: "b999356ec8fc57fc85c2f672a94e95f834d153ea", class: "mt-20" }, o("eds-alert", { key: "5a743b01991fb5d8f5358abc44639e790f5264ea", message: this.alertMessage, intent: this.hasError ? "error" : "success", direction: "horizontal" })));
   }
   get el() {
-    return f(this);
+    return b(this);
   }
   static get watchers() {
     return {
@@ -7334,7 +7349,7 @@ const m = `@font-face {
     };
   }
 };
-y.style = p;
+k.style = w;
 export {
-  y as eds_form
+  k as eds_form
 };

package/eds-frame.entry-BvJCKWMT.mjs

@@ -0,0 +1,73 @@
+import { r as i, h as e, g as o } from "./index-E1PpO1J3.mjs";
+const a = ".bg-inverse{background-color:var(--white)}.min-h-156{min-height:156px}.rounded{border-radius:0.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:16px}.rounded-md{border-radius:12px}.border-soft{border-color:rgba(0, 0, 0, .15 )}.border-softer{border-color:rgba(0, 0, 0, .1 )}.border-softest{border-color:rgba(0, 0, 0, .05 )}.effect-focus-within{outline-width:3px;outline-offset:2px;outline-color:var(--green-500)}.effect-focus-within:focus-within{outline-style:solid}.relative{position:relative}.flex{display:flex}.grow{flex-grow:1}.flex-col{flex-direction:column}.border-2{border-width:2px}.w-full{width:100%}.h-full{height:100%}.effect-height{transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1);transition-property:height}.items-center{align-items:center}.justify-between{justify-content:space-between}.py-8{padding-top:0.5rem;padding-bottom:0.5rem}.px-12{padding-left:0.75rem;padding-right:0.75rem}.f-ui-02{font-family:var(--f-ui-02-fontFamily);font-weight:var(--f-ui-02-fontWeight);font-size:var(--f-ui-02-fontSize);line-height:var(--f-ui-02-lineHeight);letter-spacing:var(--f-ui-02-letterSpacing)}.ml-auto{margin-left:auto}.border-t-2{border-top-width:2px}.border{border:1px solid rgba(0, 0, 0, .1 )}.border-2{border:1px solid rgba(0, 0, 0, .1 )}.container{width:calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0)))));margin-right:auto;margin-left:auto}.container>*{--container-outer-gutter:0;--breakout-container-outer-gutter:0}.ml-8{margin-left:0.5rem}.mr-8{margin-right:0.5rem}.mt-16{margin-top:1rem}", n = a, s = class {
+  constructor(t) {
+    i(this, t), this.frameLabel = void 0, this.urlLabel = "Open in Storybook", this.errorMessage = "Could not load the requested Storybook content. Please check the URL or try again later.", this.storybookUrl = void 0, this.storyPath = void 0, this.intent = "strong", this.size = "auto", this.iframeError = !1;
+  }
+  componentWillLoad() {
+    this.checkIframeAvailability();
+  }
+  componentDidLoad() {
+    this.el.querySelectorAll("eds-link").forEach((r) => {
+      this.emitContext(r);
+    });
+  }
+  /**
+   * Emits a custom event called `parentContext` for a given link element.
+   * This event provides context information about the breadcrumb component.
+   *
+   * @param linkElement - The link element to which the event will be dispatched.
+   */
+  emitContext(t) {
+    const r = new CustomEvent("parentContext", {
+      detail: {
+        componentName: this.el.tagName.toLowerCase(),
+        identifier: this.frameLabel
+      }
+    });
+    t.dispatchEvent(r);
+  }
+  articleClasses() {
+    return [
+      "bg-inverse min-h-156 rounded border-softer effect-focus-within relative flex grow flex-col border-2",
+      "w-full h-full"
+    ].join(" ");
+  }
+  getFrameHeight() {
+    switch (this.size) {
+      case "sm":
+        return "100px";
+      case "md":
+        return "200px";
+      case "lg":
+        return "400px";
+      case "xl":
+        return "700px";
+      default:
+        return "auto";
+    }
+  }
+  async checkIframeAvailability() {
+    try {
+      if (!(await fetch(this.frameSrc, { method: "GET" })).ok)
+        throw new Error("Failed to load");
+    } catch {
+      this.iframeError = !0;
+    }
+  }
+  get storyLink() {
+    return `${this.storybookUrl}/?path=/story/${this.storyPath}`;
+  }
+  get frameSrc() {
+    return `${this.storybookUrl}/iframe.html?id=${this.storyPath}&viewMode=story`;
+  }
+  render() {
+    return e("div", { key: "e4b72fab30dcf1eeee6fdf3c63719599eafedb6d", class: this.articleClasses() }, e("div", { key: "f8643db32120c14dd18b3d44ae530a83e81e59e0", class: "effect-height flex items-center justify-between py-8 px-12" }, e("span", { key: "7b40c644e142e6a6356e4d6a683b9c1c57104f5d", class: "f-ui-02" }, this.frameLabel), this.iframeError ? null : e("eds-link", { label: this.urlLabel, url: this.storyLink, intent: this.intent, class: "ml-auto", external: !0, disabled: !1, icon: "arrow-diagonal" })), e("div", { key: "8a1fe80134dadd38d113968ad0c825a6f9426921", class: "border-softer" }, this.iframeError ? e("div", { class: "container ml-8 mr-8 mt-16" }, this.errorMessage) : e("iframe", { src: this.frameSrc, width: "100%", height: this.getFrameHeight(), title: this.frameLabel, frameBorder: "0", allowFullScreen: !0 })));
+  }
+  get el() {
+    return o(this);
+  }
+};
+s.style = n;
+export {
+  s as eds_frame
+};

package/eds-frame.entry-dX3nZxD0.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-D4alMZtT.js"),o=".bg-inverse{background-color:var(--white)}.min-h-156{min-height:156px}.rounded{border-radius:0.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:16px}.rounded-md{border-radius:12px}.border-soft{border-color:rgba(0, 0, 0, .15 )}.border-softer{border-color:rgba(0, 0, 0, .1 )}.border-softest{border-color:rgba(0, 0, 0, .05 )}.effect-focus-within{outline-width:3px;outline-offset:2px;outline-color:var(--green-500)}.effect-focus-within:focus-within{outline-style:solid}.relative{position:relative}.flex{display:flex}.grow{flex-grow:1}.flex-col{flex-direction:column}.border-2{border-width:2px}.w-full{width:100%}.h-full{height:100%}.effect-height{transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1);transition-property:height}.items-center{align-items:center}.justify-between{justify-content:space-between}.py-8{padding-top:0.5rem;padding-bottom:0.5rem}.px-12{padding-left:0.75rem;padding-right:0.75rem}.f-ui-02{font-family:var(--f-ui-02-fontFamily);font-weight:var(--f-ui-02-fontWeight);font-size:var(--f-ui-02-fontSize);line-height:var(--f-ui-02-lineHeight);letter-spacing:var(--f-ui-02-letterSpacing)}.ml-auto{margin-left:auto}.border-t-2{border-top-width:2px}.border{border:1px solid rgba(0, 0, 0, .1 )}.border-2{border:1px solid rgba(0, 0, 0, .1 )}.container{width:calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0)))));margin-right:auto;margin-left:auto}.container>*{--container-outer-gutter:0;--breakout-container-outer-gutter:0}.ml-8{margin-left:0.5rem}.mr-8{margin-right:0.5rem}.mt-16{margin-top:1rem}",a=o,i=class{constructor(t){e.registerInstance(this,t),this.frameLabel=void 0,this.urlLabel="Open in Storybook",this.errorMessage="Could not load the requested Storybook content. Please check the URL or try again later.",this.storybookUrl=void 0,this.storyPath=void 0,this.intent="strong",this.size="auto",this.iframeError=!1}componentWillLoad(){this.checkIframeAvailability()}componentDidLoad(){this.el.querySelectorAll("eds-link").forEach(r=>{this.emitContext(r)})}emitContext(t){const r=new CustomEvent("parentContext",{detail:{componentName:this.el.tagName.toLowerCase(),identifier:this.frameLabel}});t.dispatchEvent(r)}articleClasses(){return["bg-inverse min-h-156 rounded border-softer effect-focus-within relative flex grow flex-col border-2","w-full h-full"].join(" ")}getFrameHeight(){switch(this.size){case"sm":return"100px";case"md":return"200px";case"lg":return"400px";case"xl":return"700px";default:return"auto"}}async checkIframeAvailability(){try{if(!(await fetch(this.frameSrc,{method:"GET"})).ok)throw new Error("Failed to load")}catch{this.iframeError=!0}}get storyLink(){return`${this.storybookUrl}/?path=/story/${this.storyPath}`}get frameSrc(){return`${this.storybookUrl}/iframe.html?id=${this.storyPath}&viewMode=story`}render(){return e.h("div",{key:"e4b72fab30dcf1eeee6fdf3c63719599eafedb6d",class:this.articleClasses()},e.h("div",{key:"f8643db32120c14dd18b3d44ae530a83e81e59e0",class:"effect-height flex items-center justify-between py-8 px-12"},e.h("span",{key:"7b40c644e142e6a6356e4d6a683b9c1c57104f5d",class:"f-ui-02"},this.frameLabel),this.iframeError?null:e.h("eds-link",{label:this.urlLabel,url:this.storyLink,intent:this.intent,class:"ml-auto",external:!0,disabled:!1,icon:"arrow-diagonal"})),e.h("div",{key:"8a1fe80134dadd38d113968ad0c825a6f9426921",class:"border-softer"},this.iframeError?e.h("div",{class:"container ml-8 mr-8 mt-16"},this.errorMessage):e.h("iframe",{src:this.frameSrc,width:"100%",height:this.getFrameHeight(),title:this.frameLabel,frameBorder:"0",allowFullScreen:!0})))}get el(){return e.getElement(this)}};i.style=a;exports.eds_frame=i;

package/{eds-icon-arrow-diagonal.entry-C7CZIqBn.mjs → eds-icon-arrow-diagonal.entry-BD3xdvR4.mjs}

@@ -1,11 +1,11 @@
-import { r, h as s } from "./index-Df31uHzU.mjs";
+import { r, h as s } from "./index-E1PpO1J3.mjs";
 import { a as o } from "./arrow-diagonal-black-8f0494c3-CYl9yYTl.mjs";
 const t = class {
   constructor(a) {
     r(this, a), this.addClass = "";
   }
   render() {
-    return s("span", { key: "d85a4d425e0c255efe4763d4a13f13b6ff727c2c", class: this.addClass, innerHTML: o });
+    return s("span", { key: "61fba958a683480dfd28e503b65a7dceb6640f46", class: this.addClass, innerHTML: o });
   }
 };
 export {

package/{eds-icon-arrow-diagonal.entry-BTLKc1cS.js → eds-icon-arrow-diagonal.entry-DkQFuVkT.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./index-DvG3cC-8.js"),e=require("./arrow-diagonal-black-8f0494c3-DqsB6ni-.js"),s=class{constructor(a){r.registerInstance(this,a),this.addClass=""}render(){return r.h("span",{key:"d85a4d425e0c255efe4763d4a13f13b6ff727c2c",class:this.addClass,innerHTML:e.arrowDiagonal})}};exports.eds_icon_arrow_diagonal=s;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("./index-D4alMZtT.js"),e=require("./arrow-diagonal-black-8f0494c3-DqsB6ni-.js"),s=class{constructor(r){a.registerInstance(this,r),this.addClass=""}render(){return a.h("span",{key:"61fba958a683480dfd28e503b65a7dceb6640f46",class:this.addClass,innerHTML:e.arrowDiagonal})}};exports.eds_icon_arrow_diagonal=s;

package/eds-icon-arrow-right.entry-BH0zDB1H.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./index-D4alMZtT.js"),s=require("./arrow-right-9322ba8a-DBcxNU_p.js"),t=class{constructor(e){r.registerInstance(this,e),this.class=""}render(){return r.h("span",{key:"823be807e649d4ddbd41c0628e2fda249a8c6f74",class:this.class,innerHTML:s.arrowRight})}};exports.eds_icon_arrow_right=t;

package/eds-icon-arrow-right.entry-Diax6KZB.mjs

@@ -0,0 +1,13 @@
+import { r as s, h as t } from "./index-E1PpO1J3.mjs";
+import { a } from "./arrow-right-9322ba8a-DHq-_PPe.mjs";
+const c = class {
+  constructor(r) {
+    s(this, r), this.class = "";
+  }
+  render() {
+    return t("span", { key: "823be807e649d4ddbd41c0628e2fda249a8c6f74", class: this.class, innerHTML: a });
+  }
+};
+export {
+  c as eds_icon_arrow_right
+};

package/{eds-icon-bluesky.entry-BfYrb4Uv.js → eds-icon-bluesky.entry-CDZCjWCh.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-DvG3cC-8.js"),c=require("./bluesky-cc5edd2d-DaFQc-pr.js"),r=class{constructor(s){e.registerInstance(this,s),this.class=""}render(){return e.h("span",{key:"845a157678b9d059b2c9bd8a6265d3a62f33c31a",class:this.class,innerHTML:c.bluesky})}};exports.eds_icon_bluesky=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-D4alMZtT.js"),c=require("./bluesky-cc5edd2d-DaFQc-pr.js"),r=class{constructor(s){e.registerInstance(this,s),this.class=""}render(){return e.h("span",{key:"a06ab2e79a1ec7603244ec09649ccc2c9ea1950c",class:this.class,innerHTML:c.bluesky})}};exports.eds_icon_bluesky=r;

package/eds-icon-bluesky.entry-DwvxMR1q.mjs

@@ -0,0 +1,13 @@
+import { r as c, h as e } from "./index-E1PpO1J3.mjs";
+import { b as r } from "./bluesky-cc5edd2d-DfuDDO5h.mjs";
+const n = class {
+  constructor(s) {
+    c(this, s), this.class = "";
+  }
+  render() {
+    return e("span", { key: "a06ab2e79a1ec7603244ec09649ccc2c9ea1950c", class: this.class, innerHTML: r });
+  }
+};
+export {
+  n as eds_icon_bluesky
+};

package/{eds-icon-chevron-down.entry-OPmfChgp.js → eds-icon-chevron-down.entry-CGsA1rJ0.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-DvG3cC-8.js"),s=require("./chevron-down-6144c823-D_8976Ke.js"),r=class{constructor(n){e.registerInstance(this,n),this.class=""}render(){return e.h("span",{key:"fa8022d27b91e909d4cd5522c6d0406be698a412",class:this.class,innerHTML:s.chevronDown})}};exports.eds_icon_chevron_down=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-D4alMZtT.js"),s=require("./chevron-down-6144c823-D_8976Ke.js"),r=class{constructor(n){e.registerInstance(this,n),this.class=""}render(){return e.h("span",{key:"c723d7f1bbd596063ae7e66123b8038af5320a54",class:this.class,innerHTML:s.chevronDown})}};exports.eds_icon_chevron_down=r;

package/eds-icon-chevron-down.entry-CiJcqZuh.mjs

@@ -0,0 +1,13 @@
+import { r, h as n } from "./index-E1PpO1J3.mjs";
+import { c as o } from "./chevron-down-6144c823-DWGlv9eV.mjs";
+const a = class {
+  constructor(s) {
+    r(this, s), this.class = "";
+  }
+  render() {
+    return n("span", { key: "c723d7f1bbd596063ae7e66123b8038af5320a54", class: this.class, innerHTML: o });
+  }
+};
+export {
+  a as eds_icon_chevron_down
+};

package/{eds-icon-chevron-left.entry-CRr4AWkS.mjs → eds-icon-chevron-left.entry-Dt2WsKob.mjs}

@@ -1,11 +1,11 @@
-import { r as e, h as r } from "./index-Df31uHzU.mjs";
+import { r as e, h as r } from "./index-E1PpO1J3.mjs";
 import { c as t } from "./chevron-left-ca6c66e1-DANhLw_T.mjs";
 const o = class {
   constructor(s) {
     e(this, s), this.class = "";
   }
   render() {
-    return r("span", { key: "c723d7f1bbd596063ae7e66123b8038af5320a54", class: this.class, innerHTML: t });
+    return r("span", { key: "5547e9d98f781dc03e88a014f726b3a402e6425d", class: this.class, innerHTML: t });
   }
 };
 export {

package/{eds-icon-chevron-left.entry-_zMMz-c9.js → eds-icon-chevron-left.entry-nBBudzCb.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-DvG3cC-8.js"),r=require("./chevron-left-ca6c66e1-uCH5SUhm.js"),t=class{constructor(s){e.registerInstance(this,s),this.class=""}render(){return e.h("span",{key:"c723d7f1bbd596063ae7e66123b8038af5320a54",class:this.class,innerHTML:r.chevronLeft})}};exports.eds_icon_chevron_left=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-D4alMZtT.js"),r=require("./chevron-left-ca6c66e1-uCH5SUhm.js"),t=class{constructor(s){e.registerInstance(this,s),this.class=""}render(){return e.h("span",{key:"5547e9d98f781dc03e88a014f726b3a402e6425d",class:this.class,innerHTML:r.chevronLeft})}};exports.eds_icon_chevron_left=t;

package/{eds-icon-chevron-right.entry-YLnmNxjo.mjs → eds-icon-chevron-right.entry-BG7_qznz.mjs}

@@ -1,11 +1,11 @@
-import { r, h as c } from "./index-Df31uHzU.mjs";
+import { r, h as c } from "./index-E1PpO1J3.mjs";
 import { c as t } from "./chevron-right-b88ed2d4-CgEZBvy7.mjs";
 const o = class {
   constructor(s) {
     r(this, s), this.class = "";
   }
   render() {
-    return c("span", { key: "f770cd9151077e8708c76d2082613c65a20c420f", class: this.class, innerHTML: t });
+    return c("span", { key: "177f447969a48957c54d011bfb72693731ecc1cf", class: this.class, innerHTML: t });
   }
 };
 export {

package/{eds-icon-chevron-right.entry-0FshDV46.js → eds-icon-chevron-right.entry-CjhJFKog.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-DvG3cC-8.js"),s=require("./chevron-right-b88ed2d4-C7dkTMvP.js"),c=class{constructor(r){e.registerInstance(this,r),this.class=""}render(){return e.h("span",{key:"f770cd9151077e8708c76d2082613c65a20c420f",class:this.class,innerHTML:s.chevronRight})}};exports.eds_icon_chevron_right=c;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-D4alMZtT.js"),s=require("./chevron-right-b88ed2d4-C7dkTMvP.js"),c=class{constructor(r){e.registerInstance(this,r),this.class=""}render(){return e.h("span",{key:"177f447969a48957c54d011bfb72693731ecc1cf",class:this.class,innerHTML:s.chevronRight})}};exports.eds_icon_chevron_right=c;

package/eds-icon-chevron-up.entry-DfsbHKk1.mjs

@@ -0,0 +1,13 @@
+import { r, h as e } from "./index-E1PpO1J3.mjs";
+import { c } from "./chevron-up-c66bd477-CETJkshq.mjs";
+const o = class {
+  constructor(s) {
+    r(this, s), this.class = "";
+  }
+  render() {
+    return e("span", { key: "7b8f0aa2da992611e0c908ca0785abce6e1ae189", class: this.class, innerHTML: c });
+  }
+};
+export {
+  o as eds_icon_chevron_up
+};

package/eds-icon-chevron-up.entry-Dy81hGw-.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-D4alMZtT.js"),r=require("./chevron-up-c66bd477-ByW7R48t.js"),c=class{constructor(s){e.registerInstance(this,s),this.class=""}render(){return e.h("span",{key:"7b8f0aa2da992611e0c908ca0785abce6e1ae189",class:this.class,innerHTML:r.chevronUp})}};exports.eds_icon_chevron_up=c;

package/eds-icon-close.entry-CpGzc34L.mjs

@@ -0,0 +1,13 @@
+import { r as e, h as r } from "./index-E1PpO1J3.mjs";
+import { c } from "./close-87fc0d63-DtDU2HIU.mjs";
+const n = class {
+  constructor(s) {
+    e(this, s), this.class = "";
+  }
+  render() {
+    return r("span", { key: "8e4dedef0fe684fdd6078db8005661e49207da55", class: this.class, innerHTML: c });
+  }
+};
+export {
+  n as eds_icon_close
+};

package/{eds-icon-close.entry-BSSS65tZ.js → eds-icon-close.entry-DNhXNl8O.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-DvG3cC-8.js"),c=require("./close-87fc0d63-Cbd-ScJr.js"),r=class{constructor(s){e.registerInstance(this,s),this.class=""}render(){return e.h("span",{key:"947f6615e8ee155be98b379a9c771cc0d453becd",class:this.class,innerHTML:c.close})}};exports.eds_icon_close=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-D4alMZtT.js"),c=require("./close-87fc0d63-Cbd-ScJr.js"),r=class{constructor(s){e.registerInstance(this,s),this.class=""}render(){return e.h("span",{key:"8e4dedef0fe684fdd6078db8005661e49207da55",class:this.class,innerHTML:c.close})}};exports.eds_icon_close=r;