@esri/calcite-components/dist/types/components/flow-item/flow-item.d.ts

Web Components for Esri's Calcite Design System.

import { EventEmitter, VNode } from "../../stencil-public-runtime";
import { InteractiveComponent } from "../../utils/interactive";
import { LoadableComponent } from "../../utils/loadable";
import { LocalizedComponent } from "../../utils/locale";
import { T9nComponent } from "../../utils/t9n";
import { HeadingLevel } from "../functional/Heading";
import { FlowItemMessages } from "./assets/flow-item/t9n";
/**
 * @slot - A slot for adding custom content.
 * @slot action-bar - A slot for adding a `calcite-action-bar` to the component.
 * @slot header-actions-start - A slot for adding `calcite-action`s or content to the start side of the component's header.
 * @slot header-actions-end - A slot for adding `calcite-action`s or content to the end side of the component's header.
 * @slot header-content - A slot for adding custom content to the component's header.
 * @slot header-menu-actions - A slot for adding an overflow menu with `calcite-action`s inside a `calcite-dropdown`.
 * @slot fab - A slot for adding a `calcite-fab` (floating action button) to perform an action.
 * @slot footer-actions - [Deprecated] Use the `"footer"` slot instead. A slot for adding `calcite-button`s to the component's footer.
 * @slot footer - A slot for adding custom content to the component's footer.
 */
export declare class FlowItem implements InteractiveComponent, LoadableComponent, LocalizedComponent, T9nComponent {
  /** When `true`, displays a close button in the trailing side of the component's header. */
  closable: boolean;
  /** When `true`, the component will be hidden. */
  closed: boolean;
  /**
   * When provided, the method will be called before it is removed from its parent `calcite-flow`.
   */
  beforeBack: () => Promise<void>;
  /** A description for the component. */
  description: string;
  /**
   *  When `true`, interaction is prevented and the component is displayed with lower opacity.
   */
  disabled: boolean;
  /**
   * The component header text.
   */
  heading: string;
  /**
   * Specifies the number at which section headings should start.
   */
  headingLevel: HeadingLevel;
  /**
   * When `true`, a busy indicator is displayed.
   */
  loading: boolean;
  /**
   * When `true`, the action menu items in the `header-menu-actions` slot are open.
   */
  menuOpen: boolean;
  /**
   * Use this property to override individual strings used by the component.
   */
  messageOverrides: Partial<FlowItemMessages>;
  onMessagesChange(): void;
  /**
   * Made into a prop for testing purposes only
   *
   * @internal
   */
  messages: FlowItemMessages;
  /**
   * When `true`, displays a back button in the component's header.
   *
   * @internal
   */
  showBackButton: boolean;
  connectedCallback(): void;
  componentWillLoad(): Promise<void>;
  componentDidRender(): void;
  disconnectedCallback(): void;
  componentDidLoad(): void;
  /**
   * Fires when the back button is clicked.
   */
  calciteFlowItemBack: EventEmitter<void>;
  /**
   * Fires when the content is scrolled.
   */
  calciteFlowItemScroll: EventEmitter<void>;
  /**
   * Fires when the close button is clicked.
   */
  calciteFlowItemClose: EventEmitter<void>;
  el: HTMLCalciteFlowItemElement;
  containerEl: HTMLCalcitePanelElement;
  backButtonEl: HTMLCalciteActionElement;
  defaultMessages: FlowItemMessages;
  effectiveLocale: string;
  effectiveLocaleChange(): void;
  /**
   * Sets focus on the component.
   */
  setFocus(): Promise<void>;
  /**
   * Scrolls the component's content to a specified set of coordinates.
   *
   * @example
   * myCalciteFlowItem.scrollContentTo({
   *   left: 0, // Specifies the number of pixels along the X axis to scroll the window or element.
   *   top: 0, // Specifies the number of pixels along the Y axis to scroll the window or element
   *   behavior: "auto" // Specifies whether the scrolling should animate smoothly (smooth), or happen instantly in a single jump (auto, the default value).
   * });
   * @param options
   */
  scrollContentTo(options?: ScrollToOptions): Promise<void>;
  handlePanelScroll: (event: CustomEvent<void>) => void;
  handlePanelClose: (event: CustomEvent<void>) => void;
  backButtonClick: () => void;
  setBackRef: (node: HTMLCalciteActionElement) => void;
  setContainerRef: (node: HTMLCalcitePanelElement) => void;
  renderBackButton(): VNode;
  render(): VNode;
}