@gouno/ui 0.3.2

package/dist/core/autocomplete.d.ts

@@ -0,0 +1,24 @@
+import { type InputHTMLAttributes, type ReactNode } from "react";
+import { type ControlSize } from "./control-types.js";
+type AutoCompleteOption = string | {
+    value: string;
+    label?: string;
+    disabled?: boolean;
+};
+type NormalizedAutoCompleteOption = {
+    value: string;
+    label: string;
+    disabled: boolean;
+};
+export interface AutoCompleteProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "value" | "defaultValue" | "onChange" | "onSelect" | "role" | "aria-expanded" | "aria-controls" | "aria-activedescendant" | "aria-autocomplete"> {
+    options: readonly AutoCompleteOption[];
+    value?: string;
+    defaultValue?: string;
+    onChange?: (value: string) => void;
+    onSelect?: (value: string, option: NormalizedAutoCompleteOption) => void;
+    emptyText?: ReactNode;
+    size?: ControlSize;
+    status?: "error" | "warning";
+}
+export declare const AutoComplete: import("react").ForwardRefExoticComponent<AutoCompleteProps & import("react").RefAttributes<HTMLInputElement>>;
+export {};

package/dist/core/autocomplete.js

@@ -0,0 +1,139 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useId, useState, } from "react";
+import { Input as PrimitiveInput } from "../components/primitives/input.js";
+import { cn } from "../lib/utils.js";
+import { controlSizeClass } from "./control-types.js";
+function normalizeOptions(options) {
+    return options.map((option) => typeof option === "string"
+        ? { value: option, label: option, disabled: false }
+        : {
+            value: option.value,
+            label: option.label ?? option.value,
+            disabled: option.disabled ?? false,
+        });
+}
+function filterOptions(options, input) {
+    const query = input.toLocaleLowerCase();
+    return options.filter((option) => option.value.toLocaleLowerCase().includes(query) ||
+        option.label.toLocaleLowerCase().includes(query));
+}
+function firstEnabledIndex(options) {
+    return options.findIndex((option) => !option.disabled);
+}
+function lastEnabledIndex(options) {
+    for (let index = options.length - 1; index >= 0; index -= 1) {
+        if (!options[index]?.disabled)
+            return index;
+    }
+    return -1;
+}
+function moveEnabledIndex(options, current, delta) {
+    if (options.length === 0)
+        return -1;
+    let index = current;
+    for (let offset = 0; offset < options.length; offset += 1) {
+        index = (index + delta + options.length) % options.length;
+        if (!options[index]?.disabled)
+            return index;
+    }
+    return -1;
+}
+export const AutoComplete = forwardRef(function AutoComplete({ options, value, defaultValue = "", onChange, onSelect, emptyText, size = "middle", status, className, disabled, readOnly, onFocus, onBlur, onKeyDown, ...props }, ref) {
+    const [inner, setInner] = useState(defaultValue);
+    const [open, setOpen] = useState(false);
+    const [highlighted, setHighlighted] = useState(-1);
+    const listboxId = useId();
+    const current = value ?? inner;
+    const normalized = normalizeOptions(options);
+    const matches = filterOptions(normalized, current);
+    const fallbackIndex = firstEnabledIndex(matches);
+    const activeIndex = highlighted >= 0 &&
+        highlighted < matches.length &&
+        !matches[highlighted]?.disabled
+        ? highlighted
+        : fallbackIndex;
+    const popupOpen = open && !disabled && !readOnly && (matches.length > 0 || emptyText != null);
+    const update = (next) => {
+        if (value === undefined)
+            setInner(next);
+        onChange?.(next);
+    };
+    const choose = (option) => {
+        if (option.disabled || disabled || readOnly)
+            return;
+        update(option.value);
+        onSelect?.(option.value, option);
+        setOpen(false);
+        setHighlighted(-1);
+    };
+    const handleKeyDown = (event) => {
+        onKeyDown?.(event);
+        if (event.defaultPrevented || disabled || readOnly)
+            return;
+        if (event.key === "ArrowDown") {
+            event.preventDefault();
+            if (!open) {
+                setOpen(true);
+                setHighlighted(fallbackIndex);
+            }
+            else {
+                setHighlighted(moveEnabledIndex(matches, activeIndex, 1));
+            }
+        }
+        else if (event.key === "ArrowUp") {
+            event.preventDefault();
+            if (!open) {
+                setOpen(true);
+                setHighlighted(lastEnabledIndex(matches));
+            }
+            else {
+                setHighlighted(moveEnabledIndex(matches, activeIndex, -1));
+            }
+        }
+        else if (event.key === "Home" && open) {
+            event.preventDefault();
+            setHighlighted(firstEnabledIndex(matches));
+        }
+        else if (event.key === "End" && open) {
+            event.preventDefault();
+            setHighlighted(lastEnabledIndex(matches));
+        }
+        else if (event.key === "Enter" && popupOpen && activeIndex >= 0) {
+            event.preventDefault();
+            const option = matches[activeIndex];
+            if (option)
+                choose(option);
+        }
+        else if (event.key === "Escape" && open) {
+            event.preventDefault();
+            setOpen(false);
+            setHighlighted(-1);
+        }
+    };
+    return (_jsxs("div", { "data-slot": "auto-complete", className: "relative min-w-0", children: [_jsx(PrimitiveInput, { ...props, ref: ref, "data-slot": "auto-complete-input", role: "combobox", "aria-expanded": popupOpen, "aria-controls": popupOpen ? listboxId : undefined, "aria-autocomplete": "list", "aria-activedescendant": popupOpen && activeIndex >= 0
+                    ? `${listboxId}-option-${activeIndex}`
+                    : undefined, "aria-invalid": status === "error" ? true : props["aria-invalid"] || undefined, "data-status": status, value: current, disabled: disabled, readOnly: readOnly, onFocus: (event) => {
+                    onFocus?.(event);
+                    if (!event.defaultPrevented && !disabled && !readOnly) {
+                        setOpen(true);
+                        setHighlighted(fallbackIndex);
+                    }
+                }, onBlur: (event) => {
+                    onBlur?.(event);
+                    setOpen(false);
+                    setHighlighted(-1);
+                }, onKeyDown: handleKeyDown, onChange: (event) => {
+                    const next = event.target.value;
+                    update(next);
+                    setOpen(true);
+                    setHighlighted(firstEnabledIndex(filterOptions(normalized, next)));
+                }, className: cn("bg-input text-foreground placeholder:text-muted-foreground", controlSizeClass(size), status === "warning" &&
+                    "border-warning focus-visible:ring-warning/30", className) }), popupOpen ? (_jsx("ul", { id: listboxId, role: "listbox", "data-slot": "auto-complete-popup", className: "absolute z-50 mt-1 max-h-48 w-full overflow-auto rounded-md border bg-popover p-1 text-popover-foreground shadow-overlay", children: matches.length > 0
+                    ? matches.map((option, index) => (_jsx("li", { id: `${listboxId}-option-${index}`, role: "option", "aria-selected": option.value === current, "aria-disabled": option.disabled || undefined, "data-slot": "auto-complete-option", "data-highlighted": index === activeIndex || undefined, className: cn("cursor-pointer rounded px-2 py-1.5 text-sm", index === activeIndex && "bg-accent text-accent-foreground", option.disabled
+                            ? "cursor-not-allowed opacity-50"
+                            : "hover:bg-accent hover:text-accent-foreground"), onMouseDown: (event) => {
+                            event.preventDefault();
+                            choose(option);
+                        }, children: option.label }, `${option.value}-${index}`)))
+                    : emptyText != null && (_jsx("li", { role: "presentation", "data-slot": "auto-complete-empty", className: "px-2 py-1.5 text-sm text-muted-foreground", children: emptyText })) })) : null] }));
+});

package/dist/core/avatar.d.ts

@@ -0,0 +1,26 @@
+import { type ComponentProps, type ComponentPropsWithoutRef, type ReactNode } from "react";
+import { Avatar as PrimitiveAvatar, AvatarGroup as PrimitiveAvatarGroup } from "../components/primitives/avatar.js";
+import type { ControlSize } from "./control-types.js";
+export type AvatarSize = ControlSize | number;
+export type AvatarShape = "circle" | "square";
+/** @deprecated Use `small`, `middle`, `large`, or a numeric size. */
+export type AvatarLegacySize = "sm" | "default" | "lg";
+export interface AvatarProps extends Omit<ComponentPropsWithoutRef<typeof PrimitiveAvatar>, "size" | "shape"> {
+    size?: AvatarSize | AvatarLegacySize;
+    shape?: AvatarShape;
+}
+export declare const Avatar: import("react").ForwardRefExoticComponent<AvatarProps & import("react").RefAttributes<HTMLSpanElement>>;
+export declare const AvatarImage: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-avatar").AvatarImageProps & import("react").RefAttributes<HTMLImageElement>, "ref"> & import("react").RefAttributes<HTMLImageElement>>;
+export declare const AvatarFallback: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-avatar").AvatarFallbackProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+export declare const AvatarBadge: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+export declare const AvatarGroupCount: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export type AvatarImageProps = ComponentProps<typeof AvatarImage>;
+export type AvatarFallbackProps = ComponentProps<typeof AvatarFallback>;
+export type AvatarBadgeProps = ComponentProps<typeof AvatarBadge>;
+export type AvatarGroupCountProps = ComponentProps<typeof AvatarGroupCount>;
+export interface AvatarGroupProps extends Omit<ComponentPropsWithoutRef<typeof PrimitiveAvatarGroup>, "children"> {
+    children?: ReactNode;
+    max?: number;
+    overflowRender?: (omittedCount: number) => ReactNode;
+}
+export declare const AvatarGroup: import("react").ForwardRefExoticComponent<AvatarGroupProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/core/avatar.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Children, forwardRef, } from "react";
+import { Avatar as PrimitiveAvatar, AvatarBadge as PrimitiveAvatarBadge, AvatarFallback as PrimitiveAvatarFallback, AvatarGroup as PrimitiveAvatarGroup, AvatarGroupCount as PrimitiveAvatarGroupCount, AvatarImage as PrimitiveAvatarImage, } from "../components/primitives/avatar.js";
+export const Avatar = forwardRef(function Avatar(props, ref) {
+    return _jsx(PrimitiveAvatar, { ...props, ref: ref });
+});
+export const AvatarImage = PrimitiveAvatarImage;
+export const AvatarFallback = PrimitiveAvatarFallback;
+export const AvatarBadge = PrimitiveAvatarBadge;
+export const AvatarGroupCount = PrimitiveAvatarGroupCount;
+export const AvatarGroup = forwardRef(function AvatarGroup({ children, max, overflowRender, ...props }, ref) {
+    const items = Children.toArray(children);
+    const finiteMax = max !== undefined && Number.isFinite(max)
+        ? Math.max(1, Math.floor(max))
+        : undefined;
+    const hasOverflow = finiteMax !== undefined && items.length > finiteMax;
+    const visibleCount = hasOverflow ? Math.max(0, finiteMax - 1) : items.length;
+    const omittedCount = items.length - visibleCount;
+    return (_jsxs(PrimitiveAvatarGroup, { ...props, ref: ref, "data-max": finiteMax, "data-overflow": hasOverflow || undefined, children: [items.slice(0, visibleCount), hasOverflow ? (_jsx(PrimitiveAvatarGroupCount, { children: overflowRender ? overflowRender(omittedCount) : `+${omittedCount}` })) : null] }));
+});

package/dist/core/badge.d.ts

@@ -0,0 +1,16 @@
+import type { HTMLAttributes, ReactNode } from "react";
+export type BadgeStatus = "success" | "processing" | "default" | "error" | "warning";
+export type BadgeSize = "default" | "small";
+export interface BadgeProps extends Omit<HTMLAttributes<HTMLSpanElement>, "color"> {
+    count?: ReactNode;
+    dot?: boolean;
+    showZero?: boolean;
+    overflowCount?: number;
+    status?: BadgeStatus;
+    text?: ReactNode;
+    color?: string;
+    size?: BadgeSize;
+    offset?: [number, number];
+    children?: ReactNode;
+}
+export declare function Badge({ count, dot, showZero, overflowCount, status, text, color, size, offset, children, className, style, title, ...props }: BadgeProps): import("react").JSX.Element;

package/dist/core/badge.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../lib/utils.js";
+const statusColor = {
+    success: "bg-success",
+    processing: "bg-primary",
+    default: "bg-muted-foreground",
+    error: "bg-destructive",
+    warning: "bg-warning",
+};
+export function Badge({ count, dot = false, showZero = false, overflowCount = 99, status, text, color, size = "default", offset, children, className, style, title, ...props }) {
+    if ((status || color) && children === undefined && count === undefined && !dot) {
+        return _jsxs("span", { ...props, className: cn("inline-flex items-center gap-2 text-sm", className), style: style, children: [_jsx("span", { "aria-hidden": "true", className: cn("size-2 rounded-full", status && statusColor[status], status === "processing" && "animate-pulse"), style: color ? { backgroundColor: color } : undefined }), text !== undefined ? _jsx("span", { children: text }) : null] });
+    }
+    const numericCount = typeof count === "number" ? count : undefined;
+    const hidden = !dot && (count === undefined || (numericCount === 0 && !showZero));
+    const display = dot ? null : numericCount !== undefined && numericCount > overflowCount ? `${overflowCount}+` : count;
+    const indicatorStyle = { backgroundColor: color, marginTop: offset?.[1], marginInlineStart: offset?.[0] };
+    const indicator = hidden ? null : _jsx("sup", { role: "status", "aria-label": title ?? (dot ? "notification" : String(display)), title: title ?? (display === null ? undefined : String(display)), className: cn("z-10 inline-flex items-center justify-center rounded-full bg-destructive text-destructive-foreground ring-2 ring-background", dot ? "size-2 p-0" : size === "small" ? "min-w-4 px-1 text-[10px] leading-4" : "min-w-5 px-1.5 text-xs leading-5", children && "absolute right-0 top-0 translate-x-1/2 -translate-y-1/2"), style: indicatorStyle, children: display });
+    if (children !== undefined)
+        return _jsxs("span", { ...props, className: cn("relative inline-flex", className), style: style, children: [children, indicator] });
+    return _jsx("span", { ...props, className: cn("inline-flex", className), style: style, children: indicator });
+}

package/dist/core/breadcrumb.d.ts

@@ -0,0 +1,55 @@
+import { type CSSProperties, type HTMLAttributes, type Key, type MouseEvent, type ReactNode, type Ref } from "react";
+export interface BreadcrumbMenuItem {
+    key: Key;
+    title: ReactNode;
+    href?: string;
+    disabled?: boolean;
+    onClick?: () => void;
+}
+export interface BreadcrumbMenu {
+    items: readonly BreadcrumbMenuItem[];
+    "aria-label"?: string;
+}
+export interface BreadcrumbRouteItem {
+    key: Key;
+    title: ReactNode;
+    href?: string;
+    path?: string;
+    className?: string;
+    style?: CSSProperties;
+    menu?: BreadcrumbMenu;
+    onClick?: (event: MouseEvent<HTMLElement>) => void;
+}
+export interface BreadcrumbSeparatorItem {
+    key: Key;
+    type: "separator";
+    separator?: ReactNode;
+}
+export type BreadcrumbItem = BreadcrumbRouteItem | BreadcrumbSeparatorItem;
+export type BreadcrumbSemantic = "root" | "item" | "separator";
+export interface BreadcrumbSemanticInfo {
+    props: Readonly<{
+        itemCount: number;
+    }>;
+}
+export type BreadcrumbClassNames = Partial<Record<BreadcrumbSemantic, string>> | ((info: BreadcrumbSemanticInfo) => Partial<Record<BreadcrumbSemantic, string>>);
+export type BreadcrumbStyles = Partial<Record<BreadcrumbSemantic, CSSProperties>> | ((info: BreadcrumbSemanticInfo) => Partial<Record<BreadcrumbSemantic, CSSProperties>>);
+export interface BreadcrumbItemRenderInfo {
+    item: BreadcrumbRouteItem;
+    index: number;
+    items: readonly BreadcrumbItem[];
+    paths: readonly string[];
+    href?: string;
+    isLast: boolean;
+}
+export interface BreadcrumbProps extends Omit<HTMLAttributes<HTMLElement>, "children"> {
+    items: readonly BreadcrumbItem[];
+    separator?: ReactNode;
+    dropdownIcon?: ReactNode;
+    params?: Readonly<Record<string, string | number>>;
+    itemRender?: (info: BreadcrumbItemRenderInfo) => ReactNode;
+    classNames?: BreadcrumbClassNames;
+    styles?: BreadcrumbStyles;
+    ref?: Ref<HTMLElement>;
+}
+export declare function Breadcrumb({ items, separator, dropdownIcon, params, itemRender, classNames, styles, className, style, "aria-label": breadcrumbLabel, ref, ...props }: BreadcrumbProps): import("react").JSX.Element;

package/dist/core/breadcrumb.js

@@ -0,0 +1,69 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import {} from "react";
+import { ChevronDown } from "lucide-react";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, } from "../components/primitives/dropdown-menu.js";
+import { cn } from "../lib/utils.js";
+function isSeparatorItem(item) {
+    return "type" in item && item.type === "separator";
+}
+function interpolatePath(path, params) {
+    return path.replace(/:([A-Za-z0-9_]+)/g, (match, name) => name in params ? encodeURIComponent(String(params[name])) : match);
+}
+function joinRoutePaths(paths) {
+    const joined = paths
+        .filter(Boolean)
+        .map((path) => path.replace(/^\/+|\/+$/g, ""))
+        .filter(Boolean)
+        .join("/");
+    return joined ? `/${joined}` : "/";
+}
+function routeEntries(items) {
+    return items.filter((item) => !isSeparatorItem(item));
+}
+function menuItemNode(item) {
+    const content = (_jsx("span", { className: "flex min-w-0 items-center gap-2", children: _jsx("span", { className: "min-w-0 truncate", children: item.title }) }));
+    if (item.href) {
+        return (_jsx(DropdownMenuItem, { asChild: true, disabled: item.disabled, children: _jsx("a", { href: item.href, onClick: (event) => {
+                    if (item.disabled) {
+                        event.preventDefault();
+                        return;
+                    }
+                    item.onClick?.();
+                }, children: content }) }, item.key));
+    }
+    return (_jsx(DropdownMenuItem, { disabled: item.disabled, onSelect: () => item.onClick?.(), children: content }, item.key));
+}
+export function Breadcrumb({ items, separator = "/", dropdownIcon = _jsx(ChevronDown, { "aria-hidden": "true" }), params = {}, itemRender, classNames, styles, className, style, "aria-label": breadcrumbLabel = "Breadcrumb", ref, ...props }) {
+    const routes = routeEntries(items);
+    const semanticInfo = {
+        props: { itemCount: routes.length },
+    };
+    const semanticClassNames = typeof classNames === "function" ? classNames(semanticInfo) : (classNames ?? {});
+    const semanticStyles = typeof styles === "function" ? styles(semanticInfo) : (styles ?? {});
+    const paths = [];
+    let routeIndex = -1;
+    return (_jsx("nav", { ...props, ref: ref, "aria-label": breadcrumbLabel, "data-slot": "breadcrumb", className: cn("min-w-0", semanticClassNames.root, className), style: { ...semanticStyles.root, ...style }, children: _jsx("ol", { className: "m-0 flex min-w-0 list-none flex-wrap items-center gap-x-2 gap-y-1 p-0 text-sm text-muted-foreground", children: items.map((item, itemIndex) => {
+                if (isSeparatorItem(item)) {
+                    return (_jsx("li", { "aria-hidden": "true", "data-slot": "breadcrumb-separator", className: cn("flex shrink-0 items-center text-muted-foreground/80", semanticClassNames.separator), style: semanticStyles.separator, children: item.separator ?? separator }, item.key));
+                }
+                routeIndex += 1;
+                const hasPath = item.path !== undefined;
+                if (hasPath)
+                    paths.push(interpolatePath(item.path ?? "", params));
+                const href = item.href ?? (hasPath ? joinRoutePaths(paths) : undefined);
+                const isLast = routeIndex === routes.length - 1;
+                const previousItem = items[itemIndex - 1];
+                const hasExplicitLeadingSeparator = previousItem !== undefined && isSeparatorItem(previousItem);
+                const rendered = itemRender?.({
+                    item,
+                    index: routeIndex,
+                    items,
+                    paths: [...paths],
+                    href,
+                    isLast,
+                });
+                const titleNode = rendered ??
+                    (href ? (_jsx("a", { href: href, onClick: (event) => item.onClick?.(event), "aria-current": isLast ? "page" : undefined, className: "inline-flex min-w-0 items-center gap-1 rounded-sm text-inherit transition-colors hover:text-foreground hover:underline focus-visible:text-foreground", children: _jsx("span", { className: "min-w-0 truncate", children: item.title }) })) : (_jsx("span", { "aria-current": isLast ? "page" : undefined, className: cn("inline-flex min-w-0 items-center gap-1 truncate", isLast && "text-foreground"), children: item.title })));
+                return (_jsxs("li", { "data-slot": "breadcrumb-item", className: cn("flex min-w-0 items-center gap-2", semanticClassNames.item, item.className), style: { ...semanticStyles.item, ...item.style }, children: [routeIndex > 0 && !hasExplicitLeadingSeparator ? (_jsx("span", { "aria-hidden": "true", "data-slot": "breadcrumb-separator", className: cn("flex shrink-0 items-center text-muted-foreground/80", semanticClassNames.separator), style: semanticStyles.separator, children: separator })) : null, _jsxs("span", { className: "flex min-w-0 items-center gap-1", children: [titleNode, item.menu ? (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx("button", { type: "button", "aria-label": item.menu["aria-label"] ?? "Open breadcrumb menu", className: "inline-flex size-6 shrink-0 items-center justify-center rounded-sm text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: _jsx("span", { className: "flex size-4 items-center justify-center [&_svg]:size-3.5", children: dropdownIcon }) }) }), _jsx(DropdownMenuContent, { align: "start", children: item.menu.items.map(menuItemNode) })] })) : null] })] }, item.key));
+            }) }) }));
+}

package/dist/core/button.d.ts

@@ -0,0 +1,49 @@
+import { type AnchorHTMLAttributes, type ButtonHTMLAttributes, type ComponentType, type ReactNode, type Ref } from "react";
+export type ButtonVariant = "solid" | "outline" | "ghost" | "link" | "text" | "dashed";
+export type ButtonColor = "default" | "primary" | "success" | "warning" | "error" | "info";
+export type ButtonSize = "small" | "middle" | "large";
+export type ButtonIconPlacement = "start" | "end";
+export type ButtonShape = "default" | "round" | "circle";
+export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: ButtonVariant;
+    color?: ButtonColor;
+    size?: ButtonSize;
+    loading?: boolean;
+    loadingText?: ReactNode;
+    icon?: ReactNode;
+    iconPlacement?: ButtonIconPlacement;
+    shape?: ButtonShape;
+    block?: boolean;
+    ref?: Ref<HTMLButtonElement>;
+}
+export declare function Button({ variant, color, size, loading, loadingText, icon, iconPlacement, shape, block, children, disabled, className, type, ...props }: ButtonProps): import("react").JSX.Element;
+export interface LinkAdapterProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
+    to: string;
+    ref?: Ref<HTMLAnchorElement>;
+}
+export declare function NavigationProvider({ link, children }: {
+    link: ComponentType<LinkAdapterProps>;
+    children: ReactNode;
+}): import("react").JSX.Element;
+export interface ButtonLinkProps extends Omit<LinkAdapterProps, "to"> {
+    to?: string;
+    href?: string;
+    variant?: ButtonVariant;
+    color?: ButtonColor;
+    size?: ButtonSize;
+    icon?: ReactNode;
+    iconPlacement?: ButtonIconPlacement;
+    shape?: ButtonShape;
+    disabled?: boolean;
+    loading?: boolean;
+    loadingText?: ReactNode;
+    block?: boolean;
+}
+export declare function ButtonLink({ to, href, variant, color, size, icon, iconPlacement, shape, disabled, loading, loadingText, block, children, onClick, className, ...props }: ButtonLinkProps): import("react").JSX.Element;
+export declare function IconButtonLink({ label, icon, className, variant, ...props }: ButtonLinkProps & {
+    label: string;
+    icon: ReactNode;
+}): import("react").JSX.Element;
+export declare function ChoiceButton({ selected, className, ...props }: ButtonProps & {
+    selected?: boolean;
+}): import("react").JSX.Element;

package/dist/core/button.js

@@ -0,0 +1,66 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { createContext, useContext, } from "react";
+import { LoaderCircle } from "lucide-react";
+import { Button as PrimitiveButton } from "../components/primitives/button.js";
+import { cn } from "../lib/utils.js";
+const variants = { solid: "default", outline: "outline", dashed: "outline", ghost: "ghost", text: "ghost", link: "link" };
+const sizes = { small: "sm", middle: "default", large: "lg" };
+const shapeClass = { default: undefined, round: "rounded-full", circle: "rounded-full aspect-square px-0" };
+const solidColorClass = {
+    primary: "bg-primary text-primary-foreground hover:bg-primary/90 focus-visible:ring-primary/20",
+    success: "bg-success text-background hover:bg-success/90 focus-visible:ring-success/20",
+    warning: "bg-warning text-background hover:bg-warning/90 focus-visible:ring-warning/20",
+    error: "bg-destructive text-destructive-foreground hover:bg-destructive/90 focus-visible:ring-destructive/20",
+    info: "bg-info text-background hover:bg-info/90 focus-visible:ring-info/20",
+};
+const outlineColorClass = {
+    primary: "border-primary text-primary hover:bg-accent hover:text-accent-foreground focus-visible:ring-primary/20",
+    success: "border-success/50 text-success hover:bg-success-subtle focus-visible:ring-success/20",
+    warning: "border-warning/50 text-warning hover:bg-warning-subtle focus-visible:ring-warning/20",
+    error: "border-destructive/50 text-destructive hover:bg-danger-subtle focus-visible:ring-destructive/20",
+    info: "border-info/50 text-info hover:bg-info-subtle focus-visible:ring-info/20",
+};
+const ghostColorClass = {
+    primary: "text-primary hover:bg-accent hover:text-accent-foreground focus-visible:ring-primary/20",
+    success: "text-success hover:bg-success-subtle focus-visible:ring-success/20",
+    warning: "text-warning hover:bg-warning-subtle focus-visible:ring-warning/20",
+    error: "text-destructive hover:bg-danger-subtle focus-visible:ring-destructive/20",
+    info: "text-info hover:bg-info-subtle focus-visible:ring-info/20",
+};
+const linkColorClass = {
+    primary: "text-primary focus-visible:ring-primary/20",
+    success: "text-success focus-visible:ring-success/20",
+    warning: "text-warning focus-visible:ring-warning/20",
+    error: "text-destructive focus-visible:ring-destructive/20",
+    info: "text-info focus-visible:ring-info/20",
+};
+function resolveColorClass(variant, color) {
+    if (color === "default")
+        return undefined;
+    if (variant === "solid")
+        return solidColorClass[color];
+    if (variant === "outline" || variant === "dashed")
+        return outlineColorClass[color];
+    if (variant === "link")
+        return linkColorClass[color];
+    return ghostColorClass[color];
+}
+export function Button({ variant = "outline", color = "default", size = "middle", loading = false, loadingText, icon, iconPlacement = "start", shape = "default", block = false, children, disabled, className, type = "button", ...props }) {
+    const hasLabel = children !== undefined && children !== null && children !== "";
+    const primitiveVariant = color === "error" && variant === "solid" ? "destructive" : variants[variant];
+    return _jsxs(PrimitiveButton, { ...props, type: type, variant: primitiveVariant, size: sizes[size], disabled: disabled || loading, "aria-busy": loading || undefined, className: cn(resolveColorClass(variant, color), variant === "dashed" && "border-dashed", shapeClass[shape], block && "w-full", className), children: [loading ? _jsx(LoaderCircle, { className: "animate-spin", "aria-hidden": "true" }) : icon && iconPlacement === "start" ? _jsx("span", { className: "btn__icon", "aria-hidden": "true", children: icon }) : null, hasLabel || loadingText ? _jsx("span", { children: loading && loadingText ? loadingText : children }) : null, !loading && icon && iconPlacement === "end" ? _jsx("span", { className: "btn__icon", "aria-hidden": "true", children: icon }) : null] });
+}
+const LinkContext = createContext(({ to, ...props }) => _jsx("a", { href: to, ...props }));
+export function NavigationProvider({ link, children }) { return _jsx(LinkContext.Provider, { value: link, children: children }); }
+export function ButtonLink({ to, href, variant = "link", color = "default", size = "middle", icon, iconPlacement = "start", shape = "default", disabled, loading, loadingText, block, children, onClick, className, ...props }) {
+    const Link = useContext(LinkContext);
+    const inactive = disabled || loading;
+    const hasLabel = children !== undefined && children !== null && children !== "";
+    const primitiveVariant = color === "error" && variant === "solid" ? "destructive" : variants[variant];
+    return _jsx(PrimitiveButton, { asChild: true, variant: primitiveVariant, size: sizes[size], children: _jsxs(Link, { ...props, to: to ?? href ?? "#", className: cn(resolveColorClass(variant, color), variant === "dashed" && "border-dashed", shapeClass[shape], block && "w-full", inactive && "pointer-events-none opacity-50", className), "aria-disabled": inactive || undefined, "aria-busy": loading || undefined, tabIndex: inactive ? -1 : props.tabIndex, onClick: (event) => { if (inactive) {
+                event.preventDefault();
+                return;
+            } onClick?.(event); }, children: [loading ? _jsx(LoaderCircle, { className: "animate-spin", "aria-hidden": "true" }) : icon && iconPlacement === "start" ? _jsx("span", { className: "btn__icon", "aria-hidden": "true", children: icon }) : null, hasLabel || loadingText ? _jsx("span", { children: loading && loadingText ? loadingText : children }) : null, !loading && icon && iconPlacement === "end" ? _jsx("span", { className: "btn__icon", "aria-hidden": "true", children: icon }) : null] }) });
+}
+export function IconButtonLink({ label, icon, className, variant = "outline", ...props }) { return _jsx(ButtonLink, { ...props, size: "small", shape: "circle", icon: icon, variant: variant, className: cn("icon-button", className), "aria-label": label, title: label }); }
+export function ChoiceButton({ selected, className, ...props }) { return _jsx(Button, { ...props, className: cn("justify-start", className), variant: selected ? "solid" : "ghost", color: selected ? "primary" : "default", "aria-pressed": selected }); }

package/dist/core/calendar.d.ts

@@ -0,0 +1,48 @@
+import { type CSSProperties, type HTMLAttributes, type ReactNode, type Ref } from "react";
+export type CalendarMode = "month" | "year";
+export type CalendarSelectSource = "year" | "month" | "date" | "customize";
+export type CalendarSemantic = "root" | "header" | "body" | "weekHeader" | "weekNumber" | "cell" | "cellInner";
+export interface CalendarCellInfo {
+    originNode: ReactNode;
+    today: Date;
+    mode: CalendarMode;
+    range?: "start" | "end";
+}
+export interface CalendarHeaderRenderProps {
+    value: Date;
+    mode: CalendarMode;
+    onChange: (date: Date) => void;
+    onModeChange: (mode: CalendarMode) => void;
+}
+export interface CalendarSemanticInfo {
+    props: Readonly<{
+        mode: CalendarMode;
+        fullscreen: boolean;
+        showWeek: boolean;
+    }>;
+}
+export type CalendarClassNames = Partial<Record<CalendarSemantic, string>> | ((info: CalendarSemanticInfo) => Partial<Record<CalendarSemantic, string>>);
+export type CalendarStyles = Partial<Record<CalendarSemantic, CSSProperties>> | ((info: CalendarSemanticInfo) => Partial<Record<CalendarSemantic, CSSProperties>>);
+export interface CalendarProps extends Omit<HTMLAttributes<HTMLDivElement>, "children" | "defaultValue" | "onChange" | "onSelect"> {
+    value?: Date;
+    defaultValue?: Date;
+    mode?: CalendarMode;
+    defaultMode?: CalendarMode;
+    fullscreen?: boolean;
+    showWeek?: boolean;
+    disabledDate?: (date: Date) => boolean;
+    validRange?: readonly [Date, Date];
+    locale?: string;
+    cellRender?: (date: Date, info: CalendarCellInfo) => ReactNode;
+    fullCellRender?: (date: Date, info: CalendarCellInfo) => ReactNode;
+    headerRender?: (props: CalendarHeaderRenderProps) => ReactNode;
+    onChange?: (date: Date) => void;
+    onPanelChange?: (date: Date, mode: CalendarMode) => void;
+    onSelect?: (date: Date, info: {
+        source: CalendarSelectSource;
+    }) => void;
+    classNames?: CalendarClassNames;
+    styles?: CalendarStyles;
+    ref?: Ref<HTMLDivElement>;
+}
+export declare function Calendar({ value, defaultValue, mode, defaultMode, fullscreen, showWeek, disabledDate, validRange, locale, cellRender, fullCellRender, headerRender, onChange, onPanelChange, onSelect, classNames, styles, className, style, ref, ...props }: CalendarProps): import("react").JSX.Element;