@tecof/theme-editor 0.0.24 → 0.0.25

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.mts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import * as react from 'react';
3
- import react__default, { ReactElement } from 'react';
3
+ import react__default, { ReactElement, Component, ReactNode, ErrorInfo } from 'react';
4
4
 
5
5
  interface ThemeColors {
6
6
  primary: string;
@@ -578,6 +578,39 @@ declare const createColorField: (options?: ColorFieldOptions) => {
578
578
  render: ({ value, onChange, readOnly, field, name, id }: ColorFieldProps) => react_jsx_runtime.JSX.Element;
579
579
  };
580
580
 
581
+ interface FieldErrorBoundaryProps {
582
+ /** The field name (for error reporting) */
583
+ fieldName?: string;
584
+ /** Fallback UI to show when a field crashes */
585
+ fallback?: ReactNode;
586
+ /** Optional error callback */
587
+ onError?: (error: Error, errorInfo: ErrorInfo) => void;
588
+ children: ReactNode;
589
+ }
590
+ interface FieldErrorBoundaryState {
591
+ hasError: boolean;
592
+ error: Error | null;
593
+ }
594
+ /**
595
+ * Error boundary for Puck custom fields.
596
+ * Catches render errors in child components and shows a friendly fallback
597
+ * instead of crashing the entire editor.
598
+ *
599
+ * @example
600
+ * ```tsx
601
+ * <FieldErrorBoundary fieldName="title">
602
+ * <LanguageField ... />
603
+ * </FieldErrorBoundary>
604
+ * ```
605
+ */
606
+ declare class FieldErrorBoundary extends Component<FieldErrorBoundaryProps, FieldErrorBoundaryState> {
607
+ constructor(props: FieldErrorBoundaryProps);
608
+ static getDerivedStateFromError(error: Error): FieldErrorBoundaryState;
609
+ componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
610
+ handleRetry: () => void;
611
+ render(): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined;
612
+ }
613
+
581
614
  declare function hexToHsl(hex: string): HSL;
582
615
  declare function hslToHex(h: number, s: number, l: number): string;
583
616
  declare function lighten(hex: string, amount: number): string;
@@ -586,4 +619,4 @@ declare function generateCSSVariables(theme: ThemeConfig): string;
586
619
  declare function getDefaultTheme(): ThemeConfig;
587
620
  declare function mergeTheme(base: ThemeConfig, overrides: Partial<ThemeConfig>): ThemeConfig;
588
621
 
589
- export { type ApiResponse, CodeEditorField, ColorField, EditorField, type HSL, LanguageField, type LanguageFieldValue, LinkField, type LinkFieldValue, type MerchantInfoData, type PageApiData, type PuckContentItem, type PuckPageData, TecofApiClient, TecofEditor, type TecofEditorProps, TecofPicture, type TecofPictureProps, TecofProvider, type TecofProviderProps, TecofRender, type TecofRenderProps, type ThemeColors, type ThemeConfig, type ThemeSpacing, type ThemeTypography, UploadField, type UploadedFile, createCodeEditorField, createColorField, createEditorField, createLanguageField, createLinkField, createUploadField, darken, generateCSSVariables, getDefaultTheme, hexToHsl, hslToHex, lighten, mergeTheme, useTecof };
622
+ export { type ApiResponse, CodeEditorField, ColorField, EditorField, FieldErrorBoundary, type HSL, LanguageField, type LanguageFieldValue, LinkField, type LinkFieldValue, type MerchantInfoData, type PageApiData, type PuckContentItem, type PuckPageData, TecofApiClient, TecofEditor, type TecofEditorProps, TecofPicture, type TecofPictureProps, TecofProvider, type TecofProviderProps, TecofRender, type TecofRenderProps, type ThemeColors, type ThemeConfig, type ThemeSpacing, type ThemeTypography, UploadField, type UploadedFile, createCodeEditorField, createColorField, createEditorField, createLanguageField, createLinkField, createUploadField, darken, generateCSSVariables, getDefaultTheme, hexToHsl, hslToHex, lighten, mergeTheme, useTecof };
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import * as react from 'react';
3
- import react__default, { ReactElement } from 'react';
3
+ import react__default, { ReactElement, Component, ReactNode, ErrorInfo } from 'react';
4
4
 
5
5
  interface ThemeColors {
6
6
  primary: string;
@@ -578,6 +578,39 @@ declare const createColorField: (options?: ColorFieldOptions) => {
578
578
  render: ({ value, onChange, readOnly, field, name, id }: ColorFieldProps) => react_jsx_runtime.JSX.Element;
579
579
  };
580
580
 
581
+ interface FieldErrorBoundaryProps {
582
+ /** The field name (for error reporting) */
583
+ fieldName?: string;
584
+ /** Fallback UI to show when a field crashes */
585
+ fallback?: ReactNode;
586
+ /** Optional error callback */
587
+ onError?: (error: Error, errorInfo: ErrorInfo) => void;
588
+ children: ReactNode;
589
+ }
590
+ interface FieldErrorBoundaryState {
591
+ hasError: boolean;
592
+ error: Error | null;
593
+ }
594
+ /**
595
+ * Error boundary for Puck custom fields.
596
+ * Catches render errors in child components and shows a friendly fallback
597
+ * instead of crashing the entire editor.
598
+ *
599
+ * @example
600
+ * ```tsx
601
+ * <FieldErrorBoundary fieldName="title">
602
+ * <LanguageField ... />
603
+ * </FieldErrorBoundary>
604
+ * ```
605
+ */
606
+ declare class FieldErrorBoundary extends Component<FieldErrorBoundaryProps, FieldErrorBoundaryState> {
607
+ constructor(props: FieldErrorBoundaryProps);
608
+ static getDerivedStateFromError(error: Error): FieldErrorBoundaryState;
609
+ componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
610
+ handleRetry: () => void;
611
+ render(): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined;
612
+ }
613
+
581
614
  declare function hexToHsl(hex: string): HSL;
582
615
  declare function hslToHex(h: number, s: number, l: number): string;
583
616
  declare function lighten(hex: string, amount: number): string;
@@ -586,4 +619,4 @@ declare function generateCSSVariables(theme: ThemeConfig): string;
586
619
  declare function getDefaultTheme(): ThemeConfig;
587
620
  declare function mergeTheme(base: ThemeConfig, overrides: Partial<ThemeConfig>): ThemeConfig;
588
621
 
589
- export { type ApiResponse, CodeEditorField, ColorField, EditorField, type HSL, LanguageField, type LanguageFieldValue, LinkField, type LinkFieldValue, type MerchantInfoData, type PageApiData, type PuckContentItem, type PuckPageData, TecofApiClient, TecofEditor, type TecofEditorProps, TecofPicture, type TecofPictureProps, TecofProvider, type TecofProviderProps, TecofRender, type TecofRenderProps, type ThemeColors, type ThemeConfig, type ThemeSpacing, type ThemeTypography, UploadField, type UploadedFile, createCodeEditorField, createColorField, createEditorField, createLanguageField, createLinkField, createUploadField, darken, generateCSSVariables, getDefaultTheme, hexToHsl, hslToHex, lighten, mergeTheme, useTecof };
622
+ export { type ApiResponse, CodeEditorField, ColorField, EditorField, FieldErrorBoundary, type HSL, LanguageField, type LanguageFieldValue, LinkField, type LinkFieldValue, type MerchantInfoData, type PageApiData, type PuckContentItem, type PuckPageData, TecofApiClient, TecofEditor, type TecofEditorProps, TecofPicture, type TecofPictureProps, TecofProvider, type TecofProviderProps, TecofRender, type TecofRenderProps, type ThemeColors, type ThemeConfig, type ThemeSpacing, type ThemeTypography, UploadField, type UploadedFile, createCodeEditorField, createColorField, createEditorField, createLanguageField, createLinkField, createUploadField, darken, generateCSSVariables, getDefaultTheme, hexToHsl, hslToHex, lighten, mergeTheme, useTecof };
package/dist/index.js CHANGED
@@ -741,7 +741,7 @@ var Icon = React__default.forwardRef(
741
741
 
742
742
  // node_modules/lucide-react/dist/esm/createLucideIcon.js
743
743
  var createLucideIcon = (iconName, iconNode) => {
744
- const Component = React__default.forwardRef(
744
+ const Component2 = React__default.forwardRef(
745
745
  ({ className, ...props }, ref) => React__default.createElement(Icon, {
746
746
  ref,
747
747
  iconNode,
@@ -753,8 +753,8 @@ var createLucideIcon = (iconName, iconNode) => {
753
753
  ...props
754
754
  })
755
755
  );
756
- Component.displayName = toPascalCase(iconName);
757
- return Component;
756
+ Component2.displayName = toPascalCase(iconName);
757
+ return Component2;
758
758
  };
759
759
 
760
760
  // node_modules/lucide-react/dist/esm/icons/check.js
@@ -936,6 +936,50 @@ var __iconNode21 = [
936
936
  ["path", { d: "m6 6 12 12", key: "d8bk6v" }]
937
937
  ];
938
938
  var X = createLucideIcon("x", __iconNode21);
939
+ var FieldErrorBoundary = class extends React__default.Component {
940
+ constructor(props) {
941
+ super(props);
942
+ this.handleRetry = () => {
943
+ this.setState({ hasError: false, error: null });
944
+ };
945
+ this.state = { hasError: false, error: null };
946
+ }
947
+ static getDerivedStateFromError(error2) {
948
+ return { hasError: true, error: error2 };
949
+ }
950
+ componentDidCatch(error2, errorInfo) {
951
+ console.error(
952
+ `[TecofEditor] Field "${this.props.fieldName || "unknown"}" crashed:`,
953
+ error2,
954
+ errorInfo
955
+ );
956
+ this.props.onError?.(error2, errorInfo);
957
+ }
958
+ render() {
959
+ if (this.state.hasError) {
960
+ if (this.props.fallback) {
961
+ return this.props.fallback;
962
+ }
963
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "tecof-field-error-boundary", children: [
964
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "tecof-field-error-icon", children: "\u26A0\uFE0F" }),
965
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "tecof-field-error-content", children: [
966
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "tecof-field-error-title", children: "Bu alan y\xFCklenemedi" }),
967
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "tecof-field-error-detail", children: this.state.error?.message || "Beklenmeyen bir hata olu\u015Ftu" })
968
+ ] }),
969
+ /* @__PURE__ */ jsxRuntime.jsx(
970
+ "button",
971
+ {
972
+ type: "button",
973
+ className: "tecof-field-error-retry",
974
+ onClick: this.handleRetry,
975
+ children: "Tekrar Dene"
976
+ }
977
+ )
978
+ ] });
979
+ }
980
+ return this.props.children;
981
+ }
982
+ };
939
983
  var LanguageTabBar = ({
940
984
  languages,
941
985
  defaultLanguage,
@@ -963,6 +1007,73 @@ var FieldLoading = () => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "te
963
1007
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "tecof-lang-loading-dot" }),
964
1008
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "tecof-lang-loading-dot" })
965
1009
  ] });
1010
+ var StableInput = ({
1011
+ value: externalValue,
1012
+ onChange,
1013
+ disabled,
1014
+ placeholder,
1015
+ className
1016
+ }) => {
1017
+ const [localValue, setLocalValue] = React__default.useState(externalValue);
1018
+ const lastEmitted = React__default.useRef(externalValue);
1019
+ React__default.useEffect(() => {
1020
+ if (externalValue !== lastEmitted.current) {
1021
+ setLocalValue(externalValue);
1022
+ lastEmitted.current = externalValue;
1023
+ }
1024
+ }, [externalValue]);
1025
+ const handleChange = (e3) => {
1026
+ const val = e3.target.value;
1027
+ setLocalValue(val);
1028
+ lastEmitted.current = val;
1029
+ onChange(val);
1030
+ };
1031
+ return /* @__PURE__ */ jsxRuntime.jsx(
1032
+ "input",
1033
+ {
1034
+ type: "text",
1035
+ value: localValue,
1036
+ onChange: handleChange,
1037
+ disabled,
1038
+ placeholder,
1039
+ className
1040
+ }
1041
+ );
1042
+ };
1043
+ var StableTextarea = ({
1044
+ value: externalValue,
1045
+ onChange,
1046
+ disabled,
1047
+ placeholder,
1048
+ className,
1049
+ rows
1050
+ }) => {
1051
+ const [localValue, setLocalValue] = React__default.useState(externalValue);
1052
+ const lastEmitted = React__default.useRef(externalValue);
1053
+ React__default.useEffect(() => {
1054
+ if (externalValue !== lastEmitted.current) {
1055
+ setLocalValue(externalValue);
1056
+ lastEmitted.current = externalValue;
1057
+ }
1058
+ }, [externalValue]);
1059
+ const handleChange = (e3) => {
1060
+ const val = e3.target.value;
1061
+ setLocalValue(val);
1062
+ lastEmitted.current = val;
1063
+ onChange(val);
1064
+ };
1065
+ return /* @__PURE__ */ jsxRuntime.jsx(
1066
+ "textarea",
1067
+ {
1068
+ value: localValue,
1069
+ onChange: handleChange,
1070
+ rows,
1071
+ disabled,
1072
+ placeholder,
1073
+ className
1074
+ }
1075
+ );
1076
+ };
966
1077
  var LanguageField = ({
967
1078
  value,
968
1079
  onChange,
@@ -986,6 +1097,8 @@ var LanguageField = ({
986
1097
  }, [value, merchantInfo]);
987
1098
  const valuesRef = React__default.useRef(values);
988
1099
  valuesRef.current = values;
1100
+ const onChangeRef = React__default.useRef(onChange);
1101
+ onChangeRef.current = onChange;
989
1102
  const handleChange = React__default.useCallback((code, newVal) => {
990
1103
  const current = valuesRef.current;
991
1104
  const updated = [...current];
@@ -995,8 +1108,8 @@ var LanguageField = ({
995
1108
  } else {
996
1109
  updated.push({ code, value: newVal });
997
1110
  }
998
- onChange(updated);
999
- }, [onChange]);
1111
+ onChangeRef.current(updated);
1112
+ }, []);
1000
1113
  const getCurrentText = React__default.useCallback(() => {
1001
1114
  return valuesRef.current.find((v2) => v2.code === activeTab)?.value || "";
1002
1115
  }, [activeTab]);
@@ -1008,10 +1121,10 @@ var LanguageField = ({
1008
1121
  code,
1009
1122
  value: text2
1010
1123
  }));
1011
- onChange(updated);
1124
+ onChangeRef.current(updated);
1012
1125
  setStatusMsg({ text: "T\xFCm dillere kopyaland\u0131", type: "success" });
1013
1126
  setTimeout(() => setStatusMsg(null), 2e3);
1014
- }, [getCurrentText, merchantInfo, onChange]);
1127
+ }, [getCurrentText, merchantInfo]);
1015
1128
  const handleTranslate = React__default.useCallback(async () => {
1016
1129
  const text2 = getCurrentText();
1017
1130
  if (!text2 || !merchantInfo) return;
@@ -1031,7 +1144,7 @@ var LanguageField = ({
1031
1144
  updated.push({ code: t2.code, value: t2.value });
1032
1145
  }
1033
1146
  }
1034
- onChange(updated);
1147
+ onChangeRef.current(updated);
1035
1148
  setStatusMsg({ text: "\xC7eviri tamamland\u0131", type: "success" });
1036
1149
  } else {
1037
1150
  setStatusMsg({ text: res2.message || "\xC7eviri hatas\u0131", type: "error" });
@@ -1042,7 +1155,7 @@ var LanguageField = ({
1042
1155
  setTranslating(false);
1043
1156
  setTimeout(() => setStatusMsg(null), 3e3);
1044
1157
  }
1045
- }, [getCurrentText, merchantInfo, activeTab, onChange, apiClient, isHtml]);
1158
+ }, [getCurrentText, merchantInfo, activeTab, apiClient, isHtml]);
1046
1159
  if (loading) return /* @__PURE__ */ jsxRuntime.jsx(FieldLoading, {});
1047
1160
  if (error2 && !merchantInfo) return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "tecof-lang-error", children: error2 });
1048
1161
  if (!merchantInfo) return null;
@@ -1063,21 +1176,20 @@ var LanguageField = ({
1063
1176
  if (activeTab !== code) return null;
1064
1177
  const currentValue = values.find((v2) => v2.code === code)?.value || "";
1065
1178
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "tecof-lang-input-wrapper", children: isTextarea ? /* @__PURE__ */ jsxRuntime.jsx(
1066
- "textarea",
1179
+ StableTextarea,
1067
1180
  {
1068
1181
  value: currentValue,
1069
- onChange: (e3) => handleChange(code, e3.target.value),
1182
+ onChange: (val) => handleChange(code, val),
1070
1183
  rows: textareaRows,
1071
1184
  placeholder: placeholder || `${code.toUpperCase()} text...`,
1072
1185
  disabled: readOnly,
1073
1186
  className: "tecof-lang-input tecof-lang-textarea"
1074
1187
  }
1075
1188
  ) : /* @__PURE__ */ jsxRuntime.jsx(
1076
- "input",
1189
+ StableInput,
1077
1190
  {
1078
- type: "text",
1079
1191
  value: currentValue,
1080
- onChange: (e3) => handleChange(code, e3.target.value),
1192
+ onChange: (val) => handleChange(code, val),
1081
1193
  placeholder: placeholder || `${code.toUpperCase()} text...`,
1082
1194
  disabled: readOnly,
1083
1195
  className: "tecof-lang-input"
@@ -1125,7 +1237,7 @@ var createLanguageField = (options = {}) => {
1125
1237
  label,
1126
1238
  labelIcon,
1127
1239
  visible,
1128
- render: ({ value, onChange, readOnly, field, name: name3, id }) => /* @__PURE__ */ jsxRuntime.jsx(core.FieldLabel, { label: label || "", icon: labelIcon, readOnly, children: /* @__PURE__ */ jsxRuntime.jsx(
1240
+ render: ({ value, onChange, readOnly, field, name: name3, id }) => /* @__PURE__ */ jsxRuntime.jsx(core.FieldLabel, { label: label || "", icon: labelIcon, readOnly, children: /* @__PURE__ */ jsxRuntime.jsx(FieldErrorBoundary, { fieldName: name3, children: /* @__PURE__ */ jsxRuntime.jsx(
1129
1241
  LanguageField,
1130
1242
  {
1131
1243
  field,
@@ -1136,7 +1248,7 @@ var createLanguageField = (options = {}) => {
1136
1248
  readOnly,
1137
1249
  ...fieldOptions
1138
1250
  }
1139
- ) })
1251
+ ) }) })
1140
1252
  };
1141
1253
  };
1142
1254
  var createExtensions = () => [
@@ -1370,16 +1482,21 @@ var EditorField = ({
1370
1482
  return existing || { code, value: "" };
1371
1483
  });
1372
1484
  }, [value, merchantInfo]);
1485
+ const valuesRef = React__default.useRef(values);
1486
+ valuesRef.current = values;
1487
+ const onChangeRef = React__default.useRef(onChange);
1488
+ onChangeRef.current = onChange;
1373
1489
  const handleChange = React__default.useCallback((code, html) => {
1374
- const updated = [...values];
1490
+ const current = valuesRef.current;
1491
+ const updated = [...current];
1375
1492
  const idx = updated.findIndex((v2) => v2.code === code);
1376
1493
  if (idx >= 0) {
1377
1494
  updated[idx] = { ...updated[idx], value: html };
1378
1495
  } else {
1379
1496
  updated.push({ code, value: html });
1380
1497
  }
1381
- onChange(updated);
1382
- }, [values, onChange]);
1498
+ onChangeRef.current(updated);
1499
+ }, []);
1383
1500
  if (loading) return /* @__PURE__ */ jsxRuntime.jsx(FieldLoading, {});
1384
1501
  if (error2 && !merchantInfo) return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "tecof-lang-error", children: error2 });
1385
1502
  if (!merchantInfo) return null;
@@ -1416,7 +1533,7 @@ var createEditorField = (options = {}) => {
1416
1533
  label,
1417
1534
  labelIcon,
1418
1535
  visible,
1419
- render: ({ value, onChange, readOnly, field, name: name3, id }) => /* @__PURE__ */ jsxRuntime.jsx(core.FieldLabel, { label: label || "", icon: labelIcon, readOnly, children: /* @__PURE__ */ jsxRuntime.jsx(
1536
+ render: ({ value, onChange, readOnly, field, name: name3, id }) => /* @__PURE__ */ jsxRuntime.jsx(core.FieldLabel, { label: label || "", icon: labelIcon, readOnly, children: /* @__PURE__ */ jsxRuntime.jsx(FieldErrorBoundary, { fieldName: name3, children: /* @__PURE__ */ jsxRuntime.jsx(
1420
1537
  EditorField,
1421
1538
  {
1422
1539
  field,
@@ -1427,7 +1544,7 @@ var createEditorField = (options = {}) => {
1427
1544
  readOnly,
1428
1545
  ...fieldOptions
1429
1546
  }
1430
- ) })
1547
+ ) }) })
1431
1548
  };
1432
1549
  };
1433
1550
 
@@ -22937,7 +23054,7 @@ var createUploadField = (options = {}) => {
22937
23054
  label,
22938
23055
  labelIcon,
22939
23056
  visible,
22940
- render: ({ value, onChange, readOnly, field, name: name3, id }) => /* @__PURE__ */ jsxRuntime.jsx(core.FieldLabel, { label: label || "", icon: labelIcon, readOnly, children: /* @__PURE__ */ jsxRuntime.jsx(
23057
+ render: ({ value, onChange, readOnly, field, name: name3, id }) => /* @__PURE__ */ jsxRuntime.jsx(core.FieldLabel, { label: label || "", icon: labelIcon, readOnly, children: /* @__PURE__ */ jsxRuntime.jsx(FieldErrorBoundary, { fieldName: name3, children: /* @__PURE__ */ jsxRuntime.jsx(
22941
23058
  UploadField,
22942
23059
  {
22943
23060
  field,
@@ -22948,7 +23065,7 @@ var createUploadField = (options = {}) => {
22948
23065
  readOnly,
22949
23066
  ...fieldOptions
22950
23067
  }
22951
- ) })
23068
+ ) }) })
22952
23069
  };
22953
23070
  };
22954
23071
 
@@ -23632,7 +23749,7 @@ var createCodeEditorField = (options = {}) => {
23632
23749
  label,
23633
23750
  labelIcon,
23634
23751
  visible,
23635
- render: ({ value, onChange, readOnly, field, name: name3, id }) => /* @__PURE__ */ jsxRuntime.jsx(core.FieldLabel, { label: label || "", icon: labelIcon, readOnly, children: /* @__PURE__ */ jsxRuntime.jsx(
23752
+ render: ({ value, onChange, readOnly, field, name: name3, id }) => /* @__PURE__ */ jsxRuntime.jsx(core.FieldLabel, { label: label || "", icon: labelIcon, readOnly, children: /* @__PURE__ */ jsxRuntime.jsx(FieldErrorBoundary, { fieldName: name3, children: /* @__PURE__ */ jsxRuntime.jsx(
23636
23753
  CodeEditorField,
23637
23754
  {
23638
23755
  field,
@@ -23643,7 +23760,7 @@ var createCodeEditorField = (options = {}) => {
23643
23760
  readOnly,
23644
23761
  ...fieldOptions
23645
23762
  }
23646
- ) })
23763
+ ) }) })
23647
23764
  };
23648
23765
  };
23649
23766
  var LinkField = ({
@@ -23671,10 +23788,14 @@ var LinkField = ({
23671
23788
  return existing || { code, value: { url: "" } };
23672
23789
  });
23673
23790
  }, [value, merchantInfo]);
23791
+ const valuesRef = React__default.useRef(values);
23792
+ valuesRef.current = values;
23793
+ const onChangeRef = React__default.useRef(onChange);
23794
+ onChangeRef.current = onChange;
23674
23795
  const activeValueItem = values.find((v2) => v2.code === activeTab);
23675
23796
  const activeValue = activeValueItem?.value || { url: "" };
23676
23797
  const updateActiveValue = React__default.useCallback((newLinkVal) => {
23677
- const updated = [...values];
23798
+ const updated = [...valuesRef.current];
23678
23799
  const idx = updated.findIndex((v2) => v2.code === activeTab);
23679
23800
  if (idx >= 0) {
23680
23801
  if (newLinkVal) {
@@ -23685,8 +23806,8 @@ var LinkField = ({
23685
23806
  } else if (newLinkVal) {
23686
23807
  updated.push({ code: activeTab, value: newLinkVal });
23687
23808
  }
23688
- onChange(updated);
23689
- }, [values, activeTab, onChange]);
23809
+ onChangeRef.current(updated);
23810
+ }, [activeTab]);
23690
23811
  React__default.useEffect(() => {
23691
23812
  if (!drawerOpen) return;
23692
23813
  setLoading(true);
@@ -23875,7 +23996,7 @@ var createLinkField = (options = {}) => {
23875
23996
  label,
23876
23997
  labelIcon,
23877
23998
  visible,
23878
- render: ({ value, onChange, readOnly, field, name: name3, id }) => /* @__PURE__ */ jsxRuntime.jsx(core.FieldLabel, { label: label || "", icon: labelIcon, readOnly, children: /* @__PURE__ */ jsxRuntime.jsx(
23999
+ render: ({ value, onChange, readOnly, field, name: name3, id }) => /* @__PURE__ */ jsxRuntime.jsx(core.FieldLabel, { label: label || "", icon: labelIcon, readOnly, children: /* @__PURE__ */ jsxRuntime.jsx(FieldErrorBoundary, { fieldName: name3, children: /* @__PURE__ */ jsxRuntime.jsx(
23879
24000
  LinkField,
23880
24001
  {
23881
24002
  field,
@@ -23886,7 +24007,7 @@ var createLinkField = (options = {}) => {
23886
24007
  readOnly,
23887
24008
  ...fieldOptions
23888
24009
  }
23889
- ) })
24010
+ ) }) })
23890
24011
  };
23891
24012
  };
23892
24013
  var isValidHex = (hex) => /^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(hex);
@@ -24056,7 +24177,7 @@ var createColorField = (options = {}) => {
24056
24177
  label,
24057
24178
  labelIcon,
24058
24179
  visible,
24059
- render: ({ value, onChange, readOnly, field, name: name3, id }) => /* @__PURE__ */ jsxRuntime.jsx(core.FieldLabel, { label: label || "", icon: labelIcon, readOnly, children: /* @__PURE__ */ jsxRuntime.jsx(
24180
+ render: ({ value, onChange, readOnly, field, name: name3, id }) => /* @__PURE__ */ jsxRuntime.jsx(core.FieldLabel, { label: label || "", icon: labelIcon, readOnly, children: /* @__PURE__ */ jsxRuntime.jsx(FieldErrorBoundary, { fieldName: name3, children: /* @__PURE__ */ jsxRuntime.jsx(
24060
24181
  ColorField,
24061
24182
  {
24062
24183
  field,
@@ -24067,7 +24188,7 @@ var createColorField = (options = {}) => {
24067
24188
  readOnly,
24068
24189
  ...fieldOptions
24069
24190
  }
24070
- ) })
24191
+ ) }) })
24071
24192
  };
24072
24193
  };
24073
24194
 
@@ -24335,6 +24456,7 @@ filepond-plugin-image-edit/dist/filepond-plugin-image-edit.esm.js:
24335
24456
  exports.CodeEditorField = CodeEditorField;
24336
24457
  exports.ColorField = ColorField;
24337
24458
  exports.EditorField = EditorField;
24459
+ exports.FieldErrorBoundary = FieldErrorBoundary;
24338
24460
  exports.LanguageField = LanguageField;
24339
24461
  exports.LinkField = LinkField;
24340
24462
  exports.TecofApiClient = TecofApiClient;