@ovotech/element-native 3.8.1 → 4.0.0-canary-a872093-246

package/dist/components/ProductCarousel/anchor-point.js

@@ -1,33 +1,53 @@
-const s = (r) => {
-  "worklet";
-  return r && r.width > 0 && r.height > 0;
-}, a = { x: 0.5, y: 0.5 }, l = (r, e, h) => {
-  "worklet";
-  if (!s(h))
-    return r;
-  let t = r.transform;
-  if (!t)
-    return r;
-  if (e.x !== a.x && h.width) {
-    const n = [];
-    n.push({
-      translateX: h.width * (e.x - a.x)
-    }), t = [...n, ...t], t.push({
-      translateX: h.width * (a.x - e.x)
-    });
-  }
-  if (!Array.isArray(t))
-    return { transform: t };
-  if (e.y !== a.y && h.height) {
-    const n = [];
-    n.push({
-      translateY: h.height * (e.y - a.y)
-    }), t = [...n, ...t], t.push({
-      translateY: h.height * (a.y - e.y)
-    });
-  }
-  return { transform: t };
+"use strict";
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
 };
-export {
-  l as withAnchorPoint
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.withAnchorPoint = void 0;
+var isValidSize = function (size) {
+    'worklet';
+    return size && size.width > 0 && size.height > 0;
 };
+var defaultAnchorPoint = { x: 0.5, y: 0.5 };
+var withAnchorPoint = function (transform, anchorPoint, size) {
+    'worklet';
+    if (!isValidSize(size))
+        return transform;
+    var injectedTransform = transform.transform;
+    if (!injectedTransform)
+        return transform;
+    if (anchorPoint.x !== defaultAnchorPoint.x && size.width) {
+        var shiftTranslateX = [];
+        // shift before rotation
+        shiftTranslateX.push({
+            translateX: size.width * (anchorPoint.x - defaultAnchorPoint.x),
+        });
+        injectedTransform = __spreadArray(__spreadArray([], shiftTranslateX, true), injectedTransform, true);
+        // shift after rotation
+        injectedTransform.push({
+            translateX: size.width * (defaultAnchorPoint.x - anchorPoint.x),
+        });
+    }
+    if (!Array.isArray(injectedTransform))
+        return { transform: injectedTransform };
+    if (anchorPoint.y !== defaultAnchorPoint.y && size.height) {
+        var shiftTranslateY = [];
+        // shift before rotation
+        shiftTranslateY.push({
+            translateY: size.height * (anchorPoint.y - defaultAnchorPoint.y),
+        });
+        injectedTransform = __spreadArray(__spreadArray([], shiftTranslateY, true), injectedTransform, true);
+        // shift after rotation
+        injectedTransform.push({
+            translateY: size.height * (defaultAnchorPoint.y - anchorPoint.y),
+        });
+    }
+    return { transform: injectedTransform };
+};
+exports.withAnchorPoint = withAnchorPoint;

package/dist/components/ProductCarousel/index.js

@@ -1,101 +1,5 @@
-import { ProductCarousel as Uo } from "./ProductCarousel.js";
-import "react/jsx-runtime";
-import "../../utils-HsZygzDh.js";
-import "react";
-import "react-native";
-import "react-native-reanimated";
-import "../../styled.native-KEscfVp7.js";
-import "react-native-gesture-handler";
-import "react-native-svg";
-import "../../hooks/use-breakpoint.js";
-import "../Icon/Icon.js";
-import "../../providers/IconsProvider.js";
-import "../../providers/icons/Address.js";
-import "../../providers/icons/Advice.js";
-import "../../providers/icons/Archive.js";
-import "../../providers/icons/ArrowDown.js";
-import "../../providers/icons/ArrowLeft.js";
-import "../../providers/icons/ArrowRight.js";
-import "../../providers/icons/ArrowUp.js";
-import "../../providers/icons/Award.js";
-import "../../providers/icons/Battery.js";
-import "../../providers/icons/Cal.js";
-import "../../providers/icons/CalBook.js";
-import "../../providers/icons/CaretDown.js";
-import "../../providers/icons/CaretLeft.js";
-import "../../providers/icons/CaretRight.js";
-import "../../providers/icons/CaretUp.js";
-import "../../providers/icons/Chart.js";
-import "../../providers/icons/ChartFilled.js";
-import "../../providers/icons/Check.js";
-import "../../providers/icons/CheckCircle.js";
-import "../../providers/icons/ChevronDown.js";
-import "../../providers/icons/ChevronLeft.js";
-import "../../providers/icons/ChevronLeftSmall.js";
-import "../../providers/icons/ChevronLeftSmallFirst.js";
-import "../../providers/icons/ChevronRight.js";
-import "../../providers/icons/ChevronRightSmall.js";
-import "../../providers/icons/ChevronRightSmallLast.js";
-import "../../providers/icons/ChevronUp.js";
-import "../../providers/icons/Circle.js";
-import "../../providers/icons/CloseCircle.js";
-import "../../providers/icons/Cross.js";
-import "../../providers/icons/Doc.js";
-import "../../providers/icons/Dollar.js";
-import "../../providers/icons/Download.js";
-import "../../providers/icons/Eco.js";
-import "../../providers/icons/EcoHome.js";
-import "../../providers/icons/Edit.js";
-import "../../providers/icons/ElectricCar.js";
-import "../../providers/icons/ElectricHome.js";
-import "../../providers/icons/Electricity.js";
-import "../../providers/icons/EnergyAdvice.js";
-import "../../providers/icons/Equals.js";
-import "../../providers/icons/Euro.js";
-import "../../providers/icons/Gas.js";
-import "../../providers/icons/GlobeAddress.js";
-import "../../providers/icons/Help.js";
-import "../../providers/icons/Hide.js";
-import "../../providers/icons/Home.js";
-import "../../providers/icons/HomeFilled.js";
-import "../../providers/icons/HydroPower.js";
-import "../../providers/icons/Info.js";
-import "../../providers/icons/Link.js";
-import "../../providers/icons/Logo.js";
-import "../../providers/icons/Mail.js";
-import "../../providers/icons/MailOpen.js";
-import "../../providers/icons/Menu.js";
-import "../../providers/icons/Message.js";
-import "../../providers/icons/MessageFilled.js";
-import "../../providers/icons/Minus.js";
-import "../../providers/icons/Mobile.js";
-import "../../providers/icons/NewWindow.js";
-import "../../providers/icons/PaymentCard.js";
-import "../../providers/icons/Phone.js";
-import "../../providers/icons/Plus.js";
-import "../../providers/icons/Pound.js";
-import "../../providers/icons/Pricing.js";
-import "../../providers/icons/Search.js";
-import "../../providers/icons/Security.js";
-import "../../providers/icons/Show.js";
-import "../../providers/icons/SmartHome.js";
-import "../../providers/icons/SmartMeter.js";
-import "../../providers/icons/Solar.js";
-import "../../providers/icons/Star.js";
-import "../../providers/icons/Sun.js";
-import "../../providers/icons/Torch.js";
-import "../../providers/icons/Trees.js";
-import "../../providers/icons/Tune.js";
-import "../../providers/icons/User.js";
-import "../../providers/icons/UserFilled.js";
-import "../../providers/icons/Wallet.js";
-import "../../providers/icons/WalletFilled.js";
-import "../../providers/icons/WarmHome.js";
-import "../../providers/icons/Warning.js";
-import "../../providers/icons/WebAddress.js";
-import "../../providers/icons/WindPower.js";
-import "./NavigationDots.js";
-import "./anchor-point.js";
-export {
-  Uo as ProductCarousel
-};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ProductCarousel = void 0;
+var ProductCarousel_1 = require("./ProductCarousel");
+Object.defineProperty(exports, "ProductCarousel", { enumerable: true, get: function () { return ProductCarousel_1.ProductCarousel; } });

package/dist/components/Radio/Radio.js

@@ -1,70 +1,68 @@
-import { jsx as i, jsxs as l } from "react/jsx-runtime";
-import { n as t } from "../../utils-HsZygzDh.js";
-import { forwardRef as m } from "react";
-import { TouchableOpacity as u, View as h } from "react-native";
-import { s as n } from "../../styled.native-KEscfVp7.js";
-import { HintText as b } from "../HintText/HintText.js";
-import { LabelText as $ } from "../LabelText/LabelText.js";
-import "../../utils/utils.js";
-import "../../hooks/use-breakpoint.js";
-const f = n.View(({ theme: { core: r } }) => `
-      width: ${t(r.space[6])};
-      height: ${t(r.space[6])};
-      margin-right: 10px;
-    `), g = n.View(
-  ({ theme: { core: r, semantic: e }, invalid: o, checked: a }) => `
-      width: ${t(r.space[6])};
-      height: ${t(r.space[6])};
-      border: ${t(r.borderWidth.small)} solid;
-      align-items: center;
-      justify-content: center;
-      border-radius: ${t(r.space[6])};
-      border-color: ${o ? e.message.error : a ? r.color.blue.dark : e.border.functional};
-      background: ${a ? r.color.blue.lightest : "transparent"};
-    `
-), y = n.View(
-  ({ theme: { core: r }, checked: e }) => `
-      width: ${t(r.space[3])};
-      height: ${t(r.space[3])};
-      border-radius: ${t(r.space[3])};
-      background: ${r.color.blue.dark};
-      opacity: ${e ? 1 : 0};
-    `
-), w = ({ checked: r, invalid: e, testID: o, ...a }) => /* @__PURE__ */ i(f, { ...a, children: /* @__PURE__ */ i(g, { invalid: e, checked: r, testID: o, children: /* @__PURE__ */ i(y, { checked: r }) }) }), x = n.View(
-  ({ theme: { core: r } }) => `
-    padding-top: ${t(r.space[3])};
-    flex-direction: row;
-  `
-), H = m(
-  ({
-    label: r,
-    hint: e,
-    checked: o,
-    invalid: a,
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    value: R,
-    // "value" is needed for RadioGroup, but isn't actually used in the radio anywhere
-    activeOpacity: s = 0.8,
-    testID: d,
-    ...p
-  }, c) => /* @__PURE__ */ i(
-    u,
-    {
-      ref: c,
-      accessibilityRole: "radio",
-      activeOpacity: s,
-      accessibilityState: { checked: o },
-      ...p,
-      children: /* @__PURE__ */ l(x, { children: [
-        /* @__PURE__ */ i(w, { checked: o, invalid: a, testID: d }),
-        /* @__PURE__ */ l(h, { style: { flexShrink: 1 }, children: [
-          /* @__PURE__ */ i($, { children: r }),
-          e ? /* @__PURE__ */ i(b, { children: e }) : null
-        ] })
-      ] })
-    }
-  )
-);
-export {
-  H as Radio
+"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 __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.Radio = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var element_core_1 = require("@ovotech/element-core");
+var react_1 = require("react");
+var react_native_1 = require("react-native");
+var styled_native_1 = __importDefault(require("../../styled.native"));
+var HintText_1 = require("../HintText");
+var LabelText_1 = require("../LabelText");
+var StyledRadioInputWrapper = styled_native_1.default.View(function (_a) {
+    var core = _a.theme.core;
+    return "\n      width: ".concat((0, element_core_1.numToPx)(core.space[6]), ";\n      height: ").concat((0, element_core_1.numToPx)(core.space[6]), ";\n      margin-right: 10px;\n    ");
+});
+var StyledRadioInput = styled_native_1.default.View(function (_a) {
+    var _b = _a.theme, core = _b.core, semantic = _b.semantic, invalid = _a.invalid, checked = _a.checked;
+    return "\n      width: ".concat((0, element_core_1.numToPx)(core.space[6]), ";\n      height: ").concat((0, element_core_1.numToPx)(core.space[6]), ";\n      border: ").concat((0, element_core_1.numToPx)(core.borderWidth.small), " solid;\n      align-items: center;\n      justify-content: center;\n      border-radius: ").concat((0, element_core_1.numToPx)(core.space[6]), ";\n      border-color: ").concat(invalid
+        ? semantic.message.error
+        : checked
+            ? core.color.blue.dark
+            : semantic.border.functional, ";\n      background: ").concat(checked ? core.color.blue.lightest : 'transparent', ";\n    ");
+});
+var StyledRadioInputDot = styled_native_1.default.View(function (_a) {
+    var core = _a.theme.core, checked = _a.checked;
+    return "\n      width: ".concat((0, element_core_1.numToPx)(core.space[3]), ";\n      height: ").concat((0, element_core_1.numToPx)(core.space[3]), ";\n      border-radius: ").concat((0, element_core_1.numToPx)(core.space[3]), ";\n      background: ").concat(core.color.blue.dark, ";\n      opacity: ").concat(checked ? 1 : 0, ";\n    ");
+});
+var Input = function (_a) {
+    var checked = _a.checked, invalid = _a.invalid, testID = _a.testID, rest = __rest(_a, ["checked", "invalid", "testID"]);
+    return ((0, jsx_runtime_1.jsx)(StyledRadioInputWrapper, __assign({}, rest, { children: (0, jsx_runtime_1.jsx)(StyledRadioInput, { invalid: invalid, checked: checked, testID: testID, children: (0, jsx_runtime_1.jsx)(StyledRadioInputDot, { checked: checked }) }) })));
+};
+var StyledWrapper = styled_native_1.default.View(function (_a) {
+    var core = _a.theme.core;
+    return "\n    padding-top: ".concat((0, element_core_1.numToPx)(core.space[3]), ";\n    flex-direction: row;\n  ");
+});
+var Radio = (0, react_1.forwardRef)(function (_a, ref) {
+    var label = _a.label, hint = _a.hint, checked = _a.checked, invalid = _a.invalid, 
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    value = _a.value, // "value" is needed for RadioGroup, but isn't actually used in the radio anywhere
+    _b = _a.activeOpacity, // "value" is needed for RadioGroup, but isn't actually used in the radio anywhere
+    activeOpacity = _b === void 0 ? 0.8 : _b, testID = _a.testID, rest = __rest(_a, ["label", "hint", "checked", "invalid", "value", "activeOpacity", "testID"]);
+    return ((0, jsx_runtime_1.jsx)(react_native_1.TouchableOpacity, __assign({ ref: ref, accessibilityRole: "radio", activeOpacity: activeOpacity, accessibilityState: { checked: checked } }, rest, { children: (0, jsx_runtime_1.jsxs)(StyledWrapper, { children: [(0, jsx_runtime_1.jsx)(Input, { checked: checked, invalid: invalid, testID: testID }), (0, jsx_runtime_1.jsxs)(react_native_1.View, { style: { flexShrink: 1 }, children: [(0, jsx_runtime_1.jsx)(LabelText_1.LabelText, { children: label }), hint ? (0, jsx_runtime_1.jsx)(HintText_1.HintText, { children: hint }) : null] })] }) })));
+});
+exports.Radio = Radio;

package/dist/components/Radio/RadioField.d.ts

@@ -1,5 +1,5 @@
 import { PropsWithChildren, ReactNode } from 'react';
-declare type Props = PropsWithChildren<{
+type Props = PropsWithChildren<{
     label: ReactNode;
     value: string;
     onValueChange: (newValue: string | undefined) => void;

package/dist/components/Radio/RadioField.js

@@ -1,48 +1,49 @@
-import { jsx as o, jsxs as p } from "react/jsx-runtime";
-import { Children as d, cloneElement as u } from "react";
-import { View as n } from "react-native";
-import { callAll as x } from "../../utils/utils.js";
-import { ErrorText as h } from "../ErrorText/ErrorText.js";
-import { FormGroup as k } from "../FormGroup/FormGroup.js";
-import { HintText as v } from "../HintText/HintText.js";
-import { LabelText as E } from "../LabelText/LabelText.js";
-import { Stack as T } from "../Stack/Stack.js";
-import "../../hooks/use-breakpoint.js";
-import "../../styled.native-KEscfVp7.js";
-import "../../utils-HsZygzDh.js";
-const S = ({
-  label: s,
-  hint: i,
-  error: e,
-  children: c,
-  optional: a = !1,
-  value: t,
-  onValueChange: l,
-  ...f
-}) => {
-  const m = !!e;
-  return /* @__PURE__ */ o(k, { ...f, error: m, children: /* @__PURE__ */ p(T, { spaceBetween: 1, children: [
-    /* @__PURE__ */ p(n, { children: [
-      /* @__PURE__ */ p(E, { children: [
-        s,
-        a ? " (optional)" : null
-      ] }),
-      i ? /* @__PURE__ */ o(v, { children: i }) : null,
-      e ? /* @__PURE__ */ o(h, { children: e }) : null
-    ] }),
-    /* @__PURE__ */ o(n, { accessibilityRole: "radiogroup", children: d.map(
-      c,
-      (r) => u(r, {
-        invalid: m ? !0 : r.props.invalid,
-        checked: r.props.checked != null ? r.props.checked : t && t === r.props.value,
-        onPress: x(
-          l && (() => l(r.props.value)),
-          r.props.onPress
-        )
-      })
-    ) })
-  ] }) });
+"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);
 };
-export {
-  S as RadioField
+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.RadioField = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var react_native_1 = require("react-native");
+var utils_1 = require("../../utils");
+var ErrorText_1 = require("../ErrorText");
+var FormGroup_1 = require("../FormGroup");
+var HintText_1 = require("../HintText");
+var LabelText_1 = require("../LabelText");
+var Stack_1 = require("../Stack");
+var RadioField = function (_a) {
+    var label = _a.label, hint = _a.hint, error = _a.error, children = _a.children, _b = _a.optional, optional = _b === void 0 ? false : _b, value = _a.value, onValueChange = _a.onValueChange, rest = __rest(_a, ["label", "hint", "error", "children", "optional", "value", "onValueChange"]);
+    var hasError = !!error;
+    var validChildren = (0, utils_1.getValidChildren)(children);
+    return ((0, jsx_runtime_1.jsx)(FormGroup_1.FormGroup, __assign({}, rest, { error: hasError, children: (0, jsx_runtime_1.jsxs)(Stack_1.Stack, { spaceBetween: 1, children: [(0, jsx_runtime_1.jsxs)(react_native_1.View, { children: [(0, jsx_runtime_1.jsxs)(LabelText_1.LabelText, { children: [label, optional ? ' (optional)' : null] }), hint ? (0, jsx_runtime_1.jsx)(HintText_1.HintText, { children: hint }) : null, error ? (0, jsx_runtime_1.jsx)(ErrorText_1.ErrorText, { children: error }) : null] }), (0, jsx_runtime_1.jsx)(react_native_1.View, { accessibilityRole: "radiogroup", children: react_1.Children.map(validChildren, function (child) {
+                        return (0, react_1.cloneElement)(child, {
+                            invalid: hasError ? true : child.props.invalid,
+                            checked: child.props.checked != null
+                                ? child.props.checked
+                                : value && (value === child.props.value ? true : false),
+                            onPress: (0, utils_1.callAll)(onValueChange && (function () { return onValueChange(child.props.value); }), child.props.onPress),
+                        });
+                    }) })] }) })));
+};
+exports.RadioField = RadioField;

package/dist/components/Radio/index.js

@@ -1,18 +1,7 @@
-import { Radio as b } from "./Radio.js";
-import { RadioField as g } from "./RadioField.js";
-import "react/jsx-runtime";
-import "../../utils-HsZygzDh.js";
-import "react";
-import "react-native";
-import "../../styled.native-KEscfVp7.js";
-import "../HintText/HintText.js";
-import "../../utils/utils.js";
-import "../../hooks/use-breakpoint.js";
-import "../LabelText/LabelText.js";
-import "../ErrorText/ErrorText.js";
-import "../FormGroup/FormGroup.js";
-import "../Stack/Stack.js";
-export {
-  b as Radio,
-  g as RadioField
-};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RadioField = exports.Radio = void 0;
+var Radio_1 = require("./Radio");
+Object.defineProperty(exports, "Radio", { enumerable: true, get: function () { return Radio_1.Radio; } });
+var RadioField_1 = require("./RadioField");
+Object.defineProperty(exports, "RadioField", { enumerable: true, get: function () { return RadioField_1.RadioField; } });

package/dist/components/RadioCard/RadioCard.js

@@ -1,69 +1,72 @@
-import { jsx as a, jsxs as m } from "react/jsx-runtime";
-import { n as e } from "../../utils-HsZygzDh.js";
-import { forwardRef as u } from "react";
-import { TouchableOpacity as c } from "react-native";
-import { css as b } from "styled-components";
-import { s } from "../../styled.native-KEscfVp7.js";
-import { LabelText as h } from "../LabelText/LabelText.js";
-import "../../utils/utils.js";
-import "../../hooks/use-breakpoint.js";
-const $ = s.View(({ theme: { core: r } }) => `
-      width: ${e(r.space[6])};
-      height: ${e(r.space[6])};
-      margin-top: ${e(r.space[2])};
-    `), g = s.View(
-  ({ theme: { core: r, semantic: t }, invalid: i, checked: o }) => `
-      width: ${e(r.space[6])};
-      height: ${e(r.space[6])};
-      border: ${e(r.borderWidth.small)} solid;
-      align-items: center;
-      justify-content: center;
-      border-radius: ${e(r.space[6])};
-      border-color: ${i ? t.message.error : o ? r.color.blue.dark : t.border.functional};
-      background: ${o ? r.color.blue.lightest : "transparent"};
-    `
-), f = s.View(
-  ({ theme: { core: r }, checked: t }) => `
-      width: ${e(r.space[3])};
-      height: ${e(r.space[3])};
-      border-radius: ${e(r.space[3])};
-      background: ${r.color.blue.dark};
-      opacity: ${t ? 1 : 0};
-    `
-), y = ({ checked: r, invalid: t, testID: i, ...o }) => /* @__PURE__ */ a($, { ...o, children: /* @__PURE__ */ a(g, { invalid: t, checked: r, testID: i, children: /* @__PURE__ */ a(f, { checked: r }) }) }), w = s.View(
-  ({ theme: { core: r, semantic: t }, checked: i, invalid: o }) => b`
-    align-items: center;
-    background: ${t.surface.elevated};
-    padding: ${e(r.space[2])};
-    min-width: 82px;
-    border-radius: ${e(r.radius.small)};
-    border: ${e(r.borderWidth.medium)} solid;
-    border-color: ${o ? t.message.error : i ? r.color.blue.dark : "transparent"};
-  `
-), C = u(
-  ({
-    label: r,
-    checked: t,
-    invalid: i,
-    activeOpacity: o = 0.8,
-    testID: d,
-    hasInput: n = !0,
-    ...p
-  }, l) => /* @__PURE__ */ a(
-    c,
-    {
-      ref: l,
-      accessibilityRole: "radio",
-      activeOpacity: o,
-      accessibilityState: { checked: t },
-      ...p,
-      children: /* @__PURE__ */ m(w, { checked: t, invalid: i, children: [
-        typeof r == "string" ? /* @__PURE__ */ a(h, { children: r }) : r,
-        n ? /* @__PURE__ */ a(y, { checked: t, invalid: i, testID: d }) : null
-      ] })
-    }
-  )
-);
-export {
-  C as RadioCard
+"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 __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.RadioCard = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var element_core_1 = require("@ovotech/element-core");
+var react_1 = require("react");
+var react_native_1 = require("react-native");
+var styled_components_1 = require("styled-components");
+var styled_native_1 = __importDefault(require("../../styled.native"));
+var LabelText_1 = require("../LabelText");
+var StyledRadioInputWrapper = styled_native_1.default.View(function (_a) {
+    var core = _a.theme.core;
+    return "\n      width: ".concat((0, element_core_1.numToPx)(core.space[6]), ";\n      height: ").concat((0, element_core_1.numToPx)(core.space[6]), ";\n      margin-top: ").concat((0, element_core_1.numToPx)(core.space[2]), ";\n    ");
+});
+var StyledRadioInput = styled_native_1.default.View(function (_a) {
+    var _b = _a.theme, core = _b.core, semantic = _b.semantic, invalid = _a.invalid, checked = _a.checked;
+    return "\n      width: ".concat((0, element_core_1.numToPx)(core.space[6]), ";\n      height: ").concat((0, element_core_1.numToPx)(core.space[6]), ";\n      border: ").concat((0, element_core_1.numToPx)(core.borderWidth.small), " solid;\n      align-items: center;\n      justify-content: center;\n      border-radius: ").concat((0, element_core_1.numToPx)(core.space[6]), ";\n      border-color: ").concat(invalid
+        ? semantic.message.error
+        : checked
+            ? core.color.blue.dark
+            : semantic.border.functional, ";\n      background: ").concat(checked ? core.color.blue.lightest : 'transparent', ";\n    ");
+});
+var StyledRadioInputDot = styled_native_1.default.View(function (_a) {
+    var core = _a.theme.core, checked = _a.checked;
+    return "\n      width: ".concat((0, element_core_1.numToPx)(core.space[3]), ";\n      height: ").concat((0, element_core_1.numToPx)(core.space[3]), ";\n      border-radius: ").concat((0, element_core_1.numToPx)(core.space[3]), ";\n      background: ").concat(core.color.blue.dark, ";\n      opacity: ").concat(checked ? 1 : 0, ";\n    ");
+});
+var Input = function (_a) {
+    var checked = _a.checked, invalid = _a.invalid, testID = _a.testID, rest = __rest(_a, ["checked", "invalid", "testID"]);
+    return ((0, jsx_runtime_1.jsx)(StyledRadioInputWrapper, __assign({}, rest, { children: (0, jsx_runtime_1.jsx)(StyledRadioInput, { invalid: invalid, checked: checked, testID: testID, children: (0, jsx_runtime_1.jsx)(StyledRadioInputDot, { checked: checked }) }) })));
+};
+var StyledWrapper = styled_native_1.default.View(function (_a) {
+    var _b = _a.theme, core = _b.core, semantic = _b.semantic, checked = _a.checked, invalid = _a.invalid;
+    return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    align-items: center;\n    background: ", ";\n    padding: ", ";\n    min-width: 82px;\n    border-radius: ", ";\n    border: ", " solid;\n    border-color: ", ";\n  "], ["\n    align-items: center;\n    background: ", ";\n    padding: ", ";\n    min-width: 82px;\n    border-radius: ", ";\n    border: ", " solid;\n    border-color: ", ";\n  "])), semantic.surface.elevated, (0, element_core_1.numToPx)(core.space[2]), (0, element_core_1.numToPx)(core.radius.small), (0, element_core_1.numToPx)(core.borderWidth.medium), invalid
+        ? semantic.message.error
+        : checked
+            ? core.color.blue.dark
+            : 'transparent');
+});
+exports.RadioCard = (0, react_1.forwardRef)(function (_a, ref) {
+    var label = _a.label, checked = _a.checked, invalid = _a.invalid, _b = _a.activeOpacity, activeOpacity = _b === void 0 ? 0.8 : _b, testID = _a.testID, _c = _a.hasInput, hasInput = _c === void 0 ? true : _c, rest = __rest(_a, ["label", "checked", "invalid", "activeOpacity", "testID", "hasInput"]);
+    return ((0, jsx_runtime_1.jsx)(react_native_1.TouchableOpacity, __assign({ ref: ref, accessibilityRole: "radio", activeOpacity: activeOpacity, accessibilityState: { checked: checked } }, rest, { children: (0, jsx_runtime_1.jsxs)(StyledWrapper, { checked: checked, invalid: invalid, children: [typeof label === 'string' ? (0, jsx_runtime_1.jsx)(LabelText_1.LabelText, { children: label }) : label, hasInput ? ((0, jsx_runtime_1.jsx)(Input, { checked: checked, invalid: invalid, testID: testID })) : null] }) })));
+});
+var templateObject_1;

package/dist/components/RadioCard/index.js

@@ -1,13 +1,5 @@
-import { RadioCard as C } from "./RadioCard.js";
-import "react/jsx-runtime";
-import "../../utils-HsZygzDh.js";
-import "react";
-import "react-native";
-import "styled-components";
-import "../../styled.native-KEscfVp7.js";
-import "../LabelText/LabelText.js";
-import "../../utils/utils.js";
-import "../../hooks/use-breakpoint.js";
-export {
-  C as RadioCard
-};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RadioCard = void 0;
+var RadioCard_1 = require("./RadioCard");
+Object.defineProperty(exports, "RadioCard", { enumerable: true, get: function () { return RadioCard_1.RadioCard; } });