npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

strapi-plugin-dynamic-enumeration-field

v1.1.2

Published

Custom field to create dynamic enumerations

Downloads

91

Readme

:tada: Introduction

This plugin adds a new type of enumeration that works like a combobox, where you can get data already registered in the enumeration previously, or add a new item to the select options.

:page_facing_up: Features

  • New field Dynamic Enumeration appears in admin content-type-builder page, in the custom tab.
  • Save only registration options and remove options that is not being used.
  • Works inside Components and Dynamic Zones.
  • Separates each field options by its API or Component
  • You can create Globals fields, which keep the same list between different API and Components
  • You can load the options in plugin API or Service. For list the data in your frontend, for example.

:cd: Installation

Install this plugin by adding it to the dependencies of your Strapi project.

# Yarn
yarn add strapi-plugin-dynamic-enumeration-field

# NPM
npm install strapi-plugin-dynamic-enumeration-field

# PNPM
pnpm install strapi-plugin-dynamic-enumeration-field

After that you must add it to your plugin configuration file.

:wrench: Configuration

Add the code below to your ./config/plugins.js file:

module.exports = ({ env }) => ({
  // ...
  'dynamic-enumeration': {
    enabled: true,
  },
  // ...
});

After that, you'll need to build your admin panel:

npm run build

Adding globals field

You can add several global field keys in the config part of the plugin settings.

module.exports = ({ env }) => ({
  // ...
  'dynamic-enumeration': {
    enabled: true,
    config: {
      globals: {
        // Unique Key Name
        'my-global-enumeration': {
          // Frontend Name
          name: 'My Global Enumeration',
          // Fixed default values
          defaults: ['Strapi', 'Node.js', 'React.js'],
        },
        // ...Others globals fields
      },
    },
  },
  // ...
});

:book: Api

The plugin adds two Api and Service to your application:

Get Enumeration Values

You can get the options added to a field, sending the uid of the API or Component, and the name of the field.

The uid It is in the format api::<api>.<api> for api, and <component-folder>.<component-file-name> for components

See the example below:

EXAMPLE

const uid = "api::my-api.my-api"
const name = "city"
const locale = 'en' // Optional, if you use i18b

// Using Fetch
await fetch(`${API_URL}/api/dynamic-enumeration?uid=${uid}&name=${name}&locale=${locale}`);
// GET /api/dynamic-enumeration?uid=your-api&name=your-attribute-name&locale=locale

// Using Service in Strapi
const SERVICE_UID = 'plugin::dynamic-enumeration.dynamic-enumeration-service'
const service = strapi.service(SERVICE_UID)
const data = await service.getValues({
  uid,
  name,
  locale // Optional
})

Get Globals Values

You can get the options added to all global field, sending the key of the Globals Field configured in your plugins file. ( See the settings part above )

See the example below:

EXAMPLE


// In Your "./config/plugins.js" file
module.exports = ({ env }) => ({
  // ...
  'dynamic-enumeration': {
    enabled: true,
    config: {
      globals: {
        // The Global Key
        'my-field': {
          // Configurations
        },
      },
    },
  },
  // ...
});

// Using Fetch
await fetch(`${API_URL}/api/dynamic-enumeration/globals?key=my-field`);
// GET /api/dynamic-enumeration/globals?key=global-key&locale=locale

// Using Service in Strapi
const SERVICE_UID = 'plugin::dynamic-enumeration.dynamic-enumeration-service'
const service = strapi.service(SERVICE_UID)
const data = await service.getGlobalValues({
  key: 'my-field',
  locale // Optional
})

:memo: License

This project is under the MIT license. See the LICENSE file for more details.