@ovotech/element-native 5.4.3 → 5.6.0

package/dist/esm/components/SkeletonHeading/SkeletonHeading.js

@@ -1,9 +1,25 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx } from "react/jsx-runtime";
+import { numToPx } from '../..';
 import styled from '../../styled.native';
 import { Heading3 } from '../Heading';
 import { SkeletonAnimation } from '../SkeletonAnimation';
 const StyledSkeletonHeading = styled.View(({ theme, size }) => `
     background-color: ${theme.color.surface.dim};
+    border-radius: ${numToPx(theme.border.radius.sm)};
     width: ${size};
   `);
-export const SkeletonHeading = ({ size = '70%', headingComponent: Heading = Heading3, ...rest }) => (_jsx(SkeletonAnimation, { children: _jsx(StyledSkeletonHeading, { "aria-hidden": "true", size: size, as: Heading, ...rest, children: "\u00A0" }) }));
+export const SkeletonHeading = (_a) => {
+    var { size = '70%', headingComponent: Heading = Heading3 } = _a, rest = __rest(_a, ["size", "headingComponent"]);
+    return (_jsx(SkeletonAnimation, { children: _jsx(StyledSkeletonHeading, Object.assign({ "aria-hidden": "true", size: size, as: Heading }, rest, { children: "\u00A0" })) }));
+};

package/dist/esm/components/SkeletonText/SkeletonText.js

@@ -1,27 +1,41 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx } from "react/jsx-runtime";
 import { numToPx } from '@ovotech/element-core';
 import { useBreakpoint } from '../../hooks';
 import styled from '../../styled.native';
 import { P } from '../P';
 import { SkeletonAnimation } from '../SkeletonAnimation';
-const StyledSkeletonText = styled.View(({ theme, aboveSmallBreakpoint, short }) => {
+const StyledSkeletonText = styled.View(({ theme, aboveSmallBreakpoint, short, size, isLast }) => {
     return `
     background-color: ${theme.color.surface.dim};
-    margin-bottom: ${numToPx(theme.space[200])};
+    margin-bottom: ${isLast ? 0 : numToPx(theme.space[200])};
+    border-radius: ${numToPx(theme.border.radius.sm)};
     height: ${aboveSmallBreakpoint
         ? numToPx(theme.font.size.md.mediaQuery.lg)
         : numToPx(theme.font.size.md.mediaQuery.sm)};
-
+    width: ${size};
     ${short ? 'width: 50%' : ''};
   `;
 });
-export const SkeletonText = ({ lines = 1, ...rest }) => {
+export const SkeletonText = (_a) => {
+    var { lines = 1, size } = _a, rest = __rest(_a, ["lines", "size"]);
     const generatedLines = [];
     const { smallAndUp } = useBreakpoint();
     for (let i = 1; i <= lines; i++) {
-        generatedLines.push(_jsx(StyledSkeletonText, { short: i === lines, aboveSmallBreakpoint: smallAndUp }, `line-${i}`));
+        const isLast = i === lines;
+        generatedLines.push(_jsx(StyledSkeletonText, { short: lines > 1 && isLast, aboveSmallBreakpoint: smallAndUp, size: size, isLast: isLast }, `line-${i}`));
     }
     return (
     // @ts-ignore styled components stuff
-    _jsx(P, { as: SkeletonAnimation, ...rest, children: generatedLines }));
+    _jsx(P, Object.assign({ as: SkeletonAnimation }, rest, { children: generatedLines })));
 };

package/dist/esm/components/Stack/Stack.js

@@ -1,3 +1,14 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx } from "react/jsx-runtime";
 import { numToPx } from '@ovotech/element-core';
 import { View } from 'react-native';
@@ -8,11 +19,12 @@ import { responsiveStyle } from '../../utils';
 const StyledStack = styled(View)(({ gapStyle }) => `
   ${gapStyle}
 `);
-const Stack = ({ children, spaceBetween, ...rest }) => {
+const Stack = (_a) => {
+    var { children, spaceBetween } = _a, rest = __rest(_a, ["children", "spaceBetween"]);
     const breakpoints = useBreakpoint();
     const theme = useTheme();
     const formatter = (spaceKey) => numToPx(theme.space[String(spaceKey * 100)]);
     const gapStyle = responsiveStyle('gap', spaceBetween, breakpoints, formatter);
-    return (_jsx(StyledStack, { gapStyle: gapStyle, ...rest, children: children }));
+    return (_jsx(StyledStack, Object.assign({ gapStyle: gapStyle }, rest, { children: children })));
 };
 export { Stack };

package/dist/esm/components/Stretch/Stretch.js

@@ -9,5 +9,5 @@ const StyledStretch = styled.View(
   `);
 export const Stretch = (props) => {
     const { smallAndUp } = useBreakpoint();
-    return _jsx(StyledStretch, { smallAndUp: smallAndUp, ...props });
+    return _jsx(StyledStretch, Object.assign({ smallAndUp: smallAndUp }, props));
 };

package/dist/esm/components/Tabs/Tab.js

@@ -1,3 +1,14 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx } from "react/jsx-runtime";
 import { numToPx } from '@ovotech/element-core';
 import { useBreakpoint } from '../../hooks';
@@ -28,7 +39,8 @@ const TabTouchable = styled.TouchableOpacity(({ active = false, stretch = false,
         : ''}
   `;
 });
-export const Tab = ({ active, fullWidth = false, children, ref, ...rest }) => {
+export const Tab = (_a) => {
+    var { active, fullWidth = false, children, ref } = _a, rest = __rest(_a, ["active", "fullWidth", "children", "ref"]);
     const breakpoints = useBreakpoint();
-    return (_jsx(TabTouchable, { accessible: true, accessibilityRole: "tab", accessibilityState: { selected: active }, active: active, stretch: fullWidth, ref: ref, ...rest, children: _jsx(TabText, { active: active, ...breakpoints, children: children }) }));
+    return (_jsx(TabTouchable, Object.assign({ accessible: true, accessibilityRole: "tab", accessibilityState: { selected: active }, active: active, stretch: fullWidth, ref: ref }, rest, { children: _jsx(TabText, Object.assign({ active: active }, breakpoints, { children: children })) })));
 };

package/dist/esm/components/Tabs/TabList.js

@@ -1,3 +1,14 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx } from "react/jsx-runtime";
 import { numToPx } from '@ovotech/element-core';
 import { Children, cloneElement } from 'react';
@@ -7,12 +18,13 @@ const StyledTabList = styled.View(({ theme }) => css `
     flex-direction: row;
     margin: -${numToPx(theme.border.width.sm)};
   `);
-export const TabList = ({ children, setActiveTab, activeTab, tabRefs, fullWidth, ...rest }) => {
+export const TabList = (_a) => {
+    var { children, setActiveTab, activeTab, tabRefs, fullWidth } = _a, rest = __rest(_a, ["children", "setActiveTab", "activeTab", "tabRefs", "fullWidth"]);
     const validChildren = getValidChildren(children);
-    return (_jsx(StyledTabList, { accessible: true, accessibilityRole: "tablist", ...rest, children: Children.map(validChildren, (child, i) => cloneElement(child, {
+    return (_jsx(StyledTabList, Object.assign({ accessible: true, accessibilityRole: "tablist" }, rest, { children: Children.map(validChildren, (child, i) => cloneElement(child, {
             onPress: callAll(() => setActiveTab && setActiveTab(i), child.props.onPress),
             active: activeTab === i,
             fullWidth,
-            ref: tabRefs?.[i],
-        })) }));
+            ref: tabRefs === null || tabRefs === void 0 ? void 0 : tabRefs[i],
+        })) })));
 };

package/dist/esm/components/Tabs/TabPanel.js

@@ -1,3 +1,14 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx } from "react/jsx-runtime";
 import { numToPx } from '@ovotech/element-core';
 import styled, { css } from '../../styled.native';
@@ -8,6 +19,7 @@ const StyledView = styled.View(({ theme }) => css `
     border-color: ${theme.color.input.borderDim};
     z-index: -1;
   `);
-export const TabPanel = ({ ...rest }) => {
-    return _jsx(StyledView, { ...rest });
+export const TabPanel = (_a) => {
+    var rest = __rest(_a, []);
+    return _jsx(StyledView, Object.assign({}, rest));
 };

package/dist/esm/components/Tabs/Tabs.js

@@ -1,3 +1,14 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { numToPx } from '@ovotech/element-core';
 import { cloneElement, createRef, useEffect, useRef, useState, } from 'react';
@@ -11,7 +22,8 @@ const TabsCard = styled(Card)(({ theme }) => css `
     border: ${numToPx(theme.border.width.sm)} solid transparent;
     background: transparent;
   `);
-export const Tabs = ({ children, defaultSelected = 0, onSelected, fullWidth, ...rest }) => {
+export const Tabs = (_a) => {
+    var { children, defaultSelected = 0, onSelected, fullWidth } = _a, rest = __rest(_a, ["children", "defaultSelected", "onSelected", "fullWidth"]);
     const [activeTab, setActiveTab] = useState(defaultSelected);
     const tabList = filterChildrenByType(children, TabList);
     const tabPanels = filterChildrenByType(children, TabPanel);
@@ -25,7 +37,7 @@ export const Tabs = ({ children, defaultSelected = 0, onSelected, fullWidth, ...
             loaded.current = true;
         }
     }, [onSelected, activeTab]);
-    return (_jsxs(TabsCard, { ...rest, children: [tabList.map((child) => cloneElement(child, {
+    return (_jsxs(TabsCard, Object.assign({}, rest, { children: [tabList.map((child) => cloneElement(child, {
                 setActiveTab,
                 activeTab,
                 tabRefs,
@@ -34,5 +46,5 @@ export const Tabs = ({ children, defaultSelected = 0, onSelected, fullWidth, ...
                 .filter((_, index) => index === activeTab)
                 .map((child, index) => cloneElement(child, {
                 hidden: activeTab !== index,
-            }))] }));
+            }))] })));
 };

package/dist/esm/components/TextField/TextField.js

@@ -1,6 +1,18 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Field } from '../Field';
 import { TextInput } from '../TextInput';
-export const TextField = ({ ref, ...props }) => {
-    return (_jsx(Field, { ...props, children: _jsx(TextInput, { ref: ref }) }));
+export const TextField = (_a) => {
+    var { ref } = _a, props = __rest(_a, ["ref"]);
+    return (_jsx(Field, Object.assign({}, props, { children: _jsx(TextInput, { ref: ref }) })));
 };

package/dist/esm/components/TextInput/TextInput.js

@@ -1,4 +1,18 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Input } from '../Input/Input';
-const TextInput = ({ ref, ...props }) => (_jsx(Input, { ...props, keyboardType: "default", ref: ref }));
+const TextInput = (_a) => {
+    var { ref } = _a, props = __rest(_a, ["ref"]);
+    return (_jsx(Input, Object.assign({}, props, { keyboardType: "default", ref: ref })));
+};
 export { TextInput };

package/dist/esm/components/TextareaField/TextareaField.js

@@ -1,6 +1,18 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Field } from '../Field';
 import { TextareaInput } from '../TextareaInput';
-export const TextareaField = ({ ref, ...props }) => {
-    return (_jsx(Field, { ...props, children: _jsx(TextareaInput, { ref: ref }) }));
+export const TextareaField = (_a) => {
+    var { ref } = _a, props = __rest(_a, ["ref"]);
+    return (_jsx(Field, Object.assign({}, props, { children: _jsx(TextareaInput, { ref: ref }) })));
 };

package/dist/esm/components/TextareaInput/TextareaInput.js

@@ -1,13 +1,31 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx } from "react/jsx-runtime";
 import { numToPx } from '@ovotech/element-core';
+import { useBreakpoint } from '../../hooks';
 import styled, { css } from '../../styled.native';
 import { Input } from '../Input/Input';
-const StyledInput = styled(Input)(({ theme, rows }) => css `
-    padding: ${numToPx(theme.space[200])};
-    padding-top: ${numToPx(theme.space[300])};
-    height: ${theme.space[800] * rows}px;
-  `);
-const TextareaInput = ({ rows = 3, ref, ...rest }) => {
-    return (_jsx(StyledInput, { ...rest, keyboardType: "default", multiline: true, textAlignVertical: "top", rows: rows, ref: ref }));
+const StyledInput = styled(Input)(({ theme, rows, smallAndUp, }) => {
+    const lineHeight = smallAndUp
+        ? theme.font.lineHeight.md.mediaQuery.lg
+        : theme.font.lineHeight.md.mediaQuery.sm;
+    return css `
+    min-height: ${theme.space[800] * rows}px;
+    line-height: ${rows > 1 ? numToPx(lineHeight) : 'normal'};
+  `;
+});
+const TextareaInput = (_a) => {
+    var { rows = 3, ref } = _a, rest = __rest(_a, ["rows", "ref"]);
+    const breakpoints = useBreakpoint();
+    return (_jsx(StyledInput, Object.assign({}, rest, breakpoints, { keyboardType: "default", multiline: true, textAlignVertical: "top", rows: rows, ref: ref })));
 };
 export { TextareaInput };

package/dist/esm/components/Toast/Toast.js

@@ -45,14 +45,14 @@ export const showToast = ({ message, dismissible = false, action, actionTitle, v
             id: 'clipboard',
             position: ToastPosition.BOTTOM,
             disableShadow: true,
-            customToast: t => (_jsx(CustomToast, { ...t, dismissible: dismissible, action: action, actionTitle: actionTitle, variant: variant }, message)),
+            customToast: t => (_jsx(CustomToast, Object.assign({}, t, { dismissible: dismissible, action: action, actionTitle: actionTitle, variant: variant }), message)),
         })
         : toast(message, {
             id: 'clipboard',
             position: ToastPosition.BOTTOM,
             duration,
             disableShadow: true,
-            customToast: t => (_jsx(CustomToastWithTimeIndicator, { ...t, variant: variant }, message)),
+            customToast: t => (_jsx(CustomToastWithTimeIndicator, Object.assign({}, t, { variant: variant }), message)),
         });
 };
 const CustomToastWithTimeIndicator = ({ message, duration = 5000, variant, }) => {
@@ -79,7 +79,8 @@ const CustomToastWithTimeIndicator = ({ message, duration = 5000, variant, }) =>
             height: textHeight + toastPadding,
             flexWrap: 'wrap',
         }, children: [_jsx(StyledP, { ref: textRef, onLayout: () => {
-                    textRef.current?.measureInWindow((_x, _y, _width, height) => {
+                    var _a;
+                    (_a = textRef.current) === null || _a === void 0 ? void 0 : _a.measureInWindow((_x, _y, _width, height) => {
                         setTextHeight(height);
                     });
                 }, children: message }), _jsx(View, { style: { position: 'absolute', bottom: 0 }, children: _jsx(StyledBorder, { variant: variant, style: style }) })] }));
@@ -107,11 +108,13 @@ const CustomToast = ({ id, message, dismissible, action, actionTitle, width, var
                     justifyContent: 'space-between',
                     flex: 1,
                 }, children: [_jsx(StyledP, { ref: textRef, onLayout: () => {
-                            textRef.current?.measureInWindow((_x, _y, _width, height) => {
+                            var _a;
+                            (_a = textRef.current) === null || _a === void 0 ? void 0 : _a.measureInWindow((_x, _y, _width, height) => {
                                 setTextHeight(height);
                             });
                         }, children: message }), action && actionTitle ? (_jsx(Action, { ref: actionRef, style: { width: 'auto' }, inverted: true, standalone: true, iconRight: "chevron-right-small", onPress: handleAction, onLayout: () => {
-                            actionRef.current?.measureInWindow((_x, _y, _width, height) => {
+                            var _a;
+                            (_a = actionRef.current) === null || _a === void 0 ? void 0 : _a.measureInWindow((_x, _y, _width, height) => {
                                 setActionHeight(height);
                             });
                         }, children: actionTitle })) : null] }), dismissible ? (_jsx(StyledCloseIcon, { onPress: () => toast.dismiss(id), children: _jsx(Icon, { name: "cross", color: "#fff", size: 14 }) })) : null] }));

package/dist/esm/components/Toggle/Toggle.js

@@ -1,3 +1,14 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useRef } from 'react';
 import { Animated, View } from 'react-native';
@@ -5,7 +16,8 @@ import { useTheme } from '../../styled.native';
 import { HintText } from '../HintText/HintText';
 import { LabelText } from '../LabelText';
 import { StyledToggleDot, StyledToggleInput, StyledToggleInputWrapper, StyledWrapper, } from './styles';
-const Input = ({ checked, labelPosition, testID, ...rest }) => {
+const Input = (_a) => {
+    var { checked, labelPosition, testID, toggleBackgroundColor } = _a, rest = __rest(_a, ["checked", "labelPosition", "testID", "toggleBackgroundColor"]);
     const theme = useTheme();
     const leftVal = useRef(new Animated.Value(checked ? theme.space[600] : theme.space[100])).current;
     useEffect(() => {
@@ -15,11 +27,10 @@ const Input = ({ checked, labelPosition, testID, ...rest }) => {
             useNativeDriver: true,
         }).start();
     }, [checked]);
-    return (_jsx(StyledToggleInputWrapper, { labelPosition: labelPosition, ...rest, children: _jsx(StyledToggleInput, { checked: checked, testID: testID, children: _jsx(StyledToggleDot, { style: {
-                    transform: [{ translateX: leftVal }],
-                }, checked: checked }) }) }));
+    return (_jsx(StyledToggleInputWrapper, Object.assign({ labelPosition: labelPosition }, rest, { children: _jsx(StyledToggleInput, { checked: checked, testID: testID, toggleBackgroundColor: toggleBackgroundColor, children: _jsx(StyledToggleDot, { style: { transform: [{ translateX: leftVal }] }, checked: checked }) }) })));
 };
-export const Toggle = ({ activeOpacity = 0.8, checked = false, label, hint, inline, labelPosition = 'left', testID, ref, ...rest }) => {
+export const Toggle = (_a) => {
+    var { activeOpacity = 0.8, checked = false, label, hint, inline, labelPosition = 'left', testID, ref, toggleBackgroundColor } = _a, rest = __rest(_a, ["activeOpacity", "checked", "label", "hint", "inline", "labelPosition", "testID", "ref", "toggleBackgroundColor"]);
     const hasLabel = label !== undefined;
-    return (_jsxs(StyledWrapper, { ref: ref, accessible: true, accessibilityRole: "checkbox", activeOpacity: activeOpacity, accessibilityState: { checked }, hitSlop: 10, hasLabel: hasLabel, labelPosition: labelPosition, inline: inline, ...rest, children: [hasLabel ? (_jsxs(View, { style: { flexShrink: 1 }, children: [_jsx(LabelText, { children: label }), hint ? _jsx(HintText, { children: hint }) : null] })) : null, _jsx(Input, { checked: checked, testID: testID, labelPosition: hasLabel ? labelPosition : undefined })] }));
+    return (_jsxs(StyledWrapper, Object.assign({ ref: ref, accessible: true, accessibilityRole: "checkbox", activeOpacity: activeOpacity, accessibilityState: { checked }, hitSlop: 10, hasLabel: hasLabel, labelPosition: labelPosition, inline: inline }, rest, { children: [hasLabel ? (_jsxs(View, { style: { flexShrink: 1 }, children: [_jsx(LabelText, { children: label }), hint ? _jsx(HintText, { children: hint }) : null] })) : null, _jsx(Input, { checked: checked, testID: testID, labelPosition: hasLabel ? labelPosition : undefined, toggleBackgroundColor: toggleBackgroundColor })] })));
 };

package/dist/esm/components/Toggle/styles.js

@@ -19,14 +19,14 @@ export const StyledToggleInputWrapper = styled.View(({ theme, labelPosition }) =
         : ''}
     `;
 });
-export const StyledToggleInput = styled.View(({ theme, checked }) => {
+export const StyledToggleInput = styled.View(({ theme, checked, toggleBackgroundColor }) => {
     return `
       width: ${numToPx(theme.space[1100])};
       height: ${numToPx(theme.space[600])};
       justify-content: center;
       border-radius: ${numToPx(theme.border.radius.lg)};
-      background: ${checked
-        ? theme.color.outline.outer
+      background-color: ${checked
+        ? toggleBackgroundColor || theme.color.outline.outer
         : theme.color.surface.onSurfaceVariant};
     `;
 });

package/dist/esm/components/index.js

@@ -16,10 +16,13 @@ export * from './Divider';
 export * from './Em';
 export * from './EmailField';
 export * from './EmailInput';
+export * from './EmptyState';
+export * from './ErrorWrapper';
 export * from './Field';
 export * from './Grid';
 export * from './Heading';
 export * from './Icon';
+export * from './LargeValueReference';
 export * from './LineThrough';
 export * from './Link';
 export * from './List';
@@ -37,8 +40,8 @@ export * from './PhoneInput';
 export * from './Pictogram';
 export * from './Radio';
 export * from './RadioCard';
-export * from './ScreenView';
 export * from './RemoteImage';
+export * from './ScreenView';
 export * from './SegmentedControls';
 export * from './SelectField';
 export * from './SkeletonButton';

package/dist/esm/hooks/use-font-scaling.js

@@ -0,0 +1,32 @@
+import { useWindowDimensions } from 'react-native';
+import { useBreakpoint } from './use-breakpoint.native';
+/**
+ * A hook to get information about the current font scaling.
+ * It uses `useWindowDimensions` to get the `fontScale` and will update when it changes.
+ * It also uses `useBreakpoint` to only figure out scaling information below the small breakpoint, and otherwise returns defaults
+ *
+ * @returns An object with font scaling information.
+ */
+export function useFontScaling() {
+    const { smallAndUp } = useBreakpoint();
+    const { fontScale } = useWindowDimensions();
+    // For larger than "small" screens, we're not as concerned about font-scaling
+    // so we maintain defaults
+    if (smallAndUp) {
+        return {
+            fontScale: 1,
+            isFontScalingSmall: false,
+            isFontScalingLarge: false,
+            isFontScalingDefault: true,
+        };
+    }
+    const isFontScalingSmall = fontScale < 1;
+    const isFontScalingLarge = fontScale > 1;
+    const isFontScalingDefault = fontScale === 1;
+    return {
+        fontScale,
+        isFontScalingSmall,
+        isFontScalingLarge,
+        isFontScalingDefault,
+    };
+}

package/dist/esm/index.js

@@ -1,3 +1,4 @@
 export * from './components';
+export * from './hooks';
 export * from './theme';
 export * from './utils';

package/dist/esm/providers/IconsProvider.js

@@ -117,10 +117,7 @@ function useIcons() {
 }
 function IconsProvider({ children, icons = {}, }) {
     const baseIcons = useContext(IconsContext) || defaultIcons;
-    const mergedIcons = {
-        ...baseIcons,
-        ...icons,
-    };
+    const mergedIcons = Object.assign(Object.assign({}, baseIcons), icons);
     return (_jsx(IconsContext.Provider, { value: mergedIcons, children: children }));
 }
 export { defaultIcons, IconsProvider, useIcons };

package/dist/esm/providers/PictogramsProvider.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { createContext, useContext } from 'react';
-import { AccountInCreditPositiveBalance, AccountInDebtNegativeBalance, AccousticGuitar, AddYourCar, Archive, AssistanceDog, Awards, Bag, Battery13, Battery23, Battery33, BatteryEmpty, Bicycle, Bill, Bin, Boiler, BoilerEngineer, BoilerHeating, BoilerReplacement, BoilerService, BoilerWorking, BritishSignLanguage, Bus, CableLengthLong, CableLengthMedium, CableLengthShort, Calendar, Camera, Car, ChargerChademo, ChargerCssCombo, ChargerType1, ChargerType2, Cloakroom, Clock, Comedy, Competition, Confirmation, ContactUs, Copy, CreatePaymentSchedule, CreditCard, Cursor, Customer, CustomerStar, DisbaledToilet, DownloadApp, Drink1, Drink2, Drink3, Drink4, EcoHome, Edit, Electric, ElectricCarEv, ElectricityWarning, Emergency, EnergyAdvice, EnergyExperts, EstimatedCharge, EstimatedCharge2, EstimatedRange, EvCharger, ExitFees, ExternalDrains, Fairness, Filter, FinalStatement, FlagIssue, Flats, Food, FossilFuels, Gas, GasWarning, GetInTouch, Global, GreenerEnergy, GuitarMusic, Heart, HeatPump, Help, HistoryPayment, Home, HomeMove, HomeMoving, HouseProtected, Information, InternalDrains, Key, Laptop, Lasers, Leaf, Letter, Lifts, LightMembership, Lightbulb, Like, List, LoadingAndFlexibility, Location, LogIn, LogOut, Lpg, Magnify, ManageMyAccount, Map, MensToilet, Merch, MeterReading, MeterTopUp1, MeterTopUp2, Microphone, Mobile, Money, Msg, Music, MyPaymentCards, Navigation, News, NoEntry, NoSmoking, Notification, NumberOfSeats, Oil, OpenLetter, Padlock, Parking, PayAsYouGo, PayByBankTransfer, PaygDrive, PaymentSchedule, Person, PingDriver, Placeholder, Planet, Play, Plug, PlugAndSocket, Plumbing, PowerMove, Present, Price, PriceCut, Queue, Radio, RealCharge, RealCharge2, Refund, Repair, Rocket, ScheduledTopUps, Screen1, Screen2, Seats, SecurityDog, SellingPowerBackElectricity, SellingPowerBackGas, SemiDetached, Send, Shield, SmartHome, SmartMeter, SmartThermostatA, SmartThermostatB, Smoke, SolarPanel, SpecialEffects, Sport, Star, StoreLocator, StrobeLights, StrobeLights2, Sun, Tado, TapsAndToilets, TentFront, TentSide, Terraced, TheGrid, ThumbsDown, ThumbsUp, Ticket, TimeRunningOut, Toilet, TopUp, TopUpCardOrKey, TopUpInPaypointShop, TopUpInStore, TopUpOnline, Torch, Train, Trees, Turbine, UnavailableCharger, Underground, Underground1, Usage, Wallet, WarmHome, WaterSupplyPipe, WindEnergy, WomensToilet, Wrench, } from './pictograms';
+import { AccountInCreditPositiveBalance, AccountInDebtNegativeBalance, AccousticGuitar, AddYourCar, Archive, AssistanceDog, Awards, Bag, Battery13, Battery23, Battery33, BatteryEmpty, Bicycle, Bill, Bin, Boiler, BoilerEngineer, BoilerHeating, BoilerReplacement, BoilerService, BoilerWorking, BritishSignLanguage, Bus, CableLengthLong, CableLengthMedium, CableLengthShort, Calendar, Camera, Car, ChargerChademo, ChargerCssCombo, ChargerType1, ChargerType2, Cloakroom, Clock, Comedy, Competition, Confirmation, ContactUs, Copy, CreatePaymentSchedule, CreditCard, Cursor, Customer, CustomerStar, DisbaledToilet, DownloadApp, Drink1, Drink2, Drink3, Drink4, EcoHome, Edit, Electric, ElectricCarEv, ElectricityWarning, Emergency, EnergyAdvice, EnergyExperts, EstimatedCharge, EstimatedCharge2, EstimatedRange, EvCharger, ExitFees, ExternalDrains, Fairness, Filter, FinalStatement, FlagIssue, Flats, Food, FossilFuels, Gas, GasWarning, GetInTouch, Global, GreenerEnergy, GuitarMusic, Heart, HeatPump, Help, HistoryPayment, Home, HomeMove, HomeMoving, HouseProtected, Information, InternalDrains, Key, Laptop, Lasers, Leaf, Letter, Lifts, Lightbulb, LightMembership, Like, List, LoadingAndFlexibility, Location, LogIn, LogOut, Lpg, Magnify, ManageMyAccount, Map, MensToilet, Merch, MeterReading, MeterTopUp1, MeterTopUp2, Microphone, Mobile, Money, Msg, Music, MyPaymentCards, Navigation, News, NoEntry, NoSmoking, Notification, NumberOfSeats, Oil, OpenLetter, Padlock, Parking, PayAsYouGo, PayByBankTransfer, PaygDrive, PaymentSchedule, Person, PingDriver, Placeholder, Planet, Play, Plug, PlugAndSocket, Plumbing, PowerMove, Present, Price, PriceCut, Queue, Radio, RealCharge, RealCharge2, Refund, Repair, Rocket, ScheduledTopUps, Screen1, Screen2, Seats, SecurityDog, SellingPowerBackElectricity, SellingPowerBackGas, SemiDetached, Send, Shield, SmartHome, SmartMeter, SmartThermostatA, SmartThermostatB, Smoke, SolarPanel, SpecialEffects, Sport, Star, StoreLocator, StrobeLights, StrobeLights2, Sun, Tado, TapsAndToilets, TentFront, TentSide, Terraced, TheGrid, ThumbsDown, ThumbsUp, Ticket, TimeRunningOut, Toilet, TopUp, TopUpCardOrKey, TopUpInPaypointShop, TopUpInStore, TopUpOnline, Torch, Train, Trees, Turbine, UnavailableCharger, Underground, Underground1, Usage, Wallet, WarmHome, WaterSupplyPipe, WindEnergy, WomensToilet, Wrench, } from './pictograms';
 const defaultPictograms = {
     'account-in-credit-positive-balance': AccountInCreditPositiveBalance,
     'account-in-debt-negative-balance': AccountInDebtNegativeBalance,
@@ -213,10 +213,7 @@ function usePictograms() {
 }
 function PictogramsProvider({ children, pictograms = {}, }) {
     const basePictograms = useContext(PictogramsContext) || defaultPictograms;
-    const mergedPictograms = {
-        ...basePictograms,
-        ...pictograms,
-    };
+    const mergedPictograms = Object.assign(Object.assign({}, basePictograms), pictograms);
     return (_jsx(PictogramsContext.Provider, { value: mergedPictograms, children: children }));
 }
 export { defaultPictograms, PictogramsProvider, usePictograms };

package/dist/esm/providers/icons/AI.js

@@ -1,3 +1,3 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import Svg, { Path } from 'react-native-svg';
-export const Ai = (props) => (_jsx(Svg, { viewBox: "0 0 16 16", ...props, children: _jsx(Path, { fill: "currentColor", d: "M9.495 5.47c.2.607.678 1.085 1.285 1.285l3.97 1.495-3.97 1.495c-.607.2-1.085.678-1.285 1.285l-.775 3.115-1.348.36-.867-3.475A2.019 2.019 0 0 0 5.22 9.745L1.25 8.25l3.97-1.495A2.019 2.019 0 0 0 6.505 5.47L8 1.5l1.495 3.97Zm-1.52-.225c-.178.523-.475 1.743-.858 2.125-.383.383-1.602.68-2.125.858l-.035.012-.034.013.034.012.035.012c.528.18 1.753.48 2.138.87s.68 1.618.855 2.148l.007.022.008.023.008-.023.007-.022c.172-.533.47-1.758.855-2.148.385-.387 1.61-.69 2.138-.87l.035-.012.034-.012-.034-.013-.035-.012c-.523-.178-1.742-.475-2.125-.858-.383-.382-.68-1.602-.858-2.125L8 5.175l-.025.07Zm4.298-3.687c.142.425.385 1.412.695 1.722.313.31 1.3.55 1.724.695l.03.01.03.01-.004.001.002.001-.03.01-.03.01c-.43.146-1.422.39-1.735.706a.64.64 0 0 0-.038.043c-.293.356-.518 1.283-.654 1.694l-.01.035-.002-.004-.001.006-.005-.017-.005-.017c-.142-.43-.383-1.425-.695-1.74-.313-.315-1.305-.56-1.735-.705l-.03-.01-.03-.01.004-.003h-.001l.03-.01.03-.01c.424-.145 1.414-.385 1.724-.695a.715.715 0 0 0 .065-.076c.278-.373.496-1.25.628-1.644l.01-.03.01-.03v.002l.003-.005.02.06Z" }) }));
+export const Ai = (props) => (_jsx(Svg, Object.assign({ viewBox: "0 0 16 16" }, props, { children: _jsx(Path, { fill: "currentColor", d: "M9.495 5.47c.2.607.678 1.085 1.285 1.285l3.97 1.495-3.97 1.495c-.607.2-1.085.678-1.285 1.285l-.775 3.115-1.348.36-.867-3.475A2.019 2.019 0 0 0 5.22 9.745L1.25 8.25l3.97-1.495A2.019 2.019 0 0 0 6.505 5.47L8 1.5l1.495 3.97Zm-1.52-.225c-.178.523-.475 1.743-.858 2.125-.383.383-1.602.68-2.125.858l-.035.012-.034.013.034.012.035.012c.528.18 1.753.48 2.138.87s.68 1.618.855 2.148l.007.022.008.023.008-.023.007-.022c.172-.533.47-1.758.855-2.148.385-.387 1.61-.69 2.138-.87l.035-.012.034-.012-.034-.013-.035-.012c-.523-.178-1.742-.475-2.125-.858-.383-.382-.68-1.602-.858-2.125L8 5.175l-.025.07Zm4.298-3.687c.142.425.385 1.412.695 1.722.313.31 1.3.55 1.724.695l.03.01.03.01-.004.001.002.001-.03.01-.03.01c-.43.146-1.422.39-1.735.706a.64.64 0 0 0-.038.043c-.293.356-.518 1.283-.654 1.694l-.01.035-.002-.004-.001.006-.005-.017-.005-.017c-.142-.43-.383-1.425-.695-1.74-.313-.315-1.305-.56-1.735-.705l-.03-.01-.03-.01.004-.003h-.001l.03-.01.03-.01c.424-.145 1.414-.385 1.724-.695a.715.715 0 0 0 .065-.076c.278-.373.496-1.25.628-1.644l.01-.03.01-.03v.002l.003-.005.02.06Z" }) })));

package/dist/esm/providers/icons/Address.js

@@ -1,3 +1,3 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import Svg, { Path } from 'react-native-svg';
-export const Address = (props) => (_jsx(Svg, { viewBox: "0 0 16 16", ...props, children: _jsx(Path, { fill: "currentColor", fillRule: "evenodd", d: "M2.5 6.45C2.5 2.853 5.76 1.5 8 1.5s5.5 1.478 5.5 4.95C13.5 9.922 8 14.5 8 14.5s-5.5-4.454-5.5-8.05Zm7.145 4.313c.723-.835 1.295-1.623 1.697-2.34.43-.77.658-1.452.658-1.973 0-1.072-.437-1.936-1.297-2.568-.886-.65-1.958-.881-2.703-.881-.745 0-1.85.222-2.714.844C4.421 4.466 4 5.319 4 6.45c0 .624.305 2.02 2.349 4.353a24.081 24.081 0 0 0 1.64 1.686 25.59 25.59 0 0 0 1.656-1.726ZM7.09 5.385l1.437-.381.381 1.437-1.437.381-.381-1.437Z", clipRule: "evenodd" }) }));
+export const Address = (props) => (_jsx(Svg, Object.assign({ viewBox: "0 0 16 16" }, props, { children: _jsx(Path, { fill: "currentColor", fillRule: "evenodd", d: "M2.5 6.45C2.5 2.853 5.76 1.5 8 1.5s5.5 1.478 5.5 4.95C13.5 9.922 8 14.5 8 14.5s-5.5-4.454-5.5-8.05Zm7.145 4.313c.723-.835 1.295-1.623 1.697-2.34.43-.77.658-1.452.658-1.973 0-1.072-.437-1.936-1.297-2.568-.886-.65-1.958-.881-2.703-.881-.745 0-1.85.222-2.714.844C4.421 4.466 4 5.319 4 6.45c0 .624.305 2.02 2.349 4.353a24.081 24.081 0 0 0 1.64 1.686 25.59 25.59 0 0 0 1.656-1.726ZM7.09 5.385l1.437-.381.381 1.437-1.437.381-.381-1.437Z", clipRule: "evenodd" }) })));

package/dist/esm/providers/icons/Advice.js

@@ -1,3 +1,3 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import Svg, { Path } from 'react-native-svg';
-export const Advice = (props) => (_jsx(Svg, { viewBox: "0 0 16 16", ...props, children: _jsx(Path, { fill: "currentColor", d: "M14.5 5.5h-1.59c-.441-2.275-2.475-4-4.91-4s-4.469 1.725-4.91 4H1.5v5H5v-5h-.369C5.046 4.06 6.4 3 8 3c1.601 0 2.954 1.06 3.368 2.5H11v4.983h.502a2.757 2.757 0 0 1-1.99 2.42V12.2h-1.5v2.307h.75a4.256 4.256 0 0 0 4.244-4.024h1.495V5.498L14.5 5.5ZM3.5 9H3V7h.5v2Zm9-2h.5v1.983h-.5V7Z" }) }));
+export const Advice = (props) => (_jsx(Svg, Object.assign({ viewBox: "0 0 16 16" }, props, { children: _jsx(Path, { fill: "currentColor", d: "M14.5 5.5h-1.59c-.441-2.275-2.475-4-4.91-4s-4.469 1.725-4.91 4H1.5v5H5v-5h-.369C5.046 4.06 6.4 3 8 3c1.601 0 2.954 1.06 3.368 2.5H11v4.983h.502a2.757 2.757 0 0 1-1.99 2.42V12.2h-1.5v2.307h.75a4.256 4.256 0 0 0 4.244-4.024h1.495V5.498L14.5 5.5ZM3.5 9H3V7h.5v2Zm9-2h.5v1.983h-.5V7Z" }) })));

package/dist/esm/providers/icons/Archive.js

@@ -1,3 +1,3 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import Svg, { Path } from 'react-native-svg';
-export const Archive = (props) => (_jsx(Svg, { viewBox: "0 0 16 16", ...props, children: _jsx(Path, { fill: "currentColor", fillRule: "evenodd", d: "M1.5 7V3h13v4h-.75v4.1l-1.5.402.402 1.498H2.25V7H1.5Zm2.25 4.5h8.5V7h-8.5v4.5ZM3 5.5h10v-1H3v1Zm4.09 3.222 1.438-.382.381 1.437-1.437.382-.381-1.438Z", clipRule: "evenodd" }) }));
+export const Archive = (props) => (_jsx(Svg, Object.assign({ viewBox: "0 0 16 16" }, props, { children: _jsx(Path, { fill: "currentColor", fillRule: "evenodd", d: "M1.5 7V3h13v4h-.75v4.1l-1.5.402.402 1.498H2.25V7H1.5Zm2.25 4.5h8.5V7h-8.5v4.5ZM3 5.5h10v-1H3v1Zm4.09 3.222 1.438-.382.381 1.437-1.437.382-.381-1.438Z", clipRule: "evenodd" }) })));

package/dist/esm/providers/icons/ArrowDown.js

@@ -1,3 +1,3 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import Svg, { Path } from 'react-native-svg';
-export const ArrowDown = (props) => (_jsx(Svg, { viewBox: "0 0 16 16", ...props, children: _jsx(Path, { fill: "currentColor", d: "m9.051 13.402 3.62-3.62-.449-1.672-3.481 3.481V1.53l-1.5.402v9.659L3.766 8.117 3.318 9.79l3.612 3.612 1.06 1.06 1.061-1.06Z" }) }));
+export const ArrowDown = (props) => (_jsx(Svg, Object.assign({ viewBox: "0 0 16 16" }, props, { children: _jsx(Path, { fill: "currentColor", d: "m9.051 13.402 3.62-3.62-.449-1.672-3.481 3.481V1.53l-1.5.402v9.659L3.766 8.117 3.318 9.79l3.612 3.612 1.06 1.06 1.061-1.06Z" }) })));

package/dist/esm/providers/icons/ArrowLeft.js

@@ -1,3 +1,3 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import Svg, { Path } from 'react-native-svg';
-export const ArrowLeft = (props) => (_jsx(Svg, { viewBox: "0 0 16 16", ...props, children: _jsx(Path, { fill: "currentColor", d: "m2.589 6.94 3.619-3.62 1.673.449L4.399 7.25H14.46l-.402 1.5H4.4l3.474 3.474-1.673.448L2.59 9.061 1.528 8l1.061-1.06Z" }) }));
+export const ArrowLeft = (props) => (_jsx(Svg, Object.assign({ viewBox: "0 0 16 16" }, props, { children: _jsx(Path, { fill: "currentColor", d: "m2.589 6.94 3.619-3.62 1.673.449L4.399 7.25H14.46l-.402 1.5H4.4l3.474 3.474-1.673.448L2.59 9.061 1.528 8l1.061-1.06Z" }) })));

package/dist/esm/providers/icons/ArrowRight.js

@@ -1,3 +1,3 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import Svg, { Path } from 'react-native-svg';
-export const ArrowRight = (props) => (_jsx(Svg, { viewBox: "0 0 16 16", ...props, children: _jsx(Path, { fill: "currentColor", d: "M13.4 6.94 9.78 3.32l-1.672.449 3.481 3.481H1.528l.402 1.5h9.66l-3.474 3.474 1.673.448L13.4 9.061 14.46 8 13.4 6.94Z" }) }));
+export const ArrowRight = (props) => (_jsx(Svg, Object.assign({ viewBox: "0 0 16 16" }, props, { children: _jsx(Path, { fill: "currentColor", d: "M13.4 6.94 9.78 3.32l-1.672.449 3.481 3.481H1.528l.402 1.5h9.66l-3.474 3.474 1.673.448L13.4 9.061 14.46 8 13.4 6.94Z" }) })));

package/dist/esm/providers/icons/ArrowUp.js

@@ -1,3 +1,3 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import Svg, { Path } from 'react-native-svg';
-export const ArrowUp = (props) => (_jsx(Svg, { viewBox: "0 0 16 16", ...props, children: _jsx(Path, { fill: "currentColor", d: "m6.938 2.59-3.62 3.62.449 1.673 3.482-3.482v10.062l1.5-.402V4.4l3.473 3.474.449-1.673-3.612-3.611-1.06-1.061-1.061 1.06Z" }) }));
+export const ArrowUp = (props) => (_jsx(Svg, Object.assign({ viewBox: "0 0 16 16" }, props, { children: _jsx(Path, { fill: "currentColor", d: "m6.938 2.59-3.62 3.62.449 1.673 3.482-3.482v10.062l1.5-.402V4.4l3.473 3.474.449-1.673-3.612-3.611-1.06-1.061-1.061 1.06Z" }) })));