@overmap-ai/blocks 1.0.30-clean-up.2 → 1.0.30

package/README.md

@@ -1,3 +1,3 @@
-# overmap-ai blocks
-
-Contains basic components used by overmap-ai libraries.
+# overmap-ai blocks
+
+Contains basic components used by overmap-ai libraries.

package/dist/Breadcrumb/Breadcrumb.d.ts

@@ -1,4 +1,5 @@
-import { Flex, Link } from "@radix-ui/themes";
+import { Link } from "@radix-ui/themes";
+import { FlexProps } from "../Flex";
 import { ComponentProps, HTMLProps, ReactNode } from "react";
 import { Severity } from "../typings";
 export interface BreadcrumbItemProps extends Omit<HTMLProps<HTMLAnchorElement>, "size" | "ref" | "color"> {
@@ -17,7 +18,7 @@ export interface BreadcrumbGroupProps extends Omit<HTMLProps<HTMLDivElement>, "h
     /** The gap between Breadcrumb items
      * @default "2"
      * */
-    gap?: ComponentProps<typeof Flex>["gap"];
+    gap?: FlexProps["gap"];
 }
 export declare const Group: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<BreadcrumbGroupProps & import("react").RefAttributes<HTMLDivElement>>>;
 export declare const Breadcrumb: {

package/dist/ButtonGroup/ButtonList.d.ts

@@ -18,7 +18,6 @@ interface ButtonListRootProps extends Pick<ButtonGroupProps, "size" | "variant"
 export declare const ButtonListRoot: FC<ButtonListRootProps>;
 interface ButtonListItemProps extends Omit<ButtonProps, "size" | "variant" | "severity" | "fluid"> {
 }
-/** @deprecated do not use */
 export declare const ButtonList: {
     Root: FC<ButtonListRootProps>;
     Item: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Omit<ButtonListItemProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>>;

package/dist/Checkbox/Checkbox.d.ts

@@ -0,0 +1,3 @@
+import { FC } from "react";
+import { CheckboxProps } from "./typings";
+export declare const Checkbox: FC<CheckboxProps>;

package/dist/Checkbox/SelectAllCheckbox.d.ts

@@ -0,0 +1,3 @@
+import { FC } from "react";
+import { SelectAllCheckboxProps } from "./typings";
+export declare const SelectAllCheckbox: FC<SelectAllCheckboxProps>;

package/dist/Checkbox/index.d.ts

@@ -0,0 +1,3 @@
+export { Checkbox } from "./Checkbox";
+export { SelectAllCheckbox } from "./SelectAllCheckbox";
+export * from "./typings";

package/dist/Checkbox/typings.d.ts

@@ -0,0 +1,16 @@
+import React, { ReactNode, ReactElement } from "react";
+import { Checkbox as RadixCheckbox } from "@radix-ui/themes";
+import { FlexProps } from "../Flex";
+export type RadixCheckboxProps = React.ComponentProps<typeof RadixCheckbox>;
+export type CheckboxValue = boolean | "indeterminate";
+export interface CheckboxProps extends RadixCheckboxProps {
+    className?: string;
+    labelClassName?: string;
+    label?: ReactNode;
+    doesLabelCheck?: boolean;
+    alwaysShow?: boolean;
+    checkboxPosition?: FlexProps["align"];
+}
+export interface SelectAllCheckboxProps extends Omit<CheckboxProps, "checked"> {
+    children: Array<ReactElement<CheckboxProps>>;
+}

package/dist/ConfirmEditInput/ConfirmEditInput.d.ts

@@ -0,0 +1,3 @@
+import { FC } from "react";
+import { ConfirmEditInputProps } from "./typings";
+export declare const ConfirmEditInput: FC<ConfirmEditInputProps>;

package/dist/ConfirmEditInput/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./ConfirmEditInput";
+export * from "./typings";

package/dist/ConfirmEditInput/typings.d.ts

@@ -0,0 +1,15 @@
+import { InputProps } from "../Input";
+import { ButtonProps } from "../Buttons/typings";
+import { ChangeEvent } from "react";
+export interface ConfirmEditInputProps extends InputProps {
+    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
+    onEditActivate?: (text: string | undefined) => void;
+    onEditConfirm?: (text: string | undefined) => void;
+    onEditCancel?: (text: string | undefined) => void;
+    textClassName?: string;
+    inputClassName?: string;
+    iconClassName?: string;
+    mode?: "buttons" | "keys";
+    buttonVariant?: ButtonProps["variant"];
+    buttonAlwaysVisible?: boolean;
+}

package/dist/Flex/Flex.d.ts

@@ -0,0 +1,17 @@
+import { ComponentProps } from "react";
+import { Flex as RadixFlex } from "@radix-ui/themes";
+export interface FlexProps extends ComponentProps<typeof RadixFlex> {
+    /** if true the border radius of the Flex container will match the one specified by the Theme
+     * @default false
+     * */
+    radius?: boolean;
+    /** if true sets the min-width of the Flex container to 0
+     * @default false
+     * */
+    zeroMinWidth?: boolean;
+    /** if true sets the min-height of the Flex container to 0
+     * @default false
+     * */
+    zeroMinHeight?: boolean;
+}
+export declare const Flex: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Omit<FlexProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>>;

package/dist/Flex/index.d.ts

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

package/dist/LeftAndRightPanels/LeftAndRightPanels.d.ts

@@ -0,0 +1,34 @@
+import { FC, ReactNode, ReactElement } from "react";
+export interface LeftAndRightPanelsProps {
+    /** content to be rendered within the center panel */
+    children: ReactNode;
+    /** state to determine whether to show or hide the left panel*/
+    showLeft?: boolean;
+    /** content to be rendered within the left panel*/
+    leftPanel?: ReactElement;
+    /** minimum width of the left panel when resizing */
+    leftMinWidth?: number;
+    /** maximum width of the left panel when resizing */
+    leftMaxWidth?: number;
+    /** state to determine whether to show or hide the right panel*/
+    showRight?: boolean;
+    /** content to be rendered within the left panel*/
+    rightPanel?: ReactElement;
+    /** minimum width of the left panel when resizing */
+    rightMinWidth?: number;
+    /** maximum width of the left panel when resizing */
+    rightMaxWidth?: number;
+    /** used to disable or enable resizing on the left and right panels */
+    resizeable?: {
+        left?: boolean;
+        right?: boolean;
+    };
+}
+/** Panels are graphical elements that divide a screen or window into distinct sections, each of which can contain
+ * different types of content or functionality. They are often used to organize and present information in a structured
+ * manner. In many graphical user interfaces (GUIs), panels are draggable and resizable, allowing users to customize
+ * the layout to suit their preferences. Panels can be used for a variety of purposes, such as displaying navigation
+ * menus, presenting data, providing tools or controls, or hosting multimedia content. LeftAndRightPanels renders main
+ * content and provides left and right resizable, toggleable panels. This component can be rendered within any element
+ * as its container and the Panels will be scoped to the height and appear to the left and right of that container. */
+export declare const LeftAndRightPanels: FC<LeftAndRightPanelsProps>;

package/dist/LeftAndRightPanels/index.d.ts

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

package/dist/MultiPagePopover/MultiPagePopover.d.ts

@@ -0,0 +1,3 @@
+import { FC } from "react";
+import { MultiPagePopoverProps } from "./typings";
+export declare const MultiPagePopover: FC<MultiPagePopoverProps>;

package/dist/MultiPagePopover/index.d.ts

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

package/dist/MultiPagePopover/typings.d.ts

@@ -0,0 +1,21 @@
+import React, { ReactNode } from "react";
+import { PopoverProps } from "../Popover/typings";
+export type MultiPagePopoverOption = {
+    value: string;
+    label: ReactNode;
+    page?: MultiPagePopoverPage;
+    onClick?: React.MouseEventHandler<HTMLElement>;
+    buttonClassName?: string;
+};
+export interface MultiPagePopoverPage {
+    title?: ReactNode;
+    options?: MultiPagePopoverOption[];
+    content?: ReactNode;
+    buttonsContainerClassName?: string;
+}
+export interface MultiPagePopoverProps extends Omit<PopoverProps, "content"> {
+    page: MultiPagePopoverPage;
+    className?: string;
+    direction?: "vertical" | "horizontal";
+    color: "light" | "dark";
+}

package/dist/OvermapErrorBoundary/OvermapErrorBoundary.d.ts

@@ -1,6 +1,7 @@
 import React from "react";
 interface ErrorBoundaryProps extends React.PropsWithChildren {
     absoluteCentering?: boolean;
+    message?: string;
 }
-export declare const OvermapErrorBoundary: React.MemoExoticComponent<(props: ErrorBoundaryProps) => import("react/jsx-runtime").JSX.Element>;
-export {};
+declare const OvermapErrorBoundary: React.MemoExoticComponent<(props: ErrorBoundaryProps) => import("react/jsx-runtime").JSX.Element>;
+export default OvermapErrorBoundary;

package/dist/OvermapMenu/typings.d.ts

@@ -1,9 +1,9 @@
-import { ComponentProps, PropsWithChildren, ReactElement } from "react";
+import { PropsWithChildren, ReactElement } from "react";
 import { VirtualElement } from "@floating-ui/react";
 import { OvermapItemProps } from "../OvermapItem";
 import { OvermapItemGroupProps } from "../OvermapItemGroup";
+import { SeparatorProps } from "../Separator";
 import { OvermapInputItemProps } from "../OvermapInputItem";
-import { Separator } from "@radix-ui/themes";
 export type MenuTriggerType = "click" | "context" | "virtual";
 export type MenuAlignment = "start" | "center" | "end";
 export type MenuSide = "top" | "right" | "bottom" | "left";
@@ -85,7 +85,7 @@ export interface PageContentProps extends PropsWithChildren {
 export interface PageTriggerProps extends Omit<MenuItemProps, "closeOnSelect"> {
     page: string;
 }
-export interface MenuSeparatorProps extends ComponentProps<typeof Separator> {
+export interface MenuSeparatorProps extends SeparatorProps {
     extend?: boolean;
     spacingAbove?: boolean;
     spacingBelow?: boolean;

package/dist/Select/Select.d.ts

@@ -1,4 +1,3 @@
 import { FC } from "react";
 import { SelectProps } from "./typings.ts";
-/** @deprecated do not use */
 export declare const Select: FC<SelectProps>;

package/dist/Separator/Separator.d.ts

@@ -0,0 +1,3 @@
+import { FC } from "react";
+import { SeparatorProps } from "./typings";
+export declare const Separator: FC<SeparatorProps>;

package/dist/Separator/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Separator";
+export * from "./typings";

package/dist/Separator/typings.d.ts

@@ -0,0 +1,20 @@
+import { Flex, Text, Separator as RadixSeparator, MarginProps } from "@radix-ui/themes";
+import { ComponentProps } from "react";
+import { Severity } from "../typings";
+export interface SeparatorProps extends Omit<ComponentProps<typeof RadixSeparator>, "color" | "asChild" | keyof MarginProps> {
+    /** text to be displayed in the middle of the separator */
+    text?: string;
+    /** when text is passed in, gap specifies the distance between the left and right separators and the text
+     * @default "1"
+     * */
+    gap?: ComponentProps<typeof Flex>["gap"];
+    /** the weight of the text
+     * @default "light"
+     * */
+    textWeight?: ComponentProps<typeof Text>["weight"];
+    /** severity of the separator
+     * @default "info"
+     * */
+    severity?: Severity;
+    weight?: "light" | "medium" | "bold" | "full";
+}

package/dist/Sidebar/Sidebar.d.ts

@@ -0,0 +1,30 @@
+/// <reference types="react" />
+import { DialogContentProps } from "@radix-ui/react-dialog";
+interface SidebarProps extends Omit<DialogContentProps, "asChild" | "forceMount"> {
+    /** determines what side the Sidebar appears from within its rendered container */
+    side?: "left" | "right";
+    /** when true, interactions with any elements outside the Sidebar will be disabled */
+    modal?: boolean;
+    /** The minimum width to which the Sidebar can be resized to
+     * @default 300px
+     * */
+    minWidth?: number | string;
+    /** The maximum width to which the Sidebar can be resized to
+     * @default 500px
+     * */
+    maxWidth?: number | string;
+    /** determines if the Sidebar can be resized
+     * @default true
+     * */
+    resizable?: boolean;
+    /** prop to control whether the Sidebar is open or not */
+    open?: boolean;
+    /** a selector string for the desired container for the Sidebar to render within
+     * @default '[data-is-root-theme="true"]'
+     * */
+    containerSelector?: string;
+    /** determine whether the Sidebar also renders with an Overlay*/
+    overlay?: boolean;
+}
+export declare const Sidebar: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<SidebarProps & import("react").RefAttributes<HTMLDivElement>>>;
+export {};

package/dist/Sidebar/index.d.ts

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

package/dist/Table/Table.d.ts

@@ -0,0 +1,3 @@
+import { FC } from "react";
+import { TableProps } from "./typings";
+export declare const Table: FC<TableProps>;

package/dist/Table/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Table";
+export * from "./typings.ts";

package/dist/Table/typings.d.ts

@@ -0,0 +1,70 @@
+import { ReactElement, ReactNode } from "react";
+export type IdLabel = string | number;
+export type ValueLabel = IdLabel | null | undefined;
+export type TableLabel = ValueLabel | ReactNode;
+export interface FilterValue {
+    value: ValueLabel;
+    label: ReactNode;
+}
+export interface TableCell {
+    id: IdLabel;
+    value: ValueLabel;
+    label: TableLabel;
+    onClick?: (e: Event) => void;
+    filterValue?: ValueLabel;
+    sortValue?: ValueLabel;
+    searchValue?: ValueLabel;
+    disabled?: boolean;
+    className?: string;
+}
+export interface TableColumn {
+    id: IdLabel;
+    label: TableLabel;
+    sort?: boolean;
+    search?: boolean;
+    filter?: boolean;
+    width?: string;
+    maxWidth?: string;
+    className?: string;
+    disabled?: boolean;
+    filterValues?: FilterValue[];
+}
+export interface TableRow {
+    id: IdLabel;
+    onClick?: (row: TableRow) => void;
+    className?: string;
+    disabled?: boolean;
+    loading?: boolean;
+    columns: {
+        [columnId: string]: TableCell;
+    };
+    decorator?: (row: ReactElement) => ReactElement;
+}
+export interface TableProps {
+    columns: TableColumn[];
+    data: TableRow[];
+    color?: "light" | "dark";
+    title?: string | ReactNode;
+    description?: string | ReactNode;
+    defaultRowsPerPage?: number;
+    rowsPerPage?: number[];
+    fixHeader?: boolean;
+    showSearchBar?: boolean;
+    searchBarPlaceholder?: string;
+    showSelect?: boolean;
+    showFilterButton?: boolean;
+    showContainer?: boolean;
+    showRowsPerPage?: boolean;
+    showPageNumber?: boolean;
+    showPageNavigation?: boolean;
+    children?: ReactNode;
+    topBarComponents?: ReactNode;
+    showTopBar?: boolean;
+    showBottomBar?: boolean;
+    emptyMessage?: string;
+    containerClassName?: string;
+    className?: string;
+    columnClassName?: string;
+    rowClassName?: string;
+    cellClassName?: string;
+}

package/dist/Text/Text.d.ts

@@ -0,0 +1,24 @@
+import { FC, ForwardRefExoticComponent } from "react";
+import { MarginProps, Text as RadixText } from "@radix-ui/themes";
+import { Severity } from "../typings";
+type RadixTextProps = typeof RadixText extends ForwardRefExoticComponent<infer P> ? P : never;
+export type TextProps = Omit<RadixTextProps, keyof MarginProps | "ref" | "asChild" | "color"> & {
+    /** If true, the text will not wrap, but instead will truncate with a text overflow ellipsis.
+     * @default false
+     */
+    noWrap?: boolean;
+    severity?: Severity;
+    /** @default span */
+    as?: RadixTextProps["as"];
+    /** @default 3 */
+    size?: RadixTextProps["size"];
+};
+/**
+ * A foundational text primitive.
+ *
+ * Use the `as` prop to render text as a `p`, `label`, `div` or `span`. This prop is purely semantic and does not alter visual appearance.
+ *
+ * For the complete documentation, refer to https://www.radix-ui.com/themes/docs/components/text.
+ */
+export declare const Text: FC<TextProps>;
+export {};

package/dist/Text/index.d.ts

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

package/dist/ToggleGroup/ToggleGroup.d.ts

@@ -0,0 +1,7 @@
+import { FC } from "react";
+import { ToggleGroupSingleProps } from "./typings";
+/** The Toggle Group Component is a user interface element that allows users to select a single option from a set of
+ * mutually exclusive choices. It is commonly used in situations where users need to make a single selection from a
+ * predefined list of options. This component is built using the ButtonGroup and IconButton components in combination
+ * with the Radix Toggle Group primitive found here https://www.radix-ui.com/primitives/docs/components/toggle-group */
+export declare const ToggleGroup: FC<ToggleGroupSingleProps>;

package/dist/ToggleGroup/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./ToggleGroup";
+export * from "./typings";

package/dist/ToggleGroup/typings.d.ts

@@ -0,0 +1,7 @@
+import { ToggleGroupItemProps as RadixToggleGroupItemProps, ToggleGroupSingleProps as RadixToggleGroupSingleProps } from "@radix-ui/react-toggle-group";
+import { ButtonGroupProps } from "../ButtonGroup";
+export interface ToggleGroupItemProps extends Omit<RadixToggleGroupItemProps, "asChild"> {
+}
+export interface ToggleGroupSingleProps extends Omit<RadixToggleGroupSingleProps, "dir" | "orientation">, Omit<ButtonGroupProps, "children" | "defaultValue" | "variant"> {
+    items: ToggleGroupItemProps[];
+}

package/dist/Toolbar/Toolbar.d.ts

@@ -0,0 +1,23 @@
+import { ToolbarProps } from "@radix-ui/react-toolbar";
+import { ComponentProps, FC, ReactNode } from "react";
+import { Flex } from "../Flex";
+interface ToolBarRootProps extends Omit<ToolbarProps, "dir" | "asChild" | "orientation"> {
+    /** the minimum gap between the left and right content in the Toolbar*/
+    minContentGap?: ComponentProps<typeof Flex>["gap"];
+}
+/** The Toolbar component is commonly used in web development to create a horizontal bar that contains various UI
+ * elements, typically used for navigation, actions, or other functionalities. */
+export declare const Root: FC<ToolBarRootProps>;
+interface ContentProps {
+    children: ReactNode;
+    /** spacing between the items in the content of the Toolbar
+     * @default "2"
+     * */
+    gap?: ComponentProps<typeof Flex>["gap"];
+}
+export declare const Toolbar: {
+    Root: FC<ToolBarRootProps>;
+    LeftContent: FC<ContentProps>;
+    RightContent: FC<ContentProps>;
+};
+export {};

package/dist/Toolbar/index.d.ts

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