@infinityfx/fluid 1.4.15 → 1.4.17
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.
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import{jsxs as t,Fragment as e,jsx as n}from"react/jsx-runtime";import{combineClasses as r,combineRefs as i}from"../../core/utils.js";import{useId as o,useRef as a,useState as
|
|
2
|
+
import{jsxs as t,Fragment as e,jsx as n}from"react/jsx-runtime";import{combineClasses as r,combineRefs as i}from"../../core/utils.js";import{useId as o,useRef as a,useState as c,useEffect as s,isValidElement as l,cloneElement as u}from"react";import{createPortal as d}from"react-dom";import{createStyles as f}from"../../core/style.js";const m={count:0},p=f("tooltip",{".anchor":{position:"absolute",pointerEvents:"none"},'.anchor[data-position="top"]':{bottom:"calc(100% + var(--f-spacing-sml))",left:"50%"},'.anchor[data-position="left"]':{right:"calc(100% + var(--f-spacing-sml))",top:"50%"},'.anchor[data-position="right"]':{left:"calc(100% + var(--f-spacing-sml))",top:"50%"},'.anchor[data-position="bottom"]':{top:"calc(100% + var(--f-spacing-sml))",left:"50%"},".tooltip":{position:"fixed",left:0,top:0,zIndex:999,backgroundColor:"var(--f-clr-grey-200)",color:"var(--f-clr-text-100)",fontSize:"var(--f-font-size-xsm)",fontWeight:600,textAlign:"center",padding:".3em .5em",borderRadius:"var(--f-radius-sml)",pointerEvents:"none",transition:"opacity .2s, translate .2s"},'.tooltip[aria-hidden="true"]':{opacity:0,translate:"0px 4px"}});function h({children:f,cc:h={},content:g,position:v="auto",visibility:x="interact",delay:b=.3,...y}){const w=r(p,h),E=o(),W=a(null),A=a(null),L=a(null),F=a({visible:!1,touchOnly:!1,timeout:void 0,maxWidth:void 0,offset:0}),[$,C]=c(!1),[M,O]=c(!1),[j,z]=c(v);function B(t,e=0){if(clearTimeout(F.current.timeout),null!==t){if(L.current&&A.current){let{left:t,top:e,right:n,bottom:r,width:i}=L.current.getBoundingClientRect();n=window.innerWidth-n,r=window.innerHeight-r;const o="auto"!==v?v:{[t]:"left",[e]:"top",[n]:"right",[r]:"bottom"}[Math.max(t,e,n,r)];if(["left","right"].includes(o))F.current.maxWidth=Math.max(t,n),F.current.offset=0;else{const e=t+i/2,n=window.innerWidth-e;F.current.maxWidth=void 0,F.current.offset=Math.max(A.current.offsetWidth-2*Math.min(e,n),0)*(e<n?1:-1)}z(o)}if(!t||"never"===x){F.current.touchOnly=!1;const t="always"===x;return t!==F.current.visible&&setTimeout((()=>m.count+=t?1:-1),200),O(F.current.visible=t)}m.count&&(e=0),F.current.visible||m.count++,F.current.visible=!0,F.current.timeout=setTimeout((()=>{O(!0)}),1e3*e)}}return s((()=>{$||C(!0);const t=L.current,e=new AbortController,n=e.signal;if(!t)return;let r;cancelAnimationFrame(r),r=requestAnimationFrame((function t(){if(W.current&&A.current){const{x:t,y:e}=W.current.getBoundingClientRect(),n={top:"-50%, -100%",left:"-100%, -50%",right:"0%, -50%",bottom:"-50%, 0%"}[j],r=A.current.style;r.transform=`translate(${t}px, ${e}px) translate(${n})`,r.left=`${F.current.offset}px`,r.maxWidth=`${F.current.maxWidth}px`}r=requestAnimationFrame(t)})),window.addEventListener("touchstart",(e=>{e.target===t||t.contains(e.target)?(F.current.touchOnly=!0,B(!0,b+.05)):B(!1)}),{signal:n});const i=t=>{F.current.touchOnly||t instanceof FocusEvent&&t.target instanceof Element&&!t.target.matches(":focus-visible")||B(!0,b)};return t.addEventListener("mouseenter",i,{signal:n}),t.addEventListener("focus",i,{signal:n}),t.addEventListener("mouseleave",(()=>B(!1)),{signal:n}),t.addEventListener("blur",(()=>B(!1)),{signal:n}),t.addEventListener("touchend",(()=>B(null)),{signal:n}),()=>{cancelAnimationFrame(r),e.abort()}}),[x,v,j,b]),s((()=>B("always"===x)),[x]),f=Array.isArray(f)?f[0]:f,l(f)?t(e,{children:[u(f,{...y,"aria-describedby":E,ref:i(L,y.ref,f.props.ref)}),L.current&&d(n("div",{ref:W,className:w.anchor,"data-position":j}),L.current),$&&d(n("div",{ref:A,id:E,role:"tooltip",className:w.tooltip,"aria-hidden":!M,children:g}),document.getElementById("__fluid"))]}):f}export{h as default};
|
|
3
3
|
//# sourceMappingURL=tooltip.js.map
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import{jsxs as a,jsx as r}from"react/jsx-runtime";import{useId as e,useState as i,useRef as t,Fragment as o}from"react";import{combineClasses as n,classes as l}from"../../core/utils.js";import{createStyles as s}from"../../core/style.js";import{Icon as d}from"../../core/icons.js";import c from"../feedback/halo.js";import{Morph as m}from"@infinityfx/lively/layout";import{Animatable as u}from"@infinityfx/lively";import{useTrigger as b}from"@infinityfx/lively/hooks";const f=s("pagination",{".pagination":{display:"flex",gap:"var(--f-spacing-xsm)"},".pill":{gap:"var(--f-spacing-xxs)"},".s__xsm":{fontSize:"var(--f-font-size-xxs)"},".s__sml":{fontSize:"var(--f-font-size-xsm)"},".s__med":{fontSize:"var(--f-font-size-sml)"},".s__lrg":{fontSize:"var(--f-font-size-med)"},".buttons":{display:"grid",gap:"inherit",gridAutoFlow:"column"},".buttons .layer":{width:"100%",height:"100%",borderRadius:"var(--f-radius-sml)",transition:"background-color .35s"},".pagination:not(.v__minimal) .layer":{backgroundColor:"var(--f-clr-fg-100)"},'.pagination[aria-disabled="true"] .layer':{backgroundColor:"var(--f-clr-grey-100)"},".button":{overflow:"hidden",position:"relative",border:"none",outline:"none",background:"none",color:"var(--f-clr-text-100)",width:"2.6em",height:"2.6em",display:"flex",alignItems:"center",justifyContent:"center",borderRadius:"var(--f-radius-sml)",fontWeight:500,transition:"background-color .35s, color .35s",WebkitTapHighlightColor:"transparent"},".buttons .button":{backgroundColor:"transparent !important"},".pagination:not(.v__minimal) .button:enabled":{backgroundColor:"var(--f-clr-fg-100)"},".button:enabled":{cursor:"pointer"},".button:disabled":{backgroundColor:"var(--f-clr-grey-100)",color:"var(--f-clr-grey-500)"},'.button[aria-current="page"]':{color:"var(--f-clr-text-200)"},".pagination .layer.selection":{backgroundColor:"var(--color, var(--f-clr-primary-100))",boxShadow:"var(--f-shadow-sml)"},".v__neutral .layer.selection":{backgroundColor:"var(--f-clr-text-100)"},'.pagination[aria-disabled="true"] .layer.selection':{backgroundColor:"var(--f-clr-grey-200)"},".round .button":{borderRadius:"99px"},".round .layer":{borderRadius:"99px"},".pill > .button:first-child":{borderTopLeftRadius:"1.3em",borderBottomLeftRadius:"1.3em"},".pill > .button:last-child":{borderTopRightRadius:"1.3em",borderBottomRightRadius:"1.3em"},".indices":{width:"7.8em",height:"2.6em",display:"flex"},".indices > *":{width:"2.6em",height:"2.6em",display:"flex",alignItems:"center",justifyContent:"center"}});function p({cc:s={},pages:p,defaultPage:g=0,page:h,onChange:y,compact:v,skipable:x,shape:k="square",size:C,variant:_,disabled:w,color:N,...R}){const z=n(f,s),j=e(),M=b(),[S,T]=void 0!==h?[h,y]:i(g);function $(){const a=Math.min(p,3);return new Array(a).fill(0).map(((r,e)=>e?e<a-1?Math.min(Math.max(S,1),p-2):x?Math.max(Math.min(S+1,p-1),2):p-1:x?Math.min(Math.max(S-1,0),p-3):0))}const A=t($()),B=a=>{A.current=$(),T?.(a),y?.(a),M()},I=S<1||w,L=S>=p-1||w;return a("div",{...R,style:{...R.style,"--color":N},role:"navigation","aria-disabled":w,className:l(z.pagination,z[`s__${C}`],z[`v__${_}`],z[k],R.className),children:[x&&r(c,{disabled:I,children:r("button",{disabled:I,"aria-label":"1",className:z.button,onClick:()=>B(0),children:r(d,{type:"first"})})}),r(c,{disabled:I,children:r("button",{disabled:I,"aria-label":S+"",className:z.button,onClick:()=>B(S-1),children:r(d,{type:"left"})})}),!v&&r("div",{className:z.buttons,children:$().map(((e,i)=>{const t=A.current[i],n={gridColumn:i+1,gridRow:1};return a(o,{children:[r("div",{className:z.layer,style:n}),e===S&&r(m,{group:`${j}-pagination-selection`,cachable:["x"],transition:{duration:.35},children:r("div",{className:l(z.layer,z.selection),style:n})}),r(c,{disabled:w,children:r("button",{type:"button",disabled:w,className:l(z.button,z.index),style:n,"aria-current":e===S?"page":void 0,onClick:()=>B(e),children:r(u,{animations:{forward:{translate:["33.3% 0%","0% 0%"],duration:.35},back:{translate:["-33.3% 0%","0% 0%"],duration:.35}},triggers:[{name:"forward",on:t-e<0&&M,immediate:!0},{name:"back",on:t-e>0&&M,immediate:!0}],children:a("div",{className:z.indices,children:[r("span",{children:t+1}),r("span",{children:e+1}),r("span",{children:t+1})]})})})})]},i)}))}),r(c,{disabled:L,children:r("button",{disabled:L,"aria-label":S+2+"",className:z.button,onClick:()=>B(S+1),children:r(d,{type:"right"})})}),x&&r(c,{disabled:L,children:r("button",{disabled:L,"aria-label":p+"",className:z.button,onClick:()=>B(p-1),children:r(d,{type:"last"})})})]})}export{p as default};
|
|
2
|
+
import{jsxs as a,jsx as r}from"react/jsx-runtime";import{useId as e,useState as i,useRef as t,Fragment as o}from"react";import{combineClasses as n,classes as l}from"../../core/utils.js";import{createStyles as s}from"../../core/style.js";import{Icon as d}from"../../core/icons.js";import c from"../feedback/halo.js";import{Morph as m}from"@infinityfx/lively/layout";import{Animatable as u}from"@infinityfx/lively";import{useTrigger as b}from"@infinityfx/lively/hooks";const f=s("pagination",{".pagination":{display:"flex",gap:"var(--f-spacing-xsm)"},".pill":{gap:"var(--f-spacing-xxs)"},".s__xsm":{fontSize:"var(--f-font-size-xxs)"},".s__sml":{fontSize:"var(--f-font-size-xsm)"},".s__med":{fontSize:"var(--f-font-size-sml)"},".s__lrg":{fontSize:"var(--f-font-size-med)"},".buttons":{display:"grid",gap:"inherit",gridAutoFlow:"column"},".buttons .layer":{width:"100%",height:"100%",borderRadius:"var(--f-radius-sml)",transition:"background-color .35s"},".pagination:not(.v__minimal) .layer":{backgroundColor:"var(--f-clr-fg-100)"},'.pagination[aria-disabled="true"] .layer':{backgroundColor:"var(--f-clr-grey-100)"},".button":{overflow:"hidden",position:"relative",border:"none",outline:"none",background:"none",color:"var(--f-clr-text-100)",width:"2.6em",height:"2.6em",display:"flex",alignItems:"center",justifyContent:"center",borderRadius:"var(--f-radius-sml)",fontWeight:500,transition:"background-color .35s, color .35s",WebkitTapHighlightColor:"transparent"},".buttons .button":{backgroundColor:"transparent !important"},".pagination:not(.v__minimal) .button:enabled":{backgroundColor:"var(--f-clr-fg-100)"},".button:enabled":{cursor:"pointer"},".button:disabled":{backgroundColor:"var(--f-clr-grey-100)",color:"var(--f-clr-grey-500)"},'.button[aria-current="page"]':{color:"var(--f-clr-text-200)"},".pagination .layer.selection":{backgroundColor:"var(--color, var(--f-clr-primary-100))",boxShadow:"var(--f-shadow-sml)"},".v__neutral .layer.selection":{backgroundColor:"var(--f-clr-text-100)"},'.pagination[aria-disabled="true"] .layer.selection':{backgroundColor:"var(--f-clr-grey-200)"},".round .button":{borderRadius:"99px"},".round .layer":{borderRadius:"99px"},".pill > .button:first-child":{borderTopLeftRadius:"1.3em",borderBottomLeftRadius:"1.3em"},".pill > .button:last-child":{borderTopRightRadius:"1.3em",borderBottomRightRadius:"1.3em"},".indices":{width:"7.8em",height:"2.6em",display:"flex"},".indices > *":{width:"2.6em",height:"2.6em",display:"flex",alignItems:"center",justifyContent:"center"}});function p({cc:s={},pages:p,defaultPage:g=0,page:h,onChange:y,compact:v,skipable:x,shape:k="square",size:C,variant:_,disabled:w,color:N,...R}){const z=n(f,s),j=e(),M=b(),[S,T]=void 0!==h?[h,y]:i(g);function $(){const a=Math.min(p,3);return new Array(a).fill(0).map(((r,e)=>e?e<a-1?Math.min(Math.max(S,1),p-2):x?Math.max(Math.min(S+1,p-1),2):p-1:x?Math.min(Math.max(S-1,0),p-3):0))}const A=t($()),B=a=>{A.current=$(),T?.(a),y?.(a),M()},I=S<1||w,L=S>=p-1||w;return a("div",{...R,style:{...R.style,"--color":N},role:"navigation","aria-disabled":w,className:l(z.pagination,z[`s__${C}`],z[`v__${_}`],z[k],R.className),children:[x&&r(c,{disabled:I,children:r("button",{disabled:I,"aria-label":"1",className:z.button,onClick:()=>B(0),children:r(d,{type:"first"})})}),r(c,{disabled:I,children:r("button",{disabled:I,"aria-label":S+"",className:z.button,onClick:()=>B(S-1),children:r(d,{type:"left"})})}),!v&&r("div",{className:z.buttons,children:$().map(((e,i)=>{const t=void 0!==A.current[i]?A.current[i]:e,n={gridColumn:i+1,gridRow:1};return a(o,{children:[r("div",{className:z.layer,style:n}),e===S&&r(m,{group:`${j}-pagination-selection`,cachable:["x"],transition:{duration:.35},children:r("div",{className:l(z.layer,z.selection),style:n})}),r(c,{disabled:w,children:r("button",{type:"button",disabled:w,className:l(z.button,z.index),style:n,"aria-current":e===S?"page":void 0,onClick:()=>B(e),children:r(u,{animations:{forward:{translate:["33.3% 0%","0% 0%"],duration:.35},back:{translate:["-33.3% 0%","0% 0%"],duration:.35}},triggers:[{name:"forward",on:t-e<0&&M,immediate:!0},{name:"back",on:t-e>0&&M,immediate:!0}],children:a("div",{className:z.indices,children:[r("span",{children:t+1}),r("span",{children:e+1}),r("span",{children:t+1})]})})})})]},i)}))}),r(c,{disabled:L,children:r("button",{disabled:L,"aria-label":S+2+"",className:z.button,onClick:()=>B(S+1),children:r(d,{type:"right"})})}),x&&r(c,{disabled:L,children:r("button",{disabled:L,"aria-label":p+"",className:z.button,onClick:()=>B(p-1),children:r(d,{type:"last"})})})]})}export{p as default};
|
|
3
3
|
//# sourceMappingURL=pagination.js.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@infinityfx/fluid",
|
|
3
|
-
"version": "1.4.
|
|
3
|
+
"version": "1.4.17",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "React UI library, using zero-runtime CSS-in-JS.",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -59,13 +59,13 @@
|
|
|
59
59
|
"glob": "^11.0.1"
|
|
60
60
|
},
|
|
61
61
|
"peerDependencies": {
|
|
62
|
-
"@infinityfx/lively": "^4.0.
|
|
62
|
+
"@infinityfx/lively": "^4.0.10",
|
|
63
63
|
"react": ">=19.0.0",
|
|
64
64
|
"react-dom": ">=19.0.0",
|
|
65
65
|
"react-icons": ">=5.4.0"
|
|
66
66
|
},
|
|
67
67
|
"devDependencies": {
|
|
68
|
-
"@infinityfx/lively": "^4.0.
|
|
68
|
+
"@infinityfx/lively": "^4.0.10",
|
|
69
69
|
"@rollup/plugin-commonjs": "^26.0.1",
|
|
70
70
|
"@rollup/plugin-node-resolve": "^15.2.3",
|
|
71
71
|
"@rollup/plugin-terser": "^0.4.4",
|