mlola-ui 1.0.11 → 1.0.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mlola-ui",
-  "version": "1.0.11",
+  "version": "1.0.13",
   "description": "Source-copy CLI that writes framework-free Mlola UI items into your project",
   "type": "module",
   "bin": {

package/registry/agents.json

@@ -341,7 +341,7 @@
     },
     {
       "name": "ml-page-shell",
-      "note": "A full page: header, main and footer stacked on the page background."
+      "note": "The navigation, main and footer are grid items; they may be narrower than their widest content (a table that scrolls), so the page never does."
     },
     {
       "name": "ml-person",

package/registry/agents.md

@@ -131,7 +131,7 @@ component, so a page built from them themes with the rest.
 
 - `.ml-check-list` — A list of benefits, each after a check. Pricing tiers and feature rows share it.
 - `.ml-link` — A glyph inside a link flows with the text instead of breaking the line.
-- `.ml-page-shell` — A full page: header, main and footer stacked on the page background.
+- `.ml-page-shell` — The navigation, main and footer are grid items; they may be narrower than their widest content (a table that scrolls), so the page never does.
 - `.ml-section` — A section a link jumps to clears the sticky navigation bar.
 
 ## Elements and their attributes
@@ -168,6 +168,7 @@ correct. This table is read out of the stylesheet, so it is never stale.
 | `.ml-calendar-day` | `data-unreachable` | _presence only_ |
 | `.ml-card` | `data-interactive` | _presence only_ |
 | `.ml-card` | `data-variant` | `elevated`, `glass`, `specular` |
+| `.ml-carousel` | `data-arrows` | _presence only_ |
 | `.ml-carousel` | `data-playing` | _presence only_ |
 | `.ml-carousel-arrow` | `data-side` | `next`, `previous` |
 | `.ml-carousel-dot` | `aria-current` | `true` |

package/registry/assets.json

@@ -433,14 +433,14 @@
         {
           "path": "empty-cart.svg",
           "role": "source",
-          "bytes": 4968,
-          "integrity": "sha256-D0zyZvimuFagUT0ChqyBNp2hsCjAZ4Pv7RW6cJ37gcE="
+          "bytes": 4982,
+          "integrity": "sha256-8m4Z0HWSI7KRjDc6MSHRrCI1HwbiyynBmoxgCyo2DDw="
         },
         {
           "path": "empty-cart.tsx",
           "role": "react",
-          "bytes": 5920,
-          "integrity": "sha256-fapGlGqTLVX54EYazXYKN+vxVbbYN9RP3t4qDLnN1/g="
+          "bytes": 5934,
+          "integrity": "sha256-CFip8M6D6RJdYVGIwQ6H3HwWek/dHTq9ON98SeHjS4Q="
         }
       ]
     },
@@ -604,7 +604,7 @@
       "id": "inventory",
       "kind": "2d",
       "title": "Inventory",
-      "summary": "Shelved parcels with labels, counted slots and an active stock marker.",
+      "summary": "An open shelf of labeled parcels, one empty slot and a tag marking the stock that is ready.",
       "tags": [
         "inventory",
         "warehouse",
@@ -615,14 +615,14 @@
         {
           "path": "inventory.svg",
           "role": "source",
-          "bytes": 4558,
-          "integrity": "sha256-lpe+xybY6if62AE7jyrc531zeQuQiZWvB6bZ8LNSAuE="
+          "bytes": 9461,
+          "integrity": "sha256-PrHqQsxeEtVKhftidsFZpr2XMIWx2oMgKhsd0dGKXSQ="
         },
         {
           "path": "inventory.tsx",
           "role": "react",
-          "bytes": 5532,
-          "integrity": "sha256-si0HLYrwRJ07wZH2lNuvUhxhhNGFtihT8S21fClz4sY="
+          "bytes": 10590,
+          "integrity": "sha256-WH+stRnsQsNF8bWuVpZAoqkjthF3JNM/FEQ3aw2G6Lg="
         }
       ]
     },
@@ -838,7 +838,7 @@
       "id": "offline",
       "kind": "2d",
       "title": "Offline",
-      "summary": "A small wireless router and a disconnected cable. Connection paused, ready to reconnect.",
+      "summary": "A wireless router that has lost its signal and a disconnected cable. Connection paused, ready to reconnect.",
       "tags": [
         "error",
         "network",
@@ -849,14 +849,14 @@
         {
           "path": "offline.svg",
           "role": "source",
-          "bytes": 4202,
-          "integrity": "sha256-2sWn+8fJD4xEyp/D+Po2wAIUJVufv9EGmu4cQYmFCRg="
+          "bytes": 4560,
+          "integrity": "sha256-q0ZZ4EKo8a+56sIAtcGyjni7yVhxyD6yMYwSlDaWqRQ="
         },
         {
           "path": "offline.tsx",
           "role": "react",
-          "bytes": 5132,
-          "integrity": "sha256-4fui9gRQW3U+pMsibh1vg8b3jmHvnpxQRXqmAiSNA04="
+          "bytes": 5517,
+          "integrity": "sha256-G1ys9dW4cJg6CjD3Gj1aJ2InQus4zYClR45jExmITSg="
         }
       ]
     },
@@ -1707,14 +1707,14 @@
         {
           "path": "measuring-tape.glb",
           "role": "source",
-          "bytes": 592628,
-          "integrity": "sha256-gjp8OVIjpEbmo0zeegc7p9W+gkYGeNqwETxuBfE43Js="
+          "bytes": 445392,
+          "integrity": "sha256-VsiwX1rsnRBGeE28vd1LuoqIZSF5OVqvDjy9fgwbLNk="
         },
         {
           "path": "measuring-tape-poster.webp",
           "role": "poster",
-          "bytes": 16086,
-          "integrity": "sha256-Ygzmwy/ttH5//dWsBUTsR+4XGQlD/YpodjI6y9caXuo="
+          "bytes": 18308,
+          "integrity": "sha256-Nmmtp3upafknGSg3V57I1GEBf+yMRCBVBmIsSGXKlks="
         }
       ]
     },
@@ -1941,14 +1941,14 @@
         {
           "path": "task-lamp.glb",
           "role": "source",
-          "bytes": 283168,
-          "integrity": "sha256-hAolZPXrmhkMW0DjUx/aB4iXTEBm3YFDnoTzOqsMtMc="
+          "bytes": 283120,
+          "integrity": "sha256-mQVMpISa78gjVjYSbzsY9IOzZjTQVwl2n/YrCCdVOf0="
         },
         {
           "path": "task-lamp-poster.webp",
           "role": "poster",
-          "bytes": 16676,
-          "integrity": "sha256-KczARj6DGDO6U9YrYZ5LLTKCHK922mbXLvJtcmeMEfQ="
+          "bytes": 17958,
+          "integrity": "sha256-IQot+k4DZEqTkOknca5ZxH4dqPjpE4xyeJWxGANl6yM="
         }
       ]
     },

package/registry/catalog.json

@@ -92,7 +92,6 @@
     "features",
     "contact",
     "welcome",
-    "not-found",
     "release-notes"
   ],
   "templates": [
@@ -1254,17 +1253,6 @@
         "onboarding"
       ]
     },
-    {
-      "name": "not-found",
-      "type": "registry:page",
-      "title": "Not Found",
-      "description": "A not-found page with search, the usual destinations and a way back",
-      "category": "application",
-      "tags": [
-        "page",
-        "errors"
-      ]
-    },
     {
       "name": "release-notes",
       "type": "registry:page",

package/registry/contract.json

@@ -42,6 +42,7 @@
     "ml-brand-name",
     "ml-breadcrumb",
     "ml-breadcrumb-ellipsis",
+    "ml-breadcrumb-icon",
     "ml-breadcrumb-item",
     "ml-breadcrumb-link",
     "ml-breadcrumb-list",
@@ -580,6 +581,7 @@
       ]
     },
     "ml-carousel": {
+      "data-arrows": [],
       "data-playing": []
     },
     "ml-carousel-arrow": {

package/registry/examples.json

@@ -232,6 +232,10 @@
         "class": "ml-breadcrumb-page",
         "attributes": {}
       },
+      {
+        "class": "ml-breadcrumb-icon",
+        "attributes": {}
+      },
       {
         "class": "ml-breadcrumb-separator",
         "attributes": {}
@@ -362,11 +366,12 @@
   "carousel": {
     "needs": "script",
     "react": "import { Carousel } from \"@/components/ui/carousel\";\n\nconst slides = [\"Plan\", \"Build\", \"Ship\"].map((title) => (\n  <div key={title} className=\"ml-card\" data-variant=\"elevated\">\n    <div className=\"ml-card-content\">{title}</div>\n  </div>\n));\n\nexport default function Example() {\n  return <Carousel label=\"Release stages\" items={slides} itemLabels={[\"Plan\", \"Build\", \"Ship\"]} />;\n}",
-    "html": "<div class=\"ml-carousel\" role=\"group\" aria-roledescription=\"carousel\" aria-label=\"Release stages\" style=\"--ml-carousel-per-view:1;--ml-carousel-peek:0px;--ml-carousel-min:0px;--ml-carousel-autoplay:0ms\">\n  <div class=\"ml-carousel-viewport\">\n    <div class=\"ml-carousel-track\" tabindex=\"0\" aria-label=\"Release stages, use the arrow keys\">\n      <div class=\"ml-carousel-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"1 of 3: Plan\" data-current=\"true\">\n        <div class=\"ml-card\" data-variant=\"elevated\"><div class=\"ml-card-content\">Plan</div></div>\n      </div>\n      <div class=\"ml-carousel-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"2 of 3: Build\">\n        <div class=\"ml-card\" data-variant=\"elevated\"><div class=\"ml-card-content\">Build</div></div>\n      </div>\n      <div class=\"ml-carousel-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"3 of 3: Ship\">\n        <div class=\"ml-card\" data-variant=\"elevated\"><div class=\"ml-card-content\">Ship</div></div>\n      </div>\n    </div>\n    <button class=\"ml-carousel-arrow\" type=\"button\" data-side=\"previous\" aria-label=\"Previous slide\"><svg class=\"mlola-glyph\" width=\"1.1em\" height=\"1.1em\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"var(--mlola-glyph-stroke, var(--ml-icon-stroke, 1.75))\" stroke-linecap=\"round\" stroke-linejoin=\"round\" focusable=\"false\" aria-hidden=\"true\" data-optical-size=\"default\" style=\"color:var(--mlola-glyph-color, currentColor);scale:var(--mlola-glyph-optical-scale, 1);transform-origin:center\"><path d=\"m15 18-6-6 6-6\" pathLength=\"1\"></path></svg></button>\n    <button class=\"ml-carousel-arrow\" type=\"button\" data-side=\"next\" aria-label=\"Next slide\"><svg class=\"mlola-glyph\" width=\"1.1em\" height=\"1.1em\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"var(--mlola-glyph-stroke, var(--ml-icon-stroke, 1.75))\" stroke-linecap=\"round\" stroke-linejoin=\"round\" focusable=\"false\" aria-hidden=\"true\" data-optical-size=\"default\" style=\"color:var(--mlola-glyph-color, currentColor);scale:var(--mlola-glyph-optical-scale, 1);transform-origin:center\"><path d=\"m9 18 6-6-6-6\" pathLength=\"1\"></path></svg></button>\n  </div>\n  <div class=\"ml-carousel-dots\" role=\"group\" aria-label=\"Choose release stages\">\n    <button class=\"ml-carousel-dot\" type=\"button\" data-hit=\"expand\" aria-current=\"true\" aria-label=\"Plan\" tabindex=\"0\"></button>\n    <button class=\"ml-carousel-dot\" type=\"button\" data-hit=\"expand\" aria-label=\"Build\" tabindex=\"-1\"></button>\n    <button class=\"ml-carousel-dot\" type=\"button\" data-hit=\"expand\" aria-label=\"Ship\" tabindex=\"-1\"></button>\n  </div>\n</div>",
+    "html": "<div class=\"ml-carousel\" role=\"group\" aria-roledescription=\"carousel\" aria-label=\"Release stages\" data-arrows=\"true\" style=\"--ml-carousel-per-view:1;--ml-carousel-peek:0px;--ml-carousel-min:0px;--ml-carousel-autoplay:0ms\">\n  <div class=\"ml-carousel-viewport\">\n    <div class=\"ml-carousel-track\" tabindex=\"0\" aria-label=\"Release stages, use the arrow keys\">\n      <div class=\"ml-carousel-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"1 of 3: Plan\" data-current=\"true\">\n        <div class=\"ml-card\" data-variant=\"elevated\"><div class=\"ml-card-content\">Plan</div></div>\n      </div>\n      <div class=\"ml-carousel-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"2 of 3: Build\">\n        <div class=\"ml-card\" data-variant=\"elevated\"><div class=\"ml-card-content\">Build</div></div>\n      </div>\n      <div class=\"ml-carousel-slide\" role=\"group\" aria-roledescription=\"slide\" aria-label=\"3 of 3: Ship\">\n        <div class=\"ml-card\" data-variant=\"elevated\"><div class=\"ml-card-content\">Ship</div></div>\n      </div>\n    </div>\n    <button class=\"ml-carousel-arrow\" type=\"button\" data-side=\"previous\" aria-label=\"Previous slide\"><svg class=\"mlola-glyph\" width=\"1.1em\" height=\"1.1em\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"var(--mlola-glyph-stroke, var(--ml-icon-stroke, 1.75))\" stroke-linecap=\"round\" stroke-linejoin=\"round\" focusable=\"false\" aria-hidden=\"true\" data-optical-size=\"default\" style=\"color:var(--mlola-glyph-color, currentColor);scale:var(--mlola-glyph-optical-scale, 1);transform-origin:center\"><path d=\"m15 18-6-6 6-6\" pathLength=\"1\"></path></svg></button>\n    <button class=\"ml-carousel-arrow\" type=\"button\" data-side=\"next\" aria-label=\"Next slide\"><svg class=\"mlola-glyph\" width=\"1.1em\" height=\"1.1em\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"var(--mlola-glyph-stroke, var(--ml-icon-stroke, 1.75))\" stroke-linecap=\"round\" stroke-linejoin=\"round\" focusable=\"false\" aria-hidden=\"true\" data-optical-size=\"default\" style=\"color:var(--mlola-glyph-color, currentColor);scale:var(--mlola-glyph-optical-scale, 1);transform-origin:center\"><path d=\"m9 18 6-6-6-6\" pathLength=\"1\"></path></svg></button>\n  </div>\n  <div class=\"ml-carousel-dots\" role=\"group\" aria-label=\"Choose release stages\">\n    <button class=\"ml-carousel-dot\" type=\"button\" data-hit=\"expand\" aria-current=\"true\" aria-label=\"Plan\" tabindex=\"0\"></button>\n    <button class=\"ml-carousel-dot\" type=\"button\" data-hit=\"expand\" aria-label=\"Build\" tabindex=\"-1\"></button>\n    <button class=\"ml-carousel-dot\" type=\"button\" data-hit=\"expand\" aria-label=\"Ship\" tabindex=\"-1\"></button>\n  </div>\n</div>",
     "elements": [
       {
         "class": "ml-carousel",
         "attributes": {
+          "data-arrows": [],
           "data-playing": []
         }
       },

package/registry/index.json

@@ -2,7 +2,7 @@
   "$schema": "./schema/registry-index.schema.json",
   "schemaVersion": 2,
   "name": "mlola-ui",
-  "version": "1.0.11",
+  "version": "1.0.13",
   "homepage": "https://ui.mlola.com",
   "themeContract": {
     "attribute": "data-theme",
@@ -177,8 +177,8 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/behavior": "^1.0.11",
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/behavior": "^1.0.13",
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [
         {
@@ -239,7 +239,7 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [
         {
@@ -393,7 +393,7 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [
         {
@@ -485,7 +485,7 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [],
       "variants": [],
@@ -501,7 +501,7 @@
           "path": "packages/components/breadcrumb/breadcrumb.tsx",
           "target": "{{aliases.components}}/breadcrumb.tsx",
           "type": "registry:ui",
-          "integrity": "sha256-Mt9mvmwwDgdp5/+mj5byIrh8+hicsp7R6UcvUlK0yog="
+          "integrity": "sha256-mxQpach2kFayT8H1vMt5252LQLxVV+sohdVXDhPuKoU="
         }
       ],
       "themeContract": {
@@ -538,7 +538,7 @@
         "spinner"
       ],
       "engineDependencies": {
-        "@mlola-ui/motion": "^1.0.11"
+        "@mlola-ui/motion": "^1.0.13"
       },
       "options": [
         {
@@ -693,8 +693,8 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/behavior": "^1.0.11",
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/behavior": "^1.0.13",
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [
         {
@@ -721,7 +721,7 @@
           "path": "packages/components/carousel/carousel.tsx",
           "target": "{{aliases.components}}/carousel.tsx",
           "type": "registry:ui",
-          "integrity": "sha256-pamugpB6Ujt9Ylxd37jNF/ZwSb8iRkW/MoYe12nY3i4="
+          "integrity": "sha256-Gsw0LhQsOuvdQN/F2KDGVC/gJq53+ifLs19u95RWCoU="
         }
       ],
       "themeContract": {
@@ -756,7 +756,7 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [],
       "variants": [],
@@ -811,7 +811,7 @@
         "modal"
       ],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [],
       "variants": [],
@@ -874,8 +874,8 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/behavior": "^1.0.11",
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/behavior": "^1.0.13",
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [
         {
@@ -939,7 +939,7 @@
         "input"
       ],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [],
       "variants": [],
@@ -1163,8 +1163,8 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/behavior": "^1.0.11",
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/behavior": "^1.0.13",
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [
         {
@@ -1302,7 +1302,7 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [],
       "variants": [],
@@ -1353,7 +1353,7 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/behavior": "^1.0.11"
+        "@mlola-ui/behavior": "^1.0.13"
       },
       "options": [
         {
@@ -1385,7 +1385,7 @@
           "path": "packages/components/_internal/anchor.ts",
           "target": "{{aliases.components}}/_internal/anchor.ts",
           "type": "registry:ui",
-          "integrity": "sha256-OPm/4Jf4UUo8IG+/4TAKpGDHtYpvxvGwyq3/RSZQIGc="
+          "integrity": "sha256-/yW3RVjoY6QfTWnUYSeZ9rFkC9W4WGB1qop8Jp/H1r8="
         },
         {
           "path": "packages/components/_internal/floating.ts",
@@ -1722,7 +1722,7 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/behavior": "^1.0.11"
+        "@mlola-ui/behavior": "^1.0.13"
       },
       "options": [],
       "variants": [],
@@ -1773,8 +1773,8 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/behavior": "^1.0.11",
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/behavior": "^1.0.13",
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [
         {
@@ -1798,7 +1798,7 @@
           "path": "packages/components/_internal/anchor.ts",
           "target": "{{aliases.components}}/_internal/anchor.ts",
           "type": "registry:ui",
-          "integrity": "sha256-OPm/4Jf4UUo8IG+/4TAKpGDHtYpvxvGwyq3/RSZQIGc="
+          "integrity": "sha256-/yW3RVjoY6QfTWnUYSeZ9rFkC9W4WGB1qop8Jp/H1r8="
         },
         {
           "path": "packages/components/_internal/floating.ts",
@@ -1851,8 +1851,8 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/behavior": "^1.0.11",
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/behavior": "^1.0.13",
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [
         {
@@ -1984,7 +1984,7 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/behavior": "^1.0.11"
+        "@mlola-ui/behavior": "^1.0.13"
       },
       "options": [
         {
@@ -2129,7 +2129,7 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/behavior": "^1.0.11"
+        "@mlola-ui/behavior": "^1.0.13"
       },
       "options": [
         {
@@ -2255,7 +2255,7 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [
         {
@@ -2341,7 +2341,7 @@
         "spinner"
       ],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [
         {
@@ -2483,7 +2483,9 @@
         "isDefault": false
       },
       "registryDependencies": [],
-      "engineDependencies": {},
+      "engineDependencies": {
+        "@mlola-ui/behavior": "^1.0.13"
+      },
       "options": [
         {
           "component": "Tooltip",
@@ -2500,6 +2502,12 @@
       "variants": [],
       "sizes": [],
       "files": [
+        {
+          "path": "packages/components/_internal/anchor.ts",
+          "target": "{{aliases.components}}/_internal/anchor.ts",
+          "type": "registry:ui",
+          "integrity": "sha256-/yW3RVjoY6QfTWnUYSeZ9rFkC9W4WGB1qop8Jp/H1r8="
+        },
         {
           "path": "packages/components/_internal/react.ts",
           "target": "{{aliases.components}}/_internal/react.ts",
@@ -2510,7 +2518,7 @@
           "path": "packages/components/tooltip/tooltip.tsx",
           "target": "{{aliases.components}}/tooltip.tsx",
           "type": "registry:ui",
-          "integrity": "sha256-NbaOUmlUbBlUIdovchrWwH2QqzuvXB97DjnJnrHf4Gc="
+          "integrity": "sha256-hplqwWF/ZqQQ9oyoErrOA3VjkRCDCbqwt5xgZOdsFcA="
         }
       ],
       "themeContract": {
@@ -2615,7 +2623,7 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [
         {
@@ -2687,7 +2695,7 @@
         "popover"
       ],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [
         {
@@ -2757,7 +2765,7 @@
         "popover"
       ],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [],
       "variants": [],
@@ -2955,7 +2963,7 @@
         "input"
       ],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [
         {
@@ -3032,7 +3040,7 @@
         "input"
       ],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [],
       "variants": [],
@@ -3087,7 +3095,7 @@
         "input"
       ],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [],
       "variants": [],
@@ -3150,7 +3158,7 @@
         "popover"
       ],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [
         {
@@ -3220,7 +3228,7 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [
         {
@@ -3339,8 +3347,8 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/behavior": "^1.0.11",
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/behavior": "^1.0.13",
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [],
       "variants": [],
@@ -3350,7 +3358,7 @@
           "path": "packages/components/_internal/anchor.ts",
           "target": "{{aliases.components}}/_internal/anchor.ts",
           "type": "registry:ui",
-          "integrity": "sha256-OPm/4Jf4UUo8IG+/4TAKpGDHtYpvxvGwyq3/RSZQIGc="
+          "integrity": "sha256-/yW3RVjoY6QfTWnUYSeZ9rFkC9W4WGB1qop8Jp/H1r8="
         },
         {
           "path": "packages/components/_internal/floating.ts",
@@ -3404,7 +3412,7 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/behavior": "^1.0.11"
+        "@mlola-ui/behavior": "^1.0.13"
       },
       "options": [
         {
@@ -3436,7 +3444,7 @@
           "path": "packages/components/_internal/anchor.ts",
           "target": "{{aliases.components}}/_internal/anchor.ts",
           "type": "registry:ui",
-          "integrity": "sha256-OPm/4Jf4UUo8IG+/4TAKpGDHtYpvxvGwyq3/RSZQIGc="
+          "integrity": "sha256-/yW3RVjoY6QfTWnUYSeZ9rFkC9W4WGB1qop8Jp/H1r8="
         },
         {
           "path": "packages/components/_internal/floating.ts",
@@ -3491,8 +3499,8 @@
       },
       "registryDependencies": [],
       "engineDependencies": {
-        "@mlola-ui/behavior": "^1.0.11",
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/behavior": "^1.0.13",
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [],
       "variants": [],
@@ -3502,7 +3510,7 @@
           "path": "packages/components/_internal/anchor.ts",
           "target": "{{aliases.components}}/_internal/anchor.ts",
           "type": "registry:ui",
-          "integrity": "sha256-OPm/4Jf4UUo8IG+/4TAKpGDHtYpvxvGwyq3/RSZQIGc="
+          "integrity": "sha256-/yW3RVjoY6QfTWnUYSeZ9rFkC9W4WGB1qop8Jp/H1r8="
         },
         {
           "path": "packages/components/_internal/floating.ts",
@@ -3560,7 +3568,7 @@
         "sheet"
       ],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [],
       "variants": [],
@@ -3677,7 +3685,7 @@
         "button"
       ],
       "engineDependencies": {
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [
         {
@@ -3772,8 +3780,8 @@
         "input"
       ],
       "engineDependencies": {
-        "@mlola-ui/behavior": "^1.0.11",
-        "@mlola-ui/icons": "^1.0.11"
+        "@mlola-ui/behavior": "^1.0.13",
+        "@mlola-ui/icons": "^1.0.13"
       },
       "options": [
         {

package/registry/source/packages/components/_internal/anchor.ts

@@ -2,4 +2,4 @@
  * Where a floating layer goes next to its anchor. The math is shared with the
  * framework-free runtime, so it lives in @mlola-ui/behavior/logic.
  */
-export { placeFloating, type Align, type Placement, type Rect, type Side } from "@mlola-ui/behavior/logic";
+export { fitTooltip, placeFloating, type Align, type Placement, type Rect, type Side } from "@mlola-ui/behavior/logic";

package/registry/source/packages/components/breadcrumb/breadcrumb.tsx

@@ -4,7 +4,15 @@ import * as React from "react";
 import { cx } from "../_internal/react";
 import { IconChevronRight } from "@mlola-ui/icons";
 
-export type BreadcrumbItemType = { label: string; href?: string };
+export type BreadcrumbItemType = {
+  label: string;
+  /** A link to the page. */
+  href?: string;
+  /** In-app navigation without a URL; the item becomes a button. */
+  onSelect?: () => void;
+  /** A decorative mark before the label, such as a page's icon. */
+  icon?: React.ReactNode;
+};
 type BreadcrumbProps = { items: BreadcrumbItemType[]; separator?: React.ReactNode; className?: string };
 
 const BreadcrumbList = React.forwardRef<HTMLOListElement, React.OlHTMLAttributes<HTMLOListElement>>(
@@ -29,6 +37,8 @@ function BreadcrumbEllipsis({ className }: { className?: string }) {
   return <span aria-hidden="true" className={cx("ml-breadcrumb-ellipsis", className)}>…</span>;
 }
 
+const icon = (item: BreadcrumbItemType) => (item.icon ? <span aria-hidden="true" className="ml-breadcrumb-icon">{item.icon}</span> : null);
+
 export function Breadcrumb({ items, separator, className }: BreadcrumbProps) {
   const last = items.length - 1;
   const collapse = items.length > 3;
@@ -46,9 +56,13 @@ export function Breadcrumb({ items, separator, className }: BreadcrumbProps) {
                 </BreadcrumbItem>
               ) : null}
               <BreadcrumbItem data-collapsible={middle && collapse ? "" : undefined}>
-                {current || !item.href
-                  ? <BreadcrumbPage>{item.label}</BreadcrumbPage>
-                  : <BreadcrumbLink href={item.href}>{item.label}</BreadcrumbLink>}
+                {current || (!item.href && !item.onSelect) ? (
+                  <BreadcrumbPage>{icon(item)}{item.label}</BreadcrumbPage>
+                ) : item.href ? (
+                  <BreadcrumbLink href={item.href}>{icon(item)}{item.label}</BreadcrumbLink>
+                ) : (
+                  <button type="button" className="ml-breadcrumb-link" data-hit="expand" onClick={item.onSelect}>{icon(item)}{item.label}</button>
+                )}
                 {!current ? <BreadcrumbSeparator>{separator}</BreadcrumbSeparator> : null}
               </BreadcrumbItem>
             </React.Fragment>

package/registry/source/packages/components/carousel/carousel.tsx

@@ -180,6 +180,7 @@ export function Carousel({
       aria-roledescription="carousel"
       aria-label={label}
       data-playing={playing || undefined}
+      data-arrows={(arrows && positions > 1) || undefined}
       style={{ ...style, "--ml-carousel-per-view": view, "--ml-carousel-peek": peek ?? "0px", "--ml-carousel-min": minSlideWidth ?? "0px", "--ml-carousel-autoplay": `${autoplay ?? 0}ms` } as React.CSSProperties}
       onPointerEnter={() => setPaused(true)}
       onPointerLeave={() => setPaused(false)}

package/registry/source/packages/components/tooltip/tooltip.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import * as React from "react";
+import { fitTooltip, type Side } from "../_internal/anchor";
 import { cx } from "../_internal/react";
 
 export type TooltipPlacement = "top" | "bottom" | "left" | "right";
@@ -14,6 +15,10 @@ interface TooltipProps {
 
 function Tooltip({ content, placement = "top", delay = 200, children, className }: TooltipProps) {
   const [open, setOpen] = React.useState(false);
+  // Where it actually opens: the asked side, flipped or slid to stay on screen.
+  const [fit, setFit] = React.useState<{ side: Side; shift: number }>({ side: placement, shift: 0 });
+  const root = React.useRef<HTMLSpanElement>(null);
+  const tip = React.useRef<HTMLSpanElement>(null);
   const timer = React.useRef<ReturnType<typeof setTimeout> | null>(null);
   const id = React.useId();
   const clear = () => {
@@ -29,6 +34,17 @@ function Tooltip({ content, placement = "top", delay = 200, children, className
     setOpen(false);
   };
   React.useEffect(() => clear, []);
+  React.useLayoutEffect(() => {
+    const anchor = root.current?.firstElementChild ?? root.current;
+    if (!open || !anchor || !tip.current) {
+      setFit({ side: placement, shift: 0 });
+      return;
+    }
+    const a = anchor.getBoundingClientRect();
+    // Layout size, not the painted box: the pop-in animation starts scaled down.
+    const t = { width: tip.current.offsetWidth, height: tip.current.offsetHeight };
+    setFit(fitTooltip({ x: a.left, y: a.top, width: a.width, height: a.height }, t, { width: document.documentElement.clientWidth, height: window.innerHeight }, placement));
+  }, [open, placement]);
   React.useEffect(() => {
     if (!open) return;
     const onKeyDown = (event: KeyboardEvent) => {
@@ -55,10 +71,18 @@ function Tooltip({ content, placement = "top", delay = 200, children, className
       : childProps["aria-describedby"],
   } as Record<string, unknown>);
   return (
-    <span className="ml-tooltip-root" onMouseEnter={clear} onMouseLeave={hide}>
+    <span ref={root} className="ml-tooltip-root" onMouseEnter={clear} onMouseLeave={hide}>
       {trigger}
       {open ? (
-        <span id={id} role="tooltip" data-side={placement} data-state="open" className={cx("ml-tooltip", className)}>
+        <span
+          ref={tip}
+          id={id}
+          role="tooltip"
+          data-side={fit.side}
+          data-state="open"
+          className={cx("ml-tooltip", className)}
+          style={{ "--ml-tooltip-shift": `${fit.shift}px` } as React.CSSProperties}
+        >
           {content}
           <span aria-hidden="true" className="ml-tooltip-arrow" />
         </span>

package/registry/source-manifest.json

@@ -1,5 +1,5 @@
 {
-  "packages/components/_internal/anchor.ts": "sha256-OPm/4Jf4UUo8IG+/4TAKpGDHtYpvxvGwyq3/RSZQIGc=",
+  "packages/components/_internal/anchor.ts": "sha256-/yW3RVjoY6QfTWnUYSeZ9rFkC9W4WGB1qop8Jp/H1r8=",
   "packages/components/_internal/clipboard.ts": "sha256-0y5p88CTXWuOrUYlC5J4XP1VCrOwkx9jYWVHmD2LouQ=",
   "packages/components/_internal/dialog.ts": "sha256-796y3oNOVWarLvICTdi+d0/2axqSrzLVJiyBeh9X7bU=",
   "packages/components/_internal/floating.ts": "sha256-+WxgC4CtAlSr2qA1EkoDTgto535XLIPsvtOfdOK6CHk=",
@@ -13,12 +13,12 @@
   "packages/components/app-shell/app-shell.tsx": "sha256-XAq82XOTH3ZR+hxTkYFu8P7Ih2aI6ERy/TpXc2VMUwM=",
   "packages/components/avatar/avatar.tsx": "sha256-EjqC8ytKqRtsTVdK6vncaDfhO/i7ICe+jwaYCg5bjIw=",
   "packages/components/badge/badge.tsx": "sha256-flEH8S2jZ/64n3Y/ROhC9+9rvF7wXaN0xLcMMwqNOVQ=",
-  "packages/components/breadcrumb/breadcrumb.tsx": "sha256-Mt9mvmwwDgdp5/+mj5byIrh8+hicsp7R6UcvUlK0yog=",
+  "packages/components/breadcrumb/breadcrumb.tsx": "sha256-mxQpach2kFayT8H1vMt5252LQLxVV+sohdVXDhPuKoU=",
   "packages/components/button/button.tsx": "sha256-sXVANbGeFSYPHpiWuPvHHqMoPjG0zl0HSsKEdTgl5ME=",
   "packages/components/calendar/calendar.tsx": "sha256-rWiS4YAueZfVoo6j5Fi3uN7A+yApe5U6HMm1woTVjys=",
   "packages/components/calendar/dates.ts": "sha256-mygYkoC70av2ZQ0vkxf885trwW97Wd10I4dptYQe+4A=",
   "packages/components/card/card.tsx": "sha256-aMKbv5DWYYWq7GZAFR9O1fuYE0H61WCjkvEbRMOd894=",
-  "packages/components/carousel/carousel.tsx": "sha256-pamugpB6Ujt9Ylxd37jNF/ZwSb8iRkW/MoYe12nY3i4=",
+  "packages/components/carousel/carousel.tsx": "sha256-Gsw0LhQsOuvdQN/F2KDGVC/gJq53+ifLs19u95RWCoU=",
   "packages/components/checkbox/checkbox.tsx": "sha256-hz4YbGwOxv/aJpJHrLXR4MKSWJGyjzoJEIGvdhyML9M=",
   "packages/components/color-picker/color-picker.tsx": "sha256-E+QB6MbSxg+3AZX3A7bOkst4arxgpmFL2ZmochoWCl8=",
   "packages/components/color-picker/color.ts": "sha256-YqSgYjzn7XfPWAHuyzbwOhbg/ScaSfB7V73e9w+OjJs=",
@@ -64,7 +64,7 @@
   "packages/components/timeline/timeline.tsx": "sha256-nVg7lBcAUAzqEb0YrHagJXSaHE2aWWE9bUbQMWQY6PU=",
   "packages/components/toast/toast.tsx": "sha256-f0DwN0XuV46fSsQf3i9RJcfQbAs2mSz7A8UJoIIICHg=",
   "packages/components/toggle/toggle.tsx": "sha256-8qPHeSliHNdzQS7OLJ47BrvRR75MYyUGJlK4s21XS/U=",
-  "packages/components/tooltip/tooltip.tsx": "sha256-NbaOUmlUbBlUIdovchrWwH2QqzuvXB97DjnJnrHf4Gc=",
+  "packages/components/tooltip/tooltip.tsx": "sha256-hplqwWF/ZqQQ9oyoErrOA3VjkRCDCbqwt5xgZOdsFcA=",
   "packages/components/tour/tour.tsx": "sha256-mrAE8aVDBVIibGvQah9Gh3mzIiWDFxB6aObzqFo5xXU=",
   "packages/components/virtual-list/virtual-list.tsx": "sha256-raGEFn4HlAOIohqZcy0DgptsnUIPS/6bWLYeTe+M9E8=",
   "packages/components/virtual-list/virtual.ts": "sha256-PyDIj3C2Vwb1i4ZssxSlYjgKmZPBIFLZFNq8YCW2Z78="