@duetds/components/lib/types/components.d.ts

This package includes Duet Components and related tools.

/* tslint:disable */
/**
 * This is an autogenerated file created by the Stencil compiler.
 * It contains typing information for all components that exist in this project.
 */


import { HTMLStencilElement, JSXBase } from './stencil.core';


export namespace Components {
  interface DuetButton {
    /**
    * Use this prop to add an aria-controls attribute to the button. Use the attribute to point to the unique id of the content that the button manages.
    */
    'accessibleControls': string;
    /**
    * If a button expands or collapses adjacent content, then use the ariaExpanded prop to add the aria-expanded attribute to the button. Set the value to convey the current expanded (true) or collapsed (false) state of the content.
    */
    'accessibleExpanded': boolean;
    /**
    * Adds accessible label for the button that is only shown for screen readers. Typically, this label text replaces the visible text on the button for users who use assistive technology.
    */
    'accessibleLabel': string;
    /**
    * Tells screen reader the element is pressed.
    */
    'accessiblePressed': boolean;
    /**
    * Makes the button component disabled. This prevents users from being able to interact with the button, and conveys its inactive state to assistive technologies.
    */
    'disabled': boolean;
    /**
    * Expands the button to fill 100% of the container width.
    */
    'expand': boolean;
    /**
    * Forces URL to open in a new browser tab. Used together with URL prop.
    */
    'external': boolean;
    /**
    * Icon to display to the left of the button content
    */
    'icon': string;
    /**
    * Show icon on the right side of the button content.
    */
    'iconRight': boolean;
    /**
    * Adds a unique identifier for the button.
    */
    'identifier': string;
    /**
    * Allows the button to submit a form.
    */
    'submit': boolean;
    /**
    * Theme of the button. Can be one of: default, turva.
    */
    'theme': string;
    /**
    * A destination to link to, rendered in the href attribute of a link.
    */
    'url': string;
    /**
    * Style variation of the button. Can be one of: default, primary, secondary, negative, loading, destructive, plain.
    */
    'variation': string;
  }
  interface DuetCard {
    /**
    * The content for the card title
    */
    'cardTitle': string;
    /**
    * The padding for the card. Can be one of: large, medium, small.
    */
    'padding': string;
    /**
    * Theme of the card. Can be one of: default, turva.
    */
    'theme': string;
    /**
    * A destination to link to, rendered in the href attribute of a link.
    */
    'url': string;
  }
  interface DuetCheckbox {
    /**
    * Indicates the id of a related component’s visually focused element.
    */
    'accessibleActiveDescendant': string;
    /**
    * Use this prop to add an aria-controls attribute. Use the attribute to indicate the id of a component controlled by this component.
    */
    'accessibleControls': string;
    /**
    * Indicates the id of a component owned by the checkbox.
    */
    'accessibleOwns': string;
    /**
    * Check state of the checkbox.
    */
    'checked': boolean;
    /**
    * Makes the checkbox component disabled. This prevents users from being able to interact with the checkbox, and conveys its inactive state to assistive technologies.
    */
    'disabled': boolean;
    /**
    * Additional hint text to display.
    */
    'helpText': string;
    /**
    * Adds a unique identifier for the checkbox.
    */
    'identifier': string;
    /**
    * Label for the checkbox
    */
    'label': string;
    /**
    * Name of the checkbox.
    */
    'name': string;
    /**
    * Set whether the input is required or not.
    */
    'required': boolean;
    /**
    * Defines a specific role attribute for the input.
    */
    'role': string;
    /**
    * Theme of the checkbox. Can be one of: default, turva.
    */
    'theme': string;
    /**
    * Value of the input.
    */
    'value': string;
  }
  interface DuetGrid {}
  interface DuetGridCell {}
  interface DuetHeader {
    /**
    * Position of the primary navigation. Can be one of: sticky, normal.
    */
    'position': string;
    /**
    * Theme of the header. Can be one of: default, turva.
    */
    'theme': string;
    /**
    * Show public or private style variant. Can be one of: public, private.
    */
    'variant': string;
  }
  interface DuetHeading {
    /**
    * Custom color for the heading.
    */
    'color': string;
    /**
    * The heading level used for the heading. Can be one of: h1, h2, h3, h4, h5, h6.
    */
    'level': string;
    /**
    * Theme of the card. Can be one of: default, turva.
    */
    'theme': string;
  }
  interface DuetInput {
    /**
    * Indicates the id of a related component’s visually focused element.
    */
    'accessibleActiveDescendant': string;
    /**
    * Indicates what kind of user input completion suggestions are provided.
    */
    'accessibleAutocomplete': string;
    /**
    * Use this prop to add an aria-controls attribute. Use the attribute to indicate the id of a component controlled by this component.
    */
    'accessibleControls': string;
    /**
    * Indicates the id of a component owned by the input.
    */
    'accessibleOwns': string;
    /**
    * Enable or disable automatic completion by the browser
    */
    'autoComplete': string;
    /**
    * Automatically focus the input.
    */
    'autofocus': boolean;
    /**
    * Makes the input component disabled. This prevents users from being able to interact with the input, and conveys its inactive state to assistive technologies.
    */
    'disabled': boolean;
    /**
    * Expands the input to fill 100% of the container width.
    */
    'expand': boolean;
    /**
    * Additional hint text to display.
    */
    'helpText': string;
    /**
    * Adds a unique identifier for the input.
    */
    'identifier': string;
    /**
    * Text to display before value.
    */
    'inputPrefix': string;
    /**
    * Text to display after value.
    */
    'inputSuffix': string;
    /**
    * Label for the input.
    */
    'label': string;
    /**
    * Visually hide the label, but still show it to screen readers.
    */
    'labelHidden': boolean;
    /**
    * Maximum character length for an input.
    */
    'maxLength': number;
    /**
    * Minimum character length for an input.
    */
    'minLength': number;
    /**
    * Name of the input.
    */
    'name': string;
    /**
    * A regular expression to check the value against
    */
    'pattern': string;
    /**
    * Hint text to display
    */
    'placeholder': string;
    /**
    * Set whether the input is required or not.
    */
    'required': boolean;
    /**
    * Defines a specific role attribute for the input
    */
    'role': string;
    /**
    * Indicate whether value should have spelling checked
    */
    'spellCheck': boolean;
    /**
    * Theme of the input. Can be one of: default, turva.
    */
    'theme': string;
    /**
    * Type of the input. Can be one of: text, email, number, password, search, tel, time.
    */
    'type': string;
    /**
    * Value of the input.
    */
    'value': string;
  }
  interface DuetLayout {
    /**
    * Layout variation. Can be one of: one-column, two-column.
    */
    'variation': string;
  }
  interface DuetParagraph {
    /**
    * Custom color for the paragraph.
    */
    'color': string;
    /**
    * Theme of the card. Can be one of: default, turva.
    */
    'theme': string;
  }
  interface DuetRadio {
    /**
    * Indicates the id of a related component’s visually focused element.
    */
    'accessibleActiveDescendant': string;
    /**
    * Use this prop to add an aria-controls attribute. Use the attribute to indicate the id of a component controlled by this component.
    */
    'accessibleControls': string;
    /**
    * Indicates the id of a component owned by the radio.
    */
    'accessibleOwns': string;
    /**
    * Check state of the radio.
    */
    'checked': boolean;
    /**
    * Makes the radio component disabled. This prevents users from being able to interact with the radio, and conveys its inactive state to assistive technologies.
    */
    'disabled': boolean;
    /**
    * Determines, whether the control is displayed horizontally or vertically within a group.
    */
    'groupDirection': string;
    /**
    * Determines, whether the control is disabled from the parent group
    */
    'groupDisabled': boolean;
    /**
    * Additional hint text to display.
    */
    'helpText': string;
    /**
    * Adds a unique identifier for the radio.
    */
    'identifier': string;
    /**
    * Label for the radio
    */
    'label': string;
    /**
    * Name of the radio.
    */
    'name': string;
    /**
    * Defines a specific role attribute for the input.
    */
    'role': string;
    /**
    * Theme of the radio. Can be one of: default, turva.
    */
    'theme': string;
    /**
    * Value of the input.
    */
    'value': string;
  }
  interface DuetRadioGroup {
    /**
    * Direction of the radio group. Can be one of: vertical, horizontal.
    */
    'direction': string;
    /**
    * Determines, whether the control is disabled or not.
    */
    'disabled': boolean;
    /**
    * name for the radio buttons within this group.
    */
    'name': string;
    /**
    * The value of the selected radio button.
    */
    'value': string;
  }
  interface DuetSpinner {
    /**
    * Adds accessible label for the spinner that is only shown for screen readers.
    */
    'accessibleLabel': string;
    /**
    * Color of the spinner, as a design token. Example: “tokens.colorPrimary”.
    */
    'color': string;
    /**
    * Size variation of the spinner. Can be one of: small, medium, large.
    */
    'size': string;
  }
  interface DuetTextarea {
    /**
    * Indicates the id of a related component’s visually focused element.
    */
    'accessibleActiveDescendant': string;
    /**
    * Indicates what kind of user input completion suggestions are provided.
    */
    'accessibleAutocomplete': string;
    /**
    * Use this prop to add an aria-controls attribute. Use the attribute to indicate the id of a component controlled by this component.
    */
    'accessibleControls': string;
    /**
    * Indicates the id of a component owned by the textarea.
    */
    'accessibleOwns': string;
    /**
    * Automatically focus the textarea.
    */
    'autofocus': boolean;
    /**
    * Makes the textarea component disabled. This prevents users from being able to interact with the textarea, and conveys its inactive state to assistive technologies.
    */
    'disabled': boolean;
    /**
    * Expands the textarea to fill 100% of the container width.
    */
    'expand': boolean;
    /**
    * Additional hint text to display.
    */
    'helpText': string;
    /**
    * Adds a unique identifier for the textarea.
    */
    'identifier': string;
    /**
    * Label for the textarea.
    */
    'label': string;
    /**
    * Visually hide the label, but still show it to screen readers.
    */
    'labelHidden': boolean;
    /**
    * Maximum character length for textarea.
    */
    'maxLength': number;
    /**
    * Minimum character length for textarea.
    */
    'minLength': number;
    /**
    * Name of the textarea.
    */
    'name': string;
    /**
    * Hint text to display.
    */
    'placeholder': string;
    /**
    * Set whether the textarea is required or not.
    */
    'required': boolean;
    /**
    * Defines a specific role attribute for the input.
    */
    'role': string;
    /**
    * Indicate whether value should have spelling checked.
    */
    'spellCheck': boolean;
    /**
    * Theme of the textarea. Can be one of: default, turva.
    */
    'theme': string;
    /**
    * Value of the textarea.
    */
    'value': string;
  }
  interface DuetTooltip {
    /**
    * Toggle whether the tooltip is visible or not.
    */
    'active': boolean;
    /**
    * Position of the tooltip. Can be one of: top-left, top-center, top-right, bottom-left, bottom-center, bottom-right.
    */
    'position': string;
    /**
    * Theme of the tooltip. Can be one of: default, turva.
    */
    'theme': string;
  }
}

declare global {


  interface HTMLDuetButtonElement extends Components.DuetButton, HTMLStencilElement {}
  var HTMLDuetButtonElement: {
    prototype: HTMLDuetButtonElement;
    new (): HTMLDuetButtonElement;
  };

  interface HTMLDuetCardElement extends Components.DuetCard, HTMLStencilElement {}
  var HTMLDuetCardElement: {
    prototype: HTMLDuetCardElement;
    new (): HTMLDuetCardElement;
  };

  interface HTMLDuetCheckboxElement extends Components.DuetCheckbox, HTMLStencilElement {}
  var HTMLDuetCheckboxElement: {
    prototype: HTMLDuetCheckboxElement;
    new (): HTMLDuetCheckboxElement;
  };

  interface HTMLDuetGridElement extends Components.DuetGrid, HTMLStencilElement {}
  var HTMLDuetGridElement: {
    prototype: HTMLDuetGridElement;
    new (): HTMLDuetGridElement;
  };

  interface HTMLDuetGridCellElement extends Components.DuetGridCell, HTMLStencilElement {}
  var HTMLDuetGridCellElement: {
    prototype: HTMLDuetGridCellElement;
    new (): HTMLDuetGridCellElement;
  };

  interface HTMLDuetHeaderElement extends Components.DuetHeader, HTMLStencilElement {}
  var HTMLDuetHeaderElement: {
    prototype: HTMLDuetHeaderElement;
    new (): HTMLDuetHeaderElement;
  };

  interface HTMLDuetHeadingElement extends Components.DuetHeading, HTMLStencilElement {}
  var HTMLDuetHeadingElement: {
    prototype: HTMLDuetHeadingElement;
    new (): HTMLDuetHeadingElement;
  };

  interface HTMLDuetInputElement extends Components.DuetInput, HTMLStencilElement {}
  var HTMLDuetInputElement: {
    prototype: HTMLDuetInputElement;
    new (): HTMLDuetInputElement;
  };

  interface HTMLDuetLayoutElement extends Components.DuetLayout, HTMLStencilElement {}
  var HTMLDuetLayoutElement: {
    prototype: HTMLDuetLayoutElement;
    new (): HTMLDuetLayoutElement;
  };

  interface HTMLDuetParagraphElement extends Components.DuetParagraph, HTMLStencilElement {}
  var HTMLDuetParagraphElement: {
    prototype: HTMLDuetParagraphElement;
    new (): HTMLDuetParagraphElement;
  };

  interface HTMLDuetRadioElement extends Components.DuetRadio, HTMLStencilElement {}
  var HTMLDuetRadioElement: {
    prototype: HTMLDuetRadioElement;
    new (): HTMLDuetRadioElement;
  };

  interface HTMLDuetRadioGroupElement extends Components.DuetRadioGroup, HTMLStencilElement {}
  var HTMLDuetRadioGroupElement: {
    prototype: HTMLDuetRadioGroupElement;
    new (): HTMLDuetRadioGroupElement;
  };

  interface HTMLDuetSpinnerElement extends Components.DuetSpinner, HTMLStencilElement {}
  var HTMLDuetSpinnerElement: {
    prototype: HTMLDuetSpinnerElement;
    new (): HTMLDuetSpinnerElement;
  };

  interface HTMLDuetTextareaElement extends Components.DuetTextarea, HTMLStencilElement {}
  var HTMLDuetTextareaElement: {
    prototype: HTMLDuetTextareaElement;
    new (): HTMLDuetTextareaElement;
  };

  interface HTMLDuetTooltipElement extends Components.DuetTooltip, HTMLStencilElement {}
  var HTMLDuetTooltipElement: {
    prototype: HTMLDuetTooltipElement;
    new (): HTMLDuetTooltipElement;
  };
  interface HTMLElementTagNameMap {
    'duet-button': HTMLDuetButtonElement;
    'duet-card': HTMLDuetCardElement;
    'duet-checkbox': HTMLDuetCheckboxElement;
    'duet-grid': HTMLDuetGridElement;
    'duet-grid-cell': HTMLDuetGridCellElement;
    'duet-header': HTMLDuetHeaderElement;
    'duet-heading': HTMLDuetHeadingElement;
    'duet-input': HTMLDuetInputElement;
    'duet-layout': HTMLDuetLayoutElement;
    'duet-paragraph': HTMLDuetParagraphElement;
    'duet-radio': HTMLDuetRadioElement;
    'duet-radio-group': HTMLDuetRadioGroupElement;
    'duet-spinner': HTMLDuetSpinnerElement;
    'duet-textarea': HTMLDuetTextareaElement;
    'duet-tooltip': HTMLDuetTooltipElement;
  }
}

declare namespace LocalJSX {
  interface DuetButton extends JSXBase.HTMLAttributes<HTMLDuetButtonElement> {
    /**
    * Use this prop to add an aria-controls attribute to the button. Use the attribute to point to the unique id of the content that the button manages.
    */
    'accessibleControls'?: string;
    /**
    * If a button expands or collapses adjacent content, then use the ariaExpanded prop to add the aria-expanded attribute to the button. Set the value to convey the current expanded (true) or collapsed (false) state of the content.
    */
    'accessibleExpanded'?: boolean;
    /**
    * Adds accessible label for the button that is only shown for screen readers. Typically, this label text replaces the visible text on the button for users who use assistive technology.
    */
    'accessibleLabel'?: string;
    /**
    * Tells screen reader the element is pressed.
    */
    'accessiblePressed'?: boolean;
    /**
    * Makes the button component disabled. This prevents users from being able to interact with the button, and conveys its inactive state to assistive technologies.
    */
    'disabled'?: boolean;
    /**
    * Expands the button to fill 100% of the container width.
    */
    'expand'?: boolean;
    /**
    * Forces URL to open in a new browser tab. Used together with URL prop.
    */
    'external'?: boolean;
    /**
    * Icon to display to the left of the button content
    */
    'icon'?: string;
    /**
    * Show icon on the right side of the button content.
    */
    'iconRight'?: boolean;
    /**
    * Adds a unique identifier for the button.
    */
    'identifier'?: string;
    /**
    * Allows the button to submit a form.
    */
    'submit'?: boolean;
    /**
    * Theme of the button. Can be one of: default, turva.
    */
    'theme'?: string;
    /**
    * A destination to link to, rendered in the href attribute of a link.
    */
    'url'?: string;
    /**
    * Style variation of the button. Can be one of: default, primary, secondary, negative, loading, destructive, plain.
    */
    'variation'?: string;
  }
  interface DuetCard extends JSXBase.HTMLAttributes<HTMLDuetCardElement> {
    /**
    * The content for the card title
    */
    'cardTitle'?: string;
    /**
    * The padding for the card. Can be one of: large, medium, small.
    */
    'padding'?: string;
    /**
    * Theme of the card. Can be one of: default, turva.
    */
    'theme'?: string;
    /**
    * A destination to link to, rendered in the href attribute of a link.
    */
    'url'?: string;
  }
  interface DuetCheckbox extends JSXBase.HTMLAttributes<HTMLDuetCheckboxElement> {
    /**
    * Indicates the id of a related component’s visually focused element.
    */
    'accessibleActiveDescendant'?: string;
    /**
    * Use this prop to add an aria-controls attribute. Use the attribute to indicate the id of a component controlled by this component.
    */
    'accessibleControls'?: string;
    /**
    * Indicates the id of a component owned by the checkbox.
    */
    'accessibleOwns'?: string;
    /**
    * Check state of the checkbox.
    */
    'checked'?: boolean;
    /**
    * Makes the checkbox component disabled. This prevents users from being able to interact with the checkbox, and conveys its inactive state to assistive technologies.
    */
    'disabled'?: boolean;
    /**
    * Additional hint text to display.
    */
    'helpText'?: string;
    /**
    * Adds a unique identifier for the checkbox.
    */
    'identifier'?: string;
    /**
    * Label for the checkbox
    */
    'label'?: string;
    /**
    * Name of the checkbox.
    */
    'name'?: string;
    /**
    * Set whether the input is required or not.
    */
    'required'?: boolean;
    /**
    * Defines a specific role attribute for the input.
    */
    'role'?: string;
    /**
    * Theme of the checkbox. Can be one of: default, turva.
    */
    'theme'?: string;
    /**
    * Value of the input.
    */
    'value'?: string;
  }
  interface DuetGrid extends JSXBase.HTMLAttributes<HTMLDuetGridElement> {}
  interface DuetGridCell extends JSXBase.HTMLAttributes<HTMLDuetGridCellElement> {}
  interface DuetHeader extends JSXBase.HTMLAttributes<HTMLDuetHeaderElement> {
    /**
    * Position of the primary navigation. Can be one of: sticky, normal.
    */
    'position'?: string;
    /**
    * Theme of the header. Can be one of: default, turva.
    */
    'theme'?: string;
    /**
    * Show public or private style variant. Can be one of: public, private.
    */
    'variant'?: string;
  }
  interface DuetHeading extends JSXBase.HTMLAttributes<HTMLDuetHeadingElement> {
    /**
    * Custom color for the heading.
    */
    'color'?: string;
    /**
    * The heading level used for the heading. Can be one of: h1, h2, h3, h4, h5, h6.
    */
    'level'?: string;
    /**
    * Theme of the card. Can be one of: default, turva.
    */
    'theme'?: string;
  }
  interface DuetInput extends JSXBase.HTMLAttributes<HTMLDuetInputElement> {
    /**
    * Indicates the id of a related component’s visually focused element.
    */
    'accessibleActiveDescendant'?: string;
    /**
    * Indicates what kind of user input completion suggestions are provided.
    */
    'accessibleAutocomplete'?: string;
    /**
    * Use this prop to add an aria-controls attribute. Use the attribute to indicate the id of a component controlled by this component.
    */
    'accessibleControls'?: string;
    /**
    * Indicates the id of a component owned by the input.
    */
    'accessibleOwns'?: string;
    /**
    * Enable or disable automatic completion by the browser
    */
    'autoComplete'?: string;
    /**
    * Automatically focus the input.
    */
    'autofocus'?: boolean;
    /**
    * Makes the input component disabled. This prevents users from being able to interact with the input, and conveys its inactive state to assistive technologies.
    */
    'disabled'?: boolean;
    /**
    * Expands the input to fill 100% of the container width.
    */
    'expand'?: boolean;
    /**
    * Additional hint text to display.
    */
    'helpText'?: string;
    /**
    * Adds a unique identifier for the input.
    */
    'identifier'?: string;
    /**
    * Text to display before value.
    */
    'inputPrefix'?: string;
    /**
    * Text to display after value.
    */
    'inputSuffix'?: string;
    /**
    * Label for the input.
    */
    'label'?: string;
    /**
    * Visually hide the label, but still show it to screen readers.
    */
    'labelHidden'?: boolean;
    /**
    * Maximum character length for an input.
    */
    'maxLength'?: number;
    /**
    * Minimum character length for an input.
    */
    'minLength'?: number;
    /**
    * Name of the input.
    */
    'name'?: string;
    /**
    * A regular expression to check the value against
    */
    'pattern'?: string;
    /**
    * Hint text to display
    */
    'placeholder'?: string;
    /**
    * Set whether the input is required or not.
    */
    'required'?: boolean;
    /**
    * Defines a specific role attribute for the input
    */
    'role'?: string;
    /**
    * Indicate whether value should have spelling checked
    */
    'spellCheck'?: boolean;
    /**
    * Theme of the input. Can be one of: default, turva.
    */
    'theme'?: string;
    /**
    * Type of the input. Can be one of: text, email, number, password, search, tel, time.
    */
    'type'?: string;
    /**
    * Value of the input.
    */
    'value'?: string;
  }
  interface DuetLayout extends JSXBase.HTMLAttributes<HTMLDuetLayoutElement> {
    /**
    * Layout variation. Can be one of: one-column, two-column.
    */
    'variation'?: string;
  }
  interface DuetParagraph extends JSXBase.HTMLAttributes<HTMLDuetParagraphElement> {
    /**
    * Custom color for the paragraph.
    */
    'color'?: string;
    /**
    * Theme of the card. Can be one of: default, turva.
    */
    'theme'?: string;
  }
  interface DuetRadio extends JSXBase.HTMLAttributes<HTMLDuetRadioElement> {
    /**
    * Indicates the id of a related component’s visually focused element.
    */
    'accessibleActiveDescendant'?: string;
    /**
    * Use this prop to add an aria-controls attribute. Use the attribute to indicate the id of a component controlled by this component.
    */
    'accessibleControls'?: string;
    /**
    * Indicates the id of a component owned by the radio.
    */
    'accessibleOwns'?: string;
    /**
    * Check state of the radio.
    */
    'checked'?: boolean;
    /**
    * Makes the radio component disabled. This prevents users from being able to interact with the radio, and conveys its inactive state to assistive technologies.
    */
    'disabled'?: boolean;
    /**
    * Determines, whether the control is displayed horizontally or vertically within a group.
    */
    'groupDirection'?: string;
    /**
    * Determines, whether the control is disabled from the parent group
    */
    'groupDisabled'?: boolean;
    /**
    * Additional hint text to display.
    */
    'helpText'?: string;
    /**
    * Adds a unique identifier for the radio.
    */
    'identifier'?: string;
    /**
    * Label for the radio
    */
    'label'?: string;
    /**
    * Name of the radio.
    */
    'name'?: string;
    /**
    * Callback for when the radio button is toggled.
    */
    'onChanged'?: (event: CustomEvent<MouseEvent>) => void;
    /**
    * Defines a specific role attribute for the input.
    */
    'role'?: string;
    /**
    * Theme of the radio. Can be one of: default, turva.
    */
    'theme'?: string;
    /**
    * Value of the input.
    */
    'value'?: string;
  }
  interface DuetRadioGroup extends JSXBase.HTMLAttributes<HTMLDuetRadioGroupElement> {
    /**
    * Direction of the radio group. Can be one of: vertical, horizontal.
    */
    'direction'?: string;
    /**
    * Determines, whether the control is disabled or not.
    */
    'disabled'?: boolean;
    /**
    * name for the radio buttons within this group.
    */
    'name'?: string;
    /**
    * Callback for when the value changed.
    */
    'onValueChanged'?: (event: CustomEvent<string>) => void;
    /**
    * The value of the selected radio button.
    */
    'value'?: string;
  }
  interface DuetSpinner extends JSXBase.HTMLAttributes<HTMLDuetSpinnerElement> {
    /**
    * Adds accessible label for the spinner that is only shown for screen readers.
    */
    'accessibleLabel'?: string;
    /**
    * Color of the spinner, as a design token. Example: “tokens.colorPrimary”.
    */
    'color'?: string;
    /**
    * Size variation of the spinner. Can be one of: small, medium, large.
    */
    'size'?: string;
  }
  interface DuetTextarea extends JSXBase.HTMLAttributes<HTMLDuetTextareaElement> {
    /**
    * Indicates the id of a related component’s visually focused element.
    */
    'accessibleActiveDescendant'?: string;
    /**
    * Indicates what kind of user input completion suggestions are provided.
    */
    'accessibleAutocomplete'?: string;
    /**
    * Use this prop to add an aria-controls attribute. Use the attribute to indicate the id of a component controlled by this component.
    */
    'accessibleControls'?: string;
    /**
    * Indicates the id of a component owned by the textarea.
    */
    'accessibleOwns'?: string;
    /**
    * Automatically focus the textarea.
    */
    'autofocus'?: boolean;
    /**
    * Makes the textarea component disabled. This prevents users from being able to interact with the textarea, and conveys its inactive state to assistive technologies.
    */
    'disabled'?: boolean;
    /**
    * Expands the textarea to fill 100% of the container width.
    */
    'expand'?: boolean;
    /**
    * Additional hint text to display.
    */
    'helpText'?: string;
    /**
    * Adds a unique identifier for the textarea.
    */
    'identifier'?: string;
    /**
    * Label for the textarea.
    */
    'label'?: string;
    /**
    * Visually hide the label, but still show it to screen readers.
    */
    'labelHidden'?: boolean;
    /**
    * Maximum character length for textarea.
    */
    'maxLength'?: number;
    /**
    * Minimum character length for textarea.
    */
    'minLength'?: number;
    /**
    * Name of the textarea.
    */
    'name'?: string;
    /**
    * Hint text to display.
    */
    'placeholder'?: string;
    /**
    * Set whether the textarea is required or not.
    */
    'required'?: boolean;
    /**
    * Defines a specific role attribute for the input.
    */
    'role'?: string;
    /**
    * Indicate whether value should have spelling checked.
    */
    'spellCheck'?: boolean;
    /**
    * Theme of the textarea. Can be one of: default, turva.
    */
    'theme'?: string;
    /**
    * Value of the textarea.
    */
    'value'?: string;
  }
  interface DuetTooltip extends JSXBase.HTMLAttributes<HTMLDuetTooltipElement> {
    /**
    * Toggle whether the tooltip is visible or not.
    */
    'active'?: boolean;
    /**
    * Position of the tooltip. Can be one of: top-left, top-center, top-right, bottom-left, bottom-center, bottom-right.
    */
    'position'?: string;
    /**
    * Theme of the tooltip. Can be one of: default, turva.
    */
    'theme'?: string;
  }

  interface IntrinsicElements {
    'duet-button': DuetButton;
    'duet-card': DuetCard;
    'duet-checkbox': DuetCheckbox;
    'duet-grid': DuetGrid;
    'duet-grid-cell': DuetGridCell;
    'duet-header': DuetHeader;
    'duet-heading': DuetHeading;
    'duet-input': DuetInput;
    'duet-layout': DuetLayout;
    'duet-paragraph': DuetParagraph;
    'duet-radio': DuetRadio;
    'duet-radio-group': DuetRadioGroup;
    'duet-spinner': DuetSpinner;
    'duet-textarea': DuetTextarea;
    'duet-tooltip': DuetTooltip;
  }
}

export { LocalJSX as JSX };


declare module "@stencil/core" {
  export namespace JSX {
    interface IntrinsicElements extends LocalJSX.IntrinsicElements {}
  }
}