@vaadin/rich-text-editor 24.2.3 → 24.3.0-alpha10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/rich-text-editor",
-  "version": "24.2.3",
+  "version": "24.3.0-alpha10",
   "publishConfig": {
     "access": "public"
   },
@@ -24,6 +24,8 @@
   },
   "files": [
     "src",
+    "!src/vaadin-lit-rich-text-editor.d.ts",
+    "!src/vaadin-lit-rich-text-editor.js",
     "theme",
     "vaadin-*.d.ts",
     "vaadin-*.js",
@@ -39,20 +41,21 @@
     "polymer"
   ],
   "dependencies": {
+    "@open-wc/dedupe-mixin": "^1.3.0",
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/button": "~24.2.3",
-    "@vaadin/component-base": "~24.2.3",
-    "@vaadin/confirm-dialog": "~24.2.3",
-    "@vaadin/text-field": "~24.2.3",
-    "@vaadin/tooltip": "~24.2.3",
-    "@vaadin/vaadin-lumo-styles": "~24.2.3",
-    "@vaadin/vaadin-material-styles": "~24.2.3",
-    "@vaadin/vaadin-themable-mixin": "~24.2.3"
+    "@vaadin/button": "24.3.0-alpha10",
+    "@vaadin/component-base": "24.3.0-alpha10",
+    "@vaadin/confirm-dialog": "24.3.0-alpha10",
+    "@vaadin/text-field": "24.3.0-alpha10",
+    "@vaadin/tooltip": "24.3.0-alpha10",
+    "@vaadin/vaadin-lumo-styles": "24.3.0-alpha10",
+    "@vaadin/vaadin-material-styles": "24.3.0-alpha10",
+    "@vaadin/vaadin-themable-mixin": "24.3.0-alpha10"
   },
   "devDependencies": {
     "@esm-bundle/chai": "^4.3.4",
-    "@vaadin/a11y-base": "~24.2.3",
-    "@vaadin/testing-helpers": "^0.5.0",
+    "@vaadin/a11y-base": "24.3.0-alpha10",
+    "@vaadin/testing-helpers": "^0.6.0",
     "gulp": "^4.0.2",
     "gulp-cli": "^2.3.0",
     "gulp-iconfont": "^11.0.0",
@@ -63,5 +66,5 @@
     "web-types.json",
     "web-types.lit.json"
   ],
-  "gitHead": "72e557e765e72559e9c6a525e257d185ad186dc5"
+  "gitHead": "0271523d93fe5df0425ff64206886614f3c6f401"
 }

package/src/vaadin-rich-text-editor-mixin.d.ts

@@ -0,0 +1,109 @@
+/**
+ * @license
+ * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ *
+ * This program is available under Vaadin Commercial License and Service Terms.
+ *
+ *
+ * See https://vaadin.com/commercial-license-and-service-terms for the full
+ * license.
+ */
+import type { Constructor } from '@open-wc/dedupe-mixin';
+
+export interface RichTextEditorI18n {
+  undo: string;
+  redo: string;
+  bold: string;
+  italic: string;
+  underline: string;
+  strike: string;
+  h1: string;
+  h2: string;
+  h3: string;
+  subscript: string;
+  superscript: string;
+  listOrdered: string;
+  listBullet: string;
+  alignLeft: string;
+  alignCenter: string;
+  alignRight: string;
+  image: string;
+  link: string;
+  blockquote: string;
+  codeBlock: string;
+  clean: string;
+  linkDialogTitle: string;
+  ok: string;
+  cancel: string;
+  remove: string;
+}
+
+/**
+ * Fired when the `htmlValue` property changes.
+ */
+export type RichTextEditorHtmlValueChangedEvent = CustomEvent<{ value: string }>;
+
+/**
+ * Fired when the `value` property changes.
+ */
+export type RichTextEditorValueChangedEvent = CustomEvent<{ value: string }>;
+
+export interface RichTextEditorCustomEventMap {
+  'html-value-changed': RichTextEditorHtmlValueChangedEvent;
+
+  'value-changed': RichTextEditorValueChangedEvent;
+}
+
+export declare function RichTextEditorMixin<T extends Constructor<HTMLElement>>(
+  base: T,
+): Constructor<RichTextEditorMixinClass> & T;
+
+export declare class RichTextEditorMixinClass {
+  /**
+   * Value is a list of the operations which describe change to the document.
+   * Each of those operations describe the change at the current index.
+   * They can be an `insert`, `delete` or `retain`. The format is as follows:
+   *
+   * ```js
+   *  [
+   *    { insert: 'Hello World' },
+   *    { insert: '!', attributes: { bold: true }}
+   *  ]
+   * ```
+   *
+   * See also https://github.com/quilljs/delta for detailed documentation.
+   */
+  value: string;
+
+  /**
+   * HTML representation of the rich text editor content.
+   */
+  readonly htmlValue: string | null | undefined;
+
+  /**
+   * When true, the user can not modify, nor copy the editor content.
+   */
+  disabled: boolean;
+
+  /**
+   * When true, the user can not modify the editor content, but can copy it.
+   */
+  readonly: boolean;
+
+  /**
+   * An object used to localize this component. The properties are used
+   * e.g. as the tooltips for the editor toolbar buttons.
+   */
+  i18n: RichTextEditorI18n;
+
+  /**
+   * Sets content represented by HTML snippet into the editor.
+   * The snippet is interpreted by [Quill's Clipboard matchers](https://quilljs.com/docs/modules/clipboard/#matchers),
+   * which may not produce the exactly input HTML.
+   *
+   * **NOTE:** Improper handling of HTML can lead to cross site scripting (XSS) and failure to sanitize
+   * properly is both notoriously error-prone and a leading cause of web vulnerabilities.
+   * This method is aptly named to ensure the developer has taken the necessary precautions.
+   */
+  dangerouslySetHtmlValue(htmlValue: string): void;
+}