@payloadcms/ui 3.68.0-internal-debug.e9b66ee → 3.68.0-internal-debug.654e4ad

package/dist/fields/Text/Input.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/fields/Text/Input.tsx"],"sourcesContent":["'use client'\nimport type { ChangeEvent } from 'react'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport type { ReactSelectAdapterProps } from '../../elements/ReactSelect/types.js'\nimport type { TextInputProps } from './types.js'\n\nimport { ReactSelect } from '../../elements/ReactSelect/index.js'\nimport { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js'\nimport { FieldDescription } from '../../fields/FieldDescription/index.js'\nimport { FieldError } from '../../fields/FieldError/index.js'\nimport { FieldLabel } from '../../fields/FieldLabel/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { fieldBaseClass } from '../shared/index.js'\nimport './index.scss'\n\nexport const TextInput: React.FC<TextInputProps> = (props) => {\n  const {\n    AfterInput,\n    BeforeInput,\n    className,\n    Description,\n    description,\n    Error,\n    hasMany,\n    htmlAttributes,\n    inputRef,\n    Label,\n    label,\n    localized,\n    maxRows,\n    onChange,\n    onKeyDown,\n    path,\n    placeholder: placeholderFromProps,\n    readOnly,\n    required,\n    rtl,\n    showError,\n    style,\n    value,\n    valueToRender,\n  } = props\n\n  const { i18n, t } = useTranslation()\n\n  const editableProps: ReactSelectAdapterProps['customProps']['editableProps'] = (\n    data,\n    className,\n    selectProps,\n  ) => {\n    const editableClassName = `${className}--editable`\n\n    return {\n      onBlur: (event: React.FocusEvent<HTMLDivElement>) => {\n        event.currentTarget.contentEditable = 'false'\n      },\n      onClick: (event: React.MouseEvent<HTMLDivElement>) => {\n        event.currentTarget.contentEditable = 'true'\n        event.currentTarget.classList.add(editableClassName)\n        event.currentTarget.focus()\n      },\n      onKeyDown: (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (event.key === 'Enter' || event.key === 'Tab' || event.key === 'Escape') {\n          event.currentTarget.contentEditable = 'false'\n          event.currentTarget.classList.remove(editableClassName)\n          data.value.value = event.currentTarget.innerText\n          data.label = event.currentTarget.innerText\n\n          if (data.value.value.replaceAll('\\n', '')) {\n            selectProps.onChange(selectProps.value, {\n              action: 'create-option',\n              option: data,\n            })\n          } else {\n            if (Array.isArray(selectProps.value)) {\n              const newValues = selectProps.value.filter((v) => v.id !== data.id)\n              selectProps.onChange(newValues, {\n                action: 'pop-value',\n                removedValue: data,\n              })\n            }\n          }\n\n          event.preventDefault()\n        }\n        event.stopPropagation()\n      },\n    }\n  }\n\n  const placeholder = getTranslation(placeholderFromProps, i18n)\n\n  return (\n    <div\n      className={[\n        fieldBaseClass,\n        'text',\n        className,\n        showError && 'error',\n        readOnly && 'read-only',\n        hasMany && 'has-many',\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      style={style}\n    >\n      <RenderCustomComponent\n        CustomComponent={Label}\n        Fallback={\n          <FieldLabel label={label} localized={localized} path={path} required={required} />\n        }\n      />\n      <div className={`${fieldBaseClass}__wrap`}>\n        <RenderCustomComponent\n          CustomComponent={Error}\n          Fallback={<FieldError path={path} showError={showError} />}\n        />\n        {BeforeInput}\n        {hasMany ? (\n          <ReactSelect\n            className={`field-${path.replace(/\\./g, '__')}`}\n            components={{ DropdownIndicator: null }}\n            customProps={{\n              editableProps,\n            }}\n            disabled={readOnly}\n            // prevent adding additional options if maxRows is reached\n            filterOption={() =>\n              !maxRows ? true : !(Array.isArray(value) && maxRows && value.length >= maxRows)\n            }\n            isClearable={false}\n            isCreatable\n            isMulti\n            isSortable\n            menuIsOpen={false}\n            noOptionsMessage={() => {\n              const isOverHasMany = Array.isArray(value) && value.length >= maxRows\n              if (isOverHasMany) {\n                return t('validation:limitReached', { max: maxRows, value: value.length + 1 })\n              }\n              return null\n            }}\n            onChange={onChange}\n            options={[]}\n            placeholder={placeholder}\n            showError={showError}\n            value={valueToRender}\n          />\n        ) : (\n          <input\n            data-rtl={rtl}\n            disabled={readOnly}\n            id={`field-${path?.replace(/\\./g, '__')}`}\n            name={path}\n            onChange={onChange as (e: ChangeEvent<HTMLInputElement>) => void}\n            onKeyDown={onKeyDown}\n            placeholder={placeholder}\n            ref={inputRef}\n            type=\"text\"\n            value={value || ''}\n            {...(htmlAttributes ?? {})}\n          />\n        )}\n        {AfterInput}\n        <RenderCustomComponent\n          CustomComponent={Description}\n          Fallback={<FieldDescription description={description} path={path} />}\n        />\n      </div>\n    </div>\n  )\n}\n"],"names":["getTranslation","ReactSelect","RenderCustomComponent","FieldDescription","FieldError","FieldLabel","useTranslation","fieldBaseClass","TextInput","props","AfterInput","BeforeInput","className","Description","description","Error","hasMany","htmlAttributes","inputRef","Label","label","localized","maxRows","onChange","onKeyDown","path","placeholder","placeholderFromProps","readOnly","required","rtl","showError","style","value","valueToRender","i18n","t","editableProps","data","selectProps","editableClassName","onBlur","event","currentTarget","contentEditable","onClick","classList","add","focus","key","remove","innerText","replaceAll","action","option","Array","isArray","newValues","filter","v","id","removedValue","preventDefault","stopPropagation","div","Boolean","join","CustomComponent","Fallback","replace","components","DropdownIndicator","customProps","disabled","filterOption","length","isClearable","isCreatable","isMulti","isSortable","menuIsOpen","noOptionsMessage","isOverHasMany","max","options","input","data-rtl","name","ref","type"],"mappings":"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"}
+{"version":3,"sources":["../../../src/fields/Text/Input.tsx"],"sourcesContent":["'use client'\nimport type { ChangeEvent } from 'react'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport type { ReactSelectAdapterProps } from '../../elements/ReactSelect/types.js'\nimport type { TextInputProps } from './types.js'\n\nimport { ReactSelect } from '../../elements/ReactSelect/index.js'\nimport { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js'\nimport { FieldDescription } from '../../fields/FieldDescription/index.js'\nimport { FieldError } from '../../fields/FieldError/index.js'\nimport { FieldLabel } from '../../fields/FieldLabel/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { fieldBaseClass } from '../shared/index.js'\nimport './index.scss'\n\nexport const TextInput: React.FC<TextInputProps> = (props) => {\n  const {\n    AfterInput,\n    BeforeInput,\n    className,\n    Description,\n    description,\n    Error,\n    hasMany,\n    htmlAttributes,\n    inputRef,\n    Label,\n    label,\n    localized,\n    maxRows,\n    onChange,\n    onKeyDown,\n    path,\n    placeholder: placeholderFromProps,\n    readOnly,\n    required,\n    rtl,\n    showError,\n    style,\n    value,\n    valueToRender,\n  } = props\n\n  const { i18n, t } = useTranslation()\n\n  const editableProps: ReactSelectAdapterProps['customProps']['editableProps'] = (\n    data,\n    className,\n    selectProps,\n  ) => {\n    const editableClassName = `${className}--editable`\n\n    return {\n      onBlur: (event: React.FocusEvent<HTMLDivElement>) => {\n        event.currentTarget.contentEditable = 'false'\n      },\n      onClick: (event: React.MouseEvent<HTMLDivElement>) => {\n        event.currentTarget.contentEditable = 'true'\n        event.currentTarget.classList.add(editableClassName)\n        event.currentTarget.focus()\n      },\n      onKeyDown: (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (event.key === 'Enter' || event.key === 'Tab' || event.key === 'Escape') {\n          event.currentTarget.contentEditable = 'false'\n          event.currentTarget.classList.remove(editableClassName)\n          data.value.value = event.currentTarget.innerText\n          data.label = event.currentTarget.innerText\n\n          if (data.value.value.replaceAll('\\n', '')) {\n            selectProps.onChange(selectProps.value, {\n              action: 'create-option',\n              option: data,\n            })\n          } else {\n            if (Array.isArray(selectProps.value)) {\n              const newValues = selectProps.value.filter((v) => v.id !== data.id)\n              selectProps.onChange(newValues, {\n                action: 'pop-value',\n                removedValue: data,\n              })\n            }\n          }\n\n          event.preventDefault()\n        }\n        event.stopPropagation()\n      },\n    }\n  }\n\n  const placeholder = getTranslation(placeholderFromProps, i18n)\n\n  return (\n    <div\n      className={[\n        fieldBaseClass,\n        'text',\n        className,\n        showError && 'error',\n        readOnly && 'read-only',\n        hasMany && 'has-many',\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      style={style}\n    >\n      <RenderCustomComponent\n        CustomComponent={Label}\n        Fallback={\n          <FieldLabel label={label} localized={localized} path={path} required={required} />\n        }\n      />\n      <div className={`${fieldBaseClass}__wrap`}>\n        <RenderCustomComponent\n          CustomComponent={Error}\n          Fallback={<FieldError path={path} showError={showError} />}\n        />\n        {BeforeInput}\n        {hasMany ? (\n          <ReactSelect\n            className={`field-${path.replace(/\\./g, '__')}`}\n            components={{ DropdownIndicator: null }}\n            customProps={{\n              editableProps,\n            }}\n            disabled={readOnly}\n            // prevent adding additional options if maxRows is reached\n            filterOption={() =>\n              !maxRows ? true : !(Array.isArray(value) && maxRows && value.length >= maxRows)\n            }\n            isClearable={false}\n            isCreatable\n            isMulti\n            isSortable\n            menuIsOpen={false}\n            noOptionsMessage={() => {\n              const isOverHasMany = Array.isArray(value) && value.length >= maxRows\n              if (isOverHasMany) {\n                return t('validation:limitReached', { max: maxRows, value: value.length + 1 })\n              }\n              return null\n            }}\n            onChange={onChange}\n            options={[]}\n            placeholder={placeholder}\n            showError={showError}\n            value={valueToRender}\n          />\n        ) : (\n          <input\n            data-rtl={rtl}\n            disabled={readOnly}\n            id={`field-${path?.replace(/\\./g, '__')}`}\n            name={path}\n            onChange={onChange as (e: ChangeEvent<HTMLInputElement>) => void}\n            onKeyDown={onKeyDown}\n            placeholder={placeholder}\n            ref={inputRef}\n            type=\"text\"\n            value={value || ''}\n            {...(htmlAttributes ?? {})}\n          />\n        )}\n        {AfterInput}\n        <RenderCustomComponent\n          CustomComponent={Description}\n          Fallback={<FieldDescription description={description} path={path} />}\n        />\n      </div>\n    </div>\n  )\n}\n"],"names":["getTranslation","React","ReactSelect","RenderCustomComponent","FieldDescription","FieldError","FieldLabel","useTranslation","fieldBaseClass","TextInput","props","AfterInput","BeforeInput","className","Description","description","Error","hasMany","htmlAttributes","inputRef","Label","label","localized","maxRows","onChange","onKeyDown","path","placeholder","placeholderFromProps","readOnly","required","rtl","showError","style","value","valueToRender","i18n","t","editableProps","data","selectProps","editableClassName","onBlur","event","currentTarget","contentEditable","onClick","classList","add","focus","key","remove","innerText","replaceAll","action","option","Array","isArray","newValues","filter","v","id","removedValue","preventDefault","stopPropagation","div","Boolean","join","CustomComponent","Fallback","replace","components","DropdownIndicator","customProps","disabled","filterOption","length","isClearable","isCreatable","isMulti","isSortable","menuIsOpen","noOptionsMessage","isOverHasMany","max","options","input","data-rtl","name","ref","type"],"mappings":"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"}

package/dist/fields/Text/index.js

@@ -1,5 +1,6 @@
 'use client';
-import { useCallback, useEffect, useMemo, useState } from 'react';
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import { useField } from '../../forms/useField/index.js';
 import { withCondition } from '../../forms/withCondition/index.js';
 import { useConfig } from '../../providers/Config/index.js';
@@ -82,11 +83,40 @@ const TextFieldComponent = (props)=>{
     const styles = useMemo(()=>mergeFieldStyles(field), [
         field
     ]);
-    return <TextInput AfterInput={AfterInput} BeforeInput={BeforeInput} className={className} Description={Description} description={description} Error={Error} hasMany={hasMany} htmlAttributes={{
-        autoComplete: autoComplete || undefined
-    }} inputRef={inputRef} Label={Label} label={label} localized={localized} maxRows={maxRows} minRows={minRows} onChange={hasMany ? handleHasManyChange : (e)=>{
-        setValue(e.target.value);
-    }} path={path} placeholder={placeholder} readOnly={readOnly || disabled} required={required} rtl={renderRTL} showError={showError} style={styles} value={value || ''} valueToRender={valueToRender}/>;
+    return /*#__PURE__*/ _jsxDEV(TextInput, {
+        AfterInput: AfterInput,
+        BeforeInput: BeforeInput,
+        className: className,
+        Description: Description,
+        description: description,
+        Error: Error,
+        hasMany: hasMany,
+        htmlAttributes: {
+            autoComplete: autoComplete || undefined
+        },
+        inputRef: inputRef,
+        Label: Label,
+        label: label,
+        localized: localized,
+        maxRows: maxRows,
+        minRows: minRows,
+        onChange: hasMany ? handleHasManyChange : (e)=>{
+            setValue(e.target.value);
+        },
+        path: path,
+        placeholder: placeholder,
+        readOnly: readOnly || disabled,
+        required: required,
+        rtl: renderRTL,
+        showError: showError,
+        style: styles,
+        value: value || '',
+        valueToRender: valueToRender
+    }, void 0, false, {
+        fileName: "src/fields/Text/index.tsx",
+        lineNumber: 118,
+        columnNumber: 5
+    }, this);
 };
 export const TextField = withCondition(TextFieldComponent);
 

package/dist/fields/Text/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/fields/Text/index.tsx"],"sourcesContent":["'use client'\nimport type { TextFieldClientComponent } from 'payload'\n\nimport React, { useCallback, useEffect, useMemo, useState } from 'react'\n\nimport type { Option } from '../../elements/ReactSelect/types.js'\nimport type { TextInputProps } from './types.js'\n\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { mergeFieldStyles } from '../mergeFieldStyles.js'\nimport { isFieldRTL } from '../shared/index.js'\nimport { TextInput } from './Input.js'\nimport './index.scss'\n\nexport { TextInput, TextInputProps }\n\nconst TextFieldComponent: TextFieldClientComponent = (props) => {\n  const {\n    field,\n    field: {\n      admin: { autoComplete, className, description, placeholder, rtl } = {},\n      hasMany,\n      label,\n      localized,\n      maxLength,\n      maxRows,\n      minLength,\n      minRows,\n      required,\n    },\n    inputRef,\n    path: pathFromProps,\n    readOnly,\n    validate,\n  } = props\n\n  const locale = useLocale()\n\n  const {\n    config: { localization: localizationConfig },\n  } = useConfig()\n\n  const memoizedValidate = useCallback(\n    (value, options) => {\n      if (typeof validate === 'function') {\n        return validate(value, { ...options, maxLength, minLength, required })\n      }\n    },\n    [validate, minLength, maxLength, required],\n  )\n\n  const {\n    customComponents: { AfterInput, BeforeInput, Description, Error, Label } = {},\n    disabled,\n    path,\n    setValue,\n    showError,\n    value,\n  } = useField({\n    potentiallyStalePath: pathFromProps,\n    validate: memoizedValidate,\n  })\n\n  const renderRTL = isFieldRTL({\n    fieldLocalized: localized,\n    fieldRTL: rtl,\n    locale,\n    localizationConfig: localizationConfig || undefined,\n  })\n\n  const [valueToRender, setValueToRender] = useState<\n    { id: string; label: string; value: { value: number } }[]\n  >([]) // Only for hasMany\n\n  const handleHasManyChange = useCallback(\n    (selectedOption) => {\n      if (!(readOnly || disabled)) {\n        let newValue\n        if (!selectedOption) {\n          newValue = []\n        } else if (Array.isArray(selectedOption)) {\n          newValue = selectedOption.map((option) => option.value?.value || option.value)\n        } else {\n          newValue = [selectedOption.value?.value || selectedOption.value]\n        }\n\n        setValue(newValue)\n      }\n    },\n    [readOnly, setValue, disabled],\n  )\n\n  // useEffect update valueToRender:\n  useEffect(() => {\n    if (hasMany && Array.isArray(value)) {\n      setValueToRender(\n        value.map((val, index) => {\n          return {\n            id: `${val}${index}`, // append index to avoid duplicate keys but allow duplicate numbers\n            label: `${val}`,\n            value: {\n              // React-select automatically uses \"label-value\" as a key, so we will get that react duplicate key warning if we just pass in the value as multiple values can be the same. So we need to append the index to the toString() of the value to avoid that warning, as it uses that as the key.\n              toString: () => `${val}${index}`,\n              value: val?.value || val,\n            },\n          }\n        }),\n      )\n    }\n  }, [value, hasMany])\n\n  const styles = useMemo(() => mergeFieldStyles(field), [field])\n\n  return (\n    <TextInput\n      AfterInput={AfterInput}\n      BeforeInput={BeforeInput}\n      className={className}\n      Description={Description}\n      description={description}\n      Error={Error}\n      hasMany={hasMany}\n      htmlAttributes={{\n        autoComplete: autoComplete || undefined,\n      }}\n      inputRef={inputRef}\n      Label={Label}\n      label={label}\n      localized={localized}\n      maxRows={maxRows}\n      minRows={minRows}\n      onChange={\n        hasMany\n          ? handleHasManyChange\n          : (e) => {\n              setValue(e.target.value)\n            }\n      }\n      path={path}\n      placeholder={placeholder}\n      readOnly={readOnly || disabled}\n      required={required}\n      rtl={renderRTL}\n      showError={showError}\n      style={styles}\n      value={(value as string) || ''}\n      valueToRender={valueToRender as Option[]}\n    />\n  )\n}\n\nexport const TextField = withCondition(TextFieldComponent)\n"],"names":["useCallback","useEffect","useMemo","useState","useField","withCondition","useConfig","useLocale","mergeFieldStyles","isFieldRTL","TextInput","TextFieldComponent","props","field","admin","autoComplete","className","description","placeholder","rtl","hasMany","label","localized","maxLength","maxRows","minLength","minRows","required","inputRef","path","pathFromProps","readOnly","validate","locale","config","localization","localizationConfig","memoizedValidate","value","options","customComponents","AfterInput","BeforeInput","Description","Error","Label","disabled","setValue","showError","potentiallyStalePath","renderRTL","fieldLocalized","fieldRTL","undefined","valueToRender","setValueToRender","handleHasManyChange","selectedOption","newValue","Array","isArray","map","option","val","index","id","toString","styles","htmlAttributes","onChange","e","target","style","TextField"],"mappings":"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"}
+{"version":3,"sources":["../../../src/fields/Text/index.tsx"],"sourcesContent":["'use client'\nimport type { TextFieldClientComponent } from 'payload'\n\nimport React, { useCallback, useEffect, useMemo, useState } from 'react'\n\nimport type { Option } from '../../elements/ReactSelect/types.js'\nimport type { TextInputProps } from './types.js'\n\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { mergeFieldStyles } from '../mergeFieldStyles.js'\nimport { isFieldRTL } from '../shared/index.js'\nimport { TextInput } from './Input.js'\nimport './index.scss'\n\nexport { TextInput, TextInputProps }\n\nconst TextFieldComponent: TextFieldClientComponent = (props) => {\n  const {\n    field,\n    field: {\n      admin: { autoComplete, className, description, placeholder, rtl } = {},\n      hasMany,\n      label,\n      localized,\n      maxLength,\n      maxRows,\n      minLength,\n      minRows,\n      required,\n    },\n    inputRef,\n    path: pathFromProps,\n    readOnly,\n    validate,\n  } = props\n\n  const locale = useLocale()\n\n  const {\n    config: { localization: localizationConfig },\n  } = useConfig()\n\n  const memoizedValidate = useCallback(\n    (value, options) => {\n      if (typeof validate === 'function') {\n        return validate(value, { ...options, maxLength, minLength, required })\n      }\n    },\n    [validate, minLength, maxLength, required],\n  )\n\n  const {\n    customComponents: { AfterInput, BeforeInput, Description, Error, Label } = {},\n    disabled,\n    path,\n    setValue,\n    showError,\n    value,\n  } = useField({\n    potentiallyStalePath: pathFromProps,\n    validate: memoizedValidate,\n  })\n\n  const renderRTL = isFieldRTL({\n    fieldLocalized: localized,\n    fieldRTL: rtl,\n    locale,\n    localizationConfig: localizationConfig || undefined,\n  })\n\n  const [valueToRender, setValueToRender] = useState<\n    { id: string; label: string; value: { value: number } }[]\n  >([]) // Only for hasMany\n\n  const handleHasManyChange = useCallback(\n    (selectedOption) => {\n      if (!(readOnly || disabled)) {\n        let newValue\n        if (!selectedOption) {\n          newValue = []\n        } else if (Array.isArray(selectedOption)) {\n          newValue = selectedOption.map((option) => option.value?.value || option.value)\n        } else {\n          newValue = [selectedOption.value?.value || selectedOption.value]\n        }\n\n        setValue(newValue)\n      }\n    },\n    [readOnly, setValue, disabled],\n  )\n\n  // useEffect update valueToRender:\n  useEffect(() => {\n    if (hasMany && Array.isArray(value)) {\n      setValueToRender(\n        value.map((val, index) => {\n          return {\n            id: `${val}${index}`, // append index to avoid duplicate keys but allow duplicate numbers\n            label: `${val}`,\n            value: {\n              // React-select automatically uses \"label-value\" as a key, so we will get that react duplicate key warning if we just pass in the value as multiple values can be the same. So we need to append the index to the toString() of the value to avoid that warning, as it uses that as the key.\n              toString: () => `${val}${index}`,\n              value: val?.value || val,\n            },\n          }\n        }),\n      )\n    }\n  }, [value, hasMany])\n\n  const styles = useMemo(() => mergeFieldStyles(field), [field])\n\n  return (\n    <TextInput\n      AfterInput={AfterInput}\n      BeforeInput={BeforeInput}\n      className={className}\n      Description={Description}\n      description={description}\n      Error={Error}\n      hasMany={hasMany}\n      htmlAttributes={{\n        autoComplete: autoComplete || undefined,\n      }}\n      inputRef={inputRef}\n      Label={Label}\n      label={label}\n      localized={localized}\n      maxRows={maxRows}\n      minRows={minRows}\n      onChange={\n        hasMany\n          ? handleHasManyChange\n          : (e) => {\n              setValue(e.target.value)\n            }\n      }\n      path={path}\n      placeholder={placeholder}\n      readOnly={readOnly || disabled}\n      required={required}\n      rtl={renderRTL}\n      showError={showError}\n      style={styles}\n      value={(value as string) || ''}\n      valueToRender={valueToRender as Option[]}\n    />\n  )\n}\n\nexport const TextField = withCondition(TextFieldComponent)\n"],"names":["React","useCallback","useEffect","useMemo","useState","useField","withCondition","useConfig","useLocale","mergeFieldStyles","isFieldRTL","TextInput","TextFieldComponent","props","field","admin","autoComplete","className","description","placeholder","rtl","hasMany","label","localized","maxLength","maxRows","minLength","minRows","required","inputRef","path","pathFromProps","readOnly","validate","locale","config","localization","localizationConfig","memoizedValidate","value","options","customComponents","AfterInput","BeforeInput","Description","Error","Label","disabled","setValue","showError","potentiallyStalePath","renderRTL","fieldLocalized","fieldRTL","undefined","valueToRender","setValueToRender","handleHasManyChange","selectedOption","newValue","Array","isArray","map","option","val","index","id","toString","styles","htmlAttributes","onChange","e","target","style","TextField"],"mappings":"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"}

package/dist/fields/Textarea/Input.js

@@ -1,5 +1,7 @@
 'use client';
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { getTranslation } from '@payloadcms/translations';
+import React from 'react';
 import { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js';
 import { FieldDescription } from '../../fields/FieldDescription/index.js';
 import { FieldError } from '../../fields/FieldError/index.js';
@@ -10,26 +12,105 @@ import './index.scss';
 export const TextareaInput = (props)=>{
     const { AfterInput, BeforeInput, className, Description, description, Error, Label, label, localized, onChange, path, placeholder, readOnly, required, rows, rtl, showError, style, value } = props;
     const { i18n } = useTranslation();
-    return <div className={[
-        fieldBaseClass,
-        'textarea',
-        className,
-        showError && 'error',
-        readOnly && 'read-only'
-    ].filter(Boolean).join(' ')} style={style}>
-      <RenderCustomComponent CustomComponent={Label} Fallback={<FieldLabel htmlFor={`field-${path.replace(/\./g, '__')}`} label={label} localized={localized} path={path} required={required}/>}/>
-      <div className={`${fieldBaseClass}__wrap`}>
-        <RenderCustomComponent CustomComponent={Error} Fallback={<FieldError path={path} showError={showError}/>}/>
-        {BeforeInput}
-        <div className="textarea-outer">
-          <textarea data-rtl={rtl} disabled={readOnly} id={`field-${path.replace(/\./g, '__')}`} name={path} onChange={onChange} placeholder={getTranslation(placeholder, i18n)} rows={rows} style={{
-        '--rows': rows
-    }} value={value || ''}/>
-        </div>
-        {AfterInput}
-        <RenderCustomComponent CustomComponent={Description} Fallback={<FieldDescription description={description} path={path}/>}/>
-      </div>
-    </div>;
+    return /*#__PURE__*/ _jsxDEV("div", {
+        className: [
+            fieldBaseClass,
+            'textarea',
+            className,
+            showError && 'error',
+            readOnly && 'read-only'
+        ].filter(Boolean).join(' '),
+        style: style,
+        children: [
+            /*#__PURE__*/ _jsxDEV(RenderCustomComponent, {
+                CustomComponent: Label,
+                Fallback: /*#__PURE__*/ _jsxDEV(FieldLabel, {
+                    htmlFor: `field-${path.replace(/\./g, '__')}`,
+                    label: label,
+                    localized: localized,
+                    path: path,
+                    required: required
+                }, void 0, false, {
+                    fileName: "src/fields/Textarea/Input.tsx",
+                    lineNumber: 58,
+                    columnNumber: 11
+                }, void 0)
+            }, void 0, false, {
+                fileName: "src/fields/Textarea/Input.tsx",
+                lineNumber: 55,
+                columnNumber: 7
+            }, this),
+            /*#__PURE__*/ _jsxDEV("div", {
+                className: `${fieldBaseClass}__wrap`,
+                children: [
+                    /*#__PURE__*/ _jsxDEV(RenderCustomComponent, {
+                        CustomComponent: Error,
+                        Fallback: /*#__PURE__*/ _jsxDEV(FieldError, {
+                            path: path,
+                            showError: showError
+                        }, void 0, false, {
+                            fileName: "src/fields/Textarea/Input.tsx",
+                            lineNumber: 70,
+                            columnNumber: 21
+                        }, void 0)
+                    }, void 0, false, {
+                        fileName: "src/fields/Textarea/Input.tsx",
+                        lineNumber: 68,
+                        columnNumber: 9
+                    }, this),
+                    BeforeInput,
+                    /*#__PURE__*/ _jsxDEV("div", {
+                        className: "textarea-outer",
+                        children: /*#__PURE__*/ _jsxDEV("textarea", {
+                            "data-rtl": rtl,
+                            disabled: readOnly,
+                            id: `field-${path.replace(/\./g, '__')}`,
+                            name: path,
+                            onChange: onChange,
+                            placeholder: getTranslation(placeholder, i18n),
+                            rows: rows,
+                            style: {
+                                '--rows': rows
+                            },
+                            value: value || ''
+                        }, void 0, false, {
+                            fileName: "src/fields/Textarea/Input.tsx",
+                            lineNumber: 74,
+                            columnNumber: 11
+                        }, this)
+                    }, void 0, false, {
+                        fileName: "src/fields/Textarea/Input.tsx",
+                        lineNumber: 73,
+                        columnNumber: 9
+                    }, this),
+                    AfterInput,
+                    /*#__PURE__*/ _jsxDEV(RenderCustomComponent, {
+                        CustomComponent: Description,
+                        Fallback: /*#__PURE__*/ _jsxDEV(FieldDescription, {
+                            description: description,
+                            path: path
+                        }, void 0, false, {
+                            fileName: "src/fields/Textarea/Input.tsx",
+                            lineNumber: 93,
+                            columnNumber: 21
+                        }, void 0)
+                    }, void 0, false, {
+                        fileName: "src/fields/Textarea/Input.tsx",
+                        lineNumber: 91,
+                        columnNumber: 9
+                    }, this)
+                ]
+            }, void 0, true, {
+                fileName: "src/fields/Textarea/Input.tsx",
+                lineNumber: 67,
+                columnNumber: 7
+            }, this)
+        ]
+    }, void 0, true, {
+        fileName: "src/fields/Textarea/Input.tsx",
+        lineNumber: 43,
+        columnNumber: 5
+    }, this);
 };
 
 //# sourceMappingURL=Input.js.map

package/dist/fields/Textarea/Input.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/fields/Textarea/Input.tsx"],"sourcesContent":["'use client'\nimport type { CSSProperties } from 'react'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport type { TextAreaInputProps } from './types.js'\n\nimport { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js'\nimport { FieldDescription } from '../../fields/FieldDescription/index.js'\nimport { FieldError } from '../../fields/FieldError/index.js'\nimport { FieldLabel } from '../../fields/FieldLabel/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { fieldBaseClass } from '../shared/index.js'\nimport './index.scss'\n\nexport const TextareaInput: React.FC<TextAreaInputProps> = (props) => {\n  const {\n    AfterInput,\n    BeforeInput,\n    className,\n    Description,\n    description,\n    Error,\n    Label,\n    label,\n    localized,\n    onChange,\n    path,\n    placeholder,\n    readOnly,\n    required,\n    rows,\n    rtl,\n    showError,\n    style,\n    value,\n  } = props\n\n  const { i18n } = useTranslation()\n\n  return (\n    <div\n      className={[\n        fieldBaseClass,\n        'textarea',\n        className,\n        showError && 'error',\n        readOnly && 'read-only',\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      style={style}\n    >\n      <RenderCustomComponent\n        CustomComponent={Label}\n        Fallback={\n          <FieldLabel\n            htmlFor={`field-${path.replace(/\\./g, '__')}`}\n            label={label}\n            localized={localized}\n            path={path}\n            required={required}\n          />\n        }\n      />\n      <div className={`${fieldBaseClass}__wrap`}>\n        <RenderCustomComponent\n          CustomComponent={Error}\n          Fallback={<FieldError path={path} showError={showError} />}\n        />\n        {BeforeInput}\n        <div className=\"textarea-outer\">\n          <textarea\n            data-rtl={rtl}\n            disabled={readOnly}\n            id={`field-${path.replace(/\\./g, '__')}`}\n            name={path}\n            onChange={onChange}\n            placeholder={getTranslation(placeholder, i18n)}\n            rows={rows}\n            style={\n              {\n                '--rows': rows,\n              } as CSSProperties\n            }\n            value={value || ''}\n          />\n        </div>\n        {AfterInput}\n        <RenderCustomComponent\n          CustomComponent={Description}\n          Fallback={<FieldDescription description={description} path={path} />}\n        />\n      </div>\n    </div>\n  )\n}\n"],"names":["getTranslation","RenderCustomComponent","FieldDescription","FieldError","FieldLabel","useTranslation","fieldBaseClass","TextareaInput","props","AfterInput","BeforeInput","className","Description","description","Error","Label","label","localized","onChange","path","placeholder","readOnly","required","rows","rtl","showError","style","value","i18n","div","filter","Boolean","join","CustomComponent","Fallback","htmlFor","replace","textarea","data-rtl","disabled","id","name"],"mappings":"AAAA;AAGA,SAASA,cAAc,QAAQ,2BAA0B;AAKzD,SAASC,qBAAqB,QAAQ,gDAA+C;AACrF,SAASC,gBAAgB,QAAQ,yCAAwC;AACzE,SAASC,UAAU,QAAQ,mCAAkC;AAC7D,SAASC,UAAU,QAAQ,mCAAkC;AAC7D,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,cAAc,QAAQ,qBAAoB;AACnD,OAAO,eAAc;AAErB,OAAO,MAAMC,gBAA8C,CAACC;IAC1D,MAAM,EACJC,UAAU,EACVC,WAAW,EACXC,SAAS,EACTC,WAAW,EACXC,WAAW,EACXC,KAAK,EACLC,KAAK,EACLC,KAAK,EACLC,SAAS,EACTC,QAAQ,EACRC,IAAI,EACJC,WAAW,EACXC,QAAQ,EACRC,QAAQ,EACRC,IAAI,EACJC,GAAG,EACHC,SAAS,EACTC,KAAK,EACLC,KAAK,EACN,GAAGnB;IAEJ,MAAM,EAAEoB,IAAI,EAAE,GAAGvB;IAEjB,QACGwB,IACClB,WAAW;QACTL;QACA;QACAK;QACAc,aAAa;QACbJ,YAAY;KACb,CACES,MAAM,CAACC,SACPC,IAAI,CAAC,MACRN,OAAOA,OACR;MACC,CAACzB,sBACCgC,iBAAiBlB,OACjBmB,WACG9B,WACC+B,SAAS,CAAC,MAAM,EAAEhB,KAAKiB,OAAO,CAAC,OAAO,OAAO,EAC7CpB,OAAOA,OACPC,WAAWA,WACXE,MAAMA,MACNG,UAAUA,cAGd;MACF,CAACO,IAAIlB,WAAW,GAAGL,eAAe,MAAM,CAAC,EAAE;QACzC,CAACL,sBACCgC,iBAAiBnB,OACjBoB,WAAW/B,WAAWgB,MAAMA,MAAMM,WAAWA,eAC7C;QACF,CAACf,YAAY;QACb,CAACmB,IAAIlB,UAAU,iBAAiB;UAC9B,CAAC0B,SACCC,UAAUd,KACVe,UAAUlB,UACVmB,IAAI,CAAC,MAAM,EAAErB,KAAKiB,OAAO,CAAC,OAAO,OAAO,EACxCK,MAAMtB,MACND,UAAUA,UACVE,aAAapB,eAAeoB,aAAaQ,OACzCL,MAAMA,MACNG,OACE;QACE,UAAUH;IACZ,GAEFI,OAAOA,SAAS,KAChB;QACJ,EAAEE,IAAI;QACN,CAACpB,WAAW;QACZ,CAACR,sBACCgC,iBAAiBrB,aACjBsB,WAAWhC,iBAAiBW,aAAaA,aAAaM,MAAMA,UAC5D;MACJ,EAAEU,IAAI;IACR,EAAEA;AAEN,EAAC"}
+{"version":3,"sources":["../../../src/fields/Textarea/Input.tsx"],"sourcesContent":["'use client'\nimport type { CSSProperties } from 'react'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport type { TextAreaInputProps } from './types.js'\n\nimport { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js'\nimport { FieldDescription } from '../../fields/FieldDescription/index.js'\nimport { FieldError } from '../../fields/FieldError/index.js'\nimport { FieldLabel } from '../../fields/FieldLabel/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { fieldBaseClass } from '../shared/index.js'\nimport './index.scss'\n\nexport const TextareaInput: React.FC<TextAreaInputProps> = (props) => {\n  const {\n    AfterInput,\n    BeforeInput,\n    className,\n    Description,\n    description,\n    Error,\n    Label,\n    label,\n    localized,\n    onChange,\n    path,\n    placeholder,\n    readOnly,\n    required,\n    rows,\n    rtl,\n    showError,\n    style,\n    value,\n  } = props\n\n  const { i18n } = useTranslation()\n\n  return (\n    <div\n      className={[\n        fieldBaseClass,\n        'textarea',\n        className,\n        showError && 'error',\n        readOnly && 'read-only',\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      style={style}\n    >\n      <RenderCustomComponent\n        CustomComponent={Label}\n        Fallback={\n          <FieldLabel\n            htmlFor={`field-${path.replace(/\\./g, '__')}`}\n            label={label}\n            localized={localized}\n            path={path}\n            required={required}\n          />\n        }\n      />\n      <div className={`${fieldBaseClass}__wrap`}>\n        <RenderCustomComponent\n          CustomComponent={Error}\n          Fallback={<FieldError path={path} showError={showError} />}\n        />\n        {BeforeInput}\n        <div className=\"textarea-outer\">\n          <textarea\n            data-rtl={rtl}\n            disabled={readOnly}\n            id={`field-${path.replace(/\\./g, '__')}`}\n            name={path}\n            onChange={onChange}\n            placeholder={getTranslation(placeholder, i18n)}\n            rows={rows}\n            style={\n              {\n                '--rows': rows,\n              } as CSSProperties\n            }\n            value={value || ''}\n          />\n        </div>\n        {AfterInput}\n        <RenderCustomComponent\n          CustomComponent={Description}\n          Fallback={<FieldDescription description={description} path={path} />}\n        />\n      </div>\n    </div>\n  )\n}\n"],"names":["getTranslation","React","RenderCustomComponent","FieldDescription","FieldError","FieldLabel","useTranslation","fieldBaseClass","TextareaInput","props","AfterInput","BeforeInput","className","Description","description","Error","Label","label","localized","onChange","path","placeholder","readOnly","required","rows","rtl","showError","style","value","i18n","div","filter","Boolean","join","CustomComponent","Fallback","htmlFor","replace","textarea","data-rtl","disabled","id","name"],"mappings":"AAAA;;AAGA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,OAAOC,WAAW,QAAO;AAIzB,SAASC,qBAAqB,QAAQ,gDAA+C;AACrF,SAASC,gBAAgB,QAAQ,yCAAwC;AACzE,SAASC,UAAU,QAAQ,mCAAkC;AAC7D,SAASC,UAAU,QAAQ,mCAAkC;AAC7D,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,cAAc,QAAQ,qBAAoB;AACnD,OAAO,eAAc;AAErB,OAAO,MAAMC,gBAA8C,CAACC;IAC1D,MAAM,EACJC,UAAU,EACVC,WAAW,EACXC,SAAS,EACTC,WAAW,EACXC,WAAW,EACXC,KAAK,EACLC,KAAK,EACLC,KAAK,EACLC,SAAS,EACTC,QAAQ,EACRC,IAAI,EACJC,WAAW,EACXC,QAAQ,EACRC,QAAQ,EACRC,IAAI,EACJC,GAAG,EACHC,SAAS,EACTC,KAAK,EACLC,KAAK,EACN,GAAGnB;IAEJ,MAAM,EAAEoB,IAAI,EAAE,GAAGvB;IAEjB,qBACE,QAACwB;QACClB,WAAW;YACTL;YACA;YACAK;YACAc,aAAa;YACbJ,YAAY;SACb,CACES,MAAM,CAACC,SACPC,IAAI,CAAC;QACRN,OAAOA;;0BAEP,QAACzB;gBACCgC,iBAAiBlB;gBACjBmB,wBACE,QAAC9B;oBACC+B,SAAS,CAAC,MAAM,EAAEhB,KAAKiB,OAAO,CAAC,OAAO,OAAO;oBAC7CpB,OAAOA;oBACPC,WAAWA;oBACXE,MAAMA;oBACNG,UAAUA;;;;;;;;;;;0BAIhB,QAACO;gBAAIlB,WAAW,GAAGL,eAAe,MAAM,CAAC;;kCACvC,QAACL;wBACCgC,iBAAiBnB;wBACjBoB,wBAAU,QAAC/B;4BAAWgB,MAAMA;4BAAMM,WAAWA;;;;;;;;;;;oBAE9Cf;kCACD,QAACmB;wBAAIlB,WAAU;kCACb,cAAA,QAAC0B;4BACCC,YAAUd;4BACVe,UAAUlB;4BACVmB,IAAI,CAAC,MAAM,EAAErB,KAAKiB,OAAO,CAAC,OAAO,OAAO;4BACxCK,MAAMtB;4BACND,UAAUA;4BACVE,aAAarB,eAAeqB,aAAaQ;4BACzCL,MAAMA;4BACNG,OACE;gCACE,UAAUH;4BACZ;4BAEFI,OAAOA,SAAS;;;;;;;;;;;oBAGnBlB;kCACD,QAACR;wBACCgC,iBAAiBrB;wBACjBsB,wBAAU,QAAChC;4BAAiBW,aAAaA;4BAAaM,MAAMA;;;;;;;;;;;;;;;;;;;;;;;AAKtE,EAAC"}

package/dist/fields/Textarea/index.js

@@ -1,6 +1,7 @@
 'use client';
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { getTranslation } from '@payloadcms/translations';
-import { useCallback, useMemo } from 'react';
+import React, { useCallback, useMemo } from 'react';
 import { useField } from '../../forms/useField/index.js';
 import { withCondition } from '../../forms/withCondition/index.js';
 import { useConfig } from '../../providers/Config/index.js';
@@ -44,9 +45,33 @@ const TextareaFieldComponent = (props)=>{
     const styles = useMemo(()=>mergeFieldStyles(field), [
         field
     ]);
-    return <TextareaInput AfterInput={AfterInput} BeforeInput={BeforeInput} className={className} Description={Description} description={description} Error={Error} Label={Label} label={label} localized={localized} onChange={(e)=>{
-        setValue(e.target.value);
-    }} path={path} placeholder={getTranslation(placeholder, i18n)} readOnly={readOnly || disabled} required={required} rows={rows} rtl={isRTL} showError={showError} style={styles} value={value}/>;
+    return /*#__PURE__*/ _jsxDEV(TextareaInput, {
+        AfterInput: AfterInput,
+        BeforeInput: BeforeInput,
+        className: className,
+        Description: Description,
+        description: description,
+        Error: Error,
+        Label: Label,
+        label: label,
+        localized: localized,
+        onChange: (e)=>{
+            setValue(e.target.value);
+        },
+        path: path,
+        placeholder: getTranslation(placeholder, i18n),
+        readOnly: readOnly || disabled,
+        required: required,
+        rows: rows,
+        rtl: isRTL,
+        showError: showError,
+        style: styles,
+        value: value
+    }, void 0, false, {
+        fileName: "src/fields/Textarea/index.tsx",
+        lineNumber: 76,
+        columnNumber: 5
+    }, this);
 };
 export const TextareaField = withCondition(TextareaFieldComponent);
 

package/dist/fields/Textarea/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/fields/Textarea/index.tsx"],"sourcesContent":["'use client'\nimport type { TextareaFieldClientComponent, TextareaFieldValidation } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useCallback, useMemo } from 'react'\n\nimport type { TextAreaInputProps } from './types.js'\n\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { mergeFieldStyles } from '../mergeFieldStyles.js'\nimport './index.scss'\nimport { isFieldRTL } from '../shared/index.js'\nimport { TextareaInput } from './Input.js'\n\nexport { TextareaInput, TextAreaInputProps }\n\nconst TextareaFieldComponent: TextareaFieldClientComponent = (props) => {\n  const {\n    field,\n    field: {\n      admin: { className, description, placeholder, rows, rtl } = {},\n      label,\n      localized,\n      maxLength,\n      minLength,\n      required,\n    },\n    path: pathFromProps,\n    readOnly,\n    validate,\n  } = props\n\n  const { i18n } = useTranslation()\n\n  const {\n    config: { localization },\n  } = useConfig()\n\n  const locale = useLocale()\n\n  const isRTL = isFieldRTL({\n    fieldLocalized: localized,\n    fieldRTL: rtl,\n    locale,\n    localizationConfig: localization || undefined,\n  })\n\n  const memoizedValidate: TextareaFieldValidation = useCallback(\n    (value, options) => {\n      if (typeof validate === 'function') {\n        return validate(value, { ...options, maxLength, minLength, required })\n      }\n    },\n    [validate, required, maxLength, minLength],\n  )\n\n  const {\n    customComponents: { AfterInput, BeforeInput, Description, Error, Label } = {},\n    disabled,\n    path,\n    setValue,\n    showError,\n    value,\n  } = useField<string>({\n    potentiallyStalePath: pathFromProps,\n    validate: memoizedValidate,\n  })\n\n  const styles = useMemo(() => mergeFieldStyles(field), [field])\n\n  return (\n    <TextareaInput\n      AfterInput={AfterInput}\n      BeforeInput={BeforeInput}\n      className={className}\n      Description={Description}\n      description={description}\n      Error={Error}\n      Label={Label}\n      label={label}\n      localized={localized}\n      onChange={(e) => {\n        setValue(e.target.value)\n      }}\n      path={path}\n      placeholder={getTranslation(placeholder, i18n)}\n      readOnly={readOnly || disabled}\n      required={required}\n      rows={rows}\n      rtl={isRTL}\n      showError={showError}\n      style={styles}\n      value={value}\n    />\n  )\n}\n\nexport const TextareaField = withCondition(TextareaFieldComponent)\n"],"names":["getTranslation","useCallback","useMemo","useField","withCondition","useConfig","useLocale","useTranslation","mergeFieldStyles","isFieldRTL","TextareaInput","TextareaFieldComponent","props","field","admin","className","description","placeholder","rows","rtl","label","localized","maxLength","minLength","required","path","pathFromProps","readOnly","validate","i18n","config","localization","locale","isRTL","fieldLocalized","fieldRTL","localizationConfig","undefined","memoizedValidate","value","options","customComponents","AfterInput","BeforeInput","Description","Error","Label","disabled","setValue","showError","potentiallyStalePath","styles","onChange","e","target","style","TextareaField"],"mappings":"AAAA;AAGA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,SAAgBC,WAAW,EAAEC,OAAO,QAAQ,QAAO;AAInD,SAASC,QAAQ,QAAQ,gCAA+B;AACxD,SAASC,aAAa,QAAQ,qCAAoC;AAClE,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,gBAAgB,QAAQ,yBAAwB;AACzD,OAAO,eAAc;AACrB,SAASC,UAAU,QAAQ,qBAAoB;AAC/C,SAASC,aAAa,QAAQ,aAAY;AAE1C,SAASA,aAAa,GAAsB;AAE5C,MAAMC,yBAAuD,CAACC;IAC5D,MAAM,EACJC,KAAK,EACLA,OAAO,EACLC,OAAO,EAAEC,SAAS,EAAEC,WAAW,EAAEC,WAAW,EAAEC,IAAI,EAAEC,GAAG,EAAE,GAAG,CAAC,CAAC,EAC9DC,KAAK,EACLC,SAAS,EACTC,SAAS,EACTC,SAAS,EACTC,QAAQ,EACT,EACDC,MAAMC,aAAa,EACnBC,QAAQ,EACRC,QAAQ,EACT,GAAGhB;IAEJ,MAAM,EAAEiB,IAAI,EAAE,GAAGtB;IAEjB,MAAM,EACJuB,QAAQ,EAAEC,YAAY,EAAE,EACzB,GAAG1B;IAEJ,MAAM2B,SAAS1B;IAEf,MAAM2B,QAAQxB,WAAW;QACvByB,gBAAgBb;QAChBc,UAAUhB;QACVa;QACAI,oBAAoBL,gBAAgBM;IACtC;IAEA,MAAMC,mBAA4CrC,YAChD,CAACsC,OAAOC;QACN,IAAI,OAAOZ,aAAa,YAAY;YAClC,OAAOA,SAASW,OAAO;gBAAE,GAAGC,OAAO;gBAAElB;gBAAWC;gBAAWC;YAAS;QACtE;IACF,GACA;QAACI;QAAUJ;QAAUF;QAAWC;KAAU;IAG5C,MAAM,EACJkB,kBAAkB,EAAEC,UAAU,EAAEC,WAAW,EAAEC,WAAW,EAAEC,KAAK,EAAEC,KAAK,EAAE,GAAG,CAAC,CAAC,EAC7EC,QAAQ,EACRtB,IAAI,EACJuB,QAAQ,EACRC,SAAS,EACTV,KAAK,EACN,GAAGpC,SAAiB;QACnB+C,sBAAsBxB;QACtBE,UAAUU;IACZ;IAEA,MAAMa,SAASjD,QAAQ,IAAMM,iBAAiBK,QAAQ;QAACA;KAAM;IAE7D,QACGH,cACCgC,YAAYA,YACZC,aAAaA,aACb5B,WAAWA,WACX6B,aAAaA,aACb5B,aAAaA,aACb6B,OAAOA,OACPC,OAAOA,OACP1B,OAAOA,OACPC,WAAWA,WACX+B,UAAU,CAACC;QACTL,SAASK,EAAEC,MAAM,CAACf,KAAK;IACzB,GACAd,MAAMA,MACNR,aAAajB,eAAeiB,aAAaY,OACzCF,UAAUA,YAAYoB,UACtBvB,UAAUA,UACVN,MAAMA,MACNC,KAAKc,OACLgB,WAAWA,WACXM,OAAOJ,QACPZ,OAAOA;AAGb;AAEA,OAAO,MAAMiB,gBAAgBpD,cAAcO,wBAAuB"}
+{"version":3,"sources":["../../../src/fields/Textarea/index.tsx"],"sourcesContent":["'use client'\nimport type { TextareaFieldClientComponent, TextareaFieldValidation } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useCallback, useMemo } from 'react'\n\nimport type { TextAreaInputProps } from './types.js'\n\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { mergeFieldStyles } from '../mergeFieldStyles.js'\nimport './index.scss'\nimport { isFieldRTL } from '../shared/index.js'\nimport { TextareaInput } from './Input.js'\n\nexport { TextareaInput, TextAreaInputProps }\n\nconst TextareaFieldComponent: TextareaFieldClientComponent = (props) => {\n  const {\n    field,\n    field: {\n      admin: { className, description, placeholder, rows, rtl } = {},\n      label,\n      localized,\n      maxLength,\n      minLength,\n      required,\n    },\n    path: pathFromProps,\n    readOnly,\n    validate,\n  } = props\n\n  const { i18n } = useTranslation()\n\n  const {\n    config: { localization },\n  } = useConfig()\n\n  const locale = useLocale()\n\n  const isRTL = isFieldRTL({\n    fieldLocalized: localized,\n    fieldRTL: rtl,\n    locale,\n    localizationConfig: localization || undefined,\n  })\n\n  const memoizedValidate: TextareaFieldValidation = useCallback(\n    (value, options) => {\n      if (typeof validate === 'function') {\n        return validate(value, { ...options, maxLength, minLength, required })\n      }\n    },\n    [validate, required, maxLength, minLength],\n  )\n\n  const {\n    customComponents: { AfterInput, BeforeInput, Description, Error, Label } = {},\n    disabled,\n    path,\n    setValue,\n    showError,\n    value,\n  } = useField<string>({\n    potentiallyStalePath: pathFromProps,\n    validate: memoizedValidate,\n  })\n\n  const styles = useMemo(() => mergeFieldStyles(field), [field])\n\n  return (\n    <TextareaInput\n      AfterInput={AfterInput}\n      BeforeInput={BeforeInput}\n      className={className}\n      Description={Description}\n      description={description}\n      Error={Error}\n      Label={Label}\n      label={label}\n      localized={localized}\n      onChange={(e) => {\n        setValue(e.target.value)\n      }}\n      path={path}\n      placeholder={getTranslation(placeholder, i18n)}\n      readOnly={readOnly || disabled}\n      required={required}\n      rows={rows}\n      rtl={isRTL}\n      showError={showError}\n      style={styles}\n      value={value}\n    />\n  )\n}\n\nexport const TextareaField = withCondition(TextareaFieldComponent)\n"],"names":["getTranslation","React","useCallback","useMemo","useField","withCondition","useConfig","useLocale","useTranslation","mergeFieldStyles","isFieldRTL","TextareaInput","TextareaFieldComponent","props","field","admin","className","description","placeholder","rows","rtl","label","localized","maxLength","minLength","required","path","pathFromProps","readOnly","validate","i18n","config","localization","locale","isRTL","fieldLocalized","fieldRTL","localizationConfig","undefined","memoizedValidate","value","options","customComponents","AfterInput","BeforeInput","Description","Error","Label","disabled","setValue","showError","potentiallyStalePath","styles","onChange","e","target","style","TextareaField"],"mappings":"AAAA;;AAGA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,OAAOC,SAASC,WAAW,EAAEC,OAAO,QAAQ,QAAO;AAInD,SAASC,QAAQ,QAAQ,gCAA+B;AACxD,SAASC,aAAa,QAAQ,qCAAoC;AAClE,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,gBAAgB,QAAQ,yBAAwB;AACzD,OAAO,eAAc;AACrB,SAASC,UAAU,QAAQ,qBAAoB;AAC/C,SAASC,aAAa,QAAQ,aAAY;AAE1C,SAASA,aAAa,GAAsB;AAE5C,MAAMC,yBAAuD,CAACC;IAC5D,MAAM,EACJC,KAAK,EACLA,OAAO,EACLC,OAAO,EAAEC,SAAS,EAAEC,WAAW,EAAEC,WAAW,EAAEC,IAAI,EAAEC,GAAG,EAAE,GAAG,CAAC,CAAC,EAC9DC,KAAK,EACLC,SAAS,EACTC,SAAS,EACTC,SAAS,EACTC,QAAQ,EACT,EACDC,MAAMC,aAAa,EACnBC,QAAQ,EACRC,QAAQ,EACT,GAAGhB;IAEJ,MAAM,EAAEiB,IAAI,EAAE,GAAGtB;IAEjB,MAAM,EACJuB,QAAQ,EAAEC,YAAY,EAAE,EACzB,GAAG1B;IAEJ,MAAM2B,SAAS1B;IAEf,MAAM2B,QAAQxB,WAAW;QACvByB,gBAAgBb;QAChBc,UAAUhB;QACVa;QACAI,oBAAoBL,gBAAgBM;IACtC;IAEA,MAAMC,mBAA4CrC,YAChD,CAACsC,OAAOC;QACN,IAAI,OAAOZ,aAAa,YAAY;YAClC,OAAOA,SAASW,OAAO;gBAAE,GAAGC,OAAO;gBAAElB;gBAAWC;gBAAWC;YAAS;QACtE;IACF,GACA;QAACI;QAAUJ;QAAUF;QAAWC;KAAU;IAG5C,MAAM,EACJkB,kBAAkB,EAAEC,UAAU,EAAEC,WAAW,EAAEC,WAAW,EAAEC,KAAK,EAAEC,KAAK,EAAE,GAAG,CAAC,CAAC,EAC7EC,QAAQ,EACRtB,IAAI,EACJuB,QAAQ,EACRC,SAAS,EACTV,KAAK,EACN,GAAGpC,SAAiB;QACnB+C,sBAAsBxB;QACtBE,UAAUU;IACZ;IAEA,MAAMa,SAASjD,QAAQ,IAAMM,iBAAiBK,QAAQ;QAACA;KAAM;IAE7D,qBACE,QAACH;QACCgC,YAAYA;QACZC,aAAaA;QACb5B,WAAWA;QACX6B,aAAaA;QACb5B,aAAaA;QACb6B,OAAOA;QACPC,OAAOA;QACP1B,OAAOA;QACPC,WAAWA;QACX+B,UAAU,CAACC;YACTL,SAASK,EAAEC,MAAM,CAACf,KAAK;QACzB;QACAd,MAAMA;QACNR,aAAalB,eAAekB,aAAaY;QACzCF,UAAUA,YAAYoB;QACtBvB,UAAUA;QACVN,MAAMA;QACNC,KAAKc;QACLgB,WAAWA;QACXM,OAAOJ;QACPZ,OAAOA;;;;;;AAGb;AAEA,OAAO,MAAMiB,gBAAgBpD,cAAcO,wBAAuB"}

package/dist/fields/Upload/HasMany/index.js

@@ -1,4 +1,5 @@
 'use client';
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import React from 'react';
 import { DraggableSortableItem } from '../../../elements/DraggableSortable/DraggableSortableItem/index.js';
 import { DraggableSortable } from '../../../elements/DraggableSortable/index.js';
@@ -34,58 +35,122 @@ export function UploadComponentHasMany(props) {
         fileDocs,
         onRemove
     ]);
-    return <div className={[
-        baseClass,
-        className
-    ].filter(Boolean).join(' ')}>
-      <DraggableSortable className={`${baseClass}__draggable-rows`} ids={fileDocs?.map(({ value })=>String(value.id))} onDragEnd={({ moveFromIndex, moveToIndex })=>moveRow(moveFromIndex, moveToIndex)}>
-        {fileDocs.map(({ relationTo, value }, index)=>{
-        const id = String(value.id);
-        let src;
-        let thumbnailSrc;
-        if (value.url) {
-            try {
-                src = new URL(value.url, serverURL).toString();
-            } catch  {
-                src = `${serverURL}${value.url}`;
-            }
-        }
-        if (value.thumbnailURL) {
-            try {
-                thumbnailSrc = new URL(value.thumbnailURL, serverURL).toString();
-            } catch  {
-                thumbnailSrc = `${serverURL}${value.thumbnailURL}`;
-            }
-        }
-        if (isImage(value.mimeType)) {
-            thumbnailSrc = getBestFitFromSizes({
-                sizes: value.sizes,
-                thumbnailURL: thumbnailSrc,
-                url: src,
-                width: value.width
-            });
-        }
-        return <DraggableSortableItem disabled={!isSortable || readonly} id={id} key={id}>
-              {(draggableSortableItemProps)=><div className={[
-                `${baseClass}__dragItem`,
-                draggableSortableItemProps && isSortable && `${baseClass}--has-drag-handle`
-            ].filter(Boolean).join(' ')} ref={draggableSortableItemProps.setNodeRef} style={{
-                transform: draggableSortableItemProps.transform,
-                transition: draggableSortableItemProps.transition,
-                zIndex: draggableSortableItemProps.isDragging ? 1 : undefined
-            }}>
-                  <UploadCard size="small">
-                    {draggableSortableItemProps && <div className={`${baseClass}__drag`} {...draggableSortableItemProps.attributes} {...draggableSortableItemProps.listeners}>
-                        <DragHandleIcon/>
-                      </div>}
-
-                    <RelationshipContent allowEdit={!readonly} allowRemove={!readonly} alt={value?.alt || value?.filename} byteSize={value.filesize} collectionSlug={relationTo} displayPreview={displayPreview} filename={value.filename} id={id} mimeType={value?.mimeType} onRemove={()=>removeItem(index)} reloadDoc={reloadDoc} showCollectionSlug={showCollectionSlug} src={src} thumbnailSrc={thumbnailSrc} withMeta={false} x={value?.width} y={value?.height}/>
-                  </UploadCard>
-                </div>}
-            </DraggableSortableItem>;
-    })}
-      </DraggableSortable>
-    </div>;
+    return /*#__PURE__*/ _jsxDEV("div", {
+        className: [
+            baseClass,
+            className
+        ].filter(Boolean).join(' '),
+        children: /*#__PURE__*/ _jsxDEV(DraggableSortable, {
+            className: `${baseClass}__draggable-rows`,
+            ids: fileDocs?.map(({ value })=>String(value.id)),
+            onDragEnd: ({ moveFromIndex, moveToIndex })=>moveRow(moveFromIndex, moveToIndex),
+            children: fileDocs.map(({ relationTo, value }, index)=>{
+                const id = String(value.id);
+                let src;
+                let thumbnailSrc;
+                if (value.url) {
+                    try {
+                        src = new URL(value.url, serverURL).toString();
+                    } catch  {
+                        src = `${serverURL}${value.url}`;
+                    }
+                }
+                if (value.thumbnailURL) {
+                    try {
+                        thumbnailSrc = new URL(value.thumbnailURL, serverURL).toString();
+                    } catch  {
+                        thumbnailSrc = `${serverURL}${value.thumbnailURL}`;
+                    }
+                }
+                if (isImage(value.mimeType)) {
+                    thumbnailSrc = getBestFitFromSizes({
+                        sizes: value.sizes,
+                        thumbnailURL: thumbnailSrc,
+                        url: src,
+                        width: value.width
+                    });
+                }
+                return /*#__PURE__*/ _jsxDEV(DraggableSortableItem, {
+                    disabled: !isSortable || readonly,
+                    id: id,
+                    children: (draggableSortableItemProps)=>/*#__PURE__*/ _jsxDEV("div", {
+                            className: [
+                                `${baseClass}__dragItem`,
+                                draggableSortableItemProps && isSortable && `${baseClass}--has-drag-handle`
+                            ].filter(Boolean).join(' '),
+                            ref: draggableSortableItemProps.setNodeRef,
+                            style: {
+                                transform: draggableSortableItemProps.transform,
+                                transition: draggableSortableItemProps.transition,
+                                zIndex: draggableSortableItemProps.isDragging ? 1 : undefined
+                            },
+                            children: /*#__PURE__*/ _jsxDEV(UploadCard, {
+                                size: "small",
+                                children: [
+                                    draggableSortableItemProps && /*#__PURE__*/ _jsxDEV("div", {
+                                        className: `${baseClass}__drag`,
+                                        ...draggableSortableItemProps.attributes,
+                                        ...draggableSortableItemProps.listeners,
+                                        children: /*#__PURE__*/ _jsxDEV(DragHandleIcon, {}, void 0, false, {
+                                            fileName: "src/fields/Upload/HasMany/index.tsx",
+                                            lineNumber: 136,
+                                            columnNumber: 25
+                                        }, this)
+                                    }, void 0, false, {
+                                        fileName: "src/fields/Upload/HasMany/index.tsx",
+                                        lineNumber: 131,
+                                        columnNumber: 23
+                                    }, this),
+                                    /*#__PURE__*/ _jsxDEV(RelationshipContent, {
+                                        allowEdit: !readonly,
+                                        allowRemove: !readonly,
+                                        alt: value?.alt || value?.filename,
+                                        byteSize: value.filesize,
+                                        collectionSlug: relationTo,
+                                        displayPreview: displayPreview,
+                                        filename: value.filename,
+                                        id: id,
+                                        mimeType: value?.mimeType,
+                                        onRemove: ()=>removeItem(index),
+                                        reloadDoc: reloadDoc,
+                                        showCollectionSlug: showCollectionSlug,
+                                        src: src,
+                                        thumbnailSrc: thumbnailSrc,
+                                        withMeta: false,
+                                        x: value?.width,
+                                        y: value?.height
+                                    }, void 0, false, {
+                                        fileName: "src/fields/Upload/HasMany/index.tsx",
+                                        lineNumber: 140,
+                                        columnNumber: 21
+                                    }, this)
+                                ]
+                            }, void 0, true, {
+                                fileName: "src/fields/Upload/HasMany/index.tsx",
+                                lineNumber: 129,
+                                columnNumber: 19
+                            }, this)
+                        }, void 0, false, {
+                            fileName: "src/fields/Upload/HasMany/index.tsx",
+                            lineNumber: 115,
+                            columnNumber: 17
+                        }, this)
+                }, id, false, {
+                    fileName: "src/fields/Upload/HasMany/index.tsx",
+                    lineNumber: 113,
+                    columnNumber: 13
+                }, this);
+            })
+        }, void 0, false, {
+            fileName: "src/fields/Upload/HasMany/index.tsx",
+            lineNumber: 77,
+            columnNumber: 7
+        }, this)
+    }, void 0, false, {
+        fileName: "src/fields/Upload/HasMany/index.tsx",
+        lineNumber: 76,
+        columnNumber: 5
+    }, this);
 }
 
 //# sourceMappingURL=index.js.map