import { ChangeDetectionStrategy, Component } from '@angular/core';
import {
  PgrBbWithDynamicFormResources,
  PgrBbWithDynamicFormState
} from '../../../../src/lib/pgr-bb-with-dynamic-form/pgr-bb-with-dynamic-form.model';

@Component({
  selector: 'example-pgr-bb-with-dynamic-form',
  templateUrl: 'pgr-bb-with-dynamic-form.component.html',
  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class ExamplePgrBbWithDynamicFormComponent {
  resourcesExample: PgrBbWithDynamicFormResources = {
    myDynamicFormConfigs: [
      {
        fields: [
          {
            id: 'df-bb-headline',
            type: 'HEADLINE',
            headerType: 'h2',
            label: 'This is the first Dynamic Form rendered by a custom Building Block'
          },
          {
            id: 'df-bb-paragraph',
            type: 'PARAGRAPH',
            label: "The Dynamic Form Building Block is rendered based on Building Block's resources"
          },
          {
            id: 'df-bb-min',
            type: 'INPUT',
            inputType: 'number',
            label: 'Minimum value of the input field below'
          },
          {
            id: 'df-bb-input',
            type: 'INPUT',
            inputType: 'number',
            label: 'Type a number'
          }
        ]
      },
      {
        fields: [
          {
            id: 'df-bb-headline2',
            type: 'HEADLINE',
            headerType: 'h2',
            label: 'This is the second Dynamic Form rendered by a custom Building Block'
          },
          {
            id: 'df-bb-paragraph2',
            type: 'PARAGRAPH',
            label: "The Dynamic Form Building Block is rendered based on Building Block's resources"
          }
        ]
      }
    ]
  };
  stateExample: PgrBbWithDynamicFormState = {};
}