import type { ZoraComponentMeta } from '../authoring';
import { COMPONENT_THEME_AUTHORING } from '../authoring/constants';
import { ZORA_COLORS } from '../theme/colorModel';

export const buttonMeta = {
  name: 'Button',
  category: 'component',
  directManifestNode: true,
  allowedChildren: [],
  blueprint: { label: 'Button', defaultProps: { children: 'Continue' } },
  events: {
    press: {
      label: 'Press',
      eventType: 'button.press',
      description: 'Emitted when the button action runs.',
      payloadFields: [],
    },
  },
  props: {
    disabled: { type: 'boolean', category: 'State' },
    loading: { type: 'boolean', category: 'State' },
    children: {
      type: 'string',
      category: 'Content',
      label: 'Label',
      default: 'Continue',
      authoring: { authority: 'instance' },
    },
    color: {
      type: 'enum',
      category: 'Style',
      label: 'Color',
      enum: [...ZORA_COLORS],
      authoring: COMPONENT_THEME_AUTHORING,
    },
    variant: {
      type: 'enum',
      category: 'Style',
      label: 'Variant',
      enum: ['solid', 'outline', 'ghost', 'soft'],
      authoring: COMPONENT_THEME_AUTHORING,
    },
    size: {
      type: 'enum',
      category: 'Style',
      label: 'Size',
      enum: ['s', 'm', 'l'],
      authoring: COMPONENT_THEME_AUTHORING,
    },
  },
} as const satisfies ZoraComponentMeta;