@quiteer/naive-extra 0.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2021 Soybean
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,86 @@
+# @quiteer/naive-extra
+
+- [使用文档](https://quiteerjs.github.io/web/plugins/naive-extra/)
+- [示例项目](https://web-naive-extra-test.vercel.app/)
+
+基于 Naive UI 的业务组件库封装，旨在让开发者更多关注数据逻辑，减少 UI 实现的繁琐细节。
+
+## 特性
+
+- 🚀 **数据驱动**：通过配置对象生成表单、表格等组件，简化模板代码。
+- 🧩 **高度封装**：内置常见业务逻辑（如搜索栏、确认按钮、带提示的按钮等）。
+- 🎨 **响应式设计**：目标一切皆是响应式，配置极其灵活。
+- 📦 **类型友好**：提供完整的 TypeScript 类型定义，支持类型推断。
+- 🔌 **UnoCSS 集成**：推荐结合 UnoCSS 使用，样式更灵活。
+
+## 安装
+
+```bash
+pnpm add @quiteer/naive-extra
+```
+
+## 核心组件
+
+- **QuiForm**: 配置化表单组件。
+- **QuiTable**: 增强型表格组件，支持自定义列配置 hook。
+- **QuiSearchBar**: 基于表单配置的搜索栏组件。
+- **QuiUpload**: 封装了常见文件类型限制和上传逻辑的上传组件。
+- **QuiLayout**: 灵活的布局组件，支持多种布局模式。
+- **QuiProvider**: 全局配置注入组件，简化 `NConfigProvider` 等的使用。
+- **QuiButton**: 包含 `QuiPopconfirmButton` (二次确认) 和 `QuiTooltipButton` (带提示) 等。
+
+## 使用示例
+
+```vue
+<script setup lang="ts">
+import { 
+  QuiForm, 
+  QuiTable, 
+  QuiSearchBar, 
+  useUploadProps, 
+  AcceptType 
+} from '@quiteer/naive-extra'
+import type { FormSchema, TableProps } from '@quiteer/naive-extra'
+
+// 1. 表单配置
+const schemas: FormSchema[] = [
+  { field: 'name', label: '姓名', component: 'NInput', rules: [{ required: true }] },
+  { field: 'age', label: '年龄', component: 'NInputNumber' }
+]
+
+// 2. 表格配置
+const tableProps: TableProps = {
+  columns: [
+    { title: '姓名', key: 'name' },
+    { title: '年龄', key: 'age' }
+  ],
+  data: [
+    { name: 'John', age: 30 }
+  ]
+}
+
+// 3. 上传配置
+const uploadProps = useUploadProps({
+  accept: AcceptType.Image
+})
+
+function handleSubmit(values: any) {
+  console.log('Search:', values)
+}
+</script>
+
+<template>
+  <!-- 搜索栏 -->
+  <QuiSearchBar :schemas="schemas" @submit="handleSubmit" />
+
+  <!-- 表单 -->
+  <QuiForm :schemas="schemas" />
+
+  <!-- 表格 -->
+  <QuiTable v-bind="tableProps" />
+</template>
+```
+
+## License
+
+MIT

package/dist/components/breadcrumb/index.vue.d.ts

@@ -0,0 +1,3 @@
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+declare const _default: DefineComponent<{}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/components/button/action/index.d.ts

@@ -0,0 +1,3 @@
+import { default as QuiActionButton } from './index.vue';
+export * from './props';
+export { QuiActionButton };

package/dist/components/button/action/index.vue.d.ts

@@ -0,0 +1,118 @@
+import { ActionButtonProps, ActionItem, ActionButtonMode } from './props';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions, CreateComponentPublicInstanceWithMixins, Ref, ComputedRef, GlobalComponents, GlobalDirectives } from 'vue';
+import { Size } from 'naive-ui/es/button/src/interface';
+import { ButtonProps, FlexAlign, FlexJustify } from 'naive-ui';
+import { Theme } from 'naive-ui/es/_mixins';
+import { ExtractThemeOverrides } from 'naive-ui/es/_mixins/use-theme';
+import { RtlItem } from 'naive-ui/es/config-provider/src/internal-interface';
+declare const _default: DefineComponent<ActionButtonProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ActionButtonProps> & Readonly<{}>, {
+    size: Size;
+    mode: ActionButtonMode;
+    actions: ActionItem[];
+    max: number;
+    buttonProps: ButtonProps;
+    showDivider: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {
+    containerRef: CreateComponentPublicInstanceWithMixins<Readonly<globalThis.ExtractPropTypes<{
+        readonly align: PropType< FlexAlign>;
+        readonly justify: {
+            readonly type: PropType< FlexJustify>;
+            readonly default: "start";
+        };
+        readonly inline: BooleanConstructor;
+        readonly vertical: BooleanConstructor;
+        readonly reverse: BooleanConstructor;
+        readonly size: {
+            readonly type: PropType<"small" | "medium" | "large" | number | [number, number]>;
+            readonly default: "medium";
+        };
+        readonly wrap: {
+            readonly type: BooleanConstructor;
+            readonly default: true;
+        };
+        readonly theme: PropType< Theme<"Flex", {
+            gapSmall: string;
+            gapMedium: string;
+            gapLarge: string;
+        }, any>>;
+        readonly themeOverrides: PropType< ExtractThemeOverrides<Theme<"Flex", {
+            gapSmall: string;
+            gapMedium: string;
+            gapLarge: string;
+        }, any>>>;
+        readonly builtinThemeOverrides: PropType< ExtractThemeOverrides<Theme<"Flex", {
+            gapSmall: string;
+            gapMedium: string;
+            gapLarge: string;
+        }, any>>>;
+    }>> & Readonly<{}>, {
+        rtlEnabled: Ref< RtlItem | undefined, RtlItem | undefined> | undefined;
+        mergedClsPrefix: Ref<string, string>;
+        margin: ComputedRef<{
+            horizontal: number;
+            vertical: number;
+        }>;
+    }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, PublicProps, {
+        readonly inline: boolean;
+        readonly size: number | [number, number] | "small" | "medium" | "large";
+        readonly reverse: boolean;
+        readonly wrap: boolean;
+        readonly vertical: boolean;
+        readonly justify: import("csstype").Property.JustifyContent;
+    }, true, {}, {}, GlobalComponents, GlobalDirectives, string, {}, any, ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<globalThis.ExtractPropTypes<{
+        readonly align: PropType< FlexAlign>;
+        readonly justify: {
+            readonly type: PropType< FlexJustify>;
+            readonly default: "start";
+        };
+        readonly inline: BooleanConstructor;
+        readonly vertical: BooleanConstructor;
+        readonly reverse: BooleanConstructor;
+        readonly size: {
+            readonly type: PropType<"small" | "medium" | "large" | number | [number, number]>;
+            readonly default: "medium";
+        };
+        readonly wrap: {
+            readonly type: BooleanConstructor;
+            readonly default: true;
+        };
+        readonly theme: PropType< Theme<"Flex", {
+            gapSmall: string;
+            gapMedium: string;
+            gapLarge: string;
+        }, any>>;
+        readonly themeOverrides: PropType< ExtractThemeOverrides<Theme<"Flex", {
+            gapSmall: string;
+            gapMedium: string;
+            gapLarge: string;
+        }, any>>>;
+        readonly builtinThemeOverrides: PropType< ExtractThemeOverrides<Theme<"Flex", {
+            gapSmall: string;
+            gapMedium: string;
+            gapLarge: string;
+        }, any>>>;
+    }>> & Readonly<{}>, {
+        rtlEnabled: Ref< RtlItem | undefined, RtlItem | undefined> | undefined;
+        mergedClsPrefix: Ref<string, string>;
+        margin: ComputedRef<{
+            horizontal: number;
+            vertical: number;
+        }>;
+    }, {}, {}, {}, {
+        readonly inline: boolean;
+        readonly size: number | [number, number] | "small" | "medium" | "large";
+        readonly reverse: boolean;
+        readonly wrap: boolean;
+        readonly vertical: boolean;
+        readonly justify: import("csstype").Property.JustifyContent;
+    }> | null;
+    shadowRef: HTMLDivElement;
+}, any>;
+export default _default;

package/dist/components/button/action/props.d.ts

@@ -0,0 +1,63 @@
+import { ButtonProps, PopconfirmProps } from 'naive-ui';
+import { Ref } from 'vue';
+import { ButtonPermission } from '../base/props';
+export type ActionButtonMode = 'icon' | 'text' | 'icon-text' | 'button' | 'secondary';
+export declare enum ActionEnum {
+    EDIT = "edit",
+    DELETE = "delete",
+    VIEW = "view",
+    ADD = "add",
+    SEARCH = "search",
+    DOWNLOAD = "download",
+    UPLOAD = "upload",
+    SETTING = "setting"
+}
+export interface ActionItem {
+    /** 唯一标识，也是默认的图标映射键值 */
+    key: ActionEnum | string;
+    /** 按钮显示文本 */
+    label: string;
+    /** 按钮尺寸 */
+    size?: ButtonProps['size'];
+    /** 图标名称，如果不传则显示 defaultIcon */
+    icon?: string;
+    /** 按钮属性 */
+    props?: ButtonProps;
+    /** 点击事件 */
+    onClick?: (key: ActionEnum | string, item: ActionItem) => void;
+    /** 是否显示 */
+    show?: boolean | (() => boolean) | Ref<boolean>;
+    /** 是否禁用 */
+    disabled?: boolean | (() => boolean) | Ref<boolean>;
+    /** 提示文本，默认使用 label */
+    tooltip?: string;
+    /** 二次确认框配置，存在则开启二次确认 */
+    popconfirm?: PopconfirmProps;
+    /** 确认框内容 */
+    popText?: string;
+    /** 确认按钮文字 */
+    positiveText?: string;
+    /** 取消按钮文字 */
+    negativeText?: string;
+    /** 确认回调 */
+    onPositiveClick?: (key: ActionEnum | string, item: ActionItem) => void;
+    /** 权限控制 */
+    permission?: ButtonPermission;
+}
+export declare const DEFAULT_ACTION_ICONS: Record<string, string>;
+export interface ActionButtonProps {
+    /** 操作按钮列表 */
+    actions?: ActionItem[];
+    /** 显示模式：纯图标 | 纯文字 | 图标+文字 */
+    mode?: ActionButtonMode;
+    /** 最大显示数量，超过折叠 */
+    max?: number;
+    /** 统一的按钮属性 */
+    buttonProps?: ButtonProps;
+    /** 按钮尺寸 */
+    size?: ButtonProps['size'];
+    /** 是否显示分割线 */
+    showDivider?: boolean;
+    /** 是否开启响应式折叠，开启后 max 属性失效，根据宽度自动计算显示数量 */
+    responsive?: boolean;
+}

package/dist/components/button/action/utils.d.ts

@@ -0,0 +1,8 @@
+import { ButtonProps } from 'naive-ui';
+import { BaseButtonProps } from '../base/props';
+import { ActionButtonMode, ActionItem } from './props';
+export declare function getIcon(item: ActionItem): string;
+export declare function isDisabled(item: ActionItem): boolean;
+export declare function getPopconfirmProps(item: ActionItem): any;
+export declare function resolveButtonProps(item: ActionItem, mode?: ActionButtonMode, defaultButtonProps?: ButtonProps): Omit<Partial<BaseButtonProps>, 'onClick'>;
+export declare function resolveMoreButtonProps(mode?: ActionButtonMode, defaultButtonProps?: ButtonProps): Omit<Partial<BaseButtonProps>, 'onClick'>;

package/dist/components/button/base/index.d.ts

@@ -0,0 +1,3 @@
+import { default as QuiBaseButton } from './index.vue';
+export * from './props';
+export { QuiBaseButton };

package/dist/components/button/base/index.vue.d.ts

@@ -0,0 +1,36 @@
+import { BaseButtonProps } from './props';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+import { Size, Type } from 'naive-ui/es/button/src/interface';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+        default?(_: {}): any;
+        default?(_: {}): any;
+        popconfirm?(_: {}): any;
+        tooltip?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: DefineComponent<BaseButtonProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+    click: (e: MouseEvent) => any;
+    positiveClick: (e: MouseEvent) => any;
+}, string, PublicProps, Readonly<BaseButtonProps> & Readonly<{
+    onClick?: ((e: MouseEvent) => any) | undefined;
+    onPositiveClick?: ((e: MouseEvent) => any) | undefined;
+}>, {
+    text: boolean;
+    disabled: boolean;
+    size: Size;
+    secondary: boolean;
+    type: Type;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/button/base/props.d.ts

@@ -0,0 +1,27 @@
+import { ButtonProps, PopconfirmProps } from 'naive-ui';
+export interface ButtonPermission {
+    /** 权限组：[拥有的权限列表, 需要的权限] */
+    group: [string[], string];
+    /** 是否禁用 */
+    disabled?: boolean;
+    /** 是否显示 */
+    show?: boolean;
+}
+export interface BaseButtonProps extends /* @vue-ignore */ ButtonProps {
+    /** 图标名称 */
+    icon?: string;
+    /** 提示文本 */
+    tooltip?: string;
+    /** 是否为文本按钮 */
+    text?: boolean;
+    /** Popconfirm 配置 */
+    popconfirm?: PopconfirmProps;
+    /** Popconfirm 内容文本 */
+    popText?: string;
+    /** Popconfirm 确认按钮文本 */
+    positiveText?: string;
+    /** Popconfirm 取消按钮文本 */
+    negativeText?: string;
+    /** 权限 */
+    permission?: ButtonPermission;
+}

package/dist/components/button/index.d.ts

@@ -0,0 +1,4 @@
+export { QuiActionButton } from './action';
+export type { ActionItem } from './action';
+export { QuiBaseButton } from './base';
+export type { BaseButtonProps } from './base';

package/dist/components/button/types.d.ts

@@ -0,0 +1,2 @@
+export type { ActionButtonMode, ActionItem } from './action';
+export type { BaseButtonProps } from './base';

package/dist/components/form/helper.d.ts

@@ -0,0 +1,11 @@
+import { Recordable } from '../../const';
+import { FormSchema } from './props';
+export declare function handleFormValues(values: Recordable): Recordable;
+export declare function getComponentProps(schema: FormSchema, disabled: boolean): {
+    readonly: boolean;
+    clearable: boolean;
+} | {
+    clearable: boolean;
+    disabled: boolean;
+};
+export declare function getComponent(schema: FormSchema): any;

package/dist/components/form/index.d.ts

@@ -0,0 +1,3 @@
+import { default as QuiForm } from './index.vue';
+export { QuiForm };
+export type { CustomSwitchProps, Props as FormProps, FormSchema } from './props';