yc-design-vue 1.0.1

package/es/List/List.vue2.js

@@ -0,0 +1,226 @@
+import { defineComponent, toRefs, ref, computed, createElementBlock, openBlock, normalizeClass, unref, createVNode, withCtx, createBlock, createCommentVNode, normalizeStyle, createElementVNode, renderSlot, createSlots, normalizeProps, guardReactiveProps, mergeProps, Fragment, renderList, resolveDynamicComponent, isRef } from "vue";
+import "../node_modules/tinycolor2/esm/tinycolor.js";
+import "../_shared/utils/dom.js";
+import { valueToPx } from "../_shared/utils/fn.js";
+import "../_shared/utils/time.js";
+import { unrefElement } from "../_shared/utils/vue-utils.js";
+import { getGlobalConfig } from "../_shared/utils/global-config.js";
+import useControlValue from "../_shared/utils/control.js";
+import useScrollReach from "./hooks/useScrollReach.js";
+import Spin from "../Spin/index.js";
+import Scrollbar from "../Scrollbar/index.js";
+import Pagination from "../Pagination/index.js";
+import Grid from "../Grid/index.js";
+import _sfc_main$1 from "./ListVirtual.vue.js";
+/* empty css                 */
+import ListItem from "./ListItem.vue.js";
+import _sfc_main$2 from "../Grid/GridItem.vue.js";
+const _hoisted_1 = { class: "yc-list-content-wrapper" };
+const _hoisted_2 = {
+  key: 0,
+  class: "yc-list-header"
+};
+const _hoisted_3 = {
+  key: 2,
+  role: "list",
+  class: "yc-list-content"
+};
+const _hoisted_4 = {
+  key: 4,
+  class: "yc-list-footer"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "List"
+  },
+  __name: "List",
+  props: {
+    data: { default: () => [] },
+    size: { default: void 0 },
+    bordered: { type: Boolean, default: true },
+    split: { type: Boolean, default: true },
+    loading: { type: Boolean, default: false },
+    hoverable: { type: Boolean, default: false },
+    paginationProps: { default: void 0 },
+    gridProps: { default: void 0 },
+    maxHeight: { default: void 0 },
+    bottomOffset: { default: 0 },
+    virtualListProps: { default: void 0 },
+    scrollbar: { type: Boolean, default: true }
+  },
+  emits: ["scroll", "reach-bottom", "page-change", "page-size-change"],
+  setup(__props, { emit: __emit }) {
+    var _a, _b;
+    const props = __props;
+    const emits = __emit;
+    const { data, paginationProps, virtualListProps, gridProps, bottomOffset } = toRefs(props);
+    const { size, renderEmpty } = getGlobalConfig(props);
+    const isBottomReached = ref(false);
+    const realListRef = ref();
+    const virtualListRef = ref();
+    const isVirtualList = computed(() => {
+      if (!virtualListProps.value || paginationProps.value || gridProps.value) {
+        return false;
+      }
+      return virtualListProps.value.itemHeight && (!virtualListProps.value.threshold || virtualListProps.value.threshold > data.value.length);
+    });
+    const scrollRef = computed(
+      () => {
+        var _a2;
+        return isVirtualList.value ? unrefElement(virtualListRef) : (_a2 = realListRef.value) == null ? void 0 : _a2.getScrollRef();
+      }
+    );
+    useScrollReach({
+      scrollRef,
+      offset: {
+        bottom: bottomOffset.value
+      },
+      onScroll: (e, arriveStauts) => {
+        isBottomReached.value = arriveStauts.bottom;
+        emits("scroll", e);
+      },
+      onReachBottom: (e) => {
+        emits("reach-bottom", e);
+      }
+    });
+    const current = computed(() => {
+      var _a2;
+      return (_a2 = paginationProps.value) == null ? void 0 : _a2.current;
+    });
+    const computedCurrent = useControlValue(
+      current,
+      ((_a = paginationProps.value) == null ? void 0 : _a.current) || 1,
+      (val) => {
+        emits("page-change", val);
+      }
+    );
+    const pageSize = computed(() => {
+      var _a2;
+      return (_a2 = paginationProps.value) == null ? void 0 : _a2.pageSize;
+    });
+    const computedPageSize = useControlValue(
+      pageSize,
+      ((_b = paginationProps.value) == null ? void 0 : _b.defaultPageSize) || 10,
+      (val) => {
+        computedCurrent.value = 1;
+        emits("page-change", val);
+      }
+    );
+    const curList = computed(() => {
+      if (!paginationProps.value) return data.value;
+      return data.value.slice(
+        (computedCurrent.value - 1) * computedPageSize.value,
+        computedCurrent.value * computedPageSize.value
+      );
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass([
+          "yc-list-wrapper",
+          `yc-list-size-${unref(size)}`,
+          {
+            "yc-list-bordered": _ctx.bordered,
+            "yc-list-hoverable": _ctx.hoverable,
+            "yc-list-split": _ctx.split
+          }
+        ])
+      }, [
+        createVNode(unref(Spin), {
+          loading: _ctx.loading,
+          class: "yc-list-spin"
+        }, {
+          default: withCtx(() => {
+            var _a2;
+            return [
+              createVNode(unref(Scrollbar), {
+                scrollbar: _ctx.scrollbar,
+                style: normalizeStyle({
+                  maxHeight: isVirtualList.value ? "" : unref(valueToPx)(_ctx.maxHeight)
+                }),
+                class: "yc-list",
+                ref_key: "realListRef",
+                ref: realListRef
+              }, {
+                default: withCtx(() => [
+                  createElementVNode("div", _hoisted_1, [
+                    _ctx.$slots.header ? (openBlock(), createElementBlock("div", _hoisted_2, [
+                      renderSlot(_ctx.$slots, "header", {}, void 0, true)
+                    ])) : createCommentVNode("", true),
+                    isVirtualList.value ? (openBlock(), createBlock(_sfc_main$1, {
+                      key: 1,
+                      data: unref(data),
+                      "virtual-list-props": unref(virtualListProps),
+                      style: normalizeStyle({
+                        maxHeight: unref(valueToPx)(_ctx.maxHeight)
+                      }),
+                      ref_key: "virtualListRef",
+                      ref: virtualListRef
+                    }, createSlots({ _: 2 }, [
+                      _ctx.$slots.item ? {
+                        name: "item",
+                        fn: withCtx((scope) => [
+                          renderSlot(_ctx.$slots, "item", normalizeProps(guardReactiveProps(scope)), void 0, true)
+                        ]),
+                        key: "0"
+                      } : void 0
+                    ]), 1032, ["data", "virtual-list-props", "style"])) : (openBlock(), createElementBlock("div", _hoisted_3, [
+                      renderSlot(_ctx.$slots, "default", {}, void 0, true),
+                      unref(gridProps) ? (openBlock(), createBlock(unref(Grid), normalizeProps(mergeProps({ key: 0 }, unref(gridProps))), {
+                        default: withCtx(() => [
+                          (openBlock(true), createElementBlock(Fragment, null, renderList(curList.value, (item, i) => {
+                            return openBlock(), createBlock(unref(_sfc_main$2), { key: i }, {
+                              default: withCtx(() => [
+                                renderSlot(_ctx.$slots, "item", {
+                                  index: i,
+                                  item
+                                }, void 0, true)
+                              ]),
+                              _: 2
+                            }, 1024);
+                          }), 128))
+                        ]),
+                        _: 3
+                      }, 16)) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(curList.value, (item, i) => {
+                        return renderSlot(_ctx.$slots, "item", {
+                          key: i,
+                          index: i,
+                          item
+                        }, void 0, true);
+                      }), 128))
+                    ])),
+                    !_ctx.$slots.default && !curList.value.length ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.$slots.empty || unref(renderEmpty)("List")), { key: 3 })) : createCommentVNode("", true),
+                    _ctx.$slots.footer ? (openBlock(), createElementBlock("div", _hoisted_4, [
+                      renderSlot(_ctx.$slots, "footer", {}, void 0, true)
+                    ])) : createCommentVNode("", true),
+                    _ctx.$slots["scroll-loading"] && isBottomReached.value ? (openBlock(), createBlock(ListItem, {
+                      key: 5,
+                      class: "yc-list-scroll-loading"
+                    }, {
+                      default: withCtx(() => [
+                        renderSlot(_ctx.$slots, "scroll-loading", {}, void 0, true)
+                      ]),
+                      _: 3
+                    })) : createCommentVNode("", true)
+                  ])
+                ]),
+                _: 3
+              }, 8, ["scrollbar", "style"]),
+              unref(paginationProps) ? (openBlock(), createBlock(unref(Pagination), {
+                key: 0,
+                current: unref(computedCurrent),
+                "onUpdate:current": _cache[0] || (_cache[0] = ($event) => isRef(computedCurrent) ? computedCurrent.value = $event : null),
+                "page-size": unref(computedPageSize),
+                "onUpdate:pageSize": _cache[1] || (_cache[1] = ($event) => isRef(computedPageSize) ? computedPageSize.value = $event : null),
+                total: ((_a2 = unref(paginationProps)) == null ? void 0 : _a2.total) || 0
+              }, null, 8, ["current", "page-size", "total"])) : createCommentVNode("", true)
+            ];
+          }),
+          _: 3
+        }, 8, ["loading"])
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/es/List/ListItem.vue.d.ts

@@ -0,0 +1,18 @@
+import { ListItemProps, ListItemSlots } from './type';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<ListItemSlots> & ListItemSlots;
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<ListItemProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<ListItemProps> & Readonly<{}>, {
+    actionLayout: import('..').Direction;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/es/List/ListItem.vue.js

@@ -0,0 +1,7 @@
+import _sfc_main from "./ListItem.vue2.js";
+/* empty css              */
+import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
+const ListItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-6f994902"]]);
+export {
+  ListItem as default
+};

package/es/List/ListItem.vue2.js

@@ -0,0 +1,58 @@
+import { defineComponent, createElementBlock, openBlock, createElementVNode, createCommentVNode, renderSlot } from "vue";
+const _hoisted_1 = {
+  role: "listitem",
+  class: "yc-list-item"
+};
+const _hoisted_2 = { class: "yc-list-item-main" };
+const _hoisted_3 = {
+  key: 0,
+  class: "yc-list-item-meta"
+};
+const _hoisted_4 = { class: "yc-list-item-content" };
+const _hoisted_5 = {
+  key: 1,
+  class: "yc-list-item-action"
+};
+const _hoisted_6 = {
+  key: 0,
+  class: "yc-list-item-action"
+};
+const _hoisted_7 = {
+  key: 1,
+  class: "list-item-extra"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "ListItem"
+  },
+  __name: "ListItem",
+  props: {
+    actionLayout: { default: "horizontal" }
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", _hoisted_2, [
+          _ctx.$slots.meta ? (openBlock(), createElementBlock("div", _hoisted_3, [
+            renderSlot(_ctx.$slots, "meta", {}, void 0, true)
+          ])) : createCommentVNode("", true),
+          createElementVNode("div", _hoisted_4, [
+            renderSlot(_ctx.$slots, "default", {}, void 0, true)
+          ]),
+          _ctx.$slots.actions && _ctx.actionLayout == "vertical" ? (openBlock(), createElementBlock("div", _hoisted_5, [
+            renderSlot(_ctx.$slots, "actions", {}, void 0, true)
+          ])) : createCommentVNode("", true)
+        ]),
+        _ctx.$slots.actions && _ctx.actionLayout == "horizontal" ? (openBlock(), createElementBlock("div", _hoisted_6, [
+          renderSlot(_ctx.$slots, "actions", {}, void 0, true)
+        ])) : createCommentVNode("", true),
+        _ctx.$slots.extra ? (openBlock(), createElementBlock("div", _hoisted_7, [
+          renderSlot(_ctx.$slots, "extra", {}, void 0, true)
+        ])) : createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/es/List/ListItemMeta.vue.d.ts

@@ -0,0 +1,19 @@
+import { ListItemMetaProps, ListItemMetaSlots } from './type';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<ListItemMetaSlots> & ListItemMetaSlots;
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<ListItemMetaProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<ListItemMetaProps> & Readonly<{}>, {
+    title: string;
+    description: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/es/List/ListItemMeta.vue.js

@@ -0,0 +1,7 @@
+import _sfc_main from "./ListItemMeta.vue2.js";
+/* empty css                  */
+import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
+const ListItemMeta = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-da1091ab"]]);
+export {
+  ListItemMeta as default
+};

package/es/List/ListItemMeta.vue2.js

@@ -0,0 +1,49 @@
+import { defineComponent, createElementBlock, openBlock, createCommentVNode, createElementVNode, renderSlot, createTextVNode, toDisplayString } from "vue";
+const _hoisted_1 = { class: "yc-list-item-meta" };
+const _hoisted_2 = {
+  key: 0,
+  class: "yc-list-item-meta-avatar"
+};
+const _hoisted_3 = { class: "yc-list-item-meta-content" };
+const _hoisted_4 = {
+  key: 0,
+  class: "yc-list-item-meta-title"
+};
+const _hoisted_5 = {
+  key: 1,
+  class: "yc-list-item-meta-description"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "ListItemMeta"
+  },
+  __name: "ListItemMeta",
+  props: {
+    title: { default: "" },
+    description: { default: "" }
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        _ctx.$slots.avatar ? (openBlock(), createElementBlock("div", _hoisted_2, [
+          renderSlot(_ctx.$slots, "avatar", {}, void 0, true)
+        ])) : createCommentVNode("", true),
+        createElementVNode("div", _hoisted_3, [
+          _ctx.$slots.title || _ctx.title ? (openBlock(), createElementBlock("div", _hoisted_4, [
+            renderSlot(_ctx.$slots, "title", {}, () => [
+              createTextVNode(toDisplayString(_ctx.title), 1)
+            ], true)
+          ])) : createCommentVNode("", true),
+          _ctx.$slots.description || _ctx.description ? (openBlock(), createElementBlock("div", _hoisted_5, [
+            renderSlot(_ctx.$slots, "description", {}, () => [
+              createTextVNode(toDisplayString(_ctx.description), 1)
+            ], true)
+          ])) : createCommentVNode("", true)
+        ])
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/es/List/ListVirtual.vue.d.ts

@@ -0,0 +1,26 @@
+import { VirtualListProps } from '../Select';
+import { ObjectData } from '../_shared/type';
+type __VLS_Props = {
+    data: ObjectData[];
+    virtualListProps: VirtualListProps;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        item?(_: {
+            index: number;
+            item: ObjectData;
+        }): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/es/List/ListVirtual.vue.js

@@ -0,0 +1,34 @@
+import { defineComponent, toRefs, createElementBlock, openBlock, mergeProps, unref, createElementVNode, Fragment, renderList, renderSlot } from "vue";
+import { useVirtualList } from "../node_modules/@vueuse/core/index.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "ListVirtual",
+  props: {
+    data: {},
+    virtualListProps: {}
+  },
+  setup(__props) {
+    var _a, _b;
+    const props = __props;
+    const { data, virtualListProps } = toRefs(props);
+    const { list, containerProps, wrapperProps } = useVirtualList(data, {
+      itemHeight: ((_a = virtualListProps.value) == null ? void 0 : _a.itemHeight) || 40,
+      overscan: ((_b = virtualListProps.value) == null ? void 0 : _b.buffer) || 10
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", mergeProps({ class: "yc-virtual-list" }, unref(containerProps)), [
+        createElementVNode("div", mergeProps({ class: "yc-list-content" }, unref(wrapperProps)), [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(list), ({ data: data2, index: i }) => {
+            return renderSlot(_ctx.$slots, "item", {
+              key: i,
+              index: i,
+              item: data2
+            });
+          }), 128))
+        ], 16)
+      ], 16);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/es/List/ListVirtual.vue3.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./ListVirtual.vue.js";
+/* empty css                 */
+export {
+  _sfc_main as default
+};

package/es/List/hooks/useScrollReach.d.ts

@@ -0,0 +1,17 @@
+import { Ref } from 'vue';
+interface OffsetDirection {
+    left?: number;
+    top?: number;
+    right?: number;
+    bottom?: number;
+}
+declare const _default: (options: {
+    scrollRef: Ref<any>;
+    offset?: OffsetDirection;
+    onScroll?: (e: Event, status: Record<string, boolean>) => void;
+    onReachRight?: (e: Event) => void;
+    onReachLeft?: (e: Event) => void;
+    onReachTop?: (e: Event) => void;
+    onReachBottom?: (e: Event) => void;
+}) => void;
+export default _default;

package/es/List/hooks/useScrollReach.js

@@ -0,0 +1,32 @@
+import { useScroll } from "../../node_modules/@vueuse/core/index.js";
+import "../../node_modules/tinycolor2/esm/tinycolor.js";
+import "../../_shared/utils/dom.js";
+import { debounce } from "../../_shared/utils/fn.js";
+import "../../_shared/utils/time.js";
+import "vue";
+import "../../Empty/index.js";
+/* empty css                            */
+const useScrollReach = (options) => {
+  const {
+    scrollRef,
+    offset,
+    onReachBottom,
+    onReachLeft,
+    onReachRight,
+    onReachTop,
+    onScroll
+  } = options;
+  const { arrivedState } = useScroll(scrollRef, {
+    onScroll: debounce((e) => {
+      onScroll == null ? void 0 : onScroll(e, arrivedState);
+      arrivedState.bottom && (onReachBottom == null ? void 0 : onReachBottom(e));
+      arrivedState.left && (onReachLeft == null ? void 0 : onReachLeft(e));
+      arrivedState.right && (onReachRight == null ? void 0 : onReachRight(e));
+      arrivedState.top && (onReachTop == null ? void 0 : onReachTop(e));
+    }, 50),
+    offset
+  });
+};
+export {
+  useScrollReach as default
+};