@toolmain/components 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2025-present - toolmain
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/index.d.ts

@@ -0,0 +1,230 @@
+import { ComponentOptionsMixin } from 'vue';
+import { ComponentProvideOptions } from 'vue';
+import { CSSProperties } from '@toolmain/shared';
+import { DefineComponent } from 'vue';
+import { FixedArray } from '@toolmain/shared';
+import type { MaybeRef } from 'vue';
+import { PublicProps } from 'vue';
+
+declare const __VLS_component: DefineComponent<__VLS_Props, {
+update: () => void;
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+
+declare const __VLS_component_2: DefineComponent<ScaleProps, ScaleInstance, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+moving: (pos: MoveParams) => any;
+scaling: (scaleEl: HTMLElement) => any;
+beforeMove: (pos: MoveParams) => any;
+afterMove: (pos: MoveParams) => any;
+afterScale: (scaleEl: HTMLElement) => any;
+maskClick: () => any;
+"update:modelValue": (data: ScaleConfig) => any;
+}, string, PublicProps, Readonly<ScaleProps> & Readonly<{
+onMoving?: ((pos: MoveParams) => any) | undefined;
+onScaling?: ((scaleEl: HTMLElement) => any) | undefined;
+onBeforeMove?: ((pos: MoveParams) => any) | undefined;
+onAfterMove?: ((pos: MoveParams) => any) | undefined;
+onAfterScale?: ((scaleEl: HTMLElement) => any) | undefined;
+onMaskClick?: (() => any) | undefined;
+"onUpdate:modelValue"?: ((data: ScaleConfig) => any) | undefined;
+}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+
+declare type __VLS_Props = {
+    /**
+     * 选择top时,如果元素滚动到[底部]消失或即将消失，会回到原位置
+     *
+     * 选择bottom时则是滚动到[顶部]时触发
+     */
+    position?: "top" | "bottom";
+    target?: string;
+    offset?: number;
+};
+
+declare type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+
+declare type __VLS_Slots_2 = {} & {
+    header?: (props: typeof __VLS_1) => any;
+} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+
+declare type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithSlots_2<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+export declare const Affix: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+
+declare type AnimateDir = "left" | "top" | "bottom" | "right" | "self" | "center" | {
+    x?: number;
+    y?: number;
+};
+
+declare type Dir = "horizontal" | "vertical" | "any";
+
+declare interface DragAttr {
+    /**
+     * 元素x轴坐标
+     */
+    x: number;
+    /**
+     * 元素y轴坐标
+     */
+    y: number;
+    /**
+     * 指针x坐标
+     */
+    clientX: number;
+    /**
+     * 指针y坐标
+     */
+    clientY: number;
+    width: number | InitType;
+    height: number | InitType;
+}
+
+declare type InitType = "auto" | "inherit" | "initial" | "unset";
+
+declare interface MoveHook {
+    x?: (oldVal: number, newVal: number, width: number, height: number) => number;
+    y?: (oldVal: number, newVal: number, width: number, height: number) => number;
+    scale?: (oldVal: FixedArray<number, 2>, newVal: FixedArray<number, 2>) => [FixedArray<number, 2>, FixedArray<number, 2>];
+}
+
+declare interface MoveOptions {
+    /**
+     * 移动方向
+     */
+    direction?: Dir;
+}
+
+declare type MoveParams = DragAttr & {
+    translateX: number;
+    translateY: number;
+};
+
+declare interface ScaleConfig {
+    /**
+     * 组件可改变尺寸
+     */
+    scalable?: boolean;
+    /**
+     * 组件可移动
+     */
+    movable?: boolean;
+    /**
+     * 变成正常元素
+     */
+    normal?: boolean;
+    /**
+     * 拖动后自动靠边
+     */
+    autoStick?: boolean | AnimateDir;
+    /**
+     * 是否显示
+     */
+    visible?: boolean;
+    /**
+     * 初始移动位置 `translateX`
+     */
+    x?: number;
+    /**
+     * 初始移动位置 `translateY`
+     */
+    y?: number;
+    /**
+     * 是否拥有头部
+     */
+    header?: boolean;
+    /**
+     * 当组件`position`不为`fixed`时
+     * 是否相对于window定位,否则相对于父元素定位
+     *
+     * @default false
+     */
+    attachWindow?: boolean;
+    /**
+     * 移动功能的配置项
+     */
+    moveConfig?: MoveOptions;
+    /**
+     * 外壳样式
+     */
+    containerStyle?: CSSProperties;
+    /**
+     * 内容样式，初始宽高应该在这里设置
+     */
+    contentStyle?: CSSProperties;
+    /**
+     * 头部样式
+     */
+    headerStyle?: CSSProperties;
+    /**
+     * 是否显示遮罩层
+     */
+    mask?: boolean;
+    /**
+     * 遮罩层样式
+     */
+    maskStyle?: CSSProperties;
+}
+
+declare interface ScaleInstance {
+    /**
+     * 智能移动到屏幕边界
+     * @param animate - 是否有动画效果 default: true
+     */
+    autoStick: (animate: boolean) => Promise<void>;
+    /**
+     * 自动隐藏
+     * @param animate - 是否有动画效果 default: true
+     */
+    autoHide: (animate: boolean) => Promise<void>;
+    /**
+     * 移动到屏幕边界
+     * @param animate - 是否有动画效果 default: true
+     */
+    stickTo: (dir: AnimateDir, animate: boolean) => Promise<void>;
+    /**
+     * 移动到屏幕 `dir`位置并隐藏
+     * @param animate - 是否有动画效果 default: true
+     */
+    hideTo: (dir: AnimateDir, animate: boolean) => Promise<void>;
+    /**
+     * 显示组件
+     */
+    show: (animate: boolean, dir?: AnimateDir) => Promise<void>;
+    /**
+     * 当组件`position:fixed`或者`attachWindow:true`时坐标相对于屏幕左上角;否则相对于父元素
+     */
+    moveTo: (animate: boolean, dir: AnimateDir, hooks?: MoveHook) => Promise<void>;
+    /**
+     * 获取当前状态
+     */
+    getStatus: () => Status | undefined;
+}
+
+export declare const ScalePanel: __VLS_WithSlots_2<typeof __VLS_component_2, __VLS_Slots_2>;
+
+declare interface ScaleProps {
+    modelValue: ScaleConfig;
+    /**
+     * 按下目标元素并拖动组件，默认按下头部拖动。
+     */
+    dragTarget?: MaybeRef<HTMLElement | null | undefined>;
+}
+
+declare enum Status {
+    NORMAL = "NORMAL",
+    HIDDEN = "HIDDEN"
+}
+
+export { }

package/dist/index.js

@@ -0,0 +1,880 @@
+(function(){"use strict";try{if(typeof document<"u"){var r=document.createElement("style");r.appendChild(document.createTextNode('*,:before,:after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}[top~="0"]{top:0}.hidden{display:none}.flex{display:flex}.flex-shrink{flex-shrink:1}.transform{transform:translate(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotate(var(--un-rotate-z)) skew(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z))}.resize,[resize=""]{resize:both}.px,[px=""]{padding-left:1rem;padding-right:1rem}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.comp-affix .comp-affix-inner[data-v-4c40ccd8]{transition:box-shadow .3s;border-radius:1rem}.comp-affix .comp-affix-inner.fix[data-v-4c40ccd8]{position:fixed;box-shadow:var(--el-box-shadow);background-color:var(--el-card-bg-color)}.p-t[data-v-cb7f9cc6],.p-r[data-v-cb7f9cc6],.p-b[data-v-cb7f9cc6],.p-l[data-v-cb7f9cc6],.p-lt[data-v-cb7f9cc6],.p-rt[data-v-cb7f9cc6],.p-lb[data-v-cb7f9cc6],.p-rb[data-v-cb7f9cc6]{z-index:var(--61c40759);position:absolute}.p-b[data-v-cb7f9cc6],.p-t[data-v-cb7f9cc6],.p-r[data-v-cb7f9cc6],.p-l[data-v-cb7f9cc6]{background-color:transparent;border-radius:4px}.p-b[data-v-cb7f9cc6],.p-t[data-v-cb7f9cc6]{height:4px;left:4px;right:4px}.p-r[data-v-cb7f9cc6],.p-l[data-v-cb7f9cc6]{width:4px;top:4px;bottom:4px}.p-lt[data-v-cb7f9cc6],.p-rt[data-v-cb7f9cc6],.p-lb[data-v-cb7f9cc6],.p-rb[data-v-cb7f9cc6]{width:0;height:0}.p-b[data-v-cb7f9cc6]{bottom:0;cursor:ns-resize}.p-t[data-v-cb7f9cc6]{top:0;cursor:ns-resize}.p-r[data-v-cb7f9cc6]{right:0;cursor:ew-resize}.p-l[data-v-cb7f9cc6]{left:0;cursor:ew-resize}.p-lt[data-v-cb7f9cc6]{left:0;top:0;cursor:nwse-resize;border-top:.4rem solid transparent;border-left:.4rem solid transparent;border-right:.4rem solid transparent;border-bottom:.4rem solid transparent}.p-rt[data-v-cb7f9cc6]{right:0;top:0;cursor:nesw-resize;border-top:.4rem solid transparent;border-left:.4rem solid transparent;border-right:.4rem solid transparent;border-bottom:.4rem solid transparent}.p-lb[data-v-cb7f9cc6]{left:0;bottom:0;cursor:nesw-resize;border-top:.4rem solid transparent;border-left:.4rem solid transparent;border-right:.4rem solid transparent;border-bottom:.4rem solid transparent}.p-rb[data-v-cb7f9cc6]{right:0;bottom:0;cursor:nwse-resize;border-top:.4rem solid transparent;border-left:.4rem solid transparent;border-right:.4rem solid transparent;border-bottom:.4rem solid transparent}.dragContainer[data-v-d123b73c]{display:flex;flex-direction:column;transform-origin:0 0}.dragContainer>.dragHeader[data-v-d123b73c]{flex-shrink:0;display:flex}.dragContainer>.scaleContent[data-v-d123b73c]{flex:1;overflow:hidden;position:relative;display:flex}.dragMask[data-v-d123b73c]{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:100}')),document.head.appendChild(r)}}catch(a){console.error("vite-plugin-css-injected-by-js",a)}})();
+import { defineComponent as be, useTemplateRef as te, shallowRef as ee, computed as $, reactive as Ae, onMounted as De, onBeforeUnmount as Me, createElementBlock as Q, openBlock as j, normalizeStyle as J, normalizeClass as pe, createElementVNode as Oe, renderSlot as we, useCssVars as ze, createCommentVNode as re, Fragment as Be, renderList as $e, withDirectives as Ve, vShow as We, unref as Pe, ref as Te, toValue as ye, watch as q, toRef as oe, createBlock as Ce, Teleport as Ue } from "vue";
+import { px as X, z as je, getStyleValue as Se, isBoolean as ke, isNumber as G, toNumber as w, merge as Ge } from "@toolmain/shared";
+import { useElementBounding as le, useIntersectionObserver as _e, useThrottleFn as Ke, useDebounceFn as qe } from "@vueuse/core";
+import { useEvent as ue, useFlip as Je } from "@toolmain/libs";
+const ae = 2, Qe = /* @__PURE__ */ be({
+  __name: "index",
+  props: {
+    position: { default: "top" },
+    target: { default: "" },
+    offset: { default: 0 }
+  },
+  setup(e, { expose: l }) {
+    const c = te("affix"), s = te("affixInner"), h = ee(), d = ee(), { width: i, height: R } = le(h), T = $(() => !!d.value), y = ee({}), S = ee({}), a = Ae({
+      disableTeleport: !0,
+      target: {
+        isIntersecting: !1,
+        intersectionRatio: 0,
+        directions: []
+      },
+      affix: {
+        isIntersecting: !1,
+        intersectionRatio: 0,
+        needFloat: !1,
+        directions: []
+      }
+    }), {
+      x,
+      y: n,
+      // width: affixWidth,
+      height: L,
+      update: A
+    } = le(c), m = () => {
+      if (T.value) {
+        if (a.target.isIntersecting && (!a.affix.isIntersecting || a.affix.intersectionRatio < 0.5))
+          return !0;
+      } else if (!a.affix.isIntersecting || a.affix.intersectionRatio < 0.5)
+        return !0;
+      return !1;
+    }, g = () => {
+      if (A(), a.affix.needFloat = !1, a.affix.directions.includes(
+        "left"
+        /* Left */
+      ) || a.affix.directions.includes(
+        "right"
+        /* Right */
+      ) || a.target.directions.includes(
+        "left"
+        /* Left */
+      ) || a.target.directions.includes(
+        "right"
+        /* Right */
+      ))
+        a.affix.needFloat = !1;
+      else if (m()) {
+        const C = n.value + L.value / 2 <= window.innerHeight / 2;
+        a.affix.needFloat = e.position === "top" ? C : !C;
+      }
+      a.affix.needFloat ? (y.value = {
+        zIndex: 100,
+        left: X(x.value),
+        [e.position === "bottom" ? "bottom" : "top"]: X(e.offset)
+      }, S.value = {
+        minWidth: X(i.value),
+        height: X(R.value)
+      }) : (y.value = {}, S.value = {});
+    };
+    function P(C, F) {
+      const { boundingClientRect: z, intersectionRect: V, rootBounds: Z } = C;
+      Z && C.isIntersecting && (F.length = 0, V.y - z.y > ae && F.push(
+        "top"
+        /* Top */
+      ), z.y - V.y > ae && F.push(
+        "bottom"
+        /* Bottom */
+      ), V.x - z.x > ae && F.push(
+        "left"
+        /* Left */
+      ), z.x + z.width - (V.x + V.width) > ae && F.push(
+        "right"
+        /* Right */
+      ));
+    }
+    const N = ([C]) => {
+      a.affix.isIntersecting = C.isIntersecting, P(C, a.affix.directions), a.affix.intersectionRatio = C.intersectionRatio, g();
+    }, H = ([C]) => {
+      a.target.isIntersecting = C.isIntersecting, P(C, a.target.directions), a.target.intersectionRatio = C.intersectionRatio, g();
+    }, o = _e(c, N, {
+      root: window.document.documentElement,
+      threshold: [0, 0.01, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 0.99, 1]
+    }), u = _e(d, H, {
+      root: window.document.documentElement,
+      threshold: [0, 0.01, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 0.99, 1]
+    });
+    function I() {
+      h.value = s.value?.firstElementChild, e.target && (d.value = document.querySelector(e.target)), A();
+    }
+    const D = Ke(g, 250, !0);
+    return De(() => {
+      I(), window.addEventListener("resize", D);
+    }), Me(() => {
+      window.removeEventListener("resize", D), o.stop(), u.stop();
+    }), l({
+      update: () => {
+        m() && g();
+      }
+    }), (C, F) => (j(), Q("div", {
+      class: pe(["comp-affix", { fix: a.affix.needFloat }]),
+      style: J(S.value),
+      ref: "affix"
+    }, [
+      Oe("div", {
+        ref_key: "affixInner",
+        ref: s,
+        style: J([y.value, S.value]),
+        class: pe(["comp-affix-inner", { fix: a.affix.needFloat }])
+      }, [
+        we(C.$slots, "default", {}, void 0, !0)
+      ], 6)
+    ], 6));
+  }
+}), Ee = (e, l) => {
+  const c = e.__vccOpts || e;
+  for (const [s, h] of l)
+    c[s] = h;
+  return c;
+}, vt = /* @__PURE__ */ Ee(Qe, [["__scopeId", "data-v-4c40ccd8"]]);
+function Re() {
+  return {
+    x: 0,
+    y: 0,
+    clientX: 0,
+    clientY: 0,
+    width: 0,
+    height: 0
+  };
+}
+function Le() {
+  return {
+    x: 0,
+    y: 0,
+    width: 0,
+    height: 0,
+    left: 0,
+    top: 0,
+    right: 0,
+    bottom: 0
+  };
+}
+const Ze = () => {
+  let e, l = Le(), c = Re(), s = !1, h = !1;
+  const d = ue(), i = {
+    emit: (n, ...L) => {
+      s || d.emit(n, ...L);
+    },
+    setTargetAttr: (n) => {
+      R(), T({
+        x: l.x,
+        y: l.y,
+        clientX: n.clientX,
+        clientY: n.clientY,
+        width: l.width,
+        height: l.height
+      });
+    },
+    onSelectStart: (n) => h ? (n.preventDefault(), !1) : !0,
+    onDomPointerUp: (n) => {
+      if (!s) {
+        if (!e) {
+          h = !1;
+          return;
+        }
+        h && i.emit("aftermove", { ...c }), h = !1;
+      }
+    },
+    onDomPointerMove: (n) => {
+      s || h && (i.setTargetAttr(n), i.emit("moving", { ...c }));
+    },
+    onElePointerDown: (n) => {
+      s || (h = !0, i.setTargetAttr(n), i.emit("beforemove", { ...c }));
+    },
+    clearEvent: () => {
+      document.removeEventListener("selectstart", i.onSelectStart), e?.removeEventListener("pointerdown", i.onElePointerDown), document.removeEventListener("pointerup", i.onDomPointerUp), document.removeEventListener("pointermove", i.onDomPointerMove);
+    },
+    listenEvent: () => {
+      e && (document.addEventListener("selectstart", i.onSelectStart), e.addEventListener("pointerdown", i.onElePointerDown), document.addEventListener("pointerup", i.onDomPointerUp), document.addEventListener("pointermove", i.onDomPointerMove));
+    }
+  };
+  function R() {
+    l = e?.getBoundingClientRect() ?? Le();
+  }
+  function T(n) {
+    c = { ...n };
+  }
+  function y(n) {
+    i.clearEvent(), e = n, d.removeAllListeners(), T(Re()), R(), i.listenEvent();
+  }
+  function S(n, L) {
+    d.on(n, L);
+  }
+  function a() {
+    s = !0;
+  }
+  function x() {
+    s = !1;
+  }
+  return {
+    ele: e,
+    rect: l,
+    attr: c,
+    updateRect: R,
+    setAttr: T,
+    setTarget: y,
+    on: S,
+    disable: a,
+    enable: x
+  };
+};
+function et() {
+  const e = ue();
+  let l = !1;
+  const c = {
+    direction: "any"
+  }, s = Ze(), h = (m) => {
+    c.direction === "horizontal" ? (m.clientY = 0, m.y = 0) : c.direction === "vertical" && (m.clientX = 0, m.x = 0);
+  };
+  function d(m) {
+    l = !1, s.setTarget(m), s.on("beforemove", (g) => {
+      h(g), l = !1, R("beforemove", g);
+    }), s.on("moving", (g) => {
+      h(g), l = !0, R("moving", g);
+    }), s.on("aftermove", (g) => {
+      h(g), l = !1, R("aftermove", g);
+    });
+  }
+  function i() {
+    return s.ele;
+  }
+  function R(m, g) {
+    e.emit(m, g);
+  }
+  function T(m) {
+    c.direction = m;
+  }
+  function y(m, g) {
+    e.on(m, g);
+  }
+  function S(m, g) {
+    e.once(m, g);
+  }
+  function a(m, g) {
+    e.removeAllListeners(m), e.on(m, g);
+  }
+  function x(m) {
+    m && Object.assign(c, m);
+  }
+  function n() {
+    s.enable();
+  }
+  function L() {
+    s.disable();
+  }
+  function A() {
+    return l;
+  }
+  return {
+    every: a,
+    setTarget: d,
+    getTarget: i,
+    setDirection: T,
+    isMoving: A,
+    on: y,
+    once: S,
+    updateOption: x,
+    enable: n,
+    disable: L
+  };
+}
+const tt = ["onMousedown"], nt = /* @__PURE__ */ be({
+  __name: "resize",
+  props: {
+    config: {},
+    scale: {},
+    handle: {},
+    move: {}
+  },
+  setup(e) {
+    ze((s) => ({
+      "61c40759": c.value
+    }));
+    const l = e, c = $(() => l.config.normal ? void 0 : je.ABSOLUTE);
+    return (s, h) => s.scale ? (j(!0), Q(Be, { key: 0 }, $e(s.scale.pointer, (d) => Ve((j(), Q("i", {
+      key: d,
+      class: pe([`p-${d}`]),
+      onMousedown: (i) => s.scale.onMouseDown(i, d)
+    }, null, 42, tt)), [
+      [We, s.config.scalable]
+    ])), 128)) : re("", !0);
+  }
+}), at = /* @__PURE__ */ Ee(nt, [["__scopeId", "data-v-cb7f9cc6"]]), ie = (e) => {
+  if (!e) return {};
+  const l = {};
+  for (const [c, s] of Object.entries(e))
+    l[c] = Se(c, s);
+  return l;
+};
+function Xe(e) {
+  function l() {
+    return {
+      scaleX: e.scale[0],
+      scaleY: e.scale[1]
+    };
+  }
+  function c() {
+    return {
+      translateX: e.translateX,
+      translateY: e.translateY
+    };
+  }
+  function s(a, x, n) {
+    e.translateX = n ? e.translateX + a : a, e.translateY = n ? e.translateY + x : x;
+  }
+  function h(a, x) {
+    e.prevClientX = a, e.prevClientY = x;
+  }
+  function d(a, x) {
+    e.prevTranslateX = a, e.prevTranslateY = x;
+  }
+  function i() {
+    return {
+      clientX: e.prevClientX,
+      clientY: e.prevClientY
+    };
+  }
+  function R() {
+    return {
+      translateX: e.prevTranslateX,
+      translateY: e.prevTranslateY
+    };
+  }
+  function T(a, x) {
+    e.scale = [a, x];
+  }
+  function y() {
+    e.scale = [1, 1], e.prevClientX = 0, e.prevTranslateX = 0, e.prevClientY = 0, e.prevTranslateY = 0, e.translateX = 0, e.translateY = 0;
+  }
+  function S(a) {
+    Object.assign(e, a);
+  }
+  return {
+    setData: S,
+    getTranslate: c,
+    setTranslate: s,
+    getScale: l,
+    setScale: T,
+    setNormal: y,
+    setPrevClientPos: h,
+    getPrevClientPos: i,
+    getPrevTranslate: R,
+    setPrevTranslate: d
+  };
+}
+function Ye(e) {
+  function l(h, d) {
+    e.value && (e.value[h] = d);
+  }
+  function c(h) {
+    for (const [d, i] of Object.entries(h))
+      l(d, i);
+  }
+  function s(h) {
+    if (e.value)
+      return e.value[h];
+  }
+  return {
+    get: s,
+    set: l,
+    sets: c
+  };
+}
+function it(e, l, c, s, h, d, i) {
+  const { setNormal: R, setTranslate: T, setPrevTranslate: y } = Xe(s), { get: S, set: a } = Ye(h), x = Te(ye(S("position"))), n = qe(
+    async () => {
+      e.value.autoStick && (typeof e.value.autoStick == "boolean" ? await c.value?.autoStick(!0) : await c.value?.stickTo(e.value.autoStick, !0));
+    },
+    200,
+    { maxWait: 1e3 }
+  );
+  function L() {
+    l.value && l.value.setTarget(ye(d) ?? i.value ?? null);
+  }
+  function A() {
+    c.value?.setStatus(He.NORMAL), g(e.value.movable), N(e.value.moveConfig), H(e.value.x, e.value.y), P(e.value.normal), ke(e.value.visible) ? m(e.value.visible, !1) : c.value?.hideTo("self", !1);
+  }
+  function m(o, u) {
+    if (!ke(o)) return;
+    const I = G(e.value.x) || G(e.value.y);
+    o ? c.value?.show(u, I ? { x: e.value.x, y: e.value.y } : "self") : c.value?.hideTo(I ? { x: e.value.x, y: e.value.y } : "self", u);
+  }
+  function g(o) {
+    o ? l.value?.enable() : l.value?.disable();
+  }
+  function P(o) {
+    o ? (l.value?.setTarget(), x.value = S("position"), e.value.movable = !1, e.value.scalable = !1, R(), a("position", "static")) : (L(), a("position", x.value));
+  }
+  function N(o) {
+    o && l.value?.updateOption(o);
+  }
+  function H(o, u) {
+    if (!l.value?.isMoving() && (G(e.value.x) || G(e.value.y))) {
+      const I = w(o), D = w(u);
+      T(I, D), y(I, D);
+    }
+  }
+  return q(() => e.value.movable, g), q(() => e.value.normal, P), q(() => e.value.moveConfig, N, { deep: !0 }), q(
+    () => e.value.visible,
+    (o) => m(o, !0)
+  ), q([() => e.value.x, () => e.value.y], ([o, u]) => H(o, u)), q(d, () => {
+    e.value.normal || L();
+  }), {
+    autoStick: n,
+    onInit: A,
+    onMovableChange: g,
+    onNormalChange: P
+  };
+}
+function Ie(e, l) {
+  const c = Pe(e);
+  return c ? window.getComputedStyle(c).getPropertyValue(l) : Se(l, void 0);
+}
+var He = /* @__PURE__ */ ((e) => (e.NORMAL = "NORMAL", e.HIDDEN = "HIDDEN", e))(He || {}), se = /* @__PURE__ */ ((e) => (e.AFTER_SHOW = "after_show", e.AFTER_HIDE = "after_hide", e.AFTER_STICK = "after_stick", e))(se || {});
+const rt = (e) => {
+  const { getTranslate: l, setTranslate: c, setScale: s, setPrevTranslate: h, getScale: d } = Xe(e.dragOffset);
+  let i = e.parent;
+  const R = Je(), T = ue(), y = Te(
+    "NORMAL"
+    /* NORMAL */
+  ), S = {
+    stick: 160
+  }, a = {
+    transX: { old: 0, final: 0 },
+    transY: { old: 0, final: 0 }
+  }, x = [], n = [];
+  function L() {
+    const { translateX: t, translateY: f } = l();
+    a.transX.old = t, a.transX.final = t, a.transY.old = f, a.transY.final = f;
+  }
+  const { x: A, y: m, width: g, left: P } = le(e.targetEle);
+  function N(t, f) {
+    const r = {
+      width: window.innerWidth,
+      height: window.innerHeight
+    };
+    if (!e.targetEle.value || t.position === "fixed")
+      return r;
+    {
+      if (f) return r;
+      const Y = ne();
+      return r.width = Y.offsetWidth, r.height = Y.offsetHeight, r;
+    }
+  }
+  function H(t, f, r, v, Y) {
+    return () => {
+      s(Y[0], Y[1]), c(t, f), h(t, f);
+    };
+  }
+  function o(t, f) {
+    const r = { x: 0, y: 0, w: 0, h: 0 };
+    if (!e.targetEle.value) return r;
+    const v = Ge(
+      {
+        x: (W, U, Fe, Ne) => U,
+        y: (W, U, Fe, Ne) => U,
+        scale: (W, U) => [W, U]
+      },
+      f
+    ), Y = !!e.config.value.attachWindow, k = window.getComputedStyle(e.targetEle.value), B = N(k, Y);
+    let M = 0, O = 0;
+    const p = w(k.width), b = w(k.height);
+    r.w = p, r.h = b;
+    const { translateX: E, translateY: _ } = l();
+    if (k.position === "fixed" ? (M = w(k.left), O = w(k.top)) : Y ? (M = w(A.value - E), O = w(m.value - _)) : (M = w(k.left), O = w(k.top)), typeof t == "string")
+      switch (t) {
+        case "left": {
+          r.x = v.x(E, -w(M), p, b), r.y = v.y(_, _, p, b);
+          break;
+        }
+        case "top": {
+          r.x = v.x(E, E, p, b), r.y = v.y(_, -w(O), p, b);
+          break;
+        }
+        case "right": {
+          r.x = v.x(E, -w(M) + B.width - p, p, b), r.y = v.y(_, _, p, b);
+          break;
+        }
+        case "bottom": {
+          r.x = v.x(E, E, p, b), r.y = v.y(_, -w(O) + B.height - b, p, b);
+          break;
+        }
+        case "self": {
+          r.x = v.x(E, E, p, b), r.y = v.y(_, _, p, b);
+          break;
+        }
+        case "center":
+        default:
+          r.x = v.x(E, -w(M) + B.width / 2 - p / 2, p, b), r.y = v.y(_, -w(O) + B.height / 2 - b / 2, p, b);
+      }
+    else
+      G(t.x) ? r.x = v.x(E, -w(M) + (t.x ?? E), p, b) : r.x = v.x(E, E, p, b), G(t.y) ? r.y = v.y(_, -w(O) + (t.y ?? _), p, b) : r.y = v.y(_, _, p, b);
+    return r;
+  }
+  async function u(t, f, r, v) {
+    await new Promise((Y) => {
+      if (r(), !f) {
+        Y();
+        return;
+      }
+      R.animate(
+        t,
+        v,
+        { duration: S.stick, iterations: 1 },
+        {
+          finish(k, B) {
+            Y();
+          }
+        }
+      );
+    });
+  }
+  function I() {
+    return w(P.value) + w(g.value) / 2 >= window.innerWidth / 2 ? "right" : "left";
+  }
+  async function D(t = !0, f, r) {
+    if (!e.targetEle.value) return;
+    const { x: v, y: Y, w: k, h: B } = o(f, r), { scaleX: M, scaleY: O } = d(), p = {
+      old: [M, O],
+      final: [M, O]
+    };
+    if (r?.scale) {
+      const U = r.scale(p.old, p.final);
+      p.old = U[0], p.final = U[1];
+    }
+    const b = H(v, Y, k, B, p.final), { translateX: E, translateY: _ } = l(), W = [
+      { scale: p.old, translate: [X(E), X(_)] },
+      { scale: p.final, translate: [X(v), X(Y)] }
+    ];
+    await u(e.targetEle.value, t, b, W);
+  }
+  async function C(t = !0, f) {
+    if (y.value !== "HIDDEN" || !e.targetEle.value) return;
+    const r = [0, 0], v = [1, 1], Y = [
+      { scale: v, translate: [X(a.transX.final), X(a.transY.final)] },
+      { scale: v, translate: [X(a.transX.old), X(a.transY.old)] }
+    ], k = () => {
+      s(v[0], v[1]), c(a.transX.old, a.transY.old), h(a.transX.old, a.transY.old);
+    };
+    f ? await D(t, f, {
+      scale(B, M) {
+        return f === "self" || f === "center" ? [r, v] : [v, v];
+      }
+    }) : await u(e.targetEle.value, t, k, Y), y.value = "NORMAL", T.emit(
+      "after_show"
+      /* AFTER_SHOW */
+    );
+  }
+  async function F(t, f = !0) {
+    if (y.value !== "NORMAL" || !e.targetEle.value) return;
+    for await (const b of x)
+      await b();
+    L();
+    const { x: r, y: v, w: Y, h: k } = o(t, {
+      x: (b, E, _, W) => {
+        switch (t) {
+          case "left":
+            return E -= w(_);
+          case "right":
+            return E += w(_);
+        }
+        return E;
+      },
+      y: (b, E, _, W) => {
+        switch (t) {
+          case "top":
+            return E -= w(W);
+          case "bottom":
+            return E += w(W);
+        }
+        return E;
+      }
+    }), { translateX: B, translateY: M } = l();
+    let O = [
+      { scale: [1, 1], translate: [X(B), X(M)] },
+      { scale: [1, 1], translate: [X(r), X(v)] }
+    ];
+    (t === "self" || t === "center") && (O = [
+      { scale: [1, 1], translate: [X(r), X(v)] },
+      { scale: [0, 0], translate: [X(r), X(v)] }
+    ]), a.transX.final = r, a.transY.final = v;
+    const p = H(r, v, Y, k, [0, 0]);
+    await u(e.targetEle.value, f, p, O), y.value = "HIDDEN", T.emit(
+      "after_hide"
+      /* AFTER_HIDE */
+    );
+  }
+  async function z(t, f = !0) {
+    if (y.value === "NORMAL" && e.targetEle.value) {
+      for await (const r of n)
+        await r();
+      await D(f, t), T.emit(
+        "after_stick"
+        /* AFTER_STICK */
+      );
+    }
+  }
+  async function V(t = !0) {
+    y.value === "NORMAL" && await F(I(), t);
+  }
+  async function Z(t = !0) {
+    y.value === "NORMAL" && await z(I(), t);
+  }
+  function ce(t) {
+    y.value = t;
+  }
+  function K() {
+    return y.value;
+  }
+  function fe() {
+    return e.targetEle.value;
+  }
+  function ve(t, f) {
+    T.on(t, f);
+  }
+  function de(t) {
+    x.push(t);
+  }
+  function he(t) {
+    n.push(t);
+  }
+  function ge(t) {
+    t && (i = t);
+  }
+  function ne() {
+    return i ?? e.targetEle.value?.parentElement ?? document.body;
+  }
+  function me() {
+    T.removeAllListeners(), x.length = 0, n.length = 0;
+  }
+  return {
+    getTarget: fe,
+    setStatus: ce,
+    getStatus: K,
+    show: C,
+    autoHide: V,
+    autoStick: Z,
+    stickTo: z,
+    hideTo: F,
+    moveTo: D,
+    dispose: me,
+    registerBeforeHideHook: de,
+    registerBeforeStickHook: he,
+    on: ve,
+    setTargetParent: ge,
+    getTargetParent: ne
+  };
+};
+var xe = /* @__PURE__ */ ((e) => (e.SCALING = "scaling", e.AFTER_SCALE = "after_scale", e))(xe || {});
+const ot = (e) => {
+  const l = oe(e.config.value, "containerStyle"), { set: c, sets: s } = Ye(l), h = ue(), d = ["t", "r", "b", "l", "lt", "rt", "lb", "rb"];
+  let i = "";
+  const { x: R, y: T, width: y, height: S, update: a } = le(e.targetEle), x = {
+    t: (o, u) => {
+      o.clientY >= n.y + n.height || s({ top: u.t, height: u.h });
+    },
+    r: (o, u) => {
+      c("width", u.w);
+    },
+    b: (o, u) => {
+      c("height", u.h);
+    },
+    l: (o, u) => {
+      o.clientX >= n.x + n.width || s({ left: u.l, width: u.w });
+    },
+    lt: (o, u) => {
+      o.clientX >= n.x + n.width || o.clientY >= n.y + n.height || s({ left: u.l, top: u.t, width: u.w, height: u.h });
+    },
+    rt: (o, u) => {
+      o.clientY >= n.y + n.height || s({ top: u.t, width: u.w, height: u.h });
+    },
+    lb: (o, u) => {
+      o.clientX >= n.x + n.width || s({ left: u.l, width: u.w, height: u.h });
+    },
+    rb: (o, u) => {
+      s({ width: u.w, height: u.h });
+    }
+  }, n = { x: 0, y: 0, clientX: 0, clientY: 0, left: 0, top: 0, width: 0, height: 0 };
+  function L(o) {
+    o.preventDefault();
+  }
+  function A(o) {
+    const u = n.top + o.clientY - n.clientY, I = n.left + o.clientX - n.clientX, D = i.startsWith("r") ? o.clientX - n.x : n.width + n.clientX - o.clientX, C = i.endsWith("t") ? n.height + n.clientY - o.clientY : o.clientY - n.y;
+    x[i](o, {
+      l: I,
+      t: u,
+      w: D,
+      h: C
+    }), h.emit(
+      "scaling"
+      /* SCALING */
+    );
+  }
+  function m() {
+    document.removeEventListener("mouseup", m), document.removeEventListener("mousemove", A), document.removeEventListener("selectstart", L), h.emit(
+      "after_scale"
+      /* AFTER_SCALE */
+    );
+  }
+  function g(o, u) {
+    document.addEventListener("selectstart", L), i = u, o.stopPropagation(), o.preventDefault(), a(), n.x = R.value, n.y = T.value, n.clientX = o.clientX, n.clientY = o.clientY, n.left = w(e.config.value.containerStyle?.left), n.top = w(e.config.value.containerStyle?.top) || w(e.targetEle.value?.offsetTop), n.width = y.value, n.height = S.value, document.addEventListener("mousemove", A), document.addEventListener("mouseup", m);
+  }
+  function P(o, u) {
+    h.on(o, u);
+  }
+  function N() {
+    h.removeAllListeners();
+  }
+  function H() {
+    return e.targetEle.value;
+  }
+  return {
+    pointer: d,
+    getTarget: H,
+    onMouseDown: g,
+    on: P,
+    dispose: N
+  };
+}, st = /* @__PURE__ */ be({
+  __name: "index",
+  props: {
+    modelValue: {},
+    dragTarget: {}
+  },
+  emits: ["beforeMove", "moving", "afterMove", "scaling", "afterScale", "maskClick", "update:modelValue"],
+  setup(e, { expose: l, emit: c }) {
+    const s = c, h = e, d = Te(), i = $({
+      get: () => h.modelValue,
+      set: (t) => s("update:modelValue", t)
+    }), R = te("header"), T = te("scales"), y = te("drag"), S = ee(), a = oe(i.value, "containerStyle"), x = oe(i.value, "contentStyle"), n = oe(i.value, "headerStyle"), { get: L } = Ye(a), A = Ae({
+      prevClientX: 0,
+      prevClientY: 0,
+      prevTranslateX: 0,
+      prevTranslateY: 0,
+      translateX: 0,
+      translateY: 0,
+      scale: [0, 0]
+    }), { getScale: m, getTranslate: g, setTranslate: P, setPrevClientPos: N, getPrevClientPos: H, setPrevTranslate: o, getPrevTranslate: u } = Xe(A), I = ot({
+      config: i,
+      targetEle: y
+    }), D = $(() => ye(h.dragTarget)), C = $(() => !!i.value.header), F = $(() => ie(x.value)), z = $(() => ie(n.value)), V = $(() => ie(a.value)), Z = $(() => {
+      const { scaleX: t, scaleY: f } = m(), { translateX: r, translateY: v } = g(), Y = L("width") ?? Ie(y, "width"), k = L("height") ?? Ie(y, "height");
+      return {
+        transform: `scale(${t},${f}) translate(${X(r)},${X(v)})`,
+        zIndex: i.value.normal ? void 0 : Se("zIndex", L("zIndex")),
+        // 计算其transform中心点，用于优化动画效果。元素移动时，其left和top并没有发生变化
+        transformOrigin: `${X(parseFloat((r + w(Y) / 2).toFixed(2)))}
+    ${X(parseFloat((v + w(k) / 2).toFixed(2)))}`
+      };
+    }), ce = $(() => ie(i.value.maskStyle)), { autoStick: K, onInit: fe, onMovableChange: ve, onNormalChange: de } = it(
+      i,
+      S,
+      d,
+      A,
+      a,
+      D,
+      R
+    );
+    function he() {
+      S.value = et(), S.value.every("beforemove", (t) => {
+        N(t.clientX, t.clientY), s("beforeMove", Object.assign({}, t, g()));
+      }), S.value.every("moving", (t) => {
+        const { clientX: f, clientY: r } = H(), { translateX: v, translateY: Y } = u();
+        P(v + t.clientX - f, Y + t.clientY - r);
+        const k = g();
+        (G(i.value.x) || G(i.value.y)) && (i.value.x = k.translateX, i.value.y = k.translateY), s("moving", { ...t, ...k });
+      }), S.value.every("aftermove", async (t) => {
+        const { translateX: f, translateY: r } = g();
+        o(f, r), await K(), s("afterMove", { ...t, ...g() });
+      });
+    }
+    function ge() {
+      I.on(xe.AFTER_SCALE, async () => {
+        await K(), T.value && s("afterScale", T.value);
+      }), I.on(xe.SCALING, async () => {
+        T.value && s("scaling", T.value);
+      });
+    }
+    function ne() {
+      d.value = rt({
+        config: i,
+        targetEle: y,
+        dragOffset: A
+      }), d.value.on(se.AFTER_HIDE, () => {
+        i.value.visible = !1;
+      }), d.value.on(se.AFTER_SHOW, () => {
+        i.value.visible = !0;
+      }), d.value.on(se.AFTER_STICK, () => {
+        const { translateX: t, translateY: f } = g();
+        i.value.x = t, i.value.y = f;
+      });
+    }
+    async function me() {
+      ge(), he(), ne(), ve(i.value.movable), de(i.value.normal), fe(), window.addEventListener("resize", K);
+    }
+    return De(me), Me(() => {
+      window.removeEventListener("resize", K), I.dispose(), d.value?.dispose();
+    }), l({
+      async autoStick(t) {
+        return d.value?.autoStick(t);
+      },
+      async stickTo(t, f) {
+        return d.value?.stickTo(t, f);
+      },
+      async hideTo(t, f) {
+        return d.value?.hideTo(t, f);
+      },
+      async autoHide(t) {
+        return d.value?.autoHide(t);
+      },
+      async show(t, f) {
+        return d.value?.show(t, f);
+      },
+      async moveTo(t, f, r) {
+        return d.value?.moveTo(t, f, r);
+      },
+      getStatus: function() {
+        return d.value?.getStatus();
+      }
+    }), (t, f) => (j(), Q("div", {
+      ref: "drag",
+      class: "dragContainer",
+      style: J([V.value, Z.value])
+    }, [
+      C.value ? (j(), Q("div", {
+        key: 0,
+        ref: "header",
+        class: "dragHeader",
+        style: J(z.value)
+      }, [
+        we(t.$slots, "header", {}, void 0, !0)
+      ], 4)) : re("", !0),
+      i.value.scalable ? (j(), Ce(at, {
+        key: 1,
+        config: i.value,
+        scale: Pe(I),
+        move: S.value
+      }, null, 8, ["config", "scale", "move"])) : re("", !0),
+      Oe("div", {
+        ref: "scales",
+        class: "scaleContent",
+        style: J(F.value)
+      }, [
+        we(t.$slots, "default", {}, void 0, !0)
+      ], 4),
+      (j(), Ce(Ue, {
+        to: "body",
+        disabled: !i.value.mask
+      }, [
+        i.value.mask ? (j(), Q("div", {
+          key: 0,
+          class: "dragMask",
+          style: J(ce.value),
+          onClick: f[0] || (f[0] = (r) => s("maskClick"))
+        }, null, 4)) : re("", !0)
+      ], 8, ["disabled"]))
+    ], 4));
+  }
+}), dt = /* @__PURE__ */ Ee(st, [["__scopeId", "data-v-d123b73c"]]);
+export {
+  vt as Affix,
+  dt as ScalePanel
+};

package/package.json

@@ -0,0 +1,39 @@
+{
+  "name": "@toolmain/components",
+  "version": "1.0.0",
+  "description": "",
+  "license": "MIT",
+  "type": "module",
+  "author": "arsh <https://github.com/evilArsh>",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/evilArsh/toolmain.git",
+    "directory": "packages/components"
+  },
+  "keywords": [
+    "vue"
+  ],
+  "exports": {
+    ".": "./dist/index.js",
+    "./*": "./dist/*"
+  },
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist/*.js",
+    "dist/*.d.ts"
+  ],
+  "peerDependencies": {
+    "@vueuse/core": "^13.7.0",
+    "unocss": "^66.4.2",
+    "vue": "^3.5.0"
+  },
+  "dependencies": {
+    "@toolmain/shared": "^1.0.0",
+    "@toolmain/libs": "^1.0.0"
+  },
+  "scripts": {
+    "build": "vue-tsc -p tsconfig.json --declaration --emitDeclarationOnly && vite build && api-extractor run"
+  }
+}