@citygross/components_v2 0.0.4 → 0.0.6

package/dist/components/Box/Box.css.ts.vanilla.css

@@ -0,0 +1,13 @@
+.Box_BoxStyle__inom6d0 {
+  border-width: 10px;
+  border-style: solid;
+}
+.Box_BoxStyle_size_small__inom6d1 {
+  padding: 101px;
+}
+.Box_BoxStyle_size_large__inom6d2 {
+  padding: 303px;
+}
+.Box_BoxStyle_size_false__inom6d3 {
+  padding: 0;
+}

package/dist/components/Box/Box.css.vanilla.js

@@ -0,0 +1,9 @@
+import './../../cssUtils/color.css.ts.vanilla.css';
+import './../../cssUtils/border.css.ts.vanilla.css';
+import './../../cssUtils/spacings.css.ts.vanilla.css';
+import './Box.css.ts.vanilla.css';
+import { createRuntimeFn } from '@vanilla-extract/recipes/createRuntimeFn';
+
+var BoxStyle = createRuntimeFn({ defaultClassName: "Box_BoxStyle__inom6d0", variantClassNames: { size: { small: "Box_BoxStyle_size_small__inom6d1", large: "Box_BoxStyle_size_large__inom6d2", false: "Box_BoxStyle_size_false__inom6d3" }, 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" }, 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" }, 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" }, 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" }, padding: { xxxs: "spacings_padding_xxxs__e0awtz10", xxs: "spacings_padding_xxs__e0awtz11", xxs2: "spacings_padding_xxs2__e0awtz12", xs: "spacings_padding_xs__e0awtz13", xs2: "spacings_padding_xs2__e0awtz14", sm: "spacings_padding_sm__e0awtz15", sm2: "spacings_padding_sm2__e0awtz16", md: "spacings_padding_md__e0awtz17", lg: "spacings_padding_lg__e0awtz18", xl: "spacings_padding_xl__e0awtz19", xxl: "spacings_padding_xxl__e0awtz1a", false: "spacings_padding_false__e0awtz1b" }, 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" } }, defaultVariants: {}, compoundVariants: [] });
+
+export { BoxStyle };

package/dist/components/Box/Box.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import { TPaletteKeys, TSpacingKeys } from '@citygross/design-tokens_v2';
+
+declare type TBox = {
+    background?: TPaletteKeys;
+    rounded?: boolean;
+    padding?: TSpacingKeys;
+    paddingVertical?: number;
+    children: React.ReactNode;
+    withArrow?: boolean;
+    arrowSpacing?: number;
+    arrowPlacement?: 'left' | 'right';
+};
+declare function Box({ background, padding, children, ...props }: TBox): JSX.Element;
+
+export { Box, TBox };

package/dist/components/Box/Box.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import { BoxStyle } from './Box.css.vanilla.js';
+
+function Box({ background, 
+// rounded = true,
+padding, 
+// arrowSpacing,
+// arrowPlacement,
+// withArrow,
+// paddingVertical,
+children, ...props }) {
+    console.log(background);
+    return /* @__PURE__ */ React.createElement("div", { ...props }, /* @__PURE__ */ React.createElement("div", {
+        className: BoxStyle({
+            backgroundColor: background,
+            // rounded,
+            padding
+            // paddingVertical,
+        })
+    }, children));
+}
+
+export { Box };

package/dist/components/Test/Test.d.ts

@@ -0,0 +1,3 @@
+declare function Test(): JSX.Element;
+
+export { Test };

package/dist/components/Test/Test.js

@@ -0,0 +1,7 @@
+import React from 'react';
+
+function Test() {
+    return /* @__PURE__ */ React.createElement("div", null, "Test");
+}
+
+export { Test };

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

@@ -0,0 +1,162 @@
+.border_borderColor_primary__c3f0gf0 {
+  border-color: #FFE522;
+}
+.border_borderColor_secondary__c3f0gf1 {
+  border-color: #0069AE;
+}
+.border_borderColor_brandYellow__c3f0gf2 {
+  border-color: #FFE522;
+}
+.border_borderColor_brandBlue__c3f0gf3 {
+  border-color: #0069AE;
+}
+.border_borderColor_brandPurple__c3f0gf4 {
+  border-color: #A71680;
+}
+.border_borderColor_brandPrio__c3f0gf5 {
+  border-color: #a80073;
+}
+.border_borderColor_yellowLighter__c3f0gf6 {
+  border-color: #FFFBE7;
+}
+.border_borderColor_yellowLight__c3f0gf7 {
+  border-color: #FFF7D1;
+}
+.border_borderColor_blueLight__c3f0gf8 {
+  border-color: #ECF7FE;
+}
+.border_borderColor_blueLighter__c3f0gf9 {
+  border-color: #D3EDFD;
+}
+.border_borderColor_blueMedium__c3f0gfa {
+  border-color: #92B9D3;
+}
+.border_borderColor_greenLight__c3f0gfb {
+  border-color: #F2FDF2;
+}
+.border_borderColor_greenMedium__c3f0gfc {
+  border-color: #BEE5BE;
+}
+.border_borderColor_redLight__c3f0gfd {
+  border-color: #FCE9E9;
+}
+.border_borderColor_recipeVego__c3f0gfe {
+  border-color: #65DB69;
+}
+.border_borderColor_recipeLactose__c3f0gff {
+  border-color: #8CCDF0;
+}
+.border_borderColor_recipeGluten__c3f0gfg {
+  border-color: #D5642A;
+}
+.border_borderColor_link__c3f0gfh {
+  border-color: #0072BB;
+}
+.border_borderColor_white__c3f0gfi {
+  border-color: #FFFFFF;
+}
+.border_borderColor_black__c3f0gfj {
+  border-color: #000000;
+}
+.border_borderColor_lightest__c3f0gfk {
+  border-color: #F7F7F7;
+}
+.border_borderColor_lighter__c3f0gfl {
+  border-color: #F1F1F1;
+}
+.border_borderColor_light__c3f0gfm {
+  border-color: #E8E8E8;
+}
+.border_borderColor_medium__c3f0gfn {
+  border-color: #DBDBDB;
+}
+.border_borderColor_mediumDark__c3f0gfo {
+  border-color: #6C6C6C;
+}
+.border_borderColor_dark__c3f0gfp {
+  border-color: #979797;
+}
+.border_borderColor_darker__c3f0gfq {
+  border-color: #4A4A4A;
+}
+.border_borderColor_darkest__c3f0gfr {
+  border-color: #333333;
+}
+.border_borderColor_buttonGray__c3f0gfs {
+  border-color: #E5E4E5;
+}
+.border_borderColor_disabledGray__c3f0gft {
+  border-color: #B8B8B8;
+}
+.border_borderColor_disabledDarkGray__c3f0gfu {
+  border-color: #5c5c5c;
+}
+.border_borderColor_placeholder__c3f0gfv {
+  border-color: #8f8f8f;
+}
+.border_borderColor_border__c3f0gfw {
+  border-color: #0069AE;
+}
+.border_borderColor_boxShadow__c3f0gfx {
+  border-color: #E1E1E1;
+}
+.border_borderColor_boxShadowActive__c3f0gfy {
+  border-color: rgba(7, 52, 99, 0.15);
+}
+.border_borderColor_alertRed__c3f0gfz {
+  border-color: #E02721;
+}
+.border_borderColor_alertBlue__c3f0gf10 {
+  border-color: #0072BB;
+}
+.border_borderColor_alertGreen__c3f0gf11 {
+  border-color: #3F9A3C;
+}
+.border_borderColor_darkOverlay__c3f0gf12 {
+  border-color: rgba(0, 0, 0, 0.6);
+}
+.border_borderColor_transparent__c3f0gf13 {
+  border-color: #ffffff00;
+}
+.border_borderColor_brandBlueHover__c3f0gf14 {
+  border-color: #005C99;
+}
+.border_borderColor_brandYellowHover__c3f0gf15 {
+  border-color: #F5D800;
+}
+.border_borderColor_brandPrioHover__c3f0gf16 {
+  border-color: #90136F;
+}
+.border_borderColor_brandBlueActive__c3f0gf17 {
+  border-color: #004D80;
+}
+.border_borderColor_brandYellowActive__c3f0gf18 {
+  border-color: #DBC100;
+}
+.border_borderColor_brandPrioActive__c3f0gf19 {
+  border-color: #7A105E;
+}
+.border_borderColor_none__c3f0gf1a {
+  border-color: none;
+}
+.border_borderRadius_extraSmall__c3f0gf1b {
+  border-radius: 2px;
+}
+.border_borderRadius_small__c3f0gf1c {
+  border-radius: 5px;
+}
+.border_borderRadius_default__c3f0gf1d {
+  border-radius: 10px;
+}
+.border_borderRadius_big__c3f0gf1e {
+  border-radius: 20px;
+}
+.border_borderRadius_bigger__c3f0gf1f {
+  border-radius: 24px;
+}
+.border_borderRadius_large__c3f0gf1g {
+  border-radius: 32px;
+}
+.border_borderRadius_round__c3f0gf1h {
+  border-radius: 100px;
+}