@cling-se/widget 1.0.0-beta.1 → 1.0.0-beta.3

package/dist/{TermsSettings-CE3h_xkm.js → TermsSettings-DsN6v5yj.js}

@@ -1,7 +1,9 @@
-import { i as m, F as o, n as v } from "./main-WKzC-Dnu.js";
-import { m as c } from "./mapFormMixin-QbevCwJK.js";
-import g from "./Index-mJ8F41GY.js";
-const p = {
+import { _ as C, V as T, a7 as _, b as u, a3 as B, o as s, d as h, s as n, B as v, v as i, E as x, e as k, w as l, F as S, k as F, c as g, f } from "./main-C4OdoeS2.js";
+import { m as U } from "./mapFormMixin-v-nbaWcx.js";
+import { C as j } from "./CCallout-81NkOge7.js";
+import { C as D, a as I } from "./CDropdownItem-DvaU14-V.js";
+import { u as N } from "./useTermsModal-C_eLdGLi.js";
+const A = {
   i18nOptions: {
     namespaces: "terms",
     messages: {
@@ -29,74 +31,192 @@ const p = {
   },
   name: "TermsSettings",
   components: {
-    TermsDisclaimer: g
+    CCallout: j,
+    CDropdown: D,
+    CDropdownItem: I
   },
-  mixins: [c(["term"])],
+  mixins: [U(["term"])],
   data() {
     return {
       terms: {
         data: {},
         ids: []
-      },
-      termsIdList: []
+      }
+    };
+  },
+  setup() {
+    const { showTermsModal: t } = N();
+    return {
+      showTermsModal: t
     };
   },
   async created() {
     await this.getTerms();
   },
   methods: {
+    showTerms() {
+      this.showTermsModal({
+        text: this.term.text,
+        _document: this._document,
+        termType: this.term.type,
+        file: this.term.file,
+        href: this.term.href
+      });
+    },
     async getTerms() {
-      let r = [];
-      this.viewSettings.isPublicForm ? r = this.getPublicTerms() : { data: r } = await m("documentTerm"), r.forEach(({ name: t, type: e, text: a, href: n, version: i, File: l, id: d }) => {
-        const s = {
-          name: t,
-          type: e === "pdf" ? "file" : e,
-          text: a || "",
-          href: n || "",
-          version: i,
-          termId: d,
-          file: l ? {
-            name: l.displayName,
-            url: l.url,
-            mime: l.mime,
-            fileId: l.id
+      let t = [];
+      this.viewSettings.isPublicForm ? t = this.getPublicTerms() : { data: t } = await T("documentTerm"), t.forEach(({ name: e, type: c, text: b, href: a, version: p, File: r, id: o }) => {
+        const d = {
+          name: e,
+          type: c === "pdf" ? "file" : c,
+          text: b || "",
+          href: a || "",
+          version: p,
+          termId: o,
+          file: r ? {
+            name: r.displayName,
+            url: r.url,
+            mime: r.mime,
+            fileId: r.id
           } : null
         };
-        this.terms.data[s.termId] = s, this.terms.ids.push(s.termId);
+        this.terms.data[d.termId] = d, this.terms.ids.push(d.termId);
       }), this.term && !this.terms.ids.includes(this.term.termId) && (this.terms.data[this.term.termId] = this.term, this.terms.ids.push(this.term.termId));
     },
     getPublicTerms() {
-      const { language: r } = this._document, t = [];
-      return r === "sv" && t.push({
+      const { language: t } = this._document, e = [];
+      return t === "sv" && e.push({
         id: 1,
         name: "Standardvillkor Konsultkontrakt",
         type: "text",
         text: '<div class="term-chapter"> <div class="term-title">Tillämplighet</div><div class="term-text"> Dessa allmänna villkor gäller vid utförande av avtalade tjänster mellan Beställare och Utställare. När Beställare anlitar Utställare ansas beställare ha acceptera dessa villkor. Avvikelser från villkoren ska vara skriftliga för att vara gällande. </div></div><div class="term-chapter"> <div class="term-title">Uppdragets omfattning</div><div class="term-text"> Utställare åtar sig att utföra tjänsten fackmässigt och ska med tillbörlig omsorg ta till vara på Beställarens intressen och samråda med denne i den utsträckning som behövs och är möjligt. Omfattningen av uppdraget kan komma att ändras under uppdragets gång utställare ska inhämta beställarens godkännande avseende åtgärder som ligger utanför ramen för uppdraget. </div></div><div class="term-chapter"> <div class="term-title">Uppdragets genomförande</div><div class="term-text"> Baserat på vad som är tillämpligt från fall till fall ska Beställarens lämna Utställare, erforderlig tillgång till lokaler, information eller liknande som krävs för att genomföra uppdraget. Utställare ska utföra alla delar av avtalat åtagande i enlighet med bestämmelserna i leveransavtalet och dessa allmänna villkor och med den skicklighet, snabbhet och omsorg som Beställaren har anledning att förvänta sig av ett välrenommerat företag i branschen. </div></div><div class="term-chapter"> <div class="term-title">Sekretess</div><div class="term-text"> Beställare och Utövare förbinder sig att behandla all information som erhålls från, eller som uppkommer i samband med uppdraget med den andre parten strikt konfidentiellt och inte avslöja sådan information eller använda informationen för egen eller annans räkning, om inte den andre parten har givit skriftligt samtycke för sådan användning. Åtagandet enligt denna bestämmelse skall gälla även efter att parternas samarbete har upphört, och intill dess sådan information som avses härunder får anses ha kommit till allmän kännedom på annat sätt än genom brott mot detta avtal. Sekretesskyldigheten gäller inte när part är skyldig enligt lag, eller myndighetsbeslut att lämna ut uppgifter. Är part skyldig enligt lag att lämna ut uppgifter skall, innan sådant utlämnande sker, andra parten informeras därom. Om inte annat avtalats har Utställare rätt att använda beställarens namn och logo i referenslista samt annat material att användas i marknadsföringsändamål. </div></div><div class="term-chapter"> <div class="term-title">Ansvar</div><div class="term-text"> Utövare är skyldig att teckna lagstadgad ansvars och arbetsskadeförsäkring för sig själv och sina anställda. Om beställaren drabbas av förlust, som direkt följd av att beställaren misslyckats med att fullfölja åtaganden enligt detta kontrakt eller visat grov oaktsamhet i samband med utförandet av projektet, ansvarar utövaren för förlusten. Utställare ansvarar inte för någon följdförlust, badwill eller annan indirekt skada som Beställare lidit pga. eller i samband med resultatet av uppdraget. </div></div><div class="term-chapter"> <div class="term-title">Rättigheter</div><div class="term-text"> Beställaren erhåller ägande, upphovsrätt och andra rättigheter till program, analyser, rapporter, dokument och liknande som utställare producerar som en del av detta uppdrag. </div></div><div class="term-chapter"> <div class="term-title">Förseningar</div><div class="term-text"> Utställare ansvarar inte för förseningar på grund av leveransförseningar från andra leverantörer som utställare inte har ingått i avtal med. Utställare är inte ansvarig för eventuella förseningar på grund av kundrelationer. Om avtalet har blivit föremål för leverans vid angivna tider har Utställare rätt att skjuta upp leveransdatumet om kunden ändrar uppdraget / innehållet i uppdraget eller inte tillhandahåller aktuell information, ritningar, dokument, data eller liknande som är en förutsättning för uppdragets utförande. </div></div><div class="term-chapter"> <div class="term-title">Force majeure</div><div class="term-text"> Yttre händelser utanför parternas kontroll (t ex myndighetsåtgärder, krig, mobilisering, arbetsmarknadskonflikt, naturkatastrof etc.) och som inte endast är av tillfällig natur och som förhindrar genomförande av uppdraget berättigar vardera parten att helt inställa uppdraget utan rätt till skadestånd för den andra parten. </div></div><div class="term-chapter"> <div class="term-title">Tvist</div><div class="term-text"> Om en av parterna inte fullgör sina skyldigheter enligt avtalet och de villkor som är knutna till den, har den andra parten rätt att säga upp avtalet. Svensk lag ska tillämpas på detta Avtal och på varje annat avtal mellan parterna. Tvist som uppstår i anledning av Avtalet ska avgöras i allmän domstol. </div></div>'
-      }), t;
+      }), e;
     },
-    truncate: o
+    truncate: _
   }
-};
-var u = function() {
-  var t = this, e = t._self._c;
-  return e("div", { staticClass: "d-root" }, [e("div", { staticClass: "d-option-title" }, [t._v(" " + t._s(t.$t("title")) + " "), e("svg", { directives: [{ name: "tooltip", rawName: "v-tooltip", value: t.$t("tooltip"), expression: "$t('tooltip')" }], attrs: { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2.5", "stroke-linecap": "square", "stroke-linejoin": "bevel" } }, [e("circle", { attrs: { cx: "12", cy: "12", r: "10" } }), e("line", { attrs: { x1: "12", y1: "16", x2: "12", y2: "12" } }), e("line", { attrs: { x1: "12", y1: "8", x2: "12", y2: "8" } })])]), e("CDropdown", { attrs: { value: t.term ? t.term.id : null, expanded: "" } }, [e("CButton", { staticClass: "is-left", staticStyle: { width: "100%" }, attrs: { slot: "trigger", "dropdown-icon": !0 }, slot: "trigger" }, [e("div", { staticClass: "truncate-text" }, [t._v(" " + t._s(t.truncate(t.term && t.terms.ids.length && t.terms.data[t.term.termId].name || t.$t("noneSelected"), 20)) + " ")])]), t._l(t.terms.ids, function(a) {
-    return e("CDropdownItem", { key: a, staticStyle: { "padding-right": "calc(1 * var(--rem))" }, attrs: { value: a }, on: { click: function(n) {
-      t.term = t.terms.data[a];
-    } } }, [e("div", { staticClass: "truncate-text" }, [t._v(" " + t._s(t.terms.data[a].name) + " ")])]);
-  }), e("CDropdownItem", { attrs: { value: null }, on: { click: function(a) {
-    t.term = null;
-  } } }, [t._v(t._s(t.$t("notSet")))]), t.terms.ids.length ? t._e() : e("CDropdownItem", { attrs: { disabled: "" } }, [t._v(t._s(t.$t("noResults")))])], 2), t.viewSettings.isPublicForm ? e("CCallout", { staticStyle: { margin: "1em 0" }, attrs: { title: t.$t("publicFormCalloutTitle"), size: "small" } }, [t._v(" " + t._s(t.$t("publicFormCallout")) + " ")]) : t._e(), t.term ? e("TermsDisclaimer", { attrs: { _document: t._document, "term-type": t.term.type, href: t.term.href, text: t.term.text, file: t.term.file }, scopedSlots: t._u([{ key: "default", fn: function({ openTerms: a }) {
-    return [e("CButton", { staticStyle: { "margin-top": "5px" }, attrs: { type: "none", pattern: "secondary", size: "small", "icon-left": "eye" }, on: { click: a } }, [t._v(" " + t._s(t.$t("show")) + " ")])];
-  } }], null, !1, 1475186016) }) : t._e()], 1);
-}, h = [], f = /* @__PURE__ */ v(
-  p,
-  u,
-  h,
-  !1,
-  null,
-  "f7bd188e"
-);
-const y = f.exports;
+}, O = { class: "d-root" }, V = {
+  class: "d-option",
+  style: { "border-bottom": "none" }
+}, $ = { class: "d-option-title" }, M = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "16",
+  height: "16",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2.5",
+  "stroke-linecap": "square",
+  "stroke-linejoin": "bevel"
+}, P = { class: "truncate-text" }, R = { class: "truncate-text" };
+function E(t, e, c, b, a, p) {
+  const r = u("CButton"), o = u("CDropdownItem"), d = u("CDropdown"), y = u("CCallout"), w = B("tooltip");
+  return s(), h("div", O, [
+    n("div", V, [
+      n("div", $, [
+        v(i(t.$t("title")) + " ", 1),
+        x((s(), h("svg", M, e[1] || (e[1] = [
+          n("circle", {
+            cx: "12",
+            cy: "12",
+            r: "10"
+          }, null, -1),
+          n("line", {
+            x1: "12",
+            y1: "16",
+            x2: "12",
+            y2: "12"
+          }, null, -1),
+          n("line", {
+            x1: "12",
+            y1: "8",
+            x2: "12",
+            y2: "8"
+          }, null, -1)
+        ]))), [
+          [w, t.$t("tooltip")]
+        ])
+      ])
+    ]),
+    k(d, {
+      "model-value": t.term ? t.term.id : null,
+      expanded: ""
+    }, {
+      trigger: l(() => [
+        k(r, {
+          "dropdown-icon": !0,
+          class: "is-left",
+          style: { width: "100%" }
+        }, {
+          default: l(() => [
+            n("div", P, i(p.truncate(
+              t.term && a.terms.ids.length && a.terms.data[t.term.termId].name || t.$t("noneSelected"),
+              20
+            )), 1)
+          ]),
+          _: 1
+        })
+      ]),
+      default: l(() => [
+        (s(!0), h(S, null, F(a.terms.ids, (m) => (s(), g(o, {
+          key: m,
+          value: m,
+          style: { "padding-right": "calc(1 * var(--rem))" },
+          onClick: (z) => t.term = a.terms.data[m]
+        }, {
+          default: l(() => [
+            n("div", R, i(a.terms.data[m].name), 1)
+          ]),
+          _: 2
+        }, 1032, ["value", "onClick"]))), 128)),
+        k(o, {
+          value: null,
+          onClick: e[0] || (e[0] = (m) => t.term = null)
+        }, {
+          default: l(() => [
+            v(i(t.$t("notSet")), 1)
+          ]),
+          _: 1
+        }),
+        a.terms.ids.length ? f("", !0) : (s(), g(o, {
+          key: 0,
+          disabled: ""
+        }, {
+          default: l(() => [
+            v(i(t.$t("noResults")), 1)
+          ]),
+          _: 1
+        }))
+      ]),
+      _: 1
+    }, 8, ["model-value"]),
+    t.viewSettings.isPublicForm ? (s(), g(y, {
+      key: 0,
+      title: t.$t("publicFormCalloutTitle"),
+      size: "small",
+      style: { margin: "1em 0" }
+    }, {
+      default: l(() => [
+        v(i(t.$t("publicFormCallout")), 1)
+      ]),
+      _: 1
+    }, 8, ["title"])) : f("", !0),
+    t.term ? (s(), g(r, {
+      key: 1,
+      type: "none",
+      pattern: "secondary",
+      size: "small",
+      "icon-left": "eye",
+      style: { "margin-top": "5px" },
+      onClick: p.showTerms
+    }, {
+      default: l(() => [
+        v(i(t.$t("show")), 1)
+      ]),
+      _: 1
+    }, 8, ["onClick"])) : f("", !0)
+  ]);
+}
+const H = /* @__PURE__ */ C(A, [["render", E]]);
 export {
-  y as default
+  H as default
 };

package/dist/ThemeColorRow-BL6p09pN.js

@@ -0,0 +1,108 @@
+import { C as h } from "./ColorPicker-C0OahiVg.js";
+import { _ as k } from "./ManualPopover-BzBvSl_x.js";
+import { h as w } from "./color-HetJPhlA.js";
+import { _ as C, b as l, a3 as _, o as a, d as i, s as o, S as d, E as g, f as V, e as p, w as u, ao as c, Z as b, l as y } from "./main-C4OdoeS2.js";
+const P = {
+  name: "ThemeColorRow",
+  components: {
+    ColorPicker: h,
+    ManualPopover: k
+  },
+  emits: ["change"],
+  props: {
+    value: {
+      type: String,
+      default: ""
+    },
+    pickerOptions: {
+      type: Object,
+      default: () => ({})
+    },
+    showReset: {
+      type: Boolean,
+      default: !1
+    },
+    placement: {
+      type: String,
+      default: "bottom-end"
+    }
+  },
+  computed: {
+    internalValue: {
+      get() {
+        return this.value;
+      },
+      set(t) {
+        this.$emit("change", w(t.hsl));
+      }
+    }
+  },
+  methods: {
+    reset() {
+      this.$emit("change", null);
+    }
+  }
+}, M = {
+  ref: "themeContainer",
+  class: "theme-row"
+}, S = { style: { flex: "1 1 auto" } }, B = { ref: "button" };
+function x(t, e, n, O, R, r) {
+  const m = l("ColorPicker"), f = l("ManualPopover"), v = _("tooltip");
+  return a(), i("div", M, [
+    o("div", S, [
+      d(t.$slots, "default", {}, void 0, !0)
+    ]),
+    n.showReset ? g((a(), i("div", {
+      key: 0,
+      class: "reset-button",
+      onClick: e[0] || (e[0] = (...s) => r.reset && r.reset(...s))
+    }, e[4] || (e[4] = [
+      o("svg", {
+        xmlns: "http://www.w3.org/2000/svg",
+        width: "16",
+        height: "16",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        "stroke-width": "2",
+        "stroke-linecap": "round",
+        "stroke-linejoin": "round"
+      }, [
+        o("path", { d: "M2.5 2v6h6M2.66 15.57a10 10 0 1 0 .57-8.38" })
+      ], -1)
+    ]))), [
+      [v, t.$t("reset")]
+    ]) : V("", !0),
+    p(f, { "popper-class": "popover-color-picker" }, {
+      popper: u(() => [
+        o("div", {
+          onMousedown: e[2] || (e[2] = c(() => {
+          }, ["stop"])),
+          onClick: e[3] || (e[3] = c(() => {
+          }, ["stop"]))
+        }, [
+          p(m, b(n.pickerOptions, {
+            ref: "colorPicker",
+            modelValue: r.internalValue,
+            "onUpdate:modelValue": e[1] || (e[1] = (s) => r.internalValue = s)
+          }), null, 16, ["modelValue"])
+        ], 32)
+      ]),
+      default: u(() => [
+        o("div", B, [
+          d(t.$slots, "button", {}, () => [
+            o("div", {
+              style: y({ backgroundColor: r.internalValue }),
+              class: "current-color-icon"
+            }, null, 4)
+          ], !0)
+        ], 512)
+      ]),
+      _: 3
+    })
+  ], 512);
+}
+const D = /* @__PURE__ */ C(P, [["render", x], ["__scopeId", "data-v-cdf22c3c"]]);
+export {
+  D as T
+};

package/dist/ToggleBinding-B-tVioQ9.js

@@ -0,0 +1,44 @@
+import { m as s } from "./mapFormMixin-v-nbaWcx.js";
+import { I as m } from "./InputToggleRow-BCvMVbW-.js";
+import { b as p } from "./CDropdownItem-DvaU14-V.js";
+import { _ as d, b as e, o as g, d as r, e as i, w as c } from "./main-C4OdoeS2.js";
+const u = {
+  name: "ToggleBinding",
+  i18nOptions: {
+    namespaces: "ToggleBinding",
+    messages: {
+      en: {
+        label: "Answer not binding"
+      },
+      sv: {
+        label: "Ej bindande svar"
+      }
+    }
+  },
+  components: {
+    InputToggleRow: m,
+    CSwitch: p
+  },
+  mixins: [s(["notBinding"])]
+};
+function b(n, o, f, w, B, _) {
+  const t = e("CSwitch"), l = e("InputToggleRow");
+  return g(), r("div", null, [
+    i(l, {
+      "display-value": n.notBinding,
+      label: n.$t("label")
+    }, {
+      toggle: c(() => [
+        i(t, {
+          modelValue: n.notBinding,
+          "onUpdate:modelValue": o[0] || (o[0] = (a) => n.notBinding = a)
+        }, null, 8, ["modelValue"])
+      ]),
+      _: 1
+    }, 8, ["display-value", "label"])
+  ]);
+}
+const I = /* @__PURE__ */ d(u, [["render", b]]);
+export {
+  I as default
+};

package/dist/UploadModal-BnA1xLMy.js

@@ -0,0 +1,134 @@
+import { _ as y, m as x, V as v, y as w, au as b, b as p, o as r, d as i, s, B as k, v as l, F as u, k as _, e as c, w as C, f as $ } from "./main-C4OdoeS2.js";
+import { _ as U } from "./Index.vue_vue_type_script_lang-DLogex2i.js";
+const F = {
+  i18nOptions: {
+    namespaces: "uploadModal",
+    messages: {
+      sv: {
+        upPlaceholder: "Dra & släpp filer hit eller",
+        recentlyUsed: "Senast använda"
+      },
+      en: {
+        upPlaceholder: "Drag & drop files here or",
+        recentlyUsed: "Recently used"
+      }
+    }
+  },
+  name: "UploadModal",
+  components: {
+    FileIcon: U
+  },
+  emits: ["open-picker", "select"],
+  data() {
+    return {
+      recentFiles: [],
+      isLoading: !0
+    };
+  },
+  computed: {
+    ...x({
+      user: "application/user"
+    })
+  },
+  mounted() {
+    this.loadFiles();
+  },
+  methods: {
+    async loadFiles() {
+      var e;
+      this.isLoading = !0;
+      try {
+        const { data: o } = await v("/file", {
+          params: {
+            CompanyUserId: (e = this.user) == null ? void 0 : e.id,
+            _sort: "lastUsedAt",
+            _order: "DESC",
+            _start: 0,
+            _end: 20
+          }
+        });
+        this.recentFiles = (o || []).map(
+          ({ displayName: d, mime: h, id: n, createdAt: m, url: a }) => ({
+            name: d,
+            // TODO, could refactor to only 'displayName'
+            displayName: d,
+            // file-uploader-component uses displayName, therefore needed for select
+            mime: h,
+            id: n,
+            createdAt: m,
+            url: a
+          })
+        );
+      } catch (o) {
+        w(o);
+      } finally {
+        this.isLoading = !1;
+      }
+    },
+    onSelect(e) {
+      b(`/file/${e.id}/updateLastUsedAt`), this.$emit("select", e);
+    }
+  }
+}, L = { class: "max-h-[90%] w-[460px] max-w-full rounded-xl bg-white text-base" }, P = { class: "p-6" }, D = { class: "text-primary-500 underline" }, I = {
+  key: 0,
+  class: "h-[400px] max-h-[50vh] overflow-auto border-t border-gray-200 pb-4 text-left"
+}, S = { style: { "font-size": "15px", padding: "1em", margin: "0px 1em", color: "hsl(0, 0%, 30%)" } }, V = { class: "flex-grow" }, B = ["onClick"], z = { class: "truncate-text" }, A = {
+  class: "truncate-text",
+  style: { "font-weight": "500" }
+}, E = { class: "up-recent-item-hint" };
+function M(e, o, d, h, n, m) {
+  const a = p("ContentPlaceholdersText"), g = p("ContentPlaceholders"), f = p("FileIcon");
+  return r(), i("div", L, [
+    s("div", P, [
+      s("div", {
+        class: "hover:border-primary-500/20 cursor-pointer rounded-lg border border-gray-200 bg-gray-50 p-8 text-center text-gray-700 hover:bg-gray-100 active:bg-gray-200",
+        onClick: o[0] || (o[0] = (t) => e.$emit("open-picker"))
+      }, [
+        k(l(e.$t("upPlaceholder")) + " ", 1),
+        s("span", D, l(e.$t("_common:browse")), 1)
+      ])
+    ]),
+    n.isLoading || n.recentFiles.length ? (r(), i("div", I, [
+      s("div", S, l(e.$t("recentlyUsed")), 1),
+      n.isLoading ? (r(), i(u, { key: 0 }, _(6, (t) => c(g, {
+        key: t,
+        animated: !1,
+        class: "up-recent-item flex w-full items-center"
+      }, {
+        default: C(() => [
+          c(a, {
+            lines: 1,
+            style: { width: "37px", height: "38px", "font-size": "24px", "margin-right": "4px" }
+          }),
+          s("div", V, [
+            c(a, { lines: 1 }),
+            c(a, {
+              lines: 1,
+              class: "up-recent-item-hint",
+              style: { "max-width": "50%" }
+            })
+          ])
+        ]),
+        _: 2
+      }, 1024)), 64)) : (r(!0), i(u, { key: 1 }, _(n.recentFiles, (t) => (r(), i("div", {
+        key: t.id,
+        class: "up-recent-item flex w-full items-center",
+        onClick: (N) => m.onSelect(t)
+      }, [
+        c(f, {
+          mime: t.mime,
+          size: 30,
+          style: { "margin-right": "1em" }
+        }, null, 8, ["mime"]),
+        s("div", z, [
+          s("div", A, l(t.name), 1),
+          s("div", E, l(e.$formatDate(t.createdAt)), 1)
+        ])
+      ], 8, B))), 128))
+    ])) : $("", !0)
+  ]);
+}
+const O = /* @__PURE__ */ y(F, [["render", M], ["__scopeId", "data-v-d88c1700"]]);
+export {
+  O as default
+};

package/dist/VideoPlayerInput-D38S1IDH.js

@@ -0,0 +1,135 @@
+import { _ as p } from "./CFormField.vue_vue_type_script_setup_true_lang-B4s_Zfsp.js";
+import { u as c } from "./index-8g2jwLJx.js";
+import { d as V } from "./debounce-CBRJalZI.js";
+import { v as h } from "./utils-vnvZGRwQ.js";
+import { _ as v, b as i, o as y, c as _, w as o, e as d, S as g, B as w, v as C, l as x } from "./main-C4OdoeS2.js";
+const D = {
+  name: "VideoPlayerInput",
+  i18nOptions: {
+    namespaces: "components",
+    keyPrefix: "document.videoPlayer"
+  },
+  components: {
+    CField: p
+  },
+  props: {
+    modelValue: {
+      type: Object,
+      default: () => ({})
+    },
+    isDrawerMode: {
+      type: Boolean,
+      default: !1
+    },
+    videoOptions: {
+      type: Object,
+      default: () => ({ background: !1 })
+    },
+    filled: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["update:modelValue"],
+  setup() {
+    return {
+      v$: c()
+    };
+  },
+  data() {
+    return {
+      isLoading: !1,
+      isValid: !1,
+      url: ""
+    };
+  },
+  validations() {
+    return {
+      url: {
+        isValid: () => this.isValid
+      }
+    };
+  },
+  computed: {
+    messages() {
+      return {
+        url: {
+          isValid: this.$t("validations.url.isValid")
+        }
+      };
+    }
+  },
+  created() {
+    this.modelValue && this.modelValue.url && (this.url = this.modelValue.url);
+  },
+  methods: {
+    onInput: V(function(e) {
+      this.v$.$reset(), this.isValid = !1, e && this.validateUrl(e);
+    }, 500),
+    async validateUrl(l) {
+      const e = l;
+      this.isLoading = !0;
+      const t = await h(e, this.videoOptions);
+      t && (this.isValid = !0, this.$emit("update:modelValue", t)), this.isLoading = !1, this.v$.$touch();
+    },
+    focus() {
+      this.$refs.input && this.$refs.input.focus();
+    }
+  }
+};
+function B(l, e, t, u, s, a) {
+  const m = i("CInput"), n = i("CField"), f = i("CButton");
+  return y(), _(n, {
+    grouped: !t.isDrawerMode,
+    style: x(
+      t.isDrawerMode && {
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "flex-start"
+      }
+    )
+  }, {
+    default: o(() => [
+      d(n, {
+        validator: u.v$.url,
+        messages: a.messages.url,
+        expanded: "",
+        style: { width: "100%" }
+      }, {
+        default: o(() => [
+          d(m, {
+            ref: "input",
+            modelValue: s.url,
+            "onUpdate:modelValue": [
+              e[0] || (e[0] = (r) => s.url = r),
+              a.onInput
+            ],
+            placeholder: "https://www...",
+            size: t.isDrawerMode ? "small" : void 0,
+            loading: s.isLoading,
+            filled: t.filled || t.isDrawerMode,
+            expanded: ""
+          }, null, 8, ["modelValue", "size", "loading", "filled", "onUpdate:modelValue"])
+        ]),
+        _: 1
+      }, 8, ["validator", "messages"]),
+      g(l.$slots, "default", {}, () => [
+        d(f, {
+          size: t.isDrawerMode ? "small" : void 0,
+          type: "secondary",
+          onClick: e[1] || (e[1] = (r) => a.validateUrl(s.url))
+        }, {
+          default: o(() => [
+            w(C(l.$t("_common:add")), 1)
+          ]),
+          _: 1
+        }, 8, ["size"])
+      ])
+    ]),
+    _: 3
+  }, 8, ["grouped", "style"]);
+}
+const k = /* @__PURE__ */ v(D, [["render", B]]);
+export {
+  k as default
+};