@lucasbernardosn/react-ui 0.0.0-stage → 0.1.0

package/dist/components/overlays/drawer/drawer-title.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-title.js","names":["BaseDrawer"],"sources":["../../../../src/components/overlays/drawer/drawer-title.tsx"],"sourcesContent":["import { Drawer as BaseDrawer } from '@base-ui/react/drawer';\nimport { mergeStateClassNames } from '#utils';\n\nexport type DrawerTitleProps = BaseDrawer.Title.Props;\n\nexport type DrawerTitleState = BaseDrawer.Title.State;\n\n/**\n * Título do drawer, um `h2` ligado ao popup por `aria-labelledby`.\n *\n * Cópia de `DialogTitle`, sem diferenças (tabela no README de `overlays`); o mecanismo está\n * explicado lá.\n */\nexport const DrawerTitle = (props: DrawerTitleProps) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseDrawer.Title\n      data-component=\"Drawer.Title\"\n      className={mergeStateClassNames(\n        [\n          'text-lg',\n          'leading-6',\n          'font-semibold',\n          'text-gray-12',\n          'text-balance',\n        ],\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nDrawerTitle.displayName = 'Drawer.Title';\n"],"mappings":";;;;;;;;;;AAaA,MAAa,eAAe,UAA4B;CACtD,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,OAAW,OAAZ;EACE,kBAAe;EACf,WAAW,qBACT;GACE;GACA;GACA;GACA;GACA;EACF,GACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,YAAY,cAAc"}

package/dist/components/overlays/drawer/drawer-trigger.d.ts

@@ -0,0 +1,13 @@
+import { Drawer } from "@base-ui/react/drawer";
+//#region src/components/overlays/drawer/drawer-trigger.d.ts
+export type DrawerTriggerProps<Payload = unknown> = Drawer.Trigger.Props<Payload>;
+export type DrawerTriggerState = Drawer.Trigger.State;
+/**
+ * Elemento que abre o drawer. Sem estilo próprio; passe um botão da lib em `render`.
+ */
+export declare const DrawerTrigger: {
+  <Payload extends unknown = unknown>(props: DrawerTriggerProps<Payload>): import("react").JSX.Element;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=drawer-trigger.d.ts.map

package/dist/components/overlays/drawer/drawer-trigger.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-trigger.d.ts","names":["BaseDrawer"],"sources":["../../../../src/components/overlays/drawer/drawer-trigger.tsx"],"mappings":";;YAIY,mBAAmB,qBAC7BA,OAAW,QAAQ,MAAM;YAEf,qBAAqBA,OAAW,QAAQ;;;;qBAKvC;GAAiB,mCAAO,OAC5B,mBAAmB,2BAAQ,IAAA"}

package/dist/components/overlays/drawer/drawer-trigger.js

@@ -0,0 +1,20 @@
+import { mergeStateClassNames } from "../../../utils/merge-state-class-names.js";
+import { jsx } from "react/jsx-runtime";
+import { Drawer } from "@base-ui/react/drawer";
+//#region src/components/overlays/drawer/drawer-trigger.tsx
+/**
+* Elemento que abre o drawer. Sem estilo próprio; passe um botão da lib em `render`.
+*/
+const DrawerTrigger = (props) => {
+	const { className, ...rest } = props;
+	return /* @__PURE__ */ jsx(Drawer.Trigger, {
+		"data-component": "Drawer.Trigger",
+		className: mergeStateClassNames([], className),
+		...rest
+	});
+};
+DrawerTrigger.displayName = "Drawer.Trigger";
+//#endregion
+export { DrawerTrigger };
+
+//# sourceMappingURL=drawer-trigger.js.map

package/dist/components/overlays/drawer/drawer-trigger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-trigger.js","names":["BaseDrawer"],"sources":["../../../../src/components/overlays/drawer/drawer-trigger.tsx"],"sourcesContent":["import { Drawer as BaseDrawer } from '@base-ui/react/drawer';\nimport type { AnyType } from '@lucasbernardosn/utils';\nimport { mergeStateClassNames } from '#utils';\n\nexport type DrawerTriggerProps<Payload = unknown> =\n  BaseDrawer.Trigger.Props<Payload>;\n\nexport type DrawerTriggerState = BaseDrawer.Trigger.State;\n\n/**\n * Elemento que abre o drawer. Sem estilo próprio; passe um botão da lib em `render`.\n */\nexport const DrawerTrigger = <Payload extends AnyType = unknown>(\n  props: DrawerTriggerProps<Payload>,\n) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseDrawer.Trigger\n      data-component=\"Drawer.Trigger\"\n      className={mergeStateClassNames([], className)}\n      {...rest}\n    />\n  );\n};\n\nDrawerTrigger.displayName = 'Drawer.Trigger';\n"],"mappings":";;;;;;;AAYA,MAAa,iBACX,UACG;CACH,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,OAAW,SAAZ;EACE,kBAAe;EACf,WAAW,qBAAqB,CAAC,GAAG,SAAS;EAC7C,GAAI;CACL,CAAA;AAEL;AAEA,cAAc,cAAc"}

package/dist/components/overlays/drawer/drawer-viewport.d.ts

@@ -0,0 +1,14 @@
+import { Drawer } from "@base-ui/react/drawer";
+//#region src/components/overlays/drawer/drawer-viewport.d.ts
+export type DrawerViewportProps = Drawer.Viewport.Props;
+export type DrawerViewportState = Drawer.Viewport.State;
+/**
+ * Camada fixa sobre a tela que prende o popup à borda do `side`. Um clique nela, fora do popup,
+ * fecha o drawer como um clique no backdrop.
+ */
+export declare const DrawerViewport: {
+  (props: DrawerViewportProps): import("react").JSX.Element;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=drawer-viewport.d.ts.map

package/dist/components/overlays/drawer/drawer-viewport.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-viewport.d.ts","names":["BaseDrawer"],"sources":["../../../../src/components/overlays/drawer/drawer-viewport.tsx"],"mappings":";;YAKY,sBAAsBA,OAAW,SAAS;YAE1C,sBAAsBA,OAAW,SAAS;;;;;qBA+BzC;GAAyB,OAAA,sCAAmB,IAAA"}

package/dist/components/overlays/drawer/drawer-viewport.js

@@ -0,0 +1,38 @@
+import { mergeStateClassNames } from "../../../utils/merge-state-class-names.js";
+import { drawerDefaultVariants, useDrawerContext } from "./use-drawer-context.js";
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+import { Drawer } from "@base-ui/react/drawer";
+//#region src/components/overlays/drawer/drawer-viewport.tsx
+const drawerViewportVariants = cva([
+	"fixed",
+	"inset-0",
+	"flex",
+	"overflow-hidden"
+], {
+	variants: { side: {
+		right: ["justify-end", "items-stretch"],
+		left: ["justify-start", "items-stretch"],
+		top: ["flex-col", "justify-start"],
+		bottom: ["flex-col", "justify-end"]
+	} },
+	defaultVariants: { side: drawerDefaultVariants.side }
+});
+/**
+* Camada fixa sobre a tela que prende o popup à borda do `side`. Um clique nela, fora do popup,
+* fecha o drawer como um clique no backdrop.
+*/
+const DrawerViewport = (props) => {
+	const { className, ...rest } = props;
+	const { side } = useDrawerContext();
+	return /* @__PURE__ */ jsx(Drawer.Viewport, {
+		"data-component": "Drawer.Viewport",
+		className: mergeStateClassNames(drawerViewportVariants({ side }), className),
+		...rest
+	});
+};
+DrawerViewport.displayName = "Drawer.Viewport";
+//#endregion
+export { DrawerViewport };
+
+//# sourceMappingURL=drawer-viewport.js.map

package/dist/components/overlays/drawer/drawer-viewport.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-viewport.js","names":["BaseDrawer"],"sources":["../../../../src/components/overlays/drawer/drawer-viewport.tsx"],"sourcesContent":["import { Drawer as BaseDrawer } from '@base-ui/react/drawer';\nimport { cva } from 'class-variance-authority';\nimport { mergeStateClassNames } from '#utils';\nimport { drawerDefaultVariants, useDrawerContext } from './use-drawer-context';\n\nexport type DrawerViewportProps = BaseDrawer.Viewport.Props;\n\nexport type DrawerViewportState = BaseDrawer.Viewport.State;\n\nconst drawerViewportVariants = cva(\n  [\n    'fixed',\n    'inset-0',\n\n    'flex',\n    // A folga do popup (ver `drawerPopupVariants`) passa da borda da tela; sem o corte, ela\n    // apareceria rolando a página.\n    'overflow-hidden',\n  ],\n  {\n    variants: {\n      side: {\n        right: ['justify-end', 'items-stretch'],\n        left: ['justify-start', 'items-stretch'],\n        top: ['flex-col', 'justify-start'],\n        bottom: ['flex-col', 'justify-end'],\n      },\n    },\n    defaultVariants: {\n      side: drawerDefaultVariants.side,\n    },\n  },\n);\n\n/**\n * Camada fixa sobre a tela que prende o popup à borda do `side`. Um clique nela, fora do popup,\n * fecha o drawer como um clique no backdrop.\n */\nexport const DrawerViewport = (props: DrawerViewportProps) => {\n  const { className, ...rest } = props;\n\n  const { side } = useDrawerContext();\n\n  return (\n    <BaseDrawer.Viewport\n      data-component=\"Drawer.Viewport\"\n      className={mergeStateClassNames(\n        drawerViewportVariants({ side }),\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nDrawerViewport.displayName = 'Drawer.Viewport';\n"],"mappings":";;;;;;AASA,MAAM,yBAAyB,IAC7B;CACE;CACA;CAEA;CAGA;AACF,GACA;CACE,UAAU,EACR,MAAM;EACJ,OAAO,CAAC,eAAe,eAAe;EACtC,MAAM,CAAC,iBAAiB,eAAe;EACvC,KAAK,CAAC,YAAY,eAAe;EACjC,QAAQ,CAAC,YAAY,aAAa;CACpC,EACF;CACA,iBAAiB,EACf,MAAM,sBAAsB,KAC9B;AACF,CACF;;;;;AAMA,MAAa,kBAAkB,UAA+B;CAC5D,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,MAAM,EAAE,SAAS,iBAAiB;CAElC,OACE,oBAACA,OAAW,UAAZ;EACE,kBAAe;EACf,WAAW,qBACT,uBAAuB,EAAE,KAAK,CAAC,GAC/B,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,eAAe,cAAc"}

package/dist/components/overlays/drawer/index.d.ts

@@ -0,0 +1,2 @@
+import { index_parts_d_exports } from "./index.parts.js";
+export { index_parts_d_exports as Drawer };

package/dist/components/overlays/drawer/index.js

@@ -0,0 +1,2 @@
+import { index_parts_exports } from "./index.parts.js";
+export { index_parts_exports as Drawer };

package/dist/components/overlays/drawer/index.parts.d.ts

@@ -0,0 +1,20 @@
+import { DrawerHandle, createDrawerHandle } from "./create-handle.js";
+import { DrawerBackdrop, DrawerBackdropProps, DrawerBackdropState } from "./drawer-backdrop.js";
+import { DrawerBody, DrawerBodyProps, DrawerBodyState } from "./drawer-body.js";
+import { DrawerClose, DrawerCloseProps, DrawerCloseState } from "./drawer-close.js";
+import { DrawerDescription, DrawerDescriptionProps, DrawerDescriptionState } from "./drawer-description.js";
+import { DrawerFooter, DrawerFooterProps } from "./drawer-footer.js";
+import { DrawerHeader, DrawerHeaderProps } from "./drawer-header.js";
+import { DrawerPopup, DrawerPopupProps, DrawerPopupState } from "./drawer-popup.js";
+import { DrawerPortal, DrawerPortalProps, DrawerPortalState } from "./drawer-portal.js";
+import { DrawerVariants } from "./use-drawer-context.js";
+import { DrawerRoot, DrawerRootActions, DrawerRootChangeEventDetails, DrawerRootChangeEventReason, DrawerRootProps, DrawerRootSnapPoint, DrawerRootState } from "./drawer-root.js";
+import { DrawerTitle, DrawerTitleProps, DrawerTitleState } from "./drawer-title.js";
+import { DrawerTrigger, DrawerTriggerProps, DrawerTriggerState } from "./drawer-trigger.js";
+import { DrawerViewport, DrawerViewportProps, DrawerViewportState } from "./drawer-viewport.js";
+declare namespace index_parts_d_exports {
+  export { DrawerBackdrop as Backdrop, DrawerBackdropProps as BackdropProps, DrawerBackdropState as BackdropState, DrawerBody as Body, DrawerBodyProps as BodyProps, DrawerBodyState as BodyState, DrawerClose as Close, DrawerCloseProps as CloseProps, DrawerCloseState as CloseState, DrawerDescription as Description, DrawerDescriptionProps as DescriptionProps, DrawerDescriptionState as DescriptionState, DrawerFooter as Footer, DrawerFooterProps as FooterProps, DrawerHandle as Handle, DrawerHeader as Header, DrawerHeaderProps as HeaderProps, DrawerPopup as Popup, DrawerPopupProps as PopupProps, DrawerPopupState as PopupState, DrawerPortal as Portal, DrawerPortalProps as PortalProps, DrawerPortalState as PortalState, DrawerRoot as Root, DrawerRootActions as RootActions, DrawerRootChangeEventDetails as RootChangeEventDetails, DrawerRootChangeEventReason as RootChangeEventReason, DrawerRootProps as RootProps, DrawerRootSnapPoint as RootSnapPoint, DrawerRootState as RootState, DrawerTitle as Title, DrawerTitleProps as TitleProps, DrawerTitleState as TitleState, DrawerTrigger as Trigger, DrawerTriggerProps as TriggerProps, DrawerTriggerState as TriggerState, DrawerVariants as Variants, DrawerViewport as Viewport, DrawerViewportProps as ViewportProps, DrawerViewportState as ViewportState, createDrawerHandle as createHandle };
+}
+//#endregion
+export { DrawerBackdrop as Backdrop, type DrawerBackdropProps as BackdropProps, type DrawerBackdropState as BackdropState, DrawerBody as Body, type DrawerBodyProps as BodyProps, type DrawerBodyState as BodyState, DrawerClose as Close, type DrawerCloseProps as CloseProps, type DrawerCloseState as CloseState, DrawerDescription as Description, type DrawerDescriptionProps as DescriptionProps, type DrawerDescriptionState as DescriptionState, DrawerFooter as Footer, type DrawerFooterProps as FooterProps, type DrawerHandle as Handle, DrawerHeader as Header, type DrawerHeaderProps as HeaderProps, DrawerPopup as Popup, type DrawerPopupProps as PopupProps, type DrawerPopupState as PopupState, DrawerPortal as Portal, type DrawerPortalProps as PortalProps, type DrawerPortalState as PortalState, DrawerRoot as Root, type DrawerRootActions as RootActions, type DrawerRootChangeEventDetails as RootChangeEventDetails, type DrawerRootChangeEventReason as RootChangeEventReason, type DrawerRootProps as RootProps, type DrawerRootSnapPoint as RootSnapPoint, type DrawerRootState as RootState, DrawerTitle as Title, type DrawerTitleProps as TitleProps, type DrawerTitleState as TitleState, DrawerTrigger as Trigger, type DrawerTriggerProps as TriggerProps, type DrawerTriggerState as TriggerState, type DrawerVariants as Variants, DrawerViewport as Viewport, type DrawerViewportProps as ViewportProps, type DrawerViewportState as ViewportState, createDrawerHandle as createHandle, index_parts_d_exports };
+//# sourceMappingURL=index.parts.d.ts.map

package/dist/components/overlays/drawer/index.parts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.parts.d.ts","names":[],"sources":["../../../../src/components/overlays/drawer/index.parts.ts"],"mappings":""}

package/dist/components/overlays/drawer/index.parts.js

@@ -0,0 +1,34 @@
+import { __exportAll } from "../../../_virtual/_rolldown/runtime.js";
+import { createDrawerHandle } from "./create-handle.js";
+import { DrawerBackdrop } from "./drawer-backdrop.js";
+import { DrawerBody } from "./drawer-body.js";
+import { DrawerClose } from "./drawer-close.js";
+import { DrawerDescription } from "./drawer-description.js";
+import { DrawerFooter } from "./drawer-footer.js";
+import { DrawerHeader } from "./drawer-header.js";
+import { DrawerPopup } from "./drawer-popup.js";
+import { DrawerPortal } from "./drawer-portal.js";
+import { DrawerRoot } from "./drawer-root.js";
+import { DrawerTitle } from "./drawer-title.js";
+import { DrawerTrigger } from "./drawer-trigger.js";
+import { DrawerViewport } from "./drawer-viewport.js";
+//#region src/components/overlays/drawer/index.parts.ts
+var index_parts_exports = /* @__PURE__ */ __exportAll({
+	Backdrop: () => DrawerBackdrop,
+	Body: () => DrawerBody,
+	Close: () => DrawerClose,
+	Description: () => DrawerDescription,
+	Footer: () => DrawerFooter,
+	Header: () => DrawerHeader,
+	Popup: () => DrawerPopup,
+	Portal: () => DrawerPortal,
+	Root: () => DrawerRoot,
+	Title: () => DrawerTitle,
+	Trigger: () => DrawerTrigger,
+	Viewport: () => DrawerViewport,
+	createHandle: () => createDrawerHandle
+});
+//#endregion
+export { DrawerBackdrop as Backdrop, DrawerBody as Body, DrawerClose as Close, DrawerDescription as Description, DrawerFooter as Footer, DrawerHeader as Header, DrawerPopup as Popup, DrawerPortal as Portal, DrawerRoot as Root, DrawerTitle as Title, DrawerTrigger as Trigger, DrawerViewport as Viewport, createDrawerHandle as createHandle, index_parts_exports };
+
+//# sourceMappingURL=index.parts.js.map

package/dist/components/overlays/drawer/index.parts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.parts.js","names":[],"sources":["../../../../src/components/overlays/drawer/index.parts.ts"],"sourcesContent":["export { createDrawerHandle as createHandle } from './create-handle';\nexport { DrawerBackdrop as Backdrop } from './drawer-backdrop';\nexport { DrawerBody as Body } from './drawer-body';\nexport { DrawerClose as Close } from './drawer-close';\nexport { DrawerDescription as Description } from './drawer-description';\nexport { DrawerFooter as Footer } from './drawer-footer';\nexport { DrawerHeader as Header } from './drawer-header';\nexport { DrawerPopup as Popup } from './drawer-popup';\nexport { DrawerPortal as Portal } from './drawer-portal';\nexport { DrawerRoot as Root } from './drawer-root';\nexport { DrawerTitle as Title } from './drawer-title';\nexport { DrawerTrigger as Trigger } from './drawer-trigger';\nexport { DrawerViewport as Viewport } from './drawer-viewport';\n\n/* types */\n\nexport type { DrawerHandle as Handle } from './create-handle';\nexport type {\n  DrawerBackdropProps as BackdropProps,\n  DrawerBackdropState as BackdropState,\n} from './drawer-backdrop';\nexport type {\n  DrawerBodyProps as BodyProps,\n  DrawerBodyState as BodyState,\n} from './drawer-body';\nexport type {\n  DrawerCloseProps as CloseProps,\n  DrawerCloseState as CloseState,\n} from './drawer-close';\nexport type {\n  DrawerDescriptionProps as DescriptionProps,\n  DrawerDescriptionState as DescriptionState,\n} from './drawer-description';\nexport type { DrawerFooterProps as FooterProps } from './drawer-footer';\nexport type { DrawerHeaderProps as HeaderProps } from './drawer-header';\nexport type {\n  DrawerPopupProps as PopupProps,\n  DrawerPopupState as PopupState,\n} from './drawer-popup';\nexport type {\n  DrawerPortalProps as PortalProps,\n  DrawerPortalState as PortalState,\n} from './drawer-portal';\nexport type {\n  DrawerRootActions as RootActions,\n  DrawerRootChangeEventDetails as RootChangeEventDetails,\n  DrawerRootChangeEventReason as RootChangeEventReason,\n  DrawerRootProps as RootProps,\n  DrawerRootSnapPoint as RootSnapPoint,\n  DrawerRootState as RootState,\n} from './drawer-root';\nexport type {\n  DrawerTitleProps as TitleProps,\n  DrawerTitleState as TitleState,\n} from './drawer-title';\nexport type {\n  DrawerTriggerProps as TriggerProps,\n  DrawerTriggerState as TriggerState,\n} from './drawer-trigger';\nexport type {\n  DrawerViewportProps as ViewportProps,\n  DrawerViewportState as ViewportState,\n} from './drawer-viewport';\nexport type { DrawerVariants as Variants } from './use-drawer-context';\n"],"mappings":""}

package/dist/components/overlays/drawer/use-drawer-context.d.ts

@@ -0,0 +1,25 @@
+//#region src/components/overlays/drawer/use-drawer-context.d.ts
+/**
+ * Variantes do Drawer. Informadas no `Drawer.Root` e repassadas às partes por contexto.
+ */
+export type DrawerVariants = {
+  /**
+   * Borda da tela de onde o drawer sai. Também define o gesto de fechar: arrastar de volta para
+   * essa borda.
+   *
+   * @default 'right'
+   */
+  side?: 'right' | 'left' | 'top' | 'bottom';
+  /**
+   * Largura máxima de um drawer lateral (`right` e `left`), nos valores de `max-w-*` do tema: de
+   * `xs` (20rem) a `7xl` (80rem), e `full`, a largura da tela. Em `top` e `bottom` não se aplica: a
+   * altura segue o conteúdo até 85% da tela.
+   *
+   * @default 'sm'
+   */
+  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | '7xl' | 'full';
+};
+export declare const drawerDefaultVariants: Required<DrawerVariants>;
+export declare const DrawerContextProvider: import("react").Provider<DrawerVariants>, useDrawerContext: () => DrawerVariants;
+//#endregion
+//# sourceMappingURL=use-drawer-context.d.ts.map

package/dist/components/overlays/drawer/use-drawer-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-drawer-context.d.ts","names":[],"sources":["../../../../src/components/overlays/drawer/use-drawer-context.ts"],"mappings":";;;;YAKY;;;;;;;EAOV;;;;;;;;EAQA;;qBAeW,uBAAuB,SAAS;qBAK/B,uCAAqB,SAAA,iBAAE,wBAAgB"}

package/dist/components/overlays/drawer/use-drawer-context.js

@@ -0,0 +1,14 @@
+import { createContext } from "@lucasbernardosn/react-utils";
+//#region src/components/overlays/drawer/use-drawer-context.ts
+const drawerDefaultVariants = {
+	side: "right",
+	size: "sm"
+};
+const [DrawerContextProvider, useDrawerContext] = createContext({
+	name: "DrawerContext",
+	providers: ["Drawer.Root"]
+});
+//#endregion
+export { DrawerContextProvider, drawerDefaultVariants, useDrawerContext };
+
+//# sourceMappingURL=use-drawer-context.js.map

package/dist/components/overlays/drawer/use-drawer-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-drawer-context.js","names":[],"sources":["../../../../src/components/overlays/drawer/use-drawer-context.ts"],"sourcesContent":["import { createContext } from '@lucasbernardosn/react-utils';\n\n/**\n * Variantes do Drawer. Informadas no `Drawer.Root` e repassadas às partes por contexto.\n */\nexport type DrawerVariants = {\n  /**\n   * Borda da tela de onde o drawer sai. Também define o gesto de fechar: arrastar de volta para\n   * essa borda.\n   *\n   * @default 'right'\n   */\n  side?: 'right' | 'left' | 'top' | 'bottom';\n  /**\n   * Largura máxima de um drawer lateral (`right` e `left`), nos valores de `max-w-*` do tema: de\n   * `xs` (20rem) a `7xl` (80rem), e `full`, a largura da tela. Em `top` e `bottom` não se aplica: a\n   * altura segue o conteúdo até 85% da tela.\n   *\n   * @default 'sm'\n   */\n  size?:\n    | 'xs'\n    | 'sm'\n    | 'md'\n    | 'lg'\n    | 'xl'\n    | '2xl'\n    | '3xl'\n    | '4xl'\n    | '5xl'\n    | '6xl'\n    | '7xl'\n    | 'full';\n};\n\nexport const drawerDefaultVariants: Required<DrawerVariants> = {\n  side: 'right',\n  size: 'sm',\n};\n\nexport const [DrawerContextProvider, useDrawerContext] =\n  createContext<DrawerVariants>({\n    name: 'DrawerContext',\n    providers: ['Drawer.Root'],\n  });\n"],"mappings":";;AAmCA,MAAa,wBAAkD;CAC7D,MAAM;CACN,MAAM;AACR;AAEA,MAAa,CAAC,uBAAuB,oBACnC,cAA8B;CAC5B,MAAM;CACN,WAAW,CAAC,aAAa;AAC3B,CAAC"}

package/dist/components/overlays/menu/index.d.ts

@@ -0,0 +1,2 @@
+import { index_parts_d_exports } from "./index.parts.js";
+export { index_parts_d_exports as Menu };

package/dist/components/overlays/menu/index.js

@@ -0,0 +1,2 @@
+import { index_parts_exports } from "./index.parts.js";
+export { index_parts_exports as Menu };

package/dist/components/overlays/menu/index.parts.d.ts

@@ -0,0 +1,16 @@
+import { MenuGroup, MenuGroupProps, MenuGroupState } from "./menu-group.js";
+import { MenuGroupLabel, MenuGroupLabelProps, MenuGroupLabelState } from "./menu-group-label.js";
+import { MenuItemVariants } from "./menu-item-variants.js";
+import { MenuItem, MenuItemProps, MenuItemState } from "./menu-item.js";
+import { MenuPopup, MenuPopupProps, MenuPopupState } from "./menu-popup.js";
+import { MenuPortal, MenuPortalProps, MenuPortalState } from "./menu-portal.js";
+import { MenuPositioner, MenuPositionerProps, MenuPositionerState } from "./menu-positioner.js";
+import { MenuRoot, MenuRootActions, MenuRootChangeEventDetails, MenuRootChangeEventReason, MenuRootProps, MenuRootState } from "./menu-root.js";
+import { MenuSeparator, MenuSeparatorProps, MenuSeparatorState } from "./menu-separator.js";
+import { MenuTrigger, MenuTriggerProps, MenuTriggerState } from "./menu-trigger.js";
+declare namespace index_parts_d_exports {
+  export { MenuGroup as Group, MenuGroupLabel as GroupLabel, MenuGroupLabelProps as GroupLabelProps, MenuGroupLabelState as GroupLabelState, MenuGroupProps as GroupProps, MenuGroupState as GroupState, MenuItem as Item, MenuItemProps as ItemProps, MenuItemState as ItemState, MenuItemVariants as ItemVariants, MenuPopup as Popup, MenuPopupProps as PopupProps, MenuPopupState as PopupState, MenuPortal as Portal, MenuPortalProps as PortalProps, MenuPortalState as PortalState, MenuPositioner as Positioner, MenuPositionerProps as PositionerProps, MenuPositionerState as PositionerState, MenuRoot as Root, MenuRootActions as RootActions, MenuRootChangeEventDetails as RootChangeEventDetails, MenuRootChangeEventReason as RootChangeEventReason, MenuRootProps as RootProps, MenuRootState as RootState, MenuSeparator as Separator, MenuSeparatorProps as SeparatorProps, MenuSeparatorState as SeparatorState, MenuTrigger as Trigger, MenuTriggerProps as TriggerProps, MenuTriggerState as TriggerState };
+}
+//#endregion
+export { MenuGroup as Group, MenuGroupLabel as GroupLabel, type MenuGroupLabelProps as GroupLabelProps, type MenuGroupLabelState as GroupLabelState, type MenuGroupProps as GroupProps, type MenuGroupState as GroupState, MenuItem as Item, type MenuItemProps as ItemProps, type MenuItemState as ItemState, type MenuItemVariants as ItemVariants, MenuPopup as Popup, type MenuPopupProps as PopupProps, type MenuPopupState as PopupState, MenuPortal as Portal, type MenuPortalProps as PortalProps, type MenuPortalState as PortalState, MenuPositioner as Positioner, type MenuPositionerProps as PositionerProps, type MenuPositionerState as PositionerState, MenuRoot as Root, type MenuRootActions as RootActions, type MenuRootChangeEventDetails as RootChangeEventDetails, type MenuRootChangeEventReason as RootChangeEventReason, type MenuRootProps as RootProps, type MenuRootState as RootState, MenuSeparator as Separator, type MenuSeparatorProps as SeparatorProps, type MenuSeparatorState as SeparatorState, MenuTrigger as Trigger, type MenuTriggerProps as TriggerProps, type MenuTriggerState as TriggerState, index_parts_d_exports };
+//# sourceMappingURL=index.parts.d.ts.map

package/dist/components/overlays/menu/index.parts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.parts.d.ts","names":[],"sources":["../../../../src/components/overlays/menu/index.parts.ts"],"mappings":""}

package/dist/components/overlays/menu/index.parts.js

@@ -0,0 +1,26 @@
+import { __exportAll } from "../../../_virtual/_rolldown/runtime.js";
+import { MenuGroup } from "./menu-group.js";
+import { MenuGroupLabel } from "./menu-group-label.js";
+import { MenuItem } from "./menu-item.js";
+import { MenuPopup } from "./menu-popup.js";
+import { MenuPortal } from "./menu-portal.js";
+import { MenuPositioner } from "./menu-positioner.js";
+import { MenuRoot } from "./menu-root.js";
+import { MenuSeparator } from "./menu-separator.js";
+import { MenuTrigger } from "./menu-trigger.js";
+//#region src/components/overlays/menu/index.parts.ts
+var index_parts_exports = /* @__PURE__ */ __exportAll({
+	Group: () => MenuGroup,
+	GroupLabel: () => MenuGroupLabel,
+	Item: () => MenuItem,
+	Popup: () => MenuPopup,
+	Portal: () => MenuPortal,
+	Positioner: () => MenuPositioner,
+	Root: () => MenuRoot,
+	Separator: () => MenuSeparator,
+	Trigger: () => MenuTrigger
+});
+//#endregion
+export { MenuGroup as Group, MenuGroupLabel as GroupLabel, MenuItem as Item, MenuPopup as Popup, MenuPortal as Portal, MenuPositioner as Positioner, MenuRoot as Root, MenuSeparator as Separator, MenuTrigger as Trigger, index_parts_exports };
+
+//# sourceMappingURL=index.parts.js.map

package/dist/components/overlays/menu/index.parts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.parts.js","names":[],"sources":["../../../../src/components/overlays/menu/index.parts.ts"],"sourcesContent":["export { MenuGroup as Group } from './menu-group';\nexport { MenuGroupLabel as GroupLabel } from './menu-group-label';\nexport { MenuItem as Item } from './menu-item';\nexport { MenuPopup as Popup } from './menu-popup';\nexport { MenuPortal as Portal } from './menu-portal';\nexport { MenuPositioner as Positioner } from './menu-positioner';\nexport { MenuRoot as Root } from './menu-root';\nexport { MenuSeparator as Separator } from './menu-separator';\nexport { MenuTrigger as Trigger } from './menu-trigger';\n\n/* types */\n\nexport type {\n  MenuGroupProps as GroupProps,\n  MenuGroupState as GroupState,\n} from './menu-group';\nexport type {\n  MenuGroupLabelProps as GroupLabelProps,\n  MenuGroupLabelState as GroupLabelState,\n} from './menu-group-label';\nexport type {\n  MenuItemProps as ItemProps,\n  MenuItemState as ItemState,\n} from './menu-item';\nexport type { MenuItemVariants as ItemVariants } from './menu-item-variants';\nexport type {\n  MenuPopupProps as PopupProps,\n  MenuPopupState as PopupState,\n} from './menu-popup';\nexport type {\n  MenuPortalProps as PortalProps,\n  MenuPortalState as PortalState,\n} from './menu-portal';\nexport type {\n  MenuPositionerProps as PositionerProps,\n  MenuPositionerState as PositionerState,\n} from './menu-positioner';\nexport type {\n  MenuRootActions as RootActions,\n  MenuRootChangeEventDetails as RootChangeEventDetails,\n  MenuRootChangeEventReason as RootChangeEventReason,\n  MenuRootProps as RootProps,\n  MenuRootState as RootState,\n} from './menu-root';\nexport type {\n  MenuSeparatorProps as SeparatorProps,\n  MenuSeparatorState as SeparatorState,\n} from './menu-separator';\nexport type {\n  MenuTriggerProps as TriggerProps,\n  MenuTriggerState as TriggerState,\n} from './menu-trigger';\n"],"mappings":""}

package/dist/components/overlays/menu/menu-group-label.d.ts

@@ -0,0 +1,18 @@
+import { Menu } from "@base-ui/react/menu";
+//#region src/components/overlays/menu/menu-group-label.d.ts
+export type MenuGroupLabelProps = Menu.GroupLabel.Props;
+export type MenuGroupLabelState = Menu.GroupLabel.State;
+/**
+ * Rótulo do grupo, ligado a ele pelo Base UI (`aria-labelledby`) e grudado no topo do menu
+ * enquanto o grupo rola.
+ *
+ * Cópia de `selectGroupLabelVariants` (tabela no README de `collections`). A diferença é o recuo:
+ * sem a coluna do check, ele é o `px-2.5` do `Menu.Item`, e o texto do rótulo alinha com o dos
+ * itens. Mudar o espaçamento do item pede mudar este valor.
+ */
+export declare const MenuGroupLabel: {
+  (props: MenuGroupLabelProps): import("react").JSX.Element;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=menu-group-label.d.ts.map

package/dist/components/overlays/menu/menu-group-label.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-group-label.d.ts","names":["BaseMenu"],"sources":["../../../../src/components/overlays/menu/menu-group-label.tsx"],"mappings":";;YAGY,sBAAsBA,KAAS,WAAW;YAE1C,sBAAsBA,KAAS,WAAW;;;;;;;;;qBAUzC;GAAyB,OAAA,sCAAmB,IAAA"}

package/dist/components/overlays/menu/menu-group-label.js

@@ -0,0 +1,40 @@
+import { mergeStateClassNames } from "../../../utils/merge-state-class-names.js";
+import { jsx } from "react/jsx-runtime";
+import { Menu } from "@base-ui/react/menu";
+//#region src/components/overlays/menu/menu-group-label.tsx
+/**
+* Rótulo do grupo, ligado a ele pelo Base UI (`aria-labelledby`) e grudado no topo do menu
+* enquanto o grupo rola.
+*
+* Cópia de `selectGroupLabelVariants` (tabela no README de `collections`). A diferença é o recuo:
+* sem a coluna do check, ele é o `px-2.5` do `Menu.Item`, e o texto do rótulo alinha com o dos
+* itens. Mudar o espaçamento do item pede mudar este valor.
+*/
+const MenuGroupLabel = (props) => {
+	const { className, ...rest } = props;
+	return /* @__PURE__ */ jsx(Menu.GroupLabel, {
+		"data-component": "Menu.GroupLabel",
+		className: mergeStateClassNames([
+			"sticky",
+			"top-0",
+			"z-1",
+			"bg-white",
+			"dark:bg-gray-2",
+			"pt-2",
+			"pb-1",
+			"text-gray-11",
+			"font-semibold",
+			"uppercase",
+			"tracking-wider",
+			"ps-2.5",
+			"pe-2.5",
+			"text-[0.6875rem]"
+		], className),
+		...rest
+	});
+};
+MenuGroupLabel.displayName = "Menu.GroupLabel";
+//#endregion
+export { MenuGroupLabel };
+
+//# sourceMappingURL=menu-group-label.js.map

package/dist/components/overlays/menu/menu-group-label.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-group-label.js","names":["BaseMenu"],"sources":["../../../../src/components/overlays/menu/menu-group-label.tsx"],"sourcesContent":["import { Menu as BaseMenu } from '@base-ui/react/menu';\nimport { mergeStateClassNames } from '#utils';\n\nexport type MenuGroupLabelProps = BaseMenu.GroupLabel.Props;\n\nexport type MenuGroupLabelState = BaseMenu.GroupLabel.State;\n\n/**\n * Rótulo do grupo, ligado a ele pelo Base UI (`aria-labelledby`) e grudado no topo do menu\n * enquanto o grupo rola.\n *\n * Cópia de `selectGroupLabelVariants` (tabela no README de `collections`). A diferença é o recuo:\n * sem a coluna do check, ele é o `px-2.5` do `Menu.Item`, e o texto do rótulo alinha com o dos\n * itens. Mudar o espaçamento do item pede mudar este valor.\n */\nexport const MenuGroupLabel = (props: MenuGroupLabelProps) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseMenu.GroupLabel\n      data-component=\"Menu.GroupLabel\"\n      className={mergeStateClassNames(\n        [\n          'sticky',\n          'top-0',\n          'z-1',\n\n          // Mesmo fundo do popup: fixo no topo, o rótulo cobre os itens que rolam por baixo.\n          'bg-white',\n          'dark:bg-gray-2',\n\n          'pt-2',\n          'pb-1',\n\n          'text-gray-11',\n          'font-semibold',\n          'uppercase',\n          'tracking-wider',\n\n          'ps-2.5',\n          'pe-2.5',\n\n          'text-[0.6875rem]', // 11px\n        ],\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nMenuGroupLabel.displayName = 'Menu.GroupLabel';\n"],"mappings":";;;;;;;;;;;;AAeA,MAAa,kBAAkB,UAA+B;CAC5D,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,KAAS,YAAV;EACE,kBAAe;EACf,WAAW,qBACT;GACE;GACA;GACA;GAGA;GACA;GAEA;GACA;GAEA;GACA;GACA;GACA;GAEA;GACA;GAEA;EACF,GACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,eAAe,cAAc"}

package/dist/components/overlays/menu/menu-group.d.ts

@@ -0,0 +1,13 @@
+import { Menu } from "@base-ui/react/menu";
+//#region src/components/overlays/menu/menu-group.d.ts
+export type MenuGroupProps = Menu.Group.Props;
+export type MenuGroupState = Menu.Group.State;
+/**
+ * Agrupa itens relacionados, com `role="group"`. Nomeie o grupo com `Menu.GroupLabel`.
+ */
+export declare const MenuGroup: {
+  (props: MenuGroupProps): import("react").JSX.Element;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=menu-group.d.ts.map

package/dist/components/overlays/menu/menu-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-group.d.ts","names":["BaseMenu"],"sources":["../../../../src/components/overlays/menu/menu-group.tsx"],"mappings":";;YAGY,iBAAiBA,KAAS,MAAM;YAEhC,iBAAiBA,KAAS,MAAM;;;;qBAK/B;GAAoB,OAAA,iCAAc,IAAA"}

package/dist/components/overlays/menu/menu-group.js

@@ -0,0 +1,20 @@
+import { mergeStateClassNames } from "../../../utils/merge-state-class-names.js";
+import { jsx } from "react/jsx-runtime";
+import { Menu } from "@base-ui/react/menu";
+//#region src/components/overlays/menu/menu-group.tsx
+/**
+* Agrupa itens relacionados, com `role="group"`. Nomeie o grupo com `Menu.GroupLabel`.
+*/
+const MenuGroup = (props) => {
+	const { className, ...rest } = props;
+	return /* @__PURE__ */ jsx(Menu.Group, {
+		"data-component": "Menu.Group",
+		className: mergeStateClassNames([], className),
+		...rest
+	});
+};
+MenuGroup.displayName = "Menu.Group";
+//#endregion
+export { MenuGroup };
+
+//# sourceMappingURL=menu-group.js.map

package/dist/components/overlays/menu/menu-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-group.js","names":["BaseMenu"],"sources":["../../../../src/components/overlays/menu/menu-group.tsx"],"sourcesContent":["import { Menu as BaseMenu } from '@base-ui/react/menu';\nimport { mergeStateClassNames } from '#utils';\n\nexport type MenuGroupProps = BaseMenu.Group.Props;\n\nexport type MenuGroupState = BaseMenu.Group.State;\n\n/**\n * Agrupa itens relacionados, com `role=\"group\"`. Nomeie o grupo com `Menu.GroupLabel`.\n */\nexport const MenuGroup = (props: MenuGroupProps) => {\n  const { className, ...rest } = props;\n\n  return (\n    <BaseMenu.Group\n      data-component=\"Menu.Group\"\n      className={mergeStateClassNames([], className)}\n      {...rest}\n    />\n  );\n};\n\nMenuGroup.displayName = 'Menu.Group';\n"],"mappings":";;;;;;;AAUA,MAAa,aAAa,UAA0B;CAClD,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,KAAS,OAAV;EACE,kBAAe;EACf,WAAW,qBAAqB,CAAC,GAAG,SAAS;EAC7C,GAAI;CACL,CAAA;AAEL;AAEA,UAAU,cAAc"}

package/dist/components/overlays/menu/menu-item-variants.d.ts

@@ -0,0 +1,27 @@
+import { ColorSchemeSemantic } from "../../../types/color-scheme.js";
+//#region src/components/overlays/menu/menu-item-variants.d.ts
+export type MenuItemVariants = {
+  /**
+   * Cor do texto, do ícone e do realce. `red` marca a ação destrutiva (excluir, cancelar).
+   *
+   * @default 'gray'
+   */
+  colorScheme?: ColorSchemeSemantic;
+};
+export declare const menuItemDefaultVariants: Required<MenuItemVariants>;
+/**
+ * Cópia de `selectItemVariants`, a origem do item das listas em popup, onde o realce está
+ * explicado (tabela no README de `collections`). As diferenças:
+ * - `flex` em linha, sem a coluna do check: ícone, texto e atalho ficam lado a lado;
+ * - o realce aparece também no toque: o menu fecha ao tocar no item, e não sobra realce preso;
+ * - sem `size`: as medidas são as do `sm` do Select;
+ * - `colorScheme`, abaixo.
+ *
+ * Cada `colorScheme` só declara `--menu-item-fg` (texto e ícone) e `--menu-item-highlight-bg`
+ * (realce), que a base consome. Assim uma cor nova é só um par de variáveis.
+ */
+export declare const menuItemVariants: (props?: ({
+  colorScheme?: "gray" | "brand" | "red" | "green" | "blue" | "amber" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+//#endregion
+//# sourceMappingURL=menu-item-variants.d.ts.map

package/dist/components/overlays/menu/menu-item-variants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-item-variants.d.ts","names":[],"sources":["../../../../src/components/overlays/menu/menu-item-variants.ts"],"mappings":";;YAGY;;;;;;EAMV,cAAc;;qBAGH,yBAAyB,SAAS;;;;;;;;;;;;qBAelC,mBAAgB;;6CAmE5B"}

package/dist/components/overlays/menu/menu-item-variants.js

@@ -0,0 +1,53 @@
+import { cva } from "class-variance-authority";
+//#region src/components/overlays/menu/menu-item-variants.ts
+const menuItemDefaultVariants = { colorScheme: "gray" };
+/**
+* Cópia de `selectItemVariants`, a origem do item das listas em popup, onde o realce está
+* explicado (tabela no README de `collections`). As diferenças:
+* - `flex` em linha, sem a coluna do check: ícone, texto e atalho ficam lado a lado;
+* - o realce aparece também no toque: o menu fecha ao tocar no item, e não sobra realce preso;
+* - sem `size`: as medidas são as do `sm` do Select;
+* - `colorScheme`, abaixo.
+*
+* Cada `colorScheme` só declara `--menu-item-fg` (texto e ícone) e `--menu-item-highlight-bg`
+* (realce), que a base consome. Assim uma cor nova é só um par de variáveis.
+*/
+const menuItemVariants = cva([
+	"flex",
+	"items-center",
+	"relative",
+	"rounded",
+	"cursor-default",
+	"select-none",
+	"outline-none",
+	"data-disabled:pointer-events-none",
+	"data-disabled:opacity-50",
+	"data-highlighted:z-0",
+	"data-highlighted:before:absolute",
+	"data-highlighted:before:inset-x-1",
+	"data-highlighted:before:inset-y-0",
+	"data-highlighted:before:z-[-1]",
+	"data-highlighted:before:rounded",
+	"data-highlighted:before:content-[\"\"]",
+	"data-highlighted:before:bg-(--menu-item-highlight-bg)",
+	"px-2.5",
+	"gap-2",
+	"py-1.25",
+	"pointer-coarse:py-2.5",
+	"text-sm",
+	"text-(--menu-item-fg)"
+], {
+	variants: { colorScheme: {
+		gray: ["[--menu-item-fg:var(--color-gray-12)]", "[--menu-item-highlight-bg:var(--color-gray-4)]"],
+		brand: ["[--menu-item-fg:var(--color-brand-11)]", "[--menu-item-highlight-bg:var(--color-brand-4)]"],
+		red: ["[--menu-item-fg:var(--color-red-11)]", "[--menu-item-highlight-bg:var(--color-red-4)]"],
+		green: ["[--menu-item-fg:var(--color-green-11)]", "[--menu-item-highlight-bg:var(--color-green-4)]"],
+		blue: ["[--menu-item-fg:var(--color-blue-11)]", "[--menu-item-highlight-bg:var(--color-blue-4)]"],
+		amber: ["[--menu-item-fg:var(--color-amber-11)]", "[--menu-item-highlight-bg:var(--color-amber-4)]"]
+	} },
+	defaultVariants: { colorScheme: menuItemDefaultVariants.colorScheme }
+});
+//#endregion
+export { menuItemDefaultVariants, menuItemVariants };
+
+//# sourceMappingURL=menu-item-variants.js.map

package/dist/components/overlays/menu/menu-item-variants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-item-variants.js","names":[],"sources":["../../../../src/components/overlays/menu/menu-item-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport type { ColorSchemeSemantic } from '#types';\n\nexport type MenuItemVariants = {\n  /**\n   * Cor do texto, do ícone e do realce. `red` marca a ação destrutiva (excluir, cancelar).\n   *\n   * @default 'gray'\n   */\n  colorScheme?: ColorSchemeSemantic;\n};\n\nexport const menuItemDefaultVariants: Required<MenuItemVariants> = {\n  colorScheme: 'gray',\n};\n\n/**\n * Cópia de `selectItemVariants`, a origem do item das listas em popup, onde o realce está\n * explicado (tabela no README de `collections`). As diferenças:\n * - `flex` em linha, sem a coluna do check: ícone, texto e atalho ficam lado a lado;\n * - o realce aparece também no toque: o menu fecha ao tocar no item, e não sobra realce preso;\n * - sem `size`: as medidas são as do `sm` do Select;\n * - `colorScheme`, abaixo.\n *\n * Cada `colorScheme` só declara `--menu-item-fg` (texto e ícone) e `--menu-item-highlight-bg`\n * (realce), que a base consome. Assim uma cor nova é só um par de variáveis.\n */\nexport const menuItemVariants = cva(\n  [\n    'flex',\n    'items-center',\n\n    'relative',\n\n    'rounded',\n\n    'cursor-default',\n    'select-none',\n    'outline-none',\n\n    'data-disabled:pointer-events-none',\n    'data-disabled:opacity-50',\n\n    'data-highlighted:z-0',\n    'data-highlighted:before:absolute',\n    'data-highlighted:before:inset-x-1',\n    'data-highlighted:before:inset-y-0',\n    'data-highlighted:before:z-[-1]',\n    'data-highlighted:before:rounded',\n    'data-highlighted:before:content-[\"\"]',\n    'data-highlighted:before:bg-(--menu-item-highlight-bg)',\n\n    'px-2.5',\n    'gap-2',\n    'py-1.25',\n\n    'pointer-coarse:py-2.5',\n\n    'text-sm',\n    'text-(--menu-item-fg)',\n  ],\n  {\n    variants: {\n      colorScheme: {\n        gray: [\n          '[--menu-item-fg:var(--color-gray-12)]',\n          '[--menu-item-highlight-bg:var(--color-gray-4)]',\n        ],\n        brand: [\n          '[--menu-item-fg:var(--color-brand-11)]',\n          '[--menu-item-highlight-bg:var(--color-brand-4)]',\n        ],\n        red: [\n          '[--menu-item-fg:var(--color-red-11)]',\n          '[--menu-item-highlight-bg:var(--color-red-4)]',\n        ],\n        green: [\n          '[--menu-item-fg:var(--color-green-11)]',\n          '[--menu-item-highlight-bg:var(--color-green-4)]',\n        ],\n        blue: [\n          '[--menu-item-fg:var(--color-blue-11)]',\n          '[--menu-item-highlight-bg:var(--color-blue-4)]',\n        ],\n        amber: [\n          '[--menu-item-fg:var(--color-amber-11)]',\n          '[--menu-item-highlight-bg:var(--color-amber-4)]',\n        ],\n      },\n    },\n    defaultVariants: {\n      colorScheme: menuItemDefaultVariants.colorScheme,\n    },\n  },\n);\n"],"mappings":";;AAYA,MAAa,0BAAsD,EACjE,aAAa,OACf;;;;;;;;;;;;AAaA,MAAa,mBAAmB,IAC9B;CACE;CACA;CAEA;CAEA;CAEA;CACA;CACA;CAEA;CACA;CAEA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CAEA;CACA;CACA;CAEA;CAEA;CACA;AACF,GACA;CACE,UAAU,EACR,aAAa;EACX,MAAM,CACJ,yCACA,gDACF;EACA,OAAO,CACL,0CACA,iDACF;EACA,KAAK,CACH,wCACA,+CACF;EACA,OAAO,CACL,0CACA,iDACF;EACA,MAAM,CACJ,yCACA,gDACF;EACA,OAAO,CACL,0CACA,iDACF;CACF,EACF;CACA,iBAAiB,EACf,aAAa,wBAAwB,YACvC;AACF,CACF"}

package/dist/components/overlays/menu/menu-item.d.ts

@@ -0,0 +1,20 @@
+import { MenuItemVariants } from "./menu-item-variants.js";
+import { MergeOverride } from "@lucasbernardosn/utils";
+import { Menu } from "@base-ui/react/menu";
+//#region src/components/overlays/menu/menu-item.d.ts
+export type MenuItemProps = MergeOverride<Menu.Item.Props, MenuItemVariants>;
+export type MenuItemState = Menu.Item.State;
+/**
+ * Ação do menu, com `role="menuitem"`. A ação vai no `onClick`, e o menu fecha em seguida
+ * (`closeOnClick={false}` o mantém aberto). O realce do item sob o ponteiro ou o teclado vem do
+ * `data-highlighted`.
+ *
+ * Ícone e atalho entram como filhos, em linha: um `Kbd` com `ms-auto` empurra o atalho para a
+ * direita. Para abrir um dialog, controle o `open` dele pelo `onClick` do item.
+ */
+export declare const MenuItem: {
+  (props: MenuItemProps): import("react").JSX.Element;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=menu-item.d.ts.map

package/dist/components/overlays/menu/menu-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-item.d.ts","names":["BaseMenu"],"sources":["../../../../src/components/overlays/menu/menu-item.tsx"],"mappings":";;;;YAKY,gBAAgB,cAC1BA,KAAS,KAAK,OACd;YAGU,gBAAgBA,KAAS,KAAK;;;;;;;;;qBAY7B;GAAmB,OAAA,gCAAa,IAAA"}

package/dist/components/overlays/menu/menu-item.js

@@ -0,0 +1,29 @@
+import { mergeStateClassNames } from "../../../utils/merge-state-class-names.js";
+import { menuItemVariants } from "./menu-item-variants.js";
+import { createSplitProps } from "@lucasbernardosn/utils";
+import { jsx } from "react/jsx-runtime";
+import { Menu } from "@base-ui/react/menu";
+//#region src/components/overlays/menu/menu-item.tsx
+const splitVariantProps = createSplitProps();
+/**
+* Ação do menu, com `role="menuitem"`. A ação vai no `onClick`, e o menu fecha em seguida
+* (`closeOnClick={false}` o mantém aberto). O realce do item sob o ponteiro ou o teclado vem do
+* `data-highlighted`.
+*
+* Ícone e atalho entram como filhos, em linha: um `Kbd` com `ms-auto` empurra o atalho para a
+* direita. Para abrir um dialog, controle o `open` dele pelo `onClick` do item.
+*/
+const MenuItem = (props) => {
+	const [variantProps, elementProps] = splitVariantProps(props, ["colorScheme"]);
+	const { className, ...rest } = elementProps;
+	return /* @__PURE__ */ jsx(Menu.Item, {
+		"data-component": "Menu.Item",
+		className: mergeStateClassNames(menuItemVariants(variantProps), className),
+		...rest
+	});
+};
+MenuItem.displayName = "Menu.Item";
+//#endregion
+export { MenuItem };
+
+//# sourceMappingURL=menu-item.js.map

package/dist/components/overlays/menu/menu-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-item.js","names":["BaseMenu"],"sources":["../../../../src/components/overlays/menu/menu-item.tsx"],"sourcesContent":["import { Menu as BaseMenu } from '@base-ui/react/menu';\nimport { createSplitProps, type MergeOverride } from '@lucasbernardosn/utils';\nimport { mergeStateClassNames } from '#utils';\nimport { type MenuItemVariants, menuItemVariants } from './menu-item-variants';\n\nexport type MenuItemProps = MergeOverride<\n  BaseMenu.Item.Props,\n  MenuItemVariants\n>;\n\nexport type MenuItemState = BaseMenu.Item.State;\n\nconst splitVariantProps = createSplitProps<MenuItemVariants>();\n\n/**\n * Ação do menu, com `role=\"menuitem\"`. A ação vai no `onClick`, e o menu fecha em seguida\n * (`closeOnClick={false}` o mantém aberto). O realce do item sob o ponteiro ou o teclado vem do\n * `data-highlighted`.\n *\n * Ícone e atalho entram como filhos, em linha: um `Kbd` com `ms-auto` empurra o atalho para a\n * direita. Para abrir um dialog, controle o `open` dele pelo `onClick` do item.\n */\nexport const MenuItem = (props: MenuItemProps) => {\n  const [variantProps, elementProps] = splitVariantProps(props, [\n    'colorScheme',\n  ]);\n\n  const { className, ...rest } = elementProps;\n\n  return (\n    <BaseMenu.Item\n      data-component=\"Menu.Item\"\n      className={mergeStateClassNames(\n        menuItemVariants(variantProps),\n        className,\n      )}\n      {...rest}\n    />\n  );\n};\n\nMenuItem.displayName = 'Menu.Item';\n"],"mappings":";;;;;;AAYA,MAAM,oBAAoB,iBAAmC;;;;;;;;;AAU7D,MAAa,YAAY,UAAyB;CAChD,MAAM,CAAC,cAAc,gBAAgB,kBAAkB,OAAO,CAC5D,aACF,CAAC;CAED,MAAM,EAAE,WAAW,GAAG,SAAS;CAE/B,OACE,oBAACA,KAAS,MAAV;EACE,kBAAe;EACf,WAAW,qBACT,iBAAiB,YAAY,GAC7B,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,cAAc"}