feat(site): add util reference pipeline (#537)

Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
2026-08-16 02:45:09 +00:00 · 2026-02-24 15:34:34 -06:00
parent c11395ece1
commit 78112fbefd
143 changed files with 7031 additions and 481 deletions
@@ -0,0 +1,36 @@
+interface MediaState {
+  playing: boolean;
+  volume: number;
+  currentTime: number;
+  duration: number;
+  buffered: number;
+  fullscreen: boolean;
+}
+
+interface PlaybackState {
+  playing: boolean;
+}
+
+interface VolumeState {
+  volume: number;
+}
+
+interface TimeState {
+  currentTime: number;
+  duration: number;
+}
+
+/** Select playback state from media state. */
+export function selectPlayback(state: MediaState): PlaybackState {
+  return { playing: state.playing };
+}
+
+/** Select volume state from media state. */
+export function selectVolume(state: MediaState): VolumeState {
+  return { volume: state.volume };
+}
+
+/** Select time state from media state. */
+export function selectTime(state: MediaState): TimeState {
+  return { currentTime: state.currentTime, duration: state.duration };
+}
@@ -0,0 +1,4 @@
+export { playerContext } from './player/context';
+export { createPlayer } from './player/create-player';
+export { PlayerController } from './player/player-controller';
+export { createContainerMixin } from './store/container-mixin';
@@ -0,0 +1,9 @@
+interface PlayerContext {
+  readonly player: unknown;
+}
+
+/**
+ * The player context for dependency injection.
+ * @public
+ */
+export const playerContext: PlayerContext = { player: null };
@@ -0,0 +1,13 @@
+interface HtmlPlayerInstance {
+  play(): void;
+  destroy(): void;
+}
+
+interface HtmlPlayerOptions {
+  element: HTMLElement;
+}
+
+/** Create an HTML player instance. */
+export function createPlayer(options: HtmlPlayerOptions): HtmlPlayerInstance {
+  return {} as HtmlPlayerInstance;
+}
@@ -0,0 +1,26 @@
+interface ReactiveControllerHost {
+  addController(controller: ReactiveController): void;
+  requestUpdate(): void;
+}
+
+interface ReactiveController {
+  hostConnected?(): void;
+  hostDisconnected?(): void;
+}
+
+/** Manages the video player lifecycle. */
+export class PlayerController implements ReactiveController {
+  #host: ReactiveControllerHost;
+
+  constructor(host: ReactiveControllerHost) {
+    this.#host = host;
+  }
+
+  /** Whether the player is ready. */
+  get ready(): boolean {
+    return false;
+  }
+
+  hostConnected(): void {}
+  hostDisconnected(): void {}
+}
@@ -0,0 +1,10 @@
+type Constructor<T = object> = new (...args: any[]) => T;
+
+interface ContainerHost {
+  connectedCallback(): void;
+}
+
+/** Create a mixin that provides store container behavior. */
+export function createContainerMixin<T extends Constructor<ContainerHost>>(Base: T): T {
+  return Base;
+}
@@ -0,0 +1,4 @@
+export { usePlayer } from './player/context';
+export { createPlayer } from './player/create-player';
+export { mergeProps } from './utils/merge-props';
+export { useFormat } from './utils/use-format';
@@ -0,0 +1,16 @@
+interface PlayerStore {
+  playing: boolean;
+  volume: number;
+}
+
+interface StoreState {
+  playing: boolean;
+  volume: number;
+}
+
+/** Access the player store or select state from it. */
+export function usePlayer(): PlayerStore;
+export function usePlayer<R>(selector: (state: StoreState) => R): R;
+export function usePlayer<R>(selector?: (state: StoreState) => R): PlayerStore | R {
+  return {} as PlayerStore | R;
+}
@@ -0,0 +1,13 @@
+interface PlayerInstance {
+  play(): void;
+  pause(): void;
+}
+
+interface PlayerOptions {
+  autoplay?: boolean;
+}
+
+/** Create a React player instance. */
+export function createPlayer(options?: PlayerOptions): PlayerInstance {
+  return {} as PlayerInstance;
+}
@@ -0,0 +1,4 @@
+/** @public Merge multiple prop objects into one. */
+export function mergeProps<T extends Record<string, unknown>>(...args: T[]): T {
+  return Object.assign({}, ...args) as T;
+}
@@ -0,0 +1,9 @@
+/** Format a value for display. */
+
+/** @label Number */
+export function useFormat(value: number): string;
+/** @label String */
+export function useFormat(value: string): string;
+export function useFormat(value: number | string): string {
+  return String(value);
+}
@@ -0,0 +1,10 @@
+interface Store<S> {
+  getState(): S;
+}
+
+type SelectorFn<S, R> = (state: S) => R;
+
+/** Create a memoized selector function. */
+export function createSelector<S, R>(fn: SelectorFn<S, R>): SelectorFn<S, R> {
+  return fn;
+}
@@ -0,0 +1 @@
+export { SnapshotController } from './snapshot-controller';
@@ -0,0 +1,44 @@
+interface ReactiveControllerHost {
+  addController(controller: ReactiveController): void;
+  requestUpdate(): void;
+}
+
+interface ReactiveController {
+  hostConnected?(): void;
+  hostDisconnected?(): void;
+}
+
+interface Store<S> {
+  getState(): S;
+}
+
+/** Takes a snapshot of store state. */
+export class SnapshotController<S, R = S> implements ReactiveController {
+  #host: ReactiveControllerHost;
+
+  /**
+   * @param host - The host element.
+   * @param state - The store to snapshot.
+   * @param selector - Derives a value from state.
+   */
+  constructor(host: ReactiveControllerHost, state: Store<S>, selector: (state: S) => R);
+  /**
+   * @param host - The host element.
+   * @param state - The store to snapshot.
+   */
+  constructor(host: ReactiveControllerHost, state: Store<S>);
+  constructor(host: ReactiveControllerHost, state: Store<S>, selector?: (state: S) => R) {
+    this.#host = host;
+  }
+
+  /** The current snapshot value. */
+  get value(): R {
+    return {} as R;
+  }
+
+  /** Track state changes. */
+  track(): void {}
+
+  hostConnected(): void {}
+  hostDisconnected(): void {}
+}
@@ -0,0 +1 @@
+export { useStore } from './use-store';
@@ -0,0 +1,10 @@
+interface Store<S> {
+  getState(): S;
+}
+
+/** Subscribe to a store. */
+export function useStore<S>(store: Store<S>): S;
+export function useStore<S, R>(store: Store<S>, selector: (state: S) => R): R;
+export function useStore<S, R>(store: Store<S>, selector?: (state: S) => R): S | R {
+  return {} as S | R;
+}
@@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "lib": ["ES2022"],
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "strict": true,
+    "declaration": true,
+    "skipLibCheck": true,
+    "isolatedModules": true,
+    "verbatimModuleSyntax": true
+  }
+}
				`@@ -0,0 +1 @@`
				`export { SnapshotController } from './snapshot-controller';`