@adea-ai/ui 0.12.0 → 0.13.0

package/dist/lib/version-notes.js

@@ -1,20 +1,20 @@
 export function plainTextFromMarkdown(markdown) {
     return markdown
-        .replace(/\r\n/g, "\n")
-        .replace(/!\[([^\]]*)\]\([^)]*\)/g, "$1")
-        .replace(/\[([^\]]+)\]\([^)]*\)/g, "$1")
-        .replace(/^[ \t]*#{1,6}[ \t]*/gm, "")
-        .replace(/^[ \t]*>[ \t]?/gm, "")
-        .replace(/^[ \t]*---+[ \t]*$/gm, "")
-        .replace(/^[ \t]*[-*+][ \t]+/gm, "• ")
-        .replace(/^[ \t]*\d+\.[ \t]+/gm, "")
-        .replace(/```[^\n]*\n?/g, "")
-        .replace(/`([^`]+)`/g, "$1")
-        .replace(/\*\*([^*]+)\*\*/g, "$1")
-        .replace(/__([^_]+)__/g, "$1")
-        .replace(/\*([^*]+)\*/g, "$1")
-        .replace(/_([^_]+)_/g, "$1")
-        .replace(/\n{3,}/g, "\n\n")
+        .replace(/\r\n/g, '\n')
+        .replace(/!\[([^\]]*)\]\([^)]*\)/g, '$1')
+        .replace(/\[([^\]]+)\]\([^)]*\)/g, '$1')
+        .replace(/^[ \t]*#{1,6}[ \t]*/gm, '')
+        .replace(/^[ \t]*>[ \t]?/gm, '')
+        .replace(/^[ \t]*---+[ \t]*$/gm, '')
+        .replace(/^[ \t]*[-*+][ \t]+/gm, '• ')
+        .replace(/^[ \t]*\d+\.[ \t]+/gm, '')
+        .replace(/```[^\n]*\n?/g, '')
+        .replace(/`([^`]+)`/g, '$1')
+        .replace(/\*\*([^*]+)\*\*/g, '$1')
+        .replace(/__([^_]+)__/g, '$1')
+        .replace(/\*([^*]+)\*/g, '$1')
+        .replace(/_([^_]+)_/g, '$1')
+        .replace(/\n{3,}/g, '\n\n')
         .trim();
 }
 export function formatReleaseDate(value) {
@@ -24,8 +24,8 @@ export function formatReleaseDate(value) {
     if (Number.isNaN(date.getTime()))
         return value;
     return new Intl.DateTimeFormat(undefined, {
-        day: "numeric",
-        month: "short",
-        year: "numeric",
+        day: 'numeric',
+        month: 'short',
+        year: 'numeric',
     }).format(date);
 }

package/package.json

@@ -1,9 +1,21 @@
 {
   "name": "@adea-ai/ui",
-  "version": "0.12.0",
-  "type": "module",
-  "main": "dist/index.js",
-  "types": "dist/index.d.ts",
+  "version": "0.13.0",
+  "description": "Shared UI kit for Adea: Base UI-backed shadcn primitives, workspace shells, and theme styles.",
+  "keywords": [
+    "base-ui",
+    "components",
+    "react",
+    "shadcn",
+    "tailwind",
+    "workspace"
+  ],
+  "license": "Apache-2.0",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/adea-ai/adea.git",
+    "directory": "packages/ui"
+  },
   "files": [
     "dist",
     "src",
@@ -11,6 +23,13 @@
     "tsconfig.json",
     "README.md"
   ],
+  "type": "module",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "imports": {
+    "#components/*": "./src/components/*.tsx",
+    "#lib/*": "./src/lib/*.ts"
+  },
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -33,12 +52,8 @@
     "./theme.css": "./src/styles/theme.css",
     "./workspace-shell.css": "./src/styles/workspace-shell.css"
   },
-  "imports": {
-    "#components/*": "./src/components/*.tsx",
-    "#lib/*": "./src/lib/*.ts"
-  },
   "scripts": {
-    "lint": "eslint .",
+    "lint": "oxlint",
     "build": "tsc -p tsconfig.json",
     "dev": "tsc -p tsconfig.json --watch --preserveWatchOutput",
     "typecheck": "tsc -p tsconfig.json --noEmit"

package/src/components/account-drawer.tsx

@@ -1,9 +1,9 @@
-"use client";
+'use client'
 
-import { createPortal } from "react-dom";
-import { useEffect, useState, type ReactNode } from "react";
-import { UserRound } from "lucide-react";
-import { Button } from "#components/ui/button";
+import { createPortal } from 'react-dom'
+import { useEffect, useState, type ReactNode } from 'react'
+import { UserRound } from 'lucide-react'
+import { Button } from '#components/ui/button'
 import {
   Drawer,
   DrawerClose,
@@ -12,21 +12,21 @@ import {
   DrawerHeader,
   DrawerTitle,
   DrawerTrigger,
-} from "#components/ui/drawer";
-import { ThemeToggle } from "./theme-toggle";
+} from '#components/ui/drawer'
+import { ThemeToggle } from './theme-toggle'
 
 export type AccountDrawerProps = {
-  accountLabel?: string;
-  authenticated?: boolean;
-  busy?: boolean;
-  musicControl?: ReactNode;
-  triggerTargetId?: string;
-  onSignIn?: () => void;
-  onSignOut?: () => void;
-};
+  accountLabel?: string
+  authenticated?: boolean
+  busy?: boolean
+  musicControl?: ReactNode
+  triggerTargetId?: string
+  onSignIn?: () => void
+  onSignOut?: () => void
+}
 
 export function AccountDrawer({
-  accountLabel = "Sign in",
+  accountLabel = 'Sign in',
   authenticated = false,
   busy = false,
   musicControl,
@@ -34,11 +34,11 @@ export function AccountDrawer({
   onSignIn,
   onSignOut,
 }: AccountDrawerProps) {
-  const [triggerTarget, setTriggerTarget] = useState<HTMLElement | null>(null);
+  const [triggerTarget, setTriggerTarget] = useState<HTMLElement | null>(null)
 
   useEffect(() => {
-    setTriggerTarget(triggerTargetId ? document.getElementById(triggerTargetId) : null);
-  }, [triggerTargetId]);
+    setTriggerTarget(triggerTargetId ? document.getElementById(triggerTargetId) : null)
+  }, [triggerTargetId])
 
   const trigger = (
     <DrawerTrigger
@@ -55,7 +55,7 @@ export function AccountDrawer({
       <UserRound aria-hidden="true" />
       <span>{accountLabel}</span>
     </DrawerTrigger>
-  );
+  )
 
   return (
     <Drawer swipeDirection="right">
@@ -75,8 +75,8 @@ export function AccountDrawer({
                 <DrawerTitle className="truncate">{accountLabel}</DrawerTitle>
                 <DrawerDescription>
                   {authenticated
-                    ? "Signed in · workspace saved"
-                    : "Guest workspace · sign in anytime"}
+                    ? 'Signed in · workspace saved'
+                    : 'Guest workspace · sign in anytime'}
                 </DrawerDescription>
               </div>
             </div>
@@ -108,8 +108,8 @@ export function AccountDrawer({
               </h2>
               <p className="text-sm text-muted-foreground">
                 {authenticated
-                  ? "Sign out on this device without removing your saved workspace."
-                  : "Sign in or create an account to keep this workspace across devices."}
+                  ? 'Sign out on this device without removing your saved workspace.'
+                  : 'Sign in or create an account to keep this workspace across devices.'}
               </p>
             </div>
             <DrawerClose
@@ -117,17 +117,17 @@ export function AccountDrawer({
                 <Button
                   type="button"
                   className="shrink-0"
-                  variant={authenticated ? "outline" : "default"}
+                  variant={authenticated ? 'outline' : 'default'}
                   disabled={busy}
                   onClick={authenticated ? onSignOut : onSignIn}
                 />
               }
             >
-              {authenticated ? "Sign out" : "Sign in"}
+              {authenticated ? 'Sign out' : 'Sign in'}
             </DrawerClose>
           </section>
         </div>
       </DrawerContent>
     </Drawer>
-  );
+  )
 }

package/src/components/on-screen-controls.tsx

@@ -1,68 +1,68 @@
-"use client";
+'use client'
 
-import { useCallback, useEffect, useRef } from "react";
-import type { PointerEvent, ReactNode } from "react";
-import { ZoomIn, ZoomOut } from "lucide-react";
-import { Button } from "#components/ui/button";
-import { cn } from "#lib/utils";
+import { useCallback, useEffect, useRef } from 'react'
+import type { PointerEvent, ReactNode } from 'react'
+import { ZoomIn, ZoomOut } from 'lucide-react'
+import { Button } from '#components/ui/button'
+import { cn } from '#lib/utils'
 type ControlButtonProps = {
-  code: string;
-  label: string;
-  children: ReactNode;
-  className?: string;
-};
+  code: string
+  label: string
+  children: ReactNode
+  className?: string
+}
 
-function sendKeyEvent(type: "keydown" | "keyup", code: string): void {
+function sendKeyEvent(type: 'keydown' | 'keyup', code: string): void {
   window.dispatchEvent(
     new KeyboardEvent(type, { bubbles: true, cancelable: true, code, key: code })
-  );
+  )
 }
 
 function ControlButton({ code, label, children, className }: ControlButtonProps) {
-  const pressed = useRef(false);
-  const pressedPointer = useRef<number | null>(null);
+  const pressed = useRef(false)
+  const pressedPointer = useRef<number | null>(null)
 
   const release = useCallback(() => {
-    if (!pressed.current) return;
-    pressed.current = false;
-    pressedPointer.current = null;
-    sendKeyEvent("keyup", code);
-  }, [code]);
+    if (!pressed.current) return
+    pressed.current = false
+    pressedPointer.current = null
+    sendKeyEvent('keyup', code)
+  }, [code])
 
   // Self-heal: release the key if the pointerup lands elsewhere (e.g. the
   // scene DOM changes mid-teleport) or the window loses focus. PointerId
   // matching preserves multi-touch.
   useEffect(() => {
     const onWindowPointerUp = (event: globalThis.PointerEvent) => {
-      if (pressedPointer.current === event.pointerId) release();
-    };
-    const onBlur = () => release();
-    window.addEventListener("pointerup", onWindowPointerUp);
-    window.addEventListener("blur", onBlur);
+      if (pressedPointer.current === event.pointerId) release()
+    }
+    const onBlur = () => release()
+    window.addEventListener('pointerup', onWindowPointerUp)
+    window.addEventListener('blur', onBlur)
     return () => {
-      window.removeEventListener("pointerup", onWindowPointerUp);
-      window.removeEventListener("blur", onBlur);
-    };
-  }, [release]);
+      window.removeEventListener('pointerup', onWindowPointerUp)
+      window.removeEventListener('blur', onBlur)
+    }
+  }, [release])
 
   const press = useCallback(
     (event: PointerEvent<HTMLButtonElement>) => {
-      event.preventDefault();
-      if (pressed.current) return;
-      pressed.current = true;
-      pressedPointer.current = event.pointerId;
-      event.currentTarget.setPointerCapture(event.pointerId);
-      sendKeyEvent("keydown", code);
+      event.preventDefault()
+      if (pressed.current) return
+      pressed.current = true
+      pressedPointer.current = event.pointerId
+      event.currentTarget.setPointerCapture(event.pointerId)
+      sendKeyEvent('keydown', code)
     },
     [code]
-  );
+  )
 
   return (
     <button
       type="button"
       aria-label={label}
       className={cn(
-        "flex size-14 touch-none select-none items-center justify-center rounded-2xl border border-white/25 bg-slate-950/65 p-2 text-white shadow-lg backdrop-blur-sm transition active:scale-95 [-webkit-touch-callout:none] [-webkit-user-select:none]",
+        'flex size-14 touch-none select-none items-center justify-center rounded-2xl border border-white/25 bg-slate-950/65 p-2 text-white shadow-lg backdrop-blur-sm transition active:scale-95 [-webkit-touch-callout:none] [-webkit-user-select:none]',
         className
       )}
       onContextMenu={(event) => event.preventDefault()}
@@ -73,15 +73,15 @@ function ControlButton({ code, label, children, className }: ControlButtonProps)
     >
       {children}
     </button>
-  );
+  )
 }
 
 export type OnScreenControlsProps = {
-  onZoomIn?: () => void;
-  onZoomOut?: () => void;
-  showMovementControls?: boolean;
-  showJumpControl?: boolean;
-};
+  onZoomIn?: () => void
+  onZoomOut?: () => void
+  showMovementControls?: boolean
+  showJumpControl?: boolean
+}
 
 export function OnScreenControls({
   onZoomIn,
@@ -89,7 +89,7 @@ export function OnScreenControls({
   showMovementControls = true,
   showJumpControl = true,
 }: OnScreenControlsProps = {}) {
-  const showZoomControls = Boolean(onZoomIn && onZoomOut);
+  const showZoomControls = Boolean(onZoomIn && onZoomOut)
 
   return (
     <div
@@ -152,5 +152,5 @@ export function OnScreenControls({
         ) : null}
       </div>
     </div>
-  );
+  )
 }

package/src/components/scene-settings.tsx

@@ -1,54 +1,54 @@
-"use client";
+'use client'
 
-import { createPortal } from "react-dom";
-import { useEffect, useState, type ReactNode } from "react";
-import { Box, Camera, Focus, Grid3X3, UserRoundPen } from "lucide-react";
-import { AccountDrawer } from "./account-drawer";
-import { Button } from "#components/ui/button";
+import { createPortal } from 'react-dom'
+import { useEffect, useState, type ReactNode } from 'react'
+import { Box, Camera, Focus, Grid3X3, UserRoundPen } from 'lucide-react'
+import { AccountDrawer } from './account-drawer'
+import { Button } from '#components/ui/button'
 
 export type SceneSettingsProps = {
-  cameraViewMode: "perspective" | "orthographic";
-  onCameraViewModeChange: (value: "perspective" | "orthographic") => void;
-  allowCameraViewModeChange?: boolean;
+  cameraViewMode: 'perspective' | 'orthographic'
+  onCameraViewModeChange: (value: 'perspective' | 'orthographic') => void
+  allowCameraViewModeChange?: boolean
   /** Standalone character selection and customization menu toggle. */
-  characterDesignerEnabled?: boolean;
-  onCharacterDesignerChange?: (value: boolean) => void;
+  characterDesignerEnabled?: boolean
+  onCharacterDesignerChange?: (value: boolean) => void
   /** DOM target for the character designer control in an app shell toolbar. */
-  characterDesignerTargetId?: string;
+  characterDesignerTargetId?: string
   /** Open the scene-specific room layout and interior prop designer. */
-  onOpenRoomDesigner?: () => void;
+  onOpenRoomDesigner?: () => void
   /** DOM target for the account drawer trigger in an app shell toolbar. */
-  accountTargetId?: string;
-  accountLabel?: string;
-  accountAuthenticated?: boolean;
-  accountBusy?: boolean;
-  accountMusicControl?: ReactNode;
-  onAccountSignIn?: () => void;
-  onAccountSignOut?: () => void;
-  showAccountDrawer?: boolean;
+  accountTargetId?: string
+  accountLabel?: string
+  accountAuthenticated?: boolean
+  accountBusy?: boolean
+  accountMusicControl?: ReactNode
+  onAccountSignIn?: () => void
+  onAccountSignOut?: () => void
+  showAccountDrawer?: boolean
   /** DOM target for the compact camera controls in an app shell toolbar. */
-  cameraTargetId?: string;
+  cameraTargetId?: string
   /** DOM target for the room designer control in an app shell toolbar. */
-  roomDesignerTargetId?: string;
+  roomDesignerTargetId?: string
   /** DOM target for the development scene editor control in an app shell toolbar. */
-  sceneEditorTargetId?: string;
+  sceneEditorTargetId?: string
   /** Development-only scene editor toggle, available in perspective view. */
-  sceneEditorEnabled?: boolean;
-  onSceneEditorChange?: (value: boolean) => void;
-};
+  sceneEditorEnabled?: boolean
+  onSceneEditorChange?: (value: boolean) => void
+}
 
 function usePortalTarget(targetId?: string) {
-  const [target, setTarget] = useState<HTMLElement | null>(null);
+  const [target, setTarget] = useState<HTMLElement | null>(null)
 
   useEffect(() => {
-    setTarget(targetId ? document.getElementById(targetId) : null);
-  }, [targetId]);
+    setTarget(targetId ? document.getElementById(targetId) : null)
+  }, [targetId])
 
-  return target;
+  return target
 }
 
 function renderInTarget(content: ReactNode, target: HTMLElement | null) {
-  return target ? createPortal(content, target) : content;
+  return target ? createPortal(content, target) : content
 }
 
 /** Compact scene controls shared by the HQ shell and other scene hosts. */
@@ -74,22 +74,22 @@ export function SceneSettings({
   sceneEditorEnabled,
   onSceneEditorChange,
 }: SceneSettingsProps) {
-  const cameraTarget = usePortalTarget(cameraTargetId);
-  const characterDesignerTarget = usePortalTarget(characterDesignerTargetId);
-  const roomDesignerTarget = usePortalTarget(roomDesignerTargetId);
-  const sceneEditorTarget = usePortalTarget(sceneEditorTargetId);
+  const cameraTarget = usePortalTarget(cameraTargetId)
+  const characterDesignerTarget = usePortalTarget(characterDesignerTargetId)
+  const roomDesignerTarget = usePortalTarget(roomDesignerTargetId)
+  const sceneEditorTarget = usePortalTarget(sceneEditorTargetId)
 
   const cameraControl = (
     <div className="workspace-camera-control" role="group" aria-label="Camera view">
       <Button
         type="button"
         size="sm"
-        variant={cameraViewMode === "perspective" ? "default" : "outline"}
+        variant={cameraViewMode === 'perspective' ? 'default' : 'outline'}
         className="workspace-camera-button"
         aria-label="Perspective camera"
         title="Perspective camera"
-        aria-pressed={cameraViewMode === "perspective"}
-        onClick={() => onCameraViewModeChange("perspective")}
+        aria-pressed={cameraViewMode === 'perspective'}
+        onClick={() => onCameraViewModeChange('perspective')}
       >
         <Camera aria-hidden="true" />
         Perspective
@@ -97,34 +97,34 @@ export function SceneSettings({
       <Button
         type="button"
         size="sm"
-        variant={cameraViewMode === "orthographic" ? "default" : "outline"}
+        variant={cameraViewMode === 'orthographic' ? 'default' : 'outline'}
         className="workspace-camera-button"
         aria-label="Top-down camera"
         title="Top-down camera"
-        aria-pressed={cameraViewMode === "orthographic"}
-        onClick={() => onCameraViewModeChange("orthographic")}
+        aria-pressed={cameraViewMode === 'orthographic'}
+        onClick={() => onCameraViewModeChange('orthographic')}
       >
         <Focus aria-hidden="true" />
         Top-down
       </Button>
     </div>
-  );
+  )
 
   const characterDesignerControl = (
     <Button
       type="button"
-      variant={characterDesignerEnabled ? "default" : "outline"}
+      variant={characterDesignerEnabled ? 'default' : 'outline'}
       size="sm"
       aria-haspopup="dialog"
-      aria-label={characterDesignerEnabled ? "Close character designer" : "Open character designer"}
-      title={characterDesignerEnabled ? "Close character designer" : "Open character designer"}
+      aria-label={characterDesignerEnabled ? 'Close character designer' : 'Open character designer'}
+      title={characterDesignerEnabled ? 'Close character designer' : 'Open character designer'}
       aria-pressed={characterDesignerEnabled}
       onClick={() => onCharacterDesignerChange?.(!characterDesignerEnabled)}
     >
       <UserRoundPen className="size-4" aria-hidden="true" />
       <span className="workspace-character-designer-label">Character</span>
     </Button>
-  );
+  )
 
   const roomDesignerControl = (
     <Button
@@ -139,23 +139,23 @@ export function SceneSettings({
       <Grid3X3 className="size-4" aria-hidden="true" />
       <span className="workspace-room-designer-label">Room designer</span>
     </Button>
-  );
+  )
 
   const sceneEditorControl = (
     <Button
       type="button"
-      variant={sceneEditorEnabled ? "default" : "outline"}
+      variant={sceneEditorEnabled ? 'default' : 'outline'}
       size="sm"
       aria-haspopup="dialog"
-      aria-label={sceneEditorEnabled ? "Close scene editor" : "Open scene editor"}
-      title={sceneEditorEnabled ? "Close scene editor" : "Open scene editor"}
+      aria-label={sceneEditorEnabled ? 'Close scene editor' : 'Open scene editor'}
+      title={sceneEditorEnabled ? 'Close scene editor' : 'Open scene editor'}
       aria-pressed={sceneEditorEnabled}
       onClick={() => onSceneEditorChange?.(!sceneEditorEnabled)}
     >
       <Box className="size-4" aria-hidden="true" />
       <span className="workspace-scene-editor-label">Scene editor</span>
     </Button>
-  );
+  )
 
   return (
     <>
@@ -180,7 +180,7 @@ export function SceneSettings({
           <div className="fixed right-4 top-16 z-40">{characterDesignerControl}</div>
         )
       ) : null}
-      {onOpenRoomDesigner && cameraViewMode === "orthographic" ? (
+      {onOpenRoomDesigner && cameraViewMode === 'orthographic' ? (
         roomDesignerTarget ? (
           createPortal(roomDesignerControl, roomDesignerTarget)
         ) : (
@@ -190,7 +190,7 @@ export function SceneSettings({
       {sceneEditorEnabled != null &&
       !sceneEditorEnabled &&
       onSceneEditorChange &&
-      cameraViewMode === "perspective" ? (
+      cameraViewMode === 'perspective' ? (
         sceneEditorTarget ? (
           createPortal(sceneEditorControl, sceneEditorTarget)
         ) : (
@@ -198,5 +198,5 @@ export function SceneSettings({
         )
       ) : null}
     </>
-  );
+  )
 }

package/src/components/theme-provider.tsx

@@ -1,19 +1,19 @@
-"use client";
+'use client'
 
-import { ThemeProvider as NextThemesProvider } from "next-themes";
-import type { ComponentProps, ReactElement, ReactNode } from "react";
+import { ThemeProvider as NextThemesProvider } from 'next-themes'
+import type { ComponentProps, ReactElement, ReactNode } from 'react'
 
 // Bun 1.4 can resolve next-themes against a separate React type instance. The
 // runtime component is compatible, but TypeScript then drops `children` from
 // its JSX props. Keep the shared provider's public contract stable by
 // normalizing the third-party component's props at this boundary.
 type CompatibleNextThemesProviderProps = ComponentProps<typeof NextThemesProvider> & {
-  children?: ReactNode;
-};
+  children?: ReactNode
+}
 
 const CompatibleNextThemesProvider = NextThemesProvider as unknown as (
   props: CompatibleNextThemesProviderProps
-) => ReactElement;
+) => ReactElement
 
 /** Shared theme provider used by each Next app in the workspace. */
 export function ThemeProvider({ children }: { children: ReactNode }) {
@@ -26,5 +26,5 @@ export function ThemeProvider({ children }: { children: ReactNode }) {
     >
       {children}
     </CompatibleNextThemesProvider>
-  );
+  )
 }