@flavia-dev/a11y-ui-kit-react 0.1.6 → 0.2.0

package/dist/a11y-ui-kit-react.css

@@ -1 +1 @@
-._button_1003x_2{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:inherit;font-weight:600;line-height:1.5;border:none;border-radius:.5rem;cursor:pointer;transition:all .2s ease;text-decoration:none;white-space:nowrap}._button_1003x_2:focus-visible{outline:3px solid #3b82f6;outline-offset:2px}._button_1003x_2[aria-disabled=true],._disabled_1003x_26{cursor:not-allowed;opacity:.6;pointer-events:none}._primary_1003x_33{background-color:#3b82f6;color:#fff}._primary_1003x_33:hover:not([aria-disabled=true]):not(._disabled_1003x_26){background-color:#2563eb}._primary_1003x_33:active:not([aria-disabled=true]):not(._disabled_1003x_26){background-color:#1d4ed8}._secondary_1003x_46{background-color:#64748b;color:#fff}._secondary_1003x_46:hover:not([aria-disabled=true]):not(._disabled_1003x_26){background-color:#475569}._secondary_1003x_46:active:not([aria-disabled=true]):not(._disabled_1003x_26){background-color:#334155}._danger_1003x_59{background-color:#ef4444;color:#fff}._danger_1003x_59:hover:not([aria-disabled=true]):not(._disabled_1003x_26){background-color:#dc2626}._danger_1003x_59:active:not([aria-disabled=true]):not(._disabled_1003x_26){background-color:#b91c1c}._small_1003x_73{padding:.5rem 1rem;font-size:.875rem}._medium_1003x_78{padding:.625rem 1.25rem;font-size:1rem}._large_1003x_83{padding:.75rem 1.5rem;font-size:1.125rem}._fullWidth_1003x_89{width:100%}._loading_1003x_94{pointer-events:none}._loadingContainer_1003x_98{display:inline-flex;align-items:center;gap:.5rem}._spinner_1003x_104{display:inline-block;width:1em;height:1em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:_spin_1003x_104 .75s linear infinite}@keyframes _spin_1003x_104{to{transform:rotate(360deg)}}._srOnly_1003x_121{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}._inputWrapper_sim0c_2{display:inline-flex;flex-direction:column;gap:.25rem}._inputWrapper_sim0c_2._fullWidth_sim0c_8{width:100%}._label_sim0c_13{font-size:.875rem;font-weight:500;color:#374151;margin-bottom:.25rem}._label_sim0c_13._required_sim0c_20:after{content:""}._requiredIndicator_sim0c_24{color:#dc2626;margin-left:.25rem}._input_sim0c_2{font-family:inherit;font-size:1rem;line-height:1.5;color:#1f2937;background-color:#fff;border:1px solid #6b7280;border-radius:.375rem;transition:all .2s ease;outline:none}._input_sim0c_2:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}._input_sim0c_2:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}._small_sim0c_53{padding:.375rem .75rem;font-size:.875rem}._medium_sim0c_58{padding:.5rem .875rem;font-size:1rem}._large_sim0c_63{padding:.625rem 1rem;font-size:1.125rem}._input_sim0c_2._error_sim0c_69{border-color:#dc2626}._input_sim0c_2._error_sim0c_69:focus{border-color:#dc2626;box-shadow:0 0 0 3px #dc26261a}._input_sim0c_2._disabled_sim0c_78,._input_sim0c_2:disabled{background-color:#f3f4f6;color:#6b7280;cursor:not-allowed;opacity:.8}._fullWidth_sim0c_8{width:100%}._helperText_sim0c_91,._errorText_sim0c_92{font-size:.875rem;margin-top:.25rem}._helperText_sim0c_91{color:#6b7280}._errorText_sim0c_92{color:#dc2626;font-weight:500}._visuallyHidden_sim0c_107{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}._checkboxWrapper_8c7eh_2{display:flex;flex-direction:column;gap:.25rem}._inputGroup_8c7eh_9{display:flex;align-items:center;gap:.5rem}._checkbox_8c7eh_2{appearance:none;-webkit-appearance:none;margin:0;width:1.25rem;height:1.25rem;flex-shrink:0;border:2px solid #6b7280;border-radius:.25rem;background-color:#fff;cursor:pointer;transition:all .2s ease-in-out;position:relative}._checkbox_8c7eh_2:focus-visible{outline:3px solid #3b82f6;outline-offset:2px}._checkbox_8c7eh_2:checked{background-color:#3b82f6;border-color:#3b82f6}._checkbox_8c7eh_2:checked:after{content:"";position:absolute;left:.3rem;top:.05rem;width:.35rem;height:.7rem;border:solid #ffffff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}._checkbox_8c7eh_2:not(:disabled):hover{border-color:#3b82f6}._checkbox_8c7eh_2:disabled{cursor:not-allowed;opacity:.5;background-color:#f3f4f6}._checkbox_8c7eh_2._error_8c7eh_69{border-color:#ef4444;border-width:2.5px}._checkbox_8c7eh_2._small_8c7eh_75{width:1rem;height:1rem}._checkbox_8c7eh_2._small_8c7eh_75:checked:after{left:.25rem;top:.03rem;width:.25rem;height:.5rem;border-width:0 2px 2px 0}._checkbox_8c7eh_2._large_8c7eh_88{width:1.5rem;height:1.5rem}._checkbox_8c7eh_2._large_8c7eh_88:checked:after{left:.4rem;top:.08rem;width:.45rem;height:.85rem;border-width:0 3px 3px 0}._label_8c7eh_102{font-size:1rem;line-height:1.5;color:#374151;cursor:pointer;-webkit-user-select:none;user-select:none}._label_8c7eh_102._disabled_8c7eh_110{cursor:not-allowed;opacity:.5}._requiredIndicator_8c7eh_116{color:#ef4444;font-weight:600}._helperText_8c7eh_122{font-size:.875rem;line-height:1.25rem;color:#6b7280;margin-left:1.75rem}._errorText_8c7eh_130{font-size:.875rem;line-height:1.25rem;color:#dc2626;margin-left:1.75rem;font-weight:500}
+._button_f4jhn_2{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:inherit;font-weight:600;line-height:1.5;border:none;border-radius:.5rem;cursor:pointer;transition:all .2s ease;text-decoration:none;white-space:nowrap}._button_f4jhn_2:focus-visible{outline:3px solid #3b82f6;outline-offset:2px}._button_f4jhn_2[aria-disabled=true],._disabled_f4jhn_26{cursor:not-allowed;opacity:.6;pointer-events:none}._primary_f4jhn_33{background-color:#3b82f6;color:#fff}._primary_f4jhn_33:hover:not([aria-disabled=true]):not(._disabled_f4jhn_26){background-color:#2563eb}._primary_f4jhn_33:active:not([aria-disabled=true]):not(._disabled_f4jhn_26){background-color:#1d4ed8}._secondary_f4jhn_46{background-color:#64748b;color:#fff}._secondary_f4jhn_46:hover:not([aria-disabled=true]):not(._disabled_f4jhn_26){background-color:#475569}._secondary_f4jhn_46:active:not([aria-disabled=true]):not(._disabled_f4jhn_26){background-color:#334155}._danger_f4jhn_59{background-color:#ef4444;color:#fff}._danger_f4jhn_59:hover:not([aria-disabled=true]):not(._disabled_f4jhn_26){background-color:#dc2626}._danger_f4jhn_59:active:not([aria-disabled=true]):not(._disabled_f4jhn_26){background-color:#b91c1c}._small_f4jhn_73{padding:.5rem 1rem;font-size:.875rem}._medium_f4jhn_78{padding:.625rem 1.25rem;font-size:1rem}._large_f4jhn_83{padding:.75rem 1.5rem;font-size:1.125rem}._fullWidth_f4jhn_89{width:100%}._loading_f4jhn_94{pointer-events:none}._loadingContainer_f4jhn_98{display:inline-flex;align-items:center;gap:.5rem}._spinner_f4jhn_104{display:inline-block;width:1em;height:1em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:_spin_f4jhn_104 .75s linear infinite}@keyframes _spin_f4jhn_104{to{transform:rotate(360deg)}}._srOnly_f4jhn_121{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}._inputWrapper_kbgao_2{display:inline-flex;flex-direction:column;gap:.25rem}._inputWrapper_kbgao_2._fullWidth_kbgao_8{width:100%}._label_kbgao_13{font-size:.875rem;font-weight:500;color:#374151;margin-bottom:.25rem}._label_kbgao_13._required_kbgao_20:after{content:""}._requiredIndicator_kbgao_24{color:#dc2626;margin-left:.25rem}._input_kbgao_2{font-family:inherit;font-size:1rem;line-height:1.5;color:#1f2937;background-color:#fff;border:1px solid #6b7280;border-radius:.375rem;transition:all .2s ease;outline:none}._input_kbgao_2:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}._input_kbgao_2:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}._small_kbgao_53{padding:.375rem .75rem;font-size:.875rem}._medium_kbgao_58{padding:.5rem .875rem;font-size:1rem}._large_kbgao_63{padding:.625rem 1rem;font-size:1.125rem}._input_kbgao_2._error_kbgao_69{border-color:#dc2626}._input_kbgao_2._error_kbgao_69:focus{border-color:#dc2626;box-shadow:0 0 0 3px #dc26261a}._input_kbgao_2._disabled_kbgao_78,._input_kbgao_2:disabled{background-color:#f3f4f6;color:#6b7280;cursor:not-allowed;opacity:.8}._fullWidth_kbgao_8{width:100%}._helperText_kbgao_91,._errorText_kbgao_92{font-size:.875rem;margin-top:.25rem}._helperText_kbgao_91{color:#6b7280}._errorText_kbgao_92{color:#dc2626;font-weight:500}._visuallyHidden_kbgao_107{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}._checkboxWrapper_lv2u7_1{display:flex;flex-direction:column;gap:.25rem}._inputGroup_lv2u7_7{display:flex;align-items:center;gap:.5rem}._checkbox_lv2u7_1{appearance:none;-webkit-appearance:none;margin:0;width:1.25rem;height:1.25rem;flex-shrink:0;border:2px solid #6b7280;border-radius:.25rem;background-color:#fff;cursor:pointer;transition:all .2s ease-in-out;position:relative}._checkbox_lv2u7_1:focus-visible{outline:3px solid #3b82f6;outline-offset:2px}._checkbox_lv2u7_1:checked{background-color:#3b82f6;border-color:#3b82f6}._checkbox_lv2u7_1:checked:after{content:"";position:absolute;left:.3rem;top:.05rem;width:.35rem;height:.7rem;border:solid #ffffff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}._checkbox_lv2u7_1._indeterminate_lv2u7_49{background-color:#3b82f6;border-color:#3b82f6}._checkbox_lv2u7_1._indeterminate_lv2u7_49:after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:.65rem;height:.15rem;background-color:#fff;border-radius:1px}._checkbox_lv2u7_1:not(:disabled):hover{border-color:#3b82f6}._checkbox_lv2u7_1:disabled{cursor:not-allowed;opacity:.5;background-color:#f3f4f6}._checkbox_lv2u7_1._error_lv2u7_76{border-color:#ef4444;border-width:2.5px}._checkbox_lv2u7_1._small_lv2u7_81{width:1rem;height:1rem}._checkbox_lv2u7_1._small_lv2u7_81:checked:after{left:.25rem;top:.03rem;width:.25rem;height:.5rem;border-width:0 2px 2px 0}._checkbox_lv2u7_1._large_lv2u7_94{width:1.5rem;height:1.5rem}._checkbox_lv2u7_1._large_lv2u7_94:checked:after{left:.4rem;top:.08rem;width:.45rem;height:.85rem;border-width:0 3px 3px 0}._checkbox_lv2u7_1._small_lv2u7_81._indeterminate_lv2u7_49:after{width:.5rem;height:.125rem}._checkbox_lv2u7_1._large_lv2u7_94._indeterminate_lv2u7_49:after{width:.8rem;height:.175rem}._label_lv2u7_117{font-size:1rem;line-height:1.5;color:#374151;cursor:pointer;-webkit-user-select:none;user-select:none}._label_lv2u7_117._disabled_lv2u7_125{cursor:not-allowed;opacity:.5}._requiredIndicator_lv2u7_130{color:#ef4444;font-weight:600}._helperText_lv2u7_135{font-size:.875rem;line-height:1.25rem;color:#6b7280;margin-left:1.75rem}._errorText_lv2u7_142{font-size:.875rem;line-height:1.25rem;color:#dc2626;margin-left:1.75rem;font-weight:500}

package/dist/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),j=require("react"),T="_button_1003x_2",q="_disabled_1003x_26",C="_primary_1003x_33",B="_secondary_1003x_46",w="_danger_1003x_59",D="_small_1003x_73",O="_medium_1003x_78",R="_large_1003x_83",G="_fullWidth_1003x_89",H="_loading_1003x_94",F="_loadingContainer_1003x_98",K="_spinner_1003x_104",S="_spin_1003x_104",E="_srOnly_1003x_121",c={button:T,disabled:q,primary:C,secondary:B,danger:w,small:D,medium:O,large:R,fullWidth:G,loading:H,loadingContainer:F,spinner:K,spin:S,srOnly:E},g=j.forwardRef(({variant:x="primary",size:h="medium",children:t,disabled:r=!1,loading:s=!1,fullWidth:o=!1,className:b,type:d="button",onClick:u,...f},y)=>{const n=r||s,p=l=>{if(n){l.preventDefault();return}u?.(l)},m=l=>{n&&(l.key==="Enter"||l.key===" ")&&l.preventDefault()},_=[c.button,c[x],c[h],s&&c.loading,o&&c.fullWidth,n&&c.disabled,b].filter(Boolean).join(" ");return e.jsxs("button",{ref:y,type:d,className:_,"aria-disabled":n,"aria-busy":s||void 0,onClick:p,onKeyDown:m,...f,children:[s&&e.jsxs("span",{role:"status","aria-live":"polite",className:c.loadingContainer,children:[e.jsx("span",{className:c.spinner,"aria-hidden":"true"}),e.jsx("span",{className:c.srOnly,children:"Loading..."})]}),e.jsx("span",{"aria-hidden":s||void 0,children:t})]})});g.displayName="Button";const L="_inputWrapper_sim0c_2",M="_fullWidth_sim0c_8",P="_label_sim0c_13",z="_required_sim0c_20",A="_requiredIndicator_sim0c_24",J="_input_sim0c_2",Q="_small_sim0c_53",U="_medium_sim0c_58",V="_large_sim0c_63",X="_error_sim0c_69",Y="_disabled_sim0c_78",Z="_helperText_sim0c_91",ee="_errorText_sim0c_92",se="_visuallyHidden_sim0c_107",a={inputWrapper:L,fullWidth:M,label:P,required:z,requiredIndicator:A,input:J,small:Q,medium:U,large:V,error:X,disabled:Y,helperText:Z,errorText:ee,visuallyHidden:se},N=j.forwardRef(({label:x,type:h="text",size:t="medium",error:r,helperText:s,fullWidth:o=!1,hideLabel:b=!1,required:d=!1,disabled:u=!1,className:f,id:y,...n},p)=>{const m=j.useId(),_=y||m,l=r?`${_}-error`:void 0,v=s?`${_}-helper`:void 0,I=[l,v].filter(Boolean).join(" ")||void 0,k=[a.input,a[t],r&&a.error,u&&a.disabled,o&&a.fullWidth,f].filter(Boolean).join(" "),W=[a.label,b&&a.visuallyHidden,d&&a.required].filter(Boolean).join(" ");return e.jsxs("div",{className:`${a.inputWrapper} ${o?a.fullWidth:""}`,children:[e.jsxs("label",{htmlFor:_,className:W,children:[x,d&&e.jsx("span",{className:a.requiredIndicator,"aria-label":"required",children:" *"})]}),e.jsx("input",{ref:p,id:_,type:h,className:k,required:d,disabled:u,"aria-invalid":r?!0:void 0,"aria-describedby":I,"aria-required":d||void 0,...n}),s&&!r&&e.jsx("span",{id:v,className:a.helperText,children:s}),r&&e.jsx("span",{id:l,className:a.errorText,role:"alert",children:r})]})});N.displayName="Input";const ae="_checkboxWrapper_8c7eh_2",re="_inputGroup_8c7eh_9",ie="_checkbox_8c7eh_2",ne="_error_8c7eh_69",le="_small_8c7eh_75",te="_large_8c7eh_88",oe="_label_8c7eh_102",ce="_disabled_8c7eh_110",de="_requiredIndicator_8c7eh_116",_e="_helperText_8c7eh_122",ue="_errorText_8c7eh_130",i={checkboxWrapper:ae,inputGroup:re,checkbox:ie,error:ne,small:le,large:te,label:oe,disabled:ce,requiredIndicator:de,helperText:_e,errorText:ue},$=j.forwardRef(({label:x,size:h="medium",error:t,helperText:r,disabled:s=!1,required:o=!1,className:b,id:d,...u},f)=>{const y=j.useId(),n=d||y,p=t?`${n}-error`:void 0,m=r?`${n}-helper`:void 0,_=[p,m].filter(Boolean).join(" ")||void 0,l=[i.checkbox,i[h],t&&i.error,s&&i.disabled,b].filter(Boolean).join(" "),v=[i.label,s&&i.disabled,o&&i.required].filter(Boolean).join(" ");return e.jsxs("div",{className:i.checkboxWrapper,children:[e.jsxs("div",{className:i.inputGroup,children:[e.jsx("input",{ref:f,id:n,type:"checkbox",className:l,disabled:s,required:o,"aria-invalid":t?!0:void 0,"aria-describedby":_,"aria-required":o||void 0,...u}),e.jsxs("label",{htmlFor:n,className:v,children:[x,o&&e.jsxs("span",{className:i.requiredIndicator,"aria-label":"required",children:[" ","*"]})]})]}),r&&!t&&e.jsx("span",{id:m,className:i.helperText,children:r}),t&&e.jsx("span",{id:p,className:i.errorText,role:"alert",children:t})]})});$.displayName="Checkbox";exports.Button=g;exports.Checkbox=$;exports.Input=N;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),b=require("react"),T="_button_f4jhn_2",q="_disabled_f4jhn_26",C="_primary_f4jhn_33",B="_secondary_f4jhn_46",R="_danger_f4jhn_59",w="_small_f4jhn_73",D="_medium_f4jhn_78",O="_large_f4jhn_83",G="_fullWidth_f4jhn_89",H="_loading_f4jhn_94",E="_loadingContainer_f4jhn_98",F="_spinner_f4jhn_104",K="_spin_f4jhn_104",S="_srOnly_f4jhn_121",d={button:T,disabled:q,primary:C,secondary:B,danger:R,small:w,medium:D,large:O,fullWidth:G,loading:H,loadingContainer:E,spinner:F,spin:K,srOnly:S},$=b.forwardRef(({variant:m="primary",size:f="medium",children:o,disabled:l=!1,loading:s=!1,fullWidth:t=!1,className:c,type:_="button",onClick:h,...x},j)=>{const u=l||s,p=r=>{if(u){r.preventDefault();return}h?.(r)},g=r=>{u&&(r.key==="Enter"||r.key===" ")&&r.preventDefault()},i=[d.button,d[m],d[f],s&&d.loading,t&&d.fullWidth,u&&d.disabled,c].filter(Boolean).join(" ");return e.jsxs("button",{ref:j,type:_,className:i,"aria-disabled":u,"aria-busy":s||void 0,onClick:p,onKeyDown:g,...x,children:[s&&e.jsxs("span",{role:"status","aria-live":"polite",className:d.loadingContainer,children:[e.jsx("span",{className:d.spinner,"aria-hidden":"true"}),e.jsx("span",{className:d.srOnly,children:"Loading..."})]}),e.jsx("span",{"aria-hidden":s||void 0,children:o})]})});$.displayName="Button";const L="_inputWrapper_kbgao_2",M="_fullWidth_kbgao_8",P="_label_kbgao_13",z="_required_kbgao_20",A="_requiredIndicator_kbgao_24",J="_input_kbgao_2",Q="_small_kbgao_53",U="_medium_kbgao_58",V="_large_kbgao_63",X="_error_kbgao_69",Y="_disabled_kbgao_78",Z="_helperText_kbgao_91",ee="_errorText_kbgao_92",se="_visuallyHidden_kbgao_107",n={inputWrapper:L,fullWidth:M,label:P,required:z,requiredIndicator:A,input:J,small:Q,medium:U,large:V,error:X,disabled:Y,helperText:Z,errorText:ee,visuallyHidden:se},I=b.forwardRef(({label:m,type:f="text",size:o="medium",error:l,helperText:s,fullWidth:t=!1,hideLabel:c=!1,required:_=!1,disabled:h=!1,className:x,id:j,...u},p)=>{const g=b.useId(),i=j||g,r=l?`${i}-error`:void 0,v=s?`${i}-helper`:void 0,k=[r,v].filter(Boolean).join(" ")||void 0,y=[n.input,n[o],l&&n.error,h&&n.disabled,t&&n.fullWidth,x].filter(Boolean).join(" "),N=[n.label,c&&n.visuallyHidden,_&&n.required].filter(Boolean).join(" ");return e.jsxs("div",{className:`${n.inputWrapper} ${t?n.fullWidth:""}`,children:[e.jsxs("label",{htmlFor:i,className:N,children:[m,_&&e.jsxs("span",{className:n.requiredIndicator,"aria-label":"required",children:[" ","*"]})]}),e.jsx("input",{ref:p,id:i,type:f,className:y,required:_,disabled:h,"aria-invalid":l?!0:void 0,"aria-describedby":k,"aria-required":_||void 0,...u}),s&&!l&&e.jsx("span",{id:v,className:n.helperText,children:s}),l&&e.jsx("span",{id:r,className:n.errorText,role:"alert",children:l})]})});I.displayName="Input";const ne="_checkboxWrapper_lv2u7_1",ae="_inputGroup_lv2u7_7",le="_checkbox_lv2u7_1",re="_indeterminate_lv2u7_49",ie="_error_lv2u7_76",oe="_small_lv2u7_81",te="_large_lv2u7_94",de="_label_lv2u7_117",ce="_disabled_lv2u7_125",_e="_requiredIndicator_lv2u7_130",ue="_helperText_lv2u7_135",pe="_errorText_lv2u7_142",a={checkboxWrapper:ne,inputGroup:ae,checkbox:le,indeterminate:re,error:ie,small:oe,large:te,label:de,disabled:ce,requiredIndicator:_e,helperText:ue,errorText:pe},W=b.forwardRef(({label:m,size:f="medium",error:o,helperText:l,disabled:s=!1,required:t=!1,indeterminate:c=!1,className:_,id:h,...x},j)=>{const u=b.useRef(null),p=j||u,g=b.useId(),i=h||g,r=o?`${i}-error`:void 0,v=l?`${i}-helper`:void 0,k=[r,v].filter(Boolean).join(" ")||void 0;b.useEffect(()=>{p.current&&(p.current.indeterminate=c)},[c,p]);const y=[a.checkbox,a[f],o&&a.error,s&&a.disabled,c&&a.indeterminate,_].filter(Boolean).join(" "),N=[a.label,s&&a.disabled,t&&a.required].filter(Boolean).join(" ");return e.jsxs("div",{className:a.checkboxWrapper,children:[e.jsxs("div",{className:a.inputGroup,children:[e.jsx("input",{ref:p,id:i,type:"checkbox",className:y,disabled:s,required:t,"aria-invalid":o?!0:void 0,"aria-describedby":k,"aria-required":t||void 0,"aria-checked":c?"mixed":void 0,...x}),e.jsxs("label",{htmlFor:i,className:N,children:[m,t&&e.jsxs("span",{className:a.requiredIndicator,"aria-label":"required",children:[" ","*"]})]})]}),l&&!o&&e.jsx("span",{id:v,className:a.helperText,children:l}),o&&e.jsx("span",{id:r,className:a.errorText,role:"alert",children:o})]})});W.displayName="Checkbox";exports.Button=$;exports.Checkbox=W;exports.Input=I;
 //# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../src/atoms/Button/Button.tsx","../src/atoms/Input/Input.tsx","../src/atoms/Checkbox/Checkbox.tsx"],"sourcesContent":["// src/atoms/Button/Button.tsx\nimport React from \"react\";\nimport styles from \"./Button.module.css\";\n\nexport interface ButtonProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  variant?: \"primary\" | \"secondary\" | \"danger\";\n  size?: \"small\" | \"medium\" | \"large\";\n  children: React.ReactNode;\n  loading?: boolean;\n  fullWidth?: boolean;\n}\n\n/**\n * Accessible button component following WCAG 2.1 AA standards\n *\n * Features:\n * - Native <button> element for semantic HTML\n * - Full keyboard support (Tab, Enter, Space)\n * - Screen reader announcements for loading state\n * - Visible focus indicator\n * - Color contrast compliant\n *\n * @example\n * ```tsx\n * <Button variant=\"primary\" onClick={handleClick}>\n *   Click me\n * </Button>\n *\n * <Button loading disabled>\n *   Submitting...\n * </Button>\n * ```\n */\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      variant = \"primary\",\n      size = \"medium\",\n      children,\n      disabled = false,\n      loading = false,\n      fullWidth = false,\n      className,\n      type = \"button\",\n      onClick,\n      ...props\n    },\n    ref\n  ) => {\n    const isDisabled = disabled || loading;\n\n    // Handle click with disabled check (prevents action but keeps focusable)\n    const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n      if (isDisabled) {\n        event.preventDefault();\n        return;\n      }\n      onClick?.(event);\n    };\n\n    // Handle keyboard events to prevent action when disabled\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n      if (isDisabled && (event.key === \"Enter\" || event.key === \" \")) {\n        event.preventDefault();\n      }\n    };\n\n    const classNames = [\n      styles.button,\n      styles[variant],\n      styles[size],\n      loading && styles.loading,\n      fullWidth && styles.fullWidth,\n      isDisabled && styles.disabled,\n      className,\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n    return (\n      <button\n        ref={ref}\n        type={type}\n        className={classNames}\n        aria-disabled={isDisabled}\n        aria-busy={loading || undefined}\n        onClick={handleClick}\n        onKeyDown={handleKeyDown}\n        {...props}\n      >\n        {loading && (\n          <span\n            role=\"status\"\n            aria-live=\"polite\"\n            className={styles.loadingContainer}\n          >\n            <span className={styles.spinner} aria-hidden=\"true\" />\n            <span className={styles.srOnly}>Loading...</span>\n          </span>\n        )}\n        <span aria-hidden={loading || undefined}>{children}</span>\n      </button>\n    );\n  }\n);\n\nButton.displayName = \"Button\";\n","import React, { useId } from \"react\";\nimport styles from \"./Input.module.css\";\n\nexport interface InputProps\n  extends Omit<React.InputHTMLAttributes<HTMLInputElement>, \"size\"> {\n  /**\n   * Input label (required for accessibility)\n   */\n  label: string;\n\n  /**\n   * Input type\n   * @default \"text\"\n   */\n  type?: \"text\" | \"email\" | \"password\" | \"tel\" | \"url\" | \"search\" | \"number\";\n\n  /**\n   * Input size\n   * @default \"medium\"\n   */\n  size?: \"small\" | \"medium\" | \"large\";\n\n  /**\n   * Error message (when present, input is marked as invalid)\n   */\n  error?: string;\n\n  /**\n   * Helper text (additional description)\n   */\n  helperText?: string;\n\n  /**\n   * Full width input\n   * @default false\n   */\n  fullWidth?: boolean;\n\n  /**\n   * Hide label visually but keep it for screen readers\n   * @default false\n   */\n  hideLabel?: boolean;\n}\n\n/**\n * Accessible Input component following WCAG 2.1 AA standards\n *\n * Features:\n * - Native <input> element for semantic HTML\n * - Proper label association via htmlFor\n * - Error states with aria-invalid and aria-describedby\n * - Helper text support\n * - Visible focus indicator\n * - Required indicator\n *\n * @example\n * ```tsx\n * <Input\n *   label=\"Email\"\n *   type=\"email\"\n *   required\n *   error=\"Invalid email address\"\n *   helperText=\"We'll never share your email\"\n * />\n * ```\n */\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n  (\n    {\n      label,\n      type = \"text\",\n      size = \"medium\",\n      error,\n      helperText,\n      fullWidth = false,\n      hideLabel = false,\n      required = false,\n      disabled = false,\n      className,\n      id: providedId,\n      ...props\n    },\n    ref\n  ) => {\n    // Generate unique IDs for accessibility\n    const generatedId = useId();\n    const id = providedId || generatedId;\n    const errorId = error ? `${id}-error` : undefined;\n    const helperTextId = helperText ? `${id}-helper` : undefined;\n\n    // Build aria-describedby\n    const describedBy = [errorId, helperTextId].filter(Boolean).join(\" \") || undefined;\n\n    const inputClasses = [\n      styles.input,\n      styles[size],\n      error && styles.error,\n      disabled && styles.disabled,\n      fullWidth && styles.fullWidth,\n      className,\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n    const labelClasses = [\n      styles.label,\n      hideLabel && styles.visuallyHidden,\n      required && styles.required,\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n    return (\n      <div className={`${styles.inputWrapper} ${fullWidth ? styles.fullWidth : \"\"}`}>\n        <label htmlFor={id} className={labelClasses}>\n          {label}\n          {required && <span className={styles.requiredIndicator} aria-label=\"required\"> *</span>}\n        </label>\n\n        <input\n          ref={ref}\n          id={id}\n          type={type}\n          className={inputClasses}\n          required={required}\n          disabled={disabled}\n          aria-invalid={error ? true : undefined}\n          aria-describedby={describedBy}\n          aria-required={required || undefined}\n          {...props}\n        />\n\n        {helperText && !error && (\n          <span id={helperTextId} className={styles.helperText}>\n            {helperText}\n          </span>\n        )}\n\n        {error && (\n          <span id={errorId} className={styles.errorText} role=\"alert\">\n            {error}\n          </span>\n        )}\n      </div>\n    );\n  }\n);\n\nInput.displayName = \"Input\";\n","import React, { useId } from \"react\";\nimport styles from \"./Checkbox.module.css\";\n\nexport interface CheckboxProps\n  extends Omit<React.InputHTMLAttributes<HTMLInputElement>, \"size\" | \"type\"> {\n  /**\n   * Checkbox label (required for accessibility)\n   */\n  label: string;\n\n  /**\n   * Checkbox size\n   * @default \"medium\"\n   */\n  size?: \"small\" | \"medium\" | \"large\";\n\n  /**\n   * Error message (when present, checkbox is marked as invalid)\n   */\n  error?: string;\n\n  /**\n   * Helper text (additional description)\n   */\n  helperText?: string;\n}\n\n/**\n * Accessible Checkbox component following WCAG 2.1 AA standards\n *\n * Features:\n * - Native <input type=\"checkbox\"> element for semantic HTML\n * - Proper label association via htmlFor\n * - Space key toggles checked state (native behavior)\n * - Error states with aria-invalid and aria-describedby\n * - Helper text support\n * - Visible focus indicator\n * - Required indicator\n *\n * @example\n * ```tsx\n * <Checkbox label=\"I agree to terms\" required />\n *\n * <Checkbox\n *   label=\"Subscribe to newsletter\"\n *   checked={isChecked}\n *   onChange={(e) => setIsChecked(e.target.checked)}\n *   error=\"This field is required\"\n * />\n * ```\n */\nexport const Checkbox = React.forwardRef<HTMLInputElement, CheckboxProps>(\n  (\n    {\n      label,\n      size = \"medium\",\n      error,\n      helperText,\n      disabled = false,\n      required = false,\n      className,\n      id: providedId,\n      ...props\n    },\n    ref\n  ) => {\n    // Generate unique IDs for accessibility\n    const generatedId = useId();\n    const id = providedId || generatedId;\n    const errorId = error ? `${id}-error` : undefined;\n    const helperTextId = helperText ? `${id}-helper` : undefined;\n\n    // Build aria-describedby\n    const describedBy =\n      [errorId, helperTextId].filter(Boolean).join(\" \") || undefined;\n\n    const checkboxClasses = [\n      styles.checkbox,\n      styles[size],\n      error && styles.error,\n      disabled && styles.disabled,\n      className,\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n    const labelClasses = [\n      styles.label,\n      disabled && styles.disabled,\n      required && styles.required,\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n    return (\n      <div className={styles.checkboxWrapper}>\n        <div className={styles.inputGroup}>\n          <input\n            ref={ref}\n            id={id}\n            type=\"checkbox\"\n            className={checkboxClasses}\n            disabled={disabled}\n            required={required}\n            aria-invalid={error ? true : undefined}\n            aria-describedby={describedBy}\n            aria-required={required || undefined}\n            {...props}\n          />\n\n          <label htmlFor={id} className={labelClasses}>\n            {label}\n            {required && (\n              <span className={styles.requiredIndicator} aria-label=\"required\">\n                {\" \"}\n                *\n              </span>\n            )}\n          </label>\n        </div>\n\n        {helperText && !error && (\n          <span id={helperTextId} className={styles.helperText}>\n            {helperText}\n          </span>\n        )}\n\n        {error && (\n          <span id={errorId} className={styles.errorText} role=\"alert\">\n            {error}\n          </span>\n        )}\n      </div>\n    );\n  }\n);\n\nCheckbox.displayName = \"Checkbox\";\n"],"names":["Button","React","variant","size","children","disabled","loading","fullWidth","className","type","onClick","props","ref","isDisabled","handleClick","event","handleKeyDown","classNames","styles","jsxs","jsx","Input","label","error","helperText","hideLabel","required","providedId","generatedId","useId","id","errorId","helperTextId","describedBy","inputClasses","labelClasses","Checkbox","checkboxClasses"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":["../src/atoms/Button/Button.tsx","../src/atoms/Input/Input.tsx","../src/atoms/Checkbox/Checkbox.tsx"],"sourcesContent":["// src/atoms/Button/Button.tsx\nimport React from 'react';\nimport styles from './Button.module.css';\n\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  variant?: 'primary' | 'secondary' | 'danger';\n  size?: 'small' | 'medium' | 'large';\n  children: React.ReactNode;\n  loading?: boolean;\n  fullWidth?: boolean;\n}\n\n/**\n * Accessible button component following WCAG 2.1 AA standards\n *\n * Features:\n * - Native <button> element for semantic HTML\n * - Full keyboard support (Tab, Enter, Space)\n * - Screen reader announcements for loading state\n * - Visible focus indicator\n * - Color contrast compliant\n *\n * @example\n * ```tsx\n * <Button variant=\"primary\" onClick={handleClick}>\n *   Click me\n * </Button>\n *\n * <Button loading disabled>\n *   Submitting...\n * </Button>\n * ```\n */\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      variant = 'primary',\n      size = 'medium',\n      children,\n      disabled = false,\n      loading = false,\n      fullWidth = false,\n      className,\n      type = 'button',\n      onClick,\n      ...props\n    },\n    ref\n  ) => {\n    const isDisabled = disabled || loading;\n\n    // Handle click with disabled check (prevents action but keeps focusable)\n    const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n      if (isDisabled) {\n        event.preventDefault();\n        return;\n      }\n      onClick?.(event);\n    };\n\n    // Handle keyboard events to prevent action when disabled\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n      if (isDisabled && (event.key === 'Enter' || event.key === ' ')) {\n        event.preventDefault();\n      }\n    };\n\n    const classNames = [\n      styles.button,\n      styles[variant],\n      styles[size],\n      loading && styles.loading,\n      fullWidth && styles.fullWidth,\n      isDisabled && styles.disabled,\n      className,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    return (\n      <button\n        ref={ref}\n        type={type}\n        className={classNames}\n        aria-disabled={isDisabled}\n        aria-busy={loading || undefined}\n        onClick={handleClick}\n        onKeyDown={handleKeyDown}\n        {...props}\n      >\n        {loading && (\n          <span role=\"status\" aria-live=\"polite\" className={styles.loadingContainer}>\n            <span className={styles.spinner} aria-hidden=\"true\" />\n            <span className={styles.srOnly}>Loading...</span>\n          </span>\n        )}\n        <span aria-hidden={loading || undefined}>{children}</span>\n      </button>\n    );\n  }\n);\n\nButton.displayName = 'Button';\n","import React, { useId } from 'react';\nimport styles from './Input.module.css';\n\nexport interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'> {\n  /**\n   * Input label (required for accessibility)\n   */\n  label: string;\n\n  /**\n   * Input type\n   * @default \"text\"\n   */\n  type?: 'text' | 'email' | 'password' | 'tel' | 'url' | 'search' | 'number';\n\n  /**\n   * Input size\n   * @default \"medium\"\n   */\n  size?: 'small' | 'medium' | 'large';\n\n  /**\n   * Error message (when present, input is marked as invalid)\n   */\n  error?: string;\n\n  /**\n   * Helper text (additional description)\n   */\n  helperText?: string;\n\n  /**\n   * Full width input\n   * @default false\n   */\n  fullWidth?: boolean;\n\n  /**\n   * Hide label visually but keep it for screen readers\n   * @default false\n   */\n  hideLabel?: boolean;\n}\n\n/**\n * Accessible Input component following WCAG 2.1 AA standards\n *\n * Features:\n * - Native <input> element for semantic HTML\n * - Proper label association via htmlFor\n * - Error states with aria-invalid and aria-describedby\n * - Helper text support\n * - Visible focus indicator\n * - Required indicator\n *\n * @example\n * ```tsx\n * <Input\n *   label=\"Email\"\n *   type=\"email\"\n *   required\n *   error=\"Invalid email address\"\n *   helperText=\"We'll never share your email\"\n * />\n * ```\n */\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n  (\n    {\n      label,\n      type = 'text',\n      size = 'medium',\n      error,\n      helperText,\n      fullWidth = false,\n      hideLabel = false,\n      required = false,\n      disabled = false,\n      className,\n      id: providedId,\n      ...props\n    },\n    ref\n  ) => {\n    // Generate unique IDs for accessibility\n    const generatedId = useId();\n    const id = providedId || generatedId;\n    const errorId = error ? `${id}-error` : undefined;\n    const helperTextId = helperText ? `${id}-helper` : undefined;\n\n    // Build aria-describedby\n    const describedBy = [errorId, helperTextId].filter(Boolean).join(' ') || undefined;\n\n    const inputClasses = [\n      styles.input,\n      styles[size],\n      error && styles.error,\n      disabled && styles.disabled,\n      fullWidth && styles.fullWidth,\n      className,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    const labelClasses = [\n      styles.label,\n      hideLabel && styles.visuallyHidden,\n      required && styles.required,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    return (\n      <div className={`${styles.inputWrapper} ${fullWidth ? styles.fullWidth : ''}`}>\n        <label htmlFor={id} className={labelClasses}>\n          {label}\n          {required && (\n            <span className={styles.requiredIndicator} aria-label=\"required\">\n              {' '}\n              *\n            </span>\n          )}\n        </label>\n\n        <input\n          ref={ref}\n          id={id}\n          type={type}\n          className={inputClasses}\n          required={required}\n          disabled={disabled}\n          aria-invalid={error ? true : undefined}\n          aria-describedby={describedBy}\n          aria-required={required || undefined}\n          {...props}\n        />\n\n        {helperText && !error && (\n          <span id={helperTextId} className={styles.helperText}>\n            {helperText}\n          </span>\n        )}\n\n        {error && (\n          <span id={errorId} className={styles.errorText} role=\"alert\">\n            {error}\n          </span>\n        )}\n      </div>\n    );\n  }\n);\n\nInput.displayName = 'Input';\n","import React, { useId, useEffect, useRef } from 'react';\nimport styles from './Checkbox.module.css';\n\nexport interface CheckboxProps extends Omit<\n  React.InputHTMLAttributes<HTMLInputElement>,\n  'size' | 'type'\n> {\n  label: string;\n  size?: 'small' | 'medium' | 'large';\n  error?: string;\n  helperText?: string;\n  indeterminate?: boolean;\n}\n\nexport const Checkbox = React.forwardRef<HTMLInputElement, CheckboxProps>(\n  (\n    {\n      label,\n      size = 'medium',\n      error,\n      helperText,\n      disabled = false,\n      required = false,\n      indeterminate = false,\n      className,\n      id: providedId,\n      ...props\n    },\n    ref\n  ) => {\n    const internalRef = useRef<HTMLInputElement>(null);\n    const checkboxRef = (ref as React.RefObject<HTMLInputElement>) || internalRef;\n\n    const generatedId = useId();\n    const id = providedId || generatedId;\n    const errorId = error ? `${id}-error` : undefined;\n    const helperTextId = helperText ? `${id}-helper` : undefined;\n\n    const describedBy = [errorId, helperTextId].filter(Boolean).join(' ') || undefined;\n\n    useEffect(() => {\n      if (checkboxRef.current) {\n        checkboxRef.current.indeterminate = indeterminate;\n      }\n    }, [indeterminate, checkboxRef]);\n\n    const checkboxClasses = [\n      styles.checkbox,\n      styles[size],\n      error && styles.error,\n      disabled && styles.disabled,\n      indeterminate && styles.indeterminate,\n      className,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    const labelClasses = [styles.label, disabled && styles.disabled, required && styles.required]\n      .filter(Boolean)\n      .join(' ');\n\n    return (\n      <div className={styles.checkboxWrapper}>\n        <div className={styles.inputGroup}>\n          <input\n            ref={checkboxRef}\n            id={id}\n            type=\"checkbox\"\n            className={checkboxClasses}\n            disabled={disabled}\n            required={required}\n            aria-invalid={error ? true : undefined}\n            aria-describedby={describedBy}\n            aria-required={required || undefined}\n            aria-checked={indeterminate ? 'mixed' : undefined}\n            {...props}\n          />\n\n          <label htmlFor={id} className={labelClasses}>\n            {label}\n            {required && (\n              <span className={styles.requiredIndicator} aria-label=\"required\">\n                {' '}\n                *\n              </span>\n            )}\n          </label>\n        </div>\n\n        {helperText && !error && (\n          <span id={helperTextId} className={styles.helperText}>\n            {helperText}\n          </span>\n        )}\n\n        {error && (\n          <span id={errorId} className={styles.errorText} role=\"alert\">\n            {error}\n          </span>\n        )}\n      </div>\n    );\n  }\n);\n\nCheckbox.displayName = 'Checkbox';\n"],"names":["Button","React","variant","size","children","disabled","loading","fullWidth","className","type","onClick","props","ref","isDisabled","handleClick","event","handleKeyDown","classNames","styles","jsxs","jsx","Input","label","error","helperText","hideLabel","required","providedId","generatedId","useId","id","errorId","helperTextId","describedBy","inputClasses","labelClasses","Checkbox","indeterminate","internalRef","useRef","checkboxRef","useEffect","checkboxClasses"],"mappings":"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"}

package/dist/index.d.ts

@@ -24,57 +24,21 @@ import { default as default_2 } from 'react';
 export declare const Button: default_2.ForwardRefExoticComponent<ButtonProps & default_2.RefAttributes<HTMLButtonElement>>;
 
 export declare interface ButtonProps extends default_2.ButtonHTMLAttributes<HTMLButtonElement> {
-    variant?: "primary" | "secondary" | "danger";
-    size?: "small" | "medium" | "large";
+    variant?: 'primary' | 'secondary' | 'danger';
+    size?: 'small' | 'medium' | 'large';
     children: default_2.ReactNode;
     loading?: boolean;
     fullWidth?: boolean;
 }
 
-/**
- * Accessible Checkbox component following WCAG 2.1 AA standards
- *
- * Features:
- * - Native <input type="checkbox"> element for semantic HTML
- * - Proper label association via htmlFor
- * - Space key toggles checked state (native behavior)
- * - Error states with aria-invalid and aria-describedby
- * - Helper text support
- * - Visible focus indicator
- * - Required indicator
- *
- * @example
- * ```tsx
- * <Checkbox label="I agree to terms" required />
- *
- * <Checkbox
- *   label="Subscribe to newsletter"
- *   checked={isChecked}
- *   onChange={(e) => setIsChecked(e.target.checked)}
- *   error="This field is required"
- * />
- * ```
- */
 export declare const Checkbox: default_2.ForwardRefExoticComponent<CheckboxProps & default_2.RefAttributes<HTMLInputElement>>;
 
-export declare interface CheckboxProps extends Omit<default_2.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> {
-    /**
-     * Checkbox label (required for accessibility)
-     */
+export declare interface CheckboxProps extends Omit<default_2.InputHTMLAttributes<HTMLInputElement>, 'size' | 'type'> {
     label: string;
-    /**
-     * Checkbox size
-     * @default "medium"
-     */
-    size?: "small" | "medium" | "large";
-    /**
-     * Error message (when present, checkbox is marked as invalid)
-     */
+    size?: 'small' | 'medium' | 'large';
     error?: string;
-    /**
-     * Helper text (additional description)
-     */
     helperText?: string;
+    indeterminate?: boolean;
 }
 
 /**
@@ -101,7 +65,7 @@ export declare interface CheckboxProps extends Omit<default_2.InputHTMLAttribute
  */
 export declare const Input: default_2.ForwardRefExoticComponent<InputProps & default_2.RefAttributes<HTMLInputElement>>;
 
-export declare interface InputProps extends Omit<default_2.InputHTMLAttributes<HTMLInputElement>, "size"> {
+export declare interface InputProps extends Omit<default_2.InputHTMLAttributes<HTMLInputElement>, 'size'> {
     /**
      * Input label (required for accessibility)
      */
@@ -110,12 +74,12 @@ export declare interface InputProps extends Omit<default_2.InputHTMLAttributes<H
      * Input type
      * @default "text"
      */
-    type?: "text" | "email" | "password" | "tel" | "url" | "search" | "number";
+    type?: 'text' | 'email' | 'password' | 'tel' | 'url' | 'search' | 'number';
     /**
      * Input size
      * @default "medium"
      */
-    size?: "small" | "medium" | "large";
+    size?: 'small' | 'medium' | 'large';
     /**
      * Error message (when present, input is marked as invalid)
      */

package/dist/index.js

@@ -1,218 +1,217 @@
-import { jsxs as p, jsx as o } from "react/jsx-runtime";
-import $, { useId as g } from "react";
-const T = "_button_1003x_2", C = "_disabled_1003x_26", q = "_primary_1003x_33", B = "_secondary_1003x_46", j = "_danger_1003x_59", w = "_small_1003x_73", D = "_medium_1003x_78", G = "_large_1003x_83", H = "_fullWidth_1003x_89", O = "_loading_1003x_94", R = "_loadingContainer_1003x_98", F = "_spinner_1003x_104", K = "_spin_1003x_104", E = "_srOnly_1003x_121", c = {
-  button: T,
-  disabled: C,
-  primary: q,
-  secondary: B,
-  danger: j,
-  small: w,
-  medium: D,
-  large: G,
-  fullWidth: H,
-  loading: O,
-  loadingContainer: R,
-  spinner: F,
-  spin: K,
-  srOnly: E
-}, L = $.forwardRef(
+import { jsxs as d, jsx as c } from "react/jsx-runtime";
+import $, { useId as I, useRef as W, useEffect as T } from "react";
+const C = "_button_f4jhn_2", q = "_disabled_f4jhn_26", B = "_primary_f4jhn_33", R = "_secondary_f4jhn_46", w = "_danger_f4jhn_59", D = "_small_f4jhn_73", G = "_medium_f4jhn_78", H = "_large_f4jhn_83", O = "_fullWidth_f4jhn_89", E = "_loading_f4jhn_94", F = "_loadingContainer_f4jhn_98", K = "_spinner_f4jhn_104", L = "_spin_f4jhn_104", z = "_srOnly_f4jhn_121", t = {
+  button: C,
+  disabled: q,
+  primary: B,
+  secondary: R,
+  danger: w,
+  small: D,
+  medium: G,
+  large: H,
+  fullWidth: O,
+  loading: E,
+  loadingContainer: F,
+  spinner: K,
+  spin: L,
+  srOnly: z
+}, A = $.forwardRef(
   ({
-    variant: b = "primary",
-    size: x = "medium",
-    children: n,
-    disabled: a = !1,
+    variant: m = "primary",
+    size: f = "medium",
+    children: o,
+    disabled: l = !1,
     loading: e = !1,
-    fullWidth: t = !1,
-    className: f,
-    type: d = "button",
-    onClick: u,
-    ...y
-  }, v) => {
-    const i = a || e, m = (l) => {
-      if (i) {
-        l.preventDefault();
+    fullWidth: i = !1,
+    className: _,
+    type: u = "button",
+    onClick: h,
+    ...v
+  }, g) => {
+    const p = l || e, b = (r) => {
+      if (p) {
+        r.preventDefault();
         return;
       }
-      u?.(l);
-    }, h = (l) => {
-      i && (l.key === "Enter" || l.key === " ") && l.preventDefault();
-    }, _ = [
-      c.button,
-      c[b],
-      c[x],
-      e && c.loading,
-      t && c.fullWidth,
-      i && c.disabled,
-      f
+      h?.(r);
+    }, k = (r) => {
+      p && (r.key === "Enter" || r.key === " ") && r.preventDefault();
+    }, s = [
+      t.button,
+      t[m],
+      t[f],
+      e && t.loading,
+      i && t.fullWidth,
+      p && t.disabled,
+      _
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ p(
+    return /* @__PURE__ */ d(
       "button",
       {
-        ref: v,
-        type: d,
-        className: _,
-        "aria-disabled": i,
+        ref: g,
+        type: u,
+        className: s,
+        "aria-disabled": p,
         "aria-busy": e || void 0,
-        onClick: m,
-        onKeyDown: h,
-        ...y,
+        onClick: b,
+        onKeyDown: k,
+        ...v,
         children: [
-          e && /* @__PURE__ */ p(
-            "span",
-            {
-              role: "status",
-              "aria-live": "polite",
-              className: c.loadingContainer,
-              children: [
-                /* @__PURE__ */ o("span", { className: c.spinner, "aria-hidden": "true" }),
-                /* @__PURE__ */ o("span", { className: c.srOnly, children: "Loading..." })
-              ]
-            }
-          ),
-          /* @__PURE__ */ o("span", { "aria-hidden": e || void 0, children: n })
+          e && /* @__PURE__ */ d("span", { role: "status", "aria-live": "polite", className: t.loadingContainer, children: [
+            /* @__PURE__ */ c("span", { className: t.spinner, "aria-hidden": "true" }),
+            /* @__PURE__ */ c("span", { className: t.srOnly, children: "Loading..." })
+          ] }),
+          /* @__PURE__ */ c("span", { "aria-hidden": e || void 0, children: o })
         ]
       }
     );
   }
 );
-L.displayName = "Button";
-const z = "_inputWrapper_sim0c_2", A = "_fullWidth_sim0c_8", J = "_label_sim0c_13", M = "_required_sim0c_20", P = "_requiredIndicator_sim0c_24", Q = "_input_sim0c_2", S = "_small_sim0c_53", U = "_medium_sim0c_58", V = "_large_sim0c_63", X = "_error_sim0c_69", Y = "_disabled_sim0c_78", Z = "_helperText_sim0c_91", ee = "_errorText_sim0c_92", se = "_visuallyHidden_sim0c_107", s = {
-  inputWrapper: z,
-  fullWidth: A,
-  label: J,
-  required: M,
-  requiredIndicator: P,
-  input: Q,
-  small: S,
-  medium: U,
-  large: V,
-  error: X,
-  disabled: Y,
-  helperText: Z,
-  errorText: ee,
-  visuallyHidden: se
-}, ae = $.forwardRef(
+A.displayName = "Button";
+const J = "_inputWrapper_kbgao_2", M = "_fullWidth_kbgao_8", P = "_label_kbgao_13", Q = "_required_kbgao_20", S = "_requiredIndicator_kbgao_24", U = "_input_kbgao_2", V = "_small_kbgao_53", X = "_medium_kbgao_58", Y = "_large_kbgao_63", Z = "_error_kbgao_69", ee = "_disabled_kbgao_78", ae = "_helperText_kbgao_91", ne = "_errorText_kbgao_92", le = "_visuallyHidden_kbgao_107", a = {
+  inputWrapper: J,
+  fullWidth: M,
+  label: P,
+  required: Q,
+  requiredIndicator: S,
+  input: U,
+  small: V,
+  medium: X,
+  large: Y,
+  error: Z,
+  disabled: ee,
+  helperText: ae,
+  errorText: ne,
+  visuallyHidden: le
+}, re = $.forwardRef(
   ({
-    label: b,
-    type: x = "text",
-    size: n = "medium",
-    error: a,
+    label: m,
+    type: f = "text",
+    size: o = "medium",
+    error: l,
     helperText: e,
-    fullWidth: t = !1,
-    hideLabel: f = !1,
-    required: d = !1,
-    disabled: u = !1,
-    className: y,
-    id: v,
-    ...i
-  }, m) => {
-    const h = g(), _ = v || h, l = a ? `${_}-error` : void 0, N = e ? `${_}-helper` : void 0, I = [l, N].filter(Boolean).join(" ") || void 0, k = [
-      s.input,
-      s[n],
-      a && s.error,
-      u && s.disabled,
-      t && s.fullWidth,
-      y
-    ].filter(Boolean).join(" "), W = [
-      s.label,
-      f && s.visuallyHidden,
-      d && s.required
+    fullWidth: i = !1,
+    hideLabel: _ = !1,
+    required: u = !1,
+    disabled: h = !1,
+    className: v,
+    id: g,
+    ...p
+  }, b) => {
+    const k = I(), s = g || k, r = l ? `${s}-error` : void 0, x = e ? `${s}-helper` : void 0, y = [r, x].filter(Boolean).join(" ") || void 0, j = [
+      a.input,
+      a[o],
+      l && a.error,
+      h && a.disabled,
+      i && a.fullWidth,
+      v
+    ].filter(Boolean).join(" "), N = [
+      a.label,
+      _ && a.visuallyHidden,
+      u && a.required
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ p("div", { className: `${s.inputWrapper} ${t ? s.fullWidth : ""}`, children: [
-      /* @__PURE__ */ p("label", { htmlFor: _, className: W, children: [
-        b,
-        d && /* @__PURE__ */ o("span", { className: s.requiredIndicator, "aria-label": "required", children: " *" })
+    return /* @__PURE__ */ d("div", { className: `${a.inputWrapper} ${i ? a.fullWidth : ""}`, children: [
+      /* @__PURE__ */ d("label", { htmlFor: s, className: N, children: [
+        m,
+        u && /* @__PURE__ */ d("span", { className: a.requiredIndicator, "aria-label": "required", children: [
+          " ",
+          "*"
+        ] })
       ] }),
-      /* @__PURE__ */ o(
+      /* @__PURE__ */ c(
         "input",
         {
-          ref: m,
-          id: _,
-          type: x,
-          className: k,
-          required: d,
-          disabled: u,
-          "aria-invalid": a ? !0 : void 0,
-          "aria-describedby": I,
-          "aria-required": d || void 0,
-          ...i
+          ref: b,
+          id: s,
+          type: f,
+          className: j,
+          required: u,
+          disabled: h,
+          "aria-invalid": l ? !0 : void 0,
+          "aria-describedby": y,
+          "aria-required": u || void 0,
+          ...p
         }
       ),
-      e && !a && /* @__PURE__ */ o("span", { id: N, className: s.helperText, children: e }),
-      a && /* @__PURE__ */ o("span", { id: l, className: s.errorText, role: "alert", children: a })
+      e && !l && /* @__PURE__ */ c("span", { id: x, className: a.helperText, children: e }),
+      l && /* @__PURE__ */ c("span", { id: r, className: a.errorText, role: "alert", children: l })
     ] });
   }
 );
-ae.displayName = "Input";
-const re = "_checkboxWrapper_8c7eh_2", ie = "_inputGroup_8c7eh_9", le = "_checkbox_8c7eh_2", ne = "_error_8c7eh_69", oe = "_small_8c7eh_75", te = "_large_8c7eh_88", ce = "_label_8c7eh_102", de = "_disabled_8c7eh_110", _e = "_requiredIndicator_8c7eh_116", pe = "_helperText_8c7eh_122", ue = "_errorText_8c7eh_130", r = {
-  checkboxWrapper: re,
-  inputGroup: ie,
-  checkbox: le,
-  error: ne,
-  small: oe,
-  large: te,
-  label: ce,
-  disabled: de,
-  requiredIndicator: _e,
-  helperText: pe,
-  errorText: ue
-}, me = $.forwardRef(
+re.displayName = "Input";
+const se = "_checkboxWrapper_lv2u7_1", oe = "_inputGroup_lv2u7_7", ie = "_checkbox_lv2u7_1", te = "_indeterminate_lv2u7_49", de = "_error_lv2u7_76", ce = "_small_lv2u7_81", _e = "_large_lv2u7_94", ue = "_label_lv2u7_117", pe = "_disabled_lv2u7_125", be = "_requiredIndicator_lv2u7_130", he = "_helperText_lv2u7_135", me = "_errorText_lv2u7_142", n = {
+  checkboxWrapper: se,
+  inputGroup: oe,
+  checkbox: ie,
+  indeterminate: te,
+  error: de,
+  small: ce,
+  large: _e,
+  label: ue,
+  disabled: pe,
+  requiredIndicator: be,
+  helperText: he,
+  errorText: me
+}, fe = $.forwardRef(
   ({
-    label: b,
-    size: x = "medium",
-    error: n,
-    helperText: a,
+    label: m,
+    size: f = "medium",
+    error: o,
+    helperText: l,
     disabled: e = !1,
-    required: t = !1,
-    className: f,
-    id: d,
-    ...u
-  }, y) => {
-    const v = g(), i = d || v, m = n ? `${i}-error` : void 0, h = a ? `${i}-helper` : void 0, _ = [m, h].filter(Boolean).join(" ") || void 0, l = [
-      r.checkbox,
-      r[x],
-      n && r.error,
-      e && r.disabled,
-      f
-    ].filter(Boolean).join(" "), N = [
-      r.label,
-      e && r.disabled,
-      t && r.required
-    ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ p("div", { className: r.checkboxWrapper, children: [
-      /* @__PURE__ */ p("div", { className: r.inputGroup, children: [
-        /* @__PURE__ */ o(
+    required: i = !1,
+    indeterminate: _ = !1,
+    className: u,
+    id: h,
+    ...v
+  }, g) => {
+    const p = W(null), b = g || p, k = I(), s = h || k, r = o ? `${s}-error` : void 0, x = l ? `${s}-helper` : void 0, y = [r, x].filter(Boolean).join(" ") || void 0;
+    T(() => {
+      b.current && (b.current.indeterminate = _);
+    }, [_, b]);
+    const j = [
+      n.checkbox,
+      n[f],
+      o && n.error,
+      e && n.disabled,
+      _ && n.indeterminate,
+      u
+    ].filter(Boolean).join(" "), N = [n.label, e && n.disabled, i && n.required].filter(Boolean).join(" ");
+    return /* @__PURE__ */ d("div", { className: n.checkboxWrapper, children: [
+      /* @__PURE__ */ d("div", { className: n.inputGroup, children: [
+        /* @__PURE__ */ c(
           "input",
           {
-            ref: y,
-            id: i,
+            ref: b,
+            id: s,
             type: "checkbox",
-            className: l,
+            className: j,
             disabled: e,
-            required: t,
-            "aria-invalid": n ? !0 : void 0,
-            "aria-describedby": _,
-            "aria-required": t || void 0,
-            ...u
+            required: i,
+            "aria-invalid": o ? !0 : void 0,
+            "aria-describedby": y,
+            "aria-required": i || void 0,
+            "aria-checked": _ ? "mixed" : void 0,
+            ...v
           }
         ),
-        /* @__PURE__ */ p("label", { htmlFor: i, className: N, children: [
-          b,
-          t && /* @__PURE__ */ p("span", { className: r.requiredIndicator, "aria-label": "required", children: [
+        /* @__PURE__ */ d("label", { htmlFor: s, className: N, children: [
+          m,
+          i && /* @__PURE__ */ d("span", { className: n.requiredIndicator, "aria-label": "required", children: [
             " ",
             "*"
           ] })
         ] })
       ] }),
-      a && !n && /* @__PURE__ */ o("span", { id: h, className: r.helperText, children: a }),
-      n && /* @__PURE__ */ o("span", { id: m, className: r.errorText, role: "alert", children: n })
+      l && !o && /* @__PURE__ */ c("span", { id: x, className: n.helperText, children: l }),
+      o && /* @__PURE__ */ c("span", { id: r, className: n.errorText, role: "alert", children: o })
     ] });
   }
 );
-me.displayName = "Checkbox";
+fe.displayName = "Checkbox";
 export {
-  L as Button,
-  me as Checkbox,
-  ae as Input
+  A as Button,
+  fe as Checkbox,
+  re as Input
 };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/atoms/Button/Button.tsx","../src/atoms/Input/Input.tsx","../src/atoms/Checkbox/Checkbox.tsx"],"sourcesContent":["// src/atoms/Button/Button.tsx\nimport React from \"react\";\nimport styles from \"./Button.module.css\";\n\nexport interface ButtonProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  variant?: \"primary\" | \"secondary\" | \"danger\";\n  size?: \"small\" | \"medium\" | \"large\";\n  children: React.ReactNode;\n  loading?: boolean;\n  fullWidth?: boolean;\n}\n\n/**\n * Accessible button component following WCAG 2.1 AA standards\n *\n * Features:\n * - Native <button> element for semantic HTML\n * - Full keyboard support (Tab, Enter, Space)\n * - Screen reader announcements for loading state\n * - Visible focus indicator\n * - Color contrast compliant\n *\n * @example\n * ```tsx\n * <Button variant=\"primary\" onClick={handleClick}>\n *   Click me\n * </Button>\n *\n * <Button loading disabled>\n *   Submitting...\n * </Button>\n * ```\n */\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      variant = \"primary\",\n      size = \"medium\",\n      children,\n      disabled = false,\n      loading = false,\n      fullWidth = false,\n      className,\n      type = \"button\",\n      onClick,\n      ...props\n    },\n    ref\n  ) => {\n    const isDisabled = disabled || loading;\n\n    // Handle click with disabled check (prevents action but keeps focusable)\n    const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n      if (isDisabled) {\n        event.preventDefault();\n        return;\n      }\n      onClick?.(event);\n    };\n\n    // Handle keyboard events to prevent action when disabled\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n      if (isDisabled && (event.key === \"Enter\" || event.key === \" \")) {\n        event.preventDefault();\n      }\n    };\n\n    const classNames = [\n      styles.button,\n      styles[variant],\n      styles[size],\n      loading && styles.loading,\n      fullWidth && styles.fullWidth,\n      isDisabled && styles.disabled,\n      className,\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n    return (\n      <button\n        ref={ref}\n        type={type}\n        className={classNames}\n        aria-disabled={isDisabled}\n        aria-busy={loading || undefined}\n        onClick={handleClick}\n        onKeyDown={handleKeyDown}\n        {...props}\n      >\n        {loading && (\n          <span\n            role=\"status\"\n            aria-live=\"polite\"\n            className={styles.loadingContainer}\n          >\n            <span className={styles.spinner} aria-hidden=\"true\" />\n            <span className={styles.srOnly}>Loading...</span>\n          </span>\n        )}\n        <span aria-hidden={loading || undefined}>{children}</span>\n      </button>\n    );\n  }\n);\n\nButton.displayName = \"Button\";\n","import React, { useId } from \"react\";\nimport styles from \"./Input.module.css\";\n\nexport interface InputProps\n  extends Omit<React.InputHTMLAttributes<HTMLInputElement>, \"size\"> {\n  /**\n   * Input label (required for accessibility)\n   */\n  label: string;\n\n  /**\n   * Input type\n   * @default \"text\"\n   */\n  type?: \"text\" | \"email\" | \"password\" | \"tel\" | \"url\" | \"search\" | \"number\";\n\n  /**\n   * Input size\n   * @default \"medium\"\n   */\n  size?: \"small\" | \"medium\" | \"large\";\n\n  /**\n   * Error message (when present, input is marked as invalid)\n   */\n  error?: string;\n\n  /**\n   * Helper text (additional description)\n   */\n  helperText?: string;\n\n  /**\n   * Full width input\n   * @default false\n   */\n  fullWidth?: boolean;\n\n  /**\n   * Hide label visually but keep it for screen readers\n   * @default false\n   */\n  hideLabel?: boolean;\n}\n\n/**\n * Accessible Input component following WCAG 2.1 AA standards\n *\n * Features:\n * - Native <input> element for semantic HTML\n * - Proper label association via htmlFor\n * - Error states with aria-invalid and aria-describedby\n * - Helper text support\n * - Visible focus indicator\n * - Required indicator\n *\n * @example\n * ```tsx\n * <Input\n *   label=\"Email\"\n *   type=\"email\"\n *   required\n *   error=\"Invalid email address\"\n *   helperText=\"We'll never share your email\"\n * />\n * ```\n */\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n  (\n    {\n      label,\n      type = \"text\",\n      size = \"medium\",\n      error,\n      helperText,\n      fullWidth = false,\n      hideLabel = false,\n      required = false,\n      disabled = false,\n      className,\n      id: providedId,\n      ...props\n    },\n    ref\n  ) => {\n    // Generate unique IDs for accessibility\n    const generatedId = useId();\n    const id = providedId || generatedId;\n    const errorId = error ? `${id}-error` : undefined;\n    const helperTextId = helperText ? `${id}-helper` : undefined;\n\n    // Build aria-describedby\n    const describedBy = [errorId, helperTextId].filter(Boolean).join(\" \") || undefined;\n\n    const inputClasses = [\n      styles.input,\n      styles[size],\n      error && styles.error,\n      disabled && styles.disabled,\n      fullWidth && styles.fullWidth,\n      className,\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n    const labelClasses = [\n      styles.label,\n      hideLabel && styles.visuallyHidden,\n      required && styles.required,\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n    return (\n      <div className={`${styles.inputWrapper} ${fullWidth ? styles.fullWidth : \"\"}`}>\n        <label htmlFor={id} className={labelClasses}>\n          {label}\n          {required && <span className={styles.requiredIndicator} aria-label=\"required\"> *</span>}\n        </label>\n\n        <input\n          ref={ref}\n          id={id}\n          type={type}\n          className={inputClasses}\n          required={required}\n          disabled={disabled}\n          aria-invalid={error ? true : undefined}\n          aria-describedby={describedBy}\n          aria-required={required || undefined}\n          {...props}\n        />\n\n        {helperText && !error && (\n          <span id={helperTextId} className={styles.helperText}>\n            {helperText}\n          </span>\n        )}\n\n        {error && (\n          <span id={errorId} className={styles.errorText} role=\"alert\">\n            {error}\n          </span>\n        )}\n      </div>\n    );\n  }\n);\n\nInput.displayName = \"Input\";\n","import React, { useId } from \"react\";\nimport styles from \"./Checkbox.module.css\";\n\nexport interface CheckboxProps\n  extends Omit<React.InputHTMLAttributes<HTMLInputElement>, \"size\" | \"type\"> {\n  /**\n   * Checkbox label (required for accessibility)\n   */\n  label: string;\n\n  /**\n   * Checkbox size\n   * @default \"medium\"\n   */\n  size?: \"small\" | \"medium\" | \"large\";\n\n  /**\n   * Error message (when present, checkbox is marked as invalid)\n   */\n  error?: string;\n\n  /**\n   * Helper text (additional description)\n   */\n  helperText?: string;\n}\n\n/**\n * Accessible Checkbox component following WCAG 2.1 AA standards\n *\n * Features:\n * - Native <input type=\"checkbox\"> element for semantic HTML\n * - Proper label association via htmlFor\n * - Space key toggles checked state (native behavior)\n * - Error states with aria-invalid and aria-describedby\n * - Helper text support\n * - Visible focus indicator\n * - Required indicator\n *\n * @example\n * ```tsx\n * <Checkbox label=\"I agree to terms\" required />\n *\n * <Checkbox\n *   label=\"Subscribe to newsletter\"\n *   checked={isChecked}\n *   onChange={(e) => setIsChecked(e.target.checked)}\n *   error=\"This field is required\"\n * />\n * ```\n */\nexport const Checkbox = React.forwardRef<HTMLInputElement, CheckboxProps>(\n  (\n    {\n      label,\n      size = \"medium\",\n      error,\n      helperText,\n      disabled = false,\n      required = false,\n      className,\n      id: providedId,\n      ...props\n    },\n    ref\n  ) => {\n    // Generate unique IDs for accessibility\n    const generatedId = useId();\n    const id = providedId || generatedId;\n    const errorId = error ? `${id}-error` : undefined;\n    const helperTextId = helperText ? `${id}-helper` : undefined;\n\n    // Build aria-describedby\n    const describedBy =\n      [errorId, helperTextId].filter(Boolean).join(\" \") || undefined;\n\n    const checkboxClasses = [\n      styles.checkbox,\n      styles[size],\n      error && styles.error,\n      disabled && styles.disabled,\n      className,\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n    const labelClasses = [\n      styles.label,\n      disabled && styles.disabled,\n      required && styles.required,\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n    return (\n      <div className={styles.checkboxWrapper}>\n        <div className={styles.inputGroup}>\n          <input\n            ref={ref}\n            id={id}\n            type=\"checkbox\"\n            className={checkboxClasses}\n            disabled={disabled}\n            required={required}\n            aria-invalid={error ? true : undefined}\n            aria-describedby={describedBy}\n            aria-required={required || undefined}\n            {...props}\n          />\n\n          <label htmlFor={id} className={labelClasses}>\n            {label}\n            {required && (\n              <span className={styles.requiredIndicator} aria-label=\"required\">\n                {\" \"}\n                *\n              </span>\n            )}\n          </label>\n        </div>\n\n        {helperText && !error && (\n          <span id={helperTextId} className={styles.helperText}>\n            {helperText}\n          </span>\n        )}\n\n        {error && (\n          <span id={errorId} className={styles.errorText} role=\"alert\">\n            {error}\n          </span>\n        )}\n      </div>\n    );\n  }\n);\n\nCheckbox.displayName = \"Checkbox\";\n"],"names":["Button","React","variant","size","children","disabled","loading","fullWidth","className","type","onClick","props","ref","isDisabled","handleClick","event","handleKeyDown","classNames","styles","jsxs","jsx","Input","label","error","helperText","hideLabel","required","providedId","generatedId","useId","id","errorId","helperTextId","describedBy","inputClasses","labelClasses","Checkbox","checkboxClasses"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../src/atoms/Button/Button.tsx","../src/atoms/Input/Input.tsx","../src/atoms/Checkbox/Checkbox.tsx"],"sourcesContent":["// src/atoms/Button/Button.tsx\nimport React from 'react';\nimport styles from './Button.module.css';\n\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  variant?: 'primary' | 'secondary' | 'danger';\n  size?: 'small' | 'medium' | 'large';\n  children: React.ReactNode;\n  loading?: boolean;\n  fullWidth?: boolean;\n}\n\n/**\n * Accessible button component following WCAG 2.1 AA standards\n *\n * Features:\n * - Native <button> element for semantic HTML\n * - Full keyboard support (Tab, Enter, Space)\n * - Screen reader announcements for loading state\n * - Visible focus indicator\n * - Color contrast compliant\n *\n * @example\n * ```tsx\n * <Button variant=\"primary\" onClick={handleClick}>\n *   Click me\n * </Button>\n *\n * <Button loading disabled>\n *   Submitting...\n * </Button>\n * ```\n */\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      variant = 'primary',\n      size = 'medium',\n      children,\n      disabled = false,\n      loading = false,\n      fullWidth = false,\n      className,\n      type = 'button',\n      onClick,\n      ...props\n    },\n    ref\n  ) => {\n    const isDisabled = disabled || loading;\n\n    // Handle click with disabled check (prevents action but keeps focusable)\n    const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n      if (isDisabled) {\n        event.preventDefault();\n        return;\n      }\n      onClick?.(event);\n    };\n\n    // Handle keyboard events to prevent action when disabled\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n      if (isDisabled && (event.key === 'Enter' || event.key === ' ')) {\n        event.preventDefault();\n      }\n    };\n\n    const classNames = [\n      styles.button,\n      styles[variant],\n      styles[size],\n      loading && styles.loading,\n      fullWidth && styles.fullWidth,\n      isDisabled && styles.disabled,\n      className,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    return (\n      <button\n        ref={ref}\n        type={type}\n        className={classNames}\n        aria-disabled={isDisabled}\n        aria-busy={loading || undefined}\n        onClick={handleClick}\n        onKeyDown={handleKeyDown}\n        {...props}\n      >\n        {loading && (\n          <span role=\"status\" aria-live=\"polite\" className={styles.loadingContainer}>\n            <span className={styles.spinner} aria-hidden=\"true\" />\n            <span className={styles.srOnly}>Loading...</span>\n          </span>\n        )}\n        <span aria-hidden={loading || undefined}>{children}</span>\n      </button>\n    );\n  }\n);\n\nButton.displayName = 'Button';\n","import React, { useId } from 'react';\nimport styles from './Input.module.css';\n\nexport interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'> {\n  /**\n   * Input label (required for accessibility)\n   */\n  label: string;\n\n  /**\n   * Input type\n   * @default \"text\"\n   */\n  type?: 'text' | 'email' | 'password' | 'tel' | 'url' | 'search' | 'number';\n\n  /**\n   * Input size\n   * @default \"medium\"\n   */\n  size?: 'small' | 'medium' | 'large';\n\n  /**\n   * Error message (when present, input is marked as invalid)\n   */\n  error?: string;\n\n  /**\n   * Helper text (additional description)\n   */\n  helperText?: string;\n\n  /**\n   * Full width input\n   * @default false\n   */\n  fullWidth?: boolean;\n\n  /**\n   * Hide label visually but keep it for screen readers\n   * @default false\n   */\n  hideLabel?: boolean;\n}\n\n/**\n * Accessible Input component following WCAG 2.1 AA standards\n *\n * Features:\n * - Native <input> element for semantic HTML\n * - Proper label association via htmlFor\n * - Error states with aria-invalid and aria-describedby\n * - Helper text support\n * - Visible focus indicator\n * - Required indicator\n *\n * @example\n * ```tsx\n * <Input\n *   label=\"Email\"\n *   type=\"email\"\n *   required\n *   error=\"Invalid email address\"\n *   helperText=\"We'll never share your email\"\n * />\n * ```\n */\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n  (\n    {\n      label,\n      type = 'text',\n      size = 'medium',\n      error,\n      helperText,\n      fullWidth = false,\n      hideLabel = false,\n      required = false,\n      disabled = false,\n      className,\n      id: providedId,\n      ...props\n    },\n    ref\n  ) => {\n    // Generate unique IDs for accessibility\n    const generatedId = useId();\n    const id = providedId || generatedId;\n    const errorId = error ? `${id}-error` : undefined;\n    const helperTextId = helperText ? `${id}-helper` : undefined;\n\n    // Build aria-describedby\n    const describedBy = [errorId, helperTextId].filter(Boolean).join(' ') || undefined;\n\n    const inputClasses = [\n      styles.input,\n      styles[size],\n      error && styles.error,\n      disabled && styles.disabled,\n      fullWidth && styles.fullWidth,\n      className,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    const labelClasses = [\n      styles.label,\n      hideLabel && styles.visuallyHidden,\n      required && styles.required,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    return (\n      <div className={`${styles.inputWrapper} ${fullWidth ? styles.fullWidth : ''}`}>\n        <label htmlFor={id} className={labelClasses}>\n          {label}\n          {required && (\n            <span className={styles.requiredIndicator} aria-label=\"required\">\n              {' '}\n              *\n            </span>\n          )}\n        </label>\n\n        <input\n          ref={ref}\n          id={id}\n          type={type}\n          className={inputClasses}\n          required={required}\n          disabled={disabled}\n          aria-invalid={error ? true : undefined}\n          aria-describedby={describedBy}\n          aria-required={required || undefined}\n          {...props}\n        />\n\n        {helperText && !error && (\n          <span id={helperTextId} className={styles.helperText}>\n            {helperText}\n          </span>\n        )}\n\n        {error && (\n          <span id={errorId} className={styles.errorText} role=\"alert\">\n            {error}\n          </span>\n        )}\n      </div>\n    );\n  }\n);\n\nInput.displayName = 'Input';\n","import React, { useId, useEffect, useRef } from 'react';\nimport styles from './Checkbox.module.css';\n\nexport interface CheckboxProps extends Omit<\n  React.InputHTMLAttributes<HTMLInputElement>,\n  'size' | 'type'\n> {\n  label: string;\n  size?: 'small' | 'medium' | 'large';\n  error?: string;\n  helperText?: string;\n  indeterminate?: boolean;\n}\n\nexport const Checkbox = React.forwardRef<HTMLInputElement, CheckboxProps>(\n  (\n    {\n      label,\n      size = 'medium',\n      error,\n      helperText,\n      disabled = false,\n      required = false,\n      indeterminate = false,\n      className,\n      id: providedId,\n      ...props\n    },\n    ref\n  ) => {\n    const internalRef = useRef<HTMLInputElement>(null);\n    const checkboxRef = (ref as React.RefObject<HTMLInputElement>) || internalRef;\n\n    const generatedId = useId();\n    const id = providedId || generatedId;\n    const errorId = error ? `${id}-error` : undefined;\n    const helperTextId = helperText ? `${id}-helper` : undefined;\n\n    const describedBy = [errorId, helperTextId].filter(Boolean).join(' ') || undefined;\n\n    useEffect(() => {\n      if (checkboxRef.current) {\n        checkboxRef.current.indeterminate = indeterminate;\n      }\n    }, [indeterminate, checkboxRef]);\n\n    const checkboxClasses = [\n      styles.checkbox,\n      styles[size],\n      error && styles.error,\n      disabled && styles.disabled,\n      indeterminate && styles.indeterminate,\n      className,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    const labelClasses = [styles.label, disabled && styles.disabled, required && styles.required]\n      .filter(Boolean)\n      .join(' ');\n\n    return (\n      <div className={styles.checkboxWrapper}>\n        <div className={styles.inputGroup}>\n          <input\n            ref={checkboxRef}\n            id={id}\n            type=\"checkbox\"\n            className={checkboxClasses}\n            disabled={disabled}\n            required={required}\n            aria-invalid={error ? true : undefined}\n            aria-describedby={describedBy}\n            aria-required={required || undefined}\n            aria-checked={indeterminate ? 'mixed' : undefined}\n            {...props}\n          />\n\n          <label htmlFor={id} className={labelClasses}>\n            {label}\n            {required && (\n              <span className={styles.requiredIndicator} aria-label=\"required\">\n                {' '}\n                *\n              </span>\n            )}\n          </label>\n        </div>\n\n        {helperText && !error && (\n          <span id={helperTextId} className={styles.helperText}>\n            {helperText}\n          </span>\n        )}\n\n        {error && (\n          <span id={errorId} className={styles.errorText} role=\"alert\">\n            {error}\n          </span>\n        )}\n      </div>\n    );\n  }\n);\n\nCheckbox.displayName = 'Checkbox';\n"],"names":["Button","React","variant","size","children","disabled","loading","fullWidth","className","type","onClick","props","ref","isDisabled","handleClick","event","handleKeyDown","classNames","styles","jsxs","jsx","Input","label","error","helperText","hideLabel","required","providedId","generatedId","useId","id","errorId","helperTextId","describedBy","inputClasses","labelClasses","Checkbox","indeterminate","internalRef","useRef","checkboxRef","useEffect","checkboxClasses"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flavia-dev/a11y-ui-kit-react",
-  "version": "0.1.6",
+  "version": "0.2.0",
   "description": "Enterprise-grade accessible React components library following WCAG 2.1 AA/AAA standards. Production-ready, type-safe, and fully customizable UI components with built-in accessibility.",
   "type": "module",
   "main": "./dist/index.cjs",
@@ -22,10 +22,9 @@
     "build": "tsc && vite build",
     "test": "vitest run",
     "test:watch": "vitest",
-    "test:unit": "vitest run --reporter=verbose \"src/atoms/**/*.utils.test.ts\"",
-    "test:component": "vitest run --reporter=verbose --run src/atoms/Input/Input.test.tsx src/atoms/Button/Button.test.tsx",
-    "test:a11y": "vitest run --reporter=verbose --run src/atoms/Input/Input.a11y.test.tsx src/atoms/Button/Button.a11y.test.tsx",
-    "test:contrast": "vitest run --reporter=verbose --run src/test/color-contrast.test.ts",
+    "test:unit": "vitest run --reporter=verbose src --exclude=\"src/**/*.a11y.test.tsx\"",
+    "test:a11y": "vitest run --reporter=verbose src/atoms/Button/Button.a11y.test.tsx src/atoms/Input/Input.a11y.test.tsx src/atoms/Checkbox/Checkbox.a11y.test.tsx src/atoms/Radio/Radio.a11y.test.tsx src/atoms/Icon/Icon.a11y.test.tsx",
+    "test:e2e": "playwright test tests/e2e",
     "test:coverage": "vitest run --coverage",
     "test:ui": "vitest --ui",
     "test:visual": "playwright test tests/visual",
@@ -35,14 +34,22 @@
     "test:visual:input": "playwright test tests/visual/Input.visual.test.ts",
     "test:visual:button:update": "playwright test tests/visual/Button.visual.test.ts --update-snapshots",
     "test:visual:input:update": "playwright test tests/visual/Input.visual.test.ts --update-snapshots",
-    "test:e2e": "playwright test tests/e2e",
     "test:e2e:button": "playwright test tests/e2e/Button.e2e.test.ts",
     "test:e2e:input": "playwright test tests/e2e/Input.e2e.test.ts",
+    "test:e2e:radio": "playwright test tests/e2e/Radio.e2e.test.ts",
+    "test:e2e:checkbox": "playwright test tests/e2e/Checkbox.e2e.test.ts",
+    "test:e2e:icon": "playwright test tests/e2e/Icon.e2e.test.ts",
     "test:e2e:ui": "playwright test tests/e2e --ui",
     "test:playwright": "playwright test",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build",
-    "typecheck": "tsc --noEmit"
+    "typecheck": "tsc --noEmit",
+    "lint": "eslint src --ext .ts,.tsx",
+    "lint:fix": "eslint src --ext .ts,.tsx --fix",
+    "format": "prettier --write \"src/**/*.{ts,tsx,css}\"",
+    "format:check": "prettier --check \"src/**/*.{ts,tsx,css}\"",
+    "prepublishOnly": "npm run typecheck && npm run build",
+    "prepare": "husky"
   },
   "keywords": [
     "react",
@@ -54,7 +61,7 @@
     "button",
     "typescript"
   ],
-  "author": "Your Name <your.email@example.com>",
+  "author": "Flavia",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -70,6 +77,8 @@
   },
   "devDependencies": {
     "@axe-core/react": "^4.11.0",
+    "@eslint/eslintrc": "^3.3.3",
+    "@eslint/js": "^9.39.2",
     "@playwright/test": "^1.57.0",
     "@storybook/addon-a11y": "^8.6.14",
     "@storybook/addon-essentials": "^8.6.14",
@@ -84,17 +93,41 @@
     "@types/node": "^25.0.2",
     "@types/react": "^19.2.7",
     "@types/react-dom": "^19.2.3",
+    "@typescript-eslint/eslint-plugin": "^8.53.1",
+    "@typescript-eslint/parser": "^8.53.1",
     "@vitejs/plugin-react": "^5.1.2",
     "@vitest/ui": "^4.0.15",
     "axe-core": "^4.11.0",
+    "eslint": "^9.39.2",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "eslint-plugin-react-refresh": "^0.4.26",
+    "husky": "^9.1.7",
     "jest-axe": "^10.0.0",
     "jsdom": "^27.3.0",
+    "lint-staged": "^16.2.7",
+    "prettier": "^3.8.0",
     "react": "^19.2.3",
     "react-dom": "^19.2.3",
     "storybook": "^8.6.14",
     "typescript": "^5.9.3",
+    "typescript-eslint": "^8.53.1",
     "vite": "^7.3.0",
     "vite-plugin-dts": "^4.5.4",
     "vitest": "^4.0.15"
+  },
+  "lint-staged": {
+    "src/**/*.{ts,tsx}": [
+      "prettier --write",
+      "eslint --fix"
+    ],
+    "src/**/*.css": [
+      "prettier --write"
+    ]
+  },
+  "dependencies": {
+    "lucide-react": "^0.562.0"
   }
 }