@ovotech/element-native 5.4.1 → 5.4.2-canary-317a648-425

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

@@ -1,18 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { numToPx } from '@ovotech/element-core';
-import { View } from 'react-native';
-import styled from 'styled-components';
-import { useBreakpoint } from '../../hooks';
-import { useTheme } from '../../styled.native';
-import { responsiveStyle } from '../../utils';
-const StyledStack = styled(View)(({ gapStyle }) => `
-  ${gapStyle}
-`);
-const Stack = ({ children, spaceBetween, ...rest }) => {
-    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 }));
-};
-export { Stack };

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

@@ -1 +0,0 @@
-export { Stack } from './Stack';

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

@@ -1,13 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useBreakpoint } from '../../hooks';
-import styled, { css } from '../../styled.native';
-const StyledStretch = styled.View(
-// full width on small, default width on tablet or if fullWidth is false
-({ smallAndUp, fullWidth = true, defaultWidth }) => css `
-    width: ${!fullWidth || smallAndUp ? defaultWidth : '100%'};
-    ${defaultWidth && !fullWidth ? 'max-width: 100%;' : ''}
-  `);
-export const Stretch = (props) => {
-    const { smallAndUp } = useBreakpoint();
-    return _jsx(StyledStretch, { smallAndUp: smallAndUp, ...props });
-};

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

@@ -1 +0,0 @@
-export * from './Stretch';

package/dist/esm/src/components/Strong/Strong.js

@@ -1,4 +0,0 @@
-import styled from '../../styled.native';
-export const Strong = styled.Text(({ theme }) => `
-    font-family: ${theme.native.font.family.bold};
-  `);

package/dist/esm/src/components/Strong/index.js

@@ -1 +0,0 @@
-export { Strong } from './Strong';

package/dist/esm/src/components/SubLabelText/SubLabelText.js

@@ -1,16 +0,0 @@
-import { numToPx } from '@ovotech/element-core';
-import styled, { css } from '../../styled.native';
-import { styledComponentWithBreakpoints } from '../../utils';
-const StyledSubLabelText = styled.Text(({ theme, smallAndUp }) => {
-    const fontSize = smallAndUp
-        ? theme.font.size.md.mediaQuery.lg
-        : theme.font.size.md.mediaQuery.sm;
-    return css `
-    font-family: ${theme.native.font.family.book};
-    line-height: ${numToPx(theme.font.lineHeight.md.mediaQuery.sm)};
-    color: ${theme.color.surface.onSurfaceVariant};
-    font-size: ${numToPx(fontSize)};
-  `;
-});
-const SubLabelText = styledComponentWithBreakpoints(StyledSubLabelText);
-export { SubLabelText };

package/dist/esm/src/components/SubLabelText/index.js

@@ -1 +0,0 @@
-export { SubLabelText } from './SubLabelText';

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

@@ -1,34 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { numToPx } from '@ovotech/element-core';
-import { useBreakpoint } from '../../hooks';
-import styled, { css } from '../../styled.native';
-const TabText = styled.Text(({ theme, active = false }) => css `
-    font-size: ${numToPx(theme.font.size.md.mediaQuery.sm)};
-    font-family: ${theme.native.font.family.bold};
-    line-height: ${numToPx(theme.font.lineHeight.md.mediaQuery.sm)};
-    color: ${active
-    ? theme.color.outline.outer
-    : theme.color.surface.onSurface};
-    text-align: center;
-    padding: ${numToPx(theme.space[300])} ${numToPx(theme.space[200])};
-  `);
-const TabTouchable = styled.TouchableOpacity(({ active = false, stretch = false, theme }) => {
-    return css `
-    flex-grow: ${stretch ? 1 : 0};
-
-    border-bottom-width: ${numToPx(theme.border.width.sm)};
-    border-bottom-style: solid;
-    border-bottom-color: ${theme.color.surface.border};
-
-    ${active
-        ? css `
-          border-bottom-color: ${theme.color.outline.outer};
-          border-bottom-width: ${numToPx(theme.border.width.md)};
-        `
-        : ''}
-  `;
-});
-export const Tab = ({ active, fullWidth = false, children, ref, ...rest }) => {
-    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 }) }));
-};

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

@@ -1,18 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { numToPx } from '@ovotech/element-core';
-import { Children, cloneElement } from 'react';
-import styled, { css } from '../../styled.native';
-import { callAll, getValidChildren } from '../../utils';
-const StyledTabList = styled.View(({ theme }) => css `
-    flex-direction: row;
-    margin: -${numToPx(theme.border.width.sm)};
-  `);
-export const TabList = ({ children, setActiveTab, activeTab, tabRefs, fullWidth, ...rest }) => {
-    const validChildren = getValidChildren(children);
-    return (_jsx(StyledTabList, { 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],
-        })) }));
-};

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

@@ -1,13 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { numToPx } from '@ovotech/element-core';
-import styled, { css } from '../../styled.native';
-const StyledView = styled.View(({ theme }) => css `
-    padding: ${numToPx(theme.space[400])};
-    border-top-width: ${numToPx(theme.border.width.sm)};
-    border-style: solid;
-    border-color: ${theme.color.input.borderDim};
-    z-index: -1;
-  `);
-export const TabPanel = ({ ...rest }) => {
-    return _jsx(StyledView, { ...rest });
-};

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

@@ -1,38 +0,0 @@
-import { jsxs as _jsxs } from "react/jsx-runtime";
-import { numToPx } from '@ovotech/element-core';
-import { cloneElement, createRef, useEffect, useRef, useState, } from 'react';
-import styled, { css } from '../../styled.native';
-import { filterChildrenByType } from '../../utils';
-import { Card } from '../Card';
-import { TabList } from './TabList';
-import { TabPanel } from './TabPanel';
-const TabsCard = styled(Card)(({ theme }) => css `
-    padding: 0;
-    border: ${numToPx(theme.border.width.sm)} solid transparent;
-    background: transparent;
-  `);
-export const Tabs = ({ children, defaultSelected = 0, onSelected, fullWidth, ...rest }) => {
-    const [activeTab, setActiveTab] = useState(defaultSelected);
-    const tabList = filterChildrenByType(children, TabList);
-    const tabPanels = filterChildrenByType(children, TabPanel);
-    const tabRefs = tabPanels.map(() => createRef());
-    const loaded = useRef(false);
-    useEffect(() => {
-        if (loaded.current) {
-            onSelected && onSelected(activeTab);
-        }
-        else {
-            loaded.current = true;
-        }
-    }, [onSelected, activeTab]);
-    return (_jsxs(TabsCard, { ...rest, children: [tabList.map((child) => cloneElement(child, {
-                setActiveTab,
-                activeTab,
-                tabRefs,
-                fullWidth,
-            })), tabPanels
-                .filter((_, index) => index === activeTab)
-                .map((child, index) => cloneElement(child, {
-                hidden: activeTab !== index,
-            }))] }));
-};

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

@@ -1,4 +0,0 @@
-export { Tab } from './Tab';
-export { TabList } from './TabList';
-export { TabPanel } from './TabPanel';
-export { Tabs } from './Tabs';

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

@@ -1,6 +0,0 @@
-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 }) }));
-};

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

@@ -1 +0,0 @@
-export { TextField } from './TextField';

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

@@ -1,4 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Input } from '../Input/Input';
-const TextInput = ({ ref, ...props }) => (_jsx(Input, { ...props, keyboardType: "default", ref: ref }));
-export { TextInput };

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

@@ -1 +0,0 @@
-export { TextInput } from './TextInput';

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

@@ -1,6 +0,0 @@
-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 }) }));
-};

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

@@ -1 +0,0 @@
-export { TextareaField } from './TextareaField';

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

@@ -1,13 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { numToPx } from '@ovotech/element-core';
-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 }));
-};
-export { TextareaInput };

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

@@ -1 +0,0 @@
-export { TextareaInput } from './TextareaInput';

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

@@ -1,118 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { toast, ToastPosition, Toasts, } from '@backpackapp-io/react-native-toast';
-import { numToPx } from '@ovotech/element-core';
-import { useEffect, useRef, useState } from 'react';
-import { Dimensions, TouchableOpacity, View } from 'react-native';
-import Animated, { Easing, useAnimatedStyle, useSharedValue, withTiming, } from 'react-native-reanimated';
-import styled, { css } from '../../styled.native';
-import { Action } from '../ActionList';
-import { Icon } from '../Icon';
-import { P } from '../P';
-export const ToastsContainer = ({ top = -80 }) => (_jsx(Toasts, { extraInsets: { top } }));
-const StyledView = styled.View(({ theme, variant }) => css `
-    background-color: ${variant === 'default'
-    ? theme.color.alert.success
-    : theme.color.alert.error};
-    overflow: hidden;
-    padding-top: ${numToPx(theme.space[200])};
-    padding-bottom: ${numToPx(theme.space[200])};
-    padding-right: ${numToPx(theme.space[200])};
-    padding-left: ${numToPx(theme.space[400])};
-    border-radius: ${numToPx(theme.border.radius['2xl'])};
-    flex-direction: row;
-  `);
-const StyledP = styled(P)(({ theme }) => css `
-    color: ${theme.color.surface.bright};
-  `);
-const StyledBorder = styled(Animated.View)(({ theme, variant }) => css `
-    background-color: ${variant === 'default'
-    ? theme.color.alert.successTint
-    : theme.color.alert.errorTint};
-    height: 4px;
-  `);
-const StyledCloseIcon = styled(TouchableOpacity)(({ theme }) => css `
-    background-color: ${theme.color.surface.onSurface};
-    border-radius: ${numToPx(theme.border.radius['2xl'])};
-    width: ${numToPx(theme.space[700])};
-    height: ${numToPx(theme.space[700])};
-    padding: ${numToPx(theme.space[200])};
-    align-items: center;
-    justify-content: center;
-  `);
-export const showToast = ({ message, dismissible = false, action, actionTitle, variant = 'default', duration = 5000, }) => {
-    return action || dismissible
-        ? toast.loading(message, {
-            id: 'clipboard',
-            position: ToastPosition.BOTTOM,
-            disableShadow: true,
-            customToast: t => (_jsx(CustomToast, { ...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)),
-        });
-};
-const CustomToastWithTimeIndicator = ({ message, duration = 5000, variant, }) => {
-    const toastPadding = 20;
-    const textRef = useRef(null);
-    const [textHeight, setTextHeight] = useState(0);
-    const windowWidth = Dimensions.get('window').width;
-    const screenPadding = 32;
-    const toastWidth = windowWidth - screenPadding;
-    const sharedWidth = useSharedValue(toastWidth);
-    const style = useAnimatedStyle(() => {
-        return {
-            width: withTiming(sharedWidth.value, {
-                duration: duration,
-                easing: Easing.linear,
-            }),
-        };
-    });
-    useEffect(() => {
-        sharedWidth.value = 0;
-    }, []);
-    return (_jsxs(StyledView, { variant: variant, style: {
-            width: toastWidth,
-            height: textHeight + toastPadding,
-            flexWrap: 'wrap',
-        }, children: [_jsx(StyledP, { ref: textRef, onLayout: () => {
-                    textRef.current?.measureInWindow((_x, _y, _width, height) => {
-                        setTextHeight(height);
-                    });
-                }, children: message }), _jsx(View, { style: { position: 'absolute', bottom: 0 }, children: _jsx(StyledBorder, { variant: variant, style: style }) })] }));
-};
-const CustomToast = ({ id, message, dismissible, action, actionTitle, width, variant, }) => {
-    const toastPadding = 20;
-    const textRef = useRef(null);
-    const actionRef = useRef(null);
-    const [textHeight, setTextHeight] = useState(0);
-    const [actionHeight, setActionHeight] = useState(0);
-    const toastHeight = textHeight + actionHeight;
-    const handleAction = () => {
-        if (action && actionTitle) {
-            action();
-            toast.dismiss(id);
-        }
-    };
-    return (_jsxs(StyledView, { variant: variant, style: {
-            width,
-            height: toastHeight + toastPadding,
-            alignItems: action ? 'flex-start' : 'center',
-        }, children: [_jsxs(View, { style: {
-                    flexDirection: 'row',
-                    flexWrap: 'wrap',
-                    justifyContent: 'space-between',
-                    flex: 1,
-                }, children: [_jsx(StyledP, { ref: textRef, onLayout: () => {
-                            textRef.current?.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) => {
-                                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/src/components/Toast/index.js

@@ -1 +0,0 @@
-export { ToastsContainer, showToast } from './Toast';

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

@@ -1,25 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useRef } from 'react';
-import { Animated, View } from 'react-native';
-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 theme = useTheme();
-    const leftVal = useRef(new Animated.Value(checked ? theme.space[600] : theme.space[100])).current;
-    useEffect(() => {
-        Animated.timing(leftVal, {
-            toValue: checked ? theme.space[600] : theme.space[100],
-            duration: theme.transition.duration.fast,
-            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 }) }) }));
-};
-export const Toggle = ({ activeOpacity = 0.8, checked = false, label, hint, inline, labelPosition = 'left', testID, ref, ...rest }) => {
-    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 })] }));
-};

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

@@ -1 +0,0 @@
-export { Toggle } from './Toggle';

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

@@ -1,39 +0,0 @@
-import { numToPx } from '@ovotech/element-core';
-import { Animated } from 'react-native';
-import styled from '../../styled.native';
-export const StyledWrapper = styled.TouchableOpacity(({ theme, hasLabel, inline, labelPosition }) => `
-    width: ${hasLabel ? (inline ? undefined : '100%') : numToPx(theme.space[1100])};
-    display: flex;
-    flex-direction: row${labelPosition === 'left' ? '' : '-reverse'};
-    justify-content: space-between;
-    position: relative;
-  `);
-export const StyledToggleInputWrapper = styled.View(({ theme, labelPosition }) => {
-    return `
-    width: ${numToPx(theme.space[1100])};
-    height: ${numToPx(theme.space[600])};
-    ${labelPosition
-        ? labelPosition === 'left'
-            ? 'margin-left: 10px;'
-            : 'margin-right: 10px;'
-        : ''}
-    `;
-});
-export const StyledToggleInput = styled.View(({ theme, checked }) => {
-    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
-        : theme.color.surface.onSurfaceVariant};
-    `;
-});
-export const StyledToggleDot = styled(Animated.View)(({ theme, checked }) => `
-  position: absolute;
-  width: ${numToPx(theme.space[400])};
-  height: ${numToPx(theme.space[400])};
-  border-radius: ${numToPx(theme.space[400])};
-  background-color: ${checked ? theme.color.brand.onBrand : theme.color.surface.dim};
-`);

package/dist/esm/src/components/index.js

@@ -1,57 +0,0 @@
-export * from './Accordion';
-export * from './ActionCard';
-export * from './ActionList';
-export * from './Badge';
-export * from './Button';
-export * from './Card';
-export * from './Cards';
-export * from './Checkbox';
-export * from './CurrencyField';
-export * from './CurrencyInput';
-export * from './DataTable';
-export * from './DateField';
-export * from './Disclosure';
-export * from './Display';
-export * from './Divider';
-export * from './Em';
-export * from './EmailField';
-export * from './EmailInput';
-export * from './Field';
-export * from './Grid';
-export * from './Heading';
-export * from './Icon';
-export * from './LineThrough';
-export * from './Link';
-export * from './List';
-export * from './Margin';
-export * from './NavHeader';
-export * from './NavIcon';
-export * from './Notification';
-export * from './NumberField';
-export * from './NumberInput';
-export * from './P';
-export * from './PasswordField';
-export * from './PasswordInput';
-export * from './PhoneField';
-export * from './PhoneInput';
-export * from './Pictogram';
-export * from './Radio';
-export * from './RadioCard';
-export * from './ScreenView';
-export * from './RemoteImage';
-export * from './SegmentedControls';
-export * from './SelectField';
-export * from './SkeletonButton';
-export * from './SkeletonCircle';
-export * from './SkeletonHeading';
-export * from './SkeletonText';
-export * from './Spinner';
-export * from './Stack';
-export * from './Strong';
-export * from './Tabs';
-export * from './TextareaField';
-export * from './TextareaInput';
-export * from './TextField';
-export * from './TextInput';
-export * from './Toast';
-export * from './Toggle';

package/dist/esm/src/hooks/index.js

@@ -1,2 +0,0 @@
-export * from './use-breakpoint.native';
-export * from './use-full-width';

package/dist/esm/src/hooks/use-full-width.js

@@ -1,15 +0,0 @@
-import { useEffect, useState } from 'react';
-import { useBreakpoint } from './use-breakpoint.native';
-export const useFullWidth = (fullWidth = 'small') => {
-    const [isFullWidth, setIsfullWidth] = useState(true);
-    const { smallAndUp } = useBreakpoint();
-    useEffect(() => {
-        const values = {
-            small: !smallAndUp,
-            always: true,
-            never: false,
-        };
-        setIsfullWidth(values[fullWidth]);
-    }, [isFullWidth, smallAndUp, setIsfullWidth]);
-    return isFullWidth;
-};

package/dist/esm/src/hooks/use-layout.js

@@ -1,16 +0,0 @@
-import { useCallback, useState } from 'react';
-export const useLayout = (defaultHeight) => {
-    const [layout, setLayout] = useState({ height: defaultHeight || 0, width: 0, measured: false });
-    const onLayout = useCallback((e) => {
-        const { height, width } = e.nativeEvent.layout;
-        if (height === layout.height && width === layout.width) {
-            return;
-        }
-        setLayout({
-            height,
-            width,
-            measured: true,
-        });
-    }, [layout.height, layout.width]);
-    return [layout, onLayout];
-};

package/dist/esm/src/index.js

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

package/dist/esm/src/providers/IconsProvider.js

@@ -1,126 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext, useContext } from 'react';
-import { Address, Advice, Ai, Archive, ArrowDown, ArrowLeft, ArrowRight, ArrowUp, Award, Battery, BritishSignLanguage, Cal, CalBook, CaretArrowDown, CaretArrowLeft, CaretArrowRight, CaretArrowUp, Chart, ChartFilled, Check, CheckCircle, ChevronDown, ChevronDownSmall, ChevronLeft, ChevronLeftSmall, ChevronLeftSmallFirst, ChevronRight, ChevronRightSmall, ChevronRightSmallLast, ChevronUp, ChevronUpSmall, Circle, CloseCircle, Copy, Cross, Doc, Dollar, Dots, Download, Eco, EcoHome, Edit, ElectricCar, ElectricHome, Electricity, Ellipsis, EnergyAdvice, Equals, Euro, Gas, GlobeAddress, HeatPump, Help, HelpFilled, Hide, Home, HomeFilled, HydroPower, Info, Link, Logo, Mail, MailOpen, Menu, Message, MessageFilled, Minus, Mobile, NewWindow, OvoLive, OvoLiveFilled, Pause, PaymentCard, PaymentCardFilled, Paypoint, Phone, Plus, PlusFilled, Pound, Pricing, PricingFilled, Search, Security, Send, Share, Show, SmartHome, SmartMeter, Solar, Star, StarFilled, Sun, Switch, ThumbsDown, ThumbsDownFilled, ThumbsUp, ThumbsUpFilled, Torch, Trees, Tune, User, UserFilled, Wallet, WarmHome, Warning, WebAddress, WindPower, } from './icons';
-const defaultIcons = {
-    address: Address,
-    advice: Advice,
-    ai: Ai,
-    archive: Archive,
-    'arrow-down': ArrowDown,
-    'arrow-left': ArrowLeft,
-    'arrow-right': ArrowRight,
-    'arrow-up': ArrowUp,
-    award: Award,
-    battery: Battery,
-    'british-sign-language': BritishSignLanguage,
-    cal: Cal,
-    'cal-book': CalBook,
-    'caret-arrow-down': CaretArrowDown,
-    'caret-arrow-left': CaretArrowLeft,
-    'caret-arrow-right': CaretArrowRight,
-    'caret-arrow-up': CaretArrowUp,
-    chart: Chart,
-    'chart-filled': ChartFilled,
-    check: Check,
-    'check-circle': CheckCircle,
-    'chevron-down': ChevronDown,
-    'chevron-down-small': ChevronDownSmall,
-    'chevron-left': ChevronLeft,
-    'chevron-left-small': ChevronLeftSmall,
-    'chevron-left-small-first': ChevronLeftSmallFirst,
-    'chevron-right': ChevronRight,
-    'chevron-right-small': ChevronRightSmall,
-    'chevron-right-small-last': ChevronRightSmallLast,
-    'chevron-up': ChevronUp,
-    'chevron-up-small': ChevronUpSmall,
-    circle: Circle,
-    'close-circle': CloseCircle,
-    copy: Copy,
-    cross: Cross,
-    doc: Doc,
-    dollar: Dollar,
-    dots: Dots,
-    download: Download,
-    eco: Eco,
-    'eco-home': EcoHome,
-    edit: Edit,
-    'electric-car': ElectricCar,
-    'electric-home': ElectricHome,
-    electricity: Electricity,
-    ellipsis: Ellipsis,
-    'energy-advice': EnergyAdvice,
-    equals: Equals,
-    euro: Euro,
-    gas: Gas,
-    'globe-address': GlobeAddress,
-    'heat-pump': HeatPump,
-    help: Help,
-    'help-filled': HelpFilled,
-    hide: Hide,
-    home: Home,
-    'home-filled': HomeFilled,
-    'hydro-power': HydroPower,
-    info: Info,
-    link: Link,
-    logo: Logo,
-    mail: Mail,
-    'mail-open': MailOpen,
-    menu: Menu,
-    message: Message,
-    'message-filled': MessageFilled,
-    minus: Minus,
-    mobile: Mobile,
-    'new-window': NewWindow,
-    'ovo-live': OvoLive,
-    'ovo-live-filled': OvoLiveFilled,
-    pause: Pause,
-    'payment-card': PaymentCard,
-    'payment-card-filled': PaymentCardFilled,
-    paypoint: Paypoint,
-    phone: Phone,
-    plus: Plus,
-    'plus-filled': PlusFilled,
-    pound: Pound,
-    pricing: Pricing,
-    'pricing-filled': PricingFilled,
-    search: Search,
-    security: Security,
-    send: Send,
-    share: Share,
-    show: Show,
-    'smart-home': SmartHome,
-    'smart-meter': SmartMeter,
-    solar: Solar,
-    star: Star,
-    'star-filled': StarFilled,
-    sun: Sun,
-    switch: Switch,
-    'thumbs-down': ThumbsDown,
-    'thumbs-down-filled': ThumbsDownFilled,
-    'thumbs-up': ThumbsUp,
-    'thumbs-up-filled': ThumbsUpFilled,
-    torch: Torch,
-    trees: Trees,
-    tune: Tune,
-    user: User,
-    'user-filled': UserFilled,
-    wallet: Wallet,
-    'warm-home': WarmHome,
-    warning: Warning,
-    'web-address': WebAddress,
-    'wind-power': WindPower,
-};
-const IconsContext = createContext(null);
-function useIcons() {
-    const icons = useContext(IconsContext) || defaultIcons;
-    return icons;
-}
-function IconsProvider({ children, icons = {}, }) {
-    const baseIcons = useContext(IconsContext) || defaultIcons;
-    const mergedIcons = {
-        ...baseIcons,
-        ...icons,
-    };
-    return (_jsx(IconsContext.Provider, { value: mergedIcons, children: children }));
-}
-export { defaultIcons, IconsProvider, useIcons };