@veeqo/ui 6.0.0-beta.7 → 6.0.0

package/README.md

@@ -10,15 +10,16 @@ In the longer term Icons and Integrations **WILL** be moved to their own library
 
 ### Links ⚓️
 
-**This Library**: [Storybook 📋](https:/ui.veeqo.amazon.dev/?path=/docs/get-started-how-to-install--docs) | [Playroom 🛝](https://ui.veeqo.amazon.dev/playroom/)
+**This Library**: [Storybook 📋](https://ui.veeqo.amazon.dev/?path=/docs/get-started-how-to-install--docs) | Playroom 🛝 (not deployed)
 
 **Old Library**: [Storybook 📋](https://master.d1cz47hw90nvy2.amplifyapp.com/) | [Playroom 🛝](https://master.d1cz47hw90nvy2.amplifyapp.com/playroom)
 
 ## Getting Started
 
-Setup should be simple, clone the repo and use npm to install all dependencies.
+Setup should be simple, clone the repo and use `npm i` to install all dependencies.
 
-Start storybook with `npm run storybook`, and Playroom (including the storybook playroom integration) in a seperate terminal use `npm run playroom:start`.
+- Start storybook with `npm run storybook`, which starts on `localhost:3000`
+- Start Playroom with `npm run playroom:start`, which starts on `localhost:9000`
 
 ### Testing
 

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

@@ -1,12 +1,3 @@
-import { FC, ReactNode, ReactElement } from 'react';
-export interface AccordionProps {
-    children: ReactNode;
-    label: string;
-    iconSlot?: ReactElement;
-    glyphColor?: string;
-    className?: string;
-    timeout?: number;
-    description?: string;
-    shouldOpenOnMount?: boolean;
-}
+import { FC } from 'react';
+import { AccordionProps } from './types';
 export declare const Accordion: FC<AccordionProps>;

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

@@ -22,4 +22,15 @@ declare const AccordionContent: import("styled-components").StyledComponent<impo
     forwardedAs?: string | import("react").ComponentType<any> | undefined;
 }>, any, {}, never>;
 declare const AccordionDetails: import("styled-components").StyledComponent<"details", any, {}, never>;
-export { AccordionSummary, Top, Text, Left, Right, Description, AccordionDetails, AccordionContent, };
+declare const UnstyledAccordionContent: import("styled-components").StyledComponent<import("framer-motion").CustomDomComponent<{
+    [x: string]: any;
+    [x: number]: any;
+    [x: symbol]: any;
+} & {
+    theme?: any;
+} & {
+    as?: string | import("react").ComponentType<any> | undefined;
+    forwardedAs?: string | import("react").ComponentType<any> | undefined;
+}>, any, {}, never>;
+declare const UnstyledAccordionSummary: import("styled-components").StyledComponent<"summary", any, {}, never>;
+export { AccordionSummary, Top, Text, Left, Right, Description, AccordionDetails, AccordionContent, UnstyledAccordionContent, UnstyledAccordionSummary, };

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

@@ -0,0 +1,15 @@
+import { ReactElement, ReactNode } from 'react';
+import { TextVariant } from '../Text/types';
+export type AccordionProps = {
+    children: ReactNode;
+    label: string;
+    iconSlot?: ReactElement;
+    glyphColor?: string;
+    className?: string;
+    timeout?: number;
+    description?: string;
+    shouldOpenOnMount?: boolean;
+    variant?: AccordianVariants;
+    summaryTextVariant?: TextVariant;
+};
+export type AccordianVariants = 'default' | 'unstyled';

package/dist/components/ActionMenu/ActionMenu.d.ts

@@ -0,0 +1,16 @@
+import React, { ReactNode } from 'react';
+import { MenuItemProps } from 'react-aria-components';
+import { ButtonProps } from '../Button/types';
+export type ActionMenuProps = {
+    id?: string;
+    menuLabel?: string;
+    actions?: MenuItemProps[];
+    ctaProps: ButtonProps;
+    children?: ReactNode;
+};
+export declare const ActionMenu: {
+    ({ id, menuLabel, ctaProps, actions, children }: ActionMenuProps): React.JSX.Element;
+    Item: import("styled-components").StyledComponent<(<T extends object>(props: MenuItemProps<T> & React.RefAttributes<HTMLDivElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>), any, {}, never>;
+    Section: import("styled-components").StyledComponent<(<T_1 extends object>(props: import("react-aria-components").SectionProps<T_1> & React.RefAttributes<HTMLElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>), any, {}, never>;
+    Text: React.ForwardRefExoticComponent<import("react-aria-components").TextProps & React.RefAttributes<HTMLElement>>;
+};

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

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

package/dist/components/ActionMenu/styled.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+export declare const MenuItem: import("styled-components").StyledComponent<(<T extends object>(props: import("react-aria-components").MenuItemProps<T> & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>), any, {}, never>;
+export declare const Section: import("styled-components").StyledComponent<(<T extends object>(props: import("react-aria-components").SectionProps<T> & import("react").RefAttributes<HTMLElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>), any, {}, never>;

package/dist/components/Alert/Alert.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import type { AlertProps } from './types';
+export declare const Alert: ({ size, variant, colours: passedColours, rightActions, title, titleSlot, message, children, iconSlot, onClickClose, ...divProps }: AlertProps) => React.JSX.Element;

package/dist/components/Alert/constants.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import type { AlertColours, AlertSizes, AlertVariants } from './types';
+export declare const SpacingMap: Record<AlertSizes, string>;
+export declare const IconSizeMap: Record<AlertSizes, string>;
+export declare const IconMap: Record<AlertVariants, (props: any) => React.JSX.Element>;
+export declare const ColourMap: Record<AlertVariants, AlertColours>;

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

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

package/dist/components/Alert/styled.d.ts

@@ -0,0 +1,4 @@
+import { AlertColours } from './types';
+export declare const AlertContainer: import("styled-components").StyledComponent<"div", any, import("../Stack/types").StackProps & {
+    colours: AlertColours;
+}, never>;

package/dist/components/Alert/types.d.ts

@@ -0,0 +1,20 @@
+import { ReactNode } from 'react';
+import { Action } from '../Modal/types';
+export type AlertProps = React.HTMLAttributes<HTMLDivElement> & {
+    size?: AlertSizes;
+    variant?: AlertVariants;
+    colours?: AlertColours;
+    rightActions?: Action[];
+    title?: string;
+    titleSlot?: ReactNode;
+    message?: string;
+    children?: ReactNode;
+    iconSlot?: (props: any) => React.JSX.Element;
+    onClickClose?: () => void;
+};
+export type AlertVariants = 'default' | 'error' | 'success' | 'info' | 'warning' | 'recommend';
+export type AlertSizes = 'base' | 'sm' | 'xs';
+export type AlertColours = {
+    primary: string;
+    background: string;
+};

package/dist/components/Anchor/Anchor.d.ts

@@ -1,9 +1,8 @@
-import React, { ReactNode } from 'react';
-export interface AnchorProps {
+import React, { ReactNode, AnchorHTMLAttributes } from 'react';
+export type AnchorProps = AnchorHTMLAttributes<HTMLAnchorElement> & {
     children?: ReactNode;
     href: string;
-    text?: string;
-    className?: string;
-    target?: string;
-}
-export declare const Anchor: ({ children, className, text, href, target }: AnchorProps) => React.JSX.Element;
+    rel?: string;
+    allowedHostnames?: string[];
+};
+export declare const Anchor: ({ children, href, rel, allowedHostnames, ...props }: AnchorProps) => React.JSX.Element;

package/dist/components/AnimatedDropdown/AnimatedDropdown.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import { AnimatedDropdownProps } from './types';
-export declare const AnimatedDropdown: ({ id, cta, shouldShowDropdown, children, className, reversed, placement, onClick, onMouseEnter, onMouseLeave, useAnchorWidth, ...popoverProps }: AnimatedDropdownProps) => React.JSX.Element;
+export declare const AnimatedDropdown: ({ cta, shouldShowDropdown, children, className, reversed, onClickAway, timeout, transitionClassnames, onClick, onMouseEnter, onMouseLeave, }: AnimatedDropdownProps) => React.JSX.Element;

package/dist/components/AnimatedDropdown/components/BasicDropdown.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export declare const BasicDropdown: React.ForwardRefExoticComponent<import("../../types").EventHandlerProps & {
+    className?: string | undefined;
+    children: React.ReactNode;
+    role?: React.AriaRole | undefined;
+} & React.RefAttributes<HTMLDivElement>>;

package/dist/components/AnimatedDropdown/components/styled.d.ts

@@ -1,14 +1 @@
-/// <reference types="react" />
-export declare const DropdownContainer: import("styled-components").StyledComponent<import("framer-motion").CustomDomComponent<{
-    [x: string]: any;
-    [x: number]: any;
-    [x: symbol]: any;
-} & {
-    theme?: any;
-} & {
-    as?: string | import("react").ComponentType<any> | undefined;
-    forwardedAs?: string | import("react").ComponentType<any> | undefined;
-}>, any, {
-    reversed?: boolean | undefined;
-    useAnchorWidth?: boolean | undefined;
-}, never>;
+export declare const Container: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/components/AnimatedDropdown/styled.d.ts

@@ -1,3 +1,11 @@
+/// <reference types="react" />
 declare const Container: import("styled-components").StyledComponent<"div", any, {}, never>;
 declare const Wrap: import("styled-components").StyledComponent<"div", any, {}, never>;
-export { Wrap, Container };
+declare const Dropdown: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../types").EventHandlerProps & {
+    className?: string | undefined;
+    children: import("react").ReactNode;
+    role?: import("react").AriaRole | undefined;
+} & import("react").RefAttributes<HTMLDivElement>>, any, {
+    reversed?: boolean | undefined;
+}, never>;
+export { Wrap, Dropdown, Container };

package/dist/components/AnimatedDropdown/types.d.ts

@@ -1,17 +1,15 @@
-import { ReactNode } from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
 import { EventHandlerProps } from '../types';
-import { PopoverProps } from '../Popover/types';
-export type BasicDropdownProps = {
+export type BasicDropdownProps = EventHandlerProps & {
     className?: string;
     children: ReactNode;
-    reversed?: boolean;
-} & PopoverProps;
-export type AnimatedDropdownProps = EventHandlerProps & Pick<BasicDropdownProps, 'children' | 'className' | 'placement' | 'useAnchorWidth' | 'rootElementRef' | 'disableFocusLock'> & {
-    id?: string;
+    role?: HTMLAttributes<HTMLDivElement>['role'];
+};
+export type AnimatedDropdownProps = BasicDropdownProps & {
     cta?: ReactNode;
     shouldShowDropdown: boolean;
     timeout?: number;
     transitionClassnames?: string;
+    onClickAway?: (event: Event) => void;
     reversed?: boolean;
-    onShouldClose: () => void;
 };

package/dist/components/Choice/Choice.d.ts

@@ -1,5 +1,7 @@
 import React, { ReactNode } from 'react';
+import { TextVariant } from '../Text/types';
 export interface ForwardedChoiceProps {
+    className?: string;
     disabled?: boolean;
     label?: string;
     hint?: string;
@@ -9,9 +11,11 @@ export interface ForwardedChoiceProps {
     Badge?: ReactNode;
     Accessory?: ReactNode;
     Footer?: ReactNode;
+    inputPosition?: 'left' | 'right';
+    labelVariant?: TextVariant;
 }
 export interface ChoiceProps extends ForwardedChoiceProps {
     id: string;
     children: ReactNode;
 }
-export declare const Choice: ({ id, label, hint, tooltip, error, bordered, Badge, Accessory, Footer, children, disabled, }: ChoiceProps) => React.JSX.Element;
+export declare const Choice: ({ id, className, label, hint, tooltip, error, bordered, Badge, Accessory, Footer, children, disabled, labelVariant, inputPosition, }: ChoiceProps) => React.JSX.Element;

package/dist/components/Choice/components/styled.d.ts

@@ -5,7 +5,6 @@ export interface InputLayoutProps {
 export declare const InputLayout: import("styled-components").StyledComponent<"div", any, InputLayoutProps, never>;
 export declare const AccessoryLayout: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const TextLayout: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const LabelText: import("styled-components").StyledComponent<"span", any, {}, never>;
 export declare const HintText: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const ErrorText: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const Wrapper: import("styled-components").StyledComponent<"label", any, {

package/dist/components/DataTable/DataTable.d.ts

@@ -4,7 +4,7 @@ import { ColumnMenu } from './components/ColumnMenu';
 import { SelectionCell } from './components/SelectionCell';
 import { SelectionHeader } from './components/SelectionHeader';
 export declare const DataTable: {
-    ({ ActionBarSlot, borderMode, columns, emptyState, expandedRowIds, loading, loadingRowCount, onChangeSort, rows, disabledRowIds, selectionMode, selectionState, setExpanded, sortState, stripingMode, enableStickyHeader, }: DataTableProps): React.JSX.Element;
+    ({ ActionBarSlot, borderMode, columns: initialColumns, emptyState, expandedRowIds, loading, loadingRowCount, onChangeSort, rows, disabledRowIds, selectionMode, selectionState, setExpanded, sortState, stripingMode, enableStickyHeader, resizeableColumns, }: DataTableProps): React.JSX.Element;
     defaultProps: {
         loading: boolean;
         loadingRowCount: number;

package/dist/components/DataTable/components/ColumnDivider.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { ColumnId, ColumnWidthHandler } from '../types';
+export type ColumnDividerProps = {
+    columnId: ColumnId;
+    setColumnWidth?: ColumnWidthHandler;
+};
+export type CalculateWidthProps = {
+    event: MouseEvent;
+};
+export declare const ResizerBar: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ColumnDivider: ({ columnId, setColumnWidth }: ColumnDividerProps) => React.JSX.Element;

package/dist/components/DataTable/hooks/useColumnWidths.d.ts

@@ -0,0 +1,10 @@
+import { RefObject } from 'react';
+import { ColumnConfigs, ColumnWidthsType, ColumnWidthHandler, ColumnId } from '../types';
+export declare const useColumnWidths: ({ tableRef, columns, columnIds, }: {
+    tableRef: RefObject<HTMLElement>;
+    columns: ColumnConfigs;
+    columnIds: ColumnId[];
+}) => {
+    setColumnWidth: ColumnWidthHandler;
+    columnWidths: ColumnWidthsType;
+};

package/dist/components/DataTable/hooks/useColumns.d.ts

@@ -1,6 +1,56 @@
+import { RefObject } from 'react';
 import { ColumnConfigs } from '../types';
-export declare function useColumns(columns: ColumnConfigs): {
-    visible: import("../types").ColumnConfig[];
-    pinnedLeft: import("../types").ColumnConfig[];
-    pinnedRight: import("../types").ColumnConfig[];
+export declare function useColumns(columns: ColumnConfigs, tableRef: RefObject<HTMLElement>): {
+    visible: {
+        width: import("../types").ColumnWidth | import("../types").ColumnWidthBounded | undefined;
+        id: import("../types").ColumnId;
+        align?: import("../types").ColumnAlignment | undefined;
+        hidden?: boolean | undefined;
+        icon?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
+        pinned?: import("../types").ColumnPinned | undefined;
+        sortable?: boolean | undefined;
+        spacing?: keyof import("../../Stack/types").SizeScale | undefined;
+        span?: number | undefined;
+        title?: string | undefined;
+        tooltip?: string | undefined;
+        renderCell: import("../types").CellRenderer;
+        renderFooter?: import("../types").FooterRenderer | undefined;
+        renderHeader?: import("../types").HeaderRenderer | undefined;
+        renderNestedCell?: import("../types").NestedCellRenderer | undefined;
+    }[];
+    pinnedLeft: {
+        width: import("../types").ColumnWidth | import("../types").ColumnWidthBounded | undefined;
+        id: import("../types").ColumnId;
+        align?: import("../types").ColumnAlignment | undefined;
+        hidden?: boolean | undefined;
+        icon?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
+        pinned?: import("../types").ColumnPinned | undefined;
+        sortable?: boolean | undefined;
+        spacing?: keyof import("../../Stack/types").SizeScale | undefined;
+        span?: number | undefined;
+        title?: string | undefined;
+        tooltip?: string | undefined;
+        renderCell: import("../types").CellRenderer;
+        renderFooter?: import("../types").FooterRenderer | undefined;
+        renderHeader?: import("../types").HeaderRenderer | undefined;
+        renderNestedCell?: import("../types").NestedCellRenderer | undefined;
+    }[];
+    pinnedRight: {
+        width: import("../types").ColumnWidth | import("../types").ColumnWidthBounded | undefined;
+        id: import("../types").ColumnId;
+        align?: import("../types").ColumnAlignment | undefined;
+        hidden?: boolean | undefined;
+        icon?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
+        pinned?: import("../types").ColumnPinned | undefined;
+        sortable?: boolean | undefined;
+        spacing?: keyof import("../../Stack/types").SizeScale | undefined;
+        span?: number | undefined;
+        title?: string | undefined;
+        tooltip?: string | undefined;
+        renderCell: import("../types").CellRenderer;
+        renderFooter?: import("../types").FooterRenderer | undefined;
+        renderHeader?: import("../types").HeaderRenderer | undefined;
+        renderNestedCell?: import("../types").NestedCellRenderer | undefined;
+    }[];
+    setColumnWidth: import("../types").ColumnWidthHandler;
 };

package/dist/components/DataTable/renderers/renderHeader.d.ts

@@ -1,9 +1,13 @@
 import { ReactNode } from 'react';
-import { ColumnConfig, SortState, SortChangeHandler } from '../types';
+import { ColumnConfig, SortState, SortChangeHandler, ColumnWidthHandler } from '../types';
 type RenderHeaderParameters = {
     column: ColumnConfig;
     sortState?: SortState;
     onChangeSort?: SortChangeHandler;
+    resizeableColumns?: boolean;
+    setColumnWidth?: ColumnWidthHandler;
+    columnCount?: number;
+    columnI?: number;
 };
 /**
  * Default renderer for table header cells
@@ -11,5 +15,5 @@ type RenderHeaderParameters = {
  * @param column Column configuration object
  * @returns Header cell instance
  */
-export declare function renderHeader({ column, sortState, onChangeSort, }: RenderHeaderParameters): ReactNode;
+export declare function renderHeader({ column, sortState, onChangeSort, resizeableColumns, setColumnWidth, columnCount, columnI, }: RenderHeaderParameters): ReactNode;
 export {};

package/dist/components/DataTable/types.d.ts

@@ -46,6 +46,11 @@ export type SortState = {
     direction: SortDirection;
 };
 export type SortChangeHandler = (sortState: SortState) => void;
+export type ColumnWidthState = {
+    columnId: ColumnId;
+    width: number | string;
+};
+export type ColumnWidthHandler = (columnWidthState: ColumnWidthState) => void;
 export type RowId = number | string;
 export interface NestedTableRow {
     id: RowId;
@@ -65,9 +70,11 @@ export interface HeaderProps extends React.HtmlHTMLAttributes<HTMLTableCellEleme
     align?: ColumnAlignment;
     spacing?: ColumnSpacing;
     span?: number;
+    zIndex?: number;
 }
 export interface RendererHeaderProps extends HeaderProps {
     key: string;
+    'data-columnid'?: string;
 }
 export interface SelectionHeaderProps extends Omit<HeaderProps, 'onChange'> {
     selected: boolean;
@@ -112,5 +119,10 @@ export interface DataTableProps {
     setExpanded?: SetExpandedAction;
     sortState?: SortState;
     stripingMode?: StripingMode;
+    resizeableColumns?: boolean;
 }
+export type ColumnWidthsType = {
+    [key: ColumnId]: ColumnWidthType;
+};
+export type ColumnWidthType = ColumnWidthFixed | ColumnWidthBounded | undefined;
 export {};

package/dist/components/DataTable/utils/customEventEmitter.d.ts

@@ -0,0 +1 @@
+export declare const customEventEmitter: (eventType: string, data: any) => void;

package/dist/components/DateRangeInput/DateRangeInput.d.ts

@@ -0,0 +1,21 @@
+import React, { CSSProperties } from 'react';
+import { DateValue } from 'react-aria-components';
+export type DateRangeInputProps = {
+    id?: string;
+    className?: string;
+    style?: CSSProperties;
+    shouldForceLeadingZeros?: boolean;
+    hasError?: boolean;
+    startValue?: DateValue | null;
+    endValue?: DateValue | null;
+    minValue?: DateValue;
+    maxvalue?: DateValue;
+    isDisabled?: boolean;
+    isReadOnly?: boolean;
+    'aria-label'?: string;
+    'aria-labelledby'?: string;
+    'aria-describedby'?: string;
+    onChangeStartDate: (value: DateValue) => void;
+    onChangeEndDate: (value: DateValue) => void;
+};
+export declare const DateRangeInput: ({ id, className, style, shouldForceLeadingZeros, hasError, minValue, maxvalue, startValue, endValue, isDisabled, isReadOnly, "aria-label": ariaLabel, "aria-describedby": ariaDescribedBy, "aria-labelledby": ariaLabelledBy, onChangeStartDate, onChangeEndDate, }: DateRangeInputProps) => React.JSX.Element;

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

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const DateRangeInput: import("react").FC<import("./DateRangeInput").DateRangeInputProps & import("../../hoc/withLabels/withLabels").WithLabelsProps>;

package/dist/components/DateRangeInput/styled.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+export declare const DateRangeGroup: import("styled-components").StyledComponent<(props: import("react-aria-components").GroupProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, any, {
+    $hasError?: boolean | undefined;
+}, never>;

package/dist/components/DateRangePicker/DateRangePicker.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { DateRangePickerProps } from './types';
+export declare const DateRangePicker: ({ className, style, isDisabled, isMultiMonth, showDatePresets, onReset, disabledRanges, selectedPreset, setSelectedPreset, selectedRange, setSelectedRange, "aria-describedby": ariaDescribedBy, "aria-label": ariaLabel, ...previousPeriodProps }: DateRangePickerProps) => React.JSX.Element;

package/dist/components/DateRangePicker/DateRangePicker.test.d.ts

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

package/dist/components/DateRangePicker/components/ComparePreviousPeriod.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { SelectOption } from '../../Select/Select';
+export type ComparePreviousPeriodProps = {
+    options?: SelectOption[];
+    selectedPreviousPeriod: SelectOption | null;
+    setSelectedPreviousPeriod: (selected: SelectOption | null) => void;
+};
+export declare const ComparePreviousPeriod: ({ options, selectedPreviousPeriod, setSelectedPreviousPeriod, }: ComparePreviousPeriodProps) => React.JSX.Element;

package/dist/components/DateRangePicker/components/ComparePreviousPeriod.test.d.ts

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

package/dist/components/DateRangePicker/components/Divider.d.ts

@@ -0,0 +1 @@
+export declare const Divider: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/components/DateRangePicker/components/constants.d.ts

@@ -0,0 +1,4 @@
+export declare const DEFAULT_PREVIOUS_PERIOD_OPTIONS: {
+    label: string;
+    value: string;
+}[];

package/dist/components/DateRangePicker/constants.d.ts

@@ -0,0 +1,25 @@
+import { CalendarDate } from '@internationalized/date';
+import { DateRange } from 'react-aria-components';
+import { SelectOption } from '../Select/Select';
+export declare enum DateRanges {
+    TODAY = "TODAY",
+    YESTERDAY = "YESTERDAY",
+    LAST_7_DAYS = "LAST_7_DAYS",
+    LAST_30_DAYS = "LAST_30_DAYS",
+    LAST_90_DAYS = "LAST_90_DAYS",
+    LAST_MONTH = "LAST_MONTH",
+    LAST_12_MONTHS = "LAST_12_MONTHS",
+    WEEK_TO_DATE = "WEEK_TO_DATE",
+    MONTH_TO_DATE = "MONTH_TO_DATE",
+    YEAR_TO_DATE = "YEAR_TO_DATE"
+}
+export declare const timeRangeToDateRange: (range: DateRange) => {
+    start: CalendarDate;
+    end: CalendarDate;
+};
+export declare const getDateRange: (option: DateRanges) => DateRange | null;
+export declare const DATE_RANGE_OPTIONS: SelectOption[];
+export declare const checkForMatchingPreset: (selectedRange: DateRange) => SelectOption | undefined;
+export declare const DEFAULT_SELECTION = DateRanges.LAST_30_DAYS;
+export declare const DEFAULT_RANGE: DateRange | null;
+export declare const DEFAULT_PRESET: SelectOption;

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

@@ -0,0 +1,3 @@
+export { DateRangePicker } from './DateRangePicker';
+export { checkIfDateRangeInvalid } from './utils';
+export { DATE_RANGE_OPTIONS, DEFAULT_PRESET, DEFAULT_RANGE, DateRanges, getDateRange, } from './constants';

package/dist/components/DateRangePicker/types.d.ts

@@ -0,0 +1,37 @@
+import { CSSProperties } from 'react';
+import type { DateRange } from 'react-aria-components';
+import { CalendarDate } from '@internationalized/date';
+import { ComparePreviousPeriodProps } from './components/ComparePreviousPeriod';
+import { SelectOption } from '../Select/Select';
+export type DateRangePickerProps = {
+    style?: CSSProperties;
+    className?: string;
+    isDisabled?: boolean;
+    isMultiMonth?: boolean;
+    showDatePresets?: boolean;
+    onReset?: () => void;
+    disabledRanges?: CalendarDate[][];
+    selectedPreset: SelectOption;
+    setSelectedPreset: (selected: SelectOption) => void;
+    selectedRange: DateRange | null;
+    setSelectedRange: (selected: DateRange | null) => void;
+} & PreviousPeriodProps & RequiredLabel;
+type RequiredLabel = {
+    'aria-describedby': string;
+    'aria-label'?: string;
+} | {
+    'aria-describedby'?: string;
+    'aria-label': string;
+};
+type PreviousPeriodProps = {
+    showPreviousPeriod: true;
+    previousPeriodOptions?: ComparePreviousPeriodProps['options'];
+    selectedPreviousPeriod: ComparePreviousPeriodProps['selectedPreviousPeriod'];
+    setSelectedPreviousPeriod: ComparePreviousPeriodProps['setSelectedPreviousPeriod'];
+} | {
+    showPreviousPeriod?: false;
+    previousPeriodOptions?: ComparePreviousPeriodProps['options'];
+    selectedPreviousPeriod?: ComparePreviousPeriodProps['selectedPreviousPeriod'];
+    setSelectedPreviousPeriod?: ComparePreviousPeriodProps['setSelectedPreviousPeriod'];
+};
+export {};

package/dist/components/DateRangePicker/utils.d.ts

@@ -0,0 +1,6 @@
+import { CalendarDate } from '@internationalized/date';
+import { DateRange } from 'react-aria-components';
+export declare const checkIfDateRangeInvalid: ({ disabledRanges, selectedRange, }: {
+    disabledRanges?: CalendarDate[][] | undefined;
+    selectedRange: DateRange | null;
+}) => boolean;

package/dist/components/DateRangePicker/utils.test.d.ts

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

package/dist/components/DimensionsInput/styled.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const Container: import("styled-components").StyledComponent<"div", any, {}, never>;
 declare const Row: import("styled-components").StyledComponent<"div", any, {}, never>;
-declare const StyledTextField: import("styled-components").StyledComponent<import("react").FC<Omit<import("../types").EventHandlerProps, "onChange" | "onKeyDown"> & Pick<import("react").InputHTMLAttributes<HTMLInputElement>, "style" | "onKeyDown" | "autoComplete"> & {
+declare const StyledTextField: import("styled-components").StyledComponent<import("react").FC<Omit<import("../types").EventHandlerProps, "onChange" | "onKeyDown"> & Pick<import("react").InputHTMLAttributes<HTMLInputElement>, "onKeyDown" | "autoComplete"> & {
     className?: string | undefined;
     type?: import("../TextField/types").TextFieldType | undefined;
     value?: string | undefined;

package/dist/components/Dropdown/Dropdown.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { DropdownProps } from './types';
+export declare const Dropdown: ({ id, shouldShow, setShouldShow, ctaIconSlot, ctaProps, ...dropdownProps }: DropdownProps) => React.JSX.Element;

package/dist/components/Dropdown/Dropdown.test.d.ts

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

package/dist/components/Dropdown/DropdownPopover.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { BasicDropdownProps } from './types';
+export declare const DropdownPopover: ({ id, children, className, style, reversed, anchorElement, useAnchorWidth, onShouldClose, ...popoverProps }: BasicDropdownProps) => React.JSX.Element;

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

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

package/dist/components/Dropdown/styled.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+export declare const DropdownContainer: import("styled-components").StyledComponent<import("framer-motion").CustomDomComponent<{
+    [x: string]: any;
+    [x: number]: any;
+    [x: symbol]: any;
+} & {
+    theme?: any;
+} & {
+    as?: string | import("react").ComponentType<any> | undefined;
+    forwardedAs?: string | import("react").ComponentType<any> | undefined;
+}>, any, {}, never>;

package/dist/components/Dropdown/types.d.ts

@@ -0,0 +1,16 @@
+import { ReactElement, ReactNode } from 'react';
+import { PopoverProps } from '../Popover/types';
+import { ButtonProps } from '../Button/types';
+export type BasicDropdownProps = {
+    className?: string;
+    children: ReactNode;
+    reversed?: boolean;
+} & PopoverProps;
+export type DropdownProps = Omit<BasicDropdownProps, 'anchorElement' | 'onShouldClose'> & {
+    id: string;
+    shouldShow?: boolean;
+    setShouldShow?: (newValue: boolean) => void;
+    ctaIconSlot?: ReactElement;
+    ctaProps?: ButtonProps;
+    children?: ReactNode;
+};