@open-mercato/core 0.6.7-develop.6827.1.a575bebce9 → 0.6.7-develop.6834.1.e76f4b8cbc

package/dist/modules/workflows/components/fields/WorkflowSelectorField.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/modules/workflows/components/fields/WorkflowSelectorField.tsx"],
-  "sourcesContent": ["'use client'\n\nimport { useState, useEffect } from 'react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { useConfirmDialog } from '@open-mercato/ui/backend/confirm-dialog'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { Badge } from '@open-mercato/ui/primitives/badge'\nimport { Label } from '@open-mercato/ui/primitives/label'\nimport { Search, X, Loader2, AlertCircle, Workflow } from 'lucide-react'\nimport type { CrudCustomFieldRenderProps } from '@open-mercato/ui/backend/CrudForm'\nimport { WorkflowSelector, type WorkflowDefinition } from '../WorkflowSelector'\nimport { apiFetch } from '@open-mercato/ui/backend/utils/api'\nimport { createLogger } from '@open-mercato/shared/lib/logger'\n\nconst logger = createLogger('workflows')\n\ninterface WorkflowSelectorFieldProps extends CrudCustomFieldRenderProps {\n  value: string\n  label?: string\n  description?: string\n}\n\ninterface WorkflowDetails {\n  workflowId: string\n  workflowName?: string\n  version?: number\n  enabled?: boolean\n  description?: string | null\n  loading?: boolean\n  error?: boolean\n}\n\n/**\n * WorkflowSelectorField - Custom field component for selecting a sub-workflow\n *\n * Integrates with WorkflowSelector modal to pick a workflow.\n * Fetches and displays workflow details for the selected workflow ID.\n * Allows clearing the selection.\n *\n * Used by NodeEditDialog (SubWorkflow type only)\n */\nexport function WorkflowSelectorField({\n  id,\n  value = '',\n  error,\n  setValue,\n  disabled,\n  label: labelProp,\n  description: descriptionProp,\n}: WorkflowSelectorFieldProps) {\n  const t = useT()\n  const { confirm, ConfirmDialogElement } = useConfirmDialog()\n  const label = labelProp ?? t('workflows.fieldEditors.workflowSelector.label')\n  const description = descriptionProp ?? t('workflows.fieldEditors.workflowSelector.description')\n  const [isModalOpen, setIsModalOpen] = useState(false)\n  const [workflowDetails, setWorkflowDetails] = useState<WorkflowDetails | null>(null)\n\n  const workflowId = value || ''\n\n  // Fetch workflow details when workflowId changes\n  useEffect(() => {\n    if (workflowId) {\n      setWorkflowDetails({ workflowId, loading: true })\n      fetchWorkflowDetails(workflowId)\n    } else {\n      setWorkflowDetails(null)\n    }\n  }, [workflowId])\n\n  const fetchWorkflowDetails = async (wfId: string) => {\n    try {\n      const params = new URLSearchParams({ workflowId: wfId, limit: '1' })\n      const response = await apiFetch(`/api/workflows/definitions?${params.toString()}`)\n\n      if (response.ok) {\n        const result = await response.json()\n        const workflow = result.data?.[0] as WorkflowDefinition | undefined\n\n        setWorkflowDetails({\n          workflowId: wfId,\n          workflowName: workflow?.workflowName,\n          version: workflow?.version,\n          enabled: workflow?.enabled,\n          description: workflow?.description,\n          loading: false,\n          error: !workflow,\n        })\n      } else {\n        setWorkflowDetails({\n          workflowId: wfId,\n          loading: false,\n          error: true,\n        })\n      }\n    } catch (err) {\n      logger.error('Failed to fetch workflow details', { workflowId: wfId, err })\n      setWorkflowDetails({\n        workflowId: wfId,\n        loading: false,\n        error: true,\n      })\n    }\n  }\n\n  const handleSelect = (selectedWorkflowId: string, _workflow: WorkflowDefinition) => {\n    setValue(selectedWorkflowId)\n    setIsModalOpen(false)\n  }\n\n  const handleClear = async () => {\n    const confirmed = await confirm({\n      title: t('workflows.common.clear'),\n      text: t('workflows.fieldEditors.workflowSelector.confirmClear'),\n      variant: 'default',\n    })\n    if (!confirmed) return\n\n    setValue('')\n    setWorkflowDetails(null)\n  }\n\n  return (\n    <div className=\"space-y-2\">\n      <div>\n        <Label htmlFor={id} className=\"text-sm font-medium\">\n          {label}\n        </Label>\n        <p className=\"text-xs text-muted-foreground mt-0.5\">\n          {description}\n        </p>\n        {error && <p className=\"text-xs text-red-600 mt-1\">{error}</p>}\n      </div>\n\n      {!workflowId ? (\n        /* No Workflow Selected */\n        <div className=\"border-2 border-dashed border-gray-300 rounded-lg p-6 text-center\">\n          <Workflow className=\"size-8 text-muted-foreground mx-auto mb-2\" />\n          <p className=\"text-sm text-muted-foreground mb-3\">{t('workflows.fieldEditors.workflowSelector.noWorkflowSelected')}</p>\n          <Button\n            type=\"button\"\n            size=\"sm\"\n            onClick={() => setIsModalOpen(true)}\n            disabled={disabled}\n          >\n            <Search className=\"size-3 mr-1\" />\n            {t('workflows.fieldEditors.workflowSelector.browseWorkflows')}\n          </Button>\n        </div>\n      ) : (\n        /* Workflow Selected */\n        <div className=\"border border-gray-200 rounded-lg bg-white p-4\">\n          <div className=\"flex items-start justify-between\">\n            <div className=\"flex-1 min-w-0 space-y-2\">\n              {workflowDetails?.loading ? (\n                <div className=\"flex items-center gap-2\">\n                  <Loader2 className=\"size-4 animate-spin text-muted-foreground\" />\n                  <span className=\"text-sm text-muted-foreground\">{t('workflows.common.loadingDetails')}</span>\n                </div>\n              ) : workflowDetails?.error ? (\n                <>\n                  <div className=\"flex items-center gap-2\">\n                    <AlertCircle className=\"size-4 text-yellow-600\" />\n                    <span className=\"text-sm font-semibold text-gray-900\">{workflowId}</span>\n                  </div>\n                  <p className=\"text-xs text-yellow-600\">{t('workflows.common.workflowNotFoundOrUnavailable')}</p>\n                </>\n              ) : (\n                <>\n                  <div>\n                    <div className=\"flex items-center gap-2\">\n                      <span className=\"text-sm font-semibold text-gray-900\">\n                        {workflowDetails?.workflowName || workflowId}\n                      </span>\n                      {workflowDetails?.version !== undefined && (\n                        <Badge variant=\"secondary\" className=\"text-xs\">\n                          v{workflowDetails.version}\n                        </Badge>\n                      )}\n                      {workflowDetails?.enabled !== undefined && (\n                        workflowDetails.enabled ? (\n                          <Badge variant=\"default\" className=\"bg-emerald-500 text-xs\">\n                            {t('common.enabled')}\n                          </Badge>\n                        ) : (\n                          <Badge variant=\"secondary\" className=\"text-xs\">\n                            {t('common.disabled')}\n                          </Badge>\n                        )\n                      )}\n                    </div>\n                    <p className=\"text-xs text-muted-foreground font-mono mt-0.5\">{workflowId}</p>\n                  </div>\n                  {workflowDetails?.description && (\n                    <p className=\"text-xs text-muted-foreground\">{workflowDetails.description}</p>\n                  )}\n                </>\n              )}\n            </div>\n\n            {/* Actions */}\n            <div className=\"flex items-center gap-2 ml-4 flex-shrink-0\">\n              <Button\n                type=\"button\"\n                variant=\"outline\"\n                size=\"sm\"\n                onClick={() => setIsModalOpen(true)}\n                disabled={disabled}\n              >\n                <Search className=\"size-3 mr-1\" />\n                {t('workflows.common.change')}\n              </Button>\n              <Button\n                type=\"button\"\n                variant=\"ghost\"\n                size=\"sm\"\n                onClick={handleClear}\n                disabled={disabled}\n              >\n                <X className=\"size-4\" />\n              </Button>\n            </div>\n          </div>\n        </div>\n      )}\n\n      {/* Workflow Selector Modal */}\n      <WorkflowSelector\n        isOpen={isModalOpen}\n        onClose={() => setIsModalOpen(false)}\n        onSelect={handleSelect}\n        excludeWorkflowIds={workflowId ? [workflowId] : []}\n        title={t('workflows.fieldEditors.workflowSelector.selectSubWorkflow')}\n        description={t('workflows.fieldEditors.workflowSelector.selectSubWorkflowDescription')}\n        onlyEnabled={true}\n      />\n      {ConfirmDialogElement}\n    </div>\n  )\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client'\n\nimport { useState, useEffect } from 'react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { useConfirmDialog } from '@open-mercato/ui/backend/confirm-dialog'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { Badge } from '@open-mercato/ui/primitives/badge'\nimport { Label } from '@open-mercato/ui/primitives/label'\nimport { Search, X, Loader2, AlertCircle, Workflow } from 'lucide-react'\nimport type { CrudCustomFieldRenderProps } from '@open-mercato/ui/backend/CrudForm'\nimport { WorkflowSelector, type WorkflowDefinition } from '../WorkflowSelector'\nimport { apiFetch } from '@open-mercato/ui/backend/utils/api'\nimport { createLogger } from '@open-mercato/shared/lib/logger'\n\nconst logger = createLogger('workflows')\n\ninterface WorkflowSelectorFieldProps extends CrudCustomFieldRenderProps {\n  value: string\n  label?: string\n  description?: string\n}\n\ninterface WorkflowDetails {\n  workflowId: string\n  workflowName?: string\n  version?: number\n  enabled?: boolean\n  description?: string | null\n  loading?: boolean\n  error?: boolean\n}\n\n/**\n * WorkflowSelectorField - Custom field component for selecting a sub-workflow\n *\n * Integrates with WorkflowSelector modal to pick a workflow.\n * Fetches and displays workflow details for the selected workflow ID.\n * Allows clearing the selection.\n *\n * Used by NodeEditDialog (SubWorkflow type only)\n */\nexport function WorkflowSelectorField({\n  id,\n  value = '',\n  error,\n  setValue,\n  disabled,\n  label: labelProp,\n  description: descriptionProp,\n}: WorkflowSelectorFieldProps) {\n  const t = useT()\n  const { confirm, ConfirmDialogElement } = useConfirmDialog()\n  const label = labelProp ?? t('workflows.fieldEditors.workflowSelector.label')\n  const description = descriptionProp ?? t('workflows.fieldEditors.workflowSelector.description')\n  const [isModalOpen, setIsModalOpen] = useState(false)\n  const [workflowDetails, setWorkflowDetails] = useState<WorkflowDetails | null>(null)\n\n  const workflowId = value || ''\n\n  // Fetch workflow details when workflowId changes\n  useEffect(() => {\n    if (workflowId) {\n      setWorkflowDetails({ workflowId, loading: true })\n      fetchWorkflowDetails(workflowId)\n    } else {\n      setWorkflowDetails(null)\n    }\n  }, [workflowId])\n\n  const fetchWorkflowDetails = async (wfId: string) => {\n    try {\n      const params = new URLSearchParams({ workflowId: wfId, limit: '1' })\n      const response = await apiFetch(`/api/workflows/definitions?${params.toString()}`)\n\n      if (response.ok) {\n        const result = await response.json()\n        const workflow = result.data?.[0] as WorkflowDefinition | undefined\n\n        setWorkflowDetails({\n          workflowId: wfId,\n          workflowName: workflow?.workflowName,\n          version: workflow?.version,\n          enabled: workflow?.enabled,\n          description: workflow?.description,\n          loading: false,\n          error: !workflow,\n        })\n      } else {\n        setWorkflowDetails({\n          workflowId: wfId,\n          loading: false,\n          error: true,\n        })\n      }\n    } catch (err) {\n      logger.error('Failed to fetch workflow details', { workflowId: wfId, err })\n      setWorkflowDetails({\n        workflowId: wfId,\n        loading: false,\n        error: true,\n      })\n    }\n  }\n\n  const handleSelect = (selectedWorkflowId: string, _workflow: WorkflowDefinition) => {\n    setValue(selectedWorkflowId)\n    setIsModalOpen(false)\n  }\n\n  const handleClear = async () => {\n    const confirmed = await confirm({\n      title: t('workflows.common.clear'),\n      text: t('workflows.fieldEditors.workflowSelector.confirmClear'),\n      variant: 'default',\n    })\n    if (!confirmed) return\n\n    setValue('')\n    setWorkflowDetails(null)\n  }\n\n  return (\n    <div className=\"space-y-2\">\n      <div>\n        <Label htmlFor={id} className=\"text-sm font-medium\">\n          {label}\n        </Label>\n        <p className=\"text-xs text-muted-foreground mt-0.5\">\n          {description}\n        </p>\n        {error && <p className=\"text-xs text-status-error-text mt-1\">{error}</p>}\n      </div>\n\n      {!workflowId ? (\n        /* No Workflow Selected */\n        <div className=\"border-2 border-dashed border-gray-300 rounded-lg p-6 text-center\">\n          <Workflow className=\"size-8 text-muted-foreground mx-auto mb-2\" />\n          <p className=\"text-sm text-muted-foreground mb-3\">{t('workflows.fieldEditors.workflowSelector.noWorkflowSelected')}</p>\n          <Button\n            type=\"button\"\n            size=\"sm\"\n            onClick={() => setIsModalOpen(true)}\n            disabled={disabled}\n          >\n            <Search className=\"size-3 mr-1\" />\n            {t('workflows.fieldEditors.workflowSelector.browseWorkflows')}\n          </Button>\n        </div>\n      ) : (\n        /* Workflow Selected */\n        <div className=\"border border-gray-200 rounded-lg bg-white p-4\">\n          <div className=\"flex items-start justify-between\">\n            <div className=\"flex-1 min-w-0 space-y-2\">\n              {workflowDetails?.loading ? (\n                <div className=\"flex items-center gap-2\">\n                  <Loader2 className=\"size-4 animate-spin text-muted-foreground\" />\n                  <span className=\"text-sm text-muted-foreground\">{t('workflows.common.loadingDetails')}</span>\n                </div>\n              ) : workflowDetails?.error ? (\n                <>\n                  <div className=\"flex items-center gap-2\">\n                    <AlertCircle className=\"size-4 text-status-warning-text\" />\n                    <span className=\"text-sm font-semibold text-gray-900\">{workflowId}</span>\n                  </div>\n                  <p className=\"text-xs text-status-warning-text\">{t('workflows.common.workflowNotFoundOrUnavailable')}</p>\n                </>\n              ) : (\n                <>\n                  <div>\n                    <div className=\"flex items-center gap-2\">\n                      <span className=\"text-sm font-semibold text-gray-900\">\n                        {workflowDetails?.workflowName || workflowId}\n                      </span>\n                      {workflowDetails?.version !== undefined && (\n                        <Badge variant=\"secondary\" className=\"text-xs\">\n                          v{workflowDetails.version}\n                        </Badge>\n                      )}\n                      {workflowDetails?.enabled !== undefined && (\n                        workflowDetails.enabled ? (\n                          <Badge variant=\"default\" className=\"bg-status-success-solid text-status-success-solid-foreground text-xs\">\n                            {t('common.enabled')}\n                          </Badge>\n                        ) : (\n                          <Badge variant=\"secondary\" className=\"text-xs\">\n                            {t('common.disabled')}\n                          </Badge>\n                        )\n                      )}\n                    </div>\n                    <p className=\"text-xs text-muted-foreground font-mono mt-0.5\">{workflowId}</p>\n                  </div>\n                  {workflowDetails?.description && (\n                    <p className=\"text-xs text-muted-foreground\">{workflowDetails.description}</p>\n                  )}\n                </>\n              )}\n            </div>\n\n            {/* Actions */}\n            <div className=\"flex items-center gap-2 ml-4 flex-shrink-0\">\n              <Button\n                type=\"button\"\n                variant=\"outline\"\n                size=\"sm\"\n                onClick={() => setIsModalOpen(true)}\n                disabled={disabled}\n              >\n                <Search className=\"size-3 mr-1\" />\n                {t('workflows.common.change')}\n              </Button>\n              <Button\n                type=\"button\"\n                variant=\"ghost\"\n                size=\"sm\"\n                onClick={handleClear}\n                disabled={disabled}\n              >\n                <X className=\"size-4\" />\n              </Button>\n            </div>\n          </div>\n        </div>\n      )}\n\n      {/* Workflow Selector Modal */}\n      <WorkflowSelector\n        isOpen={isModalOpen}\n        onClose={() => setIsModalOpen(false)}\n        onSelect={handleSelect}\n        excludeWorkflowIds={workflowId ? [workflowId] : []}\n        title={t('workflows.fieldEditors.workflowSelector.selectSubWorkflow')}\n        description={t('workflows.fieldEditors.workflowSelector.selectSubWorkflowDescription')}\n        onlyEnabled={true}\n      />\n      {ConfirmDialogElement}\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.7-develop.6827.1.a575bebce9",
+  "version": "0.6.7-develop.6834.1.e76f4b8cbc",
   "license": "MIT",
   "type": "module",
   "main": "./dist/index.js",
@@ -254,16 +254,16 @@
     "zod": "^4.4.3"
   },
   "peerDependencies": {
-    "@open-mercato/ai-assistant": "0.6.7-develop.6827.1.a575bebce9",
-    "@open-mercato/shared": "0.6.7-develop.6827.1.a575bebce9",
-    "@open-mercato/ui": "0.6.7-develop.6827.1.a575bebce9",
+    "@open-mercato/ai-assistant": "0.6.7-develop.6834.1.e76f4b8cbc",
+    "@open-mercato/shared": "0.6.7-develop.6834.1.e76f4b8cbc",
+    "@open-mercato/ui": "0.6.7-develop.6834.1.e76f4b8cbc",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   },
   "devDependencies": {
-    "@open-mercato/ai-assistant": "0.6.7-develop.6827.1.a575bebce9",
-    "@open-mercato/shared": "0.6.7-develop.6827.1.a575bebce9",
-    "@open-mercato/ui": "0.6.7-develop.6827.1.a575bebce9",
+    "@open-mercato/ai-assistant": "0.6.7-develop.6834.1.e76f4b8cbc",
+    "@open-mercato/shared": "0.6.7-develop.6834.1.e76f4b8cbc",
+    "@open-mercato/ui": "0.6.7-develop.6834.1.e76f4b8cbc",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.1",

package/src/modules/attachments/fields/attachment.tsx

@@ -162,7 +162,7 @@ export const AttachmentInput = ({
           />
         </div>
       )}
-      {error ? <div className="text-xs text-red-600">{error}</div> : null}
+      {error ? <div className="text-xs text-status-error-text">{error}</div> : null}
       <div className="space-y-1">
         {loading ? <div className="text-xs text-muted-foreground">{t('attachments.library.loading', 'Loading attachments…')}</div> : null}
         {items.map(it => (

package/src/modules/auth/components/UserConsentsPanel.tsx

@@ -65,7 +65,7 @@ export function UserConsentsPanel({ userId }: UserConsentsPanelProps) {
   }
 
   if (error) {
-    return <p className="text-sm text-red-600">{error}</p>
+    return <p className="text-sm text-status-error-text">{error}</p>
   }
 
   if (consents.length === 0) {
@@ -86,15 +86,15 @@ export function UserConsentsPanel({ userId }: UserConsentsPanelProps) {
             <span className="flex items-center gap-1.5">
               {consent.isGranted ? (
                 <>
-                  <ShieldCheck className="size-4 text-emerald-600" />
-                  <span className="text-emerald-700 font-medium">
+                  <ShieldCheck className="size-4 text-status-success-icon" />
+                  <span className="text-status-success-text font-medium">
                     {t('auth.users.consents.granted', 'Granted')}
                   </span>
                 </>
               ) : (
                 <>
-                  <ShieldX className="size-4 text-red-500" />
-                  <span className="text-red-600 font-medium">
+                  <ShieldX className="size-4 text-status-error-icon" />
+                  <span className="text-status-error-text font-medium">
                     {t('auth.users.consents.withdrawn', 'Withdrawn')}
                   </span>
                 </>
@@ -118,13 +118,13 @@ export function UserConsentsPanel({ userId }: UserConsentsPanelProps) {
             <dd className="flex items-center gap-1">
               {consent.integrityValid ? (
                 <>
-                  <ShieldCheck className="size-3 text-emerald-600" />
-                  <span className="text-emerald-700">{t('auth.users.consents.integrityValid', 'Valid')}</span>
+                  <ShieldCheck className="size-3 text-status-success-icon" />
+                  <span className="text-status-success-text">{t('auth.users.consents.integrityValid', 'Valid')}</span>
                 </>
               ) : (
                 <>
-                  <ShieldAlert className="size-3 text-amber-500" />
-                  <span className="text-amber-600">{t('auth.users.consents.integrityInvalid', 'Tampered or missing')}</span>
+                  <ShieldAlert className="size-3 text-status-warning-icon" />
+                  <span className="text-status-warning-text">{t('auth.users.consents.integrityInvalid', 'Tampered or missing')}</span>
                 </>
               )}
             </dd>

package/src/modules/auth/frontend/reset.tsx

@@ -56,11 +56,11 @@ export default function ResetPage() {
             </div>
           ) : (
             <form className="grid gap-3" onSubmit={onSubmit} noValidate>
-              {error && <div className="text-sm text-red-600">{error}</div>}
+              {error && <div className="text-sm text-status-error-text">{error}</div>}
               <div className="grid gap-1">
                 <Label htmlFor="email">{t('auth.email')}</Label>
                 <EmailInput id="email" name="email" required aria-invalid={!!fieldError} aria-describedby={fieldError ? 'email-error' : undefined} />
-                {fieldError && <p id="email-error" className="text-sm text-red-600">{fieldError}</p>}
+                {fieldError && <p id="email-error" className="text-sm text-status-error-text">{fieldError}</p>}
               </div>
               <Button type="submit" className="mt-2 w-full" disabled={submitting}>
                 {submitting ? '...' : t('auth.sendResetLink')}

package/src/modules/business_rules/components/ActionRow.tsx

@@ -371,7 +371,7 @@ export function ActionRow({
           onClick={() => onDelete(index)}
           variant="ghost"
           size="xs"
-          className="hover:text-status-error-text"
+          className="hover:bg-destructive/10 hover:text-destructive"
           title={t('business_rules.components.actionRow.delete')}
           aria-label={t('business_rules.components.actionRow.delete')}
         >

package/src/modules/business_rules/components/ConditionRow.tsx

@@ -1,7 +1,7 @@
 "use client"
 
 import * as React from 'react'
-import { Button } from '@open-mercato/ui/primitives/button'
+import { IconButton } from '@open-mercato/ui/primitives/icon-button'
 import { Input } from '@open-mercato/ui/primitives/input'
 import {
   Select,
@@ -88,7 +88,7 @@ export function ConditionRow({ condition, onChange, onDelete, error }: Condition
             aria-invalid={fieldError ? true : undefined}
           />
           {fieldError && (
-            <p className="text-xs text-red-600 mt-0.5">
+            <p className="text-xs text-status-error-text mt-0.5">
               {t('business_rules.components.conditionRow.field.invalidPath')}
             </p>
           )}
@@ -166,19 +166,22 @@ export function ConditionRow({ condition, onChange, onDelete, error }: Condition
       </div>
 
       {/* Delete Button */}
-      <button
+      <IconButton
         type="button"
         onClick={onDelete}
-        className="p-1.5 text-muted-foreground hover:text-red-600 hover:bg-red-50 dark:hover:bg-red-900/20 rounded transition-colors"
+        variant="ghost"
+        size="xs"
+        className="hover:bg-destructive/10 hover:text-destructive"
         title={t('business_rules.components.conditionRow.deleteCondition')}
+        aria-label={t('business_rules.components.conditionRow.deleteCondition')}
       >
         <X className="w-4 h-4" />
-      </button>
+      </IconButton>
 
       {/* Error Display */}
       {error && (
         <div className="col-span-full mt-2">
-          <p className="text-xs text-red-600">{error}</p>
+          <p className="text-xs text-status-error-text">{error}</p>
         </div>
       )}
     </div>

package/src/modules/catalog/backend/catalog/products/[id]/page.tsx

@@ -2608,7 +2608,7 @@ function ProductMetaSection({
           )}
         />
         {errors.subtitle ? (
-          <p className="text-xs text-red-600">{errors.subtitle}</p>
+          <p className="text-xs text-status-error-text">{errors.subtitle}</p>
         ) : null}
       </div>
 
@@ -2641,7 +2641,7 @@ function ProductMetaSection({
           )}
         </p>
         {errors.handle ? (
-          <p className="text-xs text-red-600">{errors.handle}</p>
+          <p className="text-xs text-status-error-text">{errors.handle}</p>
         ) : null}
       </div>
 
@@ -2663,7 +2663,7 @@ function ProductMetaSection({
           )}
         </p>
         {errors.sku ? (
-          <p className="text-xs text-red-600">{errors.sku}</p>
+          <p className="text-xs text-status-error-text">{errors.sku}</p>
         ) : null}
       </div>
 
@@ -2700,7 +2700,7 @@ function ProductMetaSection({
           </SelectContent>
         </Select>
         {errors.productType ? (
-          <p className="text-xs text-red-600">
+          <p className="text-xs text-status-error-text">
             {errors.productType}
           </p>
         ) : null}

package/src/modules/catalog/backend/catalog/products/create/page.tsx

@@ -1942,7 +1942,7 @@ function ProductMetaSection({
           )}
         />
         {errors.subtitle ? (
-          <p className="text-xs text-red-600">{errors.subtitle}</p>
+          <p className="text-xs text-status-error-text">{errors.subtitle}</p>
         ) : null}
       </div>
 
@@ -1973,7 +1973,7 @@ function ProductMetaSection({
           )}
         </p>
         {errors.handle ? (
-          <p className="text-xs text-red-600">{errors.handle}</p>
+          <p className="text-xs text-status-error-text">{errors.handle}</p>
         ) : null}
       </div>
 
@@ -1995,7 +1995,7 @@ function ProductMetaSection({
           )}
         </p>
         {errors.sku ? (
-          <p className="text-xs text-red-600">{errors.sku}</p>
+          <p className="text-xs text-status-error-text">{errors.sku}</p>
         ) : null}
       </div>
 
@@ -2032,7 +2032,7 @@ function ProductMetaSection({
           </SelectContent>
         </Select>
         {errors.productType ? (
-          <p className="text-xs text-red-600">
+          <p className="text-xs text-status-error-text">
             {errors.productType}
           </p>
         ) : null}
@@ -2105,7 +2105,7 @@ function ProductMetaSection({
               )}
         </p>
         {errors.taxRateId ? (
-          <p className="text-xs text-red-600">{errors.taxRateId}</p>
+          <p className="text-xs text-status-error-text">{errors.taxRateId}</p>
         ) : null}
       </div>
     </div>

package/src/modules/catalog/components/PriceKindSettings.tsx

@@ -375,7 +375,7 @@ export function PriceKindSettings() {
       header: tableLabels.promotion,
       cell: ({ row }) =>
         row.original.isPromotion ? (
-          <span className="inline-flex items-center rounded-full border border-amber-200 bg-amber-50 px-2 py-0.5 text-xs font-medium text-amber-900 dark:border-amber-500/50 dark:bg-amber-500/10 dark:text-amber-100">
+          <span className="inline-flex items-center rounded-full border border-status-warning-border bg-status-warning-bg px-2 py-0.5 text-xs font-medium text-status-warning-text">
             {tableLabels.promotionYes}
           </span>
         ) : (
@@ -389,7 +389,7 @@ export function PriceKindSettings() {
       header: tableLabels.active,
       cell: ({ row }) =>
         row.original.isActive ? (
-          <span className="inline-flex items-center rounded-full border border-emerald-200 bg-emerald-50 px-2 py-0.5 text-xs font-medium text-emerald-900 dark:border-emerald-500/50 dark:bg-emerald-500/10 dark:text-emerald-100">
+          <span className="inline-flex items-center rounded-full border border-status-success-border bg-status-success-bg px-2 py-0.5 text-xs font-medium text-status-success-text">
             {tableLabels.activeYes}
           </span>
         ) : (
@@ -555,7 +555,7 @@ export function PriceKindSettings() {
                   {t('catalog.priceKinds.form.activeLabel', 'Active')}
                 </label>
               </div>
-              {error ? <p className="text-sm text-red-600">{error}</p> : null}
+              {error ? <p className="text-sm text-status-error-text">{error}</p> : null}
             </form>
             <DialogFooter>
               <Button variant="ghost" onClick={closeDialog}>

package/src/modules/catalog/components/products/ProductCategorizeSection.tsx

@@ -220,7 +220,7 @@ export function ProductCategorizeSection({
         <p className="text-xs text-muted-foreground">
           {t('catalog.products.create.organize.categoriesHelp', 'Assign products to one or more taxonomy nodes.')}
         </p>
-        {errors.categoryIds ? <p className="text-xs text-red-600">{errors.categoryIds}</p> : null}
+        {errors.categoryIds ? <p className="text-xs text-status-error-text">{errors.categoryIds}</p> : null}
       </div>
 
       <div className="space-y-2">
@@ -238,7 +238,7 @@ export function ProductCategorizeSection({
         <p className="text-xs text-muted-foreground">
           {t('catalog.products.create.organize.channelsHelp', 'Selected channels will receive default offers for this product.')}
         </p>
-        {errors.channelIds ? <p className="text-xs text-red-600">{errors.channelIds}</p> : null}
+        {errors.channelIds ? <p className="text-xs text-status-error-text">{errors.channelIds}</p> : null}
       </div>
 
       <div className="space-y-2">
@@ -254,7 +254,7 @@ export function ProductCategorizeSection({
         <p className="text-xs text-muted-foreground">
           {t('catalog.products.create.organize.tagsHelp', 'Describe products with shared labels to build quick filters.')}
         </p>
-        {errors.tags ? <p className="text-xs text-red-600">{errors.tags}</p> : null}
+        {errors.tags ? <p className="text-xs text-status-error-text">{errors.tags}</p> : null}
       </div>
     </div>
   )

package/src/modules/catalog/components/products/ProductMediaManager.tsx

@@ -186,7 +186,7 @@ export function ProductMediaManager({
           onChange={(event) => void acceptFiles(event.target.files)}
         />
       </div>
-      {error ? <p className="text-xs font-medium text-red-600">{error}</p> : null}
+      {error ? <p className="text-xs font-medium text-status-error-text">{error}</p> : null}
       {items.length ? (
         <div className="grid grid-cols-2 gap-3 sm:grid-cols-3">
           {items.map((item) => {

package/src/modules/catalog/components/products/VariantBuilder.tsx

@@ -98,14 +98,14 @@ export function VariantBasicsSection({ values, setValue, errors }: VariantSectio
       <div className="space-y-2">
         <Label className="flex items-center gap-1">
           {t('catalog.variants.form.nameLabel', 'Name')}
-          <span className="text-red-600">*</span>
+          <span className="text-status-error-text">*</span>
         </Label>
         <Input
           value={values.name}
           onChange={(event) => setValue('name', event.target.value)}
           placeholder={t('catalog.variants.form.namePlaceholder', 'e.g., Blue / Small')}
         />
-        {errors.name ? <p className="text-xs text-red-600">{errors.name}</p> : null}
+        {errors.name ? <p className="text-xs text-status-error-text">{errors.name}</p> : null}
       </div>
       <div className="grid gap-4 md:grid-cols-2">
         <div className="space-y-2">
@@ -123,7 +123,7 @@ export function VariantBasicsSection({ values, setValue, errors }: VariantSectio
             onChange={(event) => setValue('barcode', event.target.value)}
             placeholder={t('catalog.variants.form.barcodePlaceholder', 'EAN, UPC, etc.')}
           />
-          {errors.barcode ? <p className="text-xs text-destructive">{errors.barcode}</p> : null}
+          {errors.barcode ? <p className="text-xs text-status-error-text">{errors.barcode}</p> : null}
         </div>
       </div>
       <div className="grid gap-4 md:grid-cols-2">
@@ -153,7 +153,7 @@ export function VariantBasicsSection({ values, setValue, errors }: VariantSectio
               'Typed barcodes are validated and kept unique per organization.',
             )}
           </p>
-          {errors.gtinType ? <p className="text-xs text-destructive">{errors.gtinType}</p> : null}
+          {errors.gtinType ? <p className="text-xs text-status-error-text">{errors.gtinType}</p> : null}
         </div>
         <div className="space-y-2">
           <Label htmlFor="catalog-variant-hs-code">
@@ -164,7 +164,7 @@ export function VariantBasicsSection({ values, setValue, errors }: VariantSectio
             value={values.hsCode}
             onChange={(event) => setValue('hsCode', event.target.value)}
           />
-          {errors.hsCode ? <p className="text-xs text-destructive">{errors.hsCode}</p> : null}
+          {errors.hsCode ? <p className="text-xs text-status-error-text">{errors.hsCode}</p> : null}
         </div>
       </div>
       <div className="grid gap-4 md:grid-cols-2">

package/src/modules/communication_channels/backend/profile/communication-channels/page.tsx

@@ -871,7 +871,7 @@ function DisconnectChannelDialog({
           <Button type="button" variant="outline" onClick={onClose} disabled={submitting}>
             {t('communication_channels.profile.disconnect.cancel', 'Cancel')}
           </Button>
-          <Button type="button" variant="destructive" onClick={() => void handleConfirm()} disabled={submitting}>
+          <Button type="button" variant="destructive-solid" onClick={() => void handleConfirm()} disabled={submitting}>
             {submitting
               ? t('communication_channels.profile.disconnect.submitting', 'Disconnecting…')
               : t('communication_channels.profile.disconnect.confirm', 'Disconnect')}

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

@@ -253,7 +253,7 @@ export function ConfirmDealLostDialog({
             </Button>
             <Button
               type="button"
-              variant="destructive"
+              variant="destructive-solid"
               disabled={confirmDisabled}
               onClick={() => { void handleConfirm() }}
             >

package/src/modules/dashboards/api/widgets/data/schema.ts

@@ -18,17 +18,54 @@ export const dateRangePresetSchema = z.enum([
   'last_90_days',
 ])
 
+const comparisonFilterOperators = ['eq', 'neq', 'gt', 'gte', 'lt', 'lte'] as const
+const setFilterOperators = ['in', 'not_in'] as const
+const nullFilterOperators = ['is_null', 'is_not_null'] as const
+const scalarFilterOperators = [...comparisonFilterOperators, ...nullFilterOperators] as const
+
+const scalarFilterOperatorSchema = z.enum(scalarFilterOperators)
+const setFilterOperatorSchema = z.enum(setFilterOperators)
+
 export const filterOperatorSchema = z.enum([
-  'eq',
-  'neq',
-  'gt',
-  'gte',
-  'lt',
-  'lte',
-  'in',
-  'not_in',
-  'is_null',
-  'is_not_null',
+  ...comparisonFilterOperators,
+  ...setFilterOperators,
+  ...nullFilterOperators,
+])
+
+/**
+ * Upper bound on how many members an `in` / `not_in` widget-data filter may carry (#4852).
+ *
+ * Every member becomes one placeholder plus one bound parameter in the aggregation's WHERE
+ * clause, so the cost of a set filter is proportional to its length. The bound lives here
+ * rather than in the SQL builder because `buildWhereClause` can only truncate the list —
+ * silently returning an answer to a different question than the caller asked — or throw from
+ * deep inside query construction; validating here yields a 400 that names the offending
+ * filter and is published in the route's OpenAPI schema.
+ *
+ * 200 is deliberately generous for a dashboard filter: the widest grouping a widget can render
+ * is capped at 100 buckets (`groupBy.limit`), and a batch carries at most 50 requests, so even
+ * a fully saturated batch stays an order of magnitude below PostgreSQL's per-statement limit
+ * of 65535 bound parameters. Raising it later is a one-line change to this constant.
+ */
+export const MAX_SET_FILTER_VALUES = 200
+
+// `IN` / `NOT IN` compare against literals; a null member never matches either way, which is
+// what the dedicated `is_null` / `is_not_null` operators are for.
+const setFilterMemberSchema = z.union([z.string(), z.number(), z.boolean()])
+
+const setFilterValueSchema = z.array(setFilterMemberSchema).max(MAX_SET_FILTER_VALUES)
+
+const widgetDataFilterSchema = z.discriminatedUnion('operator', [
+  z.object({
+    field: z.string().min(1),
+    operator: setFilterOperatorSchema,
+    value: setFilterValueSchema,
+  }),
+  z.object({
+    field: z.string().min(1),
+    operator: scalarFilterOperatorSchema,
+    value: z.unknown().optional(),
+  }),
 ])
 
 export const widgetDataRequestSchema = z.object({
@@ -45,15 +82,7 @@ export const widgetDataRequestSchema = z.object({
       resolveLabels: z.boolean().optional(),
     })
     .optional(),
-  filters: z
-    .array(
-      z.object({
-        field: z.string().min(1),
-        operator: filterOperatorSchema,
-        value: z.unknown().optional(),
-      }),
-    )
-    .optional(),
+  filters: z.array(widgetDataFilterSchema).optional(),
   dateRange: z
     .object({
       field: z.string().min(1),

package/src/modules/design_system/gallery/entries/detail.tsx

@@ -304,11 +304,11 @@ const notesAdapter: NotesDataAdapter = {
   entityId={personId}
   viewerUserId={viewer.id}
   viewerName={viewer.name}
-  emptyLabel={t('customers.people.detail.notes.empty')}
-  addActionLabel={t('customers.people.detail.notes.add')}
+  emptyLabel={t('design_system.gallery.samples.notes.empty')}
+  addActionLabel={t('design_system.gallery.samples.notes.add')}
   emptyState={{
-    title: t('customers.people.detail.notes.emptyTitle'),
-    actionLabel: t('customers.people.detail.notes.add'),
+    title: t('design_system.gallery.samples.notes.emptyTitle'),
+    actionLabel: t('design_system.gallery.samples.notes.add'),
   }}
   translator={t}
   dataAdapter={notesAdapter}
@@ -348,10 +348,10 @@ const addressesAdapter: AddressDataAdapter = {
 
 <AddressesSection
   entityId={personId}
-  emptyLabel={t('customers.people.detail.addresses.empty')}
+  emptyLabel={t('design_system.gallery.samples.addresses.empty')}
   addActionLabel={t('customers.people.detail.addresses.add')}
   emptyState={{
-    title: t('customers.people.detail.addresses.emptyTitle'),
+    title: t('design_system.gallery.samples.addresses.emptyTitle'),
     actionLabel: t('customers.people.detail.addresses.add'),
   }}
   translator={t}
@@ -386,8 +386,8 @@ const attachmentsSectionEntry: GalleryEntry = {
 <AttachmentsSection
   entityId="customers:person"
   recordId={person?.id ?? null}
-  title={t('customers.people.detail.attachments.title')}
-  description={t('customers.people.detail.attachments.description')}
+  title={t('design_system.gallery.samples.attachments.title')}
+  description={t('design_system.gallery.samples.attachments.description')}
 />`,
     },
   ],

package/src/modules/design_system/gallery/entries/overlays.tsx

@@ -152,7 +152,7 @@ import {
               <DialogClose asChild>
                 <Button variant="outline">Cancel</Button>
               </DialogClose>
-              <Button variant="destructive">Delete</Button>
+              <Button variant="destructive-solid">Delete</Button>
             </DialogFooter>
           </DialogContent>
         </Dialog>
@@ -185,7 +185,7 @@ import {
       <DialogClose asChild>
         <Button variant="outline">Cancel</Button>
       </DialogClose>
-      <Button variant="destructive">Delete</Button>
+      <Button variant="destructive-solid">Delete</Button>
     </DialogFooter>
   </DialogContent>
 </Dialog>`,