@utilitywarehouse/hearth-react-native 0.8.2 → 0.10.0

package/build/components/index.d.ts

@@ -35,7 +35,9 @@ export * from './Input';
 export * from './Label';
 export * from './Link';
 export * from './List';
+export * from './Menu';
 export * from './Modal';
+export * from './PillGroup';
 export * from './ProgressStepper';
 export * from './Radio';
 export * from './RadioCard';
@@ -47,6 +49,7 @@ export * from './Switch';
 export * from './Tabs';
 export * from './Textarea';
 export * from './ThemedImage';
+export * from './Toast';
 export * from './ToggleButtonCard';
 export { FlatList, Image, KeyboardAvoidingView, ScrollView, SectionList, View } from 'react-native';
 export { Pressable } from 'react-native';

package/build/components/index.js

@@ -36,7 +36,9 @@ export * from './Input';
 export * from './Label';
 export * from './Link';
 export * from './List';
+export * from './Menu';
 export * from './Modal';
+export * from './PillGroup';
 export * from './ProgressStepper';
 export * from './Radio';
 export * from './RadioCard';
@@ -48,6 +50,7 @@ export * from './Switch';
 export * from './Tabs';
 export * from './Textarea';
 export * from './ThemedImage';
+export * from './Toast';
 export * from './ToggleButtonCard';
 export { FlatList, Image, KeyboardAvoidingView, ScrollView, SectionList, View } from 'react-native';
 export { Pressable } from 'react-native';

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

@@ -27,6 +27,9 @@ declare const _default: {
         readonly gap: 8;
         readonly group: {
             readonly gap: 12;
+            readonly heading: {
+                readonly gap: 2;
+            };
             readonly stack: {
                 readonly gap: 12;
             };

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

@@ -27,6 +27,9 @@ export default {
         gap: 8,
         group: {
             gap: 12,
+            heading: {
+                gap: 2,
+            },
             stack: {
                 gap: 12,
             },

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

@@ -17,7 +17,6 @@ export { default as carouselControl } from './carousel-control';
 export { default as checkbox } from './checkbox';
 export { default as datePicker } from './date-picker';
 export { default as descriptionList } from './description-list';
-export { default as dialog } from './dialog';
 export { default as divider } from './divider';
 export { default as drawer } from './drawer';
 export { default as expandableCard } from './expandable-card';
@@ -40,6 +39,7 @@ export { default as pill } from './pill';
 export { default as progressBar } from './progress-bar';
 export { default as progressStepper } from './progress-stepper';
 export { default as radio } from './radio';
+export { default as rating } from './rating';
 export { default as sectionHeader } from './section-header';
 export { default as segmentedControl } from './segmented-control';
 export { default as select } from './select';
@@ -48,6 +48,8 @@ export { default as spinner } from './spinner';
 export { default as switch } from './switch';
 export { default as table } from './table';
 export { default as tabs } from './tabs';
+export { default as timePicker } from './time-picker';
+export { default as timeline } from './timeline';
 export { default as toast } from './toast';
 export { default as toggleButton } from './toggle-button';
 export { default as tooltip } from './tooltip';

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

@@ -17,7 +17,6 @@ export { default as carouselControl } from './carousel-control';
 export { default as checkbox } from './checkbox';
 export { default as datePicker } from './date-picker';
 export { default as descriptionList } from './description-list';
-export { default as dialog } from './dialog';
 export { default as divider } from './divider';
 export { default as drawer } from './drawer';
 export { default as expandableCard } from './expandable-card';
@@ -40,6 +39,7 @@ export { default as pill } from './pill';
 export { default as progressBar } from './progress-bar';
 export { default as progressStepper } from './progress-stepper';
 export { default as radio } from './radio';
+export { default as rating } from './rating';
 export { default as sectionHeader } from './section-header';
 export { default as segmentedControl } from './segmented-control';
 export { default as select } from './select';
@@ -48,6 +48,8 @@ export { default as spinner } from './spinner';
 export { default as switch } from './switch';
 export { default as table } from './table';
 export { default as tabs } from './tabs';
+export { default as timePicker } from './time-picker';
+export { default as timeline } from './timeline';
 export { default as toast } from './toast';
 export { default as toggleButton } from './toggle-button';
 export { default as tooltip } from './tooltip';

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

@@ -13,6 +13,12 @@ declare const _default: {
         readonly gap: 8;
     };
     readonly gap: 6;
+    readonly heading: {
+        readonly gap: 12;
+        readonly text: {
+            readonly gap: 0;
+        };
+    };
     readonly height: 48;
     readonly label: {
         readonly gap: 6;
@@ -21,6 +27,9 @@ declare const _default: {
     readonly minWidth: 152;
     readonly paddingHorizontal: 16;
     readonly paddingVertical: 12;
+    readonly stepper: {
+        readonly gap: 4;
+    };
     readonly textArea: {
         readonly height: 96;
     };

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

@@ -13,6 +13,12 @@ export default {
         gap: 8,
     },
     gap: 6,
+    heading: {
+        gap: 12,
+        text: {
+            gap: 0,
+        },
+    },
     height: 48,
     label: {
         gap: 6,
@@ -21,6 +27,9 @@ export default {
     minWidth: 152,
     paddingHorizontal: 16,
     paddingVertical: 12,
+    stepper: {
+        gap: 4,
+    },
     textArea: {
         height: 96,
     },

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

@@ -10,17 +10,20 @@ declare const _default: {
         readonly gap: 12;
     };
     readonly gap: 24;
-    readonly padding: 48;
+    readonly heading: {
+        readonly gap: 24;
+    };
+    readonly illustration: {
+        readonly padding: 48;
+    };
+    readonly padding: 24;
     readonly mobile: {
-        readonly padding: 16;
         readonly width: 360;
     };
     readonly tablet: {
-        readonly padding: 48;
         readonly width: 504;
     };
     readonly desktop: {
-        readonly padding: 48;
         readonly width: 680;
     };
 };

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

@@ -10,17 +10,20 @@ export default {
         gap: 12,
     },
     gap: 24,
-    padding: 48,
+    heading: {
+        gap: 24,
+    },
+    illustration: {
+        padding: 48,
+    },
+    padding: 24,
     mobile: {
-        padding: 16,
         width: 360,
     },
     tablet: {
-        padding: 48,
         width: 504,
     },
     desktop: {
-        padding: 48,
         width: 680,
     },
 };

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

@@ -24,6 +24,9 @@ declare const _default: {
         readonly gap: 8;
         readonly group: {
             readonly gap: 8;
+            readonly heading: {
+                readonly gap: 2;
+            };
             readonly stack: {
                 readonly gap: 12;
             };

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

@@ -24,6 +24,9 @@ export default {
         gap: 8,
         group: {
             gap: 8,
+            heading: {
+                gap: 2,
+            },
             stack: {
                 gap: 12,
             },

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

@@ -0,0 +1,8 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+declare const _default: {
+    readonly borderWidth: 2;
+    readonly gap: 4;
+};
+export default _default;

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

@@ -0,0 +1,7 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+export default {
+    borderWidth: 2,
+    gap: 4,
+};

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

@@ -5,6 +5,7 @@ declare const _default: {
     readonly borderRadius: 16;
     readonly cell: {
         readonly borderWidth: 1;
+        readonly minHeight: 48;
         readonly padding: 12;
     };
     readonly emphasis: {
@@ -13,9 +14,7 @@ declare const _default: {
     readonly headerCell: {
         readonly borderWidth: 2;
         readonly gap: 8;
-        readonly neutral: {
-            readonly backgroundColor: "#30302c";
-        };
+        readonly height: 56;
         readonly paddingHorizontal: 12;
         readonly paddingVertical: 16;
     };

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

@@ -5,6 +5,7 @@ export default {
     borderRadius: 16,
     cell: {
         borderWidth: 1,
+        minHeight: 48,
         padding: 12,
     },
     emphasis: {
@@ -13,9 +14,7 @@ export default {
     headerCell: {
         borderWidth: 2,
         gap: 8,
-        neutral: {
-            backgroundColor: '#30302c',
-        },
+        height: 56,
         paddingHorizontal: 12,
         paddingVertical: 16,
     },

package/build/tokens/components/dark/time-picker.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+declare const _default: {
+    readonly gap: 6;
+    readonly gapContainer: 4;
+    readonly minWidth: 288;
+    readonly paddingHorizontal: 16;
+    readonly paddingVertical: 12;
+    readonly time: {
+        readonly columnGap: 4;
+        readonly content: {
+            readonly gap: 8;
+            readonly item: {
+                readonly gap: 2;
+            };
+        };
+        readonly footer: {
+            readonly gap: 8;
+        };
+        readonly gap: 16;
+        readonly item: {
+            readonly height: 40;
+            readonly width: 64;
+        };
+        readonly rowGap: 2;
+    };
+};
+export default _default;

package/build/tokens/components/dark/time-picker.js

@@ -0,0 +1,28 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+export default {
+    gap: 6,
+    gapContainer: 4,
+    minWidth: 288,
+    paddingHorizontal: 16,
+    paddingVertical: 12,
+    time: {
+        columnGap: 4,
+        content: {
+            gap: 8,
+            item: {
+                gap: 2,
+            },
+        },
+        footer: {
+            gap: 8,
+        },
+        gap: 16,
+        item: {
+            height: 40,
+            width: 64,
+        },
+        rowGap: 2,
+    },
+};

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

@@ -0,0 +1,27 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+declare const _default: {
+    readonly bar: {
+        readonly width: 2;
+    };
+    readonly content: {
+        readonly gap: 8;
+        readonly paddingBottom: 24;
+        readonly paddingTop: 2;
+    };
+    readonly gap: 12;
+    readonly progress: {
+        readonly circle: {
+            readonly height: 24;
+            readonly width: 24;
+        };
+    };
+    readonly static: {
+        readonly circle: {
+            readonly height: 12;
+            readonly width: 12;
+        };
+    };
+};
+export default _default;

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

@@ -0,0 +1,26 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+export default {
+    bar: {
+        width: 2,
+    },
+    content: {
+        gap: 8,
+        paddingBottom: 24,
+        paddingTop: 2,
+    },
+    gap: 12,
+    progress: {
+        circle: {
+            height: 24,
+            width: 24,
+        },
+    },
+    static: {
+        circle: {
+            height: 12,
+            width: 12,
+        },
+    },
+};

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

@@ -4,10 +4,14 @@
 declare const _default: {
     readonly backgroundColor: "#3f3f3f";
     readonly borderRadius: 8;
-    readonly gapHorizontal: 16;
+    readonly bottomPosition: 32;
+    readonly gap: 16;
     readonly padding: 14;
     readonly stack: {
-        readonly gapHorizontal: 8;
+        readonly gap: 12;
+    };
+    readonly text: {
+        readonly gap: 8;
     };
 };
 export default _default;

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

@@ -4,9 +4,13 @@
 export default {
     backgroundColor: '#3f3f3f',
     borderRadius: 8,
-    gapHorizontal: 16,
+    bottomPosition: 32,
+    gap: 16,
     padding: 14,
     stack: {
-        gapHorizontal: 8,
+        gap: 12,
+    },
+    text: {
+        gap: 8,
     },
 };

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

@@ -27,6 +27,9 @@ declare const _default: {
         readonly gap: 12;
         readonly group: {
             readonly gap: 6;
+            readonly heading: {
+                readonly gap: 2;
+            };
             readonly stack: {
                 readonly gap: 12;
             };

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

@@ -27,6 +27,9 @@ export default {
         gap: 12,
         group: {
             gap: 6,
+            heading: {
+                gap: 2,
+            },
             stack: {
                 gap: 12,
             },

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

@@ -17,7 +17,6 @@ export { default as carouselControl } from './carousel-control';
 export { default as checkbox } from './checkbox';
 export { default as datePicker } from './date-picker';
 export { default as descriptionList } from './description-list';
-export { default as dialog } from './dialog';
 export { default as divider } from './divider';
 export { default as drawer } from './drawer';
 export { default as expandableCard } from './expandable-card';
@@ -40,6 +39,7 @@ export { default as pill } from './pill';
 export { default as progressBar } from './progress-bar';
 export { default as progressStepper } from './progress-stepper';
 export { default as radio } from './radio';
+export { default as rating } from './rating';
 export { default as sectionHeader } from './section-header';
 export { default as segmentedControl } from './segmented-control';
 export { default as select } from './select';
@@ -48,6 +48,8 @@ export { default as spinner } from './spinner';
 export { default as switch } from './switch';
 export { default as table } from './table';
 export { default as tabs } from './tabs';
+export { default as timePicker } from './time-picker';
+export { default as timeline } from './timeline';
 export { default as toast } from './toast';
 export { default as toggleButton } from './toggle-button';
 export { default as tooltip } from './tooltip';

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

@@ -17,7 +17,6 @@ export { default as carouselControl } from './carousel-control';
 export { default as checkbox } from './checkbox';
 export { default as datePicker } from './date-picker';
 export { default as descriptionList } from './description-list';
-export { default as dialog } from './dialog';
 export { default as divider } from './divider';
 export { default as drawer } from './drawer';
 export { default as expandableCard } from './expandable-card';
@@ -40,6 +39,7 @@ export { default as pill } from './pill';
 export { default as progressBar } from './progress-bar';
 export { default as progressStepper } from './progress-stepper';
 export { default as radio } from './radio';
+export { default as rating } from './rating';
 export { default as sectionHeader } from './section-header';
 export { default as segmentedControl } from './segmented-control';
 export { default as select } from './select';
@@ -48,6 +48,8 @@ export { default as spinner } from './spinner';
 export { default as switch } from './switch';
 export { default as table } from './table';
 export { default as tabs } from './tabs';
+export { default as timePicker } from './time-picker';
+export { default as timeline } from './timeline';
 export { default as toast } from './toast';
 export { default as toggleButton } from './toggle-button';
 export { default as tooltip } from './tooltip';

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

@@ -13,6 +13,12 @@ declare const _default: {
         readonly gap: 8;
     };
     readonly gap: 6;
+    readonly heading: {
+        readonly gap: 12;
+        readonly text: {
+            readonly gap: 2;
+        };
+    };
     readonly height: 48;
     readonly label: {
         readonly gap: 2;
@@ -21,6 +27,9 @@ declare const _default: {
     readonly minWidth: 120;
     readonly paddingHorizontal: 16;
     readonly paddingVertical: 12;
+    readonly stepper: {
+        readonly gap: 4;
+    };
     readonly textArea: {
         readonly height: 96;
     };

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

@@ -13,6 +13,12 @@ export default {
         gap: 8,
     },
     gap: 6,
+    heading: {
+        gap: 12,
+        text: {
+            gap: 2,
+        },
+    },
     height: 48,
     label: {
         gap: 2,
@@ -21,6 +27,9 @@ export default {
     minWidth: 120,
     paddingHorizontal: 16,
     paddingVertical: 12,
+    stepper: {
+        gap: 4,
+    },
     textArea: {
         height: 96,
     },

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

@@ -10,17 +10,20 @@ declare const _default: {
         readonly gap: 12;
     };
     readonly gap: 24;
-    readonly padding: 16;
+    readonly heading: {
+        readonly gap: 24;
+    };
+    readonly illustration: {
+        readonly padding: 48;
+    };
+    readonly padding: 24;
     readonly mobile: {
-        readonly padding: 16;
         readonly width: 360;
     };
     readonly tablet: {
-        readonly padding: 48;
         readonly width: 504;
     };
     readonly desktop: {
-        readonly padding: 48;
         readonly width: 680;
     };
 };

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

@@ -10,17 +10,20 @@ export default {
         gap: 12,
     },
     gap: 24,
-    padding: 16,
+    heading: {
+        gap: 24,
+    },
+    illustration: {
+        padding: 48,
+    },
+    padding: 24,
     mobile: {
-        padding: 16,
         width: 360,
     },
     tablet: {
-        padding: 48,
         width: 504,
     },
     desktop: {
-        padding: 48,
         width: 680,
     },
 };

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

@@ -24,6 +24,9 @@ declare const _default: {
         readonly gap: 8;
         readonly group: {
             readonly gap: 12;
+            readonly heading: {
+                readonly gap: 2;
+            };
             readonly stack: {
                 readonly gap: 12;
             };

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

@@ -24,6 +24,9 @@ export default {
         gap: 8,
         group: {
             gap: 12,
+            heading: {
+                gap: 2,
+            },
             stack: {
                 gap: 12,
             },

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

@@ -0,0 +1,8 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+declare const _default: {
+    readonly borderWidth: 2;
+    readonly gap: 4;
+};
+export default _default;

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

@@ -0,0 +1,7 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+export default {
+    borderWidth: 2,
+    gap: 4,
+};

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

@@ -5,6 +5,7 @@ declare const _default: {
     readonly borderRadius: 16;
     readonly cell: {
         readonly borderWidth: 1;
+        readonly minHeight: 48;
         readonly padding: 12;
     };
     readonly emphasis: {
@@ -13,9 +14,7 @@ declare const _default: {
     readonly headerCell: {
         readonly borderWidth: 2;
         readonly gap: 8;
-        readonly neutral: {
-            readonly backgroundColor: "#f1efe4";
-        };
+        readonly height: 56;
         readonly paddingHorizontal: 12;
         readonly paddingVertical: 16;
     };