@mlola-ui/engine 1.1.10 → 1.1.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -202,6 +202,7 @@ correct. This table is read out of the stylesheet, so it is never stale.
202
202
  | `.ml-dropdown-item` | `data-danger` | _presence only_ |
203
203
  | `.ml-dropdown-item` | `data-highlighted` | _presence only_ |
204
204
  | `.ml-dropdown-menu` | `data-align` | `end` |
205
+ | `.ml-dropdown-menu` | `data-side` | `top` |
205
206
  | `.ml-dropdown-trigger` | `aria-expanded` | `true` |
206
207
  | `.ml-dropzone` | `aria-disabled` | _presence only_ |
207
208
  | `.ml-dropzone` | `data-dragging` | _presence only_ |
@@ -221,6 +221,9 @@
221
221
  "ml-dropdown-menu": {
222
222
  "data-align": [
223
223
  "end"
224
+ ],
225
+ "data-side": [
226
+ "top"
224
227
  ]
225
228
  },
226
229
  "ml-dropdown-trigger": {
@@ -1486,6 +1486,20 @@
1486
1486
  text-decoration: none;
1487
1487
  }
1488
1488
 
1489
+ /* A fingertip's target. The link clips its own text for the ellipsis, which
1490
+ would clip the invisible target data-hit="expand" draws around it, so on a
1491
+ touch screen the link itself grows instead, without moving the bar. */
1492
+ @media (pointer: coarse) {
1493
+ .ml-breadcrumb-link {
1494
+ padding-block: var(--ml-space-2);
1495
+ margin-block: calc(-1 * var(--ml-space-2));
1496
+ }
1497
+
1498
+ .ml-breadcrumb-link::after {
1499
+ inset: 0;
1500
+ }
1501
+ }
1502
+
1489
1503
  button.ml-breadcrumb-link {
1490
1504
  padding: 0;
1491
1505
  border: 0;
@@ -3095,6 +3109,23 @@ button.ml-breadcrumb-link {
3095
3109
  .ml-dropdown-menu[data-align="end"] {
3096
3110
  right: 0;
3097
3111
  left: auto;
3112
+ transform-origin: top right;
3113
+ }
3114
+
3115
+ /* Kept on screen by fitMenu: slid sideways, and above the trigger when
3116
+ there is no room below. */
3117
+ .ml-dropdown-menu {
3118
+ translate: var(--ml-dropdown-shift, 0) 0;
3119
+ }
3120
+
3121
+ .ml-dropdown-menu[data-side="top"] {
3122
+ top: auto;
3123
+ bottom: calc(100% + var(--ml-space-1-5));
3124
+ transform-origin: bottom left;
3125
+ }
3126
+
3127
+ .ml-dropdown-menu[data-side="top"][data-align="end"] {
3128
+ transform-origin: bottom right;
3098
3129
  }
3099
3130
 
3100
3131
  .ml-dropdown-label {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mlola-ui/engine",
3
- "version": "1.1.10",
3
+ "version": "1.1.11",
4
4
  "description": "Framework-free CSS, spring easings, and the machine-readable contract for Mlola UI",
5
5
  "type": "module",
6
6
  "sideEffects": [