UNPKG

@snowball-tech/fractal

Version:

Fractal's (Snowball's design system) React component library based on RadixUI and PandaCSS

3 lines 5.84 kB
'use client'; import{a as r,b as B}from"./chunk-H24RTHAD.js";import{c as z}from"./chunk-YHZZRBQ2.js";import{e as q}from"./chunk-WJB4GYBF.js";import{c as j}from"./chunk-LYTTDLE2.js";import{a as T}from"./chunk-AOLTZ2WJ.js";import{b as e}from"./chunk-CMFNILWJ.js";import{a as c,b as _}from"./chunk-XYM7TA65.js";import*as t from"@radix-ui/react-popover";import*as p from"@radix-ui/react-scroll-area";import{UilTimes as ie}from"@tooni/iconscout-unicons-react";import{forwardRef as ne,useEffect as se,useImperativeHandle as ce,useRef as F,useState as pe}from"react";import w from"lodash/fp/isFunction";import fe from"lodash/fp/isNumber";import G from"lodash/fp/isString";import I from"lodash/fp/omit";import{jsx as a,jsxs as $}from"react/jsx-runtime";var X=ne(({align:Y="center",children:g,closeButtonLabel:J,disabled:m=!1,elevation:K=B,fullWidth:O=!1,modal:Q=!1,onClose:L,onCloseButtonClick:Z,onInteractOutside:M,onOpen:D,onOpenChange:k,open:d,paper:R={},popover:y={},side:ee="bottom",title:l,toggleOnTriggerClick:u=!0,toggleOnTriggerHover:V=!1,trigger:H,triggerAsButton:U=!0,width:i="fit",withArrow:re=!0,withCloseButton:P=!1,withScroll:oe=!0,...v},ae)=>{let N=F(null),W=F(null),S=F(null);ce(ae,()=>({get container(){return N?.current??null},get content(){return S?.current??null},get trigger(){return W?.current??null}}));let h=!!H,f=h,b=!!g,[x,C]=pe(d===!0||!f&&b&&d!==!1),A=o=>{if(m)return;let s=x;C(o),w(k)&&s!==o&&k(o),!s&&o&&w(D)&&D(),s&&!o&&w(L)&&L()};se(()=>{A(!!(d===!0||!f&&b&&d!==!1))},[b,f,d]);let te=o=>{let{target:s}=o;s===window||s===null||s===void 0||((N?.current?.contains(s)||S?.current?.contains(s))&&o.preventDefault(),w(M)&&M(o))},n="max-w-[calc(var(--radix-popper-available-width)-theme(spacing.2))]",E={};if(fe(i))E={minWidth:`${i}px`,width:`${i}px`};else if(i.startsWith("*"))if(h){let o=i.slice(1);E={minWidth:`calc(${o} * var(--radix-popper-anchor-width))`,width:`calc(${o} * var(--radix-popper-anchor-width))`}}else n=`${n} w-fit`,console.warn("The `width` prop is set to a fraction but no `trigger` is provided! Falling back to `auto` (which will fit the content)...");else{switch(i){case"fit":{n=`${n} w-fit`;break}case"full":{n=`${n} w-[var(--radix-popper-available-width)]`;break}default:{n=`${n} ${h?'w-[var(--radix-popper-anchor-width,"100%")] min-w-fit':"w-fit"}`;break}}i==="trigger"&&!h&&console.warn("The `width` prop is set to `trigger` but no `trigger` is provided! Falling back to `auto` (which will fit the content)...")}let le=G(l)?l:j(l);return a("div",{ref:N,className:_(`${e}-${r}`,x?`${e}-${r}--opened`:`${e}-${r}--closed`,m?`${e}-${r}--disabled`:"",O?`${e}-${r}--full-width w-full`:"sm:w-fit",v.className),...I(["className"],v),children:$(t.Root,{...m?{open:!1}:{open:x},modal:Q,onOpenChange:A,children:[a(t.Trigger,{ref:W,asChild:f,className:c(`${e}-${r}__trigger`,"appearance-none border-none bg-unset px-unset py-unset text-left text-color-unset outline-none",i==="fit"||i==="full"?"":"max-w-[var(--radix-dropdown-menu-content-available-width)]",f?"flex items-center":"invisible h-0 max-h-0 border-y-0 py-0",m?`${e}-${r}__trigger--disabled cursor-default text-disabled`:"!cursor-pointer",u?"":"!cursor-default"),type:u?"button":void 0,children:f&&a(T,{className:c(`${e}-${r}__trigger__content`,"w-full",m?`${e}-${r}__trigger__content--disabled`:""),disabled:U&&!u,element:u&&U?"button":"div",onClick:o=>{u||(o.preventDefault(),o.stopPropagation())},onMouseEnter:V?()=>C(!0):void 0,onMouseLeave:V?()=>C(!1):void 0,children:H})}),a(t.Portal,{children:x&&a(t.Content,{ref:S,align:Y,asChild:!0,className:_(`${e}-${r}__popover`,'pointer-events-auto relative z-50 data-[side="bottom"]:mt-1 data-[side="left"]:mr-1 data-[side="right"]:ml-1 data-[side="top"]:mb-1',n,b?"":`${e}-${r}__popover--empty invisible`,y?.className),side:ee,style:{display:void 0,...E,...y.style},onInteractOutside:te,...I(["align","asChild","className","side","style","onInteractOutside"],y),children:$(z,{"aria-label":le,className:_("relative",R.className),contentClassName:R.contentClassName,elevation:K,...I(["className","contentClassName"],R),children:[(P||l)&&$("div",{className:c("flex flex-row items-center justify-between gap-1",l?"mb-2":""),children:[l&&a(T,{className:"w-full",element:G(l)?void 0:"div",variant:"body-1-bold",children:l}),P&&a(t.Close,{asChild:!0,className:c(`${e}-${r}__close`),children:a("div",{className:c("flex items-center justify-end text-right",l?"":"w-full"),children:a(q,{icon:a(ie,{}),iconOnly:!0,label:J||"Fermer",variant:"text",onClick:Z})})})]}),oe?$(p.Root,{className:`${e}-${r}__popover__scrollarea`,...v.dir===void 0?{}:{dir:v.dir},type:"hover",children:[a(p.Viewport,{className:c(`${e}-${r}__popover__scrollarea__viewport`,`relative h-full w-full overflow-auto [&:has(+_.${e}-${r}__popover__scrollarea__scrollbar--y)]:w-[calc(100%-theme(spacing.1)+theme(spacing.quarter))]`,P||l?l?"max-h-[calc(var(--radix-popper-available-height)-theme(spacing.6)-theme(spacing.4))]":"max-h-[calc(var(--radix-popper-available-height)-theme(spacing.6)-theme(spacing.6))]":"max-h-[calc(var(--radix-popper-available-height)-theme(spacing.6))]"),style:{overflowY:void 0},children:g}),a(p.Scrollbar,{className:c(`${e}-${r}__popover__scrollarea__scrollbar--y`,'[data-orientation="vertical"]:w-1 flex touch-none select-none rounded-r-sm bg-grey-90 p-quarter transition-background-color duration-300 ease-out hover:bg-grey-70'),orientation:"vertical",children:a(p.Thumb,{className:c(`${e}-${r}__popover__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")})})]}):g,re&&a(t.Arrow,{})]})})})]})})});X.displayName="Popover";var Pe=X;export{X as a,Pe as b}; //# sourceMappingURL=chunk-DZJSJNZD.js.map