@aplus-frontend/ui 0.0.1-beta.9 → 0.0.2

package/lib/src/ap-table/constants.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("../ap-action/index.js");require("../ap-field/index.js");require("../ap-form/index.js");require("./components/index/index.vue.js");const e=require("../ap-form/items/date/index.vue.js"),t=require("../ap-form/items/date-range/index.vue.js"),_=require("../ap-form/items/number/index.vue.js"),u=require("../ap-form/items/radio/index.vue.js"),r=require("../ap-form/items/select/index.vue.js"),n=require("../ap-form/items/switch/index.vue.js"),i=require("../ap-form/items/text/index.vue.js"),s=require("../ap-form/items/text-area/index.vue.js"),a=require("../ap-form/items/checkbox/index.vue.js"),p=require("../ap-field/date/index.vue.js"),c=require("../ap-field/date-range/index.vue.js"),d=require("../ap-field/number/index.vue.js"),l=require("../ap-field/radio/index.vue.js"),v=require("../ap-field/select/index.vue.js"),o=require("../ap-field/switch/index.vue.js"),x=require("../ap-field/text/index.vue.js"),g=require("../ap-field/text-area/index.vue.js"),q=require("../ap-field/checkbox/index.vue.js"),f=require("../ap-action/group/index.vue.js"),y=require("./components/index/index.vue2.js"),$={date:e.default,dateRange:t.default,number:_.default,radio:u.default,select:r.default,switch:n.default,text:i.default,textArea:s.default,checkbox:a.default},m={date:p.default,dateRange:c.default,number:d.default,radio:l.default,select:v.default,switch:o.default,text:x.default,textArea:g.default,checkbox:q.default,action:f.default,index:y.default},b=["action","index"];exports.apTableFormItemMap=$;exports.apTableRenderItemMap=m;exports.noRenderAsFormItemValueList=b;

package/lib/src/ap-table/hooks/use-table-paging.d.ts

@@ -0,0 +1,82 @@
+import { Ref, ComputedRef } from 'vue';
+import { RequestData } from '../interface';
+import { ApFormSearchFormExpose } from '../../ap-form';
+import { TablePaginationConfig, FilterValue, SorterResult, TableCurrentDataSource } from 'ant-design-vue/es/table/interface';
+
+export type UseTablePagingParams<DataType, ParamsType> = {
+    request: (params: any) => Promise<RequestData<DataType>>;
+    /**
+     * 是否手动执行，页面初始化后不执行网络请求，需要手动触发
+     * @param params
+     * @returns
+     */
+    manual?: boolean;
+    /**
+     * @description 默认情况下，请求第几页
+     * @default 1
+     */
+    defaultCurrent?: number;
+    /**
+     * 默认每页请求的数据条数
+     * @default 10
+     */
+    defaultPageSize?: number;
+    /**
+     * 额外的默认请求参数，这个参数变更不会触发网络请求
+     */
+    defaultParams?: ParamsType;
+    /**
+     * 默认的数据源
+     */
+    defaultData?: DataType[];
+    /**
+     * 数据请求前格式化请求参数
+     * @param values
+     * @returns
+     */
+    formatParams?: (values: any) => any;
+    /**
+     * 特殊类型参数类型对照表（会根据该对照表运行默认的参数格式化）
+     */
+    paramsValueTypeMap?: Record<string, any>;
+    /**
+     * 重设表单需要忽略的字段
+     */
+    resetFieldsIgnores?: string[];
+    /**
+     * 需要后端筛选的字段列表
+     */
+    filterFields?: string[];
+    /**
+     * 需要后端筛选的排序字段列表
+     */
+    sortFields?: string[];
+};
+export declare const useTablePaging: <DataType = any, ParamsType = Record<string, any>>({ manual, defaultCurrent, defaultPageSize, request, defaultParams, defaultData, formatParams, paramsValueTypeMap, resetFieldsIgnores, filterFields, sortFields }: UseTablePagingParams<DataType, ParamsType>) => {
+    formRef: Ref<ApFormSearchFormExpose | undefined>;
+    submit: () => void;
+    reset: () => void;
+    refresh: () => void;
+    refreshByDelete: (n: number) => void;
+    data: Ref<{
+        total: number;
+        records: DataType[];
+        loading: boolean;
+    }>;
+    current: Ref<number>;
+    pageSize: Ref<number>;
+    handleTableChange: (pagination: TablePaginationConfig, filters: Record<string, FilterValue | null>, sorter: SorterResult<any> | SorterResult<any>[], extra: TableCurrentDataSource<any>) => void;
+    tableProps: ComputedRef<{
+        loading: boolean;
+        pagination: {
+            current: number;
+            pageSize: number;
+            total: number;
+            showSizeChanger: boolean;
+            showQuickJumper: boolean;
+            showTotal: (total: number) => string;
+        };
+        onChange: (pagination: TablePaginationConfig, filters: Record<string, FilterValue | null>, sorter: SorterResult<any> | SorterResult<any>[], extra: TableCurrentDataSource<any>) => void;
+        dataSource: DataType[];
+    }>;
+};

package/lib/src/ap-table/hooks/use-table-paging.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("vue"),C=require("../utils.js"),I=require("lodash-unified");require("../../config-provider/index.js");const K=require("../../config-provider/hooks/use-locale.js"),N=({manual:O=!1,defaultCurrent:j=1,defaultPageSize:F=10,request:$,defaultParams:D={},defaultData:L=[],formatParams:S,paramsValueTypeMap:T,resetFieldsIgnores:P,filterFields:M=[],sortFields:R=[]})=>{let v=0,f={};const x=e=>S?S(e):e,c=r.ref(),i=r.ref(j),g=r.ref(F),{t:b}=K.useLocale(),o=r.ref({total:0,records:L,loading:!1}),z=async e=>{var n;const a=x(e),t=Date.now();v=t,o.value.loading=!0;try{const s=await $({...D,...a});v===t&&(o.value.total=s.total||((n=s.data)==null?void 0:n.length)||0,o.value.records=[...s.data||[]])}catch{v===t&&(o.value.records=[],o.value.total=0)}finally{o.value.loading=!1}},q=e=>{const a={};return Object.entries(e).forEach(([t,n])=>{if(a[t]=n,T&&n){const s=T[t];s&&(a[t]=C.parseFieldValue(s,n))}}),a},A=e=>{var n,s,d,p,h,l,u;const a=((s=(n=c.value)==null?void 0:n.apForm)==null?void 0:s.getFieldsValue())||{},t={};Object.entries(a).forEach(([y,H])=>{P&&P.indexOf(y)>-1&&(t[y]=H)}),(p=(d=c.value)==null?void 0:d.apForm)==null||p.resetFields(),(u=(l=(h=c.value)==null?void 0:h.apForm)==null?void 0:l.setFieldsValue)==null||u.call(l,t),e==null||e()},m=e=>{f=e;const a=q(e);z(a)},B=e=>{m({...f,...e})},V=()=>{var a,t;const e=((t=(a=c.value)==null?void 0:a.apForm)==null?void 0:t.getFieldsValue(!0))||{};m({...e,current:1,pageSize:f.pageSize||F})},E=()=>{A(V)},J=()=>{m(f)},Q=e=>{const a=r.unref(o).total-e,t=Math.ceil(a/r.unref(g)),n=r.unref(i)>t?t:r.unref(i);B({current:n>0?n:1})},w=(e,a,t)=>{var h,l;const n=((l=(h=c.value)==null?void 0:h.apForm)==null?void 0:l.getFieldsValue(!0))||{};i.value=e.current,g.value=e.pageSize;const s=I.isArray(t)?[...t]:[t],d={};for(const u of s)R.includes(u.field)&&(d[C.dataIndexToStr(u.field)]=u.order);const p={};for(const u of Object.keys(a))M.includes(u)&&(p[u]=a[u]);m({...n,filter:p,sort:d,current:e.current,pageSize:e.pageSize})};r.onMounted(()=>{var a,t;const e=((t=(a=c.value)==null?void 0:a.apForm)==null?void 0:t.getFieldsValue(!0))||{};if(f={current:r.unref(i),pageSize:r.unref(g),...e},!O){const n=q(f);z(n)}});const U=r.computed(()=>r.unref(o).total===0?"-":`${r.unref(i.value)}/${Math.ceil(r.unref(o).total/r.unref(g))}`),G=r.computed(()=>({loading:r.unref(o).loading,pagination:{current:r.unref(i),pageSize:r.unref(g),total:r.unref(o).total,showSizeChanger:!0,showQuickJumper:!0,showTotal:e=>`${b("ap.apTable.pagination.totalLeft",{total:e})} ${b("ap.apTable.pagination.totalRight",{page:r.unref(U)})}`},onChange:w,dataSource:r.unref(o).records}));return{formRef:c,submit:V,reset:E,refresh:J,refreshByDelete:Q,data:o,current:i,pageSize:g,handleTableChange:w,tableProps:G}};exports.useTablePaging=N;

package/lib/src/ap-table/index.d.ts

@@ -0,0 +1,5 @@
+import { default as ApTable } from './ap-table.vue';
+
+export { ApTable };
+export * from './interface';
+export * from './hooks/use-table-paging';

package/lib/src/ap-table/index.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("./ap-table.vue2.js");require("./interface.js");const e=require("./hooks/use-table-paging.js");exports.useTablePaging=e.useTablePaging;

package/lib/src/ap-table/interface.d.ts

@@ -0,0 +1,180 @@
+import { ColumnType, TableProps } from 'ant-design-vue/es/table';
+import { CompareFn, SortOrder } from 'ant-design-vue/es/table/interface';
+import { ApFormSearchFormProps } from '../ap-form';
+import { ApFormItemCheckboxProps, ApFormItemDateProps, ApFormItemDateRangeProps, ApFormItemNumberProps, ApFormItemRadioProps, ApFormItemSelectProps, ApFormItemSwitchProps, ApFormItemTextAreaProps, ApFormItemTextProps } from 'src/ap-form/items/interface';
+import { Recordable } from '../type';
+import { CSSProperties } from 'vue';
+import { ApActionGroupProps } from '../ap-action';
+import { ApTableIndexProps } from './components/interface';
+
+export type ValueEnumType = {
+    text: string;
+    status?: string;
+    color?: string;
+    disabled?: boolean;
+};
+/**
+ * ApTable默认支持的值类型（将会用于表单生成和默认值格式化）
+ */
+export type ApTableValueFields = {
+    /** 日期选择器 */
+    date: ApFormItemDateProps;
+    /** 日期范围选择器 */
+    dateRange: ApFormItemDateRangeProps;
+    /** 数字输入框 */
+    number: ApFormItemNumberProps;
+    /** 单选 */
+    radio: ApFormItemRadioProps;
+    /** 下拉选择 */
+    select: ApFormItemSelectProps;
+    /** 开关 */
+    switch: ApFormItemSwitchProps;
+    /** 文本输入 */
+    text: ApFormItemTextProps;
+    /** 多行文本输入 */
+    textArea: ApFormItemTextAreaProps;
+    /** 多选 */
+    checkbox: ApFormItemCheckboxProps;
+    /**
+     * 操作列
+     */
+    action: ApActionGroupProps;
+    /**
+     * 索引列
+     */
+    index: ApTableIndexProps;
+};
+export type ValueEnum = Record<string, ValueEnumType>;
+export type ExtraProColumnType<T> = Omit<ColumnType<T>, 'children'> & {
+    sorter?: string | boolean | CompareFn<T> | {
+        compare?: CompareFn<T>;
+        /** Config multiple sorter order priority */
+        multiple?: number;
+    };
+};
+export type ApColumnType<ValueType extends keyof ApTableValueFields = 'text'> = ExtraProColumnType<any> & {
+    children?: ApColumnType[];
+    /**
+     * 表单项所占据的格子数（1-24格）
+     */
+    span?: number;
+    /**
+     * 在title之后展示一个icon并触发tooltip
+     */
+    tooltip?: string;
+    /**
+     * 是否可以复制
+     */
+    copyable?: boolean;
+    /**
+     * 是否搜索表单中隐藏
+     */
+    hideInSearch?: boolean;
+    /**
+     * 是否在表格中隐藏
+     */
+    hideInTable?: boolean;
+    /**
+     * 值的枚举，会自动转化把值当成 key 来取出要显示的内容（也会作为select等组件的选项）
+     */
+    valueEnum?: ValueEnum;
+    /**
+     * 自定义查询表单渲染
+     */
+    customRenderFormItem?: (config: ApColumnType) => any;
+    /**
+     * 指定值类型（将会用于默认渲染和查询表单生成）
+     */
+    valueType?: keyof ApTableValueFields;
+    /**
+     * 值类型额外配置的参数（用于查询表单渲染）
+     */
+    fieldProps?: ApTableValueFields[ValueType];
+};
+export type RequestData<T> = {
+    data: T[] | undefined;
+    total: number;
+} & Record<string, any>;
+export type ApTableProps<RecordType = any, ParamsType = any, ValueType extends keyof ApTableValueFields = 'text'> = Omit<TableProps<RecordType>, 'columns' | 'pagination' | 'dataSource' | 'size'> & {
+    /**
+     * 列配置
+     */
+    columns?: ApColumnType<any>[];
+    /**
+     * 是否启用卡片样式
+     */
+    card?: boolean;
+    /**
+     * request额外请求的参数，这些参数在变更时将不会自动发起网络请求
+     */
+    params?: ParamsType;
+    /**
+     * 自定义渲染搜索表单
+     * @deprecated 未实现 暂不可用
+     */
+    searchFormRender?: (props: ApTableProps<RecordType, ParamsType, ValueType>, defaultDom: any) => any;
+    /**
+     * 请求获取dataSource
+     * @param params
+     * @returns
+     */
+    request?: (params: ParamsType & {
+        pageSize?: number;
+        current?: number;
+        sort?: Record<string, SortOrder>;
+        filter?: Recordable<any>;
+    }) => Promise<Partial<RequestData<RecordType>>>;
+    /**
+     * 数据加载完成后触发
+     * @deprecated 已弃用，请自行实现类似效果
+     * @returns
+     */
+    onLoad?: (data: RecordType[]) => void;
+    /**
+     * 表格的默认数据源，这些数据源将会在第一次请求后被替换
+     */
+    defaultData?: RecordType[];
+    /**
+     * 表格loading状态变更后触发
+     * @param loading
+     * @returns
+     */
+    onLoadingChange?: (loading: boolean) => void;
+    /**
+     * 查询表单配置，设置为false表示不渲染查询表单
+     */
+    searchForm?: false | ApFormSearchFormProps;
+    /**
+     * 查询表单提交之前，一般用于自定义对查询数据进行变更
+     * @param params
+     * @returns
+     */
+    beforeSearchSubmit?: (params: Partial<ParamsType>) => any;
+    /**
+     * 是否显示分页器（特定的分页器）或者指定默认的当前页和pageSize
+     */
+    pagination?: false | {
+        defaultCurrent?: number;
+        defaultPageSize?: number;
+    };
+    /**
+     * 自定义查询表单容器样式
+     */
+    searchFormWrapperStyle?: CSSProperties;
+    /**
+     * 自定义表格样式
+     */
+    tableWrapperStyle?: CSSProperties;
+    /**
+     * 是否手动发起第一次网络请求
+     */
+    manual?: boolean;
+    /**
+     * 表格尺寸（只支持中等大小和小尺寸）
+     */
+    size?: 'middle' | 'small';
+};
+export type ApTableExpose = {
+    submit: () => void;
+    reset: () => void;
+};

package/lib/src/ap-table/interface.js

@@ -0,0 +1 @@
+"use strict";

package/lib/src/ap-table/style/ap-table.css

@@ -0,0 +1,46 @@
+.aplus-ap-table-wrapper {
+  padding: 16px;
+  background-color: #fff;
+}
+.aplus-ap-table__search-wrapper {
+  padding: 16px;
+  padding-bottom: 0;
+  background-color: #fff;
+  margin-bottom: 16px;
+}
+.aplus-ap-table__table-wrapper {
+  padding: 16px;
+  background-color: #fff;
+}
+.aplus-ap-table-table .ant-pagination {
+  margin-bottom: 0 !important;
+}
+.aplus-ap-table-table .ant-pagination .ant-pagination-total-text {
+  flex: 1;
+}
+.aplus-ap-table-table tr > th.ant-table-cell {
+  background-color: #F2F6F9;
+  border-bottom-color: #E9EDF3;
+}
+.aplus-ap-table-table tr > th.ant-table-cell::before {
+  display: none;
+}
+.aplus-ap-table-table tr > td.ant-table-cell {
+  border-top-color: #E9EDF3;
+}
+.aplus-ap-table-table-admin .ant-pagination {
+  margin-bottom: 0 !important;
+}
+.aplus-ap-table-table-admin .ant-pagination .ant-pagination-total-text {
+  flex: 1;
+}
+.aplus-ap-table-table-admin tr > th.ant-table-cell {
+  background-color: #FAFAFA;
+  border-bottom-color: #E9E9E9;
+}
+.aplus-ap-table-table-admin tr > th.ant-table-cell::before {
+  display: none;
+}
+.aplus-ap-table-table-admin tr > td.ant-table-cell {
+  border-top-color: #E9E9E9;
+}

package/lib/src/ap-table/utils.d.ts

@@ -0,0 +1,32 @@
+import { ValueEnum, ValueEnumType } from './interface';
+
+export type FieldValueType = 'multiple' | 'multipleNumber' | 'dayjs' | 'dayjsRange' | 'dayjsDayRange' | 'number' | 'boolean' | 'object';
+export declare const formatParamsValueType: (type: FieldValueType | Record<string, FieldValueType>, value: any, cb: (t: FieldValueType, value: any) => any) => any;
+/**
+ * 解析数值
+ * @param t 值类型
+ * @param value 值
+ */
+export declare const parseFieldValue: (t: FieldValueType, value: any) => any;
+/**
+ * 对表格的dataIndex进行拼接处理
+ * @param dataIndex
+ * @returns
+ */
+export declare function dataIndexToStr(dataIndex: string | number | (string | number)[]): string | number;
+type OptionType = {
+    label?: string;
+    text?: string;
+    value?: any;
+    disabled?: boolean;
+    [key: string]: any;
+};
+type ValueEnumMap = Map<string | number | boolean, ValueEnumType>;
+export declare const objectToMap: (value: ValueEnum | undefined) => ValueEnumMap;
+/**
+ * valueEnum转options array
+ * @param valueEnumParams
+ * @returns
+ */
+export declare const valueEnumToArray: (valueEnumParams: ValueEnum) => OptionType;
+export {};

package/lib/src/ap-table/utils.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("lodash-unified"),c=(e,t,n)=>{let s={};return o.isObject(e)?Object.keys(e).forEach(a=>{o.isObject(e[a])?s[a]=c(e[a],t[a],n):s[a]=n(e[a],t)}):s=n(e,t),s},i=(e,t)=>{switch(e){case"dayjs":return t.valueOf();case"dayjsRange":return t.map(n=>n.valueOf());case"dayjsDayRange":{const[n,s]=t;return[n.startOf("day").valueOf(),s.endOf("day").valueOf()]}case"multiple":case"multipleNumber":return o.isArray(t)?t:[t];case"boolean":return t;case"object":return t;default:return t}};function f(e){return o.isArray(e)?e.join("."):e}function l(e){const t=Object.prototype.toString.call(e).match(/^\[object (.*)\]$/)[1].toLowerCase();return t==="string"&&typeof e=="object"?"object":e===null?"null":e===void 0?"undefined":t}const u=e=>l(e)==="map"?e:new Map(Object.entries(e||{})),d=e=>{const t=[],n=u(e);return n.forEach((s,a)=>{const r=n.get(a)||n.get(`${a}`);if(r){if(typeof r=="object"&&(r!=null&&r.text)){t.push({text:r==null?void 0:r.text,value:a,label:r==null?void 0:r.text,disabled:r.disabled});return}t.push({text:r,label:r,value:a})}}),t};exports.dataIndexToStr=f;exports.formatParamsValueType=c;exports.objectToMap=u;exports.parseFieldValue=i;exports.valueEnumToArray=d;

package/lib/src/ap-tag/ap-tag-group.vue.d.ts

@@ -0,0 +1,34 @@
+import { ApTagGroupProps, ApTagProps } from './interface';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ExtractPropTypes, PropType } from 'vue';
+
+declare const _default: DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ApTagGroupProps>, {
+    list: () => ApTagProps[];
+    space: number;
+    ellipsisColor: string;
+}>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly< ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ApTagGroupProps>, {
+    list: () => ApTagProps[];
+    space: number;
+    ellipsisColor: string;
+}>>>, {
+    space: number;
+    list: ApTagProps[];
+    ellipsisColor: string;
+}, {}>;
+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: PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: 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];
+} & {};

package/lib/src/ap-tag/ap-tag-group.vue.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),_=require("ant-design-vue"),y=require("@ant-design/icons-vue");require("./ap-tag.vue2.js");require("../config-provider/index.js");require("./style/ap-tag-group.css");const w=require("../config-provider/hooks/use-namespace.js"),x=require("./ap-tag.vue.js"),E=e.createElementVNode("svg",{xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink",fill:"none",version:"1.1",width:"16",height:"16",viewBox:"0 0 16 16"},[e.createElementVNode("defs",null,[e.createElementVNode("clipPath",{id:"master_svg0_1133_24991"},[e.createElementVNode("rect",{x:"0",y:"0",width:"16",height:"16",rx:"0"})])]),e.createElementVNode("g",{"clip-path":"url(#master_svg0_1133_24991)"},[e.createElementVNode("g",null,[e.createElementVNode("ellipse",{cx:"8",cy:"8",rx:"1",ry:"1",fill:"currentColor","fill-opacity":"1"})]),e.createElementVNode("g",null,[e.createElementVNode("ellipse",{cx:"3.25",cy:"8",rx:"1",ry:"1",fill:"currentColor","fill-opacity":"1"})]),e.createElementVNode("g",null,[e.createElementVNode("ellipse",{cx:"12.75",cy:"8",rx:"1",ry:"1",fill:"currentColor","fill-opacity":"1"})])])],-1),k=e.defineComponent({__name:"ap-tag-group",props:{list:{default:()=>[]},space:{default:4},ellipsisColor:{default:"#34B77C"}},setup(p){const l=p,{b:m}=w.useNamespace("tag-group"),s=e.ref(),d=e.computed(()=>e.unref(r)<l.list.length),f=e.computed(()=>l.list.slice(0,e.unref(r))),r=e.ref(0),c=e.ref(0),a=e.ref(l.list.length),g=e.computed(()=>l.list.map(t=>t.text).join("、")),v=e.computed(()=>[m()].filter(Boolean)),n=()=>{if(!s.value)return;const t=s.value.scrollWidth,o=s.value.clientWidth;if(e.unref(c)<=e.unref(a)){const i=Math.floor((e.unref(c)+e.unref(a))/2);t<=o?(r.value=i,c.value=i+1):a.value=i-1,e.nextTick(()=>{requestAnimationFrame(n)})}else t>o&&(r.value=r.value-1,e.nextTick(()=>{requestAnimationFrame(n)}))},u=()=>{c.value=0,a.value=l.list.length,r.value=0};return e.watch(()=>l.list,(t,o)=>{t!==o&&(u(),e.nextTick(()=>n()))},{immediate:!0}),e.onMounted(()=>{window.addEventListener("resize",()=>{u(),n()})}),e.onUnmounted(()=>{window.removeEventListener("resize",()=>{u(),n()})}),(t,o)=>(e.openBlock(),e.createBlock(e.unref(_.Tooltip),{title:g.value,trigger:"hover"},{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(v.value),ref_key:"container",ref:s,style:e.normalizeStyle({pointerEvents:d.value?"auto":"none"})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(f.value,(i,h)=>(e.openBlock(),e.createBlock(x.default,e.mergeProps({ref_for:!0},i,{key:h,style:{marginRight:`${t.space}px`}}),null,16,["style"]))),128)),d.value?(e.openBlock(),e.createBlock(e.unref(y),{key:0,style:e.normalizeStyle({color:t.ellipsisColor})},{component:e.withCtx(()=>[E]),_:1},8,["style"])):e.createCommentVNode("",!0)],6)]),_:1},8,["title"]))}});exports.default=k;

package/lib/src/ap-tag/ap-tag-group.vue2.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./ap-tag-group.vue.js");exports.default=e.default;

package/lib/src/ap-tag/ap-tag.vue.d.ts

@@ -0,0 +1,34 @@
+import { ApTagProps } from './interface';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ExtractPropTypes, PropType } from 'vue';
+
+declare const _default: DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ApTagProps>, {
+    size: string;
+    color: string;
+    disabled: boolean;
+}>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly< ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ApTagProps>, {
+    size: string;
+    color: string;
+    disabled: boolean;
+}>>>, {
+    color: string;
+    disabled: boolean;
+    size: "small" | "middle" | "large";
+}, {}>;
+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: PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: 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];
+} & {};

package/lib/src/ap-tag/ap-tag.vue.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("vue");require("../config-provider/index.js");require("./style/ap-tag.css");const S=require("../config-provider/hooks/use-global-config.js"),b=require("../config-provider/hooks/use-namespace.js"),$=t.defineComponent({name:"ApTag",__name:"ap-tag",props:{text:{},color:{default:"#34B77C"},size:{default:"middle"},disabled:{type:Boolean,default:!1}},setup(i){const a=i,p=S.useGlobalConfig("uiMode"),{b:n,bm:r}=b.useNamespace("tag");function l(e,s){e.length===4&&(e=`#${e[1]}${e[1]}${e[2]}${e[2]}${e[3]}${e[3]}`);const d=parseInt(e.slice(1,3),16),m=parseInt(e.slice(3,5),16),g=parseInt(e.slice(5,7),16),f=Math.round(s*255).toString(16).padStart(2,"0");return`#${d.toString(16).padStart(2,"0")}${m.toString(16).padStart(2,"0")}${g.toString(16).padStart(2,"0")}${f}`}const c=t.computed(()=>({"--tag-main-color":a.color,"--tag-main-color-opacity":l(a.color,.06)})),o=t.computed(()=>[n("wrapper"),r("wrapper",a.size)].filter(Boolean)),u=t.computed(()=>{const e=[n("inner-wrapper"),r("inner-wrapper",a.size)];return a.disabled&&(p.value==="aplus"?e.push(r("inner-wrapper","disabled")):e.push(r("inner-wrapper","disabled-admin"))),e});return(e,s)=>(t.openBlock(),t.createElementBlock("span",{style:t.normalizeStyle(c.value),class:t.normalizeClass(o.value)},[t.createElementVNode("span",{class:t.normalizeClass(u.value)},t.toDisplayString(e.text),3)],6))}});exports.default=$;

package/lib/src/ap-tag/ap-tag.vue2.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./ap-tag.vue.js");exports.default=e.default;

package/lib/src/ap-tag/index.d.ts

@@ -0,0 +1,5 @@
+import { default as ApTag } from './ap-tag.vue';
+import { default as ApTagGroup } from './ap-tag-group.vue';
+
+export * from './interface';
+export { ApTag, ApTagGroup };

package/lib/src/ap-tag/index.js

@@ -0,0 +1 @@
+"use strict";require("./ap-tag.vue2.js");require("./ap-tag-group.vue2.js");require("./interface.js");

package/lib/src/ap-tag/interface.d.ts

@@ -0,0 +1,35 @@
+export interface ApTagProps {
+    /**
+     * 标签内容
+     */
+    text: string;
+    /**
+     * 标签颜色
+     */
+    color?: string;
+    /**
+     * 标签大小
+     */
+    size?: 'small' | 'middle' | 'large';
+    /**
+     * 是否禁用
+     * @default false
+     */
+    disabled?: boolean;
+}
+export interface ApTagGroupProps {
+    /**
+     * 标签组内容
+     */
+    list: ApTagProps[];
+    /**
+     * 标签之间间距
+     * @default 4
+     */
+    space?: number;
+    /**
+     * 省略号颜色
+     * @default #34B77C
+     */
+    ellipsisColor?: string;
+}

package/lib/src/ap-tag/interface.js

@@ -0,0 +1 @@
+"use strict";

package/lib/src/ap-tag/style/ap-tag-group.css

@@ -0,0 +1,6 @@
+.aplus-tag-group {
+  text-wrap: nowrap;
+  display: flex;
+  flex-wrap: nowrap;
+  align-items: center;
+}

package/lib/src/ap-tag/style/ap-tag.css

@@ -0,0 +1,40 @@
+.aplus-tag-wrapper {
+  text-wrap: nowrap;
+  display: inline-block;
+}
+.aplus-tag-inner-wrapper {
+  display: inline-block;
+  border-radius: 4px;
+  border: 1px solid var(--tag-main-color);
+  background-color: var(--tag-main-color-opacity);
+  box-sizing: border-box;
+  color: var(--tag-main-color);
+}
+.aplus-tag-inner-wrapper--large {
+  padding: 0 8px;
+  line-height: 26px;
+  height: 28px;
+  font-size: 14px;
+}
+.aplus-tag-inner-wrapper--middle {
+  line-height: 22px;
+  padding: 0 8px;
+  height: 24px;
+  font-size: 12px;
+}
+.aplus-tag-inner-wrapper--small {
+  padding: 0 6px;
+  line-height: 19px;
+  height: 20px;
+  font-size: 12px;
+}
+.aplus-tag-inner-wrapper--disabled {
+  border: 1px solid #DEE4ED;
+  background-color: #526a900f;
+  color: #8896b0;
+}
+.aplus-tag-inner-wrapper--disabled-admin {
+  border: 1px solid #d9d9d9;
+  background-color: #9999990f;
+  color: #999;
+}