@movk/nuxt 1.1.2 → 1.3.0

package/dist/runtime/domains/data-table/components/ActionConfirm.vue.d.ts

@@ -0,0 +1,10 @@
+import type { ButtonProps } from '@nuxt/ui';
+import type { DataTableAction, DataTableActionButtonContext, DataTableDynamic } from '../../../types/data-table';
+interface DataTableRendererActionConfirmProps {
+    action: DataTableAction<unknown>;
+    ctx: DataTableActionButtonContext<unknown>;
+    globalButtonProps?: DataTableDynamic<ButtonProps, DataTableActionButtonContext<unknown>>;
+}
+declare const __VLS_export: import("vue").DefineComponent<DataTableRendererActionConfirmProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DataTableRendererActionConfirmProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/domains/data-table/components/ActionsCell.d.vue.ts

@@ -0,0 +1,11 @@
+import type { CellContext } from '@tanstack/vue-table';
+import type { DataTableActionsColumn } from '../../../types/data-table';
+import type { DataTableProps } from '../../../types/data-table/component';
+interface DataTableRendererActionsCellProps {
+    col: DataTableActionsColumn<unknown>;
+    cellCtx: CellContext<unknown, unknown>;
+    options: DataTableProps<any>;
+}
+declare const __VLS_export: import("vue").DefineComponent<DataTableRendererActionsCellProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DataTableRendererActionsCellProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/domains/data-table/components/ActionsCell.vue

@@ -0,0 +1,91 @@
+<script setup>
+import { h } from "vue";
+import { isFunction } from "@movk/core";
+import { resolveCallbackValue } from "../columns/utils";
+import { useMessageBox } from "../../../composables/useMessageBox";
+import { UButton, UDropdownMenu } from "#components";
+import DataTableActionConfirm from "./ActionConfirm.vue";
+const props = defineProps({
+  col: { type: Object, required: true },
+  cellCtx: { type: Object, required: true },
+  options: { type: Object, required: true }
+});
+const { confirm } = useMessageBox();
+function buildActionCtx(action) {
+  return {
+    cellContext: props.cellCtx,
+    row: props.cellCtx.row.original,
+    index: props.cellCtx.row.index,
+    action
+  };
+}
+function renderInline(action, idx) {
+  const actionCtx = buildActionCtx(action);
+  return h(DataTableActionConfirm, {
+    key: action.key ?? `${idx}`,
+    action,
+    ctx: actionCtx,
+    globalButtonProps: props.options.actionButtonProps
+  });
+}
+function renderOverflow(actions) {
+  const groups = [];
+  let currentGroup = [];
+  for (const action of actions) {
+    if (action.divider && currentGroup.length > 0) {
+      groups.push(currentGroup);
+      currentGroup = [];
+    }
+    const actionCtx = buildActionCtx(action);
+    const resolved = resolveCallbackValue(action.buttonProps ?? {}, actionCtx);
+    const isDisabled = resolveCallbackValue(action.disabled ?? false, actionCtx);
+    currentGroup.push({
+      label: resolved.label ?? "",
+      icon: resolved.icon,
+      color: resolved.color,
+      disabled: isDisabled,
+      onSelect: async (e) => {
+        e.stopPropagation();
+        if (action.confirm) {
+          const ok = await confirm(resolveCallbackValue(action.confirmProps ?? {}, actionCtx));
+          if (!ok) return;
+        }
+        await action.onClick(actionCtx);
+      }
+    });
+  }
+  if (currentGroup.length > 0) groups.push(currentGroup);
+  const triggerProps = {
+    variant: "ghost",
+    size: "xs",
+    color: "neutral",
+    icon: "i-lucide-ellipsis",
+    ...resolveCallbackValue(props.options.actionsOverflowTrigger ?? {}, props.cellCtx),
+    ...resolveCallbackValue(props.col.overflowTrigger ?? {}, props.cellCtx)
+  };
+  const dropdownProps = resolveCallbackValue(props.col.dropdownProps ?? {}, props.cellCtx);
+  return h(UDropdownMenu, { ...dropdownProps, items: groups }, {
+    default: () => h(UButton, { ...triggerProps, onClick: (e) => e.stopPropagation() })
+  });
+}
+function render() {
+  const actionList = isFunction(props.col.actions) ? props.col.actions(props.cellCtx) : props.col.actions;
+  const visible = actionList.filter(
+    (a) => resolveCallbackValue(a.visibility ?? true, buildActionCtx(a))
+  );
+  if (visible.length === 0) return null;
+  const maxInline = props.col.maxInline ?? props.options.actionsMaxInline ?? 3;
+  const shouldOverflow = visible.length > maxInline;
+  const inline = shouldOverflow ? visible.slice(0, maxInline - 1) : visible;
+  const overflow = shouldOverflow ? visible.slice(maxInline - 1) : [];
+  const wrapperClass = isFunction(props.col.wrapperClass) ? props.col.wrapperClass(props.cellCtx) : props.col.wrapperClass ?? "flex items-center gap-1";
+  return h("div", { class: wrapperClass }, [
+    ...inline.map((action, idx) => renderInline(action, idx)),
+    overflow.length > 0 ? renderOverflow(overflow) : null
+  ]);
+}
+</script>
+
+<template>
+  <render />
+</template>

package/dist/runtime/domains/data-table/components/ActionsCell.vue.d.ts

@@ -0,0 +1,11 @@
+import type { CellContext } from '@tanstack/vue-table';
+import type { DataTableActionsColumn } from '../../../types/data-table';
+import type { DataTableProps } from '../../../types/data-table/component';
+interface DataTableRendererActionsCellProps {
+    col: DataTableActionsColumn<unknown>;
+    cellCtx: CellContext<unknown, unknown>;
+    options: DataTableProps<any>;
+}
+declare const __VLS_export: import("vue").DefineComponent<DataTableRendererActionsCellProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DataTableRendererActionsCellProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/domains/data-table/components/CellTooltip.d.vue.ts

@@ -0,0 +1,9 @@
+interface DataTableRendererCellTooltipProps {
+    /** 单元格显示文本，溢出时作为 Tooltip 内容 */
+    text: string;
+    /** true = 单行截断，number = 多行截断行数（-webkit-line-clamp） */
+    lines?: boolean | number;
+}
+declare const __VLS_export: import("vue").DefineComponent<DataTableRendererCellTooltipProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DataTableRendererCellTooltipProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/domains/data-table/components/CellTooltip.vue

@@ -0,0 +1,40 @@
+<script setup>
+import { UTooltip } from "#components";
+import { computed, useAttrs, useTemplateRef } from "vue";
+import { useOverflowDetection } from "@movk/core";
+defineOptions({ inheritAttrs: false });
+const props = defineProps({
+  text: { type: String, required: true },
+  lines: { type: [Boolean, Number], required: false }
+});
+const attrs = useAttrs();
+const cellRef = useTemplateRef("cellRef");
+const { overflowed } = useOverflowDetection(cellRef);
+const isMultiline = computed(() => typeof props.lines === "number" && props.lines > 1);
+const multilineStyle = computed(
+  () => isMultiline.value ? {
+    "-webkit-line-clamp": props.lines,
+    "display": "-webkit-box",
+    "-webkit-box-orient": "vertical",
+    "overflow": "hidden",
+    "white-space": "normal",
+    "word-break": "break-all"
+  } : void 0
+);
+</script>
+
+<template>
+  <UTooltip
+    :disabled="!overflowed"
+    :text="text"
+    v-bind="attrs"
+  >
+    <div
+      ref="cellRef"
+      :class="isMultiline ? 'overflow-hidden' : 'truncate'"
+      :style="multilineStyle"
+    >
+      {{ text }}
+    </div>
+  </UTooltip>
+</template>

package/dist/runtime/domains/data-table/components/CellTooltip.vue.d.ts

@@ -0,0 +1,9 @@
+interface DataTableRendererCellTooltipProps {
+    /** 单元格显示文本，溢出时作为 Tooltip 内容 */
+    text: string;
+    /** true = 单行截断，number = 多行截断行数（-webkit-line-clamp） */
+    lines?: boolean | number;
+}
+declare const __VLS_export: import("vue").DefineComponent<DataTableRendererCellTooltipProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DataTableRendererCellTooltipProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/domains/data-table/components/Pagination.d.vue.ts

@@ -0,0 +1,26 @@
+import type { TableData } from '@nuxt/ui';
+import type { DataTablePaginationProps, DataTablePaginationSlots, DataTablePaginationUi } from '../../../types/data-table/pagination';
+declare const __VLS_export: <T extends TableData>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import("vue").PublicProps & __VLS_PrettifyLocal<DataTablePaginationProps<T> & {
+        uiConfig?: DataTablePaginationUi & {
+            ui?: {
+                [x: string]: import("tailwind-variants").ClassValue;
+            };
+        };
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: {}) => void;
+    attrs: any;
+    slots: DataTablePaginationSlots<T>;
+    emit: {};
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};

package/dist/runtime/domains/data-table/components/Pagination.vue

@@ -0,0 +1,132 @@
+<script setup>
+import { UPagination, USelect } from "#components";
+import { useAppConfig } from "#imports";
+import { computed } from "vue";
+import { tv } from "@nuxt/ui/utils/tv";
+import theme from "#build/movk-ui/data-table-pagination";
+const props = defineProps({
+  tableApi: { type: Object, required: true },
+  pagination: { type: Object, required: true },
+  page: { type: Number, required: true },
+  rowCount: { type: Number, required: true },
+  rowCountKnown: { type: Boolean, required: true },
+  pageCount: { type: Number, required: true },
+  from: { type: Number, required: true },
+  to: { type: Number, required: true },
+  selectedCount: { type: Number, required: true },
+  setPage: { type: Function, required: true },
+  setPageSize: { type: Function, required: true },
+  uiConfig: { type: Object, required: false }
+});
+defineSlots();
+const appConfig = useAppConfig();
+const uiCls = computed(
+  () => tv({ extend: tv(theme), ...appConfig.movk?.dataTablePagination || {} })()
+);
+const cfg = computed(() => ({
+  pageSizes: props.uiConfig?.pageSizes ?? [],
+  showSelectedCount: props.uiConfig?.showSelectedCount ?? true,
+  showRowRange: props.uiConfig?.showRowRange ?? true,
+  paginationProps: props.uiConfig?.paginationProps,
+  pageSizeSelectProps: props.uiConfig?.pageSizeSelectProps,
+  ui: props.uiConfig?.ui
+}));
+const text = computed(() => ({
+  total: props.uiConfig?.text?.total ?? "\u5171",
+  item: props.uiConfig?.text?.item ?? "\u6761",
+  range: props.uiConfig?.text?.range ?? "\u663E\u793A",
+  selected: props.uiConfig?.text?.selected ?? "\u5DF2\u9009",
+  page: props.uiConfig?.text?.page ?? "\u9875"
+}));
+const pageSizeOptions = computed(
+  () => cfg.value.pageSizes.map((size) => ({
+    label: `${size} ${text.value.item}/\u9875`,
+    value: size
+  }))
+);
+const showPageSizeSelect = computed(() => cfg.value.pageSizes.length > 1);
+const pageSizeSelectAttrs = computed(() => ({
+  ...cfg.value.pageSizeSelectProps,
+  class: uiCls.value.pageSizeSelect({ class: cfg.value.pageSizeSelectProps?.class })
+}));
+const paginationAttrs = computed(() => ({
+  ...cfg.value.paginationProps,
+  class: uiCls.value.pagination({ class: cfg.value.paginationProps?.class })
+}));
+const summaryText = computed(() => {
+  if (!props.rowCountKnown) {
+    if (props.from === 0) return `${text.value.range} 0`;
+    return `${text.value.range} ${props.from}-${props.to}\uFF0C\u7B2C ${props.page} / ${props.pageCount} ${text.value.page}`;
+  }
+  if (!cfg.value.showRowRange || props.rowCount === 0) {
+    return `${text.value.total} ${props.rowCount} ${text.value.item}`;
+  }
+  return `${text.value.range} ${props.from}-${props.to}\uFF0C${text.value.total} ${props.rowCount} ${text.value.item}`;
+});
+const selectedText = computed(
+  () => `${text.value.selected} ${props.selectedCount} ${text.value.item}`
+);
+const summarySlotProps = computed(() => ({
+  summaryText: summaryText.value,
+  selectedText: selectedText.value,
+  selectedCount: props.selectedCount,
+  rowCount: props.rowCount,
+  rowCountKnown: props.rowCountKnown,
+  from: props.from,
+  to: props.to,
+  page: props.page,
+  pageCount: props.pageCount,
+  showSelectedCount: cfg.value.showSelectedCount
+}));
+const actionsSlotProps = computed(() => ({
+  tableApi: props.tableApi,
+  page: props.page,
+  pageCount: props.pageCount,
+  pageSize: props.pagination.pageSize,
+  rowCount: props.rowCount,
+  pageSizes: cfg.value.pageSizes,
+  pageSizeOptions: pageSizeOptions.value,
+  showPageSizeSelect: showPageSizeSelect.value,
+  setPage: props.setPage,
+  setPageSize: props.setPageSize
+}));
+const setPage = (value) => props.setPage(value);
+const setPageSize = (value) => props.setPageSize(value);
+</script>
+
+<template>
+  <div :class="uiCls.root({ class: cfg.ui?.root })" data-slot="root">
+    <div :class="uiCls.summary({ class: cfg.ui?.summary })" data-slot="summary">
+      <slot name="summary" v-bind="summarySlotProps">
+        <span :class="uiCls.summaryText({ class: cfg.ui?.summaryText })">{{ summaryText }}</span>
+        <span
+          v-if="cfg.showSelectedCount && selectedCount > 0"
+          :class="uiCls.selectedCount({ class: cfg.ui?.selectedCount })"
+        >
+          {{ selectedText }}
+        </span>
+      </slot>
+    </div>
+
+    <div :class="uiCls.actions({ class: cfg.ui?.actions })" data-slot="actions">
+      <slot name="actions" v-bind="actionsSlotProps">
+        <USelect
+          v-if="showPageSizeSelect"
+          :model-value="pagination.pageSize"
+          :items="pageSizeOptions"
+          v-bind="pageSizeSelectAttrs"
+          @update:model-value="setPageSize"
+        />
+
+        <UPagination
+          :page="page"
+          :total="pageCount * pagination.pageSize"
+          :items-per-page="pagination.pageSize"
+          v-bind="paginationAttrs"
+          data-slot="pagination"
+          @update:page="setPage"
+        />
+      </slot>
+    </div>
+  </div>
+</template>

package/dist/runtime/domains/data-table/components/Pagination.vue.d.ts

@@ -0,0 +1,26 @@
+import type { TableData } from '@nuxt/ui';
+import type { DataTablePaginationProps, DataTablePaginationSlots, DataTablePaginationUi } from '../../../types/data-table/pagination';
+declare const __VLS_export: <T extends TableData>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import("vue").PublicProps & __VLS_PrettifyLocal<DataTablePaginationProps<T> & {
+        uiConfig?: DataTablePaginationUi & {
+            ui?: {
+                [x: string]: import("tailwind-variants").ClassValue;
+            };
+        };
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: {}) => void;
+    attrs: any;
+    slots: DataTablePaginationSlots<T>;
+    emit: {};
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};

package/dist/runtime/domains/data-table/indent.d.ts

@@ -0,0 +1,8 @@
+import type { DataTableProps } from '../../types/data-table';
+/**
+ * 计算给定 `indentSize` 在 `[0, maxButtonDepth]` 范围内的最大缩进像素
+ *
+ * - `number` / `string`：等差缩进 `depth * step`，取 `maxButtonDepth * step`
+ * - `function`：对每个 depth 评估并取最大值；评估失败回退 0
+ */
+export declare function resolveMaxIndentPx<T>(size: DataTableProps<T>['indentSize'], maxButtonDepth: number): number;

package/dist/runtime/domains/data-table/indent.js

@@ -0,0 +1,19 @@
+import { lengthToPx } from "@movk/core";
+export function resolveMaxIndentPx(size, maxButtonDepth) {
+  if (maxButtonDepth <= 0) return 0;
+  if (typeof size === "number") return size * maxButtonDepth;
+  if (typeof size === "string") return lengthToPx(size) * maxButtonDepth;
+  if (typeof size === "function") {
+    let max = 0;
+    for (let d = 1; d <= maxButtonDepth; d++) {
+      try {
+        const ret = size({ row: { depth: d } });
+        const px = typeof ret === "number" ? ret : typeof ret === "string" ? lengthToPx(ret) : 0;
+        if (px > max) max = px;
+      } catch {
+      }
+    }
+    return max;
+  }
+  return 0;
+}

package/dist/runtime/domains/data-table/tree-selection.d.ts

@@ -0,0 +1,9 @@
+import type { DataTableTreeSelectionStrategy } from '../../types/data-table';
+import type { TreeSelectionResult } from '../../types/data-table/columns';
+interface ComputeOptions {
+    rowKey?: string;
+    childrenKey?: string;
+    strategy?: DataTableTreeSelectionStrategy;
+}
+export declare function computeTreeRowSelection<T>(rows: T[], keys: readonly (string | number)[], options?: ComputeOptions): TreeSelectionResult<T>;
+export {};

package/dist/runtime/domains/data-table/tree-selection.js

@@ -0,0 +1,76 @@
+export function computeTreeRowSelection(rows, keys, options = {}) {
+  const rowKey = options.rowKey ?? "id";
+  const childrenKey = options.childrenKey;
+  const strategy = options.strategy ?? "cascade";
+  const keySet = new Set(keys.map(String));
+  const selected = [];
+  const leaves = [];
+  const parents = [];
+  const halfSelected = [];
+  const strictlyChecked = [];
+  const readKey = (row, key) => row[key];
+  if (!childrenKey) {
+    for (const row of rows) {
+      if (keySet.has(String(readKey(row, rowKey)))) {
+        selected.push(row);
+        leaves.push(row);
+        strictlyChecked.push(row);
+      }
+    }
+    return { selected, leaves, parents, halfSelected, strictlyChecked };
+  }
+  const build = (items, parent) => {
+    const list = [];
+    for (const row of items) {
+      const id = String(readKey(row, rowKey));
+      const selfSelected = keySet.has(id);
+      const node = {
+        row,
+        id,
+        parent,
+        children: [],
+        selfSelected,
+        leafTotal: 0,
+        leafSelected: 0
+      };
+      const childArr = readKey(row, childrenKey);
+      if (Array.isArray(childArr) && childArr.length > 0) {
+        node.children = build(childArr, node);
+        for (const c of node.children) {
+          node.leafTotal += c.leafTotal;
+          node.leafSelected += c.leafSelected;
+        }
+      } else {
+        node.leafTotal = 1;
+        node.leafSelected = selfSelected ? 1 : 0;
+      }
+      list.push(node);
+    }
+    return list;
+  };
+  const roots = build(rows, null);
+  const visit = (node) => {
+    const isLeaf = node.children.length === 0;
+    if (node.selfSelected) {
+      selected.push(node.row);
+      if (isLeaf) leaves.push(node.row);
+      if (strategy === "cascade") {
+        if (!node.parent || !node.parent.selfSelected) {
+          strictlyChecked.push(node.row);
+        }
+      } else {
+        strictlyChecked.push(node.row);
+      }
+    }
+    if (!isLeaf) {
+      if (node.leafTotal > 0 && node.leafSelected === node.leafTotal) {
+        parents.push(node.row);
+      } else if (node.leafSelected > 0) {
+        halfSelected.push(node.row);
+      }
+    }
+    for (const child of node.children) visit(child);
+  };
+  for (const root of roots) visit(root);
+  return { selected, leaves, parents, halfSelected, strictlyChecked };
+}

package/dist/runtime/{utils/theme.d.ts → domains/theme/theme-icons.d.ts}

@@ -132,4 +132,3 @@ export declare const themeIcons: {
         warning: string;
     };
 };
-export type ThemeIcons = keyof typeof themeIcons;

package/dist/runtime/index.css

@@ -0,0 +1 @@
+@import "tailwindcss" theme(static);@import "@nuxt/ui";@import "#build/movk-ui.css";@source "./components";@theme static{--font-sans:"Alibaba PuHuiTi",sans-serif}@layer base{[role=button]:not(:disabled),button:not(:disabled){cursor:pointer}}