morya-ui 0.3.0 → 0.3.2

package/dist/components/Page/styles.css

@@ -1,5 +1,13 @@
-/* —— Layout: Page —— */
+/* —— Layout: Page ——
+ * Surface contract (kept in sync with Card / Table / controls):
+ * - Page chrome stays flat: whitespace and type hierarchy, not a second kit.
+ * - Recessive bands (filled filters, muted section) = Table-header fill, no radius.
+ * - Elevated surfaces reuse Card: surface + 1px border + radius-lg, same padding.
+ * - Never invent glow, dashed frames, or pill chips on Ops page chrome.
+ */
 .m-page-content {
+    --m-page-content-body-lead: var(--m-space-2);
+    --m-page-content-tools-pull: var(--m-space-2);
     box-sizing: border-box;
     display: flex;
     flex-direction: column;
@@ -9,33 +17,120 @@
     width: 100%;
 }
 
+.m-page-content > .m-page-header + :is(.m-page-filters, .m-page-toolbar) {
+    margin-top: calc(var(--m-space-1) - var(--m-page-content-gap, var(--m-space-4)));
+}
+
+.m-page-content > .m-page-filters + .m-page-toolbar {
+    margin-top: calc(var(--m-page-content-tools-pull) * -1);
+}
+
+.m-page-content
+    > :is(.m-page-filters, .m-page-toolbar)
+    + :is(.m-table, .m-grid, .m-page-section:not(.m-page-section--actions)) {
+    margin-top: var(--m-page-content-body-lead);
+}
+
 .m-page-content--compact {
+    --m-page-content-body-lead: var(--m-space-1);
+    --m-page-content-gap: var(--m-space-3);
     --m-page-content-padding: var(--m-space-4);
+    --m-page-content-tools-pull: var(--m-space-1);
 }
 
 .m-page-content--spacious {
+    --m-page-content-body-lead: var(--m-space-4);
     --m-page-content-gap: var(--m-space-6);
+    --m-page-content-tools-pull: var(--m-space-3);
 }
 
 .m-page-content--narrow {
     max-width: 42rem;
 }
 
+.m-page-content--bands-uniform {
+    --m-page-content-body-lead: 0;
+    --m-page-content-tools-pull: 0;
+}
+
+.m-page-content--bands-uniform > .m-page-header + :is(.m-page-filters, .m-page-toolbar) {
+    margin-top: 0;
+}
+
+.m-page-content--bands-uniform
+    > :is(.m-page-filters, .m-page-toolbar)
+    + :is(.m-table, .m-grid, .m-page-section:not(.m-page-section--actions)) {
+    margin-top: 0;
+}
+
 .m-page-filters {
-    background: color-mix(in srgb, var(--m-color-border) 25%, transparent);
-    border: var(--m-border-width) solid var(--m-color-border);
-    border-radius: var(--m-radius-md);
     box-sizing: border-box;
-    padding: var(--m-space-4);
+    display: grid;
+    gap: var(--m-space-3);
     width: 100%;
 }
 
+.m-page-filters__row {
+    align-items: flex-start;
+    display: flex;
+    flex-wrap: wrap;
+    gap: var(--m-space-3);
+    justify-content: space-between;
+    width: 100%;
+}
+
+.m-page-filters__controls {
+    flex: 1 1 auto;
+    min-width: 0;
+}
+
+.m-page-filters__toggle {
+    flex-shrink: 0;
+}
+
+.m-page-filters__advanced {
+    width: 100%;
+}
+
+.m-page-filters--filled {
+    background: var(--m-color-fill-light);
+    padding: var(--m-space-3) var(--m-space-4);
+}
+
+.m-page-filters--filled .m-page-filters__advanced {
+    padding-top: var(--m-space-1);
+}
+
+.m-page-filter-chips {
+    align-items: center;
+    display: flex;
+    flex-wrap: wrap;
+    gap: var(--m-space-2);
+    width: 100%;
+}
+
+.m-page-filter-chips__label {
+    color: var(--m-color-text-muted);
+    flex-shrink: 0;
+    font-size: var(--m-font-size-sm);
+    line-height: 1.4;
+}
+
+.m-page-filter-chips__items {
+    align-items: center;
+    display: flex;
+    flex: 1 1 auto;
+    flex-wrap: wrap;
+    gap: var(--m-space-2);
+    min-width: 0;
+}
+
 .m-page-toolbar {
     align-items: center;
     box-sizing: border-box;
     display: flex;
     flex-wrap: wrap;
-    gap: var(--m-space-4);
+    gap: var(--m-space-3);
     justify-content: space-between;
     width: 100%;
 }
@@ -43,8 +138,9 @@
 .m-page-toolbar__title {
     color: var(--m-color-text);
     font-family: var(--m-font-sans);
-    font-size: var(--m-font-size-lg);
+    font-size: var(--m-font-size-md);
     font-weight: 600;
+    line-height: 1.4;
     margin: 0;
 }
 
@@ -52,20 +148,34 @@
     align-items: center;
     display: flex;
     flex-wrap: wrap;
-    gap: var(--m-space-3);
+    gap: var(--m-space-2);
+    margin-left: auto;
 }
 
 .m-page-header {
+    align-items: flex-start;
     box-sizing: border-box;
     display: flex;
     flex-wrap: wrap;
-    gap: var(--m-space-4);
+    gap: var(--m-space-3);
     justify-content: space-between;
     width: 100%;
 }
 
 .m-page-header__main {
     display: grid;
+    gap: var(--m-space-1);
+    min-width: 0;
+}
+
+.m-page-header__breadcrumb {
+    margin: 0 0 var(--m-space-1);
+}
+
+.m-page-header__heading {
+    align-items: center;
+    display: flex;
+    flex-wrap: wrap;
     gap: var(--m-space-2);
     min-width: 0;
 }
@@ -73,22 +183,34 @@
 .m-page-header__title {
     color: var(--m-color-text);
     font-family: var(--m-font-sans);
-    font-size: var(--m-font-size-lg);
+    font-size: var(--m-font-size-xl);
     font-weight: 600;
+    letter-spacing: -0.01em;
+    line-height: 1.4;
     margin: 0;
 }
 
+.m-page-header__tags {
+    align-items: center;
+    display: inline-flex;
+    flex-wrap: wrap;
+    gap: var(--m-space-2);
+}
+
 .m-page-header__description {
     color: var(--m-color-text-muted);
     font-size: var(--m-font-size-md);
+    line-height: 1.55;
     margin: 0;
+    max-width: 65ch;
 }
 
 .m-page-header__actions {
     align-items: center;
     display: flex;
+    flex-shrink: 0;
     flex-wrap: wrap;
-    gap: var(--m-space-3);
+    gap: var(--m-space-2);
 }
 
 .m-page-section {
@@ -96,66 +218,101 @@
     width: 100%;
 }
 
+.m-page-section__header {
+    align-items: center;
+    display: flex;
+    flex-wrap: wrap;
+    gap: var(--m-space-3);
+    justify-content: space-between;
+    margin: 0 0 var(--m-space-3);
+}
+
 .m-page-section__title {
     color: var(--m-color-text);
     font-size: var(--m-font-size-md);
     font-weight: 600;
-    margin: 0 0 var(--m-space-3);
+    line-height: 1.4;
+    margin: 0;
+}
+
+.m-page-section__actions {
+    align-items: center;
+    display: flex;
+    flex-wrap: wrap;
+    gap: var(--m-space-2);
 }
 
 .m-page-section--muted {
-    background: color-mix(in srgb, var(--m-color-border) 25%, transparent);
-    border: var(--m-border-width) solid var(--m-color-border);
-    border-radius: var(--m-radius-md);
+    background: var(--m-color-fill-light);
     padding: var(--m-space-4);
 }
 
-.m-page-section--form {
-    background: var(--m-color-surface);
-    border: var(--m-border-width) solid var(--m-color-border);
-    border-radius: var(--m-radius-md);
-    box-shadow: var(--m-shadow-sm);
-    padding: var(--m-space-6);
+.m-page-section--form .m-page-section__header {
+    margin: 0;
+    width: 100%;
 }
 
 .m-page-section--actions {
     border-top: var(--m-border-width) solid var(--m-color-border);
-    margin-top: var(--m-space-6);
+    margin-top: var(--m-space-4);
     padding-top: var(--m-space-4);
 }
 
-.m-page-stat {
-    box-shadow: var(--m-shadow-sm);
-}
-
 .m-page-stat__body {
-    align-items: center;
+    align-items: flex-start;
     display: flex;
-    gap: var(--m-space-4);
+    gap: var(--m-space-3);
     justify-content: space-between;
 }
 
+.m-page-stat__content {
+    display: grid;
+    gap: var(--m-space-1);
+    justify-items: start;
+    min-width: 0;
+}
+
 .m-page-stat__label {
     color: var(--m-color-text-muted);
     font-size: var(--m-font-size-sm);
+    line-height: 1.4;
     margin: 0;
 }
 
 .m-page-stat__value {
-    --m-page-stat-value-size: 1.5rem;
+    --m-page-stat-value-size: var(--m-font-size-2xl);
     color: var(--m-color-text);
     font-family: var(--m-font-sans);
     font-size: var(--m-page-stat-value-size);
-    font-weight: 700;
-    line-height: 1.2;
-    margin: var(--m-space-1) 0;
+    font-variant-numeric: tabular-nums;
+    font-weight: 600;
+    letter-spacing: -0.01em;
+    line-height: 1.25;
+    margin: 0;
+}
+
+.m-page-stat__meta {
+    align-items: center;
+    display: flex;
+    flex-wrap: wrap;
+    gap: var(--m-space-2);
 }
 
 .m-page-stat__trend {
+    align-items: center;
+    display: inline-flex;
     font-size: var(--m-font-size-sm);
+    font-weight: 500;
+    gap: var(--m-space-1);
+    line-height: 1.25;
     margin: 0;
 }
 
+.m-page-stat__trend .m-page-stat__trend-icon {
+    height: var(--m-font-size-sm);
+    width: var(--m-font-size-sm);
+}
+
 .m-page-stat__trend--primary {
     color: var(--m-color-primary);
 }
@@ -176,24 +333,62 @@
     color: var(--m-color-text-muted);
 }
 
+.m-page-stat__trend-label {
+    color: var(--m-color-text-muted);
+    font-size: var(--m-font-size-sm);
+}
+
 .m-page-stat__icon {
-    color: var(--m-color-primary);
+    align-items: center;
+    color: var(--m-color-text-muted);
+    display: inline-flex;
     flex-shrink: 0;
-    opacity: 0.85;
+    justify-content: center;
+}
+
+.m-page-stat__icon :is(.m-icon, svg) {
+    display: block;
+    height: 1.25rem;
+    width: 1.25rem;
+}
+
+.m-page-stat--compact .m-page-stat__value {
+    --m-page-stat-value-size: var(--m-font-size-xl);
+}
+
+.m-page-stat--compact .m-page-stat__icon :is(.m-icon, svg) {
+    height: 1rem;
+    width: 1rem;
+}
+
+.m-page-stat--plain {
+    padding: var(--m-space-2) 0;
+}
+
+.m-page-stat--inline .m-page-stat__content {
+    align-items: baseline;
+    display: flex;
+    flex-wrap: wrap;
+    gap: var(--m-space-2) var(--m-space-3);
+    row-gap: var(--m-space-1);
+}
+
+.m-page-stat--inline .m-page-stat__label {
+    margin: 0;
+}
+
+.m-page-stat--inline .m-page-stat__meta {
+    flex-basis: 100%;
 }
 
 .m-page-placeholder {
-    align-items: center;
-    background: color-mix(in srgb, var(--m-color-border) 15%, transparent);
-    border: var(--m-border-width) dashed var(--m-color-border);
-    border-radius: var(--m-radius-md);
     box-sizing: border-box;
-    color: var(--m-color-text-muted);
-    display: grid;
-    font-size: var(--m-font-size-sm);
-    justify-items: center;
+    display: flex;
     min-height: var(--m-page-placeholder-min-height, 12rem);
-    padding: var(--m-space-4);
-    text-align: center;
     width: 100%;
 }
+
+.m-page-placeholder__empty {
+    flex: 1;
+    min-width: 0;
+}

package/dist/components/Page/types.d.ts

@@ -1,20 +1,47 @@
 import { RootPassThrough } from '../../shared/passThrough';
+import { CardShadow } from '../Card/types';
 import { IconName } from '../Icon/icons';
 export type PageContentDensity = 'default' | 'compact' | 'spacious';
 export type PageContentWidth = 'full' | 'narrow';
+/** `auto` tightens header/filter/toolbar/table bands; `uniform` uses gap only. */
+export type PageContentBands = 'auto' | 'uniform';
+export type PageFiltersVariant = 'plain' | 'filled';
+export type PageStatLayout = 'card' | 'plain';
+export type PageStatDensity = 'default' | 'compact';
+export type PageStatOrientation = 'stacked' | 'inline';
 export type PageSectionVariant = 'default' | 'muted' | 'form' | 'actions';
 export type PageStatTrendSeverity = 'primary' | 'success' | 'warn' | 'danger' | 'secondary';
+export type PageStatTrendDirection = 'up' | 'down';
 export interface PageContentProps {
     pt?: RootPassThrough;
     /** Vertical spacing between direct children. */
     density?: PageContentDensity;
     /** `narrow` caps width for form-like pages (~42rem). */
     width?: PageContentWidth;
+    /** Band spacing rhythm between header, filters, toolbar, and body. */
+    bands?: PageContentBands;
 }
 export interface PageFiltersProps {
     pt?: RootPassThrough;
     /** Accessible name for the filter region. */
     ariaLabel?: string;
+    /** Surface treatment. `plain` (default) is borderless; `filled` uses the same fill as Table header. */
+    variant?: PageFiltersVariant;
+    /** When true, `#advanced` is shown only while expanded. */
+    collapsible?: boolean;
+    /** Collapsible open state (v-model). */
+    expanded?: boolean;
+    /** Toggle button label when collapsed. */
+    expandLabel?: string;
+    /** Toggle button label when expanded. */
+    collapseLabel?: string;
+}
+export interface PageFilterChipsProps {
+    pt?: RootPassThrough;
+    /** Optional muted prefix, e.g. “已选”. */
+    label?: string;
+    /** Accessible name for the active-filter list. */
+    ariaLabel?: string;
 }
 export interface PageToolbarProps {
     pt?: RootPassThrough;
@@ -41,7 +68,20 @@ export interface PageStatProps {
     value?: string | number;
     trend?: string;
     trendSeverity?: PageStatTrendSeverity;
+    /** Renders a direction arrow beside the trend text. */
+    trendDirection?: PageStatTrendDirection;
+    /** Muted suffix after the trend, e.g. "较上月". */
+    trendLabel?: string;
     icon?: IconName;
+    /** Show skeleton placeholders instead of value and trend. */
+    loading?: boolean;
+    /** Card elevation shadow; defaults to `always`. */
+    shadow?: CardShadow;
+    /** `plain` drops the Card shell (e.g. dense dashboard strip). */
+    layout?: PageStatLayout;
+    density?: PageStatDensity;
+    /** `inline` keeps label and value on one row. */
+    orientation?: PageStatOrientation;
 }
 export interface PagePlaceholderProps {
     pt?: RootPassThrough;

package/dist/components/Page/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Page/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAA;AAC/D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAE7C,MAAM,MAAM,kBAAkB,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,CAAA;AACnE,MAAM,MAAM,gBAAgB,GAAG,MAAM,GAAG,QAAQ,CAAA;AAChD,MAAM,MAAM,kBAAkB,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,CAAA;AACzE,MAAM,MAAM,qBAAqB,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,QAAQ,GAAG,WAAW,CAAA;AAE3F,MAAM,WAAW,gBAAgB;IAC/B,EAAE,CAAC,EAAE,eAAe,CAAA;IACpB,gDAAgD;IAChD,OAAO,CAAC,EAAE,kBAAkB,CAAA;IAC5B,wDAAwD;IACxD,KAAK,CAAC,EAAE,gBAAgB,CAAA;CACzB;AAED,MAAM,WAAW,gBAAgB;IAC/B,EAAE,CAAC,EAAE,eAAe,CAAA;IACpB,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,MAAM,WAAW,gBAAgB;IAC/B,EAAE,CAAC,EAAE,eAAe,CAAA;IACpB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;CACrC;AAED,MAAM,WAAW,eAAe;IAC9B,EAAE,CAAC,EAAE,eAAe,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;CACrC;AAED,MAAM,WAAW,gBAAgB;IAC/B,EAAE,CAAC,EAAE,eAAe,CAAA;IACpB,iDAAiD;IACjD,OAAO,CAAC,EAAE,kBAAkB,CAAA;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;CACjC;AAED,MAAM,WAAW,aAAa;IAC5B,EAAE,CAAC,EAAE,eAAe,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,aAAa,CAAC,EAAE,qBAAqB,CAAA;IACrC,IAAI,CAAC,EAAE,QAAQ,CAAA;CAChB;AAED,MAAM,WAAW,oBAAoB;IACnC,EAAE,CAAC,EAAE,eAAe,CAAA;IACpB,sDAAsD;IACtD,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,wDAAwD;IACxD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAC5B"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Page/types.ts"],"names":[],"mappings":"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"}

package/dist/components/Pagination/Pagination.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/Pagination.vue"],"names":[],"mappings":";AAmIA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AA8Q9C,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;6EAKhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
+{"version":3,"file":"Pagination.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/Pagination.vue"],"names":[],"mappings":";AA8IA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAsS9C,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;6EAKhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/components/Pagination/styles.css

@@ -1,6 +1,6 @@
 .m-pagination {
     --m-pagination-simple-width: 3.5rem;
-    --m-pagination-jumper-width: 3.5rem;
+    --m-pagination-jumper-width: 5.5rem;
     align-items: center;
     display: flex;
     font-family: var(--m-font-sans);
@@ -69,8 +69,7 @@
     margin-left: var(--m-space-2);
 }
 
-.m-pagination__select,
-.m-pagination__input {
+.m-pagination__select {
     background: var(--m-color-surface);
     border: var(--m-border-width) solid var(--m-color-border);
     border-radius: var(--m-radius-control);
@@ -85,24 +84,22 @@
         opacity var(--m-motion-fast) var(--m-motion-ease);
 }
 
-.m-pagination__select:hover:not(:disabled),
-.m-pagination__input:hover:not(:disabled):not(:focus) {
+.m-pagination__select:hover:not(:disabled) {
     border-color: var(--m-color-primary-hover);
 }
 
-.m-pagination__select:focus-visible,
-.m-pagination__input:focus-visible {
+.m-pagination__select:focus-visible {
     border-color: var(--m-color-primary-hover);
     box-shadow: var(--m-focus-shadow);
     outline: none;
 }
 
-.m-pagination__select:disabled,
-.m-pagination__input:disabled {
+.m-pagination__select:disabled {
     cursor: not-allowed;
     opacity: var(--m-opacity-disabled);
 }
 
-.m-pagination__input {
+.m-pagination__jumper-select {
+    min-width: var(--m-pagination-jumper-width);
     width: var(--m-pagination-jumper-width);
 }

package/dist/components/Pagination/types.d.ts

@@ -13,7 +13,7 @@ export interface PaginationProps {
     showSizePicker?: boolean;
     /** Options for `showSizePicker`. */
     pageSizes?: number[];
-    /** Jump-to-page input. */
+    /** Jump to a page with a page select. */
     showQuickJumper?: boolean;
     /** Compact prev / current / next. */
     simple?: boolean;

package/dist/components/Pagination/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAA;AAC/D,MAAM,WAAW,eAAe;IAC9B,EAAE,CAAC,EAAE,eAAe,CAAA;IACpB,kDAAkD;IAClD,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,YAAY,EAAE,MAAM,CAAA;IACpB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,mCAAmC;IACnC,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,EAAE,CAAA;IACpB,0BAA0B;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,qCAAqC;IACrC,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB;AAED,MAAM,WAAW,eAAe;IAC9B,CAAC,KAAK,EAAE,mBAAmB,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IACjD,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IACpC,CAAC,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3C,CAAC,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;CAChD;AAED,MAAM,WAAW,kBAAkB;IACjC,qFAAqF;IACrF,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,EAAE,MAAM,CAAA;CAClB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAA;AAC/D,MAAM,WAAW,eAAe;IAC9B,EAAE,CAAC,EAAE,eAAe,CAAA;IACpB,kDAAkD;IAClD,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,YAAY,EAAE,MAAM,CAAA;IACpB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,mCAAmC;IACnC,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,EAAE,CAAA;IACpB,yCAAyC;IACzC,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,qCAAqC;IACrC,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB;AAED,MAAM,WAAW,eAAe;IAC9B,CAAC,KAAK,EAAE,mBAAmB,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IACjD,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IACpC,CAAC,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3C,CAAC,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;CAChD;AAED,MAAM,WAAW,kBAAkB;IACjC,qFAAqF;IACrF,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,EAAE,MAAM,CAAA;CAClB"}

package/dist/components/Panel/styles.css

@@ -77,13 +77,6 @@
     opacity: 0;
 }
 
-@media (prefers-reduced-motion: reduce) {
-    html:not([data-m-ignore-reduced-motion]) .m-panel-collapse-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-panel-collapse-leave-active {
-        transition: none;
-    }
-}
-
 [data-m-motion="reduced"] .m-panel-collapse-enter-active,
 [data-m-motion="reduced"] .m-panel-collapse-leave-active,
 [data-m-motion="none"] .m-panel-collapse-enter-active,