yc-design-vue 1.0.1

package/es/Alert/index.vue2.js

@@ -0,0 +1,101 @@
+import { defineComponent, ref, createBlock, openBlock, Transition, withCtx, createElementBlock, createCommentVNode, normalizeClass, createElementVNode, renderSlot, resolveDynamicComponent, unref, createTextVNode, toDisplayString, createVNode } from "vue";
+import { TYPE_ICON_MAP } from "../_shared/constants/index.js";
+import IconButton from "../_shared/components/IconButton.vue.js";
+import "../node_modules/tinycolor2/esm/tinycolor.js";
+import "../_shared/utils/dom.js";
+import "../_shared/utils/time.js";
+import "../Empty/index.js";
+/* empty css                         */
+/* empty css                                         */
+const _hoisted_1 = {
+  key: 0,
+  class: "yc-alert-icon"
+};
+const _hoisted_2 = { class: "yc-alert-body" };
+const _hoisted_3 = {
+  key: 0,
+  class: "yc-alert-title"
+};
+const _hoisted_4 = { class: "yc-alert-content" };
+const _hoisted_5 = {
+  key: 1,
+  class: "yc-alert-action"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "Alert"
+  },
+  __name: "index",
+  props: {
+    type: { default: "info" },
+    showIcon: { type: Boolean, default: true },
+    closable: { type: Boolean, default: false },
+    title: { default: "" },
+    banner: { type: Boolean, default: false },
+    center: { type: Boolean, default: false }
+  },
+  emits: ["close", "after-close"],
+  setup(__props, { emit: __emit }) {
+    const emits = __emit;
+    const visible = ref(true);
+    const handleClose = (ev) => {
+      visible.value = false;
+      emits("close", ev);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(Transition, {
+        name: "slide-dynamic-origin",
+        onAfterLeave: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("after-close"))
+      }, {
+        default: withCtx(() => [
+          visible.value ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: normalizeClass([
+              "yc-alert",
+              `yc-alert-${_ctx.type}`,
+              {
+                "yc-alert-has-title": _ctx.title || _ctx.$slots.title,
+                "yc-alert-center": _ctx.center || _ctx.banner,
+                "yc-alert-banner": _ctx.banner
+              }
+            ])
+          }, [
+            _ctx.showIcon ? (openBlock(), createElementBlock("div", _hoisted_1, [
+              renderSlot(_ctx.$slots, "icon", {}, () => [
+                (openBlock(), createBlock(resolveDynamicComponent(unref(TYPE_ICON_MAP)[_ctx.type])))
+              ], true)
+            ])) : createCommentVNode("", true),
+            createElementVNode("div", _hoisted_2, [
+              _ctx.$slots.title || _ctx.title ? (openBlock(), createElementBlock("div", _hoisted_3, [
+                renderSlot(_ctx.$slots, "title", {}, () => [
+                  createTextVNode(toDisplayString(_ctx.title), 1)
+                ], true)
+              ])) : createCommentVNode("", true),
+              createElementVNode("div", _hoisted_4, [
+                renderSlot(_ctx.$slots, "default", {}, void 0, true)
+              ])
+            ]),
+            _ctx.$slots.action ? (openBlock(), createElementBlock("div", _hoisted_5, [
+              renderSlot(_ctx.$slots, "action", {}, void 0, true)
+            ])) : createCommentVNode("", true),
+            _ctx.closable ? (openBlock(), createElementBlock("div", {
+              key: 2,
+              class: "yc-alert-close-btn",
+              role: "button",
+              "aria-label": "Close",
+              onClick: handleClose
+            }, [
+              renderSlot(_ctx.$slots, "close-element", {}, () => [
+                createVNode(unref(IconButton))
+              ], true)
+            ])) : createCommentVNode("", true)
+          ], 2)) : createCommentVNode("", true)
+        ]),
+        _: 3
+      });
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/es/Alert/type.d.ts

@@ -0,0 +1,20 @@
+export interface AlertProps {
+    type?: AlertType;
+    showIcon?: boolean;
+    closable?: boolean;
+    title?: string;
+    banner?: boolean;
+    center?: boolean;
+}
+export interface AlertEmits {
+    (e: 'close', ev: MouseEvent): void;
+    (e: 'after-close'): void;
+}
+export interface AlertSlots {
+    default(): void;
+    icon(): void;
+    title(): void;
+    action(): void;
+    ['close-element'](): void;
+}
+export type AlertType = 'warning' | 'success' | 'info' | 'error' | 'normal';

package/es/Anchor/Anchor.vue.d.ts

@@ -0,0 +1,26 @@
+import { AnchorProps, AnchorSlots } from './type';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<AnchorSlots> & AnchorSlots;
+    refs: {
+        listRef: HTMLDivElement;
+    };
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<AnchorProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<AnchorProps> & Readonly<{}>, {
+    smooth: boolean;
+    boundary: import('./type').AnchorBoundary;
+    changeHash: boolean;
+    lineLess: boolean;
+    scrollContainer: import('..').TargetContainer;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    listRef: HTMLDivElement;
+}, 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/Anchor/Anchor.vue.js

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

package/es/Anchor/Anchor.vue2.js

@@ -0,0 +1,74 @@
+import { defineComponent, ref, computed, onMounted, createElementBlock, openBlock, createCommentVNode, createElementVNode, normalizeStyle, unref, renderSlot } 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 "../Empty/index.js";
+/* empty css                         */
+import useContext from "./hooks/useContext.js";
+const _hoisted_1 = { class: "yc-anchor" };
+const _hoisted_2 = {
+  key: 0,
+  class: "yc-anchor-line-track"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "Anchor"
+  },
+  __name: "Anchor",
+  props: {
+    boundary: { default: "start" },
+    lineLess: { type: Boolean, default: false },
+    scrollContainer: { default: void 0 },
+    changeHash: { type: Boolean, default: true },
+    smooth: { type: Boolean, default: true }
+  },
+  setup(__props) {
+    const props = __props;
+    const listRef = ref();
+    const linkRefs = ref([]);
+    const { curHref, hrefs } = useContext().provide(props, listRef);
+    const top = computed(() => {
+      const curIndex = hrefs.value.findIndex((item) => item == curHref.value);
+      const offset = linkRefs.value.slice(0, curIndex + 1).map((item) => item.offsetHeight).reduce((pre, cur, index) => {
+        if (index == curIndex) {
+          return pre + (cur - 12) / 2;
+        } else {
+          return pre + cur;
+        }
+      }, 0);
+      return offset + curIndex * 2;
+    });
+    onMounted(() => {
+      if (!hrefs.value.length) return;
+      curHref.value = hrefs.value[0];
+      linkRefs.value = [
+        ...listRef.value.querySelectorAll(
+          ".yc-anchor-link"
+        )
+      ];
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        !_ctx.lineLess ? (openBlock(), createElementBlock("div", _hoisted_2, [
+          createElementVNode("div", {
+            class: "yc-anchor-line-slider",
+            style: normalizeStyle({
+              top: unref(valueToPx)(top.value)
+            })
+          }, null, 4)
+        ])) : createCommentVNode("", true),
+        createElementVNode("div", {
+          class: "yc-anchor-list",
+          ref_key: "listRef",
+          ref: listRef
+        }, [
+          renderSlot(_ctx.$slots, "default", {}, void 0, true)
+        ], 512)
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/es/Anchor/AnchorLink.vue.d.ts

@@ -0,0 +1,23 @@
+import { AnchorLinkProps, AnchorLinkSlots } from './type';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<AnchorLinkSlots> & AnchorLinkSlots;
+    refs: {
+        linkRef: HTMLAnchorElement;
+    };
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<AnchorLinkProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<AnchorLinkProps> & Readonly<{}>, {
+    title: string;
+    href: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    linkRef: HTMLAnchorElement;
+}, 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/Anchor/AnchorLink.vue.js

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

package/es/Anchor/AnchorLink.vue2.js

@@ -0,0 +1,77 @@
+import { defineComponent, toRefs, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, createCommentVNode, renderSlot, createTextVNode, toDisplayString } from "vue";
+import "../node_modules/tinycolor2/esm/tinycolor.js";
+import { getElement } from "../_shared/utils/dom.js";
+import { isNumber } from "../_shared/utils/is.js";
+import "../_shared/utils/time.js";
+import "../Empty/index.js";
+/* empty css                         */
+import useContext from "./hooks/useContext.js";
+const _hoisted_1 = ["href"];
+const _hoisted_2 = {
+  key: 0,
+  class: "yc-anchor-sublist"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "AnchorLink"
+  },
+  __name: "AnchorLink",
+  props: {
+    title: { default: "" },
+    href: { default: "" }
+  },
+  setup(__props) {
+    const props = __props;
+    const { href } = toRefs(props);
+    const { smooth, boundary, changeHash, curHref, lineLess, scrollContainer } = useContext().inject();
+    const handleClick = (e) => {
+      curHref.value = href.value;
+      if (changeHash.value) return;
+      e.preventDefault();
+      const anchorDom = getElement(href.value);
+      if (!anchorDom) return;
+      if (isNumber(boundary.value) && scrollContainer.value) {
+        const { top: anchorTop } = anchorDom.getBoundingClientRect();
+        const { top: containerTop } = scrollContainer.value.getBoundingClientRect();
+        const { scrollTop } = scrollContainer.value;
+        scrollContainer.value.scrollTo({
+          top: anchorTop - containerTop + scrollTop - boundary.value,
+          behavior: smooth.value ? "smooth" : "auto"
+        });
+      } else {
+        anchorDom.scrollIntoView({
+          block: boundary.value,
+          behavior: smooth.value ? "smooth" : "auto"
+        });
+      }
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass([
+          "yc-anchor-link-item",
+          {
+            "yc-anchor-link-active": unref(curHref) == unref(href) && !unref(lineLess),
+            "yc-anchor-link-lineless-active": unref(curHref) == unref(href) && unref(lineLess)
+          }
+        ])
+      }, [
+        createElementVNode("a", {
+          href: unref(href),
+          class: "yc-anchor-link",
+          onClick: handleClick,
+          ref: "linkRef"
+        }, [
+          renderSlot(_ctx.$slots, "default", {}, () => [
+            createTextVNode(toDisplayString(_ctx.title), 1)
+          ], true)
+        ], 8, _hoisted_1),
+        _ctx.$slots.sublist ? (openBlock(), createElementBlock("div", _hoisted_2, [
+          renderSlot(_ctx.$slots, "sublist", {}, void 0, true)
+        ])) : createCommentVNode("", true)
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/es/Anchor/hooks/useContext.d.ts

@@ -0,0 +1,23 @@
+import { Ref } from 'vue';
+import { Props } from '../../_shared/type';
+type AnchorContext = {
+    changeHash: Ref<boolean>;
+    smooth: Ref<boolean>;
+    boundary: Ref<string | number>;
+    lineLess: Ref<boolean>;
+    curHref: Ref<string>;
+    scrollContainer: Ref<HTMLElement | undefined>;
+};
+declare const _default: () => {
+    provide: (props: Props, listRef: Ref<HTMLDivElement | undefined>) => {
+        hrefs: import('vue').ComputedRef<any[]>;
+        curHref: Ref<string, string>;
+        changeHash: Ref<boolean, boolean>;
+        smooth: Ref<boolean, boolean>;
+        boundary: Ref<import('..').AnchorBoundary, import('..').AnchorBoundary>;
+        lineLess: Ref<boolean, boolean>;
+        scrollContainer: import('vue').ComputedRef<HTMLElement | undefined>;
+    };
+    inject: () => AnchorContext;
+};
+export default _default;

package/es/Anchor/hooks/useContext.js

@@ -0,0 +1,71 @@
+import { toRefs, useSlots, ref, computed, provide, inject } from "vue";
+import "../../node_modules/tinycolor2/esm/tinycolor.js";
+import { findFirstScrollableParent, getElement } from "../../_shared/utils/dom.js";
+import { isUndefined } from "../../_shared/utils/is.js";
+import "../../_shared/utils/time.js";
+import { findComponentsFromVnodes } from "../../_shared/utils/vue-utils.js";
+import "../../Empty/index.js";
+/* empty css                            */
+import AnchorLink from "../AnchorLink.vue.js";
+const ANCHOR_CONTEXT_KEY = "anchor-context";
+const useContext = () => {
+  const provide$1 = (props, listRef) => {
+    const {
+      changeHash,
+      smooth,
+      boundary,
+      lineLess,
+      scrollContainer: _scrollContainer
+    } = toRefs(props);
+    const slots = useSlots();
+    const curHref = ref("");
+    const hrefs = computed(() => {
+      var _a;
+      const nodes = findComponentsFromVnodes(
+        ((_a = slots.default) == null ? void 0 : _a.call(slots)) || [],
+        AnchorLink.name
+      );
+      return nodes.map((node) => {
+        var _a2;
+        return (_a2 = node.props) == null ? void 0 : _a2.href;
+      });
+    });
+    const scrollContainer = computed(() => {
+      return isUndefined(_scrollContainer.value) ? findFirstScrollableParent(listRef.value) : getElement(_scrollContainer.value);
+    });
+    provide(ANCHOR_CONTEXT_KEY, {
+      changeHash,
+      smooth,
+      boundary,
+      lineLess,
+      curHref,
+      scrollContainer
+    });
+    return {
+      hrefs,
+      curHref,
+      changeHash,
+      smooth,
+      boundary,
+      lineLess,
+      scrollContainer
+    };
+  };
+  const inject$1 = () => {
+    return inject(ANCHOR_CONTEXT_KEY, {
+      changeHash: ref(true),
+      smooth: ref(true),
+      boundary: ref("start"),
+      curHref: ref(""),
+      lineLess: ref(false),
+      scrollContainer: ref()
+    });
+  };
+  return {
+    provide: provide$1,
+    inject: inject$1
+  };
+};
+export {
+  useContext as default
+};

package/es/Anchor/index.d.ts

@@ -0,0 +1,77 @@
+import { App } from 'vue';
+import { default as _Anchor } from './Anchor.vue';
+import { default as _AnchorLink } from './AnchorLink.vue';
+export type AnchorInstance = InstanceType<typeof _Anchor>;
+export type AnchorLinkInstance = InstanceType<typeof _AnchorLink>;
+export * from './type';
+declare const Anchor: {
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./type').AnchorProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
+        smooth: boolean;
+        boundary: import('./type').AnchorBoundary;
+        changeHash: boolean;
+        lineLess: boolean;
+        scrollContainer: import('..').TargetContainer;
+    }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
+        listRef: HTMLDivElement;
+    }, HTMLDivElement, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('./type').AnchorProps> & Readonly<{}>, {}, {}, {}, {}, {
+        smooth: boolean;
+        boundary: import('./type').AnchorBoundary;
+        changeHash: boolean;
+        lineLess: boolean;
+        scrollContainer: import('..').TargetContainer;
+    }>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<import('./type').AnchorProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+    smooth: boolean;
+    boundary: import('./type').AnchorBoundary;
+    changeHash: boolean;
+    lineLess: boolean;
+    scrollContainer: import('..').TargetContainer;
+}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+    $slots: Readonly<import('./type').AnchorSlots> & import('./type').AnchorSlots;
+}) & {
+    link: {
+        new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./type').AnchorLinkProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
+            title: string;
+            href: string;
+        }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
+            linkRef: HTMLAnchorElement;
+        }, HTMLDivElement, import('vue').ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<import('./type').AnchorLinkProps> & Readonly<{}>, {}, {}, {}, {}, {
+            title: string;
+            href: string;
+        }>;
+        __isFragment?: never;
+        __isTeleport?: never;
+        __isSuspense?: never;
+    } & import('vue').ComponentOptionsBase<Readonly<import('./type').AnchorLinkProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+        title: string;
+        href: string;
+    }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+        $slots: Readonly<import('./type').AnchorLinkSlots> & import('./type').AnchorLinkSlots;
+    });
+    install: (app: App) => void;
+};
+export { _AnchorLink as AnchorLink };
+declare module 'vue' {
+    interface GlobalComponents {
+        YcAnchor: typeof Anchor;
+        YcAnchorLink: typeof _AnchorLink;
+    }
+}
+export default Anchor;

package/es/Anchor/index.js

@@ -0,0 +1,13 @@
+import _Anchor from "./Anchor.vue.js";
+import AnchorLink from "./AnchorLink.vue.js";
+const Anchor = Object.assign(_Anchor, {
+  link: AnchorLink,
+  install: (app) => {
+    app.component("Yc" + _Anchor.name, _Anchor);
+    app.component("Yc" + AnchorLink.name, AnchorLink);
+  }
+});
+export {
+  AnchorLink,
+  Anchor as default
+};

package/es/Anchor/type.d.ts

@@ -0,0 +1,20 @@
+import { TargetContainer } from '../_shared/type';
+export interface AnchorProps {
+    boundary?: AnchorBoundary;
+    lineLess?: boolean;
+    scrollContainer?: TargetContainer;
+    changeHash?: boolean;
+    smooth?: boolean;
+}
+export interface AnchorSlots {
+    default(): void;
+}
+export interface AnchorLinkProps {
+    title?: string;
+    href?: string;
+}
+export interface AnchorLinkSlots {
+    default(): void;
+    sublist(): void;
+}
+export type AnchorBoundary = 'start' | 'end' | 'center' | 'nearest' | number;