@jobber/components-native 0.76.1-JOB-116234-c33b316.30 → 0.76.1-JOB-116234-6cadae0.33

package/dist/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@jobber/components-native",
-    "version": "0.76.1-JOB-116234-c33b316.30+c33b3167",
+    "version": "0.76.1-JOB-116234-6cadae0.33+6cadae01",
     "license": "MIT",
     "description": "React Native implementation of Atlantis",
     "repository": {
@@ -80,5 +80,5 @@
         "react-native-safe-area-context": "^4.5.2",
         "react-native-svg": ">=12.0.0"
     },
-    "gitHead": "c33b3167c0b220f060d1fe7ad6f48db97af8ea15"
+    "gitHead": "6cadae0138cf0633adc31d349b1f03dc50776679"
 }

package/dist/src/BottomSheet/BottomSheet.style.js

@@ -1,9 +1,8 @@
 import { Dimensions, StyleSheet } from "react-native";
-import { tokens as staticTokens } from "../utils/design";
 import { buildThemedStyles } from "../AtlantisThemeContext";
 const { height } = Dimensions.get("window");
-const modalBorderRadius = staticTokens["radius-larger"];
 export const useStyles = buildThemedStyles(tokens => {
+    const modalBorderRadius = tokens["radius-larger"];
     return {
         overlayModalize: {
             backgroundColor: "transparent",

package/dist/src/Button/Button.style.js

@@ -29,7 +29,7 @@ export const useStyles = buildThemedStyles(tokens => {
         },
         base: {
             minHeight: baseButtonHeight,
-            // paddingHorizontal: tokens["space-base"],
+            paddingHorizontal: tokens["space-base"],
         },
         small: {
             minHeight: smallButtonHeight,

package/dist/src/Checkbox/Checkbox.style.js

@@ -1,7 +1,6 @@
-import { tokens as staticTokens } from "../utils/design";
 import { buildThemedStyles } from "../AtlantisThemeContext";
-const checkboxDimensions = staticTokens["space-large"] + staticTokens["space-smaller"];
 export const useStyles = buildThemedStyles(tokens => {
+    const checkboxDimensions = tokens["space-large"] + tokens["space-smaller"];
     return {
         container: {
             width: "100%",

package/dist/src/Chip/Chip.style.js

@@ -1,7 +1,6 @@
-import { tokens as staticTokens } from "../utils/design";
 import { buildThemedStyles } from "../AtlantisThemeContext";
-const chipHeight = staticTokens["space-larger"] + staticTokens["space-small"];
 export const useStyles = buildThemedStyles(tokens => {
+    const chipHeight = tokens["space-larger"] + tokens["space-small"];
     return {
         container: {
             alignItems: "center",

package/dist/src/ContentOverlay/ContentOverlay.style.js

@@ -1,8 +1,7 @@
-import { tokens as staticTokens } from "../utils/design";
 import { buildThemedStyles } from "../AtlantisThemeContext";
-const modalBorderRadius = staticTokens["radius-larger"];
-const titleOffsetFromHandle = staticTokens["space-base"];
 export const useStyles = buildThemedStyles(tokens => {
+    const modalBorderRadius = tokens["radius-larger"];
+    const titleOffsetFromHandle = tokens["space-base"];
     return {
         handle: {
             width: tokens["space-largest"],

package/dist/src/InputFieldWrapper/CommonInputStyles.style.js

@@ -1,50 +1,48 @@
 import { StyleSheet } from "react-native";
 import { buildThemedStyles, } from "../AtlantisThemeContext";
-import { getTypographyStyles, 
-// eslint-disable-next-line import/no-deprecated
-typographyStyles as staticTypographyStyles, } from "../Typography";
+import { getTypographyStyles } from "../Typography";
 import { tokens as staticTokens } from "../utils/design";
-export const createCommonInputTokens = (tokens, typographyStyles) => ({
-    input: {
-        width: "100%",
-        flexShrink: 1,
-        flexGrow: 1,
-        color: tokens["color-text"],
-        fontFamily: typographyStyles.baseRegularRegular.fontFamily,
-        fontSize: typographyStyles.defaultSize.fontSize,
-        letterSpacing: typographyStyles.baseLetterSpacing.letterSpacing,
-        minHeight: tokens["space-largest"] + tokens["space-small"],
-        padding: 0,
-    },
-    inputEmpty: {
-        paddingTop: 0,
-    },
-    inputDisabled: {
-        color: typographyStyles.disabled.color,
-    },
-    container: {
-        paddingLeft: tokens["space-base"],
-        marginVertical: tokens["space-smaller"],
-        backgroundColor: tokens["color-surface"],
-        minHeight: tokens["space-largest"] + tokens["space-small"],
-        flexDirection: "row",
-        justifyContent: "space-between",
-        width: "100%",
-        borderColor: tokens["color-border"],
-        borderStyle: "solid",
-        borderWidth: tokens["border-base"],
-        borderRadius: tokens["radius-base"],
-    },
-});
+export const createCommonInputTokens = (tokens) => {
+    const typographyStyles = getTypographyStyles(tokens);
+    return {
+        input: {
+            width: "100%",
+            flexShrink: 1,
+            flexGrow: 1,
+            color: tokens["color-text"],
+            fontFamily: typographyStyles.baseRegularRegular.fontFamily,
+            fontSize: typographyStyles.defaultSize.fontSize,
+            letterSpacing: typographyStyles.baseLetterSpacing.letterSpacing,
+            minHeight: tokens["space-largest"] + tokens["space-small"],
+            padding: 0,
+        },
+        inputEmpty: {
+            paddingTop: 0,
+        },
+        inputDisabled: {
+            color: typographyStyles.disabled.color,
+        },
+        container: {
+            paddingLeft: tokens["space-base"],
+            marginVertical: tokens["space-smaller"],
+            backgroundColor: tokens["color-surface"],
+            minHeight: tokens["space-largest"] + tokens["space-small"],
+            flexDirection: "row",
+            justifyContent: "space-between",
+            width: "100%",
+            borderColor: tokens["color-border"],
+            borderStyle: "solid",
+            borderWidth: tokens["border-base"],
+            borderRadius: tokens["radius-base"],
+        },
+    };
+};
 /**
  * @deprecated Use useCommonInputStyles instead
  */
-export const commonInputStyles = StyleSheet.create(
-// eslint-disable-next-line import/no-deprecated
-createCommonInputTokens(staticTokens, staticTypographyStyles));
+export const commonInputStyles = StyleSheet.create(createCommonInputTokens(staticTokens));
 export const getCommonInputStyles = (tokens) => {
-    const typographyStyles = getTypographyStyles(tokens);
-    return createCommonInputTokens(tokens, typographyStyles);
+    return createCommonInputTokens(tokens);
 };
 export const useCommonInputStyles = buildThemedStyles(tokens => {
     return getCommonInputStyles(tokens);

package/dist/src/Menu/components/Overlay/Overlay.style.js

@@ -1,17 +1,8 @@
-import { Dimensions } from "react-native";
+import { Dimensions, StyleSheet } from "react-native";
 import { buildThemedStyles } from "../../../AtlantisThemeContext";
 const { height } = Dimensions.get("window");
 export const useStyles = buildThemedStyles(tokens => {
     return {
-        overlay: {
-            position: "absolute",
-            top: 0,
-            left: 0,
-            right: 0,
-            bottom: 0,
-            backgroundColor: tokens["color-overlay"],
-            opacity: 0,
-            height,
-        },
+        overlay: Object.assign(Object.assign({}, StyleSheet.absoluteFillObject), { backgroundColor: tokens["color-overlay"], opacity: 0, height }),
     };
 });

package/dist/src/Select/Select.style.js

@@ -14,14 +14,17 @@ export const useStyles = buildThemedStyles(tokens => {
                 borderWidth: 0,
             },
         ]),
-        input: {
-            flexDirection: "row",
-            flexGrow: 0,
-            paddingTop: tokens["space-smaller"],
-            minHeight: 0,
-            minWidth: "100%",
-            paddingRight: tokens["space-small"],
-        },
+        input: StyleSheet.flatten([
+            commonInputStyles.input,
+            {
+                flexDirection: "row",
+                flexGrow: 0,
+                paddingTop: tokens["space-smaller"],
+                minHeight: 0,
+                minWidth: "100%",
+                paddingRight: tokens["space-small"],
+            },
+        ]),
         value: {
             flexGrow: 1,
             flexShrink: 1,

package/dist/src/Typography/Typography.js

@@ -14,7 +14,7 @@ const maxNumberOfLines = {
 };
 export const Typography = React.memo(InternalTypography);
 // eslint-disable-next-line max-statements
-function InternalTypography({ fontFamily, fontStyle, fontWeight, transform, color, align, size = "default", children, maxLines = "unlimited", allowFontScaling = true, maxFontScaleSize, adjustsFontSizeToFit = false, lineHeight, letterSpacing, reverseTheme = false, hideFromScreenReader = false, accessibilityRole = "text", strikeThrough = false, underline, UNSAFE_style, selectable = true, }) {
+function InternalTypography({ fontFamily, fontStyle, fontWeight, transform, color, align, size = "default", children, maxLines = "unlimited", allowFontScaling = true, maxFontScaleSize, adjustsFontSizeToFit = false, lineHeight, letterSpacing = "base", reverseTheme = false, hideFromScreenReader = false, accessibilityRole = "text", strikeThrough = false, underline, UNSAFE_style, selectable = true, }) {
     const styles = useTypographyStyles();
     const sizeAndHeight = getSizeAndHeightStyle(size, styles, lineHeight);
     const style = [
@@ -102,6 +102,6 @@ function getSizeAndHeightStyle(textSize, styles, lineHeightOverwrite) {
     }
     return fontSize;
 }
-function getLetterSpacingStyle(letterSpacing = "base", styles) {
+function getLetterSpacingStyle(letterSpacing, styles) {
     return styles[`${letterSpacing}LetterSpacing`];
 }