@7pmlabs/design-system 1.0.10 → 1.0.11
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 +57 -6
- package/dist/design-system.css +1 -1
- package/dist/design-system.js +66 -60
- package/dist/design-system100.js +4 -5
- package/dist/design-system100.js.map +1 -1
- package/dist/design-system101.js +53 -506
- package/dist/design-system101.js.map +1 -1
- package/dist/{design-system93.js → design-system102.js} +1 -1
- package/dist/design-system102.js.map +1 -0
- package/dist/design-system103.js +13 -5
- package/dist/design-system103.js.map +1 -1
- package/dist/design-system104.js +109 -7
- package/dist/design-system104.js.map +1 -1
- package/dist/design-system106.js +9 -0
- package/dist/design-system106.js.map +1 -0
- package/dist/design-system107.js +206 -6
- package/dist/design-system107.js.map +1 -1
- package/dist/design-system109.js +9 -0
- package/dist/design-system109.js.map +1 -0
- package/dist/design-system110.js +507 -6
- package/dist/design-system110.js.map +1 -1
- package/dist/design-system112.js +8 -0
- package/dist/design-system112.js.map +1 -0
- package/dist/design-system113.js +7 -5
- package/dist/design-system113.js.map +1 -1
- package/dist/design-system114.js +209 -9
- package/dist/design-system114.js.map +1 -1
- package/dist/design-system116.js +9 -0
- package/dist/design-system116.js.map +1 -0
- package/dist/design-system117.js +224 -6
- package/dist/design-system117.js.map +1 -1
- package/dist/design-system119.js +9 -0
- package/dist/design-system119.js.map +1 -0
- package/dist/design-system12.js.map +1 -1
- package/dist/design-system120.js +163 -5
- package/dist/design-system120.js.map +1 -1
- package/dist/design-system122.js +5 -90
- package/dist/design-system122.js.map +1 -1
- package/dist/design-system123.js +12 -0
- package/dist/design-system123.js.map +1 -0
- package/dist/design-system124.js +274 -5
- package/dist/design-system124.js.map +1 -1
- package/dist/design-system126.js +9 -0
- package/dist/design-system126.js.map +1 -0
- package/dist/design-system127.js +16 -5
- package/dist/design-system127.js.map +1 -1
- package/dist/design-system129.js +8 -0
- package/dist/design-system129.js.map +1 -0
- package/dist/design-system130.js +12 -5
- package/dist/design-system130.js.map +1 -1
- package/dist/design-system131.js +76 -137
- package/dist/design-system131.js.map +1 -1
- package/dist/design-system133.js +1 -1
- package/dist/design-system133.js.map +1 -1
- package/dist/design-system134.js +37 -90
- package/dist/design-system134.js.map +1 -1
- package/dist/design-system136.js +1 -1
- package/dist/design-system136.js.map +1 -1
- package/dist/design-system137.js +226 -20
- package/dist/design-system137.js.map +1 -1
- package/dist/design-system139.js +4 -5
- package/dist/design-system139.js.map +1 -1
- package/dist/design-system140.js +151 -9
- package/dist/design-system140.js.map +1 -1
- package/dist/design-system142.js +3 -2
- package/dist/design-system142.js.map +1 -1
- package/dist/design-system143.js +93 -19
- package/dist/design-system143.js.map +1 -1
- package/dist/design-system145.js +5 -158
- package/dist/design-system145.js.map +1 -1
- package/dist/design-system146.js +12 -0
- package/dist/design-system146.js.map +1 -0
- package/dist/design-system147.js +37 -5
- package/dist/design-system147.js.map +1 -1
- package/dist/design-system148.js +4 -307
- package/dist/design-system148.js.map +1 -1
- package/dist/design-system149.js +24 -0
- package/dist/{design-system144.js.map → design-system149.js.map} +1 -1
- package/dist/design-system150.js +2 -3
- package/dist/design-system150.js.map +1 -1
- package/dist/design-system151.js +131 -213
- package/dist/design-system151.js.map +1 -1
- package/dist/design-system153.js +1 -1
- package/dist/design-system153.js.map +1 -1
- package/dist/design-system154.js +278 -160
- package/dist/design-system154.js.map +1 -1
- package/dist/design-system156.js +1 -1
- package/dist/design-system156.js.map +1 -1
- package/dist/design-system157.js +240 -3
- package/dist/design-system157.js.map +1 -1
- package/dist/design-system159.js +8 -0
- package/dist/design-system159.js.map +1 -0
- package/dist/design-system16.js.map +1 -1
- package/dist/design-system160.js +189 -6
- package/dist/design-system160.js.map +1 -1
- package/dist/design-system162.js +8 -0
- package/dist/design-system162.js.map +1 -0
- package/dist/design-system163.js +3 -6
- package/dist/design-system163.js.map +1 -1
- package/dist/design-system164.js +46 -57
- package/dist/design-system164.js.map +1 -1
- package/dist/design-system166.js +2 -2
- package/dist/design-system166.js.map +1 -1
- package/dist/design-system167.js +44 -170
- package/dist/design-system167.js.map +1 -1
- package/dist/design-system169.js +2 -2
- package/dist/design-system169.js.map +1 -1
- package/dist/design-system170.js +55 -101
- package/dist/design-system170.js.map +1 -1
- package/dist/design-system172.js +5 -4
- package/dist/design-system172.js.map +1 -1
- package/dist/design-system173.js +182 -11
- package/dist/design-system173.js.map +1 -1
- package/dist/design-system175.js +9 -0
- package/dist/design-system175.js.map +1 -0
- package/dist/design-system176.js +115 -6
- package/dist/design-system176.js.map +1 -1
- package/dist/design-system178.js +8 -0
- package/dist/design-system178.js.map +1 -0
- package/dist/design-system179.js +11 -5
- package/dist/design-system179.js.map +1 -1
- package/dist/design-system180.js +444 -70
- package/dist/design-system180.js.map +1 -1
- package/dist/design-system182.js +5 -4
- package/dist/design-system182.js.map +1 -1
- package/dist/design-system183.js +21 -21
- package/dist/design-system183.js.map +1 -1
- package/dist/design-system185.js +1 -1
- package/dist/design-system185.js.map +1 -1
- package/dist/design-system186.js +85 -25
- package/dist/design-system186.js.map +1 -1
- package/dist/design-system188.js +1 -1
- package/dist/design-system188.js.map +1 -1
- package/dist/design-system189.js +7 -5
- package/dist/design-system189.js.map +1 -1
- package/dist/design-system19.js.map +1 -1
- package/dist/design-system191.js +1 -1
- package/dist/design-system191.js.map +1 -1
- package/dist/design-system192.js +20 -23
- package/dist/design-system192.js.map +1 -1
- package/dist/design-system194.js +1 -1
- package/dist/design-system194.js.map +1 -1
- package/dist/design-system195.js +24 -323
- package/dist/design-system195.js.map +1 -1
- package/dist/design-system197.js +1 -1
- package/dist/design-system197.js.map +1 -1
- package/dist/design-system198.js +19 -88
- 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 +330 -17
- package/dist/design-system201.js.map +1 -1
- package/dist/design-system203.js +5 -3
- package/dist/design-system203.js.map +1 -1
- package/dist/design-system204.js +88 -407
- 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 +17 -106
- package/dist/design-system207.js.map +1 -1
- package/dist/{design-system202.js → design-system208.js} +2 -2
- package/dist/{design-system202.js.map → design-system208.js.map} +1 -1
- package/dist/design-system209.js +3 -6
- package/dist/design-system209.js.map +1 -1
- package/dist/design-system210.js +403 -90
- package/dist/design-system210.js.map +1 -1
- package/dist/design-system212.js +4 -5
- package/dist/design-system212.js.map +1 -1
- package/dist/design-system213.js +45 -723
- 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 +88 -11
- package/dist/design-system216.js.map +1 -1
- package/dist/design-system217.js +4 -525
- package/dist/design-system217.js.map +1 -1
- package/dist/design-system218.js +111 -0
- package/dist/design-system218.js.map +1 -0
- package/dist/design-system22.js.map +1 -1
- package/dist/design-system220.js +6 -3
- package/dist/design-system220.js.map +1 -1
- package/dist/design-system221.js +103 -43
- package/dist/design-system221.js.map +1 -1
- package/dist/design-system223.js +6 -283
- package/dist/design-system223.js.map +1 -1
- package/dist/design-system224.js +740 -0
- package/dist/design-system224.js.map +1 -0
- package/dist/design-system226.js +5 -119
- package/dist/design-system226.js.map +1 -1
- package/dist/{design-system60.js → design-system227.js} +6 -8
- package/dist/design-system227.js.map +1 -0
- package/dist/design-system228.js +525 -5
- package/dist/design-system228.js.map +1 -1
- package/dist/{design-system219.js → design-system230.js} +2 -2
- package/dist/{design-system219.js.map → design-system230.js.map} +1 -1
- package/dist/design-system231.js +3 -5
- package/dist/design-system231.js.map +1 -1
- package/dist/design-system232.js +42 -50
- package/dist/design-system232.js.map +1 -1
- package/dist/design-system233.js +1 -1
- package/dist/design-system233.js.map +1 -1
- package/dist/design-system234.js +254 -141
- package/dist/design-system234.js.map +1 -1
- package/dist/design-system236.js +1 -1
- package/dist/design-system236.js.map +1 -1
- package/dist/design-system237.js +119 -7
- package/dist/design-system237.js.map +1 -1
- package/dist/design-system239.js +8 -0
- package/dist/design-system239.js.map +1 -0
- package/dist/design-system240.js +112 -5
- package/dist/design-system240.js.map +1 -1
- package/dist/design-system242.js +8 -0
- package/dist/design-system242.js.map +1 -0
- package/dist/design-system243.js +54 -6
- package/dist/design-system243.js.map +1 -1
- package/dist/design-system244.js +4 -7
- package/dist/design-system244.js.map +1 -1
- package/dist/design-system245.js +139 -343
- package/dist/design-system245.js.map +1 -1
- package/dist/design-system247.js +4 -5
- package/dist/design-system247.js.map +1 -1
- package/dist/design-system248.js +10 -0
- package/dist/design-system248.js.map +1 -0
- package/dist/{design-system238.js → design-system249.js} +2 -2
- package/dist/design-system249.js.map +1 -0
- package/dist/design-system25.js.map +1 -1
- package/dist/design-system251.js +8 -0
- package/dist/design-system251.js.map +1 -0
- package/dist/{design-system241.js → design-system252.js} +1 -1
- package/dist/design-system252.js.map +1 -0
- package/dist/design-system254.js +9 -0
- package/dist/design-system254.js.map +1 -0
- package/dist/design-system255.js +12 -0
- package/dist/design-system255.js.map +1 -0
- package/dist/design-system256.js +769 -0
- package/dist/design-system256.js.map +1 -0
- package/dist/design-system258.js +9 -0
- package/dist/design-system258.js.map +1 -0
- package/dist/design-system259.js +10 -0
- package/dist/design-system259.js.map +1 -0
- package/dist/design-system260.js +377 -0
- package/dist/design-system260.js.map +1 -0
- package/dist/design-system262.js +9 -0
- package/dist/design-system262.js.map +1 -0
- package/dist/design-system28.js.map +1 -1
- package/dist/design-system3.js.map +1 -1
- package/dist/design-system30.js +21 -138
- package/dist/design-system30.js.map +1 -1
- package/dist/design-system32.js +5 -4
- package/dist/design-system32.js.map +1 -1
- package/dist/design-system33.js +488 -14
- package/dist/design-system33.js.map +1 -1
- package/dist/design-system35.js +1 -1
- package/dist/design-system35.js.map +1 -1
- package/dist/design-system36.js +135 -17
- package/dist/design-system36.js.map +1 -1
- package/dist/design-system38.js +1 -1
- package/dist/design-system38.js.map +1 -1
- package/dist/design-system39.js +16 -11
- package/dist/design-system39.js.map +1 -1
- package/dist/design-system4.js.map +1 -1
- package/dist/design-system41.js +8 -0
- package/dist/design-system41.js.map +1 -0
- package/dist/design-system42.js +26 -5
- package/dist/design-system42.js.map +1 -1
- package/dist/design-system44.js +5 -71
- package/dist/design-system44.js.map +1 -1
- package/dist/design-system45.js +353 -0
- package/dist/design-system45.js.map +1 -0
- package/dist/design-system47.js +5 -50
- package/dist/design-system47.js.map +1 -1
- package/dist/design-system48.js +11 -4
- package/dist/design-system48.js.map +1 -1
- package/dist/design-system49.js +476 -3
- package/dist/design-system49.js.map +1 -1
- package/dist/design-system51.js +8 -0
- package/dist/design-system51.js.map +1 -0
- package/dist/design-system52.js +3 -5
- package/dist/design-system52.js.map +1 -1
- package/dist/design-system53.js +56 -83
- package/dist/design-system53.js.map +1 -1
- package/dist/design-system55.js +5 -4
- package/dist/design-system55.js.map +1 -1
- package/dist/design-system56.js +50 -11
- package/dist/design-system56.js.map +1 -1
- package/dist/design-system57.js +4 -591
- package/dist/design-system57.js.map +1 -1
- package/dist/design-system58.js +6 -0
- package/dist/design-system58.js.map +1 -0
- package/dist/design-system59.js +64 -5
- package/dist/design-system59.js.map +1 -1
- package/dist/design-system61.js +5 -696
- package/dist/design-system61.js.map +1 -1
- package/dist/design-system62.js +101 -0
- package/dist/design-system62.js.map +1 -0
- package/dist/design-system64.js +5 -158
- package/dist/design-system64.js.map +1 -1
- package/dist/design-system65.js +14 -0
- package/dist/design-system65.js.map +1 -0
- package/dist/design-system66.js +591 -5
- package/dist/design-system66.js.map +1 -1
- package/dist/design-system68.js +3 -2
- package/dist/design-system68.js.map +1 -1
- package/dist/design-system69.js +13 -49
- package/dist/design-system69.js.map +1 -1
- package/dist/design-system7.js.map +1 -1
- package/dist/design-system70.js +699 -0
- package/dist/{design-system63.js.map → design-system70.js.map} +1 -1
- package/dist/design-system72.js +5 -199
- package/dist/design-system72.js.map +1 -1
- package/dist/design-system73.js +161 -0
- package/dist/design-system73.js.map +1 -0
- package/dist/design-system75.js +5 -7
- package/dist/design-system75.js.map +1 -1
- package/dist/design-system76.js +25 -269
- package/dist/design-system76.js.map +1 -1
- package/dist/design-system77.js +7 -0
- package/dist/design-system77.js.map +1 -0
- package/dist/design-system78.js +49 -5
- package/dist/design-system78.js.map +1 -1
- package/dist/{design-system71.js → design-system80.js} +2 -2
- package/dist/{design-system71.js.map → design-system80.js.map} +1 -1
- package/dist/design-system81.js +199 -5
- package/dist/design-system81.js.map +1 -1
- package/dist/design-system83.js +5 -99
- package/dist/design-system83.js.map +1 -1
- package/dist/design-system84.js +10 -0
- package/dist/design-system84.js.map +1 -0
- package/dist/design-system85.js +273 -5
- package/dist/design-system85.js.map +1 -1
- package/dist/design-system87.js +8 -0
- package/dist/design-system87.js.map +1 -0
- package/dist/design-system88.js +57 -5
- package/dist/design-system88.js.map +1 -1
- package/dist/design-system90.js +8 -0
- package/dist/design-system90.js.map +1 -0
- package/dist/design-system91.js +11 -5
- package/dist/design-system91.js.map +1 -1
- package/dist/design-system92.js +98 -53
- package/dist/design-system92.js.map +1 -1
- package/dist/design-system94.js +5 -13
- package/dist/design-system94.js.map +1 -1
- package/dist/design-system95.js +61 -104
- package/dist/design-system95.js.map +1 -1
- package/dist/design-system97.js +4 -5
- package/dist/design-system97.js.map +1 -1
- package/dist/design-system98.js +80 -198
- package/dist/design-system98.js.map +1 -1
- package/dist/types/components/BCalendar/BCalendar.spec.d.ts +1 -0
- package/dist/types/components/BCalendar/BCalendar.vue.d.ts +114 -0
- package/dist/types/components/BCalendar/index.d.ts +2 -0
- package/dist/types/components/BCalendar/types.d.ts +54 -0
- package/dist/types/components/BCarousel/BCarousel.spec.d.ts +1 -0
- package/dist/types/components/BCarousel/BCarousel.vue.d.ts +133 -0
- package/dist/types/components/BCarousel/index.d.ts +2 -0
- package/dist/types/components/BCarousel/types.d.ts +15 -0
- package/dist/types/components/BPagination/BPagination.vue.d.ts +1 -1
- package/dist/types/components/BStatistic/BStatistic.spec.d.ts +1 -0
- package/dist/types/components/BStatistic/BStatistic.vue.d.ts +44 -0
- package/dist/types/components/BStatistic/BStatisticTimer.vue.d.ts +50 -0
- package/dist/types/components/BStatistic/index.d.ts +3 -0
- package/dist/types/components/BStatistic/types.d.ts +6 -0
- package/dist/types/components/BTreeSelect/BTreeSelect.spec.d.ts +1 -0
- package/dist/types/components/BTreeSelect/BTreeSelect.vue.d.ts +143 -0
- package/dist/types/components/BTreeSelect/index.d.ts +2 -0
- package/dist/types/components/BTreeSelect/types.d.ts +77 -0
- package/dist/types/components/index.d.ts +4 -0
- package/dist/types/types.d.ts +3 -0
- package/package.json +6 -3
- package/dist/design-system105.js +0 -212
- package/dist/design-system105.js.map +0 -1
- package/dist/design-system108.js +0 -227
- package/dist/design-system108.js.map +0 -1
- package/dist/design-system111.js +0 -166
- package/dist/design-system111.js.map +0 -1
- package/dist/design-system115.js +0 -277
- package/dist/design-system115.js.map +0 -1
- package/dist/design-system118.js +0 -19
- package/dist/design-system118.js.map +0 -1
- package/dist/design-system121.js +0 -15
- package/dist/design-system121.js.map +0 -1
- package/dist/design-system125.js +0 -45
- package/dist/design-system125.js.map +0 -1
- package/dist/design-system128.js +0 -236
- package/dist/design-system128.js.map +0 -1
- package/dist/design-system141.js +0 -40
- package/dist/design-system141.js.map +0 -1
- package/dist/design-system144.js +0 -7
- package/dist/design-system158.js +0 -61
- package/dist/design-system158.js.map +0 -1
- package/dist/design-system161.js +0 -59
- package/dist/design-system161.js.map +0 -1
- package/dist/design-system174.js +0 -465
- package/dist/design-system174.js.map +0 -1
- package/dist/design-system177.js +0 -38
- package/dist/design-system177.js.map +0 -1
- package/dist/design-system222.js +0 -7
- package/dist/design-system222.js.map +0 -1
- package/dist/design-system225.js +0 -8
- package/dist/design-system225.js.map +0 -1
- package/dist/design-system229.js +0 -115
- package/dist/design-system229.js.map +0 -1
- package/dist/design-system238.js.map +0 -1
- package/dist/design-system241.js.map +0 -1
- package/dist/design-system40.js +0 -479
- package/dist/design-system40.js.map +0 -1
- package/dist/design-system43.js +0 -6
- package/dist/design-system43.js.map +0 -1
- package/dist/design-system46.js +0 -9
- package/dist/design-system46.js.map +0 -1
- package/dist/design-system50.js +0 -67
- package/dist/design-system50.js.map +0 -1
- package/dist/design-system60.js.map +0 -1
- package/dist/design-system63.js +0 -8
- package/dist/design-system67.js +0 -32
- package/dist/design-system67.js.map +0 -1
- package/dist/design-system74.js +0 -8
- package/dist/design-system74.js.map +0 -1
- package/dist/design-system79.js +0 -60
- package/dist/design-system79.js.map +0 -1
- package/dist/design-system82.js +0 -14
- package/dist/design-system82.js.map +0 -1
- package/dist/design-system86.js +0 -69
- package/dist/design-system86.js.map +0 -1
- package/dist/design-system89.js +0 -91
- package/dist/design-system89.js.map +0 -1
- package/dist/design-system93.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"design-system3.js","names":[],"sources":["../src/types.ts"],"sourcesContent":["import type { RouteLocationRaw } from 'vue-router';\nimport type { BIconBrandName, BIconName } from './components/BIcon/BIconEnum.ts';\n\nexport enum BCommonSize {\n Small = 'sm',\n Medium = 'md',\n Large = 'lg',\n}\n\nexport enum BCommonColor {\n Primary = 'primary',\n Secondary = 'secondary',\n Success = 'success',\n Failure = 'failure',\n Warning = 'warning',\n Info = 'info',\n}\n\nexport enum BButtonVariant {\n Solid = 'solid',\n Outlined = 'outlined',\n Dashed = 'dashed',\n Text = 'text',\n Link = 'link',\n}\n\nexport enum BIconSize {\n XSmall = 'xs',\n Small = 'sm',\n Medium = 'md',\n Large = 'lg',\n XLarge = 'xl',\n XXLarge = 'xxl',\n}\n\nexport enum BIconVariant {\n Duotone = 'duotone',\n Light = 'light',\n Regular = 'regular',\n SharpLight = 'sharp-light',\n SharpRegular = 'sharp-regular',\n SharpSolid = 'sharp-solid',\n SharpThin = 'sharp-thin',\n Solid = 'solid',\n Thin = 'thin',\n}\n\nexport type {\n BCollapseCollapsible,\n BCollapseExpandIconPosition,\n BCollapseSize,\n} from './components/BCollapse/types';\n\nexport type {\n BDescriptionsItem as BDescriptionsItemData,\n BDescriptionsLayout,\n BDescriptionsSize,\n} from './components/BDescriptions/types';\n\nexport type {\n BSegmentedOption,\n BSegmentedRawOption,\n BSegmentedSize,\n} from './components/BSegmented/types';\n\nexport type { BTagColor, BTagPresetColor, BTagSize, BTagVariant } from './components/BTag/types';\n\nexport type {\n BTimelineItemColor,\n BTimelineItem as BTimelineItemData,\n BTimelineItemPlacement,\n BTimelineItemStatus,\n BTimelineMode,\n BTimelineOrientation,\n BTimelineVariant,\n} from './components/BTimeline/types';\n\nexport type {\n BTableAlign,\n BTableChangeExtra,\n BTableColumnType,\n BTableExpandable,\n BTableExpandIconProps,\n BTableFilterOption,\n BTableFilterState,\n BTableFilterValue,\n BTablePaginationConfig,\n BTableRowDragConfig,\n BTableRowSelection,\n BTableRowSelectionType,\n BTableScrollConfig,\n BTableSelectionItem,\n BTableSize,\n BTableSorterResult,\n BTableSortOrder,\n BTableSummaryCell,\n} from './components/BTable/types';\n\nexport interface BBreadcrumbItem {\n /** Display text for the breadcrumb item. */\n text: string;\n /** URL the item links to. */\n href?: string;\n /** Vue Router location for the item. */\n to?: RouteLocationRaw;\n /** Optional icon name displayed before the text. */\n icon?: BIconName;\n}\n\nexport enum BAlertType {\n Success = 'success',\n Info = 'info',\n Warning = 'warning',\n Error = 'error',\n}\n\nexport enum BDrawerPlacement {\n Top = 'top',\n Right = 'right',\n Bottom = 'bottom',\n Left = 'left',\n}\n\nexport enum BDrawerSize {\n Default = 'default',\n Large = 'large',\n}\n\nexport enum BMessageType {\n Success = 'success',\n Error = 'error',\n Info = 'info',\n Warning = 'warning',\n Loading = 'loading',\n}\n\nexport enum BNotificationType {\n Success = 'success',\n Info = 'info',\n Warning = 'warning',\n Error = 'error',\n}\n\nexport enum BNotificationPlacement {\n TopLeft = 'top-left',\n TopRight = 'top-right',\n BottomLeft = 'bottom-left',\n BottomRight = 'bottom-right',\n}\n\nexport enum BTooltipTrigger {\n Hover = 'hover',\n Click = 'click',\n Focus = 'focus',\n}\n\nexport enum BTooltipPlacement {\n TopLeft = 'top-left',\n TopCenter = 'top-center',\n TopRight = 'top-right',\n RightTop = 'right-top',\n RightCenter = 'right-center',\n RightBottom = 'right-bottom',\n BottomRight = 'bottom-right',\n BottomCenter = 'bottom-center',\n BottomLeft = 'bottom-left',\n LeftBottom = 'left-bottom',\n LeftCenter = 'left-center',\n LeftTop = 'left-top',\n}\n\nexport enum BPopconfirmPlacement {\n TopLeft = 'top-left',\n TopCenter = 'top-center',\n TopRight = 'top-right',\n RightTop = 'right-top',\n RightCenter = 'right-center',\n RightBottom = 'right-bottom',\n BottomRight = 'bottom-right',\n BottomCenter = 'bottom-center',\n BottomLeft = 'bottom-left',\n LeftBottom = 'left-bottom',\n LeftCenter = 'left-center',\n LeftTop = 'left-top',\n}\n\nexport enum BPopconfirmTrigger {\n Hover = 'hover',\n Click = 'click',\n Focus = 'focus',\n}\n\nexport enum BPopoverPlacement {\n TopLeft = 'top-left',\n TopCenter = 'top-center',\n TopRight = 'top-right',\n RightTop = 'right-top',\n RightCenter = 'right-center',\n RightBottom = 'right-bottom',\n BottomRight = 'bottom-right',\n BottomCenter = 'bottom-center',\n BottomLeft = 'bottom-left',\n LeftBottom = 'left-bottom',\n LeftCenter = 'left-center',\n LeftTop = 'left-top',\n}\n\nexport enum BPopoverTrigger {\n Hover = 'hover',\n Click = 'click',\n Focus = 'focus',\n}\n\nexport enum BStepsStatus {\n Wait = 'wait',\n Process = 'process',\n Finish = 'finish',\n Error = 'error',\n}\n\nexport enum BStepsDirection {\n Horizontal = 'horizontal',\n Vertical = 'vertical',\n}\n\nexport enum BStepsType {\n Default = 'default',\n Navigation = 'navigation',\n Inline = 'inline',\n}\n\nexport enum BStepsLabelPlacement {\n Horizontal = 'horizontal',\n Vertical = 'vertical',\n}\n\nexport enum BSpinSize {\n Small = 'small',\n Default = 'default',\n Large = 'large',\n}\n\nexport enum BAvatarShape {\n Circle = 'circle',\n Square = 'square',\n}\n\nexport enum BAvatarSize {\n Small = 'small',\n Default = 'default',\n Large = 'large',\n}\n\nexport enum BBadgeSize {\n Default = 'default',\n Small = 'small',\n}\n\nexport enum BBadgeStatus {\n Success = 'success',\n Processing = 'processing',\n Default = 'default',\n Error = 'error',\n Warning = 'warning',\n}\n\nexport enum BCardSize {\n Default = 'default',\n Small = 'small',\n}\n\nexport enum BCardType {\n Default = 'default',\n Inner = 'inner',\n}\n\nexport interface BCardTabItem {\n key: string;\n tab: string;\n disabled?: boolean;\n}\n\nexport enum BEmptyImage {\n Default = 'default',\n Simple = 'simple',\n}\n\nexport interface BStepItem {\n title: string;\n subTitle?: string;\n description?: string;\n status?: `${BStepsStatus}`;\n icon?: `${BIconName}` | `${BIconBrandName}`;\n disabled?: boolean;\n}\n"],"mappings":";AAGA,IAAY,IAAL,yBAAA,GAAA;QACL,EAAA,QAAA,MACA,EAAA,SAAA,MACA,EAAA,QAAA;KACD,EAEW,IAAL,yBAAA,GAAA;QACL,EAAA,UAAA,WACA,EAAA,YAAA,aACA,EAAA,UAAA,WACA,EAAA,UAAA,WACA,EAAA,UAAA,WACA,EAAA,OAAA;KACD,EAEW,IAAL,yBAAA,GAAA;QACL,EAAA,QAAA,SACA,EAAA,WAAA,YACA,EAAA,SAAA,UACA,EAAA,OAAA,QACA,EAAA,OAAA;KACD,EAEW,IAAL,yBAAA,GAAA;QACL,EAAA,SAAA,MACA,EAAA,QAAA,MACA,EAAA,SAAA,MACA,EAAA,QAAA,MACA,EAAA,SAAA,MACA,EAAA,UAAA;KACD,EAEW,IAAL,yBAAA,GAAA;QACL,EAAA,UAAA,WACA,EAAA,QAAA,SACA,EAAA,UAAA,WACA,EAAA,aAAA,eACA,EAAA,eAAA,iBACA,EAAA,aAAA,eACA,EAAA,YAAA,cACA,EAAA,QAAA,SACA,EAAA,OAAA;KACD,
|
|
1
|
+
{"version":3,"file":"design-system3.js","names":[],"sources":["../src/types.ts"],"sourcesContent":["import type { RouteLocationRaw } from 'vue-router';\nimport type { BIconBrandName, BIconName } from './components/BIcon/BIconEnum.ts';\n\nexport enum BCommonSize {\n Small = 'sm',\n Medium = 'md',\n Large = 'lg',\n}\n\nexport enum BCommonColor {\n Primary = 'primary',\n Secondary = 'secondary',\n Success = 'success',\n Failure = 'failure',\n Warning = 'warning',\n Info = 'info',\n}\n\nexport enum BButtonVariant {\n Solid = 'solid',\n Outlined = 'outlined',\n Dashed = 'dashed',\n Text = 'text',\n Link = 'link',\n}\n\nexport enum BIconSize {\n XSmall = 'xs',\n Small = 'sm',\n Medium = 'md',\n Large = 'lg',\n XLarge = 'xl',\n XXLarge = 'xxl',\n}\n\nexport enum BIconVariant {\n Duotone = 'duotone',\n Light = 'light',\n Regular = 'regular',\n SharpLight = 'sharp-light',\n SharpRegular = 'sharp-regular',\n SharpSolid = 'sharp-solid',\n SharpThin = 'sharp-thin',\n Solid = 'solid',\n Thin = 'thin',\n}\n\nexport type {\n BCollapseCollapsible,\n BCollapseExpandIconPosition,\n BCollapseSize,\n} from './components/BCollapse/types';\n\nexport type {\n BDescriptionsItem as BDescriptionsItemData,\n BDescriptionsLayout,\n BDescriptionsSize,\n} from './components/BDescriptions/types';\n\nexport type {\n BSegmentedOption,\n BSegmentedRawOption,\n BSegmentedSize,\n} from './components/BSegmented/types';\n\nexport type { BTagColor, BTagPresetColor, BTagSize, BTagVariant } from './components/BTag/types';\n\nexport type {\n BStatisticFormatter,\n BStatisticTimerType,\n BStatisticValue,\n} from './components/BStatistic/types';\n\nexport type {\n BCarouselAutoplayConfig,\n BCarouselBeforeChangePayload,\n BCarouselDotPlacement,\n BCarouselEffect,\n} from './components/BCarousel/types';\n\nexport type {\n BCalendarCellRenderType,\n BCalendarCellSlotScope,\n BCalendarEvent,\n BCalendarEventDetailsSlotScope,\n BCalendarEventType,\n BCalendarHeaderSlotScope,\n BCalendarMode,\n BCalendarSelectInfo,\n BCalendarSelectSource,\n} from './components/BCalendar/types';\n\nexport type {\n BTimelineItemColor,\n BTimelineItem as BTimelineItemData,\n BTimelineItemPlacement,\n BTimelineItemStatus,\n BTimelineMode,\n BTimelineOrientation,\n BTimelineVariant,\n} from './components/BTimeline/types';\n\nexport type {\n BTableAlign,\n BTableChangeExtra,\n BTableColumnType,\n BTableExpandable,\n BTableExpandIconProps,\n BTableFilterOption,\n BTableFilterState,\n BTableFilterValue,\n BTablePaginationConfig,\n BTableRowDragConfig,\n BTableRowSelection,\n BTableRowSelectionType,\n BTableScrollConfig,\n BTableSelectionItem,\n BTableSize,\n BTableSorterResult,\n BTableSortOrder,\n BTableSummaryCell,\n} from './components/BTable/types';\n\nexport interface BBreadcrumbItem {\n /** Display text for the breadcrumb item. */\n text: string;\n /** URL the item links to. */\n href?: string;\n /** Vue Router location for the item. */\n to?: RouteLocationRaw;\n /** Optional icon name displayed before the text. */\n icon?: BIconName;\n}\n\nexport enum BAlertType {\n Success = 'success',\n Info = 'info',\n Warning = 'warning',\n Error = 'error',\n}\n\nexport enum BDrawerPlacement {\n Top = 'top',\n Right = 'right',\n Bottom = 'bottom',\n Left = 'left',\n}\n\nexport enum BDrawerSize {\n Default = 'default',\n Large = 'large',\n}\n\nexport enum BMessageType {\n Success = 'success',\n Error = 'error',\n Info = 'info',\n Warning = 'warning',\n Loading = 'loading',\n}\n\nexport enum BNotificationType {\n Success = 'success',\n Info = 'info',\n Warning = 'warning',\n Error = 'error',\n}\n\nexport enum BNotificationPlacement {\n TopLeft = 'top-left',\n TopRight = 'top-right',\n BottomLeft = 'bottom-left',\n BottomRight = 'bottom-right',\n}\n\nexport enum BTooltipTrigger {\n Hover = 'hover',\n Click = 'click',\n Focus = 'focus',\n}\n\nexport enum BTooltipPlacement {\n TopLeft = 'top-left',\n TopCenter = 'top-center',\n TopRight = 'top-right',\n RightTop = 'right-top',\n RightCenter = 'right-center',\n RightBottom = 'right-bottom',\n BottomRight = 'bottom-right',\n BottomCenter = 'bottom-center',\n BottomLeft = 'bottom-left',\n LeftBottom = 'left-bottom',\n LeftCenter = 'left-center',\n LeftTop = 'left-top',\n}\n\nexport enum BPopconfirmPlacement {\n TopLeft = 'top-left',\n TopCenter = 'top-center',\n TopRight = 'top-right',\n RightTop = 'right-top',\n RightCenter = 'right-center',\n RightBottom = 'right-bottom',\n BottomRight = 'bottom-right',\n BottomCenter = 'bottom-center',\n BottomLeft = 'bottom-left',\n LeftBottom = 'left-bottom',\n LeftCenter = 'left-center',\n LeftTop = 'left-top',\n}\n\nexport enum BPopconfirmTrigger {\n Hover = 'hover',\n Click = 'click',\n Focus = 'focus',\n}\n\nexport enum BPopoverPlacement {\n TopLeft = 'top-left',\n TopCenter = 'top-center',\n TopRight = 'top-right',\n RightTop = 'right-top',\n RightCenter = 'right-center',\n RightBottom = 'right-bottom',\n BottomRight = 'bottom-right',\n BottomCenter = 'bottom-center',\n BottomLeft = 'bottom-left',\n LeftBottom = 'left-bottom',\n LeftCenter = 'left-center',\n LeftTop = 'left-top',\n}\n\nexport enum BPopoverTrigger {\n Hover = 'hover',\n Click = 'click',\n Focus = 'focus',\n}\n\nexport enum BStepsStatus {\n Wait = 'wait',\n Process = 'process',\n Finish = 'finish',\n Error = 'error',\n}\n\nexport enum BStepsDirection {\n Horizontal = 'horizontal',\n Vertical = 'vertical',\n}\n\nexport enum BStepsType {\n Default = 'default',\n Navigation = 'navigation',\n Inline = 'inline',\n}\n\nexport enum BStepsLabelPlacement {\n Horizontal = 'horizontal',\n Vertical = 'vertical',\n}\n\nexport enum BSpinSize {\n Small = 'small',\n Default = 'default',\n Large = 'large',\n}\n\nexport enum BAvatarShape {\n Circle = 'circle',\n Square = 'square',\n}\n\nexport enum BAvatarSize {\n Small = 'small',\n Default = 'default',\n Large = 'large',\n}\n\nexport enum BBadgeSize {\n Default = 'default',\n Small = 'small',\n}\n\nexport enum BBadgeStatus {\n Success = 'success',\n Processing = 'processing',\n Default = 'default',\n Error = 'error',\n Warning = 'warning',\n}\n\nexport enum BCardSize {\n Default = 'default',\n Small = 'small',\n}\n\nexport enum BCardType {\n Default = 'default',\n Inner = 'inner',\n}\n\nexport interface BCardTabItem {\n key: string;\n tab: string;\n disabled?: boolean;\n}\n\nexport enum BEmptyImage {\n Default = 'default',\n Simple = 'simple',\n}\n\nexport interface BStepItem {\n title: string;\n subTitle?: string;\n description?: string;\n status?: `${BStepsStatus}`;\n icon?: `${BIconName}` | `${BIconBrandName}`;\n disabled?: boolean;\n}\n"],"mappings":"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"}
|
package/dist/design-system30.js
CHANGED
|
@@ -1,147 +1,30 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
key: 0,
|
|
6
|
-
class: "b-card__cover"
|
|
7
|
-
}, S = {
|
|
8
|
-
key: 1,
|
|
9
|
-
class: "b-card__head"
|
|
10
|
-
}, C = { class: "b-card__head-wrapper" }, w = {
|
|
11
|
-
key: 0,
|
|
12
|
-
class: "b-card__head-title"
|
|
13
|
-
}, T = {
|
|
14
|
-
key: 1,
|
|
15
|
-
class: "b-card__extra"
|
|
16
|
-
}, E = {
|
|
17
|
-
key: 0,
|
|
18
|
-
class: "b-card__tabs"
|
|
19
|
-
}, D = ["aria-label"], O = [
|
|
20
|
-
"id",
|
|
21
|
-
"aria-selected",
|
|
22
|
-
"aria-controls",
|
|
23
|
-
"tabindex",
|
|
24
|
-
"disabled",
|
|
25
|
-
"onClick",
|
|
26
|
-
"onKeydown"
|
|
27
|
-
], k = {
|
|
28
|
-
key: 0,
|
|
29
|
-
class: "b-card__tab-extra"
|
|
30
|
-
}, A = [
|
|
31
|
-
"id",
|
|
32
|
-
"role",
|
|
33
|
-
"aria-labelledby"
|
|
34
|
-
], j = {
|
|
35
|
-
key: 0,
|
|
36
|
-
class: "b-card__loading",
|
|
37
|
-
role: "status",
|
|
38
|
-
"aria-busy": "true",
|
|
39
|
-
"aria-label": "Loading card content"
|
|
40
|
-
}, M = {
|
|
41
|
-
key: 2,
|
|
42
|
-
class: "b-card__actions",
|
|
43
|
-
role: "group",
|
|
44
|
-
"aria-label": "Card actions"
|
|
45
|
-
}, N = /* @__PURE__ */ c({
|
|
46
|
-
__name: "BCard",
|
|
1
|
+
import { createElementBlock as e, defineComponent as t, openBlock as n, ref as r, renderSlot as i, useModel as a, watch as o } from "vue";
|
|
2
|
+
//#region src/components/BModal/BModal.vue?vue&type=script&setup=true&lang.ts
|
|
3
|
+
var s = /* @__PURE__ */ t({
|
|
4
|
+
__name: "BModal",
|
|
47
5
|
props: {
|
|
48
|
-
|
|
6
|
+
modelValue: {
|
|
49
7
|
type: Boolean,
|
|
50
|
-
|
|
8
|
+
required: !0
|
|
51
9
|
},
|
|
52
|
-
|
|
53
|
-
type: Boolean,
|
|
54
|
-
default: !1
|
|
55
|
-
},
|
|
56
|
-
loading: {
|
|
57
|
-
type: Boolean,
|
|
58
|
-
default: !1
|
|
59
|
-
},
|
|
60
|
-
size: { default: () => e.Default },
|
|
61
|
-
type: { default: () => t.Default },
|
|
62
|
-
title: {},
|
|
63
|
-
extra: {},
|
|
64
|
-
tabList: {},
|
|
65
|
-
activeTabKey: {},
|
|
66
|
-
defaultActiveTabKey: {},
|
|
67
|
-
tabBarExtraContent: {},
|
|
68
|
-
tabProps: {}
|
|
10
|
+
modelModifiers: {}
|
|
69
11
|
},
|
|
70
|
-
emits: ["
|
|
71
|
-
setup(
|
|
72
|
-
let
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
"
|
|
79
|
-
|
|
80
|
-
"b-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
"b-card--has-cover": !!F.cover,
|
|
84
|
-
"b-card--has-actions": !!F.actions
|
|
85
|
-
}]), V = r(() => `${I}-tabpanel`);
|
|
86
|
-
function H(e) {
|
|
87
|
-
L.value = e, P("update:activeTabKey", e), P("tabChange", e);
|
|
88
|
-
}
|
|
89
|
-
function U(e, t) {
|
|
90
|
-
if (!c.tabList) return;
|
|
91
|
-
let n = c.tabList.filter((e) => !e.disabled), r = n.findIndex((e) => e.key === c.tabList[t].key);
|
|
92
|
-
if (r === -1) return;
|
|
93
|
-
let i = -1;
|
|
94
|
-
if (e.key === "ArrowRight" || e.key === "ArrowDown" ? (e.preventDefault(), i = (r + 1) % n.length) : e.key === "ArrowLeft" || e.key === "ArrowUp" ? (e.preventDefault(), i = (r - 1 + n.length) % n.length) : e.key === "Home" ? (e.preventDefault(), i = 0) : e.key === "End" && (e.preventDefault(), i = n.length - 1), i >= 0) {
|
|
95
|
-
let e = n[i].key;
|
|
96
|
-
H(e), document.getElementById(`${I}-tab-${e}`)?.focus();
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
|
-
let W = [
|
|
100
|
-
100,
|
|
101
|
-
75,
|
|
102
|
-
90,
|
|
103
|
-
60
|
|
104
|
-
];
|
|
105
|
-
return (e, t) => (f(), a("div", { class: u(B.value) }, [
|
|
106
|
-
e.$slots.cover ? (f(), a("div", x, [h(e.$slots, "cover")])) : i("", !0),
|
|
107
|
-
z.value ? (f(), a("div", S, [o("div", C, [c.title || e.$slots.title ? (f(), a("div", w, [h(e.$slots, "title", {}, () => [s(g(c.title), 1)])])) : i("", !0), c.extra || e.$slots.extra ? (f(), a("div", T, [h(e.$slots, "extra", {}, () => [s(g(c.extra), 1)])])) : i("", !0)]), c.tabList && c.tabList.length > 0 ? (f(), a("div", E, [o("div", {
|
|
108
|
-
role: "tablist",
|
|
109
|
-
class: "b-card__tab-list",
|
|
110
|
-
"aria-label": c.title ? `${c.title} tabs` : "Card tabs"
|
|
111
|
-
}, [(f(!0), a(n, null, m(c.tabList, (t, n) => (f(), a("button", l({
|
|
112
|
-
id: `${_(I)}-tab-${t.key}`,
|
|
113
|
-
key: t.key,
|
|
114
|
-
role: "tab",
|
|
115
|
-
class: ["b-card__tab", {
|
|
116
|
-
"b-card__tab--active": R.value === t.key,
|
|
117
|
-
"b-card__tab--disabled": t.disabled
|
|
118
|
-
}],
|
|
119
|
-
"aria-selected": R.value === t.key,
|
|
120
|
-
"aria-controls": V.value,
|
|
121
|
-
tabindex: R.value === t.key ? 0 : -1,
|
|
122
|
-
disabled: t.disabled
|
|
123
|
-
}, { ref_for: !0 }, c.tabProps, {
|
|
124
|
-
onClick: (e) => H(t.key),
|
|
125
|
-
onKeydown: (e) => U(e, n)
|
|
126
|
-
}), [h(e.$slots, "customTab", {
|
|
127
|
-
item: t,
|
|
128
|
-
isActive: R.value === t.key
|
|
129
|
-
}, () => [s(g(t.tab), 1)])], 16, O))), 128))], 8, D), c.tabBarExtraContent || e.$slots.tabBarExtraContent ? (f(), a("div", k, [h(e.$slots, "tabBarExtraContent", {}, () => [s(g(c.tabBarExtraContent), 1)])])) : i("", !0)])) : i("", !0)])) : i("", !0),
|
|
130
|
-
o("div", {
|
|
131
|
-
class: "b-card__body",
|
|
132
|
-
id: c.tabList && c.tabList.length > 0 ? V.value : void 0,
|
|
133
|
-
role: c.tabList && c.tabList.length > 0 ? "tabpanel" : void 0,
|
|
134
|
-
"aria-labelledby": c.tabList && c.tabList.length > 0 ? `${_(I)}-tab-${R.value}` : void 0
|
|
135
|
-
}, [c.loading ? (f(), a("div", j, [(f(), a(n, null, m(W, (e, t) => o("div", {
|
|
136
|
-
key: t,
|
|
137
|
-
class: "b-card__loading-line",
|
|
138
|
-
style: d({ width: `${e}%` })
|
|
139
|
-
}, null, 4)), 64))])) : h(e.$slots, "default", { key: 1 })], 8, A),
|
|
140
|
-
e.$slots.actions ? (f(), a("div", M, [h(e.$slots, "actions")])) : i("", !0)
|
|
141
|
-
], 2));
|
|
12
|
+
emits: ["update:modelValue"],
|
|
13
|
+
setup(t) {
|
|
14
|
+
let s = a(t, "modelValue"), c = r(null), l = () => {
|
|
15
|
+
s.value = !1;
|
|
16
|
+
};
|
|
17
|
+
return o(s, (e) => {
|
|
18
|
+
c.value && (e ? c.value.showModal() : c.value.close());
|
|
19
|
+
}, { immediate: !0 }), (t, r) => (n(), e("dialog", {
|
|
20
|
+
ref_key: "dialogRef",
|
|
21
|
+
ref: c,
|
|
22
|
+
class: "b-modal b:rounded-lg b:bg-white b:px-5 b:py-4",
|
|
23
|
+
onClose: l
|
|
24
|
+
}, [i(t.$slots, "default", {}, void 0, !0)], 544));
|
|
142
25
|
}
|
|
143
26
|
});
|
|
144
27
|
//#endregion
|
|
145
|
-
export {
|
|
28
|
+
export { s as default };
|
|
146
29
|
|
|
147
30
|
//# sourceMappingURL=design-system30.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"design-system30.js","names":[],"sources":["../src/components/BCard/BCard.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { renderSlot as _renderSlot, openBlock as _openBlock, createElementBlock as _createElementBlock, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, createElementVNode as _createElementVNode, renderList as _renderList, Fragment as _Fragment, unref as _unref, mergeProps as _mergeProps, normalizeStyle as _normalizeStyle, normalizeClass as _normalizeClass } from \"vue\"\n\nconst _hoisted_1 = {\n key: 0,\n class: \"b-card__cover\"\n}\nconst _hoisted_2 = {\n key: 1,\n class: \"b-card__head\"\n}\nconst _hoisted_3 = { class: \"b-card__head-wrapper\" }\nconst _hoisted_4 = {\n key: 0,\n class: \"b-card__head-title\"\n}\nconst _hoisted_5 = {\n key: 1,\n class: \"b-card__extra\"\n}\nconst _hoisted_6 = {\n key: 0,\n class: \"b-card__tabs\"\n}\nconst _hoisted_7 = [\"aria-label\"]\nconst _hoisted_8 = [\"id\", \"aria-selected\", \"aria-controls\", \"tabindex\", \"disabled\", \"onClick\", \"onKeydown\"]\nconst _hoisted_9 = {\n key: 0,\n class: \"b-card__tab-extra\"\n}\nconst _hoisted_10 = [\"id\", \"role\", \"aria-labelledby\"]\nconst _hoisted_11 = {\n key: 0,\n class: \"b-card__loading\",\n role: \"status\",\n \"aria-busy\": \"true\",\n \"aria-label\": \"Loading card content\"\n}\nconst _hoisted_12 = {\n key: 2,\n class: \"b-card__actions\",\n role: \"group\",\n \"aria-label\": \"Card actions\"\n}\n\nimport { computed, ref, useId, useSlots, watch } from 'vue';\n\nimport type { BCardTabItem } from '@/types';\nimport { BCardSize, BCardType } from '@/types';\n\n// ─────────────────────────────────────────────\n// Props\n// ─────────────────────────────────────────────\n\nexport default /*@__PURE__*/_defineComponent({\n __name: 'BCard',\n props: {\n bordered: { type: Boolean, default: true },\n hoverable: { type: Boolean, default: false },\n loading: { type: Boolean, default: false },\n size: { default: () => (BCardSize.Default) },\n type: { default: () => (BCardType.Default) },\n title: {},\n extra: {},\n tabList: {},\n activeTabKey: {},\n defaultActiveTabKey: {},\n tabBarExtraContent: {},\n tabProps: {}\n },\n emits: [\"tabChange\", \"update:activeTabKey\"],\n setup(__props: any, { emit: __emit }) {\n\n\n\n// ─────────────────────────────────────────────\n// Emits\n// ─────────────────────────────────────────────\nconst emit = __emit;\n\n// ─────────────────────────────────────────────\n// Slots\n// ─────────────────────────────────────────────\n\n\n// ─────────────────────────────────────────────\n// Internal state\n// ─────────────────────────────────────────────\nconst slots = useSlots();\nconst cardId = useId();\n\nconst internalActiveTab = ref(\n __props.defaultActiveTabKey ?? (__props.tabList && __props.tabList.length > 0 ? __props.tabList[0].key : ''),\n);\n\nconst currentTabKey = computed(() =>\n __props.activeTabKey !== undefined ? __props.activeTabKey : internalActiveTab.value,\n);\n\nwatch(\n () => __props.activeTabKey,\n (val) => {\n if (val !== undefined) {\n internalActiveTab.value = val;\n }\n },\n);\n\n// ─────────────────────────────────────────────\n// Computed\n// ─────────────────────────────────────────────\nconst hasHeader = computed(() => {\n return !!(__props.title || slots.title || __props.extra || slots.extra || (__props.tabList && __props.tabList.length > 0));\n});\n\nconst rootClasses = computed(() => [\n 'b-card',\n {\n 'b-card--bordered': __props.bordered,\n 'b-card--hoverable': __props.hoverable,\n 'b-card--loading': __props.loading,\n 'b-card--small': __props.size === BCardSize.Small,\n 'b-card--inner': __props.type === BCardType.Inner,\n 'b-card--has-tabs': __props.tabList && __props.tabList.length > 0,\n 'b-card--has-cover': !!slots.cover,\n 'b-card--has-actions': !!slots.actions,\n },\n]);\n\nconst tabPanelId = computed(() => `${cardId}-tabpanel`);\n\n// ─────────────────────────────────────────────\n// Tab handling\n// ─────────────────────────────────────────────\nfunction handleTabClick(key: string) {\n internalActiveTab.value = key;\n emit('update:activeTabKey', key);\n emit('tabChange', key);\n}\n\nfunction handleTabKeydown(event: KeyboardEvent, index: number) {\n if (!__props.tabList) return;\n const enabledTabs = __props.tabList.filter((t) => !t.disabled);\n const currentEnabled = enabledTabs.findIndex((t) => t.key === __props.tabList[index].key);\n if (currentEnabled === -1) return;\n\n let targetIndex = -1;\n\n if (event.key === 'ArrowRight' || event.key === 'ArrowDown') {\n event.preventDefault();\n targetIndex = (currentEnabled + 1) % enabledTabs.length;\n } else if (event.key === 'ArrowLeft' || event.key === 'ArrowUp') {\n event.preventDefault();\n targetIndex = (currentEnabled - 1 + enabledTabs.length) % enabledTabs.length;\n } else if (event.key === 'Home') {\n event.preventDefault();\n targetIndex = 0;\n } else if (event.key === 'End') {\n event.preventDefault();\n targetIndex = enabledTabs.length - 1;\n }\n\n if (targetIndex >= 0) {\n const targetKey = enabledTabs[targetIndex].key;\n handleTabClick(targetKey);\n const tabEl = document.getElementById(`${cardId}-tab-${targetKey}`);\n tabEl?.focus();\n }\n}\n\n// ─────────────────────────────────────────────\n// Loading skeleton lines\n// ─────────────────────────────────────────────\nconst skeletonRows = [100, 75, 90, 60];\n\nreturn (_ctx: any,_cache: any) => {\n return (_openBlock(), _createElementBlock(\"div\", {\n class: _normalizeClass(rootClasses.value)\n }, [\n (_ctx.$slots.cover)\n ? (_openBlock(), _createElementBlock(\"div\", _hoisted_1, [\n _renderSlot(_ctx.$slots, \"cover\")\n ]))\n : _createCommentVNode(\"\", true),\n (hasHeader.value)\n ? (_openBlock(), _createElementBlock(\"div\", _hoisted_2, [\n _createElementVNode(\"div\", _hoisted_3, [\n (__props.title || _ctx.$slots.title)\n ? (_openBlock(), _createElementBlock(\"div\", _hoisted_4, [\n _renderSlot(_ctx.$slots, \"title\", {}, () => [\n _createTextVNode(_toDisplayString(__props.title), 1)\n ])\n ]))\n : _createCommentVNode(\"\", true),\n (__props.extra || _ctx.$slots.extra)\n ? (_openBlock(), _createElementBlock(\"div\", _hoisted_5, [\n _renderSlot(_ctx.$slots, \"extra\", {}, () => [\n _createTextVNode(_toDisplayString(__props.extra), 1)\n ])\n ]))\n : _createCommentVNode(\"\", true)\n ]),\n (__props.tabList && __props.tabList.length > 0)\n ? (_openBlock(), _createElementBlock(\"div\", _hoisted_6, [\n _createElementVNode(\"div\", {\n role: \"tablist\",\n class: \"b-card__tab-list\",\n \"aria-label\": __props.title ? `${__props.title} tabs` : 'Card tabs'\n }, [\n (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(__props.tabList, (tab, index) => {\n return (_openBlock(), _createElementBlock(\"button\", _mergeProps({\n id: `${_unref(cardId)}-tab-${tab.key}`,\n key: tab.key,\n role: \"tab\",\n class: [\"b-card__tab\", {\n 'b-card__tab--active': currentTabKey.value === tab.key,\n 'b-card__tab--disabled': tab.disabled,\n }],\n \"aria-selected\": currentTabKey.value === tab.key,\n \"aria-controls\": tabPanelId.value,\n tabindex: currentTabKey.value === tab.key ? 0 : -1,\n disabled: tab.disabled\n }, { ref_for: true }, __props.tabProps, {\n onClick: ($event: any) => (handleTabClick(tab.key)),\n onKeydown: ($event: any) => (handleTabKeydown($event, index))\n }), [\n _renderSlot(_ctx.$slots, \"customTab\", {\n item: tab,\n isActive: currentTabKey.value === tab.key\n }, () => [\n _createTextVNode(_toDisplayString(tab.tab), 1)\n ])\n ], 16, _hoisted_8))\n }), 128))\n ], 8, _hoisted_7),\n (__props.tabBarExtraContent || _ctx.$slots.tabBarExtraContent)\n ? (_openBlock(), _createElementBlock(\"div\", _hoisted_9, [\n _renderSlot(_ctx.$slots, \"tabBarExtraContent\", {}, () => [\n _createTextVNode(_toDisplayString(__props.tabBarExtraContent), 1)\n ])\n ]))\n : _createCommentVNode(\"\", true)\n ]))\n : _createCommentVNode(\"\", true)\n ]))\n : _createCommentVNode(\"\", true),\n _createElementVNode(\"div\", {\n class: \"b-card__body\",\n id: __props.tabList && __props.tabList.length > 0 ? tabPanelId.value : undefined,\n role: __props.tabList && __props.tabList.length > 0 ? 'tabpanel' : undefined,\n \"aria-labelledby\": \n __props.tabList && __props.tabList.length > 0 ? `${_unref(cardId)}-tab-${currentTabKey.value}` : undefined\n \n }, [\n (__props.loading)\n ? (_openBlock(), _createElementBlock(\"div\", _hoisted_11, [\n (_openBlock(), _createElementBlock(_Fragment, null, _renderList(skeletonRows, (width, i) => {\n return _createElementVNode(\"div\", {\n key: i,\n class: \"b-card__loading-line\",\n style: _normalizeStyle({ width: `${width}%` })\n }, null, 4)\n }), 64))\n ]))\n : _renderSlot(_ctx.$slots, \"default\", { key: 1 })\n ], 8, _hoisted_10),\n (_ctx.$slots.actions)\n ? (_openBlock(), _createElementBlock(\"div\", _hoisted_12, [\n _renderSlot(_ctx.$slots, \"actions\")\n ]))\n : _createCommentVNode(\"\", true)\n ], 2))\n}\n}\n\n})"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"design-system30.js","names":[],"sources":["../src/components/BModal/BModal.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, watch } from 'vue';\n\n/**\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/dialog\n * Animation: https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/dialog#animating_dialogs\n * Transition Behavior: https://developer.mozilla.org/en-US/docs/Web/CSS/transition-behavior\n */\n\nconst model = defineModel<boolean>({ required: true });\n\nconst dialogRef = ref<HTMLDialogElement | null>(null);\n\nconst updateModelFalse = () => {\n model.value = false;\n};\n\nwatch(\n model,\n (newValue) => {\n if (!dialogRef.value) {\n return;\n }\n if (newValue) {\n dialogRef.value.showModal();\n } else {\n dialogRef.value.close();\n }\n },\n { immediate: true },\n);\n</script>\n\n<template>\n <dialog\n ref=\"dialogRef\"\n class=\"b-modal b:rounded-lg b:bg-white b:px-5 b:py-4\"\n @close=\"updateModelFalse\"\n >\n <slot />\n </dialog>\n</template>\n\n<style scoped>\n.b-modal {\n --duration: 0.7s;\n\n margin: auto;\n\n opacity: 0;\n transform: scaleY(0);\n transition:\n opacity var(--duration) ease-out,\n transform var(--duration) ease-out,\n overlay var(--duration) ease-out allow-discrete,\n display var(--duration) ease-out allow-discrete;\n /* Equivalent to transition: all var(--duration) allow-discrete; */\n\n &::backdrop {\n background-color: transparent;\n transition:\n display var(--duration) allow-discrete,\n overlay var(--duration) allow-discrete,\n background-color var(--duration);\n /* Equivalent to transition: all var(--duration) allow-discrete; */\n }\n\n &:open {\n opacity: 1;\n transform: scaleY(1);\n }\n\n &:open::backdrop {\n background-color: rgb(0 0 0 / 25%);\n }\n}\n\n/* Before open state */\n/* Needs to be after the previous dialog:open rule to take effect, as the specificity is the same */\n@starting-style {\n .b-modal:open {\n opacity: 0;\n transform: scaleY(0);\n }\n}\n\n/* This starting-style rule cannot be nested inside the above selector because the nesting selector cannot represent pseudo-elements. */\n@starting-style {\n .b-modal:open::backdrop {\n background-color: transparent;\n }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;EASA,IAAM,IAAQ,EAAoB,GAAA,aAAoB,EAEhD,IAAY,EAA8B,KAAK,EAE/C,UAAyB;AAC7B,KAAM,QAAQ;;SAGhB,EACE,IACC,MAAa;AACP,KAAU,UAGX,IACF,EAAU,MAAM,WAAW,GAE3B,EAAU,MAAM,OAAO;KAG3B,EAAE,WAAW,IAAM,CACpB,kBAIC,EAMS,UAAA;YALH;GAAJ,KAAI;GACJ,OAAM;GACL,SAAO;MAER,EAAQ,EAAA,QAAA,WAAA,EAAA,EAAA,KAAA,GAAA,GAAA,CAAA,EAAA,IAAA"}
|
package/dist/design-system32.js
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
|
-
import e from "./design-
|
|
1
|
+
import e from "./design-system14.js";
|
|
2
|
+
import t from "./design-system30.js";
|
|
2
3
|
/* empty css */
|
|
3
|
-
//#region src/components/
|
|
4
|
-
var
|
|
4
|
+
//#region src/components/BModal/BModal.vue
|
|
5
|
+
var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-57d380dd"]]);
|
|
5
6
|
//#endregion
|
|
6
|
-
export {
|
|
7
|
+
export { n as default };
|
|
7
8
|
|
|
8
9
|
//# sourceMappingURL=design-system32.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"design-system32.js","names":[],"sources":["../src/components/BCard/BCard.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, useId, useSlots, watch } from 'vue';\n\nimport type { BCardTabItem } from '@/types';\nimport { BCardSize, BCardType } from '@/types';\n\n// ─────────────────────────────────────────────\n// Props\n// ─────────────────────────────────────────────\nconst {\n bordered = true,\n hoverable = false,\n loading = false,\n size = BCardSize.Default,\n type = BCardType.Default,\n title,\n extra,\n tabList,\n activeTabKey,\n defaultActiveTabKey,\n tabBarExtraContent,\n tabProps,\n} = defineProps<{\n /** Whether to render the card border. @default true */\n bordered?: boolean;\n /** Lift the card on hover. @default false */\n hoverable?: boolean;\n /** Shows a placeholder while content is loading. @default false */\n loading?: boolean;\n /** Size of the card. @default 'default' */\n size?: `${BCardSize}`;\n /** Card type: default or inner. @default 'default' */\n type?: `${BCardType}`;\n /** Card title */\n title?: string;\n /** Content to render in the top-right corner of the card */\n extra?: string;\n /** List of tabs at the top of the card */\n tabList?: BCardTabItem[];\n /** Active tab key (controlled). Use with v-model:activeTabKey */\n activeTabKey?: string;\n /** Default active tab key (uncontrolled) */\n defaultActiveTabKey?: string;\n /** Extra content in the tab bar */\n tabBarExtraContent?: string;\n /** Additional HTML attributes to pass to the tab buttons */\n tabProps?: Record<string, unknown>;\n}>();\n\n// ─────────────────────────────────────────────\n// Emits\n// ─────────────────────────────────────────────\nconst emit = defineEmits<{\n /** Fired when the active tab changes */\n (e: 'tabChange', key: string): void;\n /** Sync active tab key for v-model:activeTabKey */\n (e: 'update:activeTabKey', key: string): void;\n}>();\n\n// ─────────────────────────────────────────────\n// Slots\n// ─────────────────────────────────────────────\ndefineSlots<{\n /** Main content of the card */\n default?: (props: Record<string, never>) => unknown;\n /** Card title area. Overrides the `title` prop */\n title?: (props: Record<string, never>) => unknown;\n /** Extra content in the top-right corner. Overrides the `extra` prop */\n extra?: (props: Record<string, never>) => unknown;\n /** Cover image/content above the card body */\n cover?: (props: Record<string, never>) => unknown;\n /** Action items rendered at the card footer */\n actions?: (props: Record<string, never>) => unknown;\n /** Tab bar extra content slot. Overrides the `tabBarExtraContent` prop */\n tabBarExtraContent?: (props: Record<string, never>) => unknown;\n /** Custom tab rendering. Receives { item: BCardTabItem, isActive: boolean } */\n customTab?: (props: { item: BCardTabItem; isActive: boolean }) => unknown;\n}>();\n\n// ─────────────────────────────────────────────\n// Internal state\n// ─────────────────────────────────────────────\nconst slots = useSlots();\nconst cardId = useId();\n\nconst internalActiveTab = ref(\n defaultActiveTabKey ?? (tabList && tabList.length > 0 ? tabList[0].key : ''),\n);\n\nconst currentTabKey = computed(() =>\n activeTabKey !== undefined ? activeTabKey : internalActiveTab.value,\n);\n\nwatch(\n () => activeTabKey,\n (val) => {\n if (val !== undefined) {\n internalActiveTab.value = val;\n }\n },\n);\n\n// ─────────────────────────────────────────────\n// Computed\n// ─────────────────────────────────────────────\nconst hasHeader = computed(() => {\n return !!(title || slots.title || extra || slots.extra || (tabList && tabList.length > 0));\n});\n\nconst rootClasses = computed(() => [\n 'b-card',\n {\n 'b-card--bordered': bordered,\n 'b-card--hoverable': hoverable,\n 'b-card--loading': loading,\n 'b-card--small': size === BCardSize.Small,\n 'b-card--inner': type === BCardType.Inner,\n 'b-card--has-tabs': tabList && tabList.length > 0,\n 'b-card--has-cover': !!slots.cover,\n 'b-card--has-actions': !!slots.actions,\n },\n]);\n\nconst tabPanelId = computed(() => `${cardId}-tabpanel`);\n\n// ─────────────────────────────────────────────\n// Tab handling\n// ─────────────────────────────────────────────\nfunction handleTabClick(key: string) {\n internalActiveTab.value = key;\n emit('update:activeTabKey', key);\n emit('tabChange', key);\n}\n\nfunction handleTabKeydown(event: KeyboardEvent, index: number) {\n if (!tabList) return;\n const enabledTabs = tabList.filter((t) => !t.disabled);\n const currentEnabled = enabledTabs.findIndex((t) => t.key === tabList[index].key);\n if (currentEnabled === -1) return;\n\n let targetIndex = -1;\n\n if (event.key === 'ArrowRight' || event.key === 'ArrowDown') {\n event.preventDefault();\n targetIndex = (currentEnabled + 1) % enabledTabs.length;\n } else if (event.key === 'ArrowLeft' || event.key === 'ArrowUp') {\n event.preventDefault();\n targetIndex = (currentEnabled - 1 + enabledTabs.length) % enabledTabs.length;\n } else if (event.key === 'Home') {\n event.preventDefault();\n targetIndex = 0;\n } else if (event.key === 'End') {\n event.preventDefault();\n targetIndex = enabledTabs.length - 1;\n }\n\n if (targetIndex >= 0) {\n const targetKey = enabledTabs[targetIndex].key;\n handleTabClick(targetKey);\n const tabEl = document.getElementById(`${cardId}-tab-${targetKey}`);\n tabEl?.focus();\n }\n}\n\n// ─────────────────────────────────────────────\n// Loading skeleton lines\n// ─────────────────────────────────────────────\nconst skeletonRows = [100, 75, 90, 60];\n</script>\n\n<template>\n <div :class=\"rootClasses\">\n <!-- Cover -->\n <div v-if=\"$slots.cover\" class=\"b-card__cover\">\n <slot name=\"cover\" />\n </div>\n\n <!-- Header -->\n <div v-if=\"hasHeader\" class=\"b-card__head\">\n <div class=\"b-card__head-wrapper\">\n <div v-if=\"title || $slots.title\" class=\"b-card__head-title\">\n <slot name=\"title\">{{ title }}</slot>\n </div>\n <div v-if=\"extra || $slots.extra\" class=\"b-card__extra\">\n <slot name=\"extra\">{{ extra }}</slot>\n </div>\n </div>\n\n <!-- Tabs -->\n <div v-if=\"tabList && tabList.length > 0\" class=\"b-card__tabs\">\n <div\n role=\"tablist\"\n class=\"b-card__tab-list\"\n :aria-label=\"title ? `${title} tabs` : 'Card tabs'\"\n >\n <button\n v-for=\"(tab, index) in tabList\"\n :id=\"`${cardId}-tab-${tab.key}`\"\n :key=\"tab.key\"\n role=\"tab\"\n class=\"b-card__tab\"\n :class=\"{\n 'b-card__tab--active': currentTabKey === tab.key,\n 'b-card__tab--disabled': tab.disabled,\n }\"\n :aria-selected=\"currentTabKey === tab.key\"\n :aria-controls=\"tabPanelId\"\n :tabindex=\"currentTabKey === tab.key ? 0 : -1\"\n :disabled=\"tab.disabled\"\n v-bind=\"tabProps\"\n @click=\"handleTabClick(tab.key)\"\n @keydown=\"handleTabKeydown($event, index)\"\n >\n <slot name=\"customTab\" :item=\"tab\" :is-active=\"currentTabKey === tab.key\">\n {{ tab.tab }}\n </slot>\n </button>\n </div>\n <div v-if=\"tabBarExtraContent || $slots.tabBarExtraContent\" class=\"b-card__tab-extra\">\n <slot name=\"tabBarExtraContent\">{{ tabBarExtraContent }}</slot>\n </div>\n </div>\n </div>\n\n <!-- Body -->\n <div\n class=\"b-card__body\"\n :id=\"tabList && tabList.length > 0 ? tabPanelId : undefined\"\n :role=\"tabList && tabList.length > 0 ? 'tabpanel' : undefined\"\n :aria-labelledby=\"\n tabList && tabList.length > 0 ? `${cardId}-tab-${currentTabKey}` : undefined\n \"\n >\n <!-- Loading skeleton -->\n <div\n v-if=\"loading\"\n class=\"b-card__loading\"\n role=\"status\"\n aria-busy=\"true\"\n aria-label=\"Loading card content\"\n >\n <div\n v-for=\"(width, i) in skeletonRows\"\n :key=\"i\"\n class=\"b-card__loading-line\"\n :style=\"{ width: `${width}%` }\"\n />\n </div>\n\n <!-- Content -->\n <template v-else>\n <slot />\n </template>\n </div>\n\n <!-- Actions -->\n <div v-if=\"$slots.actions\" class=\"b-card__actions\" role=\"group\" aria-label=\"Card actions\">\n <slot name=\"actions\" />\n </div>\n </div>\n</template>\n\n<style>\n/* ─────────────────────────────────────────────\n BCard - CSS custom properties (scoped to root)\n ───────────────────────────────────────────── */\n.b-card {\n /* Surface */\n --b-card-bg: oklch(100% 0 0);\n --b-card-color: oklch(20% 0.02 260);\n --b-card-border-radius: 8px;\n --b-card-border-color: oklch(85% 0.01 260);\n --b-card-border-width: 1px;\n --b-card-shadow: 0 1px 2px 0 oklch(0% 0 0 / 6%), 0 1px 3px 0 oklch(0% 0 0 / 10%);\n --b-card-shadow-hover: 0 4px 12px oklch(0% 0 0 / 12%);\n --b-card-transition-duration: 200ms;\n\n /* Head */\n --b-card-head-padding: 16px 24px;\n --b-card-head-padding-sm: 8px 16px;\n --b-card-head-font-size: 16px;\n --b-card-head-font-size-sm: 14px;\n --b-card-head-font-weight: 600;\n --b-card-head-color: oklch(20% 0.02 260);\n --b-card-head-border-color: oklch(90% 0.01 260);\n --b-card-head-min-height: 56px;\n --b-card-head-min-height-sm: 40px;\n\n /* Body */\n --b-card-body-padding: 24px;\n --b-card-body-padding-sm: 16px;\n\n /* Extra */\n --b-card-extra-color: oklch(45% 0.02 260);\n --b-card-extra-font-size: 14px;\n\n /* Cover */\n --b-card-cover-border-radius: var(--b-card-border-radius) var(--b-card-border-radius) 0 0;\n\n /* Actions */\n --b-card-actions-padding: 12px 24px;\n --b-card-actions-border-color: oklch(90% 0.01 260);\n --b-card-actions-bg: transparent;\n\n /* Tabs */\n --b-card-tab-color: oklch(45% 0.02 260);\n --b-card-tab-active-color: oklch(46% 0.24 264);\n --b-card-tab-hover-color: oklch(46% 0.24 264);\n --b-card-tab-disabled-color: oklch(70% 0.01 260);\n --b-card-tab-bar-border-color: oklch(90% 0.01 260);\n --b-card-tab-indicator-color: oklch(46% 0.24 264);\n --b-card-tab-font-size: 14px;\n --b-card-tab-padding: 12px 16px;\n\n /* Inner card */\n --b-card-inner-bg: oklch(97% 0 0);\n\n /* Loading */\n --b-card-loading-line-bg: oklch(92% 0.01 260);\n --b-card-loading-shine-color: oklch(96% 0 0);\n --b-card-loading-line-height: 16px;\n --b-card-loading-line-radius: 4px;\n --b-card-loading-gap: 12px;\n\n /* Layout */\n position: relative;\n display: flex;\n flex-direction: column;\n background: var(--b-card-bg);\n color: var(--b-card-color);\n border-radius: var(--b-card-border-radius);\n font-size: 14px;\n line-height: 1.5715;\n box-sizing: border-box;\n transition:\n box-shadow var(--b-card-transition-duration) ease,\n border-color var(--b-card-transition-duration) ease;\n}\n\n/* ── Border ── */\n.b-card--bordered {\n border: var(--b-card-border-width) solid var(--b-card-border-color);\n}\n\n.b-card:not(.b-card--bordered) {\n box-shadow: var(--b-card-shadow);\n}\n\n/* ── Hoverable ── */\n.b-card--hoverable {\n cursor: pointer;\n}\n\n.b-card--hoverable:hover {\n box-shadow: var(--b-card-shadow-hover);\n}\n\n.b-card--bordered.b-card--hoverable:hover {\n border-color: transparent;\n box-shadow: var(--b-card-shadow-hover);\n}\n\n/* ── Inner card ── */\n.b-card--inner {\n background: var(--b-card-inner-bg);\n}\n\n/* ── Small size ── */\n.b-card--small .b-card__head {\n padding: var(--b-card-head-padding-sm);\n min-height: var(--b-card-head-min-height-sm);\n font-size: var(--b-card-head-font-size-sm);\n}\n\n.b-card--small .b-card__body {\n padding: var(--b-card-body-padding-sm);\n}\n\n/* ── Cover ── */\n.b-card__cover {\n overflow: hidden;\n border-radius: var(--b-card-cover-border-radius);\n}\n\n.b-card--bordered .b-card__cover {\n margin-top: -1px;\n margin-inline: -1px;\n}\n\n.b-card__cover img,\n.b-card__cover video {\n display: block;\n width: 100%;\n height: auto;\n}\n\n/* ── Head ── */\n.b-card__head {\n display: flex;\n flex-direction: column;\n padding: var(--b-card-head-padding);\n border-bottom: 1px solid var(--b-card-head-border-color);\n min-height: var(--b-card-head-min-height);\n font-size: var(--b-card-head-font-size);\n box-sizing: border-box;\n}\n\n.b-card--has-tabs .b-card__head {\n padding-bottom: 0;\n border-bottom: none;\n}\n\n.b-card__head-wrapper {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n}\n\n.b-card__head-title {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n font-weight: var(--b-card-head-font-weight);\n color: var(--b-card-head-color);\n}\n\n.b-card__extra {\n flex: none;\n color: var(--b-card-extra-color);\n font-size: var(--b-card-extra-font-size);\n font-weight: 400;\n}\n\n/* ── Tabs ── */\n.b-card__tabs {\n display: flex;\n align-items: center;\n justify-content: space-between;\n border-bottom: 1px solid var(--b-card-tab-bar-border-color);\n margin-top: 4px;\n}\n\n.b-card__tab-list {\n display: flex;\n gap: 0;\n}\n\n.b-card__tab {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: var(--b-card-tab-padding);\n border: none;\n background: none;\n color: var(--b-card-tab-color);\n font-size: var(--b-card-tab-font-size);\n font-family: inherit;\n cursor: pointer;\n transition: color var(--b-card-transition-duration) ease;\n outline: none;\n}\n\n.b-card__tab::after {\n content: '';\n position: absolute;\n bottom: 0;\n left: 50%;\n width: 0;\n height: 2px;\n background: var(--b-card-tab-indicator-color);\n border-radius: 1px;\n transition:\n width var(--b-card-transition-duration) ease,\n left var(--b-card-transition-duration) ease;\n}\n\n.b-card__tab:hover:not(:disabled) {\n color: var(--b-card-tab-hover-color);\n}\n\n.b-card__tab:focus-visible {\n outline: 2px solid var(--b-card-tab-active-color);\n outline-offset: -2px;\n border-radius: 4px;\n}\n\n.b-card__tab--active {\n color: var(--b-card-tab-active-color);\n font-weight: 500;\n}\n\n.b-card__tab--active::after {\n width: 100%;\n left: 0;\n}\n\n.b-card__tab--disabled {\n color: var(--b-card-tab-disabled-color);\n cursor: not-allowed;\n}\n\n.b-card__tab-extra {\n flex: none;\n padding: 0 16px;\n color: var(--b-card-extra-color);\n font-size: var(--b-card-extra-font-size);\n}\n\n/* ── Body ── */\n.b-card__body {\n flex: 1;\n padding: var(--b-card-body-padding);\n}\n\n/* ── Actions ── */\n.b-card__actions {\n display: flex;\n align-items: center;\n justify-content: space-evenly;\n padding: var(--b-card-actions-padding);\n border-top: 1px solid var(--b-card-actions-border-color);\n background: var(--b-card-actions-bg);\n border-radius: 0 0 var(--b-card-border-radius) var(--b-card-border-radius);\n}\n\n/* ── Loading skeleton ── */\n.b-card__loading {\n display: flex;\n flex-direction: column;\n gap: var(--b-card-loading-gap);\n}\n\n.b-card__loading-line {\n height: var(--b-card-loading-line-height);\n border-radius: var(--b-card-loading-line-radius);\n background: linear-gradient(\n 90deg,\n var(--b-card-loading-line-bg) 25%,\n var(--b-card-loading-shine-color) 50%,\n var(--b-card-loading-line-bg) 75%\n );\n background-size: 200% 100%;\n animation: b-card-loading-shimmer 1.5s infinite ease-in-out;\n}\n\n@keyframes b-card-loading-shimmer {\n 0% {\n background-position: 200% 0;\n }\n 100% {\n background-position: -200% 0;\n }\n}\n\n/* ── Dark mode ── */\n[data-prefers-color='dark'] .b-card {\n --b-card-bg: oklch(20% 0.02 260);\n --b-card-color: oklch(88% 0.01 260);\n --b-card-border-color: oklch(35% 0.02 260);\n --b-card-shadow: 0 1px 2px 0 oklch(0% 0 0 / 20%), 0 1px 3px 0 oklch(0% 0 0 / 25%);\n --b-card-shadow-hover: 0 4px 12px oklch(0% 0 0 / 30%);\n --b-card-head-color: oklch(92% 0.01 260);\n --b-card-head-border-color: oklch(35% 0.02 260);\n --b-card-extra-color: oklch(65% 0.01 260);\n --b-card-tab-color: oklch(65% 0.01 260);\n --b-card-tab-active-color: oklch(70% 0.18 264);\n --b-card-tab-hover-color: oklch(70% 0.18 264);\n --b-card-tab-disabled-color: oklch(40% 0.01 260);\n --b-card-tab-bar-border-color: oklch(35% 0.02 260);\n --b-card-tab-indicator-color: oklch(70% 0.18 264);\n --b-card-actions-border-color: oklch(35% 0.02 260);\n --b-card-inner-bg: oklch(25% 0.02 260);\n --b-card-loading-line-bg: oklch(30% 0.02 260);\n --b-card-loading-shine-color: oklch(35% 0.02 260);\n}\n\n@media (prefers-color-scheme: dark) {\n [data-prefers-color='system'] .b-card {\n --b-card-bg: oklch(20% 0.02 260);\n --b-card-color: oklch(88% 0.01 260);\n --b-card-border-color: oklch(35% 0.02 260);\n --b-card-shadow: 0 1px 2px 0 oklch(0% 0 0 / 20%), 0 1px 3px 0 oklch(0% 0 0 / 25%);\n --b-card-shadow-hover: 0 4px 12px oklch(0% 0 0 / 30%);\n --b-card-head-color: oklch(92% 0.01 260);\n --b-card-head-border-color: oklch(35% 0.02 260);\n --b-card-extra-color: oklch(65% 0.01 260);\n --b-card-tab-color: oklch(65% 0.01 260);\n --b-card-tab-active-color: oklch(70% 0.18 264);\n --b-card-tab-hover-color: oklch(70% 0.18 264);\n --b-card-tab-disabled-color: oklch(40% 0.01 260);\n --b-card-tab-bar-border-color: oklch(35% 0.02 260);\n --b-card-tab-indicator-color: oklch(70% 0.18 264);\n --b-card-actions-border-color: oklch(35% 0.02 260);\n --b-card-inner-bg: oklch(25% 0.02 260);\n --b-card-loading-line-bg: oklch(30% 0.02 260);\n --b-card-loading-shine-color: oklch(35% 0.02 260);\n }\n}\n\n/* ── Reduced motion ── */\n@media (prefers-reduced-motion: reduce) {\n .b-card {\n --b-card-transition-duration: 0ms;\n }\n\n .b-card__loading-line {\n animation: none;\n }\n}\n</style>\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"design-system32.js","names":[],"sources":["../src/components/BModal/BModal.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, watch } from 'vue';\n\n/**\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/dialog\n * Animation: https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/dialog#animating_dialogs\n * Transition Behavior: https://developer.mozilla.org/en-US/docs/Web/CSS/transition-behavior\n */\n\nconst model = defineModel<boolean>({ required: true });\n\nconst dialogRef = ref<HTMLDialogElement | null>(null);\n\nconst updateModelFalse = () => {\n model.value = false;\n};\n\nwatch(\n model,\n (newValue) => {\n if (!dialogRef.value) {\n return;\n }\n if (newValue) {\n dialogRef.value.showModal();\n } else {\n dialogRef.value.close();\n }\n },\n { immediate: true },\n);\n</script>\n\n<template>\n <dialog\n ref=\"dialogRef\"\n class=\"b-modal b:rounded-lg b:bg-white b:px-5 b:py-4\"\n @close=\"updateModelFalse\"\n >\n <slot />\n </dialog>\n</template>\n\n<style scoped>\n.b-modal {\n --duration: 0.7s;\n\n margin: auto;\n\n opacity: 0;\n transform: scaleY(0);\n transition:\n opacity var(--duration) ease-out,\n transform var(--duration) ease-out,\n overlay var(--duration) ease-out allow-discrete,\n display var(--duration) ease-out allow-discrete;\n /* Equivalent to transition: all var(--duration) allow-discrete; */\n\n &::backdrop {\n background-color: transparent;\n transition:\n display var(--duration) allow-discrete,\n overlay var(--duration) allow-discrete,\n background-color var(--duration);\n /* Equivalent to transition: all var(--duration) allow-discrete; */\n }\n\n &:open {\n opacity: 1;\n transform: scaleY(1);\n }\n\n &:open::backdrop {\n background-color: rgb(0 0 0 / 25%);\n }\n}\n\n/* Before open state */\n/* Needs to be after the previous dialog:open rule to take effect, as the specificity is the same */\n@starting-style {\n .b-modal:open {\n opacity: 0;\n transform: scaleY(0);\n }\n}\n\n/* This starting-style rule cannot be nested inside the above selector because the nesting selector cannot represent pseudo-elements. */\n@starting-style {\n .b-modal:open::backdrop {\n background-color: transparent;\n }\n}\n</style>\n"],"mappings":""}
|