@moldable-ai/ui 0.2.22 → 0.2.24

package/dist/components/ui/toggle-group.js

@@ -2,21 +2,21 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
 import * as React from 'react';
-import { cn } from '../../lib/utils';
-import { toggleVariants } from './toggle';
+import { cn } from '../../lib/utils.js';
+import { toggleVariants } from './toggle.js';
 const ToggleGroupContext = React.createContext({
     size: 'default',
     variant: 'default',
     spacing: 0,
 });
 function ToggleGroup({ className, variant, size, spacing = 0, children, ...props }) {
-    return (_jsx(ToggleGroupPrimitive.Root, { "data-slot": "toggle-group", "data-variant": variant, "data-size": size, "data-spacing": spacing, style: { '--gap': spacing }, className: cn('group/toggle-group data-[spacing=default]:data-[variant=outline]:shadow-xs flex w-fit items-center gap-[--spacing(var(--gap))] rounded-md', className), ...props, children: _jsx(ToggleGroupContext.Provider, { value: { variant, size, spacing }, children: children }) }));
+    return (_jsx(ToggleGroupPrimitive.Root, { "data-slot": "toggle-group", "data-variant": variant, "data-size": size, "data-spacing": spacing, style: { '--gap': spacing }, className: cn('group/toggle-group data-[spacing=default]:data-[variant=outline]:shadow-xs rounded-control flex w-fit items-center gap-[--spacing(var(--gap))]', className), ...props, children: _jsx(ToggleGroupContext.Provider, { value: { variant, size, spacing }, children: children }) }));
 }
 function ToggleGroupItem({ className, children, variant, size, ...props }) {
     const context = React.useContext(ToggleGroupContext);
     return (_jsx(ToggleGroupPrimitive.Item, { "data-slot": "toggle-group-item", "data-variant": context.variant || variant, "data-size": context.size || size, "data-spacing": context.spacing, className: cn(toggleVariants({
             variant: context.variant || variant,
             size: context.size || size,
-        }), 'w-auto min-w-0 shrink-0 px-3 focus:z-10 focus-visible:z-10', 'data-[spacing=0]:rounded-none data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:shadow-none data-[spacing=0]:first:rounded-l-md data-[spacing=0]:data-[variant=outline]:first:border-l data-[spacing=0]:last:rounded-r-md', className), ...props, children: children }));
+        }), 'w-auto min-w-0 shrink-0 px-3 focus:z-10 focus-visible:z-10', 'data-[spacing=0]:first:rounded-l-control data-[spacing=0]:last:rounded-r-control data-[spacing=0]:rounded-none data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:shadow-none data-[spacing=0]:data-[variant=outline]:first:border-l', className), ...props, children: children }));
 }
 export { ToggleGroup, ToggleGroupItem };

package/dist/components/ui/toggle.d.ts

@@ -3,7 +3,7 @@ import * as React from 'react';
 import { type VariantProps } from 'class-variance-authority';
 declare const toggleVariants: (props?: ({
     variant?: "default" | "outline" | "filled" | null | undefined;
-    size?: "default" | "xs" | "sm" | "lg" | null | undefined;
+    size?: "default" | "sm" | "xs" | "lg" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 type ToggleProps = React.ComponentProps<typeof TogglePrimitive.Root> & VariantProps<typeof toggleVariants>;
 declare function Toggle({ className, variant, size, ...props }: ToggleProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/toggle.js

@@ -1,9 +1,9 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as TogglePrimitive from '@radix-ui/react-toggle';
-import { cn } from '../../lib/utils';
+import { cn } from '../../lib/utils.js';
 import { cva } from 'class-variance-authority';
-const toggleVariants = cva("inline-flex cursor-pointer items-center justify-center gap-2 rounded-md text-sm font-medium hover:bg-control-hover disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=on]:bg-control-selected data-[state=on]:text-control-selected-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[background-color,color,box-shadow] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive whitespace-nowrap", {
+const toggleVariants = cva("inline-flex cursor-pointer items-center justify-center gap-2 rounded-control text-ui-body font-medium hover:bg-control-hover active:bg-control-pressed disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=on]:bg-control-selected data-[state=on]:text-control-selected-foreground data-[state=on]:hover:bg-control-hover data-[state=on]:active:bg-control-pressed [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring focus-visible:ring-1 outline-none transition-[background-color,color,box-shadow] aria-invalid:border-destructive whitespace-nowrap", {
     variants: {
         variant: {
             default: 'bg-transparent',
@@ -11,10 +11,10 @@ const toggleVariants = cva("inline-flex cursor-pointer items-center justify-cent
             filled: 'bg-muted/70 text-foreground shadow-xs',
         },
         size: {
-            xs: 'h-6 min-w-6 gap-1 px-1.5 text-xs [&_svg:not([class*="size-"])]:size-3',
-            default: 'h-9 px-2 min-w-9',
-            sm: 'h-8 px-1.5 min-w-8',
-            lg: 'h-10 px-2.5 min-w-10',
+            xs: 'h-control-xs min-w-control-xs gap-1 px-1.5 text-ui-caption [&_svg:not([class*="size-"])]:size-3',
+            default: 'h-control-md min-w-control-md px-2',
+            sm: 'h-control-sm min-w-control-sm px-1.5',
+            lg: 'h-control-lg min-w-control-lg px-2.5',
         },
     },
     defaultVariants: {
@@ -26,10 +26,10 @@ function Toggle({ className, variant, size, ...props }) {
     return (_jsx(TogglePrimitive.Root, { "data-slot": "toggle", className: cn(toggleVariants({ variant, size, className })), ...props }));
 }
 const iconOnlySizeClasses = {
-    xs: 'size-6 min-w-6 p-0',
-    sm: 'size-8 min-w-8 p-0',
-    default: 'size-9 min-w-9 p-0',
-    lg: 'size-10 min-w-10 p-0',
+    xs: 'size-control-xs min-w-control-xs p-0',
+    sm: 'size-control-sm min-w-control-sm p-0',
+    default: 'size-control-md min-w-control-md p-0',
+    lg: 'size-control-lg min-w-control-lg p-0',
 };
 function ToggleButton({ className, iconOnly = false, size = 'default', ...props }) {
     return (_jsx(Toggle, { "data-slot": "toggle-button", "data-icon-only": iconOnly || undefined, size: size, className: cn(iconOnly && iconOnlySizeClasses[size ?? 'default'], className), ...props }));

package/dist/components/ui/toolbar.d.ts

@@ -1,13 +1,13 @@
 import * as React from 'react';
-import type { MaterialVariant } from './material';
-import { Separator } from './separator';
-import { Text } from './text';
+import type { MaterialVariant } from './material.js';
+import { Separator } from './separator.js';
+import { Text } from './text.js';
 import { type VariantProps } from 'class-variance-authority';
 declare const toolbarVariants: (props?: ({
-    variant?: "default" | "plain" | "panel" | null | undefined;
-    material?: "regular" | "clear" | "none" | null | undefined;
-    density?: "default" | "compact" | "comfortable" | null | undefined;
-    position?: "static" | "top" | "bottom" | null | undefined;
+    variant?: "default" | "panel" | "plain" | null | undefined;
+    material?: "regular" | "none" | "clear" | null | undefined;
+    density?: "compact" | "default" | "comfortable" | null | undefined;
+    position?: "top" | "bottom" | "static" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface ToolbarProps extends React.ComponentProps<'header'>, VariantProps<typeof toolbarVariants> {
     /**

package/dist/components/ui/toolbar.js

@@ -1,10 +1,10 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
-import { cn } from '../../lib/utils';
-import { Separator } from './separator';
-import { Text } from './text';
+import { cn } from '../../lib/utils.js';
+import { Separator } from './separator.js';
+import { Text } from './text.js';
 import { cva } from 'class-variance-authority';
-const toolbarVariants = cva('z-20 flex w-full shrink-0 items-center gap-2 px-3', {
+const toolbarVariants = cva('z-20 flex min-h-toolbar w-full shrink-0 items-center gap-control-gap px-control-inline', {
     variants: {
         variant: {
             default: 'border-border/70 border-b',
@@ -17,9 +17,9 @@ const toolbarVariants = cva('z-20 flex w-full shrink-0 items-center gap-2 px-3',
             none: '',
         },
         density: {
-            compact: 'min-h-8 py-1',
-            default: 'min-h-10 py-1.5',
-            comfortable: 'min-h-12 py-2',
+            compact: 'py-1',
+            default: 'py-1.5',
+            comfortable: 'py-2',
         },
         position: {
             static: '',

package/dist/components/ui/tooltip.d.ts

@@ -1,7 +1,7 @@
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import * as React from 'react';
-import { KbdGroup } from './kbd';
-import { type MaterialVariant } from './material';
+import { KbdGroup } from './kbd.js';
+import { type MaterialVariant } from './material.js';
 declare function TooltipProvider({ delayDuration, skipDelayDuration, ...props }: React.ComponentProps<typeof TooltipPrimitive.Provider>): import("react/jsx-runtime").JSX.Element;
 declare function Tooltip({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
 declare function TooltipTrigger({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/tooltip.js

@@ -1,9 +1,9 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
-import { cn } from '../../lib/utils';
-import { KbdGroup } from './kbd';
-import { Material } from './material';
+import { cn } from '../../lib/utils.js';
+import { KbdGroup } from './kbd.js';
+import { Material } from './material.js';
 function TooltipProvider({ delayDuration = 500, skipDelayDuration = 300, ...props }) {
     return (_jsx(TooltipPrimitive.Provider, { "data-slot": "tooltip-provider", delayDuration: delayDuration, skipDelayDuration: skipDelayDuration, ...props }));
 }
@@ -14,9 +14,9 @@ function TooltipTrigger({ ...props }) {
     return _jsx(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
 }
 function TooltipContent({ className, material = 'regular', sideOffset = 0, children, ...props }) {
-    return (_jsx(TooltipPrimitive.Portal, { children: _jsx(Material, { variant: material, elevation: "overlay", asChild: true, children: _jsxs(TooltipPrimitive.Content, { "data-slot": "tooltip-content", sideOffset: sideOffset, className: cn('text-popover-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95', 'data-[side=bottom]:slide-in-from-top-1 data-[side=left]:slide-in-from-right-1 data-[side=right]:slide-in-from-left-1 data-[side=top]:slide-in-from-bottom-1', 'origin-(--radix-tooltip-content-transform-origin) z-50 flex w-fit max-w-80 items-center text-balance px-2.5 py-1.5 text-xs duration-[var(--motion-duration-fast)]', className), ...props, children: [children, _jsx(TooltipPrimitive.Arrow, { className: "fill-surface-overlay z-50" })] }) }) }));
+    return (_jsx(TooltipPrimitive.Portal, { children: _jsx(Material, { variant: material, elevation: "overlay", asChild: true, children: _jsxs(TooltipPrimitive.Content, { "data-slot": "tooltip-content", sideOffset: sideOffset, className: cn('text-popover-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95', 'data-[side=bottom]:slide-in-from-top-1 data-[side=left]:slide-in-from-right-1 data-[side=right]:slide-in-from-left-1 data-[side=top]:slide-in-from-bottom-1', 'origin-(--radix-tooltip-content-transform-origin) text-ui-caption z-50 flex w-fit max-w-80 items-center text-balance px-2.5 py-1.5 duration-[var(--motion-duration-fast)]', className), ...props, children: [children, _jsx(TooltipPrimitive.Arrow, { className: "fill-surface-overlay z-50" })] }) }) }));
 }
 function TooltipShortcut({ className, ...props }) {
-    return (_jsx(KbdGroup, { "data-slot": "tooltip-shortcut", className: cn('ml-2 text-[0.625rem] opacity-70', className), ...props }));
+    return (_jsx(KbdGroup, { "data-slot": "tooltip-shortcut", className: cn('text-11 ml-2 opacity-70', className), ...props }));
 }
 export { Tooltip, TooltipContent, TooltipProvider, TooltipShortcut, TooltipTrigger, };

package/dist/index.d.ts

@@ -1,21 +1,22 @@
-export { cn } from './lib/utils';
-export { ThemeProvider, useTheme, themeScript, type Theme } from './lib/theme';
-export { WorkspaceProvider, useWorkspace, WORKSPACE_HEADER, } from './lib/workspace';
-export { useMoldableCommands, useMoldableCommand, useMoldableAppCommands, useMoldableNavigationPop, useMoldableNavigationState, isInMoldable, sendToMoldable, pushMoldableNavigation, popMoldableNavigation, resetMoldableNavigation, downloadFile, publishMoldableArtifact, setMoldableWindowFullscreen, type AppCommand, type CommandAction, type CommandsResponse, type CommandMessage, type MoldableNavigationEntry, type MoldableNavigationPopMessage, type MoldableNavigationStateMessage, type DownloadFileOptions, type MoldableArtifactFile, type MoldableArtifactPublishOptions, type MoldableArtifactPublishResult, type MoldableWindowFullscreenMode, type MoldableWindowFullscreenOptions, type MoldableWindowFullscreenResult, type MoldableWindowFullscreenMessage, type MoldableWindowFullscreenResultMessage, } from './lib/commands';
-export * from './lib/native-capabilities';
-export * from './components/ui';
-export * from './components/native-capabilities';
-export { TODAY_KIND_RANK, TODAY_KIND_TTL_MS, makeTodayItem, type TodayItem, type TodayItemKind, type TodaySurface, type TodayAction, type TodayResponse, type ResumeState, type HydratedTodayItem, type HydratedResume, } from './lib/today';
-export { useIsMobile } from './hooks/use-mobile';
-export { Markdown } from './components/markdown';
-export { RichMediaPlayer, type RichMediaPlayerProps, } from './components/rich-media-player';
-export { CodeBlock } from './components/code-block';
-export { AppErrorBoundary, type AppErrorSource, } from './components/app-error-boundary';
-export { getMoldableHostServices, installMoldableFrameLifecycle, type MoldableHostServiceCapabilities, type MoldableHostServicesAdvertisement, } from './lib/frame-lifecycle';
-export { HostServiceRequestError, isHostServiceAvailable, requestHostService, type HostServiceRequestOptions, type HostServiceResponseStatus, } from './lib/host-services';
-export { pickDateTimeWithHost, useHostDateTimePicker, type HostDateTimePicker, type HostDateTimePickerAnchorRect, type HostDateTimePickerMode, type HostDateTimePickerOptions, type HostDateTimePickerResult, } from './lib/host-date-time-picker';
-export { shareWithHost, useHostShare, type HostShare, type HostShareAnchorRect, type HostShareItem, type HostShareOptions, type HostShareResult, } from './lib/host-share';
-export { HOST_NATIVE_MENU_MAX_DEPTH, HOST_NATIVE_MENU_MAX_ITEMS, HOST_NATIVE_MENU_MAX_SUBLABEL_LENGTH, HOST_NATIVE_MENU_MAX_TITLE_LENGTH, openNativeMenuWithHost, useHostNativeMenu, type HostNativeMenu, type HostNativeMenuAnchorRect, type HostNativeMenuOptions, type HostNativeMenuPoint, type HostNativeMenuResult, type NativeMenuItem, type NativeMenuItemKind, type NativeMenuShortcut, } from './lib/host-native-menu';
-export { openFileDialogWithHost, saveFileDialogWithHost, useHostFileDialog, type HostFileDialog, type HostFileDialogDefaultLocation, type HostFileDialogFilter, type HostOpenFileDialogOptions, type HostOpenFileDialogProperties, type HostOpenFileDialogResult, type HostSaveFileDialogOptions, type HostSaveFileDialogResult, } from './lib/host-file-dialog';
-export * from './components/chat';
+export { cn } from './lib/utils.js';
+export { ThemeProvider, useTheme, themeScript, type Theme } from './lib/theme.js';
+export { WorkspaceProvider, useWorkspace, WORKSPACE_HEADER, } from './lib/workspace.js';
+export { useMoldableCommands, useMoldableCommand, useMoldableAppCommands, useMoldableNavigationPop, useMoldableNavigationState, isInMoldable, sendToMoldable, pushMoldableNavigation, popMoldableNavigation, resetMoldableNavigation, downloadFile, publishMoldableArtifact, setMoldableWindowFullscreen, type AppCommand, type CommandAction, type CommandsResponse, type CommandMessage, type MoldableNavigationEntry, type MoldableNavigationPopMessage, type MoldableNavigationStateMessage, type DownloadFileOptions, type MoldableArtifactFile, type MoldableArtifactPublishOptions, type MoldableArtifactPublishResult, type MoldableWindowFullscreenMode, type MoldableWindowFullscreenOptions, type MoldableWindowFullscreenResult, type MoldableWindowFullscreenMessage, type MoldableWindowFullscreenResultMessage, } from './lib/commands.js';
+export * from './lib/native-capabilities/index.js';
+export * from './components/ui/index.js';
+export * from './components/native-capabilities/index.js';
+export { TODAY_KIND_RANK, TODAY_KIND_TTL_MS, makeTodayItem, type TodayItem, type TodayItemKind, type TodaySurface, type TodayAction, type TodayResponse, type ResumeState, type HydratedTodayItem, type HydratedResume, } from './lib/today.js';
+export { useIsMobile } from './hooks/use-mobile.js';
+export { Markdown } from './components/markdown.js';
+export { RichMediaPlayer, type RichMediaPlayerProps, } from './components/rich-media-player.js';
+export { CodeBlock } from './components/code-block.js';
+export { AppErrorBoundary, type AppErrorSource, } from './components/app-error-boundary.js';
+export { getMoldableHostServices, installMoldableFrameLifecycle, type MoldableHostServiceCapabilities, type MoldableHostServicesAdvertisement, } from './lib/frame-lifecycle.js';
+export { HostServiceRequestError, isHostServiceAvailable, requestHostService, type HostServiceRequestOptions, type HostServiceResponseStatus, } from './lib/host-services.js';
+export { pickDateTimeWithHost, useHostDateTimePicker, type HostDateTimePicker, type HostDateTimePickerAnchorRect, type HostDateTimePickerMode, type HostDateTimePickerOptions, type HostDateTimePickerResult, } from './lib/host-date-time-picker.js';
+export { shareWithHost, useHostShare, type HostShare, type HostShareAnchorRect, type HostShareItem, type HostShareOptions, type HostShareResult, } from './lib/host-share.js';
+export { HOST_NATIVE_MENU_MAX_DEPTH, HOST_NATIVE_MENU_MAX_ITEMS, HOST_NATIVE_MENU_MAX_SUBLABEL_LENGTH, HOST_NATIVE_MENU_MAX_TITLE_LENGTH, openNativeMenuWithHost, useHostNativeMenu, type HostNativeMenu, type HostNativeMenuAnchorRect, type HostNativeMenuOptions, type HostNativeMenuPoint, type HostNativeMenuResult, type NativeMenuItem, type NativeMenuItemKind, type NativeMenuShortcut, } from './lib/host-native-menu.js';
+export { openFileDialogWithHost, saveFileDialogWithHost, useHostFileDialog, type HostFileDialog, type HostFileDialogDefaultLocation, type HostFileDialogFilter, type HostOpenFileDialogOptions, type HostOpenFileDialogProperties, type HostOpenFileDialogResult, type HostSaveFileDialogOptions, type HostSaveFileDialogResult, } from './lib/host-file-dialog.js';
+export { useHostWebSurface, type HostWebSurface, type HostWebSurfaceBounds, type HostWebSurfaceNavigationState, type HostWebSurfaceNavigationSubscriber, } from './lib/host-web-surface.js';
+export * from './components/chat/index.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/index.js

@@ -1,35 +1,36 @@
 // Export utilities
-export { cn } from './lib/utils';
+export { cn } from './lib/utils.js';
 // Export theme
-export { ThemeProvider, useTheme, themeScript } from './lib/theme';
+export { ThemeProvider, useTheme, themeScript } from './lib/theme.js';
 // Export workspace
-export { WorkspaceProvider, useWorkspace, WORKSPACE_HEADER, } from './lib/workspace';
+export { WorkspaceProvider, useWorkspace, WORKSPACE_HEADER, } from './lib/workspace.js';
 // Export commands
-export { useMoldableCommands, useMoldableCommand, useMoldableAppCommands, useMoldableNavigationPop, useMoldableNavigationState, isInMoldable, sendToMoldable, pushMoldableNavigation, popMoldableNavigation, resetMoldableNavigation, downloadFile, publishMoldableArtifact, setMoldableWindowFullscreen, } from './lib/commands';
+export { useMoldableCommands, useMoldableCommand, useMoldableAppCommands, useMoldableNavigationPop, useMoldableNavigationState, isInMoldable, sendToMoldable, pushMoldableNavigation, popMoldableNavigation, resetMoldableNavigation, downloadFile, publishMoldableArtifact, setMoldableWindowFullscreen, } from './lib/commands.js';
 // Export typed desktop/native capability APIs
-export * from './lib/native-capabilities';
+export * from './lib/native-capabilities/index.js';
 // Export UI components
-export * from './components/ui';
+export * from './components/ui/index.js';
 // Export native capability components (polished wrappers over lib/native-capabilities)
-export * from './components/native-capabilities';
+export * from './components/native-capabilities/index.js';
 // Export Today contract
-export { TODAY_KIND_RANK, TODAY_KIND_TTL_MS, makeTodayItem, } from './lib/today';
+export { TODAY_KIND_RANK, TODAY_KIND_TTL_MS, makeTodayItem, } from './lib/today.js';
 // Export hooks
-export { useIsMobile } from './hooks/use-mobile';
+export { useIsMobile } from './hooks/use-mobile.js';
 // Export Markdown
-export { Markdown } from './components/markdown';
-export { RichMediaPlayer, } from './components/rich-media-player';
+export { Markdown } from './components/markdown.js';
+export { RichMediaPlayer, } from './components/rich-media-player.js';
 // Export CodeBlock
-export { CodeBlock } from './components/code-block';
+export { CodeBlock } from './components/code-block.js';
 // Export app error boundary
-export { AppErrorBoundary, } from './components/app-error-boundary';
+export { AppErrorBoundary, } from './components/app-error-boundary.js';
 // Export Moldable frame lifecycle
-export { getMoldableHostServices, installMoldableFrameLifecycle, } from './lib/frame-lifecycle';
+export { getMoldableHostServices, installMoldableFrameLifecycle, } from './lib/frame-lifecycle.js';
 // Export the host-owned native service envelope
-export { HostServiceRequestError, isHostServiceAvailable, requestHostService, } from './lib/host-services';
-export { pickDateTimeWithHost, useHostDateTimePicker, } from './lib/host-date-time-picker';
-export { shareWithHost, useHostShare, } from './lib/host-share';
-export { HOST_NATIVE_MENU_MAX_DEPTH, HOST_NATIVE_MENU_MAX_ITEMS, HOST_NATIVE_MENU_MAX_SUBLABEL_LENGTH, HOST_NATIVE_MENU_MAX_TITLE_LENGTH, openNativeMenuWithHost, useHostNativeMenu, } from './lib/host-native-menu';
-export { openFileDialogWithHost, saveFileDialogWithHost, useHostFileDialog, } from './lib/host-file-dialog';
+export { HostServiceRequestError, isHostServiceAvailable, requestHostService, } from './lib/host-services.js';
+export { pickDateTimeWithHost, useHostDateTimePicker, } from './lib/host-date-time-picker.js';
+export { shareWithHost, useHostShare, } from './lib/host-share.js';
+export { HOST_NATIVE_MENU_MAX_DEPTH, HOST_NATIVE_MENU_MAX_ITEMS, HOST_NATIVE_MENU_MAX_SUBLABEL_LENGTH, HOST_NATIVE_MENU_MAX_TITLE_LENGTH, openNativeMenuWithHost, useHostNativeMenu, } from './lib/host-native-menu.js';
+export { openFileDialogWithHost, saveFileDialogWithHost, useHostFileDialog, } from './lib/host-file-dialog.js';
+export { useHostWebSurface, } from './lib/host-web-surface.js';
 // Export chat components
-export * from './components/chat';
+export * from './components/chat/index.js';

package/dist/lib/frame-lifecycle.d.ts

@@ -30,6 +30,11 @@ export interface MoldableHostContextMessage {
     titlebar?: 'host' | 'app';
     platform?: 'macos' | 'windows' | 'linux' | 'unknown';
     windowId?: string;
+    nativeMaterial?: {
+        regions?: {
+            sidebar?: unknown;
+        };
+    };
     safeInsets?: {
         top?: unknown;
         inlineStart?: unknown;
@@ -46,8 +51,30 @@ export interface MoldableHostContextMessage {
     };
     hostServices?: unknown;
 }
+export declare const MOLDABLE_NAVIGATION_CHORD_ALLOWLIST: readonly [{
+    readonly chord: "back";
+    readonly code: "BracketLeft";
+    readonly metaKey: true;
+    readonly altKey: false;
+    readonly ctrlKey: false;
+    readonly shiftKey: false;
+}];
+export declare const MOLDABLE_MATERIAL_REGION_CHANGE_EVENT = "moldable:material-region-change";
+export declare const MOLDABLE_MATERIAL_REGION_MESSAGE_TYPE = "moldable:material-region";
+export declare const MOLDABLE_MATERIAL_REGION_ACK_TYPE = "moldable:material-region-ack";
+export declare const MOLDABLE_SIDEBAR_REGION_WIDTH_PROPERTY = "--moldable-material-region-sidebar-width";
+export interface MoldableMaterialRegionAck {
+    type: typeof MOLDABLE_MATERIAL_REGION_ACK_TYPE;
+    regionId: string;
+    role: 'sidebar';
+    side: 'leading';
+    active: boolean;
+    width?: number;
+}
 export declare function getMoldableHostServices(): MoldableHostServicesAdvertisement | undefined;
+export declare function applyMoldableMaterialRegionAck(value: unknown): boolean;
 export declare function applyMoldableChatSafePadding(safePadding: unknown): boolean;
 export declare function applyMoldableHostContext(message: MoldableHostContextMessage): void;
+export declare function installMoldableNavigationChordLifecycle(): () => void;
 export declare function installMoldableFrameLifecycle(): void;
 //# sourceMappingURL=frame-lifecycle.d.ts.map

package/dist/lib/frame-lifecycle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"frame-lifecycle.d.ts","sourceRoot":"","sources":["../../src/lib/frame-lifecycle.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,wBAAwB;IACvC,IAAI,EAAE,qBAAqB,CAAA;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB;AAED,MAAM,MAAM,+BAA+B,GAAG;IAC5C,KAAK,CAAC,EAAE;QACN,KAAK,EAAE,KAAK,CAAC,MAAM,GAAG,KAAK,GAAG,eAAe,CAAC,CAAA;KAC/C,CAAA;IACD,cAAc,CAAC,EAAE;QACf,KAAK,EAAE,KAAK,CAAC,MAAM,GAAG,MAAM,GAAG,UAAU,CAAC,CAAA;KAC3C,CAAA;IACD,UAAU,CAAC,EAAE;QACX,QAAQ,EAAE,MAAM,CAAA;QAChB,QAAQ,EAAE,MAAM,CAAA;KACjB,CAAA;IACD,UAAU,CAAC,EAAE;QACX,KAAK,EAAE,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC,CAAA;KAC9B,CAAA;CACF,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,SAAS,CAAC,CAAA;AAEvD,MAAM,WAAW,iCAAiC;IAChD,OAAO,EAAE,CAAC,CAAA;IACV,QAAQ,EAAE,+BAA+B,CAAA;CAC1C;AAED,MAAM,WAAW,0BAA0B;IACzC,IAAI,EAAE,uBAAuB,CAAA;IAC7B,OAAO,EAAE,CAAC,CAAA;IACV,WAAW,EAAE,UAAU,GAAG,QAAQ,CAAA;IAClC,QAAQ,CAAC,EAAE,MAAM,GAAG,KAAK,CAAA;IACzB,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAA;IACpD,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,UAAU,CAAC,EAAE;QACX,GAAG,CAAC,EAAE,OAAO,CAAA;QACb,WAAW,CAAC,EAAE,OAAO,CAAA;QACrB,SAAS,CAAC,EAAE,OAAO,CAAA;QACnB,MAAM,CAAC,EAAE,OAAO,CAAA;QAChB,cAAc,CAAC,EAAE,OAAO,CAAA;QACxB,uBAAuB,CAAC,EAAE,OAAO,CAAA;QACjC,qBAAqB,CAAC,EAAE,OAAO,CAAA;QAC/B,YAAY,CAAC,EAAE,OAAO,CAAA;KACvB,CAAA;IACD,IAAI,CAAC,EAAE;QACL,YAAY,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,UAAU,GAAG,WAAW,CAAA;QAC7D,WAAW,CAAC,EAAE,OAAO,CAAA;KACtB,CAAA;IACD,YAAY,CAAC,EAAE,OAAO,CAAA;CACvB;AAuDD,wBAAgB,uBAAuB,IACnC,iCAAiC,GACjC,SAAS,CAEZ;AAED,wBAAgB,4BAA4B,CAAC,WAAW,EAAE,OAAO,GAAG,OAAO,CAa1E;AAsBD,wBAAgB,wBAAwB,CACtC,OAAO,EAAE,0BAA0B,GAClC,IAAI,CAoCN;AA+ED,wBAAgB,6BAA6B,IAAI,IAAI,CAcpD"}
+{"version":3,"file":"frame-lifecycle.d.ts","sourceRoot":"","sources":["../../src/lib/frame-lifecycle.ts"],"names":[],"mappings":"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"}

package/dist/lib/frame-lifecycle.js

@@ -1,5 +1,20 @@
+export const MOLDABLE_NAVIGATION_CHORD_ALLOWLIST = [
+    {
+        chord: 'back',
+        code: 'BracketLeft',
+        metaKey: true,
+        altKey: false,
+        ctrlKey: false,
+        shiftKey: false,
+    },
+];
 let frameLifecycleInstalled = false;
 let advertisedHostServices;
+let sidebarMaterialPreviousBodyBackgroundColor = null;
+export const MOLDABLE_MATERIAL_REGION_CHANGE_EVENT = 'moldable:material-region-change';
+export const MOLDABLE_MATERIAL_REGION_MESSAGE_TYPE = 'moldable:material-region';
+export const MOLDABLE_MATERIAL_REGION_ACK_TYPE = 'moldable:material-region-ack';
+export const MOLDABLE_SIDEBAR_REGION_WIDTH_PROPERTY = '--moldable-material-region-sidebar-width';
 function normalizeHostServices(value) {
     if (typeof value !== 'object' ||
         value === null ||
@@ -24,6 +39,79 @@ function normalizeHostServices(value) {
 export function getMoldableHostServices() {
     return advertisedHostServices;
 }
+function clearSidebarMaterialRegion() {
+    const root = document.documentElement;
+    const hadActiveRegion = root.dataset.moldableMaterialRegionSidebar === 'active';
+    delete root.dataset.moldableMaterialRegionSidebar;
+    delete root.dataset.moldableMaterialRegionSidebarId;
+    root.style.removeProperty(MOLDABLE_SIDEBAR_REGION_WIDTH_PROPERTY);
+    if (sidebarMaterialPreviousBodyBackgroundColor !== null) {
+        if (sidebarMaterialPreviousBodyBackgroundColor) {
+            document.body.style.backgroundColor =
+                sidebarMaterialPreviousBodyBackgroundColor;
+        }
+        else {
+            document.body.style.removeProperty('background-color');
+        }
+        sidebarMaterialPreviousBodyBackgroundColor = null;
+    }
+    if (hadActiveRegion) {
+        window.dispatchEvent(new CustomEvent(MOLDABLE_MATERIAL_REGION_CHANGE_EVENT, {
+            detail: { role: 'sidebar', active: false },
+        }));
+    }
+}
+export function applyMoldableMaterialRegionAck(value) {
+    if (typeof value !== 'object' || value === null || Array.isArray(value)) {
+        return false;
+    }
+    const ack = value;
+    if (ack.type !== MOLDABLE_MATERIAL_REGION_ACK_TYPE ||
+        typeof ack.regionId !== 'string' ||
+        ack.regionId.length === 0 ||
+        ack.regionId.length > 128 ||
+        ack.role !== 'sidebar' ||
+        ack.side !== 'leading' ||
+        typeof ack.active !== 'boolean') {
+        return false;
+    }
+    if (!ack.active) {
+        const activeRegionId = document.documentElement.dataset.moldableMaterialRegionSidebarId;
+        if (activeRegionId && activeRegionId !== ack.regionId)
+            return false;
+        clearSidebarMaterialRegion();
+        return true;
+    }
+    if (document.documentElement.dataset.moldableNativeMaterialSidebar !==
+        'available' ||
+        typeof ack.width !== 'number' ||
+        !Number.isFinite(ack.width) ||
+        ack.width < 120 ||
+        ack.width > 600) {
+        return false;
+    }
+    const normalizedAck = {
+        type: MOLDABLE_MATERIAL_REGION_ACK_TYPE,
+        regionId: ack.regionId,
+        role: 'sidebar',
+        side: 'leading',
+        active: true,
+        width: ack.width,
+    };
+    const root = document.documentElement;
+    root.dataset.moldableMaterialRegionSidebar = 'active';
+    root.dataset.moldableMaterialRegionSidebarId = normalizedAck.regionId;
+    root.style.setProperty(MOLDABLE_SIDEBAR_REGION_WIDTH_PROPERTY, `${normalizedAck.width}px`);
+    if (sidebarMaterialPreviousBodyBackgroundColor === null) {
+        sidebarMaterialPreviousBodyBackgroundColor =
+            document.body.style.backgroundColor;
+    }
+    document.body.style.backgroundColor = 'transparent';
+    window.dispatchEvent(new CustomEvent(MOLDABLE_MATERIAL_REGION_CHANGE_EVENT, {
+        detail: normalizedAck,
+    }));
+    return true;
+}
 export function applyMoldableChatSafePadding(safePadding) {
     if (typeof document === 'undefined')
         return false;
@@ -59,6 +147,15 @@ export function applyMoldableHostContext(message) {
         root.dataset.moldablePlatform = message.platform;
     if (message.windowId)
         root.dataset.moldableWindowId = message.windowId;
+    const sidebarMaterialAvailable = message.displayMode === 'window' &&
+        message.nativeMaterial?.regions?.sidebar === true;
+    if (sidebarMaterialAvailable) {
+        root.dataset.moldableNativeMaterialSidebar = 'available';
+    }
+    else {
+        delete root.dataset.moldableNativeMaterialSidebar;
+        clearSidebarMaterialRegion();
+    }
     const insets = message.safeInsets;
     if (insets) {
         applyBoundedLength('--window-safe-area-top', insets.top);
@@ -107,6 +204,9 @@ function installHostStateLifecycle() {
                 applyMoldableHostContext(message);
             }
         }
+        else if (event.data.type === MOLDABLE_MATERIAL_REGION_ACK_TYPE) {
+            applyMoldableMaterialRegionAck(event.data);
+        }
     });
 }
 function postMoldableFrameMessage(message) {
@@ -114,6 +214,41 @@ function postMoldableFrameMessage(message) {
         return;
     window.parent.postMessage(message, '*');
 }
+function isEditableKeyTarget(target) {
+    if (!(target instanceof Element))
+        return false;
+    if (target.closest('input, textarea, select'))
+        return true;
+    if (target instanceof HTMLElement && target.isContentEditable)
+        return true;
+    const contentEditable = target.closest('[contenteditable]');
+    const contentEditableValue = contentEditable
+        ?.getAttribute('contenteditable')
+        ?.toLowerCase();
+    return (contentEditableValue === '' ||
+        contentEditableValue === 'true' ||
+        contentEditableValue === 'plaintext-only');
+}
+export function installMoldableNavigationChordLifecycle() {
+    const handleKeyDown = (event) => {
+        if (event.defaultPrevented || isEditableKeyTarget(event.target))
+            return;
+        const match = MOLDABLE_NAVIGATION_CHORD_ALLOWLIST.find((candidate) => event.code === candidate.code &&
+            event.metaKey === candidate.metaKey &&
+            event.altKey === candidate.altKey &&
+            event.ctrlKey === candidate.ctrlKey &&
+            event.shiftKey === candidate.shiftKey);
+        if (!match)
+            return;
+        event.preventDefault();
+        postMoldableFrameMessage({
+            type: 'moldable:navigation-chord',
+            chord: match.chord,
+        });
+    };
+    document.addEventListener('keydown', handleKeyDown, true);
+    return () => document.removeEventListener('keydown', handleKeyDown, true);
+}
 function reportAppReady(reason) {
     postMoldableFrameMessage({ type: 'moldable:app-ready', reason });
 }
@@ -148,6 +283,7 @@ export function installMoldableFrameLifecycle() {
         return;
     frameLifecycleInstalled = true;
     installHostStateLifecycle();
+    installMoldableNavigationChordLifecycle();
     installViteHmrLifecycle();
     scheduleRenderReady();
     if (document.readyState === 'complete') {

package/dist/lib/host-date-time-picker.d.ts

@@ -1,4 +1,4 @@
-import { type HostServiceRequestOptions } from './host-services';
+import { type HostServiceRequestOptions } from './host-services.js';
 export type HostDateTimePickerMode = 'date' | 'time' | 'datetime';
 export interface HostDateTimePickerAnchorRect {
     x: number;

package/dist/lib/host-date-time-picker.js

@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useState } from 'react';
-import { HostServiceRequestError, isHostServiceAvailable, requestHostService, } from './host-services';
+import { HostServiceRequestError, isHostServiceAvailable, requestHostService, } from './host-services.js';
 const HOST_CONTEXT_CHANGE_EVENT = 'moldable:host-context-change';
 const DATE_TIME_PICKER_SERVICE_NAME = 'dateTimePicker';
 const MAX_ISO_VALUE_LENGTH = 128;

package/dist/lib/host-file-dialog.d.ts

@@ -1,4 +1,4 @@
-import { type HostServiceRequestOptions } from './host-services';
+import { type HostServiceRequestOptions } from './host-services.js';
 export type HostFileDialogDefaultLocation = 'documents' | 'downloads' | 'desktop' | 'home' | 'appData';
 export interface HostFileDialogFilter {
     name: string;

package/dist/lib/host-file-dialog.js

@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useState } from 'react';
-import { HostServiceRequestError, isHostServiceAvailable, requestHostService, } from './host-services';
+import { HostServiceRequestError, isHostServiceAvailable, requestHostService, } from './host-services.js';
 const HOST_CONTEXT_CHANGE_EVENT = 'moldable:host-context-change';
 const FILE_DIALOG_SERVICE_NAME = 'fileDialog';
 const MAX_TEXT_LENGTH = 512;