@vunset/vue 0.0.0-stage → 1.0.0-rc.2

package/dist/components/copy/Copy.vue.d.ts

@@ -0,0 +1,57 @@
+import type { ClipboardStatus } from '../../composables/use-clipboard';
+export interface CopyState {
+    /** `copied` or `error` for a moment after a copy, `idle` otherwise. */
+    status: ClipboardStatus;
+    /** Whether the last copy worked, for as long as `timeout` says. */
+    copied: boolean;
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
+    /** The text to copy. */
+    value: string;
+    /** Text beside the icon. Without it, or content of your own, the button is labeled "Copy". */
+    label?: string;
+    /** The icon at rest, by name: from `configureIcons`' folder, or else the sprite. A built-in one otherwise. @default 'copy' */
+    icon?: string;
+    /** The icon once copied, by name, the same way. @default 'copied' */
+    copiedIcon?: string;
+    /** How long, in milliseconds, it says it copied before settling back. @default 1500 */
+    timeout?: number;
+    /** Whether it is disabled. */
+    disabled?: boolean;
+    /** Element or component to render. */
+    as?: string | object;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    copy: (success: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<{
+    /** The text to copy. */
+    value: string;
+    /** Text beside the icon. Without it, or content of your own, the button is labeled "Copy". */
+    label?: string;
+    /** The icon at rest, by name: from `configureIcons`' folder, or else the sprite. A built-in one otherwise. @default 'copy' */
+    icon?: string;
+    /** The icon once copied, by name, the same way. @default 'copied' */
+    copiedIcon?: string;
+    /** How long, in milliseconds, it says it copied before settling back. @default 1500 */
+    timeout?: number;
+    /** Whether it is disabled. */
+    disabled?: boolean;
+    /** Element or component to render. */
+    as?: string | object;
+}> & Readonly<{
+    onCopy?: ((success: boolean) => any) | undefined;
+}>, {
+    as: string | object;
+    disabled: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    /** Content beside the icons; the `label` by default. */
+    default(props: CopyState): unknown;
+    /** Replaces both icons. */
+    icon(props: CopyState): unknown;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/copy/Copy.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,120 @@
+import { mergeProps as mergeProps$1 } from "../../shared/merge-props.js";
+import { Part } from "../../shared/part.js";
+import { onRecycle } from "../../shared/recycle.js";
+import { findInlineIcon } from "../../shared/icons.js";
+import Icon_default from "../icon/Icon.js";
+import { useClipboard } from "../../composables/use-clipboard.js";
+import { Fragment, computed, createBlock, createElementBlock, createElementVNode, createTextVNode, defineComponent, guardReactiveProps, mergeProps, normalizeProps, openBlock, renderList, renderSlot, toDisplayString, unref, useAttrs, useSlots, withCtx } from "vue";
+//#region src/components/copy/Copy.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	"data-part": "copy-icons",
+	"aria-hidden": "true"
+};
+var _hoisted_2 = ["data-state", "data-active"];
+var _hoisted_3 = {
+	key: 1,
+	d: "m5 12 5 5L20 7"
+};
+var Copy_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "Copy",
+	inheritAttrs: false,
+	__name: "Copy",
+	props: {
+		value: {},
+		label: {},
+		icon: {},
+		copiedIcon: {},
+		timeout: {},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		as: { default: "button" }
+	},
+	emits: ["copy"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const { copy, status, copied, reset } = useClipboard({ timeout: () => props.timeout });
+		onRecycle(reset);
+		function resolve(name, fallback) {
+			const target = name ?? fallback;
+			if (findInlineIcon(target)) return {
+				name: target,
+				inline: true
+			};
+			return name ? {
+				name,
+				inline: false
+			} : null;
+		}
+		const icons = computed(() => [{
+			state: "idle",
+			icon: resolve(props.icon, "copy")
+		}, {
+			state: "copied",
+			icon: resolve(props.copiedIcon, "copied")
+		}]);
+		const slots = useSlots();
+		const attrs = useAttrs();
+		const state = computed(() => ({
+			status: status.value,
+			copied: copied.value
+		}));
+		async function onClick(event) {
+			event.stopPropagation();
+			if (props.disabled) return;
+			emit("copy", await copy(props.value));
+		}
+		const merged = computed(() => mergeProps$1({
+			"data-part": "copy",
+			"data-status": status.value,
+			...copied.value ? { "data-copied": "" } : null,
+			...props.disabled ? { "data-disabled": "" } : null,
+			type: "button",
+			disabled: props.disabled || void 0,
+			"aria-label": props.label || slots.default ? void 0 : "Copy",
+			onClick
+		}, attrs));
+		const isActive = (entry) => entry === "copied" === copied.value;
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(Part), mergeProps({ as: props.as }, merged.value), {
+				default: withCtx(() => [createElementVNode("span", _hoisted_1, [renderSlot(_ctx.$slots, "icon", normalizeProps(guardReactiveProps(state.value)), () => [(openBlock(true), createElementBlock(Fragment, null, renderList(icons.value, (entry) => {
+					return openBlock(), createElementBlock(Fragment, { key: entry.state }, [entry.icon ? (openBlock(), createBlock(Icon_default, {
+						key: 0,
+						name: entry.icon.name,
+						inline: entry.icon.inline,
+						"data-part": "copy-icon",
+						"data-state": entry.state,
+						"data-active": isActive(entry.state) ? "" : void 0
+					}, null, 8, [
+						"name",
+						"inline",
+						"data-state",
+						"data-active"
+					])) : (openBlock(), createElementBlock("svg", {
+						key: 1,
+						"data-part": "copy-icon",
+						"data-state": entry.state,
+						"data-active": isActive(entry.state) ? "" : void 0,
+						viewBox: "0 0 24 24",
+						fill: "none",
+						stroke: "currentColor",
+						"stroke-width": "2",
+						"stroke-linecap": "round",
+						"stroke-linejoin": "round"
+					}, [entry.state === "idle" ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [_cache[0] || (_cache[0] = createElementVNode("rect", {
+						x: "9",
+						y: "9",
+						width: "12",
+						height: "12",
+						rx: "2"
+					}, null, -1)), _cache[1] || (_cache[1] = createElementVNode("path", { d: "M5 15H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v1" }, null, -1))], 64)) : (openBlock(), createElementBlock("path", _hoisted_3))], 8, _hoisted_2))], 64);
+				}), 128))])]), renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(state.value)), () => [createTextVNode(toDisplayString(props.label), 1)])]),
+				_: 3
+			}, 16, ["as"]);
+		};
+	}
+});
+//#endregion
+export { Copy_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/data-table/DataTable.js

@@ -0,0 +1,5 @@
+import DataTable_vue_vue_type_script_setup_true_lang_default, { EXPANDER_COLUMN, dataTableFeatures, formatSort, parseSort } from "./DataTable.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/data-table/DataTable.vue
+var DataTable_default = DataTable_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { EXPANDER_COLUMN, dataTableFeatures, DataTable_default as default, formatSort, parseSort };

package/dist/components/data-table/DataTable.vue.d.ts

@@ -0,0 +1,194 @@
+import { type HTMLAttributes } from 'vue';
+import { type ColumnPinningState, type ColumnSizingState, type ExpandedState, type ColumnVisibilityState as VisibilityState } from '@tanstack/vue-table';
+import { type TableSticky } from '../table/TableRoot.vue';
+import { type CellContext, type Column, type ColumnDef, type ColumnHelper, type Row, type RowData, type SortingState } from '@tanstack/vue-table';
+export interface DataTableColumnMeta {
+    /** On every cell of the column: head, body and foot. */
+    class?: string;
+    /** On its head cell. */
+    thClass?: string;
+    /** On its body cells, or worked out per cell. */
+    tdClass?: string | ((context: CellContext<any, any, any>) => string | undefined);
+    /** On its foot cell. */
+    tfClass?: string;
+    /** Whether it shows at first, before `columnVisibility` says otherwise. */
+    show?: boolean;
+    /** Pins it to an edge at first, before `columnPinning` says otherwise. */
+    pin?: 'start' | 'end';
+}
+export declare const dataTableFeatures: {
+    columnPinningFeature: import("@tanstack/table-core").TableFeature;
+    columnResizingFeature: import("@tanstack/table-core").TableFeature;
+    columnSizingFeature: import("@tanstack/table-core").TableFeature;
+    columnVisibilityFeature: import("@tanstack/table-core").TableFeature;
+    rowExpandingFeature: import("@tanstack/table-core").TableFeature;
+    rowSortingFeature: import("@tanstack/table-core").TableFeature;
+    expandedRowModel: (table: import("@tanstack/table-core").Table<any, any>) => () => import("@tanstack/table-core").RowModel<any, any>;
+    sortedRowModel: (table: import("@tanstack/table-core").Table<any, any>) => () => import("@tanstack/table-core").RowModel<any, any>;
+    sortFns: {
+        alphanumeric: import("@tanstack/table-core").CreatedSortFn<any, any>;
+        text: import("@tanstack/table-core").CreatedSortFn<any, any>;
+        basic: import("@tanstack/table-core").CreatedSortFn<any, any>;
+        datetime: import("@tanstack/table-core").CreatedSortFn<any, any>;
+    };
+    columnMeta: DataTableColumnMeta;
+};
+export type DataTableFeatures = typeof dataTableFeatures;
+export type DataTableColumn<TData extends RowData> = ColumnDef<DataTableFeatures, TData>;
+export type DataTableColumnHelper<TData extends RowData> = ColumnHelper<DataTableFeatures, TData>;
+export declare const EXPANDER_COLUMN = "expander";
+export interface DataTableCellSlotProps<TData, TValue = unknown> {
+    cell: TValue;
+    row: TData;
+    depth: number;
+    isNested: boolean;
+    expanded: boolean;
+}
+export interface DataTableHeadSlotProps<TData extends RowData> {
+    column: Column<DataTableFeatures, TData, unknown>;
+    getValues: () => unknown[];
+}
+export type DataTableSlots<TData extends RowData> = {
+    [name: string]: (props: DataTableCellSlotProps<TData>) => any;
+} & {
+    [name: `cell-${string}`]: (props: DataTableCellSlotProps<TData>) => any;
+    [name: `head-${string}`]: (props: Partial<Pick<DataTableHeadSlotProps<TData>, 'column'>> & Pick<DataTableHeadSlotProps<TData>, 'getValues'>) => any;
+    [name: `foot-${string}`]: (props: DataTableHeadSlotProps<TData>) => any;
+    [name: `sort-${string}`]: (props: {
+        direction: false | 'asc' | 'desc';
+    }) => any;
+    sort?: (props: {
+        direction: false | 'asc' | 'desc';
+    }) => any;
+    expander?: (props: {
+        row: Row<DataTableFeatures, TData>;
+        expanded: boolean;
+        toggle: () => void;
+    }) => any;
+    'expander-icon'?: (props: {
+        expanded: boolean;
+    }) => any;
+    empty?: () => any;
+} & {
+    [K in keyof TData & string as `cell-${K}`]?: (props: DataTableCellSlotProps<TData, TData[K]>) => any;
+} & {
+    [K in Exclude<keyof TData & string, 'sort' | 'expander' | 'expander-icon' | 'empty'>]?: (props: DataTableCellSlotProps<TData, TData[K]>) => any;
+};
+/** A sort: `'name:asc'`, `'name:desc'`, or `'name'` for ascending, several joined by `,`; or TanStack's `[{ id, desc }]`. */
+export type DataTableSort = string | SortingState;
+/** `virtual` in full. Every field is optional. */
+export interface DataTableVirtual {
+    /** Every row's height, in pixels. Left out, it is measured from the first row. */
+    rowHeight?: number;
+    /** Rows drawn past each edge of the viewport. Fewer mount less at once as it scrolls. @default 8 */
+    overscan?: number;
+}
+export declare function parseSort(input: DataTableSort | undefined): SortingState;
+/** A sort as `parseSort` reads it: `'name:asc,age:desc'`. */
+export declare function formatSort(sorting: SortingState): string;
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: <TData extends RowData>(__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<{
+        /** The rows. */
+        data: TData[];
+        /** The columns, as TanStack Table column definitions, or a function building them from a column helper. */
+        columns: DataTableColumn<TData>[] | ((helper: DataTableColumnHelper<TData>) => DataTableColumn<TData>[]);
+        /** Stable row keys. Without it a row is keyed by its data object, which a refetch replaces. */
+        getRowId?: (row: TData, index: number, parent?: Row<DataTableFeatures, TData>) => string;
+        /** The key holding a row's children, which makes rows expandable. */
+        nestedKey?: keyof TData;
+        /** A press anywhere on an expandable row toggles it. */
+        expandOnRowClick?: boolean;
+        /** Extra attributes for each `<tr>`, from its row. */
+        rowAttrs?: (row: TData) => Record<string, unknown> | undefined;
+        /** Whether a column can be sorted from its header, unless its definition says otherwise. @default true */
+        enableSorting?: boolean;
+        /** The data arrives sorted, by a server, so only the sort state changes. */
+        manualSorting?: boolean;
+        /** Marks the container `data-striped`, for a stylesheet to tint every other row. */
+        striped?: boolean;
+        /** A class for the `<table>`; `class` lands on the scrolling container around it. */
+        tableClass?: HTMLAttributes["class"];
+        /** A class for the `<thead>`. */
+        headerClass?: HTMLAttributes["class"];
+        /** A class for the `<tbody>`. */
+        bodyClass?: HTMLAttributes["class"];
+        /** A class for the `<tfoot>`. */
+        footerClass?: HTMLAttributes["class"];
+        /** A class for every body row. `row-attrs` gives one per row. */
+        rowClass?: HTMLAttributes["class"];
+        /** A class for every head cell, beside its column's `meta.thClass`. */
+        thClass?: HTMLAttributes["class"];
+        /** A class for every body cell, beside its column's `meta.tdClass`. */
+        tdClass?: HTMLAttributes["class"];
+        /** A class for every foot cell, beside its column's `meta.tfClass`. */
+        tfClass?: HTMLAttributes["class"];
+        /**
+         * Keeps the sort in the URL under this query key, as `name:asc`, where the app
+         * provides its route (the Nuxt module does). `sortBy` with `manual-sorting`;
+         * `false` turns it off. A bound `v-model:sorting` leaves the URL alone.
+         */
+        sortQuery?: string | false;
+        /** Sticks the header to the top; a number keeps it that many pixels below. */
+        stickyHeader?: TableSticky;
+        /** Sticks the footer to the bottom; a number keeps it that many pixels above. */
+        stickyFooter?: TableSticky;
+        /**
+         * Draw only the rows near the viewport. Every row must be one height: `true`
+         * measures the first row; a number is that height (bound: `:virtual="40"`); an
+         * object sets the rest too. It follows whatever scrolls: the table, given a
+         * height, or else the page or a scrolling ancestor.
+         */
+        virtual?: boolean | number | DataTableVirtual;
+        /** The sort, as `[{ id, desc }]`, bound with `v-model:sorting`. */
+        sorting?: SortingState;
+        /** The sort at first, when no `v-model:sorting` owns it: `'name:asc'`, `'name:desc'`, several joined by `,`. */
+        defaultSort?: DataTableSort;
+        /** The expanded rows, by id (or `true` for all), bound with `v-model:expanded`. */
+        expanded?: ExpandedState;
+        /** The columns shown, as `{ [id]: boolean }`, bound with `v-model:column-visibility`. */
+        columnVisibility?: VisibilityState;
+        /** The pinned columns, as `{ start: ids, end: ids }`, bound with `v-model:column-pinning`. */
+        columnPinning?: ColumnPinningState;
+        /** Column widths set by resizing, as `{ [id]: px }`, bound with `v-model:column-sizing`. */
+        columnSizing?: ColumnSizingState;
+    } & {
+        "onUpdate:sorting"?: ((value: SortingState) => any) | undefined;
+        "onUpdate:expanded"?: ((value: ExpandedState) => any) | undefined;
+        "onUpdate:columnVisibility"?: ((value: VisibilityState) => any) | undefined;
+        "onUpdate:columnPinning"?: ((value: ColumnPinningState) => any) | undefined;
+        "onUpdate:columnSizing"?: ((value: ColumnSizingState) => any) | undefined;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: import("vue").ShallowUnwrapRef<{
+        table: import("@tanstack/vue-table").VueTable<{
+            columnPinningFeature: import("@tanstack/table-core").TableFeature;
+            columnResizingFeature: import("@tanstack/table-core").TableFeature;
+            columnSizingFeature: import("@tanstack/table-core").TableFeature;
+            columnVisibilityFeature: import("@tanstack/table-core").TableFeature;
+            rowExpandingFeature: import("@tanstack/table-core").TableFeature;
+            rowSortingFeature: import("@tanstack/table-core").TableFeature;
+            expandedRowModel: (table: import("@tanstack/table-core").Table<any, any>) => () => import("@tanstack/table-core").RowModel<any, any>;
+            sortedRowModel: (table: import("@tanstack/table-core").Table<any, any>) => () => import("@tanstack/table-core").RowModel<any, any>;
+            sortFns: {
+                alphanumeric: import("@tanstack/table-core").CreatedSortFn<any, any>;
+                text: import("@tanstack/table-core").CreatedSortFn<any, any>;
+                basic: import("@tanstack/table-core").CreatedSortFn<any, any>;
+                datetime: import("@tanstack/table-core").CreatedSortFn<any, any>;
+            };
+            columnMeta: DataTableColumnMeta;
+        }, TData>;
+    }>) => void;
+    attrs: any;
+    slots: DataTableSlots<TData>;
+    emit: ((evt: "update:sorting", value: SortingState) => void) & ((evt: "update:expanded", value: ExpandedState) => void) & ((evt: "update:columnVisibility", value: VisibilityState) => void) & ((evt: "update:columnPinning", value: ColumnPinningState) => void) & ((evt: "update:columnSizing", value: ColumnSizingState) => void);
+}>) => import("vue").VNode & {
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
+};
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};