@theseam/ui-common 1.0.2-beta.51 → 1.0.2-beta.54

package/fesm2022/theseam-ui-common-states-counties-map.mjs

@@ -0,0 +1,317 @@
+import * as i0 from '@angular/core';
+import { InjectionToken, inject, Injectable, input, booleanAttribute, output, viewChild, effect, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
+import { geoAlbers, geoPath } from 'd3-geo';
+import { select } from 'd3-selection';
+import { feature, mesh } from 'topojson-client';
+import { ComponentHarness } from '@angular/cdk/testing';
+
+/** Default URL used when no config is provided. */
+const THE_SEAM_STATES_COUNTIES_MAP_DEFAULT_URL = '/assets/geoData/us.json';
+/** DI token for `TheSeamStatesCountiesMapConfig`. */
+const THE_SEAM_STATES_COUNTIES_MAP_CONFIG = new InjectionToken('THE_SEAM_STATES_COUNTIES_MAP_CONFIG');
+/**
+ * Register configuration for the states-counties map.
+ *
+ * ```ts
+ * bootstrapApplication(AppComponent, {
+ *   providers: [
+ *     provideStatesCountiesMap({ topologyUrl: '/static/us.json' }),
+ *   ],
+ * })
+ * ```
+ */
+function provideStatesCountiesMap(config) {
+    return { provide: THE_SEAM_STATES_COUNTIES_MAP_CONFIG, useValue: config };
+}
+
+/**
+ * Loads and caches TopoJSON topology data for the states/counties map.
+ *
+ * Provided in root so that multiple component instances share a single
+ * in-flight/cached request per URL.
+ */
+class TheSeamStatesCountiesMapDataService {
+    _config = inject(THE_SEAM_STATES_COUNTIES_MAP_CONFIG, {
+        optional: true,
+    });
+    _cache = new Map();
+    /**
+     * Load the topology from the configured URL (or an explicit override).
+     * Concurrent calls for the same URL share a single fetch promise.
+     */
+    load(url) {
+        const resolvedUrl = url ??
+            this._config?.topologyUrl ??
+            THE_SEAM_STATES_COUNTIES_MAP_DEFAULT_URL;
+        const existing = this._cache.get(resolvedUrl);
+        if (existing) {
+            return existing;
+        }
+        const promise = fetch(resolvedUrl).then(async (res) => {
+            if (!res.ok) {
+                throw new Error(`Failed to load topology from ${resolvedUrl}: ${res.status} ${res.statusText}`);
+            }
+            return (await res.json());
+        });
+        // Evict on rejection so a transient failure doesn't poison the cache.
+        promise.catch(() => this._cache.delete(resolvedUrl));
+        this._cache.set(resolvedUrl, promise);
+        return promise;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TheSeamStatesCountiesMapDataService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TheSeamStatesCountiesMapDataService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TheSeamStatesCountiesMapDataService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+/**
+ * Extract the state FIPS prefix from a county FIPS code.
+ *
+ * County codes are either 4- or 5-digit numeric ids (as strings or numbers
+ * depending on the source). The state portion is everything except the last
+ * three digits — i.e. 1 or 2 characters.
+ */
+function stateIdFromCountyId(countyId) {
+    const asString = `${countyId}`;
+    return asString.slice(0, asString.length - 3);
+}
+/**
+ * Whether the given county id appears in the selection list.
+ *
+ * Comparison is numeric so that `1001` and `"01001"` are treated as equal,
+ * matching the historical behavior of the Cotton app component.
+ */
+function isCountySelected(countyId, selectedCountyIds) {
+    if (!selectedCountyIds || selectedCountyIds.length === 0) {
+        return false;
+    }
+    const target = Number(countyId);
+    for (const id of selectedCountyIds) {
+        if (Number(id) === target) {
+            return true;
+        }
+    }
+    return false;
+}
+
+class TheSeamStatesCountiesMapComponent {
+    /** FIPS state code (e.g., `"48"` for Texas). Null/undefined renders nothing. */
+    stateNumber = input(undefined, ...(ngDevMode ? [{ debugName: "stateNumber" }] : []));
+    /** FIPS county codes to highlight with the `county-selected` class. */
+    selectedCountyIds = input([], ...(ngDevMode ? [{ debugName: "selectedCountyIds" }] : []));
+    /** Enable pointer interaction (click, enter, leave) on counties. */
+    interactive = input(false, ...(ngDevMode ? [{ debugName: "interactive", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+    countyClick = output();
+    countyEnter = output();
+    countyLeave = output();
+    _wrapper = viewChild.required('wrapper');
+    _data = inject(TheSeamStatesCountiesMapDataService);
+    _topologyPromise = null;
+    _lastRenderedState = null;
+    _lastRenderedInteractive = null;
+    _renderSerial = 0;
+    constructor() {
+        // Re-render whenever the state number or interactive mode changes.
+        effect(() => {
+            const state = this.stateNumber() ?? null;
+            const inter = this.interactive();
+            if (state !== this._lastRenderedState ||
+                inter !== this._lastRenderedInteractive) {
+                this._lastRenderedState = state;
+                this._lastRenderedInteractive = inter;
+                void this._render();
+            }
+        });
+        // Re-apply selection classes whenever selection changes (no full re-render).
+        effect(() => {
+            // Touch the signal so the effect tracks it.
+            this.selectedCountyIds();
+            this._updateSelectedCounties();
+        });
+        // Reflow on container resize.
+        effect((onCleanup) => {
+            const host = this._wrapper().nativeElement;
+            const observer = new ResizeObserver(() => void this._render());
+            observer.observe(host);
+            onCleanup(() => observer.disconnect());
+        });
+    }
+    _loadTopology() {
+        if (!this._topologyPromise) {
+            this._topologyPromise = this._data.load();
+        }
+        return this._topologyPromise;
+    }
+    async _render() {
+        const serial = ++this._renderSerial;
+        const host = this._wrapper().nativeElement;
+        const rect = host.getBoundingClientRect();
+        const width = rect.width;
+        const height = rect.height;
+        select(host).select('svg').remove();
+        const state = this.stateNumber();
+        if (!state) {
+            return;
+        }
+        const topology = await this._loadTopology();
+        if (serial !== this._renderSerial) {
+            return;
+        }
+        const statesLayer = topology.objects['states'];
+        const countiesLayer = topology.objects['counties'];
+        const states = feature(topology, statesLayer);
+        const stateFeature = states.features.find((d) => Number(d.id) === Number(state));
+        if (!stateFeature) {
+            return;
+        }
+        const projection = geoAlbers();
+        const path = geoPath().projection(projection);
+        projection.scale(1).translate([0, 0]);
+        const b = path.bounds(stateFeature);
+        const s = 0.95 / Math.max((b[1][0] - b[0][0]) / width, (b[1][1] - b[0][1]) / height);
+        const t = [
+            (width - s * (b[1][0] + b[0][0])) / 2,
+            (height - s * (b[1][1] + b[0][1])) / 2,
+        ];
+        projection.scale(s).translate(t);
+        const svg = select(host)
+            .append('svg')
+            .attr('width', width)
+            .attr('height', height);
+        svg
+            .append('path')
+            .datum(mesh(topology, statesLayer, (a, b1) => a !== b1))
+            .attr('class', 'mesh')
+            .attr('d', path);
+        svg
+            .append('path')
+            .datum(stateFeature)
+            .attr('class', 'outline')
+            .attr('d', path)
+            .attr('id', 'land');
+        svg
+            .append('clipPath')
+            .attr('id', 'clip-land')
+            .append('use')
+            .attr('xlink:href', '#land');
+        const counties = feature(topology, countiesLayer);
+        const stateNum = `${parseInt(state, 10)}`;
+        const stateCounties = counties.features.filter((d) => stateIdFromCountyId(d.id) === stateNum);
+        const isInteractive = this.interactive();
+        const countyPaths = svg
+            .selectAll('path[county-id]')
+            .data(stateCounties)
+            .enter()
+            .append('path')
+            .attr('d', path)
+            .attr('county-id', (d) => `${d.id}`.padStart(5, '0'));
+        if (isInteractive) {
+            countyPaths
+                .on('click', (_event, d) => {
+                this.countyClick.emit({
+                    id: `${d.id}`.padStart(5, '0'),
+                    feature: d,
+                });
+            })
+                .on('mouseenter', (_event, d) => {
+                select(_event.currentTarget).classed('county-hover', true);
+                this.countyEnter.emit({
+                    id: `${d.id}`.padStart(5, '0'),
+                    feature: d,
+                });
+            })
+                .on('mouseleave', (_event, d) => {
+                select(_event.currentTarget).classed('county-hover', false);
+                this.countyLeave.emit({
+                    id: `${d.id}`.padStart(5, '0'),
+                    feature: d,
+                });
+            });
+        }
+        this._updateSelectedCounties();
+    }
+    _updateSelectedCounties() {
+        const host = this._wrapper().nativeElement;
+        const selected = this.selectedCountyIds();
+        select(host)
+            .select('svg')
+            .selectAll('path[county-id]')
+            .attr('class', (d) => isCountySelected(d.id, selected)
+            ? 'county-selected'
+            : 'county');
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TheSeamStatesCountiesMapComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.15", type: TheSeamStatesCountiesMapComponent, isStandalone: true, selector: "seam-states-counties-map", inputs: { stateNumber: { classPropertyName: "stateNumber", publicName: "stateNumber", isSignal: true, isRequired: false, transformFunction: null }, selectedCountyIds: { classPropertyName: "selectedCountyIds", publicName: "selectedCountyIds", isSignal: true, isRequired: false, transformFunction: null }, interactive: { classPropertyName: "interactive", publicName: "interactive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { countyClick: "countyClick", countyEnter: "countyEnter", countyLeave: "countyLeave" }, host: { properties: { "class.seam-interactive": "interactive()" } }, viewQueries: [{ propertyName: "_wrapper", first: true, predicate: ["wrapper"], descendants: true, isSignal: true }], ngImport: i0, template: `<div #wrapper class="states-counties-map-wrapper"></div>`, isInline: true, styles: ["seam-states-counties-map{display:block;height:100%}seam-states-counties-map .states-counties-map-wrapper{width:100%;height:100%}seam-states-counties-map .outline{fill:none;stroke:#000;stroke-width:1.5px}seam-states-counties-map .mesh{fill:none;stroke:#fff;stroke-width:.5px;stroke-linejoin:round}seam-states-counties-map path{stroke-width:.5px;fill:none;stroke:#000}seam-states-counties-map .county{fill:transparent}seam-states-counties-map .county-selected{fill:#00f}seam-states-counties-map.seam-interactive .county,seam-states-counties-map.seam-interactive .county-selected{cursor:pointer}seam-states-counties-map .county-hover:not(.county-selected){fill:#0000001a}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TheSeamStatesCountiesMapComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'seam-states-counties-map', template: `<div #wrapper class="states-counties-map-wrapper"></div>`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: { '[class.seam-interactive]': 'interactive()' }, styles: ["seam-states-counties-map{display:block;height:100%}seam-states-counties-map .states-counties-map-wrapper{width:100%;height:100%}seam-states-counties-map .outline{fill:none;stroke:#000;stroke-width:1.5px}seam-states-counties-map .mesh{fill:none;stroke:#fff;stroke-width:.5px;stroke-linejoin:round}seam-states-counties-map path{stroke-width:.5px;fill:none;stroke:#000}seam-states-counties-map .county{fill:transparent}seam-states-counties-map .county-selected{fill:#00f}seam-states-counties-map.seam-interactive .county,seam-states-counties-map.seam-interactive .county-selected{cursor:pointer}seam-states-counties-map .county-hover:not(.county-selected){fill:#0000001a}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { stateNumber: [{ type: i0.Input, args: [{ isSignal: true, alias: "stateNumber", required: false }] }], selectedCountyIds: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedCountyIds", required: false }] }], interactive: [{ type: i0.Input, args: [{ isSignal: true, alias: "interactive", required: false }] }], countyClick: [{ type: i0.Output, args: ["countyClick"] }], countyEnter: [{ type: i0.Output, args: ["countyEnter"] }], countyLeave: [{ type: i0.Output, args: ["countyLeave"] }], _wrapper: [{ type: i0.ViewChild, args: ['wrapper', { isSignal: true }] }] } });
+
+/**
+ * Harness for `TheSeamStatesCountiesMapComponent`. Designed for use in both
+ * TestBed and Storybook (via `@marklb/storybook-harness`).
+ */
+class TheSeamStatesCountiesMapHarness extends ComponentHarness {
+    static hostSelector = 'seam-states-counties-map';
+    _wrapper = this.locatorFor('.states-counties-map-wrapper');
+    _svg = this.locatorForOptional('svg');
+    /** Whether the SVG has been rendered yet. */
+    async hasRendered() {
+        return (await this._svg()) !== null;
+    }
+    /** Returns all county path elements that have been rendered. */
+    async getCountyPaths() {
+        return this.locatorForAll('path[county-id]')();
+    }
+    /** Returns the path for a single county by its FIPS id, or null. */
+    async getCountyPath(countyId) {
+        const matches = await this.locatorForAll(`path[county-id="${countyId}"]`)();
+        return matches[0] ?? null;
+    }
+    /** Ids of every county currently marked `county-selected`. */
+    async getSelectedCountyIds() {
+        const paths = await this.locatorForAll('path.county-selected')();
+        const ids = await Promise.all(paths.map((p) => p.getAttribute('county-id')));
+        return ids.filter((id) => id !== null);
+    }
+    /** Click a county by FIPS id. Throws if the county is not rendered. */
+    async clickCounty(countyId) {
+        const path = await this.getCountyPath(countyId);
+        if (!path) {
+            throw new Error(`TheSeamStatesCountiesMapHarness.clickCounty: county ${countyId} is not rendered`);
+        }
+        await path.click();
+    }
+    /** Simulate pointer entering a county area. Throws if the county is not rendered. */
+    async enterCounty(countyId) {
+        const path = await this.getCountyPath(countyId);
+        if (!path) {
+            throw new Error(`TheSeamStatesCountiesMapHarness.enterCounty: county ${countyId} is not rendered`);
+        }
+        await path.hover();
+    }
+    /** Simulate pointer leaving a county area by hovering away from it. */
+    async leaveCounty(countyId) {
+        const path = await this.getCountyPath(countyId);
+        if (!path) {
+            throw new Error(`TheSeamStatesCountiesMapHarness.leaveCounty: county ${countyId} is not rendered`);
+        }
+        // Move pointer to the wrapper (outside any county) to trigger mouseleave.
+        await (await this.locatorFor('.states-counties-map-wrapper')()).hover();
+    }
+    /** Rendered viewport dimensions, for layout-sensitive assertions. */
+    async getWrapperSize() {
+        const rect = await (await this._wrapper()).getDimensions();
+        return { width: rect.width, height: rect.height };
+    }
+}
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { THE_SEAM_STATES_COUNTIES_MAP_CONFIG, THE_SEAM_STATES_COUNTIES_MAP_DEFAULT_URL, TheSeamStatesCountiesMapComponent, TheSeamStatesCountiesMapDataService, TheSeamStatesCountiesMapHarness, provideStatesCountiesMap };
+//# sourceMappingURL=theseam-ui-common-states-counties-map.mjs.map

package/fesm2022/theseam-ui-common-states-counties-map.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"theseam-ui-common-states-counties-map.mjs","sources":["../../../projects/ui-common/states-counties-map/states-counties-map-config.ts","../../../projects/ui-common/states-counties-map/states-counties-map-data.service.ts","../../../projects/ui-common/states-counties-map/states-counties-map.helpers.ts","../../../projects/ui-common/states-counties-map/states-counties-map.component.ts","../../../projects/ui-common/states-counties-map/testing/states-counties-map.harness.ts","../../../projects/ui-common/states-counties-map/theseam-ui-common-states-counties-map.ts"],"sourcesContent":["import { InjectionToken, Provider } from '@angular/core'\n\n/** Configuration for `TheSeamStatesCountiesMapComponent`. */\nexport interface TheSeamStatesCountiesMapConfig {\n  /**\n   * URL to the TopoJSON topology file.\n   *\n   * Defaults to `/assets/geoData/us.json` when the token is not provided.\n   * The file is not shipped with the library — each consuming app must\n   * place a compatible topology at this path or provide a different URL\n   * via `provideStatesCountiesMap({ topologyUrl })`.\n   */\n  readonly topologyUrl?: string\n}\n\n/** Default URL used when no config is provided. */\nexport const THE_SEAM_STATES_COUNTIES_MAP_DEFAULT_URL =\n  '/assets/geoData/us.json'\n\n/** DI token for `TheSeamStatesCountiesMapConfig`. */\nexport const THE_SEAM_STATES_COUNTIES_MAP_CONFIG =\n  new InjectionToken<TheSeamStatesCountiesMapConfig>(\n    'THE_SEAM_STATES_COUNTIES_MAP_CONFIG',\n  )\n\n/**\n * Register configuration for the states-counties map.\n *\n * ```ts\n * bootstrapApplication(AppComponent, {\n *   providers: [\n *     provideStatesCountiesMap({ topologyUrl: '/static/us.json' }),\n *   ],\n * })\n * ```\n */\nexport function provideStatesCountiesMap(\n  config: TheSeamStatesCountiesMapConfig,\n): Provider {\n  return { provide: THE_SEAM_STATES_COUNTIES_MAP_CONFIG, useValue: config }\n}\n","import { inject, Injectable } from '@angular/core'\nimport type { Topology } from 'topojson-specification'\n\nimport {\n  THE_SEAM_STATES_COUNTIES_MAP_CONFIG,\n  THE_SEAM_STATES_COUNTIES_MAP_DEFAULT_URL,\n} from './states-counties-map-config'\n\n/**\n * Loads and caches TopoJSON topology data for the states/counties map.\n *\n * Provided in root so that multiple component instances share a single\n * in-flight/cached request per URL.\n */\n@Injectable({ providedIn: 'root' })\nexport class TheSeamStatesCountiesMapDataService {\n  private readonly _config = inject(THE_SEAM_STATES_COUNTIES_MAP_CONFIG, {\n    optional: true,\n  })\n\n  private readonly _cache = new Map<string, Promise<Topology>>()\n\n  /**\n   * Load the topology from the configured URL (or an explicit override).\n   * Concurrent calls for the same URL share a single fetch promise.\n   */\n  load(url?: string): Promise<Topology> {\n    const resolvedUrl =\n      url ??\n      this._config?.topologyUrl ??\n      THE_SEAM_STATES_COUNTIES_MAP_DEFAULT_URL\n\n    const existing = this._cache.get(resolvedUrl)\n    if (existing) {\n      return existing\n    }\n\n    const promise = fetch(resolvedUrl).then(async (res) => {\n      if (!res.ok) {\n        throw new Error(\n          `Failed to load topology from ${resolvedUrl}: ${res.status} ${res.statusText}`,\n        )\n      }\n      return (await res.json()) as Topology\n    })\n\n    // Evict on rejection so a transient failure doesn't poison the cache.\n    promise.catch(() => this._cache.delete(resolvedUrl))\n    this._cache.set(resolvedUrl, promise)\n    return promise\n  }\n}\n","/**\n * Extract the state FIPS prefix from a county FIPS code.\n *\n * County codes are either 4- or 5-digit numeric ids (as strings or numbers\n * depending on the source). The state portion is everything except the last\n * three digits — i.e. 1 or 2 characters.\n */\nexport function stateIdFromCountyId(countyId: string | number): string {\n  const asString = `${countyId}`\n  return asString.slice(0, asString.length - 3)\n}\n\n/**\n * Whether the given county id appears in the selection list.\n *\n * Comparison is numeric so that `1001` and `\"01001\"` are treated as equal,\n * matching the historical behavior of the Cotton app component.\n */\nexport function isCountySelected(\n  countyId: string | number,\n  selectedCountyIds: readonly (string | number)[] | null | undefined,\n): boolean {\n  if (!selectedCountyIds || selectedCountyIds.length === 0) {\n    return false\n  }\n  const target = Number(countyId)\n  for (const id of selectedCountyIds) {\n    if (Number(id) === target) {\n      return true\n    }\n  }\n  return false\n}\n","import {\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  ElementRef,\n  effect,\n  inject,\n  input,\n  output,\n  viewChild,\n  ViewEncapsulation,\n} from '@angular/core'\nimport type { Feature, FeatureCollection, Geometry } from 'geojson'\nimport { geoAlbers, geoPath, type GeoPath } from 'd3-geo'\nimport { select, type Selection } from 'd3-selection'\nimport { feature as topoFeature, mesh as topoMesh } from 'topojson-client'\nimport type { GeometryCollection, Topology } from 'topojson-specification'\n\nimport { TheSeamStatesCountiesMapCountyEvent } from './states-counties-map.models'\nimport { TheSeamStatesCountiesMapDataService } from './states-counties-map-data.service'\nimport {\n  isCountySelected,\n  stateIdFromCountyId,\n} from './states-counties-map.helpers'\n\n@Component({\n  selector: 'seam-states-counties-map',\n  template: `<div #wrapper class=\"states-counties-map-wrapper\"></div>`,\n  styleUrls: ['./states-counties-map.component.scss'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: { '[class.seam-interactive]': 'interactive()' },\n})\nexport class TheSeamStatesCountiesMapComponent {\n  /** FIPS state code (e.g., `\"48\"` for Texas). Null/undefined renders nothing. */\n  readonly stateNumber = input<string | null | undefined>(undefined)\n\n  /** FIPS county codes to highlight with the `county-selected` class. */\n  readonly selectedCountyIds = input<readonly string[]>([])\n\n  /** Enable pointer interaction (click, enter, leave) on counties. */\n  readonly interactive = input(false, { transform: booleanAttribute })\n\n  readonly countyClick = output<TheSeamStatesCountiesMapCountyEvent>()\n  readonly countyEnter = output<TheSeamStatesCountiesMapCountyEvent>()\n  readonly countyLeave = output<TheSeamStatesCountiesMapCountyEvent>()\n\n  private readonly _wrapper =\n    viewChild.required<ElementRef<HTMLDivElement>>('wrapper')\n\n  private readonly _data = inject(TheSeamStatesCountiesMapDataService)\n\n  private _topologyPromise: Promise<Topology> | null = null\n  private _lastRenderedState: string | null = null\n  private _lastRenderedInteractive: boolean | null = null\n  private _renderSerial = 0\n\n  constructor() {\n    // Re-render whenever the state number or interactive mode changes.\n    effect(() => {\n      const state = this.stateNumber() ?? null\n      const inter = this.interactive()\n      if (\n        state !== this._lastRenderedState ||\n        inter !== this._lastRenderedInteractive\n      ) {\n        this._lastRenderedState = state\n        this._lastRenderedInteractive = inter\n        void this._render()\n      }\n    })\n\n    // Re-apply selection classes whenever selection changes (no full re-render).\n    effect(() => {\n      // Touch the signal so the effect tracks it.\n      this.selectedCountyIds()\n      this._updateSelectedCounties()\n    })\n\n    // Reflow on container resize.\n    effect((onCleanup) => {\n      const host = this._wrapper().nativeElement\n      const observer = new ResizeObserver(() => void this._render())\n      observer.observe(host)\n      onCleanup(() => observer.disconnect())\n    })\n  }\n\n  private _loadTopology(): Promise<Topology> {\n    if (!this._topologyPromise) {\n      this._topologyPromise = this._data.load()\n    }\n    return this._topologyPromise\n  }\n\n  private async _render(): Promise<void> {\n    const serial = ++this._renderSerial\n    const host = this._wrapper().nativeElement\n    const rect = host.getBoundingClientRect()\n    const width = rect.width\n    const height = rect.height\n\n    select(host).select('svg').remove()\n\n    const state = this.stateNumber()\n    if (!state) {\n      return\n    }\n\n    const topology = await this._loadTopology()\n    if (serial !== this._renderSerial) {\n      return\n    }\n\n    const statesLayer = topology.objects['states'] as GeometryCollection\n    const countiesLayer = topology.objects['counties'] as GeometryCollection\n\n    const states = topoFeature(\n      topology,\n      statesLayer,\n    ) as FeatureCollection<Geometry>\n\n    const stateFeature = states.features.find(\n      (d) => Number(d.id) === Number(state),\n    )\n    if (!stateFeature) {\n      return\n    }\n\n    const projection = geoAlbers()\n    const path: GeoPath = geoPath().projection(projection)\n\n    projection.scale(1).translate([0, 0])\n    const b = path.bounds(stateFeature)\n    const s =\n      0.95 / Math.max((b[1][0] - b[0][0]) / width, (b[1][1] - b[0][1]) / height)\n    const t: [number, number] = [\n      (width - s * (b[1][0] + b[0][0])) / 2,\n      (height - s * (b[1][1] + b[0][1])) / 2,\n    ]\n    projection.scale(s).translate(t)\n\n    const svg: Selection<SVGSVGElement, unknown, null, undefined> = select(host)\n      .append('svg')\n      .attr('width', width)\n      .attr('height', height)\n\n    svg\n      .append('path')\n      .datum(topoMesh(topology, statesLayer, (a, b1) => a !== b1))\n      .attr('class', 'mesh')\n      .attr('d', path as unknown as string)\n\n    svg\n      .append('path')\n      .datum(stateFeature)\n      .attr('class', 'outline')\n      .attr('d', path as unknown as string)\n      .attr('id', 'land')\n\n    svg\n      .append('clipPath')\n      .attr('id', 'clip-land')\n      .append('use')\n      .attr('xlink:href', '#land')\n\n    const counties = topoFeature(\n      topology,\n      countiesLayer,\n    ) as FeatureCollection<Geometry>\n\n    const stateNum = `${parseInt(state, 10)}`\n    const stateCounties = counties.features.filter(\n      (d) => stateIdFromCountyId(d.id as string | number) === stateNum,\n    )\n\n    const isInteractive = this.interactive()\n\n    const countyPaths = svg\n      .selectAll<SVGPathElement, Feature<Geometry>>('path[county-id]')\n      .data(stateCounties)\n      .enter()\n      .append('path')\n      .attr('d', path as unknown as string)\n      .attr('county-id', (d) => `${d.id}`.padStart(5, '0'))\n\n    if (isInteractive) {\n      countyPaths\n        .on('click', (_event, d) => {\n          this.countyClick.emit({\n            id: `${d.id}`.padStart(5, '0'),\n            feature: d,\n          })\n        })\n        .on('mouseenter', (_event: MouseEvent, d) => {\n          select(_event.currentTarget as SVGPathElement).classed(\n            'county-hover',\n            true,\n          )\n          this.countyEnter.emit({\n            id: `${d.id}`.padStart(5, '0'),\n            feature: d,\n          })\n        })\n        .on('mouseleave', (_event: MouseEvent, d) => {\n          select(_event.currentTarget as SVGPathElement).classed(\n            'county-hover',\n            false,\n          )\n          this.countyLeave.emit({\n            id: `${d.id}`.padStart(5, '0'),\n            feature: d,\n          })\n        })\n    }\n\n    this._updateSelectedCounties()\n  }\n\n  private _updateSelectedCounties(): void {\n    const host = this._wrapper().nativeElement\n    const selected = this.selectedCountyIds()\n    select(host)\n      .select<SVGSVGElement>('svg')\n      .selectAll<SVGPathElement, Feature<Geometry>>('path[county-id]')\n      .attr('class', (d) =>\n        isCountySelected(d.id as string | number, selected)\n          ? 'county-selected'\n          : 'county',\n      )\n  }\n}\n","import { ComponentHarness, TestElement } from '@angular/cdk/testing'\n\n/**\n * Harness for `TheSeamStatesCountiesMapComponent`. Designed for use in both\n * TestBed and Storybook (via `@marklb/storybook-harness`).\n */\nexport class TheSeamStatesCountiesMapHarness extends ComponentHarness {\n  static hostSelector = 'seam-states-counties-map'\n\n  private readonly _wrapper = this.locatorFor('.states-counties-map-wrapper')\n  private readonly _svg = this.locatorForOptional('svg')\n\n  /** Whether the SVG has been rendered yet. */\n  async hasRendered(): Promise<boolean> {\n    return (await this._svg()) !== null\n  }\n\n  /** Returns all county path elements that have been rendered. */\n  async getCountyPaths(): Promise<TestElement[]> {\n    return this.locatorForAll('path[county-id]')()\n  }\n\n  /** Returns the path for a single county by its FIPS id, or null. */\n  async getCountyPath(countyId: string): Promise<TestElement | null> {\n    const matches = await this.locatorForAll(`path[county-id=\"${countyId}\"]`)()\n    return matches[0] ?? null\n  }\n\n  /** Ids of every county currently marked `county-selected`. */\n  async getSelectedCountyIds(): Promise<string[]> {\n    const paths = await this.locatorForAll('path.county-selected')()\n    const ids = await Promise.all(paths.map((p) => p.getAttribute('county-id')))\n    return ids.filter((id): id is string => id !== null)\n  }\n\n  /** Click a county by FIPS id. Throws if the county is not rendered. */\n  async clickCounty(countyId: string): Promise<void> {\n    const path = await this.getCountyPath(countyId)\n    if (!path) {\n      throw new Error(\n        `TheSeamStatesCountiesMapHarness.clickCounty: county ${countyId} is not rendered`,\n      )\n    }\n    await path.click()\n  }\n\n  /** Simulate pointer entering a county area. Throws if the county is not rendered. */\n  async enterCounty(countyId: string): Promise<void> {\n    const path = await this.getCountyPath(countyId)\n    if (!path) {\n      throw new Error(\n        `TheSeamStatesCountiesMapHarness.enterCounty: county ${countyId} is not rendered`,\n      )\n    }\n    await path.hover()\n  }\n\n  /** Simulate pointer leaving a county area by hovering away from it. */\n  async leaveCounty(countyId: string): Promise<void> {\n    const path = await this.getCountyPath(countyId)\n    if (!path) {\n      throw new Error(\n        `TheSeamStatesCountiesMapHarness.leaveCounty: county ${countyId} is not rendered`,\n      )\n    }\n    // Move pointer to the wrapper (outside any county) to trigger mouseleave.\n    await (await this.locatorFor('.states-counties-map-wrapper')()).hover()\n  }\n\n  /** Rendered viewport dimensions, for layout-sensitive assertions. */\n  async getWrapperSize(): Promise<{ width: number; height: number }> {\n    const rect = await (await this._wrapper()).getDimensions()\n    return { width: rect.width, height: rect.height }\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["topoFeature","topoMesh"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@theseam/ui-common",
-  "version": "1.0.2-beta.51",
+  "version": "1.0.2-beta.54",
   "peerDependencies": {
     "@angular/cdk": "^20.2.3",
     "@angular/common": "^20.3.0",
@@ -267,6 +267,10 @@
       "types": "./shared/index.d.ts",
       "default": "./fesm2022/theseam-ui-common-shared.mjs"
     },
+    "./states-counties-map": {
+      "types": "./states-counties-map/index.d.ts",
+      "default": "./fesm2022/theseam-ui-common-states-counties-map.mjs"
+    },
     "./storage": {
       "types": "./storage/index.d.ts",
       "default": "./fesm2022/theseam-ui-common-storage.mjs"

package/states-counties-map/index.d.ts

@@ -0,0 +1,120 @@
+import * as _angular_core from '@angular/core';
+import { InjectionToken, Provider } from '@angular/core';
+import { Feature, Geometry } from 'geojson';
+import { Topology } from 'topojson-specification';
+import { ComponentHarness, TestElement } from '@angular/cdk/testing';
+
+/**
+ * Payload emitted by `countyClick` / `countyEnter` / `countyLeave` outputs.
+ *
+ * `id` is the FIPS county code as a string (e.g., `"01001"`), matching the
+ * format consumers pass to `selectedCountyIds`. `feature` is the raw
+ * GeoJSON feature produced by `topojson.feature(...)`.
+ */
+interface TheSeamStatesCountiesMapCountyEvent {
+    readonly id: string;
+    readonly feature: Feature<Geometry>;
+}
+
+declare class TheSeamStatesCountiesMapComponent {
+    /** FIPS state code (e.g., `"48"` for Texas). Null/undefined renders nothing. */
+    readonly stateNumber: _angular_core.InputSignal<string | null | undefined>;
+    /** FIPS county codes to highlight with the `county-selected` class. */
+    readonly selectedCountyIds: _angular_core.InputSignal<readonly string[]>;
+    /** Enable pointer interaction (click, enter, leave) on counties. */
+    readonly interactive: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly countyClick: _angular_core.OutputEmitterRef<TheSeamStatesCountiesMapCountyEvent>;
+    readonly countyEnter: _angular_core.OutputEmitterRef<TheSeamStatesCountiesMapCountyEvent>;
+    readonly countyLeave: _angular_core.OutputEmitterRef<TheSeamStatesCountiesMapCountyEvent>;
+    private readonly _wrapper;
+    private readonly _data;
+    private _topologyPromise;
+    private _lastRenderedState;
+    private _lastRenderedInteractive;
+    private _renderSerial;
+    constructor();
+    private _loadTopology;
+    private _render;
+    private _updateSelectedCounties;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TheSeamStatesCountiesMapComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TheSeamStatesCountiesMapComponent, "seam-states-counties-map", never, { "stateNumber": { "alias": "stateNumber"; "required": false; "isSignal": true; }; "selectedCountyIds": { "alias": "selectedCountyIds"; "required": false; "isSignal": true; }; "interactive": { "alias": "interactive"; "required": false; "isSignal": true; }; }, { "countyClick": "countyClick"; "countyEnter": "countyEnter"; "countyLeave": "countyLeave"; }, never, never, true, never>;
+}
+
+/** Configuration for `TheSeamStatesCountiesMapComponent`. */
+interface TheSeamStatesCountiesMapConfig {
+    /**
+     * URL to the TopoJSON topology file.
+     *
+     * Defaults to `/assets/geoData/us.json` when the token is not provided.
+     * The file is not shipped with the library — each consuming app must
+     * place a compatible topology at this path or provide a different URL
+     * via `provideStatesCountiesMap({ topologyUrl })`.
+     */
+    readonly topologyUrl?: string;
+}
+/** Default URL used when no config is provided. */
+declare const THE_SEAM_STATES_COUNTIES_MAP_DEFAULT_URL = "/assets/geoData/us.json";
+/** DI token for `TheSeamStatesCountiesMapConfig`. */
+declare const THE_SEAM_STATES_COUNTIES_MAP_CONFIG: InjectionToken<TheSeamStatesCountiesMapConfig>;
+/**
+ * Register configuration for the states-counties map.
+ *
+ * ```ts
+ * bootstrapApplication(AppComponent, {
+ *   providers: [
+ *     provideStatesCountiesMap({ topologyUrl: '/static/us.json' }),
+ *   ],
+ * })
+ * ```
+ */
+declare function provideStatesCountiesMap(config: TheSeamStatesCountiesMapConfig): Provider;
+
+/**
+ * Loads and caches TopoJSON topology data for the states/counties map.
+ *
+ * Provided in root so that multiple component instances share a single
+ * in-flight/cached request per URL.
+ */
+declare class TheSeamStatesCountiesMapDataService {
+    private readonly _config;
+    private readonly _cache;
+    /**
+     * Load the topology from the configured URL (or an explicit override).
+     * Concurrent calls for the same URL share a single fetch promise.
+     */
+    load(url?: string): Promise<Topology>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TheSeamStatesCountiesMapDataService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<TheSeamStatesCountiesMapDataService>;
+}
+
+/**
+ * Harness for `TheSeamStatesCountiesMapComponent`. Designed for use in both
+ * TestBed and Storybook (via `@marklb/storybook-harness`).
+ */
+declare class TheSeamStatesCountiesMapHarness extends ComponentHarness {
+    static hostSelector: string;
+    private readonly _wrapper;
+    private readonly _svg;
+    /** Whether the SVG has been rendered yet. */
+    hasRendered(): Promise<boolean>;
+    /** Returns all county path elements that have been rendered. */
+    getCountyPaths(): Promise<TestElement[]>;
+    /** Returns the path for a single county by its FIPS id, or null. */
+    getCountyPath(countyId: string): Promise<TestElement | null>;
+    /** Ids of every county currently marked `county-selected`. */
+    getSelectedCountyIds(): Promise<string[]>;
+    /** Click a county by FIPS id. Throws if the county is not rendered. */
+    clickCounty(countyId: string): Promise<void>;
+    /** Simulate pointer entering a county area. Throws if the county is not rendered. */
+    enterCounty(countyId: string): Promise<void>;
+    /** Simulate pointer leaving a county area by hovering away from it. */
+    leaveCounty(countyId: string): Promise<void>;
+    /** Rendered viewport dimensions, for layout-sensitive assertions. */
+    getWrapperSize(): Promise<{
+        width: number;
+        height: number;
+    }>;
+}
+
+export { THE_SEAM_STATES_COUNTIES_MAP_CONFIG, THE_SEAM_STATES_COUNTIES_MAP_DEFAULT_URL, TheSeamStatesCountiesMapComponent, TheSeamStatesCountiesMapDataService, TheSeamStatesCountiesMapHarness, provideStatesCountiesMap };
+export type { TheSeamStatesCountiesMapConfig, TheSeamStatesCountiesMapCountyEvent };

package/states-counties-map/package.json

@@ -0,0 +1,3 @@
+{
+  "module": "../fesm2022/theseam-ui-common-states-counties-map.mjs"
+}