@overmap-ai/blocks 0.0.11-alpha.1 → 1.0.0

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

@@ -0,0 +1,27 @@
+import { Link } from "@radix-ui/themes";
+import { FlexProps } from "../Flex";
+import { ComponentProps, HTMLProps, ReactNode } from "react";
+import { Severity } from "../typings.ts";
+export interface BreadcrumbItemProps extends Omit<HTMLProps<HTMLAnchorElement>, "size" | "ref" | "color"> {
+}
+export declare const Item: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<BreadcrumbItemProps & import("react").RefAttributes<HTMLAnchorElement>>>;
+export interface BreadcrumbGroupProps extends Omit<HTMLProps<HTMLDivElement>, "height" | "width" | "wrap" | "ref" | "size"> {
+    children: ReactNode;
+    /** The separator used in between Breadcrumb items*/
+    separator: ReactNode;
+    /** The severity of the items in the Breadcrumb
+     * @default "info"
+     * */
+    severity?: Severity;
+    /** The text size of the items in the Breadcrumb */
+    size?: ComponentProps<typeof Link>["size"];
+    /** The gap between Breadcrumb items
+     * @default "2"
+     * */
+    gap?: FlexProps["gap"];
+}
+export declare const Group: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<BreadcrumbGroupProps & import("react").RefAttributes<HTMLDivElement>>>;
+export declare const Breadcrumb: {
+    Group: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<BreadcrumbGroupProps & import("react").RefAttributes<HTMLDivElement>>>;
+    Item: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<BreadcrumbItemProps & import("react").RefAttributes<HTMLAnchorElement>>>;
+};

package/dist/Breadcrumb/context.d.ts

@@ -0,0 +1,10 @@
+import type { Severity } from "../typings.ts";
+import { ComponentProps } from "react";
+import { Link } from "@radix-ui/themes";
+interface IBreadcrumbContext {
+    severity: Severity;
+    size: ComponentProps<typeof Link>["size"];
+}
+export declare const BreadcrumbContext: import("react").Context<IBreadcrumbContext>;
+export declare const useBreadcrumbContext: () => IBreadcrumbContext;
+export {};

package/dist/Breadcrumb/index.d.ts

@@ -0,0 +1,2 @@
+export { Breadcrumb } from "./Breadcrumb";
+export type { BreadcrumbGroupProps, BreadcrumbItemProps } from "./Breadcrumb";

package/dist/CornerBadge/CornerBadge.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from "react";
+import { BadgeProps } from "../Badge";
+export interface CornerBadgeProps extends BadgeProps {
+    children: ReactNode;
+}
+export declare const CornerBadge: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Omit<CornerBadgeProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>>;

package/dist/CornerBadge/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./CornerBadge";
+export type { CornerBadgeProps } from "./CornerBadge";

package/dist/DropdownMenu/DropdownMenu.d.ts

@@ -1,12 +1,21 @@
-import { FC } from "react";
-import { DropdownMenuItemGroupProps, DropdownMenuItemProps, DropdownMenuProps, DropdownSubMenuProps } from "./typings.ts";
+import { DropdownMenu as RadixDropdownMenu } from "@radix-ui/themes";
+import { ComponentProps, FC, ReactElement, ReactNode } from "react";
+import { Severity } from "../typings.ts";
+export interface DropdownMenuItemProps extends Omit<ComponentProps<typeof RadixDropdownMenu.Item>, "textValue" | "asChild" | "children" | "color" | "content"> {
+    content: ReactNode;
+    closeOnSelect?: boolean;
+    separator?: boolean;
+}
+export interface DropdownMenuProps extends Omit<ComponentProps<typeof RadixDropdownMenu.Content>, "asChild" | "color" | "children"> {
+    severity?: Severity;
+    disabled?: boolean;
+    label?: string;
+    trigger: ReactElement;
+    items: DropdownMenuItemProps[];
+    modal?: boolean;
+    closeOnSelect?: boolean;
+}
 /** The DropdownMenu component is a user interface element that provides a list of options for the user to choose from.
  * It is commonly used in web applications to present a set of related choices in a compact and organized manner.
  * This DropdownMenu component is a wrapper around the Radix-UI DropdownMenu component that can be found here https://www.radix-ui.com/themes/docs/components/dropdown-menu */
-export declare const Root: FC<DropdownMenuProps>;
-export declare const DropdownMenu: {
-    Root: FC<DropdownMenuProps>;
-    ItemGroup: FC<DropdownMenuItemGroupProps>;
-    Item: FC<DropdownMenuItemProps>;
-    SubMenu: FC<DropdownSubMenuProps>;
-};
+export declare const DropdownMenu: FC<DropdownMenuProps>;

package/dist/DropdownMenu/index.d.ts

@@ -1,2 +1,2 @@
 export { DropdownMenu } from "./DropdownMenu";
-export * from "./typings.ts";
+export type { DropdownMenuProps, DropdownMenuItemProps } from "./DropdownMenu";

package/dist/DropdownSelect/DropdownSelect.d.ts

@@ -0,0 +1,58 @@
+import { DropdownMenu as RadixDropdownMenu } from "@radix-ui/themes";
+import { ComponentProps, FC, ReactElement, ReactNode } from "react";
+import { Severity } from "../typings.ts";
+export interface DropdownSelectIconProps {
+    leftInputIcon?: ReactNode;
+    rightInputIcon?: ReactNode;
+    selectedItemIcon?: ReactNode;
+}
+export interface DropdownSelectItemProps {
+    /** the content to rendered for the dropdown select item */
+    content: ReactNode;
+    value: string;
+    /** the disabled state of the dropdown select item
+     * @default false
+     * */
+    disabled?: boolean;
+}
+export type DropdownSelectProps = {
+    /** currently selected value of the dropdown select*/
+    value: string | undefined;
+    /** callback fired when an item in the dropdown select is clicked*/
+    onValueChange: (value: string | undefined) => void;
+    /** a ReactElement representing the trigger for the dropdown select, must be clickable*/
+    trigger: ReactElement;
+    /** the selectable items to be displayed in the dropdown select */
+    items: DropdownSelectItemProps[];
+    /** the disabled state of the dropdown select
+     * @default false
+     * */
+    disabled?: boolean;
+    /** placeholder for the user input contained within the dropdown select */
+    placeholder?: string;
+    /** determines if the dropdown select should close after selecting an item
+     * @default true
+     * */
+    closeOnSelect?: boolean;
+    /** a set of icons to be fill the different icon spots within the dropdown select */
+    icons?: DropdownSelectIconProps;
+    /** determines on which side of the trigger the dropdown select renders on, if open space
+     * @default "bottom"
+     * */
+    side?: ComponentProps<typeof RadixDropdownMenu.Content>["side"];
+    /** severity of the dropdown select
+     * @default "info"
+     * */
+    severity?: Severity;
+} & ({
+    /** the current value in the user input contained within the dropdown select */
+    filterValue: undefined;
+    /** callback fired when an item in the dropdown select is clicked*/
+    onFilterValueChange: undefined;
+} | {
+    /** the current value in the user input contained within the dropdown select */
+    filterValue: string;
+    /** callback fired when an item in the dropdown select is clicked*/
+    onFilterValueChange: (value: string) => void;
+});
+export declare const DropdownSelect: FC<DropdownSelectProps>;

package/dist/DropdownSelect/index.d.ts

@@ -0,0 +1,2 @@
+export { DropdownSelect } from "./DropdownSelect";
+export type { DropdownSelectProps, DropdownSelectItemProps, DropdownSelectIconProps } from "./DropdownSelect";

package/dist/IconColorUtility/IconColorUtility.d.ts

@@ -0,0 +1,17 @@
+import { ComponentProps, ReactElement } from "react";
+import { Theme } from "@radix-ui/themes";
+import { Severity } from "../typings.ts";
+interface IconColorUtilityProps {
+    children: ReactElement;
+}
+interface IconColorUtilitySeverityProps extends IconColorUtilityProps {
+    severity: Severity;
+    color?: undefined;
+}
+interface IconColorUtilityColorProps extends IconColorUtilityProps {
+    color: Exclude<ComponentProps<typeof Theme>["accentColor"], undefined>;
+    severity?: undefined;
+}
+/** This component is used to provide Icons color based on Severity or a Radix theme accentColor */
+export declare const IconColorUtility: import("react").NamedExoticComponent<IconColorUtilitySeverityProps | IconColorUtilityColorProps>;
+export {};

package/dist/IconColorUtility/index.d.ts

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

package/dist/Input/typings.d.ts

@@ -3,11 +3,12 @@ import { Responsive, TextField as RadixTextField } from "@radix-ui/themes";
 import { Severity, Size } from "../typings.ts";
 import { MarginProps } from "@radix-ui/themes";
 type TextFieldInputProps = React.ComponentProps<typeof RadixTextField.Input>;
-export interface InputProps extends Omit<TextFieldInputProps, "size" | "color" | "radius" | keyof MarginProps> {
+export interface InputProps extends Omit<TextFieldInputProps, "size" | "color" | "radius" | "variant" | keyof MarginProps> {
     leftSlot?: React.ReactNode;
     rightSlot?: React.ReactNode;
     size?: Responsive<Size>;
-    severity?: Exclude<Severity, "success" | "info">;
+    severity?: Severity;
     showInputLength?: boolean;
+    variant?: TextFieldInputProps["variant"] | "ghost";
 }
 export {};

package/dist/Table/Table.d.ts

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

package/dist/TextArea/typings.d.ts

@@ -1,7 +1,7 @@
 import { ComponentProps } from "react";
 import { TextArea as RadixTextArea, MarginProps } from "@radix-ui/themes";
 import { Severity } from "../typings.ts";
-export interface TextAreaProps extends Omit<ComponentProps<typeof RadixTextArea>, keyof MarginProps | "color"> {
+export interface TextAreaProps extends Omit<ComponentProps<typeof RadixTextArea>, keyof MarginProps | "color" | "variant"> {
     /** used to set the severity of the TextArea, supports all 5 global severities
      * @default "primary"
      * */
@@ -12,4 +12,5 @@ export interface TextAreaProps extends Omit<ComponentProps<typeof RadixTextArea>
     showInputLength?: boolean;
     resize: "vertical" | "horizontal" | "both";
     inputLengthTemplate?: string;
+    variant?: ComponentProps<typeof RadixTextArea>["variant"] | "ghost";
 }

package/dist/Toast/typings.d.ts

@@ -47,4 +47,5 @@ export interface IToastContext {
     showSuccess: (simpleMessage: SimpleToastProps) => void;
     showInfo: (simpleMessage: SimpleToastProps) => void;
     showError: (simpleMessage: SimpleToastProps) => void;
+    showWarning: (simpleMessage: SimpleToastProps) => void;
 }