@blotch/dolan 22.2.8 → 22.2.9

package/dist/ui/components/dock/dock.ts

@@ -20,8 +20,10 @@ import {
 import { toSignal } from '@angular/core/rxjs-interop';
 import { RouterLink, RouterLinkActive } from '@angular/router';
 import {
+  type LayoutChangeDetail,
   LYNX_ELEMENTS,
   LynxAccessibilitySettings,
+  type LynxEvent,
   LynxRouterLinkActive,
 } from '@blotch/angular-lynx';
 
@@ -205,9 +207,6 @@ const CAPSULE_OPACITY = 0.1;
  */
 const ACCESSORY_ICON_COLOR = signal('var(--glass-foreground)').asReadonly();
 
-/** What Lynx's `layoutchange` event carries, as far as the dock reads it. */
-type LayoutChangeEvent = Event & { detail: { width: number } };
-
 /**
  * A CSS length in px.
  */
@@ -1014,8 +1013,8 @@ export class UiDock implements SearchFieldContainer {
     );
   });
 
-  protected measure(event: Event): void {
-    this.width.set((event as LayoutChangeEvent).detail.width);
+  protected measure({ detail }: LynxEvent<LayoutChangeDetail>): void {
+    this.width.set(detail.width);
   }
 
   /**

package/dist/ui/components/input/input.ts

@@ -91,7 +91,7 @@ import { cn } from '../../utils/cn';
         [attr.disabled]="disabled() || undefined"
         class="text-sm text-foreground"
         style="border: none; background: transparent; height: 100%; width: 100%; position: relative; z-index: 1;"
-        (bindinput)="onInput($any($event))"
+        (bindinput)="onInput($event)"
         (bindfocus)="onFocus()"
         (bindblur)="onBlur()"
       />

package/dist/ui/components/navigation-bar/navigation-bar.ts

@@ -12,8 +12,10 @@ import {
 } from '@angular/core';
 import { ROUTES, Router } from '@angular/router';
 import {
+  type LayoutChangeDetail,
   LYNX_ELEMENTS,
   LynxAccessibilitySettings,
+  type LynxEvent,
   LynxLocationStrategy,
 } from '@blotch/angular-lynx';
 
@@ -48,9 +50,6 @@ const ROW_PADDING: Readonly<Record<GlassDesign, number>> = {
 /** The space between a centered title and the controls beside it, in px. */
 const TITLE_GAP = 8;
 
-/** What Lynx's `layoutchange` event carries, as far as the bar reads it. */
-type LayoutChangeEvent = Event & { detail: { width: number } };
-
 /**
  * How the inline title comes in as the large title scrolls under the bar,
  * and how Material's bar changes color as content scrolls under it.
@@ -379,20 +378,20 @@ export class UiNavigationBar {
     ),
   );
 
-  protected measureRow(event: Event): void {
-    this.rowWidth.set((event as LayoutChangeEvent).detail.width);
+  protected measureRow({ detail }: LynxEvent<LayoutChangeDetail>): void {
+    this.rowWidth.set(detail.width);
   }
 
-  protected measureTitle(event: Event): void {
-    this.titleWidth.set((event as LayoutChangeEvent).detail.width);
+  protected measureTitle({ detail }: LynxEvent<LayoutChangeDetail>): void {
+    this.titleWidth.set(detail.width);
   }
 
-  protected measureLeading(event: Event): void {
-    this.leadingWidth.set((event as LayoutChangeEvent).detail.width);
+  protected measureLeading({ detail }: LynxEvent<LayoutChangeDetail>): void {
+    this.leadingWidth.set(detail.width);
   }
 
-  protected measureTrailing(event: Event): void {
-    this.trailingWidth.set((event as LayoutChangeEvent).detail.width);
+  protected measureTrailing({ detail }: LynxEvent<LayoutChangeDetail>): void {
+    this.trailingWidth.set(detail.width);
   }
 
   /**

package/dist/ui/components/search-field/search-field.ts

@@ -184,11 +184,11 @@ const iconSvg = (icon: IconName, color: string): string =>
         [value]="value()"
         [class]="inputClass()"
         [style.font-size.px]="look().fontSize"
-        (bindinput)="onInput($any($event))"
-        (bindconfirm)="onConfirm($any($event))"
+        (bindinput)="onInput($event)"
+        (bindconfirm)="onConfirm($event)"
         (bindfocus)="onFocus()"
         (bindblur)="onBlur()"
-        (bindkeyboardheightchange)="onKeyboard($any($event))"
+        (bindkeyboardheightchange)="onKeyboard($event)"
       />
       @if (value() && !disabled()) {
         <view

package/dist/ui/components/textarea/textarea.ts

@@ -85,7 +85,7 @@ import { cn } from '../../utils/cn';
         [attr.enable-scroll-bar]="maxLines() != null ? 'true' : null"
         class="text-sm text-foreground"
         style="border: none; background: transparent; height: 100%; width: 100%; line-height: 20px; position: relative; z-index: 1;"
-        (bindinput)="onInput($any($event))"
+        (bindinput)="onInput($event)"
         (bindfocus)="onFocus()"
         (bindblur)="onBlur()"
       ></textarea>

package/dist/ui/components/toolbar/bar-scroll.ts

@@ -12,7 +12,13 @@ import {
   type Signal,
   type WritableSignal,
 } from '@angular/core';
-import { LYNX_ELEMENTS, LynxSystemInfo } from '@blotch/angular-lynx';
+import {
+  type LayoutChangeDetail,
+  LYNX_ELEMENTS,
+  type LynxEvent,
+  LynxSystemInfo,
+  type ScrollDetail,
+} from '@blotch/angular-lynx';
 
 import { cn } from '../../utils/cn';
 import { type GlassDesign, injectGlassDesign } from '../glass/glass-design';
@@ -131,10 +137,6 @@ export const edgeFadeOverlay = (toward: 'bottom' | 'top'): string => {
   return `linear-gradient(to ${toward}, ${stops.join(', ')})`;
 };
 
-/** What Lynx sends with `scroll` and `layoutchange`, as far as this reads. */
-type ScrollDetail = { scrollTop: number; scrollHeight: number };
-type LayoutDetail = { height: number };
-
 /**
  * The platform, as SystemInfo names it, or undefined where there's no
  * SystemInfo to read, such as in unit tests, where LynxSystemInfo throws.
@@ -234,19 +236,19 @@ export class UiBarScroll {
     this.#renderer.listen(
       this.#element,
       'bindscroll',
-      (event: { detail: ScrollDetail }) => this.#scrolled(event.detail),
+      (event: LynxEvent<ScrollDetail>) => this.#scrolled(event.detail),
     ),
     // iOS and Android report the content's height when it changes, which a
     // frosted toolbar needs before anything scrolls.
     this.#renderer.listen(
       this.#element,
       'bindcontentsizechanged',
-      (event: { detail: ScrollDetail }) => this.#scrolled(event.detail),
+      (event: LynxEvent<ScrollDetail>) => this.#scrolled(event.detail),
     ),
     this.#renderer.listen(
       this.#element,
       'bindlayoutchange',
-      (event: { detail: LayoutDetail }) => {
+      (event: LynxEvent<LayoutChangeDetail>) => {
         this.viewport.set(event.detail.height);
         this.#update();
       },
@@ -334,16 +336,12 @@ export class UiBarScroll {
     return `linear-gradient(to bottom, ${stops.join(', ')})`;
   });
 
-  protected measureTop(event: Event): void {
-    this.topSpace.set(
-      (event as Event & { detail: LayoutDetail }).detail.height,
-    );
+  protected measureTop({ detail }: LynxEvent<LayoutChangeDetail>): void {
+    this.topSpace.set(detail.height);
   }
 
-  protected measureBottom(event: Event): void {
-    this.bottomSpace.set(
-      (event as Event & { detail: LayoutDetail }).detail.height,
-    );
+  protected measureBottom({ detail }: LynxEvent<LayoutChangeDetail>): void {
+    this.bottomSpace.set(detail.height);
   }
 
   #scrolled({ scrollTop, scrollHeight }: ScrollDetail): void {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blotch/dolan",
-  "version": "22.2.8",
+  "version": "22.2.9",
   "description": "CLI for adding @blotch/ui components to your project",
   "homepage": "https://github.com/Blotch-Smart-Frames/AngularLynx#readme",
   "bugs": {