@talex-touch/tuffex 0.3.3

package/dist/es/outline-border/src/TxOutlineBorder.vue2.js

@@ -0,0 +1,162 @@
+import { defineComponent, computed, createBlock, openBlock, resolveDynamicComponent, normalizeStyle, withCtx, createElementVNode, renderSlot } from 'vue';
+
+const _hoisted_1 = { class: "tx-outline-border__inner" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "TxOutlineBorder"
+  },
+  __name: "TxOutlineBorder",
+  props: {
+    as: { default: "div" },
+    variant: { default: "ring-offset" },
+    shape: { default: "circle" },
+    borderRadius: { default: void 0 },
+    borderWidth: { default: "1px" },
+    borderColor: { default: "var(--tx-border-color)" },
+    borderStyle: { default: "solid" },
+    ringWidth: { default: void 0 },
+    ringColor: { default: void 0 },
+    offset: { default: "2px" },
+    offsetBg: { default: "var(--tx-bg-color)" },
+    padding: { default: 0 },
+    clipMode: { default: "overflow" },
+    clipShape: { default: "auto" }
+  },
+  setup(__props) {
+    const props = __props;
+    function toCssUnit(value) {
+      return typeof value === "number" ? `${value}px` : value;
+    }
+    const resolvedRadius = computed(() => {
+      if (props.borderRadius !== void 0)
+        return toCssUnit(props.borderRadius);
+      switch (props.shape) {
+        case "circle":
+          return "9999px";
+        case "squircle":
+          return "24%";
+        case "rect":
+        default:
+          return "12px";
+      }
+    });
+    const resolvedRingWidth = computed(() => toCssUnit(props.ringWidth ?? props.borderWidth));
+    const resolvedRingColor = computed(() => props.ringColor ?? props.borderColor);
+    const resolvedOffset = computed(() => toCssUnit(props.offset));
+    const resolvedClipShape = computed(() => {
+      if (props.clipShape !== "auto")
+        return props.clipShape;
+      return shapeToClipShape(props.shape);
+    });
+    function shapeToClipShape(shape) {
+      switch (shape) {
+        case "circle":
+          return "circle";
+        case "squircle":
+          return "squircle";
+        case "rect":
+        default:
+          return "rounded";
+      }
+    }
+    const boxShadow = computed(() => {
+      const w = resolvedRingWidth.value;
+      const c = resolvedRingColor.value;
+      const o = resolvedOffset.value;
+      const obg = props.offsetBg;
+      switch (props.variant) {
+        case "ring":
+          return `0 0 0 ${w} ${c}`;
+        case "ring-inset":
+          return `inset 0 0 0 ${w} ${c}`;
+        case "ring-offset":
+          return `0 0 0 ${o} ${obg}, 0 0 0 calc(${o} + ${w}) ${c}`;
+        default:
+          return "";
+      }
+    });
+    const rootStyle = computed(() => {
+      const style = {
+        "--tx-outline-radius": resolvedRadius.value,
+        "--tx-outline-padding": toCssUnit(props.padding)
+      };
+      if (props.variant === "border") {
+        style.border = `${toCssUnit(props.borderWidth)} ${props.borderStyle} ${props.borderColor}`;
+      } else if (boxShadow.value) {
+        style.boxShadow = boxShadow.value;
+      }
+      return style;
+    });
+    const clipStyle = computed(() => {
+      const mode = props.clipMode;
+      if (mode === "none")
+        return {};
+      const shape = resolvedClipShape.value;
+      const style = {};
+      if (mode === "overflow") {
+        style.borderRadius = "var(--tx-outline-radius)";
+        style.overflow = "hidden";
+        return style;
+      }
+      if (mode === "clipPath") {
+        style.clipPath = resolveClipPath(shape);
+        return style;
+      }
+      if (mode === "mask") {
+        const svg = resolveMaskSvg(shape);
+        if (!svg)
+          return {};
+        const url = `data:image/svg+xml;utf8,${encodeURIComponent(svg)}`;
+        style.WebkitMaskImage = `url("${url}")`;
+        style.maskImage = `url("${url}")`;
+        style.WebkitMaskRepeat = "no-repeat";
+        style.maskRepeat = "no-repeat";
+        style.WebkitMaskSize = "100% 100%";
+        style.maskSize = "100% 100%";
+        style.WebkitMaskPosition = "center";
+        style.maskPosition = "center";
+        return style;
+      }
+      return {};
+    });
+    function resolveClipPath(shape) {
+      if (shape === "circle")
+        return "circle(50% at 50% 50%)";
+      if (shape === "hexagon")
+        return "polygon(50% 1%, 93% 25%, 93% 75%, 50% 99%, 7% 75%, 7% 25%)";
+      return "inset(0 round var(--tx-outline-radius))";
+    }
+    function resolveMaskSvg(shape) {
+      if (shape === "circle") {
+        return '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="50" cy="50" r="50" fill="black"/></svg>';
+      }
+      if (shape === "hexagon") {
+        return '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><polygon points="50 1 93 25 93 75 50 99 7 75 7 25" fill="black"/></svg>';
+      }
+      if (shape === "squircle") {
+        return '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M50 0C16 0 0 16 0 50s16 50 50 50 50-16 50-50S84 0 50 0Z" fill="black"/></svg>';
+      }
+      return null;
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(resolveDynamicComponent(__props.as), {
+        class: "tx-outline-border",
+        style: normalizeStyle(rootStyle.value)
+      }, {
+        default: withCtx(() => [
+          createElementVNode("span", {
+            class: "tx-outline-border__content",
+            style: normalizeStyle(clipStyle.value)
+          }, [
+            createElementVNode("span", _hoisted_1, [
+              renderSlot(_ctx.$slots, "default", {}, void 0, true)
+            ])
+          ], 4)
+        ]),
+        _: 3
+      }, 8, ["style"]);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/dist/es/outline-border/src/types.d.ts

@@ -0,0 +1,20 @@
+export type OutlineShape = 'circle' | 'rect' | 'squircle';
+export type OutlineBorderVariant = 'border' | 'ring' | 'ring-offset' | 'ring-inset';
+export type OutlineClipMode = 'none' | 'overflow' | 'clipPath' | 'mask';
+export type OutlineClipShape = 'auto' | 'circle' | 'rounded' | 'squircle' | 'hexagon';
+export interface OutlineBorderProps {
+    as?: string;
+    variant?: OutlineBorderVariant;
+    shape?: OutlineShape;
+    borderRadius?: string | number;
+    borderWidth?: string | number;
+    borderColor?: string;
+    borderStyle?: 'solid' | 'dashed' | 'dotted';
+    ringWidth?: string | number;
+    ringColor?: string;
+    offset?: string | number;
+    offsetBg?: string;
+    padding?: string | number;
+    clipMode?: OutlineClipMode;
+    clipShape?: OutlineClipShape;
+}

package/dist/es/pagination/index.d.ts

@@ -0,0 +1 @@
+export * from './src';

package/dist/es/pagination/src/TxPagination.vue.d.ts

@@ -0,0 +1,63 @@
+import { PaginationProps } from './types';
+
+interface Props extends PaginationProps {
+}
+declare function __VLS_template(): {
+    info?(_: {
+        currentPage: number;
+        totalPages: number;
+        total: number | undefined;
+    }): any;
+};
+declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
+    currentPage: number;
+    pageSize: number;
+    prevIcon: string;
+    nextIcon: string;
+    showInfo: boolean;
+    showFirstLast: boolean;
+}>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:currentPage": (page: number) => void;
+    pageChange: (page: number) => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
+    currentPage: number;
+    pageSize: number;
+    prevIcon: string;
+    nextIcon: string;
+    showInfo: boolean;
+    showFirstLast: boolean;
+}>>> & Readonly<{
+    "onUpdate:currentPage"?: ((page: number) => any) | undefined;
+    onPageChange?: ((page: number) => any) | undefined;
+}>, {
+    currentPage: number;
+    pageSize: number;
+    prevIcon: string;
+    nextIcon: string;
+    showInfo: boolean;
+    showFirstLast: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/es/pagination/src/TxPagination.vue.js

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

package/dist/es/pagination/src/TxPagination.vue2.js

@@ -0,0 +1,136 @@
+import { defineComponent, computed, createElementBlock, openBlock, createElementVNode, createCommentVNode, normalizeClass, createVNode, unref, Fragment, renderList, toDisplayString, renderSlot, createTextVNode } from 'vue';
+import { TxIcon } from '../../icon/index.js';
+
+const _hoisted_1 = {
+  class: "tx-pagination",
+  "aria-label": "Pagination"
+};
+const _hoisted_2 = { class: "tx-pagination__list" };
+const _hoisted_3 = { class: "tx-pagination__item" };
+const _hoisted_4 = ["disabled"];
+const _hoisted_5 = ["aria-current", "onClick"];
+const _hoisted_6 = {
+  key: 1,
+  class: "tx-pagination__ellipsis"
+};
+const _hoisted_7 = { class: "tx-pagination__item" };
+const _hoisted_8 = ["disabled"];
+const _hoisted_9 = {
+  key: 0,
+  class: "tx-pagination__info"
+};
+const _hoisted_10 = { key: 0 };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "TxPagination",
+  props: {
+    currentPage: { default: 1 },
+    pageSize: { default: 10 },
+    total: {},
+    totalPages: {},
+    prevIcon: { default: "chevron-left" },
+    nextIcon: { default: "chevron-right" },
+    showInfo: { type: Boolean, default: false },
+    showFirstLast: { type: Boolean, default: false }
+  },
+  emits: ["update:currentPage", "pageChange"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const totalPages = computed(() => {
+      if (props.total) {
+        return Math.ceil(props.total / props.pageSize);
+      }
+      return props.totalPages || 1;
+    });
+    const visiblePages = computed(() => {
+      const pages = [];
+      const current = props.currentPage;
+      const total = totalPages.value;
+      if (total <= 7) {
+        for (let i = 1; i <= total; i++) {
+          pages.push(i);
+        }
+      } else {
+        if (current <= 4) {
+          for (let i = 1; i <= 5; i++) {
+            pages.push(i);
+          }
+          pages.push("...");
+          pages.push(total);
+        } else if (current >= total - 3) {
+          pages.push(1);
+          pages.push("...");
+          for (let i = total - 4; i <= total; i++) {
+            pages.push(i);
+          }
+        } else {
+          pages.push(1);
+          pages.push("...");
+          for (let i = current - 1; i <= current + 1; i++) {
+            pages.push(i);
+          }
+          pages.push("...");
+          pages.push(total);
+        }
+      }
+      return pages;
+    });
+    function handlePageChange(page) {
+      if (page < 1 || page > totalPages.value)
+        return;
+      emit("update:currentPage", page);
+      emit("pageChange", page);
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("nav", _hoisted_1, [
+        createElementVNode("ul", _hoisted_2, [
+          createElementVNode("li", _hoisted_3, [
+            createElementVNode("button", {
+              class: normalizeClass(["tx-pagination__button", { "tx-pagination__button--disabled": __props.currentPage <= 1 }]),
+              disabled: __props.currentPage <= 1,
+              "aria-label": "Previous page",
+              onClick: _cache[0] || (_cache[0] = ($event) => handlePageChange(__props.currentPage - 1))
+            }, [
+              createVNode(unref(TxIcon), { name: __props.prevIcon }, null, 8, ["name"])
+            ], 10, _hoisted_4)
+          ]),
+          (openBlock(true), createElementBlock(Fragment, null, renderList(visiblePages.value, (page) => {
+            return openBlock(), createElementBlock("li", {
+              key: page,
+              class: "tx-pagination__item"
+            }, [
+              page !== "..." ? (openBlock(), createElementBlock("button", {
+                key: 0,
+                class: normalizeClass(["tx-pagination__button", { "tx-pagination__button--active": page === __props.currentPage }]),
+                "aria-current": page === __props.currentPage ? "page" : void 0,
+                onClick: ($event) => handlePageChange(page)
+              }, toDisplayString(page), 11, _hoisted_5)) : (openBlock(), createElementBlock("span", _hoisted_6, "..."))
+            ]);
+          }), 128)),
+          createElementVNode("li", _hoisted_7, [
+            createElementVNode("button", {
+              class: normalizeClass(["tx-pagination__button", { "tx-pagination__button--disabled": __props.currentPage >= totalPages.value }]),
+              disabled: __props.currentPage >= totalPages.value,
+              "aria-label": "Next page",
+              onClick: _cache[1] || (_cache[1] = ($event) => handlePageChange(__props.currentPage + 1))
+            }, [
+              createVNode(unref(TxIcon), { name: __props.nextIcon }, null, 8, ["name"])
+            ], 10, _hoisted_8)
+          ])
+        ]),
+        __props.showInfo ? (openBlock(), createElementBlock("div", _hoisted_9, [
+          renderSlot(_ctx.$slots, "info", {
+            currentPage: __props.currentPage,
+            totalPages: totalPages.value,
+            total: __props.total
+          }, () => [
+            createTextVNode(" Page " + toDisplayString(__props.currentPage) + " of " + toDisplayString(totalPages.value) + " ", 1),
+            __props.total ? (openBlock(), createElementBlock("span", _hoisted_10, "(" + toDisplayString(__props.total) + " items)", 1)) : createCommentVNode("", true)
+          ], true)
+        ])) : createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/dist/es/pagination/src/index.d.ts

@@ -0,0 +1,2 @@
+export { default as TxPagination } from './TxPagination.vue';
+export type { PaginationEmits, PaginationProps } from './types';

package/dist/es/pagination/src/types.d.ts

@@ -0,0 +1,14 @@
+export interface PaginationProps {
+    currentPage?: number;
+    pageSize?: number;
+    total?: number;
+    totalPages?: number;
+    prevIcon?: string;
+    nextIcon?: string;
+    showInfo?: boolean;
+    showFirstLast?: boolean;
+}
+export interface PaginationEmits {
+    'update:currentPage': [page: number];
+    'pageChange': [page: number];
+}

package/dist/es/permission-state/index.d.ts

@@ -0,0 +1,131 @@
+import { PermissionStateProps } from './src/types';
+import { default as component } from './src/TxPermissionState.vue';
+
+declare const TxPermissionState: {
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+        title: {
+            type: import('vue').PropType<string>;
+        };
+        description: {
+            type: import('vue').PropType<string>;
+        };
+        loading: {
+            type: import('vue').PropType<boolean>;
+        };
+        icon: {
+            type: import('vue').PropType<string | import('..').TxIconSource | null>;
+        };
+        size: {
+            type: import('vue').PropType<import('..').EmptyStateSize>;
+        };
+        iconSize: {
+            type: import('vue').PropType<number>;
+        };
+        layout: {
+            type: import('vue').PropType<import('..').EmptyStateLayout>;
+        };
+        align: {
+            type: import('vue').PropType<import('..').EmptyStateAlign>;
+        };
+        surface: {
+            type: import('vue').PropType<import('..').EmptyStateSurface>;
+        };
+        primaryAction: {
+            type: import('vue').PropType<import('..').EmptyStateAction>;
+        };
+        secondaryAction: {
+            type: import('vue').PropType<import('..').EmptyStateAction>;
+        };
+        actionSize: {
+            type: import('vue').PropType<"small" | "large" | "sm" | "md" | "lg" | "mini">;
+        };
+    }>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('vue').ExtractPropTypes<{
+        title: {
+            type: import('vue').PropType<string>;
+        };
+        description: {
+            type: import('vue').PropType<string>;
+        };
+        loading: {
+            type: import('vue').PropType<boolean>;
+        };
+        icon: {
+            type: import('vue').PropType<string | import('..').TxIconSource | null>;
+        };
+        size: {
+            type: import('vue').PropType<import('..').EmptyStateSize>;
+        };
+        iconSize: {
+            type: import('vue').PropType<number>;
+        };
+        layout: {
+            type: import('vue').PropType<import('..').EmptyStateLayout>;
+        };
+        align: {
+            type: import('vue').PropType<import('..').EmptyStateAlign>;
+        };
+        surface: {
+            type: import('vue').PropType<import('..').EmptyStateSurface>;
+        };
+        primaryAction: {
+            type: import('vue').PropType<import('..').EmptyStateAction>;
+        };
+        secondaryAction: {
+            type: import('vue').PropType<import('..').EmptyStateAction>;
+        };
+        actionSize: {
+            type: import('vue').PropType<"small" | "large" | "sm" | "md" | "lg" | "mini">;
+        };
+    }>> & Readonly<{}>, {}, {}, {}, {}, {}>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+    title: {
+        type: import('vue').PropType<string>;
+    };
+    description: {
+        type: import('vue').PropType<string>;
+    };
+    loading: {
+        type: import('vue').PropType<boolean>;
+    };
+    icon: {
+        type: import('vue').PropType<string | import('..').TxIconSource | null>;
+    };
+    size: {
+        type: import('vue').PropType<import('..').EmptyStateSize>;
+    };
+    iconSize: {
+        type: import('vue').PropType<number>;
+    };
+    layout: {
+        type: import('vue').PropType<import('..').EmptyStateLayout>;
+    };
+    align: {
+        type: import('vue').PropType<import('..').EmptyStateAlign>;
+    };
+    surface: {
+        type: import('vue').PropType<import('..').EmptyStateSurface>;
+    };
+    primaryAction: {
+        type: import('vue').PropType<import('..').EmptyStateAction>;
+    };
+    secondaryAction: {
+        type: import('vue').PropType<import('..').EmptyStateAction>;
+    };
+    actionSize: {
+        type: import('vue').PropType<"small" | "large" | "sm" | "md" | "lg" | "mini">;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & import('vue').Plugin;
+export { TxPermissionState };
+export type { PermissionStateProps };
+export type TxPermissionStateInstance = InstanceType<typeof component>;
+export default TxPermissionState;

package/dist/es/permission-state/index.js

@@ -0,0 +1,6 @@
+import { withInstall } from '../utils/withInstall.js';
+import _sfc_main from './src/TxPermissionState.vue.js';
+
+const TxPermissionState = withInstall(_sfc_main);
+
+export { TxPermissionState, TxPermissionState as default };

package/dist/es/permission-state/src/TxPermissionState.vue.d.ts

@@ -0,0 +1,13 @@
+import { PermissionStateProps } from './types';
+
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<PermissionStateProps>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<PermissionStateProps>>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/dist/es/permission-state/src/TxPermissionState.vue.js

@@ -0,0 +1,35 @@
+import { defineComponent, useSlots, resolveDirective, withDirectives, createBlock, openBlock, unref, mergeProps } from 'vue';
+import { TxEmptyState } from '../../empty-state/index.js';
+
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "TxPermissionState"
+  },
+  __name: "TxPermissionState",
+  props: {
+    title: {},
+    description: {},
+    icon: {},
+    iconSize: {},
+    layout: {},
+    align: {},
+    size: {},
+    surface: {},
+    primaryAction: {},
+    secondaryAction: {},
+    actionSize: {},
+    loading: { type: Boolean }
+  },
+  setup(__props) {
+    const props = __props;
+    const slots = useSlots();
+    return (_ctx, _cache) => {
+      const _directive_slots = resolveDirective("slots");
+      return withDirectives((openBlock(), createBlock(unref(TxEmptyState), mergeProps(props, { variant: "permission" }), null, 16)), [
+        [_directive_slots, unref(slots)]
+      ]);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/dist/es/permission-state/src/TxPermissionState.vue2.js

@@ -0,0 +1,5 @@
+import _sfc_main from './TxPermissionState.vue.js';
+
+
+
+export { _sfc_main as default };

package/dist/es/permission-state/src/types.d.ts

@@ -0,0 +1,3 @@
+import { EmptyStateProps } from '../../empty-state';
+
+export type PermissionStateProps = Omit<EmptyStateProps, 'variant'>;