@haiilo/catalyst 8.1.0 → 8.2.0

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

@@ -3,22 +3,22 @@ import { EventEmitter } from '../../stencil-public-runtime';
 import { Observable } from 'rxjs';
 import { ErrorMap } from '../cat-form-hint/cat-form-hint';
 export interface Item {
-  id: string;
+    id: string;
 }
 export interface Page<T> {
-  content: T[];
-  last: boolean;
-  totalElements?: number;
+    content: T[];
+    last: boolean;
+    totalElements?: number;
 }
 export interface RenderInfo {
-  label: string;
-  description?: string;
-  avatar?: {
-    src?: string;
-    round?: boolean;
-    initials?: string;
-    icon?: string;
-  };
+    label: string;
+    description?: string;
+    avatar?: {
+        src?: string;
+        round?: boolean;
+        initials?: string;
+        icon?: string;
+    };
 }
 /**
  * @property customId - Change the ID of item for the given one.
@@ -27,39 +27,39 @@ export interface RenderInfo {
  * @property render - Renders the items of the select.
  */
 export interface CatSelectConnector<T extends Item = any> {
-  customId?: (item: T) => string;
-  resolve: (ids: string[]) => Observable<T[]>;
-  retrieve: (term: string, page: number) => Observable<Page<T>>;
-  render: (item: T) => RenderInfo;
+    customId?: (item: T) => string;
+    resolve: (ids: string[]) => Observable<T[]>;
+    retrieve: (term: string, page: number) => Observable<Page<T>>;
+    render: (item: T) => RenderInfo;
 }
 export interface CatSelectState {
-  term: string;
-  isOpen: boolean;
-  isLoading: boolean;
-  isResolving: boolean;
-  options: {
-    item: Item;
-    render: RenderInfo;
-  }[];
-  tempSelection: {
-    item: Item;
-    render: RenderInfo;
-  }[];
-  selection: {
-    item: Item;
-    render: RenderInfo;
-  }[];
-  activeOptionIndex: number;
-  activeSelectionIndex: number;
-  totalElements?: number;
+    term: string;
+    isOpen: boolean;
+    isLoading: boolean;
+    isResolving: boolean;
+    options: {
+        item: Item;
+        render: RenderInfo;
+    }[];
+    tempSelection: {
+        item: Item;
+        render: RenderInfo;
+    }[];
+    selection: {
+        item: Item;
+        render: RenderInfo;
+    }[];
+    activeOptionIndex: number;
+    activeSelectionIndex: number;
+    totalElements?: number;
 }
 export interface CatSelectMultipleTaggingValue {
-  ids: string[];
-  tags: string[];
+    ids: string[];
+    tags: string[];
 }
 export interface CatSelectTaggingValue {
-  id: string;
-  tag: string;
+    id: string;
+    tag: string;
 }
 /**
  * Select lets user choose one option from an options' menu. Consider using
@@ -72,186 +72,186 @@ export interface CatSelectTaggingValue {
  * @part input - The native input element.
  */
 export declare class CatSelect {
-  private static readonly SKELETON_COUNT;
-  private static readonly DROPDOWN_OFFSET;
-  private readonly _id;
-  private get id();
-  private dropdown?;
-  private trigger?;
-  private input?;
-  private errorMapSrc?;
-  private subscription?;
-  private term$;
-  private more$;
-  private valueChangedBySelection;
-  hostElement: HTMLElement;
-  connector?: CatSelectConnector;
-  state: CatSelectState;
-  hasSlottedLabel: boolean;
-  hasSlottedHint: boolean;
-  errorMap?: ErrorMap;
-  /**
-   * Whether the label need a marker to shown if the select is required or optional.
-   */
-  requiredMarker?: 'none' | 'required' | 'optional' | 'none!' | 'optional!' | 'required!';
-  /**
-   * Whether the label is on top or left.
-   */
-  horizontal: boolean;
-  /**
-   * Enable multiple selection.
-   */
-  multiple: boolean;
-  /**
-   * The debounce time for the search.
-   */
-  debounce: number;
-  /**
-   * The placement of the select.
-   */
-  placement: Placement;
-  /**
-   * The value of the select. <br />
-   * <br />
-   * The value of the select depends on whether it is allowed to choose a single item or several items. <br />
-   * When only one item can be selected, the value is the id of the item, in case several items can be selected, the value is an array of ids of the selected items. <br />
-   * <br />
-   * In case the user can add new items to the select (tags activated), the value in the single select is an object (CatSelectTaggingValue) with the id of the item or the name of the created item,
-   * in the case of multiple select, it is an object (CatSelectMultipleTaggingValue) with the array of the ids of the items selected and the array of the names of the items created
-   */
-  value?: string | string[] | CatSelectTaggingValue | CatSelectMultipleTaggingValue;
-  /**
-   * Whether the select is disabled.
-   */
-  disabled: boolean;
-  /**
-   * The placeholder text to display within the select.
-   */
-  placeholder?: string;
-  /**
-   * Optional hint text(s) to be displayed with the select.
-   */
-  hint?: string | string[];
-  /**
-   * A unique identifier for the input.
-   */
-  identifier?: string;
-  /**
-   * The label for the select.
-   */
-  label: string;
-  /**
-   * The name of the form control. Submitted with the form as part of a name/value pair.
-   */
-  name?: string;
-  /**
-   * Visually hide the label, but still show it to assistive technologies like screen readers.
-   */
-  labelHidden: boolean;
-  /**
-   * A value is required or must be checked for the form to be submittable.
-   */
-  required: boolean;
-  /**
-   * Whether the select should show a clear button.
-   */
-  clearable: boolean;
-  /**
-   * Whether the select should add new items.
-   */
-  tags: boolean;
-  /**
-   * Optional hint text to be displayed on the new item to be added.
-   */
-  tagHint?: string;
-  /**
-   * The text to display in the dropdown if no results are found.
-   */
-  noItems?: string;
-  /**
-   * The validation errors for this input. Will render a hint under the input
-   * with the translated error message(s) `error.${key}`. If an object is
-   * passed, the keys will be used as error keys and the values translation
-   * parameters.
-   * If the value is `true`, the input will be marked as invalid without any
-   * hints under the input.
-   */
-  errors?: boolean | string[] | ErrorMap;
-  /**
-   * Fine-grained control over when the errors are shown. Can be `false` to
-   * never show errors, `true` to show errors on blur, or a number to show
-   * errors on change with the given delay in milliseconds.
-   */
-  errorUpdate: boolean | number;
-  /**
-   * Attributes that will be added to the native HTML input element.
-   */
-  nativeAttributes?: {
-    [key: string]: string;
-  };
-  onConnectorChanged(connector: CatSelectConnector): void;
-  onValueChanged(): void;
-  onErrorsChanged(value?: boolean | string[] | ErrorMap): void;
-  onStateChanged(newState: CatSelectState, oldState: CatSelectState): void;
-  /**
-   * Emitted when the select dropdown is opened.
-   */
-  catOpen: EventEmitter<FocusEvent>;
-  /**
-   * Emitted when the select dropdown is closed.
-   */
-  catClose: EventEmitter<FocusEvent>;
-  /**
-   * Emitted when the value is changed.
-   */
-  catChange: EventEmitter<InputEvent>;
-  /**
-   * Emitted when the select loses the focus.
-   */
-  catBlur: EventEmitter<FocusEvent>;
-  componentDidLoad(): void;
-  componentWillRender(): void;
-  onBlur(event: FocusEvent): void;
-  onKeyDown(event: KeyboardEvent): void;
-  onKeyUp(event: KeyboardEvent): void;
-  /**
-   * Connect the functions of the select
-   *
-   * @param connector - The {@link CatSelectConnector} of the select.
-   */
-  connect(connector: CatSelectConnector): Promise<void>;
-  render(): any;
-  private get hasHint();
-  private get invalid();
-  private get optionsList();
-  private resolve;
-  private toSelectItems;
-  private show;
-  private hide;
-  private search;
-  private isSelected;
-  private select;
-  private deselect;
-  private toggle;
-  private clear;
-  private reset;
-  private onClick;
-  private onInput;
-  private update;
-  private patchState;
-  private isPillboxActive;
-  private get activeDescendant();
-  private onArrowKeyDown;
-  private get tagTextHelp();
-  private isTagSelected;
-  private createTag;
-  private removeTag;
-  private toggleTag;
-  private initIds;
-  private initTags;
-  private setTransparentCaret;
-  private showErrors;
-  private errorUpdateTimeoutId?;
-  private showErrorsIfTimeout;
-  private showErrorsIfNoFocus;
+    private static readonly SKELETON_COUNT;
+    private static readonly DROPDOWN_OFFSET;
+    private readonly _id;
+    private get id();
+    private dropdown?;
+    private trigger?;
+    private input?;
+    private errorMapSrc?;
+    private subscription?;
+    private term$;
+    private more$;
+    private valueChangedBySelection;
+    hostElement: HTMLElement;
+    connector?: CatSelectConnector;
+    state: CatSelectState;
+    hasSlottedLabel: boolean;
+    hasSlottedHint: boolean;
+    errorMap?: ErrorMap;
+    /**
+     * Whether the label need a marker to shown if the select is required or optional.
+     */
+    requiredMarker?: 'none' | 'required' | 'optional' | 'none!' | 'optional!' | 'required!';
+    /**
+     * Whether the label is on top or left.
+     */
+    horizontal: boolean;
+    /**
+     * Enable multiple selection.
+     */
+    multiple: boolean;
+    /**
+     * The debounce time for the search.
+     */
+    debounce: number;
+    /**
+     * The placement of the select.
+     */
+    placement: Placement;
+    /**
+     * The value of the select. <br />
+     * <br />
+     * The value of the select depends on whether it is allowed to choose a single item or several items. <br />
+     * When only one item can be selected, the value is the id of the item, in case several items can be selected, the value is an array of ids of the selected items. <br />
+     * <br />
+     * In case the user can add new items to the select (tags activated), the value in the single select is an object (CatSelectTaggingValue) with the id of the item or the name of the created item,
+     * in the case of multiple select, it is an object (CatSelectMultipleTaggingValue) with the array of the ids of the items selected and the array of the names of the items created
+     */
+    value?: string | string[] | CatSelectTaggingValue | CatSelectMultipleTaggingValue;
+    /**
+     * Whether the select is disabled.
+     */
+    disabled: boolean;
+    /**
+     * The placeholder text to display within the select.
+     */
+    placeholder?: string;
+    /**
+     * Optional hint text(s) to be displayed with the select.
+     */
+    hint?: string | string[];
+    /**
+     * A unique identifier for the input.
+     */
+    identifier?: string;
+    /**
+     * The label for the select.
+     */
+    label: string;
+    /**
+     * The name of the form control. Submitted with the form as part of a name/value pair.
+     */
+    name?: string;
+    /**
+     * Visually hide the label, but still show it to assistive technologies like screen readers.
+     */
+    labelHidden: boolean;
+    /**
+     * A value is required or must be checked for the form to be submittable.
+     */
+    required: boolean;
+    /**
+     * Whether the select should show a clear button.
+     */
+    clearable: boolean;
+    /**
+     * Whether the select should add new items.
+     */
+    tags: boolean;
+    /**
+     * Optional hint text to be displayed on the new item to be added.
+     */
+    tagHint?: string;
+    /**
+     * The text to display in the dropdown if no results are found.
+     */
+    noItems?: string;
+    /**
+     * The validation errors for this input. Will render a hint under the input
+     * with the translated error message(s) `error.${key}`. If an object is
+     * passed, the keys will be used as error keys and the values translation
+     * parameters.
+     * If the value is `true`, the input will be marked as invalid without any
+     * hints under the input.
+     */
+    errors?: boolean | string[] | ErrorMap;
+    /**
+     * Fine-grained control over when the errors are shown. Can be `false` to
+     * never show errors, `true` to show errors on blur, or a number to show
+     * errors on change with the given delay in milliseconds.
+     */
+    errorUpdate: boolean | number;
+    /**
+     * Attributes that will be added to the native HTML input element.
+     */
+    nativeAttributes?: {
+        [key: string]: string;
+    };
+    onConnectorChanged(connector: CatSelectConnector): void;
+    onValueChanged(): void;
+    onErrorsChanged(value?: boolean | string[] | ErrorMap): void;
+    onStateChanged(newState: CatSelectState, oldState: CatSelectState): void;
+    /**
+     * Emitted when the select dropdown is opened.
+     */
+    catOpen: EventEmitter<FocusEvent>;
+    /**
+     * Emitted when the select dropdown is closed.
+     */
+    catClose: EventEmitter<FocusEvent>;
+    /**
+     * Emitted when the value is changed.
+     */
+    catChange: EventEmitter<InputEvent>;
+    /**
+     * Emitted when the select loses the focus.
+     */
+    catBlur: EventEmitter<FocusEvent>;
+    componentDidLoad(): void;
+    componentWillRender(): void;
+    onBlur(event: FocusEvent): void;
+    onKeyDown(event: KeyboardEvent): void;
+    onKeyUp(event: KeyboardEvent): void;
+    /**
+     * Connect the functions of the select
+     *
+     * @param connector - The {@link CatSelectConnector} of the select.
+     */
+    connect(connector: CatSelectConnector): Promise<void>;
+    render(): any;
+    private get hasHint();
+    private get invalid();
+    private get optionsList();
+    private resolve;
+    private toSelectItems;
+    private show;
+    private hide;
+    private search;
+    private isSelected;
+    private select;
+    private deselect;
+    private toggle;
+    private clear;
+    private reset;
+    private onClick;
+    private onInput;
+    private update;
+    private patchState;
+    private isPillboxActive;
+    private get activeDescendant();
+    private onArrowKeyDown;
+    private get tagTextHelp();
+    private isTagSelected;
+    private createTag;
+    private removeTag;
+    private toggleTag;
+    private initIds;
+    private initTags;
+    private setTransparentCaret;
+    private showErrors;
+    private errorUpdateTimeoutId?;
+    private showErrorsIfTimeout;
+    private showErrorsIfNoFocus;
 }

package/dist/types/components/cat-select/connectors.d.ts

@@ -6,7 +6,7 @@ import { CatSelectConnector, RenderInfo } from './cat-select';
  * @returns a connector that resolves local object array data
  */
 export declare function objectArrayConnector<T extends {
-  id: string;
+    id: string;
 } & RenderInfo = any>(data: T[]): CatSelectConnector<T>;
 /**
  * Creates a connector that resolves local string array data.
@@ -15,8 +15,8 @@ export declare function objectArrayConnector<T extends {
  * @returns a connector that resolves local string array data
  */
 export declare function stringArrayConnector(data: string[]): CatSelectConnector<{
-  id: string;
-  label: string;
+    id: string;
+    label: string;
 }>;
 /**
  * Creates a connector that resolves local string map data.
@@ -25,6 +25,6 @@ export declare function stringArrayConnector(data: string[]): CatSelectConnector
  * @returns a connector that resolves local string map data
  */
 export declare function stringMapConnector(data: Map<string, string>): CatSelectConnector<{
-  id: string;
-  label: string;
+    id: string;
+    label: string;
 }>;

package/dist/types/components/cat-select-demo/cat-select-demo.d.ts

@@ -1,13 +1,13 @@
 export declare class CatSelectTest {
-  private multipleSelect?;
-  private multipleSelectAvatar?;
-  private multipleSelectAvatarInitials?;
-  private multipleSelectTagging?;
-  private singleSelect?;
-  private singleSelectAvatar?;
-  private singleSelectAvatarInitials?;
-  private singleSelectTagging?;
-  componentDidLoad(): void;
-  render(): any;
-  private get countryConnector();
+    private multipleSelect?;
+    private multipleSelectAvatar?;
+    private multipleSelectAvatarInitials?;
+    private multipleSelectTagging?;
+    private singleSelect?;
+    private singleSelectAvatar?;
+    private singleSelectAvatarInitials?;
+    private singleSelectTagging?;
+    componentDidLoad(): void;
+    render(): any;
+    private get countryConnector();
 }

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

@@ -2,27 +2,27 @@
  * Skeletons are used to show where content will eventually be drawn.
  */
 export declare class CatSkeleton {
-  /**
-   * The animation style of the skeleton.
-   */
-  effect: 'plain' | 'sheen' | 'pulse';
-  /**
-   * The rendering style of the skeleton.
-   */
-  variant: 'rectangle' | 'square' | 'circle' | 'head' | 'body';
-  /**
-   * The size of the skeleton. If the variant is set to "head", the size values
-   * "xs" to "xl" translate to the head levels `h1` to `h5`.
-   */
-  size: 'xs' | 's' | 'm' | 'l' | 'xl';
-  /**
-   * The number of text lines to be rendered for "head" and "body" variants.
-   * Defaults to 1 for "head" and 3 for "body". Will be ignored for other
-   * variants.
-   */
-  lines?: number;
-  render(): any;
-  private get count();
-  private get style();
-  private random;
+    /**
+     * The animation style of the skeleton.
+     */
+    effect: 'plain' | 'sheen' | 'pulse';
+    /**
+     * The rendering style of the skeleton.
+     */
+    variant: 'rectangle' | 'square' | 'circle' | 'head' | 'body';
+    /**
+     * The size of the skeleton. If the variant is set to "head", the size values
+     * "xs" to "xl" translate to the head levels `h1` to `h5`.
+     */
+    size: 'xs' | 's' | 'm' | 'l' | 'xl';
+    /**
+     * The number of text lines to be rendered for "head" and "body" variants.
+     * Defaults to 1 for "head" and 3 for "body". Will be ignored for other
+     * variants.
+     */
+    lines?: number;
+    render(): any;
+    private get count();
+    private get style();
+    private random;
 }

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

@@ -2,14 +2,14 @@
  * Spinners are used to indicate users that their action is being processed.
  */
 export declare class CatSpinner {
-  /**
-   * The size of the spinner.
-   */
-  size: 'xs' | 's' | 'm' | 'l' | 'xl' | 'inline';
-  /**
-   * Adds accessible label for the spinner that is only shown for screen
-   * readers. The `aria-hidden` attribute will be set if no label is present.
-   */
-  a11yLabel?: string;
-  render(): any;
+    /**
+     * The size of the spinner.
+     */
+    size: 'xs' | 's' | 'm' | 'l' | 'xl' | 'inline';
+    /**
+     * Adds accessible label for the spinner that is only shown for screen
+     * readers. The `aria-hidden` attribute will be set if no label is present.
+     */
+    a11yLabel?: string;
+    render(): any;
 }