@shtabapp/ui-kit 1.45.0 → 1.47.0
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/CHANGELOG.md +13 -0
- package/dist/{SChartBurnup-DhuCNXhU.cjs → SChartBurnup-BhCS06uF.cjs} +1 -1
- package/dist/SChartBurnup-CG239MJx.js +251 -0
- package/dist/SChartHorizontalBar-DnKbf_9E.cjs +1 -0
- package/dist/SChartHorizontalBar-DqTZ4H-9.js +175 -0
- package/dist/SChartLegend-DGtjd6zV.cjs +1 -0
- package/dist/SChartLegend-oZoF8XK7.js +42 -0
- package/dist/SChartLine-CEnRbnVo.cjs +1 -0
- package/dist/SChartLine-CQhbtAjJ.js +129 -0
- package/dist/SChartMultiLine-B6GldTYv.cjs +1 -0
- package/dist/SChartMultiLine-CPEglksk.js +198 -0
- package/dist/SChartPie-CQyENNM6.cjs +1 -0
- package/dist/SChartPie-DXHCXNEs.js +168 -0
- package/dist/{SChartProgress-Zdphet8I.js → SChartProgress-BwDuidgB.js} +54 -50
- package/dist/{SChartProgress-QsGTZ8kT.cjs → SChartProgress-CMcM6yvT.cjs} +1 -1
- package/dist/SChartSkeletonHost-BlIYGj-7.cjs +1 -0
- package/dist/{SChartSkeletonHost-CecfQ3Ye.js → SChartSkeletonHost-DSFyP_DN.js} +150 -89
- package/dist/SChartStackedArea-BR7W44h6.js +254 -0
- package/dist/SChartStackedArea-DHSamqau.cjs +1 -0
- package/dist/SChartStackedBar-B3HcO4UQ.cjs +1 -0
- package/dist/SChartStackedBar-BbYna5KB.js +245 -0
- package/dist/{SColorPicker-ksmNupJa.js → SColorPicker-BqsD-5xA.js} +1 -1
- package/dist/{SColorPicker-BIrkgFys.cjs → SColorPicker-CeKB3QS1.cjs} +1 -1
- package/dist/SList-DAzztC-7.js +514 -0
- package/dist/SList-S18K8mlH.cjs +1 -0
- package/dist/{SSelect-DS2EGmjV.js → SSelect-Bntb-dgY.js} +1 -1
- package/dist/{SSelect-CkV6gq4S.cjs → SSelect-DcTEwHx6.cjs} +1 -1
- package/dist/components/SChartBurnup/SChartBurnup.vue.d.ts +4 -1
- package/dist/components/SChartBurnup/SChartBurnup.vue.d.ts.map +1 -1
- package/dist/components/SChartHorizontalBar/SChartHorizontalBar.vue.d.ts +9 -2
- package/dist/components/SChartHorizontalBar/SChartHorizontalBar.vue.d.ts.map +1 -1
- package/dist/components/SChartHorizontalBar/utils/buildSChartHorizontalBarConfig.d.ts +1 -0
- package/dist/components/SChartHorizontalBar/utils/buildSChartHorizontalBarConfig.d.ts.map +1 -1
- package/dist/components/SChartLegend/SChartLegend.types.d.ts +2 -0
- package/dist/components/SChartLegend/SChartLegend.types.d.ts.map +1 -1
- package/dist/components/SChartLegend/SChartLegend.vue.d.ts +5 -1
- package/dist/components/SChartLegend/SChartLegend.vue.d.ts.map +1 -1
- package/dist/components/SChartLine/SChartLine.vue.d.ts +4 -1
- package/dist/components/SChartLine/SChartLine.vue.d.ts.map +1 -1
- package/dist/components/SChartMultiLine/SChartMultiLine.vue.d.ts +9 -2
- package/dist/components/SChartMultiLine/SChartMultiLine.vue.d.ts.map +1 -1
- package/dist/components/SChartMultiLine/utils/buildMultiLineChartConfig.d.ts +2 -1
- package/dist/components/SChartMultiLine/utils/buildMultiLineChartConfig.d.ts.map +1 -1
- package/dist/components/SChartPie/SChartPie.vue.d.ts +9 -2
- package/dist/components/SChartPie/SChartPie.vue.d.ts.map +1 -1
- package/dist/components/SChartPie/utils/buildPieChartConfig.d.ts +2 -1
- package/dist/components/SChartPie/utils/buildPieChartConfig.d.ts.map +1 -1
- package/dist/components/SChartProgress/SChartProgress.vue.d.ts +4 -1
- package/dist/components/SChartProgress/SChartProgress.vue.d.ts.map +1 -1
- package/dist/components/SChartSegmentedBar/SChartSegmentedBar.vue.d.ts +9 -2
- package/dist/components/SChartSegmentedBar/SChartSegmentedBar.vue.d.ts.map +1 -1
- package/dist/components/SChartSegmentedBar/utils/buildSegmentedBarChartConfig.d.ts +2 -1
- package/dist/components/SChartSegmentedBar/utils/buildSegmentedBarChartConfig.d.ts.map +1 -1
- package/dist/components/SChartStackedArea/SChartStackedArea.vue.d.ts +9 -2
- package/dist/components/SChartStackedArea/SChartStackedArea.vue.d.ts.map +1 -1
- package/dist/components/SChartStackedArea/utils/buildStackedAreaChartConfig.d.ts +2 -1
- package/dist/components/SChartStackedArea/utils/buildStackedAreaChartConfig.d.ts.map +1 -1
- package/dist/components/SChartStackedBar/SChartStackedBar.vue.d.ts +9 -2
- package/dist/components/SChartStackedBar/SChartStackedBar.vue.d.ts.map +1 -1
- package/dist/components/SChartStackedBar/utils/buildStackedBarChartConfig.d.ts +2 -1
- package/dist/components/SChartStackedBar/utils/buildStackedBarChartConfig.d.ts.map +1 -1
- package/dist/components/SList/SList.types.d.ts +11 -0
- package/dist/components/SList/SList.types.d.ts.map +1 -1
- package/dist/components/SList/SList.vue.d.ts +11 -3
- package/dist/components/SList/SList.vue.d.ts.map +1 -1
- package/dist/composables/useChartInteractivity.d.ts +14 -0
- package/dist/composables/useChartInteractivity.d.ts.map +1 -0
- package/dist/composables/useFlatTreeList.d.ts +4 -1
- package/dist/composables/useFlatTreeList.d.ts.map +1 -1
- package/dist/composables/useHasListener.d.ts +2 -0
- package/dist/composables/useHasListener.d.ts.map +1 -0
- package/dist/{createChartCrosshairPlugin-HfMMUP5O.cjs → createChartCrosshairPlugin-DdLyEWI0.cjs} +1 -1
- package/dist/{createChartCrosshairPlugin-BC0IDCn3.js → createChartCrosshairPlugin-q3U4ePnf.js} +2 -2
- package/dist/entries/chart-burnup.cjs +1 -1
- package/dist/entries/chart-burnup.js +1 -1
- package/dist/entries/chart-horizontal-bar.cjs +1 -1
- package/dist/entries/chart-horizontal-bar.js +1 -1
- package/dist/entries/chart-line.cjs +1 -1
- package/dist/entries/chart-line.js +1 -1
- package/dist/entries/chart-multi-line.cjs +1 -1
- package/dist/entries/chart-multi-line.js +1 -1
- package/dist/entries/chart-pie.cjs +1 -1
- package/dist/entries/chart-pie.js +1 -1
- package/dist/entries/chart-progress.cjs +1 -1
- package/dist/entries/chart-progress.js +1 -1
- package/dist/entries/chart-stacked-area.cjs +1 -1
- package/dist/entries/chart-stacked-area.js +1 -1
- package/dist/entries/chart-stacked-bar.cjs +1 -1
- package/dist/entries/chart-stacked-bar.js +1 -1
- package/dist/entries/color-picker.cjs +1 -1
- package/dist/entries/color-picker.js +1 -1
- package/dist/entries/list.cjs +1 -1
- package/dist/entries/list.js +1 -1
- package/dist/entries/select.cjs +1 -1
- package/dist/entries/select.js +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.js +184 -140
- package/dist/resolveSeriesPaletteColor-YACKW1NO.cjs +1 -0
- package/dist/{resolveSeriesPaletteColor-m8HQ9qwV.js → resolveSeriesPaletteColor-fuhGbjFO.js} +1 -1
- package/dist/{resolveStackedChartContext-DdraOueU.js → resolveStackedChartContext-BiIGZ2or.js} +5 -5
- package/dist/{resolveStackedChartContext-BywAnZUu.cjs → resolveStackedChartContext-Bp75eU_I.cjs} +1 -1
- package/dist/useHasListener-BPgtbbo6.cjs +1 -0
- package/dist/useHasListener-RSjlUyqH.js +8 -0
- package/dist/utils/chart/core/chartCssVariables.d.ts +2 -0
- package/dist/utils/chart/core/chartCssVariables.d.ts.map +1 -1
- package/dist/utils/chart/core/chartInteractivity.d.ts +41 -0
- package/dist/utils/chart/core/chartInteractivity.d.ts.map +1 -0
- package/dist/utils/chart/horizontalBar/buildHorizontalBarChartConfig.d.ts +2 -1
- package/dist/utils/chart/horizontalBar/buildHorizontalBarChartConfig.d.ts.map +1 -1
- package/package.json +3 -3
- package/dist/SChartBurnup-DYBnJMnm.js +0 -247
- package/dist/SChartHorizontalBar-DMBzyz9x.cjs +0 -1
- package/dist/SChartHorizontalBar-bm3Jexa3.js +0 -156
- package/dist/SChartLegend-Chr0IZWN.js +0 -30
- package/dist/SChartLegend-DXFXKXCm.cjs +0 -1
- package/dist/SChartLine-CiREb4H_.js +0 -125
- package/dist/SChartLine-P57XRR2o.cjs +0 -1
- package/dist/SChartMultiLine-3cdB0U12.js +0 -166
- package/dist/SChartMultiLine-BW1kITlR.cjs +0 -1
- package/dist/SChartPie-55wx2zRi.cjs +0 -1
- package/dist/SChartPie-Dc_gjzIl.js +0 -143
- package/dist/SChartSkeletonHost-CfM0zolj.cjs +0 -1
- package/dist/SChartStackedArea-BaJ963lU.cjs +0 -1
- package/dist/SChartStackedArea-cjN9gECV.js +0 -219
- package/dist/SChartStackedBar-0jGICBA0.js +0 -217
- package/dist/SChartStackedBar-j9WyOnsL.cjs +0 -1
- package/dist/SList-BtfUntkw.js +0 -437
- package/dist/SList-fZQdPkFG.cjs +0 -1
- package/dist/resolveSeriesPaletteColor-BcFyrhh0.cjs +0 -1
|
@@ -0,0 +1,245 @@
|
|
|
1
|
+
import { _ as e, a as t, c as n, g as r, h as i, i as a, m as o, o as s, r as c, s as l, t as u, v as d, w as f } from "./SChartSkeletonHost-DSFyP_DN.js";
|
|
2
|
+
import { t as p } from "./buildCartesianChartScales-EofFq3ry.js";
|
|
3
|
+
import { n as m, t as h } from "./buildChartSeriesPoints-D8Xpfwp7.js";
|
|
4
|
+
import { t as g } from "./resolveStackedChartContext-BiIGZ2or.js";
|
|
5
|
+
import { t as _ } from "./resolveSeriesPaletteColor-fuhGbjFO.js";
|
|
6
|
+
import { t as v } from "./SChartLegend-oZoF8XK7.js";
|
|
7
|
+
import { t as y } from "./useHasListener-RSjlUyqH.js";
|
|
8
|
+
import { computed as b, createBlock as x, createCommentVNode as S, createElementBlock as C, createElementVNode as w, createVNode as T, defineComponent as E, normalizeClass as D, openBlock as O, unref as k, useTemplateRef as A, withCtx as j } from "vue";
|
|
9
|
+
//#region src/utils/chart/bar/resolveBarStackedSeriesColor.ts
|
|
10
|
+
var M = (t, n, i, a = !1) => _(t, n, i, a, {
|
|
11
|
+
palette: e,
|
|
12
|
+
paletteFallback: d.barStackedPalette1,
|
|
13
|
+
skeletonPalette: r,
|
|
14
|
+
skeletonFallback: d.barSkeletonPalette1
|
|
15
|
+
}), N = 3, P = 4, F = (e, t, n, r, i, a) => {
|
|
16
|
+
let o = Math.min(a, r / 2, i), s = o;
|
|
17
|
+
e.beginPath(), e.moveTo(t, n + i), e.lineTo(t, n + o), e.arcTo(t, n, t + o, n, o), e.lineTo(t + r - s, n), e.arcTo(t + r, n, t + r, n + s, s), e.lineTo(t + r, n + i), e.closePath(), e.stroke();
|
|
18
|
+
}, I = (e) => ({
|
|
19
|
+
id: "stackedBarHoverOutline",
|
|
20
|
+
afterDatasetsDraw(t) {
|
|
21
|
+
let n = t.tooltip?.getActiveElements() ?? [];
|
|
22
|
+
if (n.length === 0) return;
|
|
23
|
+
let r = Infinity, i = Infinity, a = -Infinity, o = -Infinity;
|
|
24
|
+
for (let e of n) {
|
|
25
|
+
let { x: t, y: n, width: s, base: c } = e.element.getProps([
|
|
26
|
+
"x",
|
|
27
|
+
"y",
|
|
28
|
+
"width",
|
|
29
|
+
"base"
|
|
30
|
+
]), l = t - s / 2, u = t + s / 2, d = n, f = c;
|
|
31
|
+
r = Math.min(r, l), a = Math.max(a, u), i = Math.min(i, d), o = Math.max(o, f);
|
|
32
|
+
}
|
|
33
|
+
let s = f(d.barHoverOutline, e), { ctx: c, chartArea: l } = t, u = N / 2, p = l?.bottom ?? o, m = Math.min(o, p), h = r + u, g = i + u, _ = a - r - N, v = m - i - N;
|
|
34
|
+
if (_ <= 0 || v <= 0) return;
|
|
35
|
+
let y = Math.max(0, P - u);
|
|
36
|
+
c.save(), c.strokeStyle = s, c.lineWidth = N, F(c, h, g, _, v, y), c.restore();
|
|
37
|
+
}
|
|
38
|
+
}), L = 5, R = "stack0", z = 36, B = 4, V = 12, H = ({ seriesList: e, colorHostElement: r, yMax: a, yMin: c, yStep: u = L, skeleton: d = !1, onSeriesClick: f }) => {
|
|
39
|
+
let m = g({
|
|
40
|
+
seriesList: e,
|
|
41
|
+
colorHostElement: r,
|
|
42
|
+
yMax: a,
|
|
43
|
+
yMin: c,
|
|
44
|
+
yStep: u,
|
|
45
|
+
skeleton: d
|
|
46
|
+
});
|
|
47
|
+
if (!m) return null;
|
|
48
|
+
let { axisLabelColor: h, gridColor: _, tooltipBackgroundColor: v, tooltipTextColor: y, resolvedYMax: b, resolvedYMin: x, chartLabels: S, pointCaptions: C, topSeriesIndex: w } = m, T = t({
|
|
49
|
+
kind: "series",
|
|
50
|
+
skeleton: d,
|
|
51
|
+
colorHostElement: r,
|
|
52
|
+
onIndexClick: f
|
|
53
|
+
});
|
|
54
|
+
return {
|
|
55
|
+
type: "bar",
|
|
56
|
+
data: {
|
|
57
|
+
labels: S,
|
|
58
|
+
datasets: e.map((e, t) => {
|
|
59
|
+
let n = M(t, r, e.fillColor, d);
|
|
60
|
+
return {
|
|
61
|
+
label: e.label,
|
|
62
|
+
data: e.points.map((e) => e.value),
|
|
63
|
+
backgroundColor: n,
|
|
64
|
+
hoverBackgroundColor: n,
|
|
65
|
+
borderWidth: 0,
|
|
66
|
+
hoverBorderWidth: 0,
|
|
67
|
+
stack: R,
|
|
68
|
+
barThickness: z,
|
|
69
|
+
borderRadius: t === w ? {
|
|
70
|
+
topLeft: B,
|
|
71
|
+
topRight: B
|
|
72
|
+
} : 0,
|
|
73
|
+
...t === 0 ? { captions: C } : {}
|
|
74
|
+
};
|
|
75
|
+
})
|
|
76
|
+
},
|
|
77
|
+
options: {
|
|
78
|
+
responsive: !0,
|
|
79
|
+
maintainAspectRatio: !1,
|
|
80
|
+
onHover: T.onHover,
|
|
81
|
+
onClick: T.onClick,
|
|
82
|
+
hover: d ? void 0 : {
|
|
83
|
+
mode: "nearest",
|
|
84
|
+
intersect: !0
|
|
85
|
+
},
|
|
86
|
+
interaction: s(d, {
|
|
87
|
+
mode: "index",
|
|
88
|
+
intersect: !1
|
|
89
|
+
}),
|
|
90
|
+
plugins: {
|
|
91
|
+
legend: { display: !1 },
|
|
92
|
+
tooltip: {
|
|
93
|
+
enabled: l(d),
|
|
94
|
+
backgroundColor: v,
|
|
95
|
+
titleColor: y,
|
|
96
|
+
bodyColor: y,
|
|
97
|
+
displayColors: !1,
|
|
98
|
+
position: o,
|
|
99
|
+
yAlign: "bottom",
|
|
100
|
+
xAlign: "center",
|
|
101
|
+
caretPadding: 8,
|
|
102
|
+
callbacks: i()
|
|
103
|
+
}
|
|
104
|
+
},
|
|
105
|
+
scales: p({
|
|
106
|
+
axisLabelColor: h,
|
|
107
|
+
gridColor: _,
|
|
108
|
+
yMin: x,
|
|
109
|
+
yMax: b,
|
|
110
|
+
yStep: u,
|
|
111
|
+
stacked: !0,
|
|
112
|
+
xTickFontSize: V
|
|
113
|
+
})
|
|
114
|
+
},
|
|
115
|
+
plugins: n(d, [I(r), ...T.plugins])
|
|
116
|
+
};
|
|
117
|
+
}, U = [
|
|
118
|
+
"5 неделя",
|
|
119
|
+
"6 неделя",
|
|
120
|
+
"7 неделя",
|
|
121
|
+
"8 неделя",
|
|
122
|
+
"9 неделя",
|
|
123
|
+
"10 неделя",
|
|
124
|
+
"11 неделя",
|
|
125
|
+
"12 неделя",
|
|
126
|
+
"13 неделя",
|
|
127
|
+
"14 неделя",
|
|
128
|
+
"15 неделя",
|
|
129
|
+
"16 неделя"
|
|
130
|
+
], W = [
|
|
131
|
+
12,
|
|
132
|
+
14,
|
|
133
|
+
15,
|
|
134
|
+
16,
|
|
135
|
+
18,
|
|
136
|
+
17,
|
|
137
|
+
16,
|
|
138
|
+
15,
|
|
139
|
+
14,
|
|
140
|
+
13,
|
|
141
|
+
12,
|
|
142
|
+
11
|
|
143
|
+
], G = [
|
|
144
|
+
6,
|
|
145
|
+
7,
|
|
146
|
+
8,
|
|
147
|
+
8,
|
|
148
|
+
9,
|
|
149
|
+
8,
|
|
150
|
+
7,
|
|
151
|
+
7,
|
|
152
|
+
6,
|
|
153
|
+
6,
|
|
154
|
+
5,
|
|
155
|
+
5
|
|
156
|
+
], K = [
|
|
157
|
+
4,
|
|
158
|
+
5,
|
|
159
|
+
5,
|
|
160
|
+
6,
|
|
161
|
+
6,
|
|
162
|
+
5,
|
|
163
|
+
5,
|
|
164
|
+
4,
|
|
165
|
+
4,
|
|
166
|
+
3,
|
|
167
|
+
3,
|
|
168
|
+
3
|
|
169
|
+
], q = [
|
|
170
|
+
"Series 1",
|
|
171
|
+
"Series 2",
|
|
172
|
+
"Series 3"
|
|
173
|
+
], J = [
|
|
174
|
+
{
|
|
175
|
+
label: q[0] ?? "Series 1",
|
|
176
|
+
points: h(U, W)
|
|
177
|
+
},
|
|
178
|
+
{
|
|
179
|
+
label: q[1] ?? "Series 2",
|
|
180
|
+
points: h(U, G)
|
|
181
|
+
},
|
|
182
|
+
{
|
|
183
|
+
label: q[2] ?? "Series 3",
|
|
184
|
+
points: h(U, K)
|
|
185
|
+
}
|
|
186
|
+
], Y = { class: "s-ui-chart-stacked-bar__canvas-wrap" }, X = /* @__PURE__ */ E({
|
|
187
|
+
__name: "SChartStackedBar",
|
|
188
|
+
props: {
|
|
189
|
+
series: { default: () => [] },
|
|
190
|
+
loading: {
|
|
191
|
+
type: Boolean,
|
|
192
|
+
default: !1
|
|
193
|
+
},
|
|
194
|
+
yMax: {},
|
|
195
|
+
yStep: {}
|
|
196
|
+
},
|
|
197
|
+
emits: ["seriesClick"],
|
|
198
|
+
setup(e, { expose: t, emit: n }) {
|
|
199
|
+
let r = n, i = A("chartRootRef"), o = A("chartCanvasRef"), s = b(() => e.loading ? J : e.series), l = (t) => {
|
|
200
|
+
let n = e.series[t];
|
|
201
|
+
n && r("seriesClick", t, n);
|
|
202
|
+
}, d = y("onSeriesClick"), f = b(() => !e.loading && e.series.length === 0 ? null : H({
|
|
203
|
+
seriesList: s.value,
|
|
204
|
+
colorHostElement: i.value,
|
|
205
|
+
yMax: e.loading ? 50 : e.yMax,
|
|
206
|
+
yMin: e.loading ? 0 : void 0,
|
|
207
|
+
yStep: e.loading ? 5 : e.yStep,
|
|
208
|
+
skeleton: e.loading,
|
|
209
|
+
onSeriesClick: d() ? l : void 0
|
|
210
|
+
})), p = b(() => m(s.value, (t, n) => M(t, i.value, n, e.loading))), { chartInstance: h } = a({
|
|
211
|
+
canvasRef: o,
|
|
212
|
+
config: f,
|
|
213
|
+
enabled: b(() => e.loading || e.series.length > 0)
|
|
214
|
+
}), { exportImage: g, handleLegendItemHover: _ } = c({
|
|
215
|
+
chartInstance: h,
|
|
216
|
+
canvasRef: o,
|
|
217
|
+
colorHostElement: i
|
|
218
|
+
});
|
|
219
|
+
return t({ exportImage: g }), (t, n) => (O(), C("div", {
|
|
220
|
+
ref_key: "chartRootRef",
|
|
221
|
+
ref: i,
|
|
222
|
+
class: D(["s-ui-chart-stacked-bar", { "s-ui-chart-stacked-bar--skeleton": e.loading }])
|
|
223
|
+
}, [w("div", Y, [T(k(u), { loading: e.loading }, {
|
|
224
|
+
default: j(() => [w("canvas", {
|
|
225
|
+
ref_key: "chartCanvasRef",
|
|
226
|
+
ref: o,
|
|
227
|
+
class: "s-ui-chart-stacked-bar__canvas"
|
|
228
|
+
}, null, 512)]),
|
|
229
|
+
_: 1
|
|
230
|
+
}, 8, ["loading"])]), p.value.length ? (O(), x(k(v), {
|
|
231
|
+
key: 0,
|
|
232
|
+
items: p.value,
|
|
233
|
+
disabled: e.loading,
|
|
234
|
+
interactive: !e.loading,
|
|
235
|
+
onItemHover: k(_)
|
|
236
|
+
}, null, 8, [
|
|
237
|
+
"items",
|
|
238
|
+
"disabled",
|
|
239
|
+
"interactive",
|
|
240
|
+
"onItemHover"
|
|
241
|
+
])) : S("", !0)], 2));
|
|
242
|
+
}
|
|
243
|
+
});
|
|
244
|
+
//#endregion
|
|
245
|
+
export { X as t };
|
|
@@ -5,7 +5,7 @@ import { n as s, r as c, t as l } from "./SButton.types-CpdHQtyx.js";
|
|
|
5
5
|
import { t as u } from "./SButton-DnU_XZ1C.js";
|
|
6
6
|
import { i as d } from "./useFloatingOverlay-QcumEYEq.js";
|
|
7
7
|
import { t as f } from "./SDropdown-CTQ5Qlez.js";
|
|
8
|
-
import { r as p, t as m } from "./SSelect-
|
|
8
|
+
import { r as p, t as m } from "./SSelect-Bntb-dgY.js";
|
|
9
9
|
import { Fragment as h, computed as g, createBlock as _, createElementBlock as v, createElementVNode as y, createTextVNode as b, createVNode as x, defineComponent as S, mergeModels as C, mergeProps as w, nextTick as T, normalizeClass as E, normalizeStyle as D, onMounted as O, openBlock as k, ref as A, shallowRef as j, toDisplayString as M, toRef as N, unref as P, useModel as F, useTemplateRef as I, vModelText as L, watch as R, withCtx as z, withDirectives as B } from "vue";
|
|
10
10
|
import { ESColorSwatchSize as V, SColorSwatch as ee, useUiKitI18n as H } from "@shtabapp/ui-kit-primitives";
|
|
11
11
|
import { useEventListener as U } from "@vueuse/core";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const e=require("./contrastSurfaceTextColor-BRjRzXyZ.cjs"),t=require("./SColorPalette-CqfVzhda.cjs"),n=require("./colorValue-Dda7fKd3.cjs"),r=require("./SButton.types-UKroD-ev.cjs"),i=require("./SButton-C-z_q5CG.cjs"),a=require("./useFloatingOverlay-B1UCUYQQ.cjs"),o=require("./SDropdown-_QUOP-rw.cjs"),s=require("./SSelect-CkV6gq4S.cjs");let c=require("vue"),l=require("@shtabapp/ui-kit-primitives"),u=require("@vueuse/core");var d=e=>Math.max(0,Math.min(255,Math.round(e))),f=e=>{let t=e%360;return t<0?t+360:t},p=e=>Math.max(0,Math.min(100,Math.round(e))),m=e=>{let t=e.slice(1);if(t.length===3){let e=t[0],n=t[1],r=t[2];return!e||!n||!r?void 0:`${e}${e}${n}${n}${r}${r}`}if(t.length===6||t.length===8)return t.slice(0,6)},h=e=>{let t=m(e);if(!t)return;let n=Number.parseInt(t.slice(0,2),16),r=Number.parseInt(t.slice(2,4),16),i=Number.parseInt(t.slice(4,6),16);if(!(Number.isNaN(n)||Number.isNaN(r)||Number.isNaN(i)))return{first:n,second:r,third:i}},g=e=>{let t=d(e.first),n=d(e.second),r=d(e.third);return`#${t.toString(16).padStart(2,`0`).toUpperCase()}${n.toString(16).padStart(2,`0`).toUpperCase()}${r.toString(16).padStart(2,`0`).toUpperCase()}`},_=e=>{let t=h(e);if(!t)return;let n=t.first/255,r=t.second/255,i=t.third/255,a=Math.max(n,r,i),o=Math.min(n,r,i),s=a-o,c=0,l=(a+o)/2;s!==0&&(c=a===n?((r-i)/s+(r<i?6:0))*60:a===r?((i-n)/s+2)*60:((n-r)/s+4)*60);let u=0;return s!==0&&(u=l>.5?s/(2-a-o):s/(a+o)),{first:Math.round(c),second:Math.round(u*100),third:Math.round(l*100)}},v=e=>{let t=f(e.first),n=p(e.second)/100,r=p(e.third)/100,i=e=>{let i=(t+e)/30;return d((r-n*Math.min(r,1-r)*Math.max(-1,Math.min(i%2-1,1)))*255)};return g({first:i(0),second:i(8),third:i(4)})},y=t=>{let n=t.toUpperCase(),r=n.startsWith(`#`)?n.slice(1):n;if(!/^[0-9A-F]{3}$/.test(r)&&!/^[0-9A-F]{6}$/.test(r))return;let i=`#${r}`;if(e.n(i))return g(h(i)??{first:0,second:0,third:0})},b=e=>e.slice(1).toUpperCase(),x=e=>{let t=e.first/255,n=e.second/255,r=e.third/255,i=Math.max(t,n,r),a=i-Math.min(t,n,r),o=0;a!==0&&(o=i===t?(n-r)/a%6:i===n?(r-t)/a+2:(t-n)/a+4,o=Math.round(o*60),o<0&&(o+=360));let s=i===0?0:a/i;return{hue:o,saturation:s,value:i}},S=e=>{let t=e.value*e.saturation,n=e.hue/60,r=t*(1-Math.abs(n%2-1)),i=e.value-t,a=0,o=0,s=0;return n>=0&&n<1?(a=t,o=r):n>=1&&n<2?(a=r,o=t):n>=2&&n<3?(o=t,s=r):n>=3&&n<4?(o=r,s=t):n>=4&&n<5?(a=r,s=t):(a=t,s=r),{first:d((a+i)*255),second:d((o+i)*255),third:d((s+i)*255)}},C=e=>{let t=h(e);if(t)return x(t)},w=e=>g(S(e)),T=[t.o.HEX,t.o.RGB,t.o.HSL],E={[t.o.HEX]:`Hex`,[t.o.RGB]:`RGB`,[t.o.HSL]:`HSL`},D=e=>{let t=getComputedStyle(e).backgroundColor.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)/);if(!t)return;let n=Number.parseInt(t[1]??`0`,10),r=Number.parseInt(t[2]??`0`,10),i=Number.parseInt(t[3]??`0`,10);return`#${n.toString(16).padStart(2,`0`).toUpperCase()}${r.toString(16).padStart(2,`0`).toUpperCase()}${i.toString(16).padStart(2,`0`).toUpperCase()}`},O=(t,r)=>{if(n.n(t)&&e.n(t))return t;if(r)return D(r)},k=(e,n)=>n===t.o.HEX?b(e):n===t.o.RGB?h(e)??{first:0,second:0,third:0}:_(e)??{first:0,second:0,third:0},A=e=>{let t=Number.parseInt(e,10);if(!Number.isNaN(t))return t},j=(e,n)=>{if(e===t.o.HEX)return typeof n==`string`?y(n):void 0;if(typeof n==`string`)return;if(e===t.o.RGB){let e=g({first:A(String(n.first))??0,second:A(String(n.second))??0,third:A(String(n.third))??0});return h(e)?e:void 0}let r=v({first:A(String(n.first))??0,second:A(String(n.second))??0,third:A(String(n.third))??0});if(r&&_(r))return r},M=17,N=`#000000`,P=e=>e??N,F=({modelValue:e,getEditableHex:t,saturationAreaRef:n,hueSliderRef:r,disabled:i,readonly:a})=>{let o=C(P(t()))??{hue:0,saturation:0,value:0},s=(0,c.ref)(o.hue),l=(0,c.ref)(o.saturation),d=(0,c.ref)(o.value),f=(0,c.ref)(!1),p=(0,c.ref)(!1),m=(0,c.ref)(!1),h=(0,c.shallowRef)(null),g=(0,c.shallowRef)(null),_=(0,c.computed)(()=>w({hue:s.value,saturation:l.value,value:d.value})),v=(0,c.computed)(()=>w({hue:s.value,saturation:1,value:1})),y=e=>{s.value=Math.max(0,Math.min(360,e))},b=(e,t)=>{l.value=Math.max(0,Math.min(1,e)),d.value=Math.max(0,Math.min(1,t))},x=e=>{let t=C(P(e));t&&(f.value=!0,t.saturation>0&&(s.value=t.hue),l.value=t.saturation,d.value=t.value,f.value=!1)},S=()=>{let e=t();e&&e.toUpperCase()!==_.value.toUpperCase()&&x(e)},T=()=>{let n=_.value;t()?.toUpperCase()!==n.toUpperCase()&&(f.value=!0,e.value=n,f.value=!1)};(0,c.watch)([s,l,d],()=>{f.value||T()}),(0,c.watch)(e,()=>{f.value||S()}),(0,c.onMounted)(()=>{(0,c.nextTick)(()=>{E(),D(),S()})});let E=()=>{h.value=n.value?.getBoundingClientRect()??null},D=()=>{g.value=r.value?.getBoundingClientRect()??null},O=(0,c.computed)(()=>{let e=h.value;return e?{transform:`translate3d(calc(${l.value*e.width}px - 50%), calc(${(1-d.value)*e.height}px - 50%), 0)`}:{}}),k=(0,c.computed)(()=>{let e=g.value;return e?{transform:`translate3d(-50%, calc(${s.value/360*e.height}px - 50%), 0)`}:{}}),A=()=>!i.value&&!a.value,j=e=>{let t=h.value;if(!t)return;let n=Math.max(0,Math.min(e.clientX-t.left,t.width)),r=Math.max(0,Math.min(e.clientY-t.top,t.height));b(n/t.width,1-r/t.height)},M=e=>{let t=g.value;t&&y(Math.max(0,Math.min(e.clientY-t.top,t.height))/t.height*360)},N=e=>{A()&&(E(),p.value=!0,j(e),e.currentTarget instanceof HTMLElement&&e.currentTarget.setPointerCapture(e.pointerId))},F=e=>{A()&&(D(),m.value=!0,M(e),e.currentTarget instanceof HTMLElement&&e.currentTarget.setPointerCapture(e.pointerId))},I=()=>{p.value=!1},L=()=>{m.value=!1};return(0,u.useEventListener)(n,`pointermove`,e=>{p.value&&j(e)}),(0,u.useEventListener)(n,`pointerup`,I),(0,u.useEventListener)(n,`pointercancel`,I),(0,u.useEventListener)(n,`lostpointercapture`,I),(0,u.useEventListener)(r,`pointermove`,e=>{m.value&&M(e)}),(0,u.useEventListener)(r,`pointerup`,L),(0,u.useEventListener)(r,`pointercancel`,L),(0,u.useEventListener)(r,`lostpointercapture`,L),{hexColor:_,hueBackground:v,saturationPointerStyle:O,huePointerStyle:k,handleSaturationPointerDown:N,handleHuePointerDown:F,syncFromModelValue:S}},I=e=>{if(!e)return null;let t=e.$el;if(!(t instanceof HTMLElement))return null;let n=t.querySelector(`.s-ui-color-swatch__fill`);return n instanceof HTMLElement?n:null},L={class:`s-ui-color-area__canvas-row`},R=[`aria-label`],z=[`aria-label`,`aria-disabled`],B=(0,c.defineComponent)({__name:`SColorArea`,props:(0,c.mergeModels)({disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1}},{modelValue:{required:!0},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let t=(0,c.useModel)(e,`modelValue`),{t:r}=(0,l.useUiKitI18n)(),i=(0,c.useTemplateRef)(`colorResolutionSwatchRef`),a=(0,c.useTemplateRef)(`saturationAreaRef`),o=(0,c.useTemplateRef)(`hueSliderRef`),s=()=>O(t.value,I(i.value)),u=(0,c.computed)(()=>n.a(t.value)),{hexColor:d,hueBackground:f,saturationPointerStyle:p,huePointerStyle:m,handleSaturationPointerDown:h,handleHuePointerDown:g}=F({modelValue:t,getEditableHex:s,saturationAreaRef:a,hueSliderRef:o,disabled:(0,c.toRef)(()=>e.disabled),readonly:(0,c.toRef)(()=>e.readonly)});return(t,n)=>((0,c.openBlock)(),(0,c.createElementBlock)(`div`,(0,c.mergeProps)({class:[`s-ui-color-area`,{"s-ui-color-area--disabled":e.disabled,"s-ui-color-area--readonly":e.readonly}]},t.$attrs),[(0,c.createVNode)((0,c.unref)(l.SColorSwatch),{ref_key:`colorResolutionSwatchRef`,ref:i,class:`s-ui-color-area__color-resolution`,color:u.value,size:(0,c.unref)(l.ESColorSwatchSize).SIZE_24,tabindex:`-1`,"aria-hidden":`true`},null,8,[`color`,`size`]),(0,c.createElementVNode)(`div`,L,[(0,c.createElementVNode)(`div`,{ref_key:`saturationAreaRef`,ref:a,class:`s-ui-color-area__canvas`,role:`img`,"aria-label":(0,c.unref)(r)(`colorArea.saturationBrightness`),style:(0,c.normalizeStyle)({"--s-ui-color-area-hue":(0,c.unref)(f)}),onPointerdown:n[0]||=(...e)=>(0,c.unref)(h)&&(0,c.unref)(h)(...e)},[(0,c.createElementVNode)(`div`,{class:`s-ui-color-area__canvas-pointer`,style:(0,c.normalizeStyle)({...(0,c.unref)(p),backgroundColor:(0,c.unref)(d)})},null,4)],44,R),(0,c.createElementVNode)(`div`,{ref_key:`hueSliderRef`,ref:o,class:`s-ui-color-area__hue`,role:`slider`,"aria-label":(0,c.unref)(r)(`colorArea.hue`),"aria-valuemin":`0`,"aria-valuemax":`360`,"aria-disabled":e.disabled||e.readonly,onPointerdown:n[1]||=(...e)=>(0,c.unref)(g)&&(0,c.unref)(g)(...e)},[(0,c.createElementVNode)(`div`,{class:`s-ui-color-area__hue-pointer`,style:(0,c.normalizeStyle)({...(0,c.unref)(m),backgroundColor:(0,c.unref)(f)})},null,4)],40,z)])],16))}}),V={class:`s-ui-color-values__left`},H={class:`s-ui-color-values__format`},U={class:`s-ui-color-values__value-group`},W={class:`s-ui-color-values__inputs`},G={key:0,class:`s-ui-color-values__input-wrap`},K=[`disabled`,`readonly`,`aria-label`],q={class:`s-ui-color-values__input-wrap`},J=[`disabled`,`readonly`,`aria-label`],Y={class:`s-ui-color-values__input-wrap`},X=[`disabled`,`readonly`,`aria-label`],Z={class:`s-ui-color-values__input-wrap`},Q=[`disabled`,`readonly`,`aria-label`],$=(0,c.defineComponent)({__name:`SColorValues`,props:(0,c.mergeModels)({disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},formats:{default:()=>T}},{modelValue:{required:!0},modelModifiers:{},format:{default:t.o.HEX},formatModifiers:{}}),emits:(0,c.mergeModels)([`formatDropdownOpen`,`formatDropdownClose`],[`update:modelValue`,`update:format`]),setup(e,{emit:a}){let{t:o}=(0,l.useUiKitI18n)(),u=(0,c.useModel)(e,`modelValue`),d=(0,c.useModel)(e,`format`),f=a,p=(0,c.useTemplateRef)(`previewSwatchRef`),m=(0,c.ref)(``),h=(0,c.ref)(`0`),g=(0,c.ref)(`0`),_=(0,c.ref)(`0`),v=(0,c.computed)(()=>(e.formats.length>0?e.formats:T).map(e=>({value:e,label:E[e]}))),y=(0,c.computed)(()=>n.a(u.value)),b=(0,c.computed)(()=>O(u.value,I(p.value))),x=(0,c.computed)(()=>d.value===t.o.RGB?o(`colorValues.redChannel`):o(`colorValues.hueChannel`)),S=(0,c.computed)(()=>d.value===t.o.RGB?o(`colorValues.greenChannel`):o(`colorValues.saturationChannel`)),C=(0,c.computed)(()=>d.value===t.o.RGB?o(`colorValues.blueChannel`):o(`colorValues.lightnessChannel`)),w=()=>{let e=b.value;if(!e)return;let n=k(e,d.value);if(d.value===t.o.HEX&&typeof n==`string`){m.value=n;return}typeof n==`object`&&(h.value=String(n.first),g.value=String(n.second),_.value=String(n.third))};(0,c.watch)([u,d,b],()=>{w()}),(0,c.onMounted)(()=>{(0,c.nextTick)(()=>{w()})});let D=()=>{if(e.disabled||e.readonly)return;if(d.value===t.o.HEX){let e=j(t.o.HEX,m.value);e&&(u.value=e),w();return}let n=j(d.value,{first:Number.parseInt(h.value,10),second:Number.parseInt(g.value,10),third:Number.parseInt(_.value,10)});n&&(u.value=n),w()},A=e=>{e.key===`Enter`&&(e.preventDefault(),D())};return(n,a)=>((0,c.openBlock)(),(0,c.createElementBlock)(`div`,(0,c.mergeProps)({class:[`s-ui-color-values`,{"s-ui-color-values--disabled":e.disabled,"s-ui-color-values--readonly":e.readonly}]},n.$attrs),[(0,c.createElementVNode)(`div`,V,[(0,c.createVNode)((0,c.unref)(l.SColorSwatch),{ref_key:`previewSwatchRef`,ref:p,class:`s-ui-color-values__preview`,color:y.value,size:(0,c.unref)(l.ESColorSwatchSize).SIZE_32,disabled:e.disabled,tabindex:`-1`,"aria-hidden":`true`},null,8,[`color`,`size`,`disabled`]),(0,c.createElementVNode)(`div`,H,[(0,c.createVNode)((0,c.unref)(s.t),{modelValue:d.value,"onUpdate:modelValue":a[0]||=e=>d.value=e,class:`s-ui-color-values__format-select`,options:v.value,disabled:e.disabled,readonly:e.readonly,bordered:!0,clearable:!1,"close-on-select":!0,"fit-viewport":!1,"aria-label":(0,c.unref)(o)(`colorValues.format`),onOpen:a[1]||=e=>f(`formatDropdownOpen`),onClose:a[2]||=e=>f(`formatDropdownClose`)},null,8,[`modelValue`,`options`,`disabled`,`readonly`,`aria-label`])])]),(0,c.createElementVNode)(`div`,U,[(0,c.createVNode)((0,c.unref)(i.t),{class:`s-ui-color-values__pipette`,appearance:(0,c.unref)(r.t).BARE,variant:(0,c.unref)(r.r).NEUTRAL,size:(0,c.unref)(r.n).SMALL,icon:`pipette`,"aria-label":(0,c.unref)(o)(`colorValues.pickColor`),"aria-disabled":`true`,disabled:e.disabled,tabindex:`-1`},null,8,[`appearance`,`variant`,`size`,`aria-label`,`disabled`]),a[9]||=(0,c.createElementVNode)(`span`,{class:`s-ui-color-values__separator`,"aria-hidden":`true`},null,-1),(0,c.createElementVNode)(`div`,W,[d.value===(0,c.unref)(t.o).HEX?((0,c.openBlock)(),(0,c.createElementBlock)(`div`,G,[(0,c.withDirectives)((0,c.createElementVNode)(`input`,{"onUpdate:modelValue":a[3]||=e=>m.value=e,class:`s-ui-color-values__input s-ui-typography-body-14-regular`,type:`text`,inputmode:`text`,spellcheck:`false`,disabled:e.disabled,readonly:e.readonly,"aria-label":(0,c.unref)(o)(`colorValues.hexValue`),onBlur:D,onKeydown:A},null,40,K),[[c.vModelText,m.value]])])):((0,c.openBlock)(),(0,c.createElementBlock)(c.Fragment,{key:1},[(0,c.createElementVNode)(`div`,q,[(0,c.withDirectives)((0,c.createElementVNode)(`input`,{"onUpdate:modelValue":a[4]||=e=>h.value=e,class:`s-ui-color-values__input s-ui-typography-body-14-regular`,type:`text`,inputmode:`numeric`,spellcheck:`false`,disabled:e.disabled,readonly:e.readonly,"aria-label":x.value,onBlur:D,onKeydown:A},null,40,J),[[c.vModelText,h.value]])]),a[7]||=(0,c.createElementVNode)(`span`,{class:`s-ui-color-values__separator`,"aria-hidden":`true`},null,-1),(0,c.createElementVNode)(`div`,Y,[(0,c.withDirectives)((0,c.createElementVNode)(`input`,{"onUpdate:modelValue":a[5]||=e=>g.value=e,class:`s-ui-color-values__input s-ui-typography-body-14-regular`,type:`text`,inputmode:`numeric`,spellcheck:`false`,disabled:e.disabled,readonly:e.readonly,"aria-label":S.value,onBlur:D,onKeydown:A},null,40,X),[[c.vModelText,g.value]])]),a[8]||=(0,c.createElementVNode)(`span`,{class:`s-ui-color-values__separator`,"aria-hidden":`true`},null,-1),(0,c.createElementVNode)(`div`,Z,[(0,c.withDirectives)((0,c.createElementVNode)(`input`,{"onUpdate:modelValue":a[6]||=e=>_.value=e,class:`s-ui-color-values__input s-ui-typography-body-14-regular`,type:`text`,inputmode:`numeric`,spellcheck:`false`,disabled:e.disabled,readonly:e.readonly,"aria-label":C.value,onBlur:D,onKeydown:A},null,40,Q),[[c.vModelText,_.value]])])],64))])])],16))}}),ee={class:`s-ui-color-picker__section`},te={class:`s-ui-color-picker__label`},ne={class:`s-ui-color-picker__section`},re={class:`s-ui-color-picker__label`},ie={class:`s-ui-color-picker__custom-editor`},ae={class:`s-ui-color-picker__custom-actions`},oe=(0,c.defineComponent)({__name:`SColorPicker`,props:(0,c.mergeModels)({disabled:{type:Boolean,default:!1},recommendedColors:{},recentColors:{default:()=>[]}},{modelValue:{},modelModifiers:{}}),emits:(0,c.mergeModels)([`select`,`customEditorOpen`,`customEditorClose`,`formatDropdownOpen`,`formatDropdownClose`],[`update:modelValue`]),setup(e,{emit:n}){let u=(0,c.useModel)(e,`modelValue`),d=n,{t:f}=(0,l.useUiKitI18n)(),p=(0,c.ref)(!1),m=(0,c.ref)(`#526DE3`),h=(0,c.ref)(t.o.HEX),g=(0,c.computed)(()=>e.recommendedColors&&e.recommendedColors.length>0?e.recommendedColors:t.r),_=(0,c.computed)(()=>e.recentColors.length<=17?e.recentColors:e.recentColors.slice(0,17)),v=()=>{if(u.value){m.value=u.value;return}m.value=`#526DE3`},y=e=>{d(`select`,e)},b=()=>{u.value=m.value,d(`select`,m.value),p.value=!1},x=()=>{p.value=!1};return(0,c.watch)(p,(e,t)=>{if(e&&!t){v(),d(`customEditorOpen`);return}!e&&t&&d(`customEditorClose`)}),(n,v)=>((0,c.openBlock)(),(0,c.createBlock)((0,c.unref)(s.r),(0,c.mergeProps)({width:336},n.$attrs),{default:(0,c.withCtx)(()=>[(0,c.createElementVNode)(`div`,{class:(0,c.normalizeClass)([`s-ui-color-picker`,{"s-ui-color-picker--disabled":e.disabled}])},[(0,c.createElementVNode)(`section`,ee,[(0,c.createElementVNode)(`span`,te,(0,c.toDisplayString)((0,c.unref)(f)(`colorPicker.recommendedColors`)),1),(0,c.createVNode)((0,c.unref)(t.t),{modelValue:u.value,"onUpdate:modelValue":v[0]||=e=>u.value=e,class:`s-ui-color-picker__palette`,layout:(0,c.unref)(t.n).GRID,colors:g.value,size:(0,c.unref)(l.ESColorSwatchSize).SIZE_32,disabled:e.disabled,onSelect:y},null,8,[`modelValue`,`layout`,`colors`,`size`,`disabled`])]),(0,c.createElementVNode)(`section`,ne,[(0,c.createElementVNode)(`span`,re,(0,c.toDisplayString)((0,c.unref)(f)(`colorPicker.recentColors`)),1),(0,c.createVNode)((0,c.unref)(t.t),{modelValue:u.value,"onUpdate:modelValue":v[7]||=e=>u.value=e,class:`s-ui-color-picker__palette`,layout:(0,c.unref)(t.n).ROW,colors:_.value,size:(0,c.unref)(l.ESColorSwatchSize).SIZE_32,disabled:e.disabled,onSelect:y},{append:(0,c.withCtx)(()=>[(0,c.createVNode)((0,c.unref)(o.t),{modelValue:p.value,"onUpdate:modelValue":v[6]||=e=>p.value=e,placement:(0,c.unref)(a.i).RIGHT_START,offset:8,shift:!0,flip:!0,disabled:e.disabled,"dismiss-on-click-outside":!0,"dismiss-on-escape":!0},{trigger:(0,c.withCtx)(({toggle:t,triggerProps:n})=>[(0,c.createVNode)((0,c.unref)(i.t),(0,c.mergeProps)(n,{class:`s-ui-color-picker__add-button`,appearance:(0,c.unref)(r.t).OUTLINED,variant:(0,c.unref)(r.r).NEUTRAL,size:(0,c.unref)(r.n).SMALL,icon:`plus`,"aria-label":(0,c.unref)(f)(`colorPicker.addCustomColor`),disabled:e.disabled,onClick:t}),null,16,[`appearance`,`variant`,`size`,`aria-label`,`disabled`,`onClick`])]),content:(0,c.withCtx)(()=>[(0,c.createVNode)((0,c.unref)(s.r),{width:320},{footer:(0,c.withCtx)(()=>[(0,c.createElementVNode)(`div`,ae,[(0,c.createVNode)((0,c.unref)(i.t),{class:`s-ui-color-picker__save-button`,appearance:(0,c.unref)(r.t).MAJOR,variant:(0,c.unref)(r.r).MAIN,size:(0,c.unref)(r.n).SMALL,disabled:e.disabled,onClick:b},{default:(0,c.withCtx)(()=>[(0,c.createTextVNode)((0,c.toDisplayString)((0,c.unref)(f)(`colorPicker.save`)),1)]),_:1},8,[`appearance`,`variant`,`size`,`disabled`]),(0,c.createVNode)((0,c.unref)(i.t),{class:`s-ui-color-picker__cancel-button`,appearance:(0,c.unref)(r.t).MINOR,variant:(0,c.unref)(r.r).NEUTRAL,size:(0,c.unref)(r.n).SMALL,disabled:e.disabled,onClick:x},{default:(0,c.withCtx)(()=>[(0,c.createTextVNode)((0,c.toDisplayString)((0,c.unref)(f)(`colorPicker.cancel`)),1)]),_:1},8,[`appearance`,`variant`,`size`,`disabled`])])]),default:(0,c.withCtx)(()=>[(0,c.createElementVNode)(`div`,ie,[(0,c.createVNode)(B,{modelValue:m.value,"onUpdate:modelValue":v[1]||=e=>m.value=e,disabled:e.disabled},null,8,[`modelValue`,`disabled`]),(0,c.createVNode)($,{modelValue:m.value,"onUpdate:modelValue":v[2]||=e=>m.value=e,format:h.value,"onUpdate:format":v[3]||=e=>h.value=e,disabled:e.disabled,onFormatDropdownOpen:v[4]||=e=>d(`formatDropdownOpen`),onFormatDropdownClose:v[5]||=e=>d(`formatDropdownClose`)},null,8,[`modelValue`,`format`,`disabled`])])]),_:1})]),_:1},8,[`modelValue`,`placement`,`disabled`])]),_:1},8,[`modelValue`,`layout`,`colors`,`size`,`disabled`])])],2)]),_:1},16))}});Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return M}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return $}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return B}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return oe}});
|
|
1
|
+
const e=require("./contrastSurfaceTextColor-BRjRzXyZ.cjs"),t=require("./SColorPalette-CqfVzhda.cjs"),n=require("./colorValue-Dda7fKd3.cjs"),r=require("./SButton.types-UKroD-ev.cjs"),i=require("./SButton-C-z_q5CG.cjs"),a=require("./useFloatingOverlay-B1UCUYQQ.cjs"),o=require("./SDropdown-_QUOP-rw.cjs"),s=require("./SSelect-DcTEwHx6.cjs");let c=require("vue"),l=require("@shtabapp/ui-kit-primitives"),u=require("@vueuse/core");var d=e=>Math.max(0,Math.min(255,Math.round(e))),f=e=>{let t=e%360;return t<0?t+360:t},p=e=>Math.max(0,Math.min(100,Math.round(e))),m=e=>{let t=e.slice(1);if(t.length===3){let e=t[0],n=t[1],r=t[2];return!e||!n||!r?void 0:`${e}${e}${n}${n}${r}${r}`}if(t.length===6||t.length===8)return t.slice(0,6)},h=e=>{let t=m(e);if(!t)return;let n=Number.parseInt(t.slice(0,2),16),r=Number.parseInt(t.slice(2,4),16),i=Number.parseInt(t.slice(4,6),16);if(!(Number.isNaN(n)||Number.isNaN(r)||Number.isNaN(i)))return{first:n,second:r,third:i}},g=e=>{let t=d(e.first),n=d(e.second),r=d(e.third);return`#${t.toString(16).padStart(2,`0`).toUpperCase()}${n.toString(16).padStart(2,`0`).toUpperCase()}${r.toString(16).padStart(2,`0`).toUpperCase()}`},_=e=>{let t=h(e);if(!t)return;let n=t.first/255,r=t.second/255,i=t.third/255,a=Math.max(n,r,i),o=Math.min(n,r,i),s=a-o,c=0,l=(a+o)/2;s!==0&&(c=a===n?((r-i)/s+(r<i?6:0))*60:a===r?((i-n)/s+2)*60:((n-r)/s+4)*60);let u=0;return s!==0&&(u=l>.5?s/(2-a-o):s/(a+o)),{first:Math.round(c),second:Math.round(u*100),third:Math.round(l*100)}},v=e=>{let t=f(e.first),n=p(e.second)/100,r=p(e.third)/100,i=e=>{let i=(t+e)/30;return d((r-n*Math.min(r,1-r)*Math.max(-1,Math.min(i%2-1,1)))*255)};return g({first:i(0),second:i(8),third:i(4)})},y=t=>{let n=t.toUpperCase(),r=n.startsWith(`#`)?n.slice(1):n;if(!/^[0-9A-F]{3}$/.test(r)&&!/^[0-9A-F]{6}$/.test(r))return;let i=`#${r}`;if(e.n(i))return g(h(i)??{first:0,second:0,third:0})},b=e=>e.slice(1).toUpperCase(),x=e=>{let t=e.first/255,n=e.second/255,r=e.third/255,i=Math.max(t,n,r),a=i-Math.min(t,n,r),o=0;a!==0&&(o=i===t?(n-r)/a%6:i===n?(r-t)/a+2:(t-n)/a+4,o=Math.round(o*60),o<0&&(o+=360));let s=i===0?0:a/i;return{hue:o,saturation:s,value:i}},S=e=>{let t=e.value*e.saturation,n=e.hue/60,r=t*(1-Math.abs(n%2-1)),i=e.value-t,a=0,o=0,s=0;return n>=0&&n<1?(a=t,o=r):n>=1&&n<2?(a=r,o=t):n>=2&&n<3?(o=t,s=r):n>=3&&n<4?(o=r,s=t):n>=4&&n<5?(a=r,s=t):(a=t,s=r),{first:d((a+i)*255),second:d((o+i)*255),third:d((s+i)*255)}},C=e=>{let t=h(e);if(t)return x(t)},w=e=>g(S(e)),T=[t.o.HEX,t.o.RGB,t.o.HSL],E={[t.o.HEX]:`Hex`,[t.o.RGB]:`RGB`,[t.o.HSL]:`HSL`},D=e=>{let t=getComputedStyle(e).backgroundColor.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)/);if(!t)return;let n=Number.parseInt(t[1]??`0`,10),r=Number.parseInt(t[2]??`0`,10),i=Number.parseInt(t[3]??`0`,10);return`#${n.toString(16).padStart(2,`0`).toUpperCase()}${r.toString(16).padStart(2,`0`).toUpperCase()}${i.toString(16).padStart(2,`0`).toUpperCase()}`},O=(t,r)=>{if(n.n(t)&&e.n(t))return t;if(r)return D(r)},k=(e,n)=>n===t.o.HEX?b(e):n===t.o.RGB?h(e)??{first:0,second:0,third:0}:_(e)??{first:0,second:0,third:0},A=e=>{let t=Number.parseInt(e,10);if(!Number.isNaN(t))return t},j=(e,n)=>{if(e===t.o.HEX)return typeof n==`string`?y(n):void 0;if(typeof n==`string`)return;if(e===t.o.RGB){let e=g({first:A(String(n.first))??0,second:A(String(n.second))??0,third:A(String(n.third))??0});return h(e)?e:void 0}let r=v({first:A(String(n.first))??0,second:A(String(n.second))??0,third:A(String(n.third))??0});if(r&&_(r))return r},M=17,N=`#000000`,P=e=>e??N,F=({modelValue:e,getEditableHex:t,saturationAreaRef:n,hueSliderRef:r,disabled:i,readonly:a})=>{let o=C(P(t()))??{hue:0,saturation:0,value:0},s=(0,c.ref)(o.hue),l=(0,c.ref)(o.saturation),d=(0,c.ref)(o.value),f=(0,c.ref)(!1),p=(0,c.ref)(!1),m=(0,c.ref)(!1),h=(0,c.shallowRef)(null),g=(0,c.shallowRef)(null),_=(0,c.computed)(()=>w({hue:s.value,saturation:l.value,value:d.value})),v=(0,c.computed)(()=>w({hue:s.value,saturation:1,value:1})),y=e=>{s.value=Math.max(0,Math.min(360,e))},b=(e,t)=>{l.value=Math.max(0,Math.min(1,e)),d.value=Math.max(0,Math.min(1,t))},x=e=>{let t=C(P(e));t&&(f.value=!0,t.saturation>0&&(s.value=t.hue),l.value=t.saturation,d.value=t.value,f.value=!1)},S=()=>{let e=t();e&&e.toUpperCase()!==_.value.toUpperCase()&&x(e)},T=()=>{let n=_.value;t()?.toUpperCase()!==n.toUpperCase()&&(f.value=!0,e.value=n,f.value=!1)};(0,c.watch)([s,l,d],()=>{f.value||T()}),(0,c.watch)(e,()=>{f.value||S()}),(0,c.onMounted)(()=>{(0,c.nextTick)(()=>{E(),D(),S()})});let E=()=>{h.value=n.value?.getBoundingClientRect()??null},D=()=>{g.value=r.value?.getBoundingClientRect()??null},O=(0,c.computed)(()=>{let e=h.value;return e?{transform:`translate3d(calc(${l.value*e.width}px - 50%), calc(${(1-d.value)*e.height}px - 50%), 0)`}:{}}),k=(0,c.computed)(()=>{let e=g.value;return e?{transform:`translate3d(-50%, calc(${s.value/360*e.height}px - 50%), 0)`}:{}}),A=()=>!i.value&&!a.value,j=e=>{let t=h.value;if(!t)return;let n=Math.max(0,Math.min(e.clientX-t.left,t.width)),r=Math.max(0,Math.min(e.clientY-t.top,t.height));b(n/t.width,1-r/t.height)},M=e=>{let t=g.value;t&&y(Math.max(0,Math.min(e.clientY-t.top,t.height))/t.height*360)},N=e=>{A()&&(E(),p.value=!0,j(e),e.currentTarget instanceof HTMLElement&&e.currentTarget.setPointerCapture(e.pointerId))},F=e=>{A()&&(D(),m.value=!0,M(e),e.currentTarget instanceof HTMLElement&&e.currentTarget.setPointerCapture(e.pointerId))},I=()=>{p.value=!1},L=()=>{m.value=!1};return(0,u.useEventListener)(n,`pointermove`,e=>{p.value&&j(e)}),(0,u.useEventListener)(n,`pointerup`,I),(0,u.useEventListener)(n,`pointercancel`,I),(0,u.useEventListener)(n,`lostpointercapture`,I),(0,u.useEventListener)(r,`pointermove`,e=>{m.value&&M(e)}),(0,u.useEventListener)(r,`pointerup`,L),(0,u.useEventListener)(r,`pointercancel`,L),(0,u.useEventListener)(r,`lostpointercapture`,L),{hexColor:_,hueBackground:v,saturationPointerStyle:O,huePointerStyle:k,handleSaturationPointerDown:N,handleHuePointerDown:F,syncFromModelValue:S}},I=e=>{if(!e)return null;let t=e.$el;if(!(t instanceof HTMLElement))return null;let n=t.querySelector(`.s-ui-color-swatch__fill`);return n instanceof HTMLElement?n:null},L={class:`s-ui-color-area__canvas-row`},R=[`aria-label`],z=[`aria-label`,`aria-disabled`],B=(0,c.defineComponent)({__name:`SColorArea`,props:(0,c.mergeModels)({disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1}},{modelValue:{required:!0},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let t=(0,c.useModel)(e,`modelValue`),{t:r}=(0,l.useUiKitI18n)(),i=(0,c.useTemplateRef)(`colorResolutionSwatchRef`),a=(0,c.useTemplateRef)(`saturationAreaRef`),o=(0,c.useTemplateRef)(`hueSliderRef`),s=()=>O(t.value,I(i.value)),u=(0,c.computed)(()=>n.a(t.value)),{hexColor:d,hueBackground:f,saturationPointerStyle:p,huePointerStyle:m,handleSaturationPointerDown:h,handleHuePointerDown:g}=F({modelValue:t,getEditableHex:s,saturationAreaRef:a,hueSliderRef:o,disabled:(0,c.toRef)(()=>e.disabled),readonly:(0,c.toRef)(()=>e.readonly)});return(t,n)=>((0,c.openBlock)(),(0,c.createElementBlock)(`div`,(0,c.mergeProps)({class:[`s-ui-color-area`,{"s-ui-color-area--disabled":e.disabled,"s-ui-color-area--readonly":e.readonly}]},t.$attrs),[(0,c.createVNode)((0,c.unref)(l.SColorSwatch),{ref_key:`colorResolutionSwatchRef`,ref:i,class:`s-ui-color-area__color-resolution`,color:u.value,size:(0,c.unref)(l.ESColorSwatchSize).SIZE_24,tabindex:`-1`,"aria-hidden":`true`},null,8,[`color`,`size`]),(0,c.createElementVNode)(`div`,L,[(0,c.createElementVNode)(`div`,{ref_key:`saturationAreaRef`,ref:a,class:`s-ui-color-area__canvas`,role:`img`,"aria-label":(0,c.unref)(r)(`colorArea.saturationBrightness`),style:(0,c.normalizeStyle)({"--s-ui-color-area-hue":(0,c.unref)(f)}),onPointerdown:n[0]||=(...e)=>(0,c.unref)(h)&&(0,c.unref)(h)(...e)},[(0,c.createElementVNode)(`div`,{class:`s-ui-color-area__canvas-pointer`,style:(0,c.normalizeStyle)({...(0,c.unref)(p),backgroundColor:(0,c.unref)(d)})},null,4)],44,R),(0,c.createElementVNode)(`div`,{ref_key:`hueSliderRef`,ref:o,class:`s-ui-color-area__hue`,role:`slider`,"aria-label":(0,c.unref)(r)(`colorArea.hue`),"aria-valuemin":`0`,"aria-valuemax":`360`,"aria-disabled":e.disabled||e.readonly,onPointerdown:n[1]||=(...e)=>(0,c.unref)(g)&&(0,c.unref)(g)(...e)},[(0,c.createElementVNode)(`div`,{class:`s-ui-color-area__hue-pointer`,style:(0,c.normalizeStyle)({...(0,c.unref)(m),backgroundColor:(0,c.unref)(f)})},null,4)],40,z)])],16))}}),V={class:`s-ui-color-values__left`},H={class:`s-ui-color-values__format`},U={class:`s-ui-color-values__value-group`},W={class:`s-ui-color-values__inputs`},G={key:0,class:`s-ui-color-values__input-wrap`},K=[`disabled`,`readonly`,`aria-label`],q={class:`s-ui-color-values__input-wrap`},J=[`disabled`,`readonly`,`aria-label`],Y={class:`s-ui-color-values__input-wrap`},X=[`disabled`,`readonly`,`aria-label`],Z={class:`s-ui-color-values__input-wrap`},Q=[`disabled`,`readonly`,`aria-label`],$=(0,c.defineComponent)({__name:`SColorValues`,props:(0,c.mergeModels)({disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},formats:{default:()=>T}},{modelValue:{required:!0},modelModifiers:{},format:{default:t.o.HEX},formatModifiers:{}}),emits:(0,c.mergeModels)([`formatDropdownOpen`,`formatDropdownClose`],[`update:modelValue`,`update:format`]),setup(e,{emit:a}){let{t:o}=(0,l.useUiKitI18n)(),u=(0,c.useModel)(e,`modelValue`),d=(0,c.useModel)(e,`format`),f=a,p=(0,c.useTemplateRef)(`previewSwatchRef`),m=(0,c.ref)(``),h=(0,c.ref)(`0`),g=(0,c.ref)(`0`),_=(0,c.ref)(`0`),v=(0,c.computed)(()=>(e.formats.length>0?e.formats:T).map(e=>({value:e,label:E[e]}))),y=(0,c.computed)(()=>n.a(u.value)),b=(0,c.computed)(()=>O(u.value,I(p.value))),x=(0,c.computed)(()=>d.value===t.o.RGB?o(`colorValues.redChannel`):o(`colorValues.hueChannel`)),S=(0,c.computed)(()=>d.value===t.o.RGB?o(`colorValues.greenChannel`):o(`colorValues.saturationChannel`)),C=(0,c.computed)(()=>d.value===t.o.RGB?o(`colorValues.blueChannel`):o(`colorValues.lightnessChannel`)),w=()=>{let e=b.value;if(!e)return;let n=k(e,d.value);if(d.value===t.o.HEX&&typeof n==`string`){m.value=n;return}typeof n==`object`&&(h.value=String(n.first),g.value=String(n.second),_.value=String(n.third))};(0,c.watch)([u,d,b],()=>{w()}),(0,c.onMounted)(()=>{(0,c.nextTick)(()=>{w()})});let D=()=>{if(e.disabled||e.readonly)return;if(d.value===t.o.HEX){let e=j(t.o.HEX,m.value);e&&(u.value=e),w();return}let n=j(d.value,{first:Number.parseInt(h.value,10),second:Number.parseInt(g.value,10),third:Number.parseInt(_.value,10)});n&&(u.value=n),w()},A=e=>{e.key===`Enter`&&(e.preventDefault(),D())};return(n,a)=>((0,c.openBlock)(),(0,c.createElementBlock)(`div`,(0,c.mergeProps)({class:[`s-ui-color-values`,{"s-ui-color-values--disabled":e.disabled,"s-ui-color-values--readonly":e.readonly}]},n.$attrs),[(0,c.createElementVNode)(`div`,V,[(0,c.createVNode)((0,c.unref)(l.SColorSwatch),{ref_key:`previewSwatchRef`,ref:p,class:`s-ui-color-values__preview`,color:y.value,size:(0,c.unref)(l.ESColorSwatchSize).SIZE_32,disabled:e.disabled,tabindex:`-1`,"aria-hidden":`true`},null,8,[`color`,`size`,`disabled`]),(0,c.createElementVNode)(`div`,H,[(0,c.createVNode)((0,c.unref)(s.t),{modelValue:d.value,"onUpdate:modelValue":a[0]||=e=>d.value=e,class:`s-ui-color-values__format-select`,options:v.value,disabled:e.disabled,readonly:e.readonly,bordered:!0,clearable:!1,"close-on-select":!0,"fit-viewport":!1,"aria-label":(0,c.unref)(o)(`colorValues.format`),onOpen:a[1]||=e=>f(`formatDropdownOpen`),onClose:a[2]||=e=>f(`formatDropdownClose`)},null,8,[`modelValue`,`options`,`disabled`,`readonly`,`aria-label`])])]),(0,c.createElementVNode)(`div`,U,[(0,c.createVNode)((0,c.unref)(i.t),{class:`s-ui-color-values__pipette`,appearance:(0,c.unref)(r.t).BARE,variant:(0,c.unref)(r.r).NEUTRAL,size:(0,c.unref)(r.n).SMALL,icon:`pipette`,"aria-label":(0,c.unref)(o)(`colorValues.pickColor`),"aria-disabled":`true`,disabled:e.disabled,tabindex:`-1`},null,8,[`appearance`,`variant`,`size`,`aria-label`,`disabled`]),a[9]||=(0,c.createElementVNode)(`span`,{class:`s-ui-color-values__separator`,"aria-hidden":`true`},null,-1),(0,c.createElementVNode)(`div`,W,[d.value===(0,c.unref)(t.o).HEX?((0,c.openBlock)(),(0,c.createElementBlock)(`div`,G,[(0,c.withDirectives)((0,c.createElementVNode)(`input`,{"onUpdate:modelValue":a[3]||=e=>m.value=e,class:`s-ui-color-values__input s-ui-typography-body-14-regular`,type:`text`,inputmode:`text`,spellcheck:`false`,disabled:e.disabled,readonly:e.readonly,"aria-label":(0,c.unref)(o)(`colorValues.hexValue`),onBlur:D,onKeydown:A},null,40,K),[[c.vModelText,m.value]])])):((0,c.openBlock)(),(0,c.createElementBlock)(c.Fragment,{key:1},[(0,c.createElementVNode)(`div`,q,[(0,c.withDirectives)((0,c.createElementVNode)(`input`,{"onUpdate:modelValue":a[4]||=e=>h.value=e,class:`s-ui-color-values__input s-ui-typography-body-14-regular`,type:`text`,inputmode:`numeric`,spellcheck:`false`,disabled:e.disabled,readonly:e.readonly,"aria-label":x.value,onBlur:D,onKeydown:A},null,40,J),[[c.vModelText,h.value]])]),a[7]||=(0,c.createElementVNode)(`span`,{class:`s-ui-color-values__separator`,"aria-hidden":`true`},null,-1),(0,c.createElementVNode)(`div`,Y,[(0,c.withDirectives)((0,c.createElementVNode)(`input`,{"onUpdate:modelValue":a[5]||=e=>g.value=e,class:`s-ui-color-values__input s-ui-typography-body-14-regular`,type:`text`,inputmode:`numeric`,spellcheck:`false`,disabled:e.disabled,readonly:e.readonly,"aria-label":S.value,onBlur:D,onKeydown:A},null,40,X),[[c.vModelText,g.value]])]),a[8]||=(0,c.createElementVNode)(`span`,{class:`s-ui-color-values__separator`,"aria-hidden":`true`},null,-1),(0,c.createElementVNode)(`div`,Z,[(0,c.withDirectives)((0,c.createElementVNode)(`input`,{"onUpdate:modelValue":a[6]||=e=>_.value=e,class:`s-ui-color-values__input s-ui-typography-body-14-regular`,type:`text`,inputmode:`numeric`,spellcheck:`false`,disabled:e.disabled,readonly:e.readonly,"aria-label":C.value,onBlur:D,onKeydown:A},null,40,Q),[[c.vModelText,_.value]])])],64))])])],16))}}),ee={class:`s-ui-color-picker__section`},te={class:`s-ui-color-picker__label`},ne={class:`s-ui-color-picker__section`},re={class:`s-ui-color-picker__label`},ie={class:`s-ui-color-picker__custom-editor`},ae={class:`s-ui-color-picker__custom-actions`},oe=(0,c.defineComponent)({__name:`SColorPicker`,props:(0,c.mergeModels)({disabled:{type:Boolean,default:!1},recommendedColors:{},recentColors:{default:()=>[]}},{modelValue:{},modelModifiers:{}}),emits:(0,c.mergeModels)([`select`,`customEditorOpen`,`customEditorClose`,`formatDropdownOpen`,`formatDropdownClose`],[`update:modelValue`]),setup(e,{emit:n}){let u=(0,c.useModel)(e,`modelValue`),d=n,{t:f}=(0,l.useUiKitI18n)(),p=(0,c.ref)(!1),m=(0,c.ref)(`#526DE3`),h=(0,c.ref)(t.o.HEX),g=(0,c.computed)(()=>e.recommendedColors&&e.recommendedColors.length>0?e.recommendedColors:t.r),_=(0,c.computed)(()=>e.recentColors.length<=17?e.recentColors:e.recentColors.slice(0,17)),v=()=>{if(u.value){m.value=u.value;return}m.value=`#526DE3`},y=e=>{d(`select`,e)},b=()=>{u.value=m.value,d(`select`,m.value),p.value=!1},x=()=>{p.value=!1};return(0,c.watch)(p,(e,t)=>{if(e&&!t){v(),d(`customEditorOpen`);return}!e&&t&&d(`customEditorClose`)}),(n,v)=>((0,c.openBlock)(),(0,c.createBlock)((0,c.unref)(s.r),(0,c.mergeProps)({width:336},n.$attrs),{default:(0,c.withCtx)(()=>[(0,c.createElementVNode)(`div`,{class:(0,c.normalizeClass)([`s-ui-color-picker`,{"s-ui-color-picker--disabled":e.disabled}])},[(0,c.createElementVNode)(`section`,ee,[(0,c.createElementVNode)(`span`,te,(0,c.toDisplayString)((0,c.unref)(f)(`colorPicker.recommendedColors`)),1),(0,c.createVNode)((0,c.unref)(t.t),{modelValue:u.value,"onUpdate:modelValue":v[0]||=e=>u.value=e,class:`s-ui-color-picker__palette`,layout:(0,c.unref)(t.n).GRID,colors:g.value,size:(0,c.unref)(l.ESColorSwatchSize).SIZE_32,disabled:e.disabled,onSelect:y},null,8,[`modelValue`,`layout`,`colors`,`size`,`disabled`])]),(0,c.createElementVNode)(`section`,ne,[(0,c.createElementVNode)(`span`,re,(0,c.toDisplayString)((0,c.unref)(f)(`colorPicker.recentColors`)),1),(0,c.createVNode)((0,c.unref)(t.t),{modelValue:u.value,"onUpdate:modelValue":v[7]||=e=>u.value=e,class:`s-ui-color-picker__palette`,layout:(0,c.unref)(t.n).ROW,colors:_.value,size:(0,c.unref)(l.ESColorSwatchSize).SIZE_32,disabled:e.disabled,onSelect:y},{append:(0,c.withCtx)(()=>[(0,c.createVNode)((0,c.unref)(o.t),{modelValue:p.value,"onUpdate:modelValue":v[6]||=e=>p.value=e,placement:(0,c.unref)(a.i).RIGHT_START,offset:8,shift:!0,flip:!0,disabled:e.disabled,"dismiss-on-click-outside":!0,"dismiss-on-escape":!0},{trigger:(0,c.withCtx)(({toggle:t,triggerProps:n})=>[(0,c.createVNode)((0,c.unref)(i.t),(0,c.mergeProps)(n,{class:`s-ui-color-picker__add-button`,appearance:(0,c.unref)(r.t).OUTLINED,variant:(0,c.unref)(r.r).NEUTRAL,size:(0,c.unref)(r.n).SMALL,icon:`plus`,"aria-label":(0,c.unref)(f)(`colorPicker.addCustomColor`),disabled:e.disabled,onClick:t}),null,16,[`appearance`,`variant`,`size`,`aria-label`,`disabled`,`onClick`])]),content:(0,c.withCtx)(()=>[(0,c.createVNode)((0,c.unref)(s.r),{width:320},{footer:(0,c.withCtx)(()=>[(0,c.createElementVNode)(`div`,ae,[(0,c.createVNode)((0,c.unref)(i.t),{class:`s-ui-color-picker__save-button`,appearance:(0,c.unref)(r.t).MAJOR,variant:(0,c.unref)(r.r).MAIN,size:(0,c.unref)(r.n).SMALL,disabled:e.disabled,onClick:b},{default:(0,c.withCtx)(()=>[(0,c.createTextVNode)((0,c.toDisplayString)((0,c.unref)(f)(`colorPicker.save`)),1)]),_:1},8,[`appearance`,`variant`,`size`,`disabled`]),(0,c.createVNode)((0,c.unref)(i.t),{class:`s-ui-color-picker__cancel-button`,appearance:(0,c.unref)(r.t).MINOR,variant:(0,c.unref)(r.r).NEUTRAL,size:(0,c.unref)(r.n).SMALL,disabled:e.disabled,onClick:x},{default:(0,c.withCtx)(()=>[(0,c.createTextVNode)((0,c.toDisplayString)((0,c.unref)(f)(`colorPicker.cancel`)),1)]),_:1},8,[`appearance`,`variant`,`size`,`disabled`])])]),default:(0,c.withCtx)(()=>[(0,c.createElementVNode)(`div`,ie,[(0,c.createVNode)(B,{modelValue:m.value,"onUpdate:modelValue":v[1]||=e=>m.value=e,disabled:e.disabled},null,8,[`modelValue`,`disabled`]),(0,c.createVNode)($,{modelValue:m.value,"onUpdate:modelValue":v[2]||=e=>m.value=e,format:h.value,"onUpdate:format":v[3]||=e=>h.value=e,disabled:e.disabled,onFormatDropdownOpen:v[4]||=e=>d(`formatDropdownOpen`),onFormatDropdownClose:v[5]||=e=>d(`formatDropdownClose`)},null,8,[`modelValue`,`format`,`disabled`])])]),_:1})]),_:1},8,[`modelValue`,`placement`,`disabled`])]),_:1},8,[`modelValue`,`layout`,`colors`,`size`,`disabled`])])],2)]),_:1},16))}});Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return M}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return $}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return B}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return oe}});
|