@six-group/ui-library 3.0.0-beta.1.7

package/dist/types/components/six-timepicker/six-timepicker.d.ts

@@ -0,0 +1,184 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { SixTimeFormat } from './six-time-format';
+import { SixTime } from './six-timepicker.types';
+import { EmptyPayload } from '../../utils/types';
+interface SixTimepickerBasePayload {
+  value: SixTime;
+  valueAsString: string;
+}
+export interface SixTimepickerChange extends SixTimepickerBasePayload {
+  changedProperty?: string;
+}
+export interface SixTimepickerInput extends SixTimepickerBasePayload {
+}
+export interface SixTimepickerBlur extends SixTimepickerBasePayload {
+}
+/**
+ * @since 2.0.0
+ * @status experimental
+ *
+ * @part input - The input field
+ * @part container - The container of whole component
+ * @part popup - The popup of the timepicker component
+ *
+ */
+export declare class SixTimepicker {
+  private readonly eventListeners;
+  private popup;
+  private wrapper;
+  private inputElement;
+  host: HTMLSixTimepickerElement;
+  /**
+   * Define the time format. Valid formats are:
+   *
+   * HH:mm:ss
+   * hh:mm:ss:aa
+   * HH:mm:ss:ms
+   * hh:mm:ss:ms:aa
+   * HH:mm
+   * hh:mm:aa
+   * HH
+   * hh:aa
+   * mm
+   * ss
+   * ms
+   *
+   * where HH is the 24 hour format
+   * and hh is the 12 hour format
+   *
+   * Please notice that when using the 12-hour-clock (hh)
+   * you always need a period indicator (aa). So the time can be parsed as either am or pm
+   * */
+  format: SixTimeFormat;
+  /**
+   * Define the separator to be shown between the time unit pickers.
+   * Please be aware that this property will modify the displayed separator only.
+   * The separator for a timestring is always expected to be a colon (eg. '13:52:20')
+   * */
+  separator: string;
+  /**
+   * The value of the timepicker provided as a string. The string mast match the provided format (or default format)
+   */
+  value?: string | null;
+  /** Indicates whether or not the timepicker dropdown is open on startup. You can use this in lieu of the show/hide methods. */
+  open: boolean;
+  /** Indicates whether or not the timepicker should be shown as an inline (always open) component */
+  inline: boolean;
+  /**
+   * If `true` the user can only select a time via the timepicker but not directly edit the input field.
+   */
+  readonly: boolean;
+  /**
+   * If `true` the component is disabled.
+   */
+  disabled: boolean;
+  /**
+   * The enforced placement of the dropdown panel.
+   */
+  placement: 'top' | 'bottom';
+  /** Timepicker size. */
+  size: 'small' | 'medium' | 'large';
+  /** Set to true to make the input a required field. */
+  required: boolean;
+  /**
+   * The placeholder defines what text to be shown on the input element
+   */
+  placeholder?: string | null;
+  /** Set to display the error text on blur and not when typing */
+  errorOnBlur: boolean;
+  /** The input's error text. Alternatively, you can use the error-text slot. */
+  errorText: string;
+  /** The input's label. Alternatively, you can use the label slot. */
+  label: string;
+  /** The input's name attribute. */
+  name: string;
+  /** Set to true to add a clear button when the input is populated. */
+  clearable: boolean;
+  /** Set the position of the icon */
+  iconPosition: 'left' | 'right';
+  /**
+   * Enable this option to prevent the panel from being clipped when the component is placed inside a container with
+   * `overflow: auto|scroll`.
+   */
+  hoist: boolean;
+  /**
+   * Set the amount of time, in milliseconds, to wait to trigger faster switching between timeunits (e.g. hours).
+   */
+  timeout: number;
+  /**
+   * Set the amount of time, in milliseconds, to wait between switching to next timeunit (e.g. next hour) when mouse button is held pressed.
+   */
+  interval: number;
+  /**
+   * The defaultTime defines the default setting for the timepicker when you open the popup. Default time must match the provided format.
+   */
+  defaultTime?: string | null;
+  /**
+   * Set the amount of time, in milliseconds, to wait to trigger the `six-timepicker-change-debounced` event.
+   * If you want your change debounce event to not trigger when keeping the nav button pressed before, make sure debounce
+   * is a bit bigger than timeout, otherwise keeping the button pressed will trigger the event twice: once you click
+   * (and keep pressed) and once you release
+   */
+  debounce: number;
+  /**
+   * Emitted when the timepicker's value changes
+   */
+  sixChange: EventEmitter<SixTimepickerChange>;
+  /**
+   * Emitted when the timepicker's value changes, but debounced
+   */
+  sixChangeDebounced: EventEmitter<SixTimepickerChange>;
+  /**
+   * Emitted when the clear button is activated.
+   */
+  sixClear: EventEmitter<EmptyPayload>;
+  isPopupContentUp: boolean;
+  isDropDownContentUp: boolean;
+  resizeHandler(): Promise<void>;
+  scrollHandler(): Promise<void>;
+  protected debounceChanged(): void;
+  /**
+   * Update the native input element when the value changes
+   */
+  protected valueChanged(newValue: string): void;
+  /** Checks for validity and shows the browser's validation message if the control is invalid. */
+  reportValidity(): Promise<boolean>;
+  /** Checks for validity. */
+  checkValidity(): Promise<boolean>;
+  /** Sets a custom validation message. If `message` is not empty, the field will be considered invalid. */
+  setCustomValidity(message: string): Promise<void>;
+  /** Resets the formcontrol */
+  reset(): Promise<void>;
+  private internalValue;
+  private defaultValue;
+  componentWillLoad(): void;
+  componentDidLoad(): void;
+  disconnectedCallback(): void;
+  private handleInputChange;
+  private calcIsPopupContentUp;
+  private moveOpenHoistedPopup;
+  private handleSixTimepickerChangeDebounced;
+  private handleChange;
+  private getSixTimeUnitPicker;
+  private setupInternalTime;
+  private getHour24Picker;
+  private is24HourClock;
+  private getHour12Picker;
+  private is12HourClock;
+  private getAmPmPicker;
+  private getMinutePicker;
+  private getSecondsPicker;
+  private getMillisecondsPicker;
+  private getSeparator;
+  private getContent;
+  private openPopup;
+  private closePopup;
+  private handleDocumentMouseDown;
+  private handleClearClick;
+  private renderClearable;
+  private renderCustomIcon;
+  private calcIsDropDownContentUp;
+  private adjustPopupForHoisting;
+  render(): any;
+}
+export {};

package/dist/types/components/six-timepicker/six-timepicker.types.d.ts

@@ -0,0 +1,36 @@
+export declare enum SixTimePeriod {
+  AM = "AM",
+  PM = "PM"
+}
+export declare enum SixTimePropertyName {
+  HOURS = "hours",
+  MINUTES = "minutes",
+  SECONDS = "seconds",
+  MILLISECONDS = "milliseconds",
+  HAS_24_HOURS = "has24Hours",
+  PERIOD = "period"
+}
+export interface SixTime {
+  [SixTimePropertyName.HOURS]?: number;
+  [SixTimePropertyName.MINUTES]?: number;
+  [SixTimePropertyName.SECONDS]?: number;
+  [SixTimePropertyName.MILLISECONDS]?: number;
+  [SixTimePropertyName.HAS_24_HOURS]?: boolean;
+  [SixTimePropertyName.PERIOD]?: SixTimePeriod;
+}
+export declare enum TIME_FORMAT_CHAR {
+  HOUR_24 = "HH",
+  HOUR_12 = "hh",
+  MINUTE = "mm",
+  SECOND = "ss",
+  MILLISECOND = "ms",
+  PERIOD = "aa"
+}
+export declare const TIME_FORMAT_CHAR_TO_SIX_TIME_PROPERTY_MAP: {
+  HH: string;
+  hh: string;
+  mm: string;
+  ss: string;
+  ms: string;
+  aa: string;
+};

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

@@ -0,0 +1,72 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import Popover from '../../utils/popover';
+import { EmptyPayload } from '../../utils/types';
+/**
+ * @since 1.0
+ * @status stable
+ *
+ * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
+ *
+ * @slot - The tooltip's target element. Only the first element will be used as the target.
+ * @slot content - The tooltip's content. Alternatively, you can use the content prop.
+ *
+ * @part base - The component's base wrapper.
+ */
+export declare class SixTooltip {
+  componentId: string;
+  isVisible: boolean;
+  popover: Popover;
+  tooltipPositioner: HTMLElement;
+  target: HTMLElement;
+  tooltip: any;
+  host: HTMLSixTooltipElement;
+  /** The tooltip's content. Alternatively, you can use the content slot. */
+  content: string;
+  /**
+   * The preferred placement of the tooltip. Note that the actual placement may vary as needed to keep the tooltip
+   * inside of the viewport.
+   */
+  placement: 'top' | 'top-start' | 'top-end' | 'right' | 'right-start' | 'right-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end';
+  /** Set to true to disable the tooltip so it won't show when triggered. */
+  disabled: boolean;
+  /** The distance in pixels from which to offset the tooltip away from its target. */
+  distance: number;
+  /** Indicates whether or not the tooltip is open. You can use this in lieu of the show/hide methods. */
+  open: boolean;
+  /** The distance in pixels from which to offset the tooltip along its target. */
+  skidding: number;
+  /**
+   * Controls how the tooltip is activated. Possible options include `click`, `hover`, `focus`, and `manual`. Multiple
+   * options can be passed by separating them with a space. When manual is used, the tooltip must be activated
+   * programmatically.
+   */
+  trigger: string;
+  handleOpenChange(): void;
+  /** Emitted when the tooltip begins to show. Calling `event.preventDefault()` will prevent it from being shown. */
+  sixShow: EventEmitter<EmptyPayload>;
+  /** Emitted after the tooltip has shown and all transitions are complete. */
+  sixAfterShow: EventEmitter<EmptyPayload>;
+  /** Emitted when the tooltip begins to hide. Calling `event.preventDefault()` will prevent it from being hidden. */
+  sixHide: EventEmitter<EmptyPayload>;
+  /** Emitted after the tooltip has hidden and all transitions are complete. */
+  sixAfterHide: EventEmitter<EmptyPayload>;
+  connectedCallback(): void;
+  componentDidLoad(): void;
+  componentDidUpdate(): void;
+  disconnectedCallback(): void;
+  /** Shows the tooltip. */
+  show(): Promise<void>;
+  /** Shows the tooltip. */
+  hide(): Promise<void>;
+  getTarget(): HTMLElement;
+  handleBlur(): void;
+  handleClick(): void;
+  handleFocus(): void;
+  handleKeyDown(event: KeyboardEvent): void;
+  handleMouseOver(): void;
+  handleMouseOut(): void;
+  handleSlotChange(): void;
+  hasTrigger(triggerType: string): boolean;
+  syncOptions(): void;
+  render(): any;
+}