@kpv2004/quark-ui 0.1.1 → 0.1.2

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.
Files changed (4) hide show
  1. package/dist/index.cjs +1 -1
  2. package/dist/index.css +1 -1
  3. package/dist/index.js +1 -1
  4. package/package.json +2 -2
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";var H=Object.defineProperty;var J=Object.getOwnPropertyDescriptor;var K=Object.getOwnPropertyNames;var Q=Object.prototype.hasOwnProperty;var U=(a,r)=>{for(var e in r)H(a,e,{get:r[e],enumerable:!0})},Z=(a,r,e,t)=>{if(r&&typeof r=="object"||typeof r=="function")for(let o of K(r))!Q.call(a,o)&&o!==e&&H(a,o,{get:()=>r[o],enumerable:!(t=J(r,o))||t.enumerable});return a};var _=a=>Z(H({},"__esModule",{value:!0}),a);var yr={};U(yr,{Alert:()=>T,Avatar:()=>A,Badge:()=>L,Button:()=>C,Card:()=>P,Input:()=>I,Spinner:()=>D,Toggle:()=>B});module.exports=_(yr);var j=require("react");var s={};var q=require("react/jsx-runtime"),ar={sm:s.sizeSm,md:s.sizeMd,lg:s.sizeLg},er={primary:s.variantPrimary,secondary:s.variantSecondary,outline:s.variantOutline,ghost:s.variantGhost,danger:s.variantDanger},C=(0,j.forwardRef)(({variant:a="primary",size:r="md",isLoading:e=!1,leftIcon:t,rightIcon:o,fullWidth:n=!1,disabled:i,className:m,children:k,type:h="button",...x},w)=>{let E=[s.button,ar[r],er[a],n?s.fullWidth:"",e?s.loading:"",m??""].filter(Boolean).join(" ");return(0,q.jsxs)("button",{ref:w,type:h,className:E,disabled:i||e,"aria-busy":e||void 0,"aria-disabled":i||e||void 0,...x,children:[e&&(0,q.jsx)("span",{className:s.spinnerWrapper,"aria-hidden":"true",children:(0,q.jsx)("span",{className:s.spinner})}),t&&(0,q.jsx)("span",{className:s.iconLeft,children:t}),k,o&&(0,q.jsx)("span",{className:s.iconRight,children:o})]})});C.displayName="Button";var u={};var V=require("react/jsx-runtime"),tr={default:u.variantDefault,outlined:u.variantOutlined,elevated:u.variantElevated,glass:u.variantGlass},nr={none:u.paddingNone,sm:u.paddingSm,md:u.paddingMd,lg:u.paddingLg},P=({variant:a="default",padding:r="md",hoverable:e=!1,className:t,children:o,...n})=>{let i=[u.card,tr[a],nr[r],e?u.hoverable:"",t??""].filter(Boolean).join(" ");return(0,V.jsx)("div",{className:i,...n,children:o})};P.displayName="Card";var R=require("react");var l={};var b=require("react/jsx-runtime"),sr={sm:l.sizeSm,md:l.sizeMd,lg:l.sizeLg},I=(0,R.forwardRef)(({label:a,error:r,helperText:e,leftIcon:t,rightIcon:o,size:n="md",variant:i="default",className:m,id:k,"aria-describedby":h,...x},w)=>{let E=(0,R.useId)(),S=k??E,W=r?`${S}-error`:void 0,O=e&&!r?`${S}-helper`:void 0,$=h??W??O??void 0,Y=[l.input,sr[n],i==="filled"?l.variantFilled:"",t?l.hasLeftIcon:"",o?l.hasRightIcon:"",r?l.inputError:"",m??""].filter(Boolean).join(" ");return(0,b.jsxs)("div",{className:l.wrapper,children:[a&&(0,b.jsx)("label",{htmlFor:S,className:l.label,children:a}),(0,b.jsxs)("div",{className:l.inputContainer,children:[t&&(0,b.jsx)("span",{className:l.leftIcon,"aria-hidden":"true",children:t}),(0,b.jsx)("input",{ref:w,id:S,className:Y,"aria-invalid":r?!0:void 0,"aria-describedby":$,...x}),o&&(0,b.jsx)("span",{className:l.rightIcon,"aria-hidden":"true",children:o})]}),r&&(0,b.jsx)("p",{id:W,className:l.errorText,role:"alert",children:r}),e&&!r&&(0,b.jsx)("p",{id:O,className:l.helperText,children:e})]})});I.displayName="Input";var X=require("react");var p={};var y=require("react/jsx-runtime"),dr={sm:p.sizeSm,md:p.sizeMd,lg:p.sizeLg},B=({checked:a=!1,onChange:r,size:e="md",label:t,disabled:o=!1,className:n})=>{let i=(0,X.useId)(),m=[p.wrapper,dr[e],o?p.disabled:"",n??""].filter(Boolean).join(" "),k=[p.track,a?p.trackChecked:""].filter(Boolean).join(" "),h=[p.thumb,a?p.thumbChecked:""].filter(Boolean).join(" "),x=w=>{o||r?.(w.target.checked)};return(0,y.jsxs)("label",{className:m,children:[(0,y.jsx)("input",{id:i,type:"checkbox",role:"switch",className:p.input,checked:a,disabled:o,onChange:x,"aria-checked":a}),(0,y.jsx)("span",{className:k,"aria-hidden":"true",children:(0,y.jsx)("span",{className:h})}),t&&(0,y.jsx)("span",{className:p.label,children:t})]})};B.displayName="Toggle";var c={};var M=require("react/jsx-runtime"),pr={sm:c.sizeSm,md:c.sizeMd,lg:c.sizeLg},gr={default:c.variantDefault,primary:c.variantPrimary,success:c.variantSuccess,warning:c.variantWarning,danger:c.variantDanger,info:c.variantInfo},L=({variant:a="default",size:r="md",dot:e=!1,outline:t=!1,className:o,children:n,...i})=>{let m=[c.badge,pr[r],gr[a],t?c.outline:"",o??""].filter(Boolean).join(" ");return(0,M.jsxs)("span",{className:m,...i,children:[e&&(0,M.jsx)("span",{className:`${c.dot} ${c.dotPulse}`,"aria-hidden":"true"}),n]})};L.displayName="Badge";var v={};var f=require("react-icons/fi"),g=require("react/jsx-runtime"),vr={info:v.variantInfo,success:v.variantSuccess,warning:v.variantWarning,danger:v.variantDanger},br={info:(0,g.jsx)(f.FiInfo,{}),success:(0,g.jsx)(f.FiCheckCircle,{}),warning:(0,g.jsx)(f.FiAlertTriangle,{}),danger:(0,g.jsx)(f.FiXCircle,{})},T=({variant:a="info",title:r,onClose:e,className:t,children:o,...n})=>{let i=[v.alert,vr[a],t??""].filter(Boolean).join(" ");return(0,g.jsxs)("div",{className:i,role:"alert",...n,children:[(0,g.jsx)("span",{className:v.icon,"aria-hidden":"true",children:br[a]}),(0,g.jsxs)("div",{className:v.content,children:[r&&(0,g.jsx)("h5",{className:v.title,children:r}),o&&(0,g.jsx)("div",{className:v.description,children:o})]}),e&&(0,g.jsx)("button",{type:"button",className:v.closeButton,onClick:e,"aria-label":"Dismiss alert",children:"\u2715"})]})};T.displayName="Alert";var G=require("react");var d={};var z=require("react/jsx-runtime"),fr={xs:d.sizeXs,sm:d.sizeSm,md:d.sizeMd,lg:d.sizeLg,xl:d.sizeXl},kr={circle:d.shapeCircle,square:d.shapeSquare},hr={online:d.statusOnline,offline:d.statusOffline,away:d.statusAway,busy:d.statusBusy},A=({src:a,alt:r="",fallback:e,size:t="md",shape:o="circle",status:n,className:i,...m})=>{let[k,h]=(0,G.useState)(!1),x=[d.avatar,fr[t],kr[o],i??""].filter(Boolean).join(" ");return(0,z.jsxs)("div",{className:x,...m,children:[a&&!k?(0,z.jsx)("img",{src:a,alt:r,className:d.image,onError:()=>h(!0)}):(0,z.jsx)("span",{className:d.fallback,children:e}),n&&(0,z.jsx)("span",{className:`${d.statusDot} ${hr[n]}`,"aria-label":n,role:"status"})]})};A.displayName="Avatar";var N={};var F=require("react/jsx-runtime"),qr={sm:N.sizeSm,md:N.sizeMd,lg:N.sizeLg},D=({size:a="md",color:r,style:e,className:t,...o})=>{let n=[N.spinner,qr[a],t??""].filter(Boolean).join(" "),i={...e,...r?{borderTopColor:r}:{}};return(0,F.jsx)("span",{className:n,style:i,role:"status",...o,children:(0,F.jsx)("span",{className:N.srOnly,children:"Loading..."})})};D.displayName="Spinner";0&&(module.exports={Alert,Avatar,Badge,Button,Card,Input,Spinner,Toggle});
1
+ "use strict";var F=Object.defineProperty;var J=Object.getOwnPropertyDescriptor;var U=Object.getOwnPropertyNames;var K=Object.prototype.hasOwnProperty;var Q=(a,r)=>{for(var e in r)F(a,e,{get:r[e],enumerable:!0})},Z=(a,r,e,t)=>{if(r&&typeof r=="object"||typeof r=="function")for(let o of U(r))!K.call(a,o)&&o!==e&&F(a,o,{get:()=>r[o],enumerable:!(t=J(r,o))||t.enumerable});return a};var _=a=>Z(F({},"__esModule",{value:!0}),a);var yr={};Q(yr,{Alert:()=>M,Avatar:()=>A,Badge:()=>L,Button:()=>C,Card:()=>P,Input:()=>B,Spinner:()=>D,Toggle:()=>I});module.exports=_(yr);var j=require("react");var s={};var x=require("react/jsx-runtime"),ar={sm:s.sizeSm,md:s.sizeMd,lg:s.sizeLg},er={primary:s.variantPrimary,secondary:s.variantSecondary,outline:s.variantOutline,ghost:s.variantGhost,danger:s.variantDanger},C=(0,j.forwardRef)(({variant:a="primary",size:r="md",isLoading:e=!1,leftIcon:t,rightIcon:o,fullWidth:n=!1,disabled:i,className:f,children:q,type:v="button",...h},w)=>{let E=[s.button,ar[r],er[a],n?s.fullWidth:"",e?s.loading:"",f??""].filter(Boolean).join(" ");return(0,x.jsxs)("button",{ref:w,type:v,className:E,disabled:i||e,"aria-busy":e||void 0,"aria-disabled":i||e||void 0,...h,children:[e&&(0,x.jsx)("span",{className:s.spinnerWrapper,"aria-hidden":"true",children:(0,x.jsx)("span",{className:s.spinner})}),t&&(0,x.jsx)("span",{className:s.iconLeft,children:t}),q,o&&(0,x.jsx)("span",{className:s.iconRight,children:o})]})});C.displayName="Button";var k={};var V=require("react/jsx-runtime"),tr={default:k.variantDefault,outlined:k.variantOutlined,elevated:k.variantElevated,glass:k.variantGlass},nr={none:k.paddingNone,sm:k.paddingSm,md:k.paddingMd,lg:k.paddingLg},P=({variant:a="default",padding:r="md",hoverable:e=!1,className:t,children:o,...n})=>{let i=[k.card,tr[a],nr[r],e?k.hoverable:"",t??""].filter(Boolean).join(" ");return(0,V.jsx)("div",{className:i,...n,children:o})};P.displayName="Card";var R=require("react");var l={};var b=require("react/jsx-runtime"),sr={sm:l.sizeSm,md:l.sizeMd,lg:l.sizeLg},B=(0,R.forwardRef)(({label:a,error:r,helperText:e,leftIcon:t,rightIcon:o,size:n="md",variant:i="default",className:f,id:q,"aria-describedby":v,...h},w)=>{let E=(0,R.useId)(),S=q??E,W=r?`${S}-error`:void 0,O=e&&!r?`${S}-helper`:void 0,$=v??W??O??void 0,Y=[l.input,sr[n],i==="filled"?l.variantFilled:"",t?l.hasLeftIcon:"",o?l.hasRightIcon:"",r?l.inputError:"",f??""].filter(Boolean).join(" ");return(0,b.jsxs)("div",{className:l.wrapper,children:[a&&(0,b.jsx)("label",{htmlFor:S,className:l.label,children:a}),(0,b.jsxs)("div",{className:l.inputContainer,children:[t&&(0,b.jsx)("span",{className:l.leftIcon,"aria-hidden":"true",children:t}),(0,b.jsx)("input",{ref:w,id:S,className:Y,"aria-invalid":r?!0:void 0,"aria-describedby":$,...h}),o&&(0,b.jsx)("span",{className:l.rightIcon,"aria-hidden":"true",children:o})]}),r&&(0,b.jsx)("p",{id:W,className:l.errorText,role:"alert",children:r}),e&&!r&&(0,b.jsx)("p",{id:O,className:l.helperText,children:e})]})});B.displayName="Input";var X=require("react");var p={};var y=require("react/jsx-runtime"),cr={sm:p.sizeSm,md:p.sizeMd,lg:p.sizeLg},I=({checked:a=!1,onChange:r,size:e="md",label:t,disabled:o=!1,className:n})=>{let i=(0,X.useId)(),f=[p.wrapper,cr[e],o?p.disabled:"",n??""].filter(Boolean).join(" "),q=[p.track,a?p.trackChecked:""].filter(Boolean).join(" "),v=[p.thumb,a?p.thumbChecked:""].filter(Boolean).join(" "),h=w=>{o||r?.(w.target.checked)};return(0,y.jsxs)("label",{className:f,children:[(0,y.jsx)("input",{id:i,type:"checkbox",role:"switch",className:p.input,checked:a,disabled:o,onChange:h,"aria-checked":a}),(0,y.jsx)("span",{className:q,"aria-hidden":"true",children:(0,y.jsx)("span",{className:v})}),t&&(0,y.jsx)("span",{className:p.label,children:t})]})};I.displayName="Toggle";var d={};var T=require("react/jsx-runtime"),pr={sm:d.sizeSm,md:d.sizeMd,lg:d.sizeLg},gr={default:d.variantDefault,primary:d.variantPrimary,success:d.variantSuccess,warning:d.variantWarning,danger:d.variantDanger,info:d.variantInfo},L=({variant:a="default",size:r="md",dot:e=!1,outline:t=!1,className:o,children:n,...i})=>{let f=[d.badge,pr[r],gr[a],t?d.outline:"",o??""].filter(Boolean).join(" ");return(0,T.jsxs)("span",{className:f,...i,children:[e&&(0,T.jsx)("span",{className:`${d.dot} ${d.dotPulse}`,"aria-hidden":"true"}),n]})};L.displayName="Badge";var u={};var m=require("react-icons/fi"),g=require("react/jsx-runtime"),ur={info:u.variantInfo,success:u.variantSuccess,warning:u.variantWarning,danger:u.variantDanger},br={info:(0,g.jsx)(m.FiInfo,{}),success:(0,g.jsx)(m.FiCheckCircle,{}),warning:(0,g.jsx)(m.FiAlertTriangle,{}),danger:(0,g.jsx)(m.FiXCircle,{})},M=({variant:a="info",title:r,onClose:e,className:t,children:o,...n})=>{let i=[u.alert,ur[a],t??""].filter(Boolean).join(" ");return(0,g.jsxs)("div",{className:i,role:"alert",...n,children:[(0,g.jsx)("span",{className:u.icon,"aria-hidden":"true",children:br[a]}),(0,g.jsxs)("div",{className:u.content,children:[r&&(0,g.jsx)("h5",{className:u.title,children:r}),o&&(0,g.jsx)("div",{className:u.description,children:o})]}),e&&(0,g.jsx)("button",{type:"button",className:u.closeButton,onClick:e,"aria-label":"Dismiss alert",children:"\u2715"})]})};M.displayName="Alert";var G=require("react");var c={};var z=require("react/jsx-runtime"),mr={xs:c.sizeXs,sm:c.sizeSm,md:c.sizeMd,lg:c.sizeLg,xl:c.sizeXl},qr={circle:c.shapeCircle,square:c.shapeSquare},vr={online:c.statusOnline,offline:c.statusOffline,away:c.statusAway,busy:c.statusBusy},A=({src:a,alt:r="",fallback:e,size:t="md",shape:o="circle",status:n,className:i,...f})=>{let[q,v]=(0,G.useState)(!1),h=[c.avatar,mr[t],qr[o],i??""].filter(Boolean).join(" ");return(0,z.jsxs)("div",{className:h,...f,children:[a&&!q?(0,z.jsx)("img",{src:a,alt:r,className:c.image,onError:()=>v(!0)}):(0,z.jsx)("span",{className:c.fallback,children:e}),n&&(0,z.jsx)("span",{className:`${c.statusDot} ${vr[n]}`,"aria-label":n,role:"status"})]})};A.displayName="Avatar";var N={};var H=require("react/jsx-runtime"),xr={sm:N.sizeSm,md:N.sizeMd,lg:N.sizeLg},D=({size:a="md",color:r,style:e,className:t,...o})=>{let n=[N.spinner,xr[a],t??""].filter(Boolean).join(" "),i={...e,...r?{borderTopColor:r}:{}};return(0,H.jsx)("span",{className:n,style:i,role:"status",...o,children:(0,H.jsx)("span",{className:N.srOnly,children:"Loading..."})})};D.displayName="Spinner";0&&(module.exports={Alert,Avatar,Badge,Button,Card,Input,Spinner,Toggle});
package/dist/index.css CHANGED
@@ -1 +1 @@
1
- .button{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--qk-space-2);border:1px solid transparent;font-family:var(--qk-font-sans);font-weight:var(--qk-font-semibold);line-height:var(--qk-leading-tight);letter-spacing:var(--qk-tracking-wide);cursor:pointer;user-select:none;white-space:nowrap;text-decoration:none;outline:none;transition-property:background-color,border-color,color,box-shadow,transform,opacity;transition-duration:.25s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.button:active:not(:disabled){transform:scale(.97)}.button:focus-visible{box-shadow:0 0 0 var(--qk-focus-ring-offset) var(--qk-bg-app),0 0 0 calc(var(--qk-focus-ring-offset) + var(--qk-focus-ring-width)) var(--qk-focus-ring-color)}.button:disabled{opacity:.5;cursor:not-allowed;transform:none}.sizeSm{height:32px;padding:0 var(--qk-space-3);font-size:var(--qk-text-xs);border-radius:var(--qk-radius-sm);gap:var(--qk-space-1-5)}.sizeMd{height:40px;padding:0 var(--qk-space-5);font-size:var(--qk-text-sm);border-radius:var(--qk-radius-md);gap:var(--qk-space-2)}.sizeLg{height:48px;padding:0 var(--qk-space-7);font-size:var(--qk-text-base);border-radius:var(--qk-radius-md);gap:var(--qk-space-2-5)}.variantPrimary{background:linear-gradient(135deg,var(--qk-color-primary-600),var(--qk-color-primary-500));color:#fff;border-color:#8b5cf633;box-shadow:var(--qk-shadow-sm)}.variantPrimary:hover:not(:disabled){background:linear-gradient(135deg,var(--qk-color-primary-500),var(--qk-color-primary-400));box-shadow:var(--qk-shadow-glow)}.variantSecondary{background-color:var(--qk-bg-surface-2);color:var(--qk-text-2);border-color:var(--qk-border-color)}.variantSecondary:hover:not(:disabled){background-color:var(--qk-bg-surface-3);color:var(--qk-text-1);border-color:var(--qk-border-color-hover)}.variantOutline{background-color:transparent;color:var(--qk-btn-outline-text);border-color:var(--qk-btn-outline-border)}.variantOutline:hover:not(:disabled){background-color:var(--qk-btn-outline-hover-bg);color:var(--qk-btn-outline-text);border-color:var(--qk-btn-outline-border)}.variantGhost{background-color:transparent;color:var(--qk-btn-outline-text);border-color:transparent}.variantGhost:hover:not(:disabled){background-color:var(--qk-btn-outline-hover-bg);color:var(--qk-btn-outline-text)}.variantDanger{background:linear-gradient(135deg,var(--qk-color-danger-600),var(--qk-color-danger-500));color:#fff;border-color:#f43f5e33;box-shadow:var(--qk-shadow-sm)}.variantDanger:hover:not(:disabled){background:linear-gradient(135deg,var(--qk-color-danger-500),var(--qk-color-danger-400));box-shadow:0 0 20px #f43f5e4d}.fullWidth{width:100%}.loading{color:transparent;pointer-events:none}.spinnerWrapper{position:absolute;display:flex;align-items:center;justify-content:center}.spinner{width:18px;height:18px;border:2px solid rgba(255,255,255,.25);border-top-color:currentColor;border-radius:50%;color:#fff;animation:qk-spin .6s linear infinite}@keyframes qk-spin{to{transform:rotate(360deg)}}.iconLeft,.iconRight{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.iconLeft{margin-right:calc(-1 * var(--qk-space-1))}.iconRight{margin-left:calc(-1 * var(--qk-space-1))}.card{font-family:var(--qk-font-sans);color:var(--qk-text-2);border-radius:var(--qk-radius-lg);transition-property:transform,box-shadow,border-color,background-color;transition-duration:.25s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.variantDefault{background-color:var(--qk-bg-surface-1);border:1px solid var(--qk-border-color)}.variantOutlined{background-color:transparent;border:1px solid var(--qk-border-color-hover)}.variantElevated{background-color:var(--qk-bg-surface-2);border:1px solid var(--qk-border-color-hover);box-shadow:var(--qk-shadow-card)}.variantGlass{background:var(--qk-bg-glass);border:1px solid var(--qk-border-glass);-webkit-backdrop-filter:blur(16px) saturate(180%);backdrop-filter:blur(16px) saturate(180%)}.paddingNone{padding:0}.paddingSm{padding:var(--qk-space-4)}.paddingMd{padding:var(--qk-space-6)}.paddingLg{padding:var(--qk-space-8)}.hoverable{cursor:pointer}.hoverable:hover{transform:translateY(-2px);box-shadow:var(--qk-shadow-card-hover, var(--qk-shadow-card));border-color:var(--qk-border-color-active)}.hoverable.variantGlass:hover{border-color:var(--qk-border-color-active);background-color:var(--qk-bg-glass);opacity:.9}.hoverable:active{transform:translateY(0)}.wrapper{position:relative;display:flex;flex-direction:column;gap:var(--qk-space-1-5);width:100%}.inputContainer{position:relative;display:flex;align-items:center;width:100%}.input{width:100%;font-family:var(--qk-font-sans);color:var(--qk-text-1);background-color:var(--qk-bg-surface-1);border:1px solid var(--qk-border-color);outline:none;transition-property:border-color,box-shadow,background-color;transition-duration:.25s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.input::placeholder{color:var(--qk-text-muted);transition:opacity var(--qk-transition-fast)}.input:hover:not(:disabled):not(:focus){border-color:var(--qk-border-color-hover);background-color:var(--qk-bg-surface-2)}.input:focus{border-color:var(--qk-color-primary-500);box-shadow:0 0 0 3px #8b5cf626;background-color:var(--qk-bg-surface-1)}.input:disabled{opacity:.5;cursor:not-allowed;background-color:var(--qk-bg-surface-3)}.variantFilled{background-color:var(--qk-bg-surface-2);border-color:transparent}.variantFilled:hover:not(:disabled):not(:focus){background-color:var(--qk-bg-surface-3)}.variantFilled:focus{background-color:var(--qk-bg-surface-2);border-color:var(--qk-color-primary-500)}.sizeSm{height:32px;padding:0 var(--qk-space-3);font-size:var(--qk-text-xs);border-radius:var(--qk-radius-sm)}.sizeMd{height:40px;padding:0 var(--qk-space-4);font-size:var(--qk-text-sm);border-radius:var(--qk-radius-md)}.sizeLg{height:48px;padding:0 var(--qk-space-5);font-size:var(--qk-text-base);border-radius:var(--qk-radius-md)}.hasLeftIcon{padding-left:var(--qk-space-10)}.hasRightIcon{padding-right:var(--qk-space-10)}.sizeSm.hasLeftIcon{padding-left:var(--qk-space-8)}.sizeSm.hasRightIcon{padding-right:var(--qk-space-8)}.leftIcon,.rightIcon{position:absolute;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;color:var(--qk-text-3);pointer-events:none;transition:color var(--qk-transition-fast)}.leftIcon{left:var(--qk-space-3)}.rightIcon{right:var(--qk-space-3)}.label{font-family:var(--qk-font-sans);font-size:var(--qk-text-sm);font-weight:var(--qk-font-medium);color:var(--qk-text-2);transition:color var(--qk-transition-fast)}.wrapper:focus-within .label{color:var(--qk-theme-primary)}.helperText{font-family:var(--qk-font-sans);font-size:var(--qk-text-xs);color:var(--qk-text-muted);margin:0;line-height:var(--qk-leading-normal)}.errorText{font-family:var(--qk-font-sans);font-size:var(--qk-text-xs);color:var(--qk-theme-danger);margin:0;line-height:var(--qk-leading-normal)}.inputError{border-color:var(--qk-color-danger-500)}.inputError:focus{border-color:var(--qk-color-danger-400);box-shadow:0 0 0 3px #f43f5e26}.wrapper:has(.inputError) .label{color:var(--qk-theme-danger)}.wrapper:has(.inputError) .leftIcon,.wrapper:has(.inputError) .rightIcon{color:var(--qk-theme-danger)}.wrapper{display:inline-flex;align-items:center;gap:var(--qk-space-3);cursor:pointer;user-select:none}.wrapper.disabled{opacity:.5;cursor:not-allowed}.input{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.track{position:relative;display:inline-flex;align-items:center;flex-shrink:0;border-radius:var(--qk-radius-full);background-color:var(--qk-bg-surface-3);border:1px solid var(--qk-border-color-hover);transition-property:background-color,border-color,box-shadow;transition-duration:.25s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.track:hover:not(.disabled *){background-color:var(--qk-border-color-active)}.trackChecked{background-color:var(--qk-color-primary-600);border-color:var(--qk-color-primary-500)}.trackChecked:hover{background-color:var(--qk-color-primary-500)}.input:focus-visible+.track{box-shadow:0 0 0 var(--qk-focus-ring-offset) var(--qk-bg-app),0 0 0 calc(var(--qk-focus-ring-offset) + var(--qk-focus-ring-width)) var(--qk-focus-ring-color)}.trackChecked{box-shadow:0 0 12px #7c3aed40}.thumb{position:absolute;border-radius:50%;background-color:#fff;box-shadow:var(--qk-shadow-sm);transition-property:transform,width;transition-duration:.25s;transition-timing-function:cubic-bezier(.34,1.56,.64,1)}.sizeSm .track{width:32px;height:18px}.sizeSm .thumb{width:14px;height:14px;left:2px;top:1px}.sizeSm .thumbChecked{transform:translate(14px)}.sizeMd .track{width:44px;height:24px}.sizeMd .thumb{width:18px;height:18px;left:3px;top:2px}.sizeMd .thumbChecked{transform:translate(20px)}.sizeLg .track{width:56px;height:30px}.sizeLg .thumb{width:24px;height:24px;left:3px;top:2px}.sizeLg .thumbChecked{transform:translate(26px)}.label{font-family:var(--qk-font-sans);font-size:var(--qk-text-sm);font-weight:var(--qk-font-medium);color:var(--qk-text-2);line-height:var(--qk-leading-normal)}.sizeSm .label{font-size:var(--qk-text-xs)}.sizeLg .label{font-size:var(--qk-text-base)}.badge{display:inline-flex;align-items:center;gap:var(--qk-space-1-5);font-family:var(--qk-font-sans);font-weight:var(--qk-font-medium);line-height:var(--qk-leading-none);white-space:nowrap;border-radius:var(--qk-radius-full);border:1px solid transparent;transition-property:background-color,color,border-color;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.sizeSm{height:20px;padding:0 var(--qk-space-2);font-size:.6875rem}.sizeMd{height:24px;padding:0 var(--qk-space-2-5);font-size:var(--qk-text-xs)}.sizeLg{height:28px;padding:0 var(--qk-space-3);font-size:var(--qk-text-sm)}.variantDefault{background-color:var(--qk-bg-surface-2);color:var(--qk-text-2);border-color:var(--qk-border-color)}.variantPrimary{background-color:#8b5cf626;color:var(--qk-theme-primary)}.variantSuccess{background-color:#10b98126;color:var(--qk-theme-success)}.variantWarning{background-color:#f59e0b26;color:var(--qk-theme-warning)}.variantDanger{background-color:#f43f5e26;color:var(--qk-theme-danger)}.variantInfo{background-color:#0ea5e926;color:var(--qk-theme-info)}.outline.variantDefault{background-color:transparent;border-color:var(--qk-border-color-hover)}.outline.variantPrimary{background-color:transparent;border-color:var(--qk-color-primary-500)}.outline.variantSuccess{background-color:transparent;border-color:var(--qk-color-success-500)}.outline.variantWarning{background-color:transparent;border-color:var(--qk-color-warning-500)}.outline.variantDanger{background-color:transparent;border-color:var(--qk-color-danger-500)}.outline.variantInfo{background-color:transparent;border-color:var(--qk-color-info-500)}.dot{position:relative;width:6px;height:6px;border-radius:50%;flex-shrink:0}.sizeLg .dot{width:8px;height:8px}.variantDefault .dot{background-color:var(--qk-color-neutral-400)}.variantPrimary .dot{background-color:var(--qk-theme-primary)}.variantSuccess .dot{background-color:var(--qk-theme-success)}.variantWarning .dot{background-color:var(--qk-theme-warning)}.variantDanger .dot{background-color:var(--qk-theme-danger)}.variantInfo .dot{background-color:var(--qk-theme-info)}.dotPulse{animation:badgePulse 2s ease-in-out infinite}@keyframes badgePulse{0%,to{opacity:1}50%{opacity:.4}}.alert{display:flex;align-items:flex-start;gap:var(--qk-space-3);padding:var(--qk-space-4) var(--qk-space-5);border-radius:var(--qk-radius-md);border:1px solid transparent;font-family:var(--qk-font-sans);font-size:var(--qk-text-sm);line-height:var(--qk-leading-normal);position:relative;transition:all var(--qk-transition-normal)}.icon{display:flex;align-items:center;justify-content:center;user-select:none;flex-shrink:0;margin-top:2px}.icon svg{width:18px;height:18px;display:block}.content{flex:1}.title{font-weight:var(--qk-font-semibold);color:var(--qk-text-1);margin:0 0 var(--qk-space-1) 0;font-size:var(--qk-text-sm)}.description{color:var(--qk-text-2)}.alert:has(.description) .title{margin-bottom:var(--qk-space-1)}.alert:not(:has(.description)) .title{margin-bottom:0}.closeButton{background:transparent;border:none;color:var(--qk-text-muted);cursor:pointer;padding:var(--qk-space-1);font-size:var(--qk-text-xs);line-height:1;border-radius:var(--qk-radius-sm);display:flex;align-items:center;justify-content:center;transition:all var(--qk-transition-fast);margin-top:1px;margin-right:-4px}.closeButton:hover{background-color:#ffffff14;color:var(--qk-text-1)}.variantInfo{background-color:#0ea5e914;border-color:#0ea5e933;color:var(--qk-theme-info)}.variantInfo .closeButton:hover{background-color:#0ea5e926}.variantSuccess{background-color:#10b98114;border-color:#10b98133;color:var(--qk-theme-success)}.variantSuccess .closeButton:hover{background-color:#10b98126}.variantWarning{background-color:#f59e0b14;border-color:#f59e0b33;color:var(--qk-theme-warning)}.variantWarning .closeButton:hover{background-color:#f59e0b26}.variantDanger{background-color:#f43f5e14;border-color:#f43f5e33;color:var(--qk-theme-danger)}.variantDanger .closeButton:hover{background-color:#f43f5e26}.avatar{position:relative;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--qk-color-primary-600) 0%,var(--qk-color-primary-400) 100%);color:#fff;font-family:var(--qk-font-sans);font-weight:var(--qk-font-semibold);user-select:none;flex-shrink:0}.image{width:100%;height:100%;object-fit:cover;border-radius:inherit}.fallback{text-transform:uppercase;line-height:1}.shapeCircle{border-radius:var(--qk-radius-full)}.shapeSquare{border-radius:var(--qk-radius-md)}.sizeXs{width:24px;height:24px;font-size:10px}.sizeSm{width:32px;height:32px;font-size:var(--qk-text-xs)}.sizeMd{width:40px;height:40px;font-size:var(--qk-text-sm)}.sizeLg{width:48px;height:48px;font-size:var(--qk-text-base)}.sizeXl{width:64px;height:64px;font-size:var(--qk-text-xl)}.statusDot{position:absolute;bottom:0;right:0;display:block;border-radius:var(--qk-radius-full);border:2px solid var(--qk-bg-surface-1);background-color:var(--qk-text-muted)}.sizeXs .statusDot{width:7px;height:7px;border-width:1px}.sizeSm .statusDot{width:9px;height:9px}.sizeMd .statusDot{width:11px;height:11px}.sizeLg .statusDot{width:13px;height:13px}.sizeXl .statusDot{width:16px;height:16px}.statusOnline{background-color:var(--qk-color-success-500);box-shadow:0 0 6px #10b98166}.statusOffline{background-color:var(--qk-color-neutral-500)}.statusAway{background-color:var(--qk-color-warning-500);box-shadow:0 0 6px #f59e0b66}.statusBusy{background-color:var(--qk-color-danger-500);box-shadow:0 0 6px #f43f5e66}.spinner{display:inline-block;border-style:solid;border-radius:50%;border-color:#8b5cf626;border-top-color:var(--qk-color-primary-500);animation:qk-spin .8s linear infinite}.sizeSm{width:16px;height:16px;border-width:2px}.sizeMd{width:24px;height:24px;border-width:2.5px}.sizeLg{width:36px;height:36px;border-width:3.5px}.srOnly{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
1
+ @import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap";:root{--qk-color-primary-50: #f5f3ff;--qk-color-primary-100: #ede9fe;--qk-color-primary-200: #ddd6fe;--qk-color-primary-300: #c4b5fd;--qk-color-primary-400: #a78bfa;--qk-color-primary-500: #8b5cf6;--qk-color-primary-600: #7c3aed;--qk-color-primary-700: #6d28d9;--qk-color-primary-800: #5b21b6;--qk-color-primary-900: #4c1d95;--qk-color-neutral-0: #ffffff;--qk-color-neutral-50: #fafafa;--qk-color-neutral-100: #f4f4f5;--qk-color-neutral-200: #e4e4e7;--qk-color-neutral-300: #d4d4d8;--qk-color-neutral-400: #a1a1aa;--qk-color-neutral-500: #71717a;--qk-color-neutral-600: #52525b;--qk-color-neutral-700: #3f3f46;--qk-color-neutral-800: #27272a;--qk-color-neutral-900: #18181b;--qk-color-neutral-950: #09090b;--qk-color-success-50: #ecfdf5;--qk-color-success-100: #d1fae5;--qk-color-success-400: #34d399;--qk-color-success-500: #10b981;--qk-color-success-600: #059669;--qk-color-success-700: #047857;--qk-color-warning-50: #fffbeb;--qk-color-warning-100: #fef3c7;--qk-color-warning-400: #fbbf24;--qk-color-warning-500: #f59e0b;--qk-color-warning-600: #d97706;--qk-color-warning-700: #b45309;--qk-color-danger-50: #fff1f2;--qk-color-danger-100: #ffe4e6;--qk-color-danger-400: #fb7185;--qk-color-danger-500: #f43f5e;--qk-color-danger-600: #e11d48;--qk-color-danger-700: #be123c;--qk-color-info-50: #f0f9ff;--qk-color-info-100: #e0f2fe;--qk-color-info-400: #38bdf8;--qk-color-info-500: #0ea5e9;--qk-color-info-600: #0284c7;--qk-color-info-700: #0369a1;--qk-space-0: 0px;--qk-space-0-5: 2px;--qk-space-1: 4px;--qk-space-1-5: 6px;--qk-space-2: 8px;--qk-space-2-5: 10px;--qk-space-3: 12px;--qk-space-3-5: 14px;--qk-space-4: 16px;--qk-space-5: 20px;--qk-space-6: 24px;--qk-space-7: 28px;--qk-space-8: 32px;--qk-space-9: 36px;--qk-space-10: 40px;--qk-space-12: 48px;--qk-space-14: 56px;--qk-space-16: 64px;--qk-radius-xs: 4px;--qk-radius-sm: 6px;--qk-radius-md: 10px;--qk-radius-lg: 16px;--qk-radius-xl: 24px;--qk-radius-2xl: 32px;--qk-radius-full: 9999px;--qk-font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--qk-font-mono: "JetBrains Mono", "Fira Code", monospace;--qk-text-xs: .75rem;--qk-text-sm: .875rem;--qk-text-base: 1rem;--qk-text-lg: 1.125rem;--qk-text-xl: 1.25rem;--qk-text-2xl: 1.5rem;--qk-text-3xl: 1.875rem;--qk-text-4xl: 2.25rem;--qk-font-light: 300;--qk-font-normal: 400;--qk-font-medium: 500;--qk-font-semibold: 600;--qk-font-bold: 700;--qk-leading-none: 1;--qk-leading-tight: 1.25;--qk-leading-snug: 1.375;--qk-leading-normal: 1.5;--qk-leading-relaxed: 1.75;--qk-tracking-tight: -.025em;--qk-tracking-normal: 0em;--qk-tracking-wide: .025em;--qk-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, .05);--qk-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, .1);--qk-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .15);--qk-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .2);--qk-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .25);--qk-shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, .4);--qk-shadow-glow: 0 0 20px rgba(124, 58, 237, .3);--qk-shadow-glow-lg: 0 0 40px rgba(124, 58, 237, .4);--qk-shadow-inner: inset 0 2px 4px 0 rgba(0, 0, 0, .1);--qk-transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--qk-transition-normal: .25s cubic-bezier(.4, 0, .2, 1);--qk-transition-slow: .35s cubic-bezier(.4, 0, .2, 1);--qk-ease-in: cubic-bezier(.4, 0, 1, 1);--qk-ease-out: cubic-bezier(0, 0, .2, 1);--qk-ease-in-out: cubic-bezier(.4, 0, .2, 1);--qk-ease-bounce: cubic-bezier(.34, 1.56, .64, 1);--qk-focus-ring-width: 2px;--qk-focus-ring-offset: 2px;--qk-focus-ring-color: rgba(139, 92, 246, .5);--qk-z-dropdown: 1000;--qk-z-sticky: 1100;--qk-z-overlay: 1300;--qk-z-modal: 1400;--qk-z-popover: 1500;--qk-z-tooltip: 1800;--qk-bg-app: var(--qk-color-neutral-950);--qk-bg-sidebar: #0f0f14;--qk-bg-surface-1: var(--qk-color-neutral-900);--qk-bg-surface-2: var(--qk-color-neutral-800);--qk-bg-surface-3: var(--qk-color-neutral-700);--qk-text-1: var(--qk-color-neutral-100);--qk-text-2: var(--qk-color-neutral-300);--qk-text-3: var(--qk-color-neutral-400);--qk-text-muted: var(--qk-color-neutral-500);--qk-border-color: var(--qk-color-neutral-800);--qk-border-color-hover: var(--qk-color-neutral-700);--qk-border-color-active: var(--qk-color-neutral-600);--qk-shadow-card: var(--qk-shadow-lg);--qk-shadow-app: 0 4px 20px rgba(0, 0, 0, .4);--qk-bg-glass: rgba(24, 24, 27, .6);--qk-border-glass: rgba(255, 255, 255, .08);--qk-theme-primary: var(--qk-color-primary-400);--qk-theme-success: var(--qk-color-success-400);--qk-theme-warning: var(--qk-color-warning-400);--qk-theme-danger: var(--qk-color-danger-400);--qk-theme-info: var(--qk-color-info-400);--qk-btn-outline-text: var(--qk-color-primary-400);--qk-btn-outline-border: var(--qk-color-primary-500);--qk-btn-outline-hover-bg: rgba(124, 58, 237, .1);--qk-sidebar-active-text: #e9d5ff;--qk-sidebar-active-bg: rgba(124, 58, 237, .1);--qk-sidebar-hover-text: var(--qk-color-primary-300);--qk-sidebar-hover-bg: rgba(124, 58, 237, .08);--qk-shadow-card-hover: var(--qk-shadow-xl)}:root[data-theme=light],[data-theme=light]{--qk-bg-app: #f4f4f5;--qk-bg-sidebar: #ffffff;--qk-bg-surface-1: #ffffff;--qk-bg-surface-2: #e4e4e7;--qk-bg-surface-3: #d4d4d8;--qk-text-1: #09090b;--qk-text-2: #27272a;--qk-text-3: #52525b;--qk-text-muted: #71717a;--qk-border-color: #e4e4e7;--qk-border-color-hover: #d4d4d8;--qk-border-color-active: #a1a1aa;--qk-shadow-card: var(--qk-shadow-sm);--qk-shadow-app: 0 4px 12px rgba(9, 9, 11, .05);--qk-bg-glass: rgba(255, 255, 255, .6);--qk-border-glass: rgba(9, 9, 11, .08);--qk-theme-primary: var(--qk-color-primary-700);--qk-theme-success: var(--qk-color-success-700);--qk-theme-warning: var(--qk-color-warning-700);--qk-theme-danger: var(--qk-color-danger-700);--qk-theme-info: var(--qk-color-info-700);--qk-btn-outline-text: var(--qk-color-primary-600);--qk-btn-outline-border: var(--qk-color-primary-600);--qk-btn-outline-hover-bg: rgba(124, 58, 237, .08);--qk-sidebar-active-text: var(--qk-color-primary-600);--qk-sidebar-active-bg: rgba(124, 58, 237, .08);--qk-sidebar-hover-text: var(--qk-color-primary-700);--qk-sidebar-hover-bg: rgba(124, 58, 237, .05);--qk-shadow-card-hover: 0 12px 24px -8px rgba(9, 9, 11, .12), 0 4px 6px -2px rgba(9, 9, 11, .04)}*,*:before,*:after{box-sizing:border-box}@keyframes qk-pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes qk-ping{75%,to{transform:scale(2);opacity:0}}@keyframes qk-fade-in{0%{opacity:0}to{opacity:1}}@keyframes qk-slide-up{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes qk-scale-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.button{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--qk-space-2);border:1px solid transparent;font-family:var(--qk-font-sans);font-weight:var(--qk-font-semibold);line-height:var(--qk-leading-tight);letter-spacing:var(--qk-tracking-wide);cursor:pointer;user-select:none;white-space:nowrap;text-decoration:none;outline:none;transition-property:background-color,border-color,color,box-shadow,transform,opacity;transition-duration:.25s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.button:active:not(:disabled){transform:scale(.97)}.button:focus-visible{box-shadow:0 0 0 var(--qk-focus-ring-offset) var(--qk-bg-app),0 0 0 calc(var(--qk-focus-ring-offset) + var(--qk-focus-ring-width)) var(--qk-focus-ring-color)}.button:disabled{opacity:.5;cursor:not-allowed;transform:none}.sizeSm{height:32px;padding:0 var(--qk-space-3);font-size:var(--qk-text-xs);border-radius:var(--qk-radius-sm);gap:var(--qk-space-1-5)}.sizeMd{height:40px;padding:0 var(--qk-space-5);font-size:var(--qk-text-sm);border-radius:var(--qk-radius-md);gap:var(--qk-space-2)}.sizeLg{height:48px;padding:0 var(--qk-space-7);font-size:var(--qk-text-base);border-radius:var(--qk-radius-md);gap:var(--qk-space-2-5)}.variantPrimary{background:linear-gradient(135deg,var(--qk-color-primary-600),var(--qk-color-primary-500));color:#fff;border-color:#8b5cf633;box-shadow:var(--qk-shadow-sm)}.variantPrimary:hover:not(:disabled){background:linear-gradient(135deg,var(--qk-color-primary-500),var(--qk-color-primary-400));box-shadow:var(--qk-shadow-glow)}.variantSecondary{background-color:var(--qk-bg-surface-2);color:var(--qk-text-2);border-color:var(--qk-border-color)}.variantSecondary:hover:not(:disabled){background-color:var(--qk-bg-surface-3);color:var(--qk-text-1);border-color:var(--qk-border-color-hover)}.variantOutline{background-color:transparent;color:var(--qk-btn-outline-text);border-color:var(--qk-btn-outline-border)}.variantOutline:hover:not(:disabled){background-color:var(--qk-btn-outline-hover-bg);color:var(--qk-btn-outline-text);border-color:var(--qk-btn-outline-border)}.variantGhost{background-color:transparent;color:var(--qk-btn-outline-text);border-color:transparent}.variantGhost:hover:not(:disabled){background-color:var(--qk-btn-outline-hover-bg);color:var(--qk-btn-outline-text)}.variantDanger{background:linear-gradient(135deg,var(--qk-color-danger-600),var(--qk-color-danger-500));color:#fff;border-color:#f43f5e33;box-shadow:var(--qk-shadow-sm)}.variantDanger:hover:not(:disabled){background:linear-gradient(135deg,var(--qk-color-danger-500),var(--qk-color-danger-400));box-shadow:0 0 20px #f43f5e4d}.fullWidth{width:100%}.loading{color:transparent;pointer-events:none}.spinnerWrapper{position:absolute;display:flex;align-items:center;justify-content:center}.spinner{width:18px;height:18px;border:2px solid rgba(255,255,255,.25);border-top-color:currentColor;border-radius:50%;color:#fff;animation:qk-spin .6s linear infinite}@keyframes qk-spin{to{transform:rotate(360deg)}}.iconLeft,.iconRight{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.iconLeft{margin-right:calc(-1 * var(--qk-space-1))}.iconRight{margin-left:calc(-1 * var(--qk-space-1))}.card{font-family:var(--qk-font-sans);color:var(--qk-text-2);border-radius:var(--qk-radius-lg);transition-property:transform,box-shadow,border-color,background-color;transition-duration:.25s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.variantDefault{background-color:var(--qk-bg-surface-1);border:1px solid var(--qk-border-color)}.variantOutlined{background-color:transparent;border:1px solid var(--qk-border-color-hover)}.variantElevated{background-color:var(--qk-bg-surface-2);border:1px solid var(--qk-border-color-hover);box-shadow:var(--qk-shadow-card)}.variantGlass{background:var(--qk-bg-glass);border:1px solid var(--qk-border-glass);-webkit-backdrop-filter:blur(16px) saturate(180%);backdrop-filter:blur(16px) saturate(180%)}.paddingNone{padding:0}.paddingSm{padding:var(--qk-space-4)}.paddingMd{padding:var(--qk-space-6)}.paddingLg{padding:var(--qk-space-8)}.hoverable{cursor:pointer}.hoverable:hover{transform:translateY(-2px);box-shadow:var(--qk-shadow-card-hover, var(--qk-shadow-card));border-color:var(--qk-border-color-active)}.hoverable.variantGlass:hover{border-color:var(--qk-border-color-active);background-color:var(--qk-bg-glass);opacity:.9}.hoverable:active{transform:translateY(0)}.wrapper{position:relative;display:flex;flex-direction:column;gap:var(--qk-space-1-5);width:100%}.inputContainer{position:relative;display:flex;align-items:center;width:100%}.input{width:100%;font-family:var(--qk-font-sans);color:var(--qk-text-1);background-color:var(--qk-bg-surface-1);border:1px solid var(--qk-border-color);outline:none;transition-property:border-color,box-shadow,background-color;transition-duration:.25s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.input::placeholder{color:var(--qk-text-muted);transition:opacity var(--qk-transition-fast)}.input:hover:not(:disabled):not(:focus){border-color:var(--qk-border-color-hover);background-color:var(--qk-bg-surface-2)}.input:focus{border-color:var(--qk-color-primary-500);box-shadow:0 0 0 3px #8b5cf626;background-color:var(--qk-bg-surface-1)}.input:disabled{opacity:.5;cursor:not-allowed;background-color:var(--qk-bg-surface-3)}.variantFilled{background-color:var(--qk-bg-surface-2);border-color:transparent}.variantFilled:hover:not(:disabled):not(:focus){background-color:var(--qk-bg-surface-3)}.variantFilled:focus{background-color:var(--qk-bg-surface-2);border-color:var(--qk-color-primary-500)}.sizeSm{height:32px;padding:0 var(--qk-space-3);font-size:var(--qk-text-xs);border-radius:var(--qk-radius-sm)}.sizeMd{height:40px;padding:0 var(--qk-space-4);font-size:var(--qk-text-sm);border-radius:var(--qk-radius-md)}.sizeLg{height:48px;padding:0 var(--qk-space-5);font-size:var(--qk-text-base);border-radius:var(--qk-radius-md)}.hasLeftIcon{padding-left:var(--qk-space-10)}.hasRightIcon{padding-right:var(--qk-space-10)}.sizeSm.hasLeftIcon{padding-left:var(--qk-space-8)}.sizeSm.hasRightIcon{padding-right:var(--qk-space-8)}.leftIcon,.rightIcon{position:absolute;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;color:var(--qk-text-3);pointer-events:none;transition:color var(--qk-transition-fast)}.leftIcon{left:var(--qk-space-3)}.rightIcon{right:var(--qk-space-3)}.label{font-family:var(--qk-font-sans);font-size:var(--qk-text-sm);font-weight:var(--qk-font-medium);color:var(--qk-text-2);transition:color var(--qk-transition-fast)}.wrapper:focus-within .label{color:var(--qk-theme-primary)}.helperText{font-family:var(--qk-font-sans);font-size:var(--qk-text-xs);color:var(--qk-text-muted);margin:0;line-height:var(--qk-leading-normal)}.errorText{font-family:var(--qk-font-sans);font-size:var(--qk-text-xs);color:var(--qk-theme-danger);margin:0;line-height:var(--qk-leading-normal)}.inputError{border-color:var(--qk-color-danger-500)}.inputError:focus{border-color:var(--qk-color-danger-400);box-shadow:0 0 0 3px #f43f5e26}.wrapper:has(.inputError) .label{color:var(--qk-theme-danger)}.wrapper:has(.inputError) .leftIcon,.wrapper:has(.inputError) .rightIcon{color:var(--qk-theme-danger)}.wrapper{display:inline-flex;align-items:center;gap:var(--qk-space-3);cursor:pointer;user-select:none}.wrapper.disabled{opacity:.5;cursor:not-allowed}.input{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.track{position:relative;display:inline-flex;align-items:center;flex-shrink:0;border-radius:var(--qk-radius-full);background-color:var(--qk-bg-surface-3);border:1px solid var(--qk-border-color-hover);transition-property:background-color,border-color,box-shadow;transition-duration:.25s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.track:hover:not(.disabled *){background-color:var(--qk-border-color-active)}.trackChecked{background-color:var(--qk-color-primary-600);border-color:var(--qk-color-primary-500)}.trackChecked:hover{background-color:var(--qk-color-primary-500)}.input:focus-visible+.track{box-shadow:0 0 0 var(--qk-focus-ring-offset) var(--qk-bg-app),0 0 0 calc(var(--qk-focus-ring-offset) + var(--qk-focus-ring-width)) var(--qk-focus-ring-color)}.trackChecked{box-shadow:0 0 12px #7c3aed40}.thumb{position:absolute;border-radius:50%;background-color:#fff;box-shadow:var(--qk-shadow-sm);transition-property:transform,width;transition-duration:.25s;transition-timing-function:cubic-bezier(.34,1.56,.64,1)}.sizeSm .track{width:32px;height:18px}.sizeSm .thumb{width:14px;height:14px;left:2px;top:1px}.sizeSm .thumbChecked{transform:translate(14px)}.sizeMd .track{width:44px;height:24px}.sizeMd .thumb{width:18px;height:18px;left:3px;top:2px}.sizeMd .thumbChecked{transform:translate(20px)}.sizeLg .track{width:56px;height:30px}.sizeLg .thumb{width:24px;height:24px;left:3px;top:2px}.sizeLg .thumbChecked{transform:translate(26px)}.label{font-family:var(--qk-font-sans);font-size:var(--qk-text-sm);font-weight:var(--qk-font-medium);color:var(--qk-text-2);line-height:var(--qk-leading-normal)}.sizeSm .label{font-size:var(--qk-text-xs)}.sizeLg .label{font-size:var(--qk-text-base)}.badge{display:inline-flex;align-items:center;gap:var(--qk-space-1-5);font-family:var(--qk-font-sans);font-weight:var(--qk-font-medium);line-height:var(--qk-leading-none);white-space:nowrap;border-radius:var(--qk-radius-full);border:1px solid transparent;transition-property:background-color,color,border-color;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.sizeSm{height:20px;padding:0 var(--qk-space-2);font-size:.6875rem}.sizeMd{height:24px;padding:0 var(--qk-space-2-5);font-size:var(--qk-text-xs)}.sizeLg{height:28px;padding:0 var(--qk-space-3);font-size:var(--qk-text-sm)}.variantDefault{background-color:var(--qk-bg-surface-2);color:var(--qk-text-2);border-color:var(--qk-border-color)}.variantPrimary{background-color:#8b5cf626;color:var(--qk-theme-primary)}.variantSuccess{background-color:#10b98126;color:var(--qk-theme-success)}.variantWarning{background-color:#f59e0b26;color:var(--qk-theme-warning)}.variantDanger{background-color:#f43f5e26;color:var(--qk-theme-danger)}.variantInfo{background-color:#0ea5e926;color:var(--qk-theme-info)}.outline.variantDefault{background-color:transparent;border-color:var(--qk-border-color-hover)}.outline.variantPrimary{background-color:transparent;border-color:var(--qk-color-primary-500)}.outline.variantSuccess{background-color:transparent;border-color:var(--qk-color-success-500)}.outline.variantWarning{background-color:transparent;border-color:var(--qk-color-warning-500)}.outline.variantDanger{background-color:transparent;border-color:var(--qk-color-danger-500)}.outline.variantInfo{background-color:transparent;border-color:var(--qk-color-info-500)}.dot{position:relative;width:6px;height:6px;border-radius:50%;flex-shrink:0}.sizeLg .dot{width:8px;height:8px}.variantDefault .dot{background-color:var(--qk-color-neutral-400)}.variantPrimary .dot{background-color:var(--qk-theme-primary)}.variantSuccess .dot{background-color:var(--qk-theme-success)}.variantWarning .dot{background-color:var(--qk-theme-warning)}.variantDanger .dot{background-color:var(--qk-theme-danger)}.variantInfo .dot{background-color:var(--qk-theme-info)}.dotPulse{animation:badgePulse 2s ease-in-out infinite}@keyframes badgePulse{0%,to{opacity:1}50%{opacity:.4}}.alert{display:flex;align-items:flex-start;gap:var(--qk-space-3);padding:var(--qk-space-4) var(--qk-space-5);border-radius:var(--qk-radius-md);border:1px solid transparent;font-family:var(--qk-font-sans);font-size:var(--qk-text-sm);line-height:var(--qk-leading-normal);position:relative;transition:all var(--qk-transition-normal)}.icon{display:flex;align-items:center;justify-content:center;user-select:none;flex-shrink:0;margin-top:2px}.icon svg{width:18px;height:18px;display:block}.content{flex:1}.title{font-weight:var(--qk-font-semibold);color:var(--qk-text-1);margin:0 0 var(--qk-space-1) 0;font-size:var(--qk-text-sm)}.description{color:var(--qk-text-2)}.alert:has(.description) .title{margin-bottom:var(--qk-space-1)}.alert:not(:has(.description)) .title{margin-bottom:0}.closeButton{background:transparent;border:none;color:var(--qk-text-muted);cursor:pointer;padding:var(--qk-space-1);font-size:var(--qk-text-xs);line-height:1;border-radius:var(--qk-radius-sm);display:flex;align-items:center;justify-content:center;transition:all var(--qk-transition-fast);margin-top:1px;margin-right:-4px}.closeButton:hover{background-color:#ffffff14;color:var(--qk-text-1)}.variantInfo{background-color:#0ea5e914;border-color:#0ea5e933;color:var(--qk-theme-info)}.variantInfo .closeButton:hover{background-color:#0ea5e926}.variantSuccess{background-color:#10b98114;border-color:#10b98133;color:var(--qk-theme-success)}.variantSuccess .closeButton:hover{background-color:#10b98126}.variantWarning{background-color:#f59e0b14;border-color:#f59e0b33;color:var(--qk-theme-warning)}.variantWarning .closeButton:hover{background-color:#f59e0b26}.variantDanger{background-color:#f43f5e14;border-color:#f43f5e33;color:var(--qk-theme-danger)}.variantDanger .closeButton:hover{background-color:#f43f5e26}.avatar{position:relative;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--qk-color-primary-600) 0%,var(--qk-color-primary-400) 100%);color:#fff;font-family:var(--qk-font-sans);font-weight:var(--qk-font-semibold);user-select:none;flex-shrink:0}.image{width:100%;height:100%;object-fit:cover;border-radius:inherit}.fallback{text-transform:uppercase;line-height:1}.shapeCircle{border-radius:var(--qk-radius-full)}.shapeSquare{border-radius:var(--qk-radius-md)}.sizeXs{width:24px;height:24px;font-size:10px}.sizeSm{width:32px;height:32px;font-size:var(--qk-text-xs)}.sizeMd{width:40px;height:40px;font-size:var(--qk-text-sm)}.sizeLg{width:48px;height:48px;font-size:var(--qk-text-base)}.sizeXl{width:64px;height:64px;font-size:var(--qk-text-xl)}.statusDot{position:absolute;bottom:0;right:0;display:block;border-radius:var(--qk-radius-full);border:2px solid var(--qk-bg-surface-1);background-color:var(--qk-text-muted)}.sizeXs .statusDot{width:7px;height:7px;border-width:1px}.sizeSm .statusDot{width:9px;height:9px}.sizeMd .statusDot{width:11px;height:11px}.sizeLg .statusDot{width:13px;height:13px}.sizeXl .statusDot{width:16px;height:16px}.statusOnline{background-color:var(--qk-color-success-500);box-shadow:0 0 6px #10b98166}.statusOffline{background-color:var(--qk-color-neutral-500)}.statusAway{background-color:var(--qk-color-warning-500);box-shadow:0 0 6px #f59e0b66}.statusBusy{background-color:var(--qk-color-danger-500);box-shadow:0 0 6px #f43f5e66}.spinner{display:inline-block;border-style:solid;border-radius:50%;border-color:#8b5cf626;border-top-color:var(--qk-color-primary-500);animation:qk-spin .8s linear infinite}.sizeSm{width:16px;height:16px;border-width:2px}.sizeMd{width:24px;height:24px;border-width:2.5px}.sizeLg{width:36px;height:36px;border-width:3.5px}.srOnly{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
package/dist/index.js CHANGED
@@ -1 +1 @@
1
- import{forwardRef as V}from"react";var s={};import{jsx as w,jsxs as $}from"react/jsx-runtime";var X={sm:s.sizeSm,md:s.sizeMd,lg:s.sizeLg},G={primary:s.variantPrimary,secondary:s.variantSecondary,outline:s.variantOutline,ghost:s.variantGhost,danger:s.variantDanger},S=V(({variant:e="primary",size:r="md",isLoading:a=!1,leftIcon:t,rightIcon:o,fullWidth:n=!1,disabled:i,className:v,children:m,type:f="button",...k},h)=>{let N=[s.button,X[r],G[e],n?s.fullWidth:"",a?s.loading:"",v??""].filter(Boolean).join(" ");return $("button",{ref:h,type:f,className:N,disabled:i||a,"aria-busy":a||void 0,"aria-disabled":i||a||void 0,...k,children:[a&&w("span",{className:s.spinnerWrapper,"aria-hidden":"true",children:w("span",{className:s.spinner})}),t&&w("span",{className:s.iconLeft,children:t}),m,o&&w("span",{className:s.iconRight,children:o})]})});S.displayName="Button";var g={};import{jsx as Q}from"react/jsx-runtime";var J={default:g.variantDefault,outlined:g.variantOutlined,elevated:g.variantElevated,glass:g.variantGlass},K={none:g.paddingNone,sm:g.paddingSm,md:g.paddingMd,lg:g.paddingLg},C=({variant:e="default",padding:r="md",hoverable:a=!1,className:t,children:o,...n})=>{let i=[g.card,J[e],K[r],a?g.hoverable:"",t??""].filter(Boolean).join(" ");return Q("div",{className:i,...n,children:o})};C.displayName="Card";import{forwardRef as Z,useId as _}from"react";var l={};import{jsx as x,jsxs as E}from"react/jsx-runtime";var rr={sm:l.sizeSm,md:l.sizeMd,lg:l.sizeLg},P=Z(({label:e,error:r,helperText:a,leftIcon:t,rightIcon:o,size:n="md",variant:i="default",className:v,id:m,"aria-describedby":f,...k},h)=>{let N=_(),y=m??N,A=r?`${y}-error`:void 0,D=a&&!r?`${y}-helper`:void 0,W=f??A??D??void 0,O=[l.input,rr[n],i==="filled"?l.variantFilled:"",t?l.hasLeftIcon:"",o?l.hasRightIcon:"",r?l.inputError:"",v??""].filter(Boolean).join(" ");return E("div",{className:l.wrapper,children:[e&&x("label",{htmlFor:y,className:l.label,children:e}),E("div",{className:l.inputContainer,children:[t&&x("span",{className:l.leftIcon,"aria-hidden":"true",children:t}),x("input",{ref:h,id:y,className:O,"aria-invalid":r?!0:void 0,"aria-describedby":W,...k}),o&&x("span",{className:l.rightIcon,"aria-hidden":"true",children:o})]}),r&&x("p",{id:A,className:l.errorText,role:"alert",children:r}),a&&!r&&x("p",{id:D,className:l.helperText,children:a})]})});P.displayName="Input";import{useId as er}from"react";var p={};import{jsx as z,jsxs as tr}from"react/jsx-runtime";var or={sm:p.sizeSm,md:p.sizeMd,lg:p.sizeLg},R=({checked:e=!1,onChange:r,size:a="md",label:t,disabled:o=!1,className:n})=>{let i=er(),v=[p.wrapper,or[a],o?p.disabled:"",n??""].filter(Boolean).join(" "),m=[p.track,e?p.trackChecked:""].filter(Boolean).join(" "),f=[p.thumb,e?p.thumbChecked:""].filter(Boolean).join(" "),k=h=>{o||r?.(h.target.checked)};return tr("label",{className:v,children:[z("input",{id:i,type:"checkbox",role:"switch",className:p.input,checked:e,disabled:o,onChange:k,"aria-checked":e}),z("span",{className:m,"aria-hidden":"true",children:z("span",{className:f})}),t&&z("span",{className:p.label,children:t})]})};R.displayName="Toggle";var c={};import{jsx as lr,jsxs as dr}from"react/jsx-runtime";var ir={sm:c.sizeSm,md:c.sizeMd,lg:c.sizeLg},sr={default:c.variantDefault,primary:c.variantPrimary,success:c.variantSuccess,warning:c.variantWarning,danger:c.variantDanger,info:c.variantInfo},I=({variant:e="default",size:r="md",dot:a=!1,outline:t=!1,className:o,children:n,...i})=>{let v=[c.badge,ir[r],sr[e],t?c.outline:"",o??""].filter(Boolean).join(" ");return dr("span",{className:v,...i,children:[a&&lr("span",{className:`${c.dot} ${c.dotPulse}`,"aria-hidden":"true"}),n]})};I.displayName="Badge";var u={};import{FiInfo as pr,FiCheckCircle as gr,FiAlertTriangle as ur,FiXCircle as vr}from"react-icons/fi";import{jsx as b,jsxs as H}from"react/jsx-runtime";var br={info:u.variantInfo,success:u.variantSuccess,warning:u.variantWarning,danger:u.variantDanger},mr={info:b(pr,{}),success:b(gr,{}),warning:b(ur,{}),danger:b(vr,{})},B=({variant:e="info",title:r,onClose:a,className:t,children:o,...n})=>{let i=[u.alert,br[e],t??""].filter(Boolean).join(" ");return H("div",{className:i,role:"alert",...n,children:[b("span",{className:u.icon,"aria-hidden":"true",children:mr[e]}),H("div",{className:u.content,children:[r&&b("h5",{className:u.title,children:r}),o&&b("div",{className:u.description,children:o})]}),a&&b("button",{type:"button",className:u.closeButton,onClick:a,"aria-label":"Dismiss alert",children:"\u2715"})]})};B.displayName="Alert";import{useState as kr}from"react";var d={};import{jsx as L,jsxs as yr}from"react/jsx-runtime";var hr={xs:d.sizeXs,sm:d.sizeSm,md:d.sizeMd,lg:d.sizeLg,xl:d.sizeXl},xr={circle:d.shapeCircle,square:d.shapeSquare},qr={online:d.statusOnline,offline:d.statusOffline,away:d.statusAway,busy:d.statusBusy},M=({src:e,alt:r="",fallback:a,size:t="md",shape:o="circle",status:n,className:i,...v})=>{let[m,f]=kr(!1),k=[d.avatar,hr[t],xr[o],i??""].filter(Boolean).join(" ");return yr("div",{className:k,...v,children:[e&&!m?L("img",{src:e,alt:r,className:d.image,onError:()=>f(!0)}):L("span",{className:d.fallback,children:a}),n&&L("span",{className:`${d.statusDot} ${qr[n]}`,"aria-label":n,role:"status"})]})};M.displayName="Avatar";var q={};import{jsx as F}from"react/jsx-runtime";var zr={sm:q.sizeSm,md:q.sizeMd,lg:q.sizeLg},T=({size:e="md",color:r,style:a,className:t,...o})=>{let n=[q.spinner,zr[e],t??""].filter(Boolean).join(" "),i={...a,...r?{borderTopColor:r}:{}};return F("span",{className:n,style:i,role:"status",...o,children:F("span",{className:q.srOnly,children:"Loading..."})})};T.displayName="Spinner";export{B as Alert,M as Avatar,I as Badge,S as Button,C as Card,P as Input,T as Spinner,R as Toggle};
1
+ import{forwardRef as V}from"react";var s={};import{jsx as w,jsxs as $}from"react/jsx-runtime";var X={sm:s.sizeSm,md:s.sizeMd,lg:s.sizeLg},G={primary:s.variantPrimary,secondary:s.variantSecondary,outline:s.variantOutline,ghost:s.variantGhost,danger:s.variantDanger},S=V(({variant:e="primary",size:r="md",isLoading:a=!1,leftIcon:t,rightIcon:o,fullWidth:n=!1,disabled:i,className:u,children:f,type:m="button",...q},v)=>{let N=[s.button,X[r],G[e],n?s.fullWidth:"",a?s.loading:"",u??""].filter(Boolean).join(" ");return $("button",{ref:v,type:m,className:N,disabled:i||a,"aria-busy":a||void 0,"aria-disabled":i||a||void 0,...q,children:[a&&w("span",{className:s.spinnerWrapper,"aria-hidden":"true",children:w("span",{className:s.spinner})}),t&&w("span",{className:s.iconLeft,children:t}),f,o&&w("span",{className:s.iconRight,children:o})]})});S.displayName="Button";var g={};import{jsx as K}from"react/jsx-runtime";var J={default:g.variantDefault,outlined:g.variantOutlined,elevated:g.variantElevated,glass:g.variantGlass},U={none:g.paddingNone,sm:g.paddingSm,md:g.paddingMd,lg:g.paddingLg},C=({variant:e="default",padding:r="md",hoverable:a=!1,className:t,children:o,...n})=>{let i=[g.card,J[e],U[r],a?g.hoverable:"",t??""].filter(Boolean).join(" ");return K("div",{className:i,...n,children:o})};C.displayName="Card";import{forwardRef as Z,useId as _}from"react";var l={};import{jsx as h,jsxs as E}from"react/jsx-runtime";var rr={sm:l.sizeSm,md:l.sizeMd,lg:l.sizeLg},P=Z(({label:e,error:r,helperText:a,leftIcon:t,rightIcon:o,size:n="md",variant:i="default",className:u,id:f,"aria-describedby":m,...q},v)=>{let N=_(),y=f??N,A=r?`${y}-error`:void 0,D=a&&!r?`${y}-helper`:void 0,W=m??A??D??void 0,O=[l.input,rr[n],i==="filled"?l.variantFilled:"",t?l.hasLeftIcon:"",o?l.hasRightIcon:"",r?l.inputError:"",u??""].filter(Boolean).join(" ");return E("div",{className:l.wrapper,children:[e&&h("label",{htmlFor:y,className:l.label,children:e}),E("div",{className:l.inputContainer,children:[t&&h("span",{className:l.leftIcon,"aria-hidden":"true",children:t}),h("input",{ref:v,id:y,className:O,"aria-invalid":r?!0:void 0,"aria-describedby":W,...q}),o&&h("span",{className:l.rightIcon,"aria-hidden":"true",children:o})]}),r&&h("p",{id:A,className:l.errorText,role:"alert",children:r}),a&&!r&&h("p",{id:D,className:l.helperText,children:a})]})});P.displayName="Input";import{useId as er}from"react";var p={};import{jsx as z,jsxs as tr}from"react/jsx-runtime";var or={sm:p.sizeSm,md:p.sizeMd,lg:p.sizeLg},R=({checked:e=!1,onChange:r,size:a="md",label:t,disabled:o=!1,className:n})=>{let i=er(),u=[p.wrapper,or[a],o?p.disabled:"",n??""].filter(Boolean).join(" "),f=[p.track,e?p.trackChecked:""].filter(Boolean).join(" "),m=[p.thumb,e?p.thumbChecked:""].filter(Boolean).join(" "),q=v=>{o||r?.(v.target.checked)};return tr("label",{className:u,children:[z("input",{id:i,type:"checkbox",role:"switch",className:p.input,checked:e,disabled:o,onChange:q,"aria-checked":e}),z("span",{className:f,"aria-hidden":"true",children:z("span",{className:m})}),t&&z("span",{className:p.label,children:t})]})};R.displayName="Toggle";var d={};import{jsx as lr,jsxs as cr}from"react/jsx-runtime";var ir={sm:d.sizeSm,md:d.sizeMd,lg:d.sizeLg},sr={default:d.variantDefault,primary:d.variantPrimary,success:d.variantSuccess,warning:d.variantWarning,danger:d.variantDanger,info:d.variantInfo},B=({variant:e="default",size:r="md",dot:a=!1,outline:t=!1,className:o,children:n,...i})=>{let u=[d.badge,ir[r],sr[e],t?d.outline:"",o??""].filter(Boolean).join(" ");return cr("span",{className:u,...i,children:[a&&lr("span",{className:`${d.dot} ${d.dotPulse}`,"aria-hidden":"true"}),n]})};B.displayName="Badge";var k={};import{FiInfo as pr,FiCheckCircle as gr,FiAlertTriangle as kr,FiXCircle as ur}from"react-icons/fi";import{jsx as b,jsxs as F}from"react/jsx-runtime";var br={info:k.variantInfo,success:k.variantSuccess,warning:k.variantWarning,danger:k.variantDanger},fr={info:b(pr,{}),success:b(gr,{}),warning:b(kr,{}),danger:b(ur,{})},I=({variant:e="info",title:r,onClose:a,className:t,children:o,...n})=>{let i=[k.alert,br[e],t??""].filter(Boolean).join(" ");return F("div",{className:i,role:"alert",...n,children:[b("span",{className:k.icon,"aria-hidden":"true",children:fr[e]}),F("div",{className:k.content,children:[r&&b("h5",{className:k.title,children:r}),o&&b("div",{className:k.description,children:o})]}),a&&b("button",{type:"button",className:k.closeButton,onClick:a,"aria-label":"Dismiss alert",children:"\u2715"})]})};I.displayName="Alert";import{useState as qr}from"react";var c={};import{jsx as L,jsxs as yr}from"react/jsx-runtime";var vr={xs:c.sizeXs,sm:c.sizeSm,md:c.sizeMd,lg:c.sizeLg,xl:c.sizeXl},hr={circle:c.shapeCircle,square:c.shapeSquare},xr={online:c.statusOnline,offline:c.statusOffline,away:c.statusAway,busy:c.statusBusy},T=({src:e,alt:r="",fallback:a,size:t="md",shape:o="circle",status:n,className:i,...u})=>{let[f,m]=qr(!1),q=[c.avatar,vr[t],hr[o],i??""].filter(Boolean).join(" ");return yr("div",{className:q,...u,children:[e&&!f?L("img",{src:e,alt:r,className:c.image,onError:()=>m(!0)}):L("span",{className:c.fallback,children:a}),n&&L("span",{className:`${c.statusDot} ${xr[n]}`,"aria-label":n,role:"status"})]})};T.displayName="Avatar";var x={};import{jsx as H}from"react/jsx-runtime";var zr={sm:x.sizeSm,md:x.sizeMd,lg:x.sizeLg},M=({size:e="md",color:r,style:a,className:t,...o})=>{let n=[x.spinner,zr[e],t??""].filter(Boolean).join(" "),i={...a,...r?{borderTopColor:r}:{}};return H("span",{className:n,style:i,role:"status",...o,children:H("span",{className:x.srOnly,children:"Loading..."})})};M.displayName="Spinner";export{I as Alert,T as Avatar,B as Badge,S as Button,C as Card,P as Input,M as Spinner,R as Toggle};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kpv2004/quark-ui",
3
- "version": "0.1.1",
3
+ "version": "0.1.2",
4
4
  "type": "module",
5
5
  "main": "./dist/index.cjs",
6
6
  "module": "./dist/index.js",
@@ -11,7 +11,7 @@
11
11
  "import": "./dist/index.js",
12
12
  "require": "./dist/index.cjs"
13
13
  },
14
- "./styles": "./src/styles/tokens.css"
14
+ "./styles": "./dist/index.css"
15
15
  },
16
16
  "files": [
17
17
  "dist",