@planningcenter/tapestry-react 2.10.0-rc.2 → 2.10.0-rc.4

package/dist/types/NumberField/NumberField.d.ts

@@ -0,0 +1,90 @@
+import React, { Component } from 'react';
+declare type Props = {
+    /**
+     * Render custom component or HTML element tag. (Defaults to a [InputField](/input.inputfield) component.). */
+    as?: any;
+    /**
+     * Add controls to increment/decrement the value
+     */
+    hasControls?: boolean;
+    /**
+     * An array of keys to ignore when pushed.
+     * ex: ["ArrowUp", "ArrowDown"].
+     */
+    ignoredKeys: string[];
+    /**
+     * Maximum number that can be entered.
+     */
+    max: number;
+    /**
+     * Minimum number that can be entered.
+     */
+    min: number;
+    /**
+     * Called when the input's onInput is called with a valid value
+     * or when the arrow keys are used to increment/decrement the value.
+     * Please note traditional onInput/onChange events are not supported
+     * since this component takes control of them.
+     */
+    onChange: (value: string) => null;
+    /**
+     * Maps to the input's `onBlur` prop.
+     */
+    onBlur?: React.FocusEventHandler<HTMLInputElement>;
+    onInput?: (event: React.FormEvent<HTMLInputElement>) => void;
+    onKeyDown?: Function;
+    /**
+     * The amount of 0s to pad the value with.
+     */
+    pad: number;
+    /**
+     * Forces the input text to stay fully selected while interacting with it.
+     */
+    highlightOnInteraction: boolean;
+    /**
+     * String to display when value is empty.
+     */
+    placeholder: string;
+    /**
+     * The amount to step up/down from the value when using the arrow keys
+     * defaults to `1`
+     */
+    step: number;
+    /**
+     * The value of the input.
+     */
+    value: number;
+    autoWidth: boolean;
+    moveFocusOnMax: boolean;
+};
+declare class NumberField extends Component<Props> {
+    static defaultProps: {
+        as: any;
+        hasControls: boolean;
+        ignoredKeys: any[];
+        min: number;
+        max: number;
+        step: number;
+        moveFocusOnMax: boolean;
+    };
+    firstTouch: boolean;
+    getParsedValues: (value: any) => {
+        value: number;
+        minValue: number;
+        maxValue: number;
+    };
+    clampValue: (valueToCheck: any) => number;
+    isValueValid: (valueToCheck: any) => boolean;
+    changeIfValid: (value: any) => void;
+    handleBlur: (event: any) => void;
+    stepValue: (baseValue: any, step: any) => void;
+    incrementValue: () => void;
+    decrementValue: () => void;
+    handleKeyDown: (event: any) => void;
+    handleInput: (event: any) => void;
+    getAutoWidthValue(value: any): any;
+    renderInput(restProps: any): React.CElement<any, React.Component<any, any, any>>;
+    renderInputWithControls(restProps: any): JSX.Element;
+    render(): JSX.Element;
+}
+export default NumberField;

package/dist/types/NumberField/NumberField.test.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom/extend-expect';

package/dist/types/Pagination/Pagination.d.ts

@@ -0,0 +1,35 @@
+export declare type PaginationProps = {
+    /**
+     * Change the color of the active page
+     */
+    activeColor?: string;
+    /**
+     * Accepts any valid [Button](/button) props.
+     */
+    activePageLinkProps?: object;
+    /**
+     * Current visible page number
+     */
+    currentPage: number;
+    /**
+     * Accepts any valid [Button](/button) props.
+     */
+    navButtonProps?: object;
+    /**
+     * Callback when new page is requested
+     */
+    onPageChange: (nextPage: number) => undefined;
+    /**
+     * Accepts any valid [Button](/button) props.
+     */
+    pageLinkProps?: object;
+    /**
+     * Total available pages
+     */
+    totalPages: number;
+    /**
+     * Amount of visible pages
+     */
+    visiblePages?: number;
+};
+export default function Pagination({ currentPage, onPageChange, visiblePages, totalPages, ...restProps }: PaginationProps): JSX.Element;

package/dist/types/Popover/Popover.d.ts

@@ -0,0 +1,115 @@
+import * as React from 'react';
+export declare type PopoverProps = {
+    /**
+     * Controls the default component or tag being rendered.
+     */
+    as?: any;
+    /**
+     * The element to attach the popover to. Clones the element's ref to calculate
+     * position relative to the optional `relativeTo` prop or the `renderTo` element.
+     */
+    anchorElement: React.ReactElement | ((anchorCallbackProps: any) => null);
+    /**
+     * Attempts to keep popover in view clipping edges if too large.
+     */
+    keepInView?: boolean;
+    /**
+     * Locks external scrollbars when open.
+     */
+    lockScrollWhileOpen?: boolean;
+    /**
+     * Matches anchor and popover widths.
+     */
+    matchWidths?: boolean | 'minimum';
+    /**
+     * Controls rendering of the popover.
+     */
+    open: boolean;
+    /**
+     * Controls the space between the popover and its anchor.
+     */
+    offset: number;
+    /**
+     * Called when the popover should close.
+     */
+    onRequestClose?: () => void;
+    /**
+     * Where to place the popover.
+     */
+    placement?: 'top-start' | 'top' | 'top-end' | 'right-start' | 'right' | 'right-end' | 'bottom-start' | 'bottom' | 'bottom-end' | 'left-start' | 'left' | 'left-end';
+    /**
+     * Where to place the popover relative to. Uses `renderTo` by default.
+     */
+    relativeTo?: any;
+    /**
+     * Where to render the popover into. Accepts an HTML element or selector.
+     * Uses the closest fixed parent or `document.body` by default. This will only
+     * be computed once on initial render.
+     */
+    renderTo?: HTMLElement | string;
+    /**
+     * Determines if the popover should flip or not when it overflows.
+     */
+    shouldFlip?: boolean;
+    /**
+     * Calls `as` `innerRef` to calculate popover's bounds.
+     */
+    innerRef?: any;
+} & React.HTMLAttributes<any>;
+export declare const Popover: React.ForwardRefExoticComponent<{
+    /**
+     * Controls the default component or tag being rendered.
+     */
+    as?: any;
+    /**
+     * The element to attach the popover to. Clones the element's ref to calculate
+     * position relative to the optional `relativeTo` prop or the `renderTo` element.
+     */
+    anchorElement: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any>) | (new (props: any) => React.Component<any, any, any>)> | ((anchorCallbackProps: any) => null);
+    /**
+     * Attempts to keep popover in view clipping edges if too large.
+     */
+    keepInView?: boolean;
+    /**
+     * Locks external scrollbars when open.
+     */
+    lockScrollWhileOpen?: boolean;
+    /**
+     * Matches anchor and popover widths.
+     */
+    matchWidths?: boolean | 'minimum';
+    /**
+     * Controls rendering of the popover.
+     */
+    open: boolean;
+    /**
+     * Controls the space between the popover and its anchor.
+     */
+    offset: number;
+    /**
+     * Called when the popover should close.
+     */
+    onRequestClose?: () => void;
+    /**
+     * Where to place the popover.
+     */
+    placement?: 'top-start' | 'top' | 'top-end' | 'right-start' | 'right' | 'right-end' | 'bottom-start' | 'bottom' | 'bottom-end' | 'left-start' | 'left' | 'left-end';
+    /**
+     * Where to place the popover relative to. Uses `renderTo` by default.
+     */
+    relativeTo?: any;
+    /**
+     * Where to render the popover into. Accepts an HTML element or selector.
+     * Uses the closest fixed parent or `document.body` by default. This will only
+     * be computed once on initial render.
+     */
+    renderTo?: HTMLElement | string;
+    /**
+     * Determines if the popover should flip or not when it overflows.
+     */
+    shouldFlip?: boolean;
+    /**
+     * Calls `as` `innerRef` to calculate popover's bounds.
+     */
+    innerRef?: any;
+} & React.HTMLAttributes<any> & React.RefAttributes<unknown>>;

package/dist/types/Popover/Popover.test.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom/extend-expect';

package/dist/types/Popover/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Popover';
+export { Popover as default } from './Popover';

package/dist/types/Popover/rewireTabOrder.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (node: any) => () => void;
+export default _default;

package/dist/types/Popover/utils.d.ts

@@ -0,0 +1,52 @@
+export declare function getModifiers({ matchWidths, offset, keepInView, shouldFlip }: {
+    matchWidths: any;
+    offset: any;
+    keepInView: any;
+    shouldFlip: any;
+}): (import("@popperjs/core").Modifier<"maxSize", {
+    placement: import("@popperjs/core").Placement;
+    boundary: import("@popperjs/core").Boundary;
+    rootBoundary: import("@popperjs/core").RootBoundary;
+    elementContext: import("@popperjs/core").Context;
+    altBoundary: boolean;
+    padding: import("@popperjs/core").Padding;
+}> | {
+    name: string;
+    enabled: boolean;
+    phase: string;
+    requires: string[];
+    fn({ state }: {
+        state: any;
+    }): void;
+    effect?: undefined;
+    options?: undefined;
+} | {
+    name: string;
+    enabled: boolean;
+    phase: string;
+    requires: string[];
+    fn: () => void;
+    effect: ({ state }: {
+        state: any;
+    }) => void;
+    options?: undefined;
+} | {
+    name: string;
+    options: {
+        offset: any[];
+    };
+    enabled?: undefined;
+    phase?: undefined;
+    requires?: undefined;
+    fn?: undefined;
+    effect?: undefined;
+} | {
+    name: string;
+    enabled: any;
+    phase?: undefined;
+    requires?: undefined;
+    fn?: undefined;
+    effect?: undefined;
+    options?: undefined;
+})[];
+export declare function getFixedParent(node: any): any;

package/dist/types/Portal/Portal.d.ts

@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { Theme } from '../index';
+export declare type PortalProps = {
+    children: any;
+    /** Styles to apply to the portal root element. */
+    style?: React.CSSProperties;
+    /** Where the portal is rendered into. */
+    renderTo?: HTMLElement | string;
+    /** The HTML element to create. Defaults to `div`. */
+    renderTag?: string;
+    /** Callback when Portal is updated. */
+    onUpdate?: () => void;
+    /** Returns the rendered node similar to refs. */
+    getPortalNode?: (HTMLElement: any) => void;
+};
+/** Accepts any additional HTML attributes. */
+declare class Portal extends React.Component<PortalProps> {
+    static defaultProps: {
+        renderTag: string;
+        renderTo: any;
+    };
+    static contextType: import("react").Context<object>;
+    context: React.ContextType<React.Context<Theme>>;
+    _portalNode: HTMLElement;
+    _needsUpdate: boolean;
+    _updated: boolean;
+    componentDidMount(): void;
+    componentDidUpdate(): void;
+    componentWillUnmount(): void;
+    _getSecondChild(): string | number | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any>) | (new (props: any) => React.Component<any, any, any>)> | React.ReactFragment | React.ReactPortal;
+    _getRenderToNode(): Element;
+    _setupPortal(): void;
+    _updatePortal(): void;
+    _renderPortal(component: any): import("react").ReactPortal;
+    _destroyPortal(): void;
+    render(): number | React.ReactFragment | JSX.Element;
+}
+export { Portal };

package/dist/types/Portal/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Portal';
+export { Portal as default } from './Portal';

package/dist/types/Progress/Progress.d.ts

@@ -0,0 +1,12 @@
+export declare type Props = {
+    /**
+     * The current value of the progress bar.
+     */
+    value?: number;
+    /**
+     * Active color of the progress bar.
+     */
+    activeColor?: string;
+};
+declare const Progress: ({ value, ...restProps }: Props) => JSX.Element;
+export default Progress;

package/dist/types/Radio/Radio.d.ts

@@ -0,0 +1,45 @@
+import React from 'react';
+export declare type RadioProps = {
+    /**
+     * Disables the radio component.
+     */
+    disabled?: boolean;
+    /**
+     * Determines if the radio should use an internal label or not.
+     */
+    label?: string;
+    /**
+     * Connects input to its corresponding label's `htmlFor`.
+     */
+    id?: string | number;
+    /**
+     * Checks the radio.
+     */
+    checked?: boolean;
+    /**
+     * Maps to the internal input's `name` prop.
+     */
+    name?: string;
+    /**
+     * Maps to the internal input's `value` prop.
+     */
+    value?: any;
+    /**
+     * Determines the size of the radio based on a [scale](http://google.com).
+     */
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    /**
+     * Maps to the internal input's `onChange` prop.
+     */
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * Maps to the internal input's `onFocus` prop.
+     */
+    onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;
+    /**
+     * Maps to the internal input's `onBlur` prop.
+     */
+    onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
+};
+declare const Radio: ({ checked, disabled, id, label, name, onBlur, onChange, onFocus, size, value, ...restProps }: RadioProps) => JSX.Element;
+export default Radio;

package/dist/types/Scrim/Scrim.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+declare type ScrimProps = {
+    /** Gain access to the internal ref. */
+    ref?: any;
+    children?: any;
+};
+declare const Scrim: React.ForwardRefExoticComponent<Pick<ScrimProps, "children"> & React.RefAttributes<unknown>>;
+export { Scrim };

package/dist/types/Scrim/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Scrim';
+export { Scrim as default } from './Scrim';

package/dist/types/Select/Select.test.d.ts

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

package/dist/types/Spinner/Spinner.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import { StyleProps } from '../index';
+export declare type SpinnerProps = {
+    /**
+     * Uses position absolute and transforms to position in the center of a relative parent.
+     */
+    center?: boolean;
+    /**
+     * Primary color of spinner.
+     */
+    color?: string;
+    /**
+     * Size of spinner.
+     */
+    size?: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl' | number | string;
+    /**
+     * Thickness of spinner.
+     */
+    thickness?: number;
+    /**
+     * Secondary color of spinner.
+     */
+    trackColor?: string;
+} & StyleProps & React.HTMLAttributes<HTMLElement>;
+export declare function Spinner({ center, size, thickness, ...props }: SpinnerProps): JSX.Element;

package/dist/types/Spinner/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Spinner';
+export { Spinner as default } from './Spinner';

package/dist/types/StackView/StackView.d.ts

@@ -0,0 +1,97 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+import * as React from 'react';
+import { BoxProps } from '../Box';
+export declare type StackViewProps<E extends React.ElementType = React.ElementType> = {
+    /** Render custom component or HTML element tag. (Defaults to a `<div>` element). */
+    as?: E;
+    /** The axis along which children are laid out. */
+    axis?: 'horizontal' | 'vertical';
+    /** The alignment of children perpendicular to the stack view’s main axis. */
+    alignment?: 'start' | 'center' | 'end' | 'stretch' | 'baseline';
+    /** The content of the StackView. */
+    children?: React.ReactNode;
+    /** The distribution of children along the main axis. */
+    distribution?: 'start' | 'center' | 'end' | 'fill' | 'space-between' | 'space-evenly';
+    /**  If true, sets `display: inline-flex`, otherwise it defaults to `display: flex` */
+    inline?: boolean;
+    /** Gain access to the internal ref */
+    innerRef?: React.Ref<any>;
+    /** The amount of space or element that is inserted between each child. */
+    spacing?: number | string | React.ReactNode;
+    /** Describes styles at various points in time. [Read about variants](/variants). */
+    variants?: object;
+    /** Describes props at different breakpoints. [Read about mediaQueries](/responsive). */
+    mediaQueries?: object;
+} & BoxProps;
+export declare const StackView: {
+    <E extends React.ElementType<any> = "div">({ as, children, inline, innerRef, ...props }: {
+        /** Render custom component or HTML element tag. (Defaults to a `<div>` element). */
+        as?: E;
+        /** The axis along which children are laid out. */
+        axis?: 'horizontal' | 'vertical';
+        /** The alignment of children perpendicular to the stack view’s main axis. */
+        alignment?: 'start' | 'center' | 'end' | 'stretch' | 'baseline';
+        /** The content of the StackView. */
+        children?: React.ReactNode;
+        /** The distribution of children along the main axis. */
+        distribution?: 'start' | 'center' | 'end' | 'fill' | 'space-between' | 'space-evenly';
+        /**  If true, sets `display: inline-flex`, otherwise it defaults to `display: flex` */
+        inline?: boolean;
+        /** Gain access to the internal ref */
+        innerRef?: React.Ref<any>;
+        /** The amount of space or element that is inserted between each child. */
+        spacing?: number | string | React.ReactNode;
+        /** Describes styles at various points in time. [Read about variants](/variants). */
+        variants?: object;
+        /** Describes props at different breakpoints. [Read about mediaQueries](/responsive). */
+        mediaQueries?: object;
+    } & {
+        as?: React.ElementType<any>;
+        children?: React.ReactNode;
+        inline?: boolean;
+        innerRef?: React.Ref<any>;
+        mediaQueries?: object;
+        variants?: object;
+        visible?: boolean;
+    } & Pick<React.CSSProperties, "clipPath" | "filter" | "mask" | "alignContent" | "alignItems" | "alignSelf" | "alignmentBaseline" | "animation" | "animationDelay" | "animationDirection" | "animationDuration" | "animationFillMode" | "animationIterationCount" | "animationName" | "animationPlayState" | "animationTimingFunction" | "backfaceVisibility" | "background" | "backgroundAttachment" | "backgroundBlendMode" | "backgroundClip" | "backgroundImage" | "backgroundOrigin" | "backgroundPosition" | "backgroundPositionX" | "backgroundPositionY" | "backgroundRepeat" | "backgroundSize" | "baselineShift" | "border" | "borderBottom" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderCollapse" | "borderImage" | "borderImageOutset" | "borderImageRepeat" | "borderImageSlice" | "borderImageSource" | "borderImageWidth" | "borderLeft" | "borderLeftStyle" | "borderLeftWidth" | "borderRadius" | "borderRight" | "borderRightStyle" | "borderRightWidth" | "borderSpacing" | "borderStyle" | "borderTop" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "borderWidth" | "bottom" | "boxShadow" | "boxSizing" | "breakAfter" | "breakBefore" | "breakInside" | "clear" | "clip" | "clipRule" | "columnCount" | "columnFill" | "columnGap" | "columnRule" | "columnRuleColor" | "columnRuleStyle" | "columnRuleWidth" | "columnSpan" | "columnWidth" | "columns" | "contain" | "content" | "counterIncrement" | "counterReset" | "cursor" | "direction" | "display" | "fillOpacity" | "fillRule" | "flex" | "flexBasis" | "flexDirection" | "flexFlow" | "flexGrow" | "flexShrink" | "flexWrap" | "font" | "fontFamily" | "fontFeatureSettings" | "fontKerning" | "fontSize" | "fontStretch" | "fontStyle" | "fontVariant" | "fontVariantCaps" | "fontVariantLigatures" | "fontVariantNumeric" | "fontWeight" | "gap" | "gridArea" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridColumn" | "gridColumnEnd" | "gridColumnGap" | "gridColumnStart" | "gridGap" | "gridRow" | "gridRowEnd" | "gridRowGap" | "gridRowStart" | "gridTemplate" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "imageRendering" | "isolation" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lightingColor" | "lineHeight" | "listStyle" | "listStyleImage" | "listStylePosition" | "listStyleType" | "margin" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maskType" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "mixBlendMode" | "motion" | "objectFit" | "objectPosition" | "opacity" | "order" | "outline" | "outlineColor" | "outlineOffset" | "outlineStyle" | "outlineWidth" | "overflow" | "overflowWrap" | "overflowX" | "overflowY" | "padding" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "pageBreakAfter" | "pageBreakBefore" | "pageBreakInside" | "perspective" | "perspectiveOrigin" | "placeItems" | "placeSelf" | "pointerEvents" | "position" | "resize" | "right" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "tabSize" | "tableLayout" | "textAlign" | "textDecoration" | "textIndent" | "textOrientation" | "textOverflow" | "textRendering" | "textShadow" | "textTransform" | "top" | "touchAction" | "transform" | "transformOrigin" | "transformStyle" | "transition" | "transitionDelay" | "transitionDuration" | "transitionProperty" | "transitionTimingFunction" | "verticalAlign" | "visibility" | "userSelect" | "WebkitOverflowScrolling" | "writingMode" | "whiteSpace" | "width" | "willChange" | "wordBreak" | "wordSpacing" | "wordWrap" | "zIndex"> & Partial<Record<"outlineColor" | "backgroundColor" | "borderColor" | "borderBottomColor" | "borderLeftColor" | "borderRightColor" | "borderTopColor" | "color" | "fill" | "stroke", import("type-fest").LiteralUnion<"background" | "foreground" | "foregroundSecondary" | "foregroundTertiary" | "backgroundSecondary" | "backgroundTertiary" | "surface" | "surfaceSecondary" | "surfaceTertiary" | "separator" | "separatorSecondary" | "separatorTertiary" | "separatorHover" | "separatorFocus" | "separatorFocusSecondary" | "highlight" | "highlightSecondary" | "linkForeground" | "linkBackground" | "primary" | "primary-light" | "primary-lighter" | "primary-lightest" | "primary-dark" | "primary-darker" | "primary-darkest" | "warning" | "warning-light" | "warning-lighter" | "warning-lightest" | "warning-dark" | "warning-darker" | "warning-darkest" | "error" | "error-light" | "error-lighter" | "error-lightest" | "error-dark" | "error-darker" | "error-darkest" | "success" | "success-light" | "success-lighter" | "success-lightest" | "success-dark" | "success-darker" | "success-darkest" | "sunday" | "monday" | "tuesday" | "wednesday" | "thursday" | "friday" | "saturday" | "check-ins" | "giving" | "groups" | "music-stand" | "pco" | "people" | "planning-center" | "projector" | "registrations" | "calendar" | "services" | "red-0" | "red-1" | "red-2" | "red-3" | "red-4" | "red-5" | "red-6" | "red-7" | "red-8" | "red-9" | "blue-0" | "blue-1" | "blue-2" | "blue-3" | "blue-4" | "blue-5" | "blue-6" | "blue-7" | "blue-8" | "blue-9" | "green-0" | "green-1" | "green-2" | "green-3" | "green-4" | "green-5" | "green-6" | "green-7" | "green-8" | "green-9" | "yellow-0" | "yellow-1" | "yellow-2" | "yellow-3" | "yellow-4" | "yellow-5" | "yellow-6" | "yellow-7" | "yellow-8" | "yellow-9" | "light-0" | "light-1" | "light-2" | "light-3" | "light-4" | "light-5" | "light-6" | "light-7" | "light-8" | "light-9" | "dark-0" | "dark-1" | "dark-2" | "dark-3" | "dark-4" | "dark-5" | "dark-6" | "dark-7" | "dark-8" | "dark-9" | "grey-0" | "grey-1" | "grey-2" | "grey-3" | "grey-4" | "grey-5" | "grey-6" | "grey-7" | "grey-8" | "grey-9" | "transparent", string>>> & {
+        css?: any;
+        paddingHorizontal?: string | number;
+        paddingVertical?: string | number;
+        marginHorizontal?: string | number;
+        marginVertical?: string | number;
+        column?: import("csstype").Property.ColumnCount;
+        columnStart?: import("csstype").Property.ColumnCount;
+        columnEnd?: import("csstype").Property.ColumnCount;
+        row?: import("csstype").Property.ColumnCount;
+        rowStart?: import("csstype").Property.ColumnCount;
+        rowEnd?: import("csstype").Property.ColumnCount;
+        basis?: import("csstype").Property.Padding<string | number>;
+        grow?: import("csstype").Property.BorderImageSlice;
+        shrink?: import("csstype").Property.BorderImageSlice;
+        wrap?: string | boolean;
+        radius?: import("csstype").Property.Padding<string | number>;
+        radiusTop?: string | number;
+        radiusRight?: string | number;
+        radiusBottom?: string | number;
+        radiusLeft?: string | number;
+        strokeAlign?: "center" | "inside" | "outside";
+        strokeWeight?: number;
+        elevation?: number;
+        x?: string | number;
+        y?: string | number;
+        rotate?: number;
+        scale?: number;
+        uppercase?: boolean;
+    } & Pick<React.PropsWithoutRef<React.ComponentProps<E>>, Exclude<keyof React.PropsWithoutRef<React.ComponentProps<E>>, "clipPath" | "filter" | "mask" | "alignContent" | "alignItems" | "alignSelf" | "alignmentBaseline" | "animation" | "animationDelay" | "animationDirection" | "animationDuration" | "animationFillMode" | "animationIterationCount" | "animationName" | "animationPlayState" | "animationTimingFunction" | "backfaceVisibility" | "background" | "backgroundAttachment" | "backgroundBlendMode" | "backgroundClip" | "backgroundImage" | "backgroundOrigin" | "backgroundPosition" | "backgroundPositionX" | "backgroundPositionY" | "backgroundRepeat" | "backgroundSize" | "baselineShift" | "border" | "borderBottom" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderCollapse" | "borderImage" | "borderImageOutset" | "borderImageRepeat" | "borderImageSlice" | "borderImageSource" | "borderImageWidth" | "borderLeft" | "borderLeftStyle" | "borderLeftWidth" | "borderRadius" | "borderRight" | "borderRightStyle" | "borderRightWidth" | "borderSpacing" | "borderStyle" | "borderTop" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "borderWidth" | "bottom" | "boxShadow" | "boxSizing" | "breakAfter" | "breakBefore" | "breakInside" | "clear" | "clip" | "clipRule" | "columnCount" | "columnFill" | "columnGap" | "columnRule" | "columnRuleColor" | "columnRuleStyle" | "columnRuleWidth" | "columnSpan" | "columnWidth" | "columns" | "contain" | "content" | "counterIncrement" | "counterReset" | "cursor" | "direction" | "display" | "fillOpacity" | "fillRule" | "flex" | "flexBasis" | "flexDirection" | "flexFlow" | "flexGrow" | "flexShrink" | "flexWrap" | "font" | "fontFamily" | "fontFeatureSettings" | "fontKerning" | "fontSize" | "fontStretch" | "fontStyle" | "fontVariant" | "fontVariantCaps" | "fontVariantLigatures" | "fontVariantNumeric" | "fontWeight" | "gap" | "gridArea" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridColumn" | "gridColumnEnd" | "gridColumnGap" | "gridColumnStart" | "gridGap" | "gridRow" | "gridRowEnd" | "gridRowGap" | "gridRowStart" | "gridTemplate" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "imageRendering" | "isolation" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lightingColor" | "lineHeight" | "listStyle" | "listStyleImage" | "listStylePosition" | "listStyleType" | "margin" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maskType" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "mixBlendMode" | "motion" | "objectFit" | "objectPosition" | "opacity" | "order" | "outline" | "outlineColor" | "outlineOffset" | "outlineStyle" | "outlineWidth" | "overflow" | "overflowWrap" | "overflowX" | "overflowY" | "padding" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "pageBreakAfter" | "pageBreakBefore" | "pageBreakInside" | "perspective" | "perspectiveOrigin" | "placeItems" | "placeSelf" | "pointerEvents" | "position" | "resize" | "right" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "tabSize" | "tableLayout" | "textAlign" | "textDecoration" | "textIndent" | "textOrientation" | "textOverflow" | "textRendering" | "textShadow" | "textTransform" | "top" | "touchAction" | "transform" | "transformOrigin" | "transformStyle" | "transition" | "transitionDelay" | "transitionDuration" | "transitionProperty" | "transitionTimingFunction" | "verticalAlign" | "visibility" | "userSelect" | "WebkitOverflowScrolling" | "writingMode" | "whiteSpace" | "width" | "willChange" | "wordBreak" | "wordSpacing" | "wordWrap" | "zIndex" | "backgroundColor" | "borderColor" | "borderBottomColor" | "borderLeftColor" | "borderRightColor" | "borderTopColor" | "color" | "fill" | "stroke" | "as" | "children" | "inline" | "innerRef" | "mediaQueries" | "variants" | "visible" | "css" | "paddingHorizontal" | "paddingVertical" | "marginHorizontal" | "marginVertical" | "column" | "columnStart" | "columnEnd" | "row" | "rowStart" | "rowEnd" | "basis" | "grow" | "shrink" | "wrap" | "radius" | "radiusTop" | "radiusRight" | "radiusBottom" | "radiusLeft" | "strokeAlign" | "strokeWeight" | "elevation" | "x" | "y" | "rotate" | "scale" | "uppercase" | "alignment" | "axis" | "distribution" | "spacing">>): jsx.JSX.Element;
+    BASELINE: string;
+    CENTER: string;
+    END: string;
+    FILL: string;
+    HORIZONTAL: string;
+    SPACE_BETWEEN: string;
+    SPACE_EVENLY: string;
+    START: string;
+    STRETCH: string;
+    VERTICAL: string;
+};

package/dist/types/StackView/index.d.ts

@@ -0,0 +1,2 @@
+export * from './StackView';
+export { StackView as default } from './StackView';

package/dist/types/Tab/Tab.d.ts

@@ -0,0 +1,15 @@
+import { ColorProp } from '../index';
+import { TextProps } from '../Text';
+export declare type TabProps = {
+    /** Whether or not the tab is active. Sets element to span and removes `href` and hover effects if `true`. */
+    active?: boolean;
+    /** Whether or not the tab is disabled. */
+    disabled?: boolean;
+    /** Link to URL. Sets element to an anchor, otherwise it will use a button. */
+    href?: string;
+    /** The size of the tab which includes `fontSize`, `lineHeight` and `padding`. */
+    size?: 'xs' | 'sm' | 'md' | 'lg';
+    /** The background color of the tab. */
+    color?: ColorProp;
+} & TextProps;
+export declare function Tab({ active, disabled, href, color, size, ...props }: TabProps): JSX.Element;

package/dist/types/Tab/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Tab';
+export { Tab as default } from './Tab';