@open-mercato/ui 0.5.1-develop.2860.07af3a6a9d → 0.5.1-develop.2874.77704bccbd

package/dist/backend/PerspectiveSidebar.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/backend/PerspectiveSidebar.tsx"],
-  "sourcesContent": ["\"use client\"\nimport * as React from 'react'\nimport { ArrowLeft, Plus } from 'lucide-react'\nimport { Alert } from '../primitives/alert'\nimport { Button } from '../primitives/button'\nimport { Checkbox } from '../primitives/checkbox'\nimport { Spinner } from '../primitives/spinner'\nimport { useConfirmDialog } from './confirm-dialog'\nimport { flash } from './FlashMessages'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport type {\n  PerspectiveDto,\n  PerspectiveSettings,\n  RolePerspectiveDto,\n} from '@open-mercato/shared/modules/perspectives/types'\nimport { ViewChip } from './views/ViewChip'\nimport { NewViewForm } from './views/NewViewForm'\nimport { ShareForm } from './views/ShareForm'\nimport { type SidebarMode } from './views/types'\nimport { ColumnChooserSection, type ColumnChooserField } from './columns/ColumnChooserPanel'\n\nexport type { ColumnChooserField } from './columns/ColumnChooserPanel'\n\nexport type PerspectiveSidebarProps = {\n  open: boolean\n  onOpenChange: (open: boolean) => void\n  loading: boolean\n  perspectives: PerspectiveDto[]\n  rolePerspectives: RolePerspectiveDto[]\n  roles: Array<{ id: string; name: string; hasPerspective: boolean; hasDefault: boolean }>\n  activePerspectiveId: string | null\n  onActivatePerspective: (perspective: PerspectiveDto | RolePerspectiveDto, source: 'personal' | 'role') => void\n  onDeletePerspective: (perspectiveId: string) => Promise<void>\n  onClearRole: (roleId: string) => Promise<void>\n  onSave: (input: { name: string; isDefault: boolean; applyToRoles: string[]; setRoleDefault: boolean; perspectiveId?: string | null; settings?: PerspectiveSettings }) => Promise<void>\n  canApplyToRoles: boolean\n  availableColumns: ColumnChooserField[]\n  visibleColumnKeys: string[]\n  columnOrder: string[]\n  onToggleColumn: (key: string) => void\n  onReorderColumns: (orderedIds: string[]) => void\n  saving: boolean\n  deletingIds: string[]\n  roleClearingIds: string[]\n  apiWarning?: string | null\n}\n\nconst emptyArray: any[] = []\n\nexport function PerspectiveSidebar({\n  open,\n  onOpenChange,\n  loading,\n  perspectives,\n  rolePerspectives,\n  roles,\n  activePerspectiveId,\n  onActivatePerspective,\n  onDeletePerspective,\n  onClearRole,\n  onSave,\n  canApplyToRoles,\n  availableColumns,\n  visibleColumnKeys,\n  columnOrder,\n  onToggleColumn,\n  onReorderColumns,\n  saving,\n  deletingIds,\n  roleClearingIds,\n  apiWarning,\n}: PerspectiveSidebarProps) {\n  const t = useT()\n  const { confirm, ConfirmDialogElement } = useConfirmDialog()\n\n  React.useEffect(() => {\n    if (!open) return\n    if (typeof document === 'undefined') return\n    document.body.dataset.columnChooserOpen = 'true'\n    return () => {\n      delete document.body.dataset.columnChooserOpen\n    }\n  }, [open])\n\n  function perspectiveLabel(p: PerspectiveDto | RolePerspectiveDto) {\n    return p.name.trim().length ? p.name : t('ui.perspectives.untitled', 'Untitled view')\n  }\n\n  const [name, setName] = React.useState('')\n  const [isDefault, setIsDefault] = React.useState(false)\n  const [error, setError] = React.useState<string | null>(null)\n  const [mode, setMode] = React.useState<SidebarMode>({ type: 'idle' })\n  const [renamingId, setRenamingId] = React.useState<string | null>(null)\n  const [renameValue, setRenameValue] = React.useState('')\n  const [shareRoles, setShareRoles] = React.useState<string[]>([])\n  const [shareSetDefault, setShareSetDefault] = React.useState(false)\n  const [sharedIds, setSharedIds] = React.useState<Set<string>>(new Set())\n  const [pendingCloneBaselineIds, setPendingCloneBaselineIds] = React.useState<Set<string> | null>(null)\n\n  const autosaveRef = React.useRef<ReturnType<typeof setTimeout> | null>(null)\n  const isDefaultUserChangeRef = React.useRef(false)\n  const isDefaultRef = React.useRef(isDefault)\n  isDefaultRef.current = isDefault\n\n  const onSaveRef = React.useRef(onSave)\n  onSaveRef.current = onSave\n\n  const perspectivesRef = React.useRef(perspectives)\n  perspectivesRef.current = perspectives\n\n  const flushAutosave = React.useCallback(() => {\n    if (autosaveRef.current) {\n      clearTimeout(autosaveRef.current)\n      autosaveRef.current = null\n    }\n  }, [])\n\n  const scheduleAutosave = React.useCallback(() => {\n    if (!activePerspectiveId || mode.type === 'new') return\n    const activePersonal = perspectivesRef.current.find((p) => p.id === activePerspectiveId)\n    if (!activePersonal) return\n    flushAutosave()\n    const targetId = activePersonal.id\n    const targetName = activePersonal.name\n    autosaveRef.current = setTimeout(async () => {\n      autosaveRef.current = null\n      try {\n        await onSaveRef.current({\n          name: targetName,\n          isDefault: isDefaultRef.current,\n          applyToRoles: [],\n          setRoleDefault: false,\n          perspectiveId: targetId,\n        })\n        flash(t('ui.perspectives.autosave.success', 'View saved'), 'success')\n      } catch {\n        flash(t('ui.perspectives.autosave.error', 'Failed to save view'), 'error')\n      }\n    }, 400)\n  }, [activePerspectiveId, mode.type, flushAutosave, t])\n\n  React.useEffect(() => {\n    return () => { flushAutosave() }\n  }, [flushAutosave])\n\n  const resetMode = () => {\n    setMode({ type: 'idle' })\n    setName('')\n    setShareRoles([])\n    setShareSetDefault(false)\n  }\n\n  const startNewMode = () => {\n    setMode({ type: 'new' })\n    setName('')\n    setIsDefault(false)\n    setRenamingId(null)\n    setShareRoles([])\n    setShareSetDefault(false)\n  }\n\n  const startShareMode = (p: PerspectiveDto) => {\n    setMode({ type: 'share', perspectiveId: p.id, perspectiveName: p.name, perspectiveIsDefault: p.isDefault })\n    setName('')\n    setRenamingId(null)\n    setShareRoles([])\n    setShareSetDefault(false)\n  }\n\n  React.useEffect(() => {\n    if (!open) {\n      flushAutosave()\n      setError(null)\n      resetMode()\n      setRenamingId(null)\n      setSharedIds(new Set())\n      setPendingCloneBaselineIds(null)\n    }\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [open])\n\n  React.useEffect(() => {\n    if (!open) return\n    const active = perspectives.find((p) => p.id === activePerspectiveId)\n      ?? rolePerspectives.find((p) => p.id === activePerspectiveId)\n    isDefaultUserChangeRef.current = false\n    if (active) {\n      setIsDefault(active.isDefault)\n    } else {\n      setIsDefault(false)\n    }\n    requestAnimationFrame(() => { isDefaultUserChangeRef.current = true })\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [open, activePerspectiveId])\n\n  const handleSaveNew = async () => {\n    setError(null)\n    try {\n      await onSave({ name: name.trim(), isDefault, applyToRoles: [], setRoleDefault: false, perspectiveId: null })\n      resetMode()\n    } catch (err: unknown) {\n      setError(err instanceof Error ? err.message : 'Failed to save view')\n    }\n  }\n\n  const handleToggleColumnWithAutosave = React.useCallback((key: string) => {\n    onToggleColumn(key)\n    scheduleAutosave()\n  }, [onToggleColumn, scheduleAutosave])\n\n  const handleReorderColumnsWithAutosave = React.useCallback((orderedIds: string[]) => {\n    onReorderColumns(orderedIds)\n    scheduleAutosave()\n  }, [onReorderColumns, scheduleAutosave])\n\n  const handleRename = async (p: PerspectiveDto | RolePerspectiveDto) => {\n    const trimmed = renameValue.trim()\n    if (!trimmed) {\n      setRenamingId(null)\n      return\n    }\n    const conflict = perspectivesRef.current.some(\n      (item) => item.id !== p.id && item.name.trim() === trimmed,\n    )\n    if (conflict) {\n      flash(t('ui.perspectives.error.nameExists', 'View with this name already exists'), 'error')\n      return\n    }\n    setError(null)\n    try {\n      await onSave({\n        name: trimmed,\n        isDefault: p.isDefault,\n        applyToRoles: [],\n        setRoleDefault: false,\n        perspectiveId: p.id,\n      })\n      setRenamingId(null)\n    } catch (err: unknown) {\n      setError(err instanceof Error ? err.message : 'Failed to rename view')\n    }\n  }\n\n  const handleClone = async (p: PerspectiveDto | RolePerspectiveDto) => {\n    const originalName = perspectiveLabel(p)\n    setError(null)\n    const baseline = new Set(perspectivesRef.current.map((item) => item.id))\n    const originalSettingsKey = JSON.stringify(p.settings ?? {})\n    const sharedRoleIds = Array.from(\n      new Set(\n        rolePerspectives\n          .filter((rp) => JSON.stringify(rp.settings ?? {}) === originalSettingsKey)\n          .map((rp) => rp.roleId),\n      ),\n    )\n    const buildCloneName = (n: number) =>\n      n <= 1 ? `${originalName} (copy)` : `${originalName} (copy ${n})`\n    const existingNames = new Set(\n      perspectivesRef.current.map((item) => item.name.trim()),\n    )\n    let counter = 1\n    while (existingNames.has(buildCloneName(counter))) {\n      counter += 1\n    }\n    const clonedSettings = structuredClone(p.settings)\n    const MAX_ATTEMPTS = 50\n    let lastErr: unknown = null\n    for (let attempt = 0; attempt < MAX_ATTEMPTS; attempt += 1) {\n      try {\n        await onSave({\n          name: buildCloneName(counter),\n          isDefault: false,\n          applyToRoles: sharedRoleIds,\n          setRoleDefault: false,\n          perspectiveId: null,\n          settings: clonedSettings,\n        })\n        setPendingCloneBaselineIds(baseline)\n        return\n      } catch (err: unknown) {\n        const errMessage = err instanceof Error ? err.message : ''\n        const msg = errMessage.toLowerCase()\n        const isDuplicate = msg.includes('duplicate key') || msg.includes('unique constraint')\n        if (!isDuplicate) {\n          setError(errMessage || 'Failed to clone view')\n          return\n        }\n        lastErr = err\n        counter += 1\n      }\n    }\n    setError(lastErr instanceof Error ? lastErr.message : 'Failed to clone view')\n  }\n\n  React.useEffect(() => {\n    if (!pendingCloneBaselineIds) return\n    const created = perspectives.find((item) => !pendingCloneBaselineIds.has(item.id))\n    if (!created) return\n    setRenamingId(created.id)\n    setRenameValue(created.name)\n    setPendingCloneBaselineIds(null)\n  }, [perspectives, pendingCloneBaselineIds])\n\n  const handleDelete = async (p: PerspectiveDto) => {\n    const confirmed = await confirm({\n      title: t('ui.perspectives.delete.title', 'Delete \"{name}\"?', { name: perspectiveLabel(p) }),\n      text: t('ui.perspectives.delete.text', 'This view will be removed for you and all shared roles. This cannot be undone.'),\n      confirmText: t('common.delete', 'Delete'),\n      variant: 'destructive',\n    })\n    if (confirmed) {\n      await onDeletePerspective(p.id)\n    }\n  }\n\n  const handleDeleteRole = async (p: RolePerspectiveDto) => {\n    const confirmed = await confirm({\n      title: t('ui.perspectives.delete.title', 'Delete \"{name}\"?', { name: perspectiveLabel(p) }),\n      text: t('ui.perspectives.deleteRole.text', 'This shared view will be removed for the role. This cannot be undone.'),\n      confirmText: t('common.delete', 'Delete'),\n      variant: 'destructive',\n    })\n    if (confirmed) {\n      await onClearRole(p.roleId)\n    }\n  }\n\n  const handleShareApply = async () => {\n    if (mode.type !== 'share') return\n    setError(null)\n    try {\n      await onSave({ name: mode.perspectiveName, isDefault: mode.perspectiveIsDefault, applyToRoles: shareRoles, setRoleDefault: shareSetDefault, perspectiveId: mode.perspectiveId })\n      setSharedIds((prev) => new Set([...prev, mode.perspectiveId]))\n      resetMode()\n    } catch (err: unknown) {\n      setError(err instanceof Error ? err.message : 'Failed to share view')\n    }\n  }\n\n  const toggleShareRole = (roleId: string) => {\n    setShareRoles((prev) => {\n      const next = new Set(prev)\n      if (next.has(roleId)) next.delete(roleId)\n      else next.add(roleId)\n      return Array.from(next)\n    })\n  }\n\n  if (!open) return null\n\n  const isNew = mode.type === 'new'\n  const isShare = mode.type === 'share'\n\n  return (\n    <div className=\"fixed inset-0 z-50\">\n      <div className=\"absolute inset-0 bg-black/30\" onClick={() => onOpenChange(false)} role=\"presentation\" />\n      <div className=\"fixed right-0 top-0 h-full w-full sm:w-80 bg-background shadow-xl border-l flex flex-col\">\n        <div className=\"flex items-center p-4 border-b\">\n          <Button\n            type=\"button\"\n            variant=\"ghost\"\n            size=\"sm\"\n            onClick={() => onOpenChange(false)}\n            className=\"h-auto -ml-2 gap-2 px-2 text-lg font-semibold hover:bg-transparent\"\n            aria-label={t('ui.perspectives.close', 'Close')}\n          >\n            <ArrowLeft className=\"size-5\" />\n            {t('ui.perspectives.title', 'Views')}\n          </Button>\n        </div>\n        <div className=\"flex-1 overflow-auto\">\n          {/* Saved views as chips */}\n          <section className=\"p-4 space-y-3\">\n            <h3 className=\"text-xs font-medium uppercase tracking-wide text-muted-foreground\">{t('ui.perspectives.savedViews.title', 'Saved views')}</h3>\n            {loading ? <Spinner size=\"sm\" /> : null}\n            <div className=\"flex flex-wrap gap-1.5\">\n              {/* + New chip */}\n              <Button\n                type=\"button\"\n                variant={isNew ? 'secondary' : 'outline'}\n                size=\"sm\"\n                className={`h-8 px-3 py-1.5 text-sm ${!isNew ? 'border-dashed' : ''}`}\n                onClick={startNewMode}\n              >\n                <Plus className=\"size-3 mr-1\" />\n                {t('ui.perspectives.savedViews.new', 'New')}\n              </Button>\n              {(perspectives ?? emptyArray).map((p) => {\n                const isActive = activePerspectiveId === p.id\n                const deleting = deletingIds.includes(p.id)\n                const isShared = sharedIds.has(p.id)\n                return (\n                  <ViewChip\n                    key={p.id}\n                    id={p.id}\n                    label={perspectiveLabel(p)}\n                    kind=\"personal\"\n                    isActive={isActive}\n                    disabled={deleting}\n                    isShared={isShared}\n                    isRenaming={renamingId === p.id}\n                    renameValue={renameValue}\n                    canApplyToRoles={canApplyToRoles}\n                    deleting={deleting}\n                    onActivate={() => { onActivatePerspective(p, 'personal'); resetMode() }}\n                    onRenameValueChange={setRenameValue}\n                    onRenameConfirm={() => void handleRename(p)}\n                    onRenameCancel={() => setRenamingId(null)}\n                    onRenameStart={() => { setRenamingId(p.id); setRenameValue(p.name) }}\n                    onClone={() => void handleClone(p)}\n                    onShareStart={() => startShareMode(p)}\n                    onDelete={() => void handleDelete(p)}\n                  />\n                )\n              })}\n              {rolePerspectives\n                .filter((rp) => {\n                  const rpName = rp.name.trim()\n                  return !perspectives.some((pp) => pp.name.trim() === rpName)\n                })\n                .map((p) => {\n                const isActive = activePerspectiveId === p.id\n                const clearing = roleClearingIds.includes(p.roleId)\n                return (\n                  <ViewChip\n                    key={p.id}\n                    id={p.id}\n                    label={perspectiveLabel(p)}\n                    kind=\"role\"\n                    isActive={isActive}\n                    disabled={clearing}\n                    isShared={false}\n                    isRenaming={renamingId === p.id}\n                    renameValue={renameValue}\n                    canApplyToRoles={canApplyToRoles}\n                    deleting={clearing}\n                    onActivate={() => { onActivatePerspective(p, 'role'); resetMode() }}\n                    onRenameValueChange={setRenameValue}\n                    onRenameConfirm={() => void handleRename(p)}\n                    onRenameCancel={() => setRenamingId(null)}\n                    onClone={() => void handleClone(p)}\n                    onDelete={() => void handleDeleteRole(p)}\n                  />\n                )\n              })}\n            </div>\n\n            {/* Inline form slot \u2014 shared between New and Share modes */}\n            {isNew ? (\n              <NewViewForm\n                name={name}\n                onNameChange={setName}\n                onSubmit={() => void handleSaveNew()}\n                onCancel={resetMode}\n                saving={saving}\n              />\n            ) : null}\n\n            {isShare ? (\n              <ShareForm\n                roles={roles}\n                shareRoles={shareRoles}\n                shareSetDefault={shareSetDefault}\n                onToggleRole={toggleShareRole}\n                onToggleSetDefault={setShareSetDefault}\n                onApply={() => void handleShareApply()}\n                onCancel={resetMode}\n              />\n            ) : null}\n\n            {apiWarning ? (\n              <Alert variant=\"warning\" className=\"text-xs\">{apiWarning}</Alert>\n            ) : null}\n            {error ? <div className=\"text-sm text-status-error-text\">{error}</div> : null}\n          </section>\n\n          {/* Set as default \u2014 separated from chips (border-t) and from columns (ColumnList owns border-t) */}\n          <div className=\"flex items-center px-4 mt-2 pt-2 pb-2\">\n            <label className=\"inline-flex items-center gap-2 text-sm leading-none\">\n              <Checkbox\n                checked={isDefault}\n                onCheckedChange={(checked) => {\n                  setIsDefault(checked === true)\n                  if (isDefaultUserChangeRef.current) {\n                    scheduleAutosave()\n                  }\n                }}\n              />\n              {t('ui.perspectives.form.makeDefault', 'Set as default')}\n            </label>\n          </div>\n\n          <ColumnChooserSection\n            availableColumns={availableColumns}\n            visibleColumnKeys={visibleColumnKeys}\n            columnOrder={columnOrder}\n            onToggleColumn={handleToggleColumnWithAutosave}\n            onReorderColumns={handleReorderColumnsWithAutosave}\n            dndContextId=\"perspective-columns\"\n          />\n        </div>\n      </div>\n      {ConfirmDialogElement}\n    </div>\n  )\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["\"use client\"\nimport * as React from 'react'\nimport { ArrowLeft, Plus } from 'lucide-react'\nimport { Alert } from '../primitives/alert'\nimport { Button } from '../primitives/button'\nimport { Checkbox } from '../primitives/checkbox'\nimport { Spinner } from '../primitives/spinner'\nimport { useConfirmDialog } from './confirm-dialog'\nimport { flash } from './FlashMessages'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport type {\n  PerspectiveDto,\n  PerspectiveSettings,\n  RolePerspectiveDto,\n} from '@open-mercato/shared/modules/perspectives/types'\nimport { ViewChip } from './views/ViewChip'\nimport { NewViewForm } from './views/NewViewForm'\nimport { ShareForm } from './views/ShareForm'\nimport { type SidebarMode } from './views/types'\nimport { ColumnChooserSection, type ColumnChooserField } from './columns/ColumnChooserPanel'\n\nexport type { ColumnChooserField } from './columns/ColumnChooserPanel'\n\nexport type PerspectiveSidebarProps = {\n  open: boolean\n  onOpenChange: (open: boolean) => void\n  loading: boolean\n  perspectives: PerspectiveDto[]\n  rolePerspectives: RolePerspectiveDto[]\n  roles: Array<{ id: string; name: string; hasPerspective: boolean; hasDefault: boolean }>\n  activePerspectiveId: string | null\n  onActivatePerspective: (perspective: PerspectiveDto | RolePerspectiveDto, source: 'personal' | 'role') => void\n  onDeletePerspective: (perspectiveId: string) => Promise<void>\n  onClearRole: (roleId: string) => Promise<void>\n  onSave: (input: { name: string; isDefault: boolean; applyToRoles: string[]; setRoleDefault: boolean; perspectiveId?: string | null; settings?: PerspectiveSettings }) => Promise<void>\n  canApplyToRoles: boolean\n  availableColumns: ColumnChooserField[]\n  visibleColumnKeys: string[]\n  columnOrder: string[]\n  onToggleColumn: (key: string) => void\n  onReorderColumns: (orderedIds: string[]) => void\n  saving: boolean\n  deletingIds: string[]\n  roleClearingIds: string[]\n  apiWarning?: string | null\n}\n\nconst emptyArray: any[] = []\n\nexport function PerspectiveSidebar({\n  open,\n  onOpenChange,\n  loading,\n  perspectives,\n  rolePerspectives,\n  roles,\n  activePerspectiveId,\n  onActivatePerspective,\n  onDeletePerspective,\n  onClearRole,\n  onSave,\n  canApplyToRoles,\n  availableColumns,\n  visibleColumnKeys,\n  columnOrder,\n  onToggleColumn,\n  onReorderColumns,\n  saving,\n  deletingIds,\n  roleClearingIds,\n  apiWarning,\n}: PerspectiveSidebarProps) {\n  const t = useT()\n  const { confirm, ConfirmDialogElement } = useConfirmDialog()\n\n  React.useEffect(() => {\n    if (!open) return\n    if (typeof document === 'undefined') return\n    document.body.dataset.columnChooserOpen = 'true'\n    return () => {\n      delete document.body.dataset.columnChooserOpen\n    }\n  }, [open])\n\n  function perspectiveLabel(p: PerspectiveDto | RolePerspectiveDto) {\n    return p.name.trim().length ? p.name : t('ui.perspectives.untitled', 'Untitled view')\n  }\n\n  const [name, setName] = React.useState('')\n  const [isDefault, setIsDefault] = React.useState(false)\n  const [error, setError] = React.useState<string | null>(null)\n  const [mode, setMode] = React.useState<SidebarMode>({ type: 'idle' })\n  const [renamingId, setRenamingId] = React.useState<string | null>(null)\n  const [renameValue, setRenameValue] = React.useState('')\n  const [shareRoles, setShareRoles] = React.useState<string[]>([])\n  const [shareSetDefault, setShareSetDefault] = React.useState(false)\n  const [sharedIds, setSharedIds] = React.useState<Set<string>>(new Set())\n  const [pendingCloneBaselineIds, setPendingCloneBaselineIds] = React.useState<Set<string> | null>(null)\n\n  const autosaveRef = React.useRef<ReturnType<typeof setTimeout> | null>(null)\n  const isDefaultUserChangeRef = React.useRef(false)\n  const isDefaultRef = React.useRef(isDefault)\n  isDefaultRef.current = isDefault\n\n  const onSaveRef = React.useRef(onSave)\n  onSaveRef.current = onSave\n\n  const perspectivesRef = React.useRef(perspectives)\n  perspectivesRef.current = perspectives\n\n  const flushAutosave = React.useCallback(() => {\n    if (autosaveRef.current) {\n      clearTimeout(autosaveRef.current)\n      autosaveRef.current = null\n    }\n  }, [])\n\n  const scheduleAutosave = React.useCallback(() => {\n    if (!activePerspectiveId || mode.type === 'new') return\n    const activePersonal = perspectivesRef.current.find((p) => p.id === activePerspectiveId)\n    if (!activePersonal) return\n    flushAutosave()\n    const targetId = activePersonal.id\n    const targetName = activePersonal.name\n    autosaveRef.current = setTimeout(async () => {\n      autosaveRef.current = null\n      try {\n        await onSaveRef.current({\n          name: targetName,\n          isDefault: isDefaultRef.current,\n          applyToRoles: [],\n          setRoleDefault: false,\n          perspectiveId: targetId,\n        })\n        flash(t('ui.perspectives.autosave.success', 'View saved'), 'success')\n      } catch {\n        flash(t('ui.perspectives.autosave.error', 'Failed to save view'), 'error')\n      }\n    }, 400)\n  }, [activePerspectiveId, mode.type, flushAutosave, t])\n\n  React.useEffect(() => {\n    return () => { flushAutosave() }\n  }, [flushAutosave])\n\n  const resetMode = () => {\n    setMode({ type: 'idle' })\n    setName('')\n    setShareRoles([])\n    setShareSetDefault(false)\n  }\n\n  const startNewMode = () => {\n    setMode({ type: 'new' })\n    setName('')\n    setIsDefault(false)\n    setRenamingId(null)\n    setShareRoles([])\n    setShareSetDefault(false)\n  }\n\n  const startShareMode = (p: PerspectiveDto) => {\n    setMode({ type: 'share', perspectiveId: p.id, perspectiveName: p.name, perspectiveIsDefault: p.isDefault })\n    setName('')\n    setRenamingId(null)\n    setShareRoles([])\n    setShareSetDefault(false)\n  }\n\n  React.useEffect(() => {\n    if (!open) {\n      flushAutosave()\n      setError(null)\n      resetMode()\n      setRenamingId(null)\n      setSharedIds(new Set())\n      setPendingCloneBaselineIds(null)\n    }\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [open])\n\n  React.useEffect(() => {\n    if (!open) return\n    const active = perspectives.find((p) => p.id === activePerspectiveId)\n      ?? rolePerspectives.find((p) => p.id === activePerspectiveId)\n    isDefaultUserChangeRef.current = false\n    if (active) {\n      setIsDefault(active.isDefault)\n    } else {\n      setIsDefault(false)\n    }\n    requestAnimationFrame(() => { isDefaultUserChangeRef.current = true })\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [open, activePerspectiveId])\n\n  const handleSaveNew = async () => {\n    setError(null)\n    try {\n      await onSave({ name: name.trim(), isDefault, applyToRoles: [], setRoleDefault: false, perspectiveId: null })\n      resetMode()\n    } catch (err: unknown) {\n      setError(err instanceof Error ? err.message : 'Failed to save view')\n    }\n  }\n\n  const handleToggleColumnWithAutosave = React.useCallback((key: string) => {\n    onToggleColumn(key)\n    scheduleAutosave()\n  }, [onToggleColumn, scheduleAutosave])\n\n  const handleReorderColumnsWithAutosave = React.useCallback((orderedIds: string[]) => {\n    onReorderColumns(orderedIds)\n    scheduleAutosave()\n  }, [onReorderColumns, scheduleAutosave])\n\n  const handleRename = async (p: PerspectiveDto | RolePerspectiveDto) => {\n    const trimmed = renameValue.trim()\n    if (!trimmed) {\n      setRenamingId(null)\n      return\n    }\n    const conflict = perspectivesRef.current.some(\n      (item) => item.id !== p.id && item.name.trim() === trimmed,\n    )\n    if (conflict) {\n      flash(t('ui.perspectives.error.nameExists', 'View with this name already exists'), 'error')\n      return\n    }\n    setError(null)\n    try {\n      await onSave({\n        name: trimmed,\n        isDefault: p.isDefault,\n        applyToRoles: [],\n        setRoleDefault: false,\n        perspectiveId: p.id,\n      })\n      setRenamingId(null)\n    } catch (err: unknown) {\n      setError(err instanceof Error ? err.message : 'Failed to rename view')\n    }\n  }\n\n  const handleClone = async (p: PerspectiveDto | RolePerspectiveDto) => {\n    const originalName = perspectiveLabel(p)\n    setError(null)\n    const baseline = new Set(perspectivesRef.current.map((item) => item.id))\n    const originalSettingsKey = JSON.stringify(p.settings ?? {})\n    const sharedRoleIds = Array.from(\n      new Set(\n        rolePerspectives\n          .filter((rp) => JSON.stringify(rp.settings ?? {}) === originalSettingsKey)\n          .map((rp) => rp.roleId),\n      ),\n    )\n    const buildCloneName = (n: number) =>\n      n <= 1 ? `${originalName} (copy)` : `${originalName} (copy ${n})`\n    const existingNames = new Set(\n      perspectivesRef.current.map((item) => item.name.trim()),\n    )\n    let counter = 1\n    while (existingNames.has(buildCloneName(counter))) {\n      counter += 1\n    }\n    const clonedSettings = structuredClone(p.settings)\n    const MAX_ATTEMPTS = 50\n    let lastErr: unknown = null\n    for (let attempt = 0; attempt < MAX_ATTEMPTS; attempt += 1) {\n      try {\n        await onSave({\n          name: buildCloneName(counter),\n          isDefault: false,\n          applyToRoles: sharedRoleIds,\n          setRoleDefault: false,\n          perspectiveId: null,\n          settings: clonedSettings,\n        })\n        setPendingCloneBaselineIds(baseline)\n        return\n      } catch (err: unknown) {\n        const errMessage = err instanceof Error ? err.message : ''\n        const msg = errMessage.toLowerCase()\n        const isDuplicate = msg.includes('duplicate key') || msg.includes('unique constraint')\n        if (!isDuplicate) {\n          setError(errMessage || 'Failed to clone view')\n          return\n        }\n        lastErr = err\n        counter += 1\n      }\n    }\n    setError(lastErr instanceof Error ? lastErr.message : 'Failed to clone view')\n  }\n\n  React.useEffect(() => {\n    if (!pendingCloneBaselineIds) return\n    const created = perspectives.find((item) => !pendingCloneBaselineIds.has(item.id))\n    if (!created) return\n    setRenamingId(created.id)\n    setRenameValue(created.name)\n    setPendingCloneBaselineIds(null)\n  }, [perspectives, pendingCloneBaselineIds])\n\n  const handleDelete = async (p: PerspectiveDto) => {\n    const confirmed = await confirm({\n      title: t('ui.perspectives.delete.title', 'Delete \"{name}\"?', { name: perspectiveLabel(p) }),\n      text: t('ui.perspectives.delete.text', 'This view will be removed for you and all shared roles. This cannot be undone.'),\n      confirmText: t('common.delete', 'Delete'),\n      variant: 'destructive',\n    })\n    if (confirmed) {\n      await onDeletePerspective(p.id)\n    }\n  }\n\n  const handleDeleteRole = async (p: RolePerspectiveDto) => {\n    const confirmed = await confirm({\n      title: t('ui.perspectives.delete.title', 'Delete \"{name}\"?', { name: perspectiveLabel(p) }),\n      text: t('ui.perspectives.deleteRole.text', 'This shared view will be removed for the role. This cannot be undone.'),\n      confirmText: t('common.delete', 'Delete'),\n      variant: 'destructive',\n    })\n    if (confirmed) {\n      await onClearRole(p.roleId)\n    }\n  }\n\n  const handleShareApply = async () => {\n    if (mode.type !== 'share') return\n    setError(null)\n    try {\n      await onSave({ name: mode.perspectiveName, isDefault: mode.perspectiveIsDefault, applyToRoles: shareRoles, setRoleDefault: shareSetDefault, perspectiveId: mode.perspectiveId })\n      setSharedIds((prev) => new Set([...prev, mode.perspectiveId]))\n      resetMode()\n    } catch (err: unknown) {\n      setError(err instanceof Error ? err.message : 'Failed to share view')\n    }\n  }\n\n  const toggleShareRole = (roleId: string) => {\n    setShareRoles((prev) => {\n      const next = new Set(prev)\n      if (next.has(roleId)) next.delete(roleId)\n      else next.add(roleId)\n      return Array.from(next)\n    })\n  }\n\n  if (!open) return null\n\n  const isNew = mode.type === 'new'\n  const isShare = mode.type === 'share'\n\n  return (\n    <div className=\"fixed inset-0 z-modal\">\n      <div className=\"absolute inset-0 bg-black/20\" onClick={() => onOpenChange(false)} role=\"presentation\" />\n      <div className=\"fixed right-0 top-0 h-full w-full sm:w-80 bg-background shadow-xl border-l flex flex-col\">\n        <div className=\"flex items-center p-4 border-b\">\n          <Button\n            type=\"button\"\n            variant=\"ghost\"\n            size=\"sm\"\n            onClick={() => onOpenChange(false)}\n            className=\"h-auto -ml-2 gap-2 px-2 text-lg font-semibold hover:bg-transparent\"\n            aria-label={t('ui.perspectives.close', 'Close')}\n          >\n            <ArrowLeft className=\"size-5\" />\n            {t('ui.perspectives.title', 'Views')}\n          </Button>\n        </div>\n        <div className=\"flex-1 overflow-auto\">\n          {/* Saved views as chips */}\n          <section className=\"p-4 space-y-3\">\n            <h3 className=\"text-xs font-medium uppercase tracking-wide text-muted-foreground\">{t('ui.perspectives.savedViews.title', 'Saved views')}</h3>\n            {loading ? <Spinner size=\"sm\" /> : null}\n            <div className=\"flex flex-wrap gap-1.5\">\n              {/* + New chip */}\n              <Button\n                type=\"button\"\n                variant={isNew ? 'secondary' : 'outline'}\n                size=\"sm\"\n                className={`h-8 px-3 py-1.5 text-sm ${!isNew ? 'border-dashed' : ''}`}\n                onClick={startNewMode}\n              >\n                <Plus className=\"size-3 mr-1\" />\n                {t('ui.perspectives.savedViews.new', 'New')}\n              </Button>\n              {(perspectives ?? emptyArray).map((p) => {\n                const isActive = activePerspectiveId === p.id\n                const deleting = deletingIds.includes(p.id)\n                const isShared = sharedIds.has(p.id)\n                return (\n                  <ViewChip\n                    key={p.id}\n                    id={p.id}\n                    label={perspectiveLabel(p)}\n                    kind=\"personal\"\n                    isActive={isActive}\n                    disabled={deleting}\n                    isShared={isShared}\n                    isRenaming={renamingId === p.id}\n                    renameValue={renameValue}\n                    canApplyToRoles={canApplyToRoles}\n                    deleting={deleting}\n                    onActivate={() => { onActivatePerspective(p, 'personal'); resetMode() }}\n                    onRenameValueChange={setRenameValue}\n                    onRenameConfirm={() => void handleRename(p)}\n                    onRenameCancel={() => setRenamingId(null)}\n                    onRenameStart={() => { setRenamingId(p.id); setRenameValue(p.name) }}\n                    onClone={() => void handleClone(p)}\n                    onShareStart={() => startShareMode(p)}\n                    onDelete={() => void handleDelete(p)}\n                  />\n                )\n              })}\n              {rolePerspectives\n                .filter((rp) => {\n                  const rpName = rp.name.trim()\n                  return !perspectives.some((pp) => pp.name.trim() === rpName)\n                })\n                .map((p) => {\n                const isActive = activePerspectiveId === p.id\n                const clearing = roleClearingIds.includes(p.roleId)\n                return (\n                  <ViewChip\n                    key={p.id}\n                    id={p.id}\n                    label={perspectiveLabel(p)}\n                    kind=\"role\"\n                    isActive={isActive}\n                    disabled={clearing}\n                    isShared={false}\n                    isRenaming={renamingId === p.id}\n                    renameValue={renameValue}\n                    canApplyToRoles={canApplyToRoles}\n                    deleting={clearing}\n                    onActivate={() => { onActivatePerspective(p, 'role'); resetMode() }}\n                    onRenameValueChange={setRenameValue}\n                    onRenameConfirm={() => void handleRename(p)}\n                    onRenameCancel={() => setRenamingId(null)}\n                    onClone={() => void handleClone(p)}\n                    onDelete={() => void handleDeleteRole(p)}\n                  />\n                )\n              })}\n            </div>\n\n            {/* Inline form slot \u2014 shared between New and Share modes */}\n            {isNew ? (\n              <NewViewForm\n                name={name}\n                onNameChange={setName}\n                onSubmit={() => void handleSaveNew()}\n                onCancel={resetMode}\n                saving={saving}\n              />\n            ) : null}\n\n            {isShare ? (\n              <ShareForm\n                roles={roles}\n                shareRoles={shareRoles}\n                shareSetDefault={shareSetDefault}\n                onToggleRole={toggleShareRole}\n                onToggleSetDefault={setShareSetDefault}\n                onApply={() => void handleShareApply()}\n                onCancel={resetMode}\n              />\n            ) : null}\n\n            {apiWarning ? (\n              <Alert variant=\"warning\" className=\"text-xs\">{apiWarning}</Alert>\n            ) : null}\n            {error ? <div className=\"text-sm text-status-error-text\">{error}</div> : null}\n          </section>\n\n          {/* Set as default \u2014 separated from chips (border-t) and from columns (ColumnList owns border-t) */}\n          <div className=\"flex items-center px-4 mt-2 pt-2 pb-2\">\n            <label className=\"inline-flex items-center gap-2 text-sm leading-none\">\n              <Checkbox\n                checked={isDefault}\n                onCheckedChange={(checked) => {\n                  setIsDefault(checked === true)\n                  if (isDefaultUserChangeRef.current) {\n                    scheduleAutosave()\n                  }\n                }}\n              />\n              {t('ui.perspectives.form.makeDefault', 'Set as default')}\n            </label>\n          </div>\n\n          <ColumnChooserSection\n            availableColumns={availableColumns}\n            visibleColumnKeys={visibleColumnKeys}\n            columnOrder={columnOrder}\n            onToggleColumn={handleToggleColumnWithAutosave}\n            onReorderColumns={handleReorderColumnsWithAutosave}\n            dndContextId=\"perspective-columns\"\n          />\n        </div>\n      </div>\n      {ConfirmDialogElement}\n    </div>\n  )\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/backend/ProfileDropdown.js

@@ -295,7 +295,7 @@ function ProfileDropdown({
       "div",
       {
         ref: menuRef,
-        className: "absolute right-0 top-full mt-1 w-56 rounded-md border bg-background p-1 shadow-lg z-50",
+        className: "absolute right-0 top-full mt-1 w-56 rounded-md border bg-background p-1 shadow-lg z-dropdown",
         role: "menu",
         "data-testid": "profile-dropdown",
         children: [

package/dist/backend/ProfileDropdown.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/backend/ProfileDropdown.tsx"],
-  "sourcesContent": ["'use client'\nimport * as React from 'react'\nimport Link from 'next/link'\nimport { User, LogOut, Bell, Moon, Sun, Globe, Key, Check } from 'lucide-react'\nimport { useT, useLocale } from '@open-mercato/shared/lib/i18n/context'\nimport { locales, type Locale } from '@open-mercato/shared/lib/i18n/config'\nimport { useTheme } from '@open-mercato/ui/theme'\nimport { Button } from '../primitives/button'\nimport { IconButton } from '../primitives/icon-button'\nimport { useInjectedMenuItems } from './injection/useInjectedMenuItems'\nimport { mergeMenuItems, type MergedMenuItem } from './injection/mergeMenuItems'\nimport { resolveInjectedIcon } from './injection/resolveInjectedIcon'\nimport { InjectionSpot } from './injection/InjectionSpot'\nimport { BACKEND_TOPBAR_PROFILE_MENU_INJECTION_SPOT_ID } from './injection/spotIds'\n\nexport type ProfileDropdownProps = {\n  email?: string\n  displayName?: string\n  changePasswordHref?: string\n  notificationsHref?: string\n}\n\nconst localeLabels: Record<Locale, string> = {\n  en: 'English',\n  de: 'Deutsch',\n  es: 'Espa\u00F1ol',\n  pl: 'Polski',\n}\n\nexport function ProfileDropdown({\n  email,\n  displayName,\n  changePasswordHref = '/backend/profile/change-password',\n  notificationsHref,\n}: ProfileDropdownProps) {\n  const t = useT()\n  const currentLocale = useLocale()\n  const { resolvedTheme, setTheme } = useTheme()\n  const [open, setOpen] = React.useState(false)\n  const [languageOpen, setLanguageOpen] = React.useState(false)\n  const [mounted, setMounted] = React.useState(false)\n  const buttonRef = React.useRef<HTMLButtonElement>(null)\n  const menuRef = React.useRef<HTMLDivElement>(null)\n  const { items: injectedItems } = useInjectedMenuItems('menu:topbar:profile-dropdown')\n\n  React.useEffect(() => {\n    setMounted(true)\n  }, [])\n\n  const isDark = resolvedTheme === 'dark'\n\n  // Close on click outside\n  React.useEffect(() => {\n    if (!open) return\n    function handleClick(event: MouseEvent) {\n      if (\n        menuRef.current &&\n        !menuRef.current.contains(event.target as Node) &&\n        buttonRef.current &&\n        !buttonRef.current.contains(event.target as Node)\n      ) {\n        setOpen(false)\n        setLanguageOpen(false)\n      }\n    }\n    document.addEventListener('mousedown', handleClick)\n    return () => document.removeEventListener('mousedown', handleClick)\n  }, [open])\n\n  // Close on Escape\n  React.useEffect(() => {\n    if (!open) return\n    function handleKeyDown(event: KeyboardEvent) {\n      if (event.key === 'Escape') {\n        if (languageOpen) {\n          setLanguageOpen(false)\n        } else {\n          setOpen(false)\n          buttonRef.current?.focus()\n        }\n      }\n    }\n    document.addEventListener('keydown', handleKeyDown)\n    return () => document.removeEventListener('keydown', handleKeyDown)\n  }, [open, languageOpen])\n\n  const handleThemeToggle = () => {\n    setTheme(isDark ? 'light' : 'dark')\n  }\n\n  const handleLocaleChange = async (locale: Locale) => {\n    try {\n      await fetch('/api/auth/locale', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ locale }),\n      })\n      window.location.reload()\n    } catch {}\n  }\n\n  const menuItemClass =\n    'w-full text-left text-sm cursor-pointer px-3 py-2 rounded hover:bg-accent inline-flex items-center gap-2.5 outline-none focus-visible:ring-1 focus-visible:ring-ring'\n\n  const resolveMenuLabel = React.useCallback(\n    (item: Pick<MergedMenuItem, 'id' | 'label' | 'labelKey'>): string => {\n      if (item.labelKey && item.label) return t(item.labelKey, item.label)\n      if (item.labelKey) return t(item.labelKey, item.id)\n      if (item.label && item.label.includes('.')) return t(item.label, item.id)\n      return item.label ?? item.id\n    },\n    [t],\n  )\n\n  const builtInMenuItems = React.useMemo(\n    () => {\n      const items: Array<{ id: string; separator?: boolean }> = [{ id: 'change-password' }]\n      if (notificationsHref) items.push({ id: 'notifications' })\n      items.push({ id: 'theme-toggle', separator: true }, { id: 'language' }, { id: 'sign-out', separator: true })\n      return items\n    },\n    [notificationsHref],\n  )\n\n  const mergedMenuItems = React.useMemo(\n    () => mergeMenuItems(builtInMenuItems, injectedItems),\n    [builtInMenuItems, injectedItems],\n  )\n  const injectionContext = React.useMemo(\n    () => ({\n      email,\n      displayName,\n      locale: currentLocale,\n    }),\n    [currentLocale, displayName, email],\n  )\n\n  const renderInjectedItem = React.useCallback(\n    (item: MergedMenuItem) => {\n      const label = resolveMenuLabel(item)\n      const icon = resolveInjectedIcon(item.icon)\n      if (item.href) {\n        return (\n          <Link\n            key={item.id}\n            href={item.href}\n            className={menuItemClass}\n            role=\"menuitem\"\n            data-menu-item-id={item.id}\n            onClick={() => setOpen(false)}\n          >\n            {icon}\n            <span>{label}</span>\n          </Link>\n        )\n      }\n      return (\n        <Button\n          key={item.id}\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"sm\"\n          className=\"w-full justify-start\"\n          role=\"menuitem\"\n          data-menu-item-id={item.id}\n          onClick={() => {\n            item.onClick?.()\n            setOpen(false)\n          }}\n        >\n          {icon}\n          <span>{label}</span>\n        </Button>\n      )\n    },\n    [menuItemClass, resolveMenuLabel],\n  )\n\n  const renderBuiltInItem = React.useCallback(\n    (id: string) => {\n      if (id === 'change-password') {\n        return (\n          <Link\n            key={id}\n            href={changePasswordHref}\n            className={menuItemClass}\n            role=\"menuitem\"\n            onClick={() => setOpen(false)}\n          >\n            <Key className=\"size-4\" />\n            <span>{t('ui.profileMenu.changePassword', 'Change Password')}</span>\n          </Link>\n        )\n      }\n\n      if (id === 'notifications' && notificationsHref) {\n        return (\n          <Link\n            key={id}\n            href={notificationsHref}\n            className={menuItemClass}\n            role=\"menuitem\"\n            onClick={() => setOpen(false)}\n          >\n            <Bell className=\"size-4\" />\n            <span>{t('ui.profileMenu.notifications', 'Notification Preferences')}</span>\n          </Link>\n        )\n      }\n\n      if (id === 'theme-toggle') {\n        return mounted ? (\n          <Button\n            key={id}\n            type=\"button\"\n            variant=\"ghost\"\n            size=\"sm\"\n            className=\"w-full justify-between\"\n            role=\"menuitem\"\n            onClick={handleThemeToggle}\n          >\n            <span className=\"inline-flex items-center gap-2.5\">\n              {isDark ? <Moon className=\"size-4\" /> : <Sun className=\"size-4\" />}\n              <span>{t('ui.profileMenu.theme', 'Dark Mode')}</span>\n            </span>\n            <div className={`w-8 h-4 rounded-full transition-colors ${isDark ? 'bg-primary' : 'bg-muted'} relative`}>\n              <div className={`absolute top-0.5 w-3 h-3 rounded-full bg-background shadow transition-transform ${isDark ? 'translate-x-4' : 'translate-x-0.5'}`} />\n            </div>\n          </Button>\n        ) : null\n      }\n\n      if (id === 'language') {\n        return (\n          <div key={id} className=\"relative\">\n            <Button\n              type=\"button\"\n              variant=\"ghost\"\n              size=\"sm\"\n              className=\"w-full justify-between\"\n              role=\"menuitem\"\n              onClick={() => setLanguageOpen(!languageOpen)}\n              aria-expanded={languageOpen}\n            >\n              <span className=\"inline-flex items-center gap-2.5\">\n                <Globe className=\"size-4\" />\n                <span>{t('ui.profileMenu.language', 'Language')}</span>\n              </span>\n              <span className=\"text-xs text-muted-foreground\">\n                {localeLabels[currentLocale]}\n              </span>\n            </Button>\n            {languageOpen && (\n              <div className=\"mt-1 ml-6 space-y-0.5 border-l pl-2\">\n                {locales.map((locale) => (\n                  <Button\n                    key={locale}\n                    type=\"button\"\n                    variant=\"ghost\"\n                    size=\"sm\"\n                    className={`w-full justify-start gap-2 ${locale === currentLocale ? 'text-primary font-medium' : ''}`}\n                    onClick={() => handleLocaleChange(locale)}\n                  >\n                    <span>{localeLabels[locale]}</span>\n                    {locale === currentLocale && <Check className=\"size-3.5\" />}\n                  </Button>\n                ))}\n              </div>\n            )}\n          </div>\n        )\n      }\n\n      if (id === 'sign-out') {\n        return (\n          <form key={id} action=\"/api/auth/logout\" method=\"POST\">\n            <Button\n              variant=\"ghost\"\n              size=\"sm\"\n              className=\"w-full justify-start\"\n              type=\"submit\"\n              role=\"menuitem\"\n            >\n              <LogOut className=\"size-4\" />\n              <span>{t('ui.userMenu.logout', 'Sign Out')}</span>\n            </Button>\n          </form>\n        )\n      }\n\n      return null\n    },\n    [\n      changePasswordHref,\n      currentLocale,\n      handleThemeToggle,\n      isDark,\n      languageOpen,\n      menuItemClass,\n      mounted,\n      notificationsHref,\n      t,\n    ],\n  )\n\n  return (\n    <div className=\"relative\">\n      <IconButton\n        ref={buttonRef}\n        variant=\"ghost\"\n        size=\"sm\"\n        onClick={() => setOpen(!open)}\n        aria-expanded={open}\n        aria-haspopup=\"menu\"\n        data-testid=\"profile-dropdown-trigger\"\n        title={email || t('ui.userMenu.userFallback', 'User')}\n      >\n        <User className=\"size-4\" />\n      </IconButton>\n\n      {open && (\n        <div\n          ref={menuRef}\n          className=\"absolute right-0 top-full mt-1 w-56 rounded-md border bg-background p-1 shadow-lg z-50\"\n          role=\"menu\"\n          data-testid=\"profile-dropdown\"\n        >\n          {/* User info header */}\n          {(displayName || email) && (\n            <div className=\"px-3 py-2.5 border-b mb-1\">\n              {displayName && (\n                <div className=\"font-medium text-sm flex items-center gap-2\">\n                  <User className=\"size-4\" />\n                  {displayName}\n                </div>\n              )}\n              {displayName && email && (\n                <div className=\"text-xs text-muted-foreground mt-0.5 ml-6\">{email}</div>\n              )}\n              {!displayName && email && (\n                <div className=\"text-xs text-muted-foreground\">\n                  {t('ui.userMenu.loggedInAs', 'Logged in as:')} {email}\n                </div>\n              )}\n            </div>\n          )}\n\n          {mergedMenuItems.map((item) => (\n            <React.Fragment key={item.id}>\n              {item.separator ? <div className=\"my-1 border-t\" /> : null}\n              {item.source === 'injected'\n                ? (item.href || item.onClick || item.label || item.labelKey ? renderInjectedItem(item) : null)\n                : renderBuiltInItem(item.id)}\n            </React.Fragment>\n          ))}\n          <InjectionSpot\n            spotId={BACKEND_TOPBAR_PROFILE_MENU_INJECTION_SPOT_ID}\n            context={injectionContext}\n          />\n        </div>\n      )}\n    </div>\n  )\n}\n"],
+  "sourcesContent": ["'use client'\nimport * as React from 'react'\nimport Link from 'next/link'\nimport { User, LogOut, Bell, Moon, Sun, Globe, Key, Check } from 'lucide-react'\nimport { useT, useLocale } from '@open-mercato/shared/lib/i18n/context'\nimport { locales, type Locale } from '@open-mercato/shared/lib/i18n/config'\nimport { useTheme } from '@open-mercato/ui/theme'\nimport { Button } from '../primitives/button'\nimport { IconButton } from '../primitives/icon-button'\nimport { useInjectedMenuItems } from './injection/useInjectedMenuItems'\nimport { mergeMenuItems, type MergedMenuItem } from './injection/mergeMenuItems'\nimport { resolveInjectedIcon } from './injection/resolveInjectedIcon'\nimport { InjectionSpot } from './injection/InjectionSpot'\nimport { BACKEND_TOPBAR_PROFILE_MENU_INJECTION_SPOT_ID } from './injection/spotIds'\n\nexport type ProfileDropdownProps = {\n  email?: string\n  displayName?: string\n  changePasswordHref?: string\n  notificationsHref?: string\n}\n\nconst localeLabels: Record<Locale, string> = {\n  en: 'English',\n  de: 'Deutsch',\n  es: 'Espa\u00F1ol',\n  pl: 'Polski',\n}\n\nexport function ProfileDropdown({\n  email,\n  displayName,\n  changePasswordHref = '/backend/profile/change-password',\n  notificationsHref,\n}: ProfileDropdownProps) {\n  const t = useT()\n  const currentLocale = useLocale()\n  const { resolvedTheme, setTheme } = useTheme()\n  const [open, setOpen] = React.useState(false)\n  const [languageOpen, setLanguageOpen] = React.useState(false)\n  const [mounted, setMounted] = React.useState(false)\n  const buttonRef = React.useRef<HTMLButtonElement>(null)\n  const menuRef = React.useRef<HTMLDivElement>(null)\n  const { items: injectedItems } = useInjectedMenuItems('menu:topbar:profile-dropdown')\n\n  React.useEffect(() => {\n    setMounted(true)\n  }, [])\n\n  const isDark = resolvedTheme === 'dark'\n\n  // Close on click outside\n  React.useEffect(() => {\n    if (!open) return\n    function handleClick(event: MouseEvent) {\n      if (\n        menuRef.current &&\n        !menuRef.current.contains(event.target as Node) &&\n        buttonRef.current &&\n        !buttonRef.current.contains(event.target as Node)\n      ) {\n        setOpen(false)\n        setLanguageOpen(false)\n      }\n    }\n    document.addEventListener('mousedown', handleClick)\n    return () => document.removeEventListener('mousedown', handleClick)\n  }, [open])\n\n  // Close on Escape\n  React.useEffect(() => {\n    if (!open) return\n    function handleKeyDown(event: KeyboardEvent) {\n      if (event.key === 'Escape') {\n        if (languageOpen) {\n          setLanguageOpen(false)\n        } else {\n          setOpen(false)\n          buttonRef.current?.focus()\n        }\n      }\n    }\n    document.addEventListener('keydown', handleKeyDown)\n    return () => document.removeEventListener('keydown', handleKeyDown)\n  }, [open, languageOpen])\n\n  const handleThemeToggle = () => {\n    setTheme(isDark ? 'light' : 'dark')\n  }\n\n  const handleLocaleChange = async (locale: Locale) => {\n    try {\n      await fetch('/api/auth/locale', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ locale }),\n      })\n      window.location.reload()\n    } catch {}\n  }\n\n  const menuItemClass =\n    'w-full text-left text-sm cursor-pointer px-3 py-2 rounded hover:bg-accent inline-flex items-center gap-2.5 outline-none focus-visible:ring-1 focus-visible:ring-ring'\n\n  const resolveMenuLabel = React.useCallback(\n    (item: Pick<MergedMenuItem, 'id' | 'label' | 'labelKey'>): string => {\n      if (item.labelKey && item.label) return t(item.labelKey, item.label)\n      if (item.labelKey) return t(item.labelKey, item.id)\n      if (item.label && item.label.includes('.')) return t(item.label, item.id)\n      return item.label ?? item.id\n    },\n    [t],\n  )\n\n  const builtInMenuItems = React.useMemo(\n    () => {\n      const items: Array<{ id: string; separator?: boolean }> = [{ id: 'change-password' }]\n      if (notificationsHref) items.push({ id: 'notifications' })\n      items.push({ id: 'theme-toggle', separator: true }, { id: 'language' }, { id: 'sign-out', separator: true })\n      return items\n    },\n    [notificationsHref],\n  )\n\n  const mergedMenuItems = React.useMemo(\n    () => mergeMenuItems(builtInMenuItems, injectedItems),\n    [builtInMenuItems, injectedItems],\n  )\n  const injectionContext = React.useMemo(\n    () => ({\n      email,\n      displayName,\n      locale: currentLocale,\n    }),\n    [currentLocale, displayName, email],\n  )\n\n  const renderInjectedItem = React.useCallback(\n    (item: MergedMenuItem) => {\n      const label = resolveMenuLabel(item)\n      const icon = resolveInjectedIcon(item.icon)\n      if (item.href) {\n        return (\n          <Link\n            key={item.id}\n            href={item.href}\n            className={menuItemClass}\n            role=\"menuitem\"\n            data-menu-item-id={item.id}\n            onClick={() => setOpen(false)}\n          >\n            {icon}\n            <span>{label}</span>\n          </Link>\n        )\n      }\n      return (\n        <Button\n          key={item.id}\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"sm\"\n          className=\"w-full justify-start\"\n          role=\"menuitem\"\n          data-menu-item-id={item.id}\n          onClick={() => {\n            item.onClick?.()\n            setOpen(false)\n          }}\n        >\n          {icon}\n          <span>{label}</span>\n        </Button>\n      )\n    },\n    [menuItemClass, resolveMenuLabel],\n  )\n\n  const renderBuiltInItem = React.useCallback(\n    (id: string) => {\n      if (id === 'change-password') {\n        return (\n          <Link\n            key={id}\n            href={changePasswordHref}\n            className={menuItemClass}\n            role=\"menuitem\"\n            onClick={() => setOpen(false)}\n          >\n            <Key className=\"size-4\" />\n            <span>{t('ui.profileMenu.changePassword', 'Change Password')}</span>\n          </Link>\n        )\n      }\n\n      if (id === 'notifications' && notificationsHref) {\n        return (\n          <Link\n            key={id}\n            href={notificationsHref}\n            className={menuItemClass}\n            role=\"menuitem\"\n            onClick={() => setOpen(false)}\n          >\n            <Bell className=\"size-4\" />\n            <span>{t('ui.profileMenu.notifications', 'Notification Preferences')}</span>\n          </Link>\n        )\n      }\n\n      if (id === 'theme-toggle') {\n        return mounted ? (\n          <Button\n            key={id}\n            type=\"button\"\n            variant=\"ghost\"\n            size=\"sm\"\n            className=\"w-full justify-between\"\n            role=\"menuitem\"\n            onClick={handleThemeToggle}\n          >\n            <span className=\"inline-flex items-center gap-2.5\">\n              {isDark ? <Moon className=\"size-4\" /> : <Sun className=\"size-4\" />}\n              <span>{t('ui.profileMenu.theme', 'Dark Mode')}</span>\n            </span>\n            <div className={`w-8 h-4 rounded-full transition-colors ${isDark ? 'bg-primary' : 'bg-muted'} relative`}>\n              <div className={`absolute top-0.5 w-3 h-3 rounded-full bg-background shadow transition-transform ${isDark ? 'translate-x-4' : 'translate-x-0.5'}`} />\n            </div>\n          </Button>\n        ) : null\n      }\n\n      if (id === 'language') {\n        return (\n          <div key={id} className=\"relative\">\n            <Button\n              type=\"button\"\n              variant=\"ghost\"\n              size=\"sm\"\n              className=\"w-full justify-between\"\n              role=\"menuitem\"\n              onClick={() => setLanguageOpen(!languageOpen)}\n              aria-expanded={languageOpen}\n            >\n              <span className=\"inline-flex items-center gap-2.5\">\n                <Globe className=\"size-4\" />\n                <span>{t('ui.profileMenu.language', 'Language')}</span>\n              </span>\n              <span className=\"text-xs text-muted-foreground\">\n                {localeLabels[currentLocale]}\n              </span>\n            </Button>\n            {languageOpen && (\n              <div className=\"mt-1 ml-6 space-y-0.5 border-l pl-2\">\n                {locales.map((locale) => (\n                  <Button\n                    key={locale}\n                    type=\"button\"\n                    variant=\"ghost\"\n                    size=\"sm\"\n                    className={`w-full justify-start gap-2 ${locale === currentLocale ? 'text-primary font-medium' : ''}`}\n                    onClick={() => handleLocaleChange(locale)}\n                  >\n                    <span>{localeLabels[locale]}</span>\n                    {locale === currentLocale && <Check className=\"size-3.5\" />}\n                  </Button>\n                ))}\n              </div>\n            )}\n          </div>\n        )\n      }\n\n      if (id === 'sign-out') {\n        return (\n          <form key={id} action=\"/api/auth/logout\" method=\"POST\">\n            <Button\n              variant=\"ghost\"\n              size=\"sm\"\n              className=\"w-full justify-start\"\n              type=\"submit\"\n              role=\"menuitem\"\n            >\n              <LogOut className=\"size-4\" />\n              <span>{t('ui.userMenu.logout', 'Sign Out')}</span>\n            </Button>\n          </form>\n        )\n      }\n\n      return null\n    },\n    [\n      changePasswordHref,\n      currentLocale,\n      handleThemeToggle,\n      isDark,\n      languageOpen,\n      menuItemClass,\n      mounted,\n      notificationsHref,\n      t,\n    ],\n  )\n\n  return (\n    <div className=\"relative\">\n      <IconButton\n        ref={buttonRef}\n        variant=\"ghost\"\n        size=\"sm\"\n        onClick={() => setOpen(!open)}\n        aria-expanded={open}\n        aria-haspopup=\"menu\"\n        data-testid=\"profile-dropdown-trigger\"\n        title={email || t('ui.userMenu.userFallback', 'User')}\n      >\n        <User className=\"size-4\" />\n      </IconButton>\n\n      {open && (\n        <div\n          ref={menuRef}\n          className=\"absolute right-0 top-full mt-1 w-56 rounded-md border bg-background p-1 shadow-lg z-dropdown\"\n          role=\"menu\"\n          data-testid=\"profile-dropdown\"\n        >\n          {/* User info header */}\n          {(displayName || email) && (\n            <div className=\"px-3 py-2.5 border-b mb-1\">\n              {displayName && (\n                <div className=\"font-medium text-sm flex items-center gap-2\">\n                  <User className=\"size-4\" />\n                  {displayName}\n                </div>\n              )}\n              {displayName && email && (\n                <div className=\"text-xs text-muted-foreground mt-0.5 ml-6\">{email}</div>\n              )}\n              {!displayName && email && (\n                <div className=\"text-xs text-muted-foreground\">\n                  {t('ui.userMenu.loggedInAs', 'Logged in as:')} {email}\n                </div>\n              )}\n            </div>\n          )}\n\n          {mergedMenuItems.map((item) => (\n            <React.Fragment key={item.id}>\n              {item.separator ? <div className=\"my-1 border-t\" /> : null}\n              {item.source === 'injected'\n                ? (item.href || item.onClick || item.label || item.labelKey ? renderInjectedItem(item) : null)\n                : renderBuiltInItem(item.id)}\n            </React.Fragment>\n          ))}\n          <InjectionSpot\n            spotId={BACKEND_TOPBAR_PROFILE_MENU_INJECTION_SPOT_ID}\n            context={injectionContext}\n          />\n        </div>\n      )}\n    </div>\n  )\n}\n"],
   "mappings": "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",
   "names": []
 }

package/dist/backend/RowActions.js

@@ -103,7 +103,7 @@ function RowActions({ items = [] }) {
             {
               ref: menuRef,
               role: "menu",
-              className: "fixed w-44 max-w-[calc(100vw-1rem)] rounded-md border bg-background p-1 shadow focus:outline-none z-[1000]",
+              className: "fixed w-44 max-w-[calc(100vw-1rem)] rounded-md border bg-background p-1 shadow focus-visible:outline-none z-dropdown",
               style: {
                 top: direction === "down" ? anchorRect.bottom + 8 : anchorRect.top - 8,
                 left: Math.min(anchorRect.right, window.innerWidth - 8),

package/dist/backend/RowActions.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/backend/RowActions.tsx"],
-  "sourcesContent": ["\"use client\"\nimport * as React from 'react'\nimport { createPortal } from 'react-dom'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { IconButton } from '../primitives/icon-button'\nimport { Button } from '../primitives/button'\n\nexport type RowActionItem = {\n  id?: string\n  label: string\n  onSelect?: () => void\n  href?: string\n  destructive?: boolean\n}\n\nexport function RowActions({ items = [] }: { items?: RowActionItem[] }) {\n  const t = useT()\n  const [open, setOpen] = React.useState(false)\n  const btnRef = React.useRef<HTMLButtonElement>(null)\n  const menuRef = React.useRef<HTMLDivElement>(null)\n  const hoverTimeoutRef = React.useRef<NodeJS.Timeout | null>(null)\n  const [anchorRect, setAnchorRect] = React.useState<DOMRect | null>(null)\n  const [direction, setDirection] = React.useState<'down' | 'up'>('down')\n\n  const updatePosition = React.useCallback(() => {\n    if (!btnRef.current) return\n    const rect = btnRef.current.getBoundingClientRect()\n    setAnchorRect(rect)\n    // Decide whether to open up or down based on available viewport space\n    const spaceBelow = window.innerHeight - rect.bottom\n    const spaceAbove = rect.top\n    setDirection(spaceBelow < 180 && spaceAbove > spaceBelow ? 'up' : 'down')\n  }, [])\n\n  React.useEffect(() => {\n    if (!open) return\n    updatePosition()\n    function onDocClick(e: MouseEvent) {\n      const t = e.target as Node\n      if (menuRef.current && !menuRef.current.contains(t) && btnRef.current && !btnRef.current.contains(t)) {\n        setOpen(false)\n      }\n    }\n    function onKey(e: KeyboardEvent) {\n      if (e.key === 'Escape') {\n        setOpen(false)\n        btnRef.current?.focus()\n      }\n    }\n    function onScrollOrResize() {\n      updatePosition()\n    }\n    document.addEventListener('mousedown', onDocClick)\n    document.addEventListener('keydown', onKey)\n    window.addEventListener('scroll', onScrollOrResize, true)\n    window.addEventListener('resize', onScrollOrResize)\n    return () => {\n      document.removeEventListener('mousedown', onDocClick)\n      document.removeEventListener('keydown', onKey)\n      window.removeEventListener('scroll', onScrollOrResize, true)\n      window.removeEventListener('resize', onScrollOrResize)\n    }\n  }, [open, updatePosition])\n\n  // Cleanup timeout on unmount\n  React.useEffect(() => {\n    return () => {\n      if (hoverTimeoutRef.current) {\n        clearTimeout(hoverTimeoutRef.current)\n      }\n    }\n  }, [])\n\n  if (items.length === 0) return null\n\n  const handlePointerEnter = (event: React.PointerEvent) => {\n    if (event.pointerType === 'touch') return\n    if (hoverTimeoutRef.current) {\n      clearTimeout(hoverTimeoutRef.current)\n    }\n    setOpen(true)\n  }\n\n  const handlePointerLeave = (event: React.PointerEvent) => {\n    if (event.pointerType === 'touch') return\n    hoverTimeoutRef.current = setTimeout(() => {\n      setOpen(false)\n    }, 150)\n  }\n\n  return (\n    <div\n      className=\"relative inline-block text-left\"\n      onPointerEnter={handlePointerEnter}\n      onPointerLeave={handlePointerLeave}\n    >\n      <IconButton\n        ref={btnRef}\n        type=\"button\"\n        variant=\"ghost\"\n        aria-haspopup=\"menu\"\n        aria-expanded={open}\n        onClick={(e) => { e.stopPropagation(); setOpen((v) => !v); requestAnimationFrame(updatePosition) }}\n      >\n        <span aria-hidden=\"true\">\u22EF</span>\n        <span className=\"sr-only\">{t('ui.rowActions.openActions', 'Open actions')}</span>\n      </IconButton>\n      {open && anchorRect && createPortal(\n        <div\n          ref={menuRef}\n          role=\"menu\"\n          className=\"fixed w-44 max-w-[calc(100vw-1rem)] rounded-md border bg-background p-1 shadow focus:outline-none z-[1000]\"\n          style={{\n            top: direction === 'down' ? anchorRect.bottom + 8 : anchorRect.top - 8,\n            left: Math.min(anchorRect.right, window.innerWidth - 8),\n            transform: `translate(-100%, ${direction === 'down' ? '0' : '-100%'})`,\n          }}\n          onPointerEnter={handlePointerEnter}\n          onPointerLeave={handlePointerLeave}\n        >\n          {items.map((it, idx) => (\n            it.href ? (\n              <a\n                key={idx}\n                href={it.href}\n                className={`block w-full text-left px-2 py-1 text-sm rounded hover:bg-accent ${it.destructive ? 'text-red-600' : ''}`}\n                role=\"menuitem\"\n                onClick={(event) => {\n                  event.stopPropagation()\n                  setOpen(false)\n                }}\n              >\n                {it.label}\n              </a>\n            ) : (\n              <Button\n                key={idx}\n                type=\"button\"\n                variant=\"ghost\"\n                size=\"sm\"\n                className={`w-full justify-start rounded-none font-normal ${it.destructive ? 'text-red-600' : ''}`}\n                role=\"menuitem\"\n                onClick={(event) => {\n                  event.stopPropagation()\n                  setOpen(false)\n                  it.onSelect?.()\n                }}\n              >\n                {it.label}\n              </Button>\n            )\n          ))}\n        </div>,\n        document.body\n      )}\n    </div>\n  )\n}\n"],
+  "sourcesContent": ["\"use client\"\nimport * as React from 'react'\nimport { createPortal } from 'react-dom'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { IconButton } from '../primitives/icon-button'\nimport { Button } from '../primitives/button'\n\nexport type RowActionItem = {\n  id?: string\n  label: string\n  onSelect?: () => void\n  href?: string\n  destructive?: boolean\n}\n\nexport function RowActions({ items = [] }: { items?: RowActionItem[] }) {\n  const t = useT()\n  const [open, setOpen] = React.useState(false)\n  const btnRef = React.useRef<HTMLButtonElement>(null)\n  const menuRef = React.useRef<HTMLDivElement>(null)\n  const hoverTimeoutRef = React.useRef<NodeJS.Timeout | null>(null)\n  const [anchorRect, setAnchorRect] = React.useState<DOMRect | null>(null)\n  const [direction, setDirection] = React.useState<'down' | 'up'>('down')\n\n  const updatePosition = React.useCallback(() => {\n    if (!btnRef.current) return\n    const rect = btnRef.current.getBoundingClientRect()\n    setAnchorRect(rect)\n    // Decide whether to open up or down based on available viewport space\n    const spaceBelow = window.innerHeight - rect.bottom\n    const spaceAbove = rect.top\n    setDirection(spaceBelow < 180 && spaceAbove > spaceBelow ? 'up' : 'down')\n  }, [])\n\n  React.useEffect(() => {\n    if (!open) return\n    updatePosition()\n    function onDocClick(e: MouseEvent) {\n      const t = e.target as Node\n      if (menuRef.current && !menuRef.current.contains(t) && btnRef.current && !btnRef.current.contains(t)) {\n        setOpen(false)\n      }\n    }\n    function onKey(e: KeyboardEvent) {\n      if (e.key === 'Escape') {\n        setOpen(false)\n        btnRef.current?.focus()\n      }\n    }\n    function onScrollOrResize() {\n      updatePosition()\n    }\n    document.addEventListener('mousedown', onDocClick)\n    document.addEventListener('keydown', onKey)\n    window.addEventListener('scroll', onScrollOrResize, true)\n    window.addEventListener('resize', onScrollOrResize)\n    return () => {\n      document.removeEventListener('mousedown', onDocClick)\n      document.removeEventListener('keydown', onKey)\n      window.removeEventListener('scroll', onScrollOrResize, true)\n      window.removeEventListener('resize', onScrollOrResize)\n    }\n  }, [open, updatePosition])\n\n  // Cleanup timeout on unmount\n  React.useEffect(() => {\n    return () => {\n      if (hoverTimeoutRef.current) {\n        clearTimeout(hoverTimeoutRef.current)\n      }\n    }\n  }, [])\n\n  if (items.length === 0) return null\n\n  const handlePointerEnter = (event: React.PointerEvent) => {\n    if (event.pointerType === 'touch') return\n    if (hoverTimeoutRef.current) {\n      clearTimeout(hoverTimeoutRef.current)\n    }\n    setOpen(true)\n  }\n\n  const handlePointerLeave = (event: React.PointerEvent) => {\n    if (event.pointerType === 'touch') return\n    hoverTimeoutRef.current = setTimeout(() => {\n      setOpen(false)\n    }, 150)\n  }\n\n  return (\n    <div\n      className=\"relative inline-block text-left\"\n      onPointerEnter={handlePointerEnter}\n      onPointerLeave={handlePointerLeave}\n    >\n      <IconButton\n        ref={btnRef}\n        type=\"button\"\n        variant=\"ghost\"\n        aria-haspopup=\"menu\"\n        aria-expanded={open}\n        onClick={(e) => { e.stopPropagation(); setOpen((v) => !v); requestAnimationFrame(updatePosition) }}\n      >\n        <span aria-hidden=\"true\">\u22EF</span>\n        <span className=\"sr-only\">{t('ui.rowActions.openActions', 'Open actions')}</span>\n      </IconButton>\n      {open && anchorRect && createPortal(\n        <div\n          ref={menuRef}\n          role=\"menu\"\n          className=\"fixed w-44 max-w-[calc(100vw-1rem)] rounded-md border bg-background p-1 shadow focus-visible:outline-none z-dropdown\"\n          style={{\n            top: direction === 'down' ? anchorRect.bottom + 8 : anchorRect.top - 8,\n            left: Math.min(anchorRect.right, window.innerWidth - 8),\n            transform: `translate(-100%, ${direction === 'down' ? '0' : '-100%'})`,\n          }}\n          onPointerEnter={handlePointerEnter}\n          onPointerLeave={handlePointerLeave}\n        >\n          {items.map((it, idx) => (\n            it.href ? (\n              <a\n                key={idx}\n                href={it.href}\n                className={`block w-full text-left px-2 py-1 text-sm rounded hover:bg-accent ${it.destructive ? 'text-red-600' : ''}`}\n                role=\"menuitem\"\n                onClick={(event) => {\n                  event.stopPropagation()\n                  setOpen(false)\n                }}\n              >\n                {it.label}\n              </a>\n            ) : (\n              <Button\n                key={idx}\n                type=\"button\"\n                variant=\"ghost\"\n                size=\"sm\"\n                className={`w-full justify-start rounded-none font-normal ${it.destructive ? 'text-red-600' : ''}`}\n                role=\"menuitem\"\n                onClick={(event) => {\n                  event.stopPropagation()\n                  setOpen(false)\n                  it.onSelect?.()\n                }}\n              >\n                {it.label}\n              </Button>\n            )\n          ))}\n        </div>,\n        document.body\n      )}\n    </div>\n  )\n}\n"],
   "mappings": "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",
   "names": ["t"]
 }

package/dist/backend/UserMenu.js

@@ -72,7 +72,7 @@ function UserMenu({ email }) {
       {
         ref: menuRef,
         id: "user-menu-dropdown",
-        className: "absolute right-0 top-full mt-0 w-56 rounded-md border bg-background p-1 shadow z-50",
+        className: "absolute right-0 top-full mt-0 w-56 rounded-md border bg-background p-1 shadow z-dropdown",
         role: "menu",
         "aria-labelledby": "user-menu-button",
         tabIndex: -1,
@@ -86,7 +86,7 @@ function UserMenu({ email }) {
             {
               ref: profileButtonRef,
               href: "/backend/profile/change-password",
-              className: "w-full text-left text-sm px-2 py-1 rounded hover:bg-accent inline-flex items-center gap-2 outline-none focus:outline-none focus-visible:outline-none ring-0 focus:ring-0 focus-visible:ring-0",
+              className: "w-full text-left text-sm px-2 py-1 rounded hover:bg-accent inline-flex items-center gap-2 outline-none focus-visible:outline-none focus-visible:outline-none ring-0 focus-visible:ring-0 focus-visible:ring-0",
               role: "menuitem",
               tabIndex: 0,
               onClick: () => setOpen(false),

package/dist/backend/UserMenu.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/backend/UserMenu.tsx"],
-  "sourcesContent": ["\"use client\"\nimport * as React from 'react'\nimport Link from 'next/link'\nimport { User, LogOut, Key } from 'lucide-react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { Button } from '../primitives/button'\nimport { IconButton } from '../primitives/icon-button'\n\nexport { ProfileDropdown } from './ProfileDropdown'\nexport type { ProfileDropdownProps } from './ProfileDropdown'\n\nexport function UserMenu({ email }: { email?: string }) {\n  const t = useT()\n  const [open, setOpen] = React.useState(false)\n  const buttonRef = React.useRef<HTMLButtonElement>(null)\n  const menuRef = React.useRef<HTMLDivElement>(null)\n  const profileButtonRef = React.useRef<HTMLAnchorElement>(null)\n  const logoutButtonRef = React.useRef<HTMLButtonElement>(null)\n\n  // Toggle menu open/close\n  const toggle = () => setOpen((v) => !v)\n\n  // Open on hover, close when mouse leaves the menu area\n  const onMouseEnter = () => setOpen(true)\n  const onMouseLeave = () => setOpen(false)\n\n  // Close menu when clicking outside\n  React.useEffect(() => {\n    if (!open) return\n    function handleClick(event: MouseEvent) {\n      if (\n        menuRef.current &&\n        !menuRef.current.contains(event.target as Node) &&\n        buttonRef.current &&\n        !buttonRef.current.contains(event.target as Node)\n      ) {\n        setOpen(false)\n      }\n    }\n    document.addEventListener('mousedown', handleClick)\n    return () => document.removeEventListener('mousedown', handleClick)\n  }, [open])\n\n  // Keyboard navigation\n  React.useEffect(() => {\n    if (!open) return\n    function handleKeyDown(event: KeyboardEvent) {\n      if (event.key === 'Escape') {\n        setOpen(false)\n        buttonRef.current?.focus()\n      } else if (event.key === 'ArrowDown' || event.key === 'Tab') {\n        event.preventDefault()\n        profileButtonRef.current?.focus() ?? logoutButtonRef.current?.focus()\n      } else if (event.key === 'ArrowUp') {\n        event.preventDefault()\n        logoutButtonRef.current?.focus() ?? profileButtonRef.current?.focus()\n      }\n    }\n    document.addEventListener('keydown', handleKeyDown)\n    return () => document.removeEventListener('keydown', handleKeyDown)\n  }, [open])\n\n  // Focus the first menu item when menu opens\n  React.useEffect(() => {\n    if (open) {\n      setTimeout(() => {\n        profileButtonRef.current?.focus() ?? logoutButtonRef.current?.focus()\n      }, 0)\n    }\n  }, [open])\n\n  return (\n    <div className=\"relative\" onMouseEnter={onMouseEnter} onMouseLeave={onMouseLeave}>\n      <IconButton\n        ref={buttonRef}\n        variant=\"ghost\"\n        size=\"sm\"\n        onClick={() => setOpen(true)}\n        aria-expanded={open}\n        aria-haspopup=\"menu\"\n        aria-controls=\"user-menu-dropdown\"\n        id=\"user-menu-button\"\n        title={email || t('ui.userMenu.userFallback', 'User')}\n      >\n        <User className=\"size-4\" />\n      </IconButton>\n      {open && (\n        <div\n          ref={menuRef}\n          id=\"user-menu-dropdown\"\n          className=\"absolute right-0 top-full mt-0 w-56 rounded-md border bg-background p-1 shadow z-50\"\n          role=\"menu\"\n          aria-labelledby=\"user-menu-button\"\n          tabIndex={-1}\n        >\n          {email && (\n            <div className=\"px-2 py-2 text-xs text-muted-foreground border-b mb-1\">\n              <div className=\"font-medium\">{t('ui.userMenu.loggedInAs', 'Logged in as:')}</div>\n              <div className=\"truncate\">{email}</div>\n            </div>\n          )}\n          <Link\n            ref={profileButtonRef}\n            href=\"/backend/profile/change-password\"\n            className=\"w-full text-left text-sm px-2 py-1 rounded hover:bg-accent inline-flex items-center gap-2 outline-none focus:outline-none focus-visible:outline-none ring-0 focus:ring-0 focus-visible:ring-0\"\n            role=\"menuitem\"\n            tabIndex={0}\n            onClick={() => setOpen(false)}\n            onKeyDown={(e) => {\n              if (e.key === 'Escape') {\n                setOpen(false)\n                buttonRef.current?.focus()\n              } else if (e.key === 'ArrowDown' || e.key === 'Tab') {\n                e.preventDefault()\n                logoutButtonRef.current?.focus()\n              } else if (e.key === 'ArrowUp') {\n                e.preventDefault()\n                logoutButtonRef.current?.focus()\n              }\n            }}\n          >\n            <Key className=\"size-4\" />\n            <span>{t('ui.userMenu.changePassword', 'Change password')}</span>\n          </Link>\n          <div className=\"my-1 border-t\" aria-hidden=\"true\" />\n          <form action=\"/api/auth/logout\" method=\"POST\">\n            <Button\n              ref={logoutButtonRef}\n              variant=\"ghost\"\n              size=\"sm\"\n              className=\"w-full justify-start\"\n              type=\"submit\"\n              role=\"menuitem\"\n              tabIndex={0}\n              onKeyDown={(e) => {\n                if (e.key === 'Escape') {\n                  setOpen(false)\n                  buttonRef.current?.focus()\n                } else if (e.key === 'ArrowUp') {\n                  e.preventDefault()\n                  profileButtonRef.current?.focus()\n                }\n              }}\n            >\n              <LogOut className=\"size-4\" />\n              <span>{t('ui.userMenu.logout', 'Logout')}</span>\n            </Button>\n          </form>\n        </div>\n      )}\n    </div>\n  )\n}\n"],
+  "sourcesContent": ["\"use client\"\nimport * as React from 'react'\nimport Link from 'next/link'\nimport { User, LogOut, Key } from 'lucide-react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { Button } from '../primitives/button'\nimport { IconButton } from '../primitives/icon-button'\n\nexport { ProfileDropdown } from './ProfileDropdown'\nexport type { ProfileDropdownProps } from './ProfileDropdown'\n\nexport function UserMenu({ email }: { email?: string }) {\n  const t = useT()\n  const [open, setOpen] = React.useState(false)\n  const buttonRef = React.useRef<HTMLButtonElement>(null)\n  const menuRef = React.useRef<HTMLDivElement>(null)\n  const profileButtonRef = React.useRef<HTMLAnchorElement>(null)\n  const logoutButtonRef = React.useRef<HTMLButtonElement>(null)\n\n  // Toggle menu open/close\n  const toggle = () => setOpen((v) => !v)\n\n  // Open on hover, close when mouse leaves the menu area\n  const onMouseEnter = () => setOpen(true)\n  const onMouseLeave = () => setOpen(false)\n\n  // Close menu when clicking outside\n  React.useEffect(() => {\n    if (!open) return\n    function handleClick(event: MouseEvent) {\n      if (\n        menuRef.current &&\n        !menuRef.current.contains(event.target as Node) &&\n        buttonRef.current &&\n        !buttonRef.current.contains(event.target as Node)\n      ) {\n        setOpen(false)\n      }\n    }\n    document.addEventListener('mousedown', handleClick)\n    return () => document.removeEventListener('mousedown', handleClick)\n  }, [open])\n\n  // Keyboard navigation\n  React.useEffect(() => {\n    if (!open) return\n    function handleKeyDown(event: KeyboardEvent) {\n      if (event.key === 'Escape') {\n        setOpen(false)\n        buttonRef.current?.focus()\n      } else if (event.key === 'ArrowDown' || event.key === 'Tab') {\n        event.preventDefault()\n        profileButtonRef.current?.focus() ?? logoutButtonRef.current?.focus()\n      } else if (event.key === 'ArrowUp') {\n        event.preventDefault()\n        logoutButtonRef.current?.focus() ?? profileButtonRef.current?.focus()\n      }\n    }\n    document.addEventListener('keydown', handleKeyDown)\n    return () => document.removeEventListener('keydown', handleKeyDown)\n  }, [open])\n\n  // Focus the first menu item when menu opens\n  React.useEffect(() => {\n    if (open) {\n      setTimeout(() => {\n        profileButtonRef.current?.focus() ?? logoutButtonRef.current?.focus()\n      }, 0)\n    }\n  }, [open])\n\n  return (\n    <div className=\"relative\" onMouseEnter={onMouseEnter} onMouseLeave={onMouseLeave}>\n      <IconButton\n        ref={buttonRef}\n        variant=\"ghost\"\n        size=\"sm\"\n        onClick={() => setOpen(true)}\n        aria-expanded={open}\n        aria-haspopup=\"menu\"\n        aria-controls=\"user-menu-dropdown\"\n        id=\"user-menu-button\"\n        title={email || t('ui.userMenu.userFallback', 'User')}\n      >\n        <User className=\"size-4\" />\n      </IconButton>\n      {open && (\n        <div\n          ref={menuRef}\n          id=\"user-menu-dropdown\"\n          className=\"absolute right-0 top-full mt-0 w-56 rounded-md border bg-background p-1 shadow z-dropdown\"\n          role=\"menu\"\n          aria-labelledby=\"user-menu-button\"\n          tabIndex={-1}\n        >\n          {email && (\n            <div className=\"px-2 py-2 text-xs text-muted-foreground border-b mb-1\">\n              <div className=\"font-medium\">{t('ui.userMenu.loggedInAs', 'Logged in as:')}</div>\n              <div className=\"truncate\">{email}</div>\n            </div>\n          )}\n          <Link\n            ref={profileButtonRef}\n            href=\"/backend/profile/change-password\"\n            className=\"w-full text-left text-sm px-2 py-1 rounded hover:bg-accent inline-flex items-center gap-2 outline-none focus-visible:outline-none focus-visible:outline-none ring-0 focus-visible:ring-0 focus-visible:ring-0\"\n            role=\"menuitem\"\n            tabIndex={0}\n            onClick={() => setOpen(false)}\n            onKeyDown={(e) => {\n              if (e.key === 'Escape') {\n                setOpen(false)\n                buttonRef.current?.focus()\n              } else if (e.key === 'ArrowDown' || e.key === 'Tab') {\n                e.preventDefault()\n                logoutButtonRef.current?.focus()\n              } else if (e.key === 'ArrowUp') {\n                e.preventDefault()\n                logoutButtonRef.current?.focus()\n              }\n            }}\n          >\n            <Key className=\"size-4\" />\n            <span>{t('ui.userMenu.changePassword', 'Change password')}</span>\n          </Link>\n          <div className=\"my-1 border-t\" aria-hidden=\"true\" />\n          <form action=\"/api/auth/logout\" method=\"POST\">\n            <Button\n              ref={logoutButtonRef}\n              variant=\"ghost\"\n              size=\"sm\"\n              className=\"w-full justify-start\"\n              type=\"submit\"\n              role=\"menuitem\"\n              tabIndex={0}\n              onKeyDown={(e) => {\n                if (e.key === 'Escape') {\n                  setOpen(false)\n                  buttonRef.current?.focus()\n                } else if (e.key === 'ArrowUp') {\n                  e.preventDefault()\n                  profileButtonRef.current?.focus()\n                }\n              }}\n            >\n              <LogOut className=\"size-4\" />\n              <span>{t('ui.userMenu.logout', 'Logout')}</span>\n            </Button>\n          </form>\n        </div>\n      )}\n    </div>\n  )\n}\n"],
   "mappings": "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",
   "names": []
 }

package/dist/backend/WebhookSetupGuide.js

@@ -36,7 +36,7 @@ function WebhookSetupGuide({
         ]
       }
     ),
-    isOpen ? /* @__PURE__ */ jsxs("div", { className: "space-y-4 rounded-lg border bg-muted/20 p-4", children: [
+    isOpen ? /* @__PURE__ */ jsxs("div", { className: "space-y-4 rounded-lg border bg-muted/30 p-4", children: [
       /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
           /* @__PURE__ */ jsx(Webhook, { className: "h-4 w-4 text-muted-foreground" }),
@@ -45,26 +45,26 @@ function WebhookSetupGuide({
         /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: guide.summary })
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-        /* @__PURE__ */ jsx("p", { className: "text-[11px] font-medium uppercase tracking-wide text-muted-foreground", children: t("ui.webhookGuide.dashboardPath", "Dashboard path") }),
-        /* @__PURE__ */ jsx("div", { className: "rounded-md border bg-background/70 px-3 py-2 text-sm", children: guide.dashboardPathLabel })
+        /* @__PURE__ */ jsx("p", { className: "text-overline font-medium uppercase tracking-wide text-muted-foreground", children: t("ui.webhookGuide.dashboardPath", "Dashboard path") }),
+        /* @__PURE__ */ jsx("div", { className: "rounded-md border bg-background/80 px-3 py-2 text-sm", children: guide.dashboardPathLabel })
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-        /* @__PURE__ */ jsx("p", { className: "text-[11px] font-medium uppercase tracking-wide text-muted-foreground", children: t("ui.webhookGuide.steps", "Setup steps") }),
+        /* @__PURE__ */ jsx("p", { className: "text-overline font-medium uppercase tracking-wide text-muted-foreground", children: t("ui.webhookGuide.steps", "Setup steps") }),
         /* @__PURE__ */ jsx("ol", { className: "list-decimal space-y-2 pl-5 text-sm text-muted-foreground", children: guide.steps.map((step) => /* @__PURE__ */ jsx("li", { children: step }, step)) })
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-        /* @__PURE__ */ jsx("p", { className: "text-[11px] font-medium uppercase tracking-wide text-muted-foreground", children: t("ui.webhookGuide.endpointUrl", "Webhook endpoint URL") }),
-        /* @__PURE__ */ jsx("div", { className: "rounded-md border bg-background/70 px-3 py-2 font-mono text-xs break-all", children: endpointUrl })
+        /* @__PURE__ */ jsx("p", { className: "text-overline font-medium uppercase tracking-wide text-muted-foreground", children: t("ui.webhookGuide.endpointUrl", "Webhook endpoint URL") }),
+        /* @__PURE__ */ jsx("div", { className: "rounded-md border bg-background/80 px-3 py-2 font-mono text-xs break-all", children: endpointUrl })
       ] }),
       guide.events && guide.events.length > 0 ? /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-        /* @__PURE__ */ jsx("p", { className: "text-[11px] font-medium uppercase tracking-wide text-muted-foreground", children: t("ui.webhookGuide.recommendedEvents", "Recommended events") }),
-        /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: guide.events.map((eventName) => /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "font-mono text-[11px]", children: eventName }, eventName)) })
+        /* @__PURE__ */ jsx("p", { className: "text-overline font-medium uppercase tracking-wide text-muted-foreground", children: t("ui.webhookGuide.recommendedEvents", "Recommended events") }),
+        /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: guide.events.map((eventName) => /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "font-mono text-overline", children: eventName }, eventName)) })
       ] }) : null,
       guide.localDevelopment ? /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
-        /* @__PURE__ */ jsx("p", { className: "text-[11px] font-medium uppercase tracking-wide text-muted-foreground", children: t("ui.webhookGuide.localDevelopment", "Local development") }),
+        /* @__PURE__ */ jsx("p", { className: "text-overline font-medium uppercase tracking-wide text-muted-foreground", children: t("ui.webhookGuide.localDevelopment", "Local development") }),
         guide.localDevelopment.note ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: guide.localDevelopment.note }) : null,
-        /* @__PURE__ */ jsx("div", { className: "rounded-md border bg-background/70 px-3 py-2 font-mono text-xs", children: guide.localDevelopment.tunnelCommand }),
-        /* @__PURE__ */ jsx("div", { className: "rounded-md border bg-background/70 px-3 py-2 font-mono text-xs break-all", children: guide.localDevelopment.publicUrlExample })
+        /* @__PURE__ */ jsx("div", { className: "rounded-md border bg-background/80 px-3 py-2 font-mono text-xs", children: guide.localDevelopment.tunnelCommand }),
+        /* @__PURE__ */ jsx("div", { className: "rounded-md border bg-background/80 px-3 py-2 font-mono text-xs break-all", children: guide.localDevelopment.publicUrlExample })
       ] }) : null,
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-xs text-muted-foreground", children: [
         /* @__PURE__ */ jsx(Globe, { className: "h-3.5 w-3.5" }),

package/dist/backend/WebhookSetupGuide.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/backend/WebhookSetupGuide.tsx"],
-  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport type { IntegrationCredentialWebhookHelp } from '@open-mercato/shared/modules/integrations/types'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { cn } from '@open-mercato/shared/lib/utils'\nimport { Badge } from '../primitives/badge'\nimport { Button } from '../primitives/button'\nimport { ChevronDown, ChevronRight, Globe, Webhook } from 'lucide-react'\n\nexport type WebhookSetupGuideProps = {\n  guide: IntegrationCredentialWebhookHelp\n  buttonLabel?: string\n  className?: string\n}\n\nexport function WebhookSetupGuide({\n  guide,\n  buttonLabel,\n  className,\n}: WebhookSetupGuideProps) {\n  const t = useT()\n  const [isOpen, setIsOpen] = React.useState(false)\n  const [appOrigin, setAppOrigin] = React.useState('http://localhost:3000')\n  const resolvedButtonLabel = buttonLabel ?? t('ui.webhookGuide.showDetails', 'Show details')\n\n  React.useEffect(() => {\n    if (typeof window !== 'undefined' && window.location?.origin) {\n      setAppOrigin(window.location.origin)\n    }\n  }, [])\n\n  const endpointUrl = `${appOrigin}${guide.endpointPath}`\n\n  return (\n    <div className={cn('space-y-3', className)}>\n      <Button\n        type=\"button\"\n        variant=\"link\"\n        size=\"sm\"\n        className=\"h-auto px-0 text-xs font-medium\"\n        onClick={() => setIsOpen((current) => !current)}\n      >\n        {isOpen ? <ChevronDown className=\"mr-1 h-3.5 w-3.5\" /> : <ChevronRight className=\"mr-1 h-3.5 w-3.5\" />}\n        {isOpen ? t('ui.webhookGuide.hideDetails', 'Hide details') : resolvedButtonLabel}\n      </Button>\n\n      {isOpen ? (\n        <div className=\"space-y-4 rounded-lg border bg-muted/20 p-4\">\n          <div className=\"space-y-1\">\n            <div className=\"flex items-center gap-2\">\n              <Webhook className=\"h-4 w-4 text-muted-foreground\" />\n              <p className=\"text-sm font-semibold\">{guide.title}</p>\n            </div>\n            <p className=\"text-sm text-muted-foreground\">{guide.summary}</p>\n          </div>\n\n          <div className=\"space-y-2\">\n            <p className=\"text-[11px] font-medium uppercase tracking-wide text-muted-foreground\">\n              {t('ui.webhookGuide.dashboardPath', 'Dashboard path')}\n            </p>\n            <div className=\"rounded-md border bg-background/70 px-3 py-2 text-sm\">\n              {guide.dashboardPathLabel}\n            </div>\n          </div>\n\n          <div className=\"space-y-2\">\n            <p className=\"text-[11px] font-medium uppercase tracking-wide text-muted-foreground\">\n              {t('ui.webhookGuide.steps', 'Setup steps')}\n            </p>\n            <ol className=\"list-decimal space-y-2 pl-5 text-sm text-muted-foreground\">\n              {guide.steps.map((step) => (\n                <li key={step}>{step}</li>\n              ))}\n            </ol>\n          </div>\n\n          <div className=\"space-y-2\">\n            <p className=\"text-[11px] font-medium uppercase tracking-wide text-muted-foreground\">\n              {t('ui.webhookGuide.endpointUrl', 'Webhook endpoint URL')}\n            </p>\n            <div className=\"rounded-md border bg-background/70 px-3 py-2 font-mono text-xs break-all\">\n              {endpointUrl}\n            </div>\n          </div>\n\n          {guide.events && guide.events.length > 0 ? (\n            <div className=\"space-y-2\">\n              <p className=\"text-[11px] font-medium uppercase tracking-wide text-muted-foreground\">\n                {t('ui.webhookGuide.recommendedEvents', 'Recommended events')}\n              </p>\n              <div className=\"flex flex-wrap gap-2\">\n                {guide.events.map((eventName) => (\n                  <Badge key={eventName} variant=\"outline\" className=\"font-mono text-[11px]\">\n                    {eventName}\n                  </Badge>\n                ))}\n              </div>\n            </div>\n          ) : null}\n\n          {guide.localDevelopment ? (\n            <div className=\"space-y-3\">\n              <p className=\"text-[11px] font-medium uppercase tracking-wide text-muted-foreground\">\n                {t('ui.webhookGuide.localDevelopment', 'Local development')}\n              </p>\n              {guide.localDevelopment.note ? (\n                <p className=\"text-sm text-muted-foreground\">{guide.localDevelopment.note}</p>\n              ) : null}\n              <div className=\"rounded-md border bg-background/70 px-3 py-2 font-mono text-xs\">\n                {guide.localDevelopment.tunnelCommand}\n              </div>\n              <div className=\"rounded-md border bg-background/70 px-3 py-2 font-mono text-xs break-all\">\n                {guide.localDevelopment.publicUrlExample}\n              </div>\n            </div>\n          ) : null}\n\n          <div className=\"flex items-center gap-2 text-xs text-muted-foreground\">\n            <Globe className=\"h-3.5 w-3.5\" />\n            <span>{t('ui.webhookGuide.publicUrlNote', 'Use your public application URL in Stripe, not a localhost address.')}</span>\n          </div>\n        </div>\n      ) : null}\n    </div>\n  )\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport type { IntegrationCredentialWebhookHelp } from '@open-mercato/shared/modules/integrations/types'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { cn } from '@open-mercato/shared/lib/utils'\nimport { Badge } from '../primitives/badge'\nimport { Button } from '../primitives/button'\nimport { ChevronDown, ChevronRight, Globe, Webhook } from 'lucide-react'\n\nexport type WebhookSetupGuideProps = {\n  guide: IntegrationCredentialWebhookHelp\n  buttonLabel?: string\n  className?: string\n}\n\nexport function WebhookSetupGuide({\n  guide,\n  buttonLabel,\n  className,\n}: WebhookSetupGuideProps) {\n  const t = useT()\n  const [isOpen, setIsOpen] = React.useState(false)\n  const [appOrigin, setAppOrigin] = React.useState('http://localhost:3000')\n  const resolvedButtonLabel = buttonLabel ?? t('ui.webhookGuide.showDetails', 'Show details')\n\n  React.useEffect(() => {\n    if (typeof window !== 'undefined' && window.location?.origin) {\n      setAppOrigin(window.location.origin)\n    }\n  }, [])\n\n  const endpointUrl = `${appOrigin}${guide.endpointPath}`\n\n  return (\n    <div className={cn('space-y-3', className)}>\n      <Button\n        type=\"button\"\n        variant=\"link\"\n        size=\"sm\"\n        className=\"h-auto px-0 text-xs font-medium\"\n        onClick={() => setIsOpen((current) => !current)}\n      >\n        {isOpen ? <ChevronDown className=\"mr-1 h-3.5 w-3.5\" /> : <ChevronRight className=\"mr-1 h-3.5 w-3.5\" />}\n        {isOpen ? t('ui.webhookGuide.hideDetails', 'Hide details') : resolvedButtonLabel}\n      </Button>\n\n      {isOpen ? (\n        <div className=\"space-y-4 rounded-lg border bg-muted/30 p-4\">\n          <div className=\"space-y-1\">\n            <div className=\"flex items-center gap-2\">\n              <Webhook className=\"h-4 w-4 text-muted-foreground\" />\n              <p className=\"text-sm font-semibold\">{guide.title}</p>\n            </div>\n            <p className=\"text-sm text-muted-foreground\">{guide.summary}</p>\n          </div>\n\n          <div className=\"space-y-2\">\n            <p className=\"text-overline font-medium uppercase tracking-wide text-muted-foreground\">\n              {t('ui.webhookGuide.dashboardPath', 'Dashboard path')}\n            </p>\n            <div className=\"rounded-md border bg-background/80 px-3 py-2 text-sm\">\n              {guide.dashboardPathLabel}\n            </div>\n          </div>\n\n          <div className=\"space-y-2\">\n            <p className=\"text-overline font-medium uppercase tracking-wide text-muted-foreground\">\n              {t('ui.webhookGuide.steps', 'Setup steps')}\n            </p>\n            <ol className=\"list-decimal space-y-2 pl-5 text-sm text-muted-foreground\">\n              {guide.steps.map((step) => (\n                <li key={step}>{step}</li>\n              ))}\n            </ol>\n          </div>\n\n          <div className=\"space-y-2\">\n            <p className=\"text-overline font-medium uppercase tracking-wide text-muted-foreground\">\n              {t('ui.webhookGuide.endpointUrl', 'Webhook endpoint URL')}\n            </p>\n            <div className=\"rounded-md border bg-background/80 px-3 py-2 font-mono text-xs break-all\">\n              {endpointUrl}\n            </div>\n          </div>\n\n          {guide.events && guide.events.length > 0 ? (\n            <div className=\"space-y-2\">\n              <p className=\"text-overline font-medium uppercase tracking-wide text-muted-foreground\">\n                {t('ui.webhookGuide.recommendedEvents', 'Recommended events')}\n              </p>\n              <div className=\"flex flex-wrap gap-2\">\n                {guide.events.map((eventName) => (\n                  <Badge key={eventName} variant=\"outline\" className=\"font-mono text-overline\">\n                    {eventName}\n                  </Badge>\n                ))}\n              </div>\n            </div>\n          ) : null}\n\n          {guide.localDevelopment ? (\n            <div className=\"space-y-3\">\n              <p className=\"text-overline font-medium uppercase tracking-wide text-muted-foreground\">\n                {t('ui.webhookGuide.localDevelopment', 'Local development')}\n              </p>\n              {guide.localDevelopment.note ? (\n                <p className=\"text-sm text-muted-foreground\">{guide.localDevelopment.note}</p>\n              ) : null}\n              <div className=\"rounded-md border bg-background/80 px-3 py-2 font-mono text-xs\">\n                {guide.localDevelopment.tunnelCommand}\n              </div>\n              <div className=\"rounded-md border bg-background/80 px-3 py-2 font-mono text-xs break-all\">\n                {guide.localDevelopment.publicUrlExample}\n              </div>\n            </div>\n          ) : null}\n\n          <div className=\"flex items-center gap-2 text-xs text-muted-foreground\">\n            <Globe className=\"h-3.5 w-3.5\" />\n            <span>{t('ui.webhookGuide.publicUrlNote', 'Use your public application URL in Stripe, not a localhost address.')}</span>\n          </div>\n        </div>\n      ) : null}\n    </div>\n  )\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/backend/charts/KpiCard.js

@@ -17,9 +17,9 @@ function formatPercentageChange(value) {
 function BadgeDelta({ direction, value }) {
   const baseClasses = "inline-flex items-center gap-1 rounded-md px-2 py-0.5 text-xs font-medium";
   const directionClasses = {
-    up: "bg-emerald-100 text-emerald-700 dark:bg-emerald-900/30 dark:text-emerald-400",
-    down: "bg-red-100 text-red-700 dark:bg-red-900/30 dark:text-red-400",
-    unchanged: "bg-gray-100 text-gray-700 dark:bg-gray-800 dark:text-gray-400"
+    up: "bg-status-success-bg text-status-success-text",
+    down: "bg-status-error-bg text-status-error-text",
+    unchanged: "bg-status-neutral-bg text-status-neutral-text"
   };
   const icons = {
     up: /* @__PURE__ */ jsx("svg", { className: "h-3 w-3", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M5 10l7-7m0 0l7 7m-7-7v18" }) }),

package/dist/backend/charts/KpiCard.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/backend/charts/KpiCard.tsx"],
-  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { Spinner } from '@open-mercato/ui/primitives/spinner'\n\nexport type KpiTrend = {\n  value: number\n  direction: 'up' | 'down' | 'unchanged'\n}\n\nexport type KpiCardProps = {\n  title?: string\n  value: number | null\n  trend?: KpiTrend\n  comparisonLabel?: string\n  loading?: boolean\n  error?: string | null\n  formatValue?: (value: number) => string\n  prefix?: string\n  suffix?: string\n  className?: string\n  headerAction?: React.ReactNode\n}\n\nfunction defaultFormatValue(value: number): string {\n  if (Math.abs(value) >= 1_000_000) {\n    return `${(value / 1_000_000).toFixed(1)}M`\n  }\n  if (Math.abs(value) >= 1_000) {\n    return `${(value / 1_000).toFixed(1)}K`\n  }\n  return value.toLocaleString(undefined, { maximumFractionDigits: 2 })\n}\n\nfunction formatPercentageChange(value: number): string {\n  const formatted = Math.abs(value).toFixed(1)\n  return `${formatted}%`\n}\n\ntype BadgeDeltaProps = {\n  direction: 'up' | 'down' | 'unchanged'\n  value: number\n}\n\nfunction BadgeDelta({ direction, value }: BadgeDeltaProps) {\n  const baseClasses = 'inline-flex items-center gap-1 rounded-md px-2 py-0.5 text-xs font-medium'\n\n  const directionClasses = {\n    up: 'bg-emerald-100 text-emerald-700 dark:bg-emerald-900/30 dark:text-emerald-400',\n    down: 'bg-red-100 text-red-700 dark:bg-red-900/30 dark:text-red-400',\n    unchanged: 'bg-gray-100 text-gray-700 dark:bg-gray-800 dark:text-gray-400',\n  }\n\n  const icons = {\n    up: (\n      <svg className=\"h-3 w-3\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={2}>\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M5 10l7-7m0 0l7 7m-7-7v18\" />\n      </svg>\n    ),\n    down: (\n      <svg className=\"h-3 w-3\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={2}>\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M19 14l-7 7m0 0l-7-7m7 7V3\" />\n      </svg>\n    ),\n    unchanged: (\n      <svg className=\"h-3 w-3\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={2}>\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M5 12h14\" />\n      </svg>\n    ),\n  }\n\n  return (\n    <span\n      className={`${baseClasses} ${directionClasses[direction]}`}\n      title=\"Compared to previous period\"\n    >\n      {icons[direction]}\n      {formatPercentageChange(value)}\n    </span>\n  )\n}\n\nexport function KpiCard({\n  title,\n  value,\n  trend,\n  comparisonLabel,\n  loading,\n  error,\n  formatValue = defaultFormatValue,\n  prefix = '',\n  suffix = '',\n  className = '',\n  headerAction,\n}: KpiCardProps) {\n  const hasWrapper = !!title\n  const wrapperClass = hasWrapper ? `rounded-lg border bg-card p-4 ${className}` : className\n\n  const headerRow = (title || headerAction) ? (\n    <div className=\"flex items-center justify-between gap-2 mb-2\">\n      {title && <p className=\"text-sm font-medium text-muted-foreground\">{title}</p>}\n      {headerAction}\n    </div>\n  ) : null\n\n  if (error) {\n    return (\n      <div className={wrapperClass}>\n        {headerRow}\n        <p className=\"text-sm text-destructive\">{error}</p>\n      </div>\n    )\n  }\n\n  if (loading) {\n    return (\n      <div className={wrapperClass}>\n        {headerRow}\n        <div className=\"flex items-center justify-center py-4\">\n          <Spinner className=\"h-6 w-6 text-muted-foreground\" />\n        </div>\n      </div>\n    )\n  }\n\n  if (value === null) {\n    return (\n      <div className={wrapperClass}>\n        {headerRow}\n        <p className=\"text-2xl sm:text-3xl font-semibold tracking-tight text-card-foreground\">--</p>\n      </div>\n    )\n  }\n\n  return (\n    <div className={wrapperClass}>\n      {headerRow}\n      <div className=\"flex items-baseline gap-3\">\n        <p className=\"text-2xl sm:text-3xl font-semibold tracking-tight text-card-foreground\">\n          {prefix}\n          {formatValue(value)}\n          {suffix}\n        </p>\n        {trend && (\n          <BadgeDelta direction={trend.direction} value={trend.value} />\n        )}\n      </div>\n      {trend && comparisonLabel && (\n        <p className=\"mt-1 text-xs text-muted-foreground\">{comparisonLabel}</p>\n      )}\n    </div>\n  )\n}\n\nexport default KpiCard\n"],
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { Spinner } from '@open-mercato/ui/primitives/spinner'\n\nexport type KpiTrend = {\n  value: number\n  direction: 'up' | 'down' | 'unchanged'\n}\n\nexport type KpiCardProps = {\n  title?: string\n  value: number | null\n  trend?: KpiTrend\n  comparisonLabel?: string\n  loading?: boolean\n  error?: string | null\n  formatValue?: (value: number) => string\n  prefix?: string\n  suffix?: string\n  className?: string\n  headerAction?: React.ReactNode\n}\n\nfunction defaultFormatValue(value: number): string {\n  if (Math.abs(value) >= 1_000_000) {\n    return `${(value / 1_000_000).toFixed(1)}M`\n  }\n  if (Math.abs(value) >= 1_000) {\n    return `${(value / 1_000).toFixed(1)}K`\n  }\n  return value.toLocaleString(undefined, { maximumFractionDigits: 2 })\n}\n\nfunction formatPercentageChange(value: number): string {\n  const formatted = Math.abs(value).toFixed(1)\n  return `${formatted}%`\n}\n\ntype BadgeDeltaProps = {\n  direction: 'up' | 'down' | 'unchanged'\n  value: number\n}\n\nfunction BadgeDelta({ direction, value }: BadgeDeltaProps) {\n  const baseClasses = 'inline-flex items-center gap-1 rounded-md px-2 py-0.5 text-xs font-medium'\n\n  const directionClasses = {\n    up: 'bg-status-success-bg text-status-success-text',\n    down: 'bg-status-error-bg text-status-error-text',\n    unchanged: 'bg-status-neutral-bg text-status-neutral-text',\n  }\n\n  const icons = {\n    up: (\n      <svg className=\"h-3 w-3\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={2}>\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M5 10l7-7m0 0l7 7m-7-7v18\" />\n      </svg>\n    ),\n    down: (\n      <svg className=\"h-3 w-3\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={2}>\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M19 14l-7 7m0 0l-7-7m7 7V3\" />\n      </svg>\n    ),\n    unchanged: (\n      <svg className=\"h-3 w-3\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={2}>\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M5 12h14\" />\n      </svg>\n    ),\n  }\n\n  return (\n    <span\n      className={`${baseClasses} ${directionClasses[direction]}`}\n      title=\"Compared to previous period\"\n    >\n      {icons[direction]}\n      {formatPercentageChange(value)}\n    </span>\n  )\n}\n\nexport function KpiCard({\n  title,\n  value,\n  trend,\n  comparisonLabel,\n  loading,\n  error,\n  formatValue = defaultFormatValue,\n  prefix = '',\n  suffix = '',\n  className = '',\n  headerAction,\n}: KpiCardProps) {\n  const hasWrapper = !!title\n  const wrapperClass = hasWrapper ? `rounded-lg border bg-card p-4 ${className}` : className\n\n  const headerRow = (title || headerAction) ? (\n    <div className=\"flex items-center justify-between gap-2 mb-2\">\n      {title && <p className=\"text-sm font-medium text-muted-foreground\">{title}</p>}\n      {headerAction}\n    </div>\n  ) : null\n\n  if (error) {\n    return (\n      <div className={wrapperClass}>\n        {headerRow}\n        <p className=\"text-sm text-destructive\">{error}</p>\n      </div>\n    )\n  }\n\n  if (loading) {\n    return (\n      <div className={wrapperClass}>\n        {headerRow}\n        <div className=\"flex items-center justify-center py-4\">\n          <Spinner className=\"h-6 w-6 text-muted-foreground\" />\n        </div>\n      </div>\n    )\n  }\n\n  if (value === null) {\n    return (\n      <div className={wrapperClass}>\n        {headerRow}\n        <p className=\"text-2xl sm:text-3xl font-semibold tracking-tight text-card-foreground\">--</p>\n      </div>\n    )\n  }\n\n  return (\n    <div className={wrapperClass}>\n      {headerRow}\n      <div className=\"flex items-baseline gap-3\">\n        <p className=\"text-2xl sm:text-3xl font-semibold tracking-tight text-card-foreground\">\n          {prefix}\n          {formatValue(value)}\n          {suffix}\n        </p>\n        {trend && (\n          <BadgeDelta direction={trend.direction} value={trend.value} />\n        )}\n      </div>\n      {trend && comparisonLabel && (\n        <p className=\"mt-1 text-xs text-muted-foreground\">{comparisonLabel}</p>\n      )}\n    </div>\n  )\n}\n\nexport default KpiCard\n"],
   "mappings": "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",
   "names": []
 }

package/dist/backend/columns/ColumnChooserPanel.js

@@ -229,7 +229,7 @@ function ColumnChooserPanel({
     };
   }, [open]);
   if (!open) return null;
-  return /* @__PURE__ */ jsxs("div", { className: "fixed inset-y-0 right-0 z-50 w-80 border-l bg-background shadow-lg flex flex-col", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "fixed inset-y-0 right-0 z-modal w-80 border-l bg-background shadow-lg flex flex-col", children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b px-4 py-3", children: [
       /* @__PURE__ */ jsx("h3", { className: "font-semibold text-sm", children: t("ui.columnChooser.title", "Columns") }),
       /* @__PURE__ */ jsx(IconButton, { variant: "ghost", size: "sm", type: "button", onClick: () => onOpenChange(false), "aria-label": t("ui.columnChooser.close", "Close"), children: /* @__PURE__ */ jsx(X, { className: "size-4" }) })