@pequity/squirrel 8.3.1 → 8.3.3
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/dist/cjs/index.js +70 -18
- package/dist/cjs/p-steps.js +0 -2
- package/dist/es/chunks/p-dropdown-select.js +2 -2
- package/dist/es/index.js +103 -51
- package/dist/es/p-dropdown-select.js +1 -1
- package/dist/es/p-steps.js +1 -4
- package/dist/squirrel/components/index.d.ts +2 -1
- package/dist/squirrel/components/p-steps/p-steps.types.d.ts +5 -0
- package/dist/squirrel/components/p-steps/p-steps.vue.d.ts +14 -15
- package/dist/squirrel.css +74 -74
- package/package.json +5 -5
- package/squirrel/components/index.ts +2 -0
- package/squirrel/components/p-steps/__snapshots__/{p-steps.spec.js.snap → p-steps.spec.ts.snap} +5 -5
- package/squirrel/components/p-steps/p-steps.spec.ts +206 -0
- package/squirrel/components/p-steps/p-steps.stories.js +32 -4
- package/squirrel/components/p-steps/p-steps.types.ts +5 -0
- package/squirrel/components/p-steps/p-steps.vue +31 -21
- package/dist/cjs/chunks/p-steps.js +0 -55
- package/dist/es/chunks/p-steps.js +0 -56
- package/squirrel/components/p-steps/p-steps.spec.js +0 -126
package/dist/cjs/index.js
CHANGED
|
@@ -42,7 +42,6 @@ const string = require("./string.js");
|
|
|
42
42
|
const text = require("./text.js");
|
|
43
43
|
const pSelectPill = require("./p-select-pill.js");
|
|
44
44
|
const pSkeletonLoader = require("./p-skeleton-loader.js");
|
|
45
|
-
const pSteps_vue_vue_type_script_setup_true_lang = require("./chunks/p-steps.js");
|
|
46
45
|
const pTable$1 = require("./p-table.js");
|
|
47
46
|
const usePTableColResize = require("./usePTableColResize.js");
|
|
48
47
|
const pTableHeaderCell = require("./p-table-header-cell.js");
|
|
@@ -65,12 +64,12 @@ const object = require("./object.js");
|
|
|
65
64
|
const pagination = require("./pagination.js");
|
|
66
65
|
const sanitization = require("./sanitization.js");
|
|
67
66
|
const index = require("./chunks/index.js");
|
|
68
|
-
const _hoisted_1$
|
|
69
|
-
const _hoisted_2$
|
|
67
|
+
const _hoisted_1$4 = ["data-has-error"];
|
|
68
|
+
const _hoisted_2$4 = {
|
|
70
69
|
key: 0,
|
|
71
70
|
class: "flex h-28 flex-col items-center justify-center"
|
|
72
71
|
};
|
|
73
|
-
const _hoisted_3$
|
|
72
|
+
const _hoisted_3$4 = {
|
|
74
73
|
key: 0,
|
|
75
74
|
class: "flex flex-col items-center"
|
|
76
75
|
};
|
|
@@ -86,7 +85,7 @@ const _hoisted_9 = { class: "max-h-48 overflow-y-auto overflow-x-hidden" };
|
|
|
86
85
|
const _hoisted_10 = ["title"];
|
|
87
86
|
const _hoisted_11 = ["onClick"];
|
|
88
87
|
const _hoisted_12 = { class: "mt-1 text-xs text-p-gray-40" };
|
|
89
|
-
const _sfc_main$
|
|
88
|
+
const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
|
|
90
89
|
...{
|
|
91
90
|
name: "PFileUpload"
|
|
92
91
|
},
|
|
@@ -254,8 +253,8 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
|
|
|
254
253
|
onDrop: vue.withModifiers(onDrop, ["prevent", "stop"]),
|
|
255
254
|
onClick: openFileDialog
|
|
256
255
|
}, [
|
|
257
|
-
!maxFilesReached.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$
|
|
258
|
-
!isDraggingOver.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$
|
|
256
|
+
!maxFilesReached.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$4, [
|
|
257
|
+
!isDraggingOver.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$4, [
|
|
259
258
|
vue.createVNode(pIcon_vue_vue_type_script_setup_true_lang._sfc_main, {
|
|
260
259
|
icon: "upload",
|
|
261
260
|
width: "32",
|
|
@@ -322,13 +321,13 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
|
|
|
322
321
|
[vue.vShow, __props.errorMsg]
|
|
323
322
|
]),
|
|
324
323
|
vue.createElementVNode("div", _hoisted_12, vue.toDisplayString(__props.multiple ? `Max ${__props.maxNumberOfFiles}` : "One") + " " + vue.toDisplayString(acceptFileTypes.value) + " " + vue.toDisplayString(__props.multiple ? "files" : "file") + " with size less than " + vue.toDisplayString(vue.unref(pFileUpload.formatBytes)(__props.maxSizeInBytes)) + " " + vue.toDisplayString(__props.multiple ? "each" : ""), 1)
|
|
325
|
-
], 10, _hoisted_1$
|
|
324
|
+
], 10, _hoisted_1$4);
|
|
326
325
|
};
|
|
327
326
|
}
|
|
328
327
|
});
|
|
329
|
-
const _hoisted_1$
|
|
330
|
-
const _hoisted_2$
|
|
331
|
-
const _hoisted_3$
|
|
328
|
+
const _hoisted_1$3 = ["data-has-error"];
|
|
329
|
+
const _hoisted_2$3 = { class: "text-p-purple-60" };
|
|
330
|
+
const _hoisted_3$3 = { class: "flex flex-row" };
|
|
332
331
|
const _hoisted_4$2 = ["onClick"];
|
|
333
332
|
const _hoisted_5$2 = ["title"];
|
|
334
333
|
const _hoisted_6$2 = {
|
|
@@ -336,7 +335,7 @@ const _hoisted_6$2 = {
|
|
|
336
335
|
class: "ml-auto fill-p-purple-60 pl-2",
|
|
337
336
|
src: pDropdownSelect_vue_vue_type_script_setup_true_lang._imports_0
|
|
338
337
|
};
|
|
339
|
-
const _sfc_main$
|
|
338
|
+
const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
|
|
340
339
|
...{
|
|
341
340
|
name: "PSelectList",
|
|
342
341
|
inheritAttrs: false
|
|
@@ -544,8 +543,8 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
|
|
|
544
543
|
ref: actionsContainer,
|
|
545
544
|
class: "flex flex-row justify-between text-xs font-semibold text-primary"
|
|
546
545
|
}, [
|
|
547
|
-
vue.createElementVNode("p", _hoisted_2$
|
|
548
|
-
vue.createElementVNode("div", _hoisted_3$
|
|
546
|
+
vue.createElementVNode("p", _hoisted_2$3, vue.toDisplayString(vue.unref(computedItems).length) + " items", 1),
|
|
547
|
+
vue.createElementVNode("div", _hoisted_3$3, [
|
|
549
548
|
vue.unref(computedItems).length === vue.unref(internalItems).length ? (vue.openBlock(), vue.createElementBlock("a", {
|
|
550
549
|
key: 0,
|
|
551
550
|
class: vue.normalizeClass([
|
|
@@ -657,7 +656,60 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
|
|
|
657
656
|
}, vue.toDisplayString(__props.errorMsg), 3), [
|
|
658
657
|
[vue.vShow, __props.errorMsg]
|
|
659
658
|
])
|
|
660
|
-
], 14, _hoisted_1$
|
|
659
|
+
], 14, _hoisted_1$3);
|
|
660
|
+
};
|
|
661
|
+
}
|
|
662
|
+
});
|
|
663
|
+
const _hoisted_1$2 = { class: "flex items-center gap-2" };
|
|
664
|
+
const _hoisted_2$2 = ["data-state", "onClick"];
|
|
665
|
+
const _hoisted_3$2 = {
|
|
666
|
+
key: 0,
|
|
667
|
+
class: "flex items-center"
|
|
668
|
+
};
|
|
669
|
+
const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
|
|
670
|
+
...{
|
|
671
|
+
name: "PSteps"
|
|
672
|
+
},
|
|
673
|
+
__name: "p-steps",
|
|
674
|
+
props: {
|
|
675
|
+
activeStep: { default: null },
|
|
676
|
+
steps: { default: () => [] },
|
|
677
|
+
clickable: { type: Boolean, default: false }
|
|
678
|
+
},
|
|
679
|
+
emits: ["click:step"],
|
|
680
|
+
setup(__props, { emit: __emit }) {
|
|
681
|
+
const props = __props;
|
|
682
|
+
const emit = __emit;
|
|
683
|
+
const activeStepIndex = vue.computed(() => props.steps.findIndex((s) => s.value === props.activeStep));
|
|
684
|
+
const stepClasses = (step, stepIndex) => {
|
|
685
|
+
if (step.value === props.activeStep) {
|
|
686
|
+
return "border-p-blue-50 bg-p-blue-50 text-surface";
|
|
687
|
+
}
|
|
688
|
+
if (activeStepIndex.value < stepIndex) {
|
|
689
|
+
return "border-p-gray-30 text-p-gray-30";
|
|
690
|
+
}
|
|
691
|
+
return "border-p-blue-50 text-p-blue-50";
|
|
692
|
+
};
|
|
693
|
+
return (_ctx, _cache) => {
|
|
694
|
+
return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, [
|
|
695
|
+
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.steps, (step, i) => {
|
|
696
|
+
return vue.openBlock(), vue.createElementBlock(vue.Fragment, {
|
|
697
|
+
key: step.value
|
|
698
|
+
}, [
|
|
699
|
+
vue.createElementVNode("div", {
|
|
700
|
+
class: vue.normalizeClass(["text-nowrap rounded-full border px-4 py-1 text-sm font-semibold", [stepClasses(step, i), { "cursor-pointer": _ctx.clickable && !step.disabled }]]),
|
|
701
|
+
"data-state": step.value === _ctx.activeStep ? "active" : "inactive",
|
|
702
|
+
onClick: ($event) => emit("click:step", step, i)
|
|
703
|
+
}, vue.toDisplayString(step.text || vue.unref(lodashEs.startCase)(String(step.value))), 11, _hoisted_2$2),
|
|
704
|
+
i < _ctx.steps.length - 1 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$2, [
|
|
705
|
+
vue.createVNode(pIcon_vue_vue_type_script_setup_true_lang._sfc_main, {
|
|
706
|
+
icon: "material-symbols:arrow-right-alt-rounded",
|
|
707
|
+
class: vue.normalizeClass([activeStepIndex.value <= i ? "text-p-gray-30" : "text-p-blue-50"])
|
|
708
|
+
}, null, 8, ["class"])
|
|
709
|
+
])) : vue.createCommentVNode("", true)
|
|
710
|
+
], 64);
|
|
711
|
+
}), 128))
|
|
712
|
+
]);
|
|
661
713
|
};
|
|
662
714
|
}
|
|
663
715
|
});
|
|
@@ -1020,7 +1072,6 @@ exports.toString = string.toString;
|
|
|
1020
1072
|
exports.splitStringForHighlight = text.splitStringForHighlight;
|
|
1021
1073
|
exports.PSelectPill = pSelectPill;
|
|
1022
1074
|
exports.PSkeletonLoader = pSkeletonLoader;
|
|
1023
|
-
exports.PSteps = pSteps_vue_vue_type_script_setup_true_lang._sfc_main;
|
|
1024
1075
|
exports.MIN_WIDTH_COL_RESIZE = pTable$1.MIN_WIDTH_COL_RESIZE;
|
|
1025
1076
|
exports.colsInjectionKey = pTable$1.colsInjectionKey;
|
|
1026
1077
|
exports.isColsResizableInjectionKey = pTable$1.isColsResizableInjectionKey;
|
|
@@ -1053,7 +1104,8 @@ exports.createTV = index.fe;
|
|
|
1053
1104
|
exports.defaultConfig = index.ie;
|
|
1054
1105
|
exports.tv = index.ce;
|
|
1055
1106
|
exports.voidEmpty = index.x;
|
|
1056
|
-
exports.PFileUpload = _sfc_main$
|
|
1057
|
-
exports.PSelectList = _sfc_main$
|
|
1107
|
+
exports.PFileUpload = _sfc_main$4;
|
|
1108
|
+
exports.PSelectList = _sfc_main$3;
|
|
1109
|
+
exports.PSteps = _sfc_main$2;
|
|
1058
1110
|
exports.PTable = pTable;
|
|
1059
1111
|
exports.PTableSort = _sfc_main;
|
package/dist/cjs/p-steps.js
CHANGED
package/dist/es/index.js
CHANGED
|
@@ -9,39 +9,38 @@ import { default as default4 } from "./p-close-btn.js";
|
|
|
9
9
|
import { _ as _6 } from "./chunks/p-date-picker.js";
|
|
10
10
|
import { default as default5 } from "./p-drawer.js";
|
|
11
11
|
import { default as default6 } from "./p-dropdown.js";
|
|
12
|
-
import {
|
|
13
|
-
import {
|
|
12
|
+
import { a as _imports_0$1 } from "./chunks/p-dropdown-select.js";
|
|
13
|
+
import { _ as _7 } from "./chunks/p-dropdown-select.js";
|
|
14
14
|
import { defineComponent, shallowRef, ref, computed, onMounted, createElementBlock, openBlock, normalizeClass, createCommentVNode, createElementVNode, withDirectives, unref, toDisplayString, withModifiers, createVNode, createTextVNode, Fragment, renderList, vShow, useAttrs, resolveDirective, normalizeStyle, isRef, renderSlot, provide, onBeforeUnmount, watch, mergeProps, toHandlers, createBlock, withCtx } from "vue";
|
|
15
15
|
import { formatBytes, getFileExtension } from "./p-file-upload.js";
|
|
16
|
-
import { _ as _sfc_main$
|
|
16
|
+
import { _ as _sfc_main$5 } from "./chunks/p-icon.js";
|
|
17
17
|
import { useInputClasses } from "./useInputClasses.js";
|
|
18
|
-
import { uniq, kebabCase } from "lodash-es";
|
|
18
|
+
import { uniq, startCase, kebabCase } from "lodash-es";
|
|
19
19
|
import { useToast } from "vue-toastification";
|
|
20
20
|
import { P_ICON_ALIASES } from "./p-icon.js";
|
|
21
|
-
import { _ as
|
|
22
|
-
import { _ as
|
|
23
|
-
import { _ as
|
|
24
|
-
import { _ as
|
|
25
|
-
import { _ as
|
|
21
|
+
import { _ as _8 } from "./chunks/p-info-icon.js";
|
|
22
|
+
import { _ as _9 } from "./chunks/p-inline-date-picker.js";
|
|
23
|
+
import { _ as _10 } from "./chunks/p-input.js";
|
|
24
|
+
import { _ as _11 } from "./chunks/p-input-number.js";
|
|
25
|
+
import { _ as _12 } from "./chunks/p-input-percent.js";
|
|
26
26
|
import PInputSearch from "./p-input-search.js";
|
|
27
|
-
import { _ as
|
|
27
|
+
import { _ as _13 } from "./chunks/p-link.js";
|
|
28
28
|
import { default as default7 } from "./p-loading.js";
|
|
29
29
|
import { usePLoading } from "./usePLoading.js";
|
|
30
30
|
import { default as default8 } from "./p-modal.js";
|
|
31
31
|
import { usePModal } from "./usePModal.js";
|
|
32
|
-
import { _ as
|
|
33
|
-
import { _ as
|
|
34
|
-
import { _ as
|
|
35
|
-
import { _ as
|
|
36
|
-
import { _ as
|
|
37
|
-
import { _ as
|
|
32
|
+
import { _ as _14 } from "./chunks/p-pagination.js";
|
|
33
|
+
import { _ as _15 } from "./chunks/p-pagination-info.js";
|
|
34
|
+
import { _ as _16 } from "./chunks/p-progress-bar.js";
|
|
35
|
+
import { _ as _17 } from "./chunks/p-ring-loader.js";
|
|
36
|
+
import { _ as _18 } from "./chunks/p-select.js";
|
|
37
|
+
import { _ as _19 } from "./chunks/p-select-btn.js";
|
|
38
38
|
import { SIZES } from "./p-select-list.js";
|
|
39
39
|
import { useSelectList } from "./useSelectList.js";
|
|
40
40
|
import { toString } from "./string.js";
|
|
41
41
|
import { splitStringForHighlight } from "./text.js";
|
|
42
42
|
import { default as default9 } from "./p-select-pill.js";
|
|
43
43
|
import { default as default10 } from "./p-skeleton-loader.js";
|
|
44
|
-
import { _ as _19 } from "./chunks/p-steps.js";
|
|
45
44
|
import { colsInjectionKey, isFirstColFixedInjectionKey, isLastColFixedInjectionKey, isColsResizableInjectionKey } from "./p-table.js";
|
|
46
45
|
import { MIN_WIDTH_COL_RESIZE } from "./p-table.js";
|
|
47
46
|
import { usePTableColResize } from "./usePTableColResize.js";
|
|
@@ -65,12 +64,12 @@ import { isObject } from "./object.js";
|
|
|
65
64
|
import { createPagingRange } from "./pagination.js";
|
|
66
65
|
import { sanitizeUrl } from "./sanitization.js";
|
|
67
66
|
import { M, N, f, i, c, x } from "./chunks/index.js";
|
|
68
|
-
const _hoisted_1$
|
|
69
|
-
const _hoisted_2$
|
|
67
|
+
const _hoisted_1$4 = ["data-has-error"];
|
|
68
|
+
const _hoisted_2$4 = {
|
|
70
69
|
key: 0,
|
|
71
70
|
class: "flex h-28 flex-col items-center justify-center"
|
|
72
71
|
};
|
|
73
|
-
const _hoisted_3$
|
|
72
|
+
const _hoisted_3$4 = {
|
|
74
73
|
key: 0,
|
|
75
74
|
class: "flex flex-col items-center"
|
|
76
75
|
};
|
|
@@ -86,7 +85,7 @@ const _hoisted_9 = { class: "max-h-48 overflow-y-auto overflow-x-hidden" };
|
|
|
86
85
|
const _hoisted_10 = ["title"];
|
|
87
86
|
const _hoisted_11 = ["onClick"];
|
|
88
87
|
const _hoisted_12 = { class: "mt-1 text-xs text-p-gray-40" };
|
|
89
|
-
const _sfc_main$
|
|
88
|
+
const _sfc_main$4 = /* @__PURE__ */ defineComponent({
|
|
90
89
|
...{
|
|
91
90
|
name: "PFileUpload"
|
|
92
91
|
},
|
|
@@ -254,9 +253,9 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
|
254
253
|
onDrop: withModifiers(onDrop, ["prevent", "stop"]),
|
|
255
254
|
onClick: openFileDialog
|
|
256
255
|
}, [
|
|
257
|
-
!maxFilesReached.value ? (openBlock(), createElementBlock("div", _hoisted_2$
|
|
258
|
-
!isDraggingOver.value ? (openBlock(), createElementBlock("div", _hoisted_3$
|
|
259
|
-
createVNode(_sfc_main$
|
|
256
|
+
!maxFilesReached.value ? (openBlock(), createElementBlock("div", _hoisted_2$4, [
|
|
257
|
+
!isDraggingOver.value ? (openBlock(), createElementBlock("div", _hoisted_3$4, [
|
|
258
|
+
createVNode(_sfc_main$5, {
|
|
260
259
|
icon: "upload",
|
|
261
260
|
width: "32",
|
|
262
261
|
class: "text-p-gray-50"
|
|
@@ -266,7 +265,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
|
266
265
|
createElementVNode("span", _hoisted_5$3, "select " + toDisplayString(fileWord.value), 1)
|
|
267
266
|
])
|
|
268
267
|
])) : (openBlock(), createElementBlock("div", _hoisted_6$3, [
|
|
269
|
-
createVNode(_sfc_main$
|
|
268
|
+
createVNode(_sfc_main$5, {
|
|
270
269
|
icon: "tdesign:drag-drop",
|
|
271
270
|
width: "32",
|
|
272
271
|
class: "text-primary"
|
|
@@ -306,7 +305,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
|
306
305
|
class: "h-5 shrink-0 cursor-pointer overflow-hidden",
|
|
307
306
|
onClick: withModifiers(($event) => removeFile(index), ["stop"])
|
|
308
307
|
}, [
|
|
309
|
-
createVNode(_sfc_main$
|
|
308
|
+
createVNode(_sfc_main$5, {
|
|
310
309
|
icon: "weui:close2-outlined",
|
|
311
310
|
width: "20",
|
|
312
311
|
class: "text-p-gray-60 hover:text-on-error"
|
|
@@ -322,13 +321,13 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
|
322
321
|
[vShow, __props.errorMsg]
|
|
323
322
|
]),
|
|
324
323
|
createElementVNode("div", _hoisted_12, toDisplayString(__props.multiple ? `Max ${__props.maxNumberOfFiles}` : "One") + " " + toDisplayString(acceptFileTypes.value) + " " + toDisplayString(__props.multiple ? "files" : "file") + " with size less than " + toDisplayString(unref(formatBytes)(__props.maxSizeInBytes)) + " " + toDisplayString(__props.multiple ? "each" : ""), 1)
|
|
325
|
-
], 10, _hoisted_1$
|
|
324
|
+
], 10, _hoisted_1$4);
|
|
326
325
|
};
|
|
327
326
|
}
|
|
328
327
|
});
|
|
329
|
-
const _hoisted_1$
|
|
330
|
-
const _hoisted_2$
|
|
331
|
-
const _hoisted_3$
|
|
328
|
+
const _hoisted_1$3 = ["data-has-error"];
|
|
329
|
+
const _hoisted_2$3 = { class: "text-p-purple-60" };
|
|
330
|
+
const _hoisted_3$3 = { class: "flex flex-row" };
|
|
332
331
|
const _hoisted_4$2 = ["onClick"];
|
|
333
332
|
const _hoisted_5$2 = ["title"];
|
|
334
333
|
const _hoisted_6$2 = {
|
|
@@ -336,7 +335,7 @@ const _hoisted_6$2 = {
|
|
|
336
335
|
class: "ml-auto fill-p-purple-60 pl-2",
|
|
337
336
|
src: _imports_0$1
|
|
338
337
|
};
|
|
339
|
-
const _sfc_main$
|
|
338
|
+
const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
340
339
|
...{
|
|
341
340
|
name: "PSelectList",
|
|
342
341
|
inheritAttrs: false
|
|
@@ -544,8 +543,8 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
|
544
543
|
ref: actionsContainer,
|
|
545
544
|
class: "flex flex-row justify-between text-xs font-semibold text-primary"
|
|
546
545
|
}, [
|
|
547
|
-
createElementVNode("p", _hoisted_2$
|
|
548
|
-
createElementVNode("div", _hoisted_3$
|
|
546
|
+
createElementVNode("p", _hoisted_2$3, toDisplayString(unref(computedItems).length) + " items", 1),
|
|
547
|
+
createElementVNode("div", _hoisted_3$3, [
|
|
549
548
|
unref(computedItems).length === unref(internalItems).length ? (openBlock(), createElementBlock("a", {
|
|
550
549
|
key: 0,
|
|
551
550
|
class: normalizeClass([
|
|
@@ -657,7 +656,60 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
|
657
656
|
}, toDisplayString(__props.errorMsg), 3), [
|
|
658
657
|
[vShow, __props.errorMsg]
|
|
659
658
|
])
|
|
660
|
-
], 14, _hoisted_1$
|
|
659
|
+
], 14, _hoisted_1$3);
|
|
660
|
+
};
|
|
661
|
+
}
|
|
662
|
+
});
|
|
663
|
+
const _hoisted_1$2 = { class: "flex items-center gap-2" };
|
|
664
|
+
const _hoisted_2$2 = ["data-state", "onClick"];
|
|
665
|
+
const _hoisted_3$2 = {
|
|
666
|
+
key: 0,
|
|
667
|
+
class: "flex items-center"
|
|
668
|
+
};
|
|
669
|
+
const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
670
|
+
...{
|
|
671
|
+
name: "PSteps"
|
|
672
|
+
},
|
|
673
|
+
__name: "p-steps",
|
|
674
|
+
props: {
|
|
675
|
+
activeStep: { default: null },
|
|
676
|
+
steps: { default: () => [] },
|
|
677
|
+
clickable: { type: Boolean, default: false }
|
|
678
|
+
},
|
|
679
|
+
emits: ["click:step"],
|
|
680
|
+
setup(__props, { emit: __emit }) {
|
|
681
|
+
const props = __props;
|
|
682
|
+
const emit = __emit;
|
|
683
|
+
const activeStepIndex = computed(() => props.steps.findIndex((s) => s.value === props.activeStep));
|
|
684
|
+
const stepClasses = (step, stepIndex) => {
|
|
685
|
+
if (step.value === props.activeStep) {
|
|
686
|
+
return "border-p-blue-50 bg-p-blue-50 text-surface";
|
|
687
|
+
}
|
|
688
|
+
if (activeStepIndex.value < stepIndex) {
|
|
689
|
+
return "border-p-gray-30 text-p-gray-30";
|
|
690
|
+
}
|
|
691
|
+
return "border-p-blue-50 text-p-blue-50";
|
|
692
|
+
};
|
|
693
|
+
return (_ctx, _cache) => {
|
|
694
|
+
return openBlock(), createElementBlock("div", _hoisted_1$2, [
|
|
695
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.steps, (step, i2) => {
|
|
696
|
+
return openBlock(), createElementBlock(Fragment, {
|
|
697
|
+
key: step.value
|
|
698
|
+
}, [
|
|
699
|
+
createElementVNode("div", {
|
|
700
|
+
class: normalizeClass(["text-nowrap rounded-full border px-4 py-1 text-sm font-semibold", [stepClasses(step, i2), { "cursor-pointer": _ctx.clickable && !step.disabled }]]),
|
|
701
|
+
"data-state": step.value === _ctx.activeStep ? "active" : "inactive",
|
|
702
|
+
onClick: ($event) => emit("click:step", step, i2)
|
|
703
|
+
}, toDisplayString(step.text || unref(startCase)(String(step.value))), 11, _hoisted_2$2),
|
|
704
|
+
i2 < _ctx.steps.length - 1 ? (openBlock(), createElementBlock("div", _hoisted_3$2, [
|
|
705
|
+
createVNode(_sfc_main$5, {
|
|
706
|
+
icon: "material-symbols:arrow-right-alt-rounded",
|
|
707
|
+
class: normalizeClass([activeStepIndex.value <= i2 ? "text-p-gray-30" : "text-p-blue-50"])
|
|
708
|
+
}, null, 8, ["class"])
|
|
709
|
+
])) : createCommentVNode("", true)
|
|
710
|
+
], 64);
|
|
711
|
+
}), 128))
|
|
712
|
+
]);
|
|
661
713
|
};
|
|
662
714
|
}
|
|
663
715
|
});
|
|
@@ -997,29 +1049,29 @@ export {
|
|
|
997
1049
|
_6 as PDatePicker,
|
|
998
1050
|
default5 as PDrawer,
|
|
999
1051
|
default6 as PDropdown,
|
|
1000
|
-
|
|
1001
|
-
_sfc_main$
|
|
1052
|
+
_7 as PDropdownSelect,
|
|
1053
|
+
_sfc_main$4 as PFileUpload,
|
|
1002
1054
|
default11 as PFilterIcon,
|
|
1003
|
-
_sfc_main$
|
|
1004
|
-
|
|
1005
|
-
|
|
1006
|
-
|
|
1007
|
-
|
|
1008
|
-
|
|
1055
|
+
_sfc_main$5 as PIcon,
|
|
1056
|
+
_8 as PInfoIcon,
|
|
1057
|
+
_9 as PInlineDatePicker,
|
|
1058
|
+
_10 as PInput,
|
|
1059
|
+
_11 as PInputNumber,
|
|
1060
|
+
_12 as PInputPercent,
|
|
1009
1061
|
PInputSearch,
|
|
1010
|
-
|
|
1062
|
+
_13 as PLink,
|
|
1011
1063
|
default7 as PLoading,
|
|
1012
1064
|
default8 as PModal,
|
|
1013
|
-
|
|
1014
|
-
|
|
1015
|
-
|
|
1016
|
-
|
|
1017
|
-
|
|
1018
|
-
|
|
1019
|
-
_sfc_main$
|
|
1065
|
+
_14 as PPagination,
|
|
1066
|
+
_15 as PPaginationInfo,
|
|
1067
|
+
_16 as PProgressBar,
|
|
1068
|
+
_17 as PRingLoader,
|
|
1069
|
+
_18 as PSelect,
|
|
1070
|
+
_19 as PSelectBtn,
|
|
1071
|
+
_sfc_main$3 as PSelectList,
|
|
1020
1072
|
default9 as PSelectPill,
|
|
1021
1073
|
default10 as PSkeletonLoader,
|
|
1022
|
-
|
|
1074
|
+
_sfc_main$2 as PSteps,
|
|
1023
1075
|
pTable as PTable,
|
|
1024
1076
|
PTableHeaderCell,
|
|
1025
1077
|
_20 as PTableLoader,
|
package/dist/es/p-steps.js
CHANGED
|
@@ -37,6 +37,7 @@ import PSelectList from './p-select-list/p-select-list.vue';
|
|
|
37
37
|
import { useSelectList } from './p-select-list/useSelectList';
|
|
38
38
|
import PSelectPill from './p-select-pill/p-select-pill.vue';
|
|
39
39
|
import PSkeletonLoader from './p-skeleton-loader/p-skeleton-loader.vue';
|
|
40
|
+
import type { StepItem } from './p-steps/p-steps.types';
|
|
40
41
|
import PSteps from './p-steps/p-steps.vue';
|
|
41
42
|
import { colsInjectionKey, type HeaderCellAttrs, isColsResizableInjectionKey, isFirstColFixedInjectionKey, isLastColFixedInjectionKey, MIN_WIDTH_COL_RESIZE, type TableCol, type ThAttrs } from './p-table/p-table.types';
|
|
42
43
|
import PTable from './p-table/p-table.vue';
|
|
@@ -51,4 +52,4 @@ import PTableTd from './p-table-td/p-table-td.vue';
|
|
|
51
52
|
import PTabs from './p-tabs/p-tabs.vue';
|
|
52
53
|
import PTextarea from './p-textarea/p-textarea.vue';
|
|
53
54
|
import PToggle from './p-toggle/p-toggle.vue';
|
|
54
|
-
export { colsInjectionKey, FileUploadFile, HeaderCellAttrs, isColsResizableInjectionKey, isFirstColFixedInjectionKey, isLastColFixedInjectionKey, MIN_WIDTH_COL_RESIZE, P_ICON_ALIASES, PActionBar, PActionBarAction, PAlert, PAvatar, PBtn, PCard, PCheckbox, PChips, PCloseBtn, PDatePicker, PDrawer, PDropdown, PDropdownSelect, PFileUpload, PFilterIcon, PIcon, PIconAlias, PInfoIcon, PInlineDatePicker, PInput, PInputNumber, PInputPercent, PInputSearch, PLink, PLoading, PModal, PPagination, PPaginationInfo, PProgressBar, PRingLoader, PSelect, PSelectBtn, PSelectList, PSelectPill, PSkeletonLoader, PSteps, PTable, PTableHeaderCell, PTableLoader, PTableSort, PTableTd, PTabs, PTextarea, PToggle, Size, SORTING_TYPES, SortingType, SortingTypeWithoutNoSorting, TableCol, ThAttrs, usePLoading, usePModal, usePTableColResize, usePTableRowVirtualizer, useSelectList, };
|
|
55
|
+
export { colsInjectionKey, FileUploadFile, HeaderCellAttrs, isColsResizableInjectionKey, isFirstColFixedInjectionKey, isLastColFixedInjectionKey, MIN_WIDTH_COL_RESIZE, P_ICON_ALIASES, PActionBar, PActionBarAction, PAlert, PAvatar, PBtn, PCard, PCheckbox, PChips, PCloseBtn, PDatePicker, PDrawer, PDropdown, PDropdownSelect, PFileUpload, PFilterIcon, PIcon, PIconAlias, PInfoIcon, PInlineDatePicker, PInput, PInputNumber, PInputPercent, PInputSearch, PLink, PLoading, PModal, PPagination, PPaginationInfo, PProgressBar, PRingLoader, PSelect, PSelectBtn, PSelectList, PSelectPill, PSkeletonLoader, PSteps, PTable, PTableHeaderCell, PTableLoader, PTableSort, PTableTd, PTabs, PTextarea, PToggle, Size, SORTING_TYPES, SortingType, SortingTypeWithoutNoSorting, StepItem, TableCol, ThAttrs, usePLoading, usePModal, usePTableColResize, usePTableRowVirtualizer, useSelectList, };
|
|
@@ -1,17 +1,16 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
} & Partial<{}>> & import("vue").PublicProps;
|
|
7
|
-
expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
|
|
8
|
-
attrs: any;
|
|
9
|
-
slots: {};
|
|
10
|
-
emit: {};
|
|
11
|
-
}>) => import("vue").VNode & {
|
|
12
|
-
__ctx?: Awaited<typeof __VLS_setup>;
|
|
1
|
+
import type { StepItem } from './p-steps.types';
|
|
2
|
+
type Props = {
|
|
3
|
+
activeStep?: StepItem['value'];
|
|
4
|
+
steps?: readonly StepItem[];
|
|
5
|
+
clickable?: boolean;
|
|
13
6
|
};
|
|
7
|
+
declare const _default: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
8
|
+
"click:step": (step: StepItem, index: number) => any;
|
|
9
|
+
}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
|
|
10
|
+
"onClick:step"?: ((step: StepItem, index: number) => any) | undefined;
|
|
11
|
+
}>, {
|
|
12
|
+
activeStep: StepItem["value"];
|
|
13
|
+
steps: readonly StepItem[];
|
|
14
|
+
clickable: boolean;
|
|
15
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
14
16
|
export default _default;
|
|
15
|
-
type __VLS_PrettifyLocal<T> = {
|
|
16
|
-
[K in keyof T]: T[K];
|
|
17
|
-
} & {};
|