wcs-core 3.0.0 → 4.0.1

package/dist/types/components/select/select-interface.d.ts

@@ -1,3 +1,7 @@
+import { WcsSize } from "../../shared-types";
 export interface SelectChangeEventDetail {
   value: any | any[] | undefined | null;
 }
+export declare const WcsSelectSizeValue: readonly ["m", "l"];
+export type WcsSelectSize = Extract<WcsSize, typeof WcsSelectSizeValue[number]>;
+export declare function isWcsSelectSize(size: string): size is WcsSelectSize;

package/dist/types/components/select/select.d.ts

@@ -1,5 +1,5 @@
 import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
-import { SelectChangeEventDetail } from './select-interface';
+import { SelectChangeEventDetail, WcsSelectSize } from './select-interface';
 import { SelectOptionChosedEvent, SelectOptionValue } from '../select-option/select-option-interface';
 /**
  * Select component, use in conjuction with wcs-select-option.
@@ -8,22 +8,30 @@ import { SelectOptionChosedEvent, SelectOptionValue } from '../select-option/sel
  *  <wcs-select>
  *      <wcs-select-option value="1">One</wcs-select-option>
  *  </wcs-select>```
- * @todo Complete keyboard navigation.
  */
 export declare class Select implements ComponentInterface {
   private stateService;
+  private selectId;
+  private labelElement;
   private optionsEl;
+  private optionsId;
   private controlEl;
   private values;
-  el: HTMLWcsSelectElement;
+  private lastSelectedOptionElement;
+  private lastFocusedOptionElement;
+  private el;
   /** Wether the select is expanded */
-  expanded: boolean;
+  private expanded;
+  /**
+   * Specify the size (height) of the select.
+   */
+  size: WcsSelectSize;
   /** Wether the component is fully loaded in the DOM. */
-  hasLoaded: boolean;
+  private hasLoaded;
   /** Text to display for the selected option, when no option is selected, the value is undefined. */
-  displayText: string;
+  private displayText;
   /** When the host is focused. */
-  focused: boolean;
+  private focused;
   /** The currently selected value. */
   value?: any | null;
   /** The text to display when the select is empty. */
@@ -38,7 +46,8 @@ export declare class Select implements ComponentInterface {
   name?: string;
   /** Function used to compare options, default : deep comparison. */
   compareWith?: (optionValue: any, selectedValue: any) => boolean;
-  overlayDirection: 'bottom' | 'top';
+  private popper;
+  private overlayDirection;
   /** Emitted when the value has changed. */
   wcsChange: EventEmitter<SelectChangeEventDetail>;
   /** Emitted when the select has focus. */
@@ -57,22 +66,15 @@ export declare class Select implements ComponentInterface {
    */
   private reset;
   componentDidLoad(): void;
+  private createPopperInstance;
   private emitChange;
   private replaceOptions_firefoxBefore63;
   private listenDomUpdate_firefoxBefore63;
+  componentWillLoad(): Promise<void> | void;
   componentWillUpdate(): void;
   private get options();
+  private get notDisabledOptions();
   private initMachineOptions;
-  /**
-   * This method controls whether or not the overlay has enough space to be displayed
-   * at the bottom of the select component.
-   *
-   * It compute the size of the expended select by adding the theoretical dimensions of the
-   * overlay calculated from the number of options plus the initial select size.
-   * @private
-   */
-  private updateOverlayDirection;
-  private updateOverlayMargin;
   private handleClickEvent;
   private handleClickOnMultiple;
   private updateValueWithValues;
@@ -82,11 +84,21 @@ export declare class Select implements ComponentInterface {
   private get hasValue();
   onMouseDown(event: MouseEvent): void;
   onWindowClickEvent(event: MouseEvent): void;
+  onKeyDown(_event: KeyboardEvent): void;
+  private getClosestActiveOptionIndexForState;
+  private selectOption;
+  private selectClosestOption;
+  private selectFirstOption;
+  private selectLastOption;
+  private focusOption;
+  private focusClosestOption;
+  private focusFirstOption;
+  private focusLastOption;
   selectedOptionChanged(event: CustomEvent<SelectOptionChosedEvent>): void;
-  sendOptionClickedToStateMachine(event: SelectOptionChosedEvent): void;
+  sendOptionSelectedToStateMachine(event: SelectOptionChosedEvent): void;
   onSlotchange(): void;
   removeChip(v: SelectOptionValue): void;
+  componentDidRender(): void;
   render(): any;
-  private updateStyles;
   private focusedAttributes;
 }

package/dist/types/components/select-option/select-option.d.ts

@@ -1,11 +1,11 @@
 import { EventEmitter, ComponentInterface } from '../../stencil-public-runtime';
 import { SelectOptionChosedEvent } from './select-option-interface';
-import { MDCRipple } from '@material/ripple';
 /**
  * Select option component, use in conjunction with wcs-select.
  */
 export declare class SelectOption implements ComponentInterface {
-  el: HTMLWcsSelectOptionElement;
+  private el;
+  private selectOptionId;
   /** Wether this option can be selected. */
   disabled: boolean;
   /** Wether this option is selected. */
@@ -23,10 +23,16 @@ export declare class SelectOption implements ComponentInterface {
    * @ignore
    */
   multiple: boolean;
-  mdcRipple: MDCRipple;
+  private mdcRipple;
   wcsSelectOptionClick: EventEmitter<SelectOptionChosedEvent>;
   componentWillLoad(): void;
   componentDidLoad(): void;
+  private chooseOption;
   onMouseDown(event: MouseEvent): void;
+  /**
+   * Handles the keydown event to update the selection.
+   * @param event keyboard event
+   */
+  handleKeydown(event: KeyboardEvent): void;
   render(): any;
 }

package/dist/types/components/switch/switch.d.ts

@@ -2,7 +2,6 @@ import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
 import { SwitchChangeEventDetail, SwitchLabelAlignment } from './switch-interface';
 export declare class Switch implements ComponentInterface {
   private switchId;
-  el: HTMLElement;
   name: string;
   /**
    * If `true`, the switch is selected.

package/dist/types/components/tabs/tabs.d.ts

@@ -35,9 +35,9 @@ export declare class Tabs implements ComponentInterface {
    * Emitted when the selected tab change.
    */
   tabChange: EventEmitter<WcsTabChangeEvent>;
-  el: HTMLWcsTabsElement;
-  headers: string[];
-  currentActiveTabIndex: number;
+  private el;
+  private headers;
+  private currentActiveTabIndex;
   selectedIndexChanged(newValue: number): void;
   selectedTabkeyChanged(newValue: any): void;
   private emitActiveTabChange;

package/dist/types/components/textarea/textarea.d.ts

@@ -2,6 +2,9 @@ import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
 import { TextareaChangeEventDetail } from './textarea-interface';
 /**
  * Mainly inspired from Ionic Textarea Component
+ *
+ * @cssprop --wcs-textarea-max-height - Max height of the text area component
+ *
  */
 export declare class Textarea implements ComponentInterface {
   private nativeInput?;
@@ -17,8 +20,8 @@ export declare class Textarea implements ComponentInterface {
    * @internal
    */
   fireFocusEvents: boolean;
-  el: HTMLElement;
-  hasFocus: boolean;
+  private el;
+  private hasFocus;
   /**
    * Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user.
    */
@@ -108,6 +111,11 @@ export declare class Textarea implements ComponentInterface {
    * The value of the textarea.
    */
   value?: string | null;
+  /**
+   * Indicates how the textarea should be resizable.
+   * Possible values 'both' | 'none' | 'vertical' | 'horizontal'
+   */
+  resize?: 'both' | 'none' | 'vertical' | 'horizontal';
   /**
    * Update the native input element when the value changes
    */

package/dist/types/components/tooltip/tooltip.d.ts

@@ -1,6 +1,5 @@
 import { ComponentInterface } from '../../stencil-public-runtime';
 import { WcsTooltipAppendTo, WcsTooltipPosition } from './tooltip-interface';
-import { Instance, Props } from 'tippy.js';
 /**
  * Tooltips are used to provide additional information for features available on the website. These can improve the user
  * experience or simply show additional information. Tooltips appear when the user rolls over or clicks on them
@@ -84,7 +83,7 @@ export declare class Tooltip implements ComponentInterface {
    */
   appendTo: WcsTooltipAppendTo;
   private el;
-  tippyInstance: Instance<Props>;
+  private tippyInstance;
   componentWillLoad(): Promise<void> | void;
   private getTooltipContentFromPropAndSlot;
   private updateProps;