Panel Extensions

npm init directus-extension
# Select "panel" as the extension type

import { definePanel } from '@directus/extensions-sdk';

export default definePanel({
  id: 'my-panel',
  name: 'My Panel',
  icon: 'bar_chart',
  description: 'A custom panel',
  component: PanelComponent,
  options: [
    {
      field: 'collection',
      type: 'string',
      name: 'Collection',
      meta: {
        interface: 'system-collection',
        width: 'half',
      },
    },
  ],
  minWidth: 12,
  minHeight: 8,
});

interface PanelProps {
  showHeader: boolean;
  width: number;
  height: number;
  // Your custom options
  collection?: string;
}