@burdenoff/microfe-bigconsole 2026.805.2 → 2026.805.3

package/dist/bigconsole/components/widgets/form/FormWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormWidget.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/form/FormWidget.tsx"],"sourcesContent":["/**\n * FormWidget Component\n *\n * Interactive form widget for data input with validation and submit actions.\n * v2.0 spec compliant widget type.\n */\n\nimport { type FC, memo, useState, useCallback, useMemo } from 'react';\nimport type {\n  Widget,\n  FormConfig as FormConfigType,\n  FormFieldConfig,\n  FormFieldType as FormFieldTypeAlias,\n  FormFieldOption,\n  FormValidationRule,\n} from '../../../types';\nimport { AlertCircle, CheckCircle, Send, RotateCcw, Settings, Loader2 } from 'lucide-react';\n\n// ============================================================================\n// Types\n// ============================================================================\n\n// Re-export types from main types file\nexport type FieldType = FormFieldTypeAlias;\nexport type FormField = FormFieldConfig;\nexport type SelectOption = FormFieldOption;\nexport type ValidationRule = FormValidationRule;\nexport type FormConfig = FormConfigType;\n\nexport interface FormWidgetProps {\n  widget: Widget;\n  data?: Record<string, unknown>;\n  /** Whether the widget is in edit mode */\n  isEditMode?: boolean;\n  /** Whether the widget is selected */\n  isSelected?: boolean;\n  /** Whether data is loading */\n  isLoading?: boolean;\n  /** Error message if any */\n  error?: string | null;\n  /** Callback when widget is clicked */\n  onClick?: () => void;\n  onDrilldown?: (selectedData: Record<string, unknown>) => void;\n  onSubmit?: (formData: Record<string, unknown>) => void;\n}\n\ninterface FieldErrors {\n  [fieldName: string]: string | null;\n}\n\n// ============================================================================\n// Validation\n// ============================================================================\n\nfunction validateField(value: unknown, field: FormField): string | null {\n  const strValue = String(value ?? '');\n  const isEmpty = value === null || value === undefined || strValue.trim() === '';\n\n  // Check required\n  if (field.required && isEmpty) {\n    return `${field.label} is required`;\n  }\n\n  // Skip other validations if empty and not required\n  if (isEmpty) return null;\n\n  // Apply validation rules\n  if (field.validation) {\n    for (const rule of field.validation) {\n      switch (rule.type) {\n        case 'required':\n          if (isEmpty) return rule.message;\n          break;\n        case 'minLength':\n          if (strValue.length < Number(rule.value)) return rule.message;\n          break;\n        case 'maxLength':\n          if (strValue.length > Number(rule.value)) return rule.message;\n          break;\n        case 'min':\n          if (Number(value) < Number(rule.value)) return rule.message;\n          break;\n        case 'max':\n          if (Number(value) > Number(rule.value)) return rule.message;\n          break;\n        case 'pattern':\n          if (rule.value && !new RegExp(String(rule.value)).test(strValue)) {\n            return rule.message;\n          }\n          break;\n        case 'email':\n          if (!/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/.test(strValue)) {\n            return rule.message;\n          }\n          break;\n      }\n    }\n  }\n\n  // Type-specific validation\n  if (field.type === 'email' && !field.validation?.some((r) => r.type === 'email')) {\n    if (!/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/.test(strValue)) {\n      return 'Please enter a valid email address';\n    }\n  }\n\n  if (field.type === 'url') {\n    try {\n      new URL(strValue);\n    } catch {\n      return 'Please enter a valid URL';\n    }\n  }\n\n  if (field.type === 'number') {\n    if (isNaN(Number(value))) {\n      return 'Please enter a valid number';\n    }\n    if (field.min !== undefined && Number(value) < Number(field.min)) {\n      return `Value must be at least ${field.min}`;\n    }\n    if (field.max !== undefined && Number(value) > Number(field.max)) {\n      return `Value must be at most ${field.max}`;\n    }\n  }\n\n  return null;\n}\n\nfunction validateForm(values: Record<string, unknown>, fields: FormField[]): FieldErrors {\n  const errors: FieldErrors = {};\n  for (const field of fields) {\n    const error = validateField(values[field.name], field);\n    if (error) {\n      errors[field.name] = error;\n    }\n  }\n  return errors;\n}\n\n// ============================================================================\n// Data normalisation (DataSink -> Parser -> Widget)\n// ============================================================================\n\nexport interface NormalizedFormData {\n  /** Resolved initial values keyed by field name. */\n  values: Record<string, unknown>;\n  /** Dynamic options keyed by field name (select / radio only). */\n  fieldOptions: Record<string, FormFieldOption[]>;\n}\n\n/**\n * Normalise parser output into the shape the FormWidget expects.\n *\n * The parser can emit one of three shapes:\n *  1. `{ values: { fieldName: value }, options: { fieldName: [...] } }` — explicit\n *     envelope. Values populate field defaults; options replace select/radio options.\n *  2. `{ fieldName: value, ... }` — flat object. Each key is treated as a field value.\n *  3. `{ questions: [...] }` or `{ fields: [...] }` — not consumed by the renderer;\n *     the widget config owns the field schema. Values are extracted when the keys match.\n *\n * Config-defined `defaultValue` is the final fallback for any missing value.\n */\nexport function normalizeFormData(data: Record<string, unknown> | undefined, fields: FormField[]): NormalizedFormData {\n  const values: Record<string, unknown> = {};\n  const fieldOptions: Record<string, FormFieldOption[]> = {};\n\n  if (!data || typeof data !== 'object' || Array.isArray(data)) {\n    for (const field of fields) {\n      values[field.name] = field.defaultValue ?? (field.type === 'checkbox' ? false : '');\n    }\n    return { values, fieldOptions };\n  }\n\n  const explicitValues =\n    data.values && typeof data.values === 'object' && !Array.isArray(data.values)\n      ? (data.values as Record<string, unknown>)\n      : undefined;\n\n  const explicitOptions =\n    data.options && typeof data.options === 'object' && !Array.isArray(data.options)\n      ? (data.options as Record<string, unknown>)\n      : undefined;\n\n  for (const field of fields) {\n    // Resolve value: explicit envelope > flat data key > config default\n    let value: unknown = explicitValues?.[field.name] ?? data[field.name] ?? field.defaultValue;\n\n    // Normalise checkbox default to boolean\n    if (field.type === 'checkbox' && value === undefined) {\n      value = false;\n    }\n    values[field.name] = value ?? '';\n\n    // Resolve dynamic options for select / radio\n    if (field.type === 'select' || field.type === 'radio') {\n      const rawOptions = explicitOptions?.[field.name] ?? data[`${field.name}Options`];\n      if (Array.isArray(rawOptions)) {\n        fieldOptions[field.name] = rawOptions\n          .map((opt) => {\n            if (opt && typeof opt === 'object') {\n              const o = opt as Record<string, unknown>;\n              const normalized: FormFieldOption = {\n                value: String(o.value ?? o.id ?? o.key ?? ''),\n                label: String(o.label ?? o.name ?? o.text ?? o.value ?? o.id ?? o.key ?? ''),\n              };\n              if (o.disabled === true) {\n                normalized.disabled = true;\n              }\n              return normalized;\n            }\n            if (typeof opt === 'string' || typeof opt === 'number') {\n              return { value: String(opt), label: String(opt) };\n            }\n            return null;\n          })\n          .filter((opt): opt is FormFieldOption => opt !== null);\n      }\n    }\n  }\n\n  return { values, fieldOptions };\n}\n\n// ============================================================================\n// Styles\n// ============================================================================\n\nconst styles = {\n  container: {\n    display: 'flex',\n    flexDirection: 'column' as const,\n    height: '100%',\n    overflow: 'hidden',\n  },\n  form: {\n    flex: 1,\n    overflow: 'auto',\n    padding: '16px',\n  },\n  fieldWrapper: {\n    marginBottom: '16px',\n  },\n  label: {\n    display: 'block',\n    fontSize: '13px',\n    fontWeight: 500,\n    color: 'var(--color-text-primary)',\n    marginBottom: '6px',\n  },\n  required: {\n    color: 'var(--color-status-error-text)',\n    marginLeft: '2px',\n  },\n  input: {\n    width: '100%',\n    padding: '8px 12px',\n    fontSize: '14px',\n    border: '1px solid var(--color-border-default)',\n    borderRadius: '6px',\n    backgroundColor: 'var(--color-bg-surface)',\n    transition: 'border-color 0.15s, box-shadow 0.15s',\n    outline: 'none',\n  },\n  inputError: {\n    borderColor: 'var(--color-status-error-border)',\n  },\n  inputFocus: {\n    borderColor: 'var(--color-border-focus)',\n    boxShadow: 'var(--shadow-focus)',\n  },\n  textarea: {\n    resize: 'vertical' as const,\n    minHeight: '80px',\n  },\n  select: {\n    appearance: 'none' as const,\n    backgroundImage: `url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e\")`,\n    backgroundPosition: 'right 8px center',\n    backgroundRepeat: 'no-repeat',\n    backgroundSize: '20px',\n    paddingRight: '36px',\n  },\n  checkbox: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: '8px',\n  },\n  checkboxInput: {\n    width: '16px',\n    height: '16px',\n    cursor: 'pointer',\n  },\n  helpText: {\n    fontSize: '12px',\n    color: 'var(--color-text-muted)',\n    marginTop: '4px',\n  },\n  errorText: {\n    fontSize: '12px',\n    color: 'var(--color-status-error-text)',\n    marginTop: '4px',\n    display: 'flex',\n    alignItems: 'center',\n    gap: '4px',\n  },\n  footer: {\n    display: 'flex',\n    justifyContent: 'flex-end',\n    gap: '12px',\n    padding: '12px 16px',\n    borderTop: '1px solid var(--color-border-subtle)',\n    backgroundColor: 'var(--color-bg-subtle)',\n  },\n  button: {\n    display: 'inline-flex',\n    alignItems: 'center',\n    gap: '8px',\n    padding: '8px 16px',\n    fontSize: '14px',\n    fontWeight: 500,\n    borderRadius: '6px',\n    cursor: 'pointer',\n    transition: 'all 0.15s',\n    border: 'none',\n  },\n  submitButton: {\n    backgroundColor: 'var(--color-action-primary-bg)',\n    color: 'var(--color-text-inverse)',\n  },\n  resetButton: {\n    backgroundColor: 'var(--color-bg-surface)',\n    color: 'var(--color-text-primary)',\n    border: '1px solid var(--color-border-default)',\n  },\n  successMessage: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: '8px',\n    padding: '12px 16px',\n    backgroundColor: 'var(--color-status-success-bgSubtle)',\n    border: '1px solid var(--color-status-success-border)',\n    borderRadius: '6px',\n    marginBottom: '16px',\n    color: 'var(--color-status-success-text)',\n    fontSize: '14px',\n  },\n  emptyState: {\n    display: 'flex',\n    flexDirection: 'column' as const,\n    alignItems: 'center',\n    justifyContent: 'center',\n    height: '100%',\n    padding: '32px',\n    color: 'var(--color-text-muted)',\n    textAlign: 'center' as const,\n  },\n};\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const FormWidget: FC<FormWidgetProps> = memo(function FormWidget({ widget, data = {}, onDrilldown, onSubmit }) {\n  const defaultConfig: FormConfig = {\n    fields: [],\n    layout: 'vertical',\n    submitLabel: 'Submit',\n    showReset: true,\n    validateOnBlur: true,\n    validateOnChange: false,\n  };\n  const config: FormConfig = widget.config\n    ? { ...defaultConfig, ...(widget.config as Partial<FormConfig>) }\n    : defaultConfig;\n\n  // Resolve parser-driven values and dynamic options for data-driven fields\n  const normalized = useMemo(() => normalizeFormData(data, config.fields), [data, config.fields]);\n\n  // Initialize form values from normalised parser output or config defaults\n  const initialValues = useMemo(() => {\n    return normalized.values;\n  }, [normalized.values]);\n\n  const [values, setValues] = useState<Record<string, unknown>>(initialValues);\n  const [errors, setErrors] = useState<FieldErrors>({});\n  const [touched, setTouched] = useState<Set<string>>(new Set());\n  const [isSubmitting, setIsSubmitting] = useState(false);\n  const [submitSuccess, setSubmitSuccess] = useState(false);\n\n  // Handle field change\n  const handleChange = useCallback(\n    (fieldName: string, value: unknown) => {\n      setValues((prev) => ({ ...prev, [fieldName]: value }));\n      setSubmitSuccess(false);\n\n      if (config.validateOnChange) {\n        const field = config.fields.find((f) => f.name === fieldName);\n        if (field) {\n          const error = validateField(value, field);\n          setErrors((prev) => ({ ...prev, [fieldName]: error }));\n        }\n      }\n    },\n    [config.fields, config.validateOnChange]\n  );\n\n  // Handle field blur\n  const handleBlur = useCallback(\n    (fieldName: string) => {\n      setTouched((prev) => new Set(prev).add(fieldName));\n\n      if (config.validateOnBlur) {\n        const field = config.fields.find((f) => f.name === fieldName);\n        if (field) {\n          const error = validateField(values[fieldName], field);\n          setErrors((prev) => ({ ...prev, [fieldName]: error }));\n        }\n      }\n    },\n    [config.fields, config.validateOnBlur, values]\n  );\n\n  // Handle form submit\n  const handleSubmit = useCallback(\n    async (e: React.FormEvent) => {\n      e.preventDefault();\n\n      // Validate all fields\n      const allErrors = validateForm(values, config.fields);\n      setErrors(allErrors);\n      setTouched(new Set(config.fields.map((f) => f.name)));\n\n      // Check if there are errors\n      const hasErrors = Object.values(allErrors).some((e) => e !== null);\n      if (hasErrors) {\n        return;\n      }\n\n      setIsSubmitting(true);\n\n      try {\n        // Emit form submit event via onDrilldown or onSubmit\n        const formData = {\n          ...values,\n          _action: config.submitAction || 'form_submit',\n          _widgetId: widget.id,\n          _timestamp: new Date().toISOString(),\n        };\n\n        if (onSubmit) {\n          await onSubmit(formData);\n        }\n\n        if (onDrilldown) {\n          onDrilldown({\n            type: 'form_submit',\n            action: config.submitAction || 'form_submit',\n            data: formData,\n          });\n        }\n\n        setSubmitSuccess(true);\n      } catch (error) {\n      } finally {\n        setIsSubmitting(false);\n      }\n    },\n    [values, config.fields, config.submitAction, widget.id, onSubmit, onDrilldown]\n  );\n\n  // Handle form reset\n  const handleReset = useCallback(() => {\n    setValues(initialValues);\n    setErrors({});\n    setTouched(new Set());\n    setSubmitSuccess(false);\n  }, [initialValues]);\n\n  // Render a field\n  const renderField = useCallback(\n    (field: FormField) => {\n      const value = values[field.name];\n      const error = touched.has(field.name) ? errors[field.name] : null;\n      const hasError = Boolean(error);\n\n      const inputStyle = {\n        ...styles.input,\n        ...(hasError ? styles.inputError : {}),\n      };\n\n      switch (field.type) {\n        case 'textarea':\n          return (\n            <textarea\n              id={field.name}\n              name={field.name}\n              value={String(value ?? '')}\n              placeholder={field.placeholder}\n              required={field.required}\n              disabled={field.disabled || isSubmitting}\n              readOnly={field.readonly}\n              rows={field.rows || 4}\n              style={{ ...inputStyle, ...styles.textarea }}\n              onChange={(e) => handleChange(field.name, e.target.value)}\n              onBlur={() => handleBlur(field.name)}\n            />\n          );\n\n        case 'select': {\n          const selectOptions = normalized.fieldOptions[field.name] ?? field.options ?? [];\n          return (\n            <select\n              id={field.name}\n              name={field.name}\n              value={String(value ?? '')}\n              required={field.required}\n              disabled={field.disabled || isSubmitting}\n              style={{ ...inputStyle, ...styles.select }}\n              onChange={(e) => handleChange(field.name, e.target.value)}\n              onBlur={() => handleBlur(field.name)}\n            >\n              <option value=\"\">{field.placeholder || `Select ${field.label}...`}</option>\n              {selectOptions.map((opt) => (\n                <option key={opt.value} value={opt.value} disabled={opt.disabled}>\n                  {opt.label}\n                </option>\n              ))}\n            </select>\n          );\n        }\n\n        case 'checkbox':\n          return (\n            <div style={styles.checkbox}>\n              <input\n                type=\"checkbox\"\n                id={field.name}\n                name={field.name}\n                checked={Boolean(value)}\n                disabled={field.disabled || isSubmitting}\n                style={styles.checkboxInput}\n                onChange={(e) => handleChange(field.name, e.target.checked)}\n                onBlur={() => handleBlur(field.name)}\n              />\n              <label htmlFor={field.name} style={{ fontSize: '14px', cursor: 'pointer' }}>\n                {field.label}\n              </label>\n            </div>\n          );\n\n        case 'radio': {\n          const radioOptions = normalized.fieldOptions[field.name] ?? field.options ?? [];\n          return (\n            <div style={{ display: 'flex', flexDirection: 'column', gap: '8px' }}>\n              {radioOptions.map((opt) => (\n                <div key={opt.value} style={styles.checkbox}>\n                  <input\n                    type=\"radio\"\n                    id={`${field.name}-${opt.value}`}\n                    name={field.name}\n                    value={opt.value}\n                    checked={value === opt.value}\n                    disabled={field.disabled || opt.disabled || isSubmitting}\n                    style={styles.checkboxInput}\n                    onChange={(e) => handleChange(field.name, e.target.value)}\n                    onBlur={() => handleBlur(field.name)}\n                  />\n                  <label htmlFor={`${field.name}-${opt.value}`} style={{ fontSize: '14px', cursor: 'pointer' }}>\n                    {opt.label}\n                  </label>\n                </div>\n              ))}\n            </div>\n          );\n        }\n\n        case 'hidden':\n          return <input type=\"hidden\" name={field.name} value={String(value ?? '')} />;\n\n        default:\n          return (\n            <input\n              type={field.type}\n              id={field.name}\n              name={field.name}\n              value={String(value ?? '')}\n              placeholder={field.placeholder}\n              required={field.required}\n              disabled={field.disabled || isSubmitting}\n              readOnly={field.readonly}\n              min={field.min}\n              max={field.max}\n              step={field.step}\n              pattern={field.pattern}\n              style={inputStyle}\n              onChange={(e) =>\n                handleChange(field.name, field.type === 'number' ? e.target.valueAsNumber : e.target.value)\n              }\n              onBlur={() => handleBlur(field.name)}\n            />\n          );\n      }\n    },\n    [values, errors, touched, isSubmitting, handleChange, handleBlur, normalized]\n  );\n\n  // Empty state\n  if (config.fields.length === 0) {\n    return (\n      <div style={styles.emptyState}>\n        <Settings style={{ width: '48px', height: '48px', marginBottom: '16px', opacity: 0.5 }} />\n        <p style={{ fontSize: '14px' }}>Configure Form Fields</p>\n        <p style={{ fontSize: '12px', marginTop: '4px' }}>Add fields in widget settings to create your form</p>\n      </div>\n    );\n  }\n\n  // Grid layout styles\n  const gridStyle =\n    config.layout === 'grid'\n      ? {\n          display: 'grid',\n          gridTemplateColumns: `repeat(${config.columns || 2}, 1fr)`,\n          gap: '16px',\n        }\n      : {};\n\n  return (\n    <div style={styles.container}>\n      <form onSubmit={handleSubmit} style={{ ...styles.form, ...gridStyle }}>\n        {/* Success message */}\n        {submitSuccess && config.successMessage && (\n          <div style={{ ...styles.successMessage, gridColumn: '1 / -1' }}>\n            <CheckCircle style={{ width: '18px', height: '18px' }} />\n            {config.successMessage}\n          </div>\n        )}\n\n        {/* Form fields */}\n        {config.fields.map((field) => {\n          if (field.type === 'hidden') {\n            return renderField(field);\n          }\n\n          const error = touched.has(field.name) ? errors[field.name] : null;\n\n          return (\n            <div key={field.name} style={styles.fieldWrapper}>\n              {field.type !== 'checkbox' && (\n                <label htmlFor={field.name} style={styles.label}>\n                  {field.label}\n                  {field.required && <span style={styles.required}>*</span>}\n                </label>\n              )}\n\n              {renderField(field)}\n\n              {field.helpText && !error && <p style={styles.helpText}>{field.helpText}</p>}\n\n              {error && (\n                <p style={styles.errorText}>\n                  <AlertCircle style={{ width: '14px', height: '14px' }} />\n                  {error}\n                </p>\n              )}\n            </div>\n          );\n        })}\n      </form>\n\n      {/* Footer with buttons */}\n      <div style={styles.footer}>\n        {config.showReset !== false && (\n          <button\n            type=\"button\"\n            onClick={handleReset}\n            disabled={isSubmitting}\n            style={{\n              ...styles.button,\n              ...styles.resetButton,\n              opacity: isSubmitting ? 0.6 : 1,\n            }}\n          >\n            <RotateCcw style={{ width: '16px', height: '16px' }} />\n            {config.resetLabel || 'Reset'}\n          </button>\n        )}\n\n        <button\n          type=\"submit\"\n          onClick={handleSubmit}\n          disabled={isSubmitting}\n          style={{\n            ...styles.button,\n            ...styles.submitButton,\n            opacity: isSubmitting ? 0.6 : 1,\n          }}\n        >\n          {isSubmitting ? (\n            <Loader2 style={{ width: '16px', height: '16px', animation: 'spin 1s linear infinite' }} />\n          ) : (\n            <Send style={{ width: '16px', height: '16px' }} />\n          )}\n          {config.submitLabel || 'Submit'}\n        </button>\n      </div>\n    </div>\n  );\n});\n\nexport default FormWidget;\n"],"mappings":"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"}
+{"version":3,"file":"FormWidget.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/form/FormWidget.tsx"],"sourcesContent":["/**\n * FormWidget Component\n *\n * Interactive form widget for data input with validation and submit actions.\n * v2.0 spec compliant widget type.\n */\n\nimport { type FC, memo, useState, useCallback, useMemo } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport type {\n  Widget,\n  FormConfig as FormConfigType,\n  FormFieldConfig,\n  FormFieldType as FormFieldTypeAlias,\n  FormFieldOption,\n  FormValidationRule,\n} from '../../../types';\nimport { AlertCircle, CheckCircle, Send, RotateCcw, Settings, Loader2 } from 'lucide-react';\n\n// ============================================================================\n// Types\n// ============================================================================\n\n// Re-export types from main types file\nexport type FieldType = FormFieldTypeAlias;\nexport type FormField = FormFieldConfig;\nexport type SelectOption = FormFieldOption;\nexport type ValidationRule = FormValidationRule;\nexport type FormConfig = FormConfigType;\n\nexport interface FormWidgetProps {\n  widget: Widget;\n  data?: Record<string, unknown>;\n  /** Whether the widget is in edit mode */\n  isEditMode?: boolean;\n  /** Whether the widget is selected */\n  isSelected?: boolean;\n  /** Whether data is loading */\n  isLoading?: boolean;\n  /** Error message if any */\n  error?: string | null;\n  /** Callback when widget is clicked */\n  onClick?: () => void;\n  onDrilldown?: (selectedData: Record<string, unknown>) => void;\n  onSubmit?: (formData: Record<string, unknown>) => void;\n}\n\ninterface FieldErrors {\n  [fieldName: string]: string | null;\n}\n\n// ============================================================================\n// Validation\n// ============================================================================\n\n/** Translator function shape from useI18n().t, threaded into module-level validators. */\ntype TFunc = (\n  key: string,\n  fallbackOrParams?: string | Record<string, string | number>,\n  params?: Record<string, string | number>\n) => string;\n\nfunction validateField(value: unknown, field: FormField, t: TFunc): string | null {\n  const strValue = String(value ?? '');\n  const isEmpty = value === null || value === undefined || strValue.trim() === '';\n\n  // Check required\n  if (field.required && isEmpty) {\n    return t('bigconsole.widget.form.validation.required', '{{label}} is required', { label: field.label ?? '' });\n  }\n\n  // Skip other validations if empty and not required\n  if (isEmpty) return null;\n\n  // Apply validation rules\n  if (field.validation) {\n    for (const rule of field.validation) {\n      switch (rule.type) {\n        case 'required':\n          if (isEmpty) return rule.message;\n          break;\n        case 'minLength':\n          if (strValue.length < Number(rule.value)) return rule.message;\n          break;\n        case 'maxLength':\n          if (strValue.length > Number(rule.value)) return rule.message;\n          break;\n        case 'min':\n          if (Number(value) < Number(rule.value)) return rule.message;\n          break;\n        case 'max':\n          if (Number(value) > Number(rule.value)) return rule.message;\n          break;\n        case 'pattern':\n          if (rule.value && !new RegExp(String(rule.value)).test(strValue)) {\n            return rule.message;\n          }\n          break;\n        case 'email':\n          if (!/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/.test(strValue)) {\n            return rule.message;\n          }\n          break;\n      }\n    }\n  }\n\n  // Type-specific validation\n  if (field.type === 'email' && !field.validation?.some((r) => r.type === 'email')) {\n    if (!/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/.test(strValue)) {\n      return t('bigconsole.widget.form.validation.email', 'Please enter a valid email address');\n    }\n  }\n\n  if (field.type === 'url') {\n    try {\n      new URL(strValue);\n    } catch {\n      return t('bigconsole.widget.form.validation.url', 'Please enter a valid URL');\n    }\n  }\n\n  if (field.type === 'number') {\n    if (isNaN(Number(value))) {\n      return t('bigconsole.widget.form.validation.number', 'Please enter a valid number');\n    }\n    if (field.min !== undefined && Number(value) < Number(field.min)) {\n      return t('bigconsole.widget.form.validation.min', 'Value must be at least {{min}}', {\n        min: field.min ?? '',\n      });\n    }\n    if (field.max !== undefined && Number(value) > Number(field.max)) {\n      return t('bigconsole.widget.form.validation.max', 'Value must be at most {{max}}', {\n        max: field.max ?? '',\n      });\n    }\n  }\n\n  return null;\n}\n\nfunction validateForm(values: Record<string, unknown>, fields: FormField[], t: TFunc): FieldErrors {\n  const errors: FieldErrors = {};\n  for (const field of fields) {\n    const error = validateField(values[field.name], field, t);\n    if (error) {\n      errors[field.name] = error;\n    }\n  }\n  return errors;\n}\n\n// ============================================================================\n// Data normalisation (DataSink -> Parser -> Widget)\n// ============================================================================\n\nexport interface NormalizedFormData {\n  /** Resolved initial values keyed by field name. */\n  values: Record<string, unknown>;\n  /** Dynamic options keyed by field name (select / radio only). */\n  fieldOptions: Record<string, FormFieldOption[]>;\n}\n\n/**\n * Normalise parser output into the shape the FormWidget expects.\n *\n * The parser can emit one of three shapes:\n *  1. `{ values: { fieldName: value }, options: { fieldName: [...] } }` — explicit\n *     envelope. Values populate field defaults; options replace select/radio options.\n *  2. `{ fieldName: value, ... }` — flat object. Each key is treated as a field value.\n *  3. `{ questions: [...] }` or `{ fields: [...] }` — not consumed by the renderer;\n *     the widget config owns the field schema. Values are extracted when the keys match.\n *\n * Config-defined `defaultValue` is the final fallback for any missing value.\n */\nexport function normalizeFormData(data: Record<string, unknown> | undefined, fields: FormField[]): NormalizedFormData {\n  const values: Record<string, unknown> = {};\n  const fieldOptions: Record<string, FormFieldOption[]> = {};\n\n  if (!data || typeof data !== 'object' || Array.isArray(data)) {\n    for (const field of fields) {\n      values[field.name] = field.defaultValue ?? (field.type === 'checkbox' ? false : '');\n    }\n    return { values, fieldOptions };\n  }\n\n  const explicitValues =\n    data.values && typeof data.values === 'object' && !Array.isArray(data.values)\n      ? (data.values as Record<string, unknown>)\n      : undefined;\n\n  const explicitOptions =\n    data.options && typeof data.options === 'object' && !Array.isArray(data.options)\n      ? (data.options as Record<string, unknown>)\n      : undefined;\n\n  for (const field of fields) {\n    // Resolve value: explicit envelope > flat data key > config default\n    let value: unknown = explicitValues?.[field.name] ?? data[field.name] ?? field.defaultValue;\n\n    // Normalise checkbox default to boolean\n    if (field.type === 'checkbox' && value === undefined) {\n      value = false;\n    }\n    values[field.name] = value ?? '';\n\n    // Resolve dynamic options for select / radio\n    if (field.type === 'select' || field.type === 'radio') {\n      const rawOptions = explicitOptions?.[field.name] ?? data[`${field.name}Options`];\n      if (Array.isArray(rawOptions)) {\n        fieldOptions[field.name] = rawOptions\n          .map((opt) => {\n            if (opt && typeof opt === 'object') {\n              const o = opt as Record<string, unknown>;\n              const normalized: FormFieldOption = {\n                value: String(o.value ?? o.id ?? o.key ?? ''),\n                label: String(o.label ?? o.name ?? o.text ?? o.value ?? o.id ?? o.key ?? ''),\n              };\n              if (o.disabled === true) {\n                normalized.disabled = true;\n              }\n              return normalized;\n            }\n            if (typeof opt === 'string' || typeof opt === 'number') {\n              return { value: String(opt), label: String(opt) };\n            }\n            return null;\n          })\n          .filter((opt): opt is FormFieldOption => opt !== null);\n      }\n    }\n  }\n\n  return { values, fieldOptions };\n}\n\n// ============================================================================\n// Styles\n// ============================================================================\n\nconst styles = {\n  container: {\n    display: 'flex',\n    flexDirection: 'column' as const,\n    height: '100%',\n    overflow: 'hidden',\n  },\n  form: {\n    flex: 1,\n    overflow: 'auto',\n    padding: '16px',\n  },\n  fieldWrapper: {\n    marginBottom: '16px',\n  },\n  label: {\n    display: 'block',\n    fontSize: '13px',\n    fontWeight: 500,\n    color: 'var(--color-text-primary)',\n    marginBottom: '6px',\n  },\n  required: {\n    color: 'var(--color-status-error-text)',\n    marginLeft: '2px',\n  },\n  input: {\n    width: '100%',\n    padding: '8px 12px',\n    fontSize: '14px',\n    border: '1px solid var(--color-border-default)',\n    borderRadius: '6px',\n    backgroundColor: 'var(--color-bg-surface)',\n    transition: 'border-color 0.15s, box-shadow 0.15s',\n    outline: 'none',\n  },\n  inputError: {\n    borderColor: 'var(--color-status-error-border)',\n  },\n  inputFocus: {\n    borderColor: 'var(--color-border-focus)',\n    boxShadow: 'var(--shadow-focus)',\n  },\n  textarea: {\n    resize: 'vertical' as const,\n    minHeight: '80px',\n  },\n  select: {\n    appearance: 'none' as const,\n    backgroundImage: `url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e\")`,\n    backgroundPosition: 'right 8px center',\n    backgroundRepeat: 'no-repeat',\n    backgroundSize: '20px',\n    paddingRight: '36px',\n  },\n  checkbox: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: '8px',\n  },\n  checkboxInput: {\n    width: '16px',\n    height: '16px',\n    cursor: 'pointer',\n  },\n  helpText: {\n    fontSize: '12px',\n    color: 'var(--color-text-muted)',\n    marginTop: '4px',\n  },\n  errorText: {\n    fontSize: '12px',\n    color: 'var(--color-status-error-text)',\n    marginTop: '4px',\n    display: 'flex',\n    alignItems: 'center',\n    gap: '4px',\n  },\n  footer: {\n    display: 'flex',\n    justifyContent: 'flex-end',\n    gap: '12px',\n    padding: '12px 16px',\n    borderTop: '1px solid var(--color-border-subtle)',\n    backgroundColor: 'var(--color-bg-subtle)',\n  },\n  button: {\n    display: 'inline-flex',\n    alignItems: 'center',\n    gap: '8px',\n    padding: '8px 16px',\n    fontSize: '14px',\n    fontWeight: 500,\n    borderRadius: '6px',\n    cursor: 'pointer',\n    transition: 'all 0.15s',\n    border: 'none',\n  },\n  submitButton: {\n    backgroundColor: 'var(--color-action-primary-bg)',\n    color: 'var(--color-text-inverse)',\n  },\n  resetButton: {\n    backgroundColor: 'var(--color-bg-surface)',\n    color: 'var(--color-text-primary)',\n    border: '1px solid var(--color-border-default)',\n  },\n  successMessage: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: '8px',\n    padding: '12px 16px',\n    backgroundColor: 'var(--color-status-success-bgSubtle)',\n    border: '1px solid var(--color-status-success-border)',\n    borderRadius: '6px',\n    marginBottom: '16px',\n    color: 'var(--color-status-success-text)',\n    fontSize: '14px',\n  },\n  emptyState: {\n    display: 'flex',\n    flexDirection: 'column' as const,\n    alignItems: 'center',\n    justifyContent: 'center',\n    height: '100%',\n    padding: '32px',\n    color: 'var(--color-text-muted)',\n    textAlign: 'center' as const,\n  },\n};\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const FormWidget: FC<FormWidgetProps> = memo(function FormWidget({ widget, data = {}, onDrilldown, onSubmit }) {\n  const { t } = useI18n();\n  const defaultConfig: FormConfig = {\n    fields: [],\n    layout: 'vertical',\n    submitLabel: 'Submit',\n    showReset: true,\n    validateOnBlur: true,\n    validateOnChange: false,\n  };\n  const config: FormConfig = widget.config\n    ? { ...defaultConfig, ...(widget.config as Partial<FormConfig>) }\n    : defaultConfig;\n\n  // Resolve parser-driven values and dynamic options for data-driven fields\n  const normalized = useMemo(() => normalizeFormData(data, config.fields), [data, config.fields]);\n\n  // Initialize form values from normalised parser output or config defaults\n  const initialValues = useMemo(() => {\n    return normalized.values;\n  }, [normalized.values]);\n\n  const [values, setValues] = useState<Record<string, unknown>>(initialValues);\n  const [errors, setErrors] = useState<FieldErrors>({});\n  const [touched, setTouched] = useState<Set<string>>(new Set());\n  const [isSubmitting, setIsSubmitting] = useState(false);\n  const [submitSuccess, setSubmitSuccess] = useState(false);\n\n  // Handle field change\n  const handleChange = useCallback(\n    (fieldName: string, value: unknown) => {\n      setValues((prev) => ({ ...prev, [fieldName]: value }));\n      setSubmitSuccess(false);\n\n      if (config.validateOnChange) {\n        const field = config.fields.find((f) => f.name === fieldName);\n        if (field) {\n          const error = validateField(value, field, t);\n          setErrors((prev) => ({ ...prev, [fieldName]: error }));\n        }\n      }\n    },\n    [config.fields, config.validateOnChange, t]\n  );\n\n  // Handle field blur\n  const handleBlur = useCallback(\n    (fieldName: string) => {\n      setTouched((prev) => new Set(prev).add(fieldName));\n\n      if (config.validateOnBlur) {\n        const field = config.fields.find((f) => f.name === fieldName);\n        if (field) {\n          const error = validateField(values[fieldName], field, t);\n          setErrors((prev) => ({ ...prev, [fieldName]: error }));\n        }\n      }\n    },\n    [config.fields, config.validateOnBlur, values, t]\n  );\n\n  // Handle form submit\n  const handleSubmit = useCallback(\n    async (e: React.FormEvent) => {\n      e.preventDefault();\n\n      // Validate all fields\n      const allErrors = validateForm(values, config.fields, t);\n      setErrors(allErrors);\n      setTouched(new Set(config.fields.map((f) => f.name)));\n\n      // Check if there are errors\n      const hasErrors = Object.values(allErrors).some((e) => e !== null);\n      if (hasErrors) {\n        return;\n      }\n\n      setIsSubmitting(true);\n\n      try {\n        // Emit form submit event via onDrilldown or onSubmit\n        const formData = {\n          ...values,\n          _action: config.submitAction || 'form_submit',\n          _widgetId: widget.id,\n          _timestamp: new Date().toISOString(),\n        };\n\n        if (onSubmit) {\n          await onSubmit(formData);\n        }\n\n        if (onDrilldown) {\n          onDrilldown({\n            type: 'form_submit',\n            action: config.submitAction || 'form_submit',\n            data: formData,\n          });\n        }\n\n        setSubmitSuccess(true);\n      } catch (error) {\n      } finally {\n        setIsSubmitting(false);\n      }\n    },\n    [values, config.fields, config.submitAction, widget.id, onSubmit, onDrilldown, t]\n  );\n\n  // Handle form reset\n  const handleReset = useCallback(() => {\n    setValues(initialValues);\n    setErrors({});\n    setTouched(new Set());\n    setSubmitSuccess(false);\n  }, [initialValues]);\n\n  // Render a field\n  const renderField = useCallback(\n    (field: FormField) => {\n      const value = values[field.name];\n      const error = touched.has(field.name) ? errors[field.name] : null;\n      const hasError = Boolean(error);\n\n      const inputStyle = {\n        ...styles.input,\n        ...(hasError ? styles.inputError : {}),\n      };\n\n      switch (field.type) {\n        case 'textarea':\n          return (\n            <textarea\n              id={field.name}\n              name={field.name}\n              value={String(value ?? '')}\n              placeholder={field.placeholder}\n              required={field.required}\n              disabled={field.disabled || isSubmitting}\n              readOnly={field.readonly}\n              rows={field.rows || 4}\n              style={{ ...inputStyle, ...styles.textarea }}\n              onChange={(e) => handleChange(field.name, e.target.value)}\n              onBlur={() => handleBlur(field.name)}\n            />\n          );\n\n        case 'select': {\n          const selectOptions = normalized.fieldOptions[field.name] ?? field.options ?? [];\n          return (\n            <select\n              id={field.name}\n              name={field.name}\n              value={String(value ?? '')}\n              required={field.required}\n              disabled={field.disabled || isSubmitting}\n              style={{ ...inputStyle, ...styles.select }}\n              onChange={(e) => handleChange(field.name, e.target.value)}\n              onBlur={() => handleBlur(field.name)}\n            >\n              <option value=\"\">\n                {field.placeholder ||\n                  t('bigconsole.widget.form.selectPlaceholder', 'Select {{label}}...', { label: field.label ?? '' })}\n              </option>\n              {selectOptions.map((opt) => (\n                <option key={opt.value} value={opt.value} disabled={opt.disabled}>\n                  {opt.label}\n                </option>\n              ))}\n            </select>\n          );\n        }\n\n        case 'checkbox':\n          return (\n            <div style={styles.checkbox}>\n              <input\n                type=\"checkbox\"\n                id={field.name}\n                name={field.name}\n                checked={Boolean(value)}\n                disabled={field.disabled || isSubmitting}\n                style={styles.checkboxInput}\n                onChange={(e) => handleChange(field.name, e.target.checked)}\n                onBlur={() => handleBlur(field.name)}\n              />\n              <label htmlFor={field.name} style={{ fontSize: '14px', cursor: 'pointer' }}>\n                {field.label}\n              </label>\n            </div>\n          );\n\n        case 'radio': {\n          const radioOptions = normalized.fieldOptions[field.name] ?? field.options ?? [];\n          return (\n            <div style={{ display: 'flex', flexDirection: 'column', gap: '8px' }}>\n              {radioOptions.map((opt) => (\n                <div key={opt.value} style={styles.checkbox}>\n                  <input\n                    type=\"radio\"\n                    id={`${field.name}-${opt.value}`}\n                    name={field.name}\n                    value={opt.value}\n                    checked={value === opt.value}\n                    disabled={field.disabled || opt.disabled || isSubmitting}\n                    style={styles.checkboxInput}\n                    onChange={(e) => handleChange(field.name, e.target.value)}\n                    onBlur={() => handleBlur(field.name)}\n                  />\n                  <label htmlFor={`${field.name}-${opt.value}`} style={{ fontSize: '14px', cursor: 'pointer' }}>\n                    {opt.label}\n                  </label>\n                </div>\n              ))}\n            </div>\n          );\n        }\n\n        case 'hidden':\n          return <input type=\"hidden\" name={field.name} value={String(value ?? '')} />;\n\n        default:\n          return (\n            <input\n              type={field.type}\n              id={field.name}\n              name={field.name}\n              value={String(value ?? '')}\n              placeholder={field.placeholder}\n              required={field.required}\n              disabled={field.disabled || isSubmitting}\n              readOnly={field.readonly}\n              min={field.min}\n              max={field.max}\n              step={field.step}\n              pattern={field.pattern}\n              style={inputStyle}\n              onChange={(e) =>\n                handleChange(field.name, field.type === 'number' ? e.target.valueAsNumber : e.target.value)\n              }\n              onBlur={() => handleBlur(field.name)}\n            />\n          );\n      }\n    },\n    [values, errors, touched, isSubmitting, handleChange, handleBlur, normalized, t]\n  );\n\n  // Empty state\n  if (config.fields.length === 0) {\n    return (\n      <div style={styles.emptyState}>\n        <Settings style={{ width: '48px', height: '48px', marginBottom: '16px', opacity: 0.5 }} />\n        <p style={{ fontSize: '14px' }}>{t('bigconsole.widget.form.configureTitle', 'Configure Form Fields')}</p>\n        <p style={{ fontSize: '12px', marginTop: '4px' }}>\n          {t('bigconsole.widget.form.configureHint', 'Add fields in widget settings to create your form')}\n        </p>\n      </div>\n    );\n  }\n\n  // Grid layout styles\n  const gridStyle =\n    config.layout === 'grid'\n      ? {\n          display: 'grid',\n          gridTemplateColumns: `repeat(${config.columns || 2}, 1fr)`,\n          gap: '16px',\n        }\n      : {};\n\n  return (\n    <div style={styles.container}>\n      <form onSubmit={handleSubmit} style={{ ...styles.form, ...gridStyle }}>\n        {/* Success message */}\n        {submitSuccess && config.successMessage && (\n          <div style={{ ...styles.successMessage, gridColumn: '1 / -1' }}>\n            <CheckCircle style={{ width: '18px', height: '18px' }} />\n            {config.successMessage}\n          </div>\n        )}\n\n        {/* Form fields */}\n        {config.fields.map((field) => {\n          if (field.type === 'hidden') {\n            return renderField(field);\n          }\n\n          const error = touched.has(field.name) ? errors[field.name] : null;\n\n          return (\n            <div key={field.name} style={styles.fieldWrapper}>\n              {field.type !== 'checkbox' && (\n                <label htmlFor={field.name} style={styles.label}>\n                  {field.label}\n                  {field.required && <span style={styles.required}>*</span>}\n                </label>\n              )}\n\n              {renderField(field)}\n\n              {field.helpText && !error && <p style={styles.helpText}>{field.helpText}</p>}\n\n              {error && (\n                <p style={styles.errorText}>\n                  <AlertCircle style={{ width: '14px', height: '14px' }} />\n                  {error}\n                </p>\n              )}\n            </div>\n          );\n        })}\n      </form>\n\n      {/* Footer with buttons */}\n      <div style={styles.footer}>\n        {config.showReset !== false && (\n          <button\n            type=\"button\"\n            onClick={handleReset}\n            disabled={isSubmitting}\n            style={{\n              ...styles.button,\n              ...styles.resetButton,\n              opacity: isSubmitting ? 0.6 : 1,\n            }}\n          >\n            <RotateCcw style={{ width: '16px', height: '16px' }} />\n            {config.resetLabel || t('bigconsole.widget.form.reset', 'Reset')}\n          </button>\n        )}\n\n        <button\n          type=\"submit\"\n          onClick={handleSubmit}\n          disabled={isSubmitting}\n          style={{\n            ...styles.button,\n            ...styles.submitButton,\n            opacity: isSubmitting ? 0.6 : 1,\n          }}\n        >\n          {isSubmitting ? (\n            <Loader2 style={{ width: '16px', height: '16px', animation: 'spin 1s linear infinite' }} />\n          ) : (\n            <Send style={{ width: '16px', height: '16px' }} />\n          )}\n          {config.submitLabel || t('bigconsole.widget.form.submit', 'Submit')}\n        </button>\n      </div>\n    </div>\n  );\n});\n\nexport default FormWidget;\n"],"mappings":"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"}

package/dist/bigconsole/components/widgets/gauge/GaugeConfig.js

@@ -1,104 +1,105 @@
 import { memo as e, useCallback as t } from "react";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { useI18n as n } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region src/bigconsole/components/widgets/gauge/GaugeConfig.tsx
-var i = e(function({ config: e, onChange: i }) {
-	let a = t((t, n) => {
-		i({
+var a = e(function({ config: e, onChange: a }) {
+	let { t: o } = n(), s = t((t, n) => {
+		a({
 			...e,
 			[t]: n
 		});
-	}, [e, i]);
-	return /* @__PURE__ */ r("div", {
+	}, [e, a]);
+	return /* @__PURE__ */ i("div", {
 		className: "space-y-4",
 		children: [
-			/* @__PURE__ */ r("div", { children: [/* @__PURE__ */ n("label", {
+			/* @__PURE__ */ i("div", { children: [/* @__PURE__ */ r("label", {
 				className: "block text-sm font-medium text-text-primary mb-1",
-				children: "Gauge Type"
-			}), /* @__PURE__ */ r("select", {
+				children: o("bigconsole.widget.config.gauge.gaugeType", "Gauge Type")
+			}), /* @__PURE__ */ i("select", {
 				value: e.variant || "circular",
-				onChange: (e) => a("variant", e.target.value),
+				onChange: (e) => s("variant", e.target.value),
 				className: "\n            w-full px-3 py-2\n            text-sm text-text-primary\n            bg-bg-surface\n            border border-border-default\n            rounded-md\n            focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n          ",
-				children: [/* @__PURE__ */ n("option", {
+				children: [/* @__PURE__ */ r("option", {
 					value: "circular",
-					children: "Circular"
-				}), /* @__PURE__ */ n("option", {
+					children: o("bigconsole.widget.config.gauge.variant.circular", "Circular")
+				}), /* @__PURE__ */ r("option", {
 					value: "linear",
-					children: "Linear"
+					children: o("bigconsole.widget.config.gauge.variant.linear", "Linear")
 				})]
 			})] }),
-			/* @__PURE__ */ r("div", {
+			/* @__PURE__ */ i("div", {
 				className: "grid grid-cols-2 gap-3",
-				children: [/* @__PURE__ */ r("div", { children: [/* @__PURE__ */ n("label", {
+				children: [/* @__PURE__ */ i("div", { children: [/* @__PURE__ */ r("label", {
 					className: "block text-sm font-medium text-text-primary mb-1",
-					children: "Minimum"
-				}), /* @__PURE__ */ n("input", {
+					children: o("bigconsole.widget.config.gauge.minimum", "Minimum")
+				}), /* @__PURE__ */ r("input", {
 					type: "number",
 					value: e.min ?? 0,
-					onChange: (e) => a("min", Number(e.target.value)),
+					onChange: (e) => s("min", Number(e.target.value)),
 					className: "\n              w-full px-3 py-2\n              text-sm text-text-primary\n              bg-bg-surface\n              border border-border-default\n              rounded-md\n              focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n            "
-				})] }), /* @__PURE__ */ r("div", { children: [/* @__PURE__ */ n("label", {
+				})] }), /* @__PURE__ */ i("div", { children: [/* @__PURE__ */ r("label", {
 					className: "block text-sm font-medium text-text-primary mb-1",
-					children: "Maximum"
-				}), /* @__PURE__ */ n("input", {
+					children: o("bigconsole.widget.config.gauge.maximum", "Maximum")
+				}), /* @__PURE__ */ r("input", {
 					type: "number",
 					value: e.max ?? 100,
-					onChange: (e) => a("max", Number(e.target.value)),
+					onChange: (e) => s("max", Number(e.target.value)),
 					className: "\n              w-full px-3 py-2\n              text-sm text-text-primary\n              bg-bg-surface\n              border border-border-default\n              rounded-md\n              focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n            "
 				})] })]
 			}),
-			/* @__PURE__ */ r("div", { children: [/* @__PURE__ */ n("label", {
+			/* @__PURE__ */ i("div", { children: [/* @__PURE__ */ r("label", {
 				className: "block text-sm font-medium text-text-primary mb-1",
-				children: "Unit Label"
-			}), /* @__PURE__ */ n("input", {
+				children: o("bigconsole.widget.config.gauge.unitLabel", "Unit Label")
+			}), /* @__PURE__ */ r("input", {
 				type: "text",
 				value: e.unit || "",
-				onChange: (e) => a("unit", e.target.value),
-				placeholder: "e.g., %, ms, users",
+				onChange: (e) => s("unit", e.target.value),
+				placeholder: o("bigconsole.widget.config.gauge.unitPlaceholder", "e.g., %, ms, users"),
 				className: "\n            w-full px-3 py-2\n            text-sm text-text-primary\n            bg-bg-surface\n            border border-border-default\n            rounded-md\n            focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n          "
 			})] }),
-			/* @__PURE__ */ r("div", { children: [/* @__PURE__ */ n("label", {
+			/* @__PURE__ */ i("div", { children: [/* @__PURE__ */ r("label", {
 				className: "block text-sm font-medium text-text-primary mb-1",
-				children: "Value Format"
-			}), /* @__PURE__ */ r("select", {
+				children: o("bigconsole.widget.config.gauge.valueFormat", "Value Format")
+			}), /* @__PURE__ */ i("select", {
 				value: e.format || "number",
-				onChange: (e) => a("format", e.target.value),
+				onChange: (e) => s("format", e.target.value),
 				className: "\n            w-full px-3 py-2\n            text-sm text-text-primary\n            bg-bg-surface\n            border border-border-default\n            rounded-md\n            focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n          ",
 				children: [
-					/* @__PURE__ */ n("option", {
+					/* @__PURE__ */ r("option", {
 						value: "number",
-						children: "Number"
+						children: o("bigconsole.widget.config.gauge.format.number", "Number")
 					}),
-					/* @__PURE__ */ n("option", {
+					/* @__PURE__ */ r("option", {
 						value: "percentage",
-						children: "Percentage"
+						children: o("bigconsole.widget.config.gauge.format.percentage", "Percentage")
 					}),
-					/* @__PURE__ */ n("option", {
+					/* @__PURE__ */ r("option", {
 						value: "currency",
-						children: "Currency"
+						children: o("bigconsole.widget.config.gauge.format.currency", "Currency")
 					})
 				]
 			})] }),
-			/* @__PURE__ */ r("div", { children: [
-				/* @__PURE__ */ n("label", {
+			/* @__PURE__ */ i("div", { children: [
+				/* @__PURE__ */ r("label", {
 					className: "block text-sm font-medium text-text-primary mb-2",
-					children: "Color Thresholds"
+					children: o("bigconsole.widget.config.gauge.colorThresholds", "Color Thresholds")
 				}),
-				/* @__PURE__ */ n("p", {
+				/* @__PURE__ */ r("p", {
 					className: "text-xs text-text-secondary mb-3",
-					children: "Define color zones based on value ranges. Values up to each threshold will use that color."
+					children: o("bigconsole.widget.config.gauge.colorThresholdsHelp", "Define color zones based on value ranges. Values up to each threshold will use that color.")
 				}),
-				/* @__PURE__ */ r("div", {
+				/* @__PURE__ */ i("div", {
 					className: "space-y-2",
 					children: [
-						/* @__PURE__ */ r("div", {
+						/* @__PURE__ */ i("div", {
 							className: "flex items-center gap-2",
 							children: [
-								/* @__PURE__ */ n("div", { className: "w-4 h-4 rounded bg-status-error-bg" }),
-								/* @__PURE__ */ n("span", {
+								/* @__PURE__ */ r("div", { className: "w-4 h-4 rounded bg-status-error-bg" }),
+								/* @__PURE__ */ r("span", {
 									className: "text-sm text-text-primary flex-1",
-									children: "Danger (Red)"
+									children: o("bigconsole.widget.config.gauge.threshold.danger", "Danger (Red)")
 								}),
-								/* @__PURE__ */ n("input", {
+								/* @__PURE__ */ r("input", {
 									type: "number",
 									value: e.thresholds?.[0]?.value ?? 33,
 									onChange: (t) => {
@@ -106,21 +107,21 @@ var i = e(function({ config: e, onChange: i }) {
 										n[0] = {
 											value: Number(t.target.value),
 											color: "error"
-										}, a("thresholds", n);
+										}, s("thresholds", n);
 									},
 									className: "\n                w-20 px-2 py-1\n                text-sm text-text-primary\n                bg-bg-surface\n                border border-border-default\n                rounded-md\n                focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n              "
 								})
 							]
 						}),
-						/* @__PURE__ */ r("div", {
+						/* @__PURE__ */ i("div", {
 							className: "flex items-center gap-2",
 							children: [
-								/* @__PURE__ */ n("div", { className: "w-4 h-4 rounded bg-status-warning-bg" }),
-								/* @__PURE__ */ n("span", {
+								/* @__PURE__ */ r("div", { className: "w-4 h-4 rounded bg-status-warning-bg" }),
+								/* @__PURE__ */ r("span", {
 									className: "text-sm text-text-primary flex-1",
-									children: "Warning (Yellow)"
+									children: o("bigconsole.widget.config.gauge.threshold.warning", "Warning (Yellow)")
 								}),
-								/* @__PURE__ */ n("input", {
+								/* @__PURE__ */ r("input", {
 									type: "number",
 									value: e.thresholds?.[1]?.value ?? 66,
 									onChange: (t) => {
@@ -128,21 +129,21 @@ var i = e(function({ config: e, onChange: i }) {
 										n[1] = {
 											value: Number(t.target.value),
 											color: "warning"
-										}, a("thresholds", n);
+										}, s("thresholds", n);
 									},
 									className: "\n                w-20 px-2 py-1\n                text-sm text-text-primary\n                bg-bg-surface\n                border border-border-default\n                rounded-md\n                focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n              "
 								})
 							]
 						}),
-						/* @__PURE__ */ r("div", {
+						/* @__PURE__ */ i("div", {
 							className: "flex items-center gap-2",
 							children: [
-								/* @__PURE__ */ n("div", { className: "w-4 h-4 rounded bg-status-success-bg" }),
-								/* @__PURE__ */ n("span", {
+								/* @__PURE__ */ r("div", { className: "w-4 h-4 rounded bg-status-success-bg" }),
+								/* @__PURE__ */ r("span", {
 									className: "text-sm text-text-primary flex-1",
-									children: "Good (Green)"
+									children: o("bigconsole.widget.config.gauge.threshold.good", "Good (Green)")
 								}),
-								/* @__PURE__ */ n("input", {
+								/* @__PURE__ */ r("input", {
 									type: "number",
 									value: e.thresholds?.[2]?.value ?? 100,
 									onChange: (t) => {
@@ -150,7 +151,7 @@ var i = e(function({ config: e, onChange: i }) {
 										n[2] = {
 											value: Number(t.target.value),
 											color: "success"
-										}, a("thresholds", n);
+										}, s("thresholds", n);
 									},
 									className: "\n                w-20 px-2 py-1\n                text-sm text-text-primary\n                bg-bg-surface\n                border border-border-default\n                rounded-md\n                focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n              "
 								})
@@ -159,22 +160,22 @@ var i = e(function({ config: e, onChange: i }) {
 					]
 				})
 			] }),
-			e.variant === "linear" && /* @__PURE__ */ r("label", {
+			e.variant === "linear" && /* @__PURE__ */ i("label", {
 				className: "flex items-center gap-3",
-				children: [/* @__PURE__ */ n("input", {
+				children: [/* @__PURE__ */ r("input", {
 					type: "checkbox",
 					checked: e.showZones === !0,
-					onChange: (e) => a("showZones", e.target.checked),
+					onChange: (e) => s("showZones", e.target.checked),
 					className: "\n              w-4 h-4\n              text-action-primary-bg\n              bg-bg-surface\n              border-border-default\n              rounded\n              focus:ring-action-primary-bg\n            "
-				}), /* @__PURE__ */ n("span", {
+				}), /* @__PURE__ */ r("span", {
 					className: "text-sm text-text-primary",
-					children: "Show color zones in background"
+					children: o("bigconsole.widget.config.gauge.showZones", "Show color zones in background")
 				})]
 			})
 		]
 	});
 });
 //#endregion
-export { i as default };
+export { a as default };
 
 //# sourceMappingURL=GaugeConfig.js.map

package/dist/bigconsole/components/widgets/gauge/GaugeConfig.js.map

@@ -1 +1 @@
-{"version":3,"file":"GaugeConfig.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/gauge/GaugeConfig.tsx"],"sourcesContent":["/**\n * GaugeConfig Component\n *\n * Configuration panel for Gauge widgets.\n */\n\nimport { type FC, memo, useCallback } from 'react';\nimport type { GaugeConfig as ConfigType } from '../../../types';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface GaugeConfigProps {\n  /** Current configuration */\n  config: ConfigType;\n  /** Callback when config changes */\n  onChange: (config: ConfigType) => void;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const GaugeConfig: FC<GaugeConfigProps> = memo(function GaugeConfig({ config, onChange }) {\n  const handleChange = useCallback(\n    <K extends keyof ConfigType>(key: K, value: ConfigType[K]) => {\n      onChange({ ...config, [key]: value });\n    },\n    [config, onChange]\n  );\n\n  return (\n    <div className=\"space-y-4\">\n      {/* Variant */}\n      <div>\n        <label className=\"block text-sm font-medium text-text-primary mb-1\">Gauge Type</label>\n        <select\n          value={config.variant || 'circular'}\n          onChange={(e) => handleChange('variant', e.target.value as ConfigType['variant'])}\n          className=\"\n            w-full px-3 py-2\n            text-sm text-text-primary\n            bg-bg-surface\n            border border-border-default\n            rounded-md\n            focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n          \"\n        >\n          <option value=\"circular\">Circular</option>\n          <option value=\"linear\">Linear</option>\n        </select>\n      </div>\n\n      {/* Min/Max Range */}\n      <div className=\"grid grid-cols-2 gap-3\">\n        <div>\n          <label className=\"block text-sm font-medium text-text-primary mb-1\">Minimum</label>\n          <input\n            type=\"number\"\n            value={config.min ?? 0}\n            onChange={(e) => handleChange('min', Number(e.target.value))}\n            className=\"\n              w-full px-3 py-2\n              text-sm text-text-primary\n              bg-bg-surface\n              border border-border-default\n              rounded-md\n              focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n            \"\n          />\n        </div>\n        <div>\n          <label className=\"block text-sm font-medium text-text-primary mb-1\">Maximum</label>\n          <input\n            type=\"number\"\n            value={config.max ?? 100}\n            onChange={(e) => handleChange('max', Number(e.target.value))}\n            className=\"\n              w-full px-3 py-2\n              text-sm text-text-primary\n              bg-bg-surface\n              border border-border-default\n              rounded-md\n              focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n            \"\n          />\n        </div>\n      </div>\n\n      {/* Unit */}\n      <div>\n        <label className=\"block text-sm font-medium text-text-primary mb-1\">Unit Label</label>\n        <input\n          type=\"text\"\n          value={config.unit || ''}\n          onChange={(e) => handleChange('unit', e.target.value)}\n          placeholder=\"e.g., %, ms, users\"\n          className=\"\n            w-full px-3 py-2\n            text-sm text-text-primary\n            bg-bg-surface\n            border border-border-default\n            rounded-md\n            focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n          \"\n        />\n      </div>\n\n      {/* Format */}\n      <div>\n        <label className=\"block text-sm font-medium text-text-primary mb-1\">Value Format</label>\n        <select\n          value={config.format || 'number'}\n          onChange={(e) => handleChange('format', e.target.value as ConfigType['format'])}\n          className=\"\n            w-full px-3 py-2\n            text-sm text-text-primary\n            bg-bg-surface\n            border border-border-default\n            rounded-md\n            focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n          \"\n        >\n          <option value=\"number\">Number</option>\n          <option value=\"percentage\">Percentage</option>\n          <option value=\"currency\">Currency</option>\n        </select>\n      </div>\n\n      {/* Thresholds Section */}\n      <div>\n        <label className=\"block text-sm font-medium text-text-primary mb-2\">Color Thresholds</label>\n        <p className=\"text-xs text-text-secondary mb-3\">\n          Define color zones based on value ranges. Values up to each threshold will use that color.\n        </p>\n\n        <div className=\"space-y-2\">\n          {/* Red zone */}\n          <div className=\"flex items-center gap-2\">\n            <div className=\"w-4 h-4 rounded bg-status-error-bg\" />\n            <span className=\"text-sm text-text-primary flex-1\">Danger (Red)</span>\n            <input\n              type=\"number\"\n              value={config.thresholds?.[0]?.value ?? 33}\n              onChange={(e) => {\n                const thresholds = [...(config.thresholds || [])];\n                thresholds[0] = {\n                  value: Number(e.target.value),\n                  color: 'error',\n                };\n                handleChange('thresholds', thresholds);\n              }}\n              className=\"\n                w-20 px-2 py-1\n                text-sm text-text-primary\n                bg-bg-surface\n                border border-border-default\n                rounded-md\n                focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n              \"\n            />\n          </div>\n\n          {/* Yellow zone */}\n          <div className=\"flex items-center gap-2\">\n            <div className=\"w-4 h-4 rounded bg-status-warning-bg\" />\n            <span className=\"text-sm text-text-primary flex-1\">Warning (Yellow)</span>\n            <input\n              type=\"number\"\n              value={config.thresholds?.[1]?.value ?? 66}\n              onChange={(e) => {\n                const thresholds = [...(config.thresholds || [])];\n                thresholds[1] = {\n                  value: Number(e.target.value),\n                  color: 'warning',\n                };\n                handleChange('thresholds', thresholds);\n              }}\n              className=\"\n                w-20 px-2 py-1\n                text-sm text-text-primary\n                bg-bg-surface\n                border border-border-default\n                rounded-md\n                focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n              \"\n            />\n          </div>\n\n          {/* Green zone */}\n          <div className=\"flex items-center gap-2\">\n            <div className=\"w-4 h-4 rounded bg-status-success-bg\" />\n            <span className=\"text-sm text-text-primary flex-1\">Good (Green)</span>\n            <input\n              type=\"number\"\n              value={config.thresholds?.[2]?.value ?? 100}\n              onChange={(e) => {\n                const thresholds = [...(config.thresholds || [])];\n                thresholds[2] = {\n                  value: Number(e.target.value),\n                  color: 'success',\n                };\n                handleChange('thresholds', thresholds);\n              }}\n              className=\"\n                w-20 px-2 py-1\n                text-sm text-text-primary\n                bg-bg-surface\n                border border-border-default\n                rounded-md\n                focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n              \"\n            />\n          </div>\n        </div>\n      </div>\n\n      {/* Show zones (for linear gauge) */}\n      {config.variant === 'linear' && (\n        <label className=\"flex items-center gap-3\">\n          <input\n            type=\"checkbox\"\n            checked={config.showZones === true}\n            onChange={(e) => handleChange('showZones', e.target.checked)}\n            className=\"\n              w-4 h-4\n              text-action-primary-bg\n              bg-bg-surface\n              border-border-default\n              rounded\n              focus:ring-action-primary-bg\n            \"\n          />\n          <span className=\"text-sm text-text-primary\">Show color zones in background</span>\n        </label>\n      )}\n    </div>\n  );\n});\n\nexport default GaugeConfig;\n"],"mappings":"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"}
+{"version":3,"file":"GaugeConfig.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/gauge/GaugeConfig.tsx"],"sourcesContent":["/**\n * GaugeConfig Component\n *\n * Configuration panel for Gauge widgets.\n */\n\nimport { type FC, memo, useCallback } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport type { GaugeConfig as ConfigType } from '../../../types';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface GaugeConfigProps {\n  /** Current configuration */\n  config: ConfigType;\n  /** Callback when config changes */\n  onChange: (config: ConfigType) => void;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const GaugeConfig: FC<GaugeConfigProps> = memo(function GaugeConfig({ config, onChange }) {\n  const { t } = useI18n();\n  const handleChange = useCallback(\n    <K extends keyof ConfigType>(key: K, value: ConfigType[K]) => {\n      onChange({ ...config, [key]: value });\n    },\n    [config, onChange]\n  );\n\n  return (\n    <div className=\"space-y-4\">\n      {/* Variant */}\n      <div>\n        <label className=\"block text-sm font-medium text-text-primary mb-1\">\n          {t('bigconsole.widget.config.gauge.gaugeType', 'Gauge Type')}\n        </label>\n        <select\n          value={config.variant || 'circular'}\n          onChange={(e) => handleChange('variant', e.target.value as ConfigType['variant'])}\n          className=\"\n            w-full px-3 py-2\n            text-sm text-text-primary\n            bg-bg-surface\n            border border-border-default\n            rounded-md\n            focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n          \"\n        >\n          <option value=\"circular\">{t('bigconsole.widget.config.gauge.variant.circular', 'Circular')}</option>\n          <option value=\"linear\">{t('bigconsole.widget.config.gauge.variant.linear', 'Linear')}</option>\n        </select>\n      </div>\n\n      {/* Min/Max Range */}\n      <div className=\"grid grid-cols-2 gap-3\">\n        <div>\n          <label className=\"block text-sm font-medium text-text-primary mb-1\">\n            {t('bigconsole.widget.config.gauge.minimum', 'Minimum')}\n          </label>\n          <input\n            type=\"number\"\n            value={config.min ?? 0}\n            onChange={(e) => handleChange('min', Number(e.target.value))}\n            className=\"\n              w-full px-3 py-2\n              text-sm text-text-primary\n              bg-bg-surface\n              border border-border-default\n              rounded-md\n              focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n            \"\n          />\n        </div>\n        <div>\n          <label className=\"block text-sm font-medium text-text-primary mb-1\">\n            {t('bigconsole.widget.config.gauge.maximum', 'Maximum')}\n          </label>\n          <input\n            type=\"number\"\n            value={config.max ?? 100}\n            onChange={(e) => handleChange('max', Number(e.target.value))}\n            className=\"\n              w-full px-3 py-2\n              text-sm text-text-primary\n              bg-bg-surface\n              border border-border-default\n              rounded-md\n              focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n            \"\n          />\n        </div>\n      </div>\n\n      {/* Unit */}\n      <div>\n        <label className=\"block text-sm font-medium text-text-primary mb-1\">\n          {t('bigconsole.widget.config.gauge.unitLabel', 'Unit Label')}\n        </label>\n        <input\n          type=\"text\"\n          value={config.unit || ''}\n          onChange={(e) => handleChange('unit', e.target.value)}\n          placeholder={t('bigconsole.widget.config.gauge.unitPlaceholder', 'e.g., %, ms, users')}\n          className=\"\n            w-full px-3 py-2\n            text-sm text-text-primary\n            bg-bg-surface\n            border border-border-default\n            rounded-md\n            focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n          \"\n        />\n      </div>\n\n      {/* Format */}\n      <div>\n        <label className=\"block text-sm font-medium text-text-primary mb-1\">\n          {t('bigconsole.widget.config.gauge.valueFormat', 'Value Format')}\n        </label>\n        <select\n          value={config.format || 'number'}\n          onChange={(e) => handleChange('format', e.target.value as ConfigType['format'])}\n          className=\"\n            w-full px-3 py-2\n            text-sm text-text-primary\n            bg-bg-surface\n            border border-border-default\n            rounded-md\n            focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n          \"\n        >\n          <option value=\"number\">{t('bigconsole.widget.config.gauge.format.number', 'Number')}</option>\n          <option value=\"percentage\">{t('bigconsole.widget.config.gauge.format.percentage', 'Percentage')}</option>\n          <option value=\"currency\">{t('bigconsole.widget.config.gauge.format.currency', 'Currency')}</option>\n        </select>\n      </div>\n\n      {/* Thresholds Section */}\n      <div>\n        <label className=\"block text-sm font-medium text-text-primary mb-2\">\n          {t('bigconsole.widget.config.gauge.colorThresholds', 'Color Thresholds')}\n        </label>\n        <p className=\"text-xs text-text-secondary mb-3\">\n          {t(\n            'bigconsole.widget.config.gauge.colorThresholdsHelp',\n            'Define color zones based on value ranges. Values up to each threshold will use that color.'\n          )}\n        </p>\n\n        <div className=\"space-y-2\">\n          {/* Red zone */}\n          <div className=\"flex items-center gap-2\">\n            <div className=\"w-4 h-4 rounded bg-status-error-bg\" />\n            <span className=\"text-sm text-text-primary flex-1\">\n              {t('bigconsole.widget.config.gauge.threshold.danger', 'Danger (Red)')}\n            </span>\n            <input\n              type=\"number\"\n              value={config.thresholds?.[0]?.value ?? 33}\n              onChange={(e) => {\n                const thresholds = [...(config.thresholds || [])];\n                thresholds[0] = {\n                  value: Number(e.target.value),\n                  color: 'error',\n                };\n                handleChange('thresholds', thresholds);\n              }}\n              className=\"\n                w-20 px-2 py-1\n                text-sm text-text-primary\n                bg-bg-surface\n                border border-border-default\n                rounded-md\n                focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n              \"\n            />\n          </div>\n\n          {/* Yellow zone */}\n          <div className=\"flex items-center gap-2\">\n            <div className=\"w-4 h-4 rounded bg-status-warning-bg\" />\n            <span className=\"text-sm text-text-primary flex-1\">\n              {t('bigconsole.widget.config.gauge.threshold.warning', 'Warning (Yellow)')}\n            </span>\n            <input\n              type=\"number\"\n              value={config.thresholds?.[1]?.value ?? 66}\n              onChange={(e) => {\n                const thresholds = [...(config.thresholds || [])];\n                thresholds[1] = {\n                  value: Number(e.target.value),\n                  color: 'warning',\n                };\n                handleChange('thresholds', thresholds);\n              }}\n              className=\"\n                w-20 px-2 py-1\n                text-sm text-text-primary\n                bg-bg-surface\n                border border-border-default\n                rounded-md\n                focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n              \"\n            />\n          </div>\n\n          {/* Green zone */}\n          <div className=\"flex items-center gap-2\">\n            <div className=\"w-4 h-4 rounded bg-status-success-bg\" />\n            <span className=\"text-sm text-text-primary flex-1\">\n              {t('bigconsole.widget.config.gauge.threshold.good', 'Good (Green)')}\n            </span>\n            <input\n              type=\"number\"\n              value={config.thresholds?.[2]?.value ?? 100}\n              onChange={(e) => {\n                const thresholds = [...(config.thresholds || [])];\n                thresholds[2] = {\n                  value: Number(e.target.value),\n                  color: 'success',\n                };\n                handleChange('thresholds', thresholds);\n              }}\n              className=\"\n                w-20 px-2 py-1\n                text-sm text-text-primary\n                bg-bg-surface\n                border border-border-default\n                rounded-md\n                focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n              \"\n            />\n          </div>\n        </div>\n      </div>\n\n      {/* Show zones (for linear gauge) */}\n      {config.variant === 'linear' && (\n        <label className=\"flex items-center gap-3\">\n          <input\n            type=\"checkbox\"\n            checked={config.showZones === true}\n            onChange={(e) => handleChange('showZones', e.target.checked)}\n            className=\"\n              w-4 h-4\n              text-action-primary-bg\n              bg-bg-surface\n              border-border-default\n              rounded\n              focus:ring-action-primary-bg\n            \"\n          />\n          <span className=\"text-sm text-text-primary\">\n            {t('bigconsole.widget.config.gauge.showZones', 'Show color zones in background')}\n          </span>\n        </label>\n      )}\n    </div>\n  );\n});\n\nexport default GaugeConfig;\n"],"mappings":"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"}