@trafilea/afrodita-components 4.0.2-beta.6 → 4.1.0

package/build/{dts/core/theme/Theme.d.ts → theme/shapermint.theme.d.ts}

@@ -1,38 +1,33 @@
-import { CSSProperties, ElementType, FC, ReactNode } from 'react';
-export declare const ThemeProvider: FC<{
-    theme: Theme;
-    children: ReactNode;
-}>;
-export declare const useTheme: () => Theme;
-export declare const ThemeVariables: FC<{
-    theme: Theme;
-    Container?: ElementType;
-}>;
-export declare const AssetsProvider: FC<{
-    assets: ThemeAssets;
-}>;
-export declare const useThemeAssets: () => ThemeAssets;
-export declare type Theme = {
+import { CSSProperties } from 'react';
+
+declare type Theme = {
     name: string;
     fontSizes: number[];
     fontWeights: number[];
     lineHeights: number[];
     mediaQueries: ThemeBreakpoints;
+    radius: {
+        regular: string;
+    };
+    zIndex: {
+        modal: number;
+        overlay: number;
+    };
     colors: ThemeColors;
     component: ThemeComponent;
     typography: ThemeTypography;
     fonts: ThemeFonts;
     assets: ThemeAssets;
 };
-export declare type ThemeBreakpoints = {
+declare type ThemeBreakpoints = {
     mobile: number;
     desktop: number;
 };
-export declare type ThemeBasicPallete = {
+declare type ThemeBasicPallete = {
     color: string;
     contrast: string;
 };
-export declare type ThemeColorPallete = ThemeBasicPallete & {
+declare type ThemeColorPallete = ThemeBasicPallete & {
     soft: ThemeBasicPallete;
 };
 declare type ThemeColorPrimaryPallete = ThemeColorPallete & {
@@ -41,7 +36,7 @@ declare type ThemeColorPrimaryPallete = ThemeColorPallete & {
     60: ThemeColorPallete;
     80: ThemeColorPallete;
 };
-export declare type ThemeColors = {
+declare type ThemeColors = {
     pallete: {
         primary: ThemeColorPrimaryPallete;
         secondary: ThemeColorPrimaryPallete;
@@ -92,7 +87,7 @@ export declare type ThemeColors = {
         disabled: string;
     };
 };
-export declare type ThemeComponent = {
+declare type ThemeComponent = {
     button: {
         border: string;
         borderRadius: string;
@@ -350,8 +345,11 @@ export declare type ThemeComponent = {
             color: string;
         };
     };
+    modal: {
+        minWidth: string;
+    };
 };
-export declare type ThemeTypography = {
+declare type ThemeTypography = {
     config: {
         weight: {
             heavy: number;
@@ -362,7 +360,7 @@ export declare type ThemeTypography = {
     };
     variants: Record<string, CSSProperties>;
 };
-export declare type ThemeFonts = {
+declare type ThemeFonts = {
     url: string;
     config: Array<{
         src: string;
@@ -372,11 +370,14 @@ export declare type ThemeFonts = {
         stretch?: string;
     }>;
 };
-export declare type ThemeAssets = {
+declare type ThemeAssets = {
     images: {
         favicon: string;
         logo: string;
     };
     [key: string]: any;
-};
-export {};
+};
+
+declare const shapermint: Theme;
+
+export { shapermint as default };

package/build/theme/shapermint.theme.js

@@ -26,25 +26,6 @@ var __assign = function() {
     return __assign.apply(this, arguments);
 };
 
-/* istanbul ignore next */
-function color(color, contrast, softColor, softContrast) {
-    return {
-        color: color,
-        contrast: contrast,
-        soft: {
-            color: softColor,
-            contrast: softContrast,
-        },
-    };
-}
-/* istanbul ignore next */
-function basic(color, contrast) {
-    return {
-        color: color,
-        contrast: contrast,
-    };
-}
-
 var shapermint = {
     name: 'Shapermint',
     fontSizes: [10, 12, 14, 16, 18, 20, 24, 30, 36, 42, 52, 60, 68, 72, 76],
@@ -54,44 +35,131 @@ var shapermint = {
         mobile: 0,
         desktop: 1200,
     },
+    radius: {
+        regular: '8px',
+    },
+    zIndex: {
+        modal: 50,
+        overlay: 49,
+    },
     colors: {
         pallete: {
-            primary: __assign(__assign({}, color('#f7a08b', '--colors-shades-700-color', '#fcd9d1', '--colors-shades-700-color')), { 20: color('fdece8', '--colors-shades-700-color', '#fef7f6', '--colors-shades-700-color'), 40: color('#fcd9d1', '--colors-shades-700-color', '#fef0ed', '--colors-shades-700-color'), 60: color('#fac6b9', '--colors-shades-700-color', '#fde8e3', '--colors-shades-700-color'), 80: color('#f9b3a2', '--colors-shades-700-color', '#fde1da', '--colors-shades-700-color') }),
-            secondary: __assign(__assign({}, color('#292929', '--colors-shades-white-color', '#bbbbbb', '--colors-shades-700-color')), { 20: color('#d4d4d4', '--colors-shades-700-color', '#f1f1f1', '--colors-shades-700-color'), 40: color('#a9a9a9', '--colors-shades-700-color', '#e4e4e4', '--colors-shades-700-color'), 60: color('#7f7f7f', '--colors-shades-white-color', '#d6d6d6', '--colors-shades-700-color'), 80: color('#545454', '--colors-shades-white-color', '#c9c9c9', '--colors-shades-700-color') }),
-            // prettier-ignore
-            ocean: color('#2B526D', '--colors-shades-white-color', '#BFCBD3', '--colors-shades-700-color'),
+            primary: {
+                color: '#f7a08b',
+                contrast: '--colors-shades-700-color',
+                soft: {
+                    color: '#fcd9d1',
+                    contrast: '--colors-shades-700-color',
+                },
+                20: {
+                    color: '#fdece8',
+                    contrast: '--colors-shades-700-color',
+                    soft: {
+                        color: '#fef7f6',
+                        contrast: '--colors-shades-700-color',
+                    },
+                },
+                40: {
+                    color: '#fcd9d1',
+                    contrast: '--colors-shades-700-color',
+                    soft: {
+                        color: '#fef0ed',
+                        contrast: '--colors-shades-700-color',
+                    },
+                },
+                60: {
+                    color: '#fac6b9',
+                    contrast: '--colors-shades-700-color',
+                    soft: {
+                        color: '#fde8e3',
+                        contrast: '--colors-shades-700-color',
+                    },
+                },
+                80: {
+                    color: '#f9b3a2',
+                    contrast: '--colors-shades-700-color',
+                    soft: {
+                        color: '#fde1da',
+                        contrast: '--colors-shades-700-color',
+                    },
+                },
+            },
+            secondary: __assign({
+                color: '#292929',
+                contrast: '--colors-shades-white-color',
+                soft: {
+                    color: '#bbbbbb',
+                    contrast: '--colors-shades-700-color',
+                },
+            }, { 20: {
+                    color: '#d4d4d4',
+                    contrast: '--colors-shades-700-color',
+                    soft: {
+                        color: '#f1f1f1',
+                        contrast: '--colors-shades-700-color',
+                    },
+                }, 40: {
+                    color: '#a9a9a9',
+                    contrast: '--colors-shades-700-color',
+                    soft: {
+                        color: '#e4e4e4',
+                        contrast: '--colors-shades-700-color',
+                    },
+                }, 60: {
+                    color: '#7f7f7f',
+                    contrast: '--colors-shades-white-color',
+                    soft: {
+                        color: '#d6d6d6',
+                        contrast: '--colors-shades-700-color',
+                    },
+                }, 80: {
+                    color: '#545454',
+                    contrast: '--colors-shades-white-color',
+                    soft: {
+                        color: '#c9c9c9',
+                        contrast: '--colors-shades-700-color',
+                    },
+                } }),
+            ocean: {
+                color: '#2B526D',
+                contrast: '--colors-shades-white-color',
+                soft: {
+                    color: '#BFCBD3',
+                    contrast: '--colors-shades-700-color',
+                },
+            },
         },
         shades: {
-            black: basic('#000', '--colors-shades-white-color'),
-            white: basic('#fff', '--colors-shades-700-color'),
-            5: basic('#fafafa', '--colors-shades-700-color'),
-            10: basic('#f7f7f7', '--colors-shades-700-color'),
-            50: basic('#efefef', '--colors-shades-700-color'),
-            100: basic('#e5e5e5', '--colors-shades-700-color'),
-            150: basic('#d1d1d1', '--colors-shades-700-color'),
-            200: basic('#bbbbbb', '--colors-shades-700-color'),
-            250: basic('#a6a6a6', '--colors-shades-700-color'),
-            300: basic('#9e9e9e', '--colors-shades-700-color'),
-            350: basic('#949494', '--colors-shades-700-color'),
-            400: basic('#808080', '--colors-shades-700-color'),
-            450: basic('#767676', '--colors-shades-700-color'),
-            500: basic('#5a5a5a', '--colors-shades-white-color'),
-            550: basic('#3a3a3a', '--colors-shades-white-color'),
-            600: basic('#343434', '--colors-shades-white-color'),
-            650: basic('#2d2d2d', '--colors-shades-white-color'),
-            700: basic('#292929', '--colors-shades-white-color'),
-            750: basic('#232323', '--colors-shades-white-color'),
-            800: basic('#202020', '--colors-shades-white-color'),
-            850: basic('#1b1b1b', '--colors-shades-white-color'),
-            900: basic('#191919', '--colors-shades-white-color'),
-            950: basic('#141414', '--colors-shades-white-color'),
-            990: basic('#0b0b0b', '--colors-shades-white-color'),
+            black: { color: '#000', contrast: '--colors-shades-white-color' },
+            white: { color: '#fff', contrast: '--colors-shades-700-color' },
+            5: { color: '#fafafa', contrast: '--colors-shades-700-color' },
+            10: { color: '#f7f7f7', contrast: '--colors-shades-700-color' },
+            50: { color: '#efefef', contrast: '--colors-shades-700-color' },
+            100: { color: '#e5e5e5', contrast: '--colors-shades-700-color' },
+            150: { color: '#d1d1d1', contrast: '--colors-shades-700-color' },
+            200: { color: '#bbbbbb', contrast: '--colors-shades-700-color' },
+            250: { color: '#a6a6a6', contrast: '--colors-shades-700-color' },
+            300: { color: '#9e9e9e', contrast: '--colors-shades-700-color' },
+            350: { color: '#949494', contrast: '--colors-shades-white-color' },
+            400: { color: '#808080', contrast: '--colors-shades-white-color' },
+            450: { color: '#767676', contrast: '--colors-shades-white-color' },
+            500: { color: '#5a5a5a', contrast: '--colors-shades-white-color' },
+            550: { color: '#3a3a3a', contrast: '--colors-shades-white-color' },
+            600: { color: '#343434', contrast: '--colors-shades-white-color' },
+            650: { color: '#2d2d2d', contrast: '--colors-shades-white-color' },
+            700: { color: '#292929', contrast: '--colors-shades-white-color' },
+            750: { color: '#232323', contrast: '--colors-shades-white-color' },
+            800: { color: '#202020', contrast: '--colors-shades-white-color' },
+            850: { color: '#1b1b1b', contrast: '--colors-shades-white-color' },
+            900: { color: '#191919', contrast: '--colors-shades-white-color' },
+            950: { color: '#141414', contrast: '--colors-shades-white-color' },
+            990: { color: '#0b0b0b', contrast: '--colors-shades-white-color' },
         },
         semantic: {
-            positive: basic('#2f806a', '--colors-shades-white-color'),
-            urgent: basic('#c64844', '--colors-shades-white-color'),
-            attention: basic('#f2d96f', '--colors-shades-700-color'),
-            informative: basic('#0a609b', '--colors-shades-700-color'),
+            positive: { color: '#2f806a', contrast: '--colors-shades-white-color' },
+            urgent: { color: '#c64844', contrast: '--colors-shades-white-color' },
+            attention: { color: '#f2d96f', contrast: '--colors-shades-700-color' },
+            informative: { color: '#0a609b', contrast: '--colors-shades-700-color' },
         },
         border: {
             color: '',
@@ -114,16 +182,16 @@ var shapermint = {
             fontWeight: 600,
             size: {
                 small: {
-                    fontSize: '1rem',
-                    padding: '0.875rem 2rem',
+                    fontSize: '0.75rem',
+                    padding: '0.625rem 2rem',
                 },
                 medium: {
                     fontSize: '0.875rem',
                     padding: '0.688rem 2rem',
                 },
                 large: {
-                    fontSize: '0.75rem',
-                    padding: '0.625rem 2rem',
+                    fontSize: '1rem',
+                    padding: '0.875rem 2rem',
                 },
             },
             primary: {
@@ -365,6 +433,9 @@ var shapermint = {
                 color: '--colors-shades-700-color',
             },
         },
+        modal: {
+            minWidth: '540px',
+        },
     },
     typography: {
         config: {
@@ -490,7 +561,7 @@ var shapermint = {
         },
     },
     fonts: {
-        url: 'https://cdn.jsdelivr.net/gh/igor-ribeiro/storefront-static@main/fonts/shapermint',
+        url: 'https://cdn.jsdelivr.net/gh/trafilea/storefront-static@main/fonts/shapermint',
         config: [
             {
                 family: 'AvenirNextLTPro',
@@ -500,30 +571,30 @@ var shapermint = {
             {
                 family: 'AvenirNextLTPro',
                 src: 'AvenirNextLTPro-Demi.otf',
-                weight: 'bold',
+                weight: 600,
             },
             {
                 family: 'AvenirNextLTPro',
                 src: 'AvenirNextLTPro-Bold.otf',
-                weight: '800 900',
+                weight: 700,
             },
             {
                 family: 'AvenirNextLTPro',
                 src: 'AvenirNextLTPro-DemiCn.otf',
-                weight: 'bold',
+                weight: 600,
                 stretch: 'condensed',
             },
             {
                 family: 'AvenirNextLTPro',
                 src: 'AvenirNextLTPro-DemiCnIt.otf',
-                weight: 'bold',
+                weight: 600,
                 stretch: 'condensed',
                 style: 'italic',
             },
             {
                 family: 'AvenirNextLTPro',
                 src: 'AvenirNextLTPro-DemiIt.otf',
-                weight: 'bold',
+                weight: 600,
                 style: 'italic',
             },
             {
@@ -552,16 +623,21 @@ var shapermint = {
                 style: 'italic',
                 stretch: 'condensed',
             },
+            {
+                family: 'AvenirNextLTPro',
+                src: 'AvenirNextLTPro-Heavy.otf',
+                weight: '800 900',
+            },
             {
                 family: 'AvenirNextLTPro',
                 src: 'AvenirNextLTPro-HeavyCn.otf',
-                weight: 900,
+                weight: '800 900',
                 stretch: 'condensed',
             },
             {
                 family: 'AvenirNextLTPro',
                 src: 'AvenirNextLTPro-HeavyCnIt.otf',
-                weight: 900,
+                weight: '800 900',
                 style: 'italic',
                 stretch: 'condensed',
             },