import { DfInteractiveBaseConfig, DfOptions } from '@allianz/taly-core/dynamic-form';

/**
 * The value to use for the `type` attribute of toggle button
 * formfield configs.
 */
export const DfToggleButtonTypeName = 'TOGGLE_BUTTON';

/**
 * Configuration for a dynamic toggle button field.
 */
export interface DfToggleButtonConfig extends Omit<DfInteractiveBaseConfig, 'hint' | 'columnSpan'> {
  /**
   * Specifies the type of the field as `TOGGLE_BUTTON`.
   */
  type: typeof DfToggleButtonTypeName;

  /**
   * The `options` property can take one of two forms:
   * 1. It can be a hardcoded array of objects for direct display in a toggle button. Each object must have a `label` to display and a corresponding `value`.
   * 2. A string that represents an expression. This expression is used by an option provider service to dynamically fetch the toggle button options.
   *
   * @examples [[{"label": "The first option", "value": "1"}], "$.myExpression"]
   */
  options: DfOptions[] | string;

  /**
   * To set the size of the toggle button (`'small'` or `'large'`). The default size is `'large'`. In Expert journeys only `'small'` size is allowed.
   */
  size?: DfToggleButtonSize;
}

export const DfToggleButtonSize = {
  Small: 'small',
  Large: 'large'
} as const;

type DfToggleButtonSize = (typeof DfToggleButtonSize)[keyof typeof DfToggleButtonSize];