@snowball-tech/fractal
Version:
Fractal's (Snowball's design system) React component library based on RadixUI and PandaCSS
3 lines • 4.2 kB
JavaScript
'use client';
import{a as x}from"./chunk-PQNWZLJS.js";import{a as M}from"./chunk-XBL3ZKKI.js";import{a as o}from"./chunk-Q4ACHLJ4.js";import{a as w}from"./chunk-UC7BXZ7T.js";import{b as e}from"./chunk-CMFNILWJ.js";import{a,b,c as A}from"./chunk-KHPUS472.js";import*as l from"@radix-ui/react-dropdown-menu";import*as s from"@radix-ui/react-scroll-area";import{UilAngleRight as Q}from"@tooni/iconscout-unicons-react";import{forwardRef as W,useContext as P,useEffect as Z,useImperativeHandle as ee,useRef as E,useState as oe}from"react";import d from"lodash/fp/isFunction";import T from"lodash/fp/omit";import{jsx as r,jsxs as g}from"react/jsx-runtime";var I=W(({children:h,condensed:k=!1,condensedItems:F=!1,content:m,defaultOpen:O=!1,disabled:u=!1,icon:c,label:G,onClick:H,onClose:R,onInteractOutside:$,onOpen:D,onSubMenuOpenChange:S,open:p,withIndicator:L=!0,withScroll:q=!0,...i},B)=>{let v=E(null),_=E(null);ee(B,()=>({get content(){return _?.current??null},get trigger(){return v?.current??null}}));let y=!!h,[C,U]=oe(p===!0),f=n=>{if(u)return;let t=C;U(n),d(S)&&t!==n&&S(n),!t&&n&&d(D)&&D(),t&&!n&&d(R)&&R()};Z(()=>{f(p===!0)},[y,p]);let{condensed:V,disabled:z}=P(M),{condensed:X,disabled:Y}=P(x),j=u||Y||z,J=k||X||V,K=n=>{let{target:t}=n;t===window||t===null||t===void 0||((v?.current?.contains(t)||_?.current?.contains(t))&&n.preventDefault(),d($)&&$(n))},N=r(w,{className:a(`${e}-${o}__sub-menu__items`,u?`${e}-${o}__sub-menu__items--disabled`:A),element:"div",children:r(x.Provider,{value:{condensed:F,disabled:u},children:h})});return g(l.Sub,{...O?{defaultOpen:!0}:{},...u?{open:!1}:{open:C},onOpenChange:f,children:[r(l.SubTrigger,{asChild:!0,className:b(`${e}-${o}__sub-menu`,"flex w-full flex-row items-center gap-1","rounded-sm outline-none transition-background-color duration-300 ease-out",J?"max-h-6 px-2 py-1":"p-2",c?`${e}-${o}__sub-menu__with-icon`:"",j?`${e}-${o}__sub-menu--disabled cursor-not-allowed !bg-transparent text-disabled`:"cursor-pointer text-dark",i.className),onClick:H,...T(["className"],i),children:g("div",{className:a(`${e}-${o}__sub-menu__label`,"alternatee","flex w-full flex-row items-center gap-1",u?`${e}-${o}__sub-menu__label--disabled cursor-not-allowed text-disabled`:"cursor-pointer"),children:[c&&r("div",{className:a(`${e}-${o}__sub-menu__icon`,"max-h-3 max-w-3"),children:c}),r(w,{className:a("flex-1",u?"cursor-not-allowed":"cursor-pointer"),element:"label",children:G}),L&&r("div",{className:a(`${e}-${o}__sub-menu__indicator`,"max-h-3 max-w-3"),children:r(Q,{})})]})}),r(l.Portal,{children:r(l.SubContent,{ref:_,className:b(`${e}-${o}__sub-menu__content`,'pointer-events-auto relative z-50 -mt-1 overflow-hidden rounded-sm border-1 border-normal bg-white p-1 data-[side="bottom"]:mt-1 data-[side="left"]:mr-2 data-[side="right"]:ml-2 data-[side="top"]:mb-1',y?"":`${e}-${o}__sub-menu__content--empty invisible`,m?.className),loop:!0,style:{display:void 0,...m?.style},onInteractOutside:K,...T(["asChild","className","style","onInteractOutside"],m),children:q?g(s.Root,{className:`${e}-${o}__sub-menu__content__scrollarea`,...i.dir===void 0?{}:{dir:i.dir},type:"hover",children:[r(s.Viewport,{className:a(`${e}-${o}__sub-menu__content__scrollarea__viewport`,`relative h-full max-h-[calc(var(--radix-popper-available-height)-theme(spacing.4))] w-full overflow-auto [&:has(+_.${e}-${o}__sub-menu__content__scrollarea__scrollbar--y)]:w-[calc(100%-theme(spacing.1)+theme(spacing.quarter))]`),style:{overflowY:void 0},children:N}),r(s.Scrollbar,{className:a(`${e}-${o}__sub-menu__content__scrollarea__scrollbar--y`,'flex touch-none select-none rounded-r-sm bg-grey-90 p-quarter transition-background-color duration-300 ease-out hover:bg-grey-70 data-[orientation="vertical"]:w-1'),orientation:"vertical",children:r(s.Thumb,{className:a(`${e}-${o}__sub-menu__content__scrollarea__scrollbar--y__thumb`,"before:l-1/2 relative !w-half flex-1 rounded-sm bg-grey-30 before:absolute before:top-1/2 before:h-full before:min-h-[44px] before:w-full before:min-w-[44px] before:-translate-x-1/2 before:-translate-y-1/2 before:content-empty")})})]}):N})})]})});I.displayName="SubDropdown";var pe=I;export{I as a,pe as b};
//# sourceMappingURL=chunk-CV2EMOXA.js.map