@transsionfe/semi-ui-vue 0.0.1

package/lib/es/components/resizable/Resizable.vue.js

@@ -0,0 +1,222 @@
+import { defineComponent as N, computed as d, ref as U, reactive as _, onMounted as A, onUnmounted as P, watch as D, createElementBlock as c, openBlock as l, mergeProps as j, createCommentVNode as m, renderSlot as F, normalizeClass as p, normalizeStyle as g, unref as v, Fragment as E, renderList as O, createBlock as y, withCtx as V, resolveDynamicComponent as $ } from "vue";
+import G from "classnames";
+import { cssClasses as R } from "@douyinfe/semi-foundation/resizable/constants";
+import { directions as I } from "@douyinfe/semi-foundation/resizable/types";
+import { ResizableFoundation as T } from "@douyinfe/semi-foundation/resizable/foundation";
+import X from "./ResizableHandler.vue.js";
+/* empty css               */
+const te = /* @__PURE__ */ N({
+  name: "SemiResizable",
+  __name: "Resizable",
+  props: {
+    grid: { default: () => [1, 1] },
+    style: { default: () => ({}) },
+    className: {},
+    snap: {},
+    snapGap: { default: 0 },
+    boundElement: {},
+    boundsByDirection: { type: Boolean },
+    size: {},
+    minWidth: {},
+    minHeight: {},
+    maxWidth: {},
+    maxHeight: {},
+    lockAspectRatio: { type: [Boolean, Number], default: !1 },
+    lockAspectRatioExtraWidth: { default: 0 },
+    lockAspectRatioExtraHeight: { default: 0 },
+    enable: { type: [Object, Boolean], default: () => ({
+      top: !0,
+      right: !0,
+      bottom: !0,
+      left: !0,
+      topRight: !0,
+      bottomRight: !0,
+      bottomLeft: !0,
+      topLeft: !0
+    }) },
+    handleStyle: {},
+    handleClass: {},
+    handleWrapperStyle: {},
+    handleWrapperClass: {},
+    handleNode: {},
+    defaultSize: {},
+    scale: { default: 1 },
+    ratio: { default: 1 },
+    onResizeStart: {},
+    onChange: {},
+    onResizeEnd: {}
+  },
+  emits: ["resizeStart", "change", "resizeEnd"],
+  setup(b, { emit: S }) {
+    const n = b, x = d(() => {
+      const e = n.grid;
+      return typeof e == "number" ? [e, e] : e || [1, 1];
+    }), f = S, u = U(), i = _({
+      isResizing: !1,
+      width: "auto",
+      height: "auto",
+      direction: "right",
+      original: {
+        x: 0,
+        y: 0,
+        width: 0,
+        height: 0
+      },
+      backgroundStyle: {
+        cursor: "auto"
+      },
+      flexBasis: void 0
+    }), z = d(() => n.enable || !1), C = () => u.value;
+    function W(e) {
+      const t = {};
+      return Object.keys(e).forEach((o) => {
+        o.startsWith("data-") && (t[o] = e[o]);
+      }), t;
+    }
+    const w = d(() => {
+      const e = n, t = [
+        "style",
+        "className",
+        "grid",
+        "snap",
+        "snapGap",
+        "boundElement",
+        "boundsByDirection",
+        "size",
+        "minWidth",
+        "minHeight",
+        "maxWidth",
+        "maxHeight",
+        "lockAspectRatio",
+        "lockAspectRatioExtraWidth",
+        "lockAspectRatioExtraHeight",
+        "enable",
+        "handleStyle",
+        "handleClass",
+        "handleWrapperStyle",
+        "handleWrapperClass",
+        "handleNode",
+        "defaultSize",
+        "scale",
+        "ratio",
+        "onResizeStart",
+        "onChange",
+        "onResizeEnd"
+      ], o = {};
+      return Object.keys(e).forEach((s) => {
+        t.includes(s) || (o[s] = e[s]);
+      }), o;
+    }), B = {
+      getProp: (e) => e === "onResizeStart" ? (t, o) => {
+        var r;
+        const s = (r = n.onResizeStart) == null ? void 0 : r.call(n, t, o);
+        return f("resizeStart", t, o), s;
+      } : e === "onChange" ? (t, o, s) => {
+        var r;
+        (r = n.onChange) == null || r.call(n, t, o, s), f("change", t, o, s);
+      } : e === "onResizeEnd" ? (t, o, s) => {
+        var r;
+        (r = n.onResizeEnd) == null || r.call(n, t, o, s), f("resizeEnd", t, o, s);
+      } : e === "grid" ? x.value : n[e],
+      getProps: () => n,
+      getState: () => i,
+      getStates: () => i,
+      setState: (e) => {
+        Object.assign(i, e);
+      },
+      getContext: () => {
+      },
+      getContexts: () => {
+      },
+      getCache: () => {
+      },
+      getCaches: () => {
+      },
+      setCache: () => {
+      },
+      stopPropagation: () => {
+      },
+      persistEvent: () => {
+      },
+      getResizable: C,
+      registerEvent: (e) => {
+        var o, s;
+        const t = (s = (o = u.value) == null ? void 0 : o.ownerDocument) == null ? void 0 : s.defaultView;
+        !t || !a || (e === "mouse" ? (t.addEventListener("mouseup", a.onMouseUp), t.addEventListener("mousemove", a.onMouseMove), t.addEventListener("mouseleave", a.onMouseUp)) : (t.addEventListener("touchmove", a.onTouchMove, { passive: !1 }), t.addEventListener("touchend", a.onMouseUp), t.addEventListener("touchcancel", a.onMouseUp)));
+      },
+      unregisterEvent: (e) => {
+        var o, s;
+        const t = (s = (o = u.value) == null ? void 0 : o.ownerDocument) == null ? void 0 : s.defaultView;
+        !t || !a || (e === "mouse" ? (t.removeEventListener("mouseup", a.onMouseUp), t.removeEventListener("mousemove", a.onMouseMove), t.removeEventListener("mouseleave", a.onMouseUp)) : (t.removeEventListener("touchmove", a.onTouchMove), t.removeEventListener("touchend", a.onMouseUp), t.removeEventListener("touchcancel", a.onMouseUp)));
+      }
+    }, a = new T(B);
+    A(() => {
+      a.init();
+      const e = u.value ? window.getComputedStyle(u.value).flexBasis : "auto", t = a.propSize;
+      i.width = t.width ?? "auto", i.height = t.height ?? "auto", i.flexBasis = e !== "auto" ? e : void 0;
+    }), P(() => {
+      a.destroy();
+    }), D(
+      () => n.size,
+      (e) => {
+        e && (e.width !== void 0 && (i.width = e.width), e.height !== void 0 && (i.height = e.height));
+      },
+      { immediate: !0 }
+    );
+    const L = d(() => G(n.className, `${R.PREFIX}-resizable`)), M = d(() => {
+      const e = {
+        userSelect: i.isResizing ? "none" : "auto",
+        maxWidth: n.maxWidth,
+        maxHeight: n.maxHeight,
+        minWidth: n.minWidth,
+        minHeight: n.minHeight,
+        ...n.style,
+        ...a.sizeStyle
+      };
+      return i.flexBasis && (e.flexBasis = i.flexBasis), e;
+    });
+    return (e, t) => (l(), c("div", j({
+      ref_key: "resizableRef",
+      ref: u,
+      class: L.value,
+      style: M.value
+    }, W(w.value)), [
+      i.isResizing ? (l(), c("div", {
+        key: 0,
+        style: g(i.backgroundStyle),
+        class: p(`${v(R).PREFIX}-background`)
+      }, null, 6)) : m("", !0),
+      F(e.$slots, "default"),
+      z.value ? (l(), c("div", {
+        key: 1,
+        class: p(n.handleWrapperClass),
+        style: g(n.handleWrapperStyle)
+      }, [
+        (l(!0), c(E, null, O(v(I), (o) => {
+          var s, r;
+          return l(), c(E, { key: o }, [
+            z.value[o] !== !1 ? (l(), y(X, {
+              key: 0,
+              direction: o,
+              onResizeStart: (h, k, H) => v(a).onResizeStart(h, k, H),
+              style: g((s = n.handleStyle) == null ? void 0 : s[o]),
+              class: p((r = n.handleClass) == null ? void 0 : r[o])
+            }, {
+              default: V(() => {
+                var h;
+                return [
+                  (h = n.handleNode) != null && h[o] ? (l(), y($(n.handleNode[o]), { key: 0 })) : m("", !0)
+                ];
+              }),
+              _: 2
+            }, 1032, ["direction", "onResizeStart", "style", "class"])) : m("", !0)
+          ], 64);
+        }), 128))
+      ], 6)) : m("", !0)
+    ], 16));
+  }
+});
+export {
+  te as default
+};
+//# sourceMappingURL=Resizable.vue.js.map

package/lib/es/components/resizable/Resizable.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Resizable.vue.js","sources":["../../../../src/components/resizable/Resizable.vue"],"sourcesContent":["<template>\n    <div ref=\"resizableRef\" :class=\"resizableCls\" :style=\"resizableStyle\" v-bind=\"getDataAttr(restProps)\">\n        <div v-if=\"state.isResizing\" :style=\"state.backgroundStyle\" :class=\"`${cssClasses.PREFIX}-background`\" />\n        <slot></slot>\n        <div v-if=\"enable\" :class=\"props.handleWrapperClass\" :style=\"props.handleWrapperStyle\">\n            <template v-for=\"dir in directions\" :key=\"dir\">\n                <ResizableHandler\n                    v-if=\"enable[dir as Direction] !== false\"\n                    :direction=\"dir as Direction\"\n                    :onResizeStart=\"\n                        (e: MouseEvent | Touch, dir: Direction, type?: 'mouse' | 'touch') =>\n                            foundation.onResizeStart(e as MouseEvent, dir, type)\n                    \"\n                    :style=\"props.handleStyle?.[dir as keyof HandleStyle]\"\n                    :class=\"props.handleClass?.[dir as keyof HandleClassName]\"\n                >\n                    <component\n                        :is=\"props.handleNode[dir as keyof HandleComponent]\"\n                        v-if=\"props.handleNode?.[dir as keyof HandleComponent]\"\n                    />\n                </ResizableHandler>\n            </template>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, reactive, watch, onMounted, onUnmounted } from 'vue';\nimport type { CSSProperties } from 'vue';\nimport classNames from 'classnames';\nimport { cssClasses } from '@douyinfe/semi-foundation/resizable/constants';\nimport { directions, type Direction, type Enable } from '@douyinfe/semi-foundation/resizable/types';\nimport { ResizableFoundation, type ResizableAdapter } from '@douyinfe/semi-foundation/resizable/foundation';\nimport ResizableHandler from './ResizableHandler.vue';\nimport type { ResizableProps, ResizableState, HandleStyle, HandleClassName, HandleComponent } from './interface';\nimport './resizable.scss';\n\ndefineOptions({\n    name: 'SemiResizable',\n});\n\ninterface Props extends Omit<ResizableProps, 'grid'> {\n    grid?: [number, number] | number;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n    enable: () => ({\n        top: true,\n        right: true,\n        bottom: true,\n        left: true,\n        topRight: true,\n        bottomRight: true,\n        bottomLeft: true,\n        topLeft: true,\n    }),\n    style: () => ({}),\n    grid: () => [1, 1] as [number, number],\n    lockAspectRatio: false,\n    lockAspectRatioExtraWidth: 0,\n    lockAspectRatioExtraHeight: 0,\n    scale: 1,\n    ratio: 1,\n    snapGap: 0,\n});\n\n// 将 grid 转换为数组格式，支持数字和数组两种形式\nconst gridValue = computed<[number, number]>(() => {\n    const grid = props.grid;\n    if (typeof grid === 'number') {\n        return [grid, grid];\n    }\n    return grid || [1, 1];\n});\n\nconst emit = defineEmits<{\n    resizeStart: [e: MouseEvent | Touch, dir: Direction];\n    change: [\n        size: { width: number | string; height: number | string },\n        event: MouseEvent | TouchEvent,\n        direction: Direction,\n    ];\n    resizeEnd: [size: { width: number; height: number }, event: MouseEvent | TouchEvent, direction: Direction];\n}>();\n\nconst resizableRef = ref<HTMLDivElement>();\n\nconst state = reactive<ResizableState>({\n    isResizing: false,\n    width: 'auto',\n    height: 'auto',\n    direction: 'right',\n    original: {\n        x: 0,\n        y: 0,\n        width: 0,\n        height: 0,\n    },\n    backgroundStyle: {\n        cursor: 'auto',\n    },\n    flexBasis: undefined,\n});\n\nconst enable = computed<Enable | false>(() => {\n    return props.enable || false;\n});\n\nconst getResizable = () => {\n    return resizableRef.value;\n};\n\nfunction getDataAttr(propsData: Record<string, unknown>) {\n    const dataAttrs: Record<string, unknown> = {};\n    Object.keys(propsData).forEach((key) => {\n        if (key.startsWith('data-')) {\n            dataAttrs[key] = propsData[key];\n        }\n    });\n    return dataAttrs;\n}\n\nconst restProps = computed(() => {\n    const propsData = props as unknown as Record<string, unknown>;\n    const omitKeys = [\n        'style',\n        'className',\n        'grid',\n        'snap',\n        'snapGap',\n        'boundElement',\n        'boundsByDirection',\n        'size',\n        'minWidth',\n        'minHeight',\n        'maxWidth',\n        'maxHeight',\n        'lockAspectRatio',\n        'lockAspectRatioExtraWidth',\n        'lockAspectRatioExtraHeight',\n        'enable',\n        'handleStyle',\n        'handleClass',\n        'handleWrapperStyle',\n        'handleWrapperClass',\n        'handleNode',\n        'defaultSize',\n        'scale',\n        'ratio',\n        'onResizeStart',\n        'onChange',\n        'onResizeEnd',\n    ];\n    const rest: Record<string, unknown> = {};\n    Object.keys(propsData).forEach((key) => {\n        if (!omitKeys.includes(key)) {\n            rest[key] = propsData[key];\n        }\n    });\n    return rest;\n});\n\nconst adapter: ResizableAdapter<ResizableProps, ResizableState> = {\n    getProp: (key: string) => {\n        if (key === 'onResizeStart') {\n            return (e: MouseEvent | Touch, dir: Direction) => {\n                const result = props.onResizeStart?.(e, dir);\n                emit('resizeStart', e, dir);\n                return result;\n            };\n        }\n        if (key === 'onChange') {\n            return (\n                size: { width: number | string; height: number | string },\n                event: MouseEvent | TouchEvent,\n                direction: Direction\n            ) => {\n                props.onChange?.(size, event, direction);\n                emit('change', size, event, direction);\n            };\n        }\n        if (key === 'onResizeEnd') {\n            return (size: { width: number; height: number }, event: MouseEvent | TouchEvent, direction: Direction) => {\n                props.onResizeEnd?.(size, event, direction);\n                emit('resizeEnd', size, event, direction);\n            };\n        }\n        if (key === 'grid') {\n            return gridValue.value;\n        }\n        return (props as Record<string, unknown>)[key];\n    },\n    getProps: () => props,\n    getState: () => state,\n    getStates: () => state,\n    setState: (states: Partial<ResizableState>) => {\n        Object.assign(state, states);\n    },\n    getContext: () => undefined,\n    getContexts: () => undefined,\n    getCache: () => undefined,\n    getCaches: () => undefined,\n    setCache: () => {},\n    stopPropagation: () => {},\n    persistEvent: () => {},\n    getResizable,\n    registerEvent: (type: 'mouse' | 'touch') => {\n        const window = resizableRef.value?.ownerDocument?.defaultView;\n        if (!window || !foundation) return;\n        if (type === 'mouse') {\n            window.addEventListener('mouseup', foundation.onMouseUp);\n            window.addEventListener('mousemove', foundation.onMouseMove);\n            window.addEventListener('mouseleave', foundation.onMouseUp);\n        } else {\n            window.addEventListener('touchmove', foundation.onTouchMove, { passive: false });\n            window.addEventListener('touchend', foundation.onMouseUp);\n            window.addEventListener('touchcancel', foundation.onMouseUp);\n        }\n    },\n    unregisterEvent: (type: 'mouse' | 'touch') => {\n        const window = resizableRef.value?.ownerDocument?.defaultView;\n        if (!window || !foundation) return;\n        if (type === 'mouse') {\n            window.removeEventListener('mouseup', foundation.onMouseUp);\n            window.removeEventListener('mousemove', foundation.onMouseMove);\n            window.removeEventListener('mouseleave', foundation.onMouseUp);\n        } else {\n            window.removeEventListener('touchmove', foundation.onTouchMove);\n            window.removeEventListener('touchend', foundation.onMouseUp);\n            window.removeEventListener('touchcancel', foundation.onMouseUp);\n        }\n    },\n};\n\nconst foundation: ResizableFoundation<ResizableProps, ResizableState> = new ResizableFoundation(adapter);\n\nonMounted(() => {\n    foundation.init();\n    const flexBasis = resizableRef.value ? window.getComputedStyle(resizableRef.value).flexBasis : 'auto';\n    const propSize = foundation.propSize;\n    state.width = propSize.width ?? 'auto';\n    state.height = propSize.height ?? 'auto';\n    state.flexBasis = flexBasis !== 'auto' ? flexBasis : undefined;\n});\n\nonUnmounted(() => {\n    foundation.destroy();\n});\n\nwatch(\n    () => props.size,\n    (newSize) => {\n        if (newSize) {\n            if (newSize.width !== undefined) {\n                state.width = newSize.width;\n            }\n            if (newSize.height !== undefined) {\n                state.height = newSize.height;\n            }\n        }\n    },\n    { immediate: true }\n);\n\nconst resizableCls = computed(() => {\n    return classNames(props.className, `${cssClasses.PREFIX}-resizable`);\n});\n\nconst resizableStyle = computed(() => {\n    const resizeStyle: CSSProperties = {\n        userSelect: state.isResizing ? 'none' : 'auto',\n        maxWidth: props.maxWidth,\n        maxHeight: props.maxHeight,\n        minWidth: props.minWidth,\n        minHeight: props.minHeight,\n        ...props.style,\n        ...foundation.sizeStyle,\n    };\n\n    if (state.flexBasis) {\n        resizeStyle.flexBasis = state.flexBasis;\n    }\n\n    return resizeStyle;\n});\n</script>\n"],"names":["props","__props","gridValue","computed","grid","emit","__emit","resizableRef","ref","state","reactive","enable","getResizable","getDataAttr","propsData","dataAttrs","key","restProps","omitKeys","rest","adapter","e","dir","result","_a","size","event","direction","states","type","window","_b","foundation","ResizableFoundation","onMounted","flexBasis","propSize","onUnmounted","watch","newSize","resizableCls","classNames","cssClasses","resizableStyle","resizeStyle","_openBlock","_createElementBlock","_mergeProps","_normalizeStyle","_normalizeClass","_unref","_renderSlot","_ctx","_Fragment","_renderList","directions","_createBlock","ResizableHandler","_resolveDynamicComponent"],"mappings":"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"}

package/lib/es/components/resizable/ResizableHandler.vue.js

@@ -0,0 +1,65 @@
+import { defineComponent as i, ref as d, computed as u, onMounted as c, onUnmounted as m, createElementBlock as v, openBlock as p, normalizeStyle as f, normalizeClass as g, renderSlot as h } from "vue";
+import E from "classnames";
+import { cssClasses as s } from "@douyinfe/semi-foundation/resizable/constants";
+import { ResizableHandlerFoundation as C } from "@douyinfe/semi-foundation/resizable/foundation";
+const _ = /* @__PURE__ */ i({
+  name: "SemiResizableHandler",
+  __name: "ResizableHandler",
+  props: {
+    direction: {},
+    onResizeStart: {},
+    className: {},
+    disabled: { type: Boolean, default: !1 },
+    style: {}
+  },
+  setup(a) {
+    const o = a, t = d(), r = u(() => E(
+      o.className,
+      `${s.PREFIX}-resizableHandler`,
+      `${s.PREFIX}-resizableHandler-${o.direction}`
+    )), l = {
+      getProp: (n) => o[n],
+      getProps: () => o,
+      getState: () => ({}),
+      getStates: () => ({}),
+      setState: () => {
+      },
+      getContext: () => {
+      },
+      getContexts: () => {
+      },
+      getCache: () => {
+      },
+      getCaches: () => {
+      },
+      setCache: () => {
+      },
+      stopPropagation: () => {
+      },
+      persistEvent: () => {
+      },
+      registerEvent: () => {
+        t.value && e && (t.value.addEventListener("mousedown", e.onMouseDown), t.value.addEventListener("touchstart", e.onTouchStart));
+      },
+      unregisterEvent: () => {
+        t.value && e && (t.value.removeEventListener("mousedown", e.onMouseDown), t.value.removeEventListener("touchstart", e.onTouchStart));
+      }
+    }, e = new C(l);
+    return c(() => {
+      e.init();
+    }), m(() => {
+      e.destroy();
+    }), (n, S) => (p(), v("div", {
+      ref_key: "handlerRef",
+      ref: t,
+      class: g(r.value),
+      style: f(o.style)
+    }, [
+      h(n.$slots, "default")
+    ], 6));
+  }
+});
+export {
+  _ as default
+};
+//# sourceMappingURL=ResizableHandler.vue.js.map

package/lib/es/components/resizable/ResizableHandler.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResizableHandler.vue.js","sources":["../../../../src/components/resizable/ResizableHandler.vue"],"sourcesContent":["<template>\n    <div ref=\"handlerRef\" :class=\"handlerCls\" :style=\"props.style\">\n        <slot></slot>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onMounted, onUnmounted } from 'vue';\nimport classNames from 'classnames';\nimport { cssClasses } from '@douyinfe/semi-foundation/resizable/constants';\nimport {\n    ResizableHandlerFoundation,\n    type ResizableHandlerAdapter,\n} from '@douyinfe/semi-foundation/resizable/foundation';\nimport type { ResizableHandlerProps } from './interface';\n\ndefineOptions({\n    name: 'SemiResizableHandler',\n});\n\nconst props = withDefaults(defineProps<ResizableHandlerProps>(), {\n    disabled: false,\n});\n\nconst handlerRef = ref<HTMLDivElement>();\n\nconst handlerCls = computed(() => {\n    return classNames(\n        props.className,\n        `${cssClasses.PREFIX}-resizableHandler`,\n        `${cssClasses.PREFIX}-resizableHandler-${props.direction}`\n    );\n});\n\nconst adapter: ResizableHandlerAdapter<ResizableHandlerProps, any> = {\n    getProp: (key: string) => (props as Record<string, unknown>)[key],\n    getProps: () => props,\n    getState: () => ({}),\n    getStates: () => ({}),\n    setState: () => {},\n    getContext: () => undefined,\n    getContexts: () => undefined,\n    getCache: () => undefined,\n    getCaches: () => undefined,\n    setCache: () => {},\n    stopPropagation: () => {},\n    persistEvent: () => {},\n    registerEvent: () => {\n        if (handlerRef.value && foundation) {\n            handlerRef.value.addEventListener('mousedown', foundation.onMouseDown);\n            handlerRef.value.addEventListener('touchstart', foundation.onTouchStart);\n        }\n    },\n    unregisterEvent: () => {\n        if (handlerRef.value && foundation) {\n            handlerRef.value.removeEventListener('mousedown', foundation.onMouseDown);\n            handlerRef.value.removeEventListener('touchstart', foundation.onTouchStart);\n        }\n    },\n};\n\nconst foundation: ResizableHandlerFoundation<ResizableHandlerProps, any> = new ResizableHandlerFoundation(adapter);\n\nonMounted(() => {\n    foundation.init();\n});\n\nonUnmounted(() => {\n    foundation.destroy();\n});\n</script>\n"],"names":["props","__props","handlerRef","ref","handlerCls","computed","classNames","cssClasses","adapter","key","foundation","ResizableHandlerFoundation","onMounted","onUnmounted","_createElementBlock","_normalizeStyle","_renderSlot","_ctx"],"mappings":";;;;;;;;;;;;;;;AAoBA,UAAMA,IAAQC,GAIRC,IAAaC,EAAA,GAEbC,IAAaC,EAAS,MACjBC;AAAA,MACHN,EAAM;AAAA,MACN,GAAGO,EAAW,MAAM;AAAA,MACpB,GAAGA,EAAW,MAAM,qBAAqBP,EAAM,SAAS;AAAA,IAAA,CAE/D,GAEKQ,IAA+D;AAAA,MACjE,SAAS,CAACC,MAAiBT,EAAkCS,CAAG;AAAA,MAChE,UAAU,MAAMT;AAAA,MAChB,UAAU,OAAO,CAAA;AAAA,MACjB,WAAW,OAAO,CAAA;AAAA,MAClB,UAAU,MAAM;AAAA,MAAC;AAAA,MACjB,YAAY,MAAA;AAAA;AAAA,MACZ,aAAa,MAAA;AAAA;AAAA,MACb,UAAU,MAAA;AAAA;AAAA,MACV,WAAW,MAAA;AAAA;AAAA,MACX,UAAU,MAAM;AAAA,MAAC;AAAA,MACjB,iBAAiB,MAAM;AAAA,MAAC;AAAA,MACxB,cAAc,MAAM;AAAA,MAAC;AAAA,MACrB,eAAe,MAAM;AACjB,QAAIE,EAAW,SAASQ,MACpBR,EAAW,MAAM,iBAAiB,aAAaQ,EAAW,WAAW,GACrER,EAAW,MAAM,iBAAiB,cAAcQ,EAAW,YAAY;AAAA,MAE/E;AAAA,MACA,iBAAiB,MAAM;AACnB,QAAIR,EAAW,SAASQ,MACpBR,EAAW,MAAM,oBAAoB,aAAaQ,EAAW,WAAW,GACxER,EAAW,MAAM,oBAAoB,cAAcQ,EAAW,YAAY;AAAA,MAElF;AAAA,IAAA,GAGEA,IAAqE,IAAIC,EAA2BH,CAAO;AAEjH,WAAAI,EAAU,MAAM;AACZ,MAAAF,EAAW,KAAA;AAAA,IACf,CAAC,GAEDG,EAAY,MAAM;AACd,MAAAH,EAAW,QAAA;AAAA,IACf,CAAC,mBApEGI,EAEM,OAAA;AAAA,eAFG;AAAA,MAAJ,KAAIZ;AAAA,MAAc,SAAOE,EAAA,KAAU;AAAA,MAAG,OAAKW,EAAEf,EAAM,KAAK;AAAA,IAAA;MACzDgB,EAAaC,EAAA,QAAA,SAAA;AAAA,IAAA;;;"}

package/lib/es/components/resizable/group/ResizeGroup.vue.js

@@ -0,0 +1,154 @@
+import { defineComponent as D, ref as H, reactive as O, computed as m, onMounted as V, onUnmounted as j, watch as F, createElementBlock as R, openBlock as h, mergeProps as T, createCommentVNode as $, renderSlot as B, normalizeClass as W, normalizeStyle as X, unref as K } from "vue";
+import U from "classnames";
+import { cssClasses as w } from "@douyinfe/semi-foundation/resizable/constants";
+import { ResizeGroupFoundation as q } from "@douyinfe/semi-foundation/resizable/foundation";
+import { provideResizeContext as J } from "./resizeContext.js";
+/* empty css                */
+const re = /* @__PURE__ */ D({
+  name: "SemiResizeGroup",
+  __name: "ResizeGroup",
+  props: {
+    direction: { default: "horizontal" },
+    className: {},
+    style: { default: () => ({}) }
+  },
+  setup(M) {
+    const r = M, a = H(), c = O({
+      isResizing: !1,
+      originalPosition: {
+        x: 0,
+        y: 0,
+        lastItemSize: 0,
+        nextItemSize: 0,
+        lastOffset: 0,
+        nextOffset: 0
+      },
+      backgroundStyle: {
+        cursor: "auto"
+      },
+      curHandler: null
+    }), u = /* @__PURE__ */ new Map(), d = /* @__PURE__ */ new Map(), g = /* @__PURE__ */ new Map(), v = /* @__PURE__ */ new Map(), p = /* @__PURE__ */ new Map(), f = /* @__PURE__ */ new Map(), z = /* @__PURE__ */ new Map(), l = /* @__PURE__ */ new Map();
+    function S(t) {
+      const e = {};
+      return Object.keys(t).forEach((o) => {
+        o.startsWith("data-") && (e[o] = t[o]);
+      }), e;
+    }
+    const y = m(() => {
+      const t = r, e = ["style", "className", "direction"], o = {};
+      return Object.keys(t).forEach((s) => {
+        e.includes(s) || (o[s] = t[s]);
+      }), o;
+    }), C = m(() => S(y.value)), I = (t, e, o, s, P, N, _) => {
+      if (Array.from(u.values()).some((A) => A === t))
+        return -1;
+      const i = u.size;
+      return u.set(i, t), d.set(i, e), g.set(i, o), v.set(i, s), p.set(i, P), f.set(i, N), z.set(i, _), i;
+    }, L = (t) => {
+      if (Array.from(l.values()).some((o) => o === t))
+        return -1;
+      const e = l.size;
+      return l.set(e, t), e;
+    }, b = () => a.value ? r.direction === "horizontal" ? a.value.offsetWidth : a.value.offsetHeight : 0, k = {
+      getProp: (t) => r[t],
+      getProps: () => r,
+      getState: () => c,
+      getStates: () => c,
+      setState: (t) => {
+        Object.assign(c, t);
+      },
+      getContext: () => {
+      },
+      getContexts: () => {
+      },
+      getCache: () => {
+      },
+      getCaches: () => {
+      },
+      setCache: () => {
+      },
+      stopPropagation: () => {
+      },
+      persistEvent: () => {
+      },
+      getGroupRef: () => a.value || null,
+      getItem: (t) => {
+        const e = u.get(t);
+        return e == null ? void 0 : e.value;
+      },
+      getItemCount: () => u.size,
+      getHandler: (t) => {
+        const e = l.get(t);
+        return e == null ? void 0 : e.value;
+      },
+      getHandlerCount: () => l.size,
+      getItemMin: (t) => d.get(t) ?? "",
+      getItemMax: (t) => g.get(t) ?? "",
+      getItemChange: (t) => {
+        const e = f.get(t);
+        return console.log("[ResizeGroup] getItemChange", { index: t, callback: !!e }), e;
+      },
+      getItemEnd: (t) => {
+        const e = z.get(t);
+        return console.log("[ResizeGroup] getItemEnd", { index: t, callback: !!e }), e;
+      },
+      getItemStart: (t) => {
+        const e = p.get(t);
+        return console.log("[ResizeGroup] getItemStart", {
+          index: t,
+          callback: !!e,
+          callbackType: typeof e,
+          callbackName: (e == null ? void 0 : e.name) || "anonymous"
+        }), e && console.log("[ResizeGroup] getItemStart - will call callback", { index: t }), e;
+      },
+      getItemDefaultSize: (t) => v.get(t),
+      registerEvents: (t = "mouse") => {
+        var o, s;
+        const e = (s = (o = a.value) == null ? void 0 : o.ownerDocument) == null ? void 0 : s.defaultView;
+        !e || !n || (t === "mouse" ? (e.addEventListener("mousemove", n.onMouseMove), e.addEventListener("mouseup", n.onResizeEnd), e.addEventListener("mouseleave", n.onResizeEnd)) : (e.addEventListener("touchmove", n.onTouchMove, { passive: !1 }), e.addEventListener("touchend", n.onResizeEnd), e.addEventListener("touchcancel", n.onResizeEnd)));
+      },
+      unregisterEvents: (t = "mouse") => {
+        var o, s;
+        const e = (s = (o = a.value) == null ? void 0 : o.ownerDocument) == null ? void 0 : s.defaultView;
+        !e || !n || (t === "mouse" ? (e.removeEventListener("mousemove", n.onMouseMove), e.removeEventListener("mouseup", n.onResizeEnd), e.removeEventListener("mouseleave", n.onResizeEnd)) : (e.removeEventListener("touchmove", n.onTouchMove), e.removeEventListener("touchend", n.onResizeEnd), e.removeEventListener("touchcancel", n.onResizeEnd)));
+      }
+    }, n = new q(k), E = {
+      direction: r.direction,
+      registerItem: I,
+      registerHandler: L,
+      notifyResizeStart: n.onResizeStart,
+      getGroupSize: b
+    };
+    J(E), V(() => {
+      n.init(), window.addEventListener("resize", n.ensureConstraint);
+    }), j(() => {
+      n.destroy(), window.removeEventListener("resize", n.ensureConstraint);
+    }), F(
+      () => r.direction,
+      (t) => {
+        n.direction = t, E.direction = t;
+      }
+    );
+    const x = m(() => U(r.className, `${w.PREFIX}-group`)), G = m(() => ({
+      flexDirection: r.direction === "vertical" ? "column" : "row",
+      ...r.style
+    }));
+    return (t, e) => (h(), R("div", T({
+      ref_key: "groupRef",
+      ref: a,
+      class: x.value,
+      style: G.value
+    }, C.value), [
+      c.isResizing ? (h(), R("div", {
+        key: 0,
+        style: X(c.backgroundStyle),
+        class: W(`${K(w).PREFIX}-background`)
+      }, null, 6)) : $("", !0),
+      B(t.$slots, "default")
+    ], 16));
+  }
+});
+export {
+  re as default
+};
+//# sourceMappingURL=ResizeGroup.vue.js.map

package/lib/es/components/resizable/group/ResizeGroup.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResizeGroup.vue.js","sources":["../../../../../src/components/resizable/group/ResizeGroup.vue"],"sourcesContent":["<template>\n    <div ref=\"groupRef\" :class=\"groupCls\" :style=\"groupStyle\" v-bind=\"dataAttrs\">\n        <div v-if=\"state.isResizing\" :style=\"state.backgroundStyle\" :class=\"`${cssClasses.PREFIX}-background`\" />\n        <slot></slot>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, reactive, watch, onMounted, onUnmounted } from 'vue';\nimport type { Ref } from 'vue';\nimport type { CSSProperties } from 'vue';\nimport classNames from 'classnames';\nimport { cssClasses } from '@douyinfe/semi-foundation/resizable/constants';\nimport { ResizeGroupFoundation, type ResizeGroupAdapter } from '@douyinfe/semi-foundation/resizable/foundation';\nimport type { ResizeCallback, ResizeEventType, ResizeStartCallback } from '@douyinfe/semi-foundation/resizable/types';\nimport { provideResizeContext, type ResizeContextProps } from './resizeContext';\nimport '../resizable.scss';\n\ndefineOptions({\n    name: 'SemiResizeGroup',\n});\n\ninterface ResizeGroupProps {\n    direction?: 'horizontal' | 'vertical';\n    className?: string;\n    style?: CSSProperties;\n}\n\nconst props = withDefaults(defineProps<ResizeGroupProps>(), {\n    direction: 'horizontal',\n    style: () => ({}),\n});\n\nconst groupRef = ref<HTMLDivElement>();\n\nconst state = reactive({\n    isResizing: false,\n    originalPosition: {\n        x: 0,\n        y: 0,\n        lastItemSize: 0,\n        nextItemSize: 0,\n        lastOffset: 0,\n        nextOffset: 0,\n    },\n    backgroundStyle: {\n        cursor: 'auto',\n    } as CSSProperties,\n    curHandler: null as number | null,\n});\n\nconst itemRefs = new Map<number, Ref<HTMLDivElement | undefined>>();\nconst itemMinMap = new Map<number, string>();\nconst itemMaxMap = new Map<number, string>();\n// itemMinusMap is used by foundation internally\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nconst itemMinusMap = new Map<number, number>();\nconst itemDefaultSizeList = new Map<number, string | number>();\nconst itemResizeStart = new Map<number, ResizeStartCallback>();\nconst itemResizing = new Map<number, ResizeCallback>();\nconst itemResizeEnd = new Map<number, ResizeCallback>();\nconst handlerRefs = new Map<number, Ref<HTMLDivElement | undefined>>();\n\nfunction getDataAttr(propsData: Record<string, unknown>) {\n    const dataAttrs: Record<string, unknown> = {};\n    Object.keys(propsData).forEach((key) => {\n        if (key.startsWith('data-')) {\n            dataAttrs[key] = propsData[key];\n        }\n    });\n    return dataAttrs;\n}\n\nconst restProps = computed(() => {\n    const propsData = props as unknown as Record<string, unknown>;\n    const omitKeys = ['style', 'className', 'direction'];\n    const rest: Record<string, unknown> = {};\n    Object.keys(propsData).forEach((key) => {\n        if (!omitKeys.includes(key)) {\n            rest[key] = propsData[key];\n        }\n    });\n    return rest;\n});\n\nconst dataAttrs = computed(() => getDataAttr(restProps.value));\n\nconst registerItem = (\n    ref: Ref<HTMLDivElement | undefined>,\n    min: string,\n    max: string,\n    defaultSize: string | number,\n    onResizeStart: ResizeStartCallback,\n    onChange: ResizeCallback,\n    onResizeEnd: ResizeCallback\n): number => {\n    if (Array.from(itemRefs.values()).some((r) => r === ref)) {\n        return -1;\n    }\n    const index = itemRefs.size;\n    itemRefs.set(index, ref);\n    itemMinMap.set(index, min);\n    itemMaxMap.set(index, max);\n    itemDefaultSizeList.set(index, defaultSize);\n    itemResizeStart.set(index, onResizeStart);\n    itemResizing.set(index, onChange);\n    itemResizeEnd.set(index, onResizeEnd);\n    return index;\n};\n\nconst registerHandler = (ref: Ref<HTMLDivElement | undefined>): number => {\n    if (Array.from(handlerRefs.values()).some((r) => r === ref)) {\n        return -1;\n    }\n    const index = handlerRefs.size;\n    handlerRefs.set(index, ref);\n    return index;\n};\n\nconst getGroupSize = (): number => {\n    if (groupRef.value) {\n        return props.direction === 'horizontal' ? groupRef.value.offsetWidth : groupRef.value.offsetHeight;\n    }\n    return 0;\n};\n\nconst registerEvent = (type: ResizeEventType = 'mouse') => {\n    const window = groupRef.value?.ownerDocument?.defaultView;\n    if (!window || !foundation) return;\n    if (type === 'mouse') {\n        window.addEventListener('mousemove', foundation.onMouseMove);\n        window.addEventListener('mouseup', foundation.onResizeEnd);\n        window.addEventListener('mouseleave', foundation.onResizeEnd);\n    } else {\n        window.addEventListener('touchmove', foundation.onTouchMove, { passive: false });\n        window.addEventListener('touchend', foundation.onResizeEnd);\n        window.addEventListener('touchcancel', foundation.onResizeEnd);\n    }\n};\n\nconst unregisterEvent = (type: ResizeEventType = 'mouse') => {\n    const window = groupRef.value?.ownerDocument?.defaultView;\n    if (!window || !foundation) return;\n    if (type === 'mouse') {\n        window.removeEventListener('mousemove', foundation.onMouseMove);\n        window.removeEventListener('mouseup', foundation.onResizeEnd);\n        window.removeEventListener('mouseleave', foundation.onResizeEnd);\n    } else {\n        window.removeEventListener('touchmove', foundation.onTouchMove);\n        window.removeEventListener('touchend', foundation.onResizeEnd);\n        window.removeEventListener('touchcancel', foundation.onResizeEnd);\n    }\n};\n\nconst adapter: ResizeGroupAdapter<ResizeGroupProps, typeof state> = {\n    getProp: (key: string) => (props as Record<string, unknown>)[key],\n    getProps: () => props,\n    getState: () => state,\n    getStates: () => state,\n    setState: (states: Partial<typeof state>) => {\n        Object.assign(state, states);\n    },\n    getContext: () => undefined,\n    getContexts: () => undefined,\n    getCache: () => undefined,\n    getCaches: () => undefined,\n    setCache: () => {},\n    stopPropagation: () => {},\n    persistEvent: () => {},\n    getGroupRef: () => groupRef.value || null,\n    getItem: (id: number) => {\n        const ref = itemRefs.get(id);\n        return ref?.value as HTMLDivElement;\n    },\n    getItemCount: () => itemRefs.size,\n    getHandler: (id: number) => {\n        const ref = handlerRefs.get(id);\n        return ref?.value as HTMLDivElement;\n    },\n    getHandlerCount: () => handlerRefs.size,\n    getItemMin: (index: number) => {\n        const min = itemMinMap.get(index);\n        return min ?? '';\n    },\n    getItemMax: (index: number) => {\n        const max = itemMaxMap.get(index);\n        return max ?? '';\n    },\n    getItemChange: (index: number) => {\n        const callback = itemResizing.get(index);\n        console.log('[ResizeGroup] getItemChange', { index, callback: !!callback });\n        return callback;\n    },\n    getItemEnd: (index: number) => {\n        const callback = itemResizeEnd.get(index);\n        console.log('[ResizeGroup] getItemEnd', { index, callback: !!callback });\n        return callback;\n    },\n    getItemStart: (index: number) => {\n        const callback = itemResizeStart.get(index);\n        console.log('[ResizeGroup] getItemStart', {\n            index,\n            callback: !!callback,\n            callbackType: typeof callback,\n            callbackName: callback?.name || 'anonymous',\n        });\n        if (callback) {\n            console.log('[ResizeGroup] getItemStart - will call callback', { index });\n        }\n        return callback;\n    },\n    getItemDefaultSize: (index: number) => itemDefaultSizeList.get(index),\n    registerEvents: registerEvent,\n    unregisterEvents: unregisterEvent,\n};\n\nconst foundation: ResizeGroupFoundation<ResizeGroupProps, typeof state> = new ResizeGroupFoundation(adapter);\n\nconst contextValue: ResizeContextProps = {\n    direction: props.direction,\n    registerItem,\n    registerHandler,\n    notifyResizeStart: foundation.onResizeStart,\n    getGroupSize,\n};\n\nprovideResizeContext(contextValue);\n\nonMounted(() => {\n    foundation.init();\n    window.addEventListener('resize', foundation.ensureConstraint);\n});\n\nonUnmounted(() => {\n    foundation.destroy();\n    window.removeEventListener('resize', foundation.ensureConstraint);\n});\n\nwatch(\n    () => props.direction,\n    (newDirection) => {\n        foundation.direction = newDirection;\n        contextValue.direction = newDirection;\n    }\n);\n\nconst groupCls = computed(() => {\n    return classNames(props.className, `${cssClasses.PREFIX}-group`);\n});\n\nconst groupStyle = computed<CSSProperties>(() => {\n    return {\n        flexDirection: props.direction === 'vertical' ? 'column' : 'row',\n        ...props.style,\n    };\n});\n</script>\n"],"names":["props","__props","groupRef","ref","state","reactive","itemRefs","itemMinMap","itemMaxMap","itemDefaultSizeList","itemResizeStart","itemResizing","itemResizeEnd","handlerRefs","getDataAttr","propsData","dataAttrs","key","restProps","computed","omitKeys","rest","registerItem","min","max","defaultSize","onResizeStart","onChange","onResizeEnd","r","index","registerHandler","getGroupSize","adapter","states","id","callback","type","window","_b","_a","foundation","ResizeGroupFoundation","contextValue","provideResizeContext","onMounted","onUnmounted","watch","newDirection","groupCls","classNames","cssClasses","groupStyle","_openBlock","_createElementBlock","_mergeProps","_normalizeStyle","_normalizeClass","_unref","_renderSlot","_ctx"],"mappings":"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"}

package/lib/es/components/resizable/group/ResizeHandler.vue.js

@@ -0,0 +1,83 @@
+import { defineComponent as v, ref as h, onMounted as g, onUnmounted as y, computed as z, createElementBlock as C, openBlock as E, normalizeStyle as d, normalizeClass as R, renderSlot as S, createVNode as _, unref as c } from "vue";
+import H from "classnames";
+import { cssClasses as u } from "@douyinfe/semi-foundation/resizable/constants";
+import { ResizeHandlerFoundation as P } from "@douyinfe/semi-foundation/resizable/foundation";
+import { useResizeContext as w } from "./resizeContext.js";
+import x from "../../icons/icons/IconHandle.js";
+const M = /* @__PURE__ */ v({
+  name: "SemiResizeHandler",
+  __name: "ResizeHandler",
+  props: {
+    className: {},
+    disabled: { type: Boolean, default: !1 },
+    style: {}
+  },
+  setup(m) {
+    const s = m, t = h(), e = w();
+    let n = -1;
+    const r = (o) => {
+      e && n !== -1 && e.notifyResizeStart(n, o, "mouse");
+    }, a = (o) => {
+      e && n !== -1 && e.notifyResizeStart(n, o.targetTouches[0], "touch");
+    }, f = {
+      getProp: (o) => s[o],
+      getProps: () => s,
+      getState: () => ({}),
+      getStates: () => ({}),
+      setState: () => {
+      },
+      getContext: () => {
+      },
+      getContexts: () => {
+      },
+      getCache: () => {
+      },
+      getCaches: () => {
+      },
+      setCache: () => {
+      },
+      stopPropagation: () => {
+      },
+      persistEvent: () => {
+      },
+      registerEvents: () => {
+        t.value && (t.value.addEventListener("mousedown", r), t.value.addEventListener("touchstart", a));
+      },
+      unregisterEvents: () => {
+        t.value && (t.value.removeEventListener("mousedown", r), t.value.removeEventListener("touchstart", a));
+      }
+    }, i = new P(f);
+    g(() => {
+      i.init(), e && n === -1 && (n = e.registerHandler(t));
+    }), y(() => {
+      i.destroy();
+    });
+    const p = z(() => H(
+      s.className,
+      `${u.PREFIX}-handler`,
+      `${u.PREFIX}-handler-${(e == null ? void 0 : e.direction) || "horizontal"}`
+    ));
+    return (o, I) => (E(), C("div", {
+      ref_key: "handlerRef",
+      ref: t,
+      class: R(p.value),
+      style: d(s.style)
+    }, [
+      S(o.$slots, "default", {}, () => {
+        var l;
+        return [
+          _(c(x), {
+            size: "inherit",
+            style: d({
+              rotate: ((l = c(e)) == null ? void 0 : l.direction) === "horizontal" ? "0deg" : "90deg"
+            })
+          }, null, 8, ["style"])
+        ];
+      })
+    ], 6));
+  }
+});
+export {
+  M as default
+};
+//# sourceMappingURL=ResizeHandler.vue.js.map

package/lib/es/components/resizable/group/ResizeHandler.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResizeHandler.vue.js","sources":["../../../../../src/components/resizable/group/ResizeHandler.vue"],"sourcesContent":["<template>\n    <div ref=\"handlerRef\" :class=\"handlerCls\" :style=\"props.style\">\n        <slot>\n            <IconHandle\n                :size=\"'inherit'\"\n                :style=\"{\n                    rotate: context?.direction === 'horizontal' ? '0deg' : '90deg',\n                }\"\n            />\n        </slot>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onMounted, onUnmounted } from 'vue';\nimport type { Ref } from 'vue';\nimport type { CSSProperties } from 'vue';\nimport classNames from 'classnames';\nimport { cssClasses } from '@douyinfe/semi-foundation/resizable/constants';\nimport { ResizeHandlerFoundation, type ResizeHandlerAdapter } from '@douyinfe/semi-foundation/resizable/foundation';\nimport { useResizeContext } from './resizeContext';\nimport { IconHandle } from '../../icons';\n\ndefineOptions({\n    name: 'SemiResizeHandler',\n});\n\ninterface ResizeHandlerProps {\n    className?: string;\n    disabled?: boolean;\n    style?: CSSProperties;\n}\n\nconst props = withDefaults(defineProps<ResizeHandlerProps>(), {\n    disabled: false,\n});\n\nconst handlerRef = ref<HTMLDivElement>();\nconst context = useResizeContext();\nlet handlerIndex = -1;\n\nconst onMouseDown = (e: MouseEvent) => {\n    if (context && handlerIndex !== -1) {\n        context.notifyResizeStart(handlerIndex, e, 'mouse');\n    }\n};\n\nconst onTouchStart = (e: TouchEvent) => {\n    if (context && handlerIndex !== -1) {\n        context.notifyResizeStart(handlerIndex, e.targetTouches[0], 'touch');\n    }\n};\n\nconst adapter: ResizeHandlerAdapter<ResizeHandlerProps, any> = {\n    getProp: (key: string) => (props as Record<string, unknown>)[key],\n    getProps: () => props,\n    getState: () => ({}),\n    getStates: () => ({}),\n    setState: () => {},\n    getContext: () => undefined,\n    getContexts: () => undefined,\n    getCache: () => undefined,\n    getCaches: () => undefined,\n    setCache: () => {},\n    stopPropagation: () => {},\n    persistEvent: () => {},\n    registerEvents: () => {\n        if (handlerRef.value) {\n            handlerRef.value.addEventListener('mousedown', onMouseDown);\n            handlerRef.value.addEventListener('touchstart', onTouchStart);\n        }\n    },\n    unregisterEvents: () => {\n        if (handlerRef.value) {\n            handlerRef.value.removeEventListener('mousedown', onMouseDown);\n            handlerRef.value.removeEventListener('touchstart', onTouchStart);\n        }\n    },\n};\n\nconst foundation: ResizeHandlerFoundation<ResizeHandlerProps, any> = new ResizeHandlerFoundation(adapter);\n\nonMounted(() => {\n    foundation.init();\n    if (context && handlerIndex === -1) {\n        handlerIndex = context.registerHandler(handlerRef as Ref<HTMLDivElement | undefined>);\n    }\n});\n\nonUnmounted(() => {\n    foundation.destroy();\n});\n\nconst handlerCls = computed(() => {\n    return classNames(\n        props.className,\n        `${cssClasses.PREFIX}-handler`,\n        `${cssClasses.PREFIX}-handler-${context?.direction || 'horizontal'}`\n    );\n});\n</script>\n"],"names":["props","__props","handlerRef","ref","context","useResizeContext","handlerIndex","onMouseDown","e","onTouchStart","adapter","key","foundation","ResizeHandlerFoundation","onMounted","onUnmounted","handlerCls","computed","classNames","cssClasses","_createElementBlock","_normalizeStyle","_renderSlot","_ctx","_createVNode","_unref","IconHandle"],"mappings":";;;;;;;;;;;;;;;AAiCA,UAAMA,IAAQC,GAIRC,IAAaC,EAAA,GACbC,IAAUC,EAAA;AAChB,QAAIC,IAAe;AAEnB,UAAMC,IAAc,CAACC,MAAkB;AACnC,MAAIJ,KAAWE,MAAiB,MAC5BF,EAAQ,kBAAkBE,GAAcE,GAAG,OAAO;AAAA,IAE1D,GAEMC,IAAe,CAACD,MAAkB;AACpC,MAAIJ,KAAWE,MAAiB,MAC5BF,EAAQ,kBAAkBE,GAAcE,EAAE,cAAc,CAAC,GAAG,OAAO;AAAA,IAE3E,GAEME,IAAyD;AAAA,MAC3D,SAAS,CAACC,MAAiBX,EAAkCW,CAAG;AAAA,MAChE,UAAU,MAAMX;AAAA,MAChB,UAAU,OAAO,CAAA;AAAA,MACjB,WAAW,OAAO,CAAA;AAAA,MAClB,UAAU,MAAM;AAAA,MAAC;AAAA,MACjB,YAAY,MAAA;AAAA;AAAA,MACZ,aAAa,MAAA;AAAA;AAAA,MACb,UAAU,MAAA;AAAA;AAAA,MACV,WAAW,MAAA;AAAA;AAAA,MACX,UAAU,MAAM;AAAA,MAAC;AAAA,MACjB,iBAAiB,MAAM;AAAA,MAAC;AAAA,MACxB,cAAc,MAAM;AAAA,MAAC;AAAA,MACrB,gBAAgB,MAAM;AAClB,QAAIE,EAAW,UACXA,EAAW,MAAM,iBAAiB,aAAaK,CAAW,GAC1DL,EAAW,MAAM,iBAAiB,cAAcO,CAAY;AAAA,MAEpE;AAAA,MACA,kBAAkB,MAAM;AACpB,QAAIP,EAAW,UACXA,EAAW,MAAM,oBAAoB,aAAaK,CAAW,GAC7DL,EAAW,MAAM,oBAAoB,cAAcO,CAAY;AAAA,MAEvE;AAAA,IAAA,GAGEG,IAA+D,IAAIC,EAAwBH,CAAO;AAExG,IAAAI,EAAU,MAAM;AACZ,MAAAF,EAAW,KAAA,GACPR,KAAWE,MAAiB,OAC5BA,IAAeF,EAAQ,gBAAgBF,CAA6C;AAAA,IAE5F,CAAC,GAEDa,EAAY,MAAM;AACd,MAAAH,EAAW,QAAA;AAAA,IACf,CAAC;AAED,UAAMI,IAAaC,EAAS,MACjBC;AAAA,MACHlB,EAAM;AAAA,MACN,GAAGmB,EAAW,MAAM;AAAA,MACpB,GAAGA,EAAW,MAAM,aAAYf,KAAA,gBAAAA,EAAS,cAAa,YAAY;AAAA,IAAA,CAEzE;2BAlGGgB,EASM,OAAA;AAAA,eATG;AAAA,MAAJ,KAAIlB;AAAA,MAAc,SAAOc,EAAA,KAAU;AAAA,MAAG,OAAKK,EAAErB,EAAM,KAAK;AAAA,IAAA;MACzDsB,EAOOC,yBAPP,MAAA;;AAOO;AAAA,UANHC,EAKEC,EAAAC,CAAA,GAAA;AAAA,YAJG,MAAM;AAAA,YACN,OAAKL,EAAA;AAAA,cAAgC,UAAAI,IAAAA,EAAArB,CAAA,MAAAqB,gBAAAA,EAAS,eAAS,eAAA,SAAA;AAAA,YAAA;;;;;;;"}