@unabridged/midwest 0.17.0 → 0.18.0

package/dist/javascript/collection/app/components/midwest/notification_component/notification_component_controller.js

@@ -0,0 +1,60 @@
+import { Controller } from '@hotwired/stimulus';
+
+class Notification extends Controller {
+  container = null;
+  observer = null;
+  connect() {
+    this.container = this.element.closest("[popover]");
+    this.container?.showPopover?.();
+    requestAnimationFrame(() => {
+      this.element.classList.add("visible");
+    });
+    const frame = this.element.parentElement;
+    if (frame) {
+      this.observer = new MutationObserver(() => this.syncCountdown());
+      this.observer.observe(frame, { childList: true });
+      setTimeout(() => this.syncCountdown());
+    }
+  }
+  disconnect() {
+    this.observer?.disconnect();
+    this.observer = null;
+    if (this.container) {
+      const frame = this.container.querySelector("turbo-frame");
+      if (frame?.children.length === 0 && this.container.matches(":popover-open")) {
+        this.container.hidePopover?.();
+      }
+      this.container = null;
+    }
+  }
+  close() {
+    if (!this.element.classList.contains("animated")) {
+      this.element.remove();
+      return;
+    }
+    this.element.classList.add("closing");
+    setTimeout(() => {
+      this.element.remove();
+    }, 350);
+  }
+  syncCountdown() {
+    const timerEl = this.element.querySelector('[data-controller~="midwest-countdown-timer"]');
+    if (!timerEl)
+      return;
+    const timer = this.application.getControllerForElementAndIdentifier(
+      timerEl,
+      "midwest-countdown-timer"
+    );
+    if (!timer)
+      return;
+    const isTop = this.element === this.element.parentElement?.firstElementChild;
+    if (isTop) {
+      timer.resume();
+    } else {
+      timer.pause();
+    }
+  }
+}
+
+export { Notification as default };
+//# sourceMappingURL=notification_component_controller.js.map

package/dist/javascript/collection/app/components/midwest/notification_component/notification_component_controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"notification_component_controller.js","sources":["../../../../../../../app/components/midwest/notification_component/notification_component_controller.ts"],"sourcesContent":["import { Controller } from '@hotwired/stimulus'\n\ntype PopoverElement = HTMLElement & { showPopover?(): void; hidePopover?(): void }\n\ninterface PausableTimer {\n  pause(): void\n  resume(): void\n}\n\nexport default class Notification extends Controller<HTMLElement> {\n  private container: PopoverElement | null = null\n  private observer: MutationObserver | null = null\n\n  connect () {\n    this.container = this.element.closest<PopoverElement>('[popover]')\n    this.container?.showPopover?.()\n\n    requestAnimationFrame(() => {\n      this.element.classList.add('visible')\n    })\n\n    const frame = this.element.parentElement\n    if (frame) {\n      this.observer = new MutationObserver(() => this.syncCountdown())\n      this.observer.observe(frame, { childList: true })\n      // Defer until nested controllers (e.g. CountdownTimer) have connected\n      setTimeout(() => this.syncCountdown())\n    }\n  }\n\n  disconnect () {\n    this.observer?.disconnect()\n    this.observer = null\n\n    if (this.container) {\n      const frame = this.container.querySelector('turbo-frame')\n      if (frame?.children.length === 0 && this.container.matches(':popover-open')) {\n        this.container.hidePopover?.()\n      }\n      this.container = null\n    }\n  }\n\n  close () {\n    if (!this.element.classList.contains('animated')) {\n      this.element.remove()\n      return\n    }\n\n    this.element.classList.add('closing')\n    setTimeout(() => {\n      this.element.remove()\n    }, 350)\n  }\n\n  private syncCountdown (): void {\n    const timerEl = this.element.querySelector<HTMLElement>('[data-controller~=\"midwest-countdown-timer\"]')\n    if (!timerEl) return\n\n    const timer = this.application.getControllerForElementAndIdentifier(\n      timerEl, 'midwest-countdown-timer'\n    ) as PausableTimer | null\n    if (!timer) return\n\n    const isTop = this.element === this.element.parentElement?.firstElementChild\n    if (isTop) { timer.resume() } else { timer.pause() }\n  }\n}\n"],"names":[],"mappings":";;AASA,MAAqB,qBAAqB,UAAwB,CAAA;AAAA,EACxD,SAAmC,GAAA,IAAA,CAAA;AAAA,EACnC,QAAoC,GAAA,IAAA,CAAA;AAAA,EAE5C,OAAW,GAAA;AACT,IAAA,IAAA,CAAK,SAAY,GAAA,IAAA,CAAK,OAAQ,CAAA,OAAA,CAAwB,WAAW,CAAA,CAAA;AACjE,IAAA,IAAA,CAAK,WAAW,WAAc,IAAA,CAAA;AAE9B,IAAA,qBAAA,CAAsB,MAAM;AAC1B,MAAK,IAAA,CAAA,OAAA,CAAQ,SAAU,CAAA,GAAA,CAAI,SAAS,CAAA,CAAA;AAAA,KACrC,CAAA,CAAA;AAED,IAAM,MAAA,KAAA,GAAQ,KAAK,OAAQ,CAAA,aAAA,CAAA;AAC3B,IAAA,IAAI,KAAO,EAAA;AACT,MAAA,IAAA,CAAK,WAAW,IAAI,gBAAA,CAAiB,MAAM,IAAA,CAAK,eAAe,CAAA,CAAA;AAC/D,MAAA,IAAA,CAAK,SAAS,OAAQ,CAAA,KAAA,EAAO,EAAE,SAAA,EAAW,MAAM,CAAA,CAAA;AAEhD,MAAW,UAAA,CAAA,MAAM,IAAK,CAAA,aAAA,EAAe,CAAA,CAAA;AAAA,KACvC;AAAA,GACF;AAAA,EAEA,UAAc,GAAA;AACZ,IAAA,IAAA,CAAK,UAAU,UAAW,EAAA,CAAA;AAC1B,IAAA,IAAA,CAAK,QAAW,GAAA,IAAA,CAAA;AAEhB,IAAA,IAAI,KAAK,SAAW,EAAA;AAClB,MAAA,MAAM,KAAQ,GAAA,IAAA,CAAK,SAAU,CAAA,aAAA,CAAc,aAAa,CAAA,CAAA;AACxD,MAAI,IAAA,KAAA,EAAO,SAAS,MAAW,KAAA,CAAA,IAAK,KAAK,SAAU,CAAA,OAAA,CAAQ,eAAe,CAAG,EAAA;AAC3E,QAAA,IAAA,CAAK,UAAU,WAAc,IAAA,CAAA;AAAA,OAC/B;AACA,MAAA,IAAA,CAAK,SAAY,GAAA,IAAA,CAAA;AAAA,KACnB;AAAA,GACF;AAAA,EAEA,KAAS,GAAA;AACP,IAAA,IAAI,CAAC,IAAK,CAAA,OAAA,CAAQ,SAAU,CAAA,QAAA,CAAS,UAAU,CAAG,EAAA;AAChD,MAAA,IAAA,CAAK,QAAQ,MAAO,EAAA,CAAA;AACpB,MAAA,OAAA;AAAA,KACF;AAEA,IAAK,IAAA,CAAA,OAAA,CAAQ,SAAU,CAAA,GAAA,CAAI,SAAS,CAAA,CAAA;AACpC,IAAA,UAAA,CAAW,MAAM;AACf,MAAA,IAAA,CAAK,QAAQ,MAAO,EAAA,CAAA;AAAA,OACnB,GAAG,CAAA,CAAA;AAAA,GACR;AAAA,EAEQ,aAAuB,GAAA;AAC7B,IAAA,MAAM,OAAU,GAAA,IAAA,CAAK,OAAQ,CAAA,aAAA,CAA2B,8CAA8C,CAAA,CAAA;AACtG,IAAA,IAAI,CAAC,OAAA;AAAS,MAAA,OAAA;AAEd,IAAM,MAAA,KAAA,GAAQ,KAAK,WAAY,CAAA,oCAAA;AAAA,MAC7B,OAAA;AAAA,MAAS,yBAAA;AAAA,KACX,CAAA;AACA,IAAA,IAAI,CAAC,KAAA;AAAO,MAAA,OAAA;AAEZ,IAAA,MAAM,KAAQ,GAAA,IAAA,CAAK,OAAY,KAAA,IAAA,CAAK,QAAQ,aAAe,EAAA,iBAAA,CAAA;AAC3D,IAAA,IAAI,KAAO,EAAA;AAAE,MAAA,KAAA,CAAM,MAAO,EAAA,CAAA;AAAA,KAAS,MAAA;AAAE,MAAA,KAAA,CAAM,KAAM,EAAA,CAAA;AAAA,KAAE;AAAA,GACrD;AACF;;;;"}

package/dist/javascript/midwest.d.ts

@@ -46,8 +46,13 @@ declare class CountdownTimer extends Controller {
     };
     secondsValue: number;
     private timer;
+    private remaining;
+    private startTime;
     connect(): void;
     disconnect(): void;
+    pause(): void;
+    resume(): void;
+    private setPlayState;
 }
 
 declare class Chart extends Controller<HTMLElement> {