@telefonica/mistica 16.52.0 → 16.54.0

package/dist/skins/blau.js

@@ -86,6 +86,14 @@ const e = {
             backgroundBrandBottom: e.blauBluePrimary,
             appBarBackground: e.white,
             navigationBarBackground: e.blauBluePrimary,
+            backgroundDropZoneHover: (0, _color.applyAlpha)(e.blauBlueSecondary, 0.05),
+            backgroundDropZoneDragover: (0, _color.applyAlpha)(e.blauBlueSecondary, 0.08),
+            backgroundDropZoneBrandHover: (0, _color.applyAlpha)(e.grey6, 0.05),
+            backgroundDropZoneBrandDragover: (0, _color.applyAlpha)(e.grey6, 0.08),
+            backgroundDropZoneNegativeHover: (0, _color.applyAlpha)(e.white, 0.1),
+            backgroundDropZoneNegativeDragover: (0, _color.applyAlpha)(e.white, 0.17),
+            backgroundDropZoneMediaHover: (0, _color.applyAlpha)(e.grey6, 0.05),
+            backgroundDropZoneMediaDragover: (0, _color.applyAlpha)(e.grey6, 0.08),
             skeletonWave: e.grey2,
             borderLow: e.grey1,
             border: e.grey3,
@@ -363,6 +371,14 @@ const e = {
             backgroundBrandBottom: e.darkModeBlack,
             appBarBackground: e.darkModeGrey,
             navigationBarBackground: e.darkModeBlack,
+            backgroundDropZoneHover: (0, _color.applyAlpha)(e.white, 0.05),
+            backgroundDropZoneDragover: (0, _color.applyAlpha)(e.white, 0.08),
+            backgroundDropZoneBrandHover: (0, _color.applyAlpha)(e.white, 0.03),
+            backgroundDropZoneBrandDragover: (0, _color.applyAlpha)(e.white, 0.05),
+            backgroundDropZoneNegativeHover: (0, _color.applyAlpha)(e.white, 0.15),
+            backgroundDropZoneNegativeDragover: (0, _color.applyAlpha)(e.white, 0.15),
+            backgroundDropZoneMediaHover: (0, _color.applyAlpha)(e.white, 0.03),
+            backgroundDropZoneMediaDragover: (0, _color.applyAlpha)(e.white, 0.05),
             skeletonWave: e.grey5,
             borderLow: e.darkModeBlack,
             border: e.darkModeGrey,
@@ -965,5 +981,121 @@ const e = {
         themeVariants: {
             successFeedback: "default",
             brandLoadingScreen: "default"
+        },
+        spacing: {
+            buttonDefaultPadding: {
+                left: {
+                    mobile: 16,
+                    desktop: 16
+                },
+                right: {
+                    mobile: 16,
+                    desktop: 16
+                }
+            },
+            buttonSmallPadding: {
+                left: {
+                    mobile: 12,
+                    desktop: 12
+                },
+                right: {
+                    mobile: 12,
+                    desktop: 12
+                }
+            },
+            cardDefaultPadding: {
+                top: {
+                    mobile: 16,
+                    desktop: 24
+                },
+                bottom: {
+                    mobile: 16,
+                    desktop: 24
+                },
+                left: {
+                    mobile: 16,
+                    desktop: 24
+                },
+                right: {
+                    mobile: 16,
+                    desktop: 24
+                }
+            },
+            inputPadding: {
+                top: {
+                    mobile: 8,
+                    desktop: 8
+                },
+                bottom: {
+                    mobile: 8,
+                    desktop: 8
+                }
+            },
+            tagPadding: {
+                top: {
+                    mobile: 4,
+                    desktop: 4
+                },
+                bottom: {
+                    mobile: 4,
+                    desktop: 4
+                }
+            },
+            feedbackScreenPadding: {
+                top: {
+                    mobile: 64,
+                    desktop: 64
+                },
+                bottom: {
+                    mobile: 16,
+                    desktop: 64
+                },
+                left: {
+                    mobile: 16,
+                    desktop: 64
+                },
+                right: {
+                    mobile: 16,
+                    desktop: 64
+                }
+            },
+            heroPadding: {
+                top: {
+                    mobile: 24,
+                    desktop: 56
+                },
+                bottom: {
+                    mobile: 24,
+                    desktop: 56
+                }
+            },
+            headerPadding: {
+                top: {
+                    mobile: 24,
+                    desktop: 48
+                },
+                bottom: {
+                    mobile: 24,
+                    desktop: 48
+                }
+            },
+            drawerPadding: {
+                top: {
+                    mobile: 32,
+                    desktop: 40
+                },
+                bottom: {
+                    mobile: 16,
+                    desktop: 24
+                },
+                left: {
+                    mobile: 16,
+                    desktop: 40
+                },
+                right: {
+                    mobile: 16,
+                    desktop: 40
+                }
+            }
         }
     });

package/dist/skins/defaults.d.ts

@@ -1,4 +1,5 @@
-import type { BorderRadiiConfig, TextPresetsConfig, ThemeVariantsConfig } from './types';
+import type { BorderRadiiConfig, SpacingConfig, TextPresetsConfig, ThemeVariantsConfig } from './types';
 export declare const defaultTextPresetsConfig: TextPresetsConfig;
 export declare const defaultBorderRadiiConfig: BorderRadiiConfig;
 export declare const defaultThemeVariantsConfig: ThemeVariantsConfig;
+export declare const defaultSpacing: SpacingConfig;

package/dist/skins/defaults.js

@@ -12,6 +12,9 @@ _export(exports, {
     get defaultBorderRadiiConfig () {
         return i;
     },
+    get defaultSpacing () {
+        return o;
+    },
     get defaultTextPresetsConfig () {
         return e;
     },
@@ -368,4 +371,119 @@ const e = {
 }, t = {
     brandLoadingScreen: "inverse",
     successFeedback: "inverse"
+}, o = {
+    buttonDefaultPadding: {
+        left: {
+            mobile: 16,
+            desktop: 16
+        },
+        right: {
+            mobile: 16,
+            desktop: 16
+        }
+    },
+    buttonSmallPadding: {
+        left: {
+            mobile: 8,
+            desktop: 12
+        },
+        right: {
+            mobile: 8,
+            desktop: 12
+        }
+    },
+    cardDefaultPadding: {
+        top: {
+            mobile: 16,
+            desktop: 16
+        },
+        bottom: {
+            mobile: 16,
+            desktop: 16
+        },
+        left: {
+            mobile: 16,
+            desktop: 16
+        },
+        right: {
+            mobile: 16,
+            desktop: 16
+        }
+    },
+    inputPadding: {
+        top: {
+            mobile: 9,
+            desktop: 3
+        },
+        bottom: {
+            mobile: 9,
+            desktop: 3
+        }
+    },
+    tagPadding: {
+        top: {
+            mobile: 2,
+            desktop: 2
+        },
+        bottom: {
+            mobile: 2,
+            desktop: 2
+        }
+    },
+    feedbackScreenPadding: {
+        top: {
+            mobile: 64,
+            desktop: 40
+        },
+        bottom: {
+            mobile: 16,
+            desktop: 40
+        },
+        left: {
+            mobile: 16,
+            desktop: 40
+        },
+        right: {
+            mobile: 16,
+            desktop: 40
+        }
+    },
+    heroPadding: {
+        top: {
+            mobile: 16,
+            desktop: 56
+        },
+        bottom: {
+            mobile: 16,
+            desktop: 56
+        }
+    },
+    headerPadding: {
+        top: {
+            mobile: 16,
+            desktop: 48
+        },
+        bottom: {
+            mobile: 16,
+            desktop: 48
+        }
+    },
+    drawerPadding: {
+        top: {
+            mobile: 32,
+            desktop: 32
+        },
+        bottom: {
+            mobile: 16,
+            desktop: 32
+        },
+        left: {
+            mobile: 16,
+            desktop: 24
+        },
+        right: {
+            mobile: 16,
+            desktop: 24
+        }
+    }
 };

package/dist/skins/esimflag.js

@@ -90,6 +90,14 @@ const e = {
             backgroundBrandBottom: e.purple,
             appBarBackground: e.white,
             navigationBarBackground: e.blue55,
+            backgroundDropZoneHover: (0, _color.applyAlpha)(e.blue55, 0.05),
+            backgroundDropZoneDragover: (0, _color.applyAlpha)(e.blue55, 0.08),
+            backgroundDropZoneBrandHover: (0, _color.applyAlpha)(e.blue55, 0.2),
+            backgroundDropZoneBrandDragover: (0, _color.applyAlpha)(e.blue55, 0.4),
+            backgroundDropZoneNegativeHover: (0, _color.applyAlpha)(e.white, 0.1),
+            backgroundDropZoneNegativeDragover: (0, _color.applyAlpha)(e.white, 0.17),
+            backgroundDropZoneMediaHover: (0, _color.applyAlpha)(e.blue55, 0.2),
+            backgroundDropZoneMediaDragover: (0, _color.applyAlpha)(e.blue55, 0.4),
             skeletonWave: e.grey2,
             borderLow: e.grey1,
             border: e.grey3,
@@ -368,6 +376,14 @@ const e = {
             appBarBackground: e.darkModeGrey,
             navigationBarBackground: e.darkModeBlack,
             skeletonWave: e.grey6,
+            backgroundDropZoneHover: (0, _color.applyAlpha)(e.white, 0.05),
+            backgroundDropZoneDragover: (0, _color.applyAlpha)(e.white, 0.08),
+            backgroundDropZoneBrandHover: (0, _color.applyAlpha)(e.white, 0.05),
+            backgroundDropZoneBrandDragover: (0, _color.applyAlpha)(e.white, 0.08),
+            backgroundDropZoneNegativeHover: (0, _color.applyAlpha)(e.white, 0.15),
+            backgroundDropZoneNegativeDragover: (0, _color.applyAlpha)(e.white, 0.08),
+            backgroundDropZoneMediaHover: (0, _color.applyAlpha)(e.white, 0.03),
+            backgroundDropZoneMediaDragover: (0, _color.applyAlpha)(e.white, 0.05),
             borderLow: e.darkModeBlack,
             border: e.darkModeGrey,
             borderHigh: e.grey5,
@@ -969,5 +985,121 @@ const e = {
         themeVariants: {
             successFeedback: "inverse",
             brandLoadingScreen: "inverse"
+        },
+        spacing: {
+            buttonDefaultPadding: {
+                left: {
+                    mobile: 16,
+                    desktop: 16
+                },
+                right: {
+                    mobile: 16,
+                    desktop: 16
+                }
+            },
+            buttonSmallPadding: {
+                left: {
+                    mobile: 12,
+                    desktop: 12
+                },
+                right: {
+                    mobile: 12,
+                    desktop: 12
+                }
+            },
+            cardDefaultPadding: {
+                top: {
+                    mobile: 16,
+                    desktop: 24
+                },
+                bottom: {
+                    mobile: 16,
+                    desktop: 24
+                },
+                left: {
+                    mobile: 16,
+                    desktop: 24
+                },
+                right: {
+                    mobile: 16,
+                    desktop: 24
+                }
+            },
+            inputPadding: {
+                top: {
+                    mobile: 8,
+                    desktop: 8
+                },
+                bottom: {
+                    mobile: 8,
+                    desktop: 8
+                }
+            },
+            tagPadding: {
+                top: {
+                    mobile: 4,
+                    desktop: 4
+                },
+                bottom: {
+                    mobile: 4,
+                    desktop: 4
+                }
+            },
+            feedbackScreenPadding: {
+                top: {
+                    mobile: 64,
+                    desktop: 64
+                },
+                bottom: {
+                    mobile: 16,
+                    desktop: 64
+                },
+                left: {
+                    mobile: 16,
+                    desktop: 64
+                },
+                right: {
+                    mobile: 16,
+                    desktop: 64
+                }
+            },
+            heroPadding: {
+                top: {
+                    mobile: 24,
+                    desktop: 56
+                },
+                bottom: {
+                    mobile: 24,
+                    desktop: 56
+                }
+            },
+            headerPadding: {
+                top: {
+                    mobile: 24,
+                    desktop: 48
+                },
+                bottom: {
+                    mobile: 24,
+                    desktop: 48
+                }
+            },
+            drawerPadding: {
+                top: {
+                    mobile: 32,
+                    desktop: 40
+                },
+                bottom: {
+                    mobile: 16,
+                    desktop: 24
+                },
+                left: {
+                    mobile: 16,
+                    desktop: 40
+                },
+                right: {
+                    mobile: 16,
+                    desktop: 40
+                }
+            }
         }
     });

package/dist/skins/movistar-new.js

@@ -97,6 +97,14 @@ const e = {
             backgroundBrandBottom: e.movistarBlue,
             appBarBackground: e.white,
             navigationBarBackground: e.movistarBlue,
+            backgroundDropZoneHover: (0, _color.applyAlpha)(e.movistarBlue, 0.05),
+            backgroundDropZoneDragover: (0, _color.applyAlpha)(e.movistarBlue, 0.08),
+            backgroundDropZoneBrandHover: (0, _color.applyAlpha)(e.movistarBlack, 0.08),
+            backgroundDropZoneBrandDragover: (0, _color.applyAlpha)(e.movistarBlack, 0.1),
+            backgroundDropZoneNegativeHover: (0, _color.applyAlpha)(e.white, 0.1),
+            backgroundDropZoneNegativeDragover: (0, _color.applyAlpha)(e.white, 0.17),
+            backgroundDropZoneMediaHover: (0, _color.applyAlpha)(e.movistarBlack, 0.2),
+            backgroundDropZoneMediaDragover: (0, _color.applyAlpha)(e.movistarBlack, 0.4),
             skeletonWave: e.grey200,
             borderLow: e.grey100,
             border: e.grey300,
@@ -374,6 +382,14 @@ const e = {
             backgroundBrandBottom: e.darkModeBlack,
             appBarBackground: e.darkModeGrey,
             navigationBarBackground: e.darkModeBlack,
+            backgroundDropZoneHover: (0, _color.applyAlpha)(e.white, 0.05),
+            backgroundDropZoneDragover: (0, _color.applyAlpha)(e.white, 0.08),
+            backgroundDropZoneBrandHover: (0, _color.applyAlpha)(e.white, 0.03),
+            backgroundDropZoneBrandDragover: (0, _color.applyAlpha)(e.white, 0.05),
+            backgroundDropZoneNegativeHover: (0, _color.applyAlpha)(e.white, 0.03),
+            backgroundDropZoneNegativeDragover: (0, _color.applyAlpha)(e.white, 0.05),
+            backgroundDropZoneMediaHover: (0, _color.applyAlpha)(e.white, 0.03),
+            backgroundDropZoneMediaDragover: (0, _color.applyAlpha)(e.white, 0.05),
             skeletonWave: e.grey600,
             borderLow: e.darkModeBlack,
             border: e.darkModeGrey,
@@ -774,8 +790,8 @@ const e = {
             },
             inputValue: {
                 lineHeight: {
-                    desktop: 24,
-                    mobile: 24
+                    desktop: 22,
+                    mobile: 22
                 },
                 size: {
                     desktop: 16,
@@ -976,5 +992,121 @@ const e = {
         themeVariants: {
             successFeedback: "inverse",
             brandLoadingScreen: "default"
+        },
+        spacing: {
+            buttonDefaultPadding: {
+                left: {
+                    mobile: 16,
+                    desktop: 16
+                },
+                right: {
+                    mobile: 16,
+                    desktop: 16
+                }
+            },
+            buttonSmallPadding: {
+                left: {
+                    mobile: 8,
+                    desktop: 12
+                },
+                right: {
+                    mobile: 8,
+                    desktop: 12
+                }
+            },
+            cardDefaultPadding: {
+                top: {
+                    mobile: 16,
+                    desktop: 16
+                },
+                bottom: {
+                    mobile: 16,
+                    desktop: 16
+                },
+                left: {
+                    mobile: 16,
+                    desktop: 16
+                },
+                right: {
+                    mobile: 16,
+                    desktop: 16
+                }
+            },
+            inputPadding: {
+                top: {
+                    mobile: 9,
+                    desktop: 3
+                },
+                bottom: {
+                    mobile: 9,
+                    desktop: 3
+                }
+            },
+            tagPadding: {
+                top: {
+                    mobile: 2,
+                    desktop: 2
+                },
+                bottom: {
+                    mobile: 2,
+                    desktop: 2
+                }
+            },
+            feedbackScreenPadding: {
+                top: {
+                    mobile: 64,
+                    desktop: 40
+                },
+                bottom: {
+                    mobile: 16,
+                    desktop: 40
+                },
+                left: {
+                    mobile: 16,
+                    desktop: 40
+                },
+                right: {
+                    mobile: 16,
+                    desktop: 40
+                }
+            },
+            heroPadding: {
+                top: {
+                    mobile: 16,
+                    desktop: 56
+                },
+                bottom: {
+                    mobile: 16,
+                    desktop: 56
+                }
+            },
+            headerPadding: {
+                top: {
+                    mobile: 16,
+                    desktop: 48
+                },
+                bottom: {
+                    mobile: 16,
+                    desktop: 48
+                }
+            },
+            drawerPadding: {
+                top: {
+                    mobile: 32,
+                    desktop: 32
+                },
+                bottom: {
+                    mobile: 16,
+                    desktop: 32
+                },
+                left: {
+                    mobile: 16,
+                    desktop: 24
+                },
+                right: {
+                    mobile: 16,
+                    desktop: 24
+                }
+            }
         }
     });