@vonage/vivid-react 3.5.2 → 5.19.0

package/v3/VwcRichTextEditor/index.js

@@ -7,167 +7,96 @@ Code in this file were generated using following JSON:
  "kind": "class",
  "description": "",
  "name": "RichTextEditor",
- "members": [
-  {
-   "kind": "field",
-   "name": "value",
-   "type": {
-    "text": "string | undefined"
-   },
-   "description": "Indicates the rich text editor's value.",
-   "privacy": "public"
-  },
-  {
-   "kind": "field",
-   "name": "#editor",
-   "privacy": "private",
-   "type": {
-    "text": "ProseMirrorFacade | undefined"
-   }
-  },
+ "slots": [
   {
-   "kind": "field",
-   "name": "#editorWrapperElement",
-   "privacy": "private",
-   "type": {
-    "text": "HTMLElement"
-   },
-   "readonly": true
+   "description": "Displayed at the start of the scrollable editor area.",
+   "name": "editor-start"
   },
   {
-   "kind": "field",
-   "name": "selectionStart",
-   "type": {
-    "text": "number | null"
-   },
-   "default": "null"
+   "description": "Displayed at the end of the scrollable editor area.",
+   "name": "editor-end"
   },
   {
-   "kind": "method",
-   "name": "selectionStartChanged"
+   "description": "Displayed between the editor viewport and the toolbar.",
+   "name": "status"
   },
   {
-   "kind": "field",
-   "name": "#updateEditorSelection",
-   "privacy": "private"
-  },
+   "description": "Color picker for the RteTextColorFeature.",
+   "name": "text-color-picker"
+  }
+ ],
+ "members": [
   {
    "kind": "field",
-   "name": "selectionEnd",
+   "name": "instance",
    "type": {
-    "text": "number | null"
+    "text": "RteInstance | undefined"
    },
-   "default": "null"
-  },
-  {
-   "kind": "method",
-   "name": "selectionEndChanged"
+   "description": "The editor instance created from the RteConfig. Without it, the editor will not render."
   },
   {
    "kind": "field",
-   "name": "placeholder",
+   "name": "editorViewportElement",
    "type": {
-    "text": "string | undefined"
-   }
+    "text": "HTMLElement | undefined"
+   },
+   "description": "The viewport wraps the scrollable content of the editor."
   },
   {
    "kind": "method",
-   "name": "placeholderChanged"
-  },
-  {
-   "kind": "field",
-   "name": "#handleSelectionChange",
+   "name": "_initViewIfNeeded",
    "privacy": "private"
   },
-  {
-   "kind": "field",
-   "name": "#handleChange",
-   "privacy": "private"
-  },
-  {
-   "kind": "field",
-   "name": "#handleInput",
-   "privacy": "private"
-  },
-  {
-   "kind": "method",
-   "name": "setTextBlock",
-   "parameters": [
-    {
-     "name": "blockType",
-     "type": {
-      "text": "'title' | 'subtitle' | 'body'"
-     }
-    }
-   ]
-  },
   {
    "kind": "method",
-   "name": "setSelectionDecoration",
-   "parameters": [
-    {
-     "name": "decoration",
-     "type": {
-      "text": "string"
-     }
-    }
-   ]
+   "name": "_destroyViewIfNeeded",
+   "privacy": "private"
   },
   {
    "kind": "method",
-   "name": "setSelectionTextSize",
-   "parameters": [
-    {
-     "name": "textSize",
-     "type": {
-      "text": "RICH_TEXT_EDITOR_MENUBAR_TEXT_SIZES"
-     }
-    }
-   ]
+   "name": "_syncStateIfNeeded",
+   "privacy": "private"
   },
   {
    "kind": "field",
-   "name": "selectionStyles",
+   "name": "#localeChangeHandler",
+   "privacy": "private",
    "type": {
-    "text": "SelectionStyles"
+    "text": "object"
    },
-   "readonly": true
-  },
-  {
-   "kind": "method",
-   "name": "focus"
+   "default": "{\n\t\t\thandleChange: () => {\n\t\t\t\tthis.localeChanged();\n\t\t\t},\n\t\t}",
+   "inheritedFrom": {
+    "name": "WithObservableLocale",
+    "module": "src/shared/patterns/localized.ts"
+   }
   },
   {
    "kind": "field",
-   "name": "#editableAreaElement",
+   "name": "#localeChangeObserver",
    "privacy": "private",
    "type": {
-    "text": "HTMLElement"
+    "text": "ExpressionNotifier"
    },
-   "readonly": true
+   "inheritedFrom": {
+    "name": "WithObservableLocale",
+    "module": "src/shared/patterns/localized.ts"
+   }
   },
   {
    "kind": "method",
-   "name": "scrollToAttachments",
-   "parameters": [
-    {
-     "name": "additionalPixels",
-     "default": "0"
-    }
-   ]
+   "name": "#startObservingLocaleChanges",
+   "inheritedFrom": {
+    "name": "WithObservableLocale",
+    "module": "src/shared/patterns/localized.ts"
+   }
   },
   {
    "kind": "method",
-   "name": "addInlineImage",
-   "parameters": [
-    {
-     "name": "imageProps",
-     "type": {
-      "text": "{\n\t\tfile: File;\n\t\tposition?: number;\n\t\talt?: string;\n\t}"
-     }
-    }
-   ],
-   "async": true
+   "name": "#stopObservingLocaleChanges",
+   "inheritedFrom": {
+    "name": "WithObservableLocale",
+    "module": "src/shared/patterns/localized.ts"
+   }
   },
   {
    "kind": "field",
@@ -197,34 +126,9 @@ Code in this file were generated using following JSON:
    }
   }
  ],
- "attributes": [
-  {
-   "name": "selection-start",
-   "type": {
-    "text": "number | null"
-   },
-   "default": "null",
-   "fieldName": "selectionStart"
-  },
-  {
-   "name": "selection-end",
-   "type": {
-    "text": "number | null"
-   },
-   "default": "null",
-   "fieldName": "selectionEnd"
-  },
-  {
-   "name": "placeholder",
-   "type": {
-    "text": "string | undefined"
-   },
-   "fieldName": "placeholder"
-  }
- ],
  "mixins": [
   {
-   "name": "Localized",
+   "name": "WithObservableLocale",
    "module": "/src/shared/patterns"
   }
  ],
@@ -235,10 +139,22 @@ Code in this file were generated using following JSON:
  "vividComponent": {
   "public": true,
   "name": "rich-text-editor"
- }
+ },
+ "dynamicSlots": [
+  {
+   "name": "inline-image-placeholder",
+   "type": "{ url: string }",
+   "description": "Placeholder content for inline images."
+  },
+  {
+   "name": "suggestions-empty",
+   "type": "{ id: string }",
+   "description": "Empty state if no suggestions are found."
+  }
+ ]
 }
 */
-import wrapper from '@vonage/vivid-react-wrapper'
+import wrapper from '@repo/react-component-wrapper'
 import { registerRichTextEditor } from '@vonage/vivid'
 
 registerRichTextEditor('vvd3')
@@ -246,7 +162,7 @@ registerRichTextEditor('vvd3')
 const VwcRichTextEditor = wrapper(`vvd3-rich-text-editor`,  {
     events: [],
     attributes: [],
-    properties: ['value', 'selectionStart', 'selectionEnd', 'placeholder', 'VIVID_VERSION', 'componentName']
+    properties: ['instance', 'editorViewportElement', 'VIVID_VERSION', 'componentName']
 })
 
 VwcRichTextEditor.displayName = 'VwcRichTextEditor'

package/v3/VwcRichTextEditor/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@vonage/vivid-react-vvd3-rich-text-editor",
-  "version": "4.29.0",
+  "version": "5.19.0",
   "main": "index.js",
   "types": "index.d.ts",
   "private": true,
   "license": "MIT",
   "dependencies": {
-    "@vonage/vivid": "4.29.0"
+    "@vonage/vivid": "5.19.0"
   }
 }

package/v3/VwcRichTextView/index.d.ts

@@ -0,0 +1,22 @@
+import React, { ReactNode } from 'react';
+/** VwcRichTextView
+* For more info on this Vivid element please visit https://vivid.deno.dev/components/rich-text-view
+* @param {RteView | undefined} view - The view to display, created from the RteConfig.
+* @param {string} VIVID_VERSION - The current version of the Vivid library, which is useful for debugging.
+It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
+* @param {string} componentName - Core component name, without prefix
+*/
+declare const VwcRichTextView: {
+    (props: {
+        children?: ReactNode;
+        slot?: string;
+        id?: string;
+        style?: React.CSSProperties;
+        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+        "view"?: any;
+        "VIVID_VERSION"?: string;
+        "componentName"?: string;
+    }): JSX.Element;
+    displayName: string;
+};
+export default VwcRichTextView;

package/v3/VwcRichTextView/index.js

@@ -0,0 +1,195 @@
+/*
+* DO NOT EDIT THIS FILE. IT IS GENERATED
+*/
+/*
+Code in this file were generated using following JSON:
+{
+ "kind": "class",
+ "description": "",
+ "name": "RichTextView",
+ "members": [
+  {
+   "kind": "field",
+   "name": "view",
+   "type": {
+    "text": "RteView | undefined"
+   },
+   "description": "The view to display, created from the RteConfig.",
+   "privacy": "public"
+  },
+  {
+   "kind": "field",
+   "name": "_styles",
+   "type": {
+    "text": "ElementStyles | undefined"
+   },
+   "privacy": "private"
+  },
+  {
+   "kind": "method",
+   "name": "_addStyles",
+   "privacy": "private",
+   "parameters": [
+    {
+     "name": "view",
+     "type": {
+      "text": "RteView"
+     }
+    }
+   ]
+  },
+  {
+   "kind": "method",
+   "name": "_removeStyles",
+   "privacy": "private"
+  },
+  {
+   "kind": "field",
+   "name": "_slotCounter",
+   "type": {
+    "text": "number"
+   },
+   "privacy": "private",
+   "default": "0"
+  },
+  {
+   "kind": "field",
+   "name": "_slottedChildren",
+   "privacy": "private",
+   "default": "new Set<HTMLElement>()"
+  },
+  {
+   "kind": "field",
+   "name": "_slotRequests",
+   "privacy": "private",
+   "default": "new Set<string>()"
+  },
+  {
+   "kind": "method",
+   "name": "_cleanupLightDom",
+   "privacy": "private"
+  },
+  {
+   "kind": "method",
+   "name": "_updateView",
+   "privacy": "private"
+  },
+  {
+   "kind": "method",
+   "name": "_renderView",
+   "privacy": "private",
+   "return": {
+    "type": {
+     "text": "Node"
+    }
+   },
+   "parameters": [
+    {
+     "name": "rteView",
+     "type": {
+      "text": "RteView"
+     }
+    }
+   ]
+  },
+  {
+   "kind": "method",
+   "name": "_handleCustomRender",
+   "privacy": "private",
+   "return": {
+    "type": {
+     "text": "Node"
+    }
+   },
+   "parameters": [
+    {
+     "name": "rteView",
+     "type": {
+      "text": "RteView & { type: 'node' | 'mark' }"
+     }
+    },
+    {
+     "name": "customResult",
+     "type": {
+      "text": "true | { dom: HTMLElement; contentDom?: HTMLElement }"
+     }
+    }
+   ]
+  },
+  {
+   "kind": "method",
+   "name": "_renderDefault",
+   "privacy": "private",
+   "return": {
+    "type": {
+     "text": "Node"
+    }
+   },
+   "parameters": [
+    {
+     "name": "view",
+     "type": {
+      "text": "RteView & { type: 'node' | 'mark' }"
+     }
+    }
+   ]
+  },
+  {
+   "kind": "field",
+   "name": "VIVID_VERSION",
+   "static": true,
+   "default": "__PACKAGE_VERSION__",
+   "description": "The current version of the Vivid library, which is useful for debugging.\nIt can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.",
+   "type": {
+    "text": "string"
+   },
+   "inheritedFrom": {
+    "name": "VividElement",
+    "module": "src/shared/foundation/vivid-element/vivid-element.ts"
+   }
+  },
+  {
+   "kind": "field",
+   "name": "componentName",
+   "type": {
+    "text": "string"
+   },
+   "static": true,
+   "description": "Core component name, without prefix",
+   "inheritedFrom": {
+    "name": "VividElement",
+    "module": "src/shared/foundation/vivid-element/vivid-element.ts"
+   }
+  }
+ ],
+ "superclass": {
+  "name": "VividElement",
+  "module": "/src/shared/foundation/vivid-element/vivid-element"
+ },
+ "vividComponent": {
+  "public": true,
+  "name": "rich-text-view"
+ },
+ "dynamicSlots": [
+  {
+   "name": "child",
+   "type": "@vonage/vivid#RteChildSlotProps",
+   "description": "Used for custom rendered children."
+  }
+ ]
+}
+*/
+import wrapper from '@repo/react-component-wrapper'
+import { registerRichTextView } from '@vonage/vivid'
+
+registerRichTextView('vvd3')
+
+const VwcRichTextView = wrapper(`vvd3-rich-text-view`,  {
+    events: [],
+    attributes: [],
+    properties: ['view', 'VIVID_VERSION', 'componentName']
+})
+
+VwcRichTextView.displayName = 'VwcRichTextView'
+
+export default VwcRichTextView

package/v3/VwcRichTextView/package.json

@@ -0,0 +1,11 @@
+{
+  "name": "@vonage/vivid-react-vvd3-rich-text-view",
+  "version": "5.19.0",
+  "main": "index.js",
+  "types": "index.d.ts",
+  "private": true,
+  "license": "MIT",
+  "dependencies": {
+    "@vonage/vivid": "5.19.0"
+  }
+}

package/v3/VwcRteAlignmentFeatureImpl/index.d.ts

@@ -0,0 +1,20 @@
+import React, { ReactNode } from 'react';
+/** VwcRteAlignmentFeatureImpl
+* For more info on this Vivid element please visit https://vivid.deno.dev/components/rte-alignment-feature-impl
+* @param {string} name - The name of the feature, e.g. RteBoldFeature
+Note: Cannot use this.constructor.name because it may be minified
+* @param {string | undefined} featureId - If a feature can have multiple instances, a unique id to differentiate them.
+*/
+declare const VwcRteAlignmentFeatureImpl: {
+    (props: {
+        children?: ReactNode;
+        slot?: string;
+        id?: string;
+        style?: React.CSSProperties;
+        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+        "name"?: string;
+        "featureId"?: string | undefined;
+    }): JSX.Element;
+    displayName: string;
+};
+export default VwcRteAlignmentFeatureImpl;