npm - globuswebcomponents - Versions diffs - 2.18.4 → 2.18.6 - Mend

globuswebcomponents 2.18.4 → 2.18.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (109) hide show

package/dist/collection/components/gb-rich-text/gb-rich-text.css CHANGED Viewed

@@ -2785,10 +2785,34 @@
   background: var(--color-background-gray-subtler, #eef2f6);
   color: var(--color-icon-default, #364152);
 }
-.ProseMirror-selectednode,
-.ProseMirror-focused img{
-  max-width: 100%;        /* never wider than the editor */
-  max-height: 300px;      /* cap the height so tall portraits don't take over */
-  width: auto;            /* let width scale naturally */
-  height: auto;
+.gb-rich-text__content .ProseMirror img {
+  max-width: 100%;        /* never wider than the editor, still overridable by the resize handle's inline width */
+  height: auto;           /* preserve aspect ratio as width changes */
+}
+/* === Resizable image (see resizable-image.ts) === */
+.gb-rich-text__content .ProseMirror .gb-resizable-image {
+  position: relative;
+  display: inline-block;
+  max-width: 100%;
+  line-height: 0;
+}
+.gb-rich-text__content .ProseMirror .gb-resizable-image img {
+  display: block;
+}
+.gb-rich-text__content .ProseMirror .gb-resizable-image__handle {
+  position: absolute;
+  right: -4px;
+  bottom: -4px;
+  width: 10px;
+  height: 10px;
+  border: 1.5px solid var(--color-background-card, #ffffff);
+  border-radius: 2px;
+  background: var(--color-border-selected, #075db2);
+  cursor: nwse-resize;
+  opacity: 0;
+  transition: opacity 0.15s;
+}
+.gb-rich-text__content .ProseMirror .gb-resizable-image:hover .gb-resizable-image__handle,
+.gb-rich-text__content .ProseMirror .gb-resizable-image.ProseMirror-selectednode .gb-resizable-image__handle {
+  opacity: 1;
 }

package/dist/collection/components/gb-rich-text/gb-rich-text.js CHANGED Viewed

@@ -1,11 +1,11 @@
 import { h, Fragment } from "@stencil/core";
 import { Editor } from "@tiptap/core";
-import Image from "@tiptap/extension-image";
 import Link from "@tiptap/extension-link";
 import Placeholder from "@tiptap/extension-placeholder";
 import Underline from "@tiptap/extension-underline";
 import StarterKit from "@tiptap/starter-kit";
 import FileHandler from "@tiptap/extension-file-handler";
+import { ResizableImage } from "./resizable-image";
 export class GbRichText {
     constructor() {
         this.label = '';
@@ -38,7 +38,7 @@ export class GbRichText {
                 StarterKit,
                 Underline,
                 Link.configure({ openOnClick: false }),
-                Image,
+                ResizableImage,
                 Placeholder.configure({ placeholder: this.placeholder }),
                 FileHandler.configure({
                     allowedMimeTypes: ['image/jpeg', 'image/png', 'image/gif'],
@@ -162,12 +162,12 @@ export class GbRichText {
         (_a = this.editor) === null || _a === void 0 ? void 0 : _a.destroy();
     }
     render() {
-        return (h("div", { key: '9928f07fa557418f107fc8970a8a6d660c2eb664', class: {
+        return (h("div", { key: '8e35f372364f6b6e7423b3be278b025d65bf3329', class: {
                 'gb-rich-text': true,
                 'gb-rich-text--focused': this.isFocused,
                 'gb-rich-text--error': this.destructive,
                 'gb-rich-text--disabled': this.disabled,
-            } }, this.label && h("label", { key: '0d092f589d34c35df40a7932055e5d61a666df30', class: "gb-rich-text__label text-sm-medium" }, this.label), h("div", { key: '6333cc24ecf0e4f52f870814ecf8d945e7953a76', class: "gb-rich-text__wrapper" }, h("gb-wysiwyg-toolbar", { key: 'bc9f60b4124bbff6bd9c7d728c18428f7d57cfc1', disabledIcons: this.disabledIcons, "is-bold": this.isBold, "is-italic": this.isItalic, "is-h1": this.isH1, "is-h2": this.isH2, "is-underline": this.isUnderline, "is-quote": this.isQuote, "is-link": this.isLink, "is-bullet-list": this.isBulletList, "is-ordered-list": this.isOrderedList, onToolbarAction: (ev) => this.handleToolbarAction(ev) }), this.destructive && (h("svg", { key: '18133040ecb1d5eaa5d92ee8b067a9303d260841', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", class: "alert_circle" }, h("path", { key: 'ebb0dce0726e0b7eda10429e44ee2f1c76fac057', d: "M7.99483 9.99998H8.00081M8.00016 7.99998V5.33331M14.6668 7.99998C14.6668 11.6819 11.6821 14.6666 8.00016 14.6666C4.31826 14.6666 1.3335 11.6819 1.3335 7.99998C1.3335 4.31808 4.31826 1.33331 8.00016 1.33331C11.6821 1.33331 14.6668 4.31808 14.6668 7.99998Z", stroke: "var(--color-icon-danger, #B51726)", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.attachments.length > 0 && (h("div", { key: '23044031819bef9cd45f3533dc0f9b4d291d810d', class: "gb-rich-text__attachments" }, this.attachments.map((attachment, index) => (h("div", { class: "gb-rich-text__attachment-item", key: index }, h("span", { class: "gb-rich-text__attachment-icon" }, h("gb-file-type-icon", { "file-type": this.getFileExtension(attachment.name), "file-style": "default" })), h("div", { class: "gb-rich-text__attachment-info" }, h("span", { class: "gb-rich-text__attachment-name text-sm-medium" }, attachment.name), h("span", { class: "gb-rich-text__attachment-size text-xs-regular" }, this.formatFileSize(attachment.size))), h("gb-button-close", { color: "gray", size: "sm", onClick: () => this.removeAttachment(index) })))))), h("input", { key: '5843d797ed6ebb90db7aa4847eb295460ab7ff8a', ref: el => (this.fileInputEl = el), type: "file", accept: "image/*", style: { display: 'none' }, onChange: (e) => this.handleFileInput(e) }), h("input", { key: '210cceded9489a05a77b04df351c433f00bb844b', ref: el => (this.attachmentInputEl = el), type: "file", accept: ".pdf,.doc,.docx,.xls,.xlsx,.csv,.txt,.zip", style: { display: 'none' }, onChange: (e) => this.handleAttachmentInput(e) }), h("div", { key: 'cee6e40b4249eb5bcfc4f2f1fa9a791f6d09a52e', class: "gb-rich-text__content" })), this.showHintText && (h(Fragment, null, !this.destructive ? h("p", { class: "gb-rich-text__hint text-sm-regular" }, this.hintText) : h("p", { class: "error_text text-sm-regular" }, this.errorText)))));
+            } }, this.label && h("label", { key: '48fa31760874f4ba046f8bd1927b0e3ee478e8a9', class: "gb-rich-text__label text-sm-medium" }, this.label), h("div", { key: '4a8d857144b9d32e729bc529596a9179757aca2e', class: "gb-rich-text__wrapper" }, h("gb-wysiwyg-toolbar", { key: 'bb7a7cf92d4463f6b675c81378fc2f5ad44e636a', disabledIcons: this.disabledIcons, "is-bold": this.isBold, "is-italic": this.isItalic, "is-h1": this.isH1, "is-h2": this.isH2, "is-underline": this.isUnderline, "is-quote": this.isQuote, "is-link": this.isLink, "is-bullet-list": this.isBulletList, "is-ordered-list": this.isOrderedList, onToolbarAction: (ev) => this.handleToolbarAction(ev) }), this.destructive && (h("svg", { key: 'e98e952ce38dee168aaeed851be0b7264c3dd677', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", class: "alert_circle" }, h("path", { key: '5ed5812e747f848d6bacea85a65e5cc1241d940f', d: "M7.99483 9.99998H8.00081M8.00016 7.99998V5.33331M14.6668 7.99998C14.6668 11.6819 11.6821 14.6666 8.00016 14.6666C4.31826 14.6666 1.3335 11.6819 1.3335 7.99998C1.3335 4.31808 4.31826 1.33331 8.00016 1.33331C11.6821 1.33331 14.6668 4.31808 14.6668 7.99998Z", stroke: "var(--color-icon-danger, #B51726)", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.attachments.length > 0 && (h("div", { key: 'd8f8bfb37e2ec6db50d26967bf5c0b4bf957a0cf', class: "gb-rich-text__attachments" }, this.attachments.map((attachment, index) => (h("div", { class: "gb-rich-text__attachment-item", key: index }, h("span", { class: "gb-rich-text__attachment-icon" }, h("gb-file-type-icon", { "file-type": this.getFileExtension(attachment.name), "file-style": "default" })), h("div", { class: "gb-rich-text__attachment-info" }, h("span", { class: "gb-rich-text__attachment-name text-sm-medium" }, attachment.name), h("span", { class: "gb-rich-text__attachment-size text-xs-regular" }, this.formatFileSize(attachment.size))), h("gb-button-close", { color: "gray", size: "sm", onClick: () => this.removeAttachment(index) })))))), h("input", { key: '29f63449b3e265aad6ffb9415de48768ac47e4a5', ref: el => (this.fileInputEl = el), type: "file", accept: "image/*", style: { display: 'none' }, onChange: (e) => this.handleFileInput(e) }), h("input", { key: '204ddc471af0da8d0f9388c729b792e59bcbcb6a', ref: el => (this.attachmentInputEl = el), type: "file", accept: ".pdf,.doc,.docx,.xls,.xlsx,.csv,.txt,.zip", style: { display: 'none' }, onChange: (e) => this.handleAttachmentInput(e) }), h("div", { key: '5e2aadf828780b43417670e05296279b12f921be', class: "gb-rich-text__content" })), this.showHintText && (h(Fragment, null, !this.destructive ? h("p", { class: "gb-rich-text__hint text-sm-regular" }, this.hintText) : h("p", { class: "error_text text-sm-regular" }, this.errorText)))));
     }
     static get is() { return "gb-rich-text"; }
     static get originalStyleUrls() {

package/dist/collection/components/gb-rich-text/gb-rich-text.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"gb-rich-text.js","sourceRoot":"","sources":["../../../src/components/gb-rich-text/gb-rich-text.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACjH,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,KAAK,MAAM,yBAAyB,CAAC;AAC5C,OAAO,IAAI,MAAM,wBAAwB,CAAC;AAC1C,OAAO,WAAW,MAAM,+BAA+B,CAAC;AACxD,OAAO,SAAS,MAAM,6BAA6B,CAAC;AACpD,OAAO,UAAU,MAAM,qBAAqB,CAAC;AAC7C,OAAO,WAAW,MAAM,gCAAgC,CAAC;AAOzD,MAAM,OAAO,UAAU;IALvB;QAMU,UAAK,GAAW,EAAE,CAAC;QACnB,gBAAW,GAAW,EAAE,CAAC;QACzB,iBAAY,GAAY,IAAI,CAAC;QAC7B,aAAQ,GAAW,EAAE,CAAC;QAEtB,aAAQ,GAAY,KAAK,CAAC;QAC1B,gBAAW,GAAY,KAAK,CAAC;QAC7B,cAAS,GAAW,EAAE,CAAC;QAC/B,+FAA+F;QACvF,kBAAa,GAAsB,EAAE,CAAC;QAE9C,iDAAiD;QACxC,cAAS,GAAY,KAAK,CAAC;QAC3B,WAAM,GAAY,KAAK,CAAC;QACxB,aAAQ,GAAY,KAAK,CAAC;QAC1B,SAAI,GAAY,KAAK,CAAC;QACtB,SAAI,GAAY,KAAK,CAAC;QACtB,gBAAW,GAAY,KAAK,CAAC;QAC7B,YAAO,GAAY,KAAK,CAAC;QACzB,WAAM,GAAY,KAAK,CAAC;QACxB,iBAAY,GAAY,KAAK,CAAC;QAC9B,kBAAa,GAAY,KAAK,CAAC;QAC/B,gBAAW,GAA+D,EAAE,CAAC;KAuPvF;IA3OC,gBAAgB;QACd,MAAM,QAAQ,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,wBAAwB,CAAgB,CAAC;QAEhF,IAAI,CAAC,MAAM,GAAG,IAAI,MAAM,CAAC;YACvB,OAAO,EAAE,QAAQ;YACjB,UAAU,EAAE;gBACV,UAAU;gBACV,SAAS;gBACT,IAAI,CAAC,SAAS,CAAC,EAAE,WAAW,EAAE,KAAK,EAAE,CAAC;gBACtC,KAAK;gBACL,WAAW,CAAC,SAAS,CAAC,EAAE,WAAW,EAAE,IAAI,CAAC,WAAW,EAAE,CAAC;gBACxD,WAAW,CAAC,SAAS,CAAC;oBACpB,gBAAgB,EAAE,CAAC,YAAY,EAAE,WAAW,EAAE,WAAW,CAAC;iBAC3D,CAAC;aACH;YACD,OAAO,EAAE,IAAI,CAAC,KAAK;YACnB,QAAQ,EAAE,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE;gBACvB,MAAM,IAAI,GAAG,MAAM,CAAC,OAAO,EAAE,CAAC;gBAC9B,MAAM,IAAI,GAAG,MAAM,CAAC,OAAO,EAAE,CAAC;gBAC9B,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;gBAC3D,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC;YAChC,CAAC;YACD,iBAAiB,EAAE,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE;gBAChC,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC;YAChC,CAAC;YACD,OAAO,EAAE,GAAG,EAAE;gBACZ,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;gBACtB,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;YACtB,CAAC;YACD,MAAM,EAAE,GAAG,EAAE;gBACX,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;gBACvB,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;YACrB,CAAC;SACF,CAAC,CAAC;IACL,CAAC;IAEO,eAAe,CAAC,CAAQ;;QAC9B,MAAM,IAAI,GAAG,MAAC,CAAC,CAAC,MAA2B,CAAC,KAAK,0CAAG,CAAC,CAAC,CAAC;QACvD,IAAI,CAAC,IAAI;YAAE,OAAO;QAClB,MAAM,MAAM,GAAG,IAAI,UAAU,EAAE,CAAC;QAChC,MAAM,CAAC,MAAM,GAAG,GAAG,EAAE;YACnB,MAAM,GAAG,GAAG,MAAM,CAAC,MAAgB,CAAC;YACpC,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,CAAC,QAAQ,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC,GAAG,EAAE,CAAC;QACtD,CAAC,CAAC;QACF,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QAC3B,yCAAyC;QACxC,CAAC,CAAC,MAA2B,CAAC,KAAK,GAAG,EAAE,CAAC;IAC5C,CAAC;IAEO,qBAAqB,CAAC,CAAQ;;QACpC,MAAM,IAAI,GAAG,MAAC,CAAC,CAAC,MAA2B,CAAC,KAAK,0CAAG,CAAC,CAAC,CAAC;QACvD,IAAI,CAAC,IAAI;YAAE,OAAO;QAElB,MAAM,UAAU,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC;QAE/E,uCAAuC;QACvC,IAAI,CAAC,WAAW,GAAG,CAAC,GAAG,IAAI,CAAC,WAAW,EAAE,UAAU,CAAC,CAAC;QAErD,yBAAyB;QACzB,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAE9C,yCAAyC;QACxC,CAAC,CAAC,MAA2B,CAAC,KAAK,GAAG,EAAE,CAAC;IAC5C,CAAC;IAEO,gBAAgB,CAAC,KAAa;QACpC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,CAAC;IACpE,CAAC;IAEO,cAAc,CAAC,KAAa;QAClC,IAAI,KAAK,GAAG,IAAI;YAAE,OAAO,GAAG,KAAK,IAAI,CAAC;QACtC,IAAI,KAAK,GAAG,IAAI,GAAG,IAAI;YAAE,OAAO,GAAG,CAAC,KAAK,GAAG,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC;QAClE,OAAO,GAAG,CAAC,KAAK,GAAG,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC;IACpD,CAAC;IAEO,gBAAgB,CAAC,IAAY;;QACnC,MAAM,GAAG,GAAG,MAAA,MAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,0CAAE,WAAW,EAAE,mCAAI,EAAE,CAAC;QACvD,OAAO,GAAG,CAAC;IACb,CAAC;IAED,0DAA0D;IAClD,gBAAgB,CAAC,MAAc;QACrC,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;QACtC,IAAI,CAAC,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;QAC1C,IAAI,CAAC,WAAW,GAAG,MAAM,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;QAChD,IAAI,CAAC,IAAI,GAAG,MAAM,CAAC,QAAQ,CAAC,SAAS,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC;QACrD,IAAI,CAAC,IAAI,GAAG,MAAM,CAAC,QAAQ,CAAC,SAAS,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC;QACrD,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC;QAC7C,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;QACtC,IAAI,CAAC,YAAY,GAAG,MAAM,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC;QAClD,IAAI,CAAC,aAAa,GAAG,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;IACtD,CAAC;IAED,4DAA4D;IACpD,mBAAmB,CAAC,EAAuB;;QACjD,MAAM,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC;QACtB,IAAI,CAAC,CAAC;YAAE,OAAO;QAEf,MAAM,SAAS,GAA+B;YAC5C,IAAI,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,CAAC,UAAU,EAAE,CAAC,GAAG,EAAE;YAChD,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,CAAC,YAAY,EAAE,CAAC,GAAG,EAAE;YACpD,SAAS,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,CAAC,eAAe,EAAE,CAAC,GAAG,EAAE;YAC1D,EAAE,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,CAAC,aAAa,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,EAAE;YAC7D,EAAE,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,CAAC,aAAa,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,EAAE;YAC7D,KAAK,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,CAAC,gBAAgB,EAAE,CAAC,GAAG,EAAE;YACvD,IAAI,EAAE,GAAG,EAAE;gBACT,MAAM,GAAG,GAAG,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;gBACvC,IAAI,GAAG;oBAAE,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,CAAC,OAAO,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE,CAAC,CAAC,GAAG,EAAE,CAAC;YAC1D,CAAC;YACD,UAAU,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,CAAC,gBAAgB,EAAE,CAAC,GAAG,EAAE;YAC5D,WAAW,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,CAAC,iBAAiB,EAAE,CAAC,GAAG,EAAE;YAC9D,KAAK,EAAE,GAAG,EAAE,WAAC,OAAA,MAAA,IAAI,CAAC,WAAW,0CAAE,KAAK,EAAE,CAAA,EAAA;YACtC,UAAU,EAAE,GAAG,EAAE,WAAC,OAAA,MAAA,IAAI,CAAC,iBAAiB,0CAAE,KAAK,EAAE,CAAA,EAAA;SAClD,CAAC;QAEF,MAAA,SAAS,CAAC,EAAE,CAAC,MAAM,CAAC,yDAAI,CAAC;QACzB,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC;IAC3B,CAAC;IAGD,iBAAiB,CAAC,QAAgB;QAChC,IAAI,IAAI,CAAC,MAAM,IAAI,QAAQ,EAAE,CAAC;YAC5B,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC;QAC5C,CAAC;IACH,CAAC;IAGD,KAAK,CAAC,eAAe;;QACnB,OAAO,MAAA,MAAA,IAAI,CAAC,MAAM,0CAAE,OAAO,EAAE,mCAAI,EAAE,CAAC;IACtC,CAAC;IAGD,KAAK,CAAC,YAAY;;QAChB,MAAA,IAAI,CAAC,MAAM,0CAAE,QAAQ,CAAC,YAAY,EAAE,CAAC;IACvC,CAAC;IAED,oBAAoB;;QAClB,MAAA,IAAI,CAAC,MAAM,0CAAE,OAAO,EAAE,CAAC;IACzB,CAAC;IAED,MAAM;QACJ,OAAO,CACL,4DACE,KAAK,EAAE;gBACL,cAAc,EAAE,IAAI;gBACpB,uBAAuB,EAAE,IAAI,CAAC,SAAS;gBACvC,qBAAqB,EAAE,IAAI,CAAC,WAAW;gBACvC,wBAAwB,EAAE,IAAI,CAAC,QAAQ;aACxC;YAEA,IAAI,CAAC,KAAK,IAAI,8DAAO,KAAK,EAAC,oCAAoC,IAAE,IAAI,CAAC,KAAK,CAAS;YAErF,4DAAK,KAAK,EAAC,uBAAuB;gBAChC,2EACE,aAAa,EAAE,IAAI,CAAC,aAAa,aACxB,IAAI,CAAC,MAAM,eACT,IAAI,CAAC,QAAQ,WACjB,IAAI,CAAC,IAAI,WACT,IAAI,CAAC,IAAI,kBACF,IAAI,CAAC,WAAW,cACpB,IAAI,CAAC,OAAO,aACb,IAAI,CAAC,MAAM,oBACJ,IAAI,CAAC,YAAY,qBAChB,IAAI,CAAC,aAAa,EACnC,eAAe,EAAE,CAAC,EAAuB,EAAE,EAAE,CAAC,IAAI,CAAC,mBAAmB,CAAC,EAAE,CAAC,GACtD;gBAErB,IAAI,CAAC,WAAW,IAAI,CACnB,4DAAK,KAAK,EAAC,4BAA4B,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,cAAc;oBACjH,6DACE,CAAC,EAAC,gQAAgQ,EAClQ,MAAM,EAAC,mCAAmC,kBAC7B,SAAS,oBACP,OAAO,qBACN,OAAO,GACvB,CACE,CACP;gBACA,IAAI,CAAC,WAAW,CAAC,MAAM,GAAG,CAAC,IAAI,CAC9B,4DAAK,KAAK,EAAC,2BAA2B,IACnC,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,UAAU,EAAE,KAAK,EAAE,EAAE,CAAC,CAC3C,WAAK,KAAK,EAAC,+BAA+B,EAAC,GAAG,EAAE,KAAK;oBAEnD,YAAM,KAAK,EAAC,+BAA+B;wBACzC,sCAA8B,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC,IAAI,CAAC,gBAAa,SAAS,GAAqB,CAC1G;oBACP,WAAK,KAAK,EAAC,+BAA+B;wBACxC,YAAM,KAAK,EAAC,8CAA8C,IAAE,UAAU,CAAC,IAAI,CAAQ;wBACnF,YAAM,KAAK,EAAC,+CAA+C,IAAE,IAAI,CAAC,cAAc,CAAC,UAAU,CAAC,IAAI,CAAC,CAAQ,CACrG;oBAaN,uBAAiB,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,GAAoB,CACnG,CACP,CAAC,CACE,CACP;gBAGD,8DACE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,EAAsB,CAAC,EACtD,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,SAAS,EAChB,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAC1B,QAAQ,EAAE,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,GAC/C;gBAGF,8DACE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,iBAAiB,GAAG,EAAsB,CAAC,EAC5D,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,2CAA2C,EAClD,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAC1B,QAAQ,EAAE,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,GACrD;gBACF,4DAAK,KAAK,EAAC,uBAAuB,GAAO,CACrC;YAGL,IAAI,CAAC,YAAY,IAAI,CACpB,kBAAG,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,SAAG,KAAK,EAAC,oCAAoC,IAAE,IAAI,CAAC,QAAQ,CAAK,CAAC,CAAC,CAAC,SAAG,KAAK,EAAC,4BAA4B,IAAE,IAAI,CAAC,SAAS,CAAK,CAAI,CAC1J,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, Event, EventEmitter, Method, Prop, State, Watch, h, Fragment } from '@stencil/core';\r\nimport { Editor } from '@tiptap/core';\r\nimport Image from '@tiptap/extension-image';\r\nimport Link from '@tiptap/extension-link';\r\nimport Placeholder from '@tiptap/extension-placeholder';\r\nimport Underline from '@tiptap/extension-underline';\r\nimport StarterKit from '@tiptap/starter-kit';\r\nimport FileHandler from '@tiptap/extension-file-handler';\r\n\r\n@Component({\r\n tag: 'gb-rich-text',\r\n styleUrl: 'gb-rich-text.css',\r\n shadow: false,\r\n})\r\nexport class GbRichText {\r\n @Prop() label: string = '';\r\n @Prop() placeholder: string = '';\r\n @Prop() showHintText: boolean = true;\r\n @Prop() hintText: string = '';\r\n @Prop() value: any;\r\n @Prop() disabled: boolean = false;\r\n @Prop() destructive: boolean = false;\r\n @Prop() errorText: string = '';\r\n // Toolbar icons to disable, e.g. disabled-icons=\"photo,attachment\" or ['photo', 'attachment'].\r\n @Prop() disabledIcons: string \| string[] = [];\r\n\r\n // Active states tracked for toolbar highlighting\r\n @State() isFocused: boolean = false;\r\n @State() isBold: boolean = false;\r\n @State() isItalic: boolean = false;\r\n @State() isH1: boolean = false;\r\n @State() isH2: boolean = false;\r\n @State() isUnderline: boolean = false;\r\n @State() isQuote: boolean = false;\r\n @State() isLink: boolean = false;\r\n @State() isBulletList: boolean = false;\r\n @State() isOrderedList: boolean = false;\r\n @State() attachments: { file: File; name: string; size: number; type: string }[] = [];\r\n @Event() richTextValueChanged: EventEmitter<{ json: any; html: any }>;\r\n @Event() richTextAttachmentAdded: EventEmitter<{ file: File; name: string; size: number; type: string }>;\r\n @Event() gbBlur: EventEmitter<void>;\r\n @Event() gbFocus: EventEmitter<void>;\r\n\r\n @Element() el: HTMLElement;\r\n\r\n private editor: Editor;\r\n private fileInputEl: HTMLInputElement;\r\n private attachmentInputEl: HTMLInputElement;\r\n\r\n componentDidLoad() {\r\n const editorEl = this.el.querySelector('.gb-rich-text__content') as HTMLElement;\r\n\r\n this.editor = new Editor({\r\n element: editorEl,\r\n extensions: [\r\n StarterKit,\r\n Underline,\r\n Link.configure({ openOnClick: false }),\r\n Image,\r\n Placeholder.configure({ placeholder: this.placeholder }),\r\n FileHandler.configure({\r\n allowedMimeTypes: ['image/jpeg', 'image/png', 'image/gif'],\r\n }),\r\n ],\r\n content: this.value,\r\n onUpdate: ({ editor }) => {\r\n const json = editor.getJSON();\r\n const html = editor.getHTML();\r\n this.richTextValueChanged.emit({ json: json, html: html });\r\n this.syncActiveStates(editor);\r\n },\r\n onSelectionUpdate: ({ editor }) => {\r\n this.syncActiveStates(editor);\r\n },\r\n onFocus: () => {\r\n this.isFocused = true;\r\n this.gbFocus.emit();\r\n },\r\n onBlur: () => {\r\n this.isFocused = false;\r\n this.gbBlur.emit();\r\n },\r\n });\r\n }\r\n\r\n private handleFileInput(e: Event) {\r\n const file = (e.target as HTMLInputElement).files?.[0];\r\n if (!file) return;\r\n const reader = new FileReader();\r\n reader.onload = () => {\r\n const src = reader.result as string;\r\n this.editor.chain().focus().setImage({ src }).run();\r\n };\r\n reader.readAsDataURL(file);\r\n // Reset so same file can be picked again\r\n (e.target as HTMLInputElement).value = '';\r\n }\r\n\r\n private handleAttachmentInput(e: Event) {\r\n const file = (e.target as HTMLInputElement).files?.[0];\r\n if (!file) return;\r\n\r\n const attachment = { file, name: file.name, size: file.size, type: file.type };\r\n\r\n // Push to local state so UI renders it\r\n this.attachments = [...this.attachments, attachment];\r\n\r\n // Emit to Angular parent\r\n this.richTextAttachmentAdded.emit(attachment);\r\n\r\n // Reset so same file can be picked again\r\n (e.target as HTMLInputElement).value = '';\r\n }\r\n\r\n private removeAttachment(index: number) {\r\n this.attachments = this.attachments.filter((_, i) => i !== index);\r\n }\r\n\r\n private formatFileSize(bytes: number): string {\r\n if (bytes < 1024) return `${bytes} B`;\r\n if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;\r\n return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;\r\n }\r\n\r\n private getFileExtension(name: string): string {\r\n const ext = name.split('.').pop()?.toLowerCase() ?? '';\r\n return ext;\r\n }\r\n\r\n // Syncs toolbar active states to current editor selection\r\n private syncActiveStates(editor: Editor) {\r\n this.isBold = editor.isActive('bold');\r\n this.isItalic = editor.isActive('italic');\r\n this.isUnderline = editor.isActive('underline');\r\n this.isH1 = editor.isActive('heading', { level: 1 });\r\n this.isH2 = editor.isActive('heading', { level: 2 });\r\n this.isQuote = editor.isActive('blockquote');\r\n this.isLink = editor.isActive('link');\r\n this.isBulletList = editor.isActive('bulletList');\r\n this.isOrderedList = editor.isActive('orderedList');\r\n }\r\n\r\n // Handles all toolbar action events from gb-wysiwyg-toolbar\r\n private handleToolbarAction(ev: CustomEvent<string>) {\r\n const e = this.editor;\r\n if (!e) return;\r\n\r\n const actionMap: Record<string, () => void> = {\r\n bold: () => e.chain().focus().toggleBold().run(),\r\n italic: () => e.chain().focus().toggleItalic().run(),\r\n underline: () => e.chain().focus().toggleUnderline().run(),\r\n h1: () => e.chain().focus().toggleHeading({ level: 1 }).run(),\r\n h2: () => e.chain().focus().toggleHeading({ level: 2 }).run(),\r\n quote: () => e.chain().focus().toggleBlockquote().run(),\r\n link: () => {\r\n const url = window.prompt('Enter URL');\r\n if (url) e.chain().focus().setLink({ href: url }).run();\r\n },\r\n bulletList: () => e.chain().focus().toggleBulletList().run(),\r\n orderedList: () => e.chain().focus().toggleOrderedList().run(),\r\n photo: () => this.fileInputEl?.click(),\r\n attachment: () => this.attachmentInputEl?.click(),\r\n };\r\n\r\n actionMap[ev.detail]?.();\r\n this.syncActiveStates(e);\r\n }\r\n\r\n @Watch('value')\r\n handleValueChange(newValue: string) {\r\n if (this.editor && newValue) {\r\n this.editor.commands.setContent(newValue);\r\n }\r\n }\r\n\r\n @Method()\r\n async getRichTextHTML(): Promise<string> {\r\n return this.editor?.getHTML() ?? '';\r\n }\r\n\r\n @Method()\r\n async clearContent(): Promise<void> {\r\n this.editor?.commands.clearContent();\r\n }\r\n\r\n disconnectedCallback() {\r\n this.editor?.destroy();\r\n }\r\n\r\n render() {\r\n return (\r\n <div\r\n class={{\r\n 'gb-rich-text': true,\r\n 'gb-rich-text--focused': this.isFocused,\r\n 'gb-rich-text--error': this.destructive,\r\n 'gb-rich-text--disabled': this.disabled,\r\n }}\r\n >\r\n {this.label && <label class=\"gb-rich-text__label text-sm-medium\">{this.label}</label>}\r\n\r\n <div class=\"gb-rich-text__wrapper\">\r\n <gb-wysiwyg-toolbar\r\n disabledIcons={this.disabledIcons}\r\n is-bold={this.isBold}\r\n is-italic={this.isItalic}\r\n is-h1={this.isH1}\r\n is-h2={this.isH2}\r\n is-underline={this.isUnderline}\r\n is-quote={this.isQuote}\r\n is-link={this.isLink}\r\n is-bullet-list={this.isBulletList}\r\n is-ordered-list={this.isOrderedList}\r\n onToolbarAction={(ev: CustomEvent<string>) => this.handleToolbarAction(ev)}\r\n ></gb-wysiwyg-toolbar>\r\n\r\n {this.destructive && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" class=\"alert_circle\">\r\n <path\r\n d=\"M7.99483 9.99998H8.00081M8.00016 7.99998V5.33331M14.6668 7.99998C14.6668 11.6819 11.6821 14.6666 8.00016 14.6666C4.31826 14.6666 1.3335 11.6819 1.3335 7.99998C1.3335 4.31808 4.31826 1.33331 8.00016 1.33331C11.6821 1.33331 14.6668 4.31808 14.6668 7.99998Z\"\r\n stroke=\"var(--color-icon-danger, #B51726)\"\r\n stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n )}\r\n {this.attachments.length > 0 && (\r\n <div class=\"gb-rich-text__attachments\">\r\n {this.attachments.map((attachment, index) => (\r\n <div class=\"gb-rich-text__attachment-item\" key={index}>\r\n {/* <span class=\"gb-rich-text__attachment-icon\">{this.getFileIcon(attachment.type)}</span> /}\r\n <span class=\"gb-rich-text__attachment-icon\">\r\n <gb-file-type-icon file-type={this.getFileExtension(attachment.name)} file-style=\"default\"></gb-file-type-icon>\r\n </span>\r\n <div class=\"gb-rich-text__attachment-info\">\r\n <span class=\"gb-rich-text__attachment-name text-sm-medium\">{attachment.name}</span>\r\n <span class=\"gb-rich-text__attachment-size text-xs-regular\">{this.formatFileSize(attachment.size)}</span>\r\n </div>\r\n {/ <button\r\n class=\"gb-rich-text__attachment-remove\"\r\n onMouseDown={(ev: MouseEvent) => {\r\n ev.preventDefault();\r\n this.removeAttachment(index);\r\n }}\r\n aria-label=\"Remove attachment\"\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path d=\"M12 4L4 12M4 4l8 8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" />\r\n </svg>\r\n </button> /}\r\n <gb-button-close color=\"gray\" size=\"sm\" onClick={() => this.removeAttachment(index)}></gb-button-close>\r\n </div>\r\n ))}\r\n </div>\r\n )}\r\n\r\n {/ Hidden file input for local image selection /}\r\n <input\r\n ref={el => (this.fileInputEl = el as HTMLInputElement)}\r\n type=\"file\"\r\n accept=\"image/\"\r\n style={{ display: 'none' }}\r\n onChange={(e: Event) => this.handleFileInput(e)}\r\n />\r\n\r\n {/* Hidden file input for attachments /}\r\n <input\r\n ref={el => (this.attachmentInputEl = el as HTMLInputElement)}\r\n type=\"file\"\r\n accept=\".pdf,.doc,.docx,.xls,.xlsx,.csv,.txt,.zip\"\r\n style={{ display: 'none' }}\r\n onChange={(e: Event) => this.handleAttachmentInput(e)}\r\n />\r\n <div class=\"gb-rich-text__content\"></div>\r\n </div>\r\n\r\n {/ {(this.showHintText \|\| this.errorText) && <span class=\"gb-rich-text__hint text-sm-regular\">{this.destructive ? this.errorText : this.hintText}</span>} */}\r\n {this.showHintText && (\r\n <>{!this.destructive ? <p class=\"gb-rich-text__hint text-sm-regular\">{this.hintText}</p> : <p class=\"error_text text-sm-regular\">{this.errorText}</p>}</>\r\n )}\r\n </div>\r\n );\r\n }\r\n}\r\n"]}
1	+ {"version":3,"file":"gb-rich-text.js","sourceRoot":"","sources":["../../../src/components/gb-rich-text/gb-rich-text.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, Method, Prop, State, Watch, h, Fragment } from '@stencil/core';\r\nimport { Editor } from '@tiptap/core';\r\nimport Link from '@tiptap/extension-link';\r\nimport Placeholder from '@tiptap/extension-placeholder';\r\nimport Underline from '@tiptap/extension-underline';\r\nimport StarterKit from '@tiptap/starter-kit';\r\nimport FileHandler from '@tiptap/extension-file-handler';\r\nimport { ResizableImage } from './resizable-image';\r\n\r\n@Component({\r\n tag: 'gb-rich-text',\r\n styleUrl: 'gb-rich-text.css',\r\n shadow: false,\r\n})\r\nexport class GbRichText {\r\n @Prop() label: string = '';\r\n @Prop() placeholder: string = '';\r\n @Prop() showHintText: boolean = true;\r\n @Prop() hintText: string = '';\r\n @Prop() value: any;\r\n @Prop() disabled: boolean = false;\r\n @Prop() destructive: boolean = false;\r\n @Prop() errorText: string = '';\r\n // Toolbar icons to disable, e.g. disabled-icons=\"photo,attachment\" or ['photo', 'attachment'].\r\n @Prop() disabledIcons: string \| string[] = [];\r\n\r\n // Active states tracked for toolbar highlighting\r\n @State() isFocused: boolean = false;\r\n @State() isBold: boolean = false;\r\n @State() isItalic: boolean = false;\r\n @State() isH1: boolean = false;\r\n @State() isH2: boolean = false;\r\n @State() isUnderline: boolean = false;\r\n @State() isQuote: boolean = false;\r\n @State() isLink: boolean = false;\r\n @State() isBulletList: boolean = false;\r\n @State() isOrderedList: boolean = false;\r\n @State() attachments: { file: File; name: string; size: number; type: string }[] = [];\r\n @Event() richTextValueChanged: EventEmitter<{ json: any; html: any }>;\r\n @Event() richTextAttachmentAdded: EventEmitter<{ file: File; name: string; size: number; type: string }>;\r\n @Event() gbBlur: EventEmitter<void>;\r\n @Event() gbFocus: EventEmitter<void>;\r\n\r\n @Element() el: HTMLElement;\r\n\r\n private editor: Editor;\r\n private fileInputEl: HTMLInputElement;\r\n private attachmentInputEl: HTMLInputElement;\r\n\r\n componentDidLoad() {\r\n const editorEl = this.el.querySelector('.gb-rich-text__content') as HTMLElement;\r\n\r\n this.editor = new Editor({\r\n element: editorEl,\r\n extensions: [\r\n StarterKit,\r\n Underline,\r\n Link.configure({ openOnClick: false }),\r\n ResizableImage,\r\n Placeholder.configure({ placeholder: this.placeholder }),\r\n FileHandler.configure({\r\n allowedMimeTypes: ['image/jpeg', 'image/png', 'image/gif'],\r\n }),\r\n ],\r\n content: this.value,\r\n onUpdate: ({ editor }) => {\r\n const json = editor.getJSON();\r\n const html = editor.getHTML();\r\n this.richTextValueChanged.emit({ json: json, html: html });\r\n this.syncActiveStates(editor);\r\n },\r\n onSelectionUpdate: ({ editor }) => {\r\n this.syncActiveStates(editor);\r\n },\r\n onFocus: () => {\r\n this.isFocused = true;\r\n this.gbFocus.emit();\r\n },\r\n onBlur: () => {\r\n this.isFocused = false;\r\n this.gbBlur.emit();\r\n },\r\n });\r\n }\r\n\r\n private handleFileInput(e: Event) {\r\n const file = (e.target as HTMLInputElement).files?.[0];\r\n if (!file) return;\r\n const reader = new FileReader();\r\n reader.onload = () => {\r\n const src = reader.result as string;\r\n this.editor.chain().focus().setImage({ src }).run();\r\n };\r\n reader.readAsDataURL(file);\r\n // Reset so same file can be picked again\r\n (e.target as HTMLInputElement).value = '';\r\n }\r\n\r\n private handleAttachmentInput(e: Event) {\r\n const file = (e.target as HTMLInputElement).files?.[0];\r\n if (!file) return;\r\n\r\n const attachment = { file, name: file.name, size: file.size, type: file.type };\r\n\r\n // Push to local state so UI renders it\r\n this.attachments = [...this.attachments, attachment];\r\n\r\n // Emit to Angular parent\r\n this.richTextAttachmentAdded.emit(attachment);\r\n\r\n // Reset so same file can be picked again\r\n (e.target as HTMLInputElement).value = '';\r\n }\r\n\r\n private removeAttachment(index: number) {\r\n this.attachments = this.attachments.filter((_, i) => i !== index);\r\n }\r\n\r\n private formatFileSize(bytes: number): string {\r\n if (bytes < 1024) return `${bytes} B`;\r\n if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;\r\n return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;\r\n }\r\n\r\n private getFileExtension(name: string): string {\r\n const ext = name.split('.').pop()?.toLowerCase() ?? '';\r\n return ext;\r\n }\r\n\r\n // Syncs toolbar active states to current editor selection\r\n private syncActiveStates(editor: Editor) {\r\n this.isBold = editor.isActive('bold');\r\n this.isItalic = editor.isActive('italic');\r\n this.isUnderline = editor.isActive('underline');\r\n this.isH1 = editor.isActive('heading', { level: 1 });\r\n this.isH2 = editor.isActive('heading', { level: 2 });\r\n this.isQuote = editor.isActive('blockquote');\r\n this.isLink = editor.isActive('link');\r\n this.isBulletList = editor.isActive('bulletList');\r\n this.isOrderedList = editor.isActive('orderedList');\r\n }\r\n\r\n // Handles all toolbar action events from gb-wysiwyg-toolbar\r\n private handleToolbarAction(ev: CustomEvent<string>) {\r\n const e = this.editor;\r\n if (!e) return;\r\n\r\n const actionMap: Record<string, () => void> = {\r\n bold: () => e.chain().focus().toggleBold().run(),\r\n italic: () => e.chain().focus().toggleItalic().run(),\r\n underline: () => e.chain().focus().toggleUnderline().run(),\r\n h1: () => e.chain().focus().toggleHeading({ level: 1 }).run(),\r\n h2: () => e.chain().focus().toggleHeading({ level: 2 }).run(),\r\n quote: () => e.chain().focus().toggleBlockquote().run(),\r\n link: () => {\r\n const url = window.prompt('Enter URL');\r\n if (url) e.chain().focus().setLink({ href: url }).run();\r\n },\r\n bulletList: () => e.chain().focus().toggleBulletList().run(),\r\n orderedList: () => e.chain().focus().toggleOrderedList().run(),\r\n photo: () => this.fileInputEl?.click(),\r\n attachment: () => this.attachmentInputEl?.click(),\r\n };\r\n\r\n actionMap[ev.detail]?.();\r\n this.syncActiveStates(e);\r\n }\r\n\r\n @Watch('value')\r\n handleValueChange(newValue: string) {\r\n if (this.editor && newValue) {\r\n this.editor.commands.setContent(newValue);\r\n }\r\n }\r\n\r\n @Method()\r\n async getRichTextHTML(): Promise<string> {\r\n return this.editor?.getHTML() ?? '';\r\n }\r\n\r\n @Method()\r\n async clearContent(): Promise<void> {\r\n this.editor?.commands.clearContent();\r\n }\r\n\r\n disconnectedCallback() {\r\n this.editor?.destroy();\r\n }\r\n\r\n render() {\r\n return (\r\n <div\r\n class={{\r\n 'gb-rich-text': true,\r\n 'gb-rich-text--focused': this.isFocused,\r\n 'gb-rich-text--error': this.destructive,\r\n 'gb-rich-text--disabled': this.disabled,\r\n }}\r\n >\r\n {this.label && <label class=\"gb-rich-text__label text-sm-medium\">{this.label}</label>}\r\n\r\n <div class=\"gb-rich-text__wrapper\">\r\n <gb-wysiwyg-toolbar\r\n disabledIcons={this.disabledIcons}\r\n is-bold={this.isBold}\r\n is-italic={this.isItalic}\r\n is-h1={this.isH1}\r\n is-h2={this.isH2}\r\n is-underline={this.isUnderline}\r\n is-quote={this.isQuote}\r\n is-link={this.isLink}\r\n is-bullet-list={this.isBulletList}\r\n is-ordered-list={this.isOrderedList}\r\n onToolbarAction={(ev: CustomEvent<string>) => this.handleToolbarAction(ev)}\r\n ></gb-wysiwyg-toolbar>\r\n\r\n {this.destructive && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" class=\"alert_circle\">\r\n <path\r\n d=\"M7.99483 9.99998H8.00081M8.00016 7.99998V5.33331M14.6668 7.99998C14.6668 11.6819 11.6821 14.6666 8.00016 14.6666C4.31826 14.6666 1.3335 11.6819 1.3335 7.99998C1.3335 4.31808 4.31826 1.33331 8.00016 1.33331C11.6821 1.33331 14.6668 4.31808 14.6668 7.99998Z\"\r\n stroke=\"var(--color-icon-danger, #B51726)\"\r\n stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n )}\r\n {this.attachments.length > 0 && (\r\n <div class=\"gb-rich-text__attachments\">\r\n {this.attachments.map((attachment, index) => (\r\n <div class=\"gb-rich-text__attachment-item\" key={index}>\r\n {/* <span class=\"gb-rich-text__attachment-icon\">{this.getFileIcon(attachment.type)}</span> /}\r\n <span class=\"gb-rich-text__attachment-icon\">\r\n <gb-file-type-icon file-type={this.getFileExtension(attachment.name)} file-style=\"default\"></gb-file-type-icon>\r\n </span>\r\n <div class=\"gb-rich-text__attachment-info\">\r\n <span class=\"gb-rich-text__attachment-name text-sm-medium\">{attachment.name}</span>\r\n <span class=\"gb-rich-text__attachment-size text-xs-regular\">{this.formatFileSize(attachment.size)}</span>\r\n </div>\r\n {/ <button\r\n class=\"gb-rich-text__attachment-remove\"\r\n onMouseDown={(ev: MouseEvent) => {\r\n ev.preventDefault();\r\n this.removeAttachment(index);\r\n }}\r\n aria-label=\"Remove attachment\"\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path d=\"M12 4L4 12M4 4l8 8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" />\r\n </svg>\r\n </button> /}\r\n <gb-button-close color=\"gray\" size=\"sm\" onClick={() => this.removeAttachment(index)}></gb-button-close>\r\n </div>\r\n ))}\r\n </div>\r\n )}\r\n\r\n {/ Hidden file input for local image selection /}\r\n <input\r\n ref={el => (this.fileInputEl = el as HTMLInputElement)}\r\n type=\"file\"\r\n accept=\"image/\"\r\n style={{ display: 'none' }}\r\n onChange={(e: Event) => this.handleFileInput(e)}\r\n />\r\n\r\n {/* Hidden file input for attachments /}\r\n <input\r\n ref={el => (this.attachmentInputEl = el as HTMLInputElement)}\r\n type=\"file\"\r\n accept=\".pdf,.doc,.docx,.xls,.xlsx,.csv,.txt,.zip\"\r\n style={{ display: 'none' }}\r\n onChange={(e: Event) => this.handleAttachmentInput(e)}\r\n />\r\n <div class=\"gb-rich-text__content\"></div>\r\n </div>\r\n\r\n {/ {(this.showHintText \|\| this.errorText) && <span class=\"gb-rich-text__hint text-sm-regular\">{this.destructive ? this.errorText : this.hintText}</span>} */}\r\n {this.showHintText && (\r\n <>{!this.destructive ? <p class=\"gb-rich-text__hint text-sm-regular\">{this.hintText}</p> : <p class=\"error_text text-sm-regular\">{this.errorText}</p>}</>\r\n )}\r\n </div>\r\n );\r\n }\r\n}\r\n"]}

package/dist/collection/components/gb-rich-text/resizable-image.js ADDED Viewed

@@ -0,0 +1,84 @@
+import Image from "@tiptap/extension-image";
+// Extends the base Image node with a `width` attribute (persisted as inline
+// style, so it round-trips through getHTML()/getJSON()) and a NodeView that
+// renders a drag handle for resizing. Height is left to `auto` via CSS so
+// the aspect ratio is preserved - only width is user-controlled.
+export const ResizableImage = Image.extend({
+    addAttributes() {
+        var _a;
+        return Object.assign(Object.assign({}, (_a = this.parent) === null || _a === void 0 ? void 0 : _a.call(this)), { width: {
+                default: null,
+                parseHTML: (element) => {
+                    const width = element.style.width || element.getAttribute('width');
+                    return width ? parseInt(width, 10) : null;
+                },
+                renderHTML: (attributes) => {
+                    if (!attributes.width)
+                        return {};
+                    return { style: `width: ${attributes.width}px` };
+                },
+            } });
+    },
+    addNodeView() {
+        return ({ node, getPos, editor }) => {
+            let currentNode = node;
+            const container = document.createElement('div');
+            container.className = 'gb-resizable-image';
+            const img = document.createElement('img');
+            img.src = currentNode.attrs.src;
+            if (currentNode.attrs.alt)
+                img.alt = currentNode.attrs.alt;
+            if (currentNode.attrs.title)
+                img.title = currentNode.attrs.title;
+            if (currentNode.attrs.width)
+                img.style.width = `${currentNode.attrs.width}px`;
+            const handle = document.createElement('span');
+            handle.className = 'gb-resizable-image__handle';
+            handle.contentEditable = 'false';
+            container.appendChild(img);
+            container.appendChild(handle);
+            let startX = 0;
+            let startWidth = 0;
+            const onMouseMove = (event) => {
+                const newWidth = Math.max(40, startWidth + (event.clientX - startX));
+                img.style.width = `${newWidth}px`;
+            };
+            const commitWidth = () => {
+                document.removeEventListener('mousemove', onMouseMove);
+                document.removeEventListener('mouseup', commitWidth);
+                if (typeof getPos !== 'function')
+                    return;
+                const pos = getPos();
+                if (pos == null)
+                    return;
+                const finalWidth = Math.round(img.getBoundingClientRect().width);
+                editor.view.dispatch(editor.view.state.tr.setNodeMarkup(pos, undefined, Object.assign(Object.assign({}, currentNode.attrs), { width: finalWidth })));
+            };
+            handle.addEventListener('mousedown', (event) => {
+                event.preventDefault();
+                event.stopPropagation();
+                startX = event.clientX;
+                startWidth = img.getBoundingClientRect().width;
+                document.addEventListener('mousemove', onMouseMove);
+                document.addEventListener('mouseup', commitWidth);
+            });
+            return {
+                dom: container,
+                update(updatedNode) {
+                    if (updatedNode.type.name !== currentNode.type.name)
+                        return false;
+                    currentNode = updatedNode;
+                    if (img.src !== updatedNode.attrs.src)
+                        img.src = updatedNode.attrs.src;
+                    if (updatedNode.attrs.width)
+                        img.style.width = `${updatedNode.attrs.width}px`;
+                    return true;
+                },
+                // Let the drag handle manage its own mouse events instead of ProseMirror
+                // treating them as a selection/drag gesture on the node.
+                stopEvent: event => handle.contains(event.target),
+            };
+        };
+    },
+});
+//# sourceMappingURL=resizable-image.js.map

package/dist/collection/components/gb-rich-text/resizable-image.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"resizable-image.js","sourceRoot":"","sources":["../../../src/components/gb-rich-text/resizable-image.ts"],"names":[],"mappings":"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","sourcesContent":["import Image from '@tiptap/extension-image';\n\n// Extends the base Image node with a `width` attribute (persisted as inline\n// style, so it round-trips through getHTML()/getJSON()) and a NodeView that\n// renders a drag handle for resizing. Height is left to `auto` via CSS so\n// the aspect ratio is preserved - only width is user-controlled.\nexport const ResizableImage = Image.extend({\n addAttributes() {\n return {\n ...this.parent?.(),\n width: {\n default: null,\n parseHTML: (element: HTMLElement) => {\n const width = element.style.width || element.getAttribute('width');\n return width ? parseInt(width, 10) : null;\n },\n renderHTML: (attributes: { width?: number | null }) => {\n if (!attributes.width) return {};\n return { style: `width: ${attributes.width}px` };\n },\n },\n };\n },\n\n addNodeView() {\n return ({ node, getPos, editor }) => {\n let currentNode = node;\n\n const container = document.createElement('div');\n container.className = 'gb-resizable-image';\n\n const img = document.createElement('img');\n img.src = currentNode.attrs.src;\n if (currentNode.attrs.alt) img.alt = currentNode.attrs.alt;\n if (currentNode.attrs.title) img.title = currentNode.attrs.title;\n if (currentNode.attrs.width) img.style.width = `${currentNode.attrs.width}px`;\n\n const handle = document.createElement('span');\n handle.className = 'gb-resizable-image__handle';\n handle.contentEditable = 'false';\n\n container.appendChild(img);\n container.appendChild(handle);\n\n let startX = 0;\n let startWidth = 0;\n\n const onMouseMove = (event: MouseEvent) => {\n const newWidth = Math.max(40, startWidth + (event.clientX - startX));\n img.style.width = `${newWidth}px`;\n };\n\n const commitWidth = () => {\n document.removeEventListener('mousemove', onMouseMove);\n document.removeEventListener('mouseup', commitWidth);\n\n if (typeof getPos !== 'function') return;\n const pos = getPos();\n if (pos == null) return;\n\n const finalWidth = Math.round(img.getBoundingClientRect().width);\n editor.view.dispatch(\n editor.view.state.tr.setNodeMarkup(pos, undefined, {\n ...currentNode.attrs,\n width: finalWidth,\n }),\n );\n };\n\n handle.addEventListener('mousedown', (event: MouseEvent) => {\n event.preventDefault();\n event.stopPropagation();\n startX = event.clientX;\n startWidth = img.getBoundingClientRect().width;\n document.addEventListener('mousemove', onMouseMove);\n document.addEventListener('mouseup', commitWidth);\n });\n\n return {\n dom: container,\n update(updatedNode) {\n if (updatedNode.type.name !== currentNode.type.name) return false;\n currentNode = updatedNode;\n if (img.src !== updatedNode.attrs.src) img.src = updatedNode.attrs.src;\n if (updatedNode.attrs.width) img.style.width = `${updatedNode.attrs.width}px`;\n return true;\n },\n // Let the drag handle manage its own mouse events instead of ProseMirror\n // treating them as a selection/drag gesture on the node.\n stopEvent: event => handle.contains(event.target as Node),\n };\n };\n },\n});\n"]}