@7pmlabs/design-system 2.0.9 → 2.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +4 -4
- package/dist/design-system.css +1 -1
- package/dist/design-system.js +65 -59
- package/dist/design-system100.js +1 -1
- package/dist/design-system100.js.map +1 -1
- package/dist/design-system101.js +87 -53
- package/dist/design-system101.js.map +1 -1
- package/dist/design-system103.js +5 -13
- package/dist/design-system103.js.map +1 -1
- package/dist/design-system104.js +53 -108
- package/dist/design-system104.js.map +1 -1
- package/dist/{design-system102.js → design-system105.js} +1 -1
- package/dist/{design-system102.js.map → design-system105.js.map} +1 -1
- package/dist/design-system106.js +13 -6
- package/dist/design-system106.js.map +1 -1
- package/dist/design-system107.js +93 -190
- package/dist/design-system107.js.map +1 -1
- package/dist/design-system109.js +2 -2
- package/dist/design-system109.js.map +1 -1
- package/dist/design-system110.js +183 -484
- package/dist/design-system110.js.map +1 -1
- package/dist/design-system112.js +5 -4
- package/dist/design-system112.js.map +1 -1
- package/dist/design-system113.js +507 -7
- package/dist/design-system113.js.map +1 -1
- package/dist/design-system115.js +8 -0
- package/dist/design-system115.js.map +1 -0
- package/dist/design-system116.js +7 -6
- package/dist/design-system116.js.map +1 -1
- package/dist/design-system117.js +154 -169
- package/dist/design-system117.js.map +1 -1
- package/dist/design-system119.js +2 -2
- package/dist/design-system119.js.map +1 -1
- package/dist/design-system120.js +210 -149
- package/dist/design-system120.js.map +1 -1
- package/dist/design-system122.js +5 -4
- package/dist/design-system122.js.map +1 -1
- package/dist/design-system123.js +160 -9
- package/dist/design-system123.js.map +1 -1
- package/dist/design-system125.js +8 -0
- package/dist/design-system125.js.map +1 -0
- package/dist/design-system126.js +176 -6
- package/dist/design-system126.js.map +1 -1
- package/dist/design-system128.js +8 -0
- package/dist/design-system128.js.map +1 -0
- package/dist/design-system129.js +213 -5
- package/dist/design-system129.js.map +1 -1
- package/dist/design-system131.js +5 -90
- package/dist/design-system131.js.map +1 -1
- package/dist/design-system132.js +166 -0
- package/dist/design-system132.js.map +1 -0
- package/dist/design-system134.js +5 -42
- package/dist/design-system134.js.map +1 -1
- package/dist/design-system135.js +12 -0
- package/dist/design-system135.js.map +1 -0
- package/dist/design-system136.js +274 -5
- package/dist/design-system136.js.map +1 -1
- package/dist/design-system138.js +9 -0
- package/dist/{design-system124.js.map → design-system138.js.map} +1 -1
- package/dist/design-system139.js +16 -5
- package/dist/design-system139.js.map +1 -1
- package/dist/design-system141.js +8 -0
- package/dist/{design-system127.js.map → design-system141.js.map} +1 -1
- package/dist/design-system142.js +12 -5
- package/dist/design-system142.js.map +1 -1
- package/dist/design-system143.js +78 -83
- package/dist/design-system143.js.map +1 -1
- package/dist/design-system145.js +1 -1
- package/dist/design-system145.js.map +1 -1
- package/dist/design-system146.js +42 -9
- package/dist/design-system146.js.map +1 -1
- package/dist/design-system148.js +3 -2
- package/dist/design-system148.js.map +1 -1
- package/dist/design-system149.js +230 -18
- package/dist/design-system149.js.map +1 -1
- package/dist/design-system151.js +5 -158
- package/dist/design-system151.js.map +1 -1
- package/dist/{design-system140.js → design-system152.js} +6 -6
- package/dist/{design-system140.js.map → design-system152.js.map} +1 -1
- package/dist/design-system154.js +5 -307
- package/dist/design-system154.js.map +1 -1
- package/dist/design-system155.js +98 -0
- package/dist/design-system155.js.map +1 -0
- package/dist/design-system157.js +5 -240
- package/dist/design-system157.js.map +1 -1
- package/dist/design-system158.js +12 -0
- package/dist/design-system158.js.map +1 -0
- package/dist/design-system159.js +37 -5
- package/dist/design-system159.js.map +1 -1
- package/dist/design-system160.js +4 -189
- package/dist/design-system160.js.map +1 -1
- package/dist/design-system161.js +24 -0
- package/dist/{design-system150.js.map → design-system161.js.map} +1 -1
- package/dist/design-system162.js +2 -3
- package/dist/design-system162.js.map +1 -1
- package/dist/design-system163.js +158 -3
- package/dist/design-system163.js.map +1 -1
- package/dist/{design-system153.js → design-system165.js} +2 -2
- package/dist/{design-system153.js.map → design-system165.js.map} +1 -1
- package/dist/design-system166.js +307 -6
- package/dist/design-system166.js.map +1 -1
- package/dist/{design-system156.js → design-system168.js} +2 -2
- package/dist/{design-system156.js.map → design-system168.js.map} +1 -1
- package/dist/design-system169.js +167 -6
- package/dist/design-system169.js.map +1 -1
- package/dist/design-system171.js +8 -0
- package/dist/design-system171.js.map +1 -0
- package/dist/design-system172.js +240 -6
- package/dist/design-system172.js.map +1 -1
- package/dist/design-system174.js +8 -0
- package/dist/design-system174.js.map +1 -0
- package/dist/design-system175.js +189 -6
- package/dist/design-system175.js.map +1 -1
- package/dist/design-system177.js +8 -0
- package/dist/design-system177.js.map +1 -0
- package/dist/design-system178.js +3 -5
- package/dist/design-system178.js.map +1 -1
- package/dist/design-system179.js +58 -11
- package/dist/design-system179.js.map +1 -1
- package/dist/design-system181.js +9 -0
- package/dist/design-system181.js.map +1 -0
- package/dist/design-system182.js +56 -6
- package/dist/design-system182.js.map +1 -1
- package/dist/design-system184.js +9 -0
- package/dist/{design-system167.js.map → design-system184.js.map} +1 -1
- package/dist/design-system185.js +69 -5
- package/dist/design-system185.js.map +1 -1
- package/dist/design-system187.js +9 -0
- package/dist/{design-system170.js.map → design-system187.js.map} +1 -1
- package/dist/design-system188.js +182 -5
- package/dist/design-system188.js.map +1 -1
- package/dist/design-system190.js +9 -0
- package/dist/design-system190.js.map +1 -0
- package/dist/design-system191.js +115 -5
- package/dist/design-system191.js.map +1 -1
- package/dist/design-system193.js +8 -0
- package/dist/{design-system176.js.map → design-system193.js.map} +1 -1
- package/dist/design-system194.js +11 -5
- package/dist/design-system194.js.map +1 -1
- package/dist/design-system195.js +453 -24
- package/dist/design-system195.js.map +1 -1
- package/dist/design-system197.js +5 -4
- package/dist/design-system197.js.map +1 -1
- package/dist/design-system198.js +20 -16
- package/dist/design-system198.js.map +1 -1
- package/dist/design-system200.js +1 -1
- package/dist/design-system200.js.map +1 -1
- package/dist/design-system201.js +70 -314
- package/dist/design-system201.js.map +1 -1
- package/dist/design-system203.js +1 -1
- package/dist/design-system203.js.map +1 -1
- package/dist/design-system204.js +24 -89
- package/dist/design-system204.js.map +1 -1
- package/dist/design-system206.js +1 -1
- package/dist/design-system206.js.map +1 -1
- package/dist/design-system207.js +26 -17
- package/dist/design-system207.js.map +1 -1
- package/dist/design-system209.js +5 -3
- package/dist/design-system209.js.map +1 -1
- package/dist/design-system210.js +22 -408
- package/dist/design-system210.js.map +1 -1
- package/dist/design-system212.js +1 -1
- package/dist/design-system212.js.map +1 -1
- package/dist/design-system213.js +24 -52
- package/dist/design-system213.js.map +1 -1
- package/dist/design-system215.js +1 -1
- package/dist/design-system215.js.map +1 -1
- package/dist/design-system216.js +329 -85
- package/dist/design-system216.js.map +1 -1
- package/dist/design-system218.js +5 -108
- package/dist/design-system218.js.map +1 -1
- package/dist/design-system219.js +103 -0
- package/dist/design-system219.js.map +1 -0
- package/dist/design-system221.js +5 -106
- package/dist/design-system221.js.map +1 -1
- package/dist/design-system222.js +22 -0
- package/dist/{design-system208.js.map → design-system222.js.map} +1 -1
- package/dist/design-system223.js +4 -6
- package/dist/design-system223.js.map +1 -1
- package/dist/design-system224.js +3 -737
- package/dist/design-system224.js.map +1 -1
- package/dist/design-system225.js +422 -0
- package/dist/design-system225.js.map +1 -0
- package/dist/design-system227.js +5 -11
- package/dist/design-system227.js.map +1 -1
- package/dist/design-system228.js +51 -517
- package/dist/design-system228.js.map +1 -1
- package/dist/design-system230.js +1 -1
- package/dist/design-system230.js.map +1 -1
- package/dist/design-system231.js +88 -3
- package/dist/design-system231.js.map +1 -1
- package/dist/design-system232.js +4 -46
- package/dist/design-system232.js.map +1 -1
- package/dist/design-system233.js +108 -4
- package/dist/design-system233.js.map +1 -1
- package/dist/{design-system220.js → design-system235.js} +2 -2
- package/dist/{design-system220.js.map → design-system235.js.map} +1 -1
- package/dist/design-system236.js +106 -5
- package/dist/design-system236.js.map +1 -1
- package/dist/design-system238.js +9 -0
- package/dist/design-system238.js.map +1 -0
- package/dist/design-system239.js +737 -5
- package/dist/design-system239.js.map +1 -1
- package/dist/{design-system226.js → design-system241.js} +2 -2
- package/dist/{design-system226.js.map → design-system241.js.map} +1 -1
- package/dist/design-system242.js +3 -5
- package/dist/design-system242.js.map +1 -1
- package/dist/design-system243.js +42 -50
- package/dist/design-system243.js.map +1 -1
- package/dist/design-system244.js +1 -1
- package/dist/design-system244.js.map +1 -1
- package/dist/design-system245.js +254 -141
- package/dist/design-system245.js.map +1 -1
- package/dist/design-system247.js +1 -1
- package/dist/design-system247.js.map +1 -1
- package/dist/design-system248.js +119 -7
- package/dist/design-system248.js.map +1 -1
- package/dist/design-system250.js +8 -0
- package/dist/design-system250.js.map +1 -0
- package/dist/design-system251.js +172 -5
- package/dist/design-system251.js.map +1 -1
- package/dist/design-system253.js +8 -0
- package/dist/design-system253.js.map +1 -0
- package/dist/design-system254.js +11 -6
- package/dist/design-system254.js.map +1 -1
- package/dist/design-system255.js +525 -9
- package/dist/design-system255.js.map +1 -1
- package/dist/design-system257.js +8 -0
- package/dist/design-system257.js.map +1 -0
- package/dist/design-system258.js +112 -6
- package/dist/design-system258.js.map +1 -1
- package/dist/design-system260.js +5 -374
- package/dist/design-system260.js.map +1 -1
- package/dist/design-system261.js +57 -0
- package/dist/design-system261.js.map +1 -0
- package/dist/design-system262.js +4 -6
- package/dist/design-system262.js.map +1 -1
- package/dist/design-system263.js +173 -0
- package/dist/design-system263.js.map +1 -0
- package/dist/design-system265.js +8 -0
- package/dist/design-system265.js.map +1 -0
- package/dist/design-system266.js +10 -0
- package/dist/design-system266.js.map +1 -0
- package/dist/{design-system249.js → design-system267.js} +2 -2
- package/dist/{design-system249.js.map → design-system267.js.map} +1 -1
- package/dist/design-system269.js +8 -0
- package/dist/design-system269.js.map +1 -0
- package/dist/{design-system252.js → design-system270.js} +1 -1
- package/dist/{design-system252.js.map → design-system270.js.map} +1 -1
- package/dist/design-system272.js +9 -0
- package/dist/design-system272.js.map +1 -0
- package/dist/design-system273.js +12 -0
- package/dist/design-system273.js.map +1 -0
- package/dist/{design-system256.js → design-system274.js} +2 -2
- package/dist/{design-system256.js.map → design-system274.js.map} +1 -1
- package/dist/design-system276.js +9 -0
- package/dist/design-system276.js.map +1 -0
- package/dist/{design-system259.js → design-system277.js} +1 -1
- package/dist/{design-system259.js.map → design-system277.js.map} +1 -1
- package/dist/design-system278.js +377 -0
- package/dist/design-system278.js.map +1 -0
- package/dist/design-system280.js +9 -0
- package/dist/design-system280.js.map +1 -0
- package/dist/design-system69.js +182 -13
- package/dist/design-system69.js.map +1 -1
- package/dist/design-system71.js +8 -0
- package/dist/design-system71.js.map +1 -0
- package/dist/design-system72.js +13 -5
- package/dist/design-system72.js.map +1 -1
- package/dist/design-system73.js +677 -139
- package/dist/design-system73.js.map +1 -1
- package/dist/design-system75.js +1 -1
- package/dist/design-system75.js.map +1 -1
- package/dist/design-system76.js +152 -23
- package/dist/design-system76.js.map +1 -1
- package/dist/design-system78.js +5 -49
- package/dist/design-system78.js.map +1 -1
- package/dist/design-system79.js +32 -0
- package/dist/design-system79.js.map +1 -0
- package/dist/design-system80.js +2 -3
- package/dist/design-system80.js.map +1 -1
- package/dist/design-system81.js +38 -188
- package/dist/design-system81.js.map +1 -1
- package/dist/design-system83.js +1 -1
- package/dist/design-system83.js.map +1 -1
- package/dist/design-system84.js +199 -7
- package/dist/design-system84.js.map +1 -1
- package/dist/design-system86.js +8 -0
- package/dist/design-system86.js.map +1 -0
- package/dist/design-system87.js +7 -5
- package/dist/design-system87.js.map +1 -1
- package/dist/design-system88.js +264 -48
- package/dist/design-system88.js.map +1 -1
- package/dist/design-system90.js +1 -1
- package/dist/design-system90.js.map +1 -1
- package/dist/design-system91.js +57 -11
- package/dist/design-system91.js.map +1 -1
- package/dist/design-system93.js +8 -0
- package/dist/design-system93.js.map +1 -0
- package/dist/design-system94.js +11 -5
- package/dist/design-system94.js.map +1 -1
- package/dist/design-system95.js +92 -59
- package/dist/design-system95.js.map +1 -1
- package/dist/design-system97.js +1 -1
- package/dist/design-system97.js.map +1 -1
- package/dist/design-system98.js +56 -78
- package/dist/design-system98.js.map +1 -1
- package/dist/types/components/BContextMenu/BContextMenu.spec.d.ts +1 -0
- package/dist/types/components/BContextMenu/BContextMenu.vue.d.ts +42 -0
- package/dist/types/components/BContextMenu/index.d.ts +2 -0
- package/dist/types/components/BContextMenu/types.d.ts +23 -0
- package/dist/types/components/BInputTags/BInputTags.spec.d.ts +1 -0
- package/dist/types/components/BInputTags/BInputTags.vue.d.ts +54 -0
- package/dist/types/components/BInputTags/index.d.ts +1 -0
- package/dist/types/components/BLink/BLink.spec.d.ts +1 -0
- package/dist/types/components/BLink/BLink.vue.d.ts +100 -0
- package/dist/types/components/BLink/index.d.ts +1 -0
- package/dist/types/components/BListbox/BListbox.spec.d.ts +1 -0
- package/dist/types/components/BListbox/BListbox.vue.d.ts +52 -0
- package/dist/types/components/BListbox/index.d.ts +1 -0
- package/dist/types/components/BModal/BModal.spec.d.ts +1 -0
- package/dist/types/components/BPinInput/BPinInput.spec.d.ts +1 -0
- package/dist/types/components/BPinInput/BPinInput.vue.d.ts +43 -0
- package/dist/types/components/BPinInput/index.d.ts +1 -0
- package/dist/types/components/BProgress/BProgress.vue.d.ts +47 -2
- package/dist/types/components/BTextarea/BTextarea.spec.d.ts +1 -0
- package/dist/types/components/BTextarea/BTextarea.vue.d.ts +77 -0
- package/dist/types/components/BTextarea/index.d.ts +1 -0
- package/dist/types/components/index.d.ts +7 -1
- package/package.json +1 -1
- package/dist/design-system114.js +0 -212
- package/dist/design-system114.js.map +0 -1
- package/dist/design-system124.js +0 -277
- package/dist/design-system127.js +0 -19
- package/dist/design-system130.js +0 -15
- package/dist/design-system130.js.map +0 -1
- package/dist/design-system133.js +0 -8
- package/dist/design-system133.js.map +0 -1
- package/dist/design-system137.js +0 -236
- package/dist/design-system137.js.map +0 -1
- package/dist/design-system147.js +0 -40
- package/dist/design-system147.js.map +0 -1
- package/dist/design-system150.js +0 -7
- package/dist/design-system164.js +0 -61
- package/dist/design-system164.js.map +0 -1
- package/dist/design-system167.js +0 -59
- package/dist/design-system170.js +0 -72
- package/dist/design-system173.js +0 -185
- package/dist/design-system173.js.map +0 -1
- package/dist/design-system176.js +0 -118
- package/dist/design-system180.js +0 -465
- package/dist/design-system180.js.map +0 -1
- package/dist/design-system183.js +0 -38
- package/dist/design-system183.js.map +0 -1
- package/dist/design-system186.js +0 -91
- package/dist/design-system186.js.map +0 -1
- package/dist/design-system189.js +0 -38
- package/dist/design-system189.js.map +0 -1
- package/dist/design-system192.js +0 -31
- package/dist/design-system192.js.map +0 -1
- package/dist/design-system208.js +0 -7
- package/dist/design-system217.js +0 -7
- package/dist/design-system217.js.map +0 -1
- package/dist/design-system234.js +0 -286
- package/dist/design-system234.js.map +0 -1
- package/dist/design-system237.js +0 -122
- package/dist/design-system237.js.map +0 -1
- package/dist/design-system240.js +0 -115
- package/dist/design-system240.js.map +0 -1
- package/dist/design-system70.js +0 -699
- package/dist/design-system70.js.map +0 -1
- package/dist/design-system77.js +0 -7
- package/dist/design-system77.js.map +0 -1
- package/dist/design-system85.js +0 -276
- package/dist/design-system85.js.map +0 -1
- package/dist/design-system92.js +0 -102
- package/dist/design-system92.js.map +0 -1
package/dist/design-system216.js
CHANGED
|
@@ -1,91 +1,335 @@
|
|
|
1
|
-
import e from "
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
1
|
+
import { Fragment as e, computed as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, defineComponent as a, mergeModels as o, normalizeClass as s, normalizeStyle as c, onBeforeUnmount as l, openBlock as u, ref as d, renderList as f, toDisplayString as p, unref as m, useAttrs as h, useModel as ee, withModifiers as te } from "vue";
|
|
2
|
+
//#region src/components/BSlider/BSlider.vue?vue&type=script&setup=true&lang.ts
|
|
3
|
+
var ne = [
|
|
4
|
+
"tabindex",
|
|
5
|
+
"aria-valuemin",
|
|
6
|
+
"aria-valuemax",
|
|
7
|
+
"aria-valuenow",
|
|
8
|
+
"aria-disabled",
|
|
9
|
+
"aria-orientation",
|
|
10
|
+
"aria-label"
|
|
11
|
+
], re = [
|
|
12
|
+
"tabindex",
|
|
13
|
+
"aria-valuemin",
|
|
14
|
+
"aria-valuemax",
|
|
15
|
+
"aria-valuenow",
|
|
16
|
+
"aria-disabled",
|
|
17
|
+
"aria-orientation",
|
|
18
|
+
"aria-label"
|
|
19
|
+
], g = {
|
|
20
|
+
key: 0,
|
|
21
|
+
class: "b-slider__marks"
|
|
22
|
+
}, _ = /* @__PURE__ */ a({
|
|
23
|
+
inheritAttrs: !1,
|
|
24
|
+
__name: "BSlider",
|
|
25
|
+
props: /* @__PURE__ */ o({
|
|
26
|
+
disabled: {
|
|
27
|
+
type: Boolean,
|
|
28
|
+
default: !1
|
|
29
|
+
},
|
|
30
|
+
dots: {
|
|
31
|
+
type: Boolean,
|
|
32
|
+
default: !1
|
|
33
|
+
},
|
|
34
|
+
included: {
|
|
35
|
+
type: Boolean,
|
|
36
|
+
default: !0
|
|
37
|
+
},
|
|
38
|
+
keyboard: {
|
|
39
|
+
type: Boolean,
|
|
40
|
+
default: !0
|
|
41
|
+
},
|
|
42
|
+
max: { default: 100 },
|
|
43
|
+
min: { default: 0 },
|
|
44
|
+
range: {
|
|
45
|
+
type: [Boolean, Object],
|
|
46
|
+
default: !1
|
|
47
|
+
},
|
|
48
|
+
reverse: {
|
|
49
|
+
type: Boolean,
|
|
50
|
+
default: !1
|
|
51
|
+
},
|
|
52
|
+
step: { default: 1 },
|
|
53
|
+
vertical: {
|
|
54
|
+
type: Boolean,
|
|
55
|
+
default: !1
|
|
56
|
+
},
|
|
57
|
+
tooltip: { default: () => ({}) },
|
|
58
|
+
marks: {}
|
|
59
|
+
}, {
|
|
60
|
+
modelValue: { default: 0 },
|
|
61
|
+
modelModifiers: {}
|
|
62
|
+
}),
|
|
63
|
+
emits: /* @__PURE__ */ o(["change", "changeComplete"], ["update:modelValue"]),
|
|
64
|
+
setup(a, { expose: o, emit: _ }) {
|
|
65
|
+
let v = h(), y = ee(a, "modelValue"), b = _, x = d(null), S = d(null), C = d(null), w = d(!1), T = d(null), E = d({
|
|
66
|
+
lower: !1,
|
|
67
|
+
upper: !1
|
|
68
|
+
}), D = d(null), O = d(0), k = t(() => a.range !== !1), A = t(() => typeof a.range == "object" && a.range.draggableTrack), j = t(() => k.value ? y.value[0] : a.min), M = t(() => k.value ? y.value[1] : y.value);
|
|
69
|
+
function N(e) {
|
|
70
|
+
return a.max === a.min ? 0 : (e - a.min) / (a.max - a.min) * 100;
|
|
71
|
+
}
|
|
72
|
+
function P(e) {
|
|
73
|
+
return F(a.min + e / 100 * (a.max - a.min));
|
|
74
|
+
}
|
|
75
|
+
function F(e) {
|
|
76
|
+
if (a.step === null) {
|
|
77
|
+
if (!a.marks) return I(e);
|
|
78
|
+
let t = Object.keys(a.marks).map(Number), n = t[0] ?? a.min, r = Math.abs(e - n);
|
|
79
|
+
for (let i of t) {
|
|
80
|
+
let t = Math.abs(e - i);
|
|
81
|
+
t < r && (n = i, r = t);
|
|
52
82
|
}
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
} :
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
83
|
+
return I(n);
|
|
84
|
+
}
|
|
85
|
+
return I(Math.round((e - a.min) / a.step) * a.step + a.min);
|
|
86
|
+
}
|
|
87
|
+
function I(e) {
|
|
88
|
+
return Math.min(a.max, Math.max(a.min, e));
|
|
89
|
+
}
|
|
90
|
+
let L = t(() => N(j.value)), R = t(() => N(M.value)), z = t(() => {
|
|
91
|
+
let e = k.value ? L.value : 0, t = k.value ? R.value - L.value : R.value;
|
|
92
|
+
return a.vertical ? a.reverse ? {
|
|
93
|
+
top: `${100 - e - t}%`,
|
|
94
|
+
height: `${t}%`
|
|
95
|
+
} : {
|
|
96
|
+
bottom: `${100 - e - t}%`,
|
|
97
|
+
height: `${t}%`
|
|
98
|
+
} : a.reverse ? {
|
|
99
|
+
right: `${e}%`,
|
|
100
|
+
width: `${t}%`
|
|
101
|
+
} : {
|
|
102
|
+
left: `${e}%`,
|
|
103
|
+
width: `${t}%`
|
|
104
|
+
};
|
|
105
|
+
}), ie = t(() => {
|
|
106
|
+
let e = L.value;
|
|
107
|
+
return a.vertical ? a.reverse ? { top: `${100 - e}%` } : { bottom: `${100 - e}%` } : a.reverse ? { right: `${e}%` } : { left: `${e}%` };
|
|
108
|
+
}), ae = t(() => {
|
|
109
|
+
let e = R.value;
|
|
110
|
+
return a.vertical ? a.reverse ? { top: `${100 - e}%` } : { bottom: `${100 - e}%` } : a.reverse ? { right: `${e}%` } : { left: `${e}%` };
|
|
111
|
+
}), B = t(() => a.marks ? Object.entries(a.marks).map(([e, t]) => {
|
|
112
|
+
let n = Number(e);
|
|
113
|
+
return {
|
|
114
|
+
value: n,
|
|
115
|
+
percent: N(n),
|
|
116
|
+
isActive: a.included && (k.value ? n >= j.value && n <= M.value : n <= M.value),
|
|
117
|
+
label: typeof t == "string" ? t : t.label,
|
|
118
|
+
style: typeof t == "object" ? t.style : void 0
|
|
119
|
+
};
|
|
120
|
+
}) : []), oe = t(() => {
|
|
121
|
+
if (!a.dots || a.step === null) return [];
|
|
122
|
+
let e = [];
|
|
123
|
+
for (let t = a.min; t <= a.max; t += a.step) {
|
|
124
|
+
let n = N(t), r = a.included && (k.value ? t >= j.value && t <= M.value : t <= M.value);
|
|
125
|
+
e.push({
|
|
126
|
+
value: t,
|
|
127
|
+
percent: n,
|
|
128
|
+
isActive: r
|
|
129
|
+
});
|
|
130
|
+
}
|
|
131
|
+
return e;
|
|
132
|
+
});
|
|
133
|
+
function V(e) {
|
|
134
|
+
return a.tooltip.formatter === null ? null : a.tooltip.formatter ? a.tooltip.formatter(e) : String(e);
|
|
135
|
+
}
|
|
136
|
+
let H = t(() => V(j.value)), U = t(() => V(M.value)), se = t(() => a.tooltip.formatter === null ? !1 : a.tooltip.open === void 0 ? E.value.lower || C.value === "lower" || C.value === "track" : a.tooltip.open), ce = t(() => a.tooltip.formatter === null ? !1 : a.tooltip.open === void 0 ? E.value.upper || C.value === "upper" || C.value === "track" : a.tooltip.open);
|
|
137
|
+
function W(e) {
|
|
138
|
+
if (!x.value) return 0;
|
|
139
|
+
let t = x.value.getBoundingClientRect(), n, r;
|
|
140
|
+
if (n = "touches" in e ? a.vertical ? e.touches[0].clientY : e.touches[0].clientX : a.vertical ? e.clientY : e.clientX, a.vertical) {
|
|
141
|
+
r = t.height;
|
|
142
|
+
let e = n - t.top;
|
|
143
|
+
return a.reverse ? e / r * 100 : (r - e) / r * 100;
|
|
144
|
+
} else {
|
|
145
|
+
r = t.width;
|
|
146
|
+
let e = n - t.left;
|
|
147
|
+
return a.reverse ? (r - e) / r * 100 : e / r * 100;
|
|
148
|
+
}
|
|
149
|
+
}
|
|
150
|
+
function le(e) {
|
|
151
|
+
if (!k.value) return "upper";
|
|
152
|
+
let t = Math.abs(e - L.value), n = Math.abs(e - R.value);
|
|
153
|
+
return t < n ? "lower" : n < t ? "upper" : e < L.value ? "lower" : "upper";
|
|
154
|
+
}
|
|
155
|
+
function G(e, t) {
|
|
156
|
+
if (k.value) {
|
|
157
|
+
let n = y.value, r;
|
|
158
|
+
r = e === "lower" ? [Math.min(t, n[1]), n[1]] : [n[0], Math.max(t, n[0])], y.value = r, b("change", r);
|
|
159
|
+
} else y.value = t, b("change", t);
|
|
160
|
+
}
|
|
161
|
+
function ue(e) {
|
|
162
|
+
if (a.disabled || e.target.closest(".b-slider__handle")) return;
|
|
163
|
+
let t = W(e), n = P(t), r = le(t);
|
|
164
|
+
if (A.value && k.value) {
|
|
165
|
+
let e = L.value, n = R.value;
|
|
166
|
+
if (t >= e && t <= n) return;
|
|
167
|
+
}
|
|
168
|
+
G(r, n), b("changeComplete", (k.value, y.value));
|
|
169
|
+
}
|
|
170
|
+
function K(e, t) {
|
|
171
|
+
a.disabled || (t.preventDefault(), C.value = e, e === "track" && k.value && (D.value = [...y.value], O.value = W(t)), document.addEventListener("mousemove", q), document.addEventListener("mouseup", J), document.addEventListener("touchmove", q), document.addEventListener("touchend", J));
|
|
172
|
+
}
|
|
173
|
+
function q(e) {
|
|
174
|
+
if (!C.value || a.disabled) return;
|
|
175
|
+
let t = W(e);
|
|
176
|
+
if (C.value === "track" && D.value) {
|
|
177
|
+
let e = t - O.value, n = D.value[0], r = D.value[1], i = N(n) + e, o = N(r) + e, s = P(i), c = P(o);
|
|
178
|
+
s >= a.min && c <= a.max && (y.value = [s, c], b("change", [s, c]));
|
|
179
|
+
return;
|
|
180
|
+
}
|
|
181
|
+
let n = P(t);
|
|
182
|
+
G(C.value, n);
|
|
183
|
+
}
|
|
184
|
+
function J() {
|
|
185
|
+
C.value && b("changeComplete", (k.value, y.value)), C.value = null, D.value = null, document.removeEventListener("mousemove", q), document.removeEventListener("mouseup", J), document.removeEventListener("touchmove", q), document.removeEventListener("touchend", J);
|
|
186
|
+
}
|
|
187
|
+
function Y(e, t) {
|
|
188
|
+
if (a.disabled || !a.keyboard) return;
|
|
189
|
+
let n = a.step ?? 1, r = 0;
|
|
190
|
+
switch (e.key) {
|
|
191
|
+
case "ArrowRight":
|
|
192
|
+
case "ArrowUp":
|
|
193
|
+
r = n;
|
|
194
|
+
break;
|
|
195
|
+
case "ArrowLeft":
|
|
196
|
+
case "ArrowDown":
|
|
197
|
+
r = -n;
|
|
198
|
+
break;
|
|
199
|
+
case "Home":
|
|
200
|
+
r = a.min - (t === "lower" ? j.value : M.value);
|
|
201
|
+
break;
|
|
202
|
+
case "End":
|
|
203
|
+
r = a.max - (t === "lower" ? j.value : M.value);
|
|
204
|
+
break;
|
|
205
|
+
default: return;
|
|
206
|
+
}
|
|
207
|
+
e.preventDefault(), G(t, F((t === "lower" ? j.value : M.value) + r)), b("changeComplete", (k.value, y.value));
|
|
208
|
+
}
|
|
209
|
+
function X(e) {
|
|
210
|
+
T.value = e, E.value[e] = !0;
|
|
211
|
+
}
|
|
212
|
+
function Z(e) {
|
|
213
|
+
T.value = null, E.value[e] = !1;
|
|
214
|
+
}
|
|
215
|
+
function Q(e) {
|
|
216
|
+
E.value[e] = !0;
|
|
217
|
+
}
|
|
218
|
+
function $(e) {
|
|
219
|
+
T.value !== e && C.value !== e && (E.value[e] = !1);
|
|
220
|
+
}
|
|
221
|
+
function de() {
|
|
222
|
+
w.value = !0;
|
|
223
|
+
}
|
|
224
|
+
function fe() {
|
|
225
|
+
w.value = !1;
|
|
226
|
+
}
|
|
227
|
+
function pe(e) {
|
|
228
|
+
a.disabled || !A.value || K("track", e);
|
|
229
|
+
}
|
|
230
|
+
function me() {
|
|
231
|
+
(S.value?.querySelector(".b-slider__handle"))?.focus();
|
|
232
|
+
}
|
|
233
|
+
function he() {
|
|
234
|
+
(S.value?.querySelector(".b-slider__handle:focus"))?.blur();
|
|
235
|
+
}
|
|
236
|
+
return o({
|
|
237
|
+
focus: me,
|
|
238
|
+
blur: he
|
|
239
|
+
}), l(() => {
|
|
240
|
+
document.removeEventListener("mousemove", q), document.removeEventListener("mouseup", J), document.removeEventListener("touchmove", q), document.removeEventListener("touchend", J);
|
|
241
|
+
}), (t, o) => (u(), r("div", {
|
|
242
|
+
ref_key: "rootRef",
|
|
243
|
+
ref: S,
|
|
244
|
+
class: s(["b-slider", [{
|
|
245
|
+
"b-slider--vertical": a.vertical,
|
|
246
|
+
"b-slider--disabled": a.disabled,
|
|
247
|
+
"b-slider--with-marks": !!a.marks,
|
|
248
|
+
"b-slider--reverse": a.reverse,
|
|
249
|
+
"b-slider--hovered": w.value
|
|
250
|
+
}]]),
|
|
251
|
+
onMouseenter: de,
|
|
252
|
+
onMouseleave: fe
|
|
253
|
+
}, [i("div", {
|
|
254
|
+
ref_key: "railRef",
|
|
255
|
+
ref: x,
|
|
256
|
+
class: "b-slider__rail",
|
|
257
|
+
onMousedown: ue
|
|
258
|
+
}, [
|
|
259
|
+
a.included ? (u(), r("div", {
|
|
260
|
+
key: 0,
|
|
261
|
+
class: "b-slider__track",
|
|
262
|
+
style: c(z.value),
|
|
263
|
+
onMousedown: te(pe, ["stop"])
|
|
264
|
+
}, null, 36)) : n("", !0),
|
|
265
|
+
(u(!0), r(e, null, f(oe.value, (e) => (u(), r("span", {
|
|
266
|
+
key: `dot-${e.value}`,
|
|
267
|
+
class: s(["b-slider__dot", { "b-slider__dot--active": e.isActive }]),
|
|
268
|
+
style: c(a.vertical ? a.reverse ? { top: `${100 - e.percent}%` } : { bottom: `${100 - e.percent}%` } : a.reverse ? { right: `${e.percent}%` } : { left: `${e.percent}%` })
|
|
269
|
+
}, null, 6))), 128)),
|
|
270
|
+
(u(!0), r(e, null, f(B.value, (e) => (u(), r("span", {
|
|
271
|
+
key: `mark-dot-${e.value}`,
|
|
272
|
+
class: s(["b-slider__dot", { "b-slider__dot--active": e.isActive }]),
|
|
273
|
+
style: c(a.vertical ? a.reverse ? { top: `${100 - e.percent}%` } : { bottom: `${100 - e.percent}%` } : a.reverse ? { right: `${e.percent}%` } : { left: `${e.percent}%` })
|
|
274
|
+
}, null, 6))), 128)),
|
|
275
|
+
k.value ? (u(), r("div", {
|
|
276
|
+
key: 1,
|
|
277
|
+
class: s(["b-slider__handle", { "b-slider__handle--active": C.value === "lower" || T.value === "lower" }]),
|
|
278
|
+
style: c(ie.value),
|
|
279
|
+
role: "slider",
|
|
280
|
+
tabindex: a.disabled ? -1 : 0,
|
|
281
|
+
"aria-valuemin": a.min,
|
|
282
|
+
"aria-valuemax": M.value,
|
|
283
|
+
"aria-valuenow": j.value,
|
|
284
|
+
"aria-disabled": a.disabled || void 0,
|
|
285
|
+
"aria-orientation": a.vertical ? "vertical" : "horizontal",
|
|
286
|
+
"aria-label": m(v)["aria-label"] ? `${m(v)["aria-label"]} - minimum` : "Minimum",
|
|
287
|
+
onMousedown: o[0] ||= (e) => K("lower", e),
|
|
288
|
+
onTouchstart: o[1] ||= (e) => K("lower", e),
|
|
289
|
+
onKeydown: o[2] ||= (e) => Y(e, "lower"),
|
|
290
|
+
onFocus: o[3] ||= (e) => X("lower"),
|
|
291
|
+
onBlur: o[4] ||= (e) => Z("lower"),
|
|
292
|
+
onMouseenter: o[5] ||= (e) => Q("lower"),
|
|
293
|
+
onMouseleave: o[6] ||= (e) => $("lower")
|
|
294
|
+
}, [H.value === null ? n("", !0) : (u(), r("div", {
|
|
295
|
+
key: 0,
|
|
296
|
+
class: s(["b-slider__tooltip", { "b-slider__tooltip--visible": se.value }]),
|
|
297
|
+
role: "tooltip"
|
|
298
|
+
}, p(H.value), 3))], 46, ne)) : n("", !0),
|
|
299
|
+
i("div", {
|
|
300
|
+
class: s(["b-slider__handle", { "b-slider__handle--active": C.value === "upper" || T.value === "upper" }]),
|
|
301
|
+
style: c(ae.value),
|
|
302
|
+
role: "slider",
|
|
303
|
+
tabindex: a.disabled ? -1 : 0,
|
|
304
|
+
"aria-valuemin": k.value ? j.value : a.min,
|
|
305
|
+
"aria-valuemax": a.max,
|
|
306
|
+
"aria-valuenow": M.value,
|
|
307
|
+
"aria-disabled": a.disabled || void 0,
|
|
308
|
+
"aria-orientation": a.vertical ? "vertical" : "horizontal",
|
|
309
|
+
"aria-label": m(v)["aria-label"] || (k.value ? "Maximum" : "Slider"),
|
|
310
|
+
onMousedown: o[7] ||= (e) => K("upper", e),
|
|
311
|
+
onTouchstart: o[8] ||= (e) => K("upper", e),
|
|
312
|
+
onKeydown: o[9] ||= (e) => Y(e, "upper"),
|
|
313
|
+
onFocus: o[10] ||= (e) => X("upper"),
|
|
314
|
+
onBlur: o[11] ||= (e) => Z("upper"),
|
|
315
|
+
onMouseenter: o[12] ||= (e) => Q("upper"),
|
|
316
|
+
onMouseleave: o[13] ||= (e) => $("upper")
|
|
317
|
+
}, [U.value === null ? n("", !0) : (u(), r("div", {
|
|
318
|
+
key: 0,
|
|
319
|
+
class: s(["b-slider__tooltip", { "b-slider__tooltip--visible": ce.value }]),
|
|
320
|
+
role: "tooltip"
|
|
321
|
+
}, p(U.value), 3))], 46, re)
|
|
322
|
+
], 544), a.marks ? (u(), r("div", g, [(u(!0), r(e, null, f(B.value, (e) => (u(), r("span", {
|
|
323
|
+
key: `mark-label-${e.value}`,
|
|
324
|
+
class: s(["b-slider__mark-text", { "b-slider__mark-text--active": e.isActive }]),
|
|
325
|
+
style: c({
|
|
326
|
+
...a.vertical ? a.reverse ? { top: `${100 - e.percent}%` } : { bottom: `${100 - e.percent}%` } : a.reverse ? { right: `${e.percent}%` } : { left: `${e.percent}%` },
|
|
327
|
+
...e.style
|
|
328
|
+
})
|
|
329
|
+
}, p(e.label), 7))), 128))])) : n("", !0)], 34));
|
|
86
330
|
}
|
|
87
331
|
});
|
|
88
332
|
//#endregion
|
|
89
|
-
export {
|
|
333
|
+
export { _ as default };
|
|
90
334
|
|
|
91
335
|
//# sourceMappingURL=design-system216.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"design-system216.js","names":["$slots"],"sources":["../src/components/BStatistic/BStatisticTimer.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted, ref } from 'vue';\n\nimport BStatistic from './BStatistic.vue';\nimport type { BStatisticTimerType } from './types';\n\n// ─────────────────────────────────────────────\n// Props\n// ─────────────────────────────────────────────\nconst {\n type = 'countdown',\n value,\n format = 'HH:mm:ss',\n title,\n prefix,\n suffix,\n valueStyle,\n} = defineProps<{\n /**\n * Timer mode.\n * - `'countdown'` - counts down to `value` (a future timestamp in ms).\n * - `'countup'` - counts up from `value` (a past timestamp in ms).\n * @default 'countdown'\n */\n type?: BStatisticTimerType;\n /** Target/start timestamp in ms (e.g. `Date.now() + 60_000`). */\n value: number;\n /**\n * Format string. Tokens:\n * - `D` days\n * - `H` / `HH` hours\n * - `m` / `mm` minutes\n * - `s` / `ss` seconds\n * - `S` / `SSS` milliseconds\n * @default 'HH:mm:ss'\n */\n format?: string;\n /** Title text (mirrors `BStatistic#title`). */\n title?: string;\n /** Prefix text (mirrors `BStatistic#prefix`). */\n prefix?: string;\n /** Suffix text (mirrors `BStatistic#suffix`). */\n suffix?: string;\n /** Inline style on the value element. */\n valueStyle?: string | Record<string, string | number>;\n}>();\n\n// ─────────────────────────────────────────────\n// Emits\n// ─────────────────────────────────────────────\nconst emit = defineEmits<{\n /** Emitted once a countdown reaches zero. */\n finish: [];\n /** Emitted on every tick with the current ms remaining/elapsed. */\n change: [ms: number];\n}>();\n\ndefineSlots<{\n title?(): unknown;\n prefix?(): unknown;\n suffix?(): unknown;\n}>();\n\n// ─────────────────────────────────────────────\n// Tick\n// ─────────────────────────────────────────────\nconst TICK_MS = 1000 / 30; // ~33ms, smooth enough for sub-second formats\nconst now = ref<number>(0);\nlet timer: ReturnType<typeof setInterval> | null = null;\nlet finished = false;\n\nfunction compute(t: number): number {\n return type === 'countdown' ? Math.max(0, value - t) : Math.max(0, t - value);\n}\n\nfunction tick() {\n const t = Date.now();\n now.value = t;\n const ms = compute(t);\n emit('change', ms);\n if (type === 'countdown' && ms <= 0 && !finished) {\n finished = true;\n if (timer) {\n clearInterval(timer);\n timer = null;\n }\n emit('finish');\n }\n}\n\nonMounted(() => {\n // SSR-safe: timers only run in the browser\n finished = false;\n now.value = Date.now();\n // Emit initial change so consumers see the starting value\n emit('change', compute(now.value));\n timer = setInterval(tick, TICK_MS);\n});\n\nonBeforeUnmount(() => {\n if (timer) {\n clearInterval(timer);\n timer = null;\n }\n});\n\n// ─────────────────────────────────────────────\n// Formatting\n// ─────────────────────────────────────────────\nconst ms = computed<number>(() => (now.value ? compute(now.value) : compute(Date.now())));\n\nfunction formatDuration(t: number, fmt: string): string {\n const days = Math.floor(t / 86_400_000);\n let rem = t - days * 86_400_000;\n const hours = Math.floor(rem / 3_600_000);\n rem -= hours * 3_600_000;\n const minutes = Math.floor(rem / 60_000);\n rem -= minutes * 60_000;\n const seconds = Math.floor(rem / 1000);\n const milliseconds = rem - seconds * 1000;\n\n // Bracketed text is treated as a literal (dayjs-compatible).\n return fmt.replace(/\\[([^\\]]*)\\]|SSS|HH|mm|ss|D|H|m|s|S/g, (match, literal) => {\n if (literal !== undefined) return literal;\n switch (match) {\n case 'SSS':\n return String(milliseconds).padStart(3, '0');\n case 'HH':\n return String(hours).padStart(2, '0');\n case 'mm':\n return String(minutes).padStart(2, '0');\n case 'ss':\n return String(seconds).padStart(2, '0');\n case 'D':\n return String(days);\n case 'H':\n return String(hours);\n case 'm':\n return String(minutes);\n case 's':\n return String(seconds);\n case 'S':\n return String(milliseconds);\n default:\n return match;\n }\n });\n}\n\nconst formatted = computed<string>(() => formatDuration(ms.value, format));\n</script>\n\n<template>\n <BStatistic\n class=\"b-statistic-timer\"\n :title=\"title\"\n :value=\"formatted\"\n :prefix=\"prefix\"\n :suffix=\"suffix\"\n :value-style=\"valueStyle\"\n >\n <template v-if=\"$slots.title\" #title><slot name=\"title\" /></template>\n <template v-if=\"$slots.prefix\" #prefix><slot name=\"prefix\" /></template>\n <template v-if=\"$slots.suffix\" #suffix><slot name=\"suffix\" /></template>\n </BStatistic>\n</template>\n"],"mappings":";;;AAkEA,IAAM,IAAU,MAAO;;;;;;;;;;;;;EAhBvB,IAAM,IAAO,GAiBP,IAAM,EAAY,EAAE,EACtB,IAA+C,MAC/C,IAAW;EAEf,SAAS,EAAQ,GAAmB;AAClC,UAAO,EAAA,SAAS,cAAc,KAAK,IAAI,GAAG,EAAA,QAAQ,EAAE,GAAG,KAAK,IAAI,GAAG,IAAI,EAAA,MAAM;;EAG/E,SAAS,IAAO;GACd,IAAM,IAAI,KAAK,KAAK;AACpB,KAAI,QAAQ;GACZ,IAAM,IAAK,EAAQ,EAAE;AAErB,GADA,EAAK,UAAU,EAAG,EACd,EAAA,SAAS,eAAe,KAAM,KAAK,CAAC,MACtC,IAAW,IACX,AAEE,OADA,cAAc,EAAM,EACZ,OAEV,EAAK,SAAS;;AAalB,EATA,QAAgB;AAMd,GAJA,IAAW,IACX,EAAI,QAAQ,KAAK,KAAK,EAEtB,EAAK,UAAU,EAAQ,EAAI,MAAM,CAAC,EAClC,IAAQ,YAAY,GAAM,EAAQ;IAClC,EAEF,QAAsB;AACpB,GAEE,OADA,cAAc,EAAM,EACZ;IAEV;EAKF,IAAM,IAAK,QAAwB,EAAI,QAAQ,EAAQ,EAAI,MAAM,GAAG,EAAQ,KAAK,KAAK,CAAC,CAAE;EAEzF,SAAS,EAAe,GAAW,GAAqB;GACtD,IAAM,IAAO,KAAK,MAAM,IAAI,MAAW,EACnC,IAAM,IAAI,IAAO,OACf,IAAQ,KAAK,MAAM,IAAM,KAAU;AACzC,QAAO,IAAQ;GACf,IAAM,IAAU,KAAK,MAAM,IAAM,IAAO;AACxC,QAAO,IAAU;GACjB,IAAM,IAAU,KAAK,MAAM,IAAM,IAAK,EAChC,IAAe,IAAM,IAAU;AAGrC,UAAO,EAAI,QAAQ,yCAAyC,GAAO,MAAY;AAC7E,QAAI,MAAY,KAAA,EAAW,QAAO;AAClC,YAAQ,GAAR;KACE,KAAK,MACH,QAAO,OAAO,EAAa,CAAC,SAAS,GAAG,IAAI;KAC9C,KAAK,KACH,QAAO,OAAO,EAAM,CAAC,SAAS,GAAG,IAAI;KACvC,KAAK,KACH,QAAO,OAAO,EAAQ,CAAC,SAAS,GAAG,IAAI;KACzC,KAAK,KACH,QAAO,OAAO,EAAQ,CAAC,SAAS,GAAG,IAAI;KACzC,KAAK,IACH,QAAO,OAAO,EAAK;KACrB,KAAK,IACH,QAAO,OAAO,EAAM;KACtB,KAAK,IACH,QAAO,OAAO,EAAQ;KACxB,KAAK,IACH,QAAO,OAAO,EAAQ;KACxB,KAAK,IACH,QAAO,OAAO,EAAa;KAC7B,QACE,QAAO;;KAEX;;EAGJ,IAAM,IAAY,QAAuB,EAAe,EAAG,OAAO,EAAA,OAAO,CAAC;yBAIxE,EAWa,GAAA;GAVX,OAAM;GACL,OAAO,EAAA;GACP,OAAO,EAAA;GACP,QAAQ,EAAA;GACR,QAAQ,EAAA;GACR,eAAa,EAAA;;GAEEA,EAAAA,OAAO,QAAA;UAAQ;gBAA2B,CAArB,EAAqB,EAAA,QAAA,QAAA,CAAA,CAAA;;;GAC1CA,EAAAA,OAAO,SAAA;UAAS;gBAA6B,CAAtB,EAAsB,EAAA,QAAA,SAAA,CAAA,CAAA;;;GAC7CA,EAAAA,OAAO,SAAA;UAAS;gBAA6B,CAAtB,EAAsB,EAAA,QAAA,SAAA,CAAA,CAAA"}
|
|
1
|
+
{"version":3,"file":"design-system216.js","names":[],"sources":["../src/components/BSlider/BSlider.vue"],"sourcesContent":["<script lang=\"ts\" setup>\ndefineOptions({ inheritAttrs: false });\n\nimport { computed, onBeforeUnmount, ref, useAttrs } from 'vue';\nimport type { BSliderMarks, BSliderRange, BSliderTooltip } from './types.ts';\n\nconst attrs = useAttrs();\n\n//#region Props\nconst {\n disabled = false,\n dots = false,\n included = true,\n keyboard = true,\n max = 100,\n min = 0,\n range = false,\n reverse = false,\n step = 1,\n vertical = false,\n tooltip = {},\n marks,\n} = defineProps<{\n /** Whether the slider is disabled. */\n disabled?: boolean;\n /** Whether only dots can be selected (step snap). */\n dots?: boolean;\n /** Whether the track between handles is filled. */\n included?: boolean;\n /** Whether keyboard navigation is enabled. */\n keyboard?: boolean;\n /** Maximum value. */\n max?: number;\n /** Minimum value. */\n min?: number;\n /** Whether range mode is enabled (dual handles). Can also be an object with draggableTrack. */\n range?: boolean | BSliderRange;\n /** Whether the slider is reversed. */\n reverse?: boolean;\n /** Step granularity. null means only marks are selectable. */\n step?: number | null;\n /** Whether the slider is vertical. */\n vertical?: boolean;\n /** Tooltip configuration. */\n tooltip?: BSliderTooltip;\n /** Tick marks on the slider. Keys are percentages (0–100 mapped to min–max). */\n marks?: BSliderMarks;\n}>();\n\nconst model = defineModel<number | [number, number]>({ default: 0 });\n\nconst emit = defineEmits<{\n change: [value: number | [number, number]];\n changeComplete: [value: number | [number, number]];\n}>();\n//#endregion\n\n//#region Internal state\nconst railRef = ref<HTMLElement | null>(null);\nconst rootRef = ref<HTMLElement | null>(null);\n\nconst dragging = ref<null | 'lower' | 'upper' | 'track'>(null);\nconst hovered = ref(false);\nconst focusedHandle = ref<'lower' | 'upper' | null>(null);\nconst tooltipVisible = ref<{ lower: boolean; upper: boolean }>({ lower: false, upper: false });\n\nconst trackDragStartValue = ref<[number, number] | null>(null);\nconst trackDragStartPos = ref(0);\n//#endregion\n\n//#region Computed values\nconst isRange = computed(() => range !== false);\nconst draggableTrack = computed(() => typeof range === 'object' && range.draggableTrack);\n\nconst lowerValue = computed(() => {\n if (isRange.value) {\n const v = model.value as [number, number];\n return v[0];\n }\n return min;\n});\n\nconst upperValue = computed(() => {\n if (isRange.value) {\n const v = model.value as [number, number];\n return v[1];\n }\n return model.value as number;\n});\n\nfunction valueToPercent(value: number): number {\n if (max === min) return 0;\n return ((value - min) / (max - min)) * 100;\n}\n\nfunction percentToValue(percent: number): number {\n const raw = min + (percent / 100) * (max - min);\n return snapToStep(raw);\n}\n\nfunction snapToStep(value: number): number {\n if (step === null) {\n if (!marks) return clamp(value);\n const markValues = Object.keys(marks).map(Number);\n let closest = markValues[0] ?? min;\n let closestDist = Math.abs(value - closest);\n for (const mv of markValues) {\n const dist = Math.abs(value - mv);\n if (dist < closestDist) {\n closest = mv;\n closestDist = dist;\n }\n }\n return clamp(closest);\n }\n const stepped = Math.round((value - min) / step) * step + min;\n return clamp(stepped);\n}\n\nfunction clamp(value: number): number {\n return Math.min(max, Math.max(min, value));\n}\n\nconst lowerPercent = computed(() => valueToPercent(lowerValue.value));\nconst upperPercent = computed(() => valueToPercent(upperValue.value));\n\nconst trackStyle = computed(() => {\n const start = isRange.value ? lowerPercent.value : 0;\n const length = isRange.value\n ? upperPercent.value - lowerPercent.value\n : upperPercent.value;\n\n if (vertical) {\n return reverse\n ? { top: `${100 - start - length}%`, height: `${length}%` }\n : { bottom: `${100 - start - length}%`, height: `${length}%` };\n }\n return reverse\n ? { right: `${start}%`, width: `${length}%` }\n : { left: `${start}%`, width: `${length}%` };\n});\n\nconst lowerHandleStyle = computed(() => {\n const pct = lowerPercent.value;\n if (vertical) {\n return reverse ? { top: `${100 - pct}%` } : { bottom: `${100 - pct}%` };\n }\n return reverse ? { right: `${pct}%` } : { left: `${pct}%` };\n});\n\nconst upperHandleStyle = computed(() => {\n const pct = upperPercent.value;\n if (vertical) {\n return reverse ? { top: `${100 - pct}%` } : { bottom: `${100 - pct}%` };\n }\n return reverse ? { right: `${pct}%` } : { left: `${pct}%` };\n});\n\nconst markList = computed(() => {\n if (!marks) return [];\n return Object.entries(marks).map(([key, val]) => {\n const numKey = Number(key);\n const percent = valueToPercent(numKey);\n const isActive =\n included &&\n (isRange.value\n ? numKey >= lowerValue.value && numKey <= upperValue.value\n : numKey <= upperValue.value);\n const label = typeof val === 'string' ? val : val.label;\n const style = typeof val === 'object' ? val.style : undefined;\n return { value: numKey, percent, isActive, label, style };\n });\n});\n\nconst dotList = computed(() => {\n if (!dots || step === null) return [];\n const result: { value: number; percent: number; isActive: boolean }[] = [];\n for (let v = min; v <= max; v += step) {\n const percent = valueToPercent(v);\n const isActive =\n included &&\n (isRange.value\n ? v >= lowerValue.value && v <= upperValue.value\n : v <= upperValue.value);\n result.push({ value: v, percent, isActive });\n }\n return result;\n});\n\nfunction formatTooltip(value: number): string | null {\n if (tooltip.formatter === null) return null;\n if (tooltip.formatter) return tooltip.formatter(value);\n return String(value);\n}\n\nconst lowerTooltipText = computed(() => formatTooltip(lowerValue.value));\nconst upperTooltipText = computed(() => formatTooltip(upperValue.value));\n\nconst showLowerTooltip = computed(() => {\n if (tooltip.formatter === null) return false;\n if (tooltip.open !== undefined) return tooltip.open;\n return tooltipVisible.value.lower || dragging.value === 'lower' || dragging.value === 'track';\n});\n\nconst showUpperTooltip = computed(() => {\n if (tooltip.formatter === null) return false;\n if (tooltip.open !== undefined) return tooltip.open;\n return tooltipVisible.value.upper || dragging.value === 'upper' || dragging.value === 'track';\n});\n//#endregion\n\n//#region Event handlers\nfunction getPercentFromEvent(event: MouseEvent | TouchEvent): number {\n if (!railRef.value) return 0;\n const rect = railRef.value.getBoundingClientRect();\n let clientPos: number;\n let size: number;\n\n if ('touches' in event) {\n clientPos = vertical ? event.touches[0].clientY : event.touches[0].clientX;\n } else {\n clientPos = vertical ? event.clientY : event.clientX;\n }\n\n if (vertical) {\n size = rect.height;\n const offset = clientPos - rect.top;\n return reverse ? (offset / size) * 100 : ((size - offset) / size) * 100;\n } else {\n size = rect.width;\n const offset = clientPos - rect.left;\n return reverse ? ((size - offset) / size) * 100 : (offset / size) * 100;\n }\n}\n\nfunction getCloserHandle(percent: number): 'lower' | 'upper' {\n if (!isRange.value) return 'upper';\n const distToLower = Math.abs(percent - lowerPercent.value);\n const distToUpper = Math.abs(percent - upperPercent.value);\n if (distToLower < distToUpper) return 'lower';\n if (distToUpper < distToLower) return 'upper';\n return percent < lowerPercent.value ? 'lower' : 'upper';\n}\n\nfunction updateValue(handle: 'lower' | 'upper', newValue: number) {\n if (isRange.value) {\n const current = model.value as [number, number];\n let updated: [number, number];\n if (handle === 'lower') {\n updated = [Math.min(newValue, current[1]), current[1]];\n } else {\n updated = [current[0], Math.max(newValue, current[0])];\n }\n model.value = updated;\n emit('change', updated);\n } else {\n model.value = newValue;\n emit('change', newValue);\n }\n}\n\nfunction handleRailClick(event: MouseEvent) {\n if (disabled) return;\n if ((event.target as HTMLElement).closest('.b-slider__handle')) return;\n\n const percent = getPercentFromEvent(event);\n const value = percentToValue(percent);\n const handle = getCloserHandle(percent);\n\n if (draggableTrack.value && isRange.value) {\n const lp = lowerPercent.value;\n const up = upperPercent.value;\n if (percent >= lp && percent <= up) return;\n }\n\n updateValue(handle, value);\n emit('changeComplete', isRange.value ? (model.value as [number, number]) : (model.value as number));\n}\n\nfunction handleDragStart(handle: 'lower' | 'upper' | 'track', event: MouseEvent | TouchEvent) {\n if (disabled) return;\n event.preventDefault();\n dragging.value = handle;\n\n if (handle === 'track' && isRange.value) {\n trackDragStartValue.value = [...(model.value as [number, number])] as [number, number];\n trackDragStartPos.value = getPercentFromEvent(event);\n }\n\n document.addEventListener('mousemove', handleDragMove);\n document.addEventListener('mouseup', handleDragEnd);\n document.addEventListener('touchmove', handleDragMove);\n document.addEventListener('touchend', handleDragEnd);\n}\n\nfunction handleDragMove(event: MouseEvent | TouchEvent) {\n if (!dragging.value || disabled) return;\n const percent = getPercentFromEvent(event);\n\n if (dragging.value === 'track' && trackDragStartValue.value) {\n const delta = percent - trackDragStartPos.value;\n const startLower = trackDragStartValue.value[0];\n const startUpper = trackDragStartValue.value[1];\n const lowerPct = valueToPercent(startLower) + delta;\n const upperPct = valueToPercent(startUpper) + delta;\n\n const newLower = percentToValue(lowerPct);\n const newUpper = percentToValue(upperPct);\n\n if (newLower >= min && newUpper <= max) {\n model.value = [newLower, newUpper];\n emit('change', [newLower, newUpper]);\n }\n return;\n }\n\n const value = percentToValue(percent);\n updateValue(dragging.value as 'lower' | 'upper', value);\n}\n\nfunction handleDragEnd() {\n if (dragging.value) {\n emit('changeComplete', isRange.value ? (model.value as [number, number]) : (model.value as number));\n }\n dragging.value = null;\n trackDragStartValue.value = null;\n document.removeEventListener('mousemove', handleDragMove);\n document.removeEventListener('mouseup', handleDragEnd);\n document.removeEventListener('touchmove', handleDragMove);\n document.removeEventListener('touchend', handleDragEnd);\n}\n\nfunction handleKeyDown(event: KeyboardEvent, handle: 'lower' | 'upper') {\n if (disabled || !keyboard) return;\n const effectiveStep = step ?? 1;\n let delta = 0;\n\n switch (event.key) {\n case 'ArrowRight':\n case 'ArrowUp':\n delta = effectiveStep;\n break;\n case 'ArrowLeft':\n case 'ArrowDown':\n delta = -effectiveStep;\n break;\n case 'Home':\n delta = min - (handle === 'lower' ? lowerValue.value : upperValue.value);\n break;\n case 'End':\n delta = max - (handle === 'lower' ? lowerValue.value : upperValue.value);\n break;\n default:\n return;\n }\n\n event.preventDefault();\n const currentVal = handle === 'lower' ? lowerValue.value : upperValue.value;\n const newValue = snapToStep(currentVal + delta);\n updateValue(handle, newValue);\n emit('changeComplete', isRange.value ? (model.value as [number, number]) : (model.value as number));\n}\n\nfunction handleHandleFocus(handle: 'lower' | 'upper') {\n focusedHandle.value = handle;\n tooltipVisible.value[handle] = true;\n}\n\nfunction handleHandleBlur(handle: 'lower' | 'upper') {\n focusedHandle.value = null;\n tooltipVisible.value[handle] = false;\n}\n\nfunction handleHandleMouseEnter(handle: 'lower' | 'upper') {\n tooltipVisible.value[handle] = true;\n}\n\nfunction handleHandleMouseLeave(handle: 'lower' | 'upper') {\n if (focusedHandle.value !== handle && dragging.value !== handle) {\n tooltipVisible.value[handle] = false;\n }\n}\n\nfunction handleMouseEnter() {\n hovered.value = true;\n}\n\nfunction handleMouseLeave() {\n hovered.value = false;\n}\n\nfunction handleTrackMouseDown(event: MouseEvent) {\n if (disabled || !draggableTrack.value) return;\n handleDragStart('track', event);\n}\n//#endregion\n\n//#region Expose\nfunction focus() {\n const el = rootRef.value?.querySelector('.b-slider__handle') as HTMLElement | null;\n el?.focus();\n}\n\nfunction blur() {\n const el = rootRef.value?.querySelector('.b-slider__handle:focus') as HTMLElement | null;\n el?.blur();\n}\n\ndefineExpose({ focus, blur });\n//#endregion\n\n//#region Cleanup\nonBeforeUnmount(() => {\n document.removeEventListener('mousemove', handleDragMove);\n document.removeEventListener('mouseup', handleDragEnd);\n document.removeEventListener('touchmove', handleDragMove);\n document.removeEventListener('touchend', handleDragEnd);\n});\n//#endregion\n</script>\n\n<template>\n <div\n ref=\"rootRef\"\n class=\"b-slider\"\n :class=\"[\n {\n 'b-slider--vertical': vertical,\n 'b-slider--disabled': disabled,\n 'b-slider--with-marks': !!marks,\n 'b-slider--reverse': reverse,\n 'b-slider--hovered': hovered,\n },\n ]\"\n @mouseenter=\"handleMouseEnter\"\n @mouseleave=\"handleMouseLeave\"\n >\n <!-- Rail -->\n <div\n ref=\"railRef\"\n class=\"b-slider__rail\"\n @mousedown=\"handleRailClick\"\n >\n <!-- Track -->\n <div\n v-if=\"included\"\n class=\"b-slider__track\"\n :style=\"trackStyle\"\n @mousedown.stop=\"handleTrackMouseDown\"\n />\n\n <!-- Dots -->\n <span\n v-for=\"dot in dotList\"\n :key=\"`dot-${dot.value}`\"\n class=\"b-slider__dot\"\n :class=\"{ 'b-slider__dot--active': dot.isActive }\"\n :style=\"vertical\n ? (reverse ? { top: `${100 - dot.percent}%` } : { bottom: `${100 - dot.percent}%` })\n : (reverse ? { right: `${dot.percent}%` } : { left: `${dot.percent}%` })\n \"\n />\n\n <!-- Marks -->\n <span\n v-for=\"mark in markList\"\n :key=\"`mark-dot-${mark.value}`\"\n class=\"b-slider__dot\"\n :class=\"{ 'b-slider__dot--active': mark.isActive }\"\n :style=\"vertical\n ? (reverse ? { top: `${100 - mark.percent}%` } : { bottom: `${100 - mark.percent}%` })\n : (reverse ? { right: `${mark.percent}%` } : { left: `${mark.percent}%` })\n \"\n />\n\n <!-- Lower handle (range only) -->\n <div\n v-if=\"isRange\"\n class=\"b-slider__handle\"\n :class=\"{\n 'b-slider__handle--active': dragging === 'lower' || focusedHandle === 'lower',\n }\"\n :style=\"lowerHandleStyle\"\n role=\"slider\"\n :tabindex=\"disabled ? -1 : 0\"\n :aria-valuemin=\"min\"\n :aria-valuemax=\"upperValue\"\n :aria-valuenow=\"lowerValue\"\n :aria-disabled=\"disabled || undefined\"\n :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n :aria-label=\"(attrs['aria-label'] as string) ? `${attrs['aria-label']} - minimum` : 'Minimum'\"\n @mousedown=\"(e) => handleDragStart('lower', e)\"\n @touchstart=\"(e) => handleDragStart('lower', e)\"\n @keydown=\"(e) => handleKeyDown(e, 'lower')\"\n @focus=\"handleHandleFocus('lower')\"\n @blur=\"handleHandleBlur('lower')\"\n @mouseenter=\"handleHandleMouseEnter('lower')\"\n @mouseleave=\"handleHandleMouseLeave('lower')\"\n >\n <div\n v-if=\"lowerTooltipText !== null\"\n class=\"b-slider__tooltip\"\n :class=\"{ 'b-slider__tooltip--visible': showLowerTooltip }\"\n role=\"tooltip\"\n >\n {{ lowerTooltipText }}\n </div>\n </div>\n\n <!-- Upper handle (always) -->\n <div\n class=\"b-slider__handle\"\n :class=\"{\n 'b-slider__handle--active': dragging === 'upper' || focusedHandle === 'upper',\n }\"\n :style=\"upperHandleStyle\"\n role=\"slider\"\n :tabindex=\"disabled ? -1 : 0\"\n :aria-valuemin=\"isRange ? lowerValue : min\"\n :aria-valuemax=\"max\"\n :aria-valuenow=\"upperValue\"\n :aria-disabled=\"disabled || undefined\"\n :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n :aria-label=\"(attrs['aria-label'] as string) || (isRange ? 'Maximum' : 'Slider')\"\n @mousedown=\"(e) => handleDragStart('upper', e)\"\n @touchstart=\"(e) => handleDragStart('upper', e)\"\n @keydown=\"(e) => handleKeyDown(e, 'upper')\"\n @focus=\"handleHandleFocus('upper')\"\n @blur=\"handleHandleBlur('upper')\"\n @mouseenter=\"handleHandleMouseEnter('upper')\"\n @mouseleave=\"handleHandleMouseLeave('upper')\"\n >\n <div\n v-if=\"upperTooltipText !== null\"\n class=\"b-slider__tooltip\"\n :class=\"{ 'b-slider__tooltip--visible': showUpperTooltip }\"\n role=\"tooltip\"\n >\n {{ upperTooltipText }}\n </div>\n </div>\n </div>\n\n <!-- Mark labels -->\n <div v-if=\"marks\" class=\"b-slider__marks\">\n <span\n v-for=\"mark in markList\"\n :key=\"`mark-label-${mark.value}`\"\n class=\"b-slider__mark-text\"\n :class=\"{ 'b-slider__mark-text--active': mark.isActive }\"\n :style=\"{\n ...(vertical\n ? (reverse ? { top: `${100 - mark.percent}%` } : { bottom: `${100 - mark.percent}%` })\n : (reverse ? { right: `${mark.percent}%` } : { left: `${mark.percent}%` })\n ),\n ...mark.style,\n }\"\n >\n {{ mark.label }}\n </span>\n </div>\n </div>\n</template>\n\n<style>\n.b-slider {\n --b-slider-rail-bg: rgba(0, 0, 0, 0.04);\n --b-slider-rail-hover-bg: rgba(0, 0, 0, 0.06);\n --b-slider-rail-size: 4px;\n --b-slider-track-bg: #91caff;\n --b-slider-track-bg-disabled: rgba(0, 0, 0, 0.04);\n --b-slider-track-hover-bg: #69b1ff;\n --b-slider-handle-color: #91caff;\n --b-slider-handle-color-disabled: #bfbfbf;\n --b-slider-handle-active-color: #1677ff;\n --b-slider-handle-active-outline-color: rgba(22, 119, 255, 0.2);\n --b-slider-handle-line-width: 2px;\n --b-slider-handle-line-width-hover: 2.5px;\n --b-slider-handle-size: 10px;\n --b-slider-handle-size-hover: 12px;\n --b-slider-dot-border-color: #f0f0f0;\n --b-slider-dot-active-border-color: #91caff;\n --b-slider-dot-size: 8px;\n --b-slider-control-size: 10px;\n\n position: relative;\n box-sizing: border-box;\n padding: 4px 0;\n cursor: pointer;\n touch-action: none;\n}\n\n.b-slider--vertical {\n display: inline-block;\n height: 100%;\n min-height: 200px;\n padding: 0 4px;\n}\n\n.b-slider--disabled {\n cursor: not-allowed;\n}\n\n/* Rail */\n.b-slider__rail {\n position: relative;\n width: 100%;\n height: var(--b-slider-rail-size);\n background-color: var(--b-slider-rail-bg);\n border-radius: calc(var(--b-slider-rail-size) / 2);\n transition: background-color 0.2s;\n}\n\n.b-slider--hovered:not(.b-slider--disabled) .b-slider__rail {\n background-color: var(--b-slider-rail-hover-bg);\n}\n\n.b-slider--vertical .b-slider__rail {\n width: var(--b-slider-rail-size);\n height: 100%;\n}\n\n/* Track */\n.b-slider__track {\n position: absolute;\n height: 100%;\n background-color: var(--b-slider-track-bg);\n border-radius: calc(var(--b-slider-rail-size) / 2);\n transition: background-color 0.2s;\n}\n\n.b-slider--hovered:not(.b-slider--disabled) .b-slider__track {\n background-color: var(--b-slider-track-hover-bg);\n}\n\n.b-slider--disabled .b-slider__track {\n background-color: var(--b-slider-track-bg-disabled);\n}\n\n.b-slider--vertical .b-slider__track {\n width: 100%;\n height: auto;\n}\n\n/* Handle */\n.b-slider__handle {\n position: absolute;\n top: 50%;\n width: var(--b-slider-handle-size);\n height: var(--b-slider-handle-size);\n background-color: #fff;\n border: var(--b-slider-handle-line-width) solid var(--b-slider-handle-color);\n border-radius: 50%;\n transform: translate(-50%, -50%);\n cursor: grab;\n outline: none;\n transition:\n width 0.2s,\n height 0.2s,\n border-color 0.2s,\n border-width 0.2s,\n box-shadow 0.2s;\n touch-action: none;\n z-index: 1;\n}\n\n.b-slider--vertical .b-slider__handle {\n top: auto;\n left: 50%;\n transform: translate(-50%, 50%);\n}\n\n.b-slider__handle:hover,\n.b-slider__handle:focus-visible {\n width: var(--b-slider-handle-size-hover);\n height: var(--b-slider-handle-size-hover);\n border-width: var(--b-slider-handle-line-width-hover);\n border-color: var(--b-slider-handle-active-color);\n}\n\n.b-slider__handle--active {\n width: var(--b-slider-handle-size-hover);\n height: var(--b-slider-handle-size-hover);\n border-width: var(--b-slider-handle-line-width-hover);\n border-color: var(--b-slider-handle-active-color);\n box-shadow: 0 0 0 4px var(--b-slider-handle-active-outline-color);\n cursor: grabbing;\n}\n\n.b-slider__handle:focus-visible {\n box-shadow: 0 0 0 4px var(--b-slider-handle-active-outline-color);\n}\n\n.b-slider--disabled .b-slider__handle {\n border-color: var(--b-slider-handle-color-disabled);\n cursor: not-allowed;\n box-shadow: none;\n}\n\n.b-slider--disabled .b-slider__handle:hover,\n.b-slider--disabled .b-slider__handle:focus-visible {\n width: var(--b-slider-handle-size);\n height: var(--b-slider-handle-size);\n border-width: var(--b-slider-handle-line-width);\n border-color: var(--b-slider-handle-color-disabled);\n box-shadow: none;\n}\n\n/* Tooltip */\n.b-slider__tooltip {\n position: absolute;\n bottom: calc(100% + 8px);\n left: 50%;\n transform: translateX(-50%) scale(0.8);\n padding: 4px 8px;\n background-color: rgba(0, 0, 0, 0.85);\n color: #fff;\n font-size: 12px;\n line-height: 1.4;\n border-radius: 4px;\n white-space: nowrap;\n pointer-events: none;\n opacity: 0;\n transition:\n opacity 0.2s,\n transform 0.2s;\n}\n\n.b-slider__tooltip--visible {\n opacity: 1;\n transform: translateX(-50%) scale(1);\n}\n\n.b-slider--vertical .b-slider__tooltip {\n bottom: auto;\n left: calc(100% + 8px);\n top: 50%;\n transform: translateY(-50%) scale(0.8);\n}\n\n.b-slider--vertical .b-slider__tooltip--visible {\n transform: translateY(-50%) scale(1);\n}\n\n/* Dots */\n.b-slider__dot {\n position: absolute;\n top: 50%;\n width: var(--b-slider-dot-size);\n height: var(--b-slider-dot-size);\n background-color: #fff;\n border: 2px solid var(--b-slider-dot-border-color);\n border-radius: 50%;\n transform: translate(-50%, -50%);\n}\n\n.b-slider--vertical .b-slider__dot {\n top: auto;\n left: 50%;\n transform: translate(-50%, 50%);\n}\n\n.b-slider__dot--active {\n border-color: var(--b-slider-dot-active-border-color);\n}\n\n/* Marks */\n.b-slider__marks {\n position: relative;\n}\n\n.b-slider--vertical .b-slider__marks {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 3;\n pointer-events: none;\n}\n\n.b-slider__mark-text {\n position: absolute;\n top: 8px;\n transform: translateX(-50%);\n font-size: 12px;\n color: rgba(0, 0, 0, 0.65);\n white-space: nowrap;\n user-select: none;\n}\n\n.b-slider--vertical .b-slider__mark-text {\n top: auto;\n left: 20px;\n transform: translateY(50%);\n}\n\n.b-slider__mark-text--active {\n color: rgba(0, 0, 0, 0.88);\n}\n\n/* Dark mode */\n[data-prefers-color='dark'] .b-slider {\n --b-slider-rail-bg: rgba(255, 255, 255, 0.08);\n --b-slider-rail-hover-bg: rgba(255, 255, 255, 0.12);\n --b-slider-track-bg: #177ddc;\n --b-slider-track-bg-disabled: rgba(255, 255, 255, 0.08);\n --b-slider-track-hover-bg: #3c9ae8;\n --b-slider-handle-color: #177ddc;\n --b-slider-handle-color-disabled: rgba(255, 255, 255, 0.3);\n --b-slider-handle-active-color: #3c9ae8;\n --b-slider-handle-active-outline-color: rgba(23, 125, 220, 0.2);\n --b-slider-dot-border-color: rgba(255, 255, 255, 0.12);\n --b-slider-dot-active-border-color: #177ddc;\n}\n\n[data-prefers-color='dark'] .b-slider__tooltip {\n background-color: rgba(255, 255, 255, 0.9);\n color: #141414;\n}\n\n[data-prefers-color='dark'] .b-slider__handle {\n background-color: #141414;\n}\n\n[data-prefers-color='dark'] .b-slider__mark-text {\n color: rgba(255, 255, 255, 0.65);\n}\n\n[data-prefers-color='dark'] .b-slider__mark-text--active {\n color: rgba(255, 255, 255, 0.88);\n}\n\n@media (prefers-color-scheme: dark) {\n [data-prefers-color='system'] .b-slider {\n --b-slider-rail-bg: rgba(255, 255, 255, 0.08);\n --b-slider-rail-hover-bg: rgba(255, 255, 255, 0.12);\n --b-slider-track-bg: #177ddc;\n --b-slider-track-bg-disabled: rgba(255, 255, 255, 0.08);\n --b-slider-track-hover-bg: #3c9ae8;\n --b-slider-handle-color: #177ddc;\n --b-slider-handle-color-disabled: rgba(255, 255, 255, 0.3);\n --b-slider-handle-active-color: #3c9ae8;\n --b-slider-handle-active-outline-color: rgba(23, 125, 220, 0.2);\n --b-slider-dot-border-color: rgba(255, 255, 255, 0.12);\n --b-slider-dot-active-border-color: #177ddc;\n }\n [data-prefers-color='system'] .b-slider__tooltip {\n background-color: rgba(255, 255, 255, 0.9);\n color: #141414;\n }\n [data-prefers-color='system'] .b-slider__handle {\n background-color: #141414;\n }\n [data-prefers-color='system'] .b-slider__mark-text {\n color: rgba(255, 255, 255, 0.65);\n }\n [data-prefers-color='system'] .b-slider__mark-text--active {\n color: rgba(255, 255, 255, 0.88);\n }\n}\n\n/* Reduced motion */\n@media (prefers-reduced-motion: reduce) {\n .b-slider__handle,\n .b-slider__track,\n .b-slider__rail,\n .b-slider__tooltip {\n transition: none;\n }\n}\n</style>\n"],"mappings":"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"}
|
package/dist/design-system218.js
CHANGED
|
@@ -1,111 +1,8 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var C = ["data-status"], w = [
|
|
6
|
-
"role",
|
|
7
|
-
"tabindex",
|
|
8
|
-
"aria-disabled",
|
|
9
|
-
"aria-current",
|
|
10
|
-
"onClick",
|
|
11
|
-
"onKeydown"
|
|
12
|
-
], T = { class: "b:flex b:items-center b:gap-x-2" }, E = {
|
|
13
|
-
key: 0,
|
|
14
|
-
"aria-hidden": "true",
|
|
15
|
-
class: "b-steps__tail"
|
|
16
|
-
}, D = /* @__PURE__ */ p({
|
|
17
|
-
__name: "BSteps",
|
|
18
|
-
props: /* @__PURE__ */ m({
|
|
19
|
-
items: { default: () => [] },
|
|
20
|
-
status: { default: i.Process },
|
|
21
|
-
direction: { default: n.Horizontal },
|
|
22
|
-
size: { default: e.Medium },
|
|
23
|
-
labelPlacement: { default: r.Horizontal },
|
|
24
|
-
type: { default: a.Default }
|
|
25
|
-
}, {
|
|
26
|
-
modelValue: { default: 0 },
|
|
27
|
-
modelModifiers: {}
|
|
28
|
-
}),
|
|
29
|
-
emits: /* @__PURE__ */ m(["change"], ["update:modelValue"]),
|
|
30
|
-
setup(p, { emit: m }) {
|
|
31
|
-
let { items: D, status: O, direction: k, size: A, labelPlacement: j, type: M } = b(p), N = S(p, "modelValue"), P = m, F = c(() => A.value === e.Small ? e.Small : e.Medium), I = c(() => F.value === e.Small ? t.Small : t.Medium), L = c(() => ({
|
|
32
|
-
"--b-steps-icon-size": F.value === e.Small ? "1.5rem" : "2rem",
|
|
33
|
-
"--b-steps-gap": F.value === e.Small ? "0.5rem" : "0.75rem"
|
|
34
|
-
})), R = c(() => F.value === e.Small ? "b:text-sm" : "b:text-base"), z = c(() => F.value === e.Small ? "b:text-xs" : "b:text-sm"), B = c(() => M.value === a.Navigation), V = (e, t) => e.status ? e.status : t === N.value ? O.value || i.Process : t < N.value ? i.Finish : i.Wait, H = (e) => {
|
|
35
|
-
switch (e) {
|
|
36
|
-
case i.Finish:
|
|
37
|
-
case i.Process: return "var(--b-color-primary)";
|
|
38
|
-
case i.Error: return "var(--b-color-failure)";
|
|
39
|
-
case i.Wait:
|
|
40
|
-
default: return "var(--b-color-zinc-200)";
|
|
41
|
-
}
|
|
42
|
-
}, U = (e, t) => {
|
|
43
|
-
!B.value || e.disabled || (N.value = t, P("change", t));
|
|
44
|
-
}, W = (e, t, n) => {
|
|
45
|
-
(e.key === "Enter" || e.key === " ") && (e.preventDefault(), U(t, n));
|
|
46
|
-
}, G = (e) => ({
|
|
47
|
-
"b:border-secondary b:bg-white b:text-secondary": e === i.Wait,
|
|
48
|
-
"b:border-primary b:bg-primary b:text-white": e === i.Process,
|
|
49
|
-
"b:border-primary b:bg-white b:text-primary": e === i.Finish,
|
|
50
|
-
"b:border-failure b:bg-white b:text-failure": e === i.Error
|
|
51
|
-
}), K = (e) => ({
|
|
52
|
-
"b:text-black-base": e === i.Process || e === i.Finish,
|
|
53
|
-
"b:text-failure": e === i.Error,
|
|
54
|
-
"b:text-black/65": e === i.Wait
|
|
55
|
-
}), q = (e) => ({
|
|
56
|
-
"b:text-black/65": e !== i.Error,
|
|
57
|
-
"b:text-failure": e === i.Error
|
|
58
|
-
});
|
|
59
|
-
return (t, c) => (_(), d("ol", {
|
|
60
|
-
class: h(["b-steps", [{
|
|
61
|
-
"b-steps--horizontal": x(k) === x(n).Horizontal,
|
|
62
|
-
"b-steps--vertical": x(k) === x(n).Vertical,
|
|
63
|
-
"b-steps--label-vertical": x(k) === x(n).Horizontal && x(j) === x(r).Vertical,
|
|
64
|
-
"b-steps--navigation": x(M) === x(a).Navigation,
|
|
65
|
-
"b-steps--inline": x(M) === x(a).Inline
|
|
66
|
-
}]]),
|
|
67
|
-
style: g(L.value)
|
|
68
|
-
}, [(_(!0), d(s, null, v(x(D), (t, a) => (_(), d("li", {
|
|
69
|
-
key: `${t.title}-${a}`,
|
|
70
|
-
class: h(["b-steps__item", [{ "b:opacity-50": t.disabled }, { "b-steps__item--clickable": B.value && !t.disabled }]]),
|
|
71
|
-
"data-status": V(t, a),
|
|
72
|
-
style: g({ "--b-steps-tail-color": H(V(t, a)) })
|
|
73
|
-
}, [f("div", {
|
|
74
|
-
class: "b-steps__item-inner",
|
|
75
|
-
role: B.value && !t.disabled ? "button" : void 0,
|
|
76
|
-
tabindex: B.value && !t.disabled ? 0 : void 0,
|
|
77
|
-
"aria-disabled": t.disabled ? "true" : void 0,
|
|
78
|
-
"aria-current": a === N.value ? "step" : void 0,
|
|
79
|
-
onClick: (e) => U(t, a),
|
|
80
|
-
onKeydown: (e) => W(e, t, a)
|
|
81
|
-
}, [f("div", { class: h(["b-steps__icon b:flex b:items-center b:justify-center b:rounded-full b:border", [G(V(t, a)), {
|
|
82
|
-
"b:h-6 b:w-6": F.value === x(e).Small,
|
|
83
|
-
"b:h-8 b:w-8": F.value === x(e).Medium
|
|
84
|
-
}]]) }, [t.icon ? (_(), l(o, {
|
|
85
|
-
key: 0,
|
|
86
|
-
icon: t.icon,
|
|
87
|
-
size: I.value
|
|
88
|
-
}, null, 8, ["icon", "size"])) : V(t, a) === x(i).Finish ? (_(), l(o, {
|
|
89
|
-
key: 1,
|
|
90
|
-
icon: "check",
|
|
91
|
-
size: I.value
|
|
92
|
-
}, null, 8, ["size"])) : V(t, a) === x(i).Error ? (_(), l(o, {
|
|
93
|
-
key: 2,
|
|
94
|
-
icon: "xmark",
|
|
95
|
-
size: I.value
|
|
96
|
-
}, null, 8, ["size"])) : (_(), d("span", {
|
|
97
|
-
key: 3,
|
|
98
|
-
class: h(R.value)
|
|
99
|
-
}, y(a + 1), 3))], 2), f("div", { class: h(["b-steps__content b:flex b:flex-col b:gap-y-1", [{ "b:items-center b:text-center": x(k) === x(n).Horizontal && x(j) === x(r).Vertical }]]) }, [f("div", T, [f("span", { class: h(["b:font-medium", [R.value, K(V(t, a))]]) }, y(t.title), 3), t.subTitle ? (_(), d("span", {
|
|
100
|
-
key: 0,
|
|
101
|
-
class: h(["b:text-xs b:text-black/65", K(V(t, a))])
|
|
102
|
-
}, y(t.subTitle), 3)) : u("", !0)]), t.description ? (_(), d("p", {
|
|
103
|
-
key: 0,
|
|
104
|
-
class: h(["b:leading-snug", [z.value, q(V(t, a))]])
|
|
105
|
-
}, y(t.description), 3)) : u("", !0)], 2)], 40, w), x(k) === x(n).Horizontal && a < x(D).length - 1 ? (_(), d("span", E)) : u("", !0)], 14, C))), 128))], 6));
|
|
106
|
-
}
|
|
107
|
-
});
|
|
1
|
+
import e from "./design-system216.js";
|
|
2
|
+
/* empty css */
|
|
3
|
+
//#region src/components/BSlider/BSlider.vue
|
|
4
|
+
var t = e;
|
|
108
5
|
//#endregion
|
|
109
|
-
export {
|
|
6
|
+
export { t as default };
|
|
110
7
|
|
|
111
8
|
//# sourceMappingURL=design-system218.js.map
|