@7shifts/sous-chef 3.10.0 → 3.10.2

package/dist/src/layout/Inline/Inline.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+import type { AlignItems, FlexWrap, JustifyContent, Space } from '../Flex/types';
+declare type Props = {
+    children: React.ReactNode;
+    /** From `0` to `60` with multiples of `4`, eg. `8`, `12`, `16` and so on. */
+    space?: Space;
+    /** It sets how each item will grow or shrink to fit the space available in its flex container. The default value is `0 1 auto` but it can be overriden. Check it out this [official doc](https://developer.mozilla.org/en-US/docs/Web/CSS/flex) to see all the possible values. */
+    flex?: (string | number)[];
+    /** One of: `flex-start`, `flex-end`, `center`, `stretch` */
+    alignItems?: AlignItems;
+    /** One of: `start`, `end`, `center`, `space-between` */
+    justifyContent?: JustifyContent;
+    inlineFlex?: boolean;
+    flexWrap?: FlexWrap;
+    testId?: string;
+};
+/**
+ * Layout component to easily line elements up in a row.
+ */
+declare const Inline: React.FC<Props>;
+export default Inline;

package/dist/src/layout/Inline/index.d.ts

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

package/dist/src/layout/Stack/Stack.d.ts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import type { JustifyContent, Space, AlignItems } from '../Flex/types';
+declare type Props = {
+    children: React.ReactNode;
+    /** From `0` to `60` with multiples of `4`, eg. `8`, `12`, `16` and so on. */
+    space?: Space;
+    /** It sets how each item will grow or shrink to fit the space available in its flex container. The default value is `0 1 auto` but it can be overriden. Check it out this [official doc](https://developer.mozilla.org/en-US/docs/Web/CSS/flex) to see all the possible values. */
+    flex?: (string | number)[];
+    /** One of: `flex-start`, `flex-end`, `center`, `stretch` */
+    alignItems?: AlignItems;
+    /** One of: `start`, `end`, `center`, `space-between` */
+    justifyContent?: JustifyContent;
+    flexItems?: boolean;
+    testId?: string;
+};
+/**
+ * Layout component to easily stack elements up in a column.
+ */
+declare const Stack: React.FC<Props>;
+export default Stack;

package/dist/src/layout/Stack/index.d.ts

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

package/dist/src/layout/index.d.ts

@@ -0,0 +1,5 @@
+import Card from './Card';
+import Inline from './Inline';
+import Stack from './Stack';
+export { Card, Inline, Stack };
+export type { AlignItems, FlexWrap, JustifyContent } from './Flex/types';

package/dist/src/lists/DataTable/DataTable.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+import type { Column, CustomComponent, Item, Sort } from './types';
+declare type Props<T> = {
+    /** Each element represents a row and each key of the object represents a column */
+    items: Item<T>[];
+    /** For each column element, the `name` property should match the key on `items` */
+    columns?: Column[];
+    /** A custom component for  customizing how the each item is rendered. It pass as props: `item`, `index`, `columnSizes` and `columns` */
+    itemComponent?: React.ComponentType<CustomComponent<T>>;
+    maxHeight?: number;
+    /** Used for pagination */
+    hasPrevious?: boolean;
+    /** Used for pagination */
+    hasNext?: boolean;
+    /** Used for pagination */
+    onPreviousClick?: () => void;
+    /** Used for pagination */
+    onNextClick?: () => void;
+    isLoading?: boolean;
+    /** It is fired when a sorted column is clicked to be sorted */
+    onSort?: (sort: Sort) => void;
+    showActionMenu?: boolean;
+    /** Will render footer component if not null - expects a custom RowItem component */
+    footerComponent?: React.ReactNode;
+    /** Will render vertical borders between columns if true */
+    hasVerticalBorders?: boolean;
+    /** Used to override the default data-testid */
+    testId?: string;
+};
+declare const DataTable: <T extends unknown>({ items, columns, itemComponent, maxHeight, hasPrevious, hasNext, onPreviousClick, onNextClick, onSort, isLoading, showActionMenu, footerComponent, hasVerticalBorders, testId }: Props<T>) => JSX.Element;
+export default DataTable;

package/dist/src/lists/DataTable/DataTableCell/DataTableCell.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+declare type Props = {
+    children: React.ReactNode;
+    columnIndex: number;
+};
+declare const DataTableCell: ({ children, columnIndex }: Props) => JSX.Element;
+export default DataTableCell;

package/dist/src/lists/DataTable/DataTableCell/index.d.ts

@@ -0,0 +1 @@
+export * from './DataTableCell';

package/dist/src/lists/DataTable/DataTableContext.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import type { Column } from './types';
+export declare type DataTableContextType = {
+    columns?: Column[];
+    showActionMenu?: boolean;
+    numberOfRows: number;
+    hasVerticalBorders?: boolean;
+};
+declare const Context: import("react").Context<DataTableContextType>;
+export declare const useDataTableContext: () => DataTableContextType;
+export default Context;

package/dist/src/lists/DataTable/DataTableHeader.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { Column, Sort } from './types';
+declare type Props = {
+    columns: Column[];
+    onSort?: (sort: Sort) => void;
+    showActionMenu?: boolean;
+};
+declare const DataTableHeader: React.FC<Props>;
+export default DataTableHeader;

package/dist/src/lists/DataTable/index.d.ts

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

package/dist/src/lists/DataTable/types.d.ts

@@ -0,0 +1,34 @@
+import React from 'react';
+import Button from '../../actions/Button/Button';
+import { MenuAction } from '../../overlay/Menu/types';
+export declare type Column = {
+    name: string;
+    label?: React.ReactNode;
+    size?: number;
+    isSortable?: boolean;
+    currentSort?: SortDirection;
+    isRightAligned?: boolean;
+};
+export declare type SortDirection = 'asc' | 'desc' | null;
+export declare type Sort = {
+    columnName: string;
+    direction: SortDirection;
+};
+export declare type Item<T> = T | (T & {
+    actions?: Action[];
+});
+export declare type CustomComponent<T> = {
+    item: Item<T>;
+    index: number;
+    columnSizes?: number[];
+    columns?: Column[];
+};
+declare type KebabAction = {
+    showInKebab?: true;
+} & MenuAction;
+declare type ButtonAction = {
+    buttonProps?: Pick<React.ComponentPropsWithoutRef<typeof Button>, 'theme' | 'disabled' | 'loading' | 'title'>;
+    showInKebab: false;
+} & MenuAction;
+export declare type Action = KebabAction | ButtonAction;
+export {};

package/dist/src/lists/DataTableEditableCell/DataTableEditableCell.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+declare type Props = {
+    name: string;
+    columnIndex: number;
+    rowIndex: number;
+    id?: string;
+    value?: string;
+    onChange?: (e: string) => void;
+    onBlur?: (e: string) => void;
+    placeholder?: string;
+    disabled?: boolean;
+    error?: string;
+    /** Use a prefix for things like currency symbols (“$”, “¥”, “£”) or icons. */
+    prefix?: React.ReactNode;
+    /** Use suffix for things like units of measure (“in”, “cm”, ”hours”) or icons. */
+    suffix?: React.ReactNode;
+    defaultValue?: string;
+    type?: 'text' | 'currency';
+    testId?: string;
+};
+declare const DataTableEditableCell: ({ name, columnIndex, rowIndex, id: inputId, value, onChange, onBlur, placeholder, disabled, error, prefix, suffix, defaultValue, type, testId }: Props) => JSX.Element;
+export default DataTableEditableCell;

package/dist/src/lists/DataTableEditableCell/index.d.ts

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

package/dist/src/lists/DataTableRow/DataTableRow.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { Action } from '../DataTable/types';
+declare type Props = {
+    children: React.ReactNode;
+    onClick?: () => void;
+    isSelected?: boolean;
+    actions?: Action[];
+    hasDefaultPadding?: boolean;
+} & Omit<React.HTMLProps<HTMLDivElement>, 'css'>;
+declare const DataTableRow: React.ForwardRefExoticComponent<Pick<Props, "size" | "color" | "className" | "height" | "id" | "lang" | "max" | "media" | "method" | "min" | "name" | "style" | "target" | "type" | "width" | "role" | "tabIndex" | "crossOrigin" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "form" | "list" | "default" | "disabled" | "title" | "cite" | "data" | "label" | "slot" | "span" | "summary" | "pattern" | "start" | "wrap" | "checked" | "value" | "placeholder" | "prefix" | "content" | "translate" | "hidden" | "open" | "multiple" | "autoFocus" | "defaultValue" | "draggable" | "autoComplete" | "maxLength" | "dir" | "isSelected" | "readOnly" | "sizes" | "htmlFor" | "actions" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "async" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "dateTime" | "defer" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "high" | "hrefLang" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "mediaGroup" | "minLength" | "muted" | "nonce" | "noValidate" | "optimum" | "playsInline" | "poster" | "preload" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "src" | "srcDoc" | "srcLang" | "srcSet" | "step" | "useMap" | "wmode" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "hasDefaultPadding"> & React.RefAttributes<HTMLDivElement>>;
+export default DataTableRow;

package/dist/src/lists/DataTableRow/DataTableRowActions/DataTableRowActions.d.ts

@@ -0,0 +1,6 @@
+import type { Action } from '../../DataTable/types';
+declare type Props = {
+    actions: Action[];
+};
+declare const ActionsCell: ({ actions }: Props) => JSX.Element;
+export default ActionsCell;

package/dist/src/lists/DataTableRow/DataTableRowActions/index.d.ts

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

package/dist/src/lists/DataTableRow/index.d.ts

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

package/dist/src/lists/index.d.ts

@@ -0,0 +1,6 @@
+import DataTable from './DataTable';
+import DataTableRow from './DataTableRow';
+import DataTableCell from './DataTable/DataTableCell/DataTableCell';
+import DataTableEditableCell from './DataTableEditableCell';
+export { DataTable, DataTableRow, DataTableCell, DataTableEditableCell };
+export type { Column as DataTableColumn, CustomComponent as DataTableCustomComponent, SortDirection, Sort, Action } from './DataTable/types';

package/dist/src/media/Avatar/Avatar.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+declare type Props = {
+    children?: React.ReactNode;
+    size?: 'small' | 'medium' | 'large' | 'extra-large';
+    color?: string;
+    url?: string;
+    badge?: React.ReactNode;
+    alt?: string;
+    testId?: string;
+};
+declare const Avatar: React.FC<Props>;
+export default Avatar;

package/dist/src/media/Avatar/AvatarImage/AvatarImage.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+declare type Props = {
+    url?: string;
+    color?: string;
+    alt?: string;
+    onImageFallbackError: () => void;
+};
+declare const AvatarImage: React.FC<Props>;
+export default AvatarImage;

package/dist/src/media/Avatar/AvatarImage/index.d.ts

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

package/dist/src/media/Avatar/constants.d.ts

@@ -0,0 +1,4 @@
+export declare const PROFILE_IMAGES: {
+    backgroundColor: string;
+    avatarColor: string;
+}[];

package/dist/src/media/Avatar/index.d.ts

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

package/dist/src/media/Badge/Badge.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+declare type Props = {
+    children: React.ReactNode;
+    theme?: 'success' | 'danger' | 'warning' | 'info';
+    /** This will show a black tooltip when the user hover the button */
+    title?: string;
+    testId?: string;
+};
+declare const _default: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLDivElement>>;
+export default _default;

package/dist/src/media/Badge/index.d.ts

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

package/dist/src/media/Chip/Chip.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { Theme } from './types';
+declare type Props = {
+    /** It is the body text of the Chip */
+    children: React.ReactNode;
+    theme?: Theme;
+    /** This is used for overriding the default data-testid */
+    testId?: string;
+};
+declare const Chip: ({ children, theme, testId }: Props) => JSX.Element;
+export default Chip;

package/dist/src/media/Chip/constants.d.ts

@@ -0,0 +1,8 @@
+export declare const CHIP_THEME: {
+    MARKETING: "marketing";
+    SUCCESS: "success";
+    UPSELL: "upsell";
+    WARNING: "warning";
+    INFO: "info";
+    DANGER: "danger";
+};

package/dist/src/media/Chip/index.d.ts

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

package/dist/src/media/Chip/types.d.ts

@@ -0,0 +1 @@
+export declare type Theme = 'marketing' | 'success' | 'upsell' | 'warning' | 'info' | 'danger';

package/dist/src/media/Pill/Pill.d.ts

@@ -0,0 +1,10 @@
+import type { ReactNode } from 'react';
+import React from 'react';
+import { PillTheme } from './types';
+declare type Props = {
+    children: ReactNode;
+    theme?: PillTheme;
+    testId?: string;
+};
+declare const Pill: React.FC<Props>;
+export default Pill;

package/dist/src/media/Pill/constants.d.ts

@@ -0,0 +1,7 @@
+export declare const PILL_THEME: {
+    INFO: "info";
+    SUCCESS: "success";
+    DANGER: "danger";
+    WARNING: "warning";
+    DEFAULT: "default";
+};

package/dist/src/media/Pill/index.d.ts

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

package/dist/src/media/Pill/types.d.ts

@@ -0,0 +1 @@
+export declare type PillTheme = 'info' | 'success' | 'danger' | 'warning' | 'default';

package/dist/src/media/index.d.ts

@@ -0,0 +1,5 @@
+import Badge from './Badge';
+import Avatar from './Avatar';
+import Chip from './Chip';
+import Pill from './Pill';
+export { Badge, Avatar, Chip, Pill };

package/dist/src/overlay/Calendar/Calendar.d.ts

@@ -0,0 +1,24 @@
+import React, { MutableRefObject } from 'react';
+import '../../forms/DatePickerCalendar/date-picker-calendar.scss';
+import 'react-day-picker/lib/style.css';
+import { BlockedDays, WeekStart } from '../../utils/date';
+import { CalendarMode, CalendarPlacement } from './types';
+declare type Props = {
+    mode?: CalendarMode;
+    /** Note that if the calendar is not able to fit in the selected position,
+     *  it will override this selection and select the one that fits in the window. */
+    position?: CalendarPlacement;
+    weekStart?: WeekStart;
+    selected?: Date;
+    onSelect: (selected: Date) => void;
+    onClickOutside: () => void;
+    /** It disable some dates so the user can't click on them. Refer to this
+     * [doc](https://react-day-picker-v7.netlify.app/api/DayPicker#disabledDays) to see what
+     * values you can use. */
+    disabledDays?: BlockedDays;
+    anchorRef: MutableRefObject<HTMLElement | null>;
+    testId?: string;
+};
+/**Calendar overlay component*/
+declare const Calendar: React.FC<Props>;
+export default Calendar;

package/dist/src/overlay/Calendar/constants.d.ts

@@ -0,0 +1,8 @@
+export declare const CALENDAR_MODE: {
+    DAY: "day";
+    WEEK: "week";
+};
+export declare const CALENDAR_PLACEMENT: {
+    BOTTOM: "bottom";
+    TOP: "top";
+};

package/dist/src/overlay/Calendar/domain.d.ts

@@ -0,0 +1,7 @@
+import { CalendarPlacement } from './types';
+declare type Position = {
+    left: number;
+    top: number;
+};
+export declare const calculateCalendarPosition: (placement: CalendarPlacement, anchorPosition: DOMRect, calendarDimensions?: DOMRect | undefined) => Position;
+export {};

package/dist/src/overlay/Calendar/index.d.ts

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

package/dist/src/overlay/Calendar/types.d.ts

@@ -0,0 +1,2 @@
+export declare type CalendarPlacement = 'top' | 'bottom';
+export declare type CalendarMode = 'day' | 'week';

package/dist/src/overlay/KebabMenu/KebabMenu.d.ts

@@ -0,0 +1,6 @@
+import { MenuAction } from '../Menu/types';
+declare type Props = {
+    actions: MenuAction[];
+};
+declare const KebabMenu: ({ actions }: Props) => JSX.Element;
+export default KebabMenu;

package/dist/src/overlay/KebabMenu/index.d.ts

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

package/dist/src/overlay/Menu/Menu.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+declare type Props = {
+    children: React.ReactNode;
+};
+/**
+ * STATUS: IN DRAFT (Don't use this component yet)
+ * It is working to cover the ResourceTable actions menu but there are some functionalities pending such as `dividers` and `direction`.
+ */
+declare const Menu: React.FC<Props>;
+export default Menu;

package/dist/src/overlay/Menu/MenuButton.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+declare type ButtonTheme = 'default' | 'primary' | 'danger' | 'upsell' | 'marketing' | 'hollow' | 'link-primary' | 'link-danger' | 'link-upsell' | 'link-toolbar' | 'link-contrast' | 'link-icon';
+declare type Props = {
+    children: React.ReactNode;
+    theme?: ButtonTheme;
+};
+declare const MenuButton: React.FC<Props>;
+export default MenuButton;

package/dist/src/overlay/Menu/MenuContext.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export declare type MenuContextType = {
+    onToggleMenu: () => void;
+    isOpen: boolean;
+    triggerRef: any;
+};
+declare const MenuContext: React.Context<MenuContextType>;
+export declare const useMenuContext: () => MenuContextType;
+export default MenuContext;

package/dist/src/overlay/Menu/MenuItem.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+declare type Props = {
+    onClick: (e: React.MouseEvent | React.KeyboardEvent) => void;
+    children: React.ReactNode;
+};
+declare const MenuItem: React.FC<Props>;
+export default MenuItem;

package/dist/src/overlay/Menu/MenuList.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+declare type Props = {
+    children: React.ReactNode;
+};
+declare const MenuList: React.FC<Props>;
+export default MenuList;

package/dist/src/overlay/Menu/index.d.ts

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

package/dist/src/overlay/Menu/types.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export declare type MenuAction = {
+    action?: string;
+    label: React.ReactNode;
+    onAction: (e: React.MouseEvent | React.KeyboardEvent) => void;
+};

package/dist/src/overlay/Modal/Modal.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+declare type Props = {
+    children: React.ReactNode;
+    header?: React.ReactNode;
+    subHeader?: React.ReactNode;
+    onClose: () => void;
+    zIndex?: number;
+    /** This is the ID for the root element so when the modal is open it only allows iteracting with the modal when pressing tab. Can also use `Modal.setAppElement('#root')` in te main app once. */
+    rootElementId?: string;
+    width?: number;
+    height?: number;
+    maxWidth?: number;
+    shouldReturnFocusAfterClose?: boolean;
+    testId?: string;
+};
+declare const Modal: {
+    ({ children, header, subHeader, onClose, zIndex, rootElementId, width, height, maxWidth, shouldReturnFocusAfterClose, testId }: Props): JSX.Element;
+    setAppElement(rootElement: string | HTMLElement): void;
+};
+export default Modal;

package/dist/src/overlay/Modal/ModalBody/ModalBody.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+declare type Props = {
+    children: React.ReactNode;
+    testId?: string;
+};
+declare const ModalBody: ({ children, testId }: Props) => JSX.Element;
+export default ModalBody;

package/dist/src/overlay/Modal/ModalBody/index.d.ts

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

package/dist/src/overlay/Modal/ModalBody/useScrollShadow.d.ts

@@ -0,0 +1,7 @@
+import { RefType } from '../../../utils/types';
+declare type UseScrollShadow = {
+    ref: RefType<HTMLDivElement>;
+    showScrollShadow: boolean;
+};
+export declare const useScrollShadow: () => UseScrollShadow;
+export {};

package/dist/src/overlay/Modal/ModalFooter/ModalFooter.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+declare type Props = {
+    children?: React.ReactNode;
+    /** This will streamline the button creation and all the design pattern applied on buttons with a modal footer. If you want more flexibility to build the footer you can pass a `children` instead of using the `actions` prop. */
+    actions?: {
+        primary?: React.ReactElement;
+        secondary?: React.ReactElement;
+        tertiary?: React.ReactElement;
+    };
+    testId?: string;
+};
+declare const ModalFooter: ({ children, actions, testId }: Props) => JSX.Element;
+export default ModalFooter;

package/dist/src/overlay/Modal/ModalFooter/index.d.ts

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

package/dist/src/overlay/Modal/ModalHeader/ModalHeader.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+declare type Props = {
+    header?: React.ReactNode;
+    subHeader?: React.ReactNode;
+    onClose: () => void;
+};
+declare const ModalHeader: ({ header, subHeader, onClose }: Props) => JSX.Element;
+export default ModalHeader;

package/dist/src/overlay/Modal/ModalHeader/index.d.ts

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

package/dist/src/overlay/Modal/index.d.ts

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

package/dist/src/overlay/Tooltip/Tooltip.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+import { Placement, TooltipTheme } from './types';
+declare type Props = {
+    theme?: TooltipTheme;
+    /** It defines the overlay position on the screen. The component might not use the value defined in here as it will place the tooltip on the best place based on the anchor position on the screen. */
+    placement?: Placement;
+    /** It can be text or a JSX. */
+    overlay?: React.ReactNode;
+    /** Used on the `white` theme when there is a need of adding a header to the tooltip. */
+    header?: React.ReactNode;
+    /** If `true` it allow the overlay to keep open if the user hover it so, user can iteract with it (click on a link or copy the text). */
+    delayOnClose?: boolean;
+    /** If `true` it will add a delay on opening the overlay, if the user is not hovering the anchor it will not open the overlay. */
+    delayOnOpen?: boolean;
+    extraClass?: string;
+    onClose?: () => void;
+    onVisibleChange?: (isVisible: boolean) => void;
+    children: React.ReactElement;
+    testId?: string;
+};
+declare const _default: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLDivElement>>;
+export default _default;

package/dist/src/overlay/Tooltip/TooltipOverlay/TooltipOverlay.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import { Placement, TooltipTheme } from '../types';
+declare type Props = {
+    theme: TooltipTheme;
+    children: React.ReactNode;
+    anchorPosition: DOMRect;
+    placement: Placement;
+    header?: React.ReactNode;
+    onClose: () => void;
+    onFocusIn: () => void;
+    onFocusOut: () => void;
+    extraClass?: string;
+    testId?: string;
+};
+declare const TooltipOverlay: React.FC<Props>;
+export default TooltipOverlay;

package/dist/src/overlay/Tooltip/TooltipOverlay/domain.d.ts

@@ -0,0 +1,20 @@
+import { Placement, ActualPlacement } from '../types';
+declare type Position = {
+    width: number;
+    left: number;
+    top: number;
+};
+export declare const calculatePosition: (placement: Placement, anchorPosition: DOMRect, tooltipRectPosition?: DOMRect | undefined) => {
+    overlay?: Position | undefined;
+    arrow?: ArrowPosition | undefined;
+    actualPlacement: ActualPlacement;
+};
+export declare const updateMisalignedOverlay: (overlayPosition: Position, arrowPosition: ArrowPosition, tooltipRectPosition: DOMRect) => Position;
+export declare const calculateOverlayPosition: (actualPlacement: ActualPlacement, anchorPosition: DOMRect, tooltipWidth?: number) => Position;
+export declare const getActualPlacement: (placement: Placement, anchorPosition: DOMRect, tooltipHeight: number) => ActualPlacement;
+declare type ArrowPosition = {
+    left: number;
+    top: number;
+};
+export declare const calculateArrowPosition: (placement: Placement, tooltipPosition: Position, anchorPosition: DOMRect, tooltipRectPosition?: DOMRect | undefined) => ArrowPosition;
+export {};

package/dist/src/overlay/Tooltip/TooltipOverlay/index.d.ts

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