@deskhero/dh_ui 2.49.1 → 2.49.8

package/README.md

@@ -1,100 +1,100 @@
-## Deskhero ui
-
-[Deskhero](https://www.deskhero.com) ui is component library, based on Deskhero design system and Vue 3.
-
-![npm version](https://img.shields.io/npm/v/@deskhero/dh_ui?color=success)
-
-<hr/>
-
-Preview the latest changes on [Chromatic](https://master--62ad76d1e03689594b024ea4.chromatic.com/)
-
-## Installation
-
-Install the component library
-
-```
-npm i @deskhero/dh_ui
-```
-
-## Usage
-
-You can import from the main bundle:
-
-```javascript
-import { DhIcon } from "@deskhero/dh_ui";
-```
-
-then on html:
-
-```javascript
-<dh-icon :icon-name="'search'" :size="24" />
-```
-
-You also need to import Main CSS file to your project
-
-```javascript
-import "@deskhero/dh_ui/dist/style.css";
-```
-
-## Storybook
-
-Storybook helps you build UI components in isolation from your app's business logic, data, and context. That makes it easy to develop hard-to-reach states. Save these UI states as stories to revisit during development, testing, or QA.
-
-We are using storybook in order to develop the components independently from any consumer.
-run this to build & run the storybook locally:
-
-First install the node packages:
-
-```bash
-npm install
-```
-
-then serve storybook application
-
-```bash
-npm run storybook
-```
-
-the storybook will be served on `http://localhost:6006`
-
-## Developing locally with your consumer application
-
-When developing locally we are using a npm functionality called npm link, this allows us to
-work locally on our package and use it in a different project without publishing.
-This functionality basically overrides the npm mapping between package name to its repo, and points it to where the package is located locally.
-
-From dh_ui
-
-```sh
-npm run build && npm link
-```
-
-Then on your project
-
-```sh
-npm link @deskhero/dh_ui
-```
-
-<hr/>
-
-### Recommended IDE Setup
-
-[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
-
-### Type Support for .vue Imports in TS
-
-TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types.
-
-If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps:
-
-1. Disable the built-in TypeScript Extension
-   1. Run `Extensions: Show Built-in Extensions` from VSCode's command palette
-   2. Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)`
-2. Reload the VSCode window by running `Developer: Reload Window` from the command palette.
-
-<hr/>
-
-### Types
-
-if your component use a specific model/type, please export it by adding it on the /src/models/index.ts.
-You can use the DropdownMenuItem as an example.
+## Deskhero ui
+
+[Deskhero](https://www.deskhero.com) ui is component library, based on Deskhero design system and Vue 3.
+
+![npm version](https://img.shields.io/npm/v/@deskhero/dh_ui?color=success)
+
+<hr/>
+
+Preview the latest changes on [Chromatic](https://master--62ad76d1e03689594b024ea4.chromatic.com/)
+
+## Installation
+
+Install the component library
+
+```
+npm i @deskhero/dh_ui
+```
+
+## Usage
+
+You can import from the main bundle:
+
+```javascript
+import { DhIcon } from "@deskhero/dh_ui";
+```
+
+then on html:
+
+```javascript
+<dh-icon :icon-name="'search'" :size="24" />
+```
+
+You also need to import Main CSS file to your project
+
+```javascript
+import "@deskhero/dh_ui/dist/style.css";
+```
+
+## Storybook
+
+Storybook helps you build UI components in isolation from your app's business logic, data, and context. That makes it easy to develop hard-to-reach states. Save these UI states as stories to revisit during development, testing, or QA.
+
+We are using storybook in order to develop the components independently from any consumer.
+run this to build & run the storybook locally:
+
+First install the node packages:
+
+```bash
+npm install
+```
+
+then serve storybook application
+
+```bash
+npm run storybook
+```
+
+the storybook will be served on `http://localhost:6006`
+
+## Developing locally with your consumer application
+
+When developing locally we are using a npm functionality called npm link, this allows us to
+work locally on our package and use it in a different project without publishing.
+This functionality basically overrides the npm mapping between package name to its repo, and points it to where the package is located locally.
+
+From dh_ui
+
+```sh
+npm run build && npm link
+```
+
+Then on your project
+
+```sh
+npm link @deskhero/dh_ui
+```
+
+<hr/>
+
+### Recommended IDE Setup
+
+[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
+
+### Type Support for .vue Imports in TS
+
+TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types.
+
+If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps:
+
+1. Disable the built-in TypeScript Extension
+   1. Run `Extensions: Show Built-in Extensions` from VSCode's command palette
+   2. Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)`
+2. Reload the VSCode window by running `Developer: Reload Window` from the command palette.
+
+<hr/>
+
+### Types
+
+if your component use a specific model/type, please export it by adding it on the /src/models/index.ts.
+You can use the DropdownMenuItem as an example.

package/dist/adapters/editorjs/EditorjsTransformer.d.ts

@@ -0,0 +1,3 @@
+import { SysContentRich } from "@/models/Editor.model";
+import { EditorTransformer } from "@/models/EditorTransformer";
+export declare const EditorjsTransformer: EditorTransformer<SysContentRich>;

package/dist/adapters/editorjs/EditorjsView.vue.d.ts

@@ -0,0 +1,72 @@
+import type { SysContentRich, SysAttachment } from "@/models/Editor.model";
+import { FileRegistration, UploadEventPayload } from "@/models/UploadedFile.model";
+declare const _default: import("vue").DefineComponent<{
+    data: {
+        type: import("vue").PropType<SysContentRich>;
+        required: true;
+    };
+    i18n: {
+        type: import("vue").PropType<import("@/models/Editor.model").EditorI18n>;
+    };
+    readOnly: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
+    };
+    fileUpload: {
+        type: import("vue").PropType<(e: UploadEventPayload) => void>;
+    };
+    attachments: {
+        type: import("vue").PropType<SysAttachment[]>;
+        required: true;
+    };
+    toolbarPosition: {
+        type: import("vue").PropType<"left" | "right">;
+        default: string;
+    };
+    suggestedReply: {
+        type: import("vue").PropType<SysContentRich>;
+    };
+}, {
+    acceptSuggestion: () => void;
+    isEmpty: () => Promise<boolean>;
+    registerFiles: (payload: FileRegistration) => void;
+    insertSignature: (payload: SysContentRich, att: SysAttachment[]) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:data": (value: SysContentRich) => void;
+    "update:attachments": (value: SysAttachment[]) => void;
+    "file-upload": (val: UploadEventPayload) => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    data: {
+        type: import("vue").PropType<SysContentRich>;
+        required: true;
+    };
+    i18n: {
+        type: import("vue").PropType<import("@/models/Editor.model").EditorI18n>;
+    };
+    readOnly: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
+    };
+    fileUpload: {
+        type: import("vue").PropType<(e: UploadEventPayload) => void>;
+    };
+    attachments: {
+        type: import("vue").PropType<SysAttachment[]>;
+        required: true;
+    };
+    toolbarPosition: {
+        type: import("vue").PropType<"left" | "right">;
+        default: string;
+    };
+    suggestedReply: {
+        type: import("vue").PropType<SysContentRich>;
+    };
+}>> & {
+    "onFile-upload"?: ((val: UploadEventPayload) => any) | undefined;
+    "onUpdate:data"?: ((value: SysContentRich) => any) | undefined;
+    "onUpdate:attachments"?: ((value: SysAttachment[]) => any) | undefined;
+}, {
+    readOnly: boolean;
+    toolbarPosition: "left" | "right";
+}, {}>;
+export default _default;

package/dist/adapters/tiptap/SimpleTemplate.vue.d.ts

@@ -0,0 +1,29 @@
+import type { EditorI18n } from "@/models/Editor.model";
+declare const _default: import("vue").DefineComponent<{
+    readOnly: {
+        type: import("vue").PropType<boolean>;
+    };
+    isOverlayVisible: {
+        type: import("vue").PropType<boolean>;
+    };
+    i18n: {
+        type: import("vue").PropType<EditorI18n>;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "accept-suggestion": () => void;
+    "dismiss-suggestion": () => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    readOnly: {
+        type: import("vue").PropType<boolean>;
+    };
+    isOverlayVisible: {
+        type: import("vue").PropType<boolean>;
+    };
+    i18n: {
+        type: import("vue").PropType<EditorI18n>;
+    };
+}>> & {
+    "onAccept-suggestion"?: (() => any) | undefined;
+    "onDismiss-suggestion"?: (() => any) | undefined;
+}, {}, {}>;
+export default _default;

package/dist/adapters/tiptap/TiptapAdapter.d.ts

@@ -0,0 +1,26 @@
+import type { EditorAdapter } from "@/models/EditorAdapter";
+import type { SysContentRich, SysAttachment } from "@/models/Editor.model";
+import type { FileRegistration, UploadEventPayload } from "@/models/UploadedFile.model";
+export declare class TiptapAdapter implements EditorAdapter {
+    private resolveReady;
+    ready: Promise<void>;
+    private makeReady;
+    constructor();
+    mount(): void;
+    destroy(): void;
+    getContent(): Promise<SysContentRich>;
+    setContent(data: SysContentRich, attachments: SysAttachment[]): Promise<void>;
+    clearContent(): Promise<void>;
+    onContentChange(cb: (data: SysContentRich) => void): void;
+    updateAttachments(attachments: SysAttachment[]): Promise<void>;
+    updateContent(data: SysContentRich): void;
+    onFileUpload(cb: (event: UploadEventPayload) => Promise<void>): void;
+    onAttachmentChange(cb: (attachments: SysAttachment[]) => void): void;
+    registerFiles(payload: FileRegistration): void;
+    toggleReadOnly(val: boolean): void;
+    isSignatureOnly(): Promise<boolean>;
+    insertSignature(payload: SysContentRich, _att: SysAttachment[]): Promise<void>;
+    isEmpty(): Promise<boolean>;
+    acceptSuggestion(): void;
+    setIsSuggestion(val: boolean): void;
+}

package/dist/adapters/tiptap/TiptapTransformer.d.ts

@@ -0,0 +1,3 @@
+import { EditorTransformer } from "@/models/EditorTransformer";
+import type { JSONContent } from "@tiptap/vue-3";
+export declare const TiptapTransformer: EditorTransformer<JSONContent>;

package/dist/adapters/tiptap/TiptapView.vue.d.ts

@@ -0,0 +1,73 @@
+import { SysAttachment } from "@/models/Editor.model";
+import { FileRegistration, UploadEventPayload } from "@/models/UploadedFile.model";
+import type { JSONContent } from "@tiptap/vue-3";
+declare const _default: import("vue").DefineComponent<{
+    data: {
+        type: import("vue").PropType<JSONContent>;
+        required: true;
+    };
+    i18n: {
+        type: import("vue").PropType<import("@/models/Editor.model").EditorI18n>;
+    };
+    readOnly: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
+    };
+    fileUpload: {
+        type: import("vue").PropType<(e: UploadEventPayload) => void>;
+    };
+    attachments: {
+        type: import("vue").PropType<SysAttachment[]>;
+        required: true;
+    };
+    toolbarPosition: {
+        type: import("vue").PropType<"left" | "right">;
+        default: string;
+    };
+    suggestedReply: {
+        type: import("vue").PropType<JSONContent>;
+    };
+}, {
+    acceptSuggestion: () => void;
+    registerFiles: (payload: FileRegistration) => void;
+    isEmpty: () => boolean;
+    insertSignature: (payload: JSONContent, att: SysAttachment[]) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:data": (value: JSONContent | JSONContent[] | undefined) => void;
+    "update:attachments": (value: SysAttachment[]) => void;
+    "file-upload": (val: UploadEventPayload) => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    data: {
+        type: import("vue").PropType<JSONContent>;
+        required: true;
+    };
+    i18n: {
+        type: import("vue").PropType<import("@/models/Editor.model").EditorI18n>;
+    };
+    readOnly: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
+    };
+    fileUpload: {
+        type: import("vue").PropType<(e: UploadEventPayload) => void>;
+    };
+    attachments: {
+        type: import("vue").PropType<SysAttachment[]>;
+        required: true;
+    };
+    toolbarPosition: {
+        type: import("vue").PropType<"left" | "right">;
+        default: string;
+    };
+    suggestedReply: {
+        type: import("vue").PropType<JSONContent>;
+    };
+}>> & {
+    "onFile-upload"?: ((val: UploadEventPayload) => any) | undefined;
+    "onUpdate:data"?: ((value: JSONContent | JSONContent[] | undefined) => any) | undefined;
+    "onUpdate:attachments"?: ((value: SysAttachment[]) => any) | undefined;
+}, {
+    readOnly: boolean;
+    toolbarPosition: "left" | "right";
+}, {}>;
+export default _default;

package/dist/adapters/tiptap/components/TextAlignButton.vue.d.ts

@@ -0,0 +1,12 @@
+declare const _default: import("vue").DefineComponent<{
+    align: {
+        type: import("vue").PropType<"center" | "left" | "right" | "justify">;
+        required: true;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    align: {
+        type: import("vue").PropType<"center" | "left" | "right" | "justify">;
+        required: true;
+    };
+}>>, {}, {}>;
+export default _default;

package/dist/adapters/tiptap/components/ToolbarGroup.vue.d.ts

@@ -0,0 +1,17 @@
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
+    class: {
+        type: import("vue").PropType<string>;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    class: {
+        type: import("vue").PropType<string>;
+    };
+}>>, {}, {}>, {
+    default?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/adapters/tiptap/components/button/ButtonGroup.vue.d.ts

@@ -0,0 +1,29 @@
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
+    class: {
+        type: import("vue").PropType<string>;
+    };
+    orientation: {
+        type: import("vue").PropType<"vertical" | "horizontal">;
+    };
+    role: {
+        type: import("vue").PropType<string>;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    class: {
+        type: import("vue").PropType<string>;
+    };
+    orientation: {
+        type: import("vue").PropType<"vertical" | "horizontal">;
+    };
+    role: {
+        type: import("vue").PropType<string>;
+    };
+}>>, {}, {}>, {
+    default?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/adapters/tiptap/components/tiptap-icons/HeadingFiveIcon.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+export default _default;

package/dist/adapters/tiptap/components/tiptap-icons/HeadingSixIcon.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+export default _default;

package/dist/adapters/tiptap/composables/useMenuNavigation.d.ts

@@ -0,0 +1,18 @@
+import type { Ref } from "vue";
+import type { Editor } from "@tiptap/vue-3";
+type Orientation = "horizontal" | "vertical" | "both";
+interface MenuNavigationOptions<T> {
+    editor?: Editor | null;
+    containerRef?: Ref<HTMLElement | null>;
+    query?: string;
+    items: Ref<T[]>;
+    onSelect?: (item: T) => void;
+    onClose?: () => void;
+    orientation?: Orientation;
+    autoSelectFirstItem?: boolean;
+}
+export declare function useMenuNavigation<T>({ editor, containerRef, query, items, onSelect, onClose, orientation, autoSelectFirstItem, }: MenuNavigationOptions<T>): {
+    selectedIndex: import("vue").ComputedRef<number | undefined>;
+    setSelectedIndex: (i: number) => number;
+};
+export {};

package/dist/adapters/tiptap/composables/useScrollDetector.d.ts

@@ -0,0 +1,8 @@
+export declare function useScrollDetector(): {
+    wrapperRef: import("vue").Ref<unknown>;
+    toolbarRef: import("vue").Ref<unknown>;
+    sentinelRef: import("vue").Ref<unknown>;
+    toolbarStyle: import("vue").Ref<Record<string, string>>;
+    wrapperStyle: import("vue").Ref<Record<string, string>>;
+    isFloating: import("vue").Ref<boolean>;
+};

package/dist/components/ColorPicker.vue.d.ts

@@ -0,0 +1,17 @@
+import "vue3-colorpicker/style.css";
+declare const _default: import("vue").DefineComponent<{
+    pureColor: {
+        type: import("vue").PropType<string>;
+        required: true;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:pure-color": (color: string) => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    pureColor: {
+        type: import("vue").PropType<string>;
+        required: true;
+    };
+}>> & {
+    "onUpdate:pure-color"?: ((color: string) => any) | undefined;
+}, {}, {}>;
+export default _default;