File

libs/core/dynamic-form/headline/src/headline.model.ts

Extends

DfBaseConfig

Index

Properties

Properties

headerType
Type HeaderType
Description

Defines the level of the HTML heading element and the visual appearance of the headline.

label
Type string
Description

This field's label. It's translatable by default and supports string interpolation.

Example :
type
Type typeof DfHeadlineTypeName
Description

Specifies the type of the field as HEADLINE.

acl (Optional)
Type DfFieldAcl[]
Description

ACL rules to be applied to this field.

columnSpan (Optional)
Type number
Description

This field's custom size.

Number of column(s) the element should span. It's only applicable with the "CUSTOM_COLUMN" layout. The value can be 1-12, following the 12-column grid system. The default value is 12.

id
Type string
Description

This field's ID.

The ID will serve as the ACL resource name for the form field. If the field is a form element, it will also be used as a form control name within the FormGroup to which it is added. IDs must be unique within your form.

Example :
infoIcon (Optional)
Type DfInfoIconConfig
Description

Info icon with associated pop-over.

onInitEvent (Optional)
Type DfInteractiveEventConfig
Description

Configure either a PFE action or service activator configuration handler when the field's ngOnInit method is triggered.

renderName (Optional)
Type string
Description

The optional renderName is added as the attribute "data-render-name" to the df-formfield elements in the DOM. It can be used to find the rendered element of a specific field of a form.

spacing (Optional)
Type DfFormfieldSpacing
Description

This field's custom spacing.

If defined, it will be used to set the spacing between this field and the next one.

testId (Optional)
Type string
Description

The id used to select the element in the tests (unit test, e2e testing)

import { DfBaseConfig } from '@allianz/taly-core/dynamic-form';

/**
 * The value to use for the `type` attribute of headline
 * formfield configs.
 */
export const DfHeadlineTypeName = 'HEADLINE';

export const HeaderType = {
  h1: 'h1',
  h2: 'h2',
  h3: 'h3'
} as const;
export type HeaderType = (typeof HeaderType)[keyof typeof HeaderType];

export type DfHeadlineConfig = HeadlineWithSublineConfig | HeadlineOnlyConfig;

export interface DfHeadlineBaseConfig extends DfBaseConfig {
  /**
   * Specifies the type of the field as `HEADLINE`.
   */
  type: typeof DfHeadlineTypeName;

  /**
   * This field's label.
   * It's translatable by default and supports string interpolation.
   * @examples ["My label", "My label {$['bb-pgr-simple'].person.firstName}"]
   */
  label: string;

  /**
   * Defines the level of the HTML heading element and the visual appearance of the headline.
   */
  headerType: HeaderType;
}

interface HeadlineWithSublineConfig extends DfHeadlineBaseConfig {
  /**
   * Defines the level of the HTML heading element and the visual appearance of the headline.
   */
  headerType: 'h1';

  /**
   * An optional subline only for headlines with headerType h1
   */
  subline?: string;
}

interface HeadlineOnlyConfig extends DfHeadlineBaseConfig {
  /**
   * Defines the level of the HTML heading element and the visual appearance of the headline.
   */
  headerType: 'h2' | 'h3';

  /**
   * An optional subline only for headlines with headerType h1
   */
  subline?: never;
}

results matching ""

    No results matching ""