@thinkdx/storybook-addon-chronokit 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Nick Ferraro
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,136 @@
+# storybook-addon-chronokit
+
+Mock time in your Storybook stories. Chronokit replaces the global clock so a
+story can render at any moment you choose — **frozen** for a deterministic
+screenshot, or **fast-forwarded** so a minutes-long flow plays out in seconds.
+
+**▶︎ Live demo & docs: https://thinkdx.github.io/storybook-addon-chronokit/**
+
+![A flash-sale banner counting down through its warning and critical states and expiring in seconds, driven by a mocked clock running 30× real time](assets/flash-sale.gif)
+
+It's a single preview decorator driven by one story parameter:
+
+```ts
+parameters: {
+  date: {
+    now: new Date('2025-06-01T12:00:00').getTime(),
+    canProgress: true, // false = frozen
+    clockSpeed: 30,     // optional real-time multiplier
+  },
+}
+```
+
+## Why?
+
+Anything that renders differently depending on "what time is it now?" is painful
+to build and review against the real clock:
+
+- **Countdowns and timers** — you'd have to wait for them to reach interesting states.
+- **Relative timestamps** ("2 minutes ago") — never look the same twice.
+- **Expiry / scheduling UI** — sales, sessions, holds, tokens.
+
+Chronokit makes those states **deterministic** (freeze the clock) or **fast**
+(speed it up) without touching your component code — it mocks `Date` *and* the
+scheduling APIs (`setTimeout`, `setInterval`, `requestAnimationFrame`).
+
+## Requirements
+
+- Storybook **9 or later**
+
+## Installation
+
+> **Status:** chronokit isn't published to npm yet — see [Status](#status). The
+> setup below shows the intended API.
+
+```sh
+npm install --save-dev @thinkdx/storybook-addon-chronokit
+```
+
+## Setup
+
+Register the decorator globally in `.storybook/preview`:
+
+```ts
+// .storybook/preview.ts
+import type { Preview } from '@storybook/react-vite'
+import { mockDateDecorator } from '@thinkdx/storybook-addon-chronokit'
+
+const preview: Preview = {
+  decorators: [mockDateDecorator],
+}
+
+export default preview
+```
+
+## Usage
+
+Control the clock with the `date` parameter on any story, a component's `meta`,
+or globally in `preview`.
+
+### Freeze the clock (static time)
+
+```ts
+export const Frozen = {
+  // Shorthand — a string, number (ms), or Date freezes the clock at that instant.
+  parameters: { date: '2025-06-01T12:00:00' },
+}
+```
+
+### Let it run, optionally fast (dynamic time)
+
+```ts
+export const FastForward = {
+  parameters: {
+    date: {
+      now: '2025-06-01T12:00:00',
+      canProgress: true,
+      clockSpeed: 20, // 20× faster than wall time
+    },
+  },
+}
+```
+
+### The `date` parameter
+
+| Field         | Type                       | Default | Description                                                          |
+| ------------- | -------------------------- | ------- | -------------------------------------------------------------------- |
+| `now`         | `string \| number \| Date` | —       | The mocked "current" time. Required (in object form).                |
+| `canProgress` | `boolean`                  | `false` | `false` freezes the clock at `now`; `true` lets it advance.          |
+| `clockSpeed`  | `number`                   | `1`     | Real-time multiplier while progressing — `30` runs time 30× faster.  |
+
+## Using it in docs (MDX) pages
+
+The decorator replaces **global** browser APIs, so two stories with different
+mocked clocks can't share one document. When you embed multiple examples on a
+single docs page, render each in its own iframe so each gets an isolated clock:
+
+```ts
+// .storybook/preview.ts
+const preview: Preview = {
+  decorators: [mockDateDecorator],
+  parameters: {
+    docs: { story: { inline: false } },
+  },
+}
+```
+
+## How it works
+
+On each story, the decorator swaps the global `Date`, `setTimeout`,
+`setInterval`, `requestAnimationFrame`, and `cancelAnimationFrame` for mocked
+versions tied to the `date` parameter, then restores the originals when the story
+unmounts — so a mocked clock in one story never leaks into the next.
+
+Because the swap is global, your components don't need to know chronokit exists:
+they call `Date.now()` / `requestAnimationFrame` as usual and transparently see
+the mocked clock.
+
+## Status
+
+This is the first edition. The addon and a full set of examples and documentation
+live in this Storybook (see the demo link above). Packaging for npm
+(`exports`, build, published artifact) is in progress.
+
+## License
+
+MIT

package/dist/index.cjs

@@ -0,0 +1,136 @@
+'use strict';
+
+var react = require('react');
+
+// src/addon/mockDateDecorator.ts
+var RealDate = globalThis.Date;
+var realSetTimeout = globalThis.setTimeout;
+var realSetInterval = globalThis.setInterval;
+var realRequestAnimationFrame = globalThis.requestAnimationFrame;
+var realCancelAnimationFrame = globalThis.cancelAnimationFrame;
+var pendingFrames = /* @__PURE__ */ new Map();
+var nextFrameId = 1;
+var MockDate = class _MockDate extends RealDate {
+  static mockNow = RealDate.now();
+  static realtimeStart = null;
+  static clockSpeed = 1;
+  constructor(value) {
+    if (value === void 0) {
+      super(_MockDate.now());
+    } else {
+      super(value);
+    }
+  }
+  static now() {
+    if (_MockDate.realtimeStart === null) {
+      return _MockDate.mockNow;
+    }
+    const elapsed = RealDate.now() - _MockDate.realtimeStart;
+    return _MockDate.mockNow + elapsed * _MockDate.clockSpeed;
+  }
+  static parse(dateString) {
+    return RealDate.parse(dateString);
+  }
+  static UTC(...args) {
+    return RealDate.UTC(...args);
+  }
+};
+function mockSetTimeout(speed) {
+  return ((callback, ms, ...args) => {
+    return realSetTimeout(callback, (ms ?? 0) / speed, ...args);
+  });
+}
+function mockSetInterval(speed) {
+  return ((callback, ms, ...args) => {
+    return realSetInterval(callback, (ms ?? 0) / speed, ...args);
+  });
+}
+function mockRequestAnimationFrame(speed) {
+  return (callback) => {
+    const frameId = nextFrameId++;
+    const frameDelay = Math.max(1, 16.67 / speed);
+    const timeoutId = realSetTimeout(() => {
+      pendingFrames.delete(frameId);
+      callback(MockDate.now());
+    }, frameDelay);
+    pendingFrames.set(frameId, timeoutId);
+    return frameId;
+  };
+}
+function mockCancelAnimationFrame() {
+  return (frameId) => {
+    const timeoutId = pendingFrames.get(frameId);
+    if (timeoutId !== void 0) {
+      clearTimeout(timeoutId);
+      pendingFrames.delete(frameId);
+    }
+  };
+}
+function parseDate(date) {
+  if (date instanceof Date) {
+    return date.getTime();
+  }
+  if (typeof date === "number") {
+    return date;
+  }
+  return new RealDate(date).getTime();
+}
+function applyMock(dateParam) {
+  const {
+    now,
+    canProgress = false,
+    clockSpeed = 1
+  } = typeof dateParam === "object" && "now" in dateParam ? dateParam : { now: dateParam };
+  MockDate.mockNow = parseDate(now);
+  MockDate.realtimeStart = canProgress ? RealDate.now() : null;
+  MockDate.clockSpeed = clockSpeed;
+  globalThis.Date = MockDate;
+  if (canProgress && clockSpeed !== 1) {
+    globalThis.setTimeout = mockSetTimeout(clockSpeed);
+    globalThis.setInterval = mockSetInterval(clockSpeed);
+    globalThis.requestAnimationFrame = mockRequestAnimationFrame(clockSpeed);
+    globalThis.cancelAnimationFrame = mockCancelAnimationFrame();
+  }
+}
+function restoreMock() {
+  globalThis.Date = RealDate;
+  globalThis.setTimeout = realSetTimeout;
+  globalThis.setInterval = realSetInterval;
+  globalThis.requestAnimationFrame = realRequestAnimationFrame;
+  globalThis.cancelAnimationFrame = realCancelAnimationFrame;
+  for (const timeoutId of pendingFrames.values()) {
+    clearTimeout(timeoutId);
+  }
+  pendingFrames.clear();
+}
+var mockDateDecorator = (Story, context) => {
+  var _a;
+  const dateParam = (_a = context.parameters) == null ? void 0 : _a.date;
+  const appliedRef = react.useRef(false);
+  if (dateParam && !appliedRef.current) {
+    applyMock(dateParam);
+    appliedRef.current = true;
+  }
+  react.useEffect(() => {
+    return () => {
+      if (appliedRef.current) {
+        restoreMock();
+        appliedRef.current = false;
+      }
+    };
+  }, []);
+  react.useEffect(() => {
+    if (dateParam) {
+      applyMock(dateParam);
+      appliedRef.current = true;
+    } else if (appliedRef.current) {
+      restoreMock();
+      appliedRef.current = false;
+    }
+  }, [dateParam]);
+  return Story();
+};
+
+exports.mockDateDecorator = mockDateDecorator;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/addon/mockDateDecorator.ts"],"names":["useRef","useEffect"],"mappings":"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","file":"index.cjs","sourcesContent":["import type { Decorator } from '@storybook/react-vite'\nimport { useEffect, useRef } from 'react'\n\nexport type MockDateParameters =\n  | string\n  | number\n  | Date\n  | {\n      /** The mocked \"current\" time. */\n      now: string | number | Date\n      /** When true the clock advances from `now`; when false it stays frozen. @default false */\n      canProgress?: boolean\n      /** Real-time multiplier for the advancing clock (e.g. 20 = 20x faster). @default 1 */\n      clockSpeed?: number\n    }\n\ndeclare module '@storybook/react-vite' {\n  interface Parameters {\n    date?: MockDateParameters\n  }\n}\n\nconst RealDate = globalThis.Date\nconst realSetTimeout = globalThis.setTimeout\nconst realSetInterval = globalThis.setInterval\nconst realRequestAnimationFrame = globalThis.requestAnimationFrame\nconst realCancelAnimationFrame = globalThis.cancelAnimationFrame\n\n// Track pending animation frames for cancellation\nconst pendingFrames = new Map<number, ReturnType<typeof setTimeout>>()\nlet nextFrameId = 1\n\nclass MockDate extends RealDate {\n  static mockNow: number = RealDate.now()\n  static realtimeStart: number | null = null\n  static clockSpeed: number = 1.0\n\n  constructor(value?: string | number | Date) {\n    if (value === undefined) {\n      super(MockDate.now())\n    } else {\n      super(value as string | number)\n    }\n  }\n\n  static override now(): number {\n    if (MockDate.realtimeStart === null) {\n      return MockDate.mockNow\n    }\n    const elapsed = RealDate.now() - MockDate.realtimeStart\n    return MockDate.mockNow + elapsed * MockDate.clockSpeed\n  }\n\n  static override parse(dateString: string): number {\n    return RealDate.parse(dateString)\n  }\n\n  static override UTC(...args: Parameters<typeof Date.UTC>): number {\n    return RealDate.UTC(...args)\n  }\n}\n\nfunction mockSetTimeout(speed: number) {\n  return ((callback: TimerHandler, ms?: number, ...args: unknown[]) => {\n    return realSetTimeout(callback, (ms ?? 0) / speed, ...args)\n  }) as typeof setTimeout\n}\n\nfunction mockSetInterval(speed: number) {\n  return ((callback: TimerHandler, ms?: number, ...args: unknown[]) => {\n    return realSetInterval(callback, (ms ?? 0) / speed, ...args)\n  }) as typeof setInterval\n}\n\nfunction mockRequestAnimationFrame(speed: number) {\n  return (callback: FrameRequestCallback): number => {\n    const frameId = nextFrameId++\n    // Normal RAF is ~60fps = 16.67ms between frames\n    // With speed multiplier, frames should come faster in real time\n    const frameDelay = Math.max(1, 16.67 / speed)\n\n    const timeoutId = realSetTimeout(() => {\n      pendingFrames.delete(frameId)\n      // Pass the mocked timestamp to the callback\n      callback(MockDate.now())\n    }, frameDelay)\n\n    pendingFrames.set(frameId, timeoutId)\n    return frameId\n  }\n}\n\nfunction mockCancelAnimationFrame() {\n  return (frameId: number): void => {\n    const timeoutId = pendingFrames.get(frameId)\n    if (timeoutId !== undefined) {\n      clearTimeout(timeoutId)\n      pendingFrames.delete(frameId)\n    }\n  }\n}\n\nfunction parseDate(date: string | number | Date): number {\n  if (date instanceof Date) {\n    return date.getTime()\n  }\n  if (typeof date === 'number') {\n    return date\n  }\n  return new RealDate(date).getTime()\n}\n\nfunction applyMock(dateParam: MockDateParameters) {\n  const {\n    now,\n    canProgress = false,\n    clockSpeed = 1.0,\n  } = typeof dateParam === 'object' && 'now' in dateParam\n    ? dateParam\n    : { now: dateParam }\n\n  MockDate.mockNow = parseDate(now)\n  MockDate.realtimeStart = canProgress ? RealDate.now() : null\n  MockDate.clockSpeed = clockSpeed\n\n  // @ts-expect-error - replacing global Date with MockDate\n  globalThis.Date = MockDate\n\n  if (canProgress && clockSpeed !== 1.0) {\n    globalThis.setTimeout = mockSetTimeout(clockSpeed)\n    globalThis.setInterval = mockSetInterval(clockSpeed)\n    globalThis.requestAnimationFrame = mockRequestAnimationFrame(clockSpeed)\n    globalThis.cancelAnimationFrame = mockCancelAnimationFrame()\n  }\n}\n\nfunction restoreMock() {\n  globalThis.Date = RealDate\n  globalThis.setTimeout = realSetTimeout\n  globalThis.setInterval = realSetInterval\n  globalThis.requestAnimationFrame = realRequestAnimationFrame\n  globalThis.cancelAnimationFrame = realCancelAnimationFrame\n\n  // Cancel any pending animation frames\n  for (const timeoutId of pendingFrames.values()) {\n    clearTimeout(timeoutId)\n  }\n  pendingFrames.clear()\n}\n\nexport const mockDateDecorator: Decorator = (Story, context) => {\n  const dateParam = context.parameters?.date as MockDateParameters | undefined\n  const appliedRef = useRef(false)\n\n  // Apply mock synchronously on first render\n  if (dateParam && !appliedRef.current) {\n    applyMock(dateParam)\n    appliedRef.current = true\n  }\n\n  // Cleanup on unmount\n  useEffect(() => {\n    return () => {\n      if (appliedRef.current) {\n        restoreMock()\n        appliedRef.current = false\n      }\n    }\n  }, [])\n\n  // Re-apply if dateParam changes\n  useEffect(() => {\n    if (dateParam) {\n      applyMock(dateParam)\n      appliedRef.current = true\n    } else if (appliedRef.current) {\n      restoreMock()\n      appliedRef.current = false\n    }\n  }, [dateParam])\n\n  return Story()\n}\n"]}

package/dist/index.d.cts

@@ -0,0 +1 @@
+export { type MockDateParameters, mockDateDecorator } from './mockDateDecorator';

package/dist/index.d.ts

@@ -0,0 +1 @@
+export { type MockDateParameters, mockDateDecorator } from './mockDateDecorator';

package/dist/index.js

@@ -0,0 +1,134 @@
+import { useRef, useEffect } from 'react';
+
+// src/addon/mockDateDecorator.ts
+var RealDate = globalThis.Date;
+var realSetTimeout = globalThis.setTimeout;
+var realSetInterval = globalThis.setInterval;
+var realRequestAnimationFrame = globalThis.requestAnimationFrame;
+var realCancelAnimationFrame = globalThis.cancelAnimationFrame;
+var pendingFrames = /* @__PURE__ */ new Map();
+var nextFrameId = 1;
+var MockDate = class _MockDate extends RealDate {
+  static mockNow = RealDate.now();
+  static realtimeStart = null;
+  static clockSpeed = 1;
+  constructor(value) {
+    if (value === void 0) {
+      super(_MockDate.now());
+    } else {
+      super(value);
+    }
+  }
+  static now() {
+    if (_MockDate.realtimeStart === null) {
+      return _MockDate.mockNow;
+    }
+    const elapsed = RealDate.now() - _MockDate.realtimeStart;
+    return _MockDate.mockNow + elapsed * _MockDate.clockSpeed;
+  }
+  static parse(dateString) {
+    return RealDate.parse(dateString);
+  }
+  static UTC(...args) {
+    return RealDate.UTC(...args);
+  }
+};
+function mockSetTimeout(speed) {
+  return ((callback, ms, ...args) => {
+    return realSetTimeout(callback, (ms ?? 0) / speed, ...args);
+  });
+}
+function mockSetInterval(speed) {
+  return ((callback, ms, ...args) => {
+    return realSetInterval(callback, (ms ?? 0) / speed, ...args);
+  });
+}
+function mockRequestAnimationFrame(speed) {
+  return (callback) => {
+    const frameId = nextFrameId++;
+    const frameDelay = Math.max(1, 16.67 / speed);
+    const timeoutId = realSetTimeout(() => {
+      pendingFrames.delete(frameId);
+      callback(MockDate.now());
+    }, frameDelay);
+    pendingFrames.set(frameId, timeoutId);
+    return frameId;
+  };
+}
+function mockCancelAnimationFrame() {
+  return (frameId) => {
+    const timeoutId = pendingFrames.get(frameId);
+    if (timeoutId !== void 0) {
+      clearTimeout(timeoutId);
+      pendingFrames.delete(frameId);
+    }
+  };
+}
+function parseDate(date) {
+  if (date instanceof Date) {
+    return date.getTime();
+  }
+  if (typeof date === "number") {
+    return date;
+  }
+  return new RealDate(date).getTime();
+}
+function applyMock(dateParam) {
+  const {
+    now,
+    canProgress = false,
+    clockSpeed = 1
+  } = typeof dateParam === "object" && "now" in dateParam ? dateParam : { now: dateParam };
+  MockDate.mockNow = parseDate(now);
+  MockDate.realtimeStart = canProgress ? RealDate.now() : null;
+  MockDate.clockSpeed = clockSpeed;
+  globalThis.Date = MockDate;
+  if (canProgress && clockSpeed !== 1) {
+    globalThis.setTimeout = mockSetTimeout(clockSpeed);
+    globalThis.setInterval = mockSetInterval(clockSpeed);
+    globalThis.requestAnimationFrame = mockRequestAnimationFrame(clockSpeed);
+    globalThis.cancelAnimationFrame = mockCancelAnimationFrame();
+  }
+}
+function restoreMock() {
+  globalThis.Date = RealDate;
+  globalThis.setTimeout = realSetTimeout;
+  globalThis.setInterval = realSetInterval;
+  globalThis.requestAnimationFrame = realRequestAnimationFrame;
+  globalThis.cancelAnimationFrame = realCancelAnimationFrame;
+  for (const timeoutId of pendingFrames.values()) {
+    clearTimeout(timeoutId);
+  }
+  pendingFrames.clear();
+}
+var mockDateDecorator = (Story, context) => {
+  var _a;
+  const dateParam = (_a = context.parameters) == null ? void 0 : _a.date;
+  const appliedRef = useRef(false);
+  if (dateParam && !appliedRef.current) {
+    applyMock(dateParam);
+    appliedRef.current = true;
+  }
+  useEffect(() => {
+    return () => {
+      if (appliedRef.current) {
+        restoreMock();
+        appliedRef.current = false;
+      }
+    };
+  }, []);
+  useEffect(() => {
+    if (dateParam) {
+      applyMock(dateParam);
+      appliedRef.current = true;
+    } else if (appliedRef.current) {
+      restoreMock();
+      appliedRef.current = false;
+    }
+  }, [dateParam]);
+  return Story();
+};
+
+export { mockDateDecorator };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/addon/mockDateDecorator.ts"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["import type { Decorator } from '@storybook/react-vite'\nimport { useEffect, useRef } from 'react'\n\nexport type MockDateParameters =\n  | string\n  | number\n  | Date\n  | {\n      /** The mocked \"current\" time. */\n      now: string | number | Date\n      /** When true the clock advances from `now`; when false it stays frozen. @default false */\n      canProgress?: boolean\n      /** Real-time multiplier for the advancing clock (e.g. 20 = 20x faster). @default 1 */\n      clockSpeed?: number\n    }\n\ndeclare module '@storybook/react-vite' {\n  interface Parameters {\n    date?: MockDateParameters\n  }\n}\n\nconst RealDate = globalThis.Date\nconst realSetTimeout = globalThis.setTimeout\nconst realSetInterval = globalThis.setInterval\nconst realRequestAnimationFrame = globalThis.requestAnimationFrame\nconst realCancelAnimationFrame = globalThis.cancelAnimationFrame\n\n// Track pending animation frames for cancellation\nconst pendingFrames = new Map<number, ReturnType<typeof setTimeout>>()\nlet nextFrameId = 1\n\nclass MockDate extends RealDate {\n  static mockNow: number = RealDate.now()\n  static realtimeStart: number | null = null\n  static clockSpeed: number = 1.0\n\n  constructor(value?: string | number | Date) {\n    if (value === undefined) {\n      super(MockDate.now())\n    } else {\n      super(value as string | number)\n    }\n  }\n\n  static override now(): number {\n    if (MockDate.realtimeStart === null) {\n      return MockDate.mockNow\n    }\n    const elapsed = RealDate.now() - MockDate.realtimeStart\n    return MockDate.mockNow + elapsed * MockDate.clockSpeed\n  }\n\n  static override parse(dateString: string): number {\n    return RealDate.parse(dateString)\n  }\n\n  static override UTC(...args: Parameters<typeof Date.UTC>): number {\n    return RealDate.UTC(...args)\n  }\n}\n\nfunction mockSetTimeout(speed: number) {\n  return ((callback: TimerHandler, ms?: number, ...args: unknown[]) => {\n    return realSetTimeout(callback, (ms ?? 0) / speed, ...args)\n  }) as typeof setTimeout\n}\n\nfunction mockSetInterval(speed: number) {\n  return ((callback: TimerHandler, ms?: number, ...args: unknown[]) => {\n    return realSetInterval(callback, (ms ?? 0) / speed, ...args)\n  }) as typeof setInterval\n}\n\nfunction mockRequestAnimationFrame(speed: number) {\n  return (callback: FrameRequestCallback): number => {\n    const frameId = nextFrameId++\n    // Normal RAF is ~60fps = 16.67ms between frames\n    // With speed multiplier, frames should come faster in real time\n    const frameDelay = Math.max(1, 16.67 / speed)\n\n    const timeoutId = realSetTimeout(() => {\n      pendingFrames.delete(frameId)\n      // Pass the mocked timestamp to the callback\n      callback(MockDate.now())\n    }, frameDelay)\n\n    pendingFrames.set(frameId, timeoutId)\n    return frameId\n  }\n}\n\nfunction mockCancelAnimationFrame() {\n  return (frameId: number): void => {\n    const timeoutId = pendingFrames.get(frameId)\n    if (timeoutId !== undefined) {\n      clearTimeout(timeoutId)\n      pendingFrames.delete(frameId)\n    }\n  }\n}\n\nfunction parseDate(date: string | number | Date): number {\n  if (date instanceof Date) {\n    return date.getTime()\n  }\n  if (typeof date === 'number') {\n    return date\n  }\n  return new RealDate(date).getTime()\n}\n\nfunction applyMock(dateParam: MockDateParameters) {\n  const {\n    now,\n    canProgress = false,\n    clockSpeed = 1.0,\n  } = typeof dateParam === 'object' && 'now' in dateParam\n    ? dateParam\n    : { now: dateParam }\n\n  MockDate.mockNow = parseDate(now)\n  MockDate.realtimeStart = canProgress ? RealDate.now() : null\n  MockDate.clockSpeed = clockSpeed\n\n  // @ts-expect-error - replacing global Date with MockDate\n  globalThis.Date = MockDate\n\n  if (canProgress && clockSpeed !== 1.0) {\n    globalThis.setTimeout = mockSetTimeout(clockSpeed)\n    globalThis.setInterval = mockSetInterval(clockSpeed)\n    globalThis.requestAnimationFrame = mockRequestAnimationFrame(clockSpeed)\n    globalThis.cancelAnimationFrame = mockCancelAnimationFrame()\n  }\n}\n\nfunction restoreMock() {\n  globalThis.Date = RealDate\n  globalThis.setTimeout = realSetTimeout\n  globalThis.setInterval = realSetInterval\n  globalThis.requestAnimationFrame = realRequestAnimationFrame\n  globalThis.cancelAnimationFrame = realCancelAnimationFrame\n\n  // Cancel any pending animation frames\n  for (const timeoutId of pendingFrames.values()) {\n    clearTimeout(timeoutId)\n  }\n  pendingFrames.clear()\n}\n\nexport const mockDateDecorator: Decorator = (Story, context) => {\n  const dateParam = context.parameters?.date as MockDateParameters | undefined\n  const appliedRef = useRef(false)\n\n  // Apply mock synchronously on first render\n  if (dateParam && !appliedRef.current) {\n    applyMock(dateParam)\n    appliedRef.current = true\n  }\n\n  // Cleanup on unmount\n  useEffect(() => {\n    return () => {\n      if (appliedRef.current) {\n        restoreMock()\n        appliedRef.current = false\n      }\n    }\n  }, [])\n\n  // Re-apply if dateParam changes\n  useEffect(() => {\n    if (dateParam) {\n      applyMock(dateParam)\n      appliedRef.current = true\n    } else if (appliedRef.current) {\n      restoreMock()\n      appliedRef.current = false\n    }\n  }, [dateParam])\n\n  return Story()\n}\n"]}

package/dist/mockDateDecorator.d.cts

@@ -0,0 +1,15 @@
+import type { Decorator } from '@storybook/react-vite';
+export type MockDateParameters = string | number | Date | {
+    /** The mocked "current" time. */
+    now: string | number | Date;
+    /** When true the clock advances from `now`; when false it stays frozen. @default false */
+    canProgress?: boolean;
+    /** Real-time multiplier for the advancing clock (e.g. 20 = 20x faster). @default 1 */
+    clockSpeed?: number;
+};
+declare module '@storybook/react-vite' {
+    interface Parameters {
+        date?: MockDateParameters;
+    }
+}
+export declare const mockDateDecorator: Decorator;

package/dist/mockDateDecorator.d.ts

@@ -0,0 +1,15 @@
+import type { Decorator } from '@storybook/react-vite';
+export type MockDateParameters = string | number | Date | {
+    /** The mocked "current" time. */
+    now: string | number | Date;
+    /** When true the clock advances from `now`; when false it stays frozen. @default false */
+    canProgress?: boolean;
+    /** Real-time multiplier for the advancing clock (e.g. 20 = 20x faster). @default 1 */
+    clockSpeed?: number;
+};
+declare module '@storybook/react-vite' {
+    interface Parameters {
+        date?: MockDateParameters;
+    }
+}
+export declare const mockDateDecorator: Decorator;

package/package.json

@@ -0,0 +1,94 @@
+{
+  "name": "@thinkdx/storybook-addon-chronokit",
+  "version": "1.0.0",
+  "publishConfig": {
+    "access": "public"
+  },
+  "description": "Mock time in your Storybook stories — freeze the clock or fast-forward it with a single decorator.",
+  "keywords": [
+    "storybook",
+    "storybook-addons",
+    "addon",
+    "date",
+    "time",
+    "clock",
+    "mock",
+    "testing"
+  ],
+  "homepage": "https://thinkdx.github.io/storybook-addon-chronokit/",
+  "bugs": "https://github.com/ThinkDX/storybook-addon-chronokit/issues",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/ThinkDX/storybook-addon-chronokit.git"
+  },
+  "license": "MIT",
+  "author": "Nick Ferraro",
+  "type": "module",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./dist/index.cjs"
+      }
+    }
+  },
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "sideEffects": false,
+  "engines": {
+    "node": ">=18"
+  },
+  "scripts": {
+    "build": "tsup && tsc -p tsconfig.build.json && node scripts/make-cts-types.mjs",
+    "prepublishOnly": "npm run build",
+    "test": "vitest",
+    "test:run": "vitest run",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build",
+    "lint": "biome lint .",
+    "format": "biome format --write .",
+    "check": "biome check --write .",
+    "typecheck": "tsc -p tsconfig.app.json --noEmit && tsc -p tsconfig.node.json --noEmit"
+  },
+  "peerDependencies": {
+    "@storybook/react-vite": ">=9.0.0",
+    "react": ">=18",
+    "storybook": ">=9.0.0"
+  },
+  "overrides": {
+    "tsup": {
+      "esbuild": "^0.28.1"
+    }
+  },
+  "devDependencies": {
+    "@biomejs/biome": "^2.3.11",
+    "@storybook/addon-a11y": "^10.4.6",
+    "@storybook/addon-docs": "^10.4.6",
+    "@storybook/addon-vitest": "^10.4.6",
+    "@storybook/react-vite": "^10.4.6",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.1",
+    "@types/node": "^25.0.9",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "@vitejs/plugin-react": "^4.3.4",
+    "@vitest/browser-playwright": "^4.1.9",
+    "jsdom": "^27.4.0",
+    "playwright": "^1.57.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "storybook": "^10.4.6",
+    "tsup": "^8.3.5",
+    "typescript": "~5.7.2",
+    "vite": "^6.0.0",
+    "vitest": "^4.1.9"
+  }
+}