@open-mercato/core 0.6.4-develop.3929.1.fcf7afece2 → 0.6.4-develop.3944.1.4100aa7fbe

package/dist/modules/dictionaries/components/DictionaryEntrySelect.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/modules/dictionaries/components/DictionaryEntrySelect.tsx"],
-  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport Link from 'next/link'\nimport { usePathname, useSearchParams } from 'next/navigation'\nimport { Plus, Settings, Save } from 'lucide-react'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { Input } from '@open-mercato/ui/primitives/input'\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n  DialogTrigger,\n} from '@open-mercato/ui/primitives/dialog'\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from '@open-mercato/ui/primitives/select'\nimport { Spinner } from '@open-mercato/ui/primitives/spinner'\nimport { flash } from '@open-mercato/ui/backend/FlashMessages'\nimport { buildHrefWithReturnTo } from '@open-mercato/shared/lib/navigation/returnTo'\nimport { DictionaryValue, renderDictionaryColor, renderDictionaryIcon } from './dictionaryAppearance'\nimport { AppearanceSelector, type AppearanceSelectorLabels, useAppearanceState } from './AppearanceSelector'\n\nconst DEFAULT_APPEARANCE_LABELS: AppearanceSelectorLabels = {\n  colorLabel: 'Color',\n  colorHelp: 'Pick a highlight color for this entry.',\n  colorClearLabel: 'Remove color',\n  iconLabel: 'Icon or emoji',\n  iconPlaceholder: 'Type an emoji or icon token.',\n  iconPickerTriggerLabel: 'Browse icons and emoji',\n  iconSearchPlaceholder: 'Search icons or emojis\u2026',\n  iconSearchEmptyLabel: 'No icons match your search.',\n  iconSuggestionsLabel: 'Suggestions',\n  iconClearLabel: 'Remove icon',\n  previewEmptyLabel: 'No appearance selected',\n}\n\nexport type DictionaryOption = {\n  value: string\n  label: string\n  color: string | null\n  icon: string | null\n}\n\nexport type DictionarySelectLabels = {\n  placeholder: string\n  addLabel: string\n  addPrompt?: string\n  dialogTitle: string\n  valueLabel: string\n  valuePlaceholder: string\n  labelLabel: string\n  labelPlaceholder: string\n  emptyError: string\n  cancelLabel: string\n  saveLabel: string\n  saveShortcutHint?: string\n  successCreateLabel?: string\n  errorLoad: string\n  errorSave: string\n  loadingLabel: string\n  manageTitle: string\n}\n\nexport type DictionaryEntrySelectProps = {\n  value?: string\n  onChange: (value: string | undefined) => void\n  fetchOptions: () => Promise<DictionaryOption[]>\n  createOption?: (input: { value: string; label?: string; color?: string | null; icon?: string | null }) => Promise<DictionaryOption | null>\n  labels: DictionarySelectLabels\n  manageHref?: string\n  selectClassName?: string\n  allowInlineCreate?: boolean\n  allowAppearance?: boolean\n  appearanceLabels?: AppearanceSelectorLabels\n  disabled?: boolean\n  showLabelInput?: boolean\n  showManage?: boolean\n}\n\nexport function DictionaryEntrySelect({\n  value,\n  onChange,\n  fetchOptions,\n  createOption,\n  labels,\n  manageHref,\n  selectClassName,\n  allowInlineCreate = true,\n  allowAppearance = false,\n  appearanceLabels,\n  disabled: disabledProp = false,\n  showLabelInput = true,\n  showManage = true,\n}: DictionaryEntrySelectProps) {\n  const pathname = usePathname()\n  const searchParams = useSearchParams()\n  const [options, setOptions] = React.useState<DictionaryOption[]>([])\n  const [loading, setLoading] = React.useState(true)\n  const [saving, setSaving] = React.useState(false)\n  const [dialogOpen, setDialogOpen] = React.useState(false)\n  const [newValue, setNewValue] = React.useState('')\n  const [newLabel, setNewLabel] = React.useState('')\n  const [formError, setFormError] = React.useState<string | null>(null)\n  const appearance = useAppearanceState(null, null)\n\n  const loadOptions = React.useCallback(async () => {\n    setLoading(true)\n    try {\n      const items = await fetchOptions()\n      setOptions(items.sort((a, b) => a.label.localeCompare(b.label, undefined, { sensitivity: 'base' })))\n    } catch (err) {\n      console.error('DictionaryEntrySelect.fetchOptions failed', err)\n      flash(labels.errorLoad, 'error')\n      setOptions([])\n    } finally {\n      setLoading(false)\n    }\n  }, [fetchOptions, labels.errorLoad])\n\n  React.useEffect(() => {\n    loadOptions().catch(() => {})\n  }, [loadOptions])\n\n  const resetDialogState = React.useCallback(() => {\n    setNewValue('')\n    setNewLabel('')\n    setFormError(null)\n    appearance.setColor(null)\n    appearance.setIcon(null)\n    setSaving(false)\n  }, [appearance])\n\n  React.useEffect(() => {\n    if (!dialogOpen) resetDialogState()\n  }, [dialogOpen, resetDialogState])\n\n  const activeOption = React.useMemo(\n    () => options.find((option) => option.value === value) ?? null,\n    [options, value],\n  )\n\n  const handleCreate = React.useCallback(async () => {\n    if (!createOption) return\n    const trimmedValue = newValue.trim()\n    if (!trimmedValue.length) {\n      setFormError(labels.emptyError)\n      return\n    }\n    setSaving(true)\n    try {\n      const payload = await createOption({\n        value: trimmedValue,\n        label: showLabelInput ? newLabel.trim() || undefined : undefined,\n        color: allowAppearance && appearance.color ? appearance.color : undefined,\n        icon: allowAppearance && appearance.icon ? appearance.icon : undefined,\n      })\n      if (!payload) throw new Error('createOption did not return an entry')\n      setOptions((previous) => {\n        const map = new Map(previous.map((option) => [option.value, option]))\n        map.set(payload.value, {\n          value: payload.value,\n          label: payload.label,\n          color: payload.color ?? null,\n          icon: payload.icon ?? null,\n        })\n        return Array.from(map.values()).sort((a, b) => a.label.localeCompare(b.label, undefined, { sensitivity: 'base' }))\n      })\n      await loadOptions()\n      onChange(payload.value)\n      setDialogOpen(false)\n      if (labels.successCreateLabel) {\n        flash(labels.successCreateLabel, 'success')\n      }\n    } catch (err) {\n      console.error('DictionaryEntrySelect.createOption failed', err)\n      flash(labels.errorSave, 'error')\n    } finally {\n      setSaving(false)\n    }\n  }, [\n    allowAppearance,\n    appearance.color,\n    appearance.icon,\n    createOption,\n    labels.emptyError,\n    labels.errorSave,\n    labels.successCreateLabel,\n    loadOptions,\n    newLabel,\n    newValue,\n    onChange,\n  ])\n\n  const handleDialogKeyDown = React.useCallback(\n    (event: React.KeyboardEvent) => {\n      if (event.key === 'Escape') {\n        event.preventDefault()\n        if (!saving) {\n          setDialogOpen(false)\n        }\n        return\n      }\n      if (event.key === 'Enter' && (event.metaKey || event.ctrlKey)) {\n        event.preventDefault()\n        if (!saving && newValue.trim().length) {\n          handleCreate().catch(() => {})\n        } else if (!saving && !newValue.trim().length) {\n          setFormError(labels.emptyError)\n        }\n      }\n    },\n    [handleCreate, labels.emptyError, newValue, saving],\n  )\n\n  const shortcutHint = React.useMemo(() => {\n    const provided = typeof labels.saveShortcutHint === 'string' ? labels.saveShortcutHint.trim() : ''\n    if (provided.length) return provided\n    return '\u2318/Ctrl + Enter'\n  }, [labels.saveShortcutHint])\n\n  const disabled = disabledProp || loading || saving\n  const manageLink = manageHref ?? '/backend/config/dictionaries'\n  const returnTo = React.useMemo(() => {\n    const query = searchParams?.toString() ?? ''\n    if (!pathname) return null\n    return query.length ? `${pathname}?${query}` : pathname\n  }, [pathname, searchParams])\n  const manageLinkWithReturnTo = React.useMemo(\n    () => buildHrefWithReturnTo(manageLink, returnTo),\n    [manageLink, returnTo],\n  )\n\n  return (\n    <div className=\"space-y-2\">\n      <div className=\"flex items-center gap-2\">\n        <Select\n          value={value || undefined}\n          onValueChange={(next) => onChange(next || undefined)}\n          disabled={disabled}\n        >\n          <SelectTrigger\n            className={selectClassName}\n            title={activeOption?.label ?? undefined}\n          >\n            <SelectValue placeholder={labels.placeholder} />\n          </SelectTrigger>\n          <SelectContent>\n            {options.map((option) => (\n              <SelectItem key={option.value} value={option.value}>\n                {option.label}\n              </SelectItem>\n            ))}\n          </SelectContent>\n        </Select>\n        <div className=\"flex items-center gap-1\">\n          {allowInlineCreate && createOption ? (\n            <Dialog open={dialogOpen} onOpenChange={setDialogOpen}>\n              <DialogTrigger asChild>\n                <Button\n                  type=\"button\"\n                  variant=\"outline\"\n                  size=\"icon\"\n                  disabled={disabled}\n                  title={labels.addLabel}\n                  aria-label={labels.addLabel}\n                >\n                  <Plus className=\"h-4 w-4\" />\n                </Button>\n              </DialogTrigger>\n              <DialogContent className=\"sm:max-w-md\" onKeyDown={handleDialogKeyDown}>\n                <DialogHeader>\n                  <DialogTitle>{labels.dialogTitle}</DialogTitle>\n                  {labels.addPrompt ? <DialogDescription>{labels.addPrompt}</DialogDescription> : null}\n                </DialogHeader>\n                <div className=\"space-y-4\">\n                  <div className=\"space-y-2\">\n                    <label className=\"text-sm font-medium\">{labels.valueLabel}</label>\n                    <Input\n                      type=\"text\"\n                      value={newValue}\n                      onChange={(event) => {\n                        setNewValue(event.target.value)\n                        if (formError) setFormError(null)\n                      }}\n                      placeholder={labels.valuePlaceholder}\n                      autoFocus\n                      disabled={saving}\n                    />\n                  </div>\n                  {showLabelInput ? (\n                    <div className=\"space-y-2\">\n                      <label className=\"text-sm font-medium\">{labels.labelLabel}</label>\n                      <Input\n                        type=\"text\"\n                        value={newLabel}\n                        onChange={(event) => setNewLabel(event.target.value)}\n                        placeholder={labels.labelPlaceholder}\n                        disabled={saving}\n                      />\n                    </div>\n                  ) : null}\n                  {allowAppearance ? (\n                    <AppearanceSelector\n                      icon={appearance.icon}\n                      color={appearance.color}\n                      onIconChange={appearance.setIcon}\n                      onColorChange={appearance.setColor}\n                      labels={appearanceLabels ?? DEFAULT_APPEARANCE_LABELS}\n                    />\n                  ) : null}\n                  {formError ? <p className=\"text-sm text-red-600\">{formError}</p> : null}\n                </div>\n                <DialogFooter>\n                  <Button type=\"button\" variant=\"outline\" onClick={() => setDialogOpen(false)} disabled={saving}>\n                    {labels.cancelLabel}\n                  </Button>\n                  <Button type=\"button\" onClick={handleCreate} disabled={saving || !newValue.trim()}>\n                    {saving ? <Spinner className=\"mr-2 h-4 w-4\" /> : <Save className=\"mr-2 h-4 w-4\" />}\n                    <span className=\"flex items-center gap-2\">\n                      <span>{labels.saveLabel}</span>\n                      {!saving ? (\n                        <span className=\"text-xs text-muted-foreground\">{`(${shortcutHint})`}</span>\n                      ) : null}\n                    </span>\n                  </Button>\n                </DialogFooter>\n              </DialogContent>\n            </Dialog>\n          ) : null}\n          {showManage ? (\n            <Button asChild variant=\"ghost\" size=\"icon\" title={labels.manageTitle} aria-label={labels.manageTitle}>\n              <Link href={manageLinkWithReturnTo}>\n                <Settings className=\"h-4 w-4\" />\n                <span className=\"sr-only\">{labels.manageTitle}</span>\n              </Link>\n            </Button>\n          ) : null}\n        </div>\n      </div>\n      {activeOption && (activeOption.icon || activeOption.color) ? (\n        <div className=\"flex items-center gap-2 text-xs text-muted-foreground\">\n          <span className=\"inline-flex items-center gap-2 rounded border border-dashed px-2 py-1\">\n            {activeOption.icon ? renderDictionaryIcon(activeOption.icon, 'h-4 w-4') : null}\n            {activeOption.color ? renderDictionaryColor(activeOption.color, 'h-4 w-4 rounded-sm') : null}\n          </span>\n          {activeOption.color ? <span>{activeOption.color}</span> : null}\n        </div>\n      ) : null}\n      {loading ? <div className=\"text-xs text-muted-foreground\">{labels.loadingLabel}</div> : null}\n    </div>\n  )\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport Link from 'next/link'\nimport { usePathname, useSearchParams } from 'next/navigation'\nimport { Plus, Settings, Save } from 'lucide-react'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { Input } from '@open-mercato/ui/primitives/input'\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n  DialogTrigger,\n} from '@open-mercato/ui/primitives/dialog'\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from '@open-mercato/ui/primitives/select'\nimport { Spinner } from '@open-mercato/ui/primitives/spinner'\nimport { flash } from '@open-mercato/ui/backend/FlashMessages'\nimport { buildHrefWithReturnTo } from '@open-mercato/shared/lib/navigation/returnTo'\nimport { DictionaryValue, renderDictionaryColor, renderDictionaryIcon } from './dictionaryAppearance'\nimport { AppearanceSelector, type AppearanceSelectorLabels, useAppearanceState } from './AppearanceSelector'\n\nconst DEFAULT_APPEARANCE_LABELS: AppearanceSelectorLabels = {\n  colorLabel: 'Color',\n  colorHelp: 'Pick a highlight color for this entry.',\n  colorClearLabel: 'Remove color',\n  iconLabel: 'Icon or emoji',\n  iconPlaceholder: 'Type an emoji or icon token.',\n  iconPickerTriggerLabel: 'Browse icons and emoji',\n  iconSearchPlaceholder: 'Search icons or emojis\u2026',\n  iconSearchEmptyLabel: 'No icons match your search.',\n  iconSuggestionsLabel: 'Suggestions',\n  iconClearLabel: 'Remove icon',\n  previewEmptyLabel: 'No appearance selected',\n}\n\nexport type DictionaryOption = {\n  value: string\n  label: string\n  color: string | null\n  icon: string | null\n}\n\nexport type DictionarySelectLabels = {\n  placeholder: string\n  addLabel: string\n  addPrompt?: string\n  dialogTitle: string\n  valueLabel: string\n  valuePlaceholder: string\n  labelLabel: string\n  labelPlaceholder: string\n  emptyError: string\n  cancelLabel: string\n  saveLabel: string\n  saveShortcutHint?: string\n  successCreateLabel?: string\n  errorLoad: string\n  errorSave: string\n  loadingLabel: string\n  manageTitle: string\n}\n\nexport type DictionaryEntrySelectProps = {\n  id?: string\n  value?: string\n  onChange: (value: string | undefined) => void\n  fetchOptions: () => Promise<DictionaryOption[]>\n  createOption?: (input: { value: string; label?: string; color?: string | null; icon?: string | null }) => Promise<DictionaryOption | null>\n  labels: DictionarySelectLabels\n  manageHref?: string\n  selectClassName?: string\n  allowInlineCreate?: boolean\n  allowAppearance?: boolean\n  appearanceLabels?: AppearanceSelectorLabels\n  disabled?: boolean\n  showLabelInput?: boolean\n  showManage?: boolean\n  /**\n   * When false, hides the read-only appearance preview (color swatch + icon + hex)\n   * rendered below the trigger for the currently-selected entry. Defaults to true to\n   * preserve existing behavior; set false where the host only wants a plain select\n   * (e.g. a create form that shouldn't surface dictionary styling).\n   */\n  showActiveAppearance?: boolean\n}\n\nexport function DictionaryEntrySelect({\n  id,\n  value,\n  onChange,\n  fetchOptions,\n  createOption,\n  labels,\n  manageHref,\n  selectClassName,\n  allowInlineCreate = true,\n  allowAppearance = false,\n  appearanceLabels,\n  disabled: disabledProp = false,\n  showLabelInput = true,\n  showManage = true,\n  showActiveAppearance = true,\n}: DictionaryEntrySelectProps) {\n  const pathname = usePathname()\n  const searchParams = useSearchParams()\n  const [options, setOptions] = React.useState<DictionaryOption[]>([])\n  const [loading, setLoading] = React.useState(true)\n  const [saving, setSaving] = React.useState(false)\n  const [dialogOpen, setDialogOpen] = React.useState(false)\n  const [newValue, setNewValue] = React.useState('')\n  const [newLabel, setNewLabel] = React.useState('')\n  const [formError, setFormError] = React.useState<string | null>(null)\n  const appearance = useAppearanceState(null, null)\n\n  const loadOptions = React.useCallback(async () => {\n    setLoading(true)\n    try {\n      const items = await fetchOptions()\n      setOptions(items.sort((a, b) => a.label.localeCompare(b.label, undefined, { sensitivity: 'base' })))\n    } catch (err) {\n      console.error('DictionaryEntrySelect.fetchOptions failed', err)\n      flash(labels.errorLoad, 'error')\n      setOptions([])\n    } finally {\n      setLoading(false)\n    }\n  }, [fetchOptions, labels.errorLoad])\n\n  React.useEffect(() => {\n    loadOptions().catch(() => {})\n  }, [loadOptions])\n\n  const resetDialogState = React.useCallback(() => {\n    setNewValue('')\n    setNewLabel('')\n    setFormError(null)\n    appearance.setColor(null)\n    appearance.setIcon(null)\n    setSaving(false)\n  }, [appearance])\n\n  React.useEffect(() => {\n    if (!dialogOpen) resetDialogState()\n  }, [dialogOpen, resetDialogState])\n\n  const activeOption = React.useMemo(\n    () => options.find((option) => option.value === value) ?? null,\n    [options, value],\n  )\n\n  const handleCreate = React.useCallback(async () => {\n    if (!createOption) return\n    const trimmedValue = newValue.trim()\n    if (!trimmedValue.length) {\n      setFormError(labels.emptyError)\n      return\n    }\n    setSaving(true)\n    try {\n      const payload = await createOption({\n        value: trimmedValue,\n        label: showLabelInput ? newLabel.trim() || undefined : undefined,\n        color: allowAppearance && appearance.color ? appearance.color : undefined,\n        icon: allowAppearance && appearance.icon ? appearance.icon : undefined,\n      })\n      if (!payload) throw new Error('createOption did not return an entry')\n      setOptions((previous) => {\n        const map = new Map(previous.map((option) => [option.value, option]))\n        map.set(payload.value, {\n          value: payload.value,\n          label: payload.label,\n          color: payload.color ?? null,\n          icon: payload.icon ?? null,\n        })\n        return Array.from(map.values()).sort((a, b) => a.label.localeCompare(b.label, undefined, { sensitivity: 'base' }))\n      })\n      await loadOptions()\n      onChange(payload.value)\n      setDialogOpen(false)\n      if (labels.successCreateLabel) {\n        flash(labels.successCreateLabel, 'success')\n      }\n    } catch (err) {\n      console.error('DictionaryEntrySelect.createOption failed', err)\n      flash(labels.errorSave, 'error')\n    } finally {\n      setSaving(false)\n    }\n  }, [\n    allowAppearance,\n    appearance.color,\n    appearance.icon,\n    createOption,\n    labels.emptyError,\n    labels.errorSave,\n    labels.successCreateLabel,\n    loadOptions,\n    newLabel,\n    newValue,\n    onChange,\n  ])\n\n  const handleDialogKeyDown = React.useCallback(\n    (event: React.KeyboardEvent) => {\n      if (event.key === 'Escape') {\n        event.preventDefault()\n        if (!saving) {\n          setDialogOpen(false)\n        }\n        return\n      }\n      if (event.key === 'Enter' && (event.metaKey || event.ctrlKey)) {\n        event.preventDefault()\n        if (!saving && newValue.trim().length) {\n          handleCreate().catch(() => {})\n        } else if (!saving && !newValue.trim().length) {\n          setFormError(labels.emptyError)\n        }\n      }\n    },\n    [handleCreate, labels.emptyError, newValue, saving],\n  )\n\n  const shortcutHint = React.useMemo(() => {\n    const provided = typeof labels.saveShortcutHint === 'string' ? labels.saveShortcutHint.trim() : ''\n    if (provided.length) return provided\n    return '\u2318/Ctrl + Enter'\n  }, [labels.saveShortcutHint])\n\n  const disabled = disabledProp || loading || saving\n  const manageLink = manageHref ?? '/backend/config/dictionaries'\n  const returnTo = React.useMemo(() => {\n    const query = searchParams?.toString() ?? ''\n    if (!pathname) return null\n    return query.length ? `${pathname}?${query}` : pathname\n  }, [pathname, searchParams])\n  const manageLinkWithReturnTo = React.useMemo(\n    () => buildHrefWithReturnTo(manageLink, returnTo),\n    [manageLink, returnTo],\n  )\n\n  return (\n    <div className=\"space-y-2\">\n      <div className=\"flex items-center gap-2\">\n        <Select\n          value={value || undefined}\n          onValueChange={(next) => onChange(next || undefined)}\n          disabled={disabled}\n        >\n          <SelectTrigger\n            id={id}\n            className={selectClassName}\n            title={activeOption?.label ?? undefined}\n          >\n            <SelectValue placeholder={labels.placeholder} />\n          </SelectTrigger>\n          <SelectContent>\n            {options.map((option) => (\n              <SelectItem key={option.value} value={option.value}>\n                {option.label}\n              </SelectItem>\n            ))}\n          </SelectContent>\n        </Select>\n        <div className=\"flex items-center gap-1\">\n          {allowInlineCreate && createOption ? (\n            <Dialog open={dialogOpen} onOpenChange={setDialogOpen}>\n              <DialogTrigger asChild>\n                <Button\n                  type=\"button\"\n                  variant=\"outline\"\n                  size=\"icon\"\n                  disabled={disabled}\n                  title={labels.addLabel}\n                  aria-label={labels.addLabel}\n                >\n                  <Plus className=\"h-4 w-4\" />\n                </Button>\n              </DialogTrigger>\n              <DialogContent className=\"sm:max-w-md\" onKeyDown={handleDialogKeyDown}>\n                <DialogHeader>\n                  <DialogTitle>{labels.dialogTitle}</DialogTitle>\n                  {labels.addPrompt ? <DialogDescription>{labels.addPrompt}</DialogDescription> : null}\n                </DialogHeader>\n                <div className=\"space-y-4\">\n                  <div className=\"space-y-2\">\n                    <label className=\"text-sm font-medium\">{labels.valueLabel}</label>\n                    <Input\n                      type=\"text\"\n                      value={newValue}\n                      onChange={(event) => {\n                        setNewValue(event.target.value)\n                        if (formError) setFormError(null)\n                      }}\n                      placeholder={labels.valuePlaceholder}\n                      autoFocus\n                      disabled={saving}\n                    />\n                  </div>\n                  {showLabelInput ? (\n                    <div className=\"space-y-2\">\n                      <label className=\"text-sm font-medium\">{labels.labelLabel}</label>\n                      <Input\n                        type=\"text\"\n                        value={newLabel}\n                        onChange={(event) => setNewLabel(event.target.value)}\n                        placeholder={labels.labelPlaceholder}\n                        disabled={saving}\n                      />\n                    </div>\n                  ) : null}\n                  {allowAppearance ? (\n                    <AppearanceSelector\n                      icon={appearance.icon}\n                      color={appearance.color}\n                      onIconChange={appearance.setIcon}\n                      onColorChange={appearance.setColor}\n                      labels={appearanceLabels ?? DEFAULT_APPEARANCE_LABELS}\n                    />\n                  ) : null}\n                  {formError ? <p className=\"text-sm text-red-600\">{formError}</p> : null}\n                </div>\n                <DialogFooter>\n                  <Button type=\"button\" variant=\"outline\" onClick={() => setDialogOpen(false)} disabled={saving}>\n                    {labels.cancelLabel}\n                  </Button>\n                  <Button type=\"button\" onClick={handleCreate} disabled={saving || !newValue.trim()}>\n                    {saving ? <Spinner className=\"mr-2 h-4 w-4\" /> : <Save className=\"mr-2 h-4 w-4\" />}\n                    <span className=\"flex items-center gap-2\">\n                      <span>{labels.saveLabel}</span>\n                      {!saving ? (\n                        <span className=\"text-xs text-muted-foreground\">{`(${shortcutHint})`}</span>\n                      ) : null}\n                    </span>\n                  </Button>\n                </DialogFooter>\n              </DialogContent>\n            </Dialog>\n          ) : null}\n          {showManage ? (\n            <Button asChild variant=\"ghost\" size=\"icon\" title={labels.manageTitle} aria-label={labels.manageTitle}>\n              <Link href={manageLinkWithReturnTo}>\n                <Settings className=\"h-4 w-4\" />\n                <span className=\"sr-only\">{labels.manageTitle}</span>\n              </Link>\n            </Button>\n          ) : null}\n        </div>\n      </div>\n      {showActiveAppearance && activeOption && (activeOption.icon || activeOption.color) ? (\n        <div className=\"flex items-center gap-2 text-xs text-muted-foreground\">\n          <span className=\"inline-flex items-center gap-2 rounded border border-dashed px-2 py-1\">\n            {activeOption.icon ? renderDictionaryIcon(activeOption.icon, 'h-4 w-4') : null}\n            {activeOption.color ? renderDictionaryColor(activeOption.color, 'h-4 w-4 rounded-sm') : null}\n          </span>\n          {activeOption.color ? <span>{activeOption.color}</span> : null}\n        </div>\n      ) : null}\n      {loading ? <div className=\"text-xs text-muted-foreground\">{labels.loadingLabel}</div> : null}\n    </div>\n  )\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@open-mercato/core",
-  "version": "0.6.4-develop.3929.1.fcf7afece2",
+  "version": "0.6.4-develop.3944.1.4100aa7fbe",
   "type": "module",
   "main": "./dist/index.js",
   "scripts": {
@@ -243,16 +243,16 @@
     "zod": "^4.4.3"
   },
   "peerDependencies": {
-    "@open-mercato/ai-assistant": "0.6.4-develop.3929.1.fcf7afece2",
-    "@open-mercato/shared": "0.6.4-develop.3929.1.fcf7afece2",
-    "@open-mercato/ui": "0.6.4-develop.3929.1.fcf7afece2",
+    "@open-mercato/ai-assistant": "0.6.4-develop.3944.1.4100aa7fbe",
+    "@open-mercato/shared": "0.6.4-develop.3944.1.4100aa7fbe",
+    "@open-mercato/ui": "0.6.4-develop.3944.1.4100aa7fbe",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   },
   "devDependencies": {
-    "@open-mercato/ai-assistant": "0.6.4-develop.3929.1.fcf7afece2",
-    "@open-mercato/shared": "0.6.4-develop.3929.1.fcf7afece2",
-    "@open-mercato/ui": "0.6.4-develop.3929.1.fcf7afece2",
+    "@open-mercato/ai-assistant": "0.6.4-develop.3944.1.4100aa7fbe",
+    "@open-mercato/shared": "0.6.4-develop.3944.1.4100aa7fbe",
+    "@open-mercato/ui": "0.6.4-develop.3944.1.4100aa7fbe",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.1",

package/src/modules/customers/backend/customers/deals/create/page.tsx

@@ -1,13 +1,9 @@
 "use client"
 
 import * as React from 'react'
-import { useRouter, useSearchParams } from 'next/navigation'
+import { useSearchParams } from 'next/navigation'
 import { Page, PageBody } from '@open-mercato/ui/backend/Page'
-import { flash } from '@open-mercato/ui/backend/FlashMessages'
-import { createCrud } from '@open-mercato/ui/backend/utils/crud'
-import { useT } from '@open-mercato/shared/lib/i18n/context'
-import { DealForm, type DealFormSubmitPayload } from '../../../../components/detail/DealForm'
-import { useCurrencyDictionary } from '../../../../components/detail/hooks/useCurrencyDictionary'
+import { CreateDealForm } from '../../../../components/detail/create/CreateDealForm'
 
 const DEFAULT_RETURN_TO = '/backend/customers/deals'
 
@@ -24,73 +20,16 @@ function resolveReturnTo(value: string | null | undefined): string {
 }
 
 export default function CreateDealPage() {
-  const t = useT()
-  const router = useRouter()
   const searchParams = useSearchParams()
   const returnTo = React.useMemo(
     () => resolveReturnTo(searchParams?.get('returnTo') ?? null),
     [searchParams],
   )
-  const [isSubmitting, setIsSubmitting] = React.useState(false)
-  useCurrencyDictionary()
-
-  const handleCancel = React.useCallback(() => {
-    router.push(returnTo)
-  }, [router, returnTo])
-
-  const handleSubmit = React.useCallback(
-    async ({ base, custom }: DealFormSubmitPayload) => {
-      if (isSubmitting) return
-      setIsSubmitting(true)
-      try {
-        const payload: Record<string, unknown> = {
-          title: base.title,
-          status: base.status ?? undefined,
-          pipelineStage: base.pipelineStage ?? undefined,
-          pipelineId: base.pipelineId ?? undefined,
-          pipelineStageId: base.pipelineStageId ?? undefined,
-          valueAmount: typeof base.valueAmount === 'number' ? base.valueAmount : undefined,
-          valueCurrency: base.valueCurrency ?? undefined,
-          probability: typeof base.probability === 'number' ? base.probability : undefined,
-          expectedCloseAt: base.expectedCloseAt ?? undefined,
-          description: base.description ?? undefined,
-          personIds: Array.isArray(base.personIds) && base.personIds.length ? base.personIds : undefined,
-          companyIds: Array.isArray(base.companyIds) && base.companyIds.length ? base.companyIds : undefined,
-        }
-        if (Object.keys(custom).length) payload.customFields = custom
-
-        await createCrud('customers/deals', payload, {
-          errorMessage: t('customers.deals.create.error', 'Failed to create deal.'),
-        })
-        flash(t('customers.people.detail.deals.success', 'Deal created.'), 'success')
-        router.push(returnTo)
-      } catch (err) {
-        const message =
-          err instanceof Error
-            ? err.message
-            : t('customers.deals.create.error', 'Failed to create deal.')
-        flash(message, 'error')
-        throw err instanceof Error ? err : new Error(message)
-      } finally {
-        setIsSubmitting(false)
-      }
-    },
-    [isSubmitting, returnTo, router, t],
-  )
 
   return (
     <Page>
       <PageBody>
-        <DealForm
-          mode="create"
-          onSubmit={handleSubmit}
-          onCancel={handleCancel}
-          isSubmitting={isSubmitting}
-          submitLabel={t('customers.deals.create.submit', 'Create deal')}
-          embedded={false}
-          title={t('customers.deals.create.title', 'Create deal')}
-          backHref={returnTo}
-        />
+        <CreateDealForm returnTo={returnTo} />
       </PageBody>
     </Page>
   )

package/src/modules/customers/components/detail/DealForm.tsx

@@ -177,6 +177,8 @@ const schema = z.object({
   companyIds: z.array(z.string().trim().min(1)).optional(),
 }).passthrough()
 
+export const dealFormSchema = schema
+
 import { toDateInputValue as toDateInputValueOrNull } from '@open-mercato/shared/lib/date/format'
 
 function toDateInputValue(value: string | null | undefined): string {

package/src/modules/customers/components/detail/create/CreateDealForm.tsx

@@ -0,0 +1,254 @@
+"use client"
+
+import * as React from 'react'
+import { useRouter } from 'next/navigation'
+import { Briefcase, Save } from 'lucide-react'
+import { useT } from '@open-mercato/shared/lib/i18n/context'
+import { translateWithFallback } from '@open-mercato/shared/lib/i18n/translate'
+import { flash } from '@open-mercato/ui/backend/FlashMessages'
+import { createCrud } from '@open-mercato/ui/backend/utils/crud'
+import { useGuardedMutation } from '@open-mercato/ui/backend/injection/useGuardedMutation'
+import { FormHeader } from '@open-mercato/ui/backend/forms'
+import { Button } from '@open-mercato/ui/primitives/button'
+import { Spinner } from '@open-mercato/ui/primitives/spinner'
+import { dealFormSchema } from '../DealForm'
+import { createDictionarySelectLabels } from '../utils'
+import { DealSectionCard } from './DealSectionCard'
+import { DealDetailsFields } from './DealDetailsFields'
+import { DealAssociationsSection } from './DealAssociationsSection'
+import { DealCreateSidebar } from './DealCreateSidebar'
+import { useDealPipelines } from './useDealPipelines'
+import { useDealCustomFields } from './useDealCustomFields'
+import { EMPTY_VALUES, type BaseValues } from './dealFormTypes'
+
+const CONTEXT_ID = 'customers.deals.create'
+const DEAL_ENTITY_ID = 'customers:customer_deal'
+const CUSTOM_FIELDS_MANAGE_HREF = `/backend/entities/system/${encodeURIComponent(DEAL_ENTITY_ID)}`
+
+export type CreateDealFormProps = {
+  returnTo: string
+}
+
+export function CreateDealForm({ returnTo }: CreateDealFormProps) {
+  const t = useT()
+  const router = useRouter()
+  const tr = React.useCallback(
+    (key: string, fallback: string, params?: Record<string, string | number>) =>
+      translateWithFallback(t, key, fallback, params),
+    [t],
+  )
+
+  const [values, setValues] = React.useState<BaseValues>(EMPTY_VALUES)
+  const [errors, setErrors] = React.useState<Record<string, string>>({})
+  const [isSubmitting, setIsSubmitting] = React.useState(false)
+
+  const { pipelines, stages, loadStages } = useDealPipelines()
+  const {
+    customValues,
+    customFieldsLoaded,
+    customCount,
+    handleCustomChange,
+    handleCustomAttributesLoaded,
+    validateCustomFields,
+    collectNormalizedCustomValues,
+  } = useDealCustomFields(tr)
+
+  const { runMutation, retryLastMutation } = useGuardedMutation<{
+    formId: string
+    resourceKind: string
+    retryLastMutation: () => Promise<boolean>
+  }>({
+    contextId: CONTEXT_ID,
+    blockedMessage: tr('ui.forms.flash.saveBlocked', 'Save blocked by validation'),
+  })
+
+  const statusLabels = React.useMemo(
+    () => createDictionarySelectLabels('deal-statuses', (key, fallback) => tr(key, fallback ?? key)),
+    [tr],
+  )
+
+  const patch = React.useCallback((partial: Partial<BaseValues>) => {
+    setValues((current) => ({ ...current, ...partial }))
+  }, [])
+
+  const handlePipelineChange = React.useCallback(
+    (id: string) => {
+      patch({ pipelineId: id, pipelineStageId: '' })
+      // loadStages resets stages to [] on failure; the rejection is intentionally ignored here.
+      loadStages(id).catch(() => {})
+    },
+    [loadStages, patch],
+  )
+
+  const handleCancel = React.useCallback(() => {
+    router.push(returnTo)
+  }, [returnTo, router])
+
+  const handleSubmit = React.useCallback(async () => {
+    if (isSubmitting) return
+    if (!customFieldsLoaded) {
+      flash(tr('customers.deals.create.sections.custom.loading', 'Loading custom fields...'), 'error')
+      return
+    }
+    const merged = { ...values, ...customValues }
+    const parsed = dealFormSchema.safeParse(merged)
+    if (!parsed.success) {
+      const fieldErrors: Record<string, string> = {}
+      for (const issue of parsed.error.issues) {
+        const key = typeof issue.path[0] === 'string' ? issue.path[0] : undefined
+        if (key && !fieldErrors[key]) fieldErrors[key] = tr(issue.message, issue.message)
+      }
+      setErrors(fieldErrors)
+      const firstMessage = Object.values(fieldErrors)[0]
+      if (firstMessage) flash(firstMessage, 'error')
+      return
+    }
+
+    const customFieldErrors = validateCustomFields(merged)
+    if (Object.keys(customFieldErrors).length) {
+      setErrors(customFieldErrors)
+      const firstMessage = Object.values(customFieldErrors)[0]
+      if (firstMessage) flash(firstMessage, 'error')
+      return
+    }
+
+    setErrors({})
+    setIsSubmitting(true)
+    try {
+      const data = parsed.data
+      const expectedCloseAt =
+        data.expectedCloseAt && data.expectedCloseAt.length
+          ? new Date(data.expectedCloseAt).toISOString()
+          : undefined
+      const payload: Record<string, unknown> = {
+        title: data.title,
+        status: data.status || undefined,
+        pipelineId: data.pipelineId || undefined,
+        pipelineStageId: data.pipelineStageId || undefined,
+        valueAmount: typeof data.valueAmount === 'number' ? data.valueAmount : undefined,
+        valueCurrency: data.valueCurrency || undefined,
+        probability: typeof data.probability === 'number' ? data.probability : undefined,
+        expectedCloseAt,
+        description: data.description && data.description.length ? data.description : undefined,
+        personIds: values.personIds.length ? values.personIds : undefined,
+        companyIds: values.companyIds.length ? values.companyIds : undefined,
+      }
+      const custom = collectNormalizedCustomValues(merged)
+      if (Object.keys(custom).length) payload.customFields = custom
+
+      await runMutation({
+        operation: () =>
+          createCrud('customers/deals', payload, {
+            errorMessage: tr('customers.deals.create.error', 'Failed to create deal.'),
+          }),
+        context: { formId: CONTEXT_ID, resourceKind: 'customers.deal', retryLastMutation },
+        mutationPayload: payload,
+      })
+      flash(tr('customers.people.detail.deals.success', 'Deal created.'), 'success')
+      router.push(returnTo)
+    } catch (err) {
+      const message = err instanceof Error ? err.message : tr('customers.deals.create.error', 'Failed to create deal.')
+      flash(message, 'error')
+    } finally {
+      setIsSubmitting(false)
+    }
+  }, [
+    collectNormalizedCustomValues,
+    customFieldsLoaded,
+    customValues,
+    isSubmitting,
+    retryLastMutation,
+    returnTo,
+    router,
+    runMutation,
+    tr,
+    validateCustomFields,
+    values,
+  ])
+
+  const onKeyDown = React.useCallback(
+    (event: React.KeyboardEvent<HTMLFormElement>) => {
+      if ((event.metaKey || event.ctrlKey) && event.key === 'Enter') {
+        event.preventDefault()
+        handleSubmit()
+      }
+    },
+    [handleSubmit],
+  )
+
+  const onFormSubmit = React.useCallback(
+    (event: React.FormEvent<HTMLFormElement>) => {
+      event.preventDefault()
+      handleSubmit()
+    },
+    [handleSubmit],
+  )
+
+  const cancelLabel = tr('customers.deals.create.cancel', 'Cancel')
+  const submitLabel = tr('customers.deals.create.submit', 'Create deal')
+  const submitDisabled = !customFieldsLoaded
+
+  return (
+    <form className="mx-auto max-w-screen-2xl" onKeyDown={onKeyDown} onSubmit={onFormSubmit} noValidate>
+      <FormHeader
+        backHref={returnTo}
+        backLabel={tr('customers.deals.create.back', 'Back to deals')}
+      />
+
+      <div className="mt-6 grid grid-cols-1 gap-5 lg:grid-cols-[minmax(0,1fr)_330px]">
+        <div className="space-y-4">
+          <DealSectionCard
+            icon={Briefcase}
+            title={tr('customers.deals.create.title', 'Create deal')}
+            subtitle={tr('customers.deals.create.sections.details.subtitle', 'Core opportunity info')}
+            actions={
+              <>
+                <Button type="button" variant="outline" onClick={handleCancel} disabled={isSubmitting}>
+                  {cancelLabel}
+                </Button>
+                <Button type="button" onClick={handleSubmit} disabled={isSubmitting || submitDisabled}>
+                  {isSubmitting ? <Spinner className="size-4" /> : <Save className="size-4" />}
+                  {submitLabel}
+                </Button>
+              </>
+            }
+          >
+            <DealDetailsFields
+              values={values}
+              errors={errors}
+              isSubmitting={isSubmitting}
+              patch={patch}
+              onPipelineChange={handlePipelineChange}
+              pipelines={pipelines}
+              stages={stages}
+              statusLabels={statusLabels}
+              tr={tr}
+            />
+          </DealSectionCard>
+
+          <DealAssociationsSection
+            tr={tr}
+            personIds={values.personIds}
+            companyIds={values.companyIds}
+            onPeopleChange={(next) => patch({ personIds: next })}
+            onCompaniesChange={(next) => patch({ companyIds: next })}
+            disabled={isSubmitting}
+          />
+        </div>
+
+        <DealCreateSidebar
+          tr={tr}
+          customValues={customValues}
+          onCustomChange={handleCustomChange}
+          errors={errors}
+          disabled={isSubmitting}
+          customCount={customCount}
+          manageHref={CUSTOM_FIELDS_MANAGE_HREF}
+          onCustomLoaded={handleCustomAttributesLoaded}
+        />
+      </div>
+    </form>
+  )
+}
+
+export default CreateDealForm