@trafilea/afrodita-components 5.0.0-beta.3 → 5.0.0-beta.300

package/build/theme/truekind.theme.d.ts

@@ -1,4 +1,5 @@
 import { CSSProperties } from 'react';
+import { ComponentSize } from 'src/types/enums';
 
 declare type Theme = {
     name: string;
@@ -21,6 +22,7 @@ declare type Theme = {
 };
 declare type ThemeBreakpoints = {
     mobile: number;
+    tablet?: number;
     desktop: number;
 };
 declare type ThemeBasicPallete = {
@@ -28,7 +30,7 @@ declare type ThemeBasicPallete = {
     contrast: string;
 };
 declare type ThemeColorPallete = ThemeBasicPallete & {
-    soft: ThemeBasicPallete;
+    soft?: ThemeBasicPallete;
 };
 declare type ThemeColorPrimaryPallete = ThemeColorPallete & {
     20: ThemeColorPallete;
@@ -40,6 +42,7 @@ declare type ThemeColors = {
     pallete: {
         primary: ThemeColorPrimaryPallete;
         secondary: ThemeColorPrimaryPallete;
+        tertiary?: ThemeColorPrimaryPallete;
     } & Partial<Record<string, ThemeColorPallete>>;
     shades: {
         black: ThemeBasicPallete;
@@ -49,6 +52,7 @@ declare type ThemeColors = {
         50: ThemeBasicPallete;
         100: ThemeBasicPallete;
         150: ThemeBasicPallete;
+        175: ThemeBasicPallete;
         200: ThemeBasicPallete;
         250: ThemeBasicPallete;
         300: ThemeBasicPallete;
@@ -77,6 +81,8 @@ declare type ThemeColors = {
         color: string;
         disabled: string;
         highlight: string;
+        shadow?: string;
+        isChecked?: string;
     };
     background: {
         color: string;
@@ -92,6 +98,10 @@ declare type ThemeComponent = {
         border: string;
         borderRadius: string;
         fontWeight: number;
+        lineHeight: string;
+        letterSpacing: string;
+        minWidth: string;
+        minHeight: string;
         size: {
             small: {
                 fontSize: string;
@@ -138,6 +148,12 @@ declare type ThemeComponent = {
         lineHeight: string;
         border: string;
         boxShadow: string;
+        errorBorder: string;
+    };
+    inputPlaceholder: {
+        fontSize: string;
+        padding: string;
+        focusBorder: string;
     };
     inputCustom: {
         button: {
@@ -170,6 +186,12 @@ declare type ThemeComponent = {
             border: string;
             color: string;
         };
+        noStock: {
+            fontWeight: number;
+            background: string;
+            border: string;
+            color: string;
+        };
         disabled: {
             border: string;
         };
@@ -223,10 +245,13 @@ declare type ThemeComponent = {
     };
     card: {
         borderRadius: string;
+        backgroundColor: string;
     };
     radio: {
         borderColor: string;
         background: string;
+        textSize: string;
+        lineHeight: string;
         size: {
             small: {
                 borderWidth: string;
@@ -255,6 +280,7 @@ declare type ThemeComponent = {
         };
     };
     label: {
+        color: string;
         fontSize: {
             small: string;
             medium: string;
@@ -363,11 +389,13 @@ declare type ThemeComponent = {
         fontWeight: number;
         lineHeight: string;
         padding: string;
+        optionPadding: string;
         color: string;
         fill: string;
         options: {
             borderColor: string;
             color: string;
+            borderRadius: string;
         };
     };
     modal: {
@@ -376,8 +404,256 @@ declare type ThemeComponent = {
     packSelector: {
         borderRadius: string;
         borderColor: string;
-        highlight: string;
-        selected: string;
+        highlightColor: string;
+        selectedColor: string;
+        selectedContrast: string;
+        tagColor: string;
+    };
+    slideNavigation: {
+        slideDots: {
+            unselectedDotColor: string;
+            selectedDotColor: string;
+            dotsOpacity: number;
+        };
+    };
+    beforeAfter: {
+        size: {
+            small: {
+                image: {
+                    minHeight: string;
+                    minWidth: string;
+                    mobile: {
+                        minHeight: string;
+                        minWidth: string;
+                    };
+                };
+                imageContainer: {
+                    maxWidth: string;
+                    padding: string;
+                    mobile: {
+                        maxWidth: string;
+                    };
+                };
+                userInfoText: {
+                    fontSize: string;
+                    mobile: {
+                        fontSize: string;
+                    };
+                };
+            };
+            medium: {
+                image: {
+                    minHeight: string;
+                    minWidth: string;
+                    mobile: {
+                        minHeight: string;
+                        minWidth: string;
+                    };
+                };
+                imageContainer: {
+                    maxWidth: string;
+                    padding: string;
+                    mobile: {
+                        maxWidth: string;
+                    };
+                };
+                userInfoText: {
+                    fontSize: string;
+                    mobile: {
+                        fontSize: string;
+                    };
+                };
+            };
+            large: {
+                image: {
+                    minHeight: string;
+                    minWidth: string;
+                    mobile: {
+                        minHeight: string;
+                        minWidth: string;
+                    };
+                };
+                imageContainer: {
+                    maxWidth: string;
+                    padding: string;
+                    mobile: {
+                        maxWidth: string;
+                    };
+                };
+                userInfoText: {
+                    fontSize: string;
+                    mobile: {
+                        fontSize: string;
+                    };
+                };
+            };
+        };
+    };
+    total: {
+        basicTotal: {
+            amount: {
+                color: string;
+                fontSize: string;
+            };
+            currency: {
+                color: string;
+                fontSize: string;
+                lineHeight: string;
+                alignSelf?: string;
+            };
+            savings: {
+                amountFontWeight: number;
+                color?: string;
+            };
+        };
+    };
+    subTotal: {
+        basicSubTotal: {
+            family: string;
+            size: string;
+            weight: number;
+            lineHeight: string;
+            color: string;
+        };
+    };
+    pricing: {
+        priceLabel: {
+            price: {
+                size: ComponentSize.Small | ComponentSize.Medium | ComponentSize.Large;
+                originalPriceColor: string;
+                actualPriceColor: string;
+            };
+        };
+    };
+    orderSummary: {
+        headingTextAlign: string;
+        backgroundColor?: string;
+        padding?: string;
+        borderRadius?: string;
+        maxWidth?: string;
+        onMobile: {
+            maxWidth?: string;
+            padding?: string;
+            backgroundColor?: string;
+        };
+    };
+    expressCheckout: {
+        button: {
+            borderRadius: string;
+        };
+    };
+    copyrightText: {
+        fontSize: string;
+        fontWeight: number;
+        lineHeight: string;
+        color: string;
+    };
+    thankyouFooterText: {
+        fontSize: string;
+        fontWeight: string;
+        lineHeight: string;
+    };
+    textButton: {
+        fontWeight: number;
+        lineHeight: string;
+    };
+    deliveryDetails: {
+        title: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        note: {
+            accentColor: string;
+            color: string;
+            backgroundColor: string;
+        };
+        sectionTitle: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        sectionDetails: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+            marginLeft?: string;
+        };
+    };
+    text: {
+        orderHeader: {
+            color: string;
+        };
+    };
+    orderBar: {
+        backgroundColor: string;
+        fontColor: string;
+    };
+    banner: {
+        outlineColor: string;
+        filledColor: string;
+        fontColor: string;
+    };
+    offerTitleText: {
+        size: string;
+        weight: number;
+        lineHeight: string;
+    };
+    linePrice: {
+        color: string;
+        badge: {
+            color: string;
+            borderRadius: string;
+        };
+    };
+    divider: {
+        color: string;
+    };
+    checkout: {
+        paymentInformation: {
+            borderRadius?: string;
+        };
+        creditCardSection: {
+            borderRadius?: string;
+        };
+    };
+    upsell: {
+        banner: {
+            outlined: {
+                color?: string;
+            };
+        };
+        price: {
+            colors: {
+                regular: string;
+                deal: string;
+                each: string;
+                badgeBG: string;
+                badgeColor: string;
+            };
+        };
+        hurryTimeCard: {
+            backgroundColor: string;
+        };
+        guaranteedFit?: {
+            backgroundColor: string;
+        };
+    };
+    thankyou: {
+        orderBanner?: {
+            text: {
+                left: string;
+            };
+        };
+        emailSection: {
+            backgroundColor?: string;
+        };
+        socialIcon: {
+            color?: string;
+        };
+        orderId: {
+            color: string;
+        };
     };
 };
 declare type ThemeTypography = {
@@ -405,6 +681,26 @@ declare type ThemeAssets = {
     images: {
         favicon: string;
         logo: string;
+        logoSize?: {
+            width: string;
+            height: string;
+        };
+        logoMobile?: string;
+        checkoutLogo?: {
+            url: string;
+            width: string;
+            height: string;
+        };
+        upsellLogo?: {
+            url: string;
+            width: string;
+            height: string;
+        };
+        tyLogo?: {
+            url: string;
+            width: string;
+            height: string;
+        };
     };
     [key: string]: any;
 };