@youcan/celeste 0.6.31 → 0.6.33
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/celeste.css +570 -475
- package/dist/cjs/chunks/index.js +95 -0
- package/dist/cjs/chunks/sonner.js +2 -1
- package/dist/cjs/index.js +72 -0
- package/dist/cjs/progress-bar.js +84 -0
- package/dist/cjs/progress-circle.js +92 -0
- package/dist/cjs/sonner-alert.js +2 -2
- package/dist/components/index.d.ts +1 -0
- package/dist/components/progress/index.d.ts +4 -0
- package/dist/components/progress/progress-bar.d.ts +31 -0
- package/dist/components/progress/progress-circle.d.ts +27 -0
- package/dist/es/chunks/index.js +110 -15
- package/dist/es/chunks/sonner.js +3 -2
- package/dist/es/index.js +77 -5
- package/dist/es/progress-bar.js +85 -0
- package/dist/es/progress-circle.js +93 -0
- package/dist/es/select-content.js +1 -1
- package/dist/es/select-item.js +1 -1
- package/dist/es/select-trigger.js +1 -1
- package/dist/es/select-value.js +1 -1
- package/dist/es/sonner-alert.js +2 -2
- package/dist/es/tooltip.js +1 -1
- package/dist/index.d.ts +1 -0
- package/package.json +3 -3
- package/src/components/dropdown-menu/dropdown-menu-content.vue +2 -1
- package/src/components/index.ts +1 -0
- package/src/components/progress/index.ts +5 -0
- package/src/components/progress/progress-bar.vue +167 -0
- package/src/components/progress/progress-circle.vue +126 -0
- package/src/components/progress/stories/progress-bar.stories.ts +328 -0
- package/src/components/progress/stories/progress-circular.stories.ts +152 -0
- package/src/index.ts +1 -0
package/dist/cjs/chunks/index.js
CHANGED
|
@@ -6423,6 +6423,99 @@ const [Nt, Xc] = Q("PopoverRoot"), ys = /* @__PURE__ */ Mo.defineComponent({
|
|
|
6423
6423
|
_: 3
|
|
6424
6424
|
}, 8, ["type", "as", "as-child"]));
|
|
6425
6425
|
}
|
|
6426
|
+
}), da = 100, [Qc, ef] = Q("ProgressRoot"), Po = (a2) => typeof a2 == "number";
|
|
6427
|
+
function tf(a2, t) {
|
|
6428
|
+
return vt(a2) || Po(a2) && !Number.isNaN(a2) && a2 <= t && a2 >= 0 ? a2 : (console.error(`Invalid prop \`value\` of value \`${a2}\` supplied to \`ProgressRoot\`. The \`value\` prop must be:
|
|
6429
|
+
- a positive number
|
|
6430
|
+
- less than the value passed to \`max\` (or ${da} if no \`max\` prop is set)
|
|
6431
|
+
- \`null\` or \`undefined\` if the progress is indeterminate.
|
|
6432
|
+
|
|
6433
|
+
Defaulting to \`null\`.`), null);
|
|
6434
|
+
}
|
|
6435
|
+
function af(a2) {
|
|
6436
|
+
return Po(a2) && !Number.isNaN(a2) && a2 > 0 ? a2 : (console.error(
|
|
6437
|
+
`Invalid prop \`max\` of value \`${a2}\` supplied to \`ProgressRoot\`. Only numbers greater than 0 are valid max values. Defaulting to \`${da}\`.`
|
|
6438
|
+
), da);
|
|
6439
|
+
}
|
|
6440
|
+
const By = /* @__PURE__ */ Mo.defineComponent({
|
|
6441
|
+
__name: "ProgressRoot",
|
|
6442
|
+
props: {
|
|
6443
|
+
modelValue: {},
|
|
6444
|
+
max: { default: da },
|
|
6445
|
+
getValueLabel: { type: Function, default: (a2, t) => `${Math.round(a2 / t * da)}%` },
|
|
6446
|
+
asChild: { type: Boolean },
|
|
6447
|
+
as: {}
|
|
6448
|
+
},
|
|
6449
|
+
emits: ["update:modelValue", "update:max"],
|
|
6450
|
+
setup(a2, { emit: t }) {
|
|
6451
|
+
const e = a2, n = t;
|
|
6452
|
+
R();
|
|
6453
|
+
const l = ne(e, "modelValue", n, {
|
|
6454
|
+
passive: e.modelValue === void 0
|
|
6455
|
+
}), s = ne(e, "max", n, {
|
|
6456
|
+
passive: e.max === void 0
|
|
6457
|
+
});
|
|
6458
|
+
Mo.watch(
|
|
6459
|
+
() => l.value,
|
|
6460
|
+
async (i) => {
|
|
6461
|
+
const u = tf(i, e.max);
|
|
6462
|
+
u !== i && (await Mo.nextTick(), l.value = u);
|
|
6463
|
+
},
|
|
6464
|
+
{ immediate: true }
|
|
6465
|
+
), Mo.watch(
|
|
6466
|
+
() => e.max,
|
|
6467
|
+
(i) => {
|
|
6468
|
+
const u = af(e.max);
|
|
6469
|
+
u !== i && (s.value = u);
|
|
6470
|
+
},
|
|
6471
|
+
{ immediate: true }
|
|
6472
|
+
);
|
|
6473
|
+
const r = Mo.computed(() => vt(l.value) ? "indeterminate" : l.value === s.value ? "complete" : "loading");
|
|
6474
|
+
return ef({
|
|
6475
|
+
modelValue: l,
|
|
6476
|
+
max: s,
|
|
6477
|
+
progressState: r
|
|
6478
|
+
}), (i, u) => (Mo.openBlock(), Mo.createBlock(Mo.unref(O), {
|
|
6479
|
+
"as-child": i.asChild,
|
|
6480
|
+
as: i.as,
|
|
6481
|
+
"aria-valuemax": Mo.unref(s),
|
|
6482
|
+
"aria-valuemin": 0,
|
|
6483
|
+
"aria-valuenow": Po(Mo.unref(l)) ? Mo.unref(l) : void 0,
|
|
6484
|
+
"aria-valuetext": i.getValueLabel(Mo.unref(l), Mo.unref(s)),
|
|
6485
|
+
"aria-label": i.getValueLabel(Mo.unref(l), Mo.unref(s)),
|
|
6486
|
+
role: "progressbar",
|
|
6487
|
+
"data-state": r.value,
|
|
6488
|
+
"data-value": Mo.unref(l) ?? void 0,
|
|
6489
|
+
"data-max": Mo.unref(s)
|
|
6490
|
+
}, {
|
|
6491
|
+
default: Mo.withCtx(() => [
|
|
6492
|
+
Mo.renderSlot(i.$slots, "default", { modelValue: Mo.unref(l) })
|
|
6493
|
+
]),
|
|
6494
|
+
_: 3
|
|
6495
|
+
}, 8, ["as-child", "as", "aria-valuemax", "aria-valuenow", "aria-valuetext", "aria-label", "data-state", "data-value", "data-max"]));
|
|
6496
|
+
}
|
|
6497
|
+
}), Iy = /* @__PURE__ */ Mo.defineComponent({
|
|
6498
|
+
__name: "ProgressIndicator",
|
|
6499
|
+
props: {
|
|
6500
|
+
asChild: { type: Boolean },
|
|
6501
|
+
as: {}
|
|
6502
|
+
},
|
|
6503
|
+
setup(a2) {
|
|
6504
|
+
const t = a2, e = Qc();
|
|
6505
|
+
return R(), (n, l) => {
|
|
6506
|
+
var s;
|
|
6507
|
+
return Mo.openBlock(), Mo.createBlock(Mo.unref(O), Mo.mergeProps(t, {
|
|
6508
|
+
"data-state": Mo.unref(e).progressState.value,
|
|
6509
|
+
"data-value": ((s = Mo.unref(e).modelValue) == null ? void 0 : s.value) ?? void 0,
|
|
6510
|
+
"data-max": Mo.unref(e).max.value
|
|
6511
|
+
}), {
|
|
6512
|
+
default: Mo.withCtx(() => [
|
|
6513
|
+
Mo.renderSlot(n.$slots, "default")
|
|
6514
|
+
]),
|
|
6515
|
+
_: 3
|
|
6516
|
+
}, 16, ["data-state", "data-value", "data-max"]);
|
|
6517
|
+
};
|
|
6518
|
+
}
|
|
6426
6519
|
});
|
|
6427
6520
|
const [He, Pf] = Q("ScrollAreaRoot"), Oy = /* @__PURE__ */ Mo.defineComponent({
|
|
6428
6521
|
__name: "ScrollAreaRoot",
|
|
@@ -9210,6 +9303,7 @@ const av = /* @__PURE__ */ Mo.defineComponent({
|
|
|
9210
9303
|
}
|
|
9211
9304
|
});
|
|
9212
9305
|
exports.At = At;
|
|
9306
|
+
exports.By = By;
|
|
9213
9307
|
exports.Cg = Cg;
|
|
9214
9308
|
exports.Ch = Ch;
|
|
9215
9309
|
exports.Du = Du;
|
|
@@ -9220,6 +9314,7 @@ exports.Gl = Gl;
|
|
|
9220
9314
|
exports.Gy = Gy;
|
|
9221
9315
|
exports.Hg = Hg;
|
|
9222
9316
|
exports.Hv = Hv;
|
|
9317
|
+
exports.Iy = Iy;
|
|
9223
9318
|
exports.Jv = Jv;
|
|
9224
9319
|
exports.Kg = Kg;
|
|
9225
9320
|
exports.Kv = Kv;
|
|
@@ -248,7 +248,7 @@ const isHttpResponse = (data) => {
|
|
|
248
248
|
const basicToast = toastFunction;
|
|
249
249
|
const getHistory = () => ToastState.toasts;
|
|
250
250
|
const getToasts = () => ToastState.getActiveToasts();
|
|
251
|
-
Object.assign(basicToast, {
|
|
251
|
+
const toast = Object.assign(basicToast, {
|
|
252
252
|
success: ToastState.success,
|
|
253
253
|
info: ToastState.info,
|
|
254
254
|
warning: ToastState.warning,
|
|
@@ -1151,3 +1151,4 @@ const _sfc_main = /* @__PURE__ */ Mo.defineComponent({
|
|
|
1151
1151
|
}
|
|
1152
1152
|
});
|
|
1153
1153
|
exports._sfc_main = _sfc_main;
|
|
1154
|
+
exports.toast = toast;
|
package/dist/cjs/index.js
CHANGED
|
@@ -46,6 +46,8 @@ const modal_vue_vue_type_script_setup_true_lang = require("./chunks/modal.js");
|
|
|
46
46
|
const popoverContent = require("./popover-content.js");
|
|
47
47
|
const popoverTrigger = require("./popover-trigger.js");
|
|
48
48
|
const popover_vue_vue_type_script_setup_true_lang = require("./chunks/popover.js");
|
|
49
|
+
const progressBar = require("./progress-bar.js");
|
|
50
|
+
const progressCircle = require("./progress-circle.js");
|
|
49
51
|
const richEditor = require("./rich-editor.js");
|
|
50
52
|
const scrollArea_vue_vue_type_script_setup_true_lang = require("./chunks/scroll-area.js");
|
|
51
53
|
const segmentedControlItem = require("./segmented-control-item.js");
|
|
@@ -72,6 +74,9 @@ const textInputButton = require("./text-input-button.js");
|
|
|
72
74
|
const textInput = require("./text-input.js");
|
|
73
75
|
const textarea = require("./textarea.js");
|
|
74
76
|
const tooltip = require("./tooltip.js");
|
|
77
|
+
const color = require("./color.js");
|
|
78
|
+
const crypto = require("./crypto.js");
|
|
79
|
+
const Mo = require("vue");
|
|
75
80
|
const components = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
76
81
|
__proto__: null,
|
|
77
82
|
Alert: alert,
|
|
@@ -118,6 +123,8 @@ const components = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePr
|
|
|
118
123
|
Popover: popover_vue_vue_type_script_setup_true_lang._sfc_main,
|
|
119
124
|
PopoverContent: popoverContent,
|
|
120
125
|
PopoverTrigger: popoverTrigger,
|
|
126
|
+
ProgressBar: progressBar,
|
|
127
|
+
ProgressCircle: progressCircle,
|
|
121
128
|
RichEditor: richEditor,
|
|
122
129
|
ScrollArea: scrollArea_vue_vue_type_script_setup_true_lang._sfc_main,
|
|
123
130
|
SegmentedControl: segmentedControl,
|
|
@@ -147,6 +154,55 @@ const components = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePr
|
|
|
147
154
|
Textarea: textarea,
|
|
148
155
|
Tooltip: tooltip
|
|
149
156
|
}, Symbol.toStringTag, { value: "Module" }));
|
|
157
|
+
function createToast(title, data) {
|
|
158
|
+
const {
|
|
159
|
+
state = "success",
|
|
160
|
+
variant = "stroke",
|
|
161
|
+
size = "lg",
|
|
162
|
+
dismissable = true,
|
|
163
|
+
...externalToastProps
|
|
164
|
+
} = data || {};
|
|
165
|
+
let toastId;
|
|
166
|
+
const dismissToast = () => {
|
|
167
|
+
sonner_vue_vue_type_script_setup_true_lang.toast.dismiss(toastId);
|
|
168
|
+
};
|
|
169
|
+
toastId = sonner_vue_vue_type_script_setup_true_lang.toast.custom(Mo.markRaw(sonnerAlert), {
|
|
170
|
+
...externalToastProps,
|
|
171
|
+
componentProps: {
|
|
172
|
+
title,
|
|
173
|
+
description: data == null ? void 0 : data.description,
|
|
174
|
+
state,
|
|
175
|
+
variant,
|
|
176
|
+
size,
|
|
177
|
+
dismissable,
|
|
178
|
+
onDismiss: dismissToast
|
|
179
|
+
}
|
|
180
|
+
});
|
|
181
|
+
return toastId;
|
|
182
|
+
}
|
|
183
|
+
const toast = Object.assign(createToast, {
|
|
184
|
+
success: (title, data) => {
|
|
185
|
+
return createToast(title, { ...data, state: "success" });
|
|
186
|
+
},
|
|
187
|
+
error: (title, data) => {
|
|
188
|
+
return createToast(title, { ...data, state: "error" });
|
|
189
|
+
},
|
|
190
|
+
warning: (title, data) => {
|
|
191
|
+
return createToast(title, { ...data, state: "warning" });
|
|
192
|
+
},
|
|
193
|
+
info: (title, data) => {
|
|
194
|
+
return createToast(title, { ...data, state: "information" });
|
|
195
|
+
},
|
|
196
|
+
feature: (title, data) => {
|
|
197
|
+
return createToast(title, { ...data, state: "feature" });
|
|
198
|
+
},
|
|
199
|
+
dismiss: (id) => {
|
|
200
|
+
sonner_vue_vue_type_script_setup_true_lang.toast.dismiss(id);
|
|
201
|
+
},
|
|
202
|
+
loading: (title, data) => {
|
|
203
|
+
return sonner_vue_vue_type_script_setup_true_lang.toast.loading(title, data);
|
|
204
|
+
}
|
|
205
|
+
});
|
|
150
206
|
const Celeste = {
|
|
151
207
|
install(vue) {
|
|
152
208
|
Object.entries(components).forEach(([name, component]) => {
|
|
@@ -200,6 +256,8 @@ exports.Modal = modal_vue_vue_type_script_setup_true_lang._sfc_main;
|
|
|
200
256
|
exports.PopoverContent = popoverContent;
|
|
201
257
|
exports.PopoverTrigger = popoverTrigger;
|
|
202
258
|
exports.Popover = popover_vue_vue_type_script_setup_true_lang._sfc_main;
|
|
259
|
+
exports.ProgressBar = progressBar;
|
|
260
|
+
exports.ProgressCircle = progressCircle;
|
|
203
261
|
exports.RichEditor = richEditor;
|
|
204
262
|
exports.ScrollArea = scrollArea_vue_vue_type_script_setup_true_lang._sfc_main;
|
|
205
263
|
exports.SegmentedControlItem = segmentedControlItem;
|
|
@@ -226,4 +284,18 @@ exports.TextInputButton = textInputButton;
|
|
|
226
284
|
exports.TextInput = textInput;
|
|
227
285
|
exports.Textarea = textarea;
|
|
228
286
|
exports.Tooltip = tooltip;
|
|
287
|
+
exports.COLOR_NUMBER_VALIDATION_PATTERN = color.COLOR_NUMBER_VALIDATION_PATTERN;
|
|
288
|
+
exports.DEFAULT_SWATCH = color.DEFAULT_SWATCH;
|
|
289
|
+
exports.HEX_VALIDATION_PATTERN = color.HEX_VALIDATION_PATTERN;
|
|
290
|
+
exports.bumpColorValue = color.bumpColorValue;
|
|
291
|
+
exports.clamp = color.clamp;
|
|
292
|
+
exports.getAbsolutePosition = color.getAbsolutePosition;
|
|
293
|
+
exports.getColorConstraints = color.getColorConstraints;
|
|
294
|
+
exports.getFractionDigit = color.getFractionDigit;
|
|
295
|
+
exports.getPageXYFromEvent = color.getPageXYFromEvent;
|
|
296
|
+
exports.getScrollXY = color.getScrollXY;
|
|
297
|
+
exports.resolveArrowDirection = color.resolveArrowDirection;
|
|
298
|
+
exports.truncColorValue = color.truncColorValue;
|
|
299
|
+
exports.uid = crypto.uid;
|
|
229
300
|
exports.Celeste = Celeste;
|
|
301
|
+
exports.toast = toast;
|
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
const Mo = require("vue");
|
|
3
|
+
const useDelegatedProps = require("./use-delegated-props.js");
|
|
4
|
+
const clsx = require("./chunks/clsx.js");
|
|
5
|
+
const index = require("./chunks/index.js");
|
|
6
|
+
const _pluginVue_exportHelper = require("./chunks/_plugin-vue_export-helper.js");
|
|
7
|
+
const _hoisted_1 = ["data-layout"];
|
|
8
|
+
const _hoisted_2 = {
|
|
9
|
+
key: 0,
|
|
10
|
+
class: "celeste-progress-bar-label"
|
|
11
|
+
};
|
|
12
|
+
const _hoisted_3 = {
|
|
13
|
+
key: 0,
|
|
14
|
+
class: "celeste-progress-bar-label-title"
|
|
15
|
+
};
|
|
16
|
+
const _hoisted_4 = { class: "celeste-progress-bar-label" };
|
|
17
|
+
const _hoisted_5 = {
|
|
18
|
+
key: 1,
|
|
19
|
+
class: "celeste-progress-bar-description"
|
|
20
|
+
};
|
|
21
|
+
const _sfc_main = /* @__PURE__ */ Mo.defineComponent({
|
|
22
|
+
__name: "progress-bar",
|
|
23
|
+
props: {
|
|
24
|
+
modelValue: { default: 0 },
|
|
25
|
+
max: { default: 100 },
|
|
26
|
+
getValueLabel: {},
|
|
27
|
+
asChild: { type: Boolean },
|
|
28
|
+
as: {},
|
|
29
|
+
class: {},
|
|
30
|
+
color: { default: "primary" },
|
|
31
|
+
title: {},
|
|
32
|
+
layout: { default: "bare" }
|
|
33
|
+
},
|
|
34
|
+
setup(__props) {
|
|
35
|
+
Mo.useCssVars((_ctx) => ({
|
|
36
|
+
"6ba22aeb": progressIndicator.value
|
|
37
|
+
}));
|
|
38
|
+
const props = __props;
|
|
39
|
+
const delegatedProps = useDelegatedProps.useDelegatedProps(props, "class");
|
|
40
|
+
const progress = Mo.computed(() => {
|
|
41
|
+
if (props.max === 0)
|
|
42
|
+
return 0;
|
|
43
|
+
const value = Math.min(Math.max(props.modelValue ?? 0, 0), props.max);
|
|
44
|
+
return Math.round(value / props.max * 100);
|
|
45
|
+
});
|
|
46
|
+
const progressIndicator = Mo.computed(() => {
|
|
47
|
+
return 100 - (props.modelValue ?? 0) / props.max * 100;
|
|
48
|
+
});
|
|
49
|
+
return (_ctx, _cache) => {
|
|
50
|
+
return Mo.openBlock(), Mo.createElementBlock("div", {
|
|
51
|
+
class: "celeste-progress-bar-wrapper",
|
|
52
|
+
"data-layout": _ctx.layout
|
|
53
|
+
}, [
|
|
54
|
+
_ctx.layout !== "bare" ? (Mo.openBlock(), Mo.createElementBlock("div", _hoisted_2, [
|
|
55
|
+
props.title && _ctx.layout !== "inline" ? (Mo.openBlock(), Mo.createElementBlock("span", _hoisted_3, Mo.toDisplayString(_ctx.title), 1)) : Mo.createCommentVNode("", true),
|
|
56
|
+
Mo.createElementVNode("span", _hoisted_4, [
|
|
57
|
+
Mo.renderSlot(_ctx.$slots, "label", {}, () => [
|
|
58
|
+
Mo.createTextVNode(Mo.toDisplayString(progress.value) + "% ", 1)
|
|
59
|
+
], true)
|
|
60
|
+
])
|
|
61
|
+
])) : Mo.createCommentVNode("", true),
|
|
62
|
+
Mo.createVNode(Mo.unref(index.By), Mo.mergeProps(Mo.unref(delegatedProps), {
|
|
63
|
+
class: Mo.unref(clsx.clsx)(
|
|
64
|
+
"celeste-progress-bar",
|
|
65
|
+
props.class
|
|
66
|
+
)
|
|
67
|
+
}), {
|
|
68
|
+
default: Mo.withCtx(() => [
|
|
69
|
+
Mo.createVNode(Mo.unref(index.Iy), {
|
|
70
|
+
class: "celeste-progress-bar-indicator",
|
|
71
|
+
"data-color": _ctx.color
|
|
72
|
+
}, null, 8, ["data-color"])
|
|
73
|
+
]),
|
|
74
|
+
_: 1
|
|
75
|
+
}, 16, ["class"]),
|
|
76
|
+
_ctx.$slots.description && _ctx.layout === "default" ? (Mo.openBlock(), Mo.createElementBlock("div", _hoisted_5, [
|
|
77
|
+
Mo.renderSlot(_ctx.$slots, "description", {}, void 0, true)
|
|
78
|
+
])) : Mo.createCommentVNode("", true)
|
|
79
|
+
], 8, _hoisted_1);
|
|
80
|
+
};
|
|
81
|
+
}
|
|
82
|
+
});
|
|
83
|
+
const progressBar = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-850aadb2"]]);
|
|
84
|
+
module.exports = progressBar;
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
const Mo = require("vue");
|
|
3
|
+
const useDelegatedProps = require("./use-delegated-props.js");
|
|
4
|
+
const clsx = require("./chunks/clsx.js");
|
|
5
|
+
const index = require("./chunks/index.js");
|
|
6
|
+
const _pluginVue_exportHelper = require("./chunks/_plugin-vue_export-helper.js");
|
|
7
|
+
const _hoisted_1 = ["width", "height"];
|
|
8
|
+
const _hoisted_2 = ["cx", "cy", "r"];
|
|
9
|
+
const _hoisted_3 = ["cx", "cy", "r", "stroke-dasharray", "stroke-dashoffset"];
|
|
10
|
+
const _hoisted_4 = {
|
|
11
|
+
key: 0,
|
|
12
|
+
class: "celeste-progress-circle-label"
|
|
13
|
+
};
|
|
14
|
+
const STROKE_WIDTH = 6.4;
|
|
15
|
+
const _sfc_main = /* @__PURE__ */ Mo.defineComponent({
|
|
16
|
+
__name: "progress-circle",
|
|
17
|
+
props: {
|
|
18
|
+
modelValue: { default: 0 },
|
|
19
|
+
max: { default: 100 },
|
|
20
|
+
getValueLabel: {},
|
|
21
|
+
asChild: { type: Boolean },
|
|
22
|
+
as: {},
|
|
23
|
+
class: {},
|
|
24
|
+
size: { default: 80 }
|
|
25
|
+
},
|
|
26
|
+
setup(__props) {
|
|
27
|
+
Mo.useCssVars((_ctx) => ({
|
|
28
|
+
"433ff7ca": circleSize.value
|
|
29
|
+
}));
|
|
30
|
+
const props = __props;
|
|
31
|
+
const delegatedProps = useDelegatedProps.useDelegatedProps(props, "class");
|
|
32
|
+
const radius = Mo.computed(() => (props.size - STROKE_WIDTH) / 2);
|
|
33
|
+
const circumference = Mo.computed(() => 2 * Math.PI * radius.value);
|
|
34
|
+
const progress = Mo.computed(() => {
|
|
35
|
+
if (props.max === 0)
|
|
36
|
+
return 0;
|
|
37
|
+
const value = Math.min(Math.max(props.modelValue ?? 0, 0), props.max);
|
|
38
|
+
return Math.round(value / props.max * 100);
|
|
39
|
+
});
|
|
40
|
+
const offset = Mo.computed(() => {
|
|
41
|
+
return circumference.value * (1 - progress.value / 100);
|
|
42
|
+
});
|
|
43
|
+
const circleSize = Mo.computed(() => `${props.size}px`);
|
|
44
|
+
return (_ctx, _cache) => {
|
|
45
|
+
return Mo.openBlock(), Mo.createBlock(Mo.unref(index.By), Mo.mergeProps(Mo.unref(delegatedProps), {
|
|
46
|
+
value: props.modelValue,
|
|
47
|
+
class: Mo.unref(clsx.clsx)("celeste-progress-circle", props.class),
|
|
48
|
+
as: "div"
|
|
49
|
+
}), {
|
|
50
|
+
default: Mo.withCtx(() => [
|
|
51
|
+
Mo.createVNode(Mo.unref(index.Iy), { "as-child": "" }, {
|
|
52
|
+
default: Mo.withCtx(() => [
|
|
53
|
+
(Mo.openBlock(), Mo.createElementBlock("svg", {
|
|
54
|
+
class: "celeste-progress-circle-svg",
|
|
55
|
+
width: props.size,
|
|
56
|
+
height: props.size
|
|
57
|
+
}, [
|
|
58
|
+
Mo.createElementVNode("circle", {
|
|
59
|
+
class: "celeste-progress-circle-track",
|
|
60
|
+
cx: props.size / 2,
|
|
61
|
+
cy: props.size / 2,
|
|
62
|
+
r: radius.value,
|
|
63
|
+
"stroke-width": STROKE_WIDTH,
|
|
64
|
+
fill: "transparent"
|
|
65
|
+
}, null, 8, _hoisted_2),
|
|
66
|
+
Mo.createElementVNode("circle", {
|
|
67
|
+
class: "celeste-progress-circle-indicator",
|
|
68
|
+
cx: props.size / 2,
|
|
69
|
+
cy: props.size / 2,
|
|
70
|
+
r: radius.value,
|
|
71
|
+
"stroke-width": STROKE_WIDTH,
|
|
72
|
+
fill: "transparent",
|
|
73
|
+
"stroke-dasharray": circumference.value,
|
|
74
|
+
"stroke-dashoffset": offset.value
|
|
75
|
+
}, null, 8, _hoisted_3)
|
|
76
|
+
], 8, _hoisted_1))
|
|
77
|
+
]),
|
|
78
|
+
_: 1
|
|
79
|
+
}),
|
|
80
|
+
props.size !== 48 ? (Mo.openBlock(), Mo.createElementBlock("div", _hoisted_4, [
|
|
81
|
+
Mo.renderSlot(_ctx.$slots, "default", {}, () => [
|
|
82
|
+
Mo.createTextVNode(Mo.toDisplayString(progress.value) + "% ", 1)
|
|
83
|
+
], true)
|
|
84
|
+
])) : Mo.createCommentVNode("", true)
|
|
85
|
+
]),
|
|
86
|
+
_: 3
|
|
87
|
+
}, 16, ["value", "class"]);
|
|
88
|
+
};
|
|
89
|
+
}
|
|
90
|
+
});
|
|
91
|
+
const progressCircle = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-f8ba36bb"]]);
|
|
92
|
+
module.exports = progressCircle;
|
package/dist/cjs/sonner-alert.js
CHANGED
|
@@ -37,5 +37,5 @@ const _sfc_main = /* @__PURE__ */ Mo.defineComponent({
|
|
|
37
37
|
};
|
|
38
38
|
}
|
|
39
39
|
});
|
|
40
|
-
const
|
|
41
|
-
module.exports =
|
|
40
|
+
const SonnerAlert = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-c8bb23e0"]]);
|
|
41
|
+
module.exports = SonnerAlert;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { ProgressRootProps } from 'radix-vue';
|
|
2
|
+
import { HTMLAttributes } from 'vue';
|
|
3
|
+
type __VLS_Props = ProgressRootProps & {
|
|
4
|
+
class?: HTMLAttributes['class'];
|
|
5
|
+
color?: 'blue' | 'red' | 'orange' | 'green' | 'primary';
|
|
6
|
+
title?: string;
|
|
7
|
+
layout?: 'default' | 'no-description' | 'inline' | 'bare';
|
|
8
|
+
};
|
|
9
|
+
declare function __VLS_template(): {
|
|
10
|
+
attrs: Partial<{}>;
|
|
11
|
+
slots: {
|
|
12
|
+
label?(_: {}): any;
|
|
13
|
+
description?(_: {}): any;
|
|
14
|
+
};
|
|
15
|
+
refs: {};
|
|
16
|
+
rootEl: HTMLDivElement;
|
|
17
|
+
};
|
|
18
|
+
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
19
|
+
declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
20
|
+
color: "blue" | "red" | "orange" | "green" | "primary";
|
|
21
|
+
modelValue: number | null;
|
|
22
|
+
max: number;
|
|
23
|
+
layout: "default" | "no-description" | "inline" | "bare";
|
|
24
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
|
|
25
|
+
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
26
|
+
export default _default;
|
|
27
|
+
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
28
|
+
new (): {
|
|
29
|
+
$slots: S;
|
|
30
|
+
};
|
|
31
|
+
};
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { HTMLAttributes } from 'vue';
|
|
2
|
+
import { ProgressRootProps } from 'radix-vue';
|
|
3
|
+
type __VLS_Props = ProgressRootProps & {
|
|
4
|
+
class?: HTMLAttributes['class'];
|
|
5
|
+
size?: 80 | 72 | 64 | 56 | 48;
|
|
6
|
+
};
|
|
7
|
+
declare function __VLS_template(): {
|
|
8
|
+
attrs: Partial<{}>;
|
|
9
|
+
slots: {
|
|
10
|
+
default?(_: {}): any;
|
|
11
|
+
};
|
|
12
|
+
refs: {};
|
|
13
|
+
rootEl: any;
|
|
14
|
+
};
|
|
15
|
+
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
16
|
+
declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
17
|
+
size: 80 | 72 | 64 | 56 | 48;
|
|
18
|
+
modelValue: number | null;
|
|
19
|
+
max: number;
|
|
20
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
21
|
+
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
22
|
+
export default _default;
|
|
23
|
+
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
24
|
+
new (): {
|
|
25
|
+
$slots: S;
|
|
26
|
+
};
|
|
27
|
+
};
|
package/dist/es/chunks/index.js
CHANGED
|
@@ -6406,6 +6406,99 @@ const [Nt, Xc] = Q("PopoverRoot"), ys = /* @__PURE__ */ defineComponent({
|
|
|
6406
6406
|
_: 3
|
|
6407
6407
|
}, 8, ["type", "as", "as-child"]));
|
|
6408
6408
|
}
|
|
6409
|
+
}), da = 100, [Qc, ef] = Q("ProgressRoot"), Po = (a2) => typeof a2 == "number";
|
|
6410
|
+
function tf(a2, t) {
|
|
6411
|
+
return vt(a2) || Po(a2) && !Number.isNaN(a2) && a2 <= t && a2 >= 0 ? a2 : (console.error(`Invalid prop \`value\` of value \`${a2}\` supplied to \`ProgressRoot\`. The \`value\` prop must be:
|
|
6412
|
+
- a positive number
|
|
6413
|
+
- less than the value passed to \`max\` (or ${da} if no \`max\` prop is set)
|
|
6414
|
+
- \`null\` or \`undefined\` if the progress is indeterminate.
|
|
6415
|
+
|
|
6416
|
+
Defaulting to \`null\`.`), null);
|
|
6417
|
+
}
|
|
6418
|
+
function af(a2) {
|
|
6419
|
+
return Po(a2) && !Number.isNaN(a2) && a2 > 0 ? a2 : (console.error(
|
|
6420
|
+
`Invalid prop \`max\` of value \`${a2}\` supplied to \`ProgressRoot\`. Only numbers greater than 0 are valid max values. Defaulting to \`${da}\`.`
|
|
6421
|
+
), da);
|
|
6422
|
+
}
|
|
6423
|
+
const By = /* @__PURE__ */ defineComponent({
|
|
6424
|
+
__name: "ProgressRoot",
|
|
6425
|
+
props: {
|
|
6426
|
+
modelValue: {},
|
|
6427
|
+
max: { default: da },
|
|
6428
|
+
getValueLabel: { type: Function, default: (a2, t) => `${Math.round(a2 / t * da)}%` },
|
|
6429
|
+
asChild: { type: Boolean },
|
|
6430
|
+
as: {}
|
|
6431
|
+
},
|
|
6432
|
+
emits: ["update:modelValue", "update:max"],
|
|
6433
|
+
setup(a2, { emit: t }) {
|
|
6434
|
+
const e = a2, n = t;
|
|
6435
|
+
R();
|
|
6436
|
+
const l = ne(e, "modelValue", n, {
|
|
6437
|
+
passive: e.modelValue === void 0
|
|
6438
|
+
}), s = ne(e, "max", n, {
|
|
6439
|
+
passive: e.max === void 0
|
|
6440
|
+
});
|
|
6441
|
+
watch(
|
|
6442
|
+
() => l.value,
|
|
6443
|
+
async (i) => {
|
|
6444
|
+
const u = tf(i, e.max);
|
|
6445
|
+
u !== i && (await nextTick(), l.value = u);
|
|
6446
|
+
},
|
|
6447
|
+
{ immediate: true }
|
|
6448
|
+
), watch(
|
|
6449
|
+
() => e.max,
|
|
6450
|
+
(i) => {
|
|
6451
|
+
const u = af(e.max);
|
|
6452
|
+
u !== i && (s.value = u);
|
|
6453
|
+
},
|
|
6454
|
+
{ immediate: true }
|
|
6455
|
+
);
|
|
6456
|
+
const r = computed(() => vt(l.value) ? "indeterminate" : l.value === s.value ? "complete" : "loading");
|
|
6457
|
+
return ef({
|
|
6458
|
+
modelValue: l,
|
|
6459
|
+
max: s,
|
|
6460
|
+
progressState: r
|
|
6461
|
+
}), (i, u) => (openBlock(), createBlock(unref(O), {
|
|
6462
|
+
"as-child": i.asChild,
|
|
6463
|
+
as: i.as,
|
|
6464
|
+
"aria-valuemax": unref(s),
|
|
6465
|
+
"aria-valuemin": 0,
|
|
6466
|
+
"aria-valuenow": Po(unref(l)) ? unref(l) : void 0,
|
|
6467
|
+
"aria-valuetext": i.getValueLabel(unref(l), unref(s)),
|
|
6468
|
+
"aria-label": i.getValueLabel(unref(l), unref(s)),
|
|
6469
|
+
role: "progressbar",
|
|
6470
|
+
"data-state": r.value,
|
|
6471
|
+
"data-value": unref(l) ?? void 0,
|
|
6472
|
+
"data-max": unref(s)
|
|
6473
|
+
}, {
|
|
6474
|
+
default: withCtx(() => [
|
|
6475
|
+
renderSlot(i.$slots, "default", { modelValue: unref(l) })
|
|
6476
|
+
]),
|
|
6477
|
+
_: 3
|
|
6478
|
+
}, 8, ["as-child", "as", "aria-valuemax", "aria-valuenow", "aria-valuetext", "aria-label", "data-state", "data-value", "data-max"]));
|
|
6479
|
+
}
|
|
6480
|
+
}), Iy = /* @__PURE__ */ defineComponent({
|
|
6481
|
+
__name: "ProgressIndicator",
|
|
6482
|
+
props: {
|
|
6483
|
+
asChild: { type: Boolean },
|
|
6484
|
+
as: {}
|
|
6485
|
+
},
|
|
6486
|
+
setup(a2) {
|
|
6487
|
+
const t = a2, e = Qc();
|
|
6488
|
+
return R(), (n, l) => {
|
|
6489
|
+
var s;
|
|
6490
|
+
return openBlock(), createBlock(unref(O), mergeProps(t, {
|
|
6491
|
+
"data-state": unref(e).progressState.value,
|
|
6492
|
+
"data-value": ((s = unref(e).modelValue) == null ? void 0 : s.value) ?? void 0,
|
|
6493
|
+
"data-max": unref(e).max.value
|
|
6494
|
+
}), {
|
|
6495
|
+
default: withCtx(() => [
|
|
6496
|
+
renderSlot(n.$slots, "default")
|
|
6497
|
+
]),
|
|
6498
|
+
_: 3
|
|
6499
|
+
}, 16, ["data-state", "data-value", "data-max"]);
|
|
6500
|
+
};
|
|
6501
|
+
}
|
|
6409
6502
|
});
|
|
6410
6503
|
const [He, Pf] = Q("ScrollAreaRoot"), Oy = /* @__PURE__ */ defineComponent({
|
|
6411
6504
|
__name: "ScrollAreaRoot",
|
|
@@ -9232,6 +9325,7 @@ export {
|
|
|
9232
9325
|
ph as a7,
|
|
9233
9326
|
rh as a8,
|
|
9234
9327
|
sh as a9,
|
|
9328
|
+
Wg as aA,
|
|
9235
9329
|
Dv as aa,
|
|
9236
9330
|
Eu as ab,
|
|
9237
9331
|
xu as ac,
|
|
@@ -9242,21 +9336,22 @@ export {
|
|
|
9242
9336
|
_s as ah,
|
|
9243
9337
|
xs as ai,
|
|
9244
9338
|
gs as aj,
|
|
9245
|
-
|
|
9246
|
-
|
|
9247
|
-
|
|
9248
|
-
|
|
9249
|
-
|
|
9250
|
-
|
|
9251
|
-
|
|
9252
|
-
|
|
9253
|
-
|
|
9254
|
-
|
|
9255
|
-
|
|
9256
|
-
|
|
9257
|
-
|
|
9258
|
-
|
|
9259
|
-
|
|
9339
|
+
By as ak,
|
|
9340
|
+
Iy as al,
|
|
9341
|
+
zy as am,
|
|
9342
|
+
Ky as an,
|
|
9343
|
+
Xy as ao,
|
|
9344
|
+
jy as ap,
|
|
9345
|
+
Yy as aq,
|
|
9346
|
+
Uy as ar,
|
|
9347
|
+
Ly as as,
|
|
9348
|
+
eg as at,
|
|
9349
|
+
Qy as au,
|
|
9350
|
+
Lg as av,
|
|
9351
|
+
zg as aw,
|
|
9352
|
+
Kg as ax,
|
|
9353
|
+
jg as ay,
|
|
9354
|
+
Hg as az,
|
|
9260
9355
|
bh as b,
|
|
9261
9356
|
tg as c,
|
|
9262
9357
|
ag as d,
|
package/dist/es/chunks/sonner.js
CHANGED
|
@@ -247,7 +247,7 @@ const isHttpResponse = (data) => {
|
|
|
247
247
|
const basicToast = toastFunction;
|
|
248
248
|
const getHistory = () => ToastState.toasts;
|
|
249
249
|
const getToasts = () => ToastState.getActiveToasts();
|
|
250
|
-
Object.assign(basicToast, {
|
|
250
|
+
const toast = Object.assign(basicToast, {
|
|
251
251
|
success: ToastState.success,
|
|
252
252
|
info: ToastState.info,
|
|
253
253
|
warning: ToastState.warning,
|
|
@@ -1150,5 +1150,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
1150
1150
|
}
|
|
1151
1151
|
});
|
|
1152
1152
|
export {
|
|
1153
|
-
_sfc_main as _
|
|
1153
|
+
_sfc_main as _,
|
|
1154
|
+
toast as t
|
|
1154
1155
|
};
|