npm - @nofinite/nui - Versions diffs - 1.0.2 → 1.1.1 - Mend

@nofinite/nui 1.0.2 → 1.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (182) hide show

package/dist/components/accordion/Accordion.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Accordion.cjs","sources":["~~../../../../~~src/components/accordion/Accordion.tsx"],"sourcesContent":["/*\r\n Accordion.tsx\r\n * ---------------\r\n * Fully accessible WAI-ARIA accordion.\r\n * Single-component API.\r\n /\r\n\r\nimport React, { useState } from 'react';\r\n\r\nimport './Accordion.css';\r\n\r\nexport interface AccordionItem {\r\n id: string;\r\n title: string;\r\n content: React.ReactNode;\r\n}\r\n\r\ninterface AccordionProps {\r\n /* List of accordion sections /\r\n items: AccordionItem[];\r\n\r\n /* Default opened item ID (optional) /\r\n defaultOpenId?: string;\r\n\r\n /* Allow multiple open panels? Default: false /\r\n multiple?: boolean;\r\n\r\n className?: string;\r\n}\r\n\r\nexport function Accordion({\r\n items,\r\n defaultOpenId,\r\n multiple = false,\r\n className = '',\r\n}: AccordionProps) {\r\n const [openIds, setOpenIds] = useState<string[]>(\r\n defaultOpenId ? [defaultOpenId] : []\r\n );\r\n\r\n const isOpen = (id: string) => openIds.includes(id);\r\n\r\n const toggle = (id: string) => {\r\n setOpenIds((prev) => {\r\n if (multiple) {\r\n return isOpen(id) ? prev.filter((x) => x !== id) : [...prev, id];\r\n } else {\r\n return isOpen(id) ? [] : [id];\r\n }\r\n });\r\n };\r\n\r\n return (\r\n <div className={`ui-accordion ${className}`}>\r\n {items.map((item) => {\r\n const open = isOpen(item.id);\r\n\r\n return (\r\n <div key={item.id} className=\"ui-accordion-item\">\r\n {/ HEADER BUTTON /}\r\n <button\r\n className=\"ui-accordion-header\"\r\n aria-expanded={open}\r\n aria-controls={`panel-${item.id}`}\r\n id={`accordion-${item.id}`}\r\n onClick={() => toggle(item.id)}\r\n onKeyDown={(e) => {\r\n if (e.key === 'Enter' \|\| e.key === ' ') {\r\n e.preventDefault();\r\n toggle(item.id);\r\n }\r\n }}\r\n >\r\n {item.title}\r\n <span>{open ? '–' : '+'}</span>\r\n </button>\r\n\r\n {/ PANEL */}\r\n <div\r\n id={`panel-${item.id}`}\r\n role=\"region\"\r\n aria-labelledby={`accordion-${item.id}`}\r\n className={`ui-accordion-panel ${\r\n open ? 'ui-accordion-panel--open' : ''\r\n }`}\r\n >\r\n {open && (\r\n <div style={{ padding: '8px 0', color: 'var(--color-text)' }}>\r\n {item.content}\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n );\r\n })}\r\n </div>\r\n );\r\n}\r\n"],"names":["Accordion","items","defaultOpenId","multiple","className","openIds","setOpenIds","useState","isOpen","id","toggle","prev","x","jsx","item","open","jsxs","e"],"mappings":"uKA8BO,SAASA,EAAU,CACxB,MAAAC,EACA,cAAAC,EACA,SAAAC,EAAW,GACX,UAAAC,EAAY,EACd,EAAmB,CACjB,KAAM,CAACC,EAASC,CAAU,EAAIC,EAAAA,SAC5BL,EAAgB,CAACA,CAAa,EAAI,CAAA,CAAC,EAG/BM,EAAUC,GAAeJ,EAAQ,SAASI,CAAE,EAE5CC,EAAUD,GAAe,CAC7BH,EAAYK,GACNR,EACKK,EAAOC,CAAE,EAAIE,EAAK,OAAQC,GAAMA,IAAMH,CAAE,EAAI,CAAC,GAAGE,EAAMF,CAAE,EAExDD,EAAOC,CAAE,EAAI,CAAA,EAAK,CAACA,CAAE,CAE/B,CACH,EAEA,OACEI,MAAC,OAAI,UAAW,gBAAgBT,CAAS,GACtC,SAAAH,EAAM,IAAKa,GAAS,CACnB,MAAMC,EAAOP,EAAOM,EAAK,EAAE,EAE3B,OACEE,EAAAA,KAAC,MAAA,CAAkB,UAAU,oBAE3B,SAAA,CAAAA,EAAAA,KAAC,SAAA,CACC,UAAU,sBACV,gBAAeD,EACf,gBAAe,SAASD,EAAK,EAAE,GAC/B,GAAI,aAAaA,EAAK,EAAE,GACxB,QAAS,IAAMJ,EAAOI,EAAK,EAAE,EAC7B,UAAYG,GAAM,EACZA,EAAE,MAAQ,SAAWA,EAAE,MAAQ,OACjCA,EAAE,eAAA,EACFP,EAAOI,EAAK,EAAE,EAElB,EAEC,SAAA,CAAAA,EAAK,MACND,EAAAA,IAAC,OAAA,CAAM,SAAAE,EAAO,IAAM,GAAA,CAAI,CAAA,CAAA,CAAA,EAI1BF,EAAAA,IAAC,MAAA,CACC,GAAI,SAASC,EAAK,EAAE,GACpB,KAAK,SACL,kBAAiB,aAAaA,EAAK,EAAE,GACrC,UAAW,sBACTC,EAAO,2BAA6B,EACtC,GAEC,SAAAA,GACCF,EAAAA,IAAC,MAAA,CAAI,MAAO,CAAE,QAAS,QAAS,MAAO,mBAAA,EACpC,SAAAC,EAAK,OAAA,CACR,CAAA,CAAA,CAEJ,CAAA,EAjCQA,EAAK,EAkCf,CAEJ,CAAC,CAAA,CACH,CAEJ"}
1	+ {"version":3,"file":"Accordion.cjs","sources":["../../../src/components/accordion/Accordion.tsx"],"sourcesContent":["/*\r\n Accordion.tsx\r\n * ---------------\r\n * Fully accessible WAI-ARIA accordion.\r\n * Single-component API.\r\n /\r\n\r\nimport React, { useState } from 'react';\r\n\r\nimport './Accordion.css';\r\n\r\nexport interface AccordionItem {\r\n id: string;\r\n title: string;\r\n content: React.ReactNode;\r\n}\r\n\r\ninterface AccordionProps {\r\n /* List of accordion sections /\r\n items: AccordionItem[];\r\n\r\n /* Default opened item ID (optional) /\r\n defaultOpenId?: string;\r\n\r\n /* Allow multiple open panels? Default: false /\r\n multiple?: boolean;\r\n\r\n className?: string;\r\n}\r\n\r\nexport function Accordion({\r\n items,\r\n defaultOpenId,\r\n multiple = false,\r\n className = '',\r\n}: AccordionProps) {\r\n const [openIds, setOpenIds] = useState<string[]>(\r\n defaultOpenId ? [defaultOpenId] : []\r\n );\r\n\r\n const isOpen = (id: string) => openIds.includes(id);\r\n\r\n const toggle = (id: string) => {\r\n setOpenIds((prev) => {\r\n if (multiple) {\r\n return isOpen(id) ? prev.filter((x) => x !== id) : [...prev, id];\r\n } else {\r\n return isOpen(id) ? [] : [id];\r\n }\r\n });\r\n };\r\n\r\n return (\r\n <div className={`ui-accordion ${className}`}>\r\n {items.map((item) => {\r\n const open = isOpen(item.id);\r\n\r\n return (\r\n <div key={item.id} className=\"ui-accordion-item\">\r\n {/ HEADER BUTTON /}\r\n <button\r\n className=\"ui-accordion-header\"\r\n aria-expanded={open}\r\n aria-controls={`panel-${item.id}`}\r\n id={`accordion-${item.id}`}\r\n onClick={() => toggle(item.id)}\r\n onKeyDown={(e) => {\r\n if (e.key === 'Enter' \|\| e.key === ' ') {\r\n e.preventDefault();\r\n toggle(item.id);\r\n }\r\n }}\r\n >\r\n {item.title}\r\n <span>{open ? '–' : '+'}</span>\r\n </button>\r\n\r\n {/ PANEL */}\r\n <div\r\n id={`panel-${item.id}`}\r\n role=\"region\"\r\n aria-labelledby={`accordion-${item.id}`}\r\n className={`ui-accordion-panel ${\r\n open ? 'ui-accordion-panel--open' : ''\r\n }`}\r\n >\r\n {open && (\r\n <div style={{ padding: '8px 0', color: 'var(--color-text)' }}>\r\n {item.content}\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n );\r\n })}\r\n </div>\r\n );\r\n}\r\n"],"names":["Accordion","items","defaultOpenId","multiple","className","openIds","setOpenIds","useState","isOpen","id","toggle","prev","x","jsx","item","open","jsxs","e"],"mappings":"uKA8BO,SAASA,EAAU,CACxB,MAAAC,EACA,cAAAC,EACA,SAAAC,EAAW,GACX,UAAAC,EAAY,EACd,EAAmB,CACjB,KAAM,CAACC,EAASC,CAAU,EAAIC,EAAAA,SAC5BL,EAAgB,CAACA,CAAa,EAAI,CAAA,CAAC,EAG/BM,EAAUC,GAAeJ,EAAQ,SAASI,CAAE,EAE5CC,EAAUD,GAAe,CAC7BH,EAAYK,GACNR,EACKK,EAAOC,CAAE,EAAIE,EAAK,OAAQC,GAAMA,IAAMH,CAAE,EAAI,CAAC,GAAGE,EAAMF,CAAE,EAExDD,EAAOC,CAAE,EAAI,CAAA,EAAK,CAACA,CAAE,CAE/B,CACH,EAEA,OACEI,MAAC,OAAI,UAAW,gBAAgBT,CAAS,GACtC,SAAAH,EAAM,IAAKa,GAAS,CACnB,MAAMC,EAAOP,EAAOM,EAAK,EAAE,EAE3B,OACEE,EAAAA,KAAC,MAAA,CAAkB,UAAU,oBAE3B,SAAA,CAAAA,EAAAA,KAAC,SAAA,CACC,UAAU,sBACV,gBAAeD,EACf,gBAAe,SAASD,EAAK,EAAE,GAC/B,GAAI,aAAaA,EAAK,EAAE,GACxB,QAAS,IAAMJ,EAAOI,EAAK,EAAE,EAC7B,UAAYG,GAAM,EACZA,EAAE,MAAQ,SAAWA,EAAE,MAAQ,OACjCA,EAAE,eAAA,EACFP,EAAOI,EAAK,EAAE,EAElB,EAEC,SAAA,CAAAA,EAAK,MACND,EAAAA,IAAC,OAAA,CAAM,SAAAE,EAAO,IAAM,GAAA,CAAI,CAAA,CAAA,CAAA,EAI1BF,EAAAA,IAAC,MAAA,CACC,GAAI,SAASC,EAAK,EAAE,GACpB,KAAK,SACL,kBAAiB,aAAaA,EAAK,EAAE,GACrC,UAAW,sBACTC,EAAO,2BAA6B,EACtC,GAEC,SAAAA,GACCF,EAAAA,IAAC,MAAA,CAAI,MAAO,CAAE,QAAS,QAAS,MAAO,mBAAA,EACpC,SAAAC,EAAK,OAAA,CACR,CAAA,CAAA,CAEJ,CAAA,EAjCQA,EAAK,EAkCf,CAEJ,CAAC,CAAA,CACH,CAEJ"}

package/dist/components/accordion/Accordion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Accordion.js","sources":["~~../../../../~~src/components/accordion/Accordion.tsx"],"sourcesContent":["/*\r\n Accordion.tsx\r\n * ---------------\r\n * Fully accessible WAI-ARIA accordion.\r\n * Single-component API.\r\n /\r\n\r\nimport React, { useState } from 'react';\r\n\r\nimport './Accordion.css';\r\n\r\nexport interface AccordionItem {\r\n id: string;\r\n title: string;\r\n content: React.ReactNode;\r\n}\r\n\r\ninterface AccordionProps {\r\n /* List of accordion sections /\r\n items: AccordionItem[];\r\n\r\n /* Default opened item ID (optional) /\r\n defaultOpenId?: string;\r\n\r\n /* Allow multiple open panels? Default: false /\r\n multiple?: boolean;\r\n\r\n className?: string;\r\n}\r\n\r\nexport function Accordion({\r\n items,\r\n defaultOpenId,\r\n multiple = false,\r\n className = '',\r\n}: AccordionProps) {\r\n const [openIds, setOpenIds] = useState<string[]>(\r\n defaultOpenId ? [defaultOpenId] : []\r\n );\r\n\r\n const isOpen = (id: string) => openIds.includes(id);\r\n\r\n const toggle = (id: string) => {\r\n setOpenIds((prev) => {\r\n if (multiple) {\r\n return isOpen(id) ? prev.filter((x) => x !== id) : [...prev, id];\r\n } else {\r\n return isOpen(id) ? [] : [id];\r\n }\r\n });\r\n };\r\n\r\n return (\r\n <div className={`ui-accordion ${className}`}>\r\n {items.map((item) => {\r\n const open = isOpen(item.id);\r\n\r\n return (\r\n <div key={item.id} className=\"ui-accordion-item\">\r\n {/ HEADER BUTTON /}\r\n <button\r\n className=\"ui-accordion-header\"\r\n aria-expanded={open}\r\n aria-controls={`panel-${item.id}`}\r\n id={`accordion-${item.id}`}\r\n onClick={() => toggle(item.id)}\r\n onKeyDown={(e) => {\r\n if (e.key === 'Enter' \|\| e.key === ' ') {\r\n e.preventDefault();\r\n toggle(item.id);\r\n }\r\n }}\r\n >\r\n {item.title}\r\n <span>{open ? '–' : '+'}</span>\r\n </button>\r\n\r\n {/ PANEL */}\r\n <div\r\n id={`panel-${item.id}`}\r\n role=\"region\"\r\n aria-labelledby={`accordion-${item.id}`}\r\n className={`ui-accordion-panel ${\r\n open ? 'ui-accordion-panel--open' : ''\r\n }`}\r\n >\r\n {open && (\r\n <div style={{ padding: '8px 0', color: 'var(--color-text)' }}>\r\n {item.content}\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n );\r\n })}\r\n </div>\r\n );\r\n}\r\n"],"names":["Accordion","items","defaultOpenId","multiple","className","openIds","setOpenIds","useState","isOpen","id","toggle","prev","x","jsx","item","open","jsxs","e"],"mappings":";;;AA8BO,SAASA,EAAU;AAAA,EACxB,OAAAC;AAAA,EACA,eAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AACd,GAAmB;AACjB,QAAM,CAACC,GAASC,CAAU,IAAIC;AAAA,IAC5BL,IAAgB,CAACA,CAAa,IAAI,CAAA;AAAA,EAAC,GAG/BM,IAAS,CAACC,MAAeJ,EAAQ,SAASI,CAAE,GAE5CC,IAAS,CAACD,MAAe;AAC7B,IAAAH,EAAW,CAACK,MACNR,IACKK,EAAOC,CAAE,IAAIE,EAAK,OAAO,CAACC,MAAMA,MAAMH,CAAE,IAAI,CAAC,GAAGE,GAAMF,CAAE,IAExDD,EAAOC,CAAE,IAAI,CAAA,IAAK,CAACA,CAAE,CAE/B;AAAA,EACH;AAEA,SACE,gBAAAI,EAAC,SAAI,WAAW,gBAAgBT,CAAS,IACtC,UAAAH,EAAM,IAAI,CAACa,MAAS;AACnB,UAAMC,IAAOP,EAAOM,EAAK,EAAE;AAE3B,WACE,gBAAAE,EAAC,OAAA,EAAkB,WAAU,qBAE3B,UAAA;AAAA,MAAA,gBAAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,iBAAeD;AAAA,UACf,iBAAe,SAASD,EAAK,EAAE;AAAA,UAC/B,IAAI,aAAaA,EAAK,EAAE;AAAA,UACxB,SAAS,MAAMJ,EAAOI,EAAK,EAAE;AAAA,UAC7B,WAAW,CAACG,MAAM;AAChB,aAAIA,EAAE,QAAQ,WAAWA,EAAE,QAAQ,SACjCA,EAAE,eAAA,GACFP,EAAOI,EAAK,EAAE;AAAA,UAElB;AAAA,UAEC,UAAA;AAAA,YAAAA,EAAK;AAAA,YACN,gBAAAD,EAAC,QAAA,EAAM,UAAAE,IAAO,MAAM,IAAA,CAAI;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAI1B,gBAAAF;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,IAAI,SAASC,EAAK,EAAE;AAAA,UACpB,MAAK;AAAA,UACL,mBAAiB,aAAaA,EAAK,EAAE;AAAA,UACrC,WAAW,sBACTC,IAAO,6BAA6B,EACtC;AAAA,UAEC,UAAAA,KACC,gBAAAF,EAAC,OAAA,EAAI,OAAO,EAAE,SAAS,SAAS,OAAO,oBAAA,GACpC,UAAAC,EAAK,QAAA,CACR;AAAA,QAAA;AAAA,MAAA;AAAA,IAEJ,EAAA,GAjCQA,EAAK,EAkCf;AAAA,EAEJ,CAAC,EAAA,CACH;AAEJ;"}
1	+ {"version":3,"file":"Accordion.js","sources":["../../../src/components/accordion/Accordion.tsx"],"sourcesContent":["/*\r\n Accordion.tsx\r\n * ---------------\r\n * Fully accessible WAI-ARIA accordion.\r\n * Single-component API.\r\n /\r\n\r\nimport React, { useState } from 'react';\r\n\r\nimport './Accordion.css';\r\n\r\nexport interface AccordionItem {\r\n id: string;\r\n title: string;\r\n content: React.ReactNode;\r\n}\r\n\r\ninterface AccordionProps {\r\n /* List of accordion sections /\r\n items: AccordionItem[];\r\n\r\n /* Default opened item ID (optional) /\r\n defaultOpenId?: string;\r\n\r\n /* Allow multiple open panels? Default: false /\r\n multiple?: boolean;\r\n\r\n className?: string;\r\n}\r\n\r\nexport function Accordion({\r\n items,\r\n defaultOpenId,\r\n multiple = false,\r\n className = '',\r\n}: AccordionProps) {\r\n const [openIds, setOpenIds] = useState<string[]>(\r\n defaultOpenId ? [defaultOpenId] : []\r\n );\r\n\r\n const isOpen = (id: string) => openIds.includes(id);\r\n\r\n const toggle = (id: string) => {\r\n setOpenIds((prev) => {\r\n if (multiple) {\r\n return isOpen(id) ? prev.filter((x) => x !== id) : [...prev, id];\r\n } else {\r\n return isOpen(id) ? [] : [id];\r\n }\r\n });\r\n };\r\n\r\n return (\r\n <div className={`ui-accordion ${className}`}>\r\n {items.map((item) => {\r\n const open = isOpen(item.id);\r\n\r\n return (\r\n <div key={item.id} className=\"ui-accordion-item\">\r\n {/ HEADER BUTTON /}\r\n <button\r\n className=\"ui-accordion-header\"\r\n aria-expanded={open}\r\n aria-controls={`panel-${item.id}`}\r\n id={`accordion-${item.id}`}\r\n onClick={() => toggle(item.id)}\r\n onKeyDown={(e) => {\r\n if (e.key === 'Enter' \|\| e.key === ' ') {\r\n e.preventDefault();\r\n toggle(item.id);\r\n }\r\n }}\r\n >\r\n {item.title}\r\n <span>{open ? '–' : '+'}</span>\r\n </button>\r\n\r\n {/ PANEL */}\r\n <div\r\n id={`panel-${item.id}`}\r\n role=\"region\"\r\n aria-labelledby={`accordion-${item.id}`}\r\n className={`ui-accordion-panel ${\r\n open ? 'ui-accordion-panel--open' : ''\r\n }`}\r\n >\r\n {open && (\r\n <div style={{ padding: '8px 0', color: 'var(--color-text)' }}>\r\n {item.content}\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n );\r\n })}\r\n </div>\r\n );\r\n}\r\n"],"names":["Accordion","items","defaultOpenId","multiple","className","openIds","setOpenIds","useState","isOpen","id","toggle","prev","x","jsx","item","open","jsxs","e"],"mappings":";;;AA8BO,SAASA,EAAU;AAAA,EACxB,OAAAC;AAAA,EACA,eAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AACd,GAAmB;AACjB,QAAM,CAACC,GAASC,CAAU,IAAIC;AAAA,IAC5BL,IAAgB,CAACA,CAAa,IAAI,CAAA;AAAA,EAAC,GAG/BM,IAAS,CAACC,MAAeJ,EAAQ,SAASI,CAAE,GAE5CC,IAAS,CAACD,MAAe;AAC7B,IAAAH,EAAW,CAACK,MACNR,IACKK,EAAOC,CAAE,IAAIE,EAAK,OAAO,CAACC,MAAMA,MAAMH,CAAE,IAAI,CAAC,GAAGE,GAAMF,CAAE,IAExDD,EAAOC,CAAE,IAAI,CAAA,IAAK,CAACA,CAAE,CAE/B;AAAA,EACH;AAEA,SACE,gBAAAI,EAAC,SAAI,WAAW,gBAAgBT,CAAS,IACtC,UAAAH,EAAM,IAAI,CAACa,MAAS;AACnB,UAAMC,IAAOP,EAAOM,EAAK,EAAE;AAE3B,WACE,gBAAAE,EAAC,OAAA,EAAkB,WAAU,qBAE3B,UAAA;AAAA,MAAA,gBAAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,iBAAeD;AAAA,UACf,iBAAe,SAASD,EAAK,EAAE;AAAA,UAC/B,IAAI,aAAaA,EAAK,EAAE;AAAA,UACxB,SAAS,MAAMJ,EAAOI,EAAK,EAAE;AAAA,UAC7B,WAAW,CAACG,MAAM;AAChB,aAAIA,EAAE,QAAQ,WAAWA,EAAE,QAAQ,SACjCA,EAAE,eAAA,GACFP,EAAOI,EAAK,EAAE;AAAA,UAElB;AAAA,UAEC,UAAA;AAAA,YAAAA,EAAK;AAAA,YACN,gBAAAD,EAAC,QAAA,EAAM,UAAAE,IAAO,MAAM,IAAA,CAAI;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAI1B,gBAAAF;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,IAAI,SAASC,EAAK,EAAE;AAAA,UACpB,MAAK;AAAA,UACL,mBAAiB,aAAaA,EAAK,EAAE;AAAA,UACrC,WAAW,sBACTC,IAAO,6BAA6B,EACtC;AAAA,UAEC,UAAAA,KACC,gBAAAF,EAAC,OAAA,EAAI,OAAO,EAAE,SAAS,SAAS,OAAO,oBAAA,GACpC,UAAAC,EAAK,QAAA,CACR;AAAA,QAAA;AAAA,MAAA;AAAA,IAEJ,EAAA,GAjCQA,EAAK,EAkCf;AAAA,EAEJ,CAAC,EAAA,CACH;AAEJ;"}

package/dist/components/alert/Alert.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Alert.cjs","sources":["~~../../../../~~src/components/alert/Alert.tsx"],"sourcesContent":["/*\r\n Alert.tsx\r\n * ----------\r\n * WCAG-compliant alert component.\r\n \r\n - Uses correct roles:\r\n * type=\"error\"/\"warning\" → role=\"alert\" (urgent)\r\n * type=\"info\"/\"success\" → role=\"status\" (non-urgent)\r\n \r\n - Supports:\r\n * - title\r\n * - closable\r\n * - variants\r\n * - icons (optional)\r\n */\r\n\r\nimport React from 'react';\r\nimport './Alert.css';\r\n\r\ntype AlertType = 'info' \| 'success' \| 'warning' \| 'error';\r\n\r\ninterface AlertProps {\r\n type?: AlertType;\r\n title?: string;\r\n children?: React.ReactNode;\r\n closable?: boolean;\r\n onClose?: () => void;\r\n className?: string;\r\n}\r\n\r\nexport function Alert({\r\n type = 'info',\r\n title,\r\n children,\r\n closable = false,\r\n onClose,\r\n className = '',\r\n}: AlertProps) {\r\n // WCAG rule:\r\n // - errors & warnings = role=\"alert\"\r\n // - info & success = role=\"status\"\r\n const role = type === 'error' \|\| type === 'warning' ? 'alert' : 'status';\r\n\r\n return (\r\n <div className={`ui-alert ui-alert--${type} ${className}`} role={role}>\r\n <div className=\"ui-alert-content\">\r\n {title && <div className=\"ui-alert-title\">{title}</div>}\r\n {children}\r\n </div>\r\n\r\n {closable && (\r\n <button\r\n type=\"button\"\r\n className=\"ui-alert-close\"\r\n aria-label=\"Close alert\"\r\n onClick={onClose}\r\n >\r\n ×\r\n </button>\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["Alert","type","title","children","closable","onClose","className","role","jsxs","jsx"],"mappings":"gJA8BO,SAASA,EAAM,CACpB,KAAAC,EAAO,OACP,MAAAC,EACA,SAAAC,EACA,SAAAC,EAAW,GACX,QAAAC,EACA,UAAAC,EAAY,EACd,EAAe,CAIb,MAAMC,EAAON,IAAS,SAAWA,IAAS,UAAY,QAAU,SAEhE,OACEO,OAAC,OAAI,UAAW,sBAAsBP,CAAI,IAAIK,CAAS,GAAI,KAAAC,EACzD,SAAA,CAAAC,EAAAA,KAAC,MAAA,CAAI,UAAU,mBACZ,SAAA,CAAAN,GAASO,EAAAA,IAAC,MAAA,CAAI,UAAU,iBAAkB,SAAAP,EAAM,EAChDC,CAAA,EACH,EAECC,GACCK,EAAAA,IAAC,SAAA,CACC,KAAK,SACL,UAAU,iBACV,aAAW,cACX,QAASJ,EACV,SAAA,GAAA,CAAA,CAED,EAEJ,CAEJ"}
1	+ {"version":3,"file":"Alert.cjs","sources":["../../../src/components/alert/Alert.tsx"],"sourcesContent":["/*\r\n Alert.tsx\r\n * ----------\r\n * WCAG-compliant alert component.\r\n \r\n - Uses correct roles:\r\n * type=\"error\"/\"warning\" → role=\"alert\" (urgent)\r\n * type=\"info\"/\"success\" → role=\"status\" (non-urgent)\r\n \r\n - Supports:\r\n * - title\r\n * - closable\r\n * - variants\r\n * - icons (optional)\r\n */\r\n\r\nimport React from 'react';\r\nimport './Alert.css';\r\n\r\ntype AlertType = 'info' \| 'success' \| 'warning' \| 'error';\r\n\r\ninterface AlertProps {\r\n type?: AlertType;\r\n title?: string;\r\n children?: React.ReactNode;\r\n closable?: boolean;\r\n onClose?: () => void;\r\n className?: string;\r\n}\r\n\r\nexport function Alert({\r\n type = 'info',\r\n title,\r\n children,\r\n closable = false,\r\n onClose,\r\n className = '',\r\n}: AlertProps) {\r\n // WCAG rule:\r\n // - errors & warnings = role=\"alert\"\r\n // - info & success = role=\"status\"\r\n const role = type === 'error' \|\| type === 'warning' ? 'alert' : 'status';\r\n\r\n return (\r\n <div className={`ui-alert ui-alert--${type} ${className}`} role={role}>\r\n <div className=\"ui-alert-content\">\r\n {title && <div className=\"ui-alert-title\">{title}</div>}\r\n {children}\r\n </div>\r\n\r\n {closable && (\r\n <button\r\n type=\"button\"\r\n className=\"ui-alert-close\"\r\n aria-label=\"Close alert\"\r\n onClick={onClose}\r\n >\r\n ×\r\n </button>\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["Alert","type","title","children","closable","onClose","className","role","jsxs","jsx"],"mappings":"gJA8BO,SAASA,EAAM,CACpB,KAAAC,EAAO,OACP,MAAAC,EACA,SAAAC,EACA,SAAAC,EAAW,GACX,QAAAC,EACA,UAAAC,EAAY,EACd,EAAe,CAIb,MAAMC,EAAON,IAAS,SAAWA,IAAS,UAAY,QAAU,SAEhE,OACEO,OAAC,OAAI,UAAW,sBAAsBP,CAAI,IAAIK,CAAS,GAAI,KAAAC,EACzD,SAAA,CAAAC,EAAAA,KAAC,MAAA,CAAI,UAAU,mBACZ,SAAA,CAAAN,GAASO,EAAAA,IAAC,MAAA,CAAI,UAAU,iBAAkB,SAAAP,EAAM,EAChDC,CAAA,EACH,EAECC,GACCK,EAAAA,IAAC,SAAA,CACC,KAAK,SACL,UAAU,iBACV,aAAW,cACX,QAASJ,EACV,SAAA,GAAA,CAAA,CAED,EAEJ,CAEJ"}

package/dist/components/alert/Alert.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Alert.js","sources":["~~../../../../~~src/components/alert/Alert.tsx"],"sourcesContent":["/*\r\n Alert.tsx\r\n * ----------\r\n * WCAG-compliant alert component.\r\n \r\n - Uses correct roles:\r\n * type=\"error\"/\"warning\" → role=\"alert\" (urgent)\r\n * type=\"info\"/\"success\" → role=\"status\" (non-urgent)\r\n \r\n - Supports:\r\n * - title\r\n * - closable\r\n * - variants\r\n * - icons (optional)\r\n */\r\n\r\nimport React from 'react';\r\nimport './Alert.css';\r\n\r\ntype AlertType = 'info' \| 'success' \| 'warning' \| 'error';\r\n\r\ninterface AlertProps {\r\n type?: AlertType;\r\n title?: string;\r\n children?: React.ReactNode;\r\n closable?: boolean;\r\n onClose?: () => void;\r\n className?: string;\r\n}\r\n\r\nexport function Alert({\r\n type = 'info',\r\n title,\r\n children,\r\n closable = false,\r\n onClose,\r\n className = '',\r\n}: AlertProps) {\r\n // WCAG rule:\r\n // - errors & warnings = role=\"alert\"\r\n // - info & success = role=\"status\"\r\n const role = type === 'error' \|\| type === 'warning' ? 'alert' : 'status';\r\n\r\n return (\r\n <div className={`ui-alert ui-alert--${type} ${className}`} role={role}>\r\n <div className=\"ui-alert-content\">\r\n {title && <div className=\"ui-alert-title\">{title}</div>}\r\n {children}\r\n </div>\r\n\r\n {closable && (\r\n <button\r\n type=\"button\"\r\n className=\"ui-alert-close\"\r\n aria-label=\"Close alert\"\r\n onClick={onClose}\r\n >\r\n ×\r\n </button>\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["Alert","type","title","children","closable","onClose","className","role","jsxs","jsx"],"mappings":";;AA8BO,SAASA,EAAM;AAAA,EACpB,MAAAC,IAAO;AAAA,EACP,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,SAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAAe;AAIb,QAAMC,IAAON,MAAS,WAAWA,MAAS,YAAY,UAAU;AAEhE,SACE,gBAAAO,EAAC,SAAI,WAAW,sBAAsBP,CAAI,IAAIK,CAAS,IAAI,MAAAC,GACzD,UAAA;AAAA,IAAA,gBAAAC,EAAC,OAAA,EAAI,WAAU,oBACZ,UAAA;AAAA,MAAAN,KAAS,gBAAAO,EAAC,OAAA,EAAI,WAAU,kBAAkB,UAAAP,GAAM;AAAA,MAChDC;AAAA,IAAA,GACH;AAAA,IAECC,KACC,gBAAAK;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAU;AAAA,QACV,cAAW;AAAA,QACX,SAASJ;AAAA,QACV,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAED,GAEJ;AAEJ;"}
1	+ {"version":3,"file":"Alert.js","sources":["../../../src/components/alert/Alert.tsx"],"sourcesContent":["/*\r\n Alert.tsx\r\n * ----------\r\n * WCAG-compliant alert component.\r\n \r\n - Uses correct roles:\r\n * type=\"error\"/\"warning\" → role=\"alert\" (urgent)\r\n * type=\"info\"/\"success\" → role=\"status\" (non-urgent)\r\n \r\n - Supports:\r\n * - title\r\n * - closable\r\n * - variants\r\n * - icons (optional)\r\n */\r\n\r\nimport React from 'react';\r\nimport './Alert.css';\r\n\r\ntype AlertType = 'info' \| 'success' \| 'warning' \| 'error';\r\n\r\ninterface AlertProps {\r\n type?: AlertType;\r\n title?: string;\r\n children?: React.ReactNode;\r\n closable?: boolean;\r\n onClose?: () => void;\r\n className?: string;\r\n}\r\n\r\nexport function Alert({\r\n type = 'info',\r\n title,\r\n children,\r\n closable = false,\r\n onClose,\r\n className = '',\r\n}: AlertProps) {\r\n // WCAG rule:\r\n // - errors & warnings = role=\"alert\"\r\n // - info & success = role=\"status\"\r\n const role = type === 'error' \|\| type === 'warning' ? 'alert' : 'status';\r\n\r\n return (\r\n <div className={`ui-alert ui-alert--${type} ${className}`} role={role}>\r\n <div className=\"ui-alert-content\">\r\n {title && <div className=\"ui-alert-title\">{title}</div>}\r\n {children}\r\n </div>\r\n\r\n {closable && (\r\n <button\r\n type=\"button\"\r\n className=\"ui-alert-close\"\r\n aria-label=\"Close alert\"\r\n onClick={onClose}\r\n >\r\n ×\r\n </button>\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["Alert","type","title","children","closable","onClose","className","role","jsxs","jsx"],"mappings":";;AA8BO,SAASA,EAAM;AAAA,EACpB,MAAAC,IAAO;AAAA,EACP,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,SAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAAe;AAIb,QAAMC,IAAON,MAAS,WAAWA,MAAS,YAAY,UAAU;AAEhE,SACE,gBAAAO,EAAC,SAAI,WAAW,sBAAsBP,CAAI,IAAIK,CAAS,IAAI,MAAAC,GACzD,UAAA;AAAA,IAAA,gBAAAC,EAAC,OAAA,EAAI,WAAU,oBACZ,UAAA;AAAA,MAAAN,KAAS,gBAAAO,EAAC,OAAA,EAAI,WAAU,kBAAkB,UAAAP,GAAM;AAAA,MAChDC;AAAA,IAAA,GACH;AAAA,IAECC,KACC,gBAAAK;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAU;AAAA,QACV,cAAW;AAAA,QACX,SAASJ;AAAA,QACV,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAED,GAEJ;AAEJ;"}

package/dist/components/avatar/Avatar.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Avatar.cjs","sources":["~~../../../../~~src/components/avatar/Avatar.tsx"],"sourcesContent":["/*\r\n Avatar.tsx\r\n * Enterprise-grade Avatar component.\r\n */\r\nimport React, { useState } from 'react';\r\nimport './Avatar.css';\r\n\r\ntype AvatarSize = 'sm' \| 'md' \| 'lg' \| 'xl';\r\ntype AvatarShape = 'circle' \| 'rounded' \| 'square';\r\ntype Status = 'online' \| 'offline' \| 'busy' \| undefined;\r\n\r\ninterface AvatarProps {\r\n src?: string;\r\n alt?: string;\r\n name?: string; // For initials fallback\r\n size?: AvatarSize;\r\n shape?: AvatarShape;\r\n status?: Status;\r\n loading?: boolean; // skeleton\r\n className?: string;\r\n fallbackIcon?: React.ReactNode;\r\n}\r\n\r\nfunction getInitials(name?: string): string {\r\n if (!name) return '';\r\n const parts = name.trim().split(' ');\r\n if (parts.length === 1) return parts[0].charAt(0).toUpperCase();\r\n return (parts[0][0] + parts[1][0]).toUpperCase();\r\n}\r\n\r\nexport function Avatar({\r\n src,\r\n alt,\r\n name,\r\n size = 'md',\r\n shape = 'circle',\r\n status,\r\n loading = false,\r\n className = '',\r\n fallbackIcon,\r\n}: AvatarProps) {\r\n const [errored, setErrored] = useState(false);\r\n const initials = getInitials(name);\r\n\r\n const classes = [\r\n 'ui-avatar',\r\n `ui-avatar--${size}`,\r\n `ui-avatar--${shape}`,\r\n loading && 'ui-avatar-loading',\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(' ');\r\n\r\n const showImage = src && !errored && !loading;\r\n\r\n return (\r\n <div className={classes} aria-label={alt \|\| name}>\r\n {showImage ? (\r\n <img\r\n src={src}\r\n alt={alt \|\| name \|\| 'avatar'}\r\n onError={() => setErrored(true)}\r\n />\r\n ) : initials ? (\r\n <span>{initials}</span>\r\n ) : fallbackIcon ? (\r\n <span>{fallbackIcon}</span>\r\n ) : (\r\n <span>?</span>\r\n )}\r\n\r\n {status && (\r\n <span\r\n className={[\r\n 'ui-avatar-status',\r\n status && `ui-avatar-status--${status}`,\r\n ]\r\n .filter(Boolean)\r\n .join(' ')}\r\n aria-label={status}\r\n />\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["getInitials","name","parts","Avatar","src","alt","size","shape","status","loading","className","fallbackIcon","errored","setErrored","useState","initials","classes","showImage","jsx"],"mappings":"oKAuBA,SAASA,EAAYC,EAAuB,CAC1C,GAAI,CAACA,EAAM,MAAO,GAClB,MAAMC,EAAQD,EAAK,KAAA,EAAO,MAAM,GAAG,EACnC,OAAIC,EAAM,SAAW,EAAUA,EAAM,CAAC,EAAE,OAAO,CAAC,EAAE,YAAA,GAC1CA,EAAM,CAAC,EAAE,CAAC,EAAIA,EAAM,CAAC,EAAE,CAAC,GAAG,YAAA,CACrC,CAEO,SAASC,EAAO,CACrB,IAAAC,EACA,IAAAC,EACA,KAAAJ,EACA,KAAAK,EAAO,KACP,MAAAC,EAAQ,SACR,OAAAC,EACA,QAAAC,EAAU,GACV,UAAAC,EAAY,GACZ,aAAAC,CACF,EAAgB,CACd,KAAM,CAACC,EAASC,CAAU,EAAIC,EAAAA,SAAS,EAAK,EACtCC,EAAWf,EAAYC,CAAI,EAE3Be,EAAU,CACd,YACA,cAAcV,CAAI,GAClB,cAAcC,CAAK,GACnBE,GAAW,oBACXC,CAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,EAELO,EAAYb,GAAO,CAACQ,GAAW,CAACH,EAEtC,cACG,MAAA,CAAI,UAAWO,EAAS,aAAYX,GAAOJ,EACzC,SAAA,CAAAgB,EACCC,EAAAA,IAAC,MAAA,CACC,IAAAd,EACA,IAAKC,GAAOJ,GAAQ,SACpB,QAAS,IAAMY,EAAW,EAAI,CAAA,CAAA,EAE9BE,EACFG,EAAAA,IAAC,OAAA,CAAM,SAAAH,CAAA,CAAS,EACdJ,EACFO,EAAAA,IAAC,OAAA,CAAM,SAAAP,CAAA,CAAa,EAEpBO,EAAAA,IAAC,QAAK,SAAA,IAAC,EAGRV,GACCU,EAAAA,IAAC,OAAA,CACC,UAAW,CACT,mBACAV,GAAU,qBAAqBA,CAAM,EAAA,EAEpC,OAAO,OAAO,EACd,KAAK,GAAG,EACX,aAAYA,CAAA,CAAA,CACd,EAEJ,CAEJ"}
1	+ {"version":3,"file":"Avatar.cjs","sources":["../../../src/components/avatar/Avatar.tsx"],"sourcesContent":["/*\r\n Avatar.tsx\r\n * Enterprise-grade Avatar component.\r\n */\r\nimport React, { useState } from 'react';\r\nimport './Avatar.css';\r\n\r\ntype AvatarSize = 'sm' \| 'md' \| 'lg' \| 'xl';\r\ntype AvatarShape = 'circle' \| 'rounded' \| 'square';\r\ntype Status = 'online' \| 'offline' \| 'busy' \| undefined;\r\n\r\ninterface AvatarProps {\r\n src?: string;\r\n alt?: string;\r\n name?: string; // For initials fallback\r\n size?: AvatarSize;\r\n shape?: AvatarShape;\r\n status?: Status;\r\n loading?: boolean; // skeleton\r\n className?: string;\r\n fallbackIcon?: React.ReactNode;\r\n}\r\n\r\nfunction getInitials(name?: string): string {\r\n if (!name) return '';\r\n const parts = name.trim().split(' ');\r\n if (parts.length === 1) return parts[0].charAt(0).toUpperCase();\r\n return (parts[0][0] + parts[1][0]).toUpperCase();\r\n}\r\n\r\nexport function Avatar({\r\n src,\r\n alt,\r\n name,\r\n size = 'md',\r\n shape = 'circle',\r\n status,\r\n loading = false,\r\n className = '',\r\n fallbackIcon,\r\n}: AvatarProps) {\r\n const [errored, setErrored] = useState(false);\r\n const initials = getInitials(name);\r\n\r\n const classes = [\r\n 'ui-avatar',\r\n `ui-avatar--${size}`,\r\n `ui-avatar--${shape}`,\r\n loading && 'ui-avatar-loading',\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(' ');\r\n\r\n const showImage = src && !errored && !loading;\r\n\r\n return (\r\n <div className={classes} aria-label={alt \|\| name}>\r\n {showImage ? (\r\n <img\r\n src={src}\r\n alt={alt \|\| name \|\| 'avatar'}\r\n onError={() => setErrored(true)}\r\n />\r\n ) : initials ? (\r\n <span>{initials}</span>\r\n ) : fallbackIcon ? (\r\n <span>{fallbackIcon}</span>\r\n ) : (\r\n <span>?</span>\r\n )}\r\n\r\n {status && (\r\n <span\r\n className={[\r\n 'ui-avatar-status',\r\n status && `ui-avatar-status--${status}`,\r\n ]\r\n .filter(Boolean)\r\n .join(' ')}\r\n aria-label={status}\r\n />\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["getInitials","name","parts","Avatar","src","alt","size","shape","status","loading","className","fallbackIcon","errored","setErrored","useState","initials","classes","showImage","jsx"],"mappings":"oKAuBA,SAASA,EAAYC,EAAuB,CAC1C,GAAI,CAACA,EAAM,MAAO,GAClB,MAAMC,EAAQD,EAAK,KAAA,EAAO,MAAM,GAAG,EACnC,OAAIC,EAAM,SAAW,EAAUA,EAAM,CAAC,EAAE,OAAO,CAAC,EAAE,YAAA,GAC1CA,EAAM,CAAC,EAAE,CAAC,EAAIA,EAAM,CAAC,EAAE,CAAC,GAAG,YAAA,CACrC,CAEO,SAASC,EAAO,CACrB,IAAAC,EACA,IAAAC,EACA,KAAAJ,EACA,KAAAK,EAAO,KACP,MAAAC,EAAQ,SACR,OAAAC,EACA,QAAAC,EAAU,GACV,UAAAC,EAAY,GACZ,aAAAC,CACF,EAAgB,CACd,KAAM,CAACC,EAASC,CAAU,EAAIC,EAAAA,SAAS,EAAK,EACtCC,EAAWf,EAAYC,CAAI,EAE3Be,EAAU,CACd,YACA,cAAcV,CAAI,GAClB,cAAcC,CAAK,GACnBE,GAAW,oBACXC,CAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,EAELO,EAAYb,GAAO,CAACQ,GAAW,CAACH,EAEtC,cACG,MAAA,CAAI,UAAWO,EAAS,aAAYX,GAAOJ,EACzC,SAAA,CAAAgB,EACCC,EAAAA,IAAC,MAAA,CACC,IAAAd,EACA,IAAKC,GAAOJ,GAAQ,SACpB,QAAS,IAAMY,EAAW,EAAI,CAAA,CAAA,EAE9BE,EACFG,EAAAA,IAAC,OAAA,CAAM,SAAAH,CAAA,CAAS,EACdJ,EACFO,EAAAA,IAAC,OAAA,CAAM,SAAAP,CAAA,CAAa,EAEpBO,EAAAA,IAAC,QAAK,SAAA,IAAC,EAGRV,GACCU,EAAAA,IAAC,OAAA,CACC,UAAW,CACT,mBACAV,GAAU,qBAAqBA,CAAM,EAAA,EAEpC,OAAO,OAAO,EACd,KAAK,GAAG,EACX,aAAYA,CAAA,CAAA,CACd,EAEJ,CAEJ"}

package/dist/components/avatar/Avatar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Avatar.js","sources":["~~../../../../~~src/components/avatar/Avatar.tsx"],"sourcesContent":["/*\r\n Avatar.tsx\r\n * Enterprise-grade Avatar component.\r\n */\r\nimport React, { useState } from 'react';\r\nimport './Avatar.css';\r\n\r\ntype AvatarSize = 'sm' \| 'md' \| 'lg' \| 'xl';\r\ntype AvatarShape = 'circle' \| 'rounded' \| 'square';\r\ntype Status = 'online' \| 'offline' \| 'busy' \| undefined;\r\n\r\ninterface AvatarProps {\r\n src?: string;\r\n alt?: string;\r\n name?: string; // For initials fallback\r\n size?: AvatarSize;\r\n shape?: AvatarShape;\r\n status?: Status;\r\n loading?: boolean; // skeleton\r\n className?: string;\r\n fallbackIcon?: React.ReactNode;\r\n}\r\n\r\nfunction getInitials(name?: string): string {\r\n if (!name) return '';\r\n const parts = name.trim().split(' ');\r\n if (parts.length === 1) return parts[0].charAt(0).toUpperCase();\r\n return (parts[0][0] + parts[1][0]).toUpperCase();\r\n}\r\n\r\nexport function Avatar({\r\n src,\r\n alt,\r\n name,\r\n size = 'md',\r\n shape = 'circle',\r\n status,\r\n loading = false,\r\n className = '',\r\n fallbackIcon,\r\n}: AvatarProps) {\r\n const [errored, setErrored] = useState(false);\r\n const initials = getInitials(name);\r\n\r\n const classes = [\r\n 'ui-avatar',\r\n `ui-avatar--${size}`,\r\n `ui-avatar--${shape}`,\r\n loading && 'ui-avatar-loading',\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(' ');\r\n\r\n const showImage = src && !errored && !loading;\r\n\r\n return (\r\n <div className={classes} aria-label={alt \|\| name}>\r\n {showImage ? (\r\n <img\r\n src={src}\r\n alt={alt \|\| name \|\| 'avatar'}\r\n onError={() => setErrored(true)}\r\n />\r\n ) : initials ? (\r\n <span>{initials}</span>\r\n ) : fallbackIcon ? (\r\n <span>{fallbackIcon}</span>\r\n ) : (\r\n <span>?</span>\r\n )}\r\n\r\n {status && (\r\n <span\r\n className={[\r\n 'ui-avatar-status',\r\n status && `ui-avatar-status--${status}`,\r\n ]\r\n .filter(Boolean)\r\n .join(' ')}\r\n aria-label={status}\r\n />\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["getInitials","name","parts","Avatar","src","alt","size","shape","status","loading","className","fallbackIcon","errored","setErrored","useState","initials","classes","jsx"],"mappings":";;;AAuBA,SAASA,EAAYC,GAAuB;AAC1C,MAAI,CAACA,EAAM,QAAO;AAClB,QAAMC,IAAQD,EAAK,KAAA,EAAO,MAAM,GAAG;AACnC,SAAIC,EAAM,WAAW,IAAUA,EAAM,CAAC,EAAE,OAAO,CAAC,EAAE,YAAA,KAC1CA,EAAM,CAAC,EAAE,CAAC,IAAIA,EAAM,CAAC,EAAE,CAAC,GAAG,YAAA;AACrC;AAEO,SAASC,EAAO;AAAA,EACrB,KAAAC;AAAA,EACA,KAAAC;AAAA,EACA,MAAAJ;AAAA,EACA,MAAAK,IAAO;AAAA,EACP,OAAAC,IAAQ;AAAA,EACR,QAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,WAAAC,IAAY;AAAA,EACZ,cAAAC;AACF,GAAgB;AACd,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAS,EAAK,GACtCC,IAAWf,EAAYC,CAAI,GAE3Be,IAAU;AAAA,IACd;AAAA,IACA,cAAcV,CAAI;AAAA,IAClB,cAAcC,CAAK;AAAA,IACnBE,KAAW;AAAA,IACXC;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAIX,2BACG,OAAA,EAAI,WAAWM,GAAS,cAAYX,KAAOJ,GACzC,UAAA;AAAA,IAJaG,KAAO,CAACQ,KAAW,CAACH,IAKhC,gBAAAQ;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAb;AAAA,QACA,KAAKC,KAAOJ,KAAQ;AAAA,QACpB,SAAS,MAAMY,EAAW,EAAI;AAAA,MAAA;AAAA,IAAA,IAE9BE,IACF,gBAAAE,EAAC,QAAA,EAAM,UAAAF,EAAA,CAAS,IACdJ,IACF,gBAAAM,EAAC,QAAA,EAAM,UAAAN,EAAA,CAAa,IAEpB,gBAAAM,EAAC,UAAK,UAAA,KAAC;AAAA,IAGRT,KACC,gBAAAS;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACAT,KAAU,qBAAqBA,CAAM;AAAA,QAAA,EAEpC,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,QACX,cAAYA;AAAA,MAAA;AAAA,IAAA;AAAA,EACd,GAEJ;AAEJ;"}
1	+ {"version":3,"file":"Avatar.js","sources":["../../../src/components/avatar/Avatar.tsx"],"sourcesContent":["/*\r\n Avatar.tsx\r\n * Enterprise-grade Avatar component.\r\n */\r\nimport React, { useState } from 'react';\r\nimport './Avatar.css';\r\n\r\ntype AvatarSize = 'sm' \| 'md' \| 'lg' \| 'xl';\r\ntype AvatarShape = 'circle' \| 'rounded' \| 'square';\r\ntype Status = 'online' \| 'offline' \| 'busy' \| undefined;\r\n\r\ninterface AvatarProps {\r\n src?: string;\r\n alt?: string;\r\n name?: string; // For initials fallback\r\n size?: AvatarSize;\r\n shape?: AvatarShape;\r\n status?: Status;\r\n loading?: boolean; // skeleton\r\n className?: string;\r\n fallbackIcon?: React.ReactNode;\r\n}\r\n\r\nfunction getInitials(name?: string): string {\r\n if (!name) return '';\r\n const parts = name.trim().split(' ');\r\n if (parts.length === 1) return parts[0].charAt(0).toUpperCase();\r\n return (parts[0][0] + parts[1][0]).toUpperCase();\r\n}\r\n\r\nexport function Avatar({\r\n src,\r\n alt,\r\n name,\r\n size = 'md',\r\n shape = 'circle',\r\n status,\r\n loading = false,\r\n className = '',\r\n fallbackIcon,\r\n}: AvatarProps) {\r\n const [errored, setErrored] = useState(false);\r\n const initials = getInitials(name);\r\n\r\n const classes = [\r\n 'ui-avatar',\r\n `ui-avatar--${size}`,\r\n `ui-avatar--${shape}`,\r\n loading && 'ui-avatar-loading',\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(' ');\r\n\r\n const showImage = src && !errored && !loading;\r\n\r\n return (\r\n <div className={classes} aria-label={alt \|\| name}>\r\n {showImage ? (\r\n <img\r\n src={src}\r\n alt={alt \|\| name \|\| 'avatar'}\r\n onError={() => setErrored(true)}\r\n />\r\n ) : initials ? (\r\n <span>{initials}</span>\r\n ) : fallbackIcon ? (\r\n <span>{fallbackIcon}</span>\r\n ) : (\r\n <span>?</span>\r\n )}\r\n\r\n {status && (\r\n <span\r\n className={[\r\n 'ui-avatar-status',\r\n status && `ui-avatar-status--${status}`,\r\n ]\r\n .filter(Boolean)\r\n .join(' ')}\r\n aria-label={status}\r\n />\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["getInitials","name","parts","Avatar","src","alt","size","shape","status","loading","className","fallbackIcon","errored","setErrored","useState","initials","classes","jsx"],"mappings":";;;AAuBA,SAASA,EAAYC,GAAuB;AAC1C,MAAI,CAACA,EAAM,QAAO;AAClB,QAAMC,IAAQD,EAAK,KAAA,EAAO,MAAM,GAAG;AACnC,SAAIC,EAAM,WAAW,IAAUA,EAAM,CAAC,EAAE,OAAO,CAAC,EAAE,YAAA,KAC1CA,EAAM,CAAC,EAAE,CAAC,IAAIA,EAAM,CAAC,EAAE,CAAC,GAAG,YAAA;AACrC;AAEO,SAASC,EAAO;AAAA,EACrB,KAAAC;AAAA,EACA,KAAAC;AAAA,EACA,MAAAJ;AAAA,EACA,MAAAK,IAAO;AAAA,EACP,OAAAC,IAAQ;AAAA,EACR,QAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,WAAAC,IAAY;AAAA,EACZ,cAAAC;AACF,GAAgB;AACd,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAS,EAAK,GACtCC,IAAWf,EAAYC,CAAI,GAE3Be,IAAU;AAAA,IACd;AAAA,IACA,cAAcV,CAAI;AAAA,IAClB,cAAcC,CAAK;AAAA,IACnBE,KAAW;AAAA,IACXC;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAIX,2BACG,OAAA,EAAI,WAAWM,GAAS,cAAYX,KAAOJ,GACzC,UAAA;AAAA,IAJaG,KAAO,CAACQ,KAAW,CAACH,IAKhC,gBAAAQ;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAb;AAAA,QACA,KAAKC,KAAOJ,KAAQ;AAAA,QACpB,SAAS,MAAMY,EAAW,EAAI;AAAA,MAAA;AAAA,IAAA,IAE9BE,IACF,gBAAAE,EAAC,QAAA,EAAM,UAAAF,EAAA,CAAS,IACdJ,IACF,gBAAAM,EAAC,QAAA,EAAM,UAAAN,EAAA,CAAa,IAEpB,gBAAAM,EAAC,UAAK,UAAA,KAAC;AAAA,IAGRT,KACC,gBAAAS;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACAT,KAAU,qBAAqBA,CAAM;AAAA,QAAA,EAEpC,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,QACX,cAAYA;AAAA,MAAA;AAAA,IAAA;AAAA,EACd,GAEJ;AAEJ;"}

package/dist/components/avatar/AvatarGroup.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AvatarGroup.cjs","sources":["~~../../../../~~src/components/avatar/AvatarGroup.tsx"],"sourcesContent":["/*\r\n AvatarGroup.tsx\r\n * Displays overlapping avatars, with overflow like +3\r\n */\r\nimport React from 'react';\r\nimport './Avatar.css';\r\n\r\ninterface AvatarGroupProps {\r\n children: React.ReactNode[];\r\n max?: number;\r\n size?: 'sm' \| 'md' \| 'lg' \| 'xl';\r\n className?: string;\r\n}\r\n\r\nexport function AvatarGroup({\r\n children,\r\n max = 3,\r\n size = 'md',\r\n className = '',\r\n}: AvatarGroupProps) {\r\n const items = React.Children.toArray(children);\r\n const visible = items.slice(0, max);\r\n const extra = items.length - max;\r\n\r\n return (\r\n <div className={['ui-avatar-group', className].join(' ')}>\r\n {visible.map((child, i) => (\r\n <React.Fragment key={i}>{child}</React.Fragment>\r\n ))}\r\n\r\n {extra > 0 && (\r\n <div\r\n className={[\r\n 'ui-avatar',\r\n `ui-avatar--${size}`,\r\n 'ui-avatar-group-overflow',\r\n ].join(' ')}\r\n >\r\n +{extra}\r\n </div>\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["AvatarGroup","children","max","size","className","items","React","visible","extra","jsxs","child","i","jsx"],"mappings":"oKAcO,SAASA,EAAY,CAC1B,SAAAC,EACA,IAAAC,EAAM,EACN,KAAAC,EAAO,KACP,UAAAC,EAAY,EACd,EAAqB,CACnB,MAAMC,EAAQC,EAAM,SAAS,QAAQL,CAAQ,EACvCM,EAAUF,EAAM,MAAM,EAAGH,CAAG,EAC5BM,EAAQH,EAAM,OAASH,EAE7B,OACEO,OAAC,OAAI,UAAW,CAAC,kBAAmBL,CAAS,EAAE,KAAK,GAAG,EACpD,SAAA,CAAAG,EAAQ,IAAI,CAACG,EAAOC,IACnBC,EAAAA,IAACN,EAAM,SAAN,CAAwB,SAAAI,CAAA,EAAJC,CAAU,CAChC,EAEAH,EAAQ,GACPC,EAAAA,KAAC,MAAA,CACC,UAAW,CACT,YACA,cAAcN,CAAI,GAClB,0BAAA,EACA,KAAK,GAAG,EACX,SAAA,CAAA,IACGK,CAAA,CAAA,CAAA,CACJ,EAEJ,CAEJ"}
1	+ {"version":3,"file":"AvatarGroup.cjs","sources":["../../../src/components/avatar/AvatarGroup.tsx"],"sourcesContent":["/*\r\n AvatarGroup.tsx\r\n * Displays overlapping avatars, with overflow like +3\r\n */\r\nimport React from 'react';\r\nimport './Avatar.css';\r\n\r\ninterface AvatarGroupProps {\r\n children: React.ReactNode[];\r\n max?: number;\r\n size?: 'sm' \| 'md' \| 'lg' \| 'xl';\r\n className?: string;\r\n}\r\n\r\nexport function AvatarGroup({\r\n children,\r\n max = 3,\r\n size = 'md',\r\n className = '',\r\n}: AvatarGroupProps) {\r\n const items = React.Children.toArray(children);\r\n const visible = items.slice(0, max);\r\n const extra = items.length - max;\r\n\r\n return (\r\n <div className={['ui-avatar-group', className].join(' ')}>\r\n {visible.map((child, i) => (\r\n <React.Fragment key={i}>{child}</React.Fragment>\r\n ))}\r\n\r\n {extra > 0 && (\r\n <div\r\n className={[\r\n 'ui-avatar',\r\n `ui-avatar--${size}`,\r\n 'ui-avatar-group-overflow',\r\n ].join(' ')}\r\n >\r\n +{extra}\r\n </div>\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["AvatarGroup","children","max","size","className","items","React","visible","extra","jsxs","child","i","jsx"],"mappings":"oKAcO,SAASA,EAAY,CAC1B,SAAAC,EACA,IAAAC,EAAM,EACN,KAAAC,EAAO,KACP,UAAAC,EAAY,EACd,EAAqB,CACnB,MAAMC,EAAQC,EAAM,SAAS,QAAQL,CAAQ,EACvCM,EAAUF,EAAM,MAAM,EAAGH,CAAG,EAC5BM,EAAQH,EAAM,OAASH,EAE7B,OACEO,OAAC,OAAI,UAAW,CAAC,kBAAmBL,CAAS,EAAE,KAAK,GAAG,EACpD,SAAA,CAAAG,EAAQ,IAAI,CAACG,EAAOC,IACnBC,EAAAA,IAACN,EAAM,SAAN,CAAwB,SAAAI,CAAA,EAAJC,CAAU,CAChC,EAEAH,EAAQ,GACPC,EAAAA,KAAC,MAAA,CACC,UAAW,CACT,YACA,cAAcN,CAAI,GAClB,0BAAA,EACA,KAAK,GAAG,EACX,SAAA,CAAA,IACGK,CAAA,CAAA,CAAA,CACJ,EAEJ,CAEJ"}

package/dist/components/avatar/AvatarGroup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AvatarGroup.js","sources":["~~../../../../~~src/components/avatar/AvatarGroup.tsx"],"sourcesContent":["/*\r\n AvatarGroup.tsx\r\n * Displays overlapping avatars, with overflow like +3\r\n */\r\nimport React from 'react';\r\nimport './Avatar.css';\r\n\r\ninterface AvatarGroupProps {\r\n children: React.ReactNode[];\r\n max?: number;\r\n size?: 'sm' \| 'md' \| 'lg' \| 'xl';\r\n className?: string;\r\n}\r\n\r\nexport function AvatarGroup({\r\n children,\r\n max = 3,\r\n size = 'md',\r\n className = '',\r\n}: AvatarGroupProps) {\r\n const items = React.Children.toArray(children);\r\n const visible = items.slice(0, max);\r\n const extra = items.length - max;\r\n\r\n return (\r\n <div className={['ui-avatar-group', className].join(' ')}>\r\n {visible.map((child, i) => (\r\n <React.Fragment key={i}>{child}</React.Fragment>\r\n ))}\r\n\r\n {extra > 0 && (\r\n <div\r\n className={[\r\n 'ui-avatar',\r\n `ui-avatar--${size}`,\r\n 'ui-avatar-group-overflow',\r\n ].join(' ')}\r\n >\r\n +{extra}\r\n </div>\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["AvatarGroup","children","max","size","className","items","React","visible","extra","jsxs","child","i","jsx"],"mappings":";;;AAcO,SAASA,EAAY;AAAA,EAC1B,UAAAC;AAAA,EACA,KAAAC,IAAM;AAAA,EACN,MAAAC,IAAO;AAAA,EACP,WAAAC,IAAY;AACd,GAAqB;AACnB,QAAMC,IAAQC,EAAM,SAAS,QAAQL,CAAQ,GACvCM,IAAUF,EAAM,MAAM,GAAGH,CAAG,GAC5BM,IAAQH,EAAM,SAASH;AAE7B,SACE,gBAAAO,EAAC,SAAI,WAAW,CAAC,mBAAmBL,CAAS,EAAE,KAAK,GAAG,GACpD,UAAA;AAAA,IAAAG,EAAQ,IAAI,CAACG,GAAOC,MACnB,gBAAAC,EAACN,EAAM,UAAN,EAAwB,UAAAI,EAAA,GAAJC,CAAU,CAChC;AAAA,IAEAH,IAAQ,KACP,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA,cAAcN,CAAI;AAAA,UAClB;AAAA,QAAA,EACA,KAAK,GAAG;AAAA,QACX,UAAA;AAAA,UAAA;AAAA,UACGK;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACJ,GAEJ;AAEJ;"}
1	+ {"version":3,"file":"AvatarGroup.js","sources":["../../../src/components/avatar/AvatarGroup.tsx"],"sourcesContent":["/*\r\n AvatarGroup.tsx\r\n * Displays overlapping avatars, with overflow like +3\r\n */\r\nimport React from 'react';\r\nimport './Avatar.css';\r\n\r\ninterface AvatarGroupProps {\r\n children: React.ReactNode[];\r\n max?: number;\r\n size?: 'sm' \| 'md' \| 'lg' \| 'xl';\r\n className?: string;\r\n}\r\n\r\nexport function AvatarGroup({\r\n children,\r\n max = 3,\r\n size = 'md',\r\n className = '',\r\n}: AvatarGroupProps) {\r\n const items = React.Children.toArray(children);\r\n const visible = items.slice(0, max);\r\n const extra = items.length - max;\r\n\r\n return (\r\n <div className={['ui-avatar-group', className].join(' ')}>\r\n {visible.map((child, i) => (\r\n <React.Fragment key={i}>{child}</React.Fragment>\r\n ))}\r\n\r\n {extra > 0 && (\r\n <div\r\n className={[\r\n 'ui-avatar',\r\n `ui-avatar--${size}`,\r\n 'ui-avatar-group-overflow',\r\n ].join(' ')}\r\n >\r\n +{extra}\r\n </div>\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["AvatarGroup","children","max","size","className","items","React","visible","extra","jsxs","child","i","jsx"],"mappings":";;;AAcO,SAASA,EAAY;AAAA,EAC1B,UAAAC;AAAA,EACA,KAAAC,IAAM;AAAA,EACN,MAAAC,IAAO;AAAA,EACP,WAAAC,IAAY;AACd,GAAqB;AACnB,QAAMC,IAAQC,EAAM,SAAS,QAAQL,CAAQ,GACvCM,IAAUF,EAAM,MAAM,GAAGH,CAAG,GAC5BM,IAAQH,EAAM,SAASH;AAE7B,SACE,gBAAAO,EAAC,SAAI,WAAW,CAAC,mBAAmBL,CAAS,EAAE,KAAK,GAAG,GACpD,UAAA;AAAA,IAAAG,EAAQ,IAAI,CAACG,GAAOC,MACnB,gBAAAC,EAACN,EAAM,UAAN,EAAwB,UAAAI,EAAA,GAAJC,CAAU,CAChC;AAAA,IAEAH,IAAQ,KACP,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA,cAAcN,CAAI;AAAA,UAClB;AAAA,QAAA,EACA,KAAK,GAAG;AAAA,QACX,UAAA;AAAA,UAAA;AAAA,UACGK;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACJ,GAEJ;AAEJ;"}

package/dist/components/badge/Badge.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Badge.cjs","sources":["~~../../../../~~src/components/badge/Badge.tsx"],"sourcesContent":["/*\r\n Badge.tsx\r\n * ---------\r\n * Simple accessible badge component.\r\n \r\n Renders:\r\n * - <span> (default non-interactive)\r\n * - <a href=\"...\"> when `href` provided\r\n * - <button> when `onClick` provided\r\n \r\n Accessibility:\r\n * - If numeric content is provided, the component will add an accessible label\r\n * (e.g. \"5 new notifications\") if `ariaLabel` prop is omitted — this helps\r\n * screen reader users understand the meaning of the number.\r\n \r\n Usage:\r\n * <Badge>Beta</Badge>\r\n * <Badge variant=\"primary\" size=\"sm\">New</Badge>\r\n * <Badge onClick={() => {}} pill>5</Badge>\r\n /\r\n\r\nimport React from 'react';\r\nimport './Badge.css';\r\n\r\ntype Variant = 'default' \| 'primary' \| 'success' \| 'warning' \| 'danger';\r\ntype Size = 'sm' \| 'md' \| 'lg';\r\n\r\ninterface BadgeProps {\r\n children?: React.ReactNode;\r\n\r\n // count overflow\r\n count?: number;\r\n max?: number;\r\n\r\n variant?: Variant;\r\n size?: Size;\r\n pill?: boolean;\r\n dot?: boolean;\r\n\r\n href?: string;\r\n onClick?: () => void;\r\n\r\n ariaLabel?: string;\r\n className?: string;\r\n title?: string;\r\n\r\n iconLeft?: React.ReactNode;\r\n iconRight?: React.ReactNode;\r\n}\r\n\r\n/\r\n Helper: detect if something is number-like\r\n * (string numeric or number)\r\n /\r\nfunction isNumberLike(val: unknown): val is number \| string {\r\n if (typeof val === 'number') return true;\r\n if (\r\n typeof val === 'string' &&\r\n val.trim() !== '' &&\r\n !Number.isNaN(Number(val))\r\n ) {\r\n return true;\r\n }\r\n return false;\r\n}\r\n\r\nexport function Badge({\r\n children,\r\n count,\r\n max,\r\n variant = 'default',\r\n size = 'md',\r\n pill = false,\r\n dot = false,\r\n href,\r\n onClick,\r\n ariaLabel,\r\n className = '',\r\n title,\r\n iconLeft,\r\n iconRight,\r\n}: BadgeProps) {\r\n /\r\n Compute display logic (overflow 99+)\r\n * SAFE: no \"!\" used\r\n /\r\n let displayValue: React.ReactNode = children;\r\n\r\n if (isNumberLike(count)) {\r\n if (\r\n isNumberLike(max) &&\r\n typeof max === 'number' &&\r\n typeof count === 'number' &&\r\n count > max\r\n ) {\r\n displayValue = `${max}+`;\r\n } else {\r\n displayValue = count;\r\n }\r\n }\r\n\r\n /\r\n Compute aria-label\r\n /\r\n let computedAria: string \| undefined = ariaLabel;\r\n\r\n if (!computedAria && isNumberLike(count)) {\r\n computedAria =\r\n typeof count === 'number' ? `${count} notifications` : undefined;\r\n }\r\n\r\n const classes = [\r\n 'ui-badge',\r\n `ui-badge--${variant}`,\r\n `ui-badge--${size}`,\r\n pill && 'ui-badge--pill',\r\n dot && 'ui-badge--dot',\r\n (href \|\| onClick) && 'ui-badge--interactive',\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(' ');\r\n\r\n /\r\n Dot badge (no content)\r\n /\r\n if (dot) {\r\n return (\r\n <span\r\n className={classes}\r\n aria-label={computedAria}\r\n aria-hidden={computedAria ? undefined : true}\r\n title={title}\r\n />\r\n );\r\n }\r\n\r\n const content = (\r\n <span\r\n className=\"ui-badge-content\"\r\n aria-hidden={computedAria ? true : undefined}\r\n >\r\n {iconLeft && <span className=\"ui-badge__icon\">{iconLeft}</span>}\r\n {displayValue}\r\n {iconRight && <span className=\"ui-badge__icon\">{iconRight}</span>}\r\n </span>\r\n );\r\n\r\n /\r\n Anchor support\r\n /\r\n if (href) {\r\n return (\r\n <a\r\n href={href}\r\n className={classes}\r\n aria-label={computedAria}\r\n title={title}\r\n >\r\n {content}\r\n </a>\r\n );\r\n }\r\n\r\n /\r\n Button support\r\n /\r\n if (onClick) {\r\n return (\r\n <button\r\n type=\"button\"\r\n onClick={onClick}\r\n className={classes}\r\n aria-label={computedAria}\r\n title={title}\r\n >\r\n {content}\r\n </button>\r\n );\r\n }\r\n\r\n /\r\n Default <span>\r\n */\r\n return (\r\n <span className={classes} aria-label={computedAria} title={title}>\r\n {content}\r\n </span>\r\n );\r\n}\r\n"],"names":["isNumberLike","val","Badge","children","count","max","variant","size","pill","dot","href","onClick","ariaLabel","className","title","iconLeft","iconRight","displayValue","computedAria","classes","jsx","content","jsxs"],"mappings":"gJAsDA,SAASA,EAAaC,EAAsC,CAE1D,OADI,OAAOA,GAAQ,UAEjB,OAAOA,GAAQ,UACfA,EAAI,KAAA,IAAW,IACf,CAAC,OAAO,MAAM,OAAOA,CAAG,CAAC,CAK7B,CAEO,SAASC,EAAM,CACpB,SAAAC,EACA,MAAAC,EACA,IAAAC,EACA,QAAAC,EAAU,UACV,KAAAC,EAAO,KACP,KAAAC,EAAO,GACP,IAAAC,EAAM,GACN,KAAAC,EACA,QAAAC,EACA,UAAAC,EACA,UAAAC,EAAY,GACZ,MAAAC,EACA,SAAAC,EACA,UAAAC,CACF,EAAe,CAKb,IAAIC,EAAgCd,EAEhCH,EAAaI,CAAK,IAElBJ,EAAaK,CAAG,GAChB,OAAOA,GAAQ,UACf,OAAOD,GAAU,UACjBA,EAAQC,EAERY,EAAe,GAAGZ,CAAG,IAErBY,EAAeb,GAOnB,IAAIc,EAAmCN,EAEnC,CAACM,GAAgBlB,EAAaI,CAAK,IACrCc,EACE,OAAOd,GAAU,SAAW,GAAGA,CAAK,iBAAmB,QAG3D,MAAMe,EAAU,CACd,WACA,aAAab,CAAO,GACpB,aAAaC,CAAI,GACjBC,GAAQ,iBACRC,GAAO,iBACNC,GAAQC,IAAY,wBACrBE,CAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,EAKX,GAAIJ,EACF,OACEW,EAAAA,IAAC,OAAA,CACC,UAAWD,EACX,aAAYD,EACZ,cAAaA,EAAe,OAAY,GACxC,MAAAJ,CAAA,CAAA,EAKN,MAAMO,EACJC,EAAAA,KAAC,OAAA,CACC,UAAU,mBACV,cAAaJ,EAAe,GAAO,OAElC,SAAA,CAAAH,GAAYK,EAAAA,IAAC,OAAA,CAAK,UAAU,iBAAkB,SAAAL,EAAS,EACvDE,EACAD,GAAaI,EAAAA,IAAC,OAAA,CAAK,UAAU,iBAAkB,SAAAJ,CAAA,CAAU,CAAA,CAAA,CAAA,EAO9D,OAAIN,EAEAU,EAAAA,IAAC,IAAA,CACC,KAAAV,EACA,UAAWS,EACX,aAAYD,EACZ,MAAAJ,EAEC,SAAAO,CAAA,CAAA,EAQHV,EAEAS,EAAAA,IAAC,SAAA,CACC,KAAK,SACL,QAAAT,EACA,UAAWQ,EACX,aAAYD,EACZ,MAAAJ,EAEC,SAAAO,CAAA,CAAA,QASJ,OAAA,CAAK,UAAWF,EAAS,aAAYD,EAAc,MAAAJ,EACjD,SAAAO,EACH,CAEJ"}
1	+ {"version":3,"file":"Badge.cjs","sources":["../../../src/components/badge/Badge.tsx"],"sourcesContent":["/*\r\n Badge.tsx\r\n * ---------\r\n * Simple accessible badge component.\r\n \r\n Renders:\r\n * - <span> (default non-interactive)\r\n * - <a href=\"...\"> when `href` provided\r\n * - <button> when `onClick` provided\r\n \r\n Accessibility:\r\n * - If numeric content is provided, the component will add an accessible label\r\n * (e.g. \"5 new notifications\") if `ariaLabel` prop is omitted — this helps\r\n * screen reader users understand the meaning of the number.\r\n \r\n Usage:\r\n * <Badge>Beta</Badge>\r\n * <Badge variant=\"primary\" size=\"sm\">New</Badge>\r\n * <Badge onClick={() => {}} pill>5</Badge>\r\n /\r\n\r\nimport React from 'react';\r\nimport './Badge.css';\r\n\r\ntype Variant = 'default' \| 'primary' \| 'success' \| 'warning' \| 'danger';\r\ntype Size = 'sm' \| 'md' \| 'lg';\r\n\r\ninterface BadgeProps {\r\n children?: React.ReactNode;\r\n\r\n // count overflow\r\n count?: number;\r\n max?: number;\r\n\r\n variant?: Variant;\r\n size?: Size;\r\n pill?: boolean;\r\n dot?: boolean;\r\n\r\n href?: string;\r\n onClick?: () => void;\r\n\r\n ariaLabel?: string;\r\n className?: string;\r\n title?: string;\r\n\r\n iconLeft?: React.ReactNode;\r\n iconRight?: React.ReactNode;\r\n}\r\n\r\n/\r\n Helper: detect if something is number-like\r\n * (string numeric or number)\r\n /\r\nfunction isNumberLike(val: unknown): val is number \| string {\r\n if (typeof val === 'number') return true;\r\n if (\r\n typeof val === 'string' &&\r\n val.trim() !== '' &&\r\n !Number.isNaN(Number(val))\r\n ) {\r\n return true;\r\n }\r\n return false;\r\n}\r\n\r\nexport function Badge({\r\n children,\r\n count,\r\n max,\r\n variant = 'default',\r\n size = 'md',\r\n pill = false,\r\n dot = false,\r\n href,\r\n onClick,\r\n ariaLabel,\r\n className = '',\r\n title,\r\n iconLeft,\r\n iconRight,\r\n}: BadgeProps) {\r\n /\r\n Compute display logic (overflow 99+)\r\n * SAFE: no \"!\" used\r\n /\r\n let displayValue: React.ReactNode = children;\r\n\r\n if (isNumberLike(count)) {\r\n if (\r\n isNumberLike(max) &&\r\n typeof max === 'number' &&\r\n typeof count === 'number' &&\r\n count > max\r\n ) {\r\n displayValue = `${max}+`;\r\n } else {\r\n displayValue = count;\r\n }\r\n }\r\n\r\n /\r\n Compute aria-label\r\n /\r\n let computedAria: string \| undefined = ariaLabel;\r\n\r\n if (!computedAria && isNumberLike(count)) {\r\n computedAria =\r\n typeof count === 'number' ? `${count} notifications` : undefined;\r\n }\r\n\r\n const classes = [\r\n 'ui-badge',\r\n `ui-badge--${variant}`,\r\n `ui-badge--${size}`,\r\n pill && 'ui-badge--pill',\r\n dot && 'ui-badge--dot',\r\n (href \|\| onClick) && 'ui-badge--interactive',\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(' ');\r\n\r\n /\r\n Dot badge (no content)\r\n /\r\n if (dot) {\r\n return (\r\n <span\r\n className={classes}\r\n aria-label={computedAria}\r\n aria-hidden={computedAria ? undefined : true}\r\n title={title}\r\n />\r\n );\r\n }\r\n\r\n const content = (\r\n <span\r\n className=\"ui-badge-content\"\r\n aria-hidden={computedAria ? true : undefined}\r\n >\r\n {iconLeft && <span className=\"ui-badge__icon\">{iconLeft}</span>}\r\n {displayValue}\r\n {iconRight && <span className=\"ui-badge__icon\">{iconRight}</span>}\r\n </span>\r\n );\r\n\r\n /\r\n Anchor support\r\n /\r\n if (href) {\r\n return (\r\n <a\r\n href={href}\r\n className={classes}\r\n aria-label={computedAria}\r\n title={title}\r\n >\r\n {content}\r\n </a>\r\n );\r\n }\r\n\r\n /\r\n Button support\r\n /\r\n if (onClick) {\r\n return (\r\n <button\r\n type=\"button\"\r\n onClick={onClick}\r\n className={classes}\r\n aria-label={computedAria}\r\n title={title}\r\n >\r\n {content}\r\n </button>\r\n );\r\n }\r\n\r\n /\r\n Default <span>\r\n */\r\n return (\r\n <span className={classes} aria-label={computedAria} title={title}>\r\n {content}\r\n </span>\r\n );\r\n}\r\n"],"names":["isNumberLike","val","Badge","children","count","max","variant","size","pill","dot","href","onClick","ariaLabel","className","title","iconLeft","iconRight","displayValue","computedAria","classes","jsx","content","jsxs"],"mappings":"gJAsDA,SAASA,EAAaC,EAAsC,CAE1D,OADI,OAAOA,GAAQ,UAEjB,OAAOA,GAAQ,UACfA,EAAI,KAAA,IAAW,IACf,CAAC,OAAO,MAAM,OAAOA,CAAG,CAAC,CAK7B,CAEO,SAASC,EAAM,CACpB,SAAAC,EACA,MAAAC,EACA,IAAAC,EACA,QAAAC,EAAU,UACV,KAAAC,EAAO,KACP,KAAAC,EAAO,GACP,IAAAC,EAAM,GACN,KAAAC,EACA,QAAAC,EACA,UAAAC,EACA,UAAAC,EAAY,GACZ,MAAAC,EACA,SAAAC,EACA,UAAAC,CACF,EAAe,CAKb,IAAIC,EAAgCd,EAEhCH,EAAaI,CAAK,IAElBJ,EAAaK,CAAG,GAChB,OAAOA,GAAQ,UACf,OAAOD,GAAU,UACjBA,EAAQC,EAERY,EAAe,GAAGZ,CAAG,IAErBY,EAAeb,GAOnB,IAAIc,EAAmCN,EAEnC,CAACM,GAAgBlB,EAAaI,CAAK,IACrCc,EACE,OAAOd,GAAU,SAAW,GAAGA,CAAK,iBAAmB,QAG3D,MAAMe,EAAU,CACd,WACA,aAAab,CAAO,GACpB,aAAaC,CAAI,GACjBC,GAAQ,iBACRC,GAAO,iBACNC,GAAQC,IAAY,wBACrBE,CAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,EAKX,GAAIJ,EACF,OACEW,EAAAA,IAAC,OAAA,CACC,UAAWD,EACX,aAAYD,EACZ,cAAaA,EAAe,OAAY,GACxC,MAAAJ,CAAA,CAAA,EAKN,MAAMO,EACJC,EAAAA,KAAC,OAAA,CACC,UAAU,mBACV,cAAaJ,EAAe,GAAO,OAElC,SAAA,CAAAH,GAAYK,EAAAA,IAAC,OAAA,CAAK,UAAU,iBAAkB,SAAAL,EAAS,EACvDE,EACAD,GAAaI,EAAAA,IAAC,OAAA,CAAK,UAAU,iBAAkB,SAAAJ,CAAA,CAAU,CAAA,CAAA,CAAA,EAO9D,OAAIN,EAEAU,EAAAA,IAAC,IAAA,CACC,KAAAV,EACA,UAAWS,EACX,aAAYD,EACZ,MAAAJ,EAEC,SAAAO,CAAA,CAAA,EAQHV,EAEAS,EAAAA,IAAC,SAAA,CACC,KAAK,SACL,QAAAT,EACA,UAAWQ,EACX,aAAYD,EACZ,MAAAJ,EAEC,SAAAO,CAAA,CAAA,QASJ,OAAA,CAAK,UAAWF,EAAS,aAAYD,EAAc,MAAAJ,EACjD,SAAAO,EACH,CAEJ"}

package/dist/components/badge/Badge.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Badge.js","sources":["~~../../../../~~src/components/badge/Badge.tsx"],"sourcesContent":["/*\r\n Badge.tsx\r\n * ---------\r\n * Simple accessible badge component.\r\n \r\n Renders:\r\n * - <span> (default non-interactive)\r\n * - <a href=\"...\"> when `href` provided\r\n * - <button> when `onClick` provided\r\n \r\n Accessibility:\r\n * - If numeric content is provided, the component will add an accessible label\r\n * (e.g. \"5 new notifications\") if `ariaLabel` prop is omitted — this helps\r\n * screen reader users understand the meaning of the number.\r\n \r\n Usage:\r\n * <Badge>Beta</Badge>\r\n * <Badge variant=\"primary\" size=\"sm\">New</Badge>\r\n * <Badge onClick={() => {}} pill>5</Badge>\r\n /\r\n\r\nimport React from 'react';\r\nimport './Badge.css';\r\n\r\ntype Variant = 'default' \| 'primary' \| 'success' \| 'warning' \| 'danger';\r\ntype Size = 'sm' \| 'md' \| 'lg';\r\n\r\ninterface BadgeProps {\r\n children?: React.ReactNode;\r\n\r\n // count overflow\r\n count?: number;\r\n max?: number;\r\n\r\n variant?: Variant;\r\n size?: Size;\r\n pill?: boolean;\r\n dot?: boolean;\r\n\r\n href?: string;\r\n onClick?: () => void;\r\n\r\n ariaLabel?: string;\r\n className?: string;\r\n title?: string;\r\n\r\n iconLeft?: React.ReactNode;\r\n iconRight?: React.ReactNode;\r\n}\r\n\r\n/\r\n Helper: detect if something is number-like\r\n * (string numeric or number)\r\n /\r\nfunction isNumberLike(val: unknown): val is number \| string {\r\n if (typeof val === 'number') return true;\r\n if (\r\n typeof val === 'string' &&\r\n val.trim() !== '' &&\r\n !Number.isNaN(Number(val))\r\n ) {\r\n return true;\r\n }\r\n return false;\r\n}\r\n\r\nexport function Badge({\r\n children,\r\n count,\r\n max,\r\n variant = 'default',\r\n size = 'md',\r\n pill = false,\r\n dot = false,\r\n href,\r\n onClick,\r\n ariaLabel,\r\n className = '',\r\n title,\r\n iconLeft,\r\n iconRight,\r\n}: BadgeProps) {\r\n /\r\n Compute display logic (overflow 99+)\r\n * SAFE: no \"!\" used\r\n /\r\n let displayValue: React.ReactNode = children;\r\n\r\n if (isNumberLike(count)) {\r\n if (\r\n isNumberLike(max) &&\r\n typeof max === 'number' &&\r\n typeof count === 'number' &&\r\n count > max\r\n ) {\r\n displayValue = `${max}+`;\r\n } else {\r\n displayValue = count;\r\n }\r\n }\r\n\r\n /\r\n Compute aria-label\r\n /\r\n let computedAria: string \| undefined = ariaLabel;\r\n\r\n if (!computedAria && isNumberLike(count)) {\r\n computedAria =\r\n typeof count === 'number' ? `${count} notifications` : undefined;\r\n }\r\n\r\n const classes = [\r\n 'ui-badge',\r\n `ui-badge--${variant}`,\r\n `ui-badge--${size}`,\r\n pill && 'ui-badge--pill',\r\n dot && 'ui-badge--dot',\r\n (href \|\| onClick) && 'ui-badge--interactive',\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(' ');\r\n\r\n /\r\n Dot badge (no content)\r\n /\r\n if (dot) {\r\n return (\r\n <span\r\n className={classes}\r\n aria-label={computedAria}\r\n aria-hidden={computedAria ? undefined : true}\r\n title={title}\r\n />\r\n );\r\n }\r\n\r\n const content = (\r\n <span\r\n className=\"ui-badge-content\"\r\n aria-hidden={computedAria ? true : undefined}\r\n >\r\n {iconLeft && <span className=\"ui-badge__icon\">{iconLeft}</span>}\r\n {displayValue}\r\n {iconRight && <span className=\"ui-badge__icon\">{iconRight}</span>}\r\n </span>\r\n );\r\n\r\n /\r\n Anchor support\r\n /\r\n if (href) {\r\n return (\r\n <a\r\n href={href}\r\n className={classes}\r\n aria-label={computedAria}\r\n title={title}\r\n >\r\n {content}\r\n </a>\r\n );\r\n }\r\n\r\n /\r\n Button support\r\n /\r\n if (onClick) {\r\n return (\r\n <button\r\n type=\"button\"\r\n onClick={onClick}\r\n className={classes}\r\n aria-label={computedAria}\r\n title={title}\r\n >\r\n {content}\r\n </button>\r\n );\r\n }\r\n\r\n /\r\n Default <span>\r\n */\r\n return (\r\n <span className={classes} aria-label={computedAria} title={title}>\r\n {content}\r\n </span>\r\n );\r\n}\r\n"],"names":["isNumberLike","val","Badge","children","count","max","variant","size","pill","dot","href","onClick","ariaLabel","className","title","iconLeft","iconRight","displayValue","computedAria","classes","jsx","content","jsxs"],"mappings":";;AAsDA,SAASA,EAAaC,GAAsC;AAE1D,SADI,OAAOA,KAAQ,YAEjB,OAAOA,KAAQ,YACfA,EAAI,KAAA,MAAW,MACf,CAAC,OAAO,MAAM,OAAOA,CAAG,CAAC;AAK7B;AAEO,SAASC,EAAM;AAAA,EACpB,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,KAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AAAA,EACP,MAAAC,IAAO;AAAA,EACP,KAAAC,IAAM;AAAA,EACN,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AACF,GAAe;AAKb,MAAIC,IAAgCd;AAEpC,EAAIH,EAAaI,CAAK,MAElBJ,EAAaK,CAAG,KAChB,OAAOA,KAAQ,YACf,OAAOD,KAAU,YACjBA,IAAQC,IAERY,IAAe,GAAGZ,CAAG,MAErBY,IAAeb;AAOnB,MAAIc,IAAmCN;AAEvC,EAAI,CAACM,KAAgBlB,EAAaI,CAAK,MACrCc,IACE,OAAOd,KAAU,WAAW,GAAGA,CAAK,mBAAmB;AAG3D,QAAMe,IAAU;AAAA,IACd;AAAA,IACA,aAAab,CAAO;AAAA,IACpB,aAAaC,CAAI;AAAA,IACjBC,KAAQ;AAAA,IACRC,KAAO;AAAA,KACNC,KAAQC,MAAY;AAAA,IACrBE;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAKX,MAAIJ;AACF,WACE,gBAAAW;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWD;AAAA,QACX,cAAYD;AAAA,QACZ,eAAaA,IAAe,SAAY;AAAA,QACxC,OAAAJ;AAAA,MAAA;AAAA,IAAA;AAKN,QAAMO,IACJ,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAaJ,IAAe,KAAO;AAAA,MAElC,UAAA;AAAA,QAAAH,KAAY,gBAAAK,EAAC,QAAA,EAAK,WAAU,kBAAkB,UAAAL,GAAS;AAAA,QACvDE;AAAA,QACAD,KAAa,gBAAAI,EAAC,QAAA,EAAK,WAAU,kBAAkB,UAAAJ,EAAA,CAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAO9D,SAAIN,IAEA,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAAV;AAAA,MACA,WAAWS;AAAA,MACX,cAAYD;AAAA,MACZ,OAAAJ;AAAA,MAEC,UAAAO;AAAA,IAAA;AAAA,EAAA,IAQHV,IAEA,gBAAAS;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,SAAAT;AAAA,MACA,WAAWQ;AAAA,MACX,cAAYD;AAAA,MACZ,OAAAJ;AAAA,MAEC,UAAAO;AAAA,IAAA;AAAA,EAAA,sBASJ,QAAA,EAAK,WAAWF,GAAS,cAAYD,GAAc,OAAAJ,GACjD,UAAAO,GACH;AAEJ;"}
1	+ {"version":3,"file":"Badge.js","sources":["../../../src/components/badge/Badge.tsx"],"sourcesContent":["/*\r\n Badge.tsx\r\n * ---------\r\n * Simple accessible badge component.\r\n \r\n Renders:\r\n * - <span> (default non-interactive)\r\n * - <a href=\"...\"> when `href` provided\r\n * - <button> when `onClick` provided\r\n \r\n Accessibility:\r\n * - If numeric content is provided, the component will add an accessible label\r\n * (e.g. \"5 new notifications\") if `ariaLabel` prop is omitted — this helps\r\n * screen reader users understand the meaning of the number.\r\n \r\n Usage:\r\n * <Badge>Beta</Badge>\r\n * <Badge variant=\"primary\" size=\"sm\">New</Badge>\r\n * <Badge onClick={() => {}} pill>5</Badge>\r\n /\r\n\r\nimport React from 'react';\r\nimport './Badge.css';\r\n\r\ntype Variant = 'default' \| 'primary' \| 'success' \| 'warning' \| 'danger';\r\ntype Size = 'sm' \| 'md' \| 'lg';\r\n\r\ninterface BadgeProps {\r\n children?: React.ReactNode;\r\n\r\n // count overflow\r\n count?: number;\r\n max?: number;\r\n\r\n variant?: Variant;\r\n size?: Size;\r\n pill?: boolean;\r\n dot?: boolean;\r\n\r\n href?: string;\r\n onClick?: () => void;\r\n\r\n ariaLabel?: string;\r\n className?: string;\r\n title?: string;\r\n\r\n iconLeft?: React.ReactNode;\r\n iconRight?: React.ReactNode;\r\n}\r\n\r\n/\r\n Helper: detect if something is number-like\r\n * (string numeric or number)\r\n /\r\nfunction isNumberLike(val: unknown): val is number \| string {\r\n if (typeof val === 'number') return true;\r\n if (\r\n typeof val === 'string' &&\r\n val.trim() !== '' &&\r\n !Number.isNaN(Number(val))\r\n ) {\r\n return true;\r\n }\r\n return false;\r\n}\r\n\r\nexport function Badge({\r\n children,\r\n count,\r\n max,\r\n variant = 'default',\r\n size = 'md',\r\n pill = false,\r\n dot = false,\r\n href,\r\n onClick,\r\n ariaLabel,\r\n className = '',\r\n title,\r\n iconLeft,\r\n iconRight,\r\n}: BadgeProps) {\r\n /\r\n Compute display logic (overflow 99+)\r\n * SAFE: no \"!\" used\r\n /\r\n let displayValue: React.ReactNode = children;\r\n\r\n if (isNumberLike(count)) {\r\n if (\r\n isNumberLike(max) &&\r\n typeof max === 'number' &&\r\n typeof count === 'number' &&\r\n count > max\r\n ) {\r\n displayValue = `${max}+`;\r\n } else {\r\n displayValue = count;\r\n }\r\n }\r\n\r\n /\r\n Compute aria-label\r\n /\r\n let computedAria: string \| undefined = ariaLabel;\r\n\r\n if (!computedAria && isNumberLike(count)) {\r\n computedAria =\r\n typeof count === 'number' ? `${count} notifications` : undefined;\r\n }\r\n\r\n const classes = [\r\n 'ui-badge',\r\n `ui-badge--${variant}`,\r\n `ui-badge--${size}`,\r\n pill && 'ui-badge--pill',\r\n dot && 'ui-badge--dot',\r\n (href \|\| onClick) && 'ui-badge--interactive',\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(' ');\r\n\r\n /\r\n Dot badge (no content)\r\n /\r\n if (dot) {\r\n return (\r\n <span\r\n className={classes}\r\n aria-label={computedAria}\r\n aria-hidden={computedAria ? undefined : true}\r\n title={title}\r\n />\r\n );\r\n }\r\n\r\n const content = (\r\n <span\r\n className=\"ui-badge-content\"\r\n aria-hidden={computedAria ? true : undefined}\r\n >\r\n {iconLeft && <span className=\"ui-badge__icon\">{iconLeft}</span>}\r\n {displayValue}\r\n {iconRight && <span className=\"ui-badge__icon\">{iconRight}</span>}\r\n </span>\r\n );\r\n\r\n /\r\n Anchor support\r\n /\r\n if (href) {\r\n return (\r\n <a\r\n href={href}\r\n className={classes}\r\n aria-label={computedAria}\r\n title={title}\r\n >\r\n {content}\r\n </a>\r\n );\r\n }\r\n\r\n /\r\n Button support\r\n /\r\n if (onClick) {\r\n return (\r\n <button\r\n type=\"button\"\r\n onClick={onClick}\r\n className={classes}\r\n aria-label={computedAria}\r\n title={title}\r\n >\r\n {content}\r\n </button>\r\n );\r\n }\r\n\r\n /\r\n Default <span>\r\n */\r\n return (\r\n <span className={classes} aria-label={computedAria} title={title}>\r\n {content}\r\n </span>\r\n );\r\n}\r\n"],"names":["isNumberLike","val","Badge","children","count","max","variant","size","pill","dot","href","onClick","ariaLabel","className","title","iconLeft","iconRight","displayValue","computedAria","classes","jsx","content","jsxs"],"mappings":";;AAsDA,SAASA,EAAaC,GAAsC;AAE1D,SADI,OAAOA,KAAQ,YAEjB,OAAOA,KAAQ,YACfA,EAAI,KAAA,MAAW,MACf,CAAC,OAAO,MAAM,OAAOA,CAAG,CAAC;AAK7B;AAEO,SAASC,EAAM;AAAA,EACpB,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,KAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AAAA,EACP,MAAAC,IAAO;AAAA,EACP,KAAAC,IAAM;AAAA,EACN,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AACF,GAAe;AAKb,MAAIC,IAAgCd;AAEpC,EAAIH,EAAaI,CAAK,MAElBJ,EAAaK,CAAG,KAChB,OAAOA,KAAQ,YACf,OAAOD,KAAU,YACjBA,IAAQC,IAERY,IAAe,GAAGZ,CAAG,MAErBY,IAAeb;AAOnB,MAAIc,IAAmCN;AAEvC,EAAI,CAACM,KAAgBlB,EAAaI,CAAK,MACrCc,IACE,OAAOd,KAAU,WAAW,GAAGA,CAAK,mBAAmB;AAG3D,QAAMe,IAAU;AAAA,IACd;AAAA,IACA,aAAab,CAAO;AAAA,IACpB,aAAaC,CAAI;AAAA,IACjBC,KAAQ;AAAA,IACRC,KAAO;AAAA,KACNC,KAAQC,MAAY;AAAA,IACrBE;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAKX,MAAIJ;AACF,WACE,gBAAAW;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWD;AAAA,QACX,cAAYD;AAAA,QACZ,eAAaA,IAAe,SAAY;AAAA,QACxC,OAAAJ;AAAA,MAAA;AAAA,IAAA;AAKN,QAAMO,IACJ,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAaJ,IAAe,KAAO;AAAA,MAElC,UAAA;AAAA,QAAAH,KAAY,gBAAAK,EAAC,QAAA,EAAK,WAAU,kBAAkB,UAAAL,GAAS;AAAA,QACvDE;AAAA,QACAD,KAAa,gBAAAI,EAAC,QAAA,EAAK,WAAU,kBAAkB,UAAAJ,EAAA,CAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAO9D,SAAIN,IAEA,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAAV;AAAA,MACA,WAAWS;AAAA,MACX,cAAYD;AAAA,MACZ,OAAAJ;AAAA,MAEC,UAAAO;AAAA,IAAA;AAAA,EAAA,IAQHV,IAEA,gBAAAS;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,SAAAT;AAAA,MACA,WAAWQ;AAAA,MACX,cAAYD;AAAA,MACZ,OAAAJ;AAAA,MAEC,UAAAO;AAAA,IAAA;AAAA,EAAA,sBASJ,QAAA,EAAK,WAAWF,GAAS,cAAYD,GAAc,OAAAJ,GACjD,UAAAO,GACH;AAEJ;"}

package/dist/components/badge/BadgeGroup.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BadgeGroup.cjs","sources":["~~../../../../~~src/components/badge/BadgeGroup.tsx"],"sourcesContent":["/*\r\n BadgeGroup.tsx\r\n * Stacks badges horizontally with overflow (e.g. +3).\r\n */\r\n\r\nimport React from 'react';\r\nimport { Badge } from './Badge';\r\n\r\ninterface BadgeGroupProps {\r\n items: React.ReactNode[];\r\n max?: number; // visible badges\r\n className?: string;\r\n}\r\n\r\nexport function BadgeGroup({\r\n items,\r\n max = 3,\r\n className = '',\r\n}: BadgeGroupProps) {\r\n const visible = items.slice(0, max);\r\n const extra = items.length - max;\r\n\r\n return (\r\n <div className={['ui-badge-group', className].join(' ')}>\r\n {visible.map((item, i) => (\r\n <span key={i}>{item}</span>\r\n ))}\r\n\r\n {extra > 0 && <Badge pill variant=\"default\">{`+${extra}`}</Badge>}\r\n </div>\r\n );\r\n}\r\n"],"names":["BadgeGroup","items","max","className","visible","extra","jsxs","item","i","jsx","Badge"],"mappings":"8IAcO,SAASA,EAAW,CACzB,MAAAC,EACA,IAAAC,EAAM,EACN,UAAAC,EAAY,EACd,EAAoB,CAClB,MAAMC,EAAUH,EAAM,MAAM,EAAGC,CAAG,EAC5BG,EAAQJ,EAAM,OAASC,EAE7B,OACEI,OAAC,OAAI,UAAW,CAAC,iBAAkBH,CAAS,EAAE,KAAK,GAAG,EACnD,SAAA,CAAAC,EAAQ,IAAI,CAACG,EAAMC,UACjB,OAAA,CAAc,SAAAD,CAAA,EAAJC,CAAS,CACrB,EAEAH,EAAQ,GAAKI,EAAAA,IAACC,EAAAA,MAAA,CAAM,KAAI,GAAC,QAAQ,UAAW,SAAA,IAAIL,CAAK,EAAA,CAAG,CAAA,EAC3D,CAEJ"}
1	+ {"version":3,"file":"BadgeGroup.cjs","sources":["../../../src/components/badge/BadgeGroup.tsx"],"sourcesContent":["/*\r\n BadgeGroup.tsx\r\n * Stacks badges horizontally with overflow (e.g. +3).\r\n */\r\n\r\nimport React from 'react';\r\nimport { Badge } from './Badge';\r\n\r\ninterface BadgeGroupProps {\r\n items: React.ReactNode[];\r\n max?: number; // visible badges\r\n className?: string;\r\n}\r\n\r\nexport function BadgeGroup({\r\n items,\r\n max = 3,\r\n className = '',\r\n}: BadgeGroupProps) {\r\n const visible = items.slice(0, max);\r\n const extra = items.length - max;\r\n\r\n return (\r\n <div className={['ui-badge-group', className].join(' ')}>\r\n {visible.map((item, i) => (\r\n <span key={i}>{item}</span>\r\n ))}\r\n\r\n {extra > 0 && <Badge pill variant=\"default\">{`+${extra}`}</Badge>}\r\n </div>\r\n );\r\n}\r\n"],"names":["BadgeGroup","items","max","className","visible","extra","jsxs","item","i","jsx","Badge"],"mappings":"8IAcO,SAASA,EAAW,CACzB,MAAAC,EACA,IAAAC,EAAM,EACN,UAAAC,EAAY,EACd,EAAoB,CAClB,MAAMC,EAAUH,EAAM,MAAM,EAAGC,CAAG,EAC5BG,EAAQJ,EAAM,OAASC,EAE7B,OACEI,OAAC,OAAI,UAAW,CAAC,iBAAkBH,CAAS,EAAE,KAAK,GAAG,EACnD,SAAA,CAAAC,EAAQ,IAAI,CAACG,EAAMC,UACjB,OAAA,CAAc,SAAAD,CAAA,EAAJC,CAAS,CACrB,EAEAH,EAAQ,GAAKI,EAAAA,IAACC,EAAAA,MAAA,CAAM,KAAI,GAAC,QAAQ,UAAW,SAAA,IAAIL,CAAK,EAAA,CAAG,CAAA,EAC3D,CAEJ"}

package/dist/components/badge/BadgeGroup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BadgeGroup.js","sources":["~~../../../../~~src/components/badge/BadgeGroup.tsx"],"sourcesContent":["/*\r\n BadgeGroup.tsx\r\n * Stacks badges horizontally with overflow (e.g. +3).\r\n */\r\n\r\nimport React from 'react';\r\nimport { Badge } from './Badge';\r\n\r\ninterface BadgeGroupProps {\r\n items: React.ReactNode[];\r\n max?: number; // visible badges\r\n className?: string;\r\n}\r\n\r\nexport function BadgeGroup({\r\n items,\r\n max = 3,\r\n className = '',\r\n}: BadgeGroupProps) {\r\n const visible = items.slice(0, max);\r\n const extra = items.length - max;\r\n\r\n return (\r\n <div className={['ui-badge-group', className].join(' ')}>\r\n {visible.map((item, i) => (\r\n <span key={i}>{item}</span>\r\n ))}\r\n\r\n {extra > 0 && <Badge pill variant=\"default\">{`+${extra}`}</Badge>}\r\n </div>\r\n );\r\n}\r\n"],"names":["BadgeGroup","items","max","className","visible","extra","jsxs","item","i","jsx","Badge"],"mappings":";;AAcO,SAASA,EAAW;AAAA,EACzB,OAAAC;AAAA,EACA,KAAAC,IAAM;AAAA,EACN,WAAAC,IAAY;AACd,GAAoB;AAClB,QAAMC,IAAUH,EAAM,MAAM,GAAGC,CAAG,GAC5BG,IAAQJ,EAAM,SAASC;AAE7B,SACE,gBAAAI,EAAC,SAAI,WAAW,CAAC,kBAAkBH,CAAS,EAAE,KAAK,GAAG,GACnD,UAAA;AAAA,IAAAC,EAAQ,IAAI,CAACG,GAAMC,wBACjB,QAAA,EAAc,UAAAD,EAAA,GAAJC,CAAS,CACrB;AAAA,IAEAH,IAAQ,KAAK,gBAAAI,EAACC,GAAA,EAAM,MAAI,IAAC,SAAQ,WAAW,UAAA,IAAIL,CAAK,GAAA,CAAG;AAAA,EAAA,GAC3D;AAEJ;"}
1	+ {"version":3,"file":"BadgeGroup.js","sources":["../../../src/components/badge/BadgeGroup.tsx"],"sourcesContent":["/*\r\n BadgeGroup.tsx\r\n * Stacks badges horizontally with overflow (e.g. +3).\r\n */\r\n\r\nimport React from 'react';\r\nimport { Badge } from './Badge';\r\n\r\ninterface BadgeGroupProps {\r\n items: React.ReactNode[];\r\n max?: number; // visible badges\r\n className?: string;\r\n}\r\n\r\nexport function BadgeGroup({\r\n items,\r\n max = 3,\r\n className = '',\r\n}: BadgeGroupProps) {\r\n const visible = items.slice(0, max);\r\n const extra = items.length - max;\r\n\r\n return (\r\n <div className={['ui-badge-group', className].join(' ')}>\r\n {visible.map((item, i) => (\r\n <span key={i}>{item}</span>\r\n ))}\r\n\r\n {extra > 0 && <Badge pill variant=\"default\">{`+${extra}`}</Badge>}\r\n </div>\r\n );\r\n}\r\n"],"names":["BadgeGroup","items","max","className","visible","extra","jsxs","item","i","jsx","Badge"],"mappings":";;AAcO,SAASA,EAAW;AAAA,EACzB,OAAAC;AAAA,EACA,KAAAC,IAAM;AAAA,EACN,WAAAC,IAAY;AACd,GAAoB;AAClB,QAAMC,IAAUH,EAAM,MAAM,GAAGC,CAAG,GAC5BG,IAAQJ,EAAM,SAASC;AAE7B,SACE,gBAAAI,EAAC,SAAI,WAAW,CAAC,kBAAkBH,CAAS,EAAE,KAAK,GAAG,GACnD,UAAA;AAAA,IAAAC,EAAQ,IAAI,CAACG,GAAMC,wBACjB,QAAA,EAAc,UAAAD,EAAA,GAAJC,CAAS,CACrB;AAAA,IAEAH,IAAQ,KAAK,gBAAAI,EAACC,GAAA,EAAM,MAAI,IAAC,SAAQ,WAAW,UAAA,IAAIL,CAAK,GAAA,CAAG;AAAA,EAAA,GAC3D;AAEJ;"}

package/dist/components/breadcrumbs/Breadcrumbs.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Breadcrumbs.cjs","sources":["~~../../../../~~src/components/breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["/*\r\n Breadcrumbs.tsx — FINAL VERSION\r\n * --------------------------------\r\n * 100% matching your UI component architecture.\r\n \r\n Features:\r\n * - WAI-ARIA navigation\r\n * - Auto-collapse when too many items (optional)\r\n * - Custom separator support\r\n * - Keyboard accessible\r\n * - Ellipsis is non-interactive\r\n /\r\n\r\nimport React from 'react';\r\nimport './Breadcrumbs.css';\r\n\r\nexport interface Crumb {\r\n label: React.ReactNode;\r\n href?: string;\r\n onClick?: () => void;\r\n}\r\n\r\nexport interface BreadcrumbsProps {\r\n items: Crumb[];\r\n maxItems?: number; // collapse long breadcrumbs\r\n separator?: React.ReactNode;\r\n className?: string;\r\n}\r\n\r\nexport function Breadcrumbs({\r\n items,\r\n maxItems = 6, // default collapse threshold\r\n separator = '›',\r\n className = '',\r\n}: BreadcrumbsProps) {\r\n if (!items.length) return null;\r\n\r\n let finalItems: (Crumb \| '...')[] = [...items];\r\n\r\n / -------------------------------------------------------\r\n * Collapse logic\r\n * ------------------------------------------------------*/\r\n if (items.length > maxItems) {\r\n const start = items.slice(0, 2);\r\n const end = items.slice(-2);\r\n finalItems = [...start, '...', ...end];\r\n }\r\n\r\n return (\r\n <nav className={`ui-breadcrumbs ${className}`} aria-label=\"Breadcrumb\">\r\n <ol className=\"ui-breadcrumbs-list\">\r\n {finalItems.map((item, index) => {\r\n const isLast = index === finalItems.length - 1;\r\n\r\n // ellipsis\r\n if (item === '...') {\r\n return (\r\n <li key={`ellipsis-${index}`} className=\"ui-breadcrumb-ellipsis\">\r\n …\r\n </li>\r\n );\r\n }\r\n\r\n const { label, href, onClick } = item;\r\n\r\n return (\r\n <li key={`crumb-${index}`} className=\"ui-breadcrumb-item\">\r\n {href \|\| onClick ? (\r\n <a\r\n href={href}\r\n onClick={onClick}\r\n className=\"ui-breadcrumb-link\"\r\n aria-current={isLast ? 'page' : undefined}\r\n >\r\n {label}\r\n </a>\r\n ) : (\r\n <span\r\n className={`ui-breadcrumb-link ${isLast ? 'active' : ''}`}\r\n aria-current={isLast ? 'page' : undefined}\r\n >\r\n {label}\r\n </span>\r\n )}\r\n\r\n {!isLast && (\r\n <span className=\"ui-breadcrumb-separator\">{separator}</span>\r\n )}\r\n </li>\r\n );\r\n })}\r\n </ol>\r\n </nav>\r\n );\r\n}\r\n"],"names":["Breadcrumbs","items","maxItems","separator","className","finalItems","start","end","jsx","item","index","isLast","label","href","onClick","jsxs"],"mappings":"sJA6BO,SAASA,EAAY,CAC1B,MAAAC,EACA,SAAAC,EAAW,EACX,UAAAC,EAAY,IACZ,UAAAC,EAAY,EACd,EAAqB,CACnB,GAAI,CAACH,EAAM,OAAQ,OAAO,KAE1B,IAAII,EAAgC,CAAC,GAAGJ,CAAK,EAK7C,GAAIA,EAAM,OAASC,EAAU,CAC3B,MAAMI,EAAQL,EAAM,MAAM,EAAG,CAAC,EACxBM,EAAMN,EAAM,MAAM,EAAE,EAC1BI,EAAa,CAAC,GAAGC,EAAO,MAAO,GAAGC,CAAG,CACvC,CAEA,aACG,MAAA,CAAI,UAAW,kBAAkBH,CAAS,GAAI,aAAW,aACxD,SAAAI,EAAAA,IAAC,KAAA,CAAG,UAAU,sBACX,SAAAH,EAAW,IAAI,CAACI,EAAMC,IAAU,CAC/B,MAAMC,EAASD,IAAUL,EAAW,OAAS,EAG7C,GAAII,IAAS,MACX,aACG,KAAA,CAA6B,UAAU,yBAAyB,SAAA,KAAxD,YAAYC,CAAK,EAE1B,EAIJ,KAAM,CAAE,MAAAE,EAAO,KAAAC,EAAM,QAAAC,CAAA,EAAYL,EAEjC,OACEM,EAAAA,KAAC,KAAA,CAA0B,UAAU,qBAClC,SAAA,CAAAF,GAAQC,EACPN,EAAAA,IAAC,IAAA,CACC,KAAAK,EACA,QAAAC,EACA,UAAU,qBACV,eAAcH,EAAS,OAAS,OAE/B,SAAAC,CAAA,CAAA,EAGHJ,EAAAA,IAAC,OAAA,CACC,UAAW,sBAAsBG,EAAS,SAAW,EAAE,GACvD,eAAcA,EAAS,OAAS,OAE/B,SAAAC,CAAA,CAAA,EAIJ,CAACD,GACAH,EAAAA,IAAC,OAAA,CAAK,UAAU,0BAA2B,SAAAL,CAAA,CAAU,CAAA,CAAA,EApBhD,SAASO,CAAK,EAsBvB,CAEJ,CAAC,EACH,EACF,CAEJ"}
1	+ {"version":3,"file":"Breadcrumbs.cjs","sources":["../../../src/components/breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["/*\r\n Breadcrumbs.tsx — FINAL VERSION\r\n * --------------------------------\r\n * 100% matching your UI component architecture.\r\n \r\n Features:\r\n * - WAI-ARIA navigation\r\n * - Auto-collapse when too many items (optional)\r\n * - Custom separator support\r\n * - Keyboard accessible\r\n * - Ellipsis is non-interactive\r\n /\r\n\r\nimport React from 'react';\r\nimport './Breadcrumbs.css';\r\n\r\nexport interface Crumb {\r\n label: React.ReactNode;\r\n href?: string;\r\n onClick?: () => void;\r\n}\r\n\r\nexport interface BreadcrumbsProps {\r\n items: Crumb[];\r\n maxItems?: number; // collapse long breadcrumbs\r\n separator?: React.ReactNode;\r\n className?: string;\r\n}\r\n\r\nexport function Breadcrumbs({\r\n items,\r\n maxItems = 6, // default collapse threshold\r\n separator = '›',\r\n className = '',\r\n}: BreadcrumbsProps) {\r\n if (!items.length) return null;\r\n\r\n let finalItems: (Crumb \| '...')[] = [...items];\r\n\r\n / -------------------------------------------------------\r\n * Collapse logic\r\n * ------------------------------------------------------*/\r\n if (items.length > maxItems) {\r\n const start = items.slice(0, 2);\r\n const end = items.slice(-2);\r\n finalItems = [...start, '...', ...end];\r\n }\r\n\r\n return (\r\n <nav className={`ui-breadcrumbs ${className}`} aria-label=\"Breadcrumb\">\r\n <ol className=\"ui-breadcrumbs-list\">\r\n {finalItems.map((item, index) => {\r\n const isLast = index === finalItems.length - 1;\r\n\r\n // ellipsis\r\n if (item === '...') {\r\n return (\r\n <li key={`ellipsis-${index}`} className=\"ui-breadcrumb-ellipsis\">\r\n …\r\n </li>\r\n );\r\n }\r\n\r\n const { label, href, onClick } = item;\r\n\r\n return (\r\n <li key={`crumb-${index}`} className=\"ui-breadcrumb-item\">\r\n {href \|\| onClick ? (\r\n <a\r\n href={href}\r\n onClick={onClick}\r\n className=\"ui-breadcrumb-link\"\r\n aria-current={isLast ? 'page' : undefined}\r\n >\r\n {label}\r\n </a>\r\n ) : (\r\n <span\r\n className={`ui-breadcrumb-link ${isLast ? 'active' : ''}`}\r\n aria-current={isLast ? 'page' : undefined}\r\n >\r\n {label}\r\n </span>\r\n )}\r\n\r\n {!isLast && (\r\n <span className=\"ui-breadcrumb-separator\">{separator}</span>\r\n )}\r\n </li>\r\n );\r\n })}\r\n </ol>\r\n </nav>\r\n );\r\n}\r\n"],"names":["Breadcrumbs","items","maxItems","separator","className","finalItems","start","end","jsx","item","index","isLast","label","href","onClick","jsxs"],"mappings":"sJA6BO,SAASA,EAAY,CAC1B,MAAAC,EACA,SAAAC,EAAW,EACX,UAAAC,EAAY,IACZ,UAAAC,EAAY,EACd,EAAqB,CACnB,GAAI,CAACH,EAAM,OAAQ,OAAO,KAE1B,IAAII,EAAgC,CAAC,GAAGJ,CAAK,EAK7C,GAAIA,EAAM,OAASC,EAAU,CAC3B,MAAMI,EAAQL,EAAM,MAAM,EAAG,CAAC,EACxBM,EAAMN,EAAM,MAAM,EAAE,EAC1BI,EAAa,CAAC,GAAGC,EAAO,MAAO,GAAGC,CAAG,CACvC,CAEA,aACG,MAAA,CAAI,UAAW,kBAAkBH,CAAS,GAAI,aAAW,aACxD,SAAAI,EAAAA,IAAC,KAAA,CAAG,UAAU,sBACX,SAAAH,EAAW,IAAI,CAACI,EAAMC,IAAU,CAC/B,MAAMC,EAASD,IAAUL,EAAW,OAAS,EAG7C,GAAII,IAAS,MACX,aACG,KAAA,CAA6B,UAAU,yBAAyB,SAAA,KAAxD,YAAYC,CAAK,EAE1B,EAIJ,KAAM,CAAE,MAAAE,EAAO,KAAAC,EAAM,QAAAC,CAAA,EAAYL,EAEjC,OACEM,EAAAA,KAAC,KAAA,CAA0B,UAAU,qBAClC,SAAA,CAAAF,GAAQC,EACPN,EAAAA,IAAC,IAAA,CACC,KAAAK,EACA,QAAAC,EACA,UAAU,qBACV,eAAcH,EAAS,OAAS,OAE/B,SAAAC,CAAA,CAAA,EAGHJ,EAAAA,IAAC,OAAA,CACC,UAAW,sBAAsBG,EAAS,SAAW,EAAE,GACvD,eAAcA,EAAS,OAAS,OAE/B,SAAAC,CAAA,CAAA,EAIJ,CAACD,GACAH,EAAAA,IAAC,OAAA,CAAK,UAAU,0BAA2B,SAAAL,CAAA,CAAU,CAAA,CAAA,EApBhD,SAASO,CAAK,EAsBvB,CAEJ,CAAC,EACH,EACF,CAEJ"}

package/dist/components/breadcrumbs/Breadcrumbs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Breadcrumbs.js","sources":["~~../../../../~~src/components/breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["/*\r\n Breadcrumbs.tsx — FINAL VERSION\r\n * --------------------------------\r\n * 100% matching your UI component architecture.\r\n \r\n Features:\r\n * - WAI-ARIA navigation\r\n * - Auto-collapse when too many items (optional)\r\n * - Custom separator support\r\n * - Keyboard accessible\r\n * - Ellipsis is non-interactive\r\n /\r\n\r\nimport React from 'react';\r\nimport './Breadcrumbs.css';\r\n\r\nexport interface Crumb {\r\n label: React.ReactNode;\r\n href?: string;\r\n onClick?: () => void;\r\n}\r\n\r\nexport interface BreadcrumbsProps {\r\n items: Crumb[];\r\n maxItems?: number; // collapse long breadcrumbs\r\n separator?: React.ReactNode;\r\n className?: string;\r\n}\r\n\r\nexport function Breadcrumbs({\r\n items,\r\n maxItems = 6, // default collapse threshold\r\n separator = '›',\r\n className = '',\r\n}: BreadcrumbsProps) {\r\n if (!items.length) return null;\r\n\r\n let finalItems: (Crumb \| '...')[] = [...items];\r\n\r\n / -------------------------------------------------------\r\n * Collapse logic\r\n * ------------------------------------------------------*/\r\n if (items.length > maxItems) {\r\n const start = items.slice(0, 2);\r\n const end = items.slice(-2);\r\n finalItems = [...start, '...', ...end];\r\n }\r\n\r\n return (\r\n <nav className={`ui-breadcrumbs ${className}`} aria-label=\"Breadcrumb\">\r\n <ol className=\"ui-breadcrumbs-list\">\r\n {finalItems.map((item, index) => {\r\n const isLast = index === finalItems.length - 1;\r\n\r\n // ellipsis\r\n if (item === '...') {\r\n return (\r\n <li key={`ellipsis-${index}`} className=\"ui-breadcrumb-ellipsis\">\r\n …\r\n </li>\r\n );\r\n }\r\n\r\n const { label, href, onClick } = item;\r\n\r\n return (\r\n <li key={`crumb-${index}`} className=\"ui-breadcrumb-item\">\r\n {href \|\| onClick ? (\r\n <a\r\n href={href}\r\n onClick={onClick}\r\n className=\"ui-breadcrumb-link\"\r\n aria-current={isLast ? 'page' : undefined}\r\n >\r\n {label}\r\n </a>\r\n ) : (\r\n <span\r\n className={`ui-breadcrumb-link ${isLast ? 'active' : ''}`}\r\n aria-current={isLast ? 'page' : undefined}\r\n >\r\n {label}\r\n </span>\r\n )}\r\n\r\n {!isLast && (\r\n <span className=\"ui-breadcrumb-separator\">{separator}</span>\r\n )}\r\n </li>\r\n );\r\n })}\r\n </ol>\r\n </nav>\r\n );\r\n}\r\n"],"names":["Breadcrumbs","items","maxItems","separator","className","finalItems","start","end","jsx","item","index","isLast","label","href","onClick","jsxs"],"mappings":";;AA6BO,SAASA,EAAY;AAAA,EAC1B,OAAAC;AAAA,EACA,UAAAC,IAAW;AAAA;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,WAAAC,IAAY;AACd,GAAqB;AACnB,MAAI,CAACH,EAAM,OAAQ,QAAO;AAE1B,MAAII,IAAgC,CAAC,GAAGJ,CAAK;AAK7C,MAAIA,EAAM,SAASC,GAAU;AAC3B,UAAMI,IAAQL,EAAM,MAAM,GAAG,CAAC,GACxBM,IAAMN,EAAM,MAAM,EAAE;AAC1B,IAAAI,IAAa,CAAC,GAAGC,GAAO,OAAO,GAAGC,CAAG;AAAA,EACvC;AAEA,2BACG,OAAA,EAAI,WAAW,kBAAkBH,CAAS,IAAI,cAAW,cACxD,UAAA,gBAAAI,EAAC,MAAA,EAAG,WAAU,uBACX,UAAAH,EAAW,IAAI,CAACI,GAAMC,MAAU;AAC/B,UAAMC,IAASD,MAAUL,EAAW,SAAS;AAG7C,QAAII,MAAS;AACX,+BACG,MAAA,EAA6B,WAAU,0BAAyB,UAAA,OAAxD,YAAYC,CAAK,EAE1B;AAIJ,UAAM,EAAE,OAAAE,GAAO,MAAAC,GAAM,SAAAC,EAAA,IAAYL;AAEjC,WACE,gBAAAM,EAAC,MAAA,EAA0B,WAAU,sBAClC,UAAA;AAAA,MAAAF,KAAQC,IACP,gBAAAN;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAAK;AAAA,UACA,SAAAC;AAAA,UACA,WAAU;AAAA,UACV,gBAAcH,IAAS,SAAS;AAAA,UAE/B,UAAAC;AAAA,QAAA;AAAA,MAAA,IAGH,gBAAAJ;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,sBAAsBG,IAAS,WAAW,EAAE;AAAA,UACvD,gBAAcA,IAAS,SAAS;AAAA,UAE/B,UAAAC;AAAA,QAAA;AAAA,MAAA;AAAA,MAIJ,CAACD,KACA,gBAAAH,EAAC,QAAA,EAAK,WAAU,2BAA2B,UAAAL,EAAA,CAAU;AAAA,IAAA,EAAA,GApBhD,SAASO,CAAK,EAsBvB;AAAA,EAEJ,CAAC,GACH,GACF;AAEJ;"}
1	+ {"version":3,"file":"Breadcrumbs.js","sources":["../../../src/components/breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["/*\r\n Breadcrumbs.tsx — FINAL VERSION\r\n * --------------------------------\r\n * 100% matching your UI component architecture.\r\n \r\n Features:\r\n * - WAI-ARIA navigation\r\n * - Auto-collapse when too many items (optional)\r\n * - Custom separator support\r\n * - Keyboard accessible\r\n * - Ellipsis is non-interactive\r\n /\r\n\r\nimport React from 'react';\r\nimport './Breadcrumbs.css';\r\n\r\nexport interface Crumb {\r\n label: React.ReactNode;\r\n href?: string;\r\n onClick?: () => void;\r\n}\r\n\r\nexport interface BreadcrumbsProps {\r\n items: Crumb[];\r\n maxItems?: number; // collapse long breadcrumbs\r\n separator?: React.ReactNode;\r\n className?: string;\r\n}\r\n\r\nexport function Breadcrumbs({\r\n items,\r\n maxItems = 6, // default collapse threshold\r\n separator = '›',\r\n className = '',\r\n}: BreadcrumbsProps) {\r\n if (!items.length) return null;\r\n\r\n let finalItems: (Crumb \| '...')[] = [...items];\r\n\r\n / -------------------------------------------------------\r\n * Collapse logic\r\n * ------------------------------------------------------*/\r\n if (items.length > maxItems) {\r\n const start = items.slice(0, 2);\r\n const end = items.slice(-2);\r\n finalItems = [...start, '...', ...end];\r\n }\r\n\r\n return (\r\n <nav className={`ui-breadcrumbs ${className}`} aria-label=\"Breadcrumb\">\r\n <ol className=\"ui-breadcrumbs-list\">\r\n {finalItems.map((item, index) => {\r\n const isLast = index === finalItems.length - 1;\r\n\r\n // ellipsis\r\n if (item === '...') {\r\n return (\r\n <li key={`ellipsis-${index}`} className=\"ui-breadcrumb-ellipsis\">\r\n …\r\n </li>\r\n );\r\n }\r\n\r\n const { label, href, onClick } = item;\r\n\r\n return (\r\n <li key={`crumb-${index}`} className=\"ui-breadcrumb-item\">\r\n {href \|\| onClick ? (\r\n <a\r\n href={href}\r\n onClick={onClick}\r\n className=\"ui-breadcrumb-link\"\r\n aria-current={isLast ? 'page' : undefined}\r\n >\r\n {label}\r\n </a>\r\n ) : (\r\n <span\r\n className={`ui-breadcrumb-link ${isLast ? 'active' : ''}`}\r\n aria-current={isLast ? 'page' : undefined}\r\n >\r\n {label}\r\n </span>\r\n )}\r\n\r\n {!isLast && (\r\n <span className=\"ui-breadcrumb-separator\">{separator}</span>\r\n )}\r\n </li>\r\n );\r\n })}\r\n </ol>\r\n </nav>\r\n );\r\n}\r\n"],"names":["Breadcrumbs","items","maxItems","separator","className","finalItems","start","end","jsx","item","index","isLast","label","href","onClick","jsxs"],"mappings":";;AA6BO,SAASA,EAAY;AAAA,EAC1B,OAAAC;AAAA,EACA,UAAAC,IAAW;AAAA;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,WAAAC,IAAY;AACd,GAAqB;AACnB,MAAI,CAACH,EAAM,OAAQ,QAAO;AAE1B,MAAII,IAAgC,CAAC,GAAGJ,CAAK;AAK7C,MAAIA,EAAM,SAASC,GAAU;AAC3B,UAAMI,IAAQL,EAAM,MAAM,GAAG,CAAC,GACxBM,IAAMN,EAAM,MAAM,EAAE;AAC1B,IAAAI,IAAa,CAAC,GAAGC,GAAO,OAAO,GAAGC,CAAG;AAAA,EACvC;AAEA,2BACG,OAAA,EAAI,WAAW,kBAAkBH,CAAS,IAAI,cAAW,cACxD,UAAA,gBAAAI,EAAC,MAAA,EAAG,WAAU,uBACX,UAAAH,EAAW,IAAI,CAACI,GAAMC,MAAU;AAC/B,UAAMC,IAASD,MAAUL,EAAW,SAAS;AAG7C,QAAII,MAAS;AACX,+BACG,MAAA,EAA6B,WAAU,0BAAyB,UAAA,OAAxD,YAAYC,CAAK,EAE1B;AAIJ,UAAM,EAAE,OAAAE,GAAO,MAAAC,GAAM,SAAAC,EAAA,IAAYL;AAEjC,WACE,gBAAAM,EAAC,MAAA,EAA0B,WAAU,sBAClC,UAAA;AAAA,MAAAF,KAAQC,IACP,gBAAAN;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAAK;AAAA,UACA,SAAAC;AAAA,UACA,WAAU;AAAA,UACV,gBAAcH,IAAS,SAAS;AAAA,UAE/B,UAAAC;AAAA,QAAA;AAAA,MAAA,IAGH,gBAAAJ;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,sBAAsBG,IAAS,WAAW,EAAE;AAAA,UACvD,gBAAcA,IAAS,SAAS;AAAA,UAE/B,UAAAC;AAAA,QAAA;AAAA,MAAA;AAAA,MAIJ,CAACD,KACA,gBAAAH,EAAC,QAAA,EAAK,WAAU,2BAA2B,UAAAL,EAAA,CAAU;AAAA,IAAA,EAAA,GApBhD,SAASO,CAAK,EAsBvB;AAAA,EAEJ,CAAC,GACH,GACF;AAEJ;"}

package/dist/components/button/Button.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.cjs","sources":["~~../../../../~~src/components/button/Button.tsx"],"sourcesContent":["/*\r\n Button Component\r\n * ----------------\r\n * - Fully accessible\r\n * - Supports variants and sizes\r\n * - Theme-driven styling (light/dark/custom)\r\n * - No external dependencies\r\n * - Compatible with tree-shaking\r\n /\r\n\r\nimport React from 'react';\r\nimport './Button.css';\r\n\r\nexport interface ButtonProps\r\n extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n /\r\n Visual appearance of the button.\r\n * \"default\" = subtle background\r\n * \"primary\" = strong emphasis (blue)\r\n /\r\n variant?: 'default' \| 'primary';\r\n\r\n /\r\n Adjusts padding & font-size.\r\n */\r\n size?: 'sm' \| 'md' \| 'lg';\r\n}\r\n\r\nexport function Button({\r\n variant = 'default',\r\n size = 'md',\r\n className = '',\r\n ...props\r\n}: ButtonProps) {\r\n const classes = [\r\n 'ui-btn',\r\n variant === 'primary' && 'ui-btn--primary',\r\n size === 'sm' && 'ui-btn--sm',\r\n size === 'lg' && 'ui-btn--lg',\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(' ');\r\n\r\n return <button className={classes} {...props} />;\r\n}\r\n"],"names":["Button","variant","size","className","props","classes","jsx"],"mappings":"iJA4BO,SAASA,EAAO,CACrB,QAAAC,EAAU,UACV,KAAAC,EAAO,KACP,UAAAC,EAAY,GACZ,GAAGC,CACL,EAAgB,CACd,MAAMC,EAAU,CACd,SACAJ,IAAY,WAAa,kBACzBC,IAAS,MAAQ,aACjBA,IAAS,MAAQ,aACjBC,CAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,OAAOG,EAAAA,IAAC,SAAA,CAAO,UAAWD,EAAU,GAAGD,EAAO,CAChD"}
1	+ {"version":3,"file":"Button.cjs","sources":["../../../src/components/button/Button.tsx"],"sourcesContent":["/*\r\n Button Component\r\n * ----------------\r\n * - Fully accessible\r\n * - Supports variants and sizes\r\n * - Theme-driven styling (light/dark/custom)\r\n * - No external dependencies\r\n * - Compatible with tree-shaking\r\n /\r\n\r\nimport React from 'react';\r\nimport './Button.css';\r\n\r\nexport interface ButtonProps\r\n extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n /\r\n Visual appearance of the button.\r\n * \"default\" = subtle background\r\n * \"primary\" = strong emphasis (blue)\r\n /\r\n variant?: 'default' \| 'primary';\r\n\r\n /\r\n Adjusts padding & font-size.\r\n */\r\n size?: 'sm' \| 'md' \| 'lg';\r\n}\r\n\r\nexport function Button({\r\n variant = 'default',\r\n size = 'md',\r\n className = '',\r\n ...props\r\n}: ButtonProps) {\r\n const classes = [\r\n 'ui-btn',\r\n variant === 'primary' && 'ui-btn--primary',\r\n size === 'sm' && 'ui-btn--sm',\r\n size === 'lg' && 'ui-btn--lg',\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(' ');\r\n\r\n return <button className={classes} {...props} />;\r\n}\r\n"],"names":["Button","variant","size","className","props","classes","jsx"],"mappings":"iJA4BO,SAASA,EAAO,CACrB,QAAAC,EAAU,UACV,KAAAC,EAAO,KACP,UAAAC,EAAY,GACZ,GAAGC,CACL,EAAgB,CACd,MAAMC,EAAU,CACd,SACAJ,IAAY,WAAa,kBACzBC,IAAS,MAAQ,aACjBA,IAAS,MAAQ,aACjBC,CAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,OAAOG,EAAAA,IAAC,SAAA,CAAO,UAAWD,EAAU,GAAGD,EAAO,CAChD"}

package/dist/components/button/Button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.js","sources":["~~../../../../~~src/components/button/Button.tsx"],"sourcesContent":["/*\r\n Button Component\r\n * ----------------\r\n * - Fully accessible\r\n * - Supports variants and sizes\r\n * - Theme-driven styling (light/dark/custom)\r\n * - No external dependencies\r\n * - Compatible with tree-shaking\r\n /\r\n\r\nimport React from 'react';\r\nimport './Button.css';\r\n\r\nexport interface ButtonProps\r\n extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n /\r\n Visual appearance of the button.\r\n * \"default\" = subtle background\r\n * \"primary\" = strong emphasis (blue)\r\n /\r\n variant?: 'default' \| 'primary';\r\n\r\n /\r\n Adjusts padding & font-size.\r\n */\r\n size?: 'sm' \| 'md' \| 'lg';\r\n}\r\n\r\nexport function Button({\r\n variant = 'default',\r\n size = 'md',\r\n className = '',\r\n ...props\r\n}: ButtonProps) {\r\n const classes = [\r\n 'ui-btn',\r\n variant === 'primary' && 'ui-btn--primary',\r\n size === 'sm' && 'ui-btn--sm',\r\n size === 'lg' && 'ui-btn--lg',\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(' ');\r\n\r\n return <button className={classes} {...props} />;\r\n}\r\n"],"names":["Button","variant","size","className","props","classes","jsx"],"mappings":";;AA4BO,SAASA,EAAO;AAAA,EACrB,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AAAA,EACP,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,GAAgB;AACd,QAAMC,IAAU;AAAA,IACd;AAAA,IACAJ,MAAY,aAAa;AAAA,IACzBC,MAAS,QAAQ;AAAA,IACjBA,MAAS,QAAQ;AAAA,IACjBC;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,SAAO,gBAAAG,EAAC,UAAA,EAAO,WAAWD,GAAU,GAAGD,GAAO;AAChD;"}
1	+ {"version":3,"file":"Button.js","sources":["../../../src/components/button/Button.tsx"],"sourcesContent":["/*\r\n Button Component\r\n * ----------------\r\n * - Fully accessible\r\n * - Supports variants and sizes\r\n * - Theme-driven styling (light/dark/custom)\r\n * - No external dependencies\r\n * - Compatible with tree-shaking\r\n /\r\n\r\nimport React from 'react';\r\nimport './Button.css';\r\n\r\nexport interface ButtonProps\r\n extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n /\r\n Visual appearance of the button.\r\n * \"default\" = subtle background\r\n * \"primary\" = strong emphasis (blue)\r\n /\r\n variant?: 'default' \| 'primary';\r\n\r\n /\r\n Adjusts padding & font-size.\r\n */\r\n size?: 'sm' \| 'md' \| 'lg';\r\n}\r\n\r\nexport function Button({\r\n variant = 'default',\r\n size = 'md',\r\n className = '',\r\n ...props\r\n}: ButtonProps) {\r\n const classes = [\r\n 'ui-btn',\r\n variant === 'primary' && 'ui-btn--primary',\r\n size === 'sm' && 'ui-btn--sm',\r\n size === 'lg' && 'ui-btn--lg',\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(' ');\r\n\r\n return <button className={classes} {...props} />;\r\n}\r\n"],"names":["Button","variant","size","className","props","classes","jsx"],"mappings":";;AA4BO,SAASA,EAAO;AAAA,EACrB,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AAAA,EACP,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,GAAgB;AACd,QAAMC,IAAU;AAAA,IACd;AAAA,IACAJ,MAAY,aAAa;AAAA,IACzBC,MAAS,QAAQ;AAAA,IACjBA,MAAS,QAAQ;AAAA,IACjBC;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,SAAO,gBAAAG,EAAC,UAAA,EAAO,WAAWD,GAAU,GAAGD,GAAO;AAChD;"}

package/dist/components/card/Card.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Card.cjs","sources":["~~../../../../~~src/components/card/Card.tsx"],"sourcesContent":["/*\r\n Card.tsx\r\n * ----------\r\n * Theme-aware, flexible Card component.\r\n * Supports header/body/footer & clickable states.\r\n */\r\n\r\nimport React from 'react';\r\nimport './Card.css';\r\n\r\ninterface CardProps {\r\n children: React.ReactNode;\r\n className?: string;\r\n clickable?: boolean;\r\n hover?: boolean;\r\n onClick?: () => void;\r\n}\r\n\r\nfunction CardRoot({\r\n children,\r\n className = '',\r\n clickable = false,\r\n hover = false,\r\n onClick,\r\n}: CardProps) {\r\n return (\r\n <div\r\n className={[\r\n 'ui-card',\r\n clickable ? 'ui-card--clickable' : '',\r\n hover ? 'ui-card--hover' : '',\r\n className,\r\n ].join(' ')}\r\n role={clickable ? 'button' : undefined}\r\n tabIndex={clickable ? 0 : undefined}\r\n onClick={clickable ? onClick : undefined}\r\n onKeyDown={(e) => {\r\n if (!clickable) return;\r\n if (e.key === 'Enter' \|\| e.key === ' ') {\r\n e.preventDefault();\r\n onClick?.();\r\n }\r\n }}\r\n >\r\n {children}\r\n </div>\r\n );\r\n}\r\n\r\nfunction Header({ children }: { children: React.ReactNode }) {\r\n return <div className=\"ui-card-header\">{children}</div>;\r\n}\r\n\r\nfunction Body({ children }: { children: React.ReactNode }) {\r\n return <div className=\"ui-card-body\">{children}</div>;\r\n}\r\n\r\nfunction Footer({ children }: { children: React.ReactNode }) {\r\n return <div className=\"ui-card-footer\">{children}</div>;\r\n}\r\n\r\nfunction Divider() {\r\n return <div className=\"ui-card-divider\" />;\r\n}\r\n\r\nexport const Card = Object.assign(CardRoot, {\r\n Header,\r\n Body,\r\n Footer,\r\n Divider,\r\n});\r\n"],"names":["CardRoot","children","className","clickable","hover","onClick","jsx","e","Header","Body","Footer","Divider","Card"],"mappings":"+IAkBA,SAASA,EAAS,CAChB,SAAAC,EACA,UAAAC,EAAY,GACZ,UAAAC,EAAY,GACZ,MAAAC,EAAQ,GACR,QAAAC,CACF,EAAc,CACZ,OACEC,EAAAA,IAAC,MAAA,CACC,UAAW,CACT,UACAH,EAAY,qBAAuB,GACnCC,EAAQ,iBAAmB,GAC3BF,CAAA,EACA,KAAK,GAAG,EACV,KAAMC,EAAY,SAAW,OAC7B,SAAUA,EAAY,EAAI,OAC1B,QAASA,EAAYE,EAAU,OAC/B,UAAYE,GAAM,CACXJ,IACDI,EAAE,MAAQ,SAAWA,EAAE,MAAQ,OACjCA,EAAE,eAAA,EACFF,IAAA,EAEJ,EAEC,SAAAJ,CAAA,CAAA,CAGP,CAEA,SAASO,EAAO,CAAE,SAAAP,GAA2C,CAC3D,OAAOK,EAAAA,IAAC,MAAA,CAAI,UAAU,iBAAkB,SAAAL,CAAA,CAAS,CACnD,CAEA,SAASQ,EAAK,CAAE,SAAAR,GAA2C,CACzD,OAAOK,EAAAA,IAAC,MAAA,CAAI,UAAU,eAAgB,SAAAL,CAAA,CAAS,CACjD,CAEA,SAASS,EAAO,CAAE,SAAAT,GAA2C,CAC3D,OAAOK,EAAAA,IAAC,MAAA,CAAI,UAAU,iBAAkB,SAAAL,CAAA,CAAS,CACnD,CAEA,SAASU,GAAU,CACjB,OAAOL,EAAAA,IAAC,MAAA,CAAI,UAAU,iBAAA,CAAkB,CAC1C,CAEO,MAAMM,EAAO,OAAO,OAAOZ,EAAU,CAC1C,OAAAQ,EACA,KAAAC,EACA,OAAAC,EACA,QAAAC,CACF,CAAC"}
1	+ {"version":3,"file":"Card.cjs","sources":["../../../src/components/card/Card.tsx"],"sourcesContent":["/*\r\n Card.tsx\r\n * ----------\r\n * Theme-aware, flexible Card component.\r\n * Supports header/body/footer & clickable states.\r\n */\r\n\r\nimport React from 'react';\r\nimport './Card.css';\r\n\r\ninterface CardProps {\r\n children: React.ReactNode;\r\n className?: string;\r\n clickable?: boolean;\r\n hover?: boolean;\r\n onClick?: () => void;\r\n}\r\n\r\nfunction CardRoot({\r\n children,\r\n className = '',\r\n clickable = false,\r\n hover = false,\r\n onClick,\r\n}: CardProps) {\r\n return (\r\n <div\r\n className={[\r\n 'ui-card',\r\n clickable ? 'ui-card--clickable' : '',\r\n hover ? 'ui-card--hover' : '',\r\n className,\r\n ].join(' ')}\r\n role={clickable ? 'button' : undefined}\r\n tabIndex={clickable ? 0 : undefined}\r\n onClick={clickable ? onClick : undefined}\r\n onKeyDown={(e) => {\r\n if (!clickable) return;\r\n if (e.key === 'Enter' \|\| e.key === ' ') {\r\n e.preventDefault();\r\n onClick?.();\r\n }\r\n }}\r\n >\r\n {children}\r\n </div>\r\n );\r\n}\r\n\r\nfunction Header({ children }: { children: React.ReactNode }) {\r\n return <div className=\"ui-card-header\">{children}</div>;\r\n}\r\n\r\nfunction Body({ children }: { children: React.ReactNode }) {\r\n return <div className=\"ui-card-body\">{children}</div>;\r\n}\r\n\r\nfunction Footer({ children }: { children: React.ReactNode }) {\r\n return <div className=\"ui-card-footer\">{children}</div>;\r\n}\r\n\r\nfunction Divider() {\r\n return <div className=\"ui-card-divider\" />;\r\n}\r\n\r\nexport const Card = Object.assign(CardRoot, {\r\n Header,\r\n Body,\r\n Footer,\r\n Divider,\r\n});\r\n"],"names":["CardRoot","children","className","clickable","hover","onClick","jsx","e","Header","Body","Footer","Divider","Card"],"mappings":"+IAkBA,SAASA,EAAS,CAChB,SAAAC,EACA,UAAAC,EAAY,GACZ,UAAAC,EAAY,GACZ,MAAAC,EAAQ,GACR,QAAAC,CACF,EAAc,CACZ,OACEC,EAAAA,IAAC,MAAA,CACC,UAAW,CACT,UACAH,EAAY,qBAAuB,GACnCC,EAAQ,iBAAmB,GAC3BF,CAAA,EACA,KAAK,GAAG,EACV,KAAMC,EAAY,SAAW,OAC7B,SAAUA,EAAY,EAAI,OAC1B,QAASA,EAAYE,EAAU,OAC/B,UAAYE,GAAM,CACXJ,IACDI,EAAE,MAAQ,SAAWA,EAAE,MAAQ,OACjCA,EAAE,eAAA,EACFF,IAAA,EAEJ,EAEC,SAAAJ,CAAA,CAAA,CAGP,CAEA,SAASO,EAAO,CAAE,SAAAP,GAA2C,CAC3D,OAAOK,EAAAA,IAAC,MAAA,CAAI,UAAU,iBAAkB,SAAAL,CAAA,CAAS,CACnD,CAEA,SAASQ,EAAK,CAAE,SAAAR,GAA2C,CACzD,OAAOK,EAAAA,IAAC,MAAA,CAAI,UAAU,eAAgB,SAAAL,CAAA,CAAS,CACjD,CAEA,SAASS,EAAO,CAAE,SAAAT,GAA2C,CAC3D,OAAOK,EAAAA,IAAC,MAAA,CAAI,UAAU,iBAAkB,SAAAL,CAAA,CAAS,CACnD,CAEA,SAASU,GAAU,CACjB,OAAOL,EAAAA,IAAC,MAAA,CAAI,UAAU,iBAAA,CAAkB,CAC1C,CAEO,MAAMM,EAAO,OAAO,OAAOZ,EAAU,CAC1C,OAAAQ,EACA,KAAAC,EACA,OAAAC,EACA,QAAAC,CACF,CAAC"}

package/dist/components/card/Card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Card.js","sources":["~~../../../../~~src/components/card/Card.tsx"],"sourcesContent":["/*\r\n Card.tsx\r\n * ----------\r\n * Theme-aware, flexible Card component.\r\n * Supports header/body/footer & clickable states.\r\n */\r\n\r\nimport React from 'react';\r\nimport './Card.css';\r\n\r\ninterface CardProps {\r\n children: React.ReactNode;\r\n className?: string;\r\n clickable?: boolean;\r\n hover?: boolean;\r\n onClick?: () => void;\r\n}\r\n\r\nfunction CardRoot({\r\n children,\r\n className = '',\r\n clickable = false,\r\n hover = false,\r\n onClick,\r\n}: CardProps) {\r\n return (\r\n <div\r\n className={[\r\n 'ui-card',\r\n clickable ? 'ui-card--clickable' : '',\r\n hover ? 'ui-card--hover' : '',\r\n className,\r\n ].join(' ')}\r\n role={clickable ? 'button' : undefined}\r\n tabIndex={clickable ? 0 : undefined}\r\n onClick={clickable ? onClick : undefined}\r\n onKeyDown={(e) => {\r\n if (!clickable) return;\r\n if (e.key === 'Enter' \|\| e.key === ' ') {\r\n e.preventDefault();\r\n onClick?.();\r\n }\r\n }}\r\n >\r\n {children}\r\n </div>\r\n );\r\n}\r\n\r\nfunction Header({ children }: { children: React.ReactNode }) {\r\n return <div className=\"ui-card-header\">{children}</div>;\r\n}\r\n\r\nfunction Body({ children }: { children: React.ReactNode }) {\r\n return <div className=\"ui-card-body\">{children}</div>;\r\n}\r\n\r\nfunction Footer({ children }: { children: React.ReactNode }) {\r\n return <div className=\"ui-card-footer\">{children}</div>;\r\n}\r\n\r\nfunction Divider() {\r\n return <div className=\"ui-card-divider\" />;\r\n}\r\n\r\nexport const Card = Object.assign(CardRoot, {\r\n Header,\r\n Body,\r\n Footer,\r\n Divider,\r\n});\r\n"],"names":["CardRoot","children","className","clickable","hover","onClick","jsx","e","Header","Body","Footer","Divider","Card"],"mappings":";;AAkBA,SAASA,EAAS;AAAA,EAChB,UAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,WAAAC,IAAY;AAAA,EACZ,OAAAC,IAAQ;AAAA,EACR,SAAAC;AACF,GAAc;AACZ,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACAH,IAAY,uBAAuB;AAAA,QACnCC,IAAQ,mBAAmB;AAAA,QAC3BF;AAAA,MAAA,EACA,KAAK,GAAG;AAAA,MACV,MAAMC,IAAY,WAAW;AAAA,MAC7B,UAAUA,IAAY,IAAI;AAAA,MAC1B,SAASA,IAAYE,IAAU;AAAA,MAC/B,WAAW,CAACE,MAAM;AAChB,QAAKJ,MACDI,EAAE,QAAQ,WAAWA,EAAE,QAAQ,SACjCA,EAAE,eAAA,GACFF,IAAA;AAAA,MAEJ;AAAA,MAEC,UAAAJ;AAAA,IAAA;AAAA,EAAA;AAGP;AAEA,SAASO,EAAO,EAAE,UAAAP,KAA2C;AAC3D,SAAO,gBAAAK,EAAC,OAAA,EAAI,WAAU,kBAAkB,UAAAL,EAAA,CAAS;AACnD;AAEA,SAASQ,EAAK,EAAE,UAAAR,KAA2C;AACzD,SAAO,gBAAAK,EAAC,OAAA,EAAI,WAAU,gBAAgB,UAAAL,EAAA,CAAS;AACjD;AAEA,SAASS,EAAO,EAAE,UAAAT,KAA2C;AAC3D,SAAO,gBAAAK,EAAC,OAAA,EAAI,WAAU,kBAAkB,UAAAL,EAAA,CAAS;AACnD;AAEA,SAASU,IAAU;AACjB,SAAO,gBAAAL,EAAC,OAAA,EAAI,WAAU,kBAAA,CAAkB;AAC1C;AAEO,MAAMM,IAAO,OAAO,OAAOZ,GAAU;AAAA,EAC1C,QAAAQ;AAAA,EACA,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,SAAAC;AACF,CAAC;"}
1	+ {"version":3,"file":"Card.js","sources":["../../../src/components/card/Card.tsx"],"sourcesContent":["/*\r\n Card.tsx\r\n * ----------\r\n * Theme-aware, flexible Card component.\r\n * Supports header/body/footer & clickable states.\r\n */\r\n\r\nimport React from 'react';\r\nimport './Card.css';\r\n\r\ninterface CardProps {\r\n children: React.ReactNode;\r\n className?: string;\r\n clickable?: boolean;\r\n hover?: boolean;\r\n onClick?: () => void;\r\n}\r\n\r\nfunction CardRoot({\r\n children,\r\n className = '',\r\n clickable = false,\r\n hover = false,\r\n onClick,\r\n}: CardProps) {\r\n return (\r\n <div\r\n className={[\r\n 'ui-card',\r\n clickable ? 'ui-card--clickable' : '',\r\n hover ? 'ui-card--hover' : '',\r\n className,\r\n ].join(' ')}\r\n role={clickable ? 'button' : undefined}\r\n tabIndex={clickable ? 0 : undefined}\r\n onClick={clickable ? onClick : undefined}\r\n onKeyDown={(e) => {\r\n if (!clickable) return;\r\n if (e.key === 'Enter' \|\| e.key === ' ') {\r\n e.preventDefault();\r\n onClick?.();\r\n }\r\n }}\r\n >\r\n {children}\r\n </div>\r\n );\r\n}\r\n\r\nfunction Header({ children }: { children: React.ReactNode }) {\r\n return <div className=\"ui-card-header\">{children}</div>;\r\n}\r\n\r\nfunction Body({ children }: { children: React.ReactNode }) {\r\n return <div className=\"ui-card-body\">{children}</div>;\r\n}\r\n\r\nfunction Footer({ children }: { children: React.ReactNode }) {\r\n return <div className=\"ui-card-footer\">{children}</div>;\r\n}\r\n\r\nfunction Divider() {\r\n return <div className=\"ui-card-divider\" />;\r\n}\r\n\r\nexport const Card = Object.assign(CardRoot, {\r\n Header,\r\n Body,\r\n Footer,\r\n Divider,\r\n});\r\n"],"names":["CardRoot","children","className","clickable","hover","onClick","jsx","e","Header","Body","Footer","Divider","Card"],"mappings":";;AAkBA,SAASA,EAAS;AAAA,EAChB,UAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,WAAAC,IAAY;AAAA,EACZ,OAAAC,IAAQ;AAAA,EACR,SAAAC;AACF,GAAc;AACZ,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACAH,IAAY,uBAAuB;AAAA,QACnCC,IAAQ,mBAAmB;AAAA,QAC3BF;AAAA,MAAA,EACA,KAAK,GAAG;AAAA,MACV,MAAMC,IAAY,WAAW;AAAA,MAC7B,UAAUA,IAAY,IAAI;AAAA,MAC1B,SAASA,IAAYE,IAAU;AAAA,MAC/B,WAAW,CAACE,MAAM;AAChB,QAAKJ,MACDI,EAAE,QAAQ,WAAWA,EAAE,QAAQ,SACjCA,EAAE,eAAA,GACFF,IAAA;AAAA,MAEJ;AAAA,MAEC,UAAAJ;AAAA,IAAA;AAAA,EAAA;AAGP;AAEA,SAASO,EAAO,EAAE,UAAAP,KAA2C;AAC3D,SAAO,gBAAAK,EAAC,OAAA,EAAI,WAAU,kBAAkB,UAAAL,EAAA,CAAS;AACnD;AAEA,SAASQ,EAAK,EAAE,UAAAR,KAA2C;AACzD,SAAO,gBAAAK,EAAC,OAAA,EAAI,WAAU,gBAAgB,UAAAL,EAAA,CAAS;AACjD;AAEA,SAASS,EAAO,EAAE,UAAAT,KAA2C;AAC3D,SAAO,gBAAAK,EAAC,OAAA,EAAI,WAAU,kBAAkB,UAAAL,EAAA,CAAS;AACnD;AAEA,SAASU,IAAU;AACjB,SAAO,gBAAAL,EAAC,OAAA,EAAI,WAAU,kBAAA,CAAkB;AAC1C;AAEO,MAAMM,IAAO,OAAO,OAAOZ,GAAU;AAAA,EAC1C,QAAAQ;AAAA,EACA,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,SAAAC;AACF,CAAC;"}

package/dist/components/checkbox/Checkbox.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Checkbox.cjs","sources":["~~../../../../~~src/components/checkbox/Checkbox.tsx"],"sourcesContent":["/*\r\n Checkbox.tsx\r\n * --------------\r\n * Fully accessible checkbox with 3 states:\r\n * - checked\r\n * - unchecked\r\n * - indeterminate (optional)\r\n /\r\n\r\nimport React, { useEffect, useRef } from 'react';\r\nimport './Checkbox.css';\r\n\r\ninterface CheckboxProps {\r\n checked?: boolean; // controlled\r\n defaultChecked?: boolean; // uncontrolled\r\n indeterminate?: boolean; // optional\r\n onChange?: (checked: boolean) => void;\r\n\r\n label?: React.ReactNode;\r\n disabled?: boolean;\r\n name?: string;\r\n value?: string;\r\n className?: string;\r\n}\r\n\r\nexport function Checkbox({\r\n checked,\r\n defaultChecked,\r\n indeterminate = false,\r\n onChange,\r\n label,\r\n disabled = false,\r\n name,\r\n value,\r\n className = '',\r\n}: CheckboxProps) {\r\n const inputRef = useRef<HTMLInputElement \| null>(null);\r\n\r\n const isControlled = checked !== undefined;\r\n const [internal, setInternal] = React.useState(defaultChecked ?? false);\r\n\r\n const currentChecked = isControlled ? checked : internal;\r\n\r\n // Apply indeterminate visual state\r\n useEffect(() => {\r\n if (inputRef.current) {\r\n inputRef.current.indeterminate = indeterminate;\r\n }\r\n }, [indeterminate]);\r\n\r\n const toggle = () => {\r\n if (disabled) return;\r\n const newVal = !currentChecked;\r\n if (!isControlled) setInternal(newVal);\r\n onChange?.(newVal);\r\n };\r\n\r\n return (\r\n <label className={`ui-checkbox-root ${className}`}>\r\n <input\r\n ref={inputRef}\r\n type=\"checkbox\"\r\n className=\"ui-checkbox-input\"\r\n name={name}\r\n value={value}\r\n disabled={disabled}\r\n checked={currentChecked}\r\n onChange={toggle}\r\n data-state={\r\n indeterminate\r\n ? 'indeterminate'\r\n : currentChecked\r\n ? 'checked'\r\n : 'unchecked'\r\n }\r\n />\r\n\r\n {/ Visual checkmark */}\r\n <span className=\"ui-checkbox-check\" aria-hidden=\"true\">\r\n {indeterminate ? '–' : currentChecked ? '✓' : ''}\r\n </span>\r\n\r\n {label && <span className=\"ui-checkbox-label\">{label}</span>}\r\n </label>\r\n );\r\n}\r\n"],"names":["Checkbox","checked","defaultChecked","indeterminate","onChange","label","disabled","name","value","className","inputRef","useRef","isControlled","internal","setInternal","React","currentChecked","useEffect","toggle","newVal","jsxs","jsx"],"mappings":"sKAyBO,SAASA,EAAS,CACvB,QAAAC,EACA,eAAAC,EACA,cAAAC,EAAgB,GAChB,SAAAC,EACA,MAAAC,EACA,SAAAC,EAAW,GACX,KAAAC,EACA,MAAAC,EACA,UAAAC,EAAY,EACd,EAAkB,CAChB,MAAMC,EAAWC,EAAAA,OAAgC,IAAI,EAE/CC,EAAeX,IAAY,OAC3B,CAACY,EAAUC,CAAW,EAAIC,EAAM,SAASb,GAAkB,EAAK,EAEhEc,EAAiBJ,EAAeX,EAAUY,EAGhDI,EAAAA,UAAU,IAAM,CACVP,EAAS,UACXA,EAAS,QAAQ,cAAgBP,EAErC,EAAG,CAACA,CAAa,CAAC,EAElB,MAAMe,EAAS,IAAM,CACnB,GAAIZ,EAAU,OACd,MAAMa,EAAS,CAACH,EACXJ,GAAcE,EAAYK,CAAM,EACrCf,IAAWe,CAAM,CACnB,EAEA,OACEC,EAAAA,KAAC,QAAA,CAAM,UAAW,oBAAoBX,CAAS,GAC7C,SAAA,CAAAY,EAAAA,IAAC,QAAA,CACC,IAAKX,EACL,KAAK,WACL,UAAU,oBACV,KAAAH,EACA,MAAAC,EACA,SAAAF,EACA,QAASU,EACT,SAAUE,EACV,aACEf,EACI,gBACAa,EACA,UACA,WAAA,CAAA,EAKRK,EAAAA,IAAC,OAAA,CAAK,UAAU,oBAAoB,cAAY,OAC7C,SAAAlB,EAAgB,IAAMa,EAAiB,IAAM,EAAA,CAChD,EAECX,GAASgB,EAAAA,IAAC,OAAA,CAAK,UAAU,oBAAqB,SAAAhB,CAAA,CAAM,CAAA,EACvD,CAEJ"}
1	+ {"version":3,"file":"Checkbox.cjs","sources":["../../../src/components/checkbox/Checkbox.tsx"],"sourcesContent":["/*\r\n Checkbox.tsx\r\n * --------------\r\n * Fully accessible checkbox with 3 states:\r\n * - checked\r\n * - unchecked\r\n * - indeterminate (optional)\r\n /\r\n\r\nimport React, { useEffect, useRef } from 'react';\r\nimport './Checkbox.css';\r\n\r\ninterface CheckboxProps {\r\n checked?: boolean; // controlled\r\n defaultChecked?: boolean; // uncontrolled\r\n indeterminate?: boolean; // optional\r\n onChange?: (checked: boolean) => void;\r\n\r\n label?: React.ReactNode;\r\n disabled?: boolean;\r\n name?: string;\r\n value?: string;\r\n className?: string;\r\n}\r\n\r\nexport function Checkbox({\r\n checked,\r\n defaultChecked,\r\n indeterminate = false,\r\n onChange,\r\n label,\r\n disabled = false,\r\n name,\r\n value,\r\n className = '',\r\n}: CheckboxProps) {\r\n const inputRef = useRef<HTMLInputElement \| null>(null);\r\n\r\n const isControlled = checked !== undefined;\r\n const [internal, setInternal] = React.useState(defaultChecked ?? false);\r\n\r\n const currentChecked = isControlled ? checked : internal;\r\n\r\n // Apply indeterminate visual state\r\n useEffect(() => {\r\n if (inputRef.current) {\r\n inputRef.current.indeterminate = indeterminate;\r\n }\r\n }, [indeterminate]);\r\n\r\n const toggle = () => {\r\n if (disabled) return;\r\n const newVal = !currentChecked;\r\n if (!isControlled) setInternal(newVal);\r\n onChange?.(newVal);\r\n };\r\n\r\n return (\r\n <label className={`ui-checkbox-root ${className}`}>\r\n <input\r\n ref={inputRef}\r\n type=\"checkbox\"\r\n className=\"ui-checkbox-input\"\r\n name={name}\r\n value={value}\r\n disabled={disabled}\r\n checked={currentChecked}\r\n onChange={toggle}\r\n data-state={\r\n indeterminate\r\n ? 'indeterminate'\r\n : currentChecked\r\n ? 'checked'\r\n : 'unchecked'\r\n }\r\n />\r\n\r\n {/ Visual checkmark */}\r\n <span className=\"ui-checkbox-check\" aria-hidden=\"true\">\r\n {indeterminate ? '–' : currentChecked ? '✓' : ''}\r\n </span>\r\n\r\n {label && <span className=\"ui-checkbox-label\">{label}</span>}\r\n </label>\r\n );\r\n}\r\n"],"names":["Checkbox","checked","defaultChecked","indeterminate","onChange","label","disabled","name","value","className","inputRef","useRef","isControlled","internal","setInternal","React","currentChecked","useEffect","toggle","newVal","jsxs","jsx"],"mappings":"sKAyBO,SAASA,EAAS,CACvB,QAAAC,EACA,eAAAC,EACA,cAAAC,EAAgB,GAChB,SAAAC,EACA,MAAAC,EACA,SAAAC,EAAW,GACX,KAAAC,EACA,MAAAC,EACA,UAAAC,EAAY,EACd,EAAkB,CAChB,MAAMC,EAAWC,EAAAA,OAAgC,IAAI,EAE/CC,EAAeX,IAAY,OAC3B,CAACY,EAAUC,CAAW,EAAIC,EAAM,SAASb,GAAkB,EAAK,EAEhEc,EAAiBJ,EAAeX,EAAUY,EAGhDI,EAAAA,UAAU,IAAM,CACVP,EAAS,UACXA,EAAS,QAAQ,cAAgBP,EAErC,EAAG,CAACA,CAAa,CAAC,EAElB,MAAMe,EAAS,IAAM,CACnB,GAAIZ,EAAU,OACd,MAAMa,EAAS,CAACH,EACXJ,GAAcE,EAAYK,CAAM,EACrCf,IAAWe,CAAM,CACnB,EAEA,OACEC,EAAAA,KAAC,QAAA,CAAM,UAAW,oBAAoBX,CAAS,GAC7C,SAAA,CAAAY,EAAAA,IAAC,QAAA,CACC,IAAKX,EACL,KAAK,WACL,UAAU,oBACV,KAAAH,EACA,MAAAC,EACA,SAAAF,EACA,QAASU,EACT,SAAUE,EACV,aACEf,EACI,gBACAa,EACA,UACA,WAAA,CAAA,EAKRK,EAAAA,IAAC,OAAA,CAAK,UAAU,oBAAoB,cAAY,OAC7C,SAAAlB,EAAgB,IAAMa,EAAiB,IAAM,EAAA,CAChD,EAECX,GAASgB,EAAAA,IAAC,OAAA,CAAK,UAAU,oBAAqB,SAAAhB,CAAA,CAAM,CAAA,EACvD,CAEJ"}

package/dist/components/checkbox/Checkbox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Checkbox.js","sources":["~~../../../../~~src/components/checkbox/Checkbox.tsx"],"sourcesContent":["/*\r\n Checkbox.tsx\r\n * --------------\r\n * Fully accessible checkbox with 3 states:\r\n * - checked\r\n * - unchecked\r\n * - indeterminate (optional)\r\n /\r\n\r\nimport React, { useEffect, useRef } from 'react';\r\nimport './Checkbox.css';\r\n\r\ninterface CheckboxProps {\r\n checked?: boolean; // controlled\r\n defaultChecked?: boolean; // uncontrolled\r\n indeterminate?: boolean; // optional\r\n onChange?: (checked: boolean) => void;\r\n\r\n label?: React.ReactNode;\r\n disabled?: boolean;\r\n name?: string;\r\n value?: string;\r\n className?: string;\r\n}\r\n\r\nexport function Checkbox({\r\n checked,\r\n defaultChecked,\r\n indeterminate = false,\r\n onChange,\r\n label,\r\n disabled = false,\r\n name,\r\n value,\r\n className = '',\r\n}: CheckboxProps) {\r\n const inputRef = useRef<HTMLInputElement \| null>(null);\r\n\r\n const isControlled = checked !== undefined;\r\n const [internal, setInternal] = React.useState(defaultChecked ?? false);\r\n\r\n const currentChecked = isControlled ? checked : internal;\r\n\r\n // Apply indeterminate visual state\r\n useEffect(() => {\r\n if (inputRef.current) {\r\n inputRef.current.indeterminate = indeterminate;\r\n }\r\n }, [indeterminate]);\r\n\r\n const toggle = () => {\r\n if (disabled) return;\r\n const newVal = !currentChecked;\r\n if (!isControlled) setInternal(newVal);\r\n onChange?.(newVal);\r\n };\r\n\r\n return (\r\n <label className={`ui-checkbox-root ${className}`}>\r\n <input\r\n ref={inputRef}\r\n type=\"checkbox\"\r\n className=\"ui-checkbox-input\"\r\n name={name}\r\n value={value}\r\n disabled={disabled}\r\n checked={currentChecked}\r\n onChange={toggle}\r\n data-state={\r\n indeterminate\r\n ? 'indeterminate'\r\n : currentChecked\r\n ? 'checked'\r\n : 'unchecked'\r\n }\r\n />\r\n\r\n {/ Visual checkmark */}\r\n <span className=\"ui-checkbox-check\" aria-hidden=\"true\">\r\n {indeterminate ? '–' : currentChecked ? '✓' : ''}\r\n </span>\r\n\r\n {label && <span className=\"ui-checkbox-label\">{label}</span>}\r\n </label>\r\n );\r\n}\r\n"],"names":["Checkbox","checked","defaultChecked","indeterminate","onChange","label","disabled","name","value","className","inputRef","useRef","isControlled","internal","setInternal","React","currentChecked","useEffect","toggle","newVal","jsxs","jsx"],"mappings":";;;AAyBO,SAASA,EAAS;AAAA,EACvB,SAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAAkB;AAChB,QAAMC,IAAWC,EAAgC,IAAI,GAE/CC,IAAeX,MAAY,QAC3B,CAACY,GAAUC,CAAW,IAAIC,EAAM,SAASb,KAAkB,EAAK,GAEhEc,IAAiBJ,IAAeX,IAAUY;AAGhD,EAAAI,EAAU,MAAM;AACd,IAAIP,EAAS,YACXA,EAAS,QAAQ,gBAAgBP;AAAA,EAErC,GAAG,CAACA,CAAa,CAAC;AAElB,QAAMe,IAAS,MAAM;AACnB,QAAIZ,EAAU;AACd,UAAMa,IAAS,CAACH;AAChB,IAAKJ,KAAcE,EAAYK,CAAM,GACrCf,IAAWe,CAAM;AAAA,EACnB;AAEA,SACE,gBAAAC,EAAC,SAAA,EAAM,WAAW,oBAAoBX,CAAS,IAC7C,UAAA;AAAA,IAAA,gBAAAY;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAKX;AAAA,QACL,MAAK;AAAA,QACL,WAAU;AAAA,QACV,MAAAH;AAAA,QACA,OAAAC;AAAA,QACA,UAAAF;AAAA,QACA,SAASU;AAAA,QACT,UAAUE;AAAA,QACV,cACEf,IACI,kBACAa,IACA,YACA;AAAA,MAAA;AAAA,IAAA;AAAA,IAKR,gBAAAK,EAAC,QAAA,EAAK,WAAU,qBAAoB,eAAY,QAC7C,UAAAlB,IAAgB,MAAMa,IAAiB,MAAM,GAAA,CAChD;AAAA,IAECX,KAAS,gBAAAgB,EAAC,QAAA,EAAK,WAAU,qBAAqB,UAAAhB,EAAA,CAAM;AAAA,EAAA,GACvD;AAEJ;"}
1	+ {"version":3,"file":"Checkbox.js","sources":["../../../src/components/checkbox/Checkbox.tsx"],"sourcesContent":["/*\r\n Checkbox.tsx\r\n * --------------\r\n * Fully accessible checkbox with 3 states:\r\n * - checked\r\n * - unchecked\r\n * - indeterminate (optional)\r\n /\r\n\r\nimport React, { useEffect, useRef } from 'react';\r\nimport './Checkbox.css';\r\n\r\ninterface CheckboxProps {\r\n checked?: boolean; // controlled\r\n defaultChecked?: boolean; // uncontrolled\r\n indeterminate?: boolean; // optional\r\n onChange?: (checked: boolean) => void;\r\n\r\n label?: React.ReactNode;\r\n disabled?: boolean;\r\n name?: string;\r\n value?: string;\r\n className?: string;\r\n}\r\n\r\nexport function Checkbox({\r\n checked,\r\n defaultChecked,\r\n indeterminate = false,\r\n onChange,\r\n label,\r\n disabled = false,\r\n name,\r\n value,\r\n className = '',\r\n}: CheckboxProps) {\r\n const inputRef = useRef<HTMLInputElement \| null>(null);\r\n\r\n const isControlled = checked !== undefined;\r\n const [internal, setInternal] = React.useState(defaultChecked ?? false);\r\n\r\n const currentChecked = isControlled ? checked : internal;\r\n\r\n // Apply indeterminate visual state\r\n useEffect(() => {\r\n if (inputRef.current) {\r\n inputRef.current.indeterminate = indeterminate;\r\n }\r\n }, [indeterminate]);\r\n\r\n const toggle = () => {\r\n if (disabled) return;\r\n const newVal = !currentChecked;\r\n if (!isControlled) setInternal(newVal);\r\n onChange?.(newVal);\r\n };\r\n\r\n return (\r\n <label className={`ui-checkbox-root ${className}`}>\r\n <input\r\n ref={inputRef}\r\n type=\"checkbox\"\r\n className=\"ui-checkbox-input\"\r\n name={name}\r\n value={value}\r\n disabled={disabled}\r\n checked={currentChecked}\r\n onChange={toggle}\r\n data-state={\r\n indeterminate\r\n ? 'indeterminate'\r\n : currentChecked\r\n ? 'checked'\r\n : 'unchecked'\r\n }\r\n />\r\n\r\n {/ Visual checkmark */}\r\n <span className=\"ui-checkbox-check\" aria-hidden=\"true\">\r\n {indeterminate ? '–' : currentChecked ? '✓' : ''}\r\n </span>\r\n\r\n {label && <span className=\"ui-checkbox-label\">{label}</span>}\r\n </label>\r\n );\r\n}\r\n"],"names":["Checkbox","checked","defaultChecked","indeterminate","onChange","label","disabled","name","value","className","inputRef","useRef","isControlled","internal","setInternal","React","currentChecked","useEffect","toggle","newVal","jsxs","jsx"],"mappings":";;;AAyBO,SAASA,EAAS;AAAA,EACvB,SAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAAkB;AAChB,QAAMC,IAAWC,EAAgC,IAAI,GAE/CC,IAAeX,MAAY,QAC3B,CAACY,GAAUC,CAAW,IAAIC,EAAM,SAASb,KAAkB,EAAK,GAEhEc,IAAiBJ,IAAeX,IAAUY;AAGhD,EAAAI,EAAU,MAAM;AACd,IAAIP,EAAS,YACXA,EAAS,QAAQ,gBAAgBP;AAAA,EAErC,GAAG,CAACA,CAAa,CAAC;AAElB,QAAMe,IAAS,MAAM;AACnB,QAAIZ,EAAU;AACd,UAAMa,IAAS,CAACH;AAChB,IAAKJ,KAAcE,EAAYK,CAAM,GACrCf,IAAWe,CAAM;AAAA,EACnB;AAEA,SACE,gBAAAC,EAAC,SAAA,EAAM,WAAW,oBAAoBX,CAAS,IAC7C,UAAA;AAAA,IAAA,gBAAAY;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAKX;AAAA,QACL,MAAK;AAAA,QACL,WAAU;AAAA,QACV,MAAAH;AAAA,QACA,OAAAC;AAAA,QACA,UAAAF;AAAA,QACA,SAASU;AAAA,QACT,UAAUE;AAAA,QACV,cACEf,IACI,kBACAa,IACA,YACA;AAAA,MAAA;AAAA,IAAA;AAAA,IAKR,gBAAAK,EAAC,QAAA,EAAK,WAAU,qBAAoB,eAAY,QAC7C,UAAAlB,IAAgB,MAAMa,IAAiB,MAAM,GAAA,CAChD;AAAA,IAECX,KAAS,gBAAAgB,EAAC,QAAA,EAAK,WAAU,qBAAqB,UAAAhB,EAAA,CAAM;AAAA,EAAA,GACvD;AAEJ;"}

package/dist/components/chip/Chip.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Chip.cjs","sources":["~~../../../../~~src/components/chip/Chip.tsx"],"sourcesContent":["/*\r\n Chip.tsx — FINAL VERSION\r\n * -------------------------\r\n * Features:\r\n * - Removable (optional)\r\n * - Selectable (optional)\r\n * - Sizes: sm, md\r\n * - Icons (left/right)\r\n * - Theme-aware\r\n /\r\n\r\nimport React from 'react';\r\nimport './Chip.css';\r\n\r\nexport interface ChipProps {\r\n children: React.ReactNode;\r\n\r\n /* Removable chip — shows close button /\r\n removable?: boolean;\r\n\r\n /* Selected chip state /\r\n selected?: boolean;\r\n\r\n /* Left icon element /\r\n iconLeft?: React.ReactNode;\r\n\r\n /* Right icon element /\r\n iconRight?: React.ReactNode;\r\n\r\n /* Chip size /\r\n size?: 'sm' \| 'md';\r\n\r\n /* Remove handler /\r\n onRemove?: () => void;\r\n\r\n /* Select handler */\r\n onSelect?: () => void;\r\n\r\n className?: string;\r\n}\r\n\r\nexport function Chip({\r\n children,\r\n removable = false,\r\n selected = false,\r\n iconLeft,\r\n iconRight,\r\n size = 'md',\r\n onRemove,\r\n onSelect,\r\n className = '',\r\n}: ChipProps) {\r\n return (\r\n <div\r\n className={[\r\n 'ui-chip',\r\n `ui-chip--${size}`,\r\n selected ? 'selected' : '',\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(' ')}\r\n role=\"button\"\r\n tabIndex={0}\r\n onClick={onSelect}\r\n onKeyDown={(e) => {\r\n if (e.key === 'Enter' \|\| e.key === ' ') onSelect?.();\r\n }}\r\n >\r\n {iconLeft && <span className=\"ui-chip-icon-left\">{iconLeft}</span>}\r\n\r\n <span className=\"ui-chip-label\">{children}</span>\r\n\r\n {iconRight && <span className=\"ui-chip-icon-right\">{iconRight}</span>}\r\n\r\n {removable && (\r\n <button\r\n className=\"ui-chip-remove\"\r\n aria-label=\"Remove\"\r\n onClick={(e) => {\r\n e.stopPropagation(); // prevent select\r\n onRemove?.();\r\n }}\r\n >\r\n ×\r\n </button>\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["Chip","children","removable","selected","iconLeft","iconRight","size","onRemove","onSelect","className","jsxs","e","jsx"],"mappings":"+IAyCO,SAASA,EAAK,CACnB,SAAAC,EACA,UAAAC,EAAY,GACZ,SAAAC,EAAW,GACX,SAAAC,EACA,UAAAC,EACA,KAAAC,EAAO,KACP,SAAAC,EACA,SAAAC,EACA,UAAAC,EAAY,EACd,EAAc,CACZ,OACEC,EAAAA,KAAC,MAAA,CACC,UAAW,CACT,UACA,YAAYJ,CAAI,GAChBH,EAAW,WAAa,GACxBM,CAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,EACX,KAAK,SACL,SAAU,EACV,QAASD,EACT,UAAYG,GAAM,EACZA,EAAE,MAAQ,SAAWA,EAAE,MAAQ,MAAKH,IAAA,CAC1C,EAEC,SAAA,CAAAJ,GAAYQ,EAAAA,IAAC,OAAA,CAAK,UAAU,oBAAqB,SAAAR,EAAS,EAE3DQ,EAAAA,IAAC,OAAA,CAAK,UAAU,gBAAiB,SAAAX,CAAA,CAAS,EAEzCI,GAAaO,EAAAA,IAAC,OAAA,CAAK,UAAU,qBAAsB,SAAAP,EAAU,EAE7DH,GACCU,EAAAA,IAAC,SAAA,CACC,UAAU,iBACV,aAAW,SACX,QAAUD,GAAM,CACdA,EAAE,gBAAA,EACFJ,IAAA,CACF,EACD,SAAA,GAAA,CAAA,CAED,CAAA,CAAA,CAIR"}
1	+ {"version":3,"file":"Chip.cjs","sources":["../../../src/components/chip/Chip.tsx"],"sourcesContent":["/*\r\n Chip.tsx — FINAL VERSION\r\n * -------------------------\r\n * Features:\r\n * - Removable (optional)\r\n * - Selectable (optional)\r\n * - Sizes: sm, md\r\n * - Icons (left/right)\r\n * - Theme-aware\r\n /\r\n\r\nimport React from 'react';\r\nimport './Chip.css';\r\n\r\nexport interface ChipProps {\r\n children: React.ReactNode;\r\n\r\n /* Removable chip — shows close button /\r\n removable?: boolean;\r\n\r\n /* Selected chip state /\r\n selected?: boolean;\r\n\r\n /* Left icon element /\r\n iconLeft?: React.ReactNode;\r\n\r\n /* Right icon element /\r\n iconRight?: React.ReactNode;\r\n\r\n /* Chip size /\r\n size?: 'sm' \| 'md';\r\n\r\n /* Remove handler /\r\n onRemove?: () => void;\r\n\r\n /* Select handler */\r\n onSelect?: () => void;\r\n\r\n className?: string;\r\n}\r\n\r\nexport function Chip({\r\n children,\r\n removable = false,\r\n selected = false,\r\n iconLeft,\r\n iconRight,\r\n size = 'md',\r\n onRemove,\r\n onSelect,\r\n className = '',\r\n}: ChipProps) {\r\n return (\r\n <div\r\n className={[\r\n 'ui-chip',\r\n `ui-chip--${size}`,\r\n selected ? 'selected' : '',\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(' ')}\r\n role=\"button\"\r\n tabIndex={0}\r\n onClick={onSelect}\r\n onKeyDown={(e) => {\r\n if (e.key === 'Enter' \|\| e.key === ' ') onSelect?.();\r\n }}\r\n >\r\n {iconLeft && <span className=\"ui-chip-icon-left\">{iconLeft}</span>}\r\n\r\n <span className=\"ui-chip-label\">{children}</span>\r\n\r\n {iconRight && <span className=\"ui-chip-icon-right\">{iconRight}</span>}\r\n\r\n {removable && (\r\n <button\r\n className=\"ui-chip-remove\"\r\n aria-label=\"Remove\"\r\n onClick={(e) => {\r\n e.stopPropagation(); // prevent select\r\n onRemove?.();\r\n }}\r\n >\r\n ×\r\n </button>\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["Chip","children","removable","selected","iconLeft","iconRight","size","onRemove","onSelect","className","jsxs","e","jsx"],"mappings":"+IAyCO,SAASA,EAAK,CACnB,SAAAC,EACA,UAAAC,EAAY,GACZ,SAAAC,EAAW,GACX,SAAAC,EACA,UAAAC,EACA,KAAAC,EAAO,KACP,SAAAC,EACA,SAAAC,EACA,UAAAC,EAAY,EACd,EAAc,CACZ,OACEC,EAAAA,KAAC,MAAA,CACC,UAAW,CACT,UACA,YAAYJ,CAAI,GAChBH,EAAW,WAAa,GACxBM,CAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,EACX,KAAK,SACL,SAAU,EACV,QAASD,EACT,UAAYG,GAAM,EACZA,EAAE,MAAQ,SAAWA,EAAE,MAAQ,MAAKH,IAAA,CAC1C,EAEC,SAAA,CAAAJ,GAAYQ,EAAAA,IAAC,OAAA,CAAK,UAAU,oBAAqB,SAAAR,EAAS,EAE3DQ,EAAAA,IAAC,OAAA,CAAK,UAAU,gBAAiB,SAAAX,CAAA,CAAS,EAEzCI,GAAaO,EAAAA,IAAC,OAAA,CAAK,UAAU,qBAAsB,SAAAP,EAAU,EAE7DH,GACCU,EAAAA,IAAC,SAAA,CACC,UAAU,iBACV,aAAW,SACX,QAAUD,GAAM,CACdA,EAAE,gBAAA,EACFJ,IAAA,CACF,EACD,SAAA,GAAA,CAAA,CAED,CAAA,CAAA,CAIR"}

package/dist/components/chip/Chip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Chip.js","sources":["~~../../../../~~src/components/chip/Chip.tsx"],"sourcesContent":["/*\r\n Chip.tsx — FINAL VERSION\r\n * -------------------------\r\n * Features:\r\n * - Removable (optional)\r\n * - Selectable (optional)\r\n * - Sizes: sm, md\r\n * - Icons (left/right)\r\n * - Theme-aware\r\n /\r\n\r\nimport React from 'react';\r\nimport './Chip.css';\r\n\r\nexport interface ChipProps {\r\n children: React.ReactNode;\r\n\r\n /* Removable chip — shows close button /\r\n removable?: boolean;\r\n\r\n /* Selected chip state /\r\n selected?: boolean;\r\n\r\n /* Left icon element /\r\n iconLeft?: React.ReactNode;\r\n\r\n /* Right icon element /\r\n iconRight?: React.ReactNode;\r\n\r\n /* Chip size /\r\n size?: 'sm' \| 'md';\r\n\r\n /* Remove handler /\r\n onRemove?: () => void;\r\n\r\n /* Select handler */\r\n onSelect?: () => void;\r\n\r\n className?: string;\r\n}\r\n\r\nexport function Chip({\r\n children,\r\n removable = false,\r\n selected = false,\r\n iconLeft,\r\n iconRight,\r\n size = 'md',\r\n onRemove,\r\n onSelect,\r\n className = '',\r\n}: ChipProps) {\r\n return (\r\n <div\r\n className={[\r\n 'ui-chip',\r\n `ui-chip--${size}`,\r\n selected ? 'selected' : '',\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(' ')}\r\n role=\"button\"\r\n tabIndex={0}\r\n onClick={onSelect}\r\n onKeyDown={(e) => {\r\n if (e.key === 'Enter' \|\| e.key === ' ') onSelect?.();\r\n }}\r\n >\r\n {iconLeft && <span className=\"ui-chip-icon-left\">{iconLeft}</span>}\r\n\r\n <span className=\"ui-chip-label\">{children}</span>\r\n\r\n {iconRight && <span className=\"ui-chip-icon-right\">{iconRight}</span>}\r\n\r\n {removable && (\r\n <button\r\n className=\"ui-chip-remove\"\r\n aria-label=\"Remove\"\r\n onClick={(e) => {\r\n e.stopPropagation(); // prevent select\r\n onRemove?.();\r\n }}\r\n >\r\n ×\r\n </button>\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["Chip","children","removable","selected","iconLeft","iconRight","size","onRemove","onSelect","className","jsxs","e","jsx"],"mappings":";;AAyCO,SAASA,EAAK;AAAA,EACnB,UAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,UAAAC,IAAW;AAAA,EACX,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAAc;AACZ,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,YAAYJ,CAAI;AAAA,QAChBH,IAAW,aAAa;AAAA,QACxBM;AAAA,MAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MACX,MAAK;AAAA,MACL,UAAU;AAAA,MACV,SAASD;AAAA,MACT,WAAW,CAACG,MAAM;AAChB,SAAIA,EAAE,QAAQ,WAAWA,EAAE,QAAQ,QAAKH,IAAA;AAAA,MAC1C;AAAA,MAEC,UAAA;AAAA,QAAAJ,KAAY,gBAAAQ,EAAC,QAAA,EAAK,WAAU,qBAAqB,UAAAR,GAAS;AAAA,QAE3D,gBAAAQ,EAAC,QAAA,EAAK,WAAU,iBAAiB,UAAAX,EAAA,CAAS;AAAA,QAEzCI,KAAa,gBAAAO,EAAC,QAAA,EAAK,WAAU,sBAAsB,UAAAP,GAAU;AAAA,QAE7DH,KACC,gBAAAU;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,cAAW;AAAA,YACX,SAAS,CAACD,MAAM;AACd,cAAAA,EAAE,gBAAA,GACFJ,IAAA;AAAA,YACF;AAAA,YACD,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MAED;AAAA,IAAA;AAAA,EAAA;AAIR;"}
1	+ {"version":3,"file":"Chip.js","sources":["../../../src/components/chip/Chip.tsx"],"sourcesContent":["/*\r\n Chip.tsx — FINAL VERSION\r\n * -------------------------\r\n * Features:\r\n * - Removable (optional)\r\n * - Selectable (optional)\r\n * - Sizes: sm, md\r\n * - Icons (left/right)\r\n * - Theme-aware\r\n /\r\n\r\nimport React from 'react';\r\nimport './Chip.css';\r\n\r\nexport interface ChipProps {\r\n children: React.ReactNode;\r\n\r\n /* Removable chip — shows close button /\r\n removable?: boolean;\r\n\r\n /* Selected chip state /\r\n selected?: boolean;\r\n\r\n /* Left icon element /\r\n iconLeft?: React.ReactNode;\r\n\r\n /* Right icon element /\r\n iconRight?: React.ReactNode;\r\n\r\n /* Chip size /\r\n size?: 'sm' \| 'md';\r\n\r\n /* Remove handler /\r\n onRemove?: () => void;\r\n\r\n /* Select handler */\r\n onSelect?: () => void;\r\n\r\n className?: string;\r\n}\r\n\r\nexport function Chip({\r\n children,\r\n removable = false,\r\n selected = false,\r\n iconLeft,\r\n iconRight,\r\n size = 'md',\r\n onRemove,\r\n onSelect,\r\n className = '',\r\n}: ChipProps) {\r\n return (\r\n <div\r\n className={[\r\n 'ui-chip',\r\n `ui-chip--${size}`,\r\n selected ? 'selected' : '',\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(' ')}\r\n role=\"button\"\r\n tabIndex={0}\r\n onClick={onSelect}\r\n onKeyDown={(e) => {\r\n if (e.key === 'Enter' \|\| e.key === ' ') onSelect?.();\r\n }}\r\n >\r\n {iconLeft && <span className=\"ui-chip-icon-left\">{iconLeft}</span>}\r\n\r\n <span className=\"ui-chip-label\">{children}</span>\r\n\r\n {iconRight && <span className=\"ui-chip-icon-right\">{iconRight}</span>}\r\n\r\n {removable && (\r\n <button\r\n className=\"ui-chip-remove\"\r\n aria-label=\"Remove\"\r\n onClick={(e) => {\r\n e.stopPropagation(); // prevent select\r\n onRemove?.();\r\n }}\r\n >\r\n ×\r\n </button>\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["Chip","children","removable","selected","iconLeft","iconRight","size","onRemove","onSelect","className","jsxs","e","jsx"],"mappings":";;AAyCO,SAASA,EAAK;AAAA,EACnB,UAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,UAAAC,IAAW;AAAA,EACX,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAAc;AACZ,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,YAAYJ,CAAI;AAAA,QAChBH,IAAW,aAAa;AAAA,QACxBM;AAAA,MAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MACX,MAAK;AAAA,MACL,UAAU;AAAA,MACV,SAASD;AAAA,MACT,WAAW,CAACG,MAAM;AAChB,SAAIA,EAAE,QAAQ,WAAWA,EAAE,QAAQ,QAAKH,IAAA;AAAA,MAC1C;AAAA,MAEC,UAAA;AAAA,QAAAJ,KAAY,gBAAAQ,EAAC,QAAA,EAAK,WAAU,qBAAqB,UAAAR,GAAS;AAAA,QAE3D,gBAAAQ,EAAC,QAAA,EAAK,WAAU,iBAAiB,UAAAX,EAAA,CAAS;AAAA,QAEzCI,KAAa,gBAAAO,EAAC,QAAA,EAAK,WAAU,sBAAsB,UAAAP,GAAU;AAAA,QAE7DH,KACC,gBAAAU;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,cAAW;AAAA,YACX,SAAS,CAACD,MAAM;AACd,cAAAA,EAAE,gBAAA,GACFJ,IAAA;AAAA,YACF;AAAA,YACD,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MAED;AAAA,IAAA;AAAA,EAAA;AAIR;"}

package/dist/components/combobox/Combobox.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Combobox.cjs","sources":["../../../../src/components/combobox/Combobox.tsx"],"sourcesContent":["/*\r\n Combobox.tsx\r\n * Fully WCAG-compliant Combobox integrated with your existing utilities.\r\n /\r\n\r\n/\r\n Combobox.tsx\r\n * Now includes:\r\n * - leftIcon (input)\r\n * - rightIcon (input)\r\n * - renderOptionIcon (listbox)\r\n /\r\n/\r\n Combobox.tsx\r\n * Fully WCAG-Compliant Combobox with:\r\n * - Icons (input + option)\r\n * - Value→Label mapping fixed\r\n * - Keyboard navigation\r\n * - Click outside to close\r\n * - Controlled/uncontrolled\r\n /\r\n\r\nimport React, {\r\n useState,\r\n useEffect,\r\n useRef,\r\n useCallback,\r\n KeyboardEvent,\r\n} from 'react';\r\n\r\nimport './Combobox.css';\r\n\r\n// USING YOUR EXISTING UTILS\r\nimport { onClickOutside, generateId } from '../../utils/index';\r\n\r\nexport interface ComboboxOption {\r\n label: string;\r\n value: string;\r\n icon?: React.ReactNode;\r\n}\r\n\r\ninterface ComboboxProps {\r\n options: ComboboxOption[];\r\n\r\n value?: string;\r\n defaultValue?: string;\r\n onChange?: (value: string) => void;\r\n\r\n placeholder?: string;\r\n disabled?: boolean;\r\n className?: string;\r\n emptyMessage?: string;\r\n\r\n filter?: (input: string, option: ComboboxOption) => boolean;\r\n\r\n leftIcon?: React.ReactNode;\r\n rightIcon?: React.ReactNode;\r\n\r\n renderOption?: (option: ComboboxOption, active: boolean) => React.ReactNode;\r\n renderOptionIcon?: (option: ComboboxOption) => React.ReactNode;\r\n}\r\n\r\nexport function Combobox({\r\n options,\r\n value,\r\n defaultValue,\r\n onChange,\r\n placeholder = 'Select...',\r\n disabled = false,\r\n className = '',\r\n emptyMessage = 'No results found',\r\n filter,\r\n leftIcon,\r\n rightIcon,\r\n renderOption,\r\n renderOptionIcon,\r\n}: ComboboxProps) {\r\n const isControlled = value !== undefined;\r\n\r\n /\r\n displayLabel = what the user SEEES in input\r\n * value = actual selected value (sent to parent)\r\n /\r\n const [displayLabel, setDisplayLabel] = useState<string>(() => {\r\n if (isControlled && value) {\r\n const match = options.find((o) => o.value === value);\r\n return match?.label ?? '';\r\n }\r\n if (defaultValue) {\r\n const match = options.find((o) => o.value === defaultValue);\r\n return match?.label ?? '';\r\n }\r\n return '';\r\n });\r\n\r\n const [open, setOpen] = useState(false);\r\n const [activeIndex, setActiveIndex] = useState<number>(-1);\r\n\r\n const wrapperRef = useRef<HTMLDivElement \| null>(null);\r\n const listboxId = useRef(generateId('combobox-list')).current;\r\n\r\n /* Filtered options /\r\n const filtered = options.filter((opt) =>\r\n filter\r\n ? filter(displayLabel, opt)\r\n : opt.label.toLowerCase().includes(displayLabel.toLowerCase())\r\n );\r\n\r\n /* Set parent value /\r\n const setValue = useCallback(\r\n (val: string) => {\r\n onChange?.(val);\r\n },\r\n [onChange]\r\n );\r\n\r\n const openList = useCallback(() => {\r\n if (!disabled) setOpen(true);\r\n }, [disabled]);\r\n\r\n const closeList = useCallback(() => {\r\n setOpen(false);\r\n setActiveIndex(-1);\r\n }, []);\r\n\r\n /* Click outside to close /\r\n useEffect(() => {\r\n if (!open) return;\r\n return onClickOutside(wrapperRef, closeList);\r\n }, [open, closeList]);\r\n\r\n /* Sync controlled (value → label) /\r\n useEffect(() => {\r\n if (isControlled && value !== undefined) {\r\n const found = options.find((o) => o.value === value);\r\n setDisplayLabel(found?.label \|\| '');\r\n }\r\n }, [isControlled, value, options]);\r\n\r\n /* Keyboard behavior /\r\n const onKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\r\n if (disabled) return;\r\n\r\n switch (e.key) {\r\n case 'ArrowDown':\r\n e.preventDefault();\r\n if (!open) openList();\r\n setActiveIndex((i) => Math.min(filtered.length - 1, i + 1));\r\n break;\r\n\r\n case 'ArrowUp':\r\n e.preventDefault();\r\n if (!open) openList();\r\n setActiveIndex((i) => Math.max(0, i - 1));\r\n break;\r\n\r\n case 'Enter':\r\n if (open && activeIndex >= 0) {\r\n const opt = filtered[activeIndex];\r\n setDisplayLabel(opt.label);\r\n setValue(opt.value);\r\n closeList();\r\n }\r\n break;\r\n\r\n case 'Escape':\r\n if (open) {\r\n e.preventDefault();\r\n closeList();\r\n }\r\n break;\r\n\r\n default:\r\n break;\r\n }\r\n };\r\n\r\n /* Option click /\r\n const onOptionClick = (opt: ComboboxOption) => {\r\n setDisplayLabel(opt.label);\r\n setValue(opt.value);\r\n closeList();\r\n };\r\n\r\n return (\r\n <div ref={wrapperRef} className={`ui-combobox ${className}`}>\r\n {/ Input + Icons /}\r\n <div className=\"ui-combobox-input-wrapper\">\r\n {leftIcon && <span className=\"ui-combobox-left-icon\">{leftIcon}</span>}\r\n\r\n <input\r\n className={[\r\n 'ui-combobox-input',\r\n leftIcon && 'has-left-icon',\r\n rightIcon && 'has-right-icon',\r\n ]\r\n .filter(Boolean)\r\n .join(' ')}\r\n role=\"combobox\"\r\n aria-expanded={open}\r\n aria-controls={listboxId}\r\n placeholder={placeholder}\r\n disabled={disabled}\r\n value={displayLabel}\r\n onFocus={openList}\r\n onClick={openList}\r\n onChange={(e) => {\r\n setDisplayLabel(e.target.value);\r\n if (!open) openList();\r\n }}\r\n onKeyDown={onKeyDown}\r\n />\r\n\r\n {rightIcon && (\r\n <span className=\"ui-combobox-right-icon\">{rightIcon}</span>\r\n )}\r\n </div>\r\n\r\n {open && (\r\n <div id={listboxId} role=\"listbox\" className=\"ui-combobox-listbox\">\r\n {filtered.length === 0 ? (\r\n <div className=\"ui-combobox-empty\">{emptyMessage}</div>\r\n ) : (\r\n filtered.map((opt, index) => {\r\n const active = index === activeIndex;\r\n\r\n return (\r\n <div\r\n key={opt.value}\r\n role=\"option\"\r\n aria-selected={active}\r\n className={`ui-combobox-option ${active ? 'active' : ''}`}\r\n onMouseDown={(e) => e.preventDefault()}\r\n onClick={() => onOptionClick(opt)}\r\n >\r\n {/ Option icon (if provided through renderOptionIcon) */}\r\n {renderOptionIcon && (\r\n <span className=\"ui-combobox-option-icon\">\r\n {renderOptionIcon(opt)}\r\n </span>\r\n )}\r\n\r\n {renderOption ? renderOption(opt, active) : opt.label}\r\n </div>\r\n );\r\n })\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["Combobox","options","value","defaultValue","onChange","placeholder","disabled","className","emptyMessage","filter","leftIcon","rightIcon","renderOption","renderOptionIcon","isControlled","displayLabel","setDisplayLabel","useState","open","setOpen","activeIndex","setActiveIndex","wrapperRef","useRef","listboxId","generateId","filtered","opt","setValue","useCallback","val","openList","closeList","useEffect","onClickOutside","found","onKeyDown","i","onOptionClick","jsxs","jsx","index","active","e"],"mappings":"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"}
1	+ {"version":3,"file":"Combobox.cjs","sources":["../../../src/components/combobox/Combobox.tsx"],"sourcesContent":["/*\r\n Combobox.tsx\r\n * Fully WCAG-compliant Combobox integrated with your existing utilities.\r\n /\r\n\r\n/\r\n Combobox.tsx\r\n * Now includes:\r\n * - leftIcon (input)\r\n * - rightIcon (input)\r\n * - renderOptionIcon (listbox)\r\n /\r\n/\r\n Combobox.tsx\r\n * Fully WCAG-Compliant Combobox with:\r\n * - Icons (input + option)\r\n * - Value→Label mapping fixed\r\n * - Keyboard navigation\r\n * - Click outside to close\r\n * - Controlled/uncontrolled\r\n /\r\n\r\nimport React, {\r\n useState,\r\n useEffect,\r\n useRef,\r\n useCallback,\r\n KeyboardEvent,\r\n} from 'react';\r\n\r\nimport './Combobox.css';\r\n\r\n// USING YOUR EXISTING UTILS\r\nimport { onClickOutside, generateId } from '../../utils/index';\r\n\r\nexport interface ComboboxOption {\r\n label: string;\r\n value: string;\r\n icon?: React.ReactNode;\r\n}\r\n\r\ninterface ComboboxProps {\r\n options: ComboboxOption[];\r\n\r\n value?: string;\r\n defaultValue?: string;\r\n onChange?: (value: string) => void;\r\n\r\n placeholder?: string;\r\n disabled?: boolean;\r\n className?: string;\r\n emptyMessage?: string;\r\n\r\n filter?: (input: string, option: ComboboxOption) => boolean;\r\n\r\n leftIcon?: React.ReactNode;\r\n rightIcon?: React.ReactNode;\r\n\r\n renderOption?: (option: ComboboxOption, active: boolean) => React.ReactNode;\r\n renderOptionIcon?: (option: ComboboxOption) => React.ReactNode;\r\n}\r\n\r\nexport function Combobox({\r\n options,\r\n value,\r\n defaultValue,\r\n onChange,\r\n placeholder = 'Select...',\r\n disabled = false,\r\n className = '',\r\n emptyMessage = 'No results found',\r\n filter,\r\n leftIcon,\r\n rightIcon,\r\n renderOption,\r\n renderOptionIcon,\r\n}: ComboboxProps) {\r\n const isControlled = value !== undefined;\r\n\r\n /\r\n displayLabel = what the user SEEES in input\r\n * value = actual selected value (sent to parent)\r\n /\r\n const [displayLabel, setDisplayLabel] = useState<string>(() => {\r\n if (isControlled && value) {\r\n const match = options.find((o) => o.value === value);\r\n return match?.label ?? '';\r\n }\r\n if (defaultValue) {\r\n const match = options.find((o) => o.value === defaultValue);\r\n return match?.label ?? '';\r\n }\r\n return '';\r\n });\r\n\r\n const [open, setOpen] = useState(false);\r\n const [activeIndex, setActiveIndex] = useState<number>(-1);\r\n\r\n const wrapperRef = useRef<HTMLDivElement \| null>(null);\r\n const listboxId = useRef(generateId('combobox-list')).current;\r\n\r\n /* Filtered options /\r\n const filtered = options.filter((opt) =>\r\n filter\r\n ? filter(displayLabel, opt)\r\n : opt.label.toLowerCase().includes(displayLabel.toLowerCase())\r\n );\r\n\r\n /* Set parent value /\r\n const setValue = useCallback(\r\n (val: string) => {\r\n onChange?.(val);\r\n },\r\n [onChange]\r\n );\r\n\r\n const openList = useCallback(() => {\r\n if (!disabled) setOpen(true);\r\n }, [disabled]);\r\n\r\n const closeList = useCallback(() => {\r\n setOpen(false);\r\n setActiveIndex(-1);\r\n }, []);\r\n\r\n /* Click outside to close /\r\n useEffect(() => {\r\n if (!open) return;\r\n return onClickOutside(wrapperRef, closeList);\r\n }, [open, closeList]);\r\n\r\n /* Sync controlled (value → label) /\r\n useEffect(() => {\r\n if (isControlled && value !== undefined) {\r\n const found = options.find((o) => o.value === value);\r\n setDisplayLabel(found?.label \|\| '');\r\n }\r\n }, [isControlled, value, options]);\r\n\r\n /* Keyboard behavior /\r\n const onKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\r\n if (disabled) return;\r\n\r\n switch (e.key) {\r\n case 'ArrowDown':\r\n e.preventDefault();\r\n if (!open) openList();\r\n setActiveIndex((i) => Math.min(filtered.length - 1, i + 1));\r\n break;\r\n\r\n case 'ArrowUp':\r\n e.preventDefault();\r\n if (!open) openList();\r\n setActiveIndex((i) => Math.max(0, i - 1));\r\n break;\r\n\r\n case 'Enter':\r\n if (open && activeIndex >= 0) {\r\n const opt = filtered[activeIndex];\r\n setDisplayLabel(opt.label);\r\n setValue(opt.value);\r\n closeList();\r\n }\r\n break;\r\n\r\n case 'Escape':\r\n if (open) {\r\n e.preventDefault();\r\n closeList();\r\n }\r\n break;\r\n\r\n default:\r\n break;\r\n }\r\n };\r\n\r\n /* Option click /\r\n const onOptionClick = (opt: ComboboxOption) => {\r\n setDisplayLabel(opt.label);\r\n setValue(opt.value);\r\n closeList();\r\n };\r\n\r\n return (\r\n <div ref={wrapperRef} className={`ui-combobox ${className}`}>\r\n {/ Input + Icons /}\r\n <div className=\"ui-combobox-input-wrapper\">\r\n {leftIcon && <span className=\"ui-combobox-left-icon\">{leftIcon}</span>}\r\n\r\n <input\r\n className={[\r\n 'ui-combobox-input',\r\n leftIcon && 'has-left-icon',\r\n rightIcon && 'has-right-icon',\r\n ]\r\n .filter(Boolean)\r\n .join(' ')}\r\n role=\"combobox\"\r\n aria-expanded={open}\r\n aria-controls={listboxId}\r\n placeholder={placeholder}\r\n disabled={disabled}\r\n value={displayLabel}\r\n onFocus={openList}\r\n onClick={openList}\r\n onChange={(e) => {\r\n setDisplayLabel(e.target.value);\r\n if (!open) openList();\r\n }}\r\n onKeyDown={onKeyDown}\r\n />\r\n\r\n {rightIcon && (\r\n <span className=\"ui-combobox-right-icon\">{rightIcon}</span>\r\n )}\r\n </div>\r\n\r\n {open && (\r\n <div id={listboxId} role=\"listbox\" className=\"ui-combobox-listbox\">\r\n {filtered.length === 0 ? (\r\n <div className=\"ui-combobox-empty\">{emptyMessage}</div>\r\n ) : (\r\n filtered.map((opt, index) => {\r\n const active = index === activeIndex;\r\n\r\n return (\r\n <div\r\n key={opt.value}\r\n role=\"option\"\r\n aria-selected={active}\r\n className={`ui-combobox-option ${active ? 'active' : ''}`}\r\n onMouseDown={(e) => e.preventDefault()}\r\n onClick={() => onOptionClick(opt)}\r\n >\r\n {/ Option icon (if provided through renderOptionIcon) */}\r\n {renderOptionIcon && (\r\n <span className=\"ui-combobox-option-icon\">\r\n {renderOptionIcon(opt)}\r\n </span>\r\n )}\r\n\r\n {renderOption ? renderOption(opt, active) : opt.label}\r\n </div>\r\n );\r\n })\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["Combobox","options","value","defaultValue","onChange","placeholder","disabled","className","emptyMessage","filter","leftIcon","rightIcon","renderOption","renderOptionIcon","isControlled","displayLabel","setDisplayLabel","useState","open","setOpen","activeIndex","setActiveIndex","wrapperRef","useRef","listboxId","generateId","filtered","opt","setValue","useCallback","val","openList","closeList","useEffect","onClickOutside","found","onKeyDown","i","onOptionClick","jsxs","jsx","index","active","e"],"mappings":"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"}

package/dist/components/combobox/Combobox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Combobox.js","sources":["../../../../src/components/combobox/Combobox.tsx"],"sourcesContent":["/*\r\n Combobox.tsx\r\n * Fully WCAG-compliant Combobox integrated with your existing utilities.\r\n /\r\n\r\n/\r\n Combobox.tsx\r\n * Now includes:\r\n * - leftIcon (input)\r\n * - rightIcon (input)\r\n * - renderOptionIcon (listbox)\r\n /\r\n/\r\n Combobox.tsx\r\n * Fully WCAG-Compliant Combobox with:\r\n * - Icons (input + option)\r\n * - Value→Label mapping fixed\r\n * - Keyboard navigation\r\n * - Click outside to close\r\n * - Controlled/uncontrolled\r\n /\r\n\r\nimport React, {\r\n useState,\r\n useEffect,\r\n useRef,\r\n useCallback,\r\n KeyboardEvent,\r\n} from 'react';\r\n\r\nimport './Combobox.css';\r\n\r\n// USING YOUR EXISTING UTILS\r\nimport { onClickOutside, generateId } from '../../utils/index';\r\n\r\nexport interface ComboboxOption {\r\n label: string;\r\n value: string;\r\n icon?: React.ReactNode;\r\n}\r\n\r\ninterface ComboboxProps {\r\n options: ComboboxOption[];\r\n\r\n value?: string;\r\n defaultValue?: string;\r\n onChange?: (value: string) => void;\r\n\r\n placeholder?: string;\r\n disabled?: boolean;\r\n className?: string;\r\n emptyMessage?: string;\r\n\r\n filter?: (input: string, option: ComboboxOption) => boolean;\r\n\r\n leftIcon?: React.ReactNode;\r\n rightIcon?: React.ReactNode;\r\n\r\n renderOption?: (option: ComboboxOption, active: boolean) => React.ReactNode;\r\n renderOptionIcon?: (option: ComboboxOption) => React.ReactNode;\r\n}\r\n\r\nexport function Combobox({\r\n options,\r\n value,\r\n defaultValue,\r\n onChange,\r\n placeholder = 'Select...',\r\n disabled = false,\r\n className = '',\r\n emptyMessage = 'No results found',\r\n filter,\r\n leftIcon,\r\n rightIcon,\r\n renderOption,\r\n renderOptionIcon,\r\n}: ComboboxProps) {\r\n const isControlled = value !== undefined;\r\n\r\n /\r\n displayLabel = what the user SEEES in input\r\n * value = actual selected value (sent to parent)\r\n /\r\n const [displayLabel, setDisplayLabel] = useState<string>(() => {\r\n if (isControlled && value) {\r\n const match = options.find((o) => o.value === value);\r\n return match?.label ?? '';\r\n }\r\n if (defaultValue) {\r\n const match = options.find((o) => o.value === defaultValue);\r\n return match?.label ?? '';\r\n }\r\n return '';\r\n });\r\n\r\n const [open, setOpen] = useState(false);\r\n const [activeIndex, setActiveIndex] = useState<number>(-1);\r\n\r\n const wrapperRef = useRef<HTMLDivElement \| null>(null);\r\n const listboxId = useRef(generateId('combobox-list')).current;\r\n\r\n /* Filtered options /\r\n const filtered = options.filter((opt) =>\r\n filter\r\n ? filter(displayLabel, opt)\r\n : opt.label.toLowerCase().includes(displayLabel.toLowerCase())\r\n );\r\n\r\n /* Set parent value /\r\n const setValue = useCallback(\r\n (val: string) => {\r\n onChange?.(val);\r\n },\r\n [onChange]\r\n );\r\n\r\n const openList = useCallback(() => {\r\n if (!disabled) setOpen(true);\r\n }, [disabled]);\r\n\r\n const closeList = useCallback(() => {\r\n setOpen(false);\r\n setActiveIndex(-1);\r\n }, []);\r\n\r\n /* Click outside to close /\r\n useEffect(() => {\r\n if (!open) return;\r\n return onClickOutside(wrapperRef, closeList);\r\n }, [open, closeList]);\r\n\r\n /* Sync controlled (value → label) /\r\n useEffect(() => {\r\n if (isControlled && value !== undefined) {\r\n const found = options.find((o) => o.value === value);\r\n setDisplayLabel(found?.label \|\| '');\r\n }\r\n }, [isControlled, value, options]);\r\n\r\n /* Keyboard behavior /\r\n const onKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\r\n if (disabled) return;\r\n\r\n switch (e.key) {\r\n case 'ArrowDown':\r\n e.preventDefault();\r\n if (!open) openList();\r\n setActiveIndex((i) => Math.min(filtered.length - 1, i + 1));\r\n break;\r\n\r\n case 'ArrowUp':\r\n e.preventDefault();\r\n if (!open) openList();\r\n setActiveIndex((i) => Math.max(0, i - 1));\r\n break;\r\n\r\n case 'Enter':\r\n if (open && activeIndex >= 0) {\r\n const opt = filtered[activeIndex];\r\n setDisplayLabel(opt.label);\r\n setValue(opt.value);\r\n closeList();\r\n }\r\n break;\r\n\r\n case 'Escape':\r\n if (open) {\r\n e.preventDefault();\r\n closeList();\r\n }\r\n break;\r\n\r\n default:\r\n break;\r\n }\r\n };\r\n\r\n /* Option click /\r\n const onOptionClick = (opt: ComboboxOption) => {\r\n setDisplayLabel(opt.label);\r\n setValue(opt.value);\r\n closeList();\r\n };\r\n\r\n return (\r\n <div ref={wrapperRef} className={`ui-combobox ${className}`}>\r\n {/ Input + Icons /}\r\n <div className=\"ui-combobox-input-wrapper\">\r\n {leftIcon && <span className=\"ui-combobox-left-icon\">{leftIcon}</span>}\r\n\r\n <input\r\n className={[\r\n 'ui-combobox-input',\r\n leftIcon && 'has-left-icon',\r\n rightIcon && 'has-right-icon',\r\n ]\r\n .filter(Boolean)\r\n .join(' ')}\r\n role=\"combobox\"\r\n aria-expanded={open}\r\n aria-controls={listboxId}\r\n placeholder={placeholder}\r\n disabled={disabled}\r\n value={displayLabel}\r\n onFocus={openList}\r\n onClick={openList}\r\n onChange={(e) => {\r\n setDisplayLabel(e.target.value);\r\n if (!open) openList();\r\n }}\r\n onKeyDown={onKeyDown}\r\n />\r\n\r\n {rightIcon && (\r\n <span className=\"ui-combobox-right-icon\">{rightIcon}</span>\r\n )}\r\n </div>\r\n\r\n {open && (\r\n <div id={listboxId} role=\"listbox\" className=\"ui-combobox-listbox\">\r\n {filtered.length === 0 ? (\r\n <div className=\"ui-combobox-empty\">{emptyMessage}</div>\r\n ) : (\r\n filtered.map((opt, index) => {\r\n const active = index === activeIndex;\r\n\r\n return (\r\n <div\r\n key={opt.value}\r\n role=\"option\"\r\n aria-selected={active}\r\n className={`ui-combobox-option ${active ? 'active' : ''}`}\r\n onMouseDown={(e) => e.preventDefault()}\r\n onClick={() => onOptionClick(opt)}\r\n >\r\n {/ Option icon (if provided through renderOptionIcon) */}\r\n {renderOptionIcon && (\r\n <span className=\"ui-combobox-option-icon\">\r\n {renderOptionIcon(opt)}\r\n </span>\r\n )}\r\n\r\n {renderOption ? renderOption(opt, active) : opt.label}\r\n </div>\r\n );\r\n })\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["Combobox","options","value","defaultValue","onChange","placeholder","disabled","className","emptyMessage","filter","leftIcon","rightIcon","renderOption","renderOptionIcon","isControlled","displayLabel","setDisplayLabel","useState","open","setOpen","activeIndex","setActiveIndex","wrapperRef","useRef","listboxId","generateId","filtered","opt","setValue","useCallback","val","openList","closeList","useEffect","onClickOutside","found","onKeyDown","i","onOptionClick","jsxs","jsx","index","active","e"],"mappings":"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"}
1	+ {"version":3,"file":"Combobox.js","sources":["../../../src/components/combobox/Combobox.tsx"],"sourcesContent":["/*\r\n Combobox.tsx\r\n * Fully WCAG-compliant Combobox integrated with your existing utilities.\r\n /\r\n\r\n/\r\n Combobox.tsx\r\n * Now includes:\r\n * - leftIcon (input)\r\n * - rightIcon (input)\r\n * - renderOptionIcon (listbox)\r\n /\r\n/\r\n Combobox.tsx\r\n * Fully WCAG-Compliant Combobox with:\r\n * - Icons (input + option)\r\n * - Value→Label mapping fixed\r\n * - Keyboard navigation\r\n * - Click outside to close\r\n * - Controlled/uncontrolled\r\n /\r\n\r\nimport React, {\r\n useState,\r\n useEffect,\r\n useRef,\r\n useCallback,\r\n KeyboardEvent,\r\n} from 'react';\r\n\r\nimport './Combobox.css';\r\n\r\n// USING YOUR EXISTING UTILS\r\nimport { onClickOutside, generateId } from '../../utils/index';\r\n\r\nexport interface ComboboxOption {\r\n label: string;\r\n value: string;\r\n icon?: React.ReactNode;\r\n}\r\n\r\ninterface ComboboxProps {\r\n options: ComboboxOption[];\r\n\r\n value?: string;\r\n defaultValue?: string;\r\n onChange?: (value: string) => void;\r\n\r\n placeholder?: string;\r\n disabled?: boolean;\r\n className?: string;\r\n emptyMessage?: string;\r\n\r\n filter?: (input: string, option: ComboboxOption) => boolean;\r\n\r\n leftIcon?: React.ReactNode;\r\n rightIcon?: React.ReactNode;\r\n\r\n renderOption?: (option: ComboboxOption, active: boolean) => React.ReactNode;\r\n renderOptionIcon?: (option: ComboboxOption) => React.ReactNode;\r\n}\r\n\r\nexport function Combobox({\r\n options,\r\n value,\r\n defaultValue,\r\n onChange,\r\n placeholder = 'Select...',\r\n disabled = false,\r\n className = '',\r\n emptyMessage = 'No results found',\r\n filter,\r\n leftIcon,\r\n rightIcon,\r\n renderOption,\r\n renderOptionIcon,\r\n}: ComboboxProps) {\r\n const isControlled = value !== undefined;\r\n\r\n /\r\n displayLabel = what the user SEEES in input\r\n * value = actual selected value (sent to parent)\r\n /\r\n const [displayLabel, setDisplayLabel] = useState<string>(() => {\r\n if (isControlled && value) {\r\n const match = options.find((o) => o.value === value);\r\n return match?.label ?? '';\r\n }\r\n if (defaultValue) {\r\n const match = options.find((o) => o.value === defaultValue);\r\n return match?.label ?? '';\r\n }\r\n return '';\r\n });\r\n\r\n const [open, setOpen] = useState(false);\r\n const [activeIndex, setActiveIndex] = useState<number>(-1);\r\n\r\n const wrapperRef = useRef<HTMLDivElement \| null>(null);\r\n const listboxId = useRef(generateId('combobox-list')).current;\r\n\r\n /* Filtered options /\r\n const filtered = options.filter((opt) =>\r\n filter\r\n ? filter(displayLabel, opt)\r\n : opt.label.toLowerCase().includes(displayLabel.toLowerCase())\r\n );\r\n\r\n /* Set parent value /\r\n const setValue = useCallback(\r\n (val: string) => {\r\n onChange?.(val);\r\n },\r\n [onChange]\r\n );\r\n\r\n const openList = useCallback(() => {\r\n if (!disabled) setOpen(true);\r\n }, [disabled]);\r\n\r\n const closeList = useCallback(() => {\r\n setOpen(false);\r\n setActiveIndex(-1);\r\n }, []);\r\n\r\n /* Click outside to close /\r\n useEffect(() => {\r\n if (!open) return;\r\n return onClickOutside(wrapperRef, closeList);\r\n }, [open, closeList]);\r\n\r\n /* Sync controlled (value → label) /\r\n useEffect(() => {\r\n if (isControlled && value !== undefined) {\r\n const found = options.find((o) => o.value === value);\r\n setDisplayLabel(found?.label \|\| '');\r\n }\r\n }, [isControlled, value, options]);\r\n\r\n /* Keyboard behavior /\r\n const onKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\r\n if (disabled) return;\r\n\r\n switch (e.key) {\r\n case 'ArrowDown':\r\n e.preventDefault();\r\n if (!open) openList();\r\n setActiveIndex((i) => Math.min(filtered.length - 1, i + 1));\r\n break;\r\n\r\n case 'ArrowUp':\r\n e.preventDefault();\r\n if (!open) openList();\r\n setActiveIndex((i) => Math.max(0, i - 1));\r\n break;\r\n\r\n case 'Enter':\r\n if (open && activeIndex >= 0) {\r\n const opt = filtered[activeIndex];\r\n setDisplayLabel(opt.label);\r\n setValue(opt.value);\r\n closeList();\r\n }\r\n break;\r\n\r\n case 'Escape':\r\n if (open) {\r\n e.preventDefault();\r\n closeList();\r\n }\r\n break;\r\n\r\n default:\r\n break;\r\n }\r\n };\r\n\r\n /* Option click /\r\n const onOptionClick = (opt: ComboboxOption) => {\r\n setDisplayLabel(opt.label);\r\n setValue(opt.value);\r\n closeList();\r\n };\r\n\r\n return (\r\n <div ref={wrapperRef} className={`ui-combobox ${className}`}>\r\n {/ Input + Icons /}\r\n <div className=\"ui-combobox-input-wrapper\">\r\n {leftIcon && <span className=\"ui-combobox-left-icon\">{leftIcon}</span>}\r\n\r\n <input\r\n className={[\r\n 'ui-combobox-input',\r\n leftIcon && 'has-left-icon',\r\n rightIcon && 'has-right-icon',\r\n ]\r\n .filter(Boolean)\r\n .join(' ')}\r\n role=\"combobox\"\r\n aria-expanded={open}\r\n aria-controls={listboxId}\r\n placeholder={placeholder}\r\n disabled={disabled}\r\n value={displayLabel}\r\n onFocus={openList}\r\n onClick={openList}\r\n onChange={(e) => {\r\n setDisplayLabel(e.target.value);\r\n if (!open) openList();\r\n }}\r\n onKeyDown={onKeyDown}\r\n />\r\n\r\n {rightIcon && (\r\n <span className=\"ui-combobox-right-icon\">{rightIcon}</span>\r\n )}\r\n </div>\r\n\r\n {open && (\r\n <div id={listboxId} role=\"listbox\" className=\"ui-combobox-listbox\">\r\n {filtered.length === 0 ? (\r\n <div className=\"ui-combobox-empty\">{emptyMessage}</div>\r\n ) : (\r\n filtered.map((opt, index) => {\r\n const active = index === activeIndex;\r\n\r\n return (\r\n <div\r\n key={opt.value}\r\n role=\"option\"\r\n aria-selected={active}\r\n className={`ui-combobox-option ${active ? 'active' : ''}`}\r\n onMouseDown={(e) => e.preventDefault()}\r\n onClick={() => onOptionClick(opt)}\r\n >\r\n {/ Option icon (if provided through renderOptionIcon) */}\r\n {renderOptionIcon && (\r\n <span className=\"ui-combobox-option-icon\">\r\n {renderOptionIcon(opt)}\r\n </span>\r\n )}\r\n\r\n {renderOption ? renderOption(opt, active) : opt.label}\r\n </div>\r\n );\r\n })\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n );\r\n}\r\n"],"names":["Combobox","options","value","defaultValue","onChange","placeholder","disabled","className","emptyMessage","filter","leftIcon","rightIcon","renderOption","renderOptionIcon","isControlled","displayLabel","setDisplayLabel","useState","open","setOpen","activeIndex","setActiveIndex","wrapperRef","useRef","listboxId","generateId","filtered","opt","setValue","useCallback","val","openList","closeList","useEffect","onClickOutside","found","onKeyDown","i","onOptionClick","jsxs","jsx","index","active","e"],"mappings":"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"}