@oiz/stzh-components 4.5.0 → 4.6.0-beta1

package/dist/components/{p-a393bd0b.js.map → p-e3182412.js.map}

@@ -1 +1 @@
-{"file":"p-a393bd0b.js","mappings":";;;;AAAA,MAAM,eAAe,GAAG,y+SAAy+S,CAAC;AAClgT,2BAAe,eAAe;;ACQ9B,MAAM,kBAAkB,GAAG,MAAM,CAAC,UAAU,CAAC,kCAAkC,CAAC,CAAC;AAEjF,IAAI,eAAe,GAAG,CAAC,CAAC;MAqBX,YAAY;;;;;;;;QAgWf,oBAAe,GAAW,CAAC,CAAC;;QAG5B,uBAAkB,GAAY,KAAK,CAAC;;QAGpC,oBAAe,GAAW,IAAI,CAAC;;QAM/B,UAAK,GAAW,IAAI,CAAC;;QAGrB,WAAM,GAAW,IAAI,CAAC;;QAGtB,oBAAe,GAAW,IAAI,CAAC;;QAG/B,qBAAgB,GAAW,IAAI,CAAC;;QAYhC,oBAAe,GAAY,KAAK,CAAC;QAsEjC,+BAA0B,GAAG;YACnC,IAAI,CAAC,6BAA6B,GAAG,kBAAkB,CAAC,OAAO,CAAC;SACjE,CAAC;QAEM,iBAAY,GAAG;YACrB,IAAI,CAAC,IAAI,CAAC,oBAAoB,EAAE;gBAC9B,IAAI,CAAC,uBAAuB,GAAG,IAAI,CAAC;aACrC;SACF,CAAC;QAEM,iBAAY,GAAG;YACrB,IAAI,CAAC,uBAAuB,GAAG,KAAK,CAAC;SACtC,CAAC;QAEM,cAAS,GAAG;YAClB,IAAI,CAAC,IAAI,CAAC,oBAAoB,EAAE;gBAC9B,IAAI,CAAC,uBAAuB,GAAG,IAAI,CAAC;aACrC;SACF,CAAC;QAEM,eAAU,GAAG;YACnB,IAAI,CAAC,uBAAuB,GAAG,KAAK,CAAC;SACtC,CAAC;QAEM,oBAAe,GAAG;YACxB,IAAI,CAAC,yBAAyB,EAAE,CAAC;SAClC,CAAC;QAEM,gBAAW,GAAG;YACpB,IAAI,CAAC,qBAAqB,EAAE,CAAC;SAC9B,CAAC;QAEM,kBAAa,GAAG;YACtB,IAAI,IAAI,CAAC,aAAa,EAAE;gBACtB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;aACrC;SACF,CAAC;QAEM,eAAU,GAAG;YACnB,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;gBACvB,OAAO;aACR;YAED,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAkB,CAAC;YAE9E,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,KAAK;gBACtC,KAAK,CAAC,YAAY,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;gBACpC,KAAK,CAAC,YAAY,CAAC,sBAAsB,EAAE,OAAO,CAAC,CAAC;gBACpD,KAAK,CAAC,YAAY,CAChB,YAAY,EACZ,IAAI,CAAC,YAAY,CAAC,UAAU;qBACzB,OAAO,CAAC,eAAe,EAAE,CAAC,KAAK,GAAG,CAAC,EAAE,QAAQ,EAAE,CAAC;qBAChD,OAAO,CAAC,aAAa,EAAE,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC,CAChE,CAAC;aACH,CAAC,CAAC;YAEH,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,+BAA+B,CAAC,CAAC,CAAC;YACnG,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,2BAA2B,CAAC,CAAC,CAAC;YAC3F,IAAI,CAAC,sBAAsB,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,sCAAsC,CAAC,CAAC,CAAC;SACjH,CAAC;QAEM,aAAQ,GAAG;YACjB,IAAI,IAAI,CAAC,eAAe,KAAK,IAAI,EAAE;gBACjC,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,CAAC,UAAU,GAAG,IAAI,CAAC,eAAe,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;gBAEhF,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;gBAEtB,IAAI,CAAC,IAAI,CAAC,kBAAkB,EAAE;oBAC5B,IAAI,IAAI,CAAC,mBAAmB,EAAE;wBAC5B,IAAI,CAAC,wBAAwB,GAAG,IAAI,CAAC;qBACtC;yBAAM;wBACL,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;qBACvB;iBACF;gBAED,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;oBACvB,SAAS,EAAE,eAAe;oBAC1B,KAAK,EAAE,IAAI,CAAC,KAAK,GAAG,SAAS;iBAC9B,CAAC,CAAC;aACJ;YAED,IAAI,IAAI,CAAC,KAAK,KAAK,IAAI,CAAC,cAAc,EAAE,EAAE;gBACxC,IAAI,CAAC,MAAM,EAAE,CAAC;gBACd,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC;oBACxB,SAAS,EAAE,eAAe;oBAC1B,KAAK,EAAE,IAAI,CAAC,KAAK;iBAClB,CAAC,CAAC;aACJ;YAED,IAAI,CAAC,eAAe,IAAI,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;YAClE,IAAI,CAAC,eAAe,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;SAChF,CAAC;QAEM,gBAAW,GAAG;YACpB,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;YAC5B,IAAI,CAAC,MAAM,EAAE,CAAC;YAEd,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;YACvB,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;YAChC,IAAI,CAAC,wBAAwB,GAAG,KAAK,CAAC;YAEtC,IAAI,IAAI,CAAC,eAAe,EAAE;gBACxB,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;gBAC7B,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAC;gBAC3D,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,cAAc,CAAC,kBAAkB,CAAC,CAAC;aAC7D;YAED,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,OAAO,KAAK,OAAO,EAAE;gBAC/C,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;aACpB;iBAAM;gBACL,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,aAAa,GAAG,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,WAAW,GAAG,IAAI,CAAC,YAAY,CAAC,UAAU;qBACnG,OAAO,CAAC,sBAAsB,EAAE,CAAC,IAAI,CAAC,KAAK,GAAG,CAAC,EAAE,QAAQ,EAAE,CAAC;qBAC5D,OAAO,CAAC,UAAU,EAAE,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,EAAE,QAAQ,EAAE,CAAC;qBACjE,OAAO,CAAC,aAAa,EAAE,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC,CAAC;aACjE;YAED,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;gBACrB,SAAS,EAAE,eAAe;gBAC1B,KAAK,EAAE,IAAI,CAAC,KAAK;aAClB,CAAC,CAAC;SACJ,CAAC;QAEM,kBAAa,GAAG;YACtB,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC;YACrC,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC;YACrC,MAAM,MAAM,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC;YACvC,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC;YAErC,IAAI,KAAK,IAAI,IAAI,CAAC,WAAW,KAAK,CAAC,EAAE;gBACnC,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,WAAW,CAAC;aACvC;iBAAM,IAAI,KAAK,IAAI,IAAI,CAAC,WAAW,KAAK,CAAC,EAAE;gBAC1C,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,WAAW,CAAC;aACvC;iBAAM,IAAI,MAAM,IAAI,IAAI,CAAC,YAAY,KAAK,CAAC,EAAE;gBAC5C,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,YAAY,CAAC;aACxC;iBAAM,IAAI,KAAK,IAAI,IAAI,CAAC,WAAW,KAAK,CAAC,EAAE;gBAC1C,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,WAAW,CAAC;aACvC;iBAAM;gBACL,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,MAAM,CAAC;aAClC;;;;;;;;;;;;YAcD,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,aAAa,CAAC;SAC9C,CAAC;;QAGM,cAAS,GAAG,CAAC,KAAiB;YACpC,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC;YAC5C,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC;YAE3B,IAAI,CAAC,aAAa,CAAC,UAAU,IAAI,QAAQ,CAAC;SAC3C,CAAC;;QAGM,kBAAa,GAAG,CAAC,KAAiB;YACxC,KAAK,CAAC,cAAc,EAAE,CAAC;YAEvB,IAAI,CAAC,gBAAgB,IAAI,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;YACpE,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;YAE7B,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC;YACzC,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,aAAa,CAAC,UAAU,CAAC;YACrD,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,WAAW,CAAC,iBAAiB,EAAE,MAAM,CAAC,CAAC;YAChE,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,WAAW,CAAC,kBAAkB,EAAE,OAAO,CAAC,CAAC;YAElE,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;YAErB,IAAI,IAAI,CAAC,mBAAmB,EAAE;gBAC5B,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC;aACpC;iBAAM;gBACL,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;aACvB;YAED,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;YACrD,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,YAAY,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;YACzE,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;SACtE,CAAC;;QAGM,iBAAY,GAAG,CAAC,KAAiB;YACvC,KAAK,CAAC,cAAc,EAAE,CAAC;YAEvB,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC;YACpD,MAAM,cAAc,GAAG,QAAQ,GAAG,IAAI,CAAC,kBAAkB,CAAC;YAC1D,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;YAEpD,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;YACtB,IAAI,CAAC,sBAAsB,GAAG,KAAK,CAAC;YAEpC,MAAM,eAAe,GAAG,IAAI,CAAC,aAAa,CAAC,UAAU,CAAC;YAEtD,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,cAAc,CAAC,kBAAkB,CAAC,CAAC;YAC5D,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,CAAC,UAAU,CAAC;YAEhD,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,WAAW,CAAC,kBAAkB,EAAE,OAAO,CAAC,CAAC;YAClE,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,EAAE,CAAC,CAAC;YAEzE,IAAI,SAAS,KAAK,IAAI,CAAC,eAAe,IAAI,CAAC,cAAc,EAAE;gBACzD,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,kBAAkB,CAAC,OAAO,GAAG,MAAM,GAAG,QAAQ,EAAE,CAAC,CAAC;aAC5G;iBAAM,IAAI,SAAS,KAAK,CAAC,EAAE;gBAC1B,IAAI,CAAC,eAAe,EAAE,CAAC;aACxB;iBAAM;gBACL,IAAI,CAAC,WAAW,EAAE,CAAC;aACpB;YAED,MAAM,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;YACxD,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,YAAY,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;YAE5E,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;SAC7B,CAAC;QAEM,eAAU,GAAG,CAAC,KAAiB;YACrC,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC;YACpD,MAAM,cAAc,GAAG,QAAQ,GAAG,IAAI,CAAC,oBAAoB,CAAC;YAE5D,IAAI,cAAc,EAAE;gBAClB,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;aACzB;YAED,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;YAElB,MAAM,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;SACzE,CAAC;QAEM,qBAAgB,GAAG;YACzB,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;YAE/B,IAAI,IAAI,CAAC,mBAAmB,EAAE,EAAE;gBAC9B,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;aACjB;iBAAM;gBACL,IAAI,CAAC,WAAW,EAAE,CAAC;aACpB;SACF,CAAC;;uBArrBsD,SAAS;wBAGpB,KAAK;sBAGP,KAAK;sBAGvB,CAAC;2BAEI,CAAC;4BAEA,CAAC;2BAEF,CAAC;2BAED,CAAC;qBAcP,CAAC;wBAQoB,KAAK;+BAGhB,IAAI;8BAGJ,KAAK;gCAGH,KAAK;oCAGD,KAAK;mCAGN,KAAK;0BAOd,KAAK;yBAGN,KAAK;6BAGD,GAAG;kCAGE,EAAE;oCAGA,CAAC;+BAgOL,KAAK;6CAGS,KAAK;uCAGX,KAAK;uCAGL,KAAK;wCAGJ,KAAK;sCAGP,KAAK;wBAGnB,KAAK;yBAGJ,KAAK;wBAGP,EAAE;6BAGG,CAAC;kCAGI,CAAC;6BAGC,EAAE;gCAGC,EAAE;4BAGN,EAAE;sCAGQ,EAAE;;;IA3PnD,MAAM,OAAO,CAAC,KAAK,EAAE,YAA+B,QAAQ;QAC1D,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;KACtC;;IAID,MAAM,eAAe,CAAC,YAA+B,QAAQ;QAC3D,IAAI,CAAC,yBAAyB,CAAC,SAAS,CAAC,CAAC;KAC3C;;IAID,MAAM,WAAW,CAAC,YAA+B,QAAQ;QACvD,IAAI,CAAC,qBAAqB,CAAC,SAAS,CAAC,CAAC;KACvC;IAGD,eAAe;QACb,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,aAAa,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;YACtF,IAAI,CAAC,eAAe,IAAI,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;YAClE,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;YAC5B,IAAI,CAAC,OAAO,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;YAClE,IAAI,CAAC,OAAO,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;YAClE,IAAI,CAAC,OAAO,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;YAC5D,IAAI,CAAC,OAAO,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;YAC9D,IAAI,CAAC,0BAA0B,EAAE,CAAC;YAClC,kBAAkB,IAAI,kBAAkB,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,0BAA0B,CAAC,CAAC;SACzG;aAAM;YACL,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,aAAa,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;YACtG,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;YAC/D,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;YAC/D,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;YACzD,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;YAC3D,kBAAkB,IAAI,kBAAkB,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,0BAA0B,CAAC,CAAC;SACtG;KACF;IAID,uBAAuB;QACrB,IAAI,IAAI,CAAC,gBAAgB,IAAI,IAAI,CAAC,QAAQ,EAAE;YAC1C,IAAI,CAAC,gBAAgB,IAAI,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;YACpE,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;YAC7B,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,aAAa,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;YAC9F,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;SACnB;aAAM;YACL,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,aAAa,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;SAC5F;KACF;IAUD,sBAAsB;QACpB,IACE,CAAC,IAAI,CAAC,QAAQ;YACd,IAAI,CAAC,QAAQ;YACb,IAAI,CAAC,6BAA6B;YAClC,IAAI,CAAC,uBAAuB;YAC5B,IAAI,CAAC,uBAAuB;YAC5B,IAAI,CAAC,wBAAwB;YAC7B,IAAI,CAAC,sBAAsB,EAC3B;YACA,IAAI,CAAC,kBAAkB,IAAI,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;YACzE,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;YAC/B,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;SAC9B;aAAM;YACL,IAAI,CAAC,kBAAkB,IAAI,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;YACzE,IAAI,CAAC,kBAAkB,GAAG,MAAM,CAAC,WAAW,CAAC,IAAI,CAAC,gBAAgB,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;YAC1F,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;SAC7B;KACF;IAID,gBAAgB;QACd,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,KAAK;YACtC,MAAM,UAAU,GAAG,CAAC,KAAK,GAAG,IAAI,CAAC,kBAAkB,IAAI,IAAI,CAAC,kBAAkB,KAAK,CAAC,CAAC;YAErF,IAAI,UAAU,EAAE;gBACd,KAAK,CAAC,KAAK,CAAC,cAAc,CAAC,mBAAmB,CAAC,CAAC;aACjD;iBAAM;gBACL,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,mBAAmB,EAAE,MAAM,CAAC,CAAC;aACtD;SACF,CAAC,CAAC;KACJ;IAOD,YAAY;QACV,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,KAAK;YACtC,MAAM,QAAQ,GACZ,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,OAAO,KAAK,OAAO,KAAK,KAAK,IAAI,IAAI,CAAC,KAAK,IAAI,KAAK,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC,CAAC;YAElH,KAAK,CAAC,KAAK,GAAG,CAAC,QAAQ,CAAC;YAExB,IAAI,QAAQ,EAAE;gBACZ,KAAK,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;aACtC;iBAAM;gBACL,KAAK,CAAC,YAAY,CAAC,aAAa,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC,CAAC;aAChE;SACF,CAAC,CAAC;KACJ;IAMD,yBAAyB;QACvB,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,OAAO,KAAK,OAAO,CAAC;QAE/D,MAAM,iBAAiB,GAAG,OAAO;YAC/B,MAAM,MAAM,GAAG,aAAa,CAAC,OAAO,CAAC,CAAC;YAEtC,IAAI,UAAU,EAAE;gBACd,OAAO,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;gBAC5C,OAAO,CAAC,YAAY,CAAC,MAAM,GAAG,eAAe,GAAG,UAAU,EAAE,IAAI,CAAC,CAAC;aACnE;iBAAM;gBACL,OAAO,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;gBACvC,OAAO,CAAC,eAAe,CAAC,MAAM,GAAG,eAAe,GAAG,UAAU,CAAC,CAAC;aAChE;SACF,CAAC;QAEF,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;QAC7C,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;KAClD;IAOD,qBAAqB;QACnB,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,IAAI,IAAI,CAAC,aAAa,CAAC;QAErE,MAAM,kBAAkB,GAAG,OAAO;YAChC,IAAI,YAAY,EAAE;gBAChB,OAAO,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;aACpC;iBAAM;gBACL,OAAO,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC;aACnC;SACF,CAAC;QAEF,IAAI,CAAC,sBAAsB,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;QACxD,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;QAC9C,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;KACnD;IAQD,uBAAuB;QACrB,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;YACvB,OAAO;SACR;QAED,MAAM,iBAAiB,GAAG,IAAI,CAAC,KAAK,KAAK,CAAC,CAAC;QAC3C,MAAM,gBAAgB,GAAG,IAAI,CAAC,mBAAmB,EAAE,CAAC;QAEpD,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,OAAO;YAC/B,MAAM,MAAM,GAAG,aAAa,CAAC,OAAO,CAAC,CAAC;YACtC,OAAO,CAAC,YAAY,CAClB,MAAM,GAAG,eAAe,GAAG,eAAe,EAC1C,gBAAgB,IAAI,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,OAAO,CACrD,CAAC;SACH,CAAC,CAAC;QAEH,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,OAAO;YACnC,MAAM,MAAM,GAAG,aAAa,CAAC,OAAO,CAAC,CAAC;YACtC,OAAO,CAAC,YAAY,CAClB,MAAM,GAAG,eAAe,GAAG,eAAe,EAC1C,iBAAiB,IAAI,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,OAAO,CACtD,CAAC;SACH,CAAC,CAAC;KACJ;IAGD,mBAAmB;QACjB,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,WAAW;YACnC,MAAM,MAAM,GAAG,aAAa,CAAC,WAAW,CAAC,CAAC;YAE1C,WAAW,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;YACxD,WAAW,CAAC,YAAY,CAAC,MAAM,GAAG,eAAe,GAAG,eAAe,EAAE,GAAG,IAAI,CAAC,UAAU,SAAS,CAAC,CAAC;SACnG,CAAC,CAAC;KACJ;IAGD,uBAAuB;QACrB,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,eAAe;YAC3C,MAAM,MAAM,GAAG,aAAa,CAAC,eAAe,CAAC,CAAC;YAE9C,eAAe,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;YAChE,eAAe,CAAC,YAAY,CAAC,MAAM,GAAG,eAAe,GAAG,eAAe,EAAE,GAAG,IAAI,CAAC,UAAU,SAAS,CAAC,CAAC;SACvG,CAAC,CAAC;KACJ;IAwFO,aAAa,CAAC,KAAK,EAAE,YAA+B,QAAQ;QAClE,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO;SACR;QAED,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC;YAC1B,IAAI,EAAE,KAAK,GAAG,IAAI,CAAC,QAAQ;YAC3B,QAAQ,EAAE,kBAAkB,CAAC,OAAO,GAAG,MAAM,GAAG,SAAS;SAC1D,CAAC,CAAC;KACJ;;IAGO,YAAY;QAClB,MAAM,GAAG,GAAG,MAAM,CAAC,gBAAgB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QAExD,QACE,CAAE,IAAI,CAAC,aAAa,CAAC,iBAAiC,IAAI,IAAI,CAAC,aAAa,EAAE,WAAW;YACzF,QAAQ,CAAC,GAAG,CAAC,gBAAgB,CAAC,YAAY,CAAC,EAAE,EAAE,CAAC,EAChD;KACH;;;;;IAMO,cAAc;;;;QAIpB,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,UAAU,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;KAClE;IAEO,yBAAyB,CAAC,YAA+B,QAAQ;QACvE,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO;SACR;QAED,IAAI,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC;QAC/B,IAAI,OAAO,GAAG,KAAK,CAAC;QAEpB,OAAO,CAAC,OAAO,IAAI,aAAa,GAAG,CAAC,EAAE;YACpC,aAAa,GAAG,aAAa,GAAG,CAAC,CAAC;YAClC,OAAO,GAAG,CAAC,aAAa,GAAG,IAAI,CAAC,kBAAkB,IAAI,IAAI,CAAC,kBAAkB,KAAK,CAAC,CAAC;SACrF;QAED,IAAI,CAAC,OAAO,CAAC,aAAa,EAAE,SAAS,CAAC,CAAC;KACxC;IAEO,qBAAqB,CAAC,YAA+B,QAAQ;QACnE,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO;SACR;QAED,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,kBAAkB,EAAE,SAAS,CAAC,CAAC;KAC/D;IAEO,MAAM;QACZ,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;QACnC,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC;QAElD,IAAI,CAAC,UAAU,EAAE,CAAC;KACnB;IAEO,mBAAmB;QACzB,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,aAAa,CAAC;QACpE,OAAO,IAAI,CAAC,IAAI,CAAC,UAAU,GAAG,WAAW,CAAC,IAAI,WAAW,CAAC;KAC3D;IAuPD,MAAM,iBAAiB;QACrB,IAAI,CAAC,UAAU,GAAG,iBAAiB,eAAe,EAAE,EAAE,CAAC;QACvD,IAAI,CAAC,aAAa,EAAE,CAAC;QAErB,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;YACtB,IAAI,CAAC,YAAY,GAAG,MAAM,MAAM,CAAC,cAAc,CAAC,KAAK,CAAC,iBAAiB,CAAC,IAAI,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC;SACnG;KACF;IAED,gBAAgB;QACd,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QACpC,IAAI,CAAC,MAAM,EAAE,CAAC;QAEd,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,uBAAuB,EAAE,CAAC;QAC/B,IAAI,CAAC,sBAAsB,EAAE,CAAC;KAC/B;IAED,iBAAiB;QACf,sBAAsB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QAE3C,IAAI,CAAC,cAAc,GAAG,IAAI,cAAc,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QAC7D,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAE1C,IAAI,CAAC,gBAAgB,GAAG,IAAI,gBAAgB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAC9D,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE;YAC1C,SAAS,EAAE,IAAI;YACf,OAAO,EAAE,IAAI;SACd,CAAC,CAAC;KACJ;IAED,oBAAoB;QAClB,IAAI,CAAC,eAAe,IAAI,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QAClE,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;QAE5B,yBAAyB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QAE9C,IAAI,IAAI,CAAC,cAAc,EAAE;YACvB,IAAI,CAAC,cAAc,CAAC,UAAU,EAAE,CAAC;SAClC;QAED,IAAI,IAAI,CAAC,gBAAgB,EAAE;YACzB,IAAI,CAAC,gBAAgB,CAAC,UAAU,EAAE,CAAC;SACpC;KACF;IAED,MAAM;;QACJ,MAAM,OAAO,GAAG;YACd,eAAe,EAAE,IAAI;YACrB,4BAA4B,EAAE,IAAI,CAAC,QAAQ;YAC3C,6BAA6B,EAAE,CAAC,IAAI,CAAC,gBAAgB;YACrD,mCAAmC,EAAE,IAAI,CAAC,cAAc;YACxD,4BAA4B,EAAE,IAAI,CAAC,QAAQ;YAC3C,6BAA6B,EAAE,IAAI,CAAC,SAAS;YAC7C,6BAA6B,EAAE,IAAI,CAAC,QAAQ;YAC5C,oCAAoC,EAAE,IAAI,CAAC,eAAe;SAC3D,CAAC;QAEF,QACE,EAAC,IAAI,6EACkB,UAAU,EAC/B,KAAK,EAAE;gBACL,UAAU,EAAE,IAAI,CAAC,aAAa,CAAC,QAAQ,EAAE;aAC1C,IAED,4DAAK,KAAK,EAAE,OAAO,IACjB,6DAAM,IAAI,EAAC,SAAS,GAAQ,EAC5B,4DACE,KAAK,EAAC,wBAAwB,eACnB,IAAI,CAAC,uBAAuB,IAAI,IAAI,CAAC,uBAAuB,GAAG,QAAQ,GAAG,KAAK,IAEzF,IAAI,CAAC,QAAQ,CACV,EACN,4DACE,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,aAAa,GAAG,EAAoB,CAAC,EACtD,EAAE,EAAE,GAAG,IAAI,CAAC,UAAU,SAAS,EAC/B,KAAK,EAAC,uBAAuB,IAE7B,8DAAa,CACT,EACL,IAAI,CAAC,SAAS,KACb,4DAAK,KAAK,EAAC,0BAA0B,IACnC,4DACE,KAAK,EAAC,gCAAgC,EACtC,KAAK,EAAE;gBACL,IAAI,EAAE,GAAG,CAAC,GAAG,IAAI,CAAA,MAAA,IAAI,CAAC,aAAa,0CAAE,MAAM,KAAI,CAAC,CAAC,IAAI,IAAI,CAAC,KAAK,GAAG;gBAClE,KAAK,EAAE,GAAG,CAAC,GAAG,IAAI,CAAA,MAAA,IAAI,CAAC,aAAa,0CAAE,MAAM,KAAI,CAAC,CAAC,IAAI,IAAI,CAAC,aAAa,IAAI,CAAC,GAAG;aACjF,GACI,CACH,CACP,CACG,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/stzh-carousel/stzh-carousel.scss?tag=stzh-carousel&encapsulation=scoped","src/components/stzh-carousel/stzh-carousel.tsx"],"sourcesContent":["/**\n * @prop --padding-top: Padding Top of scroll container\n * @prop --padding-bottom: Padding Bottom of scroll container\n * @prop --peek-in: Peek size (inside container) showing the next/previous slides\n * @prop --peek-out: Negative peek size (breakout of container) showing the next/previous slides\n * @prop --gutter: Space between the slides\n * @prop --snap-stop: Snap stop of scroll container\n */\n\n:host {\n  @include spaceCurve(\"--gutter\", \"regular\");\n  --peek: calc(var(--peek-in, 0px) + var(--peek-out, 0px));\n  --peek-in: calc(#{space(\"medium\")} + #{spaceCurveValue(\"regular\")});\n  // --peek-out: #{space('medium')};\n  --padding-top: 0px;\n  --padding-bottom: 0px;\n  --snap-stop: always;\n  --slides: 1;\n  --slide-size: calc(\n    (100% - (var(--slides) - 1) * var(--gutter)) / var(--slides)\n  );\n\n  @include mq($from: small) {\n    --peek-in: calc(\n      #{space(\"xxxlarge\")} + #{spaceCurveValue(\"regular\", \"medium\")}\n    );\n    // --peek-out: #{$containerMarginSmall};\n  }\n\n  @include mq($from: medium) {\n    --peek-in: calc(#{space(\"big\")} + #{spaceCurveValue(\"regular\", \"large\")});\n    // --peek-out: 0px;\n  }\n\n  ::slotted(*) {\n    width: 100%;\n    height: inherit;\n    flex-shrink: 0;\n    scroll-snap-align: start;\n    scroll-snap-stop: var(--snap-stop);\n    transition: opacity $baseTransitionAnimationSpeed;\n\n    [inert] {\n      opacity: 0.5;\n    }\n\n    &:where(stzh-figure[inert]) {\n      --caption-opacity: 0;\n    }\n\n    img {\n      -webkit-user-drag: none;\n      user-drag: none;\n      -ms-user-select: none;\n      -moz-user-select: none;\n      -webkit-user-select: none;\n      user-select: none;\n    }\n  }\n\n  ::slotted([slot=\"actions\"]) {\n    position: absolute;\n    top: 0;\n    left: 0;\n    z-index: 1;\n    pointer-events: none;\n    padding: 0 var(--peek);\n\n    @media print {\n      display: none;\n    }\n\n    stzh-text {\n      width: auto;\n    }\n\n    stzh-button {\n      pointer-events: all;\n    }\n\n    .stzh-carousel-action-previous,\n    .stzh-carousel-action-next {\n      position: absolute;\n      top: 50%;\n      transform: translateY(-50%);\n    }\n\n    .stzh-carousel-action-previous {\n      left: calc((#{space(\"medium\")} + #{spaceCurveValue(\"regular\")}) / -1);\n\n      @include mq($from: small) {\n        left: calc(\n          (#{space(\"xxxlarge\")} + #{spaceCurveValue(\"regular\", \"medium\")}) / -1\n        );\n      }\n\n      @include mq($from: medium) {\n        left: calc(\n          (#{space(\"big\")} + #{spaceCurveValue(\"regular\", \"large\")}) / -1\n        );\n      }\n    }\n\n    .stzh-carousel-action-next {\n      right: calc((#{space(\"medium\")} + #{spaceCurveValue(\"regular\")}) / -1);\n\n      @include mq($from: small) {\n        right: calc(\n          (#{space(\"xxxlarge\")} + #{spaceCurveValue(\"regular\", \"medium\")}) / -1\n        );\n      }\n\n      @include mq($from: medium) {\n        right: calc(\n          (#{space(\"big\")} + #{spaceCurveValue(\"regular\", \"large\")}) / -1\n        );\n      }\n    }\n  }\n\n  ::slotted(stzh-ratio[slot=\"actions\"]) {\n    stzh-space,\n    stzh-hspace,\n    stzh-vspace {\n      padding: space(\"xsmall\");\n    }\n  }\n\n  ::slotted(stzh-ratio[slot=\"actions\"]) {\n    --background-color: transparent;\n  }\n\n  /* Card */\n\n  &[variant=\"cards\"] {\n    @include spaceCurve(\"--gutter\", \"tiny\");\n    --padding-top: 4px;\n    --padding-bottom: 4px;\n\n    @include mq($from: medium) {\n      --peek-out: #{$containerMarginMedium};\n    }\n\n    @include mq($from: large) {\n      --peek-out: #{$containerMarginLarge};\n    }\n\n    @include mq($from: ultra) {\n      --peek-out: calc(\n        (100vw - #{$containerMaxWidth} - var(--stzh-scrollbar-width, 0px)) / 2\n      );\n    }\n  }\n\n  &[variant=\"cards\"] ::slotted([slot=\"actions\"]) {\n    position: absolute;\n    order: 1;\n    margin-top: calc(#{space(\"medium\")} - var(--padding-bottom));\n  }\n\n  /* No peek */\n\n  &[no-peek]:not([no-peek=\"false\"]) {\n    --peek-out: 0px;\n    --peek-in: 0px;\n  }\n}\n\n.stzh-carousel {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  width: calc(100% + var(--peek-out) * 2);\n  margin-left: calc(var(--peek-out) / -1);\n  margin-right: calc(var(--peek-out) / -1);\n\n  &__vhidden {\n    @include visuallyhidden;\n  }\n\n  &__indicator {\n    @include spaceCurve(\"margin-top\", \"regular\");\n    margin-left: auto;\n    margin-right: auto;\n    position: relative;\n    width: 230px;\n    height: 4px;\n    background-color: $colorBlack20op;\n  }\n\n  &__indicator-track {\n    position: absolute;\n    background-color: $colorSecondary50;\n    height: 6px;\n    left: 0px;\n    bottom: 0px;\n    transition-property: left, width;\n    transition-duration: $baseTransitionAnimationSpeed;\n  }\n\n  &__scroll {\n    position: relative;\n    grid-area: slides;\n    display: grid;\n    width: 100%;\n    height: 100%;\n    place-items: center;\n    overflow-x: auto;\n    overflow-y: visible;\n    grid-auto-flow: column;\n    grid-auto-columns: var(--slide-size);\n    grid-auto-rows: 100%;\n    column-gap: var(--gutter);\n    -webkit-overflow-scrolling: touch;\n    scrollbar-width: none;\n    -ms-overflow-style: none;\n    scroll-behavior: smooth;\n    overscroll-behavior-x: contain;\n    scroll-snap-type: x mandatory;\n    scroll-padding: 0 var(--peek);\n    padding: var(--padding-top) var(--peek) var(--padding-bottom);\n\n    @media (prefers-reduced-motion: reduce) {\n      scroll-behavior: auto;\n    }\n\n    &::-webkit-scrollbar {\n      display: none;\n    }\n  }\n\n  &--is-draggable &__scroll {\n    cursor: grab;\n  }\n\n  &--is-dragging &__scroll {\n    cursor: grabbing;\n  }\n\n  &--is-disabled &__scroll {\n    cursor: not-allowed;\n    overflow: hidden;\n  }\n\n  &--is-non-interactive {\n    pointer-events: none;\n    touch-action: none;\n  }\n}\n","import { Component, Host, h, Element, Prop, Method, Event, EventEmitter, Watch, State } from \"@stencil/core\";\n\nimport { StzhCarouselSlideStartEvent, StzhCarouselSlidePassedEvent, StzhCarouselSlideEndEvent } from \"../../index\";\n\nimport { isStzhElement } from \"../../utils/utils\";\nimport { StzhCarouselLocalizedText } from \"./stzh-carousel.localization\";\n\nimport { media, addMediaChangeListener, removeMediaChangeListener } from \"../../utils/media-utils\";\n\nconst reducedMotionMedia = window.matchMedia(\"(prefers-reduced-motion: reduce)\");\n\nlet carouselCounter = 0;\n\n/*\n * Inspired by:\n *\n * - https://github.com/barthy-koeln/scroll-snap-slider\n * - https://tannerhodges.github.io/snap-slider/\n * - https://www.w3.org/WAI/ARIA/apg/patterns/carousel/examples/carousel-1-prev-next/\n * - https://dev.to/jasonwebb/how-to-build-a-more-accessible-carousel-or-slider-35lp\n * - http://web-accessibility.carnegiemuseums.org/code/carousels/\n */\n\n/**\n * @slot - Slot for any element\n * @slot actions - Slot for `stzh-actions` element\n */\n@Component({\n  tag: \"stzh-carousel\",\n  styleUrl: \"stzh-carousel.scss\",\n  scoped: true,\n})\nexport class StzhCarousel {\n  /** Translation strings */\n  @Prop() localization: StzhCarouselLocalizedText;\n\n  /** Carousel variant */\n  @Prop({ reflect: true }) variant: \"default\" | \"cards\" = \"default\";\n\n  /** Whether carousel is disabled */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /** Whether to remove inside/outside peek. */\n  @Prop({ reflect: true }) noPeek: boolean = false;\n\n  /** Slides number */\n  @Prop() slides: number = 1;\n  /** Slides number above small breakpoint */\n  @Prop() slidesSmall: number = 0;\n  /** Slides number above medium breakpoint */\n  @Prop() slidesMedium: number = 0;\n  /** Slides number above large breakpoint */\n  @Prop() slidesLarge: number = 0;\n  /** Slides number above ultra breakpoint */\n  @Prop() slidesUltra: number = 0;\n\n  // /** How many slides per swipe */\n  // @Prop() swipeSlides: number = 1;\n  // /** How many slides per swipe above small breakpoint */\n  // @Prop() swipeSlidesSmall: number = 0;\n  // /** How many slides per swipe above medium breakpoint */\n  // @Prop() swipeSlidesMedium: number = 0;\n  // /** How many slides per swipe above large breakpoint */\n  // @Prop() swipeSlidesLarge: number = 0;\n  // /** How many slides per swipe above ultra breakpoint */\n  // @Prop() swipeSlidesUltra: number = 0;\n\n  /** Active slide (readonly) */\n  @Prop() slide: number = 0;\n\n  /**\n   * Whether autoplay is enabled.\n   * Gets paused, when user has focus inside carousel element or hovers over it.\n   * Also when reduced motion media query is active or carousel is set disabled.\n   * Gets disabled permanently, when user interacts with carousel manually (clicks prev/next, scrolls or drags)\n   */\n  @Prop({ mutable: true }) autoplay: boolean = false;\n\n  /** Timeout delay in milliseconds used for autoplay */\n  @Prop() autoplayTimeout: number = 3000;\n\n  /** Whether scrolling & dragging should be disabled */\n  @Prop() nonInteractive: boolean = false;\n\n  /** Whether drag with mouse should be disabled (still will be able to scroll with wheeling or arrow keys) */\n  @Prop() preventMouseDrag: boolean = false;\n\n  /** Whether autoplay pause should be prevented when user hovers/focuses carousel */\n  @Prop() preventAutoplayPause: boolean = false;\n\n  /** Whether autoplay stop should be prevented when user scroll or drags carousel */\n  @Prop() preventAutoplayStop: boolean = false;\n\n  /**\n   * Enable all slides to be tabbable (will disable prev/next arrows from being tabbable).\n   * By default only the visible slides will be tabbable and the prev/next can be used to change slides\n   * (enabled when `variant` is set to `cards`).\n   */\n  @Prop() tabThrough: boolean = false;\n\n  /** Whether indicator should be shown */\n  @Prop() withTrack: boolean = false;\n\n  /** Timeout delay in milliseconds used to catch the end of scroll events */\n  @State() scrollTimeout: number = 100;\n\n  /** Minimum drag distance that needs to be reached to swipe to next/previous slide(s). */\n  @State() distanceQuickSwipe: number = 40;\n\n  /** Minimum drag distance that neeeds to be reached to prevent click on slide elements. */\n  @State() distancePreventClick: number = 6;\n\n  @Element() element: HTMLStzhCarouselElement;\n\n  /** Slide start event */\n  @Event() stzhSlideStart: EventEmitter<StzhCarouselSlideStartEvent>;\n\n  /** Slide passed event */\n  @Event() stzhSlidePassed: EventEmitter<StzhCarouselSlidePassedEvent>;\n\n  /** Slide end event */\n  @Event() stzhSlideEnd: EventEmitter<StzhCarouselSlideEndEvent>;\n\n  /** Scroll to a slide by index */\n  @Method()\n  async slideTo(index, behaviour: \"auto\" | \"smooth\" = \"smooth\") {\n    this.scrollToSlide(index, behaviour);\n  }\n\n  /** Scroll to previous snap point */\n  @Method()\n  async slideToPrevious(behaviour: \"auto\" | \"smooth\" = \"smooth\") {\n    this.scrollToPreviousSnapPoint(behaviour);\n  }\n\n  /** Scroll to next snap point */\n  @Method()\n  async slideToNext(behaviour: \"auto\" | \"smooth\" = \"smooth\") {\n    this.scrollToNextSnapPoint(behaviour);\n  }\n\n  @Watch(\"disabled\")\n  disabledWatcher() {\n    if (this.disabled) {\n      this.scrollElement && this.scrollElement.removeEventListener(\"scroll\", this.onScroll);\n      this.scrollTimeoutId && window.clearTimeout(this.scrollTimeoutId);\n      this.scrollTimeoutId = null;\n      this.element.removeEventListener(\"mouseenter\", this.onMouseenter);\n      this.element.removeEventListener(\"mouseleave\", this.onMouseleave);\n      this.element.removeEventListener(\"focusin\", this.onFocusin);\n      this.element.removeEventListener(\"focusout\", this.onFocusout);\n      this.onReducedMotionMediaChange();\n      reducedMotionMedia && reducedMotionMedia.removeEventListener(\"change\", this.onReducedMotionMediaChange);\n    } else {\n      this.scrollElement && this.scrollElement.addEventListener(\"scroll\", this.onScroll, { passive: true });\n      this.element.addEventListener(\"mouseenter\", this.onMouseenter);\n      this.element.addEventListener(\"mouseleave\", this.onMouseleave);\n      this.element.addEventListener(\"focusin\", this.onFocusin);\n      this.element.addEventListener(\"focusout\", this.onFocusout);\n      reducedMotionMedia && reducedMotionMedia.addEventListener(\"change\", this.onReducedMotionMediaChange);\n    }\n  }\n\n  @Watch(\"disabled\")\n  @Watch(\"preventMouseDrag\")\n  preventMouseDragWatcher() {\n    if (this.preventMouseDrag || this.disabled) {\n      this.disableTimeoutId && window.clearTimeout(this.disableTimeoutId);\n      this.disableTimeoutId = null;\n      this.scrollElement && this.scrollElement.removeEventListener(\"mousedown\", this.startDragging);\n      this.lastX = null;\n    } else {\n      this.scrollElement && this.scrollElement.addEventListener(\"mousedown\", this.startDragging);\n    }\n  }\n\n  @Watch(\"autoplay\")\n  @Watch(\"autoplayDisabledByMotionMedia\")\n  @Watch(\"autoplayDisabledByMouse\")\n  @Watch(\"autoplayDisabledByFocus\")\n  @Watch(\"autoplayDisabledByScroll\")\n  @Watch(\"autoplayDisabledByDrag\")\n  @Watch(\"autoplayTimeout\")\n  @Watch(\"disabled\")\n  autoplayRunningWatcher() {\n    if (\n      !this.autoplay ||\n      this.disabled ||\n      this.autoplayDisabledByMotionMedia ||\n      this.autoplayDisabledByMouse ||\n      this.autoplayDisabledByFocus ||\n      this.autoplayDisabledByScroll ||\n      this.autoplayDisabledByDrag\n    ) {\n      this.autoplayIntervalId && window.clearInterval(this.autoplayIntervalId);\n      this.autoplayIntervalId = null;\n      this.autoplayRunning = false;\n    } else {\n      this.autoplayIntervalId && window.clearInterval(this.autoplayIntervalId);\n      this.autoplayIntervalId = window.setInterval(this.autoplayInterval, this.autoplayTimeout);\n      this.autoplayRunning = true;\n    }\n  }\n\n  @Watch(\"slideElements\")\n  @Watch(\"currentSwipeSlides\")\n  snapAlignWatcher() {\n    this.slideElements.forEach((slide, index) => {\n      const shouldSnap = (index - this.currentSwipeSlides) % this.currentSwipeSlides === 0;\n\n      if (shouldSnap) {\n        slide.style.removeProperty(\"scroll-snap-align\");\n      } else {\n        slide.style.setProperty(\"scroll-snap-align\", \"none\");\n      }\n    });\n  }\n\n  @Watch(\"slide\")\n  @Watch(\"variant\")\n  @Watch(\"slideElements\")\n  @Watch(\"currentSlides\")\n  @Watch(\"tabThrough\")\n  inertWatcher() {\n    this.slideElements.forEach((slide, index) => {\n      const isActive =\n        this.tabThrough || this.variant === \"cards\" || (index >= this.slide && index < this.slide + this.currentSlides);\n\n      slide.inert = !isActive;\n\n      if (isActive) {\n        slide.removeAttribute(\"aria-hidden\");\n      } else {\n        slide.setAttribute(\"aria-hidden\", isActive ? \"false\" : \"true\");\n      }\n    });\n  }\n\n  @Watch(\"variant\")\n  @Watch(\"tabThrough\")\n  @Watch(\"nextElements\")\n  @Watch(\"previousElements\")\n  prevNextNavigationWatcher() {\n    const tabThrough = this.tabThrough || this.variant === \"cards\";\n\n    const setAriaAttributes = element => {\n      const isStzh = isStzhElement(element);\n\n      if (tabThrough) {\n        element.setAttribute(\"aria-hidden\", \"true\");\n        element.setAttribute(isStzh ? \"a11y-tabindex\" : \"tabindex\", \"-1\");\n      } else {\n        element.removeAttribute(\"aria-hidden\");\n        element.removeAttribute(isStzh ? \"a11y-tabindex\" : \"tabindex\");\n      }\n    };\n\n    this.nextElements.forEach(setAriaAttributes);\n    this.previousElements.forEach(setAriaAttributes);\n  }\n\n  @Watch(\"currentSlides\")\n  @Watch(\"slideElements\")\n  @Watch(\"nextElements\")\n  @Watch(\"previousElements\")\n  @Watch(\"navigationTextElements\")\n  prevNextHiddenWatcher() {\n    const hideElements = this.slideElements.length <= this.currentSlides;\n\n    const setHiddenAttribute = element => {\n      if (hideElements) {\n        element.setAttribute(\"hidden\", \"\");\n      } else {\n        element.removeAttribute(\"hidden\");\n      }\n    };\n\n    this.navigationTextElements.forEach(setHiddenAttribute);\n    this.nextElements.forEach(setHiddenAttribute);\n    this.previousElements.forEach(setHiddenAttribute);\n  }\n\n  @Watch(\"disabled\")\n  @Watch(\"slide\")\n  @Watch(\"currentSlides\")\n  @Watch(\"slideElements\")\n  @Watch(\"nextElements\")\n  @Watch(\"previousElements\")\n  nextPrevDisabledWatcher() {\n    if (!this.scrollElement) {\n      return;\n    }\n\n    const reachedFirstSlide = this.slide === 0;\n    const reachedLastSlide = this.hasReachedLastSlide();\n\n    this.nextElements.forEach(element => {\n      const isStzh = isStzhElement(element);\n      element.setAttribute(\n        isStzh ? \"a11y-disabled\" : \"aria-disabled\",\n        reachedLastSlide || this.disabled ? \"true\" : \"false\",\n      );\n    });\n\n    this.previousElements.forEach(element => {\n      const isStzh = isStzhElement(element);\n      element.setAttribute(\n        isStzh ? \"a11y-disabled\" : \"aria-disabled\",\n        reachedFirstSlide || this.disabled ? \"true\" : \"false\",\n      );\n    });\n  }\n\n  @Watch(\"nextElements\")\n  nextElementsWatcher() {\n    this.nextElements.forEach(nextElement => {\n      const isStzh = isStzhElement(nextElement);\n\n      nextElement.addEventListener(\"click\", this.onNextClick);\n      nextElement.setAttribute(isStzh ? \"a11y-controls\" : \"aria-controls\", `${this.carouselId}-scroll`);\n    });\n  }\n\n  @Watch(\"previousElements\")\n  previousElementsWatcher() {\n    this.previousElements.forEach(previousElement => {\n      const isStzh = isStzhElement(previousElement);\n\n      previousElement.addEventListener(\"click\", this.onPreviousClick);\n      previousElement.setAttribute(isStzh ? \"a11y-controls\" : \"aria-controls\", `${this.carouselId}-scroll`);\n    });\n  }\n\n  /** Whether autoplay is currently running */\n  @State() autoplayRunning: boolean = false;\n\n  /** Whether autoplay is currently disabled by reduced motion media */\n  @State() autoplayDisabledByMotionMedia: boolean = false;\n\n  /** Whether autoplay is currently disabled by mouse */\n  @State() autoplayDisabledByMouse: boolean = false;\n\n  /** Whether autoplay is currently disabled by focus */\n  @State() autoplayDisabledByFocus: boolean = false;\n\n  /** Whether autoplay is currently disabled by scroll */\n  @State() autoplayDisabledByScroll: boolean = false;\n\n  /** Whether autoplay is currently disabled by drag */\n  @State() autoplayDisabledByDrag: boolean = false;\n\n  /** Whether user is currently dragging with mouse */\n  @State() dragging: boolean = false;\n\n  /** Whether user is currently scrolling */\n  @State() scrolling: boolean = false;\n\n  /** Aria live text */\n  @State() ariaLive: string = \"\";\n\n  /** Currently shown slides */\n  @State() currentSlides: number = 1;\n\n  /** How many slides should be moved currently */\n  @State() currentSwipeSlides: number = 1;\n\n  /** Slide elements */\n  @State() slideElements: HTMLElement[] = [];\n\n  /** Previous elements */\n  @State() previousElements: HTMLElement[] = [];\n\n  /** Next elements */\n  @State() nextElements: HTMLElement[] = [];\n\n  /** Navigation text elements */\n  @State() navigationTextElements: HTMLElement[] = [];\n\n  private scrollElement: HTMLElement;\n\n  /** Unique generated id */\n  private carouselId: string;\n\n  /** Current scroll position */\n  private slideScrollLeft: number = 0;\n\n  /** Flag whether scrolling was done by user or not */\n  private scrolledByAutoplay: boolean = false;\n\n  /** Timeout ID used to catch the end of scroll events */\n  private scrollTimeoutId: number = null;\n\n  /** Interval ID for autoplay */\n  private autoplayIntervalId: number;\n\n  /** Last drag event position */\n  private lastX: number = null;\n\n  /** Where the dragging started */\n  private startX: number = null;\n\n  /** Where the dragging started scroll position */\n  private startScrollLeft: number = null;\n\n  /** Timeout ID for a smooth drag release */\n  private disableTimeoutId: number = null;\n\n  /** Calculated size of a single item */\n  private itemSize: number;\n\n  /** Resize observer used to update item size */\n  private resizeObserver: ResizeObserver;\n\n  /** Mutation observer used to keep track of slides */\n  private mutationObserver: MutationObserver;\n\n  /** Whether user has just stopped dragging */\n  private stoppedDragging: boolean = false;\n\n  private scrollToSlide(index, behaviour: \"auto\" | \"smooth\" = \"smooth\") {\n    if (this.disabled) {\n      return;\n    }\n\n    this.scrollElement.scrollTo({\n      left: index * this.itemSize,\n      behavior: reducedMotionMedia.matches ? \"auto\" : behaviour,\n    });\n  }\n\n  /** Width of a slide  */\n  private sizingMethod() {\n    const css = window.getComputedStyle(this.scrollElement);\n\n    return (\n      ((this.scrollElement.firstElementChild as HTMLElement) || this.scrollElement).offsetWidth +\n      parseInt(css.getPropertyValue(\"column-gap\"), 10)\n    );\n  }\n\n  /**\n   * Calculates the active slide.\n   * The scroll-snap-type property makes sure that the container snaps perfectly to integer multiples.\n   */\n  private calculateSlide() {\n    // Math.round: Dispatch 'stzhSlidePassed' events around the center of each slide\n    // Math.ceil: Dispatch 'stzhSlidePassed' events as soon as the next one is visible\n    // Math.floor: Dispatch 'stzhSlidePassed' events only when the next one is fully visible\n    return Math.round(this.scrollElement.scrollLeft / this.itemSize);\n  }\n\n  private scrollToPreviousSnapPoint(behaviour: \"auto\" | \"smooth\" = \"smooth\") {\n    if (this.disabled) {\n      return;\n    }\n\n    let previousIndex = this.slide;\n    let canSnap = false;\n\n    while (!canSnap && previousIndex > 0) {\n      previousIndex = previousIndex - 1;\n      canSnap = (previousIndex - this.currentSwipeSlides) % this.currentSwipeSlides === 0;\n    }\n\n    this.slideTo(previousIndex, behaviour);\n  }\n\n  private scrollToNextSnapPoint(behaviour: \"auto\" | \"smooth\" = \"smooth\") {\n    if (this.disabled) {\n      return;\n    }\n\n    this.slideTo(this.slide + this.currentSwipeSlides, behaviour);\n  }\n\n  private update() {\n    this.slide = this.calculateSlide();\n    this.slideScrollLeft = this.slide * this.itemSize;\n\n    this.onMutation();\n  }\n\n  private hasReachedLastSlide() {\n    const { scrollLeft, offsetWidth, scrollWidth } = this.scrollElement;\n    return Math.ceil(scrollLeft + offsetWidth) >= scrollWidth;\n  }\n\n  private onReducedMotionMediaChange = () => {\n    this.autoplayDisabledByMotionMedia = reducedMotionMedia.matches;\n  };\n\n  private onMouseenter = () => {\n    if (!this.preventAutoplayPause) {\n      this.autoplayDisabledByMouse = true;\n    }\n  };\n\n  private onMouseleave = () => {\n    this.autoplayDisabledByMouse = false;\n  };\n\n  private onFocusin = () => {\n    if (!this.preventAutoplayPause) {\n      this.autoplayDisabledByFocus = true;\n    }\n  };\n\n  private onFocusout = () => {\n    this.autoplayDisabledByFocus = false;\n  };\n\n  private onPreviousClick = () => {\n    this.scrollToPreviousSnapPoint();\n  };\n\n  private onNextClick = () => {\n    this.scrollToNextSnapPoint();\n  };\n\n  private onSlideResize = () => {\n    if (this.scrollElement) {\n      this.itemSize = this.sizingMethod();\n    }\n  };\n\n  private onMutation = () => {\n    if (!this.scrollElement) {\n      return;\n    }\n\n    this.slideElements = Array.from(this.scrollElement.children) as HTMLElement[];\n\n    this.slideElements.forEach((slide, index) => {\n      slide.setAttribute(\"role\", \"group\");\n      slide.setAttribute(\"aria-roledescription\", \"slide\");\n      slide.setAttribute(\n        \"aria-label\",\n        this.localization.slideLabel\n          .replace(/\\{current\\}/gi, (index + 1).toString())\n          .replace(/\\{total\\}/gi, this.slideElements.length.toString()),\n      );\n    });\n\n    this.previousElements = Array.from(this.element.querySelectorAll(\"[data-stzh-carousel-previous]\"));\n    this.nextElements = Array.from(this.element.querySelectorAll(\"[data-stzh-carousel-next]\"));\n    this.navigationTextElements = Array.from(this.element.querySelectorAll(\"[data-stzh-carousel-navigation-text]\"));\n  };\n\n  private onScroll = () => {\n    if (this.scrollTimeoutId === null) {\n      const direction = this.scrollElement.scrollLeft > this.slideScrollLeft ? 1 : -1;\n\n      this.scrolling = true;\n\n      if (!this.scrolledByAutoplay) {\n        if (this.preventAutoplayStop) {\n          this.autoplayDisabledByScroll = true;\n        } else {\n          this.autoplay = false;\n        }\n      }\n\n      this.stzhSlideStart.emit({\n        component: \"stzh-carousel\",\n        index: this.slide + direction,\n      });\n    }\n\n    if (this.slide !== this.calculateSlide()) {\n      this.update();\n      this.stzhSlidePassed.emit({\n        component: \"stzh-carousel\",\n        index: this.slide,\n      });\n    }\n\n    this.scrollTimeoutId && window.clearTimeout(this.scrollTimeoutId);\n    this.scrollTimeoutId = window.setTimeout(this.onScrollEnd, this.scrollTimeout);\n  };\n\n  private onScrollEnd = () => {\n    this.scrollTimeoutId = null;\n    this.update();\n\n    this.scrolling = false;\n    this.scrolledByAutoplay = false;\n    this.autoplayDisabledByScroll = false;\n\n    if (this.stoppedDragging) {\n      this.stoppedDragging = false;\n      this.scrollElement.style.removeProperty(\"scroll-behavior\");\n      this.scrollElement.style.removeProperty(\"scroll-snap-type\");\n    }\n\n    if (this.tabThrough || this.variant === \"cards\") {\n      this.ariaLive = \"\";\n    } else {\n      this.ariaLive = (this.currentSlides > 1 ? this.localization.slidesLabel : this.localization.slideLabel)\n        .replace(/\\{(current|from)\\}/gi, (this.slide + 1).toString())\n        .replace(/\\{to\\}/gi, (this.slide + this.currentSlides).toString())\n        .replace(/\\{total\\}/gi, this.slideElements.length.toString());\n    }\n\n    this.stzhSlideEnd.emit({\n      component: \"stzh-carousel\",\n      index: this.slide,\n    });\n  };\n\n  private onMediaChange = () => {\n    const ultra = media(\"ultra\").matches;\n    const large = media(\"large\").matches;\n    const medium = media(\"medium\").matches;\n    const small = media(\"small\").matches;\n\n    if (ultra && this.slidesUltra !== 0) {\n      this.currentSlides = this.slidesUltra;\n    } else if (large && this.slidesLarge !== 0) {\n      this.currentSlides = this.slidesLarge;\n    } else if (medium && this.slidesMedium !== 0) {\n      this.currentSlides = this.slidesMedium;\n    } else if (small && this.slidesSmall !== 0) {\n      this.currentSlides = this.slidesSmall;\n    } else {\n      this.currentSlides = this.slides;\n    }\n\n    // if (ultra && this.swipeSlidesUltra !== 0) {\n    //   this.currentSwipeSlides = this.swipeSlidesUltra;\n    // } else if (large && this.swipeSlidesLarge !== 0) {\n    //   this.currentSwipeSlides = this.swipeSlidesLarge;\n    // } else if (medium && this.swipeSlidesMedium !== 0) {\n    //   this.currentSwipeSlides = this.swipeSlidesMedium;\n    // } else if (small && this.swipeSlidesSmall !== 0) {\n    //   this.currentSwipeSlides = this.swipeSlidesSmall;\n    // } else {\n    //   this.currentSwipeSlides = this.swipeSlides;\n    // }\n\n    this.currentSwipeSlides = this.currentSlides;\n  };\n\n  /** Scroll the slider the appropriate amount of pixels and update the last event position */\n  private mouseMove = (event: MouseEvent) => {\n    const distance = this.lastX - event.clientX;\n    this.lastX = event.clientX;\n\n    this.scrollElement.scrollLeft += distance;\n  };\n\n  /** Clear disable timeout, set up variables and styles and attach the listener. */\n  private startDragging = (event: MouseEvent) => {\n    event.preventDefault();\n\n    this.disableTimeoutId && window.clearTimeout(this.disableTimeoutId);\n    this.disableTimeoutId = null;\n\n    this.startX = this.lastX = event.clientX;\n    this.startScrollLeft = this.scrollElement.scrollLeft;\n    this.scrollElement.style.setProperty(\"scroll-behavior\", \"auto\");\n    this.scrollElement.style.setProperty(\"scroll-snap-type\", \"unset\");\n\n    this.dragging = true;\n\n    if (this.preventAutoplayStop) {\n      this.autoplayDisabledByDrag = true;\n    } else {\n      this.autoplay = false;\n    }\n\n    window.addEventListener(\"mousemove\", this.mouseMove);\n    window.addEventListener(\"mouseup\", this.stopDragging, { capture: true });\n    window.addEventListener(\"click\", this.checkClick, { capture: true });\n  };\n\n  /** User stopped dragging */\n  private stopDragging = (event: MouseEvent) => {\n    event.preventDefault();\n\n    const distance = Math.abs(this.startX - this.lastX);\n    const minimumReached = distance > this.distanceQuickSwipe;\n    const direction = this.lastX > this.startX ? 1 : -1;\n\n    this.dragging = false;\n    this.autoplayDisabledByDrag = false;\n\n    const endDraddingLeft = this.scrollElement.scrollLeft;\n\n    this.scrollElement.style.removeProperty(\"scroll-snap-type\");\n    const finalLeft = this.scrollElement.scrollLeft;\n\n    this.scrollElement.style.setProperty(\"scroll-snap-type\", \"unset\");\n    this.scrollElement.scrollTo({ left: endDraddingLeft, behavior: \"auto\" });\n\n    if (finalLeft !== this.startScrollLeft || !minimumReached) {\n      this.scrollElement.scrollTo({ left: finalLeft, behavior: reducedMotionMedia.matches ? \"auto\" : \"smooth\" });\n    } else if (direction === 1) {\n      this.slideToPrevious();\n    } else {\n      this.slideToNext();\n    }\n\n    window.removeEventListener(\"mousemove\", this.mouseMove);\n    window.removeEventListener(\"mouseup\", this.stopDragging, { capture: true });\n\n    this.stoppedDragging = true;\n  };\n\n  private checkClick = (event: MouseEvent) => {\n    const distance = Math.abs(this.startX - this.lastX);\n    const minimumReached = distance > this.distancePreventClick;\n\n    if (minimumReached) {\n      event.preventDefault();\n      event.stopPropagation();\n    }\n\n    this.lastX = null;\n\n    window.removeEventListener(\"click\", this.checkClick, { capture: true });\n  };\n\n  private autoplayInterval = () => {\n    this.scrolledByAutoplay = true;\n\n    if (this.hasReachedLastSlide()) {\n      this.slideTo(0);\n    } else {\n      this.slideToNext();\n    }\n  };\n\n  async componentWillLoad() {\n    this.carouselId = `stzh-carousel-${carouselCounter++}`;\n    this.onMediaChange();\n\n    if (!this.localization) {\n      this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"carousel\");\n    }\n  }\n\n  componentDidLoad() {\n    this.itemSize = this.sizingMethod();\n    this.update();\n\n    this.disabledWatcher();\n    this.preventMouseDragWatcher();\n    this.autoplayRunningWatcher();\n  }\n\n  connectedCallback() {\n    addMediaChangeListener(this.onMediaChange);\n\n    this.resizeObserver = new ResizeObserver(this.onSlideResize);\n    this.resizeObserver.observe(this.element);\n\n    this.mutationObserver = new MutationObserver(this.onMutation);\n    this.mutationObserver.observe(this.element, {\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    this.scrollTimeoutId && window.clearTimeout(this.scrollTimeoutId);\n    this.scrollTimeoutId = null;\n\n    removeMediaChangeListener(this.onMediaChange);\n\n    if (this.resizeObserver) {\n      this.resizeObserver.disconnect();\n    }\n\n    if (this.mutationObserver) {\n      this.mutationObserver.disconnect();\n    }\n  }\n\n  render() {\n    const classes = {\n      \"stzh-carousel\": true,\n      \"stzh-carousel--is-disabled\": this.disabled,\n      \"stzh-carousel--is-draggable\": !this.preventMouseDrag,\n      \"stzh-carousel--is-non-interactive\": this.nonInteractive,\n      \"stzh-carousel--is-dragging\": this.dragging,\n      \"stzh-carousel--is-scrolling\": this.scrolling,\n      \"stzh-carousel--has-autoplay\": this.autoplay,\n      \"stzh-carousel--is-autoplay-running\": this.autoplayRunning,\n    };\n\n    return (\n      <Host\n        aria-roledescription=\"carousel\"\n        style={{\n          \"--slides\": this.currentSlides.toString(),\n        }}\n      >\n        <div class={classes}>\n          <slot name=\"actions\"></slot>\n          <div\n            class=\"stzh-carousel__vhidden\"\n            aria-live={this.autoplayDisabledByFocus || this.autoplayDisabledByMouse ? \"polite\" : \"off\"}\n          >\n            {this.ariaLive}\n          </div>\n          <div\n            ref={el => (this.scrollElement = el as HTMLDivElement)}\n            id={`${this.carouselId}-scroll`}\n            class=\"stzh-carousel__scroll\"\n          >\n            <slot></slot>\n          </div>\n          {this.withTrack && (\n            <div class=\"stzh-carousel__indicator\">\n              <div\n                class=\"stzh-carousel__indicator-track\"\n                style={{\n                  left: `${(100 / (this.slideElements?.length || 1)) * this.slide}%`,\n                  width: `${(100 / (this.slideElements?.length || 1)) * this.currentSlides || 0}%`,\n                }}\n              ></div>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-e3182412.js","mappings":"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","names":[],"sources":["src/components/stzh-carousel/stzh-carousel.scss?tag=stzh-carousel&encapsulation=scoped","src/components/stzh-carousel/stzh-carousel.tsx"],"sourcesContent":["/**\n * @prop --padding-top: Padding Top of scroll container\n * @prop --padding-bottom: Padding Bottom of scroll container\n * @prop --peek-in: Peek size (inside container) showing the next/previous slides\n * @prop --peek-out: Negative peek size (breakout of container) showing the next/previous slides\n * @prop --gutter: Space between the slides\n * @prop --snap-stop: Snap stop of scroll container\n */\n\n:host {\n  @include spaceCurve(\"--gutter\", \"regular\");\n  --peek: calc(var(--peek-in, 0px) + var(--peek-out, 0px));\n  --peek-in: calc(#{space(\"medium\")} + #{spaceCurveValue(\"regular\")});\n  // --peek-out: #{space('medium')};\n  --padding-top: 0px;\n  --padding-bottom: 0px;\n  --snap-stop: always;\n  --slides: 1;\n  --slide-size: calc(\n    (100% - (var(--slides) - 1) * var(--gutter)) / var(--slides)\n  );\n\n  @include mq($from: small) {\n    --peek-in: calc(\n      #{space(\"xxxlarge\")} + #{spaceCurveValue(\"regular\", \"medium\")}\n    );\n    // --peek-out: #{$containerMarginSmall};\n  }\n\n  @include mq($from: medium) {\n    --peek-in: calc(#{space(\"big\")} + #{spaceCurveValue(\"regular\", \"large\")});\n    // --peek-out: 0px;\n  }\n\n  ::slotted(*) {\n    width: 100%;\n    height: inherit;\n    flex-shrink: 0;\n    scroll-snap-align: start;\n    scroll-snap-stop: var(--snap-stop);\n    transition: opacity $baseTransitionAnimationSpeed;\n\n    [inert] {\n      opacity: 0.5;\n    }\n\n    &:where(stzh-figure[inert]) {\n      --caption-opacity: 0;\n    }\n\n    img {\n      -webkit-user-drag: none;\n      user-drag: none;\n      -ms-user-select: none;\n      -moz-user-select: none;\n      -webkit-user-select: none;\n      user-select: none;\n    }\n  }\n\n  ::slotted([slot=\"actions\"]) {\n    position: absolute;\n    top: 0;\n    left: 0;\n    z-index: 1;\n    pointer-events: none;\n    padding: 0 var(--peek);\n\n    @media print {\n      display: none;\n    }\n\n    stzh-text {\n      width: auto;\n    }\n\n    stzh-button {\n      pointer-events: all;\n    }\n\n    .stzh-carousel-action-previous,\n    .stzh-carousel-action-next {\n      position: absolute;\n      top: 50%;\n      transform: translateY(-50%);\n    }\n\n    .stzh-carousel-action-previous {\n      left: calc((#{space(\"medium\")} + #{spaceCurveValue(\"regular\")}) / -1);\n\n      @include mq($from: small) {\n        left: calc(\n          (#{space(\"xxxlarge\")} + #{spaceCurveValue(\"regular\", \"medium\")}) / -1\n        );\n      }\n\n      @include mq($from: medium) {\n        left: calc(\n          (#{space(\"big\")} + #{spaceCurveValue(\"regular\", \"large\")}) / -1\n        );\n      }\n    }\n\n    .stzh-carousel-action-next {\n      right: calc((#{space(\"medium\")} + #{spaceCurveValue(\"regular\")}) / -1);\n\n      @include mq($from: small) {\n        right: calc(\n          (#{space(\"xxxlarge\")} + #{spaceCurveValue(\"regular\", \"medium\")}) / -1\n        );\n      }\n\n      @include mq($from: medium) {\n        right: calc(\n          (#{space(\"big\")} + #{spaceCurveValue(\"regular\", \"large\")}) / -1\n        );\n      }\n    }\n  }\n\n  ::slotted(stzh-ratio[slot=\"actions\"]) {\n    stzh-space,\n    stzh-hspace,\n    stzh-vspace {\n      padding: space(\"xsmall\");\n    }\n  }\n\n  ::slotted(stzh-ratio[slot=\"actions\"]) {\n    --background-color: transparent;\n  }\n\n  /* Card */\n\n  &[variant=\"cards\"] {\n    @include spaceCurve(\"--gutter\", \"tiny\");\n    --padding-top: 4px;\n    --padding-bottom: 4px;\n\n    @include mq($from: medium) {\n      --peek-out: #{$containerMarginMedium};\n    }\n\n    @include mq($from: large) {\n      --peek-out: #{$containerMarginLarge};\n    }\n\n    @include mq($from: ultra) {\n      --peek-out: calc(\n        (100vw - #{$containerMaxWidth} - var(--stzh-scrollbar-width, 0px)) / 2\n      );\n    }\n  }\n\n  &[variant=\"cards\"] ::slotted([slot=\"actions\"]) {\n    position: absolute;\n    order: 1;\n    margin-top: calc(#{space(\"medium\")} - var(--padding-bottom));\n  }\n\n  /* No peek */\n\n  &[no-peek]:not([no-peek=\"false\"]) {\n    --peek-out: 0px;\n    --peek-in: 0px;\n  }\n}\n\n.stzh-carousel {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  width: calc(100% + var(--peek-out) * 2);\n  margin-left: calc(var(--peek-out) / -1);\n  margin-right: calc(var(--peek-out) / -1);\n\n  &__vhidden {\n    @include visuallyhidden;\n  }\n\n  &__indicator {\n    @include spaceCurve(\"margin-top\", \"regular\");\n    margin-left: auto;\n    margin-right: auto;\n    position: relative;\n    width: 230px;\n    height: 4px;\n    background-color: $colorBlack20op;\n  }\n\n  &__indicator-track {\n    position: absolute;\n    background-color: $colorSecondary50;\n    height: 6px;\n    left: 0px;\n    bottom: 0px;\n    transition-property: left, width;\n    transition-duration: $baseTransitionAnimationSpeed;\n  }\n\n  &__scroll {\n    position: relative;\n    grid-area: slides;\n    display: grid;\n    width: 100%;\n    height: 100%;\n    place-items: center;\n    overflow-x: auto;\n    overflow-y: visible;\n    grid-auto-flow: column;\n    grid-auto-columns: var(--slide-size);\n    grid-auto-rows: 100%;\n    column-gap: var(--gutter);\n    -webkit-overflow-scrolling: touch;\n    scrollbar-width: none;\n    -ms-overflow-style: none;\n    scroll-behavior: smooth;\n    overscroll-behavior-x: contain;\n    scroll-snap-type: x mandatory;\n    scroll-padding: 0 var(--peek);\n    padding: var(--padding-top) var(--peek) var(--padding-bottom);\n\n    @media (prefers-reduced-motion: reduce) {\n      scroll-behavior: auto;\n    }\n\n    &::-webkit-scrollbar {\n      display: none;\n    }\n  }\n\n  &--is-draggable &__scroll {\n    cursor: grab;\n  }\n\n  &--is-dragging &__scroll {\n    cursor: grabbing;\n  }\n\n  &--is-disabled &__scroll {\n    cursor: not-allowed;\n    overflow: hidden;\n  }\n\n  &--is-non-interactive {\n    pointer-events: none;\n    touch-action: none;\n  }\n}\n","import { Component, Host, h, Element, Prop, Method, Event, EventEmitter, Watch, State } from \"@stencil/core\";\n\nimport { StzhCarouselSlideStartEvent, StzhCarouselSlidePassedEvent, StzhCarouselSlideEndEvent } from \"../../index\";\n\nimport { isStzhElement } from \"../../utils/utils\";\nimport { StzhCarouselLocalizedText } from \"./stzh-carousel.localization\";\n\nimport { media, addMediaChangeListener, removeMediaChangeListener } from \"../../utils/media-utils\";\n\nconst reducedMotionMedia = window.matchMedia(\"(prefers-reduced-motion: reduce)\");\n\nlet carouselCounter = 0;\n\n/*\n * Inspired by:\n *\n * - https://github.com/barthy-koeln/scroll-snap-slider\n * - https://tannerhodges.github.io/snap-slider/\n * - https://www.w3.org/WAI/ARIA/apg/patterns/carousel/examples/carousel-1-prev-next/\n * - https://dev.to/jasonwebb/how-to-build-a-more-accessible-carousel-or-slider-35lp\n * - http://web-accessibility.carnegiemuseums.org/code/carousels/\n */\n\n/**\n * @slot - Slot for any element\n * @slot actions - Slot for `stzh-actions` element\n */\n@Component({\n  tag: \"stzh-carousel\",\n  styleUrl: \"stzh-carousel.scss\",\n  scoped: true,\n})\nexport class StzhCarousel {\n  /** Translation strings */\n  @Prop() localization: StzhCarouselLocalizedText;\n\n  /** Carousel variant */\n  @Prop({ reflect: true }) variant: \"default\" | \"cards\" = \"default\";\n\n  /** Whether carousel is disabled */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /** Whether to remove inside/outside peek. */\n  @Prop({ reflect: true }) noPeek: boolean = false;\n\n  /** Slides number */\n  @Prop() slides: number = 1;\n  /** Slides number above small breakpoint */\n  @Prop() slidesSmall: number = 0;\n  /** Slides number above medium breakpoint */\n  @Prop() slidesMedium: number = 0;\n  /** Slides number above large breakpoint */\n  @Prop() slidesLarge: number = 0;\n  /** Slides number above ultra breakpoint */\n  @Prop() slidesUltra: number = 0;\n\n  // /** How many slides per swipe */\n  // @Prop() swipeSlides: number = 1;\n  // /** How many slides per swipe above small breakpoint */\n  // @Prop() swipeSlidesSmall: number = 0;\n  // /** How many slides per swipe above medium breakpoint */\n  // @Prop() swipeSlidesMedium: number = 0;\n  // /** How many slides per swipe above large breakpoint */\n  // @Prop() swipeSlidesLarge: number = 0;\n  // /** How many slides per swipe above ultra breakpoint */\n  // @Prop() swipeSlidesUltra: number = 0;\n\n  /** Active slide (readonly) */\n  @Prop() slide: number = 0;\n\n  /**\n   * Whether autoplay is enabled.\n   * Gets paused, when user has focus inside carousel element or hovers over it.\n   * Also when reduced motion media query is active or carousel is set disabled.\n   * Gets disabled permanently, when user interacts with carousel manually (clicks prev/next, scrolls or drags)\n   */\n  @Prop({ mutable: true }) autoplay: boolean = false;\n\n  /** Timeout delay in milliseconds used for autoplay */\n  @Prop() autoplayTimeout: number = 3000;\n\n  /** Whether scrolling & dragging should be disabled */\n  @Prop() nonInteractive: boolean = false;\n\n  /** Whether drag with mouse should be disabled (still will be able to scroll with wheeling or arrow keys) */\n  @Prop() preventMouseDrag: boolean = false;\n\n  /** Whether autoplay pause should be prevented when user hovers/focuses carousel */\n  @Prop() preventAutoplayPause: boolean = false;\n\n  /** Whether autoplay stop should be prevented when user scroll or drags carousel */\n  @Prop() preventAutoplayStop: boolean = false;\n\n  /**\n   * Enable all slides to be tabbable (will disable prev/next arrows from being tabbable).\n   * By default only the visible slides will be tabbable and the prev/next can be used to change slides\n   * (enabled when `variant` is set to `cards`).\n   */\n  @Prop() tabThrough: boolean = false;\n\n  /** Whether indicator should be shown */\n  @Prop() withTrack: boolean = false;\n\n  /** Timeout delay in milliseconds used to catch the end of scroll events */\n  @State() scrollTimeout: number = 100;\n\n  /** Minimum drag distance that needs to be reached to swipe to next/previous slide(s). */\n  @State() distanceQuickSwipe: number = 40;\n\n  /** Minimum drag distance that neeeds to be reached to prevent click on slide elements. */\n  @State() distancePreventClick: number = 6;\n\n  @Element() element: HTMLStzhCarouselElement;\n\n  /** Slide start event */\n  @Event() stzhSlideStart: EventEmitter<StzhCarouselSlideStartEvent>;\n\n  /** Slide passed event */\n  @Event() stzhSlidePassed: EventEmitter<StzhCarouselSlidePassedEvent>;\n\n  /** Slide end event */\n  @Event() stzhSlideEnd: EventEmitter<StzhCarouselSlideEndEvent>;\n\n  /** Scroll to a slide by index */\n  @Method()\n  async slideTo(index, behaviour: \"auto\" | \"smooth\" = \"smooth\") {\n    this.scrollToSlide(index, behaviour);\n  }\n\n  /** Scroll to previous snap point */\n  @Method()\n  async slideToPrevious(behaviour: \"auto\" | \"smooth\" = \"smooth\") {\n    this.scrollToPreviousSnapPoint(behaviour);\n  }\n\n  /** Scroll to next snap point */\n  @Method()\n  async slideToNext(behaviour: \"auto\" | \"smooth\" = \"smooth\") {\n    this.scrollToNextSnapPoint(behaviour);\n  }\n\n  @Watch(\"disabled\")\n  disabledWatcher() {\n    if (this.disabled) {\n      this.scrollElement && this.scrollElement.removeEventListener(\"scroll\", this.onScroll);\n      this.scrollTimeoutId && window.clearTimeout(this.scrollTimeoutId);\n      this.scrollTimeoutId = null;\n      this.element.removeEventListener(\"mouseenter\", this.onMouseenter);\n      this.element.removeEventListener(\"mouseleave\", this.onMouseleave);\n      this.element.removeEventListener(\"focusin\", this.onFocusin);\n      this.element.removeEventListener(\"focusout\", this.onFocusout);\n      this.onReducedMotionMediaChange();\n      reducedMotionMedia && reducedMotionMedia.removeEventListener(\"change\", this.onReducedMotionMediaChange);\n    } else {\n      this.scrollElement && this.scrollElement.addEventListener(\"scroll\", this.onScroll, { passive: true });\n      this.element.addEventListener(\"mouseenter\", this.onMouseenter);\n      this.element.addEventListener(\"mouseleave\", this.onMouseleave);\n      this.element.addEventListener(\"focusin\", this.onFocusin);\n      this.element.addEventListener(\"focusout\", this.onFocusout);\n      reducedMotionMedia && reducedMotionMedia.addEventListener(\"change\", this.onReducedMotionMediaChange);\n    }\n  }\n\n  @Watch(\"disabled\")\n  @Watch(\"preventMouseDrag\")\n  preventMouseDragWatcher() {\n    if (this.preventMouseDrag || this.disabled) {\n      this.disableTimeoutId && window.clearTimeout(this.disableTimeoutId);\n      this.disableTimeoutId = null;\n      this.scrollElement && this.scrollElement.removeEventListener(\"mousedown\", this.startDragging);\n      this.lastX = null;\n    } else {\n      this.scrollElement && this.scrollElement.addEventListener(\"mousedown\", this.startDragging);\n    }\n  }\n\n  @Watch(\"autoplay\")\n  @Watch(\"autoplayDisabledByMotionMedia\")\n  @Watch(\"autoplayDisabledByMouse\")\n  @Watch(\"autoplayDisabledByFocus\")\n  @Watch(\"autoplayDisabledByScroll\")\n  @Watch(\"autoplayDisabledByDrag\")\n  @Watch(\"autoplayTimeout\")\n  @Watch(\"disabled\")\n  autoplayRunningWatcher() {\n    if (\n      !this.autoplay ||\n      this.disabled ||\n      this.autoplayDisabledByMotionMedia ||\n      this.autoplayDisabledByMouse ||\n      this.autoplayDisabledByFocus ||\n      this.autoplayDisabledByScroll ||\n      this.autoplayDisabledByDrag\n    ) {\n      this.autoplayIntervalId && window.clearInterval(this.autoplayIntervalId);\n      this.autoplayIntervalId = null;\n      this.autoplayRunning = false;\n    } else {\n      this.autoplayIntervalId && window.clearInterval(this.autoplayIntervalId);\n      this.autoplayIntervalId = window.setInterval(this.autoplayInterval, this.autoplayTimeout);\n      this.autoplayRunning = true;\n    }\n  }\n\n  @Watch(\"slideElements\")\n  @Watch(\"currentSwipeSlides\")\n  snapAlignWatcher() {\n    this.slideElements.forEach((slide, index) => {\n      const shouldSnap = (index - this.currentSwipeSlides) % this.currentSwipeSlides === 0;\n\n      if (shouldSnap) {\n        slide.style.removeProperty(\"scroll-snap-align\");\n      } else {\n        slide.style.setProperty(\"scroll-snap-align\", \"none\");\n      }\n    });\n  }\n\n  @Watch(\"slide\")\n  @Watch(\"variant\")\n  @Watch(\"slideElements\")\n  @Watch(\"currentSlides\")\n  @Watch(\"tabThrough\")\n  inertWatcher() {\n    this.slideElements.forEach((slide, index) => {\n      const isActive =\n        this.tabThrough || this.variant === \"cards\" || (index >= this.slide && index < this.slide + this.currentSlides);\n\n      slide.inert = !isActive;\n\n      if (isActive) {\n        slide.removeAttribute(\"aria-hidden\");\n      } else {\n        slide.setAttribute(\"aria-hidden\", isActive ? \"false\" : \"true\");\n      }\n    });\n  }\n\n  @Watch(\"variant\")\n  @Watch(\"tabThrough\")\n  @Watch(\"nextElements\")\n  @Watch(\"previousElements\")\n  prevNextNavigationWatcher() {\n    const tabThrough = this.tabThrough || this.variant === \"cards\";\n\n    const setAriaAttributes = element => {\n      const isStzh = isStzhElement(element);\n\n      if (tabThrough) {\n        element.setAttribute(\"aria-hidden\", \"true\");\n        element.setAttribute(isStzh ? \"a11y-tabindex\" : \"tabindex\", \"-1\");\n      } else {\n        element.removeAttribute(\"aria-hidden\");\n        element.removeAttribute(isStzh ? \"a11y-tabindex\" : \"tabindex\");\n      }\n    };\n\n    this.nextElements.forEach(setAriaAttributes);\n    this.previousElements.forEach(setAriaAttributes);\n  }\n\n  @Watch(\"currentSlides\")\n  @Watch(\"slideElements\")\n  @Watch(\"nextElements\")\n  @Watch(\"previousElements\")\n  @Watch(\"navigationTextElements\")\n  prevNextHiddenWatcher() {\n    const hideElements = this.slideElements.length <= this.currentSlides;\n\n    const setHiddenAttribute = element => {\n      if (hideElements) {\n        element.setAttribute(\"hidden\", \"\");\n      } else {\n        element.removeAttribute(\"hidden\");\n      }\n    };\n\n    this.navigationTextElements.forEach(setHiddenAttribute);\n    this.nextElements.forEach(setHiddenAttribute);\n    this.previousElements.forEach(setHiddenAttribute);\n  }\n\n  @Watch(\"disabled\")\n  @Watch(\"slide\")\n  @Watch(\"currentSlides\")\n  @Watch(\"slideElements\")\n  @Watch(\"nextElements\")\n  @Watch(\"previousElements\")\n  nextPrevDisabledWatcher() {\n    if (!this.scrollElement) {\n      return;\n    }\n\n    const reachedFirstSlide = this.slide === 0;\n    const reachedLastSlide = this.hasReachedLastSlide();\n\n    this.nextElements.forEach(element => {\n      const isStzh = isStzhElement(element);\n      element.setAttribute(\n        isStzh ? \"a11y-disabled\" : \"aria-disabled\",\n        reachedLastSlide || this.disabled ? \"true\" : \"false\",\n      );\n    });\n\n    this.previousElements.forEach(element => {\n      const isStzh = isStzhElement(element);\n      element.setAttribute(\n        isStzh ? \"a11y-disabled\" : \"aria-disabled\",\n        reachedFirstSlide || this.disabled ? \"true\" : \"false\",\n      );\n    });\n  }\n\n  @Watch(\"nextElements\")\n  nextElementsWatcher() {\n    this.nextElements.forEach(nextElement => {\n      const isStzh = isStzhElement(nextElement);\n\n      nextElement.addEventListener(\"click\", this.onNextClick);\n      nextElement.setAttribute(isStzh ? \"a11y-controls\" : \"aria-controls\", `${this.carouselId}-scroll`);\n    });\n  }\n\n  @Watch(\"previousElements\")\n  previousElementsWatcher() {\n    this.previousElements.forEach(previousElement => {\n      const isStzh = isStzhElement(previousElement);\n\n      previousElement.addEventListener(\"click\", this.onPreviousClick);\n      previousElement.setAttribute(isStzh ? \"a11y-controls\" : \"aria-controls\", `${this.carouselId}-scroll`);\n    });\n  }\n\n  /** Whether autoplay is currently running */\n  @State() autoplayRunning: boolean = false;\n\n  /** Whether autoplay is currently disabled by reduced motion media */\n  @State() autoplayDisabledByMotionMedia: boolean = false;\n\n  /** Whether autoplay is currently disabled by mouse */\n  @State() autoplayDisabledByMouse: boolean = false;\n\n  /** Whether autoplay is currently disabled by focus */\n  @State() autoplayDisabledByFocus: boolean = false;\n\n  /** Whether autoplay is currently disabled by scroll */\n  @State() autoplayDisabledByScroll: boolean = false;\n\n  /** Whether autoplay is currently disabled by drag */\n  @State() autoplayDisabledByDrag: boolean = false;\n\n  /** Whether user is currently dragging with mouse */\n  @State() dragging: boolean = false;\n\n  /** Whether user is currently scrolling */\n  @State() scrolling: boolean = false;\n\n  /** Aria live text */\n  @State() ariaLive: string = \"\";\n\n  /** Currently shown slides */\n  @State() currentSlides: number = 1;\n\n  /** How many slides should be moved currently */\n  @State() currentSwipeSlides: number = 1;\n\n  /** Slide elements */\n  @State() slideElements: HTMLElement[] = [];\n\n  /** Previous elements */\n  @State() previousElements: HTMLElement[] = [];\n\n  /** Next elements */\n  @State() nextElements: HTMLElement[] = [];\n\n  /** Navigation text elements */\n  @State() navigationTextElements: HTMLElement[] = [];\n\n  private scrollElement: HTMLElement;\n\n  /** Unique generated id */\n  private carouselId: string;\n\n  /** Current scroll position */\n  private slideScrollLeft: number = 0;\n\n  /** Flag whether scrolling was done by user or not */\n  private scrolledByAutoplay: boolean = false;\n\n  /** Timeout ID used to catch the end of scroll events */\n  private scrollTimeoutId: number = null;\n\n  /** Interval ID for autoplay */\n  private autoplayIntervalId: number;\n\n  /** Last drag event position */\n  private lastX: number = null;\n\n  /** Where the dragging started */\n  private startX: number = null;\n\n  /** Where the dragging started scroll position */\n  private startScrollLeft: number = null;\n\n  /** Timeout ID for a smooth drag release */\n  private disableTimeoutId: number = null;\n\n  /** Calculated size of a single item */\n  private itemSize: number;\n\n  /** Resize observer used to update item size */\n  private resizeObserver: ResizeObserver;\n\n  /** Mutation observer used to keep track of slides */\n  private mutationObserver: MutationObserver;\n\n  /** Whether user has just stopped dragging */\n  private stoppedDragging: boolean = false;\n\n  private scrollToSlide(index, behaviour: \"auto\" | \"smooth\" = \"smooth\") {\n    if (this.disabled) {\n      return;\n    }\n\n    this.scrollElement.scrollTo({\n      left: index * this.itemSize,\n      behavior: reducedMotionMedia.matches ? \"auto\" : behaviour,\n    });\n  }\n\n  /** Width of a slide  */\n  private sizingMethod() {\n    const css = window.getComputedStyle(this.scrollElement);\n\n    return (\n      ((this.scrollElement.firstElementChild as HTMLElement) || this.scrollElement).offsetWidth +\n      parseInt(css.getPropertyValue(\"column-gap\"), 10)\n    );\n  }\n\n  /**\n   * Calculates the active slide.\n   * The scroll-snap-type property makes sure that the container snaps perfectly to integer multiples.\n   */\n  private calculateSlide() {\n    // Math.round: Dispatch 'stzhSlidePassed' events around the center of each slide\n    // Math.ceil: Dispatch 'stzhSlidePassed' events as soon as the next one is visible\n    // Math.floor: Dispatch 'stzhSlidePassed' events only when the next one is fully visible\n    return Math.round(this.scrollElement.scrollLeft / this.itemSize);\n  }\n\n  private scrollToPreviousSnapPoint(behaviour: \"auto\" | \"smooth\" = \"smooth\") {\n    if (this.disabled) {\n      return;\n    }\n\n    let previousIndex = this.slide;\n    let canSnap = false;\n\n    while (!canSnap && previousIndex > 0) {\n      previousIndex = previousIndex - 1;\n      canSnap = (previousIndex - this.currentSwipeSlides) % this.currentSwipeSlides === 0;\n    }\n\n    this.slideTo(previousIndex, behaviour);\n  }\n\n  private scrollToNextSnapPoint(behaviour: \"auto\" | \"smooth\" = \"smooth\") {\n    if (this.disabled) {\n      return;\n    }\n\n    this.slideTo(this.slide + this.currentSwipeSlides, behaviour);\n  }\n\n  private update() {\n    this.slide = this.calculateSlide();\n    this.slideScrollLeft = this.slide * this.itemSize;\n\n    this.onMutation();\n  }\n\n  private hasReachedLastSlide() {\n    const { scrollLeft, offsetWidth, scrollWidth } = this.scrollElement;\n    return Math.ceil(scrollLeft + offsetWidth) >= scrollWidth;\n  }\n\n  private onReducedMotionMediaChange = () => {\n    this.autoplayDisabledByMotionMedia = reducedMotionMedia.matches;\n  };\n\n  private onMouseenter = () => {\n    if (!this.preventAutoplayPause) {\n      this.autoplayDisabledByMouse = true;\n    }\n  };\n\n  private onMouseleave = () => {\n    this.autoplayDisabledByMouse = false;\n  };\n\n  private onFocusin = () => {\n    if (!this.preventAutoplayPause) {\n      this.autoplayDisabledByFocus = true;\n    }\n  };\n\n  private onFocusout = () => {\n    this.autoplayDisabledByFocus = false;\n  };\n\n  private onPreviousClick = () => {\n    this.scrollToPreviousSnapPoint();\n  };\n\n  private onNextClick = () => {\n    this.scrollToNextSnapPoint();\n  };\n\n  private onSlideResize = () => {\n    if (this.scrollElement) {\n      this.itemSize = this.sizingMethod();\n    }\n  };\n\n  private onMutation = () => {\n    if (!this.scrollElement) {\n      return;\n    }\n\n    this.slideElements = Array.from(this.scrollElement.children) as HTMLElement[];\n\n    this.slideElements.forEach((slide, index) => {\n      slide.setAttribute(\"role\", \"group\");\n      slide.setAttribute(\"aria-roledescription\", \"slide\");\n      slide.setAttribute(\n        \"aria-label\",\n        this.localization.slideLabel\n          .replace(/\\{current\\}/gi, (index + 1).toString())\n          .replace(/\\{total\\}/gi, this.slideElements.length.toString()),\n      );\n    });\n\n    this.previousElements = Array.from(this.element.querySelectorAll(\"[data-stzh-carousel-previous]\"));\n    this.nextElements = Array.from(this.element.querySelectorAll(\"[data-stzh-carousel-next]\"));\n    this.navigationTextElements = Array.from(this.element.querySelectorAll(\"[data-stzh-carousel-navigation-text]\"));\n  };\n\n  private onScroll = () => {\n    if (this.scrollTimeoutId === null) {\n      const direction = this.scrollElement.scrollLeft > this.slideScrollLeft ? 1 : -1;\n\n      this.scrolling = true;\n\n      if (!this.scrolledByAutoplay) {\n        if (this.preventAutoplayStop) {\n          this.autoplayDisabledByScroll = true;\n        } else {\n          this.autoplay = false;\n        }\n      }\n\n      this.stzhSlideStart.emit({\n        component: \"stzh-carousel\",\n        index: this.slide + direction,\n      });\n    }\n\n    if (this.slide !== this.calculateSlide()) {\n      this.update();\n      this.stzhSlidePassed.emit({\n        component: \"stzh-carousel\",\n        index: this.slide,\n      });\n    }\n\n    this.scrollTimeoutId && window.clearTimeout(this.scrollTimeoutId);\n    this.scrollTimeoutId = window.setTimeout(this.onScrollEnd, this.scrollTimeout);\n  };\n\n  private onScrollEnd = () => {\n    this.scrollTimeoutId = null;\n    this.update();\n\n    this.scrolling = false;\n    this.scrolledByAutoplay = false;\n    this.autoplayDisabledByScroll = false;\n\n    if (this.stoppedDragging) {\n      this.stoppedDragging = false;\n      this.scrollElement.style.removeProperty(\"scroll-behavior\");\n      this.scrollElement.style.removeProperty(\"scroll-snap-type\");\n    }\n\n    if (this.tabThrough || this.variant === \"cards\") {\n      this.ariaLive = \"\";\n    } else {\n      this.ariaLive = (this.currentSlides > 1 ? this.localization.slidesLabel : this.localization.slideLabel)\n        .replace(/\\{(current|from)\\}/gi, (this.slide + 1).toString())\n        .replace(/\\{to\\}/gi, (this.slide + this.currentSlides).toString())\n        .replace(/\\{total\\}/gi, this.slideElements.length.toString());\n    }\n\n    this.stzhSlideEnd.emit({\n      component: \"stzh-carousel\",\n      index: this.slide,\n    });\n  };\n\n  private onMediaChange = () => {\n    const ultra = media(\"ultra\").matches;\n    const large = media(\"large\").matches;\n    const medium = media(\"medium\").matches;\n    const small = media(\"small\").matches;\n\n    if (ultra && this.slidesUltra !== 0) {\n      this.currentSlides = this.slidesUltra;\n    } else if (large && this.slidesLarge !== 0) {\n      this.currentSlides = this.slidesLarge;\n    } else if (medium && this.slidesMedium !== 0) {\n      this.currentSlides = this.slidesMedium;\n    } else if (small && this.slidesSmall !== 0) {\n      this.currentSlides = this.slidesSmall;\n    } else {\n      this.currentSlides = this.slides;\n    }\n\n    // if (ultra && this.swipeSlidesUltra !== 0) {\n    //   this.currentSwipeSlides = this.swipeSlidesUltra;\n    // } else if (large && this.swipeSlidesLarge !== 0) {\n    //   this.currentSwipeSlides = this.swipeSlidesLarge;\n    // } else if (medium && this.swipeSlidesMedium !== 0) {\n    //   this.currentSwipeSlides = this.swipeSlidesMedium;\n    // } else if (small && this.swipeSlidesSmall !== 0) {\n    //   this.currentSwipeSlides = this.swipeSlidesSmall;\n    // } else {\n    //   this.currentSwipeSlides = this.swipeSlides;\n    // }\n\n    this.currentSwipeSlides = this.currentSlides;\n  };\n\n  /** Scroll the slider the appropriate amount of pixels and update the last event position */\n  private mouseMove = (event: MouseEvent) => {\n    const distance = this.lastX - event.clientX;\n    this.lastX = event.clientX;\n\n    this.scrollElement.scrollLeft += distance;\n  };\n\n  /** Clear disable timeout, set up variables and styles and attach the listener. */\n  private startDragging = (event: MouseEvent) => {\n    event.preventDefault();\n\n    this.disableTimeoutId && window.clearTimeout(this.disableTimeoutId);\n    this.disableTimeoutId = null;\n\n    this.startX = this.lastX = event.clientX;\n    this.startScrollLeft = this.scrollElement.scrollLeft;\n    this.scrollElement.style.setProperty(\"scroll-behavior\", \"auto\");\n    this.scrollElement.style.setProperty(\"scroll-snap-type\", \"unset\");\n\n    this.dragging = true;\n\n    if (this.preventAutoplayStop) {\n      this.autoplayDisabledByDrag = true;\n    } else {\n      this.autoplay = false;\n    }\n\n    window.addEventListener(\"mousemove\", this.mouseMove);\n    window.addEventListener(\"mouseup\", this.stopDragging, { capture: true });\n    window.addEventListener(\"click\", this.checkClick, { capture: true });\n  };\n\n  /** User stopped dragging */\n  private stopDragging = (event: MouseEvent) => {\n    event.preventDefault();\n\n    const distance = Math.abs(this.startX - this.lastX);\n    const minimumReached = distance > this.distanceQuickSwipe;\n    const direction = this.lastX > this.startX ? 1 : -1;\n\n    this.dragging = false;\n    this.autoplayDisabledByDrag = false;\n\n    const endDraddingLeft = this.scrollElement.scrollLeft;\n\n    this.scrollElement.style.removeProperty(\"scroll-snap-type\");\n    const finalLeft = this.scrollElement.scrollLeft;\n\n    this.scrollElement.style.setProperty(\"scroll-snap-type\", \"unset\");\n    this.scrollElement.scrollTo({ left: endDraddingLeft, behavior: \"auto\" });\n\n    if (finalLeft !== this.startScrollLeft || !minimumReached) {\n      this.scrollElement.scrollTo({ left: finalLeft, behavior: reducedMotionMedia.matches ? \"auto\" : \"smooth\" });\n    } else if (direction === 1) {\n      this.slideToPrevious();\n    } else {\n      this.slideToNext();\n    }\n\n    window.removeEventListener(\"mousemove\", this.mouseMove);\n    window.removeEventListener(\"mouseup\", this.stopDragging, { capture: true });\n\n    this.stoppedDragging = true;\n  };\n\n  private checkClick = (event: MouseEvent) => {\n    const distance = Math.abs(this.startX - this.lastX);\n    const minimumReached = distance > this.distancePreventClick;\n\n    if (minimumReached) {\n      event.preventDefault();\n      event.stopPropagation();\n    }\n\n    this.lastX = null;\n\n    window.removeEventListener(\"click\", this.checkClick, { capture: true });\n  };\n\n  private autoplayInterval = () => {\n    this.scrolledByAutoplay = true;\n\n    if (this.hasReachedLastSlide()) {\n      this.slideTo(0);\n    } else {\n      this.slideToNext();\n    }\n  };\n\n  async componentWillLoad() {\n    this.carouselId = `stzh-carousel-${carouselCounter++}`;\n    this.onMediaChange();\n\n    if (!this.localization) {\n      this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"carousel\");\n    }\n  }\n\n  componentDidLoad() {\n    this.itemSize = this.sizingMethod();\n    this.update();\n\n    this.disabledWatcher();\n    this.preventMouseDragWatcher();\n    this.autoplayRunningWatcher();\n  }\n\n  connectedCallback() {\n    addMediaChangeListener(this.onMediaChange);\n\n    this.resizeObserver = new ResizeObserver(this.onSlideResize);\n    this.resizeObserver.observe(this.element);\n\n    this.mutationObserver = new MutationObserver(this.onMutation);\n    this.mutationObserver.observe(this.element, {\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    this.scrollTimeoutId && window.clearTimeout(this.scrollTimeoutId);\n    this.scrollTimeoutId = null;\n\n    removeMediaChangeListener(this.onMediaChange);\n\n    if (this.resizeObserver) {\n      this.resizeObserver.disconnect();\n    }\n\n    if (this.mutationObserver) {\n      this.mutationObserver.disconnect();\n    }\n  }\n\n  render() {\n    const classes = {\n      \"stzh-carousel\": true,\n      \"stzh-carousel--is-disabled\": this.disabled,\n      \"stzh-carousel--is-draggable\": !this.preventMouseDrag,\n      \"stzh-carousel--is-non-interactive\": this.nonInteractive,\n      \"stzh-carousel--is-dragging\": this.dragging,\n      \"stzh-carousel--is-scrolling\": this.scrolling,\n      \"stzh-carousel--has-autoplay\": this.autoplay,\n      \"stzh-carousel--is-autoplay-running\": this.autoplayRunning,\n    };\n\n    return (\n      <Host\n        aria-roledescription=\"carousel\"\n        style={{\n          \"--slides\": this.currentSlides.toString(),\n        }}\n      >\n        <div class={classes}>\n          <slot name=\"actions\"></slot>\n          <div\n            class=\"stzh-carousel__vhidden\"\n            aria-live={this.autoplayDisabledByFocus || this.autoplayDisabledByMouse ? \"polite\" : \"off\"}\n          >\n            {this.ariaLive}\n          </div>\n          <div\n            ref={el => (this.scrollElement = el as HTMLDivElement)}\n            id={`${this.carouselId}-scroll`}\n            class=\"stzh-carousel__scroll\"\n          >\n            <slot></slot>\n          </div>\n          {this.withTrack && (\n            <div class=\"stzh-carousel__indicator\">\n              <div\n                class=\"stzh-carousel__indicator-track\"\n                style={{\n                  left: `${(100 / (this.slideElements?.length || 1)) * this.slide}%`,\n                  width: `${(100 / (this.slideElements?.length || 1)) * this.currentSlides || 0}%`,\n                }}\n              ></div>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-a6169d66.js → p-e551f11e.js}

@@ -1,11 +1,11 @@
 import { p as proxyCustomElement, H, c as createEvent, h, F as Fragment, d as Host } from './p-8f01554b.js';
-import { d as defineCustomElement$7 } from './p-17efbc57.js';
-import { d as defineCustomElement$6 } from './p-e42121d1.js';
-import { d as defineCustomElement$5 } from './p-677c846d.js';
-import { d as defineCustomElement$4 } from './p-5a8587ab.js';
-import { d as defineCustomElement$3 } from './p-faae4632.js';
-import { d as defineCustomElement$2 } from './p-6268e18b.js';
-import { d as defineCustomElement$1 } from './p-9a31aa56.js';
+import { d as defineCustomElement$7 } from './p-dd1c0c0c.js';
+import { d as defineCustomElement$6 } from './p-4a78990f.js';
+import { d as defineCustomElement$5 } from './p-c5124a8b.js';
+import { d as defineCustomElement$4 } from './p-7c4e756c.js';
+import { d as defineCustomElement$3 } from './p-da83a0ad.js';
+import { d as defineCustomElement$2 } from './p-963d59bf.js';
+import { d as defineCustomElement$1 } from './p-63c4d8c4.js';
 
 const stzhPaginationCss = ".sc-stzh-pagination-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-pagination-h,[stzh-hidden].sc-stzh-pagination-h{display:none}.sc-stzh-pagination-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-pagination-h *.sc-stzh-pagination,.sc-stzh-pagination-h *.sc-stzh-pagination::before,.sc-stzh-pagination-h *.sc-stzh-pagination::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-pagination-h .has-focus.sc-stzh-pagination{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-pagination-h .stzh-fylingfocus-focused.sc-stzh-pagination{outline-style:none !important}.sc-stzh-pagination-h .stzh-fylingfocus-focused.sc-stzh-pagination::-moz-focus-inner{border:0 !important}.sc-stzh-pagination-h{--justify-content:inherit;--padding-left:calc(var(--stzh-form-input-height) + var(--stzh-space-medium))}.stzh-pagination.sc-stzh-pagination{position:relative;display:flex;align-items:center;gap:var(--stzh-space-medium);padding-left:var(--padding-left);justify-content:var(--justify-content)}.stzh-pagination__input.sc-stzh-pagination{--text-align:center;--input-width:var(--stzh-form-input-height);--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;position:absolute;top:0;left:0}.stzh-pagination__total.sc-stzh-pagination{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height);color:var(--stzh-color-grey70)}.stzh-pagination--size-small.sc-stzh-pagination{padding-left:calc(var(--stzh-form-input-small-height) + var(--stzh-space-medium))}.stzh-pagination--size-small.sc-stzh-pagination .stzh-pagination__input.sc-stzh-pagination{--input-width:var(--stzh-form-input-small-height)}";
 const StzhPaginationStyle0 = stzhPaginationCss;
@@ -78,7 +78,7 @@ const StzhPagination = /*@__PURE__*/ proxyCustomElement(class StzhPagination ext
             "stzh-pagination": true,
             [`stzh-pagination--size-${this.size}`]: !!this.size,
         };
-        return (h(Host, { key: 'f4425d3383a307fbab8434dadef64868c6f92a10', tabindex: this.disabled ? null : "-1", onFocus: this.onRootFocus }, h("div", { key: '7512a5623975407f168b458ce2e206d0f8eb9a40', class: classes }, this.allowManualInput ? (h(Fragment, null, h("stzh-input", { class: "stzh-pagination__input", type: "number", min: 1, max: this.total, label: this.label || this.localization.label, labelHidden: true, ref: el => (this.input = el), onStzhChange: this.onInputChange, value: ((_a = this.value) === null || _a === void 0 ? void 0 : _a.toString()) || "", required: this.required, disabled: this.disabled, description: this.description, descriptionLong: this.descriptionLong, error: this.error, a11yDescribedby: this.a11yDescribedby, name: this.name, size: this.size, invalid: this.invalid, hideOptional: true, noAutocomplete: true }), h("div", { class: "stzh-pagination__total" }, this.localization.totalLabel.replace(/\{total\}/gi, this.total.toString())))) : (h("div", { class: "stzh-pagination__total" }, this.value, " ", this.localization.totalLabel.replace(/\{total\}/gi, this.total.toString()))), h("stzh-buttongroup", { key: '70c4a369ef2aeadaeaf96da2ddef3dfa4f0be08c' }, h("stzh-button", { key: 'd97d97368ddcfef49b0d57fceded01089406a4b7', variant: "tertiary", icon: "angle-left", "icon-only": true, size: this.size, a11yDisabled: this.value <= 1, a11yDescribedby: this.a11yDescribedby, a11yLabel: `${this.label || this.localization.label}, ${this.localization.prevLabel}, ${this.localization.selectedPageLabel} ${this.value}`, disabled: this.disabled, onClick: () => this.prev() }), h("stzh-button", { key: '756c6f2deff89a26f5eae78ec236aa86dfbfbb0d', variant: "tertiary", icon: "angle-right", "icon-only": true, size: this.size, a11yDisabled: this.value >= this.total, a11yDescribedby: this.a11yDescribedby, a11yLabel: `${this.label || this.localization.label}, ${this.localization.nextLabel}, ${this.localization.selectedPageLabel} ${this.value}`, disabled: this.disabled, onClick: () => this.next() })))));
+        return (h(Host, { key: '1bae61e7030acb82bf38a50b175091f34166ed24', tabindex: this.disabled ? null : "-1", onFocus: this.onRootFocus }, h("div", { key: '33274b9f75d30a2946652339dd00210f833353fe', class: classes }, this.allowManualInput ? (h(Fragment, null, h("stzh-input", { class: "stzh-pagination__input", type: "number", min: 1, max: this.total, label: this.label || this.localization.label, labelHidden: true, ref: el => (this.input = el), onStzhChange: this.onInputChange, value: ((_a = this.value) === null || _a === void 0 ? void 0 : _a.toString()) || "", required: this.required, disabled: this.disabled, description: this.description, descriptionLong: this.descriptionLong, error: this.error, a11yDescribedby: this.a11yDescribedby, name: this.name, size: this.size, invalid: this.invalid, hideOptional: true, noAutocomplete: true }), h("div", { class: "stzh-pagination__total" }, this.localization.totalLabel.replace(/\{total\}/gi, this.total.toString())))) : (h("div", { class: "stzh-pagination__total" }, this.value, " ", this.localization.totalLabel.replace(/\{total\}/gi, this.total.toString()))), h("stzh-buttongroup", { key: 'c1fa8d738778b55660e8ff5435d60a6f66c1a748' }, h("stzh-button", { key: 'c3e9f38c120eba5b97728ea50626f8698f3bf4c6', variant: "tertiary", icon: "angle-left", "icon-only": true, size: this.size, a11yDisabled: this.value <= 1, a11yDescribedby: this.a11yDescribedby, a11yLabel: `${this.label || this.localization.label}, ${this.localization.prevLabel}, ${this.localization.selectedPageLabel} ${this.value}`, disabled: this.disabled, onClick: () => this.prev() }), h("stzh-button", { key: 'e9e3b2ab4bf1ef64d1744108ae77480fa09e7bf4', variant: "tertiary", icon: "angle-right", "icon-only": true, size: this.size, a11yDisabled: this.value >= this.total, a11yDescribedby: this.a11yDescribedby, a11yLabel: `${this.label || this.localization.label}, ${this.localization.nextLabel}, ${this.localization.selectedPageLabel} ${this.value}`, disabled: this.disabled, onClick: () => this.next() })))));
     }
     get element() { return this; }
     static get style() { return StzhPaginationStyle0; }
@@ -153,4 +153,4 @@ function defineCustomElement() {
 
 export { StzhPagination as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-a6169d66.js.map
+//# sourceMappingURL=p-e551f11e.js.map

package/dist/components/{p-a6169d66.js.map → p-e551f11e.js.map}

@@ -1 +1 @@
-{"file":"p-a6169d66.js","mappings":"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","names":[],"sources":["src/components/stzh-pagination/stzh-pagination.scss?tag=stzh-pagination&encapsulation=scoped","src/components/stzh-pagination/stzh-pagination.tsx"],"sourcesContent":[":host {\n  --justify-content: inherit;\n  --padding-left: calc(#{$formInputHeight} + #{space(\"medium\")});\n}\n\n.stzh-pagination {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: space(\"medium\");\n  padding-left: var(--padding-left);\n  justify-content: var(--justify-content);\n\n  &__input {\n    --text-align: center;\n    --input-width: #{$formInputHeight};\n    --padding-top: 0px;\n    --padding-bottom: 0px;\n    --padding-left: 0px;\n    --padding-right: 0px;\n\n    position: absolute;\n    top: 0;\n    left: 0;\n  }\n\n  &__total {\n    @include fontSize(\"nano\");\n    color: $colorGrey70;\n  }\n\n  &--size-small {\n    padding-left: calc(#{$formInputHeightSmall} + #{space(\"medium\")});\n  }\n\n  &--size-small &__input {\n    --input-width: #{$formInputHeightSmall};\n  }\n}\n","import { Component, Element, Event, EventEmitter, Fragment, h, Host, Method, Prop } from \"@stencil/core\";\n\nimport { StzhInputChangeEvent, StzhPaginationChangeEvent } from \"../../index\";\n\nimport { StzhPaginationLocalizedText } from \"./stzh-pagination.localization\";\n\n/**\n */\n@Component({\n  tag: \"stzh-pagination\",\n  styleUrl: \"stzh-pagination.scss\",\n  scoped: true,\n})\nexport class StzhPagination {\n  /** Total pages available. */\n  @Prop() total: number = 1;\n\n  /** Name of the hidden date picker input. */\n  @Prop({ reflect: true }) name: string = \"\";\n\n  /** Current page. */\n  @Prop({ mutable: true }) value: number = 1;\n\n  /** Label for dropdown */\n  @Prop() label: string = \"\";\n\n  /** Whether label is hidden. */\n  @Prop() labelHidden: boolean = false;\n\n  /** Whether the element is readonly or not */\n  @Prop({ reflect: true }) readonly: boolean = false;\n\n  /** Whether the element is disabled or not */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /** Whether the current page is mutable via input */\n  @Prop({ reflect: true }) allowManualInput: boolean = true;\n\n  /** Description message (use description slot as alternative) */\n  @Prop() description: string;\n\n  /** Long description message appearing in a popover (use description-long slot as alternative) */\n  @Prop() descriptionLong: string;\n\n  /** One or multiple error message (use error slot as alternative) */\n  @Prop() error: string | string[];\n\n  /** Invalid status */\n  @Prop({ reflect: true }) invalid: boolean = false;\n\n  /** Required status */\n  @Prop({ reflect: true }) required: boolean = false;\n\n  /** Size variant */\n  @Prop({ reflect: true }) size: \"default\" | \"small\" = \"default\";\n\n  /** Id of the element which describes the input */\n  @Prop({ attribute: \"a11y-describedby\" }) a11yDescribedby: string = \"\";\n\n  /**  Translation strings. */\n  @Prop() localization: StzhPaginationLocalizedText;\n\n  /** Pagination change event */\n  @Event() stzhChange: EventEmitter<StzhPaginationChangeEvent>;\n\n  @Element() element: HTMLStzhPaginationElement;\n\n  /** Set current page to previous */\n  @Method()\n  async prev() {\n    this.gotoPage(this.value - 1);\n  }\n\n  /** Set current page to next */\n  @Method()\n  async next() {\n    this.gotoPage(this.value + 1);\n  }\n\n  private input: HTMLStzhInputElement;\n\n  private gotoPage = (newPage: number) => {\n    const previous = this.value;\n\n    if (newPage >= 1 && newPage <= this.total) {\n      this.value = newPage;\n    } else if (newPage > this.total) {\n      this.value = this.total;\n    } else {\n      this.value = 1;\n    }\n\n    if (previous !== this.value) {\n      this.stzhChange.emit({\n        component: \"stzh-pagination\",\n        page: Number(this.value),\n      });\n    }\n  };\n\n  private onRootFocus = () => {\n    if (this.input) {\n      this.input.focus();\n    }\n  };\n\n  private onInputChange = (event: CustomEvent<StzhInputChangeEvent>) => {\n    const newPage = Number(event.detail.value) || 1;\n    this.gotoPage(newPage);\n  };\n\n  async componentWillLoad() {\n    if (!this.localization) {\n      this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"pagination\");\n    }\n  }\n\n  render() {\n    const classes = {\n      \"stzh-pagination\": true,\n      [`stzh-pagination--size-${this.size}`]: !!this.size,\n    };\n\n    return (\n      <Host tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n        <div class={classes}>\n          {this.allowManualInput ? (\n            <Fragment>\n              <stzh-input\n                class=\"stzh-pagination__input\"\n                type=\"number\"\n                min={1}\n                max={this.total}\n                label={this.label || this.localization.label}\n                labelHidden={true}\n                ref={el => (this.input = el as HTMLStzhInputElement)}\n                onStzhChange={this.onInputChange}\n                value={this.value?.toString() || \"\"}\n                required={this.required}\n                disabled={this.disabled}\n                description={this.description}\n                descriptionLong={this.descriptionLong}\n                error={this.error}\n                a11yDescribedby={this.a11yDescribedby}\n                name={this.name}\n                size={this.size}\n                invalid={this.invalid}\n                hideOptional={true}\n                noAutocomplete={true}\n              ></stzh-input>\n              <div class=\"stzh-pagination__total\">\n                {this.localization.totalLabel.replace(/\\{total\\}/gi, this.total.toString())}\n              </div>\n            </Fragment>\n          ) : (\n            <div class=\"stzh-pagination__total\">\n              {this.value} {this.localization.totalLabel.replace(/\\{total\\}/gi, this.total.toString())}\n            </div>\n          )}\n          <stzh-buttongroup>\n            <stzh-button\n              variant=\"tertiary\"\n              icon=\"angle-left\"\n              icon-only\n              size={this.size}\n              a11yDisabled={this.value <= 1}\n              a11yDescribedby={this.a11yDescribedby}\n              a11yLabel={`${this.label || this.localization.label}, ${this.localization.prevLabel}, ${\n                this.localization.selectedPageLabel\n              } ${this.value}`}\n              disabled={this.disabled}\n              onClick={() => this.prev()}\n            ></stzh-button>\n            <stzh-button\n              variant=\"tertiary\"\n              icon=\"angle-right\"\n              icon-only\n              size={this.size}\n              a11yDisabled={this.value >= this.total}\n              a11yDescribedby={this.a11yDescribedby}\n              a11yLabel={`${this.label || this.localization.label}, ${this.localization.nextLabel}, ${\n                this.localization.selectedPageLabel\n              } ${this.value}`}\n              disabled={this.disabled}\n              onClick={() => this.next()}\n            ></stzh-button>\n          </stzh-buttongroup>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-e551f11e.js","mappings":"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","names":[],"sources":["src/components/stzh-pagination/stzh-pagination.scss?tag=stzh-pagination&encapsulation=scoped","src/components/stzh-pagination/stzh-pagination.tsx"],"sourcesContent":[":host {\n  --justify-content: inherit;\n  --padding-left: calc(#{$formInputHeight} + #{space(\"medium\")});\n}\n\n.stzh-pagination {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: space(\"medium\");\n  padding-left: var(--padding-left);\n  justify-content: var(--justify-content);\n\n  &__input {\n    --text-align: center;\n    --input-width: #{$formInputHeight};\n    --padding-top: 0px;\n    --padding-bottom: 0px;\n    --padding-left: 0px;\n    --padding-right: 0px;\n\n    position: absolute;\n    top: 0;\n    left: 0;\n  }\n\n  &__total {\n    @include fontSize(\"nano\");\n    color: $colorGrey70;\n  }\n\n  &--size-small {\n    padding-left: calc(#{$formInputHeightSmall} + #{space(\"medium\")});\n  }\n\n  &--size-small &__input {\n    --input-width: #{$formInputHeightSmall};\n  }\n}\n","import { Component, Element, Event, EventEmitter, Fragment, h, Host, Method, Prop } from \"@stencil/core\";\n\nimport { StzhInputChangeEvent, StzhPaginationChangeEvent } from \"../../index\";\n\nimport { StzhPaginationLocalizedText } from \"./stzh-pagination.localization\";\n\n/**\n */\n@Component({\n  tag: \"stzh-pagination\",\n  styleUrl: \"stzh-pagination.scss\",\n  scoped: true,\n})\nexport class StzhPagination {\n  /** Total pages available. */\n  @Prop() total: number = 1;\n\n  /** Name of the hidden date picker input. */\n  @Prop({ reflect: true }) name: string = \"\";\n\n  /** Current page. */\n  @Prop({ mutable: true }) value: number = 1;\n\n  /** Label for dropdown */\n  @Prop() label: string = \"\";\n\n  /** Whether label is hidden. */\n  @Prop() labelHidden: boolean = false;\n\n  /** Whether the element is readonly or not */\n  @Prop({ reflect: true }) readonly: boolean = false;\n\n  /** Whether the element is disabled or not */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /** Whether the current page is mutable via input */\n  @Prop({ reflect: true }) allowManualInput: boolean = true;\n\n  /** Description message (use description slot as alternative) */\n  @Prop() description: string;\n\n  /** Long description message appearing in a popover (use description-long slot as alternative) */\n  @Prop() descriptionLong: string;\n\n  /** One or multiple error message (use error slot as alternative) */\n  @Prop() error: string | string[];\n\n  /** Invalid status */\n  @Prop({ reflect: true }) invalid: boolean = false;\n\n  /** Required status */\n  @Prop({ reflect: true }) required: boolean = false;\n\n  /** Size variant */\n  @Prop({ reflect: true }) size: \"default\" | \"small\" = \"default\";\n\n  /** Id of the element which describes the input */\n  @Prop({ attribute: \"a11y-describedby\" }) a11yDescribedby: string = \"\";\n\n  /**  Translation strings. */\n  @Prop() localization: StzhPaginationLocalizedText;\n\n  /** Pagination change event */\n  @Event() stzhChange: EventEmitter<StzhPaginationChangeEvent>;\n\n  @Element() element: HTMLStzhPaginationElement;\n\n  /** Set current page to previous */\n  @Method()\n  async prev() {\n    this.gotoPage(this.value - 1);\n  }\n\n  /** Set current page to next */\n  @Method()\n  async next() {\n    this.gotoPage(this.value + 1);\n  }\n\n  private input: HTMLStzhInputElement;\n\n  private gotoPage = (newPage: number) => {\n    const previous = this.value;\n\n    if (newPage >= 1 && newPage <= this.total) {\n      this.value = newPage;\n    } else if (newPage > this.total) {\n      this.value = this.total;\n    } else {\n      this.value = 1;\n    }\n\n    if (previous !== this.value) {\n      this.stzhChange.emit({\n        component: \"stzh-pagination\",\n        page: Number(this.value),\n      });\n    }\n  };\n\n  private onRootFocus = () => {\n    if (this.input) {\n      this.input.focus();\n    }\n  };\n\n  private onInputChange = (event: CustomEvent<StzhInputChangeEvent>) => {\n    const newPage = Number(event.detail.value) || 1;\n    this.gotoPage(newPage);\n  };\n\n  async componentWillLoad() {\n    if (!this.localization) {\n      this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"pagination\");\n    }\n  }\n\n  render() {\n    const classes = {\n      \"stzh-pagination\": true,\n      [`stzh-pagination--size-${this.size}`]: !!this.size,\n    };\n\n    return (\n      <Host tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n        <div class={classes}>\n          {this.allowManualInput ? (\n            <Fragment>\n              <stzh-input\n                class=\"stzh-pagination__input\"\n                type=\"number\"\n                min={1}\n                max={this.total}\n                label={this.label || this.localization.label}\n                labelHidden={true}\n                ref={el => (this.input = el as HTMLStzhInputElement)}\n                onStzhChange={this.onInputChange}\n                value={this.value?.toString() || \"\"}\n                required={this.required}\n                disabled={this.disabled}\n                description={this.description}\n                descriptionLong={this.descriptionLong}\n                error={this.error}\n                a11yDescribedby={this.a11yDescribedby}\n                name={this.name}\n                size={this.size}\n                invalid={this.invalid}\n                hideOptional={true}\n                noAutocomplete={true}\n              ></stzh-input>\n              <div class=\"stzh-pagination__total\">\n                {this.localization.totalLabel.replace(/\\{total\\}/gi, this.total.toString())}\n              </div>\n            </Fragment>\n          ) : (\n            <div class=\"stzh-pagination__total\">\n              {this.value} {this.localization.totalLabel.replace(/\\{total\\}/gi, this.total.toString())}\n            </div>\n          )}\n          <stzh-buttongroup>\n            <stzh-button\n              variant=\"tertiary\"\n              icon=\"angle-left\"\n              icon-only\n              size={this.size}\n              a11yDisabled={this.value <= 1}\n              a11yDescribedby={this.a11yDescribedby}\n              a11yLabel={`${this.label || this.localization.label}, ${this.localization.prevLabel}, ${\n                this.localization.selectedPageLabel\n              } ${this.value}`}\n              disabled={this.disabled}\n              onClick={() => this.prev()}\n            ></stzh-button>\n            <stzh-button\n              variant=\"tertiary\"\n              icon=\"angle-right\"\n              icon-only\n              size={this.size}\n              a11yDisabled={this.value >= this.total}\n              a11yDescribedby={this.a11yDescribedby}\n              a11yLabel={`${this.label || this.localization.label}, ${this.localization.nextLabel}, ${\n                this.localization.selectedPageLabel\n              } ${this.value}`}\n              disabled={this.disabled}\n              onClick={() => this.next()}\n            ></stzh-button>\n          </stzh-buttongroup>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-33ac52bc.js → p-e5cf7853.js}

@@ -9,7 +9,7 @@ const StzhMenu = /*@__PURE__*/ proxyCustomElement(class StzhMenu extends H {
         this.__registerHost();
     }
     render() {
-        return (h(Host, { key: '0d031ce5a945732bb65570b4b9b96cfde17a9c35', role: "menu" }, h("div", { key: 'e883158579a69808d31482378e54d66425b4876f', class: "stzh-menu" }, h("slot", { key: '97fd22afb8cee839109a0b80f1f53c622b72f863' }))));
+        return (h(Host, { key: 'd04d40ebc41823a174af2efc78b1370c935c5938', role: "menu" }, h("div", { key: 'cf47f242c5c3dcf12e88861556396d979abbae7c', class: "stzh-menu" }, h("slot", { key: 'b2deb476f4c49900be374b103696f020ede74904' }))));
     }
     static get style() { return StzhMenuStyle0; }
 }, [6, "stzh-menu"]);
@@ -29,4 +29,4 @@ function defineCustomElement() {
 
 export { StzhMenu as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-33ac52bc.js.map
+//# sourceMappingURL=p-e5cf7853.js.map

package/dist/components/{p-33ac52bc.js.map → p-e5cf7853.js.map}

@@ -1 +1 @@
-{"file":"p-33ac52bc.js","mappings":";;AAAA,MAAM,WAAW,GAAG,uxCAAuxC,CAAC;AAC5yC,uBAAe,WAAW;;MCSb,QAAQ;;;;;IACnB,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,IAAI,EAAC,MAAM,IACf,4DAAK,KAAK,EAAC,WAAW,IACpB,8DAAa,CACT,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/stzh-menu/stzh-menu.scss?tag=stzh-menu&encapsulation=scoped","src/components/stzh-menu/stzh-menu.tsx"],"sourcesContent":[":host {\n  ::slotted(stzh-hr) {\n    margin-top: space(\"xsmall\");\n    margin-bottom: space(\"xsmall\");\n  }\n}\n\n.stzh-menu {\n  display: flex;\n  flex-direction: column;\n}\n","import { Component, Host, h } from \"@stencil/core\";\n\n/**\n * @slot - Slot for `stzh-menu-item` elements\n */\n@Component({\n  tag: \"stzh-menu\",\n  styleUrl: \"stzh-menu.scss\",\n  scoped: true,\n})\nexport class StzhMenu {\n  render() {\n    return (\n      <Host role=\"menu\">\n        <div class=\"stzh-menu\">\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-e5cf7853.js","mappings":";;AAAA,MAAM,WAAW,GAAG,uxCAAuxC,CAAC;AAC5yC,uBAAe,WAAW;;MCSb,QAAQ;;;;;IACnB,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,IAAI,EAAC,MAAM,IACf,4DAAK,KAAK,EAAC,WAAW,IACpB,8DAAa,CACT,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/stzh-menu/stzh-menu.scss?tag=stzh-menu&encapsulation=scoped","src/components/stzh-menu/stzh-menu.tsx"],"sourcesContent":[":host {\n  ::slotted(stzh-hr) {\n    margin-top: space(\"xsmall\");\n    margin-bottom: space(\"xsmall\");\n  }\n}\n\n.stzh-menu {\n  display: flex;\n  flex-direction: column;\n}\n","import { Component, Host, h } from \"@stencil/core\";\n\n/**\n * @slot - Slot for `stzh-menu-item` elements\n */\n@Component({\n  tag: \"stzh-menu\",\n  styleUrl: \"stzh-menu.scss\",\n  scoped: true,\n})\nexport class StzhMenu {\n  render() {\n    return (\n      <Host role=\"menu\">\n        <div class=\"stzh-menu\">\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-1d88f941.js → p-ea3c0ed4.js}

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-8f01554b.js';
-import { d as defineCustomElement$3 } from './p-17efbc57.js';
-import { d as defineCustomElement$2 } from './p-e42121d1.js';
-import { d as defineCustomElement$1 } from './p-5a8587ab.js';
+import { d as defineCustomElement$3 } from './p-dd1c0c0c.js';
+import { d as defineCustomElement$2 } from './p-4a78990f.js';
+import { d as defineCustomElement$1 } from './p-7c4e756c.js';
 
 const stzhMessageCss = ".sc-stzh-message-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-message-h,[stzh-hidden].sc-stzh-message-h{display:none}.sc-stzh-message-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-message-h *.sc-stzh-message,.sc-stzh-message-h *.sc-stzh-message::before,.sc-stzh-message-h *.sc-stzh-message::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-message-h .has-focus.sc-stzh-message{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-message-h .stzh-fylingfocus-focused.sc-stzh-message{outline-style:none !important}.sc-stzh-message-h .stzh-fylingfocus-focused.sc-stzh-message::-moz-focus-inner{border:0 !important}.sc-stzh-message-h{--background-color:var(--stzh-color-grey20);--icon-color:var(--stzh-color-info50);--close-color:var(--stzh-color-grey90);--label-color:var(--stzh-color-info70);--description-color:var(--stzh-color-grey90)}[type=success].sc-stzh-message-h{--label-color:var(--stzh-color-success70);--icon-color:var(--stzh-color-success50);--background-color:var(--stzh-color-success20)}[type=warning].sc-stzh-message-h{--label-color:var(--stzh-color-warning90);--icon-color:var(--stzh-color-warning70);--background-color:var(--stzh-color-warning20)}[type=error].sc-stzh-message-h{--label-color:var(--stzh-color-error70);--icon-color:var(--stzh-color-error50);--background-color:var(--stzh-color-error20)}[type=page-message].sc-stzh-message-h{--label-color:var(--stzh-color-info70);--icon-color:var(--stzh-color-info50);--background-color:var(--stzh-color-info20)}.stzh-message.sc-stzh-message{position:relative;display:flex;box-shadow:var(--stzh-box-shadow-message);background-color:var(--background-color);border-radius:var(--stzh-button-border-radius)}.stzh-message__content.sc-stzh-message{padding-top:var(--stzh-space-xsmall);padding-bottom:var(--stzh-space-xsmall);padding-right:var(--stzh-space-large);gap:var(--stzh-space-xsmall);display:flex;flex-direction:column;flex-grow:1;padding-left:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-message__content.sc-stzh-message{padding-top:var(--stzh-space-small)}}@media screen and (min-width: 900px){.stzh-message__content.sc-stzh-message{padding-top:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-message__content.sc-stzh-message{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 600px){.stzh-message__content.sc-stzh-message{padding-bottom:var(--stzh-space-small)}}@media screen and (min-width: 900px){.stzh-message__content.sc-stzh-message{padding-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-message__content.sc-stzh-message{padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 600px){.stzh-message__content.sc-stzh-message{padding-right:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px){.stzh-message__content.sc-stzh-message{padding-right:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-message__content.sc-stzh-message{padding-right:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 600px){.stzh-message__content.sc-stzh-message{gap:var(--stzh-space-small)}}@media screen and (min-width: 900px){.stzh-message__content.sc-stzh-message{gap:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-message__content.sc-stzh-message{gap:var(--stzh-space-xlarge)}}@media screen and (min-width: 600px){.stzh-message__content.sc-stzh-message{flex-direction:row;align-items:flex-start}}@media screen and (min-width: 900px){.stzh-message__content.sc-stzh-message{padding-left:var(--stzh-space-large)}}.stzh-message__icon-wrapper.sc-stzh-message{display:flex;flex-shrink:0}.stzh-message__icon.sc-stzh-message{--size:var(--stzh-icon-size-large);color:var(--icon-color)}@media screen and (min-width: 600px){.stzh-message__text-wrapper.sc-stzh-message{flex-grow:1}}@media screen and (min-width: 1260px){.stzh-message__text-wrapper.sc-stzh-message{align-items:center}}.stzh-message__label.sc-stzh-message{font-family:var(--stzh-font-family-title);font-weight:var(--stzh-font-weight-title);font-style:var(--stzh-font-style-title);font-size:var(--stzh-font-curve-h4-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-h4-default-heading-line-height, var(--stzh-font-milli-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-default-heading-letter-spacing);color:var(--label-color)}@media screen and (min-width: 600px){.stzh-message__label.sc-stzh-message{font-size:var(--stzh-font-curve-h4-small-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h4-small-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-small-heading-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-message__label.sc-stzh-message{font-size:var(--stzh-font-curve-h4-large-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h4-large-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-large-heading-letter-spacing)}}@media screen and (min-width: 1600px){.stzh-message__label.sc-stzh-message{font-size:var(--stzh-font-curve-h4-ultra-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h4-ultra-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h4-ultra-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 1260px){.stzh-message__label.sc-stzh-message{font-size:var(--stzh-font-deci-font-size) !important}}.stzh-message__label.sc-stzh-message:not(:empty){margin-bottom:var(--stzh-space-xsmall)}.stzh-message__description.sc-stzh-message{font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p1-default-text-letter-spacing);color:var(--description-color)}@media screen and (min-width: 900px){.stzh-message__description.sc-stzh-message{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-text-letter-spacing)}}.stzh-message__description.sc-stzh-message:not(:empty)+.stzh-message__link.sc-stzh-message:not(:empty){margin-top:var(--stzh-space-xxsmall)}@media screen and (min-width: 900px){.stzh-message__description.sc-stzh-message:not(:empty)+.stzh-message__link.sc-stzh-message:not(:empty){margin-top:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px){.stzh-message__description.sc-stzh-message:not(:empty)+.stzh-message__link.sc-stzh-message:not(:empty){margin-top:var(--stzh-space-small)}}.stzh-message__close[variant=tertiary].sc-stzh-message{--color:var(--close-color);position:absolute;top:0;right:0}.stzh-message.sc-stzh-message:has(.stzh-message__description:empty):has(.stzh-message__link:empty) .stzh-message__label.sc-stzh-message:not(:empty){margin-top:var(--stzh-space-xxsmall);margin-bottom:0}.stzh-message--type-page-message.sc-stzh-message .stzh-message__content.sc-stzh-message{padding-left:1.25rem;padding-right:1.25rem;padding-top:var(--stzh-space-xsmall);padding-bottom:var(--stzh-space-xsmall);align-items:flex-start;flex-direction:row}@media screen and (min-width: 600px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__content.sc-stzh-message{padding-left:2rem;padding-right:2rem}}@media screen and (min-width: 900px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__content.sc-stzh-message{padding-left:2.5rem;padding-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__content.sc-stzh-message{padding-left:4rem;padding-right:4rem}}@media screen and (min-width: 1600px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__content.sc-stzh-message{padding-left:calc((100vw - 84.25rem) / 2);padding-right:calc((100vw - 84.25rem) / 2)}}@media screen and (min-width: 600px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__content.sc-stzh-message{padding-top:var(--stzh-space-small)}}@media screen and (min-width: 900px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__content.sc-stzh-message{padding-top:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__content.sc-stzh-message{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 600px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__content.sc-stzh-message{padding-bottom:var(--stzh-space-small)}}@media screen and (min-width: 900px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__content.sc-stzh-message{padding-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__content.sc-stzh-message{padding-bottom:var(--stzh-space-xlarge)}}@media screen and (max-width: 1259px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__content.sc-stzh-message{padding-right:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__content.sc-stzh-message{align-items:center}}.stzh-message--type-page-message.sc-stzh-message .stzh-message__text-wrapper.sc-stzh-message{display:flex;flex-direction:column}@media screen and (min-width: 1260px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__text-wrapper.sc-stzh-message{flex-direction:row;gap:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px) and (min-width: 600px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__text-wrapper.sc-stzh-message{gap:var(--stzh-space-small)}}@media screen and (min-width: 1260px) and (min-width: 900px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__text-wrapper.sc-stzh-message{gap:var(--stzh-space-medium)}}@media screen and (min-width: 1260px) and (min-width: 1260px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__text-wrapper.sc-stzh-message{gap:var(--stzh-space-xlarge)}}.stzh-message--type-page-message.sc-stzh-message .stzh-message__icon.sc-stzh-message{--size:var(--stzh-icon-size-small)}.stzh-message--type-page-message.sc-stzh-message .stzh-message__label.sc-stzh-message{font-family:var(--stzh-font-family-title);font-weight:var(--stzh-font-weight-title);font-style:var(--stzh-font-style-title);font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p1-default-text-letter-spacing);margin:0}@media screen and (min-width: 900px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__label.sc-stzh-message{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-text-letter-spacing)}}@media screen and (min-width: 600px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__close.sc-stzh-message{top:0.625rem;right:0.625rem}}@media screen and (min-width: 900px){.stzh-message--type-page-message.sc-stzh-message .stzh-message__text-wrapper.sc-stzh-message .stzh-message__link.sc-stzh-message{margin-top:0}}";
 const StzhMessageStyle0 = stzhMessageCss;
@@ -45,10 +45,10 @@ const StzhMessage = /*@__PURE__*/ proxyCustomElement(class StzhMessage extends H
             "stzh-message--has-close-hidden": this.hideClose,
             [`stzh-message--type-${this.type}`]: !!this.type,
         };
-        return (h(Host, { key: '267c7e609677ca54b45142e5f056d28f711cdd9f', hidden: !this.open }, h("div", { key: '56a67b7c79fc1817e396b59e3b4181e0d65f3e24', class: classes }, h("div", { key: '35f09d647f2f25896d32488ec68df4923a6dcea4', class: "stzh-message__content" }, h("div", { key: '5bb473fb68a4485f83a09f5d67d6dba536cc48ae', class: "stzh-message__icon-wrapper" }, h("stzh-icon", { key: '804e2b7eaa18ae9944830323f69bdf721ee3e8d8', class: "stzh-message__icon", name: ((this.type === "info" || this.type === "page-message") && "info-help-filled") ||
+        return (h(Host, { key: 'c0bf908892332ec4fa6442307d7c4e471e845d1e', hidden: !this.open }, h("div", { key: 'a3e09f5723bf00a44e7897218a6180e059ca9c50', class: classes }, h("div", { key: '4f056a8a4e4d8a82c96ba7329d20932c6c75b56e', class: "stzh-message__content" }, h("div", { key: '1b51f1898e57346a34365555a4316f7830627df0', class: "stzh-message__icon-wrapper" }, h("stzh-icon", { key: 'a7456799e5f7c09bb99c36d4d37405c97fc8c719', class: "stzh-message__icon", name: ((this.type === "info" || this.type === "page-message") && "info-help-filled") ||
                 (this.type === "success" && "checkmark-circle-filled") ||
                 (this.type === "warning" && "important-warning-filled") ||
-                (this.type === "error" && "warning-filled") })), h("div", { key: 'fbaae9b83b1a6ea0ca6266ff0f5d319d62a50c2a', class: "stzh-message__text-wrapper" }, h("div", { key: 'e3eac8a185112ffc1e045946bbd7c00c6c132dca', class: "stzh-message__label" }, this.label ? this.label : h("slot", { name: "label" })), h("div", { key: '3b99a5d3e8ce1eb7fe4be442012c7308033cbacc', class: "stzh-message__description" }, this.description ? this.description : h("slot", null)), h("div", { key: '216e5dfbd5c74e12d71e3c91380aa3dd00cef027', class: "stzh-message__link" }, h("slot", { key: 'c5b5faa346a93b88474c4d91a62af304a5b80cd9', name: "link" })))), !this.hideClose && (h("stzh-button", { key: '204ff573366df41346ec409165b55aad3b8f25bb', class: "stzh-message__close", onClick: this.onCloseButtonClick, a11yLabel: this.localization.close, variant: "tertiary", size: "small", iconOnly: true, icon: "close-big" })))));
+                (this.type === "error" && "warning-filled") })), h("div", { key: '6545f7dc6e470c4bbb7725e8652244ac8f704720', class: "stzh-message__text-wrapper" }, h("div", { key: '006f489c47dad8065ae4e116f261ce8695041133', class: "stzh-message__label" }, this.label ? this.label : h("slot", { name: "label" })), h("div", { key: '3d263bb95da6c01d8b6114f8d12a56fee10be42f', class: "stzh-message__description" }, this.description ? this.description : h("slot", null)), h("div", { key: '49104e4eeae5cc3e23c526d28f8605737ed0e233', class: "stzh-message__link" }, h("slot", { key: '13a40455da1e4818862e2f35a53eab6c295ebad9', name: "link" })))), !this.hideClose && (h("stzh-button", { key: '2fa4dcce37b24494a7690fa5fb083131646fd362', class: "stzh-message__close", onClick: this.onCloseButtonClick, a11yLabel: this.localization.close, variant: "tertiary", size: "small", iconOnly: true, icon: "close-big" })))));
     }
     get element() { return this; }
     static get style() { return StzhMessageStyle0; }
@@ -93,4 +93,4 @@ function defineCustomElement() {
 
 export { StzhMessage as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-1d88f941.js.map
+//# sourceMappingURL=p-ea3c0ed4.js.map

package/dist/components/{p-1d88f941.js.map → p-ea3c0ed4.js.map}

@@ -1 +1 @@
-{"file":"p-1d88f941.js","mappings":";;;;;AAAA,MAAM,cAAc,GAAG,6xXAA6xX,CAAC;AACrzX,0BAAe,cAAc;;MCehB,WAAW;;;;;;QA4Cd,uBAAkB,GAAG;YAC3B,IAAI,CAAC,IAAI,EAAE,CAAC;SACb,CAAC;qBA5CsB,EAAE;2BAGI,EAAE;oBAI2D,MAAM;yBAGpE,KAAK;;oBAcT,IAAI;;IAG7B,MAAM,IAAI;QACR,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;YACjB,SAAS,EAAE,cAAc;SAC1B,CAAC,CAAC;KACJ;IAGD,MAAM,IAAI;QACR,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;QAClB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;YAClB,SAAS,EAAE,cAAc;SAC1B,CAAC,CAAC;KACJ;IAMD,MAAM,iBAAiB;QACrB,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;YACtB,IAAI,CAAC,YAAY,GAAG,MAAM,MAAM,CAAC,cAAc,CAAC,KAAK,CAAC,iBAAiB,CAAC,IAAI,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;SAClG;KACF;IAED,MAAM;QACJ,MAAM,OAAO,GAAG;YACd,cAAc,EAAE,IAAI;YACpB,gCAAgC,EAAE,IAAI,CAAC,SAAS;YAChD,CAAC,sBAAsB,IAAI,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI;SACjD,CAAC;QAEF,QACE,EAAC,IAAI,qDAAC,MAAM,EAAE,CAAC,IAAI,CAAC,IAAI,IACtB,4DAAK,KAAK,EAAE,OAAO,IACjB,4DAAK,KAAK,EAAC,uBAAuB,IAChC,4DAAK,KAAK,EAAC,4BAA4B,IACrC,kEACE,KAAK,EAAC,oBAAoB,EAC1B,IAAI,EACF,CAAC,CAAC,IAAI,CAAC,IAAI,KAAK,MAAM,IAAI,IAAI,CAAC,IAAI,KAAK,cAAc,KAAK,kBAAkB;iBAC5E,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,yBAAyB,CAAC;iBACrD,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,0BAA0B,CAAC;iBACtD,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,gBAAgB,CAAC,GAElC,CACT,EACN,4DAAK,KAAK,EAAC,4BAA4B,IACrC,4DAAK,KAAK,EAAC,qBAAqB,IAAE,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,GAAG,YAAM,IAAI,EAAC,OAAO,GAAQ,CAAO,EAC7F,4DAAK,KAAK,EAAC,2BAA2B,IAAE,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,GAAG,eAAa,CAAO,EAClG,4DAAK,KAAK,EAAC,oBAAoB,IAC7B,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACrB,CACF,CACF,EAEL,CAAC,IAAI,CAAC,SAAS,KACd,oEACE,KAAK,EAAC,qBAAqB,EAC3B,OAAO,EAAE,IAAI,CAAC,kBAAkB,EAChC,SAAS,EAAE,IAAI,CAAC,YAAY,CAAC,KAAK,EAClC,OAAO,EAAC,UAAU,EAClB,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,IAAI,EACd,IAAI,EAAC,WAAW,GACH,CAChB,CACG,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/stzh-message/stzh-message.scss?tag=stzh-message&encapsulation=scoped","src/components/stzh-message/stzh-message.tsx"],"sourcesContent":[":host {\n  --background-color: #{$colorGrey20};\n  --icon-color: #{$colorInfo50};\n  --close-color: #{$colorGrey90};\n  --label-color: #{$colorInfo70};\n  --description-color: #{$colorGrey90};\n\n  &[type=\"success\"] {\n    --label-color: #{$colorSuccess70};\n    --icon-color: #{$colorSuccess50};\n    --background-color: #{$colorSuccess20};\n  }\n\n  &[type=\"warning\"] {\n    --label-color: #{$colorWarning90};\n    --icon-color: #{$colorWarning70};\n    --background-color: #{$colorWarning20};\n  }\n\n  &[type=\"error\"] {\n    --label-color: #{$colorError70};\n    --icon-color: #{$colorError50};\n    --background-color: #{$colorError20};\n  }\n\n  &[type=\"page-message\"] {\n    --label-color: #{$colorInfo70};\n    --icon-color: #{$colorInfo50};\n    --background-color: #{$colorInfo20};\n  }\n}\n\n.stzh-message {\n  position: relative;\n  display: flex;\n  box-shadow: $boxShadowMessage;\n  background-color: var(--background-color);\n  border-radius: #{$buttonBorderRadius};\n\n  &__content {\n    @include spaceCurve(\"padding-top\", \"small\");\n    @include spaceCurve(\"padding-bottom\", \"small\");\n    @include spaceCurve(\"padding-right\", \"medium\");\n    @include spaceCurve(\"gap\", \"small\");\n    display: flex;\n    flex-direction: column;\n    flex-grow: 1;\n    padding-left: space(\"medium\");\n\n    @include mq($from: small) {\n      flex-direction: row;\n      align-items: flex-start;\n    }\n\n    @include mq($from: medium) {\n      padding-left: space(\"large\");\n    }\n  }\n\n  &__icon-wrapper {\n    display: flex;\n    flex-shrink: 0;\n  }\n\n  &__icon {\n    --size: #{iconSize(\"large\")};\n    color: var(--icon-color);\n  }\n\n  &__text-wrapper {\n    @include mq($from: small) {\n      flex-grow: 1;\n    }\n    @include mq($from: large) {\n      align-items: center;\n    }\n  }\n\n  &__label {\n    @include font(\"title\");\n    @include fontCurve(\"h4\", \"heading\");\n    color: var(--label-color);\n\n    @include mq($from: large) {\n      font-size: var(--stzh-font-deci-font-size) !important;\n    }\n\n    &:not(:empty) {\n      margin-bottom: var(--stzh-space-xsmall);\n    }\n  }\n\n  &__description {\n    @include fontCurve(\"p1\");\n    color: var(--description-color);\n  }\n\n  &__description:not(:empty) + &__link:not(:empty) {\n    @include spaceCurve(\"margin-top\", \"tiny\");\n  }\n\n  &__close[variant=\"tertiary\"] {\n    --color: var(--close-color);\n\n    position: absolute;\n    top: 0;\n    right: 0;\n  }\n\n  /* Only label variant */\n\n  &:has(#{&}__description:empty):has(#{&}__link:empty) &__label:not(:empty) {\n    margin-top: space(\"xxsmall\");\n    margin-bottom: 0;\n  }\n\n  /* Type page-message */\n\n  &--type-page-message &__content {\n    @include containerPadding;\n    @include spaceCurve(\"padding-top\", \"small\");\n    @include spaceCurve(\"padding-bottom\", \"small\");\n    align-items: flex-start;\n    flex-direction: row;\n\n    @include mq($to: large) {\n      padding-right: space(\"xxxlarge\");\n    }\n\n    @include mq($from: large) {\n      align-items: center;\n    }\n  }\n\n  &--type-page-message &__text-wrapper {\n    display: flex;\n    flex-direction: column;\n\n    @include mq($from: large) {\n      flex-direction: row;\n      @include spaceCurve(\"gap\", \"small\");\n    }\n  }\n\n  &--type-page-message &__icon {\n    --size: #{iconSize(\"small\")};\n  }\n\n  &--type-page-message &__label {\n    @include font(\"title\");\n    @include fontCurve(\"p1\");\n    margin: 0;\n  }\n\n  &--type-page-message &__close {\n    @include mq($from: small) {\n      top: 10px;\n      right: 10px;\n    }\n  }\n\n  &--type-page-message &__text-wrapper &__link {\n    @include mq($from: medium) {\n      margin-top: 0;\n    }\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State } from \"@stencil/core\";\n\nimport { StzhMessageCloseEvent, StzhMessageOpenEvent } from \"../../index\";\n\nimport { StzhMessageLocalizedText } from \"./stzh-message.localization\";\n\n/**\n * @slot - Slot for description content (use instead of description property)\n * @slot label - Slot for label (use as alternative for property)\n * @slot link - Slot for optional stzh-link element\n */\n@Component({\n  tag: \"stzh-message\",\n  styleUrl: \"stzh-message.scss\",\n  scoped: true,\n})\nexport class StzhMessage {\n  /** Label (slot can also be used as alternative) */\n  @Prop() label: string = \"\";\n\n  /** Description (use instead of default slot) */\n  @Prop() description: string = \"\";\n\n  /** Type */\n  /** Do not use page-message property. It will be deprecated with the next major release. */\n  @Prop({ reflect: true }) type: \"info\" | \"success\" | \"warning\" | \"error\" | \"page-message\" = \"info\";\n\n  /** Whether to hide close button */\n  @Prop() hideClose: boolean = false;\n\n  /** Translation strings. */\n  @Prop() localization: StzhMessageLocalizedText;\n\n  /** Message open event */\n  @Event() stzhOpen: EventEmitter<StzhMessageOpenEvent>;\n\n  /** Message close event */\n  @Event() stzhClose: EventEmitter<StzhMessageCloseEvent>;\n\n  @Element() element: HTMLStzhMessageElement;\n\n  /** Open state */\n  @State() open: boolean = true;\n\n  @Method()\n  async show() {\n    this.open = true;\n    this.stzhOpen.emit({\n      component: \"stzh-message\",\n    });\n  }\n\n  @Method()\n  async hide() {\n    this.open = false;\n    this.stzhClose.emit({\n      component: \"stzh-message\",\n    });\n  }\n\n  private onCloseButtonClick = () => {\n    this.hide();\n  };\n\n  async componentWillLoad() {\n    if (!this.localization) {\n      this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"message\");\n    }\n  }\n\n  render() {\n    const classes = {\n      \"stzh-message\": true,\n      \"stzh-message--has-close-hidden\": this.hideClose,\n      [`stzh-message--type-${this.type}`]: !!this.type,\n    };\n\n    return (\n      <Host hidden={!this.open}>\n        <div class={classes}>\n          <div class=\"stzh-message__content\">\n            <div class=\"stzh-message__icon-wrapper\">\n              <stzh-icon\n                class=\"stzh-message__icon\"\n                name={\n                  ((this.type === \"info\" || this.type === \"page-message\") && \"info-help-filled\") ||\n                  (this.type === \"success\" && \"checkmark-circle-filled\") ||\n                  (this.type === \"warning\" && \"important-warning-filled\") ||\n                  (this.type === \"error\" && \"warning-filled\")\n                }\n              ></stzh-icon>\n            </div>\n            <div class=\"stzh-message__text-wrapper\">\n              <div class=\"stzh-message__label\">{this.label ? this.label : <slot name=\"label\"></slot>}</div>\n              <div class=\"stzh-message__description\">{this.description ? this.description : <slot></slot>}</div>\n              <div class=\"stzh-message__link\">\n                <slot name=\"link\"></slot>\n              </div>\n            </div>\n          </div>\n\n          {!this.hideClose && (\n            <stzh-button\n              class=\"stzh-message__close\"\n              onClick={this.onCloseButtonClick}\n              a11yLabel={this.localization.close}\n              variant=\"tertiary\"\n              size=\"small\"\n              iconOnly={true}\n              icon=\"close-big\"\n            ></stzh-button>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-ea3c0ed4.js","mappings":";;;;;AAAA,MAAM,cAAc,GAAG,6xXAA6xX,CAAC;AACrzX,0BAAe,cAAc;;MCehB,WAAW;;;;;;QA4Cd,uBAAkB,GAAG;YAC3B,IAAI,CAAC,IAAI,EAAE,CAAC;SACb,CAAC;qBA5CsB,EAAE;2BAGI,EAAE;oBAI2D,MAAM;yBAGpE,KAAK;;oBAcT,IAAI;;IAG7B,MAAM,IAAI;QACR,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;YACjB,SAAS,EAAE,cAAc;SAC1B,CAAC,CAAC;KACJ;IAGD,MAAM,IAAI;QACR,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;QAClB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;YAClB,SAAS,EAAE,cAAc;SAC1B,CAAC,CAAC;KACJ;IAMD,MAAM,iBAAiB;QACrB,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;YACtB,IAAI,CAAC,YAAY,GAAG,MAAM,MAAM,CAAC,cAAc,CAAC,KAAK,CAAC,iBAAiB,CAAC,IAAI,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;SAClG;KACF;IAED,MAAM;QACJ,MAAM,OAAO,GAAG;YACd,cAAc,EAAE,IAAI;YACpB,gCAAgC,EAAE,IAAI,CAAC,SAAS;YAChD,CAAC,sBAAsB,IAAI,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI;SACjD,CAAC;QAEF,QACE,EAAC,IAAI,qDAAC,MAAM,EAAE,CAAC,IAAI,CAAC,IAAI,IACtB,4DAAK,KAAK,EAAE,OAAO,IACjB,4DAAK,KAAK,EAAC,uBAAuB,IAChC,4DAAK,KAAK,EAAC,4BAA4B,IACrC,kEACE,KAAK,EAAC,oBAAoB,EAC1B,IAAI,EACF,CAAC,CAAC,IAAI,CAAC,IAAI,KAAK,MAAM,IAAI,IAAI,CAAC,IAAI,KAAK,cAAc,KAAK,kBAAkB;iBAC5E,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,yBAAyB,CAAC;iBACrD,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,0BAA0B,CAAC;iBACtD,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,gBAAgB,CAAC,GAElC,CACT,EACN,4DAAK,KAAK,EAAC,4BAA4B,IACrC,4DAAK,KAAK,EAAC,qBAAqB,IAAE,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,GAAG,YAAM,IAAI,EAAC,OAAO,GAAQ,CAAO,EAC7F,4DAAK,KAAK,EAAC,2BAA2B,IAAE,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,GAAG,eAAa,CAAO,EAClG,4DAAK,KAAK,EAAC,oBAAoB,IAC7B,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACrB,CACF,CACF,EAEL,CAAC,IAAI,CAAC,SAAS,KACd,oEACE,KAAK,EAAC,qBAAqB,EAC3B,OAAO,EAAE,IAAI,CAAC,kBAAkB,EAChC,SAAS,EAAE,IAAI,CAAC,YAAY,CAAC,KAAK,EAClC,OAAO,EAAC,UAAU,EAClB,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,IAAI,EACd,IAAI,EAAC,WAAW,GACH,CAChB,CACG,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/stzh-message/stzh-message.scss?tag=stzh-message&encapsulation=scoped","src/components/stzh-message/stzh-message.tsx"],"sourcesContent":[":host {\n  --background-color: #{$colorGrey20};\n  --icon-color: #{$colorInfo50};\n  --close-color: #{$colorGrey90};\n  --label-color: #{$colorInfo70};\n  --description-color: #{$colorGrey90};\n\n  &[type=\"success\"] {\n    --label-color: #{$colorSuccess70};\n    --icon-color: #{$colorSuccess50};\n    --background-color: #{$colorSuccess20};\n  }\n\n  &[type=\"warning\"] {\n    --label-color: #{$colorWarning90};\n    --icon-color: #{$colorWarning70};\n    --background-color: #{$colorWarning20};\n  }\n\n  &[type=\"error\"] {\n    --label-color: #{$colorError70};\n    --icon-color: #{$colorError50};\n    --background-color: #{$colorError20};\n  }\n\n  &[type=\"page-message\"] {\n    --label-color: #{$colorInfo70};\n    --icon-color: #{$colorInfo50};\n    --background-color: #{$colorInfo20};\n  }\n}\n\n.stzh-message {\n  position: relative;\n  display: flex;\n  box-shadow: $boxShadowMessage;\n  background-color: var(--background-color);\n  border-radius: #{$buttonBorderRadius};\n\n  &__content {\n    @include spaceCurve(\"padding-top\", \"small\");\n    @include spaceCurve(\"padding-bottom\", \"small\");\n    @include spaceCurve(\"padding-right\", \"medium\");\n    @include spaceCurve(\"gap\", \"small\");\n    display: flex;\n    flex-direction: column;\n    flex-grow: 1;\n    padding-left: space(\"medium\");\n\n    @include mq($from: small) {\n      flex-direction: row;\n      align-items: flex-start;\n    }\n\n    @include mq($from: medium) {\n      padding-left: space(\"large\");\n    }\n  }\n\n  &__icon-wrapper {\n    display: flex;\n    flex-shrink: 0;\n  }\n\n  &__icon {\n    --size: #{iconSize(\"large\")};\n    color: var(--icon-color);\n  }\n\n  &__text-wrapper {\n    @include mq($from: small) {\n      flex-grow: 1;\n    }\n    @include mq($from: large) {\n      align-items: center;\n    }\n  }\n\n  &__label {\n    @include font(\"title\");\n    @include fontCurve(\"h4\", \"heading\");\n    color: var(--label-color);\n\n    @include mq($from: large) {\n      font-size: var(--stzh-font-deci-font-size) !important;\n    }\n\n    &:not(:empty) {\n      margin-bottom: var(--stzh-space-xsmall);\n    }\n  }\n\n  &__description {\n    @include fontCurve(\"p1\");\n    color: var(--description-color);\n  }\n\n  &__description:not(:empty) + &__link:not(:empty) {\n    @include spaceCurve(\"margin-top\", \"tiny\");\n  }\n\n  &__close[variant=\"tertiary\"] {\n    --color: var(--close-color);\n\n    position: absolute;\n    top: 0;\n    right: 0;\n  }\n\n  /* Only label variant */\n\n  &:has(#{&}__description:empty):has(#{&}__link:empty) &__label:not(:empty) {\n    margin-top: space(\"xxsmall\");\n    margin-bottom: 0;\n  }\n\n  /* Type page-message */\n\n  &--type-page-message &__content {\n    @include containerPadding;\n    @include spaceCurve(\"padding-top\", \"small\");\n    @include spaceCurve(\"padding-bottom\", \"small\");\n    align-items: flex-start;\n    flex-direction: row;\n\n    @include mq($to: large) {\n      padding-right: space(\"xxxlarge\");\n    }\n\n    @include mq($from: large) {\n      align-items: center;\n    }\n  }\n\n  &--type-page-message &__text-wrapper {\n    display: flex;\n    flex-direction: column;\n\n    @include mq($from: large) {\n      flex-direction: row;\n      @include spaceCurve(\"gap\", \"small\");\n    }\n  }\n\n  &--type-page-message &__icon {\n    --size: #{iconSize(\"small\")};\n  }\n\n  &--type-page-message &__label {\n    @include font(\"title\");\n    @include fontCurve(\"p1\");\n    margin: 0;\n  }\n\n  &--type-page-message &__close {\n    @include mq($from: small) {\n      top: 10px;\n      right: 10px;\n    }\n  }\n\n  &--type-page-message &__text-wrapper &__link {\n    @include mq($from: medium) {\n      margin-top: 0;\n    }\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State } from \"@stencil/core\";\n\nimport { StzhMessageCloseEvent, StzhMessageOpenEvent } from \"../../index\";\n\nimport { StzhMessageLocalizedText } from \"./stzh-message.localization\";\n\n/**\n * @slot - Slot for description content (use instead of description property)\n * @slot label - Slot for label (use as alternative for property)\n * @slot link - Slot for optional stzh-link element\n */\n@Component({\n  tag: \"stzh-message\",\n  styleUrl: \"stzh-message.scss\",\n  scoped: true,\n})\nexport class StzhMessage {\n  /** Label (slot can also be used as alternative) */\n  @Prop() label: string = \"\";\n\n  /** Description (use instead of default slot) */\n  @Prop() description: string = \"\";\n\n  /** Type */\n  /** Do not use page-message property. It will be deprecated with the next major release. */\n  @Prop({ reflect: true }) type: \"info\" | \"success\" | \"warning\" | \"error\" | \"page-message\" = \"info\";\n\n  /** Whether to hide close button */\n  @Prop() hideClose: boolean = false;\n\n  /** Translation strings. */\n  @Prop() localization: StzhMessageLocalizedText;\n\n  /** Message open event */\n  @Event() stzhOpen: EventEmitter<StzhMessageOpenEvent>;\n\n  /** Message close event */\n  @Event() stzhClose: EventEmitter<StzhMessageCloseEvent>;\n\n  @Element() element: HTMLStzhMessageElement;\n\n  /** Open state */\n  @State() open: boolean = true;\n\n  @Method()\n  async show() {\n    this.open = true;\n    this.stzhOpen.emit({\n      component: \"stzh-message\",\n    });\n  }\n\n  @Method()\n  async hide() {\n    this.open = false;\n    this.stzhClose.emit({\n      component: \"stzh-message\",\n    });\n  }\n\n  private onCloseButtonClick = () => {\n    this.hide();\n  };\n\n  async componentWillLoad() {\n    if (!this.localization) {\n      this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"message\");\n    }\n  }\n\n  render() {\n    const classes = {\n      \"stzh-message\": true,\n      \"stzh-message--has-close-hidden\": this.hideClose,\n      [`stzh-message--type-${this.type}`]: !!this.type,\n    };\n\n    return (\n      <Host hidden={!this.open}>\n        <div class={classes}>\n          <div class=\"stzh-message__content\">\n            <div class=\"stzh-message__icon-wrapper\">\n              <stzh-icon\n                class=\"stzh-message__icon\"\n                name={\n                  ((this.type === \"info\" || this.type === \"page-message\") && \"info-help-filled\") ||\n                  (this.type === \"success\" && \"checkmark-circle-filled\") ||\n                  (this.type === \"warning\" && \"important-warning-filled\") ||\n                  (this.type === \"error\" && \"warning-filled\")\n                }\n              ></stzh-icon>\n            </div>\n            <div class=\"stzh-message__text-wrapper\">\n              <div class=\"stzh-message__label\">{this.label ? this.label : <slot name=\"label\"></slot>}</div>\n              <div class=\"stzh-message__description\">{this.description ? this.description : <slot></slot>}</div>\n              <div class=\"stzh-message__link\">\n                <slot name=\"link\"></slot>\n              </div>\n            </div>\n          </div>\n\n          {!this.hideClose && (\n            <stzh-button\n              class=\"stzh-message__close\"\n              onClick={this.onCloseButtonClick}\n              a11yLabel={this.localization.close}\n              variant=\"tertiary\"\n              size=\"small\"\n              iconOnly={true}\n              icon=\"close-big\"\n            ></stzh-button>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}