@vectoriox/iox-ui 5.35.0 → 5.36.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 (29) hide show
  1. package/composite-core/index.d.ts +348 -2
  2. package/design-core/index.d.ts +417 -0
  3. package/fesm2022/vectoriox-iox-ui-composite-core.mjs +899 -2
  4. package/fesm2022/vectoriox-iox-ui-composite-core.mjs.map +1 -1
  5. package/fesm2022/vectoriox-iox-ui-design-core.mjs +489 -0
  6. package/fesm2022/vectoriox-iox-ui-design-core.mjs.map +1 -1
  7. package/fesm2022/vectoriox-iox-ui-forms-core.mjs +2 -1
  8. package/fesm2022/vectoriox-iox-ui-forms-core.mjs.map +1 -1
  9. package/fesm2022/vectoriox-iox-ui-generation-core.mjs +113 -8
  10. package/fesm2022/vectoriox-iox-ui-generation-core.mjs.map +1 -1
  11. package/fesm2022/vectoriox-iox-ui.mjs +92 -19
  12. package/fesm2022/vectoriox-iox-ui.mjs.map +1 -1
  13. package/generation-core/index.d.ts +53 -3
  14. package/index.d.ts +58 -10
  15. package/package.json +1 -1
  16. package/src/composite-core/accordion-runtime.ts +354 -0
  17. package/src/composite-core/accordion.ts +650 -0
  18. package/src/composite-core/composite-node.ts +5 -0
  19. package/src/composite-core/public-api.ts +4 -1
  20. package/src/composite-core/structure.ts +7 -0
  21. package/src/design-core/flavor-spec.generated.ts +489 -0
  22. package/src/forms-core/nesting.ts +2 -1
  23. package/src/generation-core/compose-site.ts +49 -1
  24. package/src/generation-core/node-baselines.generated.ts +6 -2
  25. package/src/generation-core/patterns.ts +10 -0
  26. package/src/generation-core/serialized-node.ts +4 -0
  27. package/src/generation-core/site-spec.generated.ts +46 -1
  28. package/src/generation-core/validate-site-plan.ts +5 -4
  29. package/styles/iox-design.css +30 -0
package/design-core/index.d.ts CHANGED
@@ -789,6 +789,42 @@ declare const SPEC_TIERS: {
789
789
  readonly name: "tabbar-label-size";
790
790
  readonly type: "size";
791
791
  readonly default: "var(--iox-size-label)";
792
+ }, {
793
+ readonly name: "accordion-gap";
794
+ readonly type: "spacing";
795
+ readonly default: "0px";
796
+ }, {
797
+ readonly name: "accordion-item-bg";
798
+ readonly type: "color";
799
+ readonly default: "var(--iox-section-bg)";
800
+ }, {
801
+ readonly name: "accordion-item-border";
802
+ readonly type: "color";
803
+ readonly default: "var(--iox-line)";
804
+ }, {
805
+ readonly name: "accordion-item-border-width";
806
+ readonly type: "size";
807
+ readonly default: "0px 0px var(--iox-border-width) 0px";
808
+ }, {
809
+ readonly name: "accordion-item-radius";
810
+ readonly type: "radius";
811
+ readonly default: "0px";
812
+ }, {
813
+ readonly name: "accordion-item-pad";
814
+ readonly type: "spacing";
815
+ readonly default: "0px";
816
+ }, {
817
+ readonly name: "accordion-trigger-pad";
818
+ readonly type: "spacing";
819
+ readonly default: "20px 0px";
820
+ }, {
821
+ readonly name: "accordion-trigger-hover-ink";
822
+ readonly type: "color";
823
+ readonly default: "var(--iox-accent-text)";
824
+ }, {
825
+ readonly name: "accordion-panel-pad";
826
+ readonly type: "spacing";
827
+ readonly default: "0px 0px 20px 0px";
792
828
  }, {
793
829
  readonly name: "heading-color";
794
830
  readonly type: "color";
@@ -1532,6 +1568,46 @@ declare const SPEC_ELEMENT_STYLES: readonly [{
1532
1568
  readonly focus: {
1533
1569
  readonly boxShadow: "var(--iox-focus-ring)";
1534
1570
  };
1571
+ }, {
1572
+ readonly id: "accordion-item";
1573
+ readonly label: "Accordion item";
1574
+ readonly group: "Layout";
1575
+ readonly appliesTo: readonly ["Container"];
1576
+ readonly base: {
1577
+ readonly color: "inherit";
1578
+ readonly backgroundColor: "var(--iox-accordion-item-bg)";
1579
+ readonly borderStyle: "solid";
1580
+ readonly borderWidth: "var(--iox-accordion-item-border-width)";
1581
+ readonly borderColor: "var(--iox-accordion-item-border)";
1582
+ readonly borderRadius: "var(--iox-accordion-item-radius)";
1583
+ readonly padding: "var(--iox-accordion-item-pad)";
1584
+ };
1585
+ }, {
1586
+ readonly id: "accordion-trigger";
1587
+ readonly label: "Accordion header";
1588
+ readonly group: "Layout";
1589
+ readonly appliesTo: readonly ["LinkedContainer"];
1590
+ readonly base: {
1591
+ readonly color: "var(--iox-heading-color)";
1592
+ readonly padding: "var(--iox-accordion-trigger-pad)";
1593
+ readonly transitionDuration: "var(--iox-dur-fast)";
1594
+ readonly transitionTimingFunction: "var(--iox-ease-standard)";
1595
+ };
1596
+ readonly hover: {
1597
+ readonly color: "var(--iox-accordion-trigger-hover-ink)";
1598
+ };
1599
+ readonly focus: {
1600
+ readonly boxShadow: "var(--iox-focus-ring)";
1601
+ };
1602
+ }, {
1603
+ readonly id: "accordion-panel";
1604
+ readonly label: "Accordion panel";
1605
+ readonly group: "Layout";
1606
+ readonly appliesTo: readonly ["Container"];
1607
+ readonly base: {
1608
+ readonly padding: "var(--iox-accordion-panel-pad)";
1609
+ readonly color: "var(--iox-text-muted)";
1610
+ };
1535
1611
  }, {
1536
1612
  readonly id: "media";
1537
1613
  readonly label: "Image";
@@ -3362,6 +3438,60 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
3362
3438
  readonly type: "size";
3363
3439
  readonly group: "components";
3364
3440
  readonly value: "var(--iox-size-label)";
3441
+ }, {
3442
+ readonly name: "accordion-gap";
3443
+ readonly tier: "component";
3444
+ readonly type: "spacing";
3445
+ readonly group: "components";
3446
+ readonly value: "0px";
3447
+ }, {
3448
+ readonly name: "accordion-item-bg";
3449
+ readonly tier: "component";
3450
+ readonly type: "color";
3451
+ readonly group: "components";
3452
+ readonly value: "var(--iox-section-bg)";
3453
+ }, {
3454
+ readonly name: "accordion-item-border";
3455
+ readonly tier: "component";
3456
+ readonly type: "color";
3457
+ readonly group: "components";
3458
+ readonly value: "var(--iox-line)";
3459
+ }, {
3460
+ readonly name: "accordion-item-border-width";
3461
+ readonly tier: "component";
3462
+ readonly type: "size";
3463
+ readonly group: "components";
3464
+ readonly value: "0px 0px var(--iox-border-width) 0px";
3465
+ }, {
3466
+ readonly name: "accordion-item-radius";
3467
+ readonly tier: "component";
3468
+ readonly type: "radius";
3469
+ readonly group: "components";
3470
+ readonly value: "0px";
3471
+ }, {
3472
+ readonly name: "accordion-item-pad";
3473
+ readonly tier: "component";
3474
+ readonly type: "spacing";
3475
+ readonly group: "components";
3476
+ readonly value: "0px";
3477
+ }, {
3478
+ readonly name: "accordion-trigger-pad";
3479
+ readonly tier: "component";
3480
+ readonly type: "spacing";
3481
+ readonly group: "components";
3482
+ readonly value: "20px 0px";
3483
+ }, {
3484
+ readonly name: "accordion-trigger-hover-ink";
3485
+ readonly tier: "component";
3486
+ readonly type: "color";
3487
+ readonly group: "components";
3488
+ readonly value: "var(--iox-accent-text)";
3489
+ }, {
3490
+ readonly name: "accordion-panel-pad";
3491
+ readonly tier: "component";
3492
+ readonly type: "spacing";
3493
+ readonly group: "components";
3494
+ readonly value: "0px 0px 20px 0px";
3365
3495
  }, {
3366
3496
  readonly name: "heading-color";
3367
3497
  readonly tier: "component";
@@ -4690,6 +4820,60 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
4690
4820
  readonly type: "size";
4691
4821
  readonly group: "components";
4692
4822
  readonly value: "var(--iox-size-label)";
4823
+ }, {
4824
+ readonly name: "accordion-gap";
4825
+ readonly tier: "component";
4826
+ readonly type: "spacing";
4827
+ readonly group: "components";
4828
+ readonly value: "0px";
4829
+ }, {
4830
+ readonly name: "accordion-item-bg";
4831
+ readonly tier: "component";
4832
+ readonly type: "color";
4833
+ readonly group: "components";
4834
+ readonly value: "var(--iox-section-bg)";
4835
+ }, {
4836
+ readonly name: "accordion-item-border";
4837
+ readonly tier: "component";
4838
+ readonly type: "color";
4839
+ readonly group: "components";
4840
+ readonly value: "var(--iox-line)";
4841
+ }, {
4842
+ readonly name: "accordion-item-border-width";
4843
+ readonly tier: "component";
4844
+ readonly type: "size";
4845
+ readonly group: "components";
4846
+ readonly value: "0px 0px var(--iox-border-width) 0px";
4847
+ }, {
4848
+ readonly name: "accordion-item-radius";
4849
+ readonly tier: "component";
4850
+ readonly type: "radius";
4851
+ readonly group: "components";
4852
+ readonly value: "0px";
4853
+ }, {
4854
+ readonly name: "accordion-item-pad";
4855
+ readonly tier: "component";
4856
+ readonly type: "spacing";
4857
+ readonly group: "components";
4858
+ readonly value: "0px";
4859
+ }, {
4860
+ readonly name: "accordion-trigger-pad";
4861
+ readonly tier: "component";
4862
+ readonly type: "spacing";
4863
+ readonly group: "components";
4864
+ readonly value: "20px 0px";
4865
+ }, {
4866
+ readonly name: "accordion-trigger-hover-ink";
4867
+ readonly tier: "component";
4868
+ readonly type: "color";
4869
+ readonly group: "components";
4870
+ readonly value: "var(--iox-accent-text)";
4871
+ }, {
4872
+ readonly name: "accordion-panel-pad";
4873
+ readonly tier: "component";
4874
+ readonly type: "spacing";
4875
+ readonly group: "components";
4876
+ readonly value: "0px 0px 20px 0px";
4693
4877
  }, {
4694
4878
  readonly name: "heading-color";
4695
4879
  readonly tier: "component";
@@ -6010,6 +6194,60 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
6010
6194
  readonly type: "size";
6011
6195
  readonly group: "components";
6012
6196
  readonly value: "var(--iox-size-label)";
6197
+ }, {
6198
+ readonly name: "accordion-gap";
6199
+ readonly tier: "component";
6200
+ readonly type: "spacing";
6201
+ readonly group: "components";
6202
+ readonly value: "0px";
6203
+ }, {
6204
+ readonly name: "accordion-item-bg";
6205
+ readonly tier: "component";
6206
+ readonly type: "color";
6207
+ readonly group: "components";
6208
+ readonly value: "var(--iox-section-bg)";
6209
+ }, {
6210
+ readonly name: "accordion-item-border";
6211
+ readonly tier: "component";
6212
+ readonly type: "color";
6213
+ readonly group: "components";
6214
+ readonly value: "var(--iox-line)";
6215
+ }, {
6216
+ readonly name: "accordion-item-border-width";
6217
+ readonly tier: "component";
6218
+ readonly type: "size";
6219
+ readonly group: "components";
6220
+ readonly value: "0px 0px var(--iox-border-width) 0px";
6221
+ }, {
6222
+ readonly name: "accordion-item-radius";
6223
+ readonly tier: "component";
6224
+ readonly type: "radius";
6225
+ readonly group: "components";
6226
+ readonly value: "0px";
6227
+ }, {
6228
+ readonly name: "accordion-item-pad";
6229
+ readonly tier: "component";
6230
+ readonly type: "spacing";
6231
+ readonly group: "components";
6232
+ readonly value: "0px";
6233
+ }, {
6234
+ readonly name: "accordion-trigger-pad";
6235
+ readonly tier: "component";
6236
+ readonly type: "spacing";
6237
+ readonly group: "components";
6238
+ readonly value: "20px 0px";
6239
+ }, {
6240
+ readonly name: "accordion-trigger-hover-ink";
6241
+ readonly tier: "component";
6242
+ readonly type: "color";
6243
+ readonly group: "components";
6244
+ readonly value: "var(--iox-accent-text)";
6245
+ }, {
6246
+ readonly name: "accordion-panel-pad";
6247
+ readonly tier: "component";
6248
+ readonly type: "spacing";
6249
+ readonly group: "components";
6250
+ readonly value: "0px 0px 20px 0px";
6013
6251
  }, {
6014
6252
  readonly name: "heading-color";
6015
6253
  readonly tier: "component";
@@ -7366,6 +7604,66 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
7366
7604
  readonly type: "size";
7367
7605
  readonly group: "components";
7368
7606
  readonly value: "var(--iox-size-label)";
7607
+ }, {
7608
+ readonly name: "accordion-gap";
7609
+ readonly tier: "component";
7610
+ readonly type: "spacing";
7611
+ readonly group: "components";
7612
+ readonly value: "12px";
7613
+ readonly overridden: true;
7614
+ }, {
7615
+ readonly name: "accordion-item-bg";
7616
+ readonly tier: "component";
7617
+ readonly type: "color";
7618
+ readonly group: "components";
7619
+ readonly value: "var(--iox-surface-glass)";
7620
+ readonly overridden: true;
7621
+ }, {
7622
+ readonly name: "accordion-item-border";
7623
+ readonly tier: "component";
7624
+ readonly type: "color";
7625
+ readonly group: "components";
7626
+ readonly value: "var(--iox-glass-border)";
7627
+ readonly overridden: true;
7628
+ }, {
7629
+ readonly name: "accordion-item-border-width";
7630
+ readonly tier: "component";
7631
+ readonly type: "size";
7632
+ readonly group: "components";
7633
+ readonly value: "var(--iox-border-width)";
7634
+ readonly overridden: true;
7635
+ }, {
7636
+ readonly name: "accordion-item-radius";
7637
+ readonly tier: "component";
7638
+ readonly type: "radius";
7639
+ readonly group: "components";
7640
+ readonly value: "var(--iox-radius-md)";
7641
+ readonly overridden: true;
7642
+ }, {
7643
+ readonly name: "accordion-item-pad";
7644
+ readonly tier: "component";
7645
+ readonly type: "spacing";
7646
+ readonly group: "components";
7647
+ readonly value: "0px var(--iox-space-pad)";
7648
+ readonly overridden: true;
7649
+ }, {
7650
+ readonly name: "accordion-trigger-pad";
7651
+ readonly tier: "component";
7652
+ readonly type: "spacing";
7653
+ readonly group: "components";
7654
+ readonly value: "20px 0px";
7655
+ }, {
7656
+ readonly name: "accordion-trigger-hover-ink";
7657
+ readonly tier: "component";
7658
+ readonly type: "color";
7659
+ readonly group: "components";
7660
+ readonly value: "var(--iox-accent-text)";
7661
+ }, {
7662
+ readonly name: "accordion-panel-pad";
7663
+ readonly tier: "component";
7664
+ readonly type: "spacing";
7665
+ readonly group: "components";
7666
+ readonly value: "0px 0px 20px 0px";
7369
7667
  }, {
7370
7668
  readonly name: "heading-color";
7371
7669
  readonly tier: "component";
@@ -8687,6 +8985,65 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
8687
8985
  readonly type: "size";
8688
8986
  readonly group: "components";
8689
8987
  readonly value: "var(--iox-size-label)";
8988
+ }, {
8989
+ readonly name: "accordion-gap";
8990
+ readonly tier: "component";
8991
+ readonly type: "spacing";
8992
+ readonly group: "components";
8993
+ readonly value: "12px";
8994
+ readonly overridden: true;
8995
+ }, {
8996
+ readonly name: "accordion-item-bg";
8997
+ readonly tier: "component";
8998
+ readonly type: "color";
8999
+ readonly group: "components";
9000
+ readonly value: "var(--iox-surface-2)";
9001
+ readonly overridden: true;
9002
+ }, {
9003
+ readonly name: "accordion-item-border";
9004
+ readonly tier: "component";
9005
+ readonly type: "color";
9006
+ readonly group: "components";
9007
+ readonly value: "var(--iox-line)";
9008
+ }, {
9009
+ readonly name: "accordion-item-border-width";
9010
+ readonly tier: "component";
9011
+ readonly type: "size";
9012
+ readonly group: "components";
9013
+ readonly value: "0px";
9014
+ readonly overridden: true;
9015
+ }, {
9016
+ readonly name: "accordion-item-radius";
9017
+ readonly tier: "component";
9018
+ readonly type: "radius";
9019
+ readonly group: "components";
9020
+ readonly value: "var(--iox-radius-md)";
9021
+ readonly overridden: true;
9022
+ }, {
9023
+ readonly name: "accordion-item-pad";
9024
+ readonly tier: "component";
9025
+ readonly type: "spacing";
9026
+ readonly group: "components";
9027
+ readonly value: "0px var(--iox-space-pad)";
9028
+ readonly overridden: true;
9029
+ }, {
9030
+ readonly name: "accordion-trigger-pad";
9031
+ readonly tier: "component";
9032
+ readonly type: "spacing";
9033
+ readonly group: "components";
9034
+ readonly value: "20px 0px";
9035
+ }, {
9036
+ readonly name: "accordion-trigger-hover-ink";
9037
+ readonly tier: "component";
9038
+ readonly type: "color";
9039
+ readonly group: "components";
9040
+ readonly value: "var(--iox-accent-text)";
9041
+ }, {
9042
+ readonly name: "accordion-panel-pad";
9043
+ readonly tier: "component";
9044
+ readonly type: "spacing";
9045
+ readonly group: "components";
9046
+ readonly value: "0px 0px 20px 0px";
8690
9047
  }, {
8691
9048
  readonly name: "heading-color";
8692
9049
  readonly tier: "component";
@@ -10017,6 +10374,66 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
10017
10374
  readonly type: "size";
10018
10375
  readonly group: "components";
10019
10376
  readonly value: "var(--iox-size-label)";
10377
+ }, {
10378
+ readonly name: "accordion-gap";
10379
+ readonly tier: "component";
10380
+ readonly type: "spacing";
10381
+ readonly group: "components";
10382
+ readonly value: "12px";
10383
+ readonly overridden: true;
10384
+ }, {
10385
+ readonly name: "accordion-item-bg";
10386
+ readonly tier: "component";
10387
+ readonly type: "color";
10388
+ readonly group: "components";
10389
+ readonly value: "var(--iox-surface)";
10390
+ readonly overridden: true;
10391
+ }, {
10392
+ readonly name: "accordion-item-border";
10393
+ readonly tier: "component";
10394
+ readonly type: "color";
10395
+ readonly group: "components";
10396
+ readonly value: "var(--iox-line-strong)";
10397
+ readonly overridden: true;
10398
+ }, {
10399
+ readonly name: "accordion-item-border-width";
10400
+ readonly tier: "component";
10401
+ readonly type: "size";
10402
+ readonly group: "components";
10403
+ readonly value: "var(--iox-border-width)";
10404
+ readonly overridden: true;
10405
+ }, {
10406
+ readonly name: "accordion-item-radius";
10407
+ readonly tier: "component";
10408
+ readonly type: "radius";
10409
+ readonly group: "components";
10410
+ readonly value: "var(--iox-radius-sm)";
10411
+ readonly overridden: true;
10412
+ }, {
10413
+ readonly name: "accordion-item-pad";
10414
+ readonly tier: "component";
10415
+ readonly type: "spacing";
10416
+ readonly group: "components";
10417
+ readonly value: "0px var(--iox-space-pad)";
10418
+ readonly overridden: true;
10419
+ }, {
10420
+ readonly name: "accordion-trigger-pad";
10421
+ readonly tier: "component";
10422
+ readonly type: "spacing";
10423
+ readonly group: "components";
10424
+ readonly value: "20px 0px";
10425
+ }, {
10426
+ readonly name: "accordion-trigger-hover-ink";
10427
+ readonly tier: "component";
10428
+ readonly type: "color";
10429
+ readonly group: "components";
10430
+ readonly value: "var(--iox-accent-text)";
10431
+ }, {
10432
+ readonly name: "accordion-panel-pad";
10433
+ readonly tier: "component";
10434
+ readonly type: "spacing";
10435
+ readonly group: "components";
10436
+ readonly value: "0px 0px 20px 0px";
10020
10437
  }, {
10021
10438
  readonly name: "heading-color";
10022
10439
  readonly tier: "component";