@aplus-frontend/ui 0.1.6 → 0.1.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/src/ap-tag/ap-tag-group.vue.mjs +88 -70
- package/es/src/check-card/group.vue.d.ts +1 -1
- package/es/src/check-card/group.vue.mjs +1 -1
- package/es/src/check-card/interface.d.ts +1 -1
- package/lib/src/ap-tag/ap-tag-group.vue.js +1 -1
- package/lib/src/check-card/group.vue.d.ts +1 -1
- package/lib/src/check-card/group.vue.js +1 -1
- package/lib/src/check-card/interface.d.ts +1 -1
- package/package.json +1 -1
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import { Tooltip as
|
|
3
|
-
import
|
|
1
|
+
import { defineComponent as D, ref as C, computed as n, unref as f, watch as N, nextTick as S, onMounted as j, onUnmounted as G, openBlock as c, createBlock as d, mergeProps as b, withCtx as g, renderSlot as R, createTextVNode as A, toDisplayString as k, createElementVNode as o, normalizeClass as W, normalizeStyle as _, createElementBlock as T, Fragment as F, renderList as I, createCommentVNode as U } from "vue";
|
|
2
|
+
import { Tooltip as q } from "ant-design-vue";
|
|
3
|
+
import H from "@ant-design/icons-vue";
|
|
4
4
|
import "./ap-tag.vue2.mjs";
|
|
5
5
|
import "../config-provider/index.mjs";
|
|
6
|
-
import { omit as
|
|
6
|
+
import { omit as J } from "lodash-unified";
|
|
7
7
|
import "./style/ap-tag-group.css";
|
|
8
|
-
import { useLocale as
|
|
9
|
-
import { useGlobalConfig as
|
|
10
|
-
import { useNamespace as
|
|
11
|
-
import
|
|
12
|
-
const
|
|
8
|
+
import { useLocale as K } from "../config-provider/hooks/use-locale.mjs";
|
|
9
|
+
import { useGlobalConfig as O } from "../config-provider/hooks/use-global-config.mjs";
|
|
10
|
+
import { useNamespace as Q } from "../config-provider/hooks/use-namespace.mjs";
|
|
11
|
+
import X from "./ap-tag.vue.mjs";
|
|
12
|
+
const pe = /* @__PURE__ */ D({
|
|
13
13
|
__name: "ap-tag-group",
|
|
14
14
|
props: {
|
|
15
15
|
list: { default: () => [] },
|
|
@@ -17,78 +17,96 @@ const ce = /* @__PURE__ */ N({
|
|
|
17
17
|
ellipsisColor: {},
|
|
18
18
|
ellipsis: { default: () => ({}) }
|
|
19
19
|
},
|
|
20
|
-
setup(
|
|
21
|
-
const { t:
|
|
20
|
+
setup(E) {
|
|
21
|
+
const { t: z } = K(), i = E, B = O("uiMode"), { b: V, bm: v } = Q("tag-group"), u = C(), r = n(() => ({
|
|
22
22
|
...{
|
|
23
23
|
iconColor: "#34B77C",
|
|
24
24
|
symbol: "icon",
|
|
25
|
-
text:
|
|
25
|
+
text: z("ap.common.more")
|
|
26
26
|
},
|
|
27
|
-
...
|
|
28
|
-
})),
|
|
29
|
-
|
|
30
|
-
const
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
27
|
+
...i.ellipsis
|
|
28
|
+
})), $ = n(() => r.value.tooltip && typeof r.value.tooltip == "object" ? J(r.value.tooltip, ["trigger", "title"]) : {}), p = n(() => f(m) < i.list.length), m = C(0), L = n(() => i.list.map((e) => e.text).join("、")), M = n(() => [V()].filter(Boolean)), P = n(() => B.value === "aplus" ? [v("ellipsis-text", "aplus")] : [v("ellipsis-text", "admin")]), h = (e, t) => {
|
|
29
|
+
let s = document.createElement("canvas");
|
|
30
|
+
const l = s.getContext("2d");
|
|
31
|
+
l.font = `${e}px system-ui`;
|
|
32
|
+
const a = l.measureText(t);
|
|
33
|
+
return setTimeout(() => {
|
|
34
|
+
s = null;
|
|
35
|
+
}, 0), a.width;
|
|
36
|
+
}, x = () => {
|
|
37
|
+
let e = 0, t = 0;
|
|
38
|
+
if (!u.value) return;
|
|
39
|
+
const s = u.value.offsetWidth;
|
|
40
|
+
for (let l of i.list) {
|
|
41
|
+
const a = l.size === "large" ? 16 : 12, w = h(
|
|
42
|
+
l.size === "large" ? 14 : 12,
|
|
43
|
+
l.text
|
|
44
|
+
) + a + 2 + i.space;
|
|
45
|
+
if (e += w, e > s) {
|
|
46
|
+
e -= w;
|
|
47
|
+
break;
|
|
48
|
+
}
|
|
49
|
+
t++;
|
|
50
|
+
}
|
|
51
|
+
if (t < i.list.length) {
|
|
52
|
+
const a = h(12, r.value.text);
|
|
53
|
+
i.ellipsis.symbol === "icon" ? e += 16 : e += a, e > s && t--;
|
|
54
|
+
}
|
|
55
|
+
m.value = t;
|
|
42
56
|
};
|
|
43
|
-
|
|
44
|
-
() =>
|
|
45
|
-
(e,
|
|
46
|
-
e !==
|
|
57
|
+
N(
|
|
58
|
+
() => i.list,
|
|
59
|
+
(e, t) => {
|
|
60
|
+
e !== t && S(() => {
|
|
61
|
+
x();
|
|
62
|
+
});
|
|
47
63
|
},
|
|
48
64
|
{
|
|
49
65
|
immediate: !0
|
|
50
66
|
}
|
|
51
67
|
);
|
|
52
|
-
const
|
|
53
|
-
|
|
68
|
+
const y = () => {
|
|
69
|
+
x();
|
|
54
70
|
};
|
|
55
|
-
return
|
|
71
|
+
return j(() => {
|
|
56
72
|
[["ellipsisColor", "ellipse.color"]].forEach(
|
|
57
|
-
([e,
|
|
58
|
-
|
|
59
|
-
`[ApTagGroup]: \`${e}\` is deprecated, please use \`${
|
|
73
|
+
([e, t]) => {
|
|
74
|
+
i[e] && console.error(
|
|
75
|
+
`[ApTagGroup]: \`${e}\` is deprecated, please use \`${t}\` instead.`
|
|
60
76
|
);
|
|
61
77
|
}
|
|
62
|
-
), window.addEventListener("resize",
|
|
63
|
-
}),
|
|
64
|
-
window.removeEventListener("resize",
|
|
65
|
-
}), (e,
|
|
66
|
-
title:
|
|
67
|
-
|
|
68
|
-
|
|
78
|
+
), window.addEventListener("resize", y);
|
|
79
|
+
}), G(() => {
|
|
80
|
+
window.removeEventListener("resize", y);
|
|
81
|
+
}), (e, t) => (c(), d(f(q), b({ trigger: "hover" }, $.value), {
|
|
82
|
+
title: g(() => [
|
|
83
|
+
R(e.$slots, "tooltip", { tags: e.list }, () => [
|
|
84
|
+
A(k(L.value), 1)
|
|
69
85
|
])
|
|
70
86
|
]),
|
|
71
|
-
default:
|
|
72
|
-
|
|
73
|
-
class:
|
|
87
|
+
default: g(() => [
|
|
88
|
+
o("div", {
|
|
89
|
+
class: W(M.value),
|
|
74
90
|
ref_key: "container",
|
|
75
|
-
ref:
|
|
76
|
-
style:
|
|
77
|
-
pointerEvents:
|
|
91
|
+
ref: u,
|
|
92
|
+
style: _({
|
|
93
|
+
pointerEvents: p.value ? "auto" : "none"
|
|
94
|
+
// opacity: isUpdating ? '0' : '1'
|
|
78
95
|
})
|
|
79
96
|
}, [
|
|
80
|
-
(
|
|
81
|
-
key:
|
|
97
|
+
(c(!0), T(F, null, I(e.list, (s, l) => (c(), d(X, b({ ref_for: !0 }, s, {
|
|
98
|
+
key: l,
|
|
82
99
|
style: {
|
|
100
|
+
display: l >= m.value ? "none" : "inline-block",
|
|
83
101
|
marginRight: `${e.space}px`
|
|
84
102
|
}
|
|
85
103
|
}), null, 16, ["style"]))), 128)),
|
|
86
|
-
|
|
104
|
+
p.value && r.value.symbol === "icon" ? (c(), d(f(H), {
|
|
87
105
|
key: 0,
|
|
88
|
-
style:
|
|
106
|
+
style: _({ color: e.ellipsisColor || r.value.iconColor })
|
|
89
107
|
}, {
|
|
90
|
-
component:
|
|
91
|
-
|
|
108
|
+
component: g(() => t[0] || (t[0] = [
|
|
109
|
+
o("svg", {
|
|
92
110
|
xmlns: "http://www.w3.org/2000/svg",
|
|
93
111
|
"xmlns:xlink": "http://www.w3.org/1999/xlink",
|
|
94
112
|
fill: "none",
|
|
@@ -97,9 +115,9 @@ const ce = /* @__PURE__ */ N({
|
|
|
97
115
|
height: "16",
|
|
98
116
|
viewBox: "0 0 16 16"
|
|
99
117
|
}, [
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
118
|
+
o("defs", null, [
|
|
119
|
+
o("clipPath", { id: "master_svg0_1133_24991" }, [
|
|
120
|
+
o("rect", {
|
|
103
121
|
x: "0",
|
|
104
122
|
y: "0",
|
|
105
123
|
width: "16",
|
|
@@ -108,9 +126,9 @@ const ce = /* @__PURE__ */ N({
|
|
|
108
126
|
})
|
|
109
127
|
])
|
|
110
128
|
]),
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
129
|
+
o("g", { "clip-path": "url(#master_svg0_1133_24991)" }, [
|
|
130
|
+
o("g", null, [
|
|
131
|
+
o("ellipse", {
|
|
114
132
|
cx: "8",
|
|
115
133
|
cy: "8",
|
|
116
134
|
rx: "1",
|
|
@@ -119,8 +137,8 @@ const ce = /* @__PURE__ */ N({
|
|
|
119
137
|
"fill-opacity": "1"
|
|
120
138
|
})
|
|
121
139
|
]),
|
|
122
|
-
|
|
123
|
-
|
|
140
|
+
o("g", null, [
|
|
141
|
+
o("ellipse", {
|
|
124
142
|
cx: "3.25",
|
|
125
143
|
cy: "8",
|
|
126
144
|
rx: "1",
|
|
@@ -129,8 +147,8 @@ const ce = /* @__PURE__ */ N({
|
|
|
129
147
|
"fill-opacity": "1"
|
|
130
148
|
})
|
|
131
149
|
]),
|
|
132
|
-
|
|
133
|
-
|
|
150
|
+
o("g", null, [
|
|
151
|
+
o("ellipse", {
|
|
134
152
|
cx: "12.75",
|
|
135
153
|
cy: "8",
|
|
136
154
|
rx: "1",
|
|
@@ -143,10 +161,10 @@ const ce = /* @__PURE__ */ N({
|
|
|
143
161
|
], -1)
|
|
144
162
|
])),
|
|
145
163
|
_: 1
|
|
146
|
-
}, 8, ["style"])) :
|
|
164
|
+
}, 8, ["style"])) : p.value && r.value.symbol === "text" ? (c(), T("span", {
|
|
147
165
|
key: 1,
|
|
148
|
-
class:
|
|
149
|
-
}, k(
|
|
166
|
+
class: W(P.value)
|
|
167
|
+
}, k(r.value.text), 3)) : U("", !0)
|
|
150
168
|
], 6)
|
|
151
169
|
]),
|
|
152
170
|
_: 3
|
|
@@ -154,5 +172,5 @@ const ce = /* @__PURE__ */ N({
|
|
|
154
172
|
}
|
|
155
173
|
});
|
|
156
174
|
export {
|
|
157
|
-
|
|
175
|
+
pe as default
|
|
158
176
|
};
|
|
@@ -15,7 +15,7 @@ declare const __VLS_component: DefineComponent<CheckCardGroupProps, {}, {}, {},
|
|
|
15
15
|
multiple?: boolean;
|
|
16
16
|
defaultValue?: CheckCardGroupValueType;
|
|
17
17
|
value?: CheckCardGroupValueType;
|
|
18
|
-
'onUpdate:
|
|
18
|
+
'onUpdate:value'?: (nextValue: CheckCardGroupValueType) => void;
|
|
19
19
|
} & {
|
|
20
20
|
"onUpdate:value"?: ((...args: any[]) => any) | undefined;
|
|
21
21
|
}>, {
|
|
@@ -15,7 +15,7 @@ const z = /* @__PURE__ */ g({
|
|
|
15
15
|
multiple: { type: Boolean, default: !1 },
|
|
16
16
|
defaultValue: { type: [String, Number, Boolean, Array], default: void 0 },
|
|
17
17
|
value: { type: [String, Number, Boolean, Array], default: void 0 },
|
|
18
|
-
"onUpdate:
|
|
18
|
+
"onUpdate:value": {}
|
|
19
19
|
},
|
|
20
20
|
emits: ["update:value"],
|
|
21
21
|
setup(d, { emit: u }) {
|
|
@@ -66,7 +66,7 @@ export type CheckCardGroupProps = CheckCardCommonType & {
|
|
|
66
66
|
* 选中的值（v-model）
|
|
67
67
|
*/
|
|
68
68
|
value?: CheckCardGroupValueType;
|
|
69
|
-
'onUpdate:
|
|
69
|
+
'onUpdate:value'?: (nextValue: CheckCardGroupValueType) => void;
|
|
70
70
|
};
|
|
71
71
|
export type CheckCardGroupContextType = CheckCardCommonType & {
|
|
72
72
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),V=require("ant-design-vue"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),V=require("ant-design-vue"),_=require("@ant-design/icons-vue");require("./ap-tag.vue2.js");require("../config-provider/index.js");const b=require("lodash-unified");require("./style/ap-tag-group.css");const N=require("../config-provider/hooks/use-locale.js"),B=require("../config-provider/hooks/use-global-config.js"),T=require("../config-provider/hooks/use-namespace.js"),q=require("./ap-tag.vue.js"),W=e.defineComponent({__name:"ap-tag-group",props:{list:{default:()=>[]},space:{default:4},ellipsisColor:{},ellipsis:{default:()=>({})}},setup(v){const{t:h}=N.useLocale(),r=v,y=B.useGlobalConfig("uiMode"),{b:x,bm:p}=T.useNamespace("tag-group"),a=e.ref(),n=e.computed(()=>({...{iconColor:"#34B77C",symbol:"icon",text:h("ap.common.more")},...r.ellipsis})),C=e.computed(()=>n.value.tooltip&&typeof n.value.tooltip=="object"?b.omit(n.value.tooltip,["trigger","title"]):{}),c=e.computed(()=>e.unref(u)<r.list.length),u=e.ref(0),w=e.computed(()=>r.list.map(t=>t.text).join("、")),E=e.computed(()=>[x()].filter(Boolean)),k=e.computed(()=>y.value==="aplus"?[p("ellipsis-text","aplus")]:[p("ellipsis-text","admin")]),d=(t,l)=>{let s=document.createElement("canvas");const o=s.getContext("2d");o.font=`${t}px system-ui`;const i=o.measureText(l);return setTimeout(()=>{s=null},0),i.width},m=()=>{let t=0,l=0;if(!a.value)return;const s=a.value.offsetWidth;for(let o of r.list){const i=o.size==="large"?16:12,f=d(o.size==="large"?14:12,o.text)+i+2+r.space;if(t+=f,t>s){t-=f;break}l++}if(l<r.list.length){const i=d(12,n.value.text);r.ellipsis.symbol==="icon"?t+=16:t+=i,t>s&&l--}u.value=l};e.watch(()=>r.list,(t,l)=>{t!==l&&e.nextTick(()=>{m()})},{immediate:!0});const g=()=>{m()};return e.onMounted(()=>{[["ellipsisColor","ellipse.color"]].forEach(([t,l])=>{r[t]&&console.error(`[ApTagGroup]: \`${t}\` is deprecated, please use \`${l}\` instead.`)}),window.addEventListener("resize",g)}),e.onUnmounted(()=>{window.removeEventListener("resize",g)}),(t,l)=>(e.openBlock(),e.createBlock(e.unref(V.Tooltip),e.mergeProps({trigger:"hover"},C.value),{title:e.withCtx(()=>[e.renderSlot(t.$slots,"tooltip",{tags:t.list},()=>[e.createTextVNode(e.toDisplayString(w.value),1)])]),default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(E.value),ref_key:"container",ref:a,style:e.normalizeStyle({pointerEvents:c.value?"auto":"none"})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.list,(s,o)=>(e.openBlock(),e.createBlock(q.default,e.mergeProps({ref_for:!0},s,{key:o,style:{display:o>=u.value?"none":"inline-block",marginRight:`${t.space}px`}}),null,16,["style"]))),128)),c.value&&n.value.symbol==="icon"?(e.openBlock(),e.createBlock(e.unref(_),{key:0,style:e.normalizeStyle({color:t.ellipsisColor||n.value.iconColor})},{component:e.withCtx(()=>l[0]||(l[0]=[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)])),_:1},8,["style"])):c.value&&n.value.symbol==="text"?(e.openBlock(),e.createElementBlock("span",{key:1,class:e.normalizeClass(k.value)},e.toDisplayString(n.value.text),3)):e.createCommentVNode("",!0)],6)]),_:3},16))}});exports.default=W;
|
|
@@ -15,7 +15,7 @@ declare const __VLS_component: DefineComponent<CheckCardGroupProps, {}, {}, {},
|
|
|
15
15
|
multiple?: boolean;
|
|
16
16
|
defaultValue?: CheckCardGroupValueType;
|
|
17
17
|
value?: CheckCardGroupValueType;
|
|
18
|
-
'onUpdate:
|
|
18
|
+
'onUpdate:value'?: (nextValue: CheckCardGroupValueType) => void;
|
|
19
19
|
} & {
|
|
20
20
|
"onUpdate:value"?: ((...args: any[]) => any) | undefined;
|
|
21
21
|
}>, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("vue");require("../hooks/index.js");const
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("vue");require("../hooks/index.js");const g=require("./context.js"),m=require("lodash-unified"),b=require("../hooks/useControllableValue.js"),y=a.defineComponent({name:"CheckCardGroup",__name:"group",props:{bordered:{type:Boolean,default:void 0},disabled:{type:Boolean,default:void 0},loading:{type:Boolean,default:void 0},size:{default:void 0},stopPropagation:{type:[Boolean,Function],default:void 0},multiple:{type:Boolean,default:!1},defaultValue:{type:[String,Number,Boolean,Array],default:void 0},value:{type:[String,Number,Boolean,Array],default:void 0},"onUpdate:value":{}},emits:["update:value"],setup(i,{emit:d}){const t=i,s=d,{value:r,updateValue:n}=b.useControllableValue(t,s),u=new Map;function p(e){if(!t.multiple){if(a.unref(r)===e)return;n(e);return}let o=[...a.unref(r)||[]];const v=o.find(l=>l===e);m.isUndefined(v)?o.push(e):o=o.filter(l=>l!==e).filter(l=>u.has(l)),n(o)}function f(e){u.set(e,!0)}function c(e){u.delete(e)}return g.useProvideCheckCard(a.computed(()=>({toggleOption:p,registerValue:f,cancelValue:c,disabled:t.disabled,size:t.size,bordered:t.bordered,loading:t.loading,value:a.unref(r),multiple:t.multiple,stopPropagation:t.stopPropagation}))),(e,o)=>a.renderSlot(e.$slots,"default")}});exports.default=y;
|
|
@@ -66,7 +66,7 @@ export type CheckCardGroupProps = CheckCardCommonType & {
|
|
|
66
66
|
* 选中的值（v-model）
|
|
67
67
|
*/
|
|
68
68
|
value?: CheckCardGroupValueType;
|
|
69
|
-
'onUpdate:
|
|
69
|
+
'onUpdate:value'?: (nextValue: CheckCardGroupValueType) => void;
|
|
70
70
|
};
|
|
71
71
|
export type CheckCardGroupContextType = CheckCardCommonType & {
|
|
72
72
|
/**
|