@ovotech/element-native 4.5.0 → 5.0.0-canary-bcb1788-338

package/dist/components/Display2/Display2.js

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { pxToNumber, numToPx } from '@ovotech/element-core';
-import { useBreakpoint } from '../../hooks';
-import styled, { css } from '../../styled.native';
-const calculateLetterSpacing = (fontSize, letterSpacing) => {
-    return numToPx(pxToNumber(fontSize) * letterSpacing);
-};
-const StyledDisplay2 = styled.Text(({ theme: { core, semantic, component }, smallAndUp, inverted }) => {
-    const fontSize = component.display2.fontSize[smallAndUp ? 'large' : 'small'];
-    return css `
-      font-family: ${component.display2.fontFamily};
-      font-size: ${numToPx(fontSize)};
-      line-height: ${numToPx(component.display2.lineHeight[smallAndUp ? 'large' : 'small'])};
-      letter-spacing: ${calculateLetterSpacing(String(fontSize), core.letterSpacing.extraCompressed)};
-      color: ${inverted
-        ? semantic.inverted.message.link
-        : semantic.message.branded};
-    `;
-});
-export const Display2 = ({ accessibilityRole = 'header', ...rest }) => {
-    const breakpoints = useBreakpoint();
-    return (_jsx(StyledDisplay2, { accessible: true, accessibilityRole: accessibilityRole, ...breakpoints, ...rest }));
-};

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

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

package/dist/components/Display2/index.js

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

package/dist/components/Display3/Display3.d.ts

@@ -1,5 +0,0 @@
-import { PropsWithChildren } from 'react';
-import { TextProps } from 'react-native';
-export declare const Display3: ({ accessibilityRole, ...rest }: PropsWithChildren<TextProps & {
-    inverted?: boolean;
-}>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Display3/Display3.js

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { pxToNumber, numToPx } from '@ovotech/element-core';
-import { useBreakpoint } from '../../hooks';
-import styled, { css } from '../../styled.native';
-const calculateLetterSpacing = (fontSize, letterSpacing) => {
-    return numToPx(pxToNumber(fontSize) * letterSpacing);
-};
-const StyledDisplay3 = styled.Text(({ theme: { core, semantic, component }, smallAndUp, inverted }) => {
-    const fontSize = component.display3.fontSize[smallAndUp ? 'large' : 'small'];
-    return css `
-      font-family: ${component.display3.fontFamily};
-      font-size: ${numToPx(fontSize)};
-      line-height: ${numToPx(component.display3.lineHeight[smallAndUp ? 'large' : 'small'])};
-      letter-spacing: ${calculateLetterSpacing(String(fontSize), core.letterSpacing.extraCompressed)};
-      color: ${inverted
-        ? semantic.inverted.message.link
-        : semantic.message.branded};
-    `;
-});
-export const Display3 = ({ accessibilityRole = 'header', ...rest }) => {
-    const breakpoints = useBreakpoint();
-    return (_jsx(StyledDisplay3, { accessible: true, accessibilityRole: accessibilityRole, ...breakpoints, ...rest }));
-};

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

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

package/dist/components/Display3/index.js

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

package/dist/components/ErrorSummaryNotification/ErrorSummaryNotification.d.ts

@@ -1,18 +0,0 @@
-import { ReactNode, RefObject } from 'react';
-import { ScrollView } from 'react-native';
-export type ErrorSummaryList = Array<{
-    id: string;
-    message: ReactNode;
-}>;
-type Props = {
-    title: string;
-    noMargin?: boolean;
-    errors: ErrorSummaryList;
-    scrollViewRef: RefObject<ScrollView | null>;
-    scrollPos?: {
-        x: number;
-        y: number;
-    };
-};
-declare const ErrorSummaryNotification: ({ errors, scrollViewRef, scrollPos, ...rest }: Props) => import("react/jsx-runtime").JSX.Element;
-export { ErrorSummaryNotification };

package/dist/components/ErrorSummaryNotification/ErrorSummaryNotification.js

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createRef, useEffect } from 'react';
-import { findNodeHandle, AccessibilityInfo, } from 'react-native';
-import { Ul, Li } from '../List';
-import { ErrorNotification } from '../Notification';
-import { P } from '../P';
-const ErrorSummaryNotification = ({ errors, scrollViewRef, scrollPos = { x: 0, y: 0 }, ...rest }) => {
-    const ref = createRef();
-    useEffect(() => {
-        if (errors.length && scrollViewRef.current && ref.current) {
-            scrollViewRef.current.scrollTo(scrollPos);
-            // Timeout ensures element receives focus after current action.
-            setTimeout(() => {
-                const node = findNodeHandle(ref.current);
-                node && AccessibilityInfo.setAccessibilityFocus(node);
-            }, 200);
-        }
-        // This means that errors needs to have referential integrity otherwise the notification
-        // will be focused all the time.
-    }, [errors, scrollViewRef.current, ref.current]);
-    return (_jsx(ErrorNotification, { ref: ref, ...rest, children: errors.length === 0 ? null : (_jsx(Ul, { children: errors.map(({ message, id: fieldId }) => (_jsx(Li, { children: _jsx(P, { children: message }) }, fieldId))) })) }));
-};
-export { ErrorSummaryNotification };

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

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

package/dist/components/ErrorSummaryNotification/index.js

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

package/dist/components/FilterSelect/FilterSelect.d.ts

@@ -1,17 +0,0 @@
-type Option = {
-    label: string;
-    value: string;
-    collapsedLabel?: string;
-};
-export type FilterSelect = {
-    defaultSelected?: Option;
-    options: Array<Option>;
-    onSelected?(value: Option): void;
-    testID?: string;
-    rightText?: string;
-    leftText?: string;
-    dropdownDirection?: 'left' | 'right';
-    accessibilityHint?: string;
-};
-export declare const FilterSelect: ({ options, defaultSelected, onSelected, testID, rightText, leftText, dropdownDirection, accessibilityHint, }: FilterSelect) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/FilterSelect/FilterSelect.js

@@ -1,67 +0,0 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-import { numToPx } from '@ovotech/element-core';
-import { Fragment, useRef, useState } from 'react';
-import { Dimensions, Modal, ScrollView, TouchableWithoutFeedback, View, } from 'react-native';
-import styled, { css, useTheme } from '../../styled.native';
-import { Divider } from '../Divider';
-import { Icon } from '../Icon';
-import { Margin } from '../Margin';
-import { P } from '../P';
-import { Strong } from '../Strong';
-const SelectInput = styled.TouchableOpacity(({ theme: { core } }) => {
-    return css `
-    flex-direction: row;
-    align-items: center;
-    background-color: ${core.color.brand.white};
-    border-radius: ${numToPx(core.radius.max)};
-    padding-left: ${numToPx(core.space[2])};
-    padding-right: ${numToPx(core.space[1])};
-  `;
-});
-const DropdownWrapper = styled.View(({ theme: { core } }) => css `
-    width: 100%;
-    height: 100%;
-
-    /* 40 is an opacity for hex https://gist.github.com/lopspower/03fb1cc0ac9f32ef38f4 */
-    background-color: ${core.color.neutral.darkest}40;
-  `);
-const DropdownContainer = styled.View(({ theme: { core } }) => css `
-    flex: 1;
-    min-width: 25%;
-    max-height: 100%;
-    border-radius: ${numToPx(core.radius.large)};
-    background-color: ${core.color.brand.white};
-    position: absolute;
-  `);
-const SelectOption = styled.TouchableOpacity(({ theme: { core } }) => css `
-    flex-direction: row;
-    align-items: center;
-    padding: 0 ${numToPx(core.space[2])};
-  `);
-export const FilterSelect = ({ options = [], defaultSelected = { label: '', value: 'default' }, onSelected = () => null, testID = 'select', rightText, leftText, dropdownDirection = 'right', accessibilityHint, }) => {
-    const theme = useTheme();
-    const selectRef = useRef(null);
-    const [isOpen, setOpen] = useState(false);
-    const [selected, setSelected] = useState(defaultSelected);
-    const [measure, setMeasure] = useState(null);
-    const handleOptionPress = (val) => {
-        onSelected(val);
-        setOpen(false);
-        setSelected(val);
-    };
-    return (_jsxs(View, { style: { flexDirection: 'row' }, children: [leftText ? _jsxs(P, { children: [leftText, " "] }) : null, _jsxs(SelectInput, { ref: selectRef, testID: testID, onPress: () => setOpen(!isOpen), onLayout: () => {
-                    selectRef.current?.measureInWindow((x, y, width) => {
-                        setMeasure({
-                            top: y - theme.core.space[3],
-                            left: x,
-                            right: Dimensions.get('window').width - (x + width),
-                        });
-                    });
-                }, accessible: true, accessibilityRole: "combobox", accessibilityHint: accessibilityHint, children: [_jsx(P, { children: _jsx(Strong, { children: selected.value === 'default'
-                                ? ''
-                                : selected.collapsedLabel ?? selected.label }) }), _jsx(Icon, { name: "caret-arrow-down", size: 14, style: { marginLeft: 2 } })] }, String(isOpen)), rightText ? _jsxs(P, { children: [" ", rightText] }) : null, _jsx(Modal, { transparent: true, visible: isOpen, animationType: "fade", onRequestClose: () => setOpen(false), children: _jsx(TouchableWithoutFeedback, { onPress: () => setOpen(false), children: _jsx(DropdownWrapper, { children: _jsx(DropdownContainer, { style: {
-                                top: measure?.top,
-                                left: dropdownDirection === 'right' ? measure?.left : undefined,
-                                right: dropdownDirection === 'left' ? measure?.right : undefined,
-                            }, children: _jsx(ScrollView, { nestedScrollEnabled: true, children: options.map((option, i) => (_jsxs(Fragment, { children: [_jsx(SelectOption, { accessible: true, accessibilityRole: "button", onPress: () => handleOptionPress(option), children: _jsx(Margin, { vertical: 3, children: _jsx(P, { children: _jsx(Strong, { children: option.label }) }) }) }), i === options.length - 1 ? null : (_jsx(Divider, { type: "differentiated" }))] }, option.label))) }) }) }) }) })] }));
-};

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

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

package/dist/components/FilterSelect/index.js

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

package/dist/components/Heading1/Heading1.d.ts

@@ -1,5 +0,0 @@
-import { PropsWithChildren } from 'react';
-import { TextProps } from 'react-native';
-export declare const Heading1: ({ accessibilityRole, ...rest }: PropsWithChildren<TextProps & {
-    inverted?: boolean;
-}>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Heading1/Heading1.js

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { pxToNumber, numToPx } from '@ovotech/element-core';
-import { useBreakpoint } from '../../hooks';
-import styled, { css } from '../../styled.native';
-const calculateLetterSpacing = (fontSize, letterSpacing) => {
-    return numToPx(pxToNumber(fontSize) * letterSpacing);
-};
-const StyledHeading1 = styled.Text(({ theme: { core, semantic, component }, smallAndUp, inverted }) => {
-    const fontSize = component.heading1.fontSize[smallAndUp ? 'large' : 'small'];
-    return css `
-      font-family: ${component.heading1.fontFamily};
-      font-size: ${numToPx(fontSize)};
-      line-height: ${numToPx(component.heading1.lineHeight[smallAndUp ? 'large' : 'small'])};
-      letter-spacing: ${calculateLetterSpacing(String(fontSize), core.letterSpacing.extraCompressed)};
-      color: ${inverted
-        ? semantic.inverted.message.link
-        : semantic.message.branded};
-    `;
-});
-export const Heading1 = ({ accessibilityRole = 'header', ...rest }) => {
-    const breakpoints = useBreakpoint();
-    return (_jsx(StyledHeading1, { accessible: true, accessibilityRole: accessibilityRole, ...breakpoints, ...rest }));
-};

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

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

package/dist/components/Heading1/index.js

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

package/dist/components/Heading2/Heading2.d.ts

@@ -1,5 +0,0 @@
-import { PropsWithChildren } from 'react';
-import { TextProps } from 'react-native';
-export declare const Heading2: ({ accessibilityRole, ...rest }: PropsWithChildren<TextProps & {
-    inverted?: boolean;
-}>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Heading2/Heading2.js

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { pxToNumber, numToPx } from '@ovotech/element-core';
-import { useBreakpoint } from '../../hooks';
-import styled, { css } from '../../styled.native';
-const calculateLetterSpacing = (fontSize, letterSpacing) => {
-    return numToPx(pxToNumber(fontSize) * letterSpacing);
-};
-const StyledHeading2 = styled.Text(({ theme: { core, semantic, component }, smallAndUp, inverted }) => {
-    const fontSize = component.heading2.fontSize[smallAndUp ? 'large' : 'small'];
-    return css `
-      font-family: ${component.heading2.fontFamily};
-      font-size: ${numToPx(fontSize)};
-      line-height: ${numToPx(component.heading2.lineHeight[smallAndUp ? 'large' : 'small'])};
-      letter-spacing: ${calculateLetterSpacing(String(fontSize), core.letterSpacing.extraCompressed)};
-      color: ${inverted
-        ? semantic.inverted.message.link
-        : semantic.message.branded};
-    `;
-});
-export const Heading2 = ({ accessibilityRole = 'header', ...rest }) => {
-    const breakpoints = useBreakpoint();
-    return (_jsx(StyledHeading2, { accessible: true, accessibilityRole: accessibilityRole, ...breakpoints, ...rest }));
-};

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

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

package/dist/components/Heading2/index.js

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

package/dist/components/Heading3/Heading3.d.ts

@@ -1,5 +0,0 @@
-import { PropsWithChildren } from 'react';
-import { TextProps } from 'react-native';
-export declare const Heading3: ({ accessibilityRole, ...rest }: PropsWithChildren<TextProps & {
-    inverted?: boolean;
-}>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Heading3/Heading3.js

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { pxToNumber, numToPx } from '@ovotech/element-core';
-import { useBreakpoint } from '../../hooks';
-import styled, { css } from '../../styled.native';
-const calculateLetterSpacing = (fontSize, letterSpacing) => {
-    return numToPx(pxToNumber(fontSize) * letterSpacing);
-};
-const StyledHeading3 = styled.Text(({ theme: { core, semantic, component }, smallAndUp, inverted }) => {
-    const fontSize = component.heading3.fontSize[smallAndUp ? 'large' : 'small'];
-    return css `
-      font-family: ${component.heading3.fontFamily};
-      font-size: ${numToPx(fontSize)};
-      line-height: ${numToPx(component.heading3.lineHeight[smallAndUp ? 'large' : 'small'])};
-      letter-spacing: ${calculateLetterSpacing(String(fontSize), core.letterSpacing.compressed)};
-      color: ${inverted
-        ? semantic.inverted.message.link
-        : semantic.message.branded};
-    `;
-});
-export const Heading3 = ({ accessibilityRole = 'header', ...rest }) => {
-    const breakpoints = useBreakpoint();
-    return (_jsx(StyledHeading3, { accessible: true, accessibilityRole: accessibilityRole, ...breakpoints, ...rest }));
-};

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

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

package/dist/components/Heading3/index.js

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

package/dist/components/Heading4/Heading4.d.ts

@@ -1,5 +0,0 @@
-import { PropsWithChildren } from 'react';
-import { TextProps } from 'react-native';
-export declare const Heading4: ({ accessibilityRole, ...rest }: PropsWithChildren<TextProps & {
-    inverted?: boolean;
-}>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Heading4/Heading4.js

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { pxToNumber, numToPx } from '@ovotech/element-core';
-import { useBreakpoint } from '../../hooks';
-import styled, { css } from '../../styled.native';
-const calculateLetterSpacing = (fontSize, letterSpacing) => {
-    return numToPx(pxToNumber(fontSize) * letterSpacing);
-};
-const StyledHeading4 = styled.Text(({ theme: { core, semantic, component }, smallAndUp, inverted }) => {
-    const fontSize = component.heading4.fontSize[smallAndUp ? 'large' : 'small'];
-    return css `
-      font-family: ${component.heading4.fontFamily};
-      font-size: ${numToPx(fontSize)};
-      line-height: ${numToPx(component.heading4.lineHeight[smallAndUp ? 'large' : 'small'])};
-      letter-spacing: ${calculateLetterSpacing(String(fontSize), core.letterSpacing.compressed)};
-      color: ${inverted
-        ? semantic.inverted.message.link
-        : semantic.message.branded};
-    `;
-});
-export const Heading4 = ({ accessibilityRole = 'header', ...rest }) => {
-    const breakpoints = useBreakpoint();
-    return (_jsx(StyledHeading4, { accessible: true, accessibilityRole: accessibilityRole, ...breakpoints, ...rest }));
-};

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

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

package/dist/components/Heading4/index.js

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

package/dist/components/Label/Label.d.ts

@@ -1,8 +0,0 @@
-import { PropsWithChildren, Ref } from 'react';
-import { TextProps } from 'react-native';
-type LabelProps = PropsWithChildren<TextProps & {
-    inverted?: boolean;
-    ref?: Ref<Text>;
-}>;
-export declare const Label: ({ ref, ...props }: LabelProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/Label/Label.js

@@ -1,10 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { numToPx } from '@ovotech/element-core';
-import styled, { css } from '../../styled.native';
-const StyledLabel = styled.Text(({ theme: { semantic, component }, smallAndUp, inverted }) => css `
-    font-family: ${component.label.fontFamily};
-    font-size: ${numToPx(component.label.fontSize[smallAndUp ? 'large' : 'small'])};
-    line-height: ${numToPx(component.label.lineHeight[smallAndUp ? 'large' : 'small'])};
-    color: ${inverted ? semantic.inverted.message.base : semantic.message.base};
-  `);
-export const Label = ({ ref, ...props }) => (_jsx(StyledLabel, { ...props, ref: ref }));

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

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

package/dist/components/Label/index.js

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

package/dist/components/Lead/Lead.d.ts

@@ -1,8 +0,0 @@
-import { PropsWithChildren, Ref } from 'react';
-import { TextProps } from 'react-native';
-type LeadProps = PropsWithChildren<TextProps & {
-    inverted?: boolean;
-    ref?: Ref<Text>;
-}>;
-export declare const Lead: ({ ref, ...props }: LeadProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/Lead/Lead.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { numToPx } from '@ovotech/element-core';
-import styled, { css } from '../../styled.native';
-const StyledLead = styled.Text(({ theme: { semantic, component }, smallAndUp, inverted }) => css `
-    font-family: ${component.lead.fontFamily};
-    font-size: ${numToPx(component.lead.fontSize[smallAndUp ? 'large' : 'small'])};
-    line-height: ${numToPx(component.lead.lineHeight[smallAndUp ? 'large' : 'small'])};
-    color: ${inverted
-    ? semantic.inverted.message.link
-    : semantic.message.branded};
-  `);
-export const Lead = ({ ref, ...props }) => (_jsx(StyledLead, { ...props, ref: ref }));

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

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

package/dist/components/Lead/index.js

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

package/dist/components/NavHeader/IconButton.d.ts

@@ -1,15 +0,0 @@
-import { ComplexAnimationBuilder } from 'react-native-reanimated';
-import { IconNameExtended } from '../../providers';
-export type RightActionConfig = {
-    iconName?: IconNameExtended;
-    onActionPress?: () => void;
-    accessibilityLabel?: string;
-    accessibilityHint?: string;
-};
-type IconButtonProps = {
-    size: 'small' | 'large';
-    animation: ComplexAnimationBuilder;
-    rightActionConfig?: RightActionConfig;
-};
-export declare const IconButton: ({ size, animation, rightActionConfig, }: IconButtonProps) => import("react/jsx-runtime").JSX.Element | null;
-export {};

package/dist/components/NavHeader/IconButton.js

@@ -1,13 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Pressable } from 'react-native';
-import { useTheme } from '../../styled.native';
-import { Icon } from '../Icon';
-import { StyledIconButtonL, StyledIconButtonS } from './NavHeader.styles';
-export const IconButton = ({ size, animation, rightActionConfig, }) => {
-    const ButtonStyled = size === 'small' ? StyledIconButtonS : StyledIconButtonL;
-    const theme = useTheme();
-    if (!rightActionConfig || !rightActionConfig?.iconName) {
-        return null;
-    }
-    return (_jsx(Pressable, { hitSlop: theme.core.space[2], pressRetentionOffset: theme.core.space[2], onPress: rightActionConfig?.onActionPress, accessibilityRole: "button", accessibilityLabel: rightActionConfig?.accessibilityLabel, accessibilityHint: rightActionConfig?.accessibilityHint, children: ({ pressed }) => (_jsx(ButtonStyled, { entering: animation, "$pressed": pressed, children: _jsx(Icon, { name: rightActionConfig.iconName, size: size === 'small' ? 16 : 18, color: theme.semantic.inverted.message.base }) })) }));
-};

package/dist/components/SkeletonCTA/SkeletonCTA.d.ts

@@ -1,6 +0,0 @@
-import { ViewProps } from 'react-native';
-type Props = ViewProps & {
-    size?: string;
-};
-export declare const SkeletonCTA: ({ size, ...rest }: Props) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/SkeletonCTA/SkeletonCTA.js

@@ -1,11 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { numToPx } from '@ovotech/element-core';
-import styled from '../../styled.native';
-import { P } from '../P';
-import { SkeletonAnimation } from '../SkeletonAnimation';
-const StyledSkeletonCTA = styled.View(({ theme: { core }, size }) => `
-    background-color: ${core.color.neutral.light};
-    width: ${size};
-    height: ${numToPx(core.space[12])};
-  `);
-export const SkeletonCTA = ({ size = '250px', ...rest }) => (_jsx(SkeletonAnimation, { children: _jsx(StyledSkeletonCTA, { as: P, size: size, ...rest }) }));

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

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

package/dist/components/SkeletonCTA/index.js

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