@ukic/web-components 2.1.0-beta.16 → 2.1.0-beta.18

package/dist/types/components/ic-checkbox/ic-checkbox.d.ts

@@ -1,48 +1,50 @@
 import { EventEmitter } from "../../stencil-public-runtime";
 import { IcAdditionalFieldTypes } from "../../utils/types";
 export declare class Checkbox {
+  private additionalFieldContainer;
+  private IC_TEXT_FIELD;
+  host: HTMLIcCheckboxElement;
+  /**
+   * The style of additionalField that will be displayed if used.
+   */
+  additionalFieldDisplay: IcAdditionalFieldTypes;
   /**
    * If `true`, the checkbox will be set to the checked state.
    */
   checked?: boolean;
+  initiallyChecked: boolean;
   /**
    * If `true`, the checkbox will be set to the disabled state.
    */
   disabled?: boolean;
   /**
-   * The label for the checkbox.
-   */
-  label: string;
-  /**
-   * The value for the checkbox.
-   */
-  value: string;
-  /**
-   * The name for the checkbox. If not set when used in a checkbox group, the name will be based on the group name.
+   * The text to be displayed when dynamic.
    */
-  name: string;
+  dynamicText: string;
   /**
    * The group label for the checkbox.
    */
   groupLabel: string;
   /**
-   * The text to be displayed when dynamic.
+   * If `true`, the indeterminate state will be displayed when checked.
    */
-  dynamicText: string;
+  indeterminate: boolean;
   /**
-   * The style of additionalField that will be displayed if used.
+   * The label for the checkbox.
    */
-  additionalFieldDisplay: IcAdditionalFieldTypes;
+  label: string;
   /**
-   * If `true`, the indeterminate state will be displayed when checked.
+   * The name for the checkbox. If not set when used in a checkbox group, the name will be based on the group name.
    */
-  indeterminate: boolean;
+  name: string;
   /**
    * If true, the small styling will be applied to the checkbox.
    */
   small?: boolean;
-  initiallyChecked: boolean;
-  host: HTMLIcCheckboxElement;
+  /**
+   * The value for the checkbox.
+   */
+  value: string;
   /**
    * @deprecated This event should not be used anymore. Use icCheck instead.
    */
@@ -51,17 +53,16 @@ export declare class Checkbox {
    * Emitted when a checkbox has been checked.
    */
   icCheck: EventEmitter<void>;
-  private additionalFieldContainer;
-  private handleClick;
-  private handleFormReset;
+  componentWillLoad(): void;
+  componentDidLoad(): void;
+  componentDidRender(): void;
+  disconnectedCallback(): void;
   /**
    * Sets focus on the checkbox.
    */
   setFocus(): Promise<void>;
-  private IC_TEXT_FIELD;
-  componentDidRender(): void;
-  componentWillLoad(): void;
-  componentDidLoad(): void;
-  disconnectedCallback(): void;
+  private eventHandler;
+  private handleClick;
+  private handleFormReset;
   render(): any;
 }

package/dist/types/components/ic-checkbox-group/ic-checkbox-group.d.ts

@@ -4,29 +4,29 @@ import { IcChangeEventDetail } from "./ic-checkbox-group.types";
 export declare class CheckboxGroup {
   host: HTMLIcCheckboxGroupElement;
   /**
-   * The label for the checkbox group to be displayed.
-   */
-  label: string;
-  /**
-   * The name for the checkbox group to differentiate from other groups.
+   * If `true`, the checkbox group will be set to the disabled state.
    */
-  name: string;
+  disabled: boolean;
   /**
-   * If `true`, the checkbox group will require a value.
+   * The helper text that will be displayed for additional field guidance.
    */
-  required: boolean;
+  helperText: string;
   /**
    * If `true`, the label will be hidden and the required label value will be applied as an aria-label.
    */
   hideLabel: boolean;
   /**
-   * If `true`, the checkbox group will be set to the disabled state.
+   * The label for the checkbox group to be displayed.
    */
-  disabled: boolean;
+  label: string;
   /**
-   * The helper text that will be displayed for additional field guidance.
+   * The name for the checkbox group to differentiate from other groups.
    */
-  helperText: string;
+  name: string;
+  /**
+   * If `true`, the checkbox group will require a value.
+   */
+  required: boolean;
   /**
    * If `true`, the small styling will be applied to the checkbox group.
    */
@@ -43,8 +43,8 @@ export declare class CheckboxGroup {
    * Emitted when a checkbox is checked.
    */
   icChange: EventEmitter<IcChangeEventDetail>;
-  selectHandler(ev: CustomEvent): void;
   componentWillLoad(): void;
   componentDidLoad(): void;
+  selectHandler(ev: CustomEvent): void;
   render(): any;
 }

package/dist/types/components/ic-chip/ic-chip.d.ts

@@ -5,29 +5,28 @@ import { IcChipAppearance, IcChipSizes } from "./ic-chip.types";
  */
 export declare class Chip {
   el: HTMLIcChipElement;
-  /**
-   * The text rendered within the chip.
-   */
-  label: string;
+  isHovered: boolean;
+  visible: boolean;
   /**
    * The emphasis of the chip.
    */
   appearance?: IcChipAppearance;
   /**
-   * The size of the chip.
+   * If `true`, the chip will appear disabled.
    */
-  size?: IcChipSizes;
+  disabled?: boolean;
   /**
    * If `true`, the chip will have a close button at the end to dismiss it.
    */
   dismissible?: boolean;
   /**
-   * If `true`, the chip will appear disabled.
+   * The text rendered within the chip.
    */
-  disabled?: boolean;
-  visible: boolean;
-  isHovered: boolean;
-  handleClick(): void;
+  label: string;
+  /**
+   * The size of the chip.
+   */
+  size?: IcChipSizes;
   /**
    * @deprecated This event should not be used anymore. Use icDismiss instead.
    */
@@ -36,14 +35,15 @@ export declare class Chip {
    * Is emitted when the user dismisses the chip.
    */
   icDismiss: EventEmitter<void>;
-  private dismissAction;
-  private mouseEnterHandler;
-  private mouseLeaveHandler;
+  componentWillLoad(): void;
+  componentDidLoad(): void;
+  handleClick(): void;
   /**
    * Sets focus on the chip.
    */
   setFocus(): Promise<void>;
-  componentWillLoad(): void;
-  componentDidLoad(): void;
+  private dismissAction;
+  private mouseEnterHandler;
+  private mouseLeaveHandler;
   render(): any;
 }

package/dist/types/components/ic-data-row/ic-data-row.d.ts

@@ -4,28 +4,28 @@
  * @slot end-component - Content will be displayed in the rightmost cell.
  */
 export declare class DataRow {
+  private hasEndComponent;
+  private resizeObserver;
   el: HTMLIcDataRowElement;
+  deviceSize: number;
+  entitySize: "xl" | "m" | "xs";
   /**
    * The label in the leftmost cell of the row.
    */
   label: string;
-  /**
-   * The value of the middle (right if no end-component supplied) cell of the row.
-   */
-  value: string;
   /**
    * If `true`, the small styling will be applied to the row. This is automatically applied if small is set on the parent data heading.
    */
   small: boolean;
-  deviceSize: number;
-  entitySize: "xl" | "m" | "xs";
-  private resizeObserver;
-  private hasEndComponent;
+  /**
+   * The value of the middle (right if no end-component supplied) cell of the row.
+   */
+  value: string;
+  disconnectedCallback(): void;
+  componentWillLoad(): void;
+  componentDidLoad(): void;
   private runResizeObserver;
   private checkLabelAbove;
   private labelEndComponent;
-  componentWillLoad(): void;
-  componentDidLoad(): void;
-  disconnectedCallback(): void;
   render(): any;
 }

package/dist/types/components/ic-dialog/ic-dialog.d.ts

@@ -1,51 +1,68 @@
 import { EventEmitter } from "../../stencil-public-runtime";
 export declare class Dialog {
+  private DATA_OVERFLOW;
+  private DATA_GETS_FOCUS;
+  private DATA_GETS_FOCUS_SELECTOR;
+  private DIALOG_CONTROLS;
+  private dialogEl;
+  private dialogHeight;
+  private focusedElementIndex;
+  private IC_TEXT_FIELD;
+  private interactiveElementList;
+  private resizeObserver;
+  private resizeTimeout;
+  private sourceElement;
+  private buttonOnclick0;
+  private buttonOnclick1;
+  private buttonOnclick2;
+  el: HTMLIcDialogElement;
+  dialogRendered: boolean;
+  fadeIn: boolean;
   /**
    * @slot dialog-controls - Content will be place at the bottom of the dialog.
    * @slot heading - Content will be placed at the top of the dialog.
    * @slot label - Content will be placed above the dialog heading.
    */
-  el: HTMLIcDialogElement;
   /**
-   * Sets the maximum and minimum height and width for the dialog.
+   * If a status is set, sets the heading for the displayed alert.
    */
-  size?: "small" | "medium" | "large";
+  alertHeading?: string;
   /**
-   * Sets the heading for the dialog.
+   * If a status is set, sets the message for the displayed alert.
    */
-  heading: string;
+  alertMessage?: string;
   /**
-   * Sets the optional label for the dialog which appears above the heading.
+   * If set to `false`, dialog controls will not be displayed overriding buttonProps or slotted dialog controls.
    */
-  label?: string;
+  buttons?: boolean;
   /**
-   * Sets the dismiss label tooltip and aria label.
+   * If set to `true`, the dialog will not close when the backdrop is clicked.
    */
-  dismissLabel?: string;
+  closeOnBackdropClick?: boolean;
   /**
-   * If set, displays an alert of the corresponding variant below the heading.
+   * If default buttons are displayed, sets the 'primary' or rightmost button to the destructive variant. Stops initial focus being set on the 'primary' or rightmost default or slotted button.
    */
-  status?: "neutral" | "info" | "warning" | "error" | "success";
+  destructive?: boolean;
   /**
-   * If a status is set, sets the heading for the displayed alert.
+   * Sets the dismiss label tooltip and aria label.
    */
-  alertHeading?: string;
+  dismissLabel?: string;
   /**
-   * If a status is set, sets the message for the displayed alert.
+   * Sets the heading for the dialog.
    */
-  alertMessage?: string;
+  heading: string;
   /**
-   * If set to `false`, dialog controls will not be displayed overriding buttonProps or slotted dialog controls.
+   * Sets the optional label for the dialog which appears above the heading.
    */
-  buttons?: boolean;
+  label?: string;
   /**
-   * If default buttons are displayed, sets the 'primary' or rightmost button to the destructive variant. Stops initial focus being set on the 'primary' or rightmost default or slotted button.
+   * Sets the maximum and minimum height and width for the dialog.
    */
-  destructive?: boolean;
+  size?: "small" | "medium" | "large";
   /**
-   * If set to `true`, the dialog will not close when the backdrop is clicked.
+   * If set, displays an alert of the corresponding variant below the heading.
    */
-  closeOnBackdropClick?: boolean;
+  status?: "neutral" | "info" | "warning" | "error" | "success";
   /**
    * Sets the label and onclick functions for default buttons.
    */
@@ -53,12 +70,11 @@ export declare class Dialog {
     label: string;
     onclick: string;
   }[];
-  dialogRendered: boolean;
-  fadeIn: boolean;
+  watchPropHandler(): void;
   /**
-   * Emitted when dialog has opened.
+   * Cancelation event emitted when default 'Cancel' button clicked or 'cancelDialog' method is called.
    */
-  icDialogOpened: EventEmitter<void>;
+  icDialogCancelled: EventEmitter<void>;
   /**
    * Emitted when dialog has closed.
    */
@@ -68,24 +84,13 @@ export declare class Dialog {
    */
   icDialogConfirmed: EventEmitter<void>;
   /**
-   * Cancelation event emitted when default 'Cancel' button clicked or 'cancelDialog' method is called.
+   * Emitted when dialog has opened.
    */
-  icDialogCancelled: EventEmitter<void>;
-  private sourceElement;
-  private interactiveElementList;
-  private dialogEl;
-  private focusedElementIndex;
-  private DATA_OVERFLOW;
-  private DATA_GETS_FOCUS;
-  private DATA_GETS_FOCUS_SELECTOR;
-  private DIALOG_CONTROLS;
-  private IC_TEXT_FIELD;
-  private resizeObserver;
-  private resizeTimeout;
-  private dialogHeight;
-  private buttonOnclick0;
-  private buttonOnclick1;
-  private buttonOnclick2;
+  icDialogOpened: EventEmitter<void>;
+  componentWillLoad(): void;
+  componentDidLoad(): void;
+  handleKeyboard(ev: KeyboardEvent): void;
+  handleClick(ev: MouseEvent): void;
   /**
    * Use to show the dialog.
    */
@@ -102,9 +107,6 @@ export declare class Dialog {
    * Confirms the dialog. Used by the default 'Confirm' button or can be called manually to trigger confirming of dialog.
    */
   confirmDialog(): Promise<void>;
-  watchPropHandler(): void;
-  handleKeyboard(ev: KeyboardEvent): void;
-  handleClick(ev: MouseEvent): void;
   private setContentOverflow;
   private runResizeObserver;
   private resizeObserverCallback;
@@ -117,7 +119,5 @@ export declare class Dialog {
   private setButtonOnClick;
   private getButtonOnclick;
   private getButtonVariant;
-  componentWillLoad(): void;
-  componentDidLoad(): void;
   render(): any;
 }

package/dist/types/components/ic-footer/ic-footer.d.ts

@@ -8,15 +8,11 @@ import { IcFooterBreakpoints } from "./ic-footer.types";
  * @slot caption - Content will be rendered above Crown Copyright.
  */
 export declare class Footer {
+  private footerEl;
+  private resizeObserver;
   el: HTMLIcFooterElement;
-  /**
-   *  @internal Triggers on page resize and triggers style changes in footer links and link groups
-   */
-  footerResized: EventEmitter<void>;
-  /**
-   * The description displayed at the top of the footer.
-   */
-  description: string;
+  deviceSize: number;
+  foregroundColor: IcThemeForeground;
   /**
    * The alignment of the section containers used within the footer.
    */
@@ -25,10 +21,6 @@ export declare class Footer {
    * The screen size breakpoint at which to switch to the small layout.
    */
   breakpoint?: IcFooterBreakpoints;
-  /**
-   * If `true`, the footer will be set up to handle link groups instead of standalone links.
-   */
-  groupLinks?: boolean;
   /**
    * The caption displayed at the bottom of the footer.
    */
@@ -37,16 +29,24 @@ export declare class Footer {
    * If `true`, the footer will display the crown copyright at the bottom.
    */
   copyright: boolean;
-  deviceSize: number;
-  foregroundColor: IcThemeForeground;
-  private isSmall;
+  /**
+   * The description displayed at the top of the footer.
+   */
+  description: string;
+  /**
+   * If `true`, the footer will be set up to handle link groups instead of standalone links.
+   */
+  groupLinks?: boolean;
+  /**
+   *  @internal Triggers on page resize and triggers style changes in footer links and link groups
+   */
+  footerResized: EventEmitter<void>;
+  disconnectedCallback(): void;
+  componentWillLoad(): void;
+  componentDidLoad(): void;
   themeChangeHandler(ev: CustomEvent): void;
-  private resizeObserver;
-  private footerEl;
+  private isSmall;
   private resizeObserverCallback;
   private runResizeObserver;
-  componentWillLoad(): void;
-  componentDidLoad(): void;
-  disconnectedCallback(): void;
   render(): any;
 }

package/dist/types/components/ic-footer-link/ic-footer-link.d.ts

@@ -5,6 +5,13 @@ type FooterConfig = {
 };
 export declare class FooterLink {
   el: HTMLIcFooterLinkElement;
+  deviceSize: number;
+  footerConfig: FooterConfig;
+  foregroundColor: IcThemeForeground;
+  /**
+   * If `true`, the user can save the linked URL instead of navigating to it.
+   */
+  download?: string | boolean;
   /**
    * The URL that the link points to.
    */
@@ -25,17 +32,10 @@ export declare class FooterLink {
    * The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).
    */
   target?: string;
-  /**
-   * If `true`, the user can save the linked URL instead of navigating to it.
-   */
-  download?: string | boolean;
-  footerConfig: FooterConfig;
-  deviceSize: number;
-  foregroundColor: IcThemeForeground;
-  private inferConfig;
+  componentWillLoad(): void;
   footerResizeHandler(): void;
   footerThemeChangeHandler(ev: CustomEvent): void;
-  componentWillLoad(): void;
+  private inferConfig;
   render(): any;
 }
 export {};

package/dist/types/components/ic-footer-link-group/ic-footer-link-group.d.ts

@@ -1,19 +1,19 @@
 export declare class FooterLinkGroup {
   el: HTMLIcFooterLinkGroupElement;
+  expanded: boolean;
+  deviceSize: number;
+  dropdownIconStyle: import("../../utils/types").IcThemeForeground;
+  small: boolean;
   /**
    * The title of the link group to be displayed.
    */
   groupTitle: string;
-  small: boolean;
-  expanded: boolean;
-  dropdownIconStyle: import("../../utils/types").IcThemeForeground;
-  deviceSize: number;
+  componentWillLoad(): void;
+  componentDidLoad(): void;
+  footerResizeHandler(): void;
+  footerThemeChangeHandler(ev: CustomEvent): void;
   private isSmall;
   private handleKeydown;
   private toggleExpanded;
-  footerResizeHandler(): void;
-  footerThemeChangeHandler(ev: CustomEvent): void;
-  componentWillLoad(): void;
-  componentDidLoad(): void;
   render(): any;
 }

package/dist/types/components/ic-hero/ic-hero.d.ts

@@ -8,50 +8,50 @@ import { IcHeroContentAlignments } from "./ic-hero.types";
  */
 export declare class Hero {
   el: HTMLIcHeroElement;
+  foregroundColor: IcThemeForeground;
+  rightContent: boolean;
+  leftContentFullWidth: boolean;
+  scrollFactor: string;
   /**
-   * The heading of the hero.
-   */
-  heading: string;
-  /**
-   * The description for the hero.
-   */
-  subheading?: string;
-  /**
-   * The optional secondary heading, replaced by slotted right content.
-   */
-  secondaryHeading?: string;
-  /**
-   * The optional secondary subheading, replaced by slotted right content.
+   * The alignment of the hero.
    */
-  secondarySubheading?: string;
+  aligned: IcAlignment;
   /**
    * The optional background image.
    */
   backgroundImage?: string;
+  /**
+   * The alignment of the hero content.
+   */
+  contentAligned: IcHeroContentAlignments;
   /**
    * If `true`, the background image (if set) will not scroll using a parallax effect.
    */
   disableBackgroundParallax?: boolean;
   /**
-   * The alignment of the hero.
+   * The heading of the hero.
    */
-  aligned: IcAlignment;
+  heading: string;
   /**
-   * The alignment of the hero content.
+   * The optional secondary heading, replaced by slotted right content.
    */
-  contentAligned: IcHeroContentAlignments;
+  secondaryHeading?: string;
+  /**
+   * The optional secondary subheading, replaced by slotted right content.
+   */
+  secondarySubheading?: string;
   /**
    * If `true`, the small styling will be applied to the hero.
    */
   small: boolean;
-  rightContent: boolean;
-  scrollFactor: string;
-  leftContentFullWidth: boolean;
-  foregroundColor: IcThemeForeground;
-  themeChangeHandler(ev: CustomEvent): void;
-  doScroll(): void;
+  /**
+   * The description for the hero.
+   */
+  subheading?: string;
   componentWillLoad(): void;
   componentDidLoad(): void;
   componentWillRender(): void;
+  themeChangeHandler(ev: CustomEvent): void;
+  doScroll(): void;
   render(): any;
 }

package/dist/types/components/ic-horizontal-scroll/ic-horizontal-scroll.d.ts

@@ -1,25 +1,29 @@
 import { IcThemeForeground } from "../../utils/types";
 export declare class HorizontalScroll {
+  private buttonStateSet;
+  private isScrolling;
+  private itemOffsets;
+  private items;
+  private itemsContainerEl;
+  private resizeObserver;
+  private scrollDelay;
   el: HTMLIcHorizontalScrollElement;
+  firstItemVisible: boolean;
+  itemOverflow: boolean;
+  lastItemVisible: boolean;
   /**
    * The appearance of the horizontal scroll, e.g. dark, light or the default.
    */
   appearance?: IcThemeForeground;
-  firstItemVisible: boolean;
-  lastItemVisible: boolean;
-  itemOverflow: boolean;
-  private itemOffsets;
-  private itemsContainerEl;
-  private items;
-  private resizeObserver;
-  private isScrolling;
-  private scrollDelay;
-  private buttonStateSet;
+  componentWillLoad(): void;
+  componentDidLoad(): void;
+  disconnectedCallback(): void;
   /**
    * @internal if side scrolling enabled, scrolls the specified item into view.
    */
   scrollItemIntoView(itemPosition: number): Promise<void>;
-  itemFocusHandler(itemPosition: number): void;
+  private focusHandler;
+  private itemFocusHandler;
   private resizeObserverCallback;
   private runResizeObserver;
   private scrollLeft;
@@ -32,8 +36,5 @@ export declare class HorizontalScroll {
   private getCurrentLeftItem;
   private scrollHandler;
   private scrollStopped;
-  componentWillLoad(): void;
-  componentDidLoad(): void;
-  disconnectedCallback(): void;
   render(): any;
 }