@cling-se/widget 0.17.3 → 0.18.0

package/dist/CDropdownItem-CN7gSfgY.js

@@ -1,640 +0,0 @@
-import { V as f, l as m, n as p } from "./main-BL_yzf2r.js";
-class b {
-  constructor({ defaults: e = { width: 800, height: 600 }, delay: i = 50 } = {}) {
-    this._width = e.width, this._height = e.height, this._delay = i, this._timer = null, this._initialized = !1, this._handler = this._handleResize.bind(this);
-  }
-  _handleResize() {
-    clearTimeout(this._timer), this._timer = setTimeout(() => {
-      this.update();
-    }, this._delay);
-  }
-  get width() {
-    return this._width;
-  }
-  get height() {
-    return this._height;
-  }
-  get initialized() {
-    return this._initialized;
-  }
-  update() {
-    this._width = window.innerWidth, this._height = window.innerHeight;
-  }
-  setDelay(e) {
-    this._delay = e;
-  }
-  init() {
-    return typeof window > "u" ? this : this.initialized ? this : (this.update(), window.addEventListener("resize", this._handler, { passive: !0 }), this._initialized = !0, this);
-  }
-  destroy() {
-    return this.initialized ? (window.removeEventListener("resize", this._handler, { passive: !0 }), this._initialized = !1, this) : this;
-  }
-}
-const y = new b().init(), c = new f({ data: { windowSize: y } }), v = {
-  computed: {
-    windowWidth() {
-      return c.windowSize.width;
-    },
-    windowHeight() {
-      return c.windowSize.height;
-    },
-    mq() {
-      const { width: t } = c.windowSize, e = {
-        sm: 640,
-        md: 768,
-        lg: 1024,
-        xl: 1280,
-        "2xl": 1536,
-        "3xl": 1 / 0
-      };
-      let i = "lg";
-      return Object.keys(e).reverse().forEach((o) => {
-        t <= e[o] && (i = o);
-      }), i;
-    }
-  }
-};
-var u = { exports: {} };
-(function(t, e) {
-  Object.defineProperty(e, "__esModule", {
-    value: !0
-  }), e.default = i;
-  function i() {
-    return !!(typeof window < "u" && ("ontouchstart" in window || window.DocumentTouch && typeof document < "u" && document instanceof window.DocumentTouch)) || !!(typeof navigator < "u" && (navigator.maxTouchPoints || navigator.msMaxTouchPoints));
-  }
-  t.exports = e.default;
-})(u, u.exports);
-var g = u.exports;
-const w = /* @__PURE__ */ m(g), F = w();
-function j(t, e) {
-  return e.split(".").reduce((o, s) => o ? o[s] : null, t);
-}
-function _(t) {
-  typeof t.remove < "u" ? t.remove() : typeof t.parentNode < "u" && t.parentNode !== null && t.parentNode.removeChild(t);
-}
-function C(t) {
-  var n;
-  const e = (n = t.getRootNode) == null ? void 0 : n.call(t), o = (e == null ? void 0 : e.toString()) === "[object ShadowRoot]" ? e : document.body, s = document.createElement("div");
-  s.style.position = "absolute", s.style.left = "0px", s.style.top = "0px";
-  const a = document.createElement("div");
-  return s.appendChild(a), a.appendChild(t), o.appendChild(s), s;
-}
-function H(t, e, i) {
-  return Math.max(e, Math.min(i, t));
-}
-const d = (t, e = !1) => t ? e ? t.querySelectorAll('*[tabindex="-1"]') : t.querySelectorAll(`a[href]:not([tabindex="-1"]),
-                                   area[href],
-                                   input:not([disabled]),
-                                   select:not([disabled]),
-                                   textarea:not([disabled]),
-                                   button:not([disabled]),
-                                   iframe,
-                                   object,
-                                   embed,
-                                   *[tabindex]:not([tabindex="-1"]),
-                                   *[contenteditable]`) : null;
-let h;
-const x = (t, { value: e = !0 }) => {
-  if (e) {
-    let i = d(t), o = d(t, !0);
-    i && i.length > 0 && (h = (s) => {
-      i = d(t), o = d(t, !0);
-      const a = i[0], n = i[i.length - 1];
-      s.target === a && s.shiftKey && s.key === "Tab" ? (s.preventDefault(), n.focus()) : (s.target === n || Array.from(o).indexOf(s.target) >= 0) && !s.shiftKey && s.key === "Tab" && (s.preventDefault(), a.focus());
-    }, t.addEventListener("keydown", h));
-  }
-}, k = (t) => {
-  t.removeEventListener("keydown", h);
-}, $ = {
-  bind: x,
-  unbind: k
-}, S = ["escape", "outside"], A = {
-  name: "CDropdown",
-  directives: {
-    trapFocus: $
-  },
-  mixins: [v],
-  props: {
-    value: {
-      type: [String, Number, Boolean, Object, Array, Function],
-      default: null
-    },
-    disabled: {
-      type: Boolean,
-      default: !1
-    },
-    hoverable: {
-      type: Boolean,
-      default: !1
-    },
-    inline: {
-      type: Boolean,
-      default: !1
-    },
-    scrollable: {
-      type: Boolean,
-      default: !1
-    },
-    maxHeight: {
-      type: [String, Number],
-      default: 200
-    },
-    position: {
-      type: String,
-      default: "is-bottom-left",
-      validator(t) {
-        return [
-          "is-top-right",
-          "is-top-left",
-          "is-bottom-left",
-          "is-bottom-right"
-        ].indexOf(t) > -1;
-      }
-    },
-    mobileModal: {
-      type: Boolean,
-      default: () => !0
-      // config.defaultDropdownMobileModal,
-    },
-    ariaRole: {
-      type: String,
-      validator(t) {
-        return ["menu", "list", "dialog"].indexOf(t) > -1;
-      },
-      default: null
-    },
-    animation: {
-      type: String,
-      default: "fade-bounce"
-    },
-    multiple: {
-      type: Boolean,
-      default: !1
-    },
-    trapFocus: {
-      type: Boolean,
-      default: () => !1
-      // config.defaultTrapFocus,
-    },
-    closeOnClick: {
-      type: Boolean,
-      default: !0
-    },
-    canClose: {
-      type: [Array, Boolean],
-      default: !0
-    },
-    expanded: {
-      type: Boolean,
-      default: !1
-    },
-    appendToBody: {
-      type: Boolean,
-      default: !1
-    },
-    appendToBodyCopyParent: {
-      type: Boolean,
-      default: !1
-    },
-    menuStyling: {
-      type: Object,
-      default: () => ({})
-    },
-    mobileLabel: {
-      type: String,
-      default: ""
-    },
-    paddingless: {
-      type: Boolean,
-      default: !1
-    }
-  },
-  data() {
-    return {
-      selected: this.value,
-      style: {},
-      isActive: !1,
-      isHoverable: this.hoverable,
-      _isDropdown: !0,
-      // Used internally by DropdownItem
-      _bodyEl: void 0,
-      // Used to append to body
-      uniquePopoverClass: `dropdown-popover-${this._uid}`
-      // Used internally by DropdownItem
-    };
-  },
-  computed: {
-    rootClasses() {
-      return [
-        this.position,
-        {
-          "is-disabled": this.disabled,
-          "is-hoverable": this.hoverable,
-          "is-inline": this.inline,
-          "is-active": this.isActive || this.inline,
-          "is-mobile-modal": this.isMobileModal,
-          "is-expanded": this.expanded
-        }
-      ];
-    },
-    isMobileModal() {
-      return this.mobileModal && this.mq === "sm";
-    },
-    cancelOptions() {
-      return typeof this.canClose == "boolean" ? this.canClose ? S : [] : this.canClose;
-    },
-    contentStyle() {
-      return {
-        maxHeight: this.scrollable ? this.maxHeight === void 0 ? null : isNaN(this.maxHeight) ? this.maxHeight : `${this.maxHeight}px` : null,
-        overflow: this.scrollable ? "auto" : null,
-        padding: this.paddingless ? "0" : null
-      };
-    }
-  },
-  watch: {
-    /**
-     * When v-model is changed set the new selected item.
-     */
-    value(t) {
-      this.selected = t;
-    },
-    /**
-     * Emit event when isActive value is changed.
-     */
-    isActive(t) {
-      this.$emit("active-change", t), this.appendToBody && this.$nextTick(() => {
-        this.updateAppendToBody();
-      });
-    }
-  },
-  mounted() {
-    typeof window < "u" && (this.getRootElm().addEventListener("click", this.clickedOutside), document.addEventListener("keyup", this.keyPress)), this.appendToBody && (this.$data._bodyEl = C(this.$refs.dropdownMenu), this.$data._bodyEl.style.zIndex = Number(
-      window.getComputedStyle(this.$el).getPropertyValue("--app-z-index")
-    ) + 9999, this.isMobileModal && this.$data._bodyEl.appendChild(this.$refs.mobileBackground), this.updateAppendToBody());
-  },
-  beforeDestroy() {
-    typeof window < "u" && (this.getRootElm().removeEventListener("click", this.clickedOutside), document.removeEventListener("keyup", this.keyPress)), this.appendToBody && _(this.$data._bodyEl);
-  },
-  methods: {
-    /**
-     * Click listener from DropdownItem.
-     *   1. Set new selected item.
-     *   2. Emit input event to update the user v-model.
-     *   3. Close the dropdown.
-     */
-    selectItem(t, e) {
-      if (this.multiple) {
-        if (this.selected) {
-          const i = this.selected.indexOf(t);
-          i === -1 ? this.selected.push(t) : this.selected.splice(i, 1);
-        } else
-          this.selected = [t];
-        this.$emit("change", this.selected);
-      } else
-        this.selected !== t && (this.selected = t, this.$emit("change", this.selected));
-      this.$emit("input", this.selected), this.multiple || (this.isActive = e.closeOnClick ? !this.closeOnClick : !0, this.hoverable && this.closeOnClick && (this.isHoverable = !1));
-    },
-    /**
-     * White-listed items to not close when clicked.
-     */
-    isInWhiteList(t) {
-      if (t === this.$refs.dropdownMenu || t === this.$refs.trigger)
-        return !0;
-      if (this.$refs.dropdownMenu !== void 0) {
-        const e = this.$refs.dropdownMenu.querySelectorAll("*");
-        for (const i of e)
-          if (t === i)
-            return !0;
-      }
-      if (this.$refs.trigger !== void 0) {
-        const e = this.$refs.trigger.querySelectorAll("*");
-        for (const i of e)
-          if (t === i)
-            return !0;
-      }
-      return !1;
-    },
-    /**
-     * Close dropdown if clicked outside.
-     */
-    clickedOutside(t) {
-      var i;
-      if (this.cancelOptions.indexOf("outside") < 0 || this.inline)
-        return;
-      const e = ((i = t.path) == null ? void 0 : i[0]) || t.target;
-      this.isInWhiteList(e) || (this.isActive = !1);
-    },
-    /**
-     * Keypress event that is bound to the document
-     */
-    keyPress(t) {
-      if (this.isActive && t.keyCode === 27) {
-        if (this.cancelOptions.indexOf("escape") < 0)
-          return;
-        this.isActive = !1;
-      }
-    },
-    /**
-     * Toggle dropdown if it's not disabled.
-     */
-    toggle() {
-      this.disabled || (this.isActive ? this.isActive = !this.isActive : this.$nextTick(() => {
-        const t = !this.isActive;
-        this.isActive = t, setTimeout(() => this.isActive = t);
-      }));
-    },
-    checkHoverable() {
-      this.hoverable && (this.isHoverable = !0);
-    },
-    updateAppendToBody() {
-      const t = this.$refs.dropdownMenu, e = this.$refs.trigger;
-      if (t && e) {
-        const i = this.$data._bodyEl.children[0];
-        if (i.classList.forEach((n) => i.classList.remove(n)), i.classList.add("dropdown"), i.classList.add("dropdown-menu-animation"), this.$vnode && this.$vnode.data && this.$vnode.data.staticClass && i.classList.add(this.$vnode.data.staticClass), this.rootClasses.forEach((n) => {
-          if (n && typeof n == "object")
-            for (const l in n)
-              n[l] && i.classList.add(l);
-        }), this.appendToBodyCopyParent) {
-          const n = this.$refs.dropdown.parentNode, l = this.$data._bodyEl;
-          l.classList.forEach((r) => l.classList.remove(r)), n.classList.forEach((r) => {
-            l.classList.add(r);
-          });
-        }
-        const o = e.getBoundingClientRect();
-        let s = o.top + window.scrollY, a = o.left + window.scrollX;
-        !this.position || this.position.indexOf("bottom") >= 0 ? s += e.clientHeight : s -= t.clientHeight, this.position && this.position.indexOf("left") >= 0 && (a -= t.clientWidth - e.clientWidth), this.style = {
-          position: "absolute",
-          top: `${s}px`,
-          left: `${a}px`,
-          zIndex: "1001"
-        };
-      }
-    },
-    getRootElm() {
-      var i, o;
-      const t = (o = (i = this.$el).getRootNode) == null ? void 0 : o.call(i);
-      return (t == null ? void 0 : t.toString()) === "[object ShadowRoot]" ? t : document;
-    }
-  }
-};
-var B = function() {
-  var e = this, i = e._self._c;
-  return i("div", { ref: "dropdown", staticClass: "dropdown dropdown-menu-animation", class: e.rootClasses }, [e.inline ? e._e() : i("div", { ref: "trigger", staticClass: "dropdown-trigger", attrs: { role: "button", "aria-haspopup": "true" }, on: { click: e.toggle, mouseenter: e.checkHoverable } }, [e._t("trigger", null, { active: e.isActive })], 2), i("transition", { attrs: { name: "fade-in" } }, [e.isMobileModal ? i("div", { directives: [{ name: "show", rawName: "v-show", value: e.isActive, expression: "isActive" }], ref: "mobileBackground", staticClass: "fixed inset-0 z-40 bg-black/40", attrs: { "aria-hidden": !e.isActive } }) : e._e()]), i("transition", { attrs: { name: e.isMobileModal ? "slide-in-bottom" : e.animation } }, [i("div", { directives: [{ name: "show", rawName: "v-show", value: !e.disabled && (e.isActive || e.isHoverable) || e.inline, expression: "(!disabled && (isActive || isHoverable)) || inline" }, { name: "trap-focus", rawName: "v-trap-focus", value: e.trapFocus, expression: "trapFocus" }], ref: "dropdownMenu", staticClass: "dropdown-menu", style: {
-    ...e.style,
-    ...e.menuStyling
-  }, attrs: { "aria-hidden": !e.isActive } }, [e.isActive ? [e._t("header"), i("div", { staticClass: "dropdown-content", class: `${e.uniquePopoverClass}`, style: e.contentStyle, attrs: { role: e.ariaRole } }, [e.isMobileModal && e.mobileLabel ? e._t("mobileLabel", function() {
-    return [i("div", { staticClass: "dropdown-content-label" }, [e._v(e._s(e.mobileLabel))])];
-  }) : e._e(), e._t("default")], 2), e._t("footer")] : e._e()], 2)])], 1);
-}, O = [], L = /* @__PURE__ */ p(
-  A,
-  B,
-  O,
-  !1,
-  null,
-  null
-);
-const q = L.exports, E = {
-  name: "CSwitch",
-  props: {
-    value: {
-      type: [String, Number, Boolean, Function, Object, Array, Date],
-      default: null
-    },
-    nativeValue: {
-      type: [String, Number, Boolean, Function, Object, Array, Date],
-      default: null
-    },
-    disabled: Boolean,
-    type: {
-      type: String,
-      default: ""
-    },
-    name: {
-      type: String,
-      default: ""
-    },
-    required: Boolean,
-    size: {
-      type: String,
-      default: ""
-    },
-    trueValue: {
-      type: [String, Number, Boolean, Function, Object, Array, Date],
-      default: !0
-    },
-    falseValue: {
-      type: [String, Number, Boolean, Function, Object, Array, Date],
-      default: !1
-    },
-    rounded: {
-      type: Boolean,
-      default: !0
-    }
-  },
-  data() {
-    return {
-      newValue: this.value
-    };
-  },
-  computed: {
-    computedValue: {
-      get() {
-        return this.newValue;
-      },
-      set(t) {
-        this.newValue = t, this.$emit("input", t);
-      }
-    },
-    newClass() {
-      return [
-        `is-${this.size}`,
-        {
-          "is-disabled": this.disabled,
-          "is-rounded": this.rounded
-        }
-      ];
-    }
-  },
-  watch: {
-    /**
-     * When v-model change, set internal value.
-     */
-    value(t) {
-      this.newValue = t;
-    }
-  },
-  methods: {
-    focus() {
-      this.$refs.input.focus();
-    }
-  }
-};
-var I = function() {
-  var e = this, i = e._self._c;
-  return i("label", { ref: "label", staticClass: "switch", class: e.newClass, attrs: { disabled: e.disabled }, on: { click: e.focus, keydown: function(o) {
-    return !o.type.indexOf("key") && e._k(o.keyCode, "enter", 13, o.key, "Enter") ? null : (o.preventDefault(), e.$refs.label.click());
-  } } }, [i("input", { directives: [{ name: "model", rawName: "v-model", value: e.computedValue, expression: "computedValue" }], ref: "input", attrs: { disabled: e.disabled, name: e.name, required: e.required, "true-value": e.trueValue, "false-value": e.falseValue, type: "checkbox" }, domProps: { value: e.nativeValue, checked: Array.isArray(e.computedValue) ? e._i(e.computedValue, e.nativeValue) > -1 : e._q(e.computedValue, e.trueValue) }, on: { click: function(o) {
-    o.stopPropagation();
-  }, change: function(o) {
-    var s = e.computedValue, a = o.target, n = a.checked ? e.trueValue : e.falseValue;
-    if (Array.isArray(s)) {
-      var l = e.nativeValue, r = e._i(s, l);
-      a.checked ? r < 0 && (e.computedValue = s.concat([l])) : r > -1 && (e.computedValue = s.slice(0, r).concat(s.slice(r + 1)));
-    } else
-      e.computedValue = n;
-  } } }), i("span", { staticClass: "check", class: [`is-${e.type}`] }), i("span", { staticClass: "control-label" }, [e._t("default")], 2)]);
-}, z = [], V = /* @__PURE__ */ p(
-  E,
-  I,
-  z,
-  !1,
-  null,
-  "4cdd239d"
-);
-const P = V.exports, R = {
-  name: "CDropdownItem",
-  components: {
-    CSwitch: P
-  },
-  props: {
-    value: {
-      type: [String, Number, Boolean, Object, Array, Function],
-      default: null
-    },
-    separator: Boolean,
-    disabled: Boolean,
-    custom: Boolean,
-    focusable: {
-      type: Boolean,
-      default: !0
-    },
-    paddingless: Boolean,
-    hasLink: Boolean,
-    ariaRole: {
-      type: String,
-      default: ""
-    },
-    type: {
-      type: String,
-      default: null
-    },
-    toggle: {
-      type: Boolean,
-      default: !1
-    },
-    title: {
-      type: String,
-      default: ""
-    },
-    tooltip: {
-      type: [Object, String],
-      default: null
-    },
-    closeOnClick: {
-      type: Boolean,
-      default: !0
-    },
-    iconLeft: {
-      type: String,
-      default: null
-    },
-    iconRight: {
-      type: String,
-      default: null
-    },
-    iconProps: {
-      type: Object,
-      default: () => ({})
-    },
-    to: {
-      type: Object,
-      default: null
-    },
-    // Allows for parent communication on arbitrary depth
-    customParent: {
-      type: Object,
-      default: null
-    }
-  },
-  computed: {
-    parent() {
-      return this.customParent || this.$parent;
-    },
-    anchorClasses() {
-      return {
-        "is-disabled": this.parent.disabled || this.disabled,
-        "is-paddingless": this.paddingless,
-        "is-active": this.isActive,
-        "has-toggle": this.toggle
-      };
-    },
-    itemClasses() {
-      return {
-        "dropdown-item": !this.hasLink,
-        "is-disabled": this.disabled,
-        "is-paddingless": this.paddingless,
-        "is-active": this.isActive,
-        "has-link": this.hasLink
-      };
-    },
-    ariaRoleItem() {
-      return this.ariaRole === "menuitem" || this.ariaRole === "listitem" ? this.ariaRole : null;
-    },
-    isClickable() {
-      return !this.parent.disabled && !this.separator && !this.disabled && !this.custom;
-    },
-    isActive() {
-      return this.toggle || this.parent.selected === null ? !1 : this.parent.multiple ? this.parent.selected.indexOf(this.value) >= 0 : this.value === this.parent.selected;
-    },
-    isFocusable() {
-      return this.hasLink ? !1 : this.focusable;
-    },
-    tooltipItem() {
-      if (!this.tooltip)
-        return null;
-      const t = typeof this.tooltip == "string" ? { content: this.tooltip } : this.tooltip;
-      return {
-        boundariesElement: `.${this.parent.uniquePopoverClass}`,
-        classes: "dropdown-tooltip-class",
-        offset: 7,
-        placement: "left",
-        ...t
-      };
-    }
-  },
-  created() {
-    if (!this.parent.$data._isDropdown)
-      throw this.$destroy(), new Error("You should wrap cDropdownItem on a cDropdown");
-  },
-  methods: {
-    /**
-     * Click listener, select the item.
-     */
-    selectItem() {
-      this.isClickable && (this.parent.selectItem(this.value, { closeOnClick: this.closeOnClick }), this.$emit("click"), typeof this.value == "boolean" && this.$emit("input", !this.value));
-    }
-  }
-};
-var T = function() {
-  var e = this, i = e._self._c;
-  return e.separator ? i("hr", { staticClass: "dropdown-divider" }) : !e.custom && !e.hasLink ? i(e.to && !e.disabled ? "router-link" : "a", { directives: [{ name: "tooltip", rawName: "v-tooltip", value: e.tooltipItem, expression: "tooltipItem" }], tag: "component", staticClass: "dropdown-item truncate-text", class: [e.anchorClasses, `is-${e.type}`], attrs: { to: e.to, role: e.ariaRoleItem, tabindex: e.isFocusable ? 0 : null }, on: { click: e.selectItem } }, [e.iconLeft ? i("CIcon", e._b({ staticClass: "icon dropdown-item-icon", attrs: { type: e.iconLeft } }, "CIcon", { size: 18, ...e.iconProps }, !1)) : e._e(), e._t("default"), e.toggle ? i("CSwitch", { directives: [{ name: "tooltip", rawName: "v-tooltip", value: e.tooltipItem, expression: "tooltipItem" }], staticStyle: { display: "inline-flex", "pointer-events": "none", position: "absolute", right: "0", top: "50%", transform: "translateY(-50%)", "margin-right": "0" }, attrs: { value: e.value, size: "tiny", type: "success" } }) : e._e(), e.iconRight ? i("CIcon", e._b({ staticClass: "icon dropdown-item-icon is-right", attrs: { type: e.iconRight || "chevron-up-down" } }, "CIcon", { size: 18, ...e.iconProps }, !1)) : e._e()], 2) : i("div", { staticClass: "truncate-text", class: [e.itemClasses, `is-${e.type}`], attrs: { role: e.ariaRoleItem, tabindex: e.isFocusable ? 0 : null }, on: { click: e.selectItem } }, [e.iconLeft ? i("CIcon", e._b({ staticClass: "icon dropdown-item-icon", attrs: { type: e.iconLeft } }, "CIcon", { size: 18, ...e.iconProps }, !1)) : e._e(), e._t("default"), e.iconRight ? i("CIcon", e._b({ staticClass: "icon dropdown-item-icon is-right", attrs: { type: e.iconRight } }, "CIcon", { size: 18, ...e.iconProps }, !1)) : e._e()], 2);
-}, D = [], M = /* @__PURE__ */ p(
-  R,
-  T,
-  D,
-  !1,
-  null,
-  null
-);
-const W = M.exports;
-export {
-  q as C,
-  W as a,
-  P as b,
-  C as c,
-  H as d,
-  j as g,
-  F as i,
-  _ as r,
-  v as w
-};