@baseline-ui/core 0.60.0 → 0.61.0

package/dist/components/Actionable/Actionable.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-import type { ActionableProps } from "./Actionable.types";
-export declare const Actionable: React.ForwardRefExoticComponent<ActionableProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/components/Actionable/Actionable.types.d.ts

@@ -1,15 +0,0 @@
-import type { ActionButtonProps, StylingWithUIState, UIStateOptions } from "../ActionButton/ActionButton.types";
-import type React from "react";
-import type { AriaButtonOptions } from "react-aria";
-export interface ActionableProps extends StylingWithUIState<UIStateOptions>, Omit<AriaButtonOptions<"button">, "elementType">, Pick<ActionButtonProps, "elementType"> {
-    /** A single React element that accepts style and className props. */
-    children: React.ReactElement<{
-        className?: string;
-        style?: React.CSSProperties;
-        [key: string]: unknown;
-    }>;
-    /** The class name applied to the child element. */
-    childClassName?: string | ((props: UIStateOptions) => string);
-    /** The style applied to the child element. */
-    childStyle?: React.CSSProperties | ((props: UIStateOptions) => React.CSSProperties);
-}

package/dist/components/Actionable/index.d.ts

@@ -1,3 +0,0 @@
-export { Actionable } from "./Actionable";
-export { type ActionableProps } from "./Actionable.types";
-export * from "./Actionable";

package/dist/components/AlertDialog/AlertDialog.css.d.ts

@@ -1,26 +0,0 @@
-export declare const minHeightCn: string;
-export declare const alertFooterButtonCn: string;
-export declare const alertHeaderCn: ((options?: {
-    hasTitleAndIcon?: boolean | undefined;
-    hasNoCloseBtn?: boolean | undefined;
-} | undefined) => string) & {
-    variants: () => ("hasTitleAndIcon" | "hasNoCloseBtn")[];
-    classNames: import("@baseline-ui/css").RecipeClassNames<{
-        hasTitleAndIcon: {
-            true: {
-                "__@@Component_Sprinkles__": boolean;
-                baseSprinkles: string;
-                variantSprinkles: string;
-                compoundVariantSprinkles: string;
-            };
-        };
-        hasNoCloseBtn: {
-            true: {
-                "__@@Component_Sprinkles__": boolean;
-                baseSprinkles: string;
-                variantSprinkles: string;
-                compoundVariantSprinkles: string;
-            };
-        };
-    }>;
-};

package/dist/components/AlertDialog/AlertDialog.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-import type { AlertDialogProps } from "./AlertDialog.types";
-export declare const AlertDialog: React.ForwardRefExoticComponent<AlertDialogProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/AlertDialog/AlertDialog.types.d.ts

@@ -1,77 +0,0 @@
-import type { StylingProps } from "../../utils";
-import type { IconProps } from "../Icon";
-import type { TextInputProps } from "../TextInput";
-import type { AriaLabelingProps } from "@react-types/shared";
-import type React from "react";
-export interface AlertDialogProps extends StylingProps, AriaLabelingProps {
-    /**
-     * The title of the dialog. This is the main heading of the dialog and is
-     * displayed at the top of the dialog.
-     */
-    title: string;
-    /**
-     * The message of the dialog. This is the main content of the dialog and is
-     * displayed below the title.
-     */
-    message?: React.ReactNode;
-    /**
-     * The label for the cancel button. This is the text that is displayed on the
-     * button that allows the user to cancel the dialog.
-     */
-    cancelLabel?: string;
-    /** The class name for the cancel button. */
-    cancelClassName?: string;
-    /**
-     * The label for the confirm button. This is the text that is displayed on the
-     * button that allows the user to confirm the dialog.
-     */
-    primaryActionLabel?: string;
-    /** The class name for the primary action button. */
-    primaryActionClassName?: string;
-    /**
-     * The function that is called when the user confirms the dialog. This is
-     * called when the user clicks the primary action button.
-     */
-    onPrimaryAction?: () => void;
-    /**
-     * The function that is called when the user cancels the dialog. This is
-     * called when the user clicks the cancel button. Also called when the close
-     * button (X) is clicked, unless `onClose` is provided.
-     */
-    onCancel?: () => void;
-    /**
-     * Called when the user clicks the close button (X). If not provided, falls
-     * back to `onCancel`.
-     */
-    onClose?: () => void;
-    /** The button that should be focused when the dialog is opened. */
-    autoFocusButton?: "primary" | "cancel";
-    /** Whether the primary action button should be disabled. */
-    isPrimaryActionDisabled?: boolean;
-    /**
-     * The props that are passed to the text input. If this is provided, a text
-     * input will be displayed at the bottom of the dialog.
-     */
-    textInputProps?: TextInputProps;
-    /**
-     * The icon that is displayed at the top of the dialog. This is typically used
-     * to display an icon that represents the type of alert that is being shown.
-     */
-    icon?: React.FC<IconProps>;
-    /** The color of the icon. This is the color that is used to fill the icon. */
-    iconColor?: string;
-    /** The class name for the content area below the title. */
-    contentClassName?: string;
-    /** The class name for the close button. */
-    closeButtonClassName?: string;
-    /** The class name for the button group wrapper. */
-    buttonsClassName?: string;
-    /**
-     * Whether the close button should be displayed in the top end corner of the
-     * dialog. If this is `true`, a close button will be displayed. If this is
-     * `false`, no close button will be displayed.
-     *
-     * @default true
-     */
-    showCloseButton?: boolean;
-}

package/dist/components/AlertDialog/index.d.ts

@@ -1,3 +0,0 @@
-export { AlertDialog } from "./AlertDialog";
-export { type AlertDialogProps } from "./AlertDialog.types";
-export * from "./AlertDialog";

package/dist/components/AudioPlayer/AudioPlayer.css.d.ts

@@ -1,3 +0,0 @@
-export declare const audioPlayerCn: string;
-export declare const mediaProgressCn: string;
-export declare const mediaPlayerCn: string;

package/dist/components/AudioPlayer/AudioPlayer.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-import type { AudioPlayerProps } from "./AudioPlayer.types";
-export declare const AudioPlayer: React.ForwardRefExoticComponent<AudioPlayerProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/AudioPlayer/AudioPlayer.types.d.ts

@@ -1,27 +0,0 @@
-import type { StylingProps } from "../../utils";
-import type { AriaLabelingProps } from "@react-types/shared";
-export interface AudioPlayerProps extends StylingProps, AriaLabelingProps {
-    /**
-     * The sources of the audio file. The `url` is the URL of the audio file, and
-     * the `type` is the MIME type of the audio file.
-     *
-     * ```tsx
-     * <AudioPlayer
-     *  sources={[
-     *    { url: "/sound.mp3", type: "audio/mpeg" },
-     *    { url: "/sound.ogg", type: "audio/ogg" },
-     *  ]}
-     * />
-     * ```
-     */
-    sources: {
-        url: string;
-        type: string;
-    }[];
-    /**
-     * The size of the audio player.
-     *
-     * @default "lg"
-     */
-    size?: "sm" | "lg";
-}

package/dist/components/AudioPlayer/index.d.ts

@@ -1,3 +0,0 @@
-export { AudioPlayer } from "./AudioPlayer";
-export { type AudioPlayerProps } from "./AudioPlayer.types";
-export * from "./AudioPlayer";

package/dist/components/Avatar/Avatar.css.d.ts

@@ -1,19 +0,0 @@
-export declare const userCn: import("@vanilla-extract/recipes").RuntimeFn<{
-    size: {
-        md: {
-            height: number;
-            width: number;
-        };
-        sm: {
-            height: number;
-            width: number;
-        };
-    };
-    isDisabled: {
-        true: {
-            opacity: `var(--${string})`;
-        };
-    };
-}>;
-export declare const userImgCn: string;
-export declare const notificationCn: string;

package/dist/components/Avatar/Avatar.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-import type { AvatarProps } from "./Avatar.types";
-export declare const Avatar: React.ForwardRefExoticComponent<AvatarProps & React.RefAttributes<HTMLSpanElement>>;

package/dist/components/Avatar/Avatar.types.d.ts

@@ -1,31 +0,0 @@
-import type { StylingProps } from "../../utils";
-import type { SVGRProps } from "../Icon";
-import type React from "react";
-export interface AvatarProps extends StylingProps {
-    /**
-     * The size of the component.
-     *
-     * @default "md"
-     */
-    size?: "md" | "sm";
-    /**
-     * The icon to display. This icon has to be imported from the
-     * `@baseline-ui/icons` package.
-     */
-    icon?: React.FC<SVGRProps>;
-    /** The name of the user. */
-    name: string;
-    /** The URL of the image to display. */
-    imgSrc?: string;
-    /**
-     * The image loading strategy to use. See
-     * [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attributes:~:text=a%20fallback%20destination.-,loading,-Indicates%20how%20the)
-     */
-    imgLoading?: "lazy" | "eager";
-    /** Whether to show the initials of the user if no image is provided. */
-    showInitials?: boolean;
-    /** Whether the component is disabled. */
-    isDisabled?: boolean;
-    /** Whether the user has a notification. */
-    hasNotifications?: boolean;
-}

package/dist/components/Avatar/index.d.ts

@@ -1,2 +0,0 @@
-export { Avatar } from "./Avatar";
-export { type AvatarProps } from "./Avatar.types";

package/dist/components/Box/Box.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-import type { BoxProps } from "./Box.types";
-export declare const Box: React.ForwardRefExoticComponent<BoxProps & React.RefAttributes<HTMLElement>>;

package/dist/components/Box/Box.types.d.ts

@@ -1,12 +0,0 @@
-import type { ReactAriaIncompatibleKey, StylingProps } from "../../utils";
-import type { Sprinkles } from "@baseline-ui/tokens";
-import type { DOMAttributes } from "@react-types/shared";
-import type { HTMLAttributes, ReactNode } from "react";
-export type SprinkleProps = Parameters<Sprinkles>[0];
-export interface BoxProps extends Pick<StylingProps, "data-block-id">, Omit<HTMLAttributes<HTMLElement>, ReactAriaIncompatibleKey | "color">, Omit<DOMAttributes<HTMLElement>, ReactAriaIncompatibleKey>, SprinkleProps {
-    /**
-     * @default "div"
-     */
-    elementType?: any;
-    children?: ReactNode;
-}

package/dist/components/Box/index.d.ts

@@ -1,3 +0,0 @@
-export { Box } from "./Box";
-export { type BoxProps } from "./Box.types";
-export * from "./Box";

package/dist/components/ButtonSelect/ButtonSelect.css.d.ts

@@ -1,3 +0,0 @@
-export declare const containerCn: string;
-export declare const selectTriggerCn: string;
-export declare const selectCn: string;

package/dist/components/ButtonSelect/ButtonSelect.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-import type { ButtonSelectProps } from "./ButtonSelect.types";
-export declare const ButtonSelect: React.ForwardRefExoticComponent<ButtonSelectProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/ButtonSelect/ButtonSelect.types.d.ts

@@ -1,56 +0,0 @@
-import type { StylingProps } from "../../utils";
-import type { SelectProps } from "../Select";
-import type { ListOption } from "../shared/types/List";
-import type { ToggleButtonProps } from "../ToggleButton";
-import type { TooltipProps } from "../Tooltip";
-import type { AriaLabelingProps, PressEvent } from "@react-types/shared";
-import type React from "react";
-type ButtonBehaviour = "toggle" | "action";
-export interface ButtonSelectProps extends StylingProps, Pick<SelectProps<"single">, "isDisabled" | "validationState" | "onSelectionChange" | "selectedKey" | "defaultSelectedKey" | "items" | "isOpen" | "defaultOpen" | "triggerClassName" | "triggerStyle" | "disabledKeys">, Pick<ToggleButtonProps, "onPress" | "isSelected" | "defaultSelected" | "excludeFromTabOrder">, AriaLabelingProps {
-    /**
-     * The size of the button.
-     *
-     * @default "md"
-     */
-    size?: "md" | "lg";
-    /**
-     * Whether to hide the label in the button.
-     *
-     * @default false
-     */
-    hideLabel?: boolean;
-    /** A callback that is called when the button selection changes. */
-    onButtonSelectionChange?: (options: {
-        isSelected: boolean;
-        selectedKey: string;
-    }) => void;
-    /** The aria-label for the select button. */
-    moreAriaLabel?: string;
-    /** A function that is called to get the class name for the option. */
-    optionClassName?: string | ((item: ListOption, options: {
-        isButton: boolean;
-        isSelected: boolean;
-    }) => string);
-    /** A function that is called to get the style for the option. */
-    optionStyle?: React.CSSProperties | ((item: ListOption, options: {
-        isButton: boolean;
-        isSelected: boolean;
-    }) => React.CSSProperties);
-    /** Props for the tooltip. */
-    tooltipProps?: Omit<TooltipProps, "children"> | ((trigger: "button" | "select") => Omit<TooltipProps, "children">);
-    /**
-     * The behaviour of the button select.
-     *
-     * @default "toggle"
-     */
-    buttonBehaviour?: ButtonBehaviour | ((activeKey: string) => ButtonBehaviour);
-    /** A callback that is called when the button is pressed. */
-    onButtonAction?: (options: {
-        isSelected: boolean;
-        selectedKey: string;
-        buttonBehaviour: ButtonBehaviour;
-    }) => void;
-    /** A callback that is called when the option in the dropdown is pressed. */
-    onOptionPress?: (e: PressEvent, key: string) => void;
-}
-export {};

package/dist/components/ButtonSelect/index.d.ts

@@ -1,3 +0,0 @@
-export { ButtonSelect } from "./ButtonSelect";
-export { type ButtonSelectProps } from "./ButtonSelect.types";
-export * from "./ButtonSelect";

package/dist/components/Calendar/Calendar.css.d.ts

@@ -1,135 +0,0 @@
-export declare const calendarContainerCn: ((options?: {
-    size?: "xs" | "sm" | undefined;
-} | undefined) => string) & {
-    variants: () => "size"[];
-    classNames: import("@baseline-ui/css").RecipeClassNames<{
-        size: {
-            xs: {
-                width: number;
-            };
-            sm: {
-                width: number;
-            };
-        };
-    }>;
-};
-export declare const calendarCn: string;
-export declare const calendarHeaderTitleCn: string;
-export declare const calendarGridBodyCn: string;
-export declare const calendarGridCn: string;
-export declare const calendarHeaderCellCn: ((options?: {
-    size?: "xs" | "sm" | undefined;
-} | undefined) => string) & {
-    variants: () => "size"[];
-    classNames: import("@baseline-ui/css").RecipeClassNames<{
-        size: {
-            xs: {
-                height: number;
-            };
-            sm: {
-                height: number;
-            };
-        };
-    }>;
-};
-export declare const calendarCellCn: ((options?: {
-    size?: "xs" | "sm" | undefined;
-    isSelected?: boolean | undefined;
-    isSelectionStart?: boolean | undefined;
-    isSelectionEnd?: boolean | undefined;
-    isInRange?: boolean | undefined;
-    isToday?: boolean | undefined;
-    isOutsideMonth?: boolean | undefined;
-    isDisabled?: boolean | undefined;
-    isReadOnly?: boolean | undefined;
-    isHovered?: boolean | undefined;
-    isFocusVisible?: boolean | undefined;
-    isUnavailable?: boolean | undefined;
-} | undefined) => string) & {
-    variants: () => ("size" | "isSelected" | "isHovered" | "isDisabled" | "isFocusVisible" | "isReadOnly" | "isSelectionStart" | "isSelectionEnd" | "isInRange" | "isToday" | "isOutsideMonth" | "isUnavailable")[];
-    classNames: import("@baseline-ui/css").RecipeClassNames<{
-        size: {
-            xs: {
-                height: number;
-            };
-            sm: {
-                height: number;
-            };
-        };
-        isSelected: {
-            true: {
-                "__@@Component_Sprinkles__": boolean;
-                baseSprinkles: string;
-                variantSprinkles: string;
-                compoundVariantSprinkles: string;
-            };
-        };
-        isSelectionStart: {
-            true: {
-                "__@@Component_Sprinkles__": boolean;
-                baseSprinkles: string;
-                variantSprinkles: string;
-                compoundVariantSprinkles: string;
-            };
-        };
-        isSelectionEnd: {
-            true: {
-                "__@@Component_Sprinkles__": boolean;
-                baseSprinkles: string;
-                variantSprinkles: string;
-                compoundVariantSprinkles: string;
-            };
-        };
-        isInRange: {
-            true: {};
-        };
-        isToday: {
-            true: {
-                borderBottom: `2px solid var(--${string})`;
-                color: `var(--${string})`;
-            };
-        };
-        isOutsideMonth: {
-            true: {
-                "__@@Component_Sprinkles__": boolean;
-                baseSprinkles: string;
-                variantSprinkles: string;
-                compoundVariantSprinkles: string;
-            };
-        };
-        isDisabled: {
-            true: ({
-                "__@@Component_Sprinkles__": boolean;
-                baseSprinkles: string;
-                variantSprinkles: string;
-                compoundVariantSprinkles: string;
-            } | {
-                cursor: "default";
-            })[];
-        };
-        isReadOnly: {
-            true: {
-                cursor: "default";
-            };
-        };
-        isHovered: {
-            true: {
-                "__@@Component_Sprinkles__": boolean;
-                baseSprinkles: string;
-                variantSprinkles: string;
-                compoundVariantSprinkles: string;
-            };
-        };
-        isFocusVisible: {
-            true: {
-                boxShadow: `inset 0 0 0 2px var(--${string}), inset 0 0 0 3px var(--${string})`;
-            };
-        };
-        isUnavailable: {
-            true: {
-                textDecoration: "line-through";
-                cursor: "default";
-            };
-        };
-    }>;
-};

package/dist/components/Calendar/Calendar.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import type { CalendarProps } from "./Calendar.types";
-import type { DateValue } from "react-aria";
-export declare const Calendar: <T extends DateValue>(props: CalendarProps<T> & React.RefAttributes<HTMLDivElement>) => React.ReactElement;

package/dist/components/Calendar/Calendar.types.d.ts

@@ -1,22 +0,0 @@
-import type { StylingProps } from "../../utils";
-import type { DateValue } from "react-aria";
-import type { CalendarProps as RACCalendarProps, RangeCalendarProps as RACRangeCalendarProps } from "react-aria-components";
-export type CalendarSize = "xs" | "sm";
-export type CalendarHeaderVariant = "title" | "selectMonth" | "selectMonthAndYear";
-interface CalendarBaseProps {
-    /** The size of the calendar. */
-    size?: CalendarSize;
-    /** Optional title displayed above the calendar (e.g. "Date"). Shows a calendar icon and separator. */
-    title?: string;
-    /**
-     * Controls how the calendar header is displayed.
-     * - `"title"`: Month and year as plain text between navigation arrows (default).
-     * - `"selectMonth"`: Month and year as a dropdown selector with grouped navigation arrows.
-     * - `"selectMonthAndYear"`: Separate month and year sections, each with their own navigation arrows.
-     * @default "title"
-     */
-    headerVariant?: CalendarHeaderVariant;
-}
-export type CalendarProps<T extends DateValue = DateValue> = StylingProps & Omit<RACCalendarProps<T>, "visibleDuration"> & CalendarBaseProps;
-export type RangeCalendarProps<T extends DateValue = DateValue> = StylingProps & Omit<RACRangeCalendarProps<T>, "visibleDuration"> & CalendarBaseProps;
-export {};

package/dist/components/Calendar/CalendarCell.d.ts

@@ -1,9 +0,0 @@
-import type { CalendarSize } from "./Calendar.types";
-import type { CalendarDate } from "@internationalized/date";
-interface CalendarCellProps {
-    date: CalendarDate;
-    size: CalendarSize;
-    isRange?: boolean;
-}
-export declare function CalendarCell({ date, size, isRange }: CalendarCellProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/Calendar/CalendarHeader.d.ts

@@ -1,6 +0,0 @@
-import type { CalendarHeaderVariant } from "./Calendar.types";
-interface CalendarHeaderProps {
-    headerVariant: CalendarHeaderVariant;
-}
-export declare function CalendarHeader({ headerVariant }: CalendarHeaderProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/Calendar/RangeCalendar.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import type { RangeCalendarProps } from "./Calendar.types";
-import type { DateValue } from "react-aria";
-export declare const RangeCalendar: <T extends DateValue>(props: RangeCalendarProps<T> & React.RefAttributes<HTMLDivElement>) => React.ReactElement;

package/dist/components/Calendar/index.d.ts

@@ -1,3 +0,0 @@
-export { Calendar } from "./Calendar";
-export { RangeCalendar } from "./RangeCalendar";
-export { type CalendarProps, type RangeCalendarProps, type CalendarHeaderVariant, type CalendarSize, } from "./Calendar.types";