@pequity/squirrel 6.1.0 → 7.0.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/dist/cjs/chunks/p-alert.js +52 -0
- package/dist/cjs/chunks/p-avatar.js +65 -0
- package/dist/cjs/chunks/p-btn.js +4 -4
- package/dist/cjs/chunks/p-date-picker.js +2 -2
- package/dist/cjs/chunks/p-input-number.js +161 -0
- package/dist/cjs/chunks/p-input-percent.js +2 -2
- package/dist/cjs/chunks/p-input.js +111 -0
- package/dist/cjs/chunks/p-progress-bar.js +38 -0
- package/dist/cjs/chunks/p-select-btn.js +3 -4
- package/dist/cjs/chunks/p-textarea.js +89 -0
- package/dist/cjs/index.js +69 -76
- package/dist/cjs/inputClasses.js +8 -2
- package/dist/cjs/p-alert.js +2 -64
- package/dist/cjs/p-avatar.js +2 -70
- package/dist/cjs/p-drawer.js +2 -2
- package/dist/cjs/p-input-number.js +2 -145
- package/dist/cjs/p-input-search.js +2 -2
- package/dist/cjs/p-input.js +2 -92
- package/dist/cjs/p-modal.js +2 -2
- package/dist/cjs/p-progress-bar.js +2 -40
- package/dist/cjs/p-table-filter-icon.js +14 -9
- package/dist/cjs/p-textarea.js +2 -72
- package/dist/cjs/p-toggle.js +76 -64
- package/dist/cjs/useInputClasses.js +13 -18
- package/dist/es/chunks/p-alert.js +53 -0
- package/dist/es/chunks/p-avatar.js +66 -0
- package/dist/es/chunks/p-btn.js +4 -4
- package/dist/es/chunks/p-date-picker.js +2 -2
- package/dist/es/chunks/p-input-number.js +162 -0
- package/dist/es/chunks/p-input-percent.js +2 -2
- package/dist/es/chunks/p-input.js +112 -0
- package/dist/es/chunks/p-progress-bar.js +39 -0
- package/dist/es/chunks/p-select-btn.js +4 -5
- package/dist/es/chunks/p-textarea.js +90 -0
- package/dist/es/index.js +119 -126
- package/dist/es/inputClasses.js +8 -2
- package/dist/es/p-alert.js +2 -64
- package/dist/es/p-avatar.js +2 -70
- package/dist/es/p-drawer.js +2 -2
- package/dist/es/p-input-number.js +2 -145
- package/dist/es/p-input-search.js +2 -2
- package/dist/es/p-input.js +2 -92
- package/dist/es/p-modal.js +2 -2
- package/dist/es/p-progress-bar.js +2 -40
- package/dist/es/p-table-filter-icon.js +14 -9
- package/dist/es/p-textarea.js +2 -72
- package/dist/es/p-toggle.js +77 -65
- package/dist/es/useInputClasses.js +14 -19
- package/dist/squirrel/components/p-alert/p-alert.vue.d.ts +27 -10
- package/dist/squirrel/components/p-avatar/p-avatar.vue.d.ts +9 -10
- package/dist/squirrel/components/p-btn/p-btn.vue.d.ts +28 -28
- package/dist/squirrel/components/p-date-picker/p-date-picker.vue.d.ts +2 -2
- package/dist/squirrel/components/p-drawer/p-drawer.vue.d.ts +37 -13
- package/dist/squirrel/components/p-inline-date-picker/p-inline-date-picker.vue.d.ts +2 -2
- package/dist/squirrel/components/p-input/p-input.vue.d.ts +30 -61
- package/dist/squirrel/components/p-input-number/p-input-number.vue.d.ts +101 -65
- package/dist/squirrel/components/p-input-search/p-input-search.vue.d.ts +113 -83
- package/dist/squirrel/components/p-modal/p-modal.vue.d.ts +2 -2
- package/dist/squirrel/components/p-progress-bar/p-progress-bar.vue.d.ts +5 -20
- package/dist/squirrel/components/p-table-header-cell/p-table-header-cell.vue.d.ts +1 -1
- package/dist/squirrel/components/p-table-loader/p-table-loader.vue.d.ts +1 -1
- package/dist/squirrel/components/p-table-sort/p-table-sort.vue.d.ts +3 -7
- package/dist/squirrel/components/p-textarea/p-textarea.vue.d.ts +79 -42
- package/dist/squirrel/components/p-toggle/p-toggle.vue.d.ts +25 -62
- package/dist/squirrel/composables/useInputClasses.d.ts +2 -1
- package/dist/squirrel/utils/index.d.ts +1 -3
- package/dist/squirrel/utils/inputClasses.d.ts +12 -0
- package/dist/squirrel.css +5 -5
- package/package.json +19 -19
- package/squirrel/components/p-alert/p-alert.spec.js +9 -8
- package/squirrel/components/p-alert/p-alert.vue +19 -31
- package/squirrel/components/p-avatar/p-avatar.spec.ts +10 -3
- package/squirrel/components/p-avatar/p-avatar.vue +40 -42
- package/squirrel/components/p-btn/p-btn.spec.js +7 -7
- package/squirrel/components/p-btn/p-btn.vue +4 -4
- package/squirrel/components/p-input/p-input.vue +63 -40
- package/squirrel/components/p-input-number/p-input-number.vue +101 -86
- package/squirrel/components/p-progress-bar/p-progress-bar.vue +9 -14
- package/squirrel/components/p-select-btn/p-select-btn.spec.js +24 -5
- package/squirrel/components/p-select-btn/p-select-btn.vue +1 -1
- package/squirrel/components/p-table-header-cell/p-table-filter-icon.vue +8 -9
- package/squirrel/components/p-table-sort/p-table-sort.vue +13 -16
- package/squirrel/components/p-textarea/p-textarea.vue +55 -37
- package/squirrel/components/p-toggle/p-toggle.vue +59 -43
- package/squirrel/composables/useInputClasses.spec.js +50 -13
- package/squirrel/composables/useInputClasses.ts +18 -24
- package/squirrel/utils/index.ts +0 -7
- package/squirrel/utils/inputClasses.ts +8 -2
- package/dist/cjs/inputClassesMixin.js +0 -58
- package/dist/cjs/tailwind.js +0 -25
- package/dist/es/inputClassesMixin.js +0 -59
- package/dist/es/tailwind.js +0 -25
- package/dist/squirrel/utils/inputClassesMixin.d.ts +0 -56
- package/dist/squirrel/utils/tailwind.d.ts +0 -8
- package/squirrel/utils/inputClassesMixin.spec.js +0 -241
- package/squirrel/utils/inputClassesMixin.ts +0 -60
- package/squirrel/utils/tailwind.spec.js +0 -27
- package/squirrel/utils/tailwind.ts +0 -28
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
const vue = require("vue");
|
|
3
|
+
const pIcon_vue_vue_type_script_setup_true_lang = require("./p-icon.js");
|
|
4
|
+
const _hoisted_1 = { class: "flex" };
|
|
5
|
+
const _hoisted_2 = { class: "pr-2" };
|
|
6
|
+
const ALERT_TYPES = {
|
|
7
|
+
info: { classes: `bg-info text-on-info`, icon: "streamline:information-circle-solid" },
|
|
8
|
+
warning: { classes: `bg-warning text-on-warning`, icon: "streamline:warning-triangle-solid" },
|
|
9
|
+
error: { classes: `bg-error text-on-error`, icon: "streamline:warning-octagon-solid" },
|
|
10
|
+
success: { classes: `bg-success text-on-success`, icon: "streamline:check-square-solid" }
|
|
11
|
+
};
|
|
12
|
+
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
13
|
+
...{
|
|
14
|
+
name: "PAlert"
|
|
15
|
+
},
|
|
16
|
+
__name: "p-alert",
|
|
17
|
+
props: {
|
|
18
|
+
type: {
|
|
19
|
+
type: String,
|
|
20
|
+
default: "info",
|
|
21
|
+
validator(value) {
|
|
22
|
+
return Object.keys(ALERT_TYPES).includes(value);
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
},
|
|
26
|
+
setup(__props) {
|
|
27
|
+
const props = __props;
|
|
28
|
+
return (_ctx, _cache) => {
|
|
29
|
+
return vue.openBlock(), vue.createElementBlock("div", {
|
|
30
|
+
class: vue.normalizeClass(["rounded p-4 text-xs font-semibold", ALERT_TYPES[props.type].classes]),
|
|
31
|
+
role: "alert"
|
|
32
|
+
}, [
|
|
33
|
+
vue.createElementVNode("div", _hoisted_1, [
|
|
34
|
+
vue.createElementVNode("div", _hoisted_2, [
|
|
35
|
+
vue.renderSlot(_ctx.$slots, "icon", {}, () => [
|
|
36
|
+
vue.createVNode(pIcon_vue_vue_type_script_setup_true_lang._sfc_main, {
|
|
37
|
+
icon: ALERT_TYPES[props.type].icon,
|
|
38
|
+
width: "16",
|
|
39
|
+
class: "-mb-0.5",
|
|
40
|
+
inline: ""
|
|
41
|
+
}, null, 8, ["icon"])
|
|
42
|
+
])
|
|
43
|
+
]),
|
|
44
|
+
vue.createElementVNode("div", null, [
|
|
45
|
+
vue.renderSlot(_ctx.$slots, "default")
|
|
46
|
+
])
|
|
47
|
+
])
|
|
48
|
+
], 2);
|
|
49
|
+
};
|
|
50
|
+
}
|
|
51
|
+
});
|
|
52
|
+
exports._sfc_main = _sfc_main;
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
const vue = require("vue");
|
|
3
|
+
const _hoisted_1 = ["src", "alt"];
|
|
4
|
+
const SHAPES = ["rectangle", "circle"];
|
|
5
|
+
const SHAPE_CLASSES = {
|
|
6
|
+
rectangle: "rounded-lg",
|
|
7
|
+
circle: "rounded-full"
|
|
8
|
+
};
|
|
9
|
+
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
10
|
+
...{
|
|
11
|
+
name: "PAvatar"
|
|
12
|
+
},
|
|
13
|
+
__name: "p-avatar",
|
|
14
|
+
props: {
|
|
15
|
+
shape: {
|
|
16
|
+
type: String,
|
|
17
|
+
default: "circle",
|
|
18
|
+
validator: (value) => SHAPES.includes(value)
|
|
19
|
+
},
|
|
20
|
+
imageSrc: {
|
|
21
|
+
type: String,
|
|
22
|
+
default: ""
|
|
23
|
+
},
|
|
24
|
+
label: {
|
|
25
|
+
type: String,
|
|
26
|
+
required: true
|
|
27
|
+
},
|
|
28
|
+
imageClass: {
|
|
29
|
+
type: String,
|
|
30
|
+
default: ""
|
|
31
|
+
},
|
|
32
|
+
labelClass: {
|
|
33
|
+
type: String,
|
|
34
|
+
default: ""
|
|
35
|
+
}
|
|
36
|
+
},
|
|
37
|
+
setup(__props) {
|
|
38
|
+
const props = __props;
|
|
39
|
+
const imageBroken = vue.ref(false);
|
|
40
|
+
const shapeClass = vue.computed(() => SHAPE_CLASSES[props.shape]);
|
|
41
|
+
vue.watch(
|
|
42
|
+
() => props.imageSrc,
|
|
43
|
+
() => {
|
|
44
|
+
imageBroken.value = false;
|
|
45
|
+
}
|
|
46
|
+
);
|
|
47
|
+
return (_ctx, _cache) => {
|
|
48
|
+
return vue.openBlock(), vue.createElementBlock("div", {
|
|
49
|
+
class: vue.normalizeClass(shapeClass.value)
|
|
50
|
+
}, [
|
|
51
|
+
__props.imageSrc && !imageBroken.value ? (vue.openBlock(), vue.createElementBlock("img", {
|
|
52
|
+
key: 0,
|
|
53
|
+
src: __props.imageSrc,
|
|
54
|
+
alt: __props.label,
|
|
55
|
+
class: vue.normalizeClass(["h-full w-full object-cover", [shapeClass.value, __props.imageClass]]),
|
|
56
|
+
onError: _cache[0] || (_cache[0] = ($event) => imageBroken.value = true)
|
|
57
|
+
}, null, 42, _hoisted_1)) : (vue.openBlock(), vue.createElementBlock("div", {
|
|
58
|
+
key: 1,
|
|
59
|
+
class: vue.normalizeClass(["flex h-full w-full items-center justify-center", [shapeClass.value, __props.labelClass]])
|
|
60
|
+
}, vue.toDisplayString(__props.label), 3))
|
|
61
|
+
], 2);
|
|
62
|
+
};
|
|
63
|
+
}
|
|
64
|
+
});
|
|
65
|
+
exports._sfc_main = _sfc_main;
|
package/dist/cjs/chunks/p-btn.js
CHANGED
|
@@ -45,17 +45,17 @@ const btnClasses = {
|
|
|
45
45
|
},
|
|
46
46
|
size: {
|
|
47
47
|
sm: {
|
|
48
|
-
button: "px-
|
|
48
|
+
button: "px-3 has-[.slot-wrapper:empty]:px-1.5 py-1.5 text-sm leading-5",
|
|
49
49
|
content: "gap-1",
|
|
50
|
-
icon: "text-
|
|
50
|
+
icon: "text-[20px]"
|
|
51
51
|
},
|
|
52
52
|
md: {
|
|
53
|
-
button: "px-6 has-[.slot-wrapper:empty]:px-2 py-2 text-base",
|
|
53
|
+
button: "px-6 has-[.slot-wrapper:empty]:px-2.5 has-[.slot-wrapper:empty]:py-2.5 py-2 text-base",
|
|
54
54
|
content: "gap-2",
|
|
55
55
|
icon: "text-xl"
|
|
56
56
|
},
|
|
57
57
|
lg: {
|
|
58
|
-
button: "px-6 has-[.slot-wrapper:empty]:px-
|
|
58
|
+
button: "px-6 has-[.slot-wrapper:empty]:px-3 py-3 text-lg leading-6",
|
|
59
59
|
content: "gap-2.5",
|
|
60
60
|
icon: "text-2xl"
|
|
61
61
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
const vue = require("vue");
|
|
3
|
-
const
|
|
3
|
+
const pInput_vue_vue_type_script_setup_true_lang = require("./p-input.js");
|
|
4
4
|
const VueDatePicker = require("@vuepic/vue-datepicker");
|
|
5
5
|
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
6
6
|
...{
|
|
@@ -151,7 +151,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
|
151
151
|
class: [{ hidden: _ctx.$attrs.hidden }, _ctx.$attrs.class]
|
|
152
152
|
}, datePickerProps.value), {
|
|
153
153
|
"dp-input": vue.withCtx(({ value, onInput, onEnter, onTab, onFocus, onBlur, onClear }) => [
|
|
154
|
-
vue.createVNode(
|
|
154
|
+
vue.createVNode(pInput_vue_vue_type_script_setup_true_lang._sfc_main, vue.mergeProps({ "model-value": value }, inputPropsAndAttrs.value, {
|
|
155
155
|
onInput: ($event) => handleInput($event, onInput, onClear),
|
|
156
156
|
onKeydown: [
|
|
157
157
|
vue.withKeys(($event) => onEnter($event), ["enter"]),
|
|
@@ -0,0 +1,161 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
const vue = require("vue");
|
|
3
|
+
const pBtn_types = require("./p-btn.types.js");
|
|
4
|
+
const pInfoIcon_vue_vue_type_script_setup_true_lang = require("./p-info-icon.js");
|
|
5
|
+
const useInputClasses = require("../useInputClasses.js");
|
|
6
|
+
const number = require("../number.js");
|
|
7
|
+
const lodashEs = require("lodash-es");
|
|
8
|
+
const vueCurrencyInput = require("vue-currency-input");
|
|
9
|
+
const _hoisted_1 = ["data-has-error"];
|
|
10
|
+
const _hoisted_2 = { class: "flex flex-row items-center" };
|
|
11
|
+
const _hoisted_3 = { class: "relative w-full" };
|
|
12
|
+
const _hoisted_4 = { key: 0 };
|
|
13
|
+
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
14
|
+
...{
|
|
15
|
+
name: "PInputNumber",
|
|
16
|
+
inheritAttrs: false
|
|
17
|
+
},
|
|
18
|
+
__name: "p-input-number",
|
|
19
|
+
props: {
|
|
20
|
+
modelValue: {
|
|
21
|
+
type: [Number, String],
|
|
22
|
+
default: null
|
|
23
|
+
},
|
|
24
|
+
label: {
|
|
25
|
+
type: String,
|
|
26
|
+
default: ""
|
|
27
|
+
},
|
|
28
|
+
errorMsg: {
|
|
29
|
+
type: String,
|
|
30
|
+
default: ""
|
|
31
|
+
},
|
|
32
|
+
required: {
|
|
33
|
+
type: Boolean,
|
|
34
|
+
default: false
|
|
35
|
+
},
|
|
36
|
+
size: {
|
|
37
|
+
type: String,
|
|
38
|
+
default: "md",
|
|
39
|
+
validator(value) {
|
|
40
|
+
return pBtn_types.SIZES.includes(value);
|
|
41
|
+
}
|
|
42
|
+
},
|
|
43
|
+
selectOnClick: {
|
|
44
|
+
type: Boolean,
|
|
45
|
+
default: true
|
|
46
|
+
},
|
|
47
|
+
tooltipText: {
|
|
48
|
+
type: String,
|
|
49
|
+
default: ""
|
|
50
|
+
}
|
|
51
|
+
},
|
|
52
|
+
emits: ["update:modelValue", "change"],
|
|
53
|
+
setup(__props, { expose: __expose, emit: __emit }) {
|
|
54
|
+
const ALL_OPTIONS = [
|
|
55
|
+
"locale",
|
|
56
|
+
"currency",
|
|
57
|
+
"currencyDisplay",
|
|
58
|
+
"hideGroupingSeparatorOnFocus",
|
|
59
|
+
"hideCurrencySymbolOnFocus",
|
|
60
|
+
"hideNegligibleDecimalDigitsOnFocus",
|
|
61
|
+
"precision",
|
|
62
|
+
"autoDecimalDigits",
|
|
63
|
+
"valueRange",
|
|
64
|
+
"useGrouping",
|
|
65
|
+
"valueScaling"
|
|
66
|
+
];
|
|
67
|
+
const emit = __emit;
|
|
68
|
+
const props = __props;
|
|
69
|
+
const slots = vue.useSlots();
|
|
70
|
+
const { labelClasses, inputClasses, errorMsgClasses } = useInputClasses.useInputClasses(
|
|
71
|
+
vue.computed(() => ({
|
|
72
|
+
...props,
|
|
73
|
+
prefix: !!slots.prefix,
|
|
74
|
+
suffix: !!slots.suffix
|
|
75
|
+
}))
|
|
76
|
+
);
|
|
77
|
+
const attrs = vue.useAttrs();
|
|
78
|
+
const DEFAULTS = {
|
|
79
|
+
locale: "en-US",
|
|
80
|
+
currency: "USD",
|
|
81
|
+
precision: 0,
|
|
82
|
+
currencyDisplay: "hidden"
|
|
83
|
+
};
|
|
84
|
+
const inputCurrencyOptions = vue.computed(() => {
|
|
85
|
+
ALL_OPTIONS.forEach((key) => {
|
|
86
|
+
const attr = attrs[lodashEs.kebabCase(key)];
|
|
87
|
+
if (attr && typeof attr !== "undefined") {
|
|
88
|
+
DEFAULTS[key] = attr;
|
|
89
|
+
}
|
|
90
|
+
});
|
|
91
|
+
return DEFAULTS;
|
|
92
|
+
});
|
|
93
|
+
const { inputRef, numberValue, setValue } = vueCurrencyInput.useCurrencyInput(
|
|
94
|
+
inputCurrencyOptions.value,
|
|
95
|
+
false
|
|
96
|
+
);
|
|
97
|
+
vue.watch(numberValue, (value) => {
|
|
98
|
+
emit("update:modelValue", number.toNumberOrNull(value));
|
|
99
|
+
});
|
|
100
|
+
vue.watch(
|
|
101
|
+
() => props.modelValue,
|
|
102
|
+
(value) => {
|
|
103
|
+
setValue(number.toNumberOrNull(value));
|
|
104
|
+
}
|
|
105
|
+
);
|
|
106
|
+
const computedAttrs = vue.computed(() => {
|
|
107
|
+
const { class: classes, style: style2, ...rest } = attrs;
|
|
108
|
+
return rest;
|
|
109
|
+
});
|
|
110
|
+
const style = vue.computed(() => {
|
|
111
|
+
return attrs.style;
|
|
112
|
+
});
|
|
113
|
+
const focus = () => {
|
|
114
|
+
props.selectOnClick && inputRef.value.select();
|
|
115
|
+
};
|
|
116
|
+
__expose({ setValue });
|
|
117
|
+
return (_ctx, _cache) => {
|
|
118
|
+
return vue.openBlock(), vue.createElementBlock("div", {
|
|
119
|
+
class: vue.normalizeClass([{ hidden: _ctx.$attrs.hidden }, _ctx.$attrs.class]),
|
|
120
|
+
"data-has-error": !!__props.errorMsg,
|
|
121
|
+
style: vue.normalizeStyle(style.value)
|
|
122
|
+
}, [
|
|
123
|
+
vue.createElementVNode("div", _hoisted_2, [
|
|
124
|
+
vue.renderSlot(_ctx.$slots, "label", {
|
|
125
|
+
label: __props.label,
|
|
126
|
+
labelClasses: vue.unref(labelClasses)
|
|
127
|
+
}, () => [
|
|
128
|
+
__props.label ? (vue.openBlock(), vue.createElementBlock("label", {
|
|
129
|
+
key: 0,
|
|
130
|
+
class: vue.normalizeClass(vue.unref(labelClasses))
|
|
131
|
+
}, vue.toDisplayString(__props.label), 3)) : vue.createCommentVNode("", true)
|
|
132
|
+
]),
|
|
133
|
+
__props.tooltipText ? (vue.openBlock(), vue.createBlock(pInfoIcon_vue_vue_type_script_setup_true_lang._sfc_main, {
|
|
134
|
+
key: 0,
|
|
135
|
+
text: __props.tooltipText,
|
|
136
|
+
class: "ml-1"
|
|
137
|
+
}, null, 8, ["text"])) : vue.createCommentVNode("", true)
|
|
138
|
+
]),
|
|
139
|
+
vue.createElementVNode("div", _hoisted_3, [
|
|
140
|
+
!!_ctx.$slots.prefix ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4, [
|
|
141
|
+
vue.renderSlot(_ctx.$slots, "prefix")
|
|
142
|
+
])) : vue.createCommentVNode("", true),
|
|
143
|
+
vue.createElementVNode("input", vue.mergeProps({
|
|
144
|
+
ref_key: "inputRef",
|
|
145
|
+
ref: inputRef,
|
|
146
|
+
type: "text"
|
|
147
|
+
}, computedAttrs.value, {
|
|
148
|
+
class: vue.unref(inputClasses),
|
|
149
|
+
onFocus: focus
|
|
150
|
+
}), null, 16)
|
|
151
|
+
]),
|
|
152
|
+
vue.withDirectives(vue.createElementVNode("div", {
|
|
153
|
+
class: vue.normalizeClass(vue.unref(errorMsgClasses))
|
|
154
|
+
}, vue.toDisplayString(__props.errorMsg), 3), [
|
|
155
|
+
[vue.vShow, __props.errorMsg]
|
|
156
|
+
])
|
|
157
|
+
], 14, _hoisted_1);
|
|
158
|
+
};
|
|
159
|
+
}
|
|
160
|
+
});
|
|
161
|
+
exports._sfc_main = _sfc_main;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
const vue = require("vue");
|
|
3
|
-
const
|
|
3
|
+
const pInputNumber_vue_vue_type_script_setup_true_lang = require("./p-input-number.js");
|
|
4
4
|
const lodashEs = require("lodash-es");
|
|
5
5
|
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
6
6
|
...{
|
|
@@ -31,7 +31,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
|
31
31
|
set: (nV) => emit("update:modelValue", lodashEs.isNumber(nV) ? nV / 100 : nV)
|
|
32
32
|
});
|
|
33
33
|
return (_ctx, _cache) => {
|
|
34
|
-
return vue.openBlock(), vue.createBlock(
|
|
34
|
+
return vue.openBlock(), vue.createBlock(pInputNumber_vue_vue_type_script_setup_true_lang._sfc_main, {
|
|
35
35
|
modelValue: convertedValue.value,
|
|
36
36
|
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => convertedValue.value = $event),
|
|
37
37
|
size: __props.size
|
|
@@ -0,0 +1,111 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
const vue = require("vue");
|
|
3
|
+
const pBtn_types = require("./p-btn.types.js");
|
|
4
|
+
const useInputClasses = require("../useInputClasses.js");
|
|
5
|
+
const _hoisted_1 = ["data-has-error"];
|
|
6
|
+
const _hoisted_2 = { class: "relative w-full" };
|
|
7
|
+
const _hoisted_3 = { key: 0 };
|
|
8
|
+
const _hoisted_4 = ["type", "value"];
|
|
9
|
+
const _hoisted_5 = { key: 1 };
|
|
10
|
+
const INPUT_TYPES = { TEXT: "text", PASSWORD: "password" };
|
|
11
|
+
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
12
|
+
...{
|
|
13
|
+
name: "PInput",
|
|
14
|
+
inheritAttrs: false
|
|
15
|
+
},
|
|
16
|
+
__name: "p-input",
|
|
17
|
+
props: {
|
|
18
|
+
modelValue: {
|
|
19
|
+
type: [String, Number, Boolean, null],
|
|
20
|
+
default: ""
|
|
21
|
+
},
|
|
22
|
+
type: {
|
|
23
|
+
type: String,
|
|
24
|
+
default: INPUT_TYPES.TEXT,
|
|
25
|
+
validator(value) {
|
|
26
|
+
return Object.values(INPUT_TYPES).includes(value);
|
|
27
|
+
}
|
|
28
|
+
},
|
|
29
|
+
label: {
|
|
30
|
+
type: String,
|
|
31
|
+
default: ""
|
|
32
|
+
},
|
|
33
|
+
errorMsg: {
|
|
34
|
+
type: String,
|
|
35
|
+
default: ""
|
|
36
|
+
},
|
|
37
|
+
required: {
|
|
38
|
+
type: Boolean,
|
|
39
|
+
default: false
|
|
40
|
+
},
|
|
41
|
+
size: {
|
|
42
|
+
type: String,
|
|
43
|
+
default: "md",
|
|
44
|
+
validator(value) {
|
|
45
|
+
return pBtn_types.SIZES.includes(value);
|
|
46
|
+
}
|
|
47
|
+
},
|
|
48
|
+
rounded: {
|
|
49
|
+
type: Boolean,
|
|
50
|
+
default: false
|
|
51
|
+
}
|
|
52
|
+
},
|
|
53
|
+
emits: ["update:modelValue"],
|
|
54
|
+
setup(__props) {
|
|
55
|
+
const props = __props;
|
|
56
|
+
const slots = vue.useSlots();
|
|
57
|
+
const { labelClasses, inputClasses, errorMsgClasses } = useInputClasses.useInputClasses(
|
|
58
|
+
vue.computed(() => ({
|
|
59
|
+
...props,
|
|
60
|
+
prefix: !!slots.prefix,
|
|
61
|
+
suffix: !!slots.suffix
|
|
62
|
+
}))
|
|
63
|
+
);
|
|
64
|
+
const allAttrs = vue.useAttrs();
|
|
65
|
+
const attrs = vue.computed(() => {
|
|
66
|
+
const { class: classes, style: style2, ...rest } = allAttrs;
|
|
67
|
+
return rest;
|
|
68
|
+
});
|
|
69
|
+
const style = vue.computed(() => {
|
|
70
|
+
return allAttrs.style;
|
|
71
|
+
});
|
|
72
|
+
return (_ctx, _cache) => {
|
|
73
|
+
return vue.openBlock(), vue.createElementBlock("div", {
|
|
74
|
+
class: vue.normalizeClass([{ hidden: _ctx.$attrs.hidden }, _ctx.$attrs.class]),
|
|
75
|
+
"data-has-error": !!__props.errorMsg,
|
|
76
|
+
style: vue.normalizeStyle(style.value)
|
|
77
|
+
}, [
|
|
78
|
+
vue.renderSlot(_ctx.$slots, "label", {
|
|
79
|
+
label: __props.label,
|
|
80
|
+
labelClasses: vue.unref(labelClasses)
|
|
81
|
+
}, () => [
|
|
82
|
+
__props.label ? (vue.openBlock(), vue.createElementBlock("label", {
|
|
83
|
+
key: 0,
|
|
84
|
+
class: vue.normalizeClass(vue.unref(labelClasses))
|
|
85
|
+
}, vue.toDisplayString(__props.label), 3)) : vue.createCommentVNode("", true)
|
|
86
|
+
]),
|
|
87
|
+
vue.createElementVNode("div", _hoisted_2, [
|
|
88
|
+
!!_ctx.$slots.prefix ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3, [
|
|
89
|
+
vue.renderSlot(_ctx.$slots, "prefix")
|
|
90
|
+
])) : vue.createCommentVNode("", true),
|
|
91
|
+
vue.createElementVNode("input", vue.mergeProps({
|
|
92
|
+
type: __props.type,
|
|
93
|
+
value: __props.modelValue
|
|
94
|
+
}, attrs.value, {
|
|
95
|
+
class: vue.unref(inputClasses),
|
|
96
|
+
onInput: _cache[0] || (_cache[0] = (event) => _ctx.$emit("update:modelValue", event.target.value))
|
|
97
|
+
}), null, 16, _hoisted_4),
|
|
98
|
+
!!_ctx.$slots.suffix ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5, [
|
|
99
|
+
vue.renderSlot(_ctx.$slots, "suffix")
|
|
100
|
+
])) : vue.createCommentVNode("", true)
|
|
101
|
+
]),
|
|
102
|
+
vue.withDirectives(vue.createElementVNode("div", {
|
|
103
|
+
class: vue.normalizeClass(vue.unref(errorMsgClasses))
|
|
104
|
+
}, vue.toDisplayString(__props.errorMsg), 3), [
|
|
105
|
+
[vue.vShow, __props.errorMsg]
|
|
106
|
+
])
|
|
107
|
+
], 14, _hoisted_1);
|
|
108
|
+
};
|
|
109
|
+
}
|
|
110
|
+
});
|
|
111
|
+
exports._sfc_main = _sfc_main;
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
const vue = require("vue");
|
|
3
|
+
const _hoisted_1 = {
|
|
4
|
+
class: "flex justify-start overflow-hidden rounded bg-p-blue-20",
|
|
5
|
+
role: "progressbar"
|
|
6
|
+
};
|
|
7
|
+
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
8
|
+
...{
|
|
9
|
+
name: "PProgressBar"
|
|
10
|
+
},
|
|
11
|
+
__name: "p-progress-bar",
|
|
12
|
+
props: {
|
|
13
|
+
total: {},
|
|
14
|
+
items: {}
|
|
15
|
+
},
|
|
16
|
+
setup(__props) {
|
|
17
|
+
return (_ctx, _cache) => {
|
|
18
|
+
const _directive_tooltip = vue.resolveDirective("tooltip");
|
|
19
|
+
return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
|
|
20
|
+
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.items, (item) => {
|
|
21
|
+
return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
|
|
22
|
+
key: `progress-value-${item.color}`,
|
|
23
|
+
class: "h-full",
|
|
24
|
+
style: vue.normalizeStyle({ width: `${item.value / _ctx.total * 100}%`, background: item.color })
|
|
25
|
+
}, null, 4)), [
|
|
26
|
+
[
|
|
27
|
+
_directive_tooltip,
|
|
28
|
+
item.label,
|
|
29
|
+
void 0,
|
|
30
|
+
{ top: true }
|
|
31
|
+
]
|
|
32
|
+
]);
|
|
33
|
+
}), 128))
|
|
34
|
+
]);
|
|
35
|
+
};
|
|
36
|
+
}
|
|
37
|
+
});
|
|
38
|
+
exports._sfc_main = _sfc_main;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
const vue = require("vue");
|
|
3
3
|
const pBtn_vue_vue_type_script_setup_true_lang = require("./p-btn.js");
|
|
4
|
+
const _hoisted_1 = { class: "flex" };
|
|
4
5
|
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
5
6
|
...{
|
|
6
7
|
name: "PSelectBtn"
|
|
@@ -58,9 +59,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
|
58
59
|
};
|
|
59
60
|
return (_ctx, _cache) => {
|
|
60
61
|
const _directive_tooltip = vue.resolveDirective("tooltip");
|
|
61
|
-
return vue.openBlock(), vue.createElementBlock("div",
|
|
62
|
-
class: vue.normalizeClass({ flex: _ctx.grow })
|
|
63
|
-
}, [
|
|
62
|
+
return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
|
|
64
63
|
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.items, (item, index) => {
|
|
65
64
|
return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
|
|
66
65
|
key: String(item[_ctx.itemValue]),
|
|
@@ -95,7 +94,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
|
95
94
|
[_directive_tooltip, { content: tooltipText(item) }]
|
|
96
95
|
]);
|
|
97
96
|
}), 128))
|
|
98
|
-
]
|
|
97
|
+
]);
|
|
99
98
|
};
|
|
100
99
|
}
|
|
101
100
|
});
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
const vue = require("vue");
|
|
3
|
+
const pBtn_types = require("./p-btn.types.js");
|
|
4
|
+
const useInputClasses = require("../useInputClasses.js");
|
|
5
|
+
const _hoisted_1 = ["data-has-error"];
|
|
6
|
+
const _hoisted_2 = ["value"];
|
|
7
|
+
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
8
|
+
...{
|
|
9
|
+
name: "PTextarea",
|
|
10
|
+
inheritAttrs: false
|
|
11
|
+
},
|
|
12
|
+
__name: "p-textarea",
|
|
13
|
+
props: {
|
|
14
|
+
modelValue: {
|
|
15
|
+
type: [String, Number, null],
|
|
16
|
+
default: ""
|
|
17
|
+
},
|
|
18
|
+
label: {
|
|
19
|
+
type: String,
|
|
20
|
+
default: ""
|
|
21
|
+
},
|
|
22
|
+
errorMsg: {
|
|
23
|
+
type: String,
|
|
24
|
+
default: ""
|
|
25
|
+
},
|
|
26
|
+
required: {
|
|
27
|
+
type: Boolean,
|
|
28
|
+
default: false
|
|
29
|
+
},
|
|
30
|
+
size: {
|
|
31
|
+
type: String,
|
|
32
|
+
default: "md",
|
|
33
|
+
validator(value) {
|
|
34
|
+
return pBtn_types.SIZES.includes(value);
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
},
|
|
38
|
+
emits: ["update:modelValue"],
|
|
39
|
+
setup(__props, { emit: __emit }) {
|
|
40
|
+
const emit = __emit;
|
|
41
|
+
const props = __props;
|
|
42
|
+
const { labelClasses, textareaClasses, errorMsgClasses } = useInputClasses.useInputClasses(
|
|
43
|
+
vue.computed(() => ({
|
|
44
|
+
required: props.required,
|
|
45
|
+
errorMsg: props.errorMsg,
|
|
46
|
+
size: props.size
|
|
47
|
+
}))
|
|
48
|
+
);
|
|
49
|
+
const allAttrs = vue.useAttrs();
|
|
50
|
+
const attrs = vue.computed(() => {
|
|
51
|
+
const { class: classes, style: style2, ...rest } = allAttrs;
|
|
52
|
+
return rest;
|
|
53
|
+
});
|
|
54
|
+
const style = vue.computed(() => {
|
|
55
|
+
return allAttrs.style;
|
|
56
|
+
});
|
|
57
|
+
const updateValue = (e) => {
|
|
58
|
+
const target = e.target;
|
|
59
|
+
emit("update:modelValue", target.value);
|
|
60
|
+
};
|
|
61
|
+
return (_ctx, _cache) => {
|
|
62
|
+
return vue.openBlock(), vue.createElementBlock("div", {
|
|
63
|
+
class: vue.normalizeClass([{ hidden: _ctx.$attrs.hidden }, _ctx.$attrs.class]),
|
|
64
|
+
"data-has-error": !!__props.errorMsg,
|
|
65
|
+
style: vue.normalizeStyle(style.value)
|
|
66
|
+
}, [
|
|
67
|
+
vue.renderSlot(_ctx.$slots, "label", {
|
|
68
|
+
label: __props.label,
|
|
69
|
+
labelClasses: vue.unref(labelClasses)
|
|
70
|
+
}, () => [
|
|
71
|
+
__props.label ? (vue.openBlock(), vue.createElementBlock("label", {
|
|
72
|
+
key: 0,
|
|
73
|
+
class: vue.normalizeClass(vue.unref(labelClasses))
|
|
74
|
+
}, vue.toDisplayString(__props.label), 3)) : vue.createCommentVNode("", true)
|
|
75
|
+
]),
|
|
76
|
+
vue.createElementVNode("textarea", vue.mergeProps({ value: __props.modelValue }, attrs.value, {
|
|
77
|
+
class: vue.unref(textareaClasses),
|
|
78
|
+
onInput: updateValue
|
|
79
|
+
}), " ", 16, _hoisted_2),
|
|
80
|
+
vue.withDirectives(vue.createElementVNode("div", {
|
|
81
|
+
class: vue.normalizeClass(vue.unref(errorMsgClasses))
|
|
82
|
+
}, vue.toDisplayString(__props.errorMsg), 3), [
|
|
83
|
+
[vue.vShow, __props.errorMsg]
|
|
84
|
+
])
|
|
85
|
+
], 14, _hoisted_1);
|
|
86
|
+
};
|
|
87
|
+
}
|
|
88
|
+
});
|
|
89
|
+
exports._sfc_main = _sfc_main;
|