@keystonejs/fields

KeystoneJS Field Types including Text, Password, DateTime, Integer, and more.

Usage no npm install needed!

<script type="module">
  import keystonejsFields from 'https://cdn.skypack.dev/@keystonejs/fields';
</script>

README

Fields

This is the last active development release of this package as Keystone 5 is now in a 6 to 12 month active maintenance phase. For more information please read our Keystone 5 and beyond post.

Keystone contains a set of primitive fields types that can be imported from the @keystonejs/fields package:

Field type Description
CalendarDay An abstract "day" value; useful for Birthdays and other all-day events always celebrated in the local time zone
Checkbox A single Boolean value
DateTime A point in time and a time zone offset
DateTimeUtc Represents points in time, stored in UTC
Decimal Exact, numeric values in base-10; useful for currency, etc.
File Files backed various storage mediums: local filesystem, cloud based hosting, etc.
Float An imprecise numeric value, stored as a floating point
Integer A whole number
Password A bcrypt hash of the value supplied; used by the Password auth strategy
Relationship A link between the current list and others, often paired with a field on the other list
Select One of several predefined string values, presented as a dropdown
Slug Generate unique slugs (aka. keys, url segments) based on the item's data
Text A basic but versatile text field of arbitrary length
Url Extends the Text type to store HTTP URLs
Uuid Universally Unique Identifiers (UUIDs); useful for id fields
Virtual Read-only field with a developer-defined resolver, executed on read

In addition to these, some complex types are packaged separately:

Field type Description
Content Block-based content for composing rich text such as blog posts, wikis, and even complete pages
AuthedRelationship Extendes the Relationship type; automatically set to the currently authenticated item during a create mutation
AutoIncrement An automatically incrementing integer; the default type for id fields when using the Knex DB adapter
Markdown Markdown content; based on the Text type and using the CodeMirror editor in the Admin UI
MongoId Arbitrary Mongo ObjectId values; the default type for id fields when using the Mongoose DB adapter
Wysiwyg Rich text content; based on the Text type and using the TinyMCE editor in the Admin UI
LocationGoogle Data from the Google Maps API
Color Hexidecimal RGBA color values; uses a color picker in the Admin UI
OEmbed Data in the oEmbed format; allowing an embedded representation of a URL on third party sites
CloudinaryImage Allows uploading images to the Cloudinary image hosting service
Unsplash Meta data from the Unsplash API and generates URLs to dynamically transformed images

Tip: Need something else? Keystone lets you create custom field types to support almost any use case.

Usage

Fields definitions are provided when creating a list. Field definitions should be an object where the key is the field name and the value is an object containing the fields config:

const { Text } = require('@keystonejs/fields');

keystone.createList('Post', {
  fields: {
    title: { type: Text },
  },
});

Config

Fields share some standard configuration options.

Option Type Default Description
type FieldType (required)
adminDoc String false A description for the field used in the AdminUI.
schemaDoc String false A description for the field used in the GraphQL schema.
defaultValue Any | Function undefined A valid default value for the field type. Functions must return a valid value. Use undefined to set no default, and null to set an empty default.
isUnique Boolean false Whether or not the field should be unique.
isRequired Boolean false Whether or not the field should be mandatory.
access Boolean | Function | Object true See: Access control options for fields.
label String Label for the field.
adminConfig Object {} Additional config which can be used when customizing admin-ui

Note: Many field types have additional config options. See the documentation for individual field types for more detail.

type

A valid Keystone field type.

label

Sets the label for the field in the AdminUI

adminDoc

A description of the field used in the AdminUI.

schemaDoc

A description of the field used used in the GraphQL schema.

adminConfig

Additional field configs affecting field rendering or display in admin-ui.

adminConfig.isReadOnly

Fields with isReadOnly set to true will be disabled preventing users from modifying them in the Admin UI. This does not affect access control and fields can still be updated via GraphQL.

keystone.createList('Post', {
  fields: {
    title: { type: Text },
    slug: {
      type: Slug,
      adminConfig: {
        isReadOnly: true, //slug can be created automatically and you may want to show this as read only
      },
    },
  },
});

defaultValue

Sets the value when no data is provided.

keystone.createList('Post', {
  fields: {
    title: {
      type: Text,
      defaultValue: ({ context, originalInput }) => {
        /**/
      },
    },
    description: { type: Text, defaultValue: 'Lorem ipsum...' },
  },
});

For a 'nullable' field, set defaultValue: null.

The defaultValue can be a String or Function. Functions should returns the value, or a Promise for the value.

isUnique

Specifies whether the value should be unique or not. Will return an error is a user tries to create a field with a non-unique value.

isRequired

Specifies whether the field is required or not. Will return an error if mutations do not contain data.

access

Access control options for fields.

Options for create, read, update and delete - can be a function or Boolean. See the access control API documentation for more details.

Note: Field level access control does not accept graphQL where clauses.

cacheHint

HTTP cache hint for field.

Only static hints are supported for fields.