vft 0.0.48 → 0.0.51

package/es/components/dropdown/dropdown-item-impl.vue.d.ts

@@ -0,0 +1,57 @@
+declare const _sfc_main: import("vue").DefineComponent<{
+    command: {
+        type: (ObjectConstructor | NumberConstructor | StringConstructor)[];
+        default: () => {};
+    };
+    disabled: BooleanConstructor;
+    divided: BooleanConstructor;
+    textValue: StringConstructor;
+    icon: StringConstructor;
+}, {
+    ns: {
+        namespace: import("vue").Ref<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        is: {
+            (name: string, state: boolean | undefined): string;
+            (name: string): string;
+        };
+        cssVar: (object: Record<string, string | undefined>) => Record<string, string>;
+        cssVarName: (name: string) => string;
+        cssVarBlock: (object: Record<string, string | undefined>) => Record<string, string>;
+        cssVarBlockName: (name: string) => string;
+    };
+    itemRef: (el: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | Element | null) => void;
+    dataset: {
+        "data-vft-collection-item": string;
+    };
+    role: import("vue").ComputedRef<string>;
+    tabIndex: import("vue").Ref<number>;
+    handleFocus: (e: Event) => void;
+    handleKeydown: (event: KeyboardEvent) => void;
+    handleMousedown: (e: Event) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "pointermove" | "pointerleave" | "clickimpl")[], "click" | "pointermove" | "pointerleave" | "clickimpl", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    command: {
+        type: (ObjectConstructor | NumberConstructor | StringConstructor)[];
+        default: () => {};
+    };
+    disabled: BooleanConstructor;
+    divided: BooleanConstructor;
+    textValue: StringConstructor;
+    icon: StringConstructor;
+}>> & {
+    onClick?: ((...args: any[]) => any) | undefined;
+    onPointermove?: ((...args: any[]) => any) | undefined;
+    onPointerleave?: ((...args: any[]) => any) | undefined;
+    onClickimpl?: ((...args: any[]) => any) | undefined;
+}, {
+    disabled: boolean;
+    command: string | number | Record<string, any>;
+    divided: boolean;
+}>;
+export default _sfc_main;

package/es/components/dropdown/dropdown-item-impl.vue.js

@@ -0,0 +1,33 @@
+import t from "./dropdown-item-impl.vue2.js";
+import { resolveComponent as m, openBlock as r, createElementBlock as d, Fragment as a, mergeProps as i, createCommentVNode as l, createElementVNode as p, withModifiers as u, createBlock as f, normalizeProps as b, renderSlot as $ } from "vue";
+import v from "../../_virtual/_plugin-vue_export-helper.js";
+const w = ["aria-disabled", "tabindex", "role"];
+function k(e, o, y, F, M, P) {
+  const s = m("vft-icon");
+  return r(), d(a, null, [
+    e.divided ? (r(), d("li", i({
+      key: 0,
+      role: "separator",
+      class: e.ns.bem("menu", "item", "divided")
+    }, e.$attrs), null, 16)) : l("", !0),
+    p("li", i({ ref: e.itemRef }, { ...e.dataset, ...e.$attrs }, {
+      "aria-disabled": e.disabled,
+      class: [e.ns.be("menu", "item"), e.ns.is("disabled", e.disabled)],
+      tabindex: e.tabIndex,
+      role: e.role,
+      onClick: o[0] || (o[0] = (n) => e.$emit("clickimpl", n)),
+      onFocus: o[1] || (o[1] = (...n) => e.handleFocus && e.handleFocus(...n)),
+      onKeydown: o[2] || (o[2] = u((...n) => e.handleKeydown && e.handleKeydown(...n), ["self"])),
+      onMousedown: o[3] || (o[3] = (...n) => e.handleMousedown && e.handleMousedown(...n)),
+      onPointermove: o[4] || (o[4] = (n) => e.$emit("pointermove", n)),
+      onPointerleave: o[5] || (o[5] = (n) => e.$emit("pointerleave", n))
+    }), [
+      e.icon ? (r(), f(s, b(i({ key: 0 }, e.icon)), null, 16)) : l("", !0),
+      $(e.$slots, "default")
+    ], 16, w)
+  ], 64);
+}
+const K = /* @__PURE__ */ v(t, [["render", k]]);
+export {
+  K as default
+};

package/es/components/dropdown/dropdown-item-impl.vue2.js

@@ -0,0 +1,77 @@
+import { defineComponent as O, inject as e, computed as u } from "vue";
+import "../roving-focus-group/roving-focus-group.vue2.js";
+import "../roving-focus-group/roving-focus-item.vue2.js";
+import "../roving-focus-group/roving-focus-group-impl.vue2.js";
+import { ROVING_FOCUS_ITEM_COLLECTION_INJECTION_KEY as N } from "../roving-focus-group/types.js";
+import { ROVING_FOCUS_GROUP_ITEM_INJECTION_KEY as C } from "../roving-focus-group/tokens.js";
+import { EVENT_CODE as r } from "../../constants/aria.js";
+import { COLLECTION_ITEM_SIGN as T } from "../collection/collection.js";
+import { VftIcon as v } from "../icon/index.js";
+import { useNamespace as R } from "../../hooks/use-namespace/index.js";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.js";
+import "@vueuse/core";
+import "@vft/utils";
+import { composeRefs as L } from "../../utils/vue/refs.js";
+import { composeEventHandlers as K } from "../../utils/event.js";
+import "../../utils/ns-cover.js";
+import "@vue/reactivity";
+import "@vue/shared";
+import { DROPDOWN_COLLECTION_ITEM_INJECTION_KEY as g } from "./types.js";
+import { DROPDOWN_INJECTION_KEY as w } from "./tokens.js";
+const Q = O({
+  name: "DropdownItemImpl",
+  components: {
+    VftIcon: v
+  },
+  props: {
+    command: {
+      type: [Object, String, Number],
+      default: () => ({})
+    },
+    disabled: Boolean,
+    divided: Boolean,
+    textValue: String,
+    icon: String
+  },
+  emits: ["pointermove", "pointerleave", "click", "clickimpl"],
+  setup(D, { emit: m }) {
+    const i = R("dropdown"), { role: t } = e(w, void 0), { collectionItemRef: p } = e(
+      g,
+      void 0
+    ), { collectionItemRef: c } = e(
+      N,
+      void 0
+    ), {
+      rovingFocusGroupItemRef: I,
+      tabIndex: l,
+      handleFocus: s,
+      handleKeydown: a,
+      handleMousedown: d
+    } = e(C, void 0), _ = L(
+      p,
+      c,
+      I
+    ), f = u(() => t.value === "menu" ? "menuitem" : t.value === "navigation" ? "link" : "button"), E = K((o) => {
+      const { code: n } = o;
+      if (n === r.enter || n === r.space)
+        return o.preventDefault(), o.stopImmediatePropagation(), m("clickimpl", o), !0;
+    }, a);
+    return {
+      ns: i,
+      itemRef: _,
+      dataset: {
+        [T]: ""
+      },
+      role: f,
+      tabIndex: l,
+      handleFocus: s,
+      handleKeydown: E,
+      handleMousedown: d
+    };
+  }
+});
+export {
+  Q as default
+};

package/es/components/dropdown/dropdown-item.vue.d.ts

@@ -0,0 +1,43 @@
+declare const _sfc_main: import("vue").DefineComponent<{
+    command: {
+        type: (ObjectConstructor | NumberConstructor | StringConstructor)[];
+        default: () => {};
+    };
+    disabled: BooleanConstructor;
+    divided: BooleanConstructor;
+    textValue: StringConstructor;
+    icon: StringConstructor;
+}, {
+    handleClick: (event: PointerEvent) => void;
+    handlePointerMove: (event: PointerEvent) => void;
+    handlePointerLeave: (event: PointerEvent) => void;
+    textContent: import("vue").ComputedRef<string>;
+    propsAndAttrs: import("vue").ComputedRef<{
+        disabled: boolean;
+        command: string | number | Record<string, any>;
+        divided: boolean;
+        textValue: string | undefined;
+        icon: string | undefined;
+        onClick: ((...args: any[]) => any) | undefined;
+        onPointermove: ((...args: any[]) => any) | undefined;
+        onPointerleave: ((...args: any[]) => any) | undefined;
+    }>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "pointermove" | "pointerleave")[], "click" | "pointermove" | "pointerleave", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    command: {
+        type: (ObjectConstructor | NumberConstructor | StringConstructor)[];
+        default: () => {};
+    };
+    disabled: BooleanConstructor;
+    divided: BooleanConstructor;
+    textValue: StringConstructor;
+    icon: StringConstructor;
+}>> & {
+    onClick?: ((...args: any[]) => any) | undefined;
+    onPointermove?: ((...args: any[]) => any) | undefined;
+    onPointerleave?: ((...args: any[]) => any) | undefined;
+}, {
+    disabled: boolean;
+    command: string | number | Record<string, any>;
+    divided: boolean;
+}>;
+export default _sfc_main;

package/es/components/dropdown/dropdown-item.vue.js

@@ -0,0 +1,35 @@
+import d from "./dropdown-item.vue2.js";
+import { resolveComponent as o, openBlock as a, createBlock as p, withCtx as n, createVNode as t, mergeProps as m, renderSlot as s } from "vue";
+import c from "../../_virtual/_plugin-vue_export-helper.js";
+function f(e, u, _, v, P, b) {
+  const r = o("dropdown-item-impl"), l = o("roving-focus-item"), i = o("dropdown-collection-item");
+  return a(), p(i, {
+    disabled: e.disabled,
+    "text-value": e.textValue ?? e.textContent
+  }, {
+    default: n(() => [
+      t(l, {
+        focusable: !e.disabled
+      }, {
+        default: n(() => [
+          t(r, m(e.propsAndAttrs, {
+            onPointerleave: e.handlePointerLeave,
+            onPointermove: e.handlePointerMove,
+            onClickimpl: e.handleClick
+          }), {
+            default: n(() => [
+              s(e.$slots, "default")
+            ]),
+            _: 3
+          }, 16, ["onPointerleave", "onPointermove", "onClickimpl"])
+        ]),
+        _: 3
+      }, 8, ["focusable"])
+    ]),
+    _: 3
+  }, 8, ["disabled", "text-value"]);
+}
+const k = /* @__PURE__ */ c(d, [["render", f]]);
+export {
+  k as default
+};

package/es/components/dropdown/dropdown-item.vue2.js

@@ -0,0 +1,81 @@
+import { defineComponent as b, getCurrentInstance as g, ref as k, computed as d, unref as E, inject as O } from "vue";
+import "../roving-focus-group/roving-focus-group.vue2.js";
+import _ from "../roving-focus-group/roving-focus-item.vue.js";
+import "../roving-focus-group/roving-focus-group-impl.vue2.js";
+import "../roving-focus-group/types.js";
+import "@vft/utils";
+import "lodash";
+import "@vueuse/core";
+import { composeEventHandlers as i, whenMouse as l } from "../../utils/event.js";
+import "../../utils/ns-cover.js";
+import x from "./dropdown-item-impl.vue.js";
+import { useDropdown as N } from "./useDropdown.js";
+import { VftCollectionItem as y } from "./types.js";
+import { DROPDOWN_INJECTION_KEY as A } from "./tokens.js";
+const W = b({
+  name: "VftDropdownItem",
+  components: {
+    DropdownCollectionItem: y,
+    RovingFocusItem: _,
+    DropdownItemImpl: x
+  },
+  inheritAttrs: !1,
+  props: {
+    command: {
+      type: [Object, String, Number],
+      default: () => ({})
+    },
+    disabled: Boolean,
+    divided: Boolean,
+    textValue: String,
+    icon: String
+  },
+  emits: ["pointermove", "pointerleave", "click"],
+  setup(o, { emit: r, attrs: s }) {
+    const { elDropdown: e } = N(), u = g(), f = k(null), p = d(() => {
+      var t;
+      return ((t = E(f)) == null ? void 0 : t.textContent) ?? "";
+    }), { onItemEnter: v, onItemLeave: m } = O(
+      A,
+      void 0
+    ), I = i(
+      (t) => (r("pointermove", t), t.defaultPrevented),
+      l((t) => {
+        if (o.disabled) {
+          m(t);
+          return;
+        }
+        const n = t.currentTarget;
+        n === document.activeElement || n.contains(document.activeElement) || (v(t), t.defaultPrevented || n == null || n.focus());
+      })
+    ), C = i(
+      (t) => (r("pointerleave", t), t.defaultPrevented),
+      l((t) => {
+        m(t);
+      })
+    ), P = i(
+      (t) => {
+        if (!o.disabled)
+          return r("click", t), t.type !== "keydown" && t.defaultPrevented;
+      },
+      (t) => {
+        var n, c, a;
+        if (o.disabled) {
+          t.stopImmediatePropagation();
+          return;
+        }
+        (n = e == null ? void 0 : e.hideOnClick) != null && n.value && ((c = e.handleClick) == null || c.call(e)), (a = e.commandHandler) == null || a.call(e, o.command, u, t);
+      }
+    ), h = d(() => ({ ...o, ...s }));
+    return {
+      handleClick: P,
+      handlePointerMove: I,
+      handlePointerLeave: C,
+      textContent: p,
+      propsAndAttrs: h
+    };
+  }
+});
+export {
+  W as default
+};

package/es/components/dropdown/dropdown-menu.vue.d.ts

@@ -0,0 +1,22 @@
+declare const _sfc_main: import("vue").DefineComponent<{
+    onKeydown: {
+        type: FunctionConstructor;
+    };
+}, {
+    size: import("vue").ComputedRef<string> | undefined;
+    rovingFocusGroupRootStyle: import("vue").Ref<import("vue").StyleValue>;
+    tabIndex: import("vue").Ref<number>;
+    dropdownKls: import("vue").ComputedRef<string[]>;
+    role: import("vue").ComputedRef<string>;
+    triggerId: import("vue").ComputedRef<string>;
+    dropdownListWrapperRef: (el: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | Element | null) => void;
+    handleKeydown: (e: KeyboardEvent) => void;
+    onBlur: (e: Event) => void;
+    onFocus: (e: FocusEvent) => void;
+    onMousedown: (e: Event) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    onKeydown: {
+        type: FunctionConstructor;
+    };
+}>>, {}>;
+export default _sfc_main;

package/es/components/dropdown/dropdown-menu.vue.js

@@ -0,0 +1,24 @@
+import l from "./dropdown-menu.vue2.js";
+import { openBlock as s, createElementBlock as d, normalizeClass as i, normalizeStyle as u, withModifiers as n, renderSlot as p } from "vue";
+import a from "../../_virtual/_plugin-vue_export-helper.js";
+const f = ["role", "aria-labelledby"];
+function t(o, e, m, w, y, b) {
+  return s(), d("ul", {
+    ref: o.dropdownListWrapperRef,
+    class: i(o.dropdownKls),
+    style: u(o.rovingFocusGroupRootStyle),
+    tabindex: -1,
+    role: o.role,
+    "aria-labelledby": o.triggerId,
+    onBlur: e[0] || (e[0] = (...r) => o.onBlur && o.onBlur(...r)),
+    onFocus: e[1] || (e[1] = (...r) => o.onFocus && o.onFocus(...r)),
+    onKeydown: e[2] || (e[2] = n((...r) => o.handleKeydown && o.handleKeydown(...r), ["self"])),
+    onMousedown: e[3] || (e[3] = n((...r) => o.onMousedown && o.onMousedown(...r), ["self"]))
+  }, [
+    p(o.$slots, "default")
+  ], 46, f);
+}
+const F = /* @__PURE__ */ a(l, [["render", t]]);
+export {
+  F as default
+};

package/es/components/dropdown/dropdown-menu.vue2.js

@@ -0,0 +1,95 @@
+import { defineComponent as F, inject as t, computed as S, unref as D } from "vue";
+import "@vft/utils";
+import { composeRefs as Y } from "../../utils/vue/refs.js";
+import "lodash";
+import "@vueuse/core";
+import { composeEventHandlers as y } from "../../utils/event.js";
+import "../../utils/ns-cover.js";
+import { EVENT_CODE as J } from "../../constants/aria.js";
+import "../focus-trap/focus-trap.vue2.js";
+import { FOCUS_TRAP_INJECTION_KEY as G } from "../focus-trap/tokens.js";
+import "../focus-trap/utils.js";
+import "../roving-focus-group/roving-focus-group.vue2.js";
+import "../roving-focus-group/roving-focus-item.vue2.js";
+import "../roving-focus-group/roving-focus-group-impl.vue2.js";
+import { ROVING_FOCUS_COLLECTION_INJECTION_KEY as b } from "../roving-focus-group/types.js";
+import { ROVING_FOCUS_GROUP_INJECTION_KEY as P } from "../roving-focus-group/tokens.js";
+import { focusFirst as U } from "../roving-focus-group/utils.js";
+import { useNamespace as V } from "../../hooks/use-namespace/index.js";
+import "@popperjs/core";
+import "../../hooks/use-z-index/index.js";
+import "@vue/reactivity";
+import "@vue/shared";
+import { DROPDOWN_INJECTION_KEY as A } from "./tokens.js";
+import { DROPDOWN_COLLECTION_INJECTION_KEY as W, FIRST_LAST_KEYS as h, LAST_KEYS as x } from "./types.js";
+import { useDropdown as M } from "./useDropdown.js";
+const Eo = F({
+  name: "VftDropdownMenu",
+  props: {
+    onKeydown: {
+      type: Function
+    }
+  },
+  setup(n) {
+    const s = V("dropdown"), { _elDropdownSize: f } = M(), e = f.value, { focusTrapRef: u, onKeydown: a } = t(
+      G,
+      void 0
+    ), { contentRef: p, role: _, triggerId: O } = t(
+      A,
+      void 0
+    ), { collectionRef: I, getItems: l } = t(
+      W,
+      void 0
+    ), {
+      rovingFocusGroupRef: E,
+      rovingFocusGroupRootStyle: N,
+      tabIndex: C,
+      onBlur: T,
+      onFocus: R,
+      onMousedown: K
+    } = t(P, void 0), { collectionRef: w } = t(
+      b,
+      void 0
+    ), v = S(() => [s.b("menu"), s.bm("menu", e == null ? void 0 : e.value)]), L = Y(
+      p,
+      I,
+      u,
+      E,
+      w
+    ), g = y(
+      (o) => {
+        var r;
+        (r = n.onKeydown) == null || r.call(n, o);
+      },
+      (o) => {
+        const { currentTarget: r, code: i, target: c } = o;
+        if (r.contains(
+          c
+        ), J.tab === i && o.stopImmediatePropagation(), o.preventDefault(), c !== D(p) || !h.includes(i))
+          return;
+        const d = l().filter(
+          (m) => !m.disabled
+        ).map((m) => m.ref);
+        x.includes(i) && d.reverse(), U(d);
+      }
+    );
+    return {
+      size: e,
+      rovingFocusGroupRootStyle: N,
+      tabIndex: C,
+      dropdownKls: v,
+      role: _,
+      triggerId: O,
+      dropdownListWrapperRef: L,
+      handleKeydown: (o) => {
+        g(o), a(o);
+      },
+      onBlur: T,
+      onFocus: R,
+      onMousedown: K
+    };
+  }
+});
+export {
+  Eo as default
+};