@esri/calcite-components/dist/types/components/input-time-picker/input-time-picker.d.ts

Web Components for Esri's Calcite Design System.

import { EventEmitter, VNode } from "../../stencil-public-runtime";
import { FloatingUIComponent, LogicalPlacement, OverlayPositioning } from "../../utils/floating-ui";
import { FormComponent } from "../../utils/form";
import { InteractiveComponent } from "../../utils/interactive";
import { LabelableComponent } from "../../utils/label";
import { LoadableComponent } from "../../utils/loadable";
import { LocalizedComponent, NumberingSystem, SupportedLocales } from "../../utils/locale";
import { FocusTrapComponent } from "../../utils/focusTrapComponent";
import { FocusTrap } from "focus-trap";
import { Scale } from "../interfaces";
import { TimePickerMessages } from "../time-picker/assets/time-picker/t9n";
import { T9nComponent } from "../../utils/t9n";
import { InputTimePickerMessages } from "./assets/input-time-picker/t9n";
export declare class InputTimePicker implements FloatingUIComponent, FocusTrapComponent, FormComponent, InteractiveComponent, LabelableComponent, LoadableComponent, LocalizedComponent, T9nComponent {
  el: HTMLCalciteInputTimePickerElement;
  /** When `true`, displays the `calcite-time-picker` component. */
  open: boolean;
  openHandler(value: boolean): void;
  /** When `true`, interaction is prevented and the component is displayed with lower opacity. */
  disabled: boolean;
  /**
   * When `true`, prevents focus trapping.
   */
  focusTrapDisabled: boolean;
  handleFocusTrapDisabled(focusTrapDisabled: boolean): void;
  /**
   * The ID of the form that will be associated with the component.
   *
   * When not set, the component will be associated with its ancestor form element, if any.
   */
  form: string;
  /**
   * When `true`, the component's value can be read, but controls are not accessible and the value cannot be modified.
   *
   * @mdn [readOnly](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly)
   */
  readOnly: boolean;
  handleDisabledAndReadOnlyChange(value: boolean): void;
  /**
   * Use this property to override individual strings used by the component.
   */
  messageOverrides: Partial<InputTimePickerMessages & TimePickerMessages>;
  /**
   * Made into a prop for testing purposes only
   *
   * @internal
   */
  messages: InputTimePickerMessages;
  onMessagesChange(): void;
  /** Specifies the name of the component on form submission. */
  name: string;
  /**
   * Specifies the Unicode numeral system used by the component for localization.
   */
  numberingSystem: NumberingSystem;
  numberingSystemWatcher(numberingSystem: NumberingSystem): void;
  /**
   * When `true`, the component must have a value in order for the form to submit.
   *
   * @internal
   */
  required: boolean;
  /** Specifies the size of the component. */
  scale: Scale;
  /**
   * Determines the type of positioning to use for the overlaid content.
   *
   * Using `"absolute"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.
   *
   * `"fixed"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `"fixed"`.
   *
   */
  overlayPositioning: OverlayPositioning;
  /**
   * Determines where the popover will be positioned relative to the input.
   */
  placement: LogicalPlacement;
  /** Specifies the granularity the component's `value` must adhere to (in seconds). */
  step: number;
  stepWatcher(newStep: number, oldStep: number): void;
  /** The time value in ISO (24-hour) format. */
  value: string;
  valueWatcher(newValue: string): void;
  defaultValue: InputTimePicker["value"];
  formEl: HTMLFormElement;
  labelEl: HTMLCalciteLabelElement;
  popoverEl: HTMLCalcitePopoverElement;
  private calciteInputEl;
  private calciteTimePickerEl;
  private focusOnOpen;
  focusTrap: FocusTrap;
  private dialogId;
  /** whether the value of the input was changed as a result of user typing or not */
  private userChangedValue;
  private referenceElementId;
  defaultMessages: InputTimePickerMessages;
  effectiveLocale: string;
  effectiveLocaleWatcher(locale: SupportedLocales): Promise<void>;
  /**
   * Fires when the time value is changed as a result of user input.
   */
  calciteInputTimePickerChange: EventEmitter<void>;
  private hostBlurHandler;
  private calciteInternalInputFocusHandler;
  private calciteInternalInputInputHandler;
  private timePickerChangeHandler;
  /** Sets focus on the component. */
  setFocus(): Promise<void>;
  /**
   * Updates the position of the component.
   *
   * @param delayed
   */
  reposition(delayed?: boolean): Promise<void>;
  private delocalizeTimeString;
  private popoverCloseHandler;
  private popoverOpenHandler;
  keyDownHandler: (event: KeyboardEvent) => void;
  private loadDateTimeLocaleData;
  private getExtendedLocaleConfig;
  onLabelClick(): void;
  private shouldIncludeSeconds;
  private setCalcitePopoverEl;
  private setCalciteInputEl;
  private setCalciteTimePickerEl;
  private setInputValue;
  /**
   * Sets the value and emits a change event.
   * This is used to update the value as a result of user interaction.
   *
   * @param value
   */
  private setValue;
  /**
   * Sets the value directly without emitting a change event.
   * This is used to update the value on initial load and when props change that are not the result of user interaction.
   *
   * @param value
   */
  private setValueDirectly;
  private onInputWrapperClick;
  deactivate: () => void;
  connectedCallback(): void;
  componentWillLoad(): Promise<void>;
  componentDidLoad(): void;
  disconnectedCallback(): void;
  componentDidRender(): void;
  render(): VNode;
  renderToggleIcon(open: boolean): VNode;
}