@cling-se/widget 0.14.4 → 0.14.5

package/dist/CompanyModal-5t4yhKL4.js

@@ -0,0 +1,141 @@
+import { w as r } from "./CDropdownItem-BjYnhZJr.js";
+import { E as l, g as s, n as c } from "./main-B9t0ybqW.js";
+import { v as o } from "./index-Czyda2Ej.js";
+import { m as p, b as n, a as d } from "./vuex.esm-DKGl8mcw.js";
+import { s as m, a as u } from "./publicSenderState-DD1lN9CR.js";
+const { mapFields: f } = l({
+  getterType: "forms/getField",
+  mutationType: "forms/updateField"
+}), y = {
+  name: "CompanyModal",
+  mixins: [r],
+  props: {
+    inputFocusOnMount: {
+      type: String,
+      default: ""
+    },
+    isPublicForm: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  data() {
+    return {
+      isLoading: !1
+    };
+  },
+  validations: {
+    name: {
+      required: o.required
+    },
+    email: {
+      email: o.email
+    }
+  },
+  computed: {
+    ...p({
+      isPostingCompany: "companies/isPosting",
+      isPostingUser: "companyUsers/isPosting",
+      hasChanged: "forms/hasChanged",
+      companyRegion: "application/companyRegion",
+      can: "application/can"
+    }),
+    ...f({
+      company: "company",
+      user: "companyUser",
+      name: "company.name",
+      email: "companyUser.email",
+      firstName: "companyUser.firstname",
+      lastName: "companyUser.lastname",
+      cellphone: "companyUser.cellphone"
+    }),
+    ...n("application", {
+      currentUserId: (i) => i.user.userId
+    }),
+    ...n("forms", {
+      documentCompanyUserId: ({ document2: i }) => i && i.companyUserId
+    }),
+    isFullScreen() {
+      return this.mq === "sm";
+    },
+    isPosting() {
+      return this.isPostingCompany || this.isPostingUser;
+    },
+    notCurrentUser() {
+      return this.currentUserId !== this.documentCompanyUserId && !this.isPublicForm;
+    },
+    messages() {
+      const i = (e) => this.$t(`views:account.settings.company.validations.${e}`);
+      return {
+        name: {
+          required: i("name.required")
+        },
+        email: {
+          required: i("email.required"),
+          email: i("email.email")
+        }
+      };
+    }
+  },
+  created() {
+    this.loadForm();
+  },
+  mounted() {
+    this.$refs[this.inputFocusOnMount] ? this.$refs[this.inputFocusOnMount].$el.querySelector("input").focus() : this.$refs.name.$el.querySelector("input").focus();
+  },
+  methods: {
+    ...d({
+      formEditCompany: s.FORM_EDIT_COMPANY,
+      formEditCompanyUser: s.FORM_EDIT_COMPANY_USER,
+      formSubmitCompany: s.FORM_SUBMIT_COMPANY,
+      formSubmitCompanyUser: s.FORM_SUBMIT_COMPANY_USER,
+      setForm: s.SET_FORM,
+      showMessage: s.SHOW_MESSAGE
+    }),
+    loadForm() {
+      this.isPublicForm ? (this.setForm({ key: "company", formData: m.company }), this.setForm({ key: "companyUser", formData: m.user })) : (this.formEditCompany({ props: ["name"] }), this.formEditCompanyUser({
+        id: this.documentCompanyUserId,
+        props: ["id", "firstname", "lastname", "cellphone", "email"]
+      }));
+    },
+    async save() {
+      this.$v.$touch(), !this.$v.$invalid && (this.isLoading = !0, this.isPublicForm ? u({ company: this.company, user: this.user }) : await Promise.all([
+        ...this.hasChanged("company") ? [this.formSubmitCompany()] : [],
+        ...this.hasChanged("companyUser") && this.currentUserId === this.documentCompanyUserId ? [this.formSubmitCompanyUser()] : []
+      ]), this.$emit("close"), this.isLoading = !1);
+    },
+    close() {
+      this.$emit("close");
+    }
+  }
+};
+var h = function() {
+  var e = this, a = e._self._c;
+  return a("div", { staticClass: "font-inter", class: {
+    "full-screen": e.isFullScreen,
+    "modal-overlay": !0
+  }, on: { "&click": function(t) {
+    return t.target !== t.currentTarget ? null : e.close.apply(null, arguments);
+  } } }, [a("div", { staticClass: "modal-container", style: !e.isFullScreen && { padding: "calc(3 * var(--rem))" } }, [e.isFullScreen ? a("CButton", { staticClass: "modal-close", attrs: { pattern: "tertiary", type: "none", circle: "", icon: "x" }, on: { click: e.close } }) : e._e(), a("div", { staticClass: "form-client" }, [a("div", { staticStyle: { "font-weight": "600", "font-size": "21px", "padding-bottom": "calc(2.5 * var(--rem))" } }, [e._v(" " + e._s(e.$t("_common:edit", { thing: e.$t("_common:company") })) + " ")]), a("CField", { staticStyle: { "margin-bottom": "calc(1.5 * var(--rem))" }, attrs: { label: e.$t("_common:companyName").capitalize(), validator: e.$v.name, messages: e.messages.name, "label-position": "inside" } }, [a("CInput", { ref: "name", attrs: { disabled: e.isPublicForm ? !1 : !e.can("company", "modify"), placeholder: e.$t("_common:companyName").capitalize(), size: "medium" }, model: { value: e.name, callback: function(t) {
+    e.name = t;
+  }, expression: "name" } })], 1), a("CField", { staticStyle: { "margin-bottom": "calc(1.5 * var(--rem))" }, attrs: { label: e.$t("_common:firstName").capitalize(), "label-position": "inside" } }, [a("CInput", { ref: "reference", attrs: { disabled: e.notCurrentUser, placeholder: e.$t("_common:firstName").capitalize(), size: "medium" }, model: { value: e.firstName, callback: function(t) {
+    e.firstName = t;
+  }, expression: "firstName" } }), a("CField", { attrs: { label: e.$t("_common:lastName").capitalize(), "label-position": "inside" } }, [a("CInput", { attrs: { disabled: e.notCurrentUser, placeholder: e.$t("_common:lastName").capitalize(), size: "medium" }, model: { value: e.lastName, callback: function(t) {
+    e.lastName = t;
+  }, expression: "lastName" } })], 1)], 1), a("CField", { staticStyle: { "margin-bottom": "calc(1.5 * var(--rem))" }, attrs: { validator: e.$v.email, messages: e.messages.email, label: e.$t("_common:email").capitalize(), "label-position": "inside" } }, [a("CInput", { ref: "email", attrs: { disabled: !e.isPublicForm, placeholder: e.$t("_common:email").capitalize(), size: "medium" }, model: { value: e.email, callback: function(t) {
+    e.email = typeof t == "string" ? t.trim() : t;
+  }, expression: "email" } })], 1), a("CField", [a("CPhoneInput", { ref: "cellphone", attrs: { "default-region": e.companyRegion, disabled: e.notCurrentUser, label: e.$t("_common:cellphone").capitalize(), "label-position": "inside", size: "medium" }, model: { value: e.cellphone, callback: function(t) {
+    e.cellphone = t;
+  }, expression: "cellphone" } })], 1), a("CButton", { staticStyle: { "margin-top": "calc(3 * var(--rem))" }, attrs: { loading: e.isPosting, type: "secondary", wide: "", size: "medium" }, on: { click: e.save } }, [e._v(" " + e._s(e.$t("_common:save", { thing: e.$t("_common:company") })) + " ")])], 1)], 1)]);
+}, g = [], C = /* @__PURE__ */ c(
+  y,
+  h,
+  g,
+  !1,
+  null,
+  "20ecbb22"
+);
+const S = C.exports;
+export {
+  S as default
+};

package/dist/ContentWrapper-DwcOQ21l.js

@@ -0,0 +1,183 @@
+import { m as n } from "./mapFormMixin-ETYhBLl2.js";
+import { B as l } from "./BlockMedia-B_UiePCr.js";
+import { t as r } from "./tinycolor-CMC8Xp7x.js";
+import { T as i } from "./DocTextEditor-AqBE7jZj.js";
+import { n as s, ab as c, z as u, B as m, A as p } from "./main-B9t0ybqW.js";
+import { i as d } from "./i18nMessages-Chz_lxGG.js";
+const _ = {
+  name: "StaticComboLayout",
+  props: {
+    layout: {
+      type: String,
+      required: !0
+    }
+  }
+};
+var f = function() {
+  var t = this, e = t._self._c;
+  return ["horizontal"].includes(t.layout) ? e("div", { staticClass: "flex w-full flex-col", staticStyle: { flex: "1 1 auto", "min-height": "100%" } }, [t._t("logo"), e("div", { staticClass: "flex w-full flex-col justify-end", staticStyle: { flex: "1 1 auto" } }, [t._t("preText"), t._t("documentName"), t._t("postText")], 2)], 2) : e("div", { staticClass: "flex w-full flex-col justify-between", class: {
+    "items-center": t.layout === "center"
+  }, staticStyle: { flex: "1 1 auto", "min-height": "100%" } }, [t._t("logo"), e("div", { staticClass: "flex w-full flex-col justify-center", staticStyle: { flex: "1 1 auto" } }, [t._t("preText"), t._t("documentName")], 2), t._t("postText")], 2);
+}, x = [], y = /* @__PURE__ */ s(
+  _,
+  f,
+  x,
+  !1,
+  null,
+  "8e41c57b"
+);
+const h = y.exports, v = {
+  name: "StaticLayout",
+  i18nOptions: {
+    namespaces: "staticLayout",
+    messages: d
+  },
+  components: {
+    DocumentLogotype: () => import("./DocumentLogotype-emSjQ21f.js"),
+    StaticComboLayout: h,
+    TextEditor: i
+  },
+  mixins: [
+    n([
+      "layout",
+      "preText",
+      "documentName",
+      "postText",
+      "showLogo",
+      "logotype"
+    ])
+  ],
+  props: {
+    validator: {
+      type: Object,
+      default: () => ({})
+    },
+    hasHover: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  computed: {
+    companyLogotype() {
+      var o, t;
+      return ((t = (o = this._document.sender) == null ? void 0 : o.company) == null ? void 0 : t.logotype) || "";
+    },
+    internalName: {
+      get() {
+        var o;
+        return this.documentName || `<p data-typography="title">${((o = this._document.data) == null ? void 0 : o.name) || ""}</p>`;
+      },
+      set(o) {
+        this.documentName = o, this.$emit("input", {
+          key: "data.name",
+          value: c(o).trim().slice(0, 255)
+        });
+      }
+    },
+    mentions() {
+      return () => this._document.textTemplateItems || [];
+    }
+  },
+  methods: {
+    mustacheToSpan: u,
+    spanToMustache: m,
+    interpolateString: p
+  }
+};
+var g = function() {
+  var t = this, e = t._self._c;
+  return e("div", { staticClass: "dont-break-out hyphens-auto flex w-full flex-col break-words", class: [`is-layout-${t.layout}`], staticStyle: { "word-wrap": "break-word", "word-break": "break-word" } }, [e("StaticComboLayout", { attrs: { layout: t.layout } }, [e("DocumentLogotype", { attrs: { slot: "logo", "show-logo": t.showLogo, "company-logotype": t.companyLogotype, "has-hover": t.hasHover }, on: { "update:showLogo": function(a) {
+    t.showLogo = a;
+  }, "update:show-logo": function(a) {
+    t.showLogo = a;
+  } }, slot: "logo", model: { value: t.logotype, callback: function(a) {
+    t.logotype = a;
+  }, expression: "logotype" } }), e("template", { slot: "preText" }, [e("TextEditor", { key: "preText" + t.canEdit, ref: "preTextEditor", staticClass: "no-drag header-text", attrs: { value: t.canEdit ? t.mustacheToSpan(
+    t.preText,
+    t._document.textTemplateMap,
+    t._document._doc
+  ) : t.interpolateString(t.preText, t._document._doc), mentions: t.mentions, snippets: !0, placeholder: t.$t("optional").capitalize(), static: "", unstyled: "" }, on: { input: function(a) {
+    t.preText = t.spanToMustache(a);
+  } } })], 1), e("div", { staticStyle: { "font-size": "calc(2 * var(--rem))", "font-weight": "700", margin: "calc(1 * var(--rem)) 0" }, attrs: { slot: "documentName" }, slot: "documentName" }, [t.canEdit ? e("TextEditor", { ref: "nameEditor", staticClass: "no-drag header-text", attrs: { value: t.internalName, extensions: {
+    bulletList: !0,
+    heading: [1, 2, 3],
+    bold: !0,
+    link: !0,
+    underline: !0,
+    blockquote: !0,
+    table: !1
+  }, placeholder: t.$t("name.placeholder"), unstyled: "", static: "" }, on: { input: function(a) {
+    t.internalName = a;
+  } } }) : e("div", { staticClass: "header-text", domProps: { innerHTML: t._s(t.internalName) } })], 1), e("template", { slot: "postText" }, [e("TextEditor", { key: "postText" + t.canEdit, ref: "postTextEditor", staticClass: "no-drag header-text", staticStyle: { width: "100%" }, attrs: { value: t.canEdit ? t.mustacheToSpan(
+    t.postText,
+    t._document.textTemplateMap,
+    t._document._doc
+  ) : t.interpolateString(t.postText, t._document._doc), editable: t.canEdit, mentions: t.mentions, snippets: !0, placeholder: t.$t("optional").capitalize(), static: "", unstyled: "" }, on: { input: function(a) {
+    t.postText = t.spanToMustache(a);
+  } } })], 1)], 2)], 1);
+}, T = [], b = /* @__PURE__ */ s(
+  v,
+  g,
+  T,
+  !1,
+  null,
+  "5e1fe7d6"
+);
+const C = b.exports, w = {
+  name: "ContentWrapper",
+  components: {
+    StaticCombo: C,
+    BlockMedia: l
+  },
+  mixins: [n(["layout", "item", "baseStyle"])],
+  props: {
+    hasHover: {
+      type: Boolean,
+      default: !1
+    },
+    validator: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  data() {
+    return {
+      hoverIndex: null
+    };
+  },
+  computed: {
+    color() {
+      var o;
+      return ((o = this.baseStyle) == null ? void 0 : o.textColor) || this.fallbackTextColor;
+    },
+    textAlign() {
+      var o;
+      return ((o = this.baseStyle) == null ? void 0 : o.textAlign) || "left";
+    },
+    fallbackTextColor() {
+      return this.backgroundColor && r.readability(this.backgroundColor, "#fff") < 1.8 ? "#111111" : "#FFFFFF";
+    }
+  }
+};
+var S = function() {
+  var t = this, e = t._self._c;
+  return e("div", { staticClass: "content-root", class: { "has-hover": t.hasHover }, style: { color: t.color, textAlign: t.textAlign } }, [t.layout !== "center" ? e("BlockMedia", { staticClass: "content-media", attrs: { media: t.item.media } }) : t._e(), e("div", { staticClass: "content-spacing" }, [e("StaticCombo", t._g({ attrs: { "has-hover": t.hasHover, _document: t._document, _value: {
+    layout: t._value.layout,
+    preText: `${t._value.item}.value.preText`,
+    documentName: `${t._value.item}.value.documentName`,
+    postText: `${t._value.item}.value.postText`,
+    showLogo: `${t._value.item}.value.showLogo`,
+    logotype: `${t._value.item}.value.logotype`
+  }, validator: t.validator } }, t.$listeners))], 1)], 1);
+}, $ = [], L = /* @__PURE__ */ s(
+  w,
+  S,
+  $,
+  !1,
+  null,
+  "3dfe0998"
+);
+const z = L.exports;
+export {
+  z as default
+};

package/dist/CoverBlockSettings-cCCXzAZ0.js

@@ -0,0 +1,275 @@
+import { m as d } from "./mapFormMixin-ETYhBLl2.js";
+import { T as l } from "./ThemeColorRow-DMWVlFRU.js";
+import { n as s, P as p, H as u } from "./main-B9t0ybqW.js";
+const m = (i, e, t, o) => Math.atan2(i - t, e - o) * (180 / Math.PI) * -1 + 180, v = {
+  name: "DegreePicker",
+  props: {
+    value: {
+      type: Number,
+      required: !0
+    }
+  },
+  computed: {
+    degreesStyle() {
+      return { transform: `rotate(${this.value}deg)` };
+    }
+  },
+  methods: {
+    onButtonDown(i) {
+      let e = this.mouseDownHandler(i);
+      const t = (o) => {
+        e = this.mouseMoveHandler(o, e) || e;
+      };
+      window.addEventListener("mousemove", t), window.addEventListener(
+        "mouseup",
+        () => {
+          window.removeEventListener("mousemove", t);
+        },
+        { once: !0 }
+      );
+    },
+    mouseMoveHandler(i, { centerX: e, centerY: t }) {
+      const o = m(
+        i.clientX,
+        i.clientY,
+        e,
+        t
+      );
+      this.$emit("input", parseInt(o, 10));
+    },
+    mouseDownHandler(i) {
+      const t = i.target.getBoundingClientRect(), o = t.top + parseInt(8 - window.pageYOffset, 10), r = t.left + parseInt(8 - window.pageXOffset, 10);
+      return { centerY: o, centerX: r };
+    }
+  }
+};
+var g = function() {
+  var e = this, t = e._self._c;
+  return t("div", { staticClass: "gradient-degrees-options" }, [t("div", { staticStyle: { "pointer-events": "none", "user-select": "none", "padding-right": "0.5em", opacity: "0.75" } }, [t("div", [e._v(e._s(e.value) + "°")])]), t("div", { staticClass: "gradient-degrees", on: { mousedown: e.onButtonDown } }, [t("div", { staticClass: "gradient-degree-center", style: e.degreesStyle }, [t("div", { staticClass: "gradient-degree-pointer" })])])]);
+}, _ = [], f = /* @__PURE__ */ s(
+  v,
+  g,
+  _,
+  !1,
+  null,
+  "0c48c700"
+);
+const y = f.exports, h = {
+  name: "GradientPicker",
+  i18nOptions: {
+    namespaces: "gradientPicker",
+    messages: {
+      en: {
+        startColor: "Start color",
+        stopColor: "Stop color",
+        rotation: "Rotation"
+      },
+      sv: {
+        startColor: "Startfärg",
+        stopColor: "Stoppfärg",
+        rotation: "Rotation"
+      }
+    }
+  },
+  components: {
+    ThemeColorRow: l,
+    DegreePicker: y
+  },
+  props: {
+    value: {
+      type: Object,
+      required: !0
+    }
+  },
+  data() {
+    return {
+      set: p,
+      defaultValue: {
+        type: "linear",
+        degree: 0,
+        colors: [
+          { percent: 0, color: "#000000" },
+          { percent: 100, color: "#0095FF" }
+        ]
+      }
+    };
+  },
+  computed: {
+    internalValue: {
+      get() {
+        return { ...this.defaultValue, ...this.value };
+      },
+      set(i) {
+        this.$emit("input", i);
+      }
+    }
+  },
+  methods: {
+    updateData(i, e) {
+      let t = e;
+      if (i === "colors") {
+        const { i: o, color: r, percent: a } = e || {};
+        t = this.internalValue.colors.map(
+          (n, c) => c === o ? { color: r, percent: a } : n
+        );
+      }
+      this.internalValue = { ...this.internalValue, [i]: t };
+    }
+  }
+};
+var C = function() {
+  var e = this, t = e._self._c;
+  return t("div", [t("ThemeColorRow", { staticClass: "d-option-title d-option", attrs: { value: e.internalValue.colors[0].color }, on: { change: function(o) {
+    return e.updateData("colors", { i: 0, percent: 0, color: o });
+  } } }, [e._v(" " + e._s(e.$t("startColor")) + " ")]), t("ThemeColorRow", { staticClass: "d-option-title d-option", attrs: { value: e.internalValue.colors[1].color }, on: { change: function(o) {
+    return e.updateData("colors", { i: 1, percent: 100, color: o });
+  } } }, [e._v(" " + e._s(e.$t("stopColor")) + " ")]), t("div", { staticClass: "d-option flex w-full items-center" }, [t("div", { staticClass: "d-option-title", staticStyle: { flex: "1 1 auto" } }, [e._v(" " + e._s(e.$t("rotation")) + " ")]), t("DegreePicker", { staticStyle: { "padding-right": "4px" }, attrs: { value: e.internalValue.degree }, on: { input: function(o) {
+    return e.updateData("degree", o);
+  } } })], 1)], 1);
+}, b = [], w = /* @__PURE__ */ s(
+  h,
+  C,
+  b,
+  !1,
+  null,
+  "e22a6b42"
+);
+const $ = w.exports, x = {
+  image: () => import("./ImageSelectModal-Cimviyuy.js"),
+  video: () => import("./VideoSelectModal-BbaNAxGH.js")
+}, S = {
+  name: "CoverBlockSettings",
+  i18nOptions: {
+    namespaces: "coverBlockSettings",
+    messages: {
+      en: {
+        colorLabel: "Color",
+        overlay: {
+          title: "Overlay",
+          colorLabel: "Color",
+          opacityLabel: "Opacity"
+        }
+      },
+      sv: {
+        colorLabel: "Färg",
+        overlay: {
+          title: "Överlägg",
+          colorLabel: "Färg",
+          opacityLabel: "Opacitet"
+        }
+      }
+    }
+  },
+  components: {
+    ThemeColorRow: l,
+    GradientPicker: $
+  },
+  mixins: [
+    d(
+      [
+        "type",
+        "video",
+        "resourceUrl",
+        "filter",
+        "blur",
+        "position",
+        "overlay",
+        "overlayColor",
+        "gradient",
+        "backgroundColor"
+      ],
+      { useEmit: !1 }
+    )
+  ],
+  data() {
+    return {
+      getUnsplashResized: u
+    };
+  },
+  methods: {
+    toggleOverlay(i) {
+      i && !this.overlayColor ? (this.overlayColor = "hsla(205, 100%, 50%, 0.5)", this.overlay = !0) : this.overlay = i;
+    },
+    setType(i) {
+      i === "color" && !this.backgroundColor ? this.backgroundColor = "hsl(134, 74%, 39%)" : i === "video" && !this.video ? this.video = {
+        provider: "pexels",
+        id: "3214448",
+        thumbnail: "https://images.pexels.com/videos/3214448/free-video-3214448.jpg?fit=crop&w=1200&h=630&auto=compress&cs=tinysrgb",
+        url: "https://player.vimeo.com/external/372567192.hd.mp4?s=c186273e04cc5015efecd863d8256eb99bc034fd&profile_id=172&oauth2_token_id=57447761"
+      } : i === "image" ? (this.resourceUrl || (this.resourceUrl = "https://images.unsplash.com/photo-1520013817300-1f4c1cb245ef?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1987&q=80"), this.position || (this.position = 50)) : i === "gradient" && !this.gradient && (this.gradient = {
+        type: "linear",
+        degree: 45,
+        colors: [
+          { color: "hsla(324.71,100%,50%,1)", percent: 0 },
+          { color: "hsla(209.41,85.18%,40.65%,1)", percent: 100 }
+        ]
+      }), this.type = i;
+    },
+    openResourceModal(i) {
+      this.$modal.show(
+        x[i],
+        {},
+        {},
+        {
+          input: (e) => {
+            i === "image" ? this.resourceUrl = e : i === "video" && (this.video = e);
+          }
+        }
+      );
+    }
+  }
+};
+var k = function() {
+  var e = this, t = e._self._c;
+  return t("div", { staticClass: "d-root" }, [t("div", { staticClass: "d-option", staticStyle: { "border-bottom": "none" } }, [t("div", { staticClass: "d-option-title" }, [e._v(" " + e._s(e.$t("_common:background").capitalize()) + " ")]), t("div", { staticClass: "flex w-full", staticStyle: { "flex-wrap": "wrap", "padding-top": "0.25em" } }, e._l([
+    { label: e.$t("_common:image"), value: "image" },
+    { label: e.$t("_common:color"), value: "color" },
+    { label: e.$t("_common:gradient"), value: "gradient" },
+    { label: e.$t("_common:video"), value: "video" }
+  ], function({ label: o, value: r }, a) {
+    return t("CButton", { key: o + a, staticStyle: { margin: "0 3px 3px 0", padding: "0 0.5em", height: "2em", "font-size": "15px", "border-radius": "4px" }, attrs: { type: e.type === r ? "secondary" : "none", pattern: e.type === r ? "primary" : "secondary", size: "normal" }, on: { click: function(n) {
+      return e.setType(r);
+    } } }, [e._v(" " + e._s(o.capitalize()) + " ")]);
+  }), 1)]), e.type === "image" ? [t("div", { staticClass: "d-option-button-image", style: { backgroundImage: `url(${e.resourceUrl})` }, on: { click: function(o) {
+    return e.openResourceModal(e.type);
+  } } }), e.resourceUrl ? t("div", { staticClass: "d-option" }, [t("div", { staticClass: "d-option-title" }, [e._v(" " + e._s(e.$t("_common:filter").capitalize()) + " ")]), t("div", { staticStyle: { display: "flex", "flex-direction": "row", "flex-wrap": "wrap", "padding-top": "0.25em" } }, e._l([
+    "",
+    "sepia(30%) brightness(110%) contrast(110%) grayscale(100%)",
+    "brightness(110%) contrast(90%) saturate(150%)",
+    "sepia(50%) contrast(140%)",
+    "sepia(25%) brightness(95%) contrast(95%) saturate(150%)",
+    "blur(0px) sepia(15%) saturate(130%) hue-rotate(-30deg)"
+  ], function(o, r) {
+    return t("div", { key: r, staticClass: "bg-filter", class: { "is-active": e.filter === o }, on: { click: function(a) {
+      e.filter = o;
+    } } }, [t("div", { staticClass: "bg-filter-preview", style: {
+      filter: o,
+      backgroundImage: `url(${e.getUnsplashResized(e.resourceUrl, {
+        w: 200
+      })})`
+    } })]);
+  }), 0)]) : e._e(), t("div", { staticClass: "d-option", staticStyle: { "padding-bottom": "0.5em" } }, [t("div", { staticClass: "d-option-title" }, [t("div", { staticStyle: { flex: "1 1 auto" } }, [e._v(" " + e._s(e.$t("_common:position").capitalize()) + " ")]), t("CSlider", { staticStyle: { width: "80px", margin: "0" }, attrs: { value: e.position || 0, type: "secondary", size: "small", rounded: "" }, on: { input: function(o) {
+    e.position = o;
+  } } })], 1)])] : e._e(), e.type === "video" ? [t("div", { staticClass: "d-option-button-image", style: { backgroundImage: `url(${e.video.thumbnail})` }, on: { click: function(o) {
+    return e.openResourceModal(e.type);
+  } } })] : e.type === "color" ? t("div", { staticClass: "d-option" }, [t("ThemeColorRow", { staticClass: "d-option-title", attrs: { value: e.backgroundColor || "" }, on: { change: function(o) {
+    e.backgroundColor = o;
+  } } }, [e._v(" " + e._s(e.$t("colorLabel")) + " ")])], 1) : e.type === "gradient" ? t("GradientPicker", { attrs: { value: e.gradient || {} }, on: { input: function(o) {
+    e.gradient = o;
+  } } }) : e._e(), ["image", "video"].includes(e.type) ? t("div", { staticClass: "d-option", staticStyle: { "padding-bottom": "0.5em" } }, [t("div", { staticClass: "d-option-title" }, [t("div", { staticStyle: { flex: "1 1 auto" } }, [e._v(" " + e._s(e.$t("_common:blur").capitalize()) + " ")]), t("CSlider", { staticStyle: { width: "80px", margin: "0" }, attrs: { value: e.blur || 0, max: 30, type: "secondary", size: "small", rounded: "" }, on: { input: function(o) {
+    e.blur = o;
+  } } })], 1)]) : e._e(), ["image", "video"].includes(e.type) ? t("div", { staticClass: "d-option" }, [t("div", { staticClass: "d-option-title" }, [t("div", { staticStyle: { flex: "1 1 auto" } }, [e._v(e._s(e.$t("overlay.title")))]), t("CSwitch", { staticStyle: { "margin-right": "0" }, attrs: { value: !!e.overlay, size: "small", type: "secondary" }, on: { input: e.toggleOverlay } })], 1), e.overlay ? t("div", { staticClass: "d-option-row", staticStyle: { "padding-top": "1em" } }, [t("ThemeColorRow", { attrs: { value: e.overlayColor || "", placement: "top-end" }, on: { change: function(o) {
+    e.overlayColor = o;
+  } } }, [e._v(" " + e._s(e.$t("overlay.colorLabel")) + " ")])], 1) : e._e()]) : e._e()], 2);
+}, R = [], D = /* @__PURE__ */ s(
+  S,
+  k,
+  R,
+  !1,
+  null,
+  "30a9943d"
+);
+const B = D.exports;
+export {
+  B as default
+};

package/dist/DocAnswer-9lbgqHRX.js

@@ -0,0 +1,36 @@
+import r from "./AnswerModal-Cu0Ke5pl.js";
+import { n as o } from "./main-B9t0ybqW.js";
+const t = {
+  components: {
+    AnswerModal: r
+  },
+  props: {
+    document: {
+      type: Object,
+      required: !0
+    },
+    answerType: {
+      type: String,
+      required: !0
+    },
+    closeFunc: {
+      type: Function,
+      default: null
+    }
+  }
+};
+var s = function() {
+  var e = this, n = e._self._c;
+  return n("AnswerModal", { attrs: { mode: e.answerType, _document: e.document }, on: { close: e.closeFunc } });
+}, c = [], a = /* @__PURE__ */ o(
+  t,
+  s,
+  c,
+  !1,
+  null,
+  null
+);
+const m = a.exports;
+export {
+  m as default
+};