@infinityfx/fluid 1.3.0 → 1.3.1
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{__rest as t}from"tslib";import{jsxs as e,Fragment as n,jsx as r}from"react/jsx-runtime";import{combineClasses as
|
|
2
|
+
import{__rest as t}from"tslib";import{jsxs as e,Fragment as n,jsx as r}from"react/jsx-runtime";import{combineClasses as i,combineRefs as o}from"../../core/utils.js";import{useId as a,useRef as s,useState as c,useEffect as l,isValidElement as d,cloneElement as u}from"react";import{createPortal as f}from"react-dom";import{createStyles as m}from"../../core/style.js";const p=m("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-fg-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 g(m){var{children:g,cc:h={},content:v,position:b="auto",visibility:y="interact",delay:x=.3}=m,w=t(m,["children","cc","content","position","visibility","delay"]);const E=i(p,h),A=a(),L=s(null),j=s(null),F=s(null),C=s(void 0),W=s(!1),[$,k]=c(!1),[z,B]=c(b),[R,q]=c("100vw"),I="auto"===b?z:b;function M(t,e=0){if(clearTimeout(C.current),null!==t){if(F.current){let{left:t,top:e,right:n,bottom:r,width:i}=F.current.getBoundingClientRect();n=window.innerWidth-n,r=window.innerHeight-r;const o="auto"!==b?b:{[t]:"left",[e]:"top",[n]:"right",[r]:"bottom"}[Math.max(t,e,n,r)];let a=t+i/2;switch(o){case"left":a=t;break;case"right":a=n;break;default:a=2*Math.min(window.innerWidth-a,a)}q(`calc(${a}px - var(--f-spacing-sml) * 2)`),B(o)}if(!t||"never"===y)return W.current=!1,k("always"===y);C.current=setTimeout((()=>{k(!0)}),1e3*e)}}let N;function O(){if(L.current&&j.current){const{x:t,y:e}=L.current.getBoundingClientRect(),n={top:"-50%, -100%",left:"-100%, -50%",right:"0%, -50%",bottom:"-50%, 0%"}[I];j.current.style.transform=`translate(${t}px, ${e}px) translate(${n})`}N=requestAnimationFrame(O)}return l((()=>{const t=F.current,e=new AbortController,n=e.signal;if(!t)return;cancelAnimationFrame(N),N=requestAnimationFrame(O),window.addEventListener("touchstart",(e=>{e.target===t||t.contains(e.target)?(W.current=!0,M(!0,x+.05)):M(!1)}),{signal:n});const r=t=>{W.current||t instanceof FocusEvent&&t.target instanceof Element&&!t.target.matches(":focus-visible")||M(!0,x)};return t.addEventListener("mouseenter",r,{signal:n}),t.addEventListener("focus",r,{signal:n}),t.addEventListener("mouseleave",(()=>M(!1)),{signal:n}),t.addEventListener("blur",(()=>M(!1)),{signal:n}),t.addEventListener("touchend",(()=>M(null)),{signal:n}),()=>{cancelAnimationFrame(N),e.abort()}}),[y,I,x]),l((()=>M("always"===y)),[y]),g=Array.isArray(g)?g[0]:g,d(g)?e(n,{children:[u(g,Object.assign(Object.assign({},w),{"aria-describedby":A,ref:o(F,w.ref,g.props.ref)})),F.current&&f(r("div",{ref:L,className:E.anchor,"data-position":I}),F.current),F.current&&f(r("div",{ref:j,id:A,role:"tooltip",className:E.tooltip,"aria-hidden":!$,style:{maxWidth:R},children:v}),document.getElementById("__fluid"))]}):g}export{g as default};
|
|
3
3
|
//# sourceMappingURL=tooltip.js.map
|
package/dist/hooks.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
export{default as useClickOutside}from"
|
|
2
|
+
export{default as useClickOutside}from"./hooks/use-click-outside.js";export{default as useMediaQuery}from"./hooks/use-media-query.js";export{default as useFluid}from"./hooks/use-fluid.js";export{default as useFocusTrap}from"./hooks/use-focus-trap.js";export{default as useDebounce}from"./hooks/use-debounce.js";
|
|
3
3
|
//# sourceMappingURL=hooks.js.map
|
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export{default as Autocomplete}from"
|
|
1
|
+
export{default as Autocomplete}from"./components/input/autocomplete.js";export{default as Button}from"./components/input/button.js";export{default as Hamburger}from"./components/input/hamburger.js";export{default as Switch}from"./components/input/switch.js";export{default as Checkbox}from"./components/input/checkbox.js";export{default as Chip}from"./components/input/chip.js";export{default as ColorField}from"./components/input/color-field.js";export{default as ColorPicker}from"./components/input/color-picker.js";export{default as Toggle}from"./components/input/toggle.js";export{default as Radio}from"./components/input/radio.js";export{default as Segmented}from"./components/input/segmented.js";export{default as Field}from"./components/input/field.js";export{default as NumberField}from"./components/input/number-field.js";export{default as PasswordField}from"./components/input/password-field.js";export{default as FileField}from"./components/input/file-field.js";export{default as Pincode}from"./components/input/pincode.js";export{default as Slider}from"./components/input/slider.js";export{default as ThemeToggle}from"./components/input/theme-toggle.js";export{default as Select}from"./components/input/select.js";export{default as Calendar}from"./components/input/calendar.js";export{default as DateField}from"./components/input/date-field.js";export{default as Textarea}from"./components/input/textarea.js";export{default as DropZone}from"./components/input/drop-zone.js";export{default as Key}from"./components/display/key.js";export{default as Annotation}from"./components/display/annotation.js";export{default as Badge}from"./components/display/badge.js";export{default as Tooltip}from"./components/display/tooltip.js";export{default as Swatch}from"./components/display/swatch.js";export{default as ActionMenu}from"./components/display/action-menu/index.js";export{default as Combobox}from"./components/display/combobox/index.js";export{default as Timeline}from"./components/display/timeline.js";export{default as Code}from"./components/display/code.js";export{default as Toast}from"./components/display/toast.js";export{default as Table}from"./components/display/table.js";export{default as Frame}from"./components/display/frame.js";export{default as Ticker}from"./components/display/ticker.js";export{default as ProgressBar}from"./components/feedback/progress-bar.js";export{default as CircularProgress}from"./components/feedback/circular-progress.js";export{default as Spinner}from"./components/feedback/spinner.js";export{default as Halo}from"./components/feedback/halo.js";export{default as Indicator}from"./components/feedback/indicator.js";export{default as Skeleton}from"./components/feedback/skeleton.js";export{default as Tabs}from"./components/navigation/tabs.js";export{default as Pagination}from"./components/navigation/pagination.js";export{default as Stepper}from"./components/navigation/stepper.js";export{default as NavigationMenu}from"./components/navigation/navigation-menu/index.js";export{default as Overlay}from"./components/layout/overlay.js";export{default as Modal}from"./components/layout/modal.js";export{default as Drawer}from"./components/layout/drawer.js";export{default as Scrollarea}from"./components/layout/scrollarea.js";export{default as Collapsible}from"./components/layout/collapsible.js";export{default as Group}from"./components/layout/group.js";export{default as Accordion}from"./components/layout/accordion/index.js";export{default as Sidebar}from"./components/layout/sidebar/index.js";export{default as Cull}from"./components/layout/cull.js";export{default as Popover}from"./components/layout/popover/index.js";export{default as Divider}from"./components/layout/divider.js";export{default as Panel}from"./components/layout/panel.js";export{default as FluidProvider}from"./context/fluid.js";
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import type { PopoverRootReference } from "./components/layout/popover/root";
|
|
2
2
|
import type { FluidIcon } from "./core/icons";
|
|
3
3
|
import { PartialFluidTheme } from "./core/theme";
|
|
4
|
-
export type FluidColorScheme = 'light' | 'dark' | '
|
|
4
|
+
export type FluidColorScheme = 'light' | 'dark' | 'system';
|
|
5
5
|
export type FluidSize = 'xsm' | 'sml' | 'med' | 'lrg';
|
|
6
6
|
export type FluidBreakpoint = 'mob' | 'tab' | 'lap' | 'dsk';
|
|
7
7
|
export type FluidInputvalue = string | number | readonly string[] | undefined;
|