npm - @ukic/web-components - Versions diffs - 2.0.0-alpha.125 → 2.0.1 - Mend

@ukic/web-components 2.0.0-alpha.125 → 2.0.1

Files changed (595) hide show

@@ -19,13 +19,13 @@ export declare class Switch {
    */
   helperText?: string;
   /**
-   * If true, the component is checked, if null the components state will be uncontrolled.
+   * If true, the component is checked.
    */
-  checked?: boolean | null;
+  checked?: boolean;
   /**
-   * If true, the component reduces in size to the dense state.
+   * If true, the component reduces in size to the small state.
    */
-  dense?: boolean;
+  small?: boolean;
   /**
    * If true, the component is not interactive.
    */
@@ -59,9 +59,13 @@ export declare class Switch {
    */
   icBlur: EventEmitter<void>;
   checkedState: boolean;
+  initiallyChecked: boolean;
   private handleChange;
   private onFocus;
   private onBlur;
+  private handleFormReset;
+  componentWillLoad(): void;
   componentDidLoad(): void;
+  disconnectedCallback(): void;
   render(): any;
 }

package/dist/types/components/ic-tab/ic-tab.d.ts CHANGED Viewed

@@ -1,5 +1,6 @@
 import { EventEmitter } from "../../stencil-public-runtime";
 import { IcTabClickEventDetail } from "./ic-tab.types";
+import { IcThemeForegroundNoDefault } from "../../utils/types";
 /**
  * @slot icon - Content will be rendered next to the tab label.
  */
@@ -17,8 +18,8 @@ export declare class Tab {
   tabId?: string;
   /** @internal The position of the tab inside the tabs array in context. */
   tabPosition: number;
-  /** @internal Determines whether the dark variant of the tabs should be displayed. */
-  dark?: boolean;
+  /** @internal Determines whether the light or dark variant of the tabs should be displayed. */
+  appearance?: IcThemeForegroundNoDefault;
   /**
    * Called when a tab is selected.
    */

@@ -1,5 +1,5 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { IcActivationTypes } from "../../utils/types";
+import { IcActivationTypes, IcThemeForegroundNoDefault } from "../../utils/types";
 import { IcTabClickEventDetail, IcTabSelectEventDetail } from "../ic-tab/ic-tab.types";
 export declare class TabContext {
   host: HTMLIcTabContextElement;
@@ -16,9 +16,9 @@ export declare class TabContext {
    */
   selectedTabIndex?: number;
   /**
-   * Determines whether the dark variant of the tabs should be displayed.
+   * Determines whether the light or dark variant of the tabs should be displayed.
    */
-  dark?: boolean;
+  appearance?: IcThemeForegroundNoDefault;
   selectedTab: number | null;
   updateSelectedTab(newValue: number): void;
   /**
@@ -30,7 +30,7 @@ export declare class TabContext {
   private tabs;
   private enabledTabs;
   private tabPanels;
-  private tabList;
+  private tabGroup;
   private focusedTabIndex;
   private linkTabs;
   private getChildren;

@@ -1,6 +1,7 @@
 import { IcTabClickEventDetail } from "../ic-tab/ic-tab.types";
-export declare class TabList {
-  host: HTMLIcTabListElement;
+import { IcThemeForegroundNoDefault } from "../../utils/types";
+export declare class TabGroup {
+  host: HTMLIcTabGroupElement;
   /**
    * Provide a unique context if using multiple tabs inside one another i.e. rendering another set of tabs inside a tab panel.
    */
@@ -13,14 +14,14 @@ export declare class TabList {
    * Provide a label to describe the purpose of the set of tabs to screen reader users.
    */
   label: string;
-  /** @internal Determines whether the dark variant of the tabs should be displayed. */
-  dark?: boolean;
+  /** @internal Determines whether the light or dark variant of the tabs should be displayed. */
+  appearance?: IcThemeForegroundNoDefault;
   firstTabVisible: boolean;
   lastTabVisible: boolean;
   tabOverflow: boolean;
   private tabs;
   private tabOffsets;
-  private tabListEl;
+  private tabGroupEl;
   private splitterEl;
   private resizeObserver;
   private isScrolling;

@@ -1,3 +1,4 @@
+import { IcThemeForegroundNoDefault } from "../../utils/types";
 export declare class TabPanel {
   host: HTMLIcTabPanelElement;
   /**
@@ -10,6 +11,8 @@ export declare class TabPanel {
   panelId?: string;
   /** @internal The shared ID of the currently selected tab. */
   selectedTab?: string;
+  /** @internal Determines whether the light or dark variant of the tabs should be displayed. */
+  appearance?: IcThemeForegroundNoDefault;
   componentDidLoad(): void;
   render(): any;
 }

@@ -59,9 +59,9 @@ export declare class TextField {
    */
   resize: boolean;
   /**
-   * Specify whether dense styling is to be applied to the element.
+   * Specify whether small styling is to be applied to the element.
    */
-  dense: boolean;
+  small: boolean;
   /**
    * Value of TextField.
    */
@@ -103,10 +103,6 @@ export declare class TextField {
    * Set the amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.
    */
   debounce: number;
-  /**
-   * Determines whether the dark variant of the text field should be displayed.
-   */
-  dark?: boolean;
   private showLeftIcon;
   private debounceChanged;
   /**
@@ -157,6 +153,7 @@ export declare class TextField {
   hiddenInput: boolean;
   numChars: number;
   maxLengthExceeded: boolean;
+  initialValue: string;
   watchValueHandler(newValue: string): void;
   /**
    * Sets focus on the native `input`
@@ -192,8 +189,10 @@ export declare class TextField {
   private hasLeftIconSlot;
   private hasStatus;
   private showStatusText;
+  private handleFormReset;
   connectedCallback(): void;
   componentWillLoad(): void;
   componentDidLoad(): void;
+  disconnectedCallback(): void;
   render(): any;
 }

@@ -2,9 +2,9 @@ import { IcTooltipPlacements } from "./ic-tooltip.types";
 export declare class Tooltip {
   el: HTMLIcTooltipElement;
   /**
-   * The id of the element the tooltip is describing - for when aria-labelledby or aria-describedby is used.
+   * The ID of the element the tooltip is describing - for when aria-labelledby or aria-describedby is used.
    */
-  elementId?: string;
+  target?: string;
   /**
    * The position of the tool-tip in relation to the parent element.
    */

@@ -8,6 +8,6 @@ export declare class Typography {
   /**
    * Adds appropriate margins to the top and bottom of the typography.
    */
-  spacing?: boolean;
+  applyVerticalMargins?: boolean;
   render(): any;
 }