@payloadcms/ui 3.0.0-canary.ff8c8fd → 3.0.0

package/dist/fields/Upload/index.js

@@ -1,150 +1,90 @@
 'use client';
 
-import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx } from "react/jsx-runtime";
-import React, { useCallback, useMemo } from 'react';
-import { useFieldProps } from '../../forms/FieldPropsProvider/index.js';
+import React, { useMemo } from 'react';
 import { useField } from '../../forms/useField/index.js';
 import { withCondition } from '../../forms/withCondition/index.js';
-import { useAuth } from '../../providers/Auth/index.js';
-import { UploadComponentHasMany } from './HasMany/index.js';
-import { UploadInputHasOne } from './HasOne/Input.js';
-import { UploadComponentHasOne } from './HasOne/index.js';
-export { UploadInputHasOne as UploadInput };
+import { useConfig } from '../../providers/Config/index.js';
+import './index.scss';
+import { mergeFieldStyles } from '../mergeFieldStyles.js';
+import { UploadInput } from './Input.js';
+export { UploadInput } from './Input.js';
 export const baseClass = 'upload';
-const UploadComponent = props => {
-  const $ = _c(22);
+export function UploadComponent(props) {
   const {
-    field: t0,
-    readOnly: readOnlyFromTopLevelProps,
+    field,
+    field: {
+      admin: {
+        allowCreate,
+        className,
+        description,
+        isSortable
+      } = {},
+      hasMany,
+      label,
+      localized,
+      maxRows,
+      relationTo,
+      required
+    },
+    path,
+    readOnly,
     validate
   } = props;
   const {
-    _path: pathFromProps,
-    admin: t1,
-    hasMany,
-    relationTo,
-    required
-  } = t0;
-  let t2;
-  if ($[0] !== t1) {
-    t2 = t1 === undefined ? {} : t1;
-    $[0] = t1;
-    $[1] = t2;
-  } else {
-    t2 = $[1];
-  }
-  const {
-    readOnly: readOnlyFromAdmin
-  } = t2;
-  const readOnlyFromProps = readOnlyFromTopLevelProps || readOnlyFromAdmin;
-  const {
-    permissions
-  } = useAuth();
-  let t3;
-  if ($[2] !== validate || $[3] !== required) {
-    t3 = (value, options) => {
-      if (typeof validate === "function") {
-        return validate(value, {
-          ...options,
-          required
-        });
-      }
-    };
-    $[2] = validate;
-    $[3] = required;
-    $[4] = t3;
-  } else {
-    t3 = $[4];
-  }
-  const memoizedValidate = t3;
-  const {
-    path: pathFromContext,
-    readOnly: readOnlyFromContext
-  } = useFieldProps();
-  let t4;
-  bb0: {
-    if (typeof relationTo === "string") {
-      if (permissions?.collections && permissions.collections?.[relationTo]?.create) {
-        if (permissions.collections[relationTo].create?.permission === true) {
-          t4 = true;
-          break bb0;
-        }
-      }
-    }
-    t4 = false;
-  }
-  const canCreate = t4;
-  const t5 = pathFromContext ?? pathFromProps;
-  let t6;
-  if ($[5] !== t5 || $[6] !== memoizedValidate) {
-    t6 = {
-      path: t5,
-      validate: memoizedValidate
-    };
-    $[5] = t5;
-    $[6] = memoizedValidate;
-    $[7] = t6;
-  } else {
-    t6 = $[7];
-  }
-  const fieldHookResult = useField(t6);
-  let t7;
-  t7 = fieldHookResult.setValue;
-  const setValue = t7;
-  const disabled = readOnlyFromProps || readOnlyFromContext || fieldHookResult.formProcessing || fieldHookResult.formInitializing;
-  let t8;
-  if ($[8] !== setValue) {
-    t8 = incomingValue => {
-      const incomingID = incomingValue?.id || incomingValue;
-      setValue(incomingID);
-    };
-    $[8] = setValue;
-    $[9] = t8;
-  } else {
-    t8 = $[9];
-  }
-  const onChange = t8;
-  if (hasMany) {
-    let t9;
-    if ($[10] !== props || $[11] !== canCreate || $[12] !== disabled || $[13] !== fieldHookResult || $[14] !== onChange) {
-      t9 = _jsx(UploadComponentHasMany, {
-        ...props,
-        canCreate,
-        disabled,
-        fieldHookResult,
-        onChange
+    config
+  } = useConfig();
+  const memoizedValidate = React.useCallback((value, options) => {
+    if (typeof validate === 'function') {
+      return validate(value, {
+        ...options,
+        required
       });
-      $[10] = props;
-      $[11] = canCreate;
-      $[12] = disabled;
-      $[13] = fieldHookResult;
-      $[14] = onChange;
-      $[15] = t9;
-    } else {
-      t9 = $[15];
     }
-    return t9;
-  }
-  let t9;
-  if ($[16] !== props || $[17] !== canCreate || $[18] !== disabled || $[19] !== fieldHookResult || $[20] !== onChange) {
-    t9 = _jsx(UploadComponentHasOne, {
-      ...props,
-      canCreate,
-      disabled,
-      fieldHookResult,
-      onChange
-    });
-    $[16] = props;
-    $[17] = canCreate;
-    $[18] = disabled;
-    $[19] = fieldHookResult;
-    $[20] = onChange;
-    $[21] = t9;
-  } else {
-    t9 = $[21];
-  }
-  return t9;
-};
+  }, [validate, required]);
+  const {
+    customComponents: {
+      AfterInput,
+      BeforeInput,
+      Description,
+      Error,
+      Label
+    } = {},
+    filterOptions,
+    setValue,
+    showError,
+    value: value_0
+  } = useField({
+    path,
+    validate: memoizedValidate
+  });
+  const styles = useMemo(() => mergeFieldStyles(field), [field]);
+  return /*#__PURE__*/_jsx(UploadInput, {
+    AfterInput: AfterInput,
+    allowCreate: allowCreate !== false,
+    api: config.routes.api,
+    BeforeInput: BeforeInput,
+    className: className,
+    Description: Description,
+    description: description,
+    Error: Error,
+    filterOptions: filterOptions,
+    hasMany: hasMany,
+    isSortable: isSortable,
+    label: label,
+    Label: Label,
+    localized: localized,
+    maxRows: maxRows,
+    onChange: setValue,
+    path: path,
+    readOnly: readOnly,
+    relationTo: relationTo,
+    required: required,
+    serverURL: config.serverURL,
+    showError: showError,
+    style: styles,
+    value: value_0
+  });
+}
 export const UploadField = withCondition(UploadComponent);
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useCallback","useMemo","useFieldProps","useField","withCondition","useAuth","UploadComponentHasMany","UploadInputHasOne","UploadComponentHasOne","UploadInput","baseClass","UploadComponent","props","$","field","t0","readOnly","readOnlyFromTopLevelProps","validate","_path","pathFromProps","admin","t1","hasMany","relationTo","required","t2","undefined","readOnlyFromAdmin","readOnlyFromProps","permissions","t3","value","options","memoizedValidate","path","pathFromContext","readOnlyFromContext","t4","bb0","collections","create","permission","canCreate","t5","t6","fieldHookResult","t7","setValue","disabled","formProcessing","formInitializing","t8","incomingValue","incomingID","id","onChange","t9","_jsx","UploadField"],"sources":["../../../src/fields/Upload/index.tsx"],"sourcesContent":["'use client'\n\nimport type { UploadFieldProps } from 'payload'\n\nimport React, { useCallback, useMemo } from 'react'\n\nimport type { UploadInputProps } from './HasOne/Input.js'\n\nimport { useFieldProps } from '../../forms/FieldPropsProvider/index.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { useAuth } from '../../providers/Auth/index.js'\nimport { UploadComponentHasMany } from './HasMany/index.js'\nimport { UploadInputHasOne } from './HasOne/Input.js'\nimport { UploadComponentHasOne } from './HasOne/index.js'\n\nexport { UploadFieldProps, UploadInputHasOne as UploadInput }\nexport type { UploadInputProps }\n\nexport const baseClass = 'upload'\n\nconst UploadComponent: React.FC<UploadFieldProps> = (props) => {\n  const {\n    field: {\n      _path: pathFromProps,\n      admin: { readOnly: readOnlyFromAdmin } = {},\n      hasMany,\n      relationTo,\n      required,\n    },\n    readOnly: readOnlyFromTopLevelProps,\n    validate,\n  } = props\n\n  const readOnlyFromProps = readOnlyFromTopLevelProps || readOnlyFromAdmin\n\n  const { permissions } = useAuth()\n\n  const memoizedValidate = useCallback(\n    (value, options) => {\n      if (typeof validate === 'function') {\n        return validate(value, { ...options, required })\n      }\n    },\n    [validate, required],\n  )\n\n  const { path: pathFromContext, readOnly: readOnlyFromContext } = useFieldProps()\n\n  // Checks if the user has permissions to create a new document in the related collection\n  const canCreate = useMemo(() => {\n    if (typeof relationTo === 'string') {\n      if (permissions?.collections && permissions.collections?.[relationTo]?.create) {\n        if (permissions.collections[relationTo].create?.permission === true) {\n          return true\n        }\n      }\n    }\n\n    return false\n  }, [relationTo, permissions])\n\n  const fieldHookResult = useField<string | string[]>({\n    path: pathFromContext ?? pathFromProps,\n    validate: memoizedValidate,\n  })\n\n  const setValue = useMemo(() => fieldHookResult.setValue, [fieldHookResult])\n\n  const disabled =\n    readOnlyFromProps ||\n    readOnlyFromContext ||\n    fieldHookResult.formProcessing ||\n    fieldHookResult.formInitializing\n\n  const onChange = useCallback(\n    (incomingValue) => {\n      const incomingID = incomingValue?.id || incomingValue\n      setValue(incomingID)\n    },\n    [setValue],\n  )\n\n  if (hasMany) {\n    return (\n      <UploadComponentHasMany\n        {...props}\n        canCreate={canCreate}\n        disabled={disabled}\n        // Note: the below TS error is thrown bc the field hook return result varies based on `hasMany`\n        // @ts-expect-error\n        fieldHookResult={fieldHookResult}\n        onChange={onChange}\n      />\n    )\n  }\n\n  return (\n    <UploadComponentHasOne\n      {...props}\n      canCreate={canCreate}\n      disabled={disabled}\n      // Note: the below TS error is thrown bc the field hook return result varies based on `hasMany`\n      // @ts-expect-error\n      fieldHookResult={fieldHookResult}\n      onChange={onChange}\n    />\n  )\n}\n\nexport const UploadField = withCondition(UploadComponent)\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","useMemo","useField","withCondition","useConfig","mergeFieldStyles","UploadInput","baseClass","UploadComponent","props","field","admin","allowCreate","className","description","isSortable","hasMany","label","localized","maxRows","relationTo","required","path","readOnly","validate","config","memoizedValidate","useCallback","value","options","customComponents","AfterInput","BeforeInput","Description","Error","Label","filterOptions","setValue","showError","styles","_jsx","api","routes","onChange","serverURL","style","UploadField"],"sources":["../../../src/fields/Upload/index.tsx"],"sourcesContent":["'use client'\n\nimport type { UploadFieldClientProps } from 'payload'\n\nimport React, { useMemo } from 'react'\n\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport './index.scss'\nimport { mergeFieldStyles } from '../mergeFieldStyles.js'\nimport { UploadInput } from './Input.js'\n\nexport { UploadInput } from './Input.js'\nexport type { UploadInputProps } from './Input.js'\n\nexport const baseClass = 'upload'\n\nexport function UploadComponent(props: UploadFieldClientProps) {\n  const {\n    field,\n    field: {\n      admin: { allowCreate, className, description, isSortable } = {},\n      hasMany,\n      label,\n      localized,\n      maxRows,\n      relationTo,\n      required,\n    },\n    path,\n    readOnly,\n    validate,\n  } = props\n\n  const { config } = useConfig()\n\n  const memoizedValidate = React.useCallback(\n    (value, options) => {\n      if (typeof validate === 'function') {\n        return validate(value, { ...options, required })\n      }\n    },\n    [validate, required],\n  )\n\n  const {\n    customComponents: { AfterInput, BeforeInput, Description, Error, Label } = {},\n    filterOptions,\n    setValue,\n    showError,\n    value,\n  } = useField<string | string[]>({\n    path,\n    validate: memoizedValidate,\n  })\n\n  const styles = useMemo(() => mergeFieldStyles(field), [field])\n\n  return (\n    <UploadInput\n      AfterInput={AfterInput}\n      allowCreate={allowCreate !== false}\n      api={config.routes.api}\n      BeforeInput={BeforeInput}\n      className={className}\n      Description={Description}\n      description={description}\n      Error={Error}\n      filterOptions={filterOptions}\n      hasMany={hasMany}\n      isSortable={isSortable}\n      label={label}\n      Label={Label}\n      localized={localized}\n      maxRows={maxRows}\n      onChange={setValue}\n      path={path}\n      readOnly={readOnly}\n      relationTo={relationTo}\n      required={required}\n      serverURL={config.serverURL}\n      showError={showError}\n      style={styles}\n      value={value}\n    />\n  )\n}\n\nexport const UploadField = withCondition(UploadComponent)\n"],"mappings":"AAAA;;;AAIA,OAAOA,KAAA,IAASC,OAAO,QAAQ;AAE/B,SAASC,QAAQ,QAAQ;AACzB,SAASC,aAAa,QAAQ;AAC9B,SAASC,SAAS,QAAQ;AAC1B,OAAO;AACP,SAASC,gBAAgB,QAAQ;AACjC,SAASC,WAAW,QAAQ;AAE5B,SAASA,WAAW,QAAQ;AAG5B,OAAO,MAAMC,SAAA,GAAY;AAEzB,OAAO,SAASC,gBAAgBC,KAA6B;EAC3D,MAAM;IACJC,KAAK;IACLA,KAAA,EAAO;MACLC,KAAA,EAAO;QAAEC,WAAW;QAAEC,SAAS;QAAEC,WAAW;QAAEC;MAAU,CAAE,GAAG,CAAC,CAAC;MAC/DC,OAAO;MACPC,KAAK;MACLC,SAAS;MACTC,OAAO;MACPC,UAAU;MACVC;IAAQ,CACT;IACDC,IAAI;IACJC,QAAQ;IACRC;EAAQ,CACT,GAAGf,KAAA;EAEJ,MAAM;IAAEgB;EAAM,CAAE,GAAGrB,SAAA;EAEnB,MAAMsB,gBAAA,GAAmB1B,KAAA,CAAM2B,WAAW,CACxC,CAACC,KAAA,EAAOC,OAAA;IACN,IAAI,OAAOL,QAAA,KAAa,YAAY;MAClC,OAAOA,QAAA,CAASI,KAAA,EAAO;QAAE,GAAGC,OAAO;QAAER;MAAS;IAChD;EACF,GACA,CAACG,QAAA,EAAUH,QAAA,CAAS;EAGtB,MAAM;IACJS,gBAAA,EAAkB;MAAEC,UAAU;MAAEC,WAAW;MAAEC,WAAW;MAAEC,KAAK;MAAEC;IAAK,CAAE,GAAG,CAAC,CAAC;IAC7EC,aAAa;IACbC,QAAQ;IACRC,SAAS;IACTV,KAAK,EAALA;EAAK,CACN,GAAG1B,QAAA,CAA4B;IAC9BoB,IAAA;IACAE,QAAA,EAAUE;EACZ;EAEA,MAAMa,MAAA,GAAStC,OAAA,CAAQ,MAAMI,gBAAA,CAAiBK,KAAA,GAAQ,CAACA,KAAA,CAAM;EAE7D,oBACE8B,IAAA,CAAClC,WAAA;IACCyB,UAAA,EAAYA,UAAA;IACZnB,WAAA,EAAaA,WAAA,KAAgB;IAC7B6B,GAAA,EAAKhB,MAAA,CAAOiB,MAAM,CAACD,GAAG;IACtBT,WAAA,EAAaA,WAAA;IACbnB,SAAA,EAAWA,SAAA;IACXoB,WAAA,EAAaA,WAAA;IACbnB,WAAA,EAAaA,WAAA;IACboB,KAAA,EAAOA,KAAA;IACPE,aAAA,EAAeA,aAAA;IACfpB,OAAA,EAASA,OAAA;IACTD,UAAA,EAAYA,UAAA;IACZE,KAAA,EAAOA,KAAA;IACPkB,KAAA,EAAOA,KAAA;IACPjB,SAAA,EAAWA,SAAA;IACXC,OAAA,EAASA,OAAA;IACTwB,QAAA,EAAUN,QAAA;IACVf,IAAA,EAAMA,IAAA;IACNC,QAAA,EAAUA,QAAA;IACVH,UAAA,EAAYA,UAAA;IACZC,QAAA,EAAUA,QAAA;IACVuB,SAAA,EAAWnB,MAAA,CAAOmB,SAAS;IAC3BN,SAAA,EAAWA,SAAA;IACXO,KAAA,EAAON,MAAA;IACPX,KAAA,EAAOA;;AAGb;AAEA,OAAO,MAAMkB,WAAA,GAAc3C,aAAA,CAAcK,eAAA","ignoreList":[]}

package/dist/fields/Upload/index.scss

@@ -0,0 +1,64 @@
+@import '../../scss/styles.scss';
+
+@layer payload-default {
+  .upload {
+    &__dropzoneAndUpload {
+      display: flex;
+      flex-direction: column;
+      gap: calc(var(--base) / 4);
+    }
+
+    &__dropzoneContent {
+      display: flex;
+      flex-wrap: wrap;
+      gap: base(0.4);
+      justify-content: space-between;
+      width: 100%;
+    }
+
+    &__dropzoneContent__buttons {
+      display: flex;
+      gap: calc(var(--base) / 2);
+      position: relative;
+      left: -2px;
+
+      .btn .btn__content {
+        gap: calc(var(--base) / 5);
+      }
+
+      .btn__label {
+        font-weight: 100;
+      }
+    }
+
+    &__dropzoneContent__orText {
+      color: var(--theme-elevation-500);
+      text-transform: lowercase;
+    }
+
+    &__dragAndDropText {
+      flex-shrink: 0;
+      margin: 0;
+      text-transform: lowercase;
+      align-self: center;
+      color: var(--theme-elevation-500);
+    }
+
+    &__loadingRows {
+      display: flex;
+      flex-direction: column;
+      gap: calc(var(--base) / 4);
+    }
+
+    .shimmer-effect {
+      border-radius: var(--style-radius-s);
+      border: 1px solid var(--theme-border-color);
+    }
+
+    @include small-break {
+      &__dragAndDropText {
+        display: none;
+      }
+    }
+  }
+}

package/dist/fields/Upload/types.d.ts

@@ -0,0 +1,4 @@
+import type { PaginatedDocs } from 'payload';
+export type PopulateDocs = (ids: (number | string)[], relatedCollectionSlug: string) => Promise<null | PaginatedDocs>;
+export type ReloadDoc = (docID: number | string, collectionSlug: string) => Promise<void>;
+//# sourceMappingURL=types.d.ts.map

package/dist/fields/Upload/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/fields/Upload/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAE5C,MAAM,MAAM,YAAY,GAAG,CACzB,GAAG,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,EACxB,qBAAqB,EAAE,MAAM,KAC1B,OAAO,CAAC,IAAI,GAAG,aAAa,CAAC,CAAA;AAElC,MAAM,MAAM,SAAS,GAAG,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,cAAc,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA"}

package/dist/fields/Upload/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","names":[],"sources":["../../../src/fields/Upload/types.ts"],"sourcesContent":["import type { PaginatedDocs } from 'payload'\n\nexport type PopulateDocs = (\n  ids: (number | string)[],\n  relatedCollectionSlug: string,\n) => Promise<null | PaginatedDocs>\n\nexport type ReloadDoc = (docID: number | string, collectionSlug: string) => Promise<void>\n"],"mappings":"AAOA","ignoreList":[]}

package/dist/fields/index.d.ts

@@ -1,8 +1,19 @@
-import type { FieldTypes } from 'payload';
+import type { ClientFieldBase, FieldTypes, GenericDescriptionProps, GenericErrorProps, GenericLabelProps, HiddenFieldProps } from 'payload';
 import type React from 'react';
+import type { ConfirmPasswordFieldProps } from './ConfirmPassword/index.js';
 export * from './shared/index.js';
 export type FieldTypesComponents = {
-    [K in 'confirmPassword' | 'hidden' | 'password' | FieldTypes]: React.FC;
+    [K in 'password' | FieldTypes]: React.FC<ClientFieldBase>;
+} & {
+    confirmPassword: React.FC<ConfirmPasswordFieldProps>;
+    hidden: React.FC<HiddenFieldProps>;
 };
 export declare const fieldComponents: FieldTypesComponents;
+export type FieldComponentsWithSlots = {
+    Description: React.FC<GenericDescriptionProps>;
+    Error: React.FC<GenericErrorProps>;
+    Label: React.FC<GenericLabelProps>;
+    RowLabel: React.FC;
+} & FieldTypesComponents;
+export declare const allFieldComponents: FieldComponentsWithSlots;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/fields/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AACzC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AA2B9B,cAAc,mBAAmB,CAAA;AAEjC,MAAM,MAAM,oBAAoB,GAAG;KAChC,CAAC,IAAI,iBAAiB,GAAG,QAAQ,GAAG,UAAU,GAAG,UAAU,GAAG,KAAK,CAAC,EAAE;CACxE,CAAA;AAED,eAAO,MAAM,eAAe,EAAE,oBAyB7B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/fields/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,eAAe,EACf,UAAU,EACV,uBAAuB,EACvB,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EACjB,MAAM,SAAS,CAAA;AAChB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,4BAA4B,CAAA;AAgC3E,cAAc,mBAAmB,CAAA;AAEjC,MAAM,MAAM,oBAAoB,GAAG;KAChC,CAAC,IAAI,UAAU,GAAG,UAAU,GAAG,KAAK,CAAC,EAAE,CAAC,eAAe,CAAC;CAC1D,GAAG;IACF,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CAAC,CAAA;IACpD,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAA;CACnC,CAAA;AAED,eAAO,MAAM,eAAe,EAAE,oBA0B7B,CAAA;AAED,MAAM,MAAM,wBAAwB,GAAG;IACrC,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAAC,CAAA;IAC9C,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAA;IAClC,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAA;IAClC,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAA;CACnB,GAAG,oBAAoB,CAAA;AAExB,eAAO,MAAM,kBAAkB,EAAE,wBAMhC,CAAA"}

package/dist/fields/index.js

@@ -1,5 +1,6 @@
 'use client';
 
+import { RowLabel } from '../forms/RowLabel/index.js';
 import { ArrayField } from './Array/index.js';
 import { BlocksField } from './Blocks/index.js';
 import { CheckboxField } from './Checkbox/index.js';
@@ -8,8 +9,12 @@ import { CollapsibleField } from './Collapsible/index.js';
 import { ConfirmPasswordField } from './ConfirmPassword/index.js';
 import { DateTimeField } from './DateTime/index.js';
 import { EmailField } from './Email/index.js';
+import { FieldDescription } from './FieldDescription/index.js';
+import { FieldError } from './FieldError/index.js';
+import { FieldLabel } from './FieldLabel/index.js';
 import { GroupField } from './Group/index.js';
 import { HiddenField } from './Hidden/index.js';
+import { JoinField } from './Join/index.js';
 import { JSONField } from './JSON/index.js';
 import { NumberField } from './Number/index.js';
 import { PasswordField } from './Password/index.js';
@@ -36,6 +41,7 @@ export const fieldComponents = {
   email: EmailField,
   group: GroupField,
   hidden: HiddenField,
+  join: JoinField,
   json: JSONField,
   number: NumberField,
   password: PasswordField,
@@ -51,4 +57,11 @@ export const fieldComponents = {
   ui: UIField,
   upload: UploadField
 };
+export const allFieldComponents = {
+  ...fieldComponents,
+  Description: FieldDescription,
+  Error: FieldError,
+  Label: FieldLabel,
+  RowLabel
+};
 //# sourceMappingURL=index.js.map

package/dist/fields/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ArrayField","BlocksField","CheckboxField","CodeField","CollapsibleField","ConfirmPasswordField","DateTimeField","EmailField","GroupField","HiddenField","JSONField","NumberField","PasswordField","PointField","RadioGroupField","RelationshipField","RichTextField","RowField","SelectField","TabsField","TextField","TextareaField","UIField","UploadField","fieldComponents","array","blocks","checkbox","code","collapsible","confirmPassword","date","email","group","hidden","json","number","password","point","radio","relationship","richText","row","select","tabs","text","textarea","ui","upload"],"sources":["../../src/fields/index.tsx"],"sourcesContent":["'use client'\nimport type { FieldTypes } from 'payload'\nimport type React from 'react'\n\nimport { ArrayField } from './Array/index.js'\nimport { BlocksField } from './Blocks/index.js'\nimport { CheckboxField } from './Checkbox/index.js'\nimport { CodeField } from './Code/index.js'\nimport { CollapsibleField } from './Collapsible/index.js'\nimport { ConfirmPasswordField } from './ConfirmPassword/index.js'\nimport { DateTimeField } from './DateTime/index.js'\nimport { EmailField } from './Email/index.js'\nimport { GroupField } from './Group/index.js'\nimport { HiddenField } from './Hidden/index.js'\nimport { JSONField } from './JSON/index.js'\nimport { NumberField } from './Number/index.js'\nimport { PasswordField } from './Password/index.js'\nimport { PointField } from './Point/index.js'\nimport { RadioGroupField } from './RadioGroup/index.js'\nimport { RelationshipField } from './Relationship/index.js'\nimport { RichTextField } from './RichText/index.js'\nimport { RowField } from './Row/index.js'\nimport { SelectField } from './Select/index.js'\nimport { TabsField } from './Tabs/index.js'\nimport { TextField } from './Text/index.js'\nimport { TextareaField } from './Textarea/index.js'\nimport { UIField } from './UI/index.js'\nimport { UploadField } from './Upload/index.js'\n\nexport * from './shared/index.js'\n\nexport type FieldTypesComponents = {\n  [K in 'confirmPassword' | 'hidden' | 'password' | FieldTypes]: React.FC\n}\n\nexport const fieldComponents: FieldTypesComponents = {\n  array: ArrayField,\n  blocks: BlocksField,\n  checkbox: CheckboxField,\n  code: CodeField,\n  collapsible: CollapsibleField,\n  confirmPassword: ConfirmPasswordField,\n  date: DateTimeField,\n  email: EmailField,\n  group: GroupField,\n  hidden: HiddenField,\n  json: JSONField,\n  number: NumberField,\n  password: PasswordField,\n  point: PointField,\n  radio: RadioGroupField,\n  relationship: RelationshipField,\n  richText: RichTextField,\n  row: RowField,\n  select: SelectField,\n  tabs: TabsField,\n  text: TextField,\n  textarea: TextareaField,\n  ui: UIField,\n  upload: UploadField,\n}\n"],"mappings":"AAAA;;AAIA,SAASA,UAAU,QAAQ;AAC3B,SAASC,WAAW,QAAQ;AAC5B,SAASC,aAAa,QAAQ;AAC9B,SAASC,SAAS,QAAQ;AAC1B,SAASC,gBAAgB,QAAQ;AACjC,SAASC,oBAAoB,QAAQ;AACrC,SAASC,aAAa,QAAQ;AAC9B,SAASC,UAAU,QAAQ;AAC3B,SAASC,UAAU,QAAQ;AAC3B,SAASC,WAAW,QAAQ;AAC5B,SAASC,SAAS,QAAQ;AAC1B,SAASC,WAAW,QAAQ;AAC5B,SAASC,aAAa,QAAQ;AAC9B,SAASC,UAAU,QAAQ;AAC3B,SAASC,eAAe,QAAQ;AAChC,SAASC,iBAAiB,QAAQ;AAClC,SAASC,aAAa,QAAQ;AAC9B,SAASC,QAAQ,QAAQ;AACzB,SAASC,WAAW,QAAQ;AAC5B,SAASC,SAAS,QAAQ;AAC1B,SAASC,SAAS,QAAQ;AAC1B,SAASC,aAAa,QAAQ;AAC9B,SAASC,OAAO,QAAQ;AACxB,SAASC,WAAW,QAAQ;AAE5B,cAAc;AAMd,OAAO,MAAMC,eAAA,GAAwC;EACnDC,KAAA,EAAOzB,UAAA;EACP0B,MAAA,EAAQzB,WAAA;EACR0B,QAAA,EAAUzB,aAAA;EACV0B,IAAA,EAAMzB,SAAA;EACN0B,WAAA,EAAazB,gBAAA;EACb0B,eAAA,EAAiBzB,oBAAA;EACjB0B,IAAA,EAAMzB,aAAA;EACN0B,KAAA,EAAOzB,UAAA;EACP0B,KAAA,EAAOzB,UAAA;EACP0B,MAAA,EAAQzB,WAAA;EACR0B,IAAA,EAAMzB,SAAA;EACN0B,MAAA,EAAQzB,WAAA;EACR0B,QAAA,EAAUzB,aAAA;EACV0B,KAAA,EAAOzB,UAAA;EACP0B,KAAA,EAAOzB,eAAA;EACP0B,YAAA,EAAczB,iBAAA;EACd0B,QAAA,EAAUzB,aAAA;EACV0B,GAAA,EAAKzB,QAAA;EACL0B,MAAA,EAAQzB,WAAA;EACR0B,IAAA,EAAMzB,SAAA;EACN0B,IAAA,EAAMzB,SAAA;EACN0B,QAAA,EAAUzB,aAAA;EACV0B,EAAA,EAAIzB,OAAA;EACJ0B,MAAA,EAAQzB;AACV","ignoreList":[]}
+{"version":3,"file":"index.js","names":["RowLabel","ArrayField","BlocksField","CheckboxField","CodeField","CollapsibleField","ConfirmPasswordField","DateTimeField","EmailField","FieldDescription","FieldError","FieldLabel","GroupField","HiddenField","JoinField","JSONField","NumberField","PasswordField","PointField","RadioGroupField","RelationshipField","RichTextField","RowField","SelectField","TabsField","TextField","TextareaField","UIField","UploadField","fieldComponents","array","blocks","checkbox","code","collapsible","confirmPassword","date","email","group","hidden","join","json","number","password","point","radio","relationship","richText","row","select","tabs","text","textarea","ui","upload","allFieldComponents","Description","Error","Label"],"sources":["../../src/fields/index.tsx"],"sourcesContent":["'use client'\nimport type {\n  ClientFieldBase,\n  FieldTypes,\n  GenericDescriptionProps,\n  GenericErrorProps,\n  GenericLabelProps,\n  HiddenFieldProps,\n} from 'payload'\nimport type React from 'react'\n\nimport type { ConfirmPasswordFieldProps } from './ConfirmPassword/index.js'\n\nimport { RowLabel } from '../forms/RowLabel/index.js'\nimport { ArrayField } from './Array/index.js'\nimport { BlocksField } from './Blocks/index.js'\nimport { CheckboxField } from './Checkbox/index.js'\nimport { CodeField } from './Code/index.js'\nimport { CollapsibleField } from './Collapsible/index.js'\nimport { ConfirmPasswordField } from './ConfirmPassword/index.js'\nimport { DateTimeField } from './DateTime/index.js'\nimport { EmailField } from './Email/index.js'\nimport { FieldDescription } from './FieldDescription/index.js'\nimport { FieldError } from './FieldError/index.js'\nimport { FieldLabel } from './FieldLabel/index.js'\nimport { GroupField } from './Group/index.js'\nimport { HiddenField } from './Hidden/index.js'\nimport { JoinField } from './Join/index.js'\nimport { JSONField } from './JSON/index.js'\nimport { NumberField } from './Number/index.js'\nimport { PasswordField } from './Password/index.js'\nimport { PointField } from './Point/index.js'\nimport { RadioGroupField } from './RadioGroup/index.js'\nimport { RelationshipField } from './Relationship/index.js'\nimport { RichTextField } from './RichText/index.js'\nimport { RowField } from './Row/index.js'\nimport { SelectField } from './Select/index.js'\nimport { TabsField } from './Tabs/index.js'\nimport { TextField } from './Text/index.js'\nimport { TextareaField } from './Textarea/index.js'\nimport { UIField } from './UI/index.js'\nimport { UploadField } from './Upload/index.js'\n\nexport * from './shared/index.js'\n\nexport type FieldTypesComponents = {\n  [K in 'password' | FieldTypes]: React.FC<ClientFieldBase>\n} & {\n  confirmPassword: React.FC<ConfirmPasswordFieldProps>\n  hidden: React.FC<HiddenFieldProps>\n}\n\nexport const fieldComponents: FieldTypesComponents = {\n  array: ArrayField,\n  blocks: BlocksField,\n  checkbox: CheckboxField,\n  code: CodeField,\n  collapsible: CollapsibleField,\n  confirmPassword: ConfirmPasswordField,\n  date: DateTimeField,\n  email: EmailField,\n  group: GroupField,\n  hidden: HiddenField,\n  join: JoinField,\n  json: JSONField,\n  number: NumberField,\n  password: PasswordField,\n  point: PointField,\n  radio: RadioGroupField,\n  relationship: RelationshipField,\n  richText: RichTextField,\n  row: RowField,\n  select: SelectField,\n  tabs: TabsField,\n  text: TextField,\n  textarea: TextareaField,\n  ui: UIField,\n  upload: UploadField,\n}\n\nexport type FieldComponentsWithSlots = {\n  Description: React.FC<GenericDescriptionProps>\n  Error: React.FC<GenericErrorProps>\n  Label: React.FC<GenericLabelProps>\n  RowLabel: React.FC\n} & FieldTypesComponents\n\nexport const allFieldComponents: FieldComponentsWithSlots = {\n  ...fieldComponents,\n  Description: FieldDescription,\n  Error: FieldError,\n  Label: FieldLabel,\n  RowLabel,\n}\n"],"mappings":"AAAA;;AAaA,SAASA,QAAQ,QAAQ;AACzB,SAASC,UAAU,QAAQ;AAC3B,SAASC,WAAW,QAAQ;AAC5B,SAASC,aAAa,QAAQ;AAC9B,SAASC,SAAS,QAAQ;AAC1B,SAASC,gBAAgB,QAAQ;AACjC,SAASC,oBAAoB,QAAQ;AACrC,SAASC,aAAa,QAAQ;AAC9B,SAASC,UAAU,QAAQ;AAC3B,SAASC,gBAAgB,QAAQ;AACjC,SAASC,UAAU,QAAQ;AAC3B,SAASC,UAAU,QAAQ;AAC3B,SAASC,UAAU,QAAQ;AAC3B,SAASC,WAAW,QAAQ;AAC5B,SAASC,SAAS,QAAQ;AAC1B,SAASC,SAAS,QAAQ;AAC1B,SAASC,WAAW,QAAQ;AAC5B,SAASC,aAAa,QAAQ;AAC9B,SAASC,UAAU,QAAQ;AAC3B,SAASC,eAAe,QAAQ;AAChC,SAASC,iBAAiB,QAAQ;AAClC,SAASC,aAAa,QAAQ;AAC9B,SAASC,QAAQ,QAAQ;AACzB,SAASC,WAAW,QAAQ;AAC5B,SAASC,SAAS,QAAQ;AAC1B,SAASC,SAAS,QAAQ;AAC1B,SAASC,aAAa,QAAQ;AAC9B,SAASC,OAAO,QAAQ;AACxB,SAASC,WAAW,QAAQ;AAE5B,cAAc;AASd,OAAO,MAAMC,eAAA,GAAwC;EACnDC,KAAA,EAAO7B,UAAA;EACP8B,MAAA,EAAQ7B,WAAA;EACR8B,QAAA,EAAU7B,aAAA;EACV8B,IAAA,EAAM7B,SAAA;EACN8B,WAAA,EAAa7B,gBAAA;EACb8B,eAAA,EAAiB7B,oBAAA;EACjB8B,IAAA,EAAM7B,aAAA;EACN8B,KAAA,EAAO7B,UAAA;EACP8B,KAAA,EAAO1B,UAAA;EACP2B,MAAA,EAAQ1B,WAAA;EACR2B,IAAA,EAAM1B,SAAA;EACN2B,IAAA,EAAM1B,SAAA;EACN2B,MAAA,EAAQ1B,WAAA;EACR2B,QAAA,EAAU1B,aAAA;EACV2B,KAAA,EAAO1B,UAAA;EACP2B,KAAA,EAAO1B,eAAA;EACP2B,YAAA,EAAc1B,iBAAA;EACd2B,QAAA,EAAU1B,aAAA;EACV2B,GAAA,EAAK1B,QAAA;EACL2B,MAAA,EAAQ1B,WAAA;EACR2B,IAAA,EAAM1B,SAAA;EACN2B,IAAA,EAAM1B,SAAA;EACN2B,QAAA,EAAU1B,aAAA;EACV2B,EAAA,EAAI1B,OAAA;EACJ2B,MAAA,EAAQ1B;AACV;AASA,OAAO,MAAM2B,kBAAA,GAA+C;EAC1D,GAAG1B,eAAe;EAClB2B,WAAA,EAAa/C,gBAAA;EACbgD,KAAA,EAAO/C,UAAA;EACPgD,KAAA,EAAO/C,UAAA;EACPX;AACF","ignoreList":[]}

package/dist/fields/mergeFieldStyles.d.ts

@@ -0,0 +1,3 @@
+import type { ClientField } from 'payload';
+export declare const mergeFieldStyles: (field: ClientField | Omit<ClientField, "type">) => React.CSSProperties;
+//# sourceMappingURL=mergeFieldStyles.d.ts.map

package/dist/fields/mergeFieldStyles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mergeFieldStyles.d.ts","sourceRoot":"","sources":["../../src/fields/mergeFieldStyles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAE1C,eAAO,MAAM,gBAAgB,UACpB,WAAW,GAAG,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,KAC7C,KAAK,CAAC,aAeP,CAAA"}

package/dist/fields/mergeFieldStyles.js

@@ -0,0 +1,13 @@
+export const mergeFieldStyles = field => ({
+  ...(field?.admin?.style || {}),
+  ...(field?.admin?.width ? {
+    '--field-width': field.admin.width
+  } : {
+    flex: '1 1 auto'
+  }),
+  // allow flex overrides to still take precedence over the fallback
+  ...(field?.admin?.style?.flex ? {
+    flex: field.admin.style.flex
+  } : {})
+});
+//# sourceMappingURL=mergeFieldStyles.js.map

package/dist/fields/mergeFieldStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mergeFieldStyles.js","names":["mergeFieldStyles","field","admin","style","width","flex"],"sources":["../../src/fields/mergeFieldStyles.ts"],"sourcesContent":["import type { ClientField } from 'payload'\n\nexport const mergeFieldStyles = (\n  field: ClientField | Omit<ClientField, 'type'>,\n): React.CSSProperties => ({\n  ...(field?.admin?.style || {}),\n  ...(field?.admin?.width\n    ? {\n        '--field-width': field.admin.width,\n      }\n    : {\n        flex: '1 1 auto',\n      }),\n  // allow flex overrides to still take precedence over the fallback\n  ...(field?.admin?.style?.flex\n    ? {\n        flex: field.admin.style.flex,\n      }\n    : {}),\n})\n"],"mappings":"AAEA,OAAO,MAAMA,gBAAA,GACXC,KAAA,KACyB;EACzB,IAAIA,KAAA,EAAOC,KAAA,EAAOC,KAAA,IAAS,CAAC,CAAC;EAC7B,IAAIF,KAAA,EAAOC,KAAA,EAAOE,KAAA,GACd;IACE,iBAAiBH,KAAA,CAAMC,KAAK,CAACE;EAC/B,IACA;IACEC,IAAA,EAAM;EACR,CAAC;EACL;EACA,IAAIJ,KAAA,EAAOC,KAAA,EAAOC,KAAA,EAAOE,IAAA,GACrB;IACEA,IAAA,EAAMJ,KAAA,CAAMC,KAAK,CAACC,KAAK,CAACE;EAC1B,IACA,CAAC,CAAC;AACR","ignoreList":[]}

package/dist/forms/Form/context.d.ts

@@ -1,3 +1,4 @@
+import type { RenderedField } from 'payload';
 import type { Context, FormFieldsContext as FormFieldsContextType } from './types.js';
 declare const FormContext: import("react").Context<Context>;
 declare const FormWatchContext: import("react").Context<Context>;
@@ -6,6 +7,7 @@ declare const ProcessingContext: import("react").Context<boolean>;
 declare const ModifiedContext: import("react").Context<boolean>;
 declare const InitializingContext: import("react").Context<boolean>;
 declare const FormFieldsContext: import("use-context-selector").Context<FormFieldsContextType>;
+export type RenderedFieldSlots = Map<string, RenderedField>;
 /**
  * Get the state of the form, can be used to submit & validate the form.
  *

package/dist/forms/Form/context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/forms/Form/context.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,OAAO,EAAE,iBAAiB,IAAI,qBAAqB,EAAE,MAAM,YAAY,CAAA;AAErF,QAAA,MAAM,WAAW,kCAA+B,CAAA;AAChD,QAAA,MAAM,gBAAgB,kCAA+B,CAAA;AACrD,QAAA,MAAM,gBAAgB,kCAAuB,CAAA;AAC7C,QAAA,MAAM,iBAAiB,kCAAuB,CAAA;AAC9C,QAAA,MAAM,eAAe,kCAAuB,CAAA;AAC5C,QAAA,MAAM,mBAAmB,kCAAuB,CAAA;AAChD,QAAA,MAAM,iBAAiB,+DAAiE,CAAA;AAExF;;;;GAIG;AACH,QAAA,MAAM,OAAO,QAAO,OAAkC,CAAA;AACtD,QAAA,MAAM,YAAY,QAAO,OAAuC,CAAA;AAChE,QAAA,MAAM,gBAAgB,QAAO,OAAuC,CAAA;AACpE,QAAA,MAAM,iBAAiB,QAAO,OAAwC,CAAA;AACtE,QAAA,MAAM,eAAe,QAAO,OAAsC,CAAA;AAClE,QAAA,MAAM,mBAAmB,QAAO,OAA0C,CAAA;AAE1E;;;;GAIG;AACH,QAAA,MAAM,aAAa,GAAI,KAAK,sBAChB,CAAC,OAAO,EAAE,qBAAqB,KAAK,KAAK,KAClD,KAAwD,CAAA;AAE3D;;;;GAIG;AACH,QAAA,MAAM,gBAAgB,QAAO,qBAA0D,CAAA;AAEvF,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,gBAAgB,EAChB,mBAAmB,EACnB,eAAe,EACf,iBAAiB,EACjB,gBAAgB,EAChB,gBAAgB,EAChB,OAAO,EACP,aAAa,EACb,mBAAmB,EACnB,eAAe,EACf,iBAAiB,EACjB,gBAAgB,EAChB,YAAY,GACb,CAAA"}
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/forms/Form/context.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAS5C,OAAO,KAAK,EAAE,OAAO,EAAE,iBAAiB,IAAI,qBAAqB,EAAE,MAAM,YAAY,CAAA;AAErF,QAAA,MAAM,WAAW,kCAA+B,CAAA;AAChD,QAAA,MAAM,gBAAgB,kCAA+B,CAAA;AACrD,QAAA,MAAM,gBAAgB,kCAAuB,CAAA;AAC7C,QAAA,MAAM,iBAAiB,kCAAuB,CAAA;AAC9C,QAAA,MAAM,eAAe,kCAAuB,CAAA;AAC5C,QAAA,MAAM,mBAAmB,kCAAuB,CAAA;AAChD,QAAA,MAAM,iBAAiB,+DAAiE,CAAA;AAExF,MAAM,MAAM,kBAAkB,GAAG,GAAG,CAAC,MAAM,EAAE,aAAa,CAAC,CAAA;AAE3D;;;;GAIG;AACH,QAAA,MAAM,OAAO,QAAO,OAAkC,CAAA;AACtD,QAAA,MAAM,YAAY,QAAO,OAAuC,CAAA;AAChE,QAAA,MAAM,gBAAgB,QAAO,OAAuC,CAAA;AACpE,QAAA,MAAM,iBAAiB,QAAO,OAAwC,CAAA;AACtE,QAAA,MAAM,eAAe,QAAO,OAAsC,CAAA;AAClE,QAAA,MAAM,mBAAmB,QAAO,OAA0C,CAAA;AAE1E;;;;GAIG;AACH,QAAA,MAAM,aAAa,GAAI,KAAK,sBAChB,CAAC,OAAO,EAAE,qBAAqB,KAAK,KAAK,KAClD,KAAwD,CAAA;AAE3D;;;;GAIG;AACH,QAAA,MAAM,gBAAgB,QAAO,qBAA0D,CAAA;AAEvF,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,gBAAgB,EAChB,mBAAmB,EACnB,eAAe,EACf,iBAAiB,EACjB,gBAAgB,EAChB,gBAAgB,EAChB,OAAO,EACP,aAAa,EACb,mBAAmB,EACnB,eAAe,EACf,iBAAiB,EACjB,gBAAgB,EAChB,YAAY,GACb,CAAA"}

package/dist/forms/Form/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":["createContext","useContext","createSelectorContext","useContextSelector","useFullContext","FormContext","FormWatchContext","SubmittedContext","ProcessingContext","ModifiedContext","InitializingContext","FormFieldsContext","useForm","useWatchForm","useFormSubmitted","useFormProcessing","useFormModified","useFormInitializing","useFormFields","selector","useAllFormFields"],"sources":["../../../src/forms/Form/context.ts"],"sourcesContent":["'use client'\nimport { createContext, useContext } from 'react'\nimport {\n  createContext as createSelectorContext,\n  useContextSelector,\n  useContext as useFullContext,\n} from 'use-context-selector'\n\nimport type { Context, FormFieldsContext as FormFieldsContextType } from './types.js'\n\nconst FormContext = createContext({} as Context)\nconst FormWatchContext = createContext({} as Context)\nconst SubmittedContext = createContext(false)\nconst ProcessingContext = createContext(false)\nconst ModifiedContext = createContext(false)\nconst InitializingContext = createContext(false)\nconst FormFieldsContext = createSelectorContext<FormFieldsContextType>([{}, () => null])\n\n/**\n * Get the state of the form, can be used to submit & validate the form.\n *\n * @see https://payloadcms.com/docs/admin/hooks#useform\n */\nconst useForm = (): Context => useContext(FormContext)\nconst useWatchForm = (): Context => useContext(FormWatchContext)\nconst useFormSubmitted = (): boolean => useContext(SubmittedContext)\nconst useFormProcessing = (): boolean => useContext(ProcessingContext)\nconst useFormModified = (): boolean => useContext(ModifiedContext)\nconst useFormInitializing = (): boolean => useContext(InitializingContext)\n\n/**\n * Get and set the value of a form field based on a selector\n *\n * @see https://payloadcms.com/docs/admin/hooks#useformfields\n */\nconst useFormFields = <Value = unknown>(\n  selector: (context: FormFieldsContextType) => Value,\n): Value => useContextSelector(FormFieldsContext, selector)\n\n/**\n * Get the state of all form fields.\n *\n * @see https://payloadcms.com/docs/admin/hooks#useallformfields\n */\nconst useAllFormFields = (): FormFieldsContextType => useFullContext(FormFieldsContext)\n\nexport {\n  FormContext,\n  FormFieldsContext,\n  FormWatchContext,\n  InitializingContext,\n  ModifiedContext,\n  ProcessingContext,\n  SubmittedContext,\n  useAllFormFields,\n  useForm,\n  useFormFields,\n  useFormInitializing,\n  useFormModified,\n  useFormProcessing,\n  useFormSubmitted,\n  useWatchForm,\n}\n"],"mappings":"AAAA;;AACA,SAASA,aAAa,EAAEC,UAAU,QAAQ;AAC1C,SACED,aAAA,IAAiBE,qBAAqB,EACtCC,kBAAkB,EAClBF,UAAA,IAAcG,cAAc,QACvB;AAIP,MAAMC,WAAA,GAAcL,aAAA,CAAc,CAAC;AACnC,MAAMM,gBAAA,GAAmBN,aAAA,CAAc,CAAC;AACxC,MAAMO,gBAAA,GAAmBP,aAAA,CAAc;AACvC,MAAMQ,iBAAA,GAAoBR,aAAA,CAAc;AACxC,MAAMS,eAAA,GAAkBT,aAAA,CAAc;AACtC,MAAMU,mBAAA,GAAsBV,aAAA,CAAc;AAC1C,MAAMW,iBAAA,GAAoBT,qBAAA,CAA6C,CAAC,CAAC,GAAG,MAAM,KAAK;AAEvF;;;;;AAKA,MAAMU,OAAA,GAAUA,CAAA;EAAA,OAAeX,UAAA,CAAAI,WAAW;AAAA;AAC1C,MAAMQ,YAAA,GAAeA,CAAA;EAAA,OAAeZ,UAAA,CAAAK,gBAAW;AAAA;AAC/C,MAAMQ,gBAAA,GAAmBA,CAAA;EAAA,OAAeb,UAAA,CAAAM,gBAAW;AAAA;AACnD,MAAMQ,iBAAA,GAAoBA,CAAA;EAAA,OAAed,UAAA,CAAAO,iBAAW;AAAA;AACpD,MAAMQ,eAAA,GAAkBA,CAAA;EAAA,OAAef,UAAA,CAAAQ,eAAW;AAAA;AAClD,MAAMQ,mBAAA,GAAsBA,CAAA;EAAA,OAAehB,UAAA,CAAAS,mBAAW;AAAA;AAEtD;;;;;AAKA,MAAMQ,aAAA,GAAgBC,QAAA;EAAA,OAEVhB,kBAAA,CAAAQ,iBAAA,EAAsCQ,QAAA;AAAA;AAElD;;;;;AAKA,MAAMC,gBAAA,GAAmBA,CAAA;EAAA,OAA6BhB,cAAA,CAAAO,iBAAe;AAAA;AAErE,SACEN,WAAW,EACXM,iBAAiB,EACjBL,gBAAgB,EAChBI,mBAAmB,EACnBD,eAAe,EACfD,iBAAiB,EACjBD,gBAAgB,EAChBa,gBAAgB,EAChBR,OAAO,EACPM,aAAa,EACbD,mBAAmB,EACnBD,eAAe,EACfD,iBAAiB,EACjBD,gBAAgB,EAChBD,YAAY","ignoreList":[]}
+{"version":3,"file":"context.js","names":["createContext","useContext","createSelectorContext","useContextSelector","useFullContext","FormContext","FormWatchContext","SubmittedContext","ProcessingContext","ModifiedContext","InitializingContext","FormFieldsContext","useForm","useWatchForm","useFormSubmitted","useFormProcessing","useFormModified","useFormInitializing","useFormFields","selector","useAllFormFields"],"sources":["../../../src/forms/Form/context.ts"],"sourcesContent":["'use client'\nimport type { RenderedField } from 'payload'\n\nimport { createContext, useContext } from 'react'\nimport {\n  createContext as createSelectorContext,\n  useContextSelector,\n  useContext as useFullContext,\n} from 'use-context-selector'\n\nimport type { Context, FormFieldsContext as FormFieldsContextType } from './types.js'\n\nconst FormContext = createContext({} as Context)\nconst FormWatchContext = createContext({} as Context)\nconst SubmittedContext = createContext(false)\nconst ProcessingContext = createContext(false)\nconst ModifiedContext = createContext(false)\nconst InitializingContext = createContext(false)\nconst FormFieldsContext = createSelectorContext<FormFieldsContextType>([{}, () => null])\n\nexport type RenderedFieldSlots = Map<string, RenderedField>\n\n/**\n * Get the state of the form, can be used to submit & validate the form.\n *\n * @see https://payloadcms.com/docs/admin/hooks#useform\n */\nconst useForm = (): Context => useContext(FormContext)\nconst useWatchForm = (): Context => useContext(FormWatchContext)\nconst useFormSubmitted = (): boolean => useContext(SubmittedContext)\nconst useFormProcessing = (): boolean => useContext(ProcessingContext)\nconst useFormModified = (): boolean => useContext(ModifiedContext)\nconst useFormInitializing = (): boolean => useContext(InitializingContext)\n\n/**\n * Get and set the value of a form field based on a selector\n *\n * @see https://payloadcms.com/docs/admin/hooks#useformfields\n */\nconst useFormFields = <Value = unknown>(\n  selector: (context: FormFieldsContextType) => Value,\n): Value => useContextSelector(FormFieldsContext, selector)\n\n/**\n * Get the state of all form fields.\n *\n * @see https://payloadcms.com/docs/admin/hooks#useallformfields\n */\nconst useAllFormFields = (): FormFieldsContextType => useFullContext(FormFieldsContext)\n\nexport {\n  FormContext,\n  FormFieldsContext,\n  FormWatchContext,\n  InitializingContext,\n  ModifiedContext,\n  ProcessingContext,\n  SubmittedContext,\n  useAllFormFields,\n  useForm,\n  useFormFields,\n  useFormInitializing,\n  useFormModified,\n  useFormProcessing,\n  useFormSubmitted,\n  useWatchForm,\n}\n"],"mappings":"AAAA;;AAGA,SAASA,aAAa,EAAEC,UAAU,QAAQ;AAC1C,SACED,aAAA,IAAiBE,qBAAqB,EACtCC,kBAAkB,EAClBF,UAAA,IAAcG,cAAc,QACvB;AAIP,MAAMC,WAAA,GAAcL,aAAA,CAAc,CAAC;AACnC,MAAMM,gBAAA,GAAmBN,aAAA,CAAc,CAAC;AACxC,MAAMO,gBAAA,GAAmBP,aAAA,CAAc;AACvC,MAAMQ,iBAAA,GAAoBR,aAAA,CAAc;AACxC,MAAMS,eAAA,GAAkBT,aAAA,CAAc;AACtC,MAAMU,mBAAA,GAAsBV,aAAA,CAAc;AAC1C,MAAMW,iBAAA,GAAoBT,qBAAA,CAA6C,CAAC,CAAC,GAAG,MAAM,KAAK;AAIvF;;;;;AAKA,MAAMU,OAAA,GAAUA,CAAA;EAAA,OAAeX,UAAA,CAAAI,WAAW;AAAA;AAC1C,MAAMQ,YAAA,GAAeA,CAAA;EAAA,OAAeZ,UAAA,CAAAK,gBAAW;AAAA;AAC/C,MAAMQ,gBAAA,GAAmBA,CAAA;EAAA,OAAeb,UAAA,CAAAM,gBAAW;AAAA;AACnD,MAAMQ,iBAAA,GAAoBA,CAAA;EAAA,OAAed,UAAA,CAAAO,iBAAW;AAAA;AACpD,MAAMQ,eAAA,GAAkBA,CAAA;EAAA,OAAef,UAAA,CAAAQ,eAAW;AAAA;AAClD,MAAMQ,mBAAA,GAAsBA,CAAA;EAAA,OAAehB,UAAA,CAAAS,mBAAW;AAAA;AAEtD;;;;;AAKA,MAAMQ,aAAA,GAAgBC,QAAA;EAAA,OAEVhB,kBAAA,CAAAQ,iBAAA,EAAsCQ,QAAA;AAAA;AAElD;;;;;AAKA,MAAMC,gBAAA,GAAmBA,CAAA;EAAA,OAA6BhB,cAAA,CAAAO,iBAAe;AAAA;AAErE,SACEN,WAAW,EACXM,iBAAiB,EACjBL,gBAAgB,EAChBI,mBAAmB,EACnBD,eAAe,EACfD,iBAAiB,EACjBD,gBAAgB,EAChBa,gBAAgB,EAChBR,OAAO,EACPM,aAAa,EACbD,mBAAmB,EACnBD,eAAe,EACfD,iBAAiB,EACjBD,gBAAgB,EAChBD,YAAY","ignoreList":[]}

package/dist/forms/Form/fieldReducer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"fieldReducer.d.ts","sourceRoot":"","sources":["../../../src/forms/Form/fieldReducer.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAa,SAAS,EAAO,MAAM,SAAS,CAAA;AAMxD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAA;AAO7C;;GAEG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,WAAW,GAAG,SAAS,CAoU7E"}
+{"version":3,"file":"fieldReducer.d.ts","sourceRoot":"","sources":["../../../src/forms/Form/fieldReducer.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAa,SAAS,EAAO,MAAM,SAAS,CAAA;AAMxD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAA;AAO7C;;GAEG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,WAAW,GAAG,SAAS,CAqW7E"}