Icons

Über

Fügt Payload 3 ein Icon-Picker-Feld hinzu. Das Feld speichert einen Gruppenwert aus `{ provider, name }` in der Datenbank, wobei beide Teilfelder für Redakteure ausgeblendet sind. Die Auswahl erfolgt über eine Admin-Komponente mit einer durchsuchbaren, paginierten Auswahlliste und einer Vorschauzelle in den Listenansichten der Collections. Das Plugin liefert zwei Icon-Provider mit: Lucide über `lucide-react` und Phosphor über `@phosphor-icons/react`. Jeder Provider bringt eine Server-Konfiguration mit ID und Label sowie eine Client-Factory, die Icon-Komponenten synchron auflöst. Die Auswahlliste unterstützt den Wechsel zwischen Providern, Kategorie-Gruppierung und pro Feld einschränkbare Provider-Subsets. Die Konfiguration koppelt ein Plugin mit einer Field-Factory. `createIconPlugin()` gibt `iconPlugin` und `iconField` zurück und hält Provider-IDs und Labels synchron. Zu den Feldoptionen gehören der gespeicherte Name, das Admin-Label, `required`, der Standard-Provider, das aktivierte Provider-Subset und pro Feld überschreibbare Labels. Die Option `packageImport` ermöglicht Monorepo-Setups, den Client-Export zu aliasen. Eigene Provider lassen sich über `registerIconProviderClientFactory` registrieren. Ein Provider muss Icon-Namen, Category Maps, einen Category Representative und einen Component Resolver bereitstellen. Der Resolver muss Icons per eager import laden, da per-Icon Lazy Loading beim geöffneten Picker hunderte Requests auslösen würde. Eine `Icon`-Client-Komponente rendert den gespeicherten Wert, reicht SVG-Props durch und unterstützt die `weight`-Prop von Phosphor. Nach Konfigurationsänderungen sind `payload generate:importmap` und `generate:types` auszuführen.

Paketinformationen

Paketname

payload-plugin-icons

Neueste Version

1.1.5

Entpackte Größe

171 kB

Lizenz

MIT

Wöchentliche Downloads

22

Zuletzt veröffentlicht

14. Aug. 2026