@nectary/components 2.12.1 → 2.12.2

package/lib/esm/input/types.d.ts

@@ -0,0 +1,86 @@
+import type { TSinchElementReact } from '../types';
+import type { TSinchSize } from '../utils/size';
+export type TSinchInputType = 'text' | 'password' | 'number';
+export type TSinchInputClipboardEvent = CustomEvent<{
+    value: string;
+    replaceWith: (value: string) => void;
+}>;
+export type TSinchInputElement = HTMLElement & {
+    /** Text field type, `text` by default */
+    type: TSinchInputType;
+    /** Value */
+    value: string;
+    /** Mask */
+    mask: string | null;
+    /** Text that appears in the text field when it has no value set */
+    placeholder: string | null;
+    /** The HTML autocomplete attribute */
+    autocomplete: string;
+    /** Invalid state */
+    invalid: boolean;
+    /** Disabled */
+    disabled: boolean;
+    /** Whether the input should be autocofused */
+    autofocus: boolean;
+    /** Size, `m` by default */
+    size: TSinchSize;
+    selectionStart: number | null;
+    selectionEnd: number | null;
+    selectionDirection: 'forward' | 'backward' | 'none' | null;
+    setSelectionRange(selectionStart: number, selectionEnd: number): void;
+    /** Change value event */
+    addEventListener(type: '-change', listener: (e: CustomEvent<string>) => void): void;
+    /** Focus event */
+    addEventListener(type: '-focus', listener: (e: CustomEvent<void>) => void): void;
+    /** Blur event */
+    addEventListener(type: '-blur', listener: (e: CustomEvent<void>) => void): void;
+    /** Text field type, `text` by default */
+    setAttribute(name: 'type', value: TSinchInputType): void;
+    /** Value */
+    setAttribute(name: 'value', value: string): void;
+    /** Mask */
+    setAttribute(name: 'mask', value: string): void;
+    /** Text that appears in the text field when it has no value set */
+    setAttribute(name: 'placeholder', value: string): void;
+    /** The HTML autocomplete attribute */
+    setAttribute(name: 'autocomplete', value: string): void;
+    /** Invalid state */
+    setAttribute(name: 'invalid', value: ''): void;
+    /** Disabled */
+    setAttribute(name: 'disabled', value: ''): void;
+    /** Autofocus */
+    setAttribute(name: 'autofocus', value: ''): void;
+    /** Size, `m` by default */
+    setAttribute(name: 'size', value: TSinchSize): void;
+};
+export type TSinchInputReact = TSinchElementReact<TSinchInputElement> & {
+    /** Controlled value, doesn't change on its own and requres an onChange-value state loop */
+    value: string;
+    /** Mask */
+    mask?: string;
+    /** Label that is used for a11y – might be different from `label` */
+    'aria-label': string;
+    /** Text field type, `text` by default */
+    type?: TSinchInputType;
+    /** The HTML autocomplete attribute */
+    autocomplete?: string;
+    /** Text that appears in the text field when it has no value set */
+    placeholder?: string;
+    /** Invalid state */
+    invalid?: boolean;
+    /** Disabled */
+    disabled?: boolean;
+    /** Autofocus */
+    autofocus?: boolean;
+    /** Size, `m` by default */
+    size?: TSinchSize;
+    /** Change value handler */
+    'on-change'?: (e: CustomEvent<string>) => void;
+    /** Focus handler */
+    'on-focus'?: (e: CustomEvent<void>) => void;
+    /** Blur handler */
+    'on-blur'?: (e: CustomEvent<void>) => void;
+    'on-cut'?: (e: TSinchInputClipboardEvent) => void;
+    'on-copy'?: (e: TSinchInputClipboardEvent) => void;
+    'on-paste'?: (e: TSinchInputClipboardEvent) => void;
+};

package/lib/esm/input/utils.d.ts

@@ -0,0 +1,26 @@
+import type { TSinchInputType } from './types';
+type TSInchInputMaskSymbolModeDigit = 0;
+type TSInchInputMaskSymbolModeLetter = 1;
+type TSInchInputMaskSymbolModeExact = 2;
+type TSinchInputMaskSymbol = {
+    value: string;
+    mode: TSInchInputMaskSymbolModeDigit | TSInchInputMaskSymbolModeLetter | TSInchInputMaskSymbolModeExact;
+    placeholder: string;
+};
+type TSinchMaskInputResult = {
+    value: string;
+    placeholder: string;
+    cursorPos: number;
+    mergedValue: string;
+};
+export declare const inputTypes: readonly TSinchInputType[];
+export declare const getMaskSymbols: (maskValue: string) => TSinchInputMaskSymbol[];
+export declare const deleteContentBackward: (inputValue: string, maskSymbols: readonly TSinchInputMaskSymbol[], selectionStart: number, selectionEnd: number) => TSinchMaskInputResult | null;
+export declare const deleteContentForward: (inputValue: string, maskSymbols: readonly TSinchInputMaskSymbol[], selectionStart: number, selectionEnd: number) => TSinchMaskInputResult | null;
+export declare const beginMaskedComposition: (inputValue: string, maskSymbols: readonly TSinchInputMaskSymbol[], selectionStart: number) => Pick<TSinchMaskInputResult, 'value' | 'placeholder'>;
+export declare const endMaskedComposition: (inputValue: string, data: string, maskSymbols: readonly TSinchInputMaskSymbol[], selectionStart: number, wasValueInserted: boolean) => TSinchMaskInputResult | null;
+export declare const insertText: (inputValue: string, data: string, maskSymbols: readonly TSinchInputMaskSymbol[], selectionStart: number, selectionEnd: number) => TSinchMaskInputResult | null;
+export declare const insertFromPaste: (inputValue: string, data: string, maskSymbols: readonly TSinchInputMaskSymbol[], selectionStart: number, selectionEnd: number) => TSinchMaskInputResult | null;
+export declare const splitValueAndMask: (inputValue: string, maskSymbols: readonly TSinchInputMaskSymbol[]) => TSinchMaskInputResult;
+export declare const getMergedValueSliced: (inputValue: string, maskSymbols: readonly TSinchInputMaskSymbol[], selectionStart: number, selectionEnd: number) => string;
+export {};

package/lib/esm/link/index.d.ts

@@ -0,0 +1,12 @@
+import '../icon';
+import type { TSinchLinkElement, TSinchLinkReact } from './types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-link': TSinchLinkReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-link': TSinchLinkElement;
+    }
+}

package/lib/esm/link/types.d.ts

@@ -0,0 +1,59 @@
+import type { TSinchElementReact } from '../types';
+export type TSinchLinkElement = HTMLElement & {
+    /** Text content of hyperlink */
+    text: string;
+    /** URL that hyperlink point to */
+    href: string;
+    /** Disabled */
+    disabled: boolean;
+    /** Replaces the anchor tag behaviour to use history instead */
+    'use-history': boolean;
+    /** Sets `target="_blank" and a special external icon on the left side */
+    external: boolean;
+    /** Special standalone (`display: block`) mode with an arrow icon on the right side */
+    standalone: boolean;
+    /** Prevents default behaviour on hyperlink click */
+    preventDefault: boolean;
+    /** Click event */
+    addEventListener(type: '-click', listener: (e: CustomEvent<void>) => void): void;
+    /** Focus event */
+    addEventListener(type: '-focus', listener: (e: CustomEvent<void>) => void): void;
+    /** Blur event */
+    addEventListener(type: '-blur', listener: (e: CustomEvent<void>) => void): void;
+    /** Text content of hyperlink */
+    setAttribute(name: 'text', value: string): void;
+    /** URL that hyperlink point to */
+    setAttribute(name: 'href', value: string): void;
+    /** Disabled */
+    setAttribute(name: 'disabled', value: ''): void;
+    /** Sets `target="_blank" and a special external icon on the left side */
+    setAttribute(name: 'external', value: ''): void;
+    /** Special standalone (`display: block`) mode with an arrow icon on the right side */
+    setAttribute(name: 'standalone', value: ''): void;
+    /** Prevents default behaviour on hyperlink click */
+    setAttribute(name: 'preventdefault', value: ''): void;
+};
+export type TSinchLinkReact = TSinchElementReact<TSinchLinkElement> & {
+    /** Text content of hyperlink */
+    text: string;
+    /** URL that hyperlink point to */
+    href: string;
+    /** Replaces the anchor tag behaviour to use history instead */
+    'use-history'?: boolean;
+    /** Disabled */
+    disabled?: boolean;
+    /** Sets `target="_blank" and a special external icon on the left side */
+    external?: boolean;
+    /** Special standalone (`display: block`) mode with an arrow icon on the right side */
+    standalone?: boolean;
+    /** Prevents default behaviour on hyperlink click */
+    preventDefault?: boolean;
+    /** Label that is used for a11y – might be different from `text` */
+    'aria-label': string;
+    /** Click even handler */
+    'on-click'?: (e: CustomEvent<void>) => void;
+    /** Focus even handler */
+    'on-focus'?: (e: CustomEvent<void>) => void;
+    /** Blur even handler */
+    'on-blur'?: (e: CustomEvent<void>) => void;
+};

package/lib/esm/list/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchListElement, TSinchListReact } from './types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-list': TSinchListReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-list': TSinchListElement;
+    }
+}

package/lib/esm/list/types.d.ts

@@ -0,0 +1,3 @@
+import type { TSinchElementReact } from '../types';
+export type TSinchListElement = HTMLElement;
+export type TSinchListReact = TSinchElementReact<TSinchListElement>;

package/lib/esm/list-item/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchListItemElement, TSinchListItemReact } from './types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-list-item': TSinchListItemReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-list-item': TSinchListItemElement;
+    }
+}

package/lib/esm/list-item/types.d.ts

@@ -0,0 +1,3 @@
+import type { TSinchElementReact } from '../types';
+export type TSinchListItemElement = HTMLElement;
+export type TSinchListItemReact = TSinchElementReact<TSinchListItemElement>;

package/lib/esm/pagination/index.d.ts

@@ -0,0 +1,12 @@
+import '../icon';
+import type { TSinchPaginationElement, TSinchPaginationReact } from './types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-pagination': TSinchPaginationReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-pagination': TSinchPaginationElement;
+    }
+}

package/lib/esm/pagination/types.d.ts

@@ -0,0 +1,16 @@
+import type { TRect, TSinchElementReact } from '../types';
+export type TSinchPaginationElement = HTMLElement & {
+    value: number;
+    max: number;
+    readonly prevButtonRect: TRect;
+    readonly nextButtonRect: TRect;
+    nthButtonRect(index: number): TRect | null;
+    addEventListener(type: '-change', listener: (e: CustomEvent<number>) => void): void;
+    setAttribute(name: 'value', value: string): void;
+    setAttribute(name: 'max', value: string): void;
+};
+export type TSinchPaginationReact = TSinchElementReact<TSinchPaginationElement> & {
+    value: number;
+    max: number;
+    'on-change': (e: CustomEvent<number>) => void;
+};

package/lib/esm/pop/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchPopElement, TSinchPopReact } from './types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-pop': TSinchPopReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-pop': TSinchPopElement;
+    }
+}

package/lib/esm/pop/types.d.ts

@@ -0,0 +1,35 @@
+import type { TRect, TSinchElementReact } from '../types';
+export type TSinchPopOrientation = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'bottom-center' | 'bottom-stretch' | 'top-center' | 'top-stretch' | 'center-right' | 'center-left';
+export type TSinchPopElement = HTMLElement & {
+    /** Open/close state */
+    open: boolean;
+    /** Orientation, where it *points to* from origin */
+    orientation: TSinchPopOrientation;
+    /** Modal/non-modal mode */
+    modal: boolean;
+    inset: number;
+    readonly footprintRect: TRect;
+    readonly popoverRect: TRect;
+    /** Close event */
+    addEventListener(type: '-close', listener: (e: CustomEvent<void>) => void): void;
+    /** Open/close state */
+    setAttribute(name: 'open', value: ''): void;
+    /** Orientation, where it *points to* from origin */
+    setAttribute(name: 'orientation', value: TSinchPopOrientation): void;
+    /** Modal/non-modal mode */
+    setAttribute(name: 'modal', value: boolean): void;
+    setAttribute(name: 'inset', value: string): void;
+};
+export type TSinchPopReact = TSinchElementReact<TSinchPopElement> & {
+    /** Open/close state */
+    open: boolean;
+    /** Orientation, where it *points to* from origin */
+    orientation: TSinchPopOrientation;
+    /** Modal/non-modal mode */
+    modal?: boolean;
+    inset?: number;
+    /** Label that is used for a11y */
+    'aria-label': string;
+    /** Close event handler */
+    'on-close'?: (e: CustomEvent<void>) => void;
+};

package/lib/esm/pop/utils.d.ts

@@ -0,0 +1,4 @@
+import type { TSinchPopOrientation } from './types';
+export declare const orientationValues: readonly TSinchPopOrientation[];
+export declare const disableOverscroll: () => void;
+export declare const enableOverscroll: () => void;

package/lib/esm/popover/index.d.ts

@@ -0,0 +1,12 @@
+import '../pop';
+import type { TSinchPopoverElement, TSinchPopoverReact } from './types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-popover': TSinchPopoverReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-popover': TSinchPopoverElement;
+    }
+}

package/lib/esm/popover/types.d.ts

@@ -0,0 +1,38 @@
+import type { TRect, TSinchElementReact } from '../types';
+export type TSinchPopoverOrientation = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'bottom' | 'top';
+export type TSinchPopoverElement = HTMLElement & {
+    /** Open/close state */
+    open: boolean;
+    /** Orientation, where it *points to* from origin */
+    orientation: TSinchPopoverOrientation;
+    /** Modal/non-modal mode */
+    modal: boolean;
+    /** Show tip */
+    tip: boolean;
+    readonly footprintRect: TRect;
+    readonly popoverRect: TRect;
+    /** Close event */
+    addEventListener(type: '-close', listener: (e: CustomEvent<void>) => void): void;
+    /** Open/close state */
+    setAttribute(name: 'open', value: ''): void;
+    /** Orientation, where it *points to* from origin */
+    setAttribute(name: 'orientation', value: TSinchPopoverOrientation): void;
+    /** Modal/non-modal mode */
+    setAttribute(name: 'modal', value: ''): void;
+    /** Show tip */
+    setAttribute(name: 'tip', value: ''): void;
+};
+export type TSinchPopoverReact = TSinchElementReact<TSinchPopoverElement> & {
+    /** Open/close state */
+    open: boolean;
+    /** Orientation, where it *points to* from origin */
+    orientation?: TSinchPopoverOrientation;
+    /** Modal/non-modal mode */
+    modal?: boolean;
+    /** Show tip */
+    tip?: boolean;
+    /** Label that is used for a11y */
+    'aria-label': string;
+    /** Close event handler */
+    'on-close'?: (e: CustomEvent<void>) => void;
+};

package/lib/esm/popover/utils.d.ts

@@ -0,0 +1,4 @@
+import type { TSinchPopoverOrientation } from './types';
+import type { TSinchPopOrientation } from '../pop/types';
+export declare const orientationValues: readonly TSinchPopoverOrientation[];
+export declare const getPopOrientation: (orientation: TSinchPopoverOrientation) => TSinchPopOrientation;

package/lib/esm/progress/index.d.ts

@@ -0,0 +1,12 @@
+import '../text';
+import type { TSinchProgressElement, TSinchProgressReact } from './types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-progress': TSinchProgressReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-progress': TSinchProgressElement;
+    }
+}

package/lib/esm/progress/types.d.ts

@@ -0,0 +1,12 @@
+import type { TSinchElementReact } from '../types';
+export type TSinchProgressElement = HTMLElement & {
+    value: number;
+    detailed: boolean;
+    setAttribute(name: 'value', value: string): void;
+    setAttribute(name: 'detailed', value: ''): void;
+};
+export type TSinchProgressReact = TSinchElementReact<TSinchProgressElement> & {
+    value: number;
+    detailed?: boolean;
+    'aria-label': string;
+};

package/lib/esm/progress-stepper/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchProgressStepperElement, TSinchProgressStepperReact } from './types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-progress-stepper': TSinchProgressStepperReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-progress-stepper': TSinchProgressStepperElement;
+    }
+}

package/lib/esm/progress-stepper/types.d.ts

@@ -0,0 +1,22 @@
+import type { TRect, TSinchElementReact } from '../types';
+export type TSinchProgressStepperElement = HTMLElement & {
+    /** Current selected item value */
+    value: string;
+    /** Current progress value */
+    progressValue: string;
+    nthOptionRect(index: number): TRect | null;
+    /** Change value event */
+    addEventListener(type: '-change', listener: (e: CustomEvent<string>) => void): void;
+    /** Current selected item value */
+    setAttribute(name: 'value', value: string): void;
+    /** Current progress value */
+    setAttribute(name: 'progressvalue', value: string): void;
+};
+export type TSinchProgressStepperReact = TSinchElementReact<TSinchProgressStepperElement> & {
+    /** Current selected item value */
+    value: string;
+    /** Current progress value */
+    progressValue: string;
+    /** Change selected value event */
+    'on-change'?: (e: CustomEvent<string>) => void;
+};

package/lib/esm/progress-stepper-item/index.d.ts

@@ -0,0 +1,12 @@
+import '../text';
+import type { TSinchProgressStepperItemElement, TSinchProgressStepperItemReact } from './types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-progress-stepper-item': TSinchProgressStepperItemReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-progress-stepper-item': TSinchProgressStepperItemElement;
+    }
+}

package/lib/esm/progress-stepper-item/types.d.ts

@@ -0,0 +1,23 @@
+import type { TSinchElementReact } from '../types';
+export type TSinchProgressStepperItemElement = HTMLElement & {
+    /** Value */
+    value: string;
+    /** Text */
+    text: string;
+    /** Invalid */
+    invalid: boolean;
+    /** Value */
+    setAttribute(name: 'value', value: string): void;
+    /** Text */
+    setAttribute(name: 'text', value: string): void;
+    /** Invalid */
+    setAttribute(name: 'invalid', value: ''): void;
+};
+export type TSinchProgressStepperItemReact = TSinchElementReact<TSinchProgressStepperItemElement> & {
+    /** Value */
+    value: string;
+    /** Text */
+    text: string;
+    /** Invalid */
+    invalid?: boolean;
+};

package/lib/esm/progress-stepper-item/utils.d.ts

@@ -0,0 +1,11 @@
+type TSinchProgressStepperItemStatus = 'inactive' | 'incomplete' | 'invalid' | 'complete';
+export declare const ATTR_PROGRESS_STEPPER_ITEM_CHECKED = "data-checked";
+export declare const ATTR_PROGRESS_STEPPER_ITEM_STATUS = "data-status";
+export declare const ATTR_PROGRESS_STEPPER_ITEM_ACTIVE_DESCENDANT = "data-active-descendant";
+export declare const isProgressStepperItemChecked: ($el: Element) => boolean;
+export declare const setProgressStepperItemChecked: ($el: Element, isChecked: boolean) => void;
+export declare const isProgressStepperItemActive: ($el: Element) => boolean;
+export declare const setProgressStepperItemStatus: ($el: Element, status: TSinchProgressStepperItemStatus) => void;
+export declare const isProgressStepperItemActiveDescendant: ($el: Element) => boolean;
+export declare const setProgressStepperItemActiveDescendant: ($el: Element, isActiveDescendant: boolean) => void;
+export {};

package/lib/esm/radio/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchRadioElement, TSinchRadioReact } from './types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-radio': TSinchRadioReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-radio': TSinchRadioElement;
+    }
+}

package/lib/esm/radio/types.d.ts

@@ -0,0 +1,14 @@
+import type { TSinchElementReact } from '../types';
+export type TSinchRadioElement = HTMLElement & {
+    value: string;
+    invalid: boolean;
+    addEventListener(type: '-change', listener: (e: CustomEvent<boolean>) => void): void;
+    setAttribute(name: 'value', value: string): void;
+    setAttribute(name: 'invalid', value: ''): void;
+};
+export type TSinchRadioReact = TSinchElementReact<TSinchRadioElement> & {
+    value: string;
+    invalid?: boolean;
+    'aria-label': string;
+    'on-change'?: (e: CustomEvent<string>) => void;
+};

package/lib/esm/radio-option/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchRadioOptionElement, TSinchRadioOptionReact } from './types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-radio-option': TSinchRadioOptionReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-radio-option': TSinchRadioOptionElement;
+    }
+}

package/lib/esm/radio-option/types.d.ts

@@ -0,0 +1,18 @@
+import type { TSinchElementReact } from '../types';
+export type TSinchRadioOptionElement = HTMLElement & {
+    value: string;
+    checked: boolean;
+    disabled: boolean;
+    text: string;
+    setAttribute(name: 'value', value: string): void;
+    setAttribute(name: 'checked', value: ''): void;
+    setAttribute(name: 'disabled', value: ''): void;
+    setAttribute(name: 'text', value: string): void;
+};
+export type TSinchRadioOptionReact = TSinchElementReact<TSinchRadioOptionElement> & {
+    value: string;
+    checked?: boolean;
+    disabled?: boolean;
+    text: string;
+    'aria-label': string;
+};

package/lib/esm/rich-text/index.d.ts

@@ -0,0 +1,14 @@
+import '../emoji';
+import '../code-tag';
+import '../link';
+import type { TSinchRichTextElement, TSinchRichTextReact } from './types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-rich-text': TSinchRichTextReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-rich-text': TSinchRichTextElement;
+    }
+}

package/lib/esm/rich-text/types.d.ts

@@ -0,0 +1,12 @@
+import type { TSinchTextType } from '../text/types';
+import type { TSinchElementReact } from '../types';
+export type TSinchRichTextElement = HTMLElement & {
+    size: TSinchTextType;
+    text: string;
+    setAttribute(name: 'size', value: TSinchTextType): void;
+    setAttribute(name: 'text', value: string): void;
+};
+export type TSinchRichTextReact = TSinchElementReact<TSinchRichTextElement> & {
+    size?: TSinchTextType;
+    text: string;
+};

package/lib/esm/rich-text/utils.d.ts

@@ -0,0 +1,7 @@
+import type { TSinchTextType } from '../text/types';
+import type { TMarkdownParseVisitor } from '../utils';
+export declare const sizeValues: readonly TSinchTextType[];
+export declare const createParseVisitor: (doc: Document) => {
+    updateEmojiBaseUrl(url: string | null): void;
+    createVisitor(): TMarkdownParseVisitor;
+};

package/lib/esm/rich-textarea/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchRichTextareaElement, TSinchRichTextareaReact } from './types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-rich-textarea': TSinchRichTextareaReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-rich-textarea': TSinchRichTextareaElement;
+    }
+}

package/lib/esm/rich-textarea/types.d.ts

@@ -0,0 +1,48 @@
+import type { TSinchElementReact } from '../types';
+export type TRichTextareaSelection = {
+    italic: boolean;
+    bold: boolean;
+    strikethrough: boolean;
+    codetag: boolean;
+    link: boolean;
+    ulist: boolean;
+    olist: boolean;
+};
+export type TSinchRichTextareaElement = HTMLElement & {
+    /** Value */
+    value: string;
+    /** Text that appears in the text field when it has no value set */
+    placeholder: string | null;
+    insertText(value: string): void;
+    insertLink(text: string, href: string): void;
+    formatItalic(): void;
+    formatBold(): void;
+    formatStrikethrough(): void;
+    formatCodeTag(): void;
+    formatOrderedList(): void;
+    formatUnorderedList(): void;
+    /** Change value event */
+    addEventListener(type: '-change', listener: (e: CustomEvent<string>) => void): void;
+    /** Focus event */
+    addEventListener(type: '-focus', listener: (e: CustomEvent<void>) => void): void;
+    /** Blur event */
+    addEventListener(type: '-blur', listener: (e: CustomEvent<void>) => void): void;
+    addEventListener(type: '-selection', listener: (e: CustomEvent<TRichTextareaSelection>) => void): void;
+    /** Value */
+    setAttribute(name: 'value', value: string): void;
+    /** Text that appears in the text field when it has no value set */
+    setAttribute(name: 'placeholder', value: string): void;
+};
+export type TSinchRichTextareaReact = TSinchElementReact<TSinchRichTextareaElement> & {
+    /** Value */
+    value: string;
+    /** Text that appears in the text field when it has no value set */
+    placeholder?: string;
+    'aria-label': string;
+    /** Change value handler */
+    'on-change'?: (e: CustomEvent<string>) => void;
+    /** Focus handler */
+    'on-focus'?: (e: CustomEvent<void>) => void;
+    /** Blur handler */
+    'on-blur'?: (e: CustomEvent<void>) => void;
+};