@siemens/ix 0.0.0-20240419081748

package/components/select.js.map

@@ -0,0 +1 @@
+{"file":"select.js","mappings":";;;;;;;;;AAAA,MAAM,SAAS,GAAG,+jHAA+jH,CAAC;AACllH,uBAAe,SAAS;;ACDxB;;;;;;;;;;;;;;;;;;MA6Ba,MAAM;;;;;;;;;;;0BAoBI,KAAK;oBAKY,QAAQ;wBAK3B,KAAK;wBAKL,KAAK;wBAKL,KAAK;+BAKE,kBAAkB;uCAKV,uBAAuB;oCAK1B,yBAAyB;6BAOhC,YAAY;8BAOX,KAAK;4BA0BN,KAAK;;;;+BAIF,KAAK;wBACZ,KAAK;;;;;IAWzB,IAAI,KAAK;QACP,OAAO;YACL,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;YAClE,GAAG,KAAK,CAAC,IAAI,CACX,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,CAC/D;SACF,CAAC;KACH;IAED,IAAI,aAAa;QACf,OAAO,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,QAAQ,CAAC,CAAC;KACnD;IAED,IAAI,aAAa;QACf,OAAO,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;KAC/D;IAED,IAAI,YAAY;QACd,OAAO,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC;KAC/B;IAED,IAAI,cAAc;QAChB,OAAO,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC;KACjC;IAED,IAAI,yBAAyB;QAC3B,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC;KACtE;IAGD,oBAAoB,CAAC,KAAwB;QAC3C,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACnB,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAGD,UAAU,CAAC,KAAwB;QACjC,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;QAC7B,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAGD,aAAa,CAAC,KAA0B;QACtC,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC;QAC3B,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;KACvB;IAEO,SAAS,CAAC,KAAa;QAC7B,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QACrC,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAEO,WAAW,CAAC,KAAa;QAC/B,IAAI,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YACvB,OAAO;SACR;QAED,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;QACzD,OAAO,CAAC,KAAK,GAAG,KAAK,CAAC;QACtB,OAAO,CAAC,KAAK,GAAG,KAAK,CAAC;QAEtB,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;QAErC,IAAI,CAAC,UAAU,EAAE,CAAC;QAClB,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;QACtB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KAC1B;IAEO,WAAW,CAAC,SAAiB;QACnC,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;YACxB,OAAO,SAAS,CAAC;SAClB;QAED,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YACf,OAAO,CAAC,SAAS,CAAC,CAAC;SACpB;QAED,IAAI,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;QAEvB,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;YACzB,KAAK,GAAG,CAAC,KAAK,CAAC,CAAC;SACjB;QAED,IAAI,KAAK,CAAC,QAAQ,CAAC,SAAS,CAAC,EAAE;YAC7B,OAAO,KAAK,CAAC,MAAM,CAAC,CAAC,KAAK,KAAK,KAAK,KAAK,SAAS,CAAC,CAAC;SACrD;aAAM;YACL,OAAO,CAAC,GAAG,KAAK,EAAE,SAAS,CAAC,CAAC;SAC9B;KACF;IAEO,eAAe;;QACrB,IAAI,GAAG,GAAG,EAAE,CAAC;QAEb,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,GAAG,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SAClE;QAED,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI;YACtB,IAAI,CAAC,QAAQ,GAAG,GAAG,CAAC,IAAI;;YAEtB,CAAC,CAAC,KACA,CAAC;iBACA,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,KAAK,KAAK,IAAI;sBAC5C,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;sBACrB,EAAE,CAAC,CACV,CAAC;SACH,CAAC,CAAC;QAEH,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,KAAK,CAAC,CAAC;QAEnE,IAAI,IAAI,CAAC,YAAY,EAAE;YACrB,IAAI,CAAC,UAAU,GAAG,CAAA,MAAA,IAAI,CAAC,cAAc,0CAAE,MAAM;kBACzC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC;kBACtB,IAAI,CAAC;YACT,OAAO;SACR;QAED,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;KACxB;IAEO,eAAe;QACrB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAElC,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YACf,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;SACrC;aAAM;YACL,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAC3B,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CACtD,CAAC;SACH;KACF;IAED,gBAAgB;QACd,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE;YACtC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;YACzB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;SAC5C,CAAC,CAAC;KACJ;IAED,iBAAiB;QACf,IAAI,IAAI,CAAC,eAAe,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YACvC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,eAAe,CAAC;SACnC;QAED,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAGD,aAAa,CAAC,KAAmC;QAC/C,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,KAAK,CAAC,wBAAwB,EAAE,CAAC;QACjC,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAED,oBAAoB;QAClB,IAAI,IAAI,CAAC,qBAAqB,EAAE;YAC9B,IAAI,CAAC,qBAAqB,CAAC,UAAU,EAAE,CAAC;SACzC;KACF;IAEO,UAAU,CAAC,IAAY;QAC7B,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,KAAK,KAAK,IAAI,CAAC,CAAC;KACjD;IAEO,yBAAyB,CAAC,KAA2B;QAC3D,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,MAAM,CAAC;QACjC,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC;QAE7B,IAAI,KAAK,CAAC,MAAM,EAAE;YAChB,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAC;YACtB,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC;YAEvB,IAAI,CAAC,qBAAqB,EAAE,CAAC;YAC7B,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,yBAAyB,CAAC;SACvD;aAAM;YACL,IAAI,CAAC,cAAc,GAAG,SAAS,CAAC;SACjC;KACF;IAGD,MAAM,SAAS,CAAC,KAAoB;QAClC,IAAI,KAAK,CAAC,IAAI,KAAK,WAAW,IAAI,KAAK,CAAC,IAAI,KAAK,SAAS,EAAE;YAC1D,IAAI,CAAC,iBAAiB,CAAC,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC;SAC3C;QAED,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;YACtB,OAAO;SACR;QAED,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO,IAAI,KAAK,CAAC,IAAI,KAAK,aAAa,EAAE;YAC1D,MAAM,IAAI,CAAC,iBAAiB,EAAE,CAAC;SAChC;QAED,IAAI,KAAK,CAAC,IAAI,KAAK,QAAQ,EAAE;YAC3B,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;SAC3B;KACF;IAEO,MAAM,iBAAiB;;QAC7B,IAAI,IAAI,CAAC,cAAc,EAAE;YACvB,OAAO;SACR;QAED,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,eAAe,CAAC,EAAE;YAC3D,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;YACvC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;SACzD;QAED,MAAA,IAAI,CAAC,cAAc,0CAAE,WAAW,EAAE,CAAC;QACnC,OAAM,MAAA,IAAI,CAAC,WAAW,0CAAE,cAAc,EAAE,CAAA,CAAC;QAEzC,IAAI,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YACvC,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;SAC3B;KACF;IAEO,iBAAiB,CACvB,KAAoB,EACpB,GAA4B;QAE5B,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,KAAK,CAAC,eAAe,EAAE,CAAC;QAExB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;QAEzB,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC;QACxE,IAAI,IAAI,CAAC,cAAc,KAAK,SAAS,EAAE;YACrC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;YAC5B,OAAO;SACR;QAED,IAAI,qBAAqB,GAAG,KAAK,CAAC,SAAS,CACzC,CAAC,IAAI,KAAK,IAAI,KAAK,IAAI,CAAC,cAAc,CACvC,CAAC;QAEF,IAAI,GAAG,KAAK,WAAW,EAAE;YACvB,qBAAqB,EAAE,CAAC;SACzB;aAAM;YACL,qBAAqB,EAAE,CAAC;SACzB;QAED,MAAM,YAAY,GAAG,KAAK,CAAC,qBAAqB,CAAC,CAAC;QAClD,IAAI,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;KACjC;IAEO,YAAY,CAAC,OAAgC;QACnD,IAAI,CAAC,OAAO,EAAE;YACZ,OAAO;SACR;QACD,IAAI,CAAC,cAAc,GAAG,OAAO,CAAC;QAE9B,UAAU,CAAC;YACT,OAAO,CAAC,UAAU;iBACf,aAAa,CAAC,kBAAkB,CAAC;iBACjC,UAAU,CAAC,aAAa,CAAC,QAAQ,CAAC;iBAClC,KAAK,EAAE,CAAC;SACZ,CAAC,CAAC;KACJ;IAEO,wBAAwB;QAC9B,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;QAE3C,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,eAAe,KAAK,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE;YACxE,OAAO;SACR;QAED,IAAI,IAAI,CAAC,eAAe,EAAE;YACxB,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI;gBACtB,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;gBAChC,IACE,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,eAAe,CAAC,WAAW,EAAE,CAAC,EACtE;oBACA,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;iBAC9B;aACF,CAAC,CAAC;SACJ;aAAM;YACL,IAAI,CAAC,qBAAqB,EAAE,CAAC;SAC9B;QAED,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,yBAAyB,CAAC;KACvD;IAEO,qBAAqB;QAC3B,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI;YACtB,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;SACjC,CAAC,CAAC;KACJ;IAEO,UAAU;QAChB,IAAI,CAAC,QAAQ,CAAC,KAAK,GAAG,EAAE,CAAC;QACzB,IAAI,CAAC,eAAe,GAAG,EAAE,CAAC;KAC3B;IAEO,KAAK;QACX,IAAI,CAAC,UAAU,EAAE,CAAC;QAClB,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC;QACzB,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;QAChB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC5B,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;KAC3B;IAEO,WAAW,CAAC,CAAC;QACnB,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO;SACR;QAED,IAAI,IAAI,CAAC,YAAY,EAAE;YACrB,OAAO;SACR;QAED,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,EAAE;YAClD,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,IAAI,CAAC,cAAc,CAAC;SACzC;KACF;IAEO,gBAAgB;QACtB,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO,IAAI,CAAC,uBAAuB,CAAC;SACrC;QAED,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO,EAAE,CAAC;SACX;QAED,OAAO,IAAI,CAAC,eAAe,CAAC;KAC7B;IAEO,gBAAgB;QACtB,QACE,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,eAAe,CAAC;YACtC,IAAI,CAAC,QAAQ;YACb,IAAI,CAAC,eAAe,EACpB;KACH;IAED,MAAM;;QACJ,QACE,EAAC,IAAI,uDACH,4DACE,KAAK,EAAE;gBACL,MAAM,EAAE,IAAI;gBACZ,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,EACD,GAAG,EAAE,CAAC,GAAG;gBACP,IAAI,CAAC,cAAc,GAAG,GAAG,CAAC;gBAC1B,IAAI,CAAC,IAAI,CAAC,QAAQ;oBAAE,IAAI,CAAC,kBAAkB,GAAG,GAAG,CAAC;aACnD,IAED,4DAAK,KAAK,EAAC,iBAAiB,IAC1B,4DAAK,KAAK,EAAC,OAAO,IACf,IAAI,CAAC,cAAc;cAChB,MAAA,IAAI,CAAC,aAAa,0CAAE,GAAG,CAAC,CAAC,IAAI,MAC3B,sBACE,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,EACxC,GAAG,EAAE,IAAI,CAAC,KAAK,EACf,YAAY,EAAE,CAAC,CAAC;oBACd,CAAC,CAAC,cAAc,EAAE,CAAC;oBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;oBACpB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;iBAC5B,IAEA,IAAI,CAAC,KAAK,CACI,CAClB,CAAC;cACF,EAAE,EACN,4DAAK,KAAK,EAAC,SAAS,IAClB,8DACE,YAAY,EAAC,KAAK,iBACN,OAAO,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE;gBACL,aAAa,EACX,IAAI,CAAC,UAAU,IAAI,CAAC,EAAC,MAAA,IAAI,CAAC,cAAc,0CAAE,MAAM,CAAA;aACnD,EACD,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAAE,EACpC,KAAK,EAAE,IAAI,CAAC,UAAU,EACtB,GAAG,EAAE,CAAC,GAAG,MAAM,IAAI,CAAC,QAAQ,GAAG,GAAG,CAAC,EACnC,MAAM,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EAClC,OAAO,EAAE;gBACP,IAAI,CAAC,cAAc,GAAG,SAAS,CAAC;aACjC,EACD,OAAO,EAAE,MAAM,IAAI,CAAC,wBAAwB,EAAE,EAC9C,SAAS,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,GACnC,EACD,IAAI,CAAC,UAAU;aACf,CAAA,MAAA,IAAI,CAAC,cAAc,0CAAE,MAAM,KAAI,IAAI,CAAC,eAAe,CAAC,IACnD,sBACE,KAAK,EAAC,OAAO,EACb,IAAI,EAAE,OAAO,EACb,KAAK,QACL,IAAI,QACJ,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,CAAC,CAAC;gBACT,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,IAAI,CAAC,KAAK,EAAE,CAAC;aACd,GACD,IACA,IAAI,EACP,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,GAAG,IAAI,IACpC,oDAEE,KAAK,EAAE,EAAE,kBAAkB,EAAE,IAAI,CAAC,YAAY,EAAE,EAChD,IAAI,EAAC,oBAAoB,EACzB,KAAK,QACL,GAAG,EAAE,CAAC,GAAG;gBACP,IAAI,IAAI,CAAC,QAAQ;oBAAE,IAAI,CAAC,kBAAkB,GAAG,GAAG,CAAC;aAClD,GACe,CACnB,CACG,CACF,CACF,CACF,EACN,oEACE,GAAG,EAAE,CAAC,GAAG,MAAM,IAAI,CAAC,WAAW,GAAG,GAAG,CAAC,EACtC,IAAI,EAAE,IAAI,CAAC,YAAY,EACvB,aAAa,EAAE,IAAI,CAAC,cAAc,GAAG,SAAS,GAAG,MAAM,EACvD,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ;aACzC,EACD,MAAM,EAAE,IAAI,CAAC,cAAc,EAC3B,OAAO,EAAE,IAAI,CAAC,kBAAkB,EAChC,aAAa,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,yBAAyB,CAAC,CAAC,CAAC,EACvD,SAAS,EAAC,cAAc,EACxB,sBAAsB,EAAE;gBACtB,OAAO;oBACL,QAAQ,EAAE,GAAG,IAAI,CAAC,WAAW,CAAC,WAAW,IAAI;iBAC9C,CAAC;aACH,IAED,4DACE,KAAK,EAAE;gBACL,oBAAoB,EAAE,IAAI;gBAC1B,MAAM,EAAE,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,eAAe;aACpD,EACD,KAAK,EAAE,IAAI,CAAC,oBAAoB,IAE/B,IAAI,CAAC,oBAAoB,CACtB,EACN,8DAAa,EACb,4DAAK,GAAG,EAAE,CAAC,GAAG,MAAM,IAAI,CAAC,UAAU,GAAG,GAAG,CAAC,EAAE,KAAK,EAAC,YAAY,GAAO,EACpE,IAAI,CAAC,gBAAgB,EAAE,IACtB,uCACc,UAAU,EACtB,IAAI,EAAE,MAAM,EACZ,KAAK,EAAE;gBACL,UAAU,EAAE,IAAI;aACjB,EACD,KAAK,EAAE,IAAI,CAAC,eAAe,EAC3B,WAAW,EAAE,CAAC,CAAC;gBACb,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;aACxC,GACiB,IAClB,IAAI,EACP,IAAI,CAAC,eAAe,IAAI,CAAC,IAAI,CAAC,QAAQ,IACrC,WAAK,KAAK,EAAC,oBAAoB,IAAE,IAAI,CAAC,aAAa,CAAO,KAE1D,EAAE,CACH,CACW,CACT,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAhSK;IADL,UAAU,CAAS,SAAS,EAAE,CAAC,IAAI,KAAK,IAAI,CAAC,YAAY,CAAC;uCAiB1D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/select/select.scss?tag=ix-select&encapsulation=shadow","src/components/select/select.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'legacy/mixins/fonts';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n\n  display: inline-block;\n  position: relative;\n  min-height: 2rem;\n  height: auto;\n  border-radius: var(--theme-input--border-radius);\n\n  .d-none {\n    display: none;\n  }\n\n  .select {\n    position: relative;\n    display: flex;\n    align-items: center;\n    background-color: var(--theme-input--background);\n    border: var(--theme-input--border-thickness) solid\n      var(--theme-input--border-color);\n    border-radius: var(--theme-input--border-radius);\n    padding: 0 0 0 $small-space;\n    box-shadow: var(--theme-inset-shadow-1) !important;\n\n    @include hover {\n      background-color: var(--theme-input--background--hover);\n      border-color: var(--theme-input--border-color--hover);\n    }\n\n    &:focus-within {\n      background-color: var(--theme-input--background--focus);\n      border-color: var(--theme-input--border-color--focus);\n      outline: 1px solid #119fff;\n      outline-offset: var(--theme-input--focus--outline-offset);\n    }\n  }\n\n  .select.readonly {\n    box-shadow: none !important;\n    border: none;\n    border-radius: 0px;\n    border-bottom: var(--theme-input--border-thickness) solid\n      var(--theme-color-weak-bdr);\n\n    &,\n    &:hover,\n    &:active {\n      background-color: transparent !important;\n    }\n\n    &:focus,\n    &:focus-within,\n    &:focus-visible {\n      outline: none;\n    }\n\n    input {\n      color: var(--theme-color-weak-text);\n    }\n\n    input:focus,\n    input:focus-visible {\n      outline: none;\n    }\n  }\n\n  .hidden {\n    display: none !important;\n  }\n\n  .trigger {\n    display: flex;\n    align-items: center;\n    flex-grow: 1;\n    height: 100%;\n  }\n\n  .input-container {\n    display: flex;\n    position: relative;\n    align-items: flex-start;\n    width: 100%;\n    height: 100%;\n\n    .chips {\n      position: relative;\n      display: flex;\n      align-items: center;\n      flex-wrap: wrap;\n      height: 100%;\n      max-height: 3.5rem;\n      flex-grow: 1;\n      overflow-y: auto;\n\n      > ix-filter-chip {\n        margin: 0.1rem;\n      }\n    }\n\n    input {\n      @include ellipsis;\n      @include text-default;\n      background: transparent;\n      height: 1.75rem;\n      width: 100%;\n\n      &,\n      &:hover,\n      &:focus-visible {\n        border: none;\n        outline: none;\n      }\n\n      &::placeholder {\n        color: var(--theme-input-select-icon--color);\n      }\n\n      &.hide-placeholder::placeholder {\n        opacity: 0;\n      }\n    }\n  }\n\n  .dropdown-visible {\n    --ix-icon-button-color: var(--theme-color-dynamic--hover);\n  }\n\n  .add-item {\n    display: flex;\n    justify-content: flex-start;\n    align-items: center;\n    position: relative;\n    width: 100%;\n  }\n\n  .select-list-header {\n    @include ellipsis;\n    display: flex;\n    align-items: center;\n    height: $default-control-height;\n    color: var(--theme-select-list-item-hint--color);\n    margin: 0 $small-space 0 1rem;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { IxSelectItemLabelChangeEvent } from '../select-item/events';\nimport { OnListener } from '../utils/listener';\n\n@Component({\n  tag: 'ix-select',\n  styleUrl: 'select.scss',\n  shadow: true,\n})\nexport class Select {\n  @Element() hostElement!: HTMLIxSelectElement;\n\n  /**\n   * Indices of selected items.\n   * This corresponds to the value property of ix-select-items and therefor not necessarily the indices of the items in the list.\n   * @deprecated since 2.0.0. Use the `value` property instead.\n   */\n  @Prop({ mutable: true }) selectedIndices?: string | string[];\n\n  /**\n   * Current selected value.\n   * This corresponds to the value property of ix-select-items\n   * @since 2.0.0\n   */\n  @Prop({ mutable: true }) value?: string | string[];\n\n  /**\n   * Show clear button\n   */\n  @Prop() allowClear = false;\n\n  /**\n   * Selection mode\n   */\n  @Prop() mode: 'single' | 'multiple' = 'single';\n\n  /**\n   * Select is extendable\n   */\n  @Prop() editable = false;\n\n  /**\n   * If true the select will be in disabled state\n   */\n  @Prop() disabled = false;\n\n  /**\n   * If true the select will be in readonly mode\n   */\n  @Prop() readonly = false;\n\n  /**\n   * Input field placeholder\n   */\n  @Prop() i18nPlaceholder = 'Select an option';\n\n  /**\n   * Input field placeholder for editable select\n   */\n  @Prop() i18nPlaceholderEditable = 'Type of select option';\n\n  /**\n   * Select list header\n   */\n  @Prop() i18nSelectListHeader = 'Please select an option';\n\n  /**\n   * Hint inside of dropdown if no items where found with current filter text\n   *\n   * @since 1.5.0\n   */\n  @Prop() i18nNoMatches = 'No matches';\n\n  /**\n   * Hide list header\n   *\n   * @since 1.5.0\n   */\n  @Prop() hideListHeader = false;\n\n  /**\n   * Value changed\n   * @since 2.0.0\n   */\n  @Event() valueChange: EventEmitter<string | string[]>;\n\n  /**\n   * Item selection changed\n   * @deprecated since 2.0.0. Use `valueChange` instead.\n   */\n  @Event() itemSelectionChange: EventEmitter<string[]>;\n\n  /**\n   * Event dispatched whenever the text input changes.\n   *\n   * @since 2.0.0\n   */\n  @Event() inputChange: EventEmitter<string>;\n\n  /**\n   * Item added to selection\n   */\n  @Event() addItem: EventEmitter<string>;\n\n  @State() dropdownShow = false;\n  @State() selectedLabels: string[];\n  @State() dropdownWrapperRef!: HTMLElement;\n  @State() dropdownAnchor!: HTMLElement;\n  @State() isDropdownEmpty = false;\n  @State() hasFocus = false;\n  @State() navigationItem: HTMLIxSelectItemElement;\n  @State() inputFilterText: string;\n  @State() inputValue: string;\n\n  private inputRef!: HTMLInputElement;\n  private dropdownRef!: HTMLIxDropdownElement;\n  private addItemRef!: HTMLDivElement;\n\n  private labelMutationObserver: MutationObserver;\n\n  get items() {\n    return [\n      ...Array.from(this.hostElement.querySelectorAll('ix-select-item')),\n      ...Array.from(\n        this.hostElement.shadowRoot.querySelectorAll('ix-select-item')\n      ),\n    ];\n  }\n\n  get selectedItems() {\n    return this.items.filter((item) => item.selected);\n  }\n\n  get addItemButton() {\n    return this.hostElement.shadowRoot.querySelector('.add-item');\n  }\n\n  get isSingleMode() {\n    return this.mode === 'single';\n  }\n\n  get isMultipleMode() {\n    return this.mode === 'multiple';\n  }\n\n  get isEveryDropdownItemHidden() {\n    return this.items.every((item) => item.classList.contains('d-none'));\n  }\n\n  @Watch('selectedIndices')\n  watchSelectedIndices(value: string | string[]) {\n    this.value = value;\n    this.updateSelection();\n  }\n\n  @Watch('value')\n  watchValue(value: string | string[]) {\n    this.selectedIndices = value;\n    this.updateSelection();\n  }\n\n  @Listen('itemClick')\n  onItemClicked(event: CustomEvent<string>) {\n    const newId = event.detail;\n    this.itemClick(newId);\n  }\n\n  private itemClick(newId: string) {\n    this.value = this.toggleValue(newId);\n    this.updateSelection();\n    this.emitValueChange();\n  }\n\n  private emitAddItem(value: string) {\n    if (value.trim() === '') {\n      return;\n    }\n\n    const newItem = document.createElement('ix-select-item');\n    newItem.value = value;\n    newItem.label = value;\n\n    this.addItemRef.appendChild(newItem);\n\n    this.clearInput();\n    this.itemClick(value);\n    this.addItem.emit(value);\n  }\n\n  private toggleValue(itemValue: string) {\n    if (!this.isMultipleMode) {\n      return itemValue;\n    }\n\n    if (!this.value) {\n      return [itemValue];\n    }\n\n    let value = this.value;\n\n    if (!Array.isArray(value)) {\n      value = [value];\n    }\n\n    if (value.includes(itemValue)) {\n      return value.filter((value) => value !== itemValue);\n    } else {\n      return [...value, itemValue];\n    }\n  }\n\n  private updateSelection() {\n    let ids = [];\n\n    if (this.value) {\n      ids = Array.isArray(this.value) ? [...this.value] : [this.value];\n    }\n\n    this.items.forEach((item) => {\n      item.selected = ids.some(\n        // Check can be removed if value is type of string in future releases\n        (i) =>\n          i ===\n          (item.value !== undefined && item.value !== null\n            ? item.value.toString()\n            : '')\n      );\n    });\n\n    this.selectedLabels = this.selectedItems.map((item) => item.label);\n\n    if (this.isSingleMode) {\n      this.inputValue = this.selectedLabels?.length\n        ? this.selectedLabels[0]\n        : null;\n      return;\n    }\n\n    this.inputValue = null;\n  }\n\n  private emitValueChange() {\n    this.valueChange.emit(this.value);\n\n    if (!this.value) {\n      this.itemSelectionChange.emit(null);\n    } else {\n      this.itemSelectionChange.emit(\n        Array.isArray(this.value) ? this.value : [this.value]\n      );\n    }\n  }\n\n  componentDidLoad() {\n    this.inputRef.addEventListener('input', () => {\n      this.dropdownShow = true;\n      this.inputChange.emit(this.inputRef.value);\n    });\n  }\n\n  componentWillLoad() {\n    if (this.selectedIndices && !this.value) {\n      this.value = this.selectedIndices;\n    }\n\n    this.updateSelection();\n  }\n\n  @Listen('ix-select-item:labelChange')\n  onLabelChange(event: IxSelectItemLabelChangeEvent) {\n    event.preventDefault();\n    event.stopImmediatePropagation();\n    this.updateSelection();\n  }\n\n  disconnectedCallback() {\n    if (this.labelMutationObserver) {\n      this.labelMutationObserver.disconnect();\n    }\n  }\n\n  private itemExists(item: string) {\n    return this.items.find((i) => i.label === item);\n  }\n\n  private dropdownVisibilityChanged(event: CustomEvent<boolean>) {\n    this.dropdownShow = event.detail;\n    this.hasFocus = event.detail;\n\n    if (event.detail) {\n      this.inputRef.focus();\n      this.inputRef.select();\n\n      this.removeHiddenFromItems();\n      this.isDropdownEmpty = this.isEveryDropdownItemHidden;\n    } else {\n      this.navigationItem = undefined;\n    }\n  }\n\n  @OnListener<Select>('keydown', (self) => self.dropdownShow)\n  async onKeyDown(event: KeyboardEvent) {\n    if (event.code === 'ArrowDown' || event.code === 'ArrowUp') {\n      this.onArrowNavigation(event, event.code);\n    }\n\n    if (!this.dropdownShow) {\n      return;\n    }\n\n    if (event.code === 'Enter' || event.code === 'NumpadEnter') {\n      await this.onEnterNavigation();\n    }\n\n    if (event.code === 'Escape') {\n      this.dropdownShow = false;\n    }\n  }\n\n  private async onEnterNavigation() {\n    if (this.isMultipleMode) {\n      return;\n    }\n\n    if (this.editable && !this.itemExists(this.inputFilterText)) {\n      this.emitAddItem(this.inputFilterText);\n      this.navigationItem = this.items[this.items.length - 1];\n    }\n\n    this.navigationItem?.onItemClick();\n    await this.dropdownRef?.updatePosition();\n\n    if (this.isSingleMode && !this.editable) {\n      this.dropdownShow = false;\n    }\n  }\n\n  private onArrowNavigation(\n    event: KeyboardEvent,\n    key: 'ArrowDown' | 'ArrowUp'\n  ) {\n    event.preventDefault();\n    event.stopPropagation();\n\n    this.dropdownShow = true;\n\n    const items = this.items.filter((i) => !i.classList.contains('d-none'));\n    if (this.navigationItem === undefined) {\n      this.applyFocusTo(items[0]);\n      return;\n    }\n\n    let indexOfNavigationItem = items.findIndex(\n      (item) => item === this.navigationItem\n    );\n\n    if (key === 'ArrowDown') {\n      indexOfNavigationItem++;\n    } else {\n      indexOfNavigationItem--;\n    }\n\n    const newFocusItem = items[indexOfNavigationItem];\n    this.applyFocusTo(newFocusItem);\n  }\n\n  private applyFocusTo(element: HTMLIxSelectItemElement) {\n    if (!element) {\n      return;\n    }\n    this.navigationItem = element;\n\n    setTimeout(() => {\n      element.shadowRoot\n        .querySelector('ix-dropdown-item')\n        .shadowRoot.querySelector('button')\n        .focus();\n    });\n  }\n\n  private filterItemsWithTypeahead() {\n    this.inputFilterText = this.inputRef.value;\n\n    if (this.isSingleMode && this.inputFilterText === this.selectedLabels[0]) {\n      return;\n    }\n\n    if (this.inputFilterText) {\n      this.items.forEach((item) => {\n        item.classList.remove('d-none');\n        if (\n          !item.label.toLowerCase().includes(this.inputFilterText.toLowerCase())\n        ) {\n          item.classList.add('d-none');\n        }\n      });\n    } else {\n      this.removeHiddenFromItems();\n    }\n\n    this.isDropdownEmpty = this.isEveryDropdownItemHidden;\n  }\n\n  private removeHiddenFromItems() {\n    this.items.forEach((item) => {\n      item.classList.remove('d-none');\n    });\n  }\n\n  private clearInput() {\n    this.inputRef.value = '';\n    this.inputFilterText = '';\n  }\n\n  private clear() {\n    this.clearInput();\n    this.selectedLabels = [];\n    this.value = [];\n    this.valueChange.emit(null);\n    this.dropdownShow = false;\n  }\n\n  private onInputBlur(e) {\n    if (this.editable) {\n      return;\n    }\n\n    if (this.isSingleMode) {\n      return;\n    }\n\n    if (!this.dropdownShow && this.mode !== 'multiple') {\n      e.target['value'] = this.selectedLabels;\n    }\n  }\n\n  private placeholderValue() {\n    if (this.editable) {\n      return this.i18nPlaceholderEditable;\n    }\n\n    if (this.readonly) {\n      return '';\n    }\n\n    return this.i18nPlaceholder;\n  }\n\n  private isAddItemVisible() {\n    return (\n      !this.itemExists(this.inputFilterText) &&\n      this.editable &&\n      this.inputFilterText\n    );\n  }\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            select: true,\n            disabled: this.disabled,\n            readonly: this.readonly,\n          }}\n          ref={(ref) => {\n            this.dropdownAnchor = ref;\n            if (!this.editable) this.dropdownWrapperRef = ref;\n          }}\n        >\n          <div class=\"input-container\">\n            <div class=\"chips\">\n              {this.isMultipleMode\n                ? this.selectedItems?.map((item) => (\n                    <ix-filter-chip\n                      disabled={this.disabled || this.readonly}\n                      key={item.value}\n                      onCloseClick={(e) => {\n                        e.preventDefault();\n                        e.stopPropagation();\n                        this.itemClick(item.value);\n                      }}\n                    >\n                      {item.label}\n                    </ix-filter-chip>\n                  ))\n                : ''}\n              <div class=\"trigger\">\n                <input\n                  autocomplete=\"off\"\n                  data-testid=\"input\"\n                  disabled={this.disabled}\n                  readOnly={this.readonly}\n                  type=\"text\"\n                  class={{\n                    'allow-clear':\n                      this.allowClear && !!this.selectedLabels?.length,\n                  }}\n                  placeholder={this.placeholderValue()}\n                  value={this.inputValue}\n                  ref={(ref) => (this.inputRef = ref)}\n                  onBlur={(e) => this.onInputBlur(e)}\n                  onFocus={() => {\n                    this.navigationItem = undefined;\n                  }}\n                  onInput={() => this.filterItemsWithTypeahead()}\n                  onKeyDown={(e) => this.onKeyDown(e)}\n                />\n                {this.allowClear &&\n                (this.selectedLabels?.length || this.inputFilterText) ? (\n                  <ix-icon-button\n                    class=\"clear\"\n                    icon={'clear'}\n                    ghost\n                    oval\n                    size=\"16\"\n                    onClick={(e) => {\n                      e.preventDefault();\n                      e.stopPropagation();\n                      this.clear();\n                    }}\n                  />\n                ) : null}\n                {this.disabled || this.readonly ? null : (\n                  <ix-icon-button\n                    data-select-dropdown\n                    class={{ 'dropdown-visible': this.dropdownShow }}\n                    icon=\"chevron-down-small\"\n                    ghost\n                    ref={(ref) => {\n                      if (this.editable) this.dropdownWrapperRef = ref;\n                    }}\n                  ></ix-icon-button>\n                )}\n              </div>\n            </div>\n          </div>\n        </div>\n        <ix-dropdown\n          ref={(ref) => (this.dropdownRef = ref)}\n          show={this.dropdownShow}\n          closeBehavior={this.isMultipleMode ? 'outside' : 'both'}\n          class={{\n            'd-none': this.disabled || this.readonly,\n          }}\n          anchor={this.dropdownAnchor}\n          trigger={this.dropdownWrapperRef}\n          onShowChanged={(e) => this.dropdownVisibilityChanged(e)}\n          placement=\"bottom-start\"\n          overwriteDropdownStyle={async () => {\n            return {\n              minWidth: `${this.hostElement.clientWidth}px`,\n            };\n          }}\n        >\n          <div\n            class={{\n              'select-list-header': true,\n              hidden: this.hideListHeader || this.isDropdownEmpty,\n            }}\n            title={this.i18nSelectListHeader}\n          >\n            {this.i18nSelectListHeader}\n          </div>\n          <slot></slot>\n          <div ref={(ref) => (this.addItemRef = ref)} class=\"d-contents\"></div>\n          {this.isAddItemVisible() ? (\n            <ix-dropdown-item\n              data-testid=\"add-item\"\n              icon={'plus'}\n              class={{\n                'add-item': true,\n              }}\n              label={this.inputFilterText}\n              onItemClick={(e) => {\n                e.preventDefault();\n                e.stopPropagation();\n                this.emitAddItem(this.inputFilterText);\n              }}\n            ></ix-dropdown-item>\n          ) : null}\n          {this.isDropdownEmpty && !this.editable ? (\n            <div class=\"select-list-header\">{this.i18nNoMatches}</div>\n          ) : (\n            ''\n          )}\n        </ix-dropdown>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/components/service.js

@@ -0,0 +1,99 @@
+import { m as matchBreakpoint } from './breakpoints.js';
+import { T as TypedEvent } from './typed-event.js';
+
+function debounce(func, delay) {
+    let timeoutId;
+    return function debounced(...args) {
+        clearTimeout(timeoutId);
+        timeoutId = setTimeout(() => {
+            func(...args);
+        }, delay);
+    };
+}
+
+var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var __classPrivateFieldSet = (undefined && undefined.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+    if (kind === "m") throw new TypeError("Private method is not writable");
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
+    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
+};
+var _ApplicationLayoutService_supportedBreakpoints, _ApplicationLayoutService_breakpointChangeListener, _ApplicationLayoutService_breakpoint, _ApplicationLayoutService_isDetectionEnabled;
+class ApplicationLayoutService {
+    constructor() {
+        // Keep order of breakpoints
+        _ApplicationLayoutService_supportedBreakpoints.set(this, ['sm', 'md', 'lg']);
+        _ApplicationLayoutService_breakpointChangeListener.set(this, new TypedEvent());
+        _ApplicationLayoutService_breakpoint.set(this, 'lg');
+        _ApplicationLayoutService_isDetectionEnabled.set(this, true);
+        this.debouncedOnResize = debounce(this.onResize.bind(this), 50);
+        if (typeof window !== 'undefined') {
+            window.addEventListener('resize', this.debouncedOnResize.bind(this));
+            this.debouncedOnResize();
+        }
+    }
+    get breakpoint() {
+        return __classPrivateFieldGet(this, _ApplicationLayoutService_breakpoint, "f");
+    }
+    get onChange() {
+        return __classPrivateFieldGet(this, _ApplicationLayoutService_breakpointChangeListener, "f");
+    }
+    get isDetectionEnabled() {
+        return __classPrivateFieldGet(this, _ApplicationLayoutService_isDetectionEnabled, "f");
+    }
+    onResize() {
+        if (!__classPrivateFieldGet(this, _ApplicationLayoutService_isDetectionEnabled, "f")) {
+            return;
+        }
+        if (!__classPrivateFieldGet(this, _ApplicationLayoutService_supportedBreakpoints, "f")) {
+            return;
+        }
+        const matchBreakpoints = [];
+        const breakpoints = __classPrivateFieldGet(this, _ApplicationLayoutService_supportedBreakpoints, "f");
+        breakpoints.forEach((breakpoint) => {
+            const match = matchBreakpoint(breakpoint);
+            matchBreakpoints.push([breakpoint, match]);
+        });
+        if (matchBreakpoints.every(([_, match]) => match === false)) {
+            let breakPointIndex = 0;
+            if (!__classPrivateFieldGet(this, _ApplicationLayoutService_supportedBreakpoints, "f").includes('lg')) {
+                breakPointIndex = matchBreakpoints.length - 1;
+            }
+            const [breakpoint, _] = matchBreakpoints[breakPointIndex];
+            __classPrivateFieldGet(this, _ApplicationLayoutService_breakpointChangeListener, "f").emit(breakpoint);
+            __classPrivateFieldSet(this, _ApplicationLayoutService_breakpoint, breakpoint, "f");
+            return;
+        }
+        for (const [breakpoint, match] of matchBreakpoints.reverse()) {
+            if (match) {
+                __classPrivateFieldGet(this, _ApplicationLayoutService_breakpointChangeListener, "f").emit(breakpoint);
+                __classPrivateFieldSet(this, _ApplicationLayoutService_breakpoint, breakpoint, "f");
+                break;
+            }
+        }
+    }
+    disableBreakpointDetection() {
+        __classPrivateFieldSet(this, _ApplicationLayoutService_isDetectionEnabled, false, "f");
+    }
+    enableBreakpointDetection() {
+        __classPrivateFieldSet(this, _ApplicationLayoutService_isDetectionEnabled, true, "f");
+    }
+    setBreakpoint(breakpoint) {
+        __classPrivateFieldSet(this, _ApplicationLayoutService_breakpoint, breakpoint, "f");
+        __classPrivateFieldGet(this, _ApplicationLayoutService_breakpointChangeListener, "f").emit(breakpoint);
+    }
+    setBreakpoints(breakpoints) {
+        __classPrivateFieldSet(this, _ApplicationLayoutService_supportedBreakpoints, breakpoints, "f");
+        this.onResize();
+    }
+}
+_ApplicationLayoutService_supportedBreakpoints = new WeakMap(), _ApplicationLayoutService_breakpointChangeListener = new WeakMap(), _ApplicationLayoutService_breakpoint = new WeakMap(), _ApplicationLayoutService_isDetectionEnabled = new WeakMap();
+const applicationLayoutService = new ApplicationLayoutService();
+
+export { applicationLayoutService as a };
+
+//# sourceMappingURL=service.js.map

package/components/service.js.map

@@ -0,0 +1 @@
+{"file":"service.js","mappings":"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","names":[],"sources":["src/components/utils/debounce.ts","src/components/utils/application-layout/service.ts"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\ntype AnyFunction = (...args: any[]) => any;\n\nexport function debounce<T extends AnyFunction>(\n  func: T,\n  delay: number\n): (...args: Parameters<T>) => void {\n  let timeoutId: ReturnType<typeof setTimeout>;\n\n  return function debounced(...args: Parameters<T>): void {\n    clearTimeout(timeoutId);\n\n    timeoutId = setTimeout(() => {\n      func(...args);\n    }, delay);\n  };\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { Breakpoint, matchBreakpoint } from '../breakpoints';\nimport { debounce } from '../debounce';\nimport { TypedEvent } from '../typed-event';\n\nclass ApplicationLayoutService {\n  // Keep order of breakpoints\n  #supportedBreakpoints: Breakpoint[] = ['sm', 'md', 'lg'];\n  #breakpointChangeListener = new TypedEvent<Breakpoint>();\n  #breakpoint: Breakpoint = 'lg';\n\n  #isDetectionEnabled = true;\n  debouncedOnResize = debounce(this.onResize.bind(this), 50);\n\n  constructor() {\n    if (typeof window !== 'undefined') {\n      window.addEventListener('resize', this.debouncedOnResize.bind(this));\n      this.debouncedOnResize();\n    }\n  }\n\n  get breakpoint() {\n    return this.#breakpoint;\n  }\n\n  get onChange() {\n    return this.#breakpointChangeListener;\n  }\n\n  get isDetectionEnabled() {\n    return this.#isDetectionEnabled;\n  }\n\n  private onResize() {\n    if (!this.#isDetectionEnabled) {\n      return;\n    }\n    if (!this.#supportedBreakpoints) {\n      return;\n    }\n    const matchBreakpoints: [Breakpoint, boolean][] = [];\n\n    const breakpoints = this.#supportedBreakpoints;\n\n    breakpoints.forEach((breakpoint) => {\n      const match = matchBreakpoint(breakpoint);\n      matchBreakpoints.push([breakpoint, match]);\n    });\n\n    if (matchBreakpoints.every(([_, match]) => match === false)) {\n      let breakPointIndex = 0;\n      if (!this.#supportedBreakpoints.includes('lg')) {\n        breakPointIndex = matchBreakpoints.length - 1;\n      }\n\n      const [breakpoint, _] = matchBreakpoints[breakPointIndex];\n      this.#breakpointChangeListener.emit(breakpoint);\n      this.#breakpoint = breakpoint;\n      return;\n    }\n\n    for (const [breakpoint, match] of matchBreakpoints.reverse()) {\n      if (match) {\n        this.#breakpointChangeListener.emit(breakpoint);\n        this.#breakpoint = breakpoint;\n        break;\n      }\n    }\n  }\n\n  public disableBreakpointDetection() {\n    this.#isDetectionEnabled = false;\n  }\n\n  public enableBreakpointDetection() {\n    this.#isDetectionEnabled = true;\n  }\n\n  public setBreakpoint(breakpoint: Breakpoint) {\n    this.#breakpoint = breakpoint;\n    this.#breakpointChangeListener.emit(breakpoint);\n  }\n\n  public setBreakpoints(breakpoints: Breakpoint[]) {\n    this.#supportedBreakpoints = breakpoints;\n    this.onResize();\n  }\n}\n\nexport const applicationLayoutService = new ApplicationLayoutService();\n"],"version":3}

package/components/shadow-dom.js

@@ -0,0 +1,45 @@
+/*
+ * SPDX-FileCopyrightText: 2023 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+function closestElement(selector, el) {
+    if (!el) {
+        return null;
+    }
+    return (el.closest(selector) ||
+        closestElement(selector, el.getRootNode().host));
+}
+function getSlottedElements(slot) {
+    return slot.assignedElements({ flatten: true });
+}
+function hasSlottedElements(slot) {
+    if (!slot) {
+        return false;
+    }
+    return slot.assignedElements({ flatten: true }).length !== 0;
+}
+function closestPassShadow(node, selector) {
+    if (!node) {
+        return null;
+    }
+    if (node instanceof ShadowRoot) {
+        return closestPassShadow(node.host, selector);
+    }
+    if (node instanceof HTMLElement) {
+        if (node.matches(selector)) {
+            return node;
+        }
+        else {
+            return closestPassShadow(node.parentNode, selector);
+        }
+    }
+    return closestPassShadow(node.parentNode, selector);
+}
+
+export { closestElement as a, closestPassShadow as c, getSlottedElements as g, hasSlottedElements as h };
+
+//# sourceMappingURL=shadow-dom.js.map

package/components/shadow-dom.js.map

@@ -0,0 +1 @@
+{"file":"shadow-dom.js","mappings":"AAAA;;;;;;;;SAQgB,cAAc,CAAC,QAAgB,EAAE,EAAO;IACtD,IAAI,CAAC,EAAE,EAAE;QACP,OAAO,IAAI,CAAC;KACb;IACD,QACE,EAAE,CAAC,OAAO,CAAC,QAAQ,CAAC;QACpB,cAAc,CAAC,QAAQ,EAAG,EAAE,CAAC,WAAW,EAAU,CAAC,IAAI,CAAC,EACxD;AACJ,CAAC;SAEe,kBAAkB,CAAU,IAAS;IACnD,OAAO,IAAI,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;AAClD,CAAC;SAEe,kBAAkB,CAAC,IAAS;IAC1C,IAAI,CAAC,IAAI,EAAE;QACT,OAAO,KAAK,CAAC;KACd;IACD,OAAO,IAAI,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC;AAC/D,CAAC;SAYe,iBAAiB,CAAC,IAAU,EAAE,QAAgB;IAC5D,IAAI,CAAC,IAAI,EAAE;QACT,OAAO,IAAI,CAAC;KACb;IAED,IAAI,IAAI,YAAY,UAAU,EAAE;QAC9B,OAAO,iBAAiB,CAAC,IAAI,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;KAC/C;IAED,IAAI,IAAI,YAAY,WAAW,EAAE;QAC/B,IAAI,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE;YAC1B,OAAO,IAAI,CAAC;SACb;aAAM;YACL,OAAO,iBAAiB,CAAC,IAAI,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC;SACrD;KACF;IAED,OAAO,iBAAiB,CAAC,IAAI,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC;AACtD;;;;","names":[],"sources":["src/components/utils/shadow-dom.ts"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nexport function closestElement(selector: string, el: any) {\n  if (!el) {\n    return null;\n  }\n  return (\n    el.closest(selector) ||\n    closestElement(selector, (el.getRootNode() as any).host)\n  );\n}\n\nexport function getSlottedElements<R = any>(slot: any): R[] {\n  return slot.assignedElements({ flatten: true });\n}\n\nexport function hasSlottedElements(slot: any) {\n  if (!slot) {\n    return false;\n  }\n  return slot.assignedElements({ flatten: true }).length !== 0;\n}\n\nexport function containsElement(target: Element, element: Element) {\n  const hasShadowDom = target.shadowRoot;\n\n  if (hasShadowDom) {\n    target.contains(element) || target.shadowRoot.contains(element);\n  }\n\n  return target.contains(element);\n}\n\nexport function closestPassShadow(node: Node, selector: string) {\n  if (!node) {\n    return null;\n  }\n\n  if (node instanceof ShadowRoot) {\n    return closestPassShadow(node.host, selector);\n  }\n\n  if (node instanceof HTMLElement) {\n    if (node.matches(selector)) {\n      return node;\n    } else {\n      return closestPassShadow(node.parentNode, selector);\n    }\n  }\n\n  return closestPassShadow(node.parentNode, selector);\n}\n"],"version":3}

package/components/spinner.js

@@ -0,0 +1,49 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+
+const spinnerCss = ":host(.xx-small){display:block;position:relative;width:0.75rem;height:0.75rem;min-width:0.75rem;min-height:0.75rem;max-width:0.75rem;max-height:0.75rem;border-radius:100%;position:relative;animation:rotate 2s linear infinite}:host(.xx-small) *,:host(.xx-small) *::after,:host(.xx-small) *::before{box-sizing:border-box}:host(.xx-small) ::-webkit-scrollbar-button{display:none}:host(.xx-small) ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host(.xx-small) ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host(.xx-small) ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host(.xx-small) ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host(.xx-small) ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host(.xx-small) ::-webkit-scrollbar-corner{display:none}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes clipMask{0%{-webkit-clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0)}12.5%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0)}25%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%)}37.5%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%)}50%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0)}62.5%{-webkit-clip-path:polygon(50% 50%, 100% 0, 100% 0, 100% 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 100% 0, 100% 0, 100% 100%, 0 100%, 0 0)}75%{-webkit-clip-path:polygon(50% 50%, 100% 100%, 100% 100%, 100% 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 100% 100%, 100% 100%, 100% 100%, 0 100%, 0 0)}87.5%{-webkit-clip-path:polygon(50% 50%, 0 100%, 0 100%, 0 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 0 100%, 0 100%, 0 100%, 0 100%, 0 0)}100%{-webkit-clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0)}}:host(.xx-small)::after{content:\"\";box-sizing:border-box;position:absolute;inset:8.33%;border-radius:100%;border:1px solid var(--ix-button-color, var(--theme-color-soft-text));animation:clipMask 3s linear infinite}:host(:not(.hide-track)):host(.xx-small)::before{content:\"\";box-sizing:border-box;position:absolute;inset:8.33%;border-radius:100%;border:1px solid var(--theme-color-ghost--hover)}:host(.primary)::after{border-color:var(--theme-color-dynamic)}:host(.primary)::before{border-color:var(--theme-color-ghost--hover)}:host(.x-small){display:block;position:relative;width:1.25rem;height:1.25rem;min-width:1.25rem;min-height:1.25rem;max-width:1.25rem;max-height:1.25rem;border-radius:100%;position:relative;animation:rotate 2s linear infinite}:host(.x-small) *,:host(.x-small) *::after,:host(.x-small) *::before{box-sizing:border-box}:host(.x-small) ::-webkit-scrollbar-button{display:none}:host(.x-small) ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host(.x-small) ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host(.x-small) ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host(.x-small) ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host(.x-small) ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host(.x-small) ::-webkit-scrollbar-corner{display:none}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes clipMask{0%{-webkit-clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0)}12.5%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0)}25%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%)}37.5%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%)}50%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0)}62.5%{-webkit-clip-path:polygon(50% 50%, 100% 0, 100% 0, 100% 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 100% 0, 100% 0, 100% 100%, 0 100%, 0 0)}75%{-webkit-clip-path:polygon(50% 50%, 100% 100%, 100% 100%, 100% 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 100% 100%, 100% 100%, 100% 100%, 0 100%, 0 0)}87.5%{-webkit-clip-path:polygon(50% 50%, 0 100%, 0 100%, 0 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 0 100%, 0 100%, 0 100%, 0 100%, 0 0)}100%{-webkit-clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0)}}:host(.x-small)::after{content:\"\";box-sizing:border-box;position:absolute;inset:8.33%;border-radius:100%;border:2px solid var(--ix-button-color, var(--theme-color-soft-text));animation:clipMask 3s linear infinite}:host(:not(.hide-track)):host(.x-small)::before{content:\"\";box-sizing:border-box;position:absolute;inset:8.33%;border-radius:100%;border:2px solid var(--theme-color-ghost--hover)}:host(.primary)::after{border-color:var(--theme-color-dynamic)}:host(.primary)::before{border-color:var(--theme-color-ghost--hover)}:host(.small){display:block;position:relative;width:1.5rem;height:1.5rem;min-width:1.5rem;min-height:1.5rem;max-width:1.5rem;max-height:1.5rem;border-radius:100%;position:relative;animation:rotate 2s linear infinite}:host(.small) *,:host(.small) *::after,:host(.small) *::before{box-sizing:border-box}:host(.small) ::-webkit-scrollbar-button{display:none}:host(.small) ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host(.small) ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host(.small) ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host(.small) ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host(.small) ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host(.small) ::-webkit-scrollbar-corner{display:none}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes clipMask{0%{-webkit-clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0)}12.5%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0)}25%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%)}37.5%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%)}50%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0)}62.5%{-webkit-clip-path:polygon(50% 50%, 100% 0, 100% 0, 100% 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 100% 0, 100% 0, 100% 100%, 0 100%, 0 0)}75%{-webkit-clip-path:polygon(50% 50%, 100% 100%, 100% 100%, 100% 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 100% 100%, 100% 100%, 100% 100%, 0 100%, 0 0)}87.5%{-webkit-clip-path:polygon(50% 50%, 0 100%, 0 100%, 0 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 0 100%, 0 100%, 0 100%, 0 100%, 0 0)}100%{-webkit-clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0)}}:host(.small)::after{content:\"\";box-sizing:border-box;position:absolute;inset:8.33%;border-radius:100%;border:2px solid var(--ix-button-color, var(--theme-color-soft-text));animation:clipMask 3s linear infinite}:host(:not(.hide-track)):host(.small)::before{content:\"\";box-sizing:border-box;position:absolute;inset:8.33%;border-radius:100%;border:2px solid var(--theme-color-ghost--hover)}:host(.primary)::after{border-color:var(--theme-color-dynamic)}:host(.primary)::before{border-color:var(--theme-color-ghost--hover)}:host(.medium){display:block;position:relative;width:2rem;height:2rem;min-width:2rem;min-height:2rem;max-width:2rem;max-height:2rem;border-radius:100%;position:relative;animation:rotate 2s linear infinite}:host(.medium) *,:host(.medium) *::after,:host(.medium) *::before{box-sizing:border-box}:host(.medium) ::-webkit-scrollbar-button{display:none}:host(.medium) ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host(.medium) ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host(.medium) ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host(.medium) ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host(.medium) ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host(.medium) ::-webkit-scrollbar-corner{display:none}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes clipMask{0%{-webkit-clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0)}12.5%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0)}25%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%)}37.5%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%)}50%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0)}62.5%{-webkit-clip-path:polygon(50% 50%, 100% 0, 100% 0, 100% 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 100% 0, 100% 0, 100% 100%, 0 100%, 0 0)}75%{-webkit-clip-path:polygon(50% 50%, 100% 100%, 100% 100%, 100% 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 100% 100%, 100% 100%, 100% 100%, 0 100%, 0 0)}87.5%{-webkit-clip-path:polygon(50% 50%, 0 100%, 0 100%, 0 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 0 100%, 0 100%, 0 100%, 0 100%, 0 0)}100%{-webkit-clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0)}}:host(.medium)::after{content:\"\";box-sizing:border-box;position:absolute;inset:8.33%;border-radius:100%;border:2px solid var(--ix-button-color, var(--theme-color-soft-text));animation:clipMask 3s linear infinite}:host(:not(.hide-track)):host(.medium)::before{content:\"\";box-sizing:border-box;position:absolute;inset:8.33%;border-radius:100%;border:2px solid var(--theme-color-ghost--hover)}:host(.primary)::after{border-color:var(--theme-color-dynamic)}:host(.primary)::before{border-color:var(--theme-color-ghost--hover)}:host(.large){display:block;position:relative;width:6rem;height:6rem;min-width:6rem;min-height:6rem;max-width:6rem;max-height:6rem;border-radius:100%;position:relative;animation:rotate 2s linear infinite}:host(.large) *,:host(.large) *::after,:host(.large) *::before{box-sizing:border-box}:host(.large) ::-webkit-scrollbar-button{display:none}:host(.large) ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host(.large) ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host(.large) ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host(.large) ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host(.large) ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host(.large) ::-webkit-scrollbar-corner{display:none}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes clipMask{0%{-webkit-clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0)}12.5%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0)}25%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%)}37.5%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%)}50%{-webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0)}62.5%{-webkit-clip-path:polygon(50% 50%, 100% 0, 100% 0, 100% 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 100% 0, 100% 0, 100% 100%, 0 100%, 0 0)}75%{-webkit-clip-path:polygon(50% 50%, 100% 100%, 100% 100%, 100% 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 100% 100%, 100% 100%, 100% 100%, 0 100%, 0 0)}87.5%{-webkit-clip-path:polygon(50% 50%, 0 100%, 0 100%, 0 100%, 0 100%, 0 0);clip-path:polygon(50% 50%, 0 100%, 0 100%, 0 100%, 0 100%, 0 0)}100%{-webkit-clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0)}}:host(.large)::after{content:\"\";box-sizing:border-box;position:absolute;inset:8.33%;border-radius:100%;border:4px solid var(--ix-button-color, var(--theme-color-soft-text));animation:clipMask 3s linear infinite}:host(:not(.hide-track)):host(.large)::before{content:\"\";box-sizing:border-box;position:absolute;inset:8.33%;border-radius:100%;border:4px solid var(--theme-color-ghost--hover)}:host(.primary)::after{border-color:var(--theme-color-dynamic)}:host(.primary)::before{border-color:var(--theme-color-ghost--hover)}";
+const IxSpinnerStyle0 = spinnerCss;
+
+const Spinner = /*@__PURE__*/ proxyCustomElement(class Spinner extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.variant = 'secondary';
+        this.size = 'medium';
+        this.hideTrack = false;
+    }
+    render() {
+        return (h(Host, { key: 'ae03c01022d0144ced3c631a78d947934fdef0cf', class: {
+                primary: this.variant === 'primary',
+                'xx-small': this.size === 'xx-small',
+                'x-small': this.size === 'x-small',
+                small: this.size === 'small',
+                medium: this.size === 'medium',
+                large: this.size === 'large',
+                'hide-track': this.hideTrack,
+            } }));
+    }
+    get hostElement() { return this; }
+    static get style() { return IxSpinnerStyle0; }
+}, [1, "ix-spinner", {
+        "variant": [1],
+        "size": [1],
+        "hideTrack": [4, "hide-track"]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ix-spinner"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ix-spinner":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Spinner);
+            }
+            break;
+    } });
+}
+
+export { Spinner as S, defineCustomElement as d };
+
+//# sourceMappingURL=spinner.js.map

package/components/spinner.js.map

@@ -0,0 +1 @@
+{"file":"spinner.js","mappings":";;AAAA,MAAM,UAAU,GAAG,sjbAAsjb,CAAC;AAC1kb,wBAAe,UAAU;;MCeZ,OAAO;;;;;uBAMyB,WAAW;oBAMpD,QAAQ;yBAKU,KAAK;;IAEzB,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,KAAK,EAAE;gBACL,OAAO,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS;gBACnC,UAAU,EAAE,IAAI,CAAC,IAAI,KAAK,UAAU;gBACpC,SAAS,EAAE,IAAI,CAAC,IAAI,KAAK,SAAS;gBAClC,KAAK,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;gBAC5B,MAAM,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;gBAC9B,KAAK,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;gBAC5B,YAAY,EAAE,IAAI,CAAC,SAAS;aAC7B,GACK,EACR;KACH;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/spinner/spinner.scss?tag=ix-spinner&encapsulation=shadow","src/components/spinner/spinner.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'mixins/shadow-dom/component';\n\n@mixin ix-spinner($host-class: 'medium', $size: 2rem, $track-size: 4px) {\n  :host(.#{$host-class}) {\n    @include ix-component;\n    display: block;\n    position: relative;\n\n    width: $size;\n    height: $size;\n    min-width: $size;\n    min-height: $size;\n    max-width: $size;\n    max-height: $size;\n    border-radius: 100%;\n    position: relative;\n    animation: rotate 2s linear infinite;\n\n    @keyframes rotate {\n      100% {\n        transform: rotate(360deg);\n      }\n    }\n\n    @keyframes clipMask {\n      0% {\n        clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);\n      }\n      12.5% {\n        clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);\n      }\n      25% {\n        clip-path: polygon(\n          50% 50%,\n          0 0,\n          100% 0,\n          100% 100%,\n          100% 100%,\n          100% 100%\n        );\n      }\n      37.5% {\n        clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);\n      }\n      50% {\n        clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);\n      }\n      62.5% {\n        clip-path: polygon(50% 50%, 100% 0, 100% 0, 100% 100%, 0 100%, 0 0);\n      }\n      75% {\n        clip-path: polygon(\n          50% 50%,\n          100% 100%,\n          100% 100%,\n          100% 100%,\n          0 100%,\n          0 0\n        );\n      }\n      87.5% {\n        clip-path: polygon(50% 50%, 0 100%, 0 100%, 0 100%, 0 100%, 0 0);\n      }\n      100% {\n        clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);\n      }\n    }\n  }\n\n  :host(.#{$host-class})::after {\n    content: '';\n    box-sizing: border-box;\n    position: absolute;\n    inset: 8.33%;\n    border-radius: 100%;\n    border: $track-size solid\n      var(--ix-button-color, var(--theme-color-soft-text));\n    animation: clipMask 3s linear infinite;\n  }\n\n  :host(:not(.hide-track)):host(.#{$host-class})::before {\n    content: '';\n    box-sizing: border-box;\n    position: absolute;\n    inset: 8.33%;\n    border-radius: 100%;\n    border: $track-size solid var(--theme-color-ghost--hover);\n  }\n\n  :host(.primary)::after {\n    border-color: var(--theme-color-dynamic);\n  }\n\n  :host(.primary)::before {\n    border-color: var(--theme-color-ghost--hover);\n  }\n}\n\n@include ix-spinner($host-class: 'xx-small', $size: 0.75rem, $track-size: 1px);\n@include ix-spinner($host-class: 'x-small', $size: 1.25rem, $track-size: 2px);\n@include ix-spinner($host-class: 'small', $size: 1.5rem, $track-size: 2px);\n@include ix-spinner($host-class: 'medium', $size: 2rem, $track-size: 2px);\n@include ix-spinner($host-class: 'large', $size: 6rem, $track-size: 4px);\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-spinner',\n  styleUrl: 'spinner.scss',\n  shadow: true,\n})\nexport class Spinner {\n  @Element() hostElement!: HTMLIxSpinnerElement;\n\n  /**\n   * Variant of spinner\n   */\n  @Prop() variant: 'primary' | 'secondary' = 'secondary';\n\n  /**\n   * Size of spinner\n   */\n  @Prop() size: 'xx-small' | 'x-small' | 'small' | 'medium' | 'large' =\n    'medium';\n\n  /**\n   * @internal\n   */\n  @Prop() hideTrack = false;\n\n  render() {\n    return (\n      <Host\n        class={{\n          primary: this.variant === 'primary',\n          'xx-small': this.size === 'xx-small',\n          'x-small': this.size === 'x-small',\n          small: this.size === 'small',\n          medium: this.size === 'medium',\n          large: this.size === 'large',\n          'hide-track': this.hideTrack,\n        }}\n      ></Host>\n    );\n  }\n}\n"],"version":3}

package/components/tab-item.js

@@ -0,0 +1,88 @@
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+
+const tabItemCss = "@charset \"UTF-8\";:host{position:relative;display:flex;align-items:center;justify-content:center;padding:10px 1.5rem;line-height:20px;font-size:14px;font-weight:bold;background-color:var(--theme-tab--background);color:var(--theme-tab--color)}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host ::after{content:\"\";position:absolute;background-color:var(--theme-tab-indicator--background);width:100%;height:var(--theme-tab-indicator--height);left:0}:host .text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}:host .text span,:host .text span::before{pointer-events:none}:host .circle{display:flex;justify-content:center;align-items:center;height:3rem;width:3rem;background-color:var(--theme-animated-tab-indicator--background);border-radius:50%;border:2px solid var(--theme-animated-tab-circle--border-color);color:var(--theme-an…icon--color);cursor:pointer}:host .circle.selected:not(.disabled){background-color:var(--theme-animated-tab-circle--background--selected);color:var(--theme-animated-tab-icon--color--selected);border-color:var(--theme-animated-tab-circle--border-color--selected)}:host .circle.selected:not(.disabled):hover{background-color:var(--theme-animated-tab-circle--background--selected)}:host .circle:hover{background-color:var(--theme-animated-tab-circle--background--hover)}:host .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}:host .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}:host .circle.disabled{background-color:var(--theme-animated-tab-circle--background--disabled);border-color:var(--theme-animated-tab-circle--border-color--disabled)}:host .counter{position:absolute;z-index:1;height:16px;width:auto;background-color:var(--theme-pill-outline--background);border:1px solid var(--theme-tab-pill--border-color);border-radius:100px;bottom:6px;display:flex;justify-content:center;align-items:center;padding-left:0.25rem;padding-right:0.25rem;font-size:12px;line-height:14px;color:var(--theme-pill-outline--color);cursor:pointer}:host .counter.selected{border-color:var(--theme-tab-pill--border-color--selected)}:host .counter.selected::after{display:none}:host .counter.disabled{border-color:var(--theme-tab-pill--border-color--disabled)}:host .counter::after{display:none}:host .hidden{display:none}:host(.circle){height:72px}:host(.top) ::after{top:0}:host(.bottom) ::after{bottom:0}:host(.stretched){flex-basis:100%;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(:hover:not(.circle)){background-color:var(--theme-tab--background--hover);color:var(--theme-tab-color-hover);cursor:pointer}:host(:hover:not(.circle)) ::after{background-color:var(--theme-tab-indicator--background--hover)}:host(:active:not(.circle)){background-color:var(--theme-tab--background--active);color:var(--theme-tab-color--active)}:host(:active:not(.circle)) ::after{background-color:var(--theme-tab-indicator--background--active)}:host(:focus-visible){outline:0px solid var(--focus--border-color)}:host(:focus-visible) .circle{outline:1px solid var(--focus--border-color)}:host(:focus-visible:not(.circle)){outline:1px solid var(--focus--border-color)}:host(.disabled){pointer-events:none;color:var(--theme-tab--color--disabled);background-color:var(--theme-tab--background--disabled)}:host(.disabled) ::after{background-color:var(--theme-tab-indicator--background--disabled)}:host(.selected:not(.disabled)){background-color:var(--theme-tab--background--selected);color:var(--theme-tab--color--selected)}:host(.selected:not(.disabled)) ::after{background-color:var(--theme-tab-indicator--background--selected)}:host(.icon){padding:1.5rem 0.5rem}:host(.small-tab){height:32px;padding:1rem}:host(.small-tab.icon){padding:1rem 0.25rem}";
+const IxTabItemStyle0 = tabItemCss;
+
+const TabItem = /*@__PURE__*/ proxyCustomElement(class TabItem extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.tabClick = createEvent(this, "tabClick", 7);
+        this.selected = false;
+        this.disabled = false;
+        this.small = false;
+        this.icon = false;
+        this.rounded = false;
+        this.counter = undefined;
+        this.layout = 'auto';
+        this.placement = 'bottom';
+    }
+    tabItemClasses(props) {
+        return {
+            selected: props.selected,
+            disabled: props.disabled,
+            'small-tab': props.small,
+            icon: props.small,
+            stretched: props.layout === 'stretched',
+            bottom: props.placement === 'bottom',
+            top: props.placement === 'top',
+            circle: props.circle,
+        };
+    }
+    render() {
+        return (h(Host, { key: '77688f6b83f53ba0de891d2ed529c7b82941930a', class: this.tabItemClasses({
+                selected: this.selected,
+                disabled: this.disabled,
+                small: this.small,
+                icon: this.icon,
+                layout: this.layout,
+                placement: this.placement,
+                circle: this.rounded,
+            }), tabIndex: 0, onClick: (event) => {
+                const clientEvent = this.tabClick.emit({
+                    nativeEvent: event,
+                });
+                if (clientEvent.defaultPrevented) {
+                    event.stopPropagation();
+                }
+            } }, h("div", { key: 'd1790baee81972038f8a09c0e7a0ee3124e828a6', class: {
+                circle: this.rounded,
+                text: !this.rounded,
+                selected: this.selected,
+                disabled: this.disabled,
+            } }, h("slot", { key: '7dcd5bcd496e9955b45f00b570fb935a0e9a8969' })), h("div", { key: '435deec3155b879b5f8a397124bf9a198283c2bd', class: {
+                counter: true,
+                selected: this.selected,
+                hidden: !(this.rounded && this.counter !== undefined),
+                disabled: this.disabled,
+            } }, this.counter)));
+    }
+    static get style() { return IxTabItemStyle0; }
+}, [1, "ix-tab-item", {
+        "selected": [4],
+        "disabled": [4],
+        "small": [4],
+        "icon": [4],
+        "rounded": [4],
+        "counter": [2],
+        "layout": [1],
+        "placement": [1]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ix-tab-item"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ix-tab-item":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, TabItem);
+            }
+            break;
+    } });
+}
+
+export { TabItem as T, defineCustomElement as d };
+
+//# sourceMappingURL=tab-item.js.map

package/components/tab-item.js.map

@@ -0,0 +1 @@
+{"file":"tab-item.js","mappings":";;AAAA,MAAM,UAAU,GAAG,gvIAAgvI,CAAC;AACpwI,wBAAe,UAAU;;MCmBZ,OAAO;;;;;;wBAIC,KAAK;wBAKL,KAAK;qBAKR,KAAK;oBAKN,KAAK;uBAKF,KAAK;;sBAUgB,MAAM;yBAKP,QAAQ;;IAStC,cAAc,CAAC,KAQtB;QACC,OAAO;YACL,QAAQ,EAAE,KAAK,CAAC,QAAQ;YACxB,QAAQ,EAAE,KAAK,CAAC,QAAQ;YACxB,WAAW,EAAE,KAAK,CAAC,KAAK;YACxB,IAAI,EAAE,KAAK,CAAC,KAAK;YACjB,SAAS,EAAE,KAAK,CAAC,MAAM,KAAK,WAAW;YACvC,MAAM,EAAE,KAAK,CAAC,SAAS,KAAK,QAAQ;YACpC,GAAG,EAAE,KAAK,CAAC,SAAS,KAAK,KAAK;YAC9B,MAAM,EAAE,KAAK,CAAC,MAAM;SACrB,CAAC;KACH;IAED,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC;gBACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,IAAI,EAAE,IAAI,CAAC,IAAI;gBACf,MAAM,EAAE,IAAI,CAAC,MAAM;gBACnB,SAAS,EAAE,IAAI,CAAC,SAAS;gBACzB,MAAM,EAAE,IAAI,CAAC,OAAO;aACrB,CAAC,EACF,QAAQ,EAAE,CAAC,EACX,OAAO,EAAE,CAAC,KAAiB;gBACzB,MAAM,WAAW,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;oBACrC,WAAW,EAAE,KAAK;iBACnB,CAAC,CAAC;gBAEH,IAAI,WAAW,CAAC,gBAAgB,EAAE;oBAChC,KAAK,CAAC,eAAe,EAAE,CAAC;iBACzB;aACF,IAED,4DACE,KAAK,EAAE;gBACL,MAAM,EAAE,IAAI,CAAC,OAAO;gBACpB,IAAI,EAAE,CAAC,IAAI,CAAC,OAAO;gBACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,IAED,8DAAa,CACT,EACN,4DACE,KAAK,EAAE;gBACL,OAAO,EAAE,IAAI;gBACb,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,MAAM,EAAE,EAAE,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,KAAK,SAAS,CAAC;gBACrD,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,IAEA,IAAI,CAAC,OAAO,CACT,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/tab-item/tab-item.scss?tag=ix-tab-item&encapsulation=shadow","src/components/tab-item/tab-item.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/text-truncation';\n@import 'mixins/hover';\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 10px $large-space;\n  line-height: 20px;\n  font-size: 14px;\n  font-weight: bold;\n  background-color: var(--theme-tab--background);\n  color: var(--theme-tab--color);\n\n  ::after {\n    content: '';\n    position: absolute;\n    background-color: var(--theme-tab-indicator--background);\n    width: 100%;\n    height: var(--theme-tab-indicator--height);\n    left: 0;\n  }\n\n  .text {\n    @include ellipsis;\n\n    span,\n    span::before {\n      pointer-events: none;\n    }\n\n    vertical-align: middle;\n  }\n\n  .circle {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    height: 3rem;\n    width: 3rem;\n    background-color: var(--theme-animated-tab-indicator--background);\n    border-radius: 50%;\n    border: 2px solid var(--theme-animated-tab-circle--border-color);\n    color: var(--theme-an…icon--color);\n    cursor: pointer;\n\n    &.selected:not(.disabled) {\n      background-color: var(--theme-animated-tab-circle--background--selected);\n      color: var(--theme-animated-tab-icon--color--selected);\n      border-color: var(--theme-animated-tab-circle--border-color--selected);\n\n      &:hover {\n        background-color: var(\n          --theme-animated-tab-circle--background--selected\n        );\n      }\n    }\n\n    &:hover {\n      background-color: var(--theme-animated-tab-circle--background--hover);\n    }\n\n    &:active {\n      background-color: var(--theme-animated-tab-circle--background--active);\n    }\n\n    &:active {\n      background-color: var(--theme-animated-tab-circle--background--active);\n    }\n\n    &.disabled {\n      background-color: var(--theme-animated-tab-circle--background--disabled);\n      border-color: var(--theme-animated-tab-circle--border-color--disabled);\n    }\n  }\n\n  .counter {\n    position: absolute;\n    z-index: 1;\n    height: 16px;\n    width: auto;\n    background-color: var(--theme-pill-outline--background);\n    border: 1px solid var(--theme-tab-pill--border-color);\n    border-radius: 100px;\n    bottom: 6px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    padding-left: $tiny-space;\n    padding-right: $tiny-space;\n    font-size: 12px;\n    line-height: 14px;\n    color: var(--theme-pill-outline--color);\n    cursor: pointer;\n\n    &.selected {\n      border-color: var(--theme-tab-pill--border-color--selected);\n\n      &::after {\n        display: none;\n      }\n    }\n\n    &.disabled {\n      border-color: var(--theme-tab-pill--border-color--disabled);\n    }\n\n    &::after {\n      display: none;\n    }\n  }\n\n  .hidden {\n    display: none;\n  }\n}\n\n:host(.circle) {\n  height: 72px;\n}\n\n:host(.top) {\n  ::after {\n    top: 0;\n  }\n}\n\n:host(.bottom) {\n  ::after {\n    bottom: 0;\n  }\n}\n\n:host(.stretched) {\n  flex-basis: 100%;\n  width: 100%;\n  @include ellipsis;\n}\n\n:host(:hover:not(.circle)) {\n  background-color: var(--theme-tab--background--hover);\n  color: var(--theme-tab-color-hover);\n  cursor: pointer;\n\n  ::after {\n    background-color: var(--theme-tab-indicator--background--hover);\n  }\n}\n\n:host(:active:not(.circle)) {\n  background-color: var(--theme-tab--background--active);\n  color: var(--theme-tab-color--active);\n\n  ::after {\n    background-color: var(--theme-tab-indicator--background--active);\n  }\n}\n\n:host(:focus-visible) {\n  outline: 0px solid var(--focus--border-color);\n\n  .circle {\n    outline: 1px solid var(--focus--border-color);\n  }\n}\n\n:host(:focus-visible:not(.circle)) {\n  outline: 1px solid var(--focus--border-color);\n}\n\n:host(.disabled) {\n  pointer-events: none;\n  color: var(--theme-tab--color--disabled);\n  background-color: var(--theme-tab--background--disabled);\n\n  ::after {\n    background-color: var(--theme-tab-indicator--background--disabled);\n  }\n}\n\n:host(.selected:not(.disabled)) {\n  background-color: var(--theme-tab--background--selected);\n  color: var(--theme-tab--color--selected);\n\n  ::after {\n    background-color: var(--theme-tab-indicator--background--selected);\n  }\n}\n\n:host(.icon) {\n  padding: $large-space $small-space;\n}\n\n:host(.small-tab) {\n  height: 32px;\n  padding: $default-space;\n}\n\n:host(.small-tab.icon) {\n  padding: $default-space $tiny-space;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\nexport type TabClickDetail = {\n  nativeEvent: MouseEvent;\n};\n\n@Component({\n  tag: 'ix-tab-item',\n  styleUrl: 'tab-item.scss',\n  shadow: true,\n})\nexport class TabItem {\n  /**\n   * Set selected tab\n   */\n  @Prop() selected = false;\n\n  /**\n   * Set disabled tab\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Set small size tab\n   */\n  @Prop() small = false;\n\n  /**\n   * Set icon only tab\n   */\n  @Prop() icon = false;\n\n  /**\n   * Set rounded tab\n   */\n  @Prop() rounded = false;\n\n  /**\n   * Set counter value\n   */\n  @Prop() counter: number;\n\n  /**\n   * Set layout width style\n   */\n  @Prop() layout: 'auto' | 'stretched' = 'auto';\n\n  /**\n   * Set selected placement\n   */\n  @Prop() placement: 'bottom' | 'top' = 'bottom';\n\n  /**\n   * On tab click\n   *\n   * @since 2.0.0\n   */\n  @Event() tabClick: EventEmitter<TabClickDetail>;\n\n  private tabItemClasses(props: {\n    selected: boolean;\n    disabled: boolean;\n    small: boolean;\n    icon: boolean;\n    circle: boolean;\n    layout: 'auto' | 'stretched';\n    placement: 'bottom' | 'top';\n  }) {\n    return {\n      selected: props.selected,\n      disabled: props.disabled,\n      'small-tab': props.small,\n      icon: props.small,\n      stretched: props.layout === 'stretched',\n      bottom: props.placement === 'bottom',\n      top: props.placement === 'top',\n      circle: props.circle,\n    };\n  }\n\n  render() {\n    return (\n      <Host\n        class={this.tabItemClasses({\n          selected: this.selected,\n          disabled: this.disabled,\n          small: this.small,\n          icon: this.icon,\n          layout: this.layout,\n          placement: this.placement,\n          circle: this.rounded,\n        })}\n        tabIndex={0}\n        onClick={(event: MouseEvent) => {\n          const clientEvent = this.tabClick.emit({\n            nativeEvent: event,\n          });\n\n          if (clientEvent.defaultPrevented) {\n            event.stopPropagation();\n          }\n        }}\n      >\n        <div\n          class={{\n            circle: this.rounded,\n            text: !this.rounded,\n            selected: this.selected,\n            disabled: this.disabled,\n          }}\n        >\n          <slot></slot>\n        </div>\n        <div\n          class={{\n            counter: true,\n            selected: this.selected,\n            hidden: !(this.rounded && this.counter !== undefined),\n            disabled: this.disabled,\n          }}\n        >\n          {this.counter}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}