@djangocfg/ui-tools 2.1.412 → 2.1.413

package/src/tools/forms/FileUpload/index.ts

@@ -0,0 +1,21 @@
+export {
+  FileUpload,
+  FileUploadDropzone,
+  FileUploadTrigger,
+  FileUploadList,
+  FileUploadItem,
+  FileUploadItemPreview,
+  FileUploadItemMetadata,
+  FileUploadItemProgress,
+  FileUploadItemDelete,
+  FileUploadClear,
+} from './FileUpload';
+export type {
+  FileUploadProps,
+  FileUploadContextValue,
+  FileUploadItemContextValue,
+  FileState,
+  StoreState,
+  StoreAction,
+  Store,
+} from './types';

package/src/tools/forms/FileUpload/lazy.tsx

@@ -0,0 +1,19 @@
+'use client';
+
+import { createLazyComponent } from '../../../components/lazy-wrapper';
+import type { FileUploadProps } from './types';
+
+export const LazyFileUpload = createLazyComponent<FileUploadProps>(
+  () => import('./FileUpload').then((mod) => ({ default: mod.FileUpload })),
+  {
+    displayName: 'LazyFileUpload',
+    fallback: (
+      <div className="flex flex-col gap-2">
+        <div className="h-24 w-full animate-pulse rounded-lg bg-muted" />
+        <div className="h-12 w-full animate-pulse rounded-lg bg-muted" />
+      </div>
+    ),
+  }
+);
+
+export type { FileUploadProps } from './types';

package/src/tools/forms/FileUpload/types.ts

@@ -0,0 +1,83 @@
+import * as React from 'react';
+
+export type FileUploadStatus = 'idle' | 'uploading' | 'error' | 'success';
+
+export interface FileState {
+  file: File;
+  progress: number;
+  error?: string;
+  status: FileUploadStatus;
+}
+
+export interface StoreState {
+  files: Map<File, FileState>;
+  dragOver: boolean;
+  invalid: boolean;
+}
+
+export type StoreAction =
+  | { type: 'ADD_FILES'; files: File[] }
+  | { type: 'SET_FILES'; files: File[] }
+  | { type: 'SET_PROGRESS'; file: File; progress: number }
+  | { type: 'SET_SUCCESS'; file: File }
+  | { type: 'SET_ERROR'; file: File; error: string }
+  | { type: 'REMOVE_FILE'; file: File }
+  | { type: 'SET_DRAG_OVER'; dragOver: boolean }
+  | { type: 'SET_INVALID'; invalid: boolean }
+  | { type: 'CLEAR' };
+
+export interface Store {
+  getState: () => StoreState;
+  dispatch: (action: StoreAction) => void;
+  subscribe: (listener: () => void) => () => void;
+}
+
+export interface FileUploadContextValue {
+  inputId: string;
+  dropzoneId: string;
+  listId: string;
+  labelId: string;
+  disabled: boolean;
+  dir: 'ltr' | 'rtl';
+  inputRef: React.RefObject<HTMLInputElement | null>;
+  urlCache: WeakMap<File, string>;
+}
+
+export interface FileUploadItemContextValue {
+  id: string;
+  fileState: FileState | undefined;
+  nameId: string;
+  sizeId: string;
+  statusId: string;
+  messageId: string;
+}
+
+export interface FileUploadProps
+  extends Omit<React.ComponentProps<'div'>, 'defaultValue' | 'onChange'> {
+  value?: File[];
+  defaultValue?: File[];
+  onValueChange?: (files: File[]) => void;
+  onAccept?: (files: File[]) => void;
+  onFileAccept?: (file: File) => void;
+  onFileReject?: (file: File, message: string) => void;
+  onFileValidate?: (file: File) => string | null | undefined;
+  onUpload?: (
+    files: File[],
+    options: {
+      onProgress: (file: File, progress: number) => void;
+      onSuccess: (file: File) => void;
+      onError: (file: File, error: Error) => void;
+    },
+  ) => Promise<void> | void;
+  accept?: string;
+  maxFiles?: number;
+  maxSize?: number;
+  dir?: 'ltr' | 'rtl';
+  label?: string;
+  name?: string;
+  asChild?: boolean;
+  disabled?: boolean;
+  invalid?: boolean;
+  multiple?: boolean;
+  required?: boolean;
+}

package/src/tools/{JsonForm → forms/JsonForm}/lazy.tsx

@@ -10,7 +10,7 @@
  * import { JsonSchemaForm } from '@djangocfg/ui-tools/json-form'
  */
 
-import { createLazyComponent, CardLoadingFallback } from '../../components';
+import { createLazyComponent, CardLoadingFallback } from '../../../components';
 import type { JsonSchemaFormProps } from './types';
 
 // ============================================================================

package/src/tools/{MarkdownEditor → forms/MarkdownEditor}/lazy.tsx

@@ -23,7 +23,7 @@
  */
 
 import { Suspense, lazy, forwardRef } from 'react';
-import { LoadingFallback } from '../../components';
+import { LoadingFallback } from '../../../components';
 import type { MarkdownEditorProps, MarkdownEditorHandle } from './MarkdownEditor';
 
 const MarkdownEditorImpl = lazy(() =>

package/src/tools/index.ts

@@ -17,12 +17,12 @@
  */
 
 // Export tools as named exports (all use React.lazy internally)
-export { default as JsonTree } from './JsonTree';
-export type { JsonTreeConfig } from './JsonTree';
-export { default as Mermaid } from './Mermaid';
-export { default as PrettyCode } from './PrettyCode';
-export type { Language } from './PrettyCode';
-export { LottiePlayer, useLottie, usePrefersReducedMotion } from './LottiePlayer';
+export { default as JsonTree } from './data/JsonTree';
+export type { JsonTreeConfig } from './data/JsonTree';
+export { default as Mermaid } from './dev/Mermaid';
+export { default as PrettyCode } from './dev/PrettyCode';
+export type { Language } from './dev/PrettyCode';
+export { LottiePlayer, useLottie, usePrefersReducedMotion } from './media/LottiePlayer';
 export type {
   LottiePlayerProps,
   LottieSize,
@@ -31,18 +31,18 @@ export type {
   LottieSegment,
   UseLottieOptions,
   UseLottieReturn,
-} from './LottiePlayer';
+} from './media/LottiePlayer';
 
 // Export JsonForm components
-export { JsonSchemaForm } from './JsonForm';
-export type { JsonSchemaFormProps } from './JsonForm';
-export * from './JsonForm/widgets';
-export * from './JsonForm/templates';
-export * from './JsonForm/utils';
+export { JsonSchemaForm } from './forms/JsonForm';
+export type { JsonSchemaFormProps } from './forms/JsonForm';
+export * from './forms/JsonForm/widgets';
+export * from './forms/JsonForm/templates';
+export * from './forms/JsonForm/utils';
 
 // Export OpenapiViewer
-export { default as OpenapiViewer } from './OpenapiViewer';
-export type { PlaygroundConfig, SchemaSource, PlaygroundProps } from './OpenapiViewer';
+export { default as OpenapiViewer } from './dev/OpenapiViewer';
+export type { PlaygroundConfig, SchemaSource, PlaygroundProps } from './dev/OpenapiViewer';
 
 // Export VideoPlayer (media-chrome shell with provider-aware canvases)
 export {
@@ -64,7 +64,7 @@ export {
   parseEmbedUrl,
   extractYouTubeId,
   extractVimeoId,
-} from './VideoPlayer';
+} from './media/VideoPlayer';
 export type {
   VideoSource,
   UrlSource,
@@ -88,17 +88,17 @@ export type {
   VimeoCanvasProps,
   HlsCanvasProps,
   IframeCanvasProps,
-} from './VideoPlayer';
+} from './media/VideoPlayer';
 
 // AudioPlayer v6 — under construction (see @dev/@refactoring6-audioplayer/).
 // The previous Hybrid* surface lives at ./AudioPlayer_old/ for reference and
 // is intentionally not re-exported.
-export { Player as AudioPlayer } from './AudioPlayer';
-export type { PlayerProps as AudioPlayerProps } from './AudioPlayer';
+export { Player as AudioPlayer } from './media/AudioPlayer';
+export type { PlayerProps as AudioPlayerProps } from './media/AudioPlayer';
 
 // Export ImageViewer
-export { ImageViewer } from './ImageViewer';
-export type { ImageViewerProps, ImageFile } from './ImageViewer';
+export { ImageViewer } from './overlay/ImageViewer';
+export type { ImageViewerProps, ImageFile } from './overlay/ImageViewer';
 
 // Export CronScheduler (~15KB)
 export {
@@ -126,7 +126,7 @@ export {
   MonthDayGrid,
   CustomInput,
   SchedulePreview,
-} from './CronScheduler';
+} from './input/CronScheduler';
 export type {
   CronSchedulerProps,
   CronSchedulerSize,
@@ -135,23 +135,23 @@ export type {
   MonthDay,
   CronSchedulerState,
   CronSchedulerContextValue,
-} from './CronScheduler';
+} from './input/CronScheduler';
 
 // Export CodeEditor (Monaco ~550KB)
 export {
   Editor,
   DiffEditor,
-} from './CodeEditor/components';
-export type { EditorRef } from './CodeEditor/components/Editor';
+} from './forms/CodeEditor/components';
+export type { EditorRef } from './forms/CodeEditor/components/Editor';
 export {
   EditorProvider,
   useEditorContext,
-} from './CodeEditor/context';
+} from './forms/CodeEditor/context';
 export {
   useMonaco,
   useEditor,
   useLanguage,
-} from './CodeEditor/hooks';
+} from './forms/CodeEditor/hooks';
 export type {
   EditorFile,
   EditorOptions,
@@ -160,17 +160,17 @@ export type {
   EditorContextValue,
   UseEditorReturn,
   UseMonacoReturn,
-} from './CodeEditor/types';
+} from './forms/CodeEditor/types';
 
 // Export MarkdownEditor (Tiptap ~200KB)
-export { MarkdownEditor, mentionPresets } from './MarkdownEditor';
+export { MarkdownEditor, mentionPresets } from './forms/MarkdownEditor';
 export type {
   MarkdownEditorProps,
   MentionItem,
   MentionConfig,
   MentionAttrs,
   MentionMarkdownRenderer,
-} from './MarkdownEditor';
+} from './forms/MarkdownEditor';
 
 // Export Tree (decomposed shadcn-style tree, our own engine)
 export {
@@ -208,7 +208,7 @@ export {
   DEFAULT_TREE_APPEARANCE,
   resolveAppearance,
   appearanceToStyle,
-} from './Tree';
+} from './data/Tree';
 export type {
   TreeRootProps,
   TreeProviderProps,
@@ -245,7 +245,7 @@ export type {
   TreeDensity,
   TreeAccentIntensity,
   TreeRadius,
-} from './Tree';
+} from './data/Tree';
 
 // Export Media Cache Store
 export {
@@ -256,3 +256,277 @@ export {
   useBlobUrlCleanup,
   generateContentKey,
 } from '../stores/mediaCache';
+
+// Export ResponsiveDialog
+export {
+  ResponsiveDialog,
+  ResponsiveDialogContent,
+  ResponsiveDialogHeader,
+  ResponsiveDialogTitle,
+  ResponsiveDialogDescription,
+  ResponsiveDialogFooter,
+  ResponsiveDialogProvider,
+  useResponsiveDialogContext,
+} from './overlay/ResponsiveDialog';
+export type {
+  ResponsiveDialogProps,
+  ResponsiveDialogContentProps,
+  ResponsiveDialogHeaderProps,
+  ResponsiveDialogTitleProps,
+  ResponsiveDialogDescriptionProps,
+  ResponsiveDialogFooterProps,
+  ResponsiveDialogContextValue,
+} from './overlay/ResponsiveDialog';
+
+// Export ScrollSpy
+export {
+  ScrollSpy,
+  ScrollSpyNav,
+  ScrollSpyNavItem,
+  ScrollSpySection,
+  ScrollSpyProvider,
+  useScrollSpyContext,
+} from './overlay/ScrollSpy';
+export type {
+  ScrollSpyProps,
+  ScrollSpyNavProps,
+  ScrollSpyNavItemProps,
+  ScrollSpySectionProps,
+  ScrollSpyContextValue,
+} from './overlay/ScrollSpy';
+
+// Export Scroller
+export {
+  Scroller,
+  ScrollerItem,
+  ScrollerProvider,
+  useScrollerContext,
+} from './input/Scroller';
+export type {
+  ScrollerProps,
+  ScrollerItemProps,
+  ScrollerIndicatorProps,
+  ScrollerContextValue,
+  SnapAlign,
+} from './input/Scroller';
+
+// Export SelectionToolbar
+export {
+  SelectionToolbar,
+  SelectionToolbarContent,
+  SelectionToolbarAction,
+  SelectionToolbarProvider,
+  useSelectionToolbarContext,
+} from './overlay/SelectionToolbar';
+export type {
+  SelectionToolbarProps,
+  SelectionToolbarContentProps,
+  SelectionToolbarActionProps,
+  SelectionToolbarContextValue,
+} from './overlay/SelectionToolbar';
+
+// Export Sortable
+export {
+  Sortable,
+  SortableItem,
+  SortableHandle,
+  SortableProvider,
+  useSortableContext,
+} from './input/Sortable';
+export type {
+  SortableProps,
+  SortableItemProps,
+  SortableHandleProps,
+  SortableContextValue,
+  SortableItemData,
+  SortableAxis,
+} from './input/Sortable';
+
+// Export Tour
+export {
+  Tour,
+  TourPopover,
+  TourNavigation,
+  TourProvider,
+  useTourContext,
+} from './overlay/Tour';
+export type {
+  TourProps,
+  TourStep,
+  TourPopoverProps,
+  TourNavigationProps,
+  TourContextValue,
+} from './overlay/Tour';
+
+// Export Combobox
+export {
+  Combobox,
+  ComboboxTrigger,
+  ComboboxInput,
+  ComboboxList,
+  ComboboxItem,
+  ComboboxEmpty,
+  ComboboxProvider,
+  useComboboxContext,
+} from './input/Combobox';
+export type {
+  ComboboxProps,
+  ComboboxTriggerProps,
+  ComboboxInputProps,
+  ComboboxListProps,
+  ComboboxItemProps,
+  ComboboxEmptyProps,
+  ComboboxContextValue,
+  ComboboxOption,
+} from './input/Combobox';
+
+// Export ColorPicker
+export {
+  ColorPicker,
+  ColorPickerTrigger,
+  ColorPickerContent,
+  ColorPickerArea,
+  ColorPickerHueSlider,
+  ColorPickerAlphaSlider,
+  ColorPickerSwatch,
+  ColorPickerEyeDropper,
+  ColorPickerFormatSelect,
+  ColorPickerInput,
+} from './visual/ColorPicker';
+export type {
+  ColorPickerProps,
+  ColorPickerInputProps,
+} from './visual/ColorPicker';
+
+// Export FileUpload
+export {
+  FileUpload,
+  FileUploadDropzone,
+  FileUploadTrigger,
+  FileUploadList,
+  FileUploadItem,
+  FileUploadItemPreview,
+  FileUploadItemMetadata,
+  FileUploadItemProgress,
+  FileUploadItemDelete,
+  FileUploadClear,
+} from './forms/FileUpload';
+export type {
+  FileUploadProps,
+  FileState,
+  StoreState,
+  StoreAction,
+  Store,
+} from './forms/FileUpload';
+
+// Export Fps
+export { Fps } from './visual/Fps';
+export type { FpsProps } from './visual/Fps';
+
+// Export Gauge
+export {
+  Gauge,
+  GaugeIndicator,
+  GaugeTrack,
+  GaugeRange,
+  GaugeValueText,
+  GaugeLabel,
+  GaugeCombined,
+} from './visual/Gauge';
+export type { GaugeProps } from './visual/Gauge';
+
+// Export Marquee
+export {
+  Marquee,
+  MarqueeContent,
+  MarqueeEdge,
+  MarqueeItem,
+} from './visual/Marquee';
+export type {
+  MarqueeProps,
+  MarqueeEdgeProps,
+} from './visual/Marquee';
+
+// Export QRCode
+export {
+  QRCode,
+  QRCodeCanvas,
+  QRCodeSvg,
+  QRCodeImage,
+  QRCodeDownload,
+  QRCodeOverlay,
+  QRCodeSkeleton,
+} from './visual/QRCode';
+export type {
+  QRCodeProps,
+  QRCodeCanvasOpts,
+} from './visual/QRCode';
+
+// Export Rating
+export {
+  Rating,
+  RatingItem,
+} from './visual/Rating';
+export type {
+  RatingProps,
+  RatingItemProps,
+} from './visual/Rating';
+
+// Export DataGrid
+export {
+  DataGrid,
+  DataGridProvider,
+  useDataGridContext,
+  DataGridHeader,
+  DataGridRow,
+  DataGridCell,
+  DataGridPagination,
+} from './data/DataGrid';
+export type {
+  DataGridProps,
+  DataGridColumn,
+  DataGridSortState,
+  DataGridFilterState,
+  DataGridPaginationState,
+  DataGridSelectionMode,
+  DataGridRowId,
+  SortDirection,
+} from './data/DataGrid';
+
+// Export DataTable
+export {
+  DataTable,
+  DataTableProvider,
+  useDataTableContext,
+  DataTableHeader,
+  DataTableRow,
+  DataTablePagination,
+} from './data/DataTable';
+export type {
+  DataTableProps,
+  DataTableColumn,
+  DataTableSortState,
+  DataTableFilterState,
+  DataTablePaginationState,
+  DataTableSelectionMode,
+  DataTableRowId,
+  DataTableSortDirection,
+} from './data/DataTable';
+
+// Export Kanban
+export {
+  Kanban,
+  KanbanProvider,
+  useKanbanContext,
+  KanbanColumn,
+  KanbanCard,
+  KanbanDragOverlay,
+} from './data/Kanban';
+export type {
+  KanbanProps,
+  KanbanCardType,
+  KanbanColumnType,
+  KanbanDragState,
+  KanbanCardId,
+  KanbanColumnId,
+} from './data/Kanban';

package/src/tools/input/Combobox/context/ComboboxContext.tsx

@@ -0,0 +1,30 @@
+'use client';
+
+import * as React from 'react';
+import type { ComboboxContextValue } from '../types';
+
+const ComboboxContext = React.createContext<ComboboxContextValue | null>(null);
+
+export function ComboboxProvider({
+  children,
+  value,
+}: {
+  children: React.ReactNode;
+  value: ComboboxContextValue;
+}) {
+  return (
+    <ComboboxContext.Provider value={value}>
+      {children}
+    </ComboboxContext.Provider>
+  );
+}
+
+export function useComboboxContext() {
+  const context = React.useContext(ComboboxContext);
+  if (!context) {
+    throw new Error(
+      'useComboboxContext must be used within a ComboboxProvider'
+    );
+  }
+  return context;
+}

package/src/tools/input/Combobox/context/index.ts

@@ -0,0 +1,6 @@
+'use client';
+
+export {
+  ComboboxProvider,
+  useComboboxContext,
+} from './ComboboxContext';

package/src/tools/input/Combobox/index.ts

@@ -0,0 +1,45 @@
+'use client';
+
+/**
+ * Combobox
+ *
+ * Advanced combobox with filtering, multi-select, and custom rendering.
+ * Built on ui-core Popover primitives.
+ *
+ * @example
+ * import { Combobox, ComboboxTrigger, ComboboxInput, ComboboxList, ComboboxItem } from '@djangocfg/ui-tools/combobox';
+ *
+ * <Combobox options={options} onChange={console.log}>
+ *   <ComboboxTrigger />
+ *   <ComboboxList>
+ *     {options.map((opt, i) => (
+ *       <ComboboxItem key={opt.value} option={opt} index={i} />
+ *     ))}
+ *   </ComboboxList>
+ * </Combobox>
+ */
+
+export {
+  Combobox,
+  ComboboxTrigger,
+  ComboboxInput,
+  ComboboxList,
+  ComboboxItem,
+  ComboboxEmpty,
+} from './parts';
+
+export {
+  ComboboxProvider,
+  useComboboxContext,
+} from './context';
+
+export type {
+  ComboboxProps,
+  ComboboxTriggerProps,
+  ComboboxInputProps,
+  ComboboxListProps,
+  ComboboxItemProps,
+  ComboboxEmptyProps,
+  ComboboxContextValue,
+  ComboboxOption,
+} from './types';