@payloadcms/ui 3.0.0-beta.13 → 3.0.0-beta.130

package/dist/fields/Select/Input.js

@@ -0,0 +1,186 @@
+'use client';
+
+import { c as _c } from "react/compiler-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { getTranslation } from '@payloadcms/translations';
+import React from 'react';
+import { ReactSelect } from '../../elements/ReactSelect/index.js';
+import { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js';
+import { FieldDescription } from '../../fields/FieldDescription/index.js';
+import { FieldError } from '../../fields/FieldError/index.js';
+import { FieldLabel } from '../../fields/FieldLabel/index.js';
+import { useTranslation } from '../../providers/Translation/index.js';
+import { fieldBaseClass } from '../shared/index.js';
+import './index.scss';
+export const SelectInput = props => {
+  const $ = _c(38);
+  const {
+    AfterInput,
+    BeforeInput,
+    className,
+    Description,
+    description,
+    Error,
+    hasMany: t0,
+    isClearable: t1,
+    isSortable: t2,
+    label,
+    Label,
+    localized,
+    onChange,
+    options,
+    path,
+    readOnly,
+    showError,
+    style,
+    value,
+    width
+  } = props;
+  const hasMany = t0 === undefined ? false : t0;
+  const isClearable = t1 === undefined ? true : t1;
+  const isSortable = t2 === undefined ? true : t2;
+  const {
+    i18n
+  } = useTranslation();
+  let t3;
+  if ($[0] !== hasMany || $[1] !== value || $[2] !== options || $[3] !== i18n || $[4] !== showError || $[5] !== readOnly || $[6] !== className || $[7] !== path || $[8] !== style || $[9] !== width || $[10] !== label || $[11] !== localized || $[12] !== Label || $[13] !== Error || $[14] !== isClearable || $[15] !== isSortable || $[16] !== onChange || $[17] !== BeforeInput || $[18] !== AfterInput || $[19] !== description || $[20] !== Description) {
+    let valueToRender;
+    if (hasMany && Array.isArray(value)) {
+      let t4;
+      if ($[22] !== options || $[23] !== i18n) {
+        t4 = val => {
+          const matchingOption = options.find(option => option.value === val);
+          return {
+            label: matchingOption ? getTranslation(matchingOption.label, i18n) : val,
+            value: matchingOption?.value ?? val
+          };
+        };
+        $[22] = options;
+        $[23] = i18n;
+        $[24] = t4;
+      } else {
+        t4 = $[24];
+      }
+      valueToRender = value.map(t4);
+    } else {
+      if (value) {
+        let matchingOption_0;
+        let t4;
+        if ($[25] !== value || $[26] !== options || $[27] !== i18n) {
+          let t5;
+          if ($[30] !== value) {
+            t5 = option_0 => option_0.value === value;
+            $[30] = value;
+            $[31] = t5;
+          } else {
+            t5 = $[31];
+          }
+          matchingOption_0 = options.find(t5);
+          t4 = matchingOption_0 ? getTranslation(matchingOption_0.label, i18n) : value;
+          $[25] = value;
+          $[26] = options;
+          $[27] = i18n;
+          $[28] = matchingOption_0;
+          $[29] = t4;
+        } else {
+          matchingOption_0 = $[28];
+          t4 = $[29];
+        }
+        valueToRender = {
+          label: t4,
+          value: matchingOption_0?.value ?? value
+        };
+      }
+    }
+    const t4 = showError && "error";
+    const t5 = readOnly && "read-only";
+    let t6;
+    if ($[32] !== className || $[33] !== t4 || $[34] !== t5) {
+      t6 = [fieldBaseClass, "select", className, t4, t5].filter(Boolean);
+      $[32] = className;
+      $[33] = t4;
+      $[34] = t5;
+      $[35] = t6;
+    } else {
+      t6 = $[35];
+    }
+    let t7;
+    if ($[36] !== i18n) {
+      t7 = option_1 => ({
+        ...option_1,
+        label: getTranslation(option_1.label, i18n)
+      });
+      $[36] = i18n;
+      $[37] = t7;
+    } else {
+      t7 = $[37];
+    }
+    t3 = _jsxs("div", {
+      className: t6.join(" "),
+      id: `field-${path.replace(/\./g, "__")}`,
+      style: {
+        ...style,
+        width
+      },
+      children: [_jsx(RenderCustomComponent, {
+        CustomComponent: Label,
+        Fallback: _jsx(FieldLabel, {
+          label,
+          localized,
+          path,
+          required: false
+        })
+      }), _jsxs("div", {
+        className: `${fieldBaseClass}__wrap`,
+        children: [_jsx(RenderCustomComponent, {
+          CustomComponent: Error,
+          Fallback: _jsx(FieldError, {
+            path,
+            showError
+          })
+        }), BeforeInput, _jsx(ReactSelect, {
+          disabled: readOnly,
+          isClearable,
+          isMulti: hasMany,
+          isSortable,
+          onChange,
+          options: options.map(t7),
+          showError,
+          value: valueToRender
+        }), AfterInput]
+      }), _jsx(RenderCustomComponent, {
+        CustomComponent: Description,
+        Fallback: _jsx(FieldDescription, {
+          description,
+          path
+        })
+      })]
+    });
+    $[0] = hasMany;
+    $[1] = value;
+    $[2] = options;
+    $[3] = i18n;
+    $[4] = showError;
+    $[5] = readOnly;
+    $[6] = className;
+    $[7] = path;
+    $[8] = style;
+    $[9] = width;
+    $[10] = label;
+    $[11] = localized;
+    $[12] = Label;
+    $[13] = Error;
+    $[14] = isClearable;
+    $[15] = isSortable;
+    $[16] = onChange;
+    $[17] = BeforeInput;
+    $[18] = AfterInput;
+    $[19] = description;
+    $[20] = Description;
+    $[21] = t3;
+  } else {
+    t3 = $[21];
+  }
+  return t3;
+};
+//# sourceMappingURL=Input.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Input.js","names":["c","_c","getTranslation","React","ReactSelect","RenderCustomComponent","FieldDescription","FieldError","FieldLabel","useTranslation","fieldBaseClass","SelectInput","props","$","AfterInput","BeforeInput","className","Description","description","Error","hasMany","t0","isClearable","t1","isSortable","t2","label","Label","localized","onChange","options","path","readOnly","showError","style","value","width","undefined","i18n","t3","valueToRender","Array","isArray","t4","val","matchingOption","find","option","map","matchingOption_0","t5","option_0","t6","filter","Boolean","t7","option_1","_jsxs","join","id","replace","children","_jsx","CustomComponent","Fallback","required","disabled","isMulti"],"sources":["../../../src/fields/Select/Input.tsx"],"sourcesContent":["'use client'\nimport type { OptionObject, StaticDescription, StaticLabel } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport type { ReactSelectAdapterProps } from '../../elements/ReactSelect/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 type SelectInputProps = {\n  readonly AfterInput?: React.ReactNode\n  readonly BeforeInput?: React.ReactNode\n  readonly className?: string\n  readonly Description?: React.ReactNode\n  readonly description?: StaticDescription\n  readonly Error?: React.ReactNode\n  readonly hasMany?: boolean\n  readonly isClearable?: boolean\n  readonly isSortable?: boolean\n  readonly Label?: React.ReactNode\n  readonly label?: StaticLabel\n  readonly localized?: boolean\n  readonly name: string\n  readonly onChange?: ReactSelectAdapterProps['onChange']\n  readonly options?: OptionObject[]\n  readonly path: string\n  readonly readOnly?: boolean\n  readonly showError?: boolean\n  readonly style?: React.CSSProperties\n  readonly value?: string | string[]\n  readonly width?: React.CSSProperties['width']\n}\n\nexport const SelectInput: React.FC<SelectInputProps> = (props) => {\n  const {\n    AfterInput,\n    BeforeInput,\n    className,\n    Description,\n    description,\n    Error,\n    hasMany = false,\n    isClearable = true,\n    isSortable = true,\n    label,\n    Label,\n    localized,\n    onChange,\n    options,\n    path,\n    readOnly,\n    showError,\n    style,\n    value,\n    width,\n  } = props\n\n  const { i18n } = useTranslation()\n\n  let valueToRender\n\n  if (hasMany && Array.isArray(value)) {\n    valueToRender = value.map((val) => {\n      const matchingOption = options.find((option) => option.value === val)\n      return {\n        label: matchingOption ? getTranslation(matchingOption.label, i18n) : val,\n        value: matchingOption?.value ?? val,\n      }\n    })\n  } else if (value) {\n    const matchingOption = options.find((option) => option.value === value)\n    valueToRender = {\n      label: matchingOption ? getTranslation(matchingOption.label, i18n) : value,\n      value: matchingOption?.value ?? value,\n    }\n  }\n\n  return (\n    <div\n      className={[\n        fieldBaseClass,\n        'select',\n        className,\n        showError && 'error',\n        readOnly && 'read-only',\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      id={`field-${path.replace(/\\./g, '__')}`}\n      style={{\n        ...style,\n        width,\n      }}\n    >\n      <RenderCustomComponent\n        CustomComponent={Label}\n        Fallback={<FieldLabel label={label} localized={localized} path={path} required={false} />}\n      />\n      <div className={`${fieldBaseClass}__wrap`}>\n        <RenderCustomComponent\n          CustomComponent={Error}\n          Fallback={<FieldError path={path} showError={showError} />}\n        />\n        {BeforeInput}\n        <ReactSelect\n          disabled={readOnly}\n          isClearable={isClearable}\n          isMulti={hasMany}\n          isSortable={isSortable}\n          onChange={onChange}\n          options={options.map((option) => ({\n            ...option,\n            label: getTranslation(option.label, i18n),\n          }))}\n          showError={showError}\n          value={valueToRender as OptionObject}\n        />\n        {AfterInput}\n      </div>\n      <RenderCustomComponent\n        CustomComponent={Description}\n        Fallback={<FieldDescription description={description} path={path} />}\n      />\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/fields/Select/index.d.ts

@@ -1,18 +1,13 @@
-import type { FieldBase, Option } from 'payload/types';
 import React from 'react';
-import type { FormFieldBase } from '../shared/index.js';
-import './index.scss';
-export type SelectFieldProps = FormFieldBase & {
-    hasMany?: boolean;
-    isClearable?: boolean;
-    isSortable?: boolean;
-    label?: FieldBase['label'];
-    name?: string;
-    onChange?: (e: string) => void;
-    options?: Option[];
-    path?: string;
-    value?: string;
-    width?: string;
-};
-export declare const Select: React.FC<SelectFieldProps>;
+import type { SelectInputProps } from './Input.js';
+import { SelectInput } from './Input.js';
+export declare const SelectField: React.FC<{
+    readonly onChange?: (e: string | string[]) => void;
+    readonly path: string;
+    readonly validate?: import("payload").SelectFieldValidation;
+    readonly value?: string;
+} & {
+    readonly field: Omit<import("payload").SelectFieldClient, "type"> & Partial<Pick<import("payload").SelectFieldClient, "type">>;
+} & Omit<import("payload").ClientComponentProps, "field" | "customComponents">>;
+export { SelectInput, type SelectInputProps };
 //# sourceMappingURL=index.d.ts.map

package/dist/fields/Select/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/Select/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAkB,SAAS,EAAE,MAAM,EAAgB,MAAM,eAAe,CAAA;AAOpF,OAAO,KAAgC,MAAM,OAAO,CAAA;AAEpD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAOvD,OAAO,cAAc,CAAA;AAErB,MAAM,MAAM,gBAAgB,GAAG,aAAa,GAAG;IAC7C,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAA;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IAC9B,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AA0JD,eAAO,MAAM,MAAM,4BAA6B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/Select/index.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAsB,MAAM,OAAO,CAAA;AAG1C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAA;AAIlD,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAA;AA8GxC,eAAO,MAAM,WAAW;;;;;;;+EAAsC,CAAA;AAE9D,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,CAAA"}

package/dist/fields/Select/index.js

@@ -1,124 +1,110 @@
-/* eslint-disable react/destructuring-assignment */ 'use client';
-import { getTranslation } from '@payloadcms/translations';
-import { FieldDescription } from '@payloadcms/ui/forms/FieldDescription';
-import { FieldError } from '@payloadcms/ui/forms/FieldError';
-import { FieldLabel } from '@payloadcms/ui/forms/FieldLabel';
-import { useFieldProps } from '@payloadcms/ui/forms/FieldPropsProvider';
-import React, { useCallback, useState } from 'react';
-import { ReactSelect } from '../../elements/ReactSelect/index.js';
+'use client';
+
+import { jsx as _jsx } from "react/jsx-runtime";
+import React, { useCallback } from 'react';
 import { useField } from '../../forms/useField/index.js';
 import { withCondition } from '../../forms/withCondition/index.js';
-import { useTranslation } from '../../providers/Translation/index.js';
-import { fieldBaseClass } from '../shared/index.js';
-const formatOptions = (options)=>options.map((option)=>{
-        if (typeof option === 'object' && (option.value || option.value === '')) {
-            return option;
-        }
-        return {
-            label: option,
-            value: option
-        };
-    });
-const SelectField = (props)=>{
-    const { name, AfterInput, BeforeInput, CustomDescription, CustomError, CustomLabel, className, descriptionProps, errorProps, hasMany = false, isClearable = true, isSortable = true, label, labelProps, onChange: onChangeFromProps, options: optionsFromProps = [], path: pathFromProps, readOnly: readOnlyFromProps, required, style, validate, width } = props;
-    const { i18n } = useTranslation();
-    const [options] = useState(formatOptions(optionsFromProps));
-    const memoizedValidate = useCallback((value, validationOptions)=>{
-        if (typeof validate === 'function') return validate(value, {
-            ...validationOptions,
-            hasMany,
-            options,
-            required
-        });
-    }, [
-        validate,
-        required,
+import { SelectInput } from './Input.js';
+const formatOptions = options => options.map(option => {
+  if (typeof option === 'object' && (option.value || option.value === '')) {
+    return option;
+  }
+  return {
+    label: option,
+    value: option
+  };
+});
+const SelectFieldComponent = props => {
+  const {
+    field: {
+      name,
+      admin: {
+        className,
+        description,
+        isClearable = true,
+        isSortable = true,
+        style,
+        width
+      } = {},
+      hasMany = false,
+      label,
+      localized,
+      options: optionsFromProps = [],
+      required
+    },
+    onChange: onChangeFromProps,
+    path,
+    readOnly,
+    validate
+  } = props;
+  const options = React.useMemo(() => formatOptions(optionsFromProps), [optionsFromProps]);
+  const memoizedValidate = useCallback((value, validationOptions) => {
+    if (typeof validate === 'function') {
+      return validate(value, {
+        ...validationOptions,
         hasMany,
-        options
-    ]);
-    const { path: pathFromContext, readOnly: readOnlyFromContext } = useFieldProps();
-    const readOnly = readOnlyFromProps || readOnlyFromContext;
-    const { path, setValue, showError, value } = useField({
-        path: pathFromContext || pathFromProps || name,
-        validate: memoizedValidate
-    });
-    let valueToRender;
-    if (hasMany && Array.isArray(value)) {
-        valueToRender = value.map((val)=>{
-            const matchingOption = options.find((option)=>option.value === val);
-            return {
-                label: matchingOption ? getTranslation(matchingOption.label, i18n) : val,
-                value: matchingOption?.value ?? val
-            };
-        });
-    } else if (value) {
-        const matchingOption = options.find((option)=>option.value === value);
-        valueToRender = {
-            label: matchingOption ? getTranslation(matchingOption.label, i18n) : value,
-            value: matchingOption?.value ?? value
-        };
+        options,
+        required
+      });
     }
-    const onChange = useCallback((selectedOption)=>{
-        if (!readOnly) {
-            let newValue;
-            if (!selectedOption) {
-                newValue = null;
-            } else if (hasMany) {
-                if (Array.isArray(selectedOption)) {
-                    newValue = selectedOption.map((option)=>option.value);
-                } else {
-                    newValue = [];
-                }
-            } else {
-                newValue = selectedOption.value;
-            }
-            if (typeof onChangeFromProps === 'function') {
-                onChangeFromProps(newValue);
-            }
-            setValue(newValue);
-        }
-    }, [
-        readOnly,
-        hasMany,
-        setValue,
-        onChangeFromProps
-    ]);
-    return /*#__PURE__*/ React.createElement("div", {
-        className: [
-            fieldBaseClass,
-            'select',
-            className,
-            showError && 'error',
-            readOnly && 'read-only'
-        ].filter(Boolean).join(' '),
-        id: `field-${path.replace(/\./g, '__')}`,
-        style: {
-            ...style,
-            width
+  }, [validate, required, hasMany, options]);
+  const {
+    customComponents: {
+      AfterInput,
+      BeforeInput,
+      Description,
+      Error,
+      Label
+    } = {},
+    setValue,
+    showError,
+    value: value_0
+  } = useField({
+    path,
+    validate: memoizedValidate
+  });
+  const onChange = useCallback(selectedOption => {
+    if (!readOnly) {
+      let newValue = null;
+      if (selectedOption && hasMany) {
+        if (Array.isArray(selectedOption)) {
+          newValue = selectedOption.map(option => option.value);
+        } else {
+          newValue = [];
         }
-    }, /*#__PURE__*/ React.createElement(FieldError, {
-        CustomError: CustomError,
-        path: path,
-        ...errorProps || {}
-    }), /*#__PURE__*/ React.createElement(FieldLabel, {
-        CustomLabel: CustomLabel,
-        label: label,
-        required: required,
-        ...labelProps || {}
-    }), /*#__PURE__*/ React.createElement("div", null, BeforeInput, /*#__PURE__*/ React.createElement(ReactSelect, {
-        disabled: readOnly,
-        isClearable: isClearable,
-        isMulti: hasMany,
-        isSortable: isSortable,
-        onChange: onChange,
-        options: options.map((option)=>({
-                ...option,
-                label: getTranslation(option.label, i18n)
-            })),
-        showError: showError,
-        value: valueToRender
-    }), AfterInput), CustomDescription !== undefined ? CustomDescription : /*#__PURE__*/ React.createElement(FieldDescription, descriptionProps || {}));
+      } else if (selectedOption && !Array.isArray(selectedOption)) {
+        newValue = selectedOption.value;
+      }
+      if (typeof onChangeFromProps === 'function') {
+        onChangeFromProps(newValue);
+      }
+      setValue(newValue);
+    }
+  }, [readOnly, hasMany, setValue, onChangeFromProps]);
+  return /*#__PURE__*/_jsx(SelectInput, {
+    AfterInput: AfterInput,
+    BeforeInput: BeforeInput,
+    className: className,
+    Description: Description,
+    description: description,
+    Error: Error,
+    hasMany: hasMany,
+    isClearable: isClearable,
+    isSortable: isSortable,
+    Label: Label,
+    label: label,
+    localized: localized,
+    name: name,
+    onChange: onChange,
+    options: options,
+    path: path,
+    readOnly: readOnly,
+    showError: showError,
+    style: style,
+    value: value_0,
+    width: width
+  });
 };
-export const Select = withCondition(SelectField);
-
+export const SelectField = withCondition(SelectFieldComponent);
+export { SelectInput };
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/fields/Select/index.tsx"],"sourcesContent":["/* eslint-disable react/destructuring-assignment */\n'use client'\nimport type { ClientValidate, FieldBase, Option, OptionObject } from 'payload/types'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { FieldDescription } from '@payloadcms/ui/forms/FieldDescription'\nimport { FieldError } from '@payloadcms/ui/forms/FieldError'\nimport { FieldLabel } from '@payloadcms/ui/forms/FieldLabel'\nimport { useFieldProps } from '@payloadcms/ui/forms/FieldPropsProvider'\nimport React, { useCallback, useState } from 'react'\n\nimport type { FormFieldBase } from '../shared/index.js'\n\nimport { ReactSelect } from '../../elements/ReactSelect/index.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { fieldBaseClass } from '../shared/index.js'\nimport './index.scss'\n\nexport type SelectFieldProps = FormFieldBase & {\n  hasMany?: boolean\n  isClearable?: boolean\n  isSortable?: boolean\n  label?: FieldBase['label']\n  name?: string\n  onChange?: (e: string) => void\n  options?: Option[]\n  path?: string\n  value?: string\n  width?: string\n}\n\nconst formatOptions = (options: Option[]): OptionObject[] =>\n  options.map((option) => {\n    if (typeof option === 'object' && (option.value || option.value === '')) {\n      return option\n    }\n\n    return {\n      label: option,\n      value: option,\n    } as OptionObject\n  })\n\nconst SelectField: React.FC<SelectFieldProps> = (props) => {\n  const {\n    name,\n    AfterInput,\n    BeforeInput,\n    CustomDescription,\n    CustomError,\n    CustomLabel,\n    className,\n    descriptionProps,\n    errorProps,\n    hasMany = false,\n    isClearable = true,\n    isSortable = true,\n    label,\n    labelProps,\n    onChange: onChangeFromProps,\n    options: optionsFromProps = [],\n    path: pathFromProps,\n    readOnly: readOnlyFromProps,\n    required,\n    style,\n    validate,\n    width,\n  } = props\n\n  const { i18n } = useTranslation()\n\n  const [options] = useState(formatOptions(optionsFromProps))\n\n  const memoizedValidate: ClientValidate = useCallback(\n    (value, validationOptions) => {\n      if (typeof validate === 'function')\n        return validate(value, { ...validationOptions, hasMany, options, required })\n    },\n    [validate, required, hasMany, options],\n  )\n\n  const { path: pathFromContext, readOnly: readOnlyFromContext } = useFieldProps()\n  const readOnly = readOnlyFromProps || readOnlyFromContext\n\n  const { path, setValue, showError, value } = useField({\n    path: pathFromContext || pathFromProps || name,\n    validate: memoizedValidate,\n  })\n\n  let valueToRender\n\n  if (hasMany && Array.isArray(value)) {\n    valueToRender = value.map((val) => {\n      const matchingOption = options.find((option) => option.value === val)\n      return {\n        label: matchingOption ? getTranslation(matchingOption.label, i18n) : val,\n        value: matchingOption?.value ?? val,\n      }\n    })\n  } else if (value) {\n    const matchingOption = options.find((option) => option.value === value)\n    valueToRender = {\n      label: matchingOption ? getTranslation(matchingOption.label, i18n) : value,\n      value: matchingOption?.value ?? value,\n    }\n  }\n\n  const onChange = useCallback(\n    (selectedOption) => {\n      if (!readOnly) {\n        let newValue\n        if (!selectedOption) {\n          newValue = null\n        } else if (hasMany) {\n          if (Array.isArray(selectedOption)) {\n            newValue = selectedOption.map((option) => option.value)\n          } else {\n            newValue = []\n          }\n        } else {\n          newValue = selectedOption.value\n        }\n\n        if (typeof onChangeFromProps === 'function') {\n          onChangeFromProps(newValue)\n        }\n\n        setValue(newValue)\n      }\n    },\n    [readOnly, hasMany, setValue, onChangeFromProps],\n  )\n\n  return (\n    <div\n      className={[\n        fieldBaseClass,\n        'select',\n        className,\n        showError && 'error',\n        readOnly && 'read-only',\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      id={`field-${path.replace(/\\./g, '__')}`}\n      style={{\n        ...style,\n        width,\n      }}\n    >\n      <FieldError CustomError={CustomError} path={path} {...(errorProps || {})} />\n      <FieldLabel\n        CustomLabel={CustomLabel}\n        label={label}\n        required={required}\n        {...(labelProps || {})}\n      />\n      <div>\n        {BeforeInput}\n        <ReactSelect\n          disabled={readOnly}\n          isClearable={isClearable}\n          isMulti={hasMany}\n          isSortable={isSortable}\n          onChange={onChange}\n          options={options.map((option) => ({\n            ...option,\n            label: getTranslation(option.label, i18n),\n          }))}\n          showError={showError}\n          value={valueToRender as OptionObject}\n        />\n        {AfterInput}\n      </div>\n      {CustomDescription !== undefined ? (\n        CustomDescription\n      ) : (\n        <FieldDescription {...(descriptionProps || {})} />\n      )}\n    </div>\n  )\n}\n\nexport const Select = withCondition(SelectField)\n"],"names":["getTranslation","FieldDescription","FieldError","FieldLabel","useFieldProps","React","useCallback","useState","ReactSelect","useField","withCondition","useTranslation","fieldBaseClass","formatOptions","options","map","option","value","label","SelectField","props","name","AfterInput","BeforeInput","CustomDescription","CustomError","CustomLabel","className","descriptionProps","errorProps","hasMany","isClearable","isSortable","labelProps","onChange","onChangeFromProps","optionsFromProps","path","pathFromProps","readOnly","readOnlyFromProps","required","style","validate","width","i18n","memoizedValidate","validationOptions","pathFromContext","readOnlyFromContext","setValue","showError","valueToRender","Array","isArray","val","matchingOption","find","selectedOption","newValue","div","filter","Boolean","join","id","replace","disabled","isMulti","undefined","Select"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"file":"index.js","names":["React","useCallback","useField","withCondition","SelectInput","formatOptions","options","map","option","value","label","SelectFieldComponent","props","field","name","admin","className","description","isClearable","isSortable","style","width","hasMany","localized","optionsFromProps","required","onChange","onChangeFromProps","path","readOnly","validate","useMemo","memoizedValidate","validationOptions","customComponents","AfterInput","BeforeInput","Description","Error","Label","setValue","showError","selectedOption","newValue","Array","isArray","_jsx","SelectField"],"sources":["../../../src/fields/Select/index.tsx"],"sourcesContent":["'use client'\nimport type {\n  Option,\n  OptionObject,\n  SelectFieldClientComponent,\n  SelectFieldClientProps,\n} from 'payload'\n\nimport React, { useCallback } from 'react'\n\nimport type { ReactSelectAdapterProps } from '../../elements/ReactSelect/types.js'\nimport type { SelectInputProps } from './Input.js'\n\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { SelectInput } from './Input.js'\n\nconst formatOptions = (options: Option[]): OptionObject[] =>\n  options.map((option) => {\n    if (typeof option === 'object' && (option.value || option.value === '')) {\n      return option\n    }\n\n    return {\n      label: option,\n      value: option,\n    } as OptionObject\n  })\n\nconst SelectFieldComponent: SelectFieldClientComponent = (props) => {\n  const {\n    field: {\n      name,\n      admin: {\n        className,\n        description,\n        isClearable = true,\n        isSortable = true,\n        style,\n        width,\n      } = {} as SelectFieldClientProps['field']['admin'],\n      hasMany = false,\n      label,\n      localized,\n      options: optionsFromProps = [],\n      required,\n    },\n    onChange: onChangeFromProps,\n    path,\n    readOnly,\n    validate,\n  } = props\n\n  const options = React.useMemo(() => formatOptions(optionsFromProps), [optionsFromProps])\n\n  const memoizedValidate = useCallback(\n    (value, validationOptions) => {\n      if (typeof validate === 'function') {\n        return validate(value, { ...validationOptions, hasMany, options, required })\n      }\n    },\n    [validate, required, hasMany, options],\n  )\n\n  const {\n    customComponents: { AfterInput, BeforeInput, Description, Error, Label } = {},\n    setValue,\n    showError,\n    value,\n  } = useField({\n    path,\n    validate: memoizedValidate,\n  })\n\n  const onChange: ReactSelectAdapterProps['onChange'] = useCallback(\n    (selectedOption: OptionObject | OptionObject[]) => {\n      if (!readOnly) {\n        let newValue: string | string[] = null\n        if (selectedOption && hasMany) {\n          if (Array.isArray(selectedOption)) {\n            newValue = selectedOption.map((option) => option.value)\n          } else {\n            newValue = []\n          }\n        } else if (selectedOption && !Array.isArray(selectedOption)) {\n          newValue = selectedOption.value\n        }\n\n        if (typeof onChangeFromProps === 'function') {\n          onChangeFromProps(newValue)\n        }\n\n        setValue(newValue)\n      }\n    },\n    [readOnly, hasMany, setValue, onChangeFromProps],\n  )\n\n  return (\n    <SelectInput\n      AfterInput={AfterInput}\n      BeforeInput={BeforeInput}\n      className={className}\n      Description={Description}\n      description={description}\n      Error={Error}\n      hasMany={hasMany}\n      isClearable={isClearable}\n      isSortable={isSortable}\n      Label={Label}\n      label={label}\n      localized={localized}\n      name={name}\n      onChange={onChange}\n      options={options}\n      path={path}\n      readOnly={readOnly}\n      showError={showError}\n      style={style}\n      value={value as string | string[]}\n      width={width}\n    />\n  )\n}\n\nexport const SelectField = withCondition(SelectFieldComponent)\n\nexport { SelectInput, type SelectInputProps }\n"],"mappings":"AAAA;;;AAQA,OAAOA,KAAA,IAASC,WAAW,QAAQ;AAKnC,SAASC,QAAQ,QAAQ;AACzB,SAASC,aAAa,QAAQ;AAC9B,SAASC,WAAW,QAAQ;AAE5B,MAAMC,aAAA,GAAiBC,OAAA,IACrBA,OAAA,CAAQC,GAAG,CAAEC,MAAA;EACX,IAAI,OAAOA,MAAA,KAAW,aAAaA,MAAA,CAAOC,KAAK,IAAID,MAAA,CAAOC,KAAK,KAAK,EAAC,GAAI;IACvE,OAAOD,MAAA;EACT;EAEA,OAAO;IACLE,KAAA,EAAOF,MAAA;IACPC,KAAA,EAAOD;EACT;AACF;AAEF,MAAMG,oBAAA,GAAoDC,KAAA;EACxD,MAAM;IACJC,KAAA,EAAO;MACLC,IAAI;MACJC,KAAA,EAAO;QACLC,SAAS;QACTC,WAAW;QACXC,WAAA,GAAc,IAAI;QAClBC,UAAA,GAAa,IAAI;QACjBC,KAAK;QACLC;MAAK,CACN,GAAG,CAAC,CAA6C;MAClDC,OAAA,GAAU,KAAK;MACfZ,KAAK;MACLa,SAAS;MACTjB,OAAA,EAASkB,gBAAA,GAAmB,EAAE;MAC9BC;IAAQ,CACT;IACDC,QAAA,EAAUC,iBAAiB;IAC3BC,IAAI;IACJC,QAAQ;IACRC;EAAQ,CACT,GAAGlB,KAAA;EAEJ,MAAMN,OAAA,GAAUN,KAAA,CAAM+B,OAAO,CAAC,MAAM1B,aAAA,CAAcmB,gBAAA,GAAmB,CAACA,gBAAA,CAAiB;EAEvF,MAAMQ,gBAAA,GAAmB/B,WAAA,CACvB,CAACQ,KAAA,EAAOwB,iBAAA;IACN,IAAI,OAAOH,QAAA,KAAa,YAAY;MAClC,OAAOA,QAAA,CAASrB,KAAA,EAAO;QAAE,GAAGwB,iBAAiB;QAAEX,OAAA;QAAShB,OAAA;QAASmB;MAAS;IAC5E;EACF,GACA,CAACK,QAAA,EAAUL,QAAA,EAAUH,OAAA,EAAShB,OAAA,CAAQ;EAGxC,MAAM;IACJ4B,gBAAA,EAAkB;MAAEC,UAAU;MAAEC,WAAW;MAAEC,WAAW;MAAEC,KAAK;MAAEC;IAAK,CAAE,GAAG,CAAC,CAAC;IAC7EC,QAAQ;IACRC,SAAS;IACThC,KAAK,EAALA;EAAK,CACN,GAAGP,QAAA,CAAS;IACX0B,IAAA;IACAE,QAAA,EAAUE;EACZ;EAEA,MAAMN,QAAA,GAAgDzB,WAAA,CACnDyC,cAAA;IACC,IAAI,CAACb,QAAA,EAAU;MACb,IAAIc,QAAA,GAA8B;MAClC,IAAID,cAAA,IAAkBpB,OAAA,EAAS;QAC7B,IAAIsB,KAAA,CAAMC,OAAO,CAACH,cAAA,GAAiB;UACjCC,QAAA,GAAWD,cAAA,CAAenC,GAAG,CAAEC,MAAA,IAAWA,MAAA,CAAOC,KAAK;QACxD,OAAO;UACLkC,QAAA,GAAW,EAAE;QACf;MACF,OAAO,IAAID,cAAA,IAAkB,CAACE,KAAA,CAAMC,OAAO,CAACH,cAAA,GAAiB;QAC3DC,QAAA,GAAWD,cAAA,CAAejC,KAAK;MACjC;MAEA,IAAI,OAAOkB,iBAAA,KAAsB,YAAY;QAC3CA,iBAAA,CAAkBgB,QAAA;MACpB;MAEAH,QAAA,CAASG,QAAA;IACX;EACF,GACA,CAACd,QAAA,EAAUP,OAAA,EAASkB,QAAA,EAAUb,iBAAA,CAAkB;EAGlD,oBACEmB,IAAA,CAAC1C,WAAA;IACC+B,UAAA,EAAYA,UAAA;IACZC,WAAA,EAAaA,WAAA;IACbpB,SAAA,EAAWA,SAAA;IACXqB,WAAA,EAAaA,WAAA;IACbpB,WAAA,EAAaA,WAAA;IACbqB,KAAA,EAAOA,KAAA;IACPhB,OAAA,EAASA,OAAA;IACTJ,WAAA,EAAaA,WAAA;IACbC,UAAA,EAAYA,UAAA;IACZoB,KAAA,EAAOA,KAAA;IACP7B,KAAA,EAAOA,KAAA;IACPa,SAAA,EAAWA,SAAA;IACXT,IAAA,EAAMA,IAAA;IACNY,QAAA,EAAUA,QAAA;IACVpB,OAAA,EAASA,OAAA;IACTsB,IAAA,EAAMA,IAAA;IACNC,QAAA,EAAUA,QAAA;IACVY,SAAA,EAAWA,SAAA;IACXrB,KAAA,EAAOA,KAAA;IACPX,KAAA,EAAOA,OAAA;IACPY,KAAA,EAAOA;;AAGb;AAEA,OAAO,MAAM0B,WAAA,GAAc5C,aAAA,CAAcQ,oBAAA;AAEzC,SAASP,WAAW","ignoreList":[]}

package/dist/fields/Select/index.scss

@@ -1,24 +1,26 @@
 @import '../../scss/styles.scss';
 
-.field-type.select {
-  position: relative;
-}
-
-html[data-theme='light'] {
+@layer payload-default {
   .field-type.select {
-    &.error {
-      .rs__control {
-        @include lightInputError;
+    position: relative;
+  }
+
+  html[data-theme='light'] {
+    .field-type.select {
+      &.error {
+        .rs__control {
+          @include lightInputError;
+        }
       }
     }
   }
-}
 
-html[data-theme='dark'] {
-  .field-type.select {
-    &.error {
-      .rs__control {
-        @include darkInputError;
+  html[data-theme='dark'] {
+    .field-type.select {
+      &.error {
+        .rs__control {
+          @include darkInputError;
+        }
       }
     }
   }

package/dist/fields/Tabs/Tab/index.d.ts

@@ -1,11 +1,11 @@
+import type { ClientTab } from 'payload';
 import React from 'react';
-import type { MappedTab } from '../../../providers/ComponentMap/buildComponentMap/types.js';
 import './index.scss';
 type TabProps = {
-    isActive?: boolean;
-    parentPath: string;
-    setIsActive: () => void;
-    tab: MappedTab;
+    readonly isActive?: boolean;
+    readonly parentPath: string;
+    readonly setIsActive: () => void;
+    readonly tab: ClientTab;
 };
 export declare const TabComponent: React.FC<TabProps>;
 export {};

package/dist/fields/Tabs/Tab/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/fields/Tabs/Tab/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAEvC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,4DAA4D,CAAA;AAK3F,OAAO,cAAc,CAAA;AAIrB,KAAK,QAAQ,GAAG;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,UAAU,EAAE,MAAM,CAAA;IAClB,WAAW,EAAE,MAAM,IAAI,CAAA;IACvB,GAAG,EAAE,SAAS,CAAA;CACf,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,QAAQ,CA6B3C,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/fields/Tabs/Tab/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAIxC,OAAO,KAAmB,MAAM,OAAO,CAAA;AAKvC,OAAO,cAAc,CAAA;AAIrB,KAAK,QAAQ,GAAG;IACd,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAC3B,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,WAAW,EAAE,MAAM,IAAI,CAAA;IAChC,QAAQ,CAAC,GAAG,EAAE,SAAS,CAAA;CACxB,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,QAAQ,CA8B3C,CAAA"}