@vireo-ai/trellis-ui 0.1.33 → 0.1.35

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vireo-ai/trellis-ui",
-  "version": "0.1.33",
+  "version": "0.1.35",
   "type": "module",
   "description": "Django-native UI toolkit for building realtime and interactive web apps.",
   "license": "MIT",

package/packages/client/src/styles/recipes/selection.css

@@ -25,11 +25,14 @@
     background-color: var(--ui-surface-color);
   }
 
-  [data-ui-selection-recipe="switch-track"],
   [data-ui-selection-recipe="slider-track"] {
     background-color: var(--color-intent-neutral-soft);
   }
 
+  [data-ui-selection-recipe="switch-track"] {
+    background-color: var(--color-intent-neutral-soft-pressed);
+  }
+
   [data-ui-selection-recipe="switch-thumb"][data-checked] {
     &::after {
       position: absolute;

package/packages/client/types/assets/full-runtime.generated.d.ts

@@ -1,2 +1,2 @@
-declare const fullRuntimeAssetIds: readonly ["trellis:core", "trellis:motion", "trellis:resizable", "trellis:sortable", "trellis:accordion", "trellis:button", "trellis:checkbox", "trellis:date-picker", "trellis:dropdown", "trellis:field", "trellis:file-upload", "trellis:input", "trellis:modal", "trellis:panels", "trellis:radio", "trellis:scroll-area", "trellis:select", "trellis:sidebar", "trellis:slider", "trellis:switch", "trellis:tabs", "trellis:toast", "trellis:table"];
+declare const fullRuntimeAssetIds: readonly ["trellis:core", "trellis:motion", "trellis:resizable", "trellis:sortable", "trellis:accordion", "trellis:button", "trellis:checkbox", "trellis:date-picker", "trellis:direct-upload", "trellis:dropdown", "trellis:field", "trellis:file-upload", "trellis:input", "trellis:modal", "trellis:panels", "trellis:radio", "trellis:scroll-area", "trellis:select", "trellis:sidebar", "trellis:slider", "trellis:switch", "trellis:tabs", "trellis:toast", "trellis:table"];
 export { fullRuntimeAssetIds };

package/packages/client/types/components/direct-upload/contract.d.ts

@@ -0,0 +1,9 @@
+import { type SchemaToProps } from '../../runtime';
+declare const directUploadSchema: {
+    startUrl: import("../../runtime/codecs").StringCodec;
+    completeUrl: import("../../runtime/codecs").StringCodec;
+    purpose: import("../../runtime/codecs").StringCodec;
+};
+type DirectUploadProps = SchemaToProps<typeof directUploadSchema>;
+export { directUploadSchema };
+export type { DirectUploadProps };

package/packages/client/types/components/direct-upload/entry.generated.d.ts

@@ -0,0 +1,5 @@
+import type { Alpine as AlpineType } from 'alpinejs';
+declare const registerDirectUpload: (AlpineInstance: AlpineType) => void;
+export { registerDirectUpload };
+export default registerDirectUpload;
+export * from './index';

package/packages/client/types/components/direct-upload/index.d.ts

@@ -0,0 +1,17 @@
+import { type AlpineMachine, type TrellisAlpineComponent } from '../../runtime';
+import type { FileUploadTransition } from '../file-upload';
+import { type DirectUploadProps } from './contract';
+import { directUploadHooks, type DirectUploadContext } from './machine';
+type ResolveFile = (id: string) => File | null;
+interface UiDirectUploadApi {
+    clear(): void;
+    upload(transition: FileUploadTransition<'uploading'>, resolveFile: ResolveFile): Promise<void>;
+}
+type DirectUploadData = AlpineMachine<DirectUploadContext, DirectUploadProps, typeof directUploadHooks> & UiDirectUploadApi & {
+    init(): void;
+    destroy(): void;
+};
+declare const UiDirectUpload: () => TrellisAlpineComponent<DirectUploadData>;
+declare const registerDirectUpload: import("../../runtime").AlpineDataRegistrar;
+export { registerDirectUpload, UiDirectUpload };
+export type { DirectUploadData, UiDirectUploadApi };

package/packages/client/types/components/direct-upload/machine.d.ts

@@ -0,0 +1,18 @@
+import { type Machine, type MachineScope } from '../../runtime/state-machine';
+import type { DirectUploadProps } from './contract';
+type DirectUploadStatus = 'idle' | 'starting' | 'transferring' | 'completing' | 'complete' | 'failed' | 'canceled';
+type DirectUploadContext = {
+    status: DirectUploadStatus;
+    uploadId: string;
+    error: string;
+};
+type DirectUploadEffects = {
+    sync(scope: MachineScope<DirectUploadContext, DirectUploadProps>): void;
+};
+declare const directUploadHooks: readonly [];
+declare const createDirectUploadMachine: ({ props, effects, }: {
+    props: DirectUploadProps;
+    effects: DirectUploadEffects;
+}) => Machine<DirectUploadContext, DirectUploadProps>;
+export { createDirectUploadMachine, directUploadHooks };
+export type { DirectUploadContext, DirectUploadEffects, DirectUploadStatus };

package/packages/client/types/components/direct-upload/runtime-docs.d.ts

@@ -0,0 +1,2 @@
+declare const directUploadRuntimeDocs: import("../../docs/transition-docs").ComponentTransitionDocs;
+export { directUploadRuntimeDocs };

package/packages/client/types/components/direct-upload/transport.d.ts

@@ -0,0 +1,18 @@
+type DirectUploadInstructions = {
+    transport: string;
+    method: 'POST';
+    url: string;
+    fields: Record<string, string>;
+    file_field: string;
+};
+type TransferOptions = {
+    signal?: AbortSignal;
+    onProgress?: (loaded: number, total: number) => void;
+    capability?: string;
+};
+declare const postDirectUpload: <T>(url: string, data: Record<string, string | number>, options?: {
+    signal?: AbortSignal;
+}) => Promise<T>;
+declare const transferDirectUpload: (instructions: DirectUploadInstructions, file: File, options?: TransferOptions) => Promise<void>;
+export { postDirectUpload, transferDirectUpload };
+export type { DirectUploadInstructions, TransferOptions };

package/packages/client/types/components/entry.generated.d.ts

@@ -8,6 +8,7 @@ export * from './accordion/entry.generated';
 export * from './button/entry.generated';
 export * from './checkbox/entry.generated';
 export * from './date-picker/entry.generated';
+export * from './direct-upload/entry.generated';
 export * from './dropdown/entry.generated';
 export * from './field/entry.generated';
 export * from './file-upload/entry.generated';

package/packages/client/types/core.d.ts

@@ -6,5 +6,5 @@ export { coreRuntime, ui };
 export default coreRuntime;
 export type { CoreRuntimePlugin };
 export { bool, createAlpineMachine, createMachine, decodeProps, defineAlpineData, defineManifest, defineProps, defineStyles, json, mergeBindings, number, oneOf, propsFromSchema, resolveStyle, string, createTransitionCoordinator, defineHook, } from './runtime';
-export type { AlpineMachine, AlpineMachineOwner, AlpinePropsChangedEvent, AlpineDataFactory, AlpineDataRegistrar, CodecFn, ComponentManifest, CreateAlpineMachineOptions, DecodePropsOptions, Machine, MachineConfig, MachineEffect, MachineEffectList, MachineEffectRef, MachineEntry, MachineEvent, MachineEventObject, MachineGuard, MachineOptions, MachineReducer, MachineReducerList, MachineReducerRef, MachineScope, MachineSnapshot, MachineStateConfig, MachineStateValue, MachineTransition, MachineTransitionDefinition, MachineUpdate, DefineManifestOptions, DefineStylesOptions, ManifestPart, ManifestProp, ManifestPropDetails, ManifestToken, MachineFactoryScope, BindingInput, PropState, PropsFromSchemaOptions, MergeBindingsOptions, ResolveStyleOptions, SchemaPropDetails, SchemaToProps, StyleDefinition, StylePart, StyleProps, TrellisAlpineComponent, AnyTransitionHook, TransitionCallback, TransitionContext, TransitionCoordinator, TransitionCoordinatorOptions, TransitionEventCreator, TransitionForHook, TransitionHookDefinition, UiRuntime, } from './runtime';
+export type { AlpineMachine, AlpineMachineOwner, AlpinePropsChangedEvent, AlpineDataFactory, AlpineDataRegistrar, CodecFn, ComponentManifest, CreateAlpineMachineOptions, DecodePropsOptions, Machine, MachineConfig, MachineEffect, MachineEffectList, MachineEffectRef, MachineEntry, MachineEvent, MachineEventObject, MachineGuard, MachineOptions, MachineReducer, MachineReducerList, MachineReducerRef, MachineScope, MachineSnapshot, MachineStateConfig, MachineStateValue, MachineTransition, MachineTransitionDefinition, MachineUpdate, DefineManifestOptions, DefineStylesOptions, ManifestPart, ManifestProp, ManifestPropDetails, ManifestToken, MachineFactoryScope, BindingInput, PropState, PropsFromSchemaOptions, MergeBindingsOptions, ResolveStyleOptions, SchemaPropDetails, SchemaToProps, StyleDefinition, StylePart, StyleProps, TrellisAlpineComponent, AnyTransitionHook, TransitionCallback, TransitionContext, TransitionCoordinator, TransitionCoordinatorOptions, TransitionEventCreator, TransitionForHook, TransitionHookDefinition, UiGetOptions, UiRequestOptions, UiRuntime, } from './runtime';
 export { registerTransitionDirective } from './directives/transition';

package/packages/client/types/runtime/drag-and-drop/sortable/ghost.d.ts

@@ -5,6 +5,23 @@ type ManagedGhostFrame = Readonly<{
     width: number;
     height: number;
 }>;
+type SortablePreviewPositionOptions = Readonly<{
+    value: string;
+    input: SortableInput;
+    initialInput: SortableInput;
+    sourceRect: Readonly<{
+        left: number;
+        top: number;
+    }>;
+    previewSize: Readonly<{
+        width: number;
+        height: number;
+    }>;
+}>;
+declare const resolveSortablePreviewPosition: ({ value, input, initialInput, sourceRect, previewSize, }: SortablePreviewPositionOptions) => Readonly<{
+    x: number;
+    y: number;
+}>;
 type SortableGhost = Readonly<{
     positioner: HTMLElement;
     visual: HTMLElement;
@@ -16,11 +33,12 @@ type SortableGhost = Readonly<{
 }>;
 declare const sanitizeClone: (root: HTMLElement) => void;
 declare const frameFromRect: (rect: DOMRect | DOMRectReadOnly) => ManagedGhostFrame;
-declare const createSortableGhost: ({ source, input, preview, opacity }: {
+declare const createSortableGhost: ({ source, input, preview, previewPosition, opacity }: {
     source: HTMLElement;
     input: SortableInput;
     preview?: HTMLTemplateElement | null;
+    previewPosition?: string;
     opacity?: number;
 }) => SortableGhost;
-export { createSortableGhost, frameFromRect, sanitizeClone };
-export type { ManagedGhostFrame, SortableGhost };
+export { createSortableGhost, frameFromRect, resolveSortablePreviewPosition, sanitizeClone };
+export type { ManagedGhostFrame, SortableGhost, SortablePreviewPositionOptions };

package/packages/client/types/runtime/drag-and-drop/sortable/index.d.ts

@@ -3,8 +3,8 @@ export { isValidGridColumns } from './contract';
 export { projectSortableReorderLayout, resolveSortableDropFrame, resolveSortableReorderOffsets, } from './feedback';
 export type { SortableReorderLayout, SortableReorderOffset } from './feedback';
 export type { SortableIndicatorFrame } from './placement';
-export { createSortableGhost, frameFromRect, sanitizeClone } from './ghost';
-export type { ManagedGhostFrame, SortableGhost } from './ghost';
+export { createSortableGhost, frameFromRect, resolveSortablePreviewPosition, sanitizeClone } from './ghost';
+export type { ManagedGhostFrame, SortableGhost, SortablePreviewPositionOptions } from './ghost';
 export { createSortableRegistry, sortable } from './registry';
 export { activateSortableCursor } from './cursor';
 export { createSortableSourceMachine } from './source-machine';

package/packages/client/types/runtime/engine/navigation.d.ts

@@ -7,6 +7,6 @@ type NavigationOptions = RequestOptions & {
 declare const HISTORY_NAMESPACE = "__trellis";
 declare const SCROLL_CONTAINER_SELECTOR = "[data-ui-scroll-restoration]";
 declare const registerNavigationRuntime: (AlpineInstance: Alpine.Alpine | StreamAlpine) => void;
-declare const navigateWithAlpine: (AlpineInstance: Alpine.Alpine | StreamAlpine, url: string | URL, source?: Element, options?: NavigationOptions) => void;
+declare const navigateWithAlpine: (AlpineInstance: Alpine.Alpine | StreamAlpine, url: string | URL, source?: Element, options?: NavigationOptions) => Promise<void>;
 export { HISTORY_NAMESPACE, SCROLL_CONTAINER_SELECTOR, navigateWithAlpine, registerNavigationRuntime, };
 export type { NavigationOptions };

package/packages/client/types/runtime/index.d.ts

@@ -22,7 +22,7 @@ export { del as deleteRequest, get, post, put, registerRequestRuntime, type Requ
 export { applyStreamPatch, applyStreamPatches, applyUiEffect, applyUiEffects, connectStream, dispatchStreamEvent, registerStream, type PatchMode, type StreamEventPayload, type StreamPatchPayload, type UiEffectPayload, } from './engine/stream';
 export { applyThemeMode, createThemeStore, registerThemeStore, type ResolvedThemeMode, type ThemeChangeDetail, type ThemeStore, type ThemeMode, } from './theme';
 export { lockDocumentScroll, unlockDocumentScroll } from './scroll-lock';
-export { registerUiMagic, ui, type UiRuntime } from './ui';
+export { registerUiMagic, ui, type UiGetOptions, type UiRequestOptions, type UiRuntime } from './ui';
 export { createTransitionCoordinator, defineHook, type AnyTransitionHook, type TransitionCallback, type TransitionContext, type TransitionCoordinator, type TransitionCoordinatorOptions, type TransitionEventCreator, type TransitionElementResolver, type TransitionForHook, type TransitionHookDefinition, } from './transition-coordinator';
 type TrellisAlpineComponent<T> = T & Alpine.XDataContext & {
     init(): void;

package/packages/client/types/runtime/ui.d.ts

@@ -1,12 +1,20 @@
 import type Alpine from 'alpinejs';
 import type { motion } from '../motion';
-import { del, get, post, put } from './engine/request';
+import { type NavigationHistory, type RequestOptions, type RequestResult } from './engine/request';
 import type { sortable, UiSortableService } from './drag-and-drop/sortable';
+type UiRequestOptions = RequestOptions & {
+    navigate?: boolean;
+};
+type UiGetOptions = UiRequestOptions & {
+    history?: NavigationHistory;
+};
+type UiGet = (url: string | URL, options?: UiGetOptions) => Promise<RequestResult | void>;
+type UiMutation = (url: string | URL, options?: UiRequestOptions) => Promise<RequestResult>;
 type UiRuntime = {
-    readonly delete: typeof del;
-    readonly get: typeof get;
-    readonly post: typeof post;
-    readonly put: typeof put;
+    readonly delete: UiMutation;
+    readonly get: UiGet;
+    readonly post: UiMutation;
+    readonly put: UiMutation;
     readonly isFetching: boolean;
     readonly motion: typeof motion;
     readonly sortable: UiSortableService;
@@ -20,4 +28,4 @@ declare const registerUiMagic: (AlpineInstance: Alpine.Alpine) => void;
 declare const registerUiMotion: (value: typeof motion) => void;
 declare const registerUiSortable: (value: typeof sortable) => void;
 export { registerUiMagic, registerUiMotion, registerUiSortable, ui };
-export type { UiCapabilities, UiRuntime };
+export type { UiCapabilities, UiGetOptions, UiRequestOptions, UiRuntime };

package/packages/server/trellis_ui/static/trellis_ui/assets/css/trellis.css

@@ -10366,9 +10366,12 @@
   [data-ui-selection-recipe="switch-thumb"], [data-ui-selection-recipe="slider-thumb"] {
     background-color: var(--ui-surface-color);
   }
-  [data-ui-selection-recipe="switch-track"], [data-ui-selection-recipe="slider-track"] {
+  [data-ui-selection-recipe="slider-track"] {
     background-color: var(--color-intent-neutral-soft);
   }
+  [data-ui-selection-recipe="switch-track"] {
+    background-color: var(--color-intent-neutral-soft-pressed);
+  }
   [data-ui-selection-recipe="switch-thumb"][data-checked] {
     &::after {
       position: absolute;