@pine-ds/core 0.0.2-alpha.0

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

@@ -0,0 +1,54 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class PdsRadio {
+    /**
+     * Determines whether or not the radio is checked.
+     * @defaultValue false
+     */
+    checked: boolean;
+    /**
+     * Determines whether or not the radio is disabled.
+     * @defaultValue false
+     */
+    disabled: boolean;
+    /**
+     * Displays message text describing an invalid state.
+     */
+    errorMessage: string;
+    /**
+     * Determines whether or not the radio is invalid.
+     * @defaultValue false
+     */
+    invalid: boolean;
+    /**
+     * A unique identifier used for the underlying component `id` attribute and the label `for` attribute.
+     */
+    componentId: string;
+    /**
+     * String used for label text next to radio.
+     */
+    label: string;
+    /**
+     * String used for helper message below radio.
+     */
+    helperMessage: string;
+    /**
+     * String used for radio `name` attribute.
+     */
+    name: string;
+    /**
+     * Determines whether or not the radio is required.
+     * @defaultValue false
+     */
+    required: boolean;
+    /**
+     * The value of the radio that is submitted with a form.
+     */
+    value: string;
+    /**
+     * Emits a boolean indicating whether the checkbox is currently checked or unchecked.
+     */
+    pdsRadioChange: EventEmitter<boolean>;
+    private handleRadioChange;
+    private classNames;
+    render(): any;
+}

package/dist/types/components/pds-sortable/pds-sortable-item/pds-sortable-item.d.ts

@@ -0,0 +1,20 @@
+/**
+ * @slot sortable-item-actions - Content is placed within the `pds-sortable-item__actions` element as children. This slot is only rendered if `actions` is set to `true`.
+ */
+export declare class PdsSortableItem {
+    /**
+     * Determines whether `sortable-item-actions` slot should be enabled.
+     * @defaultValue false
+     */
+    enableActions: boolean;
+    /**
+     * A unique identifier used for the sortable item `id` attribute.
+     */
+    componentId: string;
+    /**
+     * Determines whether `sortable-item` should have a handle.
+     * @defaultValue false
+     */
+    handle: boolean;
+    render(): any;
+}

package/dist/types/components/pds-sortable/pds-sortable.d.ts

@@ -0,0 +1,28 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class PdsSortable {
+    el: HTMLPdsSortableElement;
+    /**
+     * Event emitted when a sortable item is moved.
+     */
+    pdsSortableItemMoved: EventEmitter;
+    /**
+     * Determines whether `sortable` should have a border.
+     * @defaultValue false
+     */
+    border: boolean;
+    /**
+     * A unique identifier used for the sortable container `id` attribute.
+     */
+    componentId: string;
+    /**
+     * Deternines whether `sortable` items should be divided with border.
+     */
+    dividers: boolean;
+    /**
+     * Determines the grabbable area for the `pds-sortable-item`.
+     */
+    handleType: 'handle' | 'row';
+    private classNames;
+    componentDidLoad(): void;
+    render(): any;
+}

package/dist/types/components/pds-switch/pds-switch.d.ts

@@ -0,0 +1,59 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class PdsSwitch {
+    el: HTMLPdsSwitchElement;
+    /**
+     * A unique identifier used for the underlying component `id` attribute and the label `for` attribute.
+     */
+    componentId: string;
+    /**
+     * Determines the input 'checked' state
+     */
+    checked: boolean;
+    /**
+     * Determines the input 'disabled' state, preventing user interaction
+     */
+    disabled?: boolean;
+    /**
+     * Displays message text describing an invalid state
+     */
+    errorMessage?: string;
+    /**
+     * Displays help text for additional description of an input
+     */
+    helperMessage: string;
+    /**
+     * Determines the input 'invalid' state, signifying an error is present
+     */
+    invalid?: boolean;
+    /**
+     * Displays text to describe the input
+     */
+    label: string;
+    /**
+     * Identifies form data and unifies a group of radio inputs for toggling a single property/value
+     */
+    name: string;
+    /**
+     * Determines the 'required' state of the input
+     */
+    required?: boolean;
+    /**
+     * Specifies the underlying input element type
+     * @defaultValue 'checkbox'
+     */
+    type: 'checkbox' | 'radio';
+    /**
+     * Provides input with a string submitted in form data, and can be used to distinguish radio inputs
+     */
+    value: string;
+    /**
+     * Emits an event on input change
+    */
+    pdsSwitchChange: EventEmitter<InputEvent>;
+    private onSwitchUpdate;
+    /**
+     * Generate switch classes
+     */
+    private switchClassNames;
+    render(): any;
+}

package/dist/types/components/pds-tabs/pds-tab/pds-tab.d.ts

@@ -0,0 +1,35 @@
+import { EventEmitter } from '../../../stencil-public-runtime';
+export declare class PdsTab {
+    el: HTMLPdsTabElement;
+    /**
+     * Sets the related tab name, this name must match a `pds-tabpanel`'s tab name property
+     */
+    name: string;
+    /**
+     * Keeps track of the parentComponentId unique id, this property is passed by parent component
+     */
+    /** @internal */
+    parentComponentId: string;
+    /**
+     * Keeps track of if the expected tab variant, this property is passed by parent component
+     */
+    /** @internal */
+    variant: string;
+    /**
+     * Keeps track of if the tab index number, this property is passed by parent component
+     */
+    /** @internal */
+    index: number;
+    /**
+     * Keeps track of the tabpanel selected state, this property is passed by parent component
+     */
+    /** @internal */
+    selected: boolean;
+    /**
+     * Emits an event upon tab click for `pds-tab` and `pds-tabpanel` to listen for
+     */
+    /** @internal */
+    pdsTabClick: EventEmitter<object>;
+    private onTabClick;
+    render(): any;
+}

package/dist/types/components/pds-tabs/pds-tabpanel/pds-tabpanel.d.ts

@@ -0,0 +1,23 @@
+export declare class PdsTabpanel {
+    el: HTMLPdsTabpanelElement;
+    /**
+     * Sets the related tab name, this name must match a `pds-tab`'s tab name property
+     */
+    name: string;
+    /**
+     * Keeps track of the parentComponentId unique id, this property is passed by parent component
+     */
+    /** @internal */
+    parentComponentId: string;
+    /**
+     * Keeps track of if the expected tab variant, this property is passed by parent component
+     */
+    /** @internal */
+    variant: string;
+    /**
+     * Keeps track of the tabpanel selected state, this property is passed by parent component
+     */
+    /** @internal */
+    selected: boolean;
+    render(): any;
+}

package/dist/types/components/pds-tabs/pds-tabs.d.ts

@@ -0,0 +1,40 @@
+/**
+* @slot tabs - Content is placed within the `div[role="tablist"]` element as children
+* @slot tabpanels - Content is placed directly after the `div[role="tablist"]` element as siblings
+*/
+export declare class PdsTabs {
+    private tabs;
+    private tabPanels;
+    el: HTMLPdsTabsElement;
+    /**
+     * Sets the aria-label attached to the tablist element
+     */
+    tablistLabel: string;
+    /**
+     * A unique identifier used for the underlying component `id` attribute.
+     */
+    componentId: string;
+    /**
+     * Sets tabs variant styles as outlined in Figma documentation
+     */
+    variant: 'primary' | 'availability' | 'filter';
+    /**
+     * Sets the starting active tab name and maintains the name as the component re-renders
+     */
+    activeTabName: string;
+    /**
+     * Sets the starting active tab index number and maintains the index number as the component re-renders
+     */
+    /** @internal */
+    activeTabIndex: number;
+    tabClickHandler(event: CustomEvent<any>): void;
+    handleKeyDown(ev: KeyboardEvent): void;
+    private moveActiveTab;
+    private findAllChildren;
+    private propGeneration;
+    private passPropsToChildren;
+    private classNames;
+    componentWillLoad(): void;
+    componentWillRender(): void;
+    render(): any;
+}

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

@@ -0,0 +1,64 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { TextareaChangeEventDetail } from './textarea-interface';
+export declare class PdsTextarea {
+    el: HTMLPdsTextareaElement;
+    /**
+     * A unique identifier used for the underlying component `id` attribute.
+     */
+    componentId: string;
+    /**
+     * Indicates whether or not the textarea is disabled
+     * @defaultValue false
+     */
+    disabled: boolean;
+    /**
+     * Specifies the error text and provides an error-themed treatment to the field
+     */
+    errorMessage?: string;
+    /**
+     * Displays a hint or description of the textarea
+     */
+    helperMessage?: string;
+    /**
+     * Indicates whether or not the textarea is invalid or throws an error
+     * @defaultValue false
+     */
+    invalid: boolean;
+    /**
+     * Text to be displayed as the textarea label
+     */
+    label?: string;
+    /**
+     * Specifies the name, submitted with the form name/value pair. This value will mirror the componentId
+     */
+    name: string;
+    /**
+     * Specifies a short hint that describes the expected value of the textarea
+     */
+    placeholder?: string;
+    /**
+     * Indicates whether or not the textarea is readonly
+     * @defaultValue false
+     */
+    readonly: boolean;
+    /**
+     * Indicates whether or not the textarea is required
+     * @defaultValue false
+     */
+    required: boolean;
+    /**
+     * Sets number of rows of text visible without needing to scroll in the textarea
+     */
+    rows?: number;
+    /**
+     * The value of the textarea
+     */
+    value?: string;
+    /**
+     * Event emitted whenever the value of the textarea changes
+     */
+    pdsTextareaChange: EventEmitter<TextareaChangeEventDetail>;
+    private onTextareaChange;
+    private textareaClassNames;
+    render(): any;
+}

package/dist/types/components/pds-textarea/textarea-interface.d.ts

@@ -0,0 +1,8 @@
+export interface TextareaChangeEventDetail {
+    event?: Event;
+    value: string | null;
+}
+export interface TextareaEvent<T = TextareaChangeEventDetail> extends CustomEvent {
+    detail: T;
+    target: HTMLPdsTextareaElement;
+}

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

@@ -0,0 +1,68 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * @slot (default) - The tooltip's target element
+ * @slot content - HTML content for the tooltip
+ */
+export declare class PdsTooltip {
+    private contentEl;
+    /**
+     * Reference to the Host element
+     */
+    el: HTMLPdsTooltipElement;
+    /**
+     * Determines when the tooltip is open
+     * @defaultValue false
+     */
+    isOpen: boolean;
+    /**
+     * Content for the tooltip. If HTML is required, use the content slot
+     */
+    content: string;
+    /**
+     * A unique identifier used for the underlying component `id` attribute.
+     */
+    componentId: string;
+    /**
+     * Determines whether or not the tooltip has an arrow
+     * @defaultValue true
+     */
+    hasArrow?: boolean;
+    /**
+     * Enable this option when using the content slot
+     * @defaultValue false
+     */
+    htmlContent: boolean;
+    /**
+     * Determines the preferred position of the tooltip
+     * @defaultValue "right"
+     */
+    placement: 'top' | 'top-start' | 'top-end' | 'right' | 'right-start' | 'right-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end';
+    /**
+     * Determines whether or not the tooltip is visible
+     * @defaultValue false
+     */
+    opened: boolean;
+    handleOpenToggle(): void;
+    /**
+     * Emitted after a tooltip is closed
+     */
+    pdsTooltipHide: EventEmitter;
+    /**
+     * Emitted after a tooltip is shown
+     */
+    pdsTooltipShow: EventEmitter;
+    componentWillLoad(): void;
+    componentDidUpdate(): void;
+    componentDidRender(): void;
+    /**
+     * Shows the tooltip by enabling the opened property
+     */
+    showTooltip(): Promise<void>;
+    /**
+     * Hides the tooltip by disabling the opened property
+     */
+    hideTooltip(): Promise<void>;
+    private handleHide;
+    private handleShow;
+    render(): any;
+}