@usememos/ui 26.11.6 → 26.11.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import{Menu as
|
|
2
|
+
import{Menu as s}from"@base-ui/react/menu";import{Check as S,ChevronRight as B}from"lucide-react";import{createContext as N,forwardRef as m,useCallback as I,useContext as C,useId as L,useRef as G}from"react";import{cx as g,withClass as l}from"../../internal/class-name.js";import{splitPositioner as E}from"../../internal/popup.js";import{SizeContext as k,useRowSize as T}from"../../internal/size.js";import{menuClasses as h}from"./classes.js";import{Fragment as w,jsx as r,jsxs as x}from"react/jsx-runtime";var p=h(),R=N(!1);function F({size:a,...o}){let e=T(a);return r(k.Provider,{value:e,children:r(R.Provider,{value:!1,children:r(s.Root,{...o})})})}var q=m(function({className:o,...e},n){return r(s.Trigger,{ref:n,...e,className:l("mu-menu-trigger",o)})}),J=m(function({container:o,className:e,...n},t){let u=T(),i=C(R),c=G(null),d=I(f=>{c.current=f,typeof t=="function"?t(f):t&&(t.current=f)},[t]),P=I(()=>{let f=c.current;return f&&-parseFloat(getComputedStyle(f).paddingTop)||0},[]),[b,v]=E(n);return r(s.Portal,{container:o,children:r(s.Positioner,{sideOffset:4,alignOffset:i?P:0,...b,className:"mu-positioner",children:r(s.Popup,{ref:d,...v,className:l(h({size:u}).popup,e)})})})});function M({icon:a,shortcut:o,description:e,children:n}){let t=L(),u=e!=null&&e!==!1,i=r("span",{className:p.label,id:u?`${t}-label`:void 0,children:n}),c=x(w,{children:[a,u?x("span",{className:p.text,children:[i,r("span",{className:p.description,id:`${t}-description`,children:e})]}):i,o!==void 0?r("span",{className:p.shortcut,children:o}):null]}),d=u?{"aria-labelledby":`${t}-label`,"aria-describedby":`${t}-description`}:null;return[c,d]}var K=m(function({icon:o,shortcut:e,description:n,danger:t=!1,className:u,children:i,...c},d){let[P,b]=M({icon:o,shortcut:e,description:n,children:i});return r(s.Item,{ref:d,...b,...c,className:l(t?p.dangerItem:p.item,u),children:P})}),Q=m(function({icon:o,shortcut:e,description:n,className:t,children:u,...i},c){let[d,P]=M({icon:o,shortcut:e,description:n,children:u});return x(s.CheckboxItem,{ref:c,...P,...i,className:l(g(p.item,"mu-menu-checkbox-item"),t),children:[d,r("span",{className:"mu-menu-indicator",children:r(s.CheckboxItemIndicator,{render:r(S,{"aria-hidden":!0})})})]})}),U=m(function({className:o,...e},n){return r(s.RadioGroup,{ref:n,...e,className:l("mu-menu-radio-group",o)})}),V=m(function({icon:o,shortcut:e,description:n,className:t,children:u,...i},c){let[d,P]=M({icon:o,shortcut:e,description:n,children:u});return x(s.RadioItem,{ref:c,...P,...i,className:l(g(p.item,"mu-menu-radio-item"),t),children:[d,r("span",{className:"mu-menu-indicator",children:r(s.RadioItemIndicator,{render:r(S,{"aria-hidden":!0})})})]})}),W=m(function({className:o,...e},n){return r(s.Group,{ref:n,...e,className:l("mu-menu-group",o)})}),X=m(function({className:o,...e},n){return r(s.GroupLabel,{ref:n,...e,className:l(p.groupLabel,o)})}),Y=m(function({className:o,...e},n){return r(s.Separator,{ref:n,...e,className:l(p.separator,o)})});function Z(a){return r(R.Provider,{value:!0,children:r(s.SubmenuRoot,{...a})})}var _=m(function({icon:o,className:e,children:n,...t},u){let[i]=M({icon:o,children:n});return x(s.SubmenuTrigger,{ref:u,...t,className:l(g(p.item,"mu-menu-submenu-trigger"),e),children:[i,r(B,{className:"mu-menu-chevron","aria-hidden":!0})]})});export{Q as CheckboxItem,W as Group,X as GroupLabel,K as Item,J as Popup,U as RadioGroup,V as RadioItem,F as Root,Y as Separator,Z as SubmenuRoot,_ as SubmenuTrigger,q as Trigger};
|
|
3
3
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/menu/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import { Menu as BaseMenu } from '@base-ui/react/menu';\nimport { Check, ChevronRight } from 'lucide-react';\nimport { forwardRef, useId, type ReactNode } from 'react';\nimport { cx, withClass } from '../../internal/class-name';\nimport { splitPositioner } from '../../internal/popup';\nimport { SizeContext, useRowSize } from '../../internal/size';\nimport type { IconElement, Size } from '../../types';\nimport { menuClasses } from './classes';\n\nconst classes = /* @__PURE__ */ menuClasses();\n\nexport interface RootProps extends BaseMenu.Root.Props {\n /** Row height of every item: 24, 32 or 40px. */\n size?: Exclude<Size, 'xs'>;\n}\n\n/** Groups a trigger and its menu. */\nexport function Root({ size, ...props }: RootProps) {\n const resolved = useRowSize(size);\n return (\n <SizeContext.Provider value={resolved}>\n <BaseMenu.Root {...props} />\n </SizeContext.Provider>\n );\n}\n\nexport interface TriggerProps extends BaseMenu.Trigger.Props {}\n\n/** Opens the menu. Usually `render={<Button variant=\"ghost\" icon={<Ellipsis />} aria-label=\"More actions\" />}`. */\nexport const Trigger = forwardRef<HTMLButtonElement, TriggerProps>(function MenuTrigger({ className, ...props }, ref) {\n return <BaseMenu.Trigger ref={ref} {...props} className={withClass('mu-menu-trigger', className)} />;\n});\n\ntype PositionerProps = Pick<\n BaseMenu.Positioner.Props,\n 'side' | 'align' | 'collisionAvoidance' | 'collisionBoundary' | 'sticky' | 'anchor' | 'positionMethod' | 'disableAnchorTracking'\n>;\n\nexport interface PopupProps extends BaseMenu.Popup.Props, PositionerProps {\n /** Where the menu is portaled to. Default `document.body`. */\n container?: BaseMenu.Portal.Props['container'];\n}\n\n
|
|
5
|
-
"mappings": ";AAAA,OAAS,QAAQA,MAAgB,sBACjC,OAAS,SAAAC,EAAO,gBAAAC,MAAoB,eACpC,OAAS,cAAAC,EAAY,SAAAC,
|
|
6
|
-
"names": ["BaseMenu", "Check", "ChevronRight", "forwardRef", "useId", "cx", "withClass", "splitPositioner", "SizeContext", "useRowSize", "menuClasses", "Fragment", "jsx", "jsxs", "classes", "Root", "size", "props", "resolved", "Trigger", "className", "ref", "Popup", "container", "positioner", "rest", "useRow", "icon", "shortcut", "description", "children", "id", "hasDescription", "label", "content", "aria", "Item", "danger", "row", "CheckboxItem", "RadioGroup", "RadioItem", "Group", "GroupLabel", "Separator", "SubmenuRoot", "SubmenuTrigger"]
|
|
4
|
+
"sourcesContent": ["import { Menu as BaseMenu } from '@base-ui/react/menu';\nimport { Check, ChevronRight } from 'lucide-react';\nimport { createContext, forwardRef, useCallback, useContext, useId, useRef, type ReactNode } from 'react';\nimport { cx, withClass } from '../../internal/class-name';\nimport { splitPositioner } from '../../internal/popup';\nimport { SizeContext, useRowSize } from '../../internal/size';\nimport type { IconElement, Size } from '../../types';\nimport { menuClasses } from './classes';\n\nconst classes = /* @__PURE__ */ menuClasses();\n\nexport interface RootProps extends BaseMenu.Root.Props {\n /** Row height of every item: 24, 32 or 40px. */\n size?: Exclude<Size, 'xs'>;\n}\n\n/** True inside a SubmenuRoot, so its Popup lines up with the trigger row. */\nconst SubmenuContext = /* @__PURE__ */ createContext(false);\n\n/** Groups a trigger and its menu. */\nexport function Root({ size, ...props }: RootProps) {\n const resolved = useRowSize(size);\n return (\n <SizeContext.Provider value={resolved}>\n <SubmenuContext.Provider value={false}>\n <BaseMenu.Root {...props} />\n </SubmenuContext.Provider>\n </SizeContext.Provider>\n );\n}\n\nexport interface TriggerProps extends BaseMenu.Trigger.Props {}\n\n/** Opens the menu. Usually `render={<Button variant=\"ghost\" icon={<Ellipsis />} aria-label=\"More actions\" />}`. */\nexport const Trigger = forwardRef<HTMLButtonElement, TriggerProps>(function MenuTrigger({ className, ...props }, ref) {\n return <BaseMenu.Trigger ref={ref} {...props} className={withClass('mu-menu-trigger', className)} />;\n});\n\ntype PositionerProps = Pick<\n BaseMenu.Positioner.Props,\n 'side' | 'align' | 'collisionAvoidance' | 'collisionBoundary' | 'sticky' | 'anchor' | 'positionMethod' | 'disableAnchorTracking'\n>;\n\nexport interface PopupProps extends BaseMenu.Popup.Props, PositionerProps {\n /** Where the menu is portaled to. Default `document.body`. */\n container?: BaseMenu.Portal.Props['container'];\n}\n\n/**\n * The list of items. Also the popup of a submenu, inside `SubmenuRoot`: there\n * it moves along the trigger by its own top padding (read when it is placed,\n * so it follows `space-1`), which lines its first row up with the trigger row,\n * or its last row when it opens upward.\n */\nexport const Popup = forwardRef<HTMLDivElement, PopupProps>(function MenuPopup({ container, className, ...props }, ref) {\n const size = useRowSize();\n const submenu = useContext(SubmenuContext);\n const popupRef = useRef<HTMLDivElement | null>(null);\n const setRef = useCallback(\n (node: HTMLDivElement | null) => {\n popupRef.current = node;\n if (typeof ref === 'function') ref(node);\n else if (ref) ref.current = node;\n },\n [ref],\n );\n // Base UI reverses the sign when the submenu aligns to the trigger's end, so one value serves both.\n const alignOffset = useCallback(() => {\n const popup = popupRef.current;\n return popup ? -parseFloat(getComputedStyle(popup).paddingTop) || 0 : 0;\n }, []);\n const [positioner, rest] = splitPositioner(props);\n return (\n <BaseMenu.Portal container={container}>\n <BaseMenu.Positioner sideOffset={4} alignOffset={submenu ? alignOffset : 0} {...positioner} className=\"mu-positioner\">\n <BaseMenu.Popup ref={setRef} {...rest} className={withClass(menuClasses({ size }).popup, className)} />\n </BaseMenu.Positioner>\n </BaseMenu.Portal>\n );\n});\n\ninterface RowProps {\n /** A Lucide element before the label. */\n icon?: IconElement;\n /** A keyboard shortcut at the end of the row, such as \"\u2318 D\". */\n shortcut?: ReactNode;\n /** A line of `ink-muted` text under the label, which makes the row two lines tall. Screen readers read it as the item's description. */\n description?: ReactNode;\n children?: ReactNode;\n}\n\n/**\n * The shared inside of every row: icon, label, shortcut. With a description,\n * the label and description stack, and the item is named by the label and\n * described by the description.\n */\nfunction useRow({ icon, shortcut, description, children }: RowProps) {\n const id = useId();\n const hasDescription = description !== undefined && description !== null && description !== false;\n const label = <span className={classes.label} id={hasDescription ? `${id}-label` : undefined}>{children}</span>;\n const content = (\n <>\n {icon}\n {hasDescription ? (\n <span className={classes.text}>\n {label}\n <span className={classes.description} id={`${id}-description`}>{description}</span>\n </span>\n ) : (\n label\n )}\n {shortcut !== undefined ? <span className={classes.shortcut}>{shortcut}</span> : null}\n </>\n );\n const aria = hasDescription ? { 'aria-labelledby': `${id}-label`, 'aria-describedby': `${id}-description` } : null;\n return [content, aria] as const;\n}\n\nexport interface ItemProps extends BaseMenu.Item.Props, RowProps {\n /** A destructive action: red text. Put it last, after a Separator. */\n danger?: boolean;\n}\n\n/** One action. */\nexport const Item = forwardRef<HTMLDivElement, ItemProps>(function MenuItem({ icon, shortcut, description, danger = false, className, children, ...props }, ref) {\n const [row, aria] = useRow({ icon, shortcut, description, children });\n return (\n <BaseMenu.Item ref={ref} {...aria} {...props} className={withClass(danger ? classes.dangerItem : classes.item, className)}>\n {row}\n </BaseMenu.Item>\n );\n});\n\nexport interface CheckboxItemProps extends BaseMenu.CheckboxItem.Props, RowProps {}\n\n/** An option that turns on or off, with a check at the end. Stays open on click. */\nexport const CheckboxItem = forwardRef<HTMLDivElement, CheckboxItemProps>(function MenuCheckboxItem({ icon, shortcut, description, className, children, ...props }, ref) {\n const [row, aria] = useRow({ icon, shortcut, description, children });\n return (\n <BaseMenu.CheckboxItem ref={ref} {...aria} {...props} className={withClass(cx(classes.item, 'mu-menu-checkbox-item'), className)}>\n {row}\n <span className=\"mu-menu-indicator\">\n <BaseMenu.CheckboxItemIndicator render={<Check aria-hidden />} />\n </span>\n </BaseMenu.CheckboxItem>\n );\n});\n\nexport interface RadioGroupProps extends BaseMenu.RadioGroup.Props {}\n\n/** Groups RadioItems: exactly one is chosen. */\nexport const RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps>(function MenuRadioGroup({ className, ...props }, ref) {\n return <BaseMenu.RadioGroup ref={ref} {...props} className={withClass('mu-menu-radio-group', className)} />;\n});\n\nexport interface RadioItemProps extends BaseMenu.RadioItem.Props, RowProps {}\n\n/** One choice in a RadioGroup, with a check at the end when chosen. Stays open on click. */\nexport const RadioItem = forwardRef<HTMLDivElement, RadioItemProps>(function MenuRadioItem({ icon, shortcut, description, className, children, ...props }, ref) {\n const [row, aria] = useRow({ icon, shortcut, description, children });\n return (\n <BaseMenu.RadioItem ref={ref} {...aria} {...props} className={withClass(cx(classes.item, 'mu-menu-radio-item'), className)}>\n {row}\n <span className=\"mu-menu-indicator\">\n <BaseMenu.RadioItemIndicator render={<Check aria-hidden />} />\n </span>\n </BaseMenu.RadioItem>\n );\n});\n\nexport interface GroupProps extends BaseMenu.Group.Props {}\n\n/** A labeled set of items. */\nexport const Group = forwardRef<HTMLDivElement, GroupProps>(function MenuGroup({ className, ...props }, ref) {\n return <BaseMenu.Group ref={ref} {...props} className={withClass('mu-menu-group', className)} />;\n});\n\nexport interface GroupLabelProps extends BaseMenu.GroupLabel.Props {}\n\n/** The name of a Group or RadioGroup. */\nexport const GroupLabel = forwardRef<HTMLDivElement, GroupLabelProps>(function MenuGroupLabel({ className, ...props }, ref) {\n return <BaseMenu.GroupLabel ref={ref} {...props} className={withClass(classes.groupLabel, className)} />;\n});\n\nexport interface SeparatorProps extends BaseMenu.Separator.Props {}\n\n/** A line between groups of items. */\nexport const Separator = forwardRef<HTMLDivElement, SeparatorProps>(function MenuSeparator({ className, ...props }, ref) {\n return <BaseMenu.Separator ref={ref} {...props} className={withClass(classes.separator, className)} />;\n});\n\nexport type SubmenuRootProps = BaseMenu.SubmenuRoot.Props;\n\n/** Holds a SubmenuTrigger and its own Popup. */\nexport function SubmenuRoot(props: SubmenuRootProps) {\n return (\n <SubmenuContext.Provider value={true}>\n <BaseMenu.SubmenuRoot {...props} />\n </SubmenuContext.Provider>\n );\n}\n\nexport interface SubmenuTriggerProps extends BaseMenu.SubmenuTrigger.Props {\n icon?: IconElement;\n children?: ReactNode;\n}\n\n/** The row that opens a submenu, with a chevron at the end. */\nexport const SubmenuTrigger = forwardRef<HTMLDivElement, SubmenuTriggerProps>(function MenuSubmenuTrigger({ icon, className, children, ...props }, ref) {\n const [row] = useRow({ icon, children });\n return (\n <BaseMenu.SubmenuTrigger ref={ref} {...props} className={withClass(cx(classes.item, 'mu-menu-submenu-trigger'), className)}>\n {row}\n <ChevronRight className=\"mu-menu-chevron\" aria-hidden />\n </BaseMenu.SubmenuTrigger>\n );\n});\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["BaseMenu", "Check", "ChevronRight", "createContext", "forwardRef", "useCallback", "useContext", "useId", "useRef", "cx", "withClass", "splitPositioner", "SizeContext", "useRowSize", "menuClasses", "Fragment", "jsx", "jsxs", "classes", "SubmenuContext", "Root", "size", "props", "resolved", "Trigger", "className", "ref", "Popup", "container", "submenu", "popupRef", "setRef", "node", "alignOffset", "popup", "positioner", "rest", "useRow", "icon", "shortcut", "description", "children", "id", "hasDescription", "label", "content", "aria", "Item", "danger", "row", "CheckboxItem", "RadioGroup", "RadioItem", "Group", "GroupLabel", "Separator", "SubmenuRoot", "SubmenuTrigger"]
|
|
7
7
|
}
|
|
@@ -16,7 +16,12 @@ export interface PopupProps extends BaseMenu.Popup.Props, PositionerProps {
|
|
|
16
16
|
/** Where the menu is portaled to. Default `document.body`. */
|
|
17
17
|
container?: BaseMenu.Portal.Props['container'];
|
|
18
18
|
}
|
|
19
|
-
/**
|
|
19
|
+
/**
|
|
20
|
+
* The list of items. Also the popup of a submenu, inside `SubmenuRoot`: there
|
|
21
|
+
* it moves along the trigger by its own top padding (read when it is placed,
|
|
22
|
+
* so it follows `space-1`), which lines its first row up with the trigger row,
|
|
23
|
+
* or its last row when it opens upward.
|
|
24
|
+
*/
|
|
20
25
|
export declare const Popup: import("react").ForwardRefExoticComponent<Omit<PopupProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
21
26
|
interface RowProps {
|
|
22
27
|
/** A Lucide element before the label. */
|
|
@@ -59,7 +64,7 @@ export interface SeparatorProps extends BaseMenu.Separator.Props {
|
|
|
59
64
|
export declare const Separator: import("react").ForwardRefExoticComponent<Omit<SeparatorProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
60
65
|
export type SubmenuRootProps = BaseMenu.SubmenuRoot.Props;
|
|
61
66
|
/** Holds a SubmenuTrigger and its own Popup. */
|
|
62
|
-
export declare
|
|
67
|
+
export declare function SubmenuRoot(props: SubmenuRootProps): import("react/jsx-runtime").JSX.Element;
|
|
63
68
|
export interface SubmenuTriggerProps extends BaseMenu.SubmenuTrigger.Props {
|
|
64
69
|
icon?: IconElement;
|
|
65
70
|
children?: ReactNode;
|
package/llms-full.txt
CHANGED
|
@@ -876,6 +876,7 @@ Base UI's props pass through: `open`, `defaultOpen`, `onOpenChange`, `modal` on
|
|
|
876
876
|
- The highlighted row uses `hover`. Disabled rows fade to 45%. `danger` rows use `danger`.
|
|
877
877
|
- A ghost trigger keeps its `hover` background while the menu is open.
|
|
878
878
|
- Fades in and rises `space-1` over `duration-fade`; no rise under reduced motion.
|
|
879
|
+
- A submenu opens beside its trigger row, 4px from the row. The row sits `space-1` inside the parent menu, so the submenu's edge touches the parent's edge. The submenu moves up by its own top padding (`space-1`, read when it is placed), so its first row lines up with the trigger row. With no room below, it opens upward instead and its last row lines up with the trigger row.
|
|
879
880
|
|
|
880
881
|
<!-- docs/components/link.md -->
|
|
881
882
|
|