From d334c988dc1b9363c559d60ff949757597c50468 Mon Sep 17 00:00:00 2001
From: Ben Tran <ben.tran@tiny.cloud>
Date: Tue, 27 May 2025 15:17:26 +0930
Subject: [PATCH] TINY-11911: Add disabled and readonly to the web component
 tech ref

---
 .../integrations/webcomponent-tech-ref.adoc   | 22 +++++++++++++++++++
 1 file changed, 22 insertions(+)

diff --git a/modules/ROOT/partials/integrations/webcomponent-tech-ref.adoc b/modules/ROOT/partials/integrations/webcomponent-tech-ref.adoc
index 1e711fbd61..322cce3af6 100644
--- a/modules/ROOT/partials/integrations/webcomponent-tech-ref.adoc
+++ b/modules/ROOT/partials/integrations/webcomponent-tech-ref.adoc
@@ -8,6 +8,8 @@
 ** xref:loading-plugins[Loading plugins]
 ** xref:setting-the-editor-width[Setting the editor width]
 ** xref:setting-the-editor-height[Setting the editor height]
+** xref:setting-readonly[Setting the editor to readonly]
+** xref:setting-disabled[Setting the editor to disabled]
 ** xref:setting-the-toolbar[Setting the toolbar]
 ** xref:setting-the-toolbar-mode[Setting the toolbar mode]
 ** xref:setting-the-menu-bar[Setting the menu bar]
@@ -146,6 +148,26 @@ To set the height of the editor (content area and user interface), use the `+hei
 <tinymce-editor height="15em"></tinymce-editor>
 ----
 
+
+[[setting-readonly]]
+=== Setting readonly mode
+
+To set the editor's mode to `readonly`.
+
+[source,html]
+----
+<tinymce-editor readonly></tinymce-editor>
+----
+
+[[setting-disaled-state]]
+=== Setting disabled state
+To set the editor to a disabled state.
+
+[source,html]
+----
+<tinymce-editor disabled></tinymce-editor>
+----
+
 [[setting-the-toolbar]]
 === Setting the toolbar