@rhino-design/vue 0.2.2 → 0.2.6

package/dist/components/XListItemMeta.vue2.js

@@ -0,0 +1,4 @@
+import f from "./XListItemMeta.vue.js";
+export {
+  f as default
+};

package/dist/components/XMention.vue.js

@@ -0,0 +1,456 @@
+import { defineComponent as ke, useAttrs as Ve, computed as d, ref as f, watch as x, nextTick as G, onMounted as Se, onBeforeUnmount as Me, openBlock as r, createElementBlock as c, mergeProps as K, Fragment as m, createVNode as N, unref as oe, normalizeStyle as $e, createTextVNode as P, toDisplayString as w, withCtx as I, createElementVNode as k, renderList as C, createCommentVNode as U, withModifiers as re, normalizeClass as ie, renderSlot as ue, createBlock as Ee } from "vue";
+import Ie from "./XInput.vue.js";
+import Ce from "./XTextarea.vue.js";
+import se from "./XTrigger.vue.js";
+const Be = { "data-trigger-anchor": "true" }, Te = { class: "x-select__panel" }, Ae = {
+  key: 0,
+  class: "x-select__group-title"
+}, Re = ["onMouseenter", "onMousedown"], Le = { class: "x-select__panel" }, Oe = {
+  key: 0,
+  class: "x-select__group-title"
+}, ze = ["onMouseenter", "onMousedown"], Ne = /* @__PURE__ */ ke({
+  inheritAttrs: !1,
+  __name: "XMention",
+  props: {
+    modelValue: {},
+    defaultValue: { default: "" },
+    data: { default: () => [] },
+    prefix: { default: "@" },
+    split: { default: " " },
+    type: { default: "input" },
+    disabled: { type: Boolean, default: !1 },
+    allowClear: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue", "change", "search", "select", "clear", "focus", "blur"],
+  setup(B, { expose: ce, emit: fe }) {
+    const de = [
+      "border-width",
+      "box-sizing",
+      "font-family",
+      "font-weight",
+      "font-size",
+      "font-variant",
+      "letter-spacing",
+      "line-height",
+      "padding-top",
+      "padding-bottom",
+      "padding-left",
+      "padding-right",
+      "text-indent",
+      "text-rendering",
+      "text-transform",
+      "white-space",
+      "overflow-wrap",
+      "width"
+    ], i = B, p = fe, y = Ve(), pe = d(() => {
+      const e = {};
+      return y.theme !== void 0 && (e.theme = y.theme), y["data-theme"] !== void 0 && (e["data-theme"] = y["data-theme"]), e;
+    }), T = f(null), V = f(null), A = f({}), W = f(null), R = f(null), j = f(), L = f(i.defaultValue), v = f(!1), u = f(""), s = f({
+      measuring: !1,
+      location: -1,
+      prefix: "",
+      text: ""
+    }), S = d(() => i.modelValue ?? L.value), M = d(() => !!i.disabled), g = d(() => i.type === "textarea"), ve = d(() => [].concat(i.prefix ?? "@"));
+    x(
+      () => i.modelValue,
+      (e) => {
+        e == null && (L.value = "");
+      }
+    );
+    function O(e) {
+      return e == null ? "" : String(e);
+    }
+    function be(e) {
+      const t = O(e.value);
+      return e.label !== void 0 ? String(e.label) : t;
+    }
+    function me(e) {
+      return typeof e == "object" && e !== null && (e.isGroup === !0 || Array.isArray(e.options));
+    }
+    function q(e, t) {
+      if (typeof e != "object" || e === null)
+        return {
+          key: t,
+          value: e,
+          label: String(e),
+          disabled: !1,
+          raw: {
+            value: e,
+            label: String(e),
+            disabled: !1
+          }
+        };
+      const l = e.value ?? e.label;
+      if (l == null)
+        return null;
+      const o = {
+        ...e,
+        value: l,
+        label: be(e),
+        disabled: !!e.disabled
+      };
+      return {
+        key: t,
+        value: l,
+        label: o.label ?? O(l),
+        disabled: !!o.disabled,
+        raw: o
+      };
+    }
+    const X = d(() => {
+      let e = 0;
+      const t = [];
+      return i.data.forEach((l) => {
+        if (me(l)) {
+          const a = (Array.isArray(l.options) ? l.options : []).map((_) => q(_, `mention-option-${e += 1}`)).filter((_) => _ !== null);
+          a.length > 0 && t.push({
+            label: l.label === void 0 ? void 0 : String(l.label),
+            options: a
+          });
+          return;
+        }
+        const o = q(l, `mention-option-${e += 1}`);
+        o && t.push({ options: [o] });
+      }), t;
+    }), z = d(() => {
+      const e = s.value.text.trim().toLowerCase();
+      return e ? X.value.map((t) => ({
+        label: t.label,
+        options: t.options.filter((l) => l.label.toLowerCase().includes(e))
+      })).filter((t) => t.options.length > 0) : X.value;
+    }), h = d(() => z.value.flatMap((e) => e.options)), b = d(
+      () => v.value && s.value.measuring && h.value.length > 0
+    );
+    function ye(e) {
+      const { value: t, selectionStart: l } = e;
+      return t.slice(0, l ?? t.length);
+    }
+    function he(e, t) {
+      return [].concat(t).reduce(
+        (o, n) => {
+          const a = e.lastIndexOf(n);
+          return a > o.location ? {
+            location: a,
+            prefix: n
+          } : o;
+        },
+        {
+          location: -1,
+          prefix: ""
+        }
+      );
+    }
+    function xe(e, t) {
+      return !t || !e.includes(t);
+    }
+    function $() {
+      s.value = {
+        measuring: !1,
+        location: -1,
+        prefix: "",
+        text: ""
+      };
+    }
+    function D(e) {
+      L.value = e, p("update:modelValue", e), p("change", e);
+    }
+    function Y(e, t) {
+      const l = t.target, o = ye(l), n = he(o, i.prefix);
+      if (n.location > -1) {
+        const a = o.slice(n.location + n.prefix.length);
+        xe(a, i.split) ? (v.value = !0, s.value = {
+          measuring: !0,
+          location: n.location,
+          prefix: n.prefix,
+          text: a
+        }, p("search", a, n.prefix)) : s.value.location > -1 && $();
+      } else s.value.location > -1 && $();
+      D(e);
+    }
+    function H(e) {
+      v.value = !1, $(), D(""), p("clear", e);
+    }
+    function Z(e, t) {
+      if (!t) {
+        delete A.value[e];
+        return;
+      }
+      const l = t instanceof HTMLElement ? t : t.$el;
+      l && (A.value[e] = l);
+    }
+    function J() {
+      if (!b.value) {
+        u.value = "";
+        return;
+      }
+      const e = h.value.filter((t) => !t.disabled);
+      if (e.length === 0) {
+        u.value = "";
+        return;
+      }
+      e.some((t) => t.key === u.value) || (u.value = e[0].key);
+    }
+    x(b, () => {
+      J();
+    }), x(h, () => {
+      J();
+    }), x(
+      () => u.value,
+      (e) => {
+        !b.value || !e || G(() => {
+          const t = A.value[e];
+          !t || typeof t.scrollIntoView != "function" || t.scrollIntoView({ block: "nearest" });
+        });
+      }
+    );
+    function Q(e) {
+      const t = h.value.filter((n) => !n.disabled);
+      if (t.length === 0)
+        return;
+      const l = t.findIndex((n) => n.key === u.value);
+      if (l === -1) {
+        u.value = t[e > 0 ? 0 : t.length - 1].key;
+        return;
+      }
+      const o = (l + e + t.length) % t.length;
+      u.value = t[o].key;
+    }
+    function F(e) {
+      if (e.disabled)
+        return;
+      const t = S.value, l = s.value.location, o = s.value.location + s.value.text.length;
+      let n = t.slice(0, l), a = t.slice(o + 1);
+      n += !n || n.endsWith(i.split) || n.endsWith(`
+`) ? "" : i.split, a = (!a || a.startsWith(i.split) || a.startsWith(`
+`) ? "" : i.split) + a;
+      const _ = `${n}${s.value.prefix}${O(e.value)}${a}`;
+      v.value = !1, $(), p("select", e.value), D(_);
+    }
+    function ee(e) {
+      v.value = e;
+    }
+    function te(e) {
+      if (b.value && !e.defaultPrevented) {
+        if (e.key === "ArrowDown") {
+          e.preventDefault(), Q(1);
+          return;
+        }
+        if (e.key === "ArrowUp") {
+          e.preventDefault(), Q(-1);
+          return;
+        }
+        if (e.key === "Enter") {
+          const t = h.value.find((l) => l.key === u.value);
+          t && (e.preventDefault(), F(t));
+          return;
+        }
+        e.key === "Escape" && (e.preventDefault(), v.value = !1);
+      }
+    }
+    function le(e) {
+      p("focus", e);
+    }
+    function ne(e) {
+      v.value = !1, p("blur", e);
+    }
+    function we(e) {
+      const t = {};
+      return de.forEach((l) => {
+        t[l] = e.getPropertyValue(l);
+      }), t;
+    }
+    function ae() {
+      var t;
+      const e = (t = V.value) == null ? void 0 : t.$el;
+      return (e == null ? void 0 : e.querySelector("textarea")) ?? null;
+    }
+    function E() {
+      if (!g.value || typeof window > "u")
+        return;
+      const e = ae();
+      if (!e)
+        return;
+      const t = window.getComputedStyle(e);
+      j.value = we(t);
+    }
+    x(g, () => {
+      G(() => {
+        E();
+      });
+    }, { immediate: !0 }), x(b, (e) => {
+      e && G(() => {
+        const t = ae();
+        !t || !R.value || t.scrollTop > 0 && R.value.scrollTo(0, t.scrollTop);
+      });
+    }), Se(() => {
+      E(), !(typeof window > "u") && window.addEventListener("resize", E);
+    }), Me(() => {
+      typeof window > "u" || window.removeEventListener("resize", E);
+    });
+    function ge() {
+      var e, t;
+      if (g.value) {
+        (e = V.value) == null || e.focus();
+        return;
+      }
+      (t = T.value) == null || t.focus();
+    }
+    function _e() {
+      var e, t;
+      if (g.value) {
+        (e = V.value) == null || e.blur();
+        return;
+      }
+      (t = T.value) == null || t.blur();
+    }
+    return ce({
+      focus: ge,
+      blur: _e
+    }), (e, t) => (r(), c("div", K({ class: "x-mention" }, pe.value), [
+      g.value ? (r(), c(m, { key: 0 }, [
+        N(Ce, K({
+          ref_key: "textareaRef",
+          ref: V
+        }, oe(y), {
+          "model-value": S.value,
+          disabled: M.value,
+          "allow-clear": B.allowClear,
+          onInput: Y,
+          onClear: H,
+          onFocus: le,
+          onBlur: ne,
+          onKeydown: te
+        }), null, 16, ["model-value", "disabled", "allow-clear"]),
+        s.value.measuring && h.value.length > 0 ? (r(), c("div", {
+          key: 0,
+          ref_key: "mirrorRef",
+          ref: R,
+          class: "x-mention-measure",
+          style: $e(j.value)
+        }, [
+          P(w(S.value.slice(0, s.value.location)) + " ", 1),
+          N(se, {
+            trigger: "focus",
+            position: "bottom-start",
+            "popup-offset": 4,
+            "prevent-focus": !0,
+            "popup-visible": b.value,
+            "click-to-close": !1,
+            disabled: M.value,
+            "onUpdate:popupVisible": ee
+          }, {
+            content: I(() => [
+              k("div", Te, [
+                k("div", {
+                  ref_key: "dropdownRef",
+                  ref: W,
+                  class: "x-select__dropdown"
+                }, [
+                  (r(!0), c(m, null, C(z.value, (l) => {
+                    var o;
+                    return r(), c(m, {
+                      key: l.label ?? ((o = l.options[0]) == null ? void 0 : o.key)
+                    }, [
+                      l.label ? (r(), c("div", Ae, w(l.label), 1)) : U("", !0),
+                      (r(!0), c(m, null, C(l.options, (n) => (r(), c("button", {
+                        key: n.key,
+                        ref_for: !0,
+                        ref: (a) => Z(n.key, a),
+                        type: "button",
+                        class: ie(["x-select__option", {
+                          "is-active": u.value === n.key,
+                          "is-disabled": n.disabled
+                        }]),
+                        onMouseenter: (a) => u.value = n.key,
+                        onMousedown: re((a) => F(n), ["prevent"])
+                      }, [
+                        ue(e.$slots, "option", {
+                          data: n.raw
+                        }, () => [
+                          P(w(n.label), 1)
+                        ])
+                      ], 42, Re))), 128))
+                    ], 64);
+                  }), 128))
+                ], 512)
+              ])
+            ]),
+            default: I(() => [
+              k("span", Be, w(s.value.prefix || ve.value[0]), 1)
+            ]),
+            _: 3
+          }, 8, ["popup-visible", "disabled"])
+        ], 4)) : U("", !0)
+      ], 64)) : (r(), Ee(se, {
+        key: 1,
+        trigger: "focus",
+        position: "bottom-start",
+        "animation-name": "slide-dynamic-origin",
+        "popup-offset": 4,
+        "prevent-focus": !0,
+        "popup-visible": b.value,
+        "click-to-close": !1,
+        "auto-fit-popup-width": !0,
+        "auto-fit-transform-origin": !0,
+        disabled: M.value,
+        "onUpdate:popupVisible": ee
+      }, {
+        content: I(() => [
+          k("div", Le, [
+            k("div", {
+              ref_key: "dropdownRef",
+              ref: W,
+              class: "x-select__dropdown"
+            }, [
+              (r(!0), c(m, null, C(z.value, (l) => {
+                var o;
+                return r(), c(m, {
+                  key: l.label ?? ((o = l.options[0]) == null ? void 0 : o.key)
+                }, [
+                  l.label ? (r(), c("div", Oe, w(l.label), 1)) : U("", !0),
+                  (r(!0), c(m, null, C(l.options, (n) => (r(), c("button", {
+                    key: n.key,
+                    ref_for: !0,
+                    ref: (a) => Z(n.key, a),
+                    type: "button",
+                    class: ie(["x-select__option", {
+                      "is-active": u.value === n.key,
+                      "is-disabled": n.disabled
+                    }]),
+                    onMouseenter: (a) => u.value = n.key,
+                    onMousedown: re((a) => F(n), ["prevent"])
+                  }, [
+                    ue(e.$slots, "option", {
+                      data: n.raw
+                    }, () => [
+                      P(w(n.label), 1)
+                    ])
+                  ], 42, ze))), 128))
+                ], 64);
+              }), 128))
+            ], 512)
+          ])
+        ]),
+        default: I(() => [
+          N(Ie, K({
+            ref_key: "inputRef",
+            ref: T
+          }, oe(y), {
+            "model-value": S.value,
+            disabled: M.value,
+            "allow-clear": B.allowClear,
+            onInput: Y,
+            onClear: H,
+            onFocus: le,
+            onBlur: ne,
+            onKeydown: te
+          }), null, 16, ["model-value", "disabled", "allow-clear"])
+        ]),
+        _: 3
+      }, 8, ["popup-visible", "disabled"]))
+    ], 16));
+  }
+});
+export {
+  Ne as default
+};

package/dist/components/XMention.vue2.js

@@ -0,0 +1,4 @@
+import f from "./XMention.vue.js";
+export {
+  f as default
+};

package/dist/components/XMentions.vue.js

@@ -0,0 +1,16 @@
+import { defineComponent as t, openBlock as o, createBlock as r, normalizeProps as n, guardReactiveProps as a, withCtx as s, renderSlot as p } from "vue";
+import i from "./XMention.vue.js";
+const l = /* @__PURE__ */ t({
+  __name: "XMentions",
+  setup(m) {
+    return (e, _) => (o(), r(i, n(a(e.$attrs)), {
+      default: s(() => [
+        p(e.$slots, "default")
+      ]),
+      _: 3
+    }, 16));
+  }
+});
+export {
+  l as default
+};

package/dist/components/XMentions.vue2.js

@@ -0,0 +1,4 @@
+import f from "./XMentions.vue.js";
+export {
+  f as default
+};

package/dist/components/XMenu.vue.js

@@ -0,0 +1,57 @@
+import r from "./XMenu.vue2.js";
+import { SiderInjectionKey as b } from "./XMenu.vue2.js";
+import { resolveComponent as s, openBlock as n, createBlock as p, mergeProps as i, createSlots as u, withCtx as o, renderSlot as l } from "vue";
+import c from "../_virtual/_plugin-vue_export-helper.js";
+function f(e, m, k, h, y, C) {
+  const t = s("XMenuOverflowWrap"), a = s("XBaseMenu");
+  return n(), p(a, i(e.$attrs, {
+    theme: e.computedTheme,
+    mode: e.mode,
+    "level-indent": e.levelIndent,
+    "auto-open": e.autoOpen,
+    collapsed: e.collapsed,
+    "default-collapsed": e.defaultCollapsed,
+    "collapsed-width": e.collapsedWidth,
+    accordion: e.accordion,
+    "auto-scroll-into-view": e.autoScrollIntoView,
+    "show-collapse-button": e.showCollapseButton,
+    "selected-keys": e.selectedKeys,
+    "default-selected-keys": e.defaultSelectedKeys,
+    "open-keys": e.openKeys,
+    "default-open-keys": e.defaultOpenKeys,
+    "scroll-config": e.scrollConfig,
+    "trigger-props": e.triggerProps,
+    "tooltip-props": e.tooltipProps,
+    "auto-open-selected": e.autoOpenSelected,
+    breakpoint: e.breakpoint,
+    "popup-max-height": e.popupMaxHeight,
+    "sider-collapsed": e.siderCollapsed,
+    "is-root": "",
+    onCollapse: e.handleCollapse,
+    onMenuItemClick: e.handleMenuItemClick,
+    onSubMenuClick: e.handleSubMenuClick
+  }), u({
+    default: o(() => [
+      e.mode === "horizontal" ? (n(), p(t, { key: 0 }, {
+        default: o(() => [
+          l(e.$slots, "default")
+        ]),
+        _: 3
+      })) : l(e.$slots, "default", { key: 1 })
+    ]),
+    _: 2
+  }, [
+    e.$slots["collapse-icon"] ? {
+      name: "collapse-icon",
+      fn: o(({ collapsed: d }) => [
+        l(e.$slots, "collapse-icon", { collapsed: d })
+      ]),
+      key: "0"
+    } : void 0
+  ]), 1040, ["theme", "mode", "level-indent", "auto-open", "collapsed", "default-collapsed", "collapsed-width", "accordion", "auto-scroll-into-view", "show-collapse-button", "selected-keys", "default-selected-keys", "open-keys", "default-open-keys", "scroll-config", "trigger-props", "tooltip-props", "auto-open-selected", "breakpoint", "popup-max-height", "sider-collapsed", "onCollapse", "onMenuItemClick", "onSubMenuClick"]);
+}
+const v = /* @__PURE__ */ c(r, [["render", f]]);
+export {
+  b as SiderInjectionKey,
+  v as default
+};

package/dist/components/XMenu.vue2.js

@@ -0,0 +1,123 @@
+import { defineComponent as r, inject as s, computed as p, ref as i, onMounted as m, onBeforeUnmount as y } from "vue";
+import f from "./XBaseMenu.vue.js";
+import b from "./XMenuOverflowWrap.vue.js";
+const h = Symbol("XSiderContext"), O = r({
+  name: "XMenu",
+  components: {
+    XBaseMenu: f,
+    XMenuOverflowWrap: b
+  },
+  inheritAttrs: !1,
+  props: {
+    theme: {
+      type: String
+    },
+    mode: {
+      type: String,
+      default: "vertical"
+    },
+    levelIndent: {
+      type: Number
+    },
+    autoOpen: {
+      type: Boolean
+    },
+    collapsed: {
+      type: Boolean,
+      default: void 0
+    },
+    defaultCollapsed: {
+      type: Boolean
+    },
+    collapsedWidth: {
+      type: Number
+    },
+    accordion: {
+      type: Boolean
+    },
+    autoScrollIntoView: {
+      type: Boolean
+    },
+    showCollapseButton: {
+      type: Boolean
+    },
+    selectedKeys: {
+      type: Array
+    },
+    defaultSelectedKeys: {
+      type: Array,
+      default: () => []
+    },
+    openKeys: {
+      type: Array
+    },
+    defaultOpenKeys: {
+      type: Array,
+      default: () => []
+    },
+    scrollConfig: {
+      type: Object
+    },
+    triggerProps: {
+      type: Object
+    },
+    tooltipProps: {
+      type: Object
+    },
+    autoOpenSelected: {
+      type: Boolean
+    },
+    breakpoint: {
+      type: String
+    },
+    popupMaxHeight: {
+      type: [Boolean, Number],
+      default: !0
+    }
+  },
+  emits: [
+    "update:collapsed",
+    "update:selectedKeys",
+    "update:openKeys",
+    "collapse",
+    "menu-item-click",
+    "sub-menu-click",
+    "menuItemClick",
+    "subMenuClick"
+  ],
+  setup(c, { emit: t }) {
+    const o = s(h, void 0), d = p(() => (o == null ? void 0 : o.collapsed) || !1), a = i("light");
+    let n = null;
+    const u = () => {
+      typeof document > "u" || (a.value = document.documentElement.getAttribute("data-theme") === "dark" ? "dark" : "light");
+    };
+    return m(() => {
+      u(), !(typeof MutationObserver > "u" || typeof document > "u") && (n = new MutationObserver(() => {
+        u();
+      }), n.observe(document.documentElement, {
+        attributes: !0,
+        attributeFilter: ["data-theme"]
+      }));
+    }), y(() => {
+      n == null || n.disconnect(), n = null;
+    }), {
+      computedTheme: p(
+        () => c.theme || (o == null ? void 0 : o.theme) || a.value || "light"
+      ),
+      siderCollapsed: d,
+      handleCollapse: (e, l) => {
+        t("update:collapsed", e), t("collapse", e, l);
+      },
+      handleMenuItemClick: (e) => {
+        t("update:selectedKeys", [e]), t("menu-item-click", e), t("menuItemClick", e);
+      },
+      handleSubMenuClick: (e, l) => {
+        t("update:openKeys", l), t("sub-menu-click", e, l), t("subMenuClick", e, l);
+      }
+    };
+  }
+});
+export {
+  h as SiderInjectionKey,
+  O as default
+};

package/dist/components/XMenuIndent.vue.js

@@ -0,0 +1,19 @@
+import s from "./XMenuIndent.vue2.js";
+import { openBlock as n, createElementBlock as r, normalizeClass as t, Fragment as o, renderList as a, normalizeStyle as i, createCommentVNode as p } from "vue";
+import m from "../_virtual/_plugin-vue_export-helper.js";
+function d(e, f, u, c, $, k) {
+  return e.level > 1 ? (n(), r("span", {
+    key: 0,
+    class: t(`${e.prefixCls}-indent-list`)
+  }, [
+    (n(!0), r(o, null, a(e.level - 1, (l) => (n(), r("span", {
+      key: l,
+      class: t(`${e.prefixCls}-indent`),
+      style: i(`width: ${e.levelIndent}px`)
+    }, null, 6))), 128))
+  ], 2)) : p("", !0);
+}
+const _ = /* @__PURE__ */ m(s, [["render", d]]);
+export {
+  _ as default
+};