@evinvest/uikit 0.18.0 → 0.20.0

package/dist/components/dropdown-menu.js

@@ -0,0 +1,356 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../lib/cn.js";
+import { useControllableState } from "../primitives/use-controllable-state.js";
+import { useFloating } from "../primitives/use-floating.js";
+import { useDismissableLayer } from "../primitives/dismissable-layer.js";
+import { usePresence } from "../primitives/presence.js";
+import { useRovingFocus } from "../primitives/use-roving-focus.js";
+import { mergeRefs } from "../primitives/merge-refs.js";
+import { Portal } from "../primitives/portal.js";
+import { Slot } from "../primitives/slot.js";
+import {
+  DROPDOWN_MENU_CHECK_ITEM,
+  DROPDOWN_MENU_CONTENT,
+  DROPDOWN_MENU_ITEM,
+  DROPDOWN_MENU_ITEM_INDICATOR,
+  DROPDOWN_MENU_LABEL,
+  DROPDOWN_MENU_SEPARATOR,
+  DROPDOWN_MENU_SHORTCUT,
+  DROPDOWN_MENU_SUB_CONTENT,
+  DROPDOWN_MENU_SUB_TRIGGER
+} from "../generated/dropdown-menu.js";
+const DropdownMenuContext = React.createContext(
+  null
+);
+function useDropdownMenu() {
+  const ctx = React.useContext(DropdownMenuContext);
+  if (!ctx) throw new Error("DropdownMenu parts must be used within <DropdownMenu>");
+  return ctx;
+}
+function DropdownMenu({ open, defaultOpen = false, onOpenChange, children }) {
+  const [isOpen, setOpen] = useControllableState({
+    ...open !== void 0 ? { value: open } : {},
+    defaultValue: defaultOpen,
+    ...onOpenChange ? { onChange: onOpenChange } : {}
+  });
+  const anchorRef = React.useRef(null);
+  return /* @__PURE__ */ jsx(DropdownMenuContext.Provider, { value: { open: isOpen, setOpen, anchorRef }, children: /* @__PURE__ */ jsx("div", { "data-slot": "dropdown-menu", children }) });
+}
+function DropdownMenuPortal({ children }) {
+  return /* @__PURE__ */ jsx(Portal, { children });
+}
+function DropdownMenuTrigger({ asChild = false, onClick, ...props }) {
+  const { open, setOpen, anchorRef } = useDropdownMenu();
+  const Comp = asChild ? Slot : "button";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      "data-slot": "dropdown-menu-trigger",
+      "aria-haspopup": "menu",
+      "aria-expanded": open,
+      "data-state": open ? "open" : "closed",
+      ref: anchorRef,
+      onClick: (e) => {
+        onClick?.(e);
+        setOpen(!open);
+      },
+      ...props
+    }
+  );
+}
+function DropdownMenuContent({
+  className,
+  sideOffset = 4,
+  children,
+  ...props
+}) {
+  const { open, setOpen, anchorRef } = useDropdownMenu();
+  const { isPresent, ref: presRef } = usePresence(open);
+  const { floatingRef, style, side } = useFloating({
+    anchorRef,
+    open,
+    side: "bottom",
+    align: "start",
+    offset: sideOffset
+  });
+  const dismissRef = useDismissableLayer({
+    enabled: open,
+    onDismiss: () => setOpen(false),
+    exclude: [anchorRef]
+  });
+  const contentRef = React.useRef(null);
+  const items = () => Array.from(
+    contentRef.current?.querySelectorAll("[role^='menuitem']") ?? []
+  ).filter((el) => el.getAttribute("data-disabled") === null);
+  const { activeIndex, onKeyDown: rovingKeyDown } = useRovingFocus({
+    count: 64,
+    orientation: "vertical",
+    loop: true
+  });
+  React.useEffect(() => {
+    if (!open) return;
+    items()[activeIndex]?.focus();
+  }, [open, activeIndex]);
+  const close = React.useCallback(() => setOpen(false), [setOpen]);
+  if (!isPresent) return null;
+  return /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(DropdownMenuCloseContext.Provider, { value: close, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "dropdown-menu-content",
+      "data-state": open ? "open" : "closed",
+      "data-side": side,
+      role: "menu",
+      tabIndex: -1,
+      onKeyDown: (e) => {
+        rovingKeyDown(e);
+        if (e.key === "Escape") setOpen(false);
+      },
+      ref: mergeRefs(floatingRef, dismissRef, presRef, contentRef),
+      style,
+      className: cn(
+        DROPDOWN_MENU_CONTENT,
+        className
+      ),
+      ...props,
+      children
+    }
+  ) }) });
+}
+const DropdownMenuCloseContext = React.createContext(() => {
+});
+function DropdownMenuGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "dropdown-menu-group", role: "group", className, ...props });
+}
+function DropdownMenuItem({
+  className,
+  inset,
+  variant = "neutral",
+  disabled,
+  onClick,
+  onKeyDown,
+  ...props
+}) {
+  const close = React.useContext(DropdownMenuCloseContext);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "dropdown-menu-item",
+      "data-inset": inset ? "" : void 0,
+      "data-variant": variant,
+      "data-disabled": disabled ? "" : void 0,
+      role: "menuitem",
+      tabIndex: disabled ? void 0 : -1,
+      className: cn(
+        DROPDOWN_MENU_ITEM,
+        className
+      ),
+      onClick: (e) => {
+        if (disabled) return;
+        onClick?.(e);
+        close();
+      },
+      onKeyDown: (e) => {
+        onKeyDown?.(e);
+        if (e.key === "Enter" || e.key === " ") {
+          e.preventDefault();
+          e.currentTarget.click();
+        }
+      },
+      ...props
+    }
+  );
+}
+function DropdownMenuCheckboxItem({
+  className,
+  children,
+  checked,
+  disabled,
+  onClick,
+  ...props
+}) {
+  const close = React.useContext(DropdownMenuCloseContext);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "dropdown-menu-checkbox-item",
+      role: "menuitemcheckbox",
+      "aria-checked": checked,
+      "data-state": checked ? "checked" : "unchecked",
+      "data-disabled": disabled ? "" : void 0,
+      tabIndex: disabled ? void 0 : -1,
+      className: cn(
+        DROPDOWN_MENU_CHECK_ITEM,
+        className
+      ),
+      onClick: (e) => {
+        if (disabled) return;
+        onClick?.(e);
+        close();
+      },
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: DROPDOWN_MENU_ITEM_INDICATOR, children: checked ? /* @__PURE__ */ jsx("svg", { className: "size-4", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M20 6 9 17l-5-5" }) }) : null }),
+        children
+      ]
+    }
+  );
+}
+const DropdownMenuRadioGroupContext = React.createContext(null);
+function DropdownMenuRadioGroup({
+  className,
+  value,
+  onValueChange,
+  children,
+  ...props
+}) {
+  const ctx = React.useMemo(
+    () => ({ value, setValue: (next) => onValueChange?.(next) }),
+    [value, onValueChange]
+  );
+  return /* @__PURE__ */ jsx(DropdownMenuRadioGroupContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx("div", { "data-slot": "dropdown-menu-radio-group", role: "group", className, ...props, children }) });
+}
+function DropdownMenuRadioItem({
+  className,
+  children,
+  value,
+  disabled,
+  onClick,
+  ...props
+}) {
+  const close = React.useContext(DropdownMenuCloseContext);
+  const group = React.useContext(DropdownMenuRadioGroupContext);
+  const checked = group?.value === value;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "dropdown-menu-radio-item",
+      role: "menuitemradio",
+      "aria-checked": checked,
+      "data-state": checked ? "checked" : "unchecked",
+      "data-disabled": disabled ? "" : void 0,
+      tabIndex: disabled ? void 0 : -1,
+      className: cn(
+        DROPDOWN_MENU_CHECK_ITEM,
+        className
+      ),
+      onClick: (e) => {
+        if (disabled) return;
+        onClick?.(e);
+        group?.setValue(value);
+        close();
+      },
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: DROPDOWN_MENU_ITEM_INDICATOR, children: checked ? /* @__PURE__ */ jsx("svg", { className: "size-2 fill-current", viewBox: "0 0 24 24", "aria-hidden": "true", children: /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }) }) : null }),
+        children
+      ]
+    }
+  );
+}
+function DropdownMenuLabel({ className, inset, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "dropdown-menu-label",
+      "data-inset": inset ? "" : void 0,
+      className: cn(DROPDOWN_MENU_LABEL, className),
+      ...props
+    }
+  );
+}
+function DropdownMenuSeparator({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "dropdown-menu-separator",
+      role: "separator",
+      className: cn(DROPDOWN_MENU_SEPARATOR, className),
+      ...props
+    }
+  );
+}
+function DropdownMenuShortcut({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      "data-slot": "dropdown-menu-shortcut",
+      className: cn(DROPDOWN_MENU_SHORTCUT, className),
+      ...props
+    }
+  );
+}
+const DropdownMenuSubContext = React.createContext(null);
+function DropdownMenuSub({ open, defaultOpen = false, onOpenChange, children }) {
+  const [isOpen, setOpen] = useControllableState({
+    ...open !== void 0 ? { value: open } : {},
+    defaultValue: defaultOpen,
+    ...onOpenChange ? { onChange: onOpenChange } : {}
+  });
+  return /* @__PURE__ */ jsx(DropdownMenuSubContext.Provider, { value: { open: isOpen, setOpen }, children: /* @__PURE__ */ jsx("div", { "data-slot": "dropdown-menu-sub", children }) });
+}
+function DropdownMenuSubTrigger({ className, inset, children, onClick, ...props }) {
+  const ctx = React.useContext(DropdownMenuSubContext);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "dropdown-menu-sub-trigger",
+      "data-inset": inset ? "" : void 0,
+      "data-state": ctx?.open ? "open" : "closed",
+      role: "menuitem",
+      "aria-haspopup": "menu",
+      "aria-expanded": ctx?.open,
+      tabIndex: -1,
+      className: cn(
+        DROPDOWN_MENU_SUB_TRIGGER,
+        className
+      ),
+      onClick: (e) => {
+        onClick?.(e);
+        ctx?.setOpen(!ctx.open);
+      },
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx("svg", { className: "ml-auto size-4", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "m9 18 6-6-6-6" }) })
+      ]
+    }
+  );
+}
+function DropdownMenuSubContent({ className, children, ...props }) {
+  const ctx = React.useContext(DropdownMenuSubContext);
+  if (!ctx?.open) return null;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "dropdown-menu-sub-content",
+      "data-state": "open",
+      role: "menu",
+      className: cn(
+        DROPDOWN_MENU_SUB_CONTENT,
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+}
+export {
+  DropdownMenu,
+  DropdownMenuCheckboxItem,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuPortal,
+  DropdownMenuRadioGroup,
+  DropdownMenuRadioItem,
+  DropdownMenuSeparator,
+  DropdownMenuShortcut,
+  DropdownMenuSub,
+  DropdownMenuSubContent,
+  DropdownMenuSubTrigger,
+  DropdownMenuTrigger
+};
+//# sourceMappingURL=dropdown-menu.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/dropdown-menu.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { useControllableState } from \"../primitives/use-controllable-state\";\nimport { useFloating } from \"../primitives/use-floating\";\nimport { useDismissableLayer } from \"../primitives/dismissable-layer\";\nimport { usePresence } from \"../primitives/presence\";\nimport { useRovingFocus } from \"../primitives/use-roving-focus\";\nimport { mergeRefs } from \"../primitives/merge-refs\";\nimport { Portal } from \"../primitives/portal\";\nimport { Slot } from \"../primitives/slot\";\nimport {\n  DROPDOWN_MENU_CHECK_ITEM,\n  DROPDOWN_MENU_CONTENT,\n  DROPDOWN_MENU_ITEM,\n  DROPDOWN_MENU_ITEM_INDICATOR,\n  DROPDOWN_MENU_LABEL,\n  DROPDOWN_MENU_SEPARATOR,\n  DROPDOWN_MENU_SHORTCUT,\n  DROPDOWN_MENU_SUB_CONTENT,\n  DROPDOWN_MENU_SUB_TRIGGER,\n} from \"../generated/dropdown-menu\";\n\ninterface DropdownMenuContextValue {\n  open: boolean;\n  setOpen: (next: boolean) => void;\n  anchorRef: React.RefObject<HTMLElement | null>;\n}\n\nconst DropdownMenuContext = React.createContext<DropdownMenuContextValue | null>(\n  null,\n);\n\nfunction useDropdownMenu(): DropdownMenuContextValue {\n  const ctx = React.useContext(DropdownMenuContext);\n  if (!ctx) throw new Error(\"DropdownMenu parts must be used within <DropdownMenu>\");\n  return ctx;\n}\n\nexport interface DropdownMenuProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  children?: React.ReactNode;\n}\n\nexport function DropdownMenu({ open, defaultOpen = false, onOpenChange, children }: DropdownMenuProps) {\n  const [isOpen, setOpen] = useControllableState<boolean>({\n    ...(open !== undefined ? { value: open } : {}),\n    defaultValue: defaultOpen,\n    ...(onOpenChange ? { onChange: onOpenChange } : {}),\n  });\n  const anchorRef = React.useRef<HTMLElement | null>(null);\n  return (\n    <DropdownMenuContext.Provider value={{ open: isOpen, setOpen, anchorRef }}>\n      <div data-slot=\"dropdown-menu\">{children}</div>\n    </DropdownMenuContext.Provider>\n  );\n}\n\nexport function DropdownMenuPortal({ children }: { children?: React.ReactNode }) {\n  return <Portal>{children}</Portal>;\n}\n\nexport interface DropdownMenuTriggerProps extends React.ComponentProps<\"button\"> {\n  asChild?: boolean;\n}\n\nexport function DropdownMenuTrigger({ asChild = false, onClick, ...props }: DropdownMenuTriggerProps) {\n  const { open, setOpen, anchorRef } = useDropdownMenu();\n  const Comp = asChild ? Slot : \"button\";\n  return (\n    <Comp\n      data-slot=\"dropdown-menu-trigger\"\n      aria-haspopup=\"menu\"\n      aria-expanded={open}\n      data-state={open ? \"open\" : \"closed\"}\n      ref={anchorRef as React.Ref<HTMLButtonElement>}\n      onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        setOpen(!open);\n      }}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nexport interface DropdownMenuContentProps extends React.ComponentProps<\"div\"> {\n  sideOffset?: number;\n}\n\nexport function DropdownMenuContent({\n  className,\n  sideOffset = 4,\n  children,\n  ...props\n}: DropdownMenuContentProps) {\n  const { open, setOpen, anchorRef } = useDropdownMenu();\n  const { isPresent, ref: presRef } = usePresence(open);\n  const { floatingRef, style, side } = useFloating({\n    anchorRef,\n    open,\n    side: \"bottom\",\n    align: \"start\",\n    offset: sideOffset,\n  });\n  const dismissRef = useDismissableLayer({\n    enabled: open,\n    onDismiss: () => setOpen(false),\n    exclude: [anchorRef],\n  });\n  const contentRef = React.useRef<HTMLDivElement | null>(null);\n  // Roving focus across rendered menu items: ArrowUp/Down move the active item.\n  const items = () =>\n    Array.from(\n      contentRef.current?.querySelectorAll<HTMLElement>(\"[role^='menuitem']\") ?? [],\n    ).filter((el) => el.getAttribute(\"data-disabled\") === null);\n  const { activeIndex, onKeyDown: rovingKeyDown } = useRovingFocus({\n    count: 64,\n    orientation: \"vertical\",\n    loop: true,\n  });\n  React.useEffect(() => {\n    if (!open) return;\n    items()[activeIndex]?.focus();\n  }, [open, activeIndex]);\n  // Selecting an item closes the menu: items call this through context.\n  const close = React.useCallback(() => setOpen(false), [setOpen]);\n  if (!isPresent) return null;\n  return (\n    <Portal>\n      <DropdownMenuCloseContext.Provider value={close}>\n        <div\n          data-slot=\"dropdown-menu-content\"\n          data-state={open ? \"open\" : \"closed\"}\n          data-side={side}\n          role=\"menu\"\n          tabIndex={-1}\n          onKeyDown={(e) => {\n            rovingKeyDown(e);\n            if (e.key === \"Escape\") setOpen(false);\n          }}\n          ref={mergeRefs(floatingRef, dismissRef, presRef, contentRef)}\n          style={style}\n          className={cn(\n            DROPDOWN_MENU_CONTENT,\n            className,\n          )}\n          {...(props as Record<string, unknown>)}\n        >\n          {children}\n        </div>\n      </DropdownMenuCloseContext.Provider>\n    </Portal>\n  );\n}\n\nconst DropdownMenuCloseContext = React.createContext<() => void>(() => {});\n\nexport function DropdownMenuGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n  return <div data-slot=\"dropdown-menu-group\" role=\"group\" className={className} {...props} />;\n}\n\nexport interface DropdownMenuItemProps extends React.ComponentProps<\"div\"> {\n  inset?: boolean;\n  variant?: \"neutral\" | \"destructive\";\n  disabled?: boolean;\n}\n\nexport function DropdownMenuItem({\n  className,\n  inset,\n  variant = \"neutral\",\n  disabled,\n  onClick,\n  onKeyDown,\n  ...props\n}: DropdownMenuItemProps) {\n  const close = React.useContext(DropdownMenuCloseContext);\n  return (\n    <div\n      data-slot=\"dropdown-menu-item\"\n      data-inset={inset ? \"\" : undefined}\n      data-variant={variant}\n      data-disabled={disabled ? \"\" : undefined}\n      role=\"menuitem\"\n      tabIndex={disabled ? undefined : -1}\n      className={cn(\n        DROPDOWN_MENU_ITEM,\n        className,\n      )}\n      onClick={(e) => {\n        if (disabled) return;\n        onClick?.(e);\n        close();\n      }}\n      onKeyDown={(e) => {\n        onKeyDown?.(e);\n        if (e.key === \"Enter\" || e.key === \" \") {\n          e.preventDefault();\n          (e.currentTarget as HTMLElement).click();\n        }\n      }}\n      {...props}\n    />\n  );\n}\n\nexport interface DropdownMenuCheckboxItemProps extends React.ComponentProps<\"div\"> {\n  checked?: boolean;\n  disabled?: boolean;\n}\n\nexport function DropdownMenuCheckboxItem({\n  className,\n  children,\n  checked,\n  disabled,\n  onClick,\n  ...props\n}: DropdownMenuCheckboxItemProps) {\n  const close = React.useContext(DropdownMenuCloseContext);\n  return (\n    <div\n      data-slot=\"dropdown-menu-checkbox-item\"\n      role=\"menuitemcheckbox\"\n      aria-checked={checked}\n      data-state={checked ? \"checked\" : \"unchecked\"}\n      data-disabled={disabled ? \"\" : undefined}\n      tabIndex={disabled ? undefined : -1}\n      className={cn(\n        DROPDOWN_MENU_CHECK_ITEM,\n        className,\n      )}\n      onClick={(e) => {\n        if (disabled) return;\n        onClick?.(e);\n        close();\n      }}\n      {...props}\n    >\n      <span className={DROPDOWN_MENU_ITEM_INDICATOR}>\n        {checked ? (\n          <svg className=\"size-4\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n            <path d=\"M20 6 9 17l-5-5\" />\n          </svg>\n        ) : null}\n      </span>\n      {children}\n    </div>\n  );\n}\n\ninterface DropdownMenuRadioGroupContextValue {\n  value: string | undefined;\n  setValue: (next: string) => void;\n}\n\nconst DropdownMenuRadioGroupContext =\n  React.createContext<DropdownMenuRadioGroupContextValue | null>(null);\n\nexport interface DropdownMenuRadioGroupProps extends Omit<React.ComponentProps<\"div\">, \"onChange\"> {\n  value?: string;\n  onValueChange?: (value: string) => void;\n}\n\nexport function DropdownMenuRadioGroup({\n  className,\n  value,\n  onValueChange,\n  children,\n  ...props\n}: DropdownMenuRadioGroupProps) {\n  const ctx = React.useMemo<DropdownMenuRadioGroupContextValue>(\n    () => ({ value, setValue: (next) => onValueChange?.(next) }),\n    [value, onValueChange],\n  );\n  return (\n    <DropdownMenuRadioGroupContext.Provider value={ctx}>\n      <div data-slot=\"dropdown-menu-radio-group\" role=\"group\" className={className} {...props}>\n        {children}\n      </div>\n    </DropdownMenuRadioGroupContext.Provider>\n  );\n}\n\nexport interface DropdownMenuRadioItemProps extends React.ComponentProps<\"div\"> {\n  value: string;\n  disabled?: boolean;\n}\n\nexport function DropdownMenuRadioItem({\n  className,\n  children,\n  value,\n  disabled,\n  onClick,\n  ...props\n}: DropdownMenuRadioItemProps) {\n  const close = React.useContext(DropdownMenuCloseContext);\n  const group = React.useContext(DropdownMenuRadioGroupContext);\n  const checked = group?.value === value;\n  return (\n    <div\n      data-slot=\"dropdown-menu-radio-item\"\n      role=\"menuitemradio\"\n      aria-checked={checked}\n      data-state={checked ? \"checked\" : \"unchecked\"}\n      data-disabled={disabled ? \"\" : undefined}\n      tabIndex={disabled ? undefined : -1}\n      className={cn(\n        DROPDOWN_MENU_CHECK_ITEM,\n        className,\n      )}\n      onClick={(e) => {\n        if (disabled) return;\n        onClick?.(e);\n        group?.setValue(value);\n        close();\n      }}\n      {...props}\n    >\n      <span className={DROPDOWN_MENU_ITEM_INDICATOR}>\n        {checked ? (\n          <svg className=\"size-2 fill-current\" viewBox=\"0 0 24 24\" aria-hidden=\"true\">\n            <circle cx=\"12\" cy=\"12\" r=\"10\" />\n          </svg>\n        ) : null}\n      </span>\n      {children}\n    </div>\n  );\n}\n\nexport interface DropdownMenuLabelProps extends React.ComponentProps<\"div\"> {\n  inset?: boolean;\n}\n\nexport function DropdownMenuLabel({ className, inset, ...props }: DropdownMenuLabelProps) {\n  return (\n    <div\n      data-slot=\"dropdown-menu-label\"\n      data-inset={inset ? \"\" : undefined}\n      className={cn(DROPDOWN_MENU_LABEL, className)}\n      {...props}\n    />\n  );\n}\n\nexport function DropdownMenuSeparator({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"dropdown-menu-separator\"\n      role=\"separator\"\n      className={cn(DROPDOWN_MENU_SEPARATOR, className)}\n      {...props}\n    />\n  );\n}\n\nexport function DropdownMenuShortcut({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"dropdown-menu-shortcut\"\n      className={cn(DROPDOWN_MENU_SHORTCUT, className)}\n      {...props}\n    />\n  );\n}\n\n// Sub-menus render inline (nested) rather than in a separate floating layer: the\n// sub-content is revealed in place when its trigger toggles, simplifying the\n// nesting Radix portals each level. data-state still reflects open/closed.\ninterface DropdownMenuSubContextValue {\n  open: boolean;\n  setOpen: (next: boolean) => void;\n}\n\nconst DropdownMenuSubContext = React.createContext<DropdownMenuSubContextValue | null>(null);\n\nexport interface DropdownMenuSubProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  children?: React.ReactNode;\n}\n\nexport function DropdownMenuSub({ open, defaultOpen = false, onOpenChange, children }: DropdownMenuSubProps) {\n  const [isOpen, setOpen] = useControllableState<boolean>({\n    ...(open !== undefined ? { value: open } : {}),\n    defaultValue: defaultOpen,\n    ...(onOpenChange ? { onChange: onOpenChange } : {}),\n  });\n  return (\n    <DropdownMenuSubContext.Provider value={{ open: isOpen, setOpen }}>\n      <div data-slot=\"dropdown-menu-sub\">{children}</div>\n    </DropdownMenuSubContext.Provider>\n  );\n}\n\nexport interface DropdownMenuSubTriggerProps extends React.ComponentProps<\"div\"> {\n  inset?: boolean;\n}\n\nexport function DropdownMenuSubTrigger({ className, inset, children, onClick, ...props }: DropdownMenuSubTriggerProps) {\n  const ctx = React.useContext(DropdownMenuSubContext);\n  return (\n    <div\n      data-slot=\"dropdown-menu-sub-trigger\"\n      data-inset={inset ? \"\" : undefined}\n      data-state={ctx?.open ? \"open\" : \"closed\"}\n      role=\"menuitem\"\n      aria-haspopup=\"menu\"\n      aria-expanded={ctx?.open}\n      tabIndex={-1}\n      className={cn(\n        DROPDOWN_MENU_SUB_TRIGGER,\n        className,\n      )}\n      onClick={(e) => {\n        onClick?.(e);\n        ctx?.setOpen(!ctx.open);\n      }}\n      {...props}\n    >\n      {children}\n      <svg className=\"ml-auto size-4\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n        <path d=\"m9 18 6-6-6-6\" />\n      </svg>\n    </div>\n  );\n}\n\nexport function DropdownMenuSubContent({ className, children, ...props }: React.ComponentProps<\"div\">) {\n  const ctx = React.useContext(DropdownMenuSubContext);\n  if (!ctx?.open) return null;\n  return (\n    <div\n      data-slot=\"dropdown-menu-sub-content\"\n      data-state=\"open\"\n      role=\"menu\"\n      className={cn(\n        DROPDOWN_MENU_SUB_CONTENT,\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/empty.js

@@ -0,0 +1,91 @@
+import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../lib/cn.js";
+import {
+  EMPTY,
+  EMPTY_CONTENT,
+  EMPTY_DESCRIPTION,
+  EMPTY_HEADER,
+  EMPTY_MEDIA_BASE,
+  EMPTY_TITLE,
+  emptyMediaVariants
+} from "../generated/empty.js";
+function Empty({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "empty", className: cn(EMPTY, className), ...props });
+}
+function EmptyHeader({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "empty-header",
+      className: cn(EMPTY_HEADER, className),
+      ...props
+    }
+  );
+}
+function EmptyMedia({
+  className,
+  variant = "bare",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "empty-icon",
+      "data-variant": variant,
+      className: cn(EMPTY_MEDIA_BASE, emptyMediaVariants[variant], className),
+      ...props
+    }
+  );
+}
+function EmptyTitle({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "empty-title",
+      className: cn(EMPTY_TITLE, className),
+      ...props
+    }
+  );
+}
+function EmptyDescription({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "empty-description",
+      className: cn(EMPTY_DESCRIPTION, className),
+      ...props
+    }
+  );
+}
+function EmptyContent({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "empty-content",
+      className: cn(EMPTY_CONTENT, className),
+      ...props
+    }
+  );
+}
+export {
+  Empty,
+  EmptyContent,
+  EmptyDescription,
+  EmptyHeader,
+  EmptyMedia,
+  EmptyTitle
+};
+//# sourceMappingURL=empty.js.map

package/dist/components/empty.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/empty.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport {\n  EMPTY,\n  EMPTY_CONTENT,\n  EMPTY_DESCRIPTION,\n  EMPTY_HEADER,\n  EMPTY_MEDIA_BASE,\n  EMPTY_TITLE,\n  emptyMediaVariants,\n  type EmptyMediaVariant,\n} from \"../generated/empty\";\n\nexport type { EmptyMediaVariant };\n\nexport function Empty({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div data-slot=\"empty\" className={cn(EMPTY, className)} {...props} />\n  );\n}\n\nexport function EmptyHeader({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"empty-header\"\n      className={cn(EMPTY_HEADER, className)}\n      {...props}\n    />\n  );\n}\n\nexport interface EmptyMediaProps extends React.ComponentProps<\"div\"> {\n  variant?: EmptyMediaVariant;\n}\n\nexport function EmptyMedia({\n  className,\n  variant = \"bare\",\n  ...props\n}: EmptyMediaProps) {\n  return (\n    <div\n      data-slot=\"empty-icon\"\n      data-variant={variant}\n      className={cn(EMPTY_MEDIA_BASE, emptyMediaVariants[variant], className)}\n      {...props}\n    />\n  );\n}\n\nexport function EmptyTitle({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"empty-title\"\n      className={cn(EMPTY_TITLE, className)}\n      {...props}\n    />\n  );\n}\n\nexport function EmptyDescription({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"empty-description\"\n      className={cn(EMPTY_DESCRIPTION, className)}\n      {...props}\n    />\n  );\n}\n\nexport function EmptyContent({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"empty-content\"\n      className={cn(EMPTY_CONTENT, className)}\n      {...props}\n    />\n  );\n}\n"],"mappings":"AAiBI;AAjBJ,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAEK;AAIA,SAAS,MAAM,EAAE,WAAW,GAAG,MAAM,GAAgC;AAC1E,SACE,oBAAC,SAAI,aAAU,SAAQ,WAAW,GAAG,OAAO,SAAS,GAAI,GAAG,OAAO;AAEvE;AAEO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,cAAc,SAAS;AAAA,MACpC,GAAG;AAAA;AAAA,EACN;AAEJ;AAMO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,GAAoB;AAClB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,gBAAc;AAAA,MACd,WAAW,GAAG,kBAAkB,mBAAmB,OAAO,GAAG,SAAS;AAAA,MACrE,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,aAAa,SAAS;AAAA,MACnC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,mBAAmB,SAAS;AAAA,MACzC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,eAAe,SAAS;AAAA,MACrC,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}

package/dist/components/field-context.js

@@ -0,0 +1,30 @@
+"use client";
+import * as React from "react";
+const FieldControlContext = React.createContext(null);
+const DEV = typeof process !== "undefined" && process.env.NODE_ENV !== "production";
+function useFieldClaims() {
+  const claims = React.useRef(0);
+  return React.useCallback(() => {
+    claims.current += 1;
+    if (DEV && claims.current === 2) {
+      console.warn(
+        "@evinvest/uikit: two controls took the same <Field> id. A Field labels one control; give the others an `id` of their own."
+      );
+    }
+    return () => {
+      claims.current -= 1;
+    };
+  }, []);
+}
+function useFieldControlId(id) {
+  const field = React.useContext(FieldControlContext);
+  const fromField = id === void 0 ? field : null;
+  React.useEffect(() => fromField?.claim(), [fromField]);
+  return id ?? fromField?.id;
+}
+export {
+  FieldControlContext,
+  useFieldClaims,
+  useFieldControlId
+};
+//# sourceMappingURL=field-context.js.map

package/dist/components/field-context.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/field-context.ts"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\n\n/**\n * The id a `<Field>` hands to the one control it labels. `React.useId` is\n * derived from the position in the tree, so the server render and the hydrating\n * client agree on it — a module counter would not, and the label's `for` would\n * point at nothing after hydration.\n */\nexport interface FieldControl {\n  id: string;\n  /** Records a control taking the id; returns the release. */\n  claim: () => () => void;\n}\n\nexport const FieldControlContext = React.createContext<FieldControl | null>(null);\n\nconst DEV = typeof process !== \"undefined\" && process.env.NODE_ENV !== \"production\";\n\n/** The `claim` of a `Field`: warns in development when a second control takes the id. */\nexport function useFieldClaims(): () => () => void {\n  const claims = React.useRef(0);\n  return React.useCallback(() => {\n    claims.current += 1;\n    if (DEV && claims.current === 2) {\n      console.warn(\n        \"@evinvest/uikit: two controls took the same <Field> id. A Field labels one control; \" +\n          \"give the others an `id` of their own.\",\n      );\n    }\n    return () => {\n      claims.current -= 1;\n    };\n  }, []);\n}\n\n/** The caller's `id` when given, else the enclosing `<Field>`'s, else none. */\nexport function useFieldControlId(id: string | undefined): string | undefined {\n  const field = React.useContext(FieldControlContext);\n  const fromField = id === undefined ? field : null;\n  React.useEffect(() => fromField?.claim(), [fromField]);\n  return id ?? fromField?.id;\n}\n"],"mappings":";AAEA,YAAY,WAAW;AAchB,MAAM,sBAAsB,MAAM,cAAmC,IAAI;AAEhF,MAAM,MAAM,OAAO,YAAY,eAAe,QAAQ,IAAI,aAAa;AAGhE,SAAS,iBAAmC;AACjD,QAAM,SAAS,MAAM,OAAO,CAAC;AAC7B,SAAO,MAAM,YAAY,MAAM;AAC7B,WAAO,WAAW;AAClB,QAAI,OAAO,OAAO,YAAY,GAAG;AAC/B,cAAQ;AAAA,QACN;AAAA,MAEF;AAAA,IACF;AACA,WAAO,MAAM;AACX,aAAO,WAAW;AAAA,IACpB;AAAA,EACF,GAAG,CAAC,CAAC;AACP;AAGO,SAAS,kBAAkB,IAA4C;AAC5E,QAAM,QAAQ,MAAM,WAAW,mBAAmB;AAClD,QAAM,YAAY,OAAO,SAAY,QAAQ;AAC7C,QAAM,UAAU,MAAM,WAAW,MAAM,GAAG,CAAC,SAAS,CAAC;AACrD,SAAO,MAAM,WAAW;AAC1B;","names":[]}