visits-style 2.3.0 → 2.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/forms/Select/index.d.ts +4 -6
- package/dist/index.cjs.js +1 -1
- package/dist/index.es.js +26 -30
- package/package.json +1 -1
|
@@ -9,7 +9,7 @@ interface OptionRenderConfig {
|
|
|
9
9
|
selected: boolean;
|
|
10
10
|
onChange: () => void;
|
|
11
11
|
}
|
|
12
|
-
export interface Props<T> extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'onChange' | 'onClick' | 'type' | 'value' | 'children'> {
|
|
12
|
+
export interface Props<T> extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'onChange' | 'onClick' | 'type' | 'value' | 'children' | 'popover'> {
|
|
13
13
|
ref?: Ref<PopoverRef>;
|
|
14
14
|
/** 配列の値の入力の場合、複数選択モードに切り替えます */
|
|
15
15
|
value: T | T[] | null;
|
|
@@ -37,14 +37,12 @@ export interface Props<T> extends Omit<ButtonHTMLAttributes<HTMLButtonElement>,
|
|
|
37
37
|
sectionLabelStyle?: string;
|
|
38
38
|
/** 各選択肢のスタイルのカスタム指定 */
|
|
39
39
|
optionStyle?: string;
|
|
40
|
-
/** Popoverのスタイルのカスタム指定 */
|
|
41
|
-
popoverStyle?: string;
|
|
42
40
|
/** 選択を取り消すボタンのaria-label */
|
|
43
41
|
clearLabelText?: string;
|
|
44
|
-
|
|
45
|
-
|
|
42
|
+
buttonRef?: Ref<HTMLButtonElement>;
|
|
43
|
+
popover?: Omit<PopoverProps, 'render' | 'onOpen' | 'ref'>;
|
|
46
44
|
}
|
|
47
|
-
export default function Select<T = unknown>({ ref, className, placeholder, options, error, disabled, value, maxHeight, arrowIcon, closeIcon, checkIcon, onChange, onClear, renderItem, sectionLabelStyle, buttonAreaStyle, clearLabelText, optionStyle,
|
|
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;
|
|
48
46
|
interface SelectItemProps<T> {
|
|
49
47
|
className?: string;
|
|
50
48
|
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})]);return b.current=o,x.current=s,(0,d.jsxs)(d.Fragment,{children:[n(N({ref:S.setReference,tabIndex:0,"aria-expanded":_,"aria-disabled":i,onClick:D})),(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`,{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:m,renderItem:h,sectionLabelStyle:_,buttonAreaStyle:v,clearLabelText:y,optionStyle:b,popoverStyle:x,popoverPosition:S,labelStyle:C,...w}){let T=(0,u.useRef)(null),[E,D]=(0,u.useState)(0),O=(0,u.useMemo)(()=>Array.isArray(o),[]),A=(0,u.useCallback)((e,t)=>{p?.(e,t),O||T.current?.close()},[p,O]),j=(0,u.useCallback)(e=>Array.isArray(o)?o.indexOf(e)>-1:o===e,[o]),N=(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]),P=(0,u.useMemo)(()=>{if(!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]=N[`${e[n]}`]||``;return t.filter(Boolean).join(`,`)||n}return N[`${o}`]||n},[n,o,N]),F=(0,u.useMemo)(()=>o==null?!0:Array.isArray(o)?!o.length:!1,[o]),I=(0,u.useCallback)((e,t)=>h?typeof e==`string`?h(e,{index:t,selected:!1,onChange:()=>{}}):h(e,{index:t,selected:j(e.value),onChange:()=>A(e.value,e)}):typeof e==`string`?(0,d.jsx)(g,{as:`h5`,classList:[`font-normal py-1 px-2 text-muted`],className:_,children:e},`optionheader-${t}`):(0,d.jsx)(M,{selected:j(e.value),onChange:A,checkIcon:f,className:b,data:e},e.label),[h,A,j,_,b,f]);return(0,u.useImperativeHandle)(e,()=>T.current,[]),(0,d.jsx)(k,{render:e=>(0,d.jsxs)(g,{as:`button`,type:`button`,classList:[`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`],className:t,disabled:a,...e,...w,children:[(0,d.jsx)(g,{as:`span`,classList:[`overflow-hidden text-ellipsis whitespace-nowrap`,F?`text-muted`:`text-text`],className:C,children:P}),(0,d.jsxs)(g,{classList:`relative flex items-center space-x-2`,className:v,children:[m&&!F?(0,d.jsx)(`div`,{tabIndex:-1,role:`button`,className:`size-6 p-1.5 rounded hover:bg-accent cursor-pointer`,"aria-label":y,onKeyDown:e=>{(e.key===`Enter`||e.key===`Space`)&&m()},onClick:e=>{e.stopPropagation(),m()},children:l}):null,c]})]}),ref:T,onOpen:e=>D(e?.getBoundingClientRect().width||0),className:x,position:S,disabled:a,children:(0,d.jsx)(`div`,{className:`overflow-y-auto flex flex-col`,role:`listbox`,style:{minWidth:E,maxWidth:`calc(100vw - 3rem)`,maxHeight:s},children:r.map(I)})})}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({header:e,show:t,children:n,timeout:r=300,...i}){let a=(0,u.useRef)(null),o=(0,u.useRef)(0),s=(0,u.useRef)(0),c=(0,u.useRef)(!0);return(0,u.useEffect)(()=>{s.current=r},[r]),T(()=>{if(!a.current)return;if(a.current.style.overflow=`hidden`,a.current.style.opacity=`1`,c.current){c.current=!1,a.current.style.height=t?`auto`:`0px`,t?window.requestAnimationFrame(()=>{a.current&&(o.current=a.current.offsetHeight)}):(window.requestAnimationFrame(()=>{a.current&&(a.current.style.height=`auto`,o.current=a.current.offsetHeight,a.current.style.height=`0px`)}),a.current.style.opacity=`0`);return}t||(a.current.style.height=`${o.current}px`);let e=[];e[0]=window.requestAnimationFrame(()=>{e[1]=window.requestAnimationFrame(()=>{a.current&&(a.current.style.height=`${t?o.current:0}px`,a.current.style.opacity=t?`1`:`0`)})});let n,r=()=>{a.current&&(t?(a.current.style.height=`auto`,a.current.style.overflow=``,a.current.style.opacity=``,window.requestAnimationFrame(()=>{a.current&&(o.current=a.current.offsetHeight)})):a.current.style.height=`0px`)};return s.current===0?r():n=window.setTimeout(r,s.current),()=>{e.forEach(window.cancelAnimationFrame),n&&window.clearTimeout(n)}},[t]),(0,d.jsxs)(`div`,{...i,children:[e,(0,d.jsx)(`div`,{className:`transition-all ease-in-out overflow-hidden`,role:`region`,"aria-hidden":!t,ref:a,style:{transitionDuration:`${r}ms`},children:n})]})}var I=(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)(L,{className:r,style:x,children:n})})})]})});I.displayName=`Tooltip`;var L=(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})});L.displayName=`TooltipContent`;function R({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 z({size:e,variant:t,className:n,...r}){let i=(0,u.useMemo)(()=>h(R({size:e,variant:t}),n),[e,t,n]);return(0,d.jsx)(`button`,{className:i,type:`button`,...r})}var B={open:150,close:75};function V({open:e,children:t,timeout:n=B,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)(H,{ref:y.setFloating,className:c,role:`dialog`,size:p,...x({...h,style:C,onClick:e=>e?.stopPropagation()}),children:t})})})}function H({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})}function U(e){return(0,d.jsx)(g,{classList:`inline-block animate-pulse rounded-md bg-accent`,...e})}function W(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 G({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 K({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 q({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})}var J={open:250,close:150};function Y({open:e,timeout:t=J,onOpenChange:n,position:r=`right`,overlay:i,onExited:a,onOpen:o,...s}){let c=(0,f.useId)(),l=(0,u.useRef)(!1),p=(0,u.useRef)(o),m=(0,u.useRef)(a),{refs:h,context:_}=(0,f.useFloating)({open:e,onOpenChange:n,nodeId:c}),{isMounted:v,styles:y}=(0,f.useTransitionStyles)(_,{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(l.current!==v){if(l.current=v,v){p.current?.();return}m.current?.()}},[v]),m.current=a,p.current=o,(0,d.jsxs)(E,{disabled:!v,children:[i?(0,d.jsx)(f.FloatingOverlay,{className:i===`transparent`?``:`bg-backdrop`,style:{opacity:y.opacity},onClick:()=>n?.(!1)}):null,(0,d.jsx)(g,{ref:h.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`}],style:y,children:(0,d.jsx)(ee,{...s})})]})}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}){let o=(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]),s=(0,u.useMemo)(()=>(0,c.default)(`flex flex-col z-40 overflow-hidden`,e),[e]),l=(0,u.useMemo)(()=>n?.startsWith(`bottom`)||!1,[n]),f=(0,u.useRef)(new Map),[p,m]=(0,u.useState)([]),h=(0,u.useState)(0)[1];T(()=>Q.subscribe(e=>{(0,u.startTransition)(()=>{if(e.type===`add`)f.current.set(e.id,e.config),m(t=>[...t,e.id]);else if(e.type===`remove`){if(!f.current.delete(e.id))return;m(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=f.current.get(e.id);if(!t)return;f.current.set(e.id,{...t,...e.config}),h(e=>e+1)}})}),[]);let g=(0,u.useMemo)(()=>({icons:a}),[a]),_=p.length;return(0,d.jsx)(E,{children:(0,d.jsx)(`ol`,{className:s,style:o,"aria-live":`polite`,children:(0,d.jsx)($.Provider,{value:g,children:p.map((e,t)=>{let n=f.current.get(e);if(!n)return null;let{className:a,duration:o,...s}=n;return(0,d.jsx)(te,{id:e,index:_-t,className:a,duration:o,inverted:l,max:r,children:(0,u.createElement)(i,s)},e)})})})})}exports.Accordion=F,exports.Base=g,exports.Button=z,exports.ButtonGroup=W,exports.Checkbox=w,exports.Dialog=V,exports.Divider=q,exports.FormField=y,exports.FormLabel=v,exports.Input=x,exports.InputField=b,exports.Popover=k,exports.Portal=E,exports.Progress=K,exports.Radio=N,exports.Select=j,exports.Sheet=Y,exports.Skeleton=U,exports.Spinner=G,exports.Switch=P,exports.Textarea=S,exports.Toast=re,exports.ToastItem=X,exports.Tooltip=I,exports.cn=m,exports.element=_,exports.merge=h,exports.toast=Q,exports.varientButton=R;
|
|
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})]);return b.current=o,x.current=s,(0,d.jsxs)(d.Fragment,{children:[n(N({ref:S.setReference,tabIndex:0,"aria-expanded":_,"aria-disabled":i,onClick:D})),(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`,{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)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({header:e,show:t,children:n,timeout:r=300,...i}){let a=(0,u.useRef)(null),o=(0,u.useRef)(0),s=(0,u.useRef)(0),c=(0,u.useRef)(!0);return(0,u.useEffect)(()=>{s.current=r},[r]),T(()=>{if(!a.current)return;if(a.current.style.overflow=`hidden`,a.current.style.opacity=`1`,c.current){c.current=!1,a.current.style.height=t?`auto`:`0px`,t?window.requestAnimationFrame(()=>{a.current&&(o.current=a.current.offsetHeight)}):(window.requestAnimationFrame(()=>{a.current&&(a.current.style.height=`auto`,o.current=a.current.offsetHeight,a.current.style.height=`0px`)}),a.current.style.opacity=`0`);return}t||(a.current.style.height=`${o.current}px`);let e=[];e[0]=window.requestAnimationFrame(()=>{e[1]=window.requestAnimationFrame(()=>{a.current&&(a.current.style.height=`${t?o.current:0}px`,a.current.style.opacity=t?`1`:`0`)})});let n,r=()=>{a.current&&(t?(a.current.style.height=`auto`,a.current.style.overflow=``,a.current.style.opacity=``,window.requestAnimationFrame(()=>{a.current&&(o.current=a.current.offsetHeight)})):a.current.style.height=`0px`)};return s.current===0?r():n=window.setTimeout(r,s.current),()=>{e.forEach(window.cancelAnimationFrame),n&&window.clearTimeout(n)}},[t]),(0,d.jsxs)(`div`,{...i,children:[e,(0,d.jsx)(`div`,{className:`transition-all ease-in-out overflow-hidden`,role:`region`,"aria-hidden":!t,ref:a,style:{transitionDuration:`${r}ms`},children:n})]})}var I=(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)(L,{className:r,style:x,children:n})})})]})});I.displayName=`Tooltip`;var L=(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})});L.displayName=`TooltipContent`;function R({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 z({size:e,variant:t,className:n,...r}){let i=(0,u.useMemo)(()=>h(R({size:e,variant:t}),n),[e,t,n]);return(0,d.jsx)(`button`,{className:i,type:`button`,...r})}var B={open:150,close:75};function V({open:e,children:t,timeout:n=B,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)(H,{ref:y.setFloating,className:c,role:`dialog`,size:p,...x({...h,style:C,onClick:e=>e?.stopPropagation()}),children:t})})})}function H({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})}function U(e){return(0,d.jsx)(g,{classList:`inline-block animate-pulse rounded-md bg-accent`,...e})}function W(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 G({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 K({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 q({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})}var J={open:250,close:150};function Y({open:e,timeout:t=J,onOpenChange:n,position:r=`right`,overlay:i,onExited:a,onOpen:o,...s}){let c=(0,f.useId)(),l=(0,u.useRef)(!1),p=(0,u.useRef)(o),m=(0,u.useRef)(a),{refs:h,context:_}=(0,f.useFloating)({open:e,onOpenChange:n,nodeId:c}),{isMounted:v,styles:y}=(0,f.useTransitionStyles)(_,{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(l.current!==v){if(l.current=v,v){p.current?.();return}m.current?.()}},[v]),m.current=a,p.current=o,(0,d.jsxs)(E,{disabled:!v,children:[i?(0,d.jsx)(f.FloatingOverlay,{className:i===`transparent`?``:`bg-backdrop`,style:{opacity:y.opacity},onClick:()=>n?.(!1)}):null,(0,d.jsx)(g,{ref:h.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`}],style:y,children:(0,d.jsx)(ee,{...s})})]})}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}){let o=(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]),s=(0,u.useMemo)(()=>(0,c.default)(`flex flex-col z-40 overflow-hidden`,e),[e]),l=(0,u.useMemo)(()=>n?.startsWith(`bottom`)||!1,[n]),f=(0,u.useRef)(new Map),[p,m]=(0,u.useState)([]),h=(0,u.useState)(0)[1];T(()=>Q.subscribe(e=>{(0,u.startTransition)(()=>{if(e.type===`add`)f.current.set(e.id,e.config),m(t=>[...t,e.id]);else if(e.type===`remove`){if(!f.current.delete(e.id))return;m(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=f.current.get(e.id);if(!t)return;f.current.set(e.id,{...t,...e.config}),h(e=>e+1)}})}),[]);let g=(0,u.useMemo)(()=>({icons:a}),[a]),_=p.length;return(0,d.jsx)(E,{children:(0,d.jsx)(`ol`,{className:s,style:o,"aria-live":`polite`,children:(0,d.jsx)($.Provider,{value:g,children:p.map((e,t)=>{let n=f.current.get(e);if(!n)return null;let{className:a,duration:o,...s}=n;return(0,d.jsx)(te,{id:e,index:_-t,className:a,duration:o,inverted:l,max:r,children:(0,u.createElement)(i,s)},e)})})})})}exports.Accordion=F,exports.Base=g,exports.Button=z,exports.ButtonGroup=W,exports.Checkbox=w,exports.Dialog=V,exports.Divider=q,exports.FormField=y,exports.FormLabel=v,exports.Input=x,exports.InputField=b,exports.Popover=k,exports.Portal=E,exports.Progress=K,exports.Radio=N,exports.Select=j,exports.Sheet=Y,exports.Skeleton=U,exports.Spinner=G,exports.Switch=P,exports.Textarea=S,exports.Toast=re,exports.ToastItem=X,exports.Tooltip=I,exports.cn=m,exports.element=_,exports.merge=h,exports.toast=Q,exports.varientButton=R;
|
package/dist/index.es.js
CHANGED
|
@@ -291,78 +291,75 @@ function te({ override: e, styles: t, style: n = {}, ...r }) {
|
|
|
291
291
|
}
|
|
292
292
|
//#endregion
|
|
293
293
|
//#region src/forms/Select/index.tsx
|
|
294
|
-
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, sectionLabelStyle: x, buttonAreaStyle: S, clearLabelText: C, optionStyle: w,
|
|
295
|
-
let k = f(null), [A,
|
|
296
|
-
v?.(e, t),
|
|
297
|
-
}, [v,
|
|
294
|
+
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, sectionLabelStyle: x, buttonAreaStyle: S, clearLabelText: C, optionStyle: w, popover: T = {}, buttonRef: E, labelStyle: D, ...O }) {
|
|
295
|
+
let k = f(null), [A, P] = p(0), F = d(() => Array.isArray(s), []), I = o((e, t) => {
|
|
296
|
+
v?.(e, t), F || k.current?.close();
|
|
297
|
+
}, [v, F]), L = o((e) => Array.isArray(s) ? s.indexOf(e) > -1 : s === e, [s]), R = d(() => {
|
|
298
298
|
let e = {}, t = r.filter((e) => typeof e != "string");
|
|
299
299
|
for (let n = 0, r = t.length; n < r; n += 1) {
|
|
300
300
|
let r = t[n];
|
|
301
301
|
e[`${r.value}`] = r.label;
|
|
302
302
|
}
|
|
303
303
|
return e;
|
|
304
|
-
}, [r]),
|
|
304
|
+
}, [r]), z = d(() => {
|
|
305
305
|
if (!s) return n;
|
|
306
306
|
if (Array.isArray(s)) {
|
|
307
307
|
if (!s.length) return n;
|
|
308
308
|
let e = [...s].sort(), t = [];
|
|
309
|
-
for (let n = 0, r = e.length; n < r; n += 1) t[n] =
|
|
309
|
+
for (let n = 0, r = e.length; n < r; n += 1) t[n] = R[`${e[n]}`] || "";
|
|
310
310
|
return t.filter(Boolean).join(",") || n;
|
|
311
311
|
}
|
|
312
|
-
return
|
|
312
|
+
return R[`${s}`] || n;
|
|
313
313
|
}, [
|
|
314
314
|
n,
|
|
315
315
|
s,
|
|
316
|
-
|
|
317
|
-
]),
|
|
316
|
+
R
|
|
317
|
+
]), B = d(() => s == null ? !0 : Array.isArray(s) ? !s.length : !1, [s]), V = o((e, t) => b ? typeof e == "string" ? b(e, {
|
|
318
318
|
index: t,
|
|
319
319
|
selected: !1,
|
|
320
320
|
onChange: () => {}
|
|
321
321
|
}) : b(e, {
|
|
322
322
|
index: t,
|
|
323
|
-
selected:
|
|
324
|
-
onChange: () =>
|
|
323
|
+
selected: L(e.value),
|
|
324
|
+
onChange: () => I(e.value, e)
|
|
325
325
|
}) : typeof e == "string" ? /* @__PURE__ */ h(N, {
|
|
326
326
|
as: "h5",
|
|
327
327
|
classList: ["font-normal py-1 px-2 text-muted"],
|
|
328
328
|
className: x,
|
|
329
329
|
children: e
|
|
330
330
|
}, `optionheader-${t}`) : /* @__PURE__ */ h(ne, {
|
|
331
|
-
selected:
|
|
332
|
-
onChange:
|
|
331
|
+
selected: L(e.value),
|
|
332
|
+
onChange: I,
|
|
333
333
|
checkIcon: _,
|
|
334
334
|
className: w,
|
|
335
335
|
data: e
|
|
336
336
|
}, e.label), [
|
|
337
337
|
b,
|
|
338
|
-
|
|
339
|
-
|
|
338
|
+
I,
|
|
339
|
+
L,
|
|
340
340
|
x,
|
|
341
341
|
w,
|
|
342
342
|
_
|
|
343
343
|
]);
|
|
344
344
|
return l(e, () => k.current, []), /* @__PURE__ */ h(G, {
|
|
345
|
-
render: (e) => /* @__PURE__ */ g(
|
|
346
|
-
as: "button",
|
|
345
|
+
render: (e) => /* @__PURE__ */ g("button", {
|
|
347
346
|
type: "button",
|
|
348
|
-
|
|
349
|
-
"flex items-center justify-between rounded-md border bg-background px-3 py-2 w-full overflow-hidden cursor-pointer",
|
|
350
|
-
"disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-ring",
|
|
351
|
-
i ? "border-danger hover:border-danger-fore" : "border-input not-disabled:hover:border-input-fore"
|
|
352
|
-
],
|
|
353
|
-
className: t,
|
|
347
|
+
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),
|
|
354
348
|
disabled: a,
|
|
355
349
|
...e,
|
|
350
|
+
ref: (t) => {
|
|
351
|
+
e.ref?.(t), typeof E == "function" && E?.(t);
|
|
352
|
+
},
|
|
356
353
|
...O,
|
|
357
354
|
children: [/* @__PURE__ */ h(N, {
|
|
358
355
|
as: "span",
|
|
359
|
-
classList: ["overflow-hidden text-ellipsis whitespace-nowrap",
|
|
356
|
+
classList: ["overflow-hidden text-ellipsis whitespace-nowrap", B ? "text-muted" : "text-text"],
|
|
360
357
|
className: D,
|
|
361
|
-
children:
|
|
358
|
+
children: z
|
|
362
359
|
}), /* @__PURE__ */ g(N, {
|
|
363
360
|
classList: "relative flex items-center space-x-2",
|
|
364
361
|
className: S,
|
|
365
|
-
children: [y && !
|
|
362
|
+
children: [y && !B ? /* @__PURE__ */ h("div", {
|
|
366
363
|
tabIndex: -1,
|
|
367
364
|
role: "button",
|
|
368
365
|
className: "size-6 p-1.5 rounded hover:bg-accent cursor-pointer",
|
|
@@ -378,10 +375,9 @@ function K({ ref: e, className: t, placeholder: n = "", options: r = [], error:
|
|
|
378
375
|
})]
|
|
379
376
|
}),
|
|
380
377
|
ref: k,
|
|
381
|
-
onOpen: (e) =>
|
|
382
|
-
className: T,
|
|
383
|
-
position: E,
|
|
378
|
+
onOpen: (e) => P(e?.getBoundingClientRect().width || 0),
|
|
384
379
|
disabled: a,
|
|
380
|
+
...T,
|
|
385
381
|
children: /* @__PURE__ */ h("div", {
|
|
386
382
|
className: "overflow-y-auto flex flex-col",
|
|
387
383
|
role: "listbox",
|
|
@@ -390,7 +386,7 @@ function K({ ref: e, className: t, placeholder: n = "", options: r = [], error:
|
|
|
390
386
|
maxWidth: "calc(100vw - 3rem)",
|
|
391
387
|
maxHeight: c
|
|
392
388
|
},
|
|
393
|
-
children: r.map(
|
|
389
|
+
children: r.map(V)
|
|
394
390
|
})
|
|
395
391
|
});
|
|
396
392
|
}
|
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.1",
|
|
9
9
|
"description": "VISITS Technologiesのreactデザインコンポーネント",
|
|
10
10
|
"type": "module",
|
|
11
11
|
"main": "./dist/index.cjs.js",
|