@molecule/app-timeline 1.0.0

package/LICENSE

@@ -0,0 +1,115 @@
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work.
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship.
+
+      "Contribution" shall mean any work of authorship, including the
+      original version of the Work and any modifications or additions
+      to that Work, that is intentionally submitted to the Licensor for
+      inclusion in the Work by the copyright owner or by an individual or
+      Legal Entity authorized to submit on behalf of the copyright owner.
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by the Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      patent license to make, have made, use, offer to sell, sell, import,
+      and otherwise transfer the Work.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file.
+
+   5. Submission of Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND.
+
+   8. Limitation of Liability. In no event and under no legal theory shall
+      any Contributor be liable to You for damages.
+
+   9. Accepting Warranty or Additional Liability.
+
+   Copyright 2026 Molecule Dev, Inc.
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.

package/dist/index.d.ts

@@ -0,0 +1,66 @@
+/**
+ * Timeline core interface for molecule.dev.
+ *
+ * Provides a standardized API for rendering timeline and activity log
+ * UI components. Bond a provider (e.g. `@molecule/app-timeline-default`)
+ * to supply the concrete implementation.
+ *
+ * @example
+ * ```typescript
+ * import { requireProvider, setProvider } from '@molecule/app-timeline'
+ * import { provider } from '@molecule/app-timeline-default'
+ *
+ * setProvider(provider) // once, at startup (bonds.ts)
+ *
+ * const timeline = requireProvider().createTimeline({
+ *   items: [{ id: '1', date: new Date(), title: 'Created project' }],
+ * })
+ * timeline.addItem({ id: '2', date: new Date(), title: 'Invited teammate' })
+ * ```
+ *
+ * @remarks
+ * - **The instance is HEADLESS state, not UI.** `createTimeline` returns item
+ *   management (`setItems`/`addItem`/`removeItem`/`getItems`) — nothing appears
+ *   on screen. The app renders the entries itself, styling via `getClassMap()`
+ *   from `@molecule/app-ui` and putting every label through
+ *   `t('key', values, { defaultValue })`.
+ * - **Wire it with THIS package's `setProvider()` or `bond('timeline', …)`.**
+ *   `setProvider()` delegates into the shared `@molecule/app-bond` registry, so
+ *   both write the same slot; {@link requireProvider} throws until one has run.
+ * - `TimelineItem.date` is a `Date` — format it for display with the app's
+ *   locale-aware formatting, never a hardcoded locale string.
+ * - Call `destroy()` when the owning screen unmounts.
+ *
+ * @e2e
+ * Integration checklist — drive the real timeline UI (live preview, no mocks),
+ * adapt each item to this app's actual timeline/activity screens, and check
+ * every box off one by one. A box you can't check is an integration bug to fix
+ * — not a skip:
+ * - [ ] The timeline renders its entries in the correct chronological order per
+ *   the app's config (newest-first or oldest-first) — the on-screen order
+ *   matches the item `date` timestamps, NOT insertion order (`getItems()`
+ *   preserves insertion order; the app sorts by `date` for display).
+ * - [ ] Each rendered entry shows its real data: the locale-formatted `date`
+ *   (never a raw `Date` string), the `title`, and — when set — the
+ *   `description`, `icon`, and dot/marker `color`.
+ * - [ ] With `alternate` on, consecutive entries sit on opposite sides of the
+ *   rail; with it off, every entry sits on the same side.
+ * - [ ] Clicking an entry fires `onItemClick` with THAT item — the wired action
+ *   (navigate/expand/select) happens for the clicked entry, not a neighbour.
+ * - [ ] If the app groups entries (by day or type), each entry sits under the
+ *   correct group header, and an entry dated in a different bucket renders under
+ *   the right header.
+ * - [ ] `addItem()` makes the new event appear in its correct position by `date`
+ *   timestamp (not merely appended last), and `removeItem(id)` removes exactly
+ *   that one entry.
+ * - [ ] If the app loads older entries (load-more/pagination), they append via
+ *   `setItems` with no duplication — every rendered `id` stays unique.
+ * - [ ] An empty timeline (no items) renders a defined empty state, not a
+ *   blank/broken layout; adding the first item replaces the empty state with the
+ *   entry.
+ *
+ * @module
+ */
+export * from './provider.js';
+export * from './types.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8DG;AAEH,cAAc,eAAe,CAAA;AAC7B,cAAc,YAAY,CAAA"}

package/dist/index.js

@@ -0,0 +1,65 @@
+/**
+ * Timeline core interface for molecule.dev.
+ *
+ * Provides a standardized API for rendering timeline and activity log
+ * UI components. Bond a provider (e.g. `@molecule/app-timeline-default`)
+ * to supply the concrete implementation.
+ *
+ * @example
+ * ```typescript
+ * import { requireProvider, setProvider } from '@molecule/app-timeline'
+ * import { provider } from '@molecule/app-timeline-default'
+ *
+ * setProvider(provider) // once, at startup (bonds.ts)
+ *
+ * const timeline = requireProvider().createTimeline({
+ *   items: [{ id: '1', date: new Date(), title: 'Created project' }],
+ * })
+ * timeline.addItem({ id: '2', date: new Date(), title: 'Invited teammate' })
+ * ```
+ *
+ * @remarks
+ * - **The instance is HEADLESS state, not UI.** `createTimeline` returns item
+ *   management (`setItems`/`addItem`/`removeItem`/`getItems`) — nothing appears
+ *   on screen. The app renders the entries itself, styling via `getClassMap()`
+ *   from `@molecule/app-ui` and putting every label through
+ *   `t('key', values, { defaultValue })`.
+ * - **Wire it with THIS package's `setProvider()` or `bond('timeline', …)`.**
+ *   `setProvider()` delegates into the shared `@molecule/app-bond` registry, so
+ *   both write the same slot; {@link requireProvider} throws until one has run.
+ * - `TimelineItem.date` is a `Date` — format it for display with the app's
+ *   locale-aware formatting, never a hardcoded locale string.
+ * - Call `destroy()` when the owning screen unmounts.
+ *
+ * @e2e
+ * Integration checklist — drive the real timeline UI (live preview, no mocks),
+ * adapt each item to this app's actual timeline/activity screens, and check
+ * every box off one by one. A box you can't check is an integration bug to fix
+ * — not a skip:
+ * - [ ] The timeline renders its entries in the correct chronological order per
+ *   the app's config (newest-first or oldest-first) — the on-screen order
+ *   matches the item `date` timestamps, NOT insertion order (`getItems()`
+ *   preserves insertion order; the app sorts by `date` for display).
+ * - [ ] Each rendered entry shows its real data: the locale-formatted `date`
+ *   (never a raw `Date` string), the `title`, and — when set — the
+ *   `description`, `icon`, and dot/marker `color`.
+ * - [ ] With `alternate` on, consecutive entries sit on opposite sides of the
+ *   rail; with it off, every entry sits on the same side.
+ * - [ ] Clicking an entry fires `onItemClick` with THAT item — the wired action
+ *   (navigate/expand/select) happens for the clicked entry, not a neighbour.
+ * - [ ] If the app groups entries (by day or type), each entry sits under the
+ *   correct group header, and an entry dated in a different bucket renders under
+ *   the right header.
+ * - [ ] `addItem()` makes the new event appear in its correct position by `date`
+ *   timestamp (not merely appended last), and `removeItem(id)` removes exactly
+ *   that one entry.
+ * - [ ] If the app loads older entries (load-more/pagination), they append via
+ *   `setItems` with no duplication — every rendered `id` stays unique.
+ * - [ ] An empty timeline (no items) renders a defined empty state, not a
+ *   blank/broken layout; adding the first item replaces the empty state with the
+ *   entry.
+ *
+ * @module
+ */
+export * from './provider.js';
+export * from './types.js';

package/dist/provider.d.ts

@@ -0,0 +1,37 @@
+/**
+ * Timeline provider wiring, backed by the shared `@molecule/app-bond` registry.
+ *
+ * Bond packages call `setProvider()` during setup; it delegates to
+ * `bond('timeline', provider)`, so wiring via this package's `setProvider()` and
+ * via `bond('timeline', …)` write the SAME registry slot — use either.
+ * Application code calls `getProvider()` / `requireProvider()` at runtime.
+ *
+ * @module
+ */
+import type { TimelineProvider } from './types.js';
+/**
+ * Registers a timeline provider as the active singleton.
+ *
+ * @param provider - The timeline provider implementation to bond.
+ */
+export declare function setProvider(provider: TimelineProvider): void;
+/**
+ * Retrieves the bonded timeline provider, or `null` if none is bonded.
+ *
+ * @returns The active timeline provider, or `null`.
+ */
+export declare function getProvider(): TimelineProvider | null;
+/**
+ * Checks whether a timeline provider has been bonded.
+ *
+ * @returns `true` if a timeline provider is available.
+ */
+export declare function hasProvider(): boolean;
+/**
+ * Retrieves the bonded timeline provider, throwing if none is configured.
+ *
+ * @returns The active timeline provider.
+ * @throws {Error} if no provider has been bonded.
+ */
+export declare function requireProvider(): TimelineProvider;
+//# sourceMappingURL=provider.d.ts.map

package/dist/provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"provider.d.ts","sourceRoot":"","sources":["../src/provider.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAIH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAA;AAIlD;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,QAAQ,EAAE,gBAAgB,GAAG,IAAI,CAE5D;AAED;;;;GAIG;AACH,wBAAgB,WAAW,IAAI,gBAAgB,GAAG,IAAI,CAErD;AAED;;;;GAIG;AACH,wBAAgB,WAAW,IAAI,OAAO,CAErC;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,IAAI,gBAAgB,CAKlD"}

package/dist/provider.js

@@ -0,0 +1,48 @@
+/**
+ * Timeline provider wiring, backed by the shared `@molecule/app-bond` registry.
+ *
+ * Bond packages call `setProvider()` during setup; it delegates to
+ * `bond('timeline', provider)`, so wiring via this package's `setProvider()` and
+ * via `bond('timeline', …)` write the SAME registry slot — use either.
+ * Application code calls `getProvider()` / `requireProvider()` at runtime.
+ *
+ * @module
+ */
+import { bond, get, isBonded, requireSingleton } from '@molecule/app-bond';
+const BOND_TYPE = 'timeline';
+/**
+ * Registers a timeline provider as the active singleton.
+ *
+ * @param provider - The timeline provider implementation to bond.
+ */
+export function setProvider(provider) {
+    bond(BOND_TYPE, provider);
+}
+/**
+ * Retrieves the bonded timeline provider, or `null` if none is bonded.
+ *
+ * @returns The active timeline provider, or `null`.
+ */
+export function getProvider() {
+    return get(BOND_TYPE) ?? null;
+}
+/**
+ * Checks whether a timeline provider has been bonded.
+ *
+ * @returns `true` if a timeline provider is available.
+ */
+export function hasProvider() {
+    return isBonded(BOND_TYPE);
+}
+/**
+ * Retrieves the bonded timeline provider, throwing if none is configured.
+ *
+ * @returns The active timeline provider.
+ * @throws {Error} if no provider has been bonded.
+ */
+export function requireProvider() {
+    if (!isBonded(BOND_TYPE)) {
+        throw new Error('Timeline provider not configured. Bond a timeline provider first.');
+    }
+    return requireSingleton(BOND_TYPE);
+}

package/dist/types.d.ts

@@ -0,0 +1,90 @@
+/**
+ * Timeline types for molecule.dev.
+ *
+ * Defines the provider interface and data types for rendering
+ * timeline / activity log UI components.
+ *
+ * @module
+ */
+/**
+ * A single item in a timeline.
+ */
+export interface TimelineItem {
+    /** Unique identifier for the item. */
+    id: string;
+    /** Date/time the event occurred. */
+    date: Date;
+    /** Title of the timeline entry. */
+    title: string;
+    /** Optional description or body text. */
+    description?: string;
+    /** Optional icon identifier. */
+    icon?: string;
+    /** Optional color for the timeline dot/marker. */
+    color?: string;
+    /** Arbitrary metadata attached to the item. */
+    metadata?: Record<string, unknown>;
+}
+/**
+ * Configuration options for creating a timeline.
+ */
+export interface TimelineOptions {
+    /** Items to display in the timeline. */
+    items: TimelineItem[];
+    /** Whether to alternate items on opposite sides. Defaults to `false`. */
+    alternate?: boolean;
+    /** Callback when a timeline item is clicked. */
+    onItemClick?: (item: TimelineItem) => void;
+}
+/**
+ * A live timeline instance returned by the provider.
+ */
+export interface TimelineInstance {
+    /**
+     * Updates the timeline items.
+     *
+     * @param items - The new set of timeline items.
+     */
+    setItems(items: TimelineItem[]): void;
+    /**
+     * Appends a single item to the timeline.
+     *
+     * @param item - The item to add.
+     */
+    addItem(item: TimelineItem): void;
+    /**
+     * Removes an item by its ID.
+     *
+     * @param id - The ID of the item to remove.
+     * @returns `true` if the item was found and removed.
+     */
+    removeItem(id: string): boolean;
+    /**
+     * Returns all current timeline items.
+     *
+     * @returns Array of timeline items.
+     */
+    getItems(): TimelineItem[];
+    /**
+     * Destroys the timeline instance and cleans up resources.
+     */
+    destroy(): void;
+}
+/**
+ * Timeline provider interface.
+ *
+ * All timeline providers must implement this interface to create
+ * and manage timeline / activity log UI.
+ */
+export interface TimelineProvider {
+    /** Provider name identifier. */
+    readonly name: string;
+    /**
+     * Creates a new timeline instance.
+     *
+     * @param options - Configuration for the timeline.
+     * @returns A timeline instance for managing the timeline.
+     */
+    createTimeline(options: TimelineOptions): TimelineInstance;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH;;GAEG;AACH,MAAM,WAAW,YAAY;IAC3B,sCAAsC;IACtC,EAAE,EAAE,MAAM,CAAA;IAEV,oCAAoC;IACpC,IAAI,EAAE,IAAI,CAAA;IAEV,mCAAmC;IACnC,KAAK,EAAE,MAAM,CAAA;IAEb,yCAAyC;IACzC,WAAW,CAAC,EAAE,MAAM,CAAA;IAEpB,gCAAgC;IAChC,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb,kDAAkD;IAClD,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;CACnC;AAED;;GAEG;AACH,MAAM,WAAW,eAAe;IAC9B,wCAAwC;IACxC,KAAK,EAAE,YAAY,EAAE,CAAA;IAErB,yEAAyE;IACzE,SAAS,CAAC,EAAE,OAAO,CAAA;IAEnB,gDAAgD;IAChD,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAA;CAC3C;AAED;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC/B;;;;OAIG;IACH,QAAQ,CAAC,KAAK,EAAE,YAAY,EAAE,GAAG,IAAI,CAAA;IAErC;;;;OAIG;IACH,OAAO,CAAC,IAAI,EAAE,YAAY,GAAG,IAAI,CAAA;IAEjC;;;;;OAKG;IACH,UAAU,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO,CAAA;IAE/B;;;;OAIG;IACH,QAAQ,IAAI,YAAY,EAAE,CAAA;IAE1B;;OAEG;IACH,OAAO,IAAI,IAAI,CAAA;CAChB;AAED;;;;;GAKG;AACH,MAAM,WAAW,gBAAgB;IAC/B,gCAAgC;IAChC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IAErB;;;;;OAKG;IACH,cAAc,CAAC,OAAO,EAAE,eAAe,GAAG,gBAAgB,CAAA;CAC3D"}

package/dist/types.js

@@ -0,0 +1,9 @@
+/**
+ * Timeline types for molecule.dev.
+ *
+ * Defines the provider interface and data types for rendering
+ * timeline / activity log UI components.
+ *
+ * @module
+ */
+export {};

package/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "@molecule/app-timeline",
+  "version": "1.0.0",
+  "description": "",
+  "type": "module",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "scripts": {
+    "build": "tsc",
+    "test": "vitest run",
+    "test:watch": "vitest"
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "keywords": [
+    "molecule",
+    "timeline"
+  ],
+  "license": "Apache-2.0",
+  "peerDependencies": {
+    "@molecule/app-bond": "^1.0.0"
+  },
+  "devDependencies": {
+    "@molecule/app-bond": "1.0.0",
+    "@types/node": "26.1.2",
+    "typescript": "6.0.3",
+    "vitest": "4.1.10"
+  }
+}