chore: misc documentation updates (#2589)

* chore: ensures example configs are being exported when necessary
* chore: adds note regarding updating of hidden fields

---------

Co-authored-by: Jessica Boezwinkle <jessica@trbl.design>

docs/access-control/collections.mdx

@@ -30,7 +30,7 @@ If a Collection supports [`Authentication`](/docs/authentication/overview), the
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const Posts: CollectionConfig = {
+export const Posts: CollectionConfig = {
   slug: "posts",
   // highlight-start
   access: {
@@ -42,8 +42,6 @@ const Posts: CollectionConfig = {
   },
   // highlight-end
 };
-
-export default Posts;
 ```
 
 ### Create

docs/access-control/fields.mdx

@@ -20,7 +20,7 @@ Field Access Control is specified with functions inside a field's config. All fi
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const Posts: CollectionConfig = {
+export const Posts: CollectionConfig = {
   slug: 'posts',
   fields: [
     {
@@ -67,6 +67,8 @@ Returns a boolean which allows or denies the ability to read a field's value. If
 
 Returns a boolean which allows or denies the ability to update a field's value. If `false` is returned, any passed values will be discarded.
 
+If `false` is returned and you attempt to update the field's value, the operation will **not** throw an error however the field will be omitted from the update operation and the value will remain unchanged.
+
 **Available argument properties:**
 
 | Option            | Description |

docs/admin/webpack.mdx

@@ -56,7 +56,7 @@ You may rely on server-only packages such as the above to perform logic in acces
 import { CollectionConfig } from 'payload/types';
 import createStripeSubscription from './hooks/createStripeSubscription';
 
-const Subscription: CollectionConfig = {
+export const Subscription: CollectionConfig = {
 	slug: 'subscriptions',
 	hooks: {
 		beforeChange: [
@@ -71,8 +71,6 @@ const Subscription: CollectionConfig = {
 		}
 	]
 };
-
-export default Subscription;
 ```
 
 The collection above features a `beforeChange` hook that creates a Stripe subscription whenever a Subscription document is created in Payload.

docs/authentication/config.mdx

@@ -82,7 +82,7 @@ Example:
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const Customers: CollectionConfig = {
+export const Customers: CollectionConfig = {
   slug: 'customers',
   auth: {
     forgotPassword: {
@@ -156,7 +156,7 @@ Example:
 import { CollectionConfig } from 'payload/types';
 
 
-const Customers: CollectionConfig = {
+export const Customers: CollectionConfig = {
   slug: 'customers',
   auth: {
     verify: {

docs/authentication/overview.mdx

@@ -35,8 +35,8 @@ Simple example collection:
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const Admins: CollectionConfig = {
-  slug:
+export const Admins: CollectionConfig = {
+  slug: 'admins',
   // highlight-start
   auth: {
     tokenExpiration: 7200, // How many seconds to keep the user logged in

docs/configuration/collections.mdx

@@ -39,7 +39,7 @@ It's often best practice to write your Collections in separate files and then im
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const Orders: CollectionConfig = {
+export const Orders: CollectionConfig = {
 	slug: 'orders',
 	fields: [
 		{
@@ -95,7 +95,7 @@ If the function is specified, a Preview button will automatically appear in the
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const Posts: CollectionConfig = {
+export const Posts: CollectionConfig = {
 	slug: 'posts',
 	fields: [
 		{

docs/configuration/globals.mdx

@@ -87,7 +87,7 @@ If the function is specified, a Preview button will automatically appear in the
 ```ts
 import { GlobalConfig } from "payload/types";
 
-const MyGlobal: GlobalConfig = {
+export const MyGlobal: GlobalConfig = {
   slug: "my-global",
   fields: [
     {

docs/configuration/i18n.mdx

@@ -12,7 +12,9 @@ While Payload's built-in features come translated, you may want to also translat
 
 Here is an example of a simple collection supporting both English and Spanish editors:
 ```ts
-const Articles: CollectionConfig = {
+import { CollectionConfig } from 'payload/types';
+
+export const Articles: CollectionConfig = {
   slug: 'articles',
   labels: {
     singular: {

docs/fields/array.mdx

@@ -56,7 +56,7 @@ In addition to the default [field admin config](/docs/fields/overview#admin-conf
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {

docs/fields/blocks.mdx

@@ -102,7 +102,7 @@ const QuoteBlock: Block = {
   ]
 };
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {

docs/fields/checkbox.mdx

@@ -36,7 +36,7 @@ keywords: checkbox, fields, config, configuration, documentation, Content Manage
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {

docs/fields/code.mdx

@@ -51,7 +51,7 @@ In addition to the default [field admin config](/docs/fields/overview#admin-conf
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {

docs/fields/collapsible.mdx

@@ -35,7 +35,7 @@ In addition to the default [field admin config](/docs/fields/overview#admin-conf
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {

docs/fields/date.mdx

@@ -70,7 +70,7 @@ When only `pickerAppearance` is set, an equivalent format will be rendered in th
 ```ts
 import { CollectionConfig } from "payload/types";
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: "example-collection",
   fields: [
     {

docs/fields/email.mdx

@@ -49,7 +49,7 @@ Set this property to a string that will be used for browser autocomplete.
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {

docs/fields/group.mdx

@@ -43,7 +43,7 @@ Set this property to `true` to hide this field's gutter within the admin panel.
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {

docs/fields/json.mdx

@@ -48,7 +48,7 @@ In addition to the default [field admin config](/docs/fields/overview#admin-conf
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {

docs/fields/number.mdx

@@ -55,7 +55,7 @@ Set this property to a string that will be used for browser autocomplete.
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {

docs/fields/overview.mdx

@@ -19,7 +19,7 @@ The required `type` property on a field determines what values it can accept, ho
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const Page: CollectionConfig = {
+export const Page: CollectionConfig = {
 	slug: 'pages',
 	fields: [
 		{
@@ -90,7 +90,7 @@ Example:
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const Orders: CollectionConfig = {
+export const Orders: CollectionConfig = {
   slug: 'orders',
   fields: [
     {

docs/fields/point.mdx

@@ -40,7 +40,7 @@ The data structure in the database matches the GeoJSON structure to represent po
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {

docs/fields/radio.mdx

@@ -50,7 +50,7 @@ The `layout` property allows for the radio group to be styled as a horizonally o
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {
@@ -73,5 +73,4 @@ const ExampleCollection: CollectionConfig = {
     }
   ]
 }
-
 ```

docs/fields/relationship.mdx

@@ -20,7 +20,7 @@ keywords: relationship, fields, config, configuration, documentation, Content Ma
 ### Config
 
 | Option              | Description                                                                                                                                                                                         |
-|---------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
+| ------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
 | **`name`** \*       | To be used as the property name when stored and retrieved from the database. [More](/docs/fields/overview#field-names)                                                                              |
 | **`relationTo`** \* | Provide one or many collection `slug`s to be able to assign relationships to.                                                                                                                       |
 | **`filterOptions`** | A query to filter which options appear in the UI and validate against. [More](#filtering-relationship-options).                                                                                     |
@@ -77,27 +77,34 @@ The `filterOptions` property can either be a `Where` query directly, or a functi
 | `id`          | The value of the collection `id`, will be `undefined` on create request              |
 | `user`        | The currently authenticated user object                                              |
 
-**Example:**
+### Example
 
 ```ts
-const relationshipField = {
-  name: "purchase",
-  type: "relationship",
-  relationTo: ["products", "services"],
-  filterOptions: ({ relationTo, siblingData }) => {
-    // returns a Where query dynamically by the type of relationship
-    if (relationTo === "products") {
-      return {
-        stock: { greater_than: siblingData.quantity },
-      };
-    }
+import { CollectionConfig } from "payload/types";
 
-    if (relationTo === "services") {
-      return {
-        isAvailable: { equals: true },
-      };
-    }
-  },
+export const ExampleCollection: CollectionConfig = {
+  slug: "example-collection",
+  fields: [
+    {
+      name: "purchase",
+      type: "relationship",
+      relationTo: ["products", "services"],
+      filterOptions: ({ relationTo, siblingData }) => {
+        // returns a Where query dynamically by the type of relationship
+        if (relationTo === "products") {
+          return {
+            stock: { greater_than: siblingData.quantity },
+          };
+        }
+
+        if (relationTo === "services") {
+          return {
+            isAvailable: { equals: true },
+          };
+        }
+      },
+    },
+  ],
 };
 ```
 

docs/fields/rich-text.mdx

@@ -141,7 +141,7 @@ Custom `Leaf` objects follow a similar pattern but require you to define the `Le
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {
@@ -371,5 +371,4 @@ import type {
   RichTextCustomElement,
   RichTextCustomLeaf,
 } from 'payload/types';
-
 ```

docs/fields/row.mdx

@@ -26,7 +26,7 @@ keywords: row, fields, config, configuration, documentation, Content Management
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {

docs/fields/select.mdx

@@ -62,7 +62,7 @@ Set to `true` if you'd like this field to be sortable within the Admin UI using
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {

docs/fields/tabs.mdx

@@ -40,7 +40,7 @@ Each tab has its own required `label` and `fields` array. You can also optionall
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {

docs/fields/text.mdx

@@ -51,7 +51,7 @@ Set this property to a string that will be used for browser autocomplete.
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {

docs/fields/textarea.mdx

@@ -51,7 +51,7 @@ Set this property to a string that will be used for browser autocomplete.
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {

docs/fields/ui.mdx

@@ -39,7 +39,7 @@ With this field, you can also inject custom `Cell` components that appear as add
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {

docs/fields/upload.mdx

@@ -51,7 +51,7 @@ keywords: upload, images media, fields, config, configuration, documentation, Co
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleCollection: CollectionConfig = {
+export const ExampleCollection: CollectionConfig = {
   slug: 'example-collection',
   fields: [
     {

docs/graphql/overview.mdx

@@ -32,7 +32,7 @@ Everything that can be done to a Collection via the REST or Local API can be don
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const PublicUser: CollectionConfig = {
+export const PublicUser: CollectionConfig = {
   slug: 'public-users',
   auth: true, // Auth is enabled
   fields: [

docs/hooks/collections.mdx

@@ -34,7 +34,7 @@ All collection Hook properties accept arrays of synchronous or asynchronous func
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const ExampleHooks: CollectionConfig = {
+export const ExampleHooks: CollectionConfig = {
   slug: 'example-hooks',
   fields: [
     { name: 'name', type: 'text'},

docs/queries/overview.mdx

@@ -19,7 +19,7 @@ For example, say you have a collection as follows:
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const Post: CollectionConfig = {
+export const Post: CollectionConfig = {
   slug: 'posts',
   fields: [
     {

docs/rest-api/overview.mdx

@@ -99,7 +99,7 @@ Example:
 import { CollectionConfig } from 'payload/types';
 
 // a collection of 'orders' with an additional route for tracking details, reachable at /api/orders/:id/tracking
-const Orders: CollectionConfig = {
+export const Orders: CollectionConfig = {
 	slug: 'orders',
 	fields: [ /* ... */ ],
   // highlight-start

docs/upload/overview.mdx

@@ -60,7 +60,7 @@ _An asterisk denotes that a property above is required._
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const Media: CollectionConfig = {
+export const Media: CollectionConfig = {
   slug: 'media',
   upload: {
     staticURL: '/media',
@@ -165,7 +165,7 @@ You can specify how Payload retrieves admin thumbnails for your upload-enabled C
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const Media: CollectionConfig = {
+export const Media: CollectionConfig = {
   slug: 'media',
   upload: {
     staticURL: '/media',
@@ -200,7 +200,7 @@ Some example values are: `image/*`, `audio/*`, `video/*`, `image/png`, `applicat
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const Media: CollectionConfig = {
+export const Media: CollectionConfig = {
   slug: 'media',
   upload: {
     staticURL: '/media',

docs/versions/autosave.mdx

@@ -28,7 +28,7 @@ Collections and Globals both support the same options for configuring autosave.
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const Pages: CollectionConfig = {
+export const Pages: CollectionConfig = {
   slug: 'pages',
   access: {
     read: ({ req }) => {

docs/versions/drafts.mdx

@@ -84,7 +84,7 @@ Here is an example that utilizes the `_status` field to require a user to be log
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const Pages: CollectionConfig = {
+export const Pages: CollectionConfig = {
   slug: 'pages',
   access: {
     read: ({ req }) => {
@@ -119,7 +119,7 @@ Here is an example for how to write an access control function that grants acces
 ```ts
 import { CollectionConfig } from 'payload/types';
 
-const Pages: CollectionConfig = {
+export const Pages: CollectionConfig = {
   slug: 'pages',
   access: {
     read: ({ req }) => {