seam-react 0.3.0 → 0.4.0
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.
- package/dist/Sidebar.d.ts +41 -0
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/index.js +795 -679
- package/dist/index.js.map +1 -1
- package/dist/styles.cjs +149 -0
- package/dist/styles.cjs.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/styles.js +149 -0
- package/dist/styles.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { type HTMLAttributes, type ReactElement, type ReactNode } from "react";
|
|
2
|
+
export interface SidebarProps extends HTMLAttributes<HTMLElement> {
|
|
3
|
+
children?: ReactNode;
|
|
4
|
+
/**
|
|
5
|
+
* 鼠标悬停时是否显示与当前项并列的预览指示器。
|
|
6
|
+
*
|
|
7
|
+
* @default true
|
|
8
|
+
*/
|
|
9
|
+
hoverPreview?: boolean;
|
|
10
|
+
}
|
|
11
|
+
export interface SidebarGroupProps extends Omit<HTMLAttributes<HTMLElement>, "title"> {
|
|
12
|
+
/** 分类名称。 */
|
|
13
|
+
title: ReactNode;
|
|
14
|
+
/** 分类标题前的视觉图标,不作为额外可访问名称。 */
|
|
15
|
+
icon?: ReactNode;
|
|
16
|
+
children?: ReactNode;
|
|
17
|
+
}
|
|
18
|
+
declare function SidebarGroup({ title, icon, children, className, ...rest }: SidebarGroupProps): ReactElement;
|
|
19
|
+
export interface SidebarItemProps {
|
|
20
|
+
/** 当前页面是否对应此链接。 */
|
|
21
|
+
active?: boolean;
|
|
22
|
+
/** 单个原生链接或路由链接元素。 */
|
|
23
|
+
children: ReactElement;
|
|
24
|
+
/** 追加到链接元素的类名。 */
|
|
25
|
+
className?: string;
|
|
26
|
+
}
|
|
27
|
+
declare function SidebarItem({ active, children, className, }: SidebarItemProps): ReactElement;
|
|
28
|
+
/**
|
|
29
|
+
* 分组文档导航。
|
|
30
|
+
*
|
|
31
|
+
* 根节点保持原生 `<nav>`,Group 生成带名称的分组,Item 包装单个链接。
|
|
32
|
+
* 当前项和鼠标预览使用两个独立的共享布局指示器;链接的 Tab 顺序、焦点、
|
|
33
|
+
* 原生事件和 aria-current 行为保持不变。
|
|
34
|
+
*/
|
|
35
|
+
export interface SidebarComponent {
|
|
36
|
+
(props: SidebarProps): ReactElement;
|
|
37
|
+
Group: typeof SidebarGroup;
|
|
38
|
+
Item: typeof SidebarItem;
|
|
39
|
+
}
|
|
40
|
+
export declare const Sidebar: SidebarComponent;
|
|
41
|
+
export {};
|
package/dist/index.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("react/jsx-runtime"),s=require("react"),k=require("motion/react"),q=require("react-dom"),v=require("seam-hooks");function I(...t){return t.filter(Boolean).join(" ")}const H=s.forwardRef(function({variant:e="primary",size:n="md",loading:o=!1,iconOnly:r=!1,type:c="button",className:a,children:u,...p},i){return f.jsxs("button",{...p,ref:i,type:c,className:I("uk-button",a),"data-variant":e,"data-size":n,"data-loading":o?"true":void 0,"data-icon-only":r?"true":void 0,disabled:p.disabled||o,"aria-busy":o||void 0,children:[o?f.jsx("span",{className:"uk-button__spinner","aria-hidden":"true"}):null,u]})}),ve=s.forwardRef(function({inputSize:e="md",invalid:n=!1,className:o,"aria-invalid":r,...c},a){return f.jsx("input",{...c,ref:a,className:I("uk-input",o),"data-size":e,"aria-invalid":n?!0:r})}),B=[.23,1,.32,1],X={type:"spring",bounce:0,duration:.3},Y={type:"spring",bounce:.04,duration:.38},Ie={type:"spring",bounce:.08,duration:.34},Q={duration:.12,ease:B},Ee={layout:{type:"spring",bounce:0,duration:.22},opacity:{duration:.12,ease:B},scale:{duration:.12,ease:B}},O={duration:.12,ease:B},Re=s.forwardRef(function({checked:e,defaultChecked:n,onCheckedChange:o,disabled:r,className:c,children:a,id:u,...p},i){const b=s.useId(),g=u??b,d=k.useReducedMotion()??!1,h=s.useRef(!1),m=s.useRef(null),[x,y]=v.useControllableState({value:e,defaultValue:n??!1,onChange:o}),T=k.useMotionValue(x?16:0);s.useEffect(()=>{if(m.current)return;const l=k.animate(T,x?16:0,d?{duration:0}:X);return()=>l.stop()},[x,d,T]);const C=l=>{const w=m.current;if(!(!w||w.pointerId!==l.pointerId)){if(w.moved){const R=w.samples[0],j=w.samples[w.samples.length-1],P=R&&j?Math.max(j.time-R.time,1):1,_=R&&j?(j.x-R.x)/P*1e3:0,E=Math.abs(_)>220?_>0:T.get()>=8;h.current=!0,m.current=null,y(E),k.animate(T,E?16:0,d?{duration:0}:{...X,velocity:_}),window.setTimeout(()=>{h.current=!1},0)}else m.current=null;l.currentTarget.hasPointerCapture(l.pointerId)&&typeof l.currentTarget.releasePointerCapture=="function"&&l.currentTarget.releasePointerCapture(l.pointerId)}};return f.jsxs("label",{className:I("uk-switch",c),"data-disabled":r?"true":void 0,htmlFor:g,onClickCapture:l=>{h.current&&(l.preventDefault(),l.stopPropagation())},children:[f.jsx("input",{...p,ref:i,id:g,type:"checkbox",role:"switch",className:"uk-switch__input",checked:x,disabled:r,"aria-checked":x,onChange:l=>y(l.target.checked)}),f.jsx("span",{className:"uk-switch__track","aria-hidden":"true",onPointerDown:l=>{r||(m.current={pointerId:l.pointerId,startX:l.clientX,startValue:T.get(),moved:!1,samples:[{x:l.clientX,time:performance.now()}]},typeof l.currentTarget.setPointerCapture=="function"&&l.currentTarget.setPointerCapture(l.pointerId))},onPointerMove:l=>{const w=m.current;if(!w||w.pointerId!==l.pointerId)return;const R=l.clientX-w.startX;Math.abs(R)>4&&(w.moved=!0),w.moved&&(l.preventDefault(),T.set(Math.max(0,Math.min(16,w.startValue+R))),w.samples.push({x:l.clientX,time:performance.now()}),w.samples=w.samples.filter(j=>performance.now()-j.time<120))},onPointerUp:C,onPointerCancel:C,children:f.jsx(k.motion.span,{className:"uk-switch__thumb",style:{x:T}})}),a?f.jsx("span",{className:"uk-switch__label",children:a}):null]})}),W=s.createContext(null);function z(t){const e=s.useContext(W);if(!e)throw new Error(`<${t}> must be rendered inside <Tabs>`);return e}function Z(t,e){return`${t}-tab-${encodeURIComponent(e)}`}function ee(t,e){return`${t}-panel-${encodeURIComponent(e)}`}function je({value:t,defaultValue:e,onValueChange:n,orientation:o="horizontal",className:r,children:c}){const a=s.useId(),[u,p]=v.useControllableState({value:t,defaultValue:e??"",onChange:n}),i=s.useMemo(()=>({baseId:a,value:u,setValue:p,orientation:o,indicatorId:`${a}-indicator`}),[a,u,o,p]);return f.jsx(W.Provider,{value:i,children:f.jsx("div",{className:I("uk-tabs",r),"data-orientation":o,children:c})})}const De=s.forwardRef(function({className:e,onKeyDown:n,...o},r){const{orientation:c}=z("Tabs.List");return f.jsx("div",{...o,ref:r,role:"tablist","aria-orientation":c,tabIndex:-1,className:I("uk-tabs__list",e),onKeyDown:a=>{if(n?.(a),a.defaultPrevented)return;const p=a.target?.closest('[role="tab"]');if(!p||p.hasAttribute("disabled"))return;const i=Array.from(a.currentTarget.querySelectorAll('[role="tab"]:not([disabled])')),b=i.indexOf(p);if(b===-1)return;const g=c==="horizontal"?"ArrowRight":"ArrowDown",d=c==="horizontal"?"ArrowLeft":"ArrowUp";let h=-1;switch(a.key){case g:h=(b+1)%i.length;break;case d:h=(b-1+i.length)%i.length;break;case"Home":h=0;break;case"End":h=i.length-1;break;default:return}a.preventDefault();const m=i[h];m&&(m.focus(),m.click())}})}),_e=s.forwardRef(function({value:e,type:n="button",className:o,onClick:r,children:c,...a},u){const p=z("Tabs.Trigger"),i=p.value===e,b=k.useReducedMotion()??!1;return f.jsxs("button",{...a,ref:u,type:n,role:"tab",id:Z(p.baseId,e),"aria-selected":i,"aria-controls":ee(p.baseId,e),tabIndex:i?0:-1,"data-state":i?"active":"inactive",className:I("uk-tabs__trigger",o),onClick:g=>{r?.(g),g.defaultPrevented||p.setValue(e)},children:[c,i?f.jsx(k.motion.span,{className:"uk-tabs__indicator",layoutId:p.indicatorId,"aria-hidden":"true",transition:b?{duration:0}:Ie}):null]})}),Pe=s.forwardRef(function({value:e,className:n,...o},r){const c=z("Tabs.Content"),a=c.value===e;return f.jsx("div",{...o,ref:r,role:"tabpanel",id:ee(c.baseId,e),"aria-labelledby":Z(c.baseId,e),hidden:!a,tabIndex:0,"data-state":a?"active":"inactive",className:I("uk-tabs__panel",n)})}),Se=Object.assign(je,{List:De,Trigger:_e,Content:Pe}),te=s.createContext(null),Le=()=>()=>{},Me=()=>!0,Ne=()=>!1;function $(t){const e=s.useContext(te);if(!e)throw new Error(`<${t}> must be rendered inside <Dialog.Root>`);return e}function ne(t,e){return n=>{t?.(n),n.defaultPrevented||e(n)}}function oe({children:t,open:e,defaultOpen:n,onOpenChange:o}){const r=s.useId(),[c,a]=s.useState(!1),[u,p]=s.useState(!1),[i,b]=v.useControllableState({value:e,defaultValue:n??!1,onChange:o}),g=s.useMemo(()=>({open:i,setOpen:b,triggerId:`${r}-trigger`,contentId:`${r}-content`,titleId:`${r}-title`,descriptionId:`${r}-description`,hasTitle:c,setHasTitle:a,hasDescription:u,setHasDescription:p}),[r,i,u,c,b]);return f.jsx(te.Provider,{value:g,children:t})}function Oe({children:t}){const e=$("Dialog.Trigger"),n=t,o=n.props.onClick;return s.cloneElement(n,{id:e.triggerId,"aria-haspopup":"dialog","aria-expanded":e.open,"aria-controls":e.open?e.contentId:void 0,onClick:ne(o,()=>{e.setOpen(!e.open)})})}function re({children:t,label:e="Close"}){const n=$("Dialog.Close");if(s.isValidElement(t)){const o=t,r=o.props.onClick;return s.cloneElement(o,{onClick:ne(r,()=>{n.setOpen(!1)})})}return f.jsx(H,{variant:"ghost",onClick:()=>n.setOpen(!1),children:e})}const se=s.forwardRef(function({className:e,...n},o){return f.jsx("header",{...n,ref:o,className:I("uk-dialog__header",e)})}),ie=s.forwardRef(function({className:e,children:n,...o},r){const c=$("Dialog.Title"),a=c.setHasTitle;return s.useEffect(()=>(a(!0),()=>a(!1)),[a]),f.jsx("h2",{...o,ref:r,id:c.titleId,className:I("uk-dialog__title",e),children:n})}),ae=s.forwardRef(function({className:e,...n},o){const r=$("Dialog.Description"),c=r.setHasDescription;return s.useEffect(()=>(c(!0),()=>c(!1)),[c]),f.jsx("p",{...n,ref:o,id:r.descriptionId,className:I("uk-dialog__description",e)})}),ce=s.forwardRef(function({className:e,...n},o){return f.jsx("div",{...n,ref:o,className:I("uk-dialog__body",e)})}),le=s.forwardRef(function({className:e,...n},o){return f.jsx("footer",{...n,ref:o,className:I("uk-dialog__footer",e)})});function $e({requestClose:t,contentId:e,titleId:n,descriptionId:o,hasTitle:r,hasDescription:c,children:a,closeOnBackdropClick:u=!0,closeOnEscape:p=!0,initialFocusRef:i,returnFocusRef:b,className:g,"aria-label":d,"aria-labelledby":h,"aria-describedby":m}){const x=s.useRef(null),y=s.useRef(null),T=k.useIsPresent(),C=k.useReducedMotion()??!1;return v.useLockBodyScroll(!0),s.useLayoutEffect(()=>{const l=x.current;l&&(y.current??(y.current=document.activeElement instanceof HTMLElement?document.activeElement:null),!l.open&&(typeof l.showModal=="function"?l.showModal():l.setAttribute("open","")))},[]),v.useFocusTrap({active:!0,containerRef:x,initialFocusRef:i,returnFocusRef:b??y}),s.useEffect(()=>{const l=x.current;if(!l)return;const w=()=>{l.open||(typeof l.showModal=="function"?l.showModal():l.setAttribute("open",""))},R=()=>{if(!p){w();return}t()},j=E=>{E.preventDefault(),p&&t()},P=E=>{p||E.key!=="Escape"||E.defaultPrevented||(E.preventDefault(),E.stopPropagation())},_=E=>{u&&E.target===l&&t()};return l.addEventListener("close",R),l.addEventListener("cancel",j),l.addEventListener("keydown",P,!0),l.addEventListener("click",_),()=>{l.removeEventListener("close",R),l.removeEventListener("cancel",j),l.removeEventListener("keydown",P,!0),l.removeEventListener("click",_)}},[u,p,t]),f.jsx("dialog",{ref:x,id:e,className:I("uk-dialog",g),closedby:p||u?"any":"none","data-state":T?"open":"closed",inert:!T,"aria-label":d,"aria-labelledby":h??(d?void 0:r?n:void 0),"aria-describedby":m??(c?o:void 0),children:f.jsx(k.motion.div,{className:"uk-dialog__panel",initial:C?{opacity:0}:{opacity:0,transform:"translateY(12px) scale(0.96)"},animate:{opacity:1,transform:"translateY(0px) scale(1)",transition:C?O:{...Y,delay:.06}},exit:C?{opacity:0,transition:O}:{opacity:0,transform:"translateY(8px) scale(0.97)",transition:Y},children:a})})}function ue({children:t,closeOnBackdropClick:e=!0,closeOnEscape:n=!0,initialFocusRef:o,returnFocusRef:r,className:c,"aria-label":a,"aria-labelledby":u,"aria-describedby":p}){const i=$("Dialog.Content"),b=v.useEventCallback(()=>{i.setOpen(!1)});return s.useSyncExternalStore(Le,Me,Ne)?q.createPortal(f.jsx(k.MotionConfig,{reducedMotion:"user",children:f.jsx(k.AnimatePresence,{children:i.open?f.jsx($e,{requestClose:b,contentId:i.contentId,titleId:i.titleId,descriptionId:i.descriptionId,hasTitle:i.hasTitle,hasDescription:i.hasDescription,closeOnBackdropClick:e,closeOnEscape:n,initialFocusRef:o,returnFocusRef:r,className:c,"aria-label":a,"aria-labelledby":u,"aria-describedby":p,children:t},"uk-dialog"):null})}),document.body):null}function Ae({open:t,onOpenChange:e,title:n,description:o,footer:r,children:c,closeLabel:a="Close",showCloseButton:u=!0,closeOnBackdropClick:p=!0,closeOnEscape:i=!0,initialFocusRef:b,returnFocusRef:g,className:d,"aria-label":h}){return f.jsx(oe,{open:t,onOpenChange:e,children:f.jsxs(ue,{className:d,closeOnBackdropClick:p,closeOnEscape:i,initialFocusRef:b,returnFocusRef:g,"aria-label":h,children:[n||o||u?f.jsxs(se,{children:[f.jsxs("div",{className:"uk-dialog__heading",children:[n?f.jsx(ie,{children:n}):null,o?f.jsx(ae,{children:o}):null]}),u?f.jsx(re,{children:f.jsx(H,{variant:"ghost",size:"sm",iconOnly:!0,"aria-label":a,className:"uk-dialog__close",children:f.jsx("svg",{viewBox:"0 0 20 20",width:"16",height:"16","aria-hidden":"true",children:f.jsx("path",{d:"M5 5l10 10M15 5L5 15",stroke:"currentColor",strokeWidth:"1.8",strokeLinecap:"round"})})})}):null]}):null,f.jsx(ce,{children:c}),r?f.jsx(le,{children:r}):null]})})}const Be=Object.assign(Ae,{Root:oe,Trigger:Oe,Content:ue,Header:se,Title:ie,Description:ae,Body:ce,Footer:le,Close:re}),de=s.createContext(null),fe=()=>()=>{},pe=()=>!0,me=()=>!1;function he(t){const e=s.useContext(de);if(!e)throw new Error(`<${t}> must be rendered inside <Tooltip.Root>`);return e}function be(t,e){typeof t=="function"?t(e):t&&(t.current=e)}function ge(t,e){const n=typeof t=="string"?t.split(/\s+/).filter(Boolean):[];return Array.from(new Set([...n,e])).join(" ")}function D(t,e){return n=>{t?.(n),n.defaultPrevented||e(n)}}function Ve({children:t,open:e,defaultOpen:n,onOpenChange:o,delayDuration:r=300,closeDelay:c=80}){const a=s.useId(),[u,p]=s.useState(null),i=s.useRef(null),b=s.useRef(null),[g,d]=v.useControllableState({value:e,defaultValue:n??!1,onChange:o}),h=s.useCallback(()=>{i.current!==null&&(clearTimeout(i.current),i.current=null)},[]),m=s.useCallback(()=>{b.current!==null&&(clearTimeout(b.current),b.current=null)},[]),x=v.useEventCallback((l=!1)=>{if(h(),m(),!g){if(l||r<=0){d(!0);return}i.current=setTimeout(()=>{i.current=null,d(!0)},r)}}),y=v.useEventCallback(()=>{if(h(),m(),!!g){if(c<=0){d(!1);return}b.current=setTimeout(()=>{b.current=null,d(!1)},c)}}),T=v.useEventCallback(()=>{h(),m(),d(!1)});s.useEffect(()=>{g?m():h()},[m,h,g]),s.useEffect(()=>()=>{h(),m()},[m,h]);const C=s.useMemo(()=>({open:g,triggerElement:u,setTriggerElement:p,contentId:a,requestOpen:x,requestClose:y,dismiss:T}),[a,g,T,y,x,u]);return f.jsx(de.Provider,{value:C,children:t})}function Fe({children:t}){const e=he("Tooltip.Trigger"),{setTriggerElement:n}=e;if(!s.isValidElement(t))throw new Error("<Tooltip.Trigger> expects a single valid React element");const o=t,r=o.props,c=r.ref??o.ref,a=r.onPointerEnter,u=r.onPointerLeave,p=r.onFocus,i=r.onBlur,b=r.onKeyDown,g=s.useCallback(d=>{be(c,d),n(d)},[c,n]);return s.cloneElement(o,{ref:g,"aria-describedby":e.open?ge(r["aria-describedby"],e.contentId):r["aria-describedby"],onPointerEnter:D(a,d=>{e.requestOpen(d.pointerType==="touch")}),onPointerLeave:D(u,d=>{d.pointerType!=="touch"&&e.requestClose()}),onFocus:D(p,()=>{e.requestOpen()}),onBlur:D(i,()=>{e.requestClose()}),onKeyDown:D(b,d=>{d.key==="Escape"&&e.open&&(d.preventDefault(),d.stopPropagation(),e.dismiss())})})}function A(t,e,n){return n<e?e:Math.min(Math.max(t,e),n)}function qe(t){switch(t){case"top":return"bottom";case"right":return"left";case"bottom":return"top";case"left":return"right"}}function F(t,e,n,o,r){switch(e){case"top":return t.top-r;case"right":return n-t.right-r;case"bottom":return o-t.bottom-r;case"left":return t.left-r}}function J(t,e,n,o,r,c,a){return F(t,n,r,c,a)>=(n==="top"||n==="bottom"?e.height:e.width)+o}function He({trigger:t,tooltip:e,side:n,align:o,sideOffset:r,collisionPadding:c,avoidCollisions:a,viewportWidth:u,viewportHeight:p}){let i=n;if(a&&!J(t,e,n,r,u,p,c)){const y=qe(n),T=J(t,e,y,r,u,p,c),C=F(t,n,u,p,c),l=F(t,y,u,p,c);(T||l>C)&&(i=y)}const b=t.left+t.width/2,g=t.top+t.height/2;let d=0,h=0;switch(i){case"top":case"bottom":d=o==="start"?t.left:o==="end"?t.right-e.width:b-e.width/2,h=i==="top"?t.top-e.height-r:t.bottom+r;break;case"left":case"right":d=i==="left"?t.left-e.width-r:t.right+r,h=o==="start"?t.top:o==="end"?t.bottom-e.height:g-e.height/2;break}a&&(d=A(d,c,u-e.width-c),h=A(h,c,p-e.height-c));const m=10,x=i==="top"||i==="bottom"?A(b-d,m,Math.max(m,e.width-m)):A(g-h,m,Math.max(m,e.height-m));return{x:d,y:h,side:i,arrowOffset:x}}function xe(t,e,{side:n,align:o,sideOffset:r,collisionPadding:c,avoidCollisions:a}){const[u,p]=s.useState(null);return s.useLayoutEffect(()=>{const i=e.current;if(!i||!t)return;const b=()=>{const d=t.getBoundingClientRect(),h=i.getBoundingClientRect();p(He({trigger:d,tooltip:h,side:n,align:o,sideOffset:r,collisionPadding:c,avoidCollisions:a,viewportWidth:window.innerWidth||document.documentElement.clientWidth,viewportHeight:window.innerHeight||document.documentElement.clientHeight}))};b(),window.addEventListener("resize",b),window.addEventListener("scroll",b,!0);const g=typeof ResizeObserver>"u"?null:new ResizeObserver(b);return g?.observe(t),g?.observe(i),()=>{window.removeEventListener("resize",b),window.removeEventListener("scroll",b,!0),g?.disconnect()}},[o,a,c,e,n,r,t]),u}function ye(t,e,n){s.useEffect(()=>{const o=a=>{const u=a.target;u instanceof Node&&(t.contains(u)||e.current?.contains(u)||n())},r=()=>{document.visibilityState==="hidden"&&n()},c=a=>{const u=a.target;a.key!=="Escape"||u instanceof Node&&t.contains(u)||n()};return document.addEventListener("pointerdown",o,!0),document.addEventListener("visibilitychange",r),document.addEventListener("keydown",c,!0),window.addEventListener("blur",n),()=>{document.removeEventListener("pointerdown",o,!0),document.removeEventListener("visibilitychange",r),document.removeEventListener("keydown",c,!0),window.removeEventListener("blur",n)}},[n,e,t])}function Te(t){switch(t){case"top":return"center bottom";case"bottom":return"center top";case"left":return"right center";case"right":return"left center";default:return"center"}}function ze({contentId:t,triggerElement:e,dismiss:n,children:o,className:r,style:c,side:a="top",align:u="center",sideOffset:p=8,collisionPadding:i=8,avoidCollisions:b=!0,...g}){const d=s.useRef(null),h=k.useReducedMotion()??!1,m=k.useIsPresent(),x=xe(e,d,{side:a,align:u,sideOffset:p,collisionPadding:i,avoidCollisions:b});ye(e,d,n);const y=Te(x?.side??a),T={...c,left:x?`${x.x}px`:0,top:x?`${x.y}px`:0,visibility:x?"visible":"hidden"};return f.jsx("div",{...g,ref:d,id:t,role:"tooltip","data-side":x?.side??a,"data-align":u,"data-state":m?"open":"closed","aria-hidden":m?void 0:!0,className:I("uk-tooltip",r),style:T,children:f.jsxs(k.motion.div,{className:"uk-tooltip__surface",style:{transformOrigin:y},initial:h?{opacity:0}:{opacity:0,scale:.96},animate:{opacity:1,scale:1},exit:h?{opacity:0}:{opacity:0,scale:.96},transition:h?O:Q,children:[f.jsx("span",{className:"uk-tooltip__arrow","aria-hidden":"true",style:{"--uk-tooltip-arrow-offset":`${x?.arrowOffset??0}px`}}),o]})})}function Ke(t){const e=he("Tooltip.Content"),o=s.useSyncExternalStore(fe,pe,me)&&e.triggerElement?e.triggerElement.closest("dialog")??document.body:null;return!o||!e.triggerElement?null:q.createPortal(f.jsx(k.MotionConfig,{reducedMotion:"user",children:f.jsx(k.AnimatePresence,{children:e.open?f.jsx(ze,{contentId:e.contentId,triggerElement:e.triggerElement,dismiss:e.dismiss,...t},"uk-tooltip"):null})}),o)}const we=s.createContext(null);function Ge(t){const e=s.useContext(we);if(!e)throw new Error(`<${t}> must be rendered inside <Tooltip.Group>`);return e}function Ue({activeValue:t,content:e,contentClassName:n,contentId:o,dismiss:r,triggerElement:c,side:a,align:u,sideOffset:p,collisionPadding:i,avoidCollisions:b}){const g=s.useRef(null),d=k.useReducedMotion()??!1,h=k.useIsPresent(),m=xe(c,g,{side:a,align:u,sideOffset:p,collisionPadding:i,avoidCollisions:b});ye(c,g,r);const x={left:m?`${m.x}px`:0,top:m?`${m.y}px`:0,transformOrigin:Te(m?.side??a),visibility:m?"visible":"hidden"};return f.jsxs(k.motion.div,{ref:g,id:o,role:"tooltip",layout:!d,layoutDependency:t,"data-side":m?.side??a,"data-align":u,"data-state":h?"open":"closed","aria-hidden":h?void 0:!0,className:I("uk-tooltip","uk-tooltip__surface","uk-tooltip--group",n),style:x,initial:d?{opacity:0}:{opacity:0,scale:.96},animate:{opacity:1,scale:1},exit:d?{opacity:0}:{opacity:0,scale:.96},transition:d?{...O,layout:{duration:0}}:Ee,children:[f.jsx("span",{className:"uk-tooltip__arrow","aria-hidden":"true",style:{"--uk-tooltip-arrow-offset":`${m?.arrowOffset??0}px`}}),f.jsx(k.motion.div,{className:"uk-tooltip__content",initial:{opacity:0},animate:{opacity:1},transition:d?O:Q,children:e},t)]})}function Xe({children:t,side:e="top",align:n="center",sideOffset:o=8,collisionPadding:r=8,avoidCollisions:c=!0,delayDuration:a=180,closeDelay:u=80,contentClassName:p}){const i=s.useId(),[b,g]=s.useState(()=>new Map),[d,h]=s.useState(!1),[m,x]=s.useState(null),y=s.useRef(null),T=s.useRef(null),C=s.useSyncExternalStore(fe,pe,me),l=s.useCallback(()=>{y.current!==null&&(clearTimeout(y.current),y.current=null)},[]),w=s.useCallback(()=>{T.current!==null&&(clearTimeout(T.current),T.current=null)},[]),R=v.useEventCallback((L,S=!1)=>{if(l(),w(),x(L),!d){if(S||a<=0){h(!0);return}y.current=setTimeout(()=>{y.current=null,h(!0)},a)}}),j=v.useEventCallback(()=>{if(l(),w(),!!d){if(u<=0){h(!1);return}T.current=setTimeout(()=>{T.current=null,h(!1)},u)}}),P=v.useEventCallback(()=>{l(),w(),h(!1)}),_=v.useEventCallback((L,S,N)=>{g(V=>{const G=V.get(L);if(G?.triggerElement===S&&Object.is(G.content,N))return V;const U=new Map(V);return U.set(L,{triggerElement:S,content:N}),U})}),E=v.useEventCallback(L=>{g(S=>{if(!S.has(L))return S;const N=new Map(S);return N.delete(L),N})});s.useEffect(()=>()=>{l(),w()},[w,l]);const Ce=s.useMemo(()=>({open:d,activeValue:m,contentId:i,activate:R,requestClose:j,dismiss:P,register:_,unregister:E}),[R,m,i,P,d,_,j,E]),M=m?b.get(m):void 0,ke=d&&!!M,K=C&&M?M.triggerElement.closest("dialog")??document.body:null;return f.jsxs(we.Provider,{value:Ce,children:[t,K&&M?q.createPortal(f.jsx(k.MotionConfig,{reducedMotion:"user",children:f.jsx(k.AnimatePresence,{children:ke?f.jsx(Ue,{activeValue:m??"",content:M.content,contentClassName:p,contentId:i,dismiss:P,triggerElement:M.triggerElement,side:e,align:n,sideOffset:o,collisionPadding:r,avoidCollisions:c},"uk-tooltip-group"):null})}),K):null]})}function Ye({value:t,content:e,children:n}){const o=Ge("Tooltip.Item"),{register:r,unregister:c}=o,[a,u]=s.useState(null);if(!s.isValidElement(n))throw new Error("<Tooltip.Item> expects a single valid React element");const p=n,i=p.props,b=i.ref??p.ref,g=i.onPointerEnter,d=i.onPointerLeave,h=i.onFocus,m=i.onBlur,x=i.onKeyDown,y=o.open&&o.activeValue===t,T=s.useCallback(C=>{be(b,C),u(C)},[b,u]);return s.useLayoutEffect(()=>{if(a)return r(t,a,e),()=>c(t)},[e,r,a,c,t]),s.cloneElement(p,{ref:T,"aria-describedby":y?ge(i["aria-describedby"],o.contentId):i["aria-describedby"],onPointerEnter:D(g,C=>{o.activate(t,C.pointerType==="touch")}),onPointerLeave:D(d,C=>{C.pointerType!=="touch"&&o.requestClose()}),onFocus:D(h,()=>{o.activate(t)}),onBlur:D(m,()=>{o.requestClose()}),onKeyDown:D(x,C=>{C.key==="Escape"&&y&&(C.preventDefault(),C.stopPropagation(),o.dismiss())})})}const Je={Root:Ve,Trigger:Fe,Content:Ke,Group:Xe,Item:Ye};exports.Button=H;exports.Dialog=Be;exports.Input=ve;exports.Switch=Re;exports.Tabs=Se;exports.Tooltip=Je;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),s=require("react"),T=require("motion/react"),q=require("react-dom"),k=require("seam-hooks");function I(...t){return t.filter(Boolean).join(" ")}const G=s.forwardRef(function({variant:e="primary",size:n="md",loading:o=!1,iconOnly:r=!1,type:c="button",className:i,children:u,...d},a){return l.jsxs("button",{...d,ref:a,type:c,className:I("uk-button",i),"data-variant":e,"data-size":n,"data-loading":o?"true":void 0,"data-icon-only":r?"true":void 0,disabled:d.disabled||o,"aria-busy":o||void 0,children:[o?l.jsx("span",{className:"uk-button__spinner","aria-hidden":"true"}):null,u]})}),je=s.forwardRef(function({inputSize:e="md",invalid:n=!1,className:o,"aria-invalid":r,...c},i){return l.jsx("input",{...c,ref:i,className:I("uk-input",o),"data-size":e,"aria-invalid":n?!0:r})}),B=[.23,1,.32,1],Y={type:"spring",bounce:0,duration:.3},J={type:"spring",bounce:.04,duration:.38},W={type:"spring",bounce:.08,duration:.34},Z={duration:.12,ease:B},_e={layout:{type:"spring",bounce:0,duration:.22},opacity:{duration:.12,ease:B},scale:{duration:.12,ease:B}},O={duration:.12,ease:B},Re=s.forwardRef(function({checked:e,defaultChecked:n,onCheckedChange:o,disabled:r,className:c,children:i,id:u,...d},a){const b=s.useId(),g=u??b,f=T.useReducedMotion()??!1,h=s.useRef(!1),m=s.useRef(null),[x,y]=k.useControllableState({value:e,defaultValue:n??!1,onChange:o}),C=T.useMotionValue(x?16:0);s.useEffect(()=>{if(m.current)return;const p=T.animate(C,x?16:0,f?{duration:0}:Y);return()=>p.stop()},[x,f,C]);const w=p=>{const v=m.current;if(!(!v||v.pointerId!==p.pointerId)){if(v.moved){const j=v.samples[0],_=v.samples[v.samples.length-1],D=j&&_?Math.max(_.time-j.time,1):1,P=j&&_?(_.x-j.x)/D*1e3:0,E=Math.abs(P)>220?P>0:C.get()>=8;h.current=!0,m.current=null,y(E),T.animate(C,E?16:0,f?{duration:0}:{...Y,velocity:P}),window.setTimeout(()=>{h.current=!1},0)}else m.current=null;p.currentTarget.hasPointerCapture(p.pointerId)&&typeof p.currentTarget.releasePointerCapture=="function"&&p.currentTarget.releasePointerCapture(p.pointerId)}};return l.jsxs("label",{className:I("uk-switch",c),"data-disabled":r?"true":void 0,htmlFor:g,onClickCapture:p=>{h.current&&(p.preventDefault(),p.stopPropagation())},children:[l.jsx("input",{...d,ref:a,id:g,type:"checkbox",role:"switch",className:"uk-switch__input",checked:x,disabled:r,"aria-checked":x,onChange:p=>y(p.target.checked)}),l.jsx("span",{className:"uk-switch__track","aria-hidden":"true",onPointerDown:p=>{r||(m.current={pointerId:p.pointerId,startX:p.clientX,startValue:C.get(),moved:!1,samples:[{x:p.clientX,time:performance.now()}]},typeof p.currentTarget.setPointerCapture=="function"&&p.currentTarget.setPointerCapture(p.pointerId))},onPointerMove:p=>{const v=m.current;if(!v||v.pointerId!==p.pointerId)return;const j=p.clientX-v.startX;Math.abs(j)>4&&(v.moved=!0),v.moved&&(p.preventDefault(),C.set(Math.max(0,Math.min(16,v.startValue+j))),v.samples.push({x:p.clientX,time:performance.now()}),v.samples=v.samples.filter(_=>performance.now()-_.time<120))},onPointerUp:w,onPointerCancel:w,children:l.jsx(T.motion.span,{className:"uk-switch__thumb",style:{x:C}})}),i?l.jsx("span",{className:"uk-switch__label",children:i}):null]})}),ee=s.createContext(null);function Pe(t){const e=s.useContext(ee);if(!e)throw new Error(`<${t}> must be rendered inside <Sidebar>`);return e}function V(t,e){return n=>{t?.(n),n.defaultPrevented||e(n)}}function De({children:t,className:e,hoverPreview:n=!0,...o}){const[r,c]=s.useState(null),i=s.useId().replace(/:/g,""),u=s.useMemo(()=>({hoveredId:r,setHoveredId:c,indicatorBaseId:i,hoverPreview:n}),[r,i,n]);return l.jsx(ee.Provider,{value:u,children:l.jsx(T.LayoutGroup,{id:`sidebar-${i}`,children:l.jsx("nav",{...o,className:I("uk-sidebar",e),children:t})})})}function Se({title:t,icon:e,children:n,className:o,...r}){const c=s.useId(),i=e!=null;return l.jsxs("section",{...r,className:I("uk-sidebar__group",o),"aria-labelledby":r["aria-labelledby"]??c,"data-has-icon":i?"true":"false",children:[l.jsxs("p",{className:"uk-sidebar__group-title",id:c,children:[i?l.jsx("span",{className:"uk-sidebar__group-icon","aria-hidden":"true",children:e}):null,l.jsx("span",{children:t})]}),l.jsx("ul",{className:"uk-sidebar__list",children:n})]})}function Ne({active:t=!1,children:e,className:n}){const o=Pe("Sidebar.Item"),r=s.useId(),i=T.useReducedMotion()??!1?{duration:0}:W;if(!s.isValidElement(e))throw new Error("<Sidebar.Item> expects a single valid React element");const u=e,d=u.props,a=d.className,b=typeof a=="function"?y=>I("uk-sidebar__link",a(y),n):I("uk-sidebar__link",a,n),g=d.onPointerEnter,f=d.onPointerLeave,h=d.onPointerCancel,m=o.hoveredId===r,x=l.jsxs(l.Fragment,{children:[l.jsx("span",{className:"uk-sidebar__rail","aria-hidden":"true"}),l.jsx(T.AnimatePresence,{initial:!1,children:o.hoverPreview&&m?l.jsx(T.motion.span,{className:"uk-sidebar__indicator","data-kind":"hover","data-slot":"sidebar-hover-indicator",layoutId:`${o.indicatorBaseId}-hover`,"aria-hidden":"true",initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:i}):null}),l.jsx(T.AnimatePresence,{initial:!1,children:t?l.jsx(T.motion.span,{className:"uk-sidebar__indicator","data-kind":"active","data-slot":"sidebar-active-indicator",layoutId:`${o.indicatorBaseId}-active`,"aria-hidden":"true",initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:i}):null}),l.jsx("span",{className:"uk-sidebar__label",children:d.children})]});return l.jsx("li",{className:"uk-sidebar__item",children:s.cloneElement(u,{className:b,"data-active":t?"true":"false","data-preview":t||m?"true":"false","aria-current":d["aria-current"]??(t?"page":void 0),onPointerEnter:V(g,y=>{o.hoverPreview&&y.pointerType==="mouse"&&o.setHoveredId(r)}),onPointerLeave:V(f,()=>{o.hoveredId===r&&o.setHoveredId(null)}),onPointerCancel:V(h,()=>{o.hoveredId===r&&o.setHoveredId(null)})},x)})}const Le=Object.assign(De,{Group:Se,Item:Ne}),te=s.createContext(null);function z(t){const e=s.useContext(te);if(!e)throw new Error(`<${t}> must be rendered inside <Tabs>`);return e}function ne(t,e){return`${t}-tab-${encodeURIComponent(e)}`}function oe(t,e){return`${t}-panel-${encodeURIComponent(e)}`}function Me({value:t,defaultValue:e,onValueChange:n,orientation:o="horizontal",className:r,children:c}){const i=s.useId(),[u,d]=k.useControllableState({value:t,defaultValue:e??"",onChange:n}),a=s.useMemo(()=>({baseId:i,value:u,setValue:d,orientation:o,indicatorId:`${i}-indicator`}),[i,u,o,d]);return l.jsx(te.Provider,{value:a,children:l.jsx("div",{className:I("uk-tabs",r),"data-orientation":o,children:c})})}const Oe=s.forwardRef(function({className:e,onKeyDown:n,...o},r){const{orientation:c}=z("Tabs.List");return l.jsx("div",{...o,ref:r,role:"tablist","aria-orientation":c,tabIndex:-1,className:I("uk-tabs__list",e),onKeyDown:i=>{if(n?.(i),i.defaultPrevented)return;const d=i.target?.closest('[role="tab"]');if(!d||d.hasAttribute("disabled"))return;const a=Array.from(i.currentTarget.querySelectorAll('[role="tab"]:not([disabled])')),b=a.indexOf(d);if(b===-1)return;const g=c==="horizontal"?"ArrowRight":"ArrowDown",f=c==="horizontal"?"ArrowLeft":"ArrowUp";let h=-1;switch(i.key){case g:h=(b+1)%a.length;break;case f:h=(b-1+a.length)%a.length;break;case"Home":h=0;break;case"End":h=a.length-1;break;default:return}i.preventDefault();const m=a[h];m&&(m.focus(),m.click())}})}),$e=s.forwardRef(function({value:e,type:n="button",className:o,onClick:r,children:c,...i},u){const d=z("Tabs.Trigger"),a=d.value===e,b=T.useReducedMotion()??!1;return l.jsxs("button",{...i,ref:u,type:n,role:"tab",id:ne(d.baseId,e),"aria-selected":a,"aria-controls":oe(d.baseId,e),tabIndex:a?0:-1,"data-state":a?"active":"inactive",className:I("uk-tabs__trigger",o),onClick:g=>{r?.(g),g.defaultPrevented||d.setValue(e)},children:[c,a?l.jsx(T.motion.span,{className:"uk-tabs__indicator",layoutId:d.indicatorId,"aria-hidden":"true",transition:b?{duration:0}:W}):null]})}),Ae=s.forwardRef(function({value:e,className:n,...o},r){const c=z("Tabs.Content"),i=c.value===e;return l.jsx("div",{...o,ref:r,role:"tabpanel",id:oe(c.baseId,e),"aria-labelledby":ne(c.baseId,e),hidden:!i,tabIndex:0,"data-state":i?"active":"inactive",className:I("uk-tabs__panel",n)})}),Be=Object.assign(Me,{List:Oe,Trigger:$e,Content:Ae}),re=s.createContext(null),He=()=>()=>{},Ve=()=>!0,Fe=()=>!1;function $(t){const e=s.useContext(re);if(!e)throw new Error(`<${t}> must be rendered inside <Dialog.Root>`);return e}function se(t,e){return n=>{t?.(n),n.defaultPrevented||e(n)}}function ie({children:t,open:e,defaultOpen:n,onOpenChange:o}){const r=s.useId(),[c,i]=s.useState(!1),[u,d]=s.useState(!1),[a,b]=k.useControllableState({value:e,defaultValue:n??!1,onChange:o}),g=s.useMemo(()=>({open:a,setOpen:b,triggerId:`${r}-trigger`,contentId:`${r}-content`,titleId:`${r}-title`,descriptionId:`${r}-description`,hasTitle:c,setHasTitle:i,hasDescription:u,setHasDescription:d}),[r,a,u,c,b]);return l.jsx(re.Provider,{value:g,children:t})}function qe({children:t}){const e=$("Dialog.Trigger"),n=t,o=n.props.onClick;return s.cloneElement(n,{id:e.triggerId,"aria-haspopup":"dialog","aria-expanded":e.open,"aria-controls":e.open?e.contentId:void 0,onClick:se(o,()=>{e.setOpen(!e.open)})})}function ae({children:t,label:e="Close"}){const n=$("Dialog.Close");if(s.isValidElement(t)){const o=t,r=o.props.onClick;return s.cloneElement(o,{onClick:se(r,()=>{n.setOpen(!1)})})}return l.jsx(G,{variant:"ghost",onClick:()=>n.setOpen(!1),children:e})}const ce=s.forwardRef(function({className:e,...n},o){return l.jsx("header",{...n,ref:o,className:I("uk-dialog__header",e)})}),le=s.forwardRef(function({className:e,children:n,...o},r){const c=$("Dialog.Title"),i=c.setHasTitle;return s.useEffect(()=>(i(!0),()=>i(!1)),[i]),l.jsx("h2",{...o,ref:r,id:c.titleId,className:I("uk-dialog__title",e),children:n})}),ue=s.forwardRef(function({className:e,...n},o){const r=$("Dialog.Description"),c=r.setHasDescription;return s.useEffect(()=>(c(!0),()=>c(!1)),[c]),l.jsx("p",{...n,ref:o,id:r.descriptionId,className:I("uk-dialog__description",e)})}),de=s.forwardRef(function({className:e,...n},o){return l.jsx("div",{...n,ref:o,className:I("uk-dialog__body",e)})}),fe=s.forwardRef(function({className:e,...n},o){return l.jsx("footer",{...n,ref:o,className:I("uk-dialog__footer",e)})});function Ge({requestClose:t,contentId:e,titleId:n,descriptionId:o,hasTitle:r,hasDescription:c,children:i,closeOnBackdropClick:u=!0,closeOnEscape:d=!0,initialFocusRef:a,returnFocusRef:b,className:g,"aria-label":f,"aria-labelledby":h,"aria-describedby":m}){const x=s.useRef(null),y=s.useRef(null),C=T.useIsPresent(),w=T.useReducedMotion()??!1;return k.useLockBodyScroll(!0),s.useLayoutEffect(()=>{const p=x.current;p&&(y.current??(y.current=document.activeElement instanceof HTMLElement?document.activeElement:null),!p.open&&(typeof p.showModal=="function"?p.showModal():p.setAttribute("open","")))},[]),k.useFocusTrap({active:!0,containerRef:x,initialFocusRef:a,returnFocusRef:b??y}),s.useEffect(()=>{const p=x.current;if(!p)return;const v=()=>{p.open||(typeof p.showModal=="function"?p.showModal():p.setAttribute("open",""))},j=()=>{if(!d){v();return}t()},_=E=>{E.preventDefault(),d&&t()},D=E=>{d||E.key!=="Escape"||E.defaultPrevented||(E.preventDefault(),E.stopPropagation())},P=E=>{u&&E.target===p&&t()};return p.addEventListener("close",j),p.addEventListener("cancel",_),p.addEventListener("keydown",D,!0),p.addEventListener("click",P),()=>{p.removeEventListener("close",j),p.removeEventListener("cancel",_),p.removeEventListener("keydown",D,!0),p.removeEventListener("click",P)}},[u,d,t]),l.jsx("dialog",{ref:x,id:e,className:I("uk-dialog",g),closedby:d||u?"any":"none","data-state":C?"open":"closed",inert:!C,"aria-label":f,"aria-labelledby":h??(f?void 0:r?n:void 0),"aria-describedby":m??(c?o:void 0),children:l.jsx(T.motion.div,{className:"uk-dialog__panel",initial:w?{opacity:0}:{opacity:0,transform:"translateY(12px) scale(0.96)"},animate:{opacity:1,transform:"translateY(0px) scale(1)",transition:w?O:{...J,delay:.06}},exit:w?{opacity:0,transition:O}:{opacity:0,transform:"translateY(8px) scale(0.97)",transition:J},children:i})})}function pe({children:t,closeOnBackdropClick:e=!0,closeOnEscape:n=!0,initialFocusRef:o,returnFocusRef:r,className:c,"aria-label":i,"aria-labelledby":u,"aria-describedby":d}){const a=$("Dialog.Content"),b=k.useEventCallback(()=>{a.setOpen(!1)});return s.useSyncExternalStore(He,Ve,Fe)?q.createPortal(l.jsx(T.MotionConfig,{reducedMotion:"user",children:l.jsx(T.AnimatePresence,{children:a.open?l.jsx(Ge,{requestClose:b,contentId:a.contentId,titleId:a.titleId,descriptionId:a.descriptionId,hasTitle:a.hasTitle,hasDescription:a.hasDescription,closeOnBackdropClick:e,closeOnEscape:n,initialFocusRef:o,returnFocusRef:r,className:c,"aria-label":i,"aria-labelledby":u,"aria-describedby":d,children:t},"uk-dialog"):null})}),document.body):null}function ze({open:t,onOpenChange:e,title:n,description:o,footer:r,children:c,closeLabel:i="Close",showCloseButton:u=!0,closeOnBackdropClick:d=!0,closeOnEscape:a=!0,initialFocusRef:b,returnFocusRef:g,className:f,"aria-label":h}){return l.jsx(ie,{open:t,onOpenChange:e,children:l.jsxs(pe,{className:f,closeOnBackdropClick:d,closeOnEscape:a,initialFocusRef:b,returnFocusRef:g,"aria-label":h,children:[n||o||u?l.jsxs(ce,{children:[l.jsxs("div",{className:"uk-dialog__heading",children:[n?l.jsx(le,{children:n}):null,o?l.jsx(ue,{children:o}):null]}),u?l.jsx(ae,{children:l.jsx(G,{variant:"ghost",size:"sm",iconOnly:!0,"aria-label":i,className:"uk-dialog__close",children:l.jsx("svg",{viewBox:"0 0 20 20",width:"16",height:"16","aria-hidden":"true",children:l.jsx("path",{d:"M5 5l10 10M15 5L5 15",stroke:"currentColor",strokeWidth:"1.8",strokeLinecap:"round"})})})}):null]}):null,l.jsx(de,{children:c}),r?l.jsx(fe,{children:r}):null]})})}const Ke=Object.assign(ze,{Root:ie,Trigger:qe,Content:pe,Header:ce,Title:le,Description:ue,Body:de,Footer:fe,Close:ae}),me=s.createContext(null),he=()=>()=>{},be=()=>!0,ge=()=>!1;function xe(t){const e=s.useContext(me);if(!e)throw new Error(`<${t}> must be rendered inside <Tooltip.Root>`);return e}function ye(t,e){typeof t=="function"?t(e):t&&(t.current=e)}function Te(t,e){const n=typeof t=="string"?t.split(/\s+/).filter(Boolean):[];return Array.from(new Set([...n,e])).join(" ")}function R(t,e){return n=>{t?.(n),n.defaultPrevented||e(n)}}function Ue({children:t,open:e,defaultOpen:n,onOpenChange:o,delayDuration:r=300,closeDelay:c=80}){const i=s.useId(),[u,d]=s.useState(null),a=s.useRef(null),b=s.useRef(null),[g,f]=k.useControllableState({value:e,defaultValue:n??!1,onChange:o}),h=s.useCallback(()=>{a.current!==null&&(clearTimeout(a.current),a.current=null)},[]),m=s.useCallback(()=>{b.current!==null&&(clearTimeout(b.current),b.current=null)},[]),x=k.useEventCallback((p=!1)=>{if(h(),m(),!g){if(p||r<=0){f(!0);return}a.current=setTimeout(()=>{a.current=null,f(!0)},r)}}),y=k.useEventCallback(()=>{if(h(),m(),!!g){if(c<=0){f(!1);return}b.current=setTimeout(()=>{b.current=null,f(!1)},c)}}),C=k.useEventCallback(()=>{h(),m(),f(!1)});s.useEffect(()=>{g?m():h()},[m,h,g]),s.useEffect(()=>()=>{h(),m()},[m,h]);const w=s.useMemo(()=>({open:g,triggerElement:u,setTriggerElement:d,contentId:i,requestOpen:x,requestClose:y,dismiss:C}),[i,g,C,y,x,u]);return l.jsx(me.Provider,{value:w,children:t})}function Xe({children:t}){const e=xe("Tooltip.Trigger"),{setTriggerElement:n}=e;if(!s.isValidElement(t))throw new Error("<Tooltip.Trigger> expects a single valid React element");const o=t,r=o.props,c=r.ref??o.ref,i=r.onPointerEnter,u=r.onPointerLeave,d=r.onFocus,a=r.onBlur,b=r.onKeyDown,g=s.useCallback(f=>{ye(c,f),n(f)},[c,n]);return s.cloneElement(o,{ref:g,"aria-describedby":e.open?Te(r["aria-describedby"],e.contentId):r["aria-describedby"],onPointerEnter:R(i,f=>{e.requestOpen(f.pointerType==="touch")}),onPointerLeave:R(u,f=>{f.pointerType!=="touch"&&e.requestClose()}),onFocus:R(d,()=>{e.requestOpen()}),onBlur:R(a,()=>{e.requestClose()}),onKeyDown:R(b,f=>{f.key==="Escape"&&e.open&&(f.preventDefault(),f.stopPropagation(),e.dismiss())})})}function A(t,e,n){return n<e?e:Math.min(Math.max(t,e),n)}function Ye(t){switch(t){case"top":return"bottom";case"right":return"left";case"bottom":return"top";case"left":return"right"}}function F(t,e,n,o,r){switch(e){case"top":return t.top-r;case"right":return n-t.right-r;case"bottom":return o-t.bottom-r;case"left":return t.left-r}}function Q(t,e,n,o,r,c,i){return F(t,n,r,c,i)>=(n==="top"||n==="bottom"?e.height:e.width)+o}function Je({trigger:t,tooltip:e,side:n,align:o,sideOffset:r,collisionPadding:c,avoidCollisions:i,viewportWidth:u,viewportHeight:d}){let a=n;if(i&&!Q(t,e,n,r,u,d,c)){const y=Ye(n),C=Q(t,e,y,r,u,d,c),w=F(t,n,u,d,c),p=F(t,y,u,d,c);(C||p>w)&&(a=y)}const b=t.left+t.width/2,g=t.top+t.height/2;let f=0,h=0;switch(a){case"top":case"bottom":f=o==="start"?t.left:o==="end"?t.right-e.width:b-e.width/2,h=a==="top"?t.top-e.height-r:t.bottom+r;break;case"left":case"right":f=a==="left"?t.left-e.width-r:t.right+r,h=o==="start"?t.top:o==="end"?t.bottom-e.height:g-e.height/2;break}i&&(f=A(f,c,u-e.width-c),h=A(h,c,d-e.height-c));const m=10,x=a==="top"||a==="bottom"?A(b-f,m,Math.max(m,e.width-m)):A(g-h,m,Math.max(m,e.height-m));return{x:f,y:h,side:a,arrowOffset:x}}function Ce(t,e,{side:n,align:o,sideOffset:r,collisionPadding:c,avoidCollisions:i}){const[u,d]=s.useState(null);return s.useLayoutEffect(()=>{const a=e.current;if(!a||!t)return;const b=()=>{const f=t.getBoundingClientRect(),h=a.getBoundingClientRect();d(Je({trigger:f,tooltip:h,side:n,align:o,sideOffset:r,collisionPadding:c,avoidCollisions:i,viewportWidth:window.innerWidth||document.documentElement.clientWidth,viewportHeight:window.innerHeight||document.documentElement.clientHeight}))};b(),window.addEventListener("resize",b),window.addEventListener("scroll",b,!0);const g=typeof ResizeObserver>"u"?null:new ResizeObserver(b);return g?.observe(t),g?.observe(a),()=>{window.removeEventListener("resize",b),window.removeEventListener("scroll",b,!0),g?.disconnect()}},[o,i,c,e,n,r,t]),u}function ve(t,e,n){s.useEffect(()=>{const o=i=>{const u=i.target;u instanceof Node&&(t.contains(u)||e.current?.contains(u)||n())},r=()=>{document.visibilityState==="hidden"&&n()},c=i=>{const u=i.target;i.key!=="Escape"||u instanceof Node&&t.contains(u)||n()};return document.addEventListener("pointerdown",o,!0),document.addEventListener("visibilitychange",r),document.addEventListener("keydown",c,!0),window.addEventListener("blur",n),()=>{document.removeEventListener("pointerdown",o,!0),document.removeEventListener("visibilitychange",r),document.removeEventListener("keydown",c,!0),window.removeEventListener("blur",n)}},[n,e,t])}function we(t){switch(t){case"top":return"center bottom";case"bottom":return"center top";case"left":return"right center";case"right":return"left center";default:return"center"}}function Qe({contentId:t,triggerElement:e,dismiss:n,children:o,className:r,style:c,side:i="top",align:u="center",sideOffset:d=8,collisionPadding:a=8,avoidCollisions:b=!0,...g}){const f=s.useRef(null),h=T.useReducedMotion()??!1,m=T.useIsPresent(),x=Ce(e,f,{side:i,align:u,sideOffset:d,collisionPadding:a,avoidCollisions:b});ve(e,f,n);const y=we(x?.side??i),C={...c,left:x?`${x.x}px`:0,top:x?`${x.y}px`:0,visibility:x?"visible":"hidden"};return l.jsx("div",{...g,ref:f,id:t,role:"tooltip","data-side":x?.side??i,"data-align":u,"data-state":m?"open":"closed","aria-hidden":m?void 0:!0,className:I("uk-tooltip",r),style:C,children:l.jsxs(T.motion.div,{className:"uk-tooltip__surface",style:{transformOrigin:y},initial:h?{opacity:0}:{opacity:0,scale:.96},animate:{opacity:1,scale:1},exit:h?{opacity:0}:{opacity:0,scale:.96},transition:h?O:Z,children:[l.jsx("span",{className:"uk-tooltip__arrow","aria-hidden":"true",style:{"--uk-tooltip-arrow-offset":`${x?.arrowOffset??0}px`}}),o]})})}function We(t){const e=xe("Tooltip.Content"),o=s.useSyncExternalStore(he,be,ge)&&e.triggerElement?e.triggerElement.closest("dialog")??document.body:null;return!o||!e.triggerElement?null:q.createPortal(l.jsx(T.MotionConfig,{reducedMotion:"user",children:l.jsx(T.AnimatePresence,{children:e.open?l.jsx(Qe,{contentId:e.contentId,triggerElement:e.triggerElement,dismiss:e.dismiss,...t},"uk-tooltip"):null})}),o)}const Ie=s.createContext(null);function Ze(t){const e=s.useContext(Ie);if(!e)throw new Error(`<${t}> must be rendered inside <Tooltip.Group>`);return e}function et({activeValue:t,content:e,contentClassName:n,contentId:o,dismiss:r,triggerElement:c,side:i,align:u,sideOffset:d,collisionPadding:a,avoidCollisions:b}){const g=s.useRef(null),f=T.useReducedMotion()??!1,h=T.useIsPresent(),m=Ce(c,g,{side:i,align:u,sideOffset:d,collisionPadding:a,avoidCollisions:b});ve(c,g,r);const x={left:m?`${m.x}px`:0,top:m?`${m.y}px`:0,transformOrigin:we(m?.side??i),visibility:m?"visible":"hidden"};return l.jsxs(T.motion.div,{ref:g,id:o,role:"tooltip",layout:!f,layoutDependency:t,"data-side":m?.side??i,"data-align":u,"data-state":h?"open":"closed","aria-hidden":h?void 0:!0,className:I("uk-tooltip","uk-tooltip__surface","uk-tooltip--group",n),style:x,initial:f?{opacity:0}:{opacity:0,scale:.96},animate:{opacity:1,scale:1},exit:f?{opacity:0}:{opacity:0,scale:.96},transition:f?{...O,layout:{duration:0}}:_e,children:[l.jsx("span",{className:"uk-tooltip__arrow","aria-hidden":"true",style:{"--uk-tooltip-arrow-offset":`${m?.arrowOffset??0}px`}}),l.jsx(T.motion.div,{className:"uk-tooltip__content",initial:{opacity:0},animate:{opacity:1},transition:f?O:Z,children:e},t)]})}function tt({children:t,side:e="top",align:n="center",sideOffset:o=8,collisionPadding:r=8,avoidCollisions:c=!0,delayDuration:i=180,closeDelay:u=80,contentClassName:d}){const a=s.useId(),[b,g]=s.useState(()=>new Map),[f,h]=s.useState(!1),[m,x]=s.useState(null),y=s.useRef(null),C=s.useRef(null),w=s.useSyncExternalStore(he,be,ge),p=s.useCallback(()=>{y.current!==null&&(clearTimeout(y.current),y.current=null)},[]),v=s.useCallback(()=>{C.current!==null&&(clearTimeout(C.current),C.current=null)},[]),j=k.useEventCallback((N,S=!1)=>{if(p(),v(),x(N),!f){if(S||i<=0){h(!0);return}y.current=setTimeout(()=>{y.current=null,h(!0)},i)}}),_=k.useEventCallback(()=>{if(p(),v(),!!f){if(u<=0){h(!1);return}C.current=setTimeout(()=>{C.current=null,h(!1)},u)}}),D=k.useEventCallback(()=>{p(),v(),h(!1)}),P=k.useEventCallback((N,S,M)=>{g(H=>{const U=H.get(N);if(U?.triggerElement===S&&Object.is(U.content,M))return H;const X=new Map(H);return X.set(N,{triggerElement:S,content:M}),X})}),E=k.useEventCallback(N=>{g(S=>{if(!S.has(N))return S;const M=new Map(S);return M.delete(N),M})});s.useEffect(()=>()=>{p(),v()},[v,p]);const ke=s.useMemo(()=>({open:f,activeValue:m,contentId:a,activate:j,requestClose:_,dismiss:D,register:P,unregister:E}),[j,m,a,D,f,P,_,E]),L=m?b.get(m):void 0,Ee=f&&!!L,K=w&&L?L.triggerElement.closest("dialog")??document.body:null;return l.jsxs(Ie.Provider,{value:ke,children:[t,K&&L?q.createPortal(l.jsx(T.MotionConfig,{reducedMotion:"user",children:l.jsx(T.AnimatePresence,{children:Ee?l.jsx(et,{activeValue:m??"",content:L.content,contentClassName:d,contentId:a,dismiss:D,triggerElement:L.triggerElement,side:e,align:n,sideOffset:o,collisionPadding:r,avoidCollisions:c},"uk-tooltip-group"):null})}),K):null]})}function nt({value:t,content:e,children:n}){const o=Ze("Tooltip.Item"),{register:r,unregister:c}=o,[i,u]=s.useState(null);if(!s.isValidElement(n))throw new Error("<Tooltip.Item> expects a single valid React element");const d=n,a=d.props,b=a.ref??d.ref,g=a.onPointerEnter,f=a.onPointerLeave,h=a.onFocus,m=a.onBlur,x=a.onKeyDown,y=o.open&&o.activeValue===t,C=s.useCallback(w=>{ye(b,w),u(w)},[b,u]);return s.useLayoutEffect(()=>{if(i)return r(t,i,e),()=>c(t)},[e,r,i,c,t]),s.cloneElement(d,{ref:C,"aria-describedby":y?Te(a["aria-describedby"],o.contentId):a["aria-describedby"],onPointerEnter:R(g,w=>{o.activate(t,w.pointerType==="touch")}),onPointerLeave:R(f,w=>{w.pointerType!=="touch"&&o.requestClose()}),onFocus:R(h,()=>{o.activate(t)}),onBlur:R(m,()=>{o.requestClose()}),onKeyDown:R(x,w=>{w.key==="Escape"&&y&&(w.preventDefault(),w.stopPropagation(),o.dismiss())})})}const ot={Root:Ue,Trigger:Xe,Content:We,Group:tt,Item:nt};exports.Button=G;exports.Dialog=Ke;exports.Input=je;exports.Sidebar=Le;exports.Switch=Re;exports.Tabs=Be;exports.Tooltip=ot;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|