globuswebcomponents 2.3.6 → 2.3.8

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 (67) hide show
  1. package/dist/cjs/gb-action-panel.cjs.entry.js +1 -1
  2. package/dist/cjs/gb-action-panel.cjs.entry.js.map +1 -1
  3. package/dist/cjs/gb-action-panel.entry.cjs.js.map +1 -1
  4. package/dist/cjs/gb-avatar_31.cjs.entry.js +39 -40
  5. package/dist/cjs/gb-avatar_31.cjs.entry.js.map +1 -1
  6. package/dist/cjs/gb-header-icon.cjs.entry.js +1 -1
  7. package/dist/cjs/gb-header-icon.cjs.entry.js.map +1 -1
  8. package/dist/cjs/gb-header-icon.entry.cjs.js.map +1 -1
  9. package/dist/cjs/gb-textarea-input-field.cjs.entry.js +1 -1
  10. package/dist/cjs/gb-textarea-input-field.cjs.entry.js.map +1 -1
  11. package/dist/cjs/gb-textarea-input-field.entry.cjs.js.map +1 -1
  12. package/dist/cjs/globuscomponents.cjs.js +1 -1
  13. package/dist/cjs/loader.cjs.js +1 -1
  14. package/dist/collection/components/gb-action-panel/gb-action-panel.js +26 -1
  15. package/dist/collection/components/gb-action-panel/gb-action-panel.js.map +1 -1
  16. package/dist/collection/components/gb-header-icon/gb-header-icon.js +1 -1
  17. package/dist/collection/components/gb-header-icon/gb-header-icon.js.map +1 -1
  18. package/dist/collection/components/gb-input-field/gb-input-field.js +39 -40
  19. package/dist/collection/components/gb-input-field/gb-input-field.js.map +1 -1
  20. package/dist/collection/components/gb-textarea-input-field/gb-textarea-input-field.css +1 -0
  21. package/dist/components/gb-action-panel.js +2 -1
  22. package/dist/components/gb-action-panel.js.map +1 -1
  23. package/dist/components/gb-header-icon.js +1 -1
  24. package/dist/components/gb-header.js +1 -1
  25. package/dist/components/gb-input-dropdown.js +1 -1
  26. package/dist/components/gb-input-field.js +1 -1
  27. package/dist/components/gb-pagination.js +2 -2
  28. package/dist/components/gb-table-header.js +1 -1
  29. package/dist/components/gb-textarea-input-field.js +1 -1
  30. package/dist/components/gb-textarea-input-field.js.map +1 -1
  31. package/dist/components/{p-YBXflion.js → p-B98R3cIA.js} +3 -3
  32. package/dist/components/p-B98R3cIA.js.map +1 -0
  33. package/dist/components/{p-DjS-ok3z.js → p-ClZ-eB67.js} +3 -3
  34. package/dist/components/{p-DjS-ok3z.js.map → p-ClZ-eB67.js.map} +1 -1
  35. package/dist/components/{p-H-bBE3O-.js → p-DAmVK9MY.js} +41 -42
  36. package/dist/components/p-DAmVK9MY.js.map +1 -0
  37. package/dist/docs.json +39 -1
  38. package/dist/esm/gb-action-panel.entry.js +1 -1
  39. package/dist/esm/gb-action-panel.entry.js.map +1 -1
  40. package/dist/esm/gb-avatar_31.entry.js +39 -40
  41. package/dist/esm/gb-avatar_31.entry.js.map +1 -1
  42. package/dist/esm/gb-header-icon.entry.js +1 -1
  43. package/dist/esm/gb-header-icon.entry.js.map +1 -1
  44. package/dist/esm/gb-textarea-input-field.entry.js +1 -1
  45. package/dist/esm/gb-textarea-input-field.entry.js.map +1 -1
  46. package/dist/esm/globuscomponents.js +1 -1
  47. package/dist/esm/loader.js +1 -1
  48. package/dist/globuscomponents/gb-action-panel.entry.esm.js.map +1 -1
  49. package/dist/globuscomponents/gb-header-icon.entry.esm.js.map +1 -1
  50. package/dist/globuscomponents/gb-textarea-input-field.entry.esm.js.map +1 -1
  51. package/dist/globuscomponents/globuscomponents.esm.js +1 -1
  52. package/dist/globuscomponents/{p-1bbad76d.entry.js → p-059a7480.entry.js} +2 -2
  53. package/dist/globuscomponents/p-059a7480.entry.js.map +1 -0
  54. package/dist/globuscomponents/{p-3bc75ff9.entry.js → p-49513dd1.entry.js} +2 -2
  55. package/dist/globuscomponents/p-49513dd1.entry.js.map +1 -0
  56. package/dist/globuscomponents/{p-5698b43e.entry.js → p-53c647e8.entry.js} +2 -2
  57. package/dist/globuscomponents/p-53c647e8.entry.js.map +1 -0
  58. package/dist/globuscomponents/p-d2d8cc14.entry.js.map +1 -1
  59. package/dist/types/components/gb-action-panel/gb-action-panel.d.ts +1 -0
  60. package/dist/types/components/gb-input-field/gb-input-field.d.ts +0 -3
  61. package/dist/types/components.d.ts +2 -0
  62. package/package.json +1 -1
  63. package/dist/components/p-H-bBE3O-.js.map +0 -1
  64. package/dist/components/p-YBXflion.js.map +0 -1
  65. package/dist/globuscomponents/p-1bbad76d.entry.js.map +0 -1
  66. package/dist/globuscomponents/p-3bc75ff9.entry.js.map +0 -1
  67. package/dist/globuscomponents/p-5698b43e.entry.js.map +0 -1
@@ -1 +0,0 @@
1
- {"version":3,"names":["gbActionPanelCss","GbActionPanel","constructor","hostRef","this","showCloseButton","showSelectedRows","showCheckbox","firstButton","firstButtonIconLeading","firstButtonIconTrailing","secondButton","secondButtonIconLeading","secondButtonIconTrailing","thirdButton","thirdButtonIconLeading","thirdButtonIconTrailing","showSubmitButton","submitButtonIconLeadingSwap","submitButtonIconTrailingSwap","firstButtonText","secondButtonText","thirdButtonText","showDraftButton","submitButtonText","showAmount","showFee","amount","fee","checked","componentDidLoad","selectedRows","el","querySelector","label","classList","add","updateButtonState","newValue","internalNextButtonState","componentWillRender","nextButtonState","onCheckboxClicked","event","detail","checkboxClicked","emit","onFirstButtonClicked","firstButtonState","firstButtonClicked","onSecondButtonClicked","secondButtonState","secondButtonClicked","onThirdButtonClicked","thirdButtonState","thirdButtonClicked","onPreviousButtonClicked","previousButtonClicked","onSaveAsDraft","saveAsDraft","draftButton","onSubmitClicked","submitButtonClicked","submitButton","onNextButtonClicked","nextButtonClicked","render","h","key","class","type","size","color","name","state","StateEnum","Default","text","bind","slot","hierarchy","icon","onClick","previousButtonState","ref"],"sources":["src/components/gb-action-panel/gb-action-panel.css?tag=gb-action-panel&encapsulation=shadow","src/components/gb-action-panel/gb-action-panel.tsx"],"sourcesContent":["@import './../../global/global.css';\r\n\r\n.action_panel_div {\r\n display: flex;\r\n width: 100%;\r\n padding: var(--spacing-none) 0rem 0rem 0rem;\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: flex-start;\r\n border-top: 1px solid var(--color-border-subtler, #e3e8ef);\r\n background: var(--color-background-card, #fff);\r\n}\r\n\r\n.panel_content {\r\n display: flex;\r\n flex-wrap: wrap;\r\n padding: var(--spacing-4) var(--spacing-7);\r\n justify-content: space-between;\r\n align-items: center;\r\n gap: var(--spacing-5);\r\n align-self: stretch;\r\n}\r\n\r\n.left_action {\r\n display: flex;\r\n gap: var(--spacing-5);\r\n align-items: center;\r\n flex-wrap: wrap;\r\n}\r\n\r\n.rows_and_close_button {\r\n display: flex;\r\n align-items: center;\r\n gap: var(--spacing-5);\r\n}\r\n\r\n.amount {\r\n display: flex;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.amount_heading {\r\n color: var(--color-text-subtle, #697586);\r\n}\r\n\r\n.amount_text {\r\n color: var(--color-text, #4b5565);\r\n}\r\n\r\n.right_action {\r\n display: flex;\r\n flex-direction: row-reverse;\r\n /* justify-content: flex-end; */\r\n align-items: center;\r\n gap: var(--spacing-5);\r\n width: 100%;\r\n flex: 1 0 0;\r\n}\r\n\r\n::slotted([slot='selected_rows']) {\r\n color: var(--color-text, #4b5565);\r\n}\r\n\r\n/**/\r\n.actions {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n flex: 1 0 0;\r\n}\r\n\r\n.right {\r\n display: flex;\r\n justify-content: flex-end;\r\n align-items: center;\r\n gap: var(--spacing-6);\r\n}\r\n\r\n@media (max-width: 940px) {\r\n .right_action {\r\n flex-wrap: wrap;\r\n }\r\n}\r\n\r\n@media (max-width: 468px) {\r\n .panel_content {\r\n padding: var(--spacing-4) var(--spacing-5);\r\n }\r\n\r\n .three_buttons .button_divs {\r\n width: 100%;\r\n }\r\n\r\n .actions {\r\n flex-direction: column;\r\n gap: var(--spacing-4);\r\n }\r\n\r\n .actions .button_divs {\r\n width: 100%;\r\n }\r\n\r\n .right {\r\n width: 100%;\r\n gap: var(--spacing-4);\r\n }\r\n\r\n .actions .right .button_divs {\r\n width: 100%;\r\n }\r\n\r\n .right {\r\n flex-direction: column;\r\n }\r\n}\r\n\r\n@media (max-width: 420px) {\r\n .right_action {\r\n justify-content: space-between;\r\n }\r\n\r\n .right_action .button_divs {\r\n flex: 1 0 0;\r\n }\r\n}\r\n","import { Component, Element, Event, EventEmitter, Prop, State, Watch, h } from '@stencil/core';\r\nimport { StateEnum, StateType } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-action-panel',\r\n styleUrl: 'gb-action-panel.css',\r\n shadow: true,\r\n})\r\nexport class GbActionPanel {\r\n @Prop() type!: 'decision_panel' | 'form_control';\r\n @Prop() showCloseButton: boolean = false;\r\n @Prop() showSelectedRows: boolean = false;\r\n @Prop() showCheckbox: boolean = false;\r\n @Prop() firstButton: boolean = false;\r\n @Prop() firstButtonIconLeading: string = '';\r\n @Prop() firstButtonIconTrailing: string = '';\r\n @Prop() secondButton: boolean = false;\r\n @Prop() secondButtonIconLeading: string = '';\r\n @Prop() secondButtonIconTrailing: string = '';\r\n @Prop() thirdButton: boolean = false;\r\n @Prop() thirdButtonIconLeading: string = '';\r\n @Prop() thirdButtonIconTrailing: string = '';\r\n @Prop() showSubmitButton: boolean = false;\r\n @Prop() submitButtonIconLeadingSwap: string = '';\r\n @Prop() submitButtonIconTrailingSwap: string = '';\r\n @Prop() firstButtonText: string = '';\r\n @Prop() secondButtonText: string = '';\r\n @Prop() thirdButtonText: string = '';\r\n @Prop() firstButtonState: StateType;\r\n @Prop() secondButtonState: StateType;\r\n @Prop() thirdButtonState: StateType;\r\n @Prop() previousButtonState: StateType;\r\n @Prop() nextButtonState: StateType;\r\n @Prop() showDraftButton: boolean = false;\r\n @Prop() submitButtonText: string = '';\r\n @Prop() showAmount: boolean = false;\r\n @Prop() showFee: boolean = false;\r\n @Prop() amount: string = '';\r\n @Prop() fee: string = '';\r\n @State() checked: any = false;\r\n @State() internalNextButtonState: StateType;\r\n @Event() firstButtonClicked: EventEmitter<void>;\r\n @Event() secondButtonClicked: EventEmitter<void>;\r\n @Event() thirdButtonClicked: EventEmitter<void>;\r\n @Event() previousButtonClicked: EventEmitter<void>;\r\n @Event() saveAsDraft: EventEmitter<HTMLElement>;\r\n @Event() submitButtonClicked: EventEmitter<HTMLElement>;\r\n @Event() nextButtonClicked: EventEmitter<void>;\r\n @Event() checkboxClicked: EventEmitter<void>;\r\n @Element() el: HTMLElement;\r\n\r\n draftButton: HTMLElement;\r\n submitButton: HTMLElement;\r\n\r\n componentDidLoad() {\r\n const selectedRows = this.el.querySelector('[slot=\"selected_rows\"]');\r\n const label = this.el.querySelector('[slot=\"label\"]');\r\n\r\n if (selectedRows) {\r\n selectedRows.classList.add('text-md-medium');\r\n }\r\n\r\n if (label) {\r\n label.classList.add('text-md-medium');\r\n }\r\n }\r\n\r\n @Watch('state')\r\n updateButtonState(newValue: StateType) {\r\n this.internalNextButtonState = newValue;\r\n }\r\n\r\n componentWillRender() {\r\n this.internalNextButtonState = this.nextButtonState;\r\n }\r\n\r\n onCheckboxClicked(event) {\r\n this.checked = event.detail;\r\n this.checkboxClicked.emit(this.checked);\r\n }\r\n\r\n onFirstButtonClicked() {\r\n if (this.firstButtonState === 'default') {\r\n if (this.showCheckbox) {\r\n this.firstButtonClicked.emit(this.checked);\r\n } else {\r\n this.firstButtonClicked.emit();\r\n }\r\n } else {\r\n return;\r\n }\r\n }\r\n\r\n onSecondButtonClicked() {\r\n if (this.secondButtonState === 'default') {\r\n if (this.showCheckbox) {\r\n this.secondButtonClicked.emit(this.checked);\r\n } else {\r\n this.secondButtonClicked.emit();\r\n }\r\n }\r\n }\r\n\r\n onThirdButtonClicked() {\r\n if (this.thirdButtonState === 'default') {\r\n if (this.showCheckbox) {\r\n this.thirdButtonClicked.emit(this.checked);\r\n } else {\r\n this.thirdButtonClicked.emit();\r\n }\r\n }\r\n }\r\n\r\n onPreviousButtonClicked() {\r\n this.previousButtonClicked.emit();\r\n }\r\n\r\n onSaveAsDraft() {\r\n this.saveAsDraft.emit(this.draftButton);\r\n }\r\n\r\n onSubmitClicked() {\r\n this.submitButtonClicked.emit(this.submitButton);\r\n }\r\n\r\n onNextButtonClicked() {\r\n this.nextButtonClicked.emit();\r\n }\r\n\r\n render() {\r\n return (\r\n <div class=\"action_panel_div\">\r\n {this.type === 'decision_panel' && (\r\n <div class=\"panel_content\">\r\n <div class=\"left_action\">\r\n <div class=\"rows_and_close_button\">\r\n {this.showCloseButton && <gb-button-close size=\"md\" color=\"primary\"></gb-button-close>}\r\n {this.showSelectedRows && <slot name=\"selected_rows\"></slot>}\r\n </div>\r\n {this.showCheckbox && (\r\n <gb-checkbox size=\"md\" state={StateEnum.Default} type=\"checkbox\" text={true} supporting-text={false} onCheckboxClicked={this.onCheckboxClicked.bind(this)}>\r\n <slot name=\"label\" slot=\"label\"></slot>\r\n </gb-checkbox>\r\n )}\r\n {this.showAmount && (\r\n <div class=\"amount\">\r\n <p class=\"amount_heading text-sm-medium\">Total amount:</p>\r\n <p class=\"amount_text text-lg-semi-bold\">{this.amount}</p>\r\n </div>\r\n )}\r\n {this.showFee && (\r\n <div class=\"amount\">\r\n <p class=\"amount_heading text-sm-medium\">Total fee:</p>\r\n <p class=\"amount_text text-lg-semi-bold\">{this.fee}</p>\r\n </div>\r\n )}\r\n </div>\r\n <div class={`right_action ${this.firstButton && this.secondButton && this.thirdButton && 'three_buttons'}`}>\r\n {this.firstButton && (\r\n <div class=\"button_divs\">\r\n <gb-button\r\n size=\"xl\"\r\n state={this.firstButtonState}\r\n hierarchy=\"primary\"\r\n icon=\"default\"\r\n icon-leading={this.firstButtonIconLeading ? true : false}\r\n icon-trailing={this.firstButtonIconTrailing ? true : false}\r\n icon-leading-swap={this.firstButtonIconLeading}\r\n icon-trailing-swap={this.firstButtonIconTrailing}\r\n onClick={() => this.onFirstButtonClicked()}\r\n >\r\n <p>{this.firstButtonText}</p>\r\n </gb-button>\r\n </div>\r\n )}\r\n {this.secondButton && (\r\n <div class=\"button_divs\">\r\n <gb-button\r\n size=\"xl\"\r\n state={this.secondButtonState}\r\n hierarchy=\"secondary_color\"\r\n icon=\"default\"\r\n icon-leading={this.secondButtonIconLeading ? true : false}\r\n icon-trailing={this.secondButtonIconTrailing ? true : false}\r\n icon-leading-swap={this.secondButtonIconLeading}\r\n icon-trailing-swap={this.secondButtonIconTrailing}\r\n onClick={() => this.onSecondButtonClicked()}\r\n >\r\n <p>{this.secondButtonText}</p>\r\n </gb-button>\r\n </div>\r\n )}\r\n {this.thirdButton && (\r\n <div class=\"button_divs\">\r\n <gb-button\r\n size=\"xl\"\r\n state={this.thirdButtonState}\r\n hierarchy=\"secondary_gray\"\r\n icon=\"default\"\r\n icon-leading={this.thirdButtonIconLeading ? true : false}\r\n icon-trailing={this.thirdButtonIconTrailing ? true : false}\r\n icon-leading-swap={this.thirdButtonIconLeading}\r\n icon-trailing-swap={this.thirdButtonIconTrailing}\r\n onClick={() => this.onThirdButtonClicked()}\r\n >\r\n <p>{this.thirdButtonText}</p>\r\n </gb-button>\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n {this.type === 'form_control' && (\r\n <div class=\"panel_content\">\r\n <div class={`actions ${this.showDraftButton ? 'draft_shown' : ''}`}>\r\n <div class=\"button_divs\">\r\n <gb-button\r\n size=\"xl\"\r\n state={this.previousButtonState}\r\n hierarchy=\"secondary_gray\"\r\n icon=\"default\"\r\n icon-leading={true}\r\n icon-leading-swap=\"assets/arrow-left-02.svg\"\r\n onClick={() => this.onPreviousButtonClicked()}\r\n >\r\n <p>Previous</p>\r\n </gb-button>\r\n </div>\r\n <div class=\"right\">\r\n {this.showDraftButton && (\r\n <div class=\"button_divs\">\r\n <gb-button size=\"xl\" hierarchy=\"secondary_color\" icon=\"default\" ref={el => (this.draftButton = el)} onClick={() => this.onSaveAsDraft()}>\r\n <p>Save as draft</p>\r\n </gb-button>\r\n </div>\r\n )}\r\n {this.showSubmitButton ? (\r\n <div class=\"button_divs\">\r\n <gb-button\r\n size=\"xl\"\r\n hierarchy=\"primary\"\r\n icon=\"default\"\r\n icon-leading={this.submitButtonIconLeadingSwap ? true : false}\r\n icon-leading-swap={this.submitButtonIconLeadingSwap}\r\n icon-trailing={this.submitButtonIconTrailingSwap ? true : false}\r\n icon-trailing-swap={this.submitButtonIconTrailingSwap}\r\n ref={el => (this.submitButton = el)}\r\n onClick={() => this.onSubmitClicked()}\r\n >\r\n <p>{this.submitButtonText}</p>\r\n </gb-button>\r\n </div>\r\n ) : (\r\n <div class=\"button_divs\">\r\n <gb-button\r\n size=\"xl\"\r\n state={this.internalNextButtonState}\r\n hierarchy=\"primary\"\r\n icon=\"default\"\r\n icon-trailing={true}\r\n icon-trailing-swap=\"assets/arrow-right-02.svg\"\r\n onClick={() => this.onNextButtonClicked()}\r\n >\r\n <p>Next</p>\r\n </gb-button>\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n );\r\n }\r\n}\r\n"],"mappings":"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","ignoreList":[]}
@@ -1 +0,0 @@
1
- {"version":3,"names":["gbTextareaInputFieldCss","GbTextareaInputField","constructor","hostRef","this","destructive","placeholderText","showLabel","label","showHintText","hintText","isReadOnly","value","results","content","inputValue","selectedStaff","paddingLeft","paddingTop","show","staffInfo","selectedItems","unselectedItems","minWidth","connectedCallback","type","document","addEventListener","handleClickOutside","inputElement","handleTagInput","bind","componentDidLoad","updateInputWidth","componentWillLoad","updateSelectedItems","disconnectedCallback","removeEventListener","handleInput","textarea","style","height","scrollHeight","textareaValueChanged","emit","event","target","trim","setTimeout","length","emitInputValue","handleTagRemove","index","slice","updateStyles","resultsDisplayElement","resultsWidth","offsetWidth","inputWidth","mockStaffSearch","query","mockData","filter","staff","objectName","toLowerCase","includes","selectStaff","hiddenSpan","input","el","shadowRoot","querySelector","calculatedWidth","Math","max","width","handleWrapperClick","focus","selectDropdownItem","item","isObject","isSelected","some","i","console","log","newValue","Array","isArray","objectValues","val","primitiveValues","JSON","stringify","isTagItemSelected","contains","render","h","key","class","ref","onInput","state","placeholder","onClick","Fragment","map","size","icon","action","split","slot","part","charAt","toUpperCase","join","id","idOfInput","readOnly","onBlur","xmlns","viewBox","fill","d","stroke","StateEnum","Default","selected","objectValue"],"sources":["src/components/gb-textarea-input-field/gb-textarea-input-field.css?tag=gb-textarea-input-field&encapsulation=shadow","src/components/gb-textarea-input-field/gb-textarea-input-field.tsx"],"sourcesContent":["@import '../../global/global.css';\r\n\r\n.textarea_container{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.input_with_label{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.textarea{\r\n border: 1px solid var(--color-border-input, #CDD5DF);\r\n border-radius: var(--rounded-sm);\r\n padding: 0.75rem 0.875rem;\r\n font-family: var(--font-family-body);\r\n resize: none;\r\n min-height: 7.5rem;\r\n overflow: visible;\r\n}\r\n\r\n.default_textarea:focus{\r\n border-color: #075DB2;\r\n outline: #075DB2;\r\n}\r\n\r\n.textarea::placeholder{\r\n color: var(--color-text-subtle, #697586);\r\n}\r\n\r\n.results_display {\r\n display: flex;\r\n flex-wrap: wrap;\r\n position: relative;\r\n gap: 0.5rem;\r\n width: 100%;\r\n background-color: var(--color-surface, #FFFFFF);\r\n}\r\n\r\n.results_display.disabled{\r\n background: var(--color-background-disabled, #F6F8FA);\r\n}\r\n\r\n.textarea_tags{\r\n --weight: fit-content;\r\n /* flex-direction: row-reverse; */\r\n display: flex;\r\n flex-direction: column;\r\n position: relative;\r\n}\r\n\r\n.textarea.tags{\r\n display: flex;\r\n}\r\n\r\n.input_like,\r\n.results_display{\r\n height: fit-content;\r\n}\r\n\r\n.input_like{\r\n border: none;\r\n font-family: var(--font-family-body);\r\n}\r\n\r\n.input_like:focus{\r\n outline: none;\r\n}\r\n\r\n.input_like.disabled{\r\n background: var(--color-background-disabled, #F6F8FA);\r\n}\r\n\r\n.hidden-span {\r\n visibility: hidden;\r\n position: absolute;\r\n max-width: 100%;\r\n white-space: pre;\r\n}\r\n\r\n/* State Styles */\r\n.textarea:focus-within{\r\n border: 1.3px solid var(--color-border-selected, #075DB2);\r\n outline-color: transparent;\r\n}\r\n\r\n.textarea.destructive{\r\n border: 1px solid var(--color-border-danger, #B51726);\r\n}\r\n\r\n.textarea.disabled{\r\n background: var(--color-background-gray-subtlest, #F6F8FA);\r\n border: 1px solid var(--color-border-disabled, #E3E8EF);\r\n cursor: not-allowed;\r\n pointer-events: none;\r\n}\r\n\r\n.label {\r\n color: var(--color-text, #4B5565);\r\n}\r\n\r\n.hint_text{\r\n color: var(--color-text-subtle, #697586);\r\n}\r\n\r\n.hint_text.destructive{\r\n color: var(--color-border-danger, #B51726);\r\n}\r\n\r\n.dropdown_menu{\r\n display: flex;\r\n min-width: 100%;\r\n width: fit-content;\r\n max-height: 15rem;\r\n padding: var(--spacing-none);\r\n flex-direction: column;\r\n align-items: stretch;\r\n border-radius: var(--rounded-sm);\r\n border: 1px solid var(--color-border-subtler, #E3E8EF);\r\n background: var(--color-surface, #FFFFFF);\r\n box-shadow: var(--shadow-sm);\r\n position: absolute;\r\n z-index: 99999;\r\n gap: var(--spacing-none);\r\n transition: 1s ease-in-out;\r\n overflow-y: auto;\r\n top: 105%;\r\n}","import { Component, Element, Prop, State, h, Fragment, Event, EventEmitter, Listen, Watch } from '@stencil/core';\r\nimport { StateEnum } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-textarea-input-field',\r\n styleUrl: 'gb-textarea-input-field.css',\r\n shadow: true,\r\n})\r\nexport class GbTextareaInputField {\r\n @Prop() type: 'default' | 'tags';\r\n @Prop({ mutable: true }) state: 'default' | 'filled' | 'active' | 'disabled';\r\n @Prop() destructive: boolean = false;\r\n @Prop() placeholderText: string = '';\r\n @Prop() showLabel: boolean = false;\r\n @Prop() label: string = '';\r\n @Prop() showHintText: boolean = false;\r\n @Prop() hintText: string = '';\r\n @Prop({ reflect: true }) idOfInput!: string;\r\n @Prop({ reflect: true }) isReadOnly: boolean = false;\r\n @Prop({ mutable: true }) value: any = [\r\n // { objectName: 'John Doe', objectValue: 'john.doe@example.com' },\r\n // { objectName: 'Jane Smith', objectValue: 'jane.smith@example.com' },\r\n // { objectName: 'Alice Johnson', objectValue: 'alice.johnson@example.com' },\r\n // { objectName: 'Emmanuel Kadiri', objectValue: 'kadiri2047@gmail.com' },\r\n // { objectName: 'Gideon Ogunkola', objectValue: 'gideon@example.com' },\r\n ];\r\n @Prop() icon: 'country' | 'avatar' | 'dot' | 'false';\r\n @Prop({ mutable: true }) results: any[] = [\r\n // { objectName: 'John Doe', objectValue: 'john.doe@example.com' },\r\n // { objectName: 'Jane Smith', objectValue: 'jane.smith@example.com' },\r\n // { objectName: 'Alice Johnson', objectValue: 'alice.johnson@example.com' },\r\n // { objectName: 'Emmanuel Kadiri', objectValue: 'kadiri2047@gmail.com' },\r\n // { objectName: 'Gideon Ogunkola', objectValue: 'gideon@example.com' },\r\n // 10,\r\n // 20,\r\n // 30,\r\n // 40,\r\n // 50,\r\n ];\r\n @Element() el: HTMLElement;\r\n @State() content: string = '';\r\n @State() inputValue: string = '';\r\n @State() selectedStaff: any[] = [];\r\n @State() paddingLeft: string = '1rem';\r\n @State() paddingTop: string = '0rem';\r\n @State() show: boolean = false;\r\n @State() staffInfo: any[] = [];\r\n @State() selectedItems: any[] = [];\r\n @State() unselectedItems: any[] = [];\r\n @Event() textareaValueChanged: EventEmitter<any>;\r\n\r\n private textarea!: HTMLTextAreaElement;\r\n inputElement!: HTMLInputElement;\r\n resultsDisplayElement!: HTMLDivElement;\r\n private hiddenSpan: HTMLElement;\r\n private minWidth: number = 10;\r\n\r\n connectedCallback() {\r\n if (this.type === 'tags') {\r\n document.addEventListener('click', this.handleClickOutside);\r\n this.inputElement.addEventListener('input', this.handleTagInput.bind(this));\r\n }\r\n }\r\n\r\n componentDidLoad() {\r\n this.updateInputWidth();\r\n }\r\n \r\n componentWillLoad() {\r\n this.updateSelectedItems(this.value);\r\n }\r\n\r\n disconnectedCallback() {\r\n this.inputElement.removeEventListener('input', this.handleTagInput.bind(this));\r\n }\r\n\r\n handleInput() {\r\n this.textarea.style.height = 'auto'; // Reset height to calculate the new height\r\n this.textarea.style.height = `${this.textarea.scrollHeight - 22}px`; // Set the height to the scrollHeight\r\n this.textareaValueChanged.emit(this.textarea.value);\r\n }\r\n\r\n handleTagInput(event: Event) {\r\n const target = event.target as HTMLInputElement;\r\n this.inputValue = target.value; // Update the value\r\n this.textareaValueChanged.emit(this.selectedItems);\r\n\r\n if (this.inputValue.trim() === '') {\r\n this.show = false;\r\n // this.results = [];\r\n return;\r\n }\r\n\r\n // Simulate API call\r\n setTimeout(() => {\r\n // this.results = this.mockStaffSearch(this.inputValue);\r\n this.show = this.results.length > 0;\r\n }, 1000);\r\n\r\n this.updateInputWidth();\r\n }\r\n\r\n emitInputValue() {\r\n this.textareaValueChanged.emit(this.selectedItems);\r\n }\r\n\r\n handleTagRemove(index: number) {\r\n if (this.value.length > 0) {\r\n this.value = [...this.value.slice(0, index), ...this.value.slice(index + 1)];\r\n this.updateStyles();\r\n this.emitInputValue();\r\n } else {\r\n this.selectedItems = [...this.selectedItems.slice(0, index), ...this.selectedItems.slice(index + 1)];\r\n this.updateStyles();\r\n this.emitInputValue();\r\n }\r\n }\r\n\r\n updateStyles() {\r\n setTimeout(() => {\r\n if (this.resultsDisplayElement) {\r\n const resultsWidth = this.resultsDisplayElement.offsetWidth;\r\n const inputWidth = this.inputElement.offsetWidth;\r\n\r\n this.paddingLeft = this.selectedItems.length === 0 ? '1rem' : `${resultsWidth + 10}px`;\r\n\r\n this.paddingTop = this.selectedItems.length > 2 ? '1rem' : `${inputWidth + 10}px`;\r\n }\r\n });\r\n\r\n if (this.destructive) {\r\n this.destructive = false;\r\n }\r\n this.inputValue = '';\r\n }\r\n\r\n mockStaffSearch(query: string) {\r\n const mockData = this.results;\r\n\r\n return mockData.filter(staff => staff.objectName.toLowerCase().includes(query.toLowerCase()));\r\n }\r\n\r\n selectStaff(staff: any) {\r\n this.selectedStaff = [...this.selectedStaff, staff];\r\n this.inputValue = '';\r\n this.staffInfo = [];\r\n this.updateStyles();\r\n }\r\n\r\n updateInputWidth() {\r\n if (this.hiddenSpan) {\r\n const input = this.el.shadowRoot.querySelector('input') as HTMLInputElement;\r\n\r\n // Update input width based on span's width or use minimum width\r\n const calculatedWidth = Math.max(this.hiddenSpan.offsetWidth + 10, this.minWidth);\r\n input.style.width = `${calculatedWidth}px`;\r\n }\r\n }\r\n\r\n handleWrapperClick() {\r\n this.inputElement.focus(); // Focus the input field\r\n }\r\n\r\n selectDropdownItem(item: any) {\r\n if (this.value.length === 0) {\r\n const isObject = typeof item === 'object';\r\n const isSelected = this.selectedItems.some(i => (isObject ? i.objectName === item.objectName : i === item));\r\n if (isSelected) {\r\n // Unselect item: Move it from selectedItems to unselectedItems\r\n this.selectedItems = this.selectedItems.filter(i => (isObject ? i.objectName !== item.objectName : i !== item));\r\n if (!this.unselectedItems.some(i => (isObject ? i.objectName === item.objectName : i === item))) {\r\n this.unselectedItems = [...this.unselectedItems, item];\r\n }\r\n this.textareaValueChanged.emit(this.selectedItems);\r\n } else {\r\n // Select item: Move it from unselectedItems to selectedItems\r\n this.selectedItems = [...this.selectedItems, item];\r\n this.unselectedItems = this.unselectedItems.filter(i => (isObject ? i.objectName !== item.objectName : i !== item));\r\n this.textareaValueChanged.emit(this.selectedItems);\r\n }\r\n } else {\r\n const isObject = typeof item === 'object';\r\n const isSelected = this.selectedItems.some(i => (isObject ? i.objectName === item.objectName : i === item));\r\n\r\n if (isSelected) {\r\n this.value = this.value.filter(i => (isObject ? i.objectName !== item.objectName : i !== item));\r\n console.log(this.value);\r\n this.textareaValueChanged.emit(this.value);\r\n } else {\r\n this.value = [...this.value, item]; // Add item to array\r\n this.textareaValueChanged.emit(this.value);\r\n }\r\n }\r\n\r\n this.updateStyles();\r\n }\r\n\r\n @Watch('value')\r\n updateSelectedItems(newValue: any[]) {\r\n if (Array.isArray(newValue) && newValue.length > 0) {\r\n this.selectedItems = [];\r\n this.unselectedItems = [];\r\n\r\n const objectValues = newValue.filter(val => typeof val === 'object' && val !== null);\r\n const primitiveValues = newValue.filter(val => typeof val !== 'object');\r\n\r\n this.selectedItems = this.results.filter(item =>\r\n typeof item === 'object' && item !== null\r\n ? objectValues.some(val => JSON.stringify(val) === JSON.stringify(item)) // Avoid object reference issues\r\n : primitiveValues.includes(item),\r\n );\r\n\r\n this.unselectedItems = this.results.filter(item =>\r\n typeof item === 'object' && item !== null ? !objectValues.some(val => JSON.stringify(val) === JSON.stringify(item)) : !primitiveValues.includes(item),\r\n );\r\n } else {\r\n this.selectedItems = [];\r\n this.unselectedItems = [...this.results];\r\n }\r\n }\r\n\r\n isTagItemSelected(item) {\r\n // return this.selectedStaff.some(i => i.name === item.name);\r\n\r\n const isObject = typeof item === 'object';\r\n return this.selectedItems.some(i => (isObject ? i.objectName === item.objectName : i === item));\r\n }\r\n\r\n @Listen('click', { target: 'document' })\r\n handleClickOutside(event: MouseEvent) {\r\n if (this.show && !this.el.contains(event.target as Node)) {\r\n this.show = false;\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <div class=\"textarea_container\">\r\n <div class=\"input_with_label\">\r\n {this.showLabel && <p class={`label text-sm-medium`}>{this.label}</p>}\r\n {this.type === 'default' && (\r\n <textarea\r\n ref={el => (this.textarea = el as HTMLTextAreaElement)}\r\n onInput={() => this.handleInput()}\r\n class={`textarea default_textarea ${this.state} ${this.destructive ? 'destructive' : ''}`}\r\n placeholder={this.placeholderText}\r\n value={this.inputValue}\r\n ></textarea>\r\n )}\r\n {this.type === 'tags' && (\r\n <div class=\"textarea_tags\">\r\n <div class={`textarea ${this.type} ${this.state} ${this.destructive ? 'destructive' : ''}`} onClick={() => this.handleWrapperClick()}>\r\n <div class={`results_display ${this.state === 'disabled' ? 'disabled' : ''}`} ref={el => (this.resultsDisplayElement = el as HTMLDivElement)}>\r\n {this.value.length === 0 ? (\r\n <>\r\n {this.selectedItems.map((item, index) => (\r\n <>\r\n {typeof item === 'object' ? (\r\n <div class=\"added_tag\" key={index}>\r\n <gb-tag size=\"sm\" icon={this.icon ? this.icon : 'avatar'} action=\"X_close\" onClick={() => this.handleTagRemove(index)}>\r\n <p class=\"text-xs-medium\">{item.objectName.split(' ')[0]}</p>\r\n <h1 slot=\"initials\" class=\"text-xxs-semi-bold\">\r\n {item.objectName\r\n .split(' ')\r\n .map(part => part.charAt(0).toUpperCase())\r\n .join('')}\r\n </h1>\r\n </gb-tag>\r\n </div>\r\n ) : (\r\n <div class=\"added_tag\" key={index}>\r\n <gb-tag size=\"sm\" icon={this.icon ? this.icon : 'avatar'} action=\"X_close\" onClick={() => this.handleTagRemove(index)}>\r\n <p class=\"text-xs-medium\">{item}</p>\r\n </gb-tag>\r\n </div>\r\n )}\r\n </>\r\n ))}\r\n </>\r\n ) : (\r\n <>\r\n {this.value.map((val, index) => (\r\n <>\r\n {typeof val === 'object' ? (\r\n <gb-tag size=\"sm\" action=\"X_close\" icon={this.icon ? this.icon : 'avatar'} onClick={() => this.handleTagRemove(index)} key={index}>\r\n <h1 class=\"text-xxs-semi-bold\" slot=\"initials\">\r\n {val.objectName.split(' ').map(part => part.charAt(0).toUpperCase())}\r\n </h1>\r\n <p>{val.objectName.split(' ')[0]}</p>\r\n </gb-tag>\r\n ) : (\r\n <gb-tag size=\"sm\" action=\"X_close\" icon={this.icon ? this.icon : 'avatar'} onClick={() => this.handleTagRemove(index)} key={index}>\r\n <p>{val}</p>\r\n </gb-tag>\r\n )}\r\n </>\r\n ))}\r\n </>\r\n )}\r\n <span class=\"hidden-span\" ref={el => (this.hiddenSpan = el as HTMLElement)}>\r\n {this.inputValue || ' '}\r\n </span>\r\n <div class=\"input_field\">\r\n <input\r\n id={this.idOfInput}\r\n class={`input_like text-md-regular ${this.state}`}\r\n type=\"text\"\r\n // placeholder={this.placeholderText}\r\n value={this.inputValue}\r\n readOnly={this.isReadOnly}\r\n ref={el => (this.inputElement = el as HTMLInputElement)}\r\n onBlur={() => this.emitInputValue()}\r\n />\r\n </div>\r\n </div>\r\n {this.destructive && (\r\n <div class=\"help_icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M7.9947 10H8.00069M8.00004 8.00004V5.33337M14.6667 8.00004C14.6667 11.6819 11.6819 14.6667 8.00004 14.6667C4.31814 14.6667 1.33337 11.6819 1.33337 8.00004C1.33337 4.31814 4.31814 1.33337 8.00004 1.33337C11.6819 1.33337 14.6667 4.31814 14.6667 8.00004Z\"\r\n stroke=\"#B51726\"\r\n stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </div>\r\n )}\r\n </div>\r\n {this.show && (\r\n <div class={`dropdown_menu`}>\r\n {this.results.map(item => (\r\n <gb-input-dropdown-menu-item\r\n type=\"checkbox\"\r\n supporting-text={true}\r\n state={StateEnum.Default}\r\n onClick={() => this.selectDropdownItem(item)}\r\n selected={this.isTagItemSelected(item)}\r\n >\r\n {typeof item === 'object'\r\n ? [<p slot=\"name\">{item.objectName}</p>, <p slot=\"supporting_text\">{item.objectValue}</p>]\r\n : typeof item !== 'object' && <p slot=\"name\">{item}</p>}\r\n </gb-input-dropdown-menu-item>\r\n ))}\r\n </div>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n {this.showHintText && <p class={`hint_text text-sm-regular ${this.destructive ? 'destructive' : ''}`}>{this.hintText}</p>}\r\n </div>\r\n );\r\n }\r\n}\r\n"],"mappings":"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","ignoreList":[]}