globuswebcomponents 2.11.1 → 2.12.1

package/dist/collection/components/gb-wysiwyg-toolbar/gb-wysiwyg-toolbar.js

@@ -0,0 +1,392 @@
+import { h } from "@stencil/core";
+export class GbWysiwygToolbar {
+    constructor() {
+        this.fontSelector = false;
+        // Active states (passed in from gb-rich-text)
+        this.isBold = false;
+        this.isItalic = false;
+        this.isUnderline = false;
+        this.isH1 = false;
+        this.isH2 = false;
+        this.isQuote = false;
+        this.isLink = false;
+        this.isBulletList = false;
+        this.isOrderedList = false;
+        this.isAttachment = false;
+        this.isPhoto = false;
+        // Mirror props into state so shadow DOM re-renders on change
+        this._isBold = false;
+        this._isItalic = false;
+        this._isUnderline = false;
+        this._isH1 = false;
+        this._isH2 = false;
+        this._isQuote = false;
+        this._isLink = false;
+        this._isBulletList = false;
+        this._isOrderedList = false;
+    }
+    onBoldChange(v) {
+        this._isBold = v;
+    }
+    onItalicChange(v) {
+        this._isItalic = v;
+    }
+    onUnderlineChange(v) {
+        this._isUnderline = v;
+    }
+    onH1Change(v) {
+        this._isH1 = v;
+    }
+    onH2Change(v) {
+        this._isH2 = v;
+    }
+    onQuoteChange(v) {
+        this._isQuote = v;
+    }
+    onLinkChange(v) {
+        this._isLink = v;
+    }
+    onBulletListChange(v) {
+        this._isBulletList = v;
+    }
+    onOrderedListChange(v) {
+        this._isOrderedList = v;
+    }
+    // Sync initial prop values into state on first load
+    componentWillLoad() {
+        this._isBold = this.isBold;
+        this._isItalic = this.isItalic;
+        this._isUnderline = this.isUnderline;
+        this._isH1 = this.isH1;
+        this._isH2 = this.isH2;
+        this._isQuote = this.isQuote;
+        this._isLink = this.isLink;
+        this._isBulletList = this.isBulletList;
+        this._isOrderedList = this.isOrderedList;
+    }
+    emit(action, ev) {
+        ev.preventDefault();
+        this.toolbarAction.emit(action);
+    }
+    render() {
+        return (h("div", { key: '3c67ef0321d9be6d3e5676cefa5c1cc895e311f5', class: "toolbar_wrapper" }, this.fontSelector && (h("div", { key: '1a762d3a41b1afc359ea6cb2fd40ff50cad5ca85', class: "font_selector" }, h("gb-input-dropdown", { key: '0fddeb5ed65afcf932949901f8b62dbdeefe5fae', "show-placeholder": "true", placeholder: "Select an option", size: "sm", state: "default", "show-hint-text": "false", "hint-text": "This is a hint text to help user.", type: "default", text: true, "show-leading-icon": "true", "leading-icon": "assets/search-01.svg", "menu-position": "bottom", icon: "false", value: ['Sora'] }))), h("div", { key: '9cdc881dacc7e149163ff880b6b43094ef63a535', class: "editor_icons" }, h("gb-wysiwyg-editor-icon", { key: 'ad23448e820efe6741c27d07f2846582ea8f6e9f', state: "default", active: this._isBold, type: "bold", onMouseDown: (ev) => this.emit('bold', ev) }), h("gb-wysiwyg-editor-icon", { key: '85205be2180d46829bf27a6bb23757b1d0c92cd7', state: "default", active: this._isItalic, type: "italic", onMouseDown: (ev) => this.emit('italic', ev) }), h("gb-wysiwyg-editor-icon", { key: 'a92cd80c7ce26f73bf59ad3b0d5c80c58fd56833', state: "default", active: this._isUnderline, type: "underline", onMouseDown: (ev) => this.emit('underline', ev) }), h("gb-wysiwyg-editor-icon", { key: '63c3a0a2cc23b91be299a65461fd8d33209451ce', state: "default", active: this._isH1, type: "h1", onMouseDown: (ev) => this.emit('h1', ev) }), h("gb-wysiwyg-editor-icon", { key: 'c6d183d341417daf6a82556f6c657d0ae7b9c331', state: "default", active: this._isH2, type: "h2", onMouseDown: (ev) => this.emit('h2', ev) }), h("gb-wysiwyg-editor-icon", { key: 'cb46dca47975d80726cb829be38eb5f9b9bffd9d', state: "default", active: this._isQuote, type: "quote", onMouseDown: (ev) => this.emit('quote', ev) }), h("gb-wysiwyg-editor-icon", { key: '32cc231273517e3da761cdd762da6bae412e6e45', state: "default", active: this._isLink, type: "link", onMouseDown: (ev) => this.emit('link', ev) }), h("gb-wysiwyg-editor-icon", { key: '2ed586243a6cb8388cf982ab1ae1693c0e3e7a16', state: "default", active: this.isAttachment, type: "attachment", onMouseDown: (ev) => this.emit('attachment', ev) }), h("gb-wysiwyg-editor-icon", { key: 'e954ea2fd98842b574081e5cc7f091910aa2cc7b', state: "default", active: this.isPhoto, type: "photo", onMouseDown: (ev) => this.emit('photo', ev) }), h("gb-wysiwyg-editor-icon", { key: 'b289d2eafbe0c9e3544843073b451cdf787a05c6', state: "default", active: this.isBulletList, type: "list_bullet", onMouseDown: (ev) => this.emit('bulletList', ev) }), h("gb-wysiwyg-editor-icon", { key: '57fd1a735192b15233c2dcd7087351029aef17f4', state: "default", active: this.isOrderedList, type: "list_numbers", onMouseDown: (ev) => this.emit('orderedList', ev) }))));
+    }
+    static get is() { return "gb-wysiwyg-toolbar"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["gb-wysiwyg-toolbar.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["gb-wysiwyg-toolbar.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "fontSelector": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "font-selector",
+                "defaultValue": "false"
+            },
+            "isBold": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "is-bold",
+                "defaultValue": "false"
+            },
+            "isItalic": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "is-italic",
+                "defaultValue": "false"
+            },
+            "isUnderline": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "is-underline",
+                "defaultValue": "false"
+            },
+            "isH1": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "is-h-1",
+                "defaultValue": "false"
+            },
+            "isH2": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "is-h-2",
+                "defaultValue": "false"
+            },
+            "isQuote": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "is-quote",
+                "defaultValue": "false"
+            },
+            "isLink": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "is-link",
+                "defaultValue": "false"
+            },
+            "isBulletList": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "is-bullet-list",
+                "defaultValue": "false"
+            },
+            "isOrderedList": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "is-ordered-list",
+                "defaultValue": "false"
+            },
+            "isAttachment": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "is-attachment",
+                "defaultValue": "false"
+            },
+            "isPhoto": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "is-photo",
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "_isBold": {},
+            "_isItalic": {},
+            "_isUnderline": {},
+            "_isH1": {},
+            "_isH2": {},
+            "_isQuote": {},
+            "_isLink": {},
+            "_isBulletList": {},
+            "_isOrderedList": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "toolbarAction",
+                "name": "toolbarAction",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                }
+            }];
+    }
+    static get watchers() {
+        return [{
+                "propName": "isBold",
+                "methodName": "onBoldChange"
+            }, {
+                "propName": "isItalic",
+                "methodName": "onItalicChange"
+            }, {
+                "propName": "isUnderline",
+                "methodName": "onUnderlineChange"
+            }, {
+                "propName": "isH1",
+                "methodName": "onH1Change"
+            }, {
+                "propName": "isH2",
+                "methodName": "onH2Change"
+            }, {
+                "propName": "isQuote",
+                "methodName": "onQuoteChange"
+            }, {
+                "propName": "isLink",
+                "methodName": "onLinkChange"
+            }, {
+                "propName": "isBulletList",
+                "methodName": "onBulletListChange"
+            }, {
+                "propName": "isOrderedList",
+                "methodName": "onOrderedListChange"
+            }];
+    }
+}
+//# sourceMappingURL=gb-wysiwyg-toolbar.js.map

package/dist/collection/components/gb-wysiwyg-toolbar/gb-wysiwyg-toolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"gb-wysiwyg-toolbar.js","sourceRoot":"","sources":["../../../src/components/gb-wysiwyg-toolbar/gb-wysiwyg-toolbar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAOtF,MAAM,OAAO,gBAAgB;IAL7B;QAMU,iBAAY,GAAY,KAAK,CAAC;QAEtC,8CAA8C;QACtC,WAAM,GAAY,KAAK,CAAC;QACxB,aAAQ,GAAY,KAAK,CAAC;QAC1B,gBAAW,GAAY,KAAK,CAAC;QAC7B,SAAI,GAAY,KAAK,CAAC;QACtB,SAAI,GAAY,KAAK,CAAC;QACtB,YAAO,GAAY,KAAK,CAAC;QACzB,WAAM,GAAY,KAAK,CAAC;QACxB,iBAAY,GAAY,KAAK,CAAC;QAC9B,kBAAa,GAAY,KAAK,CAAC;QAC/B,iBAAY,GAAY,KAAK,CAAC;QAC9B,YAAO,GAAY,KAAK,CAAC;QAEjC,6DAA6D;QACpD,YAAO,GAAY,KAAK,CAAC;QACzB,cAAS,GAAY,KAAK,CAAC;QAC3B,iBAAY,GAAY,KAAK,CAAC;QAC9B,UAAK,GAAY,KAAK,CAAC;QACvB,UAAK,GAAY,KAAK,CAAC;QACvB,aAAQ,GAAY,KAAK,CAAC;QAC1B,YAAO,GAAY,KAAK,CAAC;QACzB,kBAAa,GAAY,KAAK,CAAC;QAC/B,mBAAc,GAAY,KAAK,CAAC;KA4F1C;IAzFkB,YAAY,CAAC,CAAU;QACtC,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC;IACnB,CAAC;IACkB,cAAc,CAAC,CAAU;QAC1C,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC;IACrB,CAAC;IACqB,iBAAiB,CAAC,CAAU;QAChD,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;IACxB,CAAC;IACc,UAAU,CAAC,CAAU;QAClC,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC;IACjB,CAAC;IACc,UAAU,CAAC,CAAU;QAClC,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC;IACjB,CAAC;IACiB,aAAa,CAAC,CAAU;QACxC,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;IACpB,CAAC;IACgB,YAAY,CAAC,CAAU;QACtC,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC;IACnB,CAAC;IACsB,kBAAkB,CAAC,CAAU;QAClD,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC;IACzB,CAAC;IACuB,mBAAmB,CAAC,CAAU;QACpD,IAAI,CAAC,cAAc,GAAG,CAAC,CAAC;IAC1B,CAAC;IAED,oDAAoD;IACpD,iBAAiB;QACf,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,MAAM,CAAC;QAC3B,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC;QAC/B,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,WAAW,CAAC;QACrC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC;QACvB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC;QACvB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC;QAC7B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,MAAM,CAAC;QAC3B,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,YAAY,CAAC;QACvC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,aAAa,CAAC;IAC3C,CAAC;IAEO,IAAI,CAAC,MAAc,EAAE,EAAc;QACzC,EAAE,CAAC,cAAc,EAAE,CAAC;QACpB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAClC,CAAC;IAED,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAC,iBAAiB;YACzB,IAAI,CAAC,YAAY,IAAI,CACpB,4DAAK,KAAK,EAAC,eAAe;gBACxB,8FACmB,MAAM,EACvB,WAAW,EAAC,kBAAkB,EAC9B,IAAI,EAAC,IAAI,EACT,KAAK,EAAC,SAAS,oBACA,OAAO,eACZ,mCAAmC,EAC7C,IAAI,EAAC,SAAS,EACd,IAAI,EAAE,IAAI,uBACQ,MAAM,kBACX,sBAAsB,mBACrB,QAAQ,EACtB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,CAAC,MAAM,CAAC,GACI,CACjB,CACP;YACD,4DAAK,KAAK,EAAC,cAAc;gBACvB,+EAAwB,KAAK,EAAC,SAAS,EAAC,MAAM,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,EAAC,MAAM,EAAC,WAAW,EAAE,CAAC,EAAc,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE,CAAC,GAA2B;gBAC3J,+EAAwB,KAAK,EAAC,SAAS,EAAC,MAAM,EAAE,IAAI,CAAC,SAAS,EAAE,IAAI,EAAC,QAAQ,EAAC,WAAW,EAAE,CAAC,EAAc,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,EAAE,CAAC,GAA2B;gBACjK,+EAAwB,KAAK,EAAC,SAAS,EAAC,MAAM,EAAE,IAAI,CAAC,YAAY,EAAE,IAAI,EAAC,WAAW,EAAC,WAAW,EAAE,CAAC,EAAc,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,EAAE,CAAC,GAA2B;gBAC1K,+EAAwB,KAAK,EAAC,SAAS,EAAC,MAAM,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAE,CAAC,EAAc,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC,GAA2B;gBACrJ,+EAAwB,KAAK,EAAC,SAAS,EAAC,MAAM,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAE,CAAC,EAAc,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC,GAA2B;gBACrJ,+EAAwB,KAAK,EAAC,SAAS,EAAC,MAAM,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAC,OAAO,EAAC,WAAW,EAAE,CAAC,EAAc,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,EAAE,CAAC,GAA2B;gBAC9J,+EAAwB,KAAK,EAAC,SAAS,EAAC,MAAM,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,EAAC,MAAM,EAAC,WAAW,EAAE,CAAC,EAAc,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE,CAAC,GAA2B;gBAC3J,+EACE,KAAK,EAAC,SAAS,EACf,MAAM,EAAE,IAAI,CAAC,YAAY,EACzB,IAAI,EAAC,YAAY,EACjB,WAAW,EAAE,CAAC,EAAc,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,EAAE,CAAC,GACpC;gBAC1B,+EAAwB,KAAK,EAAC,SAAS,EAAC,MAAM,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,EAAC,OAAO,EAAC,WAAW,EAAE,CAAC,EAAc,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,EAAE,CAAC,GAA2B;gBAC7J,+EAAwB,KAAK,EAAC,SAAS,EAAC,MAAM,EAAE,IAAI,CAAC,YAAY,EAAE,IAAI,EAAC,aAAa,EAAC,WAAW,EAAE,CAAC,EAAc,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,EAAE,CAAC,GAA2B;gBAC7K,+EAAwB,KAAK,EAAC,SAAS,EAAC,MAAM,EAAE,IAAI,CAAC,aAAa,EAAE,IAAI,EAAC,cAAc,EAAC,WAAW,EAAE,CAAC,EAAc,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,EAAE,CAAC,GAA2B,CAC5K,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, h, Prop, State, Watch } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'gb-wysiwyg-toolbar',\r\n  styleUrl: 'gb-wysiwyg-toolbar.css',\r\n  shadow: true,\r\n})\r\nexport class GbWysiwygToolbar {\r\n  @Prop() fontSelector: boolean = false;\r\n\r\n  // Active states (passed in from gb-rich-text)\r\n  @Prop() isBold: boolean = false;\r\n  @Prop() isItalic: boolean = false;\r\n  @Prop() isUnderline: boolean = false;\r\n  @Prop() isH1: boolean = false;\r\n  @Prop() isH2: boolean = false;\r\n  @Prop() isQuote: boolean = false;\r\n  @Prop() isLink: boolean = false;\r\n  @Prop() isBulletList: boolean = false;\r\n  @Prop() isOrderedList: boolean = false;\r\n  @Prop() isAttachment: boolean = false;\r\n  @Prop() isPhoto: boolean = false;\r\n\r\n  // Mirror props into state so shadow DOM re-renders on change\r\n  @State() _isBold: boolean = false;\r\n  @State() _isItalic: boolean = false;\r\n  @State() _isUnderline: boolean = false;\r\n  @State() _isH1: boolean = false;\r\n  @State() _isH2: 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  @Event() toolbarAction: EventEmitter<string>;\r\n  \r\n  @Watch('isBold') onBoldChange(v: boolean) {\r\n    this._isBold = v;\r\n  }\r\n  @Watch('isItalic') onItalicChange(v: boolean) {\r\n    this._isItalic = v;\r\n  }\r\n  @Watch('isUnderline') onUnderlineChange(v: boolean) {\r\n    this._isUnderline = v;\r\n  }\r\n  @Watch('isH1') onH1Change(v: boolean) {\r\n    this._isH1 = v;\r\n  }\r\n  @Watch('isH2') onH2Change(v: boolean) {\r\n    this._isH2 = v;\r\n  }\r\n  @Watch('isQuote') onQuoteChange(v: boolean) {\r\n    this._isQuote = v;\r\n  }\r\n  @Watch('isLink') onLinkChange(v: boolean) {\r\n    this._isLink = v;\r\n  }\r\n  @Watch('isBulletList') onBulletListChange(v: boolean) {\r\n    this._isBulletList = v;\r\n  }\r\n  @Watch('isOrderedList') onOrderedListChange(v: boolean) {\r\n    this._isOrderedList = v;\r\n  }\r\n\r\n  // Sync initial prop values into state on first load\r\n  componentWillLoad() {\r\n    this._isBold = this.isBold;\r\n    this._isItalic = this.isItalic;\r\n    this._isUnderline = this.isUnderline;\r\n    this._isH1 = this.isH1;\r\n    this._isH2 = this.isH2;\r\n    this._isQuote = this.isQuote;\r\n    this._isLink = this.isLink;\r\n    this._isBulletList = this.isBulletList;\r\n    this._isOrderedList = this.isOrderedList;\r\n  }\r\n\r\n  private emit(action: string, ev: MouseEvent) {\r\n    ev.preventDefault();\r\n    this.toolbarAction.emit(action);\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class=\"toolbar_wrapper\">\r\n        {this.fontSelector && (\r\n          <div class=\"font_selector\">\r\n            <gb-input-dropdown\r\n              show-placeholder=\"true\"\r\n              placeholder=\"Select an option\"\r\n              size=\"sm\"\r\n              state=\"default\"\r\n              show-hint-text=\"false\"\r\n              hint-text=\"This is a hint text to help user.\"\r\n              type=\"default\"\r\n              text={true}\r\n              show-leading-icon=\"true\"\r\n              leading-icon=\"assets/search-01.svg\"\r\n              menu-position=\"bottom\"\r\n              icon=\"false\"\r\n              value={['Sora']}\r\n            ></gb-input-dropdown>\r\n          </div>\r\n        )}\r\n        <div class=\"editor_icons\">\r\n          <gb-wysiwyg-editor-icon state=\"default\" active={this._isBold} type=\"bold\" onMouseDown={(ev: MouseEvent) => this.emit('bold', ev)}></gb-wysiwyg-editor-icon>\r\n          <gb-wysiwyg-editor-icon state=\"default\" active={this._isItalic} type=\"italic\" onMouseDown={(ev: MouseEvent) => this.emit('italic', ev)}></gb-wysiwyg-editor-icon>\r\n          <gb-wysiwyg-editor-icon state=\"default\" active={this._isUnderline} type=\"underline\" onMouseDown={(ev: MouseEvent) => this.emit('underline', ev)}></gb-wysiwyg-editor-icon>\r\n          <gb-wysiwyg-editor-icon state=\"default\" active={this._isH1} type=\"h1\" onMouseDown={(ev: MouseEvent) => this.emit('h1', ev)}></gb-wysiwyg-editor-icon>\r\n          <gb-wysiwyg-editor-icon state=\"default\" active={this._isH2} type=\"h2\" onMouseDown={(ev: MouseEvent) => this.emit('h2', ev)}></gb-wysiwyg-editor-icon>\r\n          <gb-wysiwyg-editor-icon state=\"default\" active={this._isQuote} type=\"quote\" onMouseDown={(ev: MouseEvent) => this.emit('quote', ev)}></gb-wysiwyg-editor-icon>\r\n          <gb-wysiwyg-editor-icon state=\"default\" active={this._isLink} type=\"link\" onMouseDown={(ev: MouseEvent) => this.emit('link', ev)}></gb-wysiwyg-editor-icon>\r\n          <gb-wysiwyg-editor-icon\r\n            state=\"default\"\r\n            active={this.isAttachment}\r\n            type=\"attachment\"\r\n            onMouseDown={(ev: MouseEvent) => this.emit('attachment', ev)}\r\n          ></gb-wysiwyg-editor-icon>\r\n          <gb-wysiwyg-editor-icon state=\"default\" active={this.isPhoto} type=\"photo\" onMouseDown={(ev: MouseEvent) => this.emit('photo', ev)}></gb-wysiwyg-editor-icon>\r\n          <gb-wysiwyg-editor-icon state=\"default\" active={this.isBulletList} type=\"list_bullet\" onMouseDown={(ev: MouseEvent) => this.emit('bulletList', ev)}></gb-wysiwyg-editor-icon>\r\n          <gb-wysiwyg-editor-icon state=\"default\" active={this.isOrderedList} type=\"list_numbers\" onMouseDown={(ev: MouseEvent) => this.emit('orderedList', ev)}></gb-wysiwyg-editor-icon>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/components/test-input-tag/test-input-tag.js

@@ -71,7 +71,7 @@ export class TestInputTag {
         this.exportValue.emit(this.selectedStaff);
     }
     render() {
-        return (h("div", { key: 'c63d16d76b53b2d3f2488a4470380f42d0c8d2b6', class: "input_group", ref: el => (this.inputGroupElement = el) }, h("label", { key: 'db7602662bfc907b82bdc5fe8c85d7a621d3268b', htmlFor: this.idOfInput }, this.labelText), h("div", { key: 'd89ddbcb89268627c9b38acaae44887fd99f30d8', class: "input_like_parent", onClick: () => (this.dropdownOpen = !this.dropdownOpen) }, h("input", { key: '8b23410ecfcf67b118512d1db6b30546aec27cfa', id: this.idOfInput, class: "input_like", type: "text", placeholder: this.placeholderText, value: this.inputValue, readOnly: this.isReadOnly, ref: el => (this.inputElement = el), onBlur: () => this.exportSelectedStaff() }), h("div", { key: '5324aa7f2cf12dc8b03cf6288aed8987660d5570', class: `results_display ${this.selectedStaff.length >= 1 ? 'show_results' : ''}`, ref: el => (this.resultsDisplayElement = el) }, this.selectedStaff.map((staff, index) => (
+        return (h("div", { key: '78e176222b5590be44cfdbf88b1e5ed8bd071465', class: "input_group", ref: el => (this.inputGroupElement = el) }, h("label", { key: 'f6591d283ef4779284e765f20fc9f56730b138e1', htmlFor: this.idOfInput }, this.labelText), h("div", { key: 'e9df5ef15b6c37430a558e3e5c6ff1a8028931aa', class: "input_like_parent", onClick: () => (this.dropdownOpen = !this.dropdownOpen) }, h("input", { key: 'f6ac9cf7ba0f9a169929e6c8ba84eed4b6d125b2', id: this.idOfInput, class: "input_like", type: "text", placeholder: this.placeholderText, value: this.inputValue, readOnly: this.isReadOnly, ref: el => (this.inputElement = el), onBlur: () => this.exportSelectedStaff() }), h("div", { key: '4640c4c092170c282e3d67a3447c614d42ea5ad6', class: `results_display ${this.selectedStaff.length >= 1 ? 'show_results' : ''}`, ref: el => (this.resultsDisplayElement = el) }, this.selectedStaff.map((staff, index) => (
         //   <span>
         //     {staff.fullname}
         //     <img
@@ -80,7 +80,7 @@ export class TestInputTag {
         //       onClick={() => this.removeStaff(index)}
         //     />
         //   </span>
-        h("gb-tag", { size: "sm", action: "X_close", icon: "avatar", onClick: () => this.removeStaff(index) }, h("h1", { slot: "initials" }, staff.fullname.split(' ').map(part => part.charAt(0).toUpperCase())), h("p", null, staff.fullname.split(' ')[0])))))), this.show && (h("div", { key: '5b7afe1c44efaa861e7ec54ac2c17c4bf2390ec5', class: `dropdown_menu ${this.show ? 'show' : ''}` }, this.staffInfo.map(staff => (
+        h("gb-tag", { size: "sm", action: "X_close", icon: "avatar", onClick: () => this.removeStaff(index) }, h("h1", { slot: "initials" }, staff.fullname.split(' ').map(part => part.charAt(0).toUpperCase())), h("p", null, staff.fullname.split(' ')[0])))))), this.show && (h("div", { key: '2a3bd5a74d5c6c896b506a4f303a2096f233f51c', class: `dropdown_menu ${this.show ? 'show' : ''}` }, this.staffInfo.map(staff => (
         //   <li class="aList" onClick={() => this.selectStaff(staff)}>
         //     <div>{staff.fullname}</div>
         //     <div>{staff.email}</div>

package/dist/collection/models/reusableModels.js.map

@@ -1 +1 @@
-{"version":3,"file":"reusableModels.js","sourceRoot":"","sources":["../../src/models/reusableModels.ts"],"names":[],"mappings":"AAIA,MAAM,CAAN,IAAY,SAGX;AAHD,WAAY,SAAS;IACnB,gCAAmB,CAAA;IACnB,kCAAqB,CAAA;AACvB,CAAC,EAHW,SAAS,KAAT,SAAS,QAGpB;AAMD,MAAM,CAAN,IAAY,aAKX;AALD,WAAY,aAAa;IACvB,yCAAwB,CAAA;IACxB,gCAAe,CAAA;IACf,oCAAmB,CAAA;IACnB,gCAAe,CAAA;AACjB,CAAC,EALW,aAAa,KAAb,aAAa,QAKxB;AAED,MAAM,CAAN,IAAY,qBAGX;AAHD,WAAY,qBAAqB;IAC/B,0CAAiB,CAAA;IACjB,4CAAmB,CAAA;AACrB,CAAC,EAHW,qBAAqB,KAArB,qBAAqB,QAGhC","sourcesContent":["export type GeneralSizes = 'xxxxl' | 'xxxl' | 'xxl' | 'xl' | 'lg' | 'md' | 'sm' | 'xs' | 'xxs' | 'profile_lg' | 'profile_md' | 'profile_sm';\r\n\r\nexport type GeneralHierarchies = 'primary' | 'secondary_gray' | 'secondary_color' | 'tertiary_gray' | 'tertiary_color' | 'link_gray' | 'link_color';\r\n\r\nexport enum StateEnum {\r\n  Default = 'default',\r\n  Disabled = 'disabled',\r\n}\r\n\r\nexport type ArrowPositions = 'bottom_center' | 'bottom_left' | 'bottom_right' | 'top_center' | 'left' | 'right' | 'none' | 'center';\r\n\r\nexport type CheckBoxVariants = 'checkbox' | 'check_circle' | 'radio';\r\n\r\nexport enum BorderWeights {\r\n  VeryLight = 'very_light',\r\n  Light = 'light',\r\n  Regular = 'regular',\r\n  Heavy = 'heavy',\r\n}\r\n\r\nexport enum OnlineIndicatorStates {\r\n  Online = 'online',\r\n  Offline = 'offline',\r\n}\r\n\r\nexport type BreakPoints = 'desktop' | 'mobile';\r\n\r\nexport type FileUploadIconType = 'solid' | 'outline';\r\n\r\nexport type FileUploadStates = 'default' | 'in_progress' | 'complete' | 'hover' | 'disabled' | 'error';\r\n\r\nexport type GeneralColors = 'default' | 'gray' | 'primary' | 'error' | 'warning' | 'success' | 'discovery' | 'information' | 'pink' | 'purple' | 'white';\r\n\r\nexport type PaginationNumberShapes = 'square' | 'circle';\r\n\r\nexport type PaginationTypes =\r\n  | 'page_default'\r\n  | 'page_minimal_center_aligned'\r\n  | 'card_default'\r\n  | 'card_minimal_right_aligned'\r\n  | 'card_minimal_left_aligned'\r\n  | 'card_minimal_center_aligned'\r\n  | 'card_button_group_right_aligned'\r\n  | 'card_button_group_left_aligned'\r\n  | 'card_button_group_center_aligned';\r\n\r\nexport type TabTypes =\r\n  | 'button_primary'\r\n  | 'button_gray'\r\n  | 'button_white'\r\n  | 'rounded_button_white'\r\n  | 'underline'\r\n  | 'underline_filled'\r\n  | 'line'\r\n  | 'button_white_border'\r\n  | 'rounded_button_white_border'\r\n  | 'button_gray_border';\r\n\r\nexport type GeneralBackgroundCategories = 'plain_background' | 'colored_background';\r\n\r\nexport type InputFieldTypes =\r\n  | 'default'\r\n  | 'icon_leading'\r\n  | 'leading_dropdown'\r\n  | 'trailing_dropdown'\r\n  | 'leading_text'\r\n  | 'payment_input'\r\n  | 'tags'\r\n  | 'trailing_button'\r\n  | 'password'\r\n  | 'password_icon_leading'\r\n  | 'count';\r\n\r\nexport type DropdownTypes = 'default' | 'icon_leading' | 'avatar_leading' | 'dot_leading' | 'checkbox' | 'search' | 'tags';\r\n\r\nexport type ColorTypes = 'gray' | 'blue' | 'cyan' | 'pink' | 'purple' | 'green' | 'yellow' | 'red' | 'white';\r\n\r\nexport type DropdownItemTypes = string | number | { name: string | number; username: string; selected?: boolean };\r\n\r\nexport type PaginationDotTypes = 'dot' | 'line';\r\n\r\nexport type FileIconStyles = 'default' | 'gray' | 'solid';\r\n\r\nexport type FileIconTypes = 'pdf' | 'csv' | 'jpg' | 'jpeg' | 'ppt' | 'pptx' | 'doc' | 'docx' | 'xls' | 'xlsx' | 'svg' | 'txt' | 'zip' | 'rar' | 'mp3' | 'mp4' | 'png' | 'empty';\r\n\r\nexport type TableCellTypes = 'text' | 'lead_text' | 'lead_checkbox' | 'badge';\r\n\r\nexport type ProgressStepStatus = 'incomplete' | 'current' | 'complete';\r\n\r\nexport type ProgressStepTypes = 'icon_only' | 'icon_left' | 'icon_top' | 'text_line' | 'featured_icon_left' | 'featured_icon_top';\r\n\r\nexport type ProgressStepStates = 'default' | 'destructive';\r\n\r\nexport type BadgeTypes = 'pill_color' | 'pill_outline' | 'badge_color' | 'badge_modern';\r\n\r\nexport type GeneralStyles = 'standard' | 'compact';\r\n\r\nexport type StateType = 'default' | 'disabled' | 'applied' | 'loading';\r\n\r\nexport type ButtonGroupTypes = 'false' | 'leading' | 'only' | 'dot' | 'checkbox';\r\n\r\nexport type ThemeTypes = 'system' | 'light' | 'dark';\r\n\r\nexport type BadgeIconTypes = 'dot' | 'avatar' | 'icon_leading' | 'icon_trailing' | 'country' | 'only' | 'false';\r\n\r\nexport type DropdownRoles = { badgeLabel: string; badgeColor: GeneralColors; badgeType: BadgeTypes };\r\n\r\nexport type StepperType = {\r\n  state: ProgressStepStates;\r\n  status: ProgressStepStatus;\r\n  label?: string;\r\n  supportingText?: string;\r\n};\r\n\r\nexport type DetailCellType = 'information' | 'document' | 'status' | 'button';\r\n\r\nexport type MetricFeaturedIconTypes = 'glassmorphism' | 'circular_filled';\r\n\r\nexport interface DropdownListGroup {\r\n  icon: string;\r\n  label: string;\r\n  shortcut: string;\r\n}\r\n\r\nexport type CloseButtonPositions = 'left' | 'right';\r\n\r\nexport interface Notification {\r\n  label: string;\r\n  time: string;\r\n  desc: string;\r\n  icon: string;\r\n}\r\n\r\nexport type IllustrationTypes = 'cloud' | 'box' | 'documents' | 'credit_card';\r\n\r\nexport type PatternTypes = 'circles' | 'grid' | 'grid_dot' | 'squares';\r\n\r\nexport type MobilePosition = 'top_left' | 'top_right' | 'bottom_left' | 'bottom_right';\r\n\r\nexport interface TableColumn {\r\n  key: string;\r\n  label: string;\r\n  transform?: {};\r\n  value?: (row: any) => any;\r\n  supportingText?: string | ((row: any) => string);\r\n  width?: string;\r\n  align?: 'left' | 'center' | 'right';\r\n  stickyRight?: boolean;\r\n  helpIcon?: boolean;\r\n  sortable?: boolean;\r\n  sortType?: 'string' | 'number' | 'date';\r\n  visible?: boolean;\r\n  sortComparator?: (a: any, b: any) => number;\r\n  cellComponent?: string;\r\n  cellActionType?: 'dropdown' | 'void';\r\n  cellProps?: ((row: any) => { [key: string]: any }) | { [key: string]: any };\r\n  cellSlots?: {\r\n    default?: {\r\n      tag?: string; // e.g., 'p', 'span' to wrap content\r\n      content: (row: any) => string | any; // Function to get slot content\r\n    };\r\n    named?: {\r\n      [slotName: string]: {\r\n        tag: string; // e.g., 'p', 'h1', 'span'\r\n        content: (row: any) => string | any; // Function to get slot content\r\n      };\r\n    };\r\n  };\r\n  cellClass?: string | ((row: any) => string);\r\n  cellStyle?: { [key: string]: string } | ((row: any) => { [key: string]: string });\r\n  onClick?: () => void;\r\n  mobile?: {\r\n    position?: MobilePosition;\r\n  };\r\n  gridCard?: {\r\n    buttonIcon?: string;\r\n    buttonText?: string;\r\n  }\r\n}\r\n\r\nexport interface RowAction {\r\n  label: string;\r\n  icon?: string;\r\n  action: string; // emitted event name\r\n  disabled?: boolean;\r\n  destructive?: boolean;\r\n  type?: 'button' | 'dropdown';\r\n}\r\n\r\nexport interface DropdownOption {\r\n  label: string;\r\n  icon?: string;\r\n  action: string; // emitted event name\r\n  disabled?: boolean;\r\n}\r\n\r\nexport type PortalPlacement =\r\n  | 'top'\r\n  | 'top-start'\r\n  | 'top-end'\r\n  | 'bottom'\r\n  | 'bottom-start'\r\n  | 'bottom-end'\r\n  | 'left'\r\n  | 'left-start'\r\n  | 'left-end'\r\n  | 'right'\r\n  | 'right-start'\r\n  | 'right-end';\r\n\r\nexport interface FilterField {\r\n  tag: 'gb-date-range' | 'gb-input-dropdown' | 'gb-slider' | string;\r\n  key: string | { start: string; end: string }; // date ranges need two keys\r\n  event: string | { start: string; end: string }; // date ranges need two events\r\n  label?: string;\r\n  props?: any;\r\n  default?: any;\r\n}\r\n\r\nexport interface FilterConfig {\r\n  title: string;\r\n  showClearButton?: boolean;\r\n  fields: FilterField[];\r\n  initialValues: {\r\n    pageNumber: number;\r\n    pageSize: number;\r\n  };\r\n  appliedValues?: Record<string, any>;\r\n}\r\n"]}
+{"version":3,"file":"reusableModels.js","sourceRoot":"","sources":["../../src/models/reusableModels.ts"],"names":[],"mappings":"AAIA,MAAM,CAAN,IAAY,SAGX;AAHD,WAAY,SAAS;IACnB,gCAAmB,CAAA;IACnB,kCAAqB,CAAA;AACvB,CAAC,EAHW,SAAS,KAAT,SAAS,QAGpB;AAMD,MAAM,CAAN,IAAY,aAKX;AALD,WAAY,aAAa;IACvB,yCAAwB,CAAA;IACxB,gCAAe,CAAA;IACf,oCAAmB,CAAA;IACnB,gCAAe,CAAA;AACjB,CAAC,EALW,aAAa,KAAb,aAAa,QAKxB;AAED,MAAM,CAAN,IAAY,qBAGX;AAHD,WAAY,qBAAqB;IAC/B,0CAAiB,CAAA;IACjB,4CAAmB,CAAA;AACrB,CAAC,EAHW,qBAAqB,KAArB,qBAAqB,QAGhC","sourcesContent":["export type GeneralSizes = 'xxxxl' | 'xxxl' | 'xxl' | 'xl' | 'lg' | 'md' | 'sm' | 'xs' | 'xxs' | 'profile_lg' | 'profile_md' | 'profile_sm';\r\n\r\nexport type GeneralHierarchies = 'primary' | 'secondary_gray' | 'secondary_color' | 'tertiary_gray' | 'tertiary_color' | 'link_gray' | 'link_color';\r\n\r\nexport enum StateEnum {\r\n  Default = 'default',\r\n  Disabled = 'disabled',\r\n}\r\n\r\nexport type ArrowPositions = 'bottom_center' | 'bottom_left' | 'bottom_right' | 'top_center' | 'left' | 'right' | 'none' | 'center';\r\n\r\nexport type CheckBoxVariants = 'checkbox' | 'check_circle' | 'radio';\r\n\r\nexport enum BorderWeights {\r\n  VeryLight = 'very_light',\r\n  Light = 'light',\r\n  Regular = 'regular',\r\n  Heavy = 'heavy',\r\n}\r\n\r\nexport enum OnlineIndicatorStates {\r\n  Online = 'online',\r\n  Offline = 'offline',\r\n}\r\n\r\nexport type BreakPoints = 'desktop' | 'mobile';\r\n\r\nexport type FileUploadIconType = 'solid' | 'outline';\r\n\r\nexport type FileUploadStates = 'default' | 'in_progress' | 'complete' | 'hover' | 'disabled' | 'error';\r\n\r\nexport type GeneralColors = 'default' | 'gray' | 'primary' | 'error' | 'warning' | 'success' | 'discovery' | 'information' | 'pink' | 'purple' | 'white';\r\n\r\nexport type PaginationNumberShapes = 'square' | 'circle';\r\n\r\nexport type PaginationTypes =\r\n  | 'page_default'\r\n  | 'page_minimal_center_aligned'\r\n  | 'card_default'\r\n  | 'card_minimal_right_aligned'\r\n  | 'card_minimal_left_aligned'\r\n  | 'card_minimal_center_aligned'\r\n  | 'card_button_group_right_aligned'\r\n  | 'card_button_group_left_aligned'\r\n  | 'card_button_group_center_aligned';\r\n\r\nexport type TabTypes =\r\n  | 'button_primary'\r\n  | 'button_gray'\r\n  | 'button_white'\r\n  | 'rounded_button_white'\r\n  | 'underline'\r\n  | 'underline_filled'\r\n  | 'line'\r\n  | 'button_white_border'\r\n  | 'rounded_button_white_border'\r\n  | 'button_gray_border';\r\n\r\nexport type GeneralBackgroundCategories = 'plain_background' | 'colored_background';\r\n\r\nexport type InputFieldTypes =\r\n  | 'default'\r\n  | 'icon_leading'\r\n  | 'leading_dropdown'\r\n  | 'trailing_dropdown'\r\n  | 'leading_text'\r\n  | 'payment_input'\r\n  | 'tags'\r\n  | 'trailing_button'\r\n  | 'password'\r\n  | 'password_icon_leading'\r\n  | 'count';\r\n\r\nexport type DropdownTypes = 'default' | 'icon_leading' | 'avatar_leading' | 'dot_leading' | 'checkbox' | 'search' | 'tags';\r\n\r\nexport type ColorTypes = 'gray' | 'blue' | 'cyan' | 'pink' | 'purple' | 'green' | 'yellow' | 'red' | 'white';\r\n\r\nexport type DropdownItemTypes = string | number | { name: string | number; username: string; selected?: boolean };\r\n\r\nexport type PaginationDotTypes = 'dot' | 'line';\r\n\r\nexport type FileIconStyles = 'default' | 'gray' | 'solid';\r\n\r\nexport type FileIconTypes = 'pdf' | 'csv' | 'jpg' | 'jpeg' | 'ppt' | 'pptx' | 'doc' | 'docx' | 'xls' | 'xlsx' | 'svg' | 'txt' | 'zip' | 'rar' | 'mp3' | 'mp4' | 'png' | 'empty';\r\n\r\nexport type TableCellTypes = 'text' | 'lead_text' | 'lead_checkbox' | 'badge';\r\n\r\nexport type ProgressStepStatus = 'incomplete' | 'current' | 'complete';\r\n\r\nexport type ProgressStepTypes = 'icon_only' | 'icon_left' | 'icon_top' | 'text_line' | 'featured_icon_left' | 'featured_icon_top';\r\n\r\nexport type ProgressStepStates = 'default' | 'destructive';\r\n\r\nexport type BadgeTypes = 'pill_color' | 'pill_outline' | 'badge_color' | 'badge_modern';\r\n\r\nexport type GeneralStyles = 'standard' | 'compact';\r\n\r\nexport type StateType = 'default' | 'disabled' | 'applied' | 'loading';\r\n\r\nexport type ButtonGroupTypes = 'false' | 'leading' | 'only' | 'dot' | 'checkbox';\r\n\r\nexport type ThemeTypes = 'system' | 'light' | 'dark';\r\n\r\nexport type BadgeIconTypes = 'dot' | 'avatar' | 'icon_leading' | 'icon_trailing' | 'country' | 'only' | 'false';\r\n\r\nexport type DropdownRoles = { badgeLabel: string; badgeColor: GeneralColors; badgeType: BadgeTypes };\r\n\r\nexport type StepperType = {\r\n  state: ProgressStepStates;\r\n  status: ProgressStepStatus;\r\n  label?: string;\r\n  supportingText?: string;\r\n};\r\n\r\nexport type DetailCellType = 'information' | 'document' | 'status' | 'button';\r\n\r\nexport type MetricFeaturedIconTypes = 'glassmorphism' | 'circular_filled';\r\n\r\nexport interface DropdownListGroup {\r\n  icon: string;\r\n  label: string;\r\n  shortcut: string;\r\n}\r\n\r\nexport type CloseButtonPositions = 'left' | 'right';\r\n\r\nexport interface Notification {\r\n  label: string;\r\n  time: string;\r\n  desc: string;\r\n  icon: string;\r\n}\r\n\r\nexport type IllustrationTypes = 'cloud' | 'box' | 'documents' | 'credit_card';\r\n\r\nexport type PatternTypes = 'circles' | 'grid' | 'grid_dot' | 'squares';\r\n\r\nexport type MobilePosition = 'top_left' | 'top_right' | 'bottom_left' | 'bottom_right';\r\n\r\nexport interface TableColumn {\r\n  key: string;\r\n  label: string;\r\n  value?: (row: any) => any;\r\n  supportingText?: string | ((row: any) => string);\r\n  width?: string;\r\n  align?: 'left' | 'center' | 'right';\r\n  helpIcon?: boolean;\r\n  sortable?: boolean;\r\n  sortType?: 'string' | 'number' | 'date';\r\n  visible?: boolean;\r\n  cellComponent?: string;\r\n  searchable?: boolean;\r\n  cellProps?: ((row: any) => { [key: string]: any }) | { [key: string]: any };\r\n  cellSlots?: {\r\n    default?: {\r\n      tag?: string; // e.g., 'p', 'span' to wrap content\r\n      content: (row: any) => string | any; // Function to get slot content\r\n    };\r\n    named?: {\r\n      [slotName: string]: {\r\n        tag: string; // e.g., 'p', 'h1', 'span'\r\n        content: (row: any) => string | any; // Function to get slot content\r\n      };\r\n    };\r\n  };\r\n  cellClass?: string | ((row: any) => string);\r\n  cellStyle?: { [key: string]: string } | ((row: any) => { [key: string]: string });\r\n  splitCell?: {\r\n    left: (row: any) => string | number;\r\n    right: (row: any) => string | number;\r\n    separator?: string;\r\n    leftStyle?: (row: any) => { [key: string]: string };\r\n    rightStyle?: (row: any) => { [key: string]: string };\r\n  };\r\n  onClick?: () => void;\r\n  mobile?: {\r\n    position?: MobilePosition;\r\n  };\r\n  gridCard?: {\r\n    buttonIcon?: string;\r\n    buttonText?: string;\r\n  };\r\n}\r\n\r\nexport interface RowAction {\r\n  label: string;\r\n  icon?: string;\r\n  action: string; // emitted event name\r\n  disabled?: boolean;\r\n  destructive?: boolean;\r\n  type?: 'button' | 'dropdown';\r\n}\r\n\r\nexport interface DropdownOption {\r\n  label: string;\r\n  icon?: string;\r\n  action: string; // emitted event name\r\n  disabled?: boolean;\r\n}\r\n\r\nexport type PortalPlacement =\r\n  | 'top'\r\n  | 'top-start'\r\n  | 'top-end'\r\n  | 'bottom'\r\n  | 'bottom-start'\r\n  | 'bottom-end'\r\n  | 'left'\r\n  | 'left-start'\r\n  | 'left-end'\r\n  | 'right'\r\n  | 'right-start'\r\n  | 'right-end';\r\n\r\nexport interface FilterField {\r\n  tag: string;\r\n  key: string | { start: string; end: string }; // date ranges need two keys\r\n  event: string | { start: string; end: string }; // date ranges need two events\r\n  label?: string;\r\n  props?: any;\r\n  default?: any;\r\n}\r\n\r\nexport interface FilterConfig {\r\n  title: string;\r\n  showClearButton?: boolean;\r\n  fields: FilterField[];\r\n  initialValues: {\r\n    pageNumber: number;\r\n    pageSize: number;\r\n  };\r\n  appliedValues?: Record<string, any>;\r\n}\r\n"]}