mlola-ui 1.0.11 → 1.0.12

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "mlola-ui",
3
- "version": "1.0.11",
3
+ "version": "1.0.12",
4
4
  "description": "Source-copy CLI that writes framework-free Mlola UI items into your project",
5
5
  "type": "module",
6
6
  "bin": {
@@ -341,7 +341,7 @@
341
341
  },
342
342
  {
343
343
  "name": "ml-page-shell",
344
- "note": "A full page: header, main and footer stacked on the page background."
344
+ "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."
345
345
  },
346
346
  {
347
347
  "name": "ml-person",
@@ -131,7 +131,7 @@ component, so a page built from them themes with the rest.
131
131
 
132
132
  - `.ml-check-list` — A list of benefits, each after a check. Pricing tiers and feature rows share it.
133
133
  - `.ml-link` — A glyph inside a link flows with the text instead of breaking the line.
134
- - `.ml-page-shell` — A full page: header, main and footer stacked on the page background.
134
+ - `.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.
135
135
  - `.ml-section` — A section a link jumps to clears the sticky navigation bar.
136
136
 
137
137
  ## Elements and their attributes
@@ -168,6 +168,7 @@ correct. This table is read out of the stylesheet, so it is never stale.
168
168
  | `.ml-calendar-day` | `data-unreachable` | _presence only_ |
169
169
  | `.ml-card` | `data-interactive` | _presence only_ |
170
170
  | `.ml-card` | `data-variant` | `elevated`, `glass`, `specular` |
171
+ | `.ml-carousel` | `data-arrows` | _presence only_ |
171
172
  | `.ml-carousel` | `data-playing` | _presence only_ |
172
173
  | `.ml-carousel-arrow` | `data-side` | `next`, `previous` |
173
174
  | `.ml-carousel-dot` | `aria-current` | `true` |
@@ -433,14 +433,14 @@
433
433
  {
434
434
  "path": "empty-cart.svg",
435
435
  "role": "source",
436
- "bytes": 4968,
437
- "integrity": "sha256-D0zyZvimuFagUT0ChqyBNp2hsCjAZ4Pv7RW6cJ37gcE="
436
+ "bytes": 4982,
437
+ "integrity": "sha256-8m4Z0HWSI7KRjDc6MSHRrCI1HwbiyynBmoxgCyo2DDw="
438
438
  },
439
439
  {
440
440
  "path": "empty-cart.tsx",
441
441
  "role": "react",
442
- "bytes": 5920,
443
- "integrity": "sha256-fapGlGqTLVX54EYazXYKN+vxVbbYN9RP3t4qDLnN1/g="
442
+ "bytes": 5934,
443
+ "integrity": "sha256-CFip8M6D6RJdYVGIwQ6H3HwWek/dHTq9ON98SeHjS4Q="
444
444
  }
445
445
  ]
446
446
  },
@@ -604,7 +604,7 @@
604
604
  "id": "inventory",
605
605
  "kind": "2d",
606
606
  "title": "Inventory",
607
- "summary": "Shelved parcels with labels, counted slots and an active stock marker.",
607
+ "summary": "An open shelf of labeled parcels, one empty slot and a tag marking the stock that is ready.",
608
608
  "tags": [
609
609
  "inventory",
610
610
  "warehouse",
@@ -615,14 +615,14 @@
615
615
  {
616
616
  "path": "inventory.svg",
617
617
  "role": "source",
618
- "bytes": 4558,
619
- "integrity": "sha256-lpe+xybY6if62AE7jyrc531zeQuQiZWvB6bZ8LNSAuE="
618
+ "bytes": 9461,
619
+ "integrity": "sha256-PrHqQsxeEtVKhftidsFZpr2XMIWx2oMgKhsd0dGKXSQ="
620
620
  },
621
621
  {
622
622
  "path": "inventory.tsx",
623
623
  "role": "react",
624
- "bytes": 5532,
625
- "integrity": "sha256-si0HLYrwRJ07wZH2lNuvUhxhhNGFtihT8S21fClz4sY="
624
+ "bytes": 10590,
625
+ "integrity": "sha256-WH+stRnsQsNF8bWuVpZAoqkjthF3JNM/FEQ3aw2G6Lg="
626
626
  }
627
627
  ]
628
628
  },
@@ -838,7 +838,7 @@
838
838
  "id": "offline",
839
839
  "kind": "2d",
840
840
  "title": "Offline",
841
- "summary": "A small wireless router and a disconnected cable. Connection paused, ready to reconnect.",
841
+ "summary": "A wireless router that has lost its signal and a disconnected cable. Connection paused, ready to reconnect.",
842
842
  "tags": [
843
843
  "error",
844
844
  "network",
@@ -849,14 +849,14 @@
849
849
  {
850
850
  "path": "offline.svg",
851
851
  "role": "source",
852
- "bytes": 4202,
853
- "integrity": "sha256-2sWn+8fJD4xEyp/D+Po2wAIUJVufv9EGmu4cQYmFCRg="
852
+ "bytes": 4560,
853
+ "integrity": "sha256-q0ZZ4EKo8a+56sIAtcGyjni7yVhxyD6yMYwSlDaWqRQ="
854
854
  },
855
855
  {
856
856
  "path": "offline.tsx",
857
857
  "role": "react",
858
- "bytes": 5132,
859
- "integrity": "sha256-4fui9gRQW3U+pMsibh1vg8b3jmHvnpxQRXqmAiSNA04="
858
+ "bytes": 5517,
859
+ "integrity": "sha256-G1ys9dW4cJg6CjD3Gj1aJ2InQus4zYClR45jExmITSg="
860
860
  }
861
861
  ]
862
862
  },
@@ -1707,14 +1707,14 @@
1707
1707
  {
1708
1708
  "path": "measuring-tape.glb",
1709
1709
  "role": "source",
1710
- "bytes": 592628,
1711
- "integrity": "sha256-gjp8OVIjpEbmo0zeegc7p9W+gkYGeNqwETxuBfE43Js="
1710
+ "bytes": 445392,
1711
+ "integrity": "sha256-VsiwX1rsnRBGeE28vd1LuoqIZSF5OVqvDjy9fgwbLNk="
1712
1712
  },
1713
1713
  {
1714
1714
  "path": "measuring-tape-poster.webp",
1715
1715
  "role": "poster",
1716
- "bytes": 16086,
1717
- "integrity": "sha256-Ygzmwy/ttH5//dWsBUTsR+4XGQlD/YpodjI6y9caXuo="
1716
+ "bytes": 18308,
1717
+ "integrity": "sha256-Nmmtp3upafknGSg3V57I1GEBf+yMRCBVBmIsSGXKlks="
1718
1718
  }
1719
1719
  ]
1720
1720
  },
@@ -1941,14 +1941,14 @@
1941
1941
  {
1942
1942
  "path": "task-lamp.glb",
1943
1943
  "role": "source",
1944
- "bytes": 283168,
1945
- "integrity": "sha256-hAolZPXrmhkMW0DjUx/aB4iXTEBm3YFDnoTzOqsMtMc="
1944
+ "bytes": 283120,
1945
+ "integrity": "sha256-mQVMpISa78gjVjYSbzsY9IOzZjTQVwl2n/YrCCdVOf0="
1946
1946
  },
1947
1947
  {
1948
1948
  "path": "task-lamp-poster.webp",
1949
1949
  "role": "poster",
1950
- "bytes": 16676,
1951
- "integrity": "sha256-KczARj6DGDO6U9YrYZ5LLTKCHK922mbXLvJtcmeMEfQ="
1950
+ "bytes": 17958,
1951
+ "integrity": "sha256-IQot+k4DZEqTkOknca5ZxH4dqPjpE4xyeJWxGANl6yM="
1952
1952
  }
1953
1953
  ]
1954
1954
  },
@@ -92,7 +92,6 @@
92
92
  "features",
93
93
  "contact",
94
94
  "welcome",
95
- "not-found",
96
95
  "release-notes"
97
96
  ],
98
97
  "templates": [
@@ -1254,17 +1253,6 @@
1254
1253
  "onboarding"
1255
1254
  ]
1256
1255
  },
1257
- {
1258
- "name": "not-found",
1259
- "type": "registry:page",
1260
- "title": "Not Found",
1261
- "description": "A not-found page with search, the usual destinations and a way back",
1262
- "category": "application",
1263
- "tags": [
1264
- "page",
1265
- "errors"
1266
- ]
1267
- },
1268
1256
  {
1269
1257
  "name": "release-notes",
1270
1258
  "type": "registry:page",
@@ -42,6 +42,7 @@
42
42
  "ml-brand-name",
43
43
  "ml-breadcrumb",
44
44
  "ml-breadcrumb-ellipsis",
45
+ "ml-breadcrumb-icon",
45
46
  "ml-breadcrumb-item",
46
47
  "ml-breadcrumb-link",
47
48
  "ml-breadcrumb-list",
@@ -580,6 +581,7 @@
580
581
  ]
581
582
  },
582
583
  "ml-carousel": {
584
+ "data-arrows": [],
583
585
  "data-playing": []
584
586
  },
585
587
  "ml-carousel-arrow": {
@@ -232,6 +232,10 @@
232
232
  "class": "ml-breadcrumb-page",
233
233
  "attributes": {}
234
234
  },
235
+ {
236
+ "class": "ml-breadcrumb-icon",
237
+ "attributes": {}
238
+ },
235
239
  {
236
240
  "class": "ml-breadcrumb-separator",
237
241
  "attributes": {}
@@ -362,11 +366,12 @@
362
366
  "carousel": {
363
367
  "needs": "script",
364
368
  "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}",
365
- "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>",
369
+ "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>",
366
370
  "elements": [
367
371
  {
368
372
  "class": "ml-carousel",
369
373
  "attributes": {
374
+ "data-arrows": [],
370
375
  "data-playing": []
371
376
  }
372
377
  },
@@ -2,7 +2,7 @@
2
2
  "$schema": "./schema/registry-index.schema.json",
3
3
  "schemaVersion": 2,
4
4
  "name": "mlola-ui",
5
- "version": "1.0.11",
5
+ "version": "1.0.12",
6
6
  "homepage": "https://ui.mlola.com",
7
7
  "themeContract": {
8
8
  "attribute": "data-theme",
@@ -177,8 +177,8 @@
177
177
  },
178
178
  "registryDependencies": [],
179
179
  "engineDependencies": {
180
- "@mlola-ui/behavior": "^1.0.11",
181
- "@mlola-ui/icons": "^1.0.11"
180
+ "@mlola-ui/behavior": "^1.0.12",
181
+ "@mlola-ui/icons": "^1.0.12"
182
182
  },
183
183
  "options": [
184
184
  {
@@ -239,7 +239,7 @@
239
239
  },
240
240
  "registryDependencies": [],
241
241
  "engineDependencies": {
242
- "@mlola-ui/icons": "^1.0.11"
242
+ "@mlola-ui/icons": "^1.0.12"
243
243
  },
244
244
  "options": [
245
245
  {
@@ -393,7 +393,7 @@
393
393
  },
394
394
  "registryDependencies": [],
395
395
  "engineDependencies": {
396
- "@mlola-ui/icons": "^1.0.11"
396
+ "@mlola-ui/icons": "^1.0.12"
397
397
  },
398
398
  "options": [
399
399
  {
@@ -485,7 +485,7 @@
485
485
  },
486
486
  "registryDependencies": [],
487
487
  "engineDependencies": {
488
- "@mlola-ui/icons": "^1.0.11"
488
+ "@mlola-ui/icons": "^1.0.12"
489
489
  },
490
490
  "options": [],
491
491
  "variants": [],
@@ -501,7 +501,7 @@
501
501
  "path": "packages/components/breadcrumb/breadcrumb.tsx",
502
502
  "target": "{{aliases.components}}/breadcrumb.tsx",
503
503
  "type": "registry:ui",
504
- "integrity": "sha256-Mt9mvmwwDgdp5/+mj5byIrh8+hicsp7R6UcvUlK0yog="
504
+ "integrity": "sha256-mxQpach2kFayT8H1vMt5252LQLxVV+sohdVXDhPuKoU="
505
505
  }
506
506
  ],
507
507
  "themeContract": {
@@ -538,7 +538,7 @@
538
538
  "spinner"
539
539
  ],
540
540
  "engineDependencies": {
541
- "@mlola-ui/motion": "^1.0.11"
541
+ "@mlola-ui/motion": "^1.0.12"
542
542
  },
543
543
  "options": [
544
544
  {
@@ -693,8 +693,8 @@
693
693
  },
694
694
  "registryDependencies": [],
695
695
  "engineDependencies": {
696
- "@mlola-ui/behavior": "^1.0.11",
697
- "@mlola-ui/icons": "^1.0.11"
696
+ "@mlola-ui/behavior": "^1.0.12",
697
+ "@mlola-ui/icons": "^1.0.12"
698
698
  },
699
699
  "options": [
700
700
  {
@@ -721,7 +721,7 @@
721
721
  "path": "packages/components/carousel/carousel.tsx",
722
722
  "target": "{{aliases.components}}/carousel.tsx",
723
723
  "type": "registry:ui",
724
- "integrity": "sha256-pamugpB6Ujt9Ylxd37jNF/ZwSb8iRkW/MoYe12nY3i4="
724
+ "integrity": "sha256-Gsw0LhQsOuvdQN/F2KDGVC/gJq53+ifLs19u95RWCoU="
725
725
  }
726
726
  ],
727
727
  "themeContract": {
@@ -756,7 +756,7 @@
756
756
  },
757
757
  "registryDependencies": [],
758
758
  "engineDependencies": {
759
- "@mlola-ui/icons": "^1.0.11"
759
+ "@mlola-ui/icons": "^1.0.12"
760
760
  },
761
761
  "options": [],
762
762
  "variants": [],
@@ -811,7 +811,7 @@
811
811
  "modal"
812
812
  ],
813
813
  "engineDependencies": {
814
- "@mlola-ui/icons": "^1.0.11"
814
+ "@mlola-ui/icons": "^1.0.12"
815
815
  },
816
816
  "options": [],
817
817
  "variants": [],
@@ -874,8 +874,8 @@
874
874
  },
875
875
  "registryDependencies": [],
876
876
  "engineDependencies": {
877
- "@mlola-ui/behavior": "^1.0.11",
878
- "@mlola-ui/icons": "^1.0.11"
877
+ "@mlola-ui/behavior": "^1.0.12",
878
+ "@mlola-ui/icons": "^1.0.12"
879
879
  },
880
880
  "options": [
881
881
  {
@@ -939,7 +939,7 @@
939
939
  "input"
940
940
  ],
941
941
  "engineDependencies": {
942
- "@mlola-ui/icons": "^1.0.11"
942
+ "@mlola-ui/icons": "^1.0.12"
943
943
  },
944
944
  "options": [],
945
945
  "variants": [],
@@ -1163,8 +1163,8 @@
1163
1163
  },
1164
1164
  "registryDependencies": [],
1165
1165
  "engineDependencies": {
1166
- "@mlola-ui/behavior": "^1.0.11",
1167
- "@mlola-ui/icons": "^1.0.11"
1166
+ "@mlola-ui/behavior": "^1.0.12",
1167
+ "@mlola-ui/icons": "^1.0.12"
1168
1168
  },
1169
1169
  "options": [
1170
1170
  {
@@ -1302,7 +1302,7 @@
1302
1302
  },
1303
1303
  "registryDependencies": [],
1304
1304
  "engineDependencies": {
1305
- "@mlola-ui/icons": "^1.0.11"
1305
+ "@mlola-ui/icons": "^1.0.12"
1306
1306
  },
1307
1307
  "options": [],
1308
1308
  "variants": [],
@@ -1353,7 +1353,7 @@
1353
1353
  },
1354
1354
  "registryDependencies": [],
1355
1355
  "engineDependencies": {
1356
- "@mlola-ui/behavior": "^1.0.11"
1356
+ "@mlola-ui/behavior": "^1.0.12"
1357
1357
  },
1358
1358
  "options": [
1359
1359
  {
@@ -1722,7 +1722,7 @@
1722
1722
  },
1723
1723
  "registryDependencies": [],
1724
1724
  "engineDependencies": {
1725
- "@mlola-ui/behavior": "^1.0.11"
1725
+ "@mlola-ui/behavior": "^1.0.12"
1726
1726
  },
1727
1727
  "options": [],
1728
1728
  "variants": [],
@@ -1773,8 +1773,8 @@
1773
1773
  },
1774
1774
  "registryDependencies": [],
1775
1775
  "engineDependencies": {
1776
- "@mlola-ui/behavior": "^1.0.11",
1777
- "@mlola-ui/icons": "^1.0.11"
1776
+ "@mlola-ui/behavior": "^1.0.12",
1777
+ "@mlola-ui/icons": "^1.0.12"
1778
1778
  },
1779
1779
  "options": [
1780
1780
  {
@@ -1851,8 +1851,8 @@
1851
1851
  },
1852
1852
  "registryDependencies": [],
1853
1853
  "engineDependencies": {
1854
- "@mlola-ui/behavior": "^1.0.11",
1855
- "@mlola-ui/icons": "^1.0.11"
1854
+ "@mlola-ui/behavior": "^1.0.12",
1855
+ "@mlola-ui/icons": "^1.0.12"
1856
1856
  },
1857
1857
  "options": [
1858
1858
  {
@@ -1984,7 +1984,7 @@
1984
1984
  },
1985
1985
  "registryDependencies": [],
1986
1986
  "engineDependencies": {
1987
- "@mlola-ui/behavior": "^1.0.11"
1987
+ "@mlola-ui/behavior": "^1.0.12"
1988
1988
  },
1989
1989
  "options": [
1990
1990
  {
@@ -2129,7 +2129,7 @@
2129
2129
  },
2130
2130
  "registryDependencies": [],
2131
2131
  "engineDependencies": {
2132
- "@mlola-ui/behavior": "^1.0.11"
2132
+ "@mlola-ui/behavior": "^1.0.12"
2133
2133
  },
2134
2134
  "options": [
2135
2135
  {
@@ -2255,7 +2255,7 @@
2255
2255
  },
2256
2256
  "registryDependencies": [],
2257
2257
  "engineDependencies": {
2258
- "@mlola-ui/icons": "^1.0.11"
2258
+ "@mlola-ui/icons": "^1.0.12"
2259
2259
  },
2260
2260
  "options": [
2261
2261
  {
@@ -2341,7 +2341,7 @@
2341
2341
  "spinner"
2342
2342
  ],
2343
2343
  "engineDependencies": {
2344
- "@mlola-ui/icons": "^1.0.11"
2344
+ "@mlola-ui/icons": "^1.0.12"
2345
2345
  },
2346
2346
  "options": [
2347
2347
  {
@@ -2615,7 +2615,7 @@
2615
2615
  },
2616
2616
  "registryDependencies": [],
2617
2617
  "engineDependencies": {
2618
- "@mlola-ui/icons": "^1.0.11"
2618
+ "@mlola-ui/icons": "^1.0.12"
2619
2619
  },
2620
2620
  "options": [
2621
2621
  {
@@ -2687,7 +2687,7 @@
2687
2687
  "popover"
2688
2688
  ],
2689
2689
  "engineDependencies": {
2690
- "@mlola-ui/icons": "^1.0.11"
2690
+ "@mlola-ui/icons": "^1.0.12"
2691
2691
  },
2692
2692
  "options": [
2693
2693
  {
@@ -2757,7 +2757,7 @@
2757
2757
  "popover"
2758
2758
  ],
2759
2759
  "engineDependencies": {
2760
- "@mlola-ui/icons": "^1.0.11"
2760
+ "@mlola-ui/icons": "^1.0.12"
2761
2761
  },
2762
2762
  "options": [],
2763
2763
  "variants": [],
@@ -2955,7 +2955,7 @@
2955
2955
  "input"
2956
2956
  ],
2957
2957
  "engineDependencies": {
2958
- "@mlola-ui/icons": "^1.0.11"
2958
+ "@mlola-ui/icons": "^1.0.12"
2959
2959
  },
2960
2960
  "options": [
2961
2961
  {
@@ -3032,7 +3032,7 @@
3032
3032
  "input"
3033
3033
  ],
3034
3034
  "engineDependencies": {
3035
- "@mlola-ui/icons": "^1.0.11"
3035
+ "@mlola-ui/icons": "^1.0.12"
3036
3036
  },
3037
3037
  "options": [],
3038
3038
  "variants": [],
@@ -3087,7 +3087,7 @@
3087
3087
  "input"
3088
3088
  ],
3089
3089
  "engineDependencies": {
3090
- "@mlola-ui/icons": "^1.0.11"
3090
+ "@mlola-ui/icons": "^1.0.12"
3091
3091
  },
3092
3092
  "options": [],
3093
3093
  "variants": [],
@@ -3150,7 +3150,7 @@
3150
3150
  "popover"
3151
3151
  ],
3152
3152
  "engineDependencies": {
3153
- "@mlola-ui/icons": "^1.0.11"
3153
+ "@mlola-ui/icons": "^1.0.12"
3154
3154
  },
3155
3155
  "options": [
3156
3156
  {
@@ -3220,7 +3220,7 @@
3220
3220
  },
3221
3221
  "registryDependencies": [],
3222
3222
  "engineDependencies": {
3223
- "@mlola-ui/icons": "^1.0.11"
3223
+ "@mlola-ui/icons": "^1.0.12"
3224
3224
  },
3225
3225
  "options": [
3226
3226
  {
@@ -3339,8 +3339,8 @@
3339
3339
  },
3340
3340
  "registryDependencies": [],
3341
3341
  "engineDependencies": {
3342
- "@mlola-ui/behavior": "^1.0.11",
3343
- "@mlola-ui/icons": "^1.0.11"
3342
+ "@mlola-ui/behavior": "^1.0.12",
3343
+ "@mlola-ui/icons": "^1.0.12"
3344
3344
  },
3345
3345
  "options": [],
3346
3346
  "variants": [],
@@ -3404,7 +3404,7 @@
3404
3404
  },
3405
3405
  "registryDependencies": [],
3406
3406
  "engineDependencies": {
3407
- "@mlola-ui/behavior": "^1.0.11"
3407
+ "@mlola-ui/behavior": "^1.0.12"
3408
3408
  },
3409
3409
  "options": [
3410
3410
  {
@@ -3491,8 +3491,8 @@
3491
3491
  },
3492
3492
  "registryDependencies": [],
3493
3493
  "engineDependencies": {
3494
- "@mlola-ui/behavior": "^1.0.11",
3495
- "@mlola-ui/icons": "^1.0.11"
3494
+ "@mlola-ui/behavior": "^1.0.12",
3495
+ "@mlola-ui/icons": "^1.0.12"
3496
3496
  },
3497
3497
  "options": [],
3498
3498
  "variants": [],
@@ -3560,7 +3560,7 @@
3560
3560
  "sheet"
3561
3561
  ],
3562
3562
  "engineDependencies": {
3563
- "@mlola-ui/icons": "^1.0.11"
3563
+ "@mlola-ui/icons": "^1.0.12"
3564
3564
  },
3565
3565
  "options": [],
3566
3566
  "variants": [],
@@ -3677,7 +3677,7 @@
3677
3677
  "button"
3678
3678
  ],
3679
3679
  "engineDependencies": {
3680
- "@mlola-ui/icons": "^1.0.11"
3680
+ "@mlola-ui/icons": "^1.0.12"
3681
3681
  },
3682
3682
  "options": [
3683
3683
  {
@@ -3772,8 +3772,8 @@
3772
3772
  "input"
3773
3773
  ],
3774
3774
  "engineDependencies": {
3775
- "@mlola-ui/behavior": "^1.0.11",
3776
- "@mlola-ui/icons": "^1.0.11"
3775
+ "@mlola-ui/behavior": "^1.0.12",
3776
+ "@mlola-ui/icons": "^1.0.12"
3777
3777
  },
3778
3778
  "options": [
3779
3779
  {
@@ -4,7 +4,15 @@ import * as React from "react";
4
4
  import { cx } from "../_internal/react";
5
5
  import { IconChevronRight } from "@mlola-ui/icons";
6
6
 
7
- export type BreadcrumbItemType = { label: string; href?: string };
7
+ export type BreadcrumbItemType = {
8
+ label: string;
9
+ /** A link to the page. */
10
+ href?: string;
11
+ /** In-app navigation without a URL; the item becomes a button. */
12
+ onSelect?: () => void;
13
+ /** A decorative mark before the label, such as a page's icon. */
14
+ icon?: React.ReactNode;
15
+ };
8
16
  type BreadcrumbProps = { items: BreadcrumbItemType[]; separator?: React.ReactNode; className?: string };
9
17
 
10
18
  const BreadcrumbList = React.forwardRef<HTMLOListElement, React.OlHTMLAttributes<HTMLOListElement>>(
@@ -29,6 +37,8 @@ function BreadcrumbEllipsis({ className }: { className?: string }) {
29
37
  return <span aria-hidden="true" className={cx("ml-breadcrumb-ellipsis", className)}>…</span>;
30
38
  }
31
39
 
40
+ const icon = (item: BreadcrumbItemType) => (item.icon ? <span aria-hidden="true" className="ml-breadcrumb-icon">{item.icon}</span> : null);
41
+
32
42
  export function Breadcrumb({ items, separator, className }: BreadcrumbProps) {
33
43
  const last = items.length - 1;
34
44
  const collapse = items.length > 3;
@@ -46,9 +56,13 @@ export function Breadcrumb({ items, separator, className }: BreadcrumbProps) {
46
56
  </BreadcrumbItem>
47
57
  ) : null}
48
58
  <BreadcrumbItem data-collapsible={middle && collapse ? "" : undefined}>
49
- {current || !item.href
50
- ? <BreadcrumbPage>{item.label}</BreadcrumbPage>
51
- : <BreadcrumbLink href={item.href}>{item.label}</BreadcrumbLink>}
59
+ {current || (!item.href && !item.onSelect) ? (
60
+ <BreadcrumbPage>{icon(item)}{item.label}</BreadcrumbPage>
61
+ ) : item.href ? (
62
+ <BreadcrumbLink href={item.href}>{icon(item)}{item.label}</BreadcrumbLink>
63
+ ) : (
64
+ <button type="button" className="ml-breadcrumb-link" data-hit="expand" onClick={item.onSelect}>{icon(item)}{item.label}</button>
65
+ )}
52
66
  {!current ? <BreadcrumbSeparator>{separator}</BreadcrumbSeparator> : null}
53
67
  </BreadcrumbItem>
54
68
  </React.Fragment>
@@ -180,6 +180,7 @@ export function Carousel({
180
180
  aria-roledescription="carousel"
181
181
  aria-label={label}
182
182
  data-playing={playing || undefined}
183
+ data-arrows={(arrows && positions > 1) || undefined}
183
184
  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}
184
185
  onPointerEnter={() => setPaused(true)}
185
186
  onPointerLeave={() => setPaused(false)}
@@ -13,12 +13,12 @@
13
13
  "packages/components/app-shell/app-shell.tsx": "sha256-XAq82XOTH3ZR+hxTkYFu8P7Ih2aI6ERy/TpXc2VMUwM=",
14
14
  "packages/components/avatar/avatar.tsx": "sha256-EjqC8ytKqRtsTVdK6vncaDfhO/i7ICe+jwaYCg5bjIw=",
15
15
  "packages/components/badge/badge.tsx": "sha256-flEH8S2jZ/64n3Y/ROhC9+9rvF7wXaN0xLcMMwqNOVQ=",
16
- "packages/components/breadcrumb/breadcrumb.tsx": "sha256-Mt9mvmwwDgdp5/+mj5byIrh8+hicsp7R6UcvUlK0yog=",
16
+ "packages/components/breadcrumb/breadcrumb.tsx": "sha256-mxQpach2kFayT8H1vMt5252LQLxVV+sohdVXDhPuKoU=",
17
17
  "packages/components/button/button.tsx": "sha256-sXVANbGeFSYPHpiWuPvHHqMoPjG0zl0HSsKEdTgl5ME=",
18
18
  "packages/components/calendar/calendar.tsx": "sha256-rWiS4YAueZfVoo6j5Fi3uN7A+yApe5U6HMm1woTVjys=",
19
19
  "packages/components/calendar/dates.ts": "sha256-mygYkoC70av2ZQ0vkxf885trwW97Wd10I4dptYQe+4A=",
20
20
  "packages/components/card/card.tsx": "sha256-aMKbv5DWYYWq7GZAFR9O1fuYE0H61WCjkvEbRMOd894=",
21
- "packages/components/carousel/carousel.tsx": "sha256-pamugpB6Ujt9Ylxd37jNF/ZwSb8iRkW/MoYe12nY3i4=",
21
+ "packages/components/carousel/carousel.tsx": "sha256-Gsw0LhQsOuvdQN/F2KDGVC/gJq53+ifLs19u95RWCoU=",
22
22
  "packages/components/checkbox/checkbox.tsx": "sha256-hz4YbGwOxv/aJpJHrLXR4MKSWJGyjzoJEIGvdhyML9M=",
23
23
  "packages/components/color-picker/color-picker.tsx": "sha256-E+QB6MbSxg+3AZX3A7bOkst4arxgpmFL2ZmochoWCl8=",
24
24
  "packages/components/color-picker/color.ts": "sha256-YqSgYjzn7XfPWAHuyzbwOhbg/ScaSfB7V73e9w+OjJs=",