@ovotech/element-native 5.4.3 → 5.5.0

package/dist/components/Cards/shared.styles.js

@@ -0,0 +1,39 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WrappedContainer = exports.ContainerWithGap = exports.HeadingContainer = exports.CardWithMinHeight = exports.CardBadge = exports.SMALL_CARD_HEIGHT = void 0;
+const react_native_1 = require("react-native");
+const styled_native_1 = __importDefault(require("../../styled.native"));
+const Badge_1 = require("../Badge");
+const Card_1 = require("../Card");
+exports.SMALL_CARD_HEIGHT = 172;
+exports.CardBadge = (0, styled_native_1.default)(Badge_1.Badge)(({ theme }) => ({
+    position: 'absolute',
+    top: theme.space[100],
+    left: theme.space[500],
+    borderWidth: 0,
+    borderTopLeftRadius: 0,
+    borderTopRightRadius: 0,
+    borderBottomLeftRadius: theme.border.radius.md,
+    borderBottomRightRadius: theme.border.radius.md,
+    paddingBottom: theme.space[50],
+    paddingTop: 0,
+    zIndex: 1,
+}));
+exports.CardWithMinHeight = (0, styled_native_1.default)(Card_1.Card)(({ isSmall }) => ({
+    minHeight: isSmall ? exports.SMALL_CARD_HEIGHT : undefined,
+}));
+exports.HeadingContainer = (0, styled_native_1.default)(react_native_1.View)(({ theme }) => ({
+    marginBottom: theme.space[350],
+}));
+exports.ContainerWithGap = (0, styled_native_1.default)(react_native_1.View)(({ theme }) => ({
+    flexDirection: 'row',
+    gap: theme.space[300],
+}));
+exports.WrappedContainer = (0, styled_native_1.default)(react_native_1.View)(({ theme }) => ({
+    flexDirection: 'row',
+    flexWrap: 'wrap',
+    gap: theme.space[100],
+}));

package/dist/components/Cards/types.js

@@ -1 +1,2 @@
-export {};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/components/Cards/{shared.d.ts → utils.d.ts}

@@ -1,3 +1,3 @@
 import { ColorKey } from './types';
-export declare const SmallCardHeight = 172;
+export declare const checkIsSmall: (size?: "default" | "small") => boolean;
 export declare const resolveColor: (colorKey?: ColorKey) => string;

package/dist/components/Cards/utils.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.resolveColor = exports.checkIsSmall = void 0;
+const styled_native_1 = require("../../styled.native");
+const checkIsSmall = (size) => size === 'small';
+exports.checkIsSmall = checkIsSmall;
+const resolveColor = (colorKey = 'default') => {
+    const theme = (0, styled_native_1.useTheme)();
+    if (colorKey === 'default' || !colorKey) {
+        return theme.color.brand.brand;
+    }
+    if (colorKey === 'onSurface') {
+        return theme.color.surface.onSurface;
+    }
+    return colorKey;
+};
+exports.resolveColor = resolveColor;

package/dist/components/Checkbox/Checkbox.js

@@ -1,28 +1,45 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { numToPx } from '@ovotech/element-core';
-import { TouchableOpacity, View, } from 'react-native';
-import styled from '../../styled.native';
-import { ErrorText } from '../ErrorText';
-import { FormGroup } from '../FormGroup';
-import { HintText } from '../HintText';
-import { Icon } from '../Icon/Icon';
-import { LabelText } from '../LabelText';
-import { Stack } from '../Stack';
-const StyledCheckboxInputWrapper = styled.View(({ theme }) => {
+"use strict";
+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.Checkbox = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const element_core_1 = require("@ovotech/element-core");
+const react_native_1 = require("react-native");
+const styled_native_1 = __importDefault(require("../../styled.native"));
+const ErrorText_1 = require("../ErrorText");
+const FormGroup_1 = require("../FormGroup");
+const HintText_1 = require("../HintText");
+const Icon_1 = require("../Icon/Icon");
+const LabelText_1 = require("../LabelText");
+const Stack_1 = require("../Stack");
+const StyledCheckboxInputWrapper = styled_native_1.default.View(({ theme }) => {
     const checkboxSize = theme.space[600];
     const gap = theme.space[200];
     return `
-      width: ${numToPx(checkboxSize + gap)};
-      height: ${numToPx(theme.space[1100])};
+      width: ${(0, element_core_1.numToPx)(checkboxSize + gap)};
+      height: ${(0, element_core_1.numToPx)(theme.space[1100])};
     `;
 });
-const StyledCheckboxInput = styled.View(({ theme, invalid, checked }) => {
+const StyledCheckboxInput = styled_native_1.default.View(({ theme, invalid, checked }) => {
     return `
-      width: ${numToPx(theme.space[600])};
-      height: ${numToPx(theme.space[600])};
-      border: ${numToPx(theme.border.width.md)} solid;
+      width: ${(0, element_core_1.numToPx)(theme.space[600])};
+      height: ${(0, element_core_1.numToPx)(theme.space[600])};
+      border: ${(0, element_core_1.numToPx)(theme.border.width.md)} solid;
       margin-top: 10px;
-      border-radius: ${numToPx(theme.border.radius.xs)};
+      border-radius: ${(0, element_core_1.numToPx)(theme.border.radius.xs)};
       border-color: ${invalid
         ? theme.input.color.borderError
         : checked
@@ -32,27 +49,29 @@ const StyledCheckboxInput = styled.View(({ theme, invalid, checked }) => {
     `;
 });
 const CheckboxCheck = (props) => {
-    return _jsx(Icon, { name: "check", size: 16, ...props });
+    return (0, jsx_runtime_1.jsx)(Icon_1.Icon, Object.assign({ name: "check", size: 16 }, props));
 };
-const StyledCheckboxInputCheck = styled(CheckboxCheck)(({ theme, checked, }) => {
+const StyledCheckboxInputCheck = (0, styled_native_1.default)(CheckboxCheck)(({ theme, checked, }) => {
     return `
-      margin-top: ${numToPx(theme.space[50])};
-      margin-left: ${numToPx(theme.space[50])};
+      margin-top: ${(0, element_core_1.numToPx)(theme.space[50])};
+      margin-left: ${(0, element_core_1.numToPx)(theme.space[50])};
       color: ${theme.color.alert.info};
       opacity: ${checked ? 1 : 0};
     `;
 });
-const Input = ({ checked, invalid, testID, ...rest }) => {
-    return (_jsx(StyledCheckboxInputWrapper, { ...rest, children: _jsx(StyledCheckboxInput, { invalid: invalid, checked: checked, testID: testID, children: _jsx(StyledCheckboxInputCheck, { checked: checked }) }) }));
+const Input = (_a) => {
+    var { checked, invalid, testID } = _a, rest = __rest(_a, ["checked", "invalid", "testID"]);
+    return ((0, jsx_runtime_1.jsx)(StyledCheckboxInputWrapper, Object.assign({}, rest, { children: (0, jsx_runtime_1.jsx)(StyledCheckboxInput, { invalid: invalid, checked: checked, testID: testID, children: (0, jsx_runtime_1.jsx)(StyledCheckboxInputCheck, { checked: checked }) }) })));
 };
-const CheckLabelText = styled(LabelText)(({ theme }) => `
-    padding-top: ${numToPx(theme.space[300])};
+const CheckLabelText = (0, styled_native_1.default)(LabelText_1.LabelText)(({ theme }) => `
+    padding-top: ${(0, element_core_1.numToPx)(theme.space[300])};
   `);
-const StyledWrapper = styled.View `
+const StyledWrapper = styled_native_1.default.View `
   flex-direction: row;
 `;
-const Checkbox = ({ label, hint, error, checked, optional, invalid, activeOpacity = 0.8, testID, ref, ...rest }) => {
+const Checkbox = (_a) => {
+    var { label, hint, error, checked, optional, invalid, activeOpacity = 0.8, testID, ref } = _a, rest = __rest(_a, ["label", "hint", "error", "checked", "optional", "invalid", "activeOpacity", "testID", "ref"]);
     const hasError = !!error;
-    return (_jsx(FormGroup, { error: hasError, children: _jsxs(Stack, { spaceBetween: 1, children: [error ? _jsx(ErrorText, { children: error }) : null, _jsx(TouchableOpacity, { ref: ref, accessible: true, accessibilityRole: "checkbox", activeOpacity: activeOpacity, accessibilityState: { checked }, ...rest, children: _jsxs(StyledWrapper, { children: [_jsx(Input, { checked: checked, invalid: hasError || invalid, testID: testID }), _jsxs(View, { style: { flexShrink: 1 }, children: [_jsxs(CheckLabelText, { children: [label, optional ? ' (optional)' : null] }), hint ? _jsx(HintText, { children: hint }) : null] })] }) })] }) }));
+    return ((0, jsx_runtime_1.jsx)(FormGroup_1.FormGroup, { error: hasError, children: (0, jsx_runtime_1.jsxs)(Stack_1.Stack, { spaceBetween: 1, children: [error ? (0, jsx_runtime_1.jsx)(ErrorText_1.ErrorText, { children: error }) : null, (0, jsx_runtime_1.jsx)(react_native_1.TouchableOpacity, Object.assign({ ref: ref, accessible: true, accessibilityRole: "checkbox", activeOpacity: activeOpacity, accessibilityState: { checked } }, rest, { children: (0, jsx_runtime_1.jsxs)(StyledWrapper, { children: [(0, jsx_runtime_1.jsx)(Input, { checked: checked, invalid: hasError || invalid, testID: testID }), (0, jsx_runtime_1.jsxs)(react_native_1.View, { style: { flexShrink: 1 }, children: [(0, jsx_runtime_1.jsxs)(CheckLabelText, { children: [label, optional ? ' (optional)' : null] }), hint ? (0, jsx_runtime_1.jsx)(HintText_1.HintText, { children: hint }) : null] })] }) }))] }) }));
 };
-export { Checkbox };
+exports.Checkbox = Checkbox;

package/dist/components/Checkbox/CheckboxField.js

@@ -1,17 +1,32 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-import { Children, cloneElement, } from 'react';
-import { View } from 'react-native';
-import { getValidChildren } from '../../utils';
-import { ErrorText } from '../ErrorText';
-import { FormGroup } from '../FormGroup';
-import { HintText } from '../HintText';
-import { LabelText } from '../LabelText';
-import { Stack } from '../Stack';
-const CheckboxField = ({ label, hint, error, children, optional = false, ...rest }) => {
+"use strict";
+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.CheckboxField = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const react_native_1 = require("react-native");
+const utils_1 = require("../../utils");
+const ErrorText_1 = require("../ErrorText");
+const FormGroup_1 = require("../FormGroup");
+const HintText_1 = require("../HintText");
+const LabelText_1 = require("../LabelText");
+const Stack_1 = require("../Stack");
+const CheckboxField = (_a) => {
+    var { label, hint, error, children, optional = false } = _a, rest = __rest(_a, ["label", "hint", "error", "children", "optional"]);
     const hasError = !!error;
-    const validChildren = getValidChildren(children);
-    return (_jsx(FormGroup, { ...rest, error: hasError, children: _jsxs(Stack, { spaceBetween: 1, children: [_jsxs(View, { children: [_jsxs(LabelText, { children: [label, optional ? ' (optional)' : null] }), hint ? _jsx(HintText, { children: hint }) : null, error ? _jsx(ErrorText, { children: error }) : null] }), _jsx(View, { children: Children.map(validChildren, (child) => cloneElement(child, {
+    const validChildren = (0, utils_1.getValidChildren)(children);
+    return ((0, jsx_runtime_1.jsx)(FormGroup_1.FormGroup, Object.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, { children: react_1.Children.map(validChildren, (child) => (0, react_1.cloneElement)(child, {
                         invalid: hasError ? true : child.props.invalid,
-                    })) })] }) }));
+                    })) })] }) })));
 };
-export { CheckboxField };
+exports.CheckboxField = CheckboxField;

package/dist/components/Checkbox/index.js

@@ -1,2 +1,7 @@
-export { Checkbox } from './Checkbox';
-export { CheckboxField } from './CheckboxField';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CheckboxField = exports.Checkbox = void 0;
+var Checkbox_1 = require("./Checkbox");
+Object.defineProperty(exports, "Checkbox", { enumerable: true, get: function () { return Checkbox_1.Checkbox; } });
+var CheckboxField_1 = require("./CheckboxField");
+Object.defineProperty(exports, "CheckboxField", { enumerable: true, get: function () { return CheckboxField_1.CheckboxField; } });

package/dist/components/CurrencyField/CurrencyField.js

@@ -1,6 +1,22 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { CurrencyInput } from '../CurrencyInput';
-import { Field } from '../Field';
-export const CurrencyField = ({ ref, ...props }) => {
-    return (_jsx(Field, { affixWidth: 40, ...props, children: _jsx(CurrencyInput, { ref: ref }) }));
+"use strict";
+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.CurrencyField = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const CurrencyInput_1 = require("../CurrencyInput");
+const Field_1 = require("../Field");
+const CurrencyField = (_a) => {
+    var { ref } = _a, props = __rest(_a, ["ref"]);
+    return ((0, jsx_runtime_1.jsx)(Field_1.Field, Object.assign({ affixWidth: 40 }, props, { children: (0, jsx_runtime_1.jsx)(CurrencyInput_1.CurrencyInput, { ref: ref }) })));
+};
+exports.CurrencyField = CurrencyField;

package/dist/components/CurrencyField/index.js

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

package/dist/components/CurrencyInput/CurrencyInput.js

@@ -1,11 +1,26 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createRef } from 'react';
-import { mergeRefs } from '../../utils';
-import { NumberInput } from '../NumberInput';
-const CurrencyInput = ({ currency = 'GBP', invalid, accessibilityLabel = '', ref, ...rest }) => {
-    const inputRef = createRef();
+"use strict";
+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.CurrencyInput = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const utils_1 = require("../../utils");
+const NumberInput_1 = require("../NumberInput");
+const CurrencyInput = (_a) => {
+    var { currency = 'GBP', invalid, accessibilityLabel = '', ref } = _a, rest = __rest(_a, ["currency", "invalid", "accessibilityLabel", "ref"]);
+    const inputRef = (0, react_1.createRef)();
     const updatedAccessibilityLabel = `${accessibilityLabel} ${currency === 'GBP' ? 'pounds' : currency === 'EUR' ? 'euro' : 'dollar'}`.trim();
     const iconName = currency === 'GBP' ? 'pound' : currency === 'EUR' ? 'euro' : 'dollar';
-    return (_jsx(NumberInput, { accessibilityLabel: updatedAccessibilityLabel, invalid: invalid, iconLeft: iconName, ref: mergeRefs(ref, inputRef), ...rest }));
+    return ((0, jsx_runtime_1.jsx)(NumberInput_1.NumberInput, Object.assign({ accessibilityLabel: updatedAccessibilityLabel, invalid: invalid, iconLeft: iconName, ref: (0, utils_1.mergeRefs)(ref, inputRef) }, rest)));
 };
-export { CurrencyInput };
+exports.CurrencyInput = CurrencyInput;

package/dist/components/CurrencyInput/index.js

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

package/dist/components/DataTable/DataTable.js

@@ -1,19 +1,35 @@
-import { createElement as _createElement } from "react";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { isElement as isReactElement } from 'react-is';
-import { ScrollView } from 'react-native';
-import { useBreakpoint } from '../../hooks';
-import { getText } from '../../utils';
-import { TableRow } from './TableRow';
-import { StyledTableContainer, TableBody, TableCaption, TableCaptionText, TableHeader, TableHeaderText, TableRowHeading, } from './styles';
-export const DataTable = ({ items, columnHeadings, caption, rowHeadings, columnWidths, striped = true, ref, ...rest }) => {
-    const breakpoints = useBreakpoint();
+"use strict";
+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.DataTable = void 0;
+const react_1 = require("react");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_is_1 = require("react-is");
+const react_native_1 = require("react-native");
+const hooks_1 = require("../../hooks");
+const utils_1 = require("../../utils");
+const TableRow_1 = require("./TableRow");
+const styles_1 = require("./styles");
+const DataTable = (_a) => {
+    var { items, columnHeadings, caption, rowHeadings, columnWidths, striped = true, ref } = _a, rest = __rest(_a, ["items", "columnHeadings", "caption", "rowHeadings", "columnWidths", "striped", "ref"]);
+    const breakpoints = (0, hooks_1.useBreakpoint)();
     const columnLabel = columnHeadings
         ? ` ${columnHeadings.length} columns,`
         : '';
-    const accessibilityLabelText = isReactElement(caption)
-        ? getText(caption)
+    const accessibilityLabelText = (0, react_is_1.isElement)(caption)
+        ? (0, utils_1.getText)(caption)
         : caption;
     const accessibilityLabel = `data table,${columnLabel} ${items.length} rows, ${accessibilityLabelText}`;
-    return (_jsx(ScrollView, { horizontal: true, alwaysBounceHorizontal: false, contentContainerStyle: { flexGrow: 1 }, children: _jsxs(StyledTableContainer, { ...rest, ref: ref, children: [caption ? (_jsx(TableCaption, { ...breakpoints, children: isReactElement(caption) ? (caption) : (_jsx(TableCaptionText, { ...breakpoints, accessibilityLabel: accessibilityLabel, children: caption })) })) : null, columnHeadings ? (_jsx(TableRowHeading, { children: columnHeadings.map((columnHeading, index) => (_createElement(TableHeader, { ...breakpoints, key: index, cellWidth: columnWidths[index] }, isReactElement(columnHeading) ? (columnHeading) : (_jsx(TableHeaderText, { ...breakpoints, children: columnHeading }))))) })) : null, _jsx(TableBody, { children: items.map((rowData, index) => (_jsx(TableRow, { data: rowData, index: index, rowHeadings: rowHeadings, columnWidths: columnWidths, striped: striped }, index))) })] }) }));
+    return ((0, jsx_runtime_1.jsx)(react_native_1.ScrollView, { horizontal: true, alwaysBounceHorizontal: false, contentContainerStyle: { flexGrow: 1 }, children: (0, jsx_runtime_1.jsxs)(styles_1.StyledTableContainer, Object.assign({}, rest, { ref: ref, children: [caption ? ((0, jsx_runtime_1.jsx)(styles_1.TableCaption, Object.assign({}, breakpoints, { children: (0, react_is_1.isElement)(caption) ? (caption) : ((0, jsx_runtime_1.jsx)(styles_1.TableCaptionText, Object.assign({}, breakpoints, { accessibilityLabel: accessibilityLabel, children: caption }))) }))) : null, columnHeadings ? ((0, jsx_runtime_1.jsx)(styles_1.TableRowHeading, { children: columnHeadings.map((columnHeading, index) => ((0, react_1.createElement)(styles_1.TableHeader, Object.assign({}, breakpoints, { key: index, cellWidth: columnWidths[index] }), (0, react_is_1.isElement)(columnHeading) ? (columnHeading) : ((0, jsx_runtime_1.jsx)(styles_1.TableHeaderText, Object.assign({}, breakpoints, { children: columnHeading })))))) })) : null, (0, jsx_runtime_1.jsx)(styles_1.TableBody, { children: items.map((rowData, index) => ((0, jsx_runtime_1.jsx)(TableRow_1.TableRow, { data: rowData, index: index, rowHeadings: rowHeadings, columnWidths: columnWidths, striped: striped }, index))) })] })) }));
 };
+exports.DataTable = DataTable;

package/dist/components/DataTable/TableRow.js

@@ -1,21 +1,25 @@
-import { createElement as _createElement } from "react";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { isElement as isReactElement } from 'react-is';
-import { Dimensions } from 'react-native';
-import { useBreakpoint } from '../../hooks';
-import { CellText, RowHeading, SeparatorRowText, StyledSeparatorRow, TableRow as StyledTableRow, TableCell, TableHeaderText, } from './styles';
-export const TableRow = ({ data, index, striped, rowHeadings, columnWidths, }) => {
-    const breakpoints = useBreakpoint();
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TableRow = void 0;
+const react_1 = require("react");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_is_1 = require("react-is");
+const react_native_1 = require("react-native");
+const hooks_1 = require("../../hooks");
+const styles_1 = require("./styles");
+const TableRow = ({ data, index, striped, rowHeadings, columnWidths, }) => {
+    const breakpoints = (0, hooks_1.useBreakpoint)();
     const cells = data.map((cellData, i) => {
         if (typeof cellData === 'object' &&
-            cellData?.hasOwnProperty('isSeparator') &&
-            cellData?.hasOwnProperty('content')) {
-            return (_jsx(StyledSeparatorRow, { testID: "separatorRow", width: Dimensions.get('window').width, children: _jsx(SeparatorRowText, { ...breakpoints, children: cellData?.content }) }, i));
+            (cellData === null || cellData === void 0 ? void 0 : cellData.hasOwnProperty('isSeparator')) &&
+            (cellData === null || cellData === void 0 ? void 0 : cellData.hasOwnProperty('content'))) {
+            return ((0, jsx_runtime_1.jsx)(styles_1.StyledSeparatorRow, { testID: "separatorRow", width: react_native_1.Dimensions.get('window').width, children: (0, jsx_runtime_1.jsx)(styles_1.SeparatorRowText, Object.assign({}, breakpoints, { children: cellData === null || cellData === void 0 ? void 0 : cellData.content })) }, i));
         }
         if (rowHeadings && i === 0) {
-            return (_createElement(RowHeading, { ...breakpoints, key: i, testID: "rowHeader", cellWidth: columnWidths[i] }, isReactElement(cellData) ? (cellData) : (_jsx(TableHeaderText, { ...breakpoints, children: cellData }))));
+            return ((0, react_1.createElement)(styles_1.RowHeading, Object.assign({}, breakpoints, { key: i, testID: "rowHeader", cellWidth: columnWidths[i] }), (0, react_is_1.isElement)(cellData) ? (cellData) : ((0, jsx_runtime_1.jsx)(styles_1.TableHeaderText, Object.assign({}, breakpoints, { children: cellData })))));
         }
-        return (_createElement(TableCell, { ...breakpoints, key: i, testID: "cell", cellWidth: columnWidths[i] }, isReactElement(cellData) ? (cellData) : (_jsx(CellText, { ...breakpoints, children: cellData }))));
+        return ((0, react_1.createElement)(styles_1.TableCell, Object.assign({}, breakpoints, { key: i, testID: "cell", cellWidth: columnWidths[i] }), (0, react_is_1.isElement)(cellData) ? (cellData) : ((0, jsx_runtime_1.jsx)(styles_1.CellText, Object.assign({}, breakpoints, { children: cellData })))));
     });
-    return (_jsx(StyledTableRow, { stripe: striped && index % 2 === 0, children: cells }));
+    return ((0, jsx_runtime_1.jsx)(styles_1.TableRow, { stripe: striped && index % 2 === 0, children: cells }));
 };
+exports.TableRow = TableRow;

package/dist/components/DataTable/index.js

@@ -1,3 +1,21 @@
-export { DataTable } from './DataTable';
-export * from './styles';
-export * from './types';
+"use strict";
+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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataTable = void 0;
+var DataTable_1 = require("./DataTable");
+Object.defineProperty(exports, "DataTable", { enumerable: true, get: function () { return DataTable_1.DataTable; } });
+__exportStar(require("./styles"), exports);
+__exportStar(require("./types"), exports);