@siemens/ix 1.1.0-beta.2 → 1.1.0-beta.4

package/dist/types/components/map-navigation/map-navigation.d.ts

@@ -0,0 +1,51 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class MapNavigation {
+  private static readonly defaultTime;
+  private static readonly slowTime;
+  hostElement: HTMLIxMapNavigationElement;
+  /**
+   * Application name
+   */
+  applicationName: string;
+  /**
+   * Navigation title
+   */
+  navigationTitle: string;
+  /**
+   * Hide the sidebar context menu button when set to true
+   */
+  hideContextMenu: boolean;
+  isSidebarOpen: boolean;
+  /**
+   * Navigation toggled
+   */
+  navigationToggled: EventEmitter<boolean>;
+  /**
+   * Context menu clicked
+   */
+  contextMenuClick: EventEmitter<void>;
+  get menu(): HTMLIxMenuElement;
+  get menuOverlay(): Element;
+  get mapNavMenu(): Element;
+  get sidebar(): Element;
+  get overlay(): Element;
+  componentDidRender(): void;
+  private appendMenu;
+  private toggleSidebar;
+  private closeSidebar;
+  private openSidebar;
+  /**
+   * Open a overlay inside content area
+   *
+   * @param name
+   * @param component
+   * @param icon
+   * @param color
+   */
+  openOverlay(name: string, component: HTMLElement, icon?: string, color?: string): Promise<void>;
+  /**
+   * Close current shown overlay
+   */
+  closeOverlay(): Promise<void>;
+  render(): any;
+}

package/dist/types/components/map-navigation-overlay/map-navigation-overlay.d.ts

@@ -0,0 +1,20 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class MapNavigationOverlay {
+  /**
+   * Title of overlay
+   */
+  name: string;
+  /**
+   * Icon of overlay
+   */
+  icon: string;
+  /**
+   * Color of icon
+   */
+  color: string;
+  /**
+   * Event closed
+   */
+  closeClick: EventEmitter;
+  render(): any;
+}

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

@@ -0,0 +1,145 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class Menu {
+  hostElement: HTMLIxMenuElement;
+  /**
+   * Is settings tab visible
+   */
+  showSettings: boolean;
+  /**
+   * Is about tab visible
+   */
+  showAbout: boolean;
+  /**
+   * Show toggle between light and dark variant. Only if the provided theme have implemented both!
+   */
+  enableToggleTheme: boolean;
+  /**
+   * Is settings tab is visible
+   */
+  enableSettings: boolean;
+  /**
+   * Internal
+   */
+  enableMapExpand: boolean;
+  /**
+   * Should only be set if you use ix-menu standalone
+   */
+  applicationName: string;
+  /**
+   * Should only be set if you use ix-menu standalone
+   */
+  applicationDescription: string;
+  /**
+   * Maximum number of menu items to show in case enough vertical space is available.
+   * Extra menu items will be collapsed to 'show more' menu item.
+   */
+  maxVisibleMenuItems: number;
+  /**
+   */
+  i18nLegal: string;
+  /**
+   */
+  i18nSettings: string;
+  /**
+   */
+  i18nToggleTheme: string;
+  /**
+   */
+  i18nExpand: string;
+  /**
+   */
+  i18nCollapse: string;
+  /**
+   */
+  i18nMore: string;
+  /**
+   * Expand menu
+   */
+  expand: boolean;
+  /**
+   * Menu expanded
+   */
+  expandChange: EventEmitter<boolean>;
+  /**
+   * Map Sidebar expanded
+   */
+  mapExpandChange: EventEmitter<boolean>;
+  showMoreItems: boolean;
+  visibleMenuItems: number;
+  countMoreNotifications: number;
+  mapExpand: boolean;
+  activeTab: HTMLIxMenuItemElement;
+  isMoreTabEmpty: boolean;
+  private readonly domObserver;
+  onWindowResize(): void;
+  private handleNodeMutation;
+  private onDomChange;
+  private readonly isVisible;
+  get popoverArea(): Element;
+  get overlayContainer(): Element;
+  get invisibleContainer(): Element;
+  get menu(): Element;
+  get menuItems(): Element[];
+  get menuBottomItems(): Element[];
+  get homeTab(): Element;
+  get moreItemsDropdown(): HTMLElement;
+  get isMoreItemsDropdownEmpty(): boolean;
+  get moreItemsDropdownItems(): NodeListOf<Element>;
+  get activeMoreTabContainer(): Element;
+  get activeMoreTab(): Element;
+  get aboutPopoverContainer(): HTMLElement;
+  get aboutPopover(): HTMLIxMenuAboutNewsElement;
+  get aboutTab(): HTMLElement;
+  get about(): HTMLIxMenuAboutElement;
+  get settings(): HTMLIxMenuSettingsElement;
+  get isSettingsEmpty(): boolean;
+  get avatarItem(): HTMLIxMenuAvatarElement;
+  get tabsContainer(): HTMLDivElement;
+  private popoverListener;
+  private showTab;
+  componentDidLoad(): void;
+  disconnectedCallback(): void;
+  componentWillRender(): void;
+  componentDidRender(): void;
+  private appendFragments;
+  private resetActiveTab;
+  private isMenuItemActive;
+  private appendTabs;
+  private appendAvatar;
+  private getAboutPopoverVerticalPosition;
+  private appendAboutNewsPopover;
+  private appendSettings;
+  private appendAbout;
+  private getMoreNotificationsCount;
+  private getAvailableHeight;
+  private getMaxTabCount;
+  private toggleShowMoreDropdown;
+  /**
+   * Toggle map sidebar expand
+   * @param show
+   */
+  toggleMapExpand(show?: boolean): Promise<void>;
+  private skipAllOverlayAnimations;
+  private skipOverlayAnimationFor;
+  /**
+   * Toggle menu
+   * @param show
+   */
+  toggleMenu(show?: boolean): Promise<void>;
+  /**
+   * Toggle Settings tabs
+   * @param show
+   */
+  toggleSettings(show: boolean): Promise<void>;
+  /**
+   * Toggle About tabs
+   * @param show
+   */
+  toggleAbout(show: boolean): Promise<void>;
+  private resetOverlay;
+  private showMoreButton;
+  private getCollapseText;
+  private getCollapseIcon;
+  private isMenuItemClicked;
+  render(): any;
+}

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

@@ -0,0 +1,31 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class MenuAbout {
+  /**
+   * Active tab
+   */
+  activeTabLabel: string;
+  /**
+   * Label of first tab
+   */
+  label: string;
+  /**
+   * Internal
+   */
+  show: boolean;
+  el: HTMLIxMenuAboutElement;
+  /**
+   * About and Legal closed
+   */
+  close: EventEmitter<MouseEvent>;
+  labels: string[];
+  get aboutItems(): HTMLIxMenuAboutItemElement[];
+  private setTab;
+  componentWillLoad(): void;
+  componentDidLoad(): void;
+  componentWillRender(): void;
+  private updateLabels;
+  watchActiveTabLabel(value: string): void;
+  private getSelectedTabIndex;
+  private getTabItems;
+  render(): any;
+}

package/dist/types/components/menu-about-item/menu-about-item.d.ts

@@ -0,0 +1,7 @@
+export declare class MenuAboutItem {
+  /**
+   * About Item label
+   */
+  label: string;
+  render(): any;
+}

package/dist/types/components/menu-about-news/menu-about-news.d.ts

@@ -0,0 +1,36 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class MenuAboutNews {
+  /**
+   * Show about news
+   */
+  show: boolean;
+  /**
+   * Title of the about news
+   */
+  label: string;
+  /**
+   *
+   */
+  i18nShowMore: string;
+  /**
+   * Subtitle of the about news
+   */
+  aboutItemLabel: string;
+  /**
+   * Bottom offset
+   */
+  offsetBottom: number;
+  /**
+   * Show More button is pressed
+   */
+  showMore: EventEmitter<MouseEvent>;
+  /**
+   * Popover closed
+   */
+  closePopover: EventEmitter<void>;
+  /**
+   * Internal
+   */
+  expanded: boolean;
+  render(): any;
+}

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

@@ -0,0 +1,26 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class MenuAvatar {
+  hostElement: HTMLIxMenuAvatarElement;
+  displayMenu: boolean;
+  /**
+   * First line of text
+   */
+  top: string;
+  /**
+   * Second line of text
+   */
+  bottom: string;
+  /**
+   *
+   */
+  i18nLogout: string;
+  /**
+   * Logout click
+   */
+  logoutClick: EventEmitter;
+  private outsideListener;
+  toggleMenu(): void;
+  componentDidLoad(): void;
+  disconnectedCallback(): void;
+  render(): any;
+}

package/dist/types/components/menu-avatar-item/menu-avatar-item.d.ts

@@ -0,0 +1,17 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class MenuAvatarItem {
+  /**
+   * Avatar dropdown icon
+   */
+  icon: string;
+  /**
+   * Avatar dropdown label
+   */
+  label: string;
+  /**
+   * Avatar dropdown item clicked
+   */
+  itemClick: EventEmitter<MouseEvent>;
+  hostElement: HTMLIxMenuAvatarItemElement;
+  render(): any;
+}

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

@@ -0,0 +1,31 @@
+export declare class MenuItem {
+  /**
+   * Move the Tab to a top position.
+   */
+  home: boolean;
+  /**
+   * Place tab on bottom
+   */
+  bottom: boolean;
+  /**
+   * Icon name from @siemens/ix-icons
+   */
+  tabIcon: string;
+  /**
+   * Show notification cound on tab
+   */
+  notifications: number;
+  /**
+   * State to display active
+   */
+  active: boolean;
+  /**
+   * Disable tab and remove event handlers
+   */
+  disabled: boolean;
+  hostElement: HTMLIxMenuItemElement;
+  title: string;
+  get tabLabel(): Element;
+  componentDidRender(): void;
+  render(): any;
+}

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

@@ -0,0 +1,27 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class MenuAbout {
+  /**
+   * active tab
+   */
+  activeTabLabel: string;
+  /**
+   * Label
+   */
+  label: string;
+  /**
+   * Internal
+   */
+  show: boolean;
+  el: HTMLIxMenuSettingsElement;
+  /**
+   * Popover closed
+   */
+  close: EventEmitter<MouseEvent>;
+  get settingsItems(): HTMLIxMenuSettingsItemElement[];
+  private setTab;
+  componentWillLoad(): void;
+  componentDidLoad(): void;
+  watchActiveTabLabel(value: string): void;
+  private getTabItems;
+  render(): any;
+}

package/dist/types/components/menu-settings-item/menu-settings-item.d.ts

@@ -0,0 +1,7 @@
+export declare class MenuSettingsItem {
+  /**
+   * Label
+   */
+  label: string;
+  render(): any;
+}

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

@@ -0,0 +1,23 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { NotificationColor } from '../utils/notification-color';
+export declare class MessageBar {
+  /**
+   * Specifies the type of the alert.
+   */
+  type: 'danger' | 'warning' | 'info';
+  /**
+   * If true, close button is enabled and alert can be dismissed by the user
+   */
+  dismissible: boolean;
+  /**
+   * An event emitted when the close button is clicked
+   */
+  closedChange: EventEmitter;
+  icon: 'error' | 'warning' | 'info';
+  color: NotificationColor;
+  private static readonly duration;
+  private divElement?;
+  componentWillRender(): void;
+  private closeAlert;
+  render(): any;
+}

package/dist/types/components/modal/modal-utils.d.ts

@@ -0,0 +1,26 @@
+import { NotificationColor } from '../utils/notification-color';
+export interface ModalConfig {
+  animation?: boolean;
+  ariaDescribedBy?: string;
+  ariaLabelledBy?: string;
+  backdrop?: boolean | 'static';
+  backdropClass?: string;
+  beforeDismiss?: (reason?: any) => boolean | Promise<boolean>;
+  centered?: boolean;
+  container?: string | HTMLElement;
+  content: string | HTMLElement;
+  keyboard?: boolean;
+  modalDialogClass?: string;
+  scrollable?: boolean;
+  size?: 'sm' | 'lg' | 'xl';
+  title: string;
+  windowClass?: string;
+  icon?: string;
+  iconColor?: NotificationColor;
+}
+export declare function modal(config: ModalConfig): Promise<{
+  onClose: import("../utils/typed-event").TypedEvent<any>;
+  onDismiss: import("../utils/typed-event").TypedEvent<any>;
+}>;
+export declare function closeModal(element: Element, closeResult: any): void;
+export declare function dismissModal(element: Element, dismissResult?: any): void;

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

@@ -0,0 +1,99 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { NotificationColor } from '../utils/notification-color';
+export declare class Modal {
+  hostElement: HTMLIxModalElement;
+  /**
+   * Should the modal be animtated
+   */
+  animation: boolean;
+  /**
+   *
+   */
+  ariaDescribedBy: string;
+  /**
+   *
+   */
+  ariaLabelledBy: string;
+  /**
+   * Adds a dimming layer to the modal.
+   * This should only be used when it it necessary to focus the user's attention to the dialog content (e.g. errors, warnings, complex tasks).
+   */
+  backdrop: boolean | 'static';
+  /**
+   * Backdrop class
+   */
+  backdropClass: string;
+  /**
+   * BeforeDismiss callback
+   */
+  beforeDismiss: (reason?: any) => boolean | Promise<boolean>;
+  /**
+   * Centered modal
+   */
+  centered: boolean;
+  /**
+   * Content of modal
+   */
+  content: HTMLElement | string;
+  /**
+   * ESC close modal dialog
+   */
+  keyboard: boolean;
+  /**
+   * Optional icon displayed next to the title
+   */
+  icon: string;
+  /**
+   * Color of the header {@link icon}
+   */
+  iconColor: NotificationColor;
+  /**
+   * Modal dialog class
+   */
+  modalDialogClass: string;
+  /**
+   * Modal scollable
+   */
+  scrollable: boolean;
+  /**
+   * Modal size
+   */
+  size: 'sm' | 'lg' | 'xl';
+  /**
+   * Header title
+   */
+  headerTitle: string;
+  /**
+   * Window class
+   */
+  windowClass: string;
+  /**
+   * Modal closed
+   */
+  closed: EventEmitter;
+  /**
+   * Modal dismissed
+   */
+  dismissed: EventEmitter;
+  private readonly onKeydown;
+  get modal(): Element;
+  get modalDialog(): Element;
+  get modalContent(): Element;
+  get modalBackdrop(): Element;
+  private slideDown;
+  private slideUp;
+  componentDidLoad(): void;
+  private handleKeydown;
+  disconnectedCallback(): void;
+  /**
+   * Dismiss modal instance
+   * @param reason
+   */
+  dismiss(reason?: any): Promise<void>;
+  /**
+   * Close modal
+   * @param result
+   */
+  close(result: any): Promise<void>;
+  render(): any;
+}

package/dist/types/components/modal-container/modal-container.d.ts

@@ -0,0 +1,15 @@
+import { ModalConfig } from '../modal/modal-utils';
+import { TypedEvent } from '../utils/typed-event';
+export declare class ModalContainer {
+  hostElement: HTMLIxModalContainerElement;
+  /**
+   * Display modal dialog
+   *
+   * @param config
+   */
+  showModal(config: ModalConfig): Promise<{
+    onClose: TypedEvent<any>;
+    onDismiss: TypedEvent<any>;
+  }>;
+  render(): any;
+}

package/dist/types/components/my-component/example-modal.d.ts

@@ -0,0 +1,6 @@
+export declare class ModalExample {
+  host: HTMLIxModalExampleElement;
+  private dismiss;
+  private close;
+  render(): any;
+}

package/dist/types/components/my-component/my-component.d.ts

@@ -0,0 +1,3 @@
+export declare class MyComponent {
+  render(): any;
+}

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

@@ -0,0 +1,28 @@
+export declare class Pill {
+  el: HTMLIxPillElement;
+  /**
+   * Pill variant
+   */
+  variant: 'primary' | 'alarm' | 'critical' | 'warning' | 'info' | 'neutral' | 'success' | 'custom';
+  /**
+   * Show pill as outline
+   */
+  outline: boolean;
+  /**
+   * Show icon
+   */
+  icon: string | undefined;
+  /**
+   * Custom color for pill. Only working for `variant='custom'`
+   */
+  background: string | undefined;
+  /**
+   * Custom font color for pill. Only working for `variant='custom'`
+   */
+  color: string | undefined;
+  /**
+   * Align pill content left
+   */
+  alignLeft: boolean;
+  render(): any;
+}

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

@@ -0,0 +1,83 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class Select {
+  hostElement: HTMLIxSelectElement;
+  /**
+   * Indices of selected items
+   */
+  selectedIndices: string | string[];
+  /**
+   * Show clear button
+   */
+  allowClear: boolean;
+  /**
+   * Selection mode
+   */
+  mode: 'single' | 'multiple';
+  /**
+   * Select is extendable
+   */
+  editable: boolean;
+  /**
+   * If true the select will be in disabled state
+   */
+  disabled: boolean;
+  /**
+   * If true the select will be in readonly mode
+   */
+  readonly: boolean;
+  /**
+   * Input field placeholder
+   */
+  i18nPlaceholder: string;
+  /**
+   * Input field placeholder for editable select
+   */
+  i18nPlaceholderEditable: string;
+  /**
+   * Select list header
+   */
+  i18nSelectListHeader: string;
+  /**
+   * Item selection changed
+   */
+  itemSelectionChange: EventEmitter<string | string[]>;
+  /**
+   * Item added to selection
+   */
+  addItem: EventEmitter<string>;
+  dropdownShow: boolean;
+  value: string[];
+  dropdownWrapperRef: HTMLElement;
+  dropdownAnchor: HTMLElement;
+  private inputRef;
+  private dropdownRef;
+  private addItemRef;
+  isDropdownEmpty: boolean;
+  hasFocus: boolean;
+  navigationItem: HTMLIxSelectItemElement;
+  inputText: string;
+  get items(): HTMLIxSelectItemElement[];
+  get selectedItems(): HTMLIxSelectItemElement[];
+  get addItemButton(): Element;
+  get isSingleMode(): boolean;
+  get isMultipleMode(): boolean;
+  watchSelectedIndices(newId: string | string[]): void;
+  onItemClicked(event: CustomEvent<string>): void;
+  watchInputText(newValue: string): void;
+  private emitItemClick;
+  private emitAddItem;
+  private selectValue;
+  componentWillLoad(): void;
+  private itemExists;
+  private dropdownVisibilityChanged;
+  onKeyDown(event: KeyboardEvent): Promise<void>;
+  private onEnterNavigation;
+  private onArrowNavigation;
+  private setHoverEffectForNavigatedSelectItem;
+  private filterItemsWithTypeahead;
+  private removeHiddenFromItems;
+  private clearInput;
+  private clear;
+  private getInputValue;
+  render(): any;
+}