tintora 0.22.0 → 0.23.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Alert/Alert.d.ts +20 -0
- package/dist/index.cjs +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.js +448 -379
- package/dist/tintora.css +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import type { HTMLAttributes, ReactNode } from 'react';
|
|
2
|
+
import './Alert.css';
|
|
3
|
+
type AlertStatus = 'info' | 'success' | 'warning' | 'error';
|
|
4
|
+
export interface AlertProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title' | 'role'> {
|
|
5
|
+
/** Colour and icon. Ignored by `announcement`. @default 'info' */
|
|
6
|
+
status?: AlertStatus;
|
|
7
|
+
/** @default 'alert' */
|
|
8
|
+
variant?: 'alert' | 'announcement';
|
|
9
|
+
title?: ReactNode;
|
|
10
|
+
children?: ReactNode;
|
|
11
|
+
/** One text link. Under the body in an `alert`, inline in an `announcement`. */
|
|
12
|
+
action?: {
|
|
13
|
+
label: string;
|
|
14
|
+
onClick: () => void;
|
|
15
|
+
};
|
|
16
|
+
/** Shows the dismiss button. */
|
|
17
|
+
onDismiss?: () => void;
|
|
18
|
+
}
|
|
19
|
+
export declare function Alert({ status, variant, title, children, action, onDismiss, className, ...props }: AlertProps): import("react").JSX.Element;
|
|
20
|
+
export {};
|
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("react"),t=require("react/jsx-runtime");function n(e){var t,r,i=``;if(typeof e==`string`||typeof e==`number`)i+=e;else if(typeof e==`object`){if(Array.isArray(e)){var a=e.length;for(t=0;t<a;t++)e[t]&&(r=n(e[t]))&&(i&&(i+=` `),i+=r)}else for(r in e)e[r]&&(i&&(i+=` `),i+=r)}return i}function r(){for(var e,t,r=0,i=``,a=arguments.length;r<a;r++)(e=arguments[r])&&(t=n(e))&&(i&&(i+=` `),i+=t);return i}function i(e){if(!e.length)return``;let t=e.trim().split(/\s+/).map(e=>e.match(/\p{L}\p{M}*/u)?.[0]).filter(e=>!!e);return`${t[0]??``}${t.length>1?t.at(-1)??``:``}`.toLocaleUpperCase()}function a({name:n,src:a,size:o=`medium`,className:s,...c}){let[l,u]=(0,e.useState)(),d=!!a&&a!==l;return(0,t.jsx)(`span`,{role:`img`,"aria-label":n,...c,className:r(`tintora-avatar`,`tintora-avatar--${o}`,s),children:d?(0,t.jsx)(`img`,{src:a,alt:``,onError:()=>u(a)}):i(n)})}var o={small:{width:16,height:16,strokeWidth:3.5},medium:{width:24,height:24,strokeWidth:3},large:{width:40,height:40,strokeWidth:2.4}};function s({size:e=`medium`,color:n=`accent`}){let{width:r,height:i,strokeWidth:a}=o[e];return(0,t.jsxs)(`svg`,{className:`tintora-spinner`,width:r,height:i,viewBox:`0 0 24 24`,fill:`none`,role:`img`,"aria-label":`Loading`,children:[(0,t.jsx)(`circle`,{cx:`12`,cy:`12`,r:`9`,stroke:`currentColor`,strokeOpacity:n===`accent`?.25:.35,strokeWidth:a}),(0,t.jsx)(`path`,{d:`M21 12a9 9 0 0 0-9-9`,stroke:n===`accent`?`var(--tintora-control-fill)`:`currentColor`,strokeWidth:a,strokeLinecap:`round`})]})}function c({children:e,className:n,variant:i,size:a=`medium`,leadingIcon:o,trailingIcon:c,type:l=`button`,loading:u=!1,disabled:d,...f}){return(0,t.jsxs)(`button`,{type:l,className:r(`tintora-button`,`tintora-button--${i}`,`tintora-button--${a}`,{"tintora-button--leading-icon":!!o||u,"tintora-button--loading":u,"tintora-button--trailing-icon":!!c},n),disabled:d||u,"aria-busy":u||void 0,...f,children:[u&&(0,t.jsx)(`span`,{className:`tintora-button__icon`,"aria-hidden":`true`,children:(0,t.jsx)(s,{size:`small`,color:`current`})}),!u&&o&&(0,t.jsx)(`span`,{className:`tintora-button__icon`,"aria-hidden":`true`,children:o}),e,c&&(0,t.jsx)(`span`,{className:`tintora-button__icon`,"aria-hidden":`true`,children:c})]})}function l({as:e=`article`,variant:n=`surface`,className:i,...a}){return(0,t.jsx)(e,{...a,className:r(`tintora-card`,`tintora-card--${n}`,i)})}function u({selected:e=!1,className:n,...i}){return(0,t.jsx)(`button`,{...i,type:`button`,"aria-pressed":e,className:r(`tintora-card`,`tintora-card--surface`,`tintora-card--selectable`,e&&`tintora-card--selected`,n)})}function d({checked:t,defaultChecked:n=!1,onCheckedChange:r}){let[i,a]=(0,e.useState)(n),o=t!==void 0;return{checked:o?t:i,onChange:e=>{o||a(e.target.checked),r?.(e.target.checked)}}}function f({checked:n,defaultChecked:i,onCheckedChange:a,indeterminate:o=!1,className:s,...c}){let l=(0,e.useRef)(null),u=d({checked:n,defaultChecked:i,onCheckedChange:a});return(0,e.useLayoutEffect)(()=>{l.current&&(l.current.indeterminate=o)}),(0,t.jsxs)(`span`,{className:r(`tintora-checkbox`,s),children:[(0,t.jsx)(`input`,{...c,ref:l,type:`checkbox`,className:`tintora-checkbox__input`,checked:u.checked,onChange:u.onChange}),(0,t.jsxs)(`span`,{className:`tintora-checkbox__box`,"aria-hidden":`true`,children:[(0,t.jsx)(`svg`,{className:`tintora-checkbox__check`,width:`14`,height:`14`,viewBox:`0 0 24 24`,fill:`none`,strokeWidth:`3.2`,strokeLinecap:`round`,strokeLinejoin:`round`,children:(0,t.jsx)(`path`,{d:`M5 12.5l4.5 4.5L19 7.5`})}),(0,t.jsx)(`svg`,{className:`tintora-checkbox__dash`,width:`14`,height:`14`,viewBox:`0 0 24 24`,fill:`none`,strokeWidth:`3.2`,strokeLinecap:`round`,children:(0,t.jsx)(`path`,{d:`M6 12h12`})})]})]})}function p({children:e,selected:n,className:i,"aria-pressed":a,...o}){return(0,t.jsx)(`button`,{...o,type:`button`,className:r(`tintora-chip`,i),"aria-pressed":n??a,children:e})}function m({variant:e=`unread`,label:n,className:i,...a}){return(0,t.jsx)(`span`,{...a,className:r(`tintora-dot`,`tintora-dot--${e}`,i),role:n?`img`:void 0,"aria-label":n,"aria-hidden":!n||void 0})}var h={round:`secondary`,field:`secondary`,nav:`ghost`};function g({icon:e,variant:n=`round`,size:i,selected:a,className:o,...s}){let l=n===`round`?i??`large`:void 0;return(0,t.jsx)(c,{...s,variant:h[n],"aria-current":a?`page`:void 0,className:r(`tintora-icon-button`,`tintora-icon-button--${n}`,l&&`tintora-icon-button--${l}`,o),...l&&{size:l},children:(0,t.jsx)(`span`,{className:`tintora-icon-button__icon`,"aria-hidden":`true`,children:e})})}var _=()=>(0,t.jsx)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,children:(0,t.jsx)(`path`,{d:`M18 6L6 18M6 6l12 12`})});function v({open:n,onClose:i,title:a,description:o,icon:s,status:c=`info`,actions:l,size:u=`md`,align:d=`start`,role:f=`dialog`,closeButton:p=!0,className:m,children:h,...v}){let y=(0,e.useRef)(null),b=(0,e.useId)(),x=(0,e.useId)();return(0,e.useEffect)(()=>{let e=y.current;e&&(n&&!e.open?(e.showModal(),e.querySelector(`[data-autofocus]`)?.focus()):!n&&e.open&&e.close())},[n]),(0,t.jsxs)(`dialog`,{...v,ref:y,role:f,"aria-labelledby":b,"aria-describedby":o?x:void 0,className:r(`tintora-modal`,`tintora-modal--${u}`,d===`center`&&`tintora-modal--center`,m),onCancel:e=>{e.preventDefault(),i()},onClick:e=>{f===`dialog`&&e.target===e.currentTarget&&i()},children:[s&&(0,t.jsx)(`span`,{className:r(`tintora-modal__icon`,`tintora-modal__icon--${c}`),"aria-hidden":`true`,children:s}),(0,t.jsxs)(`div`,{className:`tintora-modal__text`,children:[(0,t.jsx)(`h2`,{id:b,className:`tintora-modal__title`,children:a}),o&&(0,t.jsx)(`p`,{id:x,className:`tintora-modal__description`,children:o})]}),p&&(0,t.jsx)(g,{className:`tintora-modal__close`,size:`medium`,"aria-label":`Close`,icon:(0,t.jsx)(_,{}),onClick:i}),h,l&&(0,t.jsx)(`div`,{className:`tintora-modal__actions`,children:l})]})}function y(t){let n=(0,e.useRef)(t);return(0,e.useEffect)(()=>{n.current=t},[t]),n}function b(t,n){let r=y(n);(0,e.useEffect)(()=>{if(!t)return;let e=e=>{e.key===`Escape`&&r.current()};return document.addEventListener(`keydown`,e),()=>document.removeEventListener(`keydown`,e)},[t,r])}function x(t,n,r){let i=y(r);(0,e.useEffect)(()=>{if(!t)return;let e=e=>{n.current?.contains(e.target)||i.current()};return document.addEventListener(`pointerdown`,e),()=>document.removeEventListener(`pointerdown`,e)},[t,n,i])}function S(t,n,r,i){let[a,o]=(0,e.useState)(null);return(0,e.useLayoutEffect)(()=>{let e=n.current;if(!t||!e){o(null);return}e.showPopover();let i=()=>o(r()),a=t=>{e.contains(t.target)||i()};return i(),window.addEventListener(`scroll`,a,!0),window.addEventListener(`resize`,i),()=>{window.removeEventListener(`scroll`,a,!0),window.removeEventListener(`resize`,i)}},[t,n,...i]),a}var C={gap:10,margin:8,arrowInset:12},w={top:`bottom`,bottom:`top`,left:`right`,right:`left`},T=(e,t,n)=>Math.min(Math.max(e,t),Math.max(t,n));function E(e,t,n,r,{gap:i,margin:a}){let o=t=>{switch(t){case`top`:return e.top;case`bottom`:return r.height-e.bottom;case`left`:return e.left;case`right`:return r.width-e.right}},s=(n===`top`||n===`bottom`?t.height:t.width)+i+a,c=o(n);return c>=s||o(w[n])<=c?n:w[n]}function D(e,t,n,r={width:window.innerWidth,height:window.innerHeight},i={}){let a={...C,...i},{gap:o,margin:s,arrowInset:c}=a,l=E(e,t,n,r,a),u=l===`top`||l===`bottom`,d,f;switch(l){case`top`:d=e.y-t.height-o,f=e.x+e.width/2-t.width/2;break;case`bottom`:d=e.y+e.height+o,f=e.x+e.width/2-t.width/2;break;case`left`:d=e.y+e.height/2-t.height/2,f=e.x-t.width-o;break;case`right`:d=e.y+e.height/2-t.height/2,f=e.x+e.width+o}u?f=T(f,s,r.width-t.width-s):d=T(d,s,r.height-t.height-s);let p=u?e.x+e.width/2-f:e.y+e.height/2-d,m=u?t.width:t.height;return{top:d,left:f,placement:l,arrowOffset:T(p,c,m-c)}}var O=[`button:not([disabled])`,`[href]`,`input:not([disabled])`,`select:not([disabled])`,`textarea:not([disabled])`,`[tabindex]:not([tabindex="-1"])`].join(`, `);function k({open:n,onOpenChange:i,trigger:a,title:o,children:s,role:c=`dialog`,size:l=`md`,placement:u=`bottom`,className:d}){let f=(0,e.useId)(),p=(0,e.useRef)(null),m=(0,e.useRef)(null),h=(0,e.useRef)(!1),g=()=>i(!1);b(n,g),x(n,p,g);let _=e=>{a.props.onClick?.(e),e.defaultPrevented||i(!n)},v=S(n,m,()=>{let e=m.current,t=p.current?.firstElementChild;return!e||!t?null:D(t.getBoundingClientRect(),{width:e.offsetWidth,height:e.offsetHeight},u,void 0,{gap:12})},[u,o,s]),y=v?{top:v.top,left:v.left,"--tintora-popover-arrow-offset":`${v.arrowOffset}px`}:{visibility:`hidden`},C=v!==null;return(0,e.useLayoutEffect)(()=>{let e=m.current;n&&C&&e&&(e.querySelector(`[data-autofocus]`)??e.querySelector(O)??e).focus()},[n,C]),(0,e.useEffect)(()=>{if(h.current&&!n){let e=document.activeElement;(!e||e===document.body)&&p.current?.querySelector(`*`)?.focus()}h.current=n},[n]),(0,t.jsxs)(`span`,{ref:p,className:`tintora-popover-root`,children:[(0,e.cloneElement)(a,{"aria-haspopup":`dialog`,"aria-expanded":n,"aria-controls":n?f:void 0,onClick:_}),n&&(0,t.jsx)(`div`,{id:f,ref:m,role:c,"aria-label":o,popover:`manual`,tabIndex:-1,className:r(`tintora-popover`,`tintora-popover--${l}`,`tintora-popover--${v?.placement??u}`,d),style:y,children:s})]})}function A({title:n,progress:i,indeterminate:a,valueLabel:o,className:s,"aria-label":c}){let l=(0,e.useId)(),u=a?void 0:Math.min(100,Math.max(0,Number.isFinite(i)?i:0)),d=u===100,f=o??(a?`Indeterminate`:`${u}%`);return(0,t.jsxs)(`div`,{className:r(`tintora-progress-bar`,s),children:[n&&(0,t.jsxs)(`div`,{className:`tintora-progress-bar__header`,children:[(0,t.jsx)(`span`,{id:l,children:n}),(0,t.jsx)(`span`,{className:`tintora-progress-bar__value`,children:f})]}),(0,t.jsx)(`div`,{role:`progressbar`,"aria-label":c,"aria-labelledby":n?l:void 0,"aria-valuemin":a?void 0:0,"aria-valuemax":a?void 0:100,"aria-valuenow":u,"aria-valuetext":o,className:`tintora-progress-bar__track`,children:(0,t.jsx)(`div`,{className:r(`tintora-progress-bar__fill`,{"tintora-progress-bar__fill--indeterminate":a,"tintora-progress-bar__fill--complete":d}),style:u===void 0?void 0:{width:`${u}%`}})})]})}var j=(0,e.createContext)(null);function M(){let t=(0,e.useContext)(j);if(!t)throw Error(`Radio must be rendered inside a RadioGroup`);return t}function N({value:e,className:n,disabled:i,...a}){let o=M();return(0,t.jsxs)(`span`,{className:r(`tintora-radio`,n),children:[(0,t.jsx)(`input`,{...a,type:`radio`,className:`tintora-radio__input`,name:o.name,value:e,checked:o.value===e,disabled:i||o.disabled,onChange:()=>o.select(e)}),(0,t.jsx)(`span`,{className:`tintora-radio__circle`,"aria-hidden":`true`})]})}function P({value:n,defaultValue:i,onValueChange:a,disabled:o=!1,name:s,className:c,...l}){let u=(0,e.useId)(),[d,f]=(0,e.useState)(i??null),p=n!==void 0,m=p?n:d;return(0,t.jsx)(j.Provider,{value:{name:s??u,value:m,select:e=>{e!==m&&(p||f(e),a?.(e))},disabled:o},children:(0,t.jsx)(`div`,{...l,role:`radiogroup`,className:r(`tintora-radio-group`,c)})})}function F({className:e,disabled:n,...i}){return(0,t.jsxs)(`label`,{className:r(`tintora-search-input`,n&&`tintora-search-input--disabled`,e),children:[(0,t.jsxs)(`svg`,{className:`tintora-search-input__icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,"aria-hidden":`true`,children:[(0,t.jsx)(`circle`,{cx:`11`,cy:`11`,r:`7`}),(0,t.jsx)(`path`,{d:`M20 20l-3.5-3.5`})]}),(0,t.jsx)(`input`,{...i,type:`search`,disabled:n,className:`tintora-search-input__input`})]})}var I=(0,e.createContext)(null),L=()=>{let t=(0,e.useContext)(I);if(!t)throw Error(`SelectOption must be rendered inside a Select`);return t};function R({label:e,value:n,disabled:i}){let{select:a,activate:o,optionId:s,value:c,activeValue:l}=L();return(0,t.jsx)(`div`,{id:s(n),role:`option`,"aria-selected":c===n,"aria-disabled":i||void 0,className:r(`tintora-select__option`,l===n&&`tintora-select__option--active`),onClick:()=>a(n),onMouseMove:()=>!i&&o(n),children:e})}var z=4;function B({defaultValue:n,options:i,disabled:a,value:o,placeholder:s,onValueChange:c,name:l,className:u,onClick:d,onKeyDown:f,onKeyUp:p,"aria-label":m,...h}){let g=(0,e.useId)(),_=(0,e.useRef)(null),v=(0,e.useRef)(null),y=(0,e.useRef)(null),[b,C]=(0,e.useState)(n??null),[w,T]=(0,e.useState)(!1),[E,D]=(0,e.useState)(-1),O=o!==void 0,k=O?o:b,A=i.findIndex(e=>e.value===k),j=e=>i[e]?.disabled!==!0,M=()=>i.findIndex((e,t)=>j(t)),N=(e,t)=>{for(let n=e+t;n>=0&&n<i.length;n+=t)if(j(n))return n;return e},P=()=>{let e=N(i.length,-1);return e===i.length?-1:e},F=e=>i.findIndex(t=>t.value===e),L=()=>{D(A>=0&&j(A)?A:M()),T(!0)},B=()=>T(!1),V=e=>{let t=F(e);t<0||!j(t)||(B(),e!==k&&(O||C(e),c?.(e)))},H=e=>{if(f?.(e),e.defaultPrevented)return;let{key:t}=e;if(t===`Tab`)return B();if(!w){[`Enter`,` `,`ArrowDown`,`ArrowUp`].includes(t)&&(e.preventDefault(),L());return}let n={ArrowDown:()=>E<0?M():N(E,1),ArrowUp:()=>E<0?M():N(E,-1),Home:M,End:P};t in n?(e.preventDefault(),D(n[t]())):t===`Enter`||t===` `?(e.preventDefault(),E>=0?V(i[E].value):B()):t===`Escape`&&(e.preventDefault(),B())},U=e=>{p?.(e),e.key===` `&&e.preventDefault()},W=S(w,y,()=>{let e=y.current,t=v.current;if(!e||!t)return null;let n=t.getBoundingClientRect(),r=e.offsetHeight,i=n.bottom+z+r<=window.innerHeight,a=n.top-z-r>=0;return{top:i||!a?n.bottom+z:n.top-z-r,left:n.left,minWidth:n.width}},[]),G=e=>{d?.(e),!e.defaultPrevented&&(w?B():L())};x(w,_,B),(0,e.useEffect)(()=>{w&&E>=0&&y.current?.children.item(E)?.scrollIntoView?.({block:`nearest`})},[w,E]);let K=e=>`${g}-option-${F(e)}`,q=w?i[E]?.value??null:null,J=i[A]?.label;return(0,t.jsx)(I.Provider,{value:{value:k,activeValue:q,select:V,optionId:K,activate:e=>D(F(e))},children:(0,t.jsxs)(`div`,{ref:_,className:`tintora-select`,children:[(0,t.jsxs)(`button`,{...h,ref:v,type:`button`,role:`combobox`,"aria-label":m,"aria-haspopup":`listbox`,"aria-expanded":w,"aria-controls":w?g:void 0,"aria-activedescendant":q===null?void 0:K(q),disabled:a,className:r(`tintora-select__trigger`,u),onClick:G,onKeyDown:H,onKeyUp:U,children:[(0,t.jsx)(`span`,{className:r(`tintora-select__value`,J===void 0&&`tintora-select__value--placeholder`),children:J??s}),(0,t.jsx)(`svg`,{className:`tintora-select__chevron`,width:`10`,height:`10`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`3`,strokeLinecap:`round`,strokeLinejoin:`round`,"aria-hidden":`true`,children:(0,t.jsx)(`path`,{d:`M6 9l6 6 6-6`})})]}),w&&(0,t.jsx)(`div`,{ref:y,id:g,role:`listbox`,"aria-label":m,popover:`manual`,className:`tintora-select__menu`,style:W??{},onMouseDown:e=>e.preventDefault(),children:i.map(e=>(0,t.jsx)(R,{...e},e.value))}),l&&(0,t.jsx)(`input`,{type:`hidden`,name:l,value:k??``,disabled:a})]})})}function V({width:e,height:n,className:i,style:a,...o}){let s={...e!==void 0&&{width:e},...n!==void 0&&{height:n}};return(0,t.jsx)(`span`,{...o,"aria-hidden":`true`,className:r(`tintora-skeleton`,i),style:{...s,...a}})}function H({checked:e,defaultChecked:n,onCheckedChange:i,className:a,...o}){let s=d({checked:e,defaultChecked:n,onCheckedChange:i});return(0,t.jsxs)(`span`,{className:r(`tintora-switch`,a),children:[(0,t.jsx)(`input`,{...o,type:`checkbox`,role:`switch`,className:`tintora-switch__input`,checked:s.checked,onChange:s.onChange}),(0,t.jsx)(`span`,{className:`tintora-switch__track`,"aria-hidden":`true`})]})}function U({children:e,className:n,variant:i=`neutral`,size:a=`medium`,...o}){return(0,t.jsx)(`span`,{...o,className:r(`tintora-tag`,`tintora-tag--${i}`,`tintora-tag--${a}`,n),children:e})}function W({label:n,hint:i,error:a,id:o,className:s,disabled:c,"aria-describedby":l,"aria-invalid":u,...d}){let f=(0,e.useId)(),p=o??f,m=`${p}-message`,h=a??i;return(0,t.jsxs)(`div`,{className:r(`tintora-textfield`,c&&`tintora-textfield--disabled`,s),children:[(0,t.jsx)(`label`,{htmlFor:p,className:`tintora-textfield__label`,children:n}),(0,t.jsx)(`input`,{...d,id:p,disabled:c,className:`tintora-textfield__input`,"aria-invalid":a?!0:u,"aria-describedby":r(h&&m,l)||void 0}),h&&(0,t.jsx)(`span`,{id:m,className:r(`tintora-textfield__hint`,a&&`tintora-textfield__hint--error`),children:h})]})}function G(){return(0,t.jsx)(`svg`,{width:`20`,height:`20`,viewBox:`0 0 24 24`,fill:`none`,stroke:`var(--tintora-toast-icon-success)`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,"aria-hidden":`true`,style:{flex:`0 0 auto`},children:(0,t.jsx)(`path`,{d:`M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM8 12.5l2.7 2.7L16 9.8`})})}function K(){return(0,t.jsx)(`svg`,{width:`20`,height:`20`,viewBox:`0 0 24 24`,fill:`none`,stroke:`var(--tintora-toast-icon-error)`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,"aria-hidden":`true`,style:{flex:`0 0 auto`},children:(0,t.jsx)(`path`,{d:`M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM15 9l-6 6M9 9l6 6`})})}function q(){return(0,t.jsx)(`svg`,{width:`20`,height:`20`,viewBox:`0 0 24 24`,fill:`none`,stroke:`var(--tintora-toast-icon-info)`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,"aria-hidden":`true`,style:{flex:`0 0 auto`},children:(0,t.jsx)(`path`,{d:`M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM12 16v-4M12 8h.01`})})}function J(){return(0,t.jsx)(`svg`,{width:`20`,height:`20`,viewBox:`0 0 24 24`,fill:`none`,stroke:`var(--tintora-toast-icon-warning)`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,"aria-hidden":`true`,style:{flex:`0 0 auto`},children:(0,t.jsx)(`path`,{d:`M10.3 3.9L1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0zM12 9v4M12 17h.01`})})}function Y(){return(0,t.jsx)(`svg`,{width:`14`,height:`14`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2.2`,strokeLinecap:`round`,"aria-hidden":`true`,children:(0,t.jsx)(`path`,{d:`M18 6L6 18M6 6l12 12`})})}var X={success:(0,t.jsx)(G,{}),error:(0,t.jsx)(K,{}),info:(0,t.jsx)(q,{}),warning:(0,t.jsx)(J,{})};function Z({status:n,children:i,action:a,onDismiss:o,duration:s=5e3,timerBar:c=!1,className:l,...u}){let[d,f]=(0,e.useState)(!1),[p,m]=(0,e.useState)(!1),h=d||p,g=y(o),_=(0,e.useRef)(s);(0,e.useEffect)(()=>{_.current=s},[s]),(0,e.useEffect)(()=>{if(s<=0||h)return;let e=Date.now(),t=setTimeout(()=>g.current(),_.current);return()=>{clearTimeout(t),_.current-=Date.now()-e}},[s,h,g]);let v=c&&s>0,b={"--tintora-toast-animation-duration":`${s}ms`};return(0,t.jsxs)(`div`,{...u,role:`status`,className:r(`tintora-toast`,v&&`tintora-toast--timer`,h&&`tintora-toast--paused`,l),onMouseEnter:e=>{u.onMouseEnter?.(e),f(!0)},onMouseLeave:e=>{u.onMouseLeave?.(e),f(!1)},onFocus:e=>{u.onFocus?.(e),m(!0)},onBlur:e=>{u.onBlur?.(e),e.currentTarget.contains(e.relatedTarget)||m(!1)},children:[n&&X[n],(0,t.jsx)(`span`,{className:`tintora-toast__message`,children:i}),a&&(0,t.jsx)(`button`,{type:`button`,className:`tintora-toast__action`,onClick:a.onClick,children:a.label}),(0,t.jsx)(`button`,{type:`button`,className:`tintora-toast__close`,"aria-label":`Dismiss`,onClick:o,children:(0,t.jsx)(Y,{})}),v&&(0,t.jsx)(`span`,{className:`tintora-toast__progress`,style:b})]})}var Q=(0,e.createContext)(null);function $(){let t=(0,e.useContext)(Q);if(!t)throw Error(`ToggleItem must be rendered inside a Toggle`);return t}function ee({children:n,value:i,defaultValue:a,onValueChange:o,disabled:s=!1,className:c,...l}){let[u,d]=(0,e.useState)(a),f=i!==void 0,p=f?i:u,m=n.findIndex(e=>e.props.value===p),h=(0,e.useRef)(null),[g,_]=(0,e.useState)({x:0,width:0});(0,e.useLayoutEffect)(()=>{let e=h.current;if(!e)return;let t=()=>{let t=e.children.item(m);if(!t)return;let n={x:t.offsetLeft,width:t.offsetWidth};_(e=>e.x===n.x&&e.width===n.width?e:n)};t();let n=new ResizeObserver(t);return n.observe(e),()=>{n.disconnect()}},[m]);let v={"--tintora-toggle-thumb-x":`${g.x}px`,"--tintora-toggle-thumb-width":`${g.width}px`};return(0,t.jsx)(Q.Provider,{value:{value:p,select:e=>{e!==p&&(f||d(e),o?.(e))},disabled:s},children:(0,t.jsxs)(`div`,{...l,role:`group`,ref:h,className:r(`tintora-toggle`,s&&`tintora-toggle--disabled`,c),children:[n,(0,t.jsx)(`span`,{"aria-hidden":`true`,className:`tintora-toggle__thumb`,style:v})]})})}function te({value:e,children:n,className:i,disabled:a,onClick:o,...s}){let c=$(),l=t=>{o?.(t),t.defaultPrevented||c.select(e)};return(0,t.jsx)(`button`,{...s,type:`button`,className:r(`tintora-toggle__item`,i),"aria-pressed":c.value===e,disabled:a||c.disabled,onClick:l,children:n})}var ne=100;function re({title:n,content:i,shortcut:a,children:o,className:s,placement:c=`top`}){let l=(0,e.useId)(),[u,d]=(0,e.useState)(!1),f=(0,e.useRef)(null),p=(0,e.useRef)(null),m=(0,e.useRef)(void 0),h=()=>{window.clearTimeout(m.current),d(!0)},g=()=>{window.clearTimeout(m.current),m.current=window.setTimeout(()=>d(!1),ne)},_=S(u,p,()=>{let e=p.current,t=f.current?.firstElementChild;return!e||!t?null:D(t.getBoundingClientRect(),{width:e.offsetWidth,height:e.offsetHeight},c)},[c,n,i,a]);b(u,()=>d(!1)),(0,e.useEffect)(()=>()=>window.clearTimeout(m.current),[]);let v=_?{top:_.top,left:_.left,"--tintora-tooltip-arrow-offset":`${_.arrowOffset}px`}:{visibility:`hidden`};return(0,t.jsxs)(`span`,{ref:f,className:`tintora-tooltip`,onMouseEnter:h,onMouseLeave:g,onFocus:h,onBlur:g,children:[(0,e.cloneElement)(o,{"aria-describedby":r(o.props[`aria-describedby`],u&&l)||void 0}),u&&(0,t.jsxs)(`div`,{id:l,ref:p,role:`tooltip`,popover:`manual`,style:v,className:r(`tintora-tooltip__content`,`tintora-tooltip__content--${_?.placement??c}`,n&&`tintora-tooltip__content--rich`,s),children:[n&&(0,t.jsx)(`span`,{className:`tintora-tooltip__title`,children:n}),(0,t.jsx)(`span`,{className:`tintora-tooltip__text`,children:i}),a&&(0,t.jsx)(`kbd`,{className:`tintora-tooltip__shortcut`,children:a})]})]})}exports.Avatar=a,exports.Button=c,exports.Card=l,exports.Checkbox=f,exports.Chip=p,exports.Dot=m,exports.IconButton=g,exports.Modal=v,exports.Popover=k,exports.ProgressBar=A,exports.Radio=N,exports.RadioGroup=P,exports.SearchInput=F,exports.Select=B,exports.SelectableCard=u,exports.Skeleton=V,exports.Spinner=s,exports.Switch=H,exports.Tag=U,exports.TextField=W,exports.Toast=Z,exports.Toggle=ee,exports.ToggleItem=te,exports.Tooltip=re;
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("react/jsx-runtime"),t=require("react");function n(e){var t,r,i=``;if(typeof e==`string`||typeof e==`number`)i+=e;else if(typeof e==`object`){if(Array.isArray(e)){var a=e.length;for(t=0;t<a;t++)e[t]&&(r=n(e[t]))&&(i&&(i+=` `),i+=r)}else for(r in e)e[r]&&(i&&(i+=` `),i+=r)}return i}function r(){for(var e,t,r=0,i=``,a=arguments.length;r<a;r++)(e=arguments[r])&&(t=n(e))&&(i&&(i+=` `),i+=t);return i}var i={info:(0,e.jsx)(`path`,{d:`M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM12 16v-4M12 8h.01`}),success:(0,e.jsx)(`path`,{d:`M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM8 12.5l2.7 2.7L16 9.8`}),warning:(0,e.jsx)(`path`,{d:`M10.3 3.9L1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0zM12 9v4M12 17h.01`}),error:(0,e.jsx)(`path`,{d:`M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM15 9l-6 6M9 9l6 6`})},a=({status:t})=>(0,e.jsx)(`svg`,{width:`22`,height:`22`,viewBox:`0 0 24 24`,fill:`none`,stroke:`var(--tintora-status-${t}-fg)`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,"aria-hidden":`true`,style:{flex:`0 0 auto`,marginTop:1},children:i[t]});function o({status:t=`info`,variant:n=`alert`,title:i,children:o,action:s,onDismiss:c,className:l,...u}){return(0,e.jsxs)(`div`,{...u,role:n===`alert`&&t===`error`?`alert`:`status`,className:r(`tintora-alert`,n===`announcement`?`tintora-alert--announcement`:`tintora-alert--${t}`,l),children:[n===`alert`&&(0,e.jsx)(a,{status:t}),(0,e.jsxs)(`div`,{className:r(`tintora-alert__content`,n===`announcement`&&`tintora-alert__content--announcement`),children:[i&&(0,e.jsx)(`span`,{className:`tintora-alert__content__title`,children:i}),o&&(0,e.jsx)(`span`,{className:`tintora-alert__content__sub-title`,children:o}),s&&(0,e.jsx)(`button`,{type:`button`,onClick:s.onClick,className:r(`tintora-alert__content__action`,n===`alert`&&`tintora-alert__content__action--${t}`),children:s.label})]}),n===`alert`&&c&&(0,e.jsx)(`button`,{type:`button`,"aria-label":`Dismiss`,className:`tintora-alert__close`,onClick:c,children:(0,e.jsx)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,"aria-hidden":`true`,children:(0,e.jsx)(`path`,{d:`M18 6L6 18M6 6l12 12`})})})]})}function s(e){if(!e.length)return``;let t=e.trim().split(/\s+/).map(e=>e.match(/\p{L}\p{M}*/u)?.[0]).filter(e=>!!e);return`${t[0]??``}${t.length>1?t.at(-1)??``:``}`.toLocaleUpperCase()}function c({name:n,src:i,size:a=`medium`,className:o,...c}){let[l,u]=(0,t.useState)(),d=!!i&&i!==l;return(0,e.jsx)(`span`,{role:`img`,"aria-label":n,...c,className:r(`tintora-avatar`,`tintora-avatar--${a}`,o),children:d?(0,e.jsx)(`img`,{src:i,alt:``,onError:()=>u(i)}):s(n)})}var l={small:{width:16,height:16,strokeWidth:3.5},medium:{width:24,height:24,strokeWidth:3},large:{width:40,height:40,strokeWidth:2.4}};function u({size:t=`medium`,color:n=`accent`}){let{width:r,height:i,strokeWidth:a}=l[t];return(0,e.jsxs)(`svg`,{className:`tintora-spinner`,width:r,height:i,viewBox:`0 0 24 24`,fill:`none`,role:`img`,"aria-label":`Loading`,children:[(0,e.jsx)(`circle`,{cx:`12`,cy:`12`,r:`9`,stroke:`currentColor`,strokeOpacity:n===`accent`?.25:.35,strokeWidth:a}),(0,e.jsx)(`path`,{d:`M21 12a9 9 0 0 0-9-9`,stroke:n===`accent`?`var(--tintora-control-fill)`:`currentColor`,strokeWidth:a,strokeLinecap:`round`})]})}function d({children:t,className:n,variant:i,size:a=`medium`,leadingIcon:o,trailingIcon:s,type:c=`button`,loading:l=!1,disabled:d,...f}){return(0,e.jsxs)(`button`,{type:c,className:r(`tintora-button`,`tintora-button--${i}`,`tintora-button--${a}`,{"tintora-button--leading-icon":!!o||l,"tintora-button--loading":l,"tintora-button--trailing-icon":!!s},n),disabled:d||l,"aria-busy":l||void 0,...f,children:[l&&(0,e.jsx)(`span`,{className:`tintora-button__icon`,"aria-hidden":`true`,children:(0,e.jsx)(u,{size:`small`,color:`current`})}),!l&&o&&(0,e.jsx)(`span`,{className:`tintora-button__icon`,"aria-hidden":`true`,children:o}),t,s&&(0,e.jsx)(`span`,{className:`tintora-button__icon`,"aria-hidden":`true`,children:s})]})}function f({as:t=`article`,variant:n=`surface`,className:i,...a}){return(0,e.jsx)(t,{...a,className:r(`tintora-card`,`tintora-card--${n}`,i)})}function p({selected:t=!1,className:n,...i}){return(0,e.jsx)(`button`,{...i,type:`button`,"aria-pressed":t,className:r(`tintora-card`,`tintora-card--surface`,`tintora-card--selectable`,t&&`tintora-card--selected`,n)})}function m({checked:e,defaultChecked:n=!1,onCheckedChange:r}){let[i,a]=(0,t.useState)(n),o=e!==void 0;return{checked:o?e:i,onChange:e=>{o||a(e.target.checked),r?.(e.target.checked)}}}function h({checked:n,defaultChecked:i,onCheckedChange:a,indeterminate:o=!1,className:s,...c}){let l=(0,t.useRef)(null),u=m({checked:n,defaultChecked:i,onCheckedChange:a});return(0,t.useLayoutEffect)(()=>{l.current&&(l.current.indeterminate=o)}),(0,e.jsxs)(`span`,{className:r(`tintora-checkbox`,s),children:[(0,e.jsx)(`input`,{...c,ref:l,type:`checkbox`,className:`tintora-checkbox__input`,checked:u.checked,onChange:u.onChange}),(0,e.jsxs)(`span`,{className:`tintora-checkbox__box`,"aria-hidden":`true`,children:[(0,e.jsx)(`svg`,{className:`tintora-checkbox__check`,width:`14`,height:`14`,viewBox:`0 0 24 24`,fill:`none`,strokeWidth:`3.2`,strokeLinecap:`round`,strokeLinejoin:`round`,children:(0,e.jsx)(`path`,{d:`M5 12.5l4.5 4.5L19 7.5`})}),(0,e.jsx)(`svg`,{className:`tintora-checkbox__dash`,width:`14`,height:`14`,viewBox:`0 0 24 24`,fill:`none`,strokeWidth:`3.2`,strokeLinecap:`round`,children:(0,e.jsx)(`path`,{d:`M6 12h12`})})]})]})}function g({children:t,selected:n,className:i,"aria-pressed":a,...o}){return(0,e.jsx)(`button`,{...o,type:`button`,className:r(`tintora-chip`,i),"aria-pressed":n??a,children:t})}function _({variant:t=`unread`,label:n,className:i,...a}){return(0,e.jsx)(`span`,{...a,className:r(`tintora-dot`,`tintora-dot--${t}`,i),role:n?`img`:void 0,"aria-label":n,"aria-hidden":!n||void 0})}var v={round:`secondary`,field:`secondary`,nav:`ghost`};function y({icon:t,variant:n=`round`,size:i,selected:a,className:o,...s}){let c=n===`round`?i??`large`:void 0;return(0,e.jsx)(d,{...s,variant:v[n],"aria-current":a?`page`:void 0,className:r(`tintora-icon-button`,`tintora-icon-button--${n}`,c&&`tintora-icon-button--${c}`,o),...c&&{size:c},children:(0,e.jsx)(`span`,{className:`tintora-icon-button__icon`,"aria-hidden":`true`,children:t})})}var b=()=>(0,e.jsx)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,children:(0,e.jsx)(`path`,{d:`M18 6L6 18M6 6l12 12`})});function x({open:n,onClose:i,title:a,description:o,icon:s,status:c=`info`,actions:l,size:u=`md`,align:d=`start`,role:f=`dialog`,closeButton:p=!0,className:m,children:h,...g}){let _=(0,t.useRef)(null),v=(0,t.useId)(),x=(0,t.useId)();return(0,t.useEffect)(()=>{let e=_.current;e&&(n&&!e.open?(e.showModal(),e.querySelector(`[data-autofocus]`)?.focus()):!n&&e.open&&e.close())},[n]),(0,e.jsxs)(`dialog`,{...g,ref:_,role:f,"aria-labelledby":v,"aria-describedby":o?x:void 0,className:r(`tintora-modal`,`tintora-modal--${u}`,d===`center`&&`tintora-modal--center`,m),onCancel:e=>{e.preventDefault(),i()},onClick:e=>{f===`dialog`&&e.target===e.currentTarget&&i()},children:[s&&(0,e.jsx)(`span`,{className:r(`tintora-modal__icon`,`tintora-modal__icon--${c}`),"aria-hidden":`true`,children:s}),(0,e.jsxs)(`div`,{className:`tintora-modal__text`,children:[(0,e.jsx)(`h2`,{id:v,className:`tintora-modal__title`,children:a}),o&&(0,e.jsx)(`p`,{id:x,className:`tintora-modal__description`,children:o})]}),p&&(0,e.jsx)(y,{className:`tintora-modal__close`,size:`medium`,"aria-label":`Close`,icon:(0,e.jsx)(b,{}),onClick:i}),h,l&&(0,e.jsx)(`div`,{className:`tintora-modal__actions`,children:l})]})}function S(e){let n=(0,t.useRef)(e);return(0,t.useEffect)(()=>{n.current=e},[e]),n}function C(e,n){let r=S(n);(0,t.useEffect)(()=>{if(!e)return;let t=e=>{e.key===`Escape`&&r.current()};return document.addEventListener(`keydown`,t),()=>document.removeEventListener(`keydown`,t)},[e,r])}function w(e,n,r){let i=S(r);(0,t.useEffect)(()=>{if(!e)return;let t=e=>{n.current?.contains(e.target)||i.current()};return document.addEventListener(`pointerdown`,t),()=>document.removeEventListener(`pointerdown`,t)},[e,n,i])}function T(e,n,r,i){let[a,o]=(0,t.useState)(null);return(0,t.useLayoutEffect)(()=>{let t=n.current;if(!e||!t){o(null);return}t.showPopover();let i=()=>o(r()),a=e=>{t.contains(e.target)||i()};return i(),window.addEventListener(`scroll`,a,!0),window.addEventListener(`resize`,i),()=>{window.removeEventListener(`scroll`,a,!0),window.removeEventListener(`resize`,i)}},[e,n,...i]),a}var E={gap:10,margin:8,arrowInset:12},D={top:`bottom`,bottom:`top`,left:`right`,right:`left`},O=(e,t,n)=>Math.min(Math.max(e,t),Math.max(t,n));function k(e,t,n,r,{gap:i,margin:a}){let o=t=>{switch(t){case`top`:return e.top;case`bottom`:return r.height-e.bottom;case`left`:return e.left;case`right`:return r.width-e.right}},s=(n===`top`||n===`bottom`?t.height:t.width)+i+a,c=o(n);return c>=s||o(D[n])<=c?n:D[n]}function A(e,t,n,r={width:window.innerWidth,height:window.innerHeight},i={}){let a={...E,...i},{gap:o,margin:s,arrowInset:c}=a,l=k(e,t,n,r,a),u=l===`top`||l===`bottom`,d,f;switch(l){case`top`:d=e.y-t.height-o,f=e.x+e.width/2-t.width/2;break;case`bottom`:d=e.y+e.height+o,f=e.x+e.width/2-t.width/2;break;case`left`:d=e.y+e.height/2-t.height/2,f=e.x-t.width-o;break;case`right`:d=e.y+e.height/2-t.height/2,f=e.x+e.width+o}u?f=O(f,s,r.width-t.width-s):d=O(d,s,r.height-t.height-s);let p=u?e.x+e.width/2-f:e.y+e.height/2-d,m=u?t.width:t.height;return{top:d,left:f,placement:l,arrowOffset:O(p,c,m-c)}}var j=[`button:not([disabled])`,`[href]`,`input:not([disabled])`,`select:not([disabled])`,`textarea:not([disabled])`,`[tabindex]:not([tabindex="-1"])`].join(`, `);function M({open:n,onOpenChange:i,trigger:a,title:o,children:s,role:c=`dialog`,size:l=`md`,placement:u=`bottom`,className:d}){let f=(0,t.useId)(),p=(0,t.useRef)(null),m=(0,t.useRef)(null),h=(0,t.useRef)(!1),g=()=>i(!1);C(n,g),w(n,p,g);let _=e=>{a.props.onClick?.(e),e.defaultPrevented||i(!n)},v=T(n,m,()=>{let e=m.current,t=p.current?.firstElementChild;return!e||!t?null:A(t.getBoundingClientRect(),{width:e.offsetWidth,height:e.offsetHeight},u,void 0,{gap:12})},[u,o,s]),y=v?{top:v.top,left:v.left,"--tintora-popover-arrow-offset":`${v.arrowOffset}px`}:{visibility:`hidden`},b=v!==null;return(0,t.useLayoutEffect)(()=>{let e=m.current;n&&b&&e&&(e.querySelector(`[data-autofocus]`)??e.querySelector(j)??e).focus()},[n,b]),(0,t.useEffect)(()=>{if(h.current&&!n){let e=document.activeElement;(!e||e===document.body)&&p.current?.querySelector(`*`)?.focus()}h.current=n},[n]),(0,e.jsxs)(`span`,{ref:p,className:`tintora-popover-root`,children:[(0,t.cloneElement)(a,{"aria-haspopup":`dialog`,"aria-expanded":n,"aria-controls":n?f:void 0,onClick:_}),n&&(0,e.jsx)(`div`,{id:f,ref:m,role:c,"aria-label":o,popover:`manual`,tabIndex:-1,className:r(`tintora-popover`,`tintora-popover--${l}`,`tintora-popover--${v?.placement??u}`,d),style:y,children:s})]})}function N({title:n,progress:i,indeterminate:a,valueLabel:o,className:s,"aria-label":c}){let l=(0,t.useId)(),u=a?void 0:Math.min(100,Math.max(0,Number.isFinite(i)?i:0)),d=u===100,f=o??(a?`Indeterminate`:`${u}%`);return(0,e.jsxs)(`div`,{className:r(`tintora-progress-bar`,s),children:[n&&(0,e.jsxs)(`div`,{className:`tintora-progress-bar__header`,children:[(0,e.jsx)(`span`,{id:l,children:n}),(0,e.jsx)(`span`,{className:`tintora-progress-bar__value`,children:f})]}),(0,e.jsx)(`div`,{role:`progressbar`,"aria-label":c,"aria-labelledby":n?l:void 0,"aria-valuemin":a?void 0:0,"aria-valuemax":a?void 0:100,"aria-valuenow":u,"aria-valuetext":o,className:`tintora-progress-bar__track`,children:(0,e.jsx)(`div`,{className:r(`tintora-progress-bar__fill`,{"tintora-progress-bar__fill--indeterminate":a,"tintora-progress-bar__fill--complete":d}),style:u===void 0?void 0:{width:`${u}%`}})})]})}var P=(0,t.createContext)(null);function F(){let e=(0,t.useContext)(P);if(!e)throw Error(`Radio must be rendered inside a RadioGroup`);return e}function I({value:t,className:n,disabled:i,...a}){let o=F();return(0,e.jsxs)(`span`,{className:r(`tintora-radio`,n),children:[(0,e.jsx)(`input`,{...a,type:`radio`,className:`tintora-radio__input`,name:o.name,value:t,checked:o.value===t,disabled:i||o.disabled,onChange:()=>o.select(t)}),(0,e.jsx)(`span`,{className:`tintora-radio__circle`,"aria-hidden":`true`})]})}function L({value:n,defaultValue:i,onValueChange:a,disabled:o=!1,name:s,className:c,...l}){let u=(0,t.useId)(),[d,f]=(0,t.useState)(i??null),p=n!==void 0,m=p?n:d;return(0,e.jsx)(P.Provider,{value:{name:s??u,value:m,select:e=>{e!==m&&(p||f(e),a?.(e))},disabled:o},children:(0,e.jsx)(`div`,{...l,role:`radiogroup`,className:r(`tintora-radio-group`,c)})})}function R({className:t,disabled:n,...i}){return(0,e.jsxs)(`label`,{className:r(`tintora-search-input`,n&&`tintora-search-input--disabled`,t),children:[(0,e.jsxs)(`svg`,{className:`tintora-search-input__icon`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,"aria-hidden":`true`,children:[(0,e.jsx)(`circle`,{cx:`11`,cy:`11`,r:`7`}),(0,e.jsx)(`path`,{d:`M20 20l-3.5-3.5`})]}),(0,e.jsx)(`input`,{...i,type:`search`,disabled:n,className:`tintora-search-input__input`})]})}var z=(0,t.createContext)(null),B=()=>{let e=(0,t.useContext)(z);if(!e)throw Error(`SelectOption must be rendered inside a Select`);return e};function V({label:t,value:n,disabled:i}){let{select:a,activate:o,optionId:s,value:c,activeValue:l}=B();return(0,e.jsx)(`div`,{id:s(n),role:`option`,"aria-selected":c===n,"aria-disabled":i||void 0,className:r(`tintora-select__option`,l===n&&`tintora-select__option--active`),onClick:()=>a(n),onMouseMove:()=>!i&&o(n),children:t})}var H=4;function U({defaultValue:n,options:i,disabled:a,value:o,placeholder:s,onValueChange:c,name:l,className:u,onClick:d,onKeyDown:f,onKeyUp:p,"aria-label":m,...h}){let g=(0,t.useId)(),_=(0,t.useRef)(null),v=(0,t.useRef)(null),y=(0,t.useRef)(null),[b,x]=(0,t.useState)(n??null),[S,C]=(0,t.useState)(!1),[E,D]=(0,t.useState)(-1),O=o!==void 0,k=O?o:b,A=i.findIndex(e=>e.value===k),j=e=>i[e]?.disabled!==!0,M=()=>i.findIndex((e,t)=>j(t)),N=(e,t)=>{for(let n=e+t;n>=0&&n<i.length;n+=t)if(j(n))return n;return e},P=()=>{let e=N(i.length,-1);return e===i.length?-1:e},F=e=>i.findIndex(t=>t.value===e),I=()=>{D(A>=0&&j(A)?A:M()),C(!0)},L=()=>C(!1),R=e=>{let t=F(e);t<0||!j(t)||(L(),e!==k&&(O||x(e),c?.(e)))},B=e=>{if(f?.(e),e.defaultPrevented)return;let{key:t}=e;if(t===`Tab`)return L();if(!S){[`Enter`,` `,`ArrowDown`,`ArrowUp`].includes(t)&&(e.preventDefault(),I());return}let n={ArrowDown:()=>E<0?M():N(E,1),ArrowUp:()=>E<0?M():N(E,-1),Home:M,End:P};t in n?(e.preventDefault(),D(n[t]())):t===`Enter`||t===` `?(e.preventDefault(),E>=0?R(i[E].value):L()):t===`Escape`&&(e.preventDefault(),L())},U=e=>{p?.(e),e.key===` `&&e.preventDefault()},W=T(S,y,()=>{let e=y.current,t=v.current;if(!e||!t)return null;let n=t.getBoundingClientRect(),r=e.offsetHeight,i=n.bottom+H+r<=window.innerHeight,a=n.top-H-r>=0;return{top:i||!a?n.bottom+H:n.top-H-r,left:n.left,minWidth:n.width}},[]),G=e=>{d?.(e),!e.defaultPrevented&&(S?L():I())};w(S,_,L),(0,t.useEffect)(()=>{S&&E>=0&&y.current?.children.item(E)?.scrollIntoView?.({block:`nearest`})},[S,E]);let K=e=>`${g}-option-${F(e)}`,q=S?i[E]?.value??null:null,J=i[A]?.label;return(0,e.jsx)(z.Provider,{value:{value:k,activeValue:q,select:R,optionId:K,activate:e=>D(F(e))},children:(0,e.jsxs)(`div`,{ref:_,className:`tintora-select`,children:[(0,e.jsxs)(`button`,{...h,ref:v,type:`button`,role:`combobox`,"aria-label":m,"aria-haspopup":`listbox`,"aria-expanded":S,"aria-controls":S?g:void 0,"aria-activedescendant":q===null?void 0:K(q),disabled:a,className:r(`tintora-select__trigger`,u),onClick:G,onKeyDown:B,onKeyUp:U,children:[(0,e.jsx)(`span`,{className:r(`tintora-select__value`,J===void 0&&`tintora-select__value--placeholder`),children:J??s}),(0,e.jsx)(`svg`,{className:`tintora-select__chevron`,width:`10`,height:`10`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`3`,strokeLinecap:`round`,strokeLinejoin:`round`,"aria-hidden":`true`,children:(0,e.jsx)(`path`,{d:`M6 9l6 6 6-6`})})]}),S&&(0,e.jsx)(`div`,{ref:y,id:g,role:`listbox`,"aria-label":m,popover:`manual`,className:`tintora-select__menu`,style:W??{},onMouseDown:e=>e.preventDefault(),children:i.map(t=>(0,e.jsx)(V,{...t},t.value))}),l&&(0,e.jsx)(`input`,{type:`hidden`,name:l,value:k??``,disabled:a})]})})}function W({width:t,height:n,className:i,style:a,...o}){let s={...t!==void 0&&{width:t},...n!==void 0&&{height:n}};return(0,e.jsx)(`span`,{...o,"aria-hidden":`true`,className:r(`tintora-skeleton`,i),style:{...s,...a}})}function G({checked:t,defaultChecked:n,onCheckedChange:i,className:a,...o}){let s=m({checked:t,defaultChecked:n,onCheckedChange:i});return(0,e.jsxs)(`span`,{className:r(`tintora-switch`,a),children:[(0,e.jsx)(`input`,{...o,type:`checkbox`,role:`switch`,className:`tintora-switch__input`,checked:s.checked,onChange:s.onChange}),(0,e.jsx)(`span`,{className:`tintora-switch__track`,"aria-hidden":`true`})]})}function K({children:t,className:n,variant:i=`neutral`,size:a=`medium`,...o}){return(0,e.jsx)(`span`,{...o,className:r(`tintora-tag`,`tintora-tag--${i}`,`tintora-tag--${a}`,n),children:t})}function q({label:n,hint:i,error:a,id:o,className:s,disabled:c,"aria-describedby":l,"aria-invalid":u,...d}){let f=(0,t.useId)(),p=o??f,m=`${p}-message`,h=a??i;return(0,e.jsxs)(`div`,{className:r(`tintora-textfield`,c&&`tintora-textfield--disabled`,s),children:[(0,e.jsx)(`label`,{htmlFor:p,className:`tintora-textfield__label`,children:n}),(0,e.jsx)(`input`,{...d,id:p,disabled:c,className:`tintora-textfield__input`,"aria-invalid":a?!0:u,"aria-describedby":r(h&&m,l)||void 0}),h&&(0,e.jsx)(`span`,{id:m,className:r(`tintora-textfield__hint`,a&&`tintora-textfield__hint--error`),children:h})]})}function J(){return(0,e.jsx)(`svg`,{width:`20`,height:`20`,viewBox:`0 0 24 24`,fill:`none`,stroke:`var(--tintora-toast-icon-success)`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,"aria-hidden":`true`,style:{flex:`0 0 auto`},children:(0,e.jsx)(`path`,{d:`M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM8 12.5l2.7 2.7L16 9.8`})})}function ee(){return(0,e.jsx)(`svg`,{width:`20`,height:`20`,viewBox:`0 0 24 24`,fill:`none`,stroke:`var(--tintora-toast-icon-error)`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,"aria-hidden":`true`,style:{flex:`0 0 auto`},children:(0,e.jsx)(`path`,{d:`M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM15 9l-6 6M9 9l6 6`})})}function Y(){return(0,e.jsx)(`svg`,{width:`20`,height:`20`,viewBox:`0 0 24 24`,fill:`none`,stroke:`var(--tintora-toast-icon-info)`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,"aria-hidden":`true`,style:{flex:`0 0 auto`},children:(0,e.jsx)(`path`,{d:`M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20zM12 16v-4M12 8h.01`})})}function X(){return(0,e.jsx)(`svg`,{width:`20`,height:`20`,viewBox:`0 0 24 24`,fill:`none`,stroke:`var(--tintora-toast-icon-warning)`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,"aria-hidden":`true`,style:{flex:`0 0 auto`},children:(0,e.jsx)(`path`,{d:`M10.3 3.9L1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0zM12 9v4M12 17h.01`})})}function Z(){return(0,e.jsx)(`svg`,{width:`14`,height:`14`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2.2`,strokeLinecap:`round`,"aria-hidden":`true`,children:(0,e.jsx)(`path`,{d:`M18 6L6 18M6 6l12 12`})})}var Q={success:(0,e.jsx)(J,{}),error:(0,e.jsx)(ee,{}),info:(0,e.jsx)(Y,{}),warning:(0,e.jsx)(X,{})};function te({status:n,children:i,action:a,onDismiss:o,duration:s=5e3,timerBar:c=!1,className:l,...u}){let[d,f]=(0,t.useState)(!1),[p,m]=(0,t.useState)(!1),h=d||p,g=S(o),_=(0,t.useRef)(s);(0,t.useEffect)(()=>{_.current=s},[s]),(0,t.useEffect)(()=>{if(s<=0||h)return;let e=Date.now(),t=setTimeout(()=>g.current(),_.current);return()=>{clearTimeout(t),_.current-=Date.now()-e}},[s,h,g]);let v=c&&s>0,y={"--tintora-toast-animation-duration":`${s}ms`};return(0,e.jsxs)(`div`,{...u,role:`status`,className:r(`tintora-toast`,v&&`tintora-toast--timer`,h&&`tintora-toast--paused`,l),onMouseEnter:e=>{u.onMouseEnter?.(e),f(!0)},onMouseLeave:e=>{u.onMouseLeave?.(e),f(!1)},onFocus:e=>{u.onFocus?.(e),m(!0)},onBlur:e=>{u.onBlur?.(e),e.currentTarget.contains(e.relatedTarget)||m(!1)},children:[n&&Q[n],(0,e.jsx)(`span`,{className:`tintora-toast__message`,children:i}),a&&(0,e.jsx)(`button`,{type:`button`,className:`tintora-toast__action`,onClick:a.onClick,children:a.label}),(0,e.jsx)(`button`,{type:`button`,className:`tintora-toast__close`,"aria-label":`Dismiss`,onClick:o,children:(0,e.jsx)(Z,{})}),v&&(0,e.jsx)(`span`,{className:`tintora-toast__progress`,style:y})]})}var $=(0,t.createContext)(null);function ne(){let e=(0,t.useContext)($);if(!e)throw Error(`ToggleItem must be rendered inside a Toggle`);return e}function re({children:n,value:i,defaultValue:a,onValueChange:o,disabled:s=!1,className:c,...l}){let[u,d]=(0,t.useState)(a),f=i!==void 0,p=f?i:u,m=n.findIndex(e=>e.props.value===p),h=(0,t.useRef)(null),[g,_]=(0,t.useState)({x:0,width:0});(0,t.useLayoutEffect)(()=>{let e=h.current;if(!e)return;let t=()=>{let t=e.children.item(m);if(!t)return;let n={x:t.offsetLeft,width:t.offsetWidth};_(e=>e.x===n.x&&e.width===n.width?e:n)};t();let n=new ResizeObserver(t);return n.observe(e),()=>{n.disconnect()}},[m]);let v={"--tintora-toggle-thumb-x":`${g.x}px`,"--tintora-toggle-thumb-width":`${g.width}px`};return(0,e.jsx)($.Provider,{value:{value:p,select:e=>{e!==p&&(f||d(e),o?.(e))},disabled:s},children:(0,e.jsxs)(`div`,{...l,role:`group`,ref:h,className:r(`tintora-toggle`,s&&`tintora-toggle--disabled`,c),children:[n,(0,e.jsx)(`span`,{"aria-hidden":`true`,className:`tintora-toggle__thumb`,style:v})]})})}function ie({value:t,children:n,className:i,disabled:a,onClick:o,...s}){let c=ne(),l=e=>{o?.(e),e.defaultPrevented||c.select(t)};return(0,e.jsx)(`button`,{...s,type:`button`,className:r(`tintora-toggle__item`,i),"aria-pressed":c.value===t,disabled:a||c.disabled,onClick:l,children:n})}var ae=100;function oe({title:n,content:i,shortcut:a,children:o,className:s,placement:c=`top`}){let l=(0,t.useId)(),[u,d]=(0,t.useState)(!1),f=(0,t.useRef)(null),p=(0,t.useRef)(null),m=(0,t.useRef)(void 0),h=()=>{window.clearTimeout(m.current),d(!0)},g=()=>{window.clearTimeout(m.current),m.current=window.setTimeout(()=>d(!1),ae)},_=T(u,p,()=>{let e=p.current,t=f.current?.firstElementChild;return!e||!t?null:A(t.getBoundingClientRect(),{width:e.offsetWidth,height:e.offsetHeight},c)},[c,n,i,a]);C(u,()=>d(!1)),(0,t.useEffect)(()=>()=>window.clearTimeout(m.current),[]);let v=_?{top:_.top,left:_.left,"--tintora-tooltip-arrow-offset":`${_.arrowOffset}px`}:{visibility:`hidden`};return(0,e.jsxs)(`span`,{ref:f,className:`tintora-tooltip`,onMouseEnter:h,onMouseLeave:g,onFocus:h,onBlur:g,children:[(0,t.cloneElement)(o,{"aria-describedby":r(o.props[`aria-describedby`],u&&l)||void 0}),u&&(0,e.jsxs)(`div`,{id:l,ref:p,role:`tooltip`,popover:`manual`,style:v,className:r(`tintora-tooltip__content`,`tintora-tooltip__content--${_?.placement??c}`,n&&`tintora-tooltip__content--rich`,s),children:[n&&(0,e.jsx)(`span`,{className:`tintora-tooltip__title`,children:n}),(0,e.jsx)(`span`,{className:`tintora-tooltip__text`,children:i}),a&&(0,e.jsx)(`kbd`,{className:`tintora-tooltip__shortcut`,children:a})]})]})}exports.Alert=o,exports.Avatar=c,exports.Button=d,exports.Card=f,exports.Checkbox=h,exports.Chip=g,exports.Dot=_,exports.IconButton=y,exports.Modal=x,exports.Popover=M,exports.ProgressBar=N,exports.Radio=I,exports.RadioGroup=L,exports.SearchInput=R,exports.Select=U,exports.SelectableCard=p,exports.Skeleton=W,exports.Spinner=u,exports.Switch=G,exports.Tag=K,exports.TextField=q,exports.Toast=te,exports.Toggle=re,exports.ToggleItem=ie,exports.Tooltip=oe;
|
package/dist/index.d.ts
CHANGED