@tessera-ui/core 0.4.0

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

@@ -0,0 +1,62 @@
+import type { EventEmitter } from '../../stencil-public-runtime';
+import type { TsSize, TsChangeEventDetail } from '../../types';
+/**
+ * @part base - The outer wrapper.
+ * @part label - The label element.
+ * @part textarea - The native textarea element.
+ * @part help-text - The help text wrapper.
+ * @part error-text - The error message wrapper.
+ */
+export declare class TsTextarea {
+    hostEl: HTMLElement;
+    private textareaEl?;
+    private inputId;
+    /** The textarea's value. */
+    value: string;
+    /** Placeholder text. */
+    placeholder?: string;
+    /** Renders the textarea as disabled. */
+    disabled: boolean;
+    /** Renders the textarea as readonly. */
+    readonly: boolean;
+    /** The textarea size. */
+    size: TsSize;
+    /** Label text displayed above the textarea. */
+    label?: string;
+    /** Help text displayed below the textarea. */
+    helpText?: string;
+    /** Renders the textarea in an error state. */
+    error: boolean;
+    /** Error message displayed below the textarea. */
+    errorMessage?: string;
+    /** Makes the textarea required. */
+    required: boolean;
+    /** Name attribute for form submission. */
+    name?: string;
+    /** Number of visible text rows. */
+    rows: number;
+    /** Resize behavior. */
+    resize: 'none' | 'vertical' | 'horizontal' | 'both';
+    /** Maximum character length. */
+    maxlength?: number;
+    /** Whether the textarea is currently focused. */
+    hasFocus: boolean;
+    /** Emitted on every keystroke. */
+    tsInput: EventEmitter<TsChangeEventDetail<string>>;
+    /** Emitted when the value changes (on blur / commit). */
+    tsChange: EventEmitter<TsChangeEventDetail<string>>;
+    /** Emitted when the textarea gains focus. */
+    tsFocus: EventEmitter<void>;
+    /** Emitted when the textarea loses focus. */
+    tsBlur: EventEmitter<void>;
+    handleValueChange(newValue: string, oldValue: string): void;
+    /** Programmatically focus the textarea. */
+    setFocus(): Promise<void>;
+    /** Programmatically select the textarea text. */
+    selectText(): Promise<void>;
+    private handleInput;
+    private handleChange;
+    private handleFocus;
+    private handleBlur;
+    render(): any;
+}

package/dist/types/components/textarea/textarea.stories.d.ts

@@ -0,0 +1,88 @@
+declare const _default: {
+    title: string;
+    tags: string[];
+    argTypes: {
+        value: {
+            control: string;
+            description: string;
+        };
+        placeholder: {
+            control: string;
+            description: string;
+        };
+        disabled: {
+            control: string;
+            description: string;
+        };
+        readonly: {
+            control: string;
+            description: string;
+        };
+        size: {
+            control: string;
+            options: string[];
+            description: string;
+        };
+        label: {
+            control: string;
+            description: string;
+        };
+        helpText: {
+            control: string;
+            description: string;
+        };
+        error: {
+            control: string;
+            description: string;
+        };
+        errorMessage: {
+            control: string;
+            description: string;
+        };
+        required: {
+            control: string;
+            description: string;
+        };
+        rows: {
+            control: string;
+            description: string;
+        };
+        resize: {
+            control: string;
+            options: string[];
+            description: string;
+        };
+        maxlength: {
+            control: string;
+            description: string;
+        };
+        name: {
+            control: string;
+            description: string;
+        };
+    };
+};
+export default _default;
+export declare const Default: ((args: Record<string, unknown>) => string) & {
+    args: Record<string, unknown>;
+} & {
+    args: {
+        value: string;
+        placeholder: string;
+        disabled: boolean;
+        readonly: boolean;
+        size: string;
+        label: string;
+        helpText: string;
+        error: boolean;
+        errorMessage: string;
+        required: boolean;
+        rows: number;
+        resize: string;
+        name: string;
+    };
+};
+export declare const Sizes: () => string;
+export declare const States: () => string;
+export declare const ResizeBehaviors: () => string;
+export declare const FeedbackForm: () => string;

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

@@ -0,0 +1,42 @@
+import type { EventEmitter } from '../../stencil-public-runtime';
+type TsToastVariant = 'info' | 'success' | 'warning' | 'danger' | 'neutral';
+type TsToastPosition = 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left' | 'top-center' | 'bottom-center';
+/**
+ * @slot - Default slot for message content.
+ * @slot action - Optional action button.
+ *
+ * @part base - The toast container.
+ * @part icon - The variant icon wrapper.
+ * @part message - The message wrapper.
+ * @part action - The action slot wrapper.
+ * @part close - The close button.
+ */
+export declare class TsToast {
+    private autoCloseTimer?;
+    /** The toast's visual variant. */
+    variant: TsToastVariant;
+    /** Auto-dismiss duration in ms. Set 0 to disable. */
+    duration: number;
+    /** Whether the toast shows a close button. */
+    dismissible: boolean;
+    /** Whether the toast is visible. */
+    open: boolean;
+    /** Position of the toast on screen. */
+    position: TsToastPosition;
+    /** Emitted when the toast is dismissed. */
+    tsClose: EventEmitter<void>;
+    isVisible: boolean;
+    handleOpenChange(newValue: boolean): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    /** Programmatically close the toast. */
+    close(): Promise<void>;
+    /** Programmatically show the toast. */
+    show(): Promise<void>;
+    private startAutoClose;
+    private clearAutoClose;
+    private handleClose;
+    private renderIcon;
+    render(): any;
+}
+export {};

package/dist/types/components/toast/toast.stories.d.ts

@@ -0,0 +1,48 @@
+declare const _default: {
+    title: string;
+    tags: string[];
+    argTypes: {
+        variant: {
+            control: string;
+            options: string[];
+            description: string;
+        };
+        duration: {
+            control: string;
+            description: string;
+        };
+        dismissible: {
+            control: string;
+            description: string;
+        };
+        open: {
+            control: string;
+            description: string;
+        };
+        position: {
+            control: string;
+            options: string[];
+            description: string;
+        };
+        slotContent: {
+            control: string;
+            description: string;
+        };
+    };
+};
+export default _default;
+export declare const Default: ((args: Record<string, unknown>) => string) & {
+    args: Record<string, unknown>;
+} & {
+    args: {
+        variant: string;
+        duration: number;
+        dismissible: boolean;
+        open: boolean;
+        position: string;
+        slotContent: string;
+    };
+};
+export declare const Variants: () => string;
+export declare const States: () => string;
+export declare const Composition: () => string;

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

@@ -0,0 +1,31 @@
+import type { EventEmitter } from '../../stencil-public-runtime';
+import type { TsSize, TsToggleEventDetail } from '../../types';
+/**
+ * @slot - Default slot for the toggle label.
+ *
+ * @part base - The toggle container.
+ * @part track - The toggle track.
+ * @part thumb - The toggle thumb/knob.
+ * @part label - The label wrapper.
+ */
+export declare class TsToggle {
+    hostEl: HTMLElement;
+    private inputId;
+    /** Whether the toggle is checked. */
+    checked: boolean;
+    /** The toggle's size. */
+    size: TsSize;
+    /** Renders the toggle as disabled. */
+    disabled: boolean;
+    /** Name for form submission. */
+    name?: string;
+    /** Value for form submission. */
+    value?: string;
+    /** Emitted when the toggle state changes. */
+    tsChange: EventEmitter<TsToggleEventDetail>;
+    /** Programmatically toggle the checked state. */
+    toggle(): Promise<void>;
+    private handleClick;
+    private handleKeydown;
+    render(): any;
+}

package/dist/types/components/toggle/toggle.stories.d.ts

@@ -0,0 +1,46 @@
+declare const _default: {
+    title: string;
+    tags: string[];
+    argTypes: {
+        checked: {
+            control: string;
+            description: string;
+        };
+        size: {
+            control: string;
+            options: string[];
+            description: string;
+        };
+        disabled: {
+            control: string;
+            description: string;
+        };
+        name: {
+            control: string;
+            description: string;
+        };
+        value: {
+            control: string;
+            description: string;
+        };
+        slotContent: {
+            control: string;
+            description: string;
+        };
+    };
+};
+export default _default;
+export declare const Default: ((args: Record<string, unknown>) => string) & {
+    args: Record<string, unknown>;
+} & {
+    args: {
+        checked: boolean;
+        size: string;
+        disabled: boolean;
+        slotContent: string;
+    };
+};
+export declare const Sizes: () => string;
+export declare const States: () => string;
+export declare const WithIcons: () => string;
+export declare const Composition: () => string;

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

@@ -0,0 +1,18 @@
+import type { TsSize } from '../../types';
+/**
+ * @slot - Default slot for toolbar items (center).
+ * @slot start - Left/start-aligned items.
+ * @slot end - Right/end-aligned items.
+ *
+ * @part base - The toolbar container.
+ * @part start - The start slot wrapper.
+ * @part center - The center/default slot wrapper.
+ * @part end - The end slot wrapper.
+ */
+export declare class TsToolbar {
+    /** The toolbar variant style. */
+    variant: 'default' | 'bordered' | 'elevated';
+    /** The toolbar size. */
+    size: TsSize;
+    render(): any;
+}

package/dist/types/components/toolbar/toolbar.stories.d.ts

@@ -0,0 +1,28 @@
+declare const _default: {
+    title: string;
+    tags: string[];
+    argTypes: {
+        variant: {
+            control: string;
+            options: string[];
+            description: string;
+        };
+        size: {
+            control: string;
+            options: string[];
+            description: string;
+        };
+    };
+};
+export default _default;
+export declare const Default: ((args: Record<string, unknown>) => string) & {
+    args: Record<string, unknown>;
+} & {
+    args: {
+        variant: string;
+        size: string;
+    };
+};
+export declare const Variants: () => string;
+export declare const Sizes: () => string;
+export declare const Composition: () => string;

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

@@ -0,0 +1,36 @@
+import type { TsPlacement } from '../../types';
+/**
+ * @slot - Default slot for the trigger element.
+ *
+ * @part base - The tooltip popup container.
+ * @part arrow - The tooltip arrow element.
+ */
+export declare class TsTooltip {
+    hostEl: HTMLElement;
+    private tooltipId;
+    /** The tooltip text content. */
+    content: string;
+    /** Placement of the tooltip relative to the trigger. */
+    placement: TsPlacement;
+    /** Delay in ms before showing the tooltip. */
+    showDelay: number;
+    /** Delay in ms before hiding the tooltip. */
+    hideDelay: number;
+    /** Disables the tooltip. */
+    disabled: boolean;
+    /** Whether the tooltip is currently visible. */
+    isVisible: boolean;
+    private showTimeout?;
+    private hideTimeout?;
+    /** Programmatically show the tooltip. */
+    show(): Promise<void>;
+    /** Programmatically hide the tooltip. */
+    hide(): Promise<void>;
+    disconnectedCallback(): void;
+    private handleMouseEnter;
+    private handleMouseLeave;
+    private handleFocusIn;
+    private handleFocusOut;
+    private handleKeydown;
+    render(): any;
+}

package/dist/types/components/tooltip/tooltip.stories.d.ts

@@ -0,0 +1,43 @@
+declare const _default: {
+    title: string;
+    tags: string[];
+    argTypes: {
+        content: {
+            control: string;
+            description: string;
+        };
+        placement: {
+            control: string;
+            options: string[];
+            description: string;
+        };
+        showDelay: {
+            control: string;
+            description: string;
+        };
+        hideDelay: {
+            control: string;
+            description: string;
+        };
+        disabled: {
+            control: string;
+            description: string;
+        };
+    };
+};
+export default _default;
+export declare const Default: ((args: Record<string, unknown>) => string) & {
+    args: Record<string, unknown>;
+} & {
+    args: {
+        content: string;
+        placement: string;
+        showDelay: number;
+        hideDelay: number;
+        disabled: boolean;
+    };
+};
+export declare const Placements: () => string;
+export declare const States: () => string;
+export declare const WithIcons: () => string;
+export declare const Composition: () => string;

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

@@ -0,0 +1,42 @@
+import type { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * @slot - Default slot for nested ts-tree-item children.
+ * @slot label - Custom label content.
+ *
+ * @part base - The tree item container.
+ * @part label - The label wrapper.
+ * @part chevron - The expand/collapse chevron.
+ * @part icon - The icon wrapper.
+ */
+export declare class TsTreeItem {
+    hostEl: HTMLElement;
+    /** The item label. */
+    label?: string;
+    /** Whether the item is expanded (has children). */
+    expanded: boolean;
+    /** Whether the item is selected. */
+    selected: boolean;
+    /** Whether the item is disabled. */
+    disabled: boolean;
+    /** Optional Lucide icon name. */
+    icon?: string;
+    /** Whether this item has slotted children (expandable). */
+    hasChildren: boolean;
+    /** Emitted when expand/collapse is toggled. */
+    tsToggle: EventEmitter<{
+        expanded: boolean;
+    }>;
+    /** Emitted when the item is selected. */
+    tsSelect: EventEmitter<{
+        selected: boolean;
+        value: string;
+    }>;
+    onExpandedChange(): void;
+    componentDidLoad(): void;
+    private checkForChildren;
+    private handleToggle;
+    private handleSelect;
+    private handleKeyDown;
+    private handleSlotChange;
+    render(): any;
+}

package/dist/types/components/tree/tree-item.stories.d.ts

@@ -0,0 +1,5 @@
+declare const _default: {
+    title: string;
+    tags: string[];
+};
+export default _default;

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

@@ -0,0 +1,13 @@
+/**
+ * @slot - Default slot for ts-tree-item children.
+ *
+ * @part base - The tree container.
+ */
+export declare class TsTree {
+    hostEl: HTMLElement;
+    /** Enable item selection mode. */
+    selectable: boolean;
+    handleKeyDown(event: KeyboardEvent): void;
+    private getVisibleItems;
+    render(): any;
+}

package/dist/types/components/tree/tree.stories.d.ts

@@ -0,0 +1,21 @@
+declare const _default: {
+    title: string;
+    tags: string[];
+    argTypes: {
+        selectable: {
+            control: string;
+            description: string;
+        };
+    };
+};
+export default _default;
+export declare const Default: ((args: Record<string, unknown>) => string) & {
+    args: Record<string, unknown>;
+} & {
+    args: {
+        selectable: boolean;
+    };
+};
+export declare const States: () => string;
+export declare const Variants: () => string;
+export declare const Composition: () => string;