npm - @hero-design/rn - Versions diffs - 7.22.2 → 7.22.3 - Mend

@hero-design/rn 7.22.2 → 7.22.3

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 (117) hide show

package/src/components/Spinner/__tests__/__snapshots__/AnimatedSpinner.spec.tsx.snap CHANGED Viewed

@@ -35,9 +35,10 @@ exports[`AnimatedSpinner renders correctly 1`] = `
       style={
         Array [
           Object {
-            "backgroundColor": "#795e90",
+            "backgroundColor": "#001f23",
             "borderRadius": 999,
             "height": 16,
+            "opacity": 1,
             "width": 16,
           },
           Object {},
@@ -52,10 +53,11 @@ exports[`AnimatedSpinner renders correctly 1`] = `
       style={
         Array [
           Object {
-            "backgroundColor": "#a08cb0",
+            "backgroundColor": "#001f23",
             "borderRadius": 999,
             "height": 16,
             "marginLeft": 8,
+            "opacity": 0.75,
             "width": 16,
           },
           Object {},
@@ -86,9 +88,10 @@ exports[`AnimatedSpinner renders correctly 1`] = `
       style={
         Array [
           Object {
-            "backgroundColor": "#d9d1df",
+            "backgroundColor": "#001f23",
             "borderRadius": 999,
             "height": 16,
+            "opacity": 0.5,
             "width": 16,
           },
           Object {},
@@ -103,10 +106,11 @@ exports[`AnimatedSpinner renders correctly 1`] = `
       style={
         Array [
           Object {
-            "backgroundColor": "#ece8ef",
+            "backgroundColor": "#001f23",
             "borderRadius": 999,
             "height": 16,
             "marginLeft": 8,
+            "opacity": 0.25,
             "width": 16,
           },
           Object {},

package/src/components/Spinner/__tests__/__snapshots__/StyledSpinner.spec.tsx.snap CHANGED Viewed

@@ -47,9 +47,10 @@ exports[`StyledSpinnerContainer renders correctly in medium size 1`] = `
         style={
           Array [
             Object {
-              "backgroundColor": "#795e90",
+              "backgroundColor": "#001f23",
               "borderRadius": 999,
               "height": 16,
+              "opacity": 1,
               "width": 16,
             },
             Object {},
@@ -64,10 +65,11 @@ exports[`StyledSpinnerContainer renders correctly in medium size 1`] = `
         style={
           Array [
             Object {
-              "backgroundColor": "#a08cb0",
+              "backgroundColor": "#001f23",
               "borderRadius": 999,
               "height": 16,
               "marginLeft": 8,
+              "opacity": 0.75,
               "width": 16,
             },
             Object {},
@@ -98,9 +100,10 @@ exports[`StyledSpinnerContainer renders correctly in medium size 1`] = `
         style={
           Array [
             Object {
-              "backgroundColor": "#d9d1df",
+              "backgroundColor": "#001f23",
               "borderRadius": 999,
               "height": 16,
+              "opacity": 0.5,
               "width": 16,
             },
             Object {},
@@ -115,10 +118,11 @@ exports[`StyledSpinnerContainer renders correctly in medium size 1`] = `
         style={
           Array [
             Object {
-              "backgroundColor": "#ece8ef",
+              "backgroundColor": "#001f23",
               "borderRadius": 999,
               "height": 16,
               "marginLeft": 8,
+              "opacity": 0.25,
               "width": 16,
             },
             Object {},
@@ -179,9 +183,10 @@ exports[`StyledSpinnerContainer renders correctly in small size 1`] = `
         style={
           Array [
             Object {
-              "backgroundColor": "#795e90",
+              "backgroundColor": "#001f23",
               "borderRadius": 999,
               "height": 8,
+              "opacity": 1,
               "width": 8,
             },
             Object {},
@@ -196,10 +201,11 @@ exports[`StyledSpinnerContainer renders correctly in small size 1`] = `
         style={
           Array [
             Object {
-              "backgroundColor": "#a08cb0",
+              "backgroundColor": "#001f23",
               "borderRadius": 999,
               "height": 8,
               "marginLeft": 4,
+              "opacity": 0.75,
               "width": 8,
             },
             Object {},
@@ -230,9 +236,10 @@ exports[`StyledSpinnerContainer renders correctly in small size 1`] = `
         style={
           Array [
             Object {
-              "backgroundColor": "#d9d1df",
+              "backgroundColor": "#001f23",
               "borderRadius": 999,
               "height": 8,
+              "opacity": 0.5,
               "width": 8,
             },
             Object {},
@@ -247,10 +254,11 @@ exports[`StyledSpinnerContainer renders correctly in small size 1`] = `
         style={
           Array [
             Object {
-              "backgroundColor": "#ece8ef",
+              "backgroundColor": "#001f23",
               "borderRadius": 999,
               "height": 8,
               "marginLeft": 4,
+              "opacity": 0.25,
               "width": 8,
             },
             Object {},
@@ -333,9 +341,10 @@ exports[`StyledSpinnerText renders correctly when position is bottomLeft, size i
   style={
     Array [
       Object {
-        "backgroundColor": "#d9d1df",
+        "backgroundColor": "#001f23",
         "borderRadius": 999,
         "height": 16,
+        "opacity": 0.5,
         "width": 16,
       },
       undefined,
@@ -351,9 +360,10 @@ exports[`StyledSpinnerText renders correctly when position is bottomLeft, size i
   style={
     Array [
       Object {
-        "backgroundColor": "#d9d1df",
+        "backgroundColor": "#001f23",
         "borderRadius": 999,
         "height": 8,
+        "opacity": 0.5,
         "width": 8,
       },
       undefined,
@@ -369,10 +379,11 @@ exports[`StyledSpinnerText renders correctly when position is bottomRight, size
   style={
     Array [
       Object {
-        "backgroundColor": "#ece8ef",
+        "backgroundColor": "#001f23",
         "borderRadius": 999,
         "height": 16,
         "marginLeft": 8,
+        "opacity": 0.25,
         "width": 16,
       },
       undefined,
@@ -388,10 +399,11 @@ exports[`StyledSpinnerText renders correctly when position is bottomRight, size
   style={
     Array [
       Object {
-        "backgroundColor": "#ece8ef",
+        "backgroundColor": "#001f23",
         "borderRadius": 999,
         "height": 8,
         "marginLeft": 4,
+        "opacity": 0.25,
         "width": 8,
       },
       undefined,
@@ -407,9 +419,10 @@ exports[`StyledSpinnerText renders correctly when position is topLeft, size is m
   style={
     Array [
       Object {
-        "backgroundColor": "#795e90",
+        "backgroundColor": "#001f23",
         "borderRadius": 999,
         "height": 16,
+        "opacity": 1,
         "width": 16,
       },
       undefined,
@@ -425,9 +438,10 @@ exports[`StyledSpinnerText renders correctly when position is topLeft, size is s
   style={
     Array [
       Object {
-        "backgroundColor": "#795e90",
+        "backgroundColor": "#001f23",
         "borderRadius": 999,
         "height": 8,
+        "opacity": 1,
         "width": 8,
       },
       undefined,
@@ -443,10 +457,11 @@ exports[`StyledSpinnerText renders correctly when position is topRight, size is
   style={
     Array [
       Object {
-        "backgroundColor": "#a08cb0",
+        "backgroundColor": "#001f23",
         "borderRadius": 999,
         "height": 16,
         "marginLeft": 8,
+        "opacity": 0.75,
         "width": 16,
       },
       undefined,
@@ -462,10 +477,11 @@ exports[`StyledSpinnerText renders correctly when position is topRight, size is
   style={
     Array [
       Object {
-        "backgroundColor": "#a08cb0",
+        "backgroundColor": "#001f23",
         "borderRadius": 999,
         "height": 8,
         "marginLeft": 4,
+        "opacity": 0.75,
         "width": 8,
       },
       undefined,

package/src/components/Spinner/__tests__/__snapshots__/index.spec.tsx.snap CHANGED Viewed

@@ -56,9 +56,10 @@ exports[`Spinner renders correctly 1`] = `
           style={
             Array [
               Object {
-                "backgroundColor": "#795e90",
+                "backgroundColor": "#001f23",
                 "borderRadius": 999,
                 "height": 16,
+                "opacity": 1,
                 "width": 16,
               },
               Object {},
@@ -73,10 +74,11 @@ exports[`Spinner renders correctly 1`] = `
           style={
             Array [
               Object {
-                "backgroundColor": "#a08cb0",
+                "backgroundColor": "#001f23",
                 "borderRadius": 999,
                 "height": 16,
                 "marginLeft": 8,
+                "opacity": 0.75,
                 "width": 16,
               },
               Object {},
@@ -107,9 +109,10 @@ exports[`Spinner renders correctly 1`] = `
           style={
             Array [
               Object {
-                "backgroundColor": "#d9d1df",
+                "backgroundColor": "#001f23",
                 "borderRadius": 999,
                 "height": 16,
+                "opacity": 0.5,
                 "width": 16,
               },
               Object {},
@@ -124,10 +127,11 @@ exports[`Spinner renders correctly 1`] = `
           style={
             Array [
               Object {
-                "backgroundColor": "#ece8ef",
+                "backgroundColor": "#001f23",
                 "borderRadius": 999,
                 "height": 16,
                 "marginLeft": 8,
+                "opacity": 0.25,
                 "width": 16,
               },
               Object {},

package/src/components/Switch/__tests__/__snapshots__/StyledSwitch.spec.tsx.snap CHANGED Viewed

@@ -21,7 +21,7 @@ exports[`StyledWrapper renders correct style with variant checked 1`] = `
   style={
     Array [
       Object {
-        "backgroundColor": "#8505a2",
+        "backgroundColor": "#401960",
         "borderRadius": 999,
         "display": "flex",
         "height": 32,
@@ -42,7 +42,7 @@ exports[`StyledWrapper renders correct style with variant disabled-checked 1`] =
   style={
     Array [
       Object {
-        "backgroundColor": "#c282d1",
+        "backgroundColor": "#a08cb0",
         "borderRadius": 999,
         "display": "flex",
         "height": 32,
@@ -63,7 +63,7 @@ exports[`StyledWrapper renders correct style with variant disabled-unchecked 1`]
   style={
     Array [
       Object {
-        "backgroundColor": "#ccced1",
+        "backgroundColor": "#bfc1c5",
         "borderRadius": 999,
         "display": "flex",
         "height": 32,

package/src/components/Tabs/ScrollableTabs.tsx CHANGED Viewed

@@ -101,12 +101,9 @@ const ScrollableTab = ({
   return (
     <TabContainer style={containerStyle} testID={componentTestID}>
-      <HeaderTabWrapper
-        themeInsets={insets}
-        style={barStyle}
-        testID={componentTestID ? `${componentTestID}-tab-bar` : undefined}
-      >
+      <HeaderTabWrapper themeInsets={insets} style={barStyle}>
         <FlatList<TabType>
+          testID={componentTestID ? `${componentTestID}-tab-bar` : undefined}
           ref={flatListRef}
           horizontal
           data={tabs}

package/src/components/Tabs/__tests__/__snapshots__/ScrollableTabs.spec.tsx.snap CHANGED Viewed

@@ -239,7 +239,7 @@ exports[`Tabs.Scroll renders correctly 1`] = `
                   nativeID="animatedComponent"
                   style={
                     Object {
-                      "backgroundColor": "#ece8ef",
+                      "backgroundColor": "#e6e9e9",
                       "borderRadius": 8,
                       "flex": 1,
                       "transform": Array [

package/src/components/Tag/__tests__/__snapshots__/Tag.spec.tsx.snap CHANGED Viewed

@@ -5,7 +5,7 @@ exports[`Tag has archived style when intent is archived 1`] = `
   style={
     Array [
       Object {
-        "backgroundColor": "#f6f6f7",
+        "backgroundColor": "#f1f2f3",
         "borderColor": "#737479",
         "borderRadius": 4,
         "borderWidth": 1,

package/src/components/TextInput/__tests__/__snapshots__/StyledTextInput.spec.tsx.snap CHANGED Viewed

@@ -153,7 +153,7 @@ exports[`Label renders correctly with themeVariant readonly 1`] = `
       },
       Array [
         Object {
-          "color": "#808f91",
+          "color": "#bfc1c5",
         },
         undefined,
       ],
@@ -362,7 +362,7 @@ exports[`LabelInsideTextInput renders correctly with themeVariant readonly 1`] =
         Object {
           "alignContent": "center",
           "alignItems": "center",
-          "color": "#808f91",
+          "color": "#bfc1c5",
           "fontSize": 14,
           "textAlignVertical": "center",
         },
@@ -392,7 +392,7 @@ exports[`StyledAsteriskLabel renders correctly with themeVariant default 1`] = `
       },
       Array [
         Object {
-          "color": "#de350b",
+          "color": "#f46363",
         },
         undefined,
       ],
@@ -448,7 +448,7 @@ exports[`StyledAsteriskLabel renders correctly with themeVariant error 1`] = `
       },
       Array [
         Object {
-          "color": "#de350b",
+          "color": "#f46363",
         },
         undefined,
       ],
@@ -476,7 +476,7 @@ exports[`StyledAsteriskLabel renders correctly with themeVariant filled 1`] = `
       },
       Array [
         Object {
-          "color": "#de350b",
+          "color": "#f46363",
         },
         undefined,
       ],
@@ -504,7 +504,7 @@ exports[`StyledAsteriskLabel renders correctly with themeVariant focused 1`] = `
       },
       Array [
         Object {
-          "color": "#de350b",
+          "color": "#f46363",
         },
         undefined,
       ],
@@ -588,7 +588,7 @@ exports[`StyledContainer renders correctly with themeVariant error 1`] = `
   style={
     Array [
       Object {
-        "borderColor": "#de350b",
+        "borderColor": "#f46363",
         "borderRadius": 8,
         "borderWidth": 1,
         "marginVertical": 8,
@@ -668,7 +668,7 @@ exports[`StyledErrorMessage renders correctly 1`] = `
       },
       Array [
         Object {
-          "color": "#de350b",
+          "color": "#f46363",
           "fontSize": 12,
           "marginLeft": 4,
         },
@@ -816,7 +816,7 @@ exports[`StyledMaxLengthMessage renders correctly with themeVariant error 1`] =
       Array [
         Object {
           "alignSelf": "flex-end",
-          "color": "#de350b",
+          "color": "#f46363",
           "flex": 1,
           "flexGrow": 1,
           "fontSize": 12,
@@ -918,7 +918,7 @@ exports[`StyledMaxLengthMessage renders correctly with themeVariant readonly 1`]
       Array [
         Object {
           "alignSelf": "flex-end",
-          "color": "#808f91",
+          "color": "#bfc1c5",
           "flex": 1,
           "flexGrow": 1,
           "fontSize": 12,

package/src/components/TextInput/__tests__/__snapshots__/index.spec.tsx.snap CHANGED Viewed

@@ -58,7 +58,7 @@ exports[`TextInput defaultValue TextInput is idle renders correctly 1`] = `
             },
             Array [
               Object {
-                "color": "#de350b",
+                "color": "#f46363",
               },
               undefined,
             ],
@@ -298,7 +298,7 @@ exports[`TextInput defaultValue default Value and Value renders correctly with 2
             },
             Array [
               Object {
-                "color": "#de350b",
+                "color": "#f46363",
               },
               undefined,
             ],
@@ -654,7 +654,7 @@ exports[`TextInput error renders correctly 1`] = `
   style={
     Array [
       Object {
-        "borderColor": "#de350b",
+        "borderColor": "#f46363",
         "borderRadius": 8,
         "borderWidth": 1,
         "marginVertical": 8,
@@ -736,7 +736,7 @@ exports[`TextInput error renders correctly 1`] = `
               },
               Array [
                 Object {
-                  "color": "#de350b",
+                  "color": "#f46363",
                   "fontSize": 14,
                 },
                 undefined,
@@ -871,7 +871,7 @@ exports[`TextInput error renders correctly 1`] = `
               },
               Array [
                 Object {
-                  "color": "#de350b",
+                  "color": "#f46363",
                   "fontSize": 12,
                   "marginLeft": 4,
                 },
@@ -1151,7 +1151,7 @@ exports[`TextInput helper text renders correctly 1`] = `
               },
               Array [
                 Object {
-                  "color": "#de350b",
+                  "color": "#f46363",
                   "fontSize": 14,
                 },
                 undefined,
@@ -1539,7 +1539,7 @@ exports[`TextInput idle with suffix and prefix are React Element renders correct
               },
               Array [
                 Object {
-                  "color": "#de350b",
+                  "color": "#f46363",
                   "fontSize": 14,
                 },
                 undefined,
@@ -1801,7 +1801,7 @@ exports[`TextInput max length renders correctly 1`] = `
   style={
     Array [
       Object {
-        "borderColor": "#de350b",
+        "borderColor": "#f46363",
         "borderRadius": 8,
         "borderWidth": 1,
         "marginVertical": 8,
@@ -1853,7 +1853,7 @@ exports[`TextInput max length renders correctly 1`] = `
             },
             Array [
               Object {
-                "color": "#de350b",
+                "color": "#f46363",
               },
               undefined,
             ],
@@ -2000,7 +2000,7 @@ exports[`TextInput max length renders correctly 1`] = `
               },
               Array [
                 Object {
-                  "color": "#de350b",
+                  "color": "#f46363",
                   "fontSize": 12,
                   "marginLeft": 4,
                 },
@@ -2029,7 +2029,7 @@ exports[`TextInput max length renders correctly 1`] = `
             Array [
               Object {
                 "alignSelf": "flex-end",
-                "color": "#de350b",
+                "color": "#f46363",
                 "flex": 1,
                 "flexGrow": 1,
                 "fontSize": 12,
@@ -2142,7 +2142,7 @@ exports[`TextInput placeholder TextInput is idle renders correctly 1`] = `
               },
               Array [
                 Object {
-                  "color": "#de350b",
+                  "color": "#f46363",
                   "fontSize": 14,
                 },
                 undefined,
@@ -2347,7 +2347,7 @@ exports[`TextInput readonly renders correctly 1`] = `
             },
             Array [
               Object {
-                "color": "#808f91",
+                "color": "#bfc1c5",
               },
               undefined,
             ],
@@ -2548,7 +2548,7 @@ exports[`TextInput required renders correctly 1`] = `
               },
               Array [
                 Object {
-                  "color": "#de350b",
+                  "color": "#f46363",
                   "fontSize": 14,
                 },
                 undefined,

package/src/components/TimePicker/__tests__/__snapshots__/TimePickerIOS.spec.tsx.snap CHANGED Viewed

@@ -488,7 +488,7 @@ exports[`TimePickerIOS renders correctly 1`] = `
                         style={
                           Array [
                             Object {
-                              "color": "#8505a2",
+                              "color": "#001f23",
                               "fontFamily": "BeVietnamPro-SemiBold",
                               "fontSize": 16,
                               "letterSpacing": 0.48,

package/src/components/Toast/ToastProvider.tsx CHANGED Viewed

@@ -20,9 +20,7 @@ const ToastProvider = ({
   position = 'top',
 }: ToastProviderProps) => {
   const toastRef = useRef<ToastControllerContextType>(null);
-  const [refState, setRefState] = useState<ToastControllerContextType>(
-    {} as ToastControllerContextType
-  );
+  const [refState, setRefState] = useState<ToastControllerContextType>(null);
   useEffect(() => {
     if (toastRef.current) {
@@ -38,7 +36,7 @@ const ToastProvider = ({
   return (
     <ToastContext.Provider value={refState}>
       <View style={{ flex: 1 }}>
-        {children}
+        {refState ? children : null}
         <ToastConfigContext.Provider value={config}>
           <ToastContainer
             ref={toastRef}