@haiilo/catalyst 0.3.1 → 0.5.0

package/dist/types/components/cat-checkbox/cat-checkbox.d.ts

@@ -0,0 +1,69 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * Checkboxes are used to let a user choose one or more options from a limited
+ * number of options.
+ *
+ * @part checkbox - The checkbox element.
+ * @part label - The label content.
+ */
+export declare class CatCheckbox {
+  private readonly id;
+  private input;
+  /**
+   * Checked state of the checkbox
+   */
+  checked: boolean;
+  /**
+   * Disabled state of the checkbox
+   */
+  disabled: boolean;
+  /**
+   * Indeterminate state of the checkbox
+   */
+  indeterminate: boolean;
+  /**
+   * Label of the checkbox which is presented in the UI
+   */
+  label: string;
+  /**
+   * Visually hide the label, but still show it to assistive technologies like screen readers.
+   */
+  labelHidden: boolean;
+  /**
+   * The name of the input
+   */
+  name?: string;
+  /**
+   * Required state of the checkbox
+   */
+  required: boolean;
+  /**
+   * The value of the checkbox
+   */
+  value?: string;
+  /**
+   * Emitted when the checked status of the checkbox is changed.
+   */
+  catChange: EventEmitter;
+  /**
+   * Emitted when the checkbox received focus.
+   */
+  catFocus: EventEmitter<FocusEvent>;
+  /**
+   * Emitted when the checkbox loses focus.
+   */
+  catBlur: EventEmitter<FocusEvent>;
+  componentDidLoad(): void;
+  componentWillRender(): void;
+  /**
+   * Sets focus on the checkbox. Use this method instead of `checkbox.focus()`.
+   *
+   * @param options An optional object providing options to control aspects of
+   * the focusing process.
+   */
+  setFocus(options?: FocusOptions): Promise<void>;
+  render(): any;
+  private onInput;
+  private onFocus;
+  private onBlur;
+}

package/dist/types/components/cat-i18n/cat-i18n-registry.d.ts

@@ -0,0 +1,18 @@
+export declare class CatI18nRegistry {
+  private static instance;
+  private lang;
+  private readonly messages;
+  private constructor();
+  static getInstance(): CatI18nRegistry;
+  getLanguage(): string;
+  setLanguage(lang: string): void;
+  getMessage(key: string): string | undefined;
+  addMessage(lang: string, key: string, message: string): CatI18nRegistry;
+  addMessages(lang: string, i18n: {
+    [key: string]: string;
+  }): CatI18nRegistry;
+  removeMessage(lang: string, key: string): CatI18nRegistry;
+  removeMessages(lang: string, keys: string[]): CatI18nRegistry;
+  private buildEvent;
+  private getDict;
+}

package/dist/types/components/cat-icon/cat-icon-registry.d.ts

@@ -4,12 +4,12 @@ export declare class CatIconRegistry {
   private constructor();
   static getInstance(): CatIconRegistry;
   getIcon(name: string, setName?: string): string | undefined;
-  addIcon(name: string, data: string, setName?: string): void;
+  addIcon(name: string, data: string, setName?: string): CatIconRegistry;
   addIcons(icons: {
     [name: string]: string;
-  }, setName?: string): void;
-  removeIcon(name: string, setName?: string): void;
-  removeIcons(names: string[], setName?: string): void;
+  }, setName?: string): CatIconRegistry;
+  removeIcon(name: string, setName?: string): CatIconRegistry;
+  removeIcons(names: string[], setName?: string): CatIconRegistry;
   private buildName;
   private buildEvent;
 }

package/dist/types/components/cat-icon/cat-icon.d.ts

@@ -2,7 +2,7 @@
  * Icons are used to provide additional meaning or in places where text label
  * doesn't fit.
  *
- * @part icon - The native span element wrapping the SVG icon.
+ * @part icon - The span element wrapping the SVG icon.
  */
 export declare class CatIcon {
   private readonly iconRegistry;

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

@@ -0,0 +1,130 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * Inputs are used to allow users to provide text input when the expected input
+ * is short. As well as plain text, Input supports various types of text,
+ * including passwords and numbers.
+ *
+ * @part label - The label content.
+ * @part prefix - The text prefix.
+ * @part suffix - The text suffix.
+ */
+export declare class CatInput {
+  private readonly i18n;
+  private readonly id;
+  private input;
+  private inputValue;
+  /**
+   * Hint for form autofill feature.
+   */
+  autoComplete?: string;
+  /**
+   * Whether the input should show a clear button.
+   */
+  clearable: boolean;
+  /**
+   * Whether the input is disabled.
+   */
+  disabled: boolean;
+  /**
+   * Optional hint text to be displayed with the input.
+   */
+  hint?: string;
+  /**
+   * The name of an icon to be displayed in the input.
+   */
+  icon?: string;
+  /**
+   * Display the icon on the right.
+   */
+  iconRight: boolean;
+  /**
+   * The label for the input.
+   */
+  label: string;
+  /**
+   * Visually hide the label, but still show it to assistive technologies like screen readers.
+   */
+  labelHidden: boolean;
+  /**
+   * A maximum value for numeric values.
+   */
+  max?: number;
+  /**
+   * A maximum length (number of characters) for textual values.
+   */
+  maxLength?: number;
+  /**
+   * A minimum value for numeric values.
+   */
+  min?: number;
+  /**
+   * A minimum length (number of characters) for textual values.
+   */
+  minLength?: number;
+  /**
+   * The name of the form control. Submitted with the form as part of a name/value pair.
+   */
+  name: string;
+  /**
+   * The placeholder text to display within the input.
+   */
+  placeholder?: string;
+  /**
+   * A textual prefix to be displayed in the input.
+   */
+  textPrefix?: string;
+  /**
+   * A textual suffix to be displayed in the input.
+   */
+  textSuffix?: string;
+  /**
+   * The value is not editable.
+   */
+  readonly: boolean;
+  /**
+   * A value is required or must be check for the form to be submittable.
+   */
+  required: boolean;
+  /**
+   * Use round input edges.
+   */
+  round: boolean;
+  /**
+   * Type of form control.
+   */
+  type: 'text' | 'email' | 'password' | 'tel' | 'url' | 'search' | 'number';
+  /**
+   * The initial value of the control.
+   */
+  value?: string | number;
+  /**
+   * Emitted when the value is changed.
+   */
+  catChange: EventEmitter;
+  /**
+   * Emitted when the input received focus.
+   */
+  catFocus: EventEmitter<FocusEvent>;
+  /**
+   * Emitted when the input loses focus.
+   */
+  catBlur: EventEmitter<FocusEvent>;
+  onValueChange(value?: string | number): void;
+  componentWillLoad(): void;
+  componentWillRender(): void;
+  /**
+   * Sets focus on the input. Use this method instead of `input.focus()`.
+   *
+   * @param options An optional object providing options to control aspects of
+   * the focusing process.
+   */
+  setFocus(options?: FocusOptions): Promise<void>;
+  /**
+   * Clear the input.
+   */
+  clear(): Promise<void>;
+  render(): any;
+  private onInput;
+  private onFocus;
+  private onBlur;
+}

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

@@ -28,5 +28,4 @@ export declare class CatMenu {
   private show;
   private hide;
   private update;
-  private firstTabbable;
 }

package/dist/types/components/cat-radio/cat-radio.d.ts

@@ -0,0 +1,63 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * Radio Buttons are graphical interface elements that allow user to choose
+ * only one of a predefined set of mutually exclusive options.
+ *
+ * @part label - The label content.
+ */
+export declare class CatRadio {
+  private readonly id;
+  private input;
+  /**
+   * Whether this radio is checked.
+   */
+  checked: boolean;
+  /**
+   * Whether this radio is disabled.
+   */
+  disabled: boolean;
+  /**
+   * The label of the radio that is visible.
+   */
+  label: string;
+  /**
+   * Visually hide the label, but still show it to assistive technologies like screen readers.
+   */
+  labelHidden: boolean;
+  /**
+   * The name of the radio component.
+   */
+  name?: string;
+  /**
+   * Whether the radio is required.
+   */
+  required: boolean;
+  /**
+   * The value of the radio component.
+   */
+  value?: string;
+  /**
+   * Emitted when the radio is changed.
+   */
+  catChange: EventEmitter;
+  /**
+   * Emitted when the radio received focus.
+   */
+  catFocus: EventEmitter<FocusEvent>;
+  /**
+   * Emitted when the radio loses focus.
+   */
+  catBlur: EventEmitter<FocusEvent>;
+  componentWillRender(): void;
+  /**
+   * Sets focus on the radio. Use this method instead of `radio.focus()`.
+   *
+   * @param options An optional object providing options to control aspects of
+   * the focusing process.
+   */
+  setFocus(options?: FocusOptions): Promise<void>;
+  render(): any;
+  private onChange;
+  private onFocus;
+  private onBlur;
+}

package/dist/types/components/cat-scrollable/cat-scrollable.d.ts

@@ -1,11 +1,13 @@
 import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * An element to display scrollable content.
+ */
 export declare class CatScrollable {
   scrollElement?: HTMLElement;
   scrollWrapperElement?: HTMLElement;
   private readonly init;
   private readonly destroyed;
   private scrolled;
-  el: HTMLElement;
   /** Flags to enable/disable scroll shadowX. */
   shadowX: boolean;
   /** Flags to enable/disable scroll shadowY. */

package/dist/types/components/cat-textarea/cat-textarea.d.ts

@@ -0,0 +1,85 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * Textarea specifies a control that allows user to write text over multiple
+ * rows. Used when the expected user input is long. For shorter input, use the
+ * input component.
+ *
+ * @part label - The label content.
+ */
+export declare class CatTextarea {
+  private readonly id;
+  private textarea;
+  /**
+   * Whether the textarea is disabled.
+   */
+  disabled: boolean;
+  /**
+   * Optional hint text to be displayed with the textarea.
+   */
+  hint?: string;
+  /**
+   * The label for the textarea.
+   */
+  label: string;
+  /**
+   * Visually hide the label, but still show it to assistive technologies like screen readers.
+   */
+  labelHidden: boolean;
+  /**
+   * A maximum length (number of characters) for textual values.
+   */
+  maxLength?: number;
+  /**
+   * A minimum length (number of characters) for textual values.
+   */
+  minLength?: number;
+  /**
+   * The name of the form control. Submitted with the form as part of a name/value pair.
+   */
+  name: string;
+  /**
+   * The placeholder text to display within the input.
+   */
+  placeholder?: string;
+  /**
+   * The value is not editable.
+   */
+  readonly: boolean;
+  /**
+   * A value is required or must be check for the form to be submittable.
+   */
+  required: boolean;
+  /**
+   * Specifies the initial number of lines in the textarea.
+   */
+  rows: number;
+  /**
+   * The initial value of the control.
+   */
+  value?: string | number;
+  /**
+   * Emitted when the value is changed.
+   */
+  catChange: EventEmitter;
+  /**
+   * Emitted when the textarea received focus.
+   */
+  catFocus: EventEmitter<FocusEvent>;
+  /**
+   * Emitted when the textarea loses focus.
+   */
+  catBlur: EventEmitter<FocusEvent>;
+  componentWillRender(): void;
+  componentDidLoad(): void;
+  /**
+   * Sets focus on the textarea. Use this method instead of `textarea.focus()`.
+   *
+   * @param options An optional object providing options to control aspects of
+   * the focusing process.
+   */
+  setFocus(options?: FocusOptions): Promise<void>;
+  render(): any;
+  private onInput;
+  private onFocus;
+  private onBlur;
+}

package/dist/types/components/cat-toggle/cat-toggle.d.ts

@@ -0,0 +1,64 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * Toggles are graphical interface switches that give user control over a
+ * feature or option that can be turned on or off.
+ *
+ * @part toggle - The toggle element.
+ * @part label - The label content.
+ */
+export declare class CatToggle {
+  private readonly id;
+  private input;
+  /**
+   * Checked state of the toggle.
+   */
+  checked: boolean;
+  /**
+   * Disabled state of the toggle.
+   */
+  disabled: boolean;
+  /**
+   * The label of the toggle that is visible.
+   */
+  label: string;
+  /**
+   * Visually hide the label, but still show it to assistive technologies like screen readers.
+   */
+  labelHidden: boolean;
+  /**
+   * The name of the input
+   */
+  name?: string;
+  /**
+   * Required state of the toggle
+   */
+  required: boolean;
+  /**
+   * The value of the toggle
+   */
+  value?: string;
+  /**
+   * Emitted when the checked status of the toggle is changed.
+   */
+  catChange: EventEmitter;
+  /**
+   * Emitted when the toggle received focus.
+   */
+  catFocus: EventEmitter<FocusEvent>;
+  /**
+   * Emitted when the toggle loses focus.
+   */
+  catBlur: EventEmitter<FocusEvent>;
+  componentWillRender(): void;
+  /**
+   * Sets focus on the toggle. Use this method instead of `toggle.focus()`.
+   *
+   * @param options An optional object providing options to control aspects of
+   * the focusing process.
+   */
+  setFocus(options?: FocusOptions): Promise<void>;
+  render(): any;
+  private onInput;
+  private onFocus;
+  private onBlur;
+}

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

@@ -0,0 +1,46 @@
+import { Placement } from '@floating-ui/dom';
+export declare class CatTooltip {
+  private static readonly OFFSET;
+  private readonly id;
+  private tooltip?;
+  private triggerElement?;
+  private trigger?;
+  private showTimeout?;
+  private hideTimeout?;
+  private touchTimeout?;
+  /**
+   * The content of the tooltip.
+   */
+  content: string;
+  /**
+   * Specifies that the tooltip should be disabled. A disabled tooltip is unusable,
+   * and invisible. Corresponds with the native HTML disabled attribute.
+   */
+  disabled: boolean;
+  /**
+   * The placement of the tooltip.
+   */
+  placement: Placement;
+  /**
+   * The delay time for showing tooltip in ms.
+   */
+  showDelay: number;
+  /**
+   * The delay time for hiding tooltip in ms.
+   */
+  hideDelay: number;
+  /**
+   * The duration of tap to show the tooltip.
+   */
+  longTouchDuration: number;
+  handleKeyDown({ key }: KeyboardEvent): void;
+  componentDidLoad(): void;
+  disconnectedCallback(): void;
+  render(): any;
+  private get isTabbable();
+  private update;
+  private showListener;
+  private hideListener;
+  private touchStartListener;
+  private touchEndListener;
+}