@limetech/lime-elements 36.0.0-next.9 → 36.1.0-dev.1

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

@@ -5,32 +5,48 @@ import { DockItem } from '../dock.types';
  */
 export declare class DockButton {
   /**
-   * @inheritdoc
+   * Item that is placed in the dock.
    */
   item: DockItem;
   /**
-   * @inheritdoc
+   * When the dock is expanded or collapsed, dock items
+   * show labels and tooltips as suitable for the layout.
    */
   expanded?: boolean;
   /**
-   * @inheritdoc
+   * When dock is using mobile layout, dock items
+   * show labels and tooltips as suitable for the layout.
    */
   useMobileLayout?: boolean;
   /**
-   * Fired when clicking on the flow item.
+   * Fired when a dock item has been selected from the dock.
+   */
+  itemSelected: EventEmitter<DockItem>;
+  /**
+   * Fired when a dock menu is opened.
+   */
+  menuOpen: EventEmitter<DockItem>;
+  /**
+   * Indicated whether the popover that renders a component is open.
    */
-  private interact;
   private isOpen;
+  /**
+   * Fired when the popover is closed.
+   */
   close: EventEmitter<void>;
   private tooltipId;
+  private customComponentElement;
   constructor();
   render(): any;
+  protected openWatcher(): void;
   private renderPopover;
   private renderButton;
   private openPopover;
+  private setCustomComponentElement;
   private onPopoverClose;
   private handleClick;
   private renderIcon;
   private renderLabel;
   private renderTooltip;
+  private focusCustomComponentElement;
 }

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

@@ -1,3 +1,4 @@
+import { EventEmitter } from '../../stencil-public-runtime';
 import { DockItem } from './dock.types';
 /**
  * @exampleComponent limel-example-dock-basic
@@ -50,9 +51,17 @@ export declare class Dock {
    */
   mobileBreakPoint?: number;
   /**
-   * Fired when a Dock item has been selected from the dock.
+   * Fired when a dock item has been selected from the dock.
    */
-  private itemSelected;
+  itemSelected: EventEmitter<DockItem>;
+  /**
+   * Fired when a dock menu is opened.
+   */
+  menuOpen: EventEmitter<DockItem>;
+  /**
+   * Fired when the popover is closed.
+   */
+  close: EventEmitter<void>;
   /**
    * Fired when a Dock is expanded or collapsed.
    */
@@ -68,7 +77,6 @@ export declare class Dock {
   render(): any;
   private renderSeparator;
   private renderDockItem;
-  private handleDockItemClick;
   private handleResize;
   private renderExpandShrinkToggle;
   private toggleDockWidth;

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

@@ -1,6 +1,7 @@
 import { InputType } from './input-field.types';
 /**
  * @exampleComponent limel-example-input-field-text
+ * @exampleComponent limel-example-input-field-placeholder
  * @exampleComponent limel-example-input-field-text-multiple
  * @exampleComponent limel-example-input-field-number
  * @exampleComponent limel-example-input-field-autocomplete
@@ -39,6 +40,10 @@ export declare class InputField {
    * The input label.
    */
   label: string;
+  /**
+   * The placeholder text shown inside the input field, when the field is focused and empty.
+   */
+  placeholder: string;
   /**
    * Optional helper text to display below the input field when it has focus
    */
@@ -170,6 +175,7 @@ export declare class InputField {
   private renderCharacterCounter;
   private isInvalid;
   private getInputElement;
+  private renderLabel;
   private renderLeadingIcon;
   private renderTrailingLinkOrButton;
   private hasLink;

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

@@ -48,14 +48,13 @@ export declare class Menu {
   private list;
   private portalId;
   constructor();
-  componentDidLoad(): void;
   protected openWatcher(): void;
   render(): any;
   componentDidRender(): void;
   private setTriggerAttributes;
   private onClose;
   private onTriggerClick;
-  private onListChange;
+  private handleSelect;
   private getCssProperties;
   private setListElement;
   private focusMenuItem;

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

@@ -1,5 +1,4 @@
 import { IconSize, MenuItem, ListSeparator, MenuListType } from '@limetech/lime-elements';
-import { EventEmitter } from '../../stencil-public-runtime';
 /**
  * @private
  */
@@ -35,13 +34,9 @@ export declare class MenuList {
   private mdcList;
   private mdcMenu;
   /**
-   * Fired when a new value has been selected from the list. Only fired if selectable is set to true
+   * Fired when a new value has been selected from the list.
    */
-  private change;
-  /**
-   * Fired when an action has been selected from the action menu of a list item
-   */
-  protected select: EventEmitter<MenuItem | MenuItem[]>;
+  private select;
   connectedCallback(): void;
   disconnectedCallback(): void;
   componentDidLoad(): void;

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

@@ -152,14 +152,14 @@ export declare class Picker {
   /**
    * Change handler for the list
    *
-   * @param {CustomEvent} event event
+   * @param {LimelListCustomEvent<ListItem>} event event
    * @returns {void}
    */
   private handleListChange;
   /**
    * Change handler for the list
    *
-   * @param {CustomEvent} event event
+   * @param {LimelChipSetCustomEvent} event event
    * @returns {void}
    */
   private handleActionListChange;

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

@@ -0,0 +1,57 @@
+/**
+ * This component can be used on places such as a start page or a dashboard.
+ * Clicking on the component should navigate the user to a new screen,
+ * to which you need to provide a URL, using the `href` property.
+ *
+ * By default, this navigation will happen within the same browser tab.
+ * However, it is possible to override that behavior, using the `target` property.
+ *
+ * @exampleComponent limel-example-shortcut
+ * @exampleComponent limel-example-shortcut-notification
+ * @exampleComponent limel-example-shortcut-styling
+ * @exampleComponent limel-example-shortcut-with-click-handler
+ */
+export declare class Shortcut {
+  /**
+   * Name of icon for the shortcut.
+   */
+  icon: string;
+  /**
+   * The text to show below the shortcut. Long label will be truncated.
+   */
+  label?: string;
+  /**
+   * The `title` tag of the hyperlink, which can be used to
+   * provide additional information about the link.
+   * It improves accessibility both for sighted users
+   * and users with assistive technologies.
+   */
+  linkTitle?: string;
+  /**
+   * Set to `true` if shortcut is disabled.
+   */
+  disabled?: boolean;
+  /**
+   * The url that the shortcut leads to.
+   */
+  href?: string;
+  /**
+   * Where to load the linked URL, as the name for a browsing context:
+   * - `_self`: in the current browsing context. (Default)
+   * - `_blank`: in a new tab.
+   * - `_parent`: in the parent browsing context of the current one.
+   * If no parent, behaves as `_self`.
+   * - `_top`: the topmost browsing context (the "highest" context
+   * that's an ancestor of the current one). If no ancestors, behaves as `_self`.
+   */
+  target: '_self' | '_blank' | '_parent' | '_top';
+  /**
+   * If specified, will display a notification badge
+   * on the shortcut.
+   */
+  badge?: number | string;
+  render(): any[];
+  private renderLabel;
+  private getAriaLabel;
+  private renderNotification;
+}

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

@@ -0,0 +1,45 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { ListSeparator, MenuItem } from '@limetech/lime-elements';
+/**
+ * A split button is a button with two components:
+ * a button and a side-menu attached to it.
+ *
+ * Clicking on the button runs a default action,
+ * and clicking on the arrow opens up a list of other possible actions.
+ *
+ * :::warning
+ * - Never use a split button for navigation purposes, such as going to next page.
+ * The button should only be used for performing commands!
+ * - Never use this component instead of a Select or Menu component!
+ * :::
+ *
+ * @exampleComponent limel-example-split-button-basic
+ * @exampleComponent limel-example-split-button-repeat-default-command
+ */
+export declare class SplitButton {
+  /**
+   * The text to show on the default action part of the button.
+   */
+  label: string;
+  /**
+   * Set to `true` to make the button primary.
+   */
+  primary: boolean;
+  /**
+   * Set icon for the button
+   */
+  icon: string;
+  /**
+   * Set to `true` to disable the button.
+   */
+  disabled: boolean;
+  /**
+   * A list of items and separators to show in the menu.
+   */
+  items: Array<MenuItem | ListSeparator>;
+  /**
+   * Is emitted when a menu item is selected.
+   */
+  select: EventEmitter<MenuItem>;
+  render(): any;
+}

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

@@ -22,5 +22,5 @@ export interface Tab {
   /**
    * Shows a badge within the tab with a specified label
    */
-  badge?: number;
+  badge?: number | string;
 }

package/dist/types/components/table/layout.d.ts

@@ -0,0 +1,2 @@
+export declare type Layout = 'default' | 'stretchLastColumn' | 'stretchColumns' | 'lowDensity';
+export declare function mapLayout(layout: Layout): any;

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

@@ -1,16 +1,22 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { Column, TableParams, ColumnSorter, ColumnAggregate } from './table.types';
+import { Layout } from './layout';
 /**
  * @exampleComponent limel-example-table
  * @exampleComponent limel-example-table-custom-components
  * @exampleComponent limel-example-table-header-menu
  * @exampleComponent limel-example-table-movable-columns
+ * @exampleComponent limel-example-table-sorting-disabled
  * @exampleComponent limel-example-table-local
  * @exampleComponent limel-example-table-remote
  * @exampleComponent limel-example-table-activate-row
  * @exampleComponent limel-example-table-selectable-rows
  * @exampleComponent limel-example-table-default-sorted
- * @exampleComponent limel-example-table-low-density
+ * @exampleComponent limel-example-table-layout-default
+ * @exampleComponent limel-example-table-layout-stretch-last-column
+ * @exampleComponent limel-example-table-layout-stretch-columns
+ * @exampleComponent limel-example-table-layout-low-density
+ * @exampleComponent limel-example-table-interactive-rows
  */
 export declare class Table {
   /**
@@ -28,6 +34,15 @@ export declare class Table {
    * is responsible to give the table new data when a `load` event occurs
    */
   mode: 'local' | 'remote';
+  /**
+   * Defines the layout of the table, based on how width of the columns are calculated.
+   *
+   * - `default`: makes columns as wide as their contents.
+   * - `stretchLastColumn`: makes columns as wide as their contents, stretch the last column to fill up the remaining table width.
+   * - `stretchColumns`: stretches all columns to fill the available width when possible.
+   * - `lowDensity`: makes columns as wide as their contents, and creates a low density and airy layout.
+   */
+  layout: Layout;
   /**
    * Number of rows per page
    */

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

@@ -27,6 +27,10 @@ export interface Column<T extends object = any> {
    * Sets the horizontal text alignment for the column
    */
   horizontalAlign?: 'left' | 'center' | 'right';
+  /**
+   * Defines whether end-user can sort a column
+   */
+  headerSort?: boolean;
 }
 export declare type TableFormatter = (value: any, data?: object) => string;
 /**