@exponential_app/eui 0.2.1 → 0.3.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.
Files changed (66) hide show
  1. package/catalog/a11y.json +15 -1
  2. package/catalog/core.catalog.json +142 -0
  3. package/catalog/core.schema.json +198 -1
  4. package/catalog/host.json +10 -0
  5. package/catalog/macros.json +541 -1
  6. package/catalog/recipes.json +2 -2
  7. package/catalog/strings.json +5 -0
  8. package/catalog/theme.schema.json +2066 -212
  9. package/conformance/manifest.json +5 -5
  10. package/dist/chunks/{index-gtk2gwsb.js → index-4z7f2bp1.js} +160 -33
  11. package/dist/chunks/{index-gtk2gwsb.js.map → index-4z7f2bp1.js.map} +6 -5
  12. package/dist/chunks/{index-5fmaa0xq.js → index-abcjanhc.js} +629 -3
  13. package/dist/chunks/{index-5fmaa0xq.js.map → index-abcjanhc.js.map} +2 -2
  14. package/dist/chunks/{index-62yzr94z.js → index-dx45asrf.js} +99 -3
  15. package/dist/chunks/{index-62yzr94z.js.map → index-dx45asrf.js.map} +2 -2
  16. package/dist/chunks/{index-bg2jsgjq.js → index-h3zgfghf.js} +304 -6
  17. package/dist/chunks/{index-bg2jsgjq.js.map → index-h3zgfghf.js.map} +2 -2
  18. package/dist/conformance.js +7901 -614
  19. package/dist/conformance.js.map +2 -2
  20. package/dist/entries/prompt.js +2 -2
  21. package/dist/entries/schema.js +2 -2
  22. package/dist/host/index.js +20 -4
  23. package/dist/host/index.js.map +1 -1
  24. package/dist/index.js +35 -5
  25. package/dist/index.js.map +2 -2
  26. package/dist/types/src/catalog.generated.d.ts +23 -3
  27. package/dist/types/src/host/contract.d.ts +17 -0
  28. package/dist/types/src/host/exposes.d.ts +68 -0
  29. package/dist/types/src/host/index.d.ts +1 -0
  30. package/dist/types/src/host/package.d.ts +8 -0
  31. package/dist/types/src/web/primitives/carousel.d.ts +17 -0
  32. package/dist/types/src/web/primitives/index.d.ts +3 -0
  33. package/dist/types/src/web/primitives/mosaic.d.ts +30 -0
  34. package/dist/types/src/web/primitives/outline.d.ts +22 -0
  35. package/dist/web/index.js +8 -2
  36. package/dist/web/index.js.map +4 -4
  37. package/dist/web/primitives/index.js +59 -1
  38. package/dist/web/primitives/index.js.map +6 -3
  39. package/docs/components.generated.json +150 -1
  40. package/docs/package-format.md +56 -1
  41. package/docs/round-6-contract.md +108 -0
  42. package/docs/themes.generated.json +39 -2
  43. package/fixtures/bind-time.json +1464 -0
  44. package/fixtures/catalog-components.json +96 -0
  45. package/fixtures/catalog-macros.json +1159 -48
  46. package/fixtures/conformance-baseline.json +46073 -44448
  47. package/fixtures/conformance-known.json +76 -64
  48. package/fixtures/host-router.json +539 -1
  49. package/fixtures/kitchen-sink.expanded.json +614 -1
  50. package/fixtures/kitchen-sink.json +69 -1
  51. package/fixtures/primitive-specimens.json +3 -0
  52. package/fixtures/prompt-budget.json +14 -14
  53. package/fixtures/specimens.json +122 -0
  54. package/fixtures/theme-recipes.json +4617 -1691
  55. package/fixtures/theme-resolved.json +1154 -2
  56. package/generated/ExponentialUICatalog.generated.kt +13 -13
  57. package/generated/ExponentialUICatalog.generated.swift +13 -13
  58. package/generated/ExponentialUIThemes.generated.kt +7 -7
  59. package/generated/ExponentialUIThemes.generated.swift +7 -7
  60. package/generated/catalog.descriptions.generated.rs +1 -1
  61. package/generated/catalog.generated.rs +18 -18
  62. package/generated/catalog.themes.generated.rs +8 -8
  63. package/generated/core.descriptions.json +96 -0
  64. package/generated/core.runtime.json +86 -0
  65. package/package.json +1 -1
  66. package/themes/neutral.theme.json +288 -0
package/fixtures/kitchen-sink.expanded.json CHANGED
@@ -311,6 +311,322 @@
311
311
  "role": "navigation",
312
312
  "label": "$string.breadcrumb"
313
313
  }
314
+ },
315
+ {
316
+ "id": "outline",
317
+ "component": "Box",
318
+ "props": {},
319
+ "children": [
320
+ {
321
+ "id": "outline.caption",
322
+ "component": "Text",
323
+ "props": {
324
+ "text": "Outline",
325
+ "variant": "caption",
326
+ "lines": 1
327
+ },
328
+ "children": [],
329
+ "recipe": {
330
+ "macro": "Outline",
331
+ "part": "caption",
332
+ "props": {}
333
+ },
334
+ "accessibility": {
335
+ "hidden": true
336
+ }
337
+ },
338
+ {
339
+ "id": "outline.row.0",
340
+ "component": "Box",
341
+ "props": {
342
+ "pressable": true
343
+ },
344
+ "children": [
345
+ {
346
+ "id": "outline.row.0.title",
347
+ "component": "Text",
348
+ "props": {
349
+ "text": "Current state",
350
+ "lines": 1
351
+ },
352
+ "children": [],
353
+ "style": {
354
+ "flexGrow": 1,
355
+ "flexShrink": 1,
356
+ "flexBasis": 0,
357
+ "minWidth": 0
358
+ },
359
+ "recipe": {
360
+ "macro": "Outline",
361
+ "part": "title",
362
+ "props": {
363
+ "active": false
364
+ }
365
+ }
366
+ }
367
+ ],
368
+ "style": {
369
+ "display": "flex",
370
+ "flexDirection": "row",
371
+ "alignItems": "center",
372
+ "gap": "$spacing.xs",
373
+ "position": "relative",
374
+ "height": "$control.rowCompact",
375
+ "paddingHorizontal": "$spacing.sm",
376
+ "minWidth": 0,
377
+ "overflow": "hidden",
378
+ "cursor": "pointer"
379
+ },
380
+ "recipe": {
381
+ "macro": "Outline",
382
+ "part": "row",
383
+ "props": {
384
+ "active": false
385
+ }
386
+ },
387
+ "on": {
388
+ "press": {
389
+ "event": {
390
+ "name": "outlineSelect",
391
+ "context": {
392
+ "id": "current"
393
+ }
394
+ }
395
+ }
396
+ },
397
+ "accessibility": {
398
+ "role": "link",
399
+ "label": "Current state",
400
+ "current": false
401
+ }
402
+ },
403
+ {
404
+ "id": "outline.row.1",
405
+ "component": "Box",
406
+ "props": {
407
+ "pressable": true
408
+ },
409
+ "children": [
410
+ {
411
+ "id": "outline.row.1.bar",
412
+ "component": "Box",
413
+ "props": {},
414
+ "children": [],
415
+ "style": {
416
+ "position": "absolute",
417
+ "insetInlineStart": 0,
418
+ "top": 0,
419
+ "bottom": 0,
420
+ "width": 2
421
+ },
422
+ "recipe": {
423
+ "macro": "Outline",
424
+ "part": "bar",
425
+ "props": {}
426
+ },
427
+ "accessibility": {
428
+ "hidden": true
429
+ }
430
+ },
431
+ {
432
+ "id": "outline.row.1.title",
433
+ "component": "Text",
434
+ "props": {
435
+ "text": "Part A: editor-first creation",
436
+ "lines": 1
437
+ },
438
+ "children": [],
439
+ "style": {
440
+ "flexGrow": 1,
441
+ "flexShrink": 1,
442
+ "flexBasis": 0,
443
+ "minWidth": 0
444
+ },
445
+ "recipe": {
446
+ "macro": "Outline",
447
+ "part": "title",
448
+ "props": {
449
+ "active": true
450
+ }
451
+ }
452
+ },
453
+ {
454
+ "id": "outline.row.1.count",
455
+ "component": "Text",
456
+ "props": {
457
+ "text": "· 5",
458
+ "variant": "caption",
459
+ "lines": 1
460
+ },
461
+ "children": [],
462
+ "style": {
463
+ "flexShrink": 0
464
+ },
465
+ "recipe": {
466
+ "macro": "Outline",
467
+ "part": "count",
468
+ "props": {}
469
+ },
470
+ "accessibility": {
471
+ "hidden": true
472
+ }
473
+ }
474
+ ],
475
+ "style": {
476
+ "display": "flex",
477
+ "flexDirection": "row",
478
+ "alignItems": "center",
479
+ "gap": "$spacing.xs",
480
+ "position": "relative",
481
+ "height": "$control.rowCompact",
482
+ "paddingHorizontal": "$spacing.sm",
483
+ "minWidth": 0,
484
+ "overflow": "hidden",
485
+ "cursor": "pointer"
486
+ },
487
+ "recipe": {
488
+ "macro": "Outline",
489
+ "part": "row",
490
+ "props": {
491
+ "active": true
492
+ }
493
+ },
494
+ "on": {
495
+ "press": {
496
+ "event": {
497
+ "name": "outlineSelect",
498
+ "context": {
499
+ "id": "part-a"
500
+ }
501
+ }
502
+ }
503
+ },
504
+ "accessibility": {
505
+ "role": "link",
506
+ "label": {
507
+ "call": "fill",
508
+ "args": {
509
+ "template": "$string.outlineRow",
510
+ "params": {
511
+ "title": "Part A: editor-first creation",
512
+ "count": 5
513
+ }
514
+ }
515
+ },
516
+ "current": "location"
517
+ }
518
+ },
519
+ {
520
+ "id": "outline.row.2",
521
+ "component": "Box",
522
+ "props": {
523
+ "pressable": true
524
+ },
525
+ "children": [
526
+ {
527
+ "id": "outline.row.2.title",
528
+ "component": "Text",
529
+ "props": {
530
+ "text": "Part B: MCP for eApps",
531
+ "lines": 1
532
+ },
533
+ "children": [],
534
+ "style": {
535
+ "flexGrow": 1,
536
+ "flexShrink": 1,
537
+ "flexBasis": 0,
538
+ "minWidth": 0
539
+ },
540
+ "recipe": {
541
+ "macro": "Outline",
542
+ "part": "title",
543
+ "props": {
544
+ "active": false
545
+ }
546
+ }
547
+ },
548
+ {
549
+ "id": "outline.row.2.count",
550
+ "component": "Text",
551
+ "props": {
552
+ "text": "· 2",
553
+ "variant": "caption",
554
+ "lines": 1
555
+ },
556
+ "children": [],
557
+ "style": {
558
+ "flexShrink": 0
559
+ },
560
+ "recipe": {
561
+ "macro": "Outline",
562
+ "part": "count",
563
+ "props": {}
564
+ },
565
+ "accessibility": {
566
+ "hidden": true
567
+ }
568
+ }
569
+ ],
570
+ "style": {
571
+ "display": "flex",
572
+ "flexDirection": "row",
573
+ "alignItems": "center",
574
+ "gap": "$spacing.xs",
575
+ "position": "relative",
576
+ "height": "$control.rowCompact",
577
+ "paddingHorizontal": "$spacing.sm",
578
+ "minWidth": 0,
579
+ "overflow": "hidden",
580
+ "cursor": "pointer"
581
+ },
582
+ "recipe": {
583
+ "macro": "Outline",
584
+ "part": "row",
585
+ "props": {
586
+ "active": false
587
+ }
588
+ },
589
+ "on": {
590
+ "press": {
591
+ "event": {
592
+ "name": "outlineSelect",
593
+ "context": {
594
+ "id": "part-b"
595
+ }
596
+ }
597
+ }
598
+ },
599
+ "accessibility": {
600
+ "role": "link",
601
+ "label": {
602
+ "call": "fill",
603
+ "args": {
604
+ "template": "$string.outlineRow",
605
+ "params": {
606
+ "title": "Part B: MCP for eApps",
607
+ "count": 2
608
+ }
609
+ }
610
+ },
611
+ "current": false
612
+ }
613
+ }
614
+ ],
615
+ "style": {
616
+ "display": "flex",
617
+ "flexDirection": "column",
618
+ "gap": "$spacing.xxs",
619
+ "minWidth": 0
620
+ },
621
+ "recipe": {
622
+ "macro": "Outline",
623
+ "part": "root",
624
+ "props": {}
625
+ },
626
+ "accessibility": {
627
+ "role": "navigation",
628
+ "label": "Outline"
629
+ }
314
630
  }
315
631
  ],
316
632
  "style": {
@@ -7016,7 +7332,12 @@
7016
7332
  "component": "Carousel",
7017
7333
  "props": {
7018
7334
  "page": 0,
7019
- "indicators": true
7335
+ "indicators": true,
7336
+ "counter": true,
7337
+ "thumbnails": [
7338
+ "https://example.com/1.jpg",
7339
+ "https://example.com/2.jpg"
7340
+ ]
7020
7341
  },
7021
7342
  "children": [
7022
7343
  {
@@ -7041,6 +7362,298 @@
7041
7362
  }
7042
7363
  ]
7043
7364
  },
7365
+ {
7366
+ "id": "mosaic",
7367
+ "component": "Box",
7368
+ "props": {},
7369
+ "children": [
7370
+ {
7371
+ "id": "mosaic.lead",
7372
+ "component": "Box",
7373
+ "props": {
7374
+ "pressable": true
7375
+ },
7376
+ "children": [
7377
+ {
7378
+ "id": "mosaic.lead.image",
7379
+ "component": "Image",
7380
+ "props": {
7381
+ "src": "https://example.com/1.jpg",
7382
+ "alt": "One",
7383
+ "fit": "cover"
7384
+ },
7385
+ "children": [],
7386
+ "style": {
7387
+ "position": "absolute",
7388
+ "inset": 0,
7389
+ "width": "100%",
7390
+ "height": "100%"
7391
+ },
7392
+ "recipe": {
7393
+ "macro": "Mosaic",
7394
+ "part": "image",
7395
+ "props": {}
7396
+ },
7397
+ "accessibility": {
7398
+ "hidden": true
7399
+ }
7400
+ }
7401
+ ],
7402
+ "style": {
7403
+ "position": "relative",
7404
+ "overflow": "hidden",
7405
+ "minWidth": 0,
7406
+ "minHeight": 0,
7407
+ "cursor": "pointer",
7408
+ "flexGrow": 0,
7409
+ "flexShrink": 0,
7410
+ "flexBasis": "60%",
7411
+ "height": "100%"
7412
+ },
7413
+ "recipe": {
7414
+ "macro": "Mosaic",
7415
+ "part": "lead",
7416
+ "props": {
7417
+ "size": "large"
7418
+ }
7419
+ },
7420
+ "on": {
7421
+ "press": {
7422
+ "event": {
7423
+ "name": "mosaicSelect",
7424
+ "context": {
7425
+ "index": 0
7426
+ }
7427
+ }
7428
+ }
7429
+ },
7430
+ "accessibility": {
7431
+ "role": "button",
7432
+ "label": "One"
7433
+ }
7434
+ },
7435
+ {
7436
+ "id": "mosaic.side",
7437
+ "component": "Box",
7438
+ "props": {},
7439
+ "children": [
7440
+ {
7441
+ "id": "mosaic.side.top",
7442
+ "component": "Box",
7443
+ "props": {
7444
+ "pressable": true
7445
+ },
7446
+ "children": [
7447
+ {
7448
+ "id": "mosaic.side.top.image",
7449
+ "component": "Image",
7450
+ "props": {
7451
+ "src": "https://example.com/2.jpg",
7452
+ "alt": "Two",
7453
+ "fit": "cover"
7454
+ },
7455
+ "children": [],
7456
+ "style": {
7457
+ "position": "absolute",
7458
+ "inset": 0,
7459
+ "width": "100%",
7460
+ "height": "100%"
7461
+ },
7462
+ "recipe": {
7463
+ "macro": "Mosaic",
7464
+ "part": "image",
7465
+ "props": {}
7466
+ },
7467
+ "accessibility": {
7468
+ "hidden": true
7469
+ }
7470
+ }
7471
+ ],
7472
+ "style": {
7473
+ "position": "relative",
7474
+ "overflow": "hidden",
7475
+ "minWidth": 0,
7476
+ "minHeight": 0,
7477
+ "cursor": "pointer",
7478
+ "flexGrow": 1,
7479
+ "flexShrink": 1,
7480
+ "flexBasis": 0,
7481
+ "width": "100%"
7482
+ },
7483
+ "recipe": {
7484
+ "macro": "Mosaic",
7485
+ "part": "top",
7486
+ "props": {
7487
+ "size": "small"
7488
+ }
7489
+ },
7490
+ "on": {
7491
+ "press": {
7492
+ "event": {
7493
+ "name": "mosaicSelect",
7494
+ "context": {
7495
+ "index": 1
7496
+ }
7497
+ }
7498
+ }
7499
+ },
7500
+ "accessibility": {
7501
+ "role": "button",
7502
+ "label": "Two"
7503
+ }
7504
+ },
7505
+ {
7506
+ "id": "mosaic.side.bottom",
7507
+ "component": "Box",
7508
+ "props": {
7509
+ "pressable": true
7510
+ },
7511
+ "children": [
7512
+ {
7513
+ "id": "mosaic.side.bottom.image",
7514
+ "component": "Image",
7515
+ "props": {
7516
+ "src": "https://example.com/3.jpg",
7517
+ "alt": "Three",
7518
+ "fit": "cover"
7519
+ },
7520
+ "children": [],
7521
+ "style": {
7522
+ "position": "absolute",
7523
+ "inset": 0,
7524
+ "width": "100%",
7525
+ "height": "100%"
7526
+ },
7527
+ "recipe": {
7528
+ "macro": "Mosaic",
7529
+ "part": "image",
7530
+ "props": {}
7531
+ },
7532
+ "accessibility": {
7533
+ "hidden": true
7534
+ }
7535
+ },
7536
+ {
7537
+ "id": "mosaic.side.bottom.more",
7538
+ "component": "Box",
7539
+ "props": {},
7540
+ "children": [
7541
+ {
7542
+ "id": "mosaic.side.bottom.more.moreLabel",
7543
+ "component": "Text",
7544
+ "props": {
7545
+ "text": {
7546
+ "call": "fill",
7547
+ "args": {
7548
+ "template": "$string.morePictures",
7549
+ "params": {
7550
+ "count": 1
7551
+ }
7552
+ }
7553
+ },
7554
+ "lines": 1
7555
+ },
7556
+ "children": [],
7557
+ "recipe": {
7558
+ "macro": "Mosaic",
7559
+ "part": "moreLabel",
7560
+ "props": {}
7561
+ }
7562
+ }
7563
+ ],
7564
+ "style": {
7565
+ "position": "absolute",
7566
+ "inset": 0,
7567
+ "display": "flex",
7568
+ "alignItems": "center",
7569
+ "justifyContent": "center"
7570
+ },
7571
+ "recipe": {
7572
+ "macro": "Mosaic",
7573
+ "part": "more",
7574
+ "props": {}
7575
+ },
7576
+ "accessibility": {
7577
+ "hidden": true
7578
+ }
7579
+ }
7580
+ ],
7581
+ "style": {
7582
+ "position": "relative",
7583
+ "overflow": "hidden",
7584
+ "minWidth": 0,
7585
+ "minHeight": 0,
7586
+ "cursor": "pointer",
7587
+ "flexGrow": 1,
7588
+ "flexShrink": 1,
7589
+ "flexBasis": 0,
7590
+ "width": "100%"
7591
+ },
7592
+ "recipe": {
7593
+ "macro": "Mosaic",
7594
+ "part": "bottom",
7595
+ "props": {
7596
+ "size": "small"
7597
+ }
7598
+ },
7599
+ "on": {
7600
+ "press": {
7601
+ "event": {
7602
+ "name": "mosaicSelect",
7603
+ "context": {
7604
+ "index": 2
7605
+ }
7606
+ }
7607
+ }
7608
+ },
7609
+ "accessibility": {
7610
+ "role": "button",
7611
+ "label": {
7612
+ "call": "fill",
7613
+ "args": {
7614
+ "template": "$string.morePicturesLabel",
7615
+ "params": {
7616
+ "alt": "Three",
7617
+ "count": 1
7618
+ }
7619
+ }
7620
+ }
7621
+ }
7622
+ }
7623
+ ],
7624
+ "style": {
7625
+ "display": "flex",
7626
+ "flexDirection": "column",
7627
+ "flexGrow": 1,
7628
+ "flexShrink": 1,
7629
+ "flexBasis": 0,
7630
+ "minWidth": 0,
7631
+ "height": "100%"
7632
+ },
7633
+ "recipe": {
7634
+ "macro": "Mosaic",
7635
+ "part": "side",
7636
+ "props": {}
7637
+ }
7638
+ }
7639
+ ],
7640
+ "style": {
7641
+ "display": "flex",
7642
+ "flexDirection": "row",
7643
+ "width": "100%",
7644
+ "aspectRatio": 1.6,
7645
+ "minWidth": 0
7646
+ },
7647
+ "recipe": {
7648
+ "macro": "Mosaic",
7649
+ "part": "root",
7650
+ "props": {}
7651
+ },
7652
+ "accessibility": {
7653
+ "role": "group",
7654
+ "label": "Screens"
7655
+ }
7656
+ },
7044
7657
  {
7045
7658
  "id": "video",
7046
7659
  "component": "Video",