npm - @ukic/web-components - Versions diffs - 2.1.0-beta.1 → 2.1.0-beta.2 - Mend

@ukic/web-components 2.1.0-beta.1 → 2.1.0-beta.2

Files changed (379) hide show

package/dist/cjs/ic-button_3.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-button.ic-loading-indicator.ic-tooltip.entry.cjs.js","mappings":";;;;;;;;;AAAA,MAAM,WAAW,GAAG,s+UAAs+U;;;;;;;;;;;;;;AC2B1/U,IAAI,SAAS,GAAG,CAAC,CAAC;MAUL,MAAM;;;;;;IAwET,oBAAe,GAAW,EAAE,CAAC;IAC7B,wBAAmB,GAA6B,EAAE,CAAC;IAEnD,eAAU,GAAY,KAAK,CAAC;IAC5B,gBAAW,GAAG,SAAS,EAAE,CAAC;IAoE1B,gBAAW,GAAG;MACpB,IACE,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,KAAK,QAAQ,IAAI,IAAI,CAAC,EAAE,CAAC,IAAI,KAAK,OAAO;QACtD,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,EACzB;QACA,IAAI,CAAC,2BAA2B,CAAC,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;OAC3D;KACF,CAAC;IAEM,YAAO,GAAG;MAChB,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;KACrB,CAAC;IAEM,WAAM,GAAG;MACf,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;KACpB,CAAC;oBA1J2B,KAAK;mBAIN,KAAK;gBAIF,QAAQ;;;;oBAgBD,KAAK;;;mBAYN,SAAS;gBAIf,SAAS;qBAIV,KAAK;0BAIA,KAAK;4BAIc,QAAQ;sBAIJ,SAAS;;EAoBnE,cAAc;;IAEZ,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,EAAE,CAAC,WAAW,GAAG,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC;GACrE;EAGD,eAAe,CAAC,KAAY;IAC1B,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO,EAAE;MACjC,KAAK,CAAC,wBAAwB,EAAE,CAAC;KAClC;GACF;EAGD,kBAAkB,CAAC,EAAe;IAChC,MAAM,KAAK,GAAY,EAAE,CAAC,MAAM,CAAC;IACjC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;GAC9B;;;;EAMD,MAAM,QAAQ;IACZ,IAAI,IAAI,CAAC,QAAQ,EAAE;MACjB,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAC;KACvB;GACF;;;;EAMD,MAAM,eAAe,CAAC,QAAgB;IACpC,IAAI,IAAI,CAAC,UAAU,EAAE;MACnB,IAAI,CAAC,SAAS,CAAC,KAAK,GAAG,QAAQ,CAAC;MAChC,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC;KACpD;GACF;EAEO,kBAAkB;IACxB,OAAO,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,eAAe,CAAC,QAAQ,EAAE,IAAI,EAAE,CAAC;GAC1D;EAEO,WAAW;IACjB,MAAM,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC;IACtD,IAAI,MAAM,IAAI,IAAI,EAAE;MAClB,OAAO,IAAI,CAAC;KACb;IACD,OAAO,KAAK,CAAC;GACd;EAEO,2BAA2B,CAAC,IAAqB;IACvD,MAAM,gBAAgB,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IAE1D,gBAAgB,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;IACpD,gBAAgB,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAC;IAExC,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,CAAC;IAEnC,gBAAgB,CAAC,KAAK,EAAE,CAAC;IACzB,gBAAgB,CAAC,MAAM,EAAE,CAAC;GAC3B;EAmBO,WAAW,CAAC,WAA8B,IAAI;IACpD,MAAM,eAAe,GAAGA,2BAAmB,CAAC,IAAI,CAAC,EAAE,EAAE,QAAQ,IAAI,IAAI,CAAC,CAAC;IAEvE,IAAI,eAAe,KAAKC,2BAAqB,CAAC,OAAO,EAAE;MACrD,IAAI,CAAC,UAAU,GAAG,eAAe,CAAC;KACnC;GACF;EAED,iBAAiB;IACf,IAAI,CAAC,mBAAmB,GAAGC,yBAAiB,CAAC,IAAI,CAAC,EAAE,EAAE;MACpD,GAAGC,yBAAiB;MACpB,eAAe;MACf,OAAO;KACR,CAAC,CAAC;IAEH,MAAM,EAAE,GAAG,IAAI,CAAC,EAAE,CAAC,EAAE,CAAC;IACtB,IAAI,CAAC,EAAE,GAAG,EAAE,KAAK,SAAS,GAAG,EAAE,GAAG,IAAI,CAAC;IACvC,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,OAAO,KAAK,MAAM,CAAC;GAC3C;EAED,gBAAgB;IACd,IAAI,CAAC,cAAc,EAAE,CAAC;IACtB,IAAI,CAAC,WAAW,EAAE,CAAC;GACpB;EAED,MAAM;IACJ,MAAM,OAAO,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,GAAG,KAAK,QAAQ,CAAC;IAC/C,MAAM,KAIF,IAAI,CAAC,mBAAmB,EAJtB,EACJ,KAAK,EACL,YAAY,EAAE,SAAS,OAEG,EADvB,uBAAuB,cAHtB,uBAIL,CAA2B,CAAC;IAC7B,MAAM,WAAW,GACf,OAAO,KAAK,QAAQ;QAChB,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE;QAC5C;QACE,QAAQ,EAAE,IAAI,CAAC,QAAQ,KAAK,KAAK,GAAG,IAAI,CAAC,QAAQ,GAAG,IAAI;QACxD,IAAI,EAAE,IAAI,CAAC,IAAI;QACf,GAAG,EAAE,IAAI,CAAC,GAAG;QACb,MAAM,EAAE,IAAI,CAAC,MAAM;QACnB,cAAc,EAAE,IAAI,CAAC,cAAc;QACnC,QAAQ,EAAE,IAAI,CAAC,QAAQ;OACxB,CAAC;IACR,MAAM,QAAQ,GAAG,KAAK,IAAK,KAAgB,CAAC;IAC5C,MAAM,SAAS,GAAG,IAAI,CAAC,UAAU,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC;IAC7D,IAAI,WAAW,GAAG,EAAE,CAAC;IACrB,IAAI,IAAI,CAAC,UAAU,EAAE;MACnB,IAAI,QAAQ,KAAK,SAAS,EAAE;QAC1B,WAAW,GAAG,QAAQ,CAAC;OACxB;WAAM,IAAI,SAAS,KAAK,IAAI,EAAE;QAC7B,WAAW,GAAG,SAAmB,CAAC;OACnC;KACF;IAED,IAAI,WAAW,GAAW,IAAI,CAAC;IAC/B,IAAI,QAAQ,GAAW,IAAI,CAAC;IAC5B,IAAI,IAAI,CAAC,UAAU,EAAE;MACnB,QAAQ;QACN,IAAI,CAAC,EAAE,KAAK,IAAI;YACZ,0BAA0B,IAAI,CAAC,EAAE,EAAE;YACnC,0BAA0B,IAAI,CAAC,WAAW,EAAE,CAAC;MACnD,WAAW,GAAG,cAAc,QAAQ,EAAE,CAAC;KACxC;IAED,MAAM,aAAa,GAAG;MACpB,QACEC,QAAC,OAAO,kBACN,KAAK,EAAC,QAAQ,mBACC,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,IAAI,gBAChD,IAAI,CAAC,OAAO,GAAG,SAAS,GAAG,SAAS,IAC5C,WAAW,EACX,uBAAuB,EACvB,SAAS,IACb,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC,EACjC,EAAE,EAAE,QAAQ,sBACM,WAAW,KAE5B,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,IAAI,CAAC,OAAO,KAClCA,iBAAK,KAAK,EAAC,gBAAgB,IACzBA,kBAAM,IAAI,EAAC,MAAM,GAAG,CAChB,CACP,EACA,IAAI,CAAC,OAAO,IACXA,iBAAK,KAAK,EAAC,mBAAmB,EAAC,KAAK,EAAE,IAAI,CAAC,kBAAkB,EAAE,IAC7DA,kCACE,IAAI,EAAC,QAAQ,EACb,UAAU,EACR,IAAI,CAAC,OAAO,KAAK,SAAS;UAC1B,IAAI,CAAC,OAAO,KAAK,aAAa;UAC9B,IAAI,CAAC,UAAU,KAAKH,2BAAqB,CAAC,IAAI;UAC9C,IAAI,CAAC,UAAU,KAAKA,2BAAqB,CAAC,KAAK;YAC3C,OAAO;YACP,MAAM,GAEU,CACpB,KAENG,qBAAQ,CACT,CACO,EACV;KACH,CAAC;IAEF,QACEA,QAACC,UAAI,IACH,KAAK,EAAE;QACL,CAAC,UAAU,GAAG,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,OAAO;QAC5C,CAAC,kBAAkB,IAAI,CAAC,OAAO,EAAE,GAAG,IAAI;QACxC,CAAC,eAAe,IAAI,CAAC,IAAI,EAAE,GAAG,IAAI;QAClC,CAAC,SAAS,GAAG,IAAI,CAAC,OAAO;QACzB,CAAC,MAAM,GAAG,IAAI,CAAC,UAAU,KAAKJ,2BAAqB,CAAC,IAAI;QACxD,CAAC,OAAO,GAAG,IAAI,CAAC,UAAU,KAAKA,2BAAqB,CAAC,KAAK;QAC1D,CAAC,YAAY,GAAG,IAAI,CAAC,SAAS;OAC/B,EACD,OAAO,EAAE,IAAI,CAAC,WAAW,IAExB,IAAI,CAAC,UAAU,KACdG,wBACE,KAAK,EAAE,EAAE,CAAC,yBAAyB,GAAG,IAAI,CAAC,cAAc,EAAE,EAC3D,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC,EAClC,KAAK,EAAE,WAAW,EAClB,MAAM,EAAE,QAAQ,EAChB,SAAS,EAAE,IAAI,CAAC,gBAAgB,IAEhCA,QAAC,aAAa,OAAG,CACN,CACd,EAEA,CAAC,IAAI,CAAC,UAAU,IAAIA,QAAC,aAAa,OAAG,CACjC,EACP;GACH;;;;;;;;AC3UH,MAAM,qBAAqB,GAAG,ilKAAilK;;MCgBlmK,gBAAgB;;;IA8EnB,gCAA2B,GAAG;MACpC,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;QACvB,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,WAAW,CAClC,kBAAkB,EAClB,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CACtB,CAAC;OACH;KACF,CAAC;IAEM,aAAQ,GAAG,CACjB,UAAkB,EAClB,QAAiC;MAEjC,OAAO,IAAI,OAAO,CAAC;QACjB,WAAW,CAAC;UACV,IAAI,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE;YAC1C,UAAU,EAAE,CAAC;WACd;eAAM;YACL,UAAU,GAAG,CAAC,CAAC;WAChB;UACD,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC;SACtC,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;OACxB,CAAC,CAAC;KACJ,CAAC;IAEM,oBAAe,GAAG;;MACxB,IAAI,OAAO,GAA0B,IAAI,CAAC;MAC1C,MAAM,KAAK,GAAG,MAAA,IAAI,CAAC,YAAY,0CAAE,WAAW,CAAC;MAC7C,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,KAAK,IAAI,CAAC,IAAI,KAAK,UAAU,IAAI,KAAK,GAAG,EAAE,CAAC,EAAE;QACrE,OAAO,GAAG,OAAO,CAAC;OACnB;WAAM,IACL,IAAI,CAAC,IAAI,KAAK,OAAO;SACpB,IAAI,CAAC,IAAI,KAAK,UAAU,IAAI,KAAK,IAAI,GAAG,CAAC,EAC1C;QACA,OAAO,GAAG,IAAI,CAAC;OAChB;MACD,OAAO,OAAO,CAAC;KAChB,CAAC;;IAGM,uBAAkB,GAAG;MAC3B,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,YAAY,CAAC;MACjD,IAAI,KAAK,EAAE;QACT,IAAI,CAAC,iBAAiB,GAAG,KAAK,GAAG,GAAG,CAAC;QACrC,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC;QAC9B,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,WAAW,CACjC,uBAAuB,EACvB,GAAG,IAAI,CAAC,iBAAiB,IAAI,CAC9B,CAAC;OACH;KACF,CAAC;IAEM,8BAAyB,GAAG;MAClC,IAAI,CAAC,IAAI,CAAC,YAAY;QAAE,OAAO;;MAG/B,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC;MACvE,MAAM,UAAU,GAAG,CAAC,QAAQ,GAAG,IAAI,CAAC,GAAG,KAAK,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC;MACjE,IAAI,CAAC,UAAU,GAAG,UAAU,GAAG,GAAG,CAAC;MACnC,IAAI,IAAI,CAAC,UAAU,EAAE;QACnB,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;OAC5C;WAAM;QACL,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;OACzC;MACD,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,WAAW,CACjC,gBAAgB,EAChB,GAAG,UAAU,GAAG,GAAG,GAAG,CACvB,CAAC;KACH,CAAC;IAEM,mBAAc,GAAG;MACvB,IAAI,GAAG,GAAG,cAAc,IAAI,CAAC,IAAI,QAAQ,CAAC;MAC1C,GAAG,IAAI,IAAI,CAAC,aAAa,GAAG,gBAAgB,GAAG,cAAc,CAAC;MAC9D,OAAO,GAAG,CAAC;KACZ,CAAC;IAEM,gBAAW,GAAG;MACpB,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS,EAAE;QAC5B,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACvC,MAAM,UAAU,GAAG,CAAC,CAAC;QACrB,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;QACjD,IAAI,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE;UAC7B,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC,KAAK;YAC9B,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;WAC7B,CAAC,CAAC;SACJ;OACF;KACF,CAAC;IAEM,gBAAW,GAAG;MACpB,IAAI,IAAI,CAAC,gBAAgB,EAAE;QACzB,MAAM,CAAC,GAAG,IAAI,CAAC,gBAAgB,GAAG,CAAC,CAAC;QACpC,MAAM,CAAC,GAAG,CAAC,CAAC;QACZ,MAAM,CAAC,GAAG,CAAC,CAAC;QACZ,MAAM,UAAU,GAAG,CAAC,GAAG,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC;QAClD,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;QAE9B,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,UAAU,EAAE,CAAC;OAChC;MACD,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;KAC7B,CAAC;IAEM,iBAAY,GAAG,CAAC,MAAc;MACpC,MAAM,SAAS,GAAG,CAAC,GAAG,IAAI,CAAC,EAAE,GAAG,MAAM,CAAC;MACvC,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;MACvE,MAAM,UAAU,GAAG,CAAC,CAAC,GAAG,CAAC,QAAQ,GAAG,IAAI,CAAC,GAAG,KAAK,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC;MAEtE,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,WAAW,CAClC,oBAAoB,EACpB,GAAG,SAAS,IAAI,CACjB,CAAC;MAEF,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;QACvB,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,WAAW,CAClC,sBAAsB,EACtB,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CACjB,CAAC;QACF,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,WAAW,CAClC,qBAAqB,EACrB,GAAG,UAAU,GAAG,SAAS,IAAI,CAC9B,CAAC;OACH;KACF,CAAC;;eA3LqB,CAAC;eAMD,GAAG;;uBAWK,SAAS;yBAKP,IAAI;gBAKY,SAAS;gBAKT,UAAU;qBAKZ,KAAK;sBAKF,MAAM;;;sBAIzB,KAAK;;;;EAKpC,gBAAgB;IACd,IAAI,CAAC,WAAW,EAAE,CAAC;GACpB;EAGD,oBAAoB;IAClB,IAAI,CAAC,2BAA2B,EAAE,CAAC;GACpC;EAmID,iBAAiB;IACf,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,QAAQ,KAAK,SAAS,CAAC;IACjD,IAAI,CAAC,WAAW,EAAE,CAAC;GACpB;EAED,gBAAgB;IACd,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,EAAE;MAC5B,IAAI,CAAC,kBAAkB,EAAE,CAAC;MAC1B,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CACrD,8CAA8C,CAC/C,CAAC;MACF,IAAI,CAAC,2BAA2B,EAAE,CAAC;KACpC;IAED,IAAI,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE;MACxD,IAAI,CAAC,yBAAyB,EAAE,CAAC;KAClC;GACF;EAED,mBAAmB;IACjB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,QAAQ,KAAK,SAAS,CAAC;GAClD;EAED,kBAAkB;IAChB,IAAI,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE;MACxD,IAAI,CAAC,yBAAyB,EAAE,CAAC;KAClC;GACF;EAED,MAAM;IACJ,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,WAAW,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;IACtD,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;IAEvC,QACEA,QAACC,UAAI,IAAC,KAAK,EAAE,EAAE,CAAC,OAAO,GAAG,UAAU,KAAKJ,2BAAqB,CAAC,KAAK,EAAE,IACpEG,iBAAK,KAAK,EAAC,sBAAsB,IAC/BA,iBACE,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,YAAY,GAAG,EAAoB,CAAC,EACvD,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE,EAC5B,IAAI,EAAC,aAAa,qBAEhB,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM,IAAI,kBAAkB,gBAE9C,WAAW,mBACR,IAAI,CAAC,QAAQ,mBACb,IAAI,CAAC,GAAG,mBACR,IAAI,CAAC,GAAG,IAEvBA,iBACE,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,YAAY,GAAG,EAAoB,CAAC,EACvD,KAAK,EAAE,cAAc,IAAI,CAAC,IAAI,QAAQ,IAErC,IAAI,CAAC,IAAI,KAAK,UAAU,KACvBA,iBACE,KAAK,EAAC,yBAAyB,EAC/B,OAAO,EAAE,OAAO,IAAI,CAAC,gBAAgB,IAAI,CAAC,IACxC,IAAI,CAAC,gBAAgB,IAAI,CAC3B,EAAE,IAEFA,oBAAQ,EAAE,EAAE,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,GAAG,CAAC,EAAE,EAAE,CAAC,EAAE,GAAG,CAAC,EAAE,GAAW,EACpDA,oBAAQ,EAAE,EAAE,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,GAAG,CAAC,EAAE,EAAE,CAAC,EAAE,GAAG,CAAC,EAAE,GAAW,CAChD,CACP,CACG,CACF,EACL,KAAK,IAAI,IAAI,KAAK,MAAM,KACvBA,2BACE,EAAE,EAAC,kBAAkB,EACrB,KAAK,EAAC,kBAAkB,EACxB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,eAAe,EAAE,IAE/BA,mBAAI,IAAI,CAAC,cAAc,CAAK,CACd,CACjB,CACG,CACD,EACP;GACH;;;;;;;;;ACxSH,MAAM,YAAY,GAAG,g1JAAg1J;;MCUx1J,OAAO;;;IA4BV,kBAAa,GAAY,KAAK,CAAC;IAC/B,eAAU,GAAG,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC;IACvC,sBAAiB,GAAG,CAAC,UAAU,CAAC,CAAC;IACjC,sBAAiB,GAAG,CAAC,YAAY,CAAC,CAAC;IAGnC,SAAI,GAAG,CAAC,MAAgB;MAC9B,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC;MAC3C,MAAM,CAAC,UAAU,CAAC,CAAC,OAAO,sCACrB,OAAO,KACV,SAAS,EAAE;UACT,GAAG,OAAO,CAAC,SAAS;UACpB,EAAE,IAAI,EAAE,gBAAgB,EAAE,OAAO,EAAE,IAAI,EAAE;SAC1C,IACD,CAAC,CAAC;MACJ,MAAM,CAAC,MAAM,EAAE,CAAC;KACjB,CAAC;IAEM,SAAI,GAAG,CAAC,MAAgB;MAC9B,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;MAC1C,MAAM,CAAC,UAAU,CAAC,CAAC,OAAO,sCACrB,OAAO,KACV,SAAS,EAAE;UACT,GAAG,OAAO,CAAC,SAAS;UACpB,EAAE,IAAI,EAAE,gBAAgB,EAAE,OAAO,EAAE,KAAK,EAAE;SAC3C,IACD,CAAC,CAAC;KACL,CAAC;IAEM,sBAAiB,GAAG,CAAC,MAAgB;MAC3C,UAAU,CAAC;QACT,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;UACvB,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;SACnB;OACF,EAAE,GAAG,CAAC,CAAC;KACT,CAAC;IAEM,sBAAiB,GAAG;MAC1B,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;KAC3B,CAAC;IAEM,sBAAiB,GAAG,CAAC,MAAgB;MAC3C,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;MAC3B,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC;KAChC,CAAC;IAEM,kBAAa,GAAG,CAAC,GAAW;MAClC,IAAI,GAAG,KAAK,QAAQ,EAAE;QACpB,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;OAChC;KACF,CAAC;IAEM,yBAAoB,GAAG,CAAC,MAAwB;MACtD,MAAM,MAAM,GACV,MAAM,KAAK,KAAK,GAAG,kBAAkB,GAAG,qBAAqB,CAAC;MAEhE,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,KAAK;QAC5B,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,MAAM,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC;QAC7D,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,MAAM,IAAI,CAAC,iBAAiB,EAAE,CAAC,CAAC;OAC7D,CAAC,CAAC;MAEH,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC,KAAK;QACnC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,MAAM,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC;OAC9D,CAAC,CAAC;MAEH,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC,KAAK;QACnC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,MAAM,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC;QAC1E,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,MAC1B,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,CAC5C,CAAC;OACH,CAAC,CAAC;MAEH,QAAQ,CAAC,MAAM,CAAC,CAAC,SAAS,EAAE,CAAC,KAAoB,KAC/C,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,GAAG,CAAC,CAC9B,CAAC;KACH,CAAC;IAEM,2BAAsB,GAAG;MAC/B,QAAQ,EAAE,UAAU;MACpB,IAAI,EAAE,UAAU;MAChB,GAAG,EAAE,MAAM;MACX,KAAK,EAAE,KAAK;MACZ,MAAM,EAAE,KAAK;MACb,QAAQ,EAAE,QAAQ;KACnB,CAAC;;qBArGwC,QAAQ;;;EAQlD,WAAW,CAAC,QAAgB;IAC1B,MAAM,eAAe,GAAG,IAAI,CAAC,EAAE,CAAC,sBAAqC,CAAC;IACtE,IAAI,eAAe,KAAK,IAAI,EAAE;MAC5B,eAAe,CAAC,SAAS,GAAG,QAAQ,CAAC;KACtC;GACF;EA0FD,gBAAgB;IACd,IAAI,CAAC,cAAc,GAAGE,mBAAY,CAAC,IAAI,CAAC,EAAE,EAAE,IAAI,CAAC,OAAO,EAAE;MACxD,SAAS,EAAE,IAAI,CAAC,SAAS;MACzB,SAAS,EAAE;QACT;UACE,IAAI,EAAE,QAAQ;UACd,OAAO,EAAE;YACP,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;WAChB;SACF;QACD;UACE,IAAI,EAAE,OAAO;UACb,OAAO,EAAE;YACP,OAAO,EAAE,IAAI,CAAC,KAAK;WACpB;SACF;OACF;KACF,CAAC,CAAC;IAEH,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC;IAEjCC,wCAAgC,CAC9B,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,EACzC,SAAS,CACV,CAAC;IAEF,IAAI,IAAI,CAAC,MAAM,KAAK,SAAS,EAAE;MAC7B,MAAM,eAAe,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;MACvD,eAAe,CAAC,EAAE,GAAG,cAAc,IAAI,CAAC,MAAM,EAAE,CAAC;MACjD,eAAe,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC;MACvC,eAAe,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;MAClD,MAAM,CAAC,MAAM,CAAC,eAAe,CAAC,KAAK,EAAE,IAAI,CAAC,sBAAsB,CAAC,CAAC;MAElE,IAAI,CAAC,EAAE,CAAC,qBAAqB,CAAC,aAAa,EAAE,eAAe,CAAC,CAAC;KAC/D;GACF;EAED,oBAAoB;IAClB,IAAI,CAAC,oBAAoB,CAAC,QAAQ,CAAC,CAAC;GACrC;EAED,MAAM;IACJ,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;IACvB,QACEH,QAACC,UAAI,IAAC,KAAK,EAAE,EAAE,YAAY,EAAE,IAAI,EAAE,IACjCD,iBACE,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,OAAO,GAAG,EAAoB,CAAC,EAClD,IAAI,EAAC,SAAS,EACd,KAAK,EAAC,sBAAsB,IAE5BA,2BAAe,OAAO,EAAC,SAAS,IAAE,KAAK,CAAiB,EACxDA,iBACE,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,KAAK,GAAG,EAAoB,CAAC,EAChD,KAAK,EAAC,kBAAkB,8BAEnB,CACH,EACNA,qBAAa,CACR,EACP;GACH;;;;;;;;;;;;","names":["getThemeFromContext","IcThemeForegroundEnum","inheritAttributes","IC_INHERITED_ARIA","h","Host","createPopper","onComponentRequiredPropUndefined"],"sources":["./src/components/ic-button/ic-button.css?tag=ic-button&encapsulation=shadow","./src/components/ic-button/ic-button.tsx","./src/components/ic-loading-indicator/ic-loading-indicator.css?tag=ic-loading-indicator&encapsulation=shadow","./src/components/ic-loading-indicator/ic-loading-indicator.tsx","./src/components/ic-tooltip/ic-tooltip.css?tag=ic-tooltip&encapsulation=shadow","./src/components/ic-tooltip/ic-tooltip.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n display: inline-block;\n\n --button-default: var(--ic-action-default);\n --button-default-hover: var(--ic-action-default-hover);\n --button-default-active: var(--ic-action-default-active);\n --button-default-background-hover: var(--ic-action-default-bg-hover);\n --button-default-background-active: var(--ic-action-default-bg-active);\n --icon-width: 100%;\n --icon-height: 100%;\n}\n\n.button {\n font-family: var(--ic-font-body-family);\n text-decoration: none;\n font-weight: 600;\n font-size: 14px;\n transition: var(--ic-easing-transition-fast);\n border-radius: var(--ic-border-radius);\n min-width: 100px;\n display: inline-flex;\n gap: var(--ic-space-xs);\n flex-direction: row;\n justify-content: center;\n align-items: center;\n background: none;\n border: none;\n box-sizing: border-box;\n white-space: nowrap;\n vertical-align: middle;\n}\n\n.button:hover {\n cursor: pointer;\n}\n\n.button:focus,\n:host .button:focus {\n box-shadow: var(--ic-border-focus);\n}\n\n:host(.light) .button:focus {\n box-shadow: var(--ic-border-focus);\n}\n\n.button:focus-visible {\n outline: var(--ic-hc-focus-outline);\n}\n\n:host(.dark) .button {\n --button-default: var(--ic-action-dark);\n --button-default-hover: var(--ic-action-dark);\n --button-default-active: var(--ic-action-dark);\n --button-default-background-hover: var(--ic-action-dark-bg-hover);\n --button-default-background-active: var(--ic-action-dark-bg-active);\n}\n\n:host(.light) .button {\n --button-default: var(--ic-action-light);\n --button-default-hover: var(--ic-action-light);\n --button-default-active: var(--ic-action-light);\n --button-default-background-hover: var(--ic-action-light-bg-hover);\n --button-default-background-active: var(--ic-action-light-bg-active);\n}\n\n:host(.button-variant-primary.light) .button {\n color: var(--ic-color-primary-text);\n\n --button-default-hover: var(--ic-action-light-hover);\n --button-default-active: var(--ic-action-light-active);\n}\n\n:host(.button-variant-primary.dark) .button {\n --button-default-hover: var(--ic-action-dark-hover);\n --button-default-active: var(--ic-action-dark-active);\n}\n\n:host(.disabled),\n:host(.disabled) .button,\n:host(.loading),\n:host(.loading) .button {\n pointer-events: none;\n}\n\n/* Variants /\n\n/ Primary /\n\n:host(.button-variant-primary) .button {\n color: var(--ic-architectural-white);\n background-color: var(--button-default);\n}\n\n:host(.button-variant-primary) .button:hover:not(:focus) {\n background-color: var(--button-default-hover);\n}\n\n:host(.button-variant-primary) .button:active:not(:focus),\n:host(.button-variant-primary.loading) .button {\n background-color: var(--button-default-active);\n}\n\n:host(.button-variant-primary.disabled) .button {\n background: var(--ic-architectural-200);\n color: var(--ic-architectural-300);\n}\n\n:host(.button-variant-primary.light.disabled) .button {\n background: var(--ic-architectural-600);\n color: var(--ic-architectural-500);\n}\n\n/ Secondary /\n\n:host(.button-variant-secondary) .button {\n border: 1px solid var(--button-default);\n color: var(--button-default);\n}\n\n:host(.button-variant-secondary) .button:hover:not(:focus) {\n background-color: var(--button-default-background-hover);\n border-color: var(--button-default-hover);\n color: var(--button-default-hover);\n}\n\n:host(.button-variant-secondary) .button:active:not(:focus) {\n border-color: var(--button-default-active);\n background-color: var(--button-default-background-active);\n color: var(--button-default-active);\n}\n\n:host(.button-variant-secondary.loading) .button {\n border-color: var(--button-default-active);\n background-color: var(--button-default-background-active);\n color: var(--button-default-active);\n}\n\n:host(.button-variant-secondary.disabled) .button,\n:host(.button-variant-secondary.disabled) .button:hover,\n:host(.button-variant-secondary.disabled) .button:active {\n border-color: var(--ic-architectural-300);\n color: var(--ic-architectural-300);\n background: none;\n}\n\n:host(.button-variant-secondary.light.disabled) .button,\n:host(.button-variant-secondary.light.disabled) .button:hover,\n:host(.button-variant-secondary.light.disabled) .button:active {\n border-color: var(--ic-architectural-500);\n color: var(--ic-architectural-500);\n background: none;\n}\n\n/ Tertiary /\n\n:host(.button-variant-tertiary) .button {\n color: var(--button-default);\n}\n\n:host(.button-variant-tertiary) .button:hover:not(:focus) {\n background-color: var(--button-default-background-hover);\n color: var(--button-default-hover);\n}\n\n:host(.button-variant-tertiary) .button:active:not(:focus),\n:host(.button-variant-tertiary.loading) .button {\n background-color: var(--button-default-background-active);\n color: var(--button-default-active);\n}\n\n:host(.button-variant-tertiary.disabled) .button,\n:host(.button-variant-tertiary.disabled) .button:hover,\n:host(.button-variant-tertiary.disabled) .button:active {\n border-color: var(--ic-architectural-300);\n color: var(--ic-architectural-300);\n background: none;\n}\n\n:host(.button-variant-tertiary.light.disabled) .button,\n:host(.button-variant-tertiary.light.disabled) .button:hover,\n:host(.button-variant-tertiary.light.disabled) .button:active {\n border-color: var(--ic-architectural-500);\n color: var(--ic-architectural-500);\n background: none;\n}\n\n/ Icon /\n\n:host(.button-variant-icon) .button {\n color: var(--button-default);\n min-width: 0;\n}\n\n:host(.button-variant-icon) .button:hover:not(:focus) {\n background-color: var(--button-default-background-hover);\n color: var(--button-default-hover);\n}\n\n:host(.button-variant-icon) .button:active:not(:focus),\n:host(.button-variant-icon.loading) .button {\n background-color: var(--button-default-background-active);\n color: var(--button-default-active);\n}\n\n:host(.button-variant-icon.disabled) .button,\n:host(.button-variant-icon.disabled) .button:hover,\n:host(.button-variant-icon.disabled) .button:active {\n color: var(--ic-architectural-300);\n background: none;\n}\n\n/ Destructive /\n\n:host(.button-variant-destructive) .button {\n color: var(--ic-architectural-white);\n background-color: var(--ic-action-destructive);\n text-transform: uppercase;\n}\n\n:host(.button-variant-destructive) .button:hover:not(:focus) {\n background-color: var(--ic-action-destructive-hover);\n}\n\n:host(.button-variant-destructive) .button:active:not(:focus),\n:host(.button-variant-destructive.loading) .button {\n background-color: var(--ic-action-destructive-active);\n}\n\n:host(.button-variant-destructive.disabled) .button {\n background: var(--ic-architectural-200);\n color: var(--ic-architectural-300);\n}\n\n/ Sizing /\n\n:host(.button-size-default) .button {\n height: 40px;\n padding: var(--ic-space-xs) var(--ic-space-md);\n}\n\n:host(.button-size-small) .button {\n height: var(--ic-space-xl);\n padding: var(--ic-space-xxs) var(--ic-space-md);\n}\n\n:host(.button-size-large) .button {\n height: var(--ic-space-xxl);\n padding: var(--ic-space-sm) var(--ic-space-md);\n}\n\n:host(.button-size-default.button-variant-icon) .button {\n height: var(--ic-space-xl);\n width: var(--ic-space-xl);\n padding: 6px;\n}\n\n:host(.button-size-small.button-variant-icon) .button {\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n padding: var(--ic-space-xxs);\n}\n\n:host(.button-size-large.button-variant-icon) .button {\n height: 40px;\n width: 40px;\n padding: var(--ic-space-xs);\n}\n\n/ Width /\n:host(.full-width),\n:host(.full-width) .button {\n width: 100%;\n}\n\n/ Loading /\n\ndiv.loading-container {\n position: relative;\n align-items: center;\n}\n\nic-loading-indicator {\n --outer-color: transparent;\n}\n\n@keyframes loading-animation {\n 0% {\n width: 0%;\n left: 0%;\n }\n\n 25% {\n width: 0%;\n left: 0%;\n opacity: 0;\n }\n\n 50% {\n width: 100%;\n left: 0%;\n opacity: 1;\n }\n\n 75% {\n width: 0%;\n left: 100%;\n }\n\n 100% {\n width: 0%;\n left: 100%;\n opacity: 0;\n }\n}\n\n/ Icons /\n\ndiv.icon-container {\n box-sizing: border-box;\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n::slotted(svg) {\n width: var(--icon-width) !important;\n height: var(--icon-height) !important;\n fill: currentcolor !important;\n pointer-events: none;\n}\n\n:host(.button-variant-icon) .button .icon-container {\n margin: 0;\n pointer-events: none;\n}\n\n/* SEARCH /\n\n:host(.search-submit-button) ::slotted(svg) {\n --icon-height: 20px;\n --icon-width: 20px;\n}\n\n:host(.search-submit-button-small) ::slotted(svg) {\n --icon-height: 16px;\n --icon-width: 16px;\n}\n\n:host(.clear-button) {\n margin: 0 var(--ic-space-xxs);\n}\n\n:host(.clear-button) .button:focus {\n box-shadow: none;\n}\n\n:host(.search-submit-button) .button:focus {\n box-shadow: none;\n}\n\n:host(.search-submit-button) .button:not(:active):focus {\n box-shadow: none;\n background-color: var(--ic-action-default-bg-hover);\n}\n\n:host(.search-submit-button) {\n display: flex;\n align-items: center;\n margin: 0 var(--ic-space-xxs);\n}\n\n:host(.menu-close-button) ::slotted(svg) {\n --icon-height: 14px;\n --icon-width: 14px;\n}\n\n:host(.popout-menu-button) .button {\n justify-content: left;\n border-radius: 0;\n white-space: pre-line;\n text-align: start;\n}\n\n:host(.popout-menu-button) div.icon-container {\n flex: none;\n}\n\n:host(.popout-menu-button) .button:focus {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n}\n\n.ic-button-describedby {\n display: none;\n}\n\n:host .ic-tooltip {\n display: block;\n}\n\n/ High Contrast /\n@media (forced-colors: active) {\n .button {\n border: 2px solid transparent;\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Listen,\n Method,\n Prop,\n Watch,\n h,\n} from \"@stencil/core\";\n\nimport { getThemeFromContext, inheritAttributes } from \"../../utils/helpers\";\nimport { IC_INHERITED_ARIA } from \"../../utils/constants\";\nimport {\n IcButtonSizes,\n IcButtonTypes,\n IcButtonVariants,\n IcButtonTooltipPlacement,\n} from \"./ic-button.types\";\nimport {\n IcTheme,\n IcThemeForeground,\n IcThemeForegroundEnum,\n} from \"../../utils/types\";\n\nlet buttonIds = 0;\n\n/\n * @slot icon - Content will be placed to the left of the button label.\n /\n@Component({\n tag: \"ic-button\",\n styleUrl: \"ic-button.css\",\n shadow: true,\n})\nexport class Button {\n @Element() el: HTMLIcButtonElement;\n /\n Determines whether the button should be in disabled state.\n /\n @Prop() disabled?: boolean = false;\n /\n Determines whether the button should be in loading state.\n /\n @Prop() loading?: boolean = false;\n /\n The type of the button.\n /\n @Prop() type?: IcButtonTypes = \"button\";\n /\n The URL that the link points to. This will render the button as an \"a\" tag.\n /\n @Prop() href?: string;\n /\n Where to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n /\n @Prop() target?: string;\n /\n The relationship of the linked URL as space-separated link types.\n /\n @Prop() rel?: string;\n /\n Prompts the user to save the linked URL instead of navigating to it.\n /\n @Prop() download?: string \| boolean = false;\n /\n Hints at the human language of the linked URL.\n /\n @Prop() hreflang?: string;\n /\n How much of the referrer to send when following the link.\n /\n @Prop() referrerpolicy?: ReferrerPolicy;\n /\n The button variant to be displayed.\n /\n @Prop() variant?: IcButtonVariants = \"primary\";\n /\n The size of the button to be displayed.\n /\n @Prop() size?: IcButtonSizes = \"default\";\n /\n Fill the width of the container if true.\n /\n @Prop() fullWidth?: boolean = false;\n /\n Disable ic-tooltip which is shown for icon variant. Title or aria-label must be set if this prop is not applied.\n /\n @Prop() disableTooltip?: boolean = false;\n /\n The position of the tooltip in relation to the button.\n /\n @Prop() tooltipPlacement?: IcButtonTooltipPlacement = \"bottom\";\n /\n Determines the whether the appearance of the button is dark, light, or the default.\n /\n @Prop({ mutable: true }) appearance?: IcThemeForeground = \"default\";\n /\n Emitted when button has focus\n /\n @Event() icFocus!: EventEmitter<void>;\n /\n Emitted when button has blur\n /\n @Event() icBlur!: EventEmitter<void>;\n\n // CalculatedWidth must have a default value, since width is only calculated once button is rendered (with text).\n private calculatedWidth: number = 68;\n private inheritedAttributes: { [k: string]: unknown } = {};\n private buttonEl: HTMLElement;\n private hasTooltip: boolean = false;\n private buttonIdNum = buttonIds++;\n private tooltipEl: HTMLIcTooltipElement;\n private id: string;\n\n @Watch(\"loading\")\n calculateWidth(): void {\n // Assume even padding on left and right\n this.calculatedWidth = this.el.offsetWidth - 2 this.el.offsetLeft;\n }\n\n @Listen(\"click\", { capture: true })\n handleHostClick(event: Event): void {\n if (this.disabled \|\| this.loading) {\n event.stopImmediatePropagation();\n }\n }\n\n @Listen(\"icThemeChange\", { target: \"document\" })\n themeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.updateTheme(theme.mode);\n }\n\n /*\n Sets focus on the native `button`\n /\n @Method()\n async setFocus(): Promise<void> {\n if (this.buttonEl) {\n this.buttonEl.focus();\n }\n }\n\n /\n @internal Updates tooltip/aria-label text - needed as can't watch an aria attribute change.\n /\n @Method()\n async updateAriaLabel(newValue: string): Promise<void> {\n if (this.hasTooltip) {\n this.tooltipEl.label = newValue;\n this.buttonEl.setAttribute(\"aria-label\", newValue);\n }\n }\n\n private getLoadingBarWidth(): { [key: string]: string } {\n return { width: `${this.calculatedWidth.toString()}px` };\n }\n\n private hasIconSlot(): boolean {\n const iconEl = this.el.querySelector(`[slot=\"icon\"]`);\n if (iconEl != null) {\n return true;\n }\n return false;\n }\n\n private handleHiddenFormButtonClick(form: HTMLFormElement): void {\n const hiddenFormButton = document.createElement(\"button\");\n\n hiddenFormButton.setAttribute(\"type\", this.el.type);\n hiddenFormButton.style.display = \"none\";\n\n form.appendChild(hiddenFormButton);\n\n hiddenFormButton.click();\n hiddenFormButton.remove();\n }\n\n private handleClick = (): void => {\n if (\n (this.el.type === \"submit\" \|\| this.el.type === \"reset\") &&\n !!this.el.closest(\"FORM\")\n ) {\n this.handleHiddenFormButtonClick(this.el.closest(\"FORM\"));\n }\n };\n\n private onFocus = () => {\n this.icFocus.emit();\n };\n\n private onBlur = () => {\n this.icBlur.emit();\n };\n\n private updateTheme(newTheme: IcThemeForeground = null): void {\n const foregroundColor = getThemeFromContext(this.el, newTheme \|\| null);\n\n if (foregroundColor !== IcThemeForegroundEnum.Default) {\n this.appearance = foregroundColor;\n }\n }\n\n componentWillLoad(): void {\n this.inheritedAttributes = inheritAttributes(this.el, [\n ...IC_INHERITED_ARIA,\n \"aria-expanded\",\n \"title\",\n ]);\n\n const id = this.el.id;\n this.id = id !== undefined ? id : null;\n this.hasTooltip = this.variant === \"icon\";\n }\n\n componentDidLoad(): void {\n this.calculateWidth();\n this.updateTheme();\n }\n\n render() {\n const TagType = (this.href && \"a\") \|\| \"button\";\n const {\n title,\n \"aria-label\": ariaLabel,\n ...restInheritedAttributes\n } = this.inheritedAttributes;\n const buttonAttrs =\n TagType === \"button\"\n ? { type: this.type, disabled: this.disabled }\n : {\n download: this.download !== false ? this.download : null,\n href: this.href,\n rel: this.rel,\n target: this.target,\n referrerpolicy: this.referrerpolicy,\n hreflang: this.hreflang,\n };\n const newTitle = title && (title as string);\n const titleAttr = this.hasTooltip ? {} : { title: newTitle };\n let tooltipText = \"\";\n if (this.hasTooltip) {\n if (newTitle !== undefined) {\n tooltipText = newTitle;\n } else if (ariaLabel !== null) {\n tooltipText = ariaLabel as string;\n }\n }\n\n let describedBy: string = null;\n let buttonId: string = null;\n if (this.hasTooltip) {\n buttonId =\n this.id !== null\n ? `ic-button-with-tooltip-${this.id}`\n : `ic-button-with-tooltip-${this.buttonIdNum}`;\n describedBy = `ic-tooltip-${buttonId}`;\n }\n\n const ButtonContent = () => {\n return (\n <TagType\n class=\"button\"\n aria-disabled={this.loading \|\| this.disabled ? \"true\" : null}\n aria-label={this.loading ? \"Loading\" : ariaLabel}\n {...buttonAttrs}\n {...restInheritedAttributes}\n {...titleAttr}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n ref={(el) => (this.buttonEl = el)}\n id={buttonId}\n aria-describedby={describedBy}\n >\n {this.hasIconSlot() && !this.loading && (\n <div class=\"icon-container\">\n <slot name=\"icon\" />\n </div>\n )}\n {this.loading ? (\n <div class=\"loading-container\" style={this.getLoadingBarWidth()}>\n <ic-loading-indicator\n type=\"linear\"\n appearance={\n this.variant === \"primary\" \|\|\n this.variant === \"destructive\" \|\|\n this.appearance === IcThemeForegroundEnum.Dark \|\|\n this.appearance === IcThemeForegroundEnum.Light\n ? \"light\"\n : \"dark\"\n }\n ></ic-loading-indicator>\n </div>\n ) : (\n <slot />\n )}\n </TagType>\n );\n };\n\n return (\n <Host\n class={{\n [\"disabled\"]: this.disabled && !this.loading,\n [`button-variant-${this.variant}`]: true,\n [`button-size-${this.size}`]: true,\n [\"loading\"]: this.loading,\n [\"dark\"]: this.appearance === IcThemeForegroundEnum.Dark,\n [\"light\"]: this.appearance === IcThemeForegroundEnum.Light,\n [\"full-width\"]: this.fullWidth,\n }}\n onClick={this.handleClick}\n >\n {this.hasTooltip && (\n <ic-tooltip\n class={{ [\"tooltip-disabled-button\"]: this.disableTooltip }}\n ref={(el) => (this.tooltipEl = el)}\n label={tooltipText}\n target={buttonId}\n placement={this.tooltipPlacement}\n >\n <ButtonContent />\n </ic-tooltip>\n )}\n\n {!this.hasTooltip && <ButtonContent />}\n </Host>\n );\n }\n}\n","@import \"../../global/normalise.css\";\n\n:host {\n /\n @prop --circular-diameter: Diameter of the circular-indicator\n /\n\n display: block;\n\n --linear-border-radius: 4px;\n --inner-color: var(--ic-action-default);\n --outer-color: var(--ic-architectural-100);\n --label-color: var(--ic-color-primary-text);\n --margin: none;\n --linear-line-height: var(--ic-space-xs);\n}\n\n:host(.light) {\n --inner-color: var(--ic-architectural-white);\n --outer-color: var(--ic-architectural-800);\n --label-color: var(--ic-architectural-white);\n}\n\n.ic-loading-container {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n}\n\n:host([size=\"small\"]) {\n --circular-diameter: 40px;\n --linear-line-height: var(--ic-space-xxs);\n}\n\n:host([size=\"default\"]) {\n --circular-diameter: 80px;\n}\n\n:host([size=\"large\"]) {\n --circular-diameter: 120px;\n}\n\n:host([size=\"icon\"]) {\n display: inline-block;\n\n --margin: var(--ic-space-xxxs);\n --circular-diameter: 20px;\n}\n\n:host([label]) {\n --margin: 0 0 var(--ic-space-xs) 0;\n}\n\n.ic-loading-label {\n white-space: nowrap;\n color: var(--label-color);\n margin-left: var(--label-margin-left);\n}\n\n.ic-loading-circular-outer {\n height: var(--circular-diameter);\n width: var(--circular-diameter);\n\n}\n\n.ic-loading-circular-outer.indeterminate {\n animation: circular-animation 1s linear;\n animation-iteration-count: infinite;\n}\n\n@keyframes circular-animation {\n 100% {\n transform: rotate(360deg);\n }\n}\n\n.ic-loading-circular-outer,\n.ic-loading-linear-outer {\n margin: var(--margin);\n}\n\n.ic-loading-linear-outer {\n background-color: var(--outer-color);\n height: var(--linear-line-height);\n width: 100%;\n border-radius: var(--linear-border-radius);\n overflow: hidden;\n}\n\n.ic-loading-linear-inner {\n position: relative;\n height: 100%;\n background-color: var(--inner-color);\n border-radius: var(--linear-border-radius);\n}\n\n.indeterminate > .ic-loading-linear-inner {\n animation: linear-animation 2s infinite;\n}\n\n.determinate > .ic-loading-linear-inner {\n transition: width 0.5s;\n width: var(--linear-width);\n}\n\n:host([full-width]) {\n --linear-border-radius: none;\n}\n\n@keyframes linear-animation {\n 0% {\n width: 0%;\n left: -1%;\n }\n\n 25% {\n width: 0%;\n left: -1%;\n }\n\n 50% {\n width: 101%;\n left: -1%;\n }\n\n 75% {\n width: 0%;\n left: 101%;\n }\n\n 100% {\n width: 0%;\n left: 101%;\n }\n}\n\n.ic-loading-circular-svg {\n position: relative;\n width: 100%;\n height: 100%;\n transform: rotate(-90deg);\n}\n\n.ic-loading-circular-svg circle {\n width: 100%;\n height: 100%;\n fill: none;\n stroke: var(--outer-color);\n stroke-width: var(--circular-line-width);\n stroke-linecap: round;\n}\n\n/ --stroke-dash-array calculated via dashArray method /\n.ic-loading-circular-svg circle:nth-child(2) {\n --circular-indeterminate: calc(\n (0.25 var(--stroke-dasharray)) - var(--stroke-dasharray)\n );\n\n stroke-dasharray: var(--stroke-dasharray), var(--stroke-dasharray);\n stroke-dashoffset: var(--stroke-dashoffset, var(--circular-indeterminate));\n stroke: var(--inner-color);\n}\n\n/ High Contrast /\n@media (forced-colors: active) {\n .indeterminate > .ic-loading-circular-inner {\n forced-color-adjust: none;\n }\n\n .ic-loading-linear-outer {\n border: var(--ic-hc-border);\n }\n\n .ic-loading-linear-inner {\n background-color: canvastext;\n }\n\n .ic-loading-circular-svg circle {\n stroke: Background;\n }\n\n .ic-loading-circular-svg circle:nth-child(2) {\n stroke: canvastext;\n }\n}\n","import { Component, Element, h, Host, Prop, State, Watch } from \"@stencil/core\";\nimport {\n IcLoadingCircleXYR,\n IcLoadingSizes,\n IcLoadingTypes,\n} from \"./ic-loading-indicator.types\";\nimport {\n IcThemeForegroundEnum,\n IcThemeForegroundNoDefault,\n} from \"../../utils/types\";\n\n@Component({\n tag: \"ic-loading-indicator\",\n styleUrl: \"ic-loading-indicator.css\",\n shadow: true,\n})\nexport class LoadingIndicator {\n @Element() host: HTMLIcLoadingIndicatorElement;\n\n /*\n The current amount of progress made.\n * If not provided, component acts as an indeterminate loading indicator.\n /\n @Prop() progress?: number;\n\n /\n The minimum value that the progress value can take.\n * Used to calculate the proportional width of the progress bar.\n /\n @Prop() min?: number = 0;\n\n /\n The maximum value that the progress value can take.\n * Used to calculate the proportional width of the progress bar.\n /\n @Prop() max?: number = 100;\n\n /\n The label to be displayed beneath the loading indicator.\n * Display a changing label by separating multiple messages with forward slashes.\n /\n @Prop() label?: string;\n\n /\n Provide a description to be set as the aria-label of the loading indicator when not using a visible label.\n /\n @Prop() description?: string = \"Loading\";\n\n /\n The time in milliseconds before the label changes.\n /\n @Prop() labelDuration?: number = 8000;\n\n /\n The size of the loading indicator.\n /\n @Prop({ reflect: true }) size?: IcLoadingSizes = \"default\";\n\n /\n The type of indicator, either linear or circular.\n /\n @Prop({ reflect: true }) type?: IcLoadingTypes = \"circular\";\n\n /\n When linear, determines whether the full-width version (i.e. without a border radius) should be displayed.\n /\n @Prop({ reflect: true }) fullWidth?: boolean = false;\n\n /\n Determines whether the dark or light loading indicator should be displayed.\n /\n @Prop() appearance?: IcThemeForegroundNoDefault = \"dark\";\n\n @State() indicatorLabel: string;\n @State() indeterminate: boolean;\n @State() showSecond: boolean = false;\n @State() circularLineWidth: number;\n @State() circularDiameter: number;\n\n @Watch(\"label\")\n watchPropHandler(): void {\n this.updateLabel();\n }\n\n @Watch(\"progress\")\n watchProgressHandler(): void {\n this.updateCircularProgressMeter();\n }\n\n private outerElement?: HTMLDivElement;\n private innerElement?: HTMLDivElement;\n private labelList: string[];\n private circularMeter: SVGCircleElement;\n\n private updateCircularProgressMeter = () => {\n if (!this.indeterminate) {\n this.circularMeter.style.setProperty(\n \"--progress-value\",\n String(this.progress)\n );\n }\n };\n\n private getLabel = (\n labelIndex: number,\n setLabel: (label: string) => void\n ) => {\n return new Promise(() => {\n setInterval(() => {\n if (labelIndex < this.labelList.length - 1) {\n labelIndex++;\n } else {\n labelIndex = 0;\n }\n setLabel(this.labelList[labelIndex]);\n }, this.labelDuration);\n });\n };\n\n private getLabelVariant = () => {\n let variant: \"label\" \| \"h4\" \| \"h2\" = \"h4\";\n const width = this.outerElement?.offsetWidth;\n if (this.size === \"small\" \|\| (this.type === \"circular\" && width < 60)) {\n variant = \"label\";\n } else if (\n this.size === \"large\" \|\|\n (this.type === \"circular\" && width >= 120)\n ) {\n variant = \"h2\";\n }\n return variant;\n };\n\n // Sets the circular indicator line width - accounting for the circle size being altered using the CSS custom property\n private setCircleLineWidth = () => {\n const { offsetWidth: width } = this.outerElement;\n if (width) {\n this.circularLineWidth = width 0.1;\n this.circularDiameter = width;\n this.outerElement.style.setProperty(\n \"--circular-line-width\",\n `${this.circularLineWidth}px`\n );\n }\n };\n\n private setLinearDeterminateWidth = () => {\n if (!this.innerElement) return;\n // Ensure progress cannot be out of bounds\n\n const progress = Math.min(this.max, Math.max(this.min, this.progress));\n const proportion = (progress - this.min) / (this.max - this.min);\n this.showSecond = proportion > 0.5;\n if (this.showSecond) {\n this.innerElement.classList.remove(\"clip\");\n } else {\n this.innerElement.classList.add(\"clip\");\n }\n this.innerElement.style.setProperty(\n \"--linear-width\",\n `${proportion * 100}%`\n );\n };\n\n private calcOuterClass = (): string => {\n let cls = `ic-loading-${this.type}-outer`;\n cls += this.indeterminate ? \" indeterminate\" : \" determinate\";\n return cls;\n };\n\n private updateLabel = (): void => {\n if (this.label !== undefined) {\n this.labelList = this.label.split(\"/\");\n const labelIndex = 0;\n this.indicatorLabel = this.labelList[labelIndex];\n if (this.labelList.length > 1) {\n this.getLabel(labelIndex, (label) => {\n this.indicatorLabel = label;\n });\n }\n }\n };\n\n private setCircleXY = (): IcLoadingCircleXYR => {\n if (this.circularDiameter) {\n const r = this.circularDiameter / 2;\n const x = r;\n const y = r;\n const nextRadius = r - this.circularLineWidth / 2;\n this.setDashSteps(nextRadius);\n\n return { x, y, r: nextRadius };\n }\n return { x: 0, y: 0, r: 0 };\n };\n\n private setDashSteps = (radius: number) => {\n const dashArray = 2 * Math.PI * radius;\n const progress = Math.min(Math.max(this.progress, this.min), this.max);\n const proportion = -1 - (progress - this.min) / (this.max - this.min);\n\n this.circularMeter.style.setProperty(\n \"--stroke-dasharray\",\n `${dashArray}px`\n );\n\n if (!this.indeterminate) {\n this.circularMeter.style.setProperty(\n \"--circular-steps-max\",\n String(this.max)\n );\n this.circularMeter.style.setProperty(\n \"--stroke-dashoffset\",\n `${proportion * dashArray}px`\n );\n }\n };\n\n componentWillLoad(): void {\n this.indeterminate = this.progress === undefined;\n this.updateLabel();\n }\n\n componentDidLoad(): void {\n if (this.type === \"circular\") {\n this.setCircleLineWidth();\n this.circularMeter = this.host.shadowRoot.querySelector(\n \".ic-loading-circular-svg circle:nth-child(2)\"\n );\n this.updateCircularProgressMeter();\n }\n\n if (Number(this.progress) >= 0 && this.type === \"linear\") {\n this.setLinearDeterminateWidth();\n }\n }\n\n componentWillUpdate(): void {\n this.indeterminate = this.progress === undefined;\n }\n\n componentDidUpdate(): void {\n if (Number(this.progress) >= 0 && this.type === \"linear\") {\n this.setLinearDeterminateWidth();\n }\n }\n\n render() {\n const { appearance, label, description, size } = this;\n const { x, y, r } = this.setCircleXY();\n\n return (\n <Host class={{ [\"light\"]: appearance === IcThemeForegroundEnum.Light }}>\n <div class=\"ic-loading-container\">\n <div\n ref={(el) => (this.outerElement = el as HTMLDivElement)}\n class={this.calcOuterClass()}\n role=\"progressbar\"\n aria-labelledby={\n this.label && this.size !== \"icon\" && \"ic-loading-label\"\n }\n aria-label={description}\n aria-valuenow={this.progress}\n aria-valuemin={this.min}\n aria-valuemax={this.max}\n >\n <div\n ref={(el) => (this.innerElement = el as HTMLDivElement)}\n class={`ic-loading-${this.type}-inner`}\n >\n {this.type === \"circular\" && (\n <svg\n class=\"ic-loading-circular-svg\"\n viewBox={`0 0 ${this.circularDiameter \|\| 0} ${\n this.circularDiameter \|\| 0\n }`}\n >\n <circle cx={`${x}`} cy={`${y}`} r={`${r}`}></circle>\n <circle cx={`${x}`} cy={`${y}`} r={`${r}`}></circle>\n </svg>\n )}\n </div>\n </div>\n {label && size !== \"icon\" && (\n <ic-typography\n id=\"ic-loading-label\"\n class=\"ic-loading-label\"\n role=\"status\"\n variant={this.getLabelVariant()}\n >\n <p>{this.indicatorLabel}</p>\n </ic-typography>\n )}\n </div>\n </Host>\n );\n }\n}\n","@import \"../../global/normalise.css\";\n\n:host(.ic-tooltip) .ic-tooltip-container {\n background-color: var(--ic-architectural-800);\n color: #ffff;\n text-align: center;\n padding: var(--ic-space-xxxs) 10px;\n border-radius: var(--ic-border-radius);\n position: absolute;\n max-width: 320px;\n display: none;\n z-index: calc(var(--ic-z-index-overlay) / 2);\n box-shadow: var(--ic-elevation-overlay);\n}\n\n:host(.tooltip-navigation-item:not(.tooltip-navigation-item-side-nav-collapsed))\n .ic-tooltip-container,\n:host(.tooltip-disabled-button) .ic-tooltip-container {\n display: none !important;\n}\n\n:host(.tooltip-long-label-navigation-item-side-nav-expanded)\n .ic-tooltip-container[data-show] {\n display: block !important;\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow,\n:host(.ic-tooltip) .ic-tooltip-arrow::before {\n position: absolute;\n background: inherit;\n width: var(--ic-space-md);\n height: var(--ic-space-md);\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow {\n visibility: hidden;\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow::before {\n visibility: visible;\n content: \"\";\n}\n\n:host(.ic-tooltip) .ic-tooltip-container[data-show] {\n display: block;\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"top\"]\n > .ic-tooltip-arrow {\n bottom: calc(-1 * var(--ic-space-md));\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"top\"]\n > .ic-tooltip-arrow::before {\n border-radius: 0 0 var(--ic-border-radius) var(--ic-border-radius);\n left: 0;\n height: var(--ic-space-xxs);\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"bottom\"]\n > .ic-tooltip-arrow {\n top: calc(-1 * var(--ic-space-xxs));\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"bottom\"]\n > .ic-tooltip-arrow::before {\n border-radius: var(--ic-border-radius) var(--ic-border-radius) 0 0;\n left: 0;\n height: var(--ic-space-xxs);\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"left\"]\n > .ic-tooltip-arrow {\n right: var(--ic-space-xxxs);\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"left\"]\n > .ic-tooltip-arrow::before {\n border-radius: 0 var(--ic-border-radius) var(--ic-border-radius) 0;\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"right\"]\n > .ic-tooltip-arrow {\n left: -14px;\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"right\"]\n > .ic-tooltip-arrow::before {\n border-radius: var(--ic-border-radius) 0 0 var(--ic-border-radius);\n}\n\n:host([target=\"ic-button-with-tooltip-search-submit-button\"])\n .ic-tooltip-container,\n:host([target=\"ic-button-with-tooltip-clear-button\"]) .ic-tooltip-container {\n z-index: calc(var(--ic-z-index-popup-menu) + 1);\n}\n\n@media (forced-colors: active) {\n :host(.ic-tooltip) .ic-tooltip-container {\n border: var(--ic-hc-border);\n }\n}\n","import { Component, Element, Host, Prop, h, Watch } from \"@stencil/core\";\nimport { Instance, createPopper } from \"@popperjs/core\";\nimport { IcTooltipPlacements } from \"./ic-tooltip.types\";\nimport { onComponentRequiredPropUndefined } from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-tooltip\",\n styleUrl: \"ic-tooltip.css\",\n shadow: true,\n})\nexport class Tooltip {\n @Element() el: HTMLIcTooltipElement;\n\n /*\n The ID of the element the tooltip is describing - for when aria-labelledby or aria-describedby is used.\n /\n @Prop({ reflect: true }) target?: string;\n\n /\n The position of the tool-tip in relation to the parent element.\n /\n @Prop() placement?: IcTooltipPlacements = \"bottom\";\n\n /\n The text to display on the tooltip.\n */\n @Prop() label!: string;\n\n @Watch(\"label\")\n updateLabel(newValue: string): void {\n const describedBySpan = this.el.previousElementSibling as HTMLElement;\n if (describedBySpan !== null) {\n describedBySpan.innerText = newValue;\n }\n }\n\n private toolTip: HTMLDivElement;\n private arrow: HTMLDivElement;\n private mouseOverTool: boolean = false;\n private showEvents = [\"mouseenter\", \"focusin\"];\n private instantHideEvents = [\"focusout\"];\n private delayedHideEvents = [\"mouseleave\"];\n private popperInstance: Instance;\n\n private show = (popper: Instance) => {\n this.toolTip.setAttribute(\"data-show\", \"\");\n popper.setOptions((options) => ({\n ...options,\n modifiers: [\n ...options.modifiers,\n { name: \"eventListeners\", enabled: true },\n ],\n }));\n popper.update();\n };\n\n private hide = (popper: Instance) => {\n this.toolTip.removeAttribute(\"data-show\");\n popper.setOptions((options) => ({\n ...options,\n modifiers: [\n ...options.modifiers,\n { name: \"eventListeners\", enabled: false },\n ],\n }));\n };\n\n private checkCloseTooltip = (popper: Instance) => {\n setTimeout(() => {\n if (!this.mouseOverTool) {\n this.hide(popper);\n }\n }, 100);\n };\n\n private mouseEnterTooltip = () => {\n this.mouseOverTool = true;\n };\n\n private mouseLeaveTooltip = (popper: Instance) => {\n this.mouseOverTool = false;\n this.checkCloseTooltip(popper);\n };\n\n private handleKeyDown = (key: string) => {\n if (key === \"Escape\") {\n this.hide(this.popperInstance);\n }\n };\n\n private manageEventListeners = (action: \"add\" \| \"remove\") => {\n const method =\n action === \"add\" ? \"addEventListener\" : \"removeEventListener\";\n\n this.showEvents.forEach((event) => {\n this.el[method](event, () => this.show(this.popperInstance));\n this.toolTip[method](event, () => this.mouseEnterTooltip());\n });\n\n this.instantHideEvents.forEach((event) => {\n this.el[method](event, () => this.hide(this.popperInstance));\n });\n\n this.delayedHideEvents.forEach((event) => {\n this.el[method](event, () => this.checkCloseTooltip(this.popperInstance));\n this.toolTip[method](event, () =>\n this.mouseLeaveTooltip(this.popperInstance)\n );\n });\n\n document[method](\"keydown\", (event: KeyboardEvent) =>\n this.handleKeyDown(event.key)\n );\n };\n\n private screenReaderOnlyStyles = {\n position: \"absolute\",\n left: \"-10000px\",\n top: \"auto\",\n width: \"1px\",\n height: \"1px\",\n overflow: \"hidden\",\n };\n\n componentDidLoad(): void {\n this.popperInstance = createPopper(this.el, this.toolTip, {\n placement: this.placement,\n modifiers: [\n {\n name: \"offset\",\n options: {\n offset: [0, 10],\n },\n },\n {\n name: \"arrow\",\n options: {\n element: this.arrow,\n },\n },\n ],\n });\n\n this.manageEventListeners(\"add\");\n\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Tooltip\"\n );\n\n if (this.target !== undefined) {\n const ariaDescribedBy = document.createElement(\"span\");\n ariaDescribedBy.id = `ic-tooltip-${this.target}`;\n ariaDescribedBy.innerText = this.label;\n ariaDescribedBy.classList.add(\"ic-tooltip-label\");\n Object.assign(ariaDescribedBy.style, this.screenReaderOnlyStyles);\n\n this.el.insertAdjacentElement(\"beforebegin\", ariaDescribedBy);\n }\n }\n\n disconnectedCallback(): void {\n this.manageEventListeners(\"remove\");\n }\n\n render() {\n const { label } = this;\n return (\n <Host class={{ \"ic-tooltip\": true }}>\n <div\n ref={(el) => (this.toolTip = el as HTMLDivElement)}\n role=\"tooltip\"\n class=\"ic-tooltip-container\"\n >\n <ic-typography variant=\"caption\">{label}</ic-typography>\n <div\n ref={(el) => (this.arrow = el as HTMLDivElement)}\n class=\"ic-tooltip-arrow\"\n data-popper-arrow\n ></div>\n </div>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-button.ic-loading-indicator.ic-tooltip.entry.cjs.js","mappings":"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","names":["getThemeFromContext","IcThemeForegroundEnum","inheritAttributes","IC_INHERITED_ARIA","h","Host","createPopper","onComponentRequiredPropUndefined"],"sources":["./src/components/ic-button/ic-button.css?tag=ic-button&encapsulation=shadow","./src/components/ic-button/ic-button.tsx","./src/components/ic-loading-indicator/ic-loading-indicator.css?tag=ic-loading-indicator&encapsulation=shadow","./src/components/ic-loading-indicator/ic-loading-indicator.tsx","./src/components/ic-tooltip/ic-tooltip.css?tag=ic-tooltip&encapsulation=shadow","./src/components/ic-tooltip/ic-tooltip.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n display: inline-block;\n\n --button-default: var(--ic-action-default);\n --button-default-hover: var(--ic-action-default-hover);\n --button-default-active: var(--ic-action-default-active);\n --button-default-background-hover: var(--ic-action-default-bg-hover);\n --button-default-background-active: var(--ic-action-default-bg-active);\n --icon-width: 100%;\n --icon-height: 100%;\n}\n\n.button {\n font-family: var(--ic-font-body-family);\n text-decoration: none;\n font-weight: 600;\n font-size: 14px;\n transition: var(--ic-easing-transition-fast);\n border-radius: var(--ic-border-radius);\n min-width: 100px;\n display: inline-flex;\n gap: var(--ic-space-xs);\n flex-direction: row;\n justify-content: center;\n align-items: center;\n background: none;\n border: none;\n box-sizing: border-box;\n white-space: nowrap;\n vertical-align: middle;\n}\n\n.button:hover {\n cursor: pointer;\n}\n\n.button:focus,\n:host .button:focus {\n box-shadow: var(--ic-border-focus);\n}\n\n:host(.light) .button:focus {\n box-shadow: var(--ic-border-focus);\n}\n\n.button:focus-visible {\n outline: var(--ic-hc-focus-outline);\n}\n\n:host(.dark) .button {\n --button-default: var(--ic-action-dark);\n --button-default-hover: var(--ic-action-dark);\n --button-default-active: var(--ic-action-dark);\n --button-default-background-hover: var(--ic-action-dark-bg-hover);\n --button-default-background-active: var(--ic-action-dark-bg-active);\n}\n\n:host(.light) .button {\n --button-default: var(--ic-action-light);\n --button-default-hover: var(--ic-action-light);\n --button-default-active: var(--ic-action-light);\n --button-default-background-hover: var(--ic-action-light-bg-hover);\n --button-default-background-active: var(--ic-action-light-bg-active);\n}\n\n:host(.button-variant-primary.light) .button {\n color: var(--ic-color-primary-text);\n\n --button-default-hover: var(--ic-action-light-hover);\n --button-default-active: var(--ic-action-light-active);\n}\n\n:host(.button-variant-primary.dark) .button {\n --button-default-hover: var(--ic-action-dark-hover);\n --button-default-active: var(--ic-action-dark-active);\n}\n\n:host(.disabled),\n:host(.disabled) .button,\n:host(.loading),\n:host(.loading) .button {\n pointer-events: none;\n}\n\n/* Variants /\n\n/ Primary /\n\n:host(.button-variant-primary) .button {\n color: var(--ic-architectural-white);\n background-color: var(--button-default);\n}\n\n:host(.button-variant-primary) .button:hover:not(:focus) {\n background-color: var(--button-default-hover);\n}\n\n:host(.button-variant-primary) .button:active:not(:focus),\n:host(.button-variant-primary.loading) .button {\n background-color: var(--button-default-active);\n}\n\n:host(.button-variant-primary.disabled) .button {\n background: var(--ic-architectural-200);\n color: var(--ic-architectural-300);\n}\n\n:host(.button-variant-primary.light.disabled) .button {\n background: var(--ic-architectural-600);\n color: var(--ic-architectural-500);\n}\n\n/ Secondary /\n\n:host(.button-variant-secondary) .button {\n border: 1px solid var(--button-default);\n color: var(--button-default);\n}\n\n:host(.button-variant-secondary) .button:hover:not(:focus) {\n background-color: var(--button-default-background-hover);\n border-color: var(--button-default-hover);\n color: var(--button-default-hover);\n}\n\n:host(.button-variant-secondary) .button:active:not(:focus) {\n border-color: var(--button-default-active);\n background-color: var(--button-default-background-active);\n color: var(--button-default-active);\n}\n\n:host(.button-variant-secondary.loading) .button {\n border-color: var(--button-default-active);\n background-color: var(--button-default-background-active);\n color: var(--button-default-active);\n}\n\n:host(.button-variant-secondary.disabled) .button,\n:host(.button-variant-secondary.disabled) .button:hover,\n:host(.button-variant-secondary.disabled) .button:active {\n border-color: var(--ic-architectural-300);\n color: var(--ic-architectural-300);\n background: none;\n}\n\n:host(.button-variant-secondary.light.disabled) .button,\n:host(.button-variant-secondary.light.disabled) .button:hover,\n:host(.button-variant-secondary.light.disabled) .button:active {\n border-color: var(--ic-architectural-500);\n color: var(--ic-architectural-500);\n background: none;\n}\n\n/ Tertiary /\n\n:host(.button-variant-tertiary) .button {\n color: var(--button-default);\n}\n\n:host(.button-variant-tertiary) .button:hover:not(:focus) {\n background-color: var(--button-default-background-hover);\n color: var(--button-default-hover);\n}\n\n:host(.button-variant-tertiary) .button:active:not(:focus),\n:host(.button-variant-tertiary.loading) .button {\n background-color: var(--button-default-background-active);\n color: var(--button-default-active);\n}\n\n:host(.button-variant-tertiary.disabled) .button,\n:host(.button-variant-tertiary.disabled) .button:hover,\n:host(.button-variant-tertiary.disabled) .button:active {\n border-color: var(--ic-architectural-300);\n color: var(--ic-architectural-300);\n background: none;\n}\n\n:host(.button-variant-tertiary.light.disabled) .button,\n:host(.button-variant-tertiary.light.disabled) .button:hover,\n:host(.button-variant-tertiary.light.disabled) .button:active {\n border-color: var(--ic-architectural-500);\n color: var(--ic-architectural-500);\n background: none;\n}\n\n/ Icon /\n\n:host(.button-variant-icon) .button {\n color: var(--button-default);\n min-width: 0;\n}\n\n:host(.button-variant-icon) .button:hover:not(:focus) {\n background-color: var(--button-default-background-hover);\n color: var(--button-default-hover);\n}\n\n:host(.button-variant-icon) .button:active:not(:focus),\n:host(.button-variant-icon.loading) .button {\n background-color: var(--button-default-background-active);\n color: var(--button-default-active);\n}\n\n:host(.button-variant-icon.disabled) .button,\n:host(.button-variant-icon.disabled) .button:hover,\n:host(.button-variant-icon.disabled) .button:active {\n color: var(--ic-architectural-300);\n background: none;\n}\n\n/ Destructive /\n\n:host(.button-variant-destructive) .button {\n color: var(--ic-architectural-white);\n background-color: var(--ic-action-destructive);\n text-transform: uppercase;\n}\n\n:host(.button-variant-destructive) .button:hover:not(:focus) {\n background-color: var(--ic-action-destructive-hover);\n}\n\n:host(.button-variant-destructive) .button:active:not(:focus),\n:host(.button-variant-destructive.loading) .button {\n background-color: var(--ic-action-destructive-active);\n}\n\n:host(.button-variant-destructive.disabled) .button {\n background: var(--ic-architectural-200);\n color: var(--ic-architectural-300);\n}\n\n/ Sizing /\n\n:host(.button-size-default) .button {\n height: 40px;\n padding: var(--ic-space-xs) var(--ic-space-md);\n}\n\n:host(.button-size-small) .button {\n height: var(--ic-space-xl);\n padding: var(--ic-space-xxs) var(--ic-space-md);\n}\n\n:host(.button-size-large) .button {\n height: var(--ic-space-xxl);\n padding: var(--ic-space-sm) var(--ic-space-md);\n}\n\n:host(.button-size-default.button-variant-icon) .button {\n height: var(--ic-space-xl);\n width: var(--ic-space-xl);\n padding: 6px;\n}\n\n:host(.button-size-small.button-variant-icon) .button {\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n padding: var(--ic-space-xxs);\n}\n\n:host(.button-size-large.button-variant-icon) .button {\n height: 40px;\n width: 40px;\n padding: var(--ic-space-xs);\n}\n\n/ Width /\n:host(.full-width),\n:host(.full-width) .button {\n width: 100%;\n}\n\n/ Loading /\n\ndiv.loading-container {\n position: relative;\n align-items: center;\n}\n\nic-loading-indicator {\n --outer-color: transparent;\n}\n\n@keyframes loading-animation {\n 0% {\n width: 0%;\n left: 0%;\n }\n\n 25% {\n width: 0%;\n left: 0%;\n opacity: 0;\n }\n\n 50% {\n width: 100%;\n left: 0%;\n opacity: 1;\n }\n\n 75% {\n width: 0%;\n left: 100%;\n }\n\n 100% {\n width: 0%;\n left: 100%;\n opacity: 0;\n }\n}\n\n/ Icons /\n\ndiv.icon-container {\n box-sizing: border-box;\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n::slotted(svg) {\n width: var(--icon-width) !important;\n height: var(--icon-height) !important;\n fill: currentcolor !important;\n pointer-events: none;\n}\n\n:host(.button-variant-icon) .button .icon-container {\n margin: 0;\n pointer-events: none;\n}\n\n/* SEARCH /\n\n:host(.search-submit-button) ::slotted(svg) {\n --icon-height: 20px;\n --icon-width: 20px;\n}\n\n:host(.search-submit-button-small) ::slotted(svg) {\n --icon-height: 16px;\n --icon-width: 16px;\n}\n\n:host(.clear-button) {\n margin: 0 var(--ic-space-xxs);\n}\n\n:host(.clear-button) .button:focus {\n box-shadow: none;\n}\n\n:host(.search-submit-button) .button:focus {\n box-shadow: none;\n}\n\n:host(.search-submit-button) .button:not(:active):focus {\n box-shadow: none;\n background-color: var(--ic-action-default-bg-hover);\n}\n\n:host(.search-submit-button) {\n display: flex;\n align-items: center;\n margin: 0 var(--ic-space-xxs);\n}\n\n:host(.menu-close-button) ::slotted(svg) {\n --icon-height: 14px;\n --icon-width: 14px;\n}\n\n:host(.popout-menu-button) .button {\n justify-content: left;\n border-radius: 0;\n white-space: pre-line;\n text-align: start;\n}\n\n:host(.popout-menu-button) div.icon-container {\n flex: none;\n}\n\n:host(.popout-menu-button) .button:focus {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n}\n\n.ic-button-describedby {\n display: none;\n}\n\n:host .ic-tooltip {\n display: block;\n}\n\n/ High Contrast /\n@media (forced-colors: active) {\n .button {\n border: 2px solid transparent;\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Listen,\n Method,\n Prop,\n Watch,\n h,\n} from \"@stencil/core\";\n\nimport { getThemeFromContext, inheritAttributes } from \"../../utils/helpers\";\nimport { IC_INHERITED_ARIA } from \"../../utils/constants\";\nimport {\n IcButtonSizes,\n IcButtonTypes,\n IcButtonVariants,\n IcButtonTooltipPlacement,\n} from \"./ic-button.types\";\nimport {\n IcTheme,\n IcThemeForeground,\n IcThemeForegroundEnum,\n} from \"../../utils/types\";\n\nlet buttonIds = 0;\n\n/\n * @slot icon - Content will be placed to the left of the button label.\n /\n@Component({\n tag: \"ic-button\",\n styleUrl: \"ic-button.css\",\n shadow: true,\n})\nexport class Button {\n @Element() el: HTMLIcButtonElement;\n /\n If `true`, the button will be in disabled state.\n /\n @Prop() disabled?: boolean = false;\n /\n If `true`, the button will be in loading state.\n /\n @Prop() loading?: boolean = false;\n /\n The type of the button.\n /\n @Prop() type?: IcButtonTypes = \"button\";\n /\n The URL that the link points to. This will render the button as an \"a\" tag.\n /\n @Prop() href?: string;\n /\n The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n /\n @Prop() target?: string;\n /\n The relationship of the linked URL as space-separated link types.\n /\n @Prop() rel?: string;\n /\n If `true`, the user can save the linked URL instead of navigating to it.\n /\n @Prop() download?: string \| boolean = false;\n /\n The human language of the linked URL.\n /\n @Prop() hreflang?: string;\n /\n How much of the referrer to send when following the link.\n /\n @Prop() referrerpolicy?: ReferrerPolicy;\n /\n The variant of the button to be displayed.\n /\n @Prop() variant?: IcButtonVariants = \"primary\";\n /\n The size of the button to be displayed.\n /\n @Prop() size?: IcButtonSizes = \"default\";\n /\n If `true`, the button will fill the width of the container.\n /\n @Prop() fullWidth?: boolean = false;\n /\n If `true`, the ic-tooltip which is shown for icon variant will be disabled. Title or aria-label must be set if this prop is not applied.\n /\n @Prop() disableTooltip?: boolean = false;\n /\n The position of the tooltip in relation to the button.\n /\n @Prop() tooltipPlacement?: IcButtonTooltipPlacement = \"bottom\";\n /\n The appearance of the button, e.g. dark, light, or the default.\n /\n @Prop({ mutable: true }) appearance?: IcThemeForeground = \"default\";\n /\n Emitted when button has focus\n /\n @Event() icFocus!: EventEmitter<void>;\n /\n Emitted when button has blur\n /\n @Event() icBlur!: EventEmitter<void>;\n\n // CalculatedWidth must have a default value, since width is only calculated once button is rendered (with text).\n private calculatedWidth: number = 68;\n private inheritedAttributes: { [k: string]: unknown } = {};\n private buttonEl: HTMLElement;\n private hasTooltip: boolean = false;\n private buttonIdNum = buttonIds++;\n private tooltipEl: HTMLIcTooltipElement;\n private id: string;\n\n @Watch(\"loading\")\n calculateWidth(): void {\n // Assume even padding on left and right\n this.calculatedWidth = this.el.offsetWidth - 2 this.el.offsetLeft;\n }\n\n @Listen(\"click\", { capture: true })\n handleHostClick(event: Event): void {\n if (this.disabled \|\| this.loading) {\n event.stopImmediatePropagation();\n }\n }\n\n @Listen(\"icThemeChange\", { target: \"document\" })\n themeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.updateTheme(theme.mode);\n }\n\n /*\n Sets focus on the native `button`\n /\n @Method()\n async setFocus(): Promise<void> {\n if (this.buttonEl) {\n this.buttonEl.focus();\n }\n }\n\n /\n @internal Updates tooltip/aria-label text - needed as can't watch an ARIA attribute change.\n /\n @Method()\n async updateAriaLabel(newValue: string): Promise<void> {\n if (this.hasTooltip) {\n this.tooltipEl.label = newValue;\n this.buttonEl.setAttribute(\"aria-label\", newValue);\n }\n }\n\n private getLoadingBarWidth(): { [key: string]: string } {\n return { width: `${this.calculatedWidth.toString()}px` };\n }\n\n private hasIconSlot(): boolean {\n const iconEl = this.el.querySelector(`[slot=\"icon\"]`);\n if (iconEl != null) {\n return true;\n }\n return false;\n }\n\n private handleHiddenFormButtonClick(form: HTMLFormElement): void {\n const hiddenFormButton = document.createElement(\"button\");\n\n hiddenFormButton.setAttribute(\"type\", this.el.type);\n hiddenFormButton.style.display = \"none\";\n\n form.appendChild(hiddenFormButton);\n\n hiddenFormButton.click();\n hiddenFormButton.remove();\n }\n\n private handleClick = (): void => {\n if (\n (this.el.type === \"submit\" \|\| this.el.type === \"reset\") &&\n !!this.el.closest(\"FORM\")\n ) {\n this.handleHiddenFormButtonClick(this.el.closest(\"FORM\"));\n }\n };\n\n private onFocus = () => {\n this.icFocus.emit();\n };\n\n private onBlur = () => {\n this.icBlur.emit();\n };\n\n private updateTheme(newTheme: IcThemeForeground = null): void {\n const foregroundColor = getThemeFromContext(this.el, newTheme \|\| null);\n\n if (foregroundColor !== IcThemeForegroundEnum.Default) {\n this.appearance = foregroundColor;\n }\n }\n\n componentWillLoad(): void {\n this.inheritedAttributes = inheritAttributes(this.el, [\n ...IC_INHERITED_ARIA,\n \"aria-expanded\",\n \"title\",\n ]);\n\n const id = this.el.id;\n this.id = id !== undefined ? id : null;\n this.hasTooltip = this.variant === \"icon\";\n }\n\n componentDidLoad(): void {\n this.calculateWidth();\n this.updateTheme();\n }\n\n render() {\n const TagType = (this.href && \"a\") \|\| \"button\";\n const {\n title,\n \"aria-label\": ariaLabel,\n ...restInheritedAttributes\n } = this.inheritedAttributes;\n const buttonAttrs =\n TagType === \"button\"\n ? { type: this.type, disabled: this.disabled }\n : {\n download: this.download !== false ? this.download : null,\n href: this.href,\n rel: this.rel,\n target: this.target,\n referrerpolicy: this.referrerpolicy,\n hreflang: this.hreflang,\n };\n const newTitle = title && (title as string);\n const titleAttr = this.hasTooltip ? {} : { title: newTitle };\n let tooltipText = \"\";\n if (this.hasTooltip) {\n if (newTitle !== undefined) {\n tooltipText = newTitle;\n } else if (ariaLabel !== null) {\n tooltipText = ariaLabel as string;\n }\n }\n\n let describedBy: string = null;\n let buttonId: string = null;\n if (this.hasTooltip) {\n buttonId =\n this.id !== null\n ? `ic-button-with-tooltip-${this.id}`\n : `ic-button-with-tooltip-${this.buttonIdNum}`;\n describedBy = `ic-tooltip-${buttonId}`;\n }\n\n const ButtonContent = () => {\n return (\n <TagType\n class=\"button\"\n aria-disabled={this.loading \|\| this.disabled ? \"true\" : null}\n aria-label={this.loading ? \"Loading\" : ariaLabel}\n {...buttonAttrs}\n {...restInheritedAttributes}\n {...titleAttr}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n ref={(el) => (this.buttonEl = el)}\n id={buttonId}\n aria-describedby={describedBy}\n >\n {this.hasIconSlot() && !this.loading && (\n <div class=\"icon-container\">\n <slot name=\"icon\" />\n </div>\n )}\n {this.loading ? (\n <div class=\"loading-container\" style={this.getLoadingBarWidth()}>\n <ic-loading-indicator\n type=\"linear\"\n appearance={\n this.variant === \"primary\" \|\|\n this.variant === \"destructive\" \|\|\n this.appearance === IcThemeForegroundEnum.Dark \|\|\n this.appearance === IcThemeForegroundEnum.Light\n ? \"light\"\n : \"dark\"\n }\n ></ic-loading-indicator>\n </div>\n ) : (\n <slot />\n )}\n </TagType>\n );\n };\n\n return (\n <Host\n class={{\n [\"disabled\"]: this.disabled && !this.loading,\n [`button-variant-${this.variant}`]: true,\n [`button-size-${this.size}`]: true,\n [\"loading\"]: this.loading,\n [\"dark\"]: this.appearance === IcThemeForegroundEnum.Dark,\n [\"light\"]: this.appearance === IcThemeForegroundEnum.Light,\n [\"full-width\"]: this.fullWidth,\n }}\n onClick={this.handleClick}\n >\n {this.hasTooltip && (\n <ic-tooltip\n class={{ [\"tooltip-disabled-button\"]: this.disableTooltip }}\n ref={(el) => (this.tooltipEl = el)}\n label={tooltipText}\n target={buttonId}\n placement={this.tooltipPlacement}\n >\n <ButtonContent />\n </ic-tooltip>\n )}\n\n {!this.hasTooltip && <ButtonContent />}\n </Host>\n );\n }\n}\n","@import \"../../global/normalise.css\";\n\n:host {\n /\n @prop --circular-diameter: Diameter of the circular-indicator\n /\n\n display: block;\n\n --linear-border-radius: 4px;\n --inner-color: var(--ic-action-default);\n --outer-color: var(--ic-architectural-100);\n --label-color: var(--ic-color-primary-text);\n --margin: none;\n --linear-line-height: var(--ic-space-xs);\n}\n\n:host(.light) {\n --inner-color: var(--ic-architectural-white);\n --outer-color: var(--ic-architectural-800);\n --label-color: var(--ic-architectural-white);\n}\n\n.ic-loading-container {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n}\n\n:host([size=\"small\"]) {\n --circular-diameter: 40px;\n --linear-line-height: var(--ic-space-xxs);\n}\n\n:host([size=\"default\"]) {\n --circular-diameter: 80px;\n}\n\n:host([size=\"large\"]) {\n --circular-diameter: 120px;\n}\n\n:host([size=\"icon\"]) {\n display: inline-block;\n\n --margin: var(--ic-space-xxxs);\n --circular-diameter: 20px;\n}\n\n:host([label]) {\n --margin: 0 0 var(--ic-space-xs) 0;\n}\n\n.ic-loading-label {\n white-space: nowrap;\n color: var(--label-color);\n margin-left: var(--label-margin-left);\n}\n\n.ic-loading-circular-outer {\n height: var(--circular-diameter);\n width: var(--circular-diameter);\n\n}\n\n.ic-loading-circular-outer.indeterminate {\n animation: circular-animation 1s linear;\n animation-iteration-count: infinite;\n}\n\n@keyframes circular-animation {\n 100% {\n transform: rotate(360deg);\n }\n}\n\n.ic-loading-circular-outer,\n.ic-loading-linear-outer {\n margin: var(--margin);\n}\n\n.ic-loading-linear-outer {\n background-color: var(--outer-color);\n height: var(--linear-line-height);\n width: 100%;\n border-radius: var(--linear-border-radius);\n overflow: hidden;\n}\n\n.ic-loading-linear-inner {\n position: relative;\n height: 100%;\n background-color: var(--inner-color);\n border-radius: var(--linear-border-radius);\n}\n\n.indeterminate > .ic-loading-linear-inner {\n animation: linear-animation 2s infinite;\n}\n\n.determinate > .ic-loading-linear-inner {\n transition: width 0.5s;\n width: var(--linear-width);\n}\n\n:host([full-width]) {\n --linear-border-radius: none;\n}\n\n@keyframes linear-animation {\n 0% {\n width: 0%;\n left: -1%;\n }\n\n 25% {\n width: 0%;\n left: -1%;\n }\n\n 50% {\n width: 101%;\n left: -1%;\n }\n\n 75% {\n width: 0%;\n left: 101%;\n }\n\n 100% {\n width: 0%;\n left: 101%;\n }\n}\n\n.ic-loading-circular-svg {\n position: relative;\n width: 100%;\n height: 100%;\n transform: rotate(-90deg);\n}\n\n.ic-loading-circular-svg circle {\n width: 100%;\n height: 100%;\n fill: none;\n stroke: var(--outer-color);\n stroke-width: var(--circular-line-width);\n stroke-linecap: round;\n}\n\n/ --stroke-dash-array calculated via dashArray method /\n.ic-loading-circular-svg circle:nth-child(2) {\n --circular-indeterminate: calc(\n (0.25 var(--stroke-dasharray)) - var(--stroke-dasharray)\n );\n\n stroke-dasharray: var(--stroke-dasharray), var(--stroke-dasharray);\n stroke-dashoffset: var(--stroke-dashoffset, var(--circular-indeterminate));\n stroke: var(--inner-color);\n}\n\n/ High Contrast /\n@media (forced-colors: active) {\n .indeterminate > .ic-loading-circular-inner {\n forced-color-adjust: none;\n }\n\n .ic-loading-linear-outer {\n border: var(--ic-hc-border);\n }\n\n .ic-loading-linear-inner {\n background-color: canvastext;\n }\n\n .ic-loading-circular-svg circle {\n stroke: Background;\n }\n\n .ic-loading-circular-svg circle:nth-child(2) {\n stroke: canvastext;\n }\n}\n","import { Component, Element, h, Host, Prop, State, Watch } from \"@stencil/core\";\nimport {\n IcLoadingCircleXYR,\n IcLoadingSizes,\n IcLoadingTypes,\n} from \"./ic-loading-indicator.types\";\nimport {\n IcThemeForegroundEnum,\n IcThemeForegroundNoDefault,\n} from \"../../utils/types\";\n\n@Component({\n tag: \"ic-loading-indicator\",\n styleUrl: \"ic-loading-indicator.css\",\n shadow: true,\n})\nexport class LoadingIndicator {\n @Element() host: HTMLIcLoadingIndicatorElement;\n\n /*\n The current amount of progress made.\n * If not provided, component acts as an indeterminate loading indicator.\n /\n @Prop() progress?: number;\n\n /\n The minimum value that the progress value can take.\n * Used to calculate the proportional width of the progress bar.\n /\n @Prop() min?: number = 0;\n\n /\n The maximum value that the progress value can take.\n * Used to calculate the proportional width of the progress bar.\n /\n @Prop() max?: number = 100;\n\n /\n The label to be displayed beneath the loading indicator.\n * Display a changing label by separating multiple messages with forward slashes.\n /\n @Prop() label?: string;\n\n /\n The description that will be set as the aria-label of the loading indicator when not using a visible label.\n /\n @Prop() description?: string = \"Loading\";\n\n /\n The time in milliseconds before the label changes.\n /\n @Prop() labelDuration?: number = 8000;\n\n /\n The size of the loading indicator.\n /\n @Prop({ reflect: true }) size?: IcLoadingSizes = \"default\";\n\n /\n The type of indicator, either linear or circular.\n /\n @Prop({ reflect: true }) type?: IcLoadingTypes = \"circular\";\n\n /\n If `true`, when linear, the full-width variant (i.e. without a border radius) will be displayed.\n /\n @Prop({ reflect: true }) fullWidth?: boolean = false;\n\n /\n The appearance of the loading indicator, e.g. dark or light.\n /\n @Prop() appearance?: IcThemeForegroundNoDefault = \"dark\";\n\n @State() indicatorLabel: string;\n @State() indeterminate: boolean;\n @State() showSecond: boolean = false;\n @State() circularLineWidth: number;\n @State() circularDiameter: number;\n\n @Watch(\"label\")\n watchPropHandler(): void {\n this.updateLabel();\n }\n\n @Watch(\"progress\")\n watchProgressHandler(): void {\n if (this.type === \"circular\") {\n this.updateCircularProgressMeter();\n }\n }\n\n private outerElement?: HTMLDivElement;\n private innerElement?: HTMLDivElement;\n private labelList: string[];\n private circularMeter: SVGCircleElement;\n\n private updateCircularProgressMeter = () => {\n if (!this.indeterminate) {\n this.circularMeter.style.setProperty(\n \"--progress-value\",\n String(this.progress)\n );\n }\n };\n\n private getLabel = (\n labelIndex: number,\n setLabel: (label: string) => void\n ) => {\n return new Promise(() => {\n setInterval(() => {\n if (labelIndex < this.labelList.length - 1) {\n labelIndex++;\n } else {\n labelIndex = 0;\n }\n setLabel(this.labelList[labelIndex]);\n }, this.labelDuration);\n });\n };\n\n private getLabelVariant = () => {\n let variant: \"label\" \| \"h4\" \| \"h2\" = \"h4\";\n const width = this.outerElement?.offsetWidth;\n if (this.size === \"small\" \|\| (this.type === \"circular\" && width < 60)) {\n variant = \"label\";\n } else if (\n this.size === \"large\" \|\|\n (this.type === \"circular\" && width >= 120)\n ) {\n variant = \"h2\";\n }\n return variant;\n };\n\n // Sets the circular indicator line width - accounting for the circle size being altered using the CSS custom property\n private setCircleLineWidth = () => {\n const { offsetWidth: width } = this.outerElement;\n if (width) {\n this.circularLineWidth = width 0.1;\n this.circularDiameter = width;\n this.outerElement.style.setProperty(\n \"--circular-line-width\",\n `${this.circularLineWidth}px`\n );\n }\n };\n\n private setLinearDeterminateWidth = () => {\n if (!this.innerElement) return;\n // Ensure progress cannot be out of bounds\n\n const progress = Math.min(this.max, Math.max(this.min, this.progress));\n const proportion = (progress - this.min) / (this.max - this.min);\n this.showSecond = proportion > 0.5;\n if (this.showSecond) {\n this.innerElement.classList.remove(\"clip\");\n } else {\n this.innerElement.classList.add(\"clip\");\n }\n this.innerElement.style.setProperty(\n \"--linear-width\",\n `${proportion * 100}%`\n );\n };\n\n private calcOuterClass = (): string => {\n let cls = `ic-loading-${this.type}-outer`;\n cls += this.indeterminate ? \" indeterminate\" : \" determinate\";\n return cls;\n };\n\n private updateLabel = (): void => {\n if (this.label !== undefined) {\n this.labelList = this.label.split(\"/\");\n const labelIndex = 0;\n this.indicatorLabel = this.labelList[labelIndex];\n if (this.labelList.length > 1) {\n this.getLabel(labelIndex, (label) => {\n this.indicatorLabel = label;\n });\n }\n }\n };\n\n private setCircleXY = (): IcLoadingCircleXYR => {\n if (this.circularDiameter) {\n const r = this.circularDiameter / 2;\n const x = r;\n const y = r;\n const nextRadius = r - this.circularLineWidth / 2;\n this.setDashSteps(nextRadius);\n\n return { x, y, r: nextRadius };\n }\n return { x: 0, y: 0, r: 0 };\n };\n\n private setDashSteps = (radius: number) => {\n const dashArray = 2 * Math.PI * radius;\n const progress = Math.min(Math.max(this.progress, this.min), this.max);\n const proportion = -1 - (progress - this.min) / (this.max - this.min);\n\n this.circularMeter.style.setProperty(\n \"--stroke-dasharray\",\n `${dashArray}px`\n );\n\n if (!this.indeterminate) {\n this.circularMeter.style.setProperty(\n \"--circular-steps-max\",\n String(this.max)\n );\n this.circularMeter.style.setProperty(\n \"--stroke-dashoffset\",\n `${proportion * dashArray}px`\n );\n }\n };\n\n componentWillLoad(): void {\n this.indeterminate = this.progress === undefined;\n this.updateLabel();\n }\n\n componentDidLoad(): void {\n if (this.type === \"circular\") {\n this.setCircleLineWidth();\n this.circularMeter = this.host.shadowRoot.querySelector(\n \".ic-loading-circular-svg circle:nth-child(2)\"\n );\n this.updateCircularProgressMeter();\n }\n\n if (Number(this.progress) >= 0 && this.type === \"linear\") {\n this.setLinearDeterminateWidth();\n }\n }\n\n componentWillUpdate(): void {\n this.indeterminate = this.progress === undefined;\n }\n\n componentDidUpdate(): void {\n if (Number(this.progress) >= 0 && this.type === \"linear\") {\n this.setLinearDeterminateWidth();\n }\n }\n\n render() {\n const { appearance, label, description, size } = this;\n const { x, y, r } = this.setCircleXY();\n\n return (\n <Host class={{ [\"light\"]: appearance === IcThemeForegroundEnum.Light }}>\n <div class=\"ic-loading-container\">\n <div\n ref={(el) => (this.outerElement = el as HTMLDivElement)}\n class={this.calcOuterClass()}\n role=\"progressbar\"\n aria-labelledby={\n this.label && this.size !== \"icon\" && \"ic-loading-label\"\n }\n aria-label={description}\n aria-valuenow={this.progress}\n aria-valuemin={this.min}\n aria-valuemax={this.max}\n >\n <div\n ref={(el) => (this.innerElement = el as HTMLDivElement)}\n class={`ic-loading-${this.type}-inner`}\n >\n {this.type === \"circular\" && (\n <svg\n class=\"ic-loading-circular-svg\"\n viewBox={`0 0 ${this.circularDiameter \|\| 0} ${\n this.circularDiameter \|\| 0\n }`}\n >\n <circle cx={`${x}`} cy={`${y}`} r={`${r}`}></circle>\n <circle cx={`${x}`} cy={`${y}`} r={`${r}`}></circle>\n </svg>\n )}\n </div>\n </div>\n {label && size !== \"icon\" && (\n <ic-typography\n id=\"ic-loading-label\"\n class=\"ic-loading-label\"\n role=\"status\"\n variant={this.getLabelVariant()}\n >\n <p>{this.indicatorLabel}</p>\n </ic-typography>\n )}\n </div>\n </Host>\n );\n }\n}\n","@import \"../../global/normalise.css\";\n\n:host(.ic-tooltip) .ic-tooltip-container {\n background-color: var(--ic-architectural-800);\n color: #ffff;\n text-align: center;\n padding: var(--ic-space-xxxs) 10px;\n border-radius: var(--ic-border-radius);\n position: absolute;\n max-width: 320px;\n display: none;\n z-index: calc(var(--ic-z-index-overlay) / 2);\n box-shadow: var(--ic-elevation-overlay);\n}\n\n:host(.tooltip-navigation-item:not(.tooltip-navigation-item-side-nav-collapsed))\n .ic-tooltip-container,\n:host(.tooltip-disabled-button) .ic-tooltip-container {\n display: none !important;\n}\n\n:host(.tooltip-long-label-navigation-item-side-nav-expanded)\n .ic-tooltip-container[data-show] {\n display: block !important;\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow,\n:host(.ic-tooltip) .ic-tooltip-arrow::before {\n position: absolute;\n background: inherit;\n width: var(--ic-space-md);\n height: var(--ic-space-md);\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow {\n visibility: hidden;\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow::before {\n visibility: visible;\n content: \"\";\n}\n\n:host(.ic-tooltip) .ic-tooltip-container[data-show] {\n display: block;\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"top\"]\n > .ic-tooltip-arrow {\n bottom: calc(-1 * var(--ic-space-md));\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"top\"]\n > .ic-tooltip-arrow::before {\n border-radius: 0 0 var(--ic-border-radius) var(--ic-border-radius);\n left: 0;\n height: var(--ic-space-xxs);\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"bottom\"]\n > .ic-tooltip-arrow {\n top: calc(-1 * var(--ic-space-xxs));\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"bottom\"]\n > .ic-tooltip-arrow::before {\n border-radius: var(--ic-border-radius) var(--ic-border-radius) 0 0;\n left: 0;\n height: var(--ic-space-xxs);\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"left\"]\n > .ic-tooltip-arrow {\n right: var(--ic-space-xxxs);\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"left\"]\n > .ic-tooltip-arrow::before {\n border-radius: 0 var(--ic-border-radius) var(--ic-border-radius) 0;\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"right\"]\n > .ic-tooltip-arrow {\n left: -14px;\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"right\"]\n > .ic-tooltip-arrow::before {\n border-radius: var(--ic-border-radius) 0 0 var(--ic-border-radius);\n}\n\n:host([target=\"ic-button-with-tooltip-search-submit-button\"])\n .ic-tooltip-container,\n:host([target=\"ic-button-with-tooltip-clear-button\"]) .ic-tooltip-container {\n z-index: calc(var(--ic-z-index-popup-menu) + 1);\n}\n\n@media (forced-colors: active) {\n :host(.ic-tooltip) .ic-tooltip-container {\n border: var(--ic-hc-border);\n }\n}\n","import { Component, Element, Host, Prop, h, Watch } from \"@stencil/core\";\nimport { Instance, createPopper } from \"@popperjs/core\";\nimport { IcTooltipPlacements } from \"./ic-tooltip.types\";\nimport { onComponentRequiredPropUndefined } from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-tooltip\",\n styleUrl: \"ic-tooltip.css\",\n shadow: true,\n})\nexport class Tooltip {\n @Element() el: HTMLIcTooltipElement;\n\n /*\n The ID of the element the tooltip is describing - for when aria-labelledby or aria-describedby is used.\n /\n @Prop({ reflect: true }) target?: string;\n\n /\n The position of the tool-tip in relation to the parent element.\n /\n @Prop() placement?: IcTooltipPlacements = \"bottom\";\n\n /\n The text to display on the tooltip.\n */\n @Prop() label!: string;\n\n @Watch(\"label\")\n updateLabel(newValue: string): void {\n const describedBySpan = this.el.previousElementSibling as HTMLElement;\n if (describedBySpan !== null) {\n describedBySpan.innerText = newValue;\n }\n }\n\n private toolTip: HTMLDivElement;\n private arrow: HTMLDivElement;\n private mouseOverTool: boolean = false;\n private showEvents = [\"mouseenter\", \"focusin\"];\n private instantHideEvents = [\"focusout\"];\n private delayedHideEvents = [\"mouseleave\"];\n private popperInstance: Instance;\n\n private show = (popper: Instance) => {\n this.toolTip.setAttribute(\"data-show\", \"\");\n popper.setOptions((options) => ({\n ...options,\n modifiers: [\n ...options.modifiers,\n { name: \"eventListeners\", enabled: true },\n ],\n }));\n popper.update();\n };\n\n private hide = (popper: Instance) => {\n this.toolTip.removeAttribute(\"data-show\");\n popper.setOptions((options) => ({\n ...options,\n modifiers: [\n ...options.modifiers,\n { name: \"eventListeners\", enabled: false },\n ],\n }));\n };\n\n private checkCloseTooltip = (popper: Instance) => {\n setTimeout(() => {\n if (!this.mouseOverTool) {\n this.hide(popper);\n }\n }, 100);\n };\n\n private mouseEnterTooltip = () => {\n this.mouseOverTool = true;\n };\n\n private mouseLeaveTooltip = (popper: Instance) => {\n this.mouseOverTool = false;\n this.checkCloseTooltip(popper);\n };\n\n private handleKeyDown = (key: string) => {\n if (key === \"Escape\") {\n this.hide(this.popperInstance);\n }\n };\n\n private manageEventListeners = (action: \"add\" \| \"remove\") => {\n const method =\n action === \"add\" ? \"addEventListener\" : \"removeEventListener\";\n\n this.showEvents.forEach((event) => {\n this.el[method](event, () => this.show(this.popperInstance));\n this.toolTip[method](event, () => this.mouseEnterTooltip());\n });\n\n this.instantHideEvents.forEach((event) => {\n this.el[method](event, () => this.hide(this.popperInstance));\n });\n\n this.delayedHideEvents.forEach((event) => {\n this.el[method](event, () => this.checkCloseTooltip(this.popperInstance));\n this.toolTip[method](event, () =>\n this.mouseLeaveTooltip(this.popperInstance)\n );\n });\n\n document[method](\"keydown\", (event: KeyboardEvent) =>\n this.handleKeyDown(event.key)\n );\n };\n\n private screenReaderOnlyStyles = {\n position: \"absolute\",\n left: \"-10000px\",\n top: \"auto\",\n width: \"1px\",\n height: \"1px\",\n overflow: \"hidden\",\n };\n\n componentDidLoad(): void {\n this.popperInstance = createPopper(this.el, this.toolTip, {\n placement: this.placement,\n modifiers: [\n {\n name: \"offset\",\n options: {\n offset: [0, 10],\n },\n },\n {\n name: \"arrow\",\n options: {\n element: this.arrow,\n },\n },\n ],\n });\n\n this.manageEventListeners(\"add\");\n\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Tooltip\"\n );\n\n if (this.target !== undefined) {\n const ariaDescribedBy = document.createElement(\"span\");\n ariaDescribedBy.id = `ic-tooltip-${this.target}`;\n ariaDescribedBy.innerText = this.label;\n ariaDescribedBy.classList.add(\"ic-tooltip-label\");\n Object.assign(ariaDescribedBy.style, this.screenReaderOnlyStyles);\n\n this.el.insertAdjacentElement(\"beforebegin\", ariaDescribedBy);\n }\n }\n\n disconnectedCallback(): void {\n this.manageEventListeners(\"remove\");\n }\n\n render() {\n const { label } = this;\n return (\n <Host class={{ \"ic-tooltip\": true }}>\n <div\n ref={(el) => (this.toolTip = el as HTMLDivElement)}\n role=\"tooltip\"\n class=\"ic-tooltip-container\"\n >\n <ic-typography variant=\"caption\">{label}</ic-typography>\n <div\n ref={(el) => (this.arrow = el as HTMLDivElement)}\n class=\"ic-tooltip-arrow\"\n data-popper-arrow\n ></div>\n </div>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ic-card.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-card.entry.cjs.js","mappings":"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","names":["getThemeFromContext","IcThemeForegroundEnum","onComponentRequiredPropUndefined","h","isSlotUsed"],"sources":["./src/components/ic-card/ic-card.css?tag=ic-card&encapsulation=shadow","./src/components/ic-card/ic-card.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n display: flex;\n}\n\na {\n text-decoration: none !important;\n color: var(--ic-architechtural-black) !important;\n}\n\nbutton {\n border: none;\n background-color: transparent;\n outline: var(--ic-hc-focus-outline);\n}\n\n.card,\n.card.clickable {\n border: 1px solid var(--ic-architectural-300);\n border-radius: var(--ic-border-radius);\n padding: var(--ic-space-md);\n text-align: left;\n color: var(--ic-architechtural-black);\n transition: var(--ic-easing-transition-fast);\n}\n\n.dark.card,\n.dark.card.clickable {\n border: 1px solid var(--ic-architectural-700);\n}\n\n.card.clickable:hover {\n background-color: var(--ic-action-default-bg-hover);\n border-color: var(--ic-action-default-hover);\n cursor: pointer;\n}\n\n.card.clickable:focus,\n.card.clickable.focussed {\n background-color: var(--ic-action-default-bg-hover);\n box-shadow: var(--ic-border-focus);\n outline: var(--ic-hc-focus-outline);\n}\n\n.card.clickable:active {\n background-color: var(--ic-action-default-bg-active);\n box-shadow: var(--ic-border-focus);\n}\n\n.card.disabled {\n border: var(--ic-border-disabled);\n}\n\n.card.fullwidth {\n width: 100%;\n}\n\n.card-header {\n display: flex;\n align-items: center;\n}\n\n.icon {\n padding-right: var(--ic-space-xs);\n}\n\n.card.clickable ::slotted(svg) {\n fill: var(--ic-action-default);\n}\n\n.card.disabled ::slotted(svg) {\n fill: var(--ic-color-tertiary-text);\n}\n\n.card.clickable .card-title {\n color: var(--ic-hyperlink);\n text-decoration: underline;\n text-decoration-thickness: 1px;\n}\n\n.card.clickable:hover .card-title {\n color: var(--ic-hyperlink-hover) !important;\n text-decoration: none;\n}\n\n.card.clickable:focus .card-title,\n.card.clickable.focussed .card-title {\n color: var(--ic-hyperlink-hover);\n}\n\n.card.clickable:active .card-title {\n color: var(--ic-hyperlink-hover);\n}\n\n.card.disabled .card-title {\n text-decoration: underline;\n text-decoration-thickness: 1px;\n text-decoration-color: var(--ic-color-tertiary-text);\n color: var(--ic-color-tertiary-text);\n}\n\n.card-message {\n margin-top: var(--ic-space-xxs);\n align-items: left;\n}\n\n.card.disabled .card-message {\n color: var(--ic-color-tertiary-text);\n}\n","import { Component, Element, Listen, Prop, State, h } from \"@stencil/core\";\nimport {\n onComponentRequiredPropUndefined,\n isSlotUsed,\n getThemeFromContext,\n} from \"../../utils/helpers\";\nimport { IcTheme, IcThemeForeground, IcThemeForegroundEnum } from \"../../utils/types\";\n\n/*\n @slot icon - Content will be placed to the left of the card title.\n * @slot heading - Content will be placed at the top of the card to the right of the icon.\n * @slot message - Content will be placed in the main body of the card.\n /\n@Component({\n tag: \"ic-card\",\n styleUrl: \"ic-card.css\",\n shadow: true,\n})\nexport class Card {\n @Element() el: HTMLIcCardElement;\n\n /\n Set the variant to static or clickable\n /\n @Prop({ mutable: true }) clickable?: boolean = false;\n /\n URL for clickable cards\n /\n @Prop() href?: string \| undefined;\n /\n Human readable explanation of the URL\n /\n @Prop() hreflang?: string = \"\";\n /\n How much of the referrer to send when following the link.\n /\n @Prop() referrerpolicy?: ReferrerPolicy;\n /\n The relationship of the linked URL as space-separated link types.\n /\n @Prop() rel?: string;\n /\n Where to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n /\n @Prop() target?: string;\n /\n Title for the card\n /\n @Prop() heading!: string;\n /\n Main body message of the card\n /\n @Prop() message?: string = \"\";\n /\n Whether the card is disabled if it is clickable\n /\n @Prop() disabled?: boolean = false;\n /\n If true then fill width of container\n */\n @Prop() fullWidth: boolean = false;\n\n @State() parentIsAnchorTag: boolean = false;\n\n @State() isFocussed: boolean = false;\n\n @State() parentEl: HTMLElement \| null = null;\n\n @State() appearance?: IcThemeForeground = \"default\";\n\n @Listen(\"click\", { capture: true })\n handleHostClick(event: Event): void {\n if (this.disabled) {\n event.stopImmediatePropagation();\n }\n }\n\n @Listen(\"icThemeChange\", { target: \"document\" })\n themeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.updateTheme(theme.mode);\n }\n\n private parentFocussed = (): void => {\n this.isFocussed = true;\n };\n\n private parentBlurred = (): void => {\n this.isFocussed = false;\n };\n\n private updateTheme(newTheme: IcThemeForeground = null): void {\n const foregroundColor = getThemeFromContext(this.el, newTheme \|\| null);\n\n if (foregroundColor !== IcThemeForegroundEnum.Default) {\n this.appearance = foregroundColor;\n }\n }\n\n componentWillLoad(): void {\n this.parentEl = this.el.parentElement;\n\n if (this.parentEl.tagName === \"A\") {\n this.clickable = true;\n this.parentIsAnchorTag = true;\n this.parentEl.classList.add(\"ic-card-wrapper-link\");\n this.parentEl.addEventListener(\"focus\", this.parentFocussed);\n this.parentEl.addEventListener(\"blur\", this.parentBlurred);\n }\n }\n\n disconnectedCallback(): void {\n if (this.parentIsAnchorTag) {\n this.parentEl.removeEventListener(\"focus\", this.parentFocussed);\n this.parentEl.removeEventListener(\"blur\", this.parentBlurred);\n }\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.heading, propName: \"heading\" }],\n \"Card\"\n );\n this.updateTheme();\n }\n\n render() {\n const {\n clickable,\n disabled,\n heading,\n message,\n href,\n hreflang,\n referrerpolicy,\n rel,\n target,\n fullWidth,\n parentIsAnchorTag,\n isFocussed,\n } = this;\n\n const Component = parentIsAnchorTag\n ? \"div\"\n : clickable\n ? this.href === undefined\n ? \"button\"\n : \"a\"\n : \"div\";\n\n const attrs = Component == \"a\" && {\n href: href,\n hrefLang: hreflang,\n referrerPolicy: referrerpolicy,\n rel: rel,\n target: target,\n };\n\n return (\n <Component\n class={{\n [\"card\"]: true,\n [\"clickable\"]: clickable && !disabled,\n [\"disabled\"]: disabled,\n [\"fullwidth\"]: fullWidth,\n [\"focussed\"]: isFocussed,\n [\"dark\"]: this.appearance === IcThemeForegroundEnum.Dark,\n }}\n tabindex={clickable && !parentIsAnchorTag ? 0 : null}\n aria-disabled={disabled ? \"true\" : null}\n disabled={disabled ? true : null}\n {...attrs}\n >\n <div class=\"card-header\">\n {isSlotUsed(this.el, \"icon\") && (\n <div class=\"icon\">\n <slot name=\"icon\" />\n </div>\n )}\n <div class=\"card-title\">\n <slot name=\"heading\">\n <ic-typography variant=\"h4\">\n <p>{heading}</p>\n </ic-typography>\n </slot>\n </div>\n </div>\n {(message \|\| isSlotUsed(this.el, \"message\")) && (\n <div class=\"card-message\">\n <slot name=\"message\">\n <ic-typography variant=\"body\">{message}</ic-typography>\n </slot>\n </div>\n )}\n </Component>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-card.entry.cjs.js","mappings":"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","names":["getThemeFromContext","IcThemeForegroundEnum","onComponentRequiredPropUndefined","h","isSlotUsed"],"sources":["./src/components/ic-card/ic-card.css?tag=ic-card&encapsulation=shadow","./src/components/ic-card/ic-card.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n display: flex;\n}\n\na {\n text-decoration: none !important;\n color: var(--ic-architechtural-black) !important;\n}\n\nbutton {\n border: none;\n background-color: transparent;\n outline: var(--ic-hc-focus-outline);\n}\n\n.card,\n.card.clickable {\n border: 1px solid var(--ic-architectural-300);\n border-radius: var(--ic-border-radius);\n padding: var(--ic-space-md);\n text-align: left;\n color: var(--ic-architechtural-black);\n transition: var(--ic-easing-transition-fast);\n}\n\n.dark.card,\n.dark.card.clickable {\n border: 1px solid var(--ic-architectural-700);\n}\n\n.card.clickable:hover {\n background-color: var(--ic-action-default-bg-hover);\n border-color: var(--ic-action-default-hover);\n cursor: pointer;\n}\n\n.card.clickable:focus,\n.card.clickable.focussed {\n background-color: var(--ic-action-default-bg-hover);\n box-shadow: var(--ic-border-focus);\n outline: var(--ic-hc-focus-outline);\n}\n\n.card.clickable:active {\n background-color: var(--ic-action-default-bg-active);\n box-shadow: var(--ic-border-focus);\n}\n\n.card.disabled {\n border: var(--ic-border-disabled);\n}\n\n.card.fullwidth {\n width: 100%;\n}\n\n.card-header {\n display: flex;\n align-items: center;\n}\n\n.icon {\n padding-right: var(--ic-space-xs);\n}\n\n.card.clickable ::slotted(svg) {\n fill: var(--ic-action-default);\n}\n\n.card.disabled ::slotted(svg) {\n fill: var(--ic-color-tertiary-text);\n}\n\n.card.clickable .card-title {\n color: var(--ic-hyperlink);\n text-decoration: underline;\n text-decoration-thickness: 1px;\n}\n\n.card.clickable:hover .card-title {\n color: var(--ic-hyperlink-hover) !important;\n text-decoration: none;\n}\n\n.card.clickable:focus .card-title,\n.card.clickable.focussed .card-title {\n color: var(--ic-hyperlink-hover);\n}\n\n.card.clickable:active .card-title {\n color: var(--ic-hyperlink-hover);\n}\n\n.card.disabled .card-title {\n text-decoration: underline;\n text-decoration-thickness: 1px;\n text-decoration-color: var(--ic-color-tertiary-text);\n color: var(--ic-color-tertiary-text);\n}\n\n.card-message {\n margin-top: var(--ic-space-xxs);\n align-items: left;\n}\n\n.card.disabled .card-message {\n color: var(--ic-color-tertiary-text);\n}\n","import { Component, Element, Listen, Prop, State, h } from \"@stencil/core\";\nimport {\n onComponentRequiredPropUndefined,\n isSlotUsed,\n getThemeFromContext,\n} from \"../../utils/helpers\";\nimport { IcTheme, IcThemeForeground, IcThemeForegroundEnum } from \"../../utils/types\";\n\n/*\n @slot icon - Content will be placed to the left of the card title.\n * @slot heading - Content will be placed at the top of the card to the right of the icon.\n * @slot message - Content will be placed in the main body of the card.\n /\n@Component({\n tag: \"ic-card\",\n styleUrl: \"ic-card.css\",\n shadow: true,\n})\nexport class Card {\n @Element() el: HTMLIcCardElement;\n\n /\n If `true`, the card will be a clickable variant, instead of static.\n /\n @Prop({ mutable: true }) clickable?: boolean = false;\n /\n The URL that the clickable card link points to.\n /\n @Prop() href?: string \| undefined;\n /\n The human language of the linked URL.\n /\n @Prop() hreflang?: string = \"\";\n /\n How much of the referrer to send when following the link.\n /\n @Prop() referrerpolicy?: ReferrerPolicy;\n /\n The relationship of the linked URL as space-separated link types.\n /\n @Prop() rel?: string;\n /\n The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n /\n @Prop() target?: string;\n /\n The title for the card.\n /\n @Prop() heading!: string;\n /\n The main body message of the card.\n /\n @Prop() message?: string = \"\";\n /\n If `true`, the card will be disabled if it is clickable.\n /\n @Prop() disabled?: boolean = false;\n /\n If `true`, the card will fill the width of the container.\n */\n @Prop() fullWidth: boolean = false;\n\n @State() parentIsAnchorTag: boolean = false;\n\n @State() isFocussed: boolean = false;\n\n @State() parentEl: HTMLElement \| null = null;\n\n @State() appearance?: IcThemeForeground = \"default\";\n\n @Listen(\"click\", { capture: true })\n handleHostClick(event: Event): void {\n if (this.disabled) {\n event.stopImmediatePropagation();\n }\n }\n\n @Listen(\"icThemeChange\", { target: \"document\" })\n themeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.updateTheme(theme.mode);\n }\n\n private parentFocussed = (): void => {\n this.isFocussed = true;\n };\n\n private parentBlurred = (): void => {\n this.isFocussed = false;\n };\n\n private updateTheme(newTheme: IcThemeForeground = null): void {\n const foregroundColor = getThemeFromContext(this.el, newTheme \|\| null);\n\n if (foregroundColor !== IcThemeForegroundEnum.Default) {\n this.appearance = foregroundColor;\n }\n }\n\n componentWillLoad(): void {\n this.parentEl = this.el.parentElement;\n\n if (this.parentEl.tagName === \"A\") {\n this.clickable = true;\n this.parentIsAnchorTag = true;\n this.parentEl.classList.add(\"ic-card-wrapper-link\");\n this.parentEl.addEventListener(\"focus\", this.parentFocussed);\n this.parentEl.addEventListener(\"blur\", this.parentBlurred);\n }\n }\n\n disconnectedCallback(): void {\n if (this.parentIsAnchorTag) {\n this.parentEl.removeEventListener(\"focus\", this.parentFocussed);\n this.parentEl.removeEventListener(\"blur\", this.parentBlurred);\n }\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.heading, propName: \"heading\" }],\n \"Card\"\n );\n this.updateTheme();\n }\n\n render() {\n const {\n clickable,\n disabled,\n heading,\n message,\n href,\n hreflang,\n referrerpolicy,\n rel,\n target,\n fullWidth,\n parentIsAnchorTag,\n isFocussed,\n } = this;\n\n const Component = parentIsAnchorTag\n ? \"div\"\n : clickable\n ? this.href === undefined\n ? \"button\"\n : \"a\"\n : \"div\";\n\n const attrs = Component == \"a\" && {\n href: href,\n hrefLang: hreflang,\n referrerPolicy: referrerpolicy,\n rel: rel,\n target: target,\n };\n\n return (\n <Component\n class={{\n [\"card\"]: true,\n [\"clickable\"]: clickable && !disabled,\n [\"disabled\"]: disabled,\n [\"fullwidth\"]: fullWidth,\n [\"focussed\"]: isFocussed,\n [\"dark\"]: this.appearance === IcThemeForegroundEnum.Dark,\n }}\n tabindex={clickable && !parentIsAnchorTag ? 0 : null}\n aria-disabled={disabled ? \"true\" : null}\n disabled={disabled ? true : null}\n {...attrs}\n >\n <div class=\"card-header\">\n {isSlotUsed(this.el, \"icon\") && (\n <div class=\"icon\">\n <slot name=\"icon\" />\n </div>\n )}\n <div class=\"card-title\">\n <slot name=\"heading\">\n <ic-typography variant=\"h4\">\n <p>{heading}</p>\n </ic-typography>\n </slot>\n </div>\n </div>\n {(message \|\| isSlotUsed(this.el, \"message\")) && (\n <div class=\"card-message\">\n <slot name=\"message\">\n <ic-typography variant=\"body\">{message}</ic-typography>\n </slot>\n </div>\n )}\n </Component>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ic-checkbox-group.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-checkbox-group.entry.cjs.js","mappings":"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","names":["onComponentRequiredPropUndefined","getInputDescribedByText","hasValidationStatus","h","Host"],"sources":["./src/components/ic-checkbox-group/ic-checkbox-group.css?tag=ic-checkbox-group&encapsulation=shadow","./src/components/ic-checkbox-group/ic-checkbox-group.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n display: block;\n}\n\nic-input-label.error {\n color: var(--ic-status-error);\n}\n\nic-input-label ic-typography {\n margin-bottom: var(--ic-space-sm);\n}\n\n.list-items {\n list-style: none;\n}\n\n.screen-reader-only-text {\n position: absolute;\n left: -9999px;\n background-color: #fff;\n color: #000;\n text-transform: none;\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Listen,\n Element,\n Event,\n EventEmitter,\n State,\n} from \"@stencil/core\";\nimport {\n getInputDescribedByText,\n hasValidationStatus,\n onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcInformationStatusOrEmpty } from \"../../utils/types\";\nimport { IcChangeEventDetail } from \"./ic-checkbox-group.types\";\n\n@Component({\n tag: \"ic-checkbox-group\",\n styleUrl: \"ic-checkbox-group.css\",\n shadow: true,\n})\nexport class CheckboxGroup {\n @Element() host: HTMLIcCheckboxGroupElement;\n\n /*\n ~~Provide~~ a label for the ~~input~~.\n /\n @Prop() label!: string;\n\n /\n ~~Provide~~ a name for the ~~input~~.\n /\n @Prop() name!: string;\n\n /\n ~~Specify~~ if the ~~input~~ ~~requires~~ a value.\n /\n @Prop() required: boolean = false;\n\n /\n ~~Hides~~ the label and ~~applies~~ the required label value as an aria-label.\n /\n @Prop() hideLabel: boolean = false;\n\n /\n ~~Specify~~ ~~whether~~ the ~~input~~ is disabled.\n /\n @Prop() disabled: boolean = false;\n\n /\n ~~Provide~~ helper text to ~~display~~ additional field guidance.\n /\n @Prop() helperText: string = \"\";\n\n /\n ~~Specify~~ ~~whether~~ small styling to be applied to ~~element~~.\n /\n @Prop() small: boolean = false;\n /\n ~~Provide~~ validation status - 'error'\n /\n @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n /\n ~~Provide~~ validation text - 'error'\n /\n @Prop() validationText: string = \"\";\n\n /\n Emitted when a checkbox is checked.\n */\n @Event() icChange: EventEmitter<IcChangeEventDetail>;\n\n private checkboxOptions: HTMLIcCheckboxElement[];\n\n @State() checkedOptions: string[] = [];\n\n @Listen(\"checkboxChecked\")\n selectHandler(): void {\n this.checkboxOptions = Array.from(\n this.host.querySelectorAll(\"ic-checkbox\")\n );\n this.checkboxOptions.forEach((checkbox) => {\n if (\n checkbox.checked &&\n this.checkedOptions.indexOf(checkbox.value) === -1\n ) {\n this.checkedOptions.push(checkbox.value);\n }\n });\n this.icChange.emit({ value: this.checkedOptions });\n }\n\n componentDidLoad(): void {\n this.checkboxOptions = Array.from(\n this.host.querySelectorAll(\"ic-checkbox\")\n );\n this.checkboxOptions.forEach((checkbox) => {\n if (\n checkbox.checked &&\n this.checkedOptions.indexOf(checkbox.value) === -1\n ) {\n this.checkedOptions.push(checkbox.value);\n }\n if (!checkbox.name) checkbox.name = this.name;\n checkbox.groupLabel = this.label;\n });\n\n onComponentRequiredPropUndefined(\n [\n { prop: this.label, propName: \"label\" },\n { prop: this.name, propName: \"name\" },\n ],\n \"Checkbox Group\"\n );\n }\n\n render() {\n const describedBy = getInputDescribedByText(\n this.name,\n this.helperText !== \"\",\n this.validationStatus !== \"\"\n );\n const hadValidationStatus = hasValidationStatus(\n this.validationStatus,\n this.disabled\n );\n\n return (\n <Host>\n {(this.validationStatus === \"error\" \|\|\n this.required \|\|\n this.hideLabel) && (\n <span\n id=\"screenReaderOnlyText\"\n class=\"screen-reader-only-text\"\n aria-hidden=\"true\"\n >\n {this.label}{\" \"}\n {this.validationStatus === \"error\" ? \"invalid data \" : null}{\" \"}\n {this.required ? \"required\" : null}\n </span>\n )}\n <fieldset\n id={this.name}\n aria-labelledby={`${\n this.validationStatus === \"error\" \|\| this.required \|\| this.hideLabel\n ? \"screenReaderOnlyText\"\n : \"\"\n } ${describedBy}`.trim()}\n disabled={this.disabled}\n >\n {!this.hideLabel && (\n <legend>\n <ic-input-label\n class={{ [`${this.validationStatus}`]: true }}\n label={this.label}\n helperText={this.helperText}\n required={this.required}\n disabled={this.disabled}\n for={this.name}\n ></ic-input-label>\n </legend>\n )}\n <div class=\"list-items\">\n <slot></slot>\n </div>\n </fieldset>\n {hadValidationStatus && (\n <ic-input-validation\n for={this.name}\n ariaLiveMode=\"polite\"\n status={this.validationStatus}\n message={this.validationText}\n ></ic-input-validation>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-checkbox-group.entry.cjs.js","mappings":"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","names":["onComponentRequiredPropUndefined","getInputDescribedByText","hasValidationStatus","h","Host"],"sources":["./src/components/ic-checkbox-group/ic-checkbox-group.css?tag=ic-checkbox-group&encapsulation=shadow","./src/components/ic-checkbox-group/ic-checkbox-group.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n display: block;\n}\n\nic-input-label.error {\n color: var(--ic-status-error);\n}\n\nic-input-label ic-typography {\n margin-bottom: var(--ic-space-sm);\n}\n\n.list-items {\n list-style: none;\n}\n\n.screen-reader-only-text {\n position: absolute;\n left: -9999px;\n background-color: #fff;\n color: #000;\n text-transform: none;\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Listen,\n Element,\n Event,\n EventEmitter,\n State,\n} from \"@stencil/core\";\nimport {\n getInputDescribedByText,\n hasValidationStatus,\n onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcInformationStatusOrEmpty } from \"../../utils/types\";\nimport { IcChangeEventDetail } from \"./ic-checkbox-group.types\";\n\n@Component({\n tag: \"ic-checkbox-group\",\n styleUrl: \"ic-checkbox-group.css\",\n shadow: true,\n})\nexport class CheckboxGroup {\n @Element() host: HTMLIcCheckboxGroupElement;\n\n /*\n The label for the checkbox group to be displayed.\n /\n @Prop() label!: string;\n\n /\n The name for the checkbox group to differentiate from other groups.\n /\n @Prop() name!: string;\n\n /\n If `true`, the checkbox group will require a value.\n /\n @Prop() required: boolean = false;\n\n /\n If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n /\n @Prop() hideLabel: boolean = false;\n\n /\n If `true`, the checkbox group will be set to the disabled state.\n /\n @Prop() disabled: boolean = false;\n\n /\n The helper text that will be displayed for additional field guidance.\n /\n @Prop() helperText: string = \"\";\n\n /\n If `true`, the small styling will be applied to the checkbox group.\n /\n @Prop() small: boolean = false;\n /\n The validation status - e.g. 'error' \| 'warning' \| 'success'.\n /\n @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n /\n The validation text - e.g. 'error' \| 'warning' \| 'success'.\n /\n @Prop() validationText: string = \"\";\n\n /\n Emitted when a checkbox is checked.\n */\n @Event() icChange: EventEmitter<IcChangeEventDetail>;\n\n private checkboxOptions: HTMLIcCheckboxElement[];\n\n @State() checkedOptions: string[] = [];\n\n @Listen(\"checkboxChecked\")\n selectHandler(): void {\n this.checkboxOptions = Array.from(\n this.host.querySelectorAll(\"ic-checkbox\")\n );\n this.checkboxOptions.forEach((checkbox) => {\n if (\n checkbox.checked &&\n this.checkedOptions.indexOf(checkbox.value) === -1\n ) {\n this.checkedOptions.push(checkbox.value);\n }\n });\n this.icChange.emit({ value: this.checkedOptions });\n }\n\n componentDidLoad(): void {\n this.checkboxOptions = Array.from(\n this.host.querySelectorAll(\"ic-checkbox\")\n );\n this.checkboxOptions.forEach((checkbox) => {\n if (\n checkbox.checked &&\n this.checkedOptions.indexOf(checkbox.value) === -1\n ) {\n this.checkedOptions.push(checkbox.value);\n }\n if (!checkbox.name) checkbox.name = this.name;\n checkbox.groupLabel = this.label;\n });\n\n onComponentRequiredPropUndefined(\n [\n { prop: this.label, propName: \"label\" },\n { prop: this.name, propName: \"name\" },\n ],\n \"Checkbox Group\"\n );\n }\n\n render() {\n const describedBy = getInputDescribedByText(\n this.name,\n this.helperText !== \"\",\n this.validationStatus !== \"\"\n );\n const hadValidationStatus = hasValidationStatus(\n this.validationStatus,\n this.disabled\n );\n\n return (\n <Host>\n {(this.validationStatus === \"error\" \|\|\n this.required \|\|\n this.hideLabel) && (\n <span\n id=\"screenReaderOnlyText\"\n class=\"screen-reader-only-text\"\n aria-hidden=\"true\"\n >\n {this.label}{\" \"}\n {this.validationStatus === \"error\" ? \"invalid data \" : null}{\" \"}\n {this.required ? \"required\" : null}\n </span>\n )}\n <fieldset\n id={this.name}\n aria-labelledby={`${\n this.validationStatus === \"error\" \|\| this.required \|\| this.hideLabel\n ? \"screenReaderOnlyText\"\n : \"\"\n } ${describedBy}`.trim()}\n disabled={this.disabled}\n >\n {!this.hideLabel && (\n <legend>\n <ic-input-label\n class={{ [`${this.validationStatus}`]: true }}\n label={this.label}\n helperText={this.helperText}\n required={this.required}\n disabled={this.disabled}\n for={this.name}\n ></ic-input-label>\n </legend>\n )}\n <div class=\"list-items\">\n <slot></slot>\n </div>\n </fieldset>\n {hadValidationStatus && (\n <ic-input-validation\n for={this.name}\n ariaLiveMode=\"polite\"\n status={this.validationStatus}\n message={this.validationText}\n ></ic-input-validation>\n )}\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ic-checkbox.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-checkbox.entry.cjs.js","mappings":"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","names":["addFormResetListener","onComponentRequiredPropUndefined","removeFormResetListener","renderHiddenInput","removeHiddenInput","h","Host","isSlotUsed"],"sources":["./src/components/ic-checkbox/ic-checkbox.css?tag=ic-checkbox&encapsulation=shadow","./src/components/ic-checkbox/ic-checkbox.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host([disabled]) {\n color: var(--ic-architectural-200);\n pointer-events: none;\n}\n\n:host([small]) .container {\n margin-bottom: 10px;\n}\n\n.container {\n display: flex;\n width: fit-content;\n margin-bottom: var(--ic-space-sm);\n margin-left: var(--ic-space-xxs);\n}\n\n.checkbox {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n display: block;\n position: relative;\n top: 0;\n left: 0;\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n background-color: transparent;\n border: 1px solid var(--ic-architectural-300);\n border-radius: var(--ic-border-radius);\n outline: none;\n cursor: pointer;\n transition: var(--ic-easing-transition-fast);\n}\n\n.checkbox:checked {\n background-color: var(--ic-action-default);\n border: 1px solid var(--ic-action-default);\n transition: var(--ic-easing-transition-slow);\n}\n\n.checkbox:checked:disabled {\n background-color: var(--ic-architectural-200);\n}\n\n.checkbox:indeterminate,\n.checkbox.indeterminate:checked {\n background-color: transparent;\n border: 2px solid var(--ic-action-default);\n}\n\n.checkbox:checked:hover {\n background-color: var(--ic-action-default-hover);\n}\n\n.checkbox:indeterminate:hover,\n.checkbox.indeterminate:checked:hover {\n background-color: var(--ic-action-default-bg-hover);\n border: 2px solid var(--ic-action-default-hover);\n}\n\n.checkbox:checked:active {\n background-color: var(--ic-action-default-active);\n}\n\n.checkbox:indeterminate:active,\n.checkbox.indeterminate:checked:active {\n background-color: var(--ic-action-default-bg-active);\n border: 2px solid var(--ic-action-default-active);\n}\n\n.checkbox:hover {\n background-color: var(--ic-action-default-bg-hover);\n box-shadow: 0 0 0 4px var(--ic-action-default-bg-hover);\n border: 1px solid var(--ic-action-default-hover);\n}\n\n.checkbox:active {\n background-color: var(--ic-action-default-bg-active);\n box-shadow: 0 0 0 4px var(--ic-action-default-bg-active);\n border: 1px solid var(--ic-action-default-active);\n}\n\n.checkbox:focus {\n box-shadow: var(--ic-border-focus);\n}\n\n.checkbox:disabled {\n border: 1px dashed var(--ic-architectural-200);\n}\n\n.checkbox-label {\n padding-left: var(--ic-space-sm);\n}\n\n.checkbox-label:hover {\n cursor: pointer;\n}\n\n.checkmark {\n position: relative;\n right: calc(-1 * var(--ic-space-lg));\n margin-left: calc(-1 * var(--ic-space-lg));\n fill: white;\n z-index: 1;\n background-color: transparent;\n pointer-events: none;\n}\n\n.indeterminate-symbol {\n position: relative;\n width: 14px;\n height: var(--ic-space-xxxs);\n top: 11px;\n right: -19px;\n margin-left: -14px;\n z-index: 1;\n background-color: var(--ic-action-default);\n pointer-events: none;\n}\n\n.container:hover .indeterminate-symbol {\n background-color: var(--ic-action-default-hover);\n}\n\n.container:active .indeterminate-symbol {\n background-color: var(--ic-action-default-active);\n}\n\n.additional-field-wrapper {\n margin-left: 44px;\n margin-top: var(--ic-space-xs);\n}\n\n.branch-corner {\n color: var(--ic-action-default);\n height: var(--ic-space-md);\n width: var(--ic-space-xl);\n border-radius: 0 0 0 3px;\n border-bottom: 2px solid var(--ic-action-default);\n border-left: 2px solid var(--ic-action-default);\n}\n\n.dynamic-container {\n display: flex;\n position: relative;\n margin-left: 15px;\n margin-top: -6px;\n margin-bottom: var(--ic-space-md);\n gap: var(--ic-space-xs);\n}\n\n.dynamic-text {\n color: var(--ic-action-default);\n margin-top: 7px;\n margin-bottom: var(--ic-space-xs);\n border-radius: 2%;\n}\n\n@media (max-width: 576px) {\n ::slotted(ic-text-field) {\n --input-width: 100%;\n }\n}\n\n@media (forced-colors: active) {\n /* Styles here only apply to Forced Colors Mode /\n .checkbox {\n appearance: revert;\n transition: none;\n }\n\n .checkbox:checked {\n transition: none;\n }\n\n .checkbox:focus-visible {\n outline: 2px solid highlight;\n }\n\n .checkbox:disabled:not(:checked) {\n appearance: none;\n border-color: GrayText;\n }\n\n .checkmark {\n fill: none;\n }\n\n .indeterminate-symbol {\n display: none;\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Element,\n Event,\n EventEmitter,\n State,\n} from \"@stencil/core\";\nimport { IcAdditionalFieldTypes } from \"../../utils/types\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n renderHiddenInput,\n removeHiddenInput,\n addFormResetListener,\n removeFormResetListener,\n} from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-checkbox\",\n styleUrl: \"ic-checkbox.css\",\n shadow: true,\n})\nexport class Checkbox {\n /\n Set the checkbox to the checked state\n /\n @Prop({ reflect: true, mutable: true }) checked?: boolean = false;\n /\n Set the checkbox to the disabled state\n /\n @Prop() disabled?: boolean = false;\n /\n Provide a label for the input\n /\n @Prop() label!: string;\n /\n Provide a value for the input\n /\n @Prop() value!: string;\n /\n Provide a name for the input. If not set when used in a checkbox group, the name will be based on the group name.\n /\n @Prop() name: string;\n /\n Provide a group label for the input\n /\n @Prop() groupLabel: string;\n /\n Provide a text prop for the dynamic text\n /\n @Prop() dynamicText: string = \"This selection requires additional answers\";\n /\n Set which style of additionalField will be displayed if used\n /\n @Prop({ reflect: true }) additionalFieldDisplay: IcAdditionalFieldTypes =\n \"static\";\n /\n Display the indeterminate state when checked\n /\n @Prop() indeterminate: boolean = false;\n\n @State() initiallyChecked = this.checked;\n\n @Element() host: HTMLIcCheckboxElement;\n\n /\n Emitted when a checkbox has been checked\n */\n @Event() checkboxChecked: EventEmitter<void>;\n\n private additionalFieldContainer: HTMLDivElement;\n\n private handleClick = () => {\n this.checked = !this.checked;\n this.checkboxChecked.emit();\n };\n\n private handleFormReset = (): void => {\n this.checked = this.initiallyChecked;\n };\n\n componentDidRender(): void {\n if (this.additionalFieldDisplay === \"static\") {\n const textfield = this.host.querySelector(\"ic-text-field\");\n if (!this.checked) {\n textfield && textfield.setAttribute(\"disabled\", \"\");\n } else {\n textfield && textfield.removeAttribute(\"disabled\");\n }\n } else {\n if (!this.checked) {\n this.additionalFieldContainer.style.display = \"none\";\n } else {\n this.additionalFieldContainer.style.display = \"flex\";\n }\n }\n }\n\n componentWillLoad(): void {\n addFormResetListener(this.host, this.handleFormReset);\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [\n { prop: this.label, propName: \"label\" },\n { prop: this.value, propName: \"value\" },\n ],\n \"Checkbox\"\n );\n }\n\n disconnectedCallback(): void {\n removeFormResetListener(this.host, this.handleFormReset);\n }\n\n render() {\n let id = `ic-checkbox-${\n this.label !== undefined ? this.label : this.value\n }-${this.groupLabel}`;\n\n id = id.replace(/ /g, \"-\");\n\n this.checked\n ? renderHiddenInput(\n true,\n this.host,\n this.name,\n this.checked && this.value,\n this.disabled\n )\n : removeHiddenInput(this.host);\n\n return (\n <Host>\n <div class={{ [\"container\"]: true, [\"disabled\"]: this.disabled }}>\n {this.checked && !this.indeterminate && (\n <svg\n class=\"checkmark\"\n width=\"24\"\n height=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n >\n <title>checkmark icon</title>\n <path d=\"M21 6.285l-11.16 12.733-6.84-6.018 1.319-1.49 5.341 4.686 9.865-11.196 1.475 1.285z\" />\n </svg>\n )}\n {this.checked && this.indeterminate && (\n <div class=\"indeterminate-symbol\" />\n )}\n <input\n role=\"checkbox\"\n class={{\n [\"checkbox\"]: true,\n [\"checked\"]: this.checked,\n [\"indeterminate\"]: this.indeterminate,\n }}\n type=\"checkbox\"\n name={this.name}\n id={id}\n value={this.value}\n disabled={this.disabled ? true : null}\n checked={this.checked}\n indeterminate={this.indeterminate}\n onClick={this.handleClick}\n ></input>\n <ic-typography variant=\"body\">\n <label class=\"checkbox-label\" htmlFor={id}>\n {this.label}\n </label>\n </ic-typography>\n </div>\n {isSlotUsed(this.host, \"additional-field\") && (\n <div\n class=\"dynamic-container\"\n ref={(el) => (this.additionalFieldContainer = el)}\n >\n {this.additionalFieldDisplay === \"dynamic\" && (\n <div class=\"branch-corner\"></div>\n )}\n <div>\n {this.additionalFieldDisplay === \"dynamic\" && (\n <ic-typography variant=\"caption\">\n <p class=\"dynamic-text\" aria-live=\"polite\">\n {this.dynamicText}\n </p>\n </ic-typography>\n )}\n <div\n class={{\n \"additional-field-wrapper\":\n this.additionalFieldDisplay === \"static\",\n }}\n >\n <slot name=\"additional-field\"></slot>\n </div>\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-checkbox.entry.cjs.js","mappings":"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","names":["addFormResetListener","onComponentRequiredPropUndefined","removeFormResetListener","renderHiddenInput","removeHiddenInput","h","Host","isSlotUsed"],"sources":["./src/components/ic-checkbox/ic-checkbox.css?tag=ic-checkbox&encapsulation=shadow","./src/components/ic-checkbox/ic-checkbox.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host([disabled]) {\n color: var(--ic-architectural-200);\n pointer-events: none;\n}\n\n:host([small]) .container {\n margin-bottom: 10px;\n}\n\n.container {\n display: flex;\n width: fit-content;\n margin-bottom: var(--ic-space-sm);\n margin-left: var(--ic-space-xxs);\n}\n\n.checkbox {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n display: block;\n position: relative;\n top: 0;\n left: 0;\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n background-color: transparent;\n border: 1px solid var(--ic-architectural-300);\n border-radius: var(--ic-border-radius);\n outline: none;\n cursor: pointer;\n transition: var(--ic-easing-transition-fast);\n}\n\n.checkbox:checked {\n background-color: var(--ic-action-default);\n border: 1px solid var(--ic-action-default);\n transition: var(--ic-easing-transition-slow);\n}\n\n.checkbox:checked:disabled {\n background-color: var(--ic-architectural-200);\n}\n\n.checkbox:indeterminate,\n.checkbox.indeterminate:checked {\n background-color: transparent;\n border: 2px solid var(--ic-action-default);\n}\n\n.checkbox:checked:hover {\n background-color: var(--ic-action-default-hover);\n}\n\n.checkbox:indeterminate:hover,\n.checkbox.indeterminate:checked:hover {\n background-color: var(--ic-action-default-bg-hover);\n border: 2px solid var(--ic-action-default-hover);\n}\n\n.checkbox:checked:active {\n background-color: var(--ic-action-default-active);\n}\n\n.checkbox:indeterminate:active,\n.checkbox.indeterminate:checked:active {\n background-color: var(--ic-action-default-bg-active);\n border: 2px solid var(--ic-action-default-active);\n}\n\n.checkbox:hover {\n background-color: var(--ic-action-default-bg-hover);\n box-shadow: 0 0 0 4px var(--ic-action-default-bg-hover);\n border: 1px solid var(--ic-action-default-hover);\n}\n\n.checkbox:active {\n background-color: var(--ic-action-default-bg-active);\n box-shadow: 0 0 0 4px var(--ic-action-default-bg-active);\n border: 1px solid var(--ic-action-default-active);\n}\n\n.checkbox:focus {\n box-shadow: var(--ic-border-focus);\n}\n\n.checkbox:disabled {\n border: 1px dashed var(--ic-architectural-200);\n}\n\n.checkbox-label {\n padding-left: var(--ic-space-sm);\n}\n\n.checkbox-label:hover {\n cursor: pointer;\n}\n\n.checkmark {\n position: relative;\n right: calc(-1 * var(--ic-space-lg));\n margin-left: calc(-1 * var(--ic-space-lg));\n fill: white;\n z-index: 1;\n background-color: transparent;\n pointer-events: none;\n}\n\n.indeterminate-symbol {\n position: relative;\n width: 14px;\n height: var(--ic-space-xxxs);\n top: 11px;\n right: -19px;\n margin-left: -14px;\n z-index: 1;\n background-color: var(--ic-action-default);\n pointer-events: none;\n}\n\n.container:hover .indeterminate-symbol {\n background-color: var(--ic-action-default-hover);\n}\n\n.container:active .indeterminate-symbol {\n background-color: var(--ic-action-default-active);\n}\n\n.additional-field-wrapper {\n margin-left: 44px;\n margin-top: var(--ic-space-xs);\n}\n\n.branch-corner {\n color: var(--ic-action-default);\n height: var(--ic-space-md);\n width: var(--ic-space-xl);\n border-radius: 0 0 0 3px;\n border-bottom: 2px solid var(--ic-action-default);\n border-left: 2px solid var(--ic-action-default);\n}\n\n.dynamic-container {\n display: flex;\n position: relative;\n margin-left: 15px;\n margin-top: -6px;\n margin-bottom: var(--ic-space-md);\n gap: var(--ic-space-xs);\n}\n\n.dynamic-text {\n color: var(--ic-action-default);\n margin-top: 7px;\n margin-bottom: var(--ic-space-xs);\n border-radius: 2%;\n}\n\n@media (max-width: 576px) {\n ::slotted(ic-text-field) {\n --input-width: 100%;\n }\n}\n\n@media (forced-colors: active) {\n /* Styles here only apply to Forced Colors Mode /\n .checkbox {\n appearance: revert;\n transition: none;\n }\n\n .checkbox:checked {\n transition: none;\n }\n\n .checkbox:focus-visible {\n outline: 2px solid highlight;\n }\n\n .checkbox:disabled:not(:checked) {\n appearance: none;\n border-color: GrayText;\n }\n\n .checkmark {\n fill: none;\n }\n\n .indeterminate-symbol {\n display: none;\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Element,\n Event,\n EventEmitter,\n State,\n} from \"@stencil/core\";\nimport { IcAdditionalFieldTypes } from \"../../utils/types\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n renderHiddenInput,\n removeHiddenInput,\n addFormResetListener,\n removeFormResetListener,\n} from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-checkbox\",\n styleUrl: \"ic-checkbox.css\",\n shadow: true,\n})\nexport class Checkbox {\n /\n If `true`, the checkbox will be set to the checked state.\n /\n @Prop({ reflect: true, mutable: true }) checked?: boolean = false;\n /\n If `true`, the checkbox will be set to the disabled state.\n /\n @Prop() disabled?: boolean = false;\n /\n The label for the checkbox.\n /\n @Prop() label!: string;\n /\n The value for the checkbox.\n /\n @Prop() value!: string;\n /\n The name for the checkbox. If not set when used in a checkbox group, the name will be based on the group name.\n /\n @Prop() name: string;\n /\n The group label for the checkbox.\n /\n @Prop() groupLabel: string;\n /\n The text to be displayed when dynamic.\n /\n @Prop() dynamicText: string = \"This selection requires additional answers\";\n /\n The style of additionalField that will be displayed if used.\n /\n @Prop({ reflect: true }) additionalFieldDisplay: IcAdditionalFieldTypes =\n \"static\";\n /\n If `true`, the indeterminate state will be displayed when checked.\n /\n @Prop() indeterminate: boolean = false;\n\n @State() initiallyChecked = this.checked;\n\n @Element() host: HTMLIcCheckboxElement;\n\n /\n Emitted when a checkbox has been checked\n */\n @Event() checkboxChecked: EventEmitter<void>;\n\n private additionalFieldContainer: HTMLDivElement;\n\n private handleClick = () => {\n this.checked = !this.checked;\n this.checkboxChecked.emit();\n };\n\n private handleFormReset = (): void => {\n this.checked = this.initiallyChecked;\n };\n\n componentDidRender(): void {\n if (this.additionalFieldDisplay === \"static\") {\n const textfield = this.host.querySelector(\"ic-text-field\");\n if (!this.checked) {\n textfield && textfield.setAttribute(\"disabled\", \"\");\n } else {\n textfield && textfield.removeAttribute(\"disabled\");\n }\n } else {\n if (!this.checked) {\n this.additionalFieldContainer.style.display = \"none\";\n } else {\n this.additionalFieldContainer.style.display = \"flex\";\n }\n }\n }\n\n componentWillLoad(): void {\n addFormResetListener(this.host, this.handleFormReset);\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [\n { prop: this.label, propName: \"label\" },\n { prop: this.value, propName: \"value\" },\n ],\n \"Checkbox\"\n );\n }\n\n disconnectedCallback(): void {\n removeFormResetListener(this.host, this.handleFormReset);\n }\n\n render() {\n let id = `ic-checkbox-${\n this.label !== undefined ? this.label : this.value\n }-${this.groupLabel}`;\n\n id = id.replace(/ /g, \"-\");\n\n this.checked\n ? renderHiddenInput(\n true,\n this.host,\n this.name,\n this.checked && this.value,\n this.disabled\n )\n : removeHiddenInput(this.host);\n\n return (\n <Host>\n <div class={{ [\"container\"]: true, [\"disabled\"]: this.disabled }}>\n {this.checked && !this.indeterminate && (\n <svg\n class=\"checkmark\"\n width=\"24\"\n height=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n >\n <title>checkmark icon</title>\n <path d=\"M21 6.285l-11.16 12.733-6.84-6.018 1.319-1.49 5.341 4.686 9.865-11.196 1.475 1.285z\" />\n </svg>\n )}\n {this.checked && this.indeterminate && (\n <div class=\"indeterminate-symbol\" />\n )}\n <input\n role=\"checkbox\"\n class={{\n [\"checkbox\"]: true,\n [\"checked\"]: this.checked,\n [\"indeterminate\"]: this.indeterminate,\n }}\n type=\"checkbox\"\n name={this.name}\n id={id}\n value={this.value}\n disabled={this.disabled ? true : null}\n checked={this.checked}\n indeterminate={this.indeterminate}\n onClick={this.handleClick}\n ></input>\n <ic-typography variant=\"body\">\n <label class=\"checkbox-label\" htmlFor={id}>\n {this.label}\n </label>\n </ic-typography>\n </div>\n {isSlotUsed(this.host, \"additional-field\") && (\n <div\n class=\"dynamic-container\"\n ref={(el) => (this.additionalFieldContainer = el)}\n >\n {this.additionalFieldDisplay === \"dynamic\" && (\n <div class=\"branch-corner\"></div>\n )}\n <div>\n {this.additionalFieldDisplay === \"dynamic\" && (\n <ic-typography variant=\"caption\">\n <p class=\"dynamic-text\" aria-live=\"polite\">\n {this.dynamicText}\n </p>\n </ic-typography>\n )}\n <div\n class={{\n \"additional-field-wrapper\":\n this.additionalFieldDisplay === \"static\",\n }}\n >\n <slot name=\"additional-field\"></slot>\n </div>\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ic-classification-banner.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-classification-banner.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,yBAAyB,GAAG,qzGAAqzG;;ACGv1G,MAAM,kBAAkB,GAAG;EACzB,OAAO,EAAE,4BAA4B;EACrC,QAAQ,EAAE,UAAU;EACpB,oBAAoB,EAAE,oBAAoB;EAC1C,MAAM,EAAE,QAAQ;EAChB,YAAY,EAAE,YAAY;CAC3B,CAAC;MAOW,oBAAoB;;;+BAIQ,EAAE;0BAIO,SAAS;mBAI9B,IAAI;kBAIJ,KAAK;gBAIP,KAAK;;EAE9B,MAAM;IACJ,MAAM,EAAE,cAAc,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,mBAAmB,EAAE,GAAG,IAAI,CAAC;IAE5E,QACEA,QAACC,UAAI,IAAC,KAAK,EAAE,EAAE,CAAC,QAAQ,GAAG,MAAM,EAAE,IACjCD,kCACa,oBAAoB,EAC/B,KAAK,EAAE;QACL,CAAC,uBAAuB,GAAG,IAAI;QAC/B,CAAC,GAAG,cAAc,EAAE,GAAG,cAAc;OACtC,EACD,IAAI,EAAC,aAAa,IAEjB,cAAc,KAAK,SAAS,IAC3BA,kBAAM,KAAK,EAAC,WAAW,+CACmB,GAAG,CACtC,IACL,IAAI,EACRA,2BAAe,OAAO,EAAC,mBAAmB,IACvC,cAAc,KAAK,SAAS;QACzB,kBAAkB,CAAC,cAAc,CAAC;QAClC,GAAG,IAAI,GAAG,OAAO,GAAG,EAAE;iBACrB,OAAO,KAAK,EAAE,GAAG,OAAO,GAAG,EAAE;iBAC7B,kBAAkB,CAAC,cAAc,CAAC;iBAClC,mBAAmB,KAAK,EAAE,GAAG,mBAAmB,GAAG,EAAE,EAAE,CAC9C,CACT,CACJ,EACP;GACH;;;;;;","names":["h","Host"],"sources":["./src/components/ic-classification-banner/ic-classification-banner.css?tag=ic-classification-banner&encapsulation=shadow","./src/components/ic-classification-banner/ic-classification-banner.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n position: fixed;\n left: 0;\n bottom: 0;\n width: 100%;\n height: var(--ic-space-lg);\n z-index: var(--ic-z-index-overlay);\n}\n\n:host(.inline) {\n position: static;\n left: auto;\n bottom: auto;\n}\n\n.classification-banner {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding: var(--ic-space-xxxs) var(--ic-space-md);\n}\n\n.default {\n background-color: var(--ic-classification-not-set);\n color: var(--ic-classification-not-set-foreground);\n}\n\n.official,\n.official-sensitive {\n background-color: var(--ic-classification-official);\n color: var(--ic-classification-official-foreground);\n}\n\n.secret {\n background-color: var(--ic-classification-secret);\n color: var(--ic-classification-secret-foreground);\n}\n\n.top-secret {\n background-color: var(--ic-classification-top-secret);\n color: var(--ic-classification-top-secret-foreground);\n}\n\n.offscreen {\n position: absolute;\n left: -9999px;\n background-color: #fff;\n color: #000;\n text-transform: none;\n}\n\n@media (forced-colors: active) {\n .classification-banner {\n border: var(--ic-hc-border);\n }\n}\n","import { Component, Prop, h, Host } from \"@stencil/core\";\nimport { IcProtectiveMarkings } from \"./ic-classification-banner.types\";\n\nconst classificationText = {\n default: \"protective marking not set\",\n official: \"official\",\n \"official-sensitive\": \"official sensitive\",\n secret: \"secret\",\n \"top-secret\": \"top secret\",\n};\n\n@Component({\n tag: \"ic-classification-banner\",\n styleUrl: \"ic-classification-banner.css\",\n shadow: true,\n})\nexport class ClassificationBanner {\n /*\n ~~Additional~~ information to ~~display~~ after the classification\n /\n @Prop() additionalSelectors?: string = \"\";\n /\n The classification level to be displayed also determines the banner and text colour\n /\n @Prop() classification?: IcProtectiveMarkings = \"default\";\n /\n ~~Optional~~ text displayed before classification to specify relevant country/countries\n /\n @Prop() country?: string = \"uk\";\n /\n ~~Determines~~ ~~whether~~ the banner ~~appears~~ inline with the page or ~~sticks~~ to the bottom of the page\n /\n @Prop() inline?: boolean = false;\n /\n ~~Optionally~~ ~~display~~ \"Up to\" before classification and country ~~if set\~~n */\n @Prop() upTo?: boolean = false;\n\n render() {\n const { classification, inline, country, upTo, additionalSelectors } = this;\n\n return (\n <Host class={{ [\"inline\"]: inline }}>\n <banner\n aria-label=\"Protective marking\"\n class={{\n [\"classification-banner\"]: true,\n [`${classification}`]: classification,\n }}\n role=\"contentinfo\"\n >\n {classification !== \"default\" ? (\n <span class=\"offscreen\">\n The protective marking of this page is:{\" \"}\n </span>\n ) : null}\n <ic-typography variant=\"caption-uppercase\">\n {classification === \"default\"\n ? classificationText[classification]\n : `${upTo ? \"up to\" : \"\"} \n ${country !== \"\" ? country : \"\"} \n ${classificationText[classification]} \n ${additionalSelectors !== \"\" ? additionalSelectors : \"\"}`}\n </ic-typography>\n </banner>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-classification-banner.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,yBAAyB,GAAG,qzGAAqzG;;ACGv1G,MAAM,kBAAkB,GAAG;EACzB,OAAO,EAAE,4BAA4B;EACrC,QAAQ,EAAE,UAAU;EACpB,oBAAoB,EAAE,oBAAoB;EAC1C,MAAM,EAAE,QAAQ;EAChB,YAAY,EAAE,YAAY;CAC3B,CAAC;MAOW,oBAAoB;;;+BAIQ,EAAE;0BAIO,SAAS;mBAI9B,IAAI;kBAIJ,KAAK;gBAIP,KAAK;;EAE9B,MAAM;IACJ,MAAM,EAAE,cAAc,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,mBAAmB,EAAE,GAAG,IAAI,CAAC;IAE5E,QACEA,QAACC,UAAI,IAAC,KAAK,EAAE,EAAE,CAAC,QAAQ,GAAG,MAAM,EAAE,IACjCD,kCACa,oBAAoB,EAC/B,KAAK,EAAE;QACL,CAAC,uBAAuB,GAAG,IAAI;QAC/B,CAAC,GAAG,cAAc,EAAE,GAAG,cAAc;OACtC,EACD,IAAI,EAAC,aAAa,IAEjB,cAAc,KAAK,SAAS,IAC3BA,kBAAM,KAAK,EAAC,WAAW,+CACmB,GAAG,CACtC,IACL,IAAI,EACRA,2BAAe,OAAO,EAAC,mBAAmB,IACvC,cAAc,KAAK,SAAS;QACzB,kBAAkB,CAAC,cAAc,CAAC;QAClC,GAAG,IAAI,GAAG,OAAO,GAAG,EAAE;iBACrB,OAAO,KAAK,EAAE,GAAG,OAAO,GAAG,EAAE;iBAC7B,kBAAkB,CAAC,cAAc,CAAC;iBAClC,mBAAmB,KAAK,EAAE,GAAG,mBAAmB,GAAG,EAAE,EAAE,CAC9C,CACT,CACJ,EACP;GACH;;;;;;","names":["h","Host"],"sources":["./src/components/ic-classification-banner/ic-classification-banner.css?tag=ic-classification-banner&encapsulation=shadow","./src/components/ic-classification-banner/ic-classification-banner.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n position: fixed;\n left: 0;\n bottom: 0;\n width: 100%;\n height: var(--ic-space-lg);\n z-index: var(--ic-z-index-overlay);\n}\n\n:host(.inline) {\n position: static;\n left: auto;\n bottom: auto;\n}\n\n.classification-banner {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding: var(--ic-space-xxxs) var(--ic-space-md);\n}\n\n.default {\n background-color: var(--ic-classification-not-set);\n color: var(--ic-classification-not-set-foreground);\n}\n\n.official,\n.official-sensitive {\n background-color: var(--ic-classification-official);\n color: var(--ic-classification-official-foreground);\n}\n\n.secret {\n background-color: var(--ic-classification-secret);\n color: var(--ic-classification-secret-foreground);\n}\n\n.top-secret {\n background-color: var(--ic-classification-top-secret);\n color: var(--ic-classification-top-secret-foreground);\n}\n\n.offscreen {\n position: absolute;\n left: -9999px;\n background-color: #fff;\n color: #000;\n text-transform: none;\n}\n\n@media (forced-colors: active) {\n .classification-banner {\n border: var(--ic-hc-border);\n }\n}\n","import { Component, Prop, h, Host } from \"@stencil/core\";\nimport { IcProtectiveMarkings } from \"./ic-classification-banner.types\";\n\nconst classificationText = {\n default: \"protective marking not set\",\n official: \"official\",\n \"official-sensitive\": \"official sensitive\",\n secret: \"secret\",\n \"top-secret\": \"top secret\",\n};\n\n@Component({\n tag: \"ic-classification-banner\",\n styleUrl: \"ic-classification-banner.css\",\n shadow: true,\n})\nexport class ClassificationBanner {\n /*\n The additional information that will be displayed after the classification.\n /\n @Prop() additionalSelectors?: string = \"\";\n /\n The classification level to be displayed - also determines the banner and text colour.\n /\n @Prop() classification?: IcProtectiveMarkings = \"default\";\n /\n The optional text that will be displayed before classification to specify relevant country/countries.\n /\n @Prop() country?: string = \"uk\";\n /\n If `true`, the banner will appear inline with the page, instead of sticking to the bottom of the page.\n /\n @Prop() inline?: boolean = false;\n /\n If `true`, \"Up to\" will be displayed before the classification and country.\n */\n @Prop() upTo?: boolean = false;\n\n render() {\n const { classification, inline, country, upTo, additionalSelectors } = this;\n\n return (\n <Host class={{ [\"inline\"]: inline }}>\n <banner\n aria-label=\"Protective marking\"\n class={{\n [\"classification-banner\"]: true,\n [`${classification}`]: classification,\n }}\n role=\"contentinfo\"\n >\n {classification !== \"default\" ? (\n <span class=\"offscreen\">\n The protective marking of this page is:{\" \"}\n </span>\n ) : null}\n <ic-typography variant=\"caption-uppercase\">\n {classification === \"default\"\n ? classificationText[classification]\n : `${upTo ? \"up to\" : \"\"} \n ${country !== \"\" ? country : \"\"} \n ${classificationText[classification]} \n ${additionalSelectors !== \"\" ? additionalSelectors : \"\"}`}\n </ic-typography>\n </banner>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ic-data-entity.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-data-entity.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,eAAe,GAAG,2xFAA2xF;;MCOtyF,UAAU;;;;iBAWI,KAAK;;EAE9B,MAAM;IACJ,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;IAEhC,MAAM,QAAQ,GAAG,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC;IAElC,IAAI,KAAK,EAAE;MACT,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,QAAQ,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;QACxC,QAAQ,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;OAC3C;KACF;IAED,QACEA,QAACC,UAAI,IAAC,KAAK,EAAE,EAAE,CAAC,OAAO,GAAG,KAAK,EAAE,IAC/BD,iBAAK,KAAK,EAAC,SAAS,EAAC,EAAE,EAAC,qBAAqB,IAC3CA,kBAAM,IAAI,EAAC,SAAS,IAClBA,2BAAe,OAAO,EAAC,IAAI,IAAE,OAAO,CAAiB,CAChD,CACH,EACNA,iBAAK,KAAK,EAAC,SAAS,GAAG,EACvBA,mCAAoB,qBAAqB,EAAC,KAAK,EAAC,MAAM,IACpDA,qBAAa,CACV,CACA,EACP;GACH;;;;;;;","names":["h","Host"],"sources":["./src/components/ic-data-entity/ic-data-entity.css?tag=ic-data-entity&encapsulation=shadow","./src/components/ic-data-entity/ic-data-entity.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n display: block;\n}\n\n.rows {\n display: flex;\n flex-direction: column;\n gap: var(--ic-space-md);\n}\n\n:host(.small) .rows {\n gap: var(--ic-space-xs);\n}\n\n.divider {\n margin-top: var(--ic-space-lg);\n margin-bottom: var(--ic-space-md);\n height: 1px;\n background-color: var(--ic-architectural-300);\n}\n\n:host(.small) .divider {\n margin-top: var(--ic-space-sm);\n margin-bottom: var(--ic-space-xs);\n}\n\n@media (forced-colors: active) {\n .divider {\n background-color: canvastext;\n }\n}\n","import { Component, Element, Host, h, Prop } from \"@stencil/core\";\n\n@Component({\n tag: \"ic-data-entity\",\n styleUrl: \"ic-data-entity.css\",\n shadow: true,\n})\nexport class DataEntity {\n @Element() el: HTMLIcDataEntityElement;\n\n /*\n ~~Title~~ for the data entity\n /\n @Prop() heading: string;\n\n /\n ~~Set~~ the data heading and all child data rows ~~to small styling\~~n */\n @Prop() small: boolean = false;\n\n render() {\n const { heading, small } = this;\n\n const children = this.el.children;\n\n if (small) {\n for (let i = 0; i < children.length; i++) {\n children[i].setAttribute(\"small\", \"true\");\n }\n }\n\n return (\n <Host class={{ [\"small\"]: small }}>\n <div class=\"heading\" id=\"data-entity-heading\">\n <slot name=\"heading\">\n <ic-typography variant=\"h3\">{heading}</ic-typography>\n </slot>\n </div>\n <div class=\"divider\" />\n <ul aria-labelledby=\"data-entity-heading\" class=\"rows\">\n <slot></slot>\n </ul>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-data-entity.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,eAAe,GAAG,2xFAA2xF;;MCOtyF,UAAU;;;;iBAWI,KAAK;;EAE9B,MAAM;IACJ,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;IAEhC,MAAM,QAAQ,GAAG,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC;IAElC,IAAI,KAAK,EAAE;MACT,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,QAAQ,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;QACxC,QAAQ,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;OAC3C;KACF;IAED,QACEA,QAACC,UAAI,IAAC,KAAK,EAAE,EAAE,CAAC,OAAO,GAAG,KAAK,EAAE,IAC/BD,iBAAK,KAAK,EAAC,SAAS,EAAC,EAAE,EAAC,qBAAqB,IAC3CA,kBAAM,IAAI,EAAC,SAAS,IAClBA,2BAAe,OAAO,EAAC,IAAI,IAAE,OAAO,CAAiB,CAChD,CACH,EACNA,iBAAK,KAAK,EAAC,SAAS,GAAG,EACvBA,mCAAoB,qBAAqB,EAAC,KAAK,EAAC,MAAM,IACpDA,qBAAa,CACV,CACA,EACP;GACH;;;;;;;","names":["h","Host"],"sources":["./src/components/ic-data-entity/ic-data-entity.css?tag=ic-data-entity&encapsulation=shadow","./src/components/ic-data-entity/ic-data-entity.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n display: block;\n}\n\n.rows {\n display: flex;\n flex-direction: column;\n gap: var(--ic-space-md);\n}\n\n:host(.small) .rows {\n gap: var(--ic-space-xs);\n}\n\n.divider {\n margin-top: var(--ic-space-lg);\n margin-bottom: var(--ic-space-md);\n height: 1px;\n background-color: var(--ic-architectural-300);\n}\n\n:host(.small) .divider {\n margin-top: var(--ic-space-sm);\n margin-bottom: var(--ic-space-xs);\n}\n\n@media (forced-colors: active) {\n .divider {\n background-color: canvastext;\n }\n}\n","import { Component, Element, Host, h, Prop } from \"@stencil/core\";\n\n@Component({\n tag: \"ic-data-entity\",\n styleUrl: \"ic-data-entity.css\",\n shadow: true,\n})\nexport class DataEntity {\n @Element() el: HTMLIcDataEntityElement;\n\n /*\n The title for the data entity.\n /\n @Prop() heading: string;\n\n /\n If `true`, the small styling will be applied to the data heading and all child data rows.\n */\n @Prop() small: boolean = false;\n\n render() {\n const { heading, small } = this;\n\n const children = this.el.children;\n\n if (small) {\n for (let i = 0; i < children.length; i++) {\n children[i].setAttribute(\"small\", \"true\");\n }\n }\n\n return (\n <Host class={{ [\"small\"]: small }}>\n <div class=\"heading\" id=\"data-entity-heading\">\n <slot name=\"heading\">\n <ic-typography variant=\"h3\">{heading}</ic-typography>\n </slot>\n </div>\n <div class=\"divider\" />\n <ul aria-labelledby=\"data-entity-heading\" class=\"rows\">\n <slot></slot>\n </ul>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ic-data-row.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-data-row.entry.cjs.js","mappings":"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","names":["DEVICE_SIZES","getCurrentDeviceSize","slotHasContent","checkResizeObserver","h","Host"],"sources":["./src/components/ic-data-row/ic-data-row.css?tag=ic-data-row&encapsulation=shadow","./src/components/ic-data-row/ic-data-row.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n position: relative;\n display: block;\n}\n\n.data {\n display: flex;\n align-items: center;\n}\n\n.text-cells {\n display: flex;\n flex-grow: 1;\n min-width: 0;\n}\n\n.label {\n width: 200px;\n min-width: 200px;\n margin-right: var(--ic-space-md);\n color: var(--ic-color-tertiary-text);\n}\n\n.value {\n flex-grow: 1;\n}\n\n.end-component {\n width: fit-content;\n margin-left: 56px;\n}\n\n.divider {\n margin-top: var(--ic-space-md);\n height: 1px;\n background-color: var(--ic-architectural-300);\n}\n\n:host(.small) .divider {\n margin-top: var(--ic-space-xs);\n}\n\n:host(.breakpoint-medium) .label {\n width: 160px;\n min-width: 160px;\n}\n\n:host(.breakpoint-xs) .text-cells {\n flex-direction: column;\n}\n\n:host(.breakpoint-xs) .label {\n width: 128px;\n margin-bottom: var(--ic-space-xs);\n}\n\n:host(.breakpoint-xs) .value {\n max-width: 95%;\n}\n\n:host(.breakpoint-xs) .end-component {\n margin-left: 0;\n}\n\n@media (forced-colors: active) {\n .divider {\n background-color: canvastext;\n }\n}\n","import { Component, Element, Host, Prop, h, State } from \"@stencil/core\";\nimport {\n checkResizeObserver,\n DEVICE_SIZES,\n getCurrentDeviceSize,\n slotHasContent,\n} from \"../../utils/helpers\";\n\n/*\n @slot label - Content will be rendered in the leftmost cell.\n * @slot value - Content will be rendered to the right of the label.\n * @slot end-component - Content will be displayed in the rightmost cell.\n /\n@Component({\n tag: \"ic-data-row\",\n styleUrl: \"ic-data-row.css\",\n shadow: true,\n})\nexport class DataRow {\n @Element() el: HTMLIcDataRowElement;\n\n /\n ~~Set~~ ~~the~~ label in the leftmost cell of the row\n /\n @Prop() label: string;\n\n /\n ~~Set~~ ~~the~~ value of the middle (right if no ~~addition~~ supplied) cell of the row\n /\n @Prop() value: string;\n\n /\n ~~Set~~ the ~~row~~ to ~~small~~ ~~styling,~~ ~~this~~ is automatically applied if small is set on the parent data heading\n */\n @Prop() small: boolean = false;\n\n @State() deviceSize: number = DEVICE_SIZES.XL;\n\n @State() entitySize: \"xl\" \| \"m\" \| \"xs\";\n\n private resizeObserver: ResizeObserver = null;\n\n private hasEndComponent: boolean = false;\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n this.checkLabelAbove();\n });\n\n this.resizeObserver.observe(this.el);\n };\n\n private checkLabelAbove() {\n const rowSize = this.el.shadowRoot.querySelector(\".data\")?.clientWidth;\n if (rowSize + 46 < DEVICE_SIZES.S) {\n this.entitySize = \"xs\";\n } else if (rowSize + 46 < DEVICE_SIZES.M) {\n this.entitySize = \"m\";\n } else {\n this.entitySize = \"xl\";\n }\n }\n\n private labelEndComponent(): void {\n const component = this.el.shadowRoot.querySelectorAll(\n \"slot[name=end-component]\"\n );\n\n component.forEach((child: HTMLElement) =>\n child.setAttribute(\"aria-label\", \"for \" + this.label + \" row\")\n );\n }\n\n componentWillLoad(): void {\n this.deviceSize = getCurrentDeviceSize();\n this.hasEndComponent = slotHasContent(this.el, \"end-component\");\n }\n\n componentDidLoad(): void {\n checkResizeObserver(this.runResizeObserver);\n this.checkLabelAbove();\n if (this.hasEndComponent) {\n this.labelEndComponent();\n }\n }\n\n disconnectedCallback(): void {\n if (this.resizeObserver !== null) {\n this.resizeObserver.disconnect();\n }\n }\n\n render() {\n const { label, value, small } = this;\n\n return (\n <Host\n class={{\n [\"small\"]: small,\n [\"breakpoint-medium\"]: this.entitySize === \"m\",\n [\"breakpoint-xs\"]: this.entitySize === \"xs\",\n }}\n role=\"listitem\"\n >\n <div class=\"data\">\n <div class=\"text-cells\">\n <div class=\"label\">\n <slot name=\"label\">\n <ic-typography\n variant={\n this.entitySize === \"xs\" ? \"label\" : \"subtitle-large\"\n }\n >\n {label}\n </ic-typography>\n </slot>\n </div>\n <div class=\"value\">\n <slot name=\"value\">\n <ic-typography variant=\"body\">{value}</ic-typography>\n </slot>\n </div>\n </div>\n {this.hasEndComponent && (\n <div class=\"end-component\">\n <div role=\"cell\">\n <slot name=\"end-component\"></slot>\n </div>\n </div>\n )}\n </div>\n <div class=\"divider\" />\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-data-row.entry.cjs.js","mappings":"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","names":["DEVICE_SIZES","getCurrentDeviceSize","slotHasContent","checkResizeObserver","h","Host"],"sources":["./src/components/ic-data-row/ic-data-row.css?tag=ic-data-row&encapsulation=shadow","./src/components/ic-data-row/ic-data-row.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n position: relative;\n display: block;\n}\n\n.data {\n display: flex;\n align-items: center;\n}\n\n.text-cells {\n display: flex;\n flex-grow: 1;\n min-width: 0;\n}\n\n.label {\n width: 200px;\n min-width: 200px;\n margin-right: var(--ic-space-md);\n color: var(--ic-color-tertiary-text);\n}\n\n.value {\n flex-grow: 1;\n}\n\n.end-component {\n width: fit-content;\n margin-left: 56px;\n}\n\n.divider {\n margin-top: var(--ic-space-md);\n height: 1px;\n background-color: var(--ic-architectural-300);\n}\n\n:host(.small) .divider {\n margin-top: var(--ic-space-xs);\n}\n\n:host(.breakpoint-medium) .label {\n width: 160px;\n min-width: 160px;\n}\n\n:host(.breakpoint-xs) .text-cells {\n flex-direction: column;\n}\n\n:host(.breakpoint-xs) .label {\n width: 128px;\n margin-bottom: var(--ic-space-xs);\n}\n\n:host(.breakpoint-xs) .value {\n max-width: 95%;\n}\n\n:host(.breakpoint-xs) .end-component {\n margin-left: 0;\n}\n\n@media (forced-colors: active) {\n .divider {\n background-color: canvastext;\n }\n}\n","import { Component, Element, Host, Prop, h, State } from \"@stencil/core\";\nimport {\n checkResizeObserver,\n DEVICE_SIZES,\n getCurrentDeviceSize,\n slotHasContent,\n} from \"../../utils/helpers\";\n\n/*\n @slot label - Content will be rendered in the leftmost cell.\n * @slot value - Content will be rendered to the right of the label.\n * @slot end-component - Content will be displayed in the rightmost cell.\n /\n@Component({\n tag: \"ic-data-row\",\n styleUrl: \"ic-data-row.css\",\n shadow: true,\n})\nexport class DataRow {\n @Element() el: HTMLIcDataRowElement;\n\n /\n The label in the leftmost cell of the row.\n /\n @Prop() label: string;\n\n /\n The value of the middle (right if no end-component supplied) cell of the row.\n /\n @Prop() value: string;\n\n /\n If `true`, the small styling will be applied to the row. This is automatically applied if small is set on the parent data heading.\n */\n @Prop() small: boolean = false;\n\n @State() deviceSize: number = DEVICE_SIZES.XL;\n\n @State() entitySize: \"xl\" \| \"m\" \| \"xs\";\n\n private resizeObserver: ResizeObserver = null;\n\n private hasEndComponent: boolean = false;\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n this.checkLabelAbove();\n });\n\n this.resizeObserver.observe(this.el);\n };\n\n private checkLabelAbove() {\n const rowSize = this.el.shadowRoot.querySelector(\".data\")?.clientWidth;\n if (rowSize + 46 < DEVICE_SIZES.S) {\n this.entitySize = \"xs\";\n } else if (rowSize + 46 < DEVICE_SIZES.M) {\n this.entitySize = \"m\";\n } else {\n this.entitySize = \"xl\";\n }\n }\n\n private labelEndComponent(): void {\n const component = this.el.shadowRoot.querySelectorAll(\n \"slot[name=end-component]\"\n );\n\n component.forEach((child: HTMLElement) =>\n child.setAttribute(\"aria-label\", \"for \" + this.label + \" row\")\n );\n }\n\n componentWillLoad(): void {\n this.deviceSize = getCurrentDeviceSize();\n this.hasEndComponent = slotHasContent(this.el, \"end-component\");\n }\n\n componentDidLoad(): void {\n checkResizeObserver(this.runResizeObserver);\n this.checkLabelAbove();\n if (this.hasEndComponent) {\n this.labelEndComponent();\n }\n }\n\n disconnectedCallback(): void {\n if (this.resizeObserver !== null) {\n this.resizeObserver.disconnect();\n }\n }\n\n render() {\n const { label, value, small } = this;\n\n return (\n <Host\n class={{\n [\"small\"]: small,\n [\"breakpoint-medium\"]: this.entitySize === \"m\",\n [\"breakpoint-xs\"]: this.entitySize === \"xs\",\n }}\n role=\"listitem\"\n >\n <div class=\"data\">\n <div class=\"text-cells\">\n <div class=\"label\">\n <slot name=\"label\">\n <ic-typography\n variant={\n this.entitySize === \"xs\" ? \"label\" : \"subtitle-large\"\n }\n >\n {label}\n </ic-typography>\n </slot>\n </div>\n <div class=\"value\">\n <slot name=\"value\">\n <ic-typography variant=\"body\">{value}</ic-typography>\n </slot>\n </div>\n </div>\n {this.hasEndComponent && (\n <div class=\"end-component\">\n <div role=\"cell\">\n <slot name=\"end-component\"></slot>\n </div>\n </div>\n )}\n </div>\n <div class=\"divider\" />\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ic-footer-link-group.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-footer-link-group.entry.cjs.js","mappings":"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","names":["getThemeForegroundColor","DEVICE_SIZES","onComponentRequiredPropUndefined","h","Host"],"sources":["./src/components/ic-footer-link-group/ic-footer-link-group.css?tag=ic-footer-link-group&encapsulation=shadow","./src/components/ic-footer-link-group/ic-footer-link-group.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host(.footer-link-group-sparse) {\n --footer-link-group-margin-right: 95px;\n --footer-link-group-border-bottom: 0 solid transparent;\n --footer-link-group-title-margin-top: 0;\n --footer-link-group-title-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-group-small) {\n --footer-link-group-margin-right: 0;\n --footer-link-group-title-margin-top: var(--ic-space-md);\n --footer-link-group-title-margin-bottom: var(--ic-space-md);\n --footer-link-group-links-padding-left: var(--ic-space-md);\n --footer-link-group-links-padding-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-group-light.footer-link-group-small) {\n --footer-link-group-border-bottom: var(--ic-keyline-lighten);\n}\n\n:host(.footer-link-group-dark.footer-link-group-small) {\n --footer-link-group-border-bottom: var(--ic-keyline-darken);\n}\n\n:host(.footer-link-group) {\n margin-right: var(--footer-link-group-margin-right);\n border-bottom: var(--footer-link-group-border-bottom);\n}\n\n:host(.footer-link-group-small.footer-link-group-light:hover) {\n background-color: var(--ic-action-light-bg-hover);\n cursor: pointer;\n}\n\n:host(.footer-link-group-small.footer-link-group-dark:hover) {\n background-color: var(--ic-action-dark-bg-hover);\n cursor: pointer;\n}\n\n:host(.footer-link-group-sparse:focus) {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n outline: var(--ic-hc-focus-outline);\n z-index: 1;\n}\n\n:host(.footer-link-group-small:focus) {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n outline: var(--ic-hc-focus-outline);\n z-index: 1;\n}\n\n:host(.footer-link-group-small.footer-link-group-light:active) {\n background-color: var(--ic-action-light-bg-active);\n}\n\n:host(.footer-link-group-small.footer-link-group-dark:active) {\n background-color: var(--ic-action-dark-bg-active);\n}\n\n.footer-link-group-title {\n margin-top: var(--footer-link-group-title-margin-top);\n margin-bottom: var(--footer-link-group-title-margin-bottom);\n flex-grow: 1;\n}\n\n.footer-link-group-toggle {\n fill: white !important;\n}\n\n.footer-link-group-links {\n display: flex;\n flex-direction: column;\n}\n\n.footer-link-group-header {\n display: flex;\n align-items: center;\n}\n","import {\n Component,\n Host,\n Element,\n Listen,\n Prop,\n h,\n State,\n} from \"@stencil/core\";\nimport {\n DEVICE_SIZES,\n getThemeForegroundColor,\n onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcTheme } from \"../../utils/types\";\n\n@Component({\n tag: \"ic-footer-link-group\",\n styleUrl: \"ic-footer-link-group.css\",\n shadow: true,\n})\nexport class FooterLinkGroup {\n @Element() el: HTMLIcFooterLinkGroupElement;\n\n /*\n ~~Sets~~ ~~the~~ title of the link group ~~for~~ ~~display\~~n */\n @Prop() groupTitle!: string;\n\n @State() small: boolean = false;\n\n @State() expanded: boolean = false;\n\n @State() dropdownIconStyle = getThemeForegroundColor();\n\n @State() deviceSize: number = DEVICE_SIZES.XL;\n\n private isSmall(e: HTMLElement): boolean {\n if (e.parentElement !== null) {\n if (e.parentElement.classList.contains(\"footer\")) {\n return e.parentElement.classList.contains(\"footer-small\");\n } else {\n return this.isSmall(e.parentElement);\n }\n } else {\n return false;\n }\n }\n\n private handleKeydown = (event: KeyboardEvent): void => {\n if (event.key === \" \" \|\| event.key === \"Enter\") {\n this.toggleExpanded();\n }\n };\n\n private toggleExpanded = (): void => {\n this.expanded = !this.expanded;\n };\n\n @Listen(\"icFooterResized\", { target: \"document\" })\n footerResizeHandler(): void {\n this.small = this.isSmall(this.el);\n }\n\n @Listen(\"icThemeChange\", { target: \"document\" })\n footerThemeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.dropdownIconStyle = theme.mode;\n }\n\n componentWillLoad(): void {\n this.small = this.isSmall(this.el);\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.groupTitle, propName: \"group-title\" }],\n \"Footer Link Group\"\n );\n }\n\n render() {\n const { small, groupTitle } = this;\n\n return !small ? (\n <Host\n class={{\n [\"footer-link-group footer-link-group-sparse\"]: true,\n [`footer-link-group-${this.dropdownIconStyle}`]: true,\n }}\n >\n <div class=\"footer-link-group-title\">\n <ic-typography variant=\"subtitle-small\">{groupTitle}</ic-typography>\n </div>\n <div class=\"footer-link-group-links\">\n <slot />\n </div>\n </Host>\n ) : (\n <Host\n class={{\n [\"footer-link-group footer-link-group-small\"]: true,\n [`footer-link-group-${this.dropdownIconStyle}`]: true,\n }}\n tabIndex=\"1\"\n onClick={this.toggleExpanded}\n onKeydown={this.handleKeydown}\n aria-haspopup=\"true\"\n aria-expanded={this.expanded}\n >\n <ic-section-container fullHeight={true}>\n <div class=\"footer-link-group-header\">\n <div class=\"footer-link-group-title\">\n <ic-typography variant=\"label\">{groupTitle}</ic-typography>\n </div>\n {this.expanded ? (\n <svg\n class=\"footer-link-group-toggle\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n role=\"img\"\n width=\"1em\"\n height=\"1em\"\n preserveAspectRatio=\"xMidYMid meet\"\n viewBox=\"0 0 1200 1200\"\n >\n <path\n fill=\"currentColor\"\n d=\"M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z\"\n />\n </svg>\n ) : (\n <svg\n class=\"footer-link-group-toggle\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n role=\"img\"\n width=\"1em\"\n height=\"1em\"\n preserveAspectRatio=\"xMidYMid meet\"\n viewBox=\"0 0 1200 1200\"\n >\n <g transform=\"translate(0 1200) scale(1 -1)\">\n <path\n fill=\"currentColor\"\n d=\"M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z\"\n />\n </g>\n </svg>\n )}\n </div>\n {this.expanded && (\n <div class=\"footer-link-group-links\">\n <slot />\n </div>\n )}\n </ic-section-container>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-footer-link-group.entry.cjs.js","mappings":"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","names":["getThemeForegroundColor","DEVICE_SIZES","onComponentRequiredPropUndefined","h","Host"],"sources":["./src/components/ic-footer-link-group/ic-footer-link-group.css?tag=ic-footer-link-group&encapsulation=shadow","./src/components/ic-footer-link-group/ic-footer-link-group.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host(.footer-link-group-sparse) {\n --footer-link-group-margin-right: 95px;\n --footer-link-group-border-bottom: 0 solid transparent;\n --footer-link-group-title-margin-top: 0;\n --footer-link-group-title-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-group-small) {\n --footer-link-group-margin-right: 0;\n --footer-link-group-title-margin-top: var(--ic-space-md);\n --footer-link-group-title-margin-bottom: var(--ic-space-md);\n --footer-link-group-links-padding-left: var(--ic-space-md);\n --footer-link-group-links-padding-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-group-light.footer-link-group-small) {\n --footer-link-group-border-bottom: var(--ic-keyline-lighten);\n}\n\n:host(.footer-link-group-dark.footer-link-group-small) {\n --footer-link-group-border-bottom: var(--ic-keyline-darken);\n}\n\n:host(.footer-link-group) {\n margin-right: var(--footer-link-group-margin-right);\n border-bottom: var(--footer-link-group-border-bottom);\n}\n\n:host(.footer-link-group-small.footer-link-group-light:hover) {\n background-color: var(--ic-action-light-bg-hover);\n cursor: pointer;\n}\n\n:host(.footer-link-group-small.footer-link-group-dark:hover) {\n background-color: var(--ic-action-dark-bg-hover);\n cursor: pointer;\n}\n\n:host(.footer-link-group-sparse:focus) {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n outline: var(--ic-hc-focus-outline);\n z-index: 1;\n}\n\n:host(.footer-link-group-small:focus) {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n outline: var(--ic-hc-focus-outline);\n z-index: 1;\n}\n\n:host(.footer-link-group-small.footer-link-group-light:active) {\n background-color: var(--ic-action-light-bg-active);\n}\n\n:host(.footer-link-group-small.footer-link-group-dark:active) {\n background-color: var(--ic-action-dark-bg-active);\n}\n\n.footer-link-group-title {\n margin-top: var(--footer-link-group-title-margin-top);\n margin-bottom: var(--footer-link-group-title-margin-bottom);\n flex-grow: 1;\n}\n\n.footer-link-group-toggle {\n fill: white !important;\n}\n\n.footer-link-group-links {\n display: flex;\n flex-direction: column;\n}\n\n.footer-link-group-header {\n display: flex;\n align-items: center;\n}\n","import {\n Component,\n Host,\n Element,\n Listen,\n Prop,\n h,\n State,\n} from \"@stencil/core\";\nimport {\n DEVICE_SIZES,\n getThemeForegroundColor,\n onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcTheme } from \"../../utils/types\";\n\n@Component({\n tag: \"ic-footer-link-group\",\n styleUrl: \"ic-footer-link-group.css\",\n shadow: true,\n})\nexport class FooterLinkGroup {\n @Element() el: HTMLIcFooterLinkGroupElement;\n\n /*\n The title of the link group to be displayed.\n */\n @Prop() groupTitle!: string;\n\n @State() small: boolean = false;\n\n @State() expanded: boolean = false;\n\n @State() dropdownIconStyle = getThemeForegroundColor();\n\n @State() deviceSize: number = DEVICE_SIZES.XL;\n\n private isSmall(e: HTMLElement): boolean {\n if (e.parentElement !== null) {\n if (e.parentElement.classList.contains(\"footer\")) {\n return e.parentElement.classList.contains(\"footer-small\");\n } else {\n return this.isSmall(e.parentElement);\n }\n } else {\n return false;\n }\n }\n\n private handleKeydown = (event: KeyboardEvent): void => {\n if (event.key === \" \" \|\| event.key === \"Enter\") {\n this.toggleExpanded();\n }\n };\n\n private toggleExpanded = (): void => {\n this.expanded = !this.expanded;\n };\n\n @Listen(\"icFooterResized\", { target: \"document\" })\n footerResizeHandler(): void {\n this.small = this.isSmall(this.el);\n }\n\n @Listen(\"icThemeChange\", { target: \"document\" })\n footerThemeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.dropdownIconStyle = theme.mode;\n }\n\n componentWillLoad(): void {\n this.small = this.isSmall(this.el);\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.groupTitle, propName: \"group-title\" }],\n \"Footer Link Group\"\n );\n }\n\n render() {\n const { small, groupTitle } = this;\n\n return !small ? (\n <Host\n class={{\n [\"footer-link-group footer-link-group-sparse\"]: true,\n [`footer-link-group-${this.dropdownIconStyle}`]: true,\n }}\n >\n <div class=\"footer-link-group-title\">\n <ic-typography variant=\"subtitle-small\">{groupTitle}</ic-typography>\n </div>\n <div class=\"footer-link-group-links\">\n <slot />\n </div>\n </Host>\n ) : (\n <Host\n class={{\n [\"footer-link-group footer-link-group-small\"]: true,\n [`footer-link-group-${this.dropdownIconStyle}`]: true,\n }}\n tabIndex=\"1\"\n onClick={this.toggleExpanded}\n onKeydown={this.handleKeydown}\n aria-haspopup=\"true\"\n aria-expanded={this.expanded}\n >\n <ic-section-container fullHeight={true}>\n <div class=\"footer-link-group-header\">\n <div class=\"footer-link-group-title\">\n <ic-typography variant=\"label\">{groupTitle}</ic-typography>\n </div>\n {this.expanded ? (\n <svg\n class=\"footer-link-group-toggle\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n role=\"img\"\n width=\"1em\"\n height=\"1em\"\n preserveAspectRatio=\"xMidYMid meet\"\n viewBox=\"0 0 1200 1200\"\n >\n <path\n fill=\"currentColor\"\n d=\"M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z\"\n />\n </svg>\n ) : (\n <svg\n class=\"footer-link-group-toggle\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n role=\"img\"\n width=\"1em\"\n height=\"1em\"\n preserveAspectRatio=\"xMidYMid meet\"\n viewBox=\"0 0 1200 1200\"\n >\n <g transform=\"translate(0 1200) scale(1 -1)\">\n <path\n fill=\"currentColor\"\n d=\"M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z\"\n />\n </g>\n </svg>\n )}\n </div>\n {this.expanded && (\n <div class=\"footer-link-group-links\">\n <slot />\n </div>\n )}\n </ic-section-container>\n </Host>\n );\n }\n}\n"],"version":3}