@citygross/components_v2 0.0.12 → 0.0.14

package/dist/components/TimeLine/TimeLine.js

@@ -0,0 +1,53 @@
+import React from 'react';
+import { useDetectDevice } from '@citygross/utils';
+import { Dot } from '../Dot/Dot.js';
+import { baseTimeLine, timeLineH3, baseTimeLineList, baseTimeLineItem } from './TimeLine.css.vanilla.js';
+import { H3 } from '../../typography/H3/H3.js';
+import { BodyText } from '../../typography/BodyText/BodyText.js';
+
+function Timeline({
+  items,
+  title = "Vi skickar l\xF6pande information n\xE4r:",
+  mobileTitle = "N\xE4r din...",
+  current,
+  dotColor = "greenLight",
+  dotActiveColor = "alertGreen",
+  dotShadow = "greenMedium",
+  borderStyle = "dashed",
+  borderColor,
+  color,
+  reversed,
+  completedColor
+}) {
+  const { isMobile } = useDetectDevice();
+  return /* @__PURE__ */ React.createElement("div", { className: baseTimeLine }, /* @__PURE__ */ React.createElement(H3, { className: timeLineH3 }, isMobile ? mobileTitle : title), /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: baseTimeLineList({
+        borderStyle: length > 1 ? "none" : borderStyle,
+        borderColor
+      })
+    },
+    items.map((item, index) => /* @__PURE__ */ React.createElement("div", { className: baseTimeLineItem, key: item.primaryText + index }, /* @__PURE__ */ React.createElement(
+      Dot,
+      {
+        color: reversed ? index >= current ? dotActiveColor : dotColor : index <= current ? dotActiveColor : dotColor,
+        shadow: dotShadow
+      }
+    ), current === index ? /* @__PURE__ */ React.createElement(H3, { color }, isMobile ? `${item.primaryText} (${item.time})` : `${item.primaryText} - ${item.time}`) : /* @__PURE__ */ React.createElement(BodyText, { color: completedColor ?? color }, isMobile ? `${item.primaryText} (${item.time})` : `${item.primaryText} - ${item.time}`), !isMobile && /* @__PURE__ */ React.createElement(
+      BodyText,
+      {
+        color: current === index || !completedColor ? color : completedColor
+      },
+      item.secondaryText
+    ), /* @__PURE__ */ React.createElement(
+      BodyText,
+      {
+        color: current === index || !completedColor ? color : completedColor
+      },
+      item.tiernaryText
+    )))
+  ));
+}
+
+export { Timeline };

package/dist/cssUtils/border.css.d.ts

@@ -0,0 +1,4 @@
+declare const borderColor: Record<"primary" | "none" | "boxShadow" | "border" | "link" | "black" | "transparent" | "white" | "medium" | "dark" | "light" | "lighter" | "secondary" | "brandYellow" | "brandBlue" | "brandPurple" | "brandPrio" | "yellowLighter" | "yellowLight" | "blueLight" | "blueLighter" | "blueMedium" | "greenLight" | "greenMedium" | "redLight" | "recipeVego" | "recipeLactose" | "recipeGluten" | "lightest" | "mediumDark" | "darker" | "darkest" | "buttonGray" | "disabledGray" | "disabledDarkGray" | "placeholder" | "boxShadowActive" | "alertRed" | "alertBlue" | "alertGreen" | "darkOverlay" | "brandBlueHover" | "brandYellowHover" | "brandPrioHover" | "brandBlueActive" | "brandYellowActive" | "brandPrioActive", string>;
+declare const borderRadius: Record<"extraSmall" | "small" | "default" | "none" | "big" | "round" | "large" | "bigger", string>;
+
+export { borderColor, borderRadius };

package/dist/cssUtils/border.css.vanilla.js

@@ -0,0 +1,6 @@
+import './border.css.ts.vanilla.css';
+
+var borderColor = { primary: "border_borderColor_primary__c3f0gf0", secondary: "border_borderColor_secondary__c3f0gf1", brandYellow: "border_borderColor_brandYellow__c3f0gf2", brandBlue: "border_borderColor_brandBlue__c3f0gf3", brandPurple: "border_borderColor_brandPurple__c3f0gf4", brandPrio: "border_borderColor_brandPrio__c3f0gf5", yellowLighter: "border_borderColor_yellowLighter__c3f0gf6", yellowLight: "border_borderColor_yellowLight__c3f0gf7", blueLight: "border_borderColor_blueLight__c3f0gf8", blueLighter: "border_borderColor_blueLighter__c3f0gf9", blueMedium: "border_borderColor_blueMedium__c3f0gfa", greenLight: "border_borderColor_greenLight__c3f0gfb", greenMedium: "border_borderColor_greenMedium__c3f0gfc", redLight: "border_borderColor_redLight__c3f0gfd", recipeVego: "border_borderColor_recipeVego__c3f0gfe", recipeLactose: "border_borderColor_recipeLactose__c3f0gff", recipeGluten: "border_borderColor_recipeGluten__c3f0gfg", link: "border_borderColor_link__c3f0gfh", white: "border_borderColor_white__c3f0gfi", black: "border_borderColor_black__c3f0gfj", lightest: "border_borderColor_lightest__c3f0gfk", lighter: "border_borderColor_lighter__c3f0gfl", light: "border_borderColor_light__c3f0gfm", medium: "border_borderColor_medium__c3f0gfn", mediumDark: "border_borderColor_mediumDark__c3f0gfo", dark: "border_borderColor_dark__c3f0gfp", darker: "border_borderColor_darker__c3f0gfq", darkest: "border_borderColor_darkest__c3f0gfr", buttonGray: "border_borderColor_buttonGray__c3f0gfs", disabledGray: "border_borderColor_disabledGray__c3f0gft", disabledDarkGray: "border_borderColor_disabledDarkGray__c3f0gfu", placeholder: "border_borderColor_placeholder__c3f0gfv", border: "border_borderColor_border__c3f0gfw", boxShadow: "border_borderColor_boxShadow__c3f0gfx", boxShadowActive: "border_borderColor_boxShadowActive__c3f0gfy", alertRed: "border_borderColor_alertRed__c3f0gfz", alertBlue: "border_borderColor_alertBlue__c3f0gf10", alertGreen: "border_borderColor_alertGreen__c3f0gf11", darkOverlay: "border_borderColor_darkOverlay__c3f0gf12", transparent: "border_borderColor_transparent__c3f0gf13", brandBlueHover: "border_borderColor_brandBlueHover__c3f0gf14", brandYellowHover: "border_borderColor_brandYellowHover__c3f0gf15", brandPrioHover: "border_borderColor_brandPrioHover__c3f0gf16", brandBlueActive: "border_borderColor_brandBlueActive__c3f0gf17", brandYellowActive: "border_borderColor_brandYellowActive__c3f0gf18", brandPrioActive: "border_borderColor_brandPrioActive__c3f0gf19", none: "border_borderColor_none__c3f0gf1a" };
+var borderRadius = { none: "border_borderRadius_none__c3f0gf1b", extraSmall: "border_borderRadius_extraSmall__c3f0gf1c", small: "border_borderRadius_small__c3f0gf1d", "default": "border_borderRadius_default__c3f0gf1e", big: "border_borderRadius_big__c3f0gf1f", bigger: "border_borderRadius_bigger__c3f0gf1g", large: "border_borderRadius_large__c3f0gf1h", round: "border_borderRadius_round__c3f0gf1i" };
+
+export { borderColor, borderRadius };

package/dist/cssUtils/color.css.d.ts

@@ -0,0 +1,6 @@
+declare const color: Record<"primary" | "none" | "boxShadow" | "border" | "link" | "black" | "transparent" | "white" | "medium" | "dark" | "light" | "lighter" | "secondary" | "brandYellow" | "brandBlue" | "brandPurple" | "brandPrio" | "yellowLighter" | "yellowLight" | "blueLight" | "blueLighter" | "blueMedium" | "greenLight" | "greenMedium" | "redLight" | "recipeVego" | "recipeLactose" | "recipeGluten" | "lightest" | "mediumDark" | "darker" | "darkest" | "buttonGray" | "disabledGray" | "disabledDarkGray" | "placeholder" | "boxShadowActive" | "alertRed" | "alertBlue" | "alertGreen" | "darkOverlay" | "brandBlueHover" | "brandYellowHover" | "brandPrioHover" | "brandBlueActive" | "brandYellowActive" | "brandPrioActive", string>;
+declare const backgroundColor: Record<"primary" | "none" | "boxShadow" | "border" | "link" | "black" | "transparent" | "white" | "medium" | "dark" | "light" | "lighter" | "secondary" | "brandYellow" | "brandBlue" | "brandPurple" | "brandPrio" | "yellowLighter" | "yellowLight" | "blueLight" | "blueLighter" | "blueMedium" | "greenLight" | "greenMedium" | "redLight" | "recipeVego" | "recipeLactose" | "recipeGluten" | "lightest" | "mediumDark" | "darker" | "darkest" | "buttonGray" | "disabledGray" | "disabledDarkGray" | "placeholder" | "boxShadowActive" | "alertRed" | "alertBlue" | "alertGreen" | "darkOverlay" | "brandBlueHover" | "brandYellowHover" | "brandPrioHover" | "brandBlueActive" | "brandYellowActive" | "brandPrioActive", string>;
+declare const hoverColor: Record<"primary" | "none" | "boxShadow" | "border" | "link" | "black" | "transparent" | "white" | "medium" | "dark" | "light" | "lighter" | "secondary" | "brandYellow" | "brandBlue" | "brandPurple" | "brandPrio" | "yellowLighter" | "yellowLight" | "blueLight" | "blueLighter" | "blueMedium" | "greenLight" | "greenMedium" | "redLight" | "recipeVego" | "recipeLactose" | "recipeGluten" | "lightest" | "mediumDark" | "darker" | "darkest" | "buttonGray" | "disabledGray" | "disabledDarkGray" | "placeholder" | "boxShadowActive" | "alertRed" | "alertBlue" | "alertGreen" | "darkOverlay" | "brandBlueHover" | "brandYellowHover" | "brandPrioHover" | "brandBlueActive" | "brandYellowActive" | "brandPrioActive", string>;
+declare const hoverBackgroundColor: Record<"primary" | "none" | "boxShadow" | "border" | "link" | "black" | "transparent" | "white" | "medium" | "dark" | "light" | "lighter" | "secondary" | "brandYellow" | "brandBlue" | "brandPurple" | "brandPrio" | "yellowLighter" | "yellowLight" | "blueLight" | "blueLighter" | "blueMedium" | "greenLight" | "greenMedium" | "redLight" | "recipeVego" | "recipeLactose" | "recipeGluten" | "lightest" | "mediumDark" | "darker" | "darkest" | "buttonGray" | "disabledGray" | "disabledDarkGray" | "placeholder" | "boxShadowActive" | "alertRed" | "alertBlue" | "alertGreen" | "darkOverlay" | "brandBlueHover" | "brandYellowHover" | "brandPrioHover" | "brandBlueActive" | "brandYellowActive" | "brandPrioActive", string>;
+
+export { backgroundColor, color, hoverBackgroundColor, hoverColor };

package/dist/cssUtils/color.css.vanilla.js

@@ -0,0 +1,8 @@
+import './color.css.ts.vanilla.css';
+
+var backgroundColor = { primary: "color_backgroundColor_primary__13rr0b21b", secondary: "color_backgroundColor_secondary__13rr0b21c", brandYellow: "color_backgroundColor_brandYellow__13rr0b21d", brandBlue: "color_backgroundColor_brandBlue__13rr0b21e", brandPurple: "color_backgroundColor_brandPurple__13rr0b21f", brandPrio: "color_backgroundColor_brandPrio__13rr0b21g", yellowLighter: "color_backgroundColor_yellowLighter__13rr0b21h", yellowLight: "color_backgroundColor_yellowLight__13rr0b21i", blueLight: "color_backgroundColor_blueLight__13rr0b21j", blueLighter: "color_backgroundColor_blueLighter__13rr0b21k", blueMedium: "color_backgroundColor_blueMedium__13rr0b21l", greenLight: "color_backgroundColor_greenLight__13rr0b21m", greenMedium: "color_backgroundColor_greenMedium__13rr0b21n", redLight: "color_backgroundColor_redLight__13rr0b21o", recipeVego: "color_backgroundColor_recipeVego__13rr0b21p", recipeLactose: "color_backgroundColor_recipeLactose__13rr0b21q", recipeGluten: "color_backgroundColor_recipeGluten__13rr0b21r", link: "color_backgroundColor_link__13rr0b21s", white: "color_backgroundColor_white__13rr0b21t", black: "color_backgroundColor_black__13rr0b21u", lightest: "color_backgroundColor_lightest__13rr0b21v", lighter: "color_backgroundColor_lighter__13rr0b21w", light: "color_backgroundColor_light__13rr0b21x", medium: "color_backgroundColor_medium__13rr0b21y", mediumDark: "color_backgroundColor_mediumDark__13rr0b21z", dark: "color_backgroundColor_dark__13rr0b220", darker: "color_backgroundColor_darker__13rr0b221", darkest: "color_backgroundColor_darkest__13rr0b222", buttonGray: "color_backgroundColor_buttonGray__13rr0b223", disabledGray: "color_backgroundColor_disabledGray__13rr0b224", disabledDarkGray: "color_backgroundColor_disabledDarkGray__13rr0b225", placeholder: "color_backgroundColor_placeholder__13rr0b226", border: "color_backgroundColor_border__13rr0b227", boxShadow: "color_backgroundColor_boxShadow__13rr0b228", boxShadowActive: "color_backgroundColor_boxShadowActive__13rr0b229", alertRed: "color_backgroundColor_alertRed__13rr0b22a", alertBlue: "color_backgroundColor_alertBlue__13rr0b22b", alertGreen: "color_backgroundColor_alertGreen__13rr0b22c", darkOverlay: "color_backgroundColor_darkOverlay__13rr0b22d", transparent: "color_backgroundColor_transparent__13rr0b22e", brandBlueHover: "color_backgroundColor_brandBlueHover__13rr0b22f", brandYellowHover: "color_backgroundColor_brandYellowHover__13rr0b22g", brandPrioHover: "color_backgroundColor_brandPrioHover__13rr0b22h", brandBlueActive: "color_backgroundColor_brandBlueActive__13rr0b22i", brandYellowActive: "color_backgroundColor_brandYellowActive__13rr0b22j", brandPrioActive: "color_backgroundColor_brandPrioActive__13rr0b22k", none: "color_backgroundColor_none__13rr0b22l" };
+var color = { primary: "color_color_primary__13rr0b20", secondary: "color_color_secondary__13rr0b21", brandYellow: "color_color_brandYellow__13rr0b22", brandBlue: "color_color_brandBlue__13rr0b23", brandPurple: "color_color_brandPurple__13rr0b24", brandPrio: "color_color_brandPrio__13rr0b25", yellowLighter: "color_color_yellowLighter__13rr0b26", yellowLight: "color_color_yellowLight__13rr0b27", blueLight: "color_color_blueLight__13rr0b28", blueLighter: "color_color_blueLighter__13rr0b29", blueMedium: "color_color_blueMedium__13rr0b2a", greenLight: "color_color_greenLight__13rr0b2b", greenMedium: "color_color_greenMedium__13rr0b2c", redLight: "color_color_redLight__13rr0b2d", recipeVego: "color_color_recipeVego__13rr0b2e", recipeLactose: "color_color_recipeLactose__13rr0b2f", recipeGluten: "color_color_recipeGluten__13rr0b2g", link: "color_color_link__13rr0b2h", white: "color_color_white__13rr0b2i", black: "color_color_black__13rr0b2j", lightest: "color_color_lightest__13rr0b2k", lighter: "color_color_lighter__13rr0b2l", light: "color_color_light__13rr0b2m", medium: "color_color_medium__13rr0b2n", mediumDark: "color_color_mediumDark__13rr0b2o", dark: "color_color_dark__13rr0b2p", darker: "color_color_darker__13rr0b2q", darkest: "color_color_darkest__13rr0b2r", buttonGray: "color_color_buttonGray__13rr0b2s", disabledGray: "color_color_disabledGray__13rr0b2t", disabledDarkGray: "color_color_disabledDarkGray__13rr0b2u", placeholder: "color_color_placeholder__13rr0b2v", border: "color_color_border__13rr0b2w", boxShadow: "color_color_boxShadow__13rr0b2x", boxShadowActive: "color_color_boxShadowActive__13rr0b2y", alertRed: "color_color_alertRed__13rr0b2z", alertBlue: "color_color_alertBlue__13rr0b210", alertGreen: "color_color_alertGreen__13rr0b211", darkOverlay: "color_color_darkOverlay__13rr0b212", transparent: "color_color_transparent__13rr0b213", brandBlueHover: "color_color_brandBlueHover__13rr0b214", brandYellowHover: "color_color_brandYellowHover__13rr0b215", brandPrioHover: "color_color_brandPrioHover__13rr0b216", brandBlueActive: "color_color_brandBlueActive__13rr0b217", brandYellowActive: "color_color_brandYellowActive__13rr0b218", brandPrioActive: "color_color_brandPrioActive__13rr0b219", none: "color_color_none__13rr0b21a" };
+var hoverBackgroundColor = { primary: "color_hoverBackgroundColor_primary__13rr0b23x", secondary: "color_hoverBackgroundColor_secondary__13rr0b23y", brandYellow: "color_hoverBackgroundColor_brandYellow__13rr0b23z", brandBlue: "color_hoverBackgroundColor_brandBlue__13rr0b240", brandPurple: "color_hoverBackgroundColor_brandPurple__13rr0b241", brandPrio: "color_hoverBackgroundColor_brandPrio__13rr0b242", yellowLighter: "color_hoverBackgroundColor_yellowLighter__13rr0b243", yellowLight: "color_hoverBackgroundColor_yellowLight__13rr0b244", blueLight: "color_hoverBackgroundColor_blueLight__13rr0b245", blueLighter: "color_hoverBackgroundColor_blueLighter__13rr0b246", blueMedium: "color_hoverBackgroundColor_blueMedium__13rr0b247", greenLight: "color_hoverBackgroundColor_greenLight__13rr0b248", greenMedium: "color_hoverBackgroundColor_greenMedium__13rr0b249", redLight: "color_hoverBackgroundColor_redLight__13rr0b24a", recipeVego: "color_hoverBackgroundColor_recipeVego__13rr0b24b", recipeLactose: "color_hoverBackgroundColor_recipeLactose__13rr0b24c", recipeGluten: "color_hoverBackgroundColor_recipeGluten__13rr0b24d", link: "color_hoverBackgroundColor_link__13rr0b24e", white: "color_hoverBackgroundColor_white__13rr0b24f", black: "color_hoverBackgroundColor_black__13rr0b24g", lightest: "color_hoverBackgroundColor_lightest__13rr0b24h", lighter: "color_hoverBackgroundColor_lighter__13rr0b24i", light: "color_hoverBackgroundColor_light__13rr0b24j", medium: "color_hoverBackgroundColor_medium__13rr0b24k", mediumDark: "color_hoverBackgroundColor_mediumDark__13rr0b24l", dark: "color_hoverBackgroundColor_dark__13rr0b24m", darker: "color_hoverBackgroundColor_darker__13rr0b24n", darkest: "color_hoverBackgroundColor_darkest__13rr0b24o", buttonGray: "color_hoverBackgroundColor_buttonGray__13rr0b24p", disabledGray: "color_hoverBackgroundColor_disabledGray__13rr0b24q", disabledDarkGray: "color_hoverBackgroundColor_disabledDarkGray__13rr0b24r", placeholder: "color_hoverBackgroundColor_placeholder__13rr0b24s", border: "color_hoverBackgroundColor_border__13rr0b24t", boxShadow: "color_hoverBackgroundColor_boxShadow__13rr0b24u", boxShadowActive: "color_hoverBackgroundColor_boxShadowActive__13rr0b24v", alertRed: "color_hoverBackgroundColor_alertRed__13rr0b24w", alertBlue: "color_hoverBackgroundColor_alertBlue__13rr0b24x", alertGreen: "color_hoverBackgroundColor_alertGreen__13rr0b24y", darkOverlay: "color_hoverBackgroundColor_darkOverlay__13rr0b24z", transparent: "color_hoverBackgroundColor_transparent__13rr0b250", brandBlueHover: "color_hoverBackgroundColor_brandBlueHover__13rr0b251", brandYellowHover: "color_hoverBackgroundColor_brandYellowHover__13rr0b252", brandPrioHover: "color_hoverBackgroundColor_brandPrioHover__13rr0b253", brandBlueActive: "color_hoverBackgroundColor_brandBlueActive__13rr0b254", brandYellowActive: "color_hoverBackgroundColor_brandYellowActive__13rr0b255", brandPrioActive: "color_hoverBackgroundColor_brandPrioActive__13rr0b256", none: "color_hoverBackgroundColor_none__13rr0b257" };
+var hoverColor = { primary: "color_hoverColor_primary__13rr0b22m", secondary: "color_hoverColor_secondary__13rr0b22n", brandYellow: "color_hoverColor_brandYellow__13rr0b22o", brandBlue: "color_hoverColor_brandBlue__13rr0b22p", brandPurple: "color_hoverColor_brandPurple__13rr0b22q", brandPrio: "color_hoverColor_brandPrio__13rr0b22r", yellowLighter: "color_hoverColor_yellowLighter__13rr0b22s", yellowLight: "color_hoverColor_yellowLight__13rr0b22t", blueLight: "color_hoverColor_blueLight__13rr0b22u", blueLighter: "color_hoverColor_blueLighter__13rr0b22v", blueMedium: "color_hoverColor_blueMedium__13rr0b22w", greenLight: "color_hoverColor_greenLight__13rr0b22x", greenMedium: "color_hoverColor_greenMedium__13rr0b22y", redLight: "color_hoverColor_redLight__13rr0b22z", recipeVego: "color_hoverColor_recipeVego__13rr0b230", recipeLactose: "color_hoverColor_recipeLactose__13rr0b231", recipeGluten: "color_hoverColor_recipeGluten__13rr0b232", link: "color_hoverColor_link__13rr0b233", white: "color_hoverColor_white__13rr0b234", black: "color_hoverColor_black__13rr0b235", lightest: "color_hoverColor_lightest__13rr0b236", lighter: "color_hoverColor_lighter__13rr0b237", light: "color_hoverColor_light__13rr0b238", medium: "color_hoverColor_medium__13rr0b239", mediumDark: "color_hoverColor_mediumDark__13rr0b23a", dark: "color_hoverColor_dark__13rr0b23b", darker: "color_hoverColor_darker__13rr0b23c", darkest: "color_hoverColor_darkest__13rr0b23d", buttonGray: "color_hoverColor_buttonGray__13rr0b23e", disabledGray: "color_hoverColor_disabledGray__13rr0b23f", disabledDarkGray: "color_hoverColor_disabledDarkGray__13rr0b23g", placeholder: "color_hoverColor_placeholder__13rr0b23h", border: "color_hoverColor_border__13rr0b23i", boxShadow: "color_hoverColor_boxShadow__13rr0b23j", boxShadowActive: "color_hoverColor_boxShadowActive__13rr0b23k", alertRed: "color_hoverColor_alertRed__13rr0b23l", alertBlue: "color_hoverColor_alertBlue__13rr0b23m", alertGreen: "color_hoverColor_alertGreen__13rr0b23n", darkOverlay: "color_hoverColor_darkOverlay__13rr0b23o", transparent: "color_hoverColor_transparent__13rr0b23p", brandBlueHover: "color_hoverColor_brandBlueHover__13rr0b23q", brandYellowHover: "color_hoverColor_brandYellowHover__13rr0b23r", brandPrioHover: "color_hoverColor_brandPrioHover__13rr0b23s", brandBlueActive: "color_hoverColor_brandBlueActive__13rr0b23t", brandYellowActive: "color_hoverColor_brandYellowActive__13rr0b23u", brandPrioActive: "color_hoverColor_brandPrioActive__13rr0b23v", none: "color_hoverColor_none__13rr0b23w" };
+
+export { backgroundColor, color, hoverBackgroundColor, hoverColor };

package/dist/cssUtils/spacings.css.d.ts

@@ -0,0 +1,9 @@
+declare const margin: Record<"false" | "xs" | "xxxs" | "xxs" | "xxs2" | "xs2" | "sm" | "sm2" | "md" | "lg" | "xl" | "xxl", string>;
+declare const marginHorizontal: Record<"false" | "xs" | "xxxs" | "xxs" | "xxs2" | "xs2" | "sm" | "sm2" | "md" | "lg" | "xl" | "xxl", string>;
+declare const marginVertical: Record<"false" | "xs" | "xxxs" | "xxs" | "xxs2" | "xs2" | "sm" | "sm2" | "md" | "lg" | "xl" | "xxl", string>;
+declare const marginBottomDynamic: Record<"false" | "xs" | "xxxs" | "xxs" | "xxs2" | "xs2" | "sm" | "sm2" | "md" | "lg" | "xl" | "xxl", string>;
+declare const padding: Record<"false" | "xs" | "xxxs" | "xxs" | "xxs2" | "xs2" | "sm" | "sm2" | "md" | "lg" | "xl" | "xxl", string>;
+declare const paddingHorizontal: Record<"false" | "xs" | "xxxs" | "xxs" | "xxs2" | "xs2" | "sm" | "sm2" | "md" | "lg" | "xl" | "xxl", string>;
+declare const paddingVertical: Record<"false" | "xs" | "xxxs" | "xxs" | "xxs2" | "xs2" | "sm" | "sm2" | "md" | "lg" | "xl" | "xxl", string>;
+
+export { margin, marginBottomDynamic, marginHorizontal, marginVertical, padding, paddingHorizontal, paddingVertical };

package/dist/cssUtils/spacings.css.ts.vanilla.css

@@ -610,72 +610,6 @@
   padding-bottom: 0px;
   padding-top: 0px;
 }
-.spacings_spacingsToCssMapper_xxxs__e0awtz2c {
-  height: 2px;
-}
-.spacings_spacingsToCssMapper_xxs__e0awtz2d {
-  height: 4px;
-}
-.spacings_spacingsToCssMapper_xxs2__e0awtz2e {
-  height: 6px;
-}
-.spacings_spacingsToCssMapper_xs__e0awtz2f {
-  height: 8px;
-}
-.spacings_spacingsToCssMapper_xs2__e0awtz2g {
-  height: 12px;
-}
-.spacings_spacingsToCssMapper_sm__e0awtz2h {
-  height: 16px;
-}
-.spacings_spacingsToCssMapper_sm2__e0awtz2i {
-  height: 20px;
-}
-.spacings_spacingsToCssMapper_md__e0awtz2j {
-  height: 24px;
-}
-.spacings_spacingsToCssMapper_lg__e0awtz2k {
-  height: 32px;
-}
-.spacings_spacingsToCssMapper_xl__e0awtz2l {
-  height: 40px;
-}
-.spacings_spacingsToCssMapper_xxl__e0awtz2m {
-  height: 56px;
-}
-.spacings_spacingsToCssMapper_xxxs__e0awtz2n {
-  width: 2px;
-}
-.spacings_spacingsToCssMapper_xxs__e0awtz2o {
-  width: 4px;
-}
-.spacings_spacingsToCssMapper_xxs2__e0awtz2p {
-  width: 6px;
-}
-.spacings_spacingsToCssMapper_xs__e0awtz2q {
-  width: 8px;
-}
-.spacings_spacingsToCssMapper_xs2__e0awtz2r {
-  width: 12px;
-}
-.spacings_spacingsToCssMapper_sm__e0awtz2s {
-  width: 16px;
-}
-.spacings_spacingsToCssMapper_sm2__e0awtz2t {
-  width: 20px;
-}
-.spacings_spacingsToCssMapper_md__e0awtz2u {
-  width: 24px;
-}
-.spacings_spacingsToCssMapper_lg__e0awtz2v {
-  width: 32px;
-}
-.spacings_spacingsToCssMapper_xl__e0awtz2w {
-  width: 40px;
-}
-.spacings_spacingsToCssMapper_xxl__e0awtz2x {
-  width: 56px;
-}
 @media  (min-width: 960px) {
   .spacings_margin_xxxs__e0awtz0 {
     margin: 2px;

package/dist/cssUtils/spacings.css.vanilla.js

@@ -0,0 +1,11 @@
+import './spacings.css.ts.vanilla.css';
+
+var margin = { xxxs: "spacings_margin_xxxs__e0awtz0", xxs: "spacings_margin_xxs__e0awtz1", xxs2: "spacings_margin_xxs2__e0awtz2", xs: "spacings_margin_xs__e0awtz3", xs2: "spacings_margin_xs2__e0awtz4", sm: "spacings_margin_sm__e0awtz5", sm2: "spacings_margin_sm2__e0awtz6", md: "spacings_margin_md__e0awtz7", lg: "spacings_margin_lg__e0awtz8", xl: "spacings_margin_xl__e0awtz9", xxl: "spacings_margin_xxl__e0awtza", false: "spacings_margin_false__e0awtzb" };
+var marginBottomDynamic = { xxxs: "spacings_marginBottomDynamic_xxxs__e0awtz10", xxs: "spacings_marginBottomDynamic_xxs__e0awtz11", xxs2: "spacings_marginBottomDynamic_xxs2__e0awtz12", xs: "spacings_marginBottomDynamic_xs__e0awtz13", xs2: "spacings_marginBottomDynamic_xs2__e0awtz14", sm: "spacings_marginBottomDynamic_sm__e0awtz15", sm2: "spacings_marginBottomDynamic_sm2__e0awtz16", md: "spacings_marginBottomDynamic_md__e0awtz17", lg: "spacings_marginBottomDynamic_lg__e0awtz18", xl: "spacings_marginBottomDynamic_xl__e0awtz19", xxl: "spacings_marginBottomDynamic_xxl__e0awtz1a", false: "spacings_marginBottomDynamic_false__e0awtz1b" };
+var marginHorizontal = { xxxs: "spacings_marginHorizontal_xxxs__e0awtzc", xxs: "spacings_marginHorizontal_xxs__e0awtzd", xxs2: "spacings_marginHorizontal_xxs2__e0awtze", xs: "spacings_marginHorizontal_xs__e0awtzf", xs2: "spacings_marginHorizontal_xs2__e0awtzg", sm: "spacings_marginHorizontal_sm__e0awtzh", sm2: "spacings_marginHorizontal_sm2__e0awtzi", md: "spacings_marginHorizontal_md__e0awtzj", lg: "spacings_marginHorizontal_lg__e0awtzk", xl: "spacings_marginHorizontal_xl__e0awtzl", xxl: "spacings_marginHorizontal_xxl__e0awtzm", false: "spacings_marginHorizontal_false__e0awtzn" };
+var marginVertical = { xxxs: "spacings_marginVertical_xxxs__e0awtzo", xxs: "spacings_marginVertical_xxs__e0awtzp", xxs2: "spacings_marginVertical_xxs2__e0awtzq", xs: "spacings_marginVertical_xs__e0awtzr", xs2: "spacings_marginVertical_xs2__e0awtzs", sm: "spacings_marginVertical_sm__e0awtzt", sm2: "spacings_marginVertical_sm2__e0awtzu", md: "spacings_marginVertical_md__e0awtzv", lg: "spacings_marginVertical_lg__e0awtzw", xl: "spacings_marginVertical_xl__e0awtzx", xxl: "spacings_marginVertical_xxl__e0awtzy", false: "spacings_marginVertical_false__e0awtzz" };
+var padding = { xxxs: "spacings_padding_xxxs__e0awtz1c", xxs: "spacings_padding_xxs__e0awtz1d", xxs2: "spacings_padding_xxs2__e0awtz1e", xs: "spacings_padding_xs__e0awtz1f", xs2: "spacings_padding_xs2__e0awtz1g", sm: "spacings_padding_sm__e0awtz1h", sm2: "spacings_padding_sm2__e0awtz1i", md: "spacings_padding_md__e0awtz1j", lg: "spacings_padding_lg__e0awtz1k", xl: "spacings_padding_xl__e0awtz1l", xxl: "spacings_padding_xxl__e0awtz1m", false: "spacings_padding_false__e0awtz1n" };
+var paddingHorizontal = { xxxs: "spacings_paddingHorizontal_xxxs__e0awtz1o", xxs: "spacings_paddingHorizontal_xxs__e0awtz1p", xxs2: "spacings_paddingHorizontal_xxs2__e0awtz1q", xs: "spacings_paddingHorizontal_xs__e0awtz1r", xs2: "spacings_paddingHorizontal_xs2__e0awtz1s", sm: "spacings_paddingHorizontal_sm__e0awtz1t", sm2: "spacings_paddingHorizontal_sm2__e0awtz1u", md: "spacings_paddingHorizontal_md__e0awtz1v", lg: "spacings_paddingHorizontal_lg__e0awtz1w", xl: "spacings_paddingHorizontal_xl__e0awtz1x", xxl: "spacings_paddingHorizontal_xxl__e0awtz1y", false: "spacings_paddingHorizontal_false__e0awtz1z" };
+var paddingVertical = { xxxs: "spacings_paddingVertical_xxxs__e0awtz20", xxs: "spacings_paddingVertical_xxs__e0awtz21", xxs2: "spacings_paddingVertical_xxs2__e0awtz22", xs: "spacings_paddingVertical_xs__e0awtz23", xs2: "spacings_paddingVertical_xs2__e0awtz24", sm: "spacings_paddingVertical_sm__e0awtz25", sm2: "spacings_paddingVertical_sm2__e0awtz26", md: "spacings_paddingVertical_md__e0awtz27", lg: "spacings_paddingVertical_lg__e0awtz28", xl: "spacings_paddingVertical_xl__e0awtz29", xxl: "spacings_paddingVertical_xxl__e0awtz2a", false: "spacings_paddingVertical_false__e0awtz2b" };
+
+export { margin, marginBottomDynamic, marginHorizontal, marginVertical, padding, paddingHorizontal, paddingVertical };

package/dist/cssUtils/typography.css.d.ts

@@ -0,0 +1,5 @@
+declare type TTextDecoration = 'underline' | 'lineThrough';
+declare type TTextAlign = 'center' | 'left' | 'right';
+declare type TBodyTextSizeKeys = 'tiny' | 'extraSmall' | 'small' | 'default';
+
+export { TBodyTextSizeKeys, TTextAlign, TTextDecoration };

package/dist/cssUtils/typography.css.ts.vanilla.css

@@ -0,0 +1,100 @@
+.typography_fontFamily_primary__xithyt0 {
+  font-family: "Poppins", "Helvetica Neue", Helvetica, Arial, sans-serif;
+}
+.typography_fontFamily_display__xithyt1 {
+  font-family: "Dom Casual";
+}
+.typography_fontFamily_code__xithyt2 {
+  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
+}
+.typography_fontSize_xs__xithyt3 {
+  font-size: 10px;
+}
+.typography_fontSize_s1__xithyt4 {
+  font-size: 12px;
+}
+.typography_fontSize_s2__xithyt5 {
+  font-size: 13px;
+}
+.typography_fontSize_s3__xithyt6 {
+  font-size: 15px;
+}
+.typography_fontSize_s4__xithyt7 {
+  font-size: 18px;
+}
+.typography_fontSize_m1__xithyt8 {
+  font-size: 24px;
+}
+.typography_fontSize_m2__xithyt9 {
+  font-size: 30px;
+}
+.typography_fontSize_l1__xithyta {
+  font-size: 41px;
+}
+.typography_fontSize_code__xithytb {
+  font-size: 90px;
+}
+.typography_fontWeight_regular__xithytc {
+  font-weight: 400;
+}
+.typography_fontWeight_medium__xithytd {
+  font-weight: 500;
+}
+.typography_fontWeight_semiBold__xithyte {
+  font-weight: 600;
+}
+.typography_fontWeight_bold__xithytf {
+  font-weight: 700;
+}
+.typography_lineHeight_xs__xithytg {
+  line-height: 15px;
+}
+.typography_lineHeight_s1__xithyth {
+  line-height: 18px;
+}
+.typography_lineHeight_s2__xithyti {
+  line-height: 19px;
+}
+.typography_lineHeight_m1__xithytj {
+  line-height: 22px;
+}
+.typography_lineHeight_m2__xithytk {
+  line-height: 27px;
+}
+.typography_lineHeight_m3__xithytl {
+  line-height: 36px;
+}
+.typography_lineHeight_l1__xithytm {
+  line-height: 45px;
+}
+.typography_textAlign_left__xithytn {
+  text-align: left;
+}
+.typography_textAlign_right__xithyto {
+  text-align: right;
+}
+.typography_textAlign_center__xithytp {
+  text-align: center;
+}
+.typography_textDecoration_lineThrough__xithytq {
+  text-decoration: line-through;
+}
+.typography_textDecoration_underline__xithytr {
+  text-decoration: underline;
+}
+.typography_bodyTextSize_tiny__xithyts {
+  font-size: 10px;
+  line-height: 15px;
+}
+.typography_bodyTextSize_extraSmall__xithytt {
+  font-size: 13px;
+  line-height: 19px;
+}
+.typography_bodyTextSize_small__xithytu {
+  font-size: 12px;
+  line-height: 18px;
+}
+.typography_bodyTextSize_default__xithytv {
+  font-size: 15px;
+  line-height: 22px;
+}

package/dist/index.d.ts

@@ -1,2 +1,17 @@
-export { default as Box } from './components/Box/Box.js';
-export { default as AlertBox } from './components/AlertBox/AlertBox.js';
+export { Box, TBox } from './components/Box/Box.js';
+export { AlertBox, TAlertBox } from './components/AlertBox/AlertBox.js';
+export { CartItemSummary, TCartItemSummary, TSummaryItem } from './components/CartItemSummary/CartItemSummary.js';
+export { Divider, TDivider } from './components/Divider/Divider.js';
+export { Dot, TDot } from './components/Dot/Dot.js';
+export { FormControl, TFormControl, TScreenWidth } from './components/FormControl/FormControl.js';
+export { Input, TInput } from './components/Input/Input.js';
+export { EListItemAlignment, ListItem, TItem, TListItem } from './components/ListItem/ListItem.js';
+export { TSkeleton } from './components/Skeleton/Skeleton.js';
+export { Spacer, TSpacer } from './components/Spacer/Spacer.js';
+export { Spinner, TSpinner } from './components/Spinner/Spinner.js';
+export { TTimeline, TTimelineItem, Timeline } from './components/TimeLine/TimeLine.js';
+export { BodyText, TBodyText } from './typography/BodyText/BodyText.js';
+export { borderColor, borderRadius } from './cssUtils/border.css.js';
+export { backgroundColor, color, hoverBackgroundColor, hoverColor } from './cssUtils/color.css.js';
+export { margin, marginBottomDynamic, marginHorizontal, marginVertical, padding, paddingHorizontal, paddingVertical } from './cssUtils/spacings.css.js';
+export { CartSummary, TCartSummary } from './components/CartSummary/CartSummary.js';

package/dist/index.js

@@ -1,2 +1,20 @@
-export { default as Box } from './components/Box/Box.js';
-export { default as AlertBox } from './components/AlertBox/AlertBox.js';
+export { Box } from './components/Box/Box.js';
+export { AlertBox } from './components/AlertBox/AlertBox.js';
+import '@citygross/icons_v2';
+import 'react';
+import './components/BoxArrow/BoxArrow.css.vanilla.js';
+export { CartItemSummary } from './components/CartItemSummary/CartItemSummary.js';
+export { Divider } from './components/Divider/Divider.js';
+export { Dot } from './components/Dot/Dot.js';
+export { FormControl, TScreenWidth } from './components/FormControl/FormControl.js';
+export { Input } from './components/Input/Input.js';
+export { EListItemAlignment, ListItem } from './components/ListItem/ListItem.js';
+import './components/Skeleton/Skeleton.css.vanilla.js';
+export { Spacer } from './components/Spacer/Spacer.js';
+export { Spinner } from './components/Spinner/Spinner.js';
+export { Timeline } from './components/TimeLine/TimeLine.js';
+export { BodyText } from './typography/BodyText/BodyText.js';
+export { borderColor, borderRadius } from './cssUtils/border.css.vanilla.js';
+export { backgroundColor, color, hoverBackgroundColor, hoverColor } from './cssUtils/color.css.vanilla.js';
+export { margin, marginBottomDynamic, marginHorizontal, marginVertical, padding, paddingHorizontal, paddingVertical } from './cssUtils/spacings.css.vanilla.js';
+export { CartSummary } from './components/CartSummary/CartSummary.js';

package/dist/typography/BodyText/BodyText.css.vanilla.js

@@ -0,0 +1,8 @@
+import './../../cssUtils/typography.css.ts.vanilla.css';
+import './../../cssUtils/color.css.ts.vanilla.css';
+import 'src/typography/BodyText/BodyText.css.ts.vanilla.css';
+import { createRuntimeFn } from '@vanilla-extract/recipes/createRuntimeFn';
+
+var bodyTextStyle = createRuntimeFn({ defaultClassName: "BodyText__1lpefp40", variantClassNames: { fontWeight: { regular: "typography_fontWeight_regular__xithytc", medium: "typography_fontWeight_medium__xithytd", semiBold: "typography_fontWeight_semiBold__xithyte", bold: "typography_fontWeight_bold__xithytf" }, textDecoration: { lineThrough: "typography_textDecoration_lineThrough__xithytq", underline: "typography_textDecoration_underline__xithytr" }, bodyTextSize: { tiny: "typography_bodyTextSize_tiny__xithyts", extraSmall: "typography_bodyTextSize_extraSmall__xithytt", small: "typography_bodyTextSize_small__xithytu", "default": "typography_bodyTextSize_default__xithytv" }, textAlign: { left: "typography_textAlign_left__xithytn", right: "typography_textAlign_right__xithyto", center: "typography_textAlign_center__xithytp" }, color: { primary: "color_color_primary__13rr0b20", secondary: "color_color_secondary__13rr0b21", brandYellow: "color_color_brandYellow__13rr0b22", brandBlue: "color_color_brandBlue__13rr0b23", brandPurple: "color_color_brandPurple__13rr0b24", brandPrio: "color_color_brandPrio__13rr0b25", yellowLighter: "color_color_yellowLighter__13rr0b26", yellowLight: "color_color_yellowLight__13rr0b27", blueLight: "color_color_blueLight__13rr0b28", blueLighter: "color_color_blueLighter__13rr0b29", blueMedium: "color_color_blueMedium__13rr0b2a", greenLight: "color_color_greenLight__13rr0b2b", greenMedium: "color_color_greenMedium__13rr0b2c", redLight: "color_color_redLight__13rr0b2d", recipeVego: "color_color_recipeVego__13rr0b2e", recipeLactose: "color_color_recipeLactose__13rr0b2f", recipeGluten: "color_color_recipeGluten__13rr0b2g", link: "color_color_link__13rr0b2h", white: "color_color_white__13rr0b2i", black: "color_color_black__13rr0b2j", lightest: "color_color_lightest__13rr0b2k", lighter: "color_color_lighter__13rr0b2l", light: "color_color_light__13rr0b2m", medium: "color_color_medium__13rr0b2n", mediumDark: "color_color_mediumDark__13rr0b2o", dark: "color_color_dark__13rr0b2p", darker: "color_color_darker__13rr0b2q", darkest: "color_color_darkest__13rr0b2r", buttonGray: "color_color_buttonGray__13rr0b2s", disabledGray: "color_color_disabledGray__13rr0b2t", disabledDarkGray: "color_color_disabledDarkGray__13rr0b2u", placeholder: "color_color_placeholder__13rr0b2v", border: "color_color_border__13rr0b2w", boxShadow: "color_color_boxShadow__13rr0b2x", boxShadowActive: "color_color_boxShadowActive__13rr0b2y", alertRed: "color_color_alertRed__13rr0b2z", alertBlue: "color_color_alertBlue__13rr0b210", alertGreen: "color_color_alertGreen__13rr0b211", darkOverlay: "color_color_darkOverlay__13rr0b212", transparent: "color_color_transparent__13rr0b213", brandBlueHover: "color_color_brandBlueHover__13rr0b214", brandYellowHover: "color_color_brandYellowHover__13rr0b215", brandPrioHover: "color_color_brandPrioHover__13rr0b216", brandBlueActive: "color_color_brandBlueActive__13rr0b217", brandYellowActive: "color_color_brandYellowActive__13rr0b218", brandPrioActive: "color_color_brandPrioActive__13rr0b219", none: "color_color_none__13rr0b21a" } }, defaultVariants: { color: "darkest", fontWeight: "regular", bodyTextSize: "default", textAlign: "left" }, compoundVariants: [] });
+
+export { bodyTextStyle };

package/dist/typography/BodyText/BodyText.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import { TPaletteKeys, TFontWeightKeys } from '@citygross/design-tokens_v2';
+import { TBodyTextSizeKeys, TTextDecoration, TTextAlign } from '../../cssUtils/typography.css.js';
+
+declare type TBodyText = {
+    children: React.ReactNode;
+    size?: TBodyTextSizeKeys;
+    color?: TPaletteKeys;
+    textDecoration?: TTextDecoration;
+    fontWeight?: TFontWeightKeys;
+    textAlign?: TTextAlign;
+    className?: string;
+};
+declare const BodyText: ({ children, color, fontWeight, textDecoration, size, textAlign, className }: TBodyText) => JSX.Element;
+
+export { BodyText, TBodyText };

package/dist/typography/BodyText/BodyText.js

@@ -0,0 +1,28 @@
+import React from 'react';
+import { bodyTextStyle } from './BodyText.css.vanilla.js';
+
+const BodyText = ({
+  children,
+  color,
+  fontWeight,
+  textDecoration,
+  size,
+  textAlign,
+  className
+}) => {
+  return /* @__PURE__ */ React.createElement(
+    "p",
+    {
+      className: `${bodyTextStyle({
+        bodyTextSize: size,
+        color,
+        textDecoration,
+        textAlign,
+        fontWeight
+      })} ${className}`
+    },
+    children
+  );
+};
+
+export { BodyText };

package/dist/typography/H3/H3.css.ts.vanilla.css

@@ -0,0 +1,4 @@
+.H3_H3Styles__170fb7l0 {
+  font-size: 15px;
+  line-height: 22px;
+}

package/dist/typography/H3/H3.css.vanilla.js

@@ -0,0 +1,8 @@
+import './../../cssUtils/typography.css.ts.vanilla.css';
+import './../../cssUtils/color.css.ts.vanilla.css';
+import './H3.css.ts.vanilla.css';
+import { createRuntimeFn } from '@vanilla-extract/recipes/createRuntimeFn';
+
+var H3Styles = createRuntimeFn({ defaultClassName: "H3_H3Styles__170fb7l0", variantClassNames: { color: { primary: "color_color_primary__13rr0b20", secondary: "color_color_secondary__13rr0b21", brandYellow: "color_color_brandYellow__13rr0b22", brandBlue: "color_color_brandBlue__13rr0b23", brandPurple: "color_color_brandPurple__13rr0b24", brandPrio: "color_color_brandPrio__13rr0b25", yellowLighter: "color_color_yellowLighter__13rr0b26", yellowLight: "color_color_yellowLight__13rr0b27", blueLight: "color_color_blueLight__13rr0b28", blueLighter: "color_color_blueLighter__13rr0b29", blueMedium: "color_color_blueMedium__13rr0b2a", greenLight: "color_color_greenLight__13rr0b2b", greenMedium: "color_color_greenMedium__13rr0b2c", redLight: "color_color_redLight__13rr0b2d", recipeVego: "color_color_recipeVego__13rr0b2e", recipeLactose: "color_color_recipeLactose__13rr0b2f", recipeGluten: "color_color_recipeGluten__13rr0b2g", link: "color_color_link__13rr0b2h", white: "color_color_white__13rr0b2i", black: "color_color_black__13rr0b2j", lightest: "color_color_lightest__13rr0b2k", lighter: "color_color_lighter__13rr0b2l", light: "color_color_light__13rr0b2m", medium: "color_color_medium__13rr0b2n", mediumDark: "color_color_mediumDark__13rr0b2o", dark: "color_color_dark__13rr0b2p", darker: "color_color_darker__13rr0b2q", darkest: "color_color_darkest__13rr0b2r", buttonGray: "color_color_buttonGray__13rr0b2s", disabledGray: "color_color_disabledGray__13rr0b2t", disabledDarkGray: "color_color_disabledDarkGray__13rr0b2u", placeholder: "color_color_placeholder__13rr0b2v", border: "color_color_border__13rr0b2w", boxShadow: "color_color_boxShadow__13rr0b2x", boxShadowActive: "color_color_boxShadowActive__13rr0b2y", alertRed: "color_color_alertRed__13rr0b2z", alertBlue: "color_color_alertBlue__13rr0b210", alertGreen: "color_color_alertGreen__13rr0b211", darkOverlay: "color_color_darkOverlay__13rr0b212", transparent: "color_color_transparent__13rr0b213", brandBlueHover: "color_color_brandBlueHover__13rr0b214", brandYellowHover: "color_color_brandYellowHover__13rr0b215", brandPrioHover: "color_color_brandPrioHover__13rr0b216", brandBlueActive: "color_color_brandBlueActive__13rr0b217", brandYellowActive: "color_color_brandYellowActive__13rr0b218", brandPrioActive: "color_color_brandPrioActive__13rr0b219", none: "color_color_none__13rr0b21a" }, textDecoration: { lineThrough: "typography_textDecoration_lineThrough__xithytq", underline: "typography_textDecoration_underline__xithytr" }, fontWeight: { regular: "typography_fontWeight_regular__xithytc", medium: "typography_fontWeight_medium__xithytd", semiBold: "typography_fontWeight_semiBold__xithyte", bold: "typography_fontWeight_bold__xithytf" } }, defaultVariants: { color: "darkest", fontWeight: "medium" }, compoundVariants: [] });
+
+export { H3Styles };

package/dist/typography/H3/H3.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import { H3Styles } from './H3.css.vanilla.js';
+
+const H3 = ({
+  children,
+  className,
+  color,
+  fontWeight,
+  lineThrough
+}) => {
+  return /* @__PURE__ */ React.createElement(
+    "h3",
+    {
+      className: `${H3Styles({
+        color,
+        textDecoration: lineThrough ? "lineThrough" : null,
+        fontWeight
+      })} ${className}`
+    },
+    children
+  );
+};
+
+export { H3 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@citygross/components_v2",
-  "version": "0.0.12",
+  "version": "0.0.14",
   "license": "ISC",
   "sideEffects": false,
   "main": "./dist/index.js",
@@ -79,5 +79,5 @@
     "react-slick": "^0.30.1",
     "slick-carousel": "^1.8.1"
   },
-  "gitHead": "ebe0f7c5a4eafaaf1c762918a00e3976da708aa5"
+  "gitHead": "258b63dd1593300b5dfaaecbf85751de4ea90d58"
 }