@overmap-ai/blocks 1.0.40-overlay.1 → 1.0.40-slide-out-resize-handle.0

package/dist/hooks.d.ts

@@ -0,0 +1,20 @@
+import { Dispatch, SetStateAction } from 'react';
+import { ViewportSizes } from './typings';
+interface useViewportSizeProps {
+    xs: number | string;
+    sm: number | string;
+    md: number | string;
+    lg: number | string;
+    xl: number | string;
+}
+export declare const useViewportSize: (props: useViewportSizeProps) => Record<"xs" | "sm" | "md" | "lg" | "xl", boolean> & {
+    prevSize: ViewportSizes;
+    size: ViewportSizes;
+};
+/** custom hook use for providing filter functionality based on a text input field
+ *  @param filterFunction make sure this is wrapped in a useCallback
+ *  @param items items that should be filtered on (of type T) */
+export declare function useTextFilter<TItem>(items: TItem[], filterFunction: (value: TItem, filterValue: string) => boolean): [TItem[], string, Dispatch<SetStateAction<string>>];
+export declare function useControlledState<TState>(initialState: TState, state?: TState, setState?: (state: TState) => void): [TState, (state: TState) => void];
+export declare function useFallbackId(id?: string): string;
+export {};

package/dist/index.d.ts

@@ -6,12 +6,12 @@ export * from './Buttons';
 export * from './Card';
 export * from './Checkbox';
 export * from './CheckboxGroup';
-export * from './CollapsibleTree';
 export * from './CommandMenu';
 export * from './cva';
 export * from './DayPicker';
 export * from './Dialog';
 export * from './Heading';
+export * from './hooks';
 export * from './HoverCard';
 export * from './HoverUtility';
 export * from './Input';
@@ -19,6 +19,7 @@ export * from './Layout';
 export * from './Link';
 export * from './LuIcon';
 export * from './Menu';
+export * from './MenuV2';
 export * from './OneTimePasswordField';
 export * from './Overlay';
 export * from './OvermapErrorBoundary';
@@ -27,6 +28,7 @@ export * from './Progress';
 export * from './Provider';
 export * from './RadioCards';
 export * from './RadioGroup';
+export * from './Rating';
 export * from './SegmentedControl';
 export * from './SegmentedTabs';
 export * from './Separator';
@@ -43,4 +45,4 @@ export * from './ToggleButton';
 export * from './ToggleGroup';
 export * from './Tooltip';
 export * from './typings';
-export { mergeRefs, stopPropagation, useControlledState, useSize, useStopEventPropagation, useTextFilter, useViewportSize, } from './utils';
+export * from './utils';

package/dist/typings.d.ts

@@ -1,8 +1,3 @@
-import { CSSProperties } from 'react';
-export type PropsWithClassNameAndStyle = {
-    className?: string;
-    style?: CSSProperties;
-};
 export type ViewportSizes = "initial" | "xs" | "sm" | "md" | "lg" | "xl";
 export interface AccentColorProps {
     accentColor?: string;

package/dist/utils.d.ts

@@ -1,34 +1,11 @@
-import { Dispatch, RefObject, SetStateAction, SyntheticEvent } from 'react';
-import { ViewportSizes } from './typings';
+import { SyntheticEvent } from 'react';
+import { CheckedState } from './CheckedIndicator';
 import type * as React from "react";
-export interface ViewportSize {
-    size: ViewportSizes;
-    prevSize: ViewportSizes;
-    xs: boolean;
-    sm: boolean;
-    md: boolean;
-    lg: boolean;
-    xl: boolean;
-}
-/** Return value needs to be deconstructed since the object returned is not memoized */
-interface useViewportSizeProps {
-    xs: number | string;
-    sm: number | string;
-    md: number | string;
-    lg: number | string;
-    xl: number | string;
-}
-export declare const useViewportSize: (props: useViewportSizeProps) => ViewportSize;
-/** utility used for stopping Event propagation.
- * @return stopPropagation a callback that calls stopPropagation on a general event */
-export declare const useStopEventPropagation: () => (event: Event) => void;
-/** custom hook use for providing filter functionality based on a text input field
- *  @param filterFunction make sure this is wrapped in a useCallback
- *  @param values items that should be filtered on (of type T) */
-export declare function useTextFilter<T>(values: T[], filterFunction: (value: T, filterValue: string) => boolean): [T[], string, Dispatch<SetStateAction<string>>];
-export declare const useSize: (target: RefObject<HTMLDivElement>) => DOMRectReadOnly | undefined;
 export declare const genericMemo: <T>(component: T) => T;
-export declare function useControlledState<TState>(initialState: TState, state?: TState, setState?: (state: TState) => void): [TState, (state: TState) => void];
 export declare function mergeRefs<T>(refs: Array<React.Ref<T> | undefined>): React.RefCallback<T>;
 export declare const stopPropagation: (e: SyntheticEvent) => void;
-export {};
+export declare function getSelectedState(selected: boolean): "selected" | "unselected";
+export declare function getCheckedState(checked: CheckedState): "checked" | "indeterminate" | "unchecked";
+export declare function getActiveState(active: boolean): "active" | "inactive";
+export declare function getBooleanState(value: boolean): "true" | "false";
+export declare function getOpenState(open: boolean): "open" | "closed";

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@overmap-ai/blocks",
-	"version": "1.0.40-overlay.1",
+	"version": "1.0.40-slide-out-resize-handle.0",
 	"description": "A collection of React components for building Overmap's UI.",
 	"author": "Wôrdn Inc.",
 	"license": "UNLICENSED",

package/dist/CheckboxGroup/utils.d.ts

@@ -1 +0,0 @@
-export declare function getBooleanState(value: boolean): "true" | "false";

package/dist/CollapsibleTree/CollapsibleTree.d.ts

@@ -1,5 +0,0 @@
-import { CollapsibleTreeProps } from './typings';
-/** The Collapsible Tree Component is a reusable UI element that displays hierarchical data in a tree structure.
- * Nodes in the tree can be expanded or collapsed to show or hide their children, allowing for an intuitive and
- * space-efficient way to navigate complex data structures.*/
-export declare const CollapsibleTree: <TMeta>(props: CollapsibleTreeProps<TMeta>) => import("react/jsx-runtime").JSX.Element;

package/dist/CollapsibleTree/context.d.ts

@@ -1,11 +0,0 @@
-import { CSSProperties } from 'react';
-import { NodeCallbacks, NodeRenderer } from './typings';
-interface ICollapsibleTreeContext<TMeta> extends NodeCallbacks<TMeta> {
-    nodeClassName?: string;
-    nodeStyles?: CSSProperties;
-    disabled: boolean;
-    nodeRenderer: NodeRenderer<TMeta>;
-}
-export declare const CollapsibleTreeContext: import('react').Context<ICollapsibleTreeContext<never>>;
-export declare function useCollapsibleTreeContext<TMeta>(): ICollapsibleTreeContext<TMeta>;
-export {};

package/dist/CollapsibleTree/index.d.ts

@@ -1,2 +0,0 @@
-export * from './CollapsibleTree';
-export * from './typings';

package/dist/CollapsibleTree/typings.d.ts

@@ -1,58 +0,0 @@
-import { CollapsibleProps } from '@radix-ui/react-collapsible';
-import { CSSProperties, ReactNode } from 'react';
-import { PropsWithClassNameAndStyle } from '../typings';
-export type NodeEventHandler<TMeta> = (meta: TMeta) => void;
-export interface NodeCallbacks<TMeta> {
-    /** callback fired when a specific TreeNode is clicked, regardless of the current open state of the specific
-     * TreeNode collapsible. */
-    onNodeClick?: NodeEventHandler<TMeta>;
-    /** callback fired when a specific TreeNode collapsible is opened. */
-    onNodeOpen?: NodeEventHandler<TMeta>;
-    /** callback fired when a specific TreeNode collapsible is closed. */
-    onNodeClose?: NodeEventHandler<TMeta>;
-}
-export type NodeRenderer<TMeta> = (args: {
-    /** passing any meta information defined for the given node*/
-    meta: TMeta;
-    /** a function to toggle the open state of the TreeNode, useful to define what content with the TreeNode is responsible
-     * for triggering the opening and closing of the TreeNode collapsible. */
-    toggleOpen: () => void;
-    /** the current open state of the TreeNode collapsible, useful for changing rendered content within the TreeNode
-     * based on its open state. */
-    open: boolean;
-    /** the current disabled state of the TreeNode, useful for changing rendered content or functionality based on if the
-     * TreeNode is disabled or not. */
-    disabled: boolean;
-}) => {
-    children: ReactNode;
-    className?: string;
-    style?: CSSProperties;
-};
-export interface TreeNodeProps<TMeta> extends Pick<CollapsibleProps, "disabled"> {
-    /** list of TreeNodes to be rendered within the current TreeNode collapsible */
-    nodes?: TreeNodeProps<TMeta>[];
-    /** any meta-information that should be attached to a given TreeNode uses the TMeta type to specifically type
-     * the structure of this meta-data. */
-    meta: TMeta;
-}
-export interface CollapsibleTreeProps<TMeta> extends PropsWithClassNameAndStyle, NodeCallbacks<TMeta> {
-    /** the TreeNode structure that should be rendered within the CollapsibleTree */
-    nodes: TreeNodeProps<TMeta>[];
-    /** disables all TreeNodes in the CollapsibleTree.
-     * @default false
-     * */
-    disabled?: boolean;
-    /** A className that will be applied to every TreeNode. Useful if all the TreeNodes are required to look
-     * the same stylistically. */
-    nodeClassName?: string;
-    /** styles that will be applied to every TreeNode. Useful if there are styles that need to be applied to all
-     * for stylistic consistency TreeNodes. */
-    nodeStyles?: CSSProperties;
-    /** a callback used to determine the content rendered within a TreeNode. The callback is passed with the following arguments,
-     * @param meta - TreeNodes meta object.
-     * @param toggleOpen - function to toggle the open state of a TreeNode.
-     * @param open - the current open state of the TreeNode collapsible.
-     * @param disabled - the current disabled state of the TreeNode collapsible.
-     * */
-    nodeRenderer: NodeRenderer<TMeta>;
-}

package/dist/CommandMenu/utils.d.ts

@@ -1,4 +0,0 @@
-import { CheckedState } from '../CheckedIndicator';
-export declare function getSelectedState(selected: boolean): "selected" | "unselected";
-export declare function getCheckedState(checked: CheckedState): "checked" | "indeterminate" | "unchecked";
-export declare function getActiveState(active: boolean): "active" | "inactive";

package/dist/Layout/SlideOut.d.ts

@@ -1,20 +0,0 @@
-import { ComponentPropsWithRef } from 'react';
-import { SlideOutProps } from '../SlideOut';
-export interface LayoutSlideOutProps extends Omit<SlideOutProps, "open" | "initialWidth">, Omit<ComponentPropsWithRef<"div">, "content"> {
-    /** controls if the SlideOut is initially open once mounted when NOT in smallMode.
-     * NOTE: changing the value of this will cause the SlideOut to open/close after mounting NOT in smallMode depending on
-     *  its passed in value.
-     * @default false */
-    defaultOpen?: {
-        small?: boolean;
-        large?: boolean;
-    };
-    /** optional prop to control the open state of the SlideOut */
-    open?: SlideOutProps["open"];
-    /** optional prop to control the initialWidth of the SlideOut
-     * @default "30%" */
-    initialWidth?: SlideOutProps["initialWidth"];
-    /** unique identifier for this SlideOut instance, used to manage its open/closed state within the Layout context */
-    id: string;
-}
-export declare const LayoutSlideOut: import('react').NamedExoticComponent<LayoutSlideOutProps>;

package/dist/Menu/ClickTrigger/index.d.ts

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

package/dist/Menu/Content/index.d.ts

@@ -1,2 +0,0 @@
-export * from './Content';
-export { useMenuContentContext } from './context';

package/dist/Menu/ContextTrigger/index.d.ts

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

package/dist/Menu/Group/index.d.ts

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

package/dist/Menu/Input/index.d.ts

@@ -1,3 +0,0 @@
-export * from './Field';
-export * from './Root';
-export * from './Slot';

package/dist/Menu/Item/index.d.ts

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

package/dist/Menu/Label/index.d.ts

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

package/dist/Menu/MultiSelectGroup/index.d.ts

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

package/dist/Menu/MultiSelectItem/index.d.ts

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

package/dist/Menu/PageContent/PageContent.d.ts

@@ -1,3 +0,0 @@
-import { FC } from 'react';
-import { MenuPageContentProps } from '../typings';
-export declare const MenuPageContent: FC<MenuPageContentProps>;

package/dist/Menu/PageContent/index.d.ts

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

package/dist/Menu/PageTrigger/index.d.ts

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

package/dist/Menu/Pages/index.d.ts

@@ -1,2 +0,0 @@
-export { usePagesContext } from './context';
-export * from './Pages';

package/dist/Menu/SelectAll/index.d.ts

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

package/dist/Menu/SelectGroup/index.d.ts

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

package/dist/Menu/SelectItem/index.d.ts

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

package/dist/Menu/SelectedIndicator/SelectedIndicator.d.ts

@@ -1,4 +0,0 @@
-import { ComponentPropsWithRef } from 'react';
-export interface MenuSelectedIndicatorProps extends ComponentPropsWithRef<"span"> {
-}
-export declare const MenuSelectedIndicator: import('react').NamedExoticComponent<MenuSelectedIndicatorProps>;

package/dist/Menu/SelectedIndicator/index.d.ts

@@ -1,2 +0,0 @@
-export { SelectedIndicatorContext, useSelectedIndicatorContext } from './context';
-export * from './SelectedIndicator';

package/dist/Menu/Separator/index.d.ts

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

package/dist/Menu/Sub/index.d.ts

@@ -1,2 +0,0 @@
-export { useSubContext } from './context';
-export * from './Sub';

package/dist/Menu/SubContent/index.d.ts

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

package/dist/Menu/SubTrigger/index.d.ts

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

package/dist/Menu/VirtualTrigger/index.d.ts

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

package/dist/Menu/root/index.d.ts

@@ -1,2 +0,0 @@
-export { useMenuContext } from './context';
-export * from './Root';

package/dist/SlideOut/SlideOut.d.ts

@@ -1,50 +0,0 @@
-import { ComponentPropsWithRef, PropsWithChildren, ReactNode } from 'react';
-import { PropsWithClassNameAndStyle } from '../typings';
-export interface SlideOutProps extends PropsWithChildren, Omit<ComponentPropsWithRef<"div">, "content">, PropsWithClassNameAndStyle {
-    /** The controlled open state of the SlideOut */
-    open: boolean;
-    /** specifies if the SlideOut is in modal mode or not.
-     * If in modal mode, onDismiss prop should be passed
-     * to the SlideOut component as well.
-     * @default false */
-    modal?: boolean;
-    /** hides the SlideOut and its overlay but doesn't change the open state of the SlideOut. Should be used if
-     * the SlideOut needs to be hidden for some reason but not triggering a close
-     * @default false
-     * */
-    hide?: boolean;
-    /** The side the SlideOut should position on and "slide-in" from */
-    side: "left" | "right";
-    /** controls if the SlideOut can be resized by the user
-     * @default true
-     * */
-    resizeable?: boolean;
-    /** controls the positioning of the SlideOut.
-     * When absolute, the SlideOut will overlay other
-     * content within its parent container.
-     * When relative, the SlideOut exists with and pushes other content within
-     * its parent container.
-     * @default "relative"
-     * */
-    position?: "relative" | "absolute";
-    /** sets the initialWidth of the SlideOut, can be expressed in any valid CSS size unit */
-    initialWidth: number | string;
-    /** sets the minimum width of the SlideOut can be expressed in any valid CSS size unit */
-    minWidth?: number | string;
-    /** sets the maximum width of the SlideOut can be expressed in any valid CSS size unit */
-    maxWidth?: number | string;
-    /** callback fired when the SlideOut should be dismissed (closed) when in modal mode. The type of event resulting in
-     * the SlideOut dismissal is passed with the callback. */
-    onDismiss?: () => void;
-    /** callback fired when the SlideOut has finished sliding out (closing) */
-    onClosed?: () => void;
-    /** callback fired when the SlideOut starts sliding in (opening) */
-    onOpening?: () => void;
-    /** overlay to be rendered when the SlideOut is open*/
-    overlayComponent?: ReactNode;
-    /** content to be rendered within the SlideOut */
-    content: ReactNode | null;
-}
-/** The SlideOut component is a UI element that allows you to create a slide-in/slide-out effect for content within
- * your application. It provides a smooth transition animation for revealing and hiding content. */
-export declare const SlideOut: import('react').NamedExoticComponent<SlideOutProps>;