@snowball-tech/fractal
Version:
Fractal's (Snowball's design system) React component library based on RadixUI and TailwindCSS
2 lines • 4.15 kB
JavaScript
"use client";import{a as e}from"../constants-CW2-utNH.js";import{n as t,r as n}from"../helpers-DBEwVIlX.js";import{Typography as r}from"../Typography/Typography.js";import{Button as i}from"../Button/Button.js";import{DEFAULT_POSITION as a,GROUP_NAME as o}from"./Dialog.constants.js";import{Paper as s}from"../Paper/Paper.js";import{ScrollArea as c}from"../ScrollArea/ScrollArea.js";import{forwardRef as l,useEffect as ee,useImperativeHandle as u,useRef as d,useState as f}from"react";import p from"lodash/fp/isFunction.js";import m from"lodash/fp/isString.js";import h from"lodash/fp/omit.js";import{jsx as g,jsxs as _}from"react/jsx-runtime";import{UilTimes as v}from"@tooni/iconscout-unicons-react";import*as y from"@radix-ui/react-dialog";const b=l(({children:l,closeButtonLabel:b,condensed:x=!1,contentClassName:S,defaultOpen:C,disabled:w=!1,dismissable:T=!0,fullHeight:E=!1,fullWidth:D=!1,modal:O=!0,onClose:k,onDismiss:A,onInteractOutside:j,onOpen:M,onPointerDownOutside:N,onToggle:P,open:F,overlayStyle:I=`dark`,position:L=a,root:R,scrollable:z=!0,scrollbarOnHover:B=!0,title:V,trigger:H,wrapper:U,...W},G)=>{let K=d(null),q=d(null),J=d(null);u(G,()=>({get container(){return K?.current??null},get content(){return J?.current??null},get trigger(){return q?.current??null}}));let Y=!!H,X=!!l,[Z,Q]=f(F===!0||C===!0),$=e=>{if(w)return;let t=Z;Q(e),p(P)&&t!==e&&P(e),!t&&e&&p(M)&&M(),t&&!e&&p(k)&&k()};ee(()=>{$(F===!0||C===!0)},[C,F]);let te=e=>{let{target:t}=e;t===window||t==null||((K?.current?.contains(t)||J?.current?.contains(t))&&e.preventDefault(),p(j)&&j(e))},ne=e=>{let{target:t}=e;t===window||t==null||((K?.current?.contains(t)||J?.current?.contains(t))&&e.preventDefault(),p(N)&&N(e))};return g(`div`,{ref:K,className:n(`${e}-${o}`,Z?`${e}-${o}--opened`:`${e}-${o}--closed`,w?`${e}-${o}--disabled`:``,R?.className),...h([`className`],R),children:_(y.Root,{...w?{open:!1}:{open:Z},modal:O,onOpenChange:$,children:[g(y.Trigger,{ref:q,asChild:!m(H),className:t(`${e}-${o}__trigger`,m(H)?`appearance-none border-none bg-unset px-unset py-unset text-left text-color-unset outline-none`:``,Y?`flex items-center`:`invisible h-0 max-h-0 border-y-0 py-0`,w?`${e}-${o}__trigger--disabled cursor-default text-disabled`:`cursor-pointer`),children:Y&&H}),g(y.Portal,{children:Z&&g(y.Overlay,{className:t(`fractal-dialog__overlay`,`z-[9999] flex items-center justify-center`,`inset-0`,I===`none`?``:I===`light`?`bg-[rgba(255,251,244,0.8)]`:`bg-[rgba(0,0,0,0.7)]`),style:{position:L},children:g(y.Content,{ref:J,"aria-describedby":void 0,asChild:!0,className:n(`fractal-dialog__content`,`max-h-[calc(100dvh-theme(spacing.4))] max-w-[calc(100vw-theme(spacing.4))] transform-none to-xs:max-h-[100dvh] to-sm:max-h-[calc(100dvh-theme(spacing.2))] to-sm:w-full to-sm:max-w-[calc(100vw-theme(spacing.2))]`,E?`h-dvh`:``,W.className),onInteractOutside:te,onPointerDownOutside:ne,...h([`className`,`onInteractOutside`,`onPointerDownOutside`,`asChild`],W),children:_(s,{className:n(`w-full`,x?`pr-half`:`p-3 pr-half`,D?``:`w-fit to-sm:w-full`,E?`h-full`:``,U?.className),contentClassName:n(`flex w-full flex-col overflow-hidden`,x?`gap-3`:`gap-5`,E?`h-full`:``,U?.contentClassName),elevation:U?.elevation||`elevated`,style:{...U?.style,position:L},...h([`className`,`contentClassName`,`elevation`,`style`],U),children:[_(`div`,{className:t(`flex h-fit w-full flex-row justify-between gap-1`,x?`pr-one-and-half`:`pr-[calc(theme(spacing.3)-theme(spacing.half))]`),children:[g(y.Title,{asChild:!0,className:t(`fractal-dialog__title`,`flex-1`),children:g(r,{element:m(V)?void 0:`div`,variant:`heading-4`,children:V})}),T&&g(y.Close,{asChild:!0,className:`fractal-dialog__dismiss`,children:g(`div`,{className:`mt-half place-items-end text-right`,children:g(i,{icon:g(v,{}),iconOnly:!0,label:b||`Fermer`,variant:`text`,onClick:A})})})]}),X&&z?g(c,{className:E?`h-full`:``,contentClassName:n(`visible flex flex-col w-full`,E?`h-full`:``,x?`gap-3 pr-one-and-half`:`gap-5 pr-[calc(theme(spacing.3)-theme(spacing.half))]`,S),scrollbarOnHover:B,children:l}):l]})})})})]})})});b.displayName=`Dialog`;export{b as Dialog,b as default};
//# sourceMappingURL=Dialog.js.map