@dt-frames/ui 2.0.24 → 4.0.1

package/es/components/container/index.js

@@ -1,290 +0,0 @@
-import { defineComponent, getCurrentInstance, ref, inject, computed, onUnmounted, h, provide, onMounted, nextTick, unref, onBeforeUnmount, openBlock, createElementBlock, createElementVNode, normalizeClass, normalizeStyle, createBlock, resolveDynamicComponent, withCtx, renderSlot, createVNode, mergeProps } from "vue";
-import { off, on } from "@dt-frames/core";
-const isServer = typeof window === "undefined";
-const BAR_MAP = {
-  vertical: {
-    offset: "offsetHeight",
-    scroll: "scrollTop",
-    scrollSize: "scrollHeight",
-    size: "height",
-    key: "vertical",
-    axis: "Y",
-    client: "clientY",
-    direction: "top"
-  },
-  horizontal: {
-    offset: "offsetWidth",
-    scroll: "scrollLeft",
-    scrollSize: "scrollWidth",
-    size: "width",
-    key: "horizontal",
-    axis: "X",
-    client: "clientX",
-    direction: "left"
-  }
-};
-function renderThumbStyle({ move, size, bar }) {
-  const style = {};
-  const translate = `translate${bar.axis}(${move}%)`;
-  style[bar.size] = size;
-  style.transform = translate;
-  style.msTransform = translate;
-  style.webkitTransform = translate;
-  return style;
-}
-function resizeHandler(entries) {
-  for (const entry of entries) {
-    const listeners = entry.target.__resizeListeners__ || [];
-    if (listeners.length) {
-      listeners.forEach((fn) => {
-        fn();
-      });
-    }
-  }
-}
-function addResizeListener(element, fn) {
-  if (isServer)
-    return;
-  if (!element.__resizeListeners__) {
-    element.__resizeListeners__ = [];
-    element.__ro__ = new ResizeObserver(resizeHandler);
-    element.__ro__.observe(element);
-  }
-  element.__resizeListeners__.push(fn);
-}
-function removeResizeListener(element, fn) {
-  if (!element || !element.__resizeListeners__)
-    return;
-  element.__resizeListeners__.splice(element.__resizeListeners__.indexOf(fn), 1);
-  if (!element.__resizeListeners__.length) {
-    element.__ro__.disconnect();
-  }
-}
-const Bar = defineComponent({
-  name: "Bar",
-  props: {
-    vertical: Boolean,
-    size: String,
-    move: Number
-  },
-  setup(props) {
-    const instance = getCurrentInstance();
-    const thumb = ref();
-    const wrap = inject("scroll-bar-wrap", {});
-    const bar = computed(() => {
-      return BAR_MAP[props.vertical ? "vertical" : "horizontal"];
-    });
-    const barStore = ref({});
-    const cursorDown = ref();
-    const clickThumbHandler = (e) => {
-      if (e.ctrlKey || e.button === 2) {
-        return;
-      }
-      window.getSelection()?.removeAllRanges();
-      startDrag(e);
-      barStore.value[bar.value.axis] = e.currentTarget[bar.value.offset] - (e[bar.value.client] - e.currentTarget.getBoundingClientRect()[bar.value.direction]);
-    };
-    const clickTrackHandler = (e) => {
-      const offset = Math.abs(
-        e.target.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]
-      );
-      const thumbHalf = thumb.value[bar.value.offset] / 2;
-      const thumbPositionPercentage = (offset - thumbHalf) * 100 / instance?.vnode.el?.[bar.value.offset];
-      wrap.value[bar.value.scroll] = thumbPositionPercentage * wrap.value[bar.value.scrollSize] / 100;
-    };
-    const startDrag = (e) => {
-      e.stopImmediatePropagation();
-      cursorDown.value = true;
-      on(document, "mousemove", mouseMoveDocumentHandler);
-      on(document, "mouseup", mouseUpDocumentHandler);
-      document.onselectstart = () => false;
-    };
-    const mouseMoveDocumentHandler = (e) => {
-      if (cursorDown.value === false)
-        return;
-      const prevPage = barStore.value[bar.value.axis];
-      if (!prevPage)
-        return;
-      const offset = (instance?.vnode.el?.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]) * -1;
-      const thumbClickPosition = thumb.value[bar.value.offset] - prevPage;
-      const thumbPositionPercentage = (offset - thumbClickPosition) * 100 / instance?.vnode.el?.[bar.value.offset];
-      wrap.value[bar.value.scroll] = thumbPositionPercentage * wrap.value[bar.value.scrollSize] / 100;
-    };
-    function mouseUpDocumentHandler() {
-      cursorDown.value = false;
-      barStore.value[bar.value.axis] = 0;
-      off(document, "mousemove", mouseMoveDocumentHandler);
-      document.onselectstart = null;
-    }
-    onUnmounted(() => {
-      off(document, "mouseup", mouseUpDocumentHandler);
-    });
-    return () => h(
-      "div",
-      {
-        class: ["scrollbar__bar", "is-" + bar.value.key],
-        onMousedown: clickTrackHandler
-      },
-      h("div", {
-        ref: thumb,
-        class: "scrollbar__thumb",
-        onMousedown: clickThumbHandler,
-        style: renderThumbStyle({
-          size: props.size,
-          move: props.move,
-          bar: bar.value
-        })
-      })
-    );
-  }
-});
-const _hoisted_1 = { class: "scrollbar relative h-full overflow-hidden" };
-const _sfc_main$2 = /* @__PURE__ */ defineComponent({
-  __name: "scroll-bar",
-  props: {
-    wrapClass: {
-      type: [String, Array],
-      default: ""
-    },
-    wrapStyle: Array,
-    viewClass: {
-      type: [String, Array],
-      default: ""
-    },
-    viewStyle: {
-      type: [String, Array],
-      default: ""
-    },
-    noresize: Boolean,
-    tag: {
-      type: String,
-      default: "div"
-    }
-  },
-  setup(__props) {
-    const props = __props;
-    const sizeWidth = ref("0");
-    const sizeHeight = ref("0");
-    const moveX = ref(0);
-    const moveY = ref(0);
-    const wrap = ref();
-    const resize = ref();
-    provide("scroll-bar-wrap", wrap);
-    const style = computed(() => {
-      let rsStyle = {};
-      if (Array.isArray(props.wrapStyle)) {
-        props.wrapStyle.forEach((it) => {
-          if (it)
-            rsStyle = Object.assign({}, rsStyle, it);
-        });
-      }
-      return rsStyle;
-    });
-    const handleScroll = () => {
-      moveY.value = unref(wrap).scrollTop * 100 / unref(wrap).clientHeight;
-      moveX.value = unref(wrap).scrollLeft * 100 / unref(wrap).clientWidth;
-    };
-    const update = () => {
-      if (!unref(wrap))
-        return;
-      const heightPercentage = unref(wrap).clientHeight * 100 / unref(wrap).scrollHeight;
-      const widthPercentage = unref(wrap).clientWidth * 100 / unref(wrap).scrollWidth;
-      sizeHeight.value = heightPercentage < 100 ? heightPercentage + "%" : "";
-      sizeWidth.value = widthPercentage < 100 ? widthPercentage + "%" : "";
-    };
-    onMounted(() => {
-      nextTick(update);
-      if (!props.noresize) {
-        addResizeListener(unref(resize), update);
-        addResizeListener(unref(wrap), update);
-        addEventListener("resize", update);
-      }
-    });
-    onBeforeUnmount(() => {
-      if (!props.noresize) {
-        removeResizeListener(unref(resize), update);
-        removeResizeListener(unref(wrap), update);
-        removeEventListener("resize", update);
-      }
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1, [
-        createElementVNode("div", {
-          ref_key: "wrap",
-          ref: wrap,
-          class: normalizeClass([[__props.wrapClass, "scrollbar__wrap--hidden-default"], "h-full overflow-auto"]),
-          style: normalizeStyle(unref(style)),
-          onScroll: handleScroll
-        }, [
-          (openBlock(), createBlock(resolveDynamicComponent(__props.tag), {
-            class: normalizeClass(["box-border", __props.viewClass]),
-            ref_key: "resize",
-            ref: resize,
-            style: normalizeStyle(__props.viewStyle)
-          }, {
-            default: withCtx(() => [
-              renderSlot(_ctx.$slots, "default")
-            ]),
-            _: 3
-          }, 8, ["class", "style"]))
-        ], 38),
-        createVNode(unref(Bar), {
-          move: moveX.value,
-          size: sizeWidth.value
-        }, null, 8, ["move", "size"]),
-        createVNode(unref(Bar), {
-          vertical: "",
-          move: moveY.value,
-          size: sizeHeight.value
-        }, null, 8, ["move", "size"])
-      ]);
-    };
-  }
-});
-const _sfc_main$1 = /* @__PURE__ */ defineComponent({
-  __name: "scroll-container",
-  setup(__props) {
-    const scrollbarRef = ref(null);
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(_sfc_main$2, mergeProps({
-        ref_key: "scrollbarRef",
-        ref: scrollbarRef
-      }, _ctx.$attrs, { class: "w-full h-full" }), {
-        default: withCtx(() => [
-          renderSlot(_ctx.$slots, "default")
-        ]),
-        _: 3
-      }, 16);
-    };
-  }
-});
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "slot-container",
-  props: {
-    template: {
-      type: Function
-    },
-    data: {
-      type: Object
-    }
-  },
-  setup(__props) {
-    const props = __props;
-    const Container = h("div", [props.template(props.data)]);
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(Container));
-    };
-  }
-});
-const withInstall = (comp) => {
-  comp.install = (app) => {
-    app.component(comp.name, comp);
-  };
-  return comp;
-};
-const DtScrollContainer = withInstall(_sfc_main$1);
-const DtSlotContainer = withInstall(_sfc_main);
-export {
-  DtScrollContainer,
-  DtSlotContainer
-};

package/es/components/container/index.less

@@ -1,64 +0,0 @@
-.scrollbar {
-    // 滚动条样式
-    &__wrap--hidden-default{
-        scrollbar-width: none;
-    
-        &::-webkit-scrollbar {
-            display: none;
-            width: 0;
-            height: 0;
-            opacity: 0;
-        }
-    }
-
-    &__thumb {
-        position: relative;
-        display: block;
-        width: 0;
-        height: 0;
-        cursor: pointer;
-        background-color: rgba(144, 147, 153, 0.3);
-        border-radius: inherit;
-        transition: 0.3s background-color;
-    
-        &:hover {
-            background-color: rgba(144, 147, 153, 0.5);
-        }
-    }
-    
-    &__bar {
-        position: absolute;
-        right: 2px;
-        bottom: 2px;
-        z-index: 1;
-        border-radius: 4px;
-        opacity: 0;
-        -webkit-transition: opacity 80ms ease;
-        transition: opacity 80ms ease;
-    
-        &.is-vertical {
-            top: 2px;
-            width: 6px;
-    
-            & > div {
-                width: 100%;
-            }
-        }
-    
-        &.is-horizontal {
-            left: 2px;
-            height: 6px;
-    
-            & > div {
-                height: 100%;
-            }
-        }
-    }
-
-    &:active > &__bar,
-    &:focus > &__bar,
-    &:hover > &__bar {
-        opacity: 1;
-        transition: opacity 340ms ease-out;
-    }
-}

package/es/components/container/src/components/bar.d.ts

@@ -1,14 +0,0 @@
-declare const _default: import("vue").DefineComponent<{
-    vertical: BooleanConstructor;
-    size: StringConstructor;
-    move: NumberConstructor;
-}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    vertical: BooleanConstructor;
-    size: StringConstructor;
-    move: NumberConstructor;
-}>>, {
-    vertical: boolean;
-}>;
-export default _default;

package/es/components/container/src/components/scroll-bar.d.ts

@@ -1,70 +0,0 @@
-declare const _sfc_main: import("vue").DefineComponent<{
-    wrapClass: {
-        type: (StringConstructor | ArrayConstructor)[];
-        default: string;
-    };
-    wrapStyle: ArrayConstructor;
-    viewClass: {
-        type: (StringConstructor | ArrayConstructor)[];
-        default: string;
-    };
-    viewStyle: {
-        type: (StringConstructor | ArrayConstructor)[];
-        default: string;
-    };
-    noresize: BooleanConstructor;
-    tag: {
-        type: StringConstructor;
-        default: string;
-    };
-}, {
-    sizeWidth: import("vue").Ref<string>;
-    sizeHeight: import("vue").Ref<string>;
-    moveX: import("vue").Ref<number>;
-    moveY: import("vue").Ref<number>;
-    wrap: import("vue").Ref<any>;
-    resize: import("vue").Ref<any>;
-    props: any;
-    style: import("vue").ComputedRef<{}>;
-    handleScroll: () => void;
-    update: () => void;
-    readonly Bar: import("vue").DefineComponent<{
-        vertical: BooleanConstructor;
-        size: StringConstructor;
-        move: NumberConstructor;
-    }, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-        [key: string]: any;
-    }>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-        vertical: BooleanConstructor;
-        size: StringConstructor;
-        move: NumberConstructor;
-    }>>, {
-        vertical: boolean;
-    }>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    wrapClass: {
-        type: (StringConstructor | ArrayConstructor)[];
-        default: string;
-    };
-    wrapStyle: ArrayConstructor;
-    viewClass: {
-        type: (StringConstructor | ArrayConstructor)[];
-        default: string;
-    };
-    viewStyle: {
-        type: (StringConstructor | ArrayConstructor)[];
-        default: string;
-    };
-    noresize: BooleanConstructor;
-    tag: {
-        type: StringConstructor;
-        default: string;
-    };
-}>>, {
-    wrapClass: string | unknown[];
-    viewClass: string | unknown[];
-    viewStyle: string | unknown[];
-    noresize: boolean;
-    tag: string;
-}>;
-export default _sfc_main;

package/es/components/container/src/hooks/scroll.d.ts

@@ -1,10 +0,0 @@
-export interface ScrollToParams {
-    el: any;
-    to: number;
-    duration?: number;
-    callback?: () => any;
-}
-export declare function useScrollTo({ el, to, duration, callback }: ScrollToParams): {
-    start: () => void;
-    stop: () => void;
-};

package/es/components/container/src/scroll-container.d.ts

@@ -1,76 +0,0 @@
-declare const _sfc_main: import("vue").DefineComponent<{}, {
-    scrollbarRef: any;
-    scrollTo: (to: number, duration?: number) => void;
-    getScrollWrap: () => any;
-    scrollBottom: () => void;
-    ScrollBar: import("vue").DefineComponent<{
-        wrapClass: {
-            type: (StringConstructor | ArrayConstructor)[];
-            default: string;
-        };
-        wrapStyle: ArrayConstructor;
-        viewClass: {
-            type: (StringConstructor | ArrayConstructor)[];
-            default: string;
-        };
-        viewStyle: {
-            type: (StringConstructor | ArrayConstructor)[];
-            default: string;
-        };
-        noresize: BooleanConstructor;
-        tag: {
-            type: StringConstructor;
-            default: string;
-        };
-    }, {
-        sizeWidth: import("vue").Ref<string>;
-        sizeHeight: import("vue").Ref<string>;
-        moveX: import("vue").Ref<number>;
-        moveY: import("vue").Ref<number>;
-        wrap: import("vue").Ref<any>;
-        resize: import("vue").Ref<any>;
-        props: any;
-        style: import("vue").ComputedRef<{}>;
-        handleScroll: () => void;
-        update: () => void;
-        readonly Bar: import("vue").DefineComponent<{
-            vertical: BooleanConstructor;
-            size: StringConstructor;
-            move: NumberConstructor;
-        }, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-            [key: string]: any;
-        }>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-            vertical: BooleanConstructor;
-            size: StringConstructor;
-            move: NumberConstructor;
-        }>>, {
-            vertical: boolean;
-        }>;
-    }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-        wrapClass: {
-            type: (StringConstructor | ArrayConstructor)[];
-            default: string;
-        };
-        wrapStyle: ArrayConstructor;
-        viewClass: {
-            type: (StringConstructor | ArrayConstructor)[];
-            default: string;
-        };
-        viewStyle: {
-            type: (StringConstructor | ArrayConstructor)[];
-            default: string;
-        };
-        noresize: BooleanConstructor;
-        tag: {
-            type: StringConstructor;
-            default: string;
-        };
-    }>>, {
-        wrapClass: string | unknown[];
-        viewClass: string | unknown[];
-        viewStyle: string | unknown[];
-        noresize: boolean;
-        tag: string;
-    }>;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
-export default _sfc_main;

package/es/components/container/src/slot-container.d.ts

@@ -1,20 +0,0 @@
-import { Component } from 'vue';
-declare const _sfc_main: import("vue").DefineComponent<{
-    template: {
-        type: FunctionConstructor;
-    };
-    data: {
-        type: ObjectConstructor;
-    };
-}, {
-    props: any;
-    Container: Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    template: {
-        type: FunctionConstructor;
-    };
-    data: {
-        type: ObjectConstructor;
-    };
-}>>, {}>;
-export default _sfc_main;

package/es/components/container/src/types/scroll.type.d.ts

@@ -1,22 +0,0 @@
-export interface BarMapItem {
-    offset: string;
-    scroll: string;
-    scrollSize: string;
-    size: string;
-    key: string;
-    axis: string;
-    client: string;
-    direction: string;
-}
-export interface BarMap {
-    vertical: BarMapItem;
-    horizontal: BarMapItem;
-}
-export interface ScrollbarType {
-    wrap: any;
-}
-export declare type BarStyle = {
-    bar: any;
-    size: String;
-    move: any;
-};

package/es/components/container/src/utils/scroll.d.ts

@@ -1,5 +0,0 @@
-import { BarMap, BarStyle } from "../types/scroll.type";
-export declare const BAR_MAP: BarMap;
-export declare function renderThumbStyle({ move, size, bar }: BarStyle): any;
-export declare function addResizeListener(element: any, fn: () => any): void;
-export declare function removeResizeListener(element: any, fn: () => any): void;

package/es/components/curd/index.d.ts

@@ -1,2 +0,0 @@
-import { useCurd } from "./src/hooks/useCurd";
-export { useCurd };