morya-ui 0.3.0 → 0.3.2
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 +64 -0
- package/dist/Button-dMqRmoYa.js +222 -0
- package/dist/{Card-Dsmnzong.js → Card-B1CB9Trm.js} +3 -5
- package/dist/Empty-C5tndBOm.js +147 -0
- package/dist/Icon-od9Ob-Ay.js +393 -0
- package/dist/Loading-BSsRs6v9.js +420 -0
- package/dist/Pagination-CqpC5EAs.js +166 -0
- package/dist/Select-CKGrSoaC.js +572 -0
- package/dist/Skeleton-DCYdXAH2.js +59 -0
- package/dist/accordion/style.css +20 -71
- package/dist/auto-complete/index.js +118 -120
- package/dist/auto-complete/style.css +24 -88
- package/dist/avatar/index.js +1 -1
- package/dist/avatar/style.css +10 -67
- package/dist/badge/style.css +10 -68
- package/dist/block-ui/style.css +10 -68
- package/dist/breadcrumb/style.css +10 -61
- package/dist/button/index.js +1 -1
- package/dist/button/style.css +72 -78
- package/dist/card/index.js +1 -1
- package/dist/card/style.css +30 -67
- package/dist/carousel/index.js +72 -64
- package/dist/carousel/style.css +36 -82
- package/dist/cascade-select/index.js +1 -1
- package/dist/cascade-select/style.css +24 -81
- package/dist/checkbox/style.css +10 -61
- package/dist/chip/index.js +1 -1
- package/dist/chip/style.css +10 -67
- package/dist/command-menu/index.js +37 -39
- package/dist/command-menu/style.css +10 -75
- package/dist/components/Accordion/styles.css +10 -10
- package/dist/components/AutoComplete/AutoComplete.vue.d.ts.map +1 -1
- package/dist/components/AutoComplete/styles.css +0 -7
- package/dist/components/Badge/styles.css +0 -7
- package/dist/components/BlockUI/styles.css +0 -7
- package/dist/components/Button/Button.vue.d.ts +2 -0
- package/dist/components/Button/Button.vue.d.ts.map +1 -1
- package/dist/components/Button/styles.css +62 -11
- package/dist/components/Button/types.d.ts +4 -0
- package/dist/components/Button/types.d.ts.map +1 -1
- package/dist/components/Card/Card.vue.d.ts +2 -2
- package/dist/components/Card/Card.vue.d.ts.map +1 -1
- package/dist/components/Card/index.d.ts +1 -1
- package/dist/components/Card/index.d.ts.map +1 -1
- package/dist/components/Card/styles.css +20 -6
- package/dist/components/Card/types.d.ts +4 -2
- package/dist/components/Card/types.d.ts.map +1 -1
- package/dist/components/Carousel/Carousel.vue.d.ts.map +1 -1
- package/dist/components/Carousel/styles.css +26 -15
- package/dist/components/CommandMenu/CommandMenu.vue.d.ts.map +1 -1
- package/dist/components/ConfigProvider/ConfigProvider.vue.d.ts +2 -2
- package/dist/components/DataView/DataView.vue.d.ts +7 -7
- package/dist/components/DataView/DataView.vue.d.ts.map +1 -1
- package/dist/components/DataView/styles.css +0 -20
- package/dist/components/Dialog/styles.css +3 -46
- package/dist/components/Dock/styles.css +0 -10
- package/dist/components/Drawer/styles.css +2 -51
- package/dist/components/Dropdown/Dropdown.vue.d.ts +2 -2
- package/dist/components/Dropdown/Dropdown.vue.d.ts.map +1 -1
- package/dist/components/Dropdown/DropdownNodes.vue.d.ts +8 -9
- package/dist/components/Dropdown/DropdownNodes.vue.d.ts.map +1 -1
- package/dist/components/Dropdown/styles.css +24 -5
- package/dist/components/Fieldset/styles.css +0 -7
- package/dist/components/FileUpload/FileUpload.vue.d.ts.map +1 -1
- package/dist/components/FileUpload/fileUtils.d.ts +8 -0
- package/dist/components/FileUpload/fileUtils.d.ts.map +1 -0
- package/dist/components/Gallery/styles.css +0 -8
- package/dist/components/Icon/Icon.vue.d.ts.map +1 -1
- package/dist/components/Icon/icon-categories.d.ts.map +1 -1
- package/dist/components/Icon/icons-types.d.ts +4 -2
- package/dist/components/Icon/icons-types.d.ts.map +1 -1
- package/dist/components/Icon/icons.d.ts +250 -561
- package/dist/components/Icon/icons.d.ts.map +1 -1
- package/dist/components/Icon/index.d.ts +2 -2
- package/dist/components/Icon/index.d.ts.map +1 -1
- package/dist/components/Icon/styles.css +0 -6
- package/dist/components/Knob/styles.css +0 -6
- package/dist/components/Layout/styles.css +5 -14
- package/dist/components/Listbox/Listbox.vue.d.ts.map +1 -1
- package/dist/components/Loading/styles.css +0 -16
- package/dist/components/Menu/Menu.vue.d.ts.map +1 -1
- package/dist/components/Menu/styles.css +6 -7
- package/dist/components/Menubar/Menubar.vue.d.ts.map +1 -1
- package/dist/components/Menubar/styles.css +4 -0
- package/dist/components/Message/styles.css +0 -13
- package/dist/components/Page/PageContent.vue.d.ts +2 -1
- package/dist/components/Page/PageContent.vue.d.ts.map +1 -1
- package/dist/components/Page/PageFilterChips.vue.d.ts +16 -0
- package/dist/components/Page/PageFilterChips.vue.d.ts.map +1 -0
- package/dist/components/Page/PageFilters.vue.d.ts +15 -3
- package/dist/components/Page/PageFilters.vue.d.ts.map +1 -1
- package/dist/components/Page/PageHeader.vue.d.ts +8 -4
- package/dist/components/Page/PageHeader.vue.d.ts.map +1 -1
- package/dist/components/Page/PagePlaceholder.vue.d.ts +6 -2
- package/dist/components/Page/PagePlaceholder.vue.d.ts.map +1 -1
- package/dist/components/Page/PageSection.vue.d.ts +8 -2
- package/dist/components/Page/PageSection.vue.d.ts.map +1 -1
- package/dist/components/Page/PageStat.vue.d.ts +8 -3
- package/dist/components/Page/PageStat.vue.d.ts.map +1 -1
- package/dist/components/Page/index.d.ts +2 -1
- package/dist/components/Page/index.d.ts.map +1 -1
- package/dist/components/Page/styles.css +239 -44
- package/dist/components/Page/types.d.ts +40 -0
- package/dist/components/Page/types.d.ts.map +1 -1
- package/dist/components/Pagination/Pagination.vue.d.ts.map +1 -1
- package/dist/components/Pagination/styles.css +7 -10
- package/dist/components/Pagination/types.d.ts +1 -1
- package/dist/components/Pagination/types.d.ts.map +1 -1
- package/dist/components/Panel/styles.css +0 -7
- package/dist/components/Popover/styles.css +20 -17
- package/dist/components/ProgressBar/styles.css +0 -9
- package/dist/components/ProgressSpinner/styles.css +0 -7
- package/dist/components/ScrollTop/styles.css +0 -7
- package/dist/components/Scrollbar/Scrollbar.vue.d.ts +1 -1
- package/dist/components/Scrollbar/styles.css +0 -8
- package/dist/components/Select/Select.vue.d.ts +10 -8
- package/dist/components/Select/Select.vue.d.ts.map +1 -1
- package/dist/components/Select/selectOptions.d.ts +46 -0
- package/dist/components/Select/selectOptions.d.ts.map +1 -0
- package/dist/components/Select/styles.css +35 -8
- package/dist/components/Select/types.d.ts +11 -1
- package/dist/components/Select/types.d.ts.map +1 -1
- package/dist/components/Sidebar/styles.css +0 -6
- package/dist/components/Skeleton/styles.css +0 -6
- package/dist/components/Slider/styles.css +9 -0
- package/dist/components/SplitButton/styles.css +5 -0
- package/dist/components/Status/styles.css +0 -7
- package/dist/components/Switch/styles.css +0 -7
- package/dist/components/Table/Table.vue.d.ts +26 -26
- package/dist/components/Table/Table.vue.d.ts.map +1 -1
- package/dist/components/Table/TableLoadingLine.vue.d.ts.map +1 -1
- package/dist/components/Table/hooks/useExpandableRow.d.ts.map +1 -1
- package/dist/components/Table/hooks/useTotalItems.d.ts.map +1 -1
- package/dist/components/Table/styles.css +61 -44
- package/dist/components/Table/tableQuery.d.ts +30 -0
- package/dist/components/Table/tableQuery.d.ts.map +1 -0
- package/dist/components/Tree/Tree.vue.d.ts.map +1 -1
- package/dist/components/Tree/treeQuery.d.ts +31 -0
- package/dist/components/Tree/treeQuery.d.ts.map +1 -0
- package/dist/components/TreeSelect/TreeSelect.vue.d.ts.map +1 -1
- package/dist/components/TreeSelect/styles.css +1 -1
- package/dist/config-provider/index.js +1 -1
- package/dist/config-provider/style.css +72 -72
- package/dist/confirm-dialog/index.js +2 -2
- package/dist/confirm-dialog/style.css +75 -124
- package/dist/confirm-popup/index.js +2 -2
- package/dist/confirm-popup/style.css +72 -78
- package/dist/context-menu/index.js +2 -2
- package/dist/context-menu/style.css +10 -75
- package/dist/data-view/index.js +47 -47
- package/dist/data-view/style.css +393 -174
- package/dist/data-view/style.js +1 -1
- package/dist/date-picker/index.js +1 -1
- package/dist/date-picker/style.css +10 -67
- package/dist/dialog/index.js +2 -2
- package/dist/dialog/style.css +75 -124
- package/dist/divider/style.css +10 -61
- package/dist/dock/index.js +2 -2
- package/dist/dock/style.css +10 -77
- package/dist/drawer/index.js +1 -1
- package/dist/drawer/style.css +12 -118
- package/dist/dropdown/index.js +110 -91
- package/dist/dropdown/style.css +34 -80
- package/dist/empty/index.js +5 -150
- package/dist/empty/style.css +10 -67
- package/dist/fieldset/index.js +1 -1
- package/dist/fieldset/style.css +10 -74
- package/dist/file-upload/index.js +148 -146
- package/dist/file-upload/style.css +10 -67
- package/dist/filterByQuery-Bczaxzih.js +17 -0
- package/dist/flex/style.css +10 -61
- package/dist/float-label/style.css +10 -61
- package/dist/fluid/style.css +10 -61
- package/dist/form/style.css +10 -61
- package/dist/gallery/index.js +1 -1
- package/dist/gallery/style.css +10 -83
- package/dist/grid/style.css +10 -61
- package/dist/icon/index.js +93 -39
- package/dist/icon/style.css +10 -67
- package/dist/icon-COrt_N8A.js +18 -0
- package/dist/icon-field/style.css +10 -61
- package/dist/index.d.ts +3 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +5400 -5145
- package/dist/inplace/style.css +10 -61
- package/dist/input/index.js +1 -1
- package/dist/input/style.css +10 -67
- package/dist/input-color/style.css +10 -61
- package/dist/input-group/style.css +10 -61
- package/dist/input-number/index.js +1 -1
- package/dist/input-number/style.css +10 -67
- package/dist/input-otp/style.css +10 -61
- package/dist/input-password/index.js +1 -1
- package/dist/input-password/style.css +10 -67
- package/dist/input-tags/index.js +1 -1
- package/dist/input-tags/style.css +10 -67
- package/dist/knob/style.css +10 -67
- package/dist/label/style.css +10 -61
- package/dist/layout/index.js +1 -1
- package/dist/layout/style.css +15 -89
- package/dist/listbox/index.js +30 -32
- package/dist/listbox/style.css +10 -69
- package/dist/loading/index.js +32 -446
- package/dist/loading/style.css +10 -77
- package/dist/mega-menu/index.js +2 -2
- package/dist/mega-menu/style.css +10 -67
- package/dist/menu/index.js +265 -255
- package/dist/menu/style.css +36 -99
- package/dist/menubar/index.js +6 -3
- package/dist/menubar/style.css +14 -75
- package/dist/message/index.js +1 -1
- package/dist/message/style.css +10 -80
- package/dist/meter-group/style.css +10 -61
- package/dist/order-list/index.js +1 -1
- package/dist/order-list/style.css +10 -67
- package/dist/page/index.js +229 -70
- package/dist/page/style.css +1186 -113
- package/dist/page/style.js +3 -0
- package/dist/pagination/index.js +1 -1
- package/dist/pagination/style.css +210 -77
- package/dist/pagination/style.js +1 -0
- package/dist/panel/index.js +1 -1
- package/dist/panel/style.css +10 -74
- package/dist/pick-list/index.js +1 -1
- package/dist/pick-list/style.css +10 -67
- package/dist/popover/style.css +30 -78
- package/dist/progress-bar/style.css +10 -70
- package/dist/progress-spinner/index.js +105 -2
- package/dist/progress-spinner/style.css +10 -68
- package/dist/radio/style.css +10 -61
- package/dist/rating/index.js +1 -1
- package/dist/rating/style.css +10 -67
- package/dist/resolver-map.d.ts.map +1 -1
- package/dist/resolver.js +1 -0
- package/dist/result/index.js +1 -1
- package/dist/result/style.css +10 -67
- package/dist/scroll-top/index.js +1 -1
- package/dist/scroll-top/style.css +10 -82
- package/dist/scrollbar/style.css +10 -69
- package/dist/select/index.js +2 -478
- package/dist/select/style.css +59 -89
- package/dist/select-button/style.css +10 -61
- package/dist/shared/config.d.ts +2 -2
- package/dist/shared/filterByQuery.d.ts +14 -0
- package/dist/shared/filterByQuery.d.ts.map +1 -0
- package/dist/shared/menu/expand.d.ts +38 -0
- package/dist/shared/menu/expand.d.ts.map +1 -0
- package/dist/shared/menu/icon.d.ts.map +1 -1
- package/dist/shared/menu/index.d.ts +2 -0
- package/dist/shared/menu/index.d.ts.map +1 -1
- package/dist/shared/styles/select-overlay.css +14 -6
- package/dist/sidebar/index.js +2 -2
- package/dist/sidebar/style.css +10 -73
- package/dist/skeleton/index.js +2 -59
- package/dist/skeleton/style.css +10 -67
- package/dist/slider/style.css +19 -61
- package/dist/space/style.css +10 -61
- package/dist/speed-dial/index.js +2 -2
- package/dist/speed-dial/style.css +10 -67
- package/dist/split-button/index.js +1 -1
- package/dist/split-button/style.css +77 -78
- package/dist/splitter/style.css +10 -61
- package/dist/status/index.js +1 -1
- package/dist/status/style.css +10 -74
- package/dist/stepper/index.js +1 -1
- package/dist/stepper/style.css +10 -67
- package/dist/styles/base.css +5 -50
- package/dist/styles.css +1 -1
- package/dist/switch/style.css +10 -68
- package/dist/table/index.js +409 -373
- package/dist/table/style.css +457 -215
- package/dist/table/style.js +1 -1
- package/dist/tabs/index.js +1 -1
- package/dist/tabs/style.css +10 -75
- package/dist/tag/index.js +1 -1
- package/dist/tag/style.css +10 -67
- package/dist/terminal/style.css +10 -61
- package/dist/textarea/index.js +1 -1
- package/dist/textarea/style.css +10 -67
- package/dist/theme/styles.css +5 -11
- package/dist/theme/useMotion.d.ts +5 -1
- package/dist/theme/useMotion.d.ts.map +1 -1
- package/dist/tiered-menu/index.js +1 -1
- package/dist/tiered-menu/style.css +10 -75
- package/dist/timeline/index.js +1 -1
- package/dist/timeline/style.css +10 -75
- package/dist/toast/index.js +1 -1
- package/dist/toast/style.css +10 -67
- package/dist/toggle-button/index.js +2 -2
- package/dist/toggle-button/style.css +10 -67
- package/dist/toolbar/style.css +10 -61
- package/dist/tooltip/style.css +10 -61
- package/dist/tree/index.js +159 -173
- package/dist/tree/style.css +10 -67
- package/dist/tree-select/index.js +200 -213
- package/dist/tree-select/style.css +25 -82
- package/dist/tree-table/index.js +1 -1
- package/dist/tree-table/style.css +10 -67
- package/dist/treeQuery-CnHkyYOA.js +107 -0
- package/dist/virtual-scroller/style.css +10 -69
- package/package.json +1 -1
- package/dist/Button-B5X_R4Md.js +0 -156
- package/dist/Icon-lcN1rS87.js +0 -610
- package/dist/Pagination-CVrH8Ypi.js +0 -158
- package/dist/ProgressSpinner-BeWVF6Jv.js +0 -105
- package/dist/checkStrategy-CZzuUKDI.js +0 -63
- package/dist/components/Icon/icons-tabler.d.ts +0 -77
- package/dist/components/Icon/icons-tabler.d.ts.map +0 -1
- package/dist/icon-DWXkh-RM.js +0 -27
package/dist/popover/style.css
CHANGED
|
@@ -50,6 +50,10 @@
|
|
|
50
50
|
--m-font-size-sm: 0.8125rem;
|
|
51
51
|
--m-font-size-md: 0.875rem;
|
|
52
52
|
--m-font-size-lg: 1.125rem;
|
|
53
|
+
/* Display scale (page titles, KPI figures) */
|
|
54
|
+
--m-font-size-xl: 1.25rem;
|
|
55
|
+
--m-font-size-2xl: 1.5rem;
|
|
56
|
+
--m-font-size-3xl: 1.75rem;
|
|
53
57
|
--m-opacity-disabled: 0.55;
|
|
54
58
|
/* Layering: override --m-z-base via ConfigProvider / createMoryaUI */
|
|
55
59
|
--m-z-base: 1000;
|
|
@@ -192,20 +196,10 @@
|
|
|
192
196
|
|
|
193
197
|
/*
|
|
194
198
|
* Global motion policy (complements per-component rules):
|
|
195
|
-
* - `reduced
|
|
199
|
+
* - `reduced`: keep short paint transitions; stop loops
|
|
196
200
|
* and layout/transform size animation.
|
|
197
201
|
* - `none`: zero all transition/animation durations.
|
|
198
202
|
*/
|
|
199
|
-
@media (prefers-reduced-motion: reduce) {
|
|
200
|
-
html:not([data-m-ignore-reduced-motion]) *,
|
|
201
|
-
html:not([data-m-ignore-reduced-motion]) *::before,
|
|
202
|
-
html:not([data-m-ignore-reduced-motion]) *::after {
|
|
203
|
-
animation-duration: 0.01ms !important;
|
|
204
|
-
animation-iteration-count: 1 !important;
|
|
205
|
-
transition-property: background-color, border-color, color, opacity, box-shadow,
|
|
206
|
-
outline, fill, stroke, stroke-dashoffset !important;
|
|
207
|
-
}
|
|
208
|
-
}
|
|
209
203
|
|
|
210
204
|
[data-m-motion="reduced"] *,
|
|
211
205
|
[data-m-motion="reduced"] *::before,
|
|
@@ -529,9 +523,13 @@
|
|
|
529
523
|
border-radius: var(--m-radius-md);
|
|
530
524
|
box-shadow: var(--m-shadow-md);
|
|
531
525
|
max-height: var(--m-dropdown-submenu-max-height);
|
|
526
|
+
max-width: calc(100vw - 2 * var(--m-space-4));
|
|
532
527
|
min-width: 10rem;
|
|
533
528
|
overflow: hidden;
|
|
534
529
|
padding: var(--m-space-1);
|
|
530
|
+
/* Same as .m-dropdown__menu: size to content instead of being clamped
|
|
531
|
+
by the space left of the anchor in the viewport. */
|
|
532
|
+
width: max-content;
|
|
535
533
|
}
|
|
536
534
|
|
|
537
535
|
.m-dropdown__submenu--teleported {
|
|
@@ -611,7 +609,7 @@
|
|
|
611
609
|
.m-zoom-enter-from,
|
|
612
610
|
.m-zoom-leave-to {
|
|
613
611
|
opacity: 0;
|
|
614
|
-
transform: scale(0.
|
|
612
|
+
transform: scale(0.95);
|
|
615
613
|
}
|
|
616
614
|
|
|
617
615
|
.m-slide-up-enter-active,
|
|
@@ -656,44 +654,6 @@
|
|
|
656
654
|
transform: translateX(calc(var(--m-motion-distance) * -1));
|
|
657
655
|
}
|
|
658
656
|
|
|
659
|
-
@media (prefers-reduced-motion: reduce) {
|
|
660
|
-
html:not([data-m-ignore-reduced-motion]) .m-fade-enter-active,
|
|
661
|
-
html:not([data-m-ignore-reduced-motion]) .m-fade-leave-active,
|
|
662
|
-
html:not([data-m-ignore-reduced-motion]) .m-scale-fade-enter-active,
|
|
663
|
-
html:not([data-m-ignore-reduced-motion]) .m-scale-fade-leave-active,
|
|
664
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-fade-enter-active,
|
|
665
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-fade-leave-active,
|
|
666
|
-
html:not([data-m-ignore-reduced-motion]) .m-zoom-enter-active,
|
|
667
|
-
html:not([data-m-ignore-reduced-motion]) .m-zoom-leave-active,
|
|
668
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-up-enter-active,
|
|
669
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-up-leave-active,
|
|
670
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-down-enter-active,
|
|
671
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-down-leave-active,
|
|
672
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-left-enter-active,
|
|
673
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-left-leave-active,
|
|
674
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-right-enter-active,
|
|
675
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-right-leave-active {
|
|
676
|
-
transition: none;
|
|
677
|
-
}
|
|
678
|
-
|
|
679
|
-
html:not([data-m-ignore-reduced-motion]) .m-scale-fade-enter-from,
|
|
680
|
-
html:not([data-m-ignore-reduced-motion]) .m-scale-fade-leave-to,
|
|
681
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-fade-enter-from,
|
|
682
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-fade-leave-to,
|
|
683
|
-
html:not([data-m-ignore-reduced-motion]) .m-zoom-enter-from,
|
|
684
|
-
html:not([data-m-ignore-reduced-motion]) .m-zoom-leave-to,
|
|
685
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-up-enter-from,
|
|
686
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-up-leave-to,
|
|
687
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-down-enter-from,
|
|
688
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-down-leave-to,
|
|
689
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-left-enter-from,
|
|
690
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-left-leave-to,
|
|
691
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-right-enter-from,
|
|
692
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-right-leave-to {
|
|
693
|
-
transform: none;
|
|
694
|
-
}
|
|
695
|
-
}
|
|
696
|
-
|
|
697
657
|
[data-m-motion="reduced"] .m-fade-enter-active,
|
|
698
658
|
[data-m-motion="reduced"] .m-fade-leave-active,
|
|
699
659
|
[data-m-motion="reduced"] .m-scale-fade-enter-active,
|
|
@@ -1188,17 +1148,6 @@
|
|
|
1188
1148
|
animation: none !important;
|
|
1189
1149
|
}
|
|
1190
1150
|
|
|
1191
|
-
@media (prefers-reduced-motion: reduce) {
|
|
1192
|
-
html:not([data-m-ignore-reduced-motion]) *,
|
|
1193
|
-
html:not([data-m-ignore-reduced-motion]) *::before,
|
|
1194
|
-
html:not([data-m-ignore-reduced-motion]) *::after {
|
|
1195
|
-
animation-duration: 0.01ms !important;
|
|
1196
|
-
animation-iteration-count: 1 !important;
|
|
1197
|
-
scroll-behavior: auto !important;
|
|
1198
|
-
transition-duration: 0.01ms !important;
|
|
1199
|
-
}
|
|
1200
|
-
}
|
|
1201
|
-
|
|
1202
1151
|
/* —— Feedback: Popover —— */
|
|
1203
1152
|
.m-popover {
|
|
1204
1153
|
--m-popover-min-width: 12rem;
|
|
@@ -1217,6 +1166,7 @@
|
|
|
1217
1166
|
box-shadow: var(--m-shadow-md);
|
|
1218
1167
|
color: var(--m-color-text);
|
|
1219
1168
|
min-width: var(--m-popover-min-width);
|
|
1169
|
+
overscroll-behavior: contain;
|
|
1220
1170
|
padding: var(--m-space-3);
|
|
1221
1171
|
position: absolute;
|
|
1222
1172
|
z-index: var(--m-z-popper);
|
|
@@ -1226,51 +1176,60 @@
|
|
|
1226
1176
|
bottom: calc(100% + var(--m-space-2));
|
|
1227
1177
|
left: 50%;
|
|
1228
1178
|
transform: translateX(-50%);
|
|
1179
|
+
transform-origin: bottom center;
|
|
1229
1180
|
}
|
|
1230
1181
|
|
|
1231
1182
|
.m-popover__content--bottom {
|
|
1232
1183
|
left: 50%;
|
|
1233
1184
|
top: calc(100% + var(--m-space-2));
|
|
1234
1185
|
transform: translateX(-50%);
|
|
1186
|
+
transform-origin: top center;
|
|
1235
1187
|
}
|
|
1236
1188
|
|
|
1237
1189
|
.m-popover__content--left {
|
|
1238
1190
|
right: calc(100% + var(--m-space-2));
|
|
1239
1191
|
top: 50%;
|
|
1240
1192
|
transform: translateY(-50%);
|
|
1193
|
+
transform-origin: right center;
|
|
1241
1194
|
}
|
|
1242
1195
|
|
|
1243
1196
|
.m-popover__content--right {
|
|
1244
1197
|
left: calc(100% + var(--m-space-2));
|
|
1245
1198
|
top: 50%;
|
|
1246
1199
|
transform: translateY(-50%);
|
|
1200
|
+
transform-origin: left center;
|
|
1247
1201
|
}
|
|
1248
1202
|
|
|
1249
1203
|
.m-popover__content--right-start {
|
|
1250
1204
|
left: calc(100% + var(--m-space-2));
|
|
1251
1205
|
top: 0;
|
|
1252
1206
|
transform: none;
|
|
1207
|
+
transform-origin: top left;
|
|
1253
1208
|
}
|
|
1254
1209
|
|
|
1255
1210
|
.m-popover__content--left-start {
|
|
1256
1211
|
right: calc(100% + var(--m-space-2));
|
|
1257
1212
|
top: 0;
|
|
1258
1213
|
transform: none;
|
|
1214
|
+
transform-origin: top right;
|
|
1259
1215
|
}
|
|
1260
1216
|
|
|
1261
1217
|
.m-popover__content--bottom-start {
|
|
1262
1218
|
left: 0;
|
|
1263
1219
|
top: calc(100% + var(--m-space-2));
|
|
1220
|
+
transform-origin: top left;
|
|
1264
1221
|
}
|
|
1265
1222
|
|
|
1266
1223
|
.m-popover__content--bottom-end {
|
|
1267
1224
|
right: 0;
|
|
1268
1225
|
top: calc(100% + var(--m-space-2));
|
|
1226
|
+
transform-origin: top right;
|
|
1269
1227
|
}
|
|
1270
1228
|
|
|
1271
1229
|
.m-popover__content--teleported {
|
|
1272
1230
|
bottom: auto;
|
|
1273
1231
|
left: auto;
|
|
1232
|
+
overscroll-behavior: contain;
|
|
1274
1233
|
position: fixed;
|
|
1275
1234
|
right: auto;
|
|
1276
1235
|
top: auto;
|
|
@@ -1295,14 +1254,19 @@
|
|
|
1295
1254
|
opacity: 0;
|
|
1296
1255
|
}
|
|
1297
1256
|
|
|
1257
|
+
.m-popover__content--teleported.m-popover-enter-from,
|
|
1258
|
+
.m-popover__content--teleported.m-popover-leave-to {
|
|
1259
|
+
transform: scale(0.96);
|
|
1260
|
+
}
|
|
1261
|
+
|
|
1298
1262
|
.m-popover-enter-from:not(.m-popover__content--teleported),
|
|
1299
1263
|
.m-popover-leave-to:not(.m-popover__content--teleported) {
|
|
1300
|
-
transform: translateY(calc(var(--m-motion-distance) * -1));
|
|
1264
|
+
transform: translateY(calc(var(--m-motion-distance) * -1)) scale(0.96);
|
|
1301
1265
|
}
|
|
1302
1266
|
|
|
1303
1267
|
.m-popover__content--top.m-popover-enter-from,
|
|
1304
1268
|
.m-popover__content--top.m-popover-leave-to {
|
|
1305
|
-
transform: translate(-50%, calc(-100% - var(--m-motion-distance)));
|
|
1269
|
+
transform: translate(-50%, calc(-100% - var(--m-motion-distance))) scale(0.96);
|
|
1306
1270
|
}
|
|
1307
1271
|
|
|
1308
1272
|
.m-popover__content--bottom.m-popover-enter-from,
|
|
@@ -1311,29 +1275,17 @@
|
|
|
1311
1275
|
.m-popover__content--bottom-start.m-popover-leave-to,
|
|
1312
1276
|
.m-popover__content--bottom-end.m-popover-enter-from,
|
|
1313
1277
|
.m-popover__content--bottom-end.m-popover-leave-to {
|
|
1314
|
-
transform: translateY(var(--m-motion-distance));
|
|
1278
|
+
transform: translateY(var(--m-motion-distance)) scale(0.96);
|
|
1315
1279
|
}
|
|
1316
1280
|
|
|
1317
1281
|
.m-popover__content--left.m-popover-enter-from,
|
|
1318
1282
|
.m-popover__content--left.m-popover-leave-to {
|
|
1319
|
-
transform: translate(calc(-100% - var(--m-motion-distance)), -50%);
|
|
1283
|
+
transform: translate(calc(-100% - var(--m-motion-distance)), -50%) scale(0.96);
|
|
1320
1284
|
}
|
|
1321
1285
|
|
|
1322
1286
|
.m-popover__content--right.m-popover-enter-from,
|
|
1323
1287
|
.m-popover__content--right.m-popover-leave-to {
|
|
1324
|
-
transform: translate(var(--m-motion-distance), -50%);
|
|
1325
|
-
}
|
|
1326
|
-
|
|
1327
|
-
@media (prefers-reduced-motion: reduce) {
|
|
1328
|
-
html:not([data-m-ignore-reduced-motion]) .m-popover-enter-active,
|
|
1329
|
-
html:not([data-m-ignore-reduced-motion]) .m-popover-leave-active {
|
|
1330
|
-
transition: none;
|
|
1331
|
-
}
|
|
1332
|
-
|
|
1333
|
-
html:not([data-m-ignore-reduced-motion]) .m-popover-enter-from,
|
|
1334
|
-
html:not([data-m-ignore-reduced-motion]) .m-popover-leave-to {
|
|
1335
|
-
transform: none;
|
|
1336
|
-
}
|
|
1288
|
+
transform: translate(var(--m-motion-distance), -50%) scale(0.96);
|
|
1337
1289
|
}
|
|
1338
1290
|
|
|
1339
1291
|
[data-m-motion="reduced"] .m-popover-enter-active,
|
|
@@ -50,6 +50,10 @@
|
|
|
50
50
|
--m-font-size-sm: 0.8125rem;
|
|
51
51
|
--m-font-size-md: 0.875rem;
|
|
52
52
|
--m-font-size-lg: 1.125rem;
|
|
53
|
+
/* Display scale (page titles, KPI figures) */
|
|
54
|
+
--m-font-size-xl: 1.25rem;
|
|
55
|
+
--m-font-size-2xl: 1.5rem;
|
|
56
|
+
--m-font-size-3xl: 1.75rem;
|
|
53
57
|
--m-opacity-disabled: 0.55;
|
|
54
58
|
/* Layering: override --m-z-base via ConfigProvider / createMoryaUI */
|
|
55
59
|
--m-z-base: 1000;
|
|
@@ -192,20 +196,10 @@
|
|
|
192
196
|
|
|
193
197
|
/*
|
|
194
198
|
* Global motion policy (complements per-component rules):
|
|
195
|
-
* - `reduced
|
|
199
|
+
* - `reduced`: keep short paint transitions; stop loops
|
|
196
200
|
* and layout/transform size animation.
|
|
197
201
|
* - `none`: zero all transition/animation durations.
|
|
198
202
|
*/
|
|
199
|
-
@media (prefers-reduced-motion: reduce) {
|
|
200
|
-
html:not([data-m-ignore-reduced-motion]) *,
|
|
201
|
-
html:not([data-m-ignore-reduced-motion]) *::before,
|
|
202
|
-
html:not([data-m-ignore-reduced-motion]) *::after {
|
|
203
|
-
animation-duration: 0.01ms !important;
|
|
204
|
-
animation-iteration-count: 1 !important;
|
|
205
|
-
transition-property: background-color, border-color, color, opacity, box-shadow,
|
|
206
|
-
outline, fill, stroke, stroke-dashoffset !important;
|
|
207
|
-
}
|
|
208
|
-
}
|
|
209
203
|
|
|
210
204
|
[data-m-motion="reduced"] *,
|
|
211
205
|
[data-m-motion="reduced"] *::before,
|
|
@@ -529,9 +523,13 @@
|
|
|
529
523
|
border-radius: var(--m-radius-md);
|
|
530
524
|
box-shadow: var(--m-shadow-md);
|
|
531
525
|
max-height: var(--m-dropdown-submenu-max-height);
|
|
526
|
+
max-width: calc(100vw - 2 * var(--m-space-4));
|
|
532
527
|
min-width: 10rem;
|
|
533
528
|
overflow: hidden;
|
|
534
529
|
padding: var(--m-space-1);
|
|
530
|
+
/* Same as .m-dropdown__menu: size to content instead of being clamped
|
|
531
|
+
by the space left of the anchor in the viewport. */
|
|
532
|
+
width: max-content;
|
|
535
533
|
}
|
|
536
534
|
|
|
537
535
|
.m-dropdown__submenu--teleported {
|
|
@@ -611,7 +609,7 @@
|
|
|
611
609
|
.m-zoom-enter-from,
|
|
612
610
|
.m-zoom-leave-to {
|
|
613
611
|
opacity: 0;
|
|
614
|
-
transform: scale(0.
|
|
612
|
+
transform: scale(0.95);
|
|
615
613
|
}
|
|
616
614
|
|
|
617
615
|
.m-slide-up-enter-active,
|
|
@@ -656,44 +654,6 @@
|
|
|
656
654
|
transform: translateX(calc(var(--m-motion-distance) * -1));
|
|
657
655
|
}
|
|
658
656
|
|
|
659
|
-
@media (prefers-reduced-motion: reduce) {
|
|
660
|
-
html:not([data-m-ignore-reduced-motion]) .m-fade-enter-active,
|
|
661
|
-
html:not([data-m-ignore-reduced-motion]) .m-fade-leave-active,
|
|
662
|
-
html:not([data-m-ignore-reduced-motion]) .m-scale-fade-enter-active,
|
|
663
|
-
html:not([data-m-ignore-reduced-motion]) .m-scale-fade-leave-active,
|
|
664
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-fade-enter-active,
|
|
665
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-fade-leave-active,
|
|
666
|
-
html:not([data-m-ignore-reduced-motion]) .m-zoom-enter-active,
|
|
667
|
-
html:not([data-m-ignore-reduced-motion]) .m-zoom-leave-active,
|
|
668
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-up-enter-active,
|
|
669
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-up-leave-active,
|
|
670
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-down-enter-active,
|
|
671
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-down-leave-active,
|
|
672
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-left-enter-active,
|
|
673
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-left-leave-active,
|
|
674
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-right-enter-active,
|
|
675
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-right-leave-active {
|
|
676
|
-
transition: none;
|
|
677
|
-
}
|
|
678
|
-
|
|
679
|
-
html:not([data-m-ignore-reduced-motion]) .m-scale-fade-enter-from,
|
|
680
|
-
html:not([data-m-ignore-reduced-motion]) .m-scale-fade-leave-to,
|
|
681
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-fade-enter-from,
|
|
682
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-fade-leave-to,
|
|
683
|
-
html:not([data-m-ignore-reduced-motion]) .m-zoom-enter-from,
|
|
684
|
-
html:not([data-m-ignore-reduced-motion]) .m-zoom-leave-to,
|
|
685
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-up-enter-from,
|
|
686
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-up-leave-to,
|
|
687
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-down-enter-from,
|
|
688
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-down-leave-to,
|
|
689
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-left-enter-from,
|
|
690
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-left-leave-to,
|
|
691
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-right-enter-from,
|
|
692
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-right-leave-to {
|
|
693
|
-
transform: none;
|
|
694
|
-
}
|
|
695
|
-
}
|
|
696
|
-
|
|
697
657
|
[data-m-motion="reduced"] .m-fade-enter-active,
|
|
698
658
|
[data-m-motion="reduced"] .m-fade-leave-active,
|
|
699
659
|
[data-m-motion="reduced"] .m-scale-fade-enter-active,
|
|
@@ -1188,17 +1148,6 @@
|
|
|
1188
1148
|
animation: none !important;
|
|
1189
1149
|
}
|
|
1190
1150
|
|
|
1191
|
-
@media (prefers-reduced-motion: reduce) {
|
|
1192
|
-
html:not([data-m-ignore-reduced-motion]) *,
|
|
1193
|
-
html:not([data-m-ignore-reduced-motion]) *::before,
|
|
1194
|
-
html:not([data-m-ignore-reduced-motion]) *::after {
|
|
1195
|
-
animation-duration: 0.01ms !important;
|
|
1196
|
-
animation-iteration-count: 1 !important;
|
|
1197
|
-
scroll-behavior: auto !important;
|
|
1198
|
-
transition-duration: 0.01ms !important;
|
|
1199
|
-
}
|
|
1200
|
-
}
|
|
1201
|
-
|
|
1202
1151
|
.m-progressbar {
|
|
1203
1152
|
--m-progressbar-height: var(--m-meter-track-height);
|
|
1204
1153
|
--m-progressbar-track: color-mix(in srgb, var(--m-color-text-muted) 16%, var(--m-color-surface));
|
|
@@ -1270,15 +1219,6 @@
|
|
|
1270
1219
|
}
|
|
1271
1220
|
}
|
|
1272
1221
|
|
|
1273
|
-
@media (prefers-reduced-motion: reduce) {
|
|
1274
|
-
html:not([data-m-ignore-reduced-motion]) .m-progressbar--indeterminate .m-progressbar__fill,
|
|
1275
|
-
html:not([data-m-ignore-reduced-motion])
|
|
1276
|
-
.m-progressbar--indeterminate.m-progressbar--circle
|
|
1277
|
-
.m-progressbar__circle-value {
|
|
1278
|
-
animation: none;
|
|
1279
|
-
}
|
|
1280
|
-
}
|
|
1281
|
-
|
|
1282
1222
|
[data-m-motion="reduced"] .m-progressbar--indeterminate .m-progressbar__fill,
|
|
1283
1223
|
[data-m-motion="reduced"]
|
|
1284
1224
|
.m-progressbar--indeterminate.m-progressbar--circle
|
|
@@ -1,3 +1,106 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { a as e } from "../useComponentAttrs-e-5QAjdw.js";
|
|
2
|
+
import { i as t } from "../types-DGuu4Eg4.js";
|
|
3
|
+
import { t as n } from "../usePauseOffscreen-BIikV_gj.js";
|
|
4
|
+
import { n as r } from "../locale-Bzm2nbEp.js";
|
|
2
5
|
import "./style.js";
|
|
3
|
-
|
|
6
|
+
import { computed as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, defineComponent as c, mergeProps as l, normalizeClass as u, normalizeStyle as d, onBeforeUnmount as f, openBlock as p, ref as m, renderSlot as h, toDisplayString as g, unref as _, useAttrs as v, useSlots as y, watch as b } from "vue";
|
|
7
|
+
//#region src/components/ProgressSpinner/ProgressSpinner.vue?vue&type=script&setup=true&lang.ts
|
|
8
|
+
var x = ["aria-busy"], S = ["inert"], C = {
|
|
9
|
+
key: 0,
|
|
10
|
+
class: "m-progress-spinner-wrap__overlay"
|
|
11
|
+
}, w = ["aria-label"], T = ["stroke-width"], E = {
|
|
12
|
+
key: 0,
|
|
13
|
+
class: "m-progress-spinner__description"
|
|
14
|
+
}, D = ["aria-label"], O = ["stroke-width"], k = /* @__PURE__ */ c({
|
|
15
|
+
inheritAttrs: !1,
|
|
16
|
+
__name: "ProgressSpinner",
|
|
17
|
+
props: {
|
|
18
|
+
pt: {},
|
|
19
|
+
strokeWidth: { default: "2" },
|
|
20
|
+
animationDuration: { default: "1s" },
|
|
21
|
+
ariaLabel: {},
|
|
22
|
+
show: {
|
|
23
|
+
type: Boolean,
|
|
24
|
+
default: !0
|
|
25
|
+
},
|
|
26
|
+
delay: { default: 0 },
|
|
27
|
+
size: {},
|
|
28
|
+
description: {}
|
|
29
|
+
},
|
|
30
|
+
setup(c) {
|
|
31
|
+
let k = c, A = v(), { rootAttrs: j } = e(A, () => k.pt), M = y(), N = r(), P = i(() => k.ariaLabel ?? N.value.loading), F = i(() => !!M.default), I = i(() => t(k.size)), L = m(k.show && k.delay <= 0), R = m(null), { pauseAttrs: z } = n(R, () => L.value), B = null;
|
|
32
|
+
function V() {
|
|
33
|
+
B !== null && (clearTimeout(B), B = null);
|
|
34
|
+
}
|
|
35
|
+
b(() => [
|
|
36
|
+
k.show,
|
|
37
|
+
k.delay,
|
|
38
|
+
F.value
|
|
39
|
+
], ([e, t]) => {
|
|
40
|
+
if (V(), !e) {
|
|
41
|
+
L.value = !1;
|
|
42
|
+
return;
|
|
43
|
+
}
|
|
44
|
+
if (!t) {
|
|
45
|
+
L.value = !0;
|
|
46
|
+
return;
|
|
47
|
+
}
|
|
48
|
+
L.value = !1, B = setTimeout(() => {
|
|
49
|
+
L.value = !0, B = null;
|
|
50
|
+
}, t);
|
|
51
|
+
}, { immediate: !0 }), f(V);
|
|
52
|
+
let H = i(() => ({ animationDuration: k.animationDuration })), U = i(() => ({
|
|
53
|
+
"m-progress-spinner--small": I.value === "small",
|
|
54
|
+
"m-progress-spinner--large": I.value === "large"
|
|
55
|
+
}));
|
|
56
|
+
return (e, t) => F.value ? (p(), o("div", l({
|
|
57
|
+
key: 0,
|
|
58
|
+
ref_key: "rootRef",
|
|
59
|
+
ref: R
|
|
60
|
+
}, {
|
|
61
|
+
..._(j),
|
|
62
|
+
..._(z)
|
|
63
|
+
}, {
|
|
64
|
+
class: ["m-progress-spinner-wrap", { "m-progress-spinner-wrap--active": L.value }],
|
|
65
|
+
"aria-busy": L.value || void 0
|
|
66
|
+
}), [s("div", {
|
|
67
|
+
class: "m-progress-spinner-wrap__content",
|
|
68
|
+
inert: L.value || void 0
|
|
69
|
+
}, [h(e.$slots, "default")], 8, S), L.value ? (p(), o("div", C, [(p(), o("svg", {
|
|
70
|
+
class: u(["m-progress-spinner", U.value]),
|
|
71
|
+
viewBox: "0 0 50 50",
|
|
72
|
+
role: "status",
|
|
73
|
+
"aria-label": P.value,
|
|
74
|
+
style: d(H.value)
|
|
75
|
+
}, [s("circle", {
|
|
76
|
+
class: "m-progress-spinner__circle",
|
|
77
|
+
cx: "25",
|
|
78
|
+
cy: "25",
|
|
79
|
+
r: "20",
|
|
80
|
+
fill: "none",
|
|
81
|
+
"stroke-width": c.strokeWidth
|
|
82
|
+
}, null, 8, T)], 14, w)), c.description ? (p(), o("p", E, g(c.description), 1)) : a("", !0)])) : a("", !0)], 16, x)) : (p(), o("svg", l({
|
|
83
|
+
key: 1,
|
|
84
|
+
ref_key: "rootRef",
|
|
85
|
+
ref: R
|
|
86
|
+
}, {
|
|
87
|
+
..._(j),
|
|
88
|
+
..._(z)
|
|
89
|
+
}, {
|
|
90
|
+
class: ["m-progress-spinner", U.value],
|
|
91
|
+
viewBox: "0 0 50 50",
|
|
92
|
+
role: "status",
|
|
93
|
+
"aria-label": P.value,
|
|
94
|
+
style: H.value
|
|
95
|
+
}), [s("circle", {
|
|
96
|
+
class: "m-progress-spinner__circle",
|
|
97
|
+
cx: "25",
|
|
98
|
+
cy: "25",
|
|
99
|
+
r: "20",
|
|
100
|
+
fill: "none",
|
|
101
|
+
"stroke-width": c.strokeWidth
|
|
102
|
+
}, null, 8, O)], 16, D));
|
|
103
|
+
}
|
|
104
|
+
});
|
|
105
|
+
//#endregion
|
|
106
|
+
export { k as MProgressSpinner };
|
|
@@ -50,6 +50,10 @@
|
|
|
50
50
|
--m-font-size-sm: 0.8125rem;
|
|
51
51
|
--m-font-size-md: 0.875rem;
|
|
52
52
|
--m-font-size-lg: 1.125rem;
|
|
53
|
+
/* Display scale (page titles, KPI figures) */
|
|
54
|
+
--m-font-size-xl: 1.25rem;
|
|
55
|
+
--m-font-size-2xl: 1.5rem;
|
|
56
|
+
--m-font-size-3xl: 1.75rem;
|
|
53
57
|
--m-opacity-disabled: 0.55;
|
|
54
58
|
/* Layering: override --m-z-base via ConfigProvider / createMoryaUI */
|
|
55
59
|
--m-z-base: 1000;
|
|
@@ -192,20 +196,10 @@
|
|
|
192
196
|
|
|
193
197
|
/*
|
|
194
198
|
* Global motion policy (complements per-component rules):
|
|
195
|
-
* - `reduced
|
|
199
|
+
* - `reduced`: keep short paint transitions; stop loops
|
|
196
200
|
* and layout/transform size animation.
|
|
197
201
|
* - `none`: zero all transition/animation durations.
|
|
198
202
|
*/
|
|
199
|
-
@media (prefers-reduced-motion: reduce) {
|
|
200
|
-
html:not([data-m-ignore-reduced-motion]) *,
|
|
201
|
-
html:not([data-m-ignore-reduced-motion]) *::before,
|
|
202
|
-
html:not([data-m-ignore-reduced-motion]) *::after {
|
|
203
|
-
animation-duration: 0.01ms !important;
|
|
204
|
-
animation-iteration-count: 1 !important;
|
|
205
|
-
transition-property: background-color, border-color, color, opacity, box-shadow,
|
|
206
|
-
outline, fill, stroke, stroke-dashoffset !important;
|
|
207
|
-
}
|
|
208
|
-
}
|
|
209
203
|
|
|
210
204
|
[data-m-motion="reduced"] *,
|
|
211
205
|
[data-m-motion="reduced"] *::before,
|
|
@@ -529,9 +523,13 @@
|
|
|
529
523
|
border-radius: var(--m-radius-md);
|
|
530
524
|
box-shadow: var(--m-shadow-md);
|
|
531
525
|
max-height: var(--m-dropdown-submenu-max-height);
|
|
526
|
+
max-width: calc(100vw - 2 * var(--m-space-4));
|
|
532
527
|
min-width: 10rem;
|
|
533
528
|
overflow: hidden;
|
|
534
529
|
padding: var(--m-space-1);
|
|
530
|
+
/* Same as .m-dropdown__menu: size to content instead of being clamped
|
|
531
|
+
by the space left of the anchor in the viewport. */
|
|
532
|
+
width: max-content;
|
|
535
533
|
}
|
|
536
534
|
|
|
537
535
|
.m-dropdown__submenu--teleported {
|
|
@@ -611,7 +609,7 @@
|
|
|
611
609
|
.m-zoom-enter-from,
|
|
612
610
|
.m-zoom-leave-to {
|
|
613
611
|
opacity: 0;
|
|
614
|
-
transform: scale(0.
|
|
612
|
+
transform: scale(0.95);
|
|
615
613
|
}
|
|
616
614
|
|
|
617
615
|
.m-slide-up-enter-active,
|
|
@@ -656,44 +654,6 @@
|
|
|
656
654
|
transform: translateX(calc(var(--m-motion-distance) * -1));
|
|
657
655
|
}
|
|
658
656
|
|
|
659
|
-
@media (prefers-reduced-motion: reduce) {
|
|
660
|
-
html:not([data-m-ignore-reduced-motion]) .m-fade-enter-active,
|
|
661
|
-
html:not([data-m-ignore-reduced-motion]) .m-fade-leave-active,
|
|
662
|
-
html:not([data-m-ignore-reduced-motion]) .m-scale-fade-enter-active,
|
|
663
|
-
html:not([data-m-ignore-reduced-motion]) .m-scale-fade-leave-active,
|
|
664
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-fade-enter-active,
|
|
665
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-fade-leave-active,
|
|
666
|
-
html:not([data-m-ignore-reduced-motion]) .m-zoom-enter-active,
|
|
667
|
-
html:not([data-m-ignore-reduced-motion]) .m-zoom-leave-active,
|
|
668
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-up-enter-active,
|
|
669
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-up-leave-active,
|
|
670
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-down-enter-active,
|
|
671
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-down-leave-active,
|
|
672
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-left-enter-active,
|
|
673
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-left-leave-active,
|
|
674
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-right-enter-active,
|
|
675
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-right-leave-active {
|
|
676
|
-
transition: none;
|
|
677
|
-
}
|
|
678
|
-
|
|
679
|
-
html:not([data-m-ignore-reduced-motion]) .m-scale-fade-enter-from,
|
|
680
|
-
html:not([data-m-ignore-reduced-motion]) .m-scale-fade-leave-to,
|
|
681
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-fade-enter-from,
|
|
682
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-fade-leave-to,
|
|
683
|
-
html:not([data-m-ignore-reduced-motion]) .m-zoom-enter-from,
|
|
684
|
-
html:not([data-m-ignore-reduced-motion]) .m-zoom-leave-to,
|
|
685
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-up-enter-from,
|
|
686
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-up-leave-to,
|
|
687
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-down-enter-from,
|
|
688
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-down-leave-to,
|
|
689
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-left-enter-from,
|
|
690
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-left-leave-to,
|
|
691
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-right-enter-from,
|
|
692
|
-
html:not([data-m-ignore-reduced-motion]) .m-slide-right-leave-to {
|
|
693
|
-
transform: none;
|
|
694
|
-
}
|
|
695
|
-
}
|
|
696
|
-
|
|
697
657
|
[data-m-motion="reduced"] .m-fade-enter-active,
|
|
698
658
|
[data-m-motion="reduced"] .m-fade-leave-active,
|
|
699
659
|
[data-m-motion="reduced"] .m-scale-fade-enter-active,
|
|
@@ -1188,17 +1148,6 @@
|
|
|
1188
1148
|
animation: none !important;
|
|
1189
1149
|
}
|
|
1190
1150
|
|
|
1191
|
-
@media (prefers-reduced-motion: reduce) {
|
|
1192
|
-
html:not([data-m-ignore-reduced-motion]) *,
|
|
1193
|
-
html:not([data-m-ignore-reduced-motion]) *::before,
|
|
1194
|
-
html:not([data-m-ignore-reduced-motion]) *::after {
|
|
1195
|
-
animation-duration: 0.01ms !important;
|
|
1196
|
-
animation-iteration-count: 1 !important;
|
|
1197
|
-
scroll-behavior: auto !important;
|
|
1198
|
-
transition-duration: 0.01ms !important;
|
|
1199
|
-
}
|
|
1200
|
-
}
|
|
1201
|
-
|
|
1202
1151
|
/* —— Feedback: ProgressSpinner —— */
|
|
1203
1152
|
.m-progress-spinner {
|
|
1204
1153
|
--m-progress-spinner-size: calc(var(--m-space-8) + var(--m-space-2));
|
|
@@ -1271,13 +1220,6 @@
|
|
|
1271
1220
|
margin: 0;
|
|
1272
1221
|
}
|
|
1273
1222
|
|
|
1274
|
-
@media (prefers-reduced-motion: reduce) {
|
|
1275
|
-
html:not([data-m-ignore-reduced-motion]) .m-progress-spinner,
|
|
1276
|
-
html:not([data-m-ignore-reduced-motion]) .m-progress-spinner__circle {
|
|
1277
|
-
animation: none;
|
|
1278
|
-
}
|
|
1279
|
-
}
|
|
1280
|
-
|
|
1281
1223
|
[data-m-motion="reduced"] .m-progress-spinner,
|
|
1282
1224
|
[data-m-motion="reduced"] .m-progress-spinner__circle,
|
|
1283
1225
|
[data-m-motion="none"] .m-progress-spinner,
|