@ovotech/element-native 0.0.1 → 1.0.0

package/dist/components/Accordion/Accordion.d.ts

@@ -0,0 +1,22 @@
+import React, { ReactNode, ComponentProps } from 'react';
+import { TouchableOpacity, TouchableOpacityProps } from 'react-native';
+export declare const Accordion: React.ForwardRefExoticComponent<TouchableOpacityProps & {
+    title: ReactNode;
+    expanded?: boolean | undefined;
+    children?: ReactNode;
+    onToggle?: CallableFunction | undefined;
+    inline?: boolean | undefined;
+    headingComponent?: string | React.ComponentType<any> | undefined;
+} & React.RefAttributes<TouchableOpacity>>;
+declare const StyledAccordionGroup: import("styled-components").StyledComponent<(props: {
+    [x: string]: any;
+    [x: number]: any;
+    [x: symbol]: any;
+} & {
+    theme?: import("../../theme/theme").Theme | undefined;
+} & {
+    as?: string | React.ComponentType<any> | undefined;
+    forwardedAs?: string | React.ComponentType<any> | undefined;
+}) => JSX.Element, import("../../theme/theme").Theme, {}, never>;
+export declare const AccordionGroup: ({ children, ...rest }: ComponentProps<typeof StyledAccordionGroup>) => JSX.Element;
+export {};

package/dist/components/Accordion/Accordion.js

@@ -0,0 +1,105 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+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 __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AccordionGroup = exports.Accordion = void 0;
+var react_1 = __importStar(require("react"));
+var react_native_1 = require("react-native");
+var hooks_1 = require("../../hooks");
+var styled_native_1 = __importStar(require("../../styled.native"));
+var Card_1 = require("../Card");
+var Heading_1 = require("../Heading");
+var Icon_1 = require("../Icon");
+var AccordionHeader = styled_native_1.default.TouchableOpacity(function (_a) {
+    var _b = _a.theme, accordion = _b.accordion, card = _b.card, smallAndUp = _a.smallAndUp;
+    return "\n    flex-direction: row;\n    padding: ".concat(smallAndUp
+        ? accordion.header.paddingVertical[1]
+        : accordion.header.paddingVertical[0], " ").concat(smallAndUp ? card.padding[1] : card.padding[0], ";\n");
+});
+var AccordionHeading = styled_native_1.default.Text(function (_a) {
+    var accordion = _a.theme.accordion;
+    return "\n    color: ".concat(accordion.header.color, ";\n    margin: 0;\n    flex: 1;\n  ");
+});
+var AccordionContent = styled_native_1.default.View(function (_a) {
+    var card = _a.theme.card, smallAndUp = _a.smallAndUp;
+    return "\n    padding: ".concat(smallAndUp ? card.padding[1] : card.padding[0], ";\n    padding-top: 0;\n  ");
+});
+var AccordionIcon = (0, styled_native_1.default)(Icon_1.Icon)(function (_a) {
+    var accordion = _a.theme.accordion;
+    return "\n    margin-right: ".concat(accordion.header.iconGap, ";\n    align-self: center;\n    flex-shrink: 0;\n  ");
+});
+exports.Accordion = (0, react_1.forwardRef)(function (_a, ref) {
+    var children = _a.children, title = _a.title, _b = _a.expanded, expanded = _b === void 0 ? false : _b, onToggle = _a.onToggle, _c = _a.headingComponent, Heading = _c === void 0 ? Heading_1.Heading3 : _c, rest = __rest(_a, ["children", "title", "expanded", "onToggle", "headingComponent"]);
+    var breakpoints = (0, hooks_1.useBreakpoint)();
+    var accordion = (0, react_1.useContext)(styled_native_1.ThemeContext).accordion;
+    var _d = (0, react_1.useState)(expanded), isExpanded = _d[0], setIsExpanded = _d[1];
+    return (react_1.default.createElement(react_native_1.View, __assign({}, rest),
+        react_1.default.createElement(AccordionHeader, __assign({}, breakpoints, { ref: ref, accessibilityState: { expanded: isExpanded }, onPress: function () {
+                setIsExpanded(!isExpanded);
+                onToggle && onToggle(!isExpanded);
+            } }),
+            react_1.default.createElement(AccordionIcon, { name: isExpanded ? 'minus' : 'plus', size: accordion.header.iconSize, color: accordion.header.color }),
+            react_1.default.createElement(AccordionHeading, { as: Heading },
+                react_1.default.createElement(react_native_1.Text, { style: { flex: 1 } }, title))),
+        isExpanded ? (react_1.default.createElement(AccordionContent, __assign({}, breakpoints), children)) : null));
+});
+var StyledAccordionGroup = (0, styled_native_1.default)(Card_1.Card)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  padding: 0;\n"], ["\n  padding: 0;\n"])));
+var Border = styled_native_1.default.View(function (_a) {
+    var card = _a.theme.card;
+    return (0, styled_native_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    border: 0 solid ", ";\n    border-top-width: ", ";\n  "], ["\n    border: 0 solid ", ";\n    border-top-width: ", ";\n  "])), card.borderColor, card.borderWidth);
+});
+var AccordionGroup = function (_a) {
+    var children = _a.children, rest = __rest(_a, ["children"]);
+    return (react_1.default.createElement(StyledAccordionGroup, __assign({}, rest), react_1.Children.map(children, function (child, index) {
+        return index === 0 ? child : react_1.default.createElement(Border, null, child);
+    })));
+};
+exports.AccordionGroup = AccordionGroup;
+var templateObject_1, templateObject_2;

package/dist/components/Accordion/index.d.ts

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

package/dist/components/Accordion/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AccordionGroup = exports.Accordion = void 0;
+var Accordion_1 = require("./Accordion");
+Object.defineProperty(exports, "Accordion", { enumerable: true, get: function () { return Accordion_1.Accordion; } });
+Object.defineProperty(exports, "AccordionGroup", { enumerable: true, get: function () { return Accordion_1.AccordionGroup; } });

package/dist/components/Badge/Badge.d.ts

@@ -0,0 +1,13 @@
+import { ComponentProps } from 'react';
+export declare type BadgeVariantName = 'default' | 'error' | 'success' | 'warning' | 'info';
+export declare type BadgeVariant = {
+    background: string;
+    foreground: string;
+    borderColor: string;
+};
+declare const StyledBadge: import("styled-components").StyledComponent<typeof import("react-native").View, import("../../theme/theme").Theme, {
+    variant?: BadgeVariantName | (string & {}) | undefined;
+}, never>;
+declare type BadgeProps = ComponentProps<typeof StyledBadge>;
+export declare const Badge: ({ children, variant, ...rest }: BadgeProps) => JSX.Element;
+export {};

package/dist/components/Badge/Badge.js

@@ -0,0 +1,81 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+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 __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Badge = void 0;
+var react_1 = __importDefault(require("react"));
+var hooks_1 = require("../../hooks");
+var styled_native_1 = __importStar(require("../../styled.native"));
+var theme_1 = require("../../theme");
+var StyledBadge = styled_native_1.default.View(function (_a) {
+    var badge = _a.theme.badge, _b = _a.variant, variant = _b === void 0 ? 'default' : _b;
+    // @ts-ignore to support additional palettes.
+    var currentVariant = badge.variants[variant];
+    return (0, styled_native_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    padding: ", " ", ";\n    border-radius: ", ";\n    background-color: ", ";\n    border: ", " solid ", ";\n    align-self: flex-start;\n  "], ["\n    padding: ", " ", ";\n    border-radius: ", ";\n    background-color: ", ";\n    border: ", " solid ", ";\n    align-self: flex-start;\n  "])), badge.paddingVertical, badge.paddingHorizontal, badge.borderRadius, currentVariant.background, badge.borderWidth, currentVariant.borderColor);
+});
+var StyledBadgeText = styled_native_1.default.Text(function (_a) {
+    var badge = _a.theme.badge, _b = _a.variant, variant = _b === void 0 ? 'default' : _b, smallAndUp = _a.smallAndUp;
+    // @ts-ignore to support additional palettes.
+    var currentVariant = badge.variants[variant];
+    return (0, styled_native_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    font-weight: ", ";\n    line-height: ", ";\n    color: ", ";\n    font-size: ", ";\n  "], ["\n    font-weight: ", ";\n    line-height: ", ";\n    color: ", ";\n    font-size: ", ";\n  "])), badge.fontWeight, smallAndUp
+        ? (0, theme_1.calculateLineHeight)(badge.fontSize[1], badge.lineHeight)
+        : (0, theme_1.calculateLineHeight)(badge.fontSize[0], badge.lineHeight), currentVariant.foreground, smallAndUp ? badge.fontSize[1] : badge.fontSize[0]);
+});
+var Badge = function (_a) {
+    var children = _a.children, variant = _a.variant, rest = __rest(_a, ["children", "variant"]);
+    var smallAndUp = (0, hooks_1.useBreakpoint)().smallAndUp;
+    return (react_1.default.createElement(StyledBadge, __assign({}, rest, { variant: variant }),
+        react_1.default.createElement(StyledBadgeText, { variant: variant, smallAndUp: smallAndUp }, children)));
+};
+exports.Badge = Badge;
+var templateObject_1, templateObject_2;

package/dist/components/Badge/index.d.ts

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

package/dist/components/Badge/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Badge = void 0;
+var Badge_1 = require("./Badge");
+Object.defineProperty(exports, "Badge", { enumerable: true, get: function () { return Badge_1.Badge; } });

package/dist/components/CTAButton/CTAButton.d.ts

@@ -0,0 +1,24 @@
+import React, { PropsWithChildren, ComponentProps, Ref } from 'react';
+import { TouchableOpacityProps, TouchableOpacity } from 'react-native';
+import { IconName } from '../Icon/Icon';
+export declare type CTAVariantName = 'primary' | 'secondary' | 'destructive' | 'missionPrimary' | 'missionSecondary';
+export declare type CTAVariant = {
+    background: string;
+    foreground: string;
+    border: string;
+};
+declare type CTAButtonProps = PropsWithChildren<TouchableOpacityProps & {
+    iconLeft?: IconName | 'off';
+    iconRight?: IconName | 'off';
+    fullWidth?: 'always' | 'never' | 'small';
+    variant?: CTAVariantName | (string & {});
+    ref?: Ref<TouchableOpacity>;
+}>;
+declare const CTAButton: ({ iconLeft, iconRight, children, fullWidth, variant, ...rest }: CTAButtonProps) => JSX.Element;
+declare type CTAProps = Omit<ComponentProps<typeof CTAButton>, 'variant' | 'ref'> & {
+    ref: Ref<TouchableOpacity>;
+};
+declare const PrimaryCTAButton: React.ForwardRefExoticComponent<Pick<CTAProps, "fullWidth" | "iconLeft" | "iconRight" | keyof TouchableOpacityProps> & React.RefAttributes<TouchableOpacity>>;
+declare const SecondaryCTAButton: React.ForwardRefExoticComponent<Pick<CTAProps, "fullWidth" | "iconLeft" | "iconRight" | keyof TouchableOpacityProps> & React.RefAttributes<TouchableOpacity>>;
+declare const DestructiveCTAButton: React.ForwardRefExoticComponent<Pick<CTAProps, "fullWidth" | "iconLeft" | "iconRight" | keyof TouchableOpacityProps> & React.RefAttributes<TouchableOpacity>>;
+export { CTAButton, PrimaryCTAButton, SecondaryCTAButton, DestructiveCTAButton, };

package/dist/components/CTAButton/CTAButton.js

@@ -0,0 +1,107 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+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 __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DestructiveCTAButton = exports.SecondaryCTAButton = exports.PrimaryCTAButton = exports.CTAButton = void 0;
+var react_1 = __importStar(require("react"));
+var hooks_1 = require("../../hooks");
+var styled_native_1 = __importStar(require("../../styled.native"));
+var theme_1 = require("../../theme");
+var Icon_1 = require("../Icon/Icon");
+var StyledCTAWrapper = styled_native_1.default.TouchableOpacity(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  align-self: flex-start;\n  flex-direction: row;\n  align-items: flex-start;\n"], ["\n  align-self: flex-start;\n  flex-direction: row;\n  align-items: flex-start;\n"])));
+var CTAButtonWrapper = function (_a) {
+    var children = _a.children, _b = _a.accessibilityRole, accessibilityRole = _b === void 0 ? 'button' : _b, _c = _a.activeOpacity, activeOpacity = _c === void 0 ? 0.8 : _c, rest = __rest(_a, ["children", "accessibilityRole", "activeOpacity"]);
+    return (react_1.default.createElement(StyledCTAWrapper, __assign({ accessibilityRole: accessibilityRole, activeOpacity: activeOpacity }, rest), children));
+};
+var StyledInner = styled_native_1.default.View(function (_a) {
+    var cta = _a.theme.cta, fullWidth = _a.fullWidth, variant = _a.variant;
+    // @ts-ignore to support additional palettes.
+    var currentVariant = cta.variants[variant];
+    return (0, styled_native_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n    padding: ", " ", ";\n    border-color: ", ";\n    background-color: ", ";\n    border-width: ", ";\n    border-radius: ", ";\n    min-height: ", ";\n    border-style: solid;\n    justify-content: center;\n    align-items: center;\n    flex-direction: row;\n    flex-grow: 1;\n\n    ", ";\n  "], ["\n    padding: ", " ", ";\n    border-color: ", ";\n    background-color: ", ";\n    border-width: ", ";\n    border-radius: ", ";\n    min-height: ", ";\n    border-style: solid;\n    justify-content: center;\n    align-items: center;\n    flex-direction: row;\n    flex-grow: 1;\n\n    ", ";\n  "])), cta.paddingVertical, cta.paddingHorizontal, currentVariant.border, currentVariant.background, cta.borderWidth, cta.borderRadius, cta.minHeight, fullWidth === 'never'
+        ? (0, styled_native_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n          flex-grow: 0;\n        "], ["\n          flex-grow: 0;\n        "]))) : '');
+});
+var StyledRightIcon = (0, styled_native_1.default)(Icon_1.Icon)(function (_a) {
+    var cta = _a.theme.cta;
+    return (0, styled_native_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n    margin-left: ", ";\n  "], ["\n    margin-left: ", ";\n  "])), cta.iconGap);
+});
+var StyledLeftIcon = (0, styled_native_1.default)(Icon_1.Icon)(function (_a) {
+    var cta = _a.theme.cta;
+    return (0, styled_native_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n    margin-right: ", ";\n  "], ["\n    margin-right: ", ";\n  "])), cta.iconGap);
+});
+var StyledCTAButtonText = styled_native_1.default.Text(function (_a) {
+    var cta = _a.theme.cta, smallAndUp = _a.smallAndUp, variant = _a.variant;
+    var fontSize = smallAndUp ? cta.fontSize[1] : cta.fontSize[0];
+    // @ts-ignore to support additional palettes.
+    var currentVariant = cta.variants[variant];
+    return (0, styled_native_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n    color: ", ";\n    font-family: ", ";\n    font-size: ", ";\n    font-weight: ", ";\n    line-height: ", ";\n    text-align: left;\n    flex-shrink: 2;\n  "], ["\n    color: ", ";\n    font-family: ", ";\n    font-size: ", ";\n    font-weight: ", ";\n    line-height: ", ";\n    text-align: left;\n    flex-shrink: 2;\n  "])), currentVariant.foreground, cta.font, fontSize, cta.fontWeight, (0, theme_1.calculateLineHeight)(fontSize, cta.lineHeight));
+});
+var CTAButton = function (_a) {
+    var _b = _a.iconLeft, iconLeft = _b === void 0 ? 'off' : _b, _c = _a.iconRight, iconRight = _c === void 0 ? 'off' : _c, children = _a.children, _d = _a.fullWidth, fullWidth = _d === void 0 ? 'small' : _d, _e = _a.variant, variant = _e === void 0 ? 'primary' : _e, rest = __rest(_a, ["iconLeft", "iconRight", "children", "fullWidth", "variant"]);
+    var cta = (0, react_1.useContext)(styled_native_1.ThemeContext).cta;
+    var smallAndUp = (0, hooks_1.useBreakpoint)().smallAndUp;
+    // @ts-ignore to support additional palettes.
+    var currentVariant = cta.variants[variant];
+    if (fullWidth === 'small') {
+        fullWidth = smallAndUp ? 'never' : 'always';
+    }
+    return (react_1.default.createElement(CTAButtonWrapper, __assign({}, rest),
+        react_1.default.createElement(StyledInner, { fullWidth: fullWidth, variant: variant },
+            iconLeft !== 'off' ? (react_1.default.createElement(StyledLeftIcon, { name: iconLeft, size: 16, color: currentVariant.foreground })) : null,
+            react_1.default.createElement(StyledCTAButtonText, { smallAndUp: smallAndUp, variant: variant }, children),
+            iconRight !== 'off' ? (react_1.default.createElement(StyledRightIcon, { name: iconRight, size: 16, color: currentVariant.foreground })) : null)));
+};
+exports.CTAButton = CTAButton;
+var PrimaryCTAButton = (0, react_1.forwardRef)(function (props, ref) { return (react_1.default.createElement(CTAButton, __assign({ variant: "primary" }, props, { ref: ref }))); });
+exports.PrimaryCTAButton = PrimaryCTAButton;
+var SecondaryCTAButton = (0, react_1.forwardRef)(function (props, ref) { return (react_1.default.createElement(CTAButton, __assign({ variant: "secondary" }, props, { ref: ref }))); });
+exports.SecondaryCTAButton = SecondaryCTAButton;
+var DestructiveCTAButton = (0, react_1.forwardRef)(function (props, ref) { return (react_1.default.createElement(CTAButton, __assign({ variant: "destructive" }, props, { ref: ref }))); });
+exports.DestructiveCTAButton = DestructiveCTAButton;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/dist/components/CTAButton/index.d.ts

@@ -0,0 +1 @@
+export { CTAButton, DestructiveCTAButton, PrimaryCTAButton, SecondaryCTAButton, } from './CTAButton';

package/dist/components/CTAButton/index.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SecondaryCTAButton = exports.PrimaryCTAButton = exports.DestructiveCTAButton = exports.CTAButton = void 0;
+var CTAButton_1 = require("./CTAButton");
+Object.defineProperty(exports, "CTAButton", { enumerable: true, get: function () { return CTAButton_1.CTAButton; } });
+Object.defineProperty(exports, "DestructiveCTAButton", { enumerable: true, get: function () { return CTAButton_1.DestructiveCTAButton; } });
+Object.defineProperty(exports, "PrimaryCTAButton", { enumerable: true, get: function () { return CTAButton_1.PrimaryCTAButton; } });
+Object.defineProperty(exports, "SecondaryCTAButton", { enumerable: true, get: function () { return CTAButton_1.SecondaryCTAButton; } });

package/dist/components/CTALink/CTALink.d.ts

@@ -0,0 +1,12 @@
+import React, { ComponentProps, Ref } from 'react';
+import { TouchableOpacity } from 'react-native';
+import { CTAButton } from '../CTAButton';
+declare type CTALinkProps = Omit<ComponentProps<typeof CTAButton>, 'ref'> & {
+    ref: Ref<TouchableOpacity>;
+    opensInNewWindow?: boolean;
+};
+declare const CTALink: React.ForwardRefExoticComponent<Pick<CTALinkProps, "variant" | "fullWidth" | "iconLeft" | "iconRight" | keyof import("react-native").TouchableOpacityProps | "opensInNewWindow"> & React.RefAttributes<TouchableOpacity>>;
+declare type CTAProps = Omit<ComponentProps<typeof CTALink>, 'variant'>;
+declare const PrimaryCTALink: React.ForwardRefExoticComponent<Pick<CTAProps, "fullWidth" | "key" | "iconLeft" | "iconRight" | keyof import("react-native").TouchableOpacityProps | "opensInNewWindow"> & React.RefAttributes<TouchableOpacity>>;
+declare const SecondaryCTALink: React.ForwardRefExoticComponent<Pick<CTAProps, "fullWidth" | "key" | "iconLeft" | "iconRight" | keyof import("react-native").TouchableOpacityProps | "opensInNewWindow"> & React.RefAttributes<TouchableOpacity>>;
+export { CTALink, PrimaryCTALink, SecondaryCTALink };

package/dist/components/CTALink/CTALink.js

@@ -0,0 +1,65 @@
+"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 __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SecondaryCTALink = exports.PrimaryCTALink = exports.CTALink = void 0;
+var react_1 = __importStar(require("react"));
+var CTAButton_1 = require("../CTAButton");
+var CTALink = (0, react_1.forwardRef)(function (_a, ref) {
+    var iconRight = _a.iconRight, opensInNewWindow = _a.opensInNewWindow, rest = __rest(_a, ["iconRight", "opensInNewWindow"]);
+    if (!iconRight && opensInNewWindow) {
+        iconRight = 'new-window';
+    }
+    else if (!iconRight) {
+        iconRight = 'chevron-right';
+    }
+    return react_1.default.createElement(CTAButton_1.CTAButton, __assign({ iconRight: iconRight }, rest, { ref: ref }));
+});
+exports.CTALink = CTALink;
+var PrimaryCTALink = (0, react_1.forwardRef)(function (props, ref) { return react_1.default.createElement(CTALink, __assign({ variant: "primary", ref: ref }, props)); });
+exports.PrimaryCTALink = PrimaryCTALink;
+var SecondaryCTALink = (0, react_1.forwardRef)(function (props, ref) { return (react_1.default.createElement(CTALink, __assign({ variant: "secondary", ref: ref }, props))); });
+exports.SecondaryCTALink = SecondaryCTALink;

package/dist/components/CTALink/index.d.ts

@@ -0,0 +1 @@
+export { CTALink, PrimaryCTALink, SecondaryCTALink } from './CTALink';

package/dist/components/CTALink/index.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SecondaryCTALink = exports.PrimaryCTALink = exports.CTALink = void 0;
+var CTALink_1 = require("./CTALink");
+Object.defineProperty(exports, "CTALink", { enumerable: true, get: function () { return CTALink_1.CTALink; } });
+Object.defineProperty(exports, "PrimaryCTALink", { enumerable: true, get: function () { return CTALink_1.PrimaryCTALink; } });
+Object.defineProperty(exports, "SecondaryCTALink", { enumerable: true, get: function () { return CTALink_1.SecondaryCTALink; } });

package/dist/components/Card/Card.d.ts

@@ -0,0 +1,7 @@
+import { ComponentProps } from 'react';
+import { Breakpoints } from '../../hooks';
+declare const StyledCard: import("styled-components").StyledComponent<typeof import("react-native").View, import("../../theme/theme").Theme, Breakpoints & {
+    inline?: boolean | undefined;
+}, never>;
+declare const Card: (props: ComponentProps<typeof StyledCard>) => JSX.Element;
+export { Card };

package/dist/components/Card/Card.js

@@ -0,0 +1,32 @@
+"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.Card = void 0;
+var react_1 = __importDefault(require("react"));
+var hooks_1 = require("../../hooks");
+var styled_native_1 = __importDefault(require("../../styled.native"));
+var StyledCard = styled_native_1.default.View(function (_a) {
+    var card = _a.theme.card, smallAndUp = _a.smallAndUp, _b = _a.inline, inline = _b === void 0 ? false : _b;
+    var padding = smallAndUp ? card.padding[1] : card.padding[0];
+    return "\n      background: ".concat(card.background, ";\n      border-radius: ").concat(card.borderRadius, ";\n      border: ").concat(card.borderWidth, " solid ").concat(card.borderColor, ";\n      padding: ").concat(padding, ";\n      ").concat(inline
+        ? ''
+        : "\n              shadow-color: ".concat(card.shadow.color, ";\n              shadow-opacity: ").concat(card.shadow.opacity, ";\n              shadow-offset: ").concat(card.shadow.offset, ";\n              shadow-radius: ").concat(card.shadow.radius, ";\n              elevation: ").concat(card.shadow.elevation, ";\n            "), "\n    ");
+});
+var Card = function (props) {
+    var breakpoints = (0, hooks_1.useBreakpoint)();
+    return react_1.default.createElement(StyledCard, __assign({}, breakpoints, props));
+};
+exports.Card = Card;

package/dist/components/Card/index.d.ts

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

package/dist/components/Card/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Card = void 0;
+var Card_1 = require("./Card");
+Object.defineProperty(exports, "Card", { enumerable: true, get: function () { return Card_1.Card; } });

package/dist/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,12 @@
+import React, { ReactNode } from 'react';
+import { TouchableOpacity, TouchableOpacityProps } from 'react-native';
+declare const Checkbox: React.ForwardRefExoticComponent<Omit<TouchableOpacityProps, "children"> & {
+    label: string;
+    checked: boolean;
+    hint?: ReactNode;
+    error?: ReactNode;
+    optional?: boolean | undefined;
+    invalid?: boolean | undefined;
+    activeOpacity?: number | undefined;
+} & React.RefAttributes<TouchableOpacity>>;
+export { Checkbox };