@open-mercato/core 0.5.1-develop.2949.009dcdd2d5 → 0.5.1-develop.2954.610bab2d08

package/dist/modules/business_rules/components/ConditionRow.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/modules/business_rules/components/ConditionRow.tsx"],
-  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { X } from 'lucide-react'\nimport type { SimpleCondition } from './utils/conditionValidation'\nimport { getComparisonOperators, isValidFieldPath } from './utils/conditionValidation'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\n\nexport type ConditionRowProps = {\n  condition: SimpleCondition\n  onChange: (condition: SimpleCondition) => void\n  onDelete: () => void\n  entityType?: string\n  error?: string\n}\n\nexport function ConditionRow({ condition, onChange, onDelete, error }: ConditionRowProps) {\n  const t = useT()\n  const operators = getComparisonOperators(t)\n  const [useFieldComparison, setUseFieldComparison] = React.useState(!!condition.valueField)\n\n  const handleFieldChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    onChange({ ...condition, field: e.target.value })\n  }\n\n  const handleOperatorChange = (e: React.ChangeEvent<HTMLSelectElement>) => {\n    onChange({ ...condition, operator: e.target.value as any })\n  }\n\n  const handleValueChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const rawValue = e.target.value\n\n    // Try to parse as JSON for arrays/objects\n    let parsedValue: any = rawValue\n    if (rawValue.trim().startsWith('[') || rawValue.trim().startsWith('{')) {\n      try {\n        parsedValue = JSON.parse(rawValue)\n      } catch {\n        // Keep as string if not valid JSON\n        parsedValue = rawValue\n      }\n    }\n\n    onChange({ ...condition, value: parsedValue, valueField: undefined })\n  }\n\n  const handleValueFieldChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    onChange({ ...condition, valueField: e.target.value, value: null })\n  }\n\n  const toggleFieldComparison = () => {\n    if (useFieldComparison) {\n      onChange({ ...condition, valueField: undefined, value: null })\n      setUseFieldComparison(false)\n    } else {\n      onChange({ ...condition, value: null, valueField: '' })\n      setUseFieldComparison(true)\n    }\n  }\n\n  // Operators that don't need a value\n  const operatorNeedsValue = !['IS_EMPTY', 'IS_NOT_EMPTY'].includes(condition.operator)\n\n  const fieldError = condition.field && !isValidFieldPath(condition.field)\n\n  return (\n    <div className=\"flex items-start gap-2 p-3 bg-muted rounded border border-border\">\n      <div className=\"flex-1 grid grid-cols-1 md:grid-cols-3 gap-2\">\n        {/* Field Input */}\n        <div>\n          <label className=\"block text-xs font-medium text-foreground mb-1\">\n            {t('business_rules.components.conditionRow.field')}\n          </label>\n          <input\n            type=\"text\"\n            value={condition.field || ''}\n            onChange={handleFieldChange}\n            placeholder={t('business_rules.components.conditionRow.field.placeholder')}\n            className={`w-full px-2 py-1.5 text-sm border rounded bg-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring ${\n              fieldError ? 'border-red-500' : 'border-border'\n            }`}\n          />\n          {fieldError && (\n            <p className=\"text-xs text-red-600 mt-0.5\">\n              {t('business_rules.components.conditionRow.field.invalidPath')}\n            </p>\n          )}\n        </div>\n\n        {/* Operator Select */}\n        <div>\n          <label className=\"block text-xs font-medium text-foreground mb-1\">\n            {t('business_rules.components.conditionRow.operator')}\n          </label>\n          <select\n            value={condition.operator || '='}\n            onChange={handleOperatorChange}\n            className=\"w-full px-2 py-1.5 text-sm border border-border rounded bg-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n          >\n            {operators.map((op) => (\n              <option key={op.value} value={op.value}>\n                {op.label}\n              </option>\n            ))}\n          </select>\n        </div>\n\n        {/* Value Input */}\n        {operatorNeedsValue && (\n          <div>\n            <div className=\"flex items-center justify-between mb-1\">\n              <label className=\"block text-xs font-medium text-foreground\">\n                {useFieldComparison\n                  ? t('business_rules.components.conditionRow.compareToField')\n                  : t('business_rules.components.conditionRow.value')\n                }\n              </label>\n              <button\n                type=\"button\"\n                onClick={toggleFieldComparison}\n                className=\"text-xs text-blue-600 hover:text-blue-800 dark:text-blue-400 dark:hover:text-blue-300\"\n                title={t('business_rules.components.conditionRow.toggleFieldComparison')}\n              >\n                {useFieldComparison\n                  ? t('business_rules.components.conditionRow.useValue')\n                  : t('business_rules.components.conditionRow.useField')\n                }\n              </button>\n            </div>\n            <input\n              type=\"text\"\n              value={\n                useFieldComparison\n                  ? (condition.valueField || '')\n                  : (condition.value === null || condition.value === undefined)\n                    ? ''\n                    : typeof condition.value === 'string'\n                      ? condition.value\n                      : JSON.stringify(condition.value)\n              }\n              onChange={useFieldComparison ? handleValueFieldChange : handleValueChange}\n              placeholder={useFieldComparison\n                ? t('business_rules.components.conditionRow.field.comparisonPlaceholder')\n                : t('business_rules.components.conditionRow.value.placeholder')\n              }\n              className=\"w-full px-2 py-1.5 text-sm border border-border rounded bg-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n            />\n            <p className=\"text-xs text-muted-foreground mt-0.5\">\n              {useFieldComparison\n                ? t('business_rules.components.conditionRow.field.comparisonHelp')\n                : t('business_rules.components.conditionRow.value.help')\n              }\n            </p>\n          </div>\n        )}\n      </div>\n\n      {/* Delete Button */}\n      <button\n        type=\"button\"\n        onClick={onDelete}\n        className=\"p-1.5 text-muted-foreground hover:text-red-600 hover:bg-red-50 dark:hover:bg-red-900/20 rounded transition-colors\"\n        title={t('business_rules.components.conditionRow.deleteCondition')}\n      >\n        <X className=\"w-4 h-4\" />\n      </button>\n\n      {/* Error Display */}\n      {error && (\n        <div className=\"col-span-full mt-2\">\n          <p className=\"text-xs text-red-600\">{error}</p>\n        </div>\n      )}\n    </div>\n  )\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { Input } from '@open-mercato/ui/primitives/input'\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from '@open-mercato/ui/primitives/select'\nimport { X } from 'lucide-react'\nimport type { SimpleCondition } from './utils/conditionValidation'\nimport { getComparisonOperators, isValidFieldPath } from './utils/conditionValidation'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\n\nexport type ConditionRowProps = {\n  condition: SimpleCondition\n  onChange: (condition: SimpleCondition) => void\n  onDelete: () => void\n  entityType?: string\n  error?: string\n}\n\nexport function ConditionRow({ condition, onChange, onDelete, error }: ConditionRowProps) {\n  const t = useT()\n  const operators = getComparisonOperators(t)\n  const [useFieldComparison, setUseFieldComparison] = React.useState(!!condition.valueField)\n\n  const handleFieldChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    onChange({ ...condition, field: e.target.value })\n  }\n\n  const handleOperatorChange = (e: React.ChangeEvent<HTMLSelectElement>) => {\n    onChange({ ...condition, operator: e.target.value as any })\n  }\n\n  const handleValueChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const rawValue = e.target.value\n\n    // Try to parse as JSON for arrays/objects\n    let parsedValue: any = rawValue\n    if (rawValue.trim().startsWith('[') || rawValue.trim().startsWith('{')) {\n      try {\n        parsedValue = JSON.parse(rawValue)\n      } catch {\n        // Keep as string if not valid JSON\n        parsedValue = rawValue\n      }\n    }\n\n    onChange({ ...condition, value: parsedValue, valueField: undefined })\n  }\n\n  const handleValueFieldChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    onChange({ ...condition, valueField: e.target.value, value: null })\n  }\n\n  const toggleFieldComparison = () => {\n    if (useFieldComparison) {\n      onChange({ ...condition, valueField: undefined, value: null })\n      setUseFieldComparison(false)\n    } else {\n      onChange({ ...condition, value: null, valueField: '' })\n      setUseFieldComparison(true)\n    }\n  }\n\n  // Operators that don't need a value\n  const operatorNeedsValue = !['IS_EMPTY', 'IS_NOT_EMPTY'].includes(condition.operator)\n\n  const fieldError = condition.field && !isValidFieldPath(condition.field)\n\n  return (\n    <div className=\"flex items-start gap-2 p-3 bg-muted rounded border border-border\">\n      <div className=\"flex-1 grid grid-cols-1 md:grid-cols-3 gap-2\">\n        {/* Field Input */}\n        <div>\n          <label className=\"block text-xs font-medium text-foreground mb-1\">\n            {t('business_rules.components.conditionRow.field')}\n          </label>\n          <Input\n            type=\"text\"\n            value={condition.field || ''}\n            onChange={handleFieldChange}\n            placeholder={t('business_rules.components.conditionRow.field.placeholder')}\n            aria-invalid={fieldError ? true : undefined}\n          />\n          {fieldError && (\n            <p className=\"text-xs text-red-600 mt-0.5\">\n              {t('business_rules.components.conditionRow.field.invalidPath')}\n            </p>\n          )}\n        </div>\n\n        {/* Operator Select */}\n        <div>\n          <label className=\"block text-xs font-medium text-foreground mb-1\">\n            {t('business_rules.components.conditionRow.operator')}\n          </label>\n          <Select\n            value={condition.operator || '='}\n            onValueChange={(value) => handleOperatorChange({ target: { value } } as React.ChangeEvent<HTMLSelectElement>)}\n          >\n            <SelectTrigger size=\"sm\">\n              <SelectValue />\n            </SelectTrigger>\n            <SelectContent>\n              {operators.map((op) => (\n                <SelectItem key={op.value} value={op.value}>\n                  {op.label}\n                </SelectItem>\n              ))}\n            </SelectContent>\n          </Select>\n        </div>\n\n        {/* Value Input */}\n        {operatorNeedsValue && (\n          <div>\n            <div className=\"flex items-center justify-between mb-1\">\n              <label className=\"block text-xs font-medium text-foreground\">\n                {useFieldComparison\n                  ? t('business_rules.components.conditionRow.compareToField')\n                  : t('business_rules.components.conditionRow.value')\n                }\n              </label>\n              <button\n                type=\"button\"\n                onClick={toggleFieldComparison}\n                className=\"text-xs text-blue-600 hover:text-blue-800 dark:text-blue-400 dark:hover:text-blue-300\"\n                title={t('business_rules.components.conditionRow.toggleFieldComparison')}\n              >\n                {useFieldComparison\n                  ? t('business_rules.components.conditionRow.useValue')\n                  : t('business_rules.components.conditionRow.useField')\n                }\n              </button>\n            </div>\n            <Input\n              type=\"text\"\n              value={\n                useFieldComparison\n                  ? (condition.valueField || '')\n                  : (condition.value === null || condition.value === undefined)\n                    ? ''\n                    : typeof condition.value === 'string'\n                      ? condition.value\n                      : JSON.stringify(condition.value)\n              }\n              onChange={useFieldComparison ? handleValueFieldChange : handleValueChange}\n              placeholder={useFieldComparison\n                ? t('business_rules.components.conditionRow.field.comparisonPlaceholder')\n                : t('business_rules.components.conditionRow.value.placeholder')\n              }\n            />\n            <p className=\"text-xs text-muted-foreground mt-0.5\">\n              {useFieldComparison\n                ? t('business_rules.components.conditionRow.field.comparisonHelp')\n                : t('business_rules.components.conditionRow.value.help')\n              }\n            </p>\n          </div>\n        )}\n      </div>\n\n      {/* Delete Button */}\n      <button\n        type=\"button\"\n        onClick={onDelete}\n        className=\"p-1.5 text-muted-foreground hover:text-red-600 hover:bg-red-50 dark:hover:bg-red-900/20 rounded transition-colors\"\n        title={t('business_rules.components.conditionRow.deleteCondition')}\n      >\n        <X className=\"w-4 h-4\" />\n      </button>\n\n      {/* Error Display */}\n      {error && (\n        <div className=\"col-span-full mt-2\">\n          <p className=\"text-xs text-red-600\">{error}</p>\n        </div>\n      )}\n    </div>\n  )\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/modules/business_rules/components/RuleSetMembers.js

@@ -2,6 +2,14 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { Button } from "@open-mercato/ui/primitives/button";
+import { Input } from "@open-mercato/ui/primitives/input";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from "@open-mercato/ui/primitives/select";
 import { Plus, ChevronUp, ChevronDown, X } from "lucide-react";
 import { useQuery } from "@tanstack/react-query";
 import { apiCall } from "@open-mercato/ui/backend/utils/apiCall";
@@ -110,19 +118,18 @@ function RuleSetMembers({ members, onAdd, onUpdate, onRemove }) {
         /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
           /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-foreground mb-1", children: t("business_rules.sets.members.form.selectRule") }),
           /* @__PURE__ */ jsxs(
-            "select",
+            Select,
             {
-              value: selectedRuleId,
-              onChange: (e) => setSelectedRuleId(e.target.value),
-              className: "w-full px-3 py-2 border border-border rounded bg-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+              value: selectedRuleId || void 0,
+              onValueChange: (value) => setSelectedRuleId(value ?? ""),
               children: [
-                /* @__PURE__ */ jsx("option", { value: "", children: t("business_rules.sets.members.form.selectRulePlaceholder") }),
-                rulesNotInSet.map((rule) => /* @__PURE__ */ jsxs("option", { value: rule.id, children: [
+                /* @__PURE__ */ jsx(SelectTrigger, { children: /* @__PURE__ */ jsx(SelectValue, { placeholder: t("business_rules.sets.members.form.selectRulePlaceholder") }) }),
+                /* @__PURE__ */ jsx(SelectContent, { children: rulesNotInSet.map((rule) => /* @__PURE__ */ jsxs(SelectItem, { value: rule.id, children: [
                   rule.ruleName,
                   " (",
                   rule.ruleId,
                   ")"
-                ] }, rule.id))
+                ] }, rule.id)) })
               ]
             }
           )
@@ -130,13 +137,12 @@ function RuleSetMembers({ members, onAdd, onUpdate, onRemove }) {
         /* @__PURE__ */ jsxs("div", { className: "w-32", children: [
           /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-foreground mb-1", children: t("business_rules.sets.members.form.sequence") }),
           /* @__PURE__ */ jsx(
-            "input",
+            Input,
             {
               type: "number",
               value: sequence,
               onChange: (e) => setSequence(parseInt(e.target.value) || 0),
-              min: 0,
-              className: "w-full px-3 py-2 border border-border rounded bg-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+              min: 0
             }
           )
         ] })

package/dist/modules/business_rules/components/RuleSetMembers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/modules/business_rules/components/RuleSetMembers.tsx"],
-  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { Plus, ChevronUp, ChevronDown, X } from 'lucide-react'\nimport { useQuery } from '@tanstack/react-query'\nimport { apiCall } from '@open-mercato/ui/backend/utils/apiCall'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\n\ntype Member = {\n  id: string\n  ruleId: string\n  ruleName: string\n  ruleType: string\n  sequence: number\n  enabled: boolean\n}\n\ntype RuleOption = {\n  id: string\n  ruleId: string\n  ruleName: string\n  ruleType: string\n}\n\ntype RuleSetMembersProps = {\n  members: Member[]\n  onAdd: (ruleId: string, sequence: number) => Promise<void>\n  onUpdate: (memberId: string, updates: { sequence?: number; enabled?: boolean }) => Promise<void>\n  onRemove: (memberId: string, ruleName: string) => Promise<void>\n}\n\nexport function RuleSetMembers({ members, onAdd, onUpdate, onRemove }: RuleSetMembersProps) {\n  const t = useT()\n  const [showAddForm, setShowAddForm] = React.useState(false)\n  const [selectedRuleId, setSelectedRuleId] = React.useState('')\n  const [sequence, setSequence] = React.useState(0)\n\n  // Fetch available rules\n  const { data: availableRules } = useQuery({\n    queryKey: ['business-rules', 'rules-list'],\n    queryFn: async () => {\n      const result = await apiCall<{ items: RuleOption[] }>(\n        '/api/business_rules/rules?page=1&pageSize=100&sortField=ruleName&sortDir=asc'\n      )\n      if (!result.ok) {\n        throw new Error('Failed to fetch rules')\n      }\n      return result.result?.items || []\n    },\n  })\n\n  // Filter out already added rules (memoized to avoid re-computation on every render)\n  const rulesNotInSet = React.useMemo(() => {\n    const memberRuleIds = new Set(members.map(m => m.ruleId))\n    return availableRules?.filter(r => !memberRuleIds.has(r.id)) || []\n  }, [members, availableRules])\n\n  const handleAdd = async () => {\n    if (!selectedRuleId) return\n    await onAdd(selectedRuleId, sequence)\n    setSelectedRuleId('')\n    setSequence(0)\n    setShowAddForm(false)\n  }\n\n  const handleMoveUp = async (member: Member, index: number) => {\n    if (index === 0) return\n    const prevMember = members[index - 1]\n    // Swap sequences\n    await onUpdate(member.id, { sequence: prevMember.sequence })\n    await onUpdate(prevMember.id, { sequence: member.sequence })\n  }\n\n  const handleMoveDown = async (member: Member, index: number) => {\n    if (index === members.length - 1) return\n    const nextMember = members[index + 1]\n    // Swap sequences\n    await onUpdate(member.id, { sequence: nextMember.sequence })\n    await onUpdate(nextMember.id, { sequence: member.sequence })\n  }\n\n  const handleToggleEnabled = async (member: Member) => {\n    await onUpdate(member.id, { enabled: !member.enabled })\n  }\n\n  return (\n    <div className=\"space-y-4\">\n      {/* Members List */}\n      {members.length === 0 ? (\n        <div className=\"text-center py-8 text-muted-foreground\">\n          <p>{t('business_rules.sets.members.empty')}</p>\n        </div>\n      ) : (\n        <div className=\"space-y-2\">\n          {members.map((member, index) => (\n            <div\n              key={member.id}\n              className=\"flex items-center gap-3 p-3 bg-muted rounded border border-border\"\n            >\n              {/* Order Controls */}\n              <div className=\"flex flex-col gap-1\">\n                <button\n                  onClick={() => handleMoveUp(member, index)}\n                  disabled={index === 0}\n                  className=\"p-1 text-muted-foreground hover:text-foreground hover:bg-muted rounded transition-colors disabled:opacity-50 disabled:cursor-not-allowed\"\n                  title={t('common.moveUp')}\n                >\n                  <ChevronUp className=\"w-4 h-4\" />\n                </button>\n                <button\n                  onClick={() => handleMoveDown(member, index)}\n                  disabled={index === members.length - 1}\n                  className=\"p-1 text-muted-foreground hover:text-foreground hover:bg-muted rounded transition-colors disabled:opacity-50 disabled:cursor-not-allowed\"\n                  title={t('common.moveDown')}\n                >\n                  <ChevronDown className=\"w-4 h-4\" />\n                </button>\n              </div>\n\n              {/* Sequence Number */}\n              <div className=\"flex items-center justify-center w-8 h-8 bg-status-info-bg text-status-info-text rounded font-mono text-sm font-medium\">\n                {member.sequence}\n              </div>\n\n              {/* Rule Info */}\n              <div className=\"flex-1\">\n                <div className=\"font-medium\">{member.ruleName}</div>\n                <div className=\"text-xs text-muted-foreground font-mono\">{member.ruleId}</div>\n              </div>\n\n              {/* Rule Type Badge */}\n              <div className=\"px-2 py-1 bg-muted text-muted-foreground text-xs rounded font-medium\">\n                {member.ruleType}\n              </div>\n\n              {/* Enabled Toggle */}\n              <button\n                onClick={() => handleToggleEnabled(member)}\n                className={`px-2 py-1 rounded text-xs font-medium cursor-pointer ${\n                  member.enabled\n                    ? 'bg-status-success-bg text-status-success-text hover:bg-status-success-bg/80'\n                    : 'bg-muted text-muted-foreground hover:bg-muted/50'\n                }`}\n                title={t('business_rules.sets.members.actions.toggleEnabled')}\n              >\n                {member.enabled ? t('common.enabled') : t('common.disabled')}\n              </button>\n\n              {/* Remove Button */}\n              <button\n                onClick={() => onRemove(member.id, member.ruleName)}\n                className=\"p-1.5 text-muted-foreground hover:text-status-error-text hover:bg-status-error-bg rounded transition-colors\"\n                title={t('common.remove')}\n              >\n                <X className=\"w-4 h-4\" />\n              </button>\n            </div>\n          ))}\n        </div>\n      )}\n\n      {/* Add Rule Form */}\n      {showAddForm ? (\n        <div className=\"p-4 bg-status-info-bg border border-status-info-border rounded space-y-3\">\n          <div className=\"flex items-end gap-3\">\n            <div className=\"flex-1\">\n              <label className=\"block text-sm font-medium text-foreground mb-1\">\n                {t('business_rules.sets.members.form.selectRule')}\n              </label>\n              <select\n                value={selectedRuleId}\n                onChange={(e) => setSelectedRuleId(e.target.value)}\n                className=\"w-full px-3 py-2 border border-border rounded bg-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n              >\n                <option value=\"\">{t('business_rules.sets.members.form.selectRulePlaceholder')}</option>\n                {rulesNotInSet.map((rule) => (\n                  <option key={rule.id} value={rule.id}>\n                    {rule.ruleName} ({rule.ruleId})\n                  </option>\n                ))}\n              </select>\n            </div>\n\n            <div className=\"w-32\">\n              <label className=\"block text-sm font-medium text-foreground mb-1\">\n                {t('business_rules.sets.members.form.sequence')}\n              </label>\n              <input\n                type=\"number\"\n                value={sequence}\n                onChange={(e) => setSequence(parseInt(e.target.value) || 0)}\n                min={0}\n                className=\"w-full px-3 py-2 border border-border rounded bg-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n              />\n            </div>\n          </div>\n\n          <div className=\"flex gap-2\">\n            <Button onClick={handleAdd} disabled={!selectedRuleId} size=\"sm\">\n              {t('business_rules.sets.members.actions.add')}\n            </Button>\n            <Button\n              onClick={() => {\n                setShowAddForm(false)\n                setSelectedRuleId('')\n                setSequence(0)\n              }}\n              variant=\"outline\"\n              size=\"sm\"\n            >\n              {t('common.cancel')}\n            </Button>\n          </div>\n        </div>\n      ) : (\n        <Button onClick={() => setShowAddForm(true)} variant=\"outline\" size=\"sm\">\n          <Plus className=\"w-4 h-4 mr-2\" />\n          {t('business_rules.sets.members.actions.addRule')}\n        </Button>\n      )}\n\n      {/* Help Text */}\n      <div className=\"text-xs text-muted-foreground space-y-1\">\n        <p>\n          <strong>{t('business_rules.sets.members.help.ordering')}:</strong>{' '}\n          {t('business_rules.sets.members.help.orderingDescription')}\n        </p>\n        <p>\n          <strong>{t('business_rules.sets.members.help.enabled')}:</strong>{' '}\n          {t('business_rules.sets.members.help.enabledDescription')}\n        </p>\n      </div>\n    </div>\n  )\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { Input } from '@open-mercato/ui/primitives/input'\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from '@open-mercato/ui/primitives/select'\nimport { Plus, ChevronUp, ChevronDown, X } from 'lucide-react'\nimport { useQuery } from '@tanstack/react-query'\nimport { apiCall } from '@open-mercato/ui/backend/utils/apiCall'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\n\ntype Member = {\n  id: string\n  ruleId: string\n  ruleName: string\n  ruleType: string\n  sequence: number\n  enabled: boolean\n}\n\ntype RuleOption = {\n  id: string\n  ruleId: string\n  ruleName: string\n  ruleType: string\n}\n\ntype RuleSetMembersProps = {\n  members: Member[]\n  onAdd: (ruleId: string, sequence: number) => Promise<void>\n  onUpdate: (memberId: string, updates: { sequence?: number; enabled?: boolean }) => Promise<void>\n  onRemove: (memberId: string, ruleName: string) => Promise<void>\n}\n\nexport function RuleSetMembers({ members, onAdd, onUpdate, onRemove }: RuleSetMembersProps) {\n  const t = useT()\n  const [showAddForm, setShowAddForm] = React.useState(false)\n  const [selectedRuleId, setSelectedRuleId] = React.useState('')\n  const [sequence, setSequence] = React.useState(0)\n\n  // Fetch available rules\n  const { data: availableRules } = useQuery({\n    queryKey: ['business-rules', 'rules-list'],\n    queryFn: async () => {\n      const result = await apiCall<{ items: RuleOption[] }>(\n        '/api/business_rules/rules?page=1&pageSize=100&sortField=ruleName&sortDir=asc'\n      )\n      if (!result.ok) {\n        throw new Error('Failed to fetch rules')\n      }\n      return result.result?.items || []\n    },\n  })\n\n  // Filter out already added rules (memoized to avoid re-computation on every render)\n  const rulesNotInSet = React.useMemo(() => {\n    const memberRuleIds = new Set(members.map(m => m.ruleId))\n    return availableRules?.filter(r => !memberRuleIds.has(r.id)) || []\n  }, [members, availableRules])\n\n  const handleAdd = async () => {\n    if (!selectedRuleId) return\n    await onAdd(selectedRuleId, sequence)\n    setSelectedRuleId('')\n    setSequence(0)\n    setShowAddForm(false)\n  }\n\n  const handleMoveUp = async (member: Member, index: number) => {\n    if (index === 0) return\n    const prevMember = members[index - 1]\n    // Swap sequences\n    await onUpdate(member.id, { sequence: prevMember.sequence })\n    await onUpdate(prevMember.id, { sequence: member.sequence })\n  }\n\n  const handleMoveDown = async (member: Member, index: number) => {\n    if (index === members.length - 1) return\n    const nextMember = members[index + 1]\n    // Swap sequences\n    await onUpdate(member.id, { sequence: nextMember.sequence })\n    await onUpdate(nextMember.id, { sequence: member.sequence })\n  }\n\n  const handleToggleEnabled = async (member: Member) => {\n    await onUpdate(member.id, { enabled: !member.enabled })\n  }\n\n  return (\n    <div className=\"space-y-4\">\n      {/* Members List */}\n      {members.length === 0 ? (\n        <div className=\"text-center py-8 text-muted-foreground\">\n          <p>{t('business_rules.sets.members.empty')}</p>\n        </div>\n      ) : (\n        <div className=\"space-y-2\">\n          {members.map((member, index) => (\n            <div\n              key={member.id}\n              className=\"flex items-center gap-3 p-3 bg-muted rounded border border-border\"\n            >\n              {/* Order Controls */}\n              <div className=\"flex flex-col gap-1\">\n                <button\n                  onClick={() => handleMoveUp(member, index)}\n                  disabled={index === 0}\n                  className=\"p-1 text-muted-foreground hover:text-foreground hover:bg-muted rounded transition-colors disabled:opacity-50 disabled:cursor-not-allowed\"\n                  title={t('common.moveUp')}\n                >\n                  <ChevronUp className=\"w-4 h-4\" />\n                </button>\n                <button\n                  onClick={() => handleMoveDown(member, index)}\n                  disabled={index === members.length - 1}\n                  className=\"p-1 text-muted-foreground hover:text-foreground hover:bg-muted rounded transition-colors disabled:opacity-50 disabled:cursor-not-allowed\"\n                  title={t('common.moveDown')}\n                >\n                  <ChevronDown className=\"w-4 h-4\" />\n                </button>\n              </div>\n\n              {/* Sequence Number */}\n              <div className=\"flex items-center justify-center w-8 h-8 bg-status-info-bg text-status-info-text rounded font-mono text-sm font-medium\">\n                {member.sequence}\n              </div>\n\n              {/* Rule Info */}\n              <div className=\"flex-1\">\n                <div className=\"font-medium\">{member.ruleName}</div>\n                <div className=\"text-xs text-muted-foreground font-mono\">{member.ruleId}</div>\n              </div>\n\n              {/* Rule Type Badge */}\n              <div className=\"px-2 py-1 bg-muted text-muted-foreground text-xs rounded font-medium\">\n                {member.ruleType}\n              </div>\n\n              {/* Enabled Toggle */}\n              <button\n                onClick={() => handleToggleEnabled(member)}\n                className={`px-2 py-1 rounded text-xs font-medium cursor-pointer ${\n                  member.enabled\n                    ? 'bg-status-success-bg text-status-success-text hover:bg-status-success-bg/80'\n                    : 'bg-muted text-muted-foreground hover:bg-muted/50'\n                }`}\n                title={t('business_rules.sets.members.actions.toggleEnabled')}\n              >\n                {member.enabled ? t('common.enabled') : t('common.disabled')}\n              </button>\n\n              {/* Remove Button */}\n              <button\n                onClick={() => onRemove(member.id, member.ruleName)}\n                className=\"p-1.5 text-muted-foreground hover:text-status-error-text hover:bg-status-error-bg rounded transition-colors\"\n                title={t('common.remove')}\n              >\n                <X className=\"w-4 h-4\" />\n              </button>\n            </div>\n          ))}\n        </div>\n      )}\n\n      {/* Add Rule Form */}\n      {showAddForm ? (\n        <div className=\"p-4 bg-status-info-bg border border-status-info-border rounded space-y-3\">\n          <div className=\"flex items-end gap-3\">\n            <div className=\"flex-1\">\n              <label className=\"block text-sm font-medium text-foreground mb-1\">\n                {t('business_rules.sets.members.form.selectRule')}\n              </label>\n              <Select\n                value={selectedRuleId || undefined}\n                onValueChange={(value) => setSelectedRuleId(value ?? '')}\n              >\n                <SelectTrigger>\n                  <SelectValue placeholder={t('business_rules.sets.members.form.selectRulePlaceholder')} />\n                </SelectTrigger>\n                <SelectContent>\n                  {rulesNotInSet.map((rule) => (\n                    <SelectItem key={rule.id} value={rule.id}>\n                      {rule.ruleName} ({rule.ruleId})\n                    </SelectItem>\n                  ))}\n                </SelectContent>\n              </Select>\n            </div>\n\n            <div className=\"w-32\">\n              <label className=\"block text-sm font-medium text-foreground mb-1\">\n                {t('business_rules.sets.members.form.sequence')}\n              </label>\n              <Input\n                type=\"number\"\n                value={sequence}\n                onChange={(e) => setSequence(parseInt(e.target.value) || 0)}\n                min={0}\n              />\n            </div>\n          </div>\n\n          <div className=\"flex gap-2\">\n            <Button onClick={handleAdd} disabled={!selectedRuleId} size=\"sm\">\n              {t('business_rules.sets.members.actions.add')}\n            </Button>\n            <Button\n              onClick={() => {\n                setShowAddForm(false)\n                setSelectedRuleId('')\n                setSequence(0)\n              }}\n              variant=\"outline\"\n              size=\"sm\"\n            >\n              {t('common.cancel')}\n            </Button>\n          </div>\n        </div>\n      ) : (\n        <Button onClick={() => setShowAddForm(true)} variant=\"outline\" size=\"sm\">\n          <Plus className=\"w-4 h-4 mr-2\" />\n          {t('business_rules.sets.members.actions.addRule')}\n        </Button>\n      )}\n\n      {/* Help Text */}\n      <div className=\"text-xs text-muted-foreground space-y-1\">\n        <p>\n          <strong>{t('business_rules.sets.members.help.ordering')}:</strong>{' '}\n          {t('business_rules.sets.members.help.orderingDescription')}\n        </p>\n        <p>\n          <strong>{t('business_rules.sets.members.help.enabled')}:</strong>{' '}\n          {t('business_rules.sets.members.help.enabledDescription')}\n        </p>\n      </div>\n    </div>\n  )\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/modules/catalog/backend/catalog/products/[id]/page.js

@@ -19,6 +19,13 @@ import { flash } from "@open-mercato/ui/backend/FlashMessages";
 import { Button } from "@open-mercato/ui/primitives/button";
 import { Input } from "@open-mercato/ui/primitives/input";
 import { Label } from "@open-mercato/ui/primitives/label";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from "@open-mercato/ui/primitives/select";
 import { TagsInput } from "@open-mercato/ui/backend/inputs/TagsInput";
 import { Textarea } from "@open-mercato/ui/primitives/textarea";
 import { DataLoader } from "@open-mercato/ui/primitives/DataLoader";
@@ -2010,13 +2017,12 @@ function ProductMetaSection({
     ] }),
     /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
       /* @__PURE__ */ jsx(Label, { children: t("catalog.products.form.productType", "Product type") }),
-      /* @__PURE__ */ jsx(
-        "select",
+      /* @__PURE__ */ jsxs(
+        Select,
         {
-          className: "w-full rounded-md border border-input bg-background px-3 py-2 text-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
           value: values.productType || "simple",
-          onChange: (event) => {
-            const nextType = event.target.value;
+          onValueChange: (value) => {
+            const nextType = value;
             setValue("productType", nextType);
             const nextIsConfigurable = isConfigurableProductType(nextType);
             if (nextIsConfigurable && !values.hasVariants) {
@@ -2025,24 +2031,16 @@ function ProductMetaSection({
               setValue("hasVariants", false);
             }
           },
-          children: CATALOG_PRODUCT_TYPES.map((type) => {
-            const isDisabled = type === "bundle" || type === "grouped";
-            return /* @__PURE__ */ jsxs(
-              "option",
-              {
-                value: type,
-                disabled: isDisabled,
-                children: [
-                  t(
-                    `catalog.products.types.${type}`,
-                    type
-                  ),
-                  isDisabled ? ` (${t("common.comingSoon", "Coming soon")})` : ""
-                ]
-              },
-              type
-            );
-          })
+          children: [
+            /* @__PURE__ */ jsx(SelectTrigger, { children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+            /* @__PURE__ */ jsx(SelectContent, { children: CATALOG_PRODUCT_TYPES.map((type) => {
+              const isDisabled = type === "bundle" || type === "grouped";
+              return /* @__PURE__ */ jsxs(SelectItem, { value: type, disabled: isDisabled, children: [
+                t(`catalog.products.types.${type}`, type),
+                isDisabled ? ` (${t("common.comingSoon", "Coming soon")})` : ""
+              ] }, type);
+            }) })
+          ]
         }
       ),
       errors.productType ? /* @__PURE__ */ jsx("p", { className: "text-xs text-red-600", children: errors.productType }) : null
@@ -2081,21 +2079,19 @@ function ProductMetaSection({
         )
       ] }),
       /* @__PURE__ */ jsxs(
-        "select",
+        Select,
         {
-          className: "w-full rounded-md border border-input bg-background px-3 py-2 text-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
-          value: values.taxRateId ?? "",
-          onChange: (event) => setValue("taxRateId", event.target.value || null),
+          value: values.taxRateId || void 0,
+          onValueChange: (value) => setValue("taxRateId", value || null),
           disabled: !taxRates.length,
           children: [
-            /* @__PURE__ */ jsx("option", { value: "", children: taxRates.length ? t(
-              "catalog.products.create.taxRates.noneSelected",
-              "No tax class selected"
-            ) : t(
-              "catalog.products.create.taxRates.emptyOption",
-              "No tax classes available"
+            /* @__PURE__ */ jsx(SelectTrigger, { children: /* @__PURE__ */ jsx(
+              SelectValue,
+              {
+                placeholder: taxRates.length ? t("catalog.products.create.taxRates.noneSelected", "No tax class selected") : t("catalog.products.create.taxRates.emptyOption", "No tax classes available")
+              }
             ) }),
-            taxRates.map((rate) => /* @__PURE__ */ jsx("option", { value: rate.id, children: formatTaxRateLabel(rate) }, rate.id))
+            /* @__PURE__ */ jsx(SelectContent, { children: taxRates.map((rate) => /* @__PURE__ */ jsx(SelectItem, { value: rate.id, children: formatTaxRateLabel(rate) }, rate.id)) })
           ]
         }
       ),