@opentinyvue/vue-color-select-panel 2.22.0 → 3.22.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/lib/index.js CHANGED
@@ -62,7 +62,7 @@ var ColorSelectPanel = defineComponent({
62
62
  });
63
63
  }
64
64
  });
65
- var version = "2.22.0";
65
+ var version = "3.22.0";
66
66
  ColorSelectPanel.model = {
67
67
  prop: "modelValue",
68
68
  event: "update:modelValue"
package/lib/pc.js CHANGED
@@ -4,6 +4,7 @@ import { renderless as renderless$3, api as api$3 } from '@opentinyvue/vue-rende
4
4
  import { defineComponent, setup, props, directive } from '@opentinyvue/vue-common';
5
5
  import { renderless as renderless$1, api as api$1 } from '@opentinyvue/vue-renderless/color-select-panel/hue-select/vue';
6
6
  import { api, renderless } from '@opentinyvue/vue-renderless/color-select-panel/sv-select/vue';
7
+ import { openBlock, createElementBlock, normalizeStyle, createElementVNode, resolveComponent, createVNode, resolveDirective, withDirectives, withModifiers, createBlock, createCommentVNode, withCtx, Fragment, renderList, createTextVNode, toDisplayString } from 'vue';
7
8
  import { renderless as renderless$2, api as api$2 } from '@opentinyvue/vue-renderless/color-select-panel/alpha-select/vue';
8
9
  import '@opentinyvue/vue-theme/color-select-panel/index.css';
9
10
  import { Clickoutside } from '@opentinyvue/vue-directive';
@@ -12,62 +13,40 @@ import CollapseItem from '@opentinyvue/vue-collapse-item';
12
13
  import Select from '@opentinyvue/vue-select';
13
14
  import Option from '@opentinyvue/vue-option';
14
15
 
15
- function normalizeComponent(scriptExports, render, staticRenderFns, functionalTemplate, injectStyles, scopeId, moduleIdentifier, shadowMode) {
16
- var options = typeof scriptExports === "function" ? scriptExports.options : scriptExports;
17
- if (render) {
18
- options.render = render;
19
- options.staticRenderFns = staticRenderFns;
20
- options._compiled = true;
16
+ function _createForOfIteratorHelperLoose(r, e) {
17
+ var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
18
+ if (t) return (t = t.call(r)).next.bind(t);
19
+ if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) {
20
+ t && (r = t);
21
+ var o = 0;
22
+ return function() {
23
+ return o >= r.length ? { done: true } : { done: false, value: r[o++] };
24
+ };
21
25
  }
22
- var hook;
23
- if (injectStyles) {
24
- hook = injectStyles;
25
- }
26
- if (hook) {
27
- if (options.functional) {
28
- options._injectStyles = hook;
29
- var originalRender = options.render;
30
- options.render = function renderWithStyleInjection(h, context) {
31
- hook.call(context);
32
- return originalRender(h, context);
33
- };
34
- } else {
35
- var existing = options.beforeCreate;
36
- options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
37
- }
26
+ throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
27
+ }
28
+ function _unsupportedIterableToArray(r, a) {
29
+ if (r) {
30
+ if ("string" == typeof r) return _arrayLikeToArray(r, a);
31
+ var t = {}.toString.call(r).slice(8, -1);
32
+ return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0;
38
33
  }
39
- return {
40
- exports: scriptExports,
41
- options
42
- };
43
34
  }
44
-
45
- var render$3 = function render$32() {
46
- var _vm = this;
47
- var _h = _vm.$createElement;
48
- var _c = _vm._self._c || _h;
49
- return _c("div", {
50
- ref: "wrapper",
51
- staticClass: "tiny-color-select-panel__inner__color-select",
52
- style: {
53
- background: _vm.state.bg
54
- }
55
- }, [_c("div", {
56
- staticClass: "white"
57
- }), _c("div", {
58
- staticClass: "black"
59
- }), _c("div", {
60
- ref: "cursor",
61
- staticClass: "cursor",
62
- style: {
63
- top: _vm.state.cursorTop + "px",
64
- left: _vm.state.cursorLeft + "px",
65
- transform: "translate(-50%, -50%)"
66
- }
67
- })]);
35
+ function _arrayLikeToArray(r, a) {
36
+ (null == a || a > r.length) && (a = r.length);
37
+ for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
38
+ return n;
39
+ }
40
+ var _export_sfc = function _export_sfc2(sfc, props) {
41
+ var target = sfc.__vccOpts || sfc;
42
+ for (var _iterator = _createForOfIteratorHelperLoose(props), _step; !(_step = _iterator()).done; ) {
43
+ var _step$value = _step.value, key = _step$value[0], val = _step$value[1];
44
+ target[key] = val;
45
+ }
46
+ return target;
68
47
  };
69
- var staticRenderFns$3 = [];
70
- var __vue2_script$3 = defineComponent({
48
+
49
+ var _sfc_main$3 = defineComponent({
71
50
  emit: ["ready", "svUpdate"],
72
51
  props: {
73
52
  color: {
@@ -84,42 +63,55 @@ var __vue2_script$3 = defineComponent({
84
63
  });
85
64
  }
86
65
  });
87
- var __cssModules$3 = {};
88
- var __component__$3 = /* @__PURE__ */ normalizeComponent(__vue2_script$3, render$3, staticRenderFns$3, false, __vue2_injectStyles$3);
89
- function __vue2_injectStyles$3(context) {
90
- for (var o in __cssModules$3) {
91
- this[o] = __cssModules$3[o];
92
- }
93
- }
94
- var SvSelect = /* @__PURE__ */ function() {
95
- return __component__$3.exports;
96
- }();
97
- var render$2 = function render$22() {
98
- var _vm = this;
99
- var _h = _vm.$createElement;
100
- var _c = _vm._self._c || _h;
101
- return _c("div", {
102
- staticClass: "tiny-color-select-panel__inner"
103
- }, [_c("sv-select", {
104
- attrs: {
105
- "color": _vm.color
66
+ var _hoisted_1$2 = /* @__PURE__ */ createElementVNode(
67
+ "div",
68
+ {
69
+ class: "white"
70
+ },
71
+ null,
72
+ -1
73
+ /* HOISTED */
74
+ );
75
+ var _hoisted_2$2 = /* @__PURE__ */ createElementVNode(
76
+ "div",
77
+ {
78
+ class: "black"
79
+ },
80
+ null,
81
+ -1
82
+ /* HOISTED */
83
+ );
84
+ function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
85
+ return openBlock(), createElementBlock(
86
+ "div",
87
+ {
88
+ class: "tiny-color-select-panel__inner__color-select",
89
+ ref: "wrapper",
90
+ style: normalizeStyle({
91
+ background: _ctx.state.bg
92
+ })
106
93
  },
107
- on: {
108
- "ready": _vm.onSvReady
109
- }
110
- }), _c("div", {
111
- ref: "bar",
112
- staticClass: "tiny-color-select-panel__inner__hue-select"
113
- }, [_c("div", {
114
- ref: "thumb",
115
- style: {
116
- top: _vm.state.thumbTop + "px",
117
- transform: "translateY(-50%)"
118
- }
119
- })])], 1);
120
- };
121
- var staticRenderFns$2 = [];
122
- var __vue2_script$2 = defineComponent({
94
+ [_hoisted_1$2, _hoisted_2$2, createElementVNode(
95
+ "div",
96
+ {
97
+ class: "cursor",
98
+ ref: "cursor",
99
+ style: normalizeStyle({
100
+ top: _ctx.state.cursorTop + "px",
101
+ left: _ctx.state.cursorLeft + "px",
102
+ transform: "translate(-50%, -50%)"
103
+ })
104
+ },
105
+ null,
106
+ 4
107
+ /* STYLE */
108
+ )],
109
+ 4
110
+ /* STYLE */
111
+ );
112
+ }
113
+ var SvSelect = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$3]]);
114
+ var _sfc_main$2 = defineComponent({
123
115
  emits: ["hueUpdate", "svReady", "hueReady"],
124
116
  props: {
125
117
  color: {
@@ -142,44 +134,40 @@ var __vue2_script$2 = defineComponent({
142
134
  });
143
135
  }
144
136
  });
145
- var __cssModules$2 = {};
146
- var __component__$2 = /* @__PURE__ */ normalizeComponent(__vue2_script$2, render$2, staticRenderFns$2, false, __vue2_injectStyles$2);
147
- function __vue2_injectStyles$2(context) {
148
- for (var o in __cssModules$2) {
149
- this[o] = __cssModules$2[o];
150
- }
151
- }
152
- var HueSelect = /* @__PURE__ */ function() {
153
- return __component__$2.exports;
154
- }();
155
- var render$1 = function render$12() {
156
- var _vm = this;
157
- var _h = _vm.$createElement;
158
- var _c = _vm._self._c || _h;
159
- return _c("div", {
160
- ref: "alphaWrapper",
161
- staticClass: "tiny-color-select-panel__alpha",
162
- on: {
163
- "click": _vm.onClick
164
- }
165
- }, [_c("div", {
166
- ref: "slider",
167
- staticClass: "tiny-color-select-panel__alpha__slider",
168
- style: {
169
- background: _vm.state.background
170
- }
171
- }), _c("div", {
172
- ref: "alphaThumb",
173
- staticClass: "tiny-color-select-panel__alpha__thumb",
174
- style: {
175
- top: 0,
176
- left: _vm.state.left + "px",
177
- transform: "translateX(-50%)"
178
- }
179
- })]);
137
+ var _hoisted_1$1 = {
138
+ class: "tiny-color-select-panel__inner"
180
139
  };
181
- var staticRenderFns$1 = [];
182
- var __vue2_script$1 = defineComponent({
140
+ var _hoisted_2$1 = {
141
+ class: "tiny-color-select-panel__inner__hue-select",
142
+ ref: "bar"
143
+ };
144
+ function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
145
+ var _component_sv_select = resolveComponent("sv-select");
146
+ return openBlock(), createElementBlock("div", _hoisted_1$1, [createVNode(_component_sv_select, {
147
+ color: _ctx.color,
148
+ onReady: _ctx.onSvReady
149
+ }, null, 8, ["color", "onReady"]), createElementVNode(
150
+ "div",
151
+ _hoisted_2$1,
152
+ [createElementVNode(
153
+ "div",
154
+ {
155
+ ref: "thumb",
156
+ style: normalizeStyle({
157
+ top: _ctx.state.thumbTop + "px",
158
+ transform: "translateY(-50%)"
159
+ })
160
+ },
161
+ null,
162
+ 4
163
+ /* STYLE */
164
+ )],
165
+ 512
166
+ /* NEED_PATCH */
167
+ )]);
168
+ }
169
+ var HueSelect = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render$2]]);
170
+ var _sfc_main$1 = defineComponent({
183
171
  emits: ["ready"],
184
172
  props: {
185
173
  color: {
@@ -196,140 +184,49 @@ var __vue2_script$1 = defineComponent({
196
184
  });
197
185
  }
198
186
  });
199
- var __cssModules$1 = {};
200
- var __component__$1 = /* @__PURE__ */ normalizeComponent(__vue2_script$1, render$1, staticRenderFns$1, false, __vue2_injectStyles$1);
201
- function __vue2_injectStyles$1(context) {
202
- for (var o in __cssModules$1) {
203
- this[o] = __cssModules$1[o];
204
- }
205
- }
206
- var AlphaSelect = /* @__PURE__ */ function() {
207
- return __component__$1.exports;
208
- }();
209
- var render = function render2() {
210
- var _vm = this;
211
- var _h = _vm.$createElement;
212
- var _c = _vm._self._c || _h;
213
- return _vm.state.showPicker ? _c("div", {
214
- directives: [{
215
- name: "clickoutside",
216
- rawName: "v-clickoutside",
217
- value: _vm.onClickOutside,
218
- expression: "onClickOutside"
219
- }],
220
- staticClass: "tiny-color-select-panel",
221
- on: {
222
- "click": function click($event) {
223
- $event.stopPropagation();
224
- }
225
- }
226
- }, [_c("hue-select", {
227
- attrs: {
228
- "color": _vm.state.color
229
- },
230
- on: {
231
- "hue-ready": _vm.onHueReady,
232
- "sv-ready": _vm.onSvReady
233
- }
234
- }), _vm.alpha ? _c("alpha-select", {
235
- attrs: {
236
- "color": _vm.state.color
237
- },
238
- on: {
239
- "ready": _vm.onAlphaReady
240
- }
241
- }) : _vm._e(), _c("div", {
242
- staticClass: "tiny-color-select-panel__tools"
243
- }, [_vm.state.formats.length ? _c("div", {
244
- staticClass: "tiny-color-select-panel__tools__format-select"
245
- }, [_c("tiny-select", {
246
- model: {
247
- value: _vm.state.currentFormat,
248
- callback: function callback($$v) {
249
- _vm.$set(_vm.state, "currentFormat", $$v);
250
- },
251
- expression: "state.currentFormat"
252
- }
253
- }, _vm._l(_vm.state.formats, function(formatValue) {
254
- return _c("tiny-option", {
255
- key: formatValue,
256
- attrs: {
257
- "value": formatValue,
258
- "label": formatValue
259
- }
260
- });
261
- }), 1)], 1) : _vm._e(), _c("tiny-input", {
262
- attrs: {
263
- "size": "small"
264
- },
265
- model: {
266
- value: _vm.state.input,
267
- callback: function callback($$v) {
268
- _vm.$set(_vm.state, "input", $$v);
269
- },
270
- expression: "state.input"
271
- }
272
- }), _c("div", {
273
- staticClass: "tiny-color-select-panel__tools-btns"
274
- }, [_c("tiny-button", {
275
- attrs: {
276
- "size": "small"
187
+ function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
188
+ return openBlock(), createElementBlock(
189
+ "div",
190
+ {
191
+ class: "tiny-color-select-panel__alpha",
192
+ ref: "alphaWrapper",
193
+ onClick: _cache[0] || (_cache[0] = function() {
194
+ return _ctx.onClick && _ctx.onClick.apply(_ctx, arguments);
195
+ })
277
196
  },
278
- on: {
279
- "click": _vm.onCancel
280
- }
281
- }, [_vm._v(" " + _vm._s(_vm.t("ui.colorSelectPanel.cancel")) + " ")]), _c("tiny-button", {
282
- attrs: {
283
- "type": "primary",
284
- "size": "small"
285
- },
286
- on: {
287
- "click": _vm.onConfirm
288
- }
289
- }, [_vm._v(" " + _vm._s(_vm.t("ui.colorSelectPanel.confirm")) + " ")])], 1)], 1), _c("tiny-collapse", [_vm.state.enableHistory ? _c("tiny-collapse-item", {
290
- attrs: {
291
- "title": _vm.t("ui.colorSelectPanel.history"),
292
- "name": "history"
293
- }
294
- }, [_vm.state.stack.length ? _c("div", {
295
- staticClass: "tiny-color-select-panel__history"
296
- }, _vm._l(_vm.state.stack, function(color, key) {
297
- return _c("div", {
298
- key,
299
- staticClass: "tiny-color-select-panel__history__color-block",
300
- style: {
301
- background: color
197
+ [createElementVNode(
198
+ "div",
199
+ {
200
+ class: "tiny-color-select-panel__alpha__slider",
201
+ style: normalizeStyle({
202
+ background: _ctx.state.background
203
+ }),
204
+ ref: "slider"
302
205
  },
303
- on: {
304
- "click": function click() {
305
- return _vm.onHistoryClick(color);
306
- }
307
- }
308
- });
309
- }), 0) : _vm._e(), !_vm.state.stack.length ? _c("div", [_vm._v(_vm._s(_vm.t("ui.colorSelectPanel.empty")))]) : _vm._e()]) : _vm._e(), _vm.state.enablePredefineColor ? _c("tiny-collapse-item", {
310
- attrs: {
311
- "title": _vm.t("ui.colorSelectPanel.predefine"),
312
- "name": "predefine"
313
- }
314
- }, [_vm.state.predefineStack.length ? _c("div", {
315
- staticClass: "tiny-color-select-panel__predefine"
316
- }, _vm._l(_vm.state.predefineStack, function(color, key) {
317
- return _c("div", {
318
- key,
319
- staticClass: "tiny-color-select-panel__predefine__color-block",
320
- style: {
321
- background: color
206
+ null,
207
+ 4
208
+ /* STYLE */
209
+ ), createElementVNode(
210
+ "div",
211
+ {
212
+ class: "tiny-color-select-panel__alpha__thumb",
213
+ style: normalizeStyle({
214
+ top: 0,
215
+ left: _ctx.state.left + "px",
216
+ transform: "translateX(-50%)"
217
+ }),
218
+ ref: "alphaThumb"
322
219
  },
323
- on: {
324
- "click": function click() {
325
- return _vm.onPredefineColorClick(color);
326
- }
327
- }
328
- });
329
- }), 0) : _vm._e(), !_vm.state.predefineStack.length ? _c("div", [_vm._v(_vm._s(_vm.t("ui.colorSelectPanel.empty")))]) : _vm._e()]) : _vm._e()], 1)], 1) : _vm._e();
330
- };
331
- var staticRenderFns = [];
332
- var __vue2_script = defineComponent({
220
+ null,
221
+ 4
222
+ /* STYLE */
223
+ )],
224
+ 512
225
+ /* NEED_PATCH */
226
+ );
227
+ }
228
+ var AlphaSelect = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
229
+ var _sfc_main = defineComponent({
333
230
  emits: ["update:modelValue", "cancel", "confirm", "color-update"],
334
231
  props: [].concat(props, ["modelValue", "visible", "alpha", "history", "predefine", "format", "enableHistory", "enablePredefineColor"]),
335
232
  components: {
@@ -354,15 +251,185 @@ var __vue2_script = defineComponent({
354
251
  });
355
252
  }
356
253
  });
357
- var __cssModules = {};
358
- var __component__ = /* @__PURE__ */ normalizeComponent(__vue2_script, render, staticRenderFns, false, __vue2_injectStyles);
359
- function __vue2_injectStyles(context) {
360
- for (var o in __cssModules) {
361
- this[o] = __cssModules[o];
362
- }
254
+ var _hoisted_1 = {
255
+ class: "tiny-color-select-panel__tools"
256
+ };
257
+ var _hoisted_2 = {
258
+ key: 0,
259
+ class: "tiny-color-select-panel__tools__format-select"
260
+ };
261
+ var _hoisted_3 = {
262
+ class: "tiny-color-select-panel__tools-btns"
263
+ };
264
+ var _hoisted_4 = {
265
+ key: 0,
266
+ class: "tiny-color-select-panel__history"
267
+ };
268
+ var _hoisted_5 = ["onClick"];
269
+ var _hoisted_6 = {
270
+ key: 1
271
+ };
272
+ var _hoisted_7 = {
273
+ key: 0,
274
+ class: "tiny-color-select-panel__predefine"
275
+ };
276
+ var _hoisted_8 = ["onClick"];
277
+ var _hoisted_9 = {
278
+ key: 1
279
+ };
280
+ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
281
+ var _component_hue_select = resolveComponent("hue-select");
282
+ var _component_alpha_select = resolveComponent("alpha-select");
283
+ var _component_tiny_option = resolveComponent("tiny-option");
284
+ var _component_tiny_select = resolveComponent("tiny-select");
285
+ var _component_tiny_input = resolveComponent("tiny-input");
286
+ var _component_tiny_button = resolveComponent("tiny-button");
287
+ var _component_tiny_collapse_item = resolveComponent("tiny-collapse-item");
288
+ var _component_tiny_collapse = resolveComponent("tiny-collapse");
289
+ var _directive_clickoutside = resolveDirective("clickoutside");
290
+ return _ctx.state.showPicker ? withDirectives((openBlock(), createElementBlock("div", {
291
+ key: 0,
292
+ class: "tiny-color-select-panel",
293
+ onClick: _cache[2] || (_cache[2] = withModifiers(function() {
294
+ }, ["stop"]))
295
+ }, [createVNode(_component_hue_select, {
296
+ color: _ctx.state.color,
297
+ onHueReady: _ctx.onHueReady,
298
+ onSvReady: _ctx.onSvReady
299
+ }, null, 8, ["color", "onHueReady", "onSvReady"]), _ctx.alpha ? (openBlock(), createBlock(_component_alpha_select, {
300
+ key: 0,
301
+ color: _ctx.state.color,
302
+ onReady: _ctx.onAlphaReady
303
+ }, null, 8, ["color", "onReady"])) : createCommentVNode("v-if", true), createElementVNode("div", _hoisted_1, [_ctx.state.formats.length ? (openBlock(), createElementBlock("div", _hoisted_2, [createVNode(_component_tiny_select, {
304
+ modelValue: _ctx.state.currentFormat,
305
+ "onUpdate:modelValue": _cache[0] || (_cache[0] = function($event) {
306
+ return _ctx.state.currentFormat = $event;
307
+ })
308
+ }, {
309
+ default: withCtx(function() {
310
+ return [(openBlock(true), createElementBlock(
311
+ Fragment,
312
+ null,
313
+ renderList(_ctx.state.formats, function(formatValue) {
314
+ return openBlock(), createBlock(_component_tiny_option, {
315
+ key: formatValue,
316
+ value: formatValue,
317
+ label: formatValue
318
+ }, null, 8, ["value", "label"]);
319
+ }),
320
+ 128
321
+ /* KEYED_FRAGMENT */
322
+ ))];
323
+ }),
324
+ _: 1
325
+ /* STABLE */
326
+ }, 8, ["modelValue"])])) : createCommentVNode("v-if", true), createVNode(_component_tiny_input, {
327
+ modelValue: _ctx.state.input,
328
+ "onUpdate:modelValue": _cache[1] || (_cache[1] = function($event) {
329
+ return _ctx.state.input = $event;
330
+ }),
331
+ size: "small"
332
+ }, null, 8, ["modelValue"]), createElementVNode("div", _hoisted_3, [createVNode(_component_tiny_button, {
333
+ size: "small",
334
+ onClick: _ctx.onCancel
335
+ }, {
336
+ default: withCtx(function() {
337
+ return [createTextVNode(
338
+ toDisplayString(_ctx.t("ui.colorSelectPanel.cancel")),
339
+ 1
340
+ /* TEXT */
341
+ )];
342
+ }),
343
+ _: 1
344
+ /* STABLE */
345
+ }, 8, ["onClick"]), createVNode(_component_tiny_button, {
346
+ type: "primary",
347
+ size: "small",
348
+ onClick: _ctx.onConfirm
349
+ }, {
350
+ default: withCtx(function() {
351
+ return [createTextVNode(
352
+ toDisplayString(_ctx.t("ui.colorSelectPanel.confirm")),
353
+ 1
354
+ /* TEXT */
355
+ )];
356
+ }),
357
+ _: 1
358
+ /* STABLE */
359
+ }, 8, ["onClick"])])]), createVNode(_component_tiny_collapse, null, {
360
+ default: withCtx(function() {
361
+ return [_ctx.state.enableHistory ? (openBlock(), createBlock(_component_tiny_collapse_item, {
362
+ key: 0,
363
+ title: _ctx.t("ui.colorSelectPanel.history"),
364
+ name: "history"
365
+ }, {
366
+ default: withCtx(function() {
367
+ return [_ctx.state.stack.length ? (openBlock(), createElementBlock("div", _hoisted_4, [(openBlock(true), createElementBlock(
368
+ Fragment,
369
+ null,
370
+ renderList(_ctx.state.stack, function(color, key) {
371
+ return openBlock(), createElementBlock("div", {
372
+ class: "tiny-color-select-panel__history__color-block",
373
+ key,
374
+ style: normalizeStyle({
375
+ background: color
376
+ }),
377
+ onClick: function onClick() {
378
+ return _ctx.onHistoryClick(color);
379
+ }
380
+ }, null, 12, _hoisted_5);
381
+ }),
382
+ 128
383
+ /* KEYED_FRAGMENT */
384
+ ))])) : createCommentVNode("v-if", true), !_ctx.state.stack.length ? (openBlock(), createElementBlock(
385
+ "div",
386
+ _hoisted_6,
387
+ toDisplayString(_ctx.t("ui.colorSelectPanel.empty")),
388
+ 1
389
+ /* TEXT */
390
+ )) : createCommentVNode("v-if", true)];
391
+ }),
392
+ _: 1
393
+ /* STABLE */
394
+ }, 8, ["title"])) : createCommentVNode("v-if", true), _ctx.state.enablePredefineColor ? (openBlock(), createBlock(_component_tiny_collapse_item, {
395
+ key: 1,
396
+ title: _ctx.t("ui.colorSelectPanel.predefine"),
397
+ name: "predefine"
398
+ }, {
399
+ default: withCtx(function() {
400
+ return [_ctx.state.predefineStack.length ? (openBlock(), createElementBlock("div", _hoisted_7, [(openBlock(true), createElementBlock(
401
+ Fragment,
402
+ null,
403
+ renderList(_ctx.state.predefineStack, function(color, key) {
404
+ return openBlock(), createElementBlock("div", {
405
+ class: "tiny-color-select-panel__predefine__color-block",
406
+ key,
407
+ style: normalizeStyle({
408
+ background: color
409
+ }),
410
+ onClick: function onClick() {
411
+ return _ctx.onPredefineColorClick(color);
412
+ }
413
+ }, null, 12, _hoisted_8);
414
+ }),
415
+ 128
416
+ /* KEYED_FRAGMENT */
417
+ ))])) : createCommentVNode("v-if", true), !_ctx.state.predefineStack.length ? (openBlock(), createElementBlock(
418
+ "div",
419
+ _hoisted_9,
420
+ toDisplayString(_ctx.t("ui.colorSelectPanel.empty")),
421
+ 1
422
+ /* TEXT */
423
+ )) : createCommentVNode("v-if", true)];
424
+ }),
425
+ _: 1
426
+ /* STABLE */
427
+ }, 8, ["title"])) : createCommentVNode("v-if", true)];
428
+ }),
429
+ _: 1
430
+ /* STABLE */
431
+ })])), [[_directive_clickoutside, _ctx.onClickOutside]]) : createCommentVNode("v-if", true);
363
432
  }
364
- var pc = /* @__PURE__ */ function() {
365
- return __component__.exports;
366
- }();
433
+ var pc = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
367
434
 
368
435
  export { pc as default };
package/package.json CHANGED
@@ -1,22 +1,22 @@
1
1
  {
2
2
  "name": "@opentinyvue/vue-color-select-panel",
3
3
  "type": "module",
4
- "version": "2.22.0",
4
+ "version": "3.22.0",
5
5
  "description": "",
6
6
  "license": "MIT",
7
7
  "sideEffects": false,
8
8
  "main": "./lib/index.js",
9
9
  "module": "./lib/index.js",
10
10
  "dependencies": {
11
- "@opentinyvue/vue-button": "~2.22.0",
12
- "@opentinyvue/vue-collapse": "~2.22.0",
13
- "@opentinyvue/vue-collapse-item": "~2.22.0",
14
- "@opentinyvue/vue-common": "~2.22.0",
15
- "@opentinyvue/vue-directive": "~2.22.0",
16
- "@opentinyvue/vue-input": "~2.22.0",
17
- "@opentinyvue/vue-option": "~2.22.0",
11
+ "@opentinyvue/vue-button": "~3.22.0",
12
+ "@opentinyvue/vue-collapse": "~3.22.0",
13
+ "@opentinyvue/vue-collapse-item": "~3.22.0",
14
+ "@opentinyvue/vue-common": "~3.22.0",
15
+ "@opentinyvue/vue-directive": "~3.22.0",
16
+ "@opentinyvue/vue-input": "~3.22.0",
17
+ "@opentinyvue/vue-option": "~3.22.0",
18
18
  "@opentinyvue/vue-renderless": "~3.22.0",
19
- "@opentinyvue/vue-select": "~2.22.0",
19
+ "@opentinyvue/vue-select": "~3.22.0",
20
20
  "@opentinyvue/vue-theme": "~3.22.0"
21
21
  },
22
22
  "types": "index.d.ts"
@@ -1,2 +1,21 @@
1
- declare const _default: any;
1
+ declare const _default: import("@vue/runtime-core").DefineComponent<{
2
+ color: {
3
+ type: ObjectConstructor;
4
+ };
5
+ }, {
6
+ t: (this: any, path: any, options?: any) => any;
7
+ vm: any;
8
+ f: (props: any, attrs?: {}) => {};
9
+ a: (attrs: any, filters: any, include: any) => {};
10
+ d: (props: any) => void;
11
+ dp: (props: any) => void;
12
+ gcls: (key: any) => any;
13
+ m: (...cssClasses: any[]) => string;
14
+ }, any, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, "ready"[], "ready", import("@vue/runtime-core").PublicProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{
15
+ color: {
16
+ type: ObjectConstructor;
17
+ };
18
+ }>> & {
19
+ onReady?: ((...args: any[]) => any) | undefined;
20
+ }, {}, {}>;
2
21
  export default _default;
@@ -1,2 +1,31 @@
1
- declare const _default: any;
1
+ declare const _default: import("@vue/runtime-core").DefineComponent<{
2
+ color: {
3
+ type: ObjectConstructor;
4
+ };
5
+ alpha: {
6
+ type: BooleanConstructor;
7
+ };
8
+ }, {
9
+ t: (this: any, path: any, options?: any) => any;
10
+ vm: any;
11
+ f: (props: any, attrs?: {}) => {};
12
+ a: (attrs: any, filters: any, include: any) => {};
13
+ d: (props: any) => void;
14
+ dp: (props: any) => void;
15
+ gcls: (key: any) => any;
16
+ m: (...cssClasses: any[]) => string;
17
+ }, any, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, ("hueUpdate" | "svReady" | "hueReady")[], "hueUpdate" | "svReady" | "hueReady", import("@vue/runtime-core").PublicProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{
18
+ color: {
19
+ type: ObjectConstructor;
20
+ };
21
+ alpha: {
22
+ type: BooleanConstructor;
23
+ };
24
+ }>> & {
25
+ onHueUpdate?: ((...args: any[]) => any) | undefined;
26
+ onHueReady?: ((...args: any[]) => any) | undefined;
27
+ onSvReady?: ((...args: any[]) => any) | undefined;
28
+ }, {
29
+ alpha: boolean;
30
+ }, {}>;
2
31
  export default _default;
@@ -1,2 +1,19 @@
1
- declare const _default: any;
1
+ declare const _default: import("@vue/runtime-core").DefineComponent<{
2
+ color: {
3
+ type: ObjectConstructor;
4
+ };
5
+ }, {
6
+ t: (this: any, path: any, options?: any) => any;
7
+ vm: any;
8
+ f: (props: any, attrs?: {}) => {};
9
+ a: (attrs: any, filters: any, include: any) => {};
10
+ d: (props: any) => void;
11
+ dp: (props: any) => void;
12
+ gcls: (key: any) => any;
13
+ m: (...cssClasses: any[]) => string;
14
+ }, any, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, {}, string, import("@vue/runtime-core").PublicProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{
15
+ color: {
16
+ type: ObjectConstructor;
17
+ };
18
+ }>>, {}, {}>;
2
19
  export default _default;
package/src/index.d.ts CHANGED
@@ -1,2 +1,70 @@
1
- declare const _default: any;
1
+ declare const _default: import("@vue/runtime-core").DefineComponent<{
2
+ _constants: {
3
+ type: ObjectConstructor;
4
+ default: () => {};
5
+ };
6
+ modelValue: StringConstructor;
7
+ visible: BooleanConstructor;
8
+ alpha: BooleanConstructor;
9
+ history: ArrayConstructor;
10
+ predefine: ArrayConstructor;
11
+ enableHistory: {
12
+ type: BooleanConstructor;
13
+ default: boolean;
14
+ };
15
+ enablePredefineColor: {
16
+ type: BooleanConstructor;
17
+ default: boolean;
18
+ };
19
+ format: {
20
+ type: ArrayConstructor;
21
+ default: () => never[];
22
+ validator(formats: string[]): boolean;
23
+ };
24
+ tiny_mode: StringConstructor;
25
+ tiny_mode_root: BooleanConstructor;
26
+ tiny_template: (ObjectConstructor | FunctionConstructor)[];
27
+ tiny_renderless: FunctionConstructor;
28
+ tiny_theme: StringConstructor;
29
+ tiny_chart_theme: ObjectConstructor;
30
+ }, () => import("@vue/runtime-core").VNode<import("@vue/runtime-core").RendererNode, import("@vue/runtime-core").RendererElement, {
31
+ [key: string]: any;
32
+ }>, unknown, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, {}, string, import("@vue/runtime-core").PublicProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{
33
+ _constants: {
34
+ type: ObjectConstructor;
35
+ default: () => {};
36
+ };
37
+ modelValue: StringConstructor;
38
+ visible: BooleanConstructor;
39
+ alpha: BooleanConstructor;
40
+ history: ArrayConstructor;
41
+ predefine: ArrayConstructor;
42
+ enableHistory: {
43
+ type: BooleanConstructor;
44
+ default: boolean;
45
+ };
46
+ enablePredefineColor: {
47
+ type: BooleanConstructor;
48
+ default: boolean;
49
+ };
50
+ format: {
51
+ type: ArrayConstructor;
52
+ default: () => never[];
53
+ validator(formats: string[]): boolean;
54
+ };
55
+ tiny_mode: StringConstructor;
56
+ tiny_mode_root: BooleanConstructor;
57
+ tiny_template: (ObjectConstructor | FunctionConstructor)[];
58
+ tiny_renderless: FunctionConstructor;
59
+ tiny_theme: StringConstructor;
60
+ tiny_chart_theme: ObjectConstructor;
61
+ }>>, {
62
+ format: unknown[];
63
+ visible: boolean;
64
+ tiny_mode_root: boolean;
65
+ _constants: Record<string, any>;
66
+ alpha: boolean;
67
+ enableHistory: boolean;
68
+ enablePredefineColor: boolean;
69
+ }, {}>;
2
70
  export default _default;
package/src/pc.vue.d.ts CHANGED
@@ -1,2 +1,64 @@
1
- declare const _default: any;
1
+ declare const _default: import("@vue/runtime-core").DefineComponent<Readonly<{
2
+ format?: any;
3
+ visible?: any;
4
+ tiny_mode?: any;
5
+ tiny_mode_root?: any;
6
+ tiny_template?: any;
7
+ tiny_renderless?: any;
8
+ _constants?: any;
9
+ tiny_theme?: any;
10
+ tiny_chart_theme?: any;
11
+ modelValue?: any;
12
+ alpha?: any;
13
+ predefine?: any;
14
+ history?: any;
15
+ enableHistory?: any;
16
+ enablePredefineColor?: any;
17
+ }>, {
18
+ t: (this: any, path: any, options?: any) => any;
19
+ vm: any;
20
+ f: (props: any, attrs?: {}) => {};
21
+ a: (attrs: any, filters: any, include: any) => {};
22
+ d: (props: any) => void;
23
+ dp: (props: any) => void;
24
+ gcls: (key: any) => any;
25
+ m: (...cssClasses: any[]) => string;
26
+ }, any, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, ("cancel" | "update:modelValue" | "confirm" | "color-update")[], "cancel" | "update:modelValue" | "confirm" | "color-update", import("@vue/runtime-core").PublicProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<Readonly<{
27
+ format?: any;
28
+ visible?: any;
29
+ tiny_mode?: any;
30
+ tiny_mode_root?: any;
31
+ tiny_template?: any;
32
+ tiny_renderless?: any;
33
+ _constants?: any;
34
+ tiny_theme?: any;
35
+ tiny_chart_theme?: any;
36
+ modelValue?: any;
37
+ alpha?: any;
38
+ predefine?: any;
39
+ history?: any;
40
+ enableHistory?: any;
41
+ enablePredefineColor?: any;
42
+ }>>> & {
43
+ onCancel?: ((...args: any[]) => any) | undefined;
44
+ "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
45
+ onConfirm?: ((...args: any[]) => any) | undefined;
46
+ "onColor-update"?: ((...args: any[]) => any) | undefined;
47
+ }, {
48
+ readonly format?: any;
49
+ readonly visible?: any;
50
+ readonly tiny_mode?: any;
51
+ readonly tiny_mode_root?: any;
52
+ readonly tiny_template?: any;
53
+ readonly tiny_renderless?: any;
54
+ readonly _constants?: any;
55
+ readonly tiny_theme?: any;
56
+ readonly tiny_chart_theme?: any;
57
+ readonly modelValue?: any;
58
+ readonly alpha?: any;
59
+ readonly predefine?: any;
60
+ readonly history?: any;
61
+ readonly enableHistory?: any;
62
+ readonly enablePredefineColor?: any;
63
+ }, {}>;
2
64
  export default _default;