@gallop.software/studio 0.1.21 → 0.1.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (21) hide show
  1. package/dist/{StudioUI-QMBOCTJD.js → StudioUI-2BWLIO4W.js} +654 -779
  2. package/dist/StudioUI-2BWLIO4W.js.map +1 -0
  3. package/dist/{StudioUI-WRFD73YR.mjs → StudioUI-QPAHJJ64.mjs} +746 -871
  4. package/dist/StudioUI-QPAHJJ64.mjs.map +1 -0
  5. package/dist/chunk-AY2DAS6W.js +64 -0
  6. package/dist/chunk-AY2DAS6W.js.map +1 -0
  7. package/dist/chunk-R5WKNVEV.mjs +64 -0
  8. package/dist/chunk-R5WKNVEV.mjs.map +1 -0
  9. package/dist/handlers.d.mts +4 -0
  10. package/dist/handlers.d.ts +4 -0
  11. package/dist/handlers.js +13 -4
  12. package/dist/handlers.js.map +1 -1
  13. package/dist/handlers.mjs +13 -4
  14. package/dist/handlers.mjs.map +1 -1
  15. package/dist/index.js +20 -23
  16. package/dist/index.js.map +1 -1
  17. package/dist/index.mjs +11 -14
  18. package/dist/index.mjs.map +1 -1
  19. package/package.json +1 -1
  20. package/dist/StudioUI-QMBOCTJD.js.map +0 -1
  21. package/dist/StudioUI-WRFD73YR.mjs.map +0 -1
package/dist/StudioUI-QPAHJJ64.mjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/StudioUI.tsx","../src/components/StudioContext.tsx","../src/components/StudioToolbar.tsx","../src/components/StudioModal.tsx","../src/components/StudioFileGrid.tsx","../src/components/StudioFileList.tsx","../src/components/StudioDetailView.tsx","../src/components/StudioSettings.tsx"],"sourcesContent":["/** @jsxImportSource @emotion/react */\n'use client'\n\nimport { useEffect, useCallback, useState } from 'react'\nimport { css } from '@emotion/react'\nimport { StudioContext } from './StudioContext'\nimport { StudioToolbar } from './StudioToolbar'\nimport { StudioFileGrid } from './StudioFileGrid'\nimport { StudioFileList } from './StudioFileList'\nimport { StudioDetailView } from './StudioDetailView'\nimport { StudioSettings } from './StudioSettings'\nimport { colors, fontSize, baseReset } from './tokens'\nimport type { FileItem, StudioMeta } from '../types'\n\ninterface StudioUIProps {\n onClose: () => void\n}\n\n// Standard button height for consistency\nconst btnHeight = '36px'\n\nconst styles = {\n container: css`\n ${baseReset}\n display: flex;\n flex-direction: column;\n height: 100%;\n background: ${colors.background};\n `,\n header: css`\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 12px 24px;\n background: ${colors.surface};\n border-bottom: 1px solid ${colors.border};\n `,\n title: css`\n font-size: ${fontSize.lg};\n font-weight: 600;\n color: ${colors.text};\n margin: 0;\n letter-spacing: -0.02em;\n `,\n headerActions: css`\n display: flex;\n align-items: center;\n gap: 8px;\n `,\n headerBtn: css`\n height: ${btnHeight};\n padding: 0 12px;\n background: ${colors.surface};\n border: 1px solid ${colors.border};\n border-radius: 6px;\n cursor: pointer;\n transition: all 0.15s ease;\n display: flex;\n align-items: center;\n justify-content: center;\n \n &:hover {\n background-color: ${colors.surfaceHover};\n border-color: ${colors.borderHover};\n }\n `,\n headerIcon: css`\n width: 16px;\n height: 16px;\n color: ${colors.textSecondary};\n `,\n content: css`\n flex: 1;\n display: flex;\n overflow: hidden;\n `,\n fileBrowser: css`\n flex: 1;\n min-width: 0;\n overflow: auto;\n padding: 20px 24px;\n `,\n}\n\n/**\n * Main Studio UI - contains all panels and manages internal state\n * Rendered inside the modal via lazy loading\n */\nexport function StudioUI({ onClose }: StudioUIProps) {\n const [currentPath, setCurrentPathInternal] = useState('public')\n const [selectedItems, setSelectedItems] = useState<Set<string>>(new Set())\n const [lastSelectedPath, setLastSelectedPath] = useState<string | null>(null)\n const [viewMode, setViewMode] = useState<'grid' | 'list'>('grid')\n const [focusedItem, setFocusedItem] = useState<FileItem | null>(null)\n const [meta, setMeta] = useState<StudioMeta | null>(null)\n const [isLoading, setIsLoading] = useState(false)\n const [refreshKey, setRefreshKey] = useState(0)\n\n const triggerRefresh = useCallback(() => {\n setRefreshKey((k) => k + 1)\n }, [])\n\n const navigateUp = useCallback(() => {\n if (currentPath === 'public') return\n const parts = currentPath.split('/')\n parts.pop()\n setCurrentPathInternal(parts.join('/') || 'public')\n setSelectedItems(new Set())\n }, [currentPath])\n\n const setCurrentPath = useCallback((path: string) => {\n setCurrentPathInternal(path)\n setSelectedItems(new Set())\n setFocusedItem(null)\n }, [])\n\n const toggleSelection = useCallback((path: string) => {\n setSelectedItems((prev) => {\n const next = new Set(prev)\n if (next.has(path)) {\n next.delete(path)\n } else {\n next.add(path)\n }\n return next\n })\n setLastSelectedPath(path)\n }, [])\n\n const selectRange = useCallback((fromPath: string, toPath: string, allItems: FileItem[]) => {\n const fromIndex = allItems.findIndex(item => item.path === fromPath)\n const toIndex = allItems.findIndex(item => item.path === toPath)\n \n if (fromIndex === -1 || toIndex === -1) return\n \n const start = Math.min(fromIndex, toIndex)\n const end = Math.max(fromIndex, toIndex)\n \n setSelectedItems((prev) => {\n const next = new Set(prev)\n for (let i = start; i <= end; i++) {\n next.add(allItems[i].path)\n }\n return next\n })\n setLastSelectedPath(toPath)\n }, [])\n\n const selectAll = useCallback((items: FileItem[]) => {\n setSelectedItems(new Set(items.map((item) => item.path)))\n }, [])\n\n const clearSelection = useCallback(() => {\n setSelectedItems(new Set())\n }, [])\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n if (focusedItem) {\n setFocusedItem(null)\n } else {\n onClose()\n }\n }\n },\n [onClose, focusedItem]\n )\n\n useEffect(() => {\n document.addEventListener('keydown', handleKeyDown)\n document.body.style.overflow = 'hidden'\n return () => {\n document.removeEventListener('keydown', handleKeyDown)\n document.body.style.overflow = ''\n }\n }, [handleKeyDown])\n\n const contextValue = {\n isOpen: true,\n openStudio: () => {},\n closeStudio: onClose,\n toggleStudio: onClose,\n currentPath,\n setCurrentPath,\n navigateUp,\n selectedItems,\n toggleSelection,\n selectRange,\n selectAll,\n clearSelection,\n lastSelectedPath,\n viewMode,\n setViewMode,\n focusedItem,\n setFocusedItem,\n meta,\n setMeta,\n isLoading,\n setIsLoading,\n refreshKey,\n triggerRefresh,\n }\n\n return (\n <StudioContext.Provider value={contextValue}>\n <div css={styles.container}>\n <div css={styles.header}>\n <h1 css={styles.title}>Studio</h1>\n <div css={styles.headerActions}>\n <StudioSettings />\n <button\n css={styles.headerBtn}\n onClick={onClose}\n aria-label=\"Close Studio\"\n >\n <CloseIcon />\n </button>\n </div>\n </div>\n\n <StudioToolbar />\n\n <div css={styles.content}>\n {focusedItem ? (\n <StudioDetailView />\n ) : (\n <div css={styles.fileBrowser}>\n {viewMode === 'grid' ? <StudioFileGrid /> : <StudioFileList />}\n </div>\n )}\n </div>\n </div>\n </StudioContext.Provider>\n )\n}\n\nfunction CloseIcon() {\n return (\n <svg\n css={styles.headerIcon}\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth={2}\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n </svg>\n )\n}\n\nexport default StudioUI\n","'use client'\n\nimport { createContext, useContext } from 'react'\nimport type { FileItem, StudioMeta } from '../types'\n\n/**\n * Studio state interface\n * State is managed by StudioUI and provided to all child components\n */\nexport interface StudioState {\n isOpen: boolean\n openStudio: () => void\n closeStudio: () => void\n toggleStudio: () => void\n\n // Navigation\n currentPath: string\n setCurrentPath: (path: string) => void\n navigateUp: () => void\n\n // Selection\n selectedItems: Set<string>\n toggleSelection: (path: string) => void\n selectRange: (fromPath: string, toPath: string, allItems: FileItem[]) => void\n selectAll: (items: FileItem[]) => void\n clearSelection: () => void\n lastSelectedPath: string | null\n\n // View\n viewMode: 'grid' | 'list'\n setViewMode: (mode: 'grid' | 'list') => void\n\n // Focused item (for detail view)\n focusedItem: FileItem | null\n setFocusedItem: (item: FileItem | null) => void\n\n // Meta\n meta: StudioMeta | null\n setMeta: (meta: StudioMeta) => void\n\n // Loading\n isLoading: boolean\n setIsLoading: (loading: boolean) => void\n\n // Refresh trigger\n refreshKey: number\n triggerRefresh: () => void\n}\n\nconst defaultState: StudioState = {\n isOpen: false,\n openStudio: () => {},\n closeStudio: () => {},\n toggleStudio: () => {},\n currentPath: 'public',\n setCurrentPath: () => {},\n navigateUp: () => {},\n selectedItems: new Set(),\n toggleSelection: () => {},\n selectRange: () => {},\n selectAll: () => {},\n clearSelection: () => {},\n lastSelectedPath: null,\n viewMode: 'grid',\n setViewMode: () => {},\n focusedItem: null,\n setFocusedItem: () => {},\n meta: null,\n setMeta: () => {},\n isLoading: false,\n setIsLoading: () => {},\n refreshKey: 0,\n triggerRefresh: () => {},\n}\n\nexport const StudioContext = createContext<StudioState>(defaultState)\n\n/**\n * Hook to access Studio state from child components\n */\nexport function useStudio() {\n return useContext(StudioContext)\n}\n","/** @jsxImportSource @emotion/react */\n'use client'\n\nimport { useCallback, useRef, useState } from 'react'\nimport { css, keyframes } from '@emotion/react'\nimport { useStudio } from './StudioContext'\nimport { ConfirmModal, AlertModal } from './StudioModal'\nimport { colors, fontSize } from './tokens'\n\n// Standard button height for consistency\nconst btnHeight = '36px'\n\nconst spin = keyframes`\n to { transform: rotate(360deg); }\n`\n\nconst styles = {\n toolbar: css`\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 12px 24px;\n background-color: ${colors.surface};\n border-bottom: 1px solid ${colors.border};\n `,\n left: css`\n display: flex;\n align-items: center;\n gap: 8px;\n `,\n right: css`\n display: flex;\n align-items: center;\n gap: 8px;\n `,\n btn: css`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n height: ${btnHeight};\n padding: 0 14px;\n border-radius: 6px;\n font-size: ${fontSize.base};\n font-weight: 500;\n background: ${colors.surface};\n border: 1px solid ${colors.border};\n cursor: pointer;\n transition: all 0.15s ease;\n color: ${colors.text};\n letter-spacing: -0.01em;\n \n &:hover:not(:disabled) {\n background-color: ${colors.surfaceHover};\n border-color: ${colors.borderHover};\n }\n \n &:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n }\n `,\n btnIconOnly: css`\n padding: 0 10px;\n `,\n btnPrimary: css`\n background: ${colors.primary};\n border-color: ${colors.primary};\n color: white;\n \n &:hover:not(:disabled) {\n background: ${colors.primaryHover};\n border-color: ${colors.primaryHover};\n }\n `,\n btnDanger: css`\n color: ${colors.danger};\n \n &:hover:not(:disabled) {\n background-color: ${colors.dangerLight};\n border-color: ${colors.danger};\n }\n `,\n icon: css`\n width: 16px;\n height: 16px;\n `,\n iconSpin: css`\n animation: ${spin} 1s linear infinite;\n `,\n selectionCount: css`\n font-size: ${fontSize.base};\n color: ${colors.textSecondary};\n display: flex;\n align-items: center;\n gap: 8px;\n margin-right: 8px;\n `,\n clearBtn: css`\n color: ${colors.primary};\n background: none;\n border: none;\n cursor: pointer;\n font-size: ${fontSize.base};\n font-weight: 500;\n padding: 0;\n \n &:hover {\n text-decoration: underline;\n }\n `,\n divider: css`\n width: 1px;\n height: 24px;\n background: ${colors.border};\n margin: 0 4px;\n `,\n viewToggle: css`\n display: flex;\n align-items: center;\n height: ${btnHeight};\n background-color: ${colors.surface};\n border: 1px solid ${colors.border};\n border-radius: 6px;\n overflow: hidden;\n `,\n viewBtn: css`\n height: 100%;\n padding: 0 10px;\n background: transparent;\n border: none;\n cursor: pointer;\n color: ${colors.textSecondary};\n transition: all 0.15s ease;\n display: flex;\n align-items: center;\n justify-content: center;\n \n &:hover {\n color: ${colors.text};\n background-color: ${colors.surfaceHover};\n }\n `,\n viewBtnActive: css`\n background-color: ${colors.background};\n color: ${colors.text};\n `,\n}\n\nexport function StudioToolbar() {\n const { selectedItems, viewMode, setViewMode, clearSelection, currentPath, triggerRefresh, focusedItem } = useStudio()\n const fileInputRef = useRef<HTMLInputElement>(null)\n const [uploading, setUploading] = useState(false)\n const [refreshing, setRefreshing] = useState(false)\n const [showDeleteConfirm, setShowDeleteConfirm] = useState(false)\n const [alertMessage, setAlertMessage] = useState<{ title: string; message: string } | null>(null)\n\n // Check if we're in the images folder (uploads not allowed there)\n const isInImagesFolder = currentPath === 'public/images' || currentPath.startsWith('public/images/')\n\n const handleUpload = useCallback(() => {\n fileInputRef.current?.click()\n }, [])\n\n const handleRefresh = useCallback(() => {\n setRefreshing(true)\n triggerRefresh()\n setTimeout(() => setRefreshing(false), 600)\n }, [triggerRefresh])\n\n const handleFileChange = useCallback(async (e: React.ChangeEvent<HTMLInputElement>) => {\n const files = e.target.files\n if (!files || files.length === 0) return\n\n setUploading(true)\n try {\n for (const file of Array.from(files)) {\n const formData = new FormData()\n formData.append('file', file)\n formData.append('path', currentPath)\n\n const response = await fetch('/api/studio/upload', {\n method: 'POST',\n body: formData,\n })\n\n if (!response.ok) {\n const error = await response.json()\n if (response.status >= 500) {\n console.error('Upload error:', error)\n setAlertMessage({\n title: 'Upload Failed',\n message: `Failed to upload ${file.name}: ${error.error || 'Unknown error'}`,\n })\n } else {\n setAlertMessage({\n title: 'Cannot Upload Here',\n message: error.error || 'Upload not allowed in this location.',\n })\n }\n }\n }\n triggerRefresh()\n } catch (error) {\n console.error('Upload error:', error)\n setAlertMessage({\n title: 'Upload Failed',\n message: 'Upload failed. Check console for details.',\n })\n } finally {\n setUploading(false)\n if (fileInputRef.current) {\n fileInputRef.current.value = ''\n }\n }\n }, [currentPath, triggerRefresh])\n\n const handleReprocess = useCallback(() => {\n console.log('Reprocess clicked', selectedItems)\n }, [selectedItems])\n\n const handleDeleteClick = useCallback(() => {\n if (selectedItems.size === 0) return\n setShowDeleteConfirm(true)\n }, [selectedItems])\n\n const handleDeleteConfirm = useCallback(async () => {\n setShowDeleteConfirm(false)\n \n try {\n const response = await fetch('/api/studio/delete', {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify({ paths: Array.from(selectedItems) }),\n })\n\n if (response.ok) {\n clearSelection()\n triggerRefresh()\n } else {\n const error = await response.json()\n setAlertMessage({\n title: 'Delete Failed',\n message: error.error || 'Unknown error',\n })\n }\n } catch (error) {\n console.error('Delete error:', error)\n setAlertMessage({\n title: 'Delete Failed',\n message: 'Delete failed. Check console for details.',\n })\n }\n }, [selectedItems, clearSelection, triggerRefresh])\n\n const handleSyncCdn = useCallback(() => {\n console.log('Sync CDN clicked', selectedItems)\n }, [selectedItems])\n\n const handleScan = useCallback(() => {\n console.log('Scan clicked')\n }, [])\n\n const hasSelection = selectedItems.size > 0\n\n // Hide toolbar actions when viewing detail\n if (focusedItem) {\n return null\n }\n\n return (\n <>\n {showDeleteConfirm && (\n <ConfirmModal\n title=\"Delete Items\"\n message={`Are you sure you want to delete ${selectedItems.size} item(s)? This action cannot be undone.`}\n confirmLabel=\"Delete\"\n variant=\"danger\"\n onConfirm={handleDeleteConfirm}\n onCancel={() => setShowDeleteConfirm(false)}\n />\n )}\n\n {alertMessage && (\n <AlertModal\n title={alertMessage.title}\n message={alertMessage.message}\n onClose={() => setAlertMessage(null)}\n />\n )}\n\n <div css={styles.toolbar}>\n <input\n ref={fileInputRef}\n type=\"file\"\n multiple\n accept=\"image/*,video/*,audio/*,.pdf\"\n onChange={handleFileChange}\n style={{ display: 'none' }}\n />\n \n <div css={styles.left}>\n <button\n css={[styles.btn, styles.btnPrimary]}\n onClick={handleUpload}\n disabled={uploading || isInImagesFolder}\n >\n <UploadIcon />\n {uploading ? 'Uploading...' : 'Upload'}\n </button>\n \n <div css={styles.divider} />\n \n <button\n css={styles.btn}\n onClick={handleReprocess}\n disabled={!hasSelection}\n >\n <RefreshIcon />\n Reprocess\n </button>\n <button\n css={[styles.btn, styles.btnDanger]}\n onClick={handleDeleteClick}\n disabled={!hasSelection}\n >\n <TrashIcon />\n Delete\n </button>\n <button\n css={styles.btn}\n onClick={handleSyncCdn}\n disabled={!hasSelection}\n >\n <CloudIcon />\n Sync CDN\n </button>\n <button css={styles.btn} onClick={handleScan}>\n <ScanIcon />\n Scan\n </button>\n </div>\n\n <div css={styles.right}>\n {hasSelection && (\n <span css={styles.selectionCount}>\n {selectedItems.size} selected\n <button css={styles.clearBtn} onClick={clearSelection}>\n Clear\n </button>\n </span>\n )}\n\n <button\n css={[styles.btn, styles.btnIconOnly]}\n onClick={handleRefresh}\n >\n <RefreshIcon spinning={refreshing} />\n </button>\n\n <div css={styles.viewToggle}>\n <button\n css={[styles.viewBtn, viewMode === 'grid' && styles.viewBtnActive]}\n onClick={() => setViewMode('grid')}\n aria-label=\"Grid view\"\n >\n <GridIcon />\n </button>\n <button\n css={[styles.viewBtn, viewMode === 'list' && styles.viewBtnActive]}\n onClick={() => setViewMode('list')}\n aria-label=\"List view\"\n >\n <ListIcon />\n </button>\n </div>\n </div>\n </div>\n </>\n )\n}\n\nfunction UploadIcon() {\n return (\n <svg css={styles.icon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-8l-4-4m0 0L8 8m4-4v12\" />\n </svg>\n )\n}\n\nfunction RefreshIcon({ spinning }: { spinning?: boolean }) {\n return (\n <svg css={[styles.icon, spinning && styles.iconSpin]} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15\" />\n </svg>\n )\n}\n\nfunction TrashIcon() {\n return (\n <svg css={styles.icon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16\" />\n </svg>\n )\n}\n\nfunction CloudIcon() {\n return (\n <svg css={styles.icon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12\" />\n </svg>\n )\n}\n\nfunction ScanIcon() {\n return (\n <svg css={styles.icon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z\" />\n </svg>\n )\n}\n\nfunction GridIcon() {\n return (\n <svg css={styles.icon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M4 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2V6zM14 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V6zM4 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2v-2zM14 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z\" />\n </svg>\n )\n}\n\nfunction ListIcon() {\n return (\n <svg css={styles.icon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M4 6h16M4 10h16M4 14h16M4 18h16\" />\n </svg>\n )\n}\n","/** @jsxImportSource @emotion/react */\n'use client'\n\nimport { css, keyframes } from '@emotion/react'\nimport { colors, fontSize, fontStack, baseReset } from './tokens'\n\nconst fadeIn = keyframes`\n from { opacity: 0; }\n to { opacity: 1; }\n`\n\nconst slideIn = keyframes`\n from { \n opacity: 0;\n transform: translateY(-8px) scale(0.98);\n }\n to { \n opacity: 1;\n transform: translateY(0) scale(1);\n }\n`\n\nconst styles = {\n overlay: css`\n position: fixed;\n inset: 0;\n background-color: rgba(26, 31, 54, 0.4);\n backdrop-filter: blur(4px);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 10000;\n animation: ${fadeIn} 0.15s ease-out;\n font-family: ${fontStack};\n `,\n modal: css`\n ${baseReset}\n background-color: ${colors.surface};\n border-radius: 12px;\n box-shadow: 0 30px 60px -12px rgba(50, 50, 93, 0.25), 0 18px 36px -18px rgba(0, 0, 0, 0.3);\n max-width: 420px;\n width: 90%;\n animation: ${slideIn} 0.2s ease-out;\n overflow: hidden;\n `,\n header: css`\n padding: 24px 24px 0;\n `,\n title: css`\n font-size: ${fontSize.lg};\n font-weight: 600;\n color: ${colors.text};\n margin: 0;\n letter-spacing: -0.02em;\n `,\n body: css`\n padding: 12px 24px 24px;\n `,\n message: css`\n font-size: ${fontSize.base};\n color: ${colors.textSecondary};\n margin: 0;\n line-height: 1.6;\n `,\n footer: css`\n display: flex;\n justify-content: flex-end;\n gap: 12px;\n padding: 16px 24px;\n border-top: 1px solid ${colors.border};\n background-color: ${colors.background};\n `,\n btn: css`\n padding: 10px 18px;\n font-size: ${fontSize.base};\n font-weight: 500;\n border-radius: 6px;\n cursor: pointer;\n transition: all 0.15s ease;\n letter-spacing: -0.01em;\n `,\n btnCancel: css`\n background-color: ${colors.surface};\n border: 1px solid ${colors.border};\n color: ${colors.text};\n \n &:hover {\n background-color: ${colors.surfaceHover};\n border-color: ${colors.borderHover};\n }\n `,\n btnConfirm: css`\n background-color: ${colors.primary};\n border: 1px solid ${colors.primary};\n color: white;\n \n &:hover {\n background-color: ${colors.primaryHover};\n border-color: ${colors.primaryHover};\n }\n `,\n btnDanger: css`\n background-color: ${colors.danger};\n border: 1px solid ${colors.danger};\n color: white;\n \n &:hover {\n background-color: ${colors.dangerHover};\n border-color: ${colors.dangerHover};\n }\n `,\n}\n\ninterface ConfirmModalProps {\n title: string\n message: string\n confirmLabel?: string\n cancelLabel?: string\n variant?: 'default' | 'danger'\n onConfirm: () => void\n onCancel: () => void\n}\n\nexport function ConfirmModal({\n title,\n message,\n confirmLabel = 'Confirm',\n cancelLabel = 'Cancel',\n variant = 'default',\n onConfirm,\n onCancel,\n}: ConfirmModalProps) {\n return (\n <div css={styles.overlay} onClick={onCancel}>\n <div css={styles.modal} onClick={(e) => e.stopPropagation()}>\n <div css={styles.header}>\n <h3 css={styles.title}>{title}</h3>\n </div>\n <div css={styles.body}>\n <p css={styles.message}>{message}</p>\n </div>\n <div css={styles.footer}>\n <button css={[styles.btn, styles.btnCancel]} onClick={onCancel}>\n {cancelLabel}\n </button>\n <button\n css={[styles.btn, variant === 'danger' ? styles.btnDanger : styles.btnConfirm]}\n onClick={onConfirm}\n >\n {confirmLabel}\n </button>\n </div>\n </div>\n </div>\n )\n}\n\ninterface AlertModalProps {\n title: string\n message: string\n buttonLabel?: string\n onClose: () => void\n}\n\nexport function AlertModal({\n title,\n message,\n buttonLabel = 'OK',\n onClose,\n}: AlertModalProps) {\n return (\n <div css={styles.overlay} onClick={onClose}>\n <div css={styles.modal} onClick={(e) => e.stopPropagation()}>\n <div css={styles.header}>\n <h3 css={styles.title}>{title}</h3>\n </div>\n <div css={styles.body}>\n <p css={styles.message}>{message}</p>\n </div>\n <div css={styles.footer}>\n <button css={[styles.btn, styles.btnConfirm]} onClick={onClose}>\n {buttonLabel}\n </button>\n </div>\n </div>\n </div>\n )\n}\n","/** @jsxImportSource @emotion/react */\n'use client'\n\nimport { useEffect, useState } from 'react'\nimport { css, keyframes } from '@emotion/react'\nimport { useStudio } from './StudioContext'\nimport { colors, fontSize } from './tokens'\nimport type { FileItem } from '../types'\n\nconst spin = keyframes`\n to { transform: rotate(360deg); }\n`\n\nconst styles = {\n loading: css`\n display: flex;\n align-items: center;\n justify-content: center;\n height: 256px;\n `,\n spinner: css`\n width: 32px;\n height: 32px;\n border-radius: 50%;\n border: 3px solid ${colors.border};\n border-top-color: ${colors.primary};\n animation: ${spin} 0.8s linear infinite;\n `,\n empty: css`\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 256px;\n color: ${colors.textSecondary};\n `,\n emptyIcon: css`\n width: 48px;\n height: 48px;\n margin-bottom: 16px;\n opacity: 0.5;\n `,\n emptyText: css`\n font-size: ${fontSize.base};\n margin: 0 0 4px 0;\n \n &:last-child {\n color: ${colors.textMuted};\n font-size: ${fontSize.sm};\n }\n `,\n grid: css`\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 12px;\n \n @media (min-width: 640px) { grid-template-columns: repeat(3, 1fr); }\n @media (min-width: 768px) { grid-template-columns: repeat(4, 1fr); }\n @media (min-width: 1024px) { grid-template-columns: repeat(5, 1fr); }\n @media (min-width: 1280px) { grid-template-columns: repeat(6, 1fr); }\n `,\n item: css`\n position: relative;\n border-radius: 8px;\n border: 1px solid ${colors.border};\n overflow: hidden;\n cursor: pointer;\n transition: all 0.15s ease;\n background-color: ${colors.surface};\n user-select: none;\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);\n \n &:hover {\n border-color: #d0d5dd;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);\n }\n `,\n itemSelected: css`\n border-color: ${colors.primary};\n box-shadow: 0 0 0 1px ${colors.primary};\n \n &:hover {\n border-color: ${colors.primary};\n }\n `,\n parentItem: css`\n cursor: pointer;\n \n &:hover {\n border-color: ${colors.primary};\n }\n `,\n checkboxWrapper: css`\n position: absolute;\n top: 0;\n left: 0;\n z-index: 10;\n padding: 8px;\n cursor: pointer;\n `,\n checkbox: css`\n width: 16px;\n height: 16px;\n accent-color: ${colors.primary};\n cursor: pointer;\n `,\n cdnBadge: css`\n position: absolute;\n top: 8px;\n right: 8px;\n z-index: 10;\n background-color: ${colors.successLight};\n color: ${colors.success};\n font-size: 11px;\n font-weight: 500;\n padding: 2px 8px;\n border-radius: 4px;\n `,\n content: css`\n aspect-ratio: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 16px;\n background: ${colors.background};\n `,\n folderIcon: css`\n width: 56px;\n height: 56px;\n color: #f5a623;\n `,\n parentIcon: css`\n width: 56px;\n height: 56px;\n color: ${colors.textMuted};\n `,\n fileIcon: css`\n width: 40px;\n height: 40px;\n color: ${colors.textMuted};\n `,\n image: css`\n max-width: 100%;\n max-height: 100%;\n object-fit: contain;\n border-radius: 4px;\n `,\n label: css`\n padding: 10px 12px;\n background-color: ${colors.surface};\n border-top: 1px solid ${colors.borderLight};\n `,\n labelRow: css`\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n `,\n labelText: css`\n flex: 1;\n min-width: 0;\n `,\n name: css`\n font-size: ${fontSize.sm};\n font-weight: 500;\n color: ${colors.text};\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin: 0;\n letter-spacing: -0.01em;\n `,\n size: css`\n font-size: ${fontSize.xs};\n color: ${colors.textMuted};\n margin: 2px 0 0 0;\n `,\n openBtn: css`\n flex-shrink: 0;\n height: 28px;\n font-size: ${fontSize.xs};\n font-weight: 500;\n color: ${colors.primary};\n background: ${colors.surface};\n border: 1px solid ${colors.border};\n padding: 0 10px;\n cursor: pointer;\n border-radius: 4px;\n transition: all 0.15s ease;\n display: inline-flex;\n align-items: center;\n \n &:hover {\n background-color: ${colors.primaryLight};\n border-color: ${colors.primary};\n }\n `,\n selectAllRow: css`\n display: flex;\n align-items: center;\n margin-bottom: 16px;\n padding: 12px 16px;\n background: ${colors.surface};\n border-radius: 8px;\n border: 1px solid ${colors.border};\n `,\n selectAllLabel: css`\n display: flex;\n align-items: center;\n gap: 10px;\n font-size: ${fontSize.base};\n font-weight: 500;\n color: ${colors.textSecondary};\n cursor: pointer;\n \n &:hover {\n color: ${colors.text};\n }\n `,\n selectAllCheckbox: css`\n width: 16px;\n height: 16px;\n accent-color: ${colors.primary};\n `,\n}\n\nexport function StudioFileGrid() {\n const { currentPath, setCurrentPath, navigateUp, selectedItems, toggleSelection, selectRange, lastSelectedPath, selectAll, clearSelection, refreshKey, setFocusedItem } = useStudio()\n const [items, setItems] = useState<FileItem[]>([])\n const [loading, setLoading] = useState(true)\n\n useEffect(() => {\n async function loadItems() {\n setLoading(true)\n try {\n const response = await fetch(`/api/studio/list?path=${encodeURIComponent(currentPath)}`)\n if (response.ok) {\n const data = await response.json()\n setItems(data.items || [])\n }\n } catch (error) {\n console.error('Failed to load items:', error)\n }\n setLoading(false)\n }\n loadItems()\n }, [currentPath, refreshKey])\n\n if (loading) {\n return (\n <div css={styles.loading}>\n <div css={styles.spinner} />\n </div>\n )\n }\n\n const isAtRoot = currentPath === 'public'\n\n // Empty state only when truly empty (not counting parent folder)\n if (items.length === 0 && isAtRoot) {\n return (\n <div css={styles.empty}>\n <svg css={styles.emptyIcon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={1.5} d=\"M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z\" />\n </svg>\n <p css={styles.emptyText}>No files in this folder</p>\n <p css={styles.emptyText}>Upload images to get started</p>\n </div>\n )\n }\n\n const sortedItems = [...items].sort((a, b) => {\n if (a.type === 'folder' && b.type !== 'folder') return -1\n if (a.type !== 'folder' && b.type === 'folder') return 1\n return a.name.localeCompare(b.name)\n })\n\n const handleItemClick = (item: FileItem, e: React.MouseEvent) => {\n if (e.shiftKey && lastSelectedPath) {\n selectRange(lastSelectedPath, item.path, sortedItems)\n } else {\n toggleSelection(item.path)\n }\n }\n\n const handleOpen = (item: FileItem) => {\n if (item.type === 'folder') {\n setCurrentPath(item.path)\n } else {\n setFocusedItem(item)\n }\n }\n\n const allItemsSelected = sortedItems.length > 0 && sortedItems.every(item => selectedItems.has(item.path))\n const someItemsSelected = sortedItems.some(item => selectedItems.has(item.path))\n\n const handleSelectAll = () => {\n if (allItemsSelected) {\n clearSelection()\n } else {\n selectAll(sortedItems)\n }\n }\n\n return (\n <div>\n {sortedItems.length > 0 && (\n <div css={styles.selectAllRow}>\n <label css={styles.selectAllLabel}>\n <input\n type=\"checkbox\"\n css={styles.selectAllCheckbox}\n checked={allItemsSelected}\n ref={(el) => {\n if (el) el.indeterminate = someItemsSelected && !allItemsSelected\n }}\n onChange={handleSelectAll}\n />\n Select all ({sortedItems.length})\n </label>\n </div>\n )}\n <div css={styles.grid}>\n {/* Parent folder navigation */}\n {!isAtRoot && (\n <div \n css={[styles.item, styles.parentItem]}\n onClick={navigateUp}\n >\n <div css={styles.content}>\n <svg css={styles.parentIcon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={1.5} d=\"M3 10h10a8 8 0 018 8v2M3 10l6 6m-6-6l6-6\" />\n </svg>\n </div>\n <div css={styles.label}>\n <p css={styles.name}>..</p>\n <p css={styles.size}>Parent folder</p>\n </div>\n </div>\n )}\n \n {sortedItems.map((item) => (\n <GridItem\n key={item.path}\n item={item}\n isSelected={selectedItems.has(item.path)}\n onClick={(e) => handleItemClick(item, e)}\n onOpen={() => handleOpen(item)}\n />\n ))}\n </div>\n </div>\n )\n}\n\ninterface GridItemProps {\n item: FileItem\n isSelected: boolean\n onClick: (e: React.MouseEvent) => void\n onOpen: () => void\n}\n\nfunction GridItem({ item, isSelected, onClick, onOpen }: GridItemProps) {\n const isFolder = item.type === 'folder'\n\n return (\n <div \n css={[styles.item, isSelected && styles.itemSelected]} \n onClick={onClick}\n >\n <div\n css={styles.checkboxWrapper}\n onClick={(e) => e.stopPropagation()}\n >\n <input\n type=\"checkbox\"\n css={styles.checkbox}\n checked={isSelected}\n onChange={() => onClick({} as React.MouseEvent)}\n />\n </div>\n\n {item.cdnSynced && <span css={styles.cdnBadge}>CDN</span>}\n\n <div css={styles.content}>\n {isFolder ? (\n <svg css={styles.folderIcon} fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M10 4H4a2 2 0 00-2 2v12a2 2 0 002 2h16a2 2 0 002-2V8a2 2 0 00-2-2h-8l-2-2z\" />\n </svg>\n ) : item.thumbnail ? (\n <img\n css={styles.image}\n src={item.thumbnail}\n alt={item.name}\n loading=\"lazy\"\n />\n ) : (\n <svg css={styles.fileIcon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={1.5} d=\"M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z\" />\n </svg>\n )}\n </div>\n\n <div css={styles.label}>\n <div css={styles.labelRow}>\n <div css={styles.labelText}>\n <p css={styles.name} title={item.name}>{item.name}</p>\n {isFolder ? (\n <p css={styles.size}>\n {item.fileCount !== undefined ? `${item.fileCount} files` : ''}\n {item.fileCount !== undefined && item.totalSize !== undefined ? ' · ' : ''}\n {item.totalSize !== undefined ? formatFileSize(item.totalSize) : ''}\n </p>\n ) : (\n item.size !== undefined && <p css={styles.size}>{formatFileSize(item.size)}</p>\n )}\n </div>\n <button\n css={styles.openBtn}\n onClick={(e) => {\n e.stopPropagation()\n onOpen()\n }}\n >\n Open\n </button>\n </div>\n </div>\n </div>\n )\n}\n\nfunction formatFileSize(bytes: number): string {\n if (bytes < 1024) return `${bytes} B`\n if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`\n return `${(bytes / (1024 * 1024)).toFixed(1)} MB`\n}\n","/** @jsxImportSource @emotion/react */\n'use client'\n\nimport { useEffect, useState } from 'react'\nimport { css, keyframes } from '@emotion/react'\nimport { useStudio } from './StudioContext'\nimport { colors, fontSize } from './tokens'\nimport type { FileItem } from '../types'\n\nconst spin = keyframes`\n to { transform: rotate(360deg); }\n`\n\nconst styles = {\n loading: css`\n display: flex;\n align-items: center;\n justify-content: center;\n height: 256px;\n `,\n spinner: css`\n width: 32px;\n height: 32px;\n border-radius: 50%;\n border: 3px solid ${colors.border};\n border-top-color: ${colors.primary};\n animation: ${spin} 0.8s linear infinite;\n `,\n empty: css`\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 256px;\n color: ${colors.textSecondary};\n `,\n tableWrapper: css`\n background: ${colors.surface};\n border-radius: 8px;\n border: 1px solid ${colors.border};\n overflow: hidden;\n `,\n table: css`\n width: 100%;\n border-collapse: collapse;\n `,\n th: css`\n text-align: left;\n font-size: 11px;\n color: ${colors.textMuted};\n text-transform: uppercase;\n letter-spacing: 0.05em;\n padding: 12px 16px;\n font-weight: 600;\n background: ${colors.background};\n border-bottom: 1px solid ${colors.border};\n `,\n thCheckbox: css`\n width: 48px;\n `,\n thSize: css`\n width: 96px;\n `,\n thDimensions: css`\n width: 128px;\n `,\n thCdn: css`\n width: 96px;\n `,\n tbody: css``,\n row: css`\n cursor: pointer;\n transition: background-color 0.15s ease;\n user-select: none;\n \n &:hover {\n background-color: ${colors.surfaceHover};\n }\n \n &:not(:last-child) td {\n border-bottom: 1px solid ${colors.borderLight};\n }\n `,\n rowSelected: css`\n background-color: ${colors.primaryLight};\n \n &:hover {\n background-color: ${colors.primaryLight};\n }\n `,\n parentRow: css`\n cursor: pointer;\n \n &:hover {\n background-color: ${colors.surfaceHover};\n }\n `,\n td: css`\n padding: 12px 16px;\n `,\n checkboxCell: css`\n padding: 12px 16px;\n cursor: pointer;\n `,\n checkbox: css`\n width: 16px;\n height: 16px;\n accent-color: ${colors.primary};\n cursor: pointer;\n `,\n nameCell: css`\n display: flex;\n align-items: center;\n gap: 12px;\n `,\n folderIcon: css`\n width: 20px;\n height: 20px;\n color: #f5a623;\n flex-shrink: 0;\n `,\n parentIcon: css`\n width: 20px;\n height: 20px;\n color: ${colors.textMuted};\n flex-shrink: 0;\n `,\n fileIcon: css`\n width: 20px;\n height: 20px;\n color: ${colors.textMuted};\n flex-shrink: 0;\n `,\n thumbnail: css`\n width: 36px;\n height: 36px;\n object-fit: cover;\n border-radius: 6px;\n flex-shrink: 0;\n border: 1px solid ${colors.borderLight};\n `,\n name: css`\n font-size: ${fontSize.base};\n font-weight: 500;\n color: ${colors.text};\n letter-spacing: -0.01em;\n `,\n meta: css`\n font-size: ${fontSize.sm};\n color: ${colors.textSecondary};\n `,\n cdnBadge: css`\n display: inline-flex;\n align-items: center;\n gap: 4px;\n font-size: ${fontSize.xs};\n font-weight: 500;\n color: ${colors.success};\n `,\n cdnIcon: css`\n width: 12px;\n height: 12px;\n `,\n cdnEmpty: css`\n font-size: ${fontSize.sm};\n color: ${colors.textMuted};\n `,\n openBtn: css`\n height: 28px;\n font-size: ${fontSize.xs};\n font-weight: 500;\n color: ${colors.primary};\n background: ${colors.surface};\n border: 1px solid ${colors.border};\n padding: 0 12px;\n cursor: pointer;\n border-radius: 4px;\n transition: all 0.15s ease;\n display: inline-flex;\n align-items: center;\n margin-left: auto;\n \n &:hover {\n background-color: ${colors.primaryLight};\n border-color: ${colors.primary};\n }\n `,\n}\n\nexport function StudioFileList() {\n const { currentPath, setCurrentPath, navigateUp, selectedItems, toggleSelection, selectRange, lastSelectedPath, selectAll, clearSelection, refreshKey, setFocusedItem } = useStudio()\n const [items, setItems] = useState<FileItem[]>([])\n const [loading, setLoading] = useState(true)\n\n useEffect(() => {\n async function loadItems() {\n setLoading(true)\n try {\n const response = await fetch(`/api/studio/list?path=${encodeURIComponent(currentPath)}`)\n if (response.ok) {\n const data = await response.json()\n setItems(data.items || [])\n }\n } catch (error) {\n console.error('Failed to load items:', error)\n }\n setLoading(false)\n }\n loadItems()\n }, [currentPath, refreshKey])\n\n if (loading) {\n return (\n <div css={styles.loading}>\n <div css={styles.spinner} />\n </div>\n )\n }\n\n const isAtRoot = currentPath === 'public'\n\n if (items.length === 0 && isAtRoot) {\n return (\n <div css={styles.empty}>\n <p>No files in this folder</p>\n </div>\n )\n }\n\n const sortedItems = [...items].sort((a, b) => {\n if (a.type === 'folder' && b.type !== 'folder') return -1\n if (a.type !== 'folder' && b.type === 'folder') return 1\n return a.name.localeCompare(b.name)\n })\n\n const handleItemClick = (item: FileItem, e: React.MouseEvent) => {\n if (e.shiftKey && lastSelectedPath) {\n selectRange(lastSelectedPath, item.path, sortedItems)\n } else {\n toggleSelection(item.path)\n }\n }\n\n const handleOpen = (item: FileItem) => {\n if (item.type === 'folder') {\n setCurrentPath(item.path)\n } else {\n setFocusedItem(item)\n }\n }\n\n const allItemsSelected = sortedItems.length > 0 && sortedItems.every(item => selectedItems.has(item.path))\n const someItemsSelected = sortedItems.some(item => selectedItems.has(item.path))\n\n const handleSelectAll = () => {\n if (allItemsSelected) {\n clearSelection()\n } else {\n selectAll(sortedItems)\n }\n }\n\n return (\n <div css={styles.tableWrapper}>\n <table css={styles.table}>\n <thead>\n <tr>\n <th css={[styles.th, styles.thCheckbox]}>\n {sortedItems.length > 0 && (\n <input\n type=\"checkbox\"\n css={styles.checkbox}\n checked={allItemsSelected}\n ref={(el) => {\n if (el) el.indeterminate = someItemsSelected && !allItemsSelected\n }}\n onChange={handleSelectAll}\n />\n )}\n </th>\n <th css={styles.th}>Name</th>\n <th css={[styles.th, styles.thSize]}>Size</th>\n <th css={[styles.th, styles.thDimensions]}>Dimensions</th>\n <th css={[styles.th, styles.thCdn]}>CDN</th>\n </tr>\n </thead>\n <tbody css={styles.tbody}>\n {/* Parent folder navigation */}\n {!isAtRoot && (\n <tr css={styles.parentRow} onClick={navigateUp}>\n <td css={styles.td}></td>\n <td css={styles.td}>\n <div css={styles.nameCell}>\n <svg css={styles.parentIcon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={1.5} d=\"M3 10h10a8 8 0 018 8v2M3 10l6 6m-6-6l6-6\" />\n </svg>\n <span css={styles.name}>..</span>\n </div>\n </td>\n <td css={[styles.td, styles.meta]}>--</td>\n <td css={[styles.td, styles.meta]}>Parent folder</td>\n <td css={styles.td}>--</td>\n </tr>\n )}\n \n {sortedItems.map((item) => (\n <ListRow\n key={item.path}\n item={item}\n isSelected={selectedItems.has(item.path)}\n onClick={(e) => handleItemClick(item, e)}\n onOpen={() => handleOpen(item)}\n />\n ))}\n </tbody>\n </table>\n </div>\n )\n}\n\ninterface ListRowProps {\n item: FileItem\n isSelected: boolean\n onClick: (e: React.MouseEvent) => void\n onOpen: () => void\n}\n\nfunction ListRow({ item, isSelected, onClick, onOpen }: ListRowProps) {\n const isFolder = item.type === 'folder'\n\n return (\n <tr \n css={[styles.row, isSelected && styles.rowSelected]} \n onClick={onClick}\n >\n <td\n css={[styles.td, styles.checkboxCell]}\n onClick={(e) => e.stopPropagation()}\n >\n <input\n type=\"checkbox\"\n css={styles.checkbox}\n checked={isSelected}\n onChange={() => onClick({} as React.MouseEvent)}\n />\n </td>\n <td css={styles.td}>\n <div css={styles.nameCell}>\n {isFolder ? (\n <svg css={styles.folderIcon} fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M10 4H4a2 2 0 00-2 2v12a2 2 0 002 2h16a2 2 0 002-2V8a2 2 0 00-2-2h-8l-2-2z\" />\n </svg>\n ) : item.thumbnail ? (\n <img css={styles.thumbnail} src={item.thumbnail} alt={item.name} loading=\"lazy\" />\n ) : (\n <svg css={styles.fileIcon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={1.5} d=\"M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z\" />\n </svg>\n )}\n <span css={styles.name}>{item.name}</span>\n <button\n css={styles.openBtn}\n onClick={(e) => {\n e.stopPropagation()\n onOpen()\n }}\n >\n Open\n </button>\n </div>\n </td>\n <td css={[styles.td, styles.meta]}>\n {isFolder \n ? (item.fileCount !== undefined ? `${item.fileCount} files` : '--')\n : (item.size !== undefined ? formatFileSize(item.size) : '--')\n }\n </td>\n <td css={[styles.td, styles.meta]}>\n {isFolder \n ? (item.totalSize !== undefined ? formatFileSize(item.totalSize) : '--')\n : (item.dimensions ? `${item.dimensions.width}x${item.dimensions.height}` : '--')\n }\n </td>\n <td css={styles.td}>\n {item.cdnSynced ? (\n <span css={styles.cdnBadge}>\n <svg css={styles.cdnIcon} fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path fillRule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clipRule=\"evenodd\" />\n </svg>\n Synced\n </span>\n ) : (\n <span css={styles.cdnEmpty}>--</span>\n )}\n </td>\n </tr>\n )\n}\n\nfunction formatFileSize(bytes: number): string {\n if (bytes < 1024) return `${bytes} B`\n if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`\n return `${(bytes / (1024 * 1024)).toFixed(1)} MB`\n}\n","/** @jsxImportSource @emotion/react */\n'use client'\n\nimport { useState } from 'react'\nimport { css } from '@emotion/react'\nimport { useStudio } from './StudioContext'\nimport { ConfirmModal, AlertModal } from './StudioModal'\nimport { colors, fontSize } from './tokens'\n\nconst IMAGE_EXTENSIONS = ['.jpg', '.jpeg', '.png', '.gif', '.webp', '.svg', '.ico', '.bmp', '.tiff', '.tif']\nconst VIDEO_EXTENSIONS = ['.mp4', '.webm', '.mov', '.avi', '.mkv', '.m4v']\n\nfunction isImageFile(filename: string): boolean {\n const ext = filename.toLowerCase().substring(filename.lastIndexOf('.'))\n return IMAGE_EXTENSIONS.includes(ext)\n}\n\nfunction isVideoFile(filename: string): boolean {\n const ext = filename.toLowerCase().substring(filename.lastIndexOf('.'))\n return VIDEO_EXTENSIONS.includes(ext)\n}\n\nconst styles = {\n container: css`\n display: flex;\n flex: 1;\n overflow: hidden;\n `,\n main: css`\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 24px;\n background: ${colors.background};\n overflow: auto;\n `,\n mediaWrapper: css`\n max-width: 100%;\n max-height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n `,\n image: css`\n max-width: 100%;\n max-height: calc(100vh - 200px);\n object-fit: contain;\n border-radius: 8px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);\n `,\n video: css`\n max-width: 100%;\n max-height: calc(100vh - 200px);\n border-radius: 8px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);\n `,\n filePlaceholder: css`\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 48px;\n background: ${colors.surface};\n border-radius: 12px;\n border: 1px solid ${colors.border};\n `,\n fileIcon: css`\n width: 80px;\n height: 80px;\n color: ${colors.textMuted};\n margin-bottom: 16px;\n `,\n fileName: css`\n font-size: ${fontSize.lg};\n font-weight: 600;\n color: ${colors.text};\n margin: 0;\n `,\n sidebar: css`\n width: 280px;\n background: ${colors.surface};\n border-left: 1px solid ${colors.border};\n display: flex;\n flex-direction: column;\n overflow: hidden;\n `,\n sidebarHeader: css`\n padding: 16px 20px;\n border-bottom: 1px solid ${colors.border};\n display: flex;\n align-items: center;\n justify-content: space-between;\n `,\n sidebarTitle: css`\n font-size: ${fontSize.base};\n font-weight: 600;\n color: ${colors.text};\n margin: 0;\n `,\n closeBtn: css`\n padding: 6px;\n background: ${colors.surface};\n border: 1px solid ${colors.border};\n border-radius: 6px;\n cursor: pointer;\n transition: all 0.15s ease;\n display: flex;\n align-items: center;\n justify-content: center;\n \n &:hover {\n background-color: ${colors.surfaceHover};\n border-color: ${colors.borderHover};\n }\n `,\n closeIcon: css`\n width: 16px;\n height: 16px;\n color: ${colors.textSecondary};\n `,\n sidebarContent: css`\n flex: 1;\n padding: 20px;\n overflow: auto;\n `,\n info: css`\n display: flex;\n flex-direction: column;\n gap: 12px;\n margin-bottom: 24px;\n `,\n infoRow: css`\n display: flex;\n justify-content: space-between;\n font-size: ${fontSize.sm};\n `,\n infoLabel: css`\n color: ${colors.textSecondary};\n `,\n infoValue: css`\n color: ${colors.text};\n font-weight: 500;\n text-align: right;\n max-width: 160px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n `,\n actions: css`\n display: flex;\n flex-direction: column;\n gap: 8px;\n `,\n actionBtn: css`\n display: flex;\n align-items: center;\n gap: 10px;\n width: 100%;\n padding: 12px 14px;\n font-size: ${fontSize.base};\n font-weight: 500;\n background: ${colors.surface};\n border: 1px solid ${colors.border};\n border-radius: 6px;\n cursor: pointer;\n transition: all 0.15s ease;\n color: ${colors.text};\n text-align: left;\n \n &:hover {\n background-color: ${colors.surfaceHover};\n border-color: ${colors.borderHover};\n }\n `,\n actionBtnDanger: css`\n color: ${colors.danger};\n \n &:hover {\n background-color: ${colors.dangerLight};\n border-color: ${colors.danger};\n }\n `,\n actionIcon: css`\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n `,\n}\n\nexport function StudioDetailView() {\n const { focusedItem, setFocusedItem, triggerRefresh, clearSelection } = useStudio()\n const [showDeleteConfirm, setShowDeleteConfirm] = useState(false)\n const [alertMessage, setAlertMessage] = useState<{ title: string; message: string } | null>(null)\n\n if (!focusedItem) return null\n\n const isImage = isImageFile(focusedItem.name)\n const isVideo = isVideoFile(focusedItem.name)\n const imageSrc = focusedItem.path.replace('public', '')\n\n const handleClose = () => {\n setFocusedItem(null)\n }\n\n const handleRename = () => {\n const newName = prompt('Enter new name:', focusedItem.name)\n if (newName && newName !== focusedItem.name) {\n console.log('Rename to:', newName)\n // TODO: Implement rename API\n }\n }\n\n const handleDelete = async () => {\n setShowDeleteConfirm(false)\n try {\n const response = await fetch('/api/studio/delete', {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify({ paths: [focusedItem.path] }),\n })\n\n if (response.ok) {\n clearSelection()\n triggerRefresh()\n setFocusedItem(null)\n } else {\n const error = await response.json()\n setAlertMessage({\n title: 'Delete Failed',\n message: error.error || 'Unknown error',\n })\n }\n } catch (error) {\n console.error('Delete error:', error)\n setAlertMessage({\n title: 'Delete Failed',\n message: 'Delete failed. Check console for details.',\n })\n }\n }\n\n const handleSync = () => {\n console.log('Sync to CDN:', focusedItem.path)\n // TODO: Implement sync API\n }\n\n const handleRegenerate = () => {\n console.log('Regenerate:', focusedItem.path)\n // TODO: Implement regenerate API\n }\n\n const renderMedia = () => {\n if (isImage) {\n return <img css={styles.image} src={imageSrc} alt={focusedItem.name} />\n }\n if (isVideo) {\n return <video css={styles.video} src={imageSrc} controls />\n }\n return (\n <div css={styles.filePlaceholder}>\n <svg css={styles.fileIcon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={1.5} d=\"M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z\" />\n </svg>\n <p css={styles.fileName}>{focusedItem.name}</p>\n </div>\n )\n }\n\n return (\n <>\n {showDeleteConfirm && (\n <ConfirmModal\n title=\"Delete File\"\n message={`Are you sure you want to delete \"${focusedItem.name}\"? This action cannot be undone.`}\n confirmLabel=\"Delete\"\n variant=\"danger\"\n onConfirm={handleDelete}\n onCancel={() => setShowDeleteConfirm(false)}\n />\n )}\n\n {alertMessage && (\n <AlertModal\n title={alertMessage.title}\n message={alertMessage.message}\n onClose={() => setAlertMessage(null)}\n />\n )}\n\n <div css={styles.container}>\n <div css={styles.main}>\n <div css={styles.mediaWrapper}>\n {renderMedia()}\n </div>\n </div>\n\n <div css={styles.sidebar}>\n <div css={styles.sidebarHeader}>\n <h3 css={styles.sidebarTitle}>Details</h3>\n <button css={styles.closeBtn} onClick={handleClose} aria-label=\"Close\">\n <svg css={styles.closeIcon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M6 18L18 6M6 6l12 12\" />\n </svg>\n </button>\n </div>\n\n <div css={styles.sidebarContent}>\n <div css={styles.info}>\n <div css={styles.infoRow}>\n <span css={styles.infoLabel}>Name</span>\n <span css={styles.infoValue} title={focusedItem.name}>{focusedItem.name}</span>\n </div>\n {focusedItem.size !== undefined && (\n <div css={styles.infoRow}>\n <span css={styles.infoLabel}>Size</span>\n <span css={styles.infoValue}>{formatFileSize(focusedItem.size)}</span>\n </div>\n )}\n {focusedItem.dimensions && (\n <div css={styles.infoRow}>\n <span css={styles.infoLabel}>Dimensions</span>\n <span css={styles.infoValue}>{focusedItem.dimensions.width} × {focusedItem.dimensions.height}</span>\n </div>\n )}\n <div css={styles.infoRow}>\n <span css={styles.infoLabel}>CDN Status</span>\n <span css={styles.infoValue}>{focusedItem.cdnSynced ? 'Synced' : 'Not synced'}</span>\n </div>\n </div>\n\n <div css={styles.actions}>\n <button css={styles.actionBtn} onClick={handleRename}>\n <svg css={styles.actionIcon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z\" />\n </svg>\n Rename\n </button>\n <button css={styles.actionBtn} onClick={handleSync}>\n <svg css={styles.actionIcon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12\" />\n </svg>\n Sync to CDN\n </button>\n <button css={styles.actionBtn} onClick={handleRegenerate}>\n <svg css={styles.actionIcon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15\" />\n </svg>\n Regenerate\n </button>\n <button css={[styles.actionBtn, styles.actionBtnDanger]} onClick={() => setShowDeleteConfirm(true)}>\n <svg css={styles.actionIcon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16\" />\n </svg>\n Delete\n </button>\n </div>\n </div>\n </div>\n </div>\n </>\n )\n}\n\nfunction formatFileSize(bytes: number): string {\n if (bytes < 1024) return `${bytes} B`\n if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`\n return `${(bytes / (1024 * 1024)).toFixed(1)} MB`\n}\n","/** @jsxImportSource @emotion/react */\n'use client'\n\nimport { useState } from 'react'\nimport { css } from '@emotion/react'\nimport { colors, fontSize, baseReset } from './tokens'\n\n// Standard button height for consistency\nconst btnHeight = '36px'\n\nconst styles = {\n btn: css`\n height: ${btnHeight};\n padding: 0 12px;\n background: ${colors.surface};\n border: 1px solid ${colors.border};\n border-radius: 6px;\n cursor: pointer;\n transition: all 0.15s ease;\n display: flex;\n align-items: center;\n justify-content: center;\n \n &:hover {\n background-color: ${colors.surfaceHover};\n border-color: ${colors.borderHover};\n }\n `,\n icon: css`\n width: 16px;\n height: 16px;\n color: ${colors.textSecondary};\n `,\n overlay: css`\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 10000;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: rgba(26, 31, 54, 0.4);\n backdrop-filter: blur(4px);\n `,\n panel: css`\n ${baseReset}\n position: relative;\n background-color: ${colors.surface};\n border-radius: 12px;\n box-shadow: 0 30px 60px -12px rgba(50, 50, 93, 0.25), 0 18px 36px -18px rgba(0, 0, 0, 0.3);\n width: 100%;\n max-width: 512px;\n padding: 24px;\n `,\n header: css`\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 24px;\n `,\n title: css`\n font-size: ${fontSize.xl};\n font-weight: 600;\n color: ${colors.text};\n margin: 0;\n letter-spacing: -0.02em;\n `,\n closeBtn: css`\n padding: 6px;\n background: ${colors.surface};\n border: 1px solid ${colors.border};\n border-radius: 6px;\n cursor: pointer;\n transition: all 0.15s ease;\n display: flex;\n align-items: center;\n justify-content: center;\n \n &:hover {\n background-color: ${colors.surfaceHover};\n border-color: ${colors.borderHover};\n }\n `,\n sections: css`\n display: flex;\n flex-direction: column;\n gap: 24px;\n `,\n sectionTitle: css`\n font-size: ${fontSize.base};\n font-weight: 600;\n color: ${colors.text};\n margin: 0 0 12px 0;\n `,\n description: css`\n font-size: ${fontSize.sm};\n color: ${colors.textSecondary};\n margin: 0 0 12px 0;\n `,\n code: css`\n background-color: ${colors.background};\n border-radius: 8px;\n padding: 12px;\n font-family: 'SF Mono', Monaco, Consolas, monospace;\n font-size: ${fontSize.xs};\n color: ${colors.textSecondary};\n border: 1px solid ${colors.border};\n `,\n codeLine: css`\n margin: 0 0 4px 0;\n \n &:last-child {\n margin: 0;\n }\n `,\n input: css`\n width: 100%;\n padding: 10px 14px;\n border: 1px solid ${colors.border};\n border-radius: 6px;\n font-size: ${fontSize.base};\n color: ${colors.text};\n background: ${colors.surface};\n transition: all 0.15s ease;\n \n &:focus {\n outline: none;\n border-color: ${colors.primary};\n box-shadow: 0 0 0 3px ${colors.primaryLight};\n }\n \n &::placeholder {\n color: ${colors.textMuted};\n }\n `,\n grid: css`\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 12px;\n `,\n label: css`\n font-size: ${fontSize.xs};\n font-weight: 500;\n color: ${colors.textSecondary};\n display: block;\n margin-bottom: 6px;\n `,\n footer: css`\n margin-top: 24px;\n padding-top: 20px;\n border-top: 1px solid ${colors.border};\n display: flex;\n justify-content: flex-end;\n gap: 12px;\n `,\n cancelBtn: css`\n padding: 10px 18px;\n font-size: ${fontSize.base};\n font-weight: 500;\n color: ${colors.text};\n background: ${colors.surface};\n border: 1px solid ${colors.border};\n border-radius: 6px;\n cursor: pointer;\n transition: all 0.15s ease;\n \n &:hover {\n background-color: ${colors.surfaceHover};\n border-color: ${colors.borderHover};\n }\n `,\n saveBtn: css`\n padding: 10px 18px;\n font-size: ${fontSize.base};\n font-weight: 500;\n color: white;\n background-color: ${colors.primary};\n border: 1px solid ${colors.primary};\n border-radius: 6px;\n cursor: pointer;\n transition: all 0.15s ease;\n \n &:hover {\n background-color: ${colors.primaryHover};\n border-color: ${colors.primaryHover};\n }\n `,\n}\n\nexport function StudioSettings() {\n const [isOpen, setIsOpen] = useState(false)\n\n return (\n <>\n <button css={styles.btn} onClick={() => setIsOpen(true)} aria-label=\"Settings\">\n <svg\n css={styles.icon}\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth={2}\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"3\" />\n <path d=\"M19.4 15a1.65 1.65 0 00.33 1.82l.06.06a2 2 0 010 2.83 2 2 0 01-2.83 0l-.06-.06a1.65 1.65 0 00-1.82-.33 1.65 1.65 0 00-1 1.51V21a2 2 0 01-2 2 2 2 0 01-2-2v-.09A1.65 1.65 0 009 19.4a1.65 1.65 0 00-1.82.33l-.06.06a2 2 0 01-2.83 0 2 2 0 010-2.83l.06-.06a1.65 1.65 0 00.33-1.82 1.65 1.65 0 00-1.51-1H3a2 2 0 01-2-2 2 2 0 012-2h.09A1.65 1.65 0 004.6 9a1.65 1.65 0 00-.33-1.82l-.06-.06a2 2 0 010-2.83 2 2 0 012.83 0l.06.06a1.65 1.65 0 001.82.33H9a1.65 1.65 0 001-1.51V3a2 2 0 012-2 2 2 0 012 2v.09a1.65 1.65 0 001 1.51 1.65 1.65 0 001.82-.33l.06-.06a2 2 0 012.83 0 2 2 0 010 2.83l-.06.06a1.65 1.65 0 00-.33 1.82V9a1.65 1.65 0 001.51 1H21a2 2 0 012 2 2 2 0 01-2 2h-.09a1.65 1.65 0 00-1.51 1z\" />\n </svg>\n </button>\n\n {isOpen && <SettingsPanel onClose={() => setIsOpen(false)} />}\n </>\n )\n}\n\nfunction SettingsPanel({ onClose }: { onClose: () => void }) {\n return (\n <div css={styles.overlay} onClick={onClose}>\n <div css={styles.panel} onClick={(e) => e.stopPropagation()}>\n <div css={styles.header}>\n <h2 css={styles.title}>Settings</h2>\n <button css={styles.closeBtn} onClick={onClose}>\n <svg css={styles.icon} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M6 18L18 6M6 6l12 12\" />\n </svg>\n </button>\n </div>\n\n <div css={styles.sections}>\n <section>\n <h3 css={styles.sectionTitle}>Cloudflare R2</h3>\n <p css={styles.description}>Configure in .env.local file:</p>\n <div css={styles.code}>\n <p css={styles.codeLine}>CLOUDFLARE_R2_ACCOUNT_ID</p>\n <p css={styles.codeLine}>CLOUDFLARE_R2_ACCESS_KEY_ID</p>\n <p css={styles.codeLine}>CLOUDFLARE_R2_SECRET_ACCESS_KEY</p>\n <p css={styles.codeLine}>CLOUDFLARE_R2_BUCKET_NAME</p>\n <p css={styles.codeLine}>CLOUDFLARE_R2_PUBLIC_URL</p>\n </div>\n </section>\n\n <section>\n <h3 css={styles.sectionTitle}>Custom CDN URL</h3>\n <p css={styles.description}>Override the default R2 URL with a custom domain:</p>\n <input css={styles.input} type=\"text\" placeholder=\"https://cdn.yourdomain.com\" />\n </section>\n\n <section>\n <h3 css={styles.sectionTitle}>Thumbnail Sizes</h3>\n <div css={styles.grid}>\n <div>\n <label css={styles.label}>Small</label>\n <input css={styles.input} type=\"number\" defaultValue={300} />\n </div>\n <div>\n <label css={styles.label}>Medium</label>\n <input css={styles.input} type=\"number\" defaultValue={700} />\n </div>\n <div>\n <label css={styles.label}>Large</label>\n <input css={styles.input} type=\"number\" defaultValue={1400} />\n </div>\n </div>\n </section>\n </div>\n\n <div css={styles.footer}>\n <button css={styles.cancelBtn} onClick={onClose}>Cancel</button>\n <button css={styles.saveBtn}>Save Changes</button>\n </div>\n </div>\n </div>\n )\n}\n"],"mappings":"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","names":["useEffect","useCallback","useState","css","css","keyframes","jsx","jsxs","keyframes","styles","css","useState","css","keyframes","jsx","jsxs","spin","keyframes","styles","css","useState","useEffect","useState","css","keyframes","jsx","jsxs","spin","keyframes","styles","css","useState","useEffect","formatFileSize","useState","css","Fragment","jsx","jsxs","styles","css","useState","formatFileSize","useState","css","Fragment","jsx","jsxs","btnHeight","styles","css","useState","jsx","jsxs","btnHeight","styles","css","useState","useCallback","useEffect"]}
package/dist/chunk-AY2DAS6W.js ADDED
@@ -0,0 +1,64 @@
1
+ "use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/components/tokens.ts
2
+ var _react = require('@emotion/react');
3
+ var fontStack = `-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Ubuntu, sans-serif`;
4
+ var colors = {
5
+ // Primary brand
6
+ primary: "#635bff",
7
+ primaryHover: "#5851e5",
8
+ primaryLight: "#f0f0ff",
9
+ // Backgrounds
10
+ background: "#f6f9fc",
11
+ surface: "#ffffff",
12
+ surfaceHover: "#f6f9fc",
13
+ // Borders
14
+ border: "#d8dee4",
15
+ borderLight: "#e3e8ee",
16
+ borderHover: "#c1c9d2",
17
+ // Text
18
+ text: "#1a1f36",
19
+ textSecondary: "#697386",
20
+ textMuted: "#8792a2",
21
+ // Status
22
+ success: "#0d7d4d",
23
+ successLight: "#e6f7ef",
24
+ danger: "#df1b41",
25
+ dangerHover: "#c41535",
26
+ dangerLight: "#fff5f7",
27
+ // Shadows
28
+ shadow: "rgba(50, 50, 93, 0.1)",
29
+ shadowDark: "rgba(50, 50, 93, 0.2)"
30
+ };
31
+ var fontSize = {
32
+ xs: "12px",
33
+ sm: "13px",
34
+ base: "14px",
35
+ md: "15px",
36
+ lg: "16px",
37
+ xl: "18px"
38
+ };
39
+ var baseReset = _react.css`
40
+ font-family: ${fontStack};
41
+ font-size: ${fontSize.base};
42
+ line-height: 1.5;
43
+ color: ${colors.text};
44
+ -webkit-font-smoothing: antialiased;
45
+ -moz-osx-font-smoothing: grayscale;
46
+ box-sizing: border-box;
47
+
48
+ *, *::before, *::after {
49
+ box-sizing: border-box;
50
+ }
51
+
52
+ button, input, select, textarea {
53
+ font-family: inherit;
54
+ font-size: inherit;
55
+ }
56
+ `;
57
+
58
+
59
+
60
+
61
+
62
+
63
+ exports.fontStack = fontStack; exports.colors = colors; exports.fontSize = fontSize; exports.baseReset = baseReset;
64
+ //# sourceMappingURL=chunk-AY2DAS6W.js.map
package/dist/chunk-AY2DAS6W.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["/Users/chrisb/Sites/studio/dist/chunk-AY2DAS6W.js","../src/components/tokens.ts"],"names":[],"mappings":"AAAA;ACAA,uCAAoB;AAQb,IAAM,UAAA,EAAY,CAAA,2FAAA,CAAA;AAGlB,IAAM,OAAA,EAAS;AAAA;AAAA,EAEpB,OAAA,EAAS,SAAA;AAAA,EACT,YAAA,EAAc,SAAA;AAAA,EACd,YAAA,EAAc,SAAA;AAAA;AAAA,EAGd,UAAA,EAAY,SAAA;AAAA,EACZ,OAAA,EAAS,SAAA;AAAA,EACT,YAAA,EAAc,SAAA;AAAA;AAAA,EAGd,MAAA,EAAQ,SAAA;AAAA,EACR,WAAA,EAAa,SAAA;AAAA,EACb,WAAA,EAAa,SAAA;AAAA;AAAA,EAGb,IAAA,EAAM,SAAA;AAAA,EACN,aAAA,EAAe,SAAA;AAAA,EACf,SAAA,EAAW,SAAA;AAAA;AAAA,EAGX,OAAA,EAAS,SAAA;AAAA,EACT,YAAA,EAAc,SAAA;AAAA,EACd,MAAA,EAAQ,SAAA;AAAA,EACR,WAAA,EAAa,SAAA;AAAA,EACb,WAAA,EAAa,SAAA;AAAA;AAAA,EAGb,MAAA,EAAQ,uBAAA;AAAA,EACR,UAAA,EAAY;AACd,CAAA;AAGO,IAAM,SAAA,EAAW;AAAA,EACtB,EAAA,EAAI,MAAA;AAAA,EACJ,EAAA,EAAI,MAAA;AAAA,EACJ,IAAA,EAAM,MAAA;AAAA,EACN,EAAA,EAAI,MAAA;AAAA,EACJ,EAAA,EAAI,MAAA;AAAA,EACJ,EAAA,EAAI;AACN,CAAA;AAGO,IAAM,UAAA,EAAY,UAAA,CAAA;AAAA,eAAA,EACR,SAAS,CAAA;AAAA,aAAA,EACX,QAAA,CAAS,IAAI,CAAA;AAAA;AAAA,SAAA,EAEjB,MAAA,CAAO,IAAI,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAAA;ADHtB;AACA;AACE;AACA;AACA;AACA;AACF,mHAAC","file":"/Users/chrisb/Sites/studio/dist/chunk-AY2DAS6W.js","sourcesContent":[null,"import { css } from '@emotion/react'\n\n/**\n * Stripe-inspired design tokens for Studio\n * These are self-contained and agnostic of any parent template styling\n */\n\n// Base font stack - system fonts that work everywhere\nexport const fontStack = `-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Ubuntu, sans-serif`\n\n// Color palette\nexport const colors = {\n // Primary brand\n primary: '#635bff',\n primaryHover: '#5851e5',\n primaryLight: '#f0f0ff',\n \n // Backgrounds\n background: '#f6f9fc',\n surface: '#ffffff',\n surfaceHover: '#f6f9fc',\n \n // Borders\n border: '#d8dee4',\n borderLight: '#e3e8ee',\n borderHover: '#c1c9d2',\n \n // Text\n text: '#1a1f36',\n textSecondary: '#697386',\n textMuted: '#8792a2',\n \n // Status\n success: '#0d7d4d',\n successLight: '#e6f7ef',\n danger: '#df1b41',\n dangerHover: '#c41535',\n dangerLight: '#fff5f7',\n \n // Shadows\n shadow: 'rgba(50, 50, 93, 0.1)',\n shadowDark: 'rgba(50, 50, 93, 0.2)',\n}\n\n// Font sizes - slightly larger for better readability\nexport const fontSize = {\n xs: '12px',\n sm: '13px',\n base: '14px',\n md: '15px',\n lg: '16px',\n xl: '18px',\n}\n\n// Base reset styles for Studio container - isolates from parent template\nexport const baseReset = css`\n font-family: ${fontStack};\n font-size: ${fontSize.base};\n line-height: 1.5;\n color: ${colors.text};\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n box-sizing: border-box;\n \n *, *::before, *::after {\n box-sizing: border-box;\n }\n \n button, input, select, textarea {\n font-family: inherit;\n font-size: inherit;\n }\n`\n"]}
package/dist/chunk-R5WKNVEV.mjs ADDED
@@ -0,0 +1,64 @@
1
+ // src/components/tokens.ts
2
+ import { css } from "@emotion/react";
3
+ var fontStack = `-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Ubuntu, sans-serif`;
4
+ var colors = {
5
+ // Primary brand
6
+ primary: "#635bff",
7
+ primaryHover: "#5851e5",
8
+ primaryLight: "#f0f0ff",
9
+ // Backgrounds
10
+ background: "#f6f9fc",
11
+ surface: "#ffffff",
12
+ surfaceHover: "#f6f9fc",
13
+ // Borders
14
+ border: "#d8dee4",
15
+ borderLight: "#e3e8ee",
16
+ borderHover: "#c1c9d2",
17
+ // Text
18
+ text: "#1a1f36",
19
+ textSecondary: "#697386",
20
+ textMuted: "#8792a2",
21
+ // Status
22
+ success: "#0d7d4d",
23
+ successLight: "#e6f7ef",
24
+ danger: "#df1b41",
25
+ dangerHover: "#c41535",
26
+ dangerLight: "#fff5f7",
27
+ // Shadows
28
+ shadow: "rgba(50, 50, 93, 0.1)",
29
+ shadowDark: "rgba(50, 50, 93, 0.2)"
30
+ };
31
+ var fontSize = {
32
+ xs: "12px",
33
+ sm: "13px",
34
+ base: "14px",
35
+ md: "15px",
36
+ lg: "16px",
37
+ xl: "18px"
38
+ };
39
+ var baseReset = css`
40
+ font-family: ${fontStack};
41
+ font-size: ${fontSize.base};
42
+ line-height: 1.5;
43
+ color: ${colors.text};
44
+ -webkit-font-smoothing: antialiased;
45
+ -moz-osx-font-smoothing: grayscale;
46
+ box-sizing: border-box;
47
+
48
+ *, *::before, *::after {
49
+ box-sizing: border-box;
50
+ }
51
+
52
+ button, input, select, textarea {
53
+ font-family: inherit;
54
+ font-size: inherit;
55
+ }
56
+ `;
57
+
58
+ export {
59
+ fontStack,
60
+ colors,
61
+ fontSize,
62
+ baseReset
63
+ };
64
+ //# sourceMappingURL=chunk-R5WKNVEV.mjs.map
package/dist/chunk-R5WKNVEV.mjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/tokens.ts"],"sourcesContent":["import { css } from '@emotion/react'\n\n/**\n * Stripe-inspired design tokens for Studio\n * These are self-contained and agnostic of any parent template styling\n */\n\n// Base font stack - system fonts that work everywhere\nexport const fontStack = `-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Ubuntu, sans-serif`\n\n// Color palette\nexport const colors = {\n // Primary brand\n primary: '#635bff',\n primaryHover: '#5851e5',\n primaryLight: '#f0f0ff',\n \n // Backgrounds\n background: '#f6f9fc',\n surface: '#ffffff',\n surfaceHover: '#f6f9fc',\n \n // Borders\n border: '#d8dee4',\n borderLight: '#e3e8ee',\n borderHover: '#c1c9d2',\n \n // Text\n text: '#1a1f36',\n textSecondary: '#697386',\n textMuted: '#8792a2',\n \n // Status\n success: '#0d7d4d',\n successLight: '#e6f7ef',\n danger: '#df1b41',\n dangerHover: '#c41535',\n dangerLight: '#fff5f7',\n \n // Shadows\n shadow: 'rgba(50, 50, 93, 0.1)',\n shadowDark: 'rgba(50, 50, 93, 0.2)',\n}\n\n// Font sizes - slightly larger for better readability\nexport const fontSize = {\n xs: '12px',\n sm: '13px',\n base: '14px',\n md: '15px',\n lg: '16px',\n xl: '18px',\n}\n\n// Base reset styles for Studio container - isolates from parent template\nexport const baseReset = css`\n font-family: ${fontStack};\n font-size: ${fontSize.base};\n line-height: 1.5;\n color: ${colors.text};\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n box-sizing: border-box;\n \n *, *::before, *::after {\n box-sizing: border-box;\n }\n \n button, input, select, textarea {\n font-family: inherit;\n font-size: inherit;\n }\n`\n"],"mappings":";AAAA,SAAS,WAAW;AAQb,IAAM,YAAY;AAGlB,IAAM,SAAS;AAAA;AAAA,EAEpB,SAAS;AAAA,EACT,cAAc;AAAA,EACd,cAAc;AAAA;AAAA,EAGd,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,cAAc;AAAA;AAAA,EAGd,QAAQ;AAAA,EACR,aAAa;AAAA,EACb,aAAa;AAAA;AAAA,EAGb,MAAM;AAAA,EACN,eAAe;AAAA,EACf,WAAW;AAAA;AAAA,EAGX,SAAS;AAAA,EACT,cAAc;AAAA,EACd,QAAQ;AAAA,EACR,aAAa;AAAA,EACb,aAAa;AAAA;AAAA,EAGb,QAAQ;AAAA,EACR,YAAY;AACd;AAGO,IAAM,WAAW;AAAA,EACtB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAGO,IAAM,YAAY;AAAA,iBACR,SAAS;AAAA,eACX,SAAS,IAAI;AAAA;AAAA,WAEjB,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;","names":[]}
package/dist/handlers.d.mts CHANGED
@@ -19,6 +19,10 @@ declare function GET(request: NextRequest): Promise<NextResponse<{
19
19
  */
20
20
  declare function POST(request: NextRequest): Promise<NextResponse<{
21
21
  error: string;
22
+ }> | NextResponse<{
23
+ success: boolean;
24
+ message: string;
25
+ path: string;
22
26
  }> | NextResponse<{
23
27
  success: boolean;
24
28
  imageKey: string;
package/dist/handlers.d.ts CHANGED
@@ -19,6 +19,10 @@ declare function GET(request: NextRequest): Promise<NextResponse<{
19
19
  */
20
20
  declare function POST(request: NextRequest): Promise<NextResponse<{
21
21
  error: string;
22
+ }> | NextResponse<{
23
+ success: boolean;
24
+ message: string;
25
+ path: string;
22
26
  }> | NextResponse<{
23
27
  success: boolean;
24
28
  imageKey: string;
package/dist/handlers.js CHANGED
@@ -185,7 +185,9 @@ async function handleUpload(request) {
185
185
  const fileName = file.name;
186
186
  const baseName = _path2.default.basename(fileName, _path2.default.extname(fileName));
187
187
  const ext = _path2.default.extname(fileName).toLowerCase();
188
+ const isImage = isImageFile(fileName);
188
189
  const isSvg = ext === ".svg";
190
+ const isProcessableImage = isImage && !isSvg;
189
191
  const meta = await loadMeta();
190
192
  if (!meta.images) {
191
193
  meta.images = {};
@@ -202,6 +204,16 @@ async function handleUpload(request) {
202
204
  { status: 400 }
203
205
  );
204
206
  }
207
+ const uploadDir = _path2.default.join(process.cwd(), "public", relativeDir);
208
+ await _fs.promises.mkdir(uploadDir, { recursive: true });
209
+ await _fs.promises.writeFile(_path2.default.join(uploadDir, fileName), buffer);
210
+ if (!isImage) {
211
+ return _server.NextResponse.json({
212
+ success: true,
213
+ message: "File uploaded successfully (non-image, no thumbnails generated)",
214
+ path: `public/${relativeDir ? relativeDir + "/" : ""}${fileName}`
215
+ });
216
+ }
205
217
  const fullImageKey = relativeDir ? `${relativeDir}/${fileName}` : fileName;
206
218
  if (meta.images[fullImageKey]) {
207
219
  return _server.NextResponse.json(
@@ -209,9 +221,6 @@ async function handleUpload(request) {
209
221
  { status: 409 }
210
222
  );
211
223
  }
212
- const uploadDir = _path2.default.join(process.cwd(), "public", relativeDir);
213
- await _fs.promises.mkdir(uploadDir, { recursive: true });
214
- await _fs.promises.writeFile(_path2.default.join(uploadDir, fileName), buffer);
215
224
  const imagesPath = _path2.default.join(process.cwd(), "public", "images", relativeDir);
216
225
  await _fs.promises.mkdir(imagesPath, { recursive: true });
217
226
  let originalWidth = 0;
@@ -232,7 +241,7 @@ async function handleUpload(request) {
232
241
  sizes.large = { ...sizes.full };
233
242
  sizes.medium = { ...sizes.full };
234
243
  sizes.small = { ...sizes.full };
235
- } else {
244
+ } else if (isProcessableImage) {
236
245
  const sharpInstance = _sharp2.default.call(void 0, buffer);
237
246
  const metadata = await sharpInstance.metadata();
238
247
  originalWidth = metadata.width || 0;