@nild/components 0.0.29 → 0.0.30

package/dist/popup/Arrow.js

@@ -1 +1 @@
-import{jsx as i}from"react/jsx-runtime";import{usePopupContext as n,useArrowContext as m}from"./contexts/index.js";import{arrowClassNames as p}from"./style/index.js";const r=()=>{const{arrowed:o,size:s,refs:e}=n(),{style:t,orientation:a}=m();return o?i("div",{className:p({orientation:a,size:s}),style:t,ref:e.arrow}):null};r.displayName="Popup.Arrow";export{r as default};
+import{jsx as i}from"react/jsx-runtime";import{usePopupContext as m,useArrowContext as n}from"./contexts/index.js";import{arrowClassNames as p}from"./style/index.js";const r=()=>{const{arrowed:o,size:s,refs:e}=m(),{style:a,orientation:t}=n();return i("div",{className:p({arrowed:o,size:s,orientation:t}),style:a,ref:e.arrow})};r.displayName="Popup.Arrow";export{r as default};

package/dist/popup/Popup.js

@@ -1 +1 @@
-import{jsxs as V,jsx as a}from"react/jsx-runtime";import{useControllableState as q,useEffectCallback as m,useIsomorphicLayoutEffect as x}from"@nild/hooks";import{makeArray as B,isFunction as D}from"@nild/shared";import{Children as G,isValidElement as H,useMemo as J,useState as K,useRef as N}from"react";import Q from"../transition/Transition.js";import{PopupProvider as W,PortalProvider as X,ArrowProvider as Y}from"./contexts/index.js";import Z from"./hooks/usePopup.js";import _ from"./Portal.js";import P from"./Trigger.js";const T=({children:y,placement:f,offset:p,action:d="click",arrowed:E=!0,size:R="medium",open:S,defaultOpen:h=!1,disabled:g,onOpen:v,onClose:w})=>{let s,b,n;G.forEach(y,e=>{if(H(e))switch(e.type){case P:b=e;break;case _:n=e;break;default:s=e;break}});const i=J(()=>new Set(B(d)),[d]),[o,j]=K(h),[r,z]=q(S,h),t=N(),[{triggerRef:l,portalRef:u,portalContext:A,arrowRef:O,arrowContext:F},{update:k,autoUpdate:I}]=Z({placement:f,offset:p}),c=m(e=>{g||z(U=>{const C=D(e)?e(U):e;return C?v?.():w?.(),C})}),L=m(()=>{i.has("hover")&&(t.current&&clearTimeout(t.current),t.current=setTimeout(()=>{c(!0)},100))}),M=m(()=>{i.has("hover")&&(t.current&&clearTimeout(t.current),t.current=setTimeout(()=>{c(!1)},100))});return x(()=>{r&&!o?j(!0):r&&o&&k()},[r,o]),x(()=>{if(!(!l.current||!u.current||!r))return I(l.current,u.current,k)},[f,p,r]),V(W,{value:{actions:i,arrowed:E,size:R,refs:{trigger:l,portal:u,arrow:O},setOpen:c,enter:L,leave:M},children:[b||s&&a(P,{children:s}),a(X,{value:A,children:a(Y,{value:F,children:n&&a(Q,{visible:r,children:o&&n})})})]})};T.displayName="Popup";export{T as default};
+import{jsxs as B,jsx as s}from"react/jsx-runtime";import{useControllableState as D,useEffectCallback as f,useIsomorphicLayoutEffect as G}from"@nild/hooks";import{isArray as H,makeArray as J,isFunction as K}from"@nild/shared";import{Children as Q,isValidElement as U,useState as W,useMemo as X,useRef as Y}from"react";import Z from"../transition/Transition.js";import{PopupProvider as _,PortalProvider as $,ArrowProvider as ee}from"./contexts/index.js";import re from"./hooks/usePopup.js";import te from"./Portal.js";import C from"./Trigger.js";const k=({children:y,placement:g,offset:x,action:p="click",arrowed:P=!0,size:T="medium",delay:t=100,open:A,defaultOpen:d=!1,disabled:E,onOpen:h,onClose:v})=>{let i,w,n;Q.forEach(y,e=>{if(U(e))switch(e.type){case C:w=e;break;case te:n=e;break;default:i=e;break}});const[a,O]=W(d),[o,R]=D(A,d),[S,j=100]=H(t)?t:[t,t],l=X(()=>new Set(J(p)),[p]),r=Y(),[{triggerRef:u,portalRef:c,portalContext:z,arrowRef:F,arrowContext:I},{update:L,autoUpdate:M}]=re({placement:g,offset:x}),m=f(e=>{E||R(q=>{const b=K(e)?e(q):e;return b?h?.():v?.(),b})}),N=f(()=>{l.has("hover")&&(r.current&&clearTimeout(r.current),r.current=setTimeout(()=>{m(!0)},S))}),V=f(()=>{l.has("hover")&&(r.current&&clearTimeout(r.current),r.current=setTimeout(()=>{m(!1)},j))});return G(()=>{if(o&&!a)O(!0);else if(o&&a&&u.current&&c.current)return M(u.current,c.current,L)},[o,a]),B(_,{value:{actions:l,arrowed:P,size:T,refs:{trigger:u,portal:c,arrow:F},setOpen:m,enter:N,leave:V},children:[w||i&&s(C,{children:i}),s($,{value:z,children:s(ee,{value:I,children:n&&s(Z,{visible:o,children:a&&n})})})]})};k.displayName="Popup";export{k as default};

package/dist/popup/Portal.js

@@ -1 +1 @@
-import{jsxs as C,jsx as N}from"react/jsx-runtime";import{mergeRefs as v,cnMerge as r,getDPR as y}from"@nild/shared";import{forwardRef as P,Children as g,isValidElement as h,cloneElement as E}from"react";import{createPortal as M}from"react-dom";import R from"./Arrow.js";import{usePopupContext as j,usePortalContext as w}from"./contexts/index.js";import{portalContentClassNames as $,portalClassNames as z}from"./style/index.js";const o=P(({className:t,style:l,children:n,container:m=document.body,...i},p)=>{var s;const{size:f,refs:c,enter:d,leave:u}=j(),{coords:a}=w(),e=g.toArray(n).find(x=>h(x));return e?M(C("div",{...i,className:r(z(),t),style:{transform:`translate(${a.x}px, ${a.y}px)`,...y()>=1.5&&{willChange:"transform"},...l},onMouseEnter:d,onMouseLeave:u,ref:v(c.portal,p),children:[E(e,{...e.props,className:r($({size:f}),(s=e?.props)==null?void 0:s.className)}),N(R,{})]}),m):null});o.displayName="Popup.Portal";export{o as default};
+import{jsxs as E,jsx as M}from"react/jsx-runtime";import{useEffectCallback as t}from"@nild/hooks";import{mergeRefs as P,cnMerge as n,getDPR as g}from"@nild/shared";import{forwardRef as h,Children as R,isValidElement as b,cloneElement as j}from"react";import{createPortal as w}from"react-dom";import z from"./Arrow.js";import{usePopupContext as L,usePortalContext as $}from"./contexts/index.js";import{portalContentClassNames as k,portalClassNames as A}from"./style/index.js";const m=h(({className:i,style:p,children:f,container:u=document.body,...a},c)=>{var r;const{size:d,refs:v,enter:x,leave:C}=L(),{coords:l}=$(),s=R.toArray(f).find(o=>b(o)),N=t(o=>{var e;(e=a?.onMouseEnter)==null||e.call(a,o),x()}),y=t(o=>{var e;(e=a?.onMouseLeave)==null||e.call(a,o),C()});return s?w(E("div",{...a,className:n(A(),i),style:{transform:`translate(${l.x}px, ${l.y}px)`,...g()>=1.5&&{willChange:"transform"},...p},onMouseEnter:N,onMouseLeave:y,ref:P(v.portal,c),children:[j(s,{...s.props,className:n(k({size:d}),(r=s?.props)==null?void 0:r.className)}),M(z,{})]}),u):null});m.displayName="Popup.Portal";export{m as default};

package/dist/popup/index.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @category Components
+ */
 declare const Popup: import('react').FC<import('./interfaces').PopupProps> & {
     Trigger: import('react').FC<import('./interfaces').TriggerProps>;
     Portal: import('react').ForwardRefExoticComponent<import('./interfaces').PortalProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/popup/style/index.d.ts

@@ -4,4 +4,4 @@ export declare const portalClassNames: (props?: PortalProps | undefined) => stri
 export declare const portalContentClassNames: (props?: Pick<PopupProps, "size"> | undefined) => string;
 export declare const arrowClassNames: (props?: ({
     orientation: ArrowOrientation;
-} & Pick<PopupProps, "size">) | undefined) => string;
+} & Pick<PopupProps, "size" | "arrowed">) | undefined) => string;

package/dist/popup/style/index.js

@@ -1 +1 @@
-import{cva as r}from"@nild/shared";const e=r(["nd-popup-trigger"]),o=r(["nd-popup-portal",["absolute","top-0","left-0"]]),a=r(["bg-container","rounded-md",["outline-solid","outline-1","outline-edge"],"shadow-lg"],{variants:{size:{small:["px-2","py-1"],medium:["px-4","py-3"],large:["px-6","py-5"]}}}),t=r(["nd-popup-arrow","absolute","bg-container",["border-solid","border-edge"]],{variants:{orientation:{up:["transform-[translateY(-50%)_rotate(45deg)]",["rounded-tl-sm","border-l-1","border-t-1"]],down:["transform-[translateY(50%)_rotate(45deg)]",["rounded-br-sm","border-r-1","border-b-1"]],left:["transform-[translateX(-50%)_rotate(45deg)]",["rounded-bl-sm","border-l-1","border-b-1"]],right:["transform-[translateX(50%)_rotate(45deg)]",["rounded-tr-sm","border-r-1","border-t-1"]]},size:{small:["w-1.5","h-1.5"],medium:["w-3","h-3"],large:["w-4.5","h-4.5"]}}});export{t as arrowClassNames,o as portalClassNames,a as portalContentClassNames,e as triggerClassNames};
+import{cva as r}from"@nild/shared";const e=r(["nd-popup-trigger"]),a=r(["nd-popup-portal",["absolute","top-0","left-0"]]),o=r(["bg-container","rounded-md",["outline-solid","outline-1","outline-edge"],"shadow-lg"],{variants:{size:{small:["px-2","py-1"],medium:["px-4","py-3"],large:["px-6","py-5"]}}}),t=r(["nd-popup-arrow","absolute","bg-container",["border-solid","border-edge"]],{variants:{arrowed:{true:"",false:["opacity-0","invisible"]},size:{small:["w-1.5","h-1.5"],medium:["w-3","h-3"],large:["w-4.5","h-4.5"]},orientation:{up:["transform-[translateY(-50%)_rotate(45deg)]",["rounded-tl-sm","border-l-1","border-t-1"]],down:["transform-[translateY(50%)_rotate(45deg)]",["rounded-br-sm","border-r-1","border-b-1"]],left:["transform-[translateX(-50%)_rotate(45deg)]",["rounded-bl-sm","border-l-1","border-b-1"]],right:["transform-[translateX(50%)_rotate(45deg)]",["rounded-tr-sm","border-r-1","border-t-1"]]}}});export{t as arrowClassNames,a as portalClassNames,o as portalContentClassNames,e as triggerClassNames};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@nild/components",
   "private": false,
-  "version": "0.0.29",
+  "version": "0.0.30",
   "type": "module",
   "module": "./dist/index.js",
   "exports": {
@@ -32,8 +32,8 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "@nild/hooks": "0.0.15",
-    "@nild/shared": "0.0.13",
-    "@nild/icons": "0.0.14"
+    "@nild/icons": "0.0.14",
+    "@nild/shared": "0.0.13"
   },
   "scripts": {
     "build": "vite build --mode PROD",