@siemens/ix 1.4.0-beta.0 → 1.4.0-beta.2

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

@@ -1,4 +1,4 @@
-import { Buttons } from '../utils/button-variants';
+import { Buttons } from './button-variants';
 export declare class Button {
   /**
    * Button varaint

package/dist/types/components/date-picker/date-picker.d.ts

@@ -84,7 +84,7 @@ export declare class DatePicker {
    * If datepicker is in range mode the event detail will be sperated with a `-` e.g.
    * `2022/10/22 - 2022/10/24` (start and end). If range mode is choosen consider to use `dateRangeChange`.
    *
-   * @depracted String output will be removed. Set ´doneEventDelimiter´ to undefined or null to get date change object instead of a string
+   * @deprecated String output will be removed. Set ´doneEventDelimiter´ to undefined or null to get date change object instead of a string
    */
   dateChange: EventEmitter<LegacyDateChangeEvent>;
   /**

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

@@ -0,0 +1,6 @@
+/**
+ * @since 1.4.0
+ */
+export declare class Divider {
+  render(): any;
+}

package/dist/types/components/dropdown/dropdown-trigger-event.d.ts

@@ -0,0 +1,4 @@
+/**
+ * @internal
+ */
+export declare type DropdownTriggerEvent = 'click' | 'hover' | 'focus';

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

@@ -1,4 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
+import { DropdownTriggerEvent } from './dropdown-trigger-event';
 import { Placement } from './placement';
 export declare class Dropdown {
   hostElement: HTMLIxDropdownElement;
@@ -8,7 +9,7 @@ export declare class Dropdown {
   show: boolean;
   /**
    * Define an element that triggers the dropdown.
-   * A trigger can either be a string that will be interprated as id attribute or a DOM element.
+   * A trigger can either be a string that will be interpreted as id attribute or a DOM element.
    */
   trigger: string | HTMLElement;
   /**
@@ -52,6 +53,18 @@ export declare class Dropdown {
     crossAxis?: number;
     alignmentAxis?: number;
   };
+  /**
+   * Define one or more events to open dropdown
+   * @internal
+   */
+  triggerEvent: DropdownTriggerEvent | DropdownTriggerEvent[];
+  /**
+   * @internal
+   */
+  overwriteDropdownStyle: (delegate: {
+    dropdownRef: HTMLElement;
+    triggerRef?: HTMLElement;
+  }) => Promise<Partial<CSSStyleDeclaration>>;
   /**
    * Fire event after visibility of dropdown has changed
    */
@@ -60,15 +73,19 @@ export declare class Dropdown {
   private triggerElement?;
   private anchorElement?;
   private dropdownRef;
+  private toggleBind;
   private openBind;
   constructor();
   get dropdownItems(): HTMLIxDropdownItemElement[];
+  private addEventListenersFor;
+  private removeEventListenersFor;
   private registerListener;
   private unregisterListener;
   private resolveElement;
   changedShow(newShow: boolean): Promise<void>;
   changedTrigger(newTriggerValue: string | HTMLElement, oldTriggerValue: string | HTMLElement): void;
   clickOutside(event: Event): void;
+  private toggle;
   private open;
   private close;
   private applyDropdownPosition;

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

@@ -1,4 +1,4 @@
-import { Buttons } from '../utils/button-variants';
+import { Buttons } from '../button/button-variants';
 /**
  * @since 1.3.0
  */

package/dist/types/components/dropdown-quick-actions/dropdown-quick-actions.d.ts

@@ -0,0 +1,6 @@
+/**
+ * @since 1.4.0
+ */
+export declare class DropdownQuickActions {
+  render(): any;
+}

package/dist/types/components/group/group-context-menu.d.ts

@@ -1,11 +1,9 @@
 export declare class GroupContextMenu {
   host: HTMLIxGroupContextMenuElement;
   showContextMenu: boolean;
-  private observer;
   get dropdownElement(): HTMLIxDropdownElement;
   get groupDropdownItem(): NodeListOf<HTMLIxGroupDropdownItemElement>;
   private configureDropdown;
   componentWillRender(): void;
-  disconnectedCallback(): void;
   render(): any;
 }

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

@@ -0,0 +1,10 @@
+/**
+ * @internal
+ */
+export declare class BurgerMenu {
+  /**
+   * Is menu displayed as expanded
+   */
+  expanded: boolean;
+  render(): any;
+}

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

@@ -1,4 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
+import { Mode } from '../utils/screen/mode';
 export declare class Menu {
   hostElement: HTMLIxMenuElement;
   /**
@@ -70,6 +71,7 @@ export declare class Menu {
   mapExpand: boolean;
   activeTab: HTMLIxMenuItemElement;
   isMoreTabEmpty: boolean;
+  mode: Mode;
   private readonly domObserver;
   onWindowResize(): void;
   private handleNodeMutation;
@@ -97,7 +99,7 @@ export declare class Menu {
   get tabsContainer(): HTMLDivElement;
   private showTab;
   componentDidLoad(): void;
-  disconnectedCallback(): void;
+  componentWillLoad(): void;
   componentWillRender(): void;
   componentDidRender(): void;
   private appendFragments;

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

@@ -10,7 +10,19 @@ export declare class MenuAvatar {
    */
   bottom: string;
   /**
+   * Display a avatar image
    *
+   * @since 1.4.0
+   */
+  image: string;
+  /**
+   * Display the initials of the user. Will be overwritten by image
+   *
+   * @since 1.4.0
+   */
+  initials: string;
+  /**
+   * Use for translation
    */
   i18nLogout: string;
   /**

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

@@ -1,6 +1,6 @@
 import { EventEmitter } from '../../stencil-public-runtime';
+import { Buttons } from '../button/button-variants';
 import { Placement } from '../dropdown/placement';
-import { Buttons } from '../utils/button-variants';
 export declare class SplitButton {
   hostElement: HTMLIxSplitButtonElement;
   /**

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

@@ -23,6 +23,8 @@ export declare class Tabs {
   totalItems: number;
   currentScrollAmount: number;
   scrollAmount: number;
+  styleNextArrow: {};
+  stylePreviousArrow: {};
   scrollActionAmount: number;
   private clickAction;
   onWindowResize(): number;
@@ -41,6 +43,7 @@ export declare class Tabs {
   private dragMove;
   private dragStop;
   componentDidRender(): void;
+  componentWillRender(): void;
   componentDidLoad(): void;
   render(): any;
 }

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

@@ -0,0 +1,39 @@
+/**
+ * @slot title-icon - Icon of tooltip title
+ * @slot title-content - Content of tooltip title
+ *
+ * @since 1.4.0
+ */
+export declare class Tooltip {
+  /**
+   * CSS selector for hover trigger element e.g. `for="[data-my-custom-select]"`
+   */
+  for: string;
+  /**
+   * Title of the tooltip
+   */
+  titleContent: string;
+  /**
+   * Define if the user can access the tooltip via mouse.
+   */
+  interactive: boolean;
+  visible: boolean;
+  hostElement: HTMLIxTooltipElement;
+  private observer;
+  private hideTooltipTimeout;
+  private onMouseEnterBind;
+  private onMouseLeaveBind;
+  private disposeAutoUpdate?;
+  private tooltipCloseTimeInMS;
+  private get arrowElement();
+  private destroyAutoUpdate;
+  private showTooltip;
+  private hideTooltip;
+  private computeTooltipPosition;
+  private queryAnchorElements;
+  private registerTriggerListener;
+  private registerTooltipListener;
+  componentDidLoad(): void;
+  disconnectedCallback(): void;
+  render(): any;
+}

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

@@ -0,0 +1,2 @@
+export declare type TypographyVariants = 'x-small' | 'small' | 'caption' | 'caption-single' | 'default' | 'default-single' | 'default-title' | 'default-title-single' | 'large' | 'large-single' | 'h2' | 'display-large';
+export declare const VariantsMapping: Record<TypographyVariants, string>;

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

@@ -0,0 +1,11 @@
+import { TypographyVariants } from './types';
+/**
+ * @internal
+ */
+export declare class IxTypography {
+  /**
+   * Font variant
+   */
+  variant: TypographyVariants;
+  render(): any;
+}

package/dist/types/components/utils/menu-service/menu-service.d.ts

@@ -0,0 +1,13 @@
+import { TypedEvent } from '../typed-event';
+declare class MenuService {
+  menuElement: HTMLIxMenuElement | null;
+  menuExpandChange: TypedEvent<boolean>;
+  register(menuElement: HTMLIxMenuElement): void;
+  open(): Promise<boolean>;
+  close(): Promise<boolean>;
+  toggle(): Promise<boolean>;
+  get nativeElement(): HTMLIxMenuElement;
+  get expandChange(): TypedEvent<boolean>;
+}
+export declare const menuController: MenuService;
+export {};

package/dist/types/components/utils/screen/context.d.ts

@@ -0,0 +1,4 @@
+export declare function isBasicNavigationLayout(element: HTMLElement): element is HTMLIxBasicNavigationElement;
+export declare const hostContext: (selector: string, element: HTMLElement) => HTMLIxBasicNavigationElement | HTMLIxMapNavigationElement;
+export declare const isHostedBy: (selector: string, element: HTMLElement) => boolean;
+export declare const getHostApplicationLayout: (element: HTMLElement) => HTMLIxBasicNavigationElement | HTMLIxMapNavigationElement;

package/dist/types/components/utils/screen/index.d.ts

@@ -0,0 +1 @@
+export { screenMode } from './service';

package/dist/types/components/utils/screen/mode.d.ts

@@ -0,0 +1,10 @@
+export declare type Mode = 'desktop' | 'mobile';
+export declare type MediaQueryListener = {
+  matchMedia: MediaQueryList;
+  dispose: () => void;
+};
+export declare const createMediaQueryListener: (query: string, callback: (event: MediaQueryListEvent) => void) => MediaQueryListener;
+export declare const createModeListener: (modeChangeCallback: (mode: Mode) => void) => {
+  dispose: () => void;
+  matchMedia: MediaQueryList;
+};

package/dist/types/components/utils/screen/service.d.ts

@@ -0,0 +1,10 @@
+import { TypedEvent } from '../typed-event';
+import { Mode } from './mode';
+declare class ScreenMode {
+  #private;
+  constructor();
+  get mode(): Mode;
+  get onChange(): TypedEvent<Mode>;
+}
+export declare const screenMode: ScreenMode;
+export {};