@kyralabs/m3e-css 1.4.0 → 1.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/NOTICE CHANGED
@@ -16,17 +16,36 @@ Copyright (C) The Android Open Source Project
16
16
  Licensed under the Apache License, Version 2.0
17
17
 
18
18
  --------------------------------------------------------------------------------
19
- AndroidX Compose Animation (animation-core: spring simulation and duration estimate)
19
+ AndroidX Compose Animation (animation-core: spring simulation and duration estimate, exponential decay)
20
20
  https://android.googlesource.com/platform/frameworks/support/+/19991f2c0858aadfcb442ce02b2c8e4743c96898/compose/animation/animation-core/
21
21
  Copyright (C) The Android Open Source Project
22
22
  Licensed under the Apache License, Version 2.0
23
23
 
24
+ --------------------------------------------------------------------------------
25
+ AndroidX Compose Foundation (anchoredDraggable: the settle target and decay / tween choice)
26
+ https://android.googlesource.com/platform/frameworks/support/+/19991f2c0858aadfcb442ce02b2c8e4743c96898/compose/foundation/foundation/
27
+ Copyright (C) The Android Open Source Project
28
+ Licensed under the Apache License, Version 2.0
29
+
24
30
  --------------------------------------------------------------------------------
25
31
  AndroidX Compose UI Graphics (Matrix: the subset MaterialShapes uses)
26
32
  https://android.googlesource.com/platform/frameworks/support/+/19991f2c0858aadfcb442ce02b2c8e4743c96898/compose/ui/ui-graphics/
27
33
  Copyright (C) The Android Open Source Project
28
34
  Licensed under the Apache License, Version 2.0
29
35
 
36
+ --------------------------------------------------------------------------------
37
+ AndroidX Compose Material3 Adaptive (window size class sets, pane scaffold directive, navigation suite type)
38
+ https://android.googlesource.com/platform/frameworks/support/+/19991f2c0858aadfcb442ce02b2c8e4743c96898/compose/material3/adaptive/
39
+ https://android.googlesource.com/platform/frameworks/support/+/19991f2c0858aadfcb442ce02b2c8e4743c96898/compose/material3/material3-adaptive-navigation-suite/
40
+ Copyright (C) The Android Open Source Project
41
+ Licensed under the Apache License, Version 2.0
42
+
43
+ --------------------------------------------------------------------------------
44
+ AndroidX WindowManager (window-core 1.5.0: WindowSizeClass breakpoints)
45
+ https://android.googlesource.com/platform/frameworks/support/+/19991f2c0858aadfcb442ce02b2c8e4743c96898/window/window-core/
46
+ Copyright (C) The Android Open Source Project
47
+ Licensed under the Apache License, Version 2.0
48
+
30
49
  --------------------------------------------------------------------------------
31
50
  AndroidX graphics-shapes (androidx.graphics:graphics-shapes 1.0.1, sources jar)
32
51
  https://dl.google.com/android/maven2/androidx/graphics/graphics-shapes/1.0.1/graphics-shapes-1.0.1-sources.jar
package/README.md CHANGED
@@ -25,6 +25,11 @@ npm install @kyralabs/m3e-css @kyralabs/m3e-tokens
25
25
  </button>
26
26
  ```
27
27
 
28
+ Canonical layouts (`layout.css`): `.m3e-layout` is a size container; inside it
29
+ `.m3e-pane-scaffold--list-detail` / `--supporting-pane` show one, two or three panes by its width
30
+ (m3.material.io's counts: three from 1600px; add `--compose` for Compose's, three from 1200px;
31
+ `data-destination` picks the single pane) and `.m3e-feed` is the feed grid.
32
+
28
33
  Import a single component with `@kyralabs/m3e-css/<component>.css` (for example `button.css`).
29
34
  Classes follow `.m3e-<component>`, `__<part>` and `--<modifier>`.
30
35
 
@@ -1 +1 @@
1
- @layer m3e.base{:where(.m3e-focus-ring,.m3e-button,.m3e-icon-button,.m3e-assist-chip,.m3e-fab,.m3e-extended-fab,.m3e-fab-menu__item):focus-visible{outline:var(--m3e-sys-state-focus-indicator-thickness) solid var(--m3e-sys-color-secondary);outline-offset:var(--m3e-sys-state-focus-indicator-outer-offset)}:where(.m3e-card--interactive):has(.m3e-card__action:focus-visible){outline:var(--m3e-sys-state-focus-indicator-thickness) solid var(--m3e-sys-color-secondary);outline-offset:var(--m3e-sys-state-focus-indicator-outer-offset)}:where(.m3e-navigation-item:focus-visible .m3e-navigation-item__state){outline:var(--m3e-sys-state-focus-indicator-thickness) solid var(--m3e-sys-color-secondary);outline-offset:var(--m3e-sys-state-focus-indicator-outer-offset)}:where(.m3e-focus-ring--inward):focus-visible{outline-offset:var(--m3e-sys-state-focus-indicator-inner-offset)}:where(.m3e-menu__item):focus-visible{outline:var(--m3e-sys-state-focus-indicator-thickness) solid var(--m3e-sys-color-secondary);outline-offset:var(--m3e-sys-state-focus-indicator-inner-offset)}:where(.m3e-menu__item):focus:not(:focus-visible){outline:none}:where(.m3e-search__field):has(.m3e-search__input:focus-visible),:where(.m3e-search__result)[data-focus-visible]{outline:var(--m3e-sys-state-focus-indicator-thickness) solid var(--m3e-sys-color-secondary);outline-offset:var(--m3e-sys-state-focus-indicator-inner-offset)}:where(.m3e-focus-ring,.m3e-button,.m3e-icon-button,.m3e-assist-chip,.m3e-fab,.m3e-extended-fab,.m3e-fab-menu__item):focus:not(:focus-visible){outline:none}@media(forced-colors:active){:where(.m3e-focus-ring,.m3e-button,.m3e-icon-button,.m3e-assist-chip,.m3e-fab,.m3e-extended-fab,.m3e-fab-menu__item):focus-visible,:where(.m3e-card--interactive):has(.m3e-card__action:focus-visible),:where(.m3e-navigation-item:focus-visible .m3e-navigation-item__state),:where(.m3e-menu__item):focus-visible,:where(.m3e-search__field):has(.m3e-search__input:focus-visible),:where(.m3e-search__result)[data-focus-visible]{outline-color:Highlight}}}
1
+ @layer m3e.base{:where(.m3e-focus-ring,.m3e-button,.m3e-icon-button,.m3e-assist-chip,.m3e-fab,.m3e-extended-fab,.m3e-fab-menu__item,.m3e-pane-scaffold__drag-handle):focus-visible{outline:var(--m3e-sys-state-focus-indicator-thickness) solid var(--m3e-sys-color-secondary);outline-offset:var(--m3e-sys-state-focus-indicator-outer-offset)}:where(.m3e-card--interactive):has(.m3e-card__action:focus-visible){outline:var(--m3e-sys-state-focus-indicator-thickness) solid var(--m3e-sys-color-secondary);outline-offset:var(--m3e-sys-state-focus-indicator-outer-offset)}:where(.m3e-navigation-item:focus-visible .m3e-navigation-item__state){outline:var(--m3e-sys-state-focus-indicator-thickness) solid var(--m3e-sys-color-secondary);outline-offset:var(--m3e-sys-state-focus-indicator-outer-offset)}:where(.m3e-focus-ring--inward):focus-visible{outline-offset:var(--m3e-sys-state-focus-indicator-inner-offset)}:where(.m3e-menu__item,.m3e-navigation-drawer-item,.m3e-tab,.m3e-tab-panel,.m3e-pane-scaffold__pane):focus-visible{outline:var(--m3e-sys-state-focus-indicator-thickness) solid var(--m3e-sys-color-secondary);outline-offset:var(--m3e-sys-state-focus-indicator-inner-offset)}:where(.m3e-menu__item,.m3e-navigation-drawer-item,.m3e-tab,.m3e-tab-panel,.m3e-pane-scaffold__pane):focus:not(:focus-visible){outline:none}:where(.m3e-search__field):has(.m3e-search__input:focus-visible),:where(.m3e-search__result)[data-focus-visible]{outline:var(--m3e-sys-state-focus-indicator-thickness) solid var(--m3e-sys-color-secondary);outline-offset:var(--m3e-sys-state-focus-indicator-inner-offset)}:where(.m3e-focus-ring,.m3e-button,.m3e-icon-button,.m3e-assist-chip,.m3e-fab,.m3e-extended-fab,.m3e-fab-menu__item,.m3e-pane-scaffold__drag-handle):focus:not(:focus-visible){outline:none}@media(forced-colors:active){:where(.m3e-focus-ring,.m3e-button,.m3e-icon-button,.m3e-assist-chip,.m3e-fab,.m3e-extended-fab,.m3e-fab-menu__item,.m3e-pane-scaffold__drag-handle):focus-visible,:where(.m3e-card--interactive):has(.m3e-card__action:focus-visible),:where(.m3e-navigation-item:focus-visible .m3e-navigation-item__state),:where(.m3e-menu__item,.m3e-navigation-drawer-item,.m3e-tab,.m3e-tab-panel,.m3e-pane-scaffold__pane):focus-visible,:where(.m3e-search__field):has(.m3e-search__input:focus-visible),:where(.m3e-search__result)[data-focus-visible]{outline-color:Highlight}}}