npm - @tmorrow/cre8-wc - Versions diffs - 2.0.7 → 2.0.8 - Mend

@tmorrow/cre8-wc 2.0.7 → 2.0.8

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 (319) hide show

package/lib/components/chart/chart.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"chart.js","sourceRoot":"","sources":["../../../components/chart/chart.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EACH,KAAK,EAKL,aAAa,GAIhB,MAAM,UAAU,CAAC;AAClB,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,mCAAmC;AACnC,KAAK,CAAC,QAAQ,CAAC,GAAG,aAAa,CAAC,CAAC;AAsDjC;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,OAAO,SAAU,SAAQ,WAAW;IAA1C;;QAGI;;;WAGG;QAEH,SAAI,GAAkB,KAAK,CAAC;QAE5B;;;WAGG;QAEH,SAAI,GAAkB,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC;QAEvC;;;WAGG;QAEH,YAAO,GAAiB,EAAE,CAAC;QAU3B;;;;WAIG;QAEH,WAAM,GAAW,GAAG,CAAC;QAErB;;;WAGG;QAEH,wBAAmB,GAAY,IAAI,CAAC;QAEpC;;;WAGG;QAEH,eAAU,GAAY,IAAI,CAAC;QAE3B;;;WAGG;QAEH,YAAO,GAAY,KAAK,CAAC;QAEzB;;;WAGG;QAEH,cAAS,GAAW,OAAO,CAAC;QAE5B;;;WAGG;QAEH,eAAU,GAAY,IAAI,CAAC;QAE3B;;;WAGG;QAEH,mBAAc,GAAwC,KAAK,CAAC;QAE5D;;;WAGG;QAEH,oBAAe,GAAY,IAAI,CAAC;QAEhC;;;WAGG;QAEH,sBAAiB,GAAW,GAAG,CAAC;QAEhC;;WAEG;QAEH,WAAM,GAAa;YACf,SAAS,EAAE,eAAe;YAC1B,SAAS,EAAE,cAAc;YACzB,SAAS,EAAE,gBAAgB;YAC3B,SAAS,EAAE,iBAAiB;YAC5B,SAAS,EAAE,YAAY;YACvB,SAAS,EAAE,SAAS;YACpB,SAAS,EAAE,OAAO;YAClB,SAAS,EAAE,OAAO;SACrB,CAAC;QAEF;;WAEG;QAEK,mBAAc,GAAiB,IAAI,CAAC;QAE5C;;WAEG;QAEK,iBAAY,GAAY,KAAK,CAAC;IA8a1C,CAAC;IAtaG,iBAAiB;QACb,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;IAC7B,CAAC;IAED,oBAAoB;QAChB,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;QAC1B,IAAI,CAAC,aAAa,EAAE,CAAC;IACzB,CAAC;IAES,YAAY,CAAC,kBAAkC;QACrD,KAAK,CAAC,YAAY,CAAC,kBAAkB,CAAC,CAAC;QACvC,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC;YAChB,IAAI,CAAC,gBAAgB,EAAE,CAAC;QAC5B,CAAC;IACL,CAAC;IAES,OAAO,CAAC,iBAAiC;QAC/C,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;QAEjC,sDAAsD;QACtD,IAAI,iBAAiB,CAAC,GAAG,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;YAC5E,IAAI,CAAC,gBAAgB,EAAE,CAAC;YACxB,OAAO;QACX,CAAC;QAED,iCAAiC;QACjC,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACf,OAAO;QACX,CAAC;QAED,wDAAwD;QACxD,IAAI,iBAAiB,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACvD,IAAI,CAAC,aAAa,EAAE,CAAC;YACrB,IAAI,CAAC,gBAAgB,EAAE,CAAC;YACxB,OAAO;QACX,CAAC;QAED,mDAAmD;QACnD,IACI,CAAC,iBAAiB,CAAC,GAAG,CAAC,MAAM,CAAC;YAC7B,iBAAiB,CAAC,GAAG,CAAC,SAAS,CAAC;YAChC,iBAAiB,CAAC,GAAG,CAAC,YAAY,CAAC;YACnC,iBAAiB,CAAC,GAAG,CAAC,gBAAgB,CAAC;YACvC,iBAAiB,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;YACjC,IAAI,CAAC,cAAc,EACrB,CAAC;YACC,IAAI,CAAC,YAAY,EAAE,CAAC;QACxB,CAAC;IACL,CAAC;IAED;;OAEG;IACK,gBAAgB;QACpB,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC;YACtC,OAAO;QACX,CAAC;QAED,MAAM,GAAG,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QAC1C,IAAI,CAAC,GAAG,EAAE,CAAC;YACP,OAAO,CAAC,KAAK,CAAC,4CAA4C,CAAC,CAAC;YAC5D,OAAO;QACX,CAAC;QAED,MAAM,MAAM,GAAG,IAAI,CAAC,iBAAiB,EAAE,CAAC;QACxC,IAAI,CAAC,cAAc,GAAG,IAAI,KAAK,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC;QAE7C,IAAI,CAAC,QAAQ,CAAC;YACV,SAAS,EAAE,kBAAkB;YAC7B,SAAS,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE;SAC5C,CAAC,CAAC;IACP,CAAC;IAED;;OAEG;IACK,iBAAiB;QACrB,MAAM,aAAa,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QAE1C,OAAO;YACH,IAAI,EAAE,IAAI,CAAC,IAAiB;YAC5B,IAAI,EAAE,aAA0B;YAChC,OAAO,EAAE,IAAI,CAAC,aAAa,EAAE;SAChC,CAAC;IACN,CAAC;IAED;;OAEG;IACK,YAAY;QAChB,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;YACpC,OAAO,EAAE,MAAM,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC;QACxC,CAAC;QAED,MAAM,iBAAiB,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,KAAK,EAAE,EAAE;YAChE,MAAM,UAAU,GAAG,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC;YAC9C,MAAM,YAAY,GAAG,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;YAE7C,2DAA2D;YAC3D,IAAI,CAAC,KAAK,EAAE,UAAU,EAAE,WAAW,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;gBACvD,MAAM,UAAU,GAAG,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;gBACzE,MAAM,aAAa,GAAG,KAAK,CAAC,IAAI,CAC5B,EAAE,MAAM,EAAE,UAAU,EAAE,EACtB,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAChD,CAAC;gBAEF,OAAO;oBACH,GAAG,OAAO;oBACV,eAAe,EAAE,OAAO,CAAC,eAAe,IAAI,aAAa;oBACzD,WAAW,EAAE,OAAO,CAAC,WAAW,IAAI,SAAS;oBAC7C,WAAW,EAAE,OAAO,CAAC,WAAW,IAAI,CAAC;iBACxC,CAAC;YACN,CAAC;YAED,qCAAqC;YACrC,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;gBACvB,OAAO;oBACH,GAAG,OAAO;oBACV,eAAe,EAAE,OAAO,CAAC,eAAe,IAAI,GAAG,YAAY,IAAI;oBAC/D,WAAW,EAAE,OAAO,CAAC,WAAW,IAAI,YAAY;oBAChD,WAAW,EAAE,OAAO,CAAC,WAAW,IAAI,CAAC;oBACrC,IAAI,EAAE,OAAO,CAAC,IAAI,IAAI,KAAK;oBAC3B,OAAO,EAAE,OAAO,CAAC,OAAO,IAAI,GAAG;oBAC/B,WAAW,EAAE,OAAO,CAAC,WAAW,IAAI,CAAC;oBACrC,gBAAgB,EAAE,OAAO,CAAC,gBAAgB,IAAI,CAAC;iBAClD,CAAC;YACN,CAAC;YAED,iBAAiB;YACjB,IAAI,IAAI,CAAC,IAAI,KAAK,KAAK,EAAE,CAAC;gBACtB,OAAO;oBACH,GAAG,OAAO;oBACV,eAAe,EAAE,OAAO,CAAC,eAAe,IAAI,YAAY;oBACxD,WAAW,EAAE,OAAO,CAAC,WAAW,IAAI,YAAY;oBAChD,WAAW,EAAE,OAAO,CAAC,WAAW,IAAI,CAAC;oBACrC,YAAY,EAAE,CAAC;iBAClB,CAAC;YACN,CAAC;YAED,mBAAmB;YACnB,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;gBACxB,OAAO;oBACH,GAAG,OAAO;oBACV,eAAe,EAAE,OAAO,CAAC,eAAe,IAAI,GAAG,YAAY,IAAI;oBAC/D,WAAW,EAAE,OAAO,CAAC,WAAW,IAAI,YAAY;oBAChD,WAAW,EAAE,OAAO,CAAC,WAAW,IAAI,CAAC;oBACrC,oBAAoB,EAAE,YAAY;oBAClC,gBAAgB,EAAE,SAAS;iBAC9B,CAAC;YACN,CAAC;YAED,wCAAwC;YACxC,OAAO;gBACH,GAAG,OAAO;gBACV,eAAe,EAAE,OAAO,CAAC,eAAe,IAAI,YAAY;gBACxD,WAAW,EAAE,OAAO,CAAC,WAAW,IAAI,YAAY;aACnD,CAAC;QACN,CAAC,CAAC,CAAC;QAEH,OAAO;YACH,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,EAAE;YAC9B,QAAQ,EAAE,iBAAiB;SAC9B,CAAC;IACN,CAAC;IAED;;OAEG;IACK,aAAa;QACjB,MAAM,cAAc,GAAiB;YACjC,UAAU,EAAE,IAAI,CAAC,UAAU;YAC3B,mBAAmB,EAAE,IAAI,CAAC,mBAAmB;YAC7C,SAAS,EAAE,IAAI,CAAC,eAAe;gBAC3B,CAAC,CAAC,EAAE,QAAQ,EAAE,IAAI,CAAC,iBAAiB,EAAE;gBACtC,CAAC,CAAC,KAAK;YACX,OAAO,EAAE;gBACL,MAAM,EAAE;oBACJ,OAAO,EAAE,IAAI,CAAC,UAAU;oBACxB,QAAQ,EAAE,IAAI,CAAC,cAAc;oBAC7B,MAAM,EAAE;wBACJ,aAAa,EAAE,IAAI;wBACnB,OAAO,EAAE,EAAE;wBACX,IAAI,EAAE;4BACF,MAAM,EAAE,8BAA8B;4BACtC,IAAI,EAAE,EAAE;yBACX;qBACJ;iBACJ;gBACD,OAAO,EAAE;oBACL,OAAO,EAAE,IAAI;oBACb,eAAe,EAAE,SAAS;oBAC1B,SAAS,EAAE;wBACP,MAAM,EAAE,8BAA8B;wBACtC,IAAI,EAAE,EAAE;qBACX;oBACD,QAAQ,EAAE;wBACN,MAAM,EAAE,8BAA8B;wBACtC,IAAI,EAAE,EAAE;qBACX;oBACD,OAAO,EAAE,EAAE;oBACX,YAAY,EAAE,CAAC;oBACf,SAAS,EAAE;wBACP,KAAK,EAAE,CAAC,OAA+B,EAAE,EAAE;4BACvC,MAAM,KAAK,GAAG,OAAO,CAAC,OAAO,CAAC,KAAK,IAAI,EAAE,CAAC;4BAC1C,MAAM,KAAK,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,IAAI,OAAO,CAAC,MAAM,CAAC;4BACjD,OAAO,GAAG,KAAK,KAAK,KAAK,EAAE,CAAC;wBAChC,CAAC;qBACJ;iBACJ;aACJ;YACD,OAAO,EAAE,CAAC,KAAiB,EAAE,QAAyB,EAAE,KAAY,EAAE,EAAE;gBACpE,IAAI,CAAC,iBAAiB,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC;YACnD,CAAC;YACD,OAAO,EAAE,CAAC,KAAiB,EAAE,QAAyB,EAAE,KAAY,EAAE,EAAE;gBACpE,IAAI,CAAC,iBAAiB,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC;YACnD,CAAC;SACJ,CAAC;QAEF,+CAA+C;QAC/C,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;YAC1D,cAAsC,CAAC,MAAM,GAAG;gBAC7C,CAAC,EAAE;oBACC,IAAI,EAAE;wBACF,OAAO,EAAE,IAAI;wBACb,KAAK,EAAE,SAAS;qBACnB;oBACD,KAAK,EAAE;wBACH,IAAI,EAAE;4BACF,MAAM,EAAE,8BAA8B;4BACtC,IAAI,EAAE,EAAE;yBACX;wBACD,KAAK,EAAE,SAAS;qBACnB;iBACJ;gBACD,CAAC,EAAE;oBACC,IAAI,EAAE;wBACF,OAAO,EAAE,IAAI;wBACb,KAAK,EAAE,SAAS;qBACnB;oBACD,KAAK,EAAE;wBACH,IAAI,EAAE;4BACF,MAAM,EAAE,8BAA8B;4BACtC,IAAI,EAAE,EAAE;yBACX;wBACD,KAAK,EAAE,SAAS;qBACnB;oBACD,WAAW,EAAE,IAAI;iBACpB;aACJ,CAAC;QACN,CAAC;QAED,wCAAwC;QACxC,OAAO,IAAI,CAAC,UAAU,CAAC,cAAc,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;IACzD,CAAC;IAED;;OAEG;IACK,UAAU,CAAC,MAA+B,EAAE,MAA+B;QAC/E,MAAM,MAAM,GAAG,EAAE,GAAG,MAAM,EAAE,CAAC;QAE7B,KAAK,MAAM,GAAG,IAAI,MAAM,EAAE,CAAC;YACvB,IAAI,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,CAAC;gBACpD,IACI,MAAM,CAAC,GAAG,CAAC;oBACX,OAAO,MAAM,CAAC,GAAG,CAAC,KAAK,QAAQ;oBAC/B,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,EAC7B,CAAC;oBACC,MAAM,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,UAAU,CACxB,MAAM,CAAC,GAAG,CAA6B,IAAI,EAAE,EAC9C,MAAM,CAAC,GAAG,CAA4B,CACzC,CAAC;gBACN,CAAC;qBAAM,CAAC;oBACJ,MAAM,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;gBAC9B,CAAC;YACL,CAAC;QACL,CAAC;QAED,OAAO,MAAsB,CAAC;IAClC,CAAC;IAED;;OAEG;IACK,YAAY;QAChB,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;YACvB,OAAO;QACX,CAAC;QAED,MAAM,aAAa,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QAC1C,IAAI,CAAC,cAAc,CAAC,IAAI,GAAG,aAA0B,CAAC;QACtD,IAAI,CAAC,cAAc,CAAC,OAAO,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC;QACnD,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;IAC1E,CAAC;IAED;;OAEG;IACK,aAAa;QACjB,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACtB,IAAI,CAAC,cAAc,CAAC,OAAO,EAAE,CAAC;YAC9B,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;QAC/B,CAAC;IACL,CAAC;IAED;;OAEG;IACK,iBAAiB,CAAC,KAAiB,EAAE,QAAyB,EAAE,KAAY;QAChF,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACtB,MAAM,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;YAC5B,MAAM,YAAY,GAAG,OAAO,CAAC,YAAY,CAAC;YAC1C,MAAM,SAAS,GAAG,OAAO,CAAC,KAAK,CAAC;YAChC,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC;YACjD,MAAM,KAAK,GAAG,OAAO,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;YACvC,MAAM,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,SAAS,CAAC,CAAC;YAE5C,MAAM,MAAM,GAAyB;gBACjC,KAAK;gBACL,QAAQ;gBACR,KAAK;gBACL,SAAS;gBACT,YAAY;gBACZ,KAAK;gBACL,KAAK;aACR,CAAC;YACF,+DAA+D;YAC/D,IAAI,CAAC,QAAQ,CAAC,EAAC,SAAS,EAAE,kBAAkB,EAAC,SAAS,EAAE,MAAM,EAAC,CAAC,CAAC;QACrE,CAAC;IACL,CAAC;IAED;;OAEG;IACK,iBAAiB,CAAC,KAAiB,EAAE,QAAyB,EAAE,KAAY;QAChF,sBAAsB;QACtB,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC;QAC5B,MAAM,CAAC,KAAK,CAAC,MAAM,GAAG,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC;QAElE,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACtB,MAAM,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;YAC5B,MAAM,YAAY,GAAG,OAAO,CAAC,YAAY,CAAC;YAC1C,MAAM,SAAS,GAAG,OAAO,CAAC,KAAK,CAAC;YAChC,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC;YACjD,MAAM,KAAK,GAAG,OAAO,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;YACvC,MAAM,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,SAAS,CAAC,CAAC;YAE5C,MAAM,MAAM,GAAyB;gBACjC,KAAK;gBACL,QAAQ;gBACR,KAAK;gBACL,SAAS;gBACT,YAAY;gBACZ,KAAK;gBACL,KAAK;aACR,CAAC;YACF,+DAA+D;YAC/D,IAAI,CAAC,QAAQ,CAAC,EAAC,SAAS,EAAE,kBAAkB,EAAC,SAAS,EAAE,MAAM,EAAC,CAAC,CAAC;QACrE,CAAC;IACL,CAAC;IAED;;OAEG;IACI,gBAAgB;QACnB,OAAO,IAAI,CAAC,cAAc,CAAC;IAC/B,CAAC;IAED;;OAEG;IACI,OAAO;QACV,IAAI,CAAC,aAAa,EAAE,CAAC;QACrB,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAC5B,CAAC;IAED;;OAEG;IACI,aAAa,CAAC,WAAmB,WAAW;QAC/C,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;YACvB,OAAO;QACX,CAAC;QAED,MAAM,GAAG,GAAG,IAAI,CAAC,cAAc,CAAC,aAAa,EAAE,CAAC;QAChD,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;QACzC,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;QACzB,IAAI,CAAC,IAAI,GAAG,GAAG,CAAC;QAChB,IAAI,CAAC,KAAK,EAAE,CAAC;IACjB,CAAC;IAED,MAAM;QACF,MAAM,kBAAkB,GAAG,IAAI,CAAC,mBAAmB,CAAC,cAAc,EAAE;YAChE,uBAAuB,EAAE,IAAI,CAAC,OAAO;SACxC,CAAC,CAAC;QAEH,MAAM,cAAc,GAAG;qBACV,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC,MAAM;sBACtC,IAAI,CAAC,MAAM;SACxB,CAAC;QAEF,OAAO,IAAI,CAAA;0BACO,kBAAkB,YAAY,cAAc;kBACpD,IAAI,CAAC,OAAO;YACV,CAAC,CAAC,IAAI,CAAA;;;;;qBAKL;YACD,CAAC,CAAC,IAAI,CAAA;;;0CAGgB,IAAI,CAAC,SAAS;;qBAGxC;;SAEP,CAAC;IACN,CAAC;;AAriBM,gBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAOzB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uCACC;AAO5B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;uCACN;AAOvC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;0CAClB;AAQ3B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCACZ;AAQf;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yCACN;AAOrB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,uBAAuB,EAAE,CAAC;sDAC5B;AAOpC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CACD;AAO3B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0CAClB;AAOzB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;4CACxB;AAO5B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,CAAC;6CAC3B;AAO3B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,iBAAiB,EAAE,CAAC;iDACG;AAO5D;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC;kDAC3B;AAOhC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,oBAAoB,EAAE,CAAC;oDAC5B;AAMhC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;yCAU1C;AAMM;IADP,KAAK,EAAE;iDACoC;AAMpC;IADP,KAAK,EAAE;+CAC8B;AAM9B;IADP,KAAK,CAAC,QAAQ,CAAC;0CACoB;AA0axC,IAAI,cAAc,CAAC,GAAG,CAAC,YAAY,CAAC,KAAK,SAAS,EAAE,CAAC;IACjD,cAAc,CAAC,MAAM,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC;AACnD,CAAC;AAQD,eAAe,SAAS,CAAC","sourcesContent":["import { html, PropertyValues } from 'lit';\nimport { property, state, query } from 'lit/decorators.js';\nimport { Cre8Element } from '../cre8-element';\nimport {\n Chart,\n ChartType,\n ChartData,\n ChartOptions,\n ChartConfiguration,\n registerables,\n ChartEvent,\n ActiveElement,\n TooltipItem,\n} from 'chart.js';\nimport styles from './chart.styles.js';\n\n// Register all Chart.js components\nChart.register(...registerables);\n\n/*\n Chart type definitions for all supported Chart.js types\n /\nexport type Cre8ChartType =\n \| 'line'\n \| 'bar'\n \| 'pie'\n \| 'doughnut'\n \| 'radar'\n \| 'polarArea'\n \| 'bubble'\n \| 'scatter';\n\n/\n Chart dataset configuration with proper typing\n /\nexport interface Cre8ChartDataset {\n label?: string;\n data: number[] \| { x: number; y: number; r?: number }[];\n backgroundColor?: string \| string[];\n borderColor?: string \| string[];\n borderWidth?: number;\n fill?: boolean;\n tension?: number;\n pointRadius?: number;\n pointHoverRadius?: number;\n hoverBackgroundColor?: string \| string[];\n hoverBorderColor?: string \| string[];\n [key: string]: unknown;\n}\n\n/\n Chart data configuration\n /\nexport interface Cre8ChartData {\n labels?: string[];\n datasets: Cre8ChartDataset[];\n}\n\n/\n Event detail for chart interactions\n /\nexport interface Cre8ChartEventDetail {\n event: ChartEvent;\n elements: ActiveElement[];\n chart: Chart;\n dataIndex?: number;\n datasetIndex?: number;\n value?: number \| { x: number; y: number; r?: number };\n label?: string;\n}\n\n/\n A flexible chart component built on Chart.js that supports multiple chart types\n * including line, bar, pie, doughnut, radar, polar area, bubble, and scatter charts.\n \n ## Features\n * - Supports all major Chart.js chart types\n * - Reactive updates when data or options change\n * - Customizable colors that integrate with cre8 design tokens\n * - Responsive sizing\n * - Loading state indicator\n * - Event callbacks for click and hover interactions\n * - Accessible with ARIA labels\n \n ## Usage\n \n ```html\n * <cre8-chart\n * type=\"bar\"\n * .data=${{ labels: ['A', 'B', 'C'], datasets: [{ label: 'Sales', data: [10, 20, 30] }] }}\n * .options=${{ responsive: true }}\n * ></cre8-chart>\n * ```\n \n @fires cre8-chart-click - Fired when a chart element is clicked\n * @fires cre8-chart-hover - Fired when hovering over chart elements\n * @fires cre8-chart-ready - Fired when the chart is initialized\n /\nexport class Cre8Chart extends Cre8Element {\n static styles = [styles];\n\n /\n The type of chart to render.\n * @attr type\n /\n @property({ type: String })\n type: Cre8ChartType = 'bar';\n\n /\n The chart data including labels and datasets.\n * This should be an object with `labels` array and `datasets` array.\n /\n @property({ type: Object, attribute: false })\n data: Cre8ChartData = { datasets: [] };\n\n /\n Chart.js configuration options.\n * See Chart.js documentation for all available options.\n /\n @property({ type: Object, attribute: false })\n options: ChartOptions = {};\n\n /\n Width of the chart container in pixels.\n * If not set, the chart will be responsive.\n * @attr width\n /\n @property({ type: Number })\n width?: number;\n\n /\n Height of the chart container in pixels.\n * If not set, defaults to 400px.\n * @attr height\n /\n @property({ type: Number })\n height: number = 400;\n\n /\n Whether the chart should maintain aspect ratio when resizing.\n * @attr maintain-aspect-ratio\n /\n @property({ type: Boolean, attribute: 'maintain-aspect-ratio' })\n maintainAspectRatio: boolean = true;\n\n /\n Whether the chart should be responsive to container size.\n * @attr responsive\n /\n @property({ type: Boolean })\n responsive: boolean = true;\n\n /\n Display a loading indicator instead of the chart.\n * @attr loading\n /\n @property({ type: Boolean, reflect: true })\n loading: boolean = false;\n\n /\n Accessible label for the chart.\n * @attr aria-label\n /\n @property({ type: String, attribute: 'aria-label' })\n ariaLabel: string = 'Chart';\n\n /\n Whether to show the legend.\n * @attr show-legend\n /\n @property({ type: Boolean, attribute: 'show-legend' })\n showLegend: boolean = true;\n\n /\n Position of the legend.\n * @attr legend-position\n /\n @property({ type: String, attribute: 'legend-position' })\n legendPosition: 'top' \| 'bottom' \| 'left' \| 'right' = 'top';\n\n /\n Whether to animate chart updates.\n * @attr enable-animation\n /\n @property({ type: Boolean, attribute: 'enable-animation' })\n enableAnimation: boolean = true;\n\n /\n Animation duration in milliseconds.\n * @attr animation-duration\n /\n @property({ type: Number, attribute: 'animation-duration' })\n animationDuration: number = 750;\n\n /\n Default colors for datasets (uses cre8 design token colors).\n /\n @property({ type: Array, attribute: false })\n colors: string[] = [\n '#0066B3', // Primary blue\n '#00A3E0', // Accent cyan\n '#059669', // Success green\n '#D97706', // Warning orange\n '#DC2626', // Error red\n '#7C3AED', // Purple\n '#DB2777', // Pink\n '#0891B2', // Teal\n ];\n\n /\n Internal chart instance reference.\n /\n @state()\n private _chartInstance: Chart \| null = null;\n\n /\n Internal state tracking if component is connected.\n /\n @state()\n private _isConnected: boolean = false;\n\n /\n Reference to the canvas element.\n /\n @query('canvas')\n private _canvas!: HTMLCanvasElement;\n\n connectedCallback() {\n super.connectedCallback();\n this._isConnected = true;\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this._isConnected = false;\n this._destroyChart();\n }\n\n protected firstUpdated(_changedProperties: PropertyValues) {\n super.firstUpdated(_changedProperties);\n if (!this.loading) {\n this._initializeChart();\n }\n }\n\n protected updated(changedProperties: PropertyValues) {\n super.updated(changedProperties);\n\n // If loading state changed to false, initialize chart\n if (changedProperties.has('loading') && !this.loading && !this._chartInstance) {\n this._initializeChart();\n return;\n }\n\n // If loading, don't update chart\n if (this.loading) {\n return;\n }\n\n // Check if we need to recreate the chart (type changed)\n if (changedProperties.has('type') && this._chartInstance) {\n this._destroyChart();\n this._initializeChart();\n return;\n }\n\n // Update existing chart if data or options changed\n if (\n (changedProperties.has('data') \|\|\n changedProperties.has('options') \|\|\n changedProperties.has('showLegend') \|\|\n changedProperties.has('legendPosition') \|\|\n changedProperties.has('colors')) &&\n this._chartInstance\n ) {\n this._updateChart();\n }\n }\n\n /\n Initialize the Chart.js instance.\n /\n private _initializeChart() {\n if (!this._canvas \|\| !this._isConnected) {\n return;\n }\n\n const ctx = this._canvas.getContext('2d');\n if (!ctx) {\n console.error('Cre8Chart: Unable to get canvas 2D context');\n return;\n }\n\n const config = this._buildChartConfig();\n this._chartInstance = new Chart(ctx, config);\n\n this.dispatch({\n eventName: 'cre8-chart-ready',\n detailObj: { chart: this._chartInstance },\n });\n }\n\n /\n Build the complete Chart.js configuration.\n /\n private _buildChartConfig(): ChartConfiguration {\n const processedData = this._processData();\n\n return {\n type: this.type as ChartType,\n data: processedData as ChartData,\n options: this._mergeOptions(),\n };\n }\n\n /\n Process chart data and apply default colors.\n /\n private _processData(): Cre8ChartData {\n if (!this.data \|\| !this.data.datasets) {\n return { labels: [], datasets: [] };\n }\n\n const processedDatasets = this.data.datasets.map((dataset, index) => {\n const colorIndex = index % this.colors.length;\n const defaultColor = this.colors[colorIndex];\n\n // For pie/doughnut/polarArea, apply colors to each segment\n if (['pie', 'doughnut', 'polarArea'].includes(this.type)) {\n const dataLength = Array.isArray(dataset.data) ? dataset.data.length : 0;\n const segmentColors = Array.from(\n { length: dataLength },\n (_, i) => this.colors[i % this.colors.length]\n );\n\n return {\n ...dataset,\n backgroundColor: dataset.backgroundColor \|\| segmentColors,\n borderColor: dataset.borderColor \|\| '#ffffff',\n borderWidth: dataset.borderWidth ?? 2,\n };\n }\n\n // For line charts, add some defaults\n if (this.type === 'line') {\n return {\n ...dataset,\n backgroundColor: dataset.backgroundColor \|\| `${defaultColor}20`,\n borderColor: dataset.borderColor \|\| defaultColor,\n borderWidth: dataset.borderWidth ?? 2,\n fill: dataset.fill ?? false,\n tension: dataset.tension ?? 0.4,\n pointRadius: dataset.pointRadius ?? 4,\n pointHoverRadius: dataset.pointHoverRadius ?? 6,\n };\n }\n\n // For bar charts\n if (this.type === 'bar') {\n return {\n ...dataset,\n backgroundColor: dataset.backgroundColor \|\| defaultColor,\n borderColor: dataset.borderColor \|\| defaultColor,\n borderWidth: dataset.borderWidth ?? 0,\n borderRadius: 4,\n };\n }\n\n // For radar charts\n if (this.type === 'radar') {\n return {\n ...dataset,\n backgroundColor: dataset.backgroundColor \|\| `${defaultColor}40`,\n borderColor: dataset.borderColor \|\| defaultColor,\n borderWidth: dataset.borderWidth ?? 2,\n pointBackgroundColor: defaultColor,\n pointBorderColor: '#ffffff',\n };\n }\n\n // Default styling for other chart types\n return {\n ...dataset,\n backgroundColor: dataset.backgroundColor \|\| defaultColor,\n borderColor: dataset.borderColor \|\| defaultColor,\n };\n });\n\n return {\n labels: this.data.labels \|\| [],\n datasets: processedDatasets,\n };\n }\n\n /\n Merge user options with default options.\n /\n private _mergeOptions(): ChartOptions {\n const defaultOptions: ChartOptions = {\n responsive: this.responsive,\n maintainAspectRatio: this.maintainAspectRatio,\n animation: this.enableAnimation\n ? { duration: this.animationDuration }\n : false,\n plugins: {\n legend: {\n display: this.showLegend,\n position: this.legendPosition,\n labels: {\n usePointStyle: true,\n padding: 16,\n font: {\n family: 'Inter, system-ui, sans-serif',\n size: 12,\n },\n },\n },\n tooltip: {\n enabled: true,\n backgroundColor: '#1F2937',\n titleFont: {\n family: 'Inter, system-ui, sans-serif',\n size: 13,\n },\n bodyFont: {\n family: 'Inter, system-ui, sans-serif',\n size: 12,\n },\n padding: 12,\n cornerRadius: 8,\n callbacks: {\n label: (context: TooltipItem<ChartType>) => {\n const label = context.dataset.label \|\| '';\n const value = context.parsed.y ?? context.parsed;\n return `${label}: ${value}`;\n },\n },\n },\n },\n onClick: (event: ChartEvent, elements: ActiveElement[], chart: Chart) => {\n this._handleChartClick(event, elements, chart);\n },\n onHover: (event: ChartEvent, elements: ActiveElement[], chart: Chart) => {\n this._handleChartHover(event, elements, chart);\n },\n };\n\n // Add scale options for charts that use scales\n if (['line', 'bar', 'scatter', 'bubble'].includes(this.type)) {\n (defaultOptions as ChartOptions<'bar'>).scales = {\n x: {\n grid: {\n display: true,\n color: '#E5E7EB',\n },\n ticks: {\n font: {\n family: 'Inter, system-ui, sans-serif',\n size: 11,\n },\n color: '#6B7280',\n },\n },\n y: {\n grid: {\n display: true,\n color: '#E5E7EB',\n },\n ticks: {\n font: {\n family: 'Inter, system-ui, sans-serif',\n size: 11,\n },\n color: '#6B7280',\n },\n beginAtZero: true,\n },\n };\n }\n\n // Deep merge user options with defaults\n return this._deepMerge(defaultOptions, this.options);\n }\n\n /\n Deep merge two objects.\n /\n private _deepMerge(target: Record<string, unknown>, source: Record<string, unknown>): ChartOptions {\n const output = { ...target };\n\n for (const key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n if (\n source[key] &&\n typeof source[key] === 'object' &&\n !Array.isArray(source[key])\n ) {\n output[key] = this._deepMerge(\n (target[key] as Record<string, unknown>) \|\| {},\n source[key] as Record<string, unknown>\n );\n } else {\n output[key] = source[key];\n }\n }\n }\n\n return output as ChartOptions;\n }\n\n /\n Update the existing chart with new data/options.\n /\n private _updateChart() {\n if (!this._chartInstance) {\n return;\n }\n\n const processedData = this._processData();\n this._chartInstance.data = processedData as ChartData;\n this._chartInstance.options = this._mergeOptions();\n this._chartInstance.update(this.enableAnimation ? 'default' : 'none');\n }\n\n /\n Destroy the chart instance.\n /\n private _destroyChart() {\n if (this._chartInstance) {\n this._chartInstance.destroy();\n this._chartInstance = null;\n }\n }\n\n /\n Handle chart click events.\n /\n private _handleChartClick(event: ChartEvent, elements: ActiveElement[], chart: Chart) {\n if (elements.length > 0) {\n const element = elements[0];\n const datasetIndex = element.datasetIndex;\n const dataIndex = element.index;\n const dataset = this.data.datasets[datasetIndex];\n const value = dataset?.data[dataIndex];\n const label = this.data.labels?.[dataIndex];\n\n const detail: Cre8ChartEventDetail = {\n event,\n elements,\n chart,\n dataIndex,\n datasetIndex,\n value,\n label,\n };\n // @ts-expect-error: `dispatch` is not defined on `Cre8Element`\n this.dispatch({eventName: 'cre8-chart-click',detailObj: detail});\n }\n }\n\n /\n Handle chart hover events.\n /\n private _handleChartHover(event: ChartEvent, elements: ActiveElement[], chart: Chart) {\n // Update cursor style\n const canvas = chart.canvas;\n canvas.style.cursor = elements.length > 0 ? 'pointer' : 'default';\n\n if (elements.length > 0) {\n const element = elements[0];\n const datasetIndex = element.datasetIndex;\n const dataIndex = element.index;\n const dataset = this.data.datasets[datasetIndex];\n const value = dataset?.data[dataIndex];\n const label = this.data.labels?.[dataIndex];\n\n const detail: Cre8ChartEventDetail = {\n event,\n elements,\n chart,\n dataIndex,\n datasetIndex,\n value,\n label,\n };\n // @ts-expect-error: `dispatch` is not defined on `Cre8Element`\n this.dispatch({eventName: 'cre8-chart-hover',detailObj: detail});\n }\n }\n\n /\n Public method to get the Chart.js instance.\n /\n public getChartInstance(): Chart \| null {\n return this._chartInstance;\n }\n\n /\n Public method to force refresh the chart.\n /\n public refresh() {\n this._destroyChart();\n this._initializeChart();\n }\n\n /\n Public method to download chart as image.\n */\n public downloadImage(filename: string = 'chart.png') {\n if (!this._chartInstance) {\n return;\n }\n\n const url = this._chartInstance.toBase64Image();\n const link = document.createElement('a');\n link.download = filename;\n link.href = url;\n link.click();\n }\n\n render() {\n const componentClassName = this.componentClassNames('cre8-c-chart', {\n 'cre8-c-chart--loading': this.loading,\n });\n\n const containerStyle = `\n width: ${this.width ? `${this.width}px` : '100%'};\n height: ${this.height}px;\n `;\n\n return html`\n <div class=\"${componentClassName}\" style=\"${containerStyle}\">\n ${this.loading\n ? html`\n <div class=\"cre8-c-chart__loading\">\n <div class=\"cre8-c-chart__spinner\"></div>\n <span class=\"cre8-c-chart__loading-text\">Loading chart...</span>\n </div>\n `\n : html`\n <canvas\n role=\"img\"\n aria-label=\"${this.ariaLabel}\"\n ></canvas>\n `\n }\n </div>\n `;\n }\n}\n\nif (customElements.get('cre8-chart') === undefined) {\n customElements.define('cre8-chart', Cre8Chart);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'cre8-chart': Cre8Chart;\n }\n}\n\nexport default Cre8Chart;\n"]}
1	+ {"version":3,"file":"chart.js","sourceRoot":"","sources":["../../../components/chart/chart.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, PropertyValues } from 'lit';\nimport { property, state, query } from 'lit/decorators.js';\nimport { Cre8Element } from '../cre8-element';\nimport {\n Chart,\n ChartType,\n ChartData,\n ChartOptions,\n ChartConfiguration,\n registerables,\n ChartEvent,\n ActiveElement,\n TooltipItem,\n} from 'chart.js';\nimport styles from './chart.styles.js';\n\n// Register all Chart.js components\nChart.register(...registerables);\n\n/*\n Chart type definitions for all supported Chart.js types\n /\nexport type Cre8ChartType =\n \| 'line'\n \| 'bar'\n \| 'pie'\n \| 'doughnut'\n \| 'radar'\n \| 'polarArea'\n \| 'bubble'\n \| 'scatter';\n\n/\n Chart dataset configuration with proper typing\n /\nexport interface Cre8ChartDataset {\n label?: string;\n data: number[] \| { x: number; y: number; r?: number }[];\n backgroundColor?: string \| string[];\n borderColor?: string \| string[];\n borderWidth?: number;\n fill?: boolean;\n tension?: number;\n pointRadius?: number;\n pointHoverRadius?: number;\n hoverBackgroundColor?: string \| string[];\n hoverBorderColor?: string \| string[];\n [key: string]: unknown;\n}\n\n/\n Chart data configuration\n /\nexport interface Cre8ChartData {\n labels?: string[];\n datasets: Cre8ChartDataset[];\n}\n\n/\n Event detail for chart interactions\n /\nexport interface Cre8ChartEventDetail {\n event: ChartEvent;\n elements: ActiveElement[];\n chart: Chart;\n dataIndex?: number;\n datasetIndex?: number;\n value?: number \| { x: number; y: number; r?: number };\n label?: string;\n}\n\n/\n A flexible chart component built on Chart.js that supports multiple chart types\n * including line, bar, pie, doughnut, radar, polar area, bubble, and scatter charts.\n \n ## Features\n * - Supports all major Chart.js chart types\n * - Reactive updates when data or options change\n * - Customizable colors that integrate with cre8 design tokens\n * - Responsive sizing\n * - Loading state indicator\n * - Event callbacks for click and hover interactions\n * - Accessible with ARIA labels\n \n ## Usage\n \n ```html\n * <cre8-chart\n * type=\"bar\"\n * .data=${{ labels: ['A', 'B', 'C'], datasets: [{ label: 'Sales', data: [10, 20, 30] }] }}\n * .options=${{ responsive: true }}\n * ></cre8-chart>\n * ```\n \n @fires chart-click - Fired when a chart element is clicked\n * @fires chart-hover - Fired when hovering over chart elements\n * @fires chart-ready - Fired when the chart is initialized\n /\nexport class Cre8Chart extends Cre8Element {\n static styles = [styles];\n\n /\n The type of chart to render.\n * @attr type\n /\n @property({ type: String })\n type: Cre8ChartType = 'bar';\n\n /\n The chart data including labels and datasets.\n * This should be an object with `labels` array and `datasets` array.\n /\n @property({ type: Object, attribute: false })\n data: Cre8ChartData = { datasets: [] };\n\n /\n Chart.js configuration options.\n * See Chart.js documentation for all available options.\n /\n @property({ type: Object, attribute: false })\n options: ChartOptions = {};\n\n /\n Width of the chart container in pixels.\n * If not set, the chart will be responsive.\n * @attr width\n /\n @property({ type: Number })\n width?: number;\n\n /\n Height of the chart container in pixels.\n * If not set, defaults to 400px.\n * @attr height\n /\n @property({ type: Number })\n height: number = 400;\n\n /\n Whether the chart should maintain aspect ratio when resizing.\n * @attr maintain-aspect-ratio\n /\n @property({ type: Boolean, attribute: 'maintain-aspect-ratio' })\n maintainAspectRatio: boolean = true;\n\n /\n Whether the chart should be responsive to container size.\n * @attr responsive\n /\n @property({ type: Boolean })\n responsive: boolean = true;\n\n /\n Display a loading indicator instead of the chart.\n * @attr loading\n /\n @property({ type: Boolean, reflect: true })\n loading: boolean = false;\n\n /\n Accessible label for the chart.\n * @attr aria-label\n /\n @property({ type: String, attribute: 'aria-label' })\n ariaLabel: string = 'Chart';\n\n /\n Whether to show the legend.\n * @attr show-legend\n /\n @property({ type: Boolean, attribute: 'show-legend' })\n showLegend: boolean = true;\n\n /\n Position of the legend.\n * @attr legend-position\n /\n @property({ type: String, attribute: 'legend-position' })\n legendPosition: 'top' \| 'bottom' \| 'left' \| 'right' = 'top';\n\n /\n Whether to animate chart updates.\n * @attr enable-animation\n /\n @property({ type: Boolean, attribute: 'enable-animation' })\n enableAnimation: boolean = true;\n\n /\n Animation duration in milliseconds.\n * @attr animation-duration\n /\n @property({ type: Number, attribute: 'animation-duration' })\n animationDuration: number = 750;\n\n /\n Default colors for datasets (uses cre8 design token colors).\n /\n @property({ type: Array, attribute: false })\n colors: string[] = [\n '#0066B3', // Primary blue\n '#00A3E0', // Accent cyan\n '#059669', // Success green\n '#D97706', // Warning orange\n '#DC2626', // Error red\n '#7C3AED', // Purple\n '#DB2777', // Pink\n '#0891B2', // Teal\n ];\n\n /\n Internal chart instance reference.\n /\n @state()\n private _chartInstance: Chart \| null = null;\n\n /\n Internal state tracking if component is connected.\n /\n @state()\n private _isConnected: boolean = false;\n\n /\n Reference to the canvas element.\n /\n @query('canvas')\n private _canvas!: HTMLCanvasElement;\n\n connectedCallback() {\n super.connectedCallback();\n this._isConnected = true;\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this._isConnected = false;\n this._destroyChart();\n }\n\n protected firstUpdated(_changedProperties: PropertyValues) {\n super.firstUpdated(_changedProperties);\n if (!this.loading) {\n this._initializeChart();\n }\n }\n\n protected updated(changedProperties: PropertyValues) {\n super.updated(changedProperties);\n\n // If loading state changed to false, initialize chart\n if (changedProperties.has('loading') && !this.loading && !this._chartInstance) {\n this._initializeChart();\n return;\n }\n\n // If loading, don't update chart\n if (this.loading) {\n return;\n }\n\n // Check if we need to recreate the chart (type changed)\n if (changedProperties.has('type') && this._chartInstance) {\n this._destroyChart();\n this._initializeChart();\n return;\n }\n\n // Update existing chart if data or options changed\n if (\n (changedProperties.has('data') \|\|\n changedProperties.has('options') \|\|\n changedProperties.has('showLegend') \|\|\n changedProperties.has('legendPosition') \|\|\n changedProperties.has('colors')) &&\n this._chartInstance\n ) {\n this._updateChart();\n }\n }\n\n /\n Initialize the Chart.js instance.\n /\n private _initializeChart() {\n if (!this._canvas \|\| !this._isConnected) {\n return;\n }\n\n const ctx = this._canvas.getContext('2d');\n if (!ctx) {\n console.error('Cre8Chart: Unable to get canvas 2D context');\n return;\n }\n\n const config = this._buildChartConfig();\n this._chartInstance = new Chart(ctx, config);\n\n this.dispatch({\n eventName: 'chart-ready',\n detailObj: { chart: this._chartInstance },\n });\n }\n\n /\n Build the complete Chart.js configuration.\n /\n private _buildChartConfig(): ChartConfiguration {\n const processedData = this._processData();\n\n return {\n type: this.type as ChartType,\n data: processedData as ChartData,\n options: this._mergeOptions(),\n };\n }\n\n /\n Process chart data and apply default colors.\n /\n private _processData(): Cre8ChartData {\n if (!this.data \|\| !this.data.datasets) {\n return { labels: [], datasets: [] };\n }\n\n const processedDatasets = this.data.datasets.map((dataset, index) => {\n const colorIndex = index % this.colors.length;\n const defaultColor = this.colors[colorIndex];\n\n // For pie/doughnut/polarArea, apply colors to each segment\n if (['pie', 'doughnut', 'polarArea'].includes(this.type)) {\n const dataLength = Array.isArray(dataset.data) ? dataset.data.length : 0;\n const segmentColors = Array.from(\n { length: dataLength },\n (_, i) => this.colors[i % this.colors.length]\n );\n\n return {\n ...dataset,\n backgroundColor: dataset.backgroundColor \|\| segmentColors,\n borderColor: dataset.borderColor \|\| '#ffffff',\n borderWidth: dataset.borderWidth ?? 2,\n };\n }\n\n // For line charts, add some defaults\n if (this.type === 'line') {\n return {\n ...dataset,\n backgroundColor: dataset.backgroundColor \|\| `${defaultColor}20`,\n borderColor: dataset.borderColor \|\| defaultColor,\n borderWidth: dataset.borderWidth ?? 2,\n fill: dataset.fill ?? false,\n tension: dataset.tension ?? 0.4,\n pointRadius: dataset.pointRadius ?? 4,\n pointHoverRadius: dataset.pointHoverRadius ?? 6,\n };\n }\n\n // For bar charts\n if (this.type === 'bar') {\n return {\n ...dataset,\n backgroundColor: dataset.backgroundColor \|\| defaultColor,\n borderColor: dataset.borderColor \|\| defaultColor,\n borderWidth: dataset.borderWidth ?? 0,\n borderRadius: 4,\n };\n }\n\n // For radar charts\n if (this.type === 'radar') {\n return {\n ...dataset,\n backgroundColor: dataset.backgroundColor \|\| `${defaultColor}40`,\n borderColor: dataset.borderColor \|\| defaultColor,\n borderWidth: dataset.borderWidth ?? 2,\n pointBackgroundColor: defaultColor,\n pointBorderColor: '#ffffff',\n };\n }\n\n // Default styling for other chart types\n return {\n ...dataset,\n backgroundColor: dataset.backgroundColor \|\| defaultColor,\n borderColor: dataset.borderColor \|\| defaultColor,\n };\n });\n\n return {\n labels: this.data.labels \|\| [],\n datasets: processedDatasets,\n };\n }\n\n /\n Merge user options with default options.\n /\n private _mergeOptions(): ChartOptions {\n const defaultOptions: ChartOptions = {\n responsive: this.responsive,\n maintainAspectRatio: this.maintainAspectRatio,\n animation: this.enableAnimation\n ? { duration: this.animationDuration }\n : false,\n plugins: {\n legend: {\n display: this.showLegend,\n position: this.legendPosition,\n labels: {\n usePointStyle: true,\n padding: 16,\n font: {\n family: 'Inter, system-ui, sans-serif',\n size: 12,\n },\n },\n },\n tooltip: {\n enabled: true,\n backgroundColor: '#1F2937',\n titleFont: {\n family: 'Inter, system-ui, sans-serif',\n size: 13,\n },\n bodyFont: {\n family: 'Inter, system-ui, sans-serif',\n size: 12,\n },\n padding: 12,\n cornerRadius: 8,\n callbacks: {\n label: (context: TooltipItem<ChartType>) => {\n const label = context.dataset.label \|\| '';\n const value = context.parsed.y ?? context.parsed;\n return `${label}: ${value}`;\n },\n },\n },\n },\n onClick: (event: ChartEvent, elements: ActiveElement[], chart: Chart) => {\n this._handleChartClick(event, elements, chart);\n },\n onHover: (event: ChartEvent, elements: ActiveElement[], chart: Chart) => {\n this._handleChartHover(event, elements, chart);\n },\n };\n\n // Add scale options for charts that use scales\n if (['line', 'bar', 'scatter', 'bubble'].includes(this.type)) {\n (defaultOptions as ChartOptions<'bar'>).scales = {\n x: {\n grid: {\n display: true,\n color: '#E5E7EB',\n },\n ticks: {\n font: {\n family: 'Inter, system-ui, sans-serif',\n size: 11,\n },\n color: '#6B7280',\n },\n },\n y: {\n grid: {\n display: true,\n color: '#E5E7EB',\n },\n ticks: {\n font: {\n family: 'Inter, system-ui, sans-serif',\n size: 11,\n },\n color: '#6B7280',\n },\n beginAtZero: true,\n },\n };\n }\n\n // Deep merge user options with defaults\n return this._deepMerge(defaultOptions, this.options);\n }\n\n /\n Deep merge two objects.\n /\n private _deepMerge(target: Record<string, unknown>, source: Record<string, unknown>): ChartOptions {\n const output = { ...target };\n\n for (const key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n if (\n source[key] &&\n typeof source[key] === 'object' &&\n !Array.isArray(source[key])\n ) {\n output[key] = this._deepMerge(\n (target[key] as Record<string, unknown>) \|\| {},\n source[key] as Record<string, unknown>\n );\n } else {\n output[key] = source[key];\n }\n }\n }\n\n return output as ChartOptions;\n }\n\n /\n Update the existing chart with new data/options.\n /\n private _updateChart() {\n if (!this._chartInstance) {\n return;\n }\n\n const processedData = this._processData();\n this._chartInstance.data = processedData as ChartData;\n this._chartInstance.options = this._mergeOptions();\n this._chartInstance.update(this.enableAnimation ? 'default' : 'none');\n }\n\n /\n Destroy the chart instance.\n /\n private _destroyChart() {\n if (this._chartInstance) {\n this._chartInstance.destroy();\n this._chartInstance = null;\n }\n }\n\n /\n Handle chart click events.\n /\n private _handleChartClick(event: ChartEvent, elements: ActiveElement[], chart: Chart) {\n if (elements.length > 0) {\n const element = elements[0];\n const datasetIndex = element.datasetIndex;\n const dataIndex = element.index;\n const dataset = this.data.datasets[datasetIndex];\n const value = dataset?.data[dataIndex];\n const label = this.data.labels?.[dataIndex];\n\n const detail: Cre8ChartEventDetail = {\n event,\n elements,\n chart,\n dataIndex,\n datasetIndex,\n value,\n label,\n };\n // @ts-expect-error: `dispatch` is not defined on `Cre8Element`\n this.dispatch({eventName: 'chart-click',detailObj: detail});\n }\n }\n\n /\n Handle chart hover events.\n /\n private _handleChartHover(event: ChartEvent, elements: ActiveElement[], chart: Chart) {\n // Update cursor style\n const canvas = chart.canvas;\n canvas.style.cursor = elements.length > 0 ? 'pointer' : 'default';\n\n if (elements.length > 0) {\n const element = elements[0];\n const datasetIndex = element.datasetIndex;\n const dataIndex = element.index;\n const dataset = this.data.datasets[datasetIndex];\n const value = dataset?.data[dataIndex];\n const label = this.data.labels?.[dataIndex];\n\n const detail: Cre8ChartEventDetail = {\n event,\n elements,\n chart,\n dataIndex,\n datasetIndex,\n value,\n label,\n };\n // @ts-expect-error: `dispatch` is not defined on `Cre8Element`\n this.dispatch({eventName: 'chart-hover',detailObj: detail});\n }\n }\n\n /\n Public method to get the Chart.js instance.\n /\n public getChartInstance(): Chart \| null {\n return this._chartInstance;\n }\n\n /\n Public method to force refresh the chart.\n /\n public refresh() {\n this._destroyChart();\n this._initializeChart();\n }\n\n /\n Public method to download chart as image.\n */\n public downloadImage(filename: string = 'chart.png') {\n if (!this._chartInstance) {\n return;\n }\n\n const url = this._chartInstance.toBase64Image();\n const link = document.createElement('a');\n link.download = filename;\n link.href = url;\n link.click();\n }\n\n render() {\n const componentClassName = this.componentClassNames('cre8-c-chart', {\n 'cre8-c-chart--loading': this.loading,\n });\n\n const containerStyle = `\n width: ${this.width ? `${this.width}px` : '100%'};\n height: ${this.height}px;\n `;\n\n return html`\n <div class=\"${componentClassName}\" style=\"${containerStyle}\">\n ${this.loading\n ? html`\n <div class=\"cre8-c-chart__loading\">\n <div class=\"cre8-c-chart__spinner\"></div>\n <span class=\"cre8-c-chart__loading-text\">Loading chart...</span>\n </div>\n `\n : html`\n <canvas\n role=\"img\"\n aria-label=\"${this.ariaLabel}\"\n ></canvas>\n `\n }\n </div>\n `;\n }\n}\n\nif (customElements.get('cre8-chart') === undefined) {\n customElements.define('cre8-chart', Cre8Chart);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'cre8-chart': Cre8Chart;\n }\n}\n\nexport default Cre8Chart;\n"]}

package/lib/components/checkbox-field/checkbox-field.d.ts CHANGED Viewed

@@ -1,5 +1,13 @@
 import { Cre8Element } from '../cre8-element';
 import '../field-note/field-note';
+/** One checkbox in a data-driven checkbox field. */
+export interface Cre8CheckboxItemData {
+    label: string;
+    value?: string;
+    checked?: boolean;
+    disabled?: boolean;
+    required?: boolean;
+}
 /**
  * Checkbox Field is the parent container for `checkbox-field-item`.
  * It is required to allow for grouping numerous checkboxes that need additional context (in the form of `<legend>`).
@@ -43,6 +51,17 @@ export declare class Cre8CheckboxField extends Cre8Element {
      */
     fieldNoteIsError?: boolean;
     connectedCallback(): void;
+    /**
+     * Checkboxes for a data-driven field. Each becomes a
+     * `cre8-checkbox-field-item`, sharing the field's `name` so they submit as a
+     * group.
+     */
+    items?: Cre8CheckboxItemData[];
+    /** Form control name shared by every generated item. */
+    name?: string;
+    /** The composition the data property stands for. */
+    private buildComposition;
+    protected updated(changed: Map<string, unknown>): void;
     render(): import("lit-html").TemplateResult<1>;
 }
 declare global {

package/lib/components/checkbox-field/checkbox-field.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"checkbox-field.d.ts","sourceRoot":"","sources":["../../../components/checkbox-field/checkbox-field.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;~~AAC9C~~,OAAO,0BAA0B,CAAC;AAGlC;;;;;;;;GAQG;~~AACH~~,qBAAa,iBAAkB,SAAQ,WAAW;IAC9C,MAAM,CAAC,MAAM,4BAAY;IAE3B;;OAEG;IAEC,KAAK,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IAEC,SAAS,CAAC,EAAE,MAAM,CAAC;IAEvB;;OAEG;IAEC,eAAe,CAAC,EAAE,MAAM,CAAC;IAE7B;;OAEG;IAEC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE/B;;;OAGG;IAEC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAEhC;;;OAGG;IAEC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAEjC;;;OAGG;IAEC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE/B,iBAAiB;~~IAOjB~~,MAAM;CAwBP;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,qBAAqB,EAAE,iBAAiB,CAAC;KAC1C;CACF;AAED,eAAe,iBAAiB,CAAC"}
1	+ {"version":3,"file":"checkbox-field.d.ts","sourceRoot":"","sources":["../../../components/checkbox-field/checkbox-field.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAE9C,OAAO,0BAA0B,CAAC;AAGlC,oDAAoD;AACpD,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;GAQG;AAEH,qBAAa,iBAAkB,SAAQ,WAAW;IAC9C,MAAM,CAAC,MAAM,4BAAY;IAE3B;;OAEG;IAEC,KAAK,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IAEC,SAAS,CAAC,EAAE,MAAM,CAAC;IAEvB;;OAEG;IAEC,eAAe,CAAC,EAAE,MAAM,CAAC;IAE7B;;OAEG;IAEC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE/B;;;OAGG;IAEC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAEhC;;;OAGG;IAEC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAEjC;;;OAGG;IAEC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE/B,iBAAiB;IAMjB;;;;OAIG;IAEC,KAAK,CAAC,EAAE,oBAAoB,EAAE,CAAC;IAEnC,wDAAwD;IAEpD,IAAI,CAAC,EAAE,MAAM,CAAC;IAElB,oDAAoD;IACpD,OAAO,CAAC,gBAAgB;IAexB,SAAS,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAOtD,MAAM;CAwBP;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,qBAAqB,EAAE,iBAAiB,CAAC;KAC1C;CACF;AAED,eAAe,iBAAiB,CAAC"}

package/lib/components/checkbox-field/checkbox-field.js CHANGED Viewed

@@ -9,6 +9,7 @@ import { ifDefined } from 'lit-html/directives/if-defined.js';
 import { property } from 'lit/decorators.js';
 import { nanoid } from 'nanoid';
 import { Cre8Element } from '../cre8-element';
+import { syncLightChildren } from '../utils/light-children';
 import '../field-note/field-note';
 import styles from './checkbox-field.styles.js';
 /**
@@ -27,6 +28,27 @@ export class Cre8CheckboxField extends Cre8Element {
             this.ariaDescribedBy = this.ariaDescribedBy || nanoid();
         }
     }
+    /** The composition the data property stands for. */
+    buildComposition() {
+        if (!this.items)
+            return null;
+        return this.items.map((item) => ({
+            tag: 'cre8-checkbox-field-item',
+            props: {
+                label: item.label,
+                value: item.value,
+                checked: item.checked,
+                disabled: item.disabled,
+                required: item.required,
+                name: this.name,
+            },
+        }));
+    }
+    updated(changed) {
+        if (['items', 'name'].some((key) => changed.has(key))) {
+            syncLightChildren(this, this.buildComposition());
+        }
+    }
     render() {
         const componentClassNames = this.componentClassNames('cre8-c-checkbox-field', {});
         return html `
@@ -73,6 +95,12 @@ __decorate([
 __decorate([
     property({ type: Boolean, reflect: true })
 ], Cre8CheckboxField.prototype, "fieldNoteIsError", void 0);
+__decorate([
+    property({ type: Array })
+], Cre8CheckboxField.prototype, "items", void 0);
+__decorate([
+    property()
+], Cre8CheckboxField.prototype, "name", void 0);
 if (customElements.get('cre8-checkbox-field') === undefined) {
     customElements.define('cre8-checkbox-field', Cre8CheckboxField);
 }

package/lib/components/checkbox-field/checkbox-field.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"checkbox-field.js","sourceRoot":"","sources":["../../../components/checkbox-field/checkbox-field.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,GAAI,MAAM,KAAK,CAAC;AAC7B,OAAO,EAAE,SAAS,EAAE,MAAM,mCAAmC,CAAC;AAC9D,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAChC,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,0BAA0B,CAAC;AAClC,OAAO,MAAM,MAAM,4BAA4B,CAAC;~~AAEhD~~;;;;;;;;GAQG;~~AACH~~,MAAM,OAAO,iBAAkB,SAAQ,WAAW;IAgDhD,iBAAiB;QACb,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACjB,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,eAAe,IAAI,MAAM,EAAE,CAAC;QAC5D,CAAC;IACL,CAAC;~~IAED~~,MAAM;QACF,MAAM,mBAAmB,GAAG,IAAI,CAAC,mBAAmB,CAAC,uBAAuB,EAAE,EAAE,CAAC,CAAC;QAElF,OAAO,IAAI,CAAA;yBACQ,mBAAmB,uBAAuB,SAAS,CAAC,IAAI,CAAC,eAAe,CAAC;sDAC5C,IAAI,CAAC,KAAK;;;;;;UAMtD,IAAI,CAAC,SAAS;YAChB,CAAC,CAAC,IAAI,CAAA;sBACQ,IAAI,CAAC,iBAAiB;eAC7B,SAAS,CAAC,IAAI,CAAC,eAAe,CAAC;qBACzB,SAAS,CAAC,IAAI,CAAC,iBAAiB,CAAC;uBAC/B,IAAI,CAAC,kBAAkB;qBACzB,IAAI,CAAC,gBAAgB;;YAE9B,IAAI,CAAC,SAAS;2BACC,CAAC,CAAC,CAAC,EAAE;;KAE3B,CAAC;IACJ,CAAC;;~~AA7EQ~~,wBAAM,GAAG,CAAC,MAAM,CAAC,CAAC;AAMvB;IADH,QAAQ,EAAE;gDACQ;AAMf;IADH,QAAQ,EAAE;oDACY;AAMnB;IADH,QAAQ,EAAE;0DACkB;AAMzB;IADH,QAAQ,EAAE;4DACoB;AAO3B;IADH,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;4DACX;AAO5B;IADH,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6DACV;AAO7B;IADH,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;2DACZ;~~AAmCjC~~,IAAI,cAAc,CAAC,GAAG,CAAC,qBAAqB,CAAC,KAAK,SAAS,EAAE,CAAC;IAC1D,cAAc,CAAC,MAAM,CAAC,qBAAqB,EAAE,iBAAiB,CAAC,CAAC;AACpE,CAAC;AAQD,eAAe,iBAAiB,CAAC","sourcesContent":["import { html, } from 'lit';\nimport { ifDefined } from 'lit-html/directives/if-defined.js';\nimport { property } from 'lit/decorators.js';\nimport { nanoid } from 'nanoid';\nimport { Cre8Element } from '../cre8-element';\nimport '../field-note/field-note';\nimport styles from './checkbox-field.styles.js';\n\n/*\n Checkbox Field is the parent container for `checkbox-field-item`.\n * It is required to allow for grouping numerous checkboxes that need additional context (in the form of `<legend>`).\n * It also provides accessibility roles, aria attributes and field note messaging on the group.\n \n See `checkbox-field-item` for more guidance on its usage.\n \n @slot - The component content, which should be a set of `checkbox-field-item`s\n /\nexport class Cre8CheckboxField extends Cre8Element {\n static styles = [styles];\n\n /\n Checkbox container legend label\n /\n @property()\n label?: string;\n\n /\n Checkbox container fieldnote\n /\n @property()\n fieldNote?: string;\n\n /\n Checkbox container fieldnote aria describe by\n /\n @property()\n ariaDescribedBy?: string;\n\n /\n Checkbox container fieldnote icon name\n /\n @property()\n fieldNoteIconName?: string;\n\n /\n Checkbox container fieldnote knockout\n * @attr {boolean}\n /\n @property({ type: Boolean, reflect: true })\n fieldNoteKnockout?: boolean;\n\n /\n Checkbox container fieldnote isSuccess\n * @attr {boolean}\n /\n @property({ type: Boolean, reflect: true })\n fieldNoteIsSuccess?: boolean;\n\n /\n Checkbox container fieldnote isError\n * @attr {boolean}\n */\n @property({ type: Boolean, reflect: true })\n fieldNoteIsError?: boolean;\n\n connectedCallback() {\n super.connectedCallback();\n if (this.fieldNote) {\n this.ariaDescribedBy = this.ariaDescribedBy \|\| nanoid();\n }\n }\n\n render() {\n const componentClassNames = this.componentClassNames('cre8-c-checkbox-field', {});\n\n return html`\n <fieldset class=\"${componentClassNames}\" aria-describedby=\"${ifDefined(this.ariaDescribedBy)}\">\n <legend class=\"cre8-c-checkbox-field__legend\">${this.label}</legend>\n <div class=\"cre8-c-checkbox-field__body\">\n <div class=\"cre8-c-checkbox-field__list\" role=\"list\">\n <slot></slot>\n </div>\n </div>\n ${this.fieldNote\n ? html`<cre8-field-note\n ?inverted=${this.fieldNoteKnockout}\n id=${ifDefined(this.ariaDescribedBy)}\n iconName=${ifDefined(this.fieldNoteIconName)}\n ?isSuccess=${this.fieldNoteIsSuccess}\n ?isError=${this.fieldNoteIsError}\n >\n ${this.fieldNote}\n </cre8-field-note>` : ''}\n </fieldset>\n `;\n }\n}\n\nif (customElements.get('cre8-checkbox-field') === undefined) {\n customElements.define('cre8-checkbox-field', Cre8CheckboxField);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'cre8-checkbox-field': Cre8CheckboxField;\n }\n}\n\nexport default Cre8CheckboxField;\n"]}
1	+ {"version":3,"file":"checkbox-field.js","sourceRoot":"","sources":["../../../components/checkbox-field/checkbox-field.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,GAAI,MAAM,KAAK,CAAC;AAC7B,OAAO,EAAE,SAAS,EAAE,MAAM,mCAAmC,CAAC;AAC9D,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAChC,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,iBAAiB,EAAkB,MAAM,yBAAyB,CAAC;AAC5E,OAAO,0BAA0B,CAAC;AAClC,OAAO,MAAM,MAAM,4BAA4B,CAAC;AAWhD;;;;;;;;GAQG;AAEH,MAAM,OAAO,iBAAkB,SAAQ,WAAW;IAgDhD,iBAAiB;QACb,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACjB,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,eAAe,IAAI,MAAM,EAAE,CAAC;QAC5D,CAAC;IACL,CAAC;IAaD,oDAAoD;IAC5C,gBAAgB;QACpB,IAAI,CAAC,IAAI,CAAC,KAAK;YAAE,OAAO,IAAI,CAAC;QAC7B,OAAO,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;YAC7B,GAAG,EAAE,0BAA0B;YAC/B,KAAK,EAAE;gBACH,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,OAAO,EAAE,IAAI,CAAC,OAAO;gBACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,IAAI,EAAE,IAAI,CAAC,IAAI;aAClB;SACJ,CAAC,CAAC,CAAC;IACR,CAAC;IAES,OAAO,CAAC,OAA6B;QAC3C,IAAI,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;YACpD,iBAAiB,CAAC,IAAI,EAAE,IAAI,CAAC,gBAAgB,EAAE,CAAC,CAAC;QACrD,CAAC;IACL,CAAC;IAGD,MAAM;QACF,MAAM,mBAAmB,GAAG,IAAI,CAAC,mBAAmB,CAAC,uBAAuB,EAAE,EAAE,CAAC,CAAC;QAElF,OAAO,IAAI,CAAA;yBACQ,mBAAmB,uBAAuB,SAAS,CAAC,IAAI,CAAC,eAAe,CAAC;sDAC5C,IAAI,CAAC,KAAK;;;;;;UAMtD,IAAI,CAAC,SAAS;YAChB,CAAC,CAAC,IAAI,CAAA;sBACQ,IAAI,CAAC,iBAAiB;eAC7B,SAAS,CAAC,IAAI,CAAC,eAAe,CAAC;qBACzB,SAAS,CAAC,IAAI,CAAC,iBAAiB,CAAC;uBAC/B,IAAI,CAAC,kBAAkB;qBACzB,IAAI,CAAC,gBAAgB;;YAE9B,IAAI,CAAC,SAAS;2BACC,CAAC,CAAC,CAAC,EAAE;;KAE3B,CAAC;IACJ,CAAC;;AA/GQ,wBAAM,GAAG,CAAC,MAAM,CAAC,CAAC;AAMvB;IADH,QAAQ,EAAE;gDACQ;AAMf;IADH,QAAQ,EAAE;oDACY;AAMnB;IADH,QAAQ,EAAE;0DACkB;AAMzB;IADH,QAAQ,EAAE;4DACoB;AAO3B;IADH,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;4DACX;AAO5B;IADH,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6DACV;AAO7B;IADH,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;2DACZ;AAc3B;IADH,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;gDACS;AAI/B;IADH,QAAQ,EAAE;+CACO;AAmDpB,IAAI,cAAc,CAAC,GAAG,CAAC,qBAAqB,CAAC,KAAK,SAAS,EAAE,CAAC;IAC1D,cAAc,CAAC,MAAM,CAAC,qBAAqB,EAAE,iBAAiB,CAAC,CAAC;AACpE,CAAC;AAQD,eAAe,iBAAiB,CAAC","sourcesContent":["import { html, } from 'lit';\nimport { ifDefined } from 'lit-html/directives/if-defined.js';\nimport { property } from 'lit/decorators.js';\nimport { nanoid } from 'nanoid';\nimport { Cre8Element } from '../cre8-element';\nimport { syncLightChildren, type ChildSpec } from '../utils/light-children';\nimport '../field-note/field-note';\nimport styles from './checkbox-field.styles.js';\n\n/** One checkbox in a data-driven checkbox field. /\nexport interface Cre8CheckboxItemData {\n label: string;\n value?: string;\n checked?: boolean;\n disabled?: boolean;\n required?: boolean;\n}\n\n/\n Checkbox Field is the parent container for `checkbox-field-item`.\n * It is required to allow for grouping numerous checkboxes that need additional context (in the form of `<legend>`).\n * It also provides accessibility roles, aria attributes and field note messaging on the group.\n \n See `checkbox-field-item` for more guidance on its usage.\n \n @slot - The component content, which should be a set of `checkbox-field-item`s\n /\n\nexport class Cre8CheckboxField extends Cre8Element {\n static styles = [styles];\n\n /\n Checkbox container legend label\n /\n @property()\n label?: string;\n\n /\n Checkbox container fieldnote\n /\n @property()\n fieldNote?: string;\n\n /\n Checkbox container fieldnote aria describe by\n /\n @property()\n ariaDescribedBy?: string;\n\n /\n Checkbox container fieldnote icon name\n /\n @property()\n fieldNoteIconName?: string;\n\n /\n Checkbox container fieldnote knockout\n * @attr {boolean}\n /\n @property({ type: Boolean, reflect: true })\n fieldNoteKnockout?: boolean;\n\n /\n Checkbox container fieldnote isSuccess\n * @attr {boolean}\n /\n @property({ type: Boolean, reflect: true })\n fieldNoteIsSuccess?: boolean;\n\n /\n Checkbox container fieldnote isError\n * @attr {boolean}\n /\n @property({ type: Boolean, reflect: true })\n fieldNoteIsError?: boolean;\n\n connectedCallback() {\n super.connectedCallback();\n if (this.fieldNote) {\n this.ariaDescribedBy = this.ariaDescribedBy \|\| nanoid();\n }\n }\n /\n Checkboxes for a data-driven field. Each becomes a\n * `cre8-checkbox-field-item`, sharing the field's `name` so they submit as a\n * group.\n /\n @property({ type: Array })\n items?: Cre8CheckboxItemData[];\n\n /* Form control name shared by every generated item. /\n @property()\n name?: string;\n\n /* The composition the data property stands for. */\n private buildComposition(): ChildSpec[] \| null {\n if (!this.items) return null;\n return this.items.map((item) => ({\n tag: 'cre8-checkbox-field-item',\n props: {\n label: item.label,\n value: item.value,\n checked: item.checked,\n disabled: item.disabled,\n required: item.required,\n name: this.name,\n },\n }));\n }\n\n protected updated(changed: Map<string, unknown>): void {\n if (['items', 'name'].some((key) => changed.has(key))) {\n syncLightChildren(this, this.buildComposition());\n }\n }\n\n\n render() {\n const componentClassNames = this.componentClassNames('cre8-c-checkbox-field', {});\n\n return html`\n <fieldset class=\"${componentClassNames}\" aria-describedby=\"${ifDefined(this.ariaDescribedBy)}\">\n <legend class=\"cre8-c-checkbox-field__legend\">${this.label}</legend>\n <div class=\"cre8-c-checkbox-field__body\">\n <div class=\"cre8-c-checkbox-field__list\" role=\"list\">\n <slot></slot>\n </div>\n </div>\n ${this.fieldNote\n ? html`<cre8-field-note\n ?inverted=${this.fieldNoteKnockout}\n id=${ifDefined(this.ariaDescribedBy)}\n iconName=${ifDefined(this.fieldNoteIconName)}\n ?isSuccess=${this.fieldNoteIsSuccess}\n ?isError=${this.fieldNoteIsError}\n >\n ${this.fieldNote}\n </cre8-field-note>` : ''}\n </fieldset>\n `;\n }\n}\n\nif (customElements.get('cre8-checkbox-field') === undefined) {\n customElements.define('cre8-checkbox-field', Cre8CheckboxField);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'cre8-checkbox-field': Cre8CheckboxField;\n }\n}\n\nexport default Cre8CheckboxField;\n"]}

package/lib/components/cre8-element.d.ts CHANGED Viewed

@@ -16,6 +16,17 @@ export interface Cre8Event extends Event {
         detailObj: DetailObj;
     };
 }
+/**
+ * Pre-normalization event names, keyed by their current name.
+ *
+ * Events were normalized to `component-action` kebab-case (see
+ * `agent-docs/CODE_GUIDELINES.md`). Every renamed event is dispatched twice —
+ * once under its current name, once under the legacy name — so existing
+ * listeners keep working for one major version.
+ *
+ * 1) Delete this map and `dispatchLegacyAlias` in the next major release.
+ */
+export declare const DEPRECATED_EVENT_ALIASES: Readonly<Record<string, string>>;
 /**
  * A base element.
  */
@@ -46,6 +57,14 @@ export declare class Cre8Element extends LitElement {
    * Dispatch a custom event.
    */
     dispatch({ e, eventName, detailObj, optionsObj, }: Cre8DispatchProps): CustomEvent;
+    /**
+   * Dispatch an event, followed by its pre-normalization alias if it has one.
+   * 1) Components that build their own event object should dispatch through
+   *    this instead of `dispatchEvent` so legacy listeners keep firing
+   * 2) The alias mirrors the original's propagation flags and detail, so a
+   *    legacy listener sees exactly what it saw before the rename
+   */
+    protected dispatchWithLegacyAlias<T extends Event>(event: T): T;
     /**
      * Example render, should not be used
      */

package/lib/components/cre8-element.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cre8-element.d.ts","sourceRoot":"","sources":["../../components/cre8-element.ts"],"names":[],"mappings":"AACA,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAEvC,MAAM,WAAW,SAAS;IACxB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,iBAAiB;IAChC,CAAC,CAAC,EAAE,KAAK,CAAC;IACV,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,UAAU,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;KAAE,CAAC;CACzC;AAED,MAAM,WAAW,SAAU,SAAQ,KAAK;IACtC,MAAM,EAAE;QACN,aAAa,EAAE,KAAK,CAAC;QACrB,SAAS,EAAE,SAAS,CAAC;KACtB,CAAC;CACH;AAED;;GAEG;AACH,qBAAa,WAAY,SAAQ,UAAU;IACzC;;;;;;;;OAQG;IACD,mBAAmB,CAAC,aAAa,EAAE,MAAM,EAAE,oBAAoB,KAAK;IAItE;;;;OAIG;IACD,SAAS,CAAC,QAAQ,EAAE,MAAM;IAI5B;;;;OAIG;IACD,YAAY,CAAC,QAAQ,EAAE,MAAM;IAO7B;;KAEC;IACD,QAAQ,CAAC,EACL,CAAC,EAAE,SAAS,EAAE,SAAc,EAAE,UAAe,GAChD,EAAE,iBAAiB,GAAG,WAAW;~~IAYpC~~;;OAEG;IACD,MAAM;CAGT"}
1	+ {"version":3,"file":"cre8-element.d.ts","sourceRoot":"","sources":["../../components/cre8-element.ts"],"names":[],"mappings":"AACA,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAEvC,MAAM,WAAW,SAAS;IACxB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,iBAAiB;IAChC,CAAC,CAAC,EAAE,KAAK,CAAC;IACV,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,UAAU,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;KAAE,CAAC;CACzC;AAED,MAAM,WAAW,SAAU,SAAQ,KAAK;IACtC,MAAM,EAAE;QACN,aAAa,EAAE,KAAK,CAAC;QACrB,SAAS,EAAE,SAAS,CAAC;KACtB,CAAC;CACH;AAED;;;;;;;;;GASG;AACH,eAAO,MAAM,wBAAwB,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAkBrE,CAAC;AAEF;;GAEG;AACH,qBAAa,WAAY,SAAQ,UAAU;IACzC;;;;;;;;OAQG;IACD,mBAAmB,CAAC,aAAa,EAAE,MAAM,EAAE,oBAAoB,KAAK;IAItE;;;;OAIG;IACD,SAAS,CAAC,QAAQ,EAAE,MAAM;IAI5B;;;;OAIG;IACD,YAAY,CAAC,QAAQ,EAAE,MAAM;IAO7B;;KAEC;IACD,QAAQ,CAAC,EACL,CAAC,EAAE,SAAS,EAAE,SAAc,EAAE,UAAe,GAChD,EAAE,iBAAiB,GAAG,WAAW;IAUlC;;;;;;KAMC;IACD,SAAS,CAAC,uBAAuB,CAAC,CAAC,SAAS,KAAK,EAAE,KAAK,EAAE,CAAC,GAAG,CAAC;IAqBjE;;OAEG;IACD,MAAM;CAGT"}

package/lib/components/cre8-element.js CHANGED Viewed

@@ -1,5 +1,34 @@
 import classnames from 'classnames';
 import { html, LitElement } from 'lit';
+/**
+ * Pre-normalization event names, keyed by their current name.
+ *
+ * Events were normalized to `component-action` kebab-case (see
+ * `agent-docs/CODE_GUIDELINES.md`). Every renamed event is dispatched twice —
+ * once under its current name, once under the legacy name — so existing
+ * listeners keep working for one major version.
+ *
+ * 1) Delete this map and `dispatchLegacyAlias` in the next major release.
+ */
+export const DEPRECATED_EVENT_ALIASES = {
+    'tab-change': 'tabChange',
+    'tab-select': 'tabSelected',
+    'modal-close': 'close-modal',
+    'popover-open': 'open',
+    'popover-close': 'close',
+    'tooltip-open': 'open',
+    'tooltip-close': 'close',
+    'multi-select-change': 'selectedItemsChange',
+    'remove-tag-click': 'removeTagClicked',
+    'percent-bar-left-action-click': 'leftActionButtonClick',
+    'dropdown-item-select': 'dropdown-item-selected',
+    'split-button-text-click': 'text-click',
+    'split-button-dropdown-click': 'dropdown-click',
+    'pagination-change': 'pagination.click',
+    'chart-click': 'cre8-chart-click',
+    'chart-hover': 'cre8-chart-hover',
+    'chart-ready': 'cre8-chart-ready',
+};
 /**
  * A base element.
  */
@@ -45,8 +74,28 @@ export class Cre8Element extends LitElement {
             ...optionsObj,
             detail: { ...(e && { originalEvent: e }), ...detailObj },
         };
-        const event = new CustomEvent(eventName, options);
-        this.dispatchEvent(event);
+        return this.dispatchWithLegacyAlias(new CustomEvent(eventName, options));
+    }
+    /**
+   * Dispatch an event, followed by its pre-normalization alias if it has one.
+   * 1) Components that build their own event object should dispatch through
+   *    this instead of `dispatchEvent` so legacy listeners keep firing
+   * 2) The alias mirrors the original's propagation flags and detail, so a
+   *    legacy listener sees exactly what it saw before the rename
+   */
+    dispatchWithLegacyAlias(event) {
+        this.dispatchEvent(event); /* 1 */
+        const legacyEventName = DEPRECATED_EVENT_ALIASES[event.type];
+        if (legacyEventName) {
+            const options = {
+                bubbles: event.bubbles,
+                composed: event.composed,
+                cancelable: event.cancelable,
+            }; /* 2 */
+            this.dispatchEvent(event instanceof CustomEvent
+                ? new CustomEvent(legacyEventName, { ...options, detail: event.detail })
+                : new Event(legacyEventName, options));
+        }
         return event;
     }
     /**

package/lib/components/cre8-element.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cre8-element.js","sourceRoot":"","sources":["../../components/cre8-element.ts"],"names":[],"mappings":"AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAoBvC;;GAEG;AACH,MAAM,OAAO,WAAY,SAAQ,UAAU;IACzC;;;;;;;;OAQG;IACD,mBAAmB,CAAC,aAAqB,EAAE,oBAAoB,GAAG,EAAE;QAChE,OAAO,UAAU,CAAC,aAAa,EAAE,oBAAoB,CAAC,CAAC;IAC3D,CAAC;IAEH;;;;OAIG;IACD,SAAS,CAAC,QAAgB;QACtB,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC,UAAU,QAAQ,IAAI,CAAC,CAAC;IACvD,CAAC;IAEH;;;;OAIG;IACD,YAAY,CAAC,QAAgB;QACzB,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,KAAK,EAAE,CAAC;YACtC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC;QACrC,CAAC;QACD,OAAO,IAAI,CAAC;IAChB,CAAC;IAED;;KAEC;IACD,QAAQ,CAAC,EACL,CAAC,EAAE,SAAS,EAAE,SAAS,GAAG,EAAE,EAAE,UAAU,GAAG,EAAE,GAC7B;QAChB,MAAM,OAAO,GAAG;YACZ,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,GAAG,UAAU;YACb,MAAM,EAAE,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,aAAa,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,SAAS,EAAE;SAC3D,CAAC;QACF,~~MAAM~~,~~KAAK~~,~~GAAG~~,IAAI,WAAW,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;~~QAClD~~,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;~~QAC1B~~,OAAO,KAAK,CAAC;IACjB,CAAC;IAEH;;OAEG;IACD,MAAM;QACF,OAAO,IAAI,CAAA,eAAe,CAAC;IAC/B,CAAC;CACJ","sourcesContent":["import classnames from 'classnames';\nimport { html, LitElement } from 'lit';\n\nexport interface DetailObj {\n [key: string]: unknown;\n}\n\nexport interface Cre8DispatchProps {\n e?: Event;\n eventName: string;\n detailObj?: DetailObj;\n optionsObj?: { [key: string]: unknown };\n}\n\nexport interface Cre8Event extends Event {\n detail: {\n originalEvent: Event;\n detailObj: DetailObj;\n };\n}\n\n/*\n A base element.\n /\nexport class Cre8Element extends LitElement {\n /\n Abstraction of `classnames` that automatically includes any style modifier\n * as well as any set variants.\n \n It is expected that `variant` would be overridden in a subclass with more\n * specific types, `@property() variant?: 'foo' \| 'bar'`\n \n @param baseClassName\n /\n componentClassNames(baseClassName: string, additionalClassNames = {}) {\n return classnames(baseClassName, additionalClassNames);\n }\n\n /\n Check if a slot is empty\n \n @param slotName\n /\n slotEmpty(slotName: string) {\n return !this.querySelector(`[slot=\"${slotName}\"]`);\n }\n\n /\n Check if a slot is not empty\n \n @param slotName\n /\n slotNotEmpty(slotName: string) {\n if (!this.slotEmpty(slotName) !== false) {\n return !this.slotEmpty(slotName);\n }\n return null;\n }\n\n /\n Dispatch a custom event.\n /\n dispatch({\n e, eventName, detailObj = {}, optionsObj = {},\n }: Cre8DispatchProps): CustomEvent {\n const options = {\n bubbles: true,\n composed: true,\n ...optionsObj,\n detail: { ...(e && { originalEvent: e }), ...detailObj },\n };\n ~~const~~ ~~event =~~ new CustomEvent(eventName, options);\n this.dispatchEvent(event);\n return event;\n }\n\n /\n Example render, should not be used\n */\n render() {\n return html`<slot></slot>`;\n }\n}\n"]}
1	+ {"version":3,"file":"cre8-element.js","sourceRoot":"","sources":["../../components/cre8-element.ts"],"names":[],"mappings":"AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAoBvC;;;;;;;;;GASG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAqC;IACtE,YAAY,EAAE,WAAW;IACzB,YAAY,EAAE,aAAa;IAC3B,aAAa,EAAE,aAAa;IAC5B,cAAc,EAAE,MAAM;IACtB,eAAe,EAAE,OAAO;IACxB,cAAc,EAAE,MAAM;IACtB,eAAe,EAAE,OAAO;IACxB,qBAAqB,EAAE,qBAAqB;IAC5C,kBAAkB,EAAE,kBAAkB;IACtC,+BAA+B,EAAE,uBAAuB;IACxD,sBAAsB,EAAE,wBAAwB;IAChD,yBAAyB,EAAE,YAAY;IACvC,6BAA6B,EAAE,gBAAgB;IAC/C,mBAAmB,EAAE,kBAAkB;IACvC,aAAa,EAAE,kBAAkB;IACjC,aAAa,EAAE,kBAAkB;IACjC,aAAa,EAAE,kBAAkB;CACpC,CAAC;AAEF;;GAEG;AACH,MAAM,OAAO,WAAY,SAAQ,UAAU;IACzC;;;;;;;;OAQG;IACD,mBAAmB,CAAC,aAAqB,EAAE,oBAAoB,GAAG,EAAE;QAChE,OAAO,UAAU,CAAC,aAAa,EAAE,oBAAoB,CAAC,CAAC;IAC3D,CAAC;IAEH;;;;OAIG;IACD,SAAS,CAAC,QAAgB;QACtB,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC,UAAU,QAAQ,IAAI,CAAC,CAAC;IACvD,CAAC;IAEH;;;;OAIG;IACD,YAAY,CAAC,QAAgB;QACzB,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,KAAK,EAAE,CAAC;YACtC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC;QACrC,CAAC;QACD,OAAO,IAAI,CAAC;IAChB,CAAC;IAED;;KAEC;IACD,QAAQ,CAAC,EACL,CAAC,EAAE,SAAS,EAAE,SAAS,GAAG,EAAE,EAAE,UAAU,GAAG,EAAE,GAC7B;QAChB,MAAM,OAAO,GAAG;YACZ,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,GAAG,UAAU;YACb,MAAM,EAAE,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,aAAa,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,SAAS,EAAE;SAC3D,CAAC;QACF,OAAO,IAAI,CAAC,uBAAuB,CAAC,IAAI,WAAW,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC;IAC7E,CAAC;IAED;;;;;;KAMC;IACS,uBAAuB,CAAkB,KAAQ;QACvD,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO;QAElC,MAAM,eAAe,GAAG,wBAAwB,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QAC7D,IAAI,eAAe,EAAE,CAAC;YAClB,MAAM,OAAO,GAAG;gBACZ,OAAO,EAAE,KAAK,CAAC,OAAO;gBACtB,QAAQ,EAAE,KAAK,CAAC,QAAQ;gBACxB,UAAU,EAAE,KAAK,CAAC,UAAU;aAC/B,CAAC,CAAC,OAAO;YAEV,IAAI,CAAC,aAAa,CACd,KAAK,YAAY,WAAW;gBACxB,CAAC,CAAC,IAAI,WAAW,CAAC,eAAe,EAAE,EAAE,GAAG,OAAO,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC;gBACxE,CAAC,CAAC,IAAI,KAAK,CAAC,eAAe,EAAE,OAAO,CAAC,CAC5C,CAAC;QACN,CAAC;QAED,OAAO,KAAK,CAAC;IACjB,CAAC;IAEH;;OAEG;IACD,MAAM;QACF,OAAO,IAAI,CAAA,eAAe,CAAC;IAC/B,CAAC;CACJ","sourcesContent":["import classnames from 'classnames';\nimport { html, LitElement } from 'lit';\n\nexport interface DetailObj {\n [key: string]: unknown;\n}\n\nexport interface Cre8DispatchProps {\n e?: Event;\n eventName: string;\n detailObj?: DetailObj;\n optionsObj?: { [key: string]: unknown };\n}\n\nexport interface Cre8Event extends Event {\n detail: {\n originalEvent: Event;\n detailObj: DetailObj;\n };\n}\n\n/*\n Pre-normalization event names, keyed by their current name.\n \n Events were normalized to `component-action` kebab-case (see\n * `agent-docs/CODE_GUIDELINES.md`). Every renamed event is dispatched twice —\n * once under its current name, once under the legacy name — so existing\n * listeners keep working for one major version.\n \n 1) Delete this map and `dispatchLegacyAlias` in the next major release.\n /\nexport const DEPRECATED_EVENT_ALIASES: Readonly<Record<string, string>> = {\n 'tab-change': 'tabChange',\n 'tab-select': 'tabSelected',\n 'modal-close': 'close-modal',\n 'popover-open': 'open',\n 'popover-close': 'close',\n 'tooltip-open': 'open',\n 'tooltip-close': 'close',\n 'multi-select-change': 'selectedItemsChange',\n 'remove-tag-click': 'removeTagClicked',\n 'percent-bar-left-action-click': 'leftActionButtonClick',\n 'dropdown-item-select': 'dropdown-item-selected',\n 'split-button-text-click': 'text-click',\n 'split-button-dropdown-click': 'dropdown-click',\n 'pagination-change': 'pagination.click',\n 'chart-click': 'cre8-chart-click',\n 'chart-hover': 'cre8-chart-hover',\n 'chart-ready': 'cre8-chart-ready',\n};\n\n/\n A base element.\n /\nexport class Cre8Element extends LitElement {\n /\n Abstraction of `classnames` that automatically includes any style modifier\n * as well as any set variants.\n \n It is expected that `variant` would be overridden in a subclass with more\n * specific types, `@property() variant?: 'foo' \| 'bar'`\n \n @param baseClassName\n /\n componentClassNames(baseClassName: string, additionalClassNames = {}) {\n return classnames(baseClassName, additionalClassNames);\n }\n\n /\n Check if a slot is empty\n \n @param slotName\n /\n slotEmpty(slotName: string) {\n return !this.querySelector(`[slot=\"${slotName}\"]`);\n }\n\n /\n Check if a slot is not empty\n \n @param slotName\n /\n slotNotEmpty(slotName: string) {\n if (!this.slotEmpty(slotName) !== false) {\n return !this.slotEmpty(slotName);\n }\n return null;\n }\n\n /\n Dispatch a custom event.\n /\n dispatch({\n e, eventName, detailObj = {}, optionsObj = {},\n }: Cre8DispatchProps): CustomEvent {\n const options = {\n bubbles: true,\n composed: true,\n ...optionsObj,\n detail: { ...(e && { originalEvent: e }), ...detailObj },\n };\n return this.dispatchWithLegacyAlias(new CustomEvent(eventName, options));\n }\n\n /\n Dispatch an event, followed by its pre-normalization alias if it has one.\n * 1) Components that build their own event object should dispatch through\n * this instead of `dispatchEvent` so legacy listeners keep firing\n * 2) The alias mirrors the original's propagation flags and detail, so a\n * legacy listener sees exactly what it saw before the rename\n /\n protected dispatchWithLegacyAlias<T extends Event>(event: T): T {\n this.dispatchEvent(event); / 1 /\n\n const legacyEventName = DEPRECATED_EVENT_ALIASES[event.type];\n if (legacyEventName) {\n const options = {\n bubbles: event.bubbles,\n composed: event.composed,\n cancelable: event.cancelable,\n }; / 2 /\n\n this.dispatchEvent(\n event instanceof CustomEvent\n ? new CustomEvent(legacyEventName, { ...options, detail: event.detail })\n : new Event(legacyEventName, options),\n );\n }\n\n return event;\n }\n\n /\n Example render, should not be used\n */\n render() {\n return html`<slot></slot>`;\n }\n}\n"]}

package/lib/components/divider/divider.d.ts CHANGED Viewed

@@ -17,7 +17,7 @@ export declare class Cre8Divider extends Cre8Element {
      * - **brand**, the divider has blue color.
      * - **knockout**, the divider has white color.
      */
-    status?: string;
+    status?: 'brand' | 'knockout';
     render(): import("lit-html").TemplateResult<1>;
 }
 declare global {

package/lib/components/divider/divider.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"divider.d.ts","sourceRoot":"","sources":["../../../components/divider/divider.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAG9C;;;EAGE;AAEF,qBAAa,WAAY,SAAQ,WAAW;IACxC,MAAM,CAAC,MAAM,4BAAY;IAE3B;;;;MAIE;IAEE,OAAO,EAAE,YAAY,GAAG,UAAU,CAAgB;IAEtD;;;;;OAKG;IAEC,MAAM,CAAC,EAAE,~~MAAM~~,CAAC;~~IAEpB~~,MAAM;CAUP;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAC;KAC7B;CACF;AAED,eAAe,WAAW,CAAC"}
1	+ {"version":3,"file":"divider.d.ts","sourceRoot":"","sources":["../../../components/divider/divider.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAG9C;;;EAGE;AAEF,qBAAa,WAAY,SAAQ,WAAW;IACxC,MAAM,CAAC,MAAM,4BAAY;IAE3B;;;;MAIE;IAEE,OAAO,EAAE,YAAY,GAAG,UAAU,CAAgB;IAEtD;;;;;OAKG;IAEC,MAAM,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;IAElC,MAAM;CAUP;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAC;KAC7B;CACF;AAED,eAAe,WAAW,CAAC"}

package/lib/components/divider/divider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"divider.js","sourceRoot":"","sources":["../../../components/divider/divider.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,GAAI,MAAM,KAAK,CAAC;AAC7B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,MAAM,MAAM,qBAAqB,CAAC;AAEzC;;;EAGE;AAEF,MAAM,OAAO,WAAY,SAAQ,WAAW;IAA5C;;QAGE;;;;UAIE;QAEE,YAAO,GAA8B,YAAY,CAAC;IAqBxD,CAAC;IAVC,MAAM;QACF,MAAM,mBAAmB,GAAG,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,EAAE;YACnE,4BAA4B,EAAE,IAAI,CAAC,OAAO,KAAK,YAAY;YAC3D,0BAA0B,EAAE,IAAI,CAAC,OAAO,KAAK,UAAU;YACvD,uBAAuB,EAAE,IAAI,CAAC,MAAM,KAAK,OAAO;YAChD,0BAA0B,EAAE,IAAI,CAAC,MAAM,KAAK,UAAU;SACzD,CAAC,CAAC;QAEH,OAAO,IAAI,CAAA,gBAAgB,mBAAmB,gBAAgB,CAAC;IACnE,CAAC;;AA5BQ,kBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAQvB;IADH,QAAQ,EAAE;4CAC2C;AASlD;IADH,QAAQ,EAAE;~~2CACS~~;~~AActB~~,IAAI,cAAc,CAAC,GAAG,CAAC,cAAc,CAAC,KAAK,SAAS,EAAE,CAAC;IACnD,cAAc,CAAC,MAAM,CAAC,cAAc,EAAE,WAAW,CAAC,CAAC;AACvD,CAAC;AAQD,eAAe,WAAW,CAAC","sourcesContent":["import { html, } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { Cre8Element } from '../cre8-element';\nimport styles from './divider.styles.js';\n\n/*\n The divider component is a separator between sections of content or groups of items.\n * It often contains a horizontal or vertical line.\n/\n\nexport class Cre8Divider extends Cre8Element {\n static styles = [styles];\n\n /\n Divider variants\n * - By default, the component renders the horizontal divider\n * - vertical renders the vertical divider\n /\n @property()\n variant: 'horizontal' \| 'vertical' = 'horizontal';\n\n /\n Status (a color variant prop)\n * - By default, the divider has gray color.\n * - brand, the divider has blue color.\n * - knockout, the divider has white color.\n */\n @property()\n status?: ~~string~~;\n\n render() {\n const componentClassNames = this.componentClassNames('cre8-c-divider', {\n 'cre8-c-divider--horizontal': this.variant === 'horizontal',\n 'cre8-c-divider--vertical': this.variant === 'vertical',\n 'cre8-c-divider--brand': this.status === 'brand',\n 'cre8-c-divider--knockout': this.status === 'knockout',\n });\n\n return html` <div class=\"${componentClassNames}\"><wbr></div> `;\n }\n}\n\nif (customElements.get('cre8-divider') === undefined) {\n customElements.define('cre8-divider', Cre8Divider);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'cre8-divider': Cre8Divider;\n }\n}\n\nexport default Cre8Divider;\n"]}
1	+ {"version":3,"file":"divider.js","sourceRoot":"","sources":["../../../components/divider/divider.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,GAAI,MAAM,KAAK,CAAC;AAC7B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,MAAM,MAAM,qBAAqB,CAAC;AAEzC;;;EAGE;AAEF,MAAM,OAAO,WAAY,SAAQ,WAAW;IAA5C;;QAGE;;;;UAIE;QAEE,YAAO,GAA8B,YAAY,CAAC;IAqBxD,CAAC;IAVC,MAAM;QACF,MAAM,mBAAmB,GAAG,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,EAAE;YACnE,4BAA4B,EAAE,IAAI,CAAC,OAAO,KAAK,YAAY;YAC3D,0BAA0B,EAAE,IAAI,CAAC,OAAO,KAAK,UAAU;YACvD,uBAAuB,EAAE,IAAI,CAAC,MAAM,KAAK,OAAO;YAChD,0BAA0B,EAAE,IAAI,CAAC,MAAM,KAAK,UAAU;SACzD,CAAC,CAAC;QAEH,OAAO,IAAI,CAAA,gBAAgB,mBAAmB,gBAAgB,CAAC;IACnE,CAAC;;AA5BQ,kBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAQvB;IADH,QAAQ,EAAE;4CAC2C;AASlD;IADH,QAAQ,EAAE;2CACuB;AAcpC,IAAI,cAAc,CAAC,GAAG,CAAC,cAAc,CAAC,KAAK,SAAS,EAAE,CAAC;IACnD,cAAc,CAAC,MAAM,CAAC,cAAc,EAAE,WAAW,CAAC,CAAC;AACvD,CAAC;AAQD,eAAe,WAAW,CAAC","sourcesContent":["import { html, } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { Cre8Element } from '../cre8-element';\nimport styles from './divider.styles.js';\n\n/*\n The divider component is a separator between sections of content or groups of items.\n * It often contains a horizontal or vertical line.\n/\n\nexport class Cre8Divider extends Cre8Element {\n static styles = [styles];\n\n /\n Divider variants\n * - By default, the component renders the horizontal divider\n * - vertical renders the vertical divider\n /\n @property()\n variant: 'horizontal' \| 'vertical' = 'horizontal';\n\n /\n Status (a color variant prop)\n * - By default, the divider has gray color.\n * - brand, the divider has blue color.\n * - knockout, the divider has white color.\n */\n @property()\n status?: 'brand' \| 'knockout';\n\n render() {\n const componentClassNames = this.componentClassNames('cre8-c-divider', {\n 'cre8-c-divider--horizontal': this.variant === 'horizontal',\n 'cre8-c-divider--vertical': this.variant === 'vertical',\n 'cre8-c-divider--brand': this.status === 'brand',\n 'cre8-c-divider--knockout': this.status === 'knockout',\n });\n\n return html` <div class=\"${componentClassNames}\"><wbr></div> `;\n }\n}\n\nif (customElements.get('cre8-divider') === undefined) {\n customElements.define('cre8-divider', Cre8Divider);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'cre8-divider': Cre8Divider;\n }\n}\n\nexport default Cre8Divider;\n"]}

package/lib/components/dropdown/dropdown.d.ts CHANGED Viewed

@@ -1,4 +1,9 @@
 import { Cre8Element } from '../cre8-element';
+/** One item in a data-driven dropdown. */
+export interface Cre8DropdownItemData {
+    text: string;
+    ariaLabel?: string;
+}
 /**
  * The Dropdown menu itself is a container that can host multiple interactive items, commonly formatted as a list
  *
@@ -26,6 +31,14 @@ export declare class Cre8Dropdown extends Cre8Element {
     private _toggleDropdown;
     private _updateDropdownPosition;
     private _closeDropdown;
+    /**
+     * Items for a data-driven dropdown. Set this and the dropdown builds its own
+     * `cre8-dropdown-item` children in the light DOM.
+     */
+    items?: Cre8DropdownItemData[];
+    /** The composition the data property stands for. */
+    private buildComposition;
+    protected updated(changed: Map<string, unknown>): void;
     render(): import("lit-html").TemplateResult<1>;
 }
 declare global {

package/lib/components/dropdown/dropdown.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../components/dropdown/dropdown.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;~~AAG9C~~;;;;GAIG;~~AAEH~~,qBAAa,YAAa,SAAQ,WAAW;IACzC,MAAM,CAAC,MAAM,4BAAY;IAEhB,IAAI,UAAS;IAExB;;OAEG;IAEC,UAAU,SAAM;IAEpB;;OAEG;IAEC,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,eAAe,EAAG,WAAW,CAAC;IAElC;;OAEG;IAEC,gBAAgB,UAAS;;IAO7B,iBAAiB;IAKjB,oBAAoB;IAKpB,OAAO,CAAC,eAAe;IAUvB,OAAO,CAAC,uBAAuB;IAY/B,OAAO,CAAC,cAAc;~~IAItB~~,MAAM;CA0BP;AAKD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,YAAY,CAAC;KAC/B;CACF;AAED,eAAe,YAAY,CAAC"}
1	+ {"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../components/dropdown/dropdown.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAI9C,0CAA0C;AAC1C,MAAM,WAAW,oBAAoB;IACnC,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AAGH,qBAAa,YAAa,SAAQ,WAAW;IACzC,MAAM,CAAC,MAAM,4BAAY;IAEhB,IAAI,UAAS;IAExB;;OAEG;IAEC,UAAU,SAAM;IAEpB;;OAEG;IAEC,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,eAAe,EAAG,WAAW,CAAC;IAElC;;OAEG;IAEC,gBAAgB,UAAS;;IAO7B,iBAAiB;IAKjB,oBAAoB;IAKpB,OAAO,CAAC,eAAe;IAUvB,OAAO,CAAC,uBAAuB;IAY/B,OAAO,CAAC,cAAc;IAGtB;;;OAGG;IAEC,KAAK,CAAC,EAAE,oBAAoB,EAAE,CAAC;IAEnC,oDAAoD;IACpD,OAAO,CAAC,gBAAgB;IASxB,SAAS,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAOtD,MAAM;CA0BP;AAKD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,YAAY,CAAC;KAC/B;CACF;AAED,eAAe,YAAY,CAAC"}

package/lib/components/dropdown/dropdown.js CHANGED Viewed

@@ -8,6 +8,7 @@ import { html, nothing, } from 'lit';
 import { property, query, state } from 'lit/decorators.js';
 import svgCaretDown from '@tmorrow/cre8-wc/icons/Caret_Down_Filled.svg?raw';
 import { Cre8Element } from '../cre8-element';
+import { syncLightChildren } from '../utils/light-children';
 import styles from './dropdown.styles.js';
 /**
  * The Dropdown menu itself is a container that can host multiple interactive items, commonly formatted as a list
@@ -58,6 +59,21 @@ export class Cre8Dropdown extends Cre8Element {
     _closeDropdown() {
         this.open = false;
     }
+    /** The composition the data property stands for. */
+    buildComposition() {
+        if (!this.items)
+            return null;
+        return this.items.map((item) => ({
+            tag: 'cre8-dropdown-item',
+            props: item.ariaLabel ? { ariaLabel: item.ariaLabel } : undefined,
+            text: item.text,
+        }));
+    }
+    updated(changed) {
+        if (['items'].some((key) => changed.has(key))) {
+            syncLightChildren(this, this.buildComposition());
+        }
+    }
     render() {
         const componentClassNames = this.componentClassNames('cre8-c-dropdown', {
             'cre8-c-dropdown--close': !this.open,
@@ -99,6 +115,9 @@ __decorate([
 __decorate([
     property()
 ], Cre8Dropdown.prototype, "dropdownWithLink", void 0);
+__decorate([
+    property({ type: Array })
+], Cre8Dropdown.prototype, "items", void 0);
 if (customElements.get('cre8-dropdown') === undefined) {
     customElements.define('cre8-dropdown', Cre8Dropdown);
 }

package/lib/components/dropdown/dropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../components/dropdown/dropdown.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,GAAI,MAAM,KAAK,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,YAAY,MAAM,kDAAkD,CAAC;AAC5E,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,MAAM,MAAM,sBAAsB,CAAC;~~AAE1C~~;;;;GAIG;~~AAEH~~,MAAM,OAAO,YAAa,SAAQ,WAAW;IA0B3C;QACI,KAAK,EAAE,CAAC;QAxBD,SAAI,GAAG,KAAK,CAAC;QAExB;;WAEG;QAEC,eAAU,GAAG,EAAE,CAAC;QAWpB;;WAEG;QAEC,qBAAgB,GAAG,KAAK,CAAC;QAIzB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACnC,CAAC;IAED,iBAAiB;QACb,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;IAC5D,CAAC;IAED,oBAAoB;QAChB,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;IAC/D,CAAC;IAEO,eAAe,CAAC,CAAQ;QAC5B,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;QACvB,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACZ,IAAI,CAAC,uBAAuB,EAAE,CAAC;QACnC,CAAC;IACL,CAAC;IAGO,uBAAuB;QAC3B,IAAI,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACpC,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;gBACjB,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC;gBACtD,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;YAClD,CAAC;YACD,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;gBACxB,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,GAAG,GAAG,KAAK,CAAC;YAC3C,CAAC;QACL,CAAC;IACL,CAAC;IAEO,cAAc;QAClB,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IACtB,CAAC;~~IAED~~,MAAM;QACF,MAAM,mBAAmB,GAAG,IAAI,CAAC,mBAAmB,CAAC,iBAAiB,EAAE;YACpE,wBAAwB,EAAE,CAAC,IAAI,CAAC,IAAI;YACpC,uBAAuB,EAAE,IAAI,CAAC,IAAI;SACrC,CAAC,CAAC;QAEH,OAAO,IAAI,CAAA;;QAET,IAAI,CAAC,gBAAgB;YACrB,CAAC,CAAC,IAAI,CAAA,yGAAyG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,aAAa,IAAI,CAAC,eAAe,KAAK,IAAI,CAAC,UAAU;UAC9L,IAAI,CAAC,UAAU;gBACjB,CAAC,CAAC,IAAI,CAAA,mBAAmB,YAAY,sEAAsE;gBAC3G,CAAC,CAAC,OAAO;WACN;YACH,CAAC,CAAC,IAAI,CAAA,uGAAuG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,aAAa,IAAI,CAAC,eAAe,KAAK,IAAI,CAAC,UAAU;QAC9L,IAAI,CAAC,UAAU;gBACf,CAAC,CAAC,IAAI,CAAA,mBAAmB,YAAY,wEAAwE;gBAC7G,CAAC,CAAC,OAAO;kBAEjB;iCACiC,mBAAmB;;;;KAI/C,CAAC;IACJ,CAAC;;~~AA3FQ~~,mBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAEhB;IAAR,KAAK,EAAE;0CAAc;AAMpB;IADH,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDACP;AAMhB;IADH,QAAQ,EAAE;+CACY;AAGnB;IADH,KAAK,CAAC,kBAAkB,CAAC;qDACQ;AAM9B;IADH,QAAQ,EAAE;sDACkB;~~AAuE/B~~,IAAI,cAAc,CAAC,GAAG,CAAC,eAAe,CAAC,KAAK,SAAS,EAAE,CAAC;IACpD,cAAc,CAAC,MAAM,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC;AACzD,CAAC;AAOD,eAAe,YAAY,CAAC","sourcesContent":["import { html, nothing, } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport svgCaretDown from '@tmorrow/cre8-wc/icons/Caret_Down_Filled.svg?raw';\nimport { Cre8Element } from '../cre8-element';\nimport styles from './dropdown.styles.js';\n\n/*\n The Dropdown menu itself is a container that can host multiple interactive items, commonly formatted as a list\n \n @slot - The `cre8-dropdown-item` children of the menu\n /\n\nexport class Cre8Dropdown extends Cre8Element {\n static styles = [styles];\n\n @state() open = false;\n\n /\n Dropdown header\n /\n @property({ type: String })\n buttonText = '';\n\n /\n Enables scrolling once content reached to specified height, the height should mention in px units, ex: 100px\n /\n @property()\n maxHeight?: string;\n\n @query('.cre8-c-dropdown')\n dropdownContent!: HTMLElement;\n\n /\n button text represents as a link\n */\n @property()\n dropdownWithLink = false;\n\n constructor() {\n super();\n this._closeDropdown.bind(this);\n }\n\n connectedCallback() {\n super.connectedCallback();\n document.addEventListener('click', this._closeDropdown);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n document.removeEventListener('click', this._closeDropdown);\n }\n\n private _toggleDropdown(e: Event) {\n e.preventDefault();\n e.stopPropagation();\n this.open = !this.open;\n if (this.open) {\n this._updateDropdownPosition();\n }\n }\n\n\n private _updateDropdownPosition() {\n if (this.dropdownContent && this.open) {\n if (this.maxHeight) {\n this.dropdownContent.style.maxHeight = this.maxHeight;\n this.dropdownContent.style.overflowY = 'auto';\n }\n if (this.dropdownWithLink) {\n this.dropdownContent.style.top = '85%';\n }\n }\n }\n\n private _closeDropdown() {\n this.open = false;\n }\n\n render() {\n const componentClassNames = this.componentClassNames('cre8-c-dropdown', {\n 'cre8-c-dropdown--close': !this.open,\n 'cre8-c-dropdown--open': this.open,\n });\n\n return html`\n <div class=\"cre8-c-dropdown-container\">\n ${this.dropdownWithLink\n ? html`<a href=\"#\" aria-haspopup=\"true\" class=\"cre8-c-dropdown--toggle cre8-c-dropdown--link\" aria-expanded=\"${this.open ? 'true' : 'false'}\" @click=\"${this._toggleDropdown}\">${this.buttonText}\n ${this.buttonText\n ? html`<cre8-icon svg='${svgCaretDown}' aria-hidden=\"true\" class=\"cre8-c-dropdown--icon-link\"></cre8-icon>`\n : nothing}\n </a>`\n : html`<button aria-haspopup=\"true\" class=\"cre8-c-dropdown--toggle cre8-c-dropdown--button\" aria-expanded=\"${this.open ? 'true' : 'false'}\" @click=\"${this._toggleDropdown}\">${this.buttonText}\n ${this.buttonText\n ? html`<cre8-icon svg='${svgCaretDown}' aria-hidden=\"true\" class=\"cre8-c-dropdown--icon-button\"></cre8-icon>`\n : nothing}\n </button>`\n}\n <ul role=\"list\" class=\"${componentClassNames}\">\n <slot></slot>\n </ul>\n </div>\n `;\n }\n}\n\nif (customElements.get('cre8-dropdown') === undefined) {\n customElements.define('cre8-dropdown', Cre8Dropdown);\n}\ndeclare global {\n interface HTMLElementTagNameMap {\n 'cre8-dropdown': Cre8Dropdown;\n }\n}\n\nexport default Cre8Dropdown;\n"]}
1	+ {"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../components/dropdown/dropdown.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, nothing, } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport svgCaretDown from '@tmorrow/cre8-wc/icons/Caret_Down_Filled.svg?raw';\nimport { Cre8Element } from '../cre8-element';\nimport { syncLightChildren, type ChildSpec } from '../utils/light-children';\nimport styles from './dropdown.styles.js';\n\n/** One item in a data-driven dropdown. /\nexport interface Cre8DropdownItemData {\n text: string;\n ariaLabel?: string;\n}\n\n/\n The Dropdown menu itself is a container that can host multiple interactive items, commonly formatted as a list\n \n @slot - The `cre8-dropdown-item` children of the menu\n /\n\n\nexport class Cre8Dropdown extends Cre8Element {\n static styles = [styles];\n\n @state() open = false;\n\n /\n Dropdown header\n /\n @property({ type: String })\n buttonText = '';\n\n /\n Enables scrolling once content reached to specified height, the height should mention in px units, ex: 100px\n /\n @property()\n maxHeight?: string;\n\n @query('.cre8-c-dropdown')\n dropdownContent!: HTMLElement;\n\n /\n button text represents as a link\n /\n @property()\n dropdownWithLink = false;\n\n constructor() {\n super();\n this._closeDropdown.bind(this);\n }\n\n connectedCallback() {\n super.connectedCallback();\n document.addEventListener('click', this._closeDropdown);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n document.removeEventListener('click', this._closeDropdown);\n }\n\n private _toggleDropdown(e: Event) {\n e.preventDefault();\n e.stopPropagation();\n this.open = !this.open;\n if (this.open) {\n this._updateDropdownPosition();\n }\n }\n\n\n private _updateDropdownPosition() {\n if (this.dropdownContent && this.open) {\n if (this.maxHeight) {\n this.dropdownContent.style.maxHeight = this.maxHeight;\n this.dropdownContent.style.overflowY = 'auto';\n }\n if (this.dropdownWithLink) {\n this.dropdownContent.style.top = '85%';\n }\n }\n }\n\n private _closeDropdown() {\n this.open = false;\n }\n /\n Items for a data-driven dropdown. Set this and the dropdown builds its own\n * `cre8-dropdown-item` children in the light DOM.\n /\n @property({ type: Array })\n items?: Cre8DropdownItemData[];\n\n /* The composition the data property stands for. */\n private buildComposition(): ChildSpec[] \| null {\n if (!this.items) return null;\n return this.items.map((item) => ({\n tag: 'cre8-dropdown-item',\n props: item.ariaLabel ? { ariaLabel: item.ariaLabel } : undefined,\n text: item.text,\n }));\n }\n\n protected updated(changed: Map<string, unknown>): void {\n if (['items'].some((key) => changed.has(key))) {\n syncLightChildren(this, this.buildComposition());\n }\n }\n\n\n render() {\n const componentClassNames = this.componentClassNames('cre8-c-dropdown', {\n 'cre8-c-dropdown--close': !this.open,\n 'cre8-c-dropdown--open': this.open,\n });\n\n return html`\n <div class=\"cre8-c-dropdown-container\">\n ${this.dropdownWithLink\n ? html`<a href=\"#\" aria-haspopup=\"true\" class=\"cre8-c-dropdown--toggle cre8-c-dropdown--link\" aria-expanded=\"${this.open ? 'true' : 'false'}\" @click=\"${this._toggleDropdown}\">${this.buttonText}\n ${this.buttonText\n ? html`<cre8-icon svg='${svgCaretDown}' aria-hidden=\"true\" class=\"cre8-c-dropdown--icon-link\"></cre8-icon>`\n : nothing}\n </a>`\n : html`<button aria-haspopup=\"true\" class=\"cre8-c-dropdown--toggle cre8-c-dropdown--button\" aria-expanded=\"${this.open ? 'true' : 'false'}\" @click=\"${this._toggleDropdown}\">${this.buttonText}\n ${this.buttonText\n ? html`<cre8-icon svg='${svgCaretDown}' aria-hidden=\"true\" class=\"cre8-c-dropdown--icon-button\"></cre8-icon>`\n : nothing}\n </button>`\n}\n <ul role=\"list\" class=\"${componentClassNames}\">\n <slot></slot>\n </ul>\n </div>\n `;\n }\n}\n\nif (customElements.get('cre8-dropdown') === undefined) {\n customElements.define('cre8-dropdown', Cre8Dropdown);\n}\ndeclare global {\n interface HTMLElementTagNameMap {\n 'cre8-dropdown': Cre8Dropdown;\n }\n}\n\nexport default Cre8Dropdown;\n"]}

package/lib/components/dropdown-item/dropdown-item.d.ts CHANGED Viewed

@@ -6,7 +6,7 @@ import { Cre8Element } from '../cre8-element';
  *
  * @slot - The label content for the dropdown item.
  *
- * @fires dropdown-item-selected - Fires when the item is clicked. `event.detail.originalEvent` holds the source `MouseEvent`.
+ * @fires dropdown-item-select - Fires when the item is clicked. `event.detail.originalEvent` holds the source `MouseEvent`.
  */
 export declare class Cre8DropdownItem extends Cre8Element {
     static styles: import("lit").CSSResult[];

package/lib/components/dropdown-item/dropdown-item.js CHANGED Viewed

@@ -15,7 +15,7 @@ import styles from './dropdown-item.styles.js';
  *
  * @slot - The label content for the dropdown item.
  *
- * @fires dropdown-item-selected - Fires when the item is clicked. `event.detail.originalEvent` holds the source `MouseEvent`.
+ * @fires dropdown-item-select - Fires when the item is clicked. `event.detail.originalEvent` holds the source `MouseEvent`.
  */
 export class Cre8DropdownItem extends Cre8Element {
     constructor() {
@@ -26,7 +26,7 @@ export class Cre8DropdownItem extends Cre8Element {
         this.ariaLabel = '';
     }
     _handleClick(e) {
-        this.dispatch({ e, eventName: 'dropdown-item-selected' });
+        this.dispatch({ e, eventName: 'dropdown-item-select' });
     }
     connectedCallback() {
         super.connectedCallback();

package/lib/components/dropdown-item/dropdown-item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dropdown-item.js","sourceRoot":"","sources":["../../../components/dropdown-item/dropdown-item.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,GAAI,MAAM,KAAK,CAAC;AAC7B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,MAAM,MAAM,2BAA2B,CAAC;AAE/C;;;;;;;;GAQG;AACH,MAAM,OAAO,gBAAiB,SAAQ,WAAW;IAAjD;;QAGE;;WAEG;QAEC,cAAS,GAAG,EAAE,CAAC;IAoBrB,CAAC;IAlBS,YAAY,CAAC,CAAa;QAC9B,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,~~wBAAwB~~,EAAE,CAAC,CAAC;~~IAC9D~~,CAAC;IAED,iBAAiB;QACb,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE,CAAC;YAC7B,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;QAC1C,CAAC;IACL,CAAC;IAED,MAAM;QACF,MAAM,mBAAmB,GAAG,IAAI,CAAC,mBAAmB,CAAC,oBAAoB,EAAE,EAAE,CAAC,CAAC;QAC/E,MAAM,aAAa,GAAG,IAAI,CAAC,SAAS,IAAI,WAAW,IAAI,CAAC,WAAW,EAAE,IAAI,gBAAgB,CAAC;QAC1F,OAAO,IAAI,CAAA,cAAc,mBAAmB;8BACpB,aAAa,YAAY,IAAI,CAAC,YAAY;YAC5D,CAAC;IACX,CAAC;;AAzBQ,uBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAMvB;IADH,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mDACR;AAsBrB,IAAI,cAAc,CAAC,GAAG,CAAC,oBAAoB,CAAC,KAAK,SAAS,EAAE,CAAC;IACzD,cAAc,CAAC,MAAM,CAAC,oBAAoB,EAAE,gBAAgB,CAAC,CAAC;AAClE,CAAC;AAQD,eAAe,gBAAgB,CAAC","sourcesContent":["import { html, } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { Cre8Element } from '../cre8-element';\nimport styles from './dropdown-item.styles.js';\n\n/*\n The Dropdown item component is designed to be used with Dropdown component, each item represents a\n * selectable option or action within the dropdown menu. It can be configured to trigger actions, navigate\n * to links, initiate commands when clicked.\n \n @slot - The label content for the dropdown item.\n \n @fires dropdown-item-~~selected~~ - Fires when the item is clicked. `event.detail.originalEvent` holds the source `MouseEvent`.\n /\nexport class Cre8DropdownItem extends Cre8Element {\n static styles = [styles];\n\n /\n The accessible label for the item. Falls back to the item's text content when unset.\n */\n @property({ type: String })\n ariaLabel = '';\n\n private _handleClick(e: MouseEvent) {\n this.dispatch({ e, eventName: 'dropdown-item-~~selected~~' });\n }\n\n connectedCallback() {\n super.connectedCallback();\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'listitem');\n }\n }\n\n render() {\n const componentClassNames = this.componentClassNames('cre8-dropdown-item', {});\n const linkAriaLabel = this.ariaLabel \|\| `Link to ${this.textContent}` \|\| 'Drop down Item';\n return html`<li class=\"${componentClassNames}\" role=\"none\">\n <button aria-label=\"${linkAriaLabel}\" @click=${this._handleClick}><slot></slot></button>\n </li>`;\n }\n}\n\nif (customElements.get('cre8-dropdown-item') === undefined) {\n customElements.define('cre8-dropdown-item', Cre8DropdownItem);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'cre8-dropdown-item': Cre8DropdownItem;\n }\n}\n\nexport default Cre8DropdownItem;\n"]}
1	+ {"version":3,"file":"dropdown-item.js","sourceRoot":"","sources":["../../../components/dropdown-item/dropdown-item.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,GAAI,MAAM,KAAK,CAAC;AAC7B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,MAAM,MAAM,2BAA2B,CAAC;AAE/C;;;;;;;;GAQG;AACH,MAAM,OAAO,gBAAiB,SAAQ,WAAW;IAAjD;;QAGE;;WAEG;QAEC,cAAS,GAAG,EAAE,CAAC;IAoBrB,CAAC;IAlBS,YAAY,CAAC,CAAa;QAC9B,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,sBAAsB,EAAE,CAAC,CAAC;IAC5D,CAAC;IAED,iBAAiB;QACb,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE,CAAC;YAC7B,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;QAC1C,CAAC;IACL,CAAC;IAED,MAAM;QACF,MAAM,mBAAmB,GAAG,IAAI,CAAC,mBAAmB,CAAC,oBAAoB,EAAE,EAAE,CAAC,CAAC;QAC/E,MAAM,aAAa,GAAG,IAAI,CAAC,SAAS,IAAI,WAAW,IAAI,CAAC,WAAW,EAAE,IAAI,gBAAgB,CAAC;QAC1F,OAAO,IAAI,CAAA,cAAc,mBAAmB;8BACpB,aAAa,YAAY,IAAI,CAAC,YAAY;YAC5D,CAAC;IACX,CAAC;;AAzBQ,uBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAMvB;IADH,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mDACR;AAsBrB,IAAI,cAAc,CAAC,GAAG,CAAC,oBAAoB,CAAC,KAAK,SAAS,EAAE,CAAC;IACzD,cAAc,CAAC,MAAM,CAAC,oBAAoB,EAAE,gBAAgB,CAAC,CAAC;AAClE,CAAC;AAQD,eAAe,gBAAgB,CAAC","sourcesContent":["import { html, } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { Cre8Element } from '../cre8-element';\nimport styles from './dropdown-item.styles.js';\n\n/*\n The Dropdown item component is designed to be used with Dropdown component, each item represents a\n * selectable option or action within the dropdown menu. It can be configured to trigger actions, navigate\n * to links, initiate commands when clicked.\n \n @slot - The label content for the dropdown item.\n \n @fires dropdown-item-select - Fires when the item is clicked. `event.detail.originalEvent` holds the source `MouseEvent`.\n /\nexport class Cre8DropdownItem extends Cre8Element {\n static styles = [styles];\n\n /\n The accessible label for the item. Falls back to the item's text content when unset.\n */\n @property({ type: String })\n ariaLabel = '';\n\n private _handleClick(e: MouseEvent) {\n this.dispatch({ e, eventName: 'dropdown-item-select' });\n }\n\n connectedCallback() {\n super.connectedCallback();\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'listitem');\n }\n }\n\n render() {\n const componentClassNames = this.componentClassNames('cre8-dropdown-item', {});\n const linkAriaLabel = this.ariaLabel \|\| `Link to ${this.textContent}` \|\| 'Drop down Item';\n return html`<li class=\"${componentClassNames}\" role=\"none\">\n <button aria-label=\"${linkAriaLabel}\" @click=${this._handleClick}><slot></slot></button>\n </li>`;\n }\n}\n\nif (customElements.get('cre8-dropdown-item') === undefined) {\n customElements.define('cre8-dropdown-item', Cre8DropdownItem);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'cre8-dropdown-item': Cre8DropdownItem;\n }\n}\n\nexport default Cre8DropdownItem;\n"]}