@zvk/ui 0.1.5 → 0.1.7

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

@@ -11,6 +11,7 @@ import { placementFromSideAlign, placementParts } from "../../internal/floating/
 import { Slot } from "../../internal/slot/index.js";
 const defaultContentPositioning = {
     sideOffset: 8,
+    alignOffset: 0,
     collisionPadding: 0,
     matchTriggerWidth: false
 };
@@ -65,6 +66,7 @@ function DropdownMenuRoot({ children, className, container, defaultOpen = false,
     const wasOpenRef = React.useRef(false);
     const [contentPositioning, setContentPositioning] = React.useState({
         sideOffset,
+        alignOffset: defaultContentPositioning.alignOffset,
         collisionPadding,
         matchTriggerWidth
     });
@@ -73,6 +75,7 @@ function DropdownMenuRoot({ children, className, container, defaultOpen = false,
         placement: contentPositioning.placement ?? placement,
         strategy: "absolute",
         offset: contentPositioning.sideOffset,
+        alignmentOffset: contentPositioning.alignOffset,
         collisionPadding: contentPositioning.collisionPadding,
         matchReferenceWidth: contentPositioning.matchTriggerWidth
     });
@@ -136,7 +139,7 @@ function DropdownMenuRoot({ children, className, container, defaultOpen = false,
             registerItem,
             unregisterItem,
             ...(container === undefined ? {} : { container })
-        }, children: _jsx("div", { ...props, className: cn("liano-dropdown-menu", className), "data-state": open ? "open" : "closed", children: children }) }));
+        }, children: _jsx("div", { ...props, className: cn("zvk-ui-dropdown-menu", className), "data-state": open ? "open" : "closed", children: children }) }));
 }
 function DropdownMenuTrigger({ asChild = false, className, disabled, onClick, ref, type = "button", ...props }) {
     const { contentId, open, setOpen, triggerRef, triggerId, referenceRef, getEnabledItems } = useDropdownMenuContext("DropdownMenu.Trigger");
@@ -155,11 +158,11 @@ function DropdownMenuTrigger({ asChild = false, className, disabled, onClick, re
         });
     };
     if (asChild) {
-        return (_jsx(Slot, { ...props, ref: composeRefs(ref, triggerRef, referenceRef), id: triggerId, "aria-controls": contentId, "aria-disabled": disabled ? true : undefined, "aria-expanded": open ? "true" : "false", "aria-haspopup": "menu", className: cn("liano-dropdown-menu__trigger", className), "data-disabled": disabled ? "true" : undefined, "data-state": open ? "open" : "closed", onClick: composeEventHandlers(onClick, handleClick), children: props.children }));
+        return (_jsx(Slot, { ...props, ref: composeRefs(ref, triggerRef, referenceRef), id: triggerId, "aria-controls": contentId, "aria-disabled": disabled ? true : undefined, "aria-expanded": open ? "true" : "false", "aria-haspopup": "menu", className: cn("zvk-ui-dropdown-menu__trigger", className), "data-disabled": disabled ? "true" : undefined, "data-state": open ? "open" : "closed", onClick: composeEventHandlers(onClick, handleClick), children: props.children }));
     }
-    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), "data-state": open ? "open" : "closed", onClick: composeEventHandlers(onClick, handleClick) }));
+    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("zvk-ui-dropdown-menu__trigger", className), "data-state": open ? "open" : "closed", onClick: composeEventHandlers(onClick, handleClick) }));
 }
-function DropdownMenuContent({ align, alignOffset: _alignOffset, children, className, forceMount = false, side, sideOffset = defaultContentPositioning.sideOffset, collisionPadding = defaultContentPositioning.collisionPadding, matchTriggerWidth = defaultContentPositioning.matchTriggerWidth, ref, onKeyDown, ...props }) {
+function DropdownMenuContent({ align, alignOffset = defaultContentPositioning.alignOffset, children, className, forceMount = false, side, sideOffset = defaultContentPositioning.sideOffset, collisionPadding = defaultContentPositioning.collisionPadding, matchTriggerWidth = defaultContentPositioning.matchTriggerWidth, ref, onKeyDown, ...props }) {
     const { container, contentId, open, setOpen, updateContentPositioning, triggerId, floatingRef, floatingPlacement, floatingStyle, getEnabledItems } = useDropdownMenuContext("DropdownMenu.Content");
     const focusItem = React.useCallback((index, items) => {
         if (items.length === 0) {
@@ -202,13 +205,14 @@ function DropdownMenuContent({ align, alignOffset: _alignOffset, children, class
         updateContentPositioning({
             ...(side === undefined ? {} : { placement: placementFromSideAlign(side, align, "bottom") }),
             sideOffset,
+            alignOffset,
             collisionPadding,
             matchTriggerWidth
         });
         return () => {
             updateContentPositioning(defaultContentPositioning);
         };
-    }, [align, collisionPadding, matchTriggerWidth, side, sideOffset, updateContentPositioning]);
+    }, [align, alignOffset, collisionPadding, matchTriggerWidth, side, sideOffset, updateContentPositioning]);
     if (!open && !forceMount) {
         return null;
     }
@@ -220,7 +224,7 @@ function DropdownMenuContent({ align, alignOffset: _alignOffset, children, class
             else if (ref) {
                 ref.current = node;
             }
-        }, id: contentId, role: "menu", "aria-labelledby": triggerId, className: cn("liano-dropdown-menu__content", className), style: floatingStyle, "data-align": placementParts(floatingPlacement).align, "data-side": placementParts(floatingPlacement).side, "data-state": open ? "open" : "closed", hidden: open ? undefined : true, onKeyDown: composeEventHandlers(onKeyDown, (event) => {
+        }, id: contentId, role: "menu", "aria-labelledby": triggerId, className: cn("zvk-ui-dropdown-menu__content", className), style: floatingStyle, "data-align": placementParts(floatingPlacement).align, "data-side": placementParts(floatingPlacement).side, "data-state": open ? "open" : "closed", hidden: open ? undefined : true, onKeyDown: composeEventHandlers(onKeyDown, (event) => {
             if (event.key === "ArrowDown") {
                 event.preventDefault();
                 moveFocus("next");
@@ -287,7 +291,7 @@ function DropdownMenuItem({ asChild = false, children, className, disabled, onCl
         },
         role: "menuitem",
         "aria-disabled": isDisabled ? true : undefined,
-        className: cn("liano-dropdown-menu__item", className),
+        className: cn("zvk-ui-dropdown-menu__item", className),
         "data-disabled": isDisabled ? "true" : undefined,
         "data-state": isDisabled ? "disabled" : "enabled",
         onClick: composeEventHandlers(onClick, select),
@@ -306,13 +310,13 @@ function DropdownMenuItem({ asChild = false, children, className, disabled, onCl
         }, type: "button", role: "menuitem", disabled: isDisabled, "aria-disabled": itemProps["aria-disabled"], className: itemProps.className, "data-disabled": itemProps["data-disabled"], "data-state": itemProps["data-state"], onClick: itemProps.onClick, onKeyDown: itemProps.onKeyDown, 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) }));
+    return (_jsx("div", { ...props, ref: ref, role: "separator", "aria-hidden": "true", className: cn("zvk-ui-dropdown-menu__separator", className) }));
 }
 function DropdownMenuLabel({ className, ref, ...props }) {
-    return (_jsx("div", { ...props, ref: ref, className: cn("liano-dropdown-menu__label", className) }));
+    return (_jsx("div", { ...props, ref: ref, className: cn("zvk-ui-dropdown-menu__label", className) }));
 }
 function DropdownMenuShortcut({ className, ref, ...props }) {
-    return (_jsx("span", { ...props, ref: ref, className: cn("liano-dropdown-menu__shortcut", className) }));
+    return (_jsx("span", { ...props, ref: ref, className: cn("zvk-ui-dropdown-menu__shortcut", className) }));
 }
 function DropdownMenuCheckboxItem({ asChild = false, checked, children, className, defaultChecked = false, disabled, onCheckedChange, onClick, onKeyDown, onSelect, ref, ...props }) {
     const context = useDropdownMenuContext("DropdownMenu.CheckboxItem");
@@ -351,7 +355,7 @@ function DropdownMenuCheckboxItem({ asChild = false, checked, children, classNam
         role: "menuitemcheckbox",
         "aria-checked": currentChecked,
         "aria-disabled": isDisabled ? true : undefined,
-        className: cn("liano-dropdown-menu__item", "liano-dropdown-menu__checkbox-item", className),
+        className: cn("zvk-ui-dropdown-menu__item", "zvk-ui-dropdown-menu__checkbox-item", className),
         "data-checked": currentChecked ? "true" : undefined,
         "data-disabled": isDisabled ? "true" : undefined,
         onClick: composeEventHandlers(onClick, select),
@@ -367,14 +371,14 @@ function DropdownMenuCheckboxItem({ asChild = false, checked, children, classNam
     }
     return (_jsxs("button", { ...props, ref: (node) => {
             setComposedRef(itemRef, ref, node);
-        }, type: "button", role: "menuitemcheckbox", disabled: isDisabled, "aria-checked": itemProps["aria-checked"], "aria-disabled": itemProps["aria-disabled"], className: itemProps.className, "data-checked": itemProps["data-checked"], "data-disabled": itemProps["data-disabled"], onClick: itemProps.onClick, onKeyDown: itemProps.onKeyDown, children: [_jsx("span", { className: "liano-dropdown-menu__item-indicator", "aria-hidden": "true", children: currentChecked ? "✓" : "" }), _jsx("span", { className: "liano-dropdown-menu__item-label", children: children })] }));
+        }, type: "button", role: "menuitemcheckbox", disabled: isDisabled, "aria-checked": itemProps["aria-checked"], "aria-disabled": itemProps["aria-disabled"], className: itemProps.className, "data-checked": itemProps["data-checked"], "data-disabled": itemProps["data-disabled"], onClick: itemProps.onClick, onKeyDown: itemProps.onKeyDown, children: [_jsx("span", { className: "zvk-ui-dropdown-menu__item-indicator", "aria-hidden": "true", children: currentChecked ? "✓" : "" }), _jsx("span", { className: "zvk-ui-dropdown-menu__item-label", children: children })] }));
 }
 function DropdownMenuRadioGroup({ children, className, onValueChange, ref, value, ...props }) {
     const contextValue = React.useMemo(() => ({
         ...(value !== undefined ? { value } : {}),
         ...(onValueChange ? { onValueChange } : {})
     }), [onValueChange, value]);
-    return (_jsx(DropdownMenuRadioGroupContext.Provider, { value: contextValue, children: _jsx("div", { ...props, ref: ref, className: cn("liano-dropdown-menu__radio-group", className), role: "group", children: children }) }));
+    return (_jsx(DropdownMenuRadioGroupContext.Provider, { value: contextValue, children: _jsx("div", { ...props, ref: ref, className: cn("zvk-ui-dropdown-menu__radio-group", className), role: "group", children: children }) }));
 }
 function DropdownMenuRadioItem({ asChild = false, children, className, disabled, onClick, onKeyDown, onSelect, ref, value, ...props }) {
     const context = useDropdownMenuContext("DropdownMenu.RadioItem");
@@ -410,7 +414,7 @@ function DropdownMenuRadioItem({ asChild = false, children, className, disabled,
         role: "menuitemradio",
         "aria-checked": checked,
         "aria-disabled": isDisabled ? true : undefined,
-        className: cn("liano-dropdown-menu__item", "liano-dropdown-menu__radio-item", className),
+        className: cn("zvk-ui-dropdown-menu__item", "zvk-ui-dropdown-menu__radio-item", className),
         "data-checked": checked ? "true" : undefined,
         "data-disabled": isDisabled ? "true" : undefined,
         onClick: composeEventHandlers(onClick, select),
@@ -426,10 +430,10 @@ function DropdownMenuRadioItem({ asChild = false, children, className, disabled,
     }
     return (_jsxs("button", { ...props, ref: (node) => {
             setComposedRef(itemRef, ref, node);
-        }, type: "button", role: "menuitemradio", disabled: isDisabled, "aria-checked": itemProps["aria-checked"], "aria-disabled": itemProps["aria-disabled"], className: itemProps.className, "data-checked": itemProps["data-checked"], "data-disabled": itemProps["data-disabled"], onClick: itemProps.onClick, onKeyDown: itemProps.onKeyDown, children: [_jsx("span", { className: "liano-dropdown-menu__item-indicator", "aria-hidden": "true", children: checked ? "●" : "" }), _jsx("span", { className: "liano-dropdown-menu__item-label", children: children })] }));
+        }, type: "button", role: "menuitemradio", disabled: isDisabled, "aria-checked": itemProps["aria-checked"], "aria-disabled": itemProps["aria-disabled"], className: itemProps.className, "data-checked": itemProps["data-checked"], "data-disabled": itemProps["data-disabled"], onClick: itemProps.onClick, onKeyDown: itemProps.onKeyDown, children: [_jsx("span", { className: "zvk-ui-dropdown-menu__item-indicator", "aria-hidden": "true", children: checked ? "●" : "" }), _jsx("span", { className: "zvk-ui-dropdown-menu__item-label", children: children })] }));
 }
 function DropdownMenuSub({ children, className, ref, ...props }) {
-    return (_jsx("div", { ...props, ref: ref, className: cn("liano-dropdown-menu__sub", className), children: children }));
+    return (_jsx("div", { ...props, ref: ref, className: cn("zvk-ui-dropdown-menu__sub", className), children: children }));
 }
 export const DropdownMenu = Object.assign(DropdownMenuRoot, {
     CheckboxItem: DropdownMenuCheckboxItem,

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

@@ -30,5 +30,5 @@ export function EmptyState({ actions, align = "center", children: _children, cla
     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] }));
+    return (_jsxs("div", { ...props, ref: ref, className: cn("zvk-ui-empty-state", className), "data-align": align, "data-size": size, children: [icon ? _jsx("div", { "aria-hidden": hasIcon ? undefined : true, className: "zvk-ui-empty-state__icon", children: icon }) : null, _jsx("h3", { className: "zvk-ui-empty-state__title", children: title }), showDescription ? _jsx("p", { className: "zvk-ui-empty-state__description", children: description }) : null, showActions ? _jsx("div", { className: "zvk-ui-empty-state__actions", children: actions }) : null] }));
 }

package/dist/components/error-boundary/error-boundary.js

@@ -39,5 +39,5 @@ export class ErrorBoundary extends React.Component {
     }
 }
 export function ErrorFallback({ action, className, error, ref, title = "Something went wrong", ...props }) {
-    return (_jsxs("div", { ...props, ref: ref, "aria-label": typeof title === "string" ? title : undefined, className: cn("liano-error-fallback", className), role: "alert", children: [_jsx("h3", { className: "liano-error-fallback__title", children: title }), error ? _jsx("p", { className: "liano-error-fallback__message", children: error.message }) : null, action ? _jsx("div", { className: "liano-error-fallback__action", children: action }) : null] }));
+    return (_jsxs("div", { ...props, ref: ref, "aria-label": typeof title === "string" ? title : undefined, className: cn("zvk-ui-error-fallback", className), role: "alert", children: [_jsx("h3", { className: "zvk-ui-error-fallback__title", children: title }), error ? _jsx("p", { className: "zvk-ui-error-fallback__message", children: error.message }) : null, action ? _jsx("div", { className: "zvk-ui-error-fallback__action", children: action }) : null] }));
 }

package/dist/components/field/field.js

@@ -2,16 +2,16 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from "react";
 import { cn } from "../../utils/cn.js";
 function FieldRoot({ className, disabled, invalid, ref, required, ...props }) {
-    return (_jsx("div", { ...props, ref: ref, className: cn("liano-field", className), "data-disabled": disabled ? "true" : undefined, "data-invalid": invalid ? "true" : undefined, "data-required": required ? "true" : undefined }));
+    return (_jsx("div", { ...props, ref: ref, className: cn("zvk-ui-field", className), "data-disabled": disabled ? "true" : undefined, "data-invalid": invalid ? "true" : undefined, "data-required": required ? "true" : undefined }));
 }
 function FieldLabel({ className, ref, ...props }) {
-    return _jsx("label", { ...props, ref: ref, className: cn("liano-field__label", className) });
+    return _jsx("label", { ...props, ref: ref, className: cn("zvk-ui-field__label", className) });
 }
 function FieldDescription({ className, ref, ...props }) {
-    return _jsx("p", { ...props, ref: ref, className: cn("liano-field__description", className) });
+    return _jsx("p", { ...props, ref: ref, className: cn("zvk-ui-field__description", className) });
 }
 function FieldError({ className, ref, role = "alert", ...props }) {
-    return _jsx("p", { ...props, ref: ref, className: cn("liano-field__error", className), role: role });
+    return _jsx("p", { ...props, ref: ref, className: cn("zvk-ui-field__error", className), role: role });
 }
 export const Field = Object.assign(FieldRoot, {
     Label: FieldLabel,

package/dist/components/file-upload-input/file-upload-input.js

@@ -28,12 +28,12 @@ export function FileUploadInput({ "aria-describedby": ariaDescribedBy, buttonLab
     const descriptionId = hasDescription ? `${inputId}-description` : undefined;
     const errorId = hasError ? `${inputId}-error` : undefined;
     const summaryId = `${inputId}-summary`;
-    const describedBy = joinIds(ariaDescribedBy, descriptionId, errorId);
+    const describedBy = joinIds(ariaDescribedBy, descriptionId, errorId, summaryId);
     function handleChange(event) {
         setFiles(event.currentTarget.files);
         onChange?.(event);
     }
-    const input = (_jsxs("div", { className: "liano-file-upload-input", children: [_jsx("span", { "aria-hidden": "true", className: "liano-file-upload-input__button", children: buttonLabel }), _jsx("input", { ...props, ref: ref, "aria-describedby": describedBy, "aria-invalid": invalidState ? true : undefined, className: cn("liano-file-upload-input__control", className), "data-disabled": disabled ? "true" : undefined, "data-invalid": invalidState ? "true" : undefined, "data-required": required ? "true" : undefined, "data-size": size, disabled: disabled, id: inputId, onChange: handleChange, required: required, type: "file" }), _jsx("span", { className: "liano-file-upload-input__summary", id: summaryId, children: getFileSummary(files, emptyLabel) })] }));
+    const input = (_jsxs("div", { className: "zvk-ui-file-upload-input", children: [_jsx("span", { "aria-hidden": "true", className: "zvk-ui-file-upload-input__button", children: buttonLabel }), _jsx("input", { ...props, ref: ref, "aria-describedby": describedBy, "aria-invalid": invalidState ? true : undefined, className: cn("zvk-ui-file-upload-input__control", className), "data-disabled": disabled ? "true" : undefined, "data-invalid": invalidState ? "true" : undefined, "data-required": required ? "true" : undefined, "data-size": size, disabled: disabled, id: inputId, onChange: handleChange, required: required, type: "file" }), _jsx("span", { className: "zvk-ui-file-upload-input__summary", id: summaryId, children: getFileSummary(files, emptyLabel) })] }));
     if (!hasRenderableNode(label) && !hasDescription && !hasError) {
         return input;
     }

package/dist/components/form/form.js

@@ -15,7 +15,7 @@ function joinIds(ids) {
     return value.length > 0 ? value : undefined;
 }
 export function Form({ className, ref, ...props }) {
-    return _jsx("form", { ...props, ref: ref, className: cn("liano-form", className) });
+    return _jsx("form", { ...props, ref: ref, className: cn("zvk-ui-form", className) });
 }
 export function FormField({ children, className, disabled, id, invalid, required, ...props }) {
     const generatedId = React.useId();
@@ -36,14 +36,14 @@ export function FormField({ children, className, disabled, id, invalid, required
         registerDescription,
         unregisterDescription
     }), [controlId, descriptionIds, disabled, invalid, registerDescription, required, unregisterDescription]);
-    return (_jsx(FormFieldContext.Provider, { value: context, children: _jsx("div", { ...props, className: cn("liano-form-field", className), "data-disabled": disabled ? "true" : undefined, "data-invalid": invalid ? "true" : undefined, "data-required": required ? "true" : undefined, children: children }) }));
+    return (_jsx(FormFieldContext.Provider, { value: context, children: _jsx("div", { ...props, className: cn("zvk-ui-form-field", className), "data-disabled": disabled ? "true" : undefined, "data-invalid": invalid ? "true" : undefined, "data-required": required ? "true" : undefined, children: children }) }));
 }
 export function FormItem({ className, ref, ...props }) {
-    return _jsx("div", { ...props, ref: ref, className: cn("liano-form-item", className) });
+    return _jsx("div", { ...props, ref: ref, className: cn("zvk-ui-form-item", className) });
 }
 export function FormLabel({ className, htmlFor, ref, ...props }) {
     const context = useFormFieldContext("FormLabel");
-    return _jsx("label", { ...props, ref: ref, className: cn("liano-form-label", className), htmlFor: htmlFor ?? context.controlId });
+    return _jsx("label", { ...props, ref: ref, className: cn("zvk-ui-form-label", className), htmlFor: htmlFor ?? context.controlId });
 }
 export function FormControl({ children }) {
     const context = useFormFieldContext("FormControl");
@@ -81,8 +81,8 @@ function FormText({ className, id, ref, role, textRole, ...props }) {
     return _jsx("p", { ...props, ref: ref, id: textId, role: role, className: className });
 }
 export function FormDescription({ className, ...props }) {
-    return _jsx(FormText, { ...props, className: cn("liano-form-description", className), textRole: "FormDescription" });
+    return _jsx(FormText, { ...props, className: cn("zvk-ui-form-description", className), textRole: "FormDescription" });
 }
 export function FormMessage({ className, role = "alert", ...props }) {
-    return _jsx(FormText, { ...props, className: cn("liano-form-message", className), role: role, textRole: "FormMessage" });
+    return _jsx(FormText, { ...props, className: cn("zvk-ui-form-message", className), role: role, textRole: "FormMessage" });
 }

package/dist/components/hover-card/hover-card.d.ts

@@ -29,7 +29,7 @@ export interface HoverCardContentProps extends React.HTMLAttributes<HTMLDivEleme
 }
 declare function HoverCardRoot({ children, closeDelay, defaultOpen, disabled, onOpenChange, open: openProp, openDelay, placement }: HoverCardProps): React.JSX.Element;
 declare function HoverCardTrigger({ children, asChild: _asChild }: HoverCardTriggerProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
-declare function HoverCardContent({ align, alignOffset: _alignOffset, children, className, collisionPadding, container, forceMount, id, onBlur, onFocus, onMouseEnter, onMouseLeave, onPointerEnter, onPointerLeave, placement, ref, side, sideOffset, style, ...props }: HoverCardContentProps): React.JSX.Element | null;
+declare function HoverCardContent({ align, alignOffset, children, className, collisionPadding, container, forceMount, id, onBlur, onFocus, onMouseEnter, onMouseLeave, onPointerEnter, onPointerLeave, placement, ref, side, sideOffset, style, ...props }: HoverCardContentProps): React.JSX.Element | null;
 export declare const HoverCard: typeof HoverCardRoot & {
     Trigger: typeof HoverCardTrigger;
     Content: typeof HoverCardContent;

package/dist/components/hover-card/hover-card.js

@@ -10,6 +10,7 @@ import { cn } from "../../utils/cn.js";
 import { composeEventHandlers } from "../../utils/compose-event-handlers.js";
 const defaultContentPositioning = {
     sideOffset: 8,
+    alignOffset: 0,
     collisionPadding: 0
 };
 const HoverCardContext = React.createContext(null);
@@ -58,6 +59,7 @@ function HoverCardRoot({ children, closeDelay = 300, defaultOpen = false, disabl
         open,
         placement: contentPositioning.placement ?? placement,
         offset: contentPositioning.sideOffset,
+        alignmentOffset: contentPositioning.alignOffset,
         collisionPadding: contentPositioning.collisionPadding,
         flip: true,
         shift: true
@@ -222,7 +224,7 @@ function HoverCardTrigger({ children, asChild: _asChild = false }) {
         "aria-describedby": joinIds(typeof childAriaDescribedBy === "string" ? childAriaDescribedBy : undefined, context.open ? context.contentId : undefined),
         "aria-expanded": context.open,
         "aria-haspopup": "dialog",
-        className: cn("liano-hover-card__trigger", childClassName),
+        className: cn("zvk-ui-hover-card__trigger", childClassName),
         "data-state": context.open ? "open" : "closed",
         onBlur: composeEventHandlers(childProps.onBlur, (event) => {
             context.closeAfterFocusLeaves(event.relatedTarget);
@@ -234,7 +236,7 @@ function HoverCardTrigger({ children, asChild: _asChild = false }) {
         onPointerLeave: composeEventHandlers(childProps.onPointerLeave, context.closeWithDelay)
     });
 }
-function HoverCardContent({ align, alignOffset: _alignOffset, children, className, collisionPadding = defaultContentPositioning.collisionPadding, container, forceMount = false, id, onBlur, onFocus, onMouseEnter, onMouseLeave, onPointerEnter, onPointerLeave, placement, ref, side, sideOffset = defaultContentPositioning.sideOffset, style, ...props }) {
+function HoverCardContent({ align, alignOffset = defaultContentPositioning.alignOffset, children, className, collisionPadding = defaultContentPositioning.collisionPadding, container, forceMount = false, id, onBlur, onFocus, onMouseEnter, onMouseLeave, onPointerEnter, onPointerLeave, placement, ref, side, sideOffset = defaultContentPositioning.sideOffset, style, ...props }) {
     const context = useHoverCardContext("HoverCard.Content");
     const contentId = id ?? context.contentId;
     const placementParts = getPlacementParts(context.resolvedPlacement);
@@ -244,14 +246,15 @@ function HoverCardContent({ align, alignOffset: _alignOffset, children, classNam
         setContentPositioning({
             ...(resolvedPlacement === undefined ? {} : { placement: resolvedPlacement }),
             sideOffset,
+            alignOffset,
             collisionPadding
         });
         return () => setContentPositioning(defaultContentPositioning);
-    }, [align, collisionPadding, placement, setContentPositioning, side, sideOffset]);
+    }, [align, alignOffset, collisionPadding, placement, setContentPositioning, side, sideOffset]);
     if (!context.open && !forceMount) {
         return null;
     }
-    const content = (_jsx("div", { ...props, ref: composeRefs(ref, context.floatingRef), id: contentId, role: "dialog", className: cn("liano-hover-card__content", className), "data-align": placementParts.align, "data-side": placementParts.side, "data-state": context.open ? "open" : "closed", hidden: context.open ? undefined : true, onBlur: composeEventHandlers(onBlur, (event) => {
+    const content = (_jsx("div", { ...props, ref: composeRefs(ref, context.floatingRef), id: contentId, role: "dialog", className: cn("zvk-ui-hover-card__content", className), "data-align": placementParts.align, "data-side": placementParts.side, "data-state": context.open ? "open" : "closed", hidden: context.open ? undefined : true, onBlur: composeEventHandlers(onBlur, (event) => {
             context.closeAfterFocusLeaves(event.relatedTarget);
         }), onFocus: composeEventHandlers(onFocus, context.openImmediately), onMouseEnter: composeEventHandlers(onMouseEnter, context.cancelClose), onMouseLeave: composeEventHandlers(onMouseLeave, context.closeWithDelay), onPointerEnter: composeEventHandlers(onPointerEnter, context.cancelClose), onPointerLeave: composeEventHandlers(onPointerLeave, context.closeWithDelay), style: { ...context.floatingStyle, ...style }, children: children }));
     if (!context.open) {

package/dist/components/icon-button/icon-button.js

@@ -2,7 +2,25 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from "react";
 import { Spinner } from "../spinner/spinner.js";
 import { cn } from "../../utils/cn.js";
+function isDevelopmentEnvironment() {
+    const runtimeProcess = globalThis.process;
+    if (runtimeProcess?.env?.NODE_ENV) {
+        return runtimeProcess.env.NODE_ENV !== "production";
+    }
+    const metaEnv = import.meta.env;
+    if (typeof metaEnv?.DEV === "boolean") {
+        return metaEnv.DEV;
+    }
+    if (typeof metaEnv?.PROD === "boolean") {
+        return !metaEnv.PROD;
+    }
+    return typeof metaEnv?.MODE === "string" && metaEnv.MODE !== "production";
+}
 export function IconButton({ children, className, disabled, loading = false, ref, size = "md", type = "button", variant = "secondary", ...props }) {
     const isDisabled = disabled || loading;
-    return (_jsx("button", { ...props, ref: ref, "aria-busy": loading ? true : undefined, className: cn("liano-icon-button", className), "data-disabled": isDisabled ? "true" : undefined, "data-loading": loading ? "true" : undefined, "data-size": size, "data-variant": variant, disabled: isDisabled, type: type, children: loading ? _jsx(Spinner, { size: "sm" }) : children }));
+    const hasAccessibleName = props["aria-label"] !== undefined || props["aria-labelledby"] !== undefined;
+    if (!hasAccessibleName && isDevelopmentEnvironment()) {
+        console.warn("IconButton requires an accessible name. Provide aria-label or aria-labelledby.");
+    }
+    return (_jsx("button", { ...props, ref: ref, "aria-busy": loading ? true : undefined, className: cn("zvk-ui-icon-button", className), "data-disabled": isDisabled ? "true" : undefined, "data-loading": loading ? "true" : undefined, "data-size": size, "data-variant": variant, disabled: isDisabled, type: type, children: loading ? _jsx(Spinner, { size: "sm" }) : children }));
 }

package/dist/components/index.d.ts

@@ -1,7 +1,7 @@
 export { Accordion } from "./accordion/index.js";
 export type { AccordionContentProps, AccordionItemProps, AccordionProps, AccordionTriggerProps, AccordionType, AccordionValue } from "./accordion/index.js";
 export { Alert } from "./alert/index.js";
-export type { AlertDescriptionProps, AlertProps, AlertRoot, AlertTitleProps, AlertTone } from "./alert/index.js";
+export type { AlertActionProps, AlertDescriptionProps, AlertProps, AlertRoot, AlertTitleProps, AlertTone } from "./alert/index.js";
 export { Avatar } from "./avatar/index.js";
 export type { AvatarProps, AvatarShape, AvatarSize } from "./avatar/index.js";
 export { Badge } from "./badge/index.js";
@@ -11,7 +11,7 @@ export type { BreadcrumbsItemProps, BreadcrumbsProps } from "./breadcrumbs/index
 export { Button } from "./button/index.js";
 export type { ButtonProps, ButtonSize, ButtonVariant } from "./button/index.js";
 export { Card } from "./card/index.js";
-export type { CardDescriptionProps, CardPadding, CardProps, CardSlotProps, CardTitleProps, CardVariant } from "./card/index.js";
+export type { CardActionProps, CardDescriptionProps, CardPadding, CardProps, CardSlotProps, CardTitleProps, CardVariant } from "./card/index.js";
 export { Calendar } from "./calendar/index.js";
 export type { CalendarClassNames, CalendarMode, CalendarNativeProps, CalendarProps, CalendarSingleProps } from "./calendar/index.js";
 export { Carousel } from "./carousel/index.js";
@@ -41,9 +41,9 @@ export type { CommandDialogProps, CommandEmptyProps, CommandGroupProps, CommandI
 export { Combobox } from "./combobox/index.js";
 export type { ComboboxOption, ComboboxProps } from "./combobox/index.js";
 export { ContextMenu } from "./context-menu/index.js";
-export type { ContextMenuCheckboxItemProps, ContextMenuContentProps, ContextMenuItemProps, ContextMenuLabelProps, ContextMenuProps, ContextMenuSeparatorProps, ContextMenuTriggerProps } from "./context-menu/index.js";
+export type { ContextMenuCheckboxItemProps, ContextMenuContentProps, ContextMenuItemProps, ContextMenuLabelProps, ContextMenuProps, ContextMenuRadioItemProps, ContextMenuSeparatorProps, ContextMenuTriggerProps } from "./context-menu/index.js";
 export { Menubar } from "./menubar/index.js";
-export type { MenubarContentProps, MenubarItemProps, MenubarLabelProps, MenubarMenuProps, MenubarProps, MenubarSeparatorProps, MenubarShortcutProps, MenubarTriggerProps } from "./menubar/index.js";
+export type { MenubarCheckboxItemProps, MenubarContentProps, MenubarItemProps, MenubarLabelProps, MenubarMenuProps, MenubarProps, MenubarRadioItemProps, MenubarSeparatorProps, MenubarShortcutProps, MenubarTriggerProps } from "./menubar/index.js";
 export { EmptyState } from "./empty-state/index.js";
 export type { EmptyStateAlign, EmptyStateProps, EmptyStateSize } from "./empty-state/index.js";
 export { ErrorBoundary, ErrorFallback } from "./error-boundary/index.js";
@@ -91,7 +91,7 @@ export type { StatProps, StatSize, StatTone } from "./stat/index.js";
 export { Switch } from "./switch/index.js";
 export type { SwitchProps, SwitchSize } from "./switch/index.js";
 export { Table } from "./table/index.js";
-export type { TableBodyProps, TableCaptionProps, TableCellProps, TableFooterProps, TableHeadProps, TableHeaderProps, TableProps, TableRowProps } from "./table/index.js";
+export type { TableBodyProps, TableCaptionProps, TableCellProps, TableContainerProps, TableFooterProps, TableHeadProps, TableHeaderProps, TableProps, TableRowProps } from "./table/index.js";
 export { Tabs } from "./tabs/index.js";
 export type { TabsActivationMode, TabsContentProps, TabsListProps, TabsOrientation, TabsProps, TabsTriggerProps } from "./tabs/index.js";
 export { TabsWithSidebar } from "./tabs-with-sidebar/index.js";

package/dist/components/input/input.js

@@ -19,7 +19,7 @@ export function Input({ "aria-describedby": ariaDescribedBy, className, descript
     const descriptionId = hasDescription ? `${inputId}-description` : undefined;
     const errorId = hasError ? `${inputId}-error` : undefined;
     const describedBy = joinIds(ariaDescribedBy, descriptionId, errorId);
-    const input = (_jsx("input", { ...props, ref: ref, "aria-describedby": describedBy, "aria-invalid": invalidState ? true : undefined, className: cn("liano-input", className), "data-disabled": disabled ? "true" : undefined, "data-invalid": invalidState ? "true" : undefined, "data-required": required ? "true" : undefined, "data-size": size, disabled: disabled, id: inputId, required: required }));
+    const input = (_jsx("input", { ...props, ref: ref, "aria-describedby": describedBy, "aria-invalid": invalidState ? true : undefined, className: cn("zvk-ui-input", className), "data-disabled": disabled ? "true" : undefined, "data-invalid": invalidState ? "true" : undefined, "data-required": required ? "true" : undefined, "data-size": size, disabled: disabled, id: inputId, required: required }));
     if (!hasLabel && !hasDescription && !hasError) {
         return input;
     }

package/dist/components/label/label.js

@@ -2,5 +2,5 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from "react";
 import { cn } from "../../utils/cn.js";
 export function Label({ children, className, disabled, ref, required, size = "md", ...props }) {
-    return (_jsx("label", { ...props, ref: ref, className: cn("liano-label", className), "data-disabled": disabled ? "true" : undefined, "data-required": required ? "true" : undefined, "data-size": size, children: children }));
+    return (_jsx("label", { ...props, ref: ref, className: cn("zvk-ui-label", className), "data-disabled": disabled ? "true" : undefined, "data-required": required ? "true" : undefined, "data-size": size, children: children }));
 }

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

@@ -1,2 +1,2 @@
 export { Menubar } from "./menubar.js";
-export type { MenubarContentProps, MenubarItemProps, MenubarLabelProps, MenubarMenuProps, MenubarProps, MenubarSeparatorProps, MenubarShortcutProps, MenubarTriggerProps } from "./menubar.js";
+export type { MenubarCheckboxItemProps, MenubarContentProps, MenubarItemProps, MenubarLabelProps, MenubarMenuProps, MenubarProps, MenubarRadioItemProps, MenubarSeparatorProps, MenubarShortcutProps, MenubarTriggerProps } from "./menubar.js";

package/dist/components/menubar/menubar.d.ts

@@ -46,7 +46,7 @@ export interface MenubarShortcutProps extends React.HTMLAttributes<HTMLSpanEleme
 declare function MenubarRoot({ children, className, defaultValue, onKeyDown, onValueChange, ref, value, ...props }: MenubarProps): React.JSX.Element;
 declare function MenubarMenu({ children, value }: MenubarMenuProps): React.JSX.Element;
 declare function MenubarTrigger({ asChild, children, className, disabled, onClick, onKeyDown, ref, type, ...props }: MenubarTriggerProps): React.JSX.Element;
-declare function MenubarContent({ align, alignOffset: _alignOffset, children, className, onKeyDown, ref, side, sideOffset: _sideOffset, ...props }: MenubarContentProps): React.JSX.Element | null;
+declare function MenubarContent({ align, alignOffset, children, className, onKeyDown, ref, side, sideOffset, style, ...props }: MenubarContentProps): React.JSX.Element | null;
 declare function MenubarItem({ asChild, children, className, disabled, onClick, onKeyDown, onSelect, ref, type, ...props }: MenubarItemProps): React.JSX.Element;
 declare function MenubarCheckboxItem({ asChild, checked, children, className, defaultChecked, disabled, onCheckedChange, onClick, onKeyDown, onSelect, ref, type, ...props }: MenubarCheckboxItemProps): React.JSX.Element;
 declare function MenubarRadioItem({ asChild, checked, children, className, disabled, onClick, onKeyDown, onSelect, ref, type, ...props }: MenubarRadioItemProps): React.JSX.Element;

package/dist/components/menubar/menubar.js

@@ -6,6 +6,7 @@ import { cn } from "../../utils/cn.js";
 import { useControllableState } from "../../hooks/use-controllable-state.js";
 import { createCollection } from "../../internal/collection/index.js";
 import { DismissableLayer } from "../../internal/dismissable-layer/index.js";
+import { useFloatingPosition } from "../../internal/floating/index.js";
 import { placementFromSideAlign, placementParts } from "../../internal/floating/placement-aliases.js";
 import { Portal } from "../../internal/portal/index.js";
 import { Slot } from "../../internal/slot/index.js";
@@ -55,6 +56,14 @@ function setComposedRef(internalRef, externalRef, node) {
         externalRef.current = node;
     }
 }
+function setForwardedRef(externalRef, node) {
+    if (typeof externalRef === "function") {
+        externalRef(node);
+    }
+    else if (externalRef !== undefined && externalRef !== null) {
+        externalRef.current = node;
+    }
+}
 function isActivationKey(key) {
     return key === "Enter" || key === " " || key === "Space" || key === "Spacebar";
 }
@@ -79,7 +88,7 @@ function MenubarRoot({ children, className, defaultValue, onKeyDown, onValueChan
         setOpenValue,
         unregisterTrigger
     }), [getTriggers, openValue, registerTrigger, setOpenValue, unregisterTrigger]);
-    return (_jsx(MenubarContext.Provider, { value: contextValue, children: _jsx("div", { ...props, ref: ref, role: "menubar", className: cn("liano-menubar", className), onKeyDown: composeEventHandlers(onKeyDown, (event) => {
+    return (_jsx(MenubarContext.Provider, { value: contextValue, children: _jsx("div", { ...props, ref: ref, role: "menubar", className: cn("zvk-ui-menubar", className), onKeyDown: composeEventHandlers(onKeyDown, (event) => {
                 const triggers = getTriggers();
                 const index = activeIndex(triggers);
                 if (event.key === "ArrowRight") {
@@ -159,7 +168,7 @@ function MenubarTrigger({ asChild = false, children, className, disabled, onClic
         "aria-disabled": disabled ? true : undefined,
         "aria-expanded": menu.open,
         "aria-haspopup": "menu",
-        className: cn("liano-menubar__trigger", className),
+        className: cn("zvk-ui-menubar__trigger", className),
         "data-disabled": disabled ? "true" : undefined,
         "data-state": menu.open ? "open" : "closed",
         onClick: composeEventHandlers(onClick, handleClick),
@@ -170,17 +179,36 @@ function MenubarTrigger({ asChild = false, children, className, disabled, onClic
     }
     return (_jsx("button", { ...props, ref: (node) => {
             setComposedRef(triggerRef, ref, node);
-        }, id: menu.triggerId, type: type, role: "menuitem", disabled: disabled, "aria-controls": menu.contentId, "aria-expanded": menu.open ? "true" : "false", "aria-haspopup": "menu", className: cn("liano-menubar__trigger", className), "data-disabled": disabled ? "true" : undefined, "data-state": menu.open ? "open" : "closed", onClick: triggerProps.onClick, onKeyDown: triggerProps.onKeyDown, children: children }));
+        }, id: menu.triggerId, type: type, role: "menuitem", disabled: disabled, "aria-controls": menu.contentId, "aria-expanded": menu.open ? "true" : "false", "aria-haspopup": "menu", className: cn("zvk-ui-menubar__trigger", className), "data-disabled": disabled ? "true" : undefined, "data-state": menu.open ? "open" : "closed", onClick: triggerProps.onClick, onKeyDown: triggerProps.onKeyDown, children: children }));
 }
-function MenubarContent({ align, alignOffset: _alignOffset, children, className, onKeyDown, ref, side, sideOffset: _sideOffset, ...props }) {
+function MenubarContent({ align, alignOffset = 0, children, className, onKeyDown, ref, side, sideOffset = 4, style, ...props }) {
     const menubar = useMenubarContext("Menubar.Content");
     const menu = useMenuContext("Menubar.Content");
     const contentPlacement = placementFromSideAlign(side, align, "bottom-start");
-    const contentPlacementParts = placementParts(contentPlacement);
+    const { floatingRef, floatingStyle, placement: resolvedPlacement, referenceRef } = useFloatingPosition({
+        open: menu.open,
+        placement: contentPlacement,
+        strategy: "fixed",
+        offset: sideOffset,
+        alignmentOffset: alignOffset,
+        collisionPadding: 4
+    });
+    React.useLayoutEffect(() => {
+        if (!menu.open) {
+            referenceRef(null);
+            return;
+        }
+        const activeTrigger = menubar.getTriggers().find((trigger) => trigger.data.value === menu.value);
+        referenceRef(activeTrigger?.data.ref ?? null);
+        return () => referenceRef(null);
+    }, [menubar, menu.open, menu.value, referenceRef]);
     if (!menu.open) {
         return null;
     }
-    return (_jsx(Portal, { children: _jsx(DismissableLayer, { open: menu.open, onDismiss: () => menubar.setOpenValue(undefined), children: _jsx("div", { ...props, ref: ref, id: menu.contentId, role: "menu", "aria-label": menu.label, "aria-labelledby": menu.triggerId, className: cn("liano-menubar__content", className), "data-align": contentPlacementParts.align, "data-side": contentPlacementParts.side, onKeyDown: composeEventHandlers(onKeyDown, (event) => {
+    return (_jsx(Portal, { children: _jsx(DismissableLayer, { open: menu.open, onDismiss: () => menubar.setOpenValue(undefined), children: _jsx("div", { ...props, ref: (node) => {
+                    floatingRef(node);
+                    setForwardedRef(ref, node);
+                }, id: menu.contentId, role: "menu", "aria-label": menu.label, "aria-labelledby": menu.triggerId, className: cn("zvk-ui-menubar__content", className), style: { ...style, ...floatingStyle }, "data-align": placementParts(resolvedPlacement).align, "data-side": placementParts(resolvedPlacement).side, onKeyDown: composeEventHandlers(onKeyDown, (event) => {
                     const items = menu.getItems();
                     const index = activeIndex(items);
                     if (event.key === "ArrowDown") {
@@ -228,7 +256,7 @@ function MenubarItem({ asChild = false, children, className, disabled, onClick,
         },
         role: "menuitem",
         "aria-disabled": disabled ? true : undefined,
-        className: cn("liano-menubar__item", className),
+        className: cn("zvk-ui-menubar__item", className),
         "data-disabled": disabled ? "true" : undefined,
         onClick: composeEventHandlers(onClick, select),
         onKeyDown: composeEventHandlers(onKeyDown, (event) => {
@@ -282,7 +310,7 @@ function MenubarCheckboxItem({ asChild = false, checked, children, className, de
         role: "menuitemcheckbox",
         "aria-checked": currentChecked,
         "aria-disabled": disabled ? true : undefined,
-        className: cn("liano-menubar__item", "liano-menubar__checkbox-item", className),
+        className: cn("zvk-ui-menubar__item", "zvk-ui-menubar__checkbox-item", className),
         "data-checked": currentChecked ? "true" : undefined,
         "data-disabled": disabled ? "true" : undefined,
         onClick: composeEventHandlers(onClick, select),
@@ -298,7 +326,7 @@ function MenubarCheckboxItem({ asChild = false, checked, children, className, de
     }
     return (_jsxs("button", { ...props, ref: (node) => {
             setComposedRef(itemRef, ref, node);
-        }, type: type, role: "menuitemcheckbox", disabled: disabled, "aria-checked": itemProps["aria-checked"], "aria-disabled": itemProps["aria-disabled"], className: itemProps.className, "data-checked": itemProps["data-checked"], "data-disabled": itemProps["data-disabled"], onClick: itemProps.onClick, onKeyDown: itemProps.onKeyDown, children: [_jsx("span", { className: "liano-menubar__item-indicator", "aria-hidden": "true", children: currentChecked ? "✓" : "" }), _jsx("span", { className: "liano-menubar__item-label", children: children })] }));
+        }, type: type, role: "menuitemcheckbox", disabled: disabled, "aria-checked": itemProps["aria-checked"], "aria-disabled": itemProps["aria-disabled"], className: itemProps.className, "data-checked": itemProps["data-checked"], "data-disabled": itemProps["data-disabled"], onClick: itemProps.onClick, onKeyDown: itemProps.onKeyDown, children: [_jsx("span", { className: "zvk-ui-menubar__item-indicator", "aria-hidden": "true", children: currentChecked ? "✓" : "" }), _jsx("span", { className: "zvk-ui-menubar__item-label", children: children })] }));
 }
 function MenubarRadioItem({ asChild = false, checked = false, children, className, disabled, onClick, onKeyDown, onSelect, ref, type = "button", ...props }) {
     const menubar = useMenubarContext("Menubar.RadioItem");
@@ -331,7 +359,7 @@ function MenubarRadioItem({ asChild = false, checked = false, children, classNam
         role: "menuitemradio",
         "aria-checked": checked,
         "aria-disabled": disabled ? true : undefined,
-        className: cn("liano-menubar__item", "liano-menubar__radio-item", className),
+        className: cn("zvk-ui-menubar__item", "zvk-ui-menubar__radio-item", className),
         "data-checked": checked ? "true" : undefined,
         "data-disabled": disabled ? "true" : undefined,
         onClick: composeEventHandlers(onClick, select),
@@ -347,16 +375,16 @@ function MenubarRadioItem({ asChild = false, checked = false, children, classNam
     }
     return (_jsxs("button", { ...props, ref: (node) => {
             setComposedRef(itemRef, ref, node);
-        }, type: type, role: "menuitemradio", disabled: disabled, "aria-checked": itemProps["aria-checked"], "aria-disabled": itemProps["aria-disabled"], className: itemProps.className, "data-checked": itemProps["data-checked"], "data-disabled": itemProps["data-disabled"], onClick: itemProps.onClick, onKeyDown: itemProps.onKeyDown, children: [_jsx("span", { className: "liano-menubar__item-indicator", "aria-hidden": "true", children: checked ? "●" : "" }), _jsx("span", { className: "liano-menubar__item-label", children: children })] }));
+        }, type: type, role: "menuitemradio", disabled: disabled, "aria-checked": itemProps["aria-checked"], "aria-disabled": itemProps["aria-disabled"], className: itemProps.className, "data-checked": itemProps["data-checked"], "data-disabled": itemProps["data-disabled"], onClick: itemProps.onClick, onKeyDown: itemProps.onKeyDown, children: [_jsx("span", { className: "zvk-ui-menubar__item-indicator", "aria-hidden": "true", children: checked ? "●" : "" }), _jsx("span", { className: "zvk-ui-menubar__item-label", children: children })] }));
 }
 function MenubarSeparator({ className, ref, ...props }) {
-    return _jsx("div", { ...props, ref: ref, role: "separator", "aria-hidden": "true", className: cn("liano-menubar__separator", className) });
+    return _jsx("div", { ...props, ref: ref, role: "separator", "aria-hidden": "true", className: cn("zvk-ui-menubar__separator", className) });
 }
 function MenubarLabel({ className, ref, ...props }) {
-    return _jsx("div", { ...props, ref: ref, className: cn("liano-menubar__label", className) });
+    return _jsx("div", { ...props, ref: ref, className: cn("zvk-ui-menubar__label", className) });
 }
 function MenubarShortcut({ className, ref, ...props }) {
-    return _jsx("span", { ...props, ref: ref, className: cn("liano-menubar__shortcut", className) });
+    return _jsx("span", { ...props, ref: ref, className: cn("zvk-ui-menubar__shortcut", className) });
 }
 export const Menubar = Object.assign(MenubarRoot, {
     CheckboxItem: MenubarCheckboxItem,