@djangocfg/ui-tools 2.1.293 → 2.1.297

package/src/tools/OpenapiViewer/.claude/.sidecar/tasks/T-002.md

@@ -1,18 +0,0 @@
----
-context_files:
-- .claude/project-map.md
-created_at: '2026-04-22T16:47:48.101004Z'
-id: T-002
-priority: high
-source: sidecar_review
-source_item_id: 4654646dd66d
-status: pending
-title: '[gap] The project map lists source directories (components, context, hooks,
-  utils) typ'
----
-
-The project map lists source directories (components, context, hooks, utils) typical of a React library, but recent commits mention backend (Django) and frontend framework (Next.js) concepts not covered. Key areas like 'layouts/', 'navigation/', and Django app structure have no documentation in the provided map.
-
-**Files:** .claude/project-map.md
-
-**Action:** Expand the project map to document the actual codebase structure, including Django apps, Next.js pages/layouts, and how the frontend and backend integrate.

package/src/tools/OpenapiViewer/.claude/.sidecar/tasks/T-003.md

@@ -1,18 +0,0 @@
----
-context_files:
-- .claude/project-map.md
-created_at: '2026-04-22T16:47:48.101333Z'
-id: T-003
-priority: high
-source: sidecar_review
-source_item_id: c81e59d10f1a
-status: pending
-title: '[gap] No dependencies are listed in the analysis, but recent commits reference
-  specifi'
----
-
-No dependencies are listed in the analysis, but recent commits reference specific packages and tools (e.g., 'drf-spectacular', 'Nextra'). The project map provides no dependency information, which is a critical gap for understanding the project's environment.
-
-**Files:** .claude/project-map.md
-
-**Action:** Add a 'Dependencies' section to the project map or ensure dependency files (pyproject.toml, package.json) are included in the documentation analysis.

package/src/tools/OpenapiViewer/.claude/.sidecar/tasks/T-004.md

@@ -1,18 +0,0 @@
----
-context_files:
-- .claude/project-map.md
-created_at: '2026-04-22T16:47:48.101697Z'
-id: T-004
-priority: medium
-source: sidecar_review
-source_item_id: ba6f809d9f15
-status: pending
-title: '[contradiction] The project map''s ''Entry Points'' list React component entry
-  files (e.g., ''./inde'
----
-
-The project map's 'Entry Points' list React component entry files (e.g., './index.tsx'), but commits suggest a Django/Next.js application with different entry points (e.g., Django's manage.py, Next.js's pages/).
-
-**Files:** .claude/project-map.md
-
-**Action:** Update the entry points list in the project map to reflect the actual application entry points (e.g., main Django ASGI/WSGI file, Next.js entry).

package/src/tools/OpenapiViewer/.claude/.sidecar/tasks/T-005.md

@@ -1,18 +0,0 @@
----
-context_files:
-- .claude/project-map.md
-created_at: '2026-04-22T16:47:48.102118Z'
-id: T-005
-priority: medium
-source: sidecar_review
-source_item_id: 4bd49eecdaa4
-status: pending
-title: '[staleness] The project map was generated on 2026-04-22, but it describes
-  a React library ar'
----
-
-The project map was generated on 2026-04-22, but it describes a React library architecture that contradicts the Django/Next.js work shown in commits from 2026-04-17 to 2026-04-22. The map's content is stale relative to the project's true evolution.
-
-**Files:** .claude/project-map.md
-
-**Action:** Regenerate the project map using a tool that accurately reflects the current codebase structure and technology stack.

package/src/tools/OpenapiViewer/.claude/.sidecar/usage.json

@@ -1,5 +0,0 @@
-{
-  "date": "2026-04-22",
-  "tokens": 4238,
-  "calls": 5
-}

package/src/tools/OpenapiViewer/.claude/project-map.md

@@ -1,23 +0,0 @@
-# Project Map
-> react-component-library — An interactive OpenAPI 3.x viewer component with a Stripe/Scalar-style documentation layout and integrated playground.
-> Generated: 2026-04-22T13:15:40.111463+00:00
-
-## Structure
-
-- `components/` — Re-export barrel file for the library's public component APIs. **[entry: index.ts]**
-  - `components/DocsLayout/` — Main documentation layout component and its sub-components, handling sidebar, API display, and interactive playground sheet. **[entry: index.tsx]**
-  - `components/shared/` — Shared UI panels (request/response editors) used by the DocsLayout and mobile interactions.
-- `context/` — React context for managing the playground state, such as endpoint drafts and API calls.
-- `hooks/` — Custom React hooks for managing state like API schemas, endpoint drafts, and responsive behavior. **[entry: index.ts]**
-- `utils/` — Utility functions for API key management, URL building, schema exporting, and data formatting. **[entry: index.ts]**
-
-## Entry Points
-
-- `./index.tsx`
-- `components/index.ts`
-- `components/DocsLayout/index.tsx`
-- `hooks/index.ts`
-- `utils/index.ts`
-
----
-Model: cache | Tokens: 0

package/src/tools/VideoPlayer/@refactoring/00-PLAN.md

@@ -1,91 +0,0 @@
-# VideoPlayer Refactoring Plan
-
-## Overview
-
-The VideoPlayer is already reasonably well-organized with a `providers/` subfolder. This refactoring focuses on incremental improvements rather than major restructuring.
-
-**Total: 2,024 lines across 10 files**
-
-## Current Structure (Before)
-
-```
-VideoPlayer/
-├── index.ts (68 lines)                 # Public exports
-├── types.ts (369 lines)                # All types + helper functions ⚠️
-├── VideoPlayer.tsx (202 lines)         # Main orchestrator
-├── VideoPlayerContext.tsx (125 lines)  # Streaming context
-├── VideoControls.tsx (139 lines)       # Vidstack controls
-├── VideoErrorFallback.tsx (174 lines)  # Error UI
-├── README.md
-└── providers/
-    ├── index.ts (8 lines)
-    ├── VidstackProvider.tsx (332 lines) # YouTube/Vimeo/HLS/DASH
-    ├── NativeProvider.tsx (206 lines)   # HTML5 <video>
-    └── StreamProvider.tsx (401 lines)   # HTTP Range + Blob ⚠️
-```
-
-**Issues Identified:**
-1. `types.ts` (369 lines) - Contains types AND helper functions
-2. `StreamProvider.tsx` (401 lines) - Largest file, multiple concerns
-3. Position caching logic duplicated in VidstackProvider & StreamProvider
-4. No dedicated hooks/ folder
-
-## Target Structure (After)
-
-```
-VideoPlayer/
-├── index.ts                    # Public API
-├── README.md
-├── types/
-│   ├── index.ts                # Re-exports all types
-│   ├── sources.ts              # Source type definitions
-│   ├── player.ts               # Player props and config types
-│   └── provider.ts             # Provider-specific types
-├── hooks/
-│   ├── index.ts
-│   └── useVideoPositionCache.ts  # Extracted caching logic
-├── utils/
-│   ├── index.ts
-│   ├── resolvers.ts            # resolvePlayerMode, resolveFileSource
-│   └── stream.ts               # Stream URL generation helpers
-├── components/
-│   ├── index.ts
-│   ├── VideoPlayer.tsx         # Main component
-│   ├── VideoControls.tsx       # Vidstack controls
-│   └── VideoErrorFallback.tsx  # Error UI
-├── context/
-│   ├── index.ts
-│   └── VideoPlayerContext.tsx
-└── providers/
-    ├── index.ts
-    ├── VidstackProvider.tsx
-    ├── NativeProvider.tsx
-    └── StreamProvider.tsx
-```
-
-## Benefits
-
-1. **DRY Principle** - Extract duplicated position caching logic
-2. **Separation of Concerns** - Types split by domain
-3. **Consistent Structure** - Matches AudioPlayer/ImageViewer patterns
-4. **Maintainability** - Easier to find and modify specific functionality
-5. **Testability** - Hooks and utils can be unit tested
-
-## Execution Phases
-
-| Phase | Description | Files |
-|-------|-------------|-------|
-| 1 | Create folder structure | types/, hooks/, utils/, components/, context/ |
-| 2 | Split types | sources.ts, player.ts, provider.ts |
-| 3 | Extract utils | resolvers.ts, stream.ts |
-| 4 | Extract hooks | useVideoPositionCache.ts |
-| 5 | Move components | VideoPlayer.tsx, VideoControls.tsx, VideoErrorFallback.tsx |
-| 6 | Move context | VideoPlayerContext.tsx |
-| 7 | Update exports | index.ts |
-| 8 | Cleanup and verify | Delete old files, run pnpm check |
-
-## Risk Assessment
-
-- **Low Risk**: Incremental changes, no logic modifications
-- **Testing**: Run `pnpm check` after each phase
-- **Providers**: Already well-organized, minimal changes needed

package/src/tools/VideoPlayer/@refactoring/01-TYPES.md

@@ -1,284 +0,0 @@
-# Phase 1: Types Split
-
-## Goal
-
-Split the 369-line `types.ts` into domain-specific files and move helper functions to utils.
-
-## Current Structure
-
-```typescript
-// types.ts (369 lines)
-// Contains:
-// 1. Source types (UrlSource, YouTubeSource, VimeoSource, HLSSource, etc.)
-// 2. Player types (PlayerMode, AspectRatioValue, VideoPlayerProps, etc.)
-// 3. Provider types (VidstackProviderProps, NativeProviderProps, etc.)
-// 4. Helper functions (resolvePlayerMode, resolveFileSource, isSimpleStreamSource)
-```
-
-## Target Files
-
-### types/sources.ts (~120 lines)
-
-All source type definitions:
-
-```typescript
-/**
- * Video source type definitions
- */
-
-// URL source (direct video URL)
-export interface UrlSource {
-  type: 'url';
-  url: string;
-  mimeType?: string;
-}
-
-// YouTube embed
-export interface YouTubeSource {
-  type: 'youtube';
-  videoId: string;
-  startTime?: number;
-}
-
-// Vimeo embed
-export interface VimeoSource {
-  type: 'vimeo';
-  videoId: string;
-  startTime?: number;
-}
-
-// HLS streaming
-export interface HLSSource {
-  type: 'hls';
-  url: string;
-}
-
-// DASH streaming
-export interface DASHSource {
-  type: 'dash';
-  url: string;
-}
-
-// HTTP Range streaming with auth
-export interface StreamSource {
-  type: 'stream';
-  streamKey: string;
-  fileName: string;
-  fileSize?: number;
-  mimeType?: string;
-  getStreamUrl: (streamKey: string) => Promise<string>;
-}
-
-// Simple stream (resolved via context)
-export interface SimpleStreamSource {
-  type: 'stream';
-  streamKey: string;
-  fileName: string;
-  fileSize?: number;
-  mimeType?: string;
-}
-
-// Blob (ArrayBuffer)
-export interface BlobSource {
-  type: 'blob';
-  data: ArrayBuffer;
-  mimeType?: string;
-  fileName?: string;
-}
-
-// Data URL (base64)
-export interface DataUrlSource {
-  type: 'data-url';
-  dataUrl: string;
-  mimeType?: string;
-}
-
-// Union of all sources
-export type VideoSourceUnion =
-  | UrlSource
-  | YouTubeSource
-  | VimeoSource
-  | HLSSource
-  | DASHSource
-  | StreamSource
-  | BlobSource
-  | DataUrlSource;
-```
-
-### types/player.ts (~100 lines)
-
-Player configuration and main component types:
-
-```typescript
-/**
- * Player configuration types
- */
-
-import type { ReactNode, CSSProperties } from 'react';
-import type { VideoSourceUnion } from './sources';
-
-// Player mode
-export type PlayerMode = 'auto' | 'vidstack' | 'native' | 'streaming';
-
-// Aspect ratio
-export type AspectRatioValue = number | 'auto' | 'fill';
-
-// Common settings
-export interface CommonPlayerSettings {
-  autoPlay?: boolean;
-  muted?: boolean;
-  loop?: boolean;
-  playsInline?: boolean;
-  controls?: boolean;
-  preload?: 'none' | 'metadata' | 'auto';
-}
-
-// Common events
-export interface CommonPlayerEvents {
-  onPlay?: () => void;
-  onPause?: () => void;
-  onEnded?: () => void;
-  onTimeUpdate?: (currentTime: number) => void;
-  onError?: (error: Error) => void;
-  onLoadStart?: () => void;
-  onCanPlay?: () => void;
-}
-
-// Error fallback props
-export interface ErrorFallbackProps {
-  error: Error | null;
-  source: VideoSourceUnion;
-  retry?: () => void;
-}
-
-// Main component props
-export interface VideoPlayerProps extends CommonPlayerSettings, CommonPlayerEvents {
-  source: VideoSourceUnion;
-  mode?: PlayerMode;
-  aspectRatio?: AspectRatioValue;
-  poster?: string;
-  className?: string;
-  style?: CSSProperties;
-  errorFallback?: (props: ErrorFallbackProps) => ReactNode;
-}
-
-// Ref API
-export interface VideoPlayerRef {
-  play: () => Promise<void>;
-  pause: () => void;
-  seek: (time: number) => void;
-  setVolume: (volume: number) => void;
-  setMuted: (muted: boolean) => void;
-  requestFullscreen: () => Promise<void>;
-  exitFullscreen: () => Promise<void>;
-  readonly currentTime: number;
-  readonly duration: number;
-  readonly paused: boolean;
-  readonly muted: boolean;
-  readonly volume: number;
-  readonly isFullscreen: boolean;
-}
-```
-
-### types/provider.ts (~80 lines)
-
-Provider-specific types:
-
-```typescript
-/**
- * Provider-specific types
- */
-
-import type { ReactNode } from 'react';
-import type { VideoSourceUnion, StreamSource, BlobSource, DataUrlSource } from './sources';
-import type { CommonPlayerSettings, CommonPlayerEvents, AspectRatioValue, ErrorFallbackProps } from './player';
-
-// Vidstack provider props
-export interface VidstackProviderProps extends CommonPlayerSettings, CommonPlayerEvents {
-  source: VideoSourceUnion;
-  aspectRatio?: AspectRatioValue;
-  poster?: string;
-  className?: string;
-  errorFallback?: (props: ErrorFallbackProps) => ReactNode;
-}
-
-// Native provider props
-export interface NativeProviderProps extends CommonPlayerSettings, CommonPlayerEvents {
-  source: VideoSourceUnion;
-  aspectRatio?: AspectRatioValue;
-  poster?: string;
-  className?: string;
-  disableContextMenu?: boolean;
-}
-
-// Stream provider props
-export interface StreamProviderProps extends CommonPlayerSettings, CommonPlayerEvents {
-  source: StreamSource | BlobSource | DataUrlSource;
-  aspectRatio?: AspectRatioValue;
-  poster?: string;
-  className?: string;
-  errorFallback?: (props: ErrorFallbackProps) => ReactNode;
-}
-
-// File source resolution options
-export interface ResolveFileSourceOptions {
-  fileName: string;
-  content: string | ArrayBuffer;
-  mimeType?: string;
-}
-
-// Context value
-export interface VideoPlayerContextValue {
-  getStreamUrl?: (streamKey: string) => Promise<string>;
-}
-
-export interface VideoPlayerProviderProps {
-  getStreamUrl: (streamKey: string) => Promise<string>;
-  children: ReactNode;
-}
-```
-
-### types/index.ts
-
-Re-export all types:
-
-```typescript
-/**
- * VideoPlayer types - Public API
- */
-
-// Source types
-export type {
-  UrlSource,
-  YouTubeSource,
-  VimeoSource,
-  HLSSource,
-  DASHSource,
-  StreamSource,
-  SimpleStreamSource,
-  BlobSource,
-  DataUrlSource,
-  VideoSourceUnion,
-} from './sources';
-
-// Player types
-export type {
-  PlayerMode,
-  AspectRatioValue,
-  CommonPlayerSettings,
-  CommonPlayerEvents,
-  ErrorFallbackProps,
-  VideoPlayerProps,
-  VideoPlayerRef,
-} from './player';
-
-// Provider types
-export type {
-  VidstackProviderProps,
-  NativeProviderProps,
-  StreamProviderProps,
-  ResolveFileSourceOptions,
-  VideoPlayerContextValue,
-  VideoPlayerProviderProps,
-} from './provider';
-```

package/src/tools/VideoPlayer/@refactoring/02-UTILS.md

@@ -1,141 +0,0 @@
-# Phase 2: Utils Extraction
-
-## Goal
-
-Extract helper functions from types.ts into dedicated utils files.
-
-## Files to Create
-
-### utils/resolvers.ts
-
-Player mode and source resolution:
-
-```typescript
-/**
- * Video source and player mode resolvers
- */
-
-import type { VideoSourceUnion, PlayerMode, SimpleStreamSource, StreamSource } from '../types';
-
-/**
- * Determine the appropriate player mode for a given source
- */
-export function resolvePlayerMode(source: VideoSourceUnion): PlayerMode {
-  switch (source.type) {
-    case 'youtube':
-    case 'vimeo':
-    case 'hls':
-    case 'dash':
-      return 'vidstack';
-    case 'stream':
-    case 'blob':
-    case 'data-url':
-      return 'streaming';
-    case 'url':
-    default:
-      return 'native';
-  }
-}
-
-/**
- * Check if source is a simple stream (needs context resolution)
- */
-export function isSimpleStreamSource(
-  source: VideoSourceUnion
-): source is SimpleStreamSource {
-  return (
-    source.type === 'stream' &&
-    !('getStreamUrl' in source)
-  );
-}
-
-/**
- * Resolve simple stream source with context getStreamUrl
- */
-export function resolveStreamSource(
-  source: SimpleStreamSource,
-  getStreamUrl: (streamKey: string) => Promise<string>
-): StreamSource {
-  return {
-    ...source,
-    getStreamUrl,
-  };
-}
-```
-
-### utils/fileSource.ts
-
-File content to source conversion:
-
-```typescript
-/**
- * File source resolution utilities
- */
-
-import type { VideoSourceUnion, ResolveFileSourceOptions } from '../types';
-
-/**
- * Convert file content to appropriate VideoSource
- */
-export function resolveFileSource(options: ResolveFileSourceOptions): VideoSourceUnion {
-  const { fileName, content, mimeType } = options;
-
-  // Data URL string
-  if (typeof content === 'string' && content.startsWith('data:')) {
-    return {
-      type: 'data-url',
-      dataUrl: content,
-      mimeType,
-    };
-  }
-
-  // Regular URL string
-  if (typeof content === 'string') {
-    return {
-      type: 'url',
-      url: content,
-      mimeType,
-    };
-  }
-
-  // ArrayBuffer -> Blob source
-  return {
-    type: 'blob',
-    data: content,
-    mimeType: mimeType || guessMimeType(fileName),
-    fileName,
-  };
-}
-
-/**
- * Guess MIME type from file extension
- */
-function guessMimeType(fileName: string): string {
-  const ext = fileName.split('.').pop()?.toLowerCase();
-  const mimeTypes: Record<string, string> = {
-    mp4: 'video/mp4',
-    webm: 'video/webm',
-    ogg: 'video/ogg',
-    mov: 'video/quicktime',
-    avi: 'video/x-msvideo',
-    mkv: 'video/x-matroska',
-  };
-  return mimeTypes[ext || ''] || 'video/mp4';
-}
-```
-
-### utils/index.ts
-
-```typescript
-/**
- * VideoPlayer utilities - Public API
- */
-
-export {
-  resolvePlayerMode,
-  isSimpleStreamSource,
-  resolveStreamSource,
-} from './resolvers';
-
-export { resolveFileSource } from './fileSource';
-```