@a-drowned-fish/rox-v 1.0.34 → 1.0.36
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/README.md +132 -0
- package/dist/es/components.js +4 -2
- package/dist/es/index.js +6 -5
- package/dist/es/loading/loading.js +1 -1
- package/dist/es/loading/style.css +1 -1
- package/dist/es/slider-captcha/index.js +7 -0
- package/dist/es/slider-captcha/slider-captcha.js +7 -0
- package/dist/es/slider-captcha/slider-captcha.vue_vue_type_script_setup_true_lang.js +135 -0
- package/dist/es/slider-captcha/style.css +1 -0
- package/dist/es/slider-captcha/style.css.js +0 -0
- package/dist/es/style.css +1 -1
- package/dist/es/utils.js +42 -0
- package/dist/index.js +1 -1
- package/dist/lib/components.js +1 -1
- package/dist/lib/index.js +1 -1
- package/dist/lib/loading/loading.js +1 -1
- package/dist/lib/loading/style.css +1 -1
- package/dist/lib/slider-captcha/index.js +1 -0
- package/dist/lib/slider-captcha/slider-captcha.js +1 -0
- package/dist/lib/slider-captcha/slider-captcha.vue_vue_type_script_setup_true_lang.js +1 -0
- package/dist/lib/slider-captcha/style.css +1 -0
- package/dist/lib/slider-captcha/style.css.js +0 -0
- package/dist/lib/style.css +1 -1
- package/dist/lib/utils.js +1 -0
- package/dist/style.css +1 -1
- package/dist/types/components/components.d.ts +3 -1
- package/dist/types/components/slider-captcha/index.d.ts +5 -0
- package/dist/types/components/slider-captcha/slider-captcha.vue.d.ts +48 -0
- package/dist/types/components/slider-captcha/style.css.d.ts +1 -0
- package/dist/types/components/slider-captcha/types.d.ts +14 -0
- package/dist/types/components/utils.d.ts +7 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -41,6 +41,15 @@ import { Button, InputOtp } from "@a-drowned-fish/rox-v";
|
|
|
41
41
|
|
|
42
42
|
## 可用组件
|
|
43
43
|
|
|
44
|
+
### 组件列表
|
|
45
|
+
|
|
46
|
+
- [InputOtp - OTP 输入组件](#inputotp---otp-输入组件)
|
|
47
|
+
- [Popup - 弹出层组件](#popup---弹出层组件)
|
|
48
|
+
- [Tab - 标签页组件](#tab---标签页组件)
|
|
49
|
+
- [Menu - 下拉菜单组件](#menu---下拉菜单组件)
|
|
50
|
+
- [Toast - 消息提示组件](#toast---消息提示组件)
|
|
51
|
+
- [SliderCaptcha - 滑块验证码组件](#slidercaptcha---滑块验证码组件)
|
|
52
|
+
|
|
44
53
|
### InputOtp - OTP 输入组件
|
|
45
54
|
|
|
46
55
|
一个用于输入一次性密码(OTP)的组件,支持自定义长度、样式和间距。
|
|
@@ -902,6 +911,129 @@ interface ToastOptions {
|
|
|
902
911
|
| info-icon | 信息提示的自定义图标 |
|
|
903
912
|
| warning-icon | 警告提示的自定义图标 |
|
|
904
913
|
|
|
914
|
+
### SliderCaptcha - 滑块验证码组件
|
|
915
|
+
|
|
916
|
+
一个用于验证用户身份的滑块验证码组件,支持自定义背景图和滑块图,提供实时位置追踪功能。
|
|
917
|
+
|
|
918
|
+
#### 基础用法
|
|
919
|
+
|
|
920
|
+
```vue
|
|
921
|
+
<template>
|
|
922
|
+
<SliderCaptcha
|
|
923
|
+
:background="bgImage"
|
|
924
|
+
:block="blockImage"
|
|
925
|
+
:width="300"
|
|
926
|
+
:block-top="80"
|
|
927
|
+
@success="onSuccess"
|
|
928
|
+
@fail="onFail"
|
|
929
|
+
@change="onChange"
|
|
930
|
+
/>
|
|
931
|
+
</template>
|
|
932
|
+
|
|
933
|
+
<script setup lang="ts">
|
|
934
|
+
import { ref } from "vue";
|
|
935
|
+
import { SliderCaptcha } from "@a-drowned-fish/rox-v";
|
|
936
|
+
|
|
937
|
+
const bgImage = ref("https://example.com/bg.jpg");
|
|
938
|
+
const blockImage = ref("https://example.com/block.png");
|
|
939
|
+
|
|
940
|
+
function onSuccess() {
|
|
941
|
+
console.log("验证成功");
|
|
942
|
+
}
|
|
943
|
+
|
|
944
|
+
function onFail() {
|
|
945
|
+
console.log("验证失败");
|
|
946
|
+
}
|
|
947
|
+
|
|
948
|
+
function onChange(tracks) {
|
|
949
|
+
console.log("滑块位置变化:", tracks);
|
|
950
|
+
}
|
|
951
|
+
</script>
|
|
952
|
+
```
|
|
953
|
+
|
|
954
|
+
#### 带验证函数的用法
|
|
955
|
+
|
|
956
|
+
```vue
|
|
957
|
+
<template>
|
|
958
|
+
<SliderCaptcha
|
|
959
|
+
:background="bgImage"
|
|
960
|
+
:block="blockImage"
|
|
961
|
+
:width="400"
|
|
962
|
+
:verify="verifyCaptcha"
|
|
963
|
+
@success="onSuccess"
|
|
964
|
+
@fail="onFail"
|
|
965
|
+
/>
|
|
966
|
+
</template>
|
|
967
|
+
|
|
968
|
+
<script setup lang="ts">
|
|
969
|
+
import { ref } from "vue";
|
|
970
|
+
import { SliderCaptcha } from "@a-drowned-fish/rox-v";
|
|
971
|
+
|
|
972
|
+
const bgImage = ref("https://example.com/bg.jpg");
|
|
973
|
+
const blockImage = ref("https://example.com/block.png");
|
|
974
|
+
|
|
975
|
+
async function verifyCaptcha(position) {
|
|
976
|
+
// 发送验证请求到后端
|
|
977
|
+
const response = await fetch("/api/verify-captcha", {
|
|
978
|
+
method: "POST",
|
|
979
|
+
body: JSON.stringify(position),
|
|
980
|
+
});
|
|
981
|
+
return response.ok;
|
|
982
|
+
}
|
|
983
|
+
|
|
984
|
+
function onSuccess() {
|
|
985
|
+
console.log("验证成功");
|
|
986
|
+
}
|
|
987
|
+
|
|
988
|
+
function onFail() {
|
|
989
|
+
console.log("验证失败");
|
|
990
|
+
}
|
|
991
|
+
</script>
|
|
992
|
+
```
|
|
993
|
+
|
|
994
|
+
#### SliderCaptcha Props
|
|
995
|
+
|
|
996
|
+
| 属性 | 说明 | 类型 | 默认值 |
|
|
997
|
+
| ------------ | ------------------------------------------ | --------------------------------------------------------------------- | ----------- |
|
|
998
|
+
| background | 背景图地址 | `string` | - |
|
|
999
|
+
| block | 滑块缺口图地址 | `string` | - |
|
|
1000
|
+
| width | 容器宽度(像素) | `number` | - |
|
|
1001
|
+
| blockTop | 滑块图距离顶部的距离(原图像素) | `number` | `0` |
|
|
1002
|
+
| verify | 验证函数,返回 boolean 或 Promise<boolean> | `(option: RoxVSliderCaptchaTrackItem) => boolean \| Promise<boolean>` | - |
|
|
1003
|
+
| trackBlockBg | 滑块轨道背景颜色 | `string` | `'#f5f5f5'` |
|
|
1004
|
+
| trackBg | 滑块轨道进度条背景颜色 | `string` | `'#c5c5c5'` |
|
|
1005
|
+
|
|
1006
|
+
#### SliderCaptcha Events
|
|
1007
|
+
|
|
1008
|
+
| 事件名 | 说明 | 参数类型 |
|
|
1009
|
+
| ------- | ------------------ | ------------------------------ |
|
|
1010
|
+
| success | 验证成功时触发 | - |
|
|
1011
|
+
| fail | 验证失败时触发 | - |
|
|
1012
|
+
| change | 滑块移动时实时触发 | `RoxVSliderCaptchaTrackItem[]` |
|
|
1013
|
+
|
|
1014
|
+
#### RoxVSliderCaptchaTrackItem 类型定义
|
|
1015
|
+
|
|
1016
|
+
```ts
|
|
1017
|
+
interface RoxVSliderCaptchaTrackItem {
|
|
1018
|
+
x: number; // 缺口图在原图上的X坐标
|
|
1019
|
+
t: number; // 时间戳
|
|
1020
|
+
xPercent: number; // X坐标占原图宽度的百分比
|
|
1021
|
+
}
|
|
1022
|
+
```
|
|
1023
|
+
|
|
1024
|
+
#### SliderCaptcha Slots
|
|
1025
|
+
|
|
1026
|
+
| 插槽名 | 说明 |
|
|
1027
|
+
| ------- | -------------- |
|
|
1028
|
+
| default | 自定义滑块内容 |
|
|
1029
|
+
|
|
1030
|
+
#### SliderCaptcha Expose
|
|
1031
|
+
|
|
1032
|
+
| 属性/方法 | 说明 | 类型 |
|
|
1033
|
+
| --------- | ---------------- | ------------------------------ |
|
|
1034
|
+
| reset | 重置滑块位置 | `() => void` |
|
|
1035
|
+
| tracks | 滑块移动轨迹数组 | `RoxVSliderCaptchaTrackItem[]` |
|
|
1036
|
+
|
|
905
1037
|
## License
|
|
906
1038
|
|
|
907
1039
|
MIT
|
package/dist/es/components.js
CHANGED
|
@@ -9,8 +9,9 @@ import s from "./tab/index.js";
|
|
|
9
9
|
import { useToast as c } from "./toast/toast.js";
|
|
10
10
|
import l from "./toast/index.js";
|
|
11
11
|
import u from "./loading/index.js";
|
|
12
|
+
import d from "./slider-captcha/index.js";
|
|
12
13
|
//#region components/components.ts
|
|
13
|
-
var
|
|
14
|
+
var f = /* @__PURE__ */ e({
|
|
14
15
|
Button: () => r,
|
|
15
16
|
Collapse: () => i,
|
|
16
17
|
Input: () => a,
|
|
@@ -18,9 +19,10 @@ var d = /* @__PURE__ */ e({
|
|
|
18
19
|
Loading: () => u,
|
|
19
20
|
Menu: () => o,
|
|
20
21
|
Popup: () => n,
|
|
22
|
+
SliderCaptcha: () => d,
|
|
21
23
|
Tab: () => s,
|
|
22
24
|
Toaster: () => l,
|
|
23
25
|
useToast: () => c
|
|
24
26
|
});
|
|
25
27
|
//#endregion
|
|
26
|
-
export {
|
|
28
|
+
export { f as components_exports };
|
package/dist/es/index.js
CHANGED
|
@@ -8,12 +8,13 @@ import o from "./tab/index.js";
|
|
|
8
8
|
import { useToast as s } from "./toast/toast.js";
|
|
9
9
|
import c from "./toast/index.js";
|
|
10
10
|
import l from "./loading/index.js";
|
|
11
|
-
import
|
|
11
|
+
import u from "./slider-captcha/index.js";
|
|
12
|
+
import { components_exports as d } from "./components.js";
|
|
12
13
|
/* empty css */
|
|
13
14
|
//#region components/index.ts
|
|
14
|
-
var
|
|
15
|
-
let n =
|
|
15
|
+
var f = (e) => (Object.keys(d).forEach((t) => {
|
|
16
|
+
let n = d[t];
|
|
16
17
|
n.install && e.use(n);
|
|
17
|
-
}), e),
|
|
18
|
+
}), e), p = { install: f };
|
|
18
19
|
//#endregion
|
|
19
|
-
export { n as Button, r as Collapse, i as Input, e as InputOtp, l as Loading, a as Menu, t as Popup, o as Tab, c as Toaster,
|
|
20
|
+
export { n as Button, r as Collapse, i as Input, e as InputOtp, l as Loading, a as Menu, t as Popup, u as SliderCaptcha, o as Tab, c as Toaster, p as default, f as install, s as useToast };
|
|
@@ -2,6 +2,6 @@ import e from "../_virtual/_plugin-vue_export-helper.js";
|
|
|
2
2
|
import t from "./loading.vue_vue_type_script_setup_true_lang.js";
|
|
3
3
|
/* empty css */
|
|
4
4
|
//#region components/loading/loading.vue
|
|
5
|
-
var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-
|
|
5
|
+
var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-aafc58b1"]]);
|
|
6
6
|
//#endregion
|
|
7
7
|
export { n as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.fade-enter-from[data-v-
|
|
1
|
+
.fade-enter-from[data-v-aafc58b1],.fade-leave-to[data-v-aafc58b1]{opacity:0}.fade-enter-active[data-v-aafc58b1],.fade-leave-active[data-v-aafc58b1]{transition:opacity .15s ease-in-out}.loading-box[data-v-aafc58b1]{background-color:var(--bg);z-index:99;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}@keyframes bounce-aafc58b1{0%,to{transform:translateY(0)}50%{transform:translateY(var(--amplitude))}}.loading-dot[data-v-aafc58b1]{width:var(--dot-size);height:var(--dot-size);background-color:var(--dot-color);border-radius:50%;animation:1s ease-in-out infinite bounce-aafc58b1}.loading-dot~.loading-dot[data-v-aafc58b1]{margin-left:var(--dot-gap)}.loading-dot[data-v-aafc58b1]:first-child{animation-delay:0s}.loading-dot[data-v-aafc58b1]:nth-child(2){animation-delay:.2s}.loading-dot[data-v-aafc58b1]:nth-child(3){animation-delay:.4s}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import e from "../_virtual/_plugin-vue_export-helper.js";
|
|
2
|
+
import t from "./slider-captcha.vue_vue_type_script_setup_true_lang.js";
|
|
3
|
+
/* empty css */
|
|
4
|
+
//#region components/slider-captcha/slider-captcha.vue
|
|
5
|
+
var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-792c4317"]]);
|
|
6
|
+
//#endregion
|
|
7
|
+
export { n as default };
|
|
@@ -0,0 +1,135 @@
|
|
|
1
|
+
import { getImageSize as e, isClient as t } from "../utils.js";
|
|
2
|
+
import { computed as n, createElementBlock as r, createElementVNode as i, defineComponent as a, normalizeStyle as o, onMounted as s, openBlock as c, reactive as l, ref as u, renderSlot as d, useTemplateRef as f, vShow as p, watch as m, withDirectives as h } from "vue";
|
|
3
|
+
//#region components/slider-captcha/slider-captcha.vue?vue&type=script&setup=true&lang.ts
|
|
4
|
+
var g = {
|
|
5
|
+
class: "slider-captcha-bg-box",
|
|
6
|
+
ref: "box"
|
|
7
|
+
}, _ = ["src"], v = ["src"], y = {
|
|
8
|
+
key: 1,
|
|
9
|
+
stroke: "currentColor",
|
|
10
|
+
fill: "currentColor",
|
|
11
|
+
"stroke-width": "0",
|
|
12
|
+
viewBox: "0 0 512 512",
|
|
13
|
+
height: "1em",
|
|
14
|
+
width: "1em",
|
|
15
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
16
|
+
}, b = /* @__PURE__ */ a({
|
|
17
|
+
__name: "slider-captcha",
|
|
18
|
+
props: {
|
|
19
|
+
background: {},
|
|
20
|
+
block: {},
|
|
21
|
+
width: {},
|
|
22
|
+
blockTop: { default: 0 },
|
|
23
|
+
verify: {},
|
|
24
|
+
trackBlockBg: { default: "#f5f5f5" },
|
|
25
|
+
trackBg: { default: "rgba(26,23,27,0.1)" }
|
|
26
|
+
},
|
|
27
|
+
emits: [
|
|
28
|
+
"success",
|
|
29
|
+
"fail",
|
|
30
|
+
"change"
|
|
31
|
+
],
|
|
32
|
+
setup(a, { expose: b, emit: x }) {
|
|
33
|
+
let S = x, C = u(!1), w = f("box"), T = f("thumb"), E = a, D = l({
|
|
34
|
+
natureWidth: 0,
|
|
35
|
+
natureHeight: 0,
|
|
36
|
+
boxWidth: 0,
|
|
37
|
+
boxHeight: 0
|
|
38
|
+
}), O = l({
|
|
39
|
+
natureWidth: 0,
|
|
40
|
+
natureHeight: 0
|
|
41
|
+
}), k = l({
|
|
42
|
+
width: 0,
|
|
43
|
+
height: 0
|
|
44
|
+
}), A = u(0), j = u(0), M = u(!1), N = u([]), P = n(() => D.boxWidth ? D.natureWidth / D.boxWidth : 1), F = n(() => D.boxHeight ? D.natureHeight / D.boxHeight : 1), I = n(() => O.natureWidth / P.value), L = n(() => E.blockTop / F.value), R = n(() => D.boxWidth ? D.boxWidth - I.value : 0), z = n(() => D.boxWidth ? D.boxWidth - k.width : 0), B = n(() => R.value ? z.value / R.value : 1);
|
|
45
|
+
function V(e) {
|
|
46
|
+
!t() || C.value || (j.value = e.clientX, M.value = !0, N.value = [], window.addEventListener("pointermove", H), window.addEventListener("pointerup", U));
|
|
47
|
+
}
|
|
48
|
+
function H(e) {
|
|
49
|
+
if (!M.value || C.value) return;
|
|
50
|
+
let t = e.clientX - j.value;
|
|
51
|
+
t = Math.min(Math.max(0, t), z.value), A.value = t;
|
|
52
|
+
let n = t / (z.value || 1) * (D.natureWidth - O.natureWidth), r = Date.now(), i = n / (D.natureWidth || 1) * 100;
|
|
53
|
+
N.value.push({
|
|
54
|
+
x: n,
|
|
55
|
+
t: r,
|
|
56
|
+
xPercent: i
|
|
57
|
+
}), S("change", N.value);
|
|
58
|
+
}
|
|
59
|
+
async function U() {
|
|
60
|
+
if (!C.value) {
|
|
61
|
+
if (M.value = !1, window.removeEventListener("pointermove", H), window.removeEventListener("pointerup", U), E.verify) {
|
|
62
|
+
let e = N.value[N.value.length - 1];
|
|
63
|
+
e ||= {
|
|
64
|
+
x: 0,
|
|
65
|
+
xPercent: 0,
|
|
66
|
+
t: Date.now()
|
|
67
|
+
}, C.value = !0, await E.verify(e) ? S("success") : S("fail"), C.value = !1;
|
|
68
|
+
}
|
|
69
|
+
q();
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
async function W() {
|
|
73
|
+
if (!E.background) return;
|
|
74
|
+
let { naturalWidth: t, naturalHeight: n } = await e(E.background);
|
|
75
|
+
D.natureWidth = t, D.natureHeight = n, D.boxWidth = w.value?.clientWidth || 0, D.boxHeight = w.value?.clientHeight || 0;
|
|
76
|
+
}
|
|
77
|
+
async function G() {
|
|
78
|
+
if (!E.block) return;
|
|
79
|
+
let { naturalWidth: t, naturalHeight: n } = await e(E.block);
|
|
80
|
+
O.natureWidth = t, O.natureHeight = n;
|
|
81
|
+
}
|
|
82
|
+
function K() {
|
|
83
|
+
k.width = T.value?.clientWidth || 0, k.height = T.value?.clientHeight || 0;
|
|
84
|
+
}
|
|
85
|
+
function q() {
|
|
86
|
+
A.value = 0;
|
|
87
|
+
}
|
|
88
|
+
return s(() => {
|
|
89
|
+
W(), G(), K();
|
|
90
|
+
}), m(() => E.background, () => {
|
|
91
|
+
W();
|
|
92
|
+
}), m(() => E.block, () => {
|
|
93
|
+
G();
|
|
94
|
+
}), m(() => E.width, () => {
|
|
95
|
+
W(), G(), K();
|
|
96
|
+
}), b({
|
|
97
|
+
reset: q,
|
|
98
|
+
tracks: N
|
|
99
|
+
}), (e, t) => (c(), r("div", {
|
|
100
|
+
class: "slider-captcha-box",
|
|
101
|
+
style: o(E.width ? { width: E.width + "px" } : {})
|
|
102
|
+
}, [i("div", g, [i("img", {
|
|
103
|
+
src: E.background,
|
|
104
|
+
alt: "bg",
|
|
105
|
+
class: "slider-captcha-bg",
|
|
106
|
+
draggable: !1
|
|
107
|
+
}, null, 8, _), h(i("img", {
|
|
108
|
+
src: E.block,
|
|
109
|
+
alt: "block",
|
|
110
|
+
class: "slider-captcha-block",
|
|
111
|
+
style: o({
|
|
112
|
+
top: L.value + "px",
|
|
113
|
+
width: I.value + "px",
|
|
114
|
+
transform: `translateX(${A.value / B.value}px)`
|
|
115
|
+
}),
|
|
116
|
+
draggable: !1
|
|
117
|
+
}, null, 12, v), [[p, I.value]])], 512), i("div", {
|
|
118
|
+
class: "slider-track-box",
|
|
119
|
+
style: o({ "background-color": E.trackBlockBg })
|
|
120
|
+
}, [i("div", {
|
|
121
|
+
class: "slider-track-bg",
|
|
122
|
+
style: o({
|
|
123
|
+
"background-color": E.trackBg,
|
|
124
|
+
width: `${A.value}px`
|
|
125
|
+
})
|
|
126
|
+
}, null, 4), i("div", {
|
|
127
|
+
class: "slider-track-thumb",
|
|
128
|
+
onPointerdown: V,
|
|
129
|
+
ref: "thumb",
|
|
130
|
+
style: o({ transform: `translateX(${A.value}px)` })
|
|
131
|
+
}, [e.$slots.default ? d(e.$slots, "default", { key: 0 }, void 0, !0) : (c(), r("svg", y, [...t[0] ||= [i("path", { d: "M502.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-128-128c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L402.7 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l370.7 0-73.4 73.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l128-128z" }, null, -1)]]))], 36)], 4)], 4));
|
|
132
|
+
}
|
|
133
|
+
});
|
|
134
|
+
//#endregion
|
|
135
|
+
export { b as default };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.slider-captcha-box[data-v-792c4317]{display:inline-block}.slider-captcha-bg-box[data-v-792c4317]{width:100%;font-size:0;position:relative}.slider-captcha-bg[data-v-792c4317]{width:100%}.slider-captcha-block[data-v-792c4317]{z-index:10;position:absolute;left:0}.slider-track-box[data-v-792c4317]{width:100%;position:relative}.slider-track-bg[data-v-792c4317]{height:100%;position:absolute;top:0;left:0}.slider-track-thumb[data-v-792c4317]{cursor:pointer;background-color:#1a171b0d;justify-content:center;align-items:center;width:60px;height:42px;margin-top:15px;display:flex}
|
|
File without changes
|
package/dist/es/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:-webkit-any(input:-webkit-autofill,textarea:-webkit-autofill){-webkit-box-shadow:0 0 0 1000px var(--input-bg,#fff) inset;-webkit-text-fill-color:inherit}:is(input:autofill,textarea:autofill){-webkit-box-shadow:0 0 0 1000px var(--input-bg,#fff) inset;-webkit-text-fill-color:inherit}input:focus,textarea:focus,button:focus{outline:none}input::-webkit-input-placeholder{color:var(--input-placeholder-color,#999)}textarea::-webkit-input-placeholder{color:var(--input-placeholder-color,#999)}input::-moz-placeholder{color:var(--input-placeholder-color,#999)}textarea::-moz-placeholder{color:var(--input-placeholder-color,#999)}input:-ms-placeholder-shown{color:var(--input-placeholder-color,#999)}
|
|
1
|
+
:-webkit-any(input:-webkit-autofill,textarea:-webkit-autofill){-webkit-box-shadow:0 0 0 1000px var(--input-bg,#fff) inset;-webkit-text-fill-color:inherit}:is(input:autofill,textarea:autofill){-webkit-box-shadow:0 0 0 1000px var(--input-bg,#fff) inset;-webkit-text-fill-color:inherit}a:focus,input:focus,textarea:focus,button:focus{outline:none}input::-webkit-input-placeholder{color:var(--input-placeholder-color,#999)}textarea::-webkit-input-placeholder{color:var(--input-placeholder-color,#999)}input::-moz-placeholder{color:var(--input-placeholder-color,#999)}textarea::-moz-placeholder{color:var(--input-placeholder-color,#999)}input:-ms-placeholder-shown{color:var(--input-placeholder-color,#999)}
|
package/dist/es/utils.js
ADDED
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
//#region components/utils.ts
|
|
2
|
+
function e() {
|
|
3
|
+
return typeof window < "u" && typeof document < "u";
|
|
4
|
+
}
|
|
5
|
+
function t(t) {
|
|
6
|
+
return new Promise((n, r) => {
|
|
7
|
+
if (!e()) {
|
|
8
|
+
n({
|
|
9
|
+
naturalWidth: 0,
|
|
10
|
+
naturalHeight: 0
|
|
11
|
+
});
|
|
12
|
+
return;
|
|
13
|
+
}
|
|
14
|
+
let i = new Image(), a = !1, o = (e) => {
|
|
15
|
+
a || (a = !0, i.onload = null, i.onerror = null, e());
|
|
16
|
+
};
|
|
17
|
+
i.onload = () => {
|
|
18
|
+
o(() => {
|
|
19
|
+
n({
|
|
20
|
+
naturalWidth: i.naturalWidth,
|
|
21
|
+
naturalHeight: i.naturalHeight
|
|
22
|
+
});
|
|
23
|
+
});
|
|
24
|
+
}, i.onerror = () => {
|
|
25
|
+
o(() => {
|
|
26
|
+
n({
|
|
27
|
+
naturalWidth: 0,
|
|
28
|
+
naturalHeight: 0
|
|
29
|
+
});
|
|
30
|
+
});
|
|
31
|
+
}, i.src = t, i.complete && setTimeout(() => {
|
|
32
|
+
o(() => {
|
|
33
|
+
n({
|
|
34
|
+
naturalWidth: i.naturalWidth,
|
|
35
|
+
naturalHeight: i.naturalHeight
|
|
36
|
+
});
|
|
37
|
+
});
|
|
38
|
+
}, 0);
|
|
39
|
+
});
|
|
40
|
+
}
|
|
41
|
+
//#endregion
|
|
42
|
+
export { t as getImageSize, e as isClient };
|
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`vue`)):typeof define==`function`&&define.amd?define([`exports`,`vue`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e[`rox-v`]={},e.Vue))})(this,function(e,t){Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var n=Object.defineProperty,r=(e,t)=>{let r={};for(var i in e)n(r,i,{get:e[i],enumerable:!0});return t||n(r,Symbol.toStringTag,{value:`Module`}),r},i=[`inputmode`,`maxlength`],a=(0,t.defineComponent)({name:`InputOtp`,__name:`input-otp`,props:{modelValue:{default:``},length:{default:6},itemClass:{default:``},activeItemClass:{default:``},gap:{default:`10px`},hasFilledItemClass:{default:`active`},type:{default:`number`},autoFocus:{type:Boolean,default:!1}},emits:[`update:modelValue`,`complete`,`enter`],setup(e,{emit:n}){let r=[`ArrowLeft`,`ArrowRight`,`Home`,`End`],a=e,o=n,s=(0,t.ref)(null),c=(0,t.ref)(a.modelValue);(0,t.watch)(()=>a.modelValue,e=>{e!==c.value&&(c.value=e)});function l(e){let t=e.target.value;t=a.type===`text`?t.replace(/[^\dA-Za-z]/g,``):t.replace(/\D/g,``),t=t.slice(0,a.length),c.value=t,o(`update:modelValue`,t),t.length===a.length&&o(`complete`,t)}function u(){(0,t.nextTick)(()=>{if(s.value){let e=c.value.length;s.value.setSelectionRange?.(e,e)}})}function d(e){let t=c.value,n=e.key;if(n===`Backspace`||n===`Delete`){if(e.preventDefault(),t.length>0){let e=t.slice(0,-1);c.value=e,o(`update:modelValue`,e),u()}}else r.includes(n)&&e.preventDefault()}function f(){a.modelValue.length>=a.length&&o(`enter`)}function p(){s.value?.focus()}function m(e){return e===c.value.length}function h(e){return e<c.value.length}return(0,t.onMounted)(()=>{a.autoFocus&&p()}),(0,t.watch)(()=>a.autoFocus,e=>{e&&p()}),(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`otp-wrapper`,onClick:p},[(0,t.withDirectives)((0,t.createElementVNode)(`input`,{inputmode:a.type===`text`?`text`:`numeric`,autocomplete:`one-time-code`,ref_key:`inputRef`,ref:s,"onUpdate:modelValue":r[0]||=e=>c.value=e,maxlength:e.length,onInput:l,onKeydown:d,onKeyup:(0,t.withKeys)(f,[`enter`]),onFocus:u,style:{position:`absolute`,opacity:`0`,"pointer-events":`none`,width:`1px`,height:`1px`}},null,40,i),[[t.vModelText,c.value]]),(0,t.createElementVNode)(`div`,{class:`otp-box`,style:(0,t.normalizeStyle)({gap:a.gap})},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(e.length,(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:n,class:(0,t.normalizeClass)([`otp-item`,[{[a.activeItemClass]:m(n)},{[a.hasFilledItemClass]:h(n)},a.itemClass]])},(0,t.toDisplayString)(c.value[n]||``),3))),128))],4)]))}}),o=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},s=o(a,[[`__scopeId`,`data-v-fd524a3d`]]);s.install=e=>(s.name&&e.component(s.name,s),e);var c=s,l=o((0,t.defineComponent)({name:`Popup`,__name:`popup`,props:(0,t.mergeModels)({to:{default:`body`},bg:{default:`rgba(0, 0, 0, .5)`},duration:{default:150},position:{default:`bottom`},maskClosable:{type:Boolean,default:!0},top:{default:`0px`},left:{default:`0px`},right:{default:`0px`},bottom:{default:`0px`},zIndex:{default:50}},{modelValue:{type:Boolean,default:!1},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let n=[`bottom`,`left`,`right`,`top`,`center`],r=(0,t.useModel)(e,`modelValue`),i=e;function a(){i.maskClosable&&(r.value=!1)}return(e,o)=>((0,t.openBlock)(),(0,t.createBlock)(t.Teleport,{to:i.to},[(0,t.createVNode)(t.Transition,{name:`fade`},{default:(0,t.withCtx)(()=>[r.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,style:(0,t.normalizeStyle)({"--duration":`${i.duration}ms`,backgroundColor:i.bg,top:i.top,left:i.left,right:i.right,bottom:i.bottom,zIndex:i.zIndex}),class:(0,t.normalizeClass)([`popup-container`,[`popup-container-${i.position}`,{"popup-container-bottom":!n.includes(i.position)}]]),onClick:a},[(0,t.createElementVNode)(`div`,{class:`popup-content`,onClick:o[0]||=(0,t.withModifiers)(()=>{},[`stop`])},[(0,t.renderSlot)(e.$slots,`default`,{},void 0,!0)])],6)):(0,t.createCommentVNode)(``,!0)]),_:3})],8,[`to`]))}}),[[`__scopeId`,`data-v-49c688c4`]]);l.install=e=>(l.name&&e.component(l.name,l),e);var u=l,d=[`type`],f=o((0,t.defineComponent)({name:`Button`,__name:`button`,props:{padding:{default:`8px 16px`},block:{type:Boolean,default:!1},bg:{default:`transparent`},border:{default:`1px solid #1A171B`},radius:{default:`0`},disabled:{type:Boolean,default:!1},type:{default:`button`},disabledBg:{default:`rgba(26,23,27,0.16)`},enableDisabledClick:{type:Boolean,default:!1}},emits:[`click`],setup(e,{emit:n}){let r=n,i=e,a=e=>{(!i.disabled||i.enableDisabledClick)&&r(`click`,e)};return(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{onClick:a,class:(0,t.normalizeClass)([`button-container`,{block:i.block,disabled:i.disabled}]),type:i.type,style:(0,t.normalizeStyle)({padding:i.padding,border:i.border,borderRadius:i.radius,"--bg":i.bg,"--disabled-bg":i.disabledBg})},[(0,t.renderSlot)(e.$slots,`default`,{},void 0,!0)],14,d))}}),[[`__scopeId`,`data-v-1d025e54`]]);f.install=e=>(f.name&&e.component(f.name,f),e);var p=f,m=o((0,t.defineComponent)({name:`Collapse`,__name:`collapse`,props:{open:{type:Boolean,default:!1},maxHeight:{default:`100dvh`},duration:{default:200}},setup(e){let n=e;return(e,r)=>((0,t.openBlock)(),(0,t.createBlock)(t.Transition,{name:`collapse`},{default:(0,t.withCtx)(()=>[n.open?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:`collapse-content`,style:(0,t.normalizeStyle)({"--max-height":n.maxHeight,"--duration":n.duration+`ms`})},[(0,t.renderSlot)(e.$slots,`default`,{},void 0,!0)],4)):(0,t.createCommentVNode)(``,!0)]),_:3}))}}),[[`__scopeId`,`data-v-46a0054a`]]);m.install=e=>(m.name&&e.component(m.name,m),e);var h=m,g={class:`input-box`},_=[`type`,`placeholder`],v=[`src`],y=o((0,t.defineComponent)({name:`Input`,__name:`input`,props:(0,t.mergeModels)({placeholder:{default:``},type:{default:`text`},iconVisible:{type:Boolean,default:!1},icon:{default:``},autoFocus:{type:Boolean,default:!1}},{modelValue:{type:String,default:``},modelModifiers:{}}),emits:(0,t.mergeModels)([`click`,`enter`],[`update:modelValue`]),setup(e,{emit:n}){let r=n,i=(0,t.useTemplateRef)(`input`),a=(0,t.useModel)(e,`modelValue`),o=e,s=()=>{r(`click`),i.value?.focus?.(),setTimeout(()=>{let e=a.value.length;i.value?.setSelectionRange?.(e,e)},0)};return(0,t.onMounted)(()=>{o.autoFocus&&i.value?.focus?.()}),(0,t.watch)(()=>o.autoFocus,e=>{e&&i.value?.focus?.()}),(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,g,[(0,t.withDirectives)((0,t.createElementVNode)(`input`,{type:o.type,"onUpdate:modelValue":n[0]||=e=>a.value=e,ref:`input`,placeholder:o.placeholder,onKeyup:n[1]||=(0,t.withKeys)(t=>e.$emit(`enter`),[`enter`])},null,40,_),[[t.vModelDynamic,a.value]]),o.icon?(0,t.withDirectives)(((0,t.openBlock)(),(0,t.createElementBlock)(`img`,{key:0,src:o.icon,alt:`icon`,onClick:s},null,8,v)),[[t.vShow,o.iconVisible]]):(0,t.createCommentVNode)(``,!0)]))}}),[[`__scopeId`,`data-v-238a598a`]]);y.install=e=>(y.name&&e.component(y.name,y),e);var b=y,x={class:`menu-label`},S=[`src`],C=[`src`],w=(0,t.defineComponent)({name:`MenuItem`,__name:`menu-item`,props:(0,t.mergeModels)({checkedIcon:{},checkedIconClass:{},suffixIcon:{},suffixIconClass:{},itemContainerClass:{},itemGap:{},activeItemClass:{},subMenuContainerClass:{},deep:{},item:{},parentValue:{}},{modelValue:{type:Array,default:()=>[]},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let n=(0,t.useModel)(e,`modelValue`),r=e,i=(0,t.ref)(!1),a=()=>i.value=!0,o=()=>i.value=!1,s=()=>{r.item.children?.length||(n.value=[...r.parentValue,r.item.value])};return(c,l)=>{let u=(0,t.resolveComponent)(`MenuItem`,!0);return(0,t.openBlock)(),(0,t.createElementBlock)(`div`,{onMouseenter:a,onMouseleave:o,style:{padding:`0 8px`}},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`menu-item-inner`,[r.itemContainerClass,{active:n.value?.[r.deep]===e.item.value},{[r.activeItemClass]:n.value?.[r.deep]===e.item.value}]]),onClick:s},[(0,t.createElementVNode)(`div`,x,(0,t.toDisplayString)(e.item.label),1),e.suffixIcon&&e.item.children?.length?((0,t.openBlock)(),(0,t.createElementBlock)(`img`,{key:0,src:r.suffixIcon,class:(0,t.normalizeClass)([`suffix-icon`,r.suffixIconClass]),alt:`suffix-icon`},null,10,S)):(0,t.createCommentVNode)(``,!0),e.checkedIcon&&!e.item.children?.length&&n.value?.[r.deep]===e.item.value?((0,t.openBlock)(),(0,t.createElementBlock)(`img`,{key:1,src:r.checkedIcon,class:(0,t.normalizeClass)([`checked-icon`,r.checkedIconClass]),alt:`checked-icon`},null,10,C)):(0,t.createCommentVNode)(``,!0)],2),e.item.children?.length?((0,t.openBlock)(),(0,t.createBlock)(t.Transition,{key:0,name:`fade`},{default:(0,t.withCtx)(()=>[i.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:(0,t.normalizeClass)([`sub-menu-box list-box`,e.subMenuContainerClass])},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(e.item.children,(i,a)=>((0,t.openBlock)(),(0,t.createBlock)(u,{key:a,modelValue:n.value,"onUpdate:modelValue":l[0]||=e=>n.value=e,item:i,"suffix-icon":e.suffixIcon,"suffix-icon-class":e.suffixIconClass,"checked-icon":e.checkedIcon,"checked-icon-class":e.checkedIconClass,"item-container-class":e.itemContainerClass,"item-gap":e.itemGap,deep:r.deep+1,"active-item-class":r.activeItemClass,"parent-value":r.parentValue.concat(e.item.value)},null,8,[`modelValue`,`item`,`suffix-icon`,`suffix-icon-class`,`checked-icon`,`checked-icon-class`,`item-container-class`,`item-gap`,`deep`,`active-item-class`,`parent-value`]))),128))],2)):(0,t.createCommentVNode)(``,!0)]),_:1})):(0,t.createCommentVNode)(``,!0)],32)}}}),T={key:0,class:`menu-list-box`},E=o((0,t.defineComponent)({name:`Menu`,__name:`menu`,props:(0,t.mergeModels)({duration:{default:100},items:{default:()=>[]},suffixIcon:{},suffixIconClass:{},checkedIcon:{},checkedIconClass:{},listContainerClass:{default:``},subMenuContainerClass:{default:``},defaultContainerClass:{default:``},itemContainerClass:{},itemGap:{default:`4px`},activeItemClass:{default:``}},{modelValue:{type:Array,default:()=>[]},modelModifiers:{}}),emits:(0,t.mergeModels)([`open`,`close`],[`update:modelValue`]),setup(e,{emit:n}){let r=n,i=(0,t.useModel)(e,`modelValue`),a=e,o=(0,t.ref)(!1),s=()=>o.value=!0,c=()=>o.value=!1;return(0,t.watch)(i,()=>{o.value=!1}),(0,t.watch)(o,e=>{r(e?`open`:`close`)}),(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`menu-box`,style:(0,t.normalizeStyle)({"--duration":a.duration+`ms`})},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`default-box`,a.defaultContainerClass]),onMouseenter:s,onMouseleave:c},[(0,t.renderSlot)(n.$slots,`default`,{},void 0,!0),(0,t.createVNode)(t.Transition,{name:`fade`},{default:(0,t.withCtx)(()=>[o.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,T,[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`menu-item-box`,a.listContainerClass]),style:(0,t.normalizeStyle)({"--gap":a.itemGap})},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(a.items,(n,o)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:o,class:`menu-item`},[(0,t.createVNode)(w,{modelValue:i.value,"onUpdate:modelValue":r[0]||=e=>i.value=e,item:n,"suffix-icon":e.suffixIcon,"suffix-icon-class":e.suffixIconClass,"checked-icon":e.checkedIcon,"checked-icon-class":e.checkedIconClass,"item-container-class":e.itemContainerClass,"item-gap":a.itemGap,deep:0,"active-item-class":a.activeItemClass,"sub-menu-container-class":a.subMenuContainerClass,"parent-value":[]},null,8,[`modelValue`,`item`,`suffix-icon`,`suffix-icon-class`,`checked-icon`,`checked-icon-class`,`item-container-class`,`item-gap`,`active-item-class`,`sub-menu-container-class`])]))),128))],6)])):(0,t.createCommentVNode)(``,!0)]),_:1})],34)],4))}}),[[`__scopeId`,`data-v-b7084c6e`]]);E.install=e=>(E.name&&e.component(E.name,E),e);var D=E,O={class:`tab-list-container-inner`},k=[`onClick`],A=o((0,t.defineComponent)({name:`Tab`,__name:`tab`,props:(0,t.mergeModels)({items:{default:()=>[]},gap:{default:`10px`},tabContainerClass:{default:``},tabItemClass:{default:``},panelContainerClass:{default:``},panelItemClass:{default:``},activeLineClass:{default:``}},{modelValue:{type:Number,default:0},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let n=(0,t.useTemplateRef)(`item`),r=(0,t.ref)(!0),i=(0,t.useModel)(e,`modelValue`),a=e,o=(0,t.reactive)({left:0,width:0}),s=()=>{if(!n.value)return;let e=n.value[i.value];if(!e)return;let{offsetWidth:t,offsetLeft:r}=e;o.left=r||0,o.width=t||0};return(0,t.watch)(i,()=>{r.value&&=!1,s()}),(0,t.onMounted)(async()=>{s()}),(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`tab-box-container`,style:(0,t.normalizeStyle)({"--gap":a.gap})},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`tab-list-container`,a.tabContainerClass])},[(0,t.createElementVNode)(`div`,O,[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(a.items,(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:r,class:(0,t.normalizeClass)([`tab-item-box`,a.tabItemClass]),onClick:e=>i.value=r,ref_for:!0,ref:`item`},[(0,t.renderSlot)(e.$slots,`default`,{item:n,index:r,active:i.value===r},void 0,!0)],10,k))),128)),(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`active-tab-item-box`,[{initial:r.value},a.activeLineClass]]),style:(0,t.normalizeStyle)({left:o.left+`px`,width:o.width+`px`})},null,6)])],2),(0,t.renderSlot)(e.$slots,`middle`,{},void 0,!0),(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`panel-list-container`,a.panelContainerClass])},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(a.items,(n,r)=>(0,t.withDirectives)(((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:r,class:(0,t.normalizeClass)([`panel-item-box`,a.panelItemClass])},[(0,t.renderSlot)(e.$slots,`panel`,{item:n,index:r,active:i.value===r},void 0,!0)],2)),[[t.vShow,i.value===r]])),128))],2)],4))}}),[[`__scopeId`,`data-v-fd2c8809`]]);A.install=e=>(A.name&&e.component(A.name,A),e);var j=(0,t.reactive)({toasts:[]}),M=3e3;function N(){return`xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx`.replace(/[xy]/g,function(e){var t=Math.random()*16|0;return(e==`x`?t:t&3|8).toString(16)})}function P(e){if(e===void 0)j.toasts=[];else{let t=j.toasts.findIndex(t=>t.id===e);t!==-1&&j.toasts.splice(t,1)}}function F(e){let t={id:N(),message:e?.message||``,duration:e?.duration||M,type:e?.type||`info`};return setTimeout(()=>{j.toasts.push(t)},0),setTimeout(()=>{P(t.id)},t.duration),t.id}function I(){return{toast:F,success:(e,t=M)=>F({message:e,duration:t,type:`success`}),error:(e,t=M)=>F({message:e,duration:t,type:`error`}),info:(e,t=M)=>F({message:e,duration:t,type:`info`}),warning:(e,t=M)=>F({message:e,duration:t,type:`warning`}),dismiss:P}}var L=(0,t.readonly)(j),R={class:`toast-item`},z=(0,t.defineComponent)({name:`ToastItem`,__name:`toast-item`,props:{toast:{},bg:{},top:{},toasterClass:{},titleClass:{},messageClass:{}},setup(e){return(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,R,[e.toast.message?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:(0,t.normalizeClass)([`title-box`,e.titleClass])},[n.$slots[`success-icon`]&&e.toast.type===`success`?(0,t.renderSlot)(n.$slots,`success-icon`,{key:0}):(0,t.createCommentVNode)(``,!0),n.$slots[`error-icon`]&&e.toast.type===`error`?(0,t.renderSlot)(n.$slots,`error-icon`,{key:1}):(0,t.createCommentVNode)(``,!0),n.$slots[`info-icon`]&&e.toast.type===`info`?(0,t.renderSlot)(n.$slots,`info-icon`,{key:2}):(0,t.createCommentVNode)(``,!0),n.$slots[`warning-icon`]&&e.toast.type===`warning`?(0,t.renderSlot)(n.$slots,`warning-icon`,{key:3}):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`span`,{class:(0,t.normalizeClass)([`message`,e.messageClass])},(0,t.toDisplayString)(e.toast.message),3)],2)):(0,t.createCommentVNode)(``,!0)]))}}),B=o((0,t.defineComponent)({name:`Toaster`,__name:`toaster`,props:{to:{default:`body`},bg:{default:`rgba(0, 0, 0, 0.6)`},top:{default:`20px`},toasterClass:{default:``},titleClass:{default:``},messageClass:{default:``}},setup(e){let n=e;return(r,i)=>((0,t.openBlock)(),(0,t.createBlock)(t.Teleport,{to:e.to},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`toaster-box`,n.toasterClass]),style:(0,t.normalizeStyle)({"--toast-bg":n.bg,top:n.top})},[(0,t.createVNode)(t.TransitionGroup,{name:`toast-fade`},{default:(0,t.withCtx)(()=>[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)((0,t.unref)(L).toasts,e=>((0,t.openBlock)(),(0,t.createBlock)(z,{key:e.id,toast:e,"title-class":n.titleClass,"message-class":n.messageClass},{"success-icon":(0,t.withCtx)(()=>[(0,t.renderSlot)(r.$slots,`success-icon`,{},void 0,!0)]),"error-icon":(0,t.withCtx)(()=>[(0,t.renderSlot)(r.$slots,`error-icon`,{},void 0,!0)]),"info-icon":(0,t.withCtx)(()=>[(0,t.renderSlot)(r.$slots,`info-icon`,{},void 0,!0)]),"warning-icon":(0,t.withCtx)(()=>[(0,t.renderSlot)(r.$slots,`warning-icon`,{},void 0,!0)]),_:3},8,[`toast`,`title-class`,`message-class`]))),128))]),_:3})],6)],8,[`to`]))}}),[[`__scopeId`,`data-v-7faa65fe`]]);B.install=function(e){return B.name&&e.component(B.name,B),e};var V=B,H=o((0,t.defineComponent)({name:`Loading`,__name:`loading`,props:{bg:{default:`transparent`},dotColor:{default:`#1a171b`},dotSize:{default:`8px`},dotGap:{default:`4px`},visible:{type:Boolean,default:!1},amplitude:{default:`15px`}},setup(e){let n=e;return(e,r)=>((0,t.openBlock)(),(0,t.createBlock)(t.Transition,{name:`fade`},{default:(0,t.withCtx)(()=>[n.visible?((0,t.openBlock)(),(0,t.createElementBlock)(`section`,{key:0,class:`loading-box`,style:(0,t.normalizeStyle)({"--bg":n.bg,"--dot-color":n.dotColor,"--dot-size":n.dotSize,"--dot-gap":n.dotGap,"--amplitude":n.amplitude})},[...r[0]||=[(0,t.createElementVNode)(`div`,{class:`loading-dot`},null,-1),(0,t.createElementVNode)(`div`,{class:`loading-dot`},null,-1),(0,t.createElementVNode)(`div`,{class:`loading-dot`},null,-1)]],4)):(0,t.createCommentVNode)(``,!0)]),_:1}))}}),[[`__scopeId`,`data-v-2c2a7c13`]]);H.install=e=>(H.name&&e.component(H.name,H),e);var U=H,W=r({Button:()=>p,Collapse:()=>h,Input:()=>b,InputOtp:()=>c,Loading:()=>U,Menu:()=>D,Popup:()=>u,Tab:()=>A,Toaster:()=>V,useToast:()=>I}),G=e=>(Object.keys(W).forEach(t=>{let n=W[t];n.install&&e.use(n)}),e),K={install:G};e.Button=p,e.Collapse=h,e.Input=b,e.InputOtp=c,e.Loading=U,e.Menu=D,e.Popup=u,e.Tab=A,e.Toaster=V,e.default=K,e.install=G,e.useToast=I});
|
|
1
|
+
(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`vue`)):typeof define==`function`&&define.amd?define([`exports`,`vue`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e[`rox-v`]={},e.Vue))})(this,function(e,t){Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var n=Object.defineProperty,r=(e,t)=>{let r={};for(var i in e)n(r,i,{get:e[i],enumerable:!0});return t||n(r,Symbol.toStringTag,{value:`Module`}),r},i=[`inputmode`,`maxlength`],a=(0,t.defineComponent)({name:`InputOtp`,__name:`input-otp`,props:{modelValue:{default:``},length:{default:6},itemClass:{default:``},activeItemClass:{default:``},gap:{default:`10px`},hasFilledItemClass:{default:`active`},type:{default:`number`},autoFocus:{type:Boolean,default:!1}},emits:[`update:modelValue`,`complete`,`enter`],setup(e,{emit:n}){let r=[`ArrowLeft`,`ArrowRight`,`Home`,`End`],a=e,o=n,s=(0,t.ref)(null),c=(0,t.ref)(a.modelValue);(0,t.watch)(()=>a.modelValue,e=>{e!==c.value&&(c.value=e)});function l(e){let t=e.target.value;t=a.type===`text`?t.replace(/[^\dA-Za-z]/g,``):t.replace(/\D/g,``),t=t.slice(0,a.length),c.value=t,o(`update:modelValue`,t),t.length===a.length&&o(`complete`,t)}function u(){(0,t.nextTick)(()=>{if(s.value){let e=c.value.length;s.value.setSelectionRange?.(e,e)}})}function d(e){let t=c.value,n=e.key;if(n===`Backspace`||n===`Delete`){if(e.preventDefault(),t.length>0){let e=t.slice(0,-1);c.value=e,o(`update:modelValue`,e),u()}}else r.includes(n)&&e.preventDefault()}function f(){a.modelValue.length>=a.length&&o(`enter`)}function p(){s.value?.focus()}function m(e){return e===c.value.length}function h(e){return e<c.value.length}return(0,t.onMounted)(()=>{a.autoFocus&&p()}),(0,t.watch)(()=>a.autoFocus,e=>{e&&p()}),(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`otp-wrapper`,onClick:p},[(0,t.withDirectives)((0,t.createElementVNode)(`input`,{inputmode:a.type===`text`?`text`:`numeric`,autocomplete:`one-time-code`,ref_key:`inputRef`,ref:s,"onUpdate:modelValue":r[0]||=e=>c.value=e,maxlength:e.length,onInput:l,onKeydown:d,onKeyup:(0,t.withKeys)(f,[`enter`]),onFocus:u,style:{position:`absolute`,opacity:`0`,"pointer-events":`none`,width:`1px`,height:`1px`}},null,40,i),[[t.vModelText,c.value]]),(0,t.createElementVNode)(`div`,{class:`otp-box`,style:(0,t.normalizeStyle)({gap:a.gap})},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(e.length,(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:n,class:(0,t.normalizeClass)([`otp-item`,[{[a.activeItemClass]:m(n)},{[a.hasFilledItemClass]:h(n)},a.itemClass]])},(0,t.toDisplayString)(c.value[n]||``),3))),128))],4)]))}}),o=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},s=o(a,[[`__scopeId`,`data-v-fd524a3d`]]);s.install=e=>(s.name&&e.component(s.name,s),e);var c=s,l=o((0,t.defineComponent)({name:`Popup`,__name:`popup`,props:(0,t.mergeModels)({to:{default:`body`},bg:{default:`rgba(0, 0, 0, .5)`},duration:{default:150},position:{default:`bottom`},maskClosable:{type:Boolean,default:!0},top:{default:`0px`},left:{default:`0px`},right:{default:`0px`},bottom:{default:`0px`},zIndex:{default:50}},{modelValue:{type:Boolean,default:!1},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let n=[`bottom`,`left`,`right`,`top`,`center`],r=(0,t.useModel)(e,`modelValue`),i=e;function a(){i.maskClosable&&(r.value=!1)}return(e,o)=>((0,t.openBlock)(),(0,t.createBlock)(t.Teleport,{to:i.to},[(0,t.createVNode)(t.Transition,{name:`fade`},{default:(0,t.withCtx)(()=>[r.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,style:(0,t.normalizeStyle)({"--duration":`${i.duration}ms`,backgroundColor:i.bg,top:i.top,left:i.left,right:i.right,bottom:i.bottom,zIndex:i.zIndex}),class:(0,t.normalizeClass)([`popup-container`,[`popup-container-${i.position}`,{"popup-container-bottom":!n.includes(i.position)}]]),onClick:a},[(0,t.createElementVNode)(`div`,{class:`popup-content`,onClick:o[0]||=(0,t.withModifiers)(()=>{},[`stop`])},[(0,t.renderSlot)(e.$slots,`default`,{},void 0,!0)])],6)):(0,t.createCommentVNode)(``,!0)]),_:3})],8,[`to`]))}}),[[`__scopeId`,`data-v-49c688c4`]]);l.install=e=>(l.name&&e.component(l.name,l),e);var u=l,d=[`type`],f=o((0,t.defineComponent)({name:`Button`,__name:`button`,props:{padding:{default:`8px 16px`},block:{type:Boolean,default:!1},bg:{default:`transparent`},border:{default:`1px solid #1A171B`},radius:{default:`0`},disabled:{type:Boolean,default:!1},type:{default:`button`},disabledBg:{default:`rgba(26,23,27,0.16)`},enableDisabledClick:{type:Boolean,default:!1}},emits:[`click`],setup(e,{emit:n}){let r=n,i=e,a=e=>{(!i.disabled||i.enableDisabledClick)&&r(`click`,e)};return(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{onClick:a,class:(0,t.normalizeClass)([`button-container`,{block:i.block,disabled:i.disabled}]),type:i.type,style:(0,t.normalizeStyle)({padding:i.padding,border:i.border,borderRadius:i.radius,"--bg":i.bg,"--disabled-bg":i.disabledBg})},[(0,t.renderSlot)(e.$slots,`default`,{},void 0,!0)],14,d))}}),[[`__scopeId`,`data-v-1d025e54`]]);f.install=e=>(f.name&&e.component(f.name,f),e);var p=f,m=o((0,t.defineComponent)({name:`Collapse`,__name:`collapse`,props:{open:{type:Boolean,default:!1},maxHeight:{default:`100dvh`},duration:{default:200}},setup(e){let n=e;return(e,r)=>((0,t.openBlock)(),(0,t.createBlock)(t.Transition,{name:`collapse`},{default:(0,t.withCtx)(()=>[n.open?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:`collapse-content`,style:(0,t.normalizeStyle)({"--max-height":n.maxHeight,"--duration":n.duration+`ms`})},[(0,t.renderSlot)(e.$slots,`default`,{},void 0,!0)],4)):(0,t.createCommentVNode)(``,!0)]),_:3}))}}),[[`__scopeId`,`data-v-46a0054a`]]);m.install=e=>(m.name&&e.component(m.name,m),e);var h=m,g={class:`input-box`},_=[`type`,`placeholder`],v=[`src`],y=o((0,t.defineComponent)({name:`Input`,__name:`input`,props:(0,t.mergeModels)({placeholder:{default:``},type:{default:`text`},iconVisible:{type:Boolean,default:!1},icon:{default:``},autoFocus:{type:Boolean,default:!1}},{modelValue:{type:String,default:``},modelModifiers:{}}),emits:(0,t.mergeModels)([`click`,`enter`],[`update:modelValue`]),setup(e,{emit:n}){let r=n,i=(0,t.useTemplateRef)(`input`),a=(0,t.useModel)(e,`modelValue`),o=e,s=()=>{r(`click`),i.value?.focus?.(),setTimeout(()=>{let e=a.value.length;i.value?.setSelectionRange?.(e,e)},0)};return(0,t.onMounted)(()=>{o.autoFocus&&i.value?.focus?.()}),(0,t.watch)(()=>o.autoFocus,e=>{e&&i.value?.focus?.()}),(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,g,[(0,t.withDirectives)((0,t.createElementVNode)(`input`,{type:o.type,"onUpdate:modelValue":n[0]||=e=>a.value=e,ref:`input`,placeholder:o.placeholder,onKeyup:n[1]||=(0,t.withKeys)(t=>e.$emit(`enter`),[`enter`])},null,40,_),[[t.vModelDynamic,a.value]]),o.icon?(0,t.withDirectives)(((0,t.openBlock)(),(0,t.createElementBlock)(`img`,{key:0,src:o.icon,alt:`icon`,onClick:s},null,8,v)),[[t.vShow,o.iconVisible]]):(0,t.createCommentVNode)(``,!0)]))}}),[[`__scopeId`,`data-v-238a598a`]]);y.install=e=>(y.name&&e.component(y.name,y),e);var b=y,x={class:`menu-label`},S=[`src`],C=[`src`],w=(0,t.defineComponent)({name:`MenuItem`,__name:`menu-item`,props:(0,t.mergeModels)({checkedIcon:{},checkedIconClass:{},suffixIcon:{},suffixIconClass:{},itemContainerClass:{},itemGap:{},activeItemClass:{},subMenuContainerClass:{},deep:{},item:{},parentValue:{}},{modelValue:{type:Array,default:()=>[]},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let n=(0,t.useModel)(e,`modelValue`),r=e,i=(0,t.ref)(!1),a=()=>i.value=!0,o=()=>i.value=!1,s=()=>{r.item.children?.length||(n.value=[...r.parentValue,r.item.value])};return(c,l)=>{let u=(0,t.resolveComponent)(`MenuItem`,!0);return(0,t.openBlock)(),(0,t.createElementBlock)(`div`,{onMouseenter:a,onMouseleave:o,style:{padding:`0 8px`}},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`menu-item-inner`,[r.itemContainerClass,{active:n.value?.[r.deep]===e.item.value},{[r.activeItemClass]:n.value?.[r.deep]===e.item.value}]]),onClick:s},[(0,t.createElementVNode)(`div`,x,(0,t.toDisplayString)(e.item.label),1),e.suffixIcon&&e.item.children?.length?((0,t.openBlock)(),(0,t.createElementBlock)(`img`,{key:0,src:r.suffixIcon,class:(0,t.normalizeClass)([`suffix-icon`,r.suffixIconClass]),alt:`suffix-icon`},null,10,S)):(0,t.createCommentVNode)(``,!0),e.checkedIcon&&!e.item.children?.length&&n.value?.[r.deep]===e.item.value?((0,t.openBlock)(),(0,t.createElementBlock)(`img`,{key:1,src:r.checkedIcon,class:(0,t.normalizeClass)([`checked-icon`,r.checkedIconClass]),alt:`checked-icon`},null,10,C)):(0,t.createCommentVNode)(``,!0)],2),e.item.children?.length?((0,t.openBlock)(),(0,t.createBlock)(t.Transition,{key:0,name:`fade`},{default:(0,t.withCtx)(()=>[i.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:(0,t.normalizeClass)([`sub-menu-box list-box`,e.subMenuContainerClass])},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(e.item.children,(i,a)=>((0,t.openBlock)(),(0,t.createBlock)(u,{key:a,modelValue:n.value,"onUpdate:modelValue":l[0]||=e=>n.value=e,item:i,"suffix-icon":e.suffixIcon,"suffix-icon-class":e.suffixIconClass,"checked-icon":e.checkedIcon,"checked-icon-class":e.checkedIconClass,"item-container-class":e.itemContainerClass,"item-gap":e.itemGap,deep:r.deep+1,"active-item-class":r.activeItemClass,"parent-value":r.parentValue.concat(e.item.value)},null,8,[`modelValue`,`item`,`suffix-icon`,`suffix-icon-class`,`checked-icon`,`checked-icon-class`,`item-container-class`,`item-gap`,`deep`,`active-item-class`,`parent-value`]))),128))],2)):(0,t.createCommentVNode)(``,!0)]),_:1})):(0,t.createCommentVNode)(``,!0)],32)}}}),T={key:0,class:`menu-list-box`},E=o((0,t.defineComponent)({name:`Menu`,__name:`menu`,props:(0,t.mergeModels)({duration:{default:100},items:{default:()=>[]},suffixIcon:{},suffixIconClass:{},checkedIcon:{},checkedIconClass:{},listContainerClass:{default:``},subMenuContainerClass:{default:``},defaultContainerClass:{default:``},itemContainerClass:{},itemGap:{default:`4px`},activeItemClass:{default:``}},{modelValue:{type:Array,default:()=>[]},modelModifiers:{}}),emits:(0,t.mergeModels)([`open`,`close`],[`update:modelValue`]),setup(e,{emit:n}){let r=n,i=(0,t.useModel)(e,`modelValue`),a=e,o=(0,t.ref)(!1),s=()=>o.value=!0,c=()=>o.value=!1;return(0,t.watch)(i,()=>{o.value=!1}),(0,t.watch)(o,e=>{r(e?`open`:`close`)}),(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`menu-box`,style:(0,t.normalizeStyle)({"--duration":a.duration+`ms`})},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`default-box`,a.defaultContainerClass]),onMouseenter:s,onMouseleave:c},[(0,t.renderSlot)(n.$slots,`default`,{},void 0,!0),(0,t.createVNode)(t.Transition,{name:`fade`},{default:(0,t.withCtx)(()=>[o.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,T,[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`menu-item-box`,a.listContainerClass]),style:(0,t.normalizeStyle)({"--gap":a.itemGap})},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(a.items,(n,o)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:o,class:`menu-item`},[(0,t.createVNode)(w,{modelValue:i.value,"onUpdate:modelValue":r[0]||=e=>i.value=e,item:n,"suffix-icon":e.suffixIcon,"suffix-icon-class":e.suffixIconClass,"checked-icon":e.checkedIcon,"checked-icon-class":e.checkedIconClass,"item-container-class":e.itemContainerClass,"item-gap":a.itemGap,deep:0,"active-item-class":a.activeItemClass,"sub-menu-container-class":a.subMenuContainerClass,"parent-value":[]},null,8,[`modelValue`,`item`,`suffix-icon`,`suffix-icon-class`,`checked-icon`,`checked-icon-class`,`item-container-class`,`item-gap`,`active-item-class`,`sub-menu-container-class`])]))),128))],6)])):(0,t.createCommentVNode)(``,!0)]),_:1})],34)],4))}}),[[`__scopeId`,`data-v-b7084c6e`]]);E.install=e=>(E.name&&e.component(E.name,E),e);var D=E,O={class:`tab-list-container-inner`},k=[`onClick`],A=o((0,t.defineComponent)({name:`Tab`,__name:`tab`,props:(0,t.mergeModels)({items:{default:()=>[]},gap:{default:`10px`},tabContainerClass:{default:``},tabItemClass:{default:``},panelContainerClass:{default:``},panelItemClass:{default:``},activeLineClass:{default:``}},{modelValue:{type:Number,default:0},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let n=(0,t.useTemplateRef)(`item`),r=(0,t.ref)(!0),i=(0,t.useModel)(e,`modelValue`),a=e,o=(0,t.reactive)({left:0,width:0}),s=()=>{if(!n.value)return;let e=n.value[i.value];if(!e)return;let{offsetWidth:t,offsetLeft:r}=e;o.left=r||0,o.width=t||0};return(0,t.watch)(i,()=>{r.value&&=!1,s()}),(0,t.onMounted)(async()=>{s()}),(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`tab-box-container`,style:(0,t.normalizeStyle)({"--gap":a.gap})},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`tab-list-container`,a.tabContainerClass])},[(0,t.createElementVNode)(`div`,O,[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(a.items,(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:r,class:(0,t.normalizeClass)([`tab-item-box`,a.tabItemClass]),onClick:e=>i.value=r,ref_for:!0,ref:`item`},[(0,t.renderSlot)(e.$slots,`default`,{item:n,index:r,active:i.value===r},void 0,!0)],10,k))),128)),(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`active-tab-item-box`,[{initial:r.value},a.activeLineClass]]),style:(0,t.normalizeStyle)({left:o.left+`px`,width:o.width+`px`})},null,6)])],2),(0,t.renderSlot)(e.$slots,`middle`,{},void 0,!0),(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`panel-list-container`,a.panelContainerClass])},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(a.items,(n,r)=>(0,t.withDirectives)(((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:r,class:(0,t.normalizeClass)([`panel-item-box`,a.panelItemClass])},[(0,t.renderSlot)(e.$slots,`panel`,{item:n,index:r,active:i.value===r},void 0,!0)],2)),[[t.vShow,i.value===r]])),128))],2)],4))}}),[[`__scopeId`,`data-v-fd2c8809`]]);A.install=e=>(A.name&&e.component(A.name,A),e);var j=(0,t.reactive)({toasts:[]}),M=3e3;function N(){return`xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx`.replace(/[xy]/g,function(e){var t=Math.random()*16|0;return(e==`x`?t:t&3|8).toString(16)})}function P(e){if(e===void 0)j.toasts=[];else{let t=j.toasts.findIndex(t=>t.id===e);t!==-1&&j.toasts.splice(t,1)}}function F(e){let t={id:N(),message:e?.message||``,duration:e?.duration||M,type:e?.type||`info`};return setTimeout(()=>{j.toasts.push(t)},0),setTimeout(()=>{P(t.id)},t.duration),t.id}function I(){return{toast:F,success:(e,t=M)=>F({message:e,duration:t,type:`success`}),error:(e,t=M)=>F({message:e,duration:t,type:`error`}),info:(e,t=M)=>F({message:e,duration:t,type:`info`}),warning:(e,t=M)=>F({message:e,duration:t,type:`warning`}),dismiss:P}}var L=(0,t.readonly)(j),R={class:`toast-item`},z=(0,t.defineComponent)({name:`ToastItem`,__name:`toast-item`,props:{toast:{},bg:{},top:{},toasterClass:{},titleClass:{},messageClass:{}},setup(e){return(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,R,[e.toast.message?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:(0,t.normalizeClass)([`title-box`,e.titleClass])},[n.$slots[`success-icon`]&&e.toast.type===`success`?(0,t.renderSlot)(n.$slots,`success-icon`,{key:0}):(0,t.createCommentVNode)(``,!0),n.$slots[`error-icon`]&&e.toast.type===`error`?(0,t.renderSlot)(n.$slots,`error-icon`,{key:1}):(0,t.createCommentVNode)(``,!0),n.$slots[`info-icon`]&&e.toast.type===`info`?(0,t.renderSlot)(n.$slots,`info-icon`,{key:2}):(0,t.createCommentVNode)(``,!0),n.$slots[`warning-icon`]&&e.toast.type===`warning`?(0,t.renderSlot)(n.$slots,`warning-icon`,{key:3}):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`span`,{class:(0,t.normalizeClass)([`message`,e.messageClass])},(0,t.toDisplayString)(e.toast.message),3)],2)):(0,t.createCommentVNode)(``,!0)]))}}),B=o((0,t.defineComponent)({name:`Toaster`,__name:`toaster`,props:{to:{default:`body`},bg:{default:`rgba(0, 0, 0, 0.6)`},top:{default:`20px`},toasterClass:{default:``},titleClass:{default:``},messageClass:{default:``}},setup(e){let n=e;return(r,i)=>((0,t.openBlock)(),(0,t.createBlock)(t.Teleport,{to:e.to},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`toaster-box`,n.toasterClass]),style:(0,t.normalizeStyle)({"--toast-bg":n.bg,top:n.top})},[(0,t.createVNode)(t.TransitionGroup,{name:`toast-fade`},{default:(0,t.withCtx)(()=>[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)((0,t.unref)(L).toasts,e=>((0,t.openBlock)(),(0,t.createBlock)(z,{key:e.id,toast:e,"title-class":n.titleClass,"message-class":n.messageClass},{"success-icon":(0,t.withCtx)(()=>[(0,t.renderSlot)(r.$slots,`success-icon`,{},void 0,!0)]),"error-icon":(0,t.withCtx)(()=>[(0,t.renderSlot)(r.$slots,`error-icon`,{},void 0,!0)]),"info-icon":(0,t.withCtx)(()=>[(0,t.renderSlot)(r.$slots,`info-icon`,{},void 0,!0)]),"warning-icon":(0,t.withCtx)(()=>[(0,t.renderSlot)(r.$slots,`warning-icon`,{},void 0,!0)]),_:3},8,[`toast`,`title-class`,`message-class`]))),128))]),_:3})],6)],8,[`to`]))}}),[[`__scopeId`,`data-v-7faa65fe`]]);B.install=function(e){return B.name&&e.component(B.name,B),e};var V=B,H=o((0,t.defineComponent)({name:`Loading`,__name:`loading`,props:{bg:{default:`transparent`},dotColor:{default:`#1a171b`},dotSize:{default:`8px`},dotGap:{default:`4px`},visible:{type:Boolean,default:!1},amplitude:{default:`15px`}},setup(e){let n=e;return(e,r)=>((0,t.openBlock)(),(0,t.createBlock)(t.Transition,{name:`fade`},{default:(0,t.withCtx)(()=>[n.visible?((0,t.openBlock)(),(0,t.createElementBlock)(`section`,{key:0,class:`loading-box`,style:(0,t.normalizeStyle)({"--bg":n.bg,"--dot-color":n.dotColor,"--dot-size":n.dotSize,"--dot-gap":n.dotGap,"--amplitude":n.amplitude})},[...r[0]||=[(0,t.createElementVNode)(`div`,{class:`loading-dot`},null,-1),(0,t.createElementVNode)(`div`,{class:`loading-dot`},null,-1),(0,t.createElementVNode)(`div`,{class:`loading-dot`},null,-1)]],4)):(0,t.createCommentVNode)(``,!0)]),_:1}))}}),[[`__scopeId`,`data-v-aafc58b1`]]);H.install=e=>(H.name&&e.component(H.name,H),e);var U=H;function W(){return typeof window<`u`&&typeof document<`u`}function G(e){return new Promise((t,n)=>{if(!W()){t({naturalWidth:0,naturalHeight:0});return}let r=new Image,i=!1,a=e=>{i||(i=!0,r.onload=null,r.onerror=null,e())};r.onload=()=>{a(()=>{t({naturalWidth:r.naturalWidth,naturalHeight:r.naturalHeight})})},r.onerror=()=>{a(()=>{t({naturalWidth:0,naturalHeight:0})})},r.src=e,r.complete&&setTimeout(()=>{a(()=>{t({naturalWidth:r.naturalWidth,naturalHeight:r.naturalHeight})})},0)})}var K={class:`slider-captcha-bg-box`,ref:`box`},q=[`src`],J=[`src`],Y={key:1,stroke:`currentColor`,fill:`currentColor`,"stroke-width":`0`,viewBox:`0 0 512 512`,height:`1em`,width:`1em`,xmlns:`http://www.w3.org/2000/svg`},X=o((0,t.defineComponent)({__name:`slider-captcha`,props:{background:{},block:{},width:{},blockTop:{default:0},verify:{},trackBlockBg:{default:`#f5f5f5`},trackBg:{default:`rgba(26,23,27,0.1)`}},emits:[`success`,`fail`,`change`],setup(e,{expose:n,emit:r}){let i=r,a=(0,t.ref)(!1),o=(0,t.useTemplateRef)(`box`),s=(0,t.useTemplateRef)(`thumb`),c=e,l=(0,t.reactive)({natureWidth:0,natureHeight:0,boxWidth:0,boxHeight:0}),u=(0,t.reactive)({natureWidth:0,natureHeight:0}),d=(0,t.reactive)({width:0,height:0}),f=(0,t.ref)(0),p=(0,t.ref)(0),m=(0,t.ref)(!1),h=(0,t.ref)([]),g=(0,t.computed)(()=>l.boxWidth?l.natureWidth/l.boxWidth:1),_=(0,t.computed)(()=>l.boxHeight?l.natureHeight/l.boxHeight:1),v=(0,t.computed)(()=>u.natureWidth/g.value),y=(0,t.computed)(()=>c.blockTop/_.value),b=(0,t.computed)(()=>l.boxWidth?l.boxWidth-v.value:0),x=(0,t.computed)(()=>l.boxWidth?l.boxWidth-d.width:0),S=(0,t.computed)(()=>b.value?x.value/b.value:1);function C(e){!W()||a.value||(p.value=e.clientX,m.value=!0,h.value=[],window.addEventListener(`pointermove`,w),window.addEventListener(`pointerup`,T))}function w(e){if(!m.value||a.value)return;let t=e.clientX-p.value;t=Math.min(Math.max(0,t),x.value),f.value=t;let n=t/(x.value||1)*(l.natureWidth-u.natureWidth),r=Date.now(),o=n/(l.natureWidth||1)*100;h.value.push({x:n,t:r,xPercent:o}),i(`change`,h.value)}async function T(){if(!a.value){if(m.value=!1,window.removeEventListener(`pointermove`,w),window.removeEventListener(`pointerup`,T),c.verify){let e=h.value[h.value.length-1];e||={x:0,xPercent:0,t:Date.now()},a.value=!0,await c.verify(e)?i(`success`):i(`fail`),a.value=!1}k()}}async function E(){if(!c.background)return;let{naturalWidth:e,naturalHeight:t}=await G(c.background);l.natureWidth=e,l.natureHeight=t,l.boxWidth=o.value?.clientWidth||0,l.boxHeight=o.value?.clientHeight||0}async function D(){if(!c.block)return;let{naturalWidth:e,naturalHeight:t}=await G(c.block);u.natureWidth=e,u.natureHeight=t}function O(){d.width=s.value?.clientWidth||0,d.height=s.value?.clientHeight||0}function k(){f.value=0}return(0,t.onMounted)(()=>{E(),D(),O()}),(0,t.watch)(()=>c.background,()=>{E()}),(0,t.watch)(()=>c.block,()=>{D()}),(0,t.watch)(()=>c.width,()=>{E(),D(),O()}),n({reset:k,tracks:h}),(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`slider-captcha-box`,style:(0,t.normalizeStyle)(c.width?{width:c.width+`px`}:{})},[(0,t.createElementVNode)(`div`,K,[(0,t.createElementVNode)(`img`,{src:c.background,alt:`bg`,class:`slider-captcha-bg`,draggable:!1},null,8,q),(0,t.withDirectives)((0,t.createElementVNode)(`img`,{src:c.block,alt:`block`,class:`slider-captcha-block`,style:(0,t.normalizeStyle)({top:y.value+`px`,width:v.value+`px`,transform:`translateX(${f.value/S.value}px)`}),draggable:!1},null,12,J),[[t.vShow,v.value]])],512),(0,t.createElementVNode)(`div`,{class:`slider-track-box`,style:(0,t.normalizeStyle)({"background-color":c.trackBlockBg})},[(0,t.createElementVNode)(`div`,{class:`slider-track-bg`,style:(0,t.normalizeStyle)({"background-color":c.trackBg,width:`${f.value}px`})},null,4),(0,t.createElementVNode)(`div`,{class:`slider-track-thumb`,onPointerdown:C,ref:`thumb`,style:(0,t.normalizeStyle)({transform:`translateX(${f.value}px)`})},[e.$slots.default?(0,t.renderSlot)(e.$slots,`default`,{key:0},void 0,!0):((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,Y,[...n[0]||=[(0,t.createElementVNode)(`path`,{d:`M502.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-128-128c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L402.7 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l370.7 0-73.4 73.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l128-128z`},null,-1)]]))],36)],4)],4))}}),[[`__scopeId`,`data-v-792c4317`]]);X.install=e=>(X.name&&e.component(X.name,X),e);var Z=X,Q=r({Button:()=>p,Collapse:()=>h,Input:()=>b,InputOtp:()=>c,Loading:()=>U,Menu:()=>D,Popup:()=>u,SliderCaptcha:()=>Z,Tab:()=>A,Toaster:()=>V,useToast:()=>I}),$=e=>(Object.keys(Q).forEach(t=>{let n=Q[t];n.install&&e.use(n)}),e),ee={install:$};e.Button=p,e.Collapse=h,e.Input=b,e.InputOtp=c,e.Loading=U,e.Menu=D,e.Popup=u,e.SliderCaptcha=Z,e.Tab=A,e.Toaster=V,e.default=ee,e.install=$,e.useToast=I});
|
package/dist/lib/components.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
const e=require(`./_virtual/_rolldown/runtime.js`),t=require(`./input-otp/index.js`),n=require(`./popup/index.js`),r=require(`./button/index.js`),i=require(`./collapse/index.js`),a=require(`./input/index.js`),o=require(`./menu/index.js`),s=require(`./tab/index.js`),c=require(`./toast/toast.js`),l=require(`./toast/index.js`),u=require(`./loading/index.js`);var
|
|
1
|
+
const e=require(`./_virtual/_rolldown/runtime.js`),t=require(`./input-otp/index.js`),n=require(`./popup/index.js`),r=require(`./button/index.js`),i=require(`./collapse/index.js`),a=require(`./input/index.js`),o=require(`./menu/index.js`),s=require(`./tab/index.js`),c=require(`./toast/toast.js`),l=require(`./toast/index.js`),u=require(`./loading/index.js`),d=require(`./slider-captcha/index.js`);var f=e.__exportAll({Button:()=>r.default,Collapse:()=>i.default,Input:()=>a.default,InputOtp:()=>t.default,Loading:()=>u.default,Menu:()=>o.default,Popup:()=>n.default,SliderCaptcha:()=>d.default,Tab:()=>s.default,Toaster:()=>l.default,useToast:()=>c.useToast});Object.defineProperty(exports,`components_exports`,{enumerable:!0,get:function(){return f}});
|
package/dist/lib/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require(`./input-otp/index.js`),t=require(`./popup/index.js`),n=require(`./button/index.js`),r=require(`./collapse/index.js`),i=require(`./input/index.js`),a=require(`./menu/index.js`),o=require(`./tab/index.js`),s=require(`./toast/toast.js`),c=require(`./toast/index.js`),l=require(`./loading/index.js`),u=require(`./components.js`);;/* empty css */var
|
|
1
|
+
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require(`./input-otp/index.js`),t=require(`./popup/index.js`),n=require(`./button/index.js`),r=require(`./collapse/index.js`),i=require(`./input/index.js`),a=require(`./menu/index.js`),o=require(`./tab/index.js`),s=require(`./toast/toast.js`),c=require(`./toast/index.js`),l=require(`./loading/index.js`),u=require(`./slider-captcha/index.js`),d=require(`./components.js`);;/* empty css */var f=e=>(Object.keys(d.components_exports).forEach(t=>{let n=d.components_exports[t];n.install&&e.use(n)}),e),p={install:f};exports.Button=n.default,exports.Collapse=r.default,exports.Input=i.default,exports.InputOtp=e.default,exports.Loading=l.default,exports.Menu=a.default,exports.Popup=t.default,exports.SliderCaptcha=u.default,exports.Tab=o.default,exports.Toaster=c.default,exports.default=p,exports.install=f,exports.useToast=s.useToast;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const e=require(`../_virtual/_plugin-vue_export-helper.js`),t=require(`./loading.vue_vue_type_script_setup_true_lang.js`);;/* empty css */var n=e.default(t.default,[[`__scopeId`,`data-v-
|
|
1
|
+
const e=require(`../_virtual/_plugin-vue_export-helper.js`),t=require(`./loading.vue_vue_type_script_setup_true_lang.js`);;/* empty css */var n=e.default(t.default,[[`__scopeId`,`data-v-aafc58b1`]]);exports.default=n;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.fade-enter-from[data-v-
|
|
1
|
+
.fade-enter-from[data-v-aafc58b1],.fade-leave-to[data-v-aafc58b1]{opacity:0}.fade-enter-active[data-v-aafc58b1],.fade-leave-active[data-v-aafc58b1]{transition:opacity .15s ease-in-out}.loading-box[data-v-aafc58b1]{background-color:var(--bg);z-index:99;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}@keyframes bounce-aafc58b1{0%,to{transform:translateY(0)}50%{transform:translateY(var(--amplitude))}}.loading-dot[data-v-aafc58b1]{width:var(--dot-size);height:var(--dot-size);background-color:var(--dot-color);border-radius:50%;animation:1s ease-in-out infinite bounce-aafc58b1}.loading-dot~.loading-dot[data-v-aafc58b1]{margin-left:var(--dot-gap)}.loading-dot[data-v-aafc58b1]:first-child{animation-delay:0s}.loading-dot[data-v-aafc58b1]:nth-child(2){animation-delay:.2s}.loading-dot[data-v-aafc58b1]:nth-child(3){animation-delay:.4s}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
const e=require(`./slider-captcha.js`);require(`./style.css`),e.default.install=t=>(e.default.name&&t.component(e.default.name,e.default),t);var t=e.default;exports.default=t;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
const e=require(`../_virtual/_plugin-vue_export-helper.js`),t=require(`./slider-captcha.vue_vue_type_script_setup_true_lang.js`);;/* empty css */var n=e.default(t.default,[[`__scopeId`,`data-v-792c4317`]]);exports.default=n;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
const e=require(`../utils.js`);let t=require(`vue`);var n={class:`slider-captcha-bg-box`,ref:`box`},r=[`src`],i=[`src`],a={key:1,stroke:`currentColor`,fill:`currentColor`,"stroke-width":`0`,viewBox:`0 0 512 512`,height:`1em`,width:`1em`,xmlns:`http://www.w3.org/2000/svg`},o=(0,t.defineComponent)({__name:`slider-captcha`,props:{background:{},block:{},width:{},blockTop:{default:0},verify:{},trackBlockBg:{default:`#f5f5f5`},trackBg:{default:`rgba(26,23,27,0.1)`}},emits:[`success`,`fail`,`change`],setup(o,{expose:s,emit:c}){let l=c,u=(0,t.ref)(!1),d=(0,t.useTemplateRef)(`box`),f=(0,t.useTemplateRef)(`thumb`),p=o,m=(0,t.reactive)({natureWidth:0,natureHeight:0,boxWidth:0,boxHeight:0}),h=(0,t.reactive)({natureWidth:0,natureHeight:0}),g=(0,t.reactive)({width:0,height:0}),_=(0,t.ref)(0),v=(0,t.ref)(0),y=(0,t.ref)(!1),b=(0,t.ref)([]),x=(0,t.computed)(()=>m.boxWidth?m.natureWidth/m.boxWidth:1),S=(0,t.computed)(()=>m.boxHeight?m.natureHeight/m.boxHeight:1),C=(0,t.computed)(()=>h.natureWidth/x.value),w=(0,t.computed)(()=>p.blockTop/S.value),T=(0,t.computed)(()=>m.boxWidth?m.boxWidth-C.value:0),E=(0,t.computed)(()=>m.boxWidth?m.boxWidth-g.width:0),D=(0,t.computed)(()=>T.value?E.value/T.value:1);function O(t){!e.isClient()||u.value||(v.value=t.clientX,y.value=!0,b.value=[],window.addEventListener(`pointermove`,k),window.addEventListener(`pointerup`,A))}function k(e){if(!y.value||u.value)return;let t=e.clientX-v.value;t=Math.min(Math.max(0,t),E.value),_.value=t;let n=t/(E.value||1)*(m.natureWidth-h.natureWidth),r=Date.now(),i=n/(m.natureWidth||1)*100;b.value.push({x:n,t:r,xPercent:i}),l(`change`,b.value)}async function A(){if(!u.value){if(y.value=!1,window.removeEventListener(`pointermove`,k),window.removeEventListener(`pointerup`,A),p.verify){let e=b.value[b.value.length-1];e||={x:0,xPercent:0,t:Date.now()},u.value=!0,await p.verify(e)?l(`success`):l(`fail`),u.value=!1}P()}}async function j(){if(!p.background)return;let{naturalWidth:t,naturalHeight:n}=await e.getImageSize(p.background);m.natureWidth=t,m.natureHeight=n,m.boxWidth=d.value?.clientWidth||0,m.boxHeight=d.value?.clientHeight||0}async function M(){if(!p.block)return;let{naturalWidth:t,naturalHeight:n}=await e.getImageSize(p.block);h.natureWidth=t,h.natureHeight=n}function N(){g.width=f.value?.clientWidth||0,g.height=f.value?.clientHeight||0}function P(){_.value=0}return(0,t.onMounted)(()=>{j(),M(),N()}),(0,t.watch)(()=>p.background,()=>{j()}),(0,t.watch)(()=>p.block,()=>{M()}),(0,t.watch)(()=>p.width,()=>{j(),M(),N()}),s({reset:P,tracks:b}),(e,o)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`slider-captcha-box`,style:(0,t.normalizeStyle)(p.width?{width:p.width+`px`}:{})},[(0,t.createElementVNode)(`div`,n,[(0,t.createElementVNode)(`img`,{src:p.background,alt:`bg`,class:`slider-captcha-bg`,draggable:!1},null,8,r),(0,t.withDirectives)((0,t.createElementVNode)(`img`,{src:p.block,alt:`block`,class:`slider-captcha-block`,style:(0,t.normalizeStyle)({top:w.value+`px`,width:C.value+`px`,transform:`translateX(${_.value/D.value}px)`}),draggable:!1},null,12,i),[[t.vShow,C.value]])],512),(0,t.createElementVNode)(`div`,{class:`slider-track-box`,style:(0,t.normalizeStyle)({"background-color":p.trackBlockBg})},[(0,t.createElementVNode)(`div`,{class:`slider-track-bg`,style:(0,t.normalizeStyle)({"background-color":p.trackBg,width:`${_.value}px`})},null,4),(0,t.createElementVNode)(`div`,{class:`slider-track-thumb`,onPointerdown:O,ref:`thumb`,style:(0,t.normalizeStyle)({transform:`translateX(${_.value}px)`})},[e.$slots.default?(0,t.renderSlot)(e.$slots,`default`,{key:0},void 0,!0):((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,a,[...o[0]||=[(0,t.createElementVNode)(`path`,{d:`M502.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-128-128c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L402.7 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l370.7 0-73.4 73.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l128-128z`},null,-1)]]))],36)],4)],4))}});exports.default=o;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.slider-captcha-box[data-v-792c4317]{display:inline-block}.slider-captcha-bg-box[data-v-792c4317]{width:100%;font-size:0;position:relative}.slider-captcha-bg[data-v-792c4317]{width:100%}.slider-captcha-block[data-v-792c4317]{z-index:10;position:absolute;left:0}.slider-track-box[data-v-792c4317]{width:100%;position:relative}.slider-track-bg[data-v-792c4317]{height:100%;position:absolute;top:0;left:0}.slider-track-thumb[data-v-792c4317]{cursor:pointer;background-color:#1a171b0d;justify-content:center;align-items:center;width:60px;height:42px;margin-top:15px;display:flex}
|
|
File without changes
|
package/dist/lib/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:-webkit-any(input:-webkit-autofill,textarea:-webkit-autofill){-webkit-box-shadow:0 0 0 1000px var(--input-bg,#fff) inset;-webkit-text-fill-color:inherit}:is(input:autofill,textarea:autofill){-webkit-box-shadow:0 0 0 1000px var(--input-bg,#fff) inset;-webkit-text-fill-color:inherit}input:focus,textarea:focus,button:focus{outline:none}input::-webkit-input-placeholder{color:var(--input-placeholder-color,#999)}textarea::-webkit-input-placeholder{color:var(--input-placeholder-color,#999)}input::-moz-placeholder{color:var(--input-placeholder-color,#999)}textarea::-moz-placeholder{color:var(--input-placeholder-color,#999)}input:-ms-placeholder-shown{color:var(--input-placeholder-color,#999)}
|
|
1
|
+
:-webkit-any(input:-webkit-autofill,textarea:-webkit-autofill){-webkit-box-shadow:0 0 0 1000px var(--input-bg,#fff) inset;-webkit-text-fill-color:inherit}:is(input:autofill,textarea:autofill){-webkit-box-shadow:0 0 0 1000px var(--input-bg,#fff) inset;-webkit-text-fill-color:inherit}a:focus,input:focus,textarea:focus,button:focus{outline:none}input::-webkit-input-placeholder{color:var(--input-placeholder-color,#999)}textarea::-webkit-input-placeholder{color:var(--input-placeholder-color,#999)}input::-moz-placeholder{color:var(--input-placeholder-color,#999)}textarea::-moz-placeholder{color:var(--input-placeholder-color,#999)}input:-ms-placeholder-shown{color:var(--input-placeholder-color,#999)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
function e(){return typeof window<`u`&&typeof document<`u`}function t(t){return new Promise((n,r)=>{if(!e()){n({naturalWidth:0,naturalHeight:0});return}let i=new Image,a=!1,o=e=>{a||(a=!0,i.onload=null,i.onerror=null,e())};i.onload=()=>{o(()=>{n({naturalWidth:i.naturalWidth,naturalHeight:i.naturalHeight})})},i.onerror=()=>{o(()=>{n({naturalWidth:0,naturalHeight:0})})},i.src=t,i.complete&&setTimeout(()=>{o(()=>{n({naturalWidth:i.naturalWidth,naturalHeight:i.naturalHeight})})},0)})}exports.getImageSize=t,exports.isClient=e;
|
package/dist/style.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.otp-wrapper[data-v-fd524a3d]{cursor:pointer;width:400px;max-width:100%;position:relative}.otp-box[data-v-fd524a3d]{width:100%;display:flex}.otp-item[data-v-fd524a3d]{border-bottom:1px solid #00000029;flex:1;justify-content:center;align-items:center;height:60px;transition:all .2s;display:flex}.otp-item.active[data-v-fd524a3d]{border-bottom:1px solid #000}.fade-enter-from[data-v-49c688c4],.fade-leave-to[data-v-49c688c4]{opacity:0}.popup-container[data-v-49c688c4]{transition:opacity var(--duration) ease-in-out;will-change:opacity;position:fixed}.popup-content[data-v-49c688c4]{transition:transform var(--duration) ease-in-out;will-change:transform;position:absolute}.popup-container-top .popup-content[data-v-49c688c4]{top:0;left:0;right:0}.fade-enter-from.popup-container-top .popup-content[data-v-49c688c4],.fade-leave-to.popup-container-top .popup-content[data-v-49c688c4]{transform:translateY(-100%)}.popup-container-bottom .popup-content[data-v-49c688c4]{bottom:0;left:0;right:0}.fade-enter-from.popup-container-bottom .popup-content[data-v-49c688c4],.fade-leave-to.popup-container-bottom .popup-content[data-v-49c688c4]{transform:translateY(100%)}.popup-container-left .popup-content[data-v-49c688c4]{top:0;bottom:0;left:0}.fade-enter-from.popup-container-left .popup-content[data-v-49c688c4],.fade-leave-to.popup-container-left .popup-content[data-v-49c688c4]{transform:translate(-100%)}.popup-container-right .popup-content[data-v-49c688c4]{top:0;bottom:0;right:0}.fade-enter-from.popup-container-right .popup-content[data-v-49c688c4],.fade-leave-to.popup-container-right .popup-content[data-v-49c688c4]{transform:translate(100%)}.popup-container-center .popup-content[data-v-49c688c4]{will-change:auto;transform-origin:50%;transition:none;top:50%;left:50%;transform:translate(-50%,-50%)}.button-container[data-v-1d025e54]{background-color:var(--bg);cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;transition-property:background-color,border-color;transition-duration:.3s;transition-timing-function:ease-in-out}.button-container[data-v-1d025e54]:focus{outline:none}.button-container.block[data-v-1d025e54]{width:100%;display:block}.button-container.disabled[data-v-1d025e54]{background-color:var(--disabled-bg);border-color:#0000!important}.collapse-content[data-v-46a0054a]{width:max-content}.collapse-enter-from[data-v-46a0054a],.collapse-leave-to[data-v-46a0054a]{max-height:0!important}.collapse-enter-active[data-v-46a0054a],.collapse-leave-active[data-v-46a0054a]{max-height:var(--max-height);transition:max-height var(--duration) ease-in-out;overflow:hidden}.input-box[data-v-238a598a]{will-change:border-color;box-sizing:border-box;border-bottom:1px solid #00000029;align-items:center;gap:16px;height:60px;padding:16px 0;transition:border-color .2s ease-in-out;display:flex}.input-box[data-v-238a598a]:focus-within{border-color:#000}.input-box input[data-v-238a598a]{width:100%;height:100%;font-size:inherit;border:none;outline:none}input[data-v-238a598a]::-webkit-input-placeholder{color:var(--input-placeholder-color,#999)}input[data-v-238a598a]::-moz-placeholder{color:var(--input-placeholder-color,#999)}input[data-v-238a598a]:-ms-placeholder-shown{color:var(--input-placeholder-color,#999)}.input-box img[data-v-238a598a]{-o-object-fit:contain;object-fit:contain;cursor:pointer;width:24px;height:24px}.menu-box[data-v-b7084c6e]{display:inline-flex;position:relative}.default-box[data-v-b7084c6e]{box-sizing:border-box;border:1px solid #0003;align-items:center;min-width:240px;min-height:30px;padding:8px 16px;display:flex}.fade-enter-from[data-v-b7084c6e],[data-v-b7084c6e] .fade-enter-from,.fade-leave-to[data-v-b7084c6e],[data-v-b7084c6e] .fade-leave-to{opacity:0}.fade-enter-active[data-v-b7084c6e],[data-v-b7084c6e] .fade-enter-active,.fade-leave-active[data-v-b7084c6e],[data-v-b7084c6e] .fade-leave-active{transition:opacity var(--duration) ease-in-out}.menu-list-box[data-v-b7084c6e]{z-index:99;box-sizing:border-box;width:100%;padding-top:8px;position:absolute;top:100%;left:0}.menu-item-box[data-v-b7084c6e]{gap:var(--gap);box-sizing:border-box;background-color:#fff;flex-direction:column;width:100%;padding:16px 0;display:flex;position:relative;box-shadow:0 0 16px #0000000f}[data-v-b7084c6e] .menu-item-inner{box-sizing:border-box;cursor:pointer;will-change:background-color;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;width:100%;height:40px;padding:0 16px;transition:background-color .1s linear;display:flex}[data-v-b7084c6e] .menu-item-inner.active,[data-v-b7084c6e] .menu-item-inner:hover{background-color:#f8f9f9}[data-v-b7084c6e] .menu-label{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}[data-v-b7084c6e] .sub-menu-box{z-index:99;gap:var(--gap);box-sizing:border-box;background-color:#fff;border-left:1px solid #0000000f;flex-direction:column;padding:16px 8px;display:flex;position:absolute;top:0;left:100%;box-shadow:0 -16px 16px -16px #0000000f,16px 0 16px -16px #0000000f,0 16px 16px -16px #0000000f}[data-v-b7084c6e] .suffix-icon,[data-v-b7084c6e] .checked-icon{-o-object-fit:contain;object-fit:contain;width:18px;height:18px}.tab-box-container[data-v-fd2c8809]{width:100%}.tab-list-container[data-v-fd2c8809]{width:100%;overflow-x:scroll}.tab-list-container[data-v-fd2c8809]::-webkit-scrollbar{display:none}.tab-list-container-inner[data-v-fd2c8809]{flex-wrap:nowrap;display:inline-flex;position:relative}.tab-item-box[data-v-fd2c8809]{cursor:pointer;white-space:nowrap;flex-shrink:0;align-items:center}.tab-item-box~.tab-item-box[data-v-fd2c8809]{margin-left:var(--gap)}.active-tab-item-box[data-v-fd2c8809]{width:100px;height:1px;transition:left var(--transition-duration,.15s) ease-in-out, width var(--transition-duration,.15s) ease-in-out;background-color:#000;position:absolute;bottom:0;left:0}.active-tab-item-box.initial[data-v-fd2c8809]{transition:none}.panel-list-container[data-v-fd2c8809]{width:100%;min-height:200px;position:relative}.panel-item-box[data-v-fd2c8809]{width:100%;height:100%;position:absolute;top:0;left:0}.toaster-box[data-v-7faa65fe]{z-index:9999;flex-direction:column;gap:12px;display:flex;position:fixed;left:50%;transform:translate(-50%)}[data-v-7faa65fe] .toast-item{background-color:var(--toast-bg);box-sizing:border-box;min-width:220px;padding:10px 20px}[data-v-7faa65fe] .title-box{justify-content:center;align-items:center;gap:16px;display:flex}[data-v-7faa65fe] .message{color:#fff}.fade-enter-from[data-v-
|
|
1
|
+
.otp-wrapper[data-v-fd524a3d]{cursor:pointer;width:400px;max-width:100%;position:relative}.otp-box[data-v-fd524a3d]{width:100%;display:flex}.otp-item[data-v-fd524a3d]{border-bottom:1px solid #00000029;flex:1;justify-content:center;align-items:center;height:60px;transition:all .2s;display:flex}.otp-item.active[data-v-fd524a3d]{border-bottom:1px solid #000}.fade-enter-from[data-v-49c688c4],.fade-leave-to[data-v-49c688c4]{opacity:0}.popup-container[data-v-49c688c4]{transition:opacity var(--duration) ease-in-out;will-change:opacity;position:fixed}.popup-content[data-v-49c688c4]{transition:transform var(--duration) ease-in-out;will-change:transform;position:absolute}.popup-container-top .popup-content[data-v-49c688c4]{top:0;left:0;right:0}.fade-enter-from.popup-container-top .popup-content[data-v-49c688c4],.fade-leave-to.popup-container-top .popup-content[data-v-49c688c4]{transform:translateY(-100%)}.popup-container-bottom .popup-content[data-v-49c688c4]{bottom:0;left:0;right:0}.fade-enter-from.popup-container-bottom .popup-content[data-v-49c688c4],.fade-leave-to.popup-container-bottom .popup-content[data-v-49c688c4]{transform:translateY(100%)}.popup-container-left .popup-content[data-v-49c688c4]{top:0;bottom:0;left:0}.fade-enter-from.popup-container-left .popup-content[data-v-49c688c4],.fade-leave-to.popup-container-left .popup-content[data-v-49c688c4]{transform:translate(-100%)}.popup-container-right .popup-content[data-v-49c688c4]{top:0;bottom:0;right:0}.fade-enter-from.popup-container-right .popup-content[data-v-49c688c4],.fade-leave-to.popup-container-right .popup-content[data-v-49c688c4]{transform:translate(100%)}.popup-container-center .popup-content[data-v-49c688c4]{will-change:auto;transform-origin:50%;transition:none;top:50%;left:50%;transform:translate(-50%,-50%)}.button-container[data-v-1d025e54]{background-color:var(--bg);cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;transition-property:background-color,border-color;transition-duration:.3s;transition-timing-function:ease-in-out}.button-container[data-v-1d025e54]:focus{outline:none}.button-container.block[data-v-1d025e54]{width:100%;display:block}.button-container.disabled[data-v-1d025e54]{background-color:var(--disabled-bg);border-color:#0000!important}.collapse-content[data-v-46a0054a]{width:max-content}.collapse-enter-from[data-v-46a0054a],.collapse-leave-to[data-v-46a0054a]{max-height:0!important}.collapse-enter-active[data-v-46a0054a],.collapse-leave-active[data-v-46a0054a]{max-height:var(--max-height);transition:max-height var(--duration) ease-in-out;overflow:hidden}.input-box[data-v-238a598a]{will-change:border-color;box-sizing:border-box;border-bottom:1px solid #00000029;align-items:center;gap:16px;height:60px;padding:16px 0;transition:border-color .2s ease-in-out;display:flex}.input-box[data-v-238a598a]:focus-within{border-color:#000}.input-box input[data-v-238a598a]{width:100%;height:100%;font-size:inherit;border:none;outline:none}input[data-v-238a598a]::-webkit-input-placeholder{color:var(--input-placeholder-color,#999)}input[data-v-238a598a]::-moz-placeholder{color:var(--input-placeholder-color,#999)}input[data-v-238a598a]:-ms-placeholder-shown{color:var(--input-placeholder-color,#999)}.input-box img[data-v-238a598a]{-o-object-fit:contain;object-fit:contain;cursor:pointer;width:24px;height:24px}.menu-box[data-v-b7084c6e]{display:inline-flex;position:relative}.default-box[data-v-b7084c6e]{box-sizing:border-box;border:1px solid #0003;align-items:center;min-width:240px;min-height:30px;padding:8px 16px;display:flex}.fade-enter-from[data-v-b7084c6e],[data-v-b7084c6e] .fade-enter-from,.fade-leave-to[data-v-b7084c6e],[data-v-b7084c6e] .fade-leave-to{opacity:0}.fade-enter-active[data-v-b7084c6e],[data-v-b7084c6e] .fade-enter-active,.fade-leave-active[data-v-b7084c6e],[data-v-b7084c6e] .fade-leave-active{transition:opacity var(--duration) ease-in-out}.menu-list-box[data-v-b7084c6e]{z-index:99;box-sizing:border-box;width:100%;padding-top:8px;position:absolute;top:100%;left:0}.menu-item-box[data-v-b7084c6e]{gap:var(--gap);box-sizing:border-box;background-color:#fff;flex-direction:column;width:100%;padding:16px 0;display:flex;position:relative;box-shadow:0 0 16px #0000000f}[data-v-b7084c6e] .menu-item-inner{box-sizing:border-box;cursor:pointer;will-change:background-color;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;width:100%;height:40px;padding:0 16px;transition:background-color .1s linear;display:flex}[data-v-b7084c6e] .menu-item-inner.active,[data-v-b7084c6e] .menu-item-inner:hover{background-color:#f8f9f9}[data-v-b7084c6e] .menu-label{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}[data-v-b7084c6e] .sub-menu-box{z-index:99;gap:var(--gap);box-sizing:border-box;background-color:#fff;border-left:1px solid #0000000f;flex-direction:column;padding:16px 8px;display:flex;position:absolute;top:0;left:100%;box-shadow:0 -16px 16px -16px #0000000f,16px 0 16px -16px #0000000f,0 16px 16px -16px #0000000f}[data-v-b7084c6e] .suffix-icon,[data-v-b7084c6e] .checked-icon{-o-object-fit:contain;object-fit:contain;width:18px;height:18px}.tab-box-container[data-v-fd2c8809]{width:100%}.tab-list-container[data-v-fd2c8809]{width:100%;overflow-x:scroll}.tab-list-container[data-v-fd2c8809]::-webkit-scrollbar{display:none}.tab-list-container-inner[data-v-fd2c8809]{flex-wrap:nowrap;display:inline-flex;position:relative}.tab-item-box[data-v-fd2c8809]{cursor:pointer;white-space:nowrap;flex-shrink:0;align-items:center}.tab-item-box~.tab-item-box[data-v-fd2c8809]{margin-left:var(--gap)}.active-tab-item-box[data-v-fd2c8809]{width:100px;height:1px;transition:left var(--transition-duration,.15s) ease-in-out, width var(--transition-duration,.15s) ease-in-out;background-color:#000;position:absolute;bottom:0;left:0}.active-tab-item-box.initial[data-v-fd2c8809]{transition:none}.panel-list-container[data-v-fd2c8809]{width:100%;min-height:200px;position:relative}.panel-item-box[data-v-fd2c8809]{width:100%;height:100%;position:absolute;top:0;left:0}.toaster-box[data-v-7faa65fe]{z-index:9999;flex-direction:column;gap:12px;display:flex;position:fixed;left:50%;transform:translate(-50%)}[data-v-7faa65fe] .toast-item{background-color:var(--toast-bg);box-sizing:border-box;min-width:220px;padding:10px 20px}[data-v-7faa65fe] .title-box{justify-content:center;align-items:center;gap:16px;display:flex}[data-v-7faa65fe] .message{color:#fff}.fade-enter-from[data-v-aafc58b1],.fade-leave-to[data-v-aafc58b1]{opacity:0}.fade-enter-active[data-v-aafc58b1],.fade-leave-active[data-v-aafc58b1]{transition:opacity .15s ease-in-out}.loading-box[data-v-aafc58b1]{background-color:var(--bg);z-index:99;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}@keyframes bounce-aafc58b1{0%,to{transform:translateY(0)}50%{transform:translateY(var(--amplitude))}}.loading-dot[data-v-aafc58b1]{width:var(--dot-size);height:var(--dot-size);background-color:var(--dot-color);border-radius:50%;animation:1s ease-in-out infinite bounce-aafc58b1}.loading-dot~.loading-dot[data-v-aafc58b1]{margin-left:var(--dot-gap)}.loading-dot[data-v-aafc58b1]:first-child{animation-delay:0s}.loading-dot[data-v-aafc58b1]:nth-child(2){animation-delay:.2s}.loading-dot[data-v-aafc58b1]:nth-child(3){animation-delay:.4s}.slider-captcha-box[data-v-792c4317]{display:inline-block}.slider-captcha-bg-box[data-v-792c4317]{width:100%;font-size:0;position:relative}.slider-captcha-bg[data-v-792c4317]{width:100%}.slider-captcha-block[data-v-792c4317]{z-index:10;position:absolute;left:0}.slider-track-box[data-v-792c4317]{width:100%;position:relative}.slider-track-bg[data-v-792c4317]{height:100%;position:absolute;top:0;left:0}.slider-track-thumb[data-v-792c4317]{cursor:pointer;background-color:#1a171b0d;justify-content:center;align-items:center;width:60px;height:42px;margin-top:15px;display:flex}:-webkit-any(input:-webkit-autofill,textarea:-webkit-autofill){-webkit-box-shadow:0 0 0 1000px var(--input-bg,#fff) inset;-webkit-text-fill-color:inherit}:is(input:autofill,textarea:autofill){-webkit-box-shadow:0 0 0 1000px var(--input-bg,#fff) inset;-webkit-text-fill-color:inherit}a:focus,input:focus,textarea:focus,button:focus{outline:none}input::-webkit-input-placeholder{color:var(--input-placeholder-color,#999)}textarea::-webkit-input-placeholder{color:var(--input-placeholder-color,#999)}input::-moz-placeholder{color:var(--input-placeholder-color,#999)}textarea::-moz-placeholder{color:var(--input-placeholder-color,#999)}input:-ms-placeholder-shown{color:var(--input-placeholder-color,#999)}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -9,10 +9,12 @@ export type { RoxVCollapseProps } from './collapse';
|
|
|
9
9
|
export { default as Input } from './input';
|
|
10
10
|
export type { RoxVInputProps } from './input';
|
|
11
11
|
export { default as Menu } from './menu';
|
|
12
|
-
export type {
|
|
12
|
+
export type { RoxVMenuOptionProps, RoxVMenuProps } from './menu';
|
|
13
13
|
export { default as Tab } from './tab';
|
|
14
14
|
export type { RoxVTabProps } from './tab';
|
|
15
15
|
export { default as Toaster, useToast } from './toast';
|
|
16
16
|
export type { RoxVToasterProps } from './toast';
|
|
17
17
|
export { default as Loading } from './loading';
|
|
18
18
|
export type { RoxVLoadingProps } from './loading';
|
|
19
|
+
export { default as SliderCaptcha } from './slider-captcha';
|
|
20
|
+
export type { RoxVSliderCaptchaProps, RoxVSliderCaptchaTrackItem } from './slider-captcha';
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { RoxVSliderCaptchaProps, RoxVSliderCaptchaTrackItem } from './types';
|
|
2
|
+
declare function reset(): void;
|
|
3
|
+
declare function __VLS_template(): {
|
|
4
|
+
attrs: Partial<{}>;
|
|
5
|
+
slots: {
|
|
6
|
+
default?(_: {}): any;
|
|
7
|
+
};
|
|
8
|
+
refs: {
|
|
9
|
+
box: HTMLDivElement;
|
|
10
|
+
thumb: HTMLDivElement;
|
|
11
|
+
};
|
|
12
|
+
rootEl: HTMLDivElement;
|
|
13
|
+
};
|
|
14
|
+
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
15
|
+
declare const __VLS_component: import('vue').DefineComponent<RoxVSliderCaptchaProps, {
|
|
16
|
+
reset: typeof reset;
|
|
17
|
+
tracks: import('vue').Ref<{
|
|
18
|
+
x: number;
|
|
19
|
+
t: number;
|
|
20
|
+
xPercent: number;
|
|
21
|
+
}[], RoxVSliderCaptchaTrackItem[] | {
|
|
22
|
+
x: number;
|
|
23
|
+
t: number;
|
|
24
|
+
xPercent: number;
|
|
25
|
+
}[]>;
|
|
26
|
+
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
|
27
|
+
success: () => any;
|
|
28
|
+
fail: () => any;
|
|
29
|
+
change: (detail: RoxVSliderCaptchaTrackItem[]) => any;
|
|
30
|
+
}, string, import('vue').PublicProps, Readonly<RoxVSliderCaptchaProps> & Readonly<{
|
|
31
|
+
onSuccess?: (() => any) | undefined;
|
|
32
|
+
onFail?: (() => any) | undefined;
|
|
33
|
+
onChange?: ((detail: RoxVSliderCaptchaTrackItem[]) => any) | undefined;
|
|
34
|
+
}>, {
|
|
35
|
+
blockTop: number;
|
|
36
|
+
trackBlockBg: string;
|
|
37
|
+
trackBg: string;
|
|
38
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
|
39
|
+
box: HTMLDivElement;
|
|
40
|
+
thumb: HTMLDivElement;
|
|
41
|
+
}, HTMLDivElement>;
|
|
42
|
+
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
43
|
+
export default _default;
|
|
44
|
+
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
45
|
+
new (): {
|
|
46
|
+
$slots: S;
|
|
47
|
+
};
|
|
48
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export interface RoxVSliderCaptchaTrackItem {
|
|
2
|
+
x: number;
|
|
3
|
+
t: number;
|
|
4
|
+
xPercent: number;
|
|
5
|
+
}
|
|
6
|
+
export interface RoxVSliderCaptchaProps {
|
|
7
|
+
background: string;
|
|
8
|
+
block: string;
|
|
9
|
+
width?: number;
|
|
10
|
+
blockTop?: number;
|
|
11
|
+
verify?: (option: RoxVSliderCaptchaTrackItem) => boolean | Promise<boolean>;
|
|
12
|
+
trackBlockBg?: string;
|
|
13
|
+
trackBg?: string;
|
|
14
|
+
}
|