@solhun/feedback-kit-core 0.1.0

package/src/widget/modal.ts

@@ -0,0 +1,526 @@
+// 리포트 모달의 상태기계.
+//
+// 여기엔 DOM 도 RN 도 없다. 렌더러는 `getState()` 를 그리고 사용자의 동작을 메서드로 되돌려준다.
+// 전송·재시도·멱등키는 전부 `FeedbackQueue` 에 맡긴다 — 이 모듈이 전송을 다시 구현하지 않는다.
+
+import type {
+  FeedbackPin,
+  FeedbackPriority,
+  FeedbackReport,
+  FeedbackScreenshot,
+} from "../types.js";
+import type { ReportParts } from "../report.js";
+import type { QueueStatus, SubmitOutcome } from "../queue.js";
+import {
+  captureWithinLimit,
+  SCREENSHOT_FAILED_MESSAGE,
+  type ScreenshotCapture,
+  type ScreenshotReencode,
+} from "./screenshot.js";
+import { FLOATING_BUTTON_ID, FocusRing } from "./focus.js";
+
+/** 코멘트 상한. 넘으면 자르지 않고 거부한다(사용자가 쓴 글을 임의로 삭제하지 않는다). */
+export const COMMENT_MAX_CHARS = 4000;
+
+export const COMMENT_REQUIRED_MESSAGE = "의견을 입력해주세요";
+export const COMMENT_TOO_LONG_MESSAGE = "4,000자 이하로 입력해주세요";
+export const SUBMIT_DONE_MESSAGE = "보냈습니다";
+export const SUBMIT_PENDING_MESSAGE = "대기 중";
+export const SUBMIT_FAILED_MESSAGE = "보내지 못했습니다";
+
+export type WidgetPlatform = "web" | "native";
+export type ScreenshotStatus = "none" | "capturing" | "ready" | "failed";
+export type ModalSubmitStatus = "idle" | "sending" | "sent" | "pending" | "failed";
+
+/** 모달 안에서 포커스를 받는 요소들의 고정 id. 렌더러가 그대로 매단다. */
+export const MODAL_FIELD_COMMENT = "comment";
+export const MODAL_FIELD_PRIORITY = "priority";
+export const MODAL_ACTION_ATTACH = "attach";
+export const MODAL_ACTION_REMOVE_SCREENSHOT = "remove-screenshot";
+export const MODAL_ACTION_PIN = "pin";
+export const MODAL_ACTION_PICK = "pick";
+export const MODAL_ACTION_RETRY = "retry";
+export const MODAL_ACTION_CANCEL = "cancel";
+export const MODAL_ACTION_SEND = "send";
+
+export interface ReportModalState {
+  open: boolean;
+  comment: string;
+  priority: FeedbackPriority;
+  screenshot: FeedbackScreenshot | null;
+  screenshotStatus: ScreenshotStatus;
+  screenshotMessage: string | null;
+  pin: FeedbackPin | null;
+  submitStatus: ModalSubmitStatus;
+  submitMessage: string | null;
+  commentError: string | null;
+  canSubmit: boolean;
+  /** 핀 찍기를 열 수 있는가. 스크린샷이 있어야 좌표가 의미를 갖는다. */
+  canPin: boolean;
+  showRetry: boolean;
+  /** 대기 큐에 남아 있는 건수. */
+  pending: number;
+  closeConfirmVisible: boolean;
+  /** 이 플랫폼에서 노출되는 부가 동작들. 웹은 요소 지목, 앱은 핀 찍기. */
+  actions: readonly string[];
+  focusOrder: readonly string[];
+  focused: string | null;
+  /** 모달이 닫힌 뒤 포커스를 돌려줄 곳. */
+  restoreFocusTo: string | null;
+}
+
+/** 모달이 큐에게 요구하는 최소 계약. `FeedbackQueue` 가 그대로 만족한다. */
+export interface ModalQueueLike {
+  submit(report: FeedbackReport): Promise<SubmitOutcome>;
+  retryNow(): Promise<void>;
+  size(): Promise<number>;
+  subscribe(listener: (status: QueueStatus) => void): () => void;
+  /** 현재 모달 제보만 다른 대기 항목과 구분하기 위한 제출 단위 결말. */
+  getOutcome?(clientSubmissionId: string): Pick<SubmitOutcome, "delivered" | "id"> | null;
+  /** 실제 FeedbackQueue의 online/주기 재시도 lifecycle. 테스트 대역은 생략할 수 있다. */
+  start?(): void;
+  stop?(): void;
+}
+
+export interface ReportModalOpts {
+  queue: ModalQueueLike;
+  /** 제보 조립. 보통 `buildReport` 를 부분 적용해 넘긴다. */
+  createReport: (parts: ReportParts) => Promise<FeedbackReport>;
+  platform: WidgetPlatform;
+  /** 모달을 열 때 자동 캡처. 없으면 캡처 단계를 건너뛴다. */
+  capture?: ScreenshotCapture | null;
+  reencode?: ScreenshotReencode | null;
+  screenshotLimitBytes?: number;
+}
+
+export type ReportModalListener = (state: ReportModalState) => void;
+
+export class ReportModalController {
+  private readonly queue: ModalQueueLike;
+  private readonly createReport: (parts: ReportParts) => Promise<FeedbackReport>;
+  private readonly platform: WidgetPlatform;
+  private readonly capture: ScreenshotCapture | null;
+  private readonly reencode: ScreenshotReencode | null;
+  private readonly screenshotLimitBytes: number | undefined;
+
+  private readonly listeners = new Set<ReportModalListener>();
+  private readonly ring = new FocusRing();
+  private readonly unsubscribeQueue: () => void;
+
+  /** 사용자가 입력란을 건드렸는가. 열자마자 빨간 문구가 뜨는 걸 막으려고 둔다. */
+  private touched = false;
+  private submitAttempted = false;
+  private lastReport: FeedbackReport | null = null;
+  /** 이전 open/recapture가 늦게 끝나 최신 상태를 덮지 못하게 하는 세대 번호. */
+  private captureGeneration = 0;
+
+  private state: ReportModalState = {
+    open: false,
+    comment: "",
+    priority: "unset",
+    screenshot: null,
+    screenshotStatus: "none",
+    screenshotMessage: null,
+    pin: null,
+    submitStatus: "idle",
+    submitMessage: null,
+    commentError: null,
+    canSubmit: false,
+    canPin: false,
+    showRetry: false,
+    pending: 0,
+    closeConfirmVisible: false,
+    actions: [],
+    focusOrder: [],
+    focused: null,
+    restoreFocusTo: null,
+  };
+
+  constructor(opts: ReportModalOpts) {
+    this.queue = opts.queue;
+    this.createReport = opts.createReport;
+    this.platform = opts.platform;
+    this.capture = opts.capture ?? null;
+    this.reencode = opts.reencode ?? null;
+    this.screenshotLimitBytes = opts.screenshotLimitBytes;
+
+    // 현재 제보의 결말만 본다. 큐 전체 길이로 판단하면 다른 제보가 남았을 때 성공을 놓치거나,
+    // 현재 제보가 영구 실패로 빠졌을 때 큐가 비었다는 이유로 성공 처리하게 된다.
+    this.unsubscribeQueue = this.queue.subscribe((status) => {
+      this.patch({ pending: status.pending });
+      if (this.state.submitStatus !== "pending" || !this.lastReport) return;
+
+      const outcome = this.queue.getOutcome?.(this.lastReport.clientSubmissionId) ?? null;
+      const delivered = outcome?.delivered === true;
+      const rejected = outcome?.delivered === false;
+      // 오래된 테스트 대역처럼 제출 단위 API가 없는 경우에만 기존의 단일 큐 가정을 쓴다.
+      const legacyDrained = !this.queue.getOutcome && status.pending === 0;
+      if (delivered || legacyDrained) {
+        this.patch({ submitStatus: "sent", submitMessage: SUBMIT_DONE_MESSAGE });
+        this.close({ keepResult: true });
+      } else if (rejected) {
+        this.patch({ submitStatus: "failed", submitMessage: SUBMIT_FAILED_MESSAGE });
+      }
+    });
+    this.recompute();
+  }
+
+  // ── 조회 ──────────────────────────────────────────────────────────────────
+
+  getState(): ReportModalState {
+    return this.state;
+  }
+
+  /** 마지막으로 조립한 제보. 재시도가 같은 멱등키를 쓰는지 확인할 때 쓴다. */
+  getLastReport(): FeedbackReport | null {
+    return this.lastReport;
+  }
+
+  subscribe(listener: ReportModalListener): () => void {
+    this.listeners.add(listener);
+    listener(this.state);
+    return () => {
+      this.listeners.delete(listener);
+    };
+  }
+
+  dispose(): void {
+    this.unsubscribeQueue();
+    this.listeners.clear();
+  }
+
+  /** WidgetController가 소유한 큐 lifecycle을 함께 정리한다. */
+  stopQueue(): void {
+    this.queue.stop?.();
+  }
+
+  // ── 열기/닫기 ─────────────────────────────────────────────────────────────
+
+  async open(): Promise<void> {
+    if (this.state.open) return;
+    const wasPending = this.state.submitStatus === "pending" && this.lastReport !== null;
+    const pendingReport = wasPending ? this.lastReport : null;
+    this.touched = false;
+    this.submitAttempted = false;
+    this.patch({
+      open: true,
+      comment: pendingReport?.comment ?? "",
+      priority: pendingReport?.priority ?? "unset",
+      screenshot: pendingReport?.screenshot ?? null,
+      screenshotStatus: "none",
+      screenshotMessage: null,
+      pin: pendingReport?.pin ?? null,
+      submitStatus: wasPending ? "pending" : "idle",
+      submitMessage: wasPending ? SUBMIT_PENDING_MESSAGE : null,
+      closeConfirmVisible: false,
+      restoreFocusTo: null,
+    });
+    this.ring.focus(MODAL_FIELD_COMMENT);
+    this.patch({ focused: this.ring.current });
+    // 대기 항목을 다시 연 경우에는 최초 입력을 그대로 보여줘야 하므로 새 캡처로 덮지 않는다.
+    if (this.capture && !wasPending) await this.runCapture();
+  }
+
+  /**
+   * 닫기 요청. 쓰던 내용이 있으면 곧장 닫지 않고 확인을 받는다.
+   * @returns 실제로 닫혔으면 `"closed"`, 확인이 필요하면 `"confirm"`.
+   */
+  requestClose(): "closed" | "confirm" {
+    if (this.state.comment.length >= 1) {
+      this.patch({ closeConfirmVisible: true });
+      return "confirm";
+    }
+    this.close();
+    return "closed";
+  }
+
+  /** 확인 대화에서 "닫기"를 고른 경우. */
+  confirmClose(): void {
+    this.close();
+  }
+
+  /** 확인 대화에서 "계속 쓰기"를 고른 경우. 입력은 그대로 남는다. */
+  cancelClose(): void {
+    this.patch({ closeConfirmVisible: false });
+  }
+
+  /** 확인 없이 닫는다(요소 지목 모드로 넘어갈 때처럼 흐름이 이어지는 경우). */
+  dismiss(): void {
+    this.close();
+  }
+
+  private close(opts?: { keepResult?: boolean }): void {
+    this.captureGeneration += 1;
+    const keepDraft = opts?.keepResult || this.state.submitStatus === "pending";
+    const cleared = keepDraft
+      ? {}
+      : {
+          comment: "",
+          priority: "unset" as FeedbackPriority,
+          screenshot: null,
+          screenshotStatus: "none" as ScreenshotStatus,
+          screenshotMessage: null,
+          pin: null,
+          submitStatus: "idle" as ModalSubmitStatus,
+          submitMessage: null,
+        };
+    this.touched = false;
+    this.submitAttempted = false;
+    this.patch({
+      open: false,
+      closeConfirmVisible: false,
+      focused: null,
+      restoreFocusTo: FLOATING_BUTTON_ID,
+      ...cleared,
+    });
+  }
+
+  // ── 입력 ──────────────────────────────────────────────────────────────────
+
+  /** 상한을 넘겨도 값을 자르지 않는다. 거부는 하되 사용자가 쓴 글은 보존한다. */
+  setComment(value: string): void {
+    if (this.isDraftLocked()) return;
+    this.touched = true;
+    this.patch({ comment: value });
+  }
+
+  setPriority(priority: FeedbackPriority): void {
+    if (this.isDraftLocked()) return;
+    this.patch({ priority });
+  }
+
+  setPin(pin: FeedbackPin | null): void {
+    if (this.isDraftLocked()) return;
+    this.patch({ pin });
+  }
+
+  /** 스크린샷 제거 — 핀은 스크린샷 위 좌표라 함께 사라진다. */
+  removeScreenshot(): void {
+    if (this.isDraftLocked()) return;
+    this.captureGeneration += 1;
+    this.patch({
+      screenshot: null,
+      screenshotStatus: "none",
+      screenshotMessage: null,
+      pin: null,
+    });
+  }
+
+  async recapture(): Promise<void> {
+    if (!this.capture || this.isDraftLocked()) return;
+    await this.runCapture();
+  }
+
+  /** 캡처가 실패했을 때의 대체 경로 — 사용자가 직접 고른 파일. */
+  async attachFile(shot: FeedbackScreenshot): Promise<void> {
+    if (this.isDraftLocked()) return;
+    const generation = ++this.captureGeneration;
+    const outcome = await captureWithinLimit({
+      capture: () => shot,
+      reencode: this.reencode,
+      limitBytes: this.screenshotLimitBytes,
+    });
+    if (generation === this.captureGeneration && this.state.open && !this.isDraftLocked()) {
+      this.applyScreenshot(outcome.screenshot, outcome.failed);
+    }
+  }
+
+  private async runCapture(): Promise<void> {
+    const generation = ++this.captureGeneration;
+    this.patch({ screenshotStatus: "capturing", screenshotMessage: null });
+    const outcome = await captureWithinLimit({
+      capture: this.capture!,
+      reencode: this.reencode,
+      limitBytes: this.screenshotLimitBytes,
+    });
+    if (generation === this.captureGeneration && this.state.open) {
+      this.applyScreenshot(outcome.screenshot, outcome.failed);
+    }
+  }
+
+  private applyScreenshot(shot: FeedbackScreenshot | null, failed: boolean): void {
+    if (shot && !failed) {
+      // 핀은 이전 이미지 기준 좌표이므로 이미지가 바뀌면 함께 폐기한다.
+      this.patch({ screenshot: shot, screenshotStatus: "ready", screenshotMessage: null, pin: null });
+      return;
+    }
+    this.patch({
+      screenshot: null,
+      screenshotStatus: "failed",
+      screenshotMessage: SCREENSHOT_FAILED_MESSAGE,
+      pin: null,
+    });
+  }
+
+  // ── 포커스 ────────────────────────────────────────────────────────────────
+
+  tabNext(): string | null {
+    const next = this.ring.next();
+    this.patch({ focused: next });
+    return next;
+  }
+
+  tabPrev(): string | null {
+    const prev = this.ring.prev();
+    this.patch({ focused: prev });
+    return prev;
+  }
+
+  focus(id: string): boolean {
+    const ok = this.ring.focus(id);
+    if (ok) this.patch({ focused: this.ring.current });
+    return ok;
+  }
+
+  // ── 전송 ──────────────────────────────────────────────────────────────────
+
+  /**
+   * 제출. 실패해도 예외를 던지지 않는다 — 대기 큐에 남기고 입력을 보존한다.
+   * @returns 검증에 걸려 아무것도 보내지 않았으면 `null`.
+   */
+  async submit(): Promise<SubmitOutcome | null> {
+    this.submitAttempted = true;
+    if (this.state.submitStatus === "sending" || this.state.submitStatus === "pending") return null;
+    if (!this.isCommentValid()) {
+      this.recompute();
+      this.emit();
+      return null;
+    }
+
+    this.patch({ submitStatus: "sending", submitMessage: null });
+
+    const parts: ReportParts = {
+      kind: "report",
+      comment: this.state.comment,
+      priority: this.state.priority,
+      screenshot: this.state.screenshot,
+      pin: this.state.pin,
+      element: null,
+    };
+
+    let outcome: SubmitOutcome;
+    try {
+      const report = await this.createReport(parts);
+      this.lastReport = report;
+      outcome = await this.queue.submit(report);
+    } catch {
+      // 조립되지 않은 제보는 큐에 들어간 적이 없다. 대기 중으로 가장하지 않고 재시도 가능한
+      // 명시 실패로 남겨 사용자의 입력을 보존한다.
+      outcome = { delivered: false, id: null, queued: false };
+    }
+
+    if (outcome.delivered) {
+      this.patch({ submitStatus: "sent", submitMessage: SUBMIT_DONE_MESSAGE });
+      this.close({ keepResult: true });
+    } else if (outcome.queued) {
+      this.patch({ submitStatus: "pending", submitMessage: SUBMIT_PENDING_MESSAGE });
+    } else {
+      this.patch({ submitStatus: "failed", submitMessage: SUBMIT_FAILED_MESSAGE });
+    }
+    return outcome;
+  }
+
+  /** [다시 보내기]. 큐가 비면 완료로 넘어간다. */
+  async retry(): Promise<void> {
+    if (this.state.submitStatus !== "pending" && this.state.pending === 0) return;
+    const retryingCurrent = this.state.submitStatus === "pending";
+    if (retryingCurrent) this.patch({ submitStatus: "sending", submitMessage: null });
+    try {
+      await this.queue.retryNow();
+    } catch {
+      // retryNow 는 삼키는 게 정상이지만 방어적으로 한 번 더 막는다.
+    }
+    const remaining = await this.queue.size();
+    if (!retryingCurrent) {
+      this.patch({ pending: remaining });
+    } else {
+      const outcome = this.lastReport
+        ? this.queue.getOutcome?.(this.lastReport.clientSubmissionId) ?? null
+        : null;
+      const delivered = outcome?.delivered === true;
+      const rejected = outcome?.delivered === false;
+      const legacyDrained = !this.queue.getOutcome && remaining === 0;
+      if (delivered || legacyDrained) {
+        this.patch({ submitStatus: "sent", submitMessage: SUBMIT_DONE_MESSAGE });
+        this.close({ keepResult: true });
+      } else if (rejected) {
+        this.patch({ submitStatus: "failed", submitMessage: SUBMIT_FAILED_MESSAGE });
+      } else {
+        this.patch({ submitStatus: "pending", submitMessage: SUBMIT_PENDING_MESSAGE });
+      }
+    }
+  }
+
+  // ── 내부 ──────────────────────────────────────────────────────────────────
+
+  private isCommentValid(): boolean {
+    const value = this.state.comment;
+    return value.trim().length > 0 && value.length <= COMMENT_MAX_CHARS;
+  }
+
+  private isDraftLocked(): boolean {
+    return this.state.submitStatus === "sending" || this.state.submitStatus === "pending";
+  }
+
+  private commentErrorFor(): string | null {
+    const value = this.state.comment;
+    if (value.length > COMMENT_MAX_CHARS) return COMMENT_TOO_LONG_MESSAGE;
+    if (value.trim().length === 0) {
+      // 아직 아무것도 안 건드린 상태에서 경고를 띄우지 않는다.
+      return this.touched || this.submitAttempted ? COMMENT_REQUIRED_MESSAGE : null;
+    }
+    return null;
+  }
+
+  private actionsFor(): string[] {
+    // 웹은 DOM 요소를 직접 지목할 수 있고, 앱은 좌표(핀)로만 가리킨다.
+    return this.platform === "web" ? [MODAL_ACTION_PICK] : [MODAL_ACTION_PIN];
+  }
+
+  private focusOrderFor(): string[] {
+    const order: string[] = [MODAL_FIELD_COMMENT, MODAL_FIELD_PRIORITY];
+    if (this.state.screenshot) order.push(MODAL_ACTION_REMOVE_SCREENSHOT);
+    else order.push(MODAL_ACTION_ATTACH);
+    order.push(...this.actionsFor());
+    if (this.state.submitStatus === "pending") order.push(MODAL_ACTION_RETRY);
+    order.push(MODAL_ACTION_CANCEL, MODAL_ACTION_SEND);
+    return order;
+  }
+
+  private recompute(): void {
+    const commentError = this.commentErrorFor();
+    const canSubmit =
+      this.isCommentValid() &&
+      this.state.screenshotStatus !== "capturing" &&
+      (this.state.submitStatus === "idle" || this.state.submitStatus === "failed");
+    const canPin =
+      this.platform === "native" &&
+      this.state.screenshot !== null &&
+      this.state.screenshotStatus !== "capturing" &&
+      !this.isDraftLocked() &&
+      this.state.open;
+    const actions = this.actionsFor();
+    const focusOrder = this.state.open ? this.focusOrderFor() : [];
+    this.ring.setItems(focusOrder);
+    this.state = {
+      ...this.state,
+      commentError,
+      canSubmit,
+      canPin,
+      showRetry: this.state.submitStatus === "pending" || this.state.pending > 0,
+      actions,
+      focusOrder,
+      focused: this.state.open ? this.ring.current : null,
+    };
+  }
+
+  private patch(partial: Partial<ReportModalState>): void {
+    this.state = { ...this.state, ...partial };
+    this.recompute();
+    this.emit();
+  }
+
+  private emit(): void {
+    for (const listener of this.listeners) listener(this.state);
+  }
+}

package/src/widget/pin.ts

@@ -0,0 +1,110 @@
+// 핀 지정.
+//
+// 핀은 "한 화면에 하나"다. 그래서 컬렉션이 아니라 단일 값으로 들고, 새로 찍으면 덮어쓴다.
+// 좌표는 항상 0~1 상대값으로 보관한다 — 기기 해상도가 달라도 같은 지점을 가리키게 하려는 것이다.
+
+import type { FeedbackPin } from "../types.js";
+
+export interface PixelPoint {
+  x: number;
+  y: number;
+}
+
+export interface PixelSize {
+  width: number;
+  height: number;
+}
+
+function clamp01(value: number): number {
+  if (!Number.isFinite(value)) return 0;
+  if (value < 0) return 0;
+  if (value > 1) return 1;
+  return value;
+}
+
+/**
+ * 픽셀 좌표를 스크린샷 기준 0~1 상대 좌표로 바꾼다.
+ * 크기가 0 이하이면(아직 레이아웃 전) 나눗셈이 무의미하므로 0 으로 떨어뜨린다.
+ */
+export function normalizePin(point: PixelPoint, size: PixelSize): FeedbackPin {
+  const x = size.width > 0 ? point.x / size.width : 0;
+  const y = size.height > 0 ? point.y / size.height : 0;
+  return { x: clamp01(x), y: clamp01(y) };
+}
+
+/** 상대 좌표를 다시 픽셀로 되돌린다(마커를 그릴 때 쓴다). */
+export function denormalizePin(pin: FeedbackPin, size: PixelSize): PixelPoint {
+  return { x: pin.x * size.width, y: pin.y * size.height };
+}
+
+/**
+ * 핀 지정 화면의 상태기계.
+ *
+ * `draft` 는 지정 화면에서 만지는 중인 값, `confirmed` 는 모달로 돌아간 확정값이다.
+ * 둘을 나눠 둔 이유는 취소했을 때 이전 확정값이 살아남아야 하기 때문이다.
+ */
+export class PinController {
+  private confirmedPin: FeedbackPin | null;
+  private draftPin: FeedbackPin | null;
+  private opened = false;
+
+  constructor(initial: FeedbackPin | null = null) {
+    this.confirmedPin = initial;
+    this.draftPin = initial;
+  }
+
+  get isOpen(): boolean {
+    return this.opened;
+  }
+
+  get draft(): FeedbackPin | null {
+    return this.draftPin;
+  }
+
+  get confirmed(): FeedbackPin | null {
+    return this.confirmedPin;
+  }
+
+  /** 화면에 떠 있는 핀 개수. 단일 핀 규칙이라 0 아니면 1이다. */
+  get count(): number {
+    return this.draftPin ? 1 : 0;
+  }
+
+  open(): void {
+    this.draftPin = this.confirmedPin;
+    this.opened = true;
+  }
+
+  /** 탭한 자리에 핀을 찍는다. 기존 핀이 있으면 그 자리로 옮긴다(추가가 아니다). */
+  place(point: PixelPoint, size: PixelSize): FeedbackPin {
+    const pin = normalizePin(point, size);
+    this.draftPin = pin;
+    return pin;
+  }
+
+  /** 이미 상대 좌표를 갖고 있을 때 쓰는 경로. */
+  placeRelative(pin: FeedbackPin): FeedbackPin {
+    const next = { x: clamp01(pin.x), y: clamp01(pin.y) };
+    this.draftPin = next;
+    return next;
+  }
+
+  confirm(): FeedbackPin | null {
+    this.confirmedPin = this.draftPin;
+    this.opened = false;
+    return this.confirmedPin;
+  }
+
+  /** 취소 — 이전에 확정한 좌표로 되돌린다. */
+  cancel(): FeedbackPin | null {
+    this.draftPin = this.confirmedPin;
+    this.opened = false;
+    return this.confirmedPin;
+  }
+
+  reset(): void {
+    this.confirmedPin = null;
+    this.draftPin = null;
+    this.opened = false;
+  }
+}