visits-style 2.3.7 → 2.3.9
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/forms/Select/index.d.ts +6 -1
- package/dist/index.cjs.js +1 -1
- package/dist/index.es.js +39 -35
- package/package.json +1 -1
|
@@ -17,10 +17,15 @@ export interface Props<T> extends Omit<ButtonHTMLAttributes<HTMLButtonElement>,
|
|
|
17
17
|
onChange?: (value: T, item: OptionType<T>) => void;
|
|
18
18
|
onClear?: () => void;
|
|
19
19
|
renderItem?: (item: OptionType<T> | string, config: OptionRenderConfig) => ReactElement;
|
|
20
|
+
renderLabel?: (selectedLabel: string, isEmpty: boolean) => ReactNode;
|
|
20
21
|
placeholder?: string;
|
|
21
22
|
arrowIcon?: ReactNode;
|
|
22
23
|
closeIcon?: ReactNode;
|
|
23
24
|
checkIcon?: ReactNode;
|
|
25
|
+
/** Select中の固定Headerを追加したい場合 */
|
|
26
|
+
listHeader?: ReactNode;
|
|
27
|
+
/** Select中の固定Footerを追加したい場合 */
|
|
28
|
+
listFooter?: ReactNode;
|
|
24
29
|
/**
|
|
25
30
|
* select選択肢の最大高さ
|
|
26
31
|
* @default 408
|
|
@@ -42,7 +47,7 @@ export interface Props<T> extends Omit<ButtonHTMLAttributes<HTMLButtonElement>,
|
|
|
42
47
|
buttonRef?: Ref<HTMLButtonElement>;
|
|
43
48
|
popover?: Partial<Omit<PopoverProps, 'render' | 'onOpen' | 'ref'>>;
|
|
44
49
|
}
|
|
45
|
-
export default function Select<T = unknown>({ ref, className, placeholder, options, error, disabled, value, maxHeight, arrowIcon, closeIcon, checkIcon, onChange, onClear, renderItem, sectionLabelStyle, buttonAreaStyle, clearLabelText, optionStyle, popover, buttonRef, labelStyle, ...rest }: Props<T>): import("react").JSX.Element;
|
|
50
|
+
export default function Select<T = unknown>({ ref, className, placeholder, options, error, disabled, value, maxHeight, arrowIcon, closeIcon, checkIcon, onChange, onClear, renderItem, renderLabel, sectionLabelStyle, buttonAreaStyle, clearLabelText, listHeader, listFooter, optionStyle, popover, buttonRef, labelStyle, ...rest }: Props<T>): import("react").JSX.Element;
|
|
46
51
|
interface SelectItemProps<T> {
|
|
47
52
|
className?: string;
|
|
48
53
|
data: OptionType<T>;
|
package/dist/index.cjs.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,s)=>(s=n==null?{}:e(i(n)),o(r||!n||!n.__esModule||!a.call(n,`default`)?t(s,`default`,{value:n,enumerable:!0}):s,n));let c=require("clsx");c=s(c,1);let l=require("tailwind-merge"),u=require("react"),d=require("react/jsx-runtime"),f=require("@floating-ui/react"),p=require("react-dom");var m=c.default;function h(e,t){return t?(0,l.twMerge)(e,t):e}function g({as:e,classList:t=[],className:n,override:r,...i}){let a=(0,u.useMemo)(()=>r?n:h(m(t),n),[t,n,r]);return(0,u.createElement)(e||`div`,{className:a,...i})}function _(e,t,n={}){let r=({className:r,...i})=>{let a=(0,u.useMemo)(()=>h(t,r),[r]);return(0,u.createElement)(e,{className:a,...n,...i})};return r.displayName=`Styled${typeof e==`string`?e:`Component`}`,r}function v(e){return(0,d.jsx)(g,{as:`label`,classList:[`leading-none peer-disabled:opacity-70`],...e})}function y({label:e,render:t,required:n,htmlFor:r,error:i,help:a,helpBefore:o,innerClass:s,...c}){let l=(0,u.useMemo)(()=>m(`font-medium`,n?`after:content-["*"] after:text-danger after:text-sm after:pl-0.5`:``),[n]);return(0,d.jsxs)(g,{classList:`flex flex-col space-y-2`,...c,children:[e?(0,d.jsx)(v,{className:l,htmlFor:r,children:e}):null,a&&o?(0,d.jsx)(`p`,{className:`text-xs text-muted pb-2`,children:a}):null,(0,d.jsx)(`div`,{className:s,children:t(!!i)}),a&&!o&&!i?(0,d.jsx)(`p`,{className:`text-xs text-muted`,children:a}):null,i?(0,d.jsx)(`p`,{className:`text-xs text-danger`,children:i}):null]})}function b({error:e,...t}){return(0,d.jsx)(g,{as:`fieldset`,classList:[`flex rounded-md border bg-background px-3 py-2 w-full [&_input]:placeholder:text-muted`,`[&_input]:disabled:opacity-50 [&_input]:focus-visible:outline-none`,e?`border-danger hover:border-danger-fore`:`border-input`],...t})}function x({type:e,error:t,...n}){return(0,d.jsx)(g,{as:`input`,type:e,classList:[`flex rounded-md border bg-background px-3 py-2 w-full placeholder:text-muted`,`disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2`,t?`border-danger hover:border-danger-fore focus-visible:ring-danger`:`border-input not-disabled:hover:border-input-fore focus-visible:ring-ring`,e===`file`?`file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground`:null],...n})}function S({error:e,...t}){return(0,d.jsx)(g,{as:`textarea`,classList:[`flex rounded-md border bg-background px-3 py-2 w-full`,`disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-ring`,e?`border-danger hover:border-danger-fore`:`border-input not-disabled:hover:border-input-fore`],...t})}function C(){return(0,d.jsx)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`30`,height:`30`,viewBox:`0 0 30 30`,children:(0,d.jsx)(`rect`,{width:`20`,height:`3`,y:`13.5`,x:`4.5`,fill:`currentColor`,stroke:`none`,rx:`2`})})}function w({checked:e,indeterminate:t,id:n,name:r,onChange:i,value:a,checkIcon:o,error:s,...c}){let l=()=>{c.disabled||i?.(!e)};return(0,d.jsxs)(g,{as:`button`,type:`button`,role:`checkbox`,id:n||r,classList:[`inline-flex justify-center items-center border w-4.5 h-4.5 rounded`,`cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed`,{"border-danger hover:border-danger-fore":s,"bg-primary text-inverted disabled:text-text disabled:bg-input disabled:border-input":!s&&e,"border-input not-disabled:hover:border-input-fore":!s&&!e}],onClick:l,"aria-checked":e,...c,children:[e?o:null,t&&!e?(0,d.jsx)(C,{}):null,(0,d.jsx)(`input`,{type:`checkbox`,"aria-hidden":`true`,name:r,checked:e,value:a,onChange:l,disabled:c.disabled,style:{position:`absolute`,pointerEvents:`none`,top:0,left:0,width:1,height:1,opacity:0}})]})}var T=typeof window<`u`&&window.document!==void 0&&window.document.createElement!==void 0?u.useLayoutEffect:u.useEffect;function E({children:e,container:t,disabled:n}){let[r,i]=(0,u.useState)(null);return T(()=>{if(!t){let e=document.getElementById(`visits-style-portals`);return e||(e=document.createElement(`div`),e.id=`visits-style-portals`,document.body.appendChild(e)),i(e)}i(t)},[t]),n||!r?null:(0,p.createPortal)(e,r)}function D(e){e&&(e.stopPropagation(),e.preventDefault())}var O={open:150,close:75};function k({ref:e,position:t,render:n,children:r,disabled:i,offset:a={x:0,y:6},onOpen:o,onClose:s,onManualClose:c,timeout:l=O,override:p,zIndex:m=9996,role:h,...g}){let[_,v]=(0,u.useState)(!1),y=(0,f.useId)(),b=(0,u.useRef)(o),x=(0,u.useRef)(s),{refs:S,floatingStyles:C,context:w}=(0,f.useFloating)({nodeId:y,placement:t,middleware:[(0,f.shift)(),(0,f.flip)({fallbackAxisSideDirection:`end`}),(0,f.offset)({mainAxis:a.y,crossAxis:a.x})],open:_,onOpenChange:e=>{e?b.current?.(S.reference.current,S.floating.current):x.current?.(S.reference.current,S.floating.current),v(e)},whileElementsMounted:f.autoUpdate}),{isMounted:T,styles:k}=(0,f.useTransitionStyles)(w,{duration:l,initial({side:e}){let t=``;return t=e===`top`?`translateY(5%) scale(0.95)`:e===`bottom`?`translateY(-5%) scale(0.95)`:e===`left`?`translateX(5%) scale(0.95)`:`translateX(-5%) scale(0.95)`,{opacity:0,transform:t}}}),j=(0,u.useCallback)(e=>{if(D(e),c)return c();v(!1),x.current?.(S.reference.current,S.floating.current)},[c]);(0,u.useEffect)(()=>{if(i&&_)return v(!1)},[i,_]),(0,u.useImperativeHandle)(e,()=>({open:()=>{v(!0),b.current?.(S.reference.current,S.floating.current)},close:()=>{v(!1),x.current?.(S.reference.current,S.floating.current)}}),[]);let{getFloatingProps:M,getReferenceProps:N}=(0,f.useInteractions)([(0,f.useClick)(w,{enabled:!i})]);b.current=o,x.current=s;let P=`vs_${y||`tmp`}`;return(0,d.jsxs)(d.Fragment,{children:[n(N({ref:S.setReference,tabIndex:0,onClick:D,"aria-controls":P,"aria-expanded":_,"aria-disabled":i||void 0,disabled:i})),(0,d.jsx)(E,{disabled:i||!T,children:(0,d.jsx)(f.FloatingOverlay,{"data-testid":`vs-popover-shadow`,onClick:j,style:{zIndex:m},autoFocus:!0,children:(0,d.jsx)(`div`,{id:P,role:h||`region`,ref:S.setFloating,style:C,children:(0,d.jsx)(A,{override:p,styles:k,...M({...g,onClick:D}),children:r})})})})]})}function A({override:e,styles:t,style:n={},...r}){return(0,d.jsx)(g,{classList:[`z-20 w-auto h-auto outline-none transition-transform ease-in-out`,e?null:`border border-accent rounded-md shadow-lg p-1 bg-background`],style:{...t,...n},...r})}function j({ref:e,className:t,placeholder:n=``,options:r=[],error:i,disabled:a,value:o,maxHeight:s=408,arrowIcon:c,closeIcon:l,checkIcon:f,onChange:p,onClear:_,renderItem:v,sectionLabelStyle:y,buttonAreaStyle:b,clearLabelText:x,optionStyle:S,popover:C={},buttonRef:w,labelStyle:T,...E}){let D=(0,u.useRef)(null),[O,A]=(0,u.useState)(0),j=(0,u.useMemo)(()=>Array.isArray(o),[]),N=(0,u.useCallback)((e,t)=>{p?.(e,t),j||D.current?.close()},[p,j]),P=(0,u.useCallback)(e=>Array.isArray(o)?o.indexOf(e)>-1:o===e,[o]),F=(0,u.useMemo)(()=>{let e={},t=r.filter(e=>typeof e!=`string`);for(let n=0,r=t.length;n<r;n+=1){let r=t[n];e[`${r.value}`]=r.label}return e},[r]),I=(0,u.useMemo)(()=>{if(o==null||o===``)return n;if(Array.isArray(o)){if(!o.length)return n;let e=[...o].sort(),t=[];for(let n=0,r=e.length;n<r;n+=1)t[n]=F[`${e[n]}`]||``;return t.filter(Boolean).join(`,`)||n}return F[`${o}`]||n},[n,o,F]),L=(0,u.useMemo)(()=>o==null?!0:Array.isArray(o)?!o.length:!1,[o]),R=(0,u.useCallback)((e,t)=>v?typeof e==`string`?v(e,{index:t,selected:!1,onChange:()=>{}}):v(e,{index:t,selected:P(e.value),onChange:()=>N(e.value,e)}):typeof e==`string`?(0,d.jsx)(g,{as:`h5`,classList:[`font-normal py-1 px-2 text-muted`],className:y,children:e},`optionheader-${t}`):(0,d.jsx)(M,{selected:P(e.value),onChange:N,checkIcon:f,className:S,data:e},e.label),[v,N,P,y,S,f]);return(0,u.useImperativeHandle)(e,()=>D.current,[]),(0,d.jsx)(k,{render:e=>(0,d.jsxs)(`button`,{type:`button`,className:h(m(`flex items-center justify-between rounded-md border bg-background px-3 py-2 w-full overflow-hidden cursor-pointer`,`disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-ring`,i?`border-danger hover:border-danger-fore`:`border-input not-disabled:hover:border-input-fore`),t),disabled:a,...e,ref:t=>{e.ref?.(t),typeof w==`function`&&w?.(t)},...E,children:[(0,d.jsx)(g,{as:`span`,classList:[`overflow-hidden text-ellipsis whitespace-nowrap`,L?`text-muted`:`text-text`],className:T,children:I}),(0,d.jsxs)(g,{classList:`relative flex items-center space-x-2`,className:b,children:[_&&!L?(0,d.jsx)(`div`,{tabIndex:-1,role:`button`,className:`size-6 p-1.5 rounded hover:bg-accent cursor-pointer`,"aria-label":x,onKeyDown:e=>{(e.key===`Enter`||e.key===`Space`)&&_()},onClick:e=>{e.stopPropagation(),_()},children:l}):null,c]})]}),ref:D,onOpen:e=>A(e?.getBoundingClientRect().width||0),disabled:a,...C,children:(0,d.jsx)(`div`,{className:`overflow-y-auto flex flex-col`,role:`listbox`,style:{minWidth:O,maxWidth:`calc(100vw - 3rem)`,maxHeight:s},children:r.map(R)})})}function M({className:e,data:t,selected:n,checkIcon:r,onChange:i}){return(0,d.jsxs)(g,{as:`button`,type:`button`,role:`option`,classList:`flex items-center w-full hover:bg-accent rounded p-1 cursor-pointer`,className:e,"aria-selected":n,onClick:()=>i?.(t.value,t),children:[r===null||n&&r?r:(0,d.jsx)(`div`,{className:`w-5 h-1 mr-1`}),t.label]})}function N({checked:e,className:t,id:n,name:r,onChange:i,value:a,error:o,...s}){let c=()=>{s.disabled||i?.(!e)};return(0,d.jsxs)(g,{as:`button`,type:`button`,role:`radio`,id:n||r,classList:[`relative inline-flex justify-center items-center border w-4.5 h-4.5 rounded-full`,`cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed not-disabled:hover:border-input-fore`,o?`border-danger`:`border-input`,e?`[&_i]:bg-primary disabled:[&_i]:bg-text disabled:border-input`:``],className:t,onClick:c,"aria-checked":e,...s,children:[(0,d.jsx)(`i`,{className:`block w-2.5 h-2.5 rounded-full transition-transform`,style:{transform:e?``:`scale(0.8)`,opacity:+!!e}}),(0,d.jsx)(`input`,{type:`radio`,"aria-hidden":`true`,name:r,checked:e,value:a,onChange:c,disabled:s.disabled,style:{position:`absolute`,pointerEvents:`none`,top:0,left:0,width:1,height:1,opacity:0}})]})}function P({checked:e,onChange:t,value:n,id:r,name:i,error:a,ref:o,...s}){let c=()=>{s.disabled||t?.(!e)};return(0,d.jsxs)(g,{as:`button`,type:`button`,role:`switch`,id:r||i,classList:[`inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors`,`focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50`,`w-11`,e?`bg-primary disabled:bg-text`:`bg-input`],onClick:c,"aria-checked":e,"aria-invalid":a,...s,children:[(0,d.jsx)(`span`,{className:`pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform`,style:{transform:e?`translateX(100%)`:``}}),(0,d.jsx)(`input`,{ref:o,type:`checkbox`,"aria-hidden":`true`,name:i,checked:e,value:n,onChange:c,disabled:s.disabled,style:{position:`absolute`,pointerEvents:`none`,top:0,left:0,width:1,height:1,opacity:0}})]})}function F(e){return(0,d.jsx)(g,{classList:`inline-block animate-pulse rounded-md bg-accent`,...e})}function I({variant:e,size:t}){return m(`inline-flex items-center justify-center whitespace-nowrap transition-colors rounded-md cursor-pointer`,`focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring`,`disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-auto`,{"bg-primary text-inverted hover:bg-primary-fore":!e||e===`primary`,"bg-info text-inverted hover:bg-info-fore":e===`info`,"bg-warn text-inverted hover:bg-warn-fore":e===`warn`,"bg-danger text-inverted hover:bg-danger-fore":e===`danger`,"hover:bg-accent":e===`ghost`,"hover:underline":e===`link`,"border border-input hover:bg-accent":e===`outline`},{"px-2 py-1":t!==`icon`,"p-1.5":t===`icon`})}function L({size:e,variant:t,className:n,...r}){let i=(0,u.useMemo)(()=>h(I({size:e,variant:t}),n),[e,t,n]);return(0,d.jsx)(`button`,{className:i,type:`button`,...r})}function R(e){return(0,d.jsx)(g,{role:`group`,classList:[`flex items-center justify-center`,`[&_button]:rounded-none **:first:rounded-bl **:first:rounded-tl **:last:rounded-br **:last:rounded-tr`,`**:first:border-r-0 **:last:border-l-0`],...e})}function z({label:e=`Loading...`,...t}){return(0,d.jsxs)(g,{as:`svg`,classList:`fill-accent animate-spin text-primary`,"aria-label":e,"aria-hidden":`true`,width:`32`,height:`32`,viewBox:`0 0 100 101`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,...t,children:[(0,d.jsx)(`path`,{d:`M100 50.6a50 50 0 1 1-100 0 50 50 0 0 1 100 0Zm-91 0a41 41 0 1 0 82 0 41 41 0 0 0-82 0Z`,fill:`currentFill`}),(0,d.jsx)(`path`,{d:`M94 39a4.2 4.2 0 0 0 3-5.4A50 50 0 0 0 41.7 1.3c-2.4.4-3.9 2.9-3.2 5.3a5 5 0 0 0 5.6 3.5A41 41 0 0 1 88 36 5 5 0 0 0 94 39Z`,fill:`currentColor`})]})}function B({value:e,max:t,...n}){let r=(0,u.useMemo)(()=>e?Math.min(100,Math.round(e/t*100)):0,[e,t]);return(0,d.jsx)(g,{role:`progressbar`,classList:`relative overflow-hidden rounded-full bg-primary`,"aria-valuemax":t,"aria-valuemin":0,...n,children:(0,d.jsx)(g,{className:`h-full w-full flex-1 bg-input transition-all origin-right`,style:{transform:`translateX(${r}%)`}})})}function V({orientation:e=`horizontal`,...t}){return(0,d.jsx)(g,{as:`hr`,role:`none`,classList:[`border-0 p-0 shrink-0 bg-input`,e===`horizontal`?`h-px w-full`:`w-px h-full`],...t})}function H({header:e,show:t,children:n,groupStyle:r,timeout:i=300,...a}){let o=(0,u.useRef)(null),s=(0,u.useRef)(0),c=(0,u.useRef)(0),l=(0,u.useRef)(!0);return(0,u.useEffect)(()=>{c.current=i},[i]),T(()=>{if(!o.current)return;if(o.current.style.overflow=`hidden`,o.current.style.opacity=`1`,l.current){l.current=!1,o.current.style.height=t?`auto`:`0px`,t?window.requestAnimationFrame(()=>{o.current&&(s.current=o.current.offsetHeight)}):(window.requestAnimationFrame(()=>{o.current&&(o.current.style.height=`auto`,s.current=o.current.offsetHeight,o.current.style.height=`0px`)}),o.current.style.opacity=`0`);return}t||(o.current.style.height=`${s.current}px`);let e=[];e[0]=window.requestAnimationFrame(()=>{e[1]=window.requestAnimationFrame(()=>{o.current&&(o.current.style.height=`${t?s.current:0}px`,o.current.style.opacity=t?`1`:`0`)})});let n,r=()=>{o.current&&(t?(o.current.style.height=`auto`,o.current.style.overflow=``,o.current.style.opacity=``,window.requestAnimationFrame(()=>{o.current&&(s.current=o.current.offsetHeight)})):o.current.style.height=`0px`)};return c.current===0?r():n=window.setTimeout(r,c.current),()=>{e.forEach(window.cancelAnimationFrame),n&&window.clearTimeout(n)}},[t]),(0,d.jsxs)(`div`,{...a,children:[e,(0,d.jsx)(g,{classList:`transition-all ease-in-out overflow-hidden`,className:r,role:`group`,"aria-hidden":!t,ref:o,style:{transitionDuration:`${i}ms`},children:n})]})}var U=(0,u.forwardRef)(({render:e,position:t=`bottom`,label:n,className:r,timeout:i=150,offset:a={x:0,y:6},clientPoint:o=!1,disabled:s},c)=>{let[l,p]=(0,u.useState)(!1),m=(0,f.useId)(),{refs:h,floatingStyles:g,context:_}=(0,f.useFloating)({nodeId:m,open:l,placement:t,middleware:[(0,f.shift)(),(0,f.flip)(),(0,f.offset)({mainAxis:a.y,crossAxis:a.x})],whileElementsMounted:s?void 0:f.autoUpdate,onOpenChange:p}),{getReferenceProps:v,getFloatingProps:y}=(0,f.useInteractions)([(0,f.useHover)(_,{enabled:!s}),(0,f.useClientPoint)(_,{enabled:o})]),{isMounted:b,styles:x}=(0,f.useTransitionStyles)(_,{duration:i,initial:{opacity:0,transform:`scale(0.8)`}});return(0,u.useImperativeHandle)(c,()=>({floating:h.floating,reference:h.reference,open:()=>p(!0),close:()=>p(!1)})),(0,u.useEffect)(()=>{s&&p(!1)},[s]),(0,d.jsxs)(d.Fragment,{children:[e({ref:h.setReference,...v()}),(0,d.jsx)(E,{disabled:s||!b,children:(0,d.jsx)(`div`,{role:`tooltip`,className:`z-9999`,ref:h.setFloating,...y({style:g}),children:(0,d.jsx)(W,{className:r,style:x,children:n})})})]})});U.displayName=`Tooltip`;var W=(0,u.forwardRef)(({className:e,custom:t,...n},r)=>{let i=(0,u.useMemo)(()=>h(m(`relative w-auto h-auto outline-none transition-transform ease-in-out whitespace-pre`,t?null:`border border-accent rounded shadow-md px-3 py-1 bg-background`),e),[e,t]);return(0,d.jsx)(`div`,{ref:r,className:i,...n})});W.displayName=`TooltipContent`;var G={open:150,close:75};function K({open:e,children:t,timeout:n=G,padding:r=`0.85rem`,verticalAlign:i=`center`,closeOnOverlay:a,closeOnEsc:o,onExited:s,className:c,onOpenChange:l,size:p,...h}){let g=(0,u.useRef)(s),_=(0,u.useRef)(!1),v=(0,f.useId)(),{refs:y,context:b}=(0,f.useFloating)({open:e,onOpenChange:l,nodeId:v}),{getFloatingProps:x}=(0,f.useInteractions)([(0,f.useDismiss)(b,{enabled:o,escapeKey:o,outsidePress:!1})]),{isMounted:S,styles:C}=(0,f.useTransitionStyles)(b,{duration:n,initial:{opacity:0,transform:`scale(0.8)`}});(0,u.useEffect)(()=>{_.current!==S&&(_.current=S,!S&&g.current?.())},[S]);let w=(0,u.useCallback)(()=>{a&&l?.(!1)},[l,a]);g.current=s;let T=(0,u.useMemo)(()=>m(`grid bg-backdrop z-40 justify-items-center transition ease-in-out`,{"place-items-start items-start":i===`start`,"place-items-end":i===`end`,"place-items-center":i===`center`||!i}),[i]);return(0,d.jsx)(E,{disabled:!S,children:(0,d.jsx)(f.FloatingOverlay,{className:T,"data-testid":`vs-dialog-overlay`,onClick:w,style:{padding:r,opacity:C.opacity},lockScroll:!0,children:(0,d.jsx)(q,{ref:y.setFloating,className:c,role:`dialog`,size:p,...x({...h,style:C,onClick:e=>e?.stopPropagation()}),children:t})})})}function q({size:e,...t}){return(0,d.jsx)(g,{classList:[e?`flex flex-col bg-background shadow-lg p-5 rounded`:null,{"w-full max-w-dialog-sm":e===`small`,"w-full max-w-dialog-md":e===`medium`,"w-full max-w-dialog-lg":e===`large`}],...t})}var J={open:250,close:150};function Y({open:e,timeout:t=J,onOpenChange:n,position:r=`right`,overlay:i,onExited:a,onOpen:o,containerStyle:s,...c}){let l=(0,f.useId)(),p=(0,u.useRef)(!1),m=(0,u.useRef)(o),h=(0,u.useRef)(a),{refs:_,context:v}=(0,f.useFloating)({open:e,onOpenChange:n,nodeId:l}),{isMounted:y,styles:b}=(0,f.useTransitionStyles)(v,{duration:t,initial(){let e=`translateX(75%)`;return r===`left`?e=`translateX(-75%)`:r===`top`?e=`translateY(-75%)`:r===`bottom`&&(e=`translateY(75%)`),{opacity:0,transform:e}}});return(0,u.useEffect)(()=>{if(p.current!==y){if(p.current=y,y){m.current?.();return}h.current?.()}},[y]),h.current=a,m.current=o,(0,d.jsxs)(E,{disabled:!y,children:[i?(0,d.jsx)(f.FloatingOverlay,{className:i===`transparent`?``:`bg-backdrop`,style:{opacity:b.opacity},onClick:()=>n?.(!1)}):null,(0,d.jsx)(g,{ref:_.setFloating,role:`complementary`,classList:[`fixed transition-transform z-1`,{"top-0 right-0 h-full max-h-screen":r===`right`,"top-0 left-0 h-full max-h-screen":r===`left`,"top-0 left-0 right-0 w-full max-w-screen":r===`top`,"bottom-0 left-0 right-0 w-full max-w-screen":r===`bottom`}],className:s,style:b,children:(0,d.jsx)(ee,{...c})})]})}function ee(e){return(0,d.jsx)(g,{classList:`relative bg-background min-w-full min-h-full border border-input shadow-lg`,...e})}function X({type:e,label:t,message:n}){let{icons:r}=ne();return(0,d.jsxs)(`div`,{className:`flex items-center px-4 py-3 w-80 text-sm bg-background border border-input rounded-lg shadow-md m-2`,children:[e?(0,d.jsxs)(`figure`,{className:`mr-2`,children:[e===`success`&&r?.success?r.success:null,e===`info`&&r?.info?r.info:null,e===`error`&&r?.error?r.error:null,e===`warn`&&r?.warn?r.warn:null,e===`loading`?r?.loading:null]}):null,(0,d.jsxs)(`div`,{className:`space-y-2`,children:[(0,d.jsx)(`p`,{className:`font-medium leading-none`,children:t}),n?(0,d.jsx)(`p`,{children:n}):null]})]})}function Z(){}var Q=new class{notify=Z;lastId=0;subscribe=e=>(this.notify=e,()=>{this.notify=Z});add=(e,t={})=>{this.lastId+=1;let n=`${this.lastId}`;return this.notify({id:n,type:`add`,config:{id:n,label:e,...t}}),n};update=(e,t)=>{this.notify({id:e,type:`update`,config:t})};remove=e=>{this.notify({id:e,type:`remove`})};clear=()=>{this.lastId=0}};function te({id:e,type:t,index:n,duration:r=5e3,className:i,children:a,inverted:o,timeout:s=250,max:l=3}){let p=(0,u.useRef)(!1),[m,h]=(0,u.useState)(!1),{context:g,refs:_}=(0,f.useFloating)({open:m,onOpenChange:h,nodeId:e}),{isMounted:v,styles:y}=(0,f.useTransitionStyles)(g,{duration:s,initial:{opacity:0,transform:`translateY(${o?``:`-`}50%)`}});(0,u.useLayoutEffect)(()=>{h(n<=l)},[n,l]),(0,u.useEffect)(()=>{p.current!==v&&(v||Q.remove(e),p.current=v)},[v,e]),(0,u.useEffect)(()=>{if(!r)return;let e=window.setTimeout(()=>h(!1),r);return()=>window.clearTimeout(e)},[r,e]);let b=(0,u.useCallback)(()=>{t!==`loading`&&h(!1)},[t]),x=(0,u.useMemo)(()=>(0,c.default)(`relative flex w-fit transition-transform ease-in-out cursor-pointer`,i),[i]);return v?(0,d.jsx)(`li`,{role:`log`,tabIndex:-1,ref:_.setFloating,className:x,style:y,onClick:b,children:a}):null}var $=(0,u.createContext)({});function ne(){return(0,u.useContext)($)}function re({className:e,offset:t={},position:n=`top-left`,max:r,ListItem:i=X,icons:a,timeout:o}){let s=(0,u.useMemo)(()=>{let e={position:`fixed`,...t};return Object.keys(t).length||(n.indexOf(`top`)>-1?e.top=`16px`:n.indexOf(`bottom`)>-1&&(e.bottom=`16px`),n.indexOf(`left`)>-1?e.left=`16px`:n.indexOf(`right`)>-1&&(e.right=`16px`)),n.indexOf(`left`)>-1?e.alignItems=`flex-start`:n.indexOf(`right`)>-1?e.alignItems=`flex-end`:(e.left=`50%`,e.alignItems=`center`,e.transform=`translateX(-50%)`),e},[t,n]),l=(0,u.useMemo)(()=>(0,c.default)(`flex flex-col z-40 overflow-hidden`,e),[e]),f=(0,u.useMemo)(()=>n?.startsWith(`bottom`)||!1,[n]),p=(0,u.useRef)(new Map),[m,h]=(0,u.useState)([]),g=(0,u.useState)(0)[1];T(()=>Q.subscribe(e=>{(0,u.startTransition)(()=>{if(e.type===`add`)p.current.set(e.id,e.config),h(t=>[...t,e.id]);else if(e.type===`remove`){if(!p.current.delete(e.id))return;h(t=>{let n=new Set(t);return n.has(e.id)?(n.delete(e.id),Array.from(n)):t})}else if(e.type===`update`){let t=p.current.get(e.id);if(!t)return;p.current.set(e.id,{...t,...e.config}),g(e=>e+1)}})}),[]);let _=(0,u.useMemo)(()=>({icons:a}),[a]),v=m.length;return(0,d.jsx)(E,{children:(0,d.jsx)(`ol`,{className:l,style:s,"aria-live":`polite`,children:(0,d.jsx)($.Provider,{value:_,children:m.map((e,t)=>{let n=p.current.get(e);if(!n)return null;let{className:a,duration:s,...c}=n;return(0,d.jsx)(te,{id:e,index:v-t,className:a,duration:s,inverted:f,timeout:o,max:r,children:(0,u.createElement)(i,c)},e)})})})})}exports.Accordion=H,exports.Base=g,exports.Button=L,exports.ButtonGroup=R,exports.Checkbox=w,exports.Dialog=K,exports.Divider=V,exports.FormField=y,exports.FormLabel=v,exports.Input=x,exports.InputField=b,exports.Popover=k,exports.Portal=E,exports.Progress=B,exports.Radio=N,exports.Select=j,exports.Sheet=Y,exports.Skeleton=F,exports.Spinner=z,exports.Switch=P,exports.Textarea=S,exports.Toast=re,exports.ToastItem=X,exports.Tooltip=U,exports.cn=m,exports.element=_,exports.merge=h,exports.toast=Q,exports.varientButton=I;
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,s)=>(s=n==null?{}:e(i(n)),o(r||!n||!n.__esModule||!a.call(n,`default`)?t(s,`default`,{value:n,enumerable:!0}):s,n));let c=require("clsx");c=s(c,1);let l=require("tailwind-merge"),u=require("react"),d=require("react/jsx-runtime"),f=require("@floating-ui/react"),p=require("react-dom");var m=c.default;function h(e,t){return t?(0,l.twMerge)(e,t):e}function g({as:e,classList:t=[],className:n,override:r,...i}){let a=(0,u.useMemo)(()=>r?n:h(m(t),n),[t,n,r]);return(0,u.createElement)(e||`div`,{className:a,...i})}function _(e,t,n={}){let r=({className:r,...i})=>{let a=(0,u.useMemo)(()=>h(t,r),[r]);return(0,u.createElement)(e,{className:a,...n,...i})};return r.displayName=`Styled${typeof e==`string`?e:`Component`}`,r}function v(e){return(0,d.jsx)(g,{as:`label`,classList:[`leading-none peer-disabled:opacity-70`],...e})}function y({label:e,render:t,required:n,htmlFor:r,error:i,help:a,helpBefore:o,innerClass:s,...c}){let l=(0,u.useMemo)(()=>m(`font-medium`,n?`after:content-["*"] after:text-danger after:text-sm after:pl-0.5`:``),[n]);return(0,d.jsxs)(g,{classList:`flex flex-col space-y-2`,...c,children:[e?(0,d.jsx)(v,{className:l,htmlFor:r,children:e}):null,a&&o?(0,d.jsx)(`p`,{className:`text-xs text-muted pb-2`,children:a}):null,(0,d.jsx)(`div`,{className:s,children:t(!!i)}),a&&!o&&!i?(0,d.jsx)(`p`,{className:`text-xs text-muted`,children:a}):null,i?(0,d.jsx)(`p`,{className:`text-xs text-danger`,children:i}):null]})}function b({error:e,...t}){return(0,d.jsx)(g,{as:`fieldset`,classList:[`flex rounded-md border bg-background px-3 py-2 w-full [&_input]:placeholder:text-muted`,`[&_input]:disabled:opacity-50 [&_input]:focus-visible:outline-none`,e?`border-danger hover:border-danger-fore`:`border-input`],...t})}function x({type:e,error:t,...n}){return(0,d.jsx)(g,{as:`input`,type:e,classList:[`flex rounded-md border bg-background px-3 py-2 w-full placeholder:text-muted`,`disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2`,t?`border-danger hover:border-danger-fore focus-visible:ring-danger`:`border-input not-disabled:hover:border-input-fore focus-visible:ring-ring`,e===`file`?`file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground`:null],...n})}function S({error:e,...t}){return(0,d.jsx)(g,{as:`textarea`,classList:[`flex rounded-md border bg-background px-3 py-2 w-full`,`disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-ring`,e?`border-danger hover:border-danger-fore`:`border-input not-disabled:hover:border-input-fore`],...t})}function C(){return(0,d.jsx)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`30`,height:`30`,viewBox:`0 0 30 30`,children:(0,d.jsx)(`rect`,{width:`20`,height:`3`,y:`13.5`,x:`4.5`,fill:`currentColor`,stroke:`none`,rx:`2`})})}function w({checked:e,indeterminate:t,id:n,name:r,onChange:i,value:a,checkIcon:o,error:s,...c}){let l=()=>{c.disabled||i?.(!e)};return(0,d.jsxs)(g,{as:`button`,type:`button`,role:`checkbox`,id:n||r,classList:[`inline-flex justify-center items-center border w-4.5 h-4.5 rounded`,`cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed`,{"border-danger hover:border-danger-fore":s,"bg-primary text-inverted disabled:text-text disabled:bg-input disabled:border-input":!s&&e,"border-input not-disabled:hover:border-input-fore":!s&&!e}],onClick:l,"aria-checked":e,...c,children:[e?o:null,t&&!e?(0,d.jsx)(C,{}):null,(0,d.jsx)(`input`,{type:`checkbox`,"aria-hidden":`true`,name:r,checked:e,value:a,onChange:l,disabled:c.disabled,style:{position:`absolute`,pointerEvents:`none`,top:0,left:0,width:1,height:1,opacity:0}})]})}var T=typeof window<`u`&&window.document!==void 0&&window.document.createElement!==void 0?u.useLayoutEffect:u.useEffect;function E({children:e,container:t,disabled:n}){let[r,i]=(0,u.useState)(null);return T(()=>{if(!t){let e=document.getElementById(`visits-style-portals`);return e||(e=document.createElement(`div`),e.id=`visits-style-portals`,document.body.appendChild(e)),i(e)}i(t)},[t]),n||!r?null:(0,p.createPortal)(e,r)}function D(e){e&&(e.stopPropagation(),e.preventDefault())}var O={open:150,close:75};function k({ref:e,position:t,render:n,children:r,disabled:i,offset:a={x:0,y:6},onOpen:o,onClose:s,onManualClose:c,timeout:l=O,override:p,zIndex:m=9996,role:h,...g}){let[_,v]=(0,u.useState)(!1),y=(0,f.useId)(),b=(0,u.useRef)(o),x=(0,u.useRef)(s),{refs:S,floatingStyles:C,context:w}=(0,f.useFloating)({nodeId:y,placement:t,middleware:[(0,f.shift)(),(0,f.flip)({fallbackAxisSideDirection:`end`}),(0,f.offset)({mainAxis:a.y,crossAxis:a.x})],open:_,onOpenChange:e=>{e?b.current?.(S.reference.current,S.floating.current):x.current?.(S.reference.current,S.floating.current),v(e)},whileElementsMounted:f.autoUpdate}),{isMounted:T,styles:k}=(0,f.useTransitionStyles)(w,{duration:l,initial({side:e}){let t=``;return t=e===`top`?`translateY(5%) scale(0.95)`:e===`bottom`?`translateY(-5%) scale(0.95)`:e===`left`?`translateX(5%) scale(0.95)`:`translateX(-5%) scale(0.95)`,{opacity:0,transform:t}}}),j=(0,u.useCallback)(e=>{if(D(e),c)return c();v(!1),x.current?.(S.reference.current,S.floating.current)},[c]);(0,u.useEffect)(()=>{if(i&&_)return v(!1)},[i,_]),(0,u.useImperativeHandle)(e,()=>({open:()=>{v(!0),b.current?.(S.reference.current,S.floating.current)},close:()=>{v(!1),x.current?.(S.reference.current,S.floating.current)}}),[]);let{getFloatingProps:M,getReferenceProps:N}=(0,f.useInteractions)([(0,f.useClick)(w,{enabled:!i})]);b.current=o,x.current=s;let P=`vs_${y||`tmp`}`;return(0,d.jsxs)(d.Fragment,{children:[n(N({ref:S.setReference,tabIndex:0,onClick:D,"aria-controls":P,"aria-expanded":_,"aria-disabled":i||void 0,disabled:i})),(0,d.jsx)(E,{disabled:i||!T,children:(0,d.jsx)(f.FloatingOverlay,{"data-testid":`vs-popover-shadow`,onClick:j,style:{zIndex:m},autoFocus:!0,children:(0,d.jsx)(`div`,{id:P,role:h||`region`,ref:S.setFloating,style:C,children:(0,d.jsx)(A,{override:p,styles:k,...M({...g,onClick:D}),children:r})})})})]})}function A({override:e,styles:t,style:n={},...r}){return(0,d.jsx)(g,{classList:[`z-20 w-auto h-auto outline-none transition-transform ease-in-out`,e?null:`border border-accent rounded-md shadow-lg p-1 bg-background`],style:{...t,...n},...r})}function j({ref:e,className:t,placeholder:n=``,options:r=[],error:i,disabled:a,value:o,maxHeight:s=408,arrowIcon:c,closeIcon:l,checkIcon:f,onChange:p,onClear:_,renderItem:v,renderLabel:y,sectionLabelStyle:b,buttonAreaStyle:x,clearLabelText:S,listHeader:C,listFooter:w,optionStyle:T,popover:E={},buttonRef:D,labelStyle:O,...A}){let j=(0,u.useRef)(null),[N,P]=(0,u.useState)(0),F=(0,u.useMemo)(()=>Array.isArray(o),[]),I=(0,u.useCallback)((e,t)=>{p?.(e,t),F||j.current?.close()},[p,F]),L=(0,u.useCallback)(e=>Array.isArray(o)?o.indexOf(e)>-1:o===e,[o]),R=(0,u.useMemo)(()=>{let e={},t=r.filter(e=>typeof e!=`string`);for(let n=0,r=t.length;n<r;n+=1){let r=t[n];e[`${r.value}`]=r.label}return e},[r]),z=(0,u.useMemo)(()=>{if(o==null||o===``)return n;if(Array.isArray(o)){if(!o.length)return n;let e=[...o].sort(),t=[];for(let n=0,r=e.length;n<r;n+=1)t[n]=R[`${e[n]}`]||``;return t.filter(Boolean).join(`,`)||n}return R[`${o}`]||n},[n,o,R]),B=(0,u.useMemo)(()=>o==null?!0:Array.isArray(o)?!o.length:!1,[o]),V=(0,u.useCallback)((e,t)=>v?typeof e==`string`?v(e,{index:t,selected:!1,onChange:()=>{}}):v(e,{index:t,selected:L(e.value),onChange:()=>I(e.value,e)}):typeof e==`string`?(0,d.jsx)(g,{as:`h5`,classList:[`font-normal py-1 px-2 text-muted`],className:b,children:e},`optionheader-${t}`):(0,d.jsx)(M,{selected:L(e.value),onChange:I,checkIcon:f,className:T,data:e},e.label),[v,I,L,b,T,f]);return(0,u.useImperativeHandle)(e,()=>j.current,[]),(0,d.jsx)(k,{render:e=>(0,d.jsxs)(`button`,{type:`button`,className:h(m(`flex items-center justify-between rounded-md border bg-background px-3 py-2 w-full overflow-hidden cursor-pointer`,`disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-ring`,i?`border-danger hover:border-danger-fore`:`border-input not-disabled:hover:border-input-fore`),t),disabled:a,...e,ref:t=>{e.ref?.(t),typeof D==`function`&&D?.(t)},...A,children:[y?y(z,B):(0,d.jsx)(g,{as:`span`,classList:[`overflow-hidden text-ellipsis whitespace-nowrap`,B?`text-muted`:`text-text`],className:O,children:z}),(0,d.jsxs)(g,{classList:`relative flex items-center space-x-2`,className:x,children:[_&&!B?(0,d.jsx)(`div`,{tabIndex:-1,role:`button`,className:`size-6 p-1.5 rounded hover:bg-accent cursor-pointer`,"aria-label":S,onKeyDown:e=>{(e.key===`Enter`||e.key===`Space`)&&_()},onClick:e=>{e.stopPropagation(),_()},children:l}):null,c]})]}),ref:j,onOpen:e=>P(e?.getBoundingClientRect().width||0),disabled:a,...E,children:(0,d.jsxs)(`div`,{className:`overflow-y-auto flex flex-col`,role:`listbox`,style:{minWidth:N,maxWidth:`calc(100vw - 3rem)`,maxHeight:s},children:[C,r.map(V),w]})})}function M({className:e,data:t,selected:n,checkIcon:r,onChange:i}){return(0,d.jsxs)(g,{as:`button`,type:`button`,role:`option`,classList:`flex items-center w-full hover:bg-accent rounded p-1 cursor-pointer`,className:e,"aria-selected":n,onClick:()=>i?.(t.value,t),children:[r===null||n&&r?r:(0,d.jsx)(`div`,{className:`w-5 h-1 mr-1`}),t.label]})}function N({checked:e,className:t,id:n,name:r,onChange:i,value:a,error:o,...s}){let c=()=>{s.disabled||i?.(!e)};return(0,d.jsxs)(g,{as:`button`,type:`button`,role:`radio`,id:n||r,classList:[`relative inline-flex justify-center items-center border w-4.5 h-4.5 rounded-full`,`cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed not-disabled:hover:border-input-fore`,o?`border-danger`:`border-input`,e?`[&_i]:bg-primary disabled:[&_i]:bg-text disabled:border-input`:``],className:t,onClick:c,"aria-checked":e,...s,children:[(0,d.jsx)(`i`,{className:`block w-2.5 h-2.5 rounded-full transition-transform`,style:{transform:e?``:`scale(0.8)`,opacity:+!!e}}),(0,d.jsx)(`input`,{type:`radio`,"aria-hidden":`true`,name:r,checked:e,value:a,onChange:c,disabled:s.disabled,style:{position:`absolute`,pointerEvents:`none`,top:0,left:0,width:1,height:1,opacity:0}})]})}function P({checked:e,onChange:t,value:n,id:r,name:i,error:a,ref:o,...s}){let c=()=>{s.disabled||t?.(!e)};return(0,d.jsxs)(g,{as:`button`,type:`button`,role:`switch`,id:r||i,classList:[`inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors`,`focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50`,`w-11`,e?`bg-primary disabled:bg-text`:`bg-input`],onClick:c,"aria-checked":e,"aria-invalid":a,...s,children:[(0,d.jsx)(`span`,{className:`pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform`,style:{transform:e?`translateX(100%)`:``}}),(0,d.jsx)(`input`,{ref:o,type:`checkbox`,"aria-hidden":`true`,name:i,checked:e,value:n,onChange:c,disabled:s.disabled,style:{position:`absolute`,pointerEvents:`none`,top:0,left:0,width:1,height:1,opacity:0}})]})}function F(e){return(0,d.jsx)(g,{classList:`inline-block animate-pulse rounded-md bg-accent`,...e})}function I({variant:e,size:t}){return m(`inline-flex items-center justify-center whitespace-nowrap transition-colors rounded-md cursor-pointer`,`focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring`,`disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-auto`,{"bg-primary text-inverted hover:bg-primary-fore":!e||e===`primary`,"bg-info text-inverted hover:bg-info-fore":e===`info`,"bg-warn text-inverted hover:bg-warn-fore":e===`warn`,"bg-danger text-inverted hover:bg-danger-fore":e===`danger`,"hover:bg-accent":e===`ghost`,"hover:underline":e===`link`,"border border-input hover:bg-accent":e===`outline`},{"px-2 py-1":t!==`icon`,"p-1.5":t===`icon`})}function L({size:e,variant:t,className:n,...r}){let i=(0,u.useMemo)(()=>h(I({size:e,variant:t}),n),[e,t,n]);return(0,d.jsx)(`button`,{className:i,type:`button`,...r})}function R(e){return(0,d.jsx)(g,{role:`group`,classList:[`flex items-center justify-center`,`[&_button]:rounded-none **:first:rounded-bl **:first:rounded-tl **:last:rounded-br **:last:rounded-tr`,`**:first:border-r-0 **:last:border-l-0`],...e})}function z({label:e=`Loading...`,...t}){return(0,d.jsxs)(g,{as:`svg`,classList:`fill-accent animate-spin text-primary`,"aria-label":e,"aria-hidden":`true`,width:`32`,height:`32`,viewBox:`0 0 100 101`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,...t,children:[(0,d.jsx)(`path`,{d:`M100 50.6a50 50 0 1 1-100 0 50 50 0 0 1 100 0Zm-91 0a41 41 0 1 0 82 0 41 41 0 0 0-82 0Z`,fill:`currentFill`}),(0,d.jsx)(`path`,{d:`M94 39a4.2 4.2 0 0 0 3-5.4A50 50 0 0 0 41.7 1.3c-2.4.4-3.9 2.9-3.2 5.3a5 5 0 0 0 5.6 3.5A41 41 0 0 1 88 36 5 5 0 0 0 94 39Z`,fill:`currentColor`})]})}function B({value:e,max:t,...n}){let r=(0,u.useMemo)(()=>e?Math.min(100,Math.round(e/t*100)):0,[e,t]);return(0,d.jsx)(g,{role:`progressbar`,classList:`relative overflow-hidden rounded-full bg-primary`,"aria-valuemax":t,"aria-valuemin":0,...n,children:(0,d.jsx)(g,{className:`h-full w-full flex-1 bg-input transition-all origin-right`,style:{transform:`translateX(${r}%)`}})})}function V({orientation:e=`horizontal`,...t}){return(0,d.jsx)(g,{as:`hr`,role:`none`,classList:[`border-0 p-0 shrink-0 bg-input`,e===`horizontal`?`h-px w-full`:`w-px h-full`],...t})}function H({header:e,show:t,children:n,groupStyle:r,timeout:i=300,...a}){let o=(0,u.useRef)(null),s=(0,u.useRef)(0),c=(0,u.useRef)(0),l=(0,u.useRef)(!0);return(0,u.useEffect)(()=>{c.current=i},[i]),T(()=>{if(!o.current)return;if(o.current.style.overflow=`hidden`,o.current.style.opacity=`1`,l.current){l.current=!1,o.current.style.height=t?`auto`:`0px`,t?window.requestAnimationFrame(()=>{o.current&&(s.current=o.current.offsetHeight)}):(window.requestAnimationFrame(()=>{o.current&&(o.current.style.height=`auto`,s.current=o.current.offsetHeight,o.current.style.height=`0px`)}),o.current.style.opacity=`0`);return}t||(o.current.style.height=`${s.current}px`);let e=[];e[0]=window.requestAnimationFrame(()=>{e[1]=window.requestAnimationFrame(()=>{o.current&&(o.current.style.height=`${t?s.current:0}px`,o.current.style.opacity=t?`1`:`0`)})});let n,r=()=>{o.current&&(t?(o.current.style.height=`auto`,o.current.style.overflow=``,o.current.style.opacity=``,window.requestAnimationFrame(()=>{o.current&&(s.current=o.current.offsetHeight)})):o.current.style.height=`0px`)};return c.current===0?r():n=window.setTimeout(r,c.current),()=>{e.forEach(window.cancelAnimationFrame),n&&window.clearTimeout(n)}},[t]),(0,d.jsxs)(`div`,{...a,children:[e,(0,d.jsx)(g,{classList:`transition-all ease-in-out overflow-hidden`,className:r,role:`group`,"aria-hidden":!t,ref:o,style:{transitionDuration:`${i}ms`},children:n})]})}var U=(0,u.forwardRef)(({render:e,position:t=`bottom`,label:n,className:r,timeout:i=150,offset:a={x:0,y:6},clientPoint:o=!1,disabled:s},c)=>{let[l,p]=(0,u.useState)(!1),m=(0,f.useId)(),{refs:h,floatingStyles:g,context:_}=(0,f.useFloating)({nodeId:m,open:l,placement:t,middleware:[(0,f.shift)(),(0,f.flip)(),(0,f.offset)({mainAxis:a.y,crossAxis:a.x})],whileElementsMounted:s?void 0:f.autoUpdate,onOpenChange:p}),{getReferenceProps:v,getFloatingProps:y}=(0,f.useInteractions)([(0,f.useHover)(_,{enabled:!s}),(0,f.useClientPoint)(_,{enabled:o})]),{isMounted:b,styles:x}=(0,f.useTransitionStyles)(_,{duration:i,initial:{opacity:0,transform:`scale(0.8)`}});return(0,u.useImperativeHandle)(c,()=>({floating:h.floating,reference:h.reference,open:()=>p(!0),close:()=>p(!1)})),(0,u.useEffect)(()=>{s&&p(!1)},[s]),(0,d.jsxs)(d.Fragment,{children:[e({ref:h.setReference,...v()}),(0,d.jsx)(E,{disabled:s||!b,children:(0,d.jsx)(`div`,{role:`tooltip`,className:`z-9999`,ref:h.setFloating,...y({style:g}),children:(0,d.jsx)(W,{className:r,style:x,children:n})})})]})});U.displayName=`Tooltip`;var W=(0,u.forwardRef)(({className:e,custom:t,...n},r)=>{let i=(0,u.useMemo)(()=>h(m(`relative w-auto h-auto outline-none transition-transform ease-in-out whitespace-pre`,t?null:`border border-accent rounded shadow-md px-3 py-1 bg-background`),e),[e,t]);return(0,d.jsx)(`div`,{ref:r,className:i,...n})});W.displayName=`TooltipContent`;var G={open:150,close:75};function K({open:e,children:t,timeout:n=G,padding:r=`0.85rem`,verticalAlign:i=`center`,closeOnOverlay:a,closeOnEsc:o,onExited:s,className:c,onOpenChange:l,size:p,...h}){let g=(0,u.useRef)(s),_=(0,u.useRef)(!1),v=(0,f.useId)(),{refs:y,context:b}=(0,f.useFloating)({open:e,onOpenChange:l,nodeId:v}),{getFloatingProps:x}=(0,f.useInteractions)([(0,f.useDismiss)(b,{enabled:o,escapeKey:o,outsidePress:!1})]),{isMounted:S,styles:C}=(0,f.useTransitionStyles)(b,{duration:n,initial:{opacity:0,transform:`scale(0.8)`}});(0,u.useEffect)(()=>{_.current!==S&&(_.current=S,!S&&g.current?.())},[S]);let w=(0,u.useCallback)(()=>{a&&l?.(!1)},[l,a]);g.current=s;let T=(0,u.useMemo)(()=>m(`grid bg-backdrop z-40 justify-items-center transition ease-in-out`,{"place-items-start items-start":i===`start`,"place-items-end":i===`end`,"place-items-center":i===`center`||!i}),[i]);return(0,d.jsx)(E,{disabled:!S,children:(0,d.jsx)(f.FloatingOverlay,{className:T,"data-testid":`vs-dialog-overlay`,onClick:w,style:{padding:r,opacity:C.opacity},lockScroll:!0,children:(0,d.jsx)(q,{ref:y.setFloating,className:c,role:`dialog`,size:p,...x({...h,style:C,onClick:e=>e?.stopPropagation()}),children:t})})})}function q({size:e,...t}){return(0,d.jsx)(g,{classList:[e?`flex flex-col bg-background shadow-lg p-5 rounded`:null,{"w-full max-w-dialog-sm":e===`small`,"w-full max-w-dialog-md":e===`medium`,"w-full max-w-dialog-lg":e===`large`}],...t})}var J={open:250,close:150};function Y({open:e,timeout:t=J,onOpenChange:n,position:r=`right`,overlay:i,onExited:a,onOpen:o,containerStyle:s,...c}){let l=(0,f.useId)(),p=(0,u.useRef)(!1),m=(0,u.useRef)(o),h=(0,u.useRef)(a),{refs:_,context:v}=(0,f.useFloating)({open:e,onOpenChange:n,nodeId:l}),{isMounted:y,styles:b}=(0,f.useTransitionStyles)(v,{duration:t,initial(){let e=`translateX(75%)`;return r===`left`?e=`translateX(-75%)`:r===`top`?e=`translateY(-75%)`:r===`bottom`&&(e=`translateY(75%)`),{opacity:0,transform:e}}});return(0,u.useEffect)(()=>{if(p.current!==y){if(p.current=y,y){m.current?.();return}h.current?.()}},[y]),h.current=a,m.current=o,(0,d.jsxs)(E,{disabled:!y,children:[i?(0,d.jsx)(f.FloatingOverlay,{className:i===`transparent`?``:`bg-backdrop`,style:{opacity:b.opacity},onClick:()=>n?.(!1)}):null,(0,d.jsx)(g,{ref:_.setFloating,role:`complementary`,classList:[`fixed transition-transform z-1`,{"top-0 right-0 h-full max-h-screen":r===`right`,"top-0 left-0 h-full max-h-screen":r===`left`,"top-0 left-0 right-0 w-full max-w-screen":r===`top`,"bottom-0 left-0 right-0 w-full max-w-screen":r===`bottom`}],className:s,style:b,children:(0,d.jsx)(ee,{...c})})]})}function ee(e){return(0,d.jsx)(g,{classList:`relative bg-background min-w-full min-h-full border border-input shadow-lg`,...e})}function X({type:e,label:t,message:n}){let{icons:r}=ne();return(0,d.jsxs)(`div`,{className:`flex items-center px-4 py-3 w-80 text-sm bg-background border border-input rounded-lg shadow-md m-2`,children:[e?(0,d.jsxs)(`figure`,{className:`mr-2`,children:[e===`success`&&r?.success?r.success:null,e===`info`&&r?.info?r.info:null,e===`error`&&r?.error?r.error:null,e===`warn`&&r?.warn?r.warn:null,e===`loading`?r?.loading:null]}):null,(0,d.jsxs)(`div`,{className:`space-y-2`,children:[(0,d.jsx)(`p`,{className:`font-medium leading-none`,children:t}),n?(0,d.jsx)(`p`,{children:n}):null]})]})}function Z(){}var Q=new class{notify=Z;lastId=0;subscribe=e=>(this.notify=e,()=>{this.notify=Z});add=(e,t={})=>{this.lastId+=1;let n=`${this.lastId}`;return this.notify({id:n,type:`add`,config:{id:n,label:e,...t}}),n};update=(e,t)=>{this.notify({id:e,type:`update`,config:t})};remove=e=>{this.notify({id:e,type:`remove`})};clear=()=>{this.lastId=0}};function te({id:e,type:t,index:n,duration:r=5e3,className:i,children:a,inverted:o,timeout:s=250,max:l=3}){let p=(0,u.useRef)(!1),[m,h]=(0,u.useState)(!1),{context:g,refs:_}=(0,f.useFloating)({open:m,onOpenChange:h,nodeId:e}),{isMounted:v,styles:y}=(0,f.useTransitionStyles)(g,{duration:s,initial:{opacity:0,transform:`translateY(${o?``:`-`}50%)`}});(0,u.useLayoutEffect)(()=>{h(n<=l)},[n,l]),(0,u.useEffect)(()=>{p.current!==v&&(v||Q.remove(e),p.current=v)},[v,e]),(0,u.useEffect)(()=>{if(!r)return;let e=window.setTimeout(()=>h(!1),r);return()=>window.clearTimeout(e)},[r,e]);let b=(0,u.useCallback)(()=>{t!==`loading`&&h(!1)},[t]),x=(0,u.useMemo)(()=>(0,c.default)(`relative flex w-fit transition-transform ease-in-out cursor-pointer`,i),[i]);return v?(0,d.jsx)(`li`,{role:`log`,tabIndex:-1,ref:_.setFloating,className:x,style:y,onClick:b,children:a}):null}var $=(0,u.createContext)({});function ne(){return(0,u.useContext)($)}function re({className:e,offset:t={},position:n=`top-left`,max:r,ListItem:i=X,icons:a,timeout:o}){let s=(0,u.useMemo)(()=>{let e={position:`fixed`,...t};return Object.keys(t).length||(n.indexOf(`top`)>-1?e.top=`16px`:n.indexOf(`bottom`)>-1&&(e.bottom=`16px`),n.indexOf(`left`)>-1?e.left=`16px`:n.indexOf(`right`)>-1&&(e.right=`16px`)),n.indexOf(`left`)>-1?e.alignItems=`flex-start`:n.indexOf(`right`)>-1?e.alignItems=`flex-end`:(e.left=`50%`,e.alignItems=`center`,e.transform=`translateX(-50%)`),e},[t,n]),l=(0,u.useMemo)(()=>(0,c.default)(`flex flex-col z-40 overflow-hidden`,e),[e]),f=(0,u.useMemo)(()=>n?.startsWith(`bottom`)||!1,[n]),p=(0,u.useRef)(new Map),[m,h]=(0,u.useState)([]),g=(0,u.useState)(0)[1];T(()=>Q.subscribe(e=>{(0,u.startTransition)(()=>{if(e.type===`add`)p.current.set(e.id,e.config),h(t=>[...t,e.id]);else if(e.type===`remove`){if(!p.current.delete(e.id))return;h(t=>{let n=new Set(t);return n.has(e.id)?(n.delete(e.id),Array.from(n)):t})}else if(e.type===`update`){let t=p.current.get(e.id);if(!t)return;p.current.set(e.id,{...t,...e.config}),g(e=>e+1)}})}),[]);let _=(0,u.useMemo)(()=>({icons:a}),[a]),v=m.length;return(0,d.jsx)(E,{children:(0,d.jsx)(`ol`,{className:l,style:s,"aria-live":`polite`,children:(0,d.jsx)($.Provider,{value:_,children:m.map((e,t)=>{let n=p.current.get(e);if(!n)return null;let{className:a,duration:s,...c}=n;return(0,d.jsx)(te,{id:e,index:v-t,className:a,duration:s,inverted:f,timeout:o,max:r,children:(0,u.createElement)(i,c)},e)})})})})}exports.Accordion=H,exports.Base=g,exports.Button=L,exports.ButtonGroup=R,exports.Checkbox=w,exports.Dialog=K,exports.Divider=V,exports.FormField=y,exports.FormLabel=v,exports.Input=x,exports.InputField=b,exports.Popover=k,exports.Portal=E,exports.Progress=B,exports.Radio=N,exports.Select=j,exports.Sheet=Y,exports.Skeleton=F,exports.Spinner=z,exports.Switch=P,exports.Textarea=S,exports.Toast=re,exports.ToastItem=X,exports.Tooltip=U,exports.cn=m,exports.element=_,exports.merge=h,exports.toast=Q,exports.varientButton=I;
|
package/dist/index.es.js
CHANGED
|
@@ -296,79 +296,79 @@ function te({ override: e, styles: t, style: n = {}, ...r }) {
|
|
|
296
296
|
}
|
|
297
297
|
//#endregion
|
|
298
298
|
//#region src/forms/Select/index.tsx
|
|
299
|
-
function K({ ref: e, className: t, placeholder: n = "", options: r = [], error: i, disabled: a, value: s, maxHeight: c = 408, arrowIcon: u, closeIcon: m, checkIcon: _, onChange: v, onClear: y, renderItem: b,
|
|
300
|
-
let
|
|
301
|
-
v?.(e, t),
|
|
302
|
-
}, [v,
|
|
299
|
+
function K({ ref: e, className: t, placeholder: n = "", options: r = [], error: i, disabled: a, value: s, maxHeight: c = 408, arrowIcon: u, closeIcon: m, checkIcon: _, onChange: v, onClear: y, renderItem: b, renderLabel: x, sectionLabelStyle: S, buttonAreaStyle: C, clearLabelText: w, listHeader: T, listFooter: E, optionStyle: D, popover: O = {}, buttonRef: k, labelStyle: A, ...P }) {
|
|
300
|
+
let F = f(null), [I, L] = p(0), R = d(() => Array.isArray(s), []), z = o((e, t) => {
|
|
301
|
+
v?.(e, t), R || F.current?.close();
|
|
302
|
+
}, [v, R]), B = o((e) => Array.isArray(s) ? s.indexOf(e) > -1 : s === e, [s]), V = d(() => {
|
|
303
303
|
let e = {}, t = r.filter((e) => typeof e != "string");
|
|
304
304
|
for (let n = 0, r = t.length; n < r; n += 1) {
|
|
305
305
|
let r = t[n];
|
|
306
306
|
e[`${r.value}`] = r.label;
|
|
307
307
|
}
|
|
308
308
|
return e;
|
|
309
|
-
}, [r]),
|
|
309
|
+
}, [r]), H = d(() => {
|
|
310
310
|
if (s == null || s === "") return n;
|
|
311
311
|
if (Array.isArray(s)) {
|
|
312
312
|
if (!s.length) return n;
|
|
313
313
|
let e = [...s].sort(), t = [];
|
|
314
|
-
for (let n = 0, r = e.length; n < r; n += 1) t[n] =
|
|
314
|
+
for (let n = 0, r = e.length; n < r; n += 1) t[n] = V[`${e[n]}`] || "";
|
|
315
315
|
return t.filter(Boolean).join(",") || n;
|
|
316
316
|
}
|
|
317
|
-
return
|
|
317
|
+
return V[`${s}`] || n;
|
|
318
318
|
}, [
|
|
319
319
|
n,
|
|
320
320
|
s,
|
|
321
|
-
|
|
322
|
-
]),
|
|
321
|
+
V
|
|
322
|
+
]), U = d(() => s == null ? !0 : Array.isArray(s) ? !s.length : !1, [s]), W = o((e, t) => b ? typeof e == "string" ? b(e, {
|
|
323
323
|
index: t,
|
|
324
324
|
selected: !1,
|
|
325
325
|
onChange: () => {}
|
|
326
326
|
}) : b(e, {
|
|
327
327
|
index: t,
|
|
328
|
-
selected:
|
|
329
|
-
onChange: () =>
|
|
328
|
+
selected: B(e.value),
|
|
329
|
+
onChange: () => z(e.value, e)
|
|
330
330
|
}) : typeof e == "string" ? /* @__PURE__ */ h(N, {
|
|
331
331
|
as: "h5",
|
|
332
332
|
classList: ["font-normal py-1 px-2 text-muted"],
|
|
333
|
-
className:
|
|
333
|
+
className: S,
|
|
334
334
|
children: e
|
|
335
335
|
}, `optionheader-${t}`) : /* @__PURE__ */ h(q, {
|
|
336
|
-
selected:
|
|
337
|
-
onChange:
|
|
336
|
+
selected: B(e.value),
|
|
337
|
+
onChange: z,
|
|
338
338
|
checkIcon: _,
|
|
339
|
-
className:
|
|
339
|
+
className: D,
|
|
340
340
|
data: e
|
|
341
341
|
}, e.label), [
|
|
342
342
|
b,
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
343
|
+
z,
|
|
344
|
+
B,
|
|
345
|
+
S,
|
|
346
|
+
D,
|
|
347
347
|
_
|
|
348
348
|
]);
|
|
349
|
-
return l(e, () =>
|
|
349
|
+
return l(e, () => F.current, []), /* @__PURE__ */ h(G, {
|
|
350
350
|
render: (e) => /* @__PURE__ */ g("button", {
|
|
351
351
|
type: "button",
|
|
352
352
|
className: M(j("flex items-center justify-between rounded-md border bg-background px-3 py-2 w-full overflow-hidden cursor-pointer", "disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-ring", i ? "border-danger hover:border-danger-fore" : "border-input not-disabled:hover:border-input-fore"), t),
|
|
353
353
|
disabled: a,
|
|
354
354
|
...e,
|
|
355
355
|
ref: (t) => {
|
|
356
|
-
e.ref?.(t), typeof
|
|
356
|
+
e.ref?.(t), typeof k == "function" && k?.(t);
|
|
357
357
|
},
|
|
358
|
-
...
|
|
359
|
-
children: [/* @__PURE__ */ h(N, {
|
|
358
|
+
...P,
|
|
359
|
+
children: [x ? x(H, U) : /* @__PURE__ */ h(N, {
|
|
360
360
|
as: "span",
|
|
361
|
-
classList: ["overflow-hidden text-ellipsis whitespace-nowrap",
|
|
362
|
-
className:
|
|
363
|
-
children:
|
|
361
|
+
classList: ["overflow-hidden text-ellipsis whitespace-nowrap", U ? "text-muted" : "text-text"],
|
|
362
|
+
className: A,
|
|
363
|
+
children: H
|
|
364
364
|
}), /* @__PURE__ */ g(N, {
|
|
365
365
|
classList: "relative flex items-center space-x-2",
|
|
366
|
-
className:
|
|
367
|
-
children: [y && !
|
|
366
|
+
className: C,
|
|
367
|
+
children: [y && !U ? /* @__PURE__ */ h("div", {
|
|
368
368
|
tabIndex: -1,
|
|
369
369
|
role: "button",
|
|
370
370
|
className: "size-6 p-1.5 rounded hover:bg-accent cursor-pointer",
|
|
371
|
-
"aria-label":
|
|
371
|
+
"aria-label": w,
|
|
372
372
|
onKeyDown: (e) => {
|
|
373
373
|
(e.key === "Enter" || e.key === "Space") && y();
|
|
374
374
|
},
|
|
@@ -379,19 +379,23 @@ function K({ ref: e, className: t, placeholder: n = "", options: r = [], error:
|
|
|
379
379
|
}) : null, u]
|
|
380
380
|
})]
|
|
381
381
|
}),
|
|
382
|
-
ref:
|
|
383
|
-
onOpen: (e) =>
|
|
382
|
+
ref: F,
|
|
383
|
+
onOpen: (e) => L(e?.getBoundingClientRect().width || 0),
|
|
384
384
|
disabled: a,
|
|
385
|
-
...
|
|
386
|
-
children: /* @__PURE__ */
|
|
385
|
+
...O,
|
|
386
|
+
children: /* @__PURE__ */ g("div", {
|
|
387
387
|
className: "overflow-y-auto flex flex-col",
|
|
388
388
|
role: "listbox",
|
|
389
389
|
style: {
|
|
390
|
-
minWidth:
|
|
390
|
+
minWidth: I,
|
|
391
391
|
maxWidth: "calc(100vw - 3rem)",
|
|
392
392
|
maxHeight: c
|
|
393
393
|
},
|
|
394
|
-
children:
|
|
394
|
+
children: [
|
|
395
|
+
T,
|
|
396
|
+
r.map(W),
|
|
397
|
+
E
|
|
398
|
+
]
|
|
395
399
|
})
|
|
396
400
|
});
|
|
397
401
|
}
|
package/package.json
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
"url": "git+https://github.com/visits-works/visits-style.git"
|
|
6
6
|
},
|
|
7
7
|
"homepage": "https://github.com/visits-works/visits-style",
|
|
8
|
-
"version": "2.3.
|
|
8
|
+
"version": "2.3.9",
|
|
9
9
|
"description": "VISITS Technologiesのreactデザインコンポーネント",
|
|
10
10
|
"type": "module",
|
|
11
11
|
"main": "./dist/index.cjs.js",
|