@ovotech/element-native 4.4.2 → 4.4.3-canary-a2e1e61-317

package/dist/esm/theme/create-theme.js

@@ -1,330 +0,0 @@
-import deepMerge from 'deepmerge';
-var brand = {
-    focus: { base: '#3F64E6' },
-    primary: {
-        muted: '#E7F3EA',
-        lightest: '#B6D727',
-        lighter: '#9DC431',
-        light: '#6CBD27',
-        base: '#0D8426',
-        dark: '#0D8426',
-        darker: '#006945',
-    },
-    grey: {
-        lightest: '#FFFFFF',
-        lighter: '#F9F9F9',
-        light: '#F3F3F3',
-        base: '#D1D6DE',
-        dark: '#666D78',
-        darker: '#2F3749',
-        darkest: '#111111',
-    },
-    mission: {
-        base: '#DE1D8D',
-        dark: '#C6187D',
-    },
-    complementary: {
-        base: '#197278',
-    },
-    electricity: {
-        base: '#E7A234',
-        dark: '#D1760A',
-    },
-    gas: {
-        base: '#26ADE4',
-        dark: '#3F64E6',
-    },
-    error: {
-        lightest: '#FAE8EC',
-        base: '#C7153E',
-        dark: '#8C0A28',
-    },
-};
-export var defaultTokens = {
-    borderWidths: {
-        standard: '1px',
-        heavy: '2px',
-        heavier: '4px',
-    },
-    radii: {
-        small: '4px',
-        medium: '8px',
-        large: '12px',
-    },
-    shadows: {
-        standard: {
-            color: '#000',
-            offset: '1px',
-            opacity: 0.15,
-            radius: '4px',
-            elevation: 3,
-        },
-    },
-    breakpoints: { small: 576, medium: 768, large: 1200 },
-    space: {
-        1: '4px',
-        2: '8px',
-        3: '12px',
-        4: '16px',
-        5: '20px',
-        6: '24px',
-        7: '28px',
-        8: '32px',
-        9: '36px',
-        10: '40px',
-        11: '44px',
-        12: '48px',
-    },
-    fonts: {
-        body: 'OVOCircularTT-Book',
-        bold: 'OVOCircularTT-Bold',
-        heading: 'OVOCircularTT-Black',
-    },
-    lineHeights: {
-        standard: 1.5,
-    },
-    fontSizes: ['12px', '14px', '16px', '20px', '24px', '28px', '32px', '48px'],
-    colors: {
-        primary: brand.primary.base,
-        primaryAlt: brand.primary.darker,
-        primaryContrast: '#FFFFFF',
-        primaryMuted: brand.primary.muted,
-        error: '#C7153E',
-        errorAlt: '#8C0A28',
-        errorContrast: '#FFFFFF',
-        errorMuted: '#FAE8EC',
-        focus: '#3F64E6',
-        focusMuted: '#C6D1F8',
-        canvas: '#FFFFFF',
-        body: brand.grey.darker,
-        heading: brand.grey.darker,
-        border: brand.grey.dark,
-        canvasMuted: '#F0F2F5',
-        borderMuted: brand.grey.base,
-        info: '#3F64E6',
-        infoAlt: '#004CA0',
-        infoContrast: '#FFFFFF',
-        infoMuted: '#ECF0FD',
-        warning: '#BE5409',
-        warningAlt: '#8A3C05',
-        warningContrast: '#FFFFFF',
-        warningMuted: '#F7F0E7',
-        success: brand.primary.base,
-        successAlt: brand.primary.darker,
-        successContrast: '#FFFFFF',
-        successMuted: brand.primary.muted,
-        mission: '#DE1D8D',
-        missionMuted: '#FDF4F9',
-        missionAlt: '#C6187D',
-        missionContrast: '#FFFFFF',
-        brand: brand,
-    },
-    responsiveFontSizes: {
-        label: ['11px', '14px'],
-        small: ['14px', '14px'],
-        body: ['16px', '16px'],
-        level1: ['28px', '48px'],
-        level2: ['24px', '32px'],
-        level3: ['20px', '28px'],
-        level4: ['16px', '22px'],
-        lead: ['18px', '22px'],
-    },
-    responsiveLineHeights: {
-        label: ['20px', '20px'],
-        small: ['20px', '20px'],
-        body: ['24px', '24px'],
-        level1: ['36px', '52px'],
-        level2: ['32px', '40px'],
-        level3: ['24px', '36px'],
-        level4: ['20px', '28px'],
-        lead: ['24px', '28px'],
-    },
-};
-export function createTheme(customTheme, additional) {
-    var mergeOptions = { arrayMerge: function (_, source) { return source; } };
-    var customThemeWithAdditional = deepMerge(customTheme, additional || {}, mergeOptions);
-    var theme = deepMerge(defaultTokens, customThemeWithAdditional, mergeOptions);
-    var fontSizes = theme.fontSizes, breakpoints = theme.breakpoints, colors = theme.colors, fonts = theme.fonts, lineHeights = theme.lineHeights, space = theme.space, radii = theme.radii, shadows = theme.shadows, borderWidths = theme.borderWidths, responsiveFontSizes = theme.responsiveFontSizes, responsiveLineHeights = theme.responsiveLineHeights;
-    return deepMerge({
-        field: {
-            fontFamily: fonts.body,
-            fontSize: responsiveFontSizes.body,
-            lineHeight: lineHeights.standard,
-            dateWidth: '265px',
-            gap: space[2],
-            error: {
-                color: colors.error,
-                fontFamily: fonts.bold,
-            },
-            hint: {
-                color: colors.border,
-            },
-            label: {
-                color: colors.heading,
-                fontFamily: fonts.bold,
-            },
-            subLabel: {
-                color: colors.border,
-            },
-            legend: {
-                marginBottom: space[1],
-            },
-            errorIndent: {
-                borderWidth: space[1],
-                borderRadius: radii.small,
-            },
-        },
-        focusRing: {
-            color: colors.focus,
-            width: borderWidths.heavy,
-            distance: borderWidths.heavy,
-        },
-        input: {
-            fontFamily: fonts.body,
-            fontSize: responsiveFontSizes.body,
-            color: colors.body,
-            lineHeight: lineHeights.standard,
-            height: space[11],
-            borderColor: colors.border,
-            borderWidth: borderWidths.standard,
-            background: colors.canvas,
-            padding: space[2],
-            borderRadius: radii.small,
-            error: {
-                borderWidth: borderWidths.heavy,
-                color: colors.error,
-            },
-            icon: {
-                size: space[4],
-            },
-        },
-        card: {
-            background: colors.canvas,
-            borderWidth: borderWidths.standard,
-            borderColor: colors.borderMuted,
-            padding: [space[3], space[6], space[9]],
-        },
-        checkbox: {
-            touchSize: space[11],
-            size: space[6],
-            checkSize: space[5],
-            gap: space[2],
-            paddingTop: space[3],
-            borderWidth: borderWidths.standard,
-            borderColor: colors.border,
-            borderRadius: radii.small,
-            background: colors.canvas,
-            checkedBackground: colors.infoMuted,
-            checkColor: colors.info,
-            errorColor: colors.error,
-        },
-        text: {
-            fontFamily: fonts.body,
-            lineHeight: 1,
-            color: colors.body,
-            p: {
-                fontSize: responsiveFontSizes.body,
-                lineHeight: responsiveLineHeights.body,
-                marginTop: [space[3], space[3]],
-                marginBottom: [space[3], space[3]],
-            },
-            small: {
-                fontSize: responsiveFontSizes.small,
-                lineHeight: responsiveLineHeights.small,
-            },
-            strong: {
-                fontFamily: fonts.bold,
-            },
-        },
-        list: {
-            marginTop: [space[2], space[3]],
-            marginBottom: [space[2], space[3]],
-            marginLeft: space[6],
-            listItem: {
-                fontSize: responsiveFontSizes.body,
-                lineHeight: responsiveLineHeights.body,
-                marginVertical: 2,
-                bulletGap: space[2],
-                bulletWidth: space[2],
-            },
-            descriptionTerm: {
-                color: colors.heading,
-                fontFamily: fonts.bold,
-                marginTop: [space[3], space[4]],
-                marginBottom: [space[1], space[1]],
-            },
-        },
-        textLink: {
-            fontFamily: fonts.body,
-            color: colors.primary,
-        },
-        heading: {
-            fontFamily: fonts.heading,
-            color: colors.heading,
-            heading1: {
-                fontSize: responsiveFontSizes.level1,
-                lineHeight: responsiveLineHeights.level1,
-                marginTop: [space[8], space[12]],
-                marginBottom: [space[3], space[4]],
-            },
-            heading2: {
-                fontSize: responsiveFontSizes.level2,
-                lineHeight: responsiveLineHeights.level2,
-                marginTop: [space[6], space[8]],
-                marginBottom: [space[3], space[4]],
-            },
-            heading3: {
-                fontSize: responsiveFontSizes.level3,
-                lineHeight: responsiveLineHeights.level3,
-                marginTop: [space[4], space[6]],
-                marginBottom: [space[3], space[4]],
-            },
-            heading4: {
-                fontSize: responsiveFontSizes.level4,
-                lineHeight: responsiveLineHeights.level4,
-                marginTop: [space[3], space[4]],
-                marginBottom: [space[3], space[4]],
-            },
-        },
-        shadows: shadows,
-        radii: radii,
-        radio: {
-            touchSize: space[11],
-            size: space[8],
-            dotSize: space[5],
-            gap: space[2],
-            paddingTop: space[3],
-            borderWidth: borderWidths.standard,
-            borderColor: colors.border,
-            background: colors.canvas,
-            dotColor: colors.info,
-            checkedBackground: colors.infoMuted,
-            errorColor: colors.error,
-        },
-        fontSizes: fontSizes,
-        fonts: fonts,
-        responsiveFontSizes: responsiveFontSizes,
-        responsiveLineHeights: responsiveLineHeights,
-        colors: colors,
-        borderWidths: borderWidths,
-        breakpoints: breakpoints,
-        lineHeights: lineHeights,
-        space: space,
-        grid: {
-            maxWidth: breakpoints.large + 'px',
-            gutter: [space[4], space[8]],
-        },
-        disclosure: {
-            iconGap: [space[1], space[2]],
-            panelGap: [space[2], space[3]],
-        },
-        accordion: {
-            header: {
-                color: colors.primary,
-                paddingVertical: [space[3], space[5]],
-                iconSize: space[4],
-                iconGap: space[3],
-            },
-        },
-    }, theme, mergeOptions);
-}

package/dist/esm/theme/theme.js

@@ -1 +0,0 @@
-export {};

package/dist/providers/icons/HidePassword.d.ts

@@ -1,2 +0,0 @@
-import { SvgProps } from 'react-native-svg';
-export declare const HidePassword: (props: SvgProps) => JSX.Element;

package/dist/providers/icons/HidePassword.js

@@ -1,22 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.HidePassword = void 0;
-var react_1 = __importDefault(require("react"));
-var react_native_svg_1 = require("react-native-svg");
-var HidePassword = function (props) { return (react_1.default.createElement(react_native_svg_1.Svg, __assign({ viewBox: "0 0 16 16" }, props),
-    react_1.default.createElement(react_native_svg_1.Path, { d: "M15.8125 1.3125L14.5781 0.078125L10.7093 3.947C9.8406 3.65492 8.93342 3.5 8 3.5C4.89086 3.5 2.07286 5.21886 0 8C0.996343 9.33679 2.16484 10.4282 3.45507 11.2012L0.0937505 14.5625L1.32813 15.7969L5.12836 11.9966C6.04613 12.3251 7.00825 12.5 8 12.5C11.1091 12.5 13.9271 10.7811 16 8C14.9683 6.61581 13.7521 5.49476 12.4072 4.71779L15.8125 1.3125ZM9.3408 5.31545C8.93732 5.11358 8.48195 5 8 5C6.34286 5 5 6.34286 5 8C5 8.48195 5.11358 8.93732 5.31545 9.3408L6.50731 8.14894C6.50247 8.09995 6.5 8.05026 6.5 8C6.5 7.17171 7.17171 6.5 8 6.5C8.05026 6.5 8.09995 6.50247 8.14894 6.50731L9.3408 5.31545ZM9.46198 7.66302L10.6083 6.51665C10.8576 6.9541 11 7.46039 11 8C11 9.65714 9.65714 11 8 11C7.46039 11 6.9541 10.8576 6.51665 10.6083L7.66302 9.46198C7.77134 9.48686 7.88414 9.5 8 9.5C8.82829 9.5 9.5 8.82829 9.5 8C9.5 7.88414 9.48686 7.77134 9.46198 7.66302Z", fill: "currentColor", fillRule: "evenodd" }))); };
-exports.HidePassword = HidePassword;

package/dist/providers/icons/Payment.d.ts

@@ -1,2 +0,0 @@
-import { SvgProps } from 'react-native-svg';
-export declare const Payment: (props: SvgProps) => JSX.Element;

package/dist/providers/icons/Payment.js

@@ -1,22 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Payment = void 0;
-var react_1 = __importDefault(require("react"));
-var react_native_svg_1 = require("react-native-svg");
-var Payment = function (props) { return (react_1.default.createElement(react_native_svg_1.Svg, __assign({ viewBox: "0 0 16 16" }, props),
-    react_1.default.createElement(react_native_svg_1.Path, { d: "M2 1H11C12.1 1 13 1.9 13 3V10C13 11.1 12.1 12 11 12H2C0.9 12 0 11.1 0 10V3C0 1.9 0.9 1 2 1ZM11 3H2V4.5H11V3ZM2 6.5V10H11V6.5H2ZM2 15.19H11.25C13.87 15.19 16 13.06 16 10.44V4.5H14V10.44C14 11.96 12.76 13.19 11.25 13.19H2V15.19Z", fill: "currentColor", fillRule: "evenodd" }))); };
-exports.Payment = Payment;

package/dist/providers/icons/ShowPassword.d.ts

@@ -1,2 +0,0 @@
-import { SvgProps } from 'react-native-svg';
-export declare const ShowPassword: (props: SvgProps) => JSX.Element;

package/dist/providers/icons/ShowPassword.js

@@ -1,22 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ShowPassword = void 0;
-var react_1 = __importDefault(require("react"));
-var react_native_svg_1 = require("react-native-svg");
-var ShowPassword = function (props) { return (react_1.default.createElement(react_native_svg_1.Svg, __assign({ viewBox: "0 0 16 16" }, props),
-    react_1.default.createElement(react_native_svg_1.Path, { d: "M8 3.5C4.89086 3.5 2.07286 5.21886 0 8C2.07286 10.7811 4.89086 12.5 8 12.5C11.1091 12.5 13.9271 10.7811 16 8C13.9271 5.21886 11.1091 3.5 8 3.5ZM8 5C9.65714 5 11 6.34286 11 8C11 9.65714 9.65714 11 8 11C6.34286 11 5 9.65714 5 8C5 6.34286 6.34286 5 8 5ZM8 6.5C7.17171 6.5 6.5 7.17171 6.5 8C6.5 8.82829 7.17171 9.5 8 9.5C8.82829 9.5 9.5 8.82829 9.5 8C9.5 7.17171 8.82829 6.5 8 6.5Z", fill: "currentColor" }))); };
-exports.ShowPassword = ShowPassword;

package/dist/providers/icons/Usage.d.ts

@@ -1,2 +0,0 @@
-import { SvgProps } from 'react-native-svg';
-export declare const Usage: (props: SvgProps) => JSX.Element;

package/dist/providers/icons/Usage.js

@@ -1,22 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Usage = void 0;
-var react_1 = __importDefault(require("react"));
-var react_native_svg_1 = require("react-native-svg");
-var Usage = function (props) { return (react_1.default.createElement(react_native_svg_1.Svg, __assign({ viewBox: "0 0 16 16" }, props),
-    react_1.default.createElement(react_native_svg_1.Path, { d: "M2 14V0H0V16H16V14H2ZM5 10H3V13H5V10ZM6.33 3H8.33V13H6.33V3ZM11.67 9H9.67V13H11.67V9ZM13 7H15V13H13V7Z", fill: "currentColor", fillRule: "evenodd" }))); };
-exports.Usage = Usage;

package/dist/theme/create-theme.d.ts

@@ -1,34 +0,0 @@
-import { Theme } from './theme';
-/**
- * Use 3 level Partial instead of a Recursive Deep Partial, to avoid infinite nested recursion
- * if any of the props contain recursive elements. For example logos / icons
- */
-declare type ThreeLevelPartial<T> = {
-  [P in keyof T]?: TwoLevelPartial<T[P]>;
-};
-declare type TwoLevelPartial<T> = {
-  [P in keyof T]?: OneLevelPartial<T[P]>;
-};
-declare type OneLevelPartial<T> = {
-  [P in keyof T]?: Partial<T[P]>;
-};
-export declare type RequiredThemeKeys = Pick<
-  Theme,
-  | 'borderWidths'
-  | 'radii'
-  | 'breakpoints'
-  | 'shadows'
-  | 'space'
-  | 'fonts'
-  | 'lineHeights'
-  | 'fontSizes'
-  | 'responsiveFontSizes'
-  | 'responsiveLineHeights'
-  | 'colors'
->;
-export declare const defaultTokens: RequiredThemeKeys;
-export declare function createTheme<T, A = object>(
-  customTheme: ThreeLevelPartial<Theme> & T,
-  additional?: ThreeLevelPartial<Theme> & A,
-): Theme & T & A;
-export {};