@radui/ui 0.5.0 → 0.6.0
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.
- package/README.md +2 -0
- package/dist/components/Accordion.d.ts +19 -33
- package/dist/components/Accordion.js +1 -1
- package/dist/components/AlertDialog.d.ts +2 -0
- package/dist/components/AlertDialog.js +1 -1
- package/dist/components/AspectRatio.d.ts +2 -2
- package/dist/components/AspectRatio.js +1 -1
- package/dist/components/Avatar.js +1 -1
- package/dist/components/AvatarGroup.js +1 -1
- package/dist/components/{AvatarPrimitiveFallback-BOYawMc9.js → AvatarPrimitiveFallback-B1u295x6.js} +1 -1
- package/dist/components/Breadcrumb.d.ts +70 -0
- package/dist/components/Breadcrumb.js +1 -0
- package/dist/components/Button.js +1 -1
- package/dist/components/Callout.js +1 -1
- package/dist/components/Checkbox.js +1 -1
- package/dist/components/CheckboxCards.js +1 -1
- package/dist/components/CheckboxGroup.js +1 -1
- package/dist/components/{CheckboxGroupPrimitive-Cd8ra39e.js → CheckboxGroupPrimitive-BWGRST9p.js} +1 -1
- package/dist/components/Code.js +1 -1
- package/dist/components/Collapsible.js +1 -1
- package/dist/components/Combobox.js +1 -1
- package/dist/components/ComboboxPrimitive-C2sksm48.js +1 -0
- package/dist/components/Command.d.ts +1 -0
- package/dist/components/Command.js +1 -1
- package/dist/components/ContextMenu.d.ts +6 -6
- package/dist/components/ContextMenu.js +1 -1
- package/dist/components/Dialog.d.ts +1 -0
- package/dist/components/Dialog.js +1 -1
- package/dist/components/Disclosure.d.ts +2 -0
- package/dist/components/Disclosure.js +1 -1
- package/dist/components/Drawer.d.ts +94 -16
- package/dist/components/Drawer.js +1 -1
- package/dist/components/DropdownMenu.d.ts +6 -6
- package/dist/components/DropdownMenu.js +1 -1
- package/dist/components/Fieldset.d.ts +43 -0
- package/dist/components/Fieldset.js +1 -0
- package/dist/components/HoverCard.js +1 -1
- package/dist/components/Link.js +1 -1
- package/dist/components/LiveRegion.d.ts +73 -0
- package/dist/components/LiveRegion.js +1 -0
- package/dist/components/MenuPrimitive-COEgTo6S.js +1 -0
- package/dist/components/Menubar.d.ts +6 -6
- package/dist/components/Menubar.js +1 -1
- package/dist/components/Minimap.js +1 -1
- package/dist/components/NavigationMenu.d.ts +3 -0
- package/dist/components/NavigationMenu.js +1 -1
- package/dist/components/NumberField.js +1 -1
- package/dist/components/Popover.d.ts +68 -0
- package/dist/components/Popover.js +1 -0
- package/dist/components/Progress.js +1 -1
- package/dist/components/Quote.js +1 -1
- package/dist/components/Radio.js +1 -1
- package/dist/components/RadioCards.js +1 -1
- package/dist/components/RadioGroup.js +1 -1
- package/dist/components/{RadioGroupPrimitive-CcvI-_wm.js → RadioGroupPrimitive-BWUU-0Qh.js} +1 -1
- package/dist/components/ScrollArea.d.ts +15 -3
- package/dist/components/ScrollArea.js +1 -1
- package/dist/components/Select.js +1 -1
- package/dist/components/Separator.js +1 -1
- package/dist/components/Slider.d.ts +1 -1
- package/dist/components/Slider.js +1 -1
- package/dist/components/Spinner.js +1 -1
- package/dist/components/Splitter.js +1 -1
- package/dist/components/Steps.js +1 -1
- package/dist/components/Switch.js +1 -1
- package/dist/components/TabNav.js +1 -1
- package/dist/components/Table.d.ts +65 -19
- package/dist/components/Table.js +1 -1
- package/dist/components/Tabs.d.ts +2 -0
- package/dist/components/Tabs.js +1 -1
- package/dist/components/TextArea.js +1 -1
- package/dist/components/TextField.js +1 -1
- package/dist/components/Toast.d.ts +322 -0
- package/dist/components/Toast.js +1 -0
- package/dist/components/Toggle.js +1 -1
- package/dist/components/ToggleGroup.js +1 -1
- package/dist/components/Toolbar.js +1 -1
- package/dist/components/Tooltip.js +1 -1
- package/dist/components/Tree.d.ts +1 -0
- package/dist/components/Tree.js +1 -1
- package/dist/components/VisuallyHidden.js +1 -1
- package/dist/components/documentOverlayOpen-coyGmcyL.js +1 -0
- package/dist/components/index-C09ZQH_q.js +1 -0
- package/dist/components/index-CD_nZA9X.js +1 -0
- package/dist/components/{index-gM8bbyw1.js → index-CfC8-kd8.js} +1 -1
- package/dist/components/index-UODM4mVT.js +1 -0
- package/dist/components/index-XF8itt-H.js +1 -0
- package/dist/components/index-YhJvxumL.js +1 -0
- package/dist/components/index-m8Mhi26u.js +1 -0
- package/dist/components/keyboard-BKF7hXqL.js +1 -0
- package/dist/components/mergeProps-0RucjqeH.js +1 -0
- package/dist/themes/baremetal.css +1 -0
- package/dist/themes/default.css +1 -0
- package/dist/themes/tailwind-presets/default.css +396 -0
- package/package.json +65 -23
- package/dist/components/ComboboxPrimitive-BhHSrtiY.js +0 -1
- package/dist/components/MenuPrimitive-wJbEC-gM.js +0 -1
- package/dist/components/index-BbEsAodL.js +0 -1
- package/dist/components/index-DOVR6Rd5.js +0 -1
- package/dist/components/index-DU_6Msfu.js +0 -1
- package/dist/components/index-Ir5FYyWW.js +0 -1
- package/dist/components/index-m6qHOeQ9.js +0 -1
- package/dist/components/mergeProps-B9ocQsG4.js +0 -1
- package/dist/themes/tailwind-presets/default.js +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
'use client';import e,{forwardRef as t}from"react";import{jsx as n}from"react/jsx-runtime";import{M as o,a as s}from"./MenuPrimitive-
|
|
1
|
+
'use client';import e,{forwardRef as t}from"react";import{jsx as n}from"react/jsx-runtime";import{M as o,a as s}from"./MenuPrimitive-COEgTo6S.js";import{u as r}from"./useComponentClass-QwNivz0h.js";import{c as a}from"./clsx-BaVHROc5.js";import{u as i}from"./index-wRElCyvx.js";import{a as u}from"./keyboard-BKF7hXqL.js";import{u as l}from"./floating-ui.react-Byzse64h.js";import{c}from"./index-eAZUMNef.js";import m from"./Separator.js";import"./index-Db-tduwt.js";import"./index-UODM4mVT.js";import"./documentOverlayOpen-coyGmcyL.js";import"./index-XF8itt-H.js";import"./mergeProps-0RucjqeH.js";import"./index-CfC8-kd8.js";import"./ThemeContext-Sm-iNANd.js";import"react-dom";const d=e.createContext(null),C="ContextMenu",p=t((({children:e,customRootClass:t,className:s,open:u,defaultOpen:l=!1,onOpenChange:c,variant:m,size:p,...x},h)=>{const[f,g]=i(u,l,c),M=r(t,C);return n(d.Provider,{value:{rootClass:M,setIsOpen:g,variant:m,size:p},children:n(o.Root,{ref:h,className:a(M&&`${M}-root`,s),open:f,onOpenChange:g,...x,children:e})})}));p.displayName=C;const x=t((({children:t,className:r,...i},c)=>{const m=e.useContext(d),C=e.useContext(s),p=e.useRef(null),x=l([p,c]);if(!m)return console.warn("ContextMenuTrigger should be used in the ContextMenuRoot"),null;const{rootClass:h,setIsOpen:f}=m,g=(e,t)=>{C?.refs.setPositionReference({getBoundingClientRect:()=>({width:0,height:0,x:e,y:t,top:t,left:e,right:e,bottom:t,toJSON(){return this}})}),f(!0)};return n(o.Trigger,{className:a(h&&`${h}-trigger`,r),asChild:!0,...i,children:n("span",{ref:x,onContextMenu:e=>{e.preventDefault(),g(e.clientX,e.clientY)},onKeyDown:e=>{if(u(e.key,e.shiftKey)){if(e.preventDefault(),!p.current)return;const t=p.current.getBoundingClientRect();g(t.left+t.width/2,t.top+t.height/2)}},onClick:e=>{e.preventDefault(),f(!1)},role:"button",tabIndex:0,"aria-haspopup":"menu",children:t})})}));x.displayName="ContextMenuTrigger";const h=t((({children:t,className:s,variant:r,size:i,...u},l)=>{const m=e.useContext(d);if(!m)return console.warn("ContextMenuContent should be used in the ContextMenuRoot"),null;const{rootClass:C}=m,p=r??m.variant,x=i??m.size,h=c("context-menu-content",{variant:p,size:x});return n(o.Content,{ref:l,className:a(C&&`${C}-content`,s),...h,...u,children:t})}));h.displayName="ContextMenuContent";const f=t((({children:t,...s},r)=>{const a=e.useContext(d);if(!a)return console.warn("ContextMenuPortal should be used in the ContextMenuRoot"),null;const{rootClass:i}=a;return n(o.Portal,{ref:r,...s,children:t})}));f.displayName="ContextMenuPortal";const g=t((({children:t,className:s,label:r,...i},u)=>{const l=e.useContext(d);if(!l)return console.warn("ContextMenuItem should be used in the ContextMenuRoot"),null;const{rootClass:c}=l;return n(o.Item,{ref:u,className:a(c&&`${c}-item`,s),label:r,...i,children:t})}));g.displayName="ContextMenuItem";const M=t((({children:t,className:s,...r},i)=>{const u=e.useContext(d);if(!u)return console.warn("ContextMenuSub should be used in the ContextMenuRoot"),null;const{rootClass:l}=u;return n(o.Sub,{ref:i,className:a(l&&`${l}-sub`,s),...r,children:t})}));M.displayName="ContextMenuSub";const N=t((({children:t,className:s,...r},i)=>{const u=e.useContext(d);if(!u)return console.warn("ContextMenuSubTrigger should be used in the ContextMenuRoot"),null;const{rootClass:l}=u;return n(o.Trigger,{ref:i,className:a(l&&`${l}-sub-trigger`,s),...r,children:t})}));N.displayName="ContextMenuSubTrigger";const b=t((({className:t,...o},s)=>{const r=e.useContext(d);if(!r)return console.warn("ContextMenuSeparator should be used within ContextMenuRoot"),null;const{rootClass:a}=r;return n(m,{ref:s,customRootClass:a,className:t,...o})}));b.displayName="ContextMenuSeparator";const j=t(((e,t)=>(console.warn("Direct usage of ContextMenu is not supported. Please use ContextMenu.Root, ContextMenu.Item instead."),null)));j.displayName="ContextMenu",j.Root=p,j.Trigger=x,j.Content=h,j.Portal=f,j.Item=g,j.Sub=M,j.SubTrigger=N,j.Separator=b;export{j as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
'use client';import{createContext as s,forwardRef as e,useContext as o}from"react";import{jsx as
|
|
1
|
+
'use client';import{createContext as s,forwardRef as e,useContext as o}from"react";import{jsx as r}from"react/jsx-runtime";import{D as a}from"./index-CD_nZA9X.js";import{c as t}from"./clsx-BaVHROc5.js";import{u as l}from"./useComponentClass-QwNivz0h.js";import{P as i}from"./index-XF8itt-H.js";import"./index-Db-tduwt.js";import"./floating-ui.react-Byzse64h.js";import"react-dom";import"./index-wRElCyvx.js";import"./index-UODM4mVT.js";import"./documentOverlayOpen-coyGmcyL.js";import"./index-CfC8-kd8.js";import"./ThemeContext-Sm-iNANd.js";import"./mergeProps-0RucjqeH.js";const n=s({rootClass:""}),c="Dialog",m=e((({children:s,customRootClass:e="",className:o="",...i},m)=>{const d=l(e,c),p={rootClass:d};return r(a.Root,{ref:m,className:t(d,o),...i,children:r(n.Provider,{value:p,children:s})})}));m.displayName=c;const d=e((({children:s,asChild:e,className:l="",...i},c)=>{const{rootClass:m}=o(n);return r(a.Trigger,{ref:c,className:t(m&&`${m}-trigger`,l),asChild:e,...i,children:s})}));d.displayName="DialogTrigger";const p=e((({children:s,...e},o)=>r(a.Portal,{...e,children:s})));p.displayName="DialogPortal";const N=e((({className:s="",...e},l)=>{const{rootClass:i}=o(n);return r(a.Overlay,{ref:l,className:t(i&&`${i}-overlay`,s),...e})}));N.displayName="DialogOverlay";const g=e((({children:s,className:e="",...l},i)=>{const{rootClass:c}=o(n);return r(a.Content,{ref:i,className:t(c&&`${c}-content`,e),...l,children:s})}));g.displayName="DialogContent";const C=e((({children:s,className:e="",...a},l)=>{const{rootClass:c}=o(n);return r(i.h2,{ref:l,className:t(c&&`${c}-title`,e),...a,children:s})}));C.displayName="DialogTitle";const h=e((({children:s,className:e="",...a},l)=>{const{rootClass:c}=o(n);return r(i.p,{ref:l,className:t(c&&`${c}-description`,e),...a,children:s})}));h.displayName="DialogDescription";const u=e((({children:s,asChild:e,className:l="",...i},c)=>{const{rootClass:m}=o(n);return r(a.Cancel,{ref:c,className:t(m&&`${m}-close`,l),asChild:e,...i,children:s})}));u.displayName="DialogClose";const f=e((({children:s,className:e="",...l},i)=>{const{rootClass:c}=o(n);return r(a.Footer,{ref:i,className:t(c&&`${c}-footer`,e),...l,children:s})}));f.displayName="DialogFooter";const D=e(((s,e)=>(console.warn("Direct usage of Dialog is not supported. Please use Dialog.Root, Dialog.Content, etc. instead."),null)));D.displayName="Dialog";const y=D;y.Root=m,y.Trigger=d,y.Portal=p,y.Overlay=N,y.Content=g,y.Title=C,y.Description=h,y.Footer=f,y.Close=u;export{y as default};
|
|
@@ -3,10 +3,12 @@ import React from 'react';
|
|
|
3
3
|
type DisclosureRootProps = React.ComponentPropsWithoutRef<'div'> & {
|
|
4
4
|
customRootClass?: string;
|
|
5
5
|
defaultOpen?: number | null;
|
|
6
|
+
loop?: boolean;
|
|
6
7
|
};
|
|
7
8
|
declare const DisclosureRoot: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
8
9
|
customRootClass?: string;
|
|
9
10
|
defaultOpen?: number | null;
|
|
11
|
+
loop?: boolean;
|
|
10
12
|
} & React.RefAttributes<HTMLDivElement>>;
|
|
11
13
|
|
|
12
14
|
type DisclosureItemProps = React.ComponentPropsWithoutRef<'div'> & {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
'use client';import{jsx as e,jsxs as r}from"react/jsx-runtime";import t,{createContext as o,useRef as s,useState as
|
|
1
|
+
'use client';import{jsx as e,jsxs as r}from"react/jsx-runtime";import t,{createContext as o,useRef as s,useState as a,useCallback as i,useContext as l,useEffect as n,useId as c}from"react";import{u as d}from"./useComponentClass-QwNivz0h.js";import{c as m}from"./clsx-BaVHROc5.js";import{R as u}from"./index-m8Mhi26u.js";import{C as p}from"./index-YhJvxumL.js";import"./ThemeContext-Sm-iNANd.js";import"./index-XF8itt-H.js";import"./mergeProps-0RucjqeH.js";import"./index-CfC8-kd8.js";import"./keyboard-BKF7hXqL.js";import"./mergeRefs-B8eZ_q-T.js";import"./index-wRElCyvx.js";const f=o({}),h=t.forwardRef((({children:r,className:t,customRootClass:o,defaultOpen:l=null,"aria-label":n,loop:c=!0,...p},h)=>{const g=s(null),C=d(o,"Disclosure"),[v,N]=a(l),R=i((e=>{g.current=e,"function"==typeof h?h(e):h&&(h.current=e)}),[h]);return e(f.Provider,{value:{rootClass:C,activeItem:v,setActiveItem:N,disclosureRef:g},children:e(u.Root,{loop:c,children:e(u.Group,{className:m(C&&`${C}-root`),children:e("div",{...p,className:m(C&&`${C}-root`,t),ref:R,role:"region","aria-label":n,"data-slot":"disclosure-root","data-testid":"disclosure-root",children:r})})})})}));h.displayName="DisclosureRoot";const g=o({}),C=t.forwardRef((({children:r,className:t="",value:o,...s},i)=>{const{activeItem:d,rootClass:u}=l(f),[h,C]=a(o),[v,N]=a(d===o);n((()=>{N(d===h)}),[d,h]);const R=c();return e(g.Provider,{value:{itemValue:h,setItemValue:C},children:e(p.Root,{open:v,onOpenChange:N,asChild:!0,children:e("div",{...s,className:m(u&&`${u}-item`,t),ref:i,"data-state":v?"open":"closed","data-slot":"disclosure-item",id:`disclosure-data-item-${R}`,role:"region","aria-labelledby":`disclosure-trigger-${R}`,children:r})})})}));C.displayName="DisclosureItem";const v=t.forwardRef((({children:r,className:t,onClick:o,...s},a)=>{const{activeItem:i,setActiveItem:n,rootClass:c}=l(f),{itemValue:d}=l(g);return e(u.Item,{children:e(p.Trigger,{asChild:!0,children:e("button",{...s,ref:a,type:"button",className:m(c&&`${c}-trigger`,t),onClick:e=>{i===d?n(null):i!==d&&n(d),o&&o(e)},"data-state":i===d?"open":"closed","data-slot":"disclosure-trigger","aria-expanded":i===d,"aria-haspopup":"true",children:r})})})}));v.displayName="DisclosureTrigger";const N=t.forwardRef((({children:r,className:t="",...o},s)=>{const{activeItem:a,rootClass:i}=l(f),{itemValue:n}=l(g);return n!==a?null:e(p.Content,{...o,ref:s,className:m(i&&`${i}-content`,t),"data-state":"open","data-slot":"disclosure-content",role:"region","aria-hidden":a!==n,children:r})}));N.displayName="DisclosureContent";const R=t.forwardRef((({items:t,...o},s)=>e(h,{ref:s,...o,children:t.map(((t,o)=>r(C,{value:o,children:[e(v,{children:t.title}),e(N,{children:t.content})]},o)))})));R.Root=h,R.Item=C,R.Trigger=v,R.Content=N,R.displayName="Disclosure";export{R as default};
|
|
@@ -3,10 +3,27 @@ import DialogPrimitive from '~/core/primitives/Dialog';
|
|
|
3
3
|
import Primitive from '~/core/primitives/Primitive';
|
|
4
4
|
|
|
5
5
|
type DrawerSnapPoint = number | string;
|
|
6
|
+
|
|
6
7
|
type DrawerRootActions = {
|
|
7
8
|
close: () => void;
|
|
8
9
|
unmount: () => void;
|
|
9
10
|
};
|
|
11
|
+
type DrawerChangeReason = 'trigger-press' | 'outside-press' | 'escape-key' | 'close-press' | 'imperative-action' | 'swipe' | 'none';
|
|
12
|
+
type DrawerOpenChangeEventDetails = {
|
|
13
|
+
/** The reason the drawer was asked to open or close. */
|
|
14
|
+
reason: DrawerChangeReason;
|
|
15
|
+
/** Vetoes the pending open state change. */
|
|
16
|
+
cancel: () => void;
|
|
17
|
+
/** True once `cancel` has been called. */
|
|
18
|
+
isCanceled: boolean;
|
|
19
|
+
/**
|
|
20
|
+
* Keeps the drawer mounted through this close, for externally controlled
|
|
21
|
+
* close animations. Release it with `actionsRef.current.unmount()`.
|
|
22
|
+
*/
|
|
23
|
+
preventUnmountOnClose: () => void;
|
|
24
|
+
/** The DOM event behind the request, when there was one. */
|
|
25
|
+
event?: Event;
|
|
26
|
+
};
|
|
10
27
|
|
|
11
28
|
type DrawerRootProps = {
|
|
12
29
|
children?: React.ReactNode;
|
|
@@ -16,22 +33,32 @@ type DrawerRootProps = {
|
|
|
16
33
|
defaultOpen?: boolean;
|
|
17
34
|
/** Controlled open state. */
|
|
18
35
|
open?: boolean;
|
|
19
|
-
/**
|
|
20
|
-
|
|
21
|
-
|
|
36
|
+
/**
|
|
37
|
+
* Called when the drawer requests an open state change.
|
|
38
|
+
*
|
|
39
|
+
* Call `eventDetails.cancel()` to veto the change, which is how you show a
|
|
40
|
+
* "discard your changes?" confirmation before the drawer closes. The second
|
|
41
|
+
* argument carries the `reason` so you can react to the source of the request.
|
|
42
|
+
*/
|
|
43
|
+
onOpenChange?: (open: boolean, eventDetails: DrawerOpenChangeEventDetails) => void;
|
|
44
|
+
/** Called once the open or close animation has fully completed. */
|
|
22
45
|
onOpenChangeComplete?: (open: boolean) => void;
|
|
23
46
|
/**
|
|
24
|
-
*
|
|
25
|
-
*
|
|
47
|
+
* Resting heights for a vertical drawer. Numbers between 0 and 1 are
|
|
48
|
+
* fractions of the viewport height, numbers above 1 are pixels, and strings
|
|
49
|
+
* accept `px` and `rem` (for example `'148px'` or `'30rem'`).
|
|
26
50
|
*/
|
|
27
51
|
snapPoints?: DrawerSnapPoint[];
|
|
28
|
-
/** Initial snap point when uncontrolled. */
|
|
52
|
+
/** Initial snap point when uncontrolled. Defaults to the first snap point. */
|
|
29
53
|
defaultSnapPoint?: DrawerSnapPoint | null;
|
|
30
|
-
/** Controlled active snap point. */
|
|
54
|
+
/** Controlled active snap point. `null` means fully expanded. */
|
|
31
55
|
snapPoint?: DrawerSnapPoint | null;
|
|
32
56
|
/** Called when the active snap point changes. */
|
|
33
57
|
onSnapPointChange?: (snapPoint: DrawerSnapPoint | null) => void;
|
|
34
|
-
/**
|
|
58
|
+
/**
|
|
59
|
+
* Disables velocity-based snap skipping, so the resting point is decided by
|
|
60
|
+
* drag distance alone. You can still drag past several points.
|
|
61
|
+
*/
|
|
35
62
|
snapToSequentialPoints?: boolean;
|
|
36
63
|
/**
|
|
37
64
|
* Modal mode.
|
|
@@ -40,10 +67,13 @@ type DrawerRootProps = {
|
|
|
40
67
|
* - `'trap-focus'`: focus trapped, but scroll and outside pointer events remain enabled.
|
|
41
68
|
*/
|
|
42
69
|
modal?: boolean | 'trap-focus';
|
|
43
|
-
/** When true,
|
|
70
|
+
/** When true, outside presses and the Escape key do not close the drawer. */
|
|
44
71
|
disablePointerDismissal?: boolean;
|
|
45
|
-
/**
|
|
46
|
-
|
|
72
|
+
/**
|
|
73
|
+
* The side the drawer is docked on, which is also the direction you drag to
|
|
74
|
+
* dismiss it. `up` and `down` are accepted as aliases for `top` and `bottom`.
|
|
75
|
+
*/
|
|
76
|
+
swipeDirection?: 'left' | 'right' | 'top' | 'bottom' | 'up' | 'down';
|
|
47
77
|
/** ID of the trigger associated with this drawer (controlled). */
|
|
48
78
|
triggerId?: string | null;
|
|
49
79
|
/** ID of the trigger associated with this drawer (uncontrolled / defaultOpen). */
|
|
@@ -51,8 +81,8 @@ type DrawerRootProps = {
|
|
|
51
81
|
/**
|
|
52
82
|
* Ref to imperative actions.
|
|
53
83
|
* - `close()`: closes the drawer programmatically.
|
|
54
|
-
* - `unmount()`:
|
|
55
|
-
*
|
|
84
|
+
* - `unmount()`: unmounts the drawer. Needed when a close was held open with
|
|
85
|
+
* `eventDetails.preventUnmountOnClose()` for a custom close animation.
|
|
56
86
|
*/
|
|
57
87
|
actionsRef?: React.RefObject<DrawerRootActions | null>;
|
|
58
88
|
};
|
|
@@ -97,18 +127,32 @@ type DrawerContentProps = React.ComponentPropsWithoutRef<typeof Primitive.div> &
|
|
|
97
127
|
className?: string;
|
|
98
128
|
asChild?: boolean;
|
|
99
129
|
forceMount?: boolean;
|
|
130
|
+
/**
|
|
131
|
+
* Where focus lands when the drawer opens. `0` focuses the first focusable
|
|
132
|
+
* element, `-1` focuses the popup itself, or pass an element / ref.
|
|
133
|
+
*/
|
|
134
|
+
initialFocus?: number | React.RefObject<HTMLElement | null>;
|
|
135
|
+
/** Element focus returns to on close. Defaults to the trigger. */
|
|
136
|
+
finalFocus?: React.RefObject<HTMLElement | null>;
|
|
137
|
+
/**
|
|
138
|
+
* Turns off drag-to-dismiss for this popup. Equivalent to putting
|
|
139
|
+
* `data-swipe-ignore` on it, but as a prop.
|
|
140
|
+
*/
|
|
141
|
+
disableSwipeDismiss?: boolean;
|
|
100
142
|
};
|
|
101
143
|
declare const DrawerContent: React.ForwardRefExoticComponent<DrawerContentProps & React.RefAttributes<HTMLElement>>;
|
|
102
144
|
|
|
103
145
|
type PrimitiveHeadingProps = React.ComponentPropsWithoutRef<typeof Primitive.h2>;
|
|
104
146
|
type DrawerTitleProps = PrimitiveHeadingProps & {
|
|
105
147
|
className?: string;
|
|
148
|
+
id?: string;
|
|
106
149
|
};
|
|
107
150
|
declare const DrawerTitle: React.ForwardRefExoticComponent<DrawerTitleProps & React.RefAttributes<HTMLElement>>;
|
|
108
151
|
|
|
109
152
|
type PrimitiveParagraphProps = React.ComponentPropsWithoutRef<typeof Primitive.p>;
|
|
110
153
|
type DrawerDescriptionProps = PrimitiveParagraphProps & {
|
|
111
154
|
className?: string;
|
|
155
|
+
id?: string;
|
|
112
156
|
};
|
|
113
157
|
declare const DrawerDescription: React.ForwardRefExoticComponent<DrawerDescriptionProps & React.RefAttributes<HTMLElement>>;
|
|
114
158
|
|
|
@@ -129,11 +173,44 @@ declare const DrawerClose: React.ForwardRefExoticComponent<Omit<DialogPrimitiveC
|
|
|
129
173
|
|
|
130
174
|
type DrawerHandleProps = {
|
|
131
175
|
className?: string;
|
|
132
|
-
/** Distance in px the user must drag outward before the drawer closes. Default: 80 */
|
|
133
|
-
closeThreshold?: number;
|
|
134
176
|
};
|
|
135
177
|
declare const DrawerHandle: React.ForwardRefExoticComponent<DrawerHandleProps & React.RefAttributes<HTMLDivElement>>;
|
|
136
178
|
|
|
179
|
+
type DrawerSwipeZoneProps = React.ComponentPropsWithoutRef<'div'> & {
|
|
180
|
+
className?: string;
|
|
181
|
+
/**
|
|
182
|
+
* How far (px) the user must drag in the open direction before the drawer opens.
|
|
183
|
+
* @default 48
|
|
184
|
+
*/
|
|
185
|
+
openThreshold?: number;
|
|
186
|
+
/**
|
|
187
|
+
* Width/height of the hit zone in px (the edge-hugging strip).
|
|
188
|
+
* @default 20
|
|
189
|
+
*/
|
|
190
|
+
size?: number;
|
|
191
|
+
/**
|
|
192
|
+
* Disables the swipe zone. The hit area is removed when disabled.
|
|
193
|
+
*/
|
|
194
|
+
disabled?: boolean;
|
|
195
|
+
};
|
|
196
|
+
declare const DrawerSwipeZone: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
197
|
+
className?: string;
|
|
198
|
+
/**
|
|
199
|
+
* How far (px) the user must drag in the open direction before the drawer opens.
|
|
200
|
+
* @default 48
|
|
201
|
+
*/
|
|
202
|
+
openThreshold?: number;
|
|
203
|
+
/**
|
|
204
|
+
* Width/height of the hit zone in px (the edge-hugging strip).
|
|
205
|
+
* @default 20
|
|
206
|
+
*/
|
|
207
|
+
size?: number;
|
|
208
|
+
/**
|
|
209
|
+
* Disables the swipe zone. The hit area is removed when disabled.
|
|
210
|
+
*/
|
|
211
|
+
disabled?: boolean;
|
|
212
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
213
|
+
|
|
137
214
|
type DrawerElement = React.ElementRef<'div'>;
|
|
138
215
|
type DrawerProps = React.ComponentPropsWithoutRef<'div'>;
|
|
139
216
|
interface DrawerComponent extends React.ForwardRefExoticComponent<DrawerProps & React.RefAttributes<DrawerElement>> {
|
|
@@ -146,8 +223,9 @@ interface DrawerComponent extends React.ForwardRefExoticComponent<DrawerProps &
|
|
|
146
223
|
Description: typeof DrawerDescription;
|
|
147
224
|
Close: typeof DrawerClose;
|
|
148
225
|
Handle: typeof DrawerHandle;
|
|
226
|
+
SwipeZone: typeof DrawerSwipeZone;
|
|
149
227
|
}
|
|
150
228
|
declare const Drawer: DrawerComponent;
|
|
151
229
|
|
|
152
230
|
export { Drawer as default };
|
|
153
|
-
export type { DrawerCloseProps, DrawerContentProps, DrawerDescriptionProps, DrawerHandleProps, DrawerOverlayProps, DrawerPortalProps, DrawerRootActions, DrawerRootProps, DrawerSnapPoint, DrawerTitleProps, DrawerTriggerProps };
|
|
231
|
+
export type { DrawerCloseProps, DrawerContentProps, DrawerDescriptionProps, DrawerHandleProps, DrawerOverlayProps, DrawerPortalProps, DrawerRootActions, DrawerRootProps, DrawerSnapPoint, DrawerSwipeZoneProps, DrawerTitleProps, DrawerTriggerProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
'use client';import e,{createContext as t,useContext as r,forwardRef as n,useState as a,useRef as s,useEffect as o,useCallback as i}from"react";import{jsx as l,jsxs as c}from"react/jsx-runtime";import{c as d}from"./clsx-BaVHROc5.js";import{u}from"./useComponentClass-QwNivz0h.js";import{D as m,a as p}from"./index-BbEsAodL.js";import{F as h}from"./index-Db-tduwt.js";import{P as C}from"./index-m6qHOeQ9.js";import"./ThemeContext-Sm-iNANd.js";import"./index-gM8bbyw1.js";import"./floating-ui.react-Byzse64h.js";import"react-dom";import"./mergeProps-B9ocQsG4.js";const f=t({rootClass:"",swipeDirection:"right",snapPoints:[],activeSnapPoint:null,setActiveSnapPoint:()=>{},modal:!0,disablePointerDismissal:!1,onOpenChangeComplete:void 0,registerActions:()=>{},markIntentionalClose:()=>{},childOpenCount:0}),g=t({depth:0,onChildOpenChange:()=>{}});const y="Drawer",b=n((({children:e,customRootClass:t="",className:n="",defaultOpen:c=!1,open:p,onOpenChange:h,onOpenChangeComplete:C,snapPoints:b=[],defaultSnapPoint:v=null,snapPoint:D,onSnapPointChange:N,snapToSequentialPoints:P=!1,modal:w=!0,disablePointerDismissal:O=!1,swipeDirection:k="right",triggerId:x,defaultTriggerId:T,actionsRef:$},j)=>{const F=u(t,y),I=r(g),A=void 0!==p,[S,X]=a(c),Y=A?p:S,M=s(!1),E=s(O);o((()=>{E.current=O}),[O]);const R=i((e=>{(e||!E.current||M.current)&&(M.current=!1,A||X(e),h?.(e))}),[A,h]),q=void 0!==D,[H,L]=a(v??(b.length>0?b[0]:null)),V=q?D:H,z=i((e=>{q||L(e),N?.(e)}),[q,N]),K=i((e=>{$&&"current"in $&&($.current=e)}),[$]);o((()=>{if(!$)return;K({close:()=>{M.current=!0,R(!1)},unmount:()=>{M.current=!0,R(!1)}})}),[$,R,K]);const U=s(!1);o((()=>{Y&&!U.current?(U.current=!0,I.onChildOpenChange(!0)):!Y&&U.current&&(U.current=!1,I.onChildOpenChange(!1))}),[Y,I]),o((()=>()=>{U.current&&(I.onChildOpenChange(!1),U.current=!1)}),[]);const[B,G]=a(0),J=i((e=>{G((t=>Math.max(0,t+(e?1:-1)))),I.onChildOpenChange(e)}),[I]),Q={depth:I.depth+1,onChildOpenChange:J},W={rootClass:F,swipeDirection:k,isOpen:Y,onOpen:()=>R(!0),snapPoints:b,activeSnapPoint:V,setActiveSnapPoint:z,modal:w,disablePointerDismissal:O,onOpenChangeComplete:C,registerActions:K,markIntentionalClose:()=>{M.current=!0},childOpenCount:B};return l(g.Provider,{value:Q,children:l(m.Root,{ref:j,open:Y,onOpenChange:R,className:d(F,n),disablePointerDismissal:O,children:l(f.Provider,{value:W,children:e})})})}));b.displayName=y;const v=n((({children:e,asChild:t,className:n="",...a},s)=>{const{rootClass:o}=r(f);return l(m.Trigger,{ref:s,className:d(o&&`${o}-trigger`,n),asChild:t,...a,children:e})}));v.displayName="DrawerTrigger";const D=n((({children:e,...t},r)=>l(m.Portal,{...t,children:e})));D.displayName="DrawerPortal";const N=n((({className:e="",forceMount:t=!1,...n},i)=>{const{rootClass:c,modal:u,disablePointerDismissal:m,onOpenChangeComplete:C,markIntentionalClose:g}=r(f),{isOpen:y,handleOverlayClick:b}=r(p),[v,D]=a(y),[N,P]=a(y?"open":"closed"),w=s(null);if(o((()=>(w.current&&clearTimeout(w.current),y?(D(!0),requestAnimationFrame((()=>{requestAnimationFrame((()=>P("open")))}))):(P("closed"),w.current=setTimeout((()=>{D(!1),C?.(!1)}),400)),()=>{w.current&&clearTimeout(w.current)})),[y,C]),!v&&!t)return null;const O=m?void 0:()=>{g(),b()},k=!0===u;return l(h.Overlay,{lockScroll:y&&k,ref:i,onClick:O,"data-state":N,style:!1===u?{pointerEvents:"none",background:"transparent"}:void 0,className:d(c&&`${c}-overlay`,e),...n})}));N.displayName="DrawerOverlay";const P=n((({children:t,className:n="",asChild:i=!1,forceMount:u=!1,role:m="dialog","aria-modal":g,"aria-labelledby":y,"aria-describedby":b,style:v,...D},N)=>{const{rootClass:P,swipeDirection:w,modal:O,onOpenChangeComplete:k,childOpenCount:x}=r(f),{isOpen:T,getFloatingProps:$,refs:j,floaterContext:F}=r(p),I=g??!1!==O,[A,S]=a(T),[X,Y]=a(T?"open":"closed"),M=s(null),E=s(null);o((()=>(M.current&&clearTimeout(M.current),E.current&&clearTimeout(E.current),T?(S(!0),requestAnimationFrame((()=>{requestAnimationFrame((()=>{Y("open"),E.current=setTimeout((()=>k?.(!0)),400)}))}))):(Y("closed"),M.current=setTimeout((()=>{S(!1)}),400)),()=>{M.current&&clearTimeout(M.current),E.current&&clearTimeout(E.current)})),[T,k]);const R=h.useMergeRefs([j.setFloating,N]),{style:q,...H}=$()??{};if(!A&&!u)return null;const L=!1!==O,V=20*x,z=V>0?{"--drawer-peek-offset":`${V}px`}:{};return l(h.FocusManager,{context:F,modal:L,initialFocus:0,returnFocus:!0,children:c(C.div,{ref:R,asChild:i,...H,style:{outline:"none",...z,...v},role:m,"aria-modal":I,"aria-hidden":T?void 0:"true","aria-labelledby":T?y:void 0,"aria-describedby":T?b:void 0,"data-state":X,"data-swipe-direction":w,"data-child-open":x>0?"true":void 0,className:d(P&&`${P}-content`,n),...D,children:[e.Children.map(t,(t=>e.isValidElement(t)&&"DrawerHandle"===t.type?.displayName?t:null)),l("div",{className:d(P&&`${P}-content-inner`),children:e.Children.map(t,(t=>e.isValidElement(t)&&"DrawerHandle"===t.type?.displayName?null:t))})]})})}));P.displayName="DrawerContent";const w=n((({children:e,className:t="",...n},a)=>{const{rootClass:s}=r(f);return l(C.h2,{ref:a,className:d(s&&`${s}-title`,t),...n,children:e})}));w.displayName="DrawerTitle";const O=n((({children:e,className:t="",...n},a)=>{const{rootClass:s}=r(f);return l(C.p,{ref:a,className:d(s&&`${s}-description`,t),...n,children:e})}));O.displayName="DrawerDescription";const k=n((({children:e,asChild:t,className:n="",onClick:a,...s},o)=>{const{rootClass:i,markIntentionalClose:c}=r(f);return l(m.Cancel,{ref:o,className:d(i&&`${i}-close`,n),asChild:t,onClick:e=>{c(),a?.(e)},...s,children:e})}));k.displayName="DrawerClose";const x=n((({className:e="",closeThreshold:t=80},n)=>{const{rootClass:c,swipeDirection:u,markIntentionalClose:m}=r(f),{handleOpenChange:h,refs:C}=r(p),g=s(null),y=s(0),[b,v]=a(!1),D=i((()=>C.floating?.current??null),[C]),N=i((e=>{const t=D();if(t)switch(u){case"right":t.style.transform=`translateX(${e}px)`;break;case"left":t.style.transform=`translateX(${-e}px)`;break;case"bottom":t.style.transform=`translateY(${e}px)`;break;case"top":t.style.transform=`translateY(${-e}px)`}}),[u,D]),P=i((e=>{const t=D();if(!t)return;const r=.2*e;switch(u){case"right":t.style.transform=`translateX(${-r}px)`;break;case"left":t.style.transform=`translateX(${r}px)`;break;case"bottom":t.style.transform=`translateY(${-r}px)`;break;case"top":t.style.transform=`translateY(${r}px)`}}),[u,D]),w=i((()=>{const e=D();if(!e)return;y.current=0,v(!0),e.style.transition="transform 320ms cubic-bezier(0.34, 1.56, 0.64, 1)",e.style.transform="";const t=()=>{e.style.transition="",e.removeEventListener("transitionend",t),v(!1)};e.addEventListener("transitionend",t)}),[D]),O=i((e=>{if(0!==e.button)return;e.currentTarget.setPointerCapture(e.pointerId),g.current={startX:e.clientX,startY:e.clientY},y.current=0,v(!1);const t=D();t&&(t.style.transition="none")}),[D]),k=i((e=>{if(!g.current)return;const t=e.clientX-g.current.startX,r=e.clientY-g.current.startY;let n;switch(u){case"right":n=t;break;case"left":n=-t;break;case"bottom":n=r;break;case"top":n=-r}n>=0?(y.current=n,N(n)):(y.current=0,P(Math.abs(n)))}),[u,N,P]),x=i((()=>{if(g.current)if(g.current=null,y.current>=t){m();const e=D();e&&(e.style.transition="",e.style.transform=""),h(!1)}else w()}),[t,m,h,w,D]),T=i((()=>{g.current&&(g.current=null,y.current=0,w())}),[w]);return o((()=>()=>{const e=D();e&&(e.style.transition="",e.style.transform="")}),[D]),l("div",{ref:n,role:"button","aria-label":"Drag to close drawer",tabIndex:0,onPointerDown:O,onPointerMove:k,onPointerUp:x,onPointerCancel:T,onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),m(),h(!1))},"data-direction":u,"data-snapping":b?"true":void 0,className:d(c&&`${c}-handle`,e),children:l("div",{className:`${c}-handle-grip`,"aria-hidden":"true"})})}));x.displayName="DrawerHandle";const T=n(((e,t)=>(console.warn("Direct usage of Drawer is not supported. Please use Drawer.Root, Drawer.Content, etc. instead."),null)));T.displayName="Drawer";const $=T;$.Root=b,$.Trigger=v,$.Portal=D,$.Overlay=N,$.Content=P,$.Title=w,$.Description=O,$.Close=k,$.Handle=x;export{$ as default};
|
|
1
|
+
'use client';import{createContext as e,useContext as t,forwardRef as n,useMemo as r,useState as i,useRef as o,useEffect as s,useCallback as a}from"react";import{jsx as l}from"react/jsx-runtime";import{c}from"./clsx-BaVHROc5.js";import{u}from"./index-UODM4mVT.js";import{u as d}from"./useComponentClass-QwNivz0h.js";import{D as p,a as m}from"./index-CD_nZA9X.js";import{F as f}from"./index-Db-tduwt.js";import{P as h}from"./index-XF8itt-H.js";import"./documentOverlayOpen-coyGmcyL.js";import"./ThemeContext-Sm-iNANd.js";import"./index-wRElCyvx.js";import"./index-CfC8-kd8.js";import"./floating-ui.react-Byzse64h.js";import"react-dom";import"./mergeProps-0RucjqeH.js";const g=e({rootClass:"",side:"right",dismissDirection:"right",isOpen:!1,onOpen:()=>{},snapPoints:[],activeSnapPoint:null,setActiveSnapPoint:()=>{},snapToSequentialPoints:!1,modal:!0,disablePointerDismissal:!1,shouldKeepMounted:!1,requestClose:()=>{},markIntentionalClose:()=>{},setTitleId:()=>{},setDescriptionId:()=>{},popupHeight:0,setPopupHeight:()=>{},registerContentElement:()=>{},childOpenCount:0,nestedSwiping:!1,setNestedSwiping:()=>{},depth:0}),v={movementX:"--rad-ui-drawer-swipe-movement-x",movementY:"--rad-ui-drawer-swipe-movement-y",snapPointOffset:"--rad-ui-drawer-snap-point-offset",progress:"--rad-ui-drawer-swipe-progress",strength:"--rad-ui-drawer-swipe-strength",height:"--rad-ui-drawer-height",nestedDrawers:"--rad-ui-nested-drawers"},y="[data-swipe-ignore],[data-rad-ui-swipe-ignore]";function w(e,t,n){return Math.min(Math.max(e,t),n)}function P(e,t,n){switch(e){case"up":return-n;case"down":return n;case"left":return-t;default:return t}}function C(e,t){return"left"===t||"right"===t?e.offsetWidth:e.offsetHeight}function x(e,t,n){if(!Number.isFinite(t)||t<=0)return null;if("number"==typeof e)return Number.isFinite(e)?e<=1?w(e,0,1)*t:e:null;const r=e.trim();if(r.endsWith("px")){const e=Number.parseFloat(r);return Number.isFinite(e)?e:null}if(r.endsWith("rem")){const e=Number.parseFloat(r);return Number.isFinite(e)?e*n:null}return null}function b(e,t){let n=-1,r=1/0;for(let i=0;i<e.length;i+=1){const o=Math.abs(e[i].offset-t);o<r&&(r=o,n=i)}return n}function S({snapPoints:e,currentOffset:t,popupHeight:n,dragDelta:r,directionalVelocity:i,snapToSequentialPoints:o}){if(!e.length||n<=0)return{type:"stay"};const s=Math.sign(r),a=w(t+r,0,n),l=Math.abs(i)>=.5?300*w(i,-4,4):0,c=o?a:w(a+l,0,n),u=[...e].sort(((e,t)=>e.offset-t.offset));let d=function(e,t){const n=b(e,t);return-1===n?null:e[n]}(u,c),p=c;if(o){const e=b(u,t);if(0!==s&&Math.sign(i)===s&&Math.abs(i)>=.5){const t=w(e+s,0,u.length-1);if(t!==e){const e=u[t];(s>0?c<e.offset:c>e.offset)&&(d=e,p=e.offset)}else if(s>0)return{type:"close",snapPoint:d}}}else if(i>=.5&&r>0)return{type:"close",snapPoint:d};return Math.abs(p-n)<(d?Math.abs(p-d.offset):1/0)?{type:"close",snapPoint:d}:{type:"settle",snapPoint:d}}const D=e({depth:0,onChildOpenChange:()=>{},onChildSwipingChange:()=>{}});function O(e,t){const n="open"===t?500:400;if(!e||"undefined"==typeof window||!window.getComputedStyle)return n;const r="open"===t?"--rad-ui-drawer-open-duration":"--rad-ui-drawer-close-duration";return function(e){if(!e)return null;const t=e.trim();if(!t||"auto"===t||"normal"===t)return null;const n=Number.parseFloat(t);return Number.isFinite(n)?t.endsWith("ms")?n:t.endsWith("s")?1e3*n:n:null}(window.getComputedStyle(e).getPropertyValue(r))??n}function N(e,t,n){return new Promise((r=>{if(n?.aborted||!e)return void r();let i,o,s,a=!1;const l=()=>{a||(a=!0,void 0!==i&&clearTimeout(i),void 0!==o&&cancelAnimationFrame(o),n&&s&&n.removeEventListener("abort",s),r())},c=e;if("function"!=typeof c.getAnimations)i=setTimeout(l,t);else{let e=[];try{e=c.getAnimations()}catch{e=[]}i=setTimeout(l,t),e.length?Promise.all(e.map((e=>e.finished.catch((()=>{}))))).then(l):o=requestAnimationFrame(l)}n&&(s=l,n.addEventListener("abort",s))}))}const T="Drawer",M=n((({children:e,customRootClass:n="",className:m="",defaultOpen:f=!1,open:h,onOpenChange:v,onOpenChangeComplete:y,snapPoints:w=[],defaultSnapPoint:P=null,snapPoint:C,onSnapPointChange:x,snapToSequentialPoints:b=!1,modal:S=!0,disablePointerDismissal:M=!1,swipeDirection:F="right",triggerId:E,defaultTriggerId:I,actionsRef:Y},A)=>{const H=d(n,T),X=r((()=>function(e){switch(e){case"up":return"top";case"down":return"bottom";default:return e}}(F)),[F]),q=r((()=>function(e){switch(e){case"top":return"up";case"bottom":return"down";default:return e}}(X)),[X]),$=t(D),k=void 0!==h,[L,j]=i(f),R=k?h:L;u(R);const z=o(R);z.current=R;const W=o(null),V=o(!1),K=o(M);s((()=>{K.current=M}),[M]);const[B,U]=i(!1),Z=a(((e="close-press")=>{V.current=!0,W.current=e}),[]),G=a(((e,t)=>{const n=W.current??(e?"trigger-press":"none");W.current=null;const r=V.current;if(V.current=!1,!e&&K.current&&!r)return;let i=!1,o=!1;const s={reason:n,cancel:()=>{i=!0},get isCanceled(){return i},preventUnmountOnClose:()=>{o=!0},event:t};v&&(v.length<=1?v(e):v(e,s)),i||(o&&U(!0),k||j(e))}),[k,v]);s((()=>{R&&U(!1)}),[R]);const J=void 0!==C,[Q,_]=i(P??(w.length>0?w[0]:null)),ee=J?C:Q,te=a((e=>{J||_(e),x?.(e)}),[J,x]),[ne,re]=i(0),ie=a((e=>{re((t=>t===e?t:e))}),[]),oe=a((e=>{Y&&"current"in Y&&(Y.current=e)}),[Y]);s((()=>{if(!Y)return;oe({close:()=>{Z("imperative-action"),G(!1)},unmount:()=>{U(!1),z.current&&!k&&(Z("imperative-action"),G(!1)),_(P??w[0]??null)}})}),[Y,P,G,k,Z,oe,w]);const se=o(null),ae=a((e=>{se.current=e}),[]),le=o(y);le.current=y,s((()=>{const e=new AbortController,t=R,n=requestAnimationFrame((()=>{const n=se.current;le.current&&N(n,O(n,t?"open":"close"),e.signal).then((()=>{e.signal.aborted||le.current?.(z.current)}))}));return()=>{e.abort(),cancelAnimationFrame(n)}}),[R]);const ce=o(!1);s((()=>{R&&!ce.current?(ce.current=!0,$.onChildOpenChange(!0)):!R&&ce.current&&(ce.current=!1,$.onChildOpenChange(!1))}),[R,$]),s((()=>()=>{ce.current&&($.onChildOpenChange(!1),ce.current=!1)}),[]);const[ue,de]=i(0),pe=a((e=>{de((t=>Math.max(0,t+(e?1:-1)))),$.onChildOpenChange(e)}),[$]),[me,fe]=i(!1),he=a((e=>{fe(e),$.onChildSwipingChange(e)}),[$]);s((()=>{ue||fe(!1)}),[ue]);const ge=he,ve=r((()=>({depth:$.depth+1,onChildOpenChange:pe,onChildSwipingChange:he})),[pe,he,$.depth]),ye=a(((e,t)=>{Z(e),G(!1,t)}),[G,Z]),[we,Pe]=i(void 0),[Ce,xe]=i(void 0),be=a((e=>{Pe((t=>t===e?t:e))}),[]),Se=a((e=>{xe((t=>t===e?t:e))}),[]),De=r((()=>({rootClass:H,side:X,dismissDirection:q,isOpen:R,onOpen:()=>G(!0),snapPoints:w,activeSnapPoint:ee,setActiveSnapPoint:te,snapToSequentialPoints:b,popupHeight:ne,setPopupHeight:ie,modal:S,disablePointerDismissal:M,registerContentElement:ae,shouldKeepMounted:B,requestClose:ye,markIntentionalClose:Z,childOpenCount:ue,nestedSwiping:me,setNestedSwiping:ge,titleId:we,descriptionId:Ce,setTitleId:be,setDescriptionId:Se,depth:$.depth})),[ee,ue,Ce,q,M,G,B,R,Z,S,$.depth,ne,ae,ye,H,te,Se,ge,ie,be,X,w,b,me,we]);return l(D.Provider,{value:ve,children:l(p.Root,{ref:A,open:R,onOpenChange:G,className:c(H,m),disablePointerDismissal:M,children:l(g.Provider,{value:De,children:e})})})}));M.displayName=T;const F=n((({children:e,asChild:n,className:r="",...i},o)=>{const{rootClass:s}=t(g);return l(p.Trigger,{ref:o,className:c(s&&`${s}-trigger`,r),asChild:n,...i,children:e})}));F.displayName="DrawerTrigger";const E=n((({children:e,...t},n)=>l(p.Portal,{...t,children:e})));E.displayName="DrawerPortal";const I=n((({className:e="",forceMount:n=!1,...r},a)=>{const{rootClass:u,modal:d,disablePointerDismissal:p,markIntentionalClose:h}=t(g),{isOpen:v,handleOverlayClick:y}=t(m),[w,P]=i(v),[C,x]=i(v?"open":"closed"),b=o(null);if(s((()=>(b.current&&clearTimeout(b.current),v?(P(!0),requestAnimationFrame((()=>{requestAnimationFrame((()=>x("open")))}))):(x("closed"),b.current=setTimeout((()=>{P(!1)}),400)),()=>{b.current&&clearTimeout(b.current)})),[v]),!w&&!n)return null;const S=p?void 0:()=>{h(),y()},D=!0===d;return l(f.Overlay,{lockScroll:v&&D,ref:a,onClick:S,"data-state":C,style:!1===d?{pointerEvents:"none",background:"transparent"}:void 0,className:c(u&&`${u}-overlay`,e),...r})}));I.displayName="DrawerOverlay";const Y=e({element:null,height:0,resolvedSnapPoints:[],activeSnapPointOffset:0,activeSnapPoint:null,setActiveSnapPoint:()=>{},expanded:!1,dismissDirection:"right",pointerProps:{onPointerDown:()=>{}},touchProps:{onTouchStart:()=>{},onTouchMove:()=>{},onTouchEnd:()=>{},onTouchCancel:()=>{}}});function A(){return"undefined"==typeof window?0:window.innerHeight||document.documentElement.clientHeight||0}function H(){if("undefined"==typeof window)return 16;const e=Number.parseFloat(window.getComputedStyle(document.documentElement).fontSize);return Number.isFinite(e)&&e>0?e:16}function X(e,t,n,o){const a="up"===t||"down"===t,[l,c]=i(0),[u,d]=i(16);s((()=>{if(!a||!e.length)return;c(A()),d(H());const t=()=>{c(A()),d(H())};return window.addEventListener("resize",t),()=>window.removeEventListener("resize",t)}),[e.length,a]);const p=r((()=>a&&e.length?function(e,t,n,r){if(!e.length||n<=0)return[];const i=Math.min(n,t||n),o=e.map((e=>{const o=x(e,t,r);if(null===o)return null;const s=w(o,0,i);return{value:e,height:s,offset:Math.max(0,n-s)}})).filter((e=>null!==e));if(o.length<2)return o;const s=[];for(let e=o.length-1;e>=0;e-=1){const t=o[e];s.some((e=>Math.abs(e.height-t.height)<=1))||s.push(t)}return s.reverse()}(e,l||n,n,u):[]),[n,u,e,a,l]);return r((()=>{if(!p.length||null===o)return{resolved:p,active:null,activeOffset:0,expanded:!1};const e=p.find((e=>Object.is(e.value,o)));if(e)return{resolved:p,active:e,activeOffset:e.offset,expanded:1===o};const t=x(o,l||n,u);if(null===t)return{resolved:p,active:null,activeOffset:0,expanded:!1};const r=w(t,0,n||l||t),i=Math.max(0,(n||r)-r);return{resolved:p,active:null,activeOffset:i,expanded:1===o}}),[o,n,p,u,l])}function q(e){return e.timeStamp>0?e.timeStamp:performance.now()}function $(e,t){let n=e;for(;n&&n!==t;){const e=window.getComputedStyle(n),t=("auto"===e.overflowY||"scroll"===e.overflowY)&&n.scrollHeight>n.clientHeight,r=("auto"===e.overflowX||"scroll"===e.overflowX)&&n.scrollWidth>n.clientWidth;if(t||r)return{element:n,axis:t?"y":"x"};n=n.parentElement}return null}function k(e,t,n){return"y"===t?"down"===n?e.scrollTop<=0:e.scrollTop>=e.scrollHeight-e.clientHeight:"right"===n?e.scrollLeft<=0:e.scrollLeft>=e.scrollWidth-e.clientWidth}let L=!1;function j(e){const{elementRef:t,dismissDirection:n,axis:r,enabled:l,disabledByNestedDrawer:c=!1,snapPoints:u,popupHeight:d=0,activeSnapPointOffset:p=0,snapToSequentialPoints:m=!1,onDismiss:f,onSettle:h,onSwipingChange:g,onProgress:x}=e,[b,D]=i(!1),[O,N]=i(!1),T=o(null),M=o(0),F=o(null),E=o(null),I=o(null),Y=o(null),A=o({onDismiss:f,onSettle:h,onSwipingChange:g,onProgress:x});A.current={onDismiss:f,onSettle:h,onSwipingChange:g,onProgress:x};const H=l&&!c,X=Boolean(u?.length)&&!("left"===(j=n)||"right"===j);var j;s((()=>{if(!u||u.length<2)return void(Y.current=null);const e=u.map((e=>e.offset)).sort(((e,t)=>e-t)),t=e[1]-e[0];Y.current=t>0?{min:e[0],range:t}:null}),[u]);const R=a((e=>{D(e),A.current.onSwipingChange?.(e)}),[]),z=a((e=>{const n=t.current;n&&(X?n.style.setProperty(v.movementY,`${function(e,t){const n=e+t;return n>=0?t:-Math.sqrt(-n)-e}(p,e)}px`):"x"===r?n.style.setProperty(v.movementX,`${e}px`):n.style.setProperty(v.movementY,`${e}px`))}),[p,r,t,X]),W=a((e=>{const r=t.current;if(!r)return;const i=Y.current;let o;if(i){const t=w((p||i.min)+e,0,d||p+i.range);o=w((t-i.min)/i.range,0,1)}else{const t=C(r,n);o=t>0?w(1-Math.max(0,e)/t,0,1):1}r.style.setProperty(v.progress,String(o)),A.current.onProgress?.(o)}),[p,n,t,d]),V=a((()=>{const e=t.current;e&&(e.style.removeProperty(v.movementX),e.style.removeProperty(v.movementY),e.style.removeProperty(v.strength),e.style.setProperty(v.progress,"1"))}),[t]),K=a(((e,t,r)=>{const i=F.current;if(F.current={x:e,y:t,time:r},!i)return 0;const o=Math.max(r-i.time,16);return P(n,(e-i.x)/o,(t-i.y)/o)}),[n]),B=a((()=>{const e=t.current;if(M.current=0,R(!1),!e)return void N(!1);I.current&&clearTimeout(I.current),N(!0),V(),A.current.onProgress?.(1);const n=()=>{e.removeEventListener("transitionend",n),N(!1)};e.addEventListener("transitionend",n),I.current=setTimeout(n,400)}),[V,t,R]),U=a(((e,r)=>{const i=t.current;if(R(!1),!i)return;const o=function({element:e,direction:t,displacement:n,velocity:r,snapPointOffset:i=0}){const o=C(e,t);if(o<=0)return null;const s=Math.max(0,o-(i+n));if(s<=0)return null;if(r<=.2)return null;const a=w(r,.2,4);return.1+(w(s/a,80,360)-80)/280*.9}({element:i,direction:n,displacement:r,velocity:e,snapPointOffset:X?p:0});null!==o&&i.style.setProperty(v.strength,String(o))}),[p,n,t,R,X]),Z=a(((e,t)=>{T.current={start:e,startDisplacement:M.current,startTime:t,axis:null,dragging:!1},M.current=0,F.current={...e,time:t},R(!0)}),[R]),G=a(((e,t)=>{const r=P(n,e,t),i=(X?p:0)+r;let o;var s;i<0?(s=i,o=Math.sign(s)*Math.sqrt(Math.abs(s))):o=r<0?.2*- -r:r,M.current=o,z(o),W(o)}),[p,n,X,z,W]),J=a(((e,r)=>{const i=T.current;if(T.current=null,E.current=null,!i)return void R(!1);if(!i.dragging)return M.current=0,void R(!1);const o=M.current;M.current=0;const s=e.x-i.start.x,a=e.y-i.start.y,l=P(n,s,a),c=r-i.startTime,f=c>0?P(n,s/Math.max(c,50),a/Math.max(c,50)):0;let h=0;const g=F.current;if(g){const t=r-g.time;if(t<=80){const r=Math.max(t,16);h=P(n,(e.x-g.x)/r,(e.y-g.y)/r)}}const v=0!==h?h:f;if(u?.length){const e=S({snapPoints:u,currentOffset:p,popupHeight:d,dragDelta:l,directionalVelocity:v,snapToSequentialPoints:m});if("close"===e.type)return A.current.onSettle?.(e.snapPoint),U(v,o),void A.current.onDismiss();if("settle"===e.type)return A.current.onSettle?.(e.snapPoint),void B()}const y=t.current,w=y?function(e,t){return Math.max(.5*C(e,t),10)}(y,n):0;h>0&&h>=.5||l>=w?(U(v,o),A.current.onDismiss()):B()}),[p,U,n,t,d,B,u,m,R]),Q=a((e=>{if(!H||0!==e.button)return;if("touch"===e.pointerType)return;const r=e.target;if(r?.closest?.(y))return;if(r?.closest?.('button,a,input,select,textarea,label,summary,[role="button"],[role="slider"],[contenteditable="true"],[data-no-drag]'))return;const i=t.current;if(!i)return;const o=$(r,i);o&&!k(o.element,o.axis,n)||(e.currentTarget.setPointerCapture?.(e.pointerId),E.current=!0,Z({x:e.clientX,y:e.clientY},q(e)))}),[H,n,t,Z]);s((()=>{const e=t.current;if(!e||!H)return;L||(L=!0,"undefined"!=typeof CSS&&"function"==typeof CSS.registerProperty&&[{name:v.movementX,syntax:"<length>",initialValue:"0px"},{name:v.movementY,syntax:"<length>",initialValue:"0px"},{name:v.snapPointOffset,syntax:"<length>",initialValue:"0px"},{name:v.progress,syntax:"<number>",initialValue:"1"},{name:v.strength,syntax:"<number>",initialValue:"1"}].forEach((e=>{try{CSS.registerProperty({...e,inherits:!1})}catch{}})));let n=null;const i=e=>{const t=T.current;if(!t||null!==n&&e.pointerId!==n)return;if("touch"===e.pointerType)return;null===n&&(n=e.pointerId);const i=e.clientX-t.start.x,o=e.clientY-t.start.y,s="x"===r?Math.abs(i):Math.abs(o),a="x"===r?Math.abs(o):Math.abs(i);if(null===t.axis){if(s<6)return;if(a>s)return T.current=null,E.current=null,void R(!1);t.axis=r}t.dragging=!0,K(e.clientX,e.clientY,q(e)),G(i,o)},o=e=>{null!==n&&e.pointerId!==n||(n=null,J({x:e.clientX,y:e.clientY},q(e)))},s=()=>{n=null,T.current=null,M.current=0,B()};return e.addEventListener("pointermove",i),e.addEventListener("pointerup",o),e.addEventListener("pointercancel",s),()=>{e.removeEventListener("pointermove",i),e.removeEventListener("pointerup",o),e.removeEventListener("pointercancel",s)}}),[H,G,r,t,J,K,R,B]);const _=a((e=>{const r=e.touches[0];if(!H||!r)return void(E.current=!1);const i=e.target;if(i?.closest?.(y))return void(E.current=!1);const o=t.current;if(!o)return void(E.current=!1);const s=$(i,o);E.current=!(s&&!k(s.element,s.axis,n))&&null,!1!==E.current&&Z({x:r.clientX,y:r.clientY},q(e))}),[H,n,t,Z]),ee=a((e=>{const t=T.current;if(!1===E.current)return;if(!t)return;const i=e.touches[0];if(!i)return;const o=i.clientX-t.start.x,s=i.clientY-t.start.y,a="x"===r?o:s,l="x"===r?s:o;if(null===t.axis){if(Math.abs(a)<6)return;if(Math.abs(l)>Math.abs(a))return E.current=!1,T.current=null,void R(!1);t.axis=r}if(P(n,o,s)<0)return E.current=!1,T.current=null,void R(!1);E.current=!0,t.dragging=!0,e.cancelable&&e.preventDefault(),K(i.clientX,i.clientY,q(e)),G(o,s)}),[G,r,n,K,R]),te=a((e=>{const t=e.changedTouches[0];if(!t)return T.current=null,void B();J({x:t.clientX,y:t.clientY},q(e))}),[J,B]),ne=a((()=>{E.current=!1,T.current=null,M.current=0,B()}),[B]);return s((()=>()=>{I.current&&clearTimeout(I.current)}),[]),s((()=>{H||(T.current=null,E.current=null,M.current=0,F.current=null,R(!1))}),[H,R]),s((()=>{if(l)return;t.current&&V()}),[V,t,l]),{swiping:b,isSnapping:O,pointerProps:{onPointerDown:Q},touchProps:{onTouchStart:_,onTouchMove:ee,onTouchEnd:te,onTouchCancel:ne}}}const R=n((({children:e,className:n="",asChild:u=!1,forceMount:d=!1,role:p="dialog","aria-modal":y,"aria-labelledby":w,"aria-describedby":P,initialFocus:C=0,finalFocus:x,disableSwipeDismiss:b=!1,style:S,...D},T)=>{const{rootClass:M,side:F,dismissDirection:E,isOpen:I,modal:A,snapPoints:H,activeSnapPoint:q,setActiveSnapPoint:$,snapToSequentialPoints:k,setPopupHeight:L,registerContentElement:R,shouldKeepMounted:z,requestClose:W,childOpenCount:V,nestedSwiping:K,setNestedSwiping:B,titleId:U,descriptionId:Z}=t(g),{getFloatingProps:G,refs:J,floaterContext:Q}=t(m),_=o(null),[ee,te]=i(null),[ne,re]=i(I?"open":"closed"),ie=a((e=>{_.current=e,te(e),R(e)}),[R]),oe=f.useMergeRefs([J.setFloating,ie,T]);s((()=>{if(!ee)return;const e=()=>L(ee.offsetHeight);if(e(),"undefined"==typeof ResizeObserver)return;const t=new ResizeObserver(e);return t.observe(ee),()=>t.disconnect()}),[ee,L]);const se=ee?.offsetHeight??0,{resolved:ae,activeOffset:le,expanded:ce}=X(H,E,se,q),ue=function(e){return"left"===e||"right"===e?"x":"y"}(F),de=a((()=>{W("swipe")}),[W]),pe=a((e=>{$(e?e.value:null)}),[$]),{swiping:me,isSnapping:fe,pointerProps:he,touchProps:ge}=j({elementRef:_,dismissDirection:E,axis:ue,enabled:I&&!b,disabledByNestedDrawer:V>0,snapPoints:ae,popupHeight:se,activeSnapPointOffset:le,snapToSequentialPoints:k,onDismiss:de,onSettle:pe,onSwipingChange:B}),ve=I||d||z,[ye,we]=i(I);s((()=>{if(ve)return void we(!0);const e=new AbortController;return N(ee,O(ee,"close"),e.signal).then((()=>{e.signal.aborted||we(!1)})),()=>e.abort()}),[ee,ve]),s((()=>{if(!ye)return void re("closed");if(!I)return void re("closed");const e=requestAnimationFrame((()=>re("open")));return()=>cancelAnimationFrame(e)}),[I,ye]),s((()=>{if(I||!x?.current)return;const e=requestAnimationFrame((()=>{x.current?.focus()}));return()=>cancelAnimationFrame(e)}),[x,I]);const Pe=y??!1!==A,Ce=w??U,xe=P??Z,be={outline:"none",[v.nestedDrawers]:String(V),[v.height]:se>0?`${se}px`:void 0,[v.snapPointOffset]:`${le}px`,...V>0?{"--drawer-peek-offset":20*V+"px"}:{},...S},Se=r((()=>({element:ee,height:se,resolvedSnapPoints:ae,activeSnapPointOffset:le,activeSnapPoint:q,setActiveSnapPoint:$,expanded:ce,dismissDirection:E,pointerProps:he,touchProps:ge})),[q,le,E,ee,ce,he,se,ae,$,ge]),{style:De,...Oe}=G()??{};if(!ye)return null;const Ne=!1!==A;return l(Y.Provider,{value:Se,children:l(f.FocusManager,{context:Q,modal:Ne,initialFocus:C,returnFocus:!x,children:l(h.div,{ref:oe,asChild:u,...Oe,...he,...ge,style:be,role:p,"aria-modal":Pe,"aria-hidden":I?void 0:"true","aria-labelledby":I?Ce:void 0,"aria-describedby":I?xe:void 0,"data-state":ne,"data-swipe-direction":F,"data-swiping":me?"true":void 0,"data-snapping":fe?"true":void 0,"data-swipe-dismiss":b?void 0:"","data-expanded":ae.length>0?ce?"true":"false":void 0,"data-child-open":V>0?"true":void 0,"data-nested-drawer-open":V>0?"true":void 0,"data-nested-drawer-swiping":K?"true":void 0,className:c(M&&`${M}-content`,n),...D,children:l("div",{className:c(M&&`${M}-content-inner`),children:e})})})})}));R.displayName="DrawerContent";const z=n((({children:e,className:n="",id:r,...i},o)=>{const{rootClass:a,setTitleId:u}=t(g),d=f.useId(),p=i.id??r??d;return s((()=>(u(p),()=>u(void 0))),[u,p]),l(h.h2,{ref:o,id:p,className:c(a&&`${a}-title`,n),...i,children:e})}));z.displayName="DrawerTitle";const W=n((({children:e,className:n="",id:r,...i},o)=>{const{rootClass:a,setDescriptionId:u}=t(g),d=f.useId(),p=i.id??r??d;return s((()=>(u(p),()=>u(void 0))),[u,p]),l(h.p,{ref:o,id:p,className:c(a&&`${a}-description`,n),...i,children:e})}));W.displayName="DrawerDescription";const V=n((({children:e,asChild:n,className:r="",onClick:i,...o},s)=>{const{rootClass:a,markIntentionalClose:u}=t(g);return l(p.Cancel,{ref:s,className:c(a&&`${a}-close`,r),asChild:n,onClick:e=>{u(),i?.(e)},...o,children:e})}));V.displayName="DrawerClose";const K=n((({className:e=""},n)=>{const{rootClass:r}=t(g),{pointerProps:i,touchProps:o,dismissDirection:s}=t(Y),u=a((e=>{"Escape"!==e.key&&"Enter"!==e.key&&" "!==e.key||e.preventDefault()}),[]);return l("div",{ref:n,"aria-hidden":"true","data-direction":s,onKeyDown:u,className:c(r&&`${r}-handle`,e),...i,...o,children:l("div",{className:`${r}-handle-grip`,"aria-hidden":"true"})})}));K.displayName="DrawerHandle";const B=n((({className:e="",openThreshold:n=48,size:r=20,children:i,style:s,disabled:u=!1,...d},p)=>{const{rootClass:m,side:f,isOpen:h,onOpen:v}=t(g),y=o(null),w=o(0),P=o(null),C=a(((e,t)=>{switch(f){case"right":return-e;case"left":return e;case"bottom":return-t;case"top":return t}}),[f]),x=a((e=>{const t=P.current;if(!t)return;const n=8*e;switch(f){case"right":t.style.transform=`translateX(${-n}px)`;break;case"left":t.style.transform=`translateX(${n}px)`;break;case"bottom":t.style.transform=`translateY(${-n}px)`;break;case"top":t.style.transform=`translateY(${n}px)`}t.style.setProperty("--swipe-progress",String(e))}),[f]),b=a((e=>{const t=P.current;if(t&&(e&&(t.style.transition="transform var(--rad-ui-motion-duration-normal) var(--rad-ui-motion-easing-standard)"),t.style.transform="",t.style.removeProperty("--swipe-progress"),e)){const e=()=>{t.style.transition="",t.removeEventListener("transitionend",e)};t.addEventListener("transitionend",e)}}),[]),S=a((e=>{if(0!==e.button||h)return;e.currentTarget.setPointerCapture(e.pointerId),y.current={startX:e.clientX,startY:e.clientY},w.current=0;const t=P.current;t&&(t.style.transition="none")}),[h]),D=a((e=>{if(!y.current)return;const t=e.clientX-y.current.startX,r=e.clientY-y.current.startY,i=Math.max(0,C(t,r)),o=Math.min(i/n,1);w.current=o,x(o)}),[C,n,x]),O=a((()=>{y.current&&(y.current=null,w.current>=1?(b(!1),v()):b(!0),w.current=0)}),[v,b]),N=a((()=>{y.current&&(y.current=null,w.current=0,b(!0))}),[b]),T=(()=>{const e={position:"fixed",zIndex:"var(--rad-ui-z-index-overlay)",touchAction:"none",userSelect:"none"};switch(f){case"right":return{...e,top:0,right:0,bottom:0,width:r};case"left":return{...e,top:0,left:0,bottom:0,width:r};case"bottom":return{...e,left:0,bottom:0,right:0,height:r};case"top":return{...e,left:0,top:0,right:0,height:r}}})();return u||h?null:l("div",{ref:e=>{P.current=e,"function"==typeof p?p(e):p&&(p.current=e)},"aria-hidden":"true","data-direction":f,onPointerDown:S,onPointerMove:D,onPointerUp:O,onPointerCancel:N,style:{...T,...s},className:c(m&&`${m}-swipe-zone`,e),...d,children:i})}));B.displayName="DrawerSwipeZone";const U=n(((e,t)=>(console.warn("Direct usage of Drawer is not supported. Please use Drawer.Root, Drawer.Content, etc. instead."),null)));U.displayName="Drawer";const Z=U;Z.Root=M,Z.Trigger=F,Z.Portal=E,Z.Overlay=I,Z.Content=R,Z.Title=z,Z.Description=W,Z.Close=V,Z.Handle=K,Z.SwipeZone=B;export{Z as default};
|
|
@@ -43,11 +43,6 @@ declare const DropdownMenuTrigger: React.ForwardRefExoticComponent<{
|
|
|
43
43
|
className?: string;
|
|
44
44
|
} & Omit<MenuPrimitiveTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
45
45
|
|
|
46
|
-
type MenuPrimitiveContentProps = {
|
|
47
|
-
children: React.ReactNode;
|
|
48
|
-
className?: string;
|
|
49
|
-
};
|
|
50
|
-
|
|
51
46
|
type DropdownMenuContentProps = {
|
|
52
47
|
children: React.ReactNode;
|
|
53
48
|
className?: string;
|
|
@@ -55,7 +50,12 @@ type DropdownMenuContentProps = {
|
|
|
55
50
|
declare const DropdownMenuContent: React.ForwardRefExoticComponent<{
|
|
56
51
|
children: React.ReactNode;
|
|
57
52
|
className?: string;
|
|
58
|
-
} & Omit<
|
|
53
|
+
} & Omit<{
|
|
54
|
+
children: React.ReactNode;
|
|
55
|
+
className?: string;
|
|
56
|
+
initialFocus?: number;
|
|
57
|
+
focusManagerDisabled?: boolean;
|
|
58
|
+
} & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
59
59
|
|
|
60
60
|
type DropdownMenuPortalProps = {
|
|
61
61
|
children: React.ReactNode;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
'use client';import o,{forwardRef as e}from"react";import{jsx as n}from"react/jsx-runtime";import{M as r}from"./MenuPrimitive-
|
|
1
|
+
'use client';import o,{forwardRef as e}from"react";import{jsx as n}from"react/jsx-runtime";import{M as r}from"./MenuPrimitive-COEgTo6S.js";import{u as t}from"./useComponentClass-QwNivz0h.js";import{c as s}from"./clsx-BaVHROc5.js";import a from"./Separator.js";import"./index-Db-tduwt.js";import"./floating-ui.react-Byzse64h.js";import"react-dom";import"./index-wRElCyvx.js";import"./index-UODM4mVT.js";import"./documentOverlayOpen-coyGmcyL.js";import"./index-XF8itt-H.js";import"./mergeProps-0RucjqeH.js";import"./index-CfC8-kd8.js";import"./ThemeContext-Sm-iNANd.js";const l=o.createContext(null),u="DropdownMenu",i=e((({children:o,customRootClass:e,className:a,...i},d)=>{const c=t(e,u);return n(l.Provider,{value:{rootClass:c},children:n(r.Root,{ref:d,className:s(c&&`${c}-root`,a),...i,children:o})})}));i.displayName=u;const d=e((({children:e,className:t,...a},u)=>{const i=o.useContext(l);if(!i)return console.warn("DropdownMenuTrigger should be used in the DropdownMenuRoot"),null;const{rootClass:d}=i;return n(r.Trigger,{ref:u,className:s(d&&`${d}-trigger`,t),...a,children:e})}));d.displayName="DropdownMenuTrigger";const c=e((({children:e,className:t,...a},u)=>{const i=o.useContext(l);if(!i)return console.warn("DropdownMenuContent should be used in the DropdownMenuRoot"),null;const{rootClass:d}=i;return n(r.Content,{ref:u,className:s(d&&`${d}-content`,t),...a,children:e})}));c.displayName="DropdownMenuContent";const p=e((({children:e,...t},s)=>{const a=o.useContext(l);if(!a)return console.warn("DropdownMenuPortal should be used in the DropdownMenuRoot"),null;const{rootClass:u}=a;return n(r.Portal,{ref:s,...t,children:e})}));p.displayName="DropdownMenuPortal";const m=e((({children:e,className:t,label:a,...u},i)=>{const d=o.useContext(l);if(!d)return console.warn("DropdownMenuItem should be used in the DropdownMenuRoot"),null;const{rootClass:c}=d;return n(r.Item,{ref:i,className:s(c&&`${c}-item`,t),label:a,...u,children:e})}));m.displayName="DropdownMenuItem";const w=e((({children:e,className:t,...a},u)=>{const i=o.useContext(l);if(!i)return console.warn("DropdownMenuSub should be used in the DropdownMenuRoot"),null;const{rootClass:d}=i;return n(r.Sub,{ref:u,className:s(d&&`${d}-sub`,t),...a,children:e})}));w.displayName="DropdownMenuSub";const h=e((({children:e,className:t,...a},u)=>{const i=o.useContext(l);if(!i)return console.warn("DropdownMenuSubTrigger should be used in the DropdownMenuRoot"),null;const{rootClass:d}=i;return n(r.Trigger,{ref:u,className:s(d&&`${d}-sub-trigger`,t),...a,children:e})}));h.displayName="DropdownMenuSubTrigger";const M=e((({className:e,...r},t)=>{const s=o.useContext(l);if(!s)return console.warn("DropdownMenuSeparator should be used within DropdownMenuRoot"),null;const{rootClass:u}=s;return n(a,{ref:t,customRootClass:u,className:e,...r})}));M.displayName="DropdownMenuSeparator";const D=e(((o,e)=>(console.warn("Direct usage of DropdownMenu is not supported. Please use DropdownMenu.Root, DropdownMenu.Item instead."),null)));D.displayName="DropdownMenu",D.Root=i,D.Trigger=d,D.Content=c,D.Portal=p,D.Item=m,D.Sub=w,D.SubTrigger=h,D.Separator=M;export{D as default};
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
|
|
3
|
+
type FieldsetRootElement = HTMLFieldSetElement;
|
|
4
|
+
type FieldsetRootProps = {
|
|
5
|
+
customRootClass?: string;
|
|
6
|
+
color?: string;
|
|
7
|
+
size?: string;
|
|
8
|
+
variant?: string;
|
|
9
|
+
invalid?: boolean;
|
|
10
|
+
} & React.ComponentPropsWithoutRef<'fieldset'>;
|
|
11
|
+
declare const FieldsetRoot: React.ForwardRefExoticComponent<{
|
|
12
|
+
customRootClass?: string;
|
|
13
|
+
color?: string;
|
|
14
|
+
size?: string;
|
|
15
|
+
variant?: string;
|
|
16
|
+
invalid?: boolean;
|
|
17
|
+
} & Omit<React.DetailedHTMLProps<React.FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, "ref"> & React.RefAttributes<HTMLFieldSetElement>>;
|
|
18
|
+
|
|
19
|
+
type FieldsetLegendProps = React.ComponentPropsWithoutRef<'legend'>;
|
|
20
|
+
declare const FieldsetLegend: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, "ref"> & React.RefAttributes<HTMLLegendElement>>;
|
|
21
|
+
|
|
22
|
+
type FieldsetDescriptionProps = React.ComponentPropsWithoutRef<'p'>;
|
|
23
|
+
declare const FieldsetDescription: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
|
|
24
|
+
|
|
25
|
+
type FieldsetMessageProps = {
|
|
26
|
+
invalid?: boolean;
|
|
27
|
+
} & React.ComponentPropsWithoutRef<'p'>;
|
|
28
|
+
declare const FieldsetMessage: React.ForwardRefExoticComponent<{
|
|
29
|
+
invalid?: boolean;
|
|
30
|
+
} & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
|
|
31
|
+
|
|
32
|
+
declare const COMPONENT_NAME = "Fieldset";
|
|
33
|
+
type FieldsetProps = FieldsetRootProps;
|
|
34
|
+
type FieldsetComponent = React.ForwardRefExoticComponent<FieldsetProps & React.RefAttributes<FieldsetRootElement>> & {
|
|
35
|
+
Root: typeof FieldsetRoot;
|
|
36
|
+
Legend: typeof FieldsetLegend;
|
|
37
|
+
Description: typeof FieldsetDescription;
|
|
38
|
+
Message: typeof FieldsetMessage;
|
|
39
|
+
};
|
|
40
|
+
declare const Fieldset: FieldsetComponent;
|
|
41
|
+
|
|
42
|
+
export { COMPONENT_NAME, Fieldset as default };
|
|
43
|
+
export type { FieldsetDescriptionProps, FieldsetLegendProps, FieldsetMessageProps, FieldsetProps, FieldsetRootProps };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
'use client';import{jsx as e}from"react/jsx-runtime";import{forwardRef as s}from"react";import{c as i}from"./clsx-BaVHROc5.js";import{u as a}from"./useComponentClass-QwNivz0h.js";import{c as t,a as d,b as l}from"./index-eAZUMNef.js";import"./ThemeContext-Sm-iNANd.js";const o="Fieldset",r=s((({children:s,className:r="",customRootClass:n="",color:c="",disabled:m=!1,invalid:p=!1,size:f="",variant:v="",...h},g)=>{const N=a(n,o),u=t("fieldset",{disabled:m,invalid:p,size:f,variant:v}),j=l(c),x=d(u,j,{"aria-invalid":p||void 0,"data-slot":"fieldset-root"});return e("fieldset",{ref:g,className:i(N,r),...h,disabled:m,...x,children:s})}));r.displayName=o;const n=s((({children:s,...i},a)=>e("legend",{ref:a,...i,"data-slot":"fieldset-legend",children:s})));n.displayName="FieldsetLegend";const c=s((({children:s,...i},a)=>e("p",{ref:a,...i,"data-slot":"fieldset-description",children:s})));c.displayName="FieldsetDescription";const m=s((({children:s,invalid:i,role:a,...t},d)=>e("p",{ref:d,...t,role:a??(i?"alert":void 0),"data-invalid":i?"":void 0,"data-slot":"fieldset-message",children:s})));m.displayName="FieldsetMessage";const p="Fieldset",f=s(((s,i)=>e(r,{ref:i,...s})));f.displayName=p,f.Root=r,f.Legend=n,f.Description=c,f.Message=m;export{p as COMPONENT_NAME,f as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
'use client';import{createContext as e,forwardRef as r,useRef as o,useState as t,useEffect as n,useContext as s}from"react";import{jsx as a}from"react/jsx-runtime";import{F as l}from"./index-Db-tduwt.js";import{u as i}from"./useComponentClass-QwNivz0h.js";import{u as c}from"./index-wRElCyvx.js";import{c as u}from"./clsx-BaVHROc5.js";import{P as d}from"./index-
|
|
1
|
+
'use client';import{createContext as e,forwardRef as r,useRef as o,useState as t,useEffect as n,useContext as s}from"react";import{jsx as a}from"react/jsx-runtime";import{F as l}from"./index-Db-tduwt.js";import{u as i}from"./useComponentClass-QwNivz0h.js";import{u as c}from"./index-wRElCyvx.js";import{c as u}from"./clsx-BaVHROc5.js";import{P as d}from"./index-XF8itt-H.js";import{T as m}from"./ThemeContext-Sm-iNANd.js";import{c as g}from"./index-eAZUMNef.js";import"./floating-ui.react-Byzse64h.js";import"react-dom";import"./mergeProps-0RucjqeH.js";const f=e({}),p="HoverCard",h=r((({children:e,open:r,onOpenChange:s,customRootClass:d="",className:m="",openDelay:g=100,closeDelay:h=200,collisionBoundary:y=null,collisionPadding:C=4,...v},R)=>{const P=i(d,p),w=i(d,`${p}-trigger`),x=o(null),T=(Array.isArray(y)?y:[y]).filter((e=>null!=e)),N={padding:C,boundary:T,altBoundary:T.length>0},[D,j]=c(r,!1,s),H=e=>{j(e)},{refs:W,floatingStyles:A,context:E}=l.useFloating({open:D,onOpenChange:H,placement:"bottom",strategy:"fixed",middleware:[l.arrow({element:x}),l.offset(10),l.flip({mainAxis:!0,...N}),l.shift({...N})],whileElementsMounted:l.autoUpdate}),[F,M]=t(!1),O=o(null),L=o(null),b=l.useRole(E,{role:"dialog"}),S=l.useDismiss(E),{getReferenceProps:$,getFloatingProps:z}=l.useInteractions([b,S]);n((()=>()=>{O.current&&clearTimeout(O.current),L.current&&clearTimeout(L.current)}),[]);const B={isOpen:D,handleOpenChange:H,floatingRefs:W,floatingStyles:A,floatingContext:E,arrowRef:x,getReferenceProps:$,getFloatingProps:z,rootClass:P,rootTriggerClass:w,closeWithDelay:()=>{M(!0),L.current&&clearTimeout(L.current),h<=0?H(!1):L.current=setTimeout((()=>{M((e=>(e&&H(!1),e)))}),h)},closeWithoutDelay:()=>{H(!1)},openWithDelay:()=>{M(!1),L.current&&clearTimeout(L.current),O.current&&clearTimeout(O.current),g<=0?H(!0):O.current=setTimeout((()=>{H(!0)}),g)}};return a(f.Provider,{value:B,children:a("div",{ref:R,className:u(P&&`${P}-root`,m),"data-slot":"hover-card-root",...v,children:e})})}));h.displayName=p;const y=r((({children:e,className:r="",...o},t)=>{const{floatingRefs:n,getReferenceProps:i,closeWithDelay:c,openWithDelay:m,rootTriggerClass:g}=s(f),p=l.useMergeRefs([n.setReference,t]);return a(d.span,{ref:p,className:u(g,r),...i({"data-slot":"hover-card-trigger",onMouseEnter:m,onMouseLeave:c,...o}),children:e})}));y.displayName="HoverCardTrigger";const C=r((({children:e,rootElement:r,...o},i)=>{const c=s(m),[u,d]=t(null);return n((()=>{const e=(r&&"current"in r?r.current:r)||c?.portalRootRef.current||c?.containerRef.current||document.body;d(e)}),[r,c]),u?a(l.Portal,{root:u,...o,children:e}):null}));C.displayName="HoverCardPortal";const v=r((({children:e,className:r,size:o="",...t},i)=>{const{isOpen:c,floatingRefs:d,floatingStyles:m,getFloatingProps:p,rootClass:h,closeWithDelay:y,openWithDelay:C,closeWithoutDelay:v}=s(f);n((()=>{if(!c)return;const e=()=>v();return window.addEventListener("scroll",e),()=>{window.removeEventListener("scroll",e)}}),[v,c]);const R=l.useMergeRefs([d.setFloating,i]),P=g("hover-card",{size:o});return c?a("div",{className:u(h,r),ref:R,style:m,...P,...p({"data-slot":"hover-card-content",onPointerEnter:C,onPointerLeave:y,...t}),children:e}):null}));v.displayName="HoverCardContent";const R=r(((e,r)=>{const{floatingContext:o,arrowRef:t,rootClass:n}=s(f),i=l.useMergeRefs([t,r]);return a(l.Arrow,{className:u(n&&`${n}-arrow`),"data-slot":"hover-card-arrow",...e,context:o,ref:i})}));R.displayName="HoverCardArrow";const P=r(((e,r)=>(console.warn("Direct usage of HoverCard is not supported. Please use HoverCard.Root, HoverCard.Trigger, etc. instead."),null)));P.displayName="HoverCard",P.Root=h,P.Trigger=y,P.Portal=C,P.Content=v,P.Arrow=R;export{P as default};
|
package/dist/components/Link.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
'use client';import{jsx as s}from"react/jsx-runtime";import r from"react";import{c as o}from"./clsx-BaVHROc5.js";import{u as e}from"./useComponentClass-QwNivz0h.js";import{a,b as m,c as
|
|
1
|
+
'use client';import{jsx as s}from"react/jsx-runtime";import r from"react";import{c as o}from"./clsx-BaVHROc5.js";import{u as e}from"./useComponentClass-QwNivz0h.js";import{a,b as m,c as i}from"./index-eAZUMNef.js";import{P as t}from"./index-XF8itt-H.js";import"./ThemeContext-Sm-iNANd.js";import"./mergeProps-0RucjqeH.js";const c="Link",l=r.forwardRef((({children:r,href:l="#",customRootClass:n,className:f,size:p="",color:d="",asChild:h=!1,...j},u)=>{const x=e(n,c),C=a(i("link",{size:p}),m(d)),N=t.a;return s(N,{ref:u,asChild:h,href:l,className:o(x,f),...C,...j,children:r})}));l.displayName=c;export{l as default};
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
import React, { ElementRef, CSSProperties, ComponentPropsWithoutRef } from 'react';
|
|
2
|
+
import Primitive from '~/core/primitives/Primitive';
|
|
3
|
+
|
|
4
|
+
type LiveRegionPoliteness = 'polite' | 'assertive' | 'off';
|
|
5
|
+
type LiveRegionRole = 'status' | 'alert' | 'log';
|
|
6
|
+
type LiveRegionRelevant = 'additions' | 'removals' | 'text' | 'all' | 'additions text';
|
|
7
|
+
type LiveRegionElement = ElementRef<typeof Primitive.div>;
|
|
8
|
+
type LiveRegionProps = {
|
|
9
|
+
/**
|
|
10
|
+
* Controls how urgently assistive technology should announce updates.
|
|
11
|
+
*/
|
|
12
|
+
politeness?: LiveRegionPoliteness;
|
|
13
|
+
/**
|
|
14
|
+
* Landmark role for the live region. `status` is appropriate for most
|
|
15
|
+
* non-blocking updates; use `alert` for urgent errors.
|
|
16
|
+
*/
|
|
17
|
+
role?: LiveRegionRole;
|
|
18
|
+
/**
|
|
19
|
+
* Whether assistive technology should announce the full region on updates.
|
|
20
|
+
*/
|
|
21
|
+
atomic?: boolean;
|
|
22
|
+
/**
|
|
23
|
+
* Describes which changes should be announced.
|
|
24
|
+
*/
|
|
25
|
+
relevant?: LiveRegionRelevant;
|
|
26
|
+
/**
|
|
27
|
+
* Marks the region as temporarily busy while related updates are pending.
|
|
28
|
+
*/
|
|
29
|
+
busy?: boolean;
|
|
30
|
+
/**
|
|
31
|
+
* Keeps the live region in the accessibility tree while visually hiding it.
|
|
32
|
+
*/
|
|
33
|
+
visuallyHidden?: boolean;
|
|
34
|
+
customRootClass?: string;
|
|
35
|
+
style?: CSSProperties;
|
|
36
|
+
} & Omit<ComponentPropsWithoutRef<typeof Primitive.div>, 'role' | 'aria-live' | 'aria-atomic' | 'aria-relevant' | 'aria-busy'>;
|
|
37
|
+
declare const LiveRegion: React.ForwardRefExoticComponent<{
|
|
38
|
+
/**
|
|
39
|
+
* Controls how urgently assistive technology should announce updates.
|
|
40
|
+
*/
|
|
41
|
+
politeness?: LiveRegionPoliteness;
|
|
42
|
+
/**
|
|
43
|
+
* Landmark role for the live region. `status` is appropriate for most
|
|
44
|
+
* non-blocking updates; use `alert` for urgent errors.
|
|
45
|
+
*/
|
|
46
|
+
role?: LiveRegionRole;
|
|
47
|
+
/**
|
|
48
|
+
* Whether assistive technology should announce the full region on updates.
|
|
49
|
+
*/
|
|
50
|
+
atomic?: boolean;
|
|
51
|
+
/**
|
|
52
|
+
* Describes which changes should be announced.
|
|
53
|
+
*/
|
|
54
|
+
relevant?: LiveRegionRelevant;
|
|
55
|
+
/**
|
|
56
|
+
* Marks the region as temporarily busy while related updates are pending.
|
|
57
|
+
*/
|
|
58
|
+
busy?: boolean;
|
|
59
|
+
/**
|
|
60
|
+
* Keeps the live region in the accessibility tree while visually hiding it.
|
|
61
|
+
*/
|
|
62
|
+
visuallyHidden?: boolean;
|
|
63
|
+
customRootClass?: string;
|
|
64
|
+
style?: CSSProperties;
|
|
65
|
+
} & Omit<React.ComponentPropsWithoutRef<React.ForwardRefExoticComponent<((React.InputHTMLAttributes<HTMLInputElement> & {
|
|
66
|
+
asChild?: boolean;
|
|
67
|
+
}) | (React.HTMLAttributes<HTMLElement> & {
|
|
68
|
+
asChild?: boolean;
|
|
69
|
+
children?: React.ReactNode;
|
|
70
|
+
})) & React.RefAttributes<HTMLElement>>>, "role" | "aria-atomic" | "aria-busy" | "aria-live" | "aria-relevant"> & React.RefAttributes<HTMLElement>>;
|
|
71
|
+
|
|
72
|
+
export { LiveRegion as default };
|
|
73
|
+
export type { LiveRegionElement, LiveRegionProps };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
'use client';import{jsx as e}from"react/jsx-runtime";import{forwardRef as t}from"react";import{c as o}from"./clsx-BaVHROc5.js";import{P as i}from"./index-XF8itt-H.js";import{u as r}from"./useComponentClass-QwNivz0h.js";import"./mergeProps-0RucjqeH.js";import"./ThemeContext-Sm-iNANd.js";const s="LiveRegion",a={position:"absolute",width:"1px",height:"1px",margin:"-1px",border:"0",padding:"0",whiteSpace:"nowrap",clip:"rect(0 0 0 0)",clipPath:"inset(50%)",overflow:"hidden",pointerEvents:"none",userSelect:"none"},n=t((({children:t,customRootClass:n,className:l,politeness:m="polite",role:p=("assertive"===m?"alert":"status"),atomic:c=!0,relevant:d="additions text",busy:u,visuallyHidden:v=!0,style:h,...x},f)=>{const g=r(n,s),j=v?{...a,...h}:h;return e(i.div,{ref:f,role:p,"aria-live":m,"aria-atomic":c,"aria-relevant":d,"aria-busy":u,"data-slot":"live-region-root",className:o(g,l),style:j,...x,children:t})}));n.displayName=s;export{n as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
'use client';import{jsx as e,Fragment as n}from"react/jsx-runtime";import t,{forwardRef as i,useState as s,useRef as o,useContext as l,useEffect as a}from"react";import{F as r}from"./index-Db-tduwt.js";import{u as d}from"./index-wRElCyvx.js";import{u as c}from"./index-UODM4mVT.js";import{P as u}from"./index-XF8itt-H.js";import{B as f}from"./index-CfC8-kd8.js";import{T as m}from"./ThemeContext-Sm-iNANd.js";const p=t.createContext(null),g=i((({children:n,className:i,open:l,onOpenChange:a,defaultOpen:u=!1,crossAxisOffset:f,mainAxisOffset:m,collisionBoundary:g=null,collisionPadding:h=4,loop:v=!0,placement:x="bottom-start",avoidCollision:y=!0,rtl:P=!1,...N},b)=>{const[C,I]=d(l,u,a);c(C);const[R,O]=s(null),[F,M]=s(void 0),A=o([]),k=o([]),w=o([]),T=o(null),j=r.useFloatingNodeId(),S=r.useFloatingParentNodeId(),B=null!=S,H=f??0,D=void 0!==m?m:B?14:4,L=(Array.isArray(g)?g:[g]).filter((e=>null!=e)),E=L.length>0?{boundary:L,altBoundary:!0}:{},K={mainAxis:y,crossAxis:y&&!B,padding:h,...E},$={padding:h,crossAxis:!B,...E},z={padding:h,...E},{refs:U,floatingStyles:W,context:X}=r.useFloating({open:C,nodeId:j,onOpenChange:I,strategy:"fixed",transform:!1,placement:B?"right-start":x,middleware:[r.offset({mainAxis:D,crossAxis:H}),...y?[r.flip(K),r.shift($)]:[],...B?[]:[r.size({...z,apply({availableHeight:e,elements:n}){M(e),n.floating.style.maxHeight=`${e}px`}})]],whileElementsMounted:r.autoUpdate}),Y=r.useListNavigation(X,{listRef:k,activeIndex:R,nested:B,rtl:P,loop:v,onNavigate:O}),q=r.useClick(X,{}),G=r.useHover(X,{enabled:B,delay:{open:75},handleClose:r.safePolygon({blockPointerEvents:!0})}),J=r.useDismiss(X,{bubbles:!0}),Q=r.useTypeahead(X,{listRef:w,onMatch:C?O:void 0,activeIndex:R}),{getReferenceProps:V,getFloatingProps:Z,getItemProps:_}=r.useInteractions([J,q,Y,G,Q]),ee={isOpen:C,setIsOpen:I,refs:U,floatingStyles:W,maxHeight:F,getReferenceProps:V,getFloatingProps:Z,getItemProps:_,activeIndex:R,setActiveIndex:O,listRef:A,elementsRef:k,labelsRef:w,virtualItemRef:T,nodeId:j,isNested:B,floatingContext:X,rtl:P},ne=r.useFloatingTree();return t.useEffect((()=>{if(ne)return ne.events.on("click",e),()=>{ne.events.off("click",e)};function e(){I(!1)}}),[ne,j,S]),e("div",{ref:b,className:i,"data-tree":"true",...N,children:e(p.Provider,{value:ee,children:e(r.FloatingNode,{id:j,children:n})})})}));g.displayName="MenuComponentRoot";const h=i((({children:n,className:t,open:i,onOpenChange:s,defaultOpen:o=!1,crossAxisOffset:l,mainAxisOffset:a,collisionBoundary:d,collisionPadding:c,...u},f)=>e(r.FloatingTree,{children:e(g,{ref:f,className:t,open:i,onOpenChange:s,defaultOpen:o,crossAxisOffset:l,mainAxisOffset:a,collisionBoundary:d,collisionPadding:c,...u,children:n})})));h.displayName="MenuPrimitiveRoot";const v=i((({children:n,className:i,label:s,disabled:o,asChild:l=!1,onSelect:a,...d},c)=>{const f=t.useContext(p),m=o?null:s,{ref:g,index:h}=r.useListItem({label:m}),v=r.useFloatingTree(),x=t.useCallback((e=>{"function"==typeof g?g(e):g&&(g.current=e),"function"==typeof c?c(e):c&&(c.current=e)}),[g,c]);if(!f)return null;const{activeIndex:y,getItemProps:P}=f,N=y===h,{onClick:b,onKeyDown:C,...I}=d;return e(u.button,{ref:x,tabIndex:N?0:-1,className:i,...P({...I,disabled:o,onClick(e){o||(b?.(e),e.defaultPrevented||(a?a(e):v?.events.emit("click")))},onKeyDown(e){C?.(e)}}),asChild:l,children:n})}));v.displayName="MenuPrimitiveItem";const x=i((({children:n,className:t,asChild:i,...s},o)=>{const a=l(p),{ref:d,index:c}=r.useListItem(),u=r.useMergeRefs([a?.refs.setReference,d,o]);if(!a)return null;const{activeIndex:m,getReferenceProps:g,isNested:h}=a;return e(f,{ref:u,...g({...s,className:t,tabIndex:h?m===c?0:-1:void 0}),asChild:i,children:n})}));x.displayName="MenuPrimitiveTrigger";const y=i((({children:t,className:i,initialFocus:s,focusManagerDisabled:o=!1,...a},d)=>{const c=l(p),u=r.useMergeRefs([c?.refs.setFloating,d]);if(!c||!c.isOpen)return null;const{floatingStyles:f,getFloatingProps:m,elementsRef:g,labelsRef:h,isNested:v,floatingContext:x,maxHeight:y}=c,P=a.style,N={...a};delete N.style;const b={overflowY:"auto",overflowX:"hidden",maxHeight:void 0!==y?`${y}px`:void 0,WebkitOverflowScrolling:"touch",overscrollBehavior:"contain"};return e(n,{children:e(r.FloatingList,{elementsRef:g,labelsRef:h,children:e(r.FocusManager,{context:x,disabled:o,modal:!1,initialFocus:s??(v?-1:0),returnFocus:!v,children:e("div",{ref:u,...m({...N,className:i,style:{...P,...f}}),children:e("div",{style:b,children:t})})})})})}));y.displayName="MenuPrimitiveContent";const P=i((({children:n,className:t,open:i,onOpenChange:s,defaultOpen:o=!1,...a},r)=>{const d=l(p);return e(g,{ref:r,className:t,open:i,onOpenChange:s,defaultOpen:o,rtl:d&&d.rtl||!1,...a,children:n})}));P.displayName="MenuPrimitiveSub";const N=i((({children:n,...t},i)=>{const o=l(p),d=l(m),[c,u]=s(!1),f=d?.portalRootRef.current??d?.containerRef.current??document.body;if(a((()=>{f&&u(!0)}),[f]),!o)return null;const{isOpen:g}=o;return g&&c?e(r.Portal,{root:f,...t,children:e("div",{ref:i,children:n})}):null}));N.displayName="MenuPrimitivePortal";const b=()=>(console.warn("Direct usage of MenuPrimitive is not supported. Please use MenuPrimitive.Root, MenuPrimitive.Item instead."),null);b.Root=h,b.Item=v,b.Trigger=x,b.Content=y,b.Sub=P,b.Portal=N;export{b as M,p as a};
|
|
@@ -14,11 +14,6 @@ type MenuPrimitiveItemProps = {
|
|
|
14
14
|
onSelect?: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
|
|
15
15
|
};
|
|
16
16
|
|
|
17
|
-
type MenuPrimitiveContentProps = {
|
|
18
|
-
children: React__default.ReactNode;
|
|
19
|
-
className?: string;
|
|
20
|
-
};
|
|
21
|
-
|
|
22
17
|
type MenuPrimitiveTriggerProps = {
|
|
23
18
|
children: React__default.ReactNode;
|
|
24
19
|
className?: string;
|
|
@@ -111,7 +106,12 @@ declare const Menubar: {
|
|
|
111
106
|
Content: React$1.ForwardRefExoticComponent<{
|
|
112
107
|
children: React.ReactNode;
|
|
113
108
|
className?: string;
|
|
114
|
-
} & Omit<
|
|
109
|
+
} & Omit<{
|
|
110
|
+
children: React.ReactNode;
|
|
111
|
+
className?: string;
|
|
112
|
+
initialFocus?: number;
|
|
113
|
+
focusManagerDisabled?: boolean;
|
|
114
|
+
} & React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
115
115
|
Portal: React$1.ForwardRefExoticComponent<{
|
|
116
116
|
children: React.ReactNode;
|
|
117
117
|
} & Omit<{
|