morya-ui 0.4.2 → 0.4.4
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/CHANGELOG.md +780 -755
- package/LICENSE +21 -21
- package/README.md +156 -150
- package/README.zh-CN.md +156 -150
- package/dist/{Button-BaYLh91a.js → Button-Bjsth0ct.js} +3 -3
- package/dist/{Card-B1CB9Trm.js → Card-Ct5vJmoV.js} +1 -1
- package/dist/{Checkbox-LxCFF19I.js → Checkbox-Bo26OGHP.js} +1 -1
- package/dist/{DatePicker-DGPNukEW.js → DatePicker-CsMGzCqY.js} +4 -4
- package/dist/{Empty-2_f_FgyK.js → Empty-rMhOPi79.js} +2 -2
- package/dist/{FlyoutSubmenu-Da6AcoM4.js → FlyoutSubmenu-C0id6-Sb.js} +1 -1
- package/dist/{Icon-od9Ob-Ay.js → Icon-CmHjx7W8.js} +1 -1
- package/dist/{Input-NspPDc2R.js → Input-CxSTVp9E.js} +3 -3
- package/dist/{Loading-BK4dQPCS.js → Loading-D_qRwfKv.js} +4 -4
- package/dist/{Pagination-tdrlaZ3u.js → Pagination-CnGOpp0m.js} +3 -3
- package/dist/{Popover-BumMfUpV.js → Popover-D1uZ1N9Z.js} +2 -2
- package/dist/{ProgressSpinner-BQ1tLioO.js → ProgressSpinner-hmR23xpi.js} +2 -2
- package/dist/{Radio-BCn2OVCF.js → Radio-CZAyelC_.js} +1 -1
- package/dist/{Segmented-ppmDmku5.js → Segmented-BpdO7arR.js} +2 -2
- package/dist/{Select-CN1tM76U.js → Select-CySmusHs.js} +4 -4
- package/dist/{Textarea-Ch1KCXEv.js → Textarea-DskjTCcz.js} +3 -3
- package/dist/{Tooltip-DKsXxU_B.js → Tooltip-DSfkflHp.js} +2 -2
- package/dist/accordion/style.css +1205 -1205
- package/dist/affix/style.css +1205 -1205
- package/dist/alert/index.js +15 -15
- package/dist/alert/style.css +1206 -1206
- package/dist/anchor/style.css +1205 -1205
- package/dist/auto-complete/index.js +4 -4
- package/dist/auto-complete/style.css +1749 -1749
- package/dist/avatar/index.js +1 -1
- package/dist/avatar/style.css +1318 -1318
- package/dist/badge/index.js +24 -24
- package/dist/badge/style.css +1371 -1372
- package/dist/block-ui/index.js +1 -1
- package/dist/block-ui/style.css +1205 -1205
- package/dist/breadcrumb/index.js +1 -1
- package/dist/breadcrumb/style.css +1205 -1205
- package/dist/button/index.js +1 -1
- package/dist/button/style.css +1909 -1909
- package/dist/calendar/index.js +3 -3
- package/dist/calendar/style.css +1880 -1880
- package/dist/card/index.js +1 -1
- package/dist/card/style.css +1205 -1205
- package/dist/carousel/index.js +2 -2
- package/dist/carousel/style.css +2208 -2208
- package/dist/cascade-select/index.js +4 -4
- package/dist/cascade-select/style.css +1909 -1909
- package/dist/checkbox/index.js +1 -1
- package/dist/checkbox/style.css +1205 -1205
- package/dist/chip/index.js +35 -35
- package/dist/chip/style.css +1349 -1349
- package/dist/command-menu/index.js +5 -5
- package/dist/command-menu/style.css +1438 -1438
- package/dist/components/Alert/Alert.vue.d.ts +2 -2
- package/dist/components/Alert/Alert.vue.d.ts.map +1 -1
- package/dist/components/Alert/index.d.ts +1 -1
- package/dist/components/Alert/index.d.ts.map +1 -1
- package/dist/components/Alert/styles.css +1 -1
- package/dist/components/Alert/types.d.ts +3 -3
- package/dist/components/Alert/types.d.ts.map +1 -1
- package/dist/components/AutoComplete/styles.css +209 -209
- package/dist/components/Avatar/styles.css +113 -113
- package/dist/components/Badge/Badge.vue.d.ts +2 -2
- package/dist/components/Badge/index.d.ts +1 -1
- package/dist/components/Badge/index.d.ts.map +1 -1
- package/dist/components/Badge/styles.css +164 -165
- package/dist/components/Badge/types.d.ts +3 -4
- package/dist/components/Badge/types.d.ts.map +1 -1
- package/dist/components/Button/styles.css +698 -698
- package/dist/components/Button/types.d.ts +1 -5
- package/dist/components/Button/types.d.ts.map +1 -1
- package/dist/components/Carousel/styles.css +302 -302
- package/dist/components/CascadeSelect/styles.css +168 -168
- package/dist/components/Chip/index.d.ts +1 -1
- package/dist/components/Chip/index.d.ts.map +1 -1
- package/dist/components/Chip/styles.css +144 -144
- package/dist/components/Chip/types.d.ts +3 -3
- package/dist/components/Chip/types.d.ts.map +1 -1
- package/dist/components/CommandMenu/styles.css +102 -102
- package/dist/components/ConfigProvider/styles.css +6 -6
- package/dist/components/ConfirmDialog/ConfirmDialog.vue.d.ts.map +1 -1
- package/dist/components/ConfirmDialog/styles.css +24 -24
- package/dist/components/ConfirmDialog/types.d.ts +1 -1
- package/dist/components/ConfirmDialog/types.d.ts.map +1 -1
- package/dist/components/ConfirmPopup/styles.css +35 -35
- package/dist/components/ContextMenu/styles.css +138 -138
- package/dist/components/DatePicker/styles.css +453 -453
- package/dist/components/Dialog/Dialog.vue.d.ts.map +1 -1
- package/dist/components/Dialog/styles.css +420 -421
- package/dist/components/Dialog/types.d.ts +1 -2
- package/dist/components/Dialog/types.d.ts.map +1 -1
- package/dist/components/Dock/styles.css +84 -84
- package/dist/components/Drawer/styles.css +346 -346
- package/dist/components/Dropdown/styles.css +135 -135
- package/dist/components/Empty/styles.css +146 -146
- package/dist/components/FileUpload/styles.css +359 -359
- package/dist/components/Form/Form.vue.d.ts.map +1 -1
- package/dist/components/Form/styles.css +125 -125
- package/dist/components/Gallery/styles.css +100 -100
- package/dist/components/Input/styles.css +392 -392
- package/dist/components/InputColor/styles.css +139 -139
- package/dist/components/InputNumber/styles.css +262 -262
- package/dist/components/InputPassword/styles.css +189 -189
- package/dist/components/InputTags/styles.css +121 -121
- package/dist/components/Layout/styles.css +433 -433
- package/dist/components/List/styles.css +229 -229
- package/dist/components/Listbox/styles.css +130 -130
- package/dist/components/Loading/styles.css +378 -378
- package/dist/components/MegaMenu/styles.css +97 -97
- package/dist/components/Menu/styles.css +565 -565
- package/dist/components/Menubar/styles.css +144 -144
- package/dist/components/Message/Message.vue.d.ts.map +1 -1
- package/dist/components/Message/index.d.ts +1 -1
- package/dist/components/Message/index.d.ts.map +1 -1
- package/dist/components/Message/message.d.ts +4 -0
- package/dist/components/Message/message.d.ts.map +1 -1
- package/dist/components/Message/styles.css +248 -252
- package/dist/components/Message/types.d.ts +4 -4
- package/dist/components/Message/types.d.ts.map +1 -1
- package/dist/components/MeterGroup/styles.css +49 -49
- package/dist/components/Page/PageFilters.vue.d.ts.map +1 -1
- package/dist/components/Page/PageStat.vue.d.ts +2 -2
- package/dist/components/Page/index.d.ts +1 -1
- package/dist/components/Page/index.d.ts.map +1 -1
- package/dist/components/Page/styles.css +430 -430
- package/dist/components/Page/types.d.ts +2 -2
- package/dist/components/Page/types.d.ts.map +1 -1
- package/dist/components/Pagination/styles.css +124 -124
- package/dist/components/Popover/styles.css +92 -92
- package/dist/components/ProgressBar/ProgressBar.vue.d.ts.map +1 -1
- package/dist/components/ProgressBar/styles.css +1 -1
- package/dist/components/ProgressBar/types.d.ts +2 -7
- package/dist/components/ProgressBar/types.d.ts.map +1 -1
- package/dist/components/Result/styles.css +146 -146
- package/dist/components/Scrollbar/styles.css +131 -131
- package/dist/components/Select/styles.css +222 -222
- package/dist/components/SelectButton/styles.css +107 -107
- package/dist/components/Sidebar/styles.css +74 -74
- package/dist/components/Slider/styles.css +211 -211
- package/dist/components/SplitButton/styles.css +216 -216
- package/dist/components/Status/Status.vue.d.ts +2 -2
- package/dist/components/Status/Status.vue.d.ts.map +1 -1
- package/dist/components/Status/index.d.ts +1 -1
- package/dist/components/Status/index.d.ts.map +1 -1
- package/dist/components/Status/styles.css +190 -191
- package/dist/components/Status/types.d.ts +4 -5
- package/dist/components/Status/types.d.ts.map +1 -1
- package/dist/components/Stepper/styles.css +152 -152
- package/dist/components/Switch/styles.css +129 -129
- package/dist/components/Tabs/styles.css +165 -165
- package/dist/components/Tag/Tag.vue.d.ts +2 -2
- package/dist/components/Tag/index.d.ts +1 -1
- package/dist/components/Tag/index.d.ts.map +1 -1
- package/dist/components/Tag/styles.css +0 -1
- package/dist/components/Tag/types.d.ts +4 -5
- package/dist/components/Tag/types.d.ts.map +1 -1
- package/dist/components/Terminal/styles.css +75 -75
- package/dist/components/Textarea/styles.css +146 -146
- package/dist/components/TieredMenu/styles.css +125 -125
- package/dist/components/Timeline/Timeline.vue.d.ts.map +1 -1
- package/dist/components/Timeline/index.d.ts +1 -1
- package/dist/components/Timeline/index.d.ts.map +1 -1
- package/dist/components/Timeline/styles.css +157 -159
- package/dist/components/Timeline/types.d.ts +3 -3
- package/dist/components/Timeline/types.d.ts.map +1 -1
- package/dist/components/Toast/Toast.vue.d.ts.map +1 -1
- package/dist/components/Toast/index.d.ts +1 -1
- package/dist/components/Toast/index.d.ts.map +1 -1
- package/dist/components/Toast/styles.css +1 -3
- package/dist/components/Toast/toast.d.ts +4 -0
- package/dist/components/Toast/toast.d.ts.map +1 -1
- package/dist/components/Toast/types.d.ts +5 -5
- package/dist/components/Toast/types.d.ts.map +1 -1
- package/dist/components/Toast/useNotification.d.ts +3 -2
- package/dist/components/Toast/useNotification.d.ts.map +1 -1
- package/dist/components/TreeSelect/styles.css +172 -172
- package/dist/components/VirtualScroller/styles.css +27 -27
- package/dist/{config-CB_TiIvg.js → config-BEpyhJi3.js} +1 -1
- package/dist/config-provider/index.js +1 -1
- package/dist/config-provider/style.css +2301 -2301
- package/dist/confirm-dialog/index.js +54 -57
- package/dist/confirm-dialog/style.css +2347 -2348
- package/dist/confirm-popup/index.js +5 -5
- package/dist/confirm-popup/style.css +1938 -1938
- package/dist/context-menu/index.js +5 -5
- package/dist/context-menu/style.css +1474 -1474
- package/dist/data-view/index.js +3 -3
- package/dist/data-view/style.css +1707 -1707
- package/dist/date-picker/index.js +1 -1
- package/dist/date-picker/style.css +1658 -1658
- package/dist/descriptions/index.js +1 -1
- package/dist/descriptions/style.css +1205 -1205
- package/dist/dialog/index.js +95 -98
- package/dist/dialog/style.css +2323 -2324
- package/dist/divider/style.css +1205 -1205
- package/dist/dock/index.js +2 -2
- package/dist/dock/style.css +1289 -1289
- package/dist/drawer/index.js +4 -4
- package/dist/drawer/style.css +1551 -1551
- package/dist/dropdown/index.js +6 -6
- package/dist/dropdown/style.css +1471 -1471
- package/dist/empty/index.js +1 -1
- package/dist/empty/style.css +1351 -1351
- package/dist/fieldset/index.js +1 -1
- package/dist/fieldset/style.css +1205 -1205
- package/dist/file-upload/index.js +2 -2
- package/dist/file-upload/style.css +1564 -1564
- package/dist/flex/index.js +1 -1
- package/dist/flex/style.css +1205 -1205
- package/dist/float-label/style.css +1205 -1205
- package/dist/fluid/style.css +1205 -1205
- package/dist/form/index.js +2 -2
- package/dist/form/style.css +1332 -1332
- package/dist/gallery/index.js +2 -2
- package/dist/gallery/style.css +1436 -1436
- package/dist/grid/style.css +1205 -1205
- package/dist/icon/index.js +1 -1
- package/dist/icon/style.css +1205 -1205
- package/dist/{icon-COrt_N8A.js → icon-H8prbteT.js} +1 -1
- package/dist/icon-field/style.css +1597 -1597
- package/dist/image/index.js +2 -2
- package/dist/image/style.css +1205 -1205
- package/dist/index.d.ts +11 -11
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +3013 -3025
- package/dist/inplace/style.css +1205 -1205
- package/dist/input/index.js +1 -1
- package/dist/input/style.css +1722 -1722
- package/dist/input-color/index.js +2 -2
- package/dist/input-color/style.css +1346 -1346
- package/dist/input-group/style.css +1205 -1205
- package/dist/input-number/index.js +3 -3
- package/dist/input-number/style.css +1467 -1467
- package/dist/input-otp/index.js +2 -2
- package/dist/input-otp/style.css +1205 -1205
- package/dist/input-password/index.js +4 -4
- package/dist/input-password/style.css +1519 -1519
- package/dist/input-tags/index.js +3 -3
- package/dist/input-tags/style.css +1326 -1326
- package/dist/knob/style.css +1205 -1205
- package/dist/label/style.css +1205 -1205
- package/dist/layout/index.js +2 -2
- package/dist/layout/style.css +1769 -1769
- package/dist/list/index.js +4 -4
- package/dist/list/style.css +2087 -2087
- package/dist/listbox/index.js +2 -2
- package/dist/listbox/style.css +1497 -1497
- package/dist/loading/index.js +1 -1
- package/dist/loading/style.css +1585 -1585
- package/dist/{locale-CR2PIaxt.js → locale-CZddM-tH.js} +1 -1
- package/dist/mega-menu/index.js +5 -5
- package/dist/mega-menu/style.css +1302 -1302
- package/dist/mentions/index.js +4 -4
- package/dist/mentions/style.css +1330 -1330
- package/dist/menu/index.js +6 -6
- package/dist/menu/style.css +2059 -2059
- package/dist/menubar/index.js +5 -5
- package/dist/menubar/style.css +1480 -1480
- package/dist/message/index.js +116 -117
- package/dist/message/style.css +1453 -1457
- package/dist/meter-group/style.css +1256 -1256
- package/dist/order-list/index.js +2 -2
- package/dist/order-list/style.css +1205 -1205
- package/dist/page/index.js +8 -7
- package/dist/page/style.css +2597 -2597
- package/dist/pagination/index.js +1 -1
- package/dist/pagination/style.css +1551 -1551
- package/dist/panel/index.js +3 -3
- package/dist/panel/style.css +1205 -1205
- package/dist/pick-list/index.js +2 -2
- package/dist/pick-list/style.css +1205 -1205
- package/dist/popover/index.js +1 -1
- package/dist/popover/style.css +1299 -1299
- package/dist/progress-bar/index.js +33 -34
- package/dist/progress-bar/style.css +1206 -1206
- package/dist/progress-spinner/index.js +1 -1
- package/dist/progress-spinner/style.css +1205 -1205
- package/dist/qr-code/index.js +4 -4
- package/dist/qr-code/style.css +1903 -1903
- package/dist/radio/index.js +1 -1
- package/dist/radio/style.css +1205 -1205
- package/dist/rating/index.js +3 -3
- package/dist/rating/style.css +1205 -1205
- package/dist/result/index.js +2 -2
- package/dist/result/style.css +1351 -1351
- package/dist/scroll-top/index.js +3 -3
- package/dist/scroll-top/style.css +1336 -1336
- package/dist/scrollbar/style.css +1338 -1338
- package/dist/segmented/index.js +1 -1
- package/dist/segmented/style.css +1205 -1205
- package/dist/select/index.js +1 -1
- package/dist/select/style.css +2115 -2115
- package/dist/select-button/index.js +1 -1
- package/dist/select-button/style.css +1314 -1314
- package/dist/shared/styles/control-affix-icon.css +110 -110
- package/dist/shared/styles/control-suffix.css +118 -118
- package/dist/shared/styles/select-overlay.css +177 -177
- package/dist/shared/types.d.ts +7 -20
- package/dist/shared/types.d.ts.map +1 -1
- package/dist/sidebar/index.js +3 -3
- package/dist/sidebar/style.css +1279 -1279
- package/dist/skeleton/style.css +1205 -1205
- package/dist/slider/index.js +2 -2
- package/dist/slider/style.css +1418 -1418
- package/dist/space/index.js +1 -1
- package/dist/space/style.css +1205 -1205
- package/dist/speed-dial/index.js +5 -5
- package/dist/speed-dial/style.css +1205 -1205
- package/dist/split-button/index.js +5 -5
- package/dist/split-button/style.css +2119 -2119
- package/dist/splitter/index.js +1 -1
- package/dist/splitter/style.css +1205 -1205
- package/dist/statistic/style.css +1205 -1205
- package/dist/status/index.js +30 -31
- package/dist/status/style.css +1395 -1396
- package/dist/stepper/index.js +1 -1
- package/dist/stepper/style.css +1357 -1357
- package/dist/styles/base.css +804 -804
- package/dist/styles.css +1 -1
- package/dist/switch/index.js +1 -1
- package/dist/switch/style.css +1336 -1336
- package/dist/table/index.js +11 -11
- package/dist/table/style.css +1840 -1840
- package/dist/tabs/index.js +2 -2
- package/dist/tabs/style.css +1501 -1501
- package/dist/tag/index.js +52 -52
- package/dist/tag/style.css +1205 -1206
- package/dist/terminal/index.js +1 -1
- package/dist/terminal/style.css +1282 -1282
- package/dist/textarea/index.js +1 -1
- package/dist/textarea/style.css +1476 -1476
- package/dist/theme/styles.css +401 -401
- package/dist/tiered-menu/index.js +4 -4
- package/dist/tiered-menu/style.css +1461 -1461
- package/dist/time-picker/index.js +1 -1
- package/dist/time-picker/style.css +1660 -1660
- package/dist/timeline/index.js +67 -72
- package/dist/timeline/style.css +1493 -1495
- package/dist/toast/index.js +135 -136
- package/dist/toast/style.css +1904 -1906
- package/dist/toggle-button/index.js +3 -3
- package/dist/toggle-button/style.css +1205 -1205
- package/dist/toolbar/style.css +1205 -1205
- package/dist/tooltip/index.js +1 -1
- package/dist/tooltip/style.css +1205 -1205
- package/dist/tour/index.js +4 -4
- package/dist/tour/style.css +1903 -1903
- package/dist/tree/index.js +3 -3
- package/dist/tree/style.css +1205 -1205
- package/dist/tree-select/index.js +5 -5
- package/dist/tree-select/style.css +1913 -1913
- package/dist/{types-DGuu4Eg4.js → types-DBQfGctj.js} +1 -4
- package/dist/typography/index.js +3 -3
- package/dist/typography/style.css +1351 -1351
- package/dist/{useMotionTransition-D8JOR3ih.js → useMotionTransition-DqL_SEML.js} +1 -1
- package/dist/virtual-scroller/style.css +1366 -1366
- package/dist/watermark/style.css +1205 -1205
- package/package.json +2 -1
|
@@ -1,168 +1,168 @@
|
|
|
1
|
-
/* —— Form: CascadeSelect —— */
|
|
2
|
-
.m-cascadeselect {
|
|
3
|
-
--m-cascadeselect-min-width: 12rem;
|
|
4
|
-
display: inline-block;
|
|
5
|
-
max-width: 100%;
|
|
6
|
-
position: relative;
|
|
7
|
-
}
|
|
8
|
-
|
|
9
|
-
.m-cascadeselect__control {
|
|
10
|
-
display: inline-block;
|
|
11
|
-
max-width: 100%;
|
|
12
|
-
min-width: var(--m-cascadeselect-min-width);
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
.m-select-field--fluid .m-cascadeselect__control {
|
|
16
|
-
min-width: 0;
|
|
17
|
-
width: 100%;
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
.m-cascadeselect__trigger {
|
|
21
|
-
align-items: center;
|
|
22
|
-
background: var(--m-color-surface);
|
|
23
|
-
border: var(--m-border-width) solid var(--m-color-border);
|
|
24
|
-
border-radius: var(--m-radius-control);
|
|
25
|
-
box-sizing: border-box;
|
|
26
|
-
color: var(--m-color-text);
|
|
27
|
-
cursor: pointer;
|
|
28
|
-
display: inline-flex;
|
|
29
|
-
font-family: var(--m-font-sans);
|
|
30
|
-
font-size: var(--m-control-font-medium);
|
|
31
|
-
min-height: var(--m-control-height-medium);
|
|
32
|
-
padding: 0 var(--m-control-padding-x-medium);
|
|
33
|
-
padding-right: var(--m-control-end-padding);
|
|
34
|
-
transition:
|
|
35
|
-
border-color var(--m-motion-fast) var(--m-motion-ease),
|
|
36
|
-
box-shadow var(--m-motion-fast) var(--m-motion-ease),
|
|
37
|
-
opacity var(--m-motion-fast) var(--m-motion-ease);
|
|
38
|
-
width: 100%;
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
.m-cascadeselect--small .m-cascadeselect__trigger {
|
|
42
|
-
font-size: var(--m-control-font-small);
|
|
43
|
-
min-height: var(--m-control-height-small);
|
|
44
|
-
padding-left: var(--m-control-padding-x-small);
|
|
45
|
-
padding-right: var(--m-control-end-padding);
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
.m-cascadeselect--large .m-cascadeselect__trigger {
|
|
49
|
-
font-size: var(--m-control-font-large);
|
|
50
|
-
min-height: var(--m-control-height-large);
|
|
51
|
-
padding-left: var(--m-control-padding-x-large);
|
|
52
|
-
padding-right: var(--m-control-end-padding);
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
.m-cascadeselect:not(.m-cascadeselect--disabled):not(.m-cascadeselect--open)
|
|
56
|
-
.m-cascadeselect__trigger:hover:not(:focus):not(:focus-visible) {
|
|
57
|
-
border-color: var(--m-color-primary-hover);
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
.m-cascadeselect--open .m-cascadeselect__trigger,
|
|
61
|
-
.m-cascadeselect__trigger:focus,
|
|
62
|
-
.m-cascadeselect__trigger:focus-visible {
|
|
63
|
-
border-color: var(--m-color-primary);
|
|
64
|
-
box-shadow: var(--m-focus-shadow);
|
|
65
|
-
outline: none;
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
.m-cascadeselect__trigger--invalid {
|
|
69
|
-
border-color: var(--m-color-danger);
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
.m-cascadeselect__trigger--invalid:focus,
|
|
73
|
-
.m-cascadeselect__trigger--invalid:focus-visible,
|
|
74
|
-
.m-cascadeselect--open .m-cascadeselect__trigger--invalid {
|
|
75
|
-
border-color: var(--m-color-danger);
|
|
76
|
-
box-shadow: var(--m-focus-shadow-danger);
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
.m-cascadeselect--disabled .m-cascadeselect__trigger {
|
|
80
|
-
cursor: not-allowed;
|
|
81
|
-
opacity: var(--m-opacity-disabled);
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
.m-cascadeselect__label {
|
|
85
|
-
flex: 1 1 auto;
|
|
86
|
-
min-width: 0;
|
|
87
|
-
overflow: hidden;
|
|
88
|
-
text-align: left;
|
|
89
|
-
text-overflow: ellipsis;
|
|
90
|
-
white-space: nowrap;
|
|
91
|
-
}
|
|
92
|
-
|
|
93
|
-
.m-cascadeselect__trigger--placeholder .m-cascadeselect__label {
|
|
94
|
-
color: var(--m-color-text-muted);
|
|
95
|
-
}
|
|
96
|
-
|
|
97
|
-
.m-cascadeselect__panel {
|
|
98
|
-
--m-cascadeselect-column-min-width: 10rem;
|
|
99
|
-
--m-cascadeselect-column-max-height: min(18rem, 45vh);
|
|
100
|
-
box-sizing: border-box;
|
|
101
|
-
display: flex;
|
|
102
|
-
left: 0;
|
|
103
|
-
position: absolute;
|
|
104
|
-
top: 100%;
|
|
105
|
-
width: max-content;
|
|
106
|
-
}
|
|
107
|
-
|
|
108
|
-
.m-cascadeselect__panel--teleported {
|
|
109
|
-
top: auto;
|
|
110
|
-
}
|
|
111
|
-
|
|
112
|
-
.m-cascadeselect__column {
|
|
113
|
-
box-sizing: border-box;
|
|
114
|
-
flex: 0 0 auto;
|
|
115
|
-
margin: 0;
|
|
116
|
-
width: max-content;
|
|
117
|
-
}
|
|
118
|
-
|
|
119
|
-
/*
|
|
120
|
-
* First column keeps the trigger-width floor (panel min-width from JS).
|
|
121
|
-
* Later columns only add width — they must not redistribute/shrink the first.
|
|
122
|
-
*/
|
|
123
|
-
.m-cascadeselect__column:first-child {
|
|
124
|
-
min-width: inherit;
|
|
125
|
-
}
|
|
126
|
-
|
|
127
|
-
.m-cascadeselect__column:not(:first-child) {
|
|
128
|
-
min-width: var(--m-cascadeselect-column-min-width);
|
|
129
|
-
}
|
|
130
|
-
|
|
131
|
-
/* Lone column still fills the panel edge-to-edge. */
|
|
132
|
-
.m-cascadeselect__column:only-child {
|
|
133
|
-
width: auto;
|
|
134
|
-
min-width: 100%;
|
|
135
|
-
}
|
|
136
|
-
|
|
137
|
-
.m-cascadeselect__column .m-scrollbar__wrap,
|
|
138
|
-
.m-cascadeselect__column .m-scrollbar__view {
|
|
139
|
-
box-sizing: border-box;
|
|
140
|
-
width: 100%;
|
|
141
|
-
}
|
|
142
|
-
|
|
143
|
-
.m-cascadeselect__column-list {
|
|
144
|
-
list-style: none;
|
|
145
|
-
margin: 0;
|
|
146
|
-
padding: var(--m-space-1);
|
|
147
|
-
width: 100%;
|
|
148
|
-
}
|
|
149
|
-
|
|
150
|
-
.m-cascadeselect__column-list > li {
|
|
151
|
-
width: 100%;
|
|
152
|
-
}
|
|
153
|
-
|
|
154
|
-
.m-cascadeselect__column + .m-cascadeselect__column {
|
|
155
|
-
border-left: var(--m-border-width) solid var(--m-color-border);
|
|
156
|
-
}
|
|
157
|
-
|
|
158
|
-
.m-cascadeselect__option {
|
|
159
|
-
width: 100%;
|
|
160
|
-
}
|
|
161
|
-
|
|
162
|
-
.m-cascadeselect__option > span {
|
|
163
|
-
min-width: 0;
|
|
164
|
-
}
|
|
165
|
-
|
|
166
|
-
.m-cascadeselect__option .m-icon {
|
|
167
|
-
flex-shrink: 0;
|
|
168
|
-
}
|
|
1
|
+
/* —— Form: CascadeSelect —— */
|
|
2
|
+
.m-cascadeselect {
|
|
3
|
+
--m-cascadeselect-min-width: 12rem;
|
|
4
|
+
display: inline-block;
|
|
5
|
+
max-width: 100%;
|
|
6
|
+
position: relative;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.m-cascadeselect__control {
|
|
10
|
+
display: inline-block;
|
|
11
|
+
max-width: 100%;
|
|
12
|
+
min-width: var(--m-cascadeselect-min-width);
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
.m-select-field--fluid .m-cascadeselect__control {
|
|
16
|
+
min-width: 0;
|
|
17
|
+
width: 100%;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
.m-cascadeselect__trigger {
|
|
21
|
+
align-items: center;
|
|
22
|
+
background: var(--m-color-surface);
|
|
23
|
+
border: var(--m-border-width) solid var(--m-color-border);
|
|
24
|
+
border-radius: var(--m-radius-control);
|
|
25
|
+
box-sizing: border-box;
|
|
26
|
+
color: var(--m-color-text);
|
|
27
|
+
cursor: pointer;
|
|
28
|
+
display: inline-flex;
|
|
29
|
+
font-family: var(--m-font-sans);
|
|
30
|
+
font-size: var(--m-control-font-medium);
|
|
31
|
+
min-height: var(--m-control-height-medium);
|
|
32
|
+
padding: 0 var(--m-control-padding-x-medium);
|
|
33
|
+
padding-right: var(--m-control-end-padding);
|
|
34
|
+
transition:
|
|
35
|
+
border-color var(--m-motion-fast) var(--m-motion-ease),
|
|
36
|
+
box-shadow var(--m-motion-fast) var(--m-motion-ease),
|
|
37
|
+
opacity var(--m-motion-fast) var(--m-motion-ease);
|
|
38
|
+
width: 100%;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
.m-cascadeselect--small .m-cascadeselect__trigger {
|
|
42
|
+
font-size: var(--m-control-font-small);
|
|
43
|
+
min-height: var(--m-control-height-small);
|
|
44
|
+
padding-left: var(--m-control-padding-x-small);
|
|
45
|
+
padding-right: var(--m-control-end-padding);
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.m-cascadeselect--large .m-cascadeselect__trigger {
|
|
49
|
+
font-size: var(--m-control-font-large);
|
|
50
|
+
min-height: var(--m-control-height-large);
|
|
51
|
+
padding-left: var(--m-control-padding-x-large);
|
|
52
|
+
padding-right: var(--m-control-end-padding);
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
.m-cascadeselect:not(.m-cascadeselect--disabled):not(.m-cascadeselect--open)
|
|
56
|
+
.m-cascadeselect__trigger:hover:not(:focus):not(:focus-visible) {
|
|
57
|
+
border-color: var(--m-color-primary-hover);
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
.m-cascadeselect--open .m-cascadeselect__trigger,
|
|
61
|
+
.m-cascadeselect__trigger:focus,
|
|
62
|
+
.m-cascadeselect__trigger:focus-visible {
|
|
63
|
+
border-color: var(--m-color-primary);
|
|
64
|
+
box-shadow: var(--m-focus-shadow);
|
|
65
|
+
outline: none;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
.m-cascadeselect__trigger--invalid {
|
|
69
|
+
border-color: var(--m-color-danger);
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
.m-cascadeselect__trigger--invalid:focus,
|
|
73
|
+
.m-cascadeselect__trigger--invalid:focus-visible,
|
|
74
|
+
.m-cascadeselect--open .m-cascadeselect__trigger--invalid {
|
|
75
|
+
border-color: var(--m-color-danger);
|
|
76
|
+
box-shadow: var(--m-focus-shadow-danger);
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
.m-cascadeselect--disabled .m-cascadeselect__trigger {
|
|
80
|
+
cursor: not-allowed;
|
|
81
|
+
opacity: var(--m-opacity-disabled);
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
.m-cascadeselect__label {
|
|
85
|
+
flex: 1 1 auto;
|
|
86
|
+
min-width: 0;
|
|
87
|
+
overflow: hidden;
|
|
88
|
+
text-align: left;
|
|
89
|
+
text-overflow: ellipsis;
|
|
90
|
+
white-space: nowrap;
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
.m-cascadeselect__trigger--placeholder .m-cascadeselect__label {
|
|
94
|
+
color: var(--m-color-text-muted);
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
.m-cascadeselect__panel {
|
|
98
|
+
--m-cascadeselect-column-min-width: 10rem;
|
|
99
|
+
--m-cascadeselect-column-max-height: min(18rem, 45vh);
|
|
100
|
+
box-sizing: border-box;
|
|
101
|
+
display: flex;
|
|
102
|
+
left: 0;
|
|
103
|
+
position: absolute;
|
|
104
|
+
top: 100%;
|
|
105
|
+
width: max-content;
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
.m-cascadeselect__panel--teleported {
|
|
109
|
+
top: auto;
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
.m-cascadeselect__column {
|
|
113
|
+
box-sizing: border-box;
|
|
114
|
+
flex: 0 0 auto;
|
|
115
|
+
margin: 0;
|
|
116
|
+
width: max-content;
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
/*
|
|
120
|
+
* First column keeps the trigger-width floor (panel min-width from JS).
|
|
121
|
+
* Later columns only add width — they must not redistribute/shrink the first.
|
|
122
|
+
*/
|
|
123
|
+
.m-cascadeselect__column:first-child {
|
|
124
|
+
min-width: inherit;
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
.m-cascadeselect__column:not(:first-child) {
|
|
128
|
+
min-width: var(--m-cascadeselect-column-min-width);
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
/* Lone column still fills the panel edge-to-edge. */
|
|
132
|
+
.m-cascadeselect__column:only-child {
|
|
133
|
+
width: auto;
|
|
134
|
+
min-width: 100%;
|
|
135
|
+
}
|
|
136
|
+
|
|
137
|
+
.m-cascadeselect__column .m-scrollbar__wrap,
|
|
138
|
+
.m-cascadeselect__column .m-scrollbar__view {
|
|
139
|
+
box-sizing: border-box;
|
|
140
|
+
width: 100%;
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
.m-cascadeselect__column-list {
|
|
144
|
+
list-style: none;
|
|
145
|
+
margin: 0;
|
|
146
|
+
padding: var(--m-space-1);
|
|
147
|
+
width: 100%;
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
.m-cascadeselect__column-list > li {
|
|
151
|
+
width: 100%;
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
.m-cascadeselect__column + .m-cascadeselect__column {
|
|
155
|
+
border-left: var(--m-border-width) solid var(--m-color-border);
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
.m-cascadeselect__option {
|
|
159
|
+
width: 100%;
|
|
160
|
+
}
|
|
161
|
+
|
|
162
|
+
.m-cascadeselect__option > span {
|
|
163
|
+
min-width: 0;
|
|
164
|
+
}
|
|
165
|
+
|
|
166
|
+
.m-cascadeselect__option .m-icon {
|
|
167
|
+
flex-shrink: 0;
|
|
168
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,YAAY,CAAA;AAC7C,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,YAAY,CAAA;AAC7C,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA"}
|
|
@@ -1,144 +1,144 @@
|
|
|
1
|
-
.m-chip {
|
|
2
|
-
--m-chip-avatar-size: 1.25rem;
|
|
3
|
-
--m-chip-icon-size: 1rem;
|
|
4
|
-
--m-chip-small-padding-y: 0.15rem;
|
|
5
|
-
--m-chip-remove-size: var(--m-chip-avatar-size);
|
|
6
|
-
align-items: center;
|
|
7
|
-
background: color-mix(
|
|
8
|
-
in srgb,
|
|
9
|
-
var(--m-color-text-muted) 14%,
|
|
10
|
-
var(--m-color-surface)
|
|
11
|
-
);
|
|
12
|
-
border-radius: var(--m-radius-full);
|
|
13
|
-
color: var(--m-color-text);
|
|
14
|
-
display: inline-flex;
|
|
15
|
-
font-family: var(--m-font-sans);
|
|
16
|
-
font-size: var(--m-font-size-md);
|
|
17
|
-
font-weight: 500;
|
|
18
|
-
gap: var(--m-space-2);
|
|
19
|
-
line-height: 1;
|
|
20
|
-
max-width: 100%;
|
|
21
|
-
padding: var(--m-space-2) var(--m-space-3);
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
.m-chip--disabled {
|
|
25
|
-
cursor: not-allowed;
|
|
26
|
-
opacity: var(--m-opacity-disabled);
|
|
27
|
-
pointer-events: none;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
.m-chip__image {
|
|
31
|
-
border-radius: var(--m-radius-full);
|
|
32
|
-
flex-shrink: 0;
|
|
33
|
-
height: var(--m-chip-avatar-size);
|
|
34
|
-
object-fit: cover;
|
|
35
|
-
width: var(--m-chip-avatar-size);
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
.m-chip__icon {
|
|
39
|
-
flex-shrink: 0;
|
|
40
|
-
height: var(--m-chip-icon-size);
|
|
41
|
-
width: var(--m-chip-icon-size);
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
.m-chip__icon :is(.m-icon, svg) {
|
|
45
|
-
display: block;
|
|
46
|
-
height: 100%;
|
|
47
|
-
width: 100%;
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
.m-chip__label {
|
|
51
|
-
overflow: hidden;
|
|
52
|
-
text-overflow: ellipsis;
|
|
53
|
-
white-space: nowrap;
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
.m-chip__remove {
|
|
57
|
-
align-items: center;
|
|
58
|
-
background: transparent;
|
|
59
|
-
border: 0;
|
|
60
|
-
border-radius: var(--m-radius-full);
|
|
61
|
-
color: var(--m-color-text-muted);
|
|
62
|
-
cursor: pointer;
|
|
63
|
-
display: inline-flex;
|
|
64
|
-
flex-shrink: 0;
|
|
65
|
-
font: inherit;
|
|
66
|
-
font-size: var(--m-chip-icon-size);
|
|
67
|
-
height: var(--m-chip-remove-size);
|
|
68
|
-
justify-content: center;
|
|
69
|
-
line-height: 1;
|
|
70
|
-
margin-inline-end: calc(var(--m-space-1) * -1);
|
|
71
|
-
padding: 0;
|
|
72
|
-
width: var(--m-chip-remove-size);
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
.m-chip__remove :is(.m-icon, svg) {
|
|
76
|
-
display: block;
|
|
77
|
-
height: var(--m-chip-icon-size);
|
|
78
|
-
width: var(--m-chip-icon-size);
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
.m-chip__remove:hover:not(:disabled) {
|
|
82
|
-
color: var(--m-color-text);
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
.m-chip__remove:focus-visible {
|
|
86
|
-
box-shadow: var(--m-focus-shadow);
|
|
87
|
-
outline: none;
|
|
88
|
-
}
|
|
89
|
-
|
|
90
|
-
.m-chip__remove:disabled {
|
|
91
|
-
cursor: not-allowed;
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
.m-chip--small {
|
|
95
|
-
--m-chip-icon-size: 0.875rem;
|
|
96
|
-
font-size: var(--m-font-size-xs);
|
|
97
|
-
padding: var(--m-chip-small-padding-y) var(--m-space-2);
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
.m-chip--large {
|
|
101
|
-
--m-chip-icon-size: 1.25rem;
|
|
102
|
-
font-size: var(--m-font-size-md);
|
|
103
|
-
padding: var(--m-space-2) var(--m-space-4);
|
|
104
|
-
}
|
|
105
|
-
|
|
106
|
-
.m-chip--primary {
|
|
107
|
-
background: color-mix(in srgb, var(--m-color-primary) 12%, transparent);
|
|
108
|
-
color: var(--m-color-primary);
|
|
109
|
-
}
|
|
110
|
-
|
|
111
|
-
.m-chip--secondary {
|
|
112
|
-
background: color-mix(in srgb, var(--m-color-text-muted) 16%, var(--m-color-surface));
|
|
113
|
-
color: var(--m-color-text);
|
|
114
|
-
}
|
|
115
|
-
|
|
116
|
-
.m-chip--success {
|
|
117
|
-
background: color-mix(in srgb, var(--m-color-success) 14%, transparent);
|
|
118
|
-
color: var(--m-color-success);
|
|
119
|
-
}
|
|
120
|
-
|
|
121
|
-
.m-chip--info {
|
|
122
|
-
background: color-mix(in srgb, var(--m-color-info) 12%, transparent);
|
|
123
|
-
color: var(--m-color-info);
|
|
124
|
-
}
|
|
125
|
-
|
|
126
|
-
.m-chip--
|
|
127
|
-
background: color-mix(in srgb, var(--m-color-warn) 14%, transparent);
|
|
128
|
-
color: var(--m-color-warn);
|
|
129
|
-
}
|
|
130
|
-
|
|
131
|
-
.m-chip--danger {
|
|
132
|
-
background: color-mix(in srgb, var(--m-color-danger) 14%, transparent);
|
|
133
|
-
color: var(--m-color-danger);
|
|
134
|
-
}
|
|
135
|
-
|
|
136
|
-
.m-chip--help {
|
|
137
|
-
background: color-mix(in srgb, var(--m-color-help) 14%, transparent);
|
|
138
|
-
color: var(--m-color-help);
|
|
139
|
-
}
|
|
140
|
-
|
|
141
|
-
.m-chip--contrast {
|
|
142
|
-
background: var(--m-color-contrast);
|
|
143
|
-
color: var(--m-color-contrast-fg);
|
|
144
|
-
}
|
|
1
|
+
.m-chip {
|
|
2
|
+
--m-chip-avatar-size: 1.25rem;
|
|
3
|
+
--m-chip-icon-size: 1rem;
|
|
4
|
+
--m-chip-small-padding-y: 0.15rem;
|
|
5
|
+
--m-chip-remove-size: var(--m-chip-avatar-size);
|
|
6
|
+
align-items: center;
|
|
7
|
+
background: color-mix(
|
|
8
|
+
in srgb,
|
|
9
|
+
var(--m-color-text-muted) 14%,
|
|
10
|
+
var(--m-color-surface)
|
|
11
|
+
);
|
|
12
|
+
border-radius: var(--m-radius-full);
|
|
13
|
+
color: var(--m-color-text);
|
|
14
|
+
display: inline-flex;
|
|
15
|
+
font-family: var(--m-font-sans);
|
|
16
|
+
font-size: var(--m-font-size-md);
|
|
17
|
+
font-weight: 500;
|
|
18
|
+
gap: var(--m-space-2);
|
|
19
|
+
line-height: 1;
|
|
20
|
+
max-width: 100%;
|
|
21
|
+
padding: var(--m-space-2) var(--m-space-3);
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.m-chip--disabled {
|
|
25
|
+
cursor: not-allowed;
|
|
26
|
+
opacity: var(--m-opacity-disabled);
|
|
27
|
+
pointer-events: none;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
.m-chip__image {
|
|
31
|
+
border-radius: var(--m-radius-full);
|
|
32
|
+
flex-shrink: 0;
|
|
33
|
+
height: var(--m-chip-avatar-size);
|
|
34
|
+
object-fit: cover;
|
|
35
|
+
width: var(--m-chip-avatar-size);
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
.m-chip__icon {
|
|
39
|
+
flex-shrink: 0;
|
|
40
|
+
height: var(--m-chip-icon-size);
|
|
41
|
+
width: var(--m-chip-icon-size);
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.m-chip__icon :is(.m-icon, svg) {
|
|
45
|
+
display: block;
|
|
46
|
+
height: 100%;
|
|
47
|
+
width: 100%;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.m-chip__label {
|
|
51
|
+
overflow: hidden;
|
|
52
|
+
text-overflow: ellipsis;
|
|
53
|
+
white-space: nowrap;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
.m-chip__remove {
|
|
57
|
+
align-items: center;
|
|
58
|
+
background: transparent;
|
|
59
|
+
border: 0;
|
|
60
|
+
border-radius: var(--m-radius-full);
|
|
61
|
+
color: var(--m-color-text-muted);
|
|
62
|
+
cursor: pointer;
|
|
63
|
+
display: inline-flex;
|
|
64
|
+
flex-shrink: 0;
|
|
65
|
+
font: inherit;
|
|
66
|
+
font-size: var(--m-chip-icon-size);
|
|
67
|
+
height: var(--m-chip-remove-size);
|
|
68
|
+
justify-content: center;
|
|
69
|
+
line-height: 1;
|
|
70
|
+
margin-inline-end: calc(var(--m-space-1) * -1);
|
|
71
|
+
padding: 0;
|
|
72
|
+
width: var(--m-chip-remove-size);
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
.m-chip__remove :is(.m-icon, svg) {
|
|
76
|
+
display: block;
|
|
77
|
+
height: var(--m-chip-icon-size);
|
|
78
|
+
width: var(--m-chip-icon-size);
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
.m-chip__remove:hover:not(:disabled) {
|
|
82
|
+
color: var(--m-color-text);
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.m-chip__remove:focus-visible {
|
|
86
|
+
box-shadow: var(--m-focus-shadow);
|
|
87
|
+
outline: none;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
.m-chip__remove:disabled {
|
|
91
|
+
cursor: not-allowed;
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
.m-chip--small {
|
|
95
|
+
--m-chip-icon-size: 0.875rem;
|
|
96
|
+
font-size: var(--m-font-size-xs);
|
|
97
|
+
padding: var(--m-chip-small-padding-y) var(--m-space-2);
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
.m-chip--large {
|
|
101
|
+
--m-chip-icon-size: 1.25rem;
|
|
102
|
+
font-size: var(--m-font-size-md);
|
|
103
|
+
padding: var(--m-space-2) var(--m-space-4);
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
.m-chip--primary {
|
|
107
|
+
background: color-mix(in srgb, var(--m-color-primary) 12%, transparent);
|
|
108
|
+
color: var(--m-color-primary);
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
.m-chip--secondary {
|
|
112
|
+
background: color-mix(in srgb, var(--m-color-text-muted) 16%, var(--m-color-surface));
|
|
113
|
+
color: var(--m-color-text);
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
.m-chip--success {
|
|
117
|
+
background: color-mix(in srgb, var(--m-color-success) 14%, transparent);
|
|
118
|
+
color: var(--m-color-success);
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
.m-chip--info {
|
|
122
|
+
background: color-mix(in srgb, var(--m-color-info) 12%, transparent);
|
|
123
|
+
color: var(--m-color-info);
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
.m-chip--warning {
|
|
127
|
+
background: color-mix(in srgb, var(--m-color-warn) 14%, transparent);
|
|
128
|
+
color: var(--m-color-warn);
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
.m-chip--danger {
|
|
132
|
+
background: color-mix(in srgb, var(--m-color-danger) 14%, transparent);
|
|
133
|
+
color: var(--m-color-danger);
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
.m-chip--help {
|
|
137
|
+
background: color-mix(in srgb, var(--m-color-help) 14%, transparent);
|
|
138
|
+
color: var(--m-color-help);
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
.m-chip--contrast {
|
|
142
|
+
background: var(--m-color-contrast);
|
|
143
|
+
color: var(--m-color-contrast-fg);
|
|
144
|
+
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { RootPassThrough } from '../../shared/passThrough';
|
|
2
|
-
import { MSizeInput,
|
|
2
|
+
import { MSizeInput, MTagType } from '../../shared/types';
|
|
3
3
|
import { IconName } from '../Icon/types';
|
|
4
|
-
export type
|
|
4
|
+
export type ChipType = MTagType;
|
|
5
5
|
export type ChipSize = MSizeInput;
|
|
6
6
|
export interface ChipProps {
|
|
7
7
|
/** Chip text. */
|
|
@@ -15,7 +15,7 @@ export interface ChipProps {
|
|
|
15
15
|
/** Disable interaction. */
|
|
16
16
|
disabled?: boolean;
|
|
17
17
|
/** Semantic color. */
|
|
18
|
-
|
|
18
|
+
type?: ChipType;
|
|
19
19
|
/** Size. Also accepts legacy `sm` / `lg`. */
|
|
20
20
|
size?: ChipSize;
|
|
21
21
|
/** Pass-through attrs/classes/styles for the root element. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAA;AAC/D,OAAO,KAAK,EAAE,UAAU,EAAE,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAA;AAC/D,OAAO,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAC9D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAE7C,MAAM,MAAM,QAAQ,GAAG,QAAQ,CAAA;AAC/B,MAAM,MAAM,QAAQ,GAAG,UAAU,CAAA;AAEjC,MAAM,WAAW,SAAS;IACxB,iBAAiB;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,+BAA+B;IAC/B,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,yBAAyB;IACzB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,+BAA+B;IAC/B,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,sBAAsB;IACtB,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,6CAA6C;IAC7C,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,8DAA8D;IAC9D,EAAE,CAAC,EAAE,eAAe,CAAA;CACrB;AAED,MAAM,WAAW,SAAS;IACxB,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,GAAG,IAAI,CAAA;CAC3C"}
|