wcs-core 3.0.0 → 4.0.0

package/dist/esm/wcs.js

@@ -17,7 +17,7 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return bootstrapLazy([["wcs-editable-field",[[1,"wcs-editable-field",{"type":[1],"label":[1],"readonly":[4],"value":[1032],"validateFn":[16],"formatFn":[16],"errorMsg":[1,"error-msg"],"currentState":[32],"isError":[32]},[[8,"click","onWindowClickEvent"]]]]],["wcs-horizontal-stepper",[[1,"wcs-horizontal-stepper",{"currentStep":[1026,"current-step"],"steps":[16],"mode":[1],"checkOnComplete":[4,"check-on-complete"],"buttonMode":[32],"internalCurrentStep":[32],"previous":[64],"next":[64]}]]],["wcs-grid",[[1,"wcs-grid",{"serverMode":[4,"server-mode"],"data":[16],"loading":[4],"selectionConfig":[1,"selection-config"],"selectedItems":[8,"selected-items"],"wcsGridPaginationId":[1,"wcs-grid-pagination-id"],"rowIdPath":[1,"row-id-path"],"columns":[32],"paginationEl":[32],"rows":[32]},[[0,"wcsHiddenChange","onHiddenColumnChange"],[0,"wcsSortChange","sortChangeEventHandler"],[0,"wcsGridPaginationChange","paginationChangeEventHandler"],[8,"wcsGridPaginationChange","paginationChangeEventHandlerOutside"]]]]],["wcs-grid-pagination",[[1,"wcs-grid-pagination",{"availablePageSizes":[16],"currentPage":[2,"current-page"],"pageSize":[2,"page-size"],"itemsCount":[2,"items-count"],"pageCount":[2,"page-count"]}]]],["wcs-modal",[[4,"wcs-modal",{"withoutBackdrop":[516,"without-backdrop"],"show":[516],"showCloseButton":[516,"show-close-button"],"size":[1],"hideActions":[516,"hide-actions"]},[[4,"keydown","onKeyDown"]]]]],["wcs-dropdown",[[1,"wcs-dropdown",{"noArrow":[4,"no-arrow"],"mode":[1],"shape":[1],"disabled":[4],"placement":[1],"expanded":[32]},[[8,"click","onWindowClickEvent"],[0,"wcsDropdownItemClick","dropdownItemClick"],[0,"keydown","onKeyDown"]]]]],["wcs-galactic-menu",[[1,"wcs-galactic-menu",{"text":[1],"showPopoverMenu":[32]},[[8,"click","onWindowClickEvent"]]]]],["wcs-input",[[17,"wcs-input",{"fireFocusEvents":[4,"fire-focus-events"],"accept":[1],"autocapitalize":[1],"autocomplete":[1],"autocorrect":[1],"autofocus":[4],"clearInput":[4,"clear-input"],"clearOnEdit":[4,"clear-on-edit"],"debounce":[2],"prefixLabel":[1,"prefix-label"],"suffixLabel":[1,"suffix-label"],"disabled":[4],"enterkeyhint":[1],"icon":[1],"inputmode":[1],"max":[1],"maxlength":[2],"min":[1],"minlength":[2],"multiple":[4],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[4],"required":[4],"spellcheck":[4],"state":[513],"step":[1],"size":[2],"type":[1],"value":[1032],"hasFocus":[32],"passwordReveal":[32],"setFocus":[64],"setBlur":[64],"getInputElement":[64]}]]],["wcs-textarea",[[1,"wcs-textarea",{"fireFocusEvents":[4,"fire-focus-events"],"autocapitalize":[1],"autofocus":[4],"clearOnEdit":[1028,"clear-on-edit"],"debounce":[2],"disabled":[4],"icon":[1],"inputmode":[1],"enterkeyhint":[1],"maxlength":[2],"minlength":[2],"name":[1],"placeholder":[1],"readonly":[4],"required":[4],"spellcheck":[4],"state":[513],"cols":[2],"rows":[2],"wrap":[1],"autoGrow":[4,"auto-grow"],"value":[1025],"hasFocus":[32],"fitContent":[64],"setFocus":[64],"setBlur":[64],"getInputElement":[64]}]]],["wcs-accordion",[[1,"wcs-accordion",{"hideActionText":[516,"hide-action-text"],"highlight":[516],"groupContentWithHeader":[516,"group-content-with-header"]},[[0,"wcsOpenChange","wcsOpenChangeHandler"]]]]],["wcs-accordion-content",[[1,"wcs-accordion-content"]]],["wcs-accordion-header",[[1,"wcs-accordion-header"]]],["wcs-accordion-panel",[[1,"wcs-accordion-panel",{"open":[1540],"hideActionText":[516,"hide-action-text"],"highlight":[516],"groupContentWithHeader":[516,"group-content-with-header"],"close":[64]}]]],["wcs-action-bar",[[1,"wcs-action-bar",{"gutter":[4],"hasTabs":[32]}]]],["wcs-app",[[1,"wcs-app"]]],["wcs-badge",[[1,"wcs-badge",{"shape":[1],"color":[1]}]]],["wcs-card",[[1,"wcs-card",{"mode":[1537]}]]],["wcs-card-body",[[1,"wcs-card-body"]]],["wcs-com-nav",[[1,"wcs-com-nav",{"appName":[1,"app-name"],"mobileMenuOpen":[32],"currentActiveSizing":[32]},[[0,"wcsClickOnFinalAction","onClickOnFinalAction"],[0,"wcsCategoryItemClicked","onClickOnFinalActionCat"]]]]],["wcs-com-nav-category",[[1,"wcs-com-nav-category",{"label":[1],"categoryOpen":[32],"close":[64],"open":[64]},[[8,"click","onWindowClickEvent"],[8,"wcsCategoryOpened","onSubmenuOpened"]]]]],["wcs-com-nav-submenu",[[1,"wcs-com-nav-submenu",{"label":[1],"panelTitle":[1,"panel-title"],"panelDescription":[1,"panel-description"],"menuOpen":[32],"close":[64],"open":[64]},[[8,"click","onWindowClickEvent"],[8,"wcsSubmenuOpened","onSubmenuOpened"],[8,"keydown","onEscapeKeyDown"],[0,"wcsCategoryItemClicked","wcsCategoryItemClickedHandler"]]]]],["wcs-divider",[[1,"wcs-divider"]]],["wcs-dropdown-divider",[[1,"wcs-dropdown-divider"]]],["wcs-dropdown-header",[[1,"wcs-dropdown-header"]]],["wcs-dropdown-item",[[4,"wcs-dropdown-item",null,[[1,"mousedown","onMouseDown"],[0,"keydown","onKeyDown"]]]]],["wcs-field",[[1,"wcs-field"]]],["wcs-field-content",[[1,"wcs-field-content"]]],["wcs-field-label",[[1,"wcs-field-label"]]],["wcs-footer",[[1,"wcs-footer"]]],["wcs-galactic",[[1,"wcs-galactic",{"text":[1],"show":[32]}]]],["wcs-grid-column",[[1,"wcs-grid-column",{"path":[1],"name":[1],"sort":[4],"sortFn":[16],"formatter":[16],"sortOrder":[1025,"sort-order"],"width":[1],"customCells":[4,"custom-cells"],"hidden":[4]}]]],["wcs-grid-custom-cell",[[1,"wcs-grid-custom-cell",{"columnId":[1,"column-id"],"rowId":[8,"row-id"]}]]],["wcs-header",[[1,"wcs-header"]]],["wcs-hint",[[1,"wcs-hint",{"small":[1540]}]]],["wcs-icon",[[0,"wcs-icon",{"icon":[1],"size":[1]}]]],["wcs-label",[[1,"wcs-label",{"required":[516]}]]],["wcs-list-item",[[1,"wcs-list-item",{"activated":[1028]}]]],["wcs-list-item-properties",[[1,"wcs-list-item-properties"]]],["wcs-list-item-property",[[1,"wcs-list-item-property"]]],["wcs-nav",[[1,"wcs-nav"]]],["wcs-nav-item",[[4,"wcs-nav-item",{"text":[513],"href":[513]},[[0,"keydown","onKeyDown"]]]]],["wcs-progress-radial",[[1,"wcs-progress-radial",{"size":[2],"showLabel":[4,"show-label"],"value":[2]}]]],["wcs-radio-group",[[1,"wcs-radio-group",{"value":[8],"name":[520],"mode":[513]},[[0,"wcsRadioClick","selectedOptionChanged"]]]]],["wcs-switch",[[1,"wcs-switch",{"name":[1],"checked":[516],"labelAlignment":[513,"label-alignment"],"disabled":[4]}]]],["wcs-tab",[[1,"wcs-tab",{"header":[513],"itemKey":[8,"item-key"]}]]],["wcs-tabs",[[1,"wcs-tabs",{"align":[513],"selectedIndex":[2,"selected-index"],"selectedKey":[8,"selected-key"],"headersOnly":[4,"headers-only"],"gutter":[4],"headers":[32],"currentActiveTabIndex":[32]},[[0,"tabLoaded","onTabLoaded"]]]]],["wcs-tooltip",[[1,"wcs-tooltip",{"for":[1],"position":[513],"interactive":[4],"maxWidth":[8,"max-width"],"delay":[2],"duration":[2],"trigger":[1],"theme":[1],"content":[1],"appendTo":[1,"append-to"],"hide":[64],"show":[64],"disable":[64],"enable":[64]}]]],["wcs-progress-bar",[[1,"wcs-progress-bar",{"small":[4],"showLabel":[4,"show-label"],"value":[2]}]]],["wcs-radio",[[1,"wcs-radio",{"mode":[513],"value":[1544],"label":[1537],"checked":[1540],"disabled":[1028]},[[0,"keydown","onKeyDown"]]]]],["wcs-checkbox",[[1,"wcs-checkbox",{"name":[1],"indeterminate":[1540],"checked":[1540],"labelAlignment":[1537,"label-alignment"],"disabled":[4]}]]],["wcs-select_2",[[4,"wcs-select-option",{"disabled":[1540],"selected":[1540],"value":[8],"chipColor":[1,"chip-color"],"chipBackgroundColor":[1,"chip-background-color"],"multiple":[1540]},[[1,"mousedown","onMouseDown"]]],[1,"wcs-select",{"value":[1032],"placeholder":[1537],"disabled":[1028],"multiple":[516],"chips":[516],"name":[1],"compareWith":[16],"expanded":[32],"hasLoaded":[32],"displayText":[32],"focused":[32],"overlayDirection":[32],"open":[64],"close":[64]},[[1,"mousedown","onMouseDown"],[8,"click","onWindowClickEvent"],[0,"wcsSelectOptionClick","selectedOptionChanged"]]]]],["wcs-error_2",[[1,"wcs-error"],[1,"wcs-form-field",{"isError":[1540,"is-error"],"hasPrefix":[32],"hasSuffix":[32],"spiedElement":[32]}]]],["wcs-button",[[17,"wcs-button",{"type":[1025],"href":[1],"disabled":[516],"ripple":[4],"shape":[513],"mode":[513],"loading":[1028]},[[0,"click","onClick"]]]]],["wcs-mat-icon",[[1,"wcs-mat-icon",{"icon":[1],"size":[1],"family":[1]}]]],["wcs-spinner",[[1,"wcs-spinner",{"mode":[513]}]]]], options);
+  return bootstrapLazy([["wcs-editable-field",[[1,"wcs-editable-field",{"type":[1],"label":[1],"readonly":[4],"value":[1032],"validateFn":[16],"formatFn":[16],"errorMsg":[1,"error-msg"],"size":[513],"currentState":[32],"isError":[32]},[[8,"click","onWindowClickEvent"]]]]],["wcs-horizontal-stepper",[[1,"wcs-horizontal-stepper",{"currentStep":[1026,"current-step"],"steps":[16],"mode":[1],"checkOnComplete":[4,"check-on-complete"],"internalCurrentStep":[32],"previous":[64],"next":[64]}]]],["wcs-counter",[[1,"wcs-counter",{"size":[513],"label":[1],"min":[1026],"max":[1026],"step":[1026],"value":[1026],"currentValue":[32],"displayedValue":[32]}]]],["wcs-grid",[[1,"wcs-grid",{"serverMode":[4,"server-mode"],"data":[16],"loading":[4],"selectionConfig":[1,"selection-config"],"selectedItems":[8,"selected-items"],"wcsGridPaginationId":[1,"wcs-grid-pagination-id"],"rowIdPath":[1,"row-id-path"],"columns":[32],"paginationEl":[32],"rows":[32]},[[0,"wcsHiddenChange","onHiddenColumnChange"],[0,"wcsSortChange","sortChangeEventHandler"],[0,"wcsGridPaginationChange","paginationChangeEventHandler"],[8,"wcsGridPaginationChange","paginationChangeEventHandlerOutside"]]]]],["wcs-grid-pagination",[[1,"wcs-grid-pagination",{"availablePageSizes":[16],"currentPage":[2,"current-page"],"pageSize":[2,"page-size"],"itemsCount":[2,"items-count"],"pageCount":[2,"page-count"]}]]],["wcs-modal",[[4,"wcs-modal",{"withoutBackdrop":[516,"without-backdrop"],"show":[516],"showCloseButton":[516,"show-close-button"],"size":[1],"hideActions":[516,"hide-actions"]},[[4,"keydown","onKeyDown"]]]]],["wcs-dropdown",[[1,"wcs-dropdown",{"noArrow":[4,"no-arrow"],"mode":[1],"shape":[1],"disabled":[4],"placement":[1],"expanded":[32]},[[8,"click","onWindowClickEvent"],[0,"wcsDropdownItemClick","dropdownItemClick"],[0,"keydown","onKeyDown"]]]]],["wcs-galactic-menu",[[1,"wcs-galactic-menu",{"text":[1],"showPopoverMenu":[32]},[[8,"click","onWindowClickEvent"]]]]],["wcs-input",[[17,"wcs-input",{"fireFocusEvents":[4,"fire-focus-events"],"accept":[1],"autocapitalize":[1],"autocomplete":[1],"autocorrect":[1],"autofocus":[4],"clearInput":[4,"clear-input"],"clearOnEdit":[4,"clear-on-edit"],"debounce":[2],"prefixLabel":[1,"prefix-label"],"suffixLabel":[1,"suffix-label"],"disabled":[4],"enterkeyhint":[1],"size":[513],"icon":[1],"inputmode":[1],"max":[1],"maxlength":[2],"min":[1],"minlength":[2],"multiple":[4],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[4],"required":[4],"spellcheck":[4],"state":[513],"step":[1],"type":[1],"value":[1032],"hasFocus":[32],"passwordReveal":[32],"setFocus":[64],"setBlur":[64],"getInputElement":[64]}]]],["wcs-textarea",[[1,"wcs-textarea",{"fireFocusEvents":[4,"fire-focus-events"],"autocapitalize":[1],"autofocus":[4],"clearOnEdit":[1028,"clear-on-edit"],"debounce":[2],"disabled":[4],"icon":[1],"inputmode":[1],"enterkeyhint":[1],"maxlength":[2],"minlength":[2],"name":[1],"placeholder":[1],"readonly":[4],"required":[4],"spellcheck":[4],"state":[513],"cols":[2],"rows":[2],"wrap":[1],"autoGrow":[4,"auto-grow"],"value":[1025],"resize":[513],"hasFocus":[32],"fitContent":[64],"setFocus":[64],"setBlur":[64],"getInputElement":[64]}]]],["wcs-accordion",[[1,"wcs-accordion",{"hideActionText":[516,"hide-action-text"],"highlight":[516],"groupContentWithHeader":[516,"group-content-with-header"]},[[0,"wcsOpenChange","wcsOpenChangeHandler"]]]]],["wcs-accordion-content",[[1,"wcs-accordion-content"]]],["wcs-accordion-header",[[1,"wcs-accordion-header"]]],["wcs-accordion-panel",[[1,"wcs-accordion-panel",{"open":[1540],"hideActionText":[516,"hide-action-text"],"highlight":[516],"groupContentWithHeader":[516,"group-content-with-header"],"close":[64]}]]],["wcs-action-bar",[[1,"wcs-action-bar",{"gutter":[4],"hasTabs":[32]}]]],["wcs-app",[[1,"wcs-app"]]],["wcs-badge",[[1,"wcs-badge",{"shape":[1],"color":[1]}]]],["wcs-card",[[1,"wcs-card",{"mode":[1537]}]]],["wcs-card-body",[[1,"wcs-card-body"]]],["wcs-com-nav",[[1,"wcs-com-nav",{"appName":[1,"app-name"],"mobileMenuOpen":[32],"currentActiveSizing":[32]},[[0,"wcsClickOnFinalAction","onClickOnFinalAction"],[0,"wcsCategoryItemClicked","onClickOnFinalActionCat"]]]]],["wcs-com-nav-category",[[1,"wcs-com-nav-category",{"label":[1],"categoryOpen":[32],"close":[64],"open":[64]},[[8,"click","onWindowClickEvent"],[8,"wcsCategoryOpened","onSubmenuOpened"]]]]],["wcs-com-nav-submenu",[[1,"wcs-com-nav-submenu",{"label":[1],"panelTitle":[1,"panel-title"],"panelDescription":[1,"panel-description"],"menuOpen":[32],"close":[64],"open":[64]},[[8,"click","onWindowClickEvent"],[8,"wcsSubmenuOpened","onSubmenuOpened"],[8,"keydown","onEscapeKeyDown"],[0,"wcsCategoryItemClicked","wcsCategoryItemClickedHandler"]]]]],["wcs-divider",[[1,"wcs-divider"]]],["wcs-dropdown-divider",[[1,"wcs-dropdown-divider"]]],["wcs-dropdown-header",[[1,"wcs-dropdown-header"]]],["wcs-dropdown-item",[[4,"wcs-dropdown-item",null,[[1,"mousedown","onMouseDown"],[0,"keydown","onKeyDown"]]]]],["wcs-field",[[1,"wcs-field"]]],["wcs-field-content",[[1,"wcs-field-content"]]],["wcs-field-label",[[1,"wcs-field-label"]]],["wcs-footer",[[1,"wcs-footer"]]],["wcs-galactic",[[1,"wcs-galactic",{"text":[1],"show":[32]}]]],["wcs-grid-column",[[1,"wcs-grid-column",{"path":[1],"name":[1],"sort":[4],"sortFn":[16],"formatter":[16],"sortOrder":[1025,"sort-order"],"width":[1],"customCells":[4,"custom-cells"],"hidden":[4]}]]],["wcs-grid-custom-cell",[[1,"wcs-grid-custom-cell",{"columnId":[1,"column-id"],"rowId":[8,"row-id"]}]]],["wcs-header",[[1,"wcs-header"]]],["wcs-hint",[[1,"wcs-hint",{"small":[1540]}]]],["wcs-icon",[[0,"wcs-icon",{"icon":[1],"size":[1]}]]],["wcs-label",[[1,"wcs-label",{"required":[516]}]]],["wcs-list-item",[[1,"wcs-list-item",{"activated":[1028]}]]],["wcs-list-item-properties",[[1,"wcs-list-item-properties"]]],["wcs-list-item-property",[[1,"wcs-list-item-property"]]],["wcs-native-select",[[1,"wcs-native-select",{"size":[513],"expanded":[32],"disabled":[32]}]]],["wcs-nav",[[1,"wcs-nav"]]],["wcs-nav-item",[[4,"wcs-nav-item",{"text":[513],"href":[513]},[[0,"keydown","onKeyDown"]]]]],["wcs-progress-radial",[[1,"wcs-progress-radial",{"size":[2],"showLabel":[4,"show-label"],"value":[2]}]]],["wcs-radio-group",[[1,"wcs-radio-group",{"value":[8],"name":[520],"mode":[513]},[[0,"wcsRadioClick","selectedOptionChanged"]]]]],["wcs-switch",[[1,"wcs-switch",{"name":[1],"checked":[516],"labelAlignment":[513,"label-alignment"],"disabled":[4]}]]],["wcs-tab",[[1,"wcs-tab",{"header":[513],"itemKey":[8,"item-key"]}]]],["wcs-tabs",[[1,"wcs-tabs",{"align":[513],"selectedIndex":[2,"selected-index"],"selectedKey":[8,"selected-key"],"headersOnly":[4,"headers-only"],"gutter":[4],"headers":[32],"currentActiveTabIndex":[32]},[[0,"tabLoaded","onTabLoaded"]]]]],["wcs-tooltip",[[1,"wcs-tooltip",{"for":[1],"position":[513],"interactive":[4],"maxWidth":[8,"max-width"],"delay":[2],"duration":[2],"trigger":[1],"theme":[1],"content":[1],"appendTo":[1,"append-to"],"hide":[64],"show":[64],"disable":[64],"enable":[64]}]]],["wcs-progress-bar",[[1,"wcs-progress-bar",{"small":[4],"showLabel":[4,"show-label"],"value":[2]}]]],["wcs-radio",[[1,"wcs-radio",{"mode":[513],"value":[1544],"label":[1537],"checked":[1540],"disabled":[1028]},[[0,"keydown","onKeyDown"]]]]],["wcs-select_2",[[4,"wcs-select-option",{"disabled":[1540],"selected":[1540],"value":[8],"chipColor":[1,"chip-color"],"chipBackgroundColor":[1,"chip-background-color"],"multiple":[1540]},[[1,"mousedown","onMouseDown"],[0,"keydown","handleKeydown"]]],[1,"wcs-select",{"size":[513],"value":[1032],"placeholder":[1537],"disabled":[1028],"multiple":[516],"chips":[516],"name":[1],"compareWith":[16],"expanded":[32],"hasLoaded":[32],"displayText":[32],"focused":[32],"overlayDirection":[32],"open":[64],"close":[64]},[[1,"mousedown","onMouseDown"],[8,"click","onWindowClickEvent"],[0,"keydown","onKeyDown"],[0,"wcsSelectOptionClick","selectedOptionChanged"]]]]],["wcs-error_2",[[1,"wcs-error"],[1,"wcs-form-field",{"isError":[1540,"is-error"],"hasPrefix":[32],"hasSuffix":[32],"spiedElement":[32]}]]],["wcs-checkbox",[[1,"wcs-checkbox",{"name":[1],"indeterminate":[1540],"checked":[1540],"labelAlignment":[1537,"label-alignment"],"disabled":[4]}]]],["wcs-button",[[17,"wcs-button",{"type":[1025],"href":[1],"target":[1],"disabled":[516],"ripple":[4],"size":[513],"shape":[513],"mode":[513],"loading":[1028]},[[0,"click","onClick"]]]]],["wcs-mat-icon",[[1,"wcs-mat-icon",{"icon":[1],"size":[1],"family":[1]}]]],["wcs-spinner",[[1,"wcs-spinner",{"mode":[513]}]]]], options);
 });
 
 //# sourceMappingURL=wcs.js.map

package/dist/types/components/action-bar/action-bar.d.ts

@@ -1,12 +1,12 @@
 import { ComponentInterface } from '../../stencil-public-runtime';
 export declare class ActionBar implements ComponentInterface {
-  el: HTMLWcsActionBarElement;
+  private el;
   /**
    * Determines if the action bar should have a border at the bottom.
    * You should not use this property if a gutter is already present on tabs
    */
   gutter: boolean;
-  hasTabs: boolean;
+  private hasTabs;
   componentWillLoad(): Promise<void> | void;
   render(): any;
 }

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

@@ -1,5 +1,4 @@
 import { ComponentInterface } from '../../stencil-public-runtime';
 export declare class App implements ComponentInterface {
-  el: HTMLWcsAppElement;
   render(): any[];
 }

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

@@ -1,3 +1,7 @@
+import { WcsSize } from '../../shared-types';
 export type WcsButtonType = 'button' | 'submit';
-export type WcsButtonShape = 'normal' | 'small' | 'round' | 'square';
+export type WcsButtonShape = 'normal' | 'round' | 'square';
 export type WcsButtonMode = 'plain' | 'stroked' | 'clear';
+export declare const WcsButtonSizeValues: readonly ["s", "m", "l"];
+export type WcsButtonSize = Extract<WcsSize, typeof WcsButtonSizeValues[number]>;
+export declare function isWcsButtonSize(size: string): size is WcsButtonSize;

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

@@ -1,29 +1,37 @@
 import { ComponentInterface } from '../../stencil-public-runtime';
-import { MDCRipple } from '@material/ripple';
-import { WcsButtonMode, WcsButtonShape, WcsButtonType } from './button-interface';
+import { WcsButtonMode, WcsButtonShape, WcsButtonSize, WcsButtonType } from './button-interface';
 /**
  * Button component, can also be a link when specifying href.
  */
 export declare class Button implements ComponentInterface {
-  el: HTMLElement;
+  private el;
   /**
    * Specify the button type.
    */
   type: WcsButtonType;
   /**
-   * Set a URL to point to.
+   * Set a URL to point to.<br/>
    * If specified use a `a` tag instead of `btn`.
    */
   href?: string;
   /**
-   * Specify wether the button is disabled or not.
+   * Specifies where to open the linked document when using href (see prop above)<br/>
+   * Default '_self' will open the linked document in the same frame as it was clicked
+   */
+  target?: '_blank' | '_self';
+  /**
+   * Specify whether the button is disabled or not.
    */
   disabled: boolean;
   /**
-   * Specify wether the button should have a ripple effect or not.
+   * Specify whether the button should have a ripple effect or not.
    */
   ripple: boolean;
-  mdcRipple: MDCRipple;
+  private mdcRipple;
+  /**
+   * Specify the size of the button.
+   */
+  size: WcsButtonSize;
   /**
    * Specify the shape of the button.
    */
@@ -37,6 +45,7 @@ export declare class Button implements ComponentInterface {
    */
   loading: boolean;
   onClick(ev: Event): void;
+  componentWillLoad(): Promise<void> | void;
   componentDidLoad(): void;
   private enabledRippleEffect;
   private disabledRippleEffect;

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

@@ -2,7 +2,6 @@ import { EventEmitter, ComponentInterface } from '../../stencil-public-runtime';
 import { CheckboxChangeEventDetail, CheckboxLabelAlignment } from './checkbox-interface';
 export declare class Checkbox implements ComponentInterface {
   private checkboxId;
-  el: HTMLElement;
   name: string;
   /**
    * If `true` the checkbox is in indeterminate state.

package/dist/types/components/com-nav/com-nav.d.ts

@@ -1,11 +1,11 @@
 import { ComponentInterface } from '../../stencil-public-runtime';
 export declare class ComNav implements ComponentInterface {
-  el: HTMLWcsComNavElement;
+  private el;
   /** Name of the application to be displayed in the menu bar */
   appName: string;
-  mobileMenuOpen: boolean;
-  currentActiveSizing: 'desktop' | 'mobile';
-  resizeObserver: ResizeObserver;
+  private mobileMenuOpen;
+  private currentActiveSizing;
+  private resizeObserver;
   private hasAlreadyRegisteredClickHandlerOnSlottedLink;
   private mobileMenuIconClick;
   disconnectedCallback(): void;

package/dist/types/components/com-nav-category/com-nav-category.d.ts

@@ -1,9 +1,9 @@
 import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
 import { CategoryOpenedEventDetail } from '../com-nav/com-nav-interface';
 export declare class ComNavCategory implements ComponentInterface {
-  el: HTMLWcsComNavCategoryElement;
+  private el;
   label: string;
-  categoryOpen: boolean;
+  private categoryOpen;
   wcsCategoryOpened: EventEmitter<CategoryOpenedEventDetail>;
   wcsCategoryItemClicked: EventEmitter<UIEvent>;
   onWindowClickEvent(_: MouseEvent): void;

package/dist/types/components/com-nav-submenu/com-nav-submenu.d.ts

@@ -1,11 +1,11 @@
 import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
 import { MenuOpenedEventDetail } from '../com-nav/com-nav-interface';
 export declare class ComNavSubmenu implements ComponentInterface {
-  el: HTMLWcsComNavSubmenuElement;
+  private el;
   label: string;
   panelTitle: string;
   panelDescription: string;
-  menuOpen: boolean;
+  private menuOpen;
   wcsSubmenuOpened: EventEmitter<MenuOpenedEventDetail>;
   /**
    * Emitted when a user click on a final navigation action.

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

@@ -0,0 +1,7 @@
+import { WcsSize } from "../../shared-types";
+export interface CounterChangeEventDetail {
+  value: number;
+}
+export declare const WcsCounterSizeValues: readonly ["m", "l"];
+export type WcsCounterSize = Extract<WcsSize, typeof WcsCounterSizeValues[number]>;
+export declare function isWcsCounterSize(size: string): size is WcsCounterSize;

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

@@ -0,0 +1,67 @@
+import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
+import { CounterChangeEventDetail, WcsCounterSize } from './counter-interface';
+/**
+ * Counter component, meant to be used for small range of values (e.g : 0 - 5).<br>
+ * For larger or specific ranges, please use [wcs-input (type number)](.?path=/docs/components-input--documentation)
+ */
+export declare class Counter implements ComponentInterface {
+  private el;
+  /**
+   * Specify the size (height) of the counter.
+   */
+  size: WcsCounterSize;
+  /**
+   * The label of the counter.<br/>
+   * e.g. Number of passengers, train carriages, railroad tracks...
+   */
+  label: string;
+  /**
+   * The minimum value of the counter.
+   * If the value of the min attribute isn't set, then the element has no minimum value.
+   */
+  min?: number;
+  /**
+   * The maximum value of the counter.
+   * If the value of the max attribute isn't set, then the element has no maximum value.
+   */
+  max?: number;
+  /**
+   * Defines by how much the counter will be incremented or decremented.
+   */
+  step: number;
+  /**
+   * Emitted when the value of the counter has changed.
+   */
+  wcsChange: EventEmitter<CounterChangeEventDetail>;
+  /**
+   * Allow to change currentValue programmatically
+   */
+  value?: number;
+  /**
+   * The current value of the counter.
+   */
+  private currentValue;
+  /**
+   * Only for animation and display purpose
+   */
+  private displayedValue;
+  /**
+   * Emitted when the counter loses focus.
+   */
+  wcsBlur: EventEmitter<FocusEvent>;
+  componentWillLoad(): void;
+  /**
+   * Value change programmatically => update currentValue and displayedValue
+   */
+  valueChanged(): void;
+  /**
+   * Current value change => handle event and interval
+   */
+  currentValueChanged(newVal: any, oldVal: any): void;
+  onKeyDown(_event: KeyboardEvent): void;
+  private getCounterContainer;
+  private handleDecrement;
+  private handleIncrement;
+  private animate;
+  render(): any;
+}

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

@@ -2,7 +2,7 @@ import { ComponentInterface } from '../../stencil-public-runtime';
 import { WcsButtonMode, WcsButtonShape } from '../button/button-interface';
 import { WcsDropdownPlacement } from './dropdown-interface';
 export declare class Dropdown implements ComponentInterface {
-  el: HTMLWcsDropdownElement;
+  private el;
   /** Hides the arrow in the button */
   noArrow: boolean;
   /** Dropdown's button mode */
@@ -13,7 +13,7 @@ export declare class Dropdown implements ComponentInterface {
   disabled: boolean;
   /** placement of the dropdown's popover */
   placement: WcsDropdownPlacement;
-  expanded: boolean;
+  private expanded;
   private popper;
   private buttonTextColor;
   protected placementChange(): void;

package/dist/types/components/editable-field/editable-field-interface.d.ts

@@ -1,3 +1,4 @@
+import { WcsSize } from '../../shared-types';
 export type ValidateFn<T> = (value: T) => boolean;
 export type FormatFn<T> = (value: T) => string;
 export interface EditableComponentUpdateEvent {
@@ -9,4 +10,7 @@ export interface EditableComponentUpdateEvent {
   successHandler: () => void;
   errorhandler: () => void;
 }
+export declare const WcsEditableFieldSizeValues: readonly ["m", "l"];
+export type WcsEditableFieldSize = Extract<WcsSize, typeof WcsEditableFieldSizeValues[number]>;
+export declare function isWcsEditableFieldSize(size: string): size is WcsEditableFieldSize;
 export type EditableFieldType = 'input' | 'textarea' | 'select';

package/dist/types/components/editable-field/editable-field.d.ts

@@ -1,13 +1,8 @@
 import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
-import { EditableComponentUpdateEvent, EditableFieldType, FormatFn, ValidateFn } from './editable-field-interface';
-declare enum EditableComponentState {
-  DISPLAY = 0,
-  EDIT = 1,
-  LOAD = 2
-}
+import { EditableComponentUpdateEvent, EditableFieldType, FormatFn, ValidateFn, WcsEditableFieldSize } from './editable-field-interface';
 export declare class EditableField implements ComponentInterface {
-  el: HTMLWcsEditableFieldElement;
-  currentState: EditableComponentState;
+  private el;
+  private currentState;
   /**
    * Specifies which component is used for editing
    */
@@ -40,10 +35,13 @@ export declare class EditableField implements ComponentInterface {
    * Error message displayed under the field if validation failed.
    */
   errorMsg: string;
-  isError: boolean;
-  ignoreNextChangeEvent: boolean;
-  spiedElement: HTMLElement;
-  currentValue: any;
+  /**
+   * Specify the size (height) of the editable field.
+   */
+  size: WcsEditableFieldSize;
+  private isError;
+  private spiedElement;
+  private currentValue;
   componentWillLoad(): Promise<void> | void;
   componentDidRender(): void;
   private initWithInput;
@@ -72,4 +70,3 @@ export declare class EditableField implements ComponentInterface {
   private getReadonlySvgIcon;
   private formatValues;
 }
-export {};

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

@@ -1,4 +1,8 @@
 import { ComponentInterface } from '../../stencil-public-runtime';
+/**
+ * @slot label Label of the field
+ * @slot content Content of the field
+ */
 export declare class Field implements ComponentInterface {
   render(): any;
 }

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

@@ -1,4 +1,9 @@
 import { ComponentInterface } from '../../stencil-public-runtime';
+/**
+ * @slot <no-name> Main container slot
+ * @slot end-left Bottom-left part of the footer
+ * @slot end-right Bottom-right part of the footer
+ */
 export declare class Footer implements ComponentInterface {
   render(): any;
 }

package/dist/types/components/form-field/form-field.d.ts

@@ -4,14 +4,14 @@ import { ComponentInterface } from '../../stencil-public-runtime';
  * - [ ] Suffix button style
  */
 export declare class FormField implements ComponentInterface {
-  el: HTMLWcsFormFieldElement;
+  private el;
   /**
    * Specifies whether the form field is in an error state. Displays the field border in red and the message contained in the wcs-error component
    */
   isError: boolean;
-  hasPrefix: boolean;
-  hasSuffix: boolean;
-  spiedElement: Element;
+  private hasPrefix;
+  private hasSuffix;
+  private spiedElement;
   private observer;
   componentWillLoad(): void;
   componentDidLoad(): void;

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

@@ -1,6 +1,5 @@
 import { ComponentInterface } from '../../stencil-public-runtime';
 export declare class Galactic implements ComponentInterface {
-  el: HTMLWcsGalacticElement;
   /** Text to display in the bar */
   text: string;
   show: boolean;

package/dist/types/components/galactic-menu/galactic-menu.d.ts

@@ -1,7 +1,7 @@
 import { ComponentInterface } from '../../stencil-public-runtime';
 export declare class Galactic implements ComponentInterface {
-  el: HTMLWcsGalacticMenuElement;
-  showPopoverMenu: boolean;
+  private el;
+  private showPopoverMenu;
   private popper;
   /**
    * Text to be displayed in the galactic bar

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

@@ -1,7 +1,7 @@
 import { ComponentDidLoad, ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
 import { WcsGridAllRowSelectedEventDetails, WcsGridColumnSortChangeEventDetails, WcsGridPaginationChangeEventDetails, WcsGridRow, WcsGridRowSelectedEventDetails, WcsGridSelectionConfig } from './grid-interface';
 export declare class Grid implements ComponentInterface, ComponentDidLoad {
-  el: HTMLWcsGridElement;
+  private el;
   /**
    * True to manage sort and pagination with a backend server, default: false
    */
@@ -25,12 +25,12 @@ export declare class Grid implements ComponentInterface, ComponentDidLoad {
    * object's value for this key.
    */
   rowIdPath: string;
-  columns: HTMLWcsGridColumnElement[];
-  paginationEl: HTMLWcsGridPaginationElement;
+  private columns;
+  private paginationEl;
   /**
    * Rows to display, contains user data and meta data
    */
-  rows: WcsGridRow[];
+  private rows;
   /**
    * Event emitted when a row is selected or unselected
    */

package/dist/types/components/grid-column/grid-column.d.ts

@@ -1,7 +1,7 @@
 import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
 import { WcsCellFormatter, WcsGridColumnSortChangeEventDetails, WcsSortFn, WcsSortOrder } from '../grid/grid-interface';
 export declare class GridColumn implements ComponentInterface {
-  el: HTMLWcsGridColumnElement;
+  private el;
   path: string;
   name: string;
   sort: boolean;

package/dist/types/components/grid-pagination/grid-pagination.d.ts

@@ -2,7 +2,6 @@ import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
 import { WcsGridPaginationChangeEventDetails } from '../grid/grid-interface';
 export declare class GridPagination implements ComponentInterface {
   static readonly INDEX_FIRST_PAGE: number;
-  el: HTMLWcsGridPaginationElement;
   availablePageSizes: number[];
   currentPage: number;
   pageSize: number;

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

@@ -1,4 +1,9 @@
 import { ComponentInterface } from '../../stencil-public-runtime';
+/**
+ * @slot logo SNCF Logo
+ * @slot title Title of your application
+ * @slot actions Actions such as buttons, dropdown or any useful information to always display on your application
+ */
 export declare class Header implements ComponentInterface {
   hostData(): {
     slot: string;

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

@@ -1,5 +1,8 @@
 import { ComponentInterface } from '../../stencil-public-runtime';
-export declare class Label implements ComponentInterface {
+export declare class Hint implements ComponentInterface {
+  /**
+   * Whether the component should display the small version of the hint
+   */
   small: boolean;
   render(): any;
 }

package/dist/types/components/horizontal-stepper/horizontal-stepper.d.ts

@@ -1,8 +1,7 @@
 import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
-import { WcsButtonMode } from '../button/button-interface';
 import { HorizontalStepClickEvent, HorizontalStepConfig, HorizontalStepperMode } from './horizontal-stepper-interface';
 export declare class HorizontalStepper implements ComponentInterface {
-  el: HTMLWcsHorizontalStepperElement;
+  private el;
   /**
    * index of the active step. The index corresponds to the index of the step in the 'steps' list
    */
@@ -24,8 +23,7 @@ export declare class HorizontalStepper implements ComponentInterface {
    * Emits when the user selects a new step.
    */
   wcsHorizontalStepClick: EventEmitter<HorizontalStepClickEvent>;
-  buttonMode: WcsButtonMode;
-  internalCurrentStep: any;
+  private internalCurrentStep;
   componentWillLoad(): Promise<void> | void;
   private onCurrentStepChange;
   previous(): Promise<void>;

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

@@ -1,5 +1,9 @@
+import { WcsSize } from '../../shared-types';
 export type AutocompleteTypes = ('on' | 'off' | 'name' | 'honorific-prefix' | 'given-name' | 'additional-name' | 'family-name' | 'honorific-suffix' | 'nickname' | 'email' | 'username' | 'new-password' | 'current-password' | 'one-time-code' | 'organization-title' | 'organization' | 'street-address' | 'address-line1' | 'address-line2' | 'address-line3' | 'address-level4' | 'address-level3' | 'address-level2' | 'address-level1' | 'country' | 'country-name' | 'postal-code' | 'cc-name' | 'cc-given-name' | 'cc-additional-name' | 'cc-family-name' | 'cc-family-name' | 'cc-number' | 'cc-exp' | 'cc-exp-month' | 'cc-exp-year' | 'cc-csc' | 'cc-type' | 'transaction-currency' | 'transaction-amount' | 'language' | 'bday' | 'bday-day' | 'bday-month' | 'bday-year' | 'sex' | 'tel' | 'tel-country-code' | 'tel-national' | 'tel-area-code' | 'tel-local' | 'tel-extension' | 'impp' | 'url' | 'photo');
 export type TextFieldTypes = 'date' | 'email' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'url' | 'time' | 'week' | 'month' | 'datetime-local' | 'file';
+export declare const WcsInputSizeValues: readonly ["s", "m", "l"];
+export type WcsInputSize = Extract<WcsSize, typeof WcsInputSizeValues[number]>;
+export declare function isWcsInputSize(size: string): size is WcsInputSize;
 export interface InputChangeEventDetail {
   value: string | undefined | null;
 }

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

@@ -1,5 +1,5 @@
 import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
-import { AutocompleteTypes, InputChangeEventDetail, TextFieldTypes } from './input-interface';
+import { AutocompleteTypes, InputChangeEventDetail, TextFieldTypes, WcsInputSize } from './input-interface';
 /**
  * Mainly inspired from Ionic Input Component
  */
@@ -18,9 +18,9 @@ export declare class Input implements ComponentInterface {
    * @internal
    */
   fireFocusEvents: boolean;
-  hasFocus: boolean;
-  passwordReveal: boolean;
-  el: HTMLElement;
+  private hasFocus;
+  private passwordReveal;
+  private el;
   /**
    * If the value of the type attribute is `"file"`, then this attribute will indicate the types of files that the server accepts, otherwise it will be ignored. The value must be a comma-separated list of unique content type specifiers.
    */
@@ -73,6 +73,10 @@ export declare class Input implements ComponentInterface {
    * `"previous"`, `"search"`, and `"send"`.
    */
   enterkeyhint?: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';
+  /**
+   * Specify the size (height) of the input.
+   */
+  size: WcsInputSize;
   /**
    * Name of the material icon to add to the input
    */
@@ -136,10 +140,6 @@ export declare class Input implements ComponentInterface {
    * Possible values are: `"any"` or a positive floating point number.
    */
   step?: string;
-  /**
-   * The initial size of the control. This value is in pixels unless the value of the type attribute is `"text"` or `"password"`, in which case it is an integer number of characters. This attribute applies only when the `type` attribute is set to `"text"`, `"search"`, `"tel"`, `"url"`, `"email"`, or `"password"`, otherwise it is ignored.
-   */
-  size?: number;
   /**
    * The type of control to display. The default type is text.
    */

package/dist/types/components/native-select/native-select.component.d.ts

@@ -0,0 +1,56 @@
+import { ComponentInterface } from '../../stencil-public-runtime';
+import { WcsSize } from "../../shared-types";
+export type WcsNativeSelectSize = Extract<WcsSize, 'l' | 'm'>;
+/**
+ * The `wcs-native-select` component is designed to accept a native <select> element as a slotted child. This choice
+ * allows developers to bind the <select> element using the framework of their choice, without the need to re-expose all the
+ * properties of the <select> and <option> elements in this component.
+ *
+ * The component wraps the native <select> element and provides custom styles and behavior, while preserving the native
+ * functionality and accessibility.
+ *
+ * Example usage:
+ *
+ * <wcs-native-select>
+ *   <select>
+ *     <option value="option1">Option 1</option>
+ *     <option value="option2">Option 2</option>
+ *     <option value="option3">Option 3</option>
+ *   </select>
+ * </wcs-native-select>
+ */
+export declare class NativeSelect implements ComponentInterface {
+  /**
+   * The `size` property controls the size of the slotted `select` element by adjusting its padding.
+   * There are two possible size options:
+   * - 'm': medium size
+   * - 'l': large size
+   *
+   * The default value is 'm'.
+   */
+  size: WcsNativeSelectSize;
+  private el;
+  private expanded;
+  private disabled;
+  private selectElement;
+  private observer;
+  private readonly SLOTTED_SELECT_TRACKED_ATTRIBUTES_LIST;
+  componentWillLoad(): void;
+  private onSelectedOptionChange;
+  private isPlaceholderOptionSelected;
+  /**
+   * This method should always unset all styles modified by the `applyPlaceholderStylesOnNativeSlottedSelectElement()`
+   * @private
+   */
+  private applySelectedOptionStylesOnNativeSlottedSelectElement;
+  /**
+   * This method apply styles when the placeholder is shown.
+   *
+   * We use javascript because we cannot achieve that behaviour in pure css when the native select is not required
+   * @private
+   */
+  private applyPlaceholderStylesOnNativeSlottedSelectElement;
+  private updateHostAttributeWithSlottedSelect;
+  disconnectedCallback(): void;
+  render(): any;
+}

package/dist/types/components/radio/radio.component.d.ts

@@ -4,7 +4,7 @@ import { RadioGroupMode } from '../radio-group/radio-group-interface';
 export declare class Radio implements ComponentInterface {
   private inputId;
   private inputEl;
-  el: HTMLWcsRadioElement;
+  private el;
   mode: RadioGroupMode;
   value: any | any[] | undefined | null;
   label: string;

package/dist/types/components/radio-group/radio-group.d.ts

@@ -5,7 +5,7 @@ export declare class RadioGroup implements ComponentInterface {
   value: any | any[] | undefined | null;
   name: any;
   mode: RadioGroupMode;
-  el: HTMLWcsRadioGroupElement;
+  private el;
   /** Emitted when the value has changed. */
   wcsChange: EventEmitter<RadioGroupChangeEventDetail>;
   onValueChangeHandler(newValue: any): void;