@citygross/components_v2 0.0.11 → 0.0.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (71) hide show
  1. package/dist/components/AlertBox/AlertBox.css.ts.vanilla.css +87 -0
  2. package/dist/components/AlertBox/AlertBox.css.vanilla.js +10 -0
  3. package/dist/components/AlertBox/AlertBox.d.ts +17 -0
  4. package/dist/components/AlertBox/AlertBox.js +38 -0
  5. package/dist/components/Box/Box.js +33 -16
  6. package/dist/components/BoxArrow/BoxArrow.css.ts.vanilla.css +154 -0
  7. package/dist/components/BoxArrow/BoxArrow.css.vanilla.js +6 -0
  8. package/dist/components/BoxArrow/BoxArrow.js +19 -0
  9. package/dist/components/CartItemSummary/CartItemSummary.css.ts.vanilla.css +23 -0
  10. package/dist/components/CartItemSummary/CartItemSummary.css.vanilla.js +8 -0
  11. package/dist/components/CartItemSummary/CartItemSummary.d.ts +15 -0
  12. package/dist/components/CartItemSummary/CartItemSummary.js +31 -0
  13. package/dist/components/CartSummary/CartSummary.css.ts.vanilla.css +34 -0
  14. package/dist/components/CartSummary/CartSummary.css.vanilla.js +11 -0
  15. package/dist/components/CartSummary/CartSummary.d.ts +26 -0
  16. package/dist/components/CartSummary/CartSummary.js +60 -0
  17. package/dist/components/Divider/Divider.css.ts.vanilla.css +6 -0
  18. package/dist/components/Divider/Divider.css.vanilla.js +7 -0
  19. package/dist/components/Divider/Divider.d.ts +9 -0
  20. package/dist/components/Divider/Divider.js +10 -0
  21. package/dist/components/Dot/Dot.css.ts.vanilla.css +8 -0
  22. package/dist/components/Dot/Dot.css.vanilla.js +7 -0
  23. package/dist/components/Dot/Dot.d.ts +9 -0
  24. package/dist/components/Dot/Dot.js +16 -0
  25. package/dist/components/FormControl/FormControl.css.ts.vanilla.css +21 -0
  26. package/dist/components/FormControl/FormControl.css.vanilla.js +7 -0
  27. package/dist/components/FormControl/FormControl.d.ts +17 -0
  28. package/dist/components/FormControl/FormControl.js +21 -0
  29. package/dist/components/Input/Input.css.ts.vanilla.css +60 -0
  30. package/dist/components/Input/Input.css.vanilla.js +9 -0
  31. package/dist/components/Input/Input.d.ts +16 -0
  32. package/dist/components/Input/Input.js +49 -0
  33. package/dist/components/ListItem/ListItem.css.ts.vanilla.css +72 -0
  34. package/dist/components/ListItem/ListItem.css.vanilla.js +11 -0
  35. package/dist/components/ListItem/ListItem.d.ts +29 -0
  36. package/dist/components/ListItem/ListItem.js +92 -0
  37. package/dist/components/ListItem/assets/fallback_grocery.js +3 -0
  38. package/dist/components/Skeleton/Skeleton.css.ts.vanilla.css +164 -0
  39. package/dist/components/Skeleton/Skeleton.css.vanilla.js +7 -0
  40. package/dist/components/Skeleton/Skeleton.d.ts +10 -0
  41. package/dist/components/Skeleton/Skeleton.js +22 -0
  42. package/dist/components/Spacer/Spacer.css.ts.vanilla.css +3 -0
  43. package/dist/components/Spacer/Spacer.css.vanilla.js +7 -0
  44. package/dist/components/Spacer/Spacer.d.ts +9 -0
  45. package/dist/components/Spacer/Spacer.js +6 -0
  46. package/dist/components/Spinner/Spinner.css.ts.vanilla.css +171 -0
  47. package/dist/components/Spinner/Spinner.css.vanilla.js +7 -0
  48. package/dist/components/Spinner/Spinner.d.ts +10 -0
  49. package/dist/components/Spinner/Spinner.js +17 -0
  50. package/dist/components/TimeLine/TimeLine.css.ts.vanilla.css +178 -0
  51. package/dist/components/TimeLine/TimeLine.css.vanilla.js +9 -0
  52. package/dist/components/TimeLine/TimeLine.d.ts +25 -0
  53. package/dist/components/TimeLine/TimeLine.js +53 -0
  54. package/dist/cssUtils/border.css.d.ts +4 -0
  55. package/dist/cssUtils/border.css.vanilla.js +6 -0
  56. package/dist/cssUtils/color.css.d.ts +6 -0
  57. package/dist/cssUtils/color.css.vanilla.js +8 -0
  58. package/dist/cssUtils/spacings.css.d.ts +9 -0
  59. package/dist/cssUtils/spacings.css.ts.vanilla.css +0 -66
  60. package/dist/cssUtils/spacings.css.vanilla.js +11 -0
  61. package/dist/cssUtils/typography.css.d.ts +5 -0
  62. package/dist/cssUtils/typography.css.ts.vanilla.css +100 -0
  63. package/dist/index.d.ts +16 -0
  64. package/dist/index.js +19 -0
  65. package/dist/typography/BodyText/BodyText.css.vanilla.js +8 -0
  66. package/dist/typography/BodyText/BodyText.d.ts +16 -0
  67. package/dist/typography/BodyText/BodyText.js +28 -0
  68. package/dist/typography/H3/H3.css.ts.vanilla.css +4 -0
  69. package/dist/typography/H3/H3.css.vanilla.js +8 -0
  70. package/dist/typography/H3/H3.js +24 -0
  71. package/package.json +2 -2
@@ -610,72 +610,6 @@
610
610
  padding-bottom: 0px;
611
611
  padding-top: 0px;
612
612
  }
613
- .spacings_spacingsToCssMapper_xxxs__e0awtz2c {
614
- height: 2px;
615
- }
616
- .spacings_spacingsToCssMapper_xxs__e0awtz2d {
617
- height: 4px;
618
- }
619
- .spacings_spacingsToCssMapper_xxs2__e0awtz2e {
620
- height: 6px;
621
- }
622
- .spacings_spacingsToCssMapper_xs__e0awtz2f {
623
- height: 8px;
624
- }
625
- .spacings_spacingsToCssMapper_xs2__e0awtz2g {
626
- height: 12px;
627
- }
628
- .spacings_spacingsToCssMapper_sm__e0awtz2h {
629
- height: 16px;
630
- }
631
- .spacings_spacingsToCssMapper_sm2__e0awtz2i {
632
- height: 20px;
633
- }
634
- .spacings_spacingsToCssMapper_md__e0awtz2j {
635
- height: 24px;
636
- }
637
- .spacings_spacingsToCssMapper_lg__e0awtz2k {
638
- height: 32px;
639
- }
640
- .spacings_spacingsToCssMapper_xl__e0awtz2l {
641
- height: 40px;
642
- }
643
- .spacings_spacingsToCssMapper_xxl__e0awtz2m {
644
- height: 56px;
645
- }
646
- .spacings_spacingsToCssMapper_xxxs__e0awtz2n {
647
- width: 2px;
648
- }
649
- .spacings_spacingsToCssMapper_xxs__e0awtz2o {
650
- width: 4px;
651
- }
652
- .spacings_spacingsToCssMapper_xxs2__e0awtz2p {
653
- width: 6px;
654
- }
655
- .spacings_spacingsToCssMapper_xs__e0awtz2q {
656
- width: 8px;
657
- }
658
- .spacings_spacingsToCssMapper_xs2__e0awtz2r {
659
- width: 12px;
660
- }
661
- .spacings_spacingsToCssMapper_sm__e0awtz2s {
662
- width: 16px;
663
- }
664
- .spacings_spacingsToCssMapper_sm2__e0awtz2t {
665
- width: 20px;
666
- }
667
- .spacings_spacingsToCssMapper_md__e0awtz2u {
668
- width: 24px;
669
- }
670
- .spacings_spacingsToCssMapper_lg__e0awtz2v {
671
- width: 32px;
672
- }
673
- .spacings_spacingsToCssMapper_xl__e0awtz2w {
674
- width: 40px;
675
- }
676
- .spacings_spacingsToCssMapper_xxl__e0awtz2x {
677
- width: 56px;
678
- }
679
613
  @media (min-width: 960px) {
680
614
  .spacings_margin_xxxs__e0awtz0 {
681
615
  margin: 2px;
@@ -0,0 +1,11 @@
1
+ import './spacings.css.ts.vanilla.css';
2
+
3
+ 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" };
4
+ 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" };
5
+ 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" };
6
+ 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" };
7
+ 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" };
8
+ 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" };
9
+ 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" };
10
+
11
+ export { margin, marginBottomDynamic, marginHorizontal, marginVertical, padding, paddingHorizontal, paddingVertical };
@@ -0,0 +1,5 @@
1
+ declare type TTextDecoration = 'underline' | 'lineThrough';
2
+ declare type TTextAlign = 'center' | 'left' | 'right';
3
+ declare type TBodyTextSizeKeys = 'tiny' | 'extraSmall' | 'small' | 'default';
4
+
5
+ export { TBodyTextSizeKeys, TTextAlign, TTextDecoration };
@@ -0,0 +1,100 @@
1
+ .typography_fontFamily_primary__xithyt0 {
2
+ font-family: "Poppins", "Helvetica Neue", Helvetica, Arial, sans-serif;
3
+ }
4
+ .typography_fontFamily_display__xithyt1 {
5
+ font-family: "Dom Casual";
6
+ }
7
+ .typography_fontFamily_code__xithyt2 {
8
+ font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
9
+ }
10
+ .typography_fontSize_xs__xithyt3 {
11
+ font-size: 10px;
12
+ }
13
+ .typography_fontSize_s1__xithyt4 {
14
+ font-size: 12px;
15
+ }
16
+ .typography_fontSize_s2__xithyt5 {
17
+ font-size: 13px;
18
+ }
19
+ .typography_fontSize_s3__xithyt6 {
20
+ font-size: 15px;
21
+ }
22
+ .typography_fontSize_s4__xithyt7 {
23
+ font-size: 18px;
24
+ }
25
+ .typography_fontSize_m1__xithyt8 {
26
+ font-size: 24px;
27
+ }
28
+ .typography_fontSize_m2__xithyt9 {
29
+ font-size: 30px;
30
+ }
31
+ .typography_fontSize_l1__xithyta {
32
+ font-size: 41px;
33
+ }
34
+ .typography_fontSize_code__xithytb {
35
+ font-size: 90px;
36
+ }
37
+ .typography_fontWeight_regular__xithytc {
38
+ font-weight: 400;
39
+ }
40
+ .typography_fontWeight_medium__xithytd {
41
+ font-weight: 500;
42
+ }
43
+ .typography_fontWeight_semiBold__xithyte {
44
+ font-weight: 600;
45
+ }
46
+ .typography_fontWeight_bold__xithytf {
47
+ font-weight: 700;
48
+ }
49
+ .typography_lineHeight_xs__xithytg {
50
+ line-height: 15px;
51
+ }
52
+ .typography_lineHeight_s1__xithyth {
53
+ line-height: 18px;
54
+ }
55
+ .typography_lineHeight_s2__xithyti {
56
+ line-height: 19px;
57
+ }
58
+ .typography_lineHeight_m1__xithytj {
59
+ line-height: 22px;
60
+ }
61
+ .typography_lineHeight_m2__xithytk {
62
+ line-height: 27px;
63
+ }
64
+ .typography_lineHeight_m3__xithytl {
65
+ line-height: 36px;
66
+ }
67
+ .typography_lineHeight_l1__xithytm {
68
+ line-height: 45px;
69
+ }
70
+ .typography_textAlign_left__xithytn {
71
+ text-align: left;
72
+ }
73
+ .typography_textAlign_right__xithyto {
74
+ text-align: right;
75
+ }
76
+ .typography_textAlign_center__xithytp {
77
+ text-align: center;
78
+ }
79
+ .typography_textDecoration_lineThrough__xithytq {
80
+ text-decoration: line-through;
81
+ }
82
+ .typography_textDecoration_underline__xithytr {
83
+ text-decoration: underline;
84
+ }
85
+ .typography_bodyTextSize_tiny__xithyts {
86
+ font-size: 10px;
87
+ line-height: 15px;
88
+ }
89
+ .typography_bodyTextSize_extraSmall__xithytt {
90
+ font-size: 13px;
91
+ line-height: 19px;
92
+ }
93
+ .typography_bodyTextSize_small__xithytu {
94
+ font-size: 12px;
95
+ line-height: 18px;
96
+ }
97
+ .typography_bodyTextSize_default__xithytv {
98
+ font-size: 15px;
99
+ line-height: 22px;
100
+ }
package/dist/index.d.ts CHANGED
@@ -1 +1,17 @@
1
1
  export { Box, TBox } from './components/Box/Box.js';
2
+ export { AlertBox, TAlertBox } from './components/AlertBox/AlertBox.js';
3
+ export { CartItemSummary, TCartItemSummary, TSummaryItem } from './components/CartItemSummary/CartItemSummary.js';
4
+ export { Divider, TDivider } from './components/Divider/Divider.js';
5
+ export { Dot, TDot } from './components/Dot/Dot.js';
6
+ export { FormControl, TFormControl, TScreenWidth } from './components/FormControl/FormControl.js';
7
+ export { Input, TInput } from './components/Input/Input.js';
8
+ export { EListItemAlignment, ListItem, TItem, TListItem } from './components/ListItem/ListItem.js';
9
+ export { TSkeleton } from './components/Skeleton/Skeleton.js';
10
+ export { Spacer, TSpacer } from './components/Spacer/Spacer.js';
11
+ export { Spinner, TSpinner } from './components/Spinner/Spinner.js';
12
+ export { TTimeline, TTimelineItem, Timeline } from './components/TimeLine/TimeLine.js';
13
+ export { BodyText, TBodyText } from './typography/BodyText/BodyText.js';
14
+ export { borderColor, borderRadius } from './cssUtils/border.css.js';
15
+ export { backgroundColor, color, hoverBackgroundColor, hoverColor } from './cssUtils/color.css.js';
16
+ export { margin, marginBottomDynamic, marginHorizontal, marginVertical, padding, paddingHorizontal, paddingVertical } from './cssUtils/spacings.css.js';
17
+ export { CartSummary, TCartSummary } from './components/CartSummary/CartSummary.js';
package/dist/index.js CHANGED
@@ -1 +1,20 @@
1
1
  export { Box } from './components/Box/Box.js';
2
+ export { AlertBox } from './components/AlertBox/AlertBox.js';
3
+ import '@citygross/icons_v2';
4
+ import 'react';
5
+ import './components/BoxArrow/BoxArrow.css.vanilla.js';
6
+ export { CartItemSummary } from './components/CartItemSummary/CartItemSummary.js';
7
+ export { Divider } from './components/Divider/Divider.js';
8
+ export { Dot } from './components/Dot/Dot.js';
9
+ export { FormControl, TScreenWidth } from './components/FormControl/FormControl.js';
10
+ export { Input } from './components/Input/Input.js';
11
+ export { EListItemAlignment, ListItem } from './components/ListItem/ListItem.js';
12
+ import './components/Skeleton/Skeleton.css.vanilla.js';
13
+ export { Spacer } from './components/Spacer/Spacer.js';
14
+ export { Spinner } from './components/Spinner/Spinner.js';
15
+ export { Timeline } from './components/TimeLine/TimeLine.js';
16
+ export { BodyText } from './typography/BodyText/BodyText.js';
17
+ export { borderColor, borderRadius } from './cssUtils/border.css.vanilla.js';
18
+ export { backgroundColor, color, hoverBackgroundColor, hoverColor } from './cssUtils/color.css.vanilla.js';
19
+ export { margin, marginBottomDynamic, marginHorizontal, marginVertical, padding, paddingHorizontal, paddingVertical } from './cssUtils/spacings.css.vanilla.js';
20
+ export { CartSummary } from './components/CartSummary/CartSummary.js';
@@ -0,0 +1,8 @@
1
+ import './../../cssUtils/typography.css.ts.vanilla.css';
2
+ import './../../cssUtils/color.css.ts.vanilla.css';
3
+ import 'src/typography/BodyText/BodyText.css.ts.vanilla.css';
4
+ import { createRuntimeFn } from '@vanilla-extract/recipes/createRuntimeFn';
5
+
6
+ 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: [] });
7
+
8
+ export { bodyTextStyle };
@@ -0,0 +1,16 @@
1
+ import React from 'react';
2
+ import { TPaletteKeys, TFontWeightKeys } from '@citygross/design-tokens_v2';
3
+ import { TBodyTextSizeKeys, TTextDecoration, TTextAlign } from '../../cssUtils/typography.css.js';
4
+
5
+ declare type TBodyText = {
6
+ children: React.ReactNode;
7
+ size?: TBodyTextSizeKeys;
8
+ color?: TPaletteKeys;
9
+ textDecoration?: TTextDecoration;
10
+ fontWeight?: TFontWeightKeys;
11
+ textAlign?: TTextAlign;
12
+ className?: string;
13
+ };
14
+ declare const BodyText: ({ children, color, fontWeight, textDecoration, size, textAlign, className }: TBodyText) => JSX.Element;
15
+
16
+ export { BodyText, TBodyText };
@@ -0,0 +1,28 @@
1
+ import React from 'react';
2
+ import { bodyTextStyle } from './BodyText.css.vanilla.js';
3
+
4
+ const BodyText = ({
5
+ children,
6
+ color,
7
+ fontWeight,
8
+ textDecoration,
9
+ size,
10
+ textAlign,
11
+ className
12
+ }) => {
13
+ return /* @__PURE__ */ React.createElement(
14
+ "p",
15
+ {
16
+ className: `${bodyTextStyle({
17
+ bodyTextSize: size,
18
+ color,
19
+ textDecoration,
20
+ textAlign,
21
+ fontWeight
22
+ })} ${className}`
23
+ },
24
+ children
25
+ );
26
+ };
27
+
28
+ export { BodyText };
@@ -0,0 +1,4 @@
1
+ .H3_H3Styles__170fb7l0 {
2
+ font-size: 15px;
3
+ line-height: 22px;
4
+ }
@@ -0,0 +1,8 @@
1
+ import './../../cssUtils/typography.css.ts.vanilla.css';
2
+ import './../../cssUtils/color.css.ts.vanilla.css';
3
+ import './H3.css.ts.vanilla.css';
4
+ import { createRuntimeFn } from '@vanilla-extract/recipes/createRuntimeFn';
5
+
6
+ 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: [] });
7
+
8
+ export { H3Styles };
@@ -0,0 +1,24 @@
1
+ import React from 'react';
2
+ import { H3Styles } from './H3.css.vanilla.js';
3
+
4
+ const H3 = ({
5
+ children,
6
+ className,
7
+ color,
8
+ fontWeight,
9
+ lineThrough
10
+ }) => {
11
+ return /* @__PURE__ */ React.createElement(
12
+ "h3",
13
+ {
14
+ className: `${H3Styles({
15
+ color,
16
+ textDecoration: lineThrough ? "lineThrough" : null,
17
+ fontWeight
18
+ })} ${className}`
19
+ },
20
+ children
21
+ );
22
+ };
23
+
24
+ export { H3 };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@citygross/components_v2",
3
- "version": "0.0.11",
3
+ "version": "0.0.13",
4
4
  "license": "ISC",
5
5
  "sideEffects": false,
6
6
  "main": "./dist/index.js",
@@ -79,5 +79,5 @@
79
79
  "react-slick": "^0.30.1",
80
80
  "slick-carousel": "^1.8.1"
81
81
  },
82
- "gitHead": "2360161b0d275e01939dee14bab4f75cc1c3b8e3"
82
+ "gitHead": "9476c3561b771a7433debdb873a15f0c88b4aa9e"
83
83
  }