@vuu-ui/vuu-table 0.8.11-debug → 0.8.12

package/types/vuu-layout/src/layout-reducer/resize-flex-children.d.ts

@@ -0,0 +1,4 @@
+import React, { ReactElement } from "react";
+import { LayoutResizeAction, SplitterResizeAction } from "./layoutTypes";
+export declare function resizeFlexChild(layoutRoot: ReactElement, { path, size }: LayoutResizeAction): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+export declare function resizeFlexChildren(layoutRoot: ReactElement, { path, sizes }: SplitterResizeAction): React.ReactElement<any, string | React.JSXElementConstructor<any>>;

package/types/vuu-layout/src/layout-reducer/wrap-layout-element.d.ts

@@ -0,0 +1,9 @@
+import { ReactElement } from "react";
+import { DropPos } from "../drag-drop/dragDropTypes";
+import { DropTarget } from "../drag-drop/DropTarget";
+export interface LayoutSpec {
+    type: "Stack" | "Flexbox";
+    flexDirection: "column" | "row";
+    showTabs?: boolean;
+}
+export declare function wrap(container: ReactElement, existingComponent: any, newComponent: any, pos: DropPos, clientRect?: DropTarget["clientRect"], dropRect?: DropTarget["dropRect"]): ReactElement;

package/types/vuu-layout/src/layout-view/View.d.ts

@@ -0,0 +1,11 @@
+import { ForwardedRef, ReactElement } from "react";
+import { ViewProps } from "./viewTypes";
+import "./View.css";
+interface ViewComponentType {
+    (props: ViewProps & {
+        ref?: ForwardedRef<HTMLDivElement>;
+    }): ReactElement<ViewProps>;
+    displayName?: string;
+}
+declare const MemoView: ViewComponentType;
+export { MemoView as View };

package/types/vuu-layout/src/layout-view/ViewContext.d.ts

@@ -0,0 +1,30 @@
+import React, { SyntheticEvent } from "react";
+import { ViewAction } from "./viewTypes";
+export type ViewDispatch = <Action extends ViewAction = ViewAction>(action: Action, evt?: SyntheticEvent) => Promise<boolean | void>;
+/**
+ * This API is available to any Feature hosted within Vuu (as all Features are wrapped
+ * with View component). It offers metadata about the View as well as access to the
+ * Vuu persistencew API;
+ */
+export interface ViewContextAPI {
+    /**
+     * disdpatcher for View actions. These are a subset of LayoutActions, specifically for
+     * View manipulation
+     */
+    dispatch?: ViewDispatch | null;
+    id?: string;
+    load?: (key?: string) => unknown;
+    loadSession?: (key?: string) => unknown;
+    onConfigChange?: (config: unknown) => void;
+    path?: string;
+    purge?: (key: string) => void;
+    save?: (state: unknown, key: string) => void;
+    saveSession?: (state: unknown, key: string) => void;
+    setComponentProps: (props: {
+        [key: string]: unknown;
+    }) => void;
+    title?: string;
+}
+export declare const ViewContext: React.Context<ViewContextAPI>;
+export declare const useViewDispatch: () => ViewDispatch | null;
+export declare const useViewContext: () => ViewContextAPI;

package/types/vuu-layout/src/layout-view/index.d.ts

@@ -0,0 +1,4 @@
+export * from './useViewActionDispatcher';
+export * from './View';
+export * from './ViewContext';
+export * from './viewTypes';

package/types/vuu-layout/src/layout-view/useView.d.ts

@@ -0,0 +1,21 @@
+import { RefObject } from "react";
+export interface ViewHookProps {
+    id: string;
+    rootRef: RefObject<HTMLDivElement>;
+    path?: string;
+    dropTargets?: string[];
+    title?: string;
+}
+export declare const useView: ({ id, rootRef, path, dropTargets, title: titleProp, }: ViewHookProps) => {
+    contributions: import("./useViewActionDispatcher").Contribution[] | undefined;
+    dispatchViewAction: import("./ViewContext").ViewDispatch;
+    load: (key?: string) => any;
+    loadSession: (key?: string) => any;
+    onConfigChange: ({ type: key, ...config }: any) => void;
+    onEditTitle: (title: string) => void;
+    purge: (key: any) => void;
+    restoredState: any;
+    save: (state: any, key: any) => void;
+    saveSession: (state: any, key: any) => void;
+    title: any;
+};

package/types/vuu-layout/src/layout-view/useViewActionDispatcher.d.ts

@@ -0,0 +1,9 @@
+import { ReactElement, RefObject } from "react";
+import { ViewDispatch } from "./ViewContext";
+export type ContributionLocation = "post-title" | "pre-title";
+export type Contribution = {
+    index?: number;
+    location?: ContributionLocation;
+    content: ReactElement;
+};
+export declare const useViewActionDispatcher: (id: string, root: RefObject<HTMLDivElement>, viewPath?: string, dropTargets?: string[]) => [ViewDispatch, Contribution[] | undefined];

package/types/vuu-layout/src/layout-view/useViewResize.d.ts

@@ -0,0 +1,7 @@
+import { RefObject } from "react";
+export interface ViewResizeHookProps {
+    mainRef: RefObject<HTMLDivElement>;
+    resize?: "defer" | "responsive";
+    rootRef: RefObject<HTMLDivElement>;
+}
+export declare const useViewResize: ({ mainRef, resize, rootRef, }: ViewResizeHookProps) => void;

package/types/vuu-layout/src/layout-view/viewTypes.d.ts

@@ -0,0 +1,21 @@
+import { FunctionComponent, HTMLAttributes } from "react";
+import { HeaderProps } from "../layout-header";
+import { AddToolbarContributionViewAction, MaximizeAction, MinimizeAction, MousedownViewAction, RemoveAction, RemoveToolbarContributionViewAction, RestoreAction, TearoutAction } from "../layout-reducer";
+export type ViewAction = MaximizeAction | MinimizeAction | MousedownViewAction | RemoveAction | RestoreAction | TearoutAction | AddToolbarContributionViewAction | RemoveToolbarContributionViewAction;
+export type ResizeStrategy = "defer" | "responsive";
+export interface ViewProps extends HTMLAttributes<HTMLDivElement> {
+    Header?: FunctionComponent<HeaderProps>;
+    closeable?: boolean;
+    collapsed?: boolean;
+    "data-path"?: string;
+    "data-resizeable"?: boolean;
+    dropTargets?: string[];
+    expanded?: boolean;
+    flexFill?: boolean;
+    header?: boolean | Partial<HeaderProps>;
+    orientation?: "vertical" | "horizontal";
+    path?: string;
+    resize?: ResizeStrategy;
+    resizeable?: boolean;
+    tearOut?: boolean;
+}

package/types/vuu-layout/src/measured-container/MeasuredContainer.d.ts

@@ -0,0 +1,9 @@
+import { HTMLAttributes } from "react";
+import { MeasuredSize } from "./useMeasuredContainer";
+import "./MeasuredContainer.css";
+export interface MeasuredContainerProps extends HTMLAttributes<HTMLDivElement> {
+    height?: number | string;
+    onResize?: (size: MeasuredSize) => void;
+    width?: number | string;
+}
+export declare const MeasuredContainer: import("react").ForwardRefExoticComponent<MeasuredContainerProps & import("react").RefAttributes<HTMLDivElement>>;

package/types/vuu-layout/src/measured-container/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./MeasuredContainer";
+export * from "./useMeasuredContainer";

package/types/{table → vuu-layout/src/measured-container}/useMeasuredContainer.d.ts

@@ -1,30 +1,22 @@
-import { RefObject } from "react";
+import { CSSProperties, RefObject } from "react";
+import { MeasuredContainerProps } from "./MeasuredContainer";
 export interface ClientSize {
     clientHeight: number;
     clientWidth: number;
 }
-export interface MeasuredProps {
+export interface MeasuredProps extends Pick<MeasuredContainerProps, "height" | "onResize" | "width"> {
     defaultHeight?: number;
     defaultWidth?: number;
-    height?: number;
-    width?: number;
-}
-export interface Size {
-    height: number | "100%";
-    width: number | "100%";
 }
+export type CssSize = Pick<CSSProperties, "height" | "width">;
 export interface MeasuredSize {
     height: number;
     width: number;
 }
-export type CssSize = {
-    height: string;
-    width: string;
-};
 export interface MeasuredContainerHookResult {
     containerRef: RefObject<HTMLDivElement>;
     cssSize: CssSize;
-    outerSize: Size;
+    outerSize: CssSize;
     innerSize?: MeasuredSize;
 }
-export declare const useMeasuredContainer: ({ defaultHeight, defaultWidth, height, width, }: MeasuredProps) => MeasuredContainerHookResult;
+export declare const useMeasuredContainer: ({ defaultHeight, defaultWidth, height, onResize: onResizeProp, width, }: MeasuredProps) => MeasuredContainerHookResult;

package/types/vuu-layout/src/measured-container/useResizeObserver.d.ts

@@ -0,0 +1,15 @@
+import { RefObject } from "react";
+export declare const WidthHeight: string[];
+export declare const WidthOnly: string[];
+export type measurements<T = string | number> = {
+    height?: T;
+    clientHeight?: number;
+    clientWidth?: number;
+    contentHeight?: number;
+    contentWidth?: number;
+    scrollHeight?: number;
+    scrollWidth?: number;
+    width?: T;
+};
+export type ResizeHandler = (measurements: measurements<number>) => void;
+export declare function useResizeObserver(ref: RefObject<Element | HTMLElement | null>, dimensions: readonly string[], onResize: ResizeHandler, reportInitialSize?: boolean): void;

package/types/vuu-layout/src/overflow-container/OverflowContainer.d.ts

@@ -0,0 +1,17 @@
+import { PopupMenuProps } from "@vuu-ui/vuu-popups";
+import { orientationType } from "@vuu-ui/vuu-utils";
+import React, { HTMLAttributes } from "react";
+import { OverflowItem } from "./overflow-utils";
+import "./OverflowContainer.css";
+export interface OverflowContainerProps extends HTMLAttributes<HTMLDivElement> {
+    PopupMenuProps?: Partial<PopupMenuProps>;
+    allowDragDrop?: boolean;
+    debugId?: string;
+    height: number;
+    onMoveItem?: (fromIndex: number, toIndex: number) => void;
+    onSwitchWrappedItemIntoView?: (overflowItem: OverflowItem) => void;
+    orientation?: orientationType;
+    overflowIcon?: string;
+    overflowPosition?: "start" | "end" | number;
+}
+export declare const OverflowContainer: React.ForwardRefExoticComponent<OverflowContainerProps & React.RefAttributes<HTMLDivElement>>;

package/types/vuu-layout/src/overflow-container/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./OverflowContainer";
+export * from "./overflow-utils";

package/types/vuu-layout/src/overflow-container/overflow-utils.d.ts

@@ -0,0 +1,49 @@
+import { orientationType } from "@vuu-ui/vuu-utils";
+export type OverflowItem = {
+    index: string;
+    label: string;
+    overflowPriority: string;
+};
+export declare const isOverflowElement: (element: HTMLElement | null) => boolean;
+export declare const sortByScreenOrder: (elements: HTMLElement[]) => HTMLElement[];
+export declare const NO_WRAPPED_ITEMS: OverflowItem[];
+/**
+    Identify wrapped items by comparing position of each item. Any item
+    not to the right of preceeding item has wrapped. Note: on-screen
+    position of items does not necessarily match document position, due
+    to use of css order. This is taken into account by sorting.
+    TODO support Vertical orientation
+ */
+export declare const getNonWrappedAndWrappedItems: (container: HTMLElement, orientation?: orientationType) => [OverflowItem[], OverflowItem[]];
+export declare const applyOverflowClassToWrappedItems: (container: HTMLElement, overflowedItems: OverflowItem[], classBase?: string) => void;
+export declare const overflowIndicatorHasWrappedButShouldNotHave: (wrappedItems: OverflowItem[]) => boolean;
+export declare const highPriorityItemsHaveWrappedButShouldNotHave: (nonWrappedItems: OverflowItem[], wrappedItems: OverflowItem[]) => boolean;
+/**
+  An edge case that may occur when reducing width from unwrapped to
+  wrapped, or on first render.
+  We overflow one or more items. Then, when the overflowIndicator assumes
+  full width, it may itself overflow.
+*/
+export declare const correctForWrappedOverflowIndicator: (container: HTMLElement, overflowedItems: OverflowItem[]) => Promise<OverflowItem[]>;
+/**
+  An edge case that may occur when reducing width from unwrapped to
+  wrapped, or on first render.
+  We overflow one or more items. Then, when the overflowIndicator assumes
+  full width, it may itself overflow.
+*/
+export declare const correctForWrappedHighPriorityItems: (container: HTMLElement, nonWrapped: OverflowItem[], wrapped: OverflowItem[]) => Promise<[OverflowItem[], OverflowItem[]]>;
+export declare const markElementAsWrapped: (container: HTMLElement, item: OverflowItem) => void;
+export declare const getElementsMarkedAsWrapped: (container: HTMLElement) => HTMLElement[];
+export declare const unmarkItemsWhichAreNoLongerWrapped: (container: HTMLElement, wrappedItems: OverflowItem[]) => void;
+/**
+    An edge case. If container has grown but we still have one
+    wrapped item - could the wrapped item return to the fold if the overflow
+    indicaor were removed ?
+ */
+export declare const removeOverflowIndicatorIfNoLongerNeeded: (container: HTMLElement) => boolean;
+/**
+ * This is used both when an overflow menu is used to select an overflowed item
+ * and when a high priority item has overflowed, whilst lower priority items
+ * remain in view.
+ */
+export declare const switchWrappedItemIntoView: (container: HTMLElement, overflowItem: OverflowItem) => [OverflowItem[], OverflowItem[]];

package/types/vuu-layout/src/overflow-container/useOverflowContainer.d.ts

@@ -0,0 +1,20 @@
+/// <reference types="react" />
+import { MenuActionHandler, MenuBuilder } from "@vuu-ui/vuu-data-types";
+import { OverflowItem } from "./overflow-utils";
+import { OverflowContainerProps } from "./OverflowContainer";
+export interface OverflowContainerHookProps extends Pick<OverflowContainerProps, "allowDragDrop" | "onMoveItem" | "orientation"> {
+    itemCount: number;
+    onSwitchWrappedItemIntoView?: (overflowItem: OverflowItem) => void;
+}
+export declare const useOverflowContainer: ({ allowDragDrop, itemCount, onMoveItem, onSwitchWrappedItemIntoView, orientation, }: OverflowContainerHookProps) => {
+    draggable?: JSX.Element | undefined;
+    dropIndicator?: JSX.Element | undefined;
+    draggedItemIndex?: number | undefined;
+    isDragging: boolean;
+    isScrolling: import("react").RefObject<boolean>;
+    revealOverflowedItems: boolean;
+    menuActionHandler: MenuActionHandler;
+    menuBuilder: MenuBuilder<string, unknown>;
+    onItemMouseDown: import("react").MouseEventHandler<Element> | undefined;
+    rootRef: (el: HTMLDivElement | null) => void;
+};

package/types/vuu-layout/src/palette/Palette.d.ts

@@ -0,0 +1,22 @@
+import { ListItemProps, ListProps } from "@vuu-ui/vuu-ui-controls";
+import { HTMLAttributes, ReactElement } from "react";
+import { ViewProps } from "../layout-view";
+import "./Palette.css";
+export interface PaletteItemProps extends ListItemProps {
+    children: ReactElement;
+    closeable?: boolean;
+    header?: boolean;
+    idx?: number;
+    resize?: "defer";
+    resizeable?: boolean;
+}
+export declare const PaletteItem: import("react").MemoExoticComponent<({ className, children: component, idx, resizeable, header, closeable, ...props }: PaletteItemProps) => JSX.Element>;
+export interface PaletteProps extends Omit<HTMLAttributes<HTMLDivElement>, "onDragStart" | "onDrop" | "onSelect"> {
+    ListProps?: Partial<ListProps>;
+    ViewProps?: Partial<ViewProps>;
+    children: ReactElement[];
+    itemHeight?: number;
+    orientation: "horizontal" | "vertical";
+    selection?: string;
+}
+export declare const Palette: ({ ListProps, ViewProps, children, className, itemHeight, orientation, ...props }: PaletteProps) => JSX.Element;

package/types/vuu-layout/src/palette/index.d.ts

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

package/types/vuu-layout/src/placeholder/Placeholder.d.ts

@@ -0,0 +1,12 @@
+import { HTMLAttributes } from "react";
+import "./Placeholder.css";
+export interface PlaceholderProps extends HTMLAttributes<HTMLDivElement> {
+    closeable?: boolean;
+    flexFill?: boolean;
+    resizeable?: boolean;
+    shim?: boolean;
+}
+export declare const Placeholder: {
+    ({ className, closeable, flexFill, resizeable, shim, ...props }: PlaceholderProps): JSX.Element;
+    displayName: string;
+};

package/types/vuu-layout/src/placeholder/index.d.ts

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

package/types/vuu-layout/src/registry/ComponentRegistry.d.ts

@@ -0,0 +1,13 @@
+import { FunctionComponent } from "react";
+export type layoutComponentType = "component" | "container" | "view";
+export interface ComponentWithId {
+    id: string;
+    [key: string]: unknown;
+}
+export declare const ComponentRegistry: {
+    [key: string]: FunctionComponent<ComponentWithId>;
+};
+export declare function isContainer(componentType: string): boolean;
+export declare function isView(componentType: string): boolean;
+export declare const isLayoutComponent: (type: string) => boolean;
+export declare function registerComponent(componentName: string, component: FunctionComponent<any>, type?: layoutComponentType): void;

package/types/vuu-layout/src/registry/index.d.ts

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

package/types/vuu-layout/src/responsive/breakpoints.d.ts

@@ -0,0 +1,4 @@
+import { BreakPointsProp } from "../flexbox/flexboxTypes";
+export type BreakPointRamp = [string, number, number];
+export declare const breakpointRamp: (breakpoints: BreakPointsProp) => BreakPointRamp[];
+export declare const getBreakPoints: (themeName?: string) => BreakPointRamp[];

package/types/vuu-layout/src/responsive/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./use-breakpoints";
+export * from "./useResizeObserver";
+export * from "./utils";

package/types/vuu-layout/src/responsive/use-breakpoints.d.ts

@@ -0,0 +1,7 @@
+import { RefObject } from "react";
+import { BreakPointsProp } from "../flexbox/flexboxTypes";
+export interface BreakpointsHookProps {
+    breakPoints?: BreakPointsProp;
+    smallerThan?: string;
+}
+export declare const useBreakpoints: ({ breakPoints: breakPointsProp, smallerThan }: BreakpointsHookProps, ref: RefObject<HTMLElement>) => string | boolean;

package/types/vuu-layout/src/responsive/useResizeObserver.d.ts

@@ -0,0 +1,13 @@
+import { RefObject } from "react";
+export declare const WidthHeight: string[];
+export declare const HeightOnly: string[];
+export declare const WidthOnly: string[];
+export type measurements<T = string | number> = {
+    height?: T;
+    scrollHeight?: T;
+    scrollWidth?: T;
+    width?: T;
+};
+export type ResizeHandler = (measurements: measurements<number>) => void;
+export declare const resizeObserver: ResizeObserver;
+export declare function useResizeObserver(ref: RefObject<Element | HTMLElement | null>, dimensions: string[], onResize: ResizeHandler, reportInitialSize?: boolean): void;

package/types/vuu-layout/src/responsive/utils.d.ts

@@ -0,0 +1,6 @@
+export declare const isResponsiveAttribute: (propName: string) => boolean;
+type Props = {
+    [key: string]: any;
+};
+export declare const extractResponsiveProps: (props: Props) => [Props, Props];
+export {};

package/types/vuu-layout/src/stack/Stack.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { StackProps } from "./stackTypes";
+import "./Stack.css";
+export declare const Stack: React.ForwardRefExoticComponent<StackProps & React.RefAttributes<HTMLDivElement>>;

package/types/vuu-layout/src/stack/StackLayout.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { StackProps } from "./stackTypes";
+import "./Stack.css";
+export declare const StackLayout: {
+    (props: StackProps): JSX.Element;
+    displayName: string;
+};

package/types/vuu-layout/src/stack/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./Stack";
+export * from "./StackLayout";
+export * from "./stackTypes";

package/types/vuu-layout/src/stack/stackTypes.d.ts

@@ -0,0 +1,21 @@
+import { TabstripProps } from "@vuu-ui/vuu-ui-controls";
+import { HTMLAttributes, MouseEvent, ReactElement, ReactNode } from "react";
+export type TabPosition = "top" | "left" | "right" | "bottom";
+export interface StackProps extends Omit<HTMLAttributes<HTMLDivElement>, "onMouseDown"> {
+    active?: number;
+    createNewChild?: (index: number) => ReactElement;
+    getTabIcon?: (component: ReactElement, index: number) => string | undefined;
+    getTabLabel?: (component: ReactElement, index: number) => string | undefined;
+    keyBoardActivation?: "automatic" | "manual";
+    onAddTab?: () => void;
+    onMoveTab?: (fromIndex: number, toIndex: number) => void;
+    onMouseDown?: (e: MouseEvent, tabIndex: number) => void;
+    onTabClose?: (tabIndex: number) => void;
+    onTabEdit?: (tabIndex: number, label: string) => void;
+    onTabSelectionChanged?: (nextIndex: number) => void;
+    path?: string;
+    /** should the Stack display a Tabstrip and where ? default top */
+    showTabs?: false | TabPosition;
+    toolbarContent?: ReactNode;
+    TabstripProps?: Partial<TabstripProps>;
+}

package/types/vuu-layout/src/toolbar/Toolbar.d.ts

@@ -0,0 +1,19 @@
+/// <reference types="react" />
+import { OverflowContainerProps } from "../overflow-container";
+import { SelectionStrategy, SpecialKeyMultipleSelection } from "@vuu-ui/vuu-ui-controls";
+import "./Toolbar.css";
+export type ActiveItemChangeHandler = (itemIndex: number[]) => void;
+export type NavigationOutOfBoundsHandler = (direction: "start" | "end") => void;
+export interface ToolbarProps extends OverflowContainerProps {
+    activeItemIndex?: number[];
+    defaultActiveItemIndex?: number[];
+    onActiveChange?: ActiveItemChangeHandler;
+    /**
+     * Indicates that user has used Arrow key navigation to move beyond the
+     * last or before the first item. A higher level component may want to
+     * use this to implement a seamless navigation across components.
+     */
+    onNavigateOutOfBounds?: NavigationOutOfBoundsHandler;
+    selectionStrategy?: SelectionStrategy | SpecialKeyMultipleSelection;
+}
+export declare const Toolbar: ({ activeItemIndex: activeItemIndexProp, defaultActiveItemIndex, children, className: classNameProp, id: idProp, onActiveChange, onNavigateOutOfBounds, orientation, selectionStrategy, ...props }: ToolbarProps) => JSX.Element;

package/types/vuu-layout/src/toolbar/index.d.ts

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

package/types/vuu-layout/src/toolbar/toolbar-dom-utils.d.ts

@@ -0,0 +1,3 @@
+export declare const getIndexOfItem: (container: HTMLElement | null, query: string) => number;
+export declare const getIndexOfSelectedTab: (container: HTMLElement | null) => number;
+export declare const getIndexOfEditedItem: (container: HTMLElement | null) => number;

package/types/vuu-layout/src/toolbar/useKeyboardNavigation.d.ts

@@ -0,0 +1,32 @@
+import { orientationType } from "@vuu-ui/vuu-utils";
+import { FocusEvent, FocusEventHandler, KeyboardEvent, MouseEvent as ReactMouseEvent, MouseEventHandler, RefObject } from "react";
+import { NavigationOutOfBoundsHandler } from "./Toolbar";
+import { PopupCloseCallback } from "@vuu-ui/vuu-popups";
+export interface ContainerNavigationProps {
+    onBlur: FocusEventHandler;
+    onFocus: FocusEventHandler;
+    onMouseDownCapture: MouseEventHandler;
+    onMouseLeave: MouseEventHandler;
+}
+interface ToolbarNavigationHookProps {
+    containerRef: RefObject<HTMLElement>;
+    defaultHighlightedIdx?: number;
+    highlightedIdx?: number;
+    onNavigateOutOfBounds?: NavigationOutOfBoundsHandler;
+    orientation: orientationType;
+}
+interface ToolbarNavigationHookResult {
+    containerProps: ContainerNavigationProps;
+    focusableIdx: number;
+    highlightedIdx: number;
+    focusItem: (itemIndex: number, immediateFocus?: boolean, withKeyboard?: boolean, delay?: number) => void;
+    focusVisible: number;
+    focusIsWithinComponent: boolean;
+    onClick: (evt: ReactMouseEvent, tabIndex: number) => void;
+    onFocus: (evt: FocusEvent<HTMLElement>) => void;
+    onKeyDown: (evt: KeyboardEvent) => void;
+    onOverflowMenuClose?: PopupCloseCallback;
+    setHighlightedIdx: (highlightedIndex: number) => void;
+}
+export declare const useKeyboardNavigation: ({ containerRef, defaultHighlightedIdx, highlightedIdx: highlightedIdxProp, onNavigateOutOfBounds, orientation, }: ToolbarNavigationHookProps) => ToolbarNavigationHookResult;
+export {};

package/types/vuu-layout/src/toolbar/useSelection.d.ts

@@ -0,0 +1,22 @@
+import { SelectionStrategy, SpecialKeyMultipleSelection } from "@vuu-ui/vuu-ui-controls";
+import { MouseEvent, RefObject } from "react";
+export interface SelectionHookProps {
+    containerRef: RefObject<HTMLElement>;
+    defaultSelected?: number[];
+    highlightedIdx: number;
+    itemQuery: string;
+    onSelectionChange?: (selectedIndices: number[]) => void;
+    selected?: number[];
+    selectionStrategy: SelectionStrategy | SpecialKeyMultipleSelection;
+}
+export interface ItemHandlers {
+    onClick?: (e: MouseEvent, itemIndex: number) => void;
+    onKeyDown?: (event: React.KeyboardEvent) => void;
+}
+export interface SelectionHookResult {
+    activateItem: (tabIndex: number) => void;
+    itemHandlers: ItemHandlers;
+    isControlled: boolean;
+    selected: number[];
+}
+export declare const useSelection: ({ containerRef, defaultSelected, highlightedIdx, itemQuery, onSelectionChange, selected: selectedProp, selectionStrategy, }: SelectionHookProps) => SelectionHookResult;

package/types/vuu-layout/src/toolbar/useToolbar.d.ts

@@ -0,0 +1,28 @@
+import type { OverflowItem, ToolbarProps } from "@vuu-ui/vuu-layout";
+import { PopupCloseCallback } from "@vuu-ui/vuu-popups";
+import { KeyboardEvent, MouseEvent as ReactMouseEvent, RefObject } from "react";
+export interface ToolbarHookProps extends Pick<ToolbarProps, "activeItemIndex" | "defaultActiveItemIndex" | "onActiveChange" | "onNavigateOutOfBounds">, Required<Pick<ToolbarProps, "orientation" | "selectionStrategy">> {
+    containerRef: RefObject<HTMLElement>;
+    itemQuery?: string;
+}
+export declare const useToolbar: ({ activeItemIndex: activeItemIndexProp, defaultActiveItemIndex, containerRef, itemQuery, onActiveChange, onNavigateOutOfBounds, orientation, selectionStrategy, }: ToolbarHookProps) => {
+    activeItemIndex: number[];
+    focusableIdx: number;
+    focusVisible: number;
+    containerProps: {
+        onSwitchWrappedItemIntoView: (item: OverflowItem) => void;
+        onBlur: import("react").FocusEventHandler<Element>;
+        onFocus: import("react").FocusEventHandler<Element>;
+        onMouseDownCapture: import("react").MouseEventHandler<Element>;
+        onMouseLeave: import("react").MouseEventHandler<Element>;
+        PopupMenuProps: {
+            onKeyDown: (evt: KeyboardEvent) => void;
+            onMenuClose: PopupCloseCallback | undefined;
+        };
+    };
+    itemProps: {
+        onClick: (evt: ReactMouseEvent<HTMLElement>) => void;
+        onFocus: (evt: import("react").FocusEvent<HTMLElement, Element>) => void;
+        onKeyDown: (evt: KeyboardEvent) => void;
+    };
+};

package/types/vuu-layout/src/tools/config-wrapper/ConfigWrapper.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const ConfigWrapper: ({ children }: any) => JSX.Element;

package/types/vuu-layout/src/tools/config-wrapper/index.d.ts

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

package/types/vuu-layout/src/tools/devtools-box/layout-configurator.d.ts

@@ -0,0 +1,31 @@
+export function XXXnormalizeStyles(layoutStyle?: {}, visualStyle?: {}): {};
+export namespace MARGIN_STYLES {
+    const margin: boolean;
+    const marginTop: boolean;
+    const marginRight: boolean;
+    const marginBottom: boolean;
+    const marginLeft: boolean;
+}
+export namespace PADDING_STYLES {
+    const padding: boolean;
+    const paddingTop: boolean;
+    const paddingRight: boolean;
+    const paddingBottom: boolean;
+    const paddingLeft: boolean;
+}
+export namespace BORDER_STYLES {
+    const border: boolean;
+    const borderColor: boolean;
+    const borderWidth: boolean;
+    const borderTopWidth: boolean;
+    const borderRightWidth: boolean;
+    const borderBottomWidth: boolean;
+    const borderLeftWidth: boolean;
+}
+export function LayoutConfigurator({ height, managedStyle, onChange, style, width, }: {
+    height: any;
+    managedStyle: any;
+    onChange: any;
+    style: any;
+    width: any;
+}): JSX.Element;

package/types/vuu-layout/src/tools/devtools-tree/layout-tree-viewer.d.ts

@@ -0,0 +1,5 @@
+export function LayoutTreeViewer({ layout, onSelect, style }: {
+    layout: any;
+    onSelect: any;
+    style: any;
+}): JSX.Element;

package/types/vuu-layout/src/tools/index.d.ts

@@ -0,0 +1,3 @@
+export * from './config-wrapper';
+export * from './devtools-box/layout-configurator';
+export * from './devtools-tree/layout-tree-viewer';

package/types/vuu-layout/src/use-persistent-state.d.ts

@@ -0,0 +1,11 @@
+export declare const getPersistentState: (id: string) => any;
+export declare const hasPersistentState: (id: string) => boolean;
+export declare const setPersistentState: (id: string, value: any) => Map<string, any>;
+export declare const usePersistentState: () => {
+    loadSessionState: (id: any, key: any) => any;
+    loadState: (id: string, key?: string) => any;
+    saveSessionState: (id: any, key: any, data: any) => void;
+    saveState: (id: string, key: string | undefined, data: unknown) => void;
+    purgeState: (id: string, key?: string) => void;
+    purgeSessionState: (id: string, key?: string) => void;
+};

package/types/vuu-layout/src/utils/index.d.ts

@@ -0,0 +1,6 @@
+export * from "./pathUtils";
+export * from "./propUtils";
+export * from "./refUtils";
+export * from "./react-utils";
+export * from "./styleUtils";
+export * from "./typeOf";