@sbb-esta/lyne-elements 1.2.0 → 1.3.0

package/clock/clock.d.ts

@@ -29,16 +29,19 @@ export declare class SbbClockElement extends LitElement {
     private _moveMinutesHandFn;
     /** Move the minutes hand every minute. */
     private _handMovement?;
-    protected willUpdate(changedProperties: PropertyValues<this>): void;
+    protected willUpdate(changedProperties: PropertyValues<this>): Promise<void>;
+    protected firstUpdated(changedProperties: PropertyValues<this>): Promise<void>;
+    disconnectedCallback(): void;
     private _handlePageVisibilityChange;
-    private _addEventListeners;
-    private _removeEventListeners;
-    private _removeHoursAnimationStyles;
-    private _removeSecondsAnimationStyles;
-    /** Given the current date, calculates the hh/mm/ss values and the hh/mm/ss left to the next midnight. */
-    private _assignCurrentTime;
+    private _startOrConfigureClock;
+    /** Starts the clock by defining the hands starting position then starting the animations. */
+    private _startClock;
+    /** Stops the clock by removing all the animations. */
+    private _stopClock;
     /** Set the starting position for the three hands on the clock face. */
     private _setHandsStartingPosition;
+    /** Given the current date, calculates the hh/mm/ss values and the hh/mm/ss left to the next midnight. */
+    private _assignCurrentTime;
     /** Set the starting position for the minutes hand. */
     private _setMinutesHand;
     /** Move the hours hand to the next value. */
@@ -46,12 +49,15 @@ export declare class SbbClockElement extends LitElement {
     /** Move the minutes hand to the next value. */
     private _moveMinutesHand;
     private _addMinutesAndSetHands;
-    /** Stops the clock by removing all the animations. */
-    private _stopClock;
-    /** Starts the clock by defining the hands starting position then starting the animations. */
-    private _startClock;
-    protected firstUpdated(changedProperties: PropertyValues<this>): Promise<void>;
-    disconnectedCallback(): void;
+    /**
+     * Removing animation by overriding with empty string,
+     * then triggering a reflow and re add original animation by removing override.
+     * @private
+     */
+    private _resetSecondsHandAnimation;
+    private _removeEventListeners;
+    private _removeHoursAnimationStyles;
+    private _removeSecondsAnimationStyles;
     protected render(): TemplateResult;
 }
 declare global {

package/clock/clock.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"clock.d.ts","sourceRoot":"","sources":["../../../src/elements/clock/clock.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAkB,UAAU,EAAE,MAAM,KAAK,CAAC;AAIjD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AA2CrD;;GAEG;AACH,qBACa,eAAgB,SAAQ,UAAU;IAC7C,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD;;;OAGG;IACgB,GAAG,EAAE,OAAO,GAAG,IAAI,CAAQ;IAE9C,kCAAkC;IAClC,OAAO,CAAC,eAAe,CAAe;IAEtC,oCAAoC;IACpC,OAAO,CAAC,iBAAiB,CAAe;IAExC,oCAAoC;IACpC,OAAO,CAAC,iBAAiB,CAAe;IAExC,wCAAwC;IACxC,OAAO,CAAC,MAAM,CAAU;IAExB,0CAA0C;IAC1C,OAAO,CAAC,QAAQ,CAAU;IAE1B,0CAA0C;IAC1C,OAAO,CAAC,QAAQ,CAAU;IAE1B,wCAAwC;IACxC,OAAO,CAAC,gBAAgB,CAAqC;IAE7D,0CAA0C;IAC1C,OAAO,CAAC,kBAAkB,CAAuC;IAEjE,0CAA0C;IAC1C,OAAO,CAAC,aAAa,CAAC,CAAiC;cAEpC,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAc5E,OAAO,CAAC,2BAA2B,CAMjC;IAEF,OAAO,CAAC,kBAAkB;IAI1B,OAAO,CAAC,qBAAqB;IAO7B,OAAO,CAAC,2BAA2B;IAMnC,OAAO,CAAC,6BAA6B;IAOrC,yGAAyG;IACzG,OAAO,CAAC,kBAAkB;IAW1B,uEAAuE;IACvE,OAAO,CAAC,yBAAyB;IA6CjC,sDAAsD;IACtD,OAAO,CAAC,eAAe;IAOvB,6CAA6C;IAC7C,OAAO,CAAC,cAAc;IAYtB,+CAA+C;IAC/C,OAAO,CAAC,gBAAgB;IAaxB,OAAO,CAAC,sBAAsB;IAK9B,sDAAsD;YACxC,UAAU;IAyBxB,6FAA6F;YAC/E,WAAW;cAiBA,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;IAc7E,oBAAoB,IAAI,IAAI;cAKzB,MAAM,IAAI,cAAc;CA4B5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,WAAW,EAAE,eAAe,CAAC;KAC9B;CACF"}
+{"version":3,"file":"clock.d.ts","sourceRoot":"","sources":["../../../src/elements/clock/clock.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAkB,UAAU,EAAE,MAAM,KAAK,CAAC;AAIjD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AA2CrD;;GAEG;AACH,qBACa,eAAgB,SAAQ,UAAU;IAC7C,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD;;;OAGG;IACgB,GAAG,EAAE,OAAO,GAAG,IAAI,CAAQ;IAE9C,kCAAkC;IAClC,OAAO,CAAC,eAAe,CAAe;IAEtC,oCAAoC;IACpC,OAAO,CAAC,iBAAiB,CAAe;IAExC,oCAAoC;IACpC,OAAO,CAAC,iBAAiB,CAAe;IAExC,wCAAwC;IACxC,OAAO,CAAC,MAAM,CAAU;IAExB,0CAA0C;IAC1C,OAAO,CAAC,QAAQ,CAAU;IAE1B,0CAA0C;IAC1C,OAAO,CAAC,QAAQ,CAAU;IAE1B,wCAAwC;IACxC,OAAO,CAAC,gBAAgB,CAAqC;IAE7D,0CAA0C;IAC1C,OAAO,CAAC,kBAAkB,CAAuC;IAEjE,0CAA0C;IAC1C,OAAO,CAAC,aAAa,CAAC,CAAiC;cAE9B,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;cAQlE,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;IAS7E,oBAAoB,IAAI,IAAI;IAK5C,OAAO,CAAC,2BAA2B,CAMjC;YAEY,sBAAsB;IAUpC,6FAA6F;YAC/E,WAAW;IAqBzB,sDAAsD;YACxC,UAAU;IAcxB,uEAAuE;IACvE,OAAO,CAAC,yBAAyB;IA4CjC,yGAAyG;IACzG,OAAO,CAAC,kBAAkB;IAW1B,sDAAsD;IACtD,OAAO,CAAC,eAAe;IAOvB,6CAA6C;IAC7C,OAAO,CAAC,cAAc;IAYtB,+CAA+C;IAC/C,OAAO,CAAC,gBAAgB;IAaxB,OAAO,CAAC,sBAAsB;IAK9B;;;;OAIG;IACH,OAAO,CAAC,0BAA0B;IAUlC,OAAO,CAAC,qBAAqB;IAO7B,OAAO,CAAC,2BAA2B;IAMnC,OAAO,CAAC,6BAA6B;cAOlB,MAAM,IAAI,cAAc;CA4B5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,WAAW,EAAE,eAAe,CAAC;KAC9B;CACF"}

package/clock.js

@@ -1,137 +1,148 @@
-import { css as H, LitElement as g, isServer as u, html as z } from "lit";
+import { css as p, LitElement as H, isServer as _, html as g } from "lit";
 import { property as y, customElement as f } from "lit/decorators.js";
-import { ref as l } from "lit/directives/ref.js";
-const S = `<svg focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 105 105"><g class="face"><circle fill="#FFF" cx="52.5" cy="52.5" r="52.5"/><path d="M50.75 4h3.5v12h-3.5zM50.75 89h3.5v12h-3.5zM75.233 9.623l3.03 1.75-6 10.392-3.03-1.75zM32.734 83.233l3.03 1.75-6 10.392-3.03-1.75zM93.628 26.732l1.75 3.031-10.392 6-1.75-3.03zM20.017 69.234l1.75 3.031-10.392 6-1.75-3.03zM101 50.75v3.5H89v-3.5zM16 50.75v3.5H4v-3.5zM95.379 75.232l-1.75 3.031-10.392-6 1.75-3.03zM21.766 32.734l-1.75 3.031-10.392-6 1.75-3.03zM78.267 93.63l-3.03 1.75-6-10.393 3.03-1.75zM35.766 20.015l-3.03 1.75-6-10.392 3.03-1.75z"/><g><path d="M56.873 4.19l1.392.147-.366 3.48-1.392-.145zM47.101 97.177l1.393.146-.366 3.481-1.392-.146zM61.896 4.914l1.37.29-.728 3.424-1.37-.29zM42.458 96.366l1.37.29-.728 3.424-1.37-.291zM66.825 6.157l1.332.432-1.082 3.33-1.331-.434zM37.931 95.085l1.332.432-1.082 3.33-1.331-.433zM71.584 7.906l1.28.569-1.424 3.197-1.28-.57zM33.56 93.32l1.278.569-1.423 3.197-1.28-.57zM80.44 12.852l1.133.823-2.058 2.831-1.132-.823zM25.481 88.494l1.133.822-2.057 2.832-1.133-.823zM84.43 15.986l1.04.937-2.342 2.6-1.04-.936zM21.87 85.469l1.04.936-2.341 2.601-1.04-.937zM88.072 19.522l.937 1.04-2.6 2.343-.937-1.04zM18.593 82.088l.937 1.04-2.601 2.342-.937-1.04zM91.328 23.425l.823 1.133-2.832 2.057-.823-1.132zM15.684 78.385l.823 1.132-2.832 2.058-.822-1.133zM96.52 32.128l.57 1.279-3.198 1.423-.57-1.278zM11.109 70.161l.569 1.279-3.197 1.423-.57-1.279zM98.407 36.85l.433 1.332-3.33 1.081-.432-1.331zM9.483 65.74l.432 1.33-3.329 1.082-.432-1.331zM99.795 41.726l.291 1.37-3.423.727-.29-1.37zM8.34 61.17l.292 1.37-3.424.728-.29-1.37zM100.66 46.73l.146 1.393-3.48.366-.147-1.392zM7.674 56.506l.146 1.392-3.48.366-.147-1.392zM100.811 56.873l-.146 1.392-3.48-.365.145-1.393zM7.821 47.101l-.146 1.392-3.48-.365.145-1.393zM100.09 61.895l-.291 1.369-3.424-.728.291-1.369zM8.631 42.46l-.291 1.37-3.423-.728.29-1.37zM98.84 66.827l-.432 1.331-3.329-1.081.433-1.332zM9.918 37.93l-.433 1.331-3.329-1.082.433-1.331zM97.098 71.585l-.569 1.28-3.197-1.424.57-1.28zM11.677 33.558l-.57 1.28-3.197-1.424.57-1.279zM92.149 80.439l-.823 1.133-2.832-2.058.823-1.132zM16.506 25.482l-.823 1.133-2.831-2.057.823-1.133zM89.017 84.431l-.937 1.04-2.6-2.341.936-1.04zM19.528 21.869l-.936 1.04-2.601-2.342.936-1.04zM85.48 88.076l-1.041.936-2.342-2.6 1.04-.937zM22.91 18.59l-1.04.937-2.341-2.601 1.04-.937zM81.574 91.328l-1.133.823-2.057-2.831 1.132-.823zM26.617 15.684l-1.133.823-2.057-2.832 1.132-.823zM72.873 96.524l-1.279.57-1.423-3.198 1.278-.57zM34.838 11.105l-1.279.57-1.423-3.198 1.279-.57zM68.151 98.405l-1.331.432-1.082-3.329 1.332-.432zM39.259 9.485l-1.332.433-1.081-3.33 1.331-.432zM63.272 99.799l-1.369.29-.728-3.422 1.37-.291zM43.83 8.337l-1.369.291-.727-3.423 1.37-.291zM58.27 100.662l-1.393.146-.366-3.48 1.393-.147zM48.494 7.672l-1.392.147-.366-3.481 1.392-.147z"/></g></g></svg>
-`, w = `<svg focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 105 105"><path id="mod_clock_svg_hours" d="M55.7 64.5h-6.4l.6-44h5.2z"/></svg>
-`, L = `<svg focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 105 105"><path d="M55.1,64.5h-5.2l0.8-58h3.6L55.1,64.5z"/></svg>
-`, E = `<svg focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 105 105"><path d="M57.8,21.3c0-2.9-2.4-5.2-5.2-5.2s-5.3,2.3-5.3,5.2c0,2.7,2,4.8,4.5,5.2V69h1.5V26.5C55.8,26.2,57.8,24,57.8,21.3z"/></svg>
-`, C = H`*,:before,:after{box-sizing:border-box}:host{--sbb-clock-hours-animation-start-angle: 0deg;--sbb-clock-seconds-animation-start-angle: 0deg;--sbb-clock-hours-animation-duration: 0s;--sbb-clock-seconds-animation-duration: 0s;--sbb-clock-animation-play-state: paused;--sbb-clock-seconds-hand-color: var(--sbb-color-red);display:block}.sbb-clock{position:relative;width:100%;height:100%;aspect-ratio:1/1;overflow:hidden;contain:content}.sbb-clock__face,.sbb-clock__hand-hours,.sbb-clock__hand-minutes,.sbb-clock__hand-seconds{position:absolute;top:0;right:0;bottom:0;left:0;transform-origin:center center;transform:rotate(0);transform-style:preserve-3d;backface-visibility:hidden}.sbb-clock__hand-minutes{transition:transform .2s cubic-bezier(.4,2.08,.55,.44)}@supports not (aspect-ratio: 1/1){.sbb-clock__hand-minutes{transform-origin:50% 49.625%}}.sbb-clock__hand-hours{animation-name:rotate;animation-duration:43200s;animation-iteration-count:infinite;animation-timing-function:linear;animation-play-state:var(--sbb-clock-animation-play-state)}.sbb-clock__hand-hours--initial-hour{animation-name:hand-hours-animation-initial-hour;animation-duration:var(--sbb-clock-hours-animation-duration);animation-play-state:var(--sbb-clock-animation-play-state);animation-iteration-count:1}.sbb-clock__hand-minutes--no-transition{transition:none}.sbb-clock__hand-seconds{animation-name:hand-seconds-animation;animation-duration:60s;animation-timing-function:linear;animation-play-state:var(--sbb-clock-animation-play-state);animation-iteration-count:infinite;fill:var(--sbb-clock-seconds-hand-color)}.sbb-clock__hand-seconds--initial-minute{animation-name:hand-seconds-animation-initial-minute;animation-duration:var(--sbb-clock-seconds-animation-duration);animation-play-state:var(--sbb-clock-animation-play-state);animation-iteration-count:1}:host(:not([data-initialized])) :is(.sbb-clock__hand-hours,.sbb-clock__hand-minutes,.sbb-clock__hand-seconds){display:none}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes hand-hours-animation-initial-hour{0%{transform:rotate(var(--sbb-clock-hours-animation-start-angle))}to{transform:rotate(360deg)}}@keyframes hand-seconds-animation{0%{transform:rotate(0)}97.5%,to{transform:rotate(360deg)}}@keyframes hand-seconds-animation-initial-minute{0%{transform:rotate(var(--sbb-clock-seconds-animation-start-angle))}97.5%,to{transform:rotate(360deg)}}`;
-var A = Object.defineProperty, O = Object.getOwnPropertyDescriptor, p = (t, s, o, i) => {
-  for (var n = i > 1 ? void 0 : i ? O(s, o) : s, e = t.length - 1, a; e >= 0; e--)
-    (a = t[e]) && (n = (i ? a(s, o, n) : a(n)) || n);
-  return i && n && A(s, o, n), n;
+import { ref as r } from "lit/directives/ref.js";
+const z = `<svg focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 105 105"><g class="face"><circle fill="#FFF" cx="52.5" cy="52.5" r="52.5"/><path d="M50.75 4h3.5v12h-3.5zM50.75 89h3.5v12h-3.5zM75.233 9.623l3.03 1.75-6 10.392-3.03-1.75zM32.734 83.233l3.03 1.75-6 10.392-3.03-1.75zM93.628 26.732l1.75 3.031-10.392 6-1.75-3.03zM20.017 69.234l1.75 3.031-10.392 6-1.75-3.03zM101 50.75v3.5H89v-3.5zM16 50.75v3.5H4v-3.5zM95.379 75.232l-1.75 3.031-10.392-6 1.75-3.03zM21.766 32.734l-1.75 3.031-10.392-6 1.75-3.03zM78.267 93.63l-3.03 1.75-6-10.393 3.03-1.75zM35.766 20.015l-3.03 1.75-6-10.392 3.03-1.75z"/><g><path d="M56.873 4.19l1.392.147-.366 3.48-1.392-.145zM47.101 97.177l1.393.146-.366 3.481-1.392-.146zM61.896 4.914l1.37.29-.728 3.424-1.37-.29zM42.458 96.366l1.37.29-.728 3.424-1.37-.291zM66.825 6.157l1.332.432-1.082 3.33-1.331-.434zM37.931 95.085l1.332.432-1.082 3.33-1.331-.433zM71.584 7.906l1.28.569-1.424 3.197-1.28-.57zM33.56 93.32l1.278.569-1.423 3.197-1.28-.57zM80.44 12.852l1.133.823-2.058 2.831-1.132-.823zM25.481 88.494l1.133.822-2.057 2.832-1.133-.823zM84.43 15.986l1.04.937-2.342 2.6-1.04-.936zM21.87 85.469l1.04.936-2.341 2.601-1.04-.937zM88.072 19.522l.937 1.04-2.6 2.343-.937-1.04zM18.593 82.088l.937 1.04-2.601 2.342-.937-1.04zM91.328 23.425l.823 1.133-2.832 2.057-.823-1.132zM15.684 78.385l.823 1.132-2.832 2.058-.822-1.133zM96.52 32.128l.57 1.279-3.198 1.423-.57-1.278zM11.109 70.161l.569 1.279-3.197 1.423-.57-1.279zM98.407 36.85l.433 1.332-3.33 1.081-.432-1.331zM9.483 65.74l.432 1.33-3.329 1.082-.432-1.331zM99.795 41.726l.291 1.37-3.423.727-.29-1.37zM8.34 61.17l.292 1.37-3.424.728-.29-1.37zM100.66 46.73l.146 1.393-3.48.366-.147-1.392zM7.674 56.506l.146 1.392-3.48.366-.147-1.392zM100.811 56.873l-.146 1.392-3.48-.365.145-1.393zM7.821 47.101l-.146 1.392-3.48-.365.145-1.393zM100.09 61.895l-.291 1.369-3.424-.728.291-1.369zM8.631 42.46l-.291 1.37-3.423-.728.29-1.37zM98.84 66.827l-.432 1.331-3.329-1.081.433-1.332zM9.918 37.93l-.433 1.331-3.329-1.082.433-1.331zM97.098 71.585l-.569 1.28-3.197-1.424.57-1.28zM11.677 33.558l-.57 1.28-3.197-1.424.57-1.279zM92.149 80.439l-.823 1.133-2.832-2.058.823-1.132zM16.506 25.482l-.823 1.133-2.831-2.057.823-1.133zM89.017 84.431l-.937 1.04-2.6-2.341.936-1.04zM19.528 21.869l-.936 1.04-2.601-2.342.936-1.04zM85.48 88.076l-1.041.936-2.342-2.6 1.04-.937zM22.91 18.59l-1.04.937-2.341-2.601 1.04-.937zM81.574 91.328l-1.133.823-2.057-2.831 1.132-.823zM26.617 15.684l-1.133.823-2.057-2.832 1.132-.823zM72.873 96.524l-1.279.57-1.423-3.198 1.278-.57zM34.838 11.105l-1.279.57-1.423-3.198 1.279-.57zM68.151 98.405l-1.331.432-1.082-3.329 1.332-.432zM39.259 9.485l-1.332.433-1.081-3.33 1.331-.432zM63.272 99.799l-1.369.29-.728-3.422 1.37-.291zM43.83 8.337l-1.369.291-.727-3.423 1.37-.291zM58.27 100.662l-1.393.146-.366-3.48 1.393-.147zM48.494 7.672l-1.392.147-.366-3.481 1.392-.147z"/></g></g></svg>
+`, S = `<svg focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 105 105"><path id="mod_clock_svg_hours" d="M55.7 64.5h-6.4l.6-44h5.2z"/></svg>
+`, w = `<svg focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 105 105"><path d="M55.1,64.5h-5.2l0.8-58h3.6L55.1,64.5z"/></svg>
+`, L = `<svg focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 105 105"><path d="M57.8,21.3c0-2.9-2.4-5.2-5.2-5.2s-5.3,2.3-5.3,5.2c0,2.7,2,4.8,4.5,5.2V69h1.5V26.5C55.8,26.2,57.8,24,57.8,21.3z"/></svg>
+`, C = p`*,:before,:after{box-sizing:border-box}:host{--sbb-clock-hours-animation-start-angle: 0deg;--sbb-clock-seconds-animation-start-angle: 0deg;--sbb-clock-hours-animation-duration: 0s;--sbb-clock-seconds-animation-duration: 0s;--sbb-clock-animation-play-state: paused;--sbb-clock-seconds-hand-color: var(--sbb-color-red);display:block}.sbb-clock{position:relative;width:100%;height:100%;aspect-ratio:1/1;overflow:hidden;contain:content}.sbb-clock__face,.sbb-clock__hand-hours,.sbb-clock__hand-minutes,.sbb-clock__hand-seconds{position:absolute;top:0;right:0;bottom:0;left:0;transform-origin:center center;transform:rotate(0);transform-style:preserve-3d;backface-visibility:hidden}.sbb-clock__hand-minutes{transition:transform .2s cubic-bezier(.4,2.08,.55,.44)}@supports not (aspect-ratio: 1/1){.sbb-clock__hand-minutes{transform-origin:50% 49.625%}}.sbb-clock__hand-hours{animation-name:rotate;animation-duration:43200s;animation-iteration-count:infinite;animation-timing-function:linear;animation-play-state:var(--sbb-clock-animation-play-state)}.sbb-clock__hand-hours--initial-hour{animation-name:hand-hours-animation-initial-hour;animation-duration:var(--sbb-clock-hours-animation-duration);animation-play-state:var(--sbb-clock-animation-play-state);animation-iteration-count:1}.sbb-clock__hand-minutes--no-transition{transition:none}.sbb-clock__hand-seconds{animation-name:hand-seconds-animation;animation-duration:60s;animation-timing-function:linear;animation-play-state:var(--sbb-clock-animation-play-state);animation-iteration-count:infinite;fill:var(--sbb-clock-seconds-hand-color)}.sbb-clock__hand-seconds--initial-minute{animation-name:hand-seconds-animation-initial-minute;animation-duration:var(--sbb-clock-seconds-animation-duration);animation-play-state:var(--sbb-clock-animation-play-state);animation-iteration-count:1}:host(:not([data-initialized])) :is(.sbb-clock__hand-hours,.sbb-clock__hand-minutes,.sbb-clock__hand-seconds){display:none}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes hand-hours-animation-initial-hour{0%{transform:rotate(var(--sbb-clock-hours-animation-start-angle))}to{transform:rotate(360deg)}}@keyframes hand-seconds-animation{0%{transform:rotate(0)}97.5%,to{transform:rotate(360deg)}}@keyframes hand-seconds-animation-initial-minute{0%{transform:rotate(var(--sbb-clock-seconds-animation-start-angle))}97.5%,to{transform:rotate(360deg)}}`;
+var E = Object.defineProperty, A = Object.getOwnPropertyDescriptor, k = (t, n, s, i) => {
+  for (var o = i > 1 ? void 0 : i ? A(n, s) : n, e = t.length - 1, a; e >= 0; e--)
+    (a = t[e]) && (o = (i ? a(n, s, o) : a(o)) || o);
+  return i && o && E(n, s, o), o;
 };
-const P = 12, T = 60, b = 60, N = 50, v = 360, M = 30, F = 6, I = 360 / 58.5, x = 60, U = 3600, k = {
+const O = 12, P = 60, u = 60, T = 50, b = 360, v = 30, N = 6, F = 360 / 58.5, I = 60, x = 3600, M = {
   once: !0,
   passive: !0
 };
-let c = class extends g {
+let c = class extends H {
   constructor() {
     super(...arguments), this.now = null, this._moveHoursHandFn = () => this._moveHoursHand(), this._moveMinutesHandFn = () => this._moveMinutesHand(), this._handlePageVisibilityChange = async () => {
       document.visibilityState === "hidden" ? await this._stopClock() : this.now || await this._startClock();
     };
   }
-  willUpdate(t) {
-    super.willUpdate(t), !u && t.has("now") && (this.now ? (this._removeSecondsAnimationStyles(), this._removeHoursAnimationStyles(), this._stopClock()) : this._startClock());
+  async willUpdate(t) {
+    super.willUpdate(t), !_ && t.has("now") && await this._startOrConfigureClock();
   }
-  _addEventListeners() {
-    document.addEventListener("visibilitychange", this._handlePageVisibilityChange, !1);
+  async firstUpdated(t) {
+    super.firstUpdated(t), _ || (document.addEventListener("visibilitychange", this._handlePageVisibilityChange, !1), await this._startOrConfigureClock());
   }
-  _removeEventListeners() {
-    var t, s;
-    document == null || document.removeEventListener("visibilitychange", this._handlePageVisibilityChange), (t = this._clockHandHours) == null || t.removeEventListener("animationend", this._moveHoursHandFn), (s = this._clockHandSeconds) == null || s.removeEventListener("animationend", this._moveMinutesHandFn), clearInterval(this._handMovement);
+  disconnectedCallback() {
+    super.disconnectedCallback(), this._removeEventListeners();
   }
-  _removeHoursAnimationStyles() {
-    var t;
-    (t = this._clockHandHours) == null || t.classList.remove("sbb-clock__hand-hours--initial-hour"), this.style.removeProperty("--sbb-clock-hours-animation-start-angle"), this.style.removeProperty("--sbb-clock-hours-animation-duration");
+  async _startOrConfigureClock() {
+    this.now ? (await this._stopClock(), this._resetSecondsHandAnimation(), this._setHandsStartingPosition()) : await this._startClock();
   }
-  _removeSecondsAnimationStyles() {
-    var t, s;
-    (t = this._clockHandSeconds) == null || t.classList.remove("sbb-clock__hand-seconds--initial-minute"), (s = this._clockHandMinutes) == null || s.classList.remove("sbb-clock__hand-minutes--no-transition"), this.style.removeProperty("--sbb-clock-seconds-animation-start-angle"), this.style.removeProperty("--sbb-clock-seconds-animation-duration");
+  /** Starts the clock by defining the hands starting position then starting the animations. */
+  async _startClock() {
+    var t, n;
+    (t = this._clockHandHours) == null || t.addEventListener(
+      "animationend",
+      this._moveHoursHandFn,
+      M
+    ), (n = this._clockHandSeconds) == null || n.addEventListener(
+      "animationend",
+      this._moveMinutesHandFn,
+      M
+    ), await new Promise(
+      () => setTimeout(() => {
+        var s;
+        this._setHandsStartingPosition(), (s = this.style) == null || s.setProperty("--sbb-clock-animation-play-state", "running");
+      }, T)
+    );
   }
-  /** Given the current date, calculates the hh/mm/ss values and the hh/mm/ss left to the next midnight. */
-  _assignCurrentTime() {
-    const t = this.now ? null : /* @__PURE__ */ new Date(), [s, o, i] = t ? [t.getHours(), t.getMinutes(), t.getSeconds()] : this.now.split(":").map((n) => +n);
-    this._hours = s % 12, this._minutes = o, this._seconds = i;
+  /** Stops the clock by removing all the animations. */
+  async _stopClock() {
+    var t, n, s, i;
+    clearInterval(this._handMovement), this._removeSecondsAnimationStyles(), this._removeHoursAnimationStyles(), (t = this._clockHandHours) == null || t.removeEventListener("animationend", this._moveHoursHandFn), (n = this._clockHandSeconds) == null || n.removeEventListener("animationend", this._moveMinutesHandFn), (s = this._clockHandMinutes) == null || s.classList.add("sbb-clock__hand-minutes--no-transition"), (i = this.style) == null || i.setProperty("--sbb-clock-animation-play-state", "paused");
   }
   /** Set the starting position for the three hands on the clock face. */
   _setHandsStartingPosition() {
-    var e, a, r, d, h, m, _;
+    var e, a, l, d, h, m;
     this._assignCurrentTime();
-    const t = b - this._seconds, s = T - this._minutes, o = P - this._hours;
-    let i = 0, n = 0;
-    t > 0 && (i += t, n = 1), s > 0 && (i += (s - n) * x, n = 1), o > 0 && (i += (o - n) * U), (e = this.style) == null || e.setProperty(
+    const t = u - this._seconds, n = P - this._minutes, s = O - this._hours;
+    let i = 0, o = 0;
+    t > 0 && (i += t, o = 1), n > 0 && (i += (n - o) * I, o = 1), s > 0 && (i += (s - o) * x), (e = this.style) == null || e.setProperty(
       "--sbb-clock-hours-animation-start-angle",
-      `${Math.ceil(this._hours * M + this._minutes / 2)}deg`
-    ), (a = this.style) == null || a.setProperty("--sbb-clock-hours-animation-duration", `${i}s`), (r = this.style) == null || r.setProperty(
+      `${Math.ceil(this._hours * v + this._minutes / 2)}deg`
+    ), (a = this.style) == null || a.setProperty("--sbb-clock-hours-animation-duration", `${i}s`), (l = this.style) == null || l.setProperty(
       "--sbb-clock-seconds-animation-start-angle",
-      `${Math.ceil(this._seconds * I)}deg`
-    ), (d = this.style) == null || d.setProperty("--sbb-clock-seconds-animation-duration", `${t}s`), this._setMinutesHand(), (h = this._clockHandSeconds) == null || h.classList.add("sbb-clock__hand-seconds--initial-minute"), (m = this._clockHandHours) == null || m.classList.add("sbb-clock__hand-hours--initial-hour"), (_ = this.style) == null || _.setProperty("--sbb-clock-animation-play-state", "running"), this.toggleAttribute("data-initialized", !0);
+      `${Math.ceil(this._seconds * F)}deg`
+    ), (d = this.style) == null || d.setProperty("--sbb-clock-seconds-animation-duration", `${t}s`), this._setMinutesHand(), (h = this._clockHandSeconds) == null || h.classList.add("sbb-clock__hand-seconds--initial-minute"), (m = this._clockHandHours) == null || m.classList.add("sbb-clock__hand-hours--initial-hour"), this.toggleAttribute("data-initialized", !0);
+  }
+  /** Given the current date, calculates the hh/mm/ss values and the hh/mm/ss left to the next midnight. */
+  _assignCurrentTime() {
+    const t = this.now ? null : /* @__PURE__ */ new Date(), [n, s, i] = t ? [t.getHours(), t.getMinutes(), t.getSeconds()] : this.now.split(":").map((o) => +o);
+    this._hours = n % 12, this._minutes = s, this._seconds = i;
   }
   /** Set the starting position for the minutes hand. */
   _setMinutesHand() {
     var t;
     (t = this._clockHandMinutes) == null || t.style.setProperty(
       "transform",
-      `rotateZ(${Math.ceil(this._minutes * F)}deg)`
+      `rotateZ(${Math.ceil(this._minutes * N)}deg)`
     );
   }
   /** Move the hours hand to the next value. */
   _moveHoursHand() {
-    var s;
+    var n;
     this._removeHoursAnimationStyles();
-    let t = Math.ceil(this._hours * M + this._minutes / 2);
-    t >= v && (t -= v), (s = this._clockHandHours) == null || s.style.setProperty("transform", `rotateZ(${t}deg)`);
+    let t = Math.ceil(this._hours * v + this._minutes / 2);
+    t >= b && (t -= b), (n = this._clockHandHours) == null || n.style.setProperty("transform", `rotateZ(${t}deg)`);
   }
   /** Move the minutes hand to the next value. */
   _moveMinutesHand() {
     var t;
     (t = this._clockHandSeconds) == null || t.removeEventListener("animationend", this._moveMinutesHandFn), this._removeSecondsAnimationStyles(), this._addMinutesAndSetHands(), this._handMovement = setInterval(
       () => this._addMinutesAndSetHands(),
-      b * 1e3
+      u * 1e3
     );
   }
   _addMinutesAndSetHands() {
     this._minutes++, this._setMinutesHand();
   }
-  /** Stops the clock by removing all the animations. */
-  async _stopClock() {
-    var t, s, o, i, n, e;
-    clearInterval(this._handMovement), this.now ? (this._setHandsStartingPosition(), await new Promise((a) => setTimeout(a)), (t = this._clockHandSeconds) == null || t.classList.add("sbb-clock__hand-seconds--initial-minute"), (s = this._clockHandHours) == null || s.classList.add("sbb-clock__hand-hours--initial-hour")) : (this._removeSecondsAnimationStyles(), this._removeHoursAnimationStyles()), (o = this._clockHandHours) == null || o.removeEventListener("animationend", this._moveHoursHandFn), (i = this._clockHandSeconds) == null || i.removeEventListener("animationend", this._moveMinutesHandFn), (n = this._clockHandMinutes) == null || n.classList.add("sbb-clock__hand-minutes--no-transition"), (e = this.style) == null || e.setProperty("--sbb-clock-animation-play-state", "paused");
+  /**
+   * Removing animation by overriding with empty string,
+   * then triggering a reflow and re add original animation by removing override.
+   * @private
+   */
+  _resetSecondsHandAnimation() {
+    this._clockHandSeconds && (this._clockHandSeconds.style.animation = "", this._clockHandSeconds.offsetHeight, this._clockHandSeconds.style.removeProperty("animation"));
   }
-  /** Starts the clock by defining the hands starting position then starting the animations. */
-  async _startClock() {
-    var t, s;
-    (t = this._clockHandHours) == null || t.addEventListener(
-      "animationend",
-      this._moveHoursHandFn,
-      k
-    ), (s = this._clockHandSeconds) == null || s.addEventListener(
-      "animationend",
-      this._moveMinutesHandFn,
-      k
-    ), await new Promise(
-      () => setTimeout(() => this._setHandsStartingPosition(), N)
-    );
+  _removeEventListeners() {
+    var t, n;
+    document == null || document.removeEventListener("visibilitychange", this._handlePageVisibilityChange), (t = this._clockHandHours) == null || t.removeEventListener("animationend", this._moveHoursHandFn), (n = this._clockHandSeconds) == null || n.removeEventListener("animationend", this._moveMinutesHandFn), clearInterval(this._handMovement);
   }
-  async firstUpdated(t) {
-    super.firstUpdated(t), u || (this._addEventListeners(), this.now ? await this._stopClock() : await this._startClock());
+  _removeHoursAnimationStyles() {
+    var t;
+    (t = this._clockHandHours) == null || t.classList.remove("sbb-clock__hand-hours--initial-hour"), this.style.removeProperty("--sbb-clock-hours-animation-start-angle"), this.style.removeProperty("--sbb-clock-hours-animation-duration");
   }
-  disconnectedCallback() {
-    super.disconnectedCallback(), this._removeEventListeners();
+  _removeSecondsAnimationStyles() {
+    var t, n;
+    (t = this._clockHandSeconds) == null || t.classList.remove("sbb-clock__hand-seconds--initial-minute"), (n = this._clockHandMinutes) == null || n.classList.remove("sbb-clock__hand-minutes--no-transition"), this.style.removeProperty("--sbb-clock-seconds-animation-start-angle"), this.style.removeProperty("--sbb-clock-seconds-animation-duration");
   }
   render() {
-    return z`
+    return g`
       <div class="sbb-clock">
-        <span class="sbb-clock__face" .innerHTML=${S}></span>
+        <span class="sbb-clock__face" .innerHTML=${z}></span>
         <span
           class="sbb-clock__hand-hours"
-          .innerHTML=${w}
-          ${l((t) => {
+          .innerHTML=${S}
+          ${r((t) => {
       this._clockHandHours = t;
     })}
         ></span>
         <span
           class="sbb-clock__hand-minutes sbb-clock__hand-minutes--no-transition"
-          .innerHTML=${L}
-          ${l((t) => {
+          .innerHTML=${w}
+          ${r((t) => {
       this._clockHandMinutes = t;
     })}
         ></span>
         <span
           class="sbb-clock__hand-seconds"
-          .innerHTML=${E}
-          ${l((t) => {
+          .innerHTML=${L}
+          ${r((t) => {
       this._clockHandSeconds = t;
     })}
         ></span>
@@ -140,10 +151,10 @@ let c = class extends g {
   }
 };
 c.styles = C;
-p([
+k([
   y()
 ], c.prototype, "now", 2);
-c = p([
+c = k([
   f("sbb-clock")
 ], c);
 export {

package/core/datetime/date-adapter.d.ts

@@ -30,12 +30,13 @@ export declare abstract class DateAdapter<T = any> {
      * @param date
      */
     abstract getDayOfWeek(date: T): number;
+    /** Get the first day of the week (0: sunday; 1: monday; etc.). */
     abstract getFirstDayOfWeek(): number;
     /**
      * Get the number of days in a month.
      * @param year
      * @param month
-     * */
+     */
     abstract getNumDaysInMonth(date: T): number;
     /**
      * Get a list of all the months in a given style.
@@ -54,18 +55,19 @@ export declare abstract class DateAdapter<T = any> {
     /**
      * Checks whether a given `date` is valid.
      * @param date
-     * */
+     */
     abstract isValid(date: T | null | undefined): boolean;
-    /** Creates a new date by cloning the given one.
+    /**
+     * Creates a new date by cloning the given one.
      * @param date
-     * */
+     */
     abstract clone(date: T): T;
     /**
      * Creates a new date, given day, month and year; without date's overflow.
      * @param year
      * @param month The month of the date (1-indexed, 1 = January). Must be an integer 1 - 12.
      * @param date
-     * */
+     */
     abstract createDate(year: number, month: number, date: number): T;
     /**
      * Attempts to deserialize a value to a valid date object. This is different from parsing in that
@@ -74,7 +76,7 @@ export declare abstract class DateAdapter<T = any> {
      * the given value is already a valid date object or null.
      * @param value Either Date, ISOString, Unix Timestamp (number of seconds since Jan 1, 1970).
      * @returns The date if the input is valid, `null` otherwise.
-     * */
+     */
     deserialize(value: T | string | number | null | undefined): T | null;
     /**
      * Creates a new date adding the number of provided `years` to the provided `date`.
@@ -90,26 +92,33 @@ export declare abstract class DateAdapter<T = any> {
      * @param months The number of months to add.
      */
     abstract addCalendarMonths(date: T, months: number): T;
-    /** Creates a new date by adding the number of provided `days` to the provided `date`.
+    /**
+     * Creates a new date by adding the number of provided `days` to the provided `date`.
      * @param date The starting date.
      * @param days The number of days to add.
      */
     abstract addCalendarDays(date: T, days: number): T;
-    /** Get the date in the local format.
+    /**
+     * Get the date in the local format.
      * @param date The date to format
      * @returns The `date` in the local format as string.
      */
     abstract getAccessibilityFormatDate(date: T | string): string;
-    /** Get the given string as Date.
+    /**
+     * Get the given string as Date.
      * @param value The date in the format DD.MM.YYYY.
      * @param now The current date as Date.
      */
     abstract parse(value: string | null | undefined, now: T): T | undefined;
-    /** Format the given Date as string.
+    /**
+     * Format the given date as string.
      * @param date The date to format.
      */
-    abstract format(date: T | null | undefined): string;
-    /** Checks whether the given `obj` is a Date.
+    format(date: T | null | undefined, options?: {
+        weekdayStyle?: 'long' | 'short' | 'narrow';
+    }): string;
+    /**
+     * Checks whether the given `obj` is a Date.
      * @param obj The object to check.
      */
     abstract isDateInstance(obj: any): boolean;
@@ -118,7 +127,8 @@ export declare abstract class DateAdapter<T = any> {
      * @returns An invalid date.
      */
     abstract invalid(): T;
-    /** Get the given date as ISO String.
+    /**
+     * Get the given date as ISO String.
      * @param date The date to convert to ISO String.
      */
     toIso8601(date: T): string;

package/core/datetime/date-adapter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"date-adapter.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/datetime/date-adapter.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"date-adapter.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/datetime/date-adapter.ts"],"names":[],"mappings":"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"}

package/core/datetime/native-date-adapter.d.ts

@@ -59,7 +59,6 @@ export declare class NativeDateAdapter extends DateAdapter<Date> {
     deserialize(date: SbbDateLike | null | undefined): Date | null;
     /** Returns the right format for the `valueAsDate` property. */
     parse(value: string | null | undefined, now: Date): Date | undefined;
-    format(value: Date | null | undefined): string;
     invalid(): Date;
     /**
      * Creates an array with the given length and fills it by mapping with the provided function.

package/core/datetime/native-date-adapter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"native-date-adapter.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/datetime/native-date-adapter.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAEpD,OAAO,EAAE,WAAW,EAAe,MAAM,mBAAmB,CAAC;AAU7D,qBAAa,iBAAkB,SAAQ,WAAW,CAAC,IAAI,CAAC;IACtD,OAAO,CAAC,QAAQ,CAAC,iBAAiB,CAAS;gBAExB,gBAAgB,GAAE,MAAW;IAKhD,uCAAuC;IAChC,OAAO,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM;IAIlC,wCAAwC;IACjC,QAAQ,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM;IAInC,sCAAsC;IAC/B,OAAO,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM;IAIlC,kDAAkD;IAC3C,YAAY,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM;IAIvC,yCAAyC;IAClC,0BAA0B,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM;IAS9D;;;;OAIG;IACI,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,EAAE;IAKlE,iGAAiG;IAC1F,YAAY,IAAI,MAAM,EAAE;IAK/B;;;;OAIG;IACI,iBAAiB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,EAAE;IAM/D,iBAAiB,IAAI,MAAM;IAIlC,6EAA6E;IACtE,iBAAiB,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM;IAI5C,4BAA4B;IACrB,KAAK,IAAI,IAAI;IAIpB,+FAA+F;IACxF,UAAU,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,IAAI;IAmBlE,gDAAgD;IACzC,cAAc,CAAC,GAAG,EAAE,GAAG,GAAG,OAAO;IAIxC,uDAAuD;IAChD,OAAO,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,SAAS,GAAG,OAAO;IAItD,mDAAmD;IAC5C,KAAK,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI;IAI9B;;;;OAIG;IACI,gBAAgB,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI;IAIxD;;;;OAIG;IACI,iBAAiB,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI;IAQ1D,yFAAyF;IAClF,eAAe,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,GAAG,IAAI;IAKtD,6EAA6E;IAC7D,WAAW,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI;IAkB9E,+DAA+D;IACxD,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,EAAE,GAAG,EAAE,IAAI,GAAG,IAAI,GAAG,SAAS;IA4BpE,MAAM,CAAC,KAAK,EAAE,IAAI,GAAG,IAAI,GAAG,SAAS,GAAG,MAAM;IAoBrC,OAAO,IAAI,IAAI;IAI/B;;;;OAIG;IACH,OAAO,CAAC,MAAM;IAQd,gEAAgE;IAChE,OAAO,CAAC,uBAAuB;CAShC;AAED,eAAO,MAAM,kBAAkB,mBAA0B,CAAC"}
+{"version":3,"file":"native-date-adapter.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/datetime/native-date-adapter.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAEpD,OAAO,EAAE,WAAW,EAAe,MAAM,mBAAmB,CAAC;AAU7D,qBAAa,iBAAkB,SAAQ,WAAW,CAAC,IAAI,CAAC;IACtD,OAAO,CAAC,QAAQ,CAAC,iBAAiB,CAAS;gBAExB,gBAAgB,GAAE,MAAW;IAKhD,uCAAuC;IAChC,OAAO,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM;IAIlC,wCAAwC;IACjC,QAAQ,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM;IAInC,sCAAsC;IAC/B,OAAO,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM;IAIlC,kDAAkD;IAC3C,YAAY,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM;IAIvC,yCAAyC;IAClC,0BAA0B,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM;IAS9D;;;;OAIG;IACI,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,EAAE;IAKlE,iGAAiG;IAC1F,YAAY,IAAI,MAAM,EAAE;IAK/B;;;;OAIG;IACI,iBAAiB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,EAAE;IAM/D,iBAAiB,IAAI,MAAM;IAIlC,6EAA6E;IACtE,iBAAiB,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM;IAI5C,4BAA4B;IACrB,KAAK,IAAI,IAAI;IAIpB,+FAA+F;IACxF,UAAU,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,IAAI;IAmBlE,gDAAgD;IACzC,cAAc,CAAC,GAAG,EAAE,GAAG,GAAG,OAAO;IAIxC,uDAAuD;IAChD,OAAO,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,SAAS,GAAG,OAAO;IAItD,mDAAmD;IAC5C,KAAK,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI;IAI9B;;;;OAIG;IACI,gBAAgB,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI;IAIxD;;;;OAIG;IACI,iBAAiB,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI;IAQ1D,yFAAyF;IAClF,eAAe,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,GAAG,IAAI;IAKtD,6EAA6E;IAC7D,WAAW,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI;IAkB9E,+DAA+D;IACxD,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,EAAE,GAAG,EAAE,IAAI,GAAG,IAAI,GAAG,SAAS;IA4B3D,OAAO,IAAI,IAAI;IAI/B;;;;OAIG;IACH,OAAO,CAAC,MAAM;IAId,gEAAgE;IAChE,OAAO,CAAC,uBAAuB;CAShC;AAED,eAAO,MAAM,kBAAkB,mBAA0B,CAAC"}

package/core/datetime.js

@@ -8,11 +8,27 @@ class l {
    * the given value is already a valid date object or null.
    * @param value Either Date, ISOString, Unix Timestamp (number of seconds since Jan 1, 1970).
    * @returns The date if the input is valid, `null` otherwise.
-   * */
+   */
   deserialize(t) {
     return t == null || this.isDateInstance(t) && this.isValid(t) ? t : this.invalid();
   }
-  /** Get the given date as ISO String.
+  /**
+   * Format the given date as string.
+   * @param date The date to format.
+   */
+  format(t, e) {
+    if (!this.isValid(t))
+      return "";
+    const r = /* @__PURE__ */ new Date(this.toIso8601(t) + "T00:00:00"), a = new Intl.DateTimeFormat("de-CH", {
+      day: "2-digit",
+      month: "2-digit",
+      year: "numeric"
+    }), n = (e == null ? void 0 : e.weekdayStyle) ?? "short";
+    let s = this.getDayOfWeekNames(n)[this.getDayOfWeek(t)];
+    return s = s.charAt(0).toUpperCase() + s.substring(1), n === "short" && (s = s.substring(0, 2)), `${s}, ${a.format(r)}`;
+  }
+  /**
+   * Get the given date as ISO String.
    * @param date The date to convert to ISO String.
    */
   toIso8601(t) {
@@ -72,7 +88,7 @@ class l {
   }
 }
 const D = /^\d{4}-\d{2}-\d{2}(?:T\d{2}:\d{2}:\d{2}(?:\.\d+)?(?:Z|(?:(?:\+|-)\d{2}:\d{2}))?)?$/;
-class c extends l {
+class g extends l {
   constructor(t = 15) {
     super(), this._cutoffYearOffset = t;
   }
@@ -187,7 +203,7 @@ class c extends l {
       if (t)
         if (Number.isNaN(+t)) {
           if (D.test(t))
-            return this.getValidDateOrNull(new Date(t));
+            return this.getValidDateOrNull(new Date(t.includes("T") ? t : t + "T00:00:00"));
         } else return this.getValidDateOrNull(new Date(+t * 1e3));
       else return null;
     else if (typeof t == "number")
@@ -208,19 +224,6 @@ class c extends l {
     }
     return new Date(n, +a[2] - 1, +a[1]);
   }
-  format(t) {
-    if (!t)
-      return "";
-    const e = `${i.current}-CH`, r = new Intl.DateTimeFormat("de-CH", {
-      day: "2-digit",
-      month: "2-digit",
-      year: "numeric"
-    });
-    let n = new Intl.DateTimeFormat(e, {
-      weekday: "short"
-    }).format(t);
-    return n = n.charAt(0).toUpperCase() + n.charAt(1), `${n}, ${r.format(t)}`;
-  }
   invalid() {
     return /* @__PURE__ */ new Date(NaN);
   }
@@ -230,10 +233,7 @@ class c extends l {
    * @param valueFunction The function of array's index used to fill the array.
    */
   _range(t, e) {
-    const r = Array(t);
-    for (let a = 0; a < t; a++)
-      r[a] = e(a);
-    return r;
+    return Array.from({ length: t }).map((r, a) => e(a));
   }
   /** Creates a date but allows the month and date to overflow. */
   _createDateWithOverflow(t, e, r) {
@@ -241,13 +241,13 @@ class c extends l {
     return t >= 0 && t < 100 && a.setFullYear(this.getYear(a) - 1900), a;
   }
 }
-const w = new c();
+const w = new g();
 export {
   o as DAYS_PER_ROW,
   l as DateAdapter,
   u as FORMAT_DATE,
   f as MONTHS_PER_ROW,
-  c as NativeDateAdapter,
+  g as NativeDateAdapter,
   d as YEARS_PER_PAGE,
   m as YEARS_PER_ROW,
   w as defaultDateAdapter

package/core/decorators/host-attributes.d.ts

@@ -8,10 +8,10 @@ import { AbstractConstructor } from '../mixins.js';
  *
  * @example
  *
+ * @customElement('my-element)
  * @hostAttributes({
  *   role: 'region'
  * })
- * @customElement('my-element)
  * export class MyElement extends LitElement {
  *   ...
  * }

package/core/decorators/slot-state.d.ts

@@ -0,0 +1,18 @@
+import { ReactiveElement } from 'lit';
+import { AbstractConstructor } from '../mixins.js';
+
+/**
+ * Adds the {@link SbbSlotStateController} to the related element.
+ *
+ * @example
+ *
+ * @customElement('my-element)
+ * @slotState()
+ * export class MyElement extends LitElement {
+ *   ...
+ * }
+ *
+ * @param attributes A record of attributes to apply to the element.
+ */
+export declare const slotState: () => (target: AbstractConstructor<ReactiveElement>) => void;
+//# sourceMappingURL=slot-state.d.ts.map

package/core/decorators/slot-state.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"slot-state.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/decorators/slot-state.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,eAAe,EAAE,MAAM,KAAK,CAAC;AAGrD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAExD;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,SAAS,iBAAkB,mBAAmB,CAAC,eAAe,CAAC,SAM3E,CAAC"}

package/core/decorators.d.ts

@@ -1,2 +1,3 @@
 export * from './decorators/host-attributes.js';
+export * from './decorators/slot-state.js';
 //# sourceMappingURL=decorators.d.ts.map

package/core/decorators.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"decorators.d.ts","sourceRoot":"","sources":["../../../src/elements/core/decorators.ts"],"names":[],"mappings":"AAAA,cAAc,iCAAiC,CAAC"}
+{"version":3,"file":"decorators.d.ts","sourceRoot":"","sources":["../../../src/elements/core/decorators.ts"],"names":[],"mappings":"AAAA,cAAc,iCAAiC,CAAC;AAChD,cAAc,4BAA4B,CAAC"}

package/core/decorators.js

@@ -1,18 +1,24 @@
 import { isServer as i } from "lit";
-function l(o, t) {
-  for (const [e, r] of Object.entries(t))
-    r ? o.setAttribute(e, r) : o.toggleAttribute(e, r !== null);
+import { SbbSlotStateController as d } from "./controllers.js";
+function l(o, e) {
+  for (const [t, r] of Object.entries(e))
+    r ? o.setAttribute(t, r) : o.toggleAttribute(t, r !== null);
 }
-const f = (o) => (t) => t.addInitializer((e) => {
-  i ? l(e, o) : e.addController({
+const m = (o) => (e) => e.addInitializer((t) => {
+  i ? l(t, o) : t.addController({
     hostConnected() {
-      l(e, o), e.removeController(this);
+      l(t, o), t.removeController(this);
     },
     hostUpdate() {
-      l(e, o), e.removeController(this);
+      l(t, o), t.removeController(this);
     }
   });
-});
+}), p = () => (o) => {
+  i || o.addInitializer(
+    (e) => new d(e)
+  );
+};
 export {
-  f as hostAttributes
+  m as hostAttributes,
+  p as slotState
 };