globuswebcomponents 2.18.3 → 2.18.5

package/dist/esm/gb-approval-modal.entry.js

@@ -7,6 +7,7 @@ const GbApprovalModal = class {
         registerInstance(this, hostRef);
         this.primaryButtonClicked = createEvent(this, "primaryButtonClicked");
         this.secondaryButtonClicked = createEvent(this, "secondaryButtonClicked");
+        this.closeButtonClicked = createEvent(this, "closeButtonClicked");
         this.textareaValueChanged = createEvent(this, "textareaValueChanged");
         this.showDecision = true;
         this.badgeType = 'badge_color';
@@ -18,11 +19,14 @@ const GbApprovalModal = class {
         this.headerText = '';
         this.textareaLabel = '';
     }
+    emitCloseEvent() {
+        this.closeButtonClicked.emit();
+    }
     emitTextareaValue(textareaValue) {
         this.textareaValueChanged.emit(textareaValue.detail);
     }
     render() {
-        return (h("div", { key: 'd5b9de38472f4cbe1bc513d23c52f3985ebd9ac8', class: "approval-modal shadow-sm" }, h("gb-modal-header", { key: '7463429f3f020f7db554a6301bfaba095ea2dc2a', "close-button-position": "right", text: this.headerText }), h("div", { key: 'bf5295ae1426b39fb7cab6dfd9c05adb7ad62398', class: "modal-content" }, this.showDecision && (h("div", { key: 'ce49b364291f84b0483ed8a6d61caca008f79642', class: "modal-row" }, h("p", { key: 'afa3c290521c02ff3b29ad43075590e5d0ed6cb6', class: "text-sm-regular heading" }, "Reviewer's decision"), h("gb-badge", { key: '7c5e541237af87df7e65b048faf64d6f33ec7dd7', size: "sm", type: this.badgeType, icon: this.badgeIcon, color: this.badgeColor }, h("p", { key: '37eaaa45983583b5682c1b5cc618c29fcf266d8a' }, this.badgeLabel)))), h("div", { key: 'a3ebdb7b672441fb4b3c57360ca22107722e1ce9', class: "modal-textarea" }, h("gb-textarea-input-field", { key: '8adbf3f7cc2d3ada739877f07932c6060f6a9ebd', idOfInput: "default", state: "default", type: "default", "show-label": true, label: this.textareaLabel || 'Reason', "show-hint-text": false, destructive: false, "placeholder-text": "Enter comments here", onTextareaValueChanged: this.emitTextareaValue.bind(this) }))), h("gb-modal-action", { key: 'cfddebf7ac1554a60aadc27317f476e93f63cafc', "action-type": "double", "first-button-state": this.firstButtonState, "first-button-text": this.firstButtonText, "second-button-text": this.secondButtonText, onFirstButtonClicked: () => this.primaryButtonClicked.emit(), onSecondButtonClicked: () => this.secondaryButtonClicked.emit() })));
+        return (h("div", { key: '549ff28e85d1edcc00d4f3b62a877f2c7b803080', class: "approval-modal shadow-sm" }, h("gb-modal-header", { key: 'd0bb20a931fdf2669d25577d9fa115f665496b26', "close-button-position": "right", text: this.headerText, onCloseButtonClicked: () => this.emitCloseEvent() }), h("div", { key: '16e549a9a34102fadf5c055e366915a9f6107937', class: "modal-content" }, this.showDecision && (h("div", { key: '4babe32b8cae93399a352d01fb37cea0f336c9dd', class: "modal-row" }, h("p", { key: '04ca0781a91b9b5de3ff66e1f1dc79a471b6ab5e', class: "text-sm-regular heading" }, "Reviewer's decision"), h("gb-badge", { key: '772437d596ab658c0812d93e3061198b46d4d4d9', size: "sm", type: this.badgeType, icon: this.badgeIcon, color: this.badgeColor }, h("p", { key: '5b98c24e2ea01b659d1c63b4244a89fd8f4dfbf9' }, this.badgeLabel)))), h("div", { key: 'dd3fe764033a4aaac502d41eaae773973f9cb875', class: "modal-textarea" }, h("gb-textarea-input-field", { key: '48e039cf4484020a4854c210c950c912d5220439', idOfInput: "default", state: "default", type: "default", "show-label": true, label: this.textareaLabel || 'Reason', "show-hint-text": false, destructive: false, "placeholder-text": "Enter comments here", onTextareaValueChanged: this.emitTextareaValue.bind(this) }))), h("gb-modal-action", { key: 'abafde01477748e33e55bc5bfa7ce529c7f05db7', "action-type": "double", "first-button-state": this.firstButtonState, "first-button-text": this.firstButtonText, "second-button-text": this.secondButtonText, onFirstButtonClicked: () => this.primaryButtonClicked.emit(), onSecondButtonClicked: () => this.secondaryButtonClicked.emit() })));
     }
 };
 GbApprovalModal.style = gbApprovalModalCss;

package/dist/esm/gb-approval-modal.entry.js.map

@@ -1 +1 @@
-{"version":3,"file":"gb-approval-modal.entry.js","sources":["src/components/gb-approval-modal/gb-approval-modal.css?tag=gb-approval-modal&encapsulation=shadow","src/components/gb-approval-modal/gb-approval-modal.tsx"],"sourcesContent":["@import './../../global/global.css';\r\n.approval-modal{\r\n    width: 25.1875rem;\r\n    border-radius: 0.75rem;\r\n    background-color:var(--color-background-card, #FFFFFF); \r\n    position: relative;\r\n    overflow: hidden;\r\n}\r\n\r\ngb-button-close{\r\n    position: absolute;\r\n    right: 0.75rem;\r\n    top: 0.59375rem;\r\n}\r\n\r\n.modal-top{\r\n    padding: var(--spacing-6);\r\n    border-bottom: 1px solid var(--color-border-subtler, #E3E8EF);\r\n}\r\n\r\n.modal-content{\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: var(--spacing-3);\r\n    padding: var(--spacing-6);\r\n}\r\n\r\n .heading{\r\n    color: var(--color-text-subtle, #697586);\r\n} \r\n\r\n.modal-row{\r\n    border: 1px solid var(--color-border-subtler, #E3E8EF);\r\n    border-radius: var(--rounded-sm);\r\n    width: 100%;\r\n    padding: var(--spacing-4) var(--spacing-4) var(--spacing-4) var(--spacing-4);\r\n    gap: var(--spacing-2);\r\n    display: flex;\r\n    flex-direction: column;\r\n    box-sizing: border-box;\r\n}\r\n\r\n.modal-textarea{\r\n    /* border-radius: 5px; */\r\n    width: 100%;\r\n    box-sizing: border-box;\r\n}","import { Component, Event, EventEmitter, h, Prop } from '@stencil/core';\r\nimport { GeneralColors, BadgeTypes, BadgeIconTypes, StateType } from '../../models/reusableModels';\r\n\r\n@Component({\r\n  tag: 'gb-approval-modal',\r\n  styleUrl: 'gb-approval-modal.css',\r\n  shadow: true,\r\n})\r\nexport class GbApprovalModal {\r\n  @Prop() showDecision: boolean = true;\r\n  @Prop() badgeColor: GeneralColors;\r\n  @Prop() badgeType: BadgeTypes = 'badge_color';\r\n  @Prop() badgeIcon: BadgeIconTypes = 'dot';\r\n  @Prop() badgeLabel: string = '';\r\n  @Prop() firstButtonText: string = '';\r\n  @Prop() secondButtonText: string = '';\r\n  @Prop() firstButtonState: StateType = 'default';\r\n  @Prop() headerText: string = '';\r\n  @Prop() textareaLabel: string = '';\r\n  @Event() primaryButtonClicked: EventEmitter<void>;\r\n  @Event() secondaryButtonClicked: EventEmitter<void>;\r\n  @Event() textareaValueChanged: EventEmitter<string>;\r\n\r\n  emitTextareaValue(textareaValue: any) {\r\n    this.textareaValueChanged.emit(textareaValue.detail);\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class=\"approval-modal shadow-sm\">\r\n        <gb-modal-header close-button-position=\"right\" text={this.headerText}></gb-modal-header>\r\n        {/* <div class=\"modal-top\">\r\n          <p class=\"display-xs-semi-bold\">Title</p>\r\n          <gb-button-close size=\"sm\" color=\"gray\"></gb-button-close>\r\n        </div> */}\r\n\r\n        <div class=\"modal-content\">\r\n          {this.showDecision && (\r\n            <div class=\"modal-row\">\r\n              <p class=\"text-sm-regular heading\">Reviewer's decision</p>\r\n              <gb-badge size=\"sm\" type={this.badgeType} icon={this.badgeIcon} color={this.badgeColor}>\r\n                <p>{this.badgeLabel}</p>\r\n              </gb-badge>\r\n            </div>\r\n          )}\r\n\r\n          <div class=\"modal-textarea\">\r\n            <gb-textarea-input-field\r\n              idOfInput=\"default\"\r\n              state=\"default\"\r\n              type=\"default\"\r\n              show-label={true}\r\n              label={this.textareaLabel || 'Reason'}\r\n              show-hint-text={false}\r\n              destructive={false}\r\n              placeholder-text=\"Enter comments here\"\r\n              onTextareaValueChanged={this.emitTextareaValue.bind(this)}\r\n            ></gb-textarea-input-field>\r\n          </div>\r\n        </div>\r\n        <gb-modal-action\r\n          action-type=\"double\"\r\n          first-button-state={this.firstButtonState}\r\n          first-button-text={this.firstButtonText}\r\n          second-button-text={this.secondButtonText}\r\n          onFirstButtonClicked={() => this.primaryButtonClicked.emit()}\r\n          onSecondButtonClicked={() => this.secondaryButtonClicked.emit()}\r\n        ></gb-modal-action>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;AAAA,MAAM,kBAAkB,GAAG,0rsEAA0rsE;;MCQxssE,eAAe,GAAA,MAAA;AAL5B,IAAA,WAAA,CAAA,OAAA,EAAA;;;;;AAMU,QAAA,IAAY,CAAA,YAAA,GAAY,IAAI;AAE5B,QAAA,IAAS,CAAA,SAAA,GAAe,aAAa;AACrC,QAAA,IAAS,CAAA,SAAA,GAAmB,KAAK;AACjC,QAAA,IAAU,CAAA,UAAA,GAAW,EAAE;AACvB,QAAA,IAAe,CAAA,eAAA,GAAW,EAAE;AAC5B,QAAA,IAAgB,CAAA,gBAAA,GAAW,EAAE;AAC7B,QAAA,IAAgB,CAAA,gBAAA,GAAc,SAAS;AACvC,QAAA,IAAU,CAAA,UAAA,GAAW,EAAE;AACvB,QAAA,IAAa,CAAA,aAAA,GAAW,EAAE;AAqDnC;AAhDC,IAAA,iBAAiB,CAAC,aAAkB,EAAA;QAClC,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC;;IAGtD,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,0BAA0B,EAAA,EACnC,CAAA,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,uBAAA,EAAuC,OAAO,EAAC,IAAI,EAAE,IAAI,CAAC,UAAU,EAAoB,CAAA,EAMxF,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,eAAe,EAAA,EACvB,IAAI,CAAC,YAAY,KAChB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,WAAW,EAAA,EACpB,CAAG,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,yBAAyB,EAAwB,EAAA,qBAAA,CAAA,EAC1D,CAAU,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,IAAI,EAAC,IAAI,EAAE,IAAI,CAAC,SAAS,EAAE,IAAI,EAAE,IAAI,CAAC,SAAS,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,EAAA,EACpF,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAI,IAAI,CAAC,UAAU,CAAK,CACf,CACP,CACP,EAED,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,gBAAgB,EAAA,EACzB,CAAA,CAAA,yBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,SAAS,EAAC,SAAS,EACnB,KAAK,EAAC,SAAS,EACf,IAAI,EAAC,SAAS,EAAA,YAAA,EACF,IAAI,EAChB,KAAK,EAAE,IAAI,CAAC,aAAa,IAAI,QAAQ,EACrB,gBAAA,EAAA,KAAK,EACrB,WAAW,EAAE,KAAK,EACD,kBAAA,EAAA,qBAAqB,EACtC,sBAAsB,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAA,CAChC,CACvB,CACF,EACN,CAAA,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,aAAA,EACc,QAAQ,EACA,oBAAA,EAAA,IAAI,CAAC,gBAAgB,EAAA,mBAAA,EACtB,IAAI,CAAC,eAAe,EACnB,oBAAA,EAAA,IAAI,CAAC,gBAAgB,EACzC,oBAAoB,EAAE,MAAM,IAAI,CAAC,oBAAoB,CAAC,IAAI,EAAE,EAC5D,qBAAqB,EAAE,MAAM,IAAI,CAAC,sBAAsB,CAAC,IAAI,EAAE,EAC9C,CAAA,CACf;;;;;;;"}
+{"version":3,"file":"gb-approval-modal.entry.js","sources":["src/components/gb-approval-modal/gb-approval-modal.css?tag=gb-approval-modal&encapsulation=shadow","src/components/gb-approval-modal/gb-approval-modal.tsx"],"sourcesContent":["@import './../../global/global.css';\r\n.approval-modal{\r\n    width: 25.1875rem;\r\n    border-radius: 0.75rem;\r\n    background-color:var(--color-background-card, #FFFFFF); \r\n    position: relative;\r\n    overflow: hidden;\r\n}\r\n\r\ngb-button-close{\r\n    position: absolute;\r\n    right: 0.75rem;\r\n    top: 0.59375rem;\r\n}\r\n\r\n.modal-top{\r\n    padding: var(--spacing-6);\r\n    border-bottom: 1px solid var(--color-border-subtler, #E3E8EF);\r\n}\r\n\r\n.modal-content{\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: var(--spacing-3);\r\n    padding: var(--spacing-6);\r\n}\r\n\r\n .heading{\r\n    color: var(--color-text-subtle, #697586);\r\n} \r\n\r\n.modal-row{\r\n    border: 1px solid var(--color-border-subtler, #E3E8EF);\r\n    border-radius: var(--rounded-sm);\r\n    width: 100%;\r\n    padding: var(--spacing-4) var(--spacing-4) var(--spacing-4) var(--spacing-4);\r\n    gap: var(--spacing-2);\r\n    display: flex;\r\n    flex-direction: column;\r\n    box-sizing: border-box;\r\n}\r\n\r\n.modal-textarea{\r\n    /* border-radius: 5px; */\r\n    width: 100%;\r\n    box-sizing: border-box;\r\n}","import { Component, Event, EventEmitter, h, Prop } from '@stencil/core';\r\nimport { GeneralColors, BadgeTypes, BadgeIconTypes, StateType } from '../../models/reusableModels';\r\n\r\n@Component({\r\n  tag: 'gb-approval-modal',\r\n  styleUrl: 'gb-approval-modal.css',\r\n  shadow: true,\r\n})\r\nexport class GbApprovalModal {\r\n  @Prop() showDecision: boolean = true;\r\n  @Prop() badgeColor: GeneralColors;\r\n  @Prop() badgeType: BadgeTypes = 'badge_color';\r\n  @Prop() badgeIcon: BadgeIconTypes = 'dot';\r\n  @Prop() badgeLabel: string = '';\r\n  @Prop() firstButtonText: string = '';\r\n  @Prop() secondButtonText: string = '';\r\n  @Prop() firstButtonState: StateType = 'default';\r\n  @Prop() headerText: string = '';\r\n  @Prop() textareaLabel: string = '';\r\n  @Event() primaryButtonClicked: EventEmitter<void>;\r\n  @Event() secondaryButtonClicked: EventEmitter<void>;\r\n  @Event() closeButtonClicked: EventEmitter<void>;\r\n  @Event() textareaValueChanged: EventEmitter<string>;\r\n\r\n  emitCloseEvent() {\r\n    this.closeButtonClicked.emit();\r\n  }\r\n\r\n  emitTextareaValue(textareaValue: any) {\r\n    this.textareaValueChanged.emit(textareaValue.detail);\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class=\"approval-modal shadow-sm\">\r\n        <gb-modal-header close-button-position=\"right\" text={this.headerText} onCloseButtonClicked={() => this.emitCloseEvent()}></gb-modal-header>\r\n        {/* <div class=\"modal-top\">\r\n          <p class=\"display-xs-semi-bold\">Title</p>\r\n          <gb-button-close size=\"sm\" color=\"gray\"></gb-button-close>\r\n        </div> */}\r\n\r\n        <div class=\"modal-content\">\r\n          {this.showDecision && (\r\n            <div class=\"modal-row\">\r\n              <p class=\"text-sm-regular heading\">Reviewer's decision</p>\r\n              <gb-badge size=\"sm\" type={this.badgeType} icon={this.badgeIcon} color={this.badgeColor}>\r\n                <p>{this.badgeLabel}</p>\r\n              </gb-badge>\r\n            </div>\r\n          )}\r\n\r\n          <div class=\"modal-textarea\">\r\n            <gb-textarea-input-field\r\n              idOfInput=\"default\"\r\n              state=\"default\"\r\n              type=\"default\"\r\n              show-label={true}\r\n              label={this.textareaLabel || 'Reason'}\r\n              show-hint-text={false}\r\n              destructive={false}\r\n              placeholder-text=\"Enter comments here\"\r\n              onTextareaValueChanged={this.emitTextareaValue.bind(this)}\r\n            ></gb-textarea-input-field>\r\n          </div>\r\n        </div>\r\n        <gb-modal-action\r\n          action-type=\"double\"\r\n          first-button-state={this.firstButtonState}\r\n          first-button-text={this.firstButtonText}\r\n          second-button-text={this.secondButtonText}\r\n          onFirstButtonClicked={() => this.primaryButtonClicked.emit()}\r\n          onSecondButtonClicked={() => this.secondaryButtonClicked.emit()}\r\n        ></gb-modal-action>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":"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"}