@epilot/spark-ui 1.0.0-alpha.2 → 1.0.0-alpha.4

package/dist/components/dropdown-menu.cjs

@@ -0,0 +1,165 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_chunk = require("../chunk-aJGBMT86.cjs");
+const require_icons_material_symbol = require("../icons/material-symbol.cjs");
+let react = require("react");
+react = require_chunk.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let _base_ui_react_menu = require("@base-ui/react/menu");
+let cnfast = require("cnfast");
+//#region src/components/dropdown-menu.tsx
+function DropdownMenu({ ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.Root, { ...props });
+}
+function DropdownMenuPortal({ ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.Portal, {
+		"data-slot": "dropdown-menu-portal",
+		...props
+	});
+}
+function DropdownMenuTrigger({ ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.Trigger, {
+		"data-slot": "dropdown-menu-trigger",
+		...props
+	});
+}
+function DropdownMenuContent({ className, align = "start", alignOffset, side, sideOffset = 4, container, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.Portal, {
+		container,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.Positioner, {
+			align,
+			alignOffset,
+			className: "isolate z-50 outline-none",
+			side,
+			sideOffset,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.Popup, {
+				"data-slot": "dropdown-menu-content",
+				className: (0, cnfast.cn)("z-50 max-h-(--available-height) min-w-40 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border border-gray-a1 bg-gray-1 p-1 text-gray-a12 shadow-lg outline-none", "transition-[opacity,scale,translate] duration-100 data-ending-style:scale-95 data-ending-style:opacity-0 data-starting-style:scale-95 data-starting-style:opacity-0", "data-[side=bottom]:data-starting-style:-translate-y-2 data-[side=left]:data-starting-style:translate-x-2 data-[side=right]:data-starting-style:-translate-x-2 data-[side=top]:data-starting-style:translate-y-2", className),
+				...props
+			})
+		})
+	});
+}
+function DropdownMenuGroup({ ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.Group, {
+		"data-slot": "dropdown-menu-group",
+		...props
+	});
+}
+function DropdownMenuItem({ className, inset, variant = "default", ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.Item, {
+		"data-slot": "dropdown-menu-item",
+		"data-inset": inset,
+		"data-variant": variant,
+		className: (0, cnfast.cn)("group/dropdown-menu-item relative flex min-h-7 cursor-pointer items-center gap-2 rounded-md px-2 py-1.5 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 data-[variant=destructive]:text-error data-[variant=destructive]:data-highlighted:bg-base-error-soft [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
+		...props
+	});
+}
+function DropdownMenuCheckboxItem({ className, children, checked, inset, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react_menu.Menu.CheckboxItem, {
+		"data-slot": "dropdown-menu-checkbox-item",
+		"data-inset": inset,
+		className: (0, cnfast.cn)("relative flex min-h-7 cursor-pointer items-center gap-2 rounded-md py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
+		checked,
+		...props,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center",
+			"data-slot": "dropdown-menu-checkbox-item-indicator",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.CheckboxItemIndicator, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons_material_symbol.MaterialSymbol, {
+				className: "text-sm",
+				name: "check"
+			}) })
+		}), children]
+	});
+}
+function DropdownMenuRadioGroup({ ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.RadioGroup, {
+		"data-slot": "dropdown-menu-radio-group",
+		...props
+	});
+}
+function DropdownMenuRadioItem({ className, children, inset, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react_menu.Menu.RadioItem, {
+		"data-slot": "dropdown-menu-radio-item",
+		"data-inset": inset,
+		className: (0, cnfast.cn)("relative flex min-h-7 cursor-pointer items-center gap-2 rounded-md py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
+		...props,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center",
+			"data-slot": "dropdown-menu-radio-item-indicator",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.RadioItemIndicator, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons_material_symbol.MaterialSymbol, {
+				className: "text-sm",
+				name: "check"
+			}) })
+		}), children]
+	});
+}
+function DropdownMenuLabel({ className, inset, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "dropdown-menu-label",
+		"data-inset": inset,
+		className: (0, cnfast.cn)("px-2 py-1 text-xs text-gray-light data-[inset=true]:pl-7", className),
+		...props
+	});
+}
+function DropdownMenuSeparator({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.Separator, {
+		"data-slot": "dropdown-menu-separator",
+		className: (0, cnfast.cn)("-mx-1 my-1 h-px bg-gray-a3", className),
+		...props
+	});
+}
+function DropdownMenuShortcut({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		"data-slot": "dropdown-menu-shortcut",
+		className: (0, cnfast.cn)("ml-auto text-xs tracking-widest text-gray-light", className),
+		...props
+	});
+}
+function DropdownMenuSub({ ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.SubmenuRoot, {
+		"data-slot": "dropdown-menu-sub",
+		...props
+	});
+}
+function DropdownMenuSubTrigger({ className, inset, children, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react_menu.Menu.SubmenuTrigger, {
+		"data-slot": "dropdown-menu-sub-trigger",
+		"data-inset": inset,
+		className: (0, cnfast.cn)("flex min-h-7 cursor-pointer items-center gap-2 rounded-md px-2 py-1.5 text-sm outline-hidden transition-colors select-none data-highlighted:bg-gray-a3 data-popup-open:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
+		...props,
+		children: [children, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons_material_symbol.MaterialSymbol, {
+			className: "ml-auto text-sm text-gray-light",
+			name: "chevron_right"
+		})]
+	});
+}
+function DropdownMenuSubContent({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DropdownMenuContent, {
+		"data-slot": "dropdown-menu-sub-content",
+		align: "start",
+		alignOffset: -3,
+		side: "right",
+		sideOffset: 0,
+		className: (0, cnfast.cn)("w-auto min-w-32", className),
+		...props
+	});
+}
+//#endregion
+exports.DropdownMenu = DropdownMenu;
+exports.DropdownMenuCheckboxItem = DropdownMenuCheckboxItem;
+exports.DropdownMenuContent = DropdownMenuContent;
+exports.DropdownMenuGroup = DropdownMenuGroup;
+exports.DropdownMenuItem = DropdownMenuItem;
+exports.DropdownMenuLabel = DropdownMenuLabel;
+exports.DropdownMenuPortal = DropdownMenuPortal;
+exports.DropdownMenuRadioGroup = DropdownMenuRadioGroup;
+exports.DropdownMenuRadioItem = DropdownMenuRadioItem;
+exports.DropdownMenuSeparator = DropdownMenuSeparator;
+exports.DropdownMenuShortcut = DropdownMenuShortcut;
+exports.DropdownMenuSub = DropdownMenuSub;
+exports.DropdownMenuSubContent = DropdownMenuSubContent;
+exports.DropdownMenuSubTrigger = DropdownMenuSubTrigger;
+exports.DropdownMenuTrigger = DropdownMenuTrigger;
+
+//# sourceMappingURL=dropdown-menu.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown-menu.cjs","names":["MenuPrimitive","MaterialSymbol"],"sources":["../../src/components/dropdown-menu.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu'\nimport * as React from 'react'\nimport { MaterialSymbol } from '../icons/material-symbol'\nimport { cn } from '../utils/cn'\n\nfunction DropdownMenu({\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.Root>) {\n  return <MenuPrimitive.Root {...props} />\n}\n\nfunction DropdownMenuPortal({\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.Portal>) {\n  return <MenuPrimitive.Portal data-slot=\"dropdown-menu-portal\" {...props} />\n}\n\nfunction DropdownMenuTrigger({\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.Trigger>) {\n  return <MenuPrimitive.Trigger data-slot=\"dropdown-menu-trigger\" {...props} />\n}\n\ntype DropdownMenuContentProps = React.ComponentProps<\n  typeof MenuPrimitive.Popup\n> &\n  Pick<\n    MenuPrimitive.Positioner.Props,\n    'align' | 'alignOffset' | 'side' | 'sideOffset'\n  > & {\n    container?: React.ComponentProps<typeof MenuPrimitive.Portal>['container']\n  }\n\nfunction DropdownMenuContent({\n  className,\n  align = 'start',\n  alignOffset,\n  side,\n  sideOffset = 4,\n  container,\n  ...props\n}: DropdownMenuContentProps) {\n  return (\n    <MenuPrimitive.Portal container={container}>\n      <MenuPrimitive.Positioner\n        align={align}\n        alignOffset={alignOffset}\n        className=\"isolate z-50 outline-none\"\n        side={side}\n        sideOffset={sideOffset}\n      >\n        <MenuPrimitive.Popup\n          data-slot=\"dropdown-menu-content\"\n          className={cn(\n            'z-50 max-h-(--available-height) min-w-40 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border border-gray-a1 bg-gray-1 p-1 text-gray-a12 shadow-lg outline-none',\n            'transition-[opacity,scale,translate] duration-100 data-ending-style:scale-95 data-ending-style:opacity-0 data-starting-style:scale-95 data-starting-style:opacity-0',\n            'data-[side=bottom]:data-starting-style:-translate-y-2 data-[side=left]:data-starting-style:translate-x-2 data-[side=right]:data-starting-style:-translate-x-2 data-[side=top]:data-starting-style:translate-y-2',\n            className,\n          )}\n          {...props}\n        />\n      </MenuPrimitive.Positioner>\n    </MenuPrimitive.Portal>\n  )\n}\n\nfunction DropdownMenuGroup({\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.Group>) {\n  return <MenuPrimitive.Group data-slot=\"dropdown-menu-group\" {...props} />\n}\n\nfunction DropdownMenuItem({\n  className,\n  inset,\n  variant = 'default',\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.Item> & {\n  inset?: boolean\n  variant?: 'default' | 'destructive'\n}) {\n  return (\n    <MenuPrimitive.Item\n      data-slot=\"dropdown-menu-item\"\n      data-inset={inset}\n      data-variant={variant}\n      className={cn(\n        'group/dropdown-menu-item relative flex min-h-7 cursor-pointer items-center gap-2 rounded-md px-2 py-1.5 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 data-[variant=destructive]:text-error data-[variant=destructive]:data-highlighted:bg-base-error-soft [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction DropdownMenuCheckboxItem({\n  className,\n  children,\n  checked,\n  inset,\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.CheckboxItem> & {\n  inset?: boolean\n}) {\n  return (\n    <MenuPrimitive.CheckboxItem\n      data-slot=\"dropdown-menu-checkbox-item\"\n      data-inset={inset}\n      className={cn(\n        'relative flex min-h-7 cursor-pointer items-center gap-2 rounded-md py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n        className,\n      )}\n      checked={checked}\n      {...props}\n    >\n      <span\n        className=\"pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center\"\n        data-slot=\"dropdown-menu-checkbox-item-indicator\"\n      >\n        <MenuPrimitive.CheckboxItemIndicator>\n          <MaterialSymbol className=\"text-sm\" name=\"check\" />\n        </MenuPrimitive.CheckboxItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.CheckboxItem>\n  )\n}\n\nfunction DropdownMenuRadioGroup({\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.RadioGroup>) {\n  return (\n    <MenuPrimitive.RadioGroup\n      data-slot=\"dropdown-menu-radio-group\"\n      {...props}\n    />\n  )\n}\n\nfunction DropdownMenuRadioItem({\n  className,\n  children,\n  inset,\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.RadioItem> & {\n  inset?: boolean\n}) {\n  return (\n    <MenuPrimitive.RadioItem\n      data-slot=\"dropdown-menu-radio-item\"\n      data-inset={inset}\n      className={cn(\n        'relative flex min-h-7 cursor-pointer items-center gap-2 rounded-md py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n        className,\n      )}\n      {...props}\n    >\n      <span\n        className=\"pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center\"\n        data-slot=\"dropdown-menu-radio-item-indicator\"\n      >\n        <MenuPrimitive.RadioItemIndicator>\n          <MaterialSymbol className=\"text-sm\" name=\"check\" />\n        </MenuPrimitive.RadioItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.RadioItem>\n  )\n}\n\n// plain div, not Menu.GroupLabel: Base UI's GroupLabel throws outside a\n// Group, while our labels float freely (radix Label was an unwired div too)\nfunction DropdownMenuLabel({\n  className,\n  inset,\n  ...props\n}: React.ComponentProps<'div'> & {\n  inset?: boolean\n}) {\n  return (\n    <div\n      data-slot=\"dropdown-menu-label\"\n      data-inset={inset}\n      className={cn(\n        'px-2 py-1 text-xs text-gray-light data-[inset=true]:pl-7',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction DropdownMenuSeparator({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.Separator>) {\n  return (\n    <MenuPrimitive.Separator\n      data-slot=\"dropdown-menu-separator\"\n      className={cn('-mx-1 my-1 h-px bg-gray-a3', className)}\n      {...props}\n    />\n  )\n}\n\nfunction DropdownMenuShortcut({\n  className,\n  ...props\n}: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"dropdown-menu-shortcut\"\n      className={cn(\n        'ml-auto text-xs tracking-widest text-gray-light',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction DropdownMenuSub({\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.SubmenuRoot>) {\n  return <MenuPrimitive.SubmenuRoot data-slot=\"dropdown-menu-sub\" {...props} />\n}\n\nfunction DropdownMenuSubTrigger({\n  className,\n  inset,\n  children,\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.SubmenuTrigger> & {\n  inset?: boolean\n}) {\n  return (\n    <MenuPrimitive.SubmenuTrigger\n      data-slot=\"dropdown-menu-sub-trigger\"\n      data-inset={inset}\n      className={cn(\n        'flex min-h-7 cursor-pointer items-center gap-2 rounded-md px-2 py-1.5 text-sm outline-hidden transition-colors select-none data-highlighted:bg-gray-a3 data-popup-open:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      <MaterialSymbol\n        className=\"ml-auto text-sm text-gray-light\"\n        name=\"chevron_right\"\n      />\n    </MenuPrimitive.SubmenuTrigger>\n  )\n}\n\n// composes the public Content; the align/offset defaults visually align the\n// submenu with its parent menu\nfunction DropdownMenuSubContent({\n  className,\n  ...props\n}: DropdownMenuContentProps) {\n  return (\n    <DropdownMenuContent\n      data-slot=\"dropdown-menu-sub-content\"\n      align=\"start\"\n      alignOffset={-3}\n      side=\"right\"\n      sideOffset={0}\n      className={cn('w-auto min-w-32', className)}\n      {...props}\n    />\n  )\n}\n\nexport {\n  DropdownMenu,\n  DropdownMenuCheckboxItem,\n  DropdownMenuContent,\n  DropdownMenuGroup,\n  DropdownMenuItem,\n  DropdownMenuLabel,\n  DropdownMenuPortal,\n  DropdownMenuRadioGroup,\n  DropdownMenuRadioItem,\n  DropdownMenuSeparator,\n  DropdownMenuShortcut,\n  DropdownMenuSub,\n  DropdownMenuSubContent,\n  DropdownMenuSubTrigger,\n  DropdownMenuTrigger,\n}\n"],"mappings":"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"}

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

@@ -0,0 +1,93 @@
+"use client";
+
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import * as React$1 from "react";
+import { Menu } from "@base-ui/react/menu";
+
+//#region src/components/dropdown-menu.d.ts
+declare function DropdownMenu({
+  ...props
+}: React$1.ComponentProps<typeof Menu.Root>): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuPortal({
+  ...props
+}: React$1.ComponentProps<typeof Menu.Portal>): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuTrigger({
+  ...props
+}: React$1.ComponentProps<typeof Menu.Trigger>): _$react_jsx_runtime0.JSX.Element;
+type DropdownMenuContentProps = React$1.ComponentProps<typeof Menu.Popup> & Pick<Menu.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset'> & {
+  container?: React$1.ComponentProps<typeof Menu.Portal>['container'];
+};
+declare function DropdownMenuContent({
+  className,
+  align,
+  alignOffset,
+  side,
+  sideOffset,
+  container,
+  ...props
+}: DropdownMenuContentProps): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuGroup({
+  ...props
+}: React$1.ComponentProps<typeof Menu.Group>): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuItem({
+  className,
+  inset,
+  variant,
+  ...props
+}: React$1.ComponentProps<typeof Menu.Item> & {
+  inset?: boolean;
+  variant?: 'default' | 'destructive';
+}): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuCheckboxItem({
+  className,
+  children,
+  checked,
+  inset,
+  ...props
+}: React$1.ComponentProps<typeof Menu.CheckboxItem> & {
+  inset?: boolean;
+}): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuRadioGroup({
+  ...props
+}: React$1.ComponentProps<typeof Menu.RadioGroup>): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuRadioItem({
+  className,
+  children,
+  inset,
+  ...props
+}: React$1.ComponentProps<typeof Menu.RadioItem> & {
+  inset?: boolean;
+}): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuLabel({
+  className,
+  inset,
+  ...props
+}: React$1.ComponentProps<'div'> & {
+  inset?: boolean;
+}): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuSeparator({
+  className,
+  ...props
+}: React$1.ComponentProps<typeof Menu.Separator>): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuShortcut({
+  className,
+  ...props
+}: React$1.ComponentProps<'span'>): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuSub({
+  ...props
+}: React$1.ComponentProps<typeof Menu.SubmenuRoot>): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuSubTrigger({
+  className,
+  inset,
+  children,
+  ...props
+}: React$1.ComponentProps<typeof Menu.SubmenuTrigger> & {
+  inset?: boolean;
+}): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuSubContent({
+  className,
+  ...props
+}: DropdownMenuContentProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger };
+//# sourceMappingURL=dropdown-menu.d.cts.map

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

@@ -0,0 +1,93 @@
+"use client";
+
+import * as React$1 from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { Menu } from "@base-ui/react/menu";
+
+//#region src/components/dropdown-menu.d.ts
+declare function DropdownMenu({
+  ...props
+}: React$1.ComponentProps<typeof Menu.Root>): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuPortal({
+  ...props
+}: React$1.ComponentProps<typeof Menu.Portal>): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuTrigger({
+  ...props
+}: React$1.ComponentProps<typeof Menu.Trigger>): _$react_jsx_runtime0.JSX.Element;
+type DropdownMenuContentProps = React$1.ComponentProps<typeof Menu.Popup> & Pick<Menu.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset'> & {
+  container?: React$1.ComponentProps<typeof Menu.Portal>['container'];
+};
+declare function DropdownMenuContent({
+  className,
+  align,
+  alignOffset,
+  side,
+  sideOffset,
+  container,
+  ...props
+}: DropdownMenuContentProps): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuGroup({
+  ...props
+}: React$1.ComponentProps<typeof Menu.Group>): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuItem({
+  className,
+  inset,
+  variant,
+  ...props
+}: React$1.ComponentProps<typeof Menu.Item> & {
+  inset?: boolean;
+  variant?: 'default' | 'destructive';
+}): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuCheckboxItem({
+  className,
+  children,
+  checked,
+  inset,
+  ...props
+}: React$1.ComponentProps<typeof Menu.CheckboxItem> & {
+  inset?: boolean;
+}): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuRadioGroup({
+  ...props
+}: React$1.ComponentProps<typeof Menu.RadioGroup>): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuRadioItem({
+  className,
+  children,
+  inset,
+  ...props
+}: React$1.ComponentProps<typeof Menu.RadioItem> & {
+  inset?: boolean;
+}): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuLabel({
+  className,
+  inset,
+  ...props
+}: React$1.ComponentProps<'div'> & {
+  inset?: boolean;
+}): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuSeparator({
+  className,
+  ...props
+}: React$1.ComponentProps<typeof Menu.Separator>): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuShortcut({
+  className,
+  ...props
+}: React$1.ComponentProps<'span'>): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuSub({
+  ...props
+}: React$1.ComponentProps<typeof Menu.SubmenuRoot>): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuSubTrigger({
+  className,
+  inset,
+  children,
+  ...props
+}: React$1.ComponentProps<typeof Menu.SubmenuTrigger> & {
+  inset?: boolean;
+}): _$react_jsx_runtime0.JSX.Element;
+declare function DropdownMenuSubContent({
+  className,
+  ...props
+}: DropdownMenuContentProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger };
+//# sourceMappingURL=dropdown-menu.d.ts.map

package/dist/components/dropdown-menu.js

@@ -0,0 +1,148 @@
+"use client";
+import { cn } from "../utils/cn.js";
+import { MaterialSymbol } from "../icons/material-symbol.js";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Menu } from "@base-ui/react/menu";
+//#region src/components/dropdown-menu.tsx
+function DropdownMenu({ ...props }) {
+	return /* @__PURE__ */ jsx(Menu.Root, { ...props });
+}
+function DropdownMenuPortal({ ...props }) {
+	return /* @__PURE__ */ jsx(Menu.Portal, {
+		"data-slot": "dropdown-menu-portal",
+		...props
+	});
+}
+function DropdownMenuTrigger({ ...props }) {
+	return /* @__PURE__ */ jsx(Menu.Trigger, {
+		"data-slot": "dropdown-menu-trigger",
+		...props
+	});
+}
+function DropdownMenuContent({ className, align = "start", alignOffset, side, sideOffset = 4, container, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.Portal, {
+		container,
+		children: /* @__PURE__ */ jsx(Menu.Positioner, {
+			align,
+			alignOffset,
+			className: "isolate z-50 outline-none",
+			side,
+			sideOffset,
+			children: /* @__PURE__ */ jsx(Menu.Popup, {
+				"data-slot": "dropdown-menu-content",
+				className: cn("z-50 max-h-(--available-height) min-w-40 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border border-gray-a1 bg-gray-1 p-1 text-gray-a12 shadow-lg outline-none", "transition-[opacity,scale,translate] duration-100 data-ending-style:scale-95 data-ending-style:opacity-0 data-starting-style:scale-95 data-starting-style:opacity-0", "data-[side=bottom]:data-starting-style:-translate-y-2 data-[side=left]:data-starting-style:translate-x-2 data-[side=right]:data-starting-style:-translate-x-2 data-[side=top]:data-starting-style:translate-y-2", className),
+				...props
+			})
+		})
+	});
+}
+function DropdownMenuGroup({ ...props }) {
+	return /* @__PURE__ */ jsx(Menu.Group, {
+		"data-slot": "dropdown-menu-group",
+		...props
+	});
+}
+function DropdownMenuItem({ className, inset, variant = "default", ...props }) {
+	return /* @__PURE__ */ jsx(Menu.Item, {
+		"data-slot": "dropdown-menu-item",
+		"data-inset": inset,
+		"data-variant": variant,
+		className: cn("group/dropdown-menu-item relative flex min-h-7 cursor-pointer items-center gap-2 rounded-md px-2 py-1.5 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 data-[variant=destructive]:text-error data-[variant=destructive]:data-highlighted:bg-base-error-soft [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
+		...props
+	});
+}
+function DropdownMenuCheckboxItem({ className, children, checked, inset, ...props }) {
+	return /* @__PURE__ */ jsxs(Menu.CheckboxItem, {
+		"data-slot": "dropdown-menu-checkbox-item",
+		"data-inset": inset,
+		className: cn("relative flex min-h-7 cursor-pointer items-center gap-2 rounded-md py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
+		checked,
+		...props,
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center",
+			"data-slot": "dropdown-menu-checkbox-item-indicator",
+			children: /* @__PURE__ */ jsx(Menu.CheckboxItemIndicator, { children: /* @__PURE__ */ jsx(MaterialSymbol, {
+				className: "text-sm",
+				name: "check"
+			}) })
+		}), children]
+	});
+}
+function DropdownMenuRadioGroup({ ...props }) {
+	return /* @__PURE__ */ jsx(Menu.RadioGroup, {
+		"data-slot": "dropdown-menu-radio-group",
+		...props
+	});
+}
+function DropdownMenuRadioItem({ className, children, inset, ...props }) {
+	return /* @__PURE__ */ jsxs(Menu.RadioItem, {
+		"data-slot": "dropdown-menu-radio-item",
+		"data-inset": inset,
+		className: cn("relative flex min-h-7 cursor-pointer items-center gap-2 rounded-md py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
+		...props,
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center",
+			"data-slot": "dropdown-menu-radio-item-indicator",
+			children: /* @__PURE__ */ jsx(Menu.RadioItemIndicator, { children: /* @__PURE__ */ jsx(MaterialSymbol, {
+				className: "text-sm",
+				name: "check"
+			}) })
+		}), children]
+	});
+}
+function DropdownMenuLabel({ className, inset, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "dropdown-menu-label",
+		"data-inset": inset,
+		className: cn("px-2 py-1 text-xs text-gray-light data-[inset=true]:pl-7", className),
+		...props
+	});
+}
+function DropdownMenuSeparator({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.Separator, {
+		"data-slot": "dropdown-menu-separator",
+		className: cn("-mx-1 my-1 h-px bg-gray-a3", className),
+		...props
+	});
+}
+function DropdownMenuShortcut({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "dropdown-menu-shortcut",
+		className: cn("ml-auto text-xs tracking-widest text-gray-light", className),
+		...props
+	});
+}
+function DropdownMenuSub({ ...props }) {
+	return /* @__PURE__ */ jsx(Menu.SubmenuRoot, {
+		"data-slot": "dropdown-menu-sub",
+		...props
+	});
+}
+function DropdownMenuSubTrigger({ className, inset, children, ...props }) {
+	return /* @__PURE__ */ jsxs(Menu.SubmenuTrigger, {
+		"data-slot": "dropdown-menu-sub-trigger",
+		"data-inset": inset,
+		className: cn("flex min-h-7 cursor-pointer items-center gap-2 rounded-md px-2 py-1.5 text-sm outline-hidden transition-colors select-none data-highlighted:bg-gray-a3 data-popup-open:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
+		...props,
+		children: [children, /* @__PURE__ */ jsx(MaterialSymbol, {
+			className: "ml-auto text-sm text-gray-light",
+			name: "chevron_right"
+		})]
+	});
+}
+function DropdownMenuSubContent({ className, ...props }) {
+	return /* @__PURE__ */ jsx(DropdownMenuContent, {
+		"data-slot": "dropdown-menu-sub-content",
+		align: "start",
+		alignOffset: -3,
+		side: "right",
+		sideOffset: 0,
+		className: cn("w-auto min-w-32", className),
+		...props
+	});
+}
+//#endregion
+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,"file":"dropdown-menu.js","names":["MenuPrimitive"],"sources":["../../src/components/dropdown-menu.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu'\nimport * as React from 'react'\nimport { MaterialSymbol } from '../icons/material-symbol'\nimport { cn } from '../utils/cn'\n\nfunction DropdownMenu({\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.Root>) {\n  return <MenuPrimitive.Root {...props} />\n}\n\nfunction DropdownMenuPortal({\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.Portal>) {\n  return <MenuPrimitive.Portal data-slot=\"dropdown-menu-portal\" {...props} />\n}\n\nfunction DropdownMenuTrigger({\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.Trigger>) {\n  return <MenuPrimitive.Trigger data-slot=\"dropdown-menu-trigger\" {...props} />\n}\n\ntype DropdownMenuContentProps = React.ComponentProps<\n  typeof MenuPrimitive.Popup\n> &\n  Pick<\n    MenuPrimitive.Positioner.Props,\n    'align' | 'alignOffset' | 'side' | 'sideOffset'\n  > & {\n    container?: React.ComponentProps<typeof MenuPrimitive.Portal>['container']\n  }\n\nfunction DropdownMenuContent({\n  className,\n  align = 'start',\n  alignOffset,\n  side,\n  sideOffset = 4,\n  container,\n  ...props\n}: DropdownMenuContentProps) {\n  return (\n    <MenuPrimitive.Portal container={container}>\n      <MenuPrimitive.Positioner\n        align={align}\n        alignOffset={alignOffset}\n        className=\"isolate z-50 outline-none\"\n        side={side}\n        sideOffset={sideOffset}\n      >\n        <MenuPrimitive.Popup\n          data-slot=\"dropdown-menu-content\"\n          className={cn(\n            'z-50 max-h-(--available-height) min-w-40 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border border-gray-a1 bg-gray-1 p-1 text-gray-a12 shadow-lg outline-none',\n            'transition-[opacity,scale,translate] duration-100 data-ending-style:scale-95 data-ending-style:opacity-0 data-starting-style:scale-95 data-starting-style:opacity-0',\n            'data-[side=bottom]:data-starting-style:-translate-y-2 data-[side=left]:data-starting-style:translate-x-2 data-[side=right]:data-starting-style:-translate-x-2 data-[side=top]:data-starting-style:translate-y-2',\n            className,\n          )}\n          {...props}\n        />\n      </MenuPrimitive.Positioner>\n    </MenuPrimitive.Portal>\n  )\n}\n\nfunction DropdownMenuGroup({\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.Group>) {\n  return <MenuPrimitive.Group data-slot=\"dropdown-menu-group\" {...props} />\n}\n\nfunction DropdownMenuItem({\n  className,\n  inset,\n  variant = 'default',\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.Item> & {\n  inset?: boolean\n  variant?: 'default' | 'destructive'\n}) {\n  return (\n    <MenuPrimitive.Item\n      data-slot=\"dropdown-menu-item\"\n      data-inset={inset}\n      data-variant={variant}\n      className={cn(\n        'group/dropdown-menu-item relative flex min-h-7 cursor-pointer items-center gap-2 rounded-md px-2 py-1.5 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 data-[variant=destructive]:text-error data-[variant=destructive]:data-highlighted:bg-base-error-soft [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction DropdownMenuCheckboxItem({\n  className,\n  children,\n  checked,\n  inset,\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.CheckboxItem> & {\n  inset?: boolean\n}) {\n  return (\n    <MenuPrimitive.CheckboxItem\n      data-slot=\"dropdown-menu-checkbox-item\"\n      data-inset={inset}\n      className={cn(\n        'relative flex min-h-7 cursor-pointer items-center gap-2 rounded-md py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n        className,\n      )}\n      checked={checked}\n      {...props}\n    >\n      <span\n        className=\"pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center\"\n        data-slot=\"dropdown-menu-checkbox-item-indicator\"\n      >\n        <MenuPrimitive.CheckboxItemIndicator>\n          <MaterialSymbol className=\"text-sm\" name=\"check\" />\n        </MenuPrimitive.CheckboxItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.CheckboxItem>\n  )\n}\n\nfunction DropdownMenuRadioGroup({\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.RadioGroup>) {\n  return (\n    <MenuPrimitive.RadioGroup\n      data-slot=\"dropdown-menu-radio-group\"\n      {...props}\n    />\n  )\n}\n\nfunction DropdownMenuRadioItem({\n  className,\n  children,\n  inset,\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.RadioItem> & {\n  inset?: boolean\n}) {\n  return (\n    <MenuPrimitive.RadioItem\n      data-slot=\"dropdown-menu-radio-item\"\n      data-inset={inset}\n      className={cn(\n        'relative flex min-h-7 cursor-pointer items-center gap-2 rounded-md py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n        className,\n      )}\n      {...props}\n    >\n      <span\n        className=\"pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center\"\n        data-slot=\"dropdown-menu-radio-item-indicator\"\n      >\n        <MenuPrimitive.RadioItemIndicator>\n          <MaterialSymbol className=\"text-sm\" name=\"check\" />\n        </MenuPrimitive.RadioItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.RadioItem>\n  )\n}\n\n// plain div, not Menu.GroupLabel: Base UI's GroupLabel throws outside a\n// Group, while our labels float freely (radix Label was an unwired div too)\nfunction DropdownMenuLabel({\n  className,\n  inset,\n  ...props\n}: React.ComponentProps<'div'> & {\n  inset?: boolean\n}) {\n  return (\n    <div\n      data-slot=\"dropdown-menu-label\"\n      data-inset={inset}\n      className={cn(\n        'px-2 py-1 text-xs text-gray-light data-[inset=true]:pl-7',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction DropdownMenuSeparator({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.Separator>) {\n  return (\n    <MenuPrimitive.Separator\n      data-slot=\"dropdown-menu-separator\"\n      className={cn('-mx-1 my-1 h-px bg-gray-a3', className)}\n      {...props}\n    />\n  )\n}\n\nfunction DropdownMenuShortcut({\n  className,\n  ...props\n}: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"dropdown-menu-shortcut\"\n      className={cn(\n        'ml-auto text-xs tracking-widest text-gray-light',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction DropdownMenuSub({\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.SubmenuRoot>) {\n  return <MenuPrimitive.SubmenuRoot data-slot=\"dropdown-menu-sub\" {...props} />\n}\n\nfunction DropdownMenuSubTrigger({\n  className,\n  inset,\n  children,\n  ...props\n}: React.ComponentProps<typeof MenuPrimitive.SubmenuTrigger> & {\n  inset?: boolean\n}) {\n  return (\n    <MenuPrimitive.SubmenuTrigger\n      data-slot=\"dropdown-menu-sub-trigger\"\n      data-inset={inset}\n      className={cn(\n        'flex min-h-7 cursor-pointer items-center gap-2 rounded-md px-2 py-1.5 text-sm outline-hidden transition-colors select-none data-highlighted:bg-gray-a3 data-popup-open:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      <MaterialSymbol\n        className=\"ml-auto text-sm text-gray-light\"\n        name=\"chevron_right\"\n      />\n    </MenuPrimitive.SubmenuTrigger>\n  )\n}\n\n// composes the public Content; the align/offset defaults visually align the\n// submenu with its parent menu\nfunction DropdownMenuSubContent({\n  className,\n  ...props\n}: DropdownMenuContentProps) {\n  return (\n    <DropdownMenuContent\n      data-slot=\"dropdown-menu-sub-content\"\n      align=\"start\"\n      alignOffset={-3}\n      side=\"right\"\n      sideOffset={0}\n      className={cn('w-auto min-w-32', className)}\n      {...props}\n    />\n  )\n}\n\nexport {\n  DropdownMenu,\n  DropdownMenuCheckboxItem,\n  DropdownMenuContent,\n  DropdownMenuGroup,\n  DropdownMenuItem,\n  DropdownMenuLabel,\n  DropdownMenuPortal,\n  DropdownMenuRadioGroup,\n  DropdownMenuRadioItem,\n  DropdownMenuSeparator,\n  DropdownMenuShortcut,\n  DropdownMenuSub,\n  DropdownMenuSubContent,\n  DropdownMenuSubTrigger,\n  DropdownMenuTrigger,\n}\n"],"mappings":"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"}

package/dist/components/empty-state.cjs

@@ -0,0 +1,35 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../chunk-aJGBMT86.cjs");
+const require_icons_material_symbol = require("../icons/material-symbol.cjs");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/components/empty-state.tsx
+function EmptyState({ action, description, icon, title }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex flex-col items-center gap-4 rounded-2xl border border-dashed border-gray px-6 py-12 text-center",
+		children: [
+			icon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "flex size-12 items-center justify-center rounded-xl bg-base-gray-soft",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons_material_symbol.MaterialSymbol, {
+					className: "text-[20px] text-gray-light",
+					name: icon
+				})
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex flex-col gap-1",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
+					className: "text-base font-bold text-gray",
+					children: title
+				}), description && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+					className: "mx-auto max-w-md text-sm text-gray-light",
+					children: description
+				})]
+			}),
+			action
+		]
+	});
+}
+//#endregion
+exports.EmptyState = EmptyState;
+
+//# sourceMappingURL=empty-state.cjs.map

package/dist/components/empty-state.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"empty-state.cjs","names":["MaterialSymbol"],"sources":["../../src/components/empty-state.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport {\n  MaterialSymbol,\n  type MaterialSymbolIconName,\n} from '../icons/material-symbol'\n\ninterface EmptyStateProps {\n  title: string\n  description?: string\n  icon?: MaterialSymbolIconName\n  action?: ReactNode\n}\n\nexport function EmptyState({\n  action,\n  description,\n  icon,\n  title,\n}: EmptyStateProps) {\n  return (\n    <div className=\"flex flex-col items-center gap-4 rounded-2xl border border-dashed border-gray px-6 py-12 text-center\">\n      {icon && (\n        <div className=\"flex size-12 items-center justify-center rounded-xl bg-base-gray-soft\">\n          <MaterialSymbol className=\"text-[20px] text-gray-light\" name={icon} />\n        </div>\n      )}\n      <div className=\"flex flex-col gap-1\">\n        <h3 className=\"text-base font-bold text-gray\">{title}</h3>\n        {description && (\n          <p className=\"mx-auto max-w-md text-sm text-gray-light\">\n            {description}\n          </p>\n        )}\n      </div>\n      {action}\n    </div>\n  )\n}\n\nexport type { EmptyStateProps }\n"],"mappings":";;;;;;AAaA,SAAgB,WAAW,EACzB,QACA,aACA,MACA,SACkB;AAClB,QACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EAAK,WAAU;YAAf;GACG,QACC,iBAAA,GAAA,kBAAA,KAAC,OAAD;IAAK,WAAU;cACb,iBAAA,GAAA,kBAAA,KAACA,8BAAAA,gBAAD;KAAgB,WAAU;KAA8B,MAAM;KAAQ,CAAA;IAClE,CAAA;GAER,iBAAA,GAAA,kBAAA,MAAC,OAAD;IAAK,WAAU;cAAf,CACE,iBAAA,GAAA,kBAAA,KAAC,MAAD;KAAI,WAAU;eAAiC;KAAW,CAAA,EACzD,eACC,iBAAA,GAAA,kBAAA,KAAC,KAAD;KAAG,WAAU;eACV;KACC,CAAA,CAEF;;GACL;GACG"}

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

@@ -0,0 +1,22 @@
+"use client";
+
+import { MaterialSymbolIconName } from "../icons/material-symbol.cjs";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { ReactNode } from "react";
+
+//#region src/components/empty-state.d.ts
+interface EmptyStateProps {
+  title: string;
+  description?: string;
+  icon?: MaterialSymbolIconName;
+  action?: ReactNode;
+}
+declare function EmptyState({
+  action,
+  description,
+  icon,
+  title
+}: EmptyStateProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { EmptyState, type EmptyStateProps };
+//# sourceMappingURL=empty-state.d.cts.map

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

@@ -0,0 +1,22 @@
+"use client";
+
+import { MaterialSymbolIconName } from "../icons/material-symbol.js";
+import { ReactNode } from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/empty-state.d.ts
+interface EmptyStateProps {
+  title: string;
+  description?: string;
+  icon?: MaterialSymbolIconName;
+  action?: ReactNode;
+}
+declare function EmptyState({
+  action,
+  description,
+  icon,
+  title
+}: EmptyStateProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { EmptyState, type EmptyStateProps };
+//# sourceMappingURL=empty-state.d.ts.map