@zvk/ui 0.1.0

package/dist/components/dialog/dialog.d.ts

@@ -0,0 +1,62 @@
+import * as React from "react";
+import type { PortalProps } from "../../internal/portal/index.js";
+export interface DialogProps extends React.HTMLAttributes<HTMLDivElement> {
+    defaultOpen?: boolean;
+    disableEscapeKeyDown?: boolean;
+    disableOutsidePointerDown?: boolean;
+    onOpenChange?: (next: boolean) => void;
+    open?: boolean;
+    container?: PortalProps["container"];
+    ref?: React.Ref<HTMLDivElement>;
+}
+export interface DialogTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    ref?: React.Ref<HTMLButtonElement>;
+}
+export interface DialogContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    ref?: React.Ref<HTMLDivElement>;
+}
+export interface DialogHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
+    ref?: React.Ref<HTMLDivElement>;
+}
+export interface DialogTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {
+    ref?: React.Ref<HTMLHeadingElement>;
+}
+export interface DialogDescriptionProps extends React.HTMLAttributes<HTMLParagraphElement> {
+    ref?: React.Ref<HTMLParagraphElement>;
+}
+export interface DialogFooterProps extends React.HTMLAttributes<HTMLDivElement> {
+    ref?: React.Ref<HTMLDivElement>;
+}
+export interface DialogOverlayProps extends React.HTMLAttributes<HTMLDivElement> {
+    ref?: React.Ref<HTMLDivElement>;
+}
+export interface DialogCloseProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    ref?: React.Ref<HTMLButtonElement>;
+}
+interface DialogPortalProps {
+    children: React.ReactNode;
+    container: PortalProps["container"] | undefined;
+}
+declare function DialogRoot({ children, className, container, defaultOpen, disableEscapeKeyDown, disableOutsidePointerDown, onOpenChange, open: openProp, ref, ...props }: DialogProps): React.JSX.Element;
+declare function DialogPortal({ container, children }: DialogPortalProps): React.JSX.Element;
+declare function DialogOverlay({ className, ref, ...props }: DialogOverlayProps): React.JSX.Element;
+declare function DialogContent({ className, children, ref, ...props }: DialogContentProps): React.JSX.Element | null;
+declare function DialogHeader({ className, ref, ...props }: DialogHeaderProps): React.JSX.Element;
+declare function DialogTitle({ className, ref, ...props }: DialogTitleProps): React.JSX.Element;
+declare function DialogDescription({ className, ref, ...props }: DialogDescriptionProps): React.JSX.Element;
+declare function DialogFooter({ className, ref, ...props }: DialogFooterProps): React.JSX.Element;
+declare function DialogTrigger({ className, disabled, onClick, ref, type, ...props }: DialogTriggerProps): React.JSX.Element;
+declare function DialogClose({ className, onClick, ref, type, ...props }: DialogCloseProps): React.JSX.Element;
+type DialogComponent = typeof DialogRoot & {
+    Close: typeof DialogClose;
+    Content: typeof DialogContent;
+    Description: typeof DialogDescription;
+    Footer: typeof DialogFooter;
+    Header: typeof DialogHeader;
+    Overlay: typeof DialogOverlay;
+    Portal: typeof DialogPortal;
+    Title: typeof DialogTitle;
+    Trigger: typeof DialogTrigger;
+};
+export declare const Dialog: DialogComponent;
+export {};

package/dist/components/dialog/dialog.js

@@ -0,0 +1,141 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { composeEventHandlers } from "../../utils/compose-event-handlers.js";
+import { cn } from "../../utils/cn.js";
+import { useControllableState } from "../../hooks/use-controllable-state.js";
+import { DismissableLayer } from "../../internal/dismissable-layer/dismissable-layer.js";
+import { FocusScope } from "../../internal/focus/focus-scope.js";
+import { lockScroll, unlockScroll } from "../../internal/scroll-lock/scroll-lock.js";
+import { Portal } from "../../internal/portal/index.js";
+const DialogContext = React.createContext(null);
+function useDialogContext(calledBy) {
+    const context = React.useContext(DialogContext);
+    if (context === null) {
+        throw new Error(`"${calledBy}" must be used inside a <Dialog />`);
+    }
+    return context;
+}
+function composeRefs(...refs) {
+    return (node) => {
+        for (const ref of refs) {
+            if (typeof ref === "function") {
+                ref(node);
+            }
+            else if (ref && "current" in ref) {
+                ref.current = node;
+            }
+        }
+    };
+}
+function DialogRoot({ children, className, container, defaultOpen = false, disableEscapeKeyDown = false, disableOutsidePointerDown = false, onOpenChange, open: openProp, ref, ...props }) {
+    const [open, setOpen] = useControllableState({
+        ...(openProp !== undefined ? { value: openProp } : {}),
+        defaultValue: defaultOpen,
+        ...(onOpenChange ? { onChange: onOpenChange } : {})
+    });
+    const instanceId = React.useId();
+    const triggerRef = React.useRef(null);
+    const [labelledBy, setLabelledBy] = React.useState();
+    const [describedBy, setDescribedBy] = React.useState();
+    const registerTitle = React.useCallback((id) => {
+        setLabelledBy(id);
+        return () => {
+            setLabelledBy((current) => (current === id ? undefined : current));
+        };
+    }, []);
+    const registerDescription = React.useCallback((id) => {
+        setDescribedBy(id);
+        return () => {
+            setDescribedBy((current) => (current === id ? undefined : current));
+        };
+    }, []);
+    React.useLayoutEffect(() => {
+        if (!open) {
+            return;
+        }
+        lockScroll();
+        return () => {
+            unlockScroll();
+        };
+    }, [open]);
+    return (_jsx(DialogContext.Provider, { value: {
+            close: () => {
+                setOpen(false);
+            },
+            open,
+            setOpen,
+            container,
+            contentId: `${instanceId}-content`,
+            describedBy,
+            descriptionId: `${instanceId}-description`,
+            labelledBy,
+            registerDescription,
+            registerTitle,
+            titleId: `${instanceId}-title`,
+            triggerRef,
+            disableOutsidePointerDown,
+            disableEscapeKeyDown
+        }, children: _jsx("div", { ...props, ref: ref, className: cn("liano-dialog", className), "data-state": open ? "open" : "closed", children: children }) }));
+}
+function DialogPortal({ container, children }) {
+    if (container === undefined) {
+        return _jsx(Portal, { children: children });
+    }
+    return _jsx(Portal, { container: container, children: children });
+}
+function DialogOverlay({ className, ref, ...props }) {
+    return _jsx("div", { ...props, ref: ref, className: cn("liano-dialog__overlay", className) });
+}
+function DialogContent({ className, children, ref, ...props }) {
+    const { close, container, contentId, describedBy, disableEscapeKeyDown, disableOutsidePointerDown, labelledBy, open } = useDialogContext("Dialog.Content");
+    if (!open) {
+        return null;
+    }
+    return (_jsxs(DialogPortal, { container: container, children: [_jsx(DialogOverlay, { "aria-hidden": true }), _jsx(DismissableLayer, { open: open, disableEscapeKeyDown: disableEscapeKeyDown, disableOutsidePointerDown: disableOutsidePointerDown, onDismiss: close, children: _jsx(FocusScope, { trapped: true, active: open, children: _jsx("div", { ...props, ref: ref, id: contentId, role: "dialog", "aria-modal": true, "aria-labelledby": labelledBy, "aria-describedby": describedBy, className: cn("liano-dialog__content", className), "data-state": open ? "open" : "closed", children: children }) }) })] }));
+}
+function DialogHeader({ className, ref, ...props }) {
+    return _jsx("div", { ...props, ref: ref, className: cn("liano-dialog__header", className) });
+}
+function DialogTitle({ className, ref, ...props }) {
+    const { registerTitle, titleId } = useDialogContext("Dialog.Title");
+    const resolvedId = props.id ?? titleId;
+    React.useLayoutEffect(() => registerTitle(resolvedId), [registerTitle, resolvedId]);
+    return _jsx("h2", { ...props, ref: ref, id: resolvedId, className: cn("liano-dialog__title", className) });
+}
+function DialogDescription({ className, ref, ...props }) {
+    const { descriptionId, registerDescription } = useDialogContext("Dialog.Description");
+    const resolvedId = props.id ?? descriptionId;
+    React.useLayoutEffect(() => registerDescription(resolvedId), [registerDescription, resolvedId]);
+    return (_jsx("p", { ...props, ref: ref, id: resolvedId, className: cn("liano-dialog__description", className) }));
+}
+function DialogFooter({ className, ref, ...props }) {
+    return _jsx("div", { ...props, ref: ref, className: cn("liano-dialog__footer", className) });
+}
+function DialogTrigger({ className, disabled, onClick, ref, type = "button", ...props }) {
+    const { open, setOpen, contentId, triggerRef } = useDialogContext("Dialog.Trigger");
+    const handleClick = () => {
+        if (disabled) {
+            return;
+        }
+        setOpen(true);
+    };
+    return (_jsx("button", { ...props, ref: composeRefs(ref, triggerRef), type: type, disabled: disabled, "aria-controls": contentId, "aria-expanded": open ? "true" : "false", "data-state": open ? "open" : "closed", className: cn("liano-dialog__trigger", className), onClick: composeEventHandlers(onClick, handleClick) }));
+}
+function DialogClose({ className, onClick, ref, type = "button", ...props }) {
+    const { close } = useDialogContext("Dialog.Close");
+    return (_jsx("button", { ...props, ref: ref, type: type, className: cn("liano-dialog__close", className), onClick: composeEventHandlers(onClick, () => {
+            close();
+        }) }));
+}
+export const Dialog = Object.assign(DialogRoot, {
+    Close: DialogClose,
+    Content: DialogContent,
+    Description: DialogDescription,
+    Footer: DialogFooter,
+    Header: DialogHeader,
+    Overlay: DialogOverlay,
+    Portal: DialogPortal,
+    Title: DialogTitle,
+    Trigger: DialogTrigger
+});

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

@@ -0,0 +1,2 @@
+export { Dialog } from "./dialog.js";
+export type { DialogCloseProps, DialogContentProps, DialogDescriptionProps, DialogFooterProps, DialogHeaderProps, DialogOverlayProps, DialogProps, DialogTitleProps, DialogTriggerProps } from "./dialog.js";

package/dist/components/dialog/index.js

@@ -0,0 +1,2 @@
+"use client";
+export { Dialog } from "./dialog.js";

package/dist/components/dropdown-menu/dropdown-menu.d.ts

@@ -0,0 +1,43 @@
+import * as React from "react";
+import type { PortalProps } from "../../internal/portal/index.js";
+import type { FloatingPlacement } from "../../internal/floating/floating-types.js";
+export interface DropdownMenuProps extends React.HTMLAttributes<HTMLDivElement> {
+    container?: PortalProps["container"];
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    placement?: FloatingPlacement;
+    sideOffset?: number;
+    collisionPadding?: number;
+    matchTriggerWidth?: boolean;
+}
+export interface DropdownMenuTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    ref?: React.Ref<HTMLButtonElement>;
+}
+export interface DropdownMenuContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    sideOffset?: number;
+    collisionPadding?: number;
+    matchTriggerWidth?: boolean;
+    forceMount?: boolean;
+    ref?: React.Ref<HTMLDivElement>;
+}
+export interface DropdownMenuItemProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    onSelect?: (event: React.SyntheticEvent<HTMLElement>) => void;
+    ref?: React.Ref<HTMLButtonElement>;
+}
+export interface DropdownMenuSeparatorProps extends React.HTMLAttributes<HTMLDivElement> {
+    ref?: React.Ref<HTMLDivElement>;
+}
+declare function DropdownMenuRoot({ children, className, container, defaultOpen, onOpenChange, open: openProp, placement, sideOffset, collisionPadding, matchTriggerWidth, ...props }: DropdownMenuProps): React.JSX.Element;
+declare function DropdownMenuTrigger({ className, disabled, onClick, ref, type, ...props }: DropdownMenuTriggerProps): React.JSX.Element;
+declare function DropdownMenuContent({ children, className, forceMount, sideOffset, collisionPadding, matchTriggerWidth, ref, onKeyDown, ...props }: DropdownMenuContentProps): React.JSX.Element | null;
+declare function DropdownMenuItem({ children, className, disabled, onClick, onSelect, onKeyDown, ref, ...props }: DropdownMenuItemProps): React.JSX.Element;
+declare function DropdownMenuSeparator({ className, ref, ...props }: DropdownMenuSeparatorProps): React.JSX.Element;
+type DropdownMenuComponent = typeof DropdownMenuRoot & {
+    Content: typeof DropdownMenuContent;
+    Item: typeof DropdownMenuItem;
+    Separator: typeof DropdownMenuSeparator;
+    Trigger: typeof DropdownMenuTrigger;
+};
+export declare const DropdownMenu: DropdownMenuComponent;
+export {};

package/dist/components/dropdown-menu/dropdown-menu.js

@@ -0,0 +1,286 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { composeEventHandlers } from "../../utils/compose-event-handlers.js";
+import { cn } from "../../utils/cn.js";
+import { useControllableState } from "../../hooks/use-controllable-state.js";
+import { Portal } from "../../internal/portal/index.js";
+import { DismissableLayer } from "../../internal/dismissable-layer/dismissable-layer.js";
+import { useFloatingPosition } from "../../internal/floating/index.js";
+const defaultContentPositioning = {
+    sideOffset: 8,
+    collisionPadding: 0,
+    matchTriggerWidth: false
+};
+const DropdownMenuContext = React.createContext(null);
+function useDropdownMenuContext(calledBy) {
+    const context = React.useContext(DropdownMenuContext);
+    if (context === null) {
+        throw new Error(`"${calledBy}" must be used within a <DropdownMenu />`);
+    }
+    return context;
+}
+function composeRefs(...refs) {
+    return (node) => {
+        for (const ref of refs) {
+            if (typeof ref === "function") {
+                ref(node);
+            }
+            else if (ref && "current" in ref) {
+                ref.current = node;
+            }
+        }
+    };
+}
+function filterEnabledItems(items) {
+    return items.filter((item) => !item.disabled && item.ref !== null);
+}
+function DropdownMenuRoot({ children, className, container, defaultOpen = false, onOpenChange, open: openProp, placement = "bottom", sideOffset = 8, collisionPadding = 0, matchTriggerWidth = false, ...props }) {
+    const [open, setOpen] = useControllableState({
+        ...(openProp !== undefined ? { value: openProp } : {}),
+        defaultValue: defaultOpen,
+        ...(onOpenChange ? { onChange: onOpenChange } : {})
+    });
+    const instanceId = React.useId();
+    const triggerRef = React.useRef(null);
+    const triggerId = `${instanceId}-trigger`;
+    const contentId = `${instanceId}-content`;
+    const itemRegistry = React.useRef(new Map());
+    const itemOrder = React.useRef([]);
+    const wasOpenRef = React.useRef(false);
+    const [contentPositioning, setContentPositioning] = React.useState({
+        sideOffset,
+        collisionPadding,
+        matchTriggerWidth
+    });
+    const floating = useFloatingPosition({
+        open,
+        placement,
+        strategy: "absolute",
+        offset: contentPositioning.sideOffset,
+        collisionPadding: contentPositioning.collisionPadding,
+        matchReferenceWidth: contentPositioning.matchTriggerWidth
+    });
+    const getEnabledItems = React.useCallback(() => {
+        const ordered = itemOrder.current
+            .map((id) => itemRegistry.current.get(id))
+            .filter((item) => item !== undefined && item !== null)
+            .map((item, index) => {
+            const id = itemOrder.current[index] ?? "";
+            return {
+                id,
+                ref: item.ref,
+                disabled: item.disabled,
+                ...(item.onSelect ? { onSelect: item.onSelect } : {})
+            };
+        });
+        return filterEnabledItems(ordered);
+    }, []);
+    const registerItem = React.useCallback((item) => {
+        if (!itemOrder.current.includes(item.id)) {
+            itemOrder.current.push(item.id);
+        }
+        itemRegistry.current.set(item.id, {
+            id: item.id,
+            ref: item.ref,
+            disabled: item.disabled,
+            ...(item.onSelect ? { onSelect: item.onSelect } : {})
+        });
+    }, []);
+    const unregisterItem = React.useCallback((id) => {
+        itemRegistry.current.delete(id);
+        itemOrder.current = itemOrder.current.filter((itemId) => itemId !== id);
+    }, []);
+    React.useEffect(() => {
+        if (wasOpenRef.current && !open) {
+            triggerRef.current?.focus();
+        }
+        wasOpenRef.current = open;
+    }, [open]);
+    React.useLayoutEffect(() => {
+        if (open && triggerRef.current !== null) {
+            const focusFirstItem = () => {
+                const first = getEnabledItems()[0];
+                first?.ref?.focus();
+            };
+            queueMicrotask(focusFirstItem);
+        }
+    }, [open, getEnabledItems]);
+    return (_jsx(DropdownMenuContext.Provider, { value: {
+            contentId,
+            updateContentPositioning: setContentPositioning,
+            open,
+            setOpen,
+            triggerId,
+            triggerRef,
+            referenceRef: floating.referenceRef,
+            floatingRef: floating.floatingRef,
+            floatingStyle: floating.floatingStyle,
+            getEnabledItems,
+            registerItem,
+            unregisterItem,
+            ...(container === undefined ? {} : { container })
+        }, children: _jsx("div", { ...props, className: cn("liano-dropdown-menu", className), "data-state": open ? "open" : "closed", children: children }) }));
+}
+function DropdownMenuTrigger({ className, disabled, onClick, ref, type = "button", ...props }) {
+    const { contentId, open, setOpen, triggerRef, triggerId, referenceRef, getEnabledItems } = useDropdownMenuContext("DropdownMenu.Trigger");
+    return (_jsx("button", { ...props, ref: composeRefs(ref, triggerRef, referenceRef), type: type, disabled: disabled, id: triggerId, role: "button", "aria-haspopup": "menu", "aria-expanded": open ? "true" : "false", "aria-controls": contentId, className: cn("liano-dropdown-menu__trigger", className), onClick: composeEventHandlers(onClick, () => {
+            if (disabled) {
+                return;
+            }
+            const nextOpen = !open;
+            setOpen(nextOpen);
+            if (!nextOpen) {
+                return;
+            }
+            queueMicrotask(() => {
+                const first = getEnabledItems()[0];
+                first?.ref?.focus();
+            });
+        }) }));
+}
+function DropdownMenuContent({ children, className, forceMount = false, sideOffset = defaultContentPositioning.sideOffset, collisionPadding = defaultContentPositioning.collisionPadding, matchTriggerWidth = defaultContentPositioning.matchTriggerWidth, ref, onKeyDown, ...props }) {
+    const { container, contentId, open, setOpen, updateContentPositioning, triggerId, floatingRef, floatingStyle, getEnabledItems } = useDropdownMenuContext("DropdownMenu.Content");
+    const focusItem = React.useCallback((index, items) => {
+        if (items.length === 0) {
+            return;
+        }
+        const clampedIndex = ((index % items.length) + items.length) % items.length;
+        items[clampedIndex]?.ref?.focus();
+    }, []);
+    const findCurrentIndex = React.useCallback((items) => {
+        const activeElement = document.activeElement;
+        if (!(activeElement instanceof HTMLElement)) {
+            return -1;
+        }
+        return items.findIndex((item) => item.ref === activeElement);
+    }, []);
+    const moveFocus = React.useCallback((direction) => {
+        const enabledItems = getEnabledItems();
+        if (enabledItems.length === 0) {
+            return;
+        }
+        const current = findCurrentIndex(enabledItems);
+        if (direction === "next") {
+            focusItem(current + 1, enabledItems);
+            return;
+        }
+        focusItem(current - 1, enabledItems);
+    }, [focusItem, findCurrentIndex, getEnabledItems]);
+    const moveToBoundary = React.useCallback((isEnd) => {
+        const enabledItems = getEnabledItems();
+        if (enabledItems.length === 0) {
+            return;
+        }
+        if (isEnd) {
+            enabledItems.at(-1)?.ref?.focus();
+            return;
+        }
+        enabledItems[0]?.ref?.focus();
+    }, [getEnabledItems]);
+    React.useEffect(() => {
+        updateContentPositioning({
+            sideOffset,
+            collisionPadding,
+            matchTriggerWidth
+        });
+        return () => {
+            updateContentPositioning(defaultContentPositioning);
+        };
+    }, [collisionPadding, matchTriggerWidth, sideOffset, updateContentPositioning]);
+    if (!open && !forceMount) {
+        return null;
+    }
+    const content = (_jsx("div", { ...props, ref: (node) => {
+            floatingRef(node);
+            if (typeof ref === "function") {
+                ref(node);
+            }
+            else if (ref) {
+                ref.current = node;
+            }
+        }, id: contentId, role: "menu", "aria-labelledby": triggerId, className: cn("liano-dropdown-menu__content", className), style: floatingStyle, "data-state": open ? "open" : "closed", hidden: open ? undefined : true, onKeyDown: composeEventHandlers(onKeyDown, (event) => {
+            if (event.key === "ArrowDown") {
+                event.preventDefault();
+                moveFocus("next");
+                return;
+            }
+            if (event.key === "ArrowUp") {
+                event.preventDefault();
+                moveFocus("prev");
+                return;
+            }
+            if (event.key === "Home") {
+                event.preventDefault();
+                moveToBoundary(false);
+                return;
+            }
+            if (event.key === "End") {
+                event.preventDefault();
+                moveToBoundary(true);
+                return;
+            }
+            if (event.key === "Escape") {
+                setOpen(false);
+                return;
+            }
+            if (event.key === "Enter" || event.key === " " || event.key === "Space" || event.key === "Spacebar") {
+                event.preventDefault();
+            }
+        }), tabIndex: -1, children: children }));
+    if (!open) {
+        return (_jsx(Portal, { ...(container === undefined ? {} : { container }), children: content }));
+    }
+    return (_jsx(Portal, { ...(container === undefined ? {} : { container }), children: _jsx(DismissableLayer, { open: open, onDismiss: () => {
+                setOpen(false);
+            }, children: content }) }));
+}
+function DropdownMenuItem({ children, className, disabled, onClick, onSelect, onKeyDown, ref, ...props }) {
+    const context = useDropdownMenuContext("DropdownMenu.Item");
+    const itemRef = React.useRef(null);
+    const itemId = React.useId();
+    const isDisabled = disabled === true;
+    React.useLayoutEffect(() => {
+        const itemRecord = {
+            id: itemId,
+            ref: itemRef.current,
+            disabled: isDisabled,
+            ...(onSelect ? { onSelect } : {})
+        };
+        context.registerItem(itemRecord);
+        return () => context.unregisterItem(itemId);
+    }, [context, isDisabled, itemId, onSelect]);
+    return (_jsx("button", { ...props, ref: (node) => {
+            itemRef.current = node;
+            if (typeof ref === "function") {
+                ref(node);
+            }
+            else if (ref) {
+                ref.current = node;
+            }
+        }, type: "button", role: "menuitem", disabled: isDisabled, "aria-disabled": isDisabled ? "true" : undefined, className: cn("liano-dropdown-menu__item", className), "data-state": isDisabled ? "disabled" : "enabled", onClick: composeEventHandlers(onClick, (event) => {
+            if (isDisabled) {
+                return;
+            }
+            onSelect?.(event);
+            context.setOpen(false);
+        }), onKeyDown: composeEventHandlers(onKeyDown, (event) => {
+            if (event.key === " " || event.key === "Space" || event.key === "Enter" || event.key === "Spacebar") {
+                event.preventDefault();
+                if (isDisabled) {
+                    return;
+                }
+                onSelect?.(event);
+                context.setOpen(false);
+            }
+        }), children: children }));
+}
+function DropdownMenuSeparator({ className, ref, ...props }) {
+    return (_jsx("div", { ...props, ref: ref, role: "separator", "aria-hidden": "true", className: cn("liano-dropdown-menu__separator", className) }));
+}
+export const DropdownMenu = Object.assign(DropdownMenuRoot, {
+    Content: DropdownMenuContent,
+    Item: DropdownMenuItem,
+    Separator: DropdownMenuSeparator,
+    Trigger: DropdownMenuTrigger
+});

package/dist/components/dropdown-menu/index.d.ts

@@ -0,0 +1,2 @@
+export { DropdownMenu } from "./dropdown-menu.js";
+export type { DropdownMenuContentProps, DropdownMenuItemProps, DropdownMenuProps, DropdownMenuSeparatorProps, DropdownMenuTriggerProps } from "./dropdown-menu.js";

package/dist/components/dropdown-menu/index.js

@@ -0,0 +1,2 @@
+"use client";
+export { DropdownMenu } from "./dropdown-menu.js";

package/dist/components/empty-state/empty-state.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+export type EmptyStateSize = "sm" | "md" | "lg";
+export type EmptyStateAlign = "start" | "center";
+export interface EmptyStateProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
+    icon?: React.ReactNode;
+    title: React.ReactNode;
+    description?: React.ReactNode;
+    actions?: React.ReactNode;
+    size?: EmptyStateSize;
+    align?: EmptyStateAlign;
+    ref?: React.Ref<HTMLDivElement>;
+}
+export declare function EmptyState({ actions, align, children: _children, className, description, icon, ref, size, title, ...props }: EmptyStateProps): React.JSX.Element;

package/dist/components/empty-state/empty-state.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../../utils/cn.js";
+function hasRenderableNode(value) {
+    if (value === null || value === undefined || value === false) {
+        return false;
+    }
+    if (typeof value === "string" || typeof value === "number" || typeof value === "bigint") {
+        return true;
+    }
+    if (React.isValidElement(value)) {
+        const props = value.props;
+        if (props["aria-hidden"] === true || props["aria-hidden"] === "true") {
+            return false;
+        }
+        if (typeof props["aria-label"] === "string" && props["aria-label"].trim() !== "") {
+            return true;
+        }
+        if (typeof props["aria-labelledby"] === "string" && props["aria-labelledby"].trim() !== "") {
+            return true;
+        }
+        if (typeof props["title"] === "string" && props["title"].trim() !== "") {
+            return true;
+        }
+        return React.Children.toArray(props.children).some(hasRenderableNode);
+    }
+    return false;
+}
+export function EmptyState({ actions, align = "center", children: _children, className, description, icon, ref, size = "md", title, ...props }) {
+    const hasIcon = hasRenderableNode(icon);
+    const showDescription = description !== null && description !== undefined;
+    const showActions = actions !== null && actions !== undefined;
+    return (_jsxs("div", { ...props, ref: ref, className: cn("liano-empty-state", className), "data-align": align, "data-size": size, children: [icon ? _jsx("div", { "aria-hidden": hasIcon ? undefined : true, className: "liano-empty-state__icon", children: icon }) : null, _jsx("h3", { className: "liano-empty-state__title", children: title }), showDescription ? _jsx("p", { className: "liano-empty-state__description", children: description }) : null, showActions ? _jsx("div", { className: "liano-empty-state__actions", children: actions }) : null] }));
+}

package/dist/components/empty-state/index.d.ts

@@ -0,0 +1,2 @@
+export { EmptyState } from "./empty-state.js";
+export type { EmptyStateAlign, EmptyStateProps, EmptyStateSize } from "./empty-state.js";

package/dist/components/empty-state/index.js

@@ -0,0 +1 @@
+export { EmptyState } from "./empty-state.js";

package/dist/components/error-boundary/error-boundary.d.ts

@@ -0,0 +1,29 @@
+import * as React from "react";
+export interface ErrorBoundaryFallbackProps {
+    error: Error;
+    reset: () => void;
+}
+export interface ErrorBoundaryProps {
+    children: React.ReactNode;
+    fallback?: React.ReactNode | ((props: ErrorBoundaryFallbackProps) => React.ReactNode);
+    onError?: (error: Error, info: React.ErrorInfo) => void;
+    resetKeys?: readonly unknown[];
+}
+export interface ErrorBoundaryState {
+    error: Error | null;
+}
+export interface ErrorFallbackProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
+    title?: React.ReactNode;
+    error?: Error;
+    action?: React.ReactNode;
+    ref?: React.Ref<HTMLDivElement>;
+}
+export declare class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {
+    state: ErrorBoundaryState;
+    static getDerivedStateFromError(error: Error): ErrorBoundaryState;
+    componentDidCatch(error: Error, info: React.ErrorInfo): void;
+    componentDidUpdate(previousProps: ErrorBoundaryProps): void;
+    reset: () => void;
+    render(): string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | React.JSX.Element | null | undefined;
+}
+export declare function ErrorFallback({ action, className, error, ref, title, ...props }: ErrorFallbackProps): React.JSX.Element;