💡 A directus interface + display adding copy to clipboard and link actions to your values.

The actions can be performed by a button next to the items or by clicking on the value.

↑ Add copy-to-clipboard and link functions to your data

• prefix support: return \https://www.google.com/${id}\``. Right now only work interface

Each value can be copied by a custom button. If enabled it's also possible to copy a value by just clickung on it (click-action)

When using the link-option it supports ➡️ HTTP-, 📧 mail-, and 📞 phone- links. Each link can be opened by the custom button. If enabled it's also possible to open the link by just clicking on the value (click-action).

Note: The extensions currently won't parse invalid links into valid ones!

Displays and disabled interfaces (== readonly) support a custom click-action. This can be one of:

• default action (does nothing custom)
• Copy-action (copied the value)
• Link-action (openes the link in a new tab)

• The icons can be placed before or after the content
• The setting can be set for the interface and display, as well as the copy and link button indipendently
• Example in the screenshots below

• You can set custom prefixes for copy-/ and link-actions.
• Prefixes can be entered manually or use a defined variable (Project URL setting)
• The setting can be set for the interface and display, as well as the copy and link button indipendently
• Example in the screenshots below

• Set the link-target to the same, or a new tab

• Hides the field value for a button only mode
• Mostly to be used in combinaiton with button labels

• Add custom labels to the copy-/ and link icons for the display
• Mostly to be used in combinaiton with the "Hide field value" option for a button only mode

npm i directus-extension-field-actions

or

pnpm i directus-extension-field-actions

1. Download the app.js, api.js and package.json from the latest release

2. Create a folder named directus-extension-field-actions in your extension folder (e.g /extensions/directus-extension-field-actions) and a /dist folder inside.

3. Move the package.json to the created extension folder and the app.js and api.js into the /dist folder.

4. Restart directus

The result should look like this:

├── extensions
│   ├── directus-extension-field-actions
│   │   ├── dist
│   │   │   ├── app.js
│   │   │   ├── api.js
│   │   ├── package.json

↑ Copy values from table views directly by clicking on them or an icon (configurable)

↑ Copy field-values by clicking on it (only for readonly-fields and displays)

↑ Add link- and copy-to-clipboard buttons to each field

↑ Interfaces settings

↑ Displays settings