@utilitywarehouse/hearth-react-native 0.1.0 → 0.3.0

package/build/tokens/components/dark/tooltip.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+declare const _default: {
+    readonly backgroundColor: "#3f3f3f";
+    readonly borderRadius: 8;
+    readonly gapHorizontal: 8;
+    readonly gapVertical: 2;
+    readonly paddingHorizontal: 12;
+    readonly paddingVertical: 8;
+};
+export default _default;

package/build/tokens/components/dark/tooltip.js

@@ -0,0 +1,11 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+export default {
+    backgroundColor: '#3f3f3f',
+    borderRadius: 8,
+    gapHorizontal: 8,
+    gapVertical: 2,
+    paddingHorizontal: 12,
+    paddingVertical: 8,
+};

package/build/tokens/components/dark/top-navigation.d.ts

@@ -2,14 +2,9 @@
  * Do not edit directly, this file was auto-generated.
  */
 declare const _default: {
-    readonly emphasis: {
-        readonly backgroundColor: "#7a42c8";
-    };
     readonly gap: 0;
     readonly largeTitle: {
-        readonly gap: 2;
         readonly paddingBottom: 16;
-        readonly paddingHorizontal: 16;
         readonly paddingTop: 0;
     };
     readonly navigationBar: {
@@ -19,8 +14,5 @@ declare const _default: {
     };
     readonly paddingHorizontal: 0;
     readonly paddingVertical: 0;
-    readonly subtle: {
-        readonly backgroundColor: "#191917";
-    };
 };
 export default _default;

package/build/tokens/components/dark/top-navigation.js

@@ -2,14 +2,9 @@
  * Do not edit directly, this file was auto-generated.
  */
 export default {
-    emphasis: {
-        backgroundColor: '#7a42c8',
-    },
     gap: 0,
     largeTitle: {
-        gap: 2,
         paddingBottom: 16,
-        paddingHorizontal: 16,
         paddingTop: 0,
     },
     navigationBar: {
@@ -19,7 +14,4 @@ export default {
     },
     paddingHorizontal: 0,
     paddingVertical: 0,
-    subtle: {
-        backgroundColor: '#191917',
-    },
 };

package/build/tokens/components/light/accordion.d.ts

@@ -7,8 +7,6 @@ declare const _default: {
         readonly gap: 2;
     };
     readonly item: {
-        readonly backgroundColorActive: "#f1efe4";
-        readonly backgroundColorHover: "#f7f6eb";
         readonly content: {
             readonly gap: 16;
             readonly paddingBottom: 16;

package/build/tokens/components/light/accordion.js

@@ -7,8 +7,6 @@ export default {
         gap: 2,
     },
     item: {
-        backgroundColorActive: '#f1efe4',
-        backgroundColorHover: '#f7f6eb',
         content: {
             gap: 16,
             paddingBottom: 16,

package/build/tokens/components/light/alert.d.ts

@@ -2,26 +2,10 @@
  * Do not edit directly, this file was auto-generated.
  */
 declare const _default: {
-    readonly blue: {
-        readonly backgroundColor: "#bcddff";
-        readonly borderColor: "#1c6cd4";
-    };
     readonly borderRadius: 8;
     readonly borderWidth: 2;
     readonly contentGap: 4;
     readonly gap: 8;
-    readonly green: {
-        readonly backgroundColor: "#a2e2c3";
-        readonly borderColor: "#0f834a";
-    };
-    readonly orange: {
-        readonly backgroundColor: "#ffcca8";
-        readonly borderColor: "#cf5d00";
-    };
     readonly padding: 14;
-    readonly red: {
-        readonly backgroundColor: "#ffccc5";
-        readonly borderColor: "#de2612";
-    };
 };
 export default _default;

package/build/tokens/components/light/alert.js

@@ -2,25 +2,9 @@
  * Do not edit directly, this file was auto-generated.
  */
 export default {
-    blue: {
-        backgroundColor: '#bcddff',
-        borderColor: '#1c6cd4',
-    },
     borderRadius: 8,
     borderWidth: 2,
     contentGap: 4,
     gap: 8,
-    green: {
-        backgroundColor: '#a2e2c3',
-        borderColor: '#0f834a',
-    },
-    orange: {
-        backgroundColor: '#ffcca8',
-        borderColor: '#cf5d00',
-    },
     padding: 14,
-    red: {
-        backgroundColor: '#ffccc5',
-        borderColor: '#de2612',
-    },
 };

package/build/tokens/components/light/avatar.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+declare const _default: {
+    readonly image: {
+        readonly borderWidth: 1;
+    };
+    readonly md: {
+        readonly borderRadius: 8;
+        readonly height: 48;
+        readonly width: 48;
+    };
+    readonly sm: {
+        readonly borderRadius: 6;
+        readonly height: 32;
+        readonly width: 32;
+    };
+};
+export default _default;

package/build/tokens/components/light/avatar.js

@@ -0,0 +1,18 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+export default {
+    image: {
+        borderWidth: 1,
+    },
+    md: {
+        borderRadius: 8,
+        height: 48,
+        width: 48,
+    },
+    sm: {
+        borderRadius: 6,
+        height: 32,
+        width: 32,
+    },
+};

package/build/tokens/components/light/badge.d.ts

@@ -8,44 +8,17 @@ declare const _default: {
         readonly borderBottomRightRadius: 0;
     };
     readonly gap: 4;
+    readonly md: {
+        readonly height: 32;
+        readonly paddingVertical: 4;
+    };
     readonly outline: {
-        readonly blue: {
-            readonly color: "#1c6cd4";
-        };
-        readonly borderColor: "#d4d2c0";
         readonly borderWidth: 1;
-        readonly green: {
-            readonly color: "#0f834a";
-        };
-        readonly grey: {
-            readonly color: "#5f5c5b";
-        };
-        readonly orange: {
-            readonly color: "#ad4b00";
-        };
-        readonly red: {
-            readonly color: "#de2612";
-        };
     };
     readonly paddingHorizontal: 6;
-    readonly paddingVertical: 2;
-    readonly solid: {
-        readonly blue: {
-            readonly backgroundColor: "#1c6cd4";
-        };
-        readonly color: "#fcfbf2";
-        readonly green: {
-            readonly backgroundColor: "#0f834a";
-        };
-        readonly grey: {
-            readonly backgroundColor: "#5f5c5b";
-        };
-        readonly orange: {
-            readonly backgroundColor: "#ad4b00";
-        };
-        readonly red: {
-            readonly backgroundColor: "#de2612";
-        };
+    readonly sm: {
+        readonly height: 24;
+        readonly paddingVertical: 2;
     };
 };
 export default _default;

package/build/tokens/components/light/badge.js

@@ -8,43 +8,16 @@ export default {
         borderBottomRightRadius: 0,
     },
     gap: 4,
+    md: {
+        height: 32,
+        paddingVertical: 4,
+    },
     outline: {
-        blue: {
-            color: '#1c6cd4',
-        },
-        borderColor: '#d4d2c0',
         borderWidth: 1,
-        green: {
-            color: '#0f834a',
-        },
-        grey: {
-            color: '#5f5c5b',
-        },
-        orange: {
-            color: '#ad4b00',
-        },
-        red: {
-            color: '#de2612',
-        },
     },
     paddingHorizontal: 6,
-    paddingVertical: 2,
-    solid: {
-        blue: {
-            backgroundColor: '#1c6cd4',
-        },
-        color: '#fcfbf2',
-        green: {
-            backgroundColor: '#0f834a',
-        },
-        grey: {
-            backgroundColor: '#5f5c5b',
-        },
-        orange: {
-            backgroundColor: '#ad4b00',
-        },
-        red: {
-            backgroundColor: '#de2612',
-        },
+    sm: {
+        height: 24,
+        paddingVertical: 2,
     },
 };

package/build/tokens/components/light/banner.d.ts

@@ -13,13 +13,13 @@ declare const _default: {
             readonly imageMaxWidth: 240;
             readonly imageMinWidth: 160;
             readonly maxWidth: 680;
-            readonly minWidth: 288;
+            readonly minWidth: 240;
         };
         readonly imageHeight: 160;
         readonly padding: 16;
         readonly vertical: {
             readonly maxWidth: 504;
-            readonly minWidth: 288;
+            readonly minWidth: 240;
         };
     };
     readonly highlight: {
@@ -27,15 +27,6 @@ declare const _default: {
             readonly gap: 12;
         };
         readonly gap: 0;
-        readonly heading: {
-            readonly broadbandGreenBackgroundColor: "#8cba3b";
-            readonly cashbackLilacBackgroundColor: "#be7aeb";
-            readonly energyBlueBackgroundColor: "#6db5c3";
-            readonly insuranceOrangeBackgroundColor: "#ff7b00";
-            readonly mobileRoseBackgroundColor: "#ee6dbb";
-            readonly piggyPinkBackgroundColor: "#f295ff";
-            readonly yellowBackgroundColor: "#ffb921";
-        };
         readonly padding: 16;
     };
     readonly imageContainerBorderColor: "#101010";

package/build/tokens/components/light/banner.js

@@ -13,13 +13,13 @@ export default {
             imageMaxWidth: 240,
             imageMinWidth: 160,
             maxWidth: 680,
-            minWidth: 288,
+            minWidth: 240,
         },
         imageHeight: 160,
         padding: 16,
         vertical: {
             maxWidth: 504,
-            minWidth: 288,
+            minWidth: 240,
         },
     },
     highlight: {
@@ -27,15 +27,6 @@ export default {
             gap: 12,
         },
         gap: 0,
-        heading: {
-            broadbandGreenBackgroundColor: '#8cba3b',
-            cashbackLilacBackgroundColor: '#be7aeb',
-            energyBlueBackgroundColor: '#6db5c3',
-            insuranceOrangeBackgroundColor: '#ff7b00',
-            mobileRoseBackgroundColor: '#ee6dbb',
-            piggyPinkBackgroundColor: '#f295ff',
-            yellowBackgroundColor: '#ffb921',
-        },
         padding: 16,
     },
     imageContainerBorderColor: '#101010',

package/build/tokens/components/light/bottom-navigation.d.ts

@@ -2,12 +2,9 @@
  * Do not edit directly, this file was auto-generated.
  */
 declare const _default: {
-    readonly backgroundColor: "#fcfbf2";
-    readonly borderTopColor: "#d4d2c0";
     readonly borderTopWidth: 2;
     readonly gap: 0;
     readonly indicator: {
-        readonly backgroundColor: "#7a42c8";
         readonly borderRadius: 4;
         readonly height: 2;
     };
@@ -15,11 +12,9 @@ declare const _default: {
         readonly gap: 2;
         readonly icon: {
             readonly colorActive: "#7a42c8";
-            readonly colorDefault: "#101010";
         };
         readonly label: {
             readonly colorActive: "#7a42c8";
-            readonly colorDefault: "#101010";
         };
         readonly paddingBottom: 2;
         readonly paddingHorizontal: 0;

package/build/tokens/components/light/bottom-navigation.js

@@ -2,12 +2,9 @@
  * Do not edit directly, this file was auto-generated.
  */
 export default {
-    backgroundColor: '#fcfbf2',
-    borderTopColor: '#d4d2c0',
     borderTopWidth: 2,
     gap: 0,
     indicator: {
-        backgroundColor: '#7a42c8',
         borderRadius: 4,
         height: 2,
     },
@@ -15,11 +12,9 @@ export default {
         gap: 2,
         icon: {
             colorActive: '#7a42c8',
-            colorDefault: '#101010',
         },
         label: {
             colorActive: '#7a42c8',
-            colorDefault: '#101010',
         },
         paddingBottom: 2,
         paddingHorizontal: 0,

package/build/tokens/components/light/bottom-sheet.d.ts

@@ -2,12 +2,11 @@
  * Do not edit directly, this file was auto-generated.
  */
 declare const _default: {
-    readonly backgroundColor: "#ffffff";
     readonly borderTopLeftRadius: 16;
     readonly borderTopRightRadius: 16;
     readonly gap: 6;
     readonly handle: {
-        readonly backgroundColor: "#d1d0d0";
+        readonly backgroundColor: "#d3d3d3";
         readonly borderRadius: 6;
         readonly height: 5;
         readonly width: 36;

package/build/tokens/components/light/bottom-sheet.js

@@ -2,12 +2,11 @@
  * Do not edit directly, this file was auto-generated.
  */
 export default {
-    backgroundColor: '#ffffff',
     borderTopLeftRadius: 16,
     borderTopRightRadius: 16,
     gap: 6,
     handle: {
-        backgroundColor: '#d1d0d0',
+        backgroundColor: '#d3d3d3',
         borderRadius: 6,
         height: 5,
         width: 36,

package/build/tokens/components/light/breadcrumb.d.ts

@@ -2,7 +2,6 @@
  * Do not edit directly, this file was auto-generated.
  */
 declare const _default: {
-    readonly color: "#101010";
     readonly gap: 8;
 };
 export default _default;

package/build/tokens/components/light/breadcrumb.js

@@ -2,6 +2,5 @@
  * Do not edit directly, this file was auto-generated.
  */
 export default {
-    color: '#101010',
     gap: 8,
 };

package/build/tokens/components/light/button.d.ts

@@ -4,101 +4,16 @@
 declare const _default: {
     readonly borderRadius: 8;
     readonly borderWidth: 2;
-    readonly emphasis: {
-        readonly borderColor: "#101010";
-        readonly shadowColor: "#101010";
-        readonly yellow: {
-            readonly backgroundColor: "#ffb921";
-            readonly backgroundColorActive: "#d1950b";
-            readonly backgroundColorHover: "#eba400";
-            readonly foregroundColor: "#101010";
-        };
-    };
     readonly gap: 6;
-    readonly ghost: {
-        readonly green: {
-            readonly backgroundColorActive: "#c5edda";
-            readonly backgroundColorHover: "#e7f9f0";
-            readonly foregroundColor: "#04663a";
-        };
-        readonly grey: {
-            readonly backgroundColorActive: "#d1d0d0";
-            readonly backgroundColorHover: "#e7e6e6";
-            readonly foregroundColor: "#101010";
-            readonly inverted: {
-                readonly backgroundColorActive: "#3e3c3b";
-                readonly backgroundColorHover: "#464444";
-                readonly foregroundColor: "#fcfbf2";
-            };
-        };
-        readonly red: {
-            readonly backgroundColorActive: "#ffe3df";
-            readonly backgroundColorHover: "#fff3f1";
-            readonly foregroundColor: "#a4281e";
-        };
-    };
     readonly md: {
         readonly paddingHorizontal: 16;
         readonly paddingVertical: 12;
     };
     readonly minWidth: 80;
-    readonly outline: {
-        readonly green: {
-            readonly backgroundColorActive: "#c5edda";
-            readonly backgroundColorHover: "#e7f9f0";
-            readonly borderColor: "#04663a";
-            readonly foregroundColor: "#04663a";
-        };
-        readonly grey: {
-            readonly backgroundColorActive: "#d1d0d0";
-            readonly backgroundColorHover: "#e7e6e6";
-            readonly borderColor: "#101010";
-            readonly foregroundColor: "#101010";
-            readonly inverted: {
-                readonly backgroundColorActive: "#3e3c3b";
-                readonly backgroundColorHover: "#464444";
-                readonly borderColor: "#f6f5f5";
-                readonly foregroundColor: "#f6f5f5";
-            };
-        };
-        readonly red: {
-            readonly backgroundColorActive: "#ffe3df";
-            readonly backgroundColorHover: "#fff3f1";
-            readonly borderColor: "#a4281e";
-            readonly foregroundColor: "#a4281e";
-        };
-    };
+    readonly shadowColor: "#101010";
     readonly sm: {
         readonly paddingHorizontal: 16;
         readonly paddingVertical: 4;
     };
-    readonly solid: {
-        readonly borderColor: "#101010";
-        readonly green: {
-            readonly backgroundColor: "#0f834a";
-            readonly backgroundColorActive: "#074b2a";
-            readonly backgroundColorHover: "#04663a";
-            readonly foregroundColor: "#fcfbf2";
-        };
-        readonly red: {
-            readonly backgroundColor: "#de2612";
-            readonly backgroundColorActive: "#6b1f1a";
-            readonly backgroundColorHover: "#a4281e";
-            readonly foregroundColor: "#fcfbf2";
-        };
-        readonly yellow: {
-            readonly backgroundColor: "#ffb921";
-            readonly backgroundColorActive: "#d1950b";
-            readonly backgroundColorHover: "#eba400";
-            readonly foregroundColor: "#101010";
-            readonly inverted: {
-                readonly backgroundColor: "#ffb921";
-                readonly backgroundColorActive: "#d1950b";
-                readonly backgroundColorHover: "#eba400";
-                readonly borderColor: "#101010";
-                readonly foregroundColor: "#101010";
-            };
-        };
-    };
 };
 export default _default;

package/build/tokens/components/light/button.js

@@ -4,100 +4,15 @@
 export default {
     borderRadius: 8,
     borderWidth: 2,
-    emphasis: {
-        borderColor: '#101010',
-        shadowColor: '#101010',
-        yellow: {
-            backgroundColor: '#ffb921',
-            backgroundColorActive: '#d1950b',
-            backgroundColorHover: '#eba400',
-            foregroundColor: '#101010',
-        },
-    },
     gap: 6,
-    ghost: {
-        green: {
-            backgroundColorActive: '#c5edda',
-            backgroundColorHover: '#e7f9f0',
-            foregroundColor: '#04663a',
-        },
-        grey: {
-            backgroundColorActive: '#d1d0d0',
-            backgroundColorHover: '#e7e6e6',
-            foregroundColor: '#101010',
-            inverted: {
-                backgroundColorActive: '#3e3c3b',
-                backgroundColorHover: '#464444',
-                foregroundColor: '#fcfbf2',
-            },
-        },
-        red: {
-            backgroundColorActive: '#ffe3df',
-            backgroundColorHover: '#fff3f1',
-            foregroundColor: '#a4281e',
-        },
-    },
     md: {
         paddingHorizontal: 16,
         paddingVertical: 12,
     },
     minWidth: 80,
-    outline: {
-        green: {
-            backgroundColorActive: '#c5edda',
-            backgroundColorHover: '#e7f9f0',
-            borderColor: '#04663a',
-            foregroundColor: '#04663a',
-        },
-        grey: {
-            backgroundColorActive: '#d1d0d0',
-            backgroundColorHover: '#e7e6e6',
-            borderColor: '#101010',
-            foregroundColor: '#101010',
-            inverted: {
-                backgroundColorActive: '#3e3c3b',
-                backgroundColorHover: '#464444',
-                borderColor: '#f6f5f5',
-                foregroundColor: '#f6f5f5',
-            },
-        },
-        red: {
-            backgroundColorActive: '#ffe3df',
-            backgroundColorHover: '#fff3f1',
-            borderColor: '#a4281e',
-            foregroundColor: '#a4281e',
-        },
-    },
+    shadowColor: '#101010',
     sm: {
         paddingHorizontal: 16,
         paddingVertical: 4,
     },
-    solid: {
-        borderColor: '#101010',
-        green: {
-            backgroundColor: '#0f834a',
-            backgroundColorActive: '#074b2a',
-            backgroundColorHover: '#04663a',
-            foregroundColor: '#fcfbf2',
-        },
-        red: {
-            backgroundColor: '#de2612',
-            backgroundColorActive: '#6b1f1a',
-            backgroundColorHover: '#a4281e',
-            foregroundColor: '#fcfbf2',
-        },
-        yellow: {
-            backgroundColor: '#ffb921',
-            backgroundColorActive: '#d1950b',
-            backgroundColorHover: '#eba400',
-            foregroundColor: '#101010',
-            inverted: {
-                backgroundColor: '#ffb921',
-                backgroundColorActive: '#d1950b',
-                backgroundColorHover: '#eba400',
-                borderColor: '#101010',
-                foregroundColor: '#101010',
-            },
-        },
-    },
 };