@workday/canvas-kit-react 6.8.9 → 6.9.0-next.2

package/ts3.5/dist/commonjs/common/lib/theming/types.d.ts

@@ -1,255 +0,0 @@
-import { CanvasBreakpoints, BreakpointFnParam } from './breakpoints';
-/**
- * A single palette within a Canvas theme
- */
-export declare type CanvasThemePalette = {
-    lightest: string;
-    light: string;
-    main: string;
-    dark: string;
-    darkest: string;
-    contrast: string;
-};
-declare type CanvasThemeCommonPalette = {
-    focusOutline: string;
-};
-/**
- * Direction of page content for internationalization
- */
-export declare enum ContentDirection {
-    LTR = "ltr",
-    RTL = "rtl"
-}
-/**
- * The format of a Canvas theme for components that support it.
- */
-export interface CanvasTheme {
-    palette: {
-        common: CanvasThemeCommonPalette;
-        primary: CanvasThemePalette;
-        error: CanvasThemePalette;
-        alert: CanvasThemePalette;
-        success: CanvasThemePalette;
-        neutral: CanvasThemePalette;
-    };
-    /**
-     * ### Theme Breakpoints
-     *
-     * Breakpoints are used by media queries to conditionally apply or modify styles based on the viewport width.
-     * This allows the UI to be responsive to various screen sizes.
-     *
-     * This breakpoints object contains `values` and several helper functions: `up`, `down`, `between`, and `only`.
-     * You can find more detailed information by inspecting individual values and functions.
-     */
-    breakpoints: {
-        /**
-         * ### Breakpoint Values
-         *
-         * This object provides five breakpoint values
-         * that correspond to the min-widths of our standard screen sizes.
-         *
-         * - `zero`: 0
-         * - `s`: 320
-         * - `m`: 768
-         * - `l`: 1024
-         * - `xl`: 1440
-         *
-         * And these are our standard screen size ranges:
-         *
-         * - `small` (320px - 767px) Used for mobile-sized screens
-         * - `medium` (768px - 1023px) Used for tablet-sized screens
-         * - `large` - (1024px - 1439px) Used for laptop and small desktop screens
-         * - `extra-large` (≥1440px) Used for very large screens
-         *
-         * Note: Some applications may only require a subset of screen sizes and not use all breakpoints.
-         *
-         */
-        values: CanvasBreakpoints;
-        /**
-         * ### Up
-         *
-         * _Returns a media query above the `min-width` for the range of a given breakpoint_
-         *
-         * Given a `start` breakpoint key ("zero", "s", "m", "l", "xl"),
-         * this function returns a media query (string) using a `min-width`.
-         *
-         * @example
-         * ```ts
-         * import { useTheme } from '@workday/canvas-kit-react/common';
-         * import { space } from '@workday/canvas-kit-react/tokens';
-         *
-         * const theme = useTheme();
-         * const { up } = theme.canvas.breakpoints;
-         * const mediaQuery = up('l'); // Returns '@media (min-width: 1024px)'
-         * const styles = {
-         *   [mediaQuery]: {
-         *     padding: space.m,
-         *   }
-         * };
-         * ```
-         */
-        up: (key: BreakpointFnParam) => string;
-        /**
-         * ### Down
-         *
-         * _Returns a media query below the `max-width` for the range of a given breakpoint_
-         *
-         * Given an `end` breakpoint key ("zero", "s", "m", "l", "xl"),
-         * this function returns a media query (string) using a `max-width`.
-         *
-         * Note: This function subtracts `0.5px` from the next breakpoint value to prevent collisions.
-         * For example, `breakpoints.values.s`, has a `min-width` of `320px`, and the `max-width` is `767.5px`).
-         *
-         * If the `xl` breakpoint is provided, this function returns a media query with only a `min-width` of `0`,
-         * as seen in the second example below.
-         *
-         * @example
-         * ```ts
-         * import { useTheme } from '@workday/canvas-kit-react/common';
-         * import { space } from '@workday/canvas-kit-react/tokens';
-         *
-         * const theme = useTheme();
-         * const { down } = theme.canvas.breakpoints;
-         * const mediaQuery = down('m'); // Returns '@media (max-width: 1023.5px)'
-         * const styles = {
-         *   [mediaQuery]: {
-         *     padding: space.m,
-         *   }
-         * };
-         * ```
-         *
-         * This example uses the `xl` breakpoint and only adds a `min-width` of `0` to the media query.
-         * @example
-         * ```ts
-         * import { useTheme } from '@workday/canvas-kit-react/common';
-         * import { space } from '@workday/canvas-kit-react/tokens';
-         *
-         * const theme = useTheme();
-         * const { down } = theme.canvas.breakpoints;
-         * const mediaQuery = down('xl'); // Returns '@media (min-width: 0)'
-         * const styles = {
-         *   [mediaQuery]: {
-         *     padding: space.m,
-         *   }
-         * };
-         * ```
-         */
-        down: (key: BreakpointFnParam) => string;
-        /**
-         * ### Between
-         *
-         * _Returns a media query between two given breakpoints_
-         *
-         * Given `start` and `end` breakpoint keys ("zero", "s", "m", "l", "xl"),
-         * this function returns a media query (string) using a min-width and max-width.
-         *
-         * Note: This function subtracts `0.5px` from the next breakpoint value to prevent collisions.
-         * For example, `breakpoints.values.s`, has a `min-width` of `320px`, and the `max-width` is `767.5px`).
-         *
-         * If the `xl` breakpoint is provided, this function returns a media query with only a `min-width`,
-         * as seen in the second example below.
-         *
-         * @example
-         * ```ts
-         * import { useTheme } from '@workday/canvas-kit-react/common';
-         * import { space } from '@workday/canvas-kit-react/tokens';
-         *
-         * const theme = useTheme();
-         * const { between } = theme.canvas.breakpoints;
-         * // Returns '@media (min-width: 320px) and (max-width: 1023.5px)'
-         * const mediaQuery = between('s', 'm');
-         * const styles = {
-         *   [mediaQuery]: {
-         *     padding: space.s,
-         *   }
-         * };
-         * ```
-         *
-         * This example uses `xl` as the `end` breakpoint and only adds a min-width to the media query.
-         * @example
-         * ```ts
-         * import { useTheme } from '@workday/canvas-kit-react/common';
-         * import { space } from '@workday/canvas-kit-react/tokens';
-         *
-         * const theme = useTheme();
-         * const { between } = theme.canvas.breakpoints;
-         * const mediaQuery = between('m', 'xl'); // Returns '@media (min-width: 768px)'
-         * const styles = {
-         *   [mediaQuery]: {
-         *     padding: space.s,
-         *   }
-         * };
-         * ```
-         */
-        between: (start: BreakpointFnParam, end: BreakpointFnParam) => string;
-        /**
-         * ### Only
-         *
-         * _Returns a media query with a `min-width` and `max-width` for a given breakpoint_
-         *
-         * Given a breakpoint key ("zero", "s", "m", "l", "xl"),
-         * this function returns a media query (string) using a `min-width` and `max-width`.
-         *
-         * Note: This function subtracts `0.5px` from the next breakpoint value to prevent collisions.
-         * For example, `breakpoints.values.s`, has a `min-width` of `320px`, and the `max-width` is `767.5px`).
-         *
-         * If the `xl` breakpoint is provided, this function returns a media query with only a `min-width` of `1440px`,
-         * as seen in the second example below.
-         *
-         * @example
-         * ```ts
-         * import { useTheme } from '@workday/canvas-kit-react/common';
-         * import { space } from '@workday/canvas-kit-react/tokens';
-         *
-         * const theme = useTheme();
-         * const { only } = theme.canvas.breakpoints;
-         * const mediaQuery = only('s'); // Returns '@media (min-width: 320px) and (max-width: 767.5px)'
-         * const styles = {
-         *   [mediaQuery]: {
-         *     padding: space.s,
-         *   }
-         * };
-         * ```
-         *
-         * This example uses the `xl` breakpoint and only adds a `min-width` of `1440px` to the media query.
-         * @example
-         * ```ts
-         * import { useTheme } from '@workday/canvas-kit-react/common';
-         * import { space } from '@workday/canvas-kit-react/tokens';
-         *
-         * const theme = useTheme();
-         * const { only } = theme.canvas.breakpoints;
-         * const mediaQuery = only('xl'); // Returns '@media (min-width: 1440px)'
-         * const styles = {
-         *   [mediaQuery]: {
-         *     padding: space.s,
-         *   }
-         * };
-         * ```
-         */
-        only: (key: BreakpointFnParam) => string;
-    };
-    direction: ContentDirection;
-}
-/**
- * Indicates a component is themeable with a CanvasTheme
- */
-export interface Themeable {
-    theme?: EmotionCanvasTheme;
-}
-/**
- * For custom themes that do not overwrite every default.
- */
-declare type RecursivePartial<T> = {
-    [P in keyof T]?: RecursivePartial<T[P]>;
-};
-export declare type PartialCanvasTheme = RecursivePartial<CanvasTheme>;
-export declare type PartialCanvasThemePalette = RecursivePartial<CanvasThemePalette>;
-export declare type PartialEmotionCanvasTheme = {
-    canvas?: PartialCanvasTheme;
-};
-export declare type EmotionCanvasTheme = {
-    canvas: CanvasTheme;
-};
-export {};
-//# sourceMappingURL=types.d.ts.map

package/ts3.5/dist/commonjs/common/lib/theming/useIsRTL.d.ts

@@ -1,9 +0,0 @@
-import { PartialEmotionCanvasTheme } from './types';
-/**
- * This is a small hook to support right-to-left logic.
- * It returns a boolean
- * @example
- * const isRTL = useIsRTL();
- */
-export declare const useIsRTL: (partialTheme?: PartialEmotionCanvasTheme | undefined) => boolean;
-//# sourceMappingURL=useIsRTL.d.ts.map

package/ts3.5/dist/commonjs/common/lib/theming/useTheme.d.ts

@@ -1,21 +0,0 @@
-import { EmotionCanvasTheme, PartialEmotionCanvasTheme } from './index';
-/**
- * Hook function to get the correct theme object.
- * @param {Object=} theme - The theme object returned from the emotion ThemeContext
- * (through ThemeProvider). The Canvas Kit theme is namespaced within this variable under the `canvas` key.
- *
- * NOTE: If you are using a class component, you MUST pass the theme.
- * If not passed, the function will try to pull the theme from ThemeContext.
- * If that does not work, it will try to retrieve it from the window object.
- * As a last resort, it will return the default Canvas theme.
- *
- * The resulting theme will be merged with the default Canvas theme
- * (using memoized createCanvasTheme()) to establish any missing fields that have
- * not been defined by the consumer's theme object.
- *
- * Providing the default theme here is currently a work around for when no
- * ThemeProvider or context exists.
- * Tracked on https://github.com/emotion-js/emotion/issues/1193.
- */
-export declare function useTheme(theme?: PartialEmotionCanvasTheme): EmotionCanvasTheme;
-//# sourceMappingURL=useTheme.d.ts.map

package/ts3.5/dist/commonjs/common/lib/types.d.ts

@@ -1,28 +0,0 @@
-/**
- * The growth behavior of a component.
- */
-export interface GrowthBehavior {
-    /**
-     * True if the component should grow to its container's width. False otherwise.
-     */
-    grow?: boolean;
-}
-/**
- * TransformOrigin behavior for things like popups and tooltips
- */
-export interface TransformOrigin {
-    horizontal: 'left' | 'center' | 'right';
-    vertical: 'top' | 'center' | 'bottom';
-}
-/**
- * Error types
- */
-export declare enum ErrorType {
-    Error = 0,
-    Alert = 1
-}
-/**
- * Type to Pick props from an interface, making some required and leaving others as is
- */
-export declare type PickRequired<T, Req extends keyof T, AsIs extends keyof T> = Required<Pick<T, Req>> & Pick<T, AsIs>;
-//# sourceMappingURL=types.d.ts.map

package/ts3.5/dist/commonjs/common/lib/utils/StaticStates.d.ts

@@ -1,8 +0,0 @@
-import * as React from 'react';
-import { PartialEmotionCanvasTheme } from '@workday/canvas-kit-react/common';
-import { CSSProperties } from '@workday/canvas-kit-react/tokens';
-export declare const convertToStaticStates: (obj?: CSSProperties | undefined) => CSSProperties | undefined;
-export declare const StaticStates: React.FC<{
-    theme?: PartialEmotionCanvasTheme;
-} & React.HTMLAttributes<HTMLElement>>;
-//# sourceMappingURL=StaticStates.d.ts.map

package/ts3.5/dist/commonjs/common/lib/utils/assert.d.ts

@@ -1,3 +0,0 @@
-export declare function assert(value: boolean, message?: string): asserts value;
-export declare function assert<T>(value: T | null | undefined, message?: string): asserts value is T;
-//# sourceMappingURL=assert.d.ts.map

package/ts3.5/dist/commonjs/common/lib/utils/changeFocus.d.ts

@@ -1,6 +0,0 @@
-/**
- * Programmatically change focus in a way that causes a focus ring around the new element.
- * @param element Element that should be focused
- */
-export declare const changeFocus: (element: unknown) => void;
-//# sourceMappingURL=changeFocus.d.ts.map

package/ts3.5/dist/commonjs/common/lib/utils/colorUtils.d.ts

@@ -1,11 +0,0 @@
-export declare const expandHex: (hex: string) => string;
-/**
- *
- * Chooses foreground color with accesible contrast against background. If contrast ratio
- * is greater than 4.5:1, chooses provided light or dark color (favoring light color). If neither
- * have a high enough contrast ratio, picks the first color of the following that meets 4.5:1 or higher:
- * [frenchVanilla100, blackPepper300, blackPepper400, blackPepper500, blackPepper600]
- * (https://www.w3.org/TR/WCAG20-TECHS/G18.html)
- */
-export declare const pickForegroundColor: (background: string, darkColor?: string | undefined, lightColor?: string | undefined) => string | undefined;
-//# sourceMappingURL=colorUtils.d.ts.map

package/ts3.5/dist/commonjs/common/lib/utils/components.d.ts

@@ -1,278 +0,0 @@
-import React from 'react';
-import { Model } from './models';
-/**
- * Adds the `as` to the style interface to support `as` in styled components
- * This type and usage should be removed with Emotion 11
- */
-export declare type StyledType = {
-    as?: React.ElementType;
-};
-/**
- * Extract a Ref from T if it exists
- * This will return the following:
- *
- * - `undefined` => `never`
- * - `'button'` => `React.Ref<HTMLButtonElement>`
- * - `ElementComponent<'button', ButtonProps>` => `React.Ref<HTMLButtonElement>`
- */
-declare type ExtractRef<T> = T extends undefined ? never : React.Ref<T extends keyof ElementTagNameMap ? ElementTagNameMap[T] : T extends ElementComponent<infer U, any> ? U extends keyof ElementTagNameMap ? ElementTagNameMap[U] : U : T>;
-/**
- * Generic component props with "as" prop
- * @template P Additional props
- * @template ElementType React component or string element
- */
-export declare type PropsWithAs<P, ElementType extends React.ElementType> = P & Pick<React.ComponentProps<ElementType>, Exclude<keyof React.ComponentProps<ElementType>, 'as' | 'state' | keyof P>> & {
-    /**
-     * Optional ref. If the component represents an element, this ref will be a reference to the
-     * real DOM element of the component. If `as` is set to an element, it will be that element.
-     * If `as` is a component, the reference will be to that component (or element if the component
-     * uses `React.forwardRef`).
-     */
-    ref?: ExtractRef<ElementType>;
-};
-/**
- * Extracts only the HTML attribute interface from `JSX.IntrinsicElements[E]`. This effectively removes `ref` and `key`
- * without using `Omit` which makes the returned type more difficult to understand.
- *
- * For example:
- * JSX.IntrinsicElements['button'] // React.ClassAttributes<HTMLButtonElement> & React.ButtonHTMLAttributes<HTMLButtonElement>
- * ExtractHTMLAttributes<JSX.IntrinsicElements['button']> // React.HTMLButtonAttributes<HTMLButtonElement>
- */
-declare type ExtractHTMLAttributes<T extends React.DetailedHTMLProps<any, any>> = T extends React.DetailedHTMLProps<infer P, any> ? P : T;
-/**
- * Extract props from any component that was created using `createComponent`. It will return the
- * HTML attribute interface of the default element used with `createComponent`. If you use `as`, the
- * HTML attribute interface can change, so you can use an override to the element you wish to use.
- * You can also disable the HTML attribute by passing `never`:
- *
- * - `ExtractProps<typeof Card>`: `CardProps & React.HTMLAttributes<HTMLDivElement>`
- * - `ExtractProps<typeof Card, 'aside'>`: `CardProps & React.HTMLAttributes<HTMLElement>`
- * - `ExtractProps<typeof Card, never>`: `CardProps`
- *
- * @template TComponent The component you wish to extract props from. Needs 'typeof` in front:
- * `typeof Card`
- * @template TElement An optional override of the element that will be used. Define this if you use
- * an `as` on the component
- *
- * @example
- * interface MyProps extends ExtractProps<typeof Card.Body> {}
- *
- * ExtractProps<typeof Card>; // CardProps & React.HTMLAttributes<HTMLDivElement>
- * ExtractProps<typeof Card, 'aside'>; // CardProps & React.HTMLAttributes<HTMLElement>
- * ExtractProps<typeof Card, never>; // CardProps
- */
-export declare type ExtractProps<TComponent, TElement extends keyof JSX.IntrinsicElements | ElementComponent<any, any> | Component<any> | React.ComponentType<any> | undefined | never = undefined> = TComponent extends ElementComponent<infer E, infer P> ? [TElement] extends [never] ? P : TElement extends undefined ? E extends keyof JSX.IntrinsicElements ? P & ExtractHTMLAttributes<JSX.IntrinsicElements[E]> : P & ExtractPropsFromComponent<E> : TElement extends keyof JSX.IntrinsicElements ? P & ExtractHTMLAttributes<JSX.IntrinsicElements[TElement]> : P & ExtractPropsFromComponent<TElement> : ExtractPropsFromComponent<TComponent>;
-declare type ExtractPropsFromComponent<TComponent> = TComponent extends ElementComponent<infer E, infer P> ? E extends keyof JSX.IntrinsicElements ? P & ExtractHTMLAttributes<JSX.IntrinsicElements[E]> : P : TComponent extends Component<infer P> ? P : TComponent extends React.ComponentType<infer P> ? P : {};
-/**
- * Component type that allows for `as` to change the element or component type.
- * Passing `as` will correctly change the allowed interface of the JSX element
- */
-export declare type ElementComponent<T extends React.ElementType, P> = {
-    __type: 'ElementComponent';
-    <ElementType extends React.ElementType>(props: PropsWithAs<P, ElementType> & {
-        /**
-         * Optional override of the default element used by the component. Any valid tag or Component.
-         * If you provided a Component, this component should forward the ref using `React.forwardRef`
-         * and spread extra props to a root element.
-         */
-        as: ElementType;
-    }): JSX.Element;
-    (props: PropsWithAs<P, T>): JSX.Element;
-    displayName?: string;
-    as<E extends React.ElementType>(as: E): ElementComponent<E, P>;
-};
-export declare type Component<P> = {
-    __type: 'Component';
-    (props: P): JSX.Element;
-    displayName?: string;
-};
-interface RefForwardingComponent<T, P = {}> {
-    (props: React.PropsWithChildren<P> & {
-        as?: React.ReactElement<any>;
-    }, 
-    /**
-     * A ref to be forwarded. Pass it along to the root element. If no element was passed, this
-     * will result in a `never`
-     */
-    ref: ExtractRef<T>, 
-    /**
-     * An element - either a JSX element or a `ElementComponent`. This should be passed as an `as`
-     * to a root element or be the root element. If no element was passed, this will result in a
-     * `never`
-     */
-    Element: T extends undefined ? never : T): React.ReactElement | null;
-}
-/**
- * Factory function that creates components to be exported. It enforces React ref forwarding, `as`
- * prop, display name, and sub-components, and handles proper typing without much boiler plate. The
- * return type is `Component<element, Props>` which looks like `Component<'div', Props>` which is a
- * clean interface that tells you the default element that is used.
- */
-export declare const createComponent: <E extends "symbol" | "object" | "s" | "big" | "link" | "small" | "sub" | "sup" | "circle" | "stop" | "path" | "style" | "map" | "filter" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "main" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "samp" | "slot" | "script" | "section" | "select" | "source" | "span" | "strong" | "summary" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | ElementComponent<any, any> | React.ComponentClass<{}, any> | React.FunctionComponent<{}> | undefined = undefined>(as?: E | undefined) => <P, SubComponents = {}>({ displayName, Component, subComponents, }: {
-    /** This is what the component will look like in the React dev tools. Encouraged to more easily
-     * understand the component tree */
-    displayName?: string | undefined;
-    /** The component function. The function looks like:
-     * @example
-     * Component: ({children}, ref, Element) {
-     *   // `Element` is what's passed to the `as` of your component. If no `as` was defined, it
-     *   // will be the default element. It will be 'div' or even a another Component!
-     *   return (
-     *     <Element ref={ref}>{children}</Element>
-     *   )
-     * }
-     *
-     * @example
-     * Component: ({children}, ref, Element) {
-     *   // `Element` can be passed via `as` to the next component
-     *   return (
-     *     <AnotherElement as={Element} ref={ref}>{children}</AnotherElement>
-     *   )
-     * }
-     */
-    Component: RefForwardingComponent<E, P>;
-    /**
-     * Used in container components
-     */
-    subComponents?: SubComponents | undefined;
-}) => (E extends undefined ? Component<P> : ElementComponent<E extends undefined ? React.FC<{}> : E, P>) & SubComponents;
-/**
- * Factory function to crate a behavior hook with correct generic types. It takes a function that
- * return props and returns a function that will also require `elemProps` and will call `mergeProps` for
- * you. If your hook makes use of the `ref`, you will have to also use `useLocalRef` to properly fork
- * the ref.
- *
- * @example
- * const useMyHook = createHook((model: MyModel, ref) => {
- *   const { localRef, elementRef } = useLocalRef(ref);
- *   // do whatever with `localRef` which is a RefObject
- *
- *   return {
- *     onClick: model.events.doSomething,
- *     ref: elementRef,
- *   };
- * });
- *
- * // Equivalent to:
- * const useMyHook = <P extends {}, R>(
- *   model: MyModel,
- *   elemProps: P,
- *   ref: React.Ref<R>
- * ) => {
- *   const { localRef, elementRef } = useLocalRef(ref);
- *   // do whatever with `localRef` which is a RefObject
- *
- *   return mergeProps({
- *     onClick: model.events.doSomething,
- *     ref: elementRef,
- *   }, elemProps);
- * };
- *
- * @param fn Function that takes a model and optional ref and returns props
- */
-export declare const createHook: <M extends Model<any, any>, PO extends {}, PI extends {}>(fn: (model: M, ref?: ((instance: any) => void) | React.RefObject<any> | null | undefined, elemProps?: PI | undefined) => PO) => <P extends {}, R>(model: M, elemProps?: P | undefined, ref?: ((instance: R | null) => void) | React.RefObject<R> | null | undefined) => PO & P & (R extends HTMLOrSVGElement ? {
-    ref: React.Ref<R>;
-} : {});
-export declare const subModelHook: <M extends Model<any, any>, SM extends Model<any, any>, O extends {}>(fn: (model: M) => SM, hook: <P extends {}, R>(model: SM, elemProps?: P | undefined, ref?: ((instance: R | null) => void) | React.RefObject<R> | null | undefined) => O & P & (R extends HTMLOrSVGElement ? {
-    ref: React.Ref<R>;
-} : {})) => <P_1 extends {}, R_1>(model: M, elemProps?: P_1 | undefined, ref?: ((instance: R_1 | null) => void) | React.RefObject<R_1> | null | undefined) => O & P_1 & (R_1 extends HTMLOrSVGElement ? {
-    ref: React.Ref<R_1>;
-} : {});
-export declare type BehaviorHook<M extends Model<any, any>, O extends {}> = {
-    bivarianceHack<P extends {}, R>(model: M, elemProps?: P, ref?: React.Ref<R>): O & P & (R extends HTMLOrSVGElement ? {
-        ref: React.Ref<R>;
-    } : {});
-}['bivarianceHack'];
-/**
- * This function will create a new forked ref out of two input Refs. This is useful for components
- * that use `React.forwardRef`, but also need internal access to a Ref.
- *
- * This function is inspired by https://www.npmjs.com/package/@rooks/use-fork-ref
- *
- * @example
- * React.forwardRef((props, ref) => {
- *   // Returns a RefObject with a `current` property
- *   const myRef = React.useRef(ref)
- *
- *   // Returns a forked Ref function to pass to an element.
- *   // This forked ref will update both `myRef` and `ref` when React updates the element ref
- *   const elementRef = useForkRef(ref, myRef)
- *
- *   useEffect(() => {
- *     console.log(myRef.current) // `current` is the DOM instance
- *     // `ref` might be null since it depends on if someone passed a `ref` to your component
- *     // `elementRef` is a function and we cannot get a current value out of it
- *   })
- *
- *   return <div ref={elementRef}/>
- * })
- */
-export declare function useForkRef<T>(ref1?: React.Ref<T>, ref2?: React.Ref<T>): React.RefCallback<T>;
-/**
- * This functions handles the common use case where a component needs a local ref and needs to
- * forward a ref to an element.
- * @param ref The React ref passed from the `createComponent` factory function
- *
- * @example
- * const MyComponent = ({children, ...elemProps}: MyProps, ref, Element) => {
- *   const { localRef, elementRef } = useLocalRef(ref);
- *
- *   // do something with `localRef` which is a `RefObject` with a `current` property
- *
- *   return <Element ref={elementRef} {...elemProps} />
- * }
- */
-export declare function useLocalRef<T>(ref?: React.Ref<T>): {
-    localRef: React.RefObject<T>;
-    elementRef: (instance: T | null) => void;
-};
-/**
- * Returns a model, or calls the model hook with config. Clever way around the conditional React
- * hook ESLint rule.
- * @param model A model, if provided
- * @param config Config for a model
- * @param modelHook A model hook that takes valid config
- * @example
- * const ContainerComponent = ({children, model, ...config}: ContainerProps) => {
- *   const value = useDefaultModel(model, config, useContainerModel);
- *
- *   // ...
- * }
- */
-export declare function useDefaultModel<T, C>(model: T | undefined, config: C, modelHook: (config: C) => T): T;
-/**
- * Returns a model, or returns a model context. Clever way around the conditional React hook ESLint
- * rule
- * @param model A model, if provided
- * @param context The context of a model
- * @example
- * const SubComponent = ({children, model, ...elemProps}: SubComponentProps, ref, Element) => {
- *   const {state, events} = useModelContext(model, SubComponentModelContext);
- *
- *   // ...
- * }
- */
-export declare function useModelContext<T>(context: React.Context<T>, model?: T): T;
-/**
- * Compose many hooks together. Assumes hooks are using `mergeProps`. Returns a function that will
- * receive a model and return props to be applied to a component. These props should always be
- * applied last on the Component. The props will override as follows: rightmost hook props override
- * leftmost hook props which are overridden by props passed to the composeHooks function.
- *
- * A `ref` should be passed for hooks that require a ref. Each hook should fork the ref using
- * `useLocalRef`, passing the `elementRef` in the returned props object. This ref will be passed to
- * the next hook.
- *
- * @example
- * const MyComponent = React.forwardRef(({ children, model, ...elemProps }, ref) => {
- *   const props = composeHooks(useHook1, useHook2)(model, elemProps, ref)
- *
- *   return <div id="foo" {...props}>{children}</div>
- * })
- */
-export declare function composeHooks<M extends Model<any, any>, O1 extends {}, O2 extends {}>(hook1: BehaviorHook<M, O1>, hook2: BehaviorHook<M, O2>): BehaviorHook<M, O1 & O2>;
-export declare function composeHooks<M extends Model<any, any>, R, P extends {}, O1 extends {}, O2 extends {}, O3 extends {}>(hook1: BehaviorHook<M, O1>, hook2: BehaviorHook<M, O2>, hook3: BehaviorHook<M, O3>): BehaviorHook<M, O1 & O2 & O3>;
-export declare function composeHooks<M extends Model<any, any>, R, P extends {}, O1 extends {}, O2 extends {}, O3 extends {}, O4 extends {}>(hook1: BehaviorHook<M, O1>, hook2: BehaviorHook<M, O2>, hook3: BehaviorHook<M, O3>, hook4: BehaviorHook<M, O4>): BehaviorHook<M, O1 & O2 & O3 & O4>;
-export declare function composeHooks<M extends Model<any, any>, R, P extends {}, O1 extends {}, O2 extends {}, O3 extends {}, O4 extends {}, O5 extends {}>(hook1: BehaviorHook<M, O1>, hook2: BehaviorHook<M, O2>, hook3: BehaviorHook<M, O3>, hook4: BehaviorHook<M, O4>, hook5: BehaviorHook<M, O5>): BehaviorHook<M, O1 & O2 & O3 & O4 & O5>;
-export {};
-//# sourceMappingURL=components.d.ts.map

package/ts3.5/dist/commonjs/common/lib/utils/elements.d.ts

@@ -1,14 +0,0 @@
-/**
- * Is an element focusable? This function performs various tests to see if the element in question
- * can receive focus. Should skip disabled elements as they are not focusable.
- */
-export declare const isFocusable: (element: HTMLElement) => boolean | null;
-/**
- * Get the first focusable element in a container.
- */
-export declare const getFirstFocusableElement: (container: HTMLElement) => HTMLElement | null;
-/**
- * Get the last focusable element in a container.
- */
-export declare const getLastFocusableElement: (container: HTMLElement) => HTMLElement | null;
-//# sourceMappingURL=elements.d.ts.map

package/ts3.5/dist/commonjs/common/lib/utils/getTranslateFromOrigin.d.ts

@@ -1,12 +0,0 @@
-import { TransformOrigin } from '../types';
-/**
- * Gets the x and y distance values needed to translate from a given transform origin to 0,0
- * @param {Object} transformOrigin The origin of the transform (i.e. top left)
- * @param {string} distance The distance to translate (as a canvas spacing value).
- * @returns {Object} An object with the x and y distance values needed to translate.
- */
-export declare const getTranslateFromOrigin: (transformOrigin: TransformOrigin, distance: "0px" | "4px" | "8px" | "12px" | "16px" | "24px" | "32px" | "40px" | "64px" | "80px") => {
-    x: number;
-    y: number;
-};
-//# sourceMappingURL=getTranslateFromOrigin.d.ts.map