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

package/fesm2022/theseam-ui-common-progress.mjs

@@ -1,9 +1,44 @@
+import { ComponentHarness } from '@angular/cdk/testing';
 import { __decorate } from 'tslib';
 import * as i0 from '@angular/core';
-import { Input, ViewEncapsulation, Component, NgModule } from '@angular/core';
+import { Input, ViewEncapsulation, Component, inject, DestroyRef, input, signal, computed, effect, ChangeDetectionStrategy, booleanAttribute, output, NgModule } from '@angular/core';
 import { InputBoolean, InputNumber } from '@theseam/ui-common/core';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
+import { TheSeamTooltipDirective } from '@theseam/ui-common/tooltip';
+
+/** Harness for a single cell inside `TheSeamSegmentedProgressBarComponent`. */
+class TheSeamSegmentedProgressBarCellHarness extends ComponentHarness {
+    static hostSelector = 'seam-segmented-progress-bar-cell';
+    /** The visual state of the cell, derived from its host classes. */
+    async getState() {
+        const host = await this.host();
+        if (await host.hasClass('bg-success')) {
+            return 'complete';
+        }
+        return 'default';
+    }
+    async click() {
+        return (await this.host()).click();
+    }
+}
+/** Harness for `TheSeamSegmentedProgressBarComponent`. */
+class TheSeamSegmentedProgressBarHarness extends ComponentHarness {
+    static hostSelector = 'seam-segmented-progress-bar';
+    _cells = this.locatorForAll(TheSeamSegmentedProgressBarCellHarness);
+    /** Gets harnesses for every rendered cell, in order. */
+    async getCells() {
+        return this._cells();
+    }
+    /** Clicks the cell at the given zero-based index. */
+    async clickCell(index) {
+        const cells = await this.getCells();
+        if (index < 0 || index >= cells.length) {
+            throw new Error(`TheSeamSegmentedProgressBarHarness.clickCell: index ${index} out of range (0..${cells.length - 1})`);
+        }
+        await cells[index].click();
+    }
+}
 
 function calcDashoffset(value, circumference) {
     const progress = value / 100;
@@ -71,17 +106,86 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                 type: Input
             }] } });
 
+class SegmentedProgressBarCellComponent {
+    _destroyRef = inject(DestroyRef);
+    step = input.required(...(ngDevMode ? [{ debugName: "step" }] : []));
+    _controlStatus = signal(null, ...(ngDevMode ? [{ debugName: "_controlStatus" }] : []));
+    _state = computed(() => {
+        const s = this.step();
+        if (s.completed !== undefined) {
+            return s.completed ? 'COMPLETE' : 'DEFAULT';
+        }
+        if (s.control) {
+            const status = this._controlStatus();
+            if (status === 'VALID' && (s.isCurrent || s.hasVisited)) {
+                return 'COMPLETE';
+            }
+            return 'DEFAULT';
+        }
+        return 'DEFAULT';
+    }, ...(ngDevMode ? [{ debugName: "_state" }] : []));
+    constructor() {
+        let sub;
+        effect(() => {
+            const s = this.step();
+            sub?.unsubscribe();
+            sub = undefined;
+            if (s.control) {
+                this._controlStatus.set(s.control.status);
+                sub = s.control.statusChanges.subscribe((status) => this._controlStatus.set(status));
+            }
+            else {
+                this._controlStatus.set(null);
+            }
+        });
+        this._destroyRef.onDestroy(() => sub?.unsubscribe());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: SegmentedProgressBarCellComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.15", type: SegmentedProgressBarCellComponent, isStandalone: true, selector: "seam-segmented-progress-bar-cell", inputs: { step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "class.bg-light": "_state() === \"DEFAULT\"", "class.bg-success": "_state() === \"COMPLETE\"" } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: SegmentedProgressBarCellComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'seam-segmented-progress-bar-cell',
+                    template: '',
+                    host: {
+                        '[class.bg-light]': '_state() === "DEFAULT"',
+                        '[class.bg-success]': '_state() === "COMPLETE"',
+                    },
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], ctorParameters: () => [], propDecorators: { step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: true }] }] } });
+
+class TheSeamSegmentedProgressBarComponent {
+    progressSteps = input([], ...(ngDevMode ? [{ debugName: "progressSteps" }] : []));
+    clickable = input(false, ...(ngDevMode ? [{ debugName: "clickable", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+    enableTooltip = input(false, ...(ngDevMode ? [{ debugName: "enableTooltip", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+    cellClicked = output();
+    onClickProgressCell(step) {
+        if (!this.clickable()) {
+            return;
+        }
+        this.cellClicked.emit(step);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TheSeamSegmentedProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: TheSeamSegmentedProgressBarComponent, isStandalone: true, selector: "seam-segmented-progress-bar", inputs: { progressSteps: { classPropertyName: "progressSteps", publicName: "progressSteps", isSignal: true, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clickable", isSignal: true, isRequired: false, transformFunction: null }, enableTooltip: { classPropertyName: "enableTooltip", publicName: "enableTooltip", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cellClicked: "cellClicked" }, ngImport: i0, template: "<div class=\"progress-bar--container\">\n  @for (step of progressSteps(); track step.value) {\n    <seam-segmented-progress-bar-cell\n      [step]=\"step\"\n      class=\"progress-bar--cell border\"\n      [class.is-clickable]=\"clickable()\"\n      (click)=\"onClickProgressCell(step)\"\n      [seamTooltip]=\"step.label\"\n      placement=\"bottom\"\n      container=\"body\"\n      [disableTooltip]=\"!enableTooltip()\"\n    />\n  }\n</div>\n", styles: [".progress-bar--container{display:flex;flex-direction:row;flex-wrap:wrap}.progress-bar--container .progress-bar--cell{width:25px;height:20px;border-radius:3px}.progress-bar--container .progress-bar--cell.is-clickable:hover:not(:disabled){cursor:pointer}\n"], dependencies: [{ kind: "component", type: SegmentedProgressBarCellComponent, selector: "seam-segmented-progress-bar-cell", inputs: ["step"] }, { kind: "directive", type: TheSeamTooltipDirective, selector: "[seamTooltip]", inputs: ["seamTooltip", "tooltipClass", "placement", "container", "disableTooltip", "showDelay", "hideDelay", "trigger"], exportAs: ["seamTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TheSeamSegmentedProgressBarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'seam-segmented-progress-bar', imports: [SegmentedProgressBarCellComponent, TheSeamTooltipDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"progress-bar--container\">\n  @for (step of progressSteps(); track step.value) {\n    <seam-segmented-progress-bar-cell\n      [step]=\"step\"\n      class=\"progress-bar--cell border\"\n      [class.is-clickable]=\"clickable()\"\n      (click)=\"onClickProgressCell(step)\"\n      [seamTooltip]=\"step.label\"\n      placement=\"bottom\"\n      container=\"body\"\n      [disableTooltip]=\"!enableTooltip()\"\n    />\n  }\n</div>\n", styles: [".progress-bar--container{display:flex;flex-direction:row;flex-wrap:wrap}.progress-bar--container .progress-bar--cell{width:25px;height:20px;border-radius:3px}.progress-bar--container .progress-bar--cell.is-clickable:hover:not(:disabled){cursor:pointer}\n"] }]
+        }], propDecorators: { progressSteps: [{ type: i0.Input, args: [{ isSignal: true, alias: "progressSteps", required: false }] }], clickable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clickable", required: false }] }], enableTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableTooltip", required: false }] }], cellClicked: [{ type: i0.Output, args: ["cellClicked"] }] } });
+
 class TheSeamProgressModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TheSeamProgressModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.15", ngImport: i0, type: TheSeamProgressModule, declarations: [ProgressCircleComponent], imports: [CommonModule], exports: [ProgressCircleComponent] });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.15", ngImport: i0, type: TheSeamProgressModule, declarations: [ProgressCircleComponent], imports: [CommonModule, TheSeamSegmentedProgressBarComponent], exports: [ProgressCircleComponent, TheSeamSegmentedProgressBarComponent] });
     static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TheSeamProgressModule, imports: [CommonModule] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TheSeamProgressModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ProgressCircleComponent],
-                    imports: [CommonModule],
-                    exports: [ProgressCircleComponent],
+                    imports: [CommonModule, TheSeamSegmentedProgressBarComponent],
+                    exports: [ProgressCircleComponent, TheSeamSegmentedProgressBarComponent],
                 }]
         }] });
 
@@ -89,5 +193,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ProgressCircleComponent, TheSeamProgressModule, calcDashoffset };
+export { ProgressCircleComponent, TheSeamProgressModule, TheSeamSegmentedProgressBarCellHarness, TheSeamSegmentedProgressBarComponent, TheSeamSegmentedProgressBarHarness, calcDashoffset };
 //# sourceMappingURL=theseam-ui-common-progress.mjs.map

package/fesm2022/theseam-ui-common-progress.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"theseam-ui-common-progress.mjs","sources":["../../../projects/ui-common/progress/progress-circle/progress-circle.component.ts","../../../projects/ui-common/progress/progress-circle/progress-circle.component.html","../../../projects/ui-common/progress/progress.module.ts","../../../projects/ui-common/progress/theseam-ui-common-progress.ts"],"sourcesContent":["import { BooleanInput, NumberInput } from '@angular/cdk/coercion'\nimport { Component, Input, ViewEncapsulation } from '@angular/core'\n\nimport { InputBoolean, InputNumber } from '@theseam/ui-common/core'\n\ninterface IProgressInfo {\n  dashoffset: number\n  circumference: number\n  percent: number\n}\n\nexport function calcDashoffset(value: number, circumference: number) {\n  const progress = value / 100\n  const dashoffset = circumference * (1 - progress)\n  return dashoffset\n}\n\n@Component({\n  selector: 'seam-progress-circle',\n  templateUrl: './progress-circle.component.html',\n  styleUrls: ['./progress-circle.component.scss'],\n  encapsulation: ViewEncapsulation.None,\n  standalone: false,\n})\nexport class ProgressCircleComponent {\n  static ngAcceptInputType_fillBackground: BooleanInput\n  static ngAcceptInputType_showText: BooleanInput\n  static ngAcceptInputType_hiddenOnEmpty: BooleanInput\n  static ngAcceptInputType_percentage: NumberInput\n  static ngAcceptInputType_pending: BooleanInput\n\n  private _percentage = 0\n\n  @Input() @InputBoolean() fillBackground = false\n  @Input() @InputBoolean() showText = false\n  @Input() @InputBoolean() hiddenOnEmpty = true\n  @Input() @InputBoolean() pending = false\n\n  @Input()\n  @InputNumber()\n  set percentage(value: number) {\n    this._percentage = value\n    this._progressInfo = this._getProgress()\n  }\n  get percentage(): number {\n    return this._percentage\n  }\n\n  public readonly radius = 15\n  public readonly circumference = 2 * Math.PI * this.radius\n\n  _progressInfo?: IProgressInfo | null\n\n  private _getProgress(): IProgressInfo {\n    return {\n      dashoffset: calcDashoffset(this.percentage || 0, this.circumference),\n      circumference: this.circumference,\n      percent: Math.floor(this.percentage || 0),\n    }\n  }\n}\n","<div\n  class=\"seam-progress-circle\"\n  *ngIf=\"_progressInfo as p\"\n  [class.seam-progress-circle--in-complete]=\"p.percent < 100\"\n  [class.seam-progress-circle--fill-bg]=\"fillBackground\"\n>\n  <div class=\"seam-progress-circle-inner\">\n    <ng-container *ngIf=\"p.percent > 0 || !hiddenOnEmpty\">\n      <svg\n        class=\"seam-progress-circle--icon-spinner\"\n        viewBox=\"0 0 40 40\"\n        [attr.data-percent]=\"p.percent\"\n      >\n        <circle\n          class=\"seam-progress-circle--icon-spinner-path seam-progress-circle--icon-spinner-path-bg\"\n          cx=\"20\"\n          cy=\"20\"\n          r=\"15\"\n          fill=\"none\"\n          stroke-width=\"4\"\n        ></circle>\n        <circle\n          class=\"seam-progress-circle--icon-spinner-path\"\n          cx=\"20\"\n          cy=\"20\"\n          r=\"15\"\n          fill=\"none\"\n          transform=\"rotate(-90, 20, 20)\"\n          stroke-width=\"4\"\n          stroke-miterlimit=\"10\"\n          [attr.stroke-dashoffset]=\"p.dashoffset\"\n          [style.stroke-dasharray]=\"p.circumference\"\n        ></circle>\n        <!-- Checkmark -->\n        <path\n          *ngIf=\"!pending && p.percent === 100\"\n          class=\"seam-progress-circle--icon-spinner-path\"\n          fill=\"none\"\n          stroke-width=\"4\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          d=\"M 11,22 L 18,28 L 28.5,17\"\n        ></path>\n        <!-- Hourglass -->\n        <!-- `p.percent === 101` is still here for backwards compatability, but planing to be removed. -->\n        <path\n          *ngIf=\"pending || p.percent === 101\"\n          class=\"seam-progress-circle--icon-hourglass\"\n          fill=\"none\"\n          d=\"M27.3,25.8c-0.2-2.5-1.6-4.6-3.6-5.8c2-1.2,3.4-3.3,3.6-5.8c0.7-0.3,1.2-1,1.2-1.8c0-1.1-0.9-2-2-2h-13\n          c-1.1,0-2,0.9-2,2c0,0.8,0.5,1.6,1.2,1.8c0.2,2.5,1.6,4.6,3.6,5.8c-2,1.2-3.4,3.3-3.6,5.8c-0.7,0.3-1.2,1-1.2,1.8c0,1.1,0.9,2,2,2\n          h13c1.1,0,2-0.9,2-2C28.6,26.9,28,26.1,27.3,25.8z M24.3,25.7h-8.5c0.3-2.1,2.1-3.6,4.2-3.6S24,23.6,24.3,25.7z M20,18\n          c-2.1,0-3.9-1.6-4.2-3.6h8.5C24,16.5,22.2,18,20,18z\"\n        ></path>\n      </svg>\n    </ng-container>\n    <div\n      class=\"seam-progress-circle--icon-text\"\n      *ngIf=\"showText && !pending && p.percent > 0 && p.percent < 100\"\n    >\n      <span>{{ p.percent }}</span>\n    </div>\n  </div>\n</div>\n","import { CommonModule } from '@angular/common'\nimport { NgModule } from '@angular/core'\n\nimport { ProgressCircleComponent } from './progress-circle/progress-circle.component'\n\n@NgModule({\n  declarations: [ProgressCircleComponent],\n  imports: [CommonModule],\n  exports: [ProgressCircleComponent],\n})\nexport class TheSeamProgressModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"theseam-ui-common-progress.mjs","sources":["../../../projects/ui-common/progress/testing/segmented-progress-bar.harness.ts","../../../projects/ui-common/progress/progress-circle/progress-circle.component.ts","../../../projects/ui-common/progress/progress-circle/progress-circle.component.html","../../../projects/ui-common/progress/segmented-progress-bar/segmented-progress-bar-cell.component.ts","../../../projects/ui-common/progress/segmented-progress-bar/segmented-progress-bar.component.ts","../../../projects/ui-common/progress/segmented-progress-bar/segmented-progress-bar.component.html","../../../projects/ui-common/progress/progress.module.ts","../../../projects/ui-common/progress/theseam-ui-common-progress.ts"],"sourcesContent":["import { ComponentHarness } from '@angular/cdk/testing'\n\n/** Harness for a single cell inside `TheSeamSegmentedProgressBarComponent`. */\nexport class TheSeamSegmentedProgressBarCellHarness extends ComponentHarness {\n  static hostSelector = 'seam-segmented-progress-bar-cell'\n\n  /** The visual state of the cell, derived from its host classes. */\n  async getState(): Promise<'default' | 'complete'> {\n    const host = await this.host()\n    if (await host.hasClass('bg-success')) {\n      return 'complete'\n    }\n    return 'default'\n  }\n\n  async click(): Promise<void> {\n    return (await this.host()).click()\n  }\n}\n\n/** Harness for `TheSeamSegmentedProgressBarComponent`. */\nexport class TheSeamSegmentedProgressBarHarness extends ComponentHarness {\n  static hostSelector = 'seam-segmented-progress-bar'\n\n  private readonly _cells = this.locatorForAll(\n    TheSeamSegmentedProgressBarCellHarness,\n  )\n\n  /** Gets harnesses for every rendered cell, in order. */\n  async getCells(): Promise<TheSeamSegmentedProgressBarCellHarness[]> {\n    return this._cells()\n  }\n\n  /** Clicks the cell at the given zero-based index. */\n  async clickCell(index: number): Promise<void> {\n    const cells = await this.getCells()\n    if (index < 0 || index >= cells.length) {\n      throw new Error(\n        `TheSeamSegmentedProgressBarHarness.clickCell: index ${index} out of range (0..${cells.length - 1})`,\n      )\n    }\n    await cells[index].click()\n  }\n}\n","import { BooleanInput, NumberInput } from '@angular/cdk/coercion'\nimport { Component, Input, ViewEncapsulation } from '@angular/core'\n\nimport { InputBoolean, InputNumber } from '@theseam/ui-common/core'\n\ninterface IProgressInfo {\n  dashoffset: number\n  circumference: number\n  percent: number\n}\n\nexport function calcDashoffset(value: number, circumference: number) {\n  const progress = value / 100\n  const dashoffset = circumference * (1 - progress)\n  return dashoffset\n}\n\n@Component({\n  selector: 'seam-progress-circle',\n  templateUrl: './progress-circle.component.html',\n  styleUrls: ['./progress-circle.component.scss'],\n  encapsulation: ViewEncapsulation.None,\n  standalone: false,\n})\nexport class ProgressCircleComponent {\n  static ngAcceptInputType_fillBackground: BooleanInput\n  static ngAcceptInputType_showText: BooleanInput\n  static ngAcceptInputType_hiddenOnEmpty: BooleanInput\n  static ngAcceptInputType_percentage: NumberInput\n  static ngAcceptInputType_pending: BooleanInput\n\n  private _percentage = 0\n\n  @Input() @InputBoolean() fillBackground = false\n  @Input() @InputBoolean() showText = false\n  @Input() @InputBoolean() hiddenOnEmpty = true\n  @Input() @InputBoolean() pending = false\n\n  @Input()\n  @InputNumber()\n  set percentage(value: number) {\n    this._percentage = value\n    this._progressInfo = this._getProgress()\n  }\n  get percentage(): number {\n    return this._percentage\n  }\n\n  public readonly radius = 15\n  public readonly circumference = 2 * Math.PI * this.radius\n\n  _progressInfo?: IProgressInfo | null\n\n  private _getProgress(): IProgressInfo {\n    return {\n      dashoffset: calcDashoffset(this.percentage || 0, this.circumference),\n      circumference: this.circumference,\n      percent: Math.floor(this.percentage || 0),\n    }\n  }\n}\n","<div\n  class=\"seam-progress-circle\"\n  *ngIf=\"_progressInfo as p\"\n  [class.seam-progress-circle--in-complete]=\"p.percent < 100\"\n  [class.seam-progress-circle--fill-bg]=\"fillBackground\"\n>\n  <div class=\"seam-progress-circle-inner\">\n    <ng-container *ngIf=\"p.percent > 0 || !hiddenOnEmpty\">\n      <svg\n        class=\"seam-progress-circle--icon-spinner\"\n        viewBox=\"0 0 40 40\"\n        [attr.data-percent]=\"p.percent\"\n      >\n        <circle\n          class=\"seam-progress-circle--icon-spinner-path seam-progress-circle--icon-spinner-path-bg\"\n          cx=\"20\"\n          cy=\"20\"\n          r=\"15\"\n          fill=\"none\"\n          stroke-width=\"4\"\n        ></circle>\n        <circle\n          class=\"seam-progress-circle--icon-spinner-path\"\n          cx=\"20\"\n          cy=\"20\"\n          r=\"15\"\n          fill=\"none\"\n          transform=\"rotate(-90, 20, 20)\"\n          stroke-width=\"4\"\n          stroke-miterlimit=\"10\"\n          [attr.stroke-dashoffset]=\"p.dashoffset\"\n          [style.stroke-dasharray]=\"p.circumference\"\n        ></circle>\n        <!-- Checkmark -->\n        <path\n          *ngIf=\"!pending && p.percent === 100\"\n          class=\"seam-progress-circle--icon-spinner-path\"\n          fill=\"none\"\n          stroke-width=\"4\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          d=\"M 11,22 L 18,28 L 28.5,17\"\n        ></path>\n        <!-- Hourglass -->\n        <!-- `p.percent === 101` is still here for backwards compatability, but planing to be removed. -->\n        <path\n          *ngIf=\"pending || p.percent === 101\"\n          class=\"seam-progress-circle--icon-hourglass\"\n          fill=\"none\"\n          d=\"M27.3,25.8c-0.2-2.5-1.6-4.6-3.6-5.8c2-1.2,3.4-3.3,3.6-5.8c0.7-0.3,1.2-1,1.2-1.8c0-1.1-0.9-2-2-2h-13\n          c-1.1,0-2,0.9-2,2c0,0.8,0.5,1.6,1.2,1.8c0.2,2.5,1.6,4.6,3.6,5.8c-2,1.2-3.4,3.3-3.6,5.8c-0.7,0.3-1.2,1-1.2,1.8c0,1.1,0.9,2,2,2\n          h13c1.1,0,2-0.9,2-2C28.6,26.9,28,26.1,27.3,25.8z M24.3,25.7h-8.5c0.3-2.1,2.1-3.6,4.2-3.6S24,23.6,24.3,25.7z M20,18\n          c-2.1,0-3.9-1.6-4.2-3.6h8.5C24,16.5,22.2,18,20,18z\"\n        ></path>\n      </svg>\n    </ng-container>\n    <div\n      class=\"seam-progress-circle--icon-text\"\n      *ngIf=\"showText && !pending && p.percent > 0 && p.percent < 100\"\n    >\n      <span>{{ p.percent }}</span>\n    </div>\n  </div>\n</div>\n","import {\n  ChangeDetectionStrategy,\n  Component,\n  DestroyRef,\n  computed,\n  effect,\n  inject,\n  input,\n  signal,\n} from '@angular/core'\nimport { FormControlStatus } from '@angular/forms'\nimport { Subscription } from 'rxjs'\n\nimport { TheSeamSegmentedProgressBarStep } from './segmented-progress-bar.models'\n\ntype CellState = 'DEFAULT' | 'COMPLETE'\n\n@Component({\n  selector: 'seam-segmented-progress-bar-cell',\n  template: '',\n  host: {\n    '[class.bg-light]': '_state() === \"DEFAULT\"',\n    '[class.bg-success]': '_state() === \"COMPLETE\"',\n  },\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SegmentedProgressBarCellComponent {\n  private readonly _destroyRef = inject(DestroyRef)\n\n  readonly step = input.required<TheSeamSegmentedProgressBarStep>()\n\n  private readonly _controlStatus = signal<FormControlStatus | null>(null)\n\n  protected readonly _state = computed<CellState>(() => {\n    const s = this.step()\n    if (s.completed !== undefined) {\n      return s.completed ? 'COMPLETE' : 'DEFAULT'\n    }\n    if (s.control) {\n      const status = this._controlStatus()\n      if (status === 'VALID' && (s.isCurrent || s.hasVisited)) {\n        return 'COMPLETE'\n      }\n      return 'DEFAULT'\n    }\n    return 'DEFAULT'\n  })\n\n  constructor() {\n    let sub: Subscription | undefined\n    effect(() => {\n      const s = this.step()\n      sub?.unsubscribe()\n      sub = undefined\n      if (s.control) {\n        this._controlStatus.set(s.control.status)\n        sub = s.control.statusChanges.subscribe((status) =>\n          this._controlStatus.set(status),\n        )\n      } else {\n        this._controlStatus.set(null)\n      }\n    })\n    this._destroyRef.onDestroy(() => sub?.unsubscribe())\n  }\n}\n","import {\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  input,\n  output,\n} from '@angular/core'\n\nimport { TheSeamTooltipDirective } from '@theseam/ui-common/tooltip'\n\nimport { SegmentedProgressBarCellComponent } from './segmented-progress-bar-cell.component'\nimport { TheSeamSegmentedProgressBarStep } from './segmented-progress-bar.models'\n\n@Component({\n  selector: 'seam-segmented-progress-bar',\n  templateUrl: './segmented-progress-bar.component.html',\n  styleUrls: ['./segmented-progress-bar.component.scss'],\n  imports: [SegmentedProgressBarCellComponent, TheSeamTooltipDirective],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class TheSeamSegmentedProgressBarComponent {\n  readonly progressSteps = input<TheSeamSegmentedProgressBarStep[]>([])\n  readonly clickable = input(false, { transform: booleanAttribute })\n  readonly enableTooltip = input(false, { transform: booleanAttribute })\n\n  readonly cellClicked = output<TheSeamSegmentedProgressBarStep>()\n\n  onClickProgressCell(step: TheSeamSegmentedProgressBarStep): void {\n    if (!this.clickable()) {\n      return\n    }\n    this.cellClicked.emit(step)\n  }\n}\n","<div class=\"progress-bar--container\">\n  @for (step of progressSteps(); track step.value) {\n    <seam-segmented-progress-bar-cell\n      [step]=\"step\"\n      class=\"progress-bar--cell border\"\n      [class.is-clickable]=\"clickable()\"\n      (click)=\"onClickProgressCell(step)\"\n      [seamTooltip]=\"step.label\"\n      placement=\"bottom\"\n      container=\"body\"\n      [disableTooltip]=\"!enableTooltip()\"\n    />\n  }\n</div>\n","import { CommonModule } from '@angular/common'\nimport { NgModule } from '@angular/core'\n\nimport { ProgressCircleComponent } from './progress-circle/progress-circle.component'\nimport { TheSeamSegmentedProgressBarComponent } from './segmented-progress-bar/segmented-progress-bar.component'\n\n@NgModule({\n  declarations: [ProgressCircleComponent],\n  imports: [CommonModule, TheSeamSegmentedProgressBarComponent],\n  exports: [ProgressCircleComponent, TheSeamSegmentedProgressBarComponent],\n})\nexport class TheSeamProgressModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

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.48",
+  "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/progress/index.d.ts

@@ -1,7 +1,26 @@
+import { ComponentHarness } from '@angular/cdk/testing';
 import { BooleanInput, NumberInput } from '@angular/cdk/coercion';
 import * as i0 from '@angular/core';
+import { AbstractControl } from '@angular/forms';
 import * as i2 from '@angular/common';
 
+/** Harness for a single cell inside `TheSeamSegmentedProgressBarComponent`. */
+declare class TheSeamSegmentedProgressBarCellHarness extends ComponentHarness {
+    static hostSelector: string;
+    /** The visual state of the cell, derived from its host classes. */
+    getState(): Promise<'default' | 'complete'>;
+    click(): Promise<void>;
+}
+/** Harness for `TheSeamSegmentedProgressBarComponent`. */
+declare class TheSeamSegmentedProgressBarHarness extends ComponentHarness {
+    static hostSelector: string;
+    private readonly _cells;
+    /** Gets harnesses for every rendered cell, in order. */
+    getCells(): Promise<TheSeamSegmentedProgressBarCellHarness[]>;
+    /** Clicks the cell at the given zero-based index. */
+    clickCell(index: number): Promise<void>;
+}
+
 interface IProgressInfo {
     dashoffset: number;
     circumference: number;
@@ -29,10 +48,48 @@ declare class ProgressCircleComponent {
     static ɵcmp: i0.ɵɵComponentDeclaration<ProgressCircleComponent, "seam-progress-circle", never, { "fillBackground": { "alias": "fillBackground"; "required": false; }; "showText": { "alias": "showText"; "required": false; }; "hiddenOnEmpty": { "alias": "hiddenOnEmpty"; "required": false; }; "pending": { "alias": "pending"; "required": false; }; "percentage": { "alias": "percentage"; "required": false; }; }, {}, never, never, false, never>;
 }
 
+/**
+ * Describes a single step rendered by `TheSeamSegmentedProgressBarComponent`.
+ *
+ * A step's visual state is derived from either an explicit `completed` flag
+ * or the validity of an injected `control`. When a `control` is provided,
+ * the step is considered visually complete only after it has been visited
+ * (either `isCurrent` or `hasVisited` is true) to avoid marking steps as
+ * done before the user has seen them.
+ */
+interface TheSeamSegmentedProgressBarStep {
+    /** Tooltip label shown on hover when `enableTooltip` is true. */
+    label: string;
+    /** Unique identifier for the step — used as the `@for` track key. */
+    value: string;
+    /**
+     * Explicit completion flag. When set, takes precedence over `control`.
+     * Leave undefined to derive state from `control` instead.
+     */
+    completed?: boolean;
+    /** Optional form control whose validity drives state when `completed` is unset. */
+    control?: AbstractControl;
+    /** Whether this step is the currently-active step. */
+    isCurrent?: boolean;
+    /** Whether the user has previously visited this step. */
+    hasVisited?: boolean;
+}
+
+declare class TheSeamSegmentedProgressBarComponent {
+    readonly progressSteps: i0.InputSignal<TheSeamSegmentedProgressBarStep[]>;
+    readonly clickable: i0.InputSignalWithTransform<boolean, unknown>;
+    readonly enableTooltip: i0.InputSignalWithTransform<boolean, unknown>;
+    readonly cellClicked: i0.OutputEmitterRef<TheSeamSegmentedProgressBarStep>;
+    onClickProgressCell(step: TheSeamSegmentedProgressBarStep): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TheSeamSegmentedProgressBarComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TheSeamSegmentedProgressBarComponent, "seam-segmented-progress-bar", never, { "progressSteps": { "alias": "progressSteps"; "required": false; "isSignal": true; }; "clickable": { "alias": "clickable"; "required": false; "isSignal": true; }; "enableTooltip": { "alias": "enableTooltip"; "required": false; "isSignal": true; }; }, { "cellClicked": "cellClicked"; }, never, never, true, never>;
+}
+
 declare class TheSeamProgressModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<TheSeamProgressModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<TheSeamProgressModule, [typeof ProgressCircleComponent], [typeof i2.CommonModule], [typeof ProgressCircleComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<TheSeamProgressModule, [typeof ProgressCircleComponent], [typeof i2.CommonModule, typeof TheSeamSegmentedProgressBarComponent], [typeof ProgressCircleComponent, typeof TheSeamSegmentedProgressBarComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<TheSeamProgressModule>;
 }
 
-export { ProgressCircleComponent, TheSeamProgressModule, calcDashoffset };
+export { ProgressCircleComponent, TheSeamProgressModule, TheSeamSegmentedProgressBarCellHarness, TheSeamSegmentedProgressBarComponent, TheSeamSegmentedProgressBarHarness, calcDashoffset };
+export type { TheSeamSegmentedProgressBarStep };

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"
+}