@quartzds/core 1.0.0-beta.8 → 1.0.0-beta.81

package/dist/types/components/label/label.d.ts

@@ -1,33 +1,33 @@
 import type { ComponentInterface } from '../../stencil-public-runtime';
-export type LabelSize = 'large' | 'small' | 'standard';
+import type { Size } from '../shared';
 /**
  * `<qds-label>` elements represent a caption for an item in a user interface.
  *
  * @see https://quartz.se.com/build/components/label
  */
 export declare class Label implements ComponentInterface {
-  /**
-   * Adds vertical margin to the label for alignment.
-   *
-   * This is useful when creating inline layouts so that the first lines have
-   * the correct vertical centering.
-   */
-  readonly inline: boolean;
-  /**
-   * Specify the labelled item as required by appending a red asterisk (*).
-   */
-  readonly required: boolean;
-  /**
-   * The label's size.
-   */
-  readonly size: LabelSize;
-  /**
-   * The label's text.
-   */
-  readonly text?: string;
-  private readonly element;
-  private inheritedAttributes;
-  componentWillLoad(): void;
-  render(): any;
+    #private;
+    /**
+     * Adds vertical margin to the label for alignment.
+     *
+     * This is useful when creating inline layouts so that the first lines have
+     * the correct vertical centering.
+     */
+    readonly inline: boolean;
+    /**
+     * Specify the labelled item as required by appending a red asterisk (*).
+     */
+    readonly required: boolean;
+    /**
+     * The label's size.
+     */
+    readonly size?: Size;
+    /**
+     * The label's text.
+     */
+    readonly text?: string;
+    private readonly host;
+    componentWillLoad(): void;
+    render(): any;
 }
 //# sourceMappingURL=label.d.ts.map

package/dist/types/components/list-item/list-item.d.ts

@@ -0,0 +1,100 @@
+import type { ComponentInterface } from '../../stencil-public-runtime';
+import type { Size } from '../shared';
+export type Destination = 'navigation';
+export type ListAction = 'multiselect' | 'reorder';
+export type Divider = 'hide' | 'indent';
+/**
+ *
+ *
+ * @see https://quartz.se.com/build/components/list-item
+ */
+export declare class ListItem implements ComponentInterface {
+    #private;
+    /**
+     * The destination action that the list item denotes through its rightmost icon.
+     */
+    readonly destination?: Destination;
+    /**
+     * Prevents the list item from being interacted with: it cannot be selected
+     * or focused.
+     */
+    readonly disabled: boolean;
+    /**
+     * Control how to display the bottom divider line.
+     *
+     * By default, the divider is visible and uses the full width of the list item.
+     *
+     * Use the `hide` value to hide the divider completely (useful with multiselect).
+     *
+     * Use the `indent` value to align the left end of the divider to the icon/text (useful on mobile).
+     *
+     * **Note**: the divider is automatically hidden on the last list item in the parent container.
+     */
+    readonly divider?: Divider;
+    /**
+     * The name of the icon to render.
+     *
+     * Available names depend on the icon library being used.
+     */
+    readonly iconName?: string;
+    /**
+     * The name of a registered icon library.
+     */
+    readonly iconLibrary: string;
+    /**
+     * Text to display for the kicker.
+     */
+    readonly kicker?: string;
+    /**
+     * The type of list-level action that the list item supports
+     */
+    readonly listAction?: ListAction;
+    /**
+     * The list items's size.
+     */
+    readonly size?: Size;
+    /**
+     * Whether or not the list item is checked when `list-action="multiselect"`
+     */
+    checked?: boolean;
+    /**
+     * Whether or not the list item is selected.
+     */
+    selected?: boolean;
+    /**
+     * Sets the list item to an indeterminate state, only when `list-action="indeterminate"`.
+     * This is usually applied to items that represent a "select all/none" behavior when associated
+     * items have a mix of selected and unselected states.
+     *
+     * @webnative
+     */
+    indeterminate?: boolean;
+    /**
+     * The primary text of the list item.
+     */
+    readonly text: string;
+    /**
+     * Text to display below the primary text.
+     */
+    readonly subtitle?: string;
+    /**
+     * Emitted when the list item loses focus.
+     */
+    private readonly blurEmitter;
+    /**
+     * Emitted when a change to the checkbox's state is committed by the user.
+     */
+    private readonly changeEmitter;
+    /**
+     * Emitted when the list item gains focus.
+     */
+    private readonly focusEmitter;
+    private readonly host;
+    private tabIndex?;
+    private inheritedAttributes;
+    protected onClick(event: MouseEvent): void;
+    protected tabindexChanged(newValue: string): void;
+    componentWillLoad(): void;
+    render(): any;
+}
+//# sourceMappingURL=list-item.d.ts.map

package/dist/types/components/loader/loader.d.ts

@@ -0,0 +1,27 @@
+import type { ComponentInterface } from '../../stencil-public-runtime';
+import type { Size } from '../shared';
+export type LoaderSize = Size | 'jumbo';
+export type LoaderStatus = 'error' | 'success' | 'warning';
+/**
+ * The `<qds-loader>` element displays an indicator showing that content is
+ * being loaded or processed.
+ *
+ * @see https://quartz.se.com/build/components/loader
+ */
+export declare class Loader implements ComponentInterface {
+    #private;
+    /**
+     * The loader's size.
+     */
+    readonly size?: LoaderSize;
+    /**
+     * The loader's status.
+     */
+    readonly status?: LoaderStatus;
+    private readonly host;
+    private readonly internals;
+    protected statusChanged(): void;
+    componentWillLoad(): void;
+    render(): any;
+}
+//# sourceMappingURL=loader.d.ts.map

package/dist/types/components/nav-list-item/nav-list-item.d.ts

@@ -0,0 +1,67 @@
+import type { ComponentInterface } from '../../stencil-public-runtime';
+import type { Size } from '../shared';
+/**
+ *
+ *
+ * @see https://quartz.se.com/build/components/nav-list-item
+ */
+export declare class NavListItem implements ComponentInterface {
+    #private;
+    /**
+     * Displays the navigation list item in a collapsed state without its text.
+     * The text will be displayed in a tooltip instead.
+     *
+     * This property has no effect if the navigation list item does not have an
+     * icon set.
+     */
+    readonly collapsed: boolean;
+    /**
+     * Prevents the navigation list item from being interacted with: it cannot be
+     * selected or focused.
+     */
+    readonly disabled: boolean;
+    /**
+     * The name of the icon to render.
+     *
+     * Available names depend on the icon library being used.
+     */
+    readonly iconName?: string;
+    /**
+     * The name of a registered icon library.
+     */
+    readonly iconLibrary: string;
+    /**
+     * The navigation list items's size.
+     */
+    readonly size?: Size;
+    /**
+     * Whether or not the navigation list item is selected.
+     */
+    readonly selected: boolean;
+    /**
+     * Text to display for the subtext.
+     */
+    readonly subtext?: string;
+    /**
+     * Primary text to display.
+     */
+    readonly text: string;
+    /**
+     * Emitted when the navigation list item loses focus.
+     */
+    private readonly blurEmitter;
+    /**
+     * Emitted when the navigation list item gains focus.
+     */
+    private readonly focusEmitter;
+    private readonly host;
+    private tabIndex?;
+    private inheritedAttributes;
+    private li?;
+    protected onClick(event: MouseEvent): void;
+    protected tabindexChanged(newValue: string): void;
+    componentWillLoad(): void;
+    render(): any;
+    private renderText;
+}
+//# sourceMappingURL=nav-list-item.d.ts.map

package/dist/types/components/progress-bar/progress-bar.d.ts

@@ -0,0 +1,60 @@
+import type { ComponentInterface } from '../../stencil-public-runtime';
+import type { Size } from '../shared';
+/**
+ * The `<qds-progress-bar>` element displays an indicator showing the
+ * completion progress of a task.
+ *
+ * @see https://quartz.se.com/build/components/progress-bar
+ */
+export declare class ProgressBar implements ComponentInterface {
+    #private;
+    /**
+     * The progress bar's size.
+     */
+    readonly size?: Size;
+    /**
+     * Returns a list of the [`<label>`][] elements associated with the
+     * `qds-progress-bar` element.
+     *
+     * [`<label>`]: https://developer.mozilla.org/docs/Web/HTML/Element/label
+     *
+     * @readonly
+     * @webnative
+     */
+    readonly labels: ElementInternals['labels'];
+    /**
+     * Specifies how much work the task indicated by the progress bar requires.
+     * `max` must have a value greater than 0 and be a valid floating point
+     * number.
+     *
+     * @webnative
+     */
+    readonly max?: number | string;
+    /**
+     * Returns the result of dividing the current value (`value`) by the maximum
+     * value (`max`); if the progress bar is an indeterminate progress bar, it
+     * returns `-1`.
+     *
+     * @readonly
+     * @webnative
+     */
+    readonly position: number;
+    /**
+     * Specifies how much of the task has been completed. It must be a valid
+     * floating point number between `0` and `max`, or between `0` and `1` if
+     * `max` is omitted. If this attribute is not specified, the progress bar is
+     * indeterminate; this indicates that an activity is ongoing with no
+     * indication of how long it is expected to take.
+     *
+     * @webnative
+     */
+    readonly value?: number | string;
+    private readonly host;
+    private readonly internals;
+    private width;
+    protected maxChanged(): void;
+    protected valueChanged(): void;
+    componentWillLoad(): void;
+    render(): any;
+}
+//# sourceMappingURL=progress-bar.d.ts.map

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

@@ -1,6 +1,6 @@
 import type { ComponentInterface } from '../../stencil-public-runtime';
 import type { Value } from '../controls';
-export type RadioSize = 'large' | 'small' | 'standard';
+import type { Size } from '../shared';
 /**
  * `<qds-radio>` elements are rendered as circles that are filled when
  * selected. They are generally used in **radio groups** — collections of radio
@@ -12,99 +12,94 @@ export type RadioSize = 'large' | 'small' | 'standard';
  * @see https://quartz.se.com/build/components/radio
  */
 export declare class Radio implements ComponentInterface {
-  /**
-   * Adds vertical margin to the radio for alignment.
-   *
-   * This is useful when creating inline layouts so that the first lines have
-   * the correct vertical centering.
-   */
-  readonly inline: boolean;
-  /**
-   * The radio button's size.
-   */
-  readonly size: RadioSize;
-  /**
-   * The radio button's text.
-   */
-  readonly text?: string;
-  /**
-   * Sets the radio button's state.
-   *
-   * @webnative
-   */
-  checked?: boolean;
-  /**
-   * Prevents the radio button from being interacted with: it cannot be pressed
-   * or focused.
-   *
-   * @webnative
-   */
-  disabled?: boolean;
-  /**
-   * The [`<form>`](https://developer.mozilla.org/docs/Web/HTML/Element/form)
-   * element to associate the radio button with (its form owner).
-   *
-   * The value of this property must be the id of a `<form>` in the same
-   * document. If this property is not set, the `<qds-radio>` is associated
-   * with its ancestor `<form>` element, if any.
-   *
-   * This property lets you associate `<qds-radio>` elements to `<form>`s
-   * anywhere in the document, not just inside a `<form>`. It can also override
-   * an ancestor `<form>` element.
-   *
-   * @webnative
-   */
-  readonly form?: string;
-  /**
-   * Specify the radio group this radio button belongs to.
-   *
-   * Once a radio group is established, selecting any radio button in that
-   * group automatically deselects any currently-selected radio button in the
-   * same group.
-   *
-   * @webnative
-   */
-  readonly name?: string;
-  /**
-   * Specify the group the radio button belongs to as required.
-   *
-   * If any radio button in a same-named group of radio buttons has the
-   * `required` attribute, a radio button in that group must be checked,
-   * although it doesn't have to be the one with the attribute applied.
-   *
-   * @webnative
-   */
-  readonly required?: boolean;
-  /**
-   * The value of the radio button, submitted as a name/value pair with form
-   * data.
-   *
-   * @webnative
-   */
-  value?: Value;
-  /**
-   * Emitted when the radio button loses focus.
-   */
-  private readonly blurEmitter;
-  /**
-   * Emitted when the radio button is checked by the user.
-   */
-  private readonly changeEmitter;
-  /**
-   * Emitted when the radio button gains focus.
-   */
-  private readonly focusEmitter;
-  private readonly element;
-  private inheritedAttributes;
-  private input?;
-  private get computedDisabled();
-  private get hasText();
-  protected onClick(): void;
-  componentWillLoad(): void;
-  render(): any;
-  private readonly ref;
-  private readonly onBlur;
-  private readonly onChange;
-  private readonly onFocus;
+    #private;
+    /**
+     * Adds vertical margin to the radio for alignment.
+     *
+     * This is useful when creating inline layouts so that the first lines have
+     * the correct vertical centering.
+     */
+    readonly inline: boolean;
+    /**
+     * The radio button's size.
+     */
+    readonly size?: Size;
+    /**
+     * The radio button's text.
+     */
+    readonly text?: string;
+    /**
+     * Sets the radio button's state.
+     *
+     * @webnative
+     */
+    checked?: boolean;
+    /**
+     * Prevents the radio button from being interacted with: it cannot be pressed
+     * or focused.
+     *
+     * @webnative
+     */
+    readonly disabled?: boolean;
+    /**
+     * The [`<form>`](https://developer.mozilla.org/docs/Web/HTML/Element/form)
+     * element to associate the radio button with (its form owner).
+     *
+     * The value of this property must be the id of a `<form>` in the same
+     * document. If this property is not set, the `<qds-radio>` is associated
+     * with its ancestor `<form>` element, if any.
+     *
+     * This property lets you associate `<qds-radio>` elements to `<form>`s
+     * anywhere in the document, not just inside a `<form>`. It can also override
+     * an ancestor `<form>` element.
+     *
+     * @webnative
+     */
+    readonly form?: string;
+    /**
+     * Specify the radio group this radio button belongs to.
+     *
+     * Once a radio group is established, selecting any radio button in that
+     * group automatically deselects any currently-selected radio button in the
+     * same group.
+     *
+     * @webnative
+     */
+    readonly name?: string;
+    /**
+     * Specify the group the radio button belongs to as required.
+     *
+     * If any radio button in a same-named group of radio buttons has the
+     * `required` attribute, a radio button in that group must be checked,
+     * although it doesn't have to be the one with the attribute applied.
+     *
+     * @webnative
+     */
+    readonly required?: boolean;
+    /**
+     * The value of the radio button, submitted as a name/value pair with form
+     * data.
+     *
+     * @webnative
+     */
+    value?: Value;
+    /**
+     * Emitted when the radio button loses focus.
+     */
+    private readonly blurEmitter;
+    /**
+     * Emitted when the radio button is checked by the user.
+     */
+    private readonly changeEmitter;
+    /**
+     * Emitted when the radio button gains focus.
+     */
+    private readonly focusEmitter;
+    private readonly host;
+    private tabIndex?;
+    protected onClick(event: MouseEvent): void;
+    protected tabindexChanged(newValue: string): void;
+    componentWillLoad(): void;
+    render(): any;
 }
 //# sourceMappingURL=radio.d.ts.map