@genesislcap/foundation-zero 14.28.0 → 14.29.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -581,145 +581,6 @@
581
581
  }
582
582
  ]
583
583
  },
584
- {
585
- "kind": "javascript-module",
586
- "path": "src/_common/colors.hex.ts",
587
- "declarations": [],
588
- "exports": []
589
- },
590
- {
591
- "kind": "javascript-module",
592
- "path": "src/_common/colors.ts",
593
- "declarations": [
594
- {
595
- "kind": "variable",
596
- "name": "defaultRapidTextColor"
597
- },
598
- {
599
- "kind": "variable",
600
- "name": "defaultRapidBGColor"
601
- },
602
- {
603
- "kind": "variable",
604
- "name": "defaultRapidLabelColor"
605
- },
606
- {
607
- "kind": "variable",
608
- "name": "defaultRapidActiveBGColor"
609
- },
610
- {
611
- "kind": "variable",
612
- "name": "defaultRapidBorderUnfocusedColor"
613
- },
614
- {
615
- "kind": "variable",
616
- "name": "FastAppearanceValues",
617
- "type": {
618
- "text": "array"
619
- },
620
- "default": "['accent', 'lightweight', 'neutral', 'outline', 'stealth']"
621
- },
622
- {
623
- "kind": "variable",
624
- "name": "ZeroAppearanceValues"
625
- }
626
- ],
627
- "exports": [
628
- {
629
- "kind": "js",
630
- "name": "defaultRapidTextColor",
631
- "declaration": {
632
- "name": "defaultRapidTextColor",
633
- "module": "src/_common/colors.ts"
634
- }
635
- },
636
- {
637
- "kind": "js",
638
- "name": "defaultRapidBGColor",
639
- "declaration": {
640
- "name": "defaultRapidBGColor",
641
- "module": "src/_common/colors.ts"
642
- }
643
- },
644
- {
645
- "kind": "js",
646
- "name": "defaultRapidLabelColor",
647
- "declaration": {
648
- "name": "defaultRapidLabelColor",
649
- "module": "src/_common/colors.ts"
650
- }
651
- },
652
- {
653
- "kind": "js",
654
- "name": "defaultRapidActiveBGColor",
655
- "declaration": {
656
- "name": "defaultRapidActiveBGColor",
657
- "module": "src/_common/colors.ts"
658
- }
659
- },
660
- {
661
- "kind": "js",
662
- "name": "defaultRapidBorderUnfocusedColor",
663
- "declaration": {
664
- "name": "defaultRapidBorderUnfocusedColor",
665
- "module": "src/_common/colors.ts"
666
- }
667
- },
668
- {
669
- "kind": "js",
670
- "name": "FastAppearanceValues",
671
- "declaration": {
672
- "name": "FastAppearanceValues",
673
- "module": "src/_common/colors.ts"
674
- }
675
- },
676
- {
677
- "kind": "js",
678
- "name": "ZeroAppearanceValues",
679
- "declaration": {
680
- "name": "ZeroAppearanceValues",
681
- "module": "src/_common/colors.ts"
682
- }
683
- }
684
- ]
685
- },
686
- {
687
- "kind": "javascript-module",
688
- "path": "src/_common/colors.util.ts",
689
- "declarations": [],
690
- "exports": []
691
- },
692
- {
693
- "kind": "javascript-module",
694
- "path": "src/_common/index.ts",
695
- "declarations": [],
696
- "exports": [
697
- {
698
- "kind": "js",
699
- "name": "*",
700
- "declaration": {
701
- "name": "*",
702
- "package": "./colors"
703
- }
704
- },
705
- {
706
- "kind": "js",
707
- "name": "*",
708
- "declaration": {
709
- "name": "*",
710
- "package": "./colors.hex"
711
- }
712
- },
713
- {
714
- "kind": "js",
715
- "name": "*",
716
- "declaration": {
717
- "name": "*",
718
- "package": "./colors.util"
719
- }
720
- }
721
- ]
722
- },
723
584
  {
724
585
  "kind": "javascript-module",
725
586
  "path": "src/_config/index.ts",
@@ -1660,100 +1521,239 @@
1660
1521
  },
1661
1522
  {
1662
1523
  "kind": "javascript-module",
1663
- "path": "src/breadcrumb/breadcrumb.stories.ts",
1524
+ "path": "src/_common/colors.hex.ts",
1525
+ "declarations": [],
1526
+ "exports": []
1527
+ },
1528
+ {
1529
+ "kind": "javascript-module",
1530
+ "path": "src/_common/colors.ts",
1664
1531
  "declarations": [
1665
1532
  {
1666
1533
  "kind": "variable",
1667
- "name": "meta",
1668
- "type": {
1669
- "text": "Meta"
1670
- },
1671
- "default": "{\n title: 'Breadcrumb',\n component: 'zero-breadcrumb',\n}"
1534
+ "name": "defaultRapidTextColor"
1672
1535
  },
1673
1536
  {
1674
1537
  "kind": "variable",
1675
- "name": "Primary",
1538
+ "name": "defaultRapidBGColor"
1539
+ },
1540
+ {
1541
+ "kind": "variable",
1542
+ "name": "defaultRapidLabelColor"
1543
+ },
1544
+ {
1545
+ "kind": "variable",
1546
+ "name": "defaultRapidActiveBGColor"
1547
+ },
1548
+ {
1549
+ "kind": "variable",
1550
+ "name": "defaultRapidBorderUnfocusedColor"
1551
+ },
1552
+ {
1553
+ "kind": "variable",
1554
+ "name": "FastAppearanceValues",
1676
1555
  "type": {
1677
- "text": "StoryObj"
1556
+ "text": "array"
1678
1557
  },
1679
- "default": "{\n args: {\n breadcrumbItemsText: 'Breadcrumb Item',\n breadcrumbCurrentItemText: 'Current Page',\n },\n render: ({ breadcrumbItemsText, breadcrumbCurrentItemText }) =>\n html`\n <zero-breadcrumb>\n <zero-breadcrumb-item href=\"#\">${breadcrumbItemsText} 1</zero-breadcrumb-item>\n <zero-breadcrumb-item href=\"#\">${breadcrumbItemsText} 2</zero-breadcrumb-item>\n <zero-breadcrumb-item>${breadcrumbCurrentItemText}</zero-breadcrumb-item>\n </zero-breadcrumb>\n `,\n}"
1558
+ "default": "['accent', 'lightweight', 'neutral', 'outline', 'stealth']"
1559
+ },
1560
+ {
1561
+ "kind": "variable",
1562
+ "name": "ZeroAppearanceValues"
1680
1563
  }
1681
1564
  ],
1682
1565
  "exports": [
1683
1566
  {
1684
1567
  "kind": "js",
1685
- "name": "default",
1568
+ "name": "defaultRapidTextColor",
1686
1569
  "declaration": {
1687
- "name": "meta",
1688
- "module": "src/breadcrumb/breadcrumb.stories.ts"
1570
+ "name": "defaultRapidTextColor",
1571
+ "module": "src/_common/colors.ts"
1689
1572
  }
1690
1573
  },
1691
1574
  {
1692
1575
  "kind": "js",
1693
- "name": "Primary",
1576
+ "name": "defaultRapidBGColor",
1694
1577
  "declaration": {
1695
- "name": "Primary",
1696
- "module": "src/breadcrumb/breadcrumb.stories.ts"
1578
+ "name": "defaultRapidBGColor",
1579
+ "module": "src/_common/colors.ts"
1697
1580
  }
1698
- }
1699
- ]
1700
- },
1701
- {
1702
- "kind": "javascript-module",
1703
- "path": "src/breadcrumb/breadcrumb.styles.ts",
1704
- "declarations": [
1581
+ },
1705
1582
  {
1706
- "kind": "function",
1707
- "name": "zeroBreadcrumbStyles",
1708
- "return": {
1709
- "type": {
1710
- "text": "ElementStyles"
1711
- }
1712
- },
1713
- "parameters": [
1714
- {
1715
- "name": "context",
1716
- "type": {
1717
- "text": "ElementDefinitionContext"
1718
- }
1719
- },
1720
- {
1721
- "name": "definition",
1722
- "type": {
1723
- "text": "FoundationElementDefinition"
1724
- }
1725
- }
1726
- ]
1727
- }
1728
- ],
1729
- "exports": [
1583
+ "kind": "js",
1584
+ "name": "defaultRapidLabelColor",
1585
+ "declaration": {
1586
+ "name": "defaultRapidLabelColor",
1587
+ "module": "src/_common/colors.ts"
1588
+ }
1589
+ },
1730
1590
  {
1731
1591
  "kind": "js",
1732
- "name": "zeroBreadcrumbStyles",
1592
+ "name": "defaultRapidActiveBGColor",
1733
1593
  "declaration": {
1734
- "name": "zeroBreadcrumbStyles",
1735
- "module": "src/breadcrumb/breadcrumb.styles.ts"
1594
+ "name": "defaultRapidActiveBGColor",
1595
+ "module": "src/_common/colors.ts"
1736
1596
  }
1737
- }
1738
- ]
1739
- },
1740
- {
1741
- "kind": "javascript-module",
1742
- "path": "src/breadcrumb/breadcrumb.template.ts",
1743
- "declarations": [
1597
+ },
1744
1598
  {
1745
- "kind": "function",
1746
- "name": "zeroBreadcrumbTemplate",
1747
- "return": {
1748
- "type": {
1749
- "text": "ViewTemplate<Breadcrumb>"
1750
- }
1751
- },
1752
- "parameters": [
1753
- {
1754
- "name": "context",
1755
- "type": {
1756
- "text": "ElementDefinitionContext"
1599
+ "kind": "js",
1600
+ "name": "defaultRapidBorderUnfocusedColor",
1601
+ "declaration": {
1602
+ "name": "defaultRapidBorderUnfocusedColor",
1603
+ "module": "src/_common/colors.ts"
1604
+ }
1605
+ },
1606
+ {
1607
+ "kind": "js",
1608
+ "name": "FastAppearanceValues",
1609
+ "declaration": {
1610
+ "name": "FastAppearanceValues",
1611
+ "module": "src/_common/colors.ts"
1612
+ }
1613
+ },
1614
+ {
1615
+ "kind": "js",
1616
+ "name": "ZeroAppearanceValues",
1617
+ "declaration": {
1618
+ "name": "ZeroAppearanceValues",
1619
+ "module": "src/_common/colors.ts"
1620
+ }
1621
+ }
1622
+ ]
1623
+ },
1624
+ {
1625
+ "kind": "javascript-module",
1626
+ "path": "src/_common/colors.util.ts",
1627
+ "declarations": [],
1628
+ "exports": []
1629
+ },
1630
+ {
1631
+ "kind": "javascript-module",
1632
+ "path": "src/_common/index.ts",
1633
+ "declarations": [],
1634
+ "exports": [
1635
+ {
1636
+ "kind": "js",
1637
+ "name": "*",
1638
+ "declaration": {
1639
+ "name": "*",
1640
+ "package": "./colors"
1641
+ }
1642
+ },
1643
+ {
1644
+ "kind": "js",
1645
+ "name": "*",
1646
+ "declaration": {
1647
+ "name": "*",
1648
+ "package": "./colors.hex"
1649
+ }
1650
+ },
1651
+ {
1652
+ "kind": "js",
1653
+ "name": "*",
1654
+ "declaration": {
1655
+ "name": "*",
1656
+ "package": "./colors.util"
1657
+ }
1658
+ }
1659
+ ]
1660
+ },
1661
+ {
1662
+ "kind": "javascript-module",
1663
+ "path": "src/breadcrumb/breadcrumb.stories.ts",
1664
+ "declarations": [
1665
+ {
1666
+ "kind": "variable",
1667
+ "name": "meta",
1668
+ "type": {
1669
+ "text": "Meta"
1670
+ },
1671
+ "default": "{\n title: 'Breadcrumb',\n component: 'zero-breadcrumb',\n}"
1672
+ },
1673
+ {
1674
+ "kind": "variable",
1675
+ "name": "Primary",
1676
+ "type": {
1677
+ "text": "StoryObj"
1678
+ },
1679
+ "default": "{\n args: {\n breadcrumbItemsText: 'Breadcrumb Item',\n breadcrumbCurrentItemText: 'Current Page',\n },\n render: ({ breadcrumbItemsText, breadcrumbCurrentItemText }) =>\n html`\n <zero-breadcrumb>\n <zero-breadcrumb-item href=\"#\">${breadcrumbItemsText} 1</zero-breadcrumb-item>\n <zero-breadcrumb-item href=\"#\">${breadcrumbItemsText} 2</zero-breadcrumb-item>\n <zero-breadcrumb-item>${breadcrumbCurrentItemText}</zero-breadcrumb-item>\n </zero-breadcrumb>\n `,\n}"
1680
+ }
1681
+ ],
1682
+ "exports": [
1683
+ {
1684
+ "kind": "js",
1685
+ "name": "default",
1686
+ "declaration": {
1687
+ "name": "meta",
1688
+ "module": "src/breadcrumb/breadcrumb.stories.ts"
1689
+ }
1690
+ },
1691
+ {
1692
+ "kind": "js",
1693
+ "name": "Primary",
1694
+ "declaration": {
1695
+ "name": "Primary",
1696
+ "module": "src/breadcrumb/breadcrumb.stories.ts"
1697
+ }
1698
+ }
1699
+ ]
1700
+ },
1701
+ {
1702
+ "kind": "javascript-module",
1703
+ "path": "src/breadcrumb/breadcrumb.styles.ts",
1704
+ "declarations": [
1705
+ {
1706
+ "kind": "function",
1707
+ "name": "zeroBreadcrumbStyles",
1708
+ "return": {
1709
+ "type": {
1710
+ "text": "ElementStyles"
1711
+ }
1712
+ },
1713
+ "parameters": [
1714
+ {
1715
+ "name": "context",
1716
+ "type": {
1717
+ "text": "ElementDefinitionContext"
1718
+ }
1719
+ },
1720
+ {
1721
+ "name": "definition",
1722
+ "type": {
1723
+ "text": "FoundationElementDefinition"
1724
+ }
1725
+ }
1726
+ ]
1727
+ }
1728
+ ],
1729
+ "exports": [
1730
+ {
1731
+ "kind": "js",
1732
+ "name": "zeroBreadcrumbStyles",
1733
+ "declaration": {
1734
+ "name": "zeroBreadcrumbStyles",
1735
+ "module": "src/breadcrumb/breadcrumb.styles.ts"
1736
+ }
1737
+ }
1738
+ ]
1739
+ },
1740
+ {
1741
+ "kind": "javascript-module",
1742
+ "path": "src/breadcrumb/breadcrumb.template.ts",
1743
+ "declarations": [
1744
+ {
1745
+ "kind": "function",
1746
+ "name": "zeroBreadcrumbTemplate",
1747
+ "return": {
1748
+ "type": {
1749
+ "text": "ViewTemplate<Breadcrumb>"
1750
+ }
1751
+ },
1752
+ "parameters": [
1753
+ {
1754
+ "name": "context",
1755
+ "type": {
1756
+ "text": "ElementDefinitionContext"
1757
1757
  }
1758
1758
  },
1759
1759
  {
@@ -2030,7 +2030,7 @@
2030
2030
  },
2031
2031
  {
2032
2032
  "kind": "javascript-module",
2033
- "path": "src/button/button.stories.ts",
2033
+ "path": "src/card/card.stories.ts",
2034
2034
  "declarations": [
2035
2035
  {
2036
2036
  "kind": "variable",
@@ -2038,23 +2038,15 @@
2038
2038
  "type": {
2039
2039
  "text": "Meta"
2040
2040
  },
2041
- "default": "{\n title: 'Button',\n component: 'zero-button',\n}"
2042
- },
2043
- {
2044
- "kind": "variable",
2045
- "name": "All",
2046
- "type": {
2047
- "text": "StoryObj"
2048
- },
2049
- "default": "{\n args: {\n appearances: ZeroAppearanceValues,\n buttonText: 'Zero Button',\n },\n ...StylesMapperTemplate,\n}"
2041
+ "default": "{\n title: 'Card',\n component: 'zero-card',\n}"
2050
2042
  },
2051
2043
  {
2052
2044
  "kind": "variable",
2053
- "name": "Single",
2045
+ "name": "Primary",
2054
2046
  "type": {
2055
2047
  "text": "StoryObj"
2056
2048
  },
2057
- "default": "{\n args: {\n appearance: 'neutral',\n buttonText: 'Zero Button',\n },\n argTypes: {\n appearance: {\n control: 'select',\n options: [...FastAppearanceValues, ...ZeroAppearanceValues],\n },\n },\n render: ({ appearance, buttonText }) =>\n html`\n <zero-button appearance=\"${appearance}\">${buttonText} (${appearance})</zero-button>\n `,\n}"
2049
+ "default": "{\n args: {\n cardFillColor: '#2f353a',\n cardHeading: 'Card 1',\n cardText: 'This is a Rapid Card (and the only one with without extra fui elements!)',\n },\n render: ({ cardFillColor, cardHeading, cardText }) =>\n html`\n <div style=\"${wrapperStyle} --zero-card-fill-color:${cardFillColor};\">\n <zero-card style=\"${cardStyle}\">\n <h6>${cardHeading}</h6>\n <span>${cardText}</span>\n </zero-card>\n </div>\n `,\n}"
2058
2050
  }
2059
2051
  ],
2060
2052
  "exports": [
@@ -2063,34 +2055,26 @@
2063
2055
  "name": "default",
2064
2056
  "declaration": {
2065
2057
  "name": "meta",
2066
- "module": "src/button/button.stories.ts"
2067
- }
2068
- },
2069
- {
2070
- "kind": "js",
2071
- "name": "All",
2072
- "declaration": {
2073
- "name": "All",
2074
- "module": "src/button/button.stories.ts"
2058
+ "module": "src/card/card.stories.ts"
2075
2059
  }
2076
2060
  },
2077
2061
  {
2078
2062
  "kind": "js",
2079
- "name": "Single",
2063
+ "name": "Primary",
2080
2064
  "declaration": {
2081
- "name": "Single",
2082
- "module": "src/button/button.stories.ts"
2065
+ "name": "Primary",
2066
+ "module": "src/card/card.stories.ts"
2083
2067
  }
2084
2068
  }
2085
2069
  ]
2086
2070
  },
2087
2071
  {
2088
2072
  "kind": "javascript-module",
2089
- "path": "src/button/button.styles.ts",
2073
+ "path": "src/card/card.styles.ts",
2090
2074
  "declarations": [
2091
2075
  {
2092
2076
  "kind": "function",
2093
- "name": "zeroButtonStyles",
2077
+ "name": "zeroCardStyles",
2094
2078
  "return": {
2095
2079
  "type": {
2096
2080
  "text": "ElementStyles"
@@ -2115,24 +2099,24 @@
2115
2099
  "exports": [
2116
2100
  {
2117
2101
  "kind": "js",
2118
- "name": "zeroButtonStyles",
2102
+ "name": "zeroCardStyles",
2119
2103
  "declaration": {
2120
- "name": "zeroButtonStyles",
2121
- "module": "src/button/button.styles.ts"
2104
+ "name": "zeroCardStyles",
2105
+ "module": "src/card/card.styles.ts"
2122
2106
  }
2123
2107
  }
2124
2108
  ]
2125
2109
  },
2126
2110
  {
2127
2111
  "kind": "javascript-module",
2128
- "path": "src/button/button.template.ts",
2112
+ "path": "src/card/card.template.ts",
2129
2113
  "declarations": [
2130
2114
  {
2131
2115
  "kind": "function",
2132
- "name": "zeroButtonTemplate",
2116
+ "name": "zeroCardTemplate",
2133
2117
  "return": {
2134
2118
  "type": {
2135
- "text": "ViewTemplate<Button>"
2119
+ "text": "ViewTemplate<Card>"
2136
2120
  }
2137
2121
  },
2138
2122
  "parameters": [
@@ -2154,56 +2138,56 @@
2154
2138
  "exports": [
2155
2139
  {
2156
2140
  "kind": "js",
2157
- "name": "zeroButtonTemplate",
2141
+ "name": "zeroCardTemplate",
2158
2142
  "declaration": {
2159
- "name": "zeroButtonTemplate",
2160
- "module": "src/button/button.template.ts"
2143
+ "name": "zeroCardTemplate",
2144
+ "module": "src/card/card.template.ts"
2161
2145
  }
2162
2146
  }
2163
2147
  ]
2164
2148
  },
2165
2149
  {
2166
2150
  "kind": "javascript-module",
2167
- "path": "src/button/button.ts",
2151
+ "path": "src/card/card.ts",
2168
2152
  "declarations": [
2169
2153
  {
2170
2154
  "kind": "class",
2171
2155
  "description": "",
2172
- "name": "Button",
2156
+ "name": "Card",
2173
2157
  "superclass": {
2174
- "name": "FoundationButton",
2158
+ "name": "FoundationCard",
2175
2159
  "package": "@genesislcap/foundation-ui"
2176
2160
  },
2177
- "tagName": "%%prefix%%-button",
2161
+ "tagName": "%%prefix%%-card",
2178
2162
  "customElement": true
2179
2163
  },
2180
2164
  {
2181
2165
  "kind": "variable",
2182
- "name": "zeroButton"
2166
+ "name": "zeroCard"
2183
2167
  }
2184
2168
  ],
2185
2169
  "exports": [
2186
2170
  {
2187
2171
  "kind": "js",
2188
- "name": "Button",
2172
+ "name": "Card",
2189
2173
  "declaration": {
2190
- "name": "Button",
2191
- "module": "src/button/button.ts"
2174
+ "name": "Card",
2175
+ "module": "src/card/card.ts"
2192
2176
  }
2193
2177
  },
2194
2178
  {
2195
2179
  "kind": "js",
2196
- "name": "zeroButton",
2180
+ "name": "zeroCard",
2197
2181
  "declaration": {
2198
- "name": "zeroButton",
2199
- "module": "src/button/button.ts"
2182
+ "name": "zeroCard",
2183
+ "module": "src/card/card.ts"
2200
2184
  }
2201
2185
  }
2202
2186
  ]
2203
2187
  },
2204
2188
  {
2205
2189
  "kind": "javascript-module",
2206
- "path": "src/button/index.ts",
2190
+ "path": "src/card/index.ts",
2207
2191
  "declarations": [],
2208
2192
  "exports": [
2209
2193
  {
@@ -2211,7 +2195,7 @@
2211
2195
  "name": "*",
2212
2196
  "declaration": {
2213
2197
  "name": "*",
2214
- "package": "./button"
2198
+ "package": "./card"
2215
2199
  }
2216
2200
  },
2217
2201
  {
@@ -2219,7 +2203,7 @@
2219
2203
  "name": "*",
2220
2204
  "declaration": {
2221
2205
  "name": "*",
2222
- "package": "./button.styles"
2206
+ "package": "./card.styles"
2223
2207
  }
2224
2208
  },
2225
2209
  {
@@ -2227,14 +2211,14 @@
2227
2211
  "name": "*",
2228
2212
  "declaration": {
2229
2213
  "name": "*",
2230
- "package": "./button.template"
2214
+ "package": "./card.template"
2231
2215
  }
2232
2216
  }
2233
2217
  ]
2234
2218
  },
2235
2219
  {
2236
2220
  "kind": "javascript-module",
2237
- "path": "src/card/card.stories.ts",
2221
+ "path": "src/checkbox/checkbox.stories.ts",
2238
2222
  "declarations": [
2239
2223
  {
2240
2224
  "kind": "variable",
@@ -2242,7 +2226,7 @@
2242
2226
  "type": {
2243
2227
  "text": "Meta"
2244
2228
  },
2245
- "default": "{\n title: 'Card',\n component: 'zero-card',\n}"
2229
+ "default": "{\n title: 'Checkbox',\n component: 'zero-checkbox>',\n}"
2246
2230
  },
2247
2231
  {
2248
2232
  "kind": "variable",
@@ -2250,7 +2234,7 @@
2250
2234
  "type": {
2251
2235
  "text": "StoryObj"
2252
2236
  },
2253
- "default": "{\n args: {\n cardFillColor: '#2f353a',\n cardHeading: 'Card 1',\n cardText: 'This is a Rapid Card (and the only one with without extra fui elements!)',\n },\n render: ({ cardFillColor, cardHeading, cardText }) =>\n html`\n <div style=\"${wrapperStyle} --zero-card-fill-color:${cardFillColor};\">\n <zero-card style=\"${cardStyle}\">\n <h6>${cardHeading}</h6>\n <span>${cardText}</span>\n </zero-card>\n </div>\n `,\n}"
2237
+ "default": "{\n args: {\n customCheckboxText: 'Custom Zero Checkbox',\n customCheckboxDesignUnit: 8,\n customCheckboxCornerRadius: 4,\n },\n render: ({ customCheckboxText, customCheckboxDesignUnit, customCheckboxCornerRadius }) =>\n html`\n <div style=\"${wrapperStyle}\">\n <zero-checkbox>Default Zero Checkbox</zero-checkbox>\n\n <zero-design-system-provider\n design-unit=\"${customCheckboxDesignUnit}\"\n corner-radius=${customCheckboxCornerRadius}\"\n >\n <zero-checkbox>${customCheckboxText}</zero-checkbox>\n </zero-design-system-provider>\n </div>\n `,\n}"
2254
2238
  }
2255
2239
  ],
2256
2240
  "exports": [
@@ -2259,7 +2243,7 @@
2259
2243
  "name": "default",
2260
2244
  "declaration": {
2261
2245
  "name": "meta",
2262
- "module": "src/card/card.stories.ts"
2246
+ "module": "src/checkbox/checkbox.stories.ts"
2263
2247
  }
2264
2248
  },
2265
2249
  {
@@ -2267,18 +2251,18 @@
2267
2251
  "name": "Primary",
2268
2252
  "declaration": {
2269
2253
  "name": "Primary",
2270
- "module": "src/card/card.stories.ts"
2254
+ "module": "src/checkbox/checkbox.stories.ts"
2271
2255
  }
2272
2256
  }
2273
2257
  ]
2274
2258
  },
2275
2259
  {
2276
2260
  "kind": "javascript-module",
2277
- "path": "src/card/card.styles.ts",
2261
+ "path": "src/checkbox/checkbox.styles.ts",
2278
2262
  "declarations": [
2279
2263
  {
2280
2264
  "kind": "function",
2281
- "name": "zeroCardStyles",
2265
+ "name": "zeroCheckboxStyles",
2282
2266
  "return": {
2283
2267
  "type": {
2284
2268
  "text": "ElementStyles"
@@ -2294,7 +2278,7 @@
2294
2278
  {
2295
2279
  "name": "definition",
2296
2280
  "type": {
2297
- "text": "FoundationElementDefinition"
2281
+ "text": "CheckboxOptions"
2298
2282
  }
2299
2283
  }
2300
2284
  ]
@@ -2303,24 +2287,24 @@
2303
2287
  "exports": [
2304
2288
  {
2305
2289
  "kind": "js",
2306
- "name": "zeroCardStyles",
2290
+ "name": "zeroCheckboxStyles",
2307
2291
  "declaration": {
2308
- "name": "zeroCardStyles",
2309
- "module": "src/card/card.styles.ts"
2292
+ "name": "zeroCheckboxStyles",
2293
+ "module": "src/checkbox/checkbox.styles.ts"
2310
2294
  }
2311
2295
  }
2312
2296
  ]
2313
2297
  },
2314
2298
  {
2315
2299
  "kind": "javascript-module",
2316
- "path": "src/card/card.template.ts",
2300
+ "path": "src/checkbox/checkbox.template.ts",
2317
2301
  "declarations": [
2318
2302
  {
2319
2303
  "kind": "function",
2320
- "name": "zeroCardTemplate",
2304
+ "name": "zeroCheckboxTemplate",
2321
2305
  "return": {
2322
2306
  "type": {
2323
- "text": "ViewTemplate<Card>"
2307
+ "text": "ViewTemplate<Checkbox>"
2324
2308
  }
2325
2309
  },
2326
2310
  "parameters": [
@@ -2333,7 +2317,7 @@
2333
2317
  {
2334
2318
  "name": "definition",
2335
2319
  "type": {
2336
- "text": "FoundationElementDefinition"
2320
+ "text": "CheckboxOptions"
2337
2321
  }
2338
2322
  }
2339
2323
  ]
@@ -2342,56 +2326,54 @@
2342
2326
  "exports": [
2343
2327
  {
2344
2328
  "kind": "js",
2345
- "name": "zeroCardTemplate",
2329
+ "name": "zeroCheckboxTemplate",
2346
2330
  "declaration": {
2347
- "name": "zeroCardTemplate",
2348
- "module": "src/card/card.template.ts"
2331
+ "name": "zeroCheckboxTemplate",
2332
+ "module": "src/checkbox/checkbox.template.ts"
2349
2333
  }
2350
2334
  }
2351
2335
  ]
2352
2336
  },
2353
2337
  {
2354
2338
  "kind": "javascript-module",
2355
- "path": "src/card/card.ts",
2339
+ "path": "src/checkbox/checkbox.ts",
2356
2340
  "declarations": [
2357
2341
  {
2358
2342
  "kind": "class",
2359
2343
  "description": "",
2360
- "name": "Card",
2344
+ "name": "Checkbox",
2361
2345
  "superclass": {
2362
- "name": "FoundationCard",
2346
+ "name": "FoundationCheckbox",
2363
2347
  "package": "@genesislcap/foundation-ui"
2364
- },
2365
- "tagName": "%%prefix%%-card",
2366
- "customElement": true
2348
+ }
2367
2349
  },
2368
2350
  {
2369
2351
  "kind": "variable",
2370
- "name": "zeroCard"
2352
+ "name": "zeroCheckbox"
2371
2353
  }
2372
2354
  ],
2373
2355
  "exports": [
2374
2356
  {
2375
2357
  "kind": "js",
2376
- "name": "Card",
2358
+ "name": "Checkbox",
2377
2359
  "declaration": {
2378
- "name": "Card",
2379
- "module": "src/card/card.ts"
2360
+ "name": "Checkbox",
2361
+ "module": "src/checkbox/checkbox.ts"
2380
2362
  }
2381
2363
  },
2382
2364
  {
2383
2365
  "kind": "js",
2384
- "name": "zeroCard",
2366
+ "name": "zeroCheckbox",
2385
2367
  "declaration": {
2386
- "name": "zeroCard",
2387
- "module": "src/card/card.ts"
2368
+ "name": "zeroCheckbox",
2369
+ "module": "src/checkbox/checkbox.ts"
2388
2370
  }
2389
2371
  }
2390
2372
  ]
2391
2373
  },
2392
2374
  {
2393
2375
  "kind": "javascript-module",
2394
- "path": "src/card/index.ts",
2376
+ "path": "src/checkbox/index.ts",
2395
2377
  "declarations": [],
2396
2378
  "exports": [
2397
2379
  {
@@ -2399,7 +2381,7 @@
2399
2381
  "name": "*",
2400
2382
  "declaration": {
2401
2383
  "name": "*",
2402
- "package": "./card"
2384
+ "package": "./checkbox"
2403
2385
  }
2404
2386
  },
2405
2387
  {
@@ -2407,7 +2389,7 @@
2407
2389
  "name": "*",
2408
2390
  "declaration": {
2409
2391
  "name": "*",
2410
- "package": "./card.styles"
2392
+ "package": "./checkbox.styles"
2411
2393
  }
2412
2394
  },
2413
2395
  {
@@ -2415,14 +2397,14 @@
2415
2397
  "name": "*",
2416
2398
  "declaration": {
2417
2399
  "name": "*",
2418
- "package": "./card.template"
2400
+ "package": "./checkbox.template"
2419
2401
  }
2420
2402
  }
2421
2403
  ]
2422
2404
  },
2423
2405
  {
2424
2406
  "kind": "javascript-module",
2425
- "path": "src/checkbox/checkbox.stories.ts",
2407
+ "path": "src/button/button.stories.ts",
2426
2408
  "declarations": [
2427
2409
  {
2428
2410
  "kind": "variable",
@@ -2430,15 +2412,23 @@
2430
2412
  "type": {
2431
2413
  "text": "Meta"
2432
2414
  },
2433
- "default": "{\n title: 'Checkbox',\n component: 'zero-checkbox>',\n}"
2415
+ "default": "{\n title: 'Button',\n component: 'zero-button',\n}"
2434
2416
  },
2435
2417
  {
2436
2418
  "kind": "variable",
2437
- "name": "Primary",
2419
+ "name": "All",
2438
2420
  "type": {
2439
2421
  "text": "StoryObj"
2440
2422
  },
2441
- "default": "{\n args: {\n customCheckboxText: 'Custom Zero Checkbox',\n customCheckboxDesignUnit: 8,\n customCheckboxCornerRadius: 4,\n },\n render: ({ customCheckboxText, customCheckboxDesignUnit, customCheckboxCornerRadius }) =>\n html`\n <div style=\"${wrapperStyle}\">\n <zero-checkbox>Default Zero Checkbox</zero-checkbox>\n\n <zero-design-system-provider\n design-unit=\"${customCheckboxDesignUnit}\"\n corner-radius=${customCheckboxCornerRadius}\"\n >\n <zero-checkbox>${customCheckboxText}</zero-checkbox>\n </zero-design-system-provider>\n </div>\n `,\n}"
2423
+ "default": "{\n args: {\n appearances: ZeroAppearanceValues,\n buttonText: 'Zero Button',\n },\n ...StylesMapperTemplate,\n}"
2424
+ },
2425
+ {
2426
+ "kind": "variable",
2427
+ "name": "Single",
2428
+ "type": {
2429
+ "text": "StoryObj"
2430
+ },
2431
+ "default": "{\n args: {\n appearance: 'neutral',\n buttonText: 'Zero Button',\n },\n argTypes: {\n appearance: {\n control: 'select',\n options: [...FastAppearanceValues, ...ZeroAppearanceValues],\n },\n },\n render: ({ appearance, buttonText }) =>\n html`\n <zero-button appearance=\"${appearance}\">${buttonText} (${appearance})</zero-button>\n `,\n}"
2442
2432
  }
2443
2433
  ],
2444
2434
  "exports": [
@@ -2447,26 +2437,34 @@
2447
2437
  "name": "default",
2448
2438
  "declaration": {
2449
2439
  "name": "meta",
2450
- "module": "src/checkbox/checkbox.stories.ts"
2440
+ "module": "src/button/button.stories.ts"
2451
2441
  }
2452
2442
  },
2453
2443
  {
2454
2444
  "kind": "js",
2455
- "name": "Primary",
2445
+ "name": "All",
2456
2446
  "declaration": {
2457
- "name": "Primary",
2458
- "module": "src/checkbox/checkbox.stories.ts"
2447
+ "name": "All",
2448
+ "module": "src/button/button.stories.ts"
2449
+ }
2450
+ },
2451
+ {
2452
+ "kind": "js",
2453
+ "name": "Single",
2454
+ "declaration": {
2455
+ "name": "Single",
2456
+ "module": "src/button/button.stories.ts"
2459
2457
  }
2460
2458
  }
2461
2459
  ]
2462
2460
  },
2463
2461
  {
2464
2462
  "kind": "javascript-module",
2465
- "path": "src/checkbox/checkbox.styles.ts",
2463
+ "path": "src/button/button.styles.ts",
2466
2464
  "declarations": [
2467
2465
  {
2468
2466
  "kind": "function",
2469
- "name": "zeroCheckboxStyles",
2467
+ "name": "zeroButtonStyles",
2470
2468
  "return": {
2471
2469
  "type": {
2472
2470
  "text": "ElementStyles"
@@ -2482,7 +2480,7 @@
2482
2480
  {
2483
2481
  "name": "definition",
2484
2482
  "type": {
2485
- "text": "CheckboxOptions"
2483
+ "text": "FoundationElementDefinition"
2486
2484
  }
2487
2485
  }
2488
2486
  ]
@@ -2491,24 +2489,24 @@
2491
2489
  "exports": [
2492
2490
  {
2493
2491
  "kind": "js",
2494
- "name": "zeroCheckboxStyles",
2492
+ "name": "zeroButtonStyles",
2495
2493
  "declaration": {
2496
- "name": "zeroCheckboxStyles",
2497
- "module": "src/checkbox/checkbox.styles.ts"
2494
+ "name": "zeroButtonStyles",
2495
+ "module": "src/button/button.styles.ts"
2498
2496
  }
2499
2497
  }
2500
2498
  ]
2501
2499
  },
2502
2500
  {
2503
2501
  "kind": "javascript-module",
2504
- "path": "src/checkbox/checkbox.template.ts",
2502
+ "path": "src/button/button.template.ts",
2505
2503
  "declarations": [
2506
2504
  {
2507
2505
  "kind": "function",
2508
- "name": "zeroCheckboxTemplate",
2506
+ "name": "zeroButtonTemplate",
2509
2507
  "return": {
2510
2508
  "type": {
2511
- "text": "ViewTemplate<Checkbox>"
2509
+ "text": "ViewTemplate<Button>"
2512
2510
  }
2513
2511
  },
2514
2512
  "parameters": [
@@ -2521,7 +2519,7 @@
2521
2519
  {
2522
2520
  "name": "definition",
2523
2521
  "type": {
2524
- "text": "CheckboxOptions"
2522
+ "text": "FoundationElementDefinition"
2525
2523
  }
2526
2524
  }
2527
2525
  ]
@@ -2530,54 +2528,56 @@
2530
2528
  "exports": [
2531
2529
  {
2532
2530
  "kind": "js",
2533
- "name": "zeroCheckboxTemplate",
2531
+ "name": "zeroButtonTemplate",
2534
2532
  "declaration": {
2535
- "name": "zeroCheckboxTemplate",
2536
- "module": "src/checkbox/checkbox.template.ts"
2533
+ "name": "zeroButtonTemplate",
2534
+ "module": "src/button/button.template.ts"
2537
2535
  }
2538
2536
  }
2539
2537
  ]
2540
2538
  },
2541
2539
  {
2542
2540
  "kind": "javascript-module",
2543
- "path": "src/checkbox/checkbox.ts",
2541
+ "path": "src/button/button.ts",
2544
2542
  "declarations": [
2545
2543
  {
2546
2544
  "kind": "class",
2547
2545
  "description": "",
2548
- "name": "Checkbox",
2546
+ "name": "Button",
2549
2547
  "superclass": {
2550
- "name": "FoundationCheckbox",
2548
+ "name": "FoundationButton",
2551
2549
  "package": "@genesislcap/foundation-ui"
2552
- }
2550
+ },
2551
+ "tagName": "%%prefix%%-button",
2552
+ "customElement": true
2553
2553
  },
2554
2554
  {
2555
2555
  "kind": "variable",
2556
- "name": "zeroCheckbox"
2556
+ "name": "zeroButton"
2557
2557
  }
2558
2558
  ],
2559
2559
  "exports": [
2560
2560
  {
2561
2561
  "kind": "js",
2562
- "name": "Checkbox",
2562
+ "name": "Button",
2563
2563
  "declaration": {
2564
- "name": "Checkbox",
2565
- "module": "src/checkbox/checkbox.ts"
2564
+ "name": "Button",
2565
+ "module": "src/button/button.ts"
2566
2566
  }
2567
2567
  },
2568
2568
  {
2569
2569
  "kind": "js",
2570
- "name": "zeroCheckbox",
2570
+ "name": "zeroButton",
2571
2571
  "declaration": {
2572
- "name": "zeroCheckbox",
2573
- "module": "src/checkbox/checkbox.ts"
2572
+ "name": "zeroButton",
2573
+ "module": "src/button/button.ts"
2574
2574
  }
2575
2575
  }
2576
2576
  ]
2577
2577
  },
2578
2578
  {
2579
2579
  "kind": "javascript-module",
2580
- "path": "src/checkbox/index.ts",
2580
+ "path": "src/button/index.ts",
2581
2581
  "declarations": [],
2582
2582
  "exports": [
2583
2583
  {
@@ -2585,7 +2585,7 @@
2585
2585
  "name": "*",
2586
2586
  "declaration": {
2587
2587
  "name": "*",
2588
- "package": "./checkbox"
2588
+ "package": "./button"
2589
2589
  }
2590
2590
  },
2591
2591
  {
@@ -2593,7 +2593,7 @@
2593
2593
  "name": "*",
2594
2594
  "declaration": {
2595
2595
  "name": "*",
2596
- "package": "./checkbox.styles"
2596
+ "package": "./button.styles"
2597
2597
  }
2598
2598
  },
2599
2599
  {
@@ -2601,7 +2601,7 @@
2601
2601
  "name": "*",
2602
2602
  "declaration": {
2603
2603
  "name": "*",
2604
- "package": "./checkbox.template"
2604
+ "package": "./button.template"
2605
2605
  }
2606
2606
  }
2607
2607
  ]
@@ -6531,7 +6531,7 @@
6531
6531
  },
6532
6532
  {
6533
6533
  "kind": "javascript-module",
6534
- "path": "src/flex-layout/flex-layout.stories.ts",
6534
+ "path": "src/flipper/flipper.stories.ts",
6535
6535
  "declarations": [
6536
6536
  {
6537
6537
  "kind": "variable",
@@ -6539,7 +6539,7 @@
6539
6539
  "type": {
6540
6540
  "text": "Meta"
6541
6541
  },
6542
- "default": "{\n title: 'Flex Layout',\n component: 'zero-flex-layout',\n parameters: {\n controls: { hideNoControlsWarning: true },\n },\n}"
6542
+ "default": "{\n title: 'Flipper',\n component: 'zero-flipper',\n}"
6543
6543
  },
6544
6544
  {
6545
6545
  "kind": "variable",
@@ -6547,7 +6547,7 @@
6547
6547
  "type": {
6548
6548
  "text": "StoryObj"
6549
6549
  },
6550
- "default": "{\n render: () => html`\n <div style=\"${wrapperStyle}\">\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-flex-layout class=\"flex-column flex-wrap spacing-2x justify-end\">\n <div style=\"width: 30%; height: 40%; background-color: red;\"></div>\n <div style=\"width: 30%; height: 50%; background-color: green;\"></div>\n </zero-flex-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-flex-layout class=\"flex-row spacing-2x\">\n <div style=\"width: 30%; background-color: red;\"></div>\n <div style=\"width: 70%; background-color: green;\"></div>\n </zero-flex-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-flex-layout class=\"flex-row spacing-2x\">\n <div style=\"width: 20%; background-color: red;\"></div>\n <div style=\"width: 60%; background-color: green;\"></div>\n <div style=\"width: 20%; background-color: blue;\"></div>\n </zero-flex-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-flex-layout class=\"flex-row spacing-2x\">\n <div style=\"width: 30%; height: 100%; background-color: red;\"></div>\n <zero-flex-layout class=\"flex-column spacing-2x\">\n <div style=\"height: 60%; width: 100%; background-color: blue;\"></div>\n <div style=\"height: 40%; width: 100%; background-color: green;\"></div>\n </zero-flex-layout>\n </zero-flex-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-flex-layout class=\"flex-column spacing-2x\">\n <div style=\"height: 100%; width: 100%; background-color: blue;\"></div>\n <zero-flex-layout class=\"flex-row spacing-2x\">\n <div style=\"width: 80%; background-color: green;\"></div>\n <div style=\"width: 20%; background-color: blue;\"></div>\n </zero-flex-layout>\n </zero-flex-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-flex-layout class=\"flex-column spacing-2x\">\n <div style=\"height: 20%; width: 100%; background-color: blue;\"></div>\n <zero-flex-layout class=\"flex-row spacing-2x\">\n <div style=\"width: 20%; background-color: green;\"></div>\n <div style=\"width: 80%; background-color: blue;\"></div>\n </zero-flex-layout>\n <div style=\"width: 100%; height: 20%; background-color: yellow;\"></div>\n </zero-flex-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-flex-layout class=\"flex-row spacing-2x\">\n <div style=\"background-color: blue; width: 100%; height: 100%;\"></div>\n <zero-flex-layout class=\"flex-column spacing-2x\">\n <div style=\"background-color: green; width: 100%; height: 100%;\"></div>\n <zero-flex-layout class=\"flex-row spacing-2x\">\n <div style=\"flex:3; background-color: yellow;\"></div>\n <div style=\"flex:1; background-color: blue;\"></div>\n </zero-flex-layout>\n </zero-flex-layout>\n </zero-flex-layout>\n </zero-card>\n </div>\n `,\n}"
6550
+ "default": "{\n argTypes: {\n direction: {\n control: 'select',\n options: ['previous', 'next'],\n },\n },\n args: {\n direction: 'next',\n },\n render: ({ direction }) =>\n html`\n <zero-flipper direction=\"${direction}\">Zero Flipper</zero-flipper>\n `,\n}"
6551
6551
  }
6552
6552
  ],
6553
6553
  "exports": [
@@ -6556,7 +6556,7 @@
6556
6556
  "name": "default",
6557
6557
  "declaration": {
6558
6558
  "name": "meta",
6559
- "module": "src/flex-layout/flex-layout.stories.ts"
6559
+ "module": "src/flipper/flipper.stories.ts"
6560
6560
  }
6561
6561
  },
6562
6562
  {
@@ -6564,168 +6564,129 @@
6564
6564
  "name": "Primary",
6565
6565
  "declaration": {
6566
6566
  "name": "Primary",
6567
- "module": "src/flex-layout/flex-layout.stories.ts"
6567
+ "module": "src/flipper/flipper.stories.ts"
6568
6568
  }
6569
6569
  }
6570
6570
  ]
6571
6571
  },
6572
6572
  {
6573
6573
  "kind": "javascript-module",
6574
- "path": "src/flex-layout/flex-layout.ts",
6574
+ "path": "src/flipper/flipper.styles.ts",
6575
6575
  "declarations": [
6576
6576
  {
6577
- "kind": "class",
6578
- "description": "",
6579
- "name": "FlexLayout",
6580
- "superclass": {
6581
- "name": "FoundationFlexLayout",
6582
- "package": "@genesislcap/foundation-ui"
6577
+ "kind": "function",
6578
+ "name": "zeroFlipperStyles",
6579
+ "return": {
6580
+ "type": {
6581
+ "text": "ElementStyles"
6582
+ }
6583
6583
  },
6584
- "tagName": "%%prefix%%-flex-layout",
6585
- "customElement": true,
6586
- "members": [
6584
+ "parameters": [
6587
6585
  {
6588
- "kind": "field",
6589
- "name": "_presentation",
6586
+ "name": "context",
6590
6587
  "type": {
6591
- "text": "ComponentPresentation | null | undefined"
6592
- },
6593
- "privacy": "private",
6594
- "default": "void 0",
6595
- "inheritedFrom": {
6596
- "name": "FoundationElement",
6597
- "module": "src/foundation-element/foundation-element.ts"
6588
+ "text": "ElementDefinitionContext"
6598
6589
  }
6599
6590
  },
6600
6591
  {
6601
- "kind": "field",
6602
- "name": "$presentation",
6592
+ "name": "definition",
6603
6593
  "type": {
6604
- "text": "ComponentPresentation | null"
6605
- },
6606
- "privacy": "public",
6607
- "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
6608
- "inheritedFrom": {
6609
- "name": "FoundationElement",
6610
- "module": "src/foundation-element/foundation-element.ts"
6594
+ "text": "FlipperOptions"
6611
6595
  }
6612
- },
6596
+ }
6597
+ ]
6598
+ }
6599
+ ],
6600
+ "exports": [
6601
+ {
6602
+ "kind": "js",
6603
+ "name": "zeroFlipperStyles",
6604
+ "declaration": {
6605
+ "name": "zeroFlipperStyles",
6606
+ "module": "src/flipper/flipper.styles.ts"
6607
+ }
6608
+ }
6609
+ ]
6610
+ },
6611
+ {
6612
+ "kind": "javascript-module",
6613
+ "path": "src/flipper/flipper.template.ts",
6614
+ "declarations": [
6615
+ {
6616
+ "kind": "function",
6617
+ "name": "zeroFlipperTemplate",
6618
+ "return": {
6619
+ "type": {
6620
+ "text": "ViewTemplate<Flipper>"
6621
+ }
6622
+ },
6623
+ "parameters": [
6613
6624
  {
6614
- "kind": "field",
6615
- "name": "template",
6625
+ "name": "context",
6616
6626
  "type": {
6617
- "text": "ElementViewTemplate | void | null"
6618
- },
6619
- "privacy": "public",
6620
- "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.",
6621
- "inheritedFrom": {
6622
- "name": "FoundationElement",
6623
- "module": "src/foundation-element/foundation-element.ts"
6624
- }
6625
- },
6626
- {
6627
- "kind": "method",
6628
- "name": "templateChanged",
6629
- "privacy": "protected",
6630
- "return": {
6631
- "type": {
6632
- "text": "void"
6633
- }
6634
- },
6635
- "inheritedFrom": {
6636
- "name": "FoundationElement",
6637
- "module": "src/foundation-element/foundation-element.ts"
6627
+ "text": "ElementDefinitionContext"
6638
6628
  }
6639
6629
  },
6640
6630
  {
6641
- "kind": "field",
6642
- "name": "styles",
6631
+ "name": "definition",
6643
6632
  "type": {
6644
- "text": "ElementStyles | void | null"
6645
- },
6646
- "privacy": "public",
6647
- "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.",
6648
- "inheritedFrom": {
6649
- "name": "FoundationElement",
6650
- "module": "src/foundation-element/foundation-element.ts"
6651
- }
6652
- },
6653
- {
6654
- "kind": "method",
6655
- "name": "stylesChanged",
6656
- "privacy": "protected",
6657
- "return": {
6658
- "type": {
6659
- "text": "void"
6660
- }
6661
- },
6662
- "inheritedFrom": {
6663
- "name": "FoundationElement",
6664
- "module": "src/foundation-element/foundation-element.ts"
6665
- }
6666
- },
6667
- {
6668
- "kind": "method",
6669
- "name": "compose",
6670
- "privacy": "public",
6671
- "static": true,
6672
- "return": {
6673
- "type": {
6674
- "text": "(\n overrideDefinition?: OverrideFoundationElementDefinition<T>\n ) => FoundationElementRegistry<T, K>"
6675
- }
6676
- },
6677
- "parameters": [
6678
- {
6679
- "name": "this",
6680
- "type": {
6681
- "text": "K"
6682
- }
6683
- },
6684
- {
6685
- "name": "elementDefinition",
6686
- "type": {
6687
- "text": "T"
6688
- },
6689
- "description": "The definition of the element to create the registry\nfunction for."
6690
- }
6691
- ],
6692
- "description": "Defines an element registry function with a set of element definition defaults.",
6693
- "inheritedFrom": {
6694
- "name": "FoundationElement",
6695
- "module": "src/foundation-element/foundation-element.ts"
6633
+ "text": "FlipperOptions"
6696
6634
  }
6697
6635
  }
6698
6636
  ]
6637
+ }
6638
+ ],
6639
+ "exports": [
6640
+ {
6641
+ "kind": "js",
6642
+ "name": "zeroFlipperTemplate",
6643
+ "declaration": {
6644
+ "name": "zeroFlipperTemplate",
6645
+ "module": "src/flipper/flipper.template.ts"
6646
+ }
6647
+ }
6648
+ ]
6649
+ },
6650
+ {
6651
+ "kind": "javascript-module",
6652
+ "path": "src/flipper/flipper.ts",
6653
+ "declarations": [
6654
+ {
6655
+ "kind": "class",
6656
+ "description": "",
6657
+ "name": "Flipper",
6658
+ "superclass": {
6659
+ "name": "FoundationFlipper",
6660
+ "package": "@genesislcap/foundation-ui"
6661
+ }
6699
6662
  },
6700
6663
  {
6701
6664
  "kind": "variable",
6702
- "name": "zeroFlexLayout",
6703
- "description": "The Zero Flex Layout",
6704
- "privacy": "public"
6665
+ "name": "zeroFlipper"
6705
6666
  }
6706
6667
  ],
6707
6668
  "exports": [
6708
6669
  {
6709
6670
  "kind": "js",
6710
- "name": "FlexLayout",
6671
+ "name": "Flipper",
6711
6672
  "declaration": {
6712
- "name": "FlexLayout",
6713
- "module": "src/flex-layout/flex-layout.ts"
6673
+ "name": "Flipper",
6674
+ "module": "src/flipper/flipper.ts"
6714
6675
  }
6715
6676
  },
6716
6677
  {
6717
6678
  "kind": "js",
6718
- "name": "zeroFlexLayout",
6679
+ "name": "zeroFlipper",
6719
6680
  "declaration": {
6720
- "name": "zeroFlexLayout",
6721
- "module": "src/flex-layout/flex-layout.ts"
6681
+ "name": "zeroFlipper",
6682
+ "module": "src/flipper/flipper.ts"
6722
6683
  }
6723
6684
  }
6724
6685
  ]
6725
6686
  },
6726
6687
  {
6727
6688
  "kind": "javascript-module",
6728
- "path": "src/flex-layout/index.ts",
6689
+ "path": "src/flipper/index.ts",
6729
6690
  "declarations": [],
6730
6691
  "exports": [
6731
6692
  {
@@ -6733,14 +6694,30 @@
6733
6694
  "name": "*",
6734
6695
  "declaration": {
6735
6696
  "name": "*",
6736
- "package": "./flex-layout"
6697
+ "package": "./flipper"
6698
+ }
6699
+ },
6700
+ {
6701
+ "kind": "js",
6702
+ "name": "*",
6703
+ "declaration": {
6704
+ "name": "*",
6705
+ "package": "./flipper.styles"
6706
+ }
6707
+ },
6708
+ {
6709
+ "kind": "js",
6710
+ "name": "*",
6711
+ "declaration": {
6712
+ "name": "*",
6713
+ "package": "./flipper.template"
6737
6714
  }
6738
6715
  }
6739
6716
  ]
6740
6717
  },
6741
6718
  {
6742
6719
  "kind": "javascript-module",
6743
- "path": "src/flipper/flipper.stories.ts",
6720
+ "path": "src/flex-layout/flex-layout.stories.ts",
6744
6721
  "declarations": [
6745
6722
  {
6746
6723
  "kind": "variable",
@@ -6748,7 +6725,7 @@
6748
6725
  "type": {
6749
6726
  "text": "Meta"
6750
6727
  },
6751
- "default": "{\n title: 'Flipper',\n component: 'zero-flipper',\n}"
6728
+ "default": "{\n title: 'Flex Layout',\n component: 'zero-flex-layout',\n parameters: {\n controls: { hideNoControlsWarning: true },\n },\n}"
6752
6729
  },
6753
6730
  {
6754
6731
  "kind": "variable",
@@ -6756,7 +6733,7 @@
6756
6733
  "type": {
6757
6734
  "text": "StoryObj"
6758
6735
  },
6759
- "default": "{\n argTypes: {\n direction: {\n control: 'select',\n options: ['previous', 'next'],\n },\n },\n args: {\n direction: 'next',\n },\n render: ({ direction }) =>\n html`\n <zero-flipper direction=\"${direction}\">Zero Flipper</zero-flipper>\n `,\n}"
6736
+ "default": "{\n render: () => html`\n <div style=\"${wrapperStyle}\">\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-flex-layout class=\"flex-column flex-wrap spacing-2x justify-end\">\n <div style=\"width: 30%; height: 40%; background-color: red;\"></div>\n <div style=\"width: 30%; height: 50%; background-color: green;\"></div>\n </zero-flex-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-flex-layout class=\"flex-row spacing-2x\">\n <div style=\"width: 30%; background-color: red;\"></div>\n <div style=\"width: 70%; background-color: green;\"></div>\n </zero-flex-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-flex-layout class=\"flex-row spacing-2x\">\n <div style=\"width: 20%; background-color: red;\"></div>\n <div style=\"width: 60%; background-color: green;\"></div>\n <div style=\"width: 20%; background-color: blue;\"></div>\n </zero-flex-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-flex-layout class=\"flex-row spacing-2x\">\n <div style=\"width: 30%; height: 100%; background-color: red;\"></div>\n <zero-flex-layout class=\"flex-column spacing-2x\">\n <div style=\"height: 60%; width: 100%; background-color: blue;\"></div>\n <div style=\"height: 40%; width: 100%; background-color: green;\"></div>\n </zero-flex-layout>\n </zero-flex-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-flex-layout class=\"flex-column spacing-2x\">\n <div style=\"height: 100%; width: 100%; background-color: blue;\"></div>\n <zero-flex-layout class=\"flex-row spacing-2x\">\n <div style=\"width: 80%; background-color: green;\"></div>\n <div style=\"width: 20%; background-color: blue;\"></div>\n </zero-flex-layout>\n </zero-flex-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-flex-layout class=\"flex-column spacing-2x\">\n <div style=\"height: 20%; width: 100%; background-color: blue;\"></div>\n <zero-flex-layout class=\"flex-row spacing-2x\">\n <div style=\"width: 20%; background-color: green;\"></div>\n <div style=\"width: 80%; background-color: blue;\"></div>\n </zero-flex-layout>\n <div style=\"width: 100%; height: 20%; background-color: yellow;\"></div>\n </zero-flex-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-flex-layout class=\"flex-row spacing-2x\">\n <div style=\"background-color: blue; width: 100%; height: 100%;\"></div>\n <zero-flex-layout class=\"flex-column spacing-2x\">\n <div style=\"background-color: green; width: 100%; height: 100%;\"></div>\n <zero-flex-layout class=\"flex-row spacing-2x\">\n <div style=\"flex:3; background-color: yellow;\"></div>\n <div style=\"flex:1; background-color: blue;\"></div>\n </zero-flex-layout>\n </zero-flex-layout>\n </zero-flex-layout>\n </zero-card>\n </div>\n `,\n}"
6760
6737
  }
6761
6738
  ],
6762
6739
  "exports": [
@@ -6765,7 +6742,7 @@
6765
6742
  "name": "default",
6766
6743
  "declaration": {
6767
6744
  "name": "meta",
6768
- "module": "src/flipper/flipper.stories.ts"
6745
+ "module": "src/flex-layout/flex-layout.stories.ts"
6769
6746
  }
6770
6747
  },
6771
6748
  {
@@ -6773,129 +6750,168 @@
6773
6750
  "name": "Primary",
6774
6751
  "declaration": {
6775
6752
  "name": "Primary",
6776
- "module": "src/flipper/flipper.stories.ts"
6753
+ "module": "src/flex-layout/flex-layout.stories.ts"
6777
6754
  }
6778
6755
  }
6779
6756
  ]
6780
6757
  },
6781
6758
  {
6782
6759
  "kind": "javascript-module",
6783
- "path": "src/flipper/flipper.styles.ts",
6760
+ "path": "src/flex-layout/flex-layout.ts",
6784
6761
  "declarations": [
6785
6762
  {
6786
- "kind": "function",
6787
- "name": "zeroFlipperStyles",
6788
- "return": {
6789
- "type": {
6790
- "text": "ElementStyles"
6791
- }
6763
+ "kind": "class",
6764
+ "description": "",
6765
+ "name": "FlexLayout",
6766
+ "superclass": {
6767
+ "name": "FoundationFlexLayout",
6768
+ "package": "@genesislcap/foundation-ui"
6792
6769
  },
6793
- "parameters": [
6770
+ "tagName": "%%prefix%%-flex-layout",
6771
+ "customElement": true,
6772
+ "members": [
6794
6773
  {
6795
- "name": "context",
6774
+ "kind": "field",
6775
+ "name": "_presentation",
6796
6776
  "type": {
6797
- "text": "ElementDefinitionContext"
6777
+ "text": "ComponentPresentation | null | undefined"
6778
+ },
6779
+ "privacy": "private",
6780
+ "default": "void 0",
6781
+ "inheritedFrom": {
6782
+ "name": "FoundationElement",
6783
+ "module": "src/foundation-element/foundation-element.ts"
6798
6784
  }
6799
6785
  },
6800
6786
  {
6801
- "name": "definition",
6787
+ "kind": "field",
6788
+ "name": "$presentation",
6802
6789
  "type": {
6803
- "text": "FlipperOptions"
6790
+ "text": "ComponentPresentation | null"
6791
+ },
6792
+ "privacy": "public",
6793
+ "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
6794
+ "inheritedFrom": {
6795
+ "name": "FoundationElement",
6796
+ "module": "src/foundation-element/foundation-element.ts"
6804
6797
  }
6805
- }
6806
- ]
6807
- }
6808
- ],
6809
- "exports": [
6810
- {
6811
- "kind": "js",
6812
- "name": "zeroFlipperStyles",
6813
- "declaration": {
6814
- "name": "zeroFlipperStyles",
6815
- "module": "src/flipper/flipper.styles.ts"
6816
- }
6817
- }
6818
- ]
6819
- },
6820
- {
6821
- "kind": "javascript-module",
6822
- "path": "src/flipper/flipper.template.ts",
6823
- "declarations": [
6824
- {
6825
- "kind": "function",
6826
- "name": "zeroFlipperTemplate",
6827
- "return": {
6828
- "type": {
6829
- "text": "ViewTemplate<Flipper>"
6830
- }
6831
- },
6832
- "parameters": [
6798
+ },
6833
6799
  {
6834
- "name": "context",
6800
+ "kind": "field",
6801
+ "name": "template",
6835
6802
  "type": {
6836
- "text": "ElementDefinitionContext"
6803
+ "text": "ElementViewTemplate | void | null"
6804
+ },
6805
+ "privacy": "public",
6806
+ "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.",
6807
+ "inheritedFrom": {
6808
+ "name": "FoundationElement",
6809
+ "module": "src/foundation-element/foundation-element.ts"
6837
6810
  }
6838
6811
  },
6839
6812
  {
6840
- "name": "definition",
6813
+ "kind": "method",
6814
+ "name": "templateChanged",
6815
+ "privacy": "protected",
6816
+ "return": {
6817
+ "type": {
6818
+ "text": "void"
6819
+ }
6820
+ },
6821
+ "inheritedFrom": {
6822
+ "name": "FoundationElement",
6823
+ "module": "src/foundation-element/foundation-element.ts"
6824
+ }
6825
+ },
6826
+ {
6827
+ "kind": "field",
6828
+ "name": "styles",
6841
6829
  "type": {
6842
- "text": "FlipperOptions"
6830
+ "text": "ElementStyles | void | null"
6831
+ },
6832
+ "privacy": "public",
6833
+ "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.",
6834
+ "inheritedFrom": {
6835
+ "name": "FoundationElement",
6836
+ "module": "src/foundation-element/foundation-element.ts"
6837
+ }
6838
+ },
6839
+ {
6840
+ "kind": "method",
6841
+ "name": "stylesChanged",
6842
+ "privacy": "protected",
6843
+ "return": {
6844
+ "type": {
6845
+ "text": "void"
6846
+ }
6847
+ },
6848
+ "inheritedFrom": {
6849
+ "name": "FoundationElement",
6850
+ "module": "src/foundation-element/foundation-element.ts"
6851
+ }
6852
+ },
6853
+ {
6854
+ "kind": "method",
6855
+ "name": "compose",
6856
+ "privacy": "public",
6857
+ "static": true,
6858
+ "return": {
6859
+ "type": {
6860
+ "text": "(\n overrideDefinition?: OverrideFoundationElementDefinition<T>\n ) => FoundationElementRegistry<T, K>"
6861
+ }
6862
+ },
6863
+ "parameters": [
6864
+ {
6865
+ "name": "this",
6866
+ "type": {
6867
+ "text": "K"
6868
+ }
6869
+ },
6870
+ {
6871
+ "name": "elementDefinition",
6872
+ "type": {
6873
+ "text": "T"
6874
+ },
6875
+ "description": "The definition of the element to create the registry\nfunction for."
6876
+ }
6877
+ ],
6878
+ "description": "Defines an element registry function with a set of element definition defaults.",
6879
+ "inheritedFrom": {
6880
+ "name": "FoundationElement",
6881
+ "module": "src/foundation-element/foundation-element.ts"
6843
6882
  }
6844
6883
  }
6845
6884
  ]
6846
- }
6847
- ],
6848
- "exports": [
6849
- {
6850
- "kind": "js",
6851
- "name": "zeroFlipperTemplate",
6852
- "declaration": {
6853
- "name": "zeroFlipperTemplate",
6854
- "module": "src/flipper/flipper.template.ts"
6855
- }
6856
- }
6857
- ]
6858
- },
6859
- {
6860
- "kind": "javascript-module",
6861
- "path": "src/flipper/flipper.ts",
6862
- "declarations": [
6863
- {
6864
- "kind": "class",
6865
- "description": "",
6866
- "name": "Flipper",
6867
- "superclass": {
6868
- "name": "FoundationFlipper",
6869
- "package": "@genesislcap/foundation-ui"
6870
- }
6871
6885
  },
6872
6886
  {
6873
6887
  "kind": "variable",
6874
- "name": "zeroFlipper"
6888
+ "name": "zeroFlexLayout",
6889
+ "description": "The Zero Flex Layout",
6890
+ "privacy": "public"
6875
6891
  }
6876
6892
  ],
6877
6893
  "exports": [
6878
6894
  {
6879
6895
  "kind": "js",
6880
- "name": "Flipper",
6896
+ "name": "FlexLayout",
6881
6897
  "declaration": {
6882
- "name": "Flipper",
6883
- "module": "src/flipper/flipper.ts"
6898
+ "name": "FlexLayout",
6899
+ "module": "src/flex-layout/flex-layout.ts"
6884
6900
  }
6885
6901
  },
6886
6902
  {
6887
6903
  "kind": "js",
6888
- "name": "zeroFlipper",
6904
+ "name": "zeroFlexLayout",
6889
6905
  "declaration": {
6890
- "name": "zeroFlipper",
6891
- "module": "src/flipper/flipper.ts"
6906
+ "name": "zeroFlexLayout",
6907
+ "module": "src/flex-layout/flex-layout.ts"
6892
6908
  }
6893
6909
  }
6894
6910
  ]
6895
6911
  },
6896
6912
  {
6897
6913
  "kind": "javascript-module",
6898
- "path": "src/flipper/index.ts",
6914
+ "path": "src/flex-layout/index.ts",
6899
6915
  "declarations": [],
6900
6916
  "exports": [
6901
6917
  {
@@ -6903,23 +6919,7 @@
6903
6919
  "name": "*",
6904
6920
  "declaration": {
6905
6921
  "name": "*",
6906
- "package": "./flipper"
6907
- }
6908
- },
6909
- {
6910
- "kind": "js",
6911
- "name": "*",
6912
- "declaration": {
6913
- "name": "*",
6914
- "package": "./flipper.styles"
6915
- }
6916
- },
6917
- {
6918
- "kind": "js",
6919
- "name": "*",
6920
- "declaration": {
6921
- "name": "*",
6922
- "package": "./flipper.template"
6922
+ "package": "./flex-layout"
6923
6923
  }
6924
6924
  }
6925
6925
  ]