globuswebcomponents 2.2.2 → 2.2.4

package/dist/globuscomponents/p-af94f827.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["gbInputDropdownCss","GbInputDropdown","constructor","hostRef","this","showLabel","label","placeholder","hintText","showLeadingIcon","iconSwap","text","leadingIcon","items","value","supportingText","showBorder","showSearchInput","destructive","errorText","loading","leadingIconSvg","dropdownOpen","selectedItems","unselectedItems","internalItems","showCloseButton","internalLoading","clearSelection","selectedItem","length","state","clearInput","inputRef","inputValue","inputValueChanged","emit","updateResultsAndShowInDropdown","newItems","onLoadingChanged","newLoading","emitInputValueToUseForSearch","searchItemsInDropdownMenu","event","searchItem","detail","searchResults","filter","item","toLowerCase","includes","toString","name","watchDestructive","disconnectedCallback","document","removeEventListener","handleClickOutside","el","contains","target","toggleDropdown","stopPropagation","isItemSelected","isObject","some","i","loadIcon","iconName","iconPath","getAssetPath","response","fetch","svg","getAvatarSize","size","sortDropdownItems","menuItems","sort","a","b","selected","handleItemSelect","type","selectMultipleItems","singleItemSelect","dropdownItemSelected","isSelected","handleTagRemove","componentWillRender","componentWillLoad","Array","isArray","objectValues","val","primitiveValues","componentDidLoad","addEventListener","slottedInitials","querySelector","mainTextSlot","supportingTextSlot","classList","add","applyColorToInitials","color","render","emptyStateBackground","illustration","h","key","class","style","charAt","toUpperCase","slice","onClick","e","xmlns","width","height","viewBox","fill","d","stroke","Fragment","map","slot","split","part","innerHTML","cx","cy","r","ref","onInput","bind","hierarchy","icon","index","action","join","_a","username","showHelpIcon","menuPosition","dropdownRef","labelText","idOfInput","onInputValueChanged","StateEnum","Default","src","alt","showHintText","gbPaginationButtonGroupBaseCss","GbPaginationButtonGroupBase","slottedContent","iconSrc","gbPaginationNumberBaseCss","GbPaginationNumberBase","shape"],"sources":["src/components/gb-input-dropdown/gb-input-dropdown.css?tag=gb-input-dropdown&encapsulation=shadow","src/components/gb-input-dropdown/gb-input-dropdown.tsx","src/components/gb-pagination-button-group-base/gb-pagination-button-group-base.css?tag=gb-pagination-button-group-base&encapsulation=shadow","src/components/gb-pagination-button-group-base/gb-pagination-button-group-base.tsx","src/components/gb-pagination-number-base/gb-pagination-number-base.css?tag=gb-pagination-number-base&encapsulation=shadow","src/components/gb-pagination-number-base/gb-pagination-number-base.tsx"],"sourcesContent":["@import './../../global/global.css';\r\n\r\n.input_dropdown_div {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  border-radius: 0.5rem;\r\n  gap: var(--spacing-3);\r\n  border: 1px solid var(--color-border-input, #cdd5df);\r\n  background-color: var(--color-background-card, #ffffff);\r\n  padding: var(--spacing-none) var(--spacing-3);\r\n  cursor: pointer;\r\n  position: relative;\r\n}\r\n\r\n.input_dropdown_container {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: var(--spacing-2);\r\n}\r\n\r\n.input_dropdown_container.tag {\r\n  min-height: 3rem;\r\n}\r\n\r\n.icon {\r\n  display: flex;\r\n  align-items: center;\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.hint_text {\r\n  color: var(--color-text-subtle, #697586);\r\n}\r\n\r\n.error_text {\r\n  color: var(--color-text-danger, #b51726);\r\n}\r\n\r\n/* Size Styles */\r\n.input_dropdown_div.sm {\r\n  height: 2.5rem;\r\n}\r\n\r\n.input_dropdown_div.md {\r\n  height: 3rem;\r\n}\r\n\r\n.dot.sm {\r\n  width: var(--spacing-2);\r\n  height: var(--spacing-2);\r\n}\r\n\r\n.dot.md {\r\n  width: 0.625rem;\r\n  height: 0.625rem;\r\n}\r\n\r\n/* State Styles */\r\n.input_dropdown_div.focused {\r\n  border-color: var(--color-border-selected, #075db2);\r\n}\r\n\r\n.input_dropdown_div.destructive {\r\n  border-color: var(--color-border-danger, #b51726);\r\n}\r\n\r\n.input_dropdown_div.disabled {\r\n  background-color: var(--color-background-disabled, #f6f8fa);\r\n  pointer-events: none;\r\n  cursor: not-allowed;\r\n}\r\n\r\n.placeholder {\r\n  display: flex;\r\n  justify-content: stretch;\r\n  width: 100%;\r\n  white-space: nowrap;\r\n}\r\n\r\n.content {\r\n  display: flex;\r\n  gap: var(--spacing-2);\r\n  overflow: hidden; /* Clip overflowing content */\r\n  /* width: 50px; */\r\n  flex: 1 0 0;\r\n}\r\n\r\n.text.tag {\r\n  display: flex;\r\n  justify-content: flex-start;\r\n  align-items: stretch;\r\n  flex-wrap: wrap;\r\n  gap: 0.38rem;\r\n  padding: 0.4rem 0;\r\n}\r\n\r\n.supporting_text {\r\n  display: flex;\r\n  align-items: center;\r\n}\r\n\r\n.added_tag {\r\n  width: fit-content;\r\n}\r\n\r\n.help_icon {\r\n  display: flex;\r\n  align-items: center;\r\n  height: fit-content;\r\n}\r\n\r\n.dropdown_icon {\r\n  display: flex;\r\n  align-items: center;\r\n}\r\n\r\nsvg.disabled path {\r\n  stroke: var(--color-icon-disabled, #cdd5df);\r\n}\r\n\r\n.dropdown_menu {\r\n  display: flex;\r\n  width: 100%;\r\n  max-height: 300px;\r\n  padding: var(--spacing-none);\r\n  flex-direction: column;\r\n  align-items: flex-start;\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  gap: var(--spacing-none);\r\n  transition: 1s ease-in-out;\r\n  overflow-y: auto;\r\n}\r\n\r\n.dropdown_menu.top {\r\n  bottom: 105%;\r\n  left: 0;\r\n  z-index: 999;\r\n}\r\n\r\n.dropdown_menu.bottom {\r\n  top: 105%;\r\n  left: 0;\r\n  z-index: 999;\r\n}\r\n\r\n/* .input_dropdown_div.sm.tag{\r\n    min-height: 2.5rem;\r\n} */\r\n\r\n.input_dropdown_div.tag {\r\n  min-height: 3rem;\r\n  height: fit-content;\r\n}\r\n\r\n.input_dropdown_div.md.tag {\r\n  min-height: 2.5rem;\r\n}\r\n\r\n.input_dropdown_div.md.tag {\r\n  min-height: 3rem;\r\n}\r\n\r\n.opened {\r\n  transform: rotate(180deg);\r\n  transition: 0.2s ease-in-out;\r\n}\r\n\r\n::slotted([slot='tooltip_label']) {\r\n  white-space: nowrap;\r\n  color: var(--color-text, #4b5565);\r\n}\r\n\r\n::slotted([slot='tooltip_supporting_text']) {\r\n  min-width: fit-content;\r\n  max-width: 18.5rem;\r\n  color: var(--color-text-subtle, #697586);\r\n  margin-top: 5rem;\r\n}\r\n\r\n::slotted([slot='initials'].gray) {\r\n  color: #4b5565;\r\n}\r\n\r\n::slotted([slot='initials'].blue) {\r\n  color: var(--color-text-information, #064e94);\r\n}\r\n\r\n::slotted([slot='initials'].cyan) {\r\n  color: var(--color-text-discovery, #0086c9);\r\n}\r\n\r\n::slotted([slot='initials'].pink) {\r\n  color: var(--color-text-pink, #dd2590);\r\n}\r\n\r\n::slotted([slot='initials'].purple) {\r\n  color: var(--color-text-purple, #6938ef);\r\n}\r\n\r\n::slotted([slot='initials'].green) {\r\n  color: var(--color-text-success, #079455);\r\n}\r\n\r\n::slotted([slot='initials'].yellow) {\r\n  color: var(--color-text-warning, #dc6803);\r\n}\r\n\r\n.dropdown_search_field {\r\n  background: var(--color-surface, #ffffff);\r\n  padding: var(--spacing-2) var(--spacing-2) var(--spacing-none) var(--spacing-2);\r\n  position: sticky;\r\n  top: 0;\r\n  z-index: 999;\r\n}\r\n\r\n.empty_state {\r\n  margin: auto;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n}\r\n\r\n.background {\r\n  position: relative;\r\n  width: 80%;\r\n}\r\n\r\n.message_background {\r\n  position: absolute;\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  gap: var(--spacing-1);\r\n}\r\n\r\n.illustration {\r\n  width: 100px;\r\n  height: 100px;\r\n}\r\n\r\n.message {\r\n  color: var(--color-text-bold, #202939);\r\n}\r\n\r\n.text {\r\n  display: flex;\r\n  align-items: center;\r\n  /* flex: 1 1 auto; */\r\n  overflow: hidden; /* Prevent content from overflowing */\r\n}\r\n\r\n.selected_text {\r\n  overflow: hidden; /* Hide overflowing text */\r\n  text-overflow: ellipsis;\r\n  white-space: nowrap; /* Prevent wrapping */\r\n  flex: 1 1 auto; /* Take up available space and adjust dynamically */\r\n  min-width: 0; /* Ensures it respects parent width in flexbox */\r\n}\r\n\r\n.search_input {\r\n  display: flex;\r\n  flex: 1 0 0;\r\n  width: 100%;\r\n}\r\n\r\ninput {\r\n  border: none;\r\n  color: var(--color-text, #4b5565);\r\n}\r\n\r\ninput:focus {\r\n  outline: none;\r\n}\r\n\r\ninput::placeholder {\r\n  color: var(--color-text-disabled, #cdd5df);\r\n}\r\n\r\n.close_button {\r\n  position: absolute;\r\n}\r\n\r\n.close_button.sm {\r\n  right: 0.2rem;\r\n  top: 0.15rem;\r\n}\r\n\r\n.close_button.md {\r\n  right: 0.3rem;\r\n  top: 0.25rem;\r\n}\r\n\r\n.loader_div{\r\n  width: 100%;\r\n  height: 10rem;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n}\r\n\r\n.loader {\r\n  border: 4px solid var(--color-background-gray, #cdd5df); /* Light grey */\r\n  border-top: 4px solid var(--color-background-selected, #075db2); /* Blue */\r\n  border-radius: 50%;\r\n  width: 30px;\r\n  height: 30px;\r\n  animation: spin 2s linear infinite;\r\n}\r\n\r\n@keyframes spin {\r\n  0% {\r\n    transform: rotate(0deg);\r\n  }\r\n  100% {\r\n    transform: rotate(360deg);\r\n  }\r\n}","import { Component, Prop, h, Fragment, Element, State, getAssetPath, Listen, Event, EventEmitter, Watch, Method } from '@stencil/core';\r\nimport { ColorTypes, DropdownTypes, GeneralSizes, StateEnum } from '../../models/reusableModels';\r\n@Component({\r\n  tag: 'gb-input-dropdown',\r\n  styleUrl: 'gb-input-dropdown.css',\r\n  shadow: true,\r\n})\r\nexport class GbInputDropdown {\r\n  @Prop() type: DropdownTypes;\r\n  @Prop({ mutable: true }) state: 'default' | 'focused' | 'disabled' | 'filled';\r\n  @Prop() size: GeneralSizes;\r\n  @Prop() showLabel: boolean = false;\r\n  @Prop() label: string = '';\r\n  @Prop() placeholder: string = '';\r\n  @Prop() showHintText: boolean;\r\n  @Prop() hintText: string = '';\r\n  @Prop() showHelpIcon: boolean;\r\n  @Prop() showLeadingIcon: boolean = false;\r\n  @Prop() iconSwap: string = '';\r\n  @Prop() text: boolean = false;\r\n  @Prop() leadingIcon: string = '';\r\n  @Prop() icon: 'country' | 'avatar' | 'dot' | 'false';\r\n  @Prop({ mutable: true }) items: any[] = [\r\n    // { name: 'Mock Item A iusbrviubw vwiuhvw vwiurhvwr vwoiuh', username: 1 },\r\n    // { name: 'Mock Item B', username: 3 },\r\n    // { name: 'Mock Item C', username: 3 },\r\n    // { name: 'Mock Item D', username: 3 },\r\n    // { name: 'Mock Item E', username: 3 },\r\n    // 45,\r\n    // 50,\r\n    // 20,\r\n    // 25,\r\n    // 90,\r\n    // 92,\r\n    // 53,\r\n    // 'Activated',\r\n    // 'Deactivated',\r\n    // 'John Doe',\r\n    // 'John smith',\r\n    // 'Jane leo'\r\n  ];\r\n  @Prop({ mutable: true }) value: any[] = [\r\n    // { name: 'Mock Item A', username: 1, selected: false },\r\n    // { name: 'Mock Item B', username: 2, selected: false },\r\n    // { name: 'Mock Item C', username: 3, selected: false },\r\n    // 45,\r\n    // 50,\r\n    // 20,\r\n    // 25,\r\n    // 90,\r\n    // 'Activated',\r\n    // 'Deactivated',\r\n    // 'Transaction Status'\r\n  ];\r\n  @Prop() supportingText: boolean = false;\r\n  @Prop() color: ColorTypes;\r\n  @Prop() showBorder: boolean = false;\r\n  @Prop() menuPosition: 'top' | ' bottom';\r\n  @Prop() showSearchInput: boolean = false;\r\n  @Prop() inputValue: string;\r\n  @Prop({ mutable: true }) destructive: boolean = false;\r\n  @Prop() errorText: string = '';\r\n  @Prop({ mutable: true }) loading: boolean = false;\r\n  @State() leadingIconSvg: string = '';\r\n  @State() dropdownOpen: boolean = false;\r\n  @State() selectedItem: any;\r\n  @State() selectedItems: any[] = [];\r\n  @State() unselectedItems: any[] = [];\r\n  @State() searchItem: any;\r\n  @State() searchResults: any;\r\n  @State() internalItems: any[] = [...this.items];\r\n  @State() showCloseButton: boolean = false;\r\n  @State() internalLoading: boolean = this.loading;\r\n  @Element() el: HTMLElement;\r\n  // @Event() dropdownValue: EventEmitter<any>;\r\n  @Event() dropdownItemSelected: EventEmitter<any>;\r\n  @Event() inputValueChanged: EventEmitter<string>;\r\n\r\n  dropdownRef!: HTMLElement;\r\n  inputRef: HTMLInputElement;\r\n\r\n  @Method()\r\n  async clearSelection() {\r\n    if (this.selectedItem && this.selectedItem.length > 0) {\r\n      this.selectedItem = [];\r\n    }\r\n\r\n    if (this.selectedItems && this.selectedItems.length > 0) {\r\n      this.selectedItems = [];\r\n    }\r\n\r\n    if (this.value && this.value.length > 0) {\r\n      this.value = [];\r\n      this.selectedItems = [];\r\n      this.selectedItem = [];\r\n    }\r\n\r\n    this.unselectedItems = [...this.items];\r\n    this.state = 'default';\r\n  }\r\n\r\n  clearInput() {\r\n    if (this.inputRef) {\r\n      this.inputRef.value = '';\r\n      this.inputValue = this.inputRef.value;\r\n      this.showCloseButton = false;\r\n      this.inputValueChanged.emit(this.inputValue);\r\n    }\r\n  }\r\n\r\n  @Watch('items')\r\n  updateResultsAndShowInDropdown(newItems: any[]) {\r\n    this.internalItems = [...newItems];\r\n  }\r\n\r\n  @Watch('loading')\r\n  onLoadingChanged(newLoading: boolean) {\r\n    this.internalLoading = newLoading;\r\n\r\n    if (newLoading) this.dropdownOpen = true;\r\n  }\r\n\r\n  emitInputValueToUseForSearch() {\r\n    if (this.inputRef.value.length > 0 && this.internalItems.length === 0) {\r\n      this.loading = true;\r\n    } else if (this.inputRef.value.length > 0 && this.internalItems.length > 0) {\r\n      this.showCloseButton = true;\r\n      this.inputValueChanged.emit(this.inputRef.value);\r\n    } else {\r\n      this.showCloseButton = false;\r\n      this.dropdownOpen = false;\r\n      this.loading = false;\r\n    }\r\n  }\r\n\r\n  searchItemsInDropdownMenu(event: CustomEvent<any>) {\r\n    this.searchItem = event.detail;\r\n    this.searchResults = this.items.filter(item => {\r\n      if (typeof item === 'string') return item.toLowerCase().includes(this.searchItem.toLowerCase());\r\n\r\n      if (typeof item === 'number') return item.toString().includes(this.searchItem.toString());\r\n\r\n      if (typeof item === 'object') return item.name.toLowerCase().includes(this.searchItem.toLowerCase());\r\n    });\r\n  }\r\n\r\n  @Watch('destructive')\r\n  watchDestructive() {\r\n    this.destructive = this.destructive;\r\n  }\r\n\r\n  disconnectedCallback() {\r\n    document.removeEventListener('click', this.handleClickOutside);\r\n  }\r\n\r\n  @Listen('click', { target: 'document' })\r\n  handleClickOutside(event: MouseEvent) {\r\n    if (this.dropdownOpen && !this.el.contains(event.target as Node)) {\r\n      this.dropdownOpen = false;\r\n    }\r\n  }\r\n\r\n  toggleDropdown(event: MouseEvent) {\r\n    if (this.state !== 'disabled') {\r\n      this.dropdownOpen = !this.dropdownOpen;\r\n    }\r\n\r\n    event.stopPropagation();\r\n  }\r\n\r\n  isItemSelected(item) {\r\n    const isObject = typeof item === 'object';\r\n    if (this.value.length === 0) {\r\n      return this.selectedItems.some(i => (isObject ? i.name === item.name : i === item));\r\n    } else if (this.value.length > 0) {\r\n      return this.value.some(i => (isObject ? i.name === item.name : i === item));\r\n    }\r\n  }\r\n\r\n  async loadIcon(iconName: string) {\r\n    const iconPath = getAssetPath(`${iconName}`);\r\n    const response = await fetch(iconPath);\r\n    const svg = await response.text();\r\n    this.leadingIconSvg = svg;\r\n  }\r\n\r\n  getAvatarSize() {\r\n    switch (this.size) {\r\n      case 'sm':\r\n        return 'xs';\r\n      case 'md':\r\n        return 'xs';\r\n    }\r\n  }\r\n\r\n  sortDropdownItems(menuItems: any[]): any[] {\r\n    return menuItems.sort((a, b) => {\r\n      if (a.selected && !b.selected) {\r\n        return -1; // Move selected items up\r\n      } else if (!a.selected && b.selected) {\r\n        return 1; // Keep unselected items down\r\n      }\r\n      return 0; // Keep order if both are selected or unselected\r\n    });\r\n  }\r\n\r\n  handleItemSelect(item) {\r\n    this.destructive = false;\r\n\r\n    if (this.type === 'tags') {\r\n      if (this.state === 'default') {\r\n        this.selectMultipleItems(item);\r\n        // console.log(this.state);\r\n      } else if (this.state === 'filled' && this.value.length > 0) {\r\n        this.state = 'default';\r\n        this.value.length = 0;\r\n        // console.log(this.state);\r\n        this.selectMultipleItems(item);\r\n      } else if (this.state === 'filled' && this.value.length === 0) {\r\n        this.selectMultipleItems(item);\r\n        // console.log(this.state);\r\n      }\r\n    } else {\r\n      if (this.state === 'default') {\r\n        this.singleItemSelect(item);\r\n        // console.log(this.state);\r\n      } else if (this.state === 'filled' && this.value.length > 0) {\r\n        this.state = 'default';\r\n        this.value.length = 0;\r\n        this.singleItemSelect(item);\r\n        // console.log(this.state);\r\n      } else if (this.state === 'filled' && this.value.length === 0) {\r\n        this.singleItemSelect(item);\r\n        // console.log(this.state);\r\n      }\r\n    }\r\n\r\n    this.state = this.selectedItems.length > 0 ? 'filled' : 'default';\r\n    // console.log(this.state)\r\n  }\r\n\r\n  singleItemSelect(item) {\r\n    // Handle single selection for other types\r\n    this.selectedItem = item; // Store single selected item\r\n    this.selectedItems = [item]; // Ensure only one item in selectedItems\r\n\r\n    // Close the dropdown after selection for single selection types\r\n    this.dropdownOpen = false;\r\n    // console.log(this.selectedItems);\r\n    this.dropdownItemSelected.emit(this.selectedItem);\r\n  }\r\n\r\n  selectMultipleItems(item) {\r\n    const isObject = typeof item === 'object';\r\n\r\n    const isSelected = this.selectedItems.some(i => (isObject ? i.name === item.name : i === item));\r\n\r\n    if (isSelected) {\r\n      // Unselect item: Move it from selectedItems to unselectedItems\r\n      this.selectedItems = this.selectedItems.filter(i => (isObject ? i.name !== item.name : i !== item));\r\n      if (!this.unselectedItems.some(i => (isObject ? i.name === item.name : i === item))) {\r\n        this.unselectedItems = [...this.unselectedItems, item];\r\n      }\r\n      this.dropdownItemSelected.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.name !== item.name : i !== item));\r\n\r\n      this.dropdownItemSelected.emit(this.selectedItems);\r\n    }\r\n  }\r\n\r\n  handleTagRemove(item) {\r\n    if (this.value.length === 0) {\r\n      const isObject = typeof item === 'object';\r\n\r\n      // Remove item from selectedItems\r\n      this.selectedItems = this.selectedItems.filter(i => (isObject ? i.name !== item.name : i !== item));\r\n\r\n      // Add item back to unselectedItems if not already present\r\n      if (!this.unselectedItems.some(i => (isObject ? i.name === item.name : i === item))) {\r\n        this.unselectedItems = [...this.unselectedItems, item];\r\n      }\r\n\r\n      this.dropdownItemSelected.emit(this.selectedItems);\r\n\r\n      // Optionally update state or emit event\r\n      this.state = this.selectedItems.length > 0 ? 'filled' : 'default';\r\n    } else if (this.value.length > 0) {\r\n      const isObject = typeof item === 'object';\r\n\r\n      // Remove item from selectedItems\r\n      this.value = this.value.filter(i => (isObject ? i.name !== item.name : i !== item));\r\n      this.selectedItems = this.value;\r\n\r\n      // Add item back to unselectedItems if not already present\r\n      if (!this.unselectedItems.some(i => (isObject ? i.name === item.name : i === item))) {\r\n        this.unselectedItems = [...this.unselectedItems, item];\r\n      }\r\n\r\n      this.dropdownItemSelected.emit(this.selectedItems);\r\n\r\n      // Optionally update state or emit event\r\n      this.state = this.selectedItems.length > 0 ? 'filled' : 'default';\r\n    }\r\n  }\r\n\r\n  componentWillRender() {\r\n    if (this.value.length > 0 && this.state === 'default') {\r\n      this.state = 'filled';\r\n    }\r\n  }\r\n\r\n  componentWillLoad() {\r\n    this.loadIcon(this.leadingIcon);\r\n\r\n    // setTimeout(() => {\r\n    //   this.loading = true;\r\n      \r\n    //   setTimeout(() => {\r\n    //     this.items = ['Hi', '8', 'Omo', 98];\r\n    //   }, 5000);\r\n    // }, 2000);\r\n\r\n    if (this.type !== 'tags') {\r\n      this.selectedItem = null; // For single selection types\r\n    }\r\n\r\n    if (this.value.length > 0) {\r\n      if (Array.isArray(this.items)) {\r\n        this.selectedItems = [];\r\n        this.unselectedItems = [];\r\n\r\n        // Separate objects from primitive values\r\n        const objectValues = this.value.filter(val => typeof val === 'object' && val !== null);\r\n        const primitiveValues = this.value.filter(val => typeof val !== 'object');\r\n\r\n        // Find selected items\r\n        this.selectedItems = this.items.filter(item => {\r\n          if (typeof item === 'object' && item !== null) {\r\n            return objectValues.some(val => val.name === item.name);\r\n          } else {\r\n            return primitiveValues.includes(item);\r\n          }\r\n        });\r\n\r\n        // Find unselected items\r\n        this.unselectedItems = this.items.filter(item => {\r\n          if (typeof item === 'object' && item !== null) {\r\n            return !objectValues.some(val => val.name === item.name);\r\n          } else {\r\n            return !primitiveValues.includes(item);\r\n          }\r\n        });\r\n      }\r\n    } else {\r\n      // If value array is empty, all items are unselected\r\n      this.selectedItems = [];\r\n      this.unselectedItems = [...this.items];\r\n    }\r\n\r\n    // console.log('Selected Items:', this.selectedItems);\r\n    // console.log('Unselected Items:', this.unselectedItems);\r\n  }\r\n\r\n  componentDidLoad() {\r\n    if (this.type !== 'tags') {\r\n      document.addEventListener('click', this.handleClickOutside);\r\n    }\r\n\r\n    const slottedInitials = this.el.querySelector('[slot=\"initials\"]');\r\n\r\n    const mainTextSlot = this.el.querySelector('[slot=\"tooltip_label\"]');\r\n    const supportingTextSlot = this.el.querySelector('[slot=\"tooltip_supporting_text\"]');\r\n\r\n    if (slottedInitials) {\r\n      slottedInitials.classList.add('text-xxs-semi-bold');\r\n    }\r\n\r\n    if (mainTextSlot) {\r\n      mainTextSlot.classList.add('text-xs-semi-bold');\r\n    }\r\n\r\n    if (supportingTextSlot) {\r\n      supportingTextSlot.classList.add('text-xs-regular');\r\n    }\r\n  }\r\n\r\n  applyColorToInitials() {\r\n    switch (this.color) {\r\n      case 'gray':\r\n        return 'gray';\r\n      case 'blue':\r\n        return 'blue';\r\n      case 'cyan':\r\n        return 'cyan';\r\n      case 'pink':\r\n        return 'pink';\r\n      case 'purple':\r\n        return 'purple';\r\n      case 'green':\r\n        return 'green';\r\n      case 'yellow':\r\n        return 'yellow';\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const emptyStateBackground = getAssetPath('assets/empty-state-background.svg');\r\n    const illustration = getAssetPath('assets/empty-state-no-data.svg');\r\n\r\n    return [\r\n      <div class={`input_dropdown_container ${this.type === 'tags' ? 'tag' : ''}`}>\r\n        <div class={`input_with_label`}>\r\n          {this.showLabel && (\r\n            <p class=\"text-sm-regular\" style={{ color: '#4B5565' }}>\r\n              {this.label.charAt(0).toUpperCase() + this.label.slice(1).toLowerCase()}\r\n            </p>\r\n          )}\r\n          <div\r\n            class={`input_dropdown_div ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''} ${this.type === 'tags' ? 'tag' : ''} ${\r\n              this.dropdownOpen ? 'focused' : ''\r\n            }`}\r\n            onClick={e => this.toggleDropdown(e)}\r\n          >\r\n            {this.type === 'icon_leading' && (\r\n              <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                <path\r\n                  d=\"M5.48131 12.9013C4.30234 13.6033 1.21114 15.0368 3.09388 16.8305C4.01359 17.7067 5.03791 18.3333 6.32572 18.3333H13.6743C14.9621 18.3333 15.9864 17.7067 16.9061 16.8305C18.7889 15.0368 15.6977 13.6033 14.5187 12.9013C11.754 11.2551 8.24599 11.2551 5.48131 12.9013Z\"\r\n                  stroke=\"#697586\"\r\n                  stroke-width=\"1.66667\"\r\n                />\r\n                <path\r\n                  d=\"M13.75 5.41667C13.75 7.48774 12.0711 9.16667 10 9.16667C7.92893 9.16667 6.25 7.48774 6.25 5.41667C6.25 3.3456 7.92893 1.66667 10 1.66667C12.0711 1.66667 13.75 3.3456 13.75 5.41667Z\"\r\n                  stroke=\"#697586\"\r\n                  stroke-width=\"1.66667\"\r\n                />\r\n              </svg>\r\n            )}\r\n            {this.type === 'avatar_leading' && (\r\n              <>\r\n                {this.state === 'default' && (\r\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                    <path\r\n                      d=\"M5.48131 12.9013C4.30234 13.6033 1.21114 15.0368 3.09388 16.8305C4.01359 17.7067 5.03791 18.3333 6.32572 18.3333H13.6743C14.9621 18.3333 15.9864 17.7067 16.9061 16.8305C18.7889 15.0368 15.6977 13.6033 14.5187 12.9013C11.754 11.2551 8.24599 11.2551 5.48131 12.9013Z\"\r\n                      stroke=\"#4B5565\"\r\n                      stroke-width=\"1.66667\"\r\n                    />\r\n                    <path\r\n                      d=\"M13.75 5.41666C13.75 7.48772 12.0711 9.16666 10 9.16666C7.92893 9.16666 6.25 7.48772 6.25 5.41666C6.25 3.34559 7.92893 1.66666 10 1.66666C12.0711 1.66666 13.75 3.34559 13.75 5.41666Z\"\r\n                      stroke=\"#4B5565\"\r\n                      stroke-width=\"1.66667\"\r\n                    />\r\n                  </svg>\r\n                )}\r\n                {this.state === 'filled' && (\r\n                  <gb-avatar size=\"xs\" text={this.text} color={this.color} show-border={this.showBorder}>\r\n                    {this.selectedItems.map(item => (\r\n                      <>\r\n                        {typeof item === 'object' ? (\r\n                          <h1 slot=\"initials\">{item.name.split(' ').map(part => part.charAt(0).toUpperCase())}</h1>\r\n                        ) : (\r\n                          <h1 slot=\"initials\">{item.split(' ').map(part => part.charAt(0).toUpperCase())}</h1>\r\n                        )}\r\n                      </>\r\n                    ))}\r\n                  </gb-avatar>\r\n                )}\r\n              </>\r\n            )}\r\n            {this.showLeadingIcon && <>{this.type === 'search' || this.type === 'tags' ? <div class={`icon`} innerHTML={this.leadingIconSvg}></div> : null}</>}\r\n            {this.type === 'dot_leading' && (\r\n              <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"10\" viewBox=\"0 0 10 10\" fill=\"none\" class={`dot ${this.size}`}>\r\n                <circle cx=\"5\" cy=\"5\" r=\"4\" fill=\"#079455\" />\r\n              </svg>\r\n            )}\r\n            <>\r\n              {this.state === 'default' && this.type !== 'search' && (\r\n                <>\r\n                  {this.placeholder && (\r\n                    <div class=\"placeholder\">\r\n                      <p class={`text-${this.size}-regular`} style={{ color: '#CDD5DF' }}>\r\n                        {this.placeholder}\r\n                      </p>\r\n                    </div>\r\n                  )}\r\n                </>\r\n              )}\r\n              {this.state === 'default' && this.type === 'search' && (\r\n                <div class=\"search_input\">\r\n                  <input\r\n                    type=\"text\"\r\n                    placeholder={this.placeholder}\r\n                    class={`text-${this.size}-regular`}\r\n                    ref={el => (this.inputRef = el)}\r\n                    onInput={this.emitInputValueToUseForSearch.bind(this)}\r\n                  />\r\n                  {this.showCloseButton && (\r\n                    <gb-button\r\n                      class={`close_button ${this.size}`}\r\n                      size={this.size}\r\n                      hierarchy=\"tertiary_gray\"\r\n                      icon=\"only\"\r\n                      state=\"default\"\r\n                      icon-leading={true}\r\n                      icon-leading-swap=\"assets/cancel-01.svg\"\r\n                      onClick={() => this.clearInput()}\r\n                    ></gb-button>\r\n                  )}\r\n                </div>\r\n              )}\r\n              {this.state === 'filled' && (\r\n                <>\r\n                  <div class={`content`}>\r\n                    <div class={`text text-${this.size}-regular ${this.type === 'tags' ? 'tag' : ''}`} style={{ color: '#4B5565' }}>\r\n                      {this.type === 'tags' ? (\r\n                        <>\r\n                          {this.value.length === 0 ? (\r\n                            <>\r\n                              {this.selectedItems.map((item, index) =>\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(item)}>\r\n                                      <p class=\"text-xs-medium\">{item.name.split(' ')[0]}</p>\r\n                                      <h1 slot=\"initials\" class=\"text-xxs-semi-bold\">\r\n                                        {item.name\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(item)}>\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                              {this.value.map((item, index) =>\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(item)}>\r\n                                      <p class=\"text-xs-medium\">{item.name.split(' ')[0]}</p>\r\n                                      <h1 slot=\"initials\" class=\"text-xxs-semi-bold\">\r\n                                        {item.name\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(item)}>\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                        <p class={`selected_text text-${this.size}-regular`}>\r\n                          {this.value.length === 0 ? this.selectedItem?.name || this.selectedItem : <>{this.value.map(item => (typeof item === 'object' ? item.name : item))}</>}\r\n                        </p>\r\n                      )}\r\n                    </div>\r\n                    {this.supportingText && (\r\n                      <div class={`supporting_text text-${this.size}-regular`} style={{ color: '#697586' }}>\r\n                        {this.type !== 'tags' && (\r\n                          <>{this.value.length === 0 ? <>{this.selectedItem.username}</> : <>{this.value.map(item => typeof item === 'object' && item.username)}</>}</>\r\n                        )}\r\n                      </div>\r\n                    )}\r\n                  </div>\r\n                </>\r\n              )}\r\n              {this.state === 'disabled' && (\r\n                <>\r\n                  <div class={`content`}>\r\n                    <div class={`text text-md-regular ${this.type === 'tags' ? 'tag' : ''}`} style={{ color: '#4B5565' }}>\r\n                      {this.type === 'tags' ? (\r\n                        <>\r\n                          {this.value.map((item, index) =>\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\">\r\n                                  <p class=\"text-xs-medium\">{item.name.split(' ')[0]}</p>\r\n                                  <h1 slot=\"initials\" class=\"text-xxs-semi-bold\">\r\n                                    {item.name\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\">\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                        <>{<>{this.value.map(item => (typeof item === 'object' ? item.name : item))}</>}</>\r\n                      )}\r\n                    </div>\r\n                    {this.supportingText && (\r\n                      <div class=\"supporting_text text-sm-regular\" style={{ color: '#697586' }}>\r\n                        {this.type !== 'tags' && (\r\n                          <>{this.value.length === 0 ? <>{this.selectedItem.username}</> : <>{this.value.map(item => typeof item === 'object' && <>{item.username}</>)}</>}</>\r\n                        )}\r\n                      </div>\r\n                    )}\r\n                  </div>\r\n                </>\r\n              )}\r\n            </>\r\n            {this.showHelpIcon && (\r\n              <div class={`help_icon`}>\r\n                <gb-help-tooltip show-supporting-text={true}>\r\n                  <slot name=\"tooltip_label\" slot=\"label\"></slot>\r\n                  <slot name=\"tooltip_supporting_text\" slot=\"supporting_text\"></slot>\r\n                </gb-help-tooltip>\r\n              </div>\r\n            )}\r\n            {this.type !== 'search' && (\r\n              <div class={`dropdown_icon ${this.dropdownOpen ? 'opened' : ''}`}>\r\n                <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" class={`${this.state}`}>\r\n                  <path\r\n                    d=\"M15 7.50004C15 7.50004 11.3176 12.5 9.99996 12.5C8.68237 12.5 5 7.5 5 7.5\"\r\n                    stroke=\"#697586\"\r\n                    stroke-width=\"1.66667\"\r\n                    stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\"\r\n                  />\r\n                </svg>\r\n              </div>\r\n            )}\r\n            <>\r\n              {this.dropdownOpen && (\r\n                <div class={`dropdown_menu ${this.menuPosition}`} ref={el => (this.dropdownRef = el)} onClick={e => e.stopPropagation()}>\r\n                  {this.showSearchInput && (\r\n                    <div class=\"dropdown_search_field\">\r\n                      <gb-input-field\r\n                        size=\"sm\"\r\n                        value={this.inputValue}\r\n                        show-close-button={this.inputValue ? true : false}\r\n                        icon-swap=\"assets/search-01.svg\"\r\n                        placeholder={this.placeholder}\r\n                        type=\"icon_leading\"\r\n                        labelText=\"label\"\r\n                        idOfInput=\"3\"\r\n                        onInputValueChanged={this.searchItemsInDropdownMenu.bind(this)}\r\n                      ></gb-input-field>\r\n                    </div>\r\n                  )}\r\n                  {this.loading && (\r\n                    <div class=\"loader_div\">\r\n                      <div class=\"loader\"></div>\r\n                    </div>\r\n                  )}\r\n                  {this.searchItem ? (\r\n                    <>\r\n                      {this.searchItem !== '' && this.searchResults.length > 0 ? (\r\n                        <>\r\n                          {this.searchResults.map(item => (\r\n                            <gb-input-dropdown-menu-item\r\n                              type={this.type === 'tags' ? 'checkbox' : this.type}\r\n                              state={StateEnum.Default}\r\n                              supporting-text={this.supportingText}\r\n                              selected={this.isItemSelected(item)}\r\n                              onClick={() => this.handleItemSelect(item)}\r\n                            >\r\n                              {typeof item === 'object' ? (\r\n                                <>\r\n                                  <p slot=\"name\">{item.name}</p>\r\n                                  <p slot=\"supporting_text\">{item.username}</p>\r\n                                </>\r\n                              ) : (\r\n                                <p slot=\"name\">{item}</p>\r\n                              )}\r\n                            </gb-input-dropdown-menu-item>\r\n                          ))}\r\n                        </>\r\n                      ) : this.searchItem !== '' && this.searchResults.length === 0 ? (\r\n                        //Empty state for when there are no search results\r\n                        <div class=\"empty_state\">\r\n                          <img src={emptyStateBackground} class=\"background\" alt=\"\" />\r\n                          <div class=\"message_background\">\r\n                            <img src={illustration} alt=\"\" class=\"illustration\" />\r\n                            <p class=\"message text-md-semi-bold\">No results available</p>\r\n                          </div>\r\n                        </div>\r\n                      ) : null}\r\n                    </>\r\n                  ) : (\r\n                    <>\r\n                      {this.type === 'tags' ? (\r\n                        <>\r\n                          {this.selectedItems.map(item => (\r\n                            <gb-input-dropdown-menu-item\r\n                              type={this.type === 'search' ? 'checkbox' : this.type === 'tags' ? 'checkbox' : this.type}\r\n                              state={StateEnum.Default}\r\n                              supporting-text={this.supportingText}\r\n                              selected={true}\r\n                              onClick={() => this.handleItemSelect(item)}\r\n                            >\r\n                              {typeof item === 'object' ? (\r\n                                <>\r\n                                  <p slot=\"name\">{item.name}</p>\r\n                                  <p slot=\"supporting_text\">{item.username}</p>\r\n                                  <h1 slot=\"initials\">{item.name.split(' ').map(part => part.charAt(0).toUpperCase())}</h1>\r\n                                </>\r\n                              ) : (\r\n                                <>\r\n                                  <p slot=\"name\">{item}</p>\r\n                                  <h1 slot=\"initials\">{item.split(' ').map(part => part.charAt(0).toUpperCase())}</h1>\r\n                                </>\r\n                              )}\r\n                            </gb-input-dropdown-menu-item>\r\n                          ))}\r\n                          {this.unselectedItems.map(item => (\r\n                            <gb-input-dropdown-menu-item\r\n                              type={this.type === 'search' ? 'checkbox' : this.type === 'tags' ? 'checkbox' : this.type}\r\n                              state={StateEnum.Default}\r\n                              supporting-text={this.supportingText}\r\n                              selected={false}\r\n                              onClick={() => this.handleItemSelect(item)}\r\n                            >\r\n                              {typeof item === 'object' ? (\r\n                                <>\r\n                                  <p slot=\"name\">{item.name}</p>\r\n                                  <p slot=\"supporting_text\">{item.username}</p>\r\n                                </>\r\n                              ) : (\r\n                                <p slot=\"name\">{item}</p>\r\n                              )}\r\n                            </gb-input-dropdown-menu-item>\r\n                          ))}\r\n                        </>\r\n                      ) : (\r\n                        <>\r\n                          {this.items.map(item => (\r\n                            <gb-input-dropdown-menu-item\r\n                              type={this.type === 'tags' ? 'checkbox' : this.type}\r\n                              state={StateEnum.Default}\r\n                              supporting-text={this.supportingText}\r\n                              selected={this.isItemSelected(item)}\r\n                              color={this.color}\r\n                              onClick={() => this.handleItemSelect(item)}\r\n                            >\r\n                              {typeof item === 'object' ? (\r\n                                <>\r\n                                  <p slot=\"name\">{item.name}</p>\r\n                                  <h1 slot=\"initials\">\r\n                                    {item.name\r\n                                      .split(' ')\r\n                                      .map(part => part.charAt(0).toUpperCase())\r\n                                      .join('')}\r\n                                  </h1>\r\n                                  <p slot=\"supporting_text\">{item.username}</p>\r\n                                </>\r\n                              ) : typeof item === 'string' ? (\r\n                                <>\r\n                                  <p slot=\"name\">{item}</p>\r\n                                  <h1 slot=\"initials\">\r\n                                    {item\r\n                                      .split(' ')\r\n                                      .map(part => part.charAt(0).toUpperCase())\r\n                                      .join('')}\r\n                                  </h1>\r\n                                </>\r\n                              ) : (\r\n                                <>\r\n                                  <p slot=\"name\">{item}</p>\r\n                                  <h1 slot=\"initials\">{item}</h1>\r\n                                </>\r\n                              )}\r\n                            </gb-input-dropdown-menu-item>\r\n                          ))}\r\n                        </>\r\n                      )}\r\n                    </>\r\n                  )}\r\n                </div>\r\n              )}\r\n            </>\r\n          </div>\r\n        </div>\r\n        {/* <button onClick={() => this.clearValue()}>Clear</button> */}\r\n        {this.showHintText && <>{!this.destructive ? <p class=\"hint_text text-sm-regular\">{this.hintText}</p> : <p class=\"error_text text-sm-regular\">{this.errorText}</p>}</>}\r\n      </div>,\r\n    ];\r\n  }\r\n}\r\n",".button_base_div{\r\n    display: flex;\r\n    align-items: center;\r\n    align-self: stretch;\r\n    border-right: 1px solid var(--color-border-subtle, #CDD5DF);\r\n    justify-content: center;\r\n    cursor: pointer;\r\n    width: fit-content;\r\n}\r\n\r\n.button_base_div:hover{\r\n    background: var(--color-background-gray-subtler, #EEF2F6);\r\n}\r\n\r\n.button_base_div.active{\r\n    background: var(--color-background-gray-subtler, #EEF2F6);\r\n}\r\n\r\n.button_base_div:active{\r\n    background: none;\r\n}\r\n\r\n.button_base_div.false{\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n    align-items: center;\r\n    width: 2.5rem;\r\n    height: 2.5rem;\r\n    padding: var(--spacing-none);\r\n}\r\n\r\n.button_base_div.leading,\r\n.button_base_div.trailing{\r\n    height: 2.5rem;\r\n    gap: 0.5rem;\r\n    padding: var(--spacing-none) var(--spacing-4);\r\n}\r\n\r\n.button_base_div.only{\r\n    width: 2.5rem;\r\n    height: 2.5rem;\r\n}\r\n\r\n::slotted(p){\r\n    color: var(--color-text, #4B5565);\r\n}\r\n\r\n::slotted(p.active_text){\r\n    color: var(--color-text-bold, #202939);\r\n}","import { Component, Prop, h, Fragment, Element, getAssetPath, State } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: 'gb-pagination-button-group-base',\r\n  styleUrl: 'gb-pagination-button-group-base.css',\r\n  shadow: true,\r\n})\r\nexport class GbPaginationButtonGroupBase {\r\n  @Prop() icon: 'false' | 'only' | 'trailing' | 'leading';\r\n  @Prop() state: 'default' | 'active';\r\n  @Prop() iconSrc: string;\r\n  @State() leadingIconSvg: string = '';\r\n  @Element() el: HTMLElement;\r\n\r\n  componentDidLoad() {\r\n    const slottedContent = this.el.querySelector('p');\r\n\r\n    if (slottedContent) {\r\n      slottedContent.classList.add('text-sm-semi-bold');\r\n    }\r\n\r\n    if(this.state === 'active') {\r\n      slottedContent.classList.add('active_text');\r\n    }\r\n\r\n    this.loadIcon(this.iconSrc);\r\n  }\r\n\r\n  async loadIcon(iconName: string) {\r\n    const iconPath = getAssetPath(`${iconName}`);\r\n    const response = await fetch(iconPath);\r\n    const svg = await response.text();\r\n    this.leadingIconSvg = svg;\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class={`button_base_div ${this.icon} ${this.state}`}>\r\n        {this.icon === 'false' && <slot></slot>}\r\n        {this.icon === 'leading' && (\r\n          <>\r\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n              <path\r\n                d=\"M3.33325 9.99981H16.6666M3.33325 9.99981C3.33326 11.0978 7.49975 14.1667 7.49975 14.1667M3.33325 9.99981C3.33324 8.90182 7.49978 5.83334 7.49978 5.83334\"\r\n                stroke=\"#4B5565\"\r\n                stroke-width=\"1.67\"\r\n                stroke-linecap=\"round\"\r\n                stroke-linejoin=\"round\"\r\n              />\r\n            </svg>\r\n            <slot></slot>\r\n          </>\r\n        )}\r\n        {this.icon === 'trailing' && (\r\n          <>\r\n            <slot></slot>\r\n              <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                <path\r\n                  d=\"M16.6668 9.99984H3.3335M16.6668 9.99984C16.6668 11.0978 12.5003 14.1667 12.5003 14.1667M16.6668 9.99984C16.6669 8.90185 12.5002 5.83337 12.5002 5.83337\"\r\n                  stroke=\"#4B5565\"\r\n                  stroke-width=\"1.5\"\r\n                  stroke-linecap=\"round\"\r\n                  stroke-linejoin=\"round\"\r\n                />\r\n              </svg>\r\n          </>\r\n        )}\r\n        {this.icon === 'only' && (\r\n          <>\r\n          <div class={`icon`} innerHTML={this.leadingIconSvg}></div>\r\n          </>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n}","@import './../../global/global.css';\r\n\r\n.page_number_base{\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    width: 2.5rem;\r\n    height: 2.5rem;\r\n    cursor: pointer;\r\n}\r\n\r\n/* Shape Styles */\r\n.page_number_base.square{\r\n    border-radius: var(--rounded-sm);\r\n}\r\n\r\n.page_number_base.circle{\r\n    border-radius: 1.25rem;\r\n}\r\n\r\n/* State Styles */\r\n.page_number_base:hover{\r\n    background-color: var(--color-background-information-subtler, #C8E0F9);\r\n}\r\n\r\n.page_number_base:active,\r\n.page_number_base.active{\r\n    background-color: var(--color-background-information-subtle, #9AC7F4);\r\n}\r\n\r\n::slotted([slot=\"page_number\"].default) {\r\n    color: var(--color-text, #4B5565);\r\n}\r\n\r\n::slotted([slot=\"page_number\"].active) {\r\n    color: var(--color-text-bold, #202939);\r\n}","import { Component, Element, Prop, h } from \"@stencil/core\";\r\nimport { PaginationNumberShapes } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n  tag: 'gb-pagination-number-base',\r\n  styleUrl: 'gb-pagination-number-base.css',\r\n  shadow: true,\r\n})\r\nexport class GbPaginationNumberBase {\r\n  @Prop() shape: PaginationNumberShapes;\r\n  @Prop() state: 'default' | 'active' | 'pressed';\r\n  @Element() el: HTMLElement;\r\n\r\n  componentDidLoad() {\r\n    const slottedContent = this.el.querySelector('[slot=\"page_number\"]');\r\n\r\n    if (slottedContent) {\r\n      slottedContent.classList.add('text-sm-medium');\r\n    }\r\n\r\n    if (this.state === 'default') {\r\n      slottedContent.classList.add('default');\r\n    }\r\n\r\n    if (this.state === 'active') {\r\n      slottedContent.classList.add('active');\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class={`page_number_base ${this.shape} ${this.state}`}>\r\n        <slot name=\"page_number\"></slot>\r\n      </div>\r\n    );\r\n  }\r\n}"],"mappings":"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","ignoreList":[]}