@genesislcap/foundation-zero 14.172.3 → 14.173.1

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.
@@ -701,37 +701,6 @@
701
701
  }
702
702
  ]
703
703
  },
704
- {
705
- "kind": "javascript-module",
706
- "path": "src/_config/index.ts",
707
- "declarations": [],
708
- "exports": [
709
- {
710
- "kind": "js",
711
- "name": "*",
712
- "declaration": {
713
- "name": "*",
714
- "package": "./styles"
715
- }
716
- },
717
- {
718
- "kind": "js",
719
- "name": "*",
720
- "declaration": {
721
- "name": "*",
722
- "package": "./tokens"
723
- }
724
- },
725
- {
726
- "kind": "js",
727
- "name": "*",
728
- "declaration": {
729
- "name": "*",
730
- "package": "./values"
731
- }
732
- }
733
- ]
734
- },
735
704
  {
736
705
  "kind": "javascript-module",
737
706
  "path": "src/_common/colors.hex.ts",
@@ -1419,6 +1388,37 @@
1419
1388
  }
1420
1389
  ]
1421
1390
  },
1391
+ {
1392
+ "kind": "javascript-module",
1393
+ "path": "src/_config/index.ts",
1394
+ "declarations": [],
1395
+ "exports": [
1396
+ {
1397
+ "kind": "js",
1398
+ "name": "*",
1399
+ "declaration": {
1400
+ "name": "*",
1401
+ "package": "./styles"
1402
+ }
1403
+ },
1404
+ {
1405
+ "kind": "js",
1406
+ "name": "*",
1407
+ "declaration": {
1408
+ "name": "*",
1409
+ "package": "./tokens"
1410
+ }
1411
+ },
1412
+ {
1413
+ "kind": "js",
1414
+ "name": "*",
1415
+ "declaration": {
1416
+ "name": "*",
1417
+ "package": "./values"
1418
+ }
1419
+ }
1420
+ ]
1421
+ },
1422
1422
  {
1423
1423
  "kind": "javascript-module",
1424
1424
  "path": "src/actions-menu/actions-menu.stories.ts",
@@ -11856,7 +11856,7 @@
11856
11856
  {
11857
11857
  "kind": "variable",
11858
11858
  "name": "zeroDialogStyles",
11859
- "default": "css`\n ${foundationDialogStyles}\n :host {\n --color-error: ${ColorHEX.error};\n --color-success: ${ColorHEX.success};\n --dialog-background: ${neutralLayer2};\n }\n\n dialog {\n position: fixed;\n top: 0;\n bottom: 0;\n color: rgb(255 255 255 / 30%);\n border-radius: calc(var(--control-corner-radius) * 1px);\n border: 1px solid ${ColorHEX.lightGrey};\n text-align: left;\n line-height: normal;\n box-shadow: 0 2px 15px 0 rgb(0 0 0 / 35%);\n }\n\n .top {\n display: flex;\n align-items: center;\n justify-content: space-between;\n color: ${ColorHEX.almostWhite};\n margin-bottom: calc(var(--design-unit) * 2px);\n }\n\n .bottom {\n display: flex;\n flex-wrap: wrap;\n justify-content: flex-end;\n color: ${ColorHEX.almostWhite};\n }\n\n :host slot:first-of-type {\n color: ${neutralForegroundRest};\n }\n\n ::slotted(zero-button) {\n margin-top: calc(var(--design-unit) * 4px - 1px);\n }\n\n .content-wrapper {\n min-width: var(--dialog-min-width);\n min-height: var(--dialog-min-height);\n height: fit-content;\n width: fit-content;\n max-width: var(--dialog-max-width);\n max-height: var(--dialog-max-height);\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n align-items: stretch;\n }\n\n .close-icon:hover svg {\n background-color: ${whiteWebRGBA(0.05)};\n }\n\n .close-icon:hover svg g path {\n fill: ${whiteWebRGBA(1)};\n }\n\n .close-icon:active svg {\n background-color: ${defaultDialogActiveBGColor};\n }\n\n .close-icon:active svg g path {\n fill: ${whiteWebRGBA(0.33)};\n }\n`"
11859
+ "default": "css`\n ${foundationDialogStyles}\n :host {\n --color-error: ${ColorHEX.error};\n --color-success: ${ColorHEX.success};\n --dialog-background: ${neutralLayer2};\n --dialog-position: fixed;\n --dialog-top: 0;\n --dialog-bottom: 0;\n }\n\n dialog {\n position: var(--dialog-position);\n top: var(--dialog-top);\n bottom: var(--dialog-bottom);\n color: rgb(255 255 255 / 30%);\n border-radius: calc(var(--control-corner-radius) * 1px);\n border: 1px solid ${ColorHEX.lightGrey};\n text-align: left;\n line-height: normal;\n box-shadow: 0 2px 15px 0 rgb(0 0 0 / 35%);\n }\n\n .top {\n display: flex;\n align-items: center;\n justify-content: space-between;\n color: ${ColorHEX.almostWhite};\n margin-bottom: calc(var(--design-unit) * 2px);\n }\n\n .bottom {\n display: flex;\n flex-wrap: wrap;\n justify-content: flex-end;\n color: ${ColorHEX.almostWhite};\n }\n\n :host slot:first-of-type {\n color: ${neutralForegroundRest};\n }\n\n ::slotted(zero-button) {\n margin-top: calc(var(--design-unit) * 4px - 1px);\n }\n\n .content-wrapper {\n min-width: var(--dialog-min-width);\n min-height: var(--dialog-min-height);\n height: fit-content;\n width: fit-content;\n max-width: var(--dialog-max-width);\n max-height: var(--dialog-max-height);\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n align-items: stretch;\n }\n\n .close-icon:hover svg {\n background-color: ${whiteWebRGBA(0.05)};\n }\n\n .close-icon:hover svg g path {\n fill: ${whiteWebRGBA(1)};\n }\n\n .close-icon:active svg {\n background-color: ${defaultDialogActiveBGColor};\n }\n\n .close-icon:active svg g path {\n fill: ${whiteWebRGBA(0.33)};\n }\n`"
11860
11860
  }
11861
11861
  ],
11862
11862
  "exports": [
@@ -16299,7 +16299,7 @@
16299
16299
  },
16300
16300
  {
16301
16301
  "kind": "javascript-module",
16302
- "path": "src/flipper/flipper.stories.ts",
16302
+ "path": "src/flyout/flyout.stories.ts",
16303
16303
  "declarations": [
16304
16304
  {
16305
16305
  "kind": "variable",
@@ -16307,7 +16307,7 @@
16307
16307
  "type": {
16308
16308
  "text": "Meta"
16309
16309
  },
16310
- "default": "{\n title: 'Flipper',\n component: 'zero-flipper',\n}"
16310
+ "default": "{\n title: 'Flyout',\n component: 'zero-flyout',\n}"
16311
16311
  },
16312
16312
  {
16313
16313
  "kind": "variable",
@@ -16315,7 +16315,7 @@
16315
16315
  "type": {
16316
16316
  "text": "StoryObj"
16317
16317
  },
16318
- "default": "{\n argTypes: {\n direction: {\n control: 'select',\n options: ['previous', 'next'],\n },\n },\n args: {\n direction: 'next',\n },\n render: ({ direction }) => html`\n <zero-flipper direction=\"${direction}\">Zero Flipper</zero-flipper>\n `,\n}"
16318
+ "default": "{\n argTypes: {\n position: {\n control: 'select',\n options: ['left', 'right'],\n },\n },\n args: {\n position: 'right',\n height: '500px',\n flyoutWidth: '20%',\n },\n render: ({ position, height, flyoutWidth }) => html`\n <div style=\"display: flex; height: ${height};\">\n <zero-button @click=\"${openFlyout}\">Open Flyout</zero-button>\n\n <style>\n zero-flyout::part(flyout) {\n width: ${flyoutWidth};\n }\n </style>\n <zero-flyout position=\"${position}\" style=\"height: ${height};\">\n <p slot=\"title\">Zero flyout</p>\n <div slot=\"header\">\n <p>Header</p>\n </div>\n <div class=\"container\">\n <p>Flyout options</p>\n <ul>\n <li>0</li>\n <li>1</li>\n <li>2</li>\n <li>3</li>\n <li>4</li>\n <li>5</li>\n </ul>\n </div>\n <div slot=\"footer\">\n <p>Footer</p>\n <zero-button @click=\"${closeFlyout}\">Close Flyout</zero-button>\n </div>\n </zero-flyout>\n </div>\n `,\n}"
16319
16319
  }
16320
16320
  ],
16321
16321
  "exports": [
@@ -16324,7 +16324,7 @@
16324
16324
  "name": "default",
16325
16325
  "declaration": {
16326
16326
  "name": "meta",
16327
- "module": "src/flipper/flipper.stories.ts"
16327
+ "module": "src/flyout/flyout.stories.ts"
16328
16328
  }
16329
16329
  },
16330
16330
  {
@@ -16332,225 +16332,199 @@
16332
16332
  "name": "Primary",
16333
16333
  "declaration": {
16334
16334
  "name": "Primary",
16335
- "module": "src/flipper/flipper.stories.ts"
16335
+ "module": "src/flyout/flyout.stories.ts"
16336
16336
  }
16337
16337
  }
16338
16338
  ]
16339
16339
  },
16340
16340
  {
16341
16341
  "kind": "javascript-module",
16342
- "path": "src/flipper/flipper.styles.ts",
16342
+ "path": "src/flyout/flyout.styles.ts",
16343
16343
  "declarations": [
16344
16344
  {
16345
- "kind": "function",
16346
- "name": "zeroFlipperStyles",
16347
- "return": {
16348
- "type": {
16349
- "text": "ElementStyles"
16350
- }
16351
- },
16352
- "parameters": [
16353
- {
16354
- "name": "context",
16355
- "type": {
16356
- "text": "ElementDefinitionContext"
16357
- }
16358
- },
16359
- {
16360
- "name": "definition",
16361
- "type": {
16362
- "text": "FlipperOptions"
16363
- }
16364
- }
16365
- ]
16345
+ "kind": "variable",
16346
+ "name": "zeroFlyoutStyles",
16347
+ "default": "css`\n ${foundationFlyoutStyles}\n div.flyout {\n background-color: ${neutralLayer2};\n border-color: ${neutralFillHover};\n color: ${neutralForegroundRest};\n }\n\n :host([position='left']) div.flyout {\n border-right-style: solid;\n border-right-width: 1px;\n }\n\n :host([position='right']) div.flyout {\n border-left-style: solid;\n border-left-width: 1px;\n }\n\n div.exit {\n cursor: pointer;\n padding: 5px 8px;\n }\n\n div.exit:hover {\n background-color: ${neutralFillHover};\n border-radius: 3px;\n }\n`"
16366
16348
  }
16367
16349
  ],
16368
16350
  "exports": [
16369
16351
  {
16370
16352
  "kind": "js",
16371
- "name": "zeroFlipperStyles",
16353
+ "name": "zeroFlyoutStyles",
16372
16354
  "declaration": {
16373
- "name": "zeroFlipperStyles",
16374
- "module": "src/flipper/flipper.styles.ts"
16355
+ "name": "zeroFlyoutStyles",
16356
+ "module": "src/flyout/flyout.styles.ts"
16375
16357
  }
16376
16358
  }
16377
16359
  ]
16378
16360
  },
16379
16361
  {
16380
16362
  "kind": "javascript-module",
16381
- "path": "src/flipper/flipper.template.ts",
16363
+ "path": "src/flyout/flyout.template.ts",
16382
16364
  "declarations": [
16383
16365
  {
16384
- "kind": "function",
16385
- "name": "zeroFlipperTemplate",
16386
- "return": {
16387
- "type": {
16388
- "text": "ViewTemplate<Flipper>"
16389
- }
16390
- },
16391
- "parameters": [
16392
- {
16393
- "name": "context",
16394
- "type": {
16395
- "text": "ElementDefinitionContext"
16396
- }
16397
- },
16398
- {
16399
- "name": "definition",
16400
- "type": {
16401
- "text": "FlipperOptions"
16402
- }
16403
- }
16404
- ]
16366
+ "kind": "variable",
16367
+ "name": "zeroFlyoutTemplate",
16368
+ "default": "html<Flyout>`\n ${getPrefixedFlyout('zero')}\n`"
16405
16369
  }
16406
16370
  ],
16407
16371
  "exports": [
16408
16372
  {
16409
16373
  "kind": "js",
16410
- "name": "zeroFlipperTemplate",
16374
+ "name": "zeroFlyoutTemplate",
16411
16375
  "declaration": {
16412
- "name": "zeroFlipperTemplate",
16413
- "module": "src/flipper/flipper.template.ts"
16376
+ "name": "zeroFlyoutTemplate",
16377
+ "module": "src/flyout/flyout.template.ts"
16414
16378
  }
16415
16379
  }
16416
16380
  ]
16417
16381
  },
16418
16382
  {
16419
16383
  "kind": "javascript-module",
16420
- "path": "src/flipper/flipper.ts",
16384
+ "path": "src/flyout/flyout.ts",
16421
16385
  "declarations": [
16386
+ {
16387
+ "kind": "variable",
16388
+ "name": "defaultFlyoutConfig",
16389
+ "default": "foundationConfig"
16390
+ },
16391
+ {
16392
+ "kind": "variable",
16393
+ "name": "zeroFlyoutShadowOptions",
16394
+ "default": "foundationFlyoutShadowOptions"
16395
+ },
16422
16396
  {
16423
16397
  "kind": "class",
16424
16398
  "description": "",
16425
- "name": "Flipper",
16399
+ "name": "Flyout",
16426
16400
  "superclass": {
16427
- "name": "FoundationFlipper",
16401
+ "name": "FoundationFlyout",
16428
16402
  "package": "@genesislcap/foundation-ui"
16429
16403
  },
16430
- "tagName": "%%prefix%%-flipper",
16404
+ "tagName": "%%prefix%%-flyout",
16431
16405
  "customElement": true,
16432
16406
  "attributes": [
16433
16407
  {
16408
+ "name": "position",
16434
16409
  "type": {
16435
- "text": "boolean"
16410
+ "text": "string"
16436
16411
  },
16437
- "description": "The disabled state of the flipper.",
16438
- "fieldName": "disabled",
16412
+ "default": "'right'",
16413
+ "fieldName": "position",
16439
16414
  "inheritedFrom": {
16440
- "name": "Flipper",
16441
- "module": "src/flipper/flipper.ts"
16415
+ "name": "Flyout",
16416
+ "module": "src/flyout/flyout.ts"
16442
16417
  }
16443
16418
  },
16444
16419
  {
16445
- "name": "aria-hidden",
16446
16420
  "type": {
16447
16421
  "text": "boolean"
16448
16422
  },
16449
16423
  "default": "true",
16450
- "description": "Indicates the flipper should be hidden from assistive technology. Because flippers are often supplementary navigation, they are often hidden from assistive technology.",
16451
- "fieldName": "hiddenFromAT",
16452
- "inheritedFrom": {
16453
- "name": "Flipper",
16454
- "module": "src/flipper/flipper.ts"
16455
- }
16456
- },
16457
- {
16458
- "name": "direction",
16459
- "type": {
16460
- "text": "FlipperDirection"
16461
- },
16462
- "description": "The direction that the flipper implies navigating.",
16463
- "fieldName": "direction",
16424
+ "fieldName": "displayHeader",
16464
16425
  "inheritedFrom": {
16465
- "name": "Flipper",
16466
- "module": "src/flipper/flipper.ts"
16426
+ "name": "Flyout",
16427
+ "module": "src/flyout/flyout.ts"
16467
16428
  }
16468
16429
  }
16469
16430
  ],
16470
16431
  "members": [
16471
16432
  {
16472
16433
  "kind": "field",
16473
- "name": "disabled",
16434
+ "name": "position",
16474
16435
  "type": {
16475
- "text": "boolean"
16436
+ "text": "string"
16476
16437
  },
16477
- "privacy": "public",
16478
- "description": "The disabled state of the flipper.",
16438
+ "default": "'right'",
16479
16439
  "inheritedFrom": {
16480
- "name": "Flipper",
16481
- "module": "src/flipper/flipper.ts"
16440
+ "name": "Flyout",
16441
+ "module": "src/flyout/flyout.ts"
16482
16442
  }
16483
16443
  },
16484
16444
  {
16485
16445
  "kind": "field",
16486
- "name": "hiddenFromAT",
16446
+ "name": "displayHeader",
16487
16447
  "type": {
16488
16448
  "text": "boolean"
16489
16449
  },
16490
- "privacy": "public",
16491
16450
  "default": "true",
16492
- "description": "Indicates the flipper should be hidden from assistive technology. Because flippers are often supplementary navigation, they are often hidden from assistive technology.",
16493
16451
  "inheritedFrom": {
16494
- "name": "Flipper",
16495
- "module": "src/flipper/flipper.ts"
16452
+ "name": "Flyout",
16453
+ "module": "src/flyout/flyout.ts"
16496
16454
  }
16497
16455
  },
16498
16456
  {
16499
16457
  "kind": "field",
16500
- "name": "direction",
16458
+ "name": "closed",
16501
16459
  "type": {
16502
- "text": "FlipperDirection"
16460
+ "text": "boolean"
16503
16461
  },
16504
- "privacy": "public",
16505
- "description": "The direction that the flipper implies navigating.",
16462
+ "default": "true",
16506
16463
  "inheritedFrom": {
16507
- "name": "Flipper",
16508
- "module": "src/flipper/flipper.ts"
16464
+ "name": "Flyout",
16465
+ "module": "src/flyout/flyout.ts"
16509
16466
  }
16510
16467
  },
16511
16468
  {
16512
16469
  "kind": "method",
16513
- "name": "keyupHandler",
16514
- "privacy": "public",
16515
- "parameters": [
16516
- {
16517
- "name": "e",
16518
- "type": {
16519
- "text": "Event & KeyboardEvent"
16520
- },
16521
- "description": "Keyboard event"
16522
- }
16523
- ],
16524
- "description": "Simulate a click event when the flipper has focus and the user hits enter or space keys\nBlur focus if the user hits escape key",
16470
+ "name": "closedChanged",
16525
16471
  "inheritedFrom": {
16526
- "name": "Flipper",
16527
- "module": "src/flipper/flipper.ts"
16472
+ "name": "Flyout",
16473
+ "module": "src/flyout/flyout.ts"
16528
16474
  }
16529
16475
  },
16530
16476
  {
16531
16477
  "kind": "field",
16532
- "name": "_presentation",
16478
+ "name": "visuallyhidden",
16533
16479
  "type": {
16534
- "text": "ComponentPresentation | null | undefined"
16480
+ "text": "boolean"
16535
16481
  },
16536
- "privacy": "private",
16537
- "default": "void 0",
16482
+ "default": "true",
16538
16483
  "inheritedFrom": {
16539
- "name": "Flipper",
16540
- "module": "src/flipper/flipper.ts"
16484
+ "name": "Flyout",
16485
+ "module": "src/flyout/flyout.ts"
16541
16486
  }
16542
16487
  },
16543
16488
  {
16544
- "kind": "field",
16545
- "name": "$presentation",
16546
- "type": {
16547
- "text": "ComponentPresentation | null"
16548
- },
16549
- "privacy": "public",
16550
- "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
16489
+ "kind": "method",
16490
+ "name": "closeFlyout",
16551
16491
  "inheritedFrom": {
16552
- "name": "Flipper",
16553
- "module": "src/flipper/flipper.ts"
16492
+ "name": "Flyout",
16493
+ "module": "src/flyout/flyout.ts"
16494
+ }
16495
+ },
16496
+ {
16497
+ "kind": "method",
16498
+ "name": "closingFinished",
16499
+ "inheritedFrom": {
16500
+ "name": "Flyout",
16501
+ "module": "src/flyout/flyout.ts"
16502
+ }
16503
+ },
16504
+ {
16505
+ "kind": "field",
16506
+ "name": "_presentation",
16507
+ "type": {
16508
+ "text": "ComponentPresentation | null | undefined"
16509
+ },
16510
+ "privacy": "private",
16511
+ "default": "void 0",
16512
+ "inheritedFrom": {
16513
+ "name": "FoundationElement",
16514
+ "module": "src/foundation-element/foundation-element.ts"
16515
+ }
16516
+ },
16517
+ {
16518
+ "kind": "field",
16519
+ "name": "$presentation",
16520
+ "type": {
16521
+ "text": "ComponentPresentation | null"
16522
+ },
16523
+ "privacy": "public",
16524
+ "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
16525
+ "inheritedFrom": {
16526
+ "name": "FoundationElement",
16527
+ "module": "src/foundation-element/foundation-element.ts"
16554
16528
  }
16555
16529
  },
16556
16530
  {
@@ -16562,8 +16536,8 @@
16562
16536
  "privacy": "public",
16563
16537
  "description": "Sets the template of the element instance. When undefined,\nthe element will attempt to resolve the template from\nthe associated presentation or custom element definition.",
16564
16538
  "inheritedFrom": {
16565
- "name": "Flipper",
16566
- "module": "src/flipper/flipper.ts"
16539
+ "name": "FoundationElement",
16540
+ "module": "src/foundation-element/foundation-element.ts"
16567
16541
  }
16568
16542
  },
16569
16543
  {
@@ -16576,8 +16550,8 @@
16576
16550
  }
16577
16551
  },
16578
16552
  "inheritedFrom": {
16579
- "name": "Flipper",
16580
- "module": "src/flipper/flipper.ts"
16553
+ "name": "FoundationElement",
16554
+ "module": "src/foundation-element/foundation-element.ts"
16581
16555
  }
16582
16556
  },
16583
16557
  {
@@ -16589,8 +16563,8 @@
16589
16563
  "privacy": "public",
16590
16564
  "description": "Sets the default styles for the element instance. When undefined,\nthe element will attempt to resolve default styles from\nthe associated presentation or custom element definition.",
16591
16565
  "inheritedFrom": {
16592
- "name": "Flipper",
16593
- "module": "src/flipper/flipper.ts"
16566
+ "name": "FoundationElement",
16567
+ "module": "src/foundation-element/foundation-element.ts"
16594
16568
  }
16595
16569
  },
16596
16570
  {
@@ -16603,8 +16577,8 @@
16603
16577
  }
16604
16578
  },
16605
16579
  "inheritedFrom": {
16606
- "name": "Flipper",
16607
- "module": "src/flipper/flipper.ts"
16580
+ "name": "FoundationElement",
16581
+ "module": "src/foundation-element/foundation-element.ts"
16608
16582
  }
16609
16583
  },
16610
16584
  {
@@ -16634,49 +16608,57 @@
16634
16608
  ],
16635
16609
  "description": "Defines an element registry function with a set of element definition defaults.",
16636
16610
  "inheritedFrom": {
16637
- "name": "Flipper",
16638
- "module": "src/flipper/flipper.ts"
16639
- }
16640
- }
16641
- ],
16642
- "events": [
16643
- {
16644
- "description": "Fires a custom 'click' event when Enter or Space is invoked via keyboard and the flipper is exposed to assistive technologies.",
16645
- "name": "click",
16646
- "inheritedFrom": {
16647
- "name": "Flipper",
16648
- "module": "src/flipper/flipper.ts"
16611
+ "name": "FoundationElement",
16612
+ "module": "src/foundation-element/foundation-element.ts"
16649
16613
  }
16650
16614
  }
16651
16615
  ]
16652
16616
  },
16653
16617
  {
16654
16618
  "kind": "variable",
16655
- "name": "zeroFlipper"
16619
+ "name": "zeroFlyout",
16620
+ "description": "The Zero Flyout",
16621
+ "privacy": "public"
16656
16622
  }
16657
16623
  ],
16658
16624
  "exports": [
16659
16625
  {
16660
16626
  "kind": "js",
16661
- "name": "Flipper",
16627
+ "name": "defaultFlyoutConfig",
16662
16628
  "declaration": {
16663
- "name": "Flipper",
16664
- "module": "src/flipper/flipper.ts"
16629
+ "name": "defaultFlyoutConfig",
16630
+ "module": "src/flyout/flyout.ts"
16665
16631
  }
16666
16632
  },
16667
16633
  {
16668
16634
  "kind": "js",
16669
- "name": "zeroFlipper",
16635
+ "name": "zeroFlyoutShadowOptions",
16670
16636
  "declaration": {
16671
- "name": "zeroFlipper",
16672
- "module": "src/flipper/flipper.ts"
16637
+ "name": "zeroFlyoutShadowOptions",
16638
+ "module": "src/flyout/flyout.ts"
16639
+ }
16640
+ },
16641
+ {
16642
+ "kind": "js",
16643
+ "name": "Flyout",
16644
+ "declaration": {
16645
+ "name": "Flyout",
16646
+ "module": "src/flyout/flyout.ts"
16647
+ }
16648
+ },
16649
+ {
16650
+ "kind": "js",
16651
+ "name": "zeroFlyout",
16652
+ "declaration": {
16653
+ "name": "zeroFlyout",
16654
+ "module": "src/flyout/flyout.ts"
16673
16655
  }
16674
16656
  }
16675
16657
  ]
16676
16658
  },
16677
16659
  {
16678
16660
  "kind": "javascript-module",
16679
- "path": "src/flipper/index.ts",
16661
+ "path": "src/flyout/index.ts",
16680
16662
  "declarations": [],
16681
16663
  "exports": [
16682
16664
  {
@@ -16684,7 +16666,7 @@
16684
16666
  "name": "*",
16685
16667
  "declaration": {
16686
16668
  "name": "*",
16687
- "package": "./flipper"
16669
+ "package": "./flyout"
16688
16670
  }
16689
16671
  },
16690
16672
  {
@@ -16692,7 +16674,7 @@
16692
16674
  "name": "*",
16693
16675
  "declaration": {
16694
16676
  "name": "*",
16695
- "package": "./flipper.styles"
16677
+ "package": "./flyout.styles"
16696
16678
  }
16697
16679
  },
16698
16680
  {
@@ -16700,14 +16682,14 @@
16700
16682
  "name": "*",
16701
16683
  "declaration": {
16702
16684
  "name": "*",
16703
- "package": "./flipper.template"
16685
+ "package": "./flyout.template"
16704
16686
  }
16705
16687
  }
16706
16688
  ]
16707
16689
  },
16708
16690
  {
16709
16691
  "kind": "javascript-module",
16710
- "path": "src/flyout/flyout.stories.ts",
16692
+ "path": "src/grid-layout/grid-layout.stories.ts",
16711
16693
  "declarations": [
16712
16694
  {
16713
16695
  "kind": "variable",
@@ -16715,7 +16697,7 @@
16715
16697
  "type": {
16716
16698
  "text": "Meta"
16717
16699
  },
16718
- "default": "{\n title: 'Flyout',\n component: 'zero-flyout',\n}"
16700
+ "default": "{\n title: 'Grid Layout',\n component: 'zero-grid-layout',\n}"
16719
16701
  },
16720
16702
  {
16721
16703
  "kind": "variable",
@@ -16723,7 +16705,7 @@
16723
16705
  "type": {
16724
16706
  "text": "StoryObj"
16725
16707
  },
16726
- "default": "{\n argTypes: {\n position: {\n control: 'select',\n options: ['left', 'right'],\n },\n },\n args: {\n position: 'right',\n height: '500px',\n flyoutWidth: '20%',\n },\n render: ({ position, height, flyoutWidth }) => html`\n <div style=\"display: flex; height: ${height};\">\n <zero-button @click=\"${openFlyout}\">Open Flyout</zero-button>\n\n <style>\n zero-flyout::part(flyout) {\n width: ${flyoutWidth};\n }\n </style>\n <zero-flyout position=\"${position}\" style=\"height: ${height};\">\n <p slot=\"title\">Zero flyout</p>\n <div slot=\"header\">\n <p>Header</p>\n </div>\n <div class=\"container\">\n <p>Flyout options</p>\n <ul>\n <li>0</li>\n <li>1</li>\n <li>2</li>\n <li>3</li>\n <li>4</li>\n <li>5</li>\n </ul>\n </div>\n <div slot=\"footer\">\n <p>Footer</p>\n <zero-button @click=\"${closeFlyout}\">Close Flyout</zero-button>\n </div>\n </zero-flyout>\n </div>\n `,\n}"
16708
+ "default": "{\n render: () => html`\n <div style=\"${wrapperStyle}\">\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout\n class=\"spacing-2x\"\n col-count=\"2\"\n row-count=\"2\"\n col-lg-count=\"4\"\n row-lg-count=\"1\"\n col-sm-count=\"1\"\n row-sm-count=\"2\"\n >\n <zero-grid-layout-item\n style=\"height: 100%; background-color: green;\"\n col-lg-number=\"1\"\n row-lg-number=\"1\"\n width-lg=\"1\"\n height-lg=\"1\"\n col-md-number=\"1\"\n row-md-number=\"1\"\n width-md=\"1\"\n height-md=\"1\"\n col-sm-number=\"1\"\n row-sm-number=\"1\"\n width-sm=\"1\"\n height-sm=\"1\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"height: 100%; background-color: red;\"\n col-lg-number=\"3\"\n row-lg-number=\"1\"\n width-lg=\"2\"\n height-lg=\"1\"\n col-md-number=\"2\"\n row-md-number=\"2\"\n width-md=\"1\"\n height-md=\"1\"\n col-sm-number=\"1\"\n row-sm-number=\"2\"\n width-sm=\"1\"\n height-sm=\"1\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"2\" col-count=\"4\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: green;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"1\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"2\"\n row-number=\"1\"\n width=\"3\"\n height=\"2\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"2\" col-count=\"4\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"1\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"2\"\n row-number=\"1\"\n width=\"2\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: green;\"\n col-number=\"4\"\n row-number=\"1\"\n width=\"1\"\n height=\"2\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"3\" col-count=\"4\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"4\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"1\"\n row-number=\"3\"\n width=\"3\"\n height=\"1\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"4\"\n row-number=\"3\"\n width=\"1\"\n height=\"1\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"4\" col-count=\"4\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"4\"\n height=\"1\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"1\"\n row-number=\"2\"\n width=\"1\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"2\"\n row-number=\"2\"\n width=\"3\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: green;\"\n col-number=\"1\"\n row-number=\"4\"\n width=\"4\"\n height=\"1\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"6\" col-count=\"6\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"2\"\n height=\"6\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"3\"\n row-number=\"1\"\n width=\"4\"\n height=\"3\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"3\"\n row-number=\"4\"\n width=\"2\"\n height=\"3\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"5\"\n row-number=\"4\"\n width=\"1\"\n height=\"3\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: green;\"\n col-number=\"6\"\n row-number=\"4\"\n width=\"1\"\n height=\"3\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"6\" col-count=\"6\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"1\"\n height=\"6\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"2\"\n row-number=\"1\"\n width=\"5\"\n height=\"4\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"2\"\n row-number=\"5\"\n width=\"5\"\n height=\"2\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"6\" col-count=\"6\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"1\"\n height=\"6\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"2\"\n row-number=\"1\"\n width=\"5\"\n height=\"4\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"2\"\n row-number=\"5\"\n width=\"5\"\n height=\"2\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n </div>\n `,\n}"
16727
16709
  }
16728
16710
  ],
16729
16711
  "exports": [
@@ -16732,7 +16714,7 @@
16732
16714
  "name": "default",
16733
16715
  "declaration": {
16734
16716
  "name": "meta",
16735
- "module": "src/flyout/flyout.stories.ts"
16717
+ "module": "src/grid-layout/grid-layout.stories.ts"
16736
16718
  }
16737
16719
  },
16738
16720
  {
@@ -16740,600 +16722,388 @@
16740
16722
  "name": "Primary",
16741
16723
  "declaration": {
16742
16724
  "name": "Primary",
16743
- "module": "src/flyout/flyout.stories.ts"
16744
- }
16745
- }
16746
- ]
16747
- },
16748
- {
16749
- "kind": "javascript-module",
16750
- "path": "src/flyout/flyout.styles.ts",
16751
- "declarations": [
16752
- {
16753
- "kind": "variable",
16754
- "name": "zeroFlyoutStyles",
16755
- "default": "css`\n ${foundationFlyoutStyles}\n div.flyout {\n background-color: ${neutralLayer2};\n border-color: ${neutralFillHover};\n color: ${neutralForegroundRest};\n }\n\n :host([position='left']) div.flyout {\n border-right-style: solid;\n border-right-width: 1px;\n }\n\n :host([position='right']) div.flyout {\n border-left-style: solid;\n border-left-width: 1px;\n }\n\n div.exit {\n cursor: pointer;\n padding: 5px 8px;\n }\n\n div.exit:hover {\n background-color: ${neutralFillHover};\n border-radius: 3px;\n }\n`"
16756
- }
16757
- ],
16758
- "exports": [
16759
- {
16760
- "kind": "js",
16761
- "name": "zeroFlyoutStyles",
16762
- "declaration": {
16763
- "name": "zeroFlyoutStyles",
16764
- "module": "src/flyout/flyout.styles.ts"
16765
- }
16766
- }
16767
- ]
16768
- },
16769
- {
16770
- "kind": "javascript-module",
16771
- "path": "src/flyout/flyout.template.ts",
16772
- "declarations": [
16773
- {
16774
- "kind": "variable",
16775
- "name": "zeroFlyoutTemplate",
16776
- "default": "html<Flyout>`\n ${getPrefixedFlyout('zero')}\n`"
16777
- }
16778
- ],
16779
- "exports": [
16780
- {
16781
- "kind": "js",
16782
- "name": "zeroFlyoutTemplate",
16783
- "declaration": {
16784
- "name": "zeroFlyoutTemplate",
16785
- "module": "src/flyout/flyout.template.ts"
16725
+ "module": "src/grid-layout/grid-layout.stories.ts"
16786
16726
  }
16787
16727
  }
16788
16728
  ]
16789
16729
  },
16790
16730
  {
16791
16731
  "kind": "javascript-module",
16792
- "path": "src/flyout/flyout.ts",
16732
+ "path": "src/grid-layout/grid-layout.ts",
16793
16733
  "declarations": [
16794
- {
16795
- "kind": "variable",
16796
- "name": "defaultFlyoutConfig",
16797
- "default": "foundationConfig"
16798
- },
16799
- {
16800
- "kind": "variable",
16801
- "name": "zeroFlyoutShadowOptions",
16802
- "default": "foundationFlyoutShadowOptions"
16803
- },
16804
16734
  {
16805
16735
  "kind": "class",
16806
16736
  "description": "",
16807
- "name": "Flyout",
16737
+ "name": "GridLayout",
16808
16738
  "superclass": {
16809
- "name": "FoundationFlyout",
16739
+ "name": "FoundationGridLayout",
16810
16740
  "package": "@genesislcap/foundation-ui"
16811
16741
  },
16812
- "tagName": "%%prefix%%-flyout",
16742
+ "tagName": "%%prefix%%-grid-layout",
16813
16743
  "customElement": true,
16814
16744
  "attributes": [
16815
16745
  {
16816
- "name": "position",
16746
+ "name": "['col-count']",
16817
16747
  "type": {
16818
16748
  "text": "string"
16819
16749
  },
16820
- "default": "'right'",
16821
- "fieldName": "position",
16750
+ "fieldName": "['col-count']",
16822
16751
  "inheritedFrom": {
16823
- "name": "Flyout",
16824
- "module": "src/flyout/flyout.ts"
16752
+ "name": "GridLayout",
16753
+ "module": "src/grid-layout/grid-layout.ts"
16825
16754
  }
16826
16755
  },
16827
16756
  {
16757
+ "name": "['col-width']",
16828
16758
  "type": {
16829
- "text": "boolean"
16759
+ "text": "string"
16830
16760
  },
16831
- "default": "true",
16832
- "fieldName": "displayHeader",
16761
+ "fieldName": "['col-width']",
16833
16762
  "inheritedFrom": {
16834
- "name": "Flyout",
16835
- "module": "src/flyout/flyout.ts"
16763
+ "name": "GridLayout",
16764
+ "module": "src/grid-layout/grid-layout.ts"
16836
16765
  }
16837
- }
16838
- ],
16839
- "members": [
16766
+ },
16840
16767
  {
16841
- "kind": "field",
16842
- "name": "position",
16768
+ "name": "['col-lg-count']",
16843
16769
  "type": {
16844
16770
  "text": "string"
16845
16771
  },
16846
- "default": "'right'",
16772
+ "fieldName": "['col-lg-count']",
16847
16773
  "inheritedFrom": {
16848
- "name": "Flyout",
16849
- "module": "src/flyout/flyout.ts"
16774
+ "name": "GridLayout",
16775
+ "module": "src/grid-layout/grid-layout.ts"
16850
16776
  }
16851
16777
  },
16852
16778
  {
16853
- "kind": "field",
16854
- "name": "displayHeader",
16779
+ "name": "['col-lg-width']",
16855
16780
  "type": {
16856
- "text": "boolean"
16781
+ "text": "string"
16857
16782
  },
16858
- "default": "true",
16783
+ "fieldName": "['col-lg-width']",
16859
16784
  "inheritedFrom": {
16860
- "name": "Flyout",
16861
- "module": "src/flyout/flyout.ts"
16785
+ "name": "GridLayout",
16786
+ "module": "src/grid-layout/grid-layout.ts"
16862
16787
  }
16863
16788
  },
16864
16789
  {
16865
- "kind": "field",
16866
- "name": "closed",
16790
+ "name": "['col-md-count']",
16867
16791
  "type": {
16868
- "text": "boolean"
16792
+ "text": "string"
16869
16793
  },
16870
- "default": "true",
16794
+ "fieldName": "['col-md-count']",
16871
16795
  "inheritedFrom": {
16872
- "name": "Flyout",
16873
- "module": "src/flyout/flyout.ts"
16796
+ "name": "GridLayout",
16797
+ "module": "src/grid-layout/grid-layout.ts"
16874
16798
  }
16875
16799
  },
16876
16800
  {
16877
- "kind": "method",
16878
- "name": "closedChanged",
16801
+ "name": "['col-md-width']",
16802
+ "type": {
16803
+ "text": "string"
16804
+ },
16805
+ "fieldName": "['col-md-width']",
16879
16806
  "inheritedFrom": {
16880
- "name": "Flyout",
16881
- "module": "src/flyout/flyout.ts"
16807
+ "name": "GridLayout",
16808
+ "module": "src/grid-layout/grid-layout.ts"
16882
16809
  }
16883
16810
  },
16884
16811
  {
16885
- "kind": "field",
16886
- "name": "visuallyhidden",
16812
+ "name": "['col-sm-count']",
16887
16813
  "type": {
16888
- "text": "boolean"
16814
+ "text": "string"
16889
16815
  },
16890
- "default": "true",
16816
+ "fieldName": "['col-sm-count']",
16891
16817
  "inheritedFrom": {
16892
- "name": "Flyout",
16893
- "module": "src/flyout/flyout.ts"
16818
+ "name": "GridLayout",
16819
+ "module": "src/grid-layout/grid-layout.ts"
16894
16820
  }
16895
16821
  },
16896
16822
  {
16897
- "kind": "method",
16898
- "name": "closeFlyout",
16899
- "inheritedFrom": {
16900
- "name": "Flyout",
16901
- "module": "src/flyout/flyout.ts"
16902
- }
16823
+ "name": "['col-sm-width']",
16824
+ "type": {
16825
+ "text": "string"
16826
+ },
16827
+ "fieldName": "['col-sm-width']",
16828
+ "inheritedFrom": {
16829
+ "name": "GridLayout",
16830
+ "module": "src/grid-layout/grid-layout.ts"
16831
+ }
16903
16832
  },
16904
16833
  {
16905
- "kind": "method",
16906
- "name": "closingFinished",
16834
+ "name": "['row-count']",
16835
+ "type": {
16836
+ "text": "string"
16837
+ },
16838
+ "fieldName": "['row-count']",
16907
16839
  "inheritedFrom": {
16908
- "name": "Flyout",
16909
- "module": "src/flyout/flyout.ts"
16840
+ "name": "GridLayout",
16841
+ "module": "src/grid-layout/grid-layout.ts"
16910
16842
  }
16911
16843
  },
16912
16844
  {
16913
- "kind": "field",
16914
- "name": "_presentation",
16845
+ "name": "['row-height']",
16915
16846
  "type": {
16916
- "text": "ComponentPresentation | null | undefined"
16847
+ "text": "string"
16917
16848
  },
16918
- "privacy": "private",
16919
- "default": "void 0",
16849
+ "fieldName": "['row-height']",
16920
16850
  "inheritedFrom": {
16921
- "name": "FoundationElement",
16922
- "module": "src/foundation-element/foundation-element.ts"
16851
+ "name": "GridLayout",
16852
+ "module": "src/grid-layout/grid-layout.ts"
16923
16853
  }
16924
16854
  },
16925
16855
  {
16926
- "kind": "field",
16927
- "name": "$presentation",
16856
+ "name": "['row-lg-count']",
16928
16857
  "type": {
16929
- "text": "ComponentPresentation | null"
16858
+ "text": "string"
16930
16859
  },
16931
- "privacy": "public",
16932
- "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
16860
+ "fieldName": "['row-lg-count']",
16933
16861
  "inheritedFrom": {
16934
- "name": "FoundationElement",
16935
- "module": "src/foundation-element/foundation-element.ts"
16862
+ "name": "GridLayout",
16863
+ "module": "src/grid-layout/grid-layout.ts"
16936
16864
  }
16937
16865
  },
16938
16866
  {
16939
- "kind": "field",
16940
- "name": "template",
16867
+ "name": "['row-lg-height']",
16941
16868
  "type": {
16942
- "text": "ElementViewTemplate | void | null"
16869
+ "text": "string"
16943
16870
  },
16944
- "privacy": "public",
16945
- "description": "Sets the template of the element instance. When undefined,\nthe element will attempt to resolve the template from\nthe associated presentation or custom element definition.",
16871
+ "fieldName": "['row-lg-height']",
16946
16872
  "inheritedFrom": {
16947
- "name": "FoundationElement",
16948
- "module": "src/foundation-element/foundation-element.ts"
16873
+ "name": "GridLayout",
16874
+ "module": "src/grid-layout/grid-layout.ts"
16949
16875
  }
16950
16876
  },
16951
16877
  {
16952
- "kind": "method",
16953
- "name": "templateChanged",
16954
- "privacy": "protected",
16955
- "return": {
16956
- "type": {
16957
- "text": "void"
16958
- }
16878
+ "name": "['row-md-count']",
16879
+ "type": {
16880
+ "text": "string"
16959
16881
  },
16882
+ "fieldName": "['row-md-count']",
16960
16883
  "inheritedFrom": {
16961
- "name": "FoundationElement",
16962
- "module": "src/foundation-element/foundation-element.ts"
16884
+ "name": "GridLayout",
16885
+ "module": "src/grid-layout/grid-layout.ts"
16963
16886
  }
16964
16887
  },
16965
16888
  {
16966
- "kind": "field",
16967
- "name": "styles",
16889
+ "name": "['row-md-height']",
16968
16890
  "type": {
16969
- "text": "ElementStyles | void | null"
16891
+ "text": "string"
16970
16892
  },
16971
- "privacy": "public",
16972
- "description": "Sets the default styles for the element instance. When undefined,\nthe element will attempt to resolve default styles from\nthe associated presentation or custom element definition.",
16893
+ "fieldName": "['row-md-height']",
16973
16894
  "inheritedFrom": {
16974
- "name": "FoundationElement",
16975
- "module": "src/foundation-element/foundation-element.ts"
16895
+ "name": "GridLayout",
16896
+ "module": "src/grid-layout/grid-layout.ts"
16976
16897
  }
16977
16898
  },
16978
16899
  {
16979
- "kind": "method",
16980
- "name": "stylesChanged",
16981
- "privacy": "protected",
16982
- "return": {
16983
- "type": {
16984
- "text": "void"
16985
- }
16900
+ "name": "['row-sm-count']",
16901
+ "type": {
16902
+ "text": "string"
16986
16903
  },
16904
+ "fieldName": "['row-sm-count']",
16987
16905
  "inheritedFrom": {
16988
- "name": "FoundationElement",
16989
- "module": "src/foundation-element/foundation-element.ts"
16906
+ "name": "GridLayout",
16907
+ "module": "src/grid-layout/grid-layout.ts"
16990
16908
  }
16991
16909
  },
16992
16910
  {
16993
- "kind": "method",
16994
- "name": "compose",
16995
- "privacy": "public",
16996
- "static": true,
16997
- "return": {
16998
- "type": {
16999
- "text": "(\n overrideDefinition?: OverrideFoundationElementDefinition<T>\n ) => FoundationElementRegistry<T, K>"
17000
- }
16911
+ "name": "['row-sm-height']",
16912
+ "type": {
16913
+ "text": "string"
17001
16914
  },
17002
- "parameters": [
17003
- {
17004
- "name": "this",
17005
- "type": {
17006
- "text": "K"
17007
- }
17008
- },
17009
- {
17010
- "name": "elementDefinition",
17011
- "type": {
17012
- "text": "T"
17013
- },
17014
- "description": "The definition of the element to create the registry\nfunction for."
17015
- }
17016
- ],
17017
- "description": "Defines an element registry function with a set of element definition defaults.",
16915
+ "fieldName": "['row-sm-height']",
17018
16916
  "inheritedFrom": {
17019
- "name": "FoundationElement",
17020
- "module": "src/foundation-element/foundation-element.ts"
16917
+ "name": "GridLayout",
16918
+ "module": "src/grid-layout/grid-layout.ts"
17021
16919
  }
17022
16920
  }
17023
- ]
17024
- },
17025
- {
17026
- "kind": "variable",
17027
- "name": "zeroFlyout",
17028
- "description": "The Zero Flyout",
17029
- "privacy": "public"
17030
- }
17031
- ],
17032
- "exports": [
17033
- {
17034
- "kind": "js",
17035
- "name": "defaultFlyoutConfig",
17036
- "declaration": {
17037
- "name": "defaultFlyoutConfig",
17038
- "module": "src/flyout/flyout.ts"
17039
- }
17040
- },
17041
- {
17042
- "kind": "js",
17043
- "name": "zeroFlyoutShadowOptions",
17044
- "declaration": {
17045
- "name": "zeroFlyoutShadowOptions",
17046
- "module": "src/flyout/flyout.ts"
17047
- }
17048
- },
17049
- {
17050
- "kind": "js",
17051
- "name": "Flyout",
17052
- "declaration": {
17053
- "name": "Flyout",
17054
- "module": "src/flyout/flyout.ts"
17055
- }
17056
- },
17057
- {
17058
- "kind": "js",
17059
- "name": "zeroFlyout",
17060
- "declaration": {
17061
- "name": "zeroFlyout",
17062
- "module": "src/flyout/flyout.ts"
17063
- }
17064
- }
17065
- ]
17066
- },
17067
- {
17068
- "kind": "javascript-module",
17069
- "path": "src/flyout/index.ts",
17070
- "declarations": [],
17071
- "exports": [
17072
- {
17073
- "kind": "js",
17074
- "name": "*",
17075
- "declaration": {
17076
- "name": "*",
17077
- "package": "./flyout"
17078
- }
17079
- },
17080
- {
17081
- "kind": "js",
17082
- "name": "*",
17083
- "declaration": {
17084
- "name": "*",
17085
- "package": "./flyout.styles"
17086
- }
17087
- },
17088
- {
17089
- "kind": "js",
17090
- "name": "*",
17091
- "declaration": {
17092
- "name": "*",
17093
- "package": "./flyout.template"
17094
- }
17095
- }
17096
- ]
17097
- },
17098
- {
17099
- "kind": "javascript-module",
17100
- "path": "src/grid-layout/grid-layout.stories.ts",
17101
- "declarations": [
17102
- {
17103
- "kind": "variable",
17104
- "name": "meta",
17105
- "type": {
17106
- "text": "Meta"
17107
- },
17108
- "default": "{\n title: 'Grid Layout',\n component: 'zero-grid-layout',\n}"
17109
- },
17110
- {
17111
- "kind": "variable",
17112
- "name": "Primary",
17113
- "type": {
17114
- "text": "StoryObj"
17115
- },
17116
- "default": "{\n render: () => html`\n <div style=\"${wrapperStyle}\">\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout\n class=\"spacing-2x\"\n col-count=\"2\"\n row-count=\"2\"\n col-lg-count=\"4\"\n row-lg-count=\"1\"\n col-sm-count=\"1\"\n row-sm-count=\"2\"\n >\n <zero-grid-layout-item\n style=\"height: 100%; background-color: green;\"\n col-lg-number=\"1\"\n row-lg-number=\"1\"\n width-lg=\"1\"\n height-lg=\"1\"\n col-md-number=\"1\"\n row-md-number=\"1\"\n width-md=\"1\"\n height-md=\"1\"\n col-sm-number=\"1\"\n row-sm-number=\"1\"\n width-sm=\"1\"\n height-sm=\"1\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"height: 100%; background-color: red;\"\n col-lg-number=\"3\"\n row-lg-number=\"1\"\n width-lg=\"2\"\n height-lg=\"1\"\n col-md-number=\"2\"\n row-md-number=\"2\"\n width-md=\"1\"\n height-md=\"1\"\n col-sm-number=\"1\"\n row-sm-number=\"2\"\n width-sm=\"1\"\n height-sm=\"1\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"2\" col-count=\"4\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: green;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"1\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"2\"\n row-number=\"1\"\n width=\"3\"\n height=\"2\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"2\" col-count=\"4\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"1\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"2\"\n row-number=\"1\"\n width=\"2\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: green;\"\n col-number=\"4\"\n row-number=\"1\"\n width=\"1\"\n height=\"2\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"3\" col-count=\"4\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"4\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"1\"\n row-number=\"3\"\n width=\"3\"\n height=\"1\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"4\"\n row-number=\"3\"\n width=\"1\"\n height=\"1\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"4\" col-count=\"4\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"4\"\n height=\"1\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"1\"\n row-number=\"2\"\n width=\"1\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"2\"\n row-number=\"2\"\n width=\"3\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: green;\"\n col-number=\"1\"\n row-number=\"4\"\n width=\"4\"\n height=\"1\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"6\" col-count=\"6\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"2\"\n height=\"6\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"3\"\n row-number=\"1\"\n width=\"4\"\n height=\"3\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"3\"\n row-number=\"4\"\n width=\"2\"\n height=\"3\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"5\"\n row-number=\"4\"\n width=\"1\"\n height=\"3\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: green;\"\n col-number=\"6\"\n row-number=\"4\"\n width=\"1\"\n height=\"3\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"6\" col-count=\"6\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"1\"\n height=\"6\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"2\"\n row-number=\"1\"\n width=\"5\"\n height=\"4\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"2\"\n row-number=\"5\"\n width=\"5\"\n height=\"2\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"6\" col-count=\"6\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"1\"\n height=\"6\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"2\"\n row-number=\"1\"\n width=\"5\"\n height=\"4\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"2\"\n row-number=\"5\"\n width=\"5\"\n height=\"2\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n </div>\n `,\n}"
17117
- }
17118
- ],
17119
- "exports": [
17120
- {
17121
- "kind": "js",
17122
- "name": "default",
17123
- "declaration": {
17124
- "name": "meta",
17125
- "module": "src/grid-layout/grid-layout.stories.ts"
17126
- }
17127
- },
17128
- {
17129
- "kind": "js",
17130
- "name": "Primary",
17131
- "declaration": {
17132
- "name": "Primary",
17133
- "module": "src/grid-layout/grid-layout.stories.ts"
17134
- }
17135
- }
17136
- ]
17137
- },
17138
- {
17139
- "kind": "javascript-module",
17140
- "path": "src/grid-layout/grid-layout.ts",
17141
- "declarations": [
17142
- {
17143
- "kind": "class",
17144
- "description": "",
17145
- "name": "GridLayout",
17146
- "superclass": {
17147
- "name": "FoundationGridLayout",
17148
- "package": "@genesislcap/foundation-ui"
17149
- },
17150
- "tagName": "%%prefix%%-grid-layout",
17151
- "customElement": true,
17152
- "attributes": [
16921
+ ],
16922
+ "members": [
17153
16923
  {
16924
+ "kind": "field",
17154
16925
  "name": "['col-count']",
17155
16926
  "type": {
17156
16927
  "text": "string"
17157
16928
  },
17158
- "fieldName": "['col-count']",
17159
16929
  "inheritedFrom": {
17160
16930
  "name": "GridLayout",
17161
16931
  "module": "src/grid-layout/grid-layout.ts"
17162
16932
  }
17163
16933
  },
17164
16934
  {
16935
+ "kind": "field",
17165
16936
  "name": "['col-width']",
17166
16937
  "type": {
17167
16938
  "text": "string"
17168
16939
  },
17169
- "fieldName": "['col-width']",
17170
16940
  "inheritedFrom": {
17171
16941
  "name": "GridLayout",
17172
16942
  "module": "src/grid-layout/grid-layout.ts"
17173
16943
  }
17174
16944
  },
17175
16945
  {
16946
+ "kind": "field",
17176
16947
  "name": "['col-lg-count']",
17177
16948
  "type": {
17178
16949
  "text": "string"
17179
16950
  },
17180
- "fieldName": "['col-lg-count']",
17181
16951
  "inheritedFrom": {
17182
16952
  "name": "GridLayout",
17183
16953
  "module": "src/grid-layout/grid-layout.ts"
17184
16954
  }
17185
16955
  },
17186
16956
  {
16957
+ "kind": "field",
17187
16958
  "name": "['col-lg-width']",
17188
16959
  "type": {
17189
16960
  "text": "string"
17190
16961
  },
17191
- "fieldName": "['col-lg-width']",
17192
16962
  "inheritedFrom": {
17193
16963
  "name": "GridLayout",
17194
16964
  "module": "src/grid-layout/grid-layout.ts"
17195
16965
  }
17196
16966
  },
17197
16967
  {
16968
+ "kind": "field",
17198
16969
  "name": "['col-md-count']",
17199
16970
  "type": {
17200
16971
  "text": "string"
17201
16972
  },
17202
- "fieldName": "['col-md-count']",
17203
16973
  "inheritedFrom": {
17204
16974
  "name": "GridLayout",
17205
16975
  "module": "src/grid-layout/grid-layout.ts"
17206
16976
  }
17207
16977
  },
17208
16978
  {
16979
+ "kind": "field",
17209
16980
  "name": "['col-md-width']",
17210
16981
  "type": {
17211
16982
  "text": "string"
17212
16983
  },
17213
- "fieldName": "['col-md-width']",
17214
16984
  "inheritedFrom": {
17215
16985
  "name": "GridLayout",
17216
16986
  "module": "src/grid-layout/grid-layout.ts"
17217
16987
  }
17218
16988
  },
17219
16989
  {
16990
+ "kind": "field",
17220
16991
  "name": "['col-sm-count']",
17221
16992
  "type": {
17222
16993
  "text": "string"
17223
16994
  },
17224
- "fieldName": "['col-sm-count']",
17225
16995
  "inheritedFrom": {
17226
16996
  "name": "GridLayout",
17227
16997
  "module": "src/grid-layout/grid-layout.ts"
17228
16998
  }
17229
16999
  },
17230
17000
  {
17001
+ "kind": "field",
17231
17002
  "name": "['col-sm-width']",
17232
17003
  "type": {
17233
17004
  "text": "string"
17234
17005
  },
17235
- "fieldName": "['col-sm-width']",
17236
17006
  "inheritedFrom": {
17237
17007
  "name": "GridLayout",
17238
17008
  "module": "src/grid-layout/grid-layout.ts"
17239
17009
  }
17240
17010
  },
17241
17011
  {
17012
+ "kind": "field",
17242
17013
  "name": "['row-count']",
17243
17014
  "type": {
17244
17015
  "text": "string"
17245
17016
  },
17246
- "fieldName": "['row-count']",
17247
17017
  "inheritedFrom": {
17248
17018
  "name": "GridLayout",
17249
17019
  "module": "src/grid-layout/grid-layout.ts"
17250
17020
  }
17251
17021
  },
17252
17022
  {
17023
+ "kind": "field",
17253
17024
  "name": "['row-height']",
17254
17025
  "type": {
17255
17026
  "text": "string"
17256
17027
  },
17257
- "fieldName": "['row-height']",
17258
17028
  "inheritedFrom": {
17259
17029
  "name": "GridLayout",
17260
17030
  "module": "src/grid-layout/grid-layout.ts"
17261
17031
  }
17262
17032
  },
17263
17033
  {
17034
+ "kind": "field",
17264
17035
  "name": "['row-lg-count']",
17265
17036
  "type": {
17266
17037
  "text": "string"
17267
17038
  },
17268
- "fieldName": "['row-lg-count']",
17269
17039
  "inheritedFrom": {
17270
17040
  "name": "GridLayout",
17271
17041
  "module": "src/grid-layout/grid-layout.ts"
17272
17042
  }
17273
17043
  },
17274
17044
  {
17045
+ "kind": "field",
17275
17046
  "name": "['row-lg-height']",
17276
17047
  "type": {
17277
17048
  "text": "string"
17278
17049
  },
17279
- "fieldName": "['row-lg-height']",
17280
17050
  "inheritedFrom": {
17281
17051
  "name": "GridLayout",
17282
17052
  "module": "src/grid-layout/grid-layout.ts"
17283
17053
  }
17284
17054
  },
17285
17055
  {
17056
+ "kind": "field",
17286
17057
  "name": "['row-md-count']",
17287
17058
  "type": {
17288
17059
  "text": "string"
17289
17060
  },
17290
- "fieldName": "['row-md-count']",
17291
17061
  "inheritedFrom": {
17292
17062
  "name": "GridLayout",
17293
17063
  "module": "src/grid-layout/grid-layout.ts"
17294
17064
  }
17295
17065
  },
17296
17066
  {
17067
+ "kind": "field",
17297
17068
  "name": "['row-md-height']",
17298
17069
  "type": {
17299
17070
  "text": "string"
17300
17071
  },
17301
- "fieldName": "['row-md-height']",
17302
17072
  "inheritedFrom": {
17303
17073
  "name": "GridLayout",
17304
17074
  "module": "src/grid-layout/grid-layout.ts"
17305
17075
  }
17306
17076
  },
17307
17077
  {
17078
+ "kind": "field",
17308
17079
  "name": "['row-sm-count']",
17309
17080
  "type": {
17310
17081
  "text": "string"
17311
17082
  },
17312
- "fieldName": "['row-sm-count']",
17313
17083
  "inheritedFrom": {
17314
17084
  "name": "GridLayout",
17315
17085
  "module": "src/grid-layout/grid-layout.ts"
17316
17086
  }
17317
17087
  },
17318
17088
  {
17089
+ "kind": "field",
17319
17090
  "name": "['row-sm-height']",
17320
17091
  "type": {
17321
17092
  "text": "string"
17322
17093
  },
17323
- "fieldName": "['row-sm-height']",
17324
17094
  "inheritedFrom": {
17325
17095
  "name": "GridLayout",
17326
17096
  "module": "src/grid-layout/grid-layout.ts"
17327
17097
  }
17328
- }
17329
- ],
17330
- "members": [
17098
+ },
17331
17099
  {
17332
17100
  "kind": "field",
17333
- "name": "['col-count']",
17101
+ "name": "behaviors",
17334
17102
  "type": {
17335
- "text": "string"
17103
+ "text": "Behavior[]"
17336
17104
  },
17105
+ "privacy": "private",
17106
+ "default": "[]",
17337
17107
  "inheritedFrom": {
17338
17108
  "name": "GridLayout",
17339
17109
  "module": "src/grid-layout/grid-layout.ts"
@@ -17341,10 +17111,11 @@
17341
17111
  },
17342
17112
  {
17343
17113
  "kind": "field",
17344
- "name": "['col-width']",
17114
+ "name": "baseStyles",
17345
17115
  "type": {
17346
- "text": "string"
17116
+ "text": "ElementStyles"
17347
17117
  },
17118
+ "privacy": "private",
17348
17119
  "inheritedFrom": {
17349
17120
  "name": "GridLayout",
17350
17121
  "module": "src/grid-layout/grid-layout.ts"
@@ -17352,181 +17123,386 @@
17352
17123
  },
17353
17124
  {
17354
17125
  "kind": "field",
17355
- "name": "['col-lg-count']",
17126
+ "name": "_presentation",
17356
17127
  "type": {
17357
- "text": "string"
17128
+ "text": "ComponentPresentation | null | undefined"
17358
17129
  },
17130
+ "privacy": "private",
17131
+ "default": "void 0",
17359
17132
  "inheritedFrom": {
17360
- "name": "GridLayout",
17361
- "module": "src/grid-layout/grid-layout.ts"
17133
+ "name": "FoundationElement",
17134
+ "module": "src/foundation-element/foundation-element.ts"
17362
17135
  }
17363
17136
  },
17364
17137
  {
17365
17138
  "kind": "field",
17366
- "name": "['col-lg-width']",
17139
+ "name": "$presentation",
17367
17140
  "type": {
17368
- "text": "string"
17141
+ "text": "ComponentPresentation | null"
17369
17142
  },
17143
+ "privacy": "public",
17144
+ "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
17370
17145
  "inheritedFrom": {
17371
- "name": "GridLayout",
17372
- "module": "src/grid-layout/grid-layout.ts"
17146
+ "name": "FoundationElement",
17147
+ "module": "src/foundation-element/foundation-element.ts"
17373
17148
  }
17374
17149
  },
17375
17150
  {
17376
17151
  "kind": "field",
17377
- "name": "['col-md-count']",
17152
+ "name": "template",
17378
17153
  "type": {
17379
- "text": "string"
17154
+ "text": "ElementViewTemplate | void | null"
17380
17155
  },
17156
+ "privacy": "public",
17157
+ "description": "Sets the template of the element instance. When undefined,\nthe element will attempt to resolve the template from\nthe associated presentation or custom element definition.",
17381
17158
  "inheritedFrom": {
17382
- "name": "GridLayout",
17383
- "module": "src/grid-layout/grid-layout.ts"
17159
+ "name": "FoundationElement",
17160
+ "module": "src/foundation-element/foundation-element.ts"
17384
17161
  }
17385
17162
  },
17386
17163
  {
17387
- "kind": "field",
17388
- "name": "['col-md-width']",
17389
- "type": {
17390
- "text": "string"
17164
+ "kind": "method",
17165
+ "name": "templateChanged",
17166
+ "privacy": "protected",
17167
+ "return": {
17168
+ "type": {
17169
+ "text": "void"
17170
+ }
17391
17171
  },
17392
17172
  "inheritedFrom": {
17393
- "name": "GridLayout",
17394
- "module": "src/grid-layout/grid-layout.ts"
17173
+ "name": "FoundationElement",
17174
+ "module": "src/foundation-element/foundation-element.ts"
17395
17175
  }
17396
17176
  },
17397
17177
  {
17398
17178
  "kind": "field",
17399
- "name": "['col-sm-count']",
17179
+ "name": "styles",
17400
17180
  "type": {
17401
- "text": "string"
17181
+ "text": "ElementStyles | void | null"
17402
17182
  },
17183
+ "privacy": "public",
17184
+ "description": "Sets the default styles for the element instance. When undefined,\nthe element will attempt to resolve default styles from\nthe associated presentation or custom element definition.",
17403
17185
  "inheritedFrom": {
17404
- "name": "GridLayout",
17405
- "module": "src/grid-layout/grid-layout.ts"
17186
+ "name": "FoundationElement",
17187
+ "module": "src/foundation-element/foundation-element.ts"
17188
+ }
17189
+ },
17190
+ {
17191
+ "kind": "method",
17192
+ "name": "stylesChanged",
17193
+ "privacy": "protected",
17194
+ "return": {
17195
+ "type": {
17196
+ "text": "void"
17197
+ }
17198
+ },
17199
+ "inheritedFrom": {
17200
+ "name": "FoundationElement",
17201
+ "module": "src/foundation-element/foundation-element.ts"
17406
17202
  }
17407
17203
  },
17408
17204
  {
17409
- "kind": "field",
17410
- "name": "['col-sm-width']",
17205
+ "kind": "method",
17206
+ "name": "compose",
17207
+ "privacy": "public",
17208
+ "static": true,
17209
+ "return": {
17210
+ "type": {
17211
+ "text": "(\n overrideDefinition?: OverrideFoundationElementDefinition<T>\n ) => FoundationElementRegistry<T, K>"
17212
+ }
17213
+ },
17214
+ "parameters": [
17215
+ {
17216
+ "name": "this",
17217
+ "type": {
17218
+ "text": "K"
17219
+ }
17220
+ },
17221
+ {
17222
+ "name": "elementDefinition",
17223
+ "type": {
17224
+ "text": "T"
17225
+ },
17226
+ "description": "The definition of the element to create the registry\nfunction for."
17227
+ }
17228
+ ],
17229
+ "description": "Defines an element registry function with a set of element definition defaults.",
17230
+ "inheritedFrom": {
17231
+ "name": "FoundationElement",
17232
+ "module": "src/foundation-element/foundation-element.ts"
17233
+ }
17234
+ }
17235
+ ]
17236
+ },
17237
+ {
17238
+ "kind": "variable",
17239
+ "name": "zeroGridLayout",
17240
+ "description": "The Zero Grid Layout",
17241
+ "privacy": "public"
17242
+ }
17243
+ ],
17244
+ "exports": [
17245
+ {
17246
+ "kind": "js",
17247
+ "name": "GridLayout",
17248
+ "declaration": {
17249
+ "name": "GridLayout",
17250
+ "module": "src/grid-layout/grid-layout.ts"
17251
+ }
17252
+ },
17253
+ {
17254
+ "kind": "js",
17255
+ "name": "zeroGridLayout",
17256
+ "declaration": {
17257
+ "name": "zeroGridLayout",
17258
+ "module": "src/grid-layout/grid-layout.ts"
17259
+ }
17260
+ }
17261
+ ]
17262
+ },
17263
+ {
17264
+ "kind": "javascript-module",
17265
+ "path": "src/grid-layout/index.ts",
17266
+ "declarations": [],
17267
+ "exports": [
17268
+ {
17269
+ "kind": "js",
17270
+ "name": "*",
17271
+ "declaration": {
17272
+ "name": "*",
17273
+ "package": "./grid-layout"
17274
+ }
17275
+ }
17276
+ ]
17277
+ },
17278
+ {
17279
+ "kind": "javascript-module",
17280
+ "path": "src/flipper/flipper.stories.ts",
17281
+ "declarations": [
17282
+ {
17283
+ "kind": "variable",
17284
+ "name": "meta",
17285
+ "type": {
17286
+ "text": "Meta"
17287
+ },
17288
+ "default": "{\n title: 'Flipper',\n component: 'zero-flipper',\n}"
17289
+ },
17290
+ {
17291
+ "kind": "variable",
17292
+ "name": "Primary",
17293
+ "type": {
17294
+ "text": "StoryObj"
17295
+ },
17296
+ "default": "{\n argTypes: {\n direction: {\n control: 'select',\n options: ['previous', 'next'],\n },\n },\n args: {\n direction: 'next',\n },\n render: ({ direction }) => html`\n <zero-flipper direction=\"${direction}\">Zero Flipper</zero-flipper>\n `,\n}"
17297
+ }
17298
+ ],
17299
+ "exports": [
17300
+ {
17301
+ "kind": "js",
17302
+ "name": "default",
17303
+ "declaration": {
17304
+ "name": "meta",
17305
+ "module": "src/flipper/flipper.stories.ts"
17306
+ }
17307
+ },
17308
+ {
17309
+ "kind": "js",
17310
+ "name": "Primary",
17311
+ "declaration": {
17312
+ "name": "Primary",
17313
+ "module": "src/flipper/flipper.stories.ts"
17314
+ }
17315
+ }
17316
+ ]
17317
+ },
17318
+ {
17319
+ "kind": "javascript-module",
17320
+ "path": "src/flipper/flipper.styles.ts",
17321
+ "declarations": [
17322
+ {
17323
+ "kind": "function",
17324
+ "name": "zeroFlipperStyles",
17325
+ "return": {
17326
+ "type": {
17327
+ "text": "ElementStyles"
17328
+ }
17329
+ },
17330
+ "parameters": [
17331
+ {
17332
+ "name": "context",
17411
17333
  "type": {
17412
- "text": "string"
17413
- },
17414
- "inheritedFrom": {
17415
- "name": "GridLayout",
17416
- "module": "src/grid-layout/grid-layout.ts"
17334
+ "text": "ElementDefinitionContext"
17417
17335
  }
17418
17336
  },
17419
17337
  {
17420
- "kind": "field",
17421
- "name": "['row-count']",
17338
+ "name": "definition",
17422
17339
  "type": {
17423
- "text": "string"
17424
- },
17425
- "inheritedFrom": {
17426
- "name": "GridLayout",
17427
- "module": "src/grid-layout/grid-layout.ts"
17340
+ "text": "FlipperOptions"
17428
17341
  }
17429
- },
17342
+ }
17343
+ ]
17344
+ }
17345
+ ],
17346
+ "exports": [
17347
+ {
17348
+ "kind": "js",
17349
+ "name": "zeroFlipperStyles",
17350
+ "declaration": {
17351
+ "name": "zeroFlipperStyles",
17352
+ "module": "src/flipper/flipper.styles.ts"
17353
+ }
17354
+ }
17355
+ ]
17356
+ },
17357
+ {
17358
+ "kind": "javascript-module",
17359
+ "path": "src/flipper/flipper.template.ts",
17360
+ "declarations": [
17361
+ {
17362
+ "kind": "function",
17363
+ "name": "zeroFlipperTemplate",
17364
+ "return": {
17365
+ "type": {
17366
+ "text": "ViewTemplate<Flipper>"
17367
+ }
17368
+ },
17369
+ "parameters": [
17430
17370
  {
17431
- "kind": "field",
17432
- "name": "['row-height']",
17371
+ "name": "context",
17433
17372
  "type": {
17434
- "text": "string"
17435
- },
17436
- "inheritedFrom": {
17437
- "name": "GridLayout",
17438
- "module": "src/grid-layout/grid-layout.ts"
17373
+ "text": "ElementDefinitionContext"
17439
17374
  }
17440
17375
  },
17441
17376
  {
17442
- "kind": "field",
17443
- "name": "['row-lg-count']",
17377
+ "name": "definition",
17444
17378
  "type": {
17445
- "text": "string"
17446
- },
17447
- "inheritedFrom": {
17448
- "name": "GridLayout",
17449
- "module": "src/grid-layout/grid-layout.ts"
17379
+ "text": "FlipperOptions"
17450
17380
  }
17451
- },
17381
+ }
17382
+ ]
17383
+ }
17384
+ ],
17385
+ "exports": [
17386
+ {
17387
+ "kind": "js",
17388
+ "name": "zeroFlipperTemplate",
17389
+ "declaration": {
17390
+ "name": "zeroFlipperTemplate",
17391
+ "module": "src/flipper/flipper.template.ts"
17392
+ }
17393
+ }
17394
+ ]
17395
+ },
17396
+ {
17397
+ "kind": "javascript-module",
17398
+ "path": "src/flipper/flipper.ts",
17399
+ "declarations": [
17400
+ {
17401
+ "kind": "class",
17402
+ "description": "",
17403
+ "name": "Flipper",
17404
+ "superclass": {
17405
+ "name": "FoundationFlipper",
17406
+ "package": "@genesislcap/foundation-ui"
17407
+ },
17408
+ "tagName": "%%prefix%%-flipper",
17409
+ "customElement": true,
17410
+ "attributes": [
17452
17411
  {
17453
- "kind": "field",
17454
- "name": "['row-lg-height']",
17455
17412
  "type": {
17456
- "text": "string"
17413
+ "text": "boolean"
17457
17414
  },
17415
+ "description": "The disabled state of the flipper.",
17416
+ "fieldName": "disabled",
17458
17417
  "inheritedFrom": {
17459
- "name": "GridLayout",
17460
- "module": "src/grid-layout/grid-layout.ts"
17418
+ "name": "Flipper",
17419
+ "module": "src/flipper/flipper.ts"
17461
17420
  }
17462
17421
  },
17463
17422
  {
17464
- "kind": "field",
17465
- "name": "['row-md-count']",
17423
+ "name": "aria-hidden",
17466
17424
  "type": {
17467
- "text": "string"
17425
+ "text": "boolean"
17468
17426
  },
17427
+ "default": "true",
17428
+ "description": "Indicates the flipper should be hidden from assistive technology. Because flippers are often supplementary navigation, they are often hidden from assistive technology.",
17429
+ "fieldName": "hiddenFromAT",
17469
17430
  "inheritedFrom": {
17470
- "name": "GridLayout",
17471
- "module": "src/grid-layout/grid-layout.ts"
17431
+ "name": "Flipper",
17432
+ "module": "src/flipper/flipper.ts"
17472
17433
  }
17473
17434
  },
17474
17435
  {
17475
- "kind": "field",
17476
- "name": "['row-md-height']",
17436
+ "name": "direction",
17477
17437
  "type": {
17478
- "text": "string"
17438
+ "text": "FlipperDirection"
17479
17439
  },
17440
+ "description": "The direction that the flipper implies navigating.",
17441
+ "fieldName": "direction",
17480
17442
  "inheritedFrom": {
17481
- "name": "GridLayout",
17482
- "module": "src/grid-layout/grid-layout.ts"
17443
+ "name": "Flipper",
17444
+ "module": "src/flipper/flipper.ts"
17483
17445
  }
17484
- },
17446
+ }
17447
+ ],
17448
+ "members": [
17485
17449
  {
17486
17450
  "kind": "field",
17487
- "name": "['row-sm-count']",
17451
+ "name": "disabled",
17488
17452
  "type": {
17489
- "text": "string"
17453
+ "text": "boolean"
17490
17454
  },
17455
+ "privacy": "public",
17456
+ "description": "The disabled state of the flipper.",
17491
17457
  "inheritedFrom": {
17492
- "name": "GridLayout",
17493
- "module": "src/grid-layout/grid-layout.ts"
17458
+ "name": "Flipper",
17459
+ "module": "src/flipper/flipper.ts"
17494
17460
  }
17495
17461
  },
17496
17462
  {
17497
17463
  "kind": "field",
17498
- "name": "['row-sm-height']",
17464
+ "name": "hiddenFromAT",
17499
17465
  "type": {
17500
- "text": "string"
17466
+ "text": "boolean"
17501
17467
  },
17468
+ "privacy": "public",
17469
+ "default": "true",
17470
+ "description": "Indicates the flipper should be hidden from assistive technology. Because flippers are often supplementary navigation, they are often hidden from assistive technology.",
17502
17471
  "inheritedFrom": {
17503
- "name": "GridLayout",
17504
- "module": "src/grid-layout/grid-layout.ts"
17472
+ "name": "Flipper",
17473
+ "module": "src/flipper/flipper.ts"
17505
17474
  }
17506
17475
  },
17507
17476
  {
17508
17477
  "kind": "field",
17509
- "name": "behaviors",
17478
+ "name": "direction",
17510
17479
  "type": {
17511
- "text": "Behavior[]"
17480
+ "text": "FlipperDirection"
17512
17481
  },
17513
- "privacy": "private",
17514
- "default": "[]",
17482
+ "privacy": "public",
17483
+ "description": "The direction that the flipper implies navigating.",
17515
17484
  "inheritedFrom": {
17516
- "name": "GridLayout",
17517
- "module": "src/grid-layout/grid-layout.ts"
17485
+ "name": "Flipper",
17486
+ "module": "src/flipper/flipper.ts"
17518
17487
  }
17519
17488
  },
17520
17489
  {
17521
- "kind": "field",
17522
- "name": "baseStyles",
17523
- "type": {
17524
- "text": "ElementStyles"
17525
- },
17526
- "privacy": "private",
17490
+ "kind": "method",
17491
+ "name": "keyupHandler",
17492
+ "privacy": "public",
17493
+ "parameters": [
17494
+ {
17495
+ "name": "e",
17496
+ "type": {
17497
+ "text": "Event & KeyboardEvent"
17498
+ },
17499
+ "description": "Keyboard event"
17500
+ }
17501
+ ],
17502
+ "description": "Simulate a click event when the flipper has focus and the user hits enter or space keys\nBlur focus if the user hits escape key",
17527
17503
  "inheritedFrom": {
17528
- "name": "GridLayout",
17529
- "module": "src/grid-layout/grid-layout.ts"
17504
+ "name": "Flipper",
17505
+ "module": "src/flipper/flipper.ts"
17530
17506
  }
17531
17507
  },
17532
17508
  {
@@ -17538,8 +17514,8 @@
17538
17514
  "privacy": "private",
17539
17515
  "default": "void 0",
17540
17516
  "inheritedFrom": {
17541
- "name": "FoundationElement",
17542
- "module": "src/foundation-element/foundation-element.ts"
17517
+ "name": "Flipper",
17518
+ "module": "src/flipper/flipper.ts"
17543
17519
  }
17544
17520
  },
17545
17521
  {
@@ -17551,8 +17527,8 @@
17551
17527
  "privacy": "public",
17552
17528
  "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
17553
17529
  "inheritedFrom": {
17554
- "name": "FoundationElement",
17555
- "module": "src/foundation-element/foundation-element.ts"
17530
+ "name": "Flipper",
17531
+ "module": "src/flipper/flipper.ts"
17556
17532
  }
17557
17533
  },
17558
17534
  {
@@ -17564,8 +17540,8 @@
17564
17540
  "privacy": "public",
17565
17541
  "description": "Sets the template of the element instance. When undefined,\nthe element will attempt to resolve the template from\nthe associated presentation or custom element definition.",
17566
17542
  "inheritedFrom": {
17567
- "name": "FoundationElement",
17568
- "module": "src/foundation-element/foundation-element.ts"
17543
+ "name": "Flipper",
17544
+ "module": "src/flipper/flipper.ts"
17569
17545
  }
17570
17546
  },
17571
17547
  {
@@ -17578,8 +17554,8 @@
17578
17554
  }
17579
17555
  },
17580
17556
  "inheritedFrom": {
17581
- "name": "FoundationElement",
17582
- "module": "src/foundation-element/foundation-element.ts"
17557
+ "name": "Flipper",
17558
+ "module": "src/flipper/flipper.ts"
17583
17559
  }
17584
17560
  },
17585
17561
  {
@@ -17591,8 +17567,8 @@
17591
17567
  "privacy": "public",
17592
17568
  "description": "Sets the default styles for the element instance. When undefined,\nthe element will attempt to resolve default styles from\nthe associated presentation or custom element definition.",
17593
17569
  "inheritedFrom": {
17594
- "name": "FoundationElement",
17595
- "module": "src/foundation-element/foundation-element.ts"
17570
+ "name": "Flipper",
17571
+ "module": "src/flipper/flipper.ts"
17596
17572
  }
17597
17573
  },
17598
17574
  {
@@ -17605,8 +17581,8 @@
17605
17581
  }
17606
17582
  },
17607
17583
  "inheritedFrom": {
17608
- "name": "FoundationElement",
17609
- "module": "src/foundation-element/foundation-element.ts"
17584
+ "name": "Flipper",
17585
+ "module": "src/flipper/flipper.ts"
17610
17586
  }
17611
17587
  },
17612
17588
  {
@@ -17636,41 +17612,49 @@
17636
17612
  ],
17637
17613
  "description": "Defines an element registry function with a set of element definition defaults.",
17638
17614
  "inheritedFrom": {
17639
- "name": "FoundationElement",
17640
- "module": "src/foundation-element/foundation-element.ts"
17615
+ "name": "Flipper",
17616
+ "module": "src/flipper/flipper.ts"
17617
+ }
17618
+ }
17619
+ ],
17620
+ "events": [
17621
+ {
17622
+ "description": "Fires a custom 'click' event when Enter or Space is invoked via keyboard and the flipper is exposed to assistive technologies.",
17623
+ "name": "click",
17624
+ "inheritedFrom": {
17625
+ "name": "Flipper",
17626
+ "module": "src/flipper/flipper.ts"
17641
17627
  }
17642
17628
  }
17643
17629
  ]
17644
17630
  },
17645
17631
  {
17646
17632
  "kind": "variable",
17647
- "name": "zeroGridLayout",
17648
- "description": "The Zero Grid Layout",
17649
- "privacy": "public"
17633
+ "name": "zeroFlipper"
17650
17634
  }
17651
17635
  ],
17652
17636
  "exports": [
17653
17637
  {
17654
17638
  "kind": "js",
17655
- "name": "GridLayout",
17639
+ "name": "Flipper",
17656
17640
  "declaration": {
17657
- "name": "GridLayout",
17658
- "module": "src/grid-layout/grid-layout.ts"
17641
+ "name": "Flipper",
17642
+ "module": "src/flipper/flipper.ts"
17659
17643
  }
17660
17644
  },
17661
17645
  {
17662
17646
  "kind": "js",
17663
- "name": "zeroGridLayout",
17647
+ "name": "zeroFlipper",
17664
17648
  "declaration": {
17665
- "name": "zeroGridLayout",
17666
- "module": "src/grid-layout/grid-layout.ts"
17649
+ "name": "zeroFlipper",
17650
+ "module": "src/flipper/flipper.ts"
17667
17651
  }
17668
17652
  }
17669
17653
  ]
17670
17654
  },
17671
17655
  {
17672
17656
  "kind": "javascript-module",
17673
- "path": "src/grid-layout/index.ts",
17657
+ "path": "src/flipper/index.ts",
17674
17658
  "declarations": [],
17675
17659
  "exports": [
17676
17660
  {
@@ -17678,7 +17662,23 @@
17678
17662
  "name": "*",
17679
17663
  "declaration": {
17680
17664
  "name": "*",
17681
- "package": "./grid-layout"
17665
+ "package": "./flipper"
17666
+ }
17667
+ },
17668
+ {
17669
+ "kind": "js",
17670
+ "name": "*",
17671
+ "declaration": {
17672
+ "name": "*",
17673
+ "package": "./flipper.styles"
17674
+ }
17675
+ },
17676
+ {
17677
+ "kind": "js",
17678
+ "name": "*",
17679
+ "declaration": {
17680
+ "name": "*",
17681
+ "package": "./flipper.template"
17682
17682
  }
17683
17683
  }
17684
17684
  ]
@@ -18964,7 +18964,38 @@
18964
18964
  },
18965
18965
  {
18966
18966
  "kind": "javascript-module",
18967
- "path": "src/icon/icon.stories.ts",
18967
+ "path": "src/listbox/index.ts",
18968
+ "declarations": [],
18969
+ "exports": [
18970
+ {
18971
+ "kind": "js",
18972
+ "name": "*",
18973
+ "declaration": {
18974
+ "name": "*",
18975
+ "package": "./listbox.template"
18976
+ }
18977
+ },
18978
+ {
18979
+ "kind": "js",
18980
+ "name": "*",
18981
+ "declaration": {
18982
+ "name": "*",
18983
+ "package": "./listbox.styles"
18984
+ }
18985
+ },
18986
+ {
18987
+ "kind": "js",
18988
+ "name": "*",
18989
+ "declaration": {
18990
+ "name": "*",
18991
+ "package": "./listbox"
18992
+ }
18993
+ }
18994
+ ]
18995
+ },
18996
+ {
18997
+ "kind": "javascript-module",
18998
+ "path": "src/listbox/listbox.stories.ts",
18968
18999
  "declarations": [
18969
19000
  {
18970
19001
  "kind": "variable",
@@ -18972,23 +19003,15 @@
18972
19003
  "type": {
18973
19004
  "text": "Meta"
18974
19005
  },
18975
- "default": "{\n title: 'Icon',\n component: 'zero-icon',\n}"
18976
- },
18977
- {
18978
- "kind": "variable",
18979
- "name": "Multiple",
18980
- "type": {
18981
- "text": "StoryObj"
18982
- },
18983
- "default": "{\n render: () => html`\n <div style=\"${wrapperStyle}\">\n <zero-icon name=\"glasses\" size=\"1x\"></zero-icon>\n <zero-icon name=\"amazon\" size=\"2x\" variant=\"brand\"></zero-icon>\n <zero-icon name=\"amazon-pay\" size=\"3x\" variant=\"brand\"></zero-icon>\n <zero-icon name=\"apple\" size=\"4x\" variant=\"brand\"></zero-icon>\n <zero-icon name=\"chrome\" size=\"5x\" variant=\"brand\"></zero-icon>\n <zero-icon name=\"ambulance\" size=\"xs\"></zero-icon>\n <zero-icon name=\"angry\" size=\"1x\"></zero-icon>\n <zero-icon variant=\"regular\" name=\"angry\" size=\"sm\"></zero-icon>\n <zero-icon name=\"address-book\" size=\"lg\"></zero-icon>\n <zero-icon variant=\"regular\" name=\"address-book\" size=\"xl\"></zero-icon>\n <zero-icon name=\"bookmark\" size=\"2xl;\"></zero-icon>\n <zero-icon variant=\"regular\" name=\"bookmark\" size=\"2xs\"></zero-icon>\n </div>\n `,\n}"
19006
+ "default": "{\n title: 'Listbox',\n component: 'zero-listbox',\n}"
18984
19007
  },
18985
19008
  {
18986
19009
  "kind": "variable",
18987
- "name": "Configurable",
19010
+ "name": "Primary",
18988
19011
  "type": {
18989
19012
  "text": "StoryObj"
18990
19013
  },
18991
- "default": "{\n argTypes: {\n size: {\n control: 'select',\n options: [\n '2xs',\n 'xs',\n 'sm',\n 'lg',\n 'xl',\n '2xl',\n '1x',\n '2x',\n '3x',\n '4x',\n '5x',\n '6x',\n '7x',\n '8x',\n '9x',\n '10x',\n ],\n },\n variant: {\n control: 'select',\n options: ['solid', 'regular', 'brand'],\n },\n },\n args: {\n name: 'glasses',\n size: 'lg',\n variant: 'solid',\n },\n render: ({ name, size, variant }) => html`\n <zero-icon name=\"${name}\" size=\"${size}\" variant=\"${variant}\"></zero-icon>\n `,\n}"
19014
+ "default": "{\n render: () => html`\n <zero-listbox style=\"width: 200px;\">\n <zero-option>Option 1</zero-option>\n <zero-option>Option 2</zero-option>\n <zero-option>Option 3</zero-option>\n </zero-listbox>\n `,\n}"
18992
19015
  }
18993
19016
  ],
18994
19017
  "exports": [
@@ -18997,37 +19020,68 @@
18997
19020
  "name": "default",
18998
19021
  "declaration": {
18999
19022
  "name": "meta",
19000
- "module": "src/icon/icon.stories.ts"
19023
+ "module": "src/listbox/listbox.stories.ts"
19001
19024
  }
19002
19025
  },
19003
19026
  {
19004
19027
  "kind": "js",
19005
- "name": "Multiple",
19028
+ "name": "Primary",
19006
19029
  "declaration": {
19007
- "name": "Multiple",
19008
- "module": "src/icon/icon.stories.ts"
19030
+ "name": "Primary",
19031
+ "module": "src/listbox/listbox.stories.ts"
19009
19032
  }
19010
- },
19033
+ }
19034
+ ]
19035
+ },
19036
+ {
19037
+ "kind": "javascript-module",
19038
+ "path": "src/listbox/listbox.styles.ts",
19039
+ "declarations": [
19040
+ {
19041
+ "kind": "function",
19042
+ "name": "zeroListboxStyles",
19043
+ "return": {
19044
+ "type": {
19045
+ "text": "ElementStyles"
19046
+ }
19047
+ },
19048
+ "parameters": [
19049
+ {
19050
+ "name": "context",
19051
+ "type": {
19052
+ "text": "ElementDefinitionContext"
19053
+ }
19054
+ },
19055
+ {
19056
+ "name": "definition",
19057
+ "type": {
19058
+ "text": "FoundationElementDefinition"
19059
+ }
19060
+ }
19061
+ ]
19062
+ }
19063
+ ],
19064
+ "exports": [
19011
19065
  {
19012
19066
  "kind": "js",
19013
- "name": "Configurable",
19067
+ "name": "zeroListboxStyles",
19014
19068
  "declaration": {
19015
- "name": "Configurable",
19016
- "module": "src/icon/icon.stories.ts"
19069
+ "name": "zeroListboxStyles",
19070
+ "module": "src/listbox/listbox.styles.ts"
19017
19071
  }
19018
19072
  }
19019
19073
  ]
19020
19074
  },
19021
19075
  {
19022
19076
  "kind": "javascript-module",
19023
- "path": "src/icon/icon.styles.ts",
19077
+ "path": "src/listbox/listbox.template.ts",
19024
19078
  "declarations": [
19025
19079
  {
19026
19080
  "kind": "function",
19027
- "name": "zeroIconStyles",
19081
+ "name": "zeroListboxTemplate",
19028
19082
  "return": {
19029
19083
  "type": {
19030
- "text": "ElementStyles"
19084
+ "text": "ViewTemplate<Listbox>"
19031
19085
  }
19032
19086
  },
19033
19087
  "parameters": [
@@ -19049,185 +19103,158 @@
19049
19103
  "exports": [
19050
19104
  {
19051
19105
  "kind": "js",
19052
- "name": "zeroIconStyles",
19106
+ "name": "zeroListboxTemplate",
19053
19107
  "declaration": {
19054
- "name": "zeroIconStyles",
19055
- "module": "src/icon/icon.styles.ts"
19108
+ "name": "zeroListboxTemplate",
19109
+ "module": "src/listbox/listbox.template.ts"
19056
19110
  }
19057
19111
  }
19058
19112
  ]
19059
19113
  },
19060
19114
  {
19061
19115
  "kind": "javascript-module",
19062
- "path": "src/icon/icon.ts",
19116
+ "path": "src/listbox/listbox.ts",
19063
19117
  "declarations": [
19064
19118
  {
19065
19119
  "kind": "class",
19066
19120
  "description": "",
19067
- "name": "Icon",
19121
+ "name": "Listbox",
19068
19122
  "superclass": {
19069
- "name": "FoundationIcon",
19123
+ "name": "FoundationListbox",
19070
19124
  "package": "@genesislcap/foundation-ui"
19071
19125
  },
19072
- "tagName": "%%prefix%%-icon",
19126
+ "tagName": "%%prefix%%-listbox",
19073
19127
  "customElement": true,
19074
19128
  "attributes": [
19075
19129
  {
19076
- "name": "name",
19077
- "type": {
19078
- "text": "IconName"
19079
- },
19080
- "fieldName": "name",
19081
- "inheritedFrom": {
19082
- "name": "Icon",
19083
- "module": "src/icon/icon.ts"
19084
- }
19085
- },
19086
- {
19087
- "name": "size",
19088
- "type": {
19089
- "text": "FaSize"
19090
- },
19091
- "default": "'sm'",
19092
- "fieldName": "size",
19093
- "inheritedFrom": {
19094
- "name": "Icon",
19095
- "module": "src/icon/icon.ts"
19096
- }
19097
- },
19098
- {
19099
- "name": "variant",
19100
19130
  "type": {
19101
- "text": "IconStyle"
19131
+ "text": "boolean"
19102
19132
  },
19103
- "default": "'solid'",
19104
- "fieldName": "variant",
19133
+ "description": "The disabled state of the listbox.",
19134
+ "fieldName": "disabled",
19105
19135
  "inheritedFrom": {
19106
- "name": "Icon",
19107
- "module": "src/icon/icon.ts"
19136
+ "name": "Listbox",
19137
+ "module": "src/listbox/listbox.ts"
19108
19138
  }
19109
19139
  }
19110
19140
  ],
19111
19141
  "members": [
19112
19142
  {
19113
19143
  "kind": "field",
19114
- "name": "iElement",
19144
+ "name": "length",
19115
19145
  "type": {
19116
- "text": "HTMLElement"
19146
+ "text": "number"
19117
19147
  },
19148
+ "privacy": "public",
19149
+ "description": "The number of options.",
19118
19150
  "inheritedFrom": {
19119
- "name": "Icon",
19120
- "module": "src/icon/icon.ts"
19151
+ "name": "Listbox",
19152
+ "module": "src/listbox/listbox.ts"
19121
19153
  }
19122
19154
  },
19123
19155
  {
19124
19156
  "kind": "field",
19125
- "name": "name",
19157
+ "name": "options",
19126
19158
  "type": {
19127
- "text": "IconName"
19159
+ "text": "ListboxOption[]"
19128
19160
  },
19161
+ "privacy": "public",
19162
+ "description": "The list of options.",
19129
19163
  "inheritedFrom": {
19130
- "name": "Icon",
19131
- "module": "src/icon/icon.ts"
19164
+ "name": "Listbox",
19165
+ "module": "src/listbox/listbox.ts"
19132
19166
  }
19133
19167
  },
19134
19168
  {
19135
- "kind": "method",
19136
- "name": "nameChanged",
19137
- "parameters": [
19138
- {
19139
- "name": "oldValue",
19140
- "type": {
19141
- "text": "string"
19142
- }
19143
- },
19144
- {
19145
- "name": "newValue",
19146
- "type": {
19147
- "text": "string"
19148
- }
19149
- }
19150
- ],
19169
+ "kind": "field",
19170
+ "name": "typeAheadExpired",
19171
+ "privacy": "protected",
19151
19172
  "inheritedFrom": {
19152
- "name": "Icon",
19153
- "module": "src/icon/icon.ts"
19173
+ "name": "Listbox",
19174
+ "module": "src/listbox/listbox.ts"
19154
19175
  }
19155
19176
  },
19156
19177
  {
19157
19178
  "kind": "field",
19158
- "name": "size",
19179
+ "name": "disabled",
19159
19180
  "type": {
19160
- "text": "FaSize"
19181
+ "text": "boolean"
19161
19182
  },
19162
- "default": "'sm'",
19183
+ "privacy": "public",
19184
+ "description": "The disabled state of the listbox.",
19163
19185
  "inheritedFrom": {
19164
- "name": "Icon",
19165
- "module": "src/icon/icon.ts"
19186
+ "name": "Listbox",
19187
+ "module": "src/listbox/listbox.ts"
19166
19188
  }
19167
19189
  },
19168
19190
  {
19169
- "kind": "method",
19170
- "name": "sizeChanged",
19171
- "parameters": [
19172
- {
19173
- "name": "oldValue",
19174
- "type": {
19175
- "text": "string"
19176
- }
19177
- },
19178
- {
19179
- "name": "newValue",
19180
- "type": {
19181
- "text": "string"
19182
- }
19183
- }
19184
- ],
19191
+ "kind": "field",
19192
+ "name": "selectedIndex",
19193
+ "type": {
19194
+ "text": "number"
19195
+ },
19196
+ "privacy": "public",
19197
+ "default": "-1",
19198
+ "description": "The index of the selected option.",
19185
19199
  "inheritedFrom": {
19186
- "name": "Icon",
19187
- "module": "src/icon/icon.ts"
19200
+ "name": "Listbox",
19201
+ "module": "src/listbox/listbox.ts"
19188
19202
  }
19189
19203
  },
19190
19204
  {
19191
19205
  "kind": "field",
19192
- "name": "variant",
19206
+ "name": "selectedOptions",
19193
19207
  "type": {
19194
- "text": "IconStyle"
19208
+ "text": "ListboxOption[]"
19195
19209
  },
19196
- "default": "'solid'",
19210
+ "privacy": "public",
19211
+ "default": "[]",
19212
+ "description": "A collection of the selected options.",
19213
+ "inheritedFrom": {
19214
+ "name": "Listbox",
19215
+ "module": "src/listbox/listbox.ts"
19216
+ }
19217
+ },
19218
+ {
19219
+ "kind": "field",
19220
+ "name": "slottedOptionFilter",
19221
+ "privacy": "public",
19222
+ "static": true,
19223
+ "description": "A static filter to include only selectable options.",
19224
+ "parameters": [
19225
+ {
19226
+ "description": "element to filter",
19227
+ "name": "n"
19228
+ }
19229
+ ],
19197
19230
  "inheritedFrom": {
19198
- "name": "Icon",
19199
- "module": "src/icon/icon.ts"
19231
+ "name": "Listbox",
19232
+ "module": "src/listbox/listbox.ts"
19200
19233
  }
19201
19234
  },
19202
19235
  {
19203
19236
  "kind": "method",
19204
- "name": "variantChanged",
19205
- "parameters": [
19206
- {
19207
- "name": "oldValue",
19208
- "type": {
19209
- "text": "string"
19210
- }
19211
- },
19212
- {
19213
- "name": "newValue",
19214
- "type": {
19215
- "text": "string"
19216
- }
19237
+ "name": "selectFirstOption",
19238
+ "privacy": "public",
19239
+ "return": {
19240
+ "type": {
19241
+ "text": "void"
19217
19242
  }
19218
- ],
19243
+ },
19244
+ "description": "Moves focus to the first selectable option.",
19219
19245
  "inheritedFrom": {
19220
- "name": "Icon",
19221
- "module": "src/icon/icon.ts"
19246
+ "name": "Listbox",
19247
+ "module": "src/listbox/listbox.ts"
19222
19248
  }
19223
19249
  },
19224
19250
  {
19225
19251
  "kind": "method",
19226
- "name": "loadIcon",
19252
+ "name": "setSelectedOptions",
19227
19253
  "privacy": "public",
19254
+ "description": "Sets an option as selected and gives it focus.",
19228
19255
  "inheritedFrom": {
19229
- "name": "Icon",
19230
- "module": "src/icon/icon.ts"
19256
+ "name": "Listbox",
19257
+ "module": "src/listbox/listbox.ts"
19231
19258
  }
19232
19259
  },
19233
19260
  {
@@ -19239,8 +19266,8 @@
19239
19266
  "privacy": "private",
19240
19267
  "default": "void 0",
19241
19268
  "inheritedFrom": {
19242
- "name": "FoundationElement",
19243
- "module": "src/foundation-element/foundation-element.ts"
19269
+ "name": "Listbox",
19270
+ "module": "src/listbox/listbox.ts"
19244
19271
  }
19245
19272
  },
19246
19273
  {
@@ -19252,8 +19279,8 @@
19252
19279
  "privacy": "public",
19253
19280
  "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
19254
19281
  "inheritedFrom": {
19255
- "name": "FoundationElement",
19256
- "module": "src/foundation-element/foundation-element.ts"
19282
+ "name": "Listbox",
19283
+ "module": "src/listbox/listbox.ts"
19257
19284
  }
19258
19285
  },
19259
19286
  {
@@ -19265,8 +19292,8 @@
19265
19292
  "privacy": "public",
19266
19293
  "description": "Sets the template of the element instance. When undefined,\nthe element will attempt to resolve the template from\nthe associated presentation or custom element definition.",
19267
19294
  "inheritedFrom": {
19268
- "name": "FoundationElement",
19269
- "module": "src/foundation-element/foundation-element.ts"
19295
+ "name": "Listbox",
19296
+ "module": "src/listbox/listbox.ts"
19270
19297
  }
19271
19298
  },
19272
19299
  {
@@ -19279,8 +19306,8 @@
19279
19306
  }
19280
19307
  },
19281
19308
  "inheritedFrom": {
19282
- "name": "FoundationElement",
19283
- "module": "src/foundation-element/foundation-element.ts"
19309
+ "name": "Listbox",
19310
+ "module": "src/listbox/listbox.ts"
19284
19311
  }
19285
19312
  },
19286
19313
  {
@@ -19292,8 +19319,8 @@
19292
19319
  "privacy": "public",
19293
19320
  "description": "Sets the default styles for the element instance. When undefined,\nthe element will attempt to resolve default styles from\nthe associated presentation or custom element definition.",
19294
19321
  "inheritedFrom": {
19295
- "name": "FoundationElement",
19296
- "module": "src/foundation-element/foundation-element.ts"
19322
+ "name": "Listbox",
19323
+ "module": "src/listbox/listbox.ts"
19297
19324
  }
19298
19325
  },
19299
19326
  {
@@ -19306,8 +19333,8 @@
19306
19333
  }
19307
19334
  },
19308
19335
  "inheritedFrom": {
19309
- "name": "FoundationElement",
19310
- "module": "src/foundation-element/foundation-element.ts"
19336
+ "name": "Listbox",
19337
+ "module": "src/listbox/listbox.ts"
19311
19338
  }
19312
19339
  },
19313
19340
  {
@@ -19337,119 +19364,39 @@
19337
19364
  ],
19338
19365
  "description": "Defines an element registry function with a set of element definition defaults.",
19339
19366
  "inheritedFrom": {
19340
- "name": "FoundationElement",
19341
- "module": "src/foundation-element/foundation-element.ts"
19367
+ "name": "Listbox",
19368
+ "module": "src/listbox/listbox.ts"
19342
19369
  }
19343
19370
  }
19344
19371
  ]
19345
19372
  },
19346
19373
  {
19347
19374
  "kind": "variable",
19348
- "name": "defaultIconConfig",
19349
- "default": "foundationIconConfig"
19350
- },
19351
- {
19352
- "kind": "variable",
19353
- "name": "zeroIconShadowOptions",
19354
- "default": "foundationIconShadowOptions"
19355
- },
19356
- {
19357
- "kind": "variable",
19358
- "name": "zeroIcon"
19375
+ "name": "zeroListbox"
19359
19376
  }
19360
19377
  ],
19361
19378
  "exports": [
19362
19379
  {
19363
19380
  "kind": "js",
19364
- "name": "Icon",
19365
- "declaration": {
19366
- "name": "Icon",
19367
- "module": "src/icon/icon.ts"
19368
- }
19369
- },
19370
- {
19371
- "kind": "js",
19372
- "name": "defaultIconConfig",
19373
- "declaration": {
19374
- "name": "defaultIconConfig",
19375
- "module": "src/icon/icon.ts"
19376
- }
19377
- },
19378
- {
19379
- "kind": "js",
19380
- "name": "zeroIconShadowOptions",
19381
- "declaration": {
19382
- "name": "zeroIconShadowOptions",
19383
- "module": "src/icon/icon.ts"
19384
- }
19385
- },
19386
- {
19387
- "kind": "js",
19388
- "name": "zeroIcon",
19389
- "declaration": {
19390
- "name": "zeroIcon",
19391
- "module": "src/icon/icon.ts"
19392
- }
19393
- }
19394
- ]
19395
- },
19396
- {
19397
- "kind": "javascript-module",
19398
- "path": "src/icon/index.ts",
19399
- "declarations": [],
19400
- "exports": [
19401
- {
19402
- "kind": "js",
19403
- "name": "*",
19404
- "declaration": {
19405
- "name": "*",
19406
- "package": "./icon"
19407
- }
19408
- },
19409
- {
19410
- "kind": "js",
19411
- "name": "*",
19412
- "declaration": {
19413
- "name": "*",
19414
- "package": "./icon.styles"
19415
- }
19416
- }
19417
- ]
19418
- },
19419
- {
19420
- "kind": "javascript-module",
19421
- "path": "src/listbox/index.ts",
19422
- "declarations": [],
19423
- "exports": [
19424
- {
19425
- "kind": "js",
19426
- "name": "*",
19427
- "declaration": {
19428
- "name": "*",
19429
- "package": "./listbox.template"
19430
- }
19431
- },
19432
- {
19433
- "kind": "js",
19434
- "name": "*",
19381
+ "name": "Listbox",
19435
19382
  "declaration": {
19436
- "name": "*",
19437
- "package": "./listbox.styles"
19383
+ "name": "Listbox",
19384
+ "module": "src/listbox/listbox.ts"
19438
19385
  }
19439
19386
  },
19440
19387
  {
19441
19388
  "kind": "js",
19442
- "name": "*",
19389
+ "name": "zeroListbox",
19443
19390
  "declaration": {
19444
- "name": "*",
19445
- "package": "./listbox"
19391
+ "name": "zeroListbox",
19392
+ "module": "src/listbox/listbox.ts"
19446
19393
  }
19447
19394
  }
19448
19395
  ]
19449
19396
  },
19450
19397
  {
19451
19398
  "kind": "javascript-module",
19452
- "path": "src/listbox/listbox.stories.ts",
19399
+ "path": "src/icon/icon.stories.ts",
19453
19400
  "declarations": [
19454
19401
  {
19455
19402
  "kind": "variable",
@@ -19457,15 +19404,23 @@
19457
19404
  "type": {
19458
19405
  "text": "Meta"
19459
19406
  },
19460
- "default": "{\n title: 'Listbox',\n component: 'zero-listbox',\n}"
19407
+ "default": "{\n title: 'Icon',\n component: 'zero-icon',\n}"
19461
19408
  },
19462
19409
  {
19463
19410
  "kind": "variable",
19464
- "name": "Primary",
19411
+ "name": "Multiple",
19465
19412
  "type": {
19466
19413
  "text": "StoryObj"
19467
19414
  },
19468
- "default": "{\n render: () => html`\n <zero-listbox style=\"width: 200px;\">\n <zero-option>Option 1</zero-option>\n <zero-option>Option 2</zero-option>\n <zero-option>Option 3</zero-option>\n </zero-listbox>\n `,\n}"
19415
+ "default": "{\n render: () => html`\n <div style=\"${wrapperStyle}\">\n <zero-icon name=\"glasses\" size=\"1x\"></zero-icon>\n <zero-icon name=\"amazon\" size=\"2x\" variant=\"brand\"></zero-icon>\n <zero-icon name=\"amazon-pay\" size=\"3x\" variant=\"brand\"></zero-icon>\n <zero-icon name=\"apple\" size=\"4x\" variant=\"brand\"></zero-icon>\n <zero-icon name=\"chrome\" size=\"5x\" variant=\"brand\"></zero-icon>\n <zero-icon name=\"ambulance\" size=\"xs\"></zero-icon>\n <zero-icon name=\"angry\" size=\"1x\"></zero-icon>\n <zero-icon variant=\"regular\" name=\"angry\" size=\"sm\"></zero-icon>\n <zero-icon name=\"address-book\" size=\"lg\"></zero-icon>\n <zero-icon variant=\"regular\" name=\"address-book\" size=\"xl\"></zero-icon>\n <zero-icon name=\"bookmark\" size=\"2xl;\"></zero-icon>\n <zero-icon variant=\"regular\" name=\"bookmark\" size=\"2xs\"></zero-icon>\n </div>\n `,\n}"
19416
+ },
19417
+ {
19418
+ "kind": "variable",
19419
+ "name": "Configurable",
19420
+ "type": {
19421
+ "text": "StoryObj"
19422
+ },
19423
+ "default": "{\n argTypes: {\n size: {\n control: 'select',\n options: [\n '2xs',\n 'xs',\n 'sm',\n 'lg',\n 'xl',\n '2xl',\n '1x',\n '2x',\n '3x',\n '4x',\n '5x',\n '6x',\n '7x',\n '8x',\n '9x',\n '10x',\n ],\n },\n variant: {\n control: 'select',\n options: ['solid', 'regular', 'brand'],\n },\n },\n args: {\n name: 'glasses',\n size: 'lg',\n variant: 'solid',\n },\n render: ({ name, size, variant }) => html`\n <zero-icon name=\"${name}\" size=\"${size}\" variant=\"${variant}\"></zero-icon>\n `,\n}"
19469
19424
  }
19470
19425
  ],
19471
19426
  "exports": [
@@ -19474,68 +19429,37 @@
19474
19429
  "name": "default",
19475
19430
  "declaration": {
19476
19431
  "name": "meta",
19477
- "module": "src/listbox/listbox.stories.ts"
19432
+ "module": "src/icon/icon.stories.ts"
19478
19433
  }
19479
19434
  },
19480
19435
  {
19481
19436
  "kind": "js",
19482
- "name": "Primary",
19437
+ "name": "Multiple",
19483
19438
  "declaration": {
19484
- "name": "Primary",
19485
- "module": "src/listbox/listbox.stories.ts"
19439
+ "name": "Multiple",
19440
+ "module": "src/icon/icon.stories.ts"
19486
19441
  }
19487
- }
19488
- ]
19489
- },
19490
- {
19491
- "kind": "javascript-module",
19492
- "path": "src/listbox/listbox.styles.ts",
19493
- "declarations": [
19494
- {
19495
- "kind": "function",
19496
- "name": "zeroListboxStyles",
19497
- "return": {
19498
- "type": {
19499
- "text": "ElementStyles"
19500
- }
19501
- },
19502
- "parameters": [
19503
- {
19504
- "name": "context",
19505
- "type": {
19506
- "text": "ElementDefinitionContext"
19507
- }
19508
- },
19509
- {
19510
- "name": "definition",
19511
- "type": {
19512
- "text": "FoundationElementDefinition"
19513
- }
19514
- }
19515
- ]
19516
- }
19517
- ],
19518
- "exports": [
19442
+ },
19519
19443
  {
19520
19444
  "kind": "js",
19521
- "name": "zeroListboxStyles",
19445
+ "name": "Configurable",
19522
19446
  "declaration": {
19523
- "name": "zeroListboxStyles",
19524
- "module": "src/listbox/listbox.styles.ts"
19447
+ "name": "Configurable",
19448
+ "module": "src/icon/icon.stories.ts"
19525
19449
  }
19526
19450
  }
19527
19451
  ]
19528
19452
  },
19529
19453
  {
19530
19454
  "kind": "javascript-module",
19531
- "path": "src/listbox/listbox.template.ts",
19455
+ "path": "src/icon/icon.styles.ts",
19532
19456
  "declarations": [
19533
19457
  {
19534
19458
  "kind": "function",
19535
- "name": "zeroListboxTemplate",
19459
+ "name": "zeroIconStyles",
19536
19460
  "return": {
19537
19461
  "type": {
19538
- "text": "ViewTemplate<Listbox>"
19462
+ "text": "ElementStyles"
19539
19463
  }
19540
19464
  },
19541
19465
  "parameters": [
@@ -19557,158 +19481,185 @@
19557
19481
  "exports": [
19558
19482
  {
19559
19483
  "kind": "js",
19560
- "name": "zeroListboxTemplate",
19484
+ "name": "zeroIconStyles",
19561
19485
  "declaration": {
19562
- "name": "zeroListboxTemplate",
19563
- "module": "src/listbox/listbox.template.ts"
19486
+ "name": "zeroIconStyles",
19487
+ "module": "src/icon/icon.styles.ts"
19564
19488
  }
19565
19489
  }
19566
19490
  ]
19567
19491
  },
19568
19492
  {
19569
19493
  "kind": "javascript-module",
19570
- "path": "src/listbox/listbox.ts",
19494
+ "path": "src/icon/icon.ts",
19571
19495
  "declarations": [
19572
19496
  {
19573
19497
  "kind": "class",
19574
19498
  "description": "",
19575
- "name": "Listbox",
19499
+ "name": "Icon",
19576
19500
  "superclass": {
19577
- "name": "FoundationListbox",
19501
+ "name": "FoundationIcon",
19578
19502
  "package": "@genesislcap/foundation-ui"
19579
19503
  },
19580
- "tagName": "%%prefix%%-listbox",
19504
+ "tagName": "%%prefix%%-icon",
19581
19505
  "customElement": true,
19582
19506
  "attributes": [
19583
19507
  {
19508
+ "name": "name",
19509
+ "type": {
19510
+ "text": "IconName"
19511
+ },
19512
+ "fieldName": "name",
19513
+ "inheritedFrom": {
19514
+ "name": "Icon",
19515
+ "module": "src/icon/icon.ts"
19516
+ }
19517
+ },
19518
+ {
19519
+ "name": "size",
19584
19520
  "type": {
19585
- "text": "boolean"
19521
+ "text": "FaSize"
19586
19522
  },
19587
- "description": "The disabled state of the listbox.",
19588
- "fieldName": "disabled",
19523
+ "default": "'sm'",
19524
+ "fieldName": "size",
19589
19525
  "inheritedFrom": {
19590
- "name": "Listbox",
19591
- "module": "src/listbox/listbox.ts"
19526
+ "name": "Icon",
19527
+ "module": "src/icon/icon.ts"
19528
+ }
19529
+ },
19530
+ {
19531
+ "name": "variant",
19532
+ "type": {
19533
+ "text": "IconStyle"
19534
+ },
19535
+ "default": "'solid'",
19536
+ "fieldName": "variant",
19537
+ "inheritedFrom": {
19538
+ "name": "Icon",
19539
+ "module": "src/icon/icon.ts"
19592
19540
  }
19593
19541
  }
19594
19542
  ],
19595
19543
  "members": [
19596
19544
  {
19597
19545
  "kind": "field",
19598
- "name": "length",
19546
+ "name": "iElement",
19599
19547
  "type": {
19600
- "text": "number"
19548
+ "text": "HTMLElement"
19601
19549
  },
19602
- "privacy": "public",
19603
- "description": "The number of options.",
19604
19550
  "inheritedFrom": {
19605
- "name": "Listbox",
19606
- "module": "src/listbox/listbox.ts"
19551
+ "name": "Icon",
19552
+ "module": "src/icon/icon.ts"
19607
19553
  }
19608
19554
  },
19609
19555
  {
19610
19556
  "kind": "field",
19611
- "name": "options",
19557
+ "name": "name",
19612
19558
  "type": {
19613
- "text": "ListboxOption[]"
19559
+ "text": "IconName"
19614
19560
  },
19615
- "privacy": "public",
19616
- "description": "The list of options.",
19617
19561
  "inheritedFrom": {
19618
- "name": "Listbox",
19619
- "module": "src/listbox/listbox.ts"
19562
+ "name": "Icon",
19563
+ "module": "src/icon/icon.ts"
19620
19564
  }
19621
19565
  },
19622
19566
  {
19623
- "kind": "field",
19624
- "name": "typeAheadExpired",
19625
- "privacy": "protected",
19567
+ "kind": "method",
19568
+ "name": "nameChanged",
19569
+ "parameters": [
19570
+ {
19571
+ "name": "oldValue",
19572
+ "type": {
19573
+ "text": "string"
19574
+ }
19575
+ },
19576
+ {
19577
+ "name": "newValue",
19578
+ "type": {
19579
+ "text": "string"
19580
+ }
19581
+ }
19582
+ ],
19626
19583
  "inheritedFrom": {
19627
- "name": "Listbox",
19628
- "module": "src/listbox/listbox.ts"
19584
+ "name": "Icon",
19585
+ "module": "src/icon/icon.ts"
19629
19586
  }
19630
19587
  },
19631
19588
  {
19632
19589
  "kind": "field",
19633
- "name": "disabled",
19590
+ "name": "size",
19634
19591
  "type": {
19635
- "text": "boolean"
19592
+ "text": "FaSize"
19636
19593
  },
19637
- "privacy": "public",
19638
- "description": "The disabled state of the listbox.",
19594
+ "default": "'sm'",
19639
19595
  "inheritedFrom": {
19640
- "name": "Listbox",
19641
- "module": "src/listbox/listbox.ts"
19596
+ "name": "Icon",
19597
+ "module": "src/icon/icon.ts"
19642
19598
  }
19643
19599
  },
19644
19600
  {
19645
- "kind": "field",
19646
- "name": "selectedIndex",
19647
- "type": {
19648
- "text": "number"
19649
- },
19650
- "privacy": "public",
19651
- "default": "-1",
19652
- "description": "The index of the selected option.",
19601
+ "kind": "method",
19602
+ "name": "sizeChanged",
19603
+ "parameters": [
19604
+ {
19605
+ "name": "oldValue",
19606
+ "type": {
19607
+ "text": "string"
19608
+ }
19609
+ },
19610
+ {
19611
+ "name": "newValue",
19612
+ "type": {
19613
+ "text": "string"
19614
+ }
19615
+ }
19616
+ ],
19653
19617
  "inheritedFrom": {
19654
- "name": "Listbox",
19655
- "module": "src/listbox/listbox.ts"
19618
+ "name": "Icon",
19619
+ "module": "src/icon/icon.ts"
19656
19620
  }
19657
19621
  },
19658
19622
  {
19659
19623
  "kind": "field",
19660
- "name": "selectedOptions",
19624
+ "name": "variant",
19661
19625
  "type": {
19662
- "text": "ListboxOption[]"
19626
+ "text": "IconStyle"
19663
19627
  },
19664
- "privacy": "public",
19665
- "default": "[]",
19666
- "description": "A collection of the selected options.",
19628
+ "default": "'solid'",
19667
19629
  "inheritedFrom": {
19668
- "name": "Listbox",
19669
- "module": "src/listbox/listbox.ts"
19630
+ "name": "Icon",
19631
+ "module": "src/icon/icon.ts"
19670
19632
  }
19671
19633
  },
19672
19634
  {
19673
- "kind": "field",
19674
- "name": "slottedOptionFilter",
19675
- "privacy": "public",
19676
- "static": true,
19677
- "description": "A static filter to include only selectable options.",
19635
+ "kind": "method",
19636
+ "name": "variantChanged",
19678
19637
  "parameters": [
19679
19638
  {
19680
- "description": "element to filter",
19681
- "name": "n"
19639
+ "name": "oldValue",
19640
+ "type": {
19641
+ "text": "string"
19642
+ }
19643
+ },
19644
+ {
19645
+ "name": "newValue",
19646
+ "type": {
19647
+ "text": "string"
19648
+ }
19682
19649
  }
19683
19650
  ],
19684
19651
  "inheritedFrom": {
19685
- "name": "Listbox",
19686
- "module": "src/listbox/listbox.ts"
19687
- }
19688
- },
19689
- {
19690
- "kind": "method",
19691
- "name": "selectFirstOption",
19692
- "privacy": "public",
19693
- "return": {
19694
- "type": {
19695
- "text": "void"
19696
- }
19697
- },
19698
- "description": "Moves focus to the first selectable option.",
19699
- "inheritedFrom": {
19700
- "name": "Listbox",
19701
- "module": "src/listbox/listbox.ts"
19652
+ "name": "Icon",
19653
+ "module": "src/icon/icon.ts"
19702
19654
  }
19703
19655
  },
19704
19656
  {
19705
19657
  "kind": "method",
19706
- "name": "setSelectedOptions",
19658
+ "name": "loadIcon",
19707
19659
  "privacy": "public",
19708
- "description": "Sets an option as selected and gives it focus.",
19709
19660
  "inheritedFrom": {
19710
- "name": "Listbox",
19711
- "module": "src/listbox/listbox.ts"
19661
+ "name": "Icon",
19662
+ "module": "src/icon/icon.ts"
19712
19663
  }
19713
19664
  },
19714
19665
  {
@@ -19720,8 +19671,8 @@
19720
19671
  "privacy": "private",
19721
19672
  "default": "void 0",
19722
19673
  "inheritedFrom": {
19723
- "name": "Listbox",
19724
- "module": "src/listbox/listbox.ts"
19674
+ "name": "FoundationElement",
19675
+ "module": "src/foundation-element/foundation-element.ts"
19725
19676
  }
19726
19677
  },
19727
19678
  {
@@ -19733,8 +19684,8 @@
19733
19684
  "privacy": "public",
19734
19685
  "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
19735
19686
  "inheritedFrom": {
19736
- "name": "Listbox",
19737
- "module": "src/listbox/listbox.ts"
19687
+ "name": "FoundationElement",
19688
+ "module": "src/foundation-element/foundation-element.ts"
19738
19689
  }
19739
19690
  },
19740
19691
  {
@@ -19746,8 +19697,8 @@
19746
19697
  "privacy": "public",
19747
19698
  "description": "Sets the template of the element instance. When undefined,\nthe element will attempt to resolve the template from\nthe associated presentation or custom element definition.",
19748
19699
  "inheritedFrom": {
19749
- "name": "Listbox",
19750
- "module": "src/listbox/listbox.ts"
19700
+ "name": "FoundationElement",
19701
+ "module": "src/foundation-element/foundation-element.ts"
19751
19702
  }
19752
19703
  },
19753
19704
  {
@@ -19760,8 +19711,8 @@
19760
19711
  }
19761
19712
  },
19762
19713
  "inheritedFrom": {
19763
- "name": "Listbox",
19764
- "module": "src/listbox/listbox.ts"
19714
+ "name": "FoundationElement",
19715
+ "module": "src/foundation-element/foundation-element.ts"
19765
19716
  }
19766
19717
  },
19767
19718
  {
@@ -19773,8 +19724,8 @@
19773
19724
  "privacy": "public",
19774
19725
  "description": "Sets the default styles for the element instance. When undefined,\nthe element will attempt to resolve default styles from\nthe associated presentation or custom element definition.",
19775
19726
  "inheritedFrom": {
19776
- "name": "Listbox",
19777
- "module": "src/listbox/listbox.ts"
19727
+ "name": "FoundationElement",
19728
+ "module": "src/foundation-element/foundation-element.ts"
19778
19729
  }
19779
19730
  },
19780
19731
  {
@@ -19787,8 +19738,8 @@
19787
19738
  }
19788
19739
  },
19789
19740
  "inheritedFrom": {
19790
- "name": "Listbox",
19791
- "module": "src/listbox/listbox.ts"
19741
+ "name": "FoundationElement",
19742
+ "module": "src/foundation-element/foundation-element.ts"
19792
19743
  }
19793
19744
  },
19794
19745
  {
@@ -19818,32 +19769,81 @@
19818
19769
  ],
19819
19770
  "description": "Defines an element registry function with a set of element definition defaults.",
19820
19771
  "inheritedFrom": {
19821
- "name": "Listbox",
19822
- "module": "src/listbox/listbox.ts"
19772
+ "name": "FoundationElement",
19773
+ "module": "src/foundation-element/foundation-element.ts"
19823
19774
  }
19824
19775
  }
19825
19776
  ]
19826
19777
  },
19827
19778
  {
19828
19779
  "kind": "variable",
19829
- "name": "zeroListbox"
19780
+ "name": "defaultIconConfig",
19781
+ "default": "foundationIconConfig"
19782
+ },
19783
+ {
19784
+ "kind": "variable",
19785
+ "name": "zeroIconShadowOptions",
19786
+ "default": "foundationIconShadowOptions"
19787
+ },
19788
+ {
19789
+ "kind": "variable",
19790
+ "name": "zeroIcon"
19830
19791
  }
19831
19792
  ],
19832
19793
  "exports": [
19833
19794
  {
19834
19795
  "kind": "js",
19835
- "name": "Listbox",
19796
+ "name": "Icon",
19836
19797
  "declaration": {
19837
- "name": "Listbox",
19838
- "module": "src/listbox/listbox.ts"
19798
+ "name": "Icon",
19799
+ "module": "src/icon/icon.ts"
19839
19800
  }
19840
19801
  },
19841
19802
  {
19842
19803
  "kind": "js",
19843
- "name": "zeroListbox",
19804
+ "name": "defaultIconConfig",
19844
19805
  "declaration": {
19845
- "name": "zeroListbox",
19846
- "module": "src/listbox/listbox.ts"
19806
+ "name": "defaultIconConfig",
19807
+ "module": "src/icon/icon.ts"
19808
+ }
19809
+ },
19810
+ {
19811
+ "kind": "js",
19812
+ "name": "zeroIconShadowOptions",
19813
+ "declaration": {
19814
+ "name": "zeroIconShadowOptions",
19815
+ "module": "src/icon/icon.ts"
19816
+ }
19817
+ },
19818
+ {
19819
+ "kind": "js",
19820
+ "name": "zeroIcon",
19821
+ "declaration": {
19822
+ "name": "zeroIcon",
19823
+ "module": "src/icon/icon.ts"
19824
+ }
19825
+ }
19826
+ ]
19827
+ },
19828
+ {
19829
+ "kind": "javascript-module",
19830
+ "path": "src/icon/index.ts",
19831
+ "declarations": [],
19832
+ "exports": [
19833
+ {
19834
+ "kind": "js",
19835
+ "name": "*",
19836
+ "declaration": {
19837
+ "name": "*",
19838
+ "package": "./icon"
19839
+ }
19840
+ },
19841
+ {
19842
+ "kind": "js",
19843
+ "name": "*",
19844
+ "declaration": {
19845
+ "name": "*",
19846
+ "package": "./icon.styles"
19847
19847
  }
19848
19848
  }
19849
19849
  ]