@ukho/admiralty-core 0.0.0

package/dist/types/components.d.ts

@@ -0,0 +1,1637 @@
+/* eslint-disable */
+/* 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-public-runtime";
+import { ButtonVariant } from "./components/button/button.types";
+import { IconName, IconPrefix } from "@fortawesome/fontawesome-svg-core";
+import { IconName as IconName1 } from "@fortawesome/free-solid-svg-icons";
+import { InputChangeEventDetail } from "./components/input/input.interface";
+export { ButtonVariant } from "./components/button/button.types";
+export { IconName, IconPrefix } from "@fortawesome/fontawesome-svg-core";
+export { IconName as IconName1 } from "@fortawesome/free-solid-svg-icons";
+export { InputChangeEventDetail } from "./components/input/input.interface";
+export namespace Components {
+    interface AdmiraltyBreadcrumb {
+        /**
+          * When `true` the breadcrumb will by styled to show that it is the currently active breadcrumb. Defaults to `true` for the last breadcrumb if it is not set on any.
+         */
+        "active": boolean;
+        "first": boolean;
+        /**
+          * Contains a URL or a URL fragment that the hyperlink points to.
+         */
+        "href": string | undefined;
+    }
+    interface AdmiraltyBreadcrumbs {
+    }
+    interface AdmiraltyButton {
+        /**
+          * Determines whether the button is disabled. A button in disabled state will not fire click output events.
+         */
+        "disabled": boolean;
+        /**
+          * When passed Font Awesome Icon name, then an icon will be rendered.
+         */
+        "icon": IconName;
+        /**
+          * The default behavior of the button. Valid values are `button`, `submit` and `reset`. Default value is `submit`.
+         */
+        "type": 'button' | 'submit' | 'reset';
+        /**
+          * The type of button to render. Valid values are `primary`, `secondary`, `warning`, `text` and `icon`. Default value is `primary`.
+         */
+        "variant": ButtonVariant;
+    }
+    interface AdmiraltyCard {
+        /**
+          * The title of the card.
+         */
+        "heading": string;
+    }
+    interface AdmiraltyCheckbox {
+        /**
+          * Whether the checkbox should be positioned to the right of the label.
+         */
+        "checkboxRight": boolean;
+        /**
+          * If `true`, the checkbox is selected.
+         */
+        "checked": boolean;
+        /**
+          * This dictates whether the form field is disabled.
+         */
+        "disabled": boolean;
+        /**
+          * The text that's displayed alongside the checkbox
+         */
+        "labelText": string;
+        /**
+          * The name of the control, which is submitted with the form data.
+         */
+        "name": string;
+        /**
+          * The value of the checkbox does not mean if it's checked or not, use the `checked` property for that.  The value of a checkbox is analogous to the value of an `<input type="checkbox">`, it's only used when the checkbox participates in a native `<form>`.
+         */
+        "value": any | null;
+    }
+    interface AdmiraltyColourBlock {
+        /**
+          * The text to display on the action button
+         */
+        "actionText": string;
+        /**
+          * The function to call when the action button is pressed.
+         */
+        "clickAction": () => any;
+        /**
+          * The background colour of the component.
+         */
+        "colour": 'admiralty-blue' | 'teal' | 'bright-blue';
+        /**
+          * The heading text to display.
+         */
+        "heading": string;
+        /**
+          * The height in pixels of the component.
+         */
+        "height": number;
+        /**
+          * The width in pixels of the component.
+         */
+        "width": number;
+    }
+    interface AdmiraltyDialogue {
+        /**
+          * The heading to display.
+         */
+        "heading": string;
+        /**
+          * The type of dialogue box to render.
+         */
+        "type": 'info' | 'warning' | 'success' | 'error';
+    }
+    interface AdmiraltyExpansion {
+        /**
+          * CWhether the heading should be right aligned.
+         */
+        "alignHeadingRight": boolean;
+        /**
+          * Whether the component is expanded.
+         */
+        "expanded": boolean;
+        /**
+          * The text to display in the heading of the expansion component.
+         */
+        "heading": string;
+        /**
+          * Whether the border on the bottom of the component should be hidden.
+         */
+        "hideBorder": boolean;
+    }
+    interface AdmiraltyFileInput {
+        /**
+          * Used to display instructions to the user and is replaced with the filename the user inputs
+         */
+        "label": string;
+        /**
+          * If true, enables multiple files to be selected or dragged
+         */
+        "multiple": boolean;
+    }
+    interface AdmiraltyFilter {
+        /**
+          * The title of the filter
+         */
+        "filterTitle": string;
+    }
+    interface AdmiraltyFilterGroup {
+        /**
+          * The title of the filter group
+         */
+        "groupTitle": string;
+    }
+    interface AdmiraltyFooter {
+        /**
+          * A description for the image displayed in the footer. This might be shown if the image fails to load or get read out by screen readers.
+         */
+        "imageAlt": string;
+        /**
+          * The URL that the image links to.
+         */
+        "imageLink": string;
+        /**
+          * The source of the image displayed in the footer.
+         */
+        "imageSrc": string;
+        /**
+          * The text to display in the footer. The default value displays crown copyright, the current year and `UK Hydrographic Office`.
+         */
+        "text": string;
+    }
+    interface AdmiraltyHeader {
+        /**
+          * The header title that is displayed to the right of the logo
+         */
+        "headerTitle": string;
+        /**
+          * The url that clicking on the nav link will take you too
+         */
+        "headerTitleUrl": string;
+        /**
+          * The alternate image text for the logo image
+         */
+        "logoAltText": string;
+        /**
+          * The uri of the logo image
+         */
+        "logoImgUrl": string;
+        /**
+          * The destination url when the logo is clicked
+         */
+        "logoLinkUrl": string;
+    }
+    interface AdmiraltyHeaderMenuItem {
+        /**
+          * The text that will be displayed in the menu
+         */
+        "active"?: boolean;
+        /**
+          * The text that will be displayed in the menu
+         */
+        "menuTitle": string;
+    }
+    interface AdmiraltyHeaderProfile {
+        /**
+          * A boolean to indicate if the user is signed in or not
+         */
+        "isSignedIn": boolean;
+        /**
+          * The text that is displayed after the user signs in
+         */
+        "signedInText": string;
+    }
+    interface AdmiraltyHeaderSubMenuItem {
+        /**
+          * The text that will be displayed in the menu
+         */
+        "menuTitle": string;
+    }
+    interface AdmiraltyHint {
+        /**
+          * The disabled option can be used to disable the component.
+         */
+        "disabled": boolean;
+    }
+    interface AdmiraltyHr {
+    }
+    interface AdmiraltyIcon {
+        /**
+          * Name of the icon to be rendered  Check out <a href="https://fontawesome.com/search?m=free}">FontAwesome</a>  for a list of icons
+         */
+        "iconName": IconName1;
+        /**
+          * The style prefix to apply to the icon  By default, icons use Font Awesome's solid style
+         */
+        "iconPrefix": IconPrefix;
+    }
+    /**
+     * Once this component works, review whether a form field component should be created so
+     * that shared properties such as `label`, `hint`, `disabled` etc. can be defined once.
+     * Examples of similar components that can extend that base component are area, select
+     * and checkbox.
+     */
+    interface AdmiraltyInput {
+        /**
+          * Indicates whether the value of the control can be automatically completed by the browser.
+         */
+        "autocomplete": string;
+        /**
+          * This dictates whether the form field is disabled.
+         */
+        "disabled": boolean;
+        /**
+          * The hint which will be used under the label to describe the input.
+         */
+        "hint": string;
+        /**
+          * Whether to show the input in an invalid state
+         */
+        "invalid": boolean;
+        /**
+          * The message to show when the input is invalid
+         */
+        "invalidMessage": string;
+        /**
+          * The label which will be used above the input to describe the input.
+         */
+        "label": string;
+        /**
+          * The name of the control, which is submitted with the form data.
+         */
+        "name": string;
+        /**
+          * The placeholder text to show in the input
+         */
+        "placeholder": string;
+        /**
+          * This dictates whether the input is required or not
+         */
+        "required": boolean;
+        /**
+          * The input type, options are: `text | date | time | email | password | tel | url`
+         */
+        "type": 'text' | 'date' | 'time' | 'email' | 'password' | 'tel' | 'url';
+        /**
+          * The value of the input.
+         */
+        "value"?: string | number | null;
+        /**
+          * The maximum width for the input field.
+         */
+        "width": number;
+    }
+    interface AdmiraltyInputError {
+    }
+    interface AdmiraltyLabel {
+        /**
+          * The disabled option can be used to disable the component.
+         */
+        "disabled": boolean;
+        /**
+          * The id of the input the label is attached to
+         */
+        "for": string;
+    }
+    interface AdmiraltyLink {
+        /**
+          * The URL that the link will navigate to.
+         */
+        "href": string;
+        /**
+          * Whether to open the URL in a new tab.
+         */
+        "newTab": boolean;
+    }
+    interface AdmiraltyPaginator {
+        /**
+          * The current page. Defaults to 1.
+         */
+        "currentPage": number;
+        /**
+          * The label to display.
+         */
+        "label": string;
+        /**
+          * The total number of pages. Defaults to 1.
+         */
+        "pages": number;
+    }
+    interface AdmiraltyPaginatorWrapper {
+    }
+    interface AdmiraltyPhaseBanner {
+        /**
+          * A link to where the end user can provide feedback
+         */
+        "link": string;
+        /**
+          * The phase for the phase banner
+         */
+        "phase": 'alpha' | 'beta';
+    }
+    interface AdmiraltyProgressBar {
+        /**
+          * Set to true to indicate an error (turns the progress bar red)
+         */
+        "error": boolean;
+        /**
+          * If set, adds a label above the progress bar
+         */
+        "label"?: string;
+        /**
+          * * A value from 0 - 100 that visually represents the current progression
+         */
+        "progression": number;
+    }
+    interface AdmiraltyRadio {
+        /**
+          * Determines whether the radio button is selected (or checked)
+         */
+        "checked"?: boolean;
+        /**
+          * Determines whether the radio button is disabled. A button in disabled state will not fire click output events.
+         */
+        "disabled"?: boolean;
+        /**
+          * The name of the radio button for use on selection within a radio group
+         */
+        "name": string;
+        "setButtonTabindex": (value: number) => Promise<void>;
+        /**
+          * The value of the radio button for use on selection within a radio group
+         */
+        "value": string | null;
+    }
+    interface AdmiraltyRadioGroup {
+        /**
+          * Setting this true displays the radio options vertically (defaults to false)
+         */
+        "displayVertical": boolean;
+        /**
+          * The name of the control, which is submitted with the form data
+         */
+        "name": string;
+        /**
+          * The value of the radio group
+         */
+        "value": any | null;
+    }
+    interface AdmiraltySelect {
+        /**
+          * If `true`, the user cannot interact with the select.
+         */
+        "disabled": boolean;
+        /**
+          * If 'true', the 'error' class is added to suggest an error
+         */
+        "error": boolean;
+        /**
+          * The hint that is used to inform the user of an error (displayed below the select box)
+         */
+        "errorHint": string;
+        /**
+          * The text that will be used as a field label.
+         */
+        "hint": string;
+        /**
+          * The text that will be used as a field label.
+         */
+        "label": string;
+        /**
+          * The maximum width (px) for the input field.
+         */
+        "width"?: number;
+    }
+    interface AdmiraltySideNav {
+        /**
+          * A label for accessibility purposes to describe what this Side Nav navigation is for e.g. Product Menu, Map Tool Menu etc.
+         */
+        "label": string;
+    }
+    interface AdmiraltySideNavItem {
+        /**
+          * The text that is displayed in the SideNavItem
+         */
+        "headingTitle": string;
+        /**
+          * Represents whether this SideNavItem is 'active' and will be styled differently than SideNavItems that are not 'active'. The intent behind the design for SideNav is for there to only be ONE SideNavItem that is 'active' per SideNav
+         */
+        "navActive": boolean;
+        /**
+          * A unique id for this SideNavItem
+         */
+        "sideNavItemId": string;
+    }
+    interface AdmiraltySideNavWrapper {
+    }
+    /**
+     * Use tables to make information easier for users to scan and compare
+     */
+    interface AdmiraltyTable {
+        "caption": string;
+    }
+    /**
+     * The table body element is a wrapper for a standard html table body and should be used to wrap rows
+     */
+    interface AdmiraltyTableBody {
+    }
+    /**
+     * The table cell is a wrapper for a standard <td> element and should be used inside of table rows
+     */
+    interface AdmiraltyTableCell {
+    }
+    /**
+     * The table header should be used inside a table element to give headers to all the columns
+     */
+    interface AdmiraltyTableHeader {
+    }
+    /**
+     * The table header cell element is used for showing headings for the columns
+     */
+    interface AdmiraltyTableHeaderCell {
+    }
+    /**
+     * The table row element should be used to define rows within the table body
+     */
+    interface AdmiraltyTableRow {
+    }
+    interface AdmiraltyTextarea {
+        /**
+          * This dictates whether the form field is disabled.
+         */
+        "disabled": boolean;
+        /**
+          * The hint which will be used under the label to describe the input.
+         */
+        "hint": string;
+        /**
+          * Whether to show the input in an invalid state
+         */
+        "invalid": boolean;
+        /**
+          * The message to show when the input is invalid
+         */
+        "invalidMessage": string;
+        /**
+          * The label which will be used as a placeholder in the unfilled state, and as a field label in the filled state.
+         */
+        "label": string;
+        /**
+          * The contents of the textarea
+         */
+        "text": string;
+        /**
+          * The maximum width for the input field.
+         */
+        "width"?: number;
+    }
+    interface AdmiraltyTypeAhead {
+        /**
+          * The text content of the label for the input box
+         */
+        "label": string;
+        /**
+          * The placeholder text for the input field
+         */
+        "placeholder": string;
+        /**
+          * Optional property to show results when input box is initally focused
+         */
+        "resultsOnInitFocus": boolean;
+        /**
+          * The value of the textinput
+         */
+        "value": string;
+    }
+    interface AdmiraltyTypeAheadItem {
+        "value": string;
+    }
+}
+export interface AdmiraltyCheckboxCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLAdmiraltyCheckboxElement;
+}
+export interface AdmiraltyExpansionCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLAdmiraltyExpansionElement;
+}
+export interface AdmiraltyFileInputCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLAdmiraltyFileInputElement;
+}
+export interface AdmiraltyFilterCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLAdmiraltyFilterElement;
+}
+export interface AdmiraltyHeaderCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLAdmiraltyHeaderElement;
+}
+export interface AdmiraltyHeaderMenuItemCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLAdmiraltyHeaderMenuItemElement;
+}
+export interface AdmiraltyHeaderProfileCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLAdmiraltyHeaderProfileElement;
+}
+export interface AdmiraltyHeaderSubMenuItemCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLAdmiraltyHeaderSubMenuItemElement;
+}
+export interface AdmiraltyInputCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLAdmiraltyInputElement;
+}
+export interface AdmiraltyPaginatorCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLAdmiraltyPaginatorElement;
+}
+export interface AdmiraltyRadioCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLAdmiraltyRadioElement;
+}
+export interface AdmiraltyRadioGroupCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLAdmiraltyRadioGroupElement;
+}
+export interface AdmiraltySelectCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLAdmiraltySelectElement;
+}
+export interface AdmiraltySideNavItemCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLAdmiraltySideNavItemElement;
+}
+export interface AdmiraltyTextareaCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLAdmiraltyTextareaElement;
+}
+export interface AdmiraltyTypeAheadCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLAdmiraltyTypeAheadElement;
+}
+declare global {
+    interface HTMLAdmiraltyBreadcrumbElement extends Components.AdmiraltyBreadcrumb, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyBreadcrumbElement: {
+        prototype: HTMLAdmiraltyBreadcrumbElement;
+        new (): HTMLAdmiraltyBreadcrumbElement;
+    };
+    interface HTMLAdmiraltyBreadcrumbsElement extends Components.AdmiraltyBreadcrumbs, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyBreadcrumbsElement: {
+        prototype: HTMLAdmiraltyBreadcrumbsElement;
+        new (): HTMLAdmiraltyBreadcrumbsElement;
+    };
+    interface HTMLAdmiraltyButtonElement extends Components.AdmiraltyButton, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyButtonElement: {
+        prototype: HTMLAdmiraltyButtonElement;
+        new (): HTMLAdmiraltyButtonElement;
+    };
+    interface HTMLAdmiraltyCardElement extends Components.AdmiraltyCard, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyCardElement: {
+        prototype: HTMLAdmiraltyCardElement;
+        new (): HTMLAdmiraltyCardElement;
+    };
+    interface HTMLAdmiraltyCheckboxElement extends Components.AdmiraltyCheckbox, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyCheckboxElement: {
+        prototype: HTMLAdmiraltyCheckboxElement;
+        new (): HTMLAdmiraltyCheckboxElement;
+    };
+    interface HTMLAdmiraltyColourBlockElement extends Components.AdmiraltyColourBlock, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyColourBlockElement: {
+        prototype: HTMLAdmiraltyColourBlockElement;
+        new (): HTMLAdmiraltyColourBlockElement;
+    };
+    interface HTMLAdmiraltyDialogueElement extends Components.AdmiraltyDialogue, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyDialogueElement: {
+        prototype: HTMLAdmiraltyDialogueElement;
+        new (): HTMLAdmiraltyDialogueElement;
+    };
+    interface HTMLAdmiraltyExpansionElement extends Components.AdmiraltyExpansion, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyExpansionElement: {
+        prototype: HTMLAdmiraltyExpansionElement;
+        new (): HTMLAdmiraltyExpansionElement;
+    };
+    interface HTMLAdmiraltyFileInputElement extends Components.AdmiraltyFileInput, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyFileInputElement: {
+        prototype: HTMLAdmiraltyFileInputElement;
+        new (): HTMLAdmiraltyFileInputElement;
+    };
+    interface HTMLAdmiraltyFilterElement extends Components.AdmiraltyFilter, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyFilterElement: {
+        prototype: HTMLAdmiraltyFilterElement;
+        new (): HTMLAdmiraltyFilterElement;
+    };
+    interface HTMLAdmiraltyFilterGroupElement extends Components.AdmiraltyFilterGroup, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyFilterGroupElement: {
+        prototype: HTMLAdmiraltyFilterGroupElement;
+        new (): HTMLAdmiraltyFilterGroupElement;
+    };
+    interface HTMLAdmiraltyFooterElement extends Components.AdmiraltyFooter, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyFooterElement: {
+        prototype: HTMLAdmiraltyFooterElement;
+        new (): HTMLAdmiraltyFooterElement;
+    };
+    interface HTMLAdmiraltyHeaderElement extends Components.AdmiraltyHeader, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyHeaderElement: {
+        prototype: HTMLAdmiraltyHeaderElement;
+        new (): HTMLAdmiraltyHeaderElement;
+    };
+    interface HTMLAdmiraltyHeaderMenuItemElement extends Components.AdmiraltyHeaderMenuItem, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyHeaderMenuItemElement: {
+        prototype: HTMLAdmiraltyHeaderMenuItemElement;
+        new (): HTMLAdmiraltyHeaderMenuItemElement;
+    };
+    interface HTMLAdmiraltyHeaderProfileElement extends Components.AdmiraltyHeaderProfile, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyHeaderProfileElement: {
+        prototype: HTMLAdmiraltyHeaderProfileElement;
+        new (): HTMLAdmiraltyHeaderProfileElement;
+    };
+    interface HTMLAdmiraltyHeaderSubMenuItemElement extends Components.AdmiraltyHeaderSubMenuItem, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyHeaderSubMenuItemElement: {
+        prototype: HTMLAdmiraltyHeaderSubMenuItemElement;
+        new (): HTMLAdmiraltyHeaderSubMenuItemElement;
+    };
+    interface HTMLAdmiraltyHintElement extends Components.AdmiraltyHint, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyHintElement: {
+        prototype: HTMLAdmiraltyHintElement;
+        new (): HTMLAdmiraltyHintElement;
+    };
+    interface HTMLAdmiraltyHrElement extends Components.AdmiraltyHr, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyHrElement: {
+        prototype: HTMLAdmiraltyHrElement;
+        new (): HTMLAdmiraltyHrElement;
+    };
+    interface HTMLAdmiraltyIconElement extends Components.AdmiraltyIcon, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyIconElement: {
+        prototype: HTMLAdmiraltyIconElement;
+        new (): HTMLAdmiraltyIconElement;
+    };
+    /**
+     * Once this component works, review whether a form field component should be created so
+     * that shared properties such as `label`, `hint`, `disabled` etc. can be defined once.
+     * Examples of similar components that can extend that base component are area, select
+     * and checkbox.
+     */
+    interface HTMLAdmiraltyInputElement extends Components.AdmiraltyInput, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyInputElement: {
+        prototype: HTMLAdmiraltyInputElement;
+        new (): HTMLAdmiraltyInputElement;
+    };
+    interface HTMLAdmiraltyInputErrorElement extends Components.AdmiraltyInputError, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyInputErrorElement: {
+        prototype: HTMLAdmiraltyInputErrorElement;
+        new (): HTMLAdmiraltyInputErrorElement;
+    };
+    interface HTMLAdmiraltyLabelElement extends Components.AdmiraltyLabel, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyLabelElement: {
+        prototype: HTMLAdmiraltyLabelElement;
+        new (): HTMLAdmiraltyLabelElement;
+    };
+    interface HTMLAdmiraltyLinkElement extends Components.AdmiraltyLink, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyLinkElement: {
+        prototype: HTMLAdmiraltyLinkElement;
+        new (): HTMLAdmiraltyLinkElement;
+    };
+    interface HTMLAdmiraltyPaginatorElement extends Components.AdmiraltyPaginator, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyPaginatorElement: {
+        prototype: HTMLAdmiraltyPaginatorElement;
+        new (): HTMLAdmiraltyPaginatorElement;
+    };
+    interface HTMLAdmiraltyPaginatorWrapperElement extends Components.AdmiraltyPaginatorWrapper, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyPaginatorWrapperElement: {
+        prototype: HTMLAdmiraltyPaginatorWrapperElement;
+        new (): HTMLAdmiraltyPaginatorWrapperElement;
+    };
+    interface HTMLAdmiraltyPhaseBannerElement extends Components.AdmiraltyPhaseBanner, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyPhaseBannerElement: {
+        prototype: HTMLAdmiraltyPhaseBannerElement;
+        new (): HTMLAdmiraltyPhaseBannerElement;
+    };
+    interface HTMLAdmiraltyProgressBarElement extends Components.AdmiraltyProgressBar, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyProgressBarElement: {
+        prototype: HTMLAdmiraltyProgressBarElement;
+        new (): HTMLAdmiraltyProgressBarElement;
+    };
+    interface HTMLAdmiraltyRadioElement extends Components.AdmiraltyRadio, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyRadioElement: {
+        prototype: HTMLAdmiraltyRadioElement;
+        new (): HTMLAdmiraltyRadioElement;
+    };
+    interface HTMLAdmiraltyRadioGroupElement extends Components.AdmiraltyRadioGroup, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyRadioGroupElement: {
+        prototype: HTMLAdmiraltyRadioGroupElement;
+        new (): HTMLAdmiraltyRadioGroupElement;
+    };
+    interface HTMLAdmiraltySelectElement extends Components.AdmiraltySelect, HTMLStencilElement {
+    }
+    var HTMLAdmiraltySelectElement: {
+        prototype: HTMLAdmiraltySelectElement;
+        new (): HTMLAdmiraltySelectElement;
+    };
+    interface HTMLAdmiraltySideNavElement extends Components.AdmiraltySideNav, HTMLStencilElement {
+    }
+    var HTMLAdmiraltySideNavElement: {
+        prototype: HTMLAdmiraltySideNavElement;
+        new (): HTMLAdmiraltySideNavElement;
+    };
+    interface HTMLAdmiraltySideNavItemElement extends Components.AdmiraltySideNavItem, HTMLStencilElement {
+    }
+    var HTMLAdmiraltySideNavItemElement: {
+        prototype: HTMLAdmiraltySideNavItemElement;
+        new (): HTMLAdmiraltySideNavItemElement;
+    };
+    interface HTMLAdmiraltySideNavWrapperElement extends Components.AdmiraltySideNavWrapper, HTMLStencilElement {
+    }
+    var HTMLAdmiraltySideNavWrapperElement: {
+        prototype: HTMLAdmiraltySideNavWrapperElement;
+        new (): HTMLAdmiraltySideNavWrapperElement;
+    };
+    /**
+     * Use tables to make information easier for users to scan and compare
+     */
+    interface HTMLAdmiraltyTableElement extends Components.AdmiraltyTable, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyTableElement: {
+        prototype: HTMLAdmiraltyTableElement;
+        new (): HTMLAdmiraltyTableElement;
+    };
+    /**
+     * The table body element is a wrapper for a standard html table body and should be used to wrap rows
+     */
+    interface HTMLAdmiraltyTableBodyElement extends Components.AdmiraltyTableBody, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyTableBodyElement: {
+        prototype: HTMLAdmiraltyTableBodyElement;
+        new (): HTMLAdmiraltyTableBodyElement;
+    };
+    /**
+     * The table cell is a wrapper for a standard <td> element and should be used inside of table rows
+     */
+    interface HTMLAdmiraltyTableCellElement extends Components.AdmiraltyTableCell, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyTableCellElement: {
+        prototype: HTMLAdmiraltyTableCellElement;
+        new (): HTMLAdmiraltyTableCellElement;
+    };
+    /**
+     * The table header should be used inside a table element to give headers to all the columns
+     */
+    interface HTMLAdmiraltyTableHeaderElement extends Components.AdmiraltyTableHeader, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyTableHeaderElement: {
+        prototype: HTMLAdmiraltyTableHeaderElement;
+        new (): HTMLAdmiraltyTableHeaderElement;
+    };
+    /**
+     * The table header cell element is used for showing headings for the columns
+     */
+    interface HTMLAdmiraltyTableHeaderCellElement extends Components.AdmiraltyTableHeaderCell, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyTableHeaderCellElement: {
+        prototype: HTMLAdmiraltyTableHeaderCellElement;
+        new (): HTMLAdmiraltyTableHeaderCellElement;
+    };
+    /**
+     * The table row element should be used to define rows within the table body
+     */
+    interface HTMLAdmiraltyTableRowElement extends Components.AdmiraltyTableRow, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyTableRowElement: {
+        prototype: HTMLAdmiraltyTableRowElement;
+        new (): HTMLAdmiraltyTableRowElement;
+    };
+    interface HTMLAdmiraltyTextareaElement extends Components.AdmiraltyTextarea, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyTextareaElement: {
+        prototype: HTMLAdmiraltyTextareaElement;
+        new (): HTMLAdmiraltyTextareaElement;
+    };
+    interface HTMLAdmiraltyTypeAheadElement extends Components.AdmiraltyTypeAhead, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyTypeAheadElement: {
+        prototype: HTMLAdmiraltyTypeAheadElement;
+        new (): HTMLAdmiraltyTypeAheadElement;
+    };
+    interface HTMLAdmiraltyTypeAheadItemElement extends Components.AdmiraltyTypeAheadItem, HTMLStencilElement {
+    }
+    var HTMLAdmiraltyTypeAheadItemElement: {
+        prototype: HTMLAdmiraltyTypeAheadItemElement;
+        new (): HTMLAdmiraltyTypeAheadItemElement;
+    };
+    interface HTMLElementTagNameMap {
+        "admiralty-breadcrumb": HTMLAdmiraltyBreadcrumbElement;
+        "admiralty-breadcrumbs": HTMLAdmiraltyBreadcrumbsElement;
+        "admiralty-button": HTMLAdmiraltyButtonElement;
+        "admiralty-card": HTMLAdmiraltyCardElement;
+        "admiralty-checkbox": HTMLAdmiraltyCheckboxElement;
+        "admiralty-colour-block": HTMLAdmiraltyColourBlockElement;
+        "admiralty-dialogue": HTMLAdmiraltyDialogueElement;
+        "admiralty-expansion": HTMLAdmiraltyExpansionElement;
+        "admiralty-file-input": HTMLAdmiraltyFileInputElement;
+        "admiralty-filter": HTMLAdmiraltyFilterElement;
+        "admiralty-filter-group": HTMLAdmiraltyFilterGroupElement;
+        "admiralty-footer": HTMLAdmiraltyFooterElement;
+        "admiralty-header": HTMLAdmiraltyHeaderElement;
+        "admiralty-header-menu-item": HTMLAdmiraltyHeaderMenuItemElement;
+        "admiralty-header-profile": HTMLAdmiraltyHeaderProfileElement;
+        "admiralty-header-sub-menu-item": HTMLAdmiraltyHeaderSubMenuItemElement;
+        "admiralty-hint": HTMLAdmiraltyHintElement;
+        "admiralty-hr": HTMLAdmiraltyHrElement;
+        "admiralty-icon": HTMLAdmiraltyIconElement;
+        "admiralty-input": HTMLAdmiraltyInputElement;
+        "admiralty-input-error": HTMLAdmiraltyInputErrorElement;
+        "admiralty-label": HTMLAdmiraltyLabelElement;
+        "admiralty-link": HTMLAdmiraltyLinkElement;
+        "admiralty-paginator": HTMLAdmiraltyPaginatorElement;
+        "admiralty-paginator-wrapper": HTMLAdmiraltyPaginatorWrapperElement;
+        "admiralty-phase-banner": HTMLAdmiraltyPhaseBannerElement;
+        "admiralty-progress-bar": HTMLAdmiraltyProgressBarElement;
+        "admiralty-radio": HTMLAdmiraltyRadioElement;
+        "admiralty-radio-group": HTMLAdmiraltyRadioGroupElement;
+        "admiralty-select": HTMLAdmiraltySelectElement;
+        "admiralty-side-nav": HTMLAdmiraltySideNavElement;
+        "admiralty-side-nav-item": HTMLAdmiraltySideNavItemElement;
+        "admiralty-side-nav-wrapper": HTMLAdmiraltySideNavWrapperElement;
+        "admiralty-table": HTMLAdmiraltyTableElement;
+        "admiralty-table-body": HTMLAdmiraltyTableBodyElement;
+        "admiralty-table-cell": HTMLAdmiraltyTableCellElement;
+        "admiralty-table-header": HTMLAdmiraltyTableHeaderElement;
+        "admiralty-table-header-cell": HTMLAdmiraltyTableHeaderCellElement;
+        "admiralty-table-row": HTMLAdmiraltyTableRowElement;
+        "admiralty-textarea": HTMLAdmiraltyTextareaElement;
+        "admiralty-type-ahead": HTMLAdmiraltyTypeAheadElement;
+        "admiralty-type-ahead-item": HTMLAdmiraltyTypeAheadItemElement;
+    }
+}
+declare namespace LocalJSX {
+    interface AdmiraltyBreadcrumb {
+        /**
+          * When `true` the breadcrumb will by styled to show that it is the currently active breadcrumb. Defaults to `true` for the last breadcrumb if it is not set on any.
+         */
+        "active"?: boolean;
+        /**
+          * Contains a URL or a URL fragment that the hyperlink points to.
+         */
+        "href"?: string | undefined;
+    }
+    interface AdmiraltyBreadcrumbs {
+    }
+    interface AdmiraltyButton {
+        /**
+          * Determines whether the button is disabled. A button in disabled state will not fire click output events.
+         */
+        "disabled"?: boolean;
+        /**
+          * When passed Font Awesome Icon name, then an icon will be rendered.
+         */
+        "icon"?: IconName;
+        /**
+          * The default behavior of the button. Valid values are `button`, `submit` and `reset`. Default value is `submit`.
+         */
+        "type"?: 'button' | 'submit' | 'reset';
+        /**
+          * The type of button to render. Valid values are `primary`, `secondary`, `warning`, `text` and `icon`. Default value is `primary`.
+         */
+        "variant"?: ButtonVariant;
+    }
+    interface AdmiraltyCard {
+        /**
+          * The title of the card.
+         */
+        "heading"?: string;
+    }
+    interface AdmiraltyCheckbox {
+        /**
+          * Whether the checkbox should be positioned to the right of the label.
+         */
+        "checkboxRight"?: boolean;
+        /**
+          * If `true`, the checkbox is selected.
+         */
+        "checked"?: boolean;
+        /**
+          * This dictates whether the form field is disabled.
+         */
+        "disabled"?: boolean;
+        /**
+          * The text that's displayed alongside the checkbox
+         */
+        "labelText"?: string;
+        /**
+          * The name of the control, which is submitted with the form data.
+         */
+        "name"?: string;
+        /**
+          * Event is fired when the form control loses focus
+          * @event checkboxBlur
+         */
+        "onCheckboxBlur"?: (event: AdmiraltyCheckboxCustomEvent<any>) => void;
+        /**
+          * Event is fired when the form control changes state
+          * @event radioChanges
+         */
+        "onCheckboxChange"?: (event: AdmiraltyCheckboxCustomEvent<any>) => void;
+        /**
+          * Event is fired when the form control gains focus
+          * @event checkboxFocus
+         */
+        "onCheckboxFocus"?: (event: AdmiraltyCheckboxCustomEvent<any>) => void;
+        /**
+          * The value of the checkbox does not mean if it's checked or not, use the `checked` property for that.  The value of a checkbox is analogous to the value of an `<input type="checkbox">`, it's only used when the checkbox participates in a native `<form>`.
+         */
+        "value"?: any | null;
+    }
+    interface AdmiraltyColourBlock {
+        /**
+          * The text to display on the action button
+         */
+        "actionText"?: string;
+        /**
+          * The function to call when the action button is pressed.
+         */
+        "clickAction"?: () => any;
+        /**
+          * The background colour of the component.
+         */
+        "colour"?: 'admiralty-blue' | 'teal' | 'bright-blue';
+        /**
+          * The heading text to display.
+         */
+        "heading"?: string;
+        /**
+          * The height in pixels of the component.
+         */
+        "height"?: number;
+        /**
+          * The width in pixels of the component.
+         */
+        "width"?: number;
+    }
+    interface AdmiraltyDialogue {
+        /**
+          * The heading to display.
+         */
+        "heading"?: string;
+        /**
+          * The type of dialogue box to render.
+         */
+        "type"?: 'info' | 'warning' | 'success' | 'error';
+    }
+    interface AdmiraltyExpansion {
+        /**
+          * CWhether the heading should be right aligned.
+         */
+        "alignHeadingRight"?: boolean;
+        /**
+          * Whether the component is expanded.
+         */
+        "expanded"?: boolean;
+        /**
+          * The text to display in the heading of the expansion component.
+         */
+        "heading"?: string;
+        /**
+          * Whether the border on the bottom of the component should be hidden.
+         */
+        "hideBorder"?: boolean;
+        /**
+          * The event that is dispatched when the expanded status is toggled.
+         */
+        "onToggled"?: (event: AdmiraltyExpansionCustomEvent<boolean>) => void;
+    }
+    interface AdmiraltyFileInput {
+        /**
+          * Used to display instructions to the user and is replaced with the filename the user inputs
+         */
+        "label"?: string;
+        /**
+          * If true, enables multiple files to be selected or dragged
+         */
+        "multiple"?: boolean;
+        /**
+          * Emitted when the added file(s) changes
+         */
+        "onFileInputChange"?: (event: AdmiraltyFileInputCustomEvent<File[]>) => void;
+    }
+    interface AdmiraltyFilter {
+        /**
+          * The title of the filter
+         */
+        "filterTitle"?: string;
+        /**
+          * Event that is emitted when the filters are applied
+         */
+        "onFilterApplied"?: (event: AdmiraltyFilterCustomEvent<void>) => void;
+        /**
+          * Event that is emitted when the filters are cleared
+         */
+        "onFilterCleared"?: (event: AdmiraltyFilterCustomEvent<void>) => void;
+    }
+    interface AdmiraltyFilterGroup {
+        /**
+          * The title of the filter group
+         */
+        "groupTitle"?: string;
+    }
+    interface AdmiraltyFooter {
+        /**
+          * A description for the image displayed in the footer. This might be shown if the image fails to load or get read out by screen readers.
+         */
+        "imageAlt"?: string;
+        /**
+          * The URL that the image links to.
+         */
+        "imageLink"?: string;
+        /**
+          * The source of the image displayed in the footer.
+         */
+        "imageSrc"?: string;
+        /**
+          * The text to display in the footer. The default value displays crown copyright, the current year and `UK Hydrographic Office`.
+         */
+        "text"?: string;
+    }
+    interface AdmiraltyHeader {
+        /**
+          * The header title that is displayed to the right of the logo
+         */
+        "headerTitle"?: string;
+        /**
+          * The url that clicking on the nav link will take you too
+         */
+        "headerTitleUrl"?: string;
+        /**
+          * The alternate image text for the logo image
+         */
+        "logoAltText"?: string;
+        /**
+          * The uri of the logo image
+         */
+        "logoImgUrl"?: string;
+        /**
+          * The destination url when the logo is clicked
+         */
+        "logoLinkUrl"?: string;
+        /**
+          * Emits an event that can be listened to when the title in the header is clicked
+         */
+        "onTitledClicked"?: (event: AdmiraltyHeaderCustomEvent<string>) => void;
+    }
+    interface AdmiraltyHeaderMenuItem {
+        /**
+          * The text that will be displayed in the menu
+         */
+        "active"?: boolean;
+        /**
+          * The text that will be displayed in the menu
+         */
+        "menuTitle"?: string;
+        /**
+          * The event that is fired when a user clicks on the menu
+         */
+        "onMenuItemClick"?: (event: AdmiraltyHeaderMenuItemCustomEvent<void>) => void;
+    }
+    interface AdmiraltyHeaderProfile {
+        /**
+          * A boolean to indicate if the user is signed in or not
+         */
+        "isSignedIn"?: boolean;
+        /**
+          * The event that is fired when the user clicks on the sign in button
+         */
+        "onSignInClicked"?: (event: AdmiraltyHeaderProfileCustomEvent<void>) => void;
+        /**
+          * The event that is fired when the user clicks on the 'sign out' button
+         */
+        "onSignOutClicked"?: (event: AdmiraltyHeaderProfileCustomEvent<void>) => void;
+        /**
+          * TThe event that is fired when the user clicks 'user profile'  on the profile sub menu
+         */
+        "onUserProfileClicked"?: (event: AdmiraltyHeaderProfileCustomEvent<void>) => void;
+        /**
+          * The event that is fired when the user clicks on the 'Your account' button
+         */
+        "onYourAccountClicked"?: (event: AdmiraltyHeaderProfileCustomEvent<void>) => void;
+        /**
+          * The text that is displayed after the user signs in
+         */
+        "signedInText"?: string;
+    }
+    interface AdmiraltyHeaderSubMenuItem {
+        /**
+          * The text that will be displayed in the menu
+         */
+        "menuTitle"?: string;
+        /**
+          * The event that is fired when a user clicks on the menu
+         */
+        "onSubMenuItemClick"?: (event: AdmiraltyHeaderSubMenuItemCustomEvent<void>) => void;
+    }
+    interface AdmiraltyHint {
+        /**
+          * The disabled option can be used to disable the component.
+         */
+        "disabled"?: boolean;
+    }
+    interface AdmiraltyHr {
+    }
+    interface AdmiraltyIcon {
+        /**
+          * Name of the icon to be rendered  Check out <a href="https://fontawesome.com/search?m=free}">FontAwesome</a>  for a list of icons
+         */
+        "iconName"?: IconName1;
+        /**
+          * The style prefix to apply to the icon  By default, icons use Font Awesome's solid style
+         */
+        "iconPrefix"?: IconPrefix;
+    }
+    /**
+     * Once this component works, review whether a form field component should be created so
+     * that shared properties such as `label`, `hint`, `disabled` etc. can be defined once.
+     * Examples of similar components that can extend that base component are area, select
+     * and checkbox.
+     */
+    interface AdmiraltyInput {
+        /**
+          * Indicates whether the value of the control can be automatically completed by the browser.
+         */
+        "autocomplete"?: string;
+        /**
+          * This dictates whether the form field is disabled.
+         */
+        "disabled"?: boolean;
+        /**
+          * The hint which will be used under the label to describe the input.
+         */
+        "hint"?: string;
+        /**
+          * Whether to show the input in an invalid state
+         */
+        "invalid"?: boolean;
+        /**
+          * The message to show when the input is invalid
+         */
+        "invalidMessage"?: string;
+        /**
+          * The label which will be used above the input to describe the input.
+         */
+        "label"?: string;
+        /**
+          * The name of the control, which is submitted with the form data.
+         */
+        "name"?: string;
+        /**
+          * Emitted when the value has changed.
+         */
+        "onAdmiraltyChange"?: (event: AdmiraltyInputCustomEvent<InputChangeEventDetail>) => void;
+        /**
+          * The placeholder text to show in the input
+         */
+        "placeholder"?: string;
+        /**
+          * This dictates whether the input is required or not
+         */
+        "required"?: boolean;
+        /**
+          * The input type, options are: `text | date | time | email | password | tel | url`
+         */
+        "type"?: 'text' | 'date' | 'time' | 'email' | 'password' | 'tel' | 'url';
+        /**
+          * The value of the input.
+         */
+        "value"?: string | number | null;
+        /**
+          * The maximum width for the input field.
+         */
+        "width"?: number;
+    }
+    interface AdmiraltyInputError {
+    }
+    interface AdmiraltyLabel {
+        /**
+          * The disabled option can be used to disable the component.
+         */
+        "disabled"?: boolean;
+        /**
+          * The id of the input the label is attached to
+         */
+        "for"?: string;
+    }
+    interface AdmiraltyLink {
+        /**
+          * The URL that the link will navigate to.
+         */
+        "href"?: string;
+        /**
+          * Whether to open the URL in a new tab.
+         */
+        "newTab"?: boolean;
+    }
+    interface AdmiraltyPaginator {
+        /**
+          * The current page. Defaults to 1.
+         */
+        "currentPage"?: number;
+        /**
+          * The label to display.
+         */
+        "label"?: string;
+        /**
+          * Dispatched when the previous or next button is pressed. The event detail contains the requested page number.
+         */
+        "onPageChange"?: (event: AdmiraltyPaginatorCustomEvent<number>) => void;
+        /**
+          * The total number of pages. Defaults to 1.
+         */
+        "pages"?: number;
+    }
+    interface AdmiraltyPaginatorWrapper {
+    }
+    interface AdmiraltyPhaseBanner {
+        /**
+          * A link to where the end user can provide feedback
+         */
+        "link"?: string;
+        /**
+          * The phase for the phase banner
+         */
+        "phase"?: 'alpha' | 'beta';
+    }
+    interface AdmiraltyProgressBar {
+        /**
+          * Set to true to indicate an error (turns the progress bar red)
+         */
+        "error"?: boolean;
+        /**
+          * If set, adds a label above the progress bar
+         */
+        "label"?: string;
+        /**
+          * * A value from 0 - 100 that visually represents the current progression
+         */
+        "progression"?: number;
+    }
+    interface AdmiraltyRadio {
+        /**
+          * Determines whether the radio button is selected (or checked)
+         */
+        "checked"?: boolean;
+        /**
+          * Determines whether the radio button is disabled. A button in disabled state will not fire click output events.
+         */
+        "disabled"?: boolean;
+        /**
+          * The name of the radio button for use on selection within a radio group
+         */
+        "name"?: string;
+        /**
+          * Emitted when the radio button loses focus.
+         */
+        "onAdmiraltyBlur"?: (event: AdmiraltyRadioCustomEvent<void>) => void;
+        /**
+          * Emitted when the radio button gains focus.
+         */
+        "onAdmiraltyFocus"?: (event: AdmiraltyRadioCustomEvent<void>) => void;
+        /**
+          * The value of the radio button for use on selection within a radio group
+         */
+        "value"?: string | null;
+    }
+    interface AdmiraltyRadioGroup {
+        /**
+          * Setting this true displays the radio options vertically (defaults to false)
+         */
+        "displayVertical"?: boolean;
+        /**
+          * The name of the control, which is submitted with the form data
+         */
+        "name"?: string;
+        /**
+          * Event fired when the checked radio button changes
+         */
+        "onRadioChange"?: (event: AdmiraltyRadioGroupCustomEvent<any>) => void;
+        /**
+          * The value of the radio group
+         */
+        "value"?: any | null;
+    }
+    interface AdmiraltySelect {
+        /**
+          * If `true`, the user cannot interact with the select.
+         */
+        "disabled"?: boolean;
+        /**
+          * If 'true', the 'error' class is added to suggest an error
+         */
+        "error"?: boolean;
+        /**
+          * The hint that is used to inform the user of an error (displayed below the select box)
+         */
+        "errorHint"?: string;
+        /**
+          * The text that will be used as a field label.
+         */
+        "hint"?: string;
+        /**
+          * The text that will be used as a field label.
+         */
+        "label"?: string;
+        /**
+          * Emitted when the component loses focus.
+         */
+        "onAdmiraltyBlur"?: (event: AdmiraltySelectCustomEvent<void>) => void;
+        /**
+          * Emitted when the value has changed.
+         */
+        "onAdmiraltyChange"?: (event: AdmiraltySelectCustomEvent<EventTarget>) => void;
+        /**
+          * The maximum width (px) for the input field.
+         */
+        "width"?: number;
+    }
+    interface AdmiraltySideNav {
+        /**
+          * A label for accessibility purposes to describe what this Side Nav navigation is for e.g. Product Menu, Map Tool Menu etc.
+         */
+        "label"?: string;
+    }
+    interface AdmiraltySideNavItem {
+        /**
+          * The text that is displayed in the SideNavItem
+         */
+        "headingTitle"?: string;
+        /**
+          * Represents whether this SideNavItem is 'active' and will be styled differently than SideNavItems that are not 'active'. The intent behind the design for SideNav is for there to only be ONE SideNavItem that is 'active' per SideNav
+         */
+        "navActive"?: boolean;
+        /**
+          * An event emitted when this Side Nav item is selected containing the sideNavItemId
+         */
+        "onSideNavItemSelected"?: (event: AdmiraltySideNavItemCustomEvent<string>) => void;
+        /**
+          * A unique id for this SideNavItem
+         */
+        "sideNavItemId"?: string;
+    }
+    interface AdmiraltySideNavWrapper {
+    }
+    /**
+     * Use tables to make information easier for users to scan and compare
+     */
+    interface AdmiraltyTable {
+        "caption"?: string;
+    }
+    /**
+     * The table body element is a wrapper for a standard html table body and should be used to wrap rows
+     */
+    interface AdmiraltyTableBody {
+    }
+    /**
+     * The table cell is a wrapper for a standard <td> element and should be used inside of table rows
+     */
+    interface AdmiraltyTableCell {
+    }
+    /**
+     * The table header should be used inside a table element to give headers to all the columns
+     */
+    interface AdmiraltyTableHeader {
+    }
+    /**
+     * The table header cell element is used for showing headings for the columns
+     */
+    interface AdmiraltyTableHeaderCell {
+    }
+    /**
+     * The table row element should be used to define rows within the table body
+     */
+    interface AdmiraltyTableRow {
+    }
+    interface AdmiraltyTextarea {
+        /**
+          * This dictates whether the form field is disabled.
+         */
+        "disabled"?: boolean;
+        /**
+          * The hint which will be used under the label to describe the input.
+         */
+        "hint"?: string;
+        /**
+          * Whether to show the input in an invalid state
+         */
+        "invalid"?: boolean;
+        /**
+          * The message to show when the input is invalid
+         */
+        "invalidMessage"?: string;
+        /**
+          * The label which will be used as a placeholder in the unfilled state, and as a field label in the filled state.
+         */
+        "label"?: string;
+        /**
+          * Event is fired when the form control loses focus
+          * @event textareaBlur
+         */
+        "onTextareaBlur"?: (event: AdmiraltyTextareaCustomEvent<any>) => void;
+        /**
+          * Event is fired when the form control changes
+          * @event textareaChanged
+         */
+        "onTextareaChanged"?: (event: AdmiraltyTextareaCustomEvent<string>) => void;
+        /**
+          * The contents of the textarea
+         */
+        "text"?: string;
+        /**
+          * The maximum width for the input field.
+         */
+        "width"?: number;
+    }
+    interface AdmiraltyTypeAhead {
+        /**
+          * The text content of the label for the input box
+         */
+        "label"?: string;
+        /**
+          * Optional function that will be executed when the user selects an item from the typeahead
+         */
+        "onSelectionChanged"?: (event: AdmiraltyTypeAheadCustomEvent<string>) => void;
+        /**
+          * Event that is fired whenever the value of the typeahead changes e.g. selection from the dropdown or manually typed entry
+         */
+        "onValueChanged"?: (event: AdmiraltyTypeAheadCustomEvent<string>) => void;
+        /**
+          * The placeholder text for the input field
+         */
+        "placeholder"?: string;
+        /**
+          * Optional property to show results when input box is initally focused
+         */
+        "resultsOnInitFocus"?: boolean;
+        /**
+          * The value of the textinput
+         */
+        "value"?: string;
+    }
+    interface AdmiraltyTypeAheadItem {
+        "value": string;
+    }
+    interface IntrinsicElements {
+        "admiralty-breadcrumb": AdmiraltyBreadcrumb;
+        "admiralty-breadcrumbs": AdmiraltyBreadcrumbs;
+        "admiralty-button": AdmiraltyButton;
+        "admiralty-card": AdmiraltyCard;
+        "admiralty-checkbox": AdmiraltyCheckbox;
+        "admiralty-colour-block": AdmiraltyColourBlock;
+        "admiralty-dialogue": AdmiraltyDialogue;
+        "admiralty-expansion": AdmiraltyExpansion;
+        "admiralty-file-input": AdmiraltyFileInput;
+        "admiralty-filter": AdmiraltyFilter;
+        "admiralty-filter-group": AdmiraltyFilterGroup;
+        "admiralty-footer": AdmiraltyFooter;
+        "admiralty-header": AdmiraltyHeader;
+        "admiralty-header-menu-item": AdmiraltyHeaderMenuItem;
+        "admiralty-header-profile": AdmiraltyHeaderProfile;
+        "admiralty-header-sub-menu-item": AdmiraltyHeaderSubMenuItem;
+        "admiralty-hint": AdmiraltyHint;
+        "admiralty-hr": AdmiraltyHr;
+        "admiralty-icon": AdmiraltyIcon;
+        "admiralty-input": AdmiraltyInput;
+        "admiralty-input-error": AdmiraltyInputError;
+        "admiralty-label": AdmiraltyLabel;
+        "admiralty-link": AdmiraltyLink;
+        "admiralty-paginator": AdmiraltyPaginator;
+        "admiralty-paginator-wrapper": AdmiraltyPaginatorWrapper;
+        "admiralty-phase-banner": AdmiraltyPhaseBanner;
+        "admiralty-progress-bar": AdmiraltyProgressBar;
+        "admiralty-radio": AdmiraltyRadio;
+        "admiralty-radio-group": AdmiraltyRadioGroup;
+        "admiralty-select": AdmiraltySelect;
+        "admiralty-side-nav": AdmiraltySideNav;
+        "admiralty-side-nav-item": AdmiraltySideNavItem;
+        "admiralty-side-nav-wrapper": AdmiraltySideNavWrapper;
+        "admiralty-table": AdmiraltyTable;
+        "admiralty-table-body": AdmiraltyTableBody;
+        "admiralty-table-cell": AdmiraltyTableCell;
+        "admiralty-table-header": AdmiraltyTableHeader;
+        "admiralty-table-header-cell": AdmiraltyTableHeaderCell;
+        "admiralty-table-row": AdmiraltyTableRow;
+        "admiralty-textarea": AdmiraltyTextarea;
+        "admiralty-type-ahead": AdmiraltyTypeAhead;
+        "admiralty-type-ahead-item": AdmiraltyTypeAheadItem;
+    }
+}
+export { LocalJSX as JSX };
+declare module "@stencil/core" {
+    export namespace JSX {
+        interface IntrinsicElements {
+            "admiralty-breadcrumb": LocalJSX.AdmiraltyBreadcrumb & JSXBase.HTMLAttributes<HTMLAdmiraltyBreadcrumbElement>;
+            "admiralty-breadcrumbs": LocalJSX.AdmiraltyBreadcrumbs & JSXBase.HTMLAttributes<HTMLAdmiraltyBreadcrumbsElement>;
+            "admiralty-button": LocalJSX.AdmiraltyButton & JSXBase.HTMLAttributes<HTMLAdmiraltyButtonElement>;
+            "admiralty-card": LocalJSX.AdmiraltyCard & JSXBase.HTMLAttributes<HTMLAdmiraltyCardElement>;
+            "admiralty-checkbox": LocalJSX.AdmiraltyCheckbox & JSXBase.HTMLAttributes<HTMLAdmiraltyCheckboxElement>;
+            "admiralty-colour-block": LocalJSX.AdmiraltyColourBlock & JSXBase.HTMLAttributes<HTMLAdmiraltyColourBlockElement>;
+            "admiralty-dialogue": LocalJSX.AdmiraltyDialogue & JSXBase.HTMLAttributes<HTMLAdmiraltyDialogueElement>;
+            "admiralty-expansion": LocalJSX.AdmiraltyExpansion & JSXBase.HTMLAttributes<HTMLAdmiraltyExpansionElement>;
+            "admiralty-file-input": LocalJSX.AdmiraltyFileInput & JSXBase.HTMLAttributes<HTMLAdmiraltyFileInputElement>;
+            "admiralty-filter": LocalJSX.AdmiraltyFilter & JSXBase.HTMLAttributes<HTMLAdmiraltyFilterElement>;
+            "admiralty-filter-group": LocalJSX.AdmiraltyFilterGroup & JSXBase.HTMLAttributes<HTMLAdmiraltyFilterGroupElement>;
+            "admiralty-footer": LocalJSX.AdmiraltyFooter & JSXBase.HTMLAttributes<HTMLAdmiraltyFooterElement>;
+            "admiralty-header": LocalJSX.AdmiraltyHeader & JSXBase.HTMLAttributes<HTMLAdmiraltyHeaderElement>;
+            "admiralty-header-menu-item": LocalJSX.AdmiraltyHeaderMenuItem & JSXBase.HTMLAttributes<HTMLAdmiraltyHeaderMenuItemElement>;
+            "admiralty-header-profile": LocalJSX.AdmiraltyHeaderProfile & JSXBase.HTMLAttributes<HTMLAdmiraltyHeaderProfileElement>;
+            "admiralty-header-sub-menu-item": LocalJSX.AdmiraltyHeaderSubMenuItem & JSXBase.HTMLAttributes<HTMLAdmiraltyHeaderSubMenuItemElement>;
+            "admiralty-hint": LocalJSX.AdmiraltyHint & JSXBase.HTMLAttributes<HTMLAdmiraltyHintElement>;
+            "admiralty-hr": LocalJSX.AdmiraltyHr & JSXBase.HTMLAttributes<HTMLAdmiraltyHrElement>;
+            "admiralty-icon": LocalJSX.AdmiraltyIcon & JSXBase.HTMLAttributes<HTMLAdmiraltyIconElement>;
+            /**
+             * Once this component works, review whether a form field component should be created so
+             * that shared properties such as `label`, `hint`, `disabled` etc. can be defined once.
+             * Examples of similar components that can extend that base component are area, select
+             * and checkbox.
+             */
+            "admiralty-input": LocalJSX.AdmiraltyInput & JSXBase.HTMLAttributes<HTMLAdmiraltyInputElement>;
+            "admiralty-input-error": LocalJSX.AdmiraltyInputError & JSXBase.HTMLAttributes<HTMLAdmiraltyInputErrorElement>;
+            "admiralty-label": LocalJSX.AdmiraltyLabel & JSXBase.HTMLAttributes<HTMLAdmiraltyLabelElement>;
+            "admiralty-link": LocalJSX.AdmiraltyLink & JSXBase.HTMLAttributes<HTMLAdmiraltyLinkElement>;
+            "admiralty-paginator": LocalJSX.AdmiraltyPaginator & JSXBase.HTMLAttributes<HTMLAdmiraltyPaginatorElement>;
+            "admiralty-paginator-wrapper": LocalJSX.AdmiraltyPaginatorWrapper & JSXBase.HTMLAttributes<HTMLAdmiraltyPaginatorWrapperElement>;
+            "admiralty-phase-banner": LocalJSX.AdmiraltyPhaseBanner & JSXBase.HTMLAttributes<HTMLAdmiraltyPhaseBannerElement>;
+            "admiralty-progress-bar": LocalJSX.AdmiraltyProgressBar & JSXBase.HTMLAttributes<HTMLAdmiraltyProgressBarElement>;
+            "admiralty-radio": LocalJSX.AdmiraltyRadio & JSXBase.HTMLAttributes<HTMLAdmiraltyRadioElement>;
+            "admiralty-radio-group": LocalJSX.AdmiraltyRadioGroup & JSXBase.HTMLAttributes<HTMLAdmiraltyRadioGroupElement>;
+            "admiralty-select": LocalJSX.AdmiraltySelect & JSXBase.HTMLAttributes<HTMLAdmiraltySelectElement>;
+            "admiralty-side-nav": LocalJSX.AdmiraltySideNav & JSXBase.HTMLAttributes<HTMLAdmiraltySideNavElement>;
+            "admiralty-side-nav-item": LocalJSX.AdmiraltySideNavItem & JSXBase.HTMLAttributes<HTMLAdmiraltySideNavItemElement>;
+            "admiralty-side-nav-wrapper": LocalJSX.AdmiraltySideNavWrapper & JSXBase.HTMLAttributes<HTMLAdmiraltySideNavWrapperElement>;
+            /**
+             * Use tables to make information easier for users to scan and compare
+             */
+            "admiralty-table": LocalJSX.AdmiraltyTable & JSXBase.HTMLAttributes<HTMLAdmiraltyTableElement>;
+            /**
+             * The table body element is a wrapper for a standard html table body and should be used to wrap rows
+             */
+            "admiralty-table-body": LocalJSX.AdmiraltyTableBody & JSXBase.HTMLAttributes<HTMLAdmiraltyTableBodyElement>;
+            /**
+             * The table cell is a wrapper for a standard <td> element and should be used inside of table rows
+             */
+            "admiralty-table-cell": LocalJSX.AdmiraltyTableCell & JSXBase.HTMLAttributes<HTMLAdmiraltyTableCellElement>;
+            /**
+             * The table header should be used inside a table element to give headers to all the columns
+             */
+            "admiralty-table-header": LocalJSX.AdmiraltyTableHeader & JSXBase.HTMLAttributes<HTMLAdmiraltyTableHeaderElement>;
+            /**
+             * The table header cell element is used for showing headings for the columns
+             */
+            "admiralty-table-header-cell": LocalJSX.AdmiraltyTableHeaderCell & JSXBase.HTMLAttributes<HTMLAdmiraltyTableHeaderCellElement>;
+            /**
+             * The table row element should be used to define rows within the table body
+             */
+            "admiralty-table-row": LocalJSX.AdmiraltyTableRow & JSXBase.HTMLAttributes<HTMLAdmiraltyTableRowElement>;
+            "admiralty-textarea": LocalJSX.AdmiraltyTextarea & JSXBase.HTMLAttributes<HTMLAdmiraltyTextareaElement>;
+            "admiralty-type-ahead": LocalJSX.AdmiraltyTypeAhead & JSXBase.HTMLAttributes<HTMLAdmiraltyTypeAheadElement>;
+            "admiralty-type-ahead-item": LocalJSX.AdmiraltyTypeAheadItem & JSXBase.HTMLAttributes<HTMLAdmiraltyTypeAheadItemElement>;
+        }
+    }
+}