@artsy/palette 40.3.0-canary.1417.31465.0 → 40.3.0

package/dist/elements/Toasts/Toast.d.ts

@@ -1,33 +0,0 @@
-import React from "react";
-import { BoxProps } from "../Box";
-export declare type ToastVariant = keyof typeof TOAST_VARIANTS;
-export interface ToastProps extends BoxProps {
-    id: string;
-    action?: {
-        label: string;
-        onClick(): void;
-    };
-    description?: string;
-    message: string;
-    onClose?(id: string): void;
-    variant?: ToastVariant;
-}
-export declare const Toast: React.FC<React.PropsWithChildren<ToastProps>>;
-export declare const TOAST_VARIANTS: {
-    message: {
-        backgroundColor: string;
-        color: string;
-    };
-    alert: {
-        backgroundColor: string;
-        color: string;
-    };
-    success: {
-        backgroundColor: string;
-        color: string;
-    };
-    error: {
-        backgroundColor: string;
-        color: string;
-    };
-};

package/dist/elements/Toasts/Toast.story.d.ts

@@ -1,6 +0,0 @@
-import React from "react";
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const Default: () => React.JSX.Element;

package/dist/elements/Toasts/Toasts.d.ts

@@ -1,6 +0,0 @@
-import React from "react";
-import { BoxProps } from "../Box";
-export interface ToastsProps extends BoxProps {
-    limit?: number;
-}
-export declare const Toasts: React.FC<React.PropsWithChildren<ToastsProps>>;

package/dist/elements/Toasts/Toasts.story.d.ts

@@ -1,9 +0,0 @@
-import React from "react";
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const Demo: {
-    (): React.JSX.Element;
-    decorators: ((Story: any) => React.JSX.Element)[];
-};

package/dist/elements/Toasts/index.d.ts

@@ -1,3 +0,0 @@
-export * from "./Toast";
-export * from "./Toasts";
-export * from "./useToasts";

package/dist/elements/Toasts/useToasts.d.ts

@@ -1,32 +0,0 @@
-import React from "react";
-import { ToastProps } from "./Toast";
-interface Toast extends ToastProps {
-    id: string;
-    ttl: number;
-    onClose(id: string): void;
-}
-declare type Payload = Omit<Toast, "id" | "ttl" | "onClose"> & {
-    ttl?: number;
-    onClose?(id: string): void;
-};
-declare type State = {
-    toasts: Toast[];
-};
-export declare const ToastsContext: React.Context<{
-    state: State;
-    sendToast(toast: Payload): {
-        id: string;
-        handleClose: () => void;
-    };
-    retractToast(id: string): void;
-}>;
-export declare const ToastsProvider: React.FC<React.PropsWithChildren<unknown>>;
-export declare const useToasts: () => {
-    toasts: Toast[];
-    sendToast: (toast: Payload) => {
-        id: string;
-        handleClose: () => void;
-    };
-    retractToast: (id: string) => void;
-};
-export {};

package/dist/elements/Toggle/Toggle.d.ts

@@ -1,14 +0,0 @@
-import React from "react";
-import { BoxProps } from "../Box";
-export interface ToggleProps extends BoxProps, Omit<React.HTMLAttributes<HTMLDivElement>, "onSelect"> {
-    /** Disable toggle interactions */
-    disabled?: boolean;
-    /** Select the toggle on render */
-    selected?: boolean;
-    /** Used to force the toggle into the visual hover state */
-    hover?: boolean;
-    /** Callback when selected */
-    onSelect?: (selected: boolean) => void;
-}
-/** A toggle */
-export declare const Toggle: React.FC<React.PropsWithChildren<ToggleProps>>;

package/dist/elements/Toggle/Toggle.story.d.ts

@@ -1,7 +0,0 @@
-import React from "react";
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const Default: () => React.JSX.Element;
-export declare const Demo: () => React.JSX.Element;

package/dist/elements/Toggle/index.d.ts

@@ -1 +0,0 @@
-export * from "./Toggle";

package/dist/elements/Toggle/tokens.d.ts

@@ -1,13 +0,0 @@
-export declare const SWITCH_STATES: {
-    readonly selected: import("styled-components").RuleSet<object>;
-    readonly default: import("styled-components").RuleSet<object>;
-};
-export declare const TOGGLE_STATES: {
-    readonly default: import("styled-components").RuleSet<object>;
-    readonly selected: import("styled-components").RuleSet<object>;
-    readonly hover: import("styled-components").RuleSet<object>;
-    readonly disabled: {
-        readonly default: import("styled-components").RuleSet<object>;
-        readonly selected: import("styled-components").RuleSet<object>;
-    };
-};

package/dist/elements/Tooltip/Tooltip.d.ts

@@ -1,29 +0,0 @@
-import React from "react";
-import { Position } from "../../utils/usePosition";
-import { BoxProps } from "../Box";
-export declare const TOOLTIP_VARIANTS: {
-    defaultLight: {
-        backgroundColor: string;
-        color: string;
-    };
-    defaultDark: {
-        backgroundColor: string;
-        color: string;
-    };
-};
-export declare type TooltipVariant = keyof typeof TOOLTIP_VARIANTS;
-export interface TooltipProps extends BoxProps {
-    /** Anchor element to attach to tooltip */
-    children: React.ReactElement<any, string | React.JSXElementConstructor<any>>;
-    /** Content of tooltip */
-    content: React.ReactNode;
-    offset?: number;
-    placement?: Position;
-    pointer?: boolean;
-    variant?: TooltipVariant;
-    visible?: boolean;
-}
-/**
- * A tooltip
- */
-export declare const Tooltip: React.FC<React.PropsWithChildren<TooltipProps>>;

package/dist/elements/Tooltip/Tooltip.story.d.ts

@@ -1,31 +0,0 @@
-import React from "react";
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const Default: () => React.JSX.Element;
-export declare const _Clickable: {
-    (): React.JSX.Element;
-    story: {
-        parameters: {
-            chromatic: {
-                disable: boolean;
-            };
-        };
-    };
-};
-export declare const Placement: () => React.JSX.Element;
-export declare const IconExample: () => React.JSX.Element;
-export declare const ExternalControl: () => React.JSX.Element;
-export declare const PointerCentering: () => React.JSX.Element;
-export declare const StressTest: {
-    (): React.JSX.Element;
-    story: {
-        parameters: {
-            chromatic: {
-                disable: boolean;
-            };
-        };
-    };
-};
-export declare const PositioningBug: () => React.JSX.Element;

package/dist/elements/Tooltip/index.d.ts

@@ -1 +0,0 @@
-export * from "./Tooltip";

package/dist/elements/VisuallyHidden/VisuallyHidden.d.ts

@@ -1,27 +0,0 @@
-/// <reference types="react" />
-import { BoxProps } from "../Box";
-/**
- * Visually the hide element, but present in DOM so that it is accessible
- * for screen readers.
- * See:
- * https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/
- * https://webaim.org/techniques/css/invisiblecontent/
- * https://www.scottohara.me/blog/2017/04/14/inclusively-hidden.html
- */
-export declare const visuallyHiddenMixin: import("styled-components").RuleSet<object>;
-/** Reset to `inherit` all properties that cause visually-hidden */
-export declare const visuallyUnhiddenMixin: import("styled-components").RuleSet<object>;
-export interface VisuallyHiddenProps extends BoxProps {
-    show?: boolean;
-}
-/**
- * Visually the hide element, but present in DOM so that it is accessible
- * for screen readers.
- * See:
- * https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/
- * https://webaim.org/techniques/css/invisiblecontent/
- * https://www.scottohara.me/blog/2017/04/14/inclusively-hidden.html
- */
-export declare const VisuallyHidden: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof BoxProps> & BoxProps, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, VisuallyHiddenProps>> & string;

package/dist/elements/VisuallyHidden/index.d.ts

@@ -1 +0,0 @@
-export * from "./VisuallyHidden";

package/dist/elements/index.d.ts

@@ -1,70 +0,0 @@
-export * from "./AutocompleteInput";
-export * from "./Avatar";
-export * from "./Banner";
-export * from "./BaseTabs";
-export * from "./BorderBox";
-export * from "./BorderedRadio";
-export * from "./Box";
-export * from "./Breadcrumbs";
-export * from "./Button";
-export * from "./Cards";
-export * from "./Carousel";
-export * from "./CarouselBar";
-export * from "./Checkbox";
-export * from "./CleanTag";
-export * from "./Clickable";
-export * from "./Collapse";
-export * from "./CSSGrid";
-export * from "./Drawer";
-export * from "./Dropdown";
-export * from "./EntityHeader";
-export * from "./Expandable";
-export * from "./FilterSelect";
-export * from "./Flex";
-export * from "./FullBleed";
-export * from "./GridColumns";
-export * from "./HorizontalOverflow";
-export * from "./HTML";
-export * from "./Image";
-export * from "./Input";
-export * from "./Join";
-export * from "./Label";
-export * from "./LabeledInput";
-export * from "./Link";
-export * from "./Marquee";
-export * from "./Message";
-export * from "./Modal";
-export * from "./ModalDialog";
-export * from "./MultiSelect";
-export * from "./Pagination";
-export * from "./PasswordInput";
-export * from "./PhoneInput";
-export * from "./Pill";
-export * from "./Popover";
-export * from "./ProgressBar";
-export * from "./ProgressDots";
-export * from "./Radio";
-export * from "./RadioGroup";
-export * from "./Range";
-export * from "./ReadMore";
-export * from "./ResponsiveBox";
-export * from "./Select";
-export * from "./Separator";
-export * from "./Shelf";
-export * from "./ShowMore";
-export * from "./Skeleton";
-export * from "./Skip";
-export * from "./Spacer";
-export * from "./Spinner";
-export * from "./StackableBorderBox";
-export * from "./Stepper";
-export * from "./Stack";
-export * from "./Sup";
-export * from "./Swiper";
-export * from "./Tabs";
-export * from "./Text";
-export * from "./TextArea";
-export * from "./Toasts";
-export * from "./Toggle";
-export * from "./Tooltip";
-export * from "./VisuallyHidden";

package/dist/helpers/color.d.ts

@@ -1,8 +0,0 @@
-import { Color } from "../Theme";
-/**
- * A helper to easily access colors when not in a styled-components or
- * styled-systems context.
- *
- * @deprecated use component `color` or `borderColor` props, or `themeGet('colors.colorName')`
- */
-export declare const color: (colorKey: Color | "currentColor") => any;

package/dist/helpers/flattenChildren.d.ts

@@ -1,5 +0,0 @@
-import React from "react";
-/**
- * Convert a fragment or nested fragment into an array of elements
- */
-export declare const flattenChildren: <T extends React.ReactElement<any, string | React.JSXElementConstructor<any>>>(children: React.ReactNode) => T[];

package/dist/helpers/index.d.ts

@@ -1,7 +0,0 @@
-export * from "./isText";
-export * from "./color";
-export * from "./injectGlobalStyles";
-export * from "./media";
-export * from "./space";
-export * from "./visuallyDisableScrollbar";
-export * from "./transition";

package/dist/helpers/injectGlobalStyles.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-import { css } from "styled-components";
-/**
- * Injects globally relevant styles, including helper classes for our Typography.
- * Apps that use palette should mount this component at the root of their tree.
- */
-export declare function injectGlobalStyles<P extends object>(additionalStyles?: string | ReturnType<typeof css>): {
-    GlobalStyles: import("react").NamedExoticComponent<import("styled-components").ExecutionProps & P>;
-};

package/dist/helpers/isReactNative.d.ts

@@ -1,5 +0,0 @@
-/**
- * A helper used to detect if we're running in a React Native environment. Useful For
- * universal (shared) platform code.
- */
-export declare function isReactNative(): boolean;

package/dist/helpers/isText.d.ts

@@ -1,5 +0,0 @@
-import { ReactNode } from "react";
-/**
- * Check whether a `children` prop is text — e.g. just a string (or interpolated string)
- */
-export declare const isText: (children: ReactNode) => any;

package/dist/helpers/media.d.ts

@@ -1,21 +0,0 @@
-import { css } from "styled-components";
-import { breakpoints } from "../Theme";
-declare type Media = {
-    [S in keyof typeof breakpoints]: typeof css;
-};
-/**
- * A helper to construct media query strings for responsive style targeting.
- *
- * @example
- *
- * const Panel = styled.div`
- *   ${media.sm`
- *     width: 50%;
- *   `}
- *   ${media.lg`
- *     width: 100%;
- *   `}
- * `
- */
-export declare const media: Media;
-export {};

package/dist/helpers/space.d.ts

@@ -1,8 +0,0 @@
-import { SpacingUnit } from "../Theme";
-/**
- * A helper to easily access space values when not in a styled-components or
- * styled-systems context.
- *
- * @deprecated use component spacing props, or `themeGet('space.n')`
- */
-export declare const space: (spaceKey: SpacingUnit) => number;

package/dist/helpers/transition.d.ts

@@ -1,3 +0,0 @@
-/** Transition specifically for the StyledLabel and Container in multiple components.
- * It animates color, transform, padding, and font-size properties with 0.25s duration and custom cubic-bezier easing function. **/
-export declare const FORM_ELEMENT_TRANSITION = "0.25s cubic-bezier(0.64, 0.05, 0.36, 1)";

package/dist/helpers/visuallyDisableScrollbar.d.ts

@@ -1,4 +0,0 @@
-/**
- * Mixin that disables the scrollbar
- */
-export declare const visuallyDisableScrollbar: import("styled-components").RuleSet<object>;

package/dist/index.d.ts

@@ -1,4 +0,0 @@
-export * from "./elements";
-export * from "./helpers";
-export * from "./Theme";
-export * from "./utils";

package/dist/shared/RequiredField.d.ts

@@ -1,5 +0,0 @@
-import React from "react";
-import { TextProps } from "../elements";
-export declare const RequiredField: React.FC<React.PropsWithChildren<TextProps & {
-    disabled?: boolean;
-}>>;

package/dist/themes/Themes.story.d.ts

@@ -1,14 +0,0 @@
-import React from "react";
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const Theme: () => React.JSX.Element;
-export declare const Colors: () => React.JSX.Element;
-export declare const Spacing: () => React.JSX.Element;
-export declare const Grid: () => React.JSX.Element;
-export declare const Typography: () => React.JSX.Element;
-export declare const Buttons: () => React.JSX.Element;
-export declare const Components: () => React.JSX.Element;
-export declare const Inputs: () => React.JSX.Element;
-export declare const ContrastRatios: () => React.JSX.Element;

package/dist/themes/index.d.ts

@@ -1 +0,0 @@
-export * from "@artsy/palette-tokens";

package/dist/themes/types.d.ts

@@ -1 +0,0 @@
-export { Breakpoint, Color, SpacingUnit } from "@artsy/palette-tokens";

package/dist/utils/FocusLocking.story.d.ts

@@ -1,8 +0,0 @@
-import React from "react";
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const Default: () => React.JSX.Element;
-export declare const WithAutocompleteInput: () => React.JSX.Element;
-export declare const DisableToEnable: () => React.JSX.Element;

package/dist/utils/index.d.ts

@@ -1,12 +0,0 @@
-export * from "./useClickOutside";
-export * from "./useContainsFocus";
-export * from "./useDidMount";
-export * from "./useIsomorphicLayoutEffect";
-export * from "./useMutationObserver";
-export * from "./usePortal";
-export * from "./usePosition";
-export * from "./usePrevious";
-export * from "./useResizeObserver";
-export * from "./useSentinelVisibility";
-export * from "./useUpdateEffect";
-export * from "./useWidthOf";

package/dist/utils/remapValue.d.ts

@@ -1,15 +0,0 @@
-declare type Range = {
-    min: number;
-    max: number;
-};
-/**
- * Remaps a value from within one range to its corresponding value in another range.
- * E.g. convert between units or proportionally scale a value.
- *
- * @param n A numeric value
- * @param from Range the value comes from
- * @param to Range you wish to remap the value onto
- * @returns The remapped numeric value
- */
-export declare const remapValue: (n: number, from: Range, to: Range) => number;
-export {};

package/dist/utils/splitProps.d.ts

@@ -1,7 +0,0 @@
-import { styleFn } from "styled-system";
-/**
- * Allows you to pass in a styled-system function and split out
- * in a typesafe manner, the props that match and do not match
- * the styled function.
- */
-export declare const splitProps: <T>(mixin: styleFn) => <U>(props: U) => [T, Omit<U, keyof T>];

package/dist/utils/useClickOutside.d.ts

@@ -1,12 +0,0 @@
-/// <reference types="react" />
-export interface UseClickOutside {
-    ref: React.RefObject<HTMLElement>;
-    when: boolean;
-    type?: keyof DocumentEventMap;
-    onClickOutside: (event: Event) => void;
-}
-/**
- * Use click outside is a hook that will listen for clicks outside of a ref,
- * and when true, execute a callback.
- */
-export declare const useClickOutside: ({ ref, type, when, onClickOutside, }: UseClickOutside) => void;

package/dist/utils/useContainsFocus.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="react" />
-export declare const useContainsFocus: ({ onChange, }: {
-    onChange(focused: boolean): void;
-}) => {
-    ref: import("react").RefObject<HTMLElement>;
-};

package/dist/utils/useDidMount.d.ts

@@ -1,4 +0,0 @@
-export declare const useDidMount: ({ defaultMounted, clearCallStack, }?: {
-    defaultMounted?: boolean | undefined;
-    clearCallStack?: boolean | undefined;
-}) => boolean | undefined;

package/dist/utils/useInterval.d.ts

@@ -1,2 +0,0 @@
-/** useInterval */
-export declare function useInterval(callback: any, delay: any): void;

package/dist/utils/useIsomorphicLayoutEffect.d.ts

@@ -1,5 +0,0 @@
-import { useEffect } from "react";
-/**
- * Silences the "useLayoutEffect does nothing on the server" warning
- */
-export declare const useIsomorphicLayoutEffect: typeof useEffect;

package/dist/utils/useLatest.d.ts

@@ -1,2 +0,0 @@
-/// <reference types="react" />
-export declare const useLatest: <T extends unknown>(current: T) => import("react").MutableRefObject<T>;

package/dist/utils/useMutationObserver.d.ts

@@ -1,15 +0,0 @@
-import type { MutableRefObject } from "react";
-declare type UseMutationObserver = {
-    active?: boolean;
-    onMutate: MutationCallback;
-    options?: MutationObserverInit;
-} & ({
-    ref: MutableRefObject<HTMLElement | null>;
-} | {
-    element?: HTMLElement | null;
-});
-/**
- * Accepts a ref and calls the `onMutate` callback when mutations are observed.
- */
-export declare const useMutationObserver: ({ active, onMutate, options, ...rest }: UseMutationObserver) => void;
-export {};

package/dist/utils/usePortal.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-export declare const usePortal: () => {
-    createPortal: (children: React.ReactNode) => React.ReactPortal | null;
-};

package/dist/utils/usePosition.d.ts

@@ -1,68 +0,0 @@
-/// <reference types="react" />
-export declare const POSITION: {
-    readonly "top-start": "top-start";
-    readonly top: "top";
-    readonly "top-end": "top-end";
-    readonly "bottom-start": "bottom-start";
-    readonly bottom: "bottom";
-    readonly "bottom-end": "bottom-end";
-    readonly "left-start": "left-start";
-    readonly left: "left";
-    readonly "left-end": "left-end";
-    readonly "right-start": "right-start";
-    readonly right: "right";
-    readonly "right-end": "right-end";
-};
-export declare type Position = keyof typeof POSITION;
-interface TargetPosition {
-    x: number;
-    y: number;
-}
-/**
- * Will position the floating element (tooltip) relative to the anchor element,
- * using `position: fixed` and in such a way that it shouldn't ever appear
- * partially offscreen and will move correctly when the parent is scrolled.
- */
-export declare const usePosition: ({ key, position, offset, active, flip, clamp, }: {
-    /** Listen to changes on this value */
-    key?: string | number | boolean | undefined;
-    /** Placement relative to anchor */
-    position: Position;
-    /** Distance from anchor (default: `0`) */
-    offset?: number | undefined;
-    /** Optionally disable for performance (default: `true`) */
-    active?: boolean | undefined;
-    /** Optionally disable flipping (default: `true`) */
-    flip?: boolean | undefined;
-    /** Optionally disable clamping (default: `true`) */
-    clamp?: boolean | undefined;
-}) => {
-    tooltipRef: import("react").MutableRefObject<HTMLElement | null>;
-    anchorRef: import("react").MutableRefObject<HTMLElement | null>;
-    state: {
-        isFlipped: boolean;
-    };
-};
-interface PlaceTooltip {
-    anchor: HTMLElement;
-    tooltip: HTMLElement;
-    position: Position;
-    offset?: number;
-    boundaryRect?: DOMRect;
-    flip?: boolean;
-    clamp?: boolean;
-}
-export declare const placeTooltip: ({ anchor, tooltip, position, offset, boundaryRect, flip, clamp, }: PlaceTooltip) => {
-    isFlipped: boolean;
-};
-export declare const getPosition: (elementRect: Pick<DOMRect, "width" | "height" | "top" | "right" | "bottom" | "left">, tooltipRect: Pick<DOMRect, "width" | "height">, position: Position) => TargetPosition;
-export declare const translateWithOffset: (targetPosition: TargetPosition, position: Position, offset: number) => string;
-export declare const getDocumentBoundingRect: () => DOMRect;
-interface ShouldFlip {
-    targetPosition: TargetPosition;
-    position: Position;
-    boundaryRect: Pick<DOMRect, "top" | "right" | "bottom" | "left">;
-    tooltipRect: Pick<DOMRect, "width" | "height">;
-}
-export declare const shouldFlip: ({ targetPosition, position, boundaryRect, tooltipRect, }: ShouldFlip) => boolean;
-export {};

package/dist/utils/usePrevious.d.ts

@@ -1,5 +0,0 @@
-/**
- * usePrevious
- * Stores state or props in a ref to compare against new props or state
- */
-export declare function usePrevious<T>(value: T): T;

package/dist/utils/useResizeObserver.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-declare type UseResizeObserver<T extends HTMLElement> = {
-    active?: boolean;
-    target: React.RefObject<T> | T | null;
-    onResize: UseResizeObserverCallback;
-};
-export declare const useResizeObserver: <T extends HTMLElement>({ active, target, onResize, }: UseResizeObserver<T>) => void;
-declare type UseResizeObserverCallback = (entry: ResizeObserverEntry, observer: ResizeObserver) => unknown;
-export {};

package/dist/utils/useSentinelVisibility.d.ts

@@ -1,8 +0,0 @@
-import React from "react";
-/**
- * Used to track if the returned sentinel is in the viewport or not
- */
-export declare const useSentinelVisibility: () => {
-    isSentinelVisible: boolean;
-    sentinel: React.JSX.Element;
-};