@trendyol/baklava 3.0.0-beta.3 → 3.0.0-beta.5

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 (90) hide show
  1. package/dist/assets/sorting_asc.svg +4 -0
  2. package/dist/assets/sorting_desc.svg +4 -0
  3. package/dist/baklava-react.d.ts +45 -0
  4. package/dist/baklava-react.d.ts.map +1 -1
  5. package/dist/baklava-react.js +1 -1
  6. package/dist/baklava-react.js.map +3 -3
  7. package/dist/baklava-vue.d.ts +6 -0
  8. package/dist/baklava.d.ts +6 -0
  9. package/dist/baklava.d.ts.map +1 -1
  10. package/dist/baklava.js +1 -1
  11. package/dist/{chunk-VXYXKLNG.js → chunk-3IQYFKUZ.js} +2 -2
  12. package/dist/{chunk-GHYIIGW6.js → chunk-3OCSISWP.js} +33 -33
  13. package/dist/{chunk-GHYIIGW6.js.map → chunk-3OCSISWP.js.map} +2 -2
  14. package/dist/chunk-6DJUQN3S.js +2 -0
  15. package/dist/chunk-6DJUQN3S.js.map +7 -0
  16. package/dist/chunk-6FHZDUYQ.js +16 -0
  17. package/dist/chunk-6FHZDUYQ.js.map +7 -0
  18. package/dist/{chunk-WPMIVZ4A.js → chunk-DR4D2GMR.js} +2 -2
  19. package/dist/{chunk-PWZJTYMH.js → chunk-FPDUGGJ5.js} +2 -2
  20. package/dist/chunk-HMDGICS5.js +2 -0
  21. package/dist/chunk-HMDGICS5.js.map +7 -0
  22. package/dist/chunk-HZ6A5QFC.js +2 -0
  23. package/dist/chunk-HZ6A5QFC.js.map +7 -0
  24. package/dist/{chunk-2YD3I4BZ.js → chunk-IU67AS3O.js} +2 -2
  25. package/dist/chunk-K3IALLEI.js +2 -0
  26. package/dist/chunk-K3IALLEI.js.map +7 -0
  27. package/dist/chunk-TI6K2YFV.js +11 -0
  28. package/dist/chunk-TI6K2YFV.js.map +7 -0
  29. package/dist/chunk-WJ2RNEDL.js +8 -0
  30. package/dist/chunk-WJ2RNEDL.js.map +7 -0
  31. package/dist/chunk-XDUIVR6I.js +2 -0
  32. package/dist/chunk-XDUIVR6I.js.map +7 -0
  33. package/dist/components/checkbox-group/bl-checkbox-group.js +1 -1
  34. package/dist/components/checkbox-group/checkbox/bl-checkbox.js +1 -1
  35. package/dist/components/icon/icon-list.d.ts +1 -1
  36. package/dist/components/icon/icon-list.d.ts.map +1 -1
  37. package/dist/components/icon/icon-list.js +1 -1
  38. package/dist/components/icon/icon-list.js.map +2 -2
  39. package/dist/components/input/bl-input.js +1 -1
  40. package/dist/components/pagination/bl-pagination.js +1 -1
  41. package/dist/components/radio-group/bl-radio-group.js +1 -1
  42. package/dist/components/radio-group/radio/bl-radio.js +1 -1
  43. package/dist/components/select/bl-select.d.ts.map +1 -1
  44. package/dist/components/select/bl-select.js +1 -1
  45. package/dist/components/tab-group/bl-tab-group.js +1 -1
  46. package/dist/components/table/bl-table.d.ts +120 -0
  47. package/dist/components/table/bl-table.d.ts.map +1 -0
  48. package/dist/components/table/bl-table.js +2 -0
  49. package/dist/components/table/bl-table.js.map +7 -0
  50. package/dist/components/table/bl-table.test.d.ts +6 -0
  51. package/dist/components/table/bl-table.test.d.ts.map +1 -0
  52. package/dist/components/table/table-body/bl-table-body.d.ts +19 -0
  53. package/dist/components/table/table-body/bl-table-body.d.ts.map +1 -0
  54. package/dist/components/table/table-body/bl-table-body.js +2 -0
  55. package/dist/components/table/table-body/bl-table-body.js.map +7 -0
  56. package/dist/components/table/table-body/bl-table-body.test.d.ts +2 -0
  57. package/dist/components/table/table-body/bl-table-body.test.d.ts.map +1 -0
  58. package/dist/components/table/table-cell/bl-table-cell.d.ts +35 -0
  59. package/dist/components/table/table-cell/bl-table-cell.d.ts.map +1 -0
  60. package/dist/components/table/table-cell/bl-table-cell.js +2 -0
  61. package/dist/components/table/table-cell/bl-table-cell.js.map +7 -0
  62. package/dist/components/table/table-cell/bl-table-cell.test.d.ts +2 -0
  63. package/dist/components/table/table-cell/bl-table-cell.test.d.ts.map +1 -0
  64. package/dist/components/table/table-header/bl-table-header.d.ts +22 -0
  65. package/dist/components/table/table-header/bl-table-header.d.ts.map +1 -0
  66. package/dist/components/table/table-header/bl-table-header.js +2 -0
  67. package/dist/components/table/table-header/bl-table-header.js.map +7 -0
  68. package/dist/components/table/table-header/bl-table-header.test.d.ts +2 -0
  69. package/dist/components/table/table-header/bl-table-header.test.d.ts.map +1 -0
  70. package/dist/components/table/table-header-cell/bl-table-header-cell.d.ts +43 -0
  71. package/dist/components/table/table-header-cell/bl-table-header-cell.d.ts.map +1 -0
  72. package/dist/components/table/table-header-cell/bl-table-header-cell.js +2 -0
  73. package/dist/components/table/table-header-cell/bl-table-header-cell.js.map +7 -0
  74. package/dist/components/table/table-header-cell/bl-table-header-cell.test.d.ts +2 -0
  75. package/dist/components/table/table-header-cell/bl-table-header-cell.test.d.ts.map +1 -0
  76. package/dist/components/table/table-row/bl-table-row.d.ts +31 -0
  77. package/dist/components/table/table-row/bl-table-row.d.ts.map +1 -0
  78. package/dist/components/table/table-row/bl-table-row.js +2 -0
  79. package/dist/components/table/table-row/bl-table-row.js.map +7 -0
  80. package/dist/components/table/table-row/bl-table-row.test.d.ts +2 -0
  81. package/dist/components/table/table-row/bl-table-row.test.d.ts.map +1 -0
  82. package/dist/components/textarea/bl-textarea.js +1 -1
  83. package/dist/custom-elements.json +561 -0
  84. package/package.json +1 -1
  85. package/dist/chunk-DJOD4BTL.js +0 -2
  86. package/dist/chunk-DJOD4BTL.js.map +0 -7
  87. /package/dist/{chunk-VXYXKLNG.js.map → chunk-3IQYFKUZ.js.map} +0 -0
  88. /package/dist/{chunk-WPMIVZ4A.js.map → chunk-DR4D2GMR.js.map} +0 -0
  89. /package/dist/{chunk-PWZJTYMH.js.map → chunk-FPDUGGJ5.js.map} +0 -0
  90. /package/dist/{chunk-2YD3I4BZ.js.map → chunk-IU67AS3O.js.map} +0 -0
@@ -1,21 +1,21 @@
1
- import{b as E,d as C,f as V,g as I,h as A}from"./chunk-EZSEQHRH.js";import{a as $}from"./chunk-3B64VOWB.js";import{a as z}from"./chunk-DJOD4BTL.js";import{a as k,c as u}from"./chunk-HBPBDC7T.js";import{a as y}from"./chunk-ECPWEUBG.js";import{a as f}from"./chunk-6LT7O7T2.js";import{a as m}from"./chunk-DINNT5P2.js";import{a as x}from"./chunk-GRL4DWKG.js";import{a as T,b as s,c as p,e as h,f as S}from"./chunk-X2KXJYXQ.js";import{a as w,b as r,f as g}from"./chunk-4OT5AMS5.js";import{d as l}from"./chunk-IZ2LK5GK.js";var R=w`:host{width:200px;display:inline-block}.select-wrapper{width:100%;position:relative;display:grid;gap:var(--bl-size-3xs);--padding-vertical:var(--bl-size-2xs);--padding-horizontal:var(--bl-size-xs);--label-padding:var(--bl-size-3xs);--border-size:1px;--background-color:var(--bl-color-neutral-full);--border-color:var(--bl-color-neutral-lighter);--border-focus-color:var(--bl-color-primary-highlight);--icon-color:var(--bl-color-neutral-light);--text-color:var(--bl-color-neutral-darker);--label-color:var(--bl-color-neutral-dark);--placeholder-color:var(--bl-color-neutral-light);--height:var(--bl-size-2xl);--menu-padding:0 var(--bl-size-m);--menu-margin-top:var(--bl-size-2xs);--font-size:var(--bl-font-size-m);--disabled-color:var(--bl-color-neutral-lightest);--menu-height:250px;--popover-position:var(--bl-popover-position, fixed)}:host([multiple][view-select-all]) .select-wrapper{--menu-height:290px}:host([size="large"]) .select-wrapper{--height:var(--bl-size-3xl);--padding-vertical:var(--bl-size-xs);--padding-horizontal:var(--bl-size-m)}:host([size="small"]) .select-wrapper{--height:var(--bl-size-xl);--padding-vertical:var(--bl-size-3xs);--padding-horizontal:var(--bl-size-xs);--font-size:var(--bl-font-size-s)}:host([disabled]) .select-wrapper{--placeholder-color:var(--bl-color-neutral-light)}.dirty.invalid{--border-color:var(--bl-color-danger);--border-focus-color:var(--bl-color-danger-highlight);--label-color:var(--bl-color-danger)}.select-input{display:grid;align-items:center;justify-content:space-between;grid-template-columns:1fr max-content max-content;cursor:pointer;box-sizing:border-box;height:var(--height);border:solid 1px var(--border-color);font:var(--bl-font-title-3-regular);padding:0 calc(var(--padding-horizontal) - var(--label-padding) - var(--border-size));border-radius:var(--bl-border-radius-s);color:var(--text-color);background-color:var(--background-color);/* stylelint-disable-next-line property-no-vendor-prefix */-webkit-user-select:none;user-select:none;margin:0;width:auto;min-width:100%}.label,.placeholder{color:var(--placeholder-color);padding-left:var(--label-padding);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}:host(:not([placeholder])) .placeholder,.select-wrapper.selected .placeholder,:host([label]:not([label-fixed])) .select-wrapper:not(.select-open) .placeholder{display:none}:host([label-fixed]) .label,:host(:not([label])) .label{display:none}.remove-all{display:none}.selected .remove-all{display:block}:host([disabled]) .remove-all,:host([disabled]) .remove-all::after{display:none}.dropdown-icon{font-size:var(--bl-font-size-m)}.dropdown-icon.open{display:none}.select-open .dropdown-icon.open{display:inline-block}.select-open .dropdown-icon.closed{display:none}.selected .dropdown-icon{--icon-color:var(--bl-color-neutral-darker)}:host([disabled]) .dropdown-icon{--icon-color:var(--bl-color-neutral-light)}.select-open .select-input,.select-input:focus-visible{border:solid 1px var(--border-focus-color);outline:none}:host([disabled]){cursor:not-allowed}:host([disabled]) .select-input{pointer-events:none;background-color:var(--disabled-color)}.select-input .selected-options{padding:0;padding-left:var(--label-padding);margin:0;list-style:none;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host([disabled]) .select-input .selected-options{color:var(--bl-color-neutral-light)}.selected-options li{display:inline;font-size:var(--font-size);color:var(--text-color)}.selected-options li:not(:last-child)::after{content:", "}.select-input:not(.has-overflowed-options) .additional-selection-count{display:none}:host([disabled]) .additional-selection-count{color:var(--bl-color-neutral-light)}:host([disabled]) .selected-options li{color:var(--bl-color-neutral-light)}.select-input .actions{display:flex;align-items:center;justify-content:center;gap:var(--bl-size-4xs);margin-left:var(--bl-size-2xs)}.popover{--left:0;--top:0;position:var(--popover-position);border:solid 1px var(--border-color);background-color:var(--background-color);font:var(--bl-font-title-3-regular);border-radius:var(--bl-border-radius-s);padding:var(--menu-padding);outline:none;box-sizing:border-box;max-height:var(--menu-height);overflow-y:auto;display:none;flex-direction:column;z-index:var(--bl-index-popover);width:100%;top:var(--top);left:var(--left)}.popover-no-result{display:flex;flex-direction:column;gap:var(--bl-size-2xs);align-items:center;justify-content:center;height:80px}.select-open .popover{display:flex;border:solid 1px var(--border-focus-color)}bl-icon{color:var(--icon-color)}legend,label{padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}label{position:absolute;display:block;top:var(--padding-vertical);left:var(--padding-horizontal);right:calc(var(--bl-size-2xs) + var(--bl-size-m) + var(--bl-size-2xs));transition:all ease-in 0.1s;pointer-events:none;opacity:0;font:var(--bl-font-title-3-regular);font-size:var(--font-size);color:var(--placeholder-color)}legend{height:0;visibility:hidden;display:none}legend span{padding:0 var(--label-padding);display:inline-block;opacity:0;visibility:visible}:host([placeholder]) :where(.select-open, .selected) .label,:host(:not([placeholder])) .selected .label{display:none}:where(.select-open, .selected) label{top:0;transform:translateY(-50%);font:var(--bl-font-caption);color:var(--label-color);pointer-events:initial;right:var(--padding-horizontal);opacity:1}:host([label]) :where(.select-open, .selected) legend{max-width:100%;font:var(--bl-font-caption);display:block}:host([label-fixed]) label{position:static;padding:0;transition:none;transform:none;pointer-events:initial;font:var(--bl-font-caption);color:var(--label-color);opacity:1}:host([label-fixed]) legend{display:none}.hint{display:none;font:var(--bl-font-body-text-3)}.hint p{padding:0;margin:0}.error-icon,.invalid-text{display:none}.dirty.invalid label,.invalid-text,.error-icon{color:var(--bl-color-danger)}.help-text{color:var(--bl-color-neutral-dark)}.select-open .help-text,.select-open .invalid-text{visibility:hidden}:host([help-text]) .hint,.dirty.invalid .hint{display:block}.dirty.invalid .invalid-text{display:block}.dirty.invalid .help-text{display:none}.select-all{position:sticky;top:0;padding:var(--bl-size-xs) 0;background:var(--background-color);z-index:1;font:var(--bl-font-title-3-regular);/* Make sure option focus doesn't overflow */box-shadow:10px 0 0 var(--background-color),-10px 0 0 var(--background-color)}.select-all::after{position:absolute;content:"";width:100%;bottom:0;border-bottom:1px solid var(--bl-color-neutral-lighter)}.search-bar-input{font:var(--bl-font-title-3-regular);font-size:var(--font-size);color:var(--text-color);border:none;outline:none;background-color:transparent;width:100%;height:100%;padding:0;margin:0;box-sizing:border-box}.search-bar-input::placeholder{color:var(--placeholder-color)}.search-bar-input:focus-visible{outline:none}.search-loading-icon{animation:spin 1s linear infinite}.action-divider{display:none}.select-wrapper .action-divider{display:block;height:1rem;width:1px;background-color:var(--bl-color-neutral-lighter)}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.actions bl-icon{padding:4px}`,M=R;var i=class extends z(g){constructor(){super(...arguments);this.size="medium";this.required=!1;this.disabled=!1;this.clearable=!1;this.multiple=!1;this.autofocus=!1;this.labelFixed=!1;this.viewSelectAll=!1;this.searchBar=!1;this.searchBarLoadingState=!1;this._isPopoverOpen=!1;this._additionalSelectedOptionCount=0;this._searchText="";this._connectedOptions=[];this._cleanUpPopover=null;this._selectedOptions=[];this.dirty=!1;this._interactOutsideHandler=e=>{var o;let t=e.composedPath();(o=t==null?void 0:t.find(a=>a.tagName==="BL-SELECT"))!=null&&o.contains(this)||this.close()};this.focusedOptionIndex=-1}static get styles(){return[M]}get value(){return this._value}set value(e){if(this._value=e,Array.isArray(e)){let t=new FormData;e.forEach(o=>t.append(this.name,`${o}`)),this.setValue(t)}else this.setValue(e);this.setOptionsSelected()}shouldFormValueUpdate(){return this.value!==null&&this.value!==""}setOptionsSelected(){this._connectedOptions.forEach(e=>e.selected=this.value===e.value||Array.isArray(this.value)&&this.value.includes(e.value)),this._selectedOptions=[...this.options.filter(e=>e.selected)]}get options(){return this._connectedOptions}get opened(){return this._isPopoverOpen}get noResultFound(){return this._searchText!==""&&this._connectedOptions.every(e=>e.hidden)}get selectedOptions(){return this._selectedOptions}get additionalSelectedOptionCount(){return this._additionalSelectedOptionCount}validityCallback(){if(this.customInvalidText)return this.customInvalidText;let e=document.createElement("select");return e.required=this.required,e.validationMessage}reportValidity(){return this.dirty=!0,this.checkValidity()}resetFormControl(){this.value=this._initialValue}open(){this.searchBar&&setTimeout(()=>{var e,t,o;(o=(t=(e=document.activeElement)==null?void 0:e.shadowRoot)==null?void 0:t.querySelector("input"))==null||o.focus()},100),this._isPopoverOpen=!0,this._setupPopover(),document.addEventListener("click",this._interactOutsideHandler,!0),document.addEventListener("focus",this._interactOutsideHandler,!0)}close(){this._handleSearchOptions({target:{value:""}}),this._isPopoverOpen=!1,this.focusedOptionIndex=-1,this._cleanUpPopover&&this._cleanUpPopover(),document.removeEventListener("click",this._interactOutsideHandler,!0),document.removeEventListener("focus",this._interactOutsideHandler,!0)}_setupPopover(){this._cleanUpPopover=I(this._selectInput,this._popover,()=>{A(this._selectInput,this._popover,{placement:"bottom",strategy:"fixed",middleware:[E(),C(8),V({apply(e){Object.assign(e.elements.floating.style,{width:`${e.elements.reference.getBoundingClientRect().width}px`})}})]}).then(({x:e,y:t})=>{this._popover.style.setProperty("--left",`${e}px`),this._popover.style.setProperty("--top",`${t}px`)})})}connectedCallback(){var e;super.connectedCallback(),(e=this.form)==null||e.addEventListener("submit",t=>{this.reportValidity()||t.preventDefault()})}disconnectedCallback(){super.disconnectedCallback(),this._cleanUpPopover&&this._cleanUpPopover()}inputTemplate(){var O;let e=r`<ul class="selected-options">
2
- ${this._selectedOptions.map(b=>r`<li>${b.getAttribute("label")||b.textContent}</li>`)}
3
- </ul>`,a=!(this._selectedOptions.length>0&&this._selectedOptions.every(b=>b.disabled))&&(this.clearable||this.multiple)?r`<bl-button
1
+ import{b as E,d as C,f as V,g as I,h as A}from"./chunk-EZSEQHRH.js";import{a as z}from"./chunk-3B64VOWB.js";import{a as $}from"./chunk-XDUIVR6I.js";import{a as k,c as u}from"./chunk-HBPBDC7T.js";import{a as y}from"./chunk-ECPWEUBG.js";import{a as f}from"./chunk-6LT7O7T2.js";import{a as m}from"./chunk-DINNT5P2.js";import{a as x}from"./chunk-GRL4DWKG.js";import{a as T,b as s,c as p,e as h,f as S}from"./chunk-X2KXJYXQ.js";import{a as w,b as n,f as g}from"./chunk-4OT5AMS5.js";import{d as l}from"./chunk-IZ2LK5GK.js";var R=w`:host{width:200px;display:inline-block}.select-wrapper{width:100%;position:relative;display:grid;gap:var(--bl-size-3xs);--padding-vertical:var(--bl-size-2xs);--padding-horizontal:var(--bl-size-xs);--label-padding:var(--bl-size-3xs);--border-size:1px;--background-color:var(--bl-color-neutral-full);--border-color:var(--bl-color-neutral-lighter);--border-focus-color:var(--bl-color-primary-highlight);--icon-color:var(--bl-color-neutral-light);--text-color:var(--bl-color-neutral-darker);--label-color:var(--bl-color-neutral-dark);--placeholder-color:var(--bl-color-neutral-light);--height:var(--bl-size-2xl);--menu-padding:0 var(--bl-size-m);--menu-margin-top:var(--bl-size-2xs);--font-size:var(--bl-font-size-m);--disabled-color:var(--bl-color-neutral-lightest);--menu-height:250px;--popover-position:var(--bl-popover-position, fixed)}:host([multiple][view-select-all]) .select-wrapper{--menu-height:290px}:host([size="large"]) .select-wrapper{--height:var(--bl-size-3xl);--padding-vertical:var(--bl-size-xs);--padding-horizontal:var(--bl-size-m)}:host([size="small"]) .select-wrapper{--height:var(--bl-size-xl);--padding-vertical:var(--bl-size-3xs);--padding-horizontal:var(--bl-size-xs);--font-size:var(--bl-font-size-s)}:host([disabled]) .select-wrapper{--placeholder-color:var(--bl-color-neutral-light)}.dirty.invalid{--border-color:var(--bl-color-danger);--border-focus-color:var(--bl-color-danger-highlight);--label-color:var(--bl-color-danger)}.select-input{display:grid;align-items:center;justify-content:space-between;grid-template-columns:1fr max-content max-content;cursor:pointer;box-sizing:border-box;height:var(--height);border:solid 1px var(--border-color);font:var(--bl-font-title-3-regular);padding:0 calc(var(--padding-horizontal) - var(--label-padding) - var(--border-size));border-radius:var(--bl-border-radius-s);color:var(--text-color);background-color:var(--background-color);/* stylelint-disable-next-line property-no-vendor-prefix */-webkit-user-select:none;user-select:none;margin:0;width:auto;min-width:100%}.label,.placeholder{color:var(--placeholder-color);padding-left:var(--label-padding);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}:host(:not([placeholder])) .placeholder,.select-wrapper.selected .placeholder,:host([label]:not([label-fixed])) .select-wrapper:not(.select-open) .placeholder{display:none}:host([label-fixed]) .label,:host(:not([label])) .label{display:none}.remove-all{display:none}.selected .remove-all{display:block}:host([disabled]) .remove-all,:host([disabled]) .remove-all::after{display:none}.dropdown-icon{font-size:var(--bl-font-size-m)}.dropdown-icon.open{display:none}.select-open .dropdown-icon.open{display:inline-block}.select-open .dropdown-icon.closed{display:none}.selected .dropdown-icon{--icon-color:var(--bl-color-neutral-darker)}:host([disabled]) .dropdown-icon{--icon-color:var(--bl-color-neutral-light)}.select-open .select-input,.select-input:focus-visible{border:solid 1px var(--border-focus-color);outline:none}:host([disabled]){cursor:not-allowed}:host([disabled]) .select-input{pointer-events:none;background-color:var(--disabled-color)}.select-input .selected-options{padding:0;padding-left:var(--label-padding);margin:0;list-style:none;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host([disabled]) .select-input .selected-options{color:var(--bl-color-neutral-light)}.selected-options li{display:inline;font-size:var(--font-size);color:var(--text-color)}.selected-options li:not(:last-child)::after{content:", "}.select-input:not(.has-overflowed-options) .additional-selection-count{display:none}:host([disabled]) .additional-selection-count{color:var(--bl-color-neutral-light)}:host([disabled]) .selected-options li{color:var(--bl-color-neutral-light)}.select-input .actions{display:flex;align-items:center;justify-content:center;gap:var(--bl-size-4xs);margin-left:var(--bl-size-2xs)}.popover{--left:0;--top:0;position:var(--popover-position);border:solid 1px var(--border-color);background-color:var(--background-color);font:var(--bl-font-title-3-regular);border-radius:var(--bl-border-radius-s);padding:var(--menu-padding);outline:none;box-sizing:border-box;max-height:var(--menu-height);overflow-y:auto;display:none;flex-direction:column;z-index:var(--bl-index-popover);width:100%;top:var(--top);left:var(--left)}.popover-no-result{display:flex;flex-direction:column;gap:var(--bl-size-2xs);align-items:center;justify-content:center;height:80px}.select-open .popover{display:flex;border:solid 1px var(--border-focus-color)}bl-icon{color:var(--icon-color)}legend,label{padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}label{position:absolute;display:block;top:var(--padding-vertical);left:var(--padding-horizontal);right:calc(var(--bl-size-2xs) + var(--bl-size-m) + var(--bl-size-2xs));transition:all ease-in 0.1s;pointer-events:none;opacity:0;font:var(--bl-font-title-3-regular);font-size:var(--font-size);color:var(--placeholder-color)}legend{height:0;visibility:hidden;display:none}legend span{padding:0 var(--label-padding);display:inline-block;opacity:0;visibility:visible}:host([placeholder]) :where(.select-open, .selected) .label,:host(:not([placeholder])) .selected .label{display:none}:where(.select-open, .selected) label{top:0;transform:translateY(-50%);font:var(--bl-font-caption);color:var(--label-color);pointer-events:initial;right:var(--padding-horizontal);opacity:1}:host([label]) :where(.select-open, .selected) legend{max-width:100%;font:var(--bl-font-caption);display:block}:host([label-fixed]) label{position:static;padding:0;transition:none;transform:none;pointer-events:initial;font:var(--bl-font-caption);color:var(--label-color);opacity:1}:host([label-fixed]) legend{display:none}.hint{display:none;font:var(--bl-font-body-text-3)}.hint p{padding:0;margin:0}.error-icon,.invalid-text{display:none}.dirty.invalid label,.invalid-text,.error-icon{color:var(--bl-color-danger)}.help-text{color:var(--bl-color-neutral-dark)}.select-open .help-text,.select-open .invalid-text{visibility:hidden}:host([help-text]) .hint,.dirty.invalid .hint{display:block}.dirty.invalid .invalid-text{display:block}.dirty.invalid .help-text{display:none}.select-all{position:sticky;top:0;padding:var(--bl-size-xs) 0;background:var(--background-color);z-index:1;font:var(--bl-font-title-3-regular);/* Make sure option focus doesn't overflow */box-shadow:10px 0 0 var(--background-color),-10px 0 0 var(--background-color)}.select-all::after{position:absolute;content:"";width:100%;bottom:0;border-bottom:1px solid var(--bl-color-neutral-lighter)}.search-bar-input{font:var(--bl-font-title-3-regular);font-size:var(--font-size);color:var(--text-color);border:none;outline:none;background-color:transparent;width:100%;height:100%;padding:0;margin:0;box-sizing:border-box}.search-bar-input::placeholder{color:var(--placeholder-color)}.search-bar-input:focus-visible{outline:none}.search-loading-icon{animation:spin 1s linear infinite}.action-divider{display:none}.select-wrapper .action-divider{display:block;height:1rem;width:1px;background-color:var(--bl-color-neutral-lighter)}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.actions bl-icon{padding:4px}`,M=R;var i=class extends $(g){constructor(){super(...arguments);this.size="medium";this.required=!1;this.disabled=!1;this.clearable=!1;this.multiple=!1;this.autofocus=!1;this.labelFixed=!1;this.viewSelectAll=!1;this.searchBar=!1;this.searchBarLoadingState=!1;this._isPopoverOpen=!1;this._additionalSelectedOptionCount=0;this._searchText="";this._connectedOptions=[];this._cleanUpPopover=null;this._selectedOptions=[];this.dirty=!1;this._interactOutsideHandler=e=>{var o;let t=e.composedPath();(o=t==null?void 0:t.find(a=>a.tagName==="BL-SELECT"))!=null&&o.contains(this)||this.close()};this.focusedOptionIndex=-1}static get styles(){return[M]}get value(){return this._value}set value(e){if(this._value=e,Array.isArray(e)){let t=new FormData;e.forEach(o=>t.append(this.name,`${o}`)),this.setValue(t)}else this.setValue(e);this.setOptionsSelected()}shouldFormValueUpdate(){return this.value!==null&&this.value!==""}setOptionsSelected(){this._connectedOptions.forEach(e=>e.selected=this.value===e.value||Array.isArray(this.value)&&this.value.includes(e.value)),this._selectedOptions=[...this.options.filter(e=>e.selected)]}get options(){return this._connectedOptions}get opened(){return this._isPopoverOpen}get noResultFound(){return this._searchText!==""&&this._connectedOptions.every(e=>e.hidden)}get selectedOptions(){return this._selectedOptions}get additionalSelectedOptionCount(){return this._additionalSelectedOptionCount}validityCallback(){if(this.customInvalidText)return this.customInvalidText;let e=document.createElement("select");return e.required=this.required,e.validationMessage}reportValidity(){return this.dirty=!0,this.checkValidity()}resetFormControl(){this.value=this._initialValue}open(){this.searchBar&&setTimeout(()=>{var e,t,o;(o=(t=(e=document.activeElement)==null?void 0:e.shadowRoot)==null?void 0:t.querySelector("input"))==null||o.focus()},100),this._isPopoverOpen=!0,this._setupPopover(),document.addEventListener("click",this._interactOutsideHandler,!0),document.addEventListener("focus",this._interactOutsideHandler,!0)}close(){this._handleSearchOptions({target:{value:""}}),this._isPopoverOpen=!1,this.focusedOptionIndex=-1,this._cleanUpPopover&&this._cleanUpPopover(),document.removeEventListener("click",this._interactOutsideHandler,!0),document.removeEventListener("focus",this._interactOutsideHandler,!0)}_setupPopover(){this._cleanUpPopover=I(this._selectInput,this._popover,()=>{A(this._selectInput,this._popover,{placement:"bottom",strategy:"fixed",middleware:[E(),C(8),V({apply(e){Object.assign(e.elements.floating.style,{width:`${e.elements.reference.getBoundingClientRect().width}px`})}})]}).then(({x:e,y:t})=>{this._popover.style.setProperty("--left",`${e}px`),this._popover.style.setProperty("--top",`${t}px`)})})}connectedCallback(){var e;super.connectedCallback(),(e=this.form)==null||e.addEventListener("submit",t=>{this.reportValidity()||t.preventDefault()})}disconnectedCallback(){super.disconnectedCallback(),this._cleanUpPopover&&this._cleanUpPopover()}inputTemplate(){var O;let e=n`<ul class="selected-options">
2
+ ${this._selectedOptions.map(b=>n`<li>${b.getAttribute("label")||b.textContent}</li>`)}
3
+ </ul>`,a=!(this._selectedOptions.length>0&&this._selectedOptions.every(b=>b.disabled))&&(this.clearable||this.multiple)?n`<bl-button
4
4
  class="remove-all"
5
5
  size="small"
6
6
  variant="tertiary"
7
7
  kind="neutral"
8
8
  icon="close"
9
9
  @click=${this._onClickRemove}
10
- ></bl-button>`:"",d=this.searchBar&&this.opened,c=this.multiple&&this._selectedOptions.length>0,n=d||c,v=(O=this.searchBarPlaceholder)!=null?O:u("Search",{desc:"bl-select: search placeholder text"}),L=r`<bl-icon
10
+ ></bl-button>`:"",d=this.searchBar&&this.opened,c=this.multiple&&this._selectedOptions.length>0,r=d||c,v=(O=this.searchBarPlaceholder)!=null?O:u("Search",{desc:"bl-select: search placeholder text"}),L=n`<bl-icon
11
11
  class="search-mag-icon"
12
12
  name="search"
13
13
  style="color: var(--bl-color-primary);font-size: var(--bl-font-size-s)"
14
- ></bl-icon>`,P=r`<bl-icon
14
+ ></bl-icon>`,P=n`<bl-icon
15
15
  class="search-loading-icon"
16
16
  name="loading"
17
17
  style="color: var(--bl-color-primary);font-size: var(--bl-font-size-s)"
18
- ></bl-icon>`,_=n?r`<div class="action-divider"></div>`:"",D=r`<fieldset
18
+ ></bl-icon>`,_=r?n`<div class="action-divider"></div>`:"",D=n`<fieldset
19
19
  class=${f({"select-input":!0,"has-overflowed-options":this._additionalSelectedOptionCount>0})}
20
20
  tabindex="${this.disabled?"-1":0}"
21
21
  .autofocus=${this.autofocus}
@@ -27,7 +27,7 @@ import{b as E,d as C,f as V,g as I,h as A}from"./chunk-EZSEQHRH.js";import{a as
27
27
  >
28
28
  <legend><span>${this.label}</span></legend>
29
29
 
30
- ${this._selectedOptions.length>0&&!this.opened?e:r`
30
+ ${this._selectedOptions.length>0&&!this.opened?e:n`
31
31
  <input
32
32
  class="search-bar-input"
33
33
  placeholder=${v}
@@ -35,7 +35,7 @@ import{b as E,d as C,f as V,g as I,h as A}from"./chunk-EZSEQHRH.js";import{a as
35
35
  .value=${this._searchText}
36
36
  />
37
37
  `}
38
- ${this.opened?"":r`<span class="additional-selection-count"
38
+ ${this.opened?"":n`<span class="additional-selection-count"
39
39
  >+${this._additionalSelectedOptionCount}</span
40
40
  >`}
41
41
 
@@ -49,7 +49,7 @@ import{b as E,d as C,f as V,g as I,h as A}from"./chunk-EZSEQHRH.js";import{a as
49
49
  <bl-icon class="dropdown-icon closed" name="arrow_down"></bl-icon>
50
50
  </div>
51
51
  </div>
52
- </fieldset>`;return this.searchBar?D:r`<fieldset
52
+ </fieldset>`;return this.searchBar?D:n`<fieldset
53
53
  class=${f({"select-input":!0,"has-overflowed-options":this._additionalSelectedOptionCount>0})}
54
54
  tabindex="${m(this.disabled?void 0:0)}"
55
55
  ?autofocus=${this.autofocus}
@@ -70,7 +70,7 @@ import{b as E,d as C,f as V,g as I,h as A}from"./chunk-EZSEQHRH.js";import{a as
70
70
 
71
71
  <bl-icon class="dropdown-icon closed" name="arrow_down"></bl-icon>
72
72
  </div>
73
- </fieldset>`}selectAllTemplate(){var a;if(!this.multiple||!this.viewSelectAll||this.noResultFound)return null;let e=this._connectedOptions.filter(d=>!d.hidden).every(d=>d.selected),t=this._selectedOptions.filter(d=>!d.hidden).length>0,o=(a=this.selectAllText)!=null?a:u("Select All",{desc:"bl-select: select all text"});return r`<bl-checkbox
73
+ </fieldset>`}selectAllTemplate(){var a;if(!this.multiple||!this.viewSelectAll||this.noResultFound)return null;let e=this._connectedOptions.filter(d=>!d.hidden).every(d=>d.selected),t=this._selectedOptions.filter(d=>!d.hidden).length>0,o=(a=this.selectAllText)!=null?a:u("Select All",{desc:"bl-select: select all text"});return n`<bl-checkbox
74
74
  class="select-all"
75
75
  .checked="${e}"
76
76
  .indeterminate="${t&&!e}"
@@ -79,32 +79,32 @@ import{b as E,d as C,f as V,g as I,h as A}from"./chunk-EZSEQHRH.js";import{a as
79
79
  @bl-checkbox-change="${this._handleSelectAll}"
80
80
  >
81
81
  ${o}
82
- </bl-checkbox>`}render(){var c,n;let e=this.checkValidity()?"":r`<p id="errorMessage" aria-live="polite" class="invalid-text">
82
+ </bl-checkbox>`}render(){var c,r;let e=this.checkValidity()?"":n`<p id="errorMessage" aria-live="polite" class="invalid-text">
83
83
  ${this.validationMessage}
84
- </p>`,t=this.helpText?r`<p class="help-text">${this.helpText}</p>`:"",o=this.label?r`<label id="label">${this.label}</label>`:"",a=(c=this.searchNotFoundText)!=null?c:u("No Data Found",{desc:"bl-select: search no data text"}),d=(n=this.popoverClearSearchText)!=null?n:u("Clear Search",{desc:"bl-select: clear search button text"});return r`<div
84
+ </p>`,t=this.helpText?n`<p class="help-text">${this.helpText}</p>`:"",o=this.label?n`<label id="label">${this.label}</label>`:"",a=(c=this.searchNotFoundText)!=null?c:u("No Data Found",{desc:"bl-select: search no data text"}),d=(r=this.popoverClearSearchText)!=null?r:u("Clear Search",{desc:"bl-select: clear search button text"});return n`<div
85
85
  class=${f({"select-wrapper":!0,"select-open":this.opened,selected:this._selectedOptions.length>0,invalid:!this.validity.valid,dirty:this.dirty})}
86
86
  @keydown=${this.handleKeydown}
87
87
  >
88
88
  ${o} ${this.inputTemplate()}
89
- <div
90
- class="popover"
91
- tabindex="${m(this._isPopoverOpen?void 0:"-1")}"
92
- @bl-select-option=${this._handleSelectOptionEvent}
93
- role="listbox"
94
- aria-multiselectable="${this.multiple}"
95
- aria-labelledby="label"
96
- >
97
- ${this.selectAllTemplate()}
98
- <slot></slot>
99
- ${this.searchBar&&this.noResultFound?r`<div name="popover-clear-search-text" class="popover-no-result">
100
- <span>${a}</span>
101
- <bl-button
102
- variant="tertiary"
103
- @click=${()=>{this._handleSearchOptions({target:{value:""}})}}
104
- >${d}</bl-button
105
- >
106
- </div>`:""}
107
- </div>
89
+ ${this.options.length>0?n` <div
90
+ class="popover"
91
+ tabindex="${m(this._isPopoverOpen?void 0:"-1")}"
92
+ @bl-select-option=${this._handleSelectOptionEvent}
93
+ role="listbox"
94
+ aria-multiselectable="${this.multiple}"
95
+ aria-labelledby="label"
96
+ >
97
+ ${this.selectAllTemplate()}
98
+ <slot></slot>
99
+ ${this.searchBar&&this.noResultFound?n`<div name="popover-clear-search-text" class="popover-no-result">
100
+ <span>${a}</span>
101
+ <bl-button
102
+ variant="tertiary"
103
+ @click=${()=>{this._handleSearchOptions({target:{value:""}})}}
104
+ >${d}</bl-button
105
+ >
106
+ </div>`:""}
107
+ </div>`:""}
108
108
  <div class="hint">${e} ${t}</div>
109
- </div> `}handleKeydown(e){this.focusedOptionIndex===-1&&["Enter","Space"].includes(e.code)?(this._togglePopover(),e.preventDefault()):this._isPopoverOpen===!1&&["ArrowDown","ArrowUp"].includes(e.code)?(this.open(),e.preventDefault()):e.code==="Escape"?(this.close(),e.preventDefault()):this._isPopoverOpen&&["ArrowDown","ArrowUp"].includes(e.code)&&(e.code==="ArrowDown"&&this.focusedOptionIndex++,e.code==="ArrowUp"&&this.focusedOptionIndex--,this.focusedOptionIndex=Math.max(0,Math.min(this.focusedOptionIndex,this.options.length-1)),this.options[this.focusedOptionIndex].focus(),e.preventDefault())}_togglePopover(){this._isPopoverOpen?this.close():this.open()}_handleSelectEvent(){let e=this._selectedOptions.map(t=>({value:t.value,selected:t.selected,text:t.textContent}));this.multiple?this._onBlSelect(e):this._onBlSelect(e[0])}_handleSearchEvent(){this._onBlSearch(this._searchText)}_handleSearchOptions(e){this.searchBar&&(this._searchText=e.target.value,this._handleSearchEvent(),this._connectedOptions.forEach(t=>{var a;let o=(a=t.textContent)==null?void 0:a.toLowerCase().includes(this._searchText.toLowerCase());t.hidden=!o}),this._selectedOptions=this.options.filter(t=>t.selected),this._handleLastVisibleSearchedOption(),this.requestUpdate())}_handleLastVisibleSearchedOption(){var t,o;let e=[...this.options].reverse().find(a=>!a.hidden);e&&((o=(t=e==null?void 0:e.shadowRoot)==null?void 0:t.querySelector("div"))==null||o.classList.add("no-border-bottom")),this.options.map(a=>{var d,c;!a.hidden&&a!==e&&((c=(d=a.shadowRoot)==null?void 0:d.querySelector("div"))==null||c.classList.remove("no-border-bottom"))})}_handleSingleSelect(e){this.value=e.value,this._handleSelectEvent(),this._isPopoverOpen=!1}_handleMultipleSelect(){this.value=this._connectedOptions.filter(e=>e.selected).map(e=>e.value),this._handleSelectEvent()}_handleSelectOptionEvent(e){let t=e.target;this.dirty=!0,this.multiple?this._handleMultipleSelect():this._handleSingleSelect(t)}_handleSelectAll(e){var c;let t=(c=this.shadowRoot)==null?void 0:c.querySelector(".select-all"),o=e.detail,d=this._connectedOptions.filter(n=>!n.selected&&!n.hidden).every(n=>n.disabled);if(o&&d){setTimeout(()=>{var v;let n=(v=t==null?void 0:t.shadowRoot)==null?void 0:v.querySelector("input");n==null||n.click()},0);return}this._connectedOptions.forEach(n=>{n.disabled||n.hidden||(n.selected=o)}),this._handleMultipleSelect()}_onClickRemove(e){e.stopPropagation();let t=this._selectedOptions.filter(o=>o.disabled);this._connectedOptions.filter(o=>!o.disabled&&o.selected).forEach(o=>{o.selected=!1}),this.value=t.length?t.map(o=>o.value):null,this._handleSelectEvent()}_checkAdditionalItemCount(){if(!this.multiple||!this.selectedOptionsItems||this.selectedOptionsItems.length<2){this._additionalSelectedOptionCount=0;return}let e=[...this.selectedOptionsItems].findIndex(t=>t.offsetLeft>this.selectedOptionsContainer.offsetWidth);e>-1?this._additionalSelectedOptionCount=this.selectedOptionsItems.length-e:this._additionalSelectedOptionCount=0}firstUpdated(){this.value===void 0&&(this.value=""),this._initialValue=this._value}updated(e){e.has("multiple")&&typeof e.get("multiple")=="boolean"&&(this.value=null),e.has("_selectedOptions")&&this._checkAdditionalItemCount()}registerOption(e){this._connectedOptions.push(e),e.selected&&(this.multiple?(Array.isArray(this.value)||(this.value=[]),this.value=[...this.value,e.value]):this.value=e.value),this.setOptionsSelected(),this.requestUpdate()}unregisterOption(e){this._connectedOptions.splice(this._connectedOptions.indexOf(e),1)}};i.shadowRootOptions={...g.shadowRootOptions,delegatesFocus:!0},i.formControlValidators=[$],l([s()],i.prototype,"name",2),l([s()],i.prototype,"value",1),l([s({reflect:!0})],i.prototype,"label",2),l([s({reflect:!0})],i.prototype,"placeholder",2),l([s({type:String,reflect:!0})],i.prototype,"size",2),l([s({type:Boolean,reflect:!0})],i.prototype,"required",2),l([s({type:Boolean,reflect:!0})],i.prototype,"disabled",2),l([s({type:Boolean,reflect:!0})],i.prototype,"clearable",2),l([s({type:Boolean,reflect:!0})],i.prototype,"multiple",2),l([s({type:Boolean,reflect:!0})],i.prototype,"autofocus",2),l([s({type:Boolean,attribute:"label-fixed",reflect:!0})],i.prototype,"labelFixed",2),l([s({type:String,attribute:"help-text",reflect:!0})],i.prototype,"helpText",2),l([s({type:String,attribute:"invalid-text",reflect:!0})],i.prototype,"customInvalidText",2),l([s({type:Boolean,attribute:"view-select-all",converter:y()})],i.prototype,"viewSelectAll",2),l([s({type:String,attribute:"select-all-text"})],i.prototype,"selectAllText",2),l([s({type:Boolean,attribute:"search-bar",reflect:!0})],i.prototype,"searchBar",2),l([s({type:String,attribute:"search-bar-placeholder",reflect:!0})],i.prototype,"searchBarPlaceholder",2),l([s({type:Boolean,attribute:"search-bar-loading-state",converter:y()})],i.prototype,"searchBarLoadingState",2),l([s({type:String,attribute:"search-not-found-text",reflect:!0})],i.prototype,"searchNotFoundText",2),l([s({type:String,attribute:"popover-clear-search-text",reflect:!0})],i.prototype,"popoverClearSearchText",2),l([p()],i.prototype,"_isPopoverOpen",2),l([p()],i.prototype,"_additionalSelectedOptionCount",2),l([p()],i.prototype,"_searchText",2),l([h(".selected-options")],i.prototype,"selectedOptionsContainer",2),l([S(".selected-options li")],i.prototype,"selectedOptionsItems",2),l([h(".popover")],i.prototype,"_popover",2),l([h(".select-input")],i.prototype,"_selectInput",2),l([x("bl-select")],i.prototype,"_onBlSelect",2),l([x("bl-search")],i.prototype,"_onBlSearch",2),l([p()],i.prototype,"_selectedOptions",2),l([p()],i.prototype,"dirty",2),l([h(".select-input")],i.prototype,"validationTarget",2),i=l([T("bl-select"),k()],i);export{i as a};
110
- //# sourceMappingURL=chunk-GHYIIGW6.js.map
109
+ </div> `}handleKeydown(e){this.focusedOptionIndex===-1&&["Enter","Space"].includes(e.code)?(this._togglePopover(),e.preventDefault()):this._isPopoverOpen===!1&&["ArrowDown","ArrowUp"].includes(e.code)?(this.open(),e.preventDefault()):e.code==="Escape"?(this.close(),e.preventDefault()):this._isPopoverOpen&&["ArrowDown","ArrowUp"].includes(e.code)&&(e.code==="ArrowDown"&&this.focusedOptionIndex++,e.code==="ArrowUp"&&this.focusedOptionIndex--,this.focusedOptionIndex=Math.max(0,Math.min(this.focusedOptionIndex,this.options.length-1)),this.options[this.focusedOptionIndex].focus(),e.preventDefault())}_togglePopover(){this._isPopoverOpen?this.close():this.open()}_handleSelectEvent(){let e=this._selectedOptions.map(t=>({value:t.value,selected:t.selected,text:t.textContent}));this.multiple?this._onBlSelect(e):this._onBlSelect(e[0])}_handleSearchEvent(){this._onBlSearch(this._searchText)}_handleSearchOptions(e){this.searchBar&&(this._searchText=e.target.value,this._handleSearchEvent(),this._connectedOptions.forEach(t=>{var a;let o=(a=t.textContent)==null?void 0:a.toLowerCase().includes(this._searchText.toLowerCase());t.hidden=!o}),this._selectedOptions=this.options.filter(t=>t.selected),this._handleLastVisibleSearchedOption(),this.requestUpdate())}_handleLastVisibleSearchedOption(){var t,o;let e=[...this.options].reverse().find(a=>!a.hidden);e&&((o=(t=e==null?void 0:e.shadowRoot)==null?void 0:t.querySelector("div"))==null||o.classList.add("no-border-bottom")),this.options.map(a=>{var d,c;!a.hidden&&a!==e&&((c=(d=a.shadowRoot)==null?void 0:d.querySelector("div"))==null||c.classList.remove("no-border-bottom"))})}_handleSingleSelect(e){this.value=e.value,this._handleSelectEvent(),this._isPopoverOpen=!1}_handleMultipleSelect(){this.value=this._connectedOptions.filter(e=>e.selected).map(e=>e.value),this._handleSelectEvent()}_handleSelectOptionEvent(e){let t=e.target;this.dirty=!0,this.multiple?this._handleMultipleSelect():this._handleSingleSelect(t)}_handleSelectAll(e){var c;let t=(c=this.shadowRoot)==null?void 0:c.querySelector(".select-all"),o=e.detail,d=this._connectedOptions.filter(r=>!r.selected&&!r.hidden).every(r=>r.disabled);if(o&&d){setTimeout(()=>{var v;let r=(v=t==null?void 0:t.shadowRoot)==null?void 0:v.querySelector("input");r==null||r.click()},0);return}this._connectedOptions.forEach(r=>{r.disabled||r.hidden||(r.selected=o)}),this._handleMultipleSelect()}_onClickRemove(e){e.stopPropagation();let t=this._selectedOptions.filter(o=>o.disabled);this._connectedOptions.filter(o=>!o.disabled&&o.selected).forEach(o=>{o.selected=!1}),this.value=t.length?t.map(o=>o.value):null,this._handleSelectEvent()}_checkAdditionalItemCount(){if(!this.multiple||!this.selectedOptionsItems||this.selectedOptionsItems.length<2){this._additionalSelectedOptionCount=0;return}let e=[...this.selectedOptionsItems].findIndex(t=>t.offsetLeft>this.selectedOptionsContainer.offsetWidth);e>-1?this._additionalSelectedOptionCount=this.selectedOptionsItems.length-e:this._additionalSelectedOptionCount=0}firstUpdated(){this.value===void 0&&(this.value=""),this._initialValue=this._value}updated(e){e.has("multiple")&&typeof e.get("multiple")=="boolean"&&(this.value=null),e.has("_selectedOptions")&&this._checkAdditionalItemCount()}registerOption(e){this._connectedOptions.push(e),e.selected&&(this.multiple?(Array.isArray(this.value)||(this.value=[]),this.value=[...this.value,e.value]):this.value=e.value),this.setOptionsSelected(),this.requestUpdate()}unregisterOption(e){this._connectedOptions.splice(this._connectedOptions.indexOf(e),1)}};i.shadowRootOptions={...g.shadowRootOptions,delegatesFocus:!0},i.formControlValidators=[z],l([s()],i.prototype,"name",2),l([s()],i.prototype,"value",1),l([s({reflect:!0})],i.prototype,"label",2),l([s({reflect:!0})],i.prototype,"placeholder",2),l([s({type:String,reflect:!0})],i.prototype,"size",2),l([s({type:Boolean,reflect:!0})],i.prototype,"required",2),l([s({type:Boolean,reflect:!0})],i.prototype,"disabled",2),l([s({type:Boolean,reflect:!0})],i.prototype,"clearable",2),l([s({type:Boolean,reflect:!0})],i.prototype,"multiple",2),l([s({type:Boolean,reflect:!0})],i.prototype,"autofocus",2),l([s({type:Boolean,attribute:"label-fixed",reflect:!0})],i.prototype,"labelFixed",2),l([s({type:String,attribute:"help-text",reflect:!0})],i.prototype,"helpText",2),l([s({type:String,attribute:"invalid-text",reflect:!0})],i.prototype,"customInvalidText",2),l([s({type:Boolean,attribute:"view-select-all",converter:y()})],i.prototype,"viewSelectAll",2),l([s({type:String,attribute:"select-all-text"})],i.prototype,"selectAllText",2),l([s({type:Boolean,attribute:"search-bar",reflect:!0})],i.prototype,"searchBar",2),l([s({type:String,attribute:"search-bar-placeholder",reflect:!0})],i.prototype,"searchBarPlaceholder",2),l([s({type:Boolean,attribute:"search-bar-loading-state",converter:y()})],i.prototype,"searchBarLoadingState",2),l([s({type:String,attribute:"search-not-found-text",reflect:!0})],i.prototype,"searchNotFoundText",2),l([s({type:String,attribute:"popover-clear-search-text",reflect:!0})],i.prototype,"popoverClearSearchText",2),l([p()],i.prototype,"_isPopoverOpen",2),l([p()],i.prototype,"_additionalSelectedOptionCount",2),l([p()],i.prototype,"_searchText",2),l([h(".selected-options")],i.prototype,"selectedOptionsContainer",2),l([S(".selected-options li")],i.prototype,"selectedOptionsItems",2),l([h(".popover")],i.prototype,"_popover",2),l([h(".select-input")],i.prototype,"_selectInput",2),l([x("bl-select")],i.prototype,"_onBlSelect",2),l([x("bl-search")],i.prototype,"_onBlSearch",2),l([p()],i.prototype,"_selectedOptions",2),l([p()],i.prototype,"dirty",2),l([h(".select-input")],i.prototype,"validationTarget",2),i=l([T("bl-select"),k()],i);export{i as a};
110
+ //# sourceMappingURL=chunk-3OCSISWP.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../src/components/select/bl-select.css", "../src/components/select/bl-select.ts"],
4
- "sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host{width:200px;display:inline-block}.select-wrapper{width:100%;position:relative;display:grid;gap:var(--bl-size-3xs);--padding-vertical:var(--bl-size-2xs);--padding-horizontal:var(--bl-size-xs);--label-padding:var(--bl-size-3xs);--border-size:1px;--background-color:var(--bl-color-neutral-full);--border-color:var(--bl-color-neutral-lighter);--border-focus-color:var(--bl-color-primary-highlight);--icon-color:var(--bl-color-neutral-light);--text-color:var(--bl-color-neutral-darker);--label-color:var(--bl-color-neutral-dark);--placeholder-color:var(--bl-color-neutral-light);--height:var(--bl-size-2xl);--menu-padding:0 var(--bl-size-m);--menu-margin-top:var(--bl-size-2xs);--font-size:var(--bl-font-size-m);--disabled-color:var(--bl-color-neutral-lightest);--menu-height:250px;--popover-position:var(--bl-popover-position, fixed)}:host([multiple][view-select-all]) .select-wrapper{--menu-height:290px}:host([size=\"large\"]) .select-wrapper{--height:var(--bl-size-3xl);--padding-vertical:var(--bl-size-xs);--padding-horizontal:var(--bl-size-m)}:host([size=\"small\"]) .select-wrapper{--height:var(--bl-size-xl);--padding-vertical:var(--bl-size-3xs);--padding-horizontal:var(--bl-size-xs);--font-size:var(--bl-font-size-s)}:host([disabled]) .select-wrapper{--placeholder-color:var(--bl-color-neutral-light)}.dirty.invalid{--border-color:var(--bl-color-danger);--border-focus-color:var(--bl-color-danger-highlight);--label-color:var(--bl-color-danger)}.select-input{display:grid;align-items:center;justify-content:space-between;grid-template-columns:1fr max-content max-content;cursor:pointer;box-sizing:border-box;height:var(--height);border:solid 1px var(--border-color);font:var(--bl-font-title-3-regular);padding:0 calc(var(--padding-horizontal) - var(--label-padding) - var(--border-size));border-radius:var(--bl-border-radius-s);color:var(--text-color);background-color:var(--background-color);/* stylelint-disable-next-line property-no-vendor-prefix */-webkit-user-select:none;user-select:none;margin:0;width:auto;min-width:100%}.label,.placeholder{color:var(--placeholder-color);padding-left:var(--label-padding);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}:host(:not([placeholder])) .placeholder,.select-wrapper.selected .placeholder,:host([label]:not([label-fixed])) .select-wrapper:not(.select-open) .placeholder{display:none}:host([label-fixed]) .label,:host(:not([label])) .label{display:none}.remove-all{display:none}.selected .remove-all{display:block}:host([disabled]) .remove-all,:host([disabled]) .remove-all::after{display:none}.dropdown-icon{font-size:var(--bl-font-size-m)}.dropdown-icon.open{display:none}.select-open .dropdown-icon.open{display:inline-block}.select-open .dropdown-icon.closed{display:none}.selected .dropdown-icon{--icon-color:var(--bl-color-neutral-darker)}:host([disabled]) .dropdown-icon{--icon-color:var(--bl-color-neutral-light)}.select-open .select-input,.select-input:focus-visible{border:solid 1px var(--border-focus-color);outline:none}:host([disabled]){cursor:not-allowed}:host([disabled]) .select-input{pointer-events:none;background-color:var(--disabled-color)}.select-input .selected-options{padding:0;padding-left:var(--label-padding);margin:0;list-style:none;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host([disabled]) .select-input .selected-options{color:var(--bl-color-neutral-light)}.selected-options li{display:inline;font-size:var(--font-size);color:var(--text-color)}.selected-options li:not(:last-child)::after{content:\", \"}.select-input:not(.has-overflowed-options) .additional-selection-count{display:none}:host([disabled]) .additional-selection-count{color:var(--bl-color-neutral-light)}:host([disabled]) .selected-options li{color:var(--bl-color-neutral-light)}.select-input .actions{display:flex;align-items:center;justify-content:center;gap:var(--bl-size-4xs);margin-left:var(--bl-size-2xs)}.popover{--left:0;--top:0;position:var(--popover-position);border:solid 1px var(--border-color);background-color:var(--background-color);font:var(--bl-font-title-3-regular);border-radius:var(--bl-border-radius-s);padding:var(--menu-padding);outline:none;box-sizing:border-box;max-height:var(--menu-height);overflow-y:auto;display:none;flex-direction:column;z-index:var(--bl-index-popover);width:100%;top:var(--top);left:var(--left)}.popover-no-result{display:flex;flex-direction:column;gap:var(--bl-size-2xs);align-items:center;justify-content:center;height:80px}.select-open .popover{display:flex;border:solid 1px var(--border-focus-color)}bl-icon{color:var(--icon-color)}legend,label{padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}label{position:absolute;display:block;top:var(--padding-vertical);left:var(--padding-horizontal);right:calc(var(--bl-size-2xs) + var(--bl-size-m) + var(--bl-size-2xs));transition:all ease-in 0.1s;pointer-events:none;opacity:0;font:var(--bl-font-title-3-regular);font-size:var(--font-size);color:var(--placeholder-color)}legend{height:0;visibility:hidden;display:none}legend span{padding:0 var(--label-padding);display:inline-block;opacity:0;visibility:visible}:host([placeholder]) :where(.select-open, .selected) .label,:host(:not([placeholder])) .selected .label{display:none}:where(.select-open, .selected) label{top:0;transform:translateY(-50%);font:var(--bl-font-caption);color:var(--label-color);pointer-events:initial;right:var(--padding-horizontal);opacity:1}:host([label]) :where(.select-open, .selected) legend{max-width:100%;font:var(--bl-font-caption);display:block}:host([label-fixed]) label{position:static;padding:0;transition:none;transform:none;pointer-events:initial;font:var(--bl-font-caption);color:var(--label-color);opacity:1}:host([label-fixed]) legend{display:none}.hint{display:none;font:var(--bl-font-body-text-3)}.hint p{padding:0;margin:0}.error-icon,.invalid-text{display:none}.dirty.invalid label,.invalid-text,.error-icon{color:var(--bl-color-danger)}.help-text{color:var(--bl-color-neutral-dark)}.select-open .help-text,.select-open .invalid-text{visibility:hidden}:host([help-text]) .hint,.dirty.invalid .hint{display:block}.dirty.invalid .invalid-text{display:block}.dirty.invalid .help-text{display:none}.select-all{position:sticky;top:0;padding:var(--bl-size-xs) 0;background:var(--background-color);z-index:1;font:var(--bl-font-title-3-regular);/* Make sure option focus doesn't overflow */box-shadow:10px 0 0 var(--background-color),-10px 0 0 var(--background-color)}.select-all::after{position:absolute;content:\"\";width:100%;bottom:0;border-bottom:1px solid var(--bl-color-neutral-lighter)}.search-bar-input{font:var(--bl-font-title-3-regular);font-size:var(--font-size);color:var(--text-color);border:none;outline:none;background-color:transparent;width:100%;height:100%;padding:0;margin:0;box-sizing:border-box}.search-bar-input::placeholder{color:var(--placeholder-color)}.search-bar-input:focus-visible{outline:none}.search-loading-icon{animation:spin 1s linear infinite}.action-divider{display:none}.select-wrapper .action-divider{display:block;height:1rem;width:1px;background-color:var(--bl-color-neutral-lighter)}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.actions bl-icon{padding:4px}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, PropertyValues, TemplateResult } from \"lit\";\nimport { customElement, property, query, queryAll, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { autoUpdate, computePosition, flip, MiddlewareState, offset, size } from \"@floating-ui/dom\";\nimport { msg, localized } from \"@lit/localize\";\nimport { FormControlMixin, requiredValidator } from \"@open-wc/form-control\";\nimport { FormValue } from \"@open-wc/form-helpers\";\nimport \"element-internals-polyfill\";\nimport { event, EventDispatcher } from \"../../utilities/event\";\nimport { stringBooleanConverter } from \"../../utilities/string-boolean.converter\";\nimport \"../button/bl-button\";\nimport BlCheckbox from \"../checkbox-group/checkbox/bl-checkbox\";\nimport \"../checkbox-group/checkbox/bl-checkbox\";\nimport \"../icon/bl-icon\";\nimport style from \"../select/bl-select.css\";\nimport \"../select/option/bl-select-option\";\nimport type BlSelectOption from \"./option/bl-select-option\";\n\nexport interface ISelectOption<T = string> {\n value: T;\n text: string;\n selected: boolean;\n}\n\nexport type SelectSize = \"medium\" | \"large\" | \"small\";\n\nexport type CleanUpFunction = () => void;\n\n/**\n * @tag bl-select\n * @summary Baklava Select component\n *\n * @cssproperty [--bl-popover-position=fixed] Sets the positioning strategy of select popover. You can set it as `absolute` if you need to show popover relative to its trigger element.\n */\n@customElement(\"bl-select\")\n@localized()\nexport default class BlSelect<ValueType extends FormValue = string> extends FormControlMixin(\n LitElement\n) {\n static get styles(): CSSResultGroup {\n return [style];\n }\n static shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true };\n\n static formControlValidators = [requiredValidator];\n\n /**\n * Sets name of the select field\n */\n @property()\n name: string;\n\n private _value: ValueType | ValueType[] | null;\n\n private _initialValue: ValueType | ValueType[] | null;\n\n /**\n * Sets the value of the select\n */\n @property()\n get value(): ValueType | ValueType[] | null {\n return this._value;\n }\n\n set value(val: ValueType | ValueType[] | null) {\n this._value = val;\n\n if (Array.isArray(val)) {\n const formData = new FormData();\n\n val.forEach(option => formData.append(this.name, `${option}`));\n this.setValue(formData);\n } else {\n this.setValue(val);\n }\n\n this.setOptionsSelected();\n }\n\n shouldFormValueUpdate(): boolean {\n return this.value !== null && this.value !== \"\";\n }\n\n /* Declare reactive properties */\n /**\n * Sets the label value\n */\n @property({ reflect: true })\n label?: string;\n\n /**\n * Sets the placeholder value. If left blank, the label value (if specified) is set as placeholder.\n */\n @property({ reflect: true })\n placeholder?: string;\n\n /**\n * Sets the size value. Select component's height value will be changed accordingly\n */\n @property({ type: String, reflect: true })\n size: SelectSize = \"medium\";\n\n /**\n * When option is not selected, shows component in error state\n */\n @property({ type: Boolean, reflect: true })\n required = false;\n\n /**\n * Shows the component in disabled state.\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * Sets whether the selected option is clearable\n */\n @property({ type: Boolean, reflect: true })\n clearable = false;\n\n /**\n * Allows multiple options to be selected\n */\n @property({ type: Boolean, reflect: true })\n multiple = false;\n\n /**\n * Sets input to get keyboard focus automatically\n */\n @property({ type: Boolean, reflect: true })\n autofocus = false;\n\n /**\n * Makes label as fixed positioned\n */\n @property({ type: Boolean, attribute: \"label-fixed\", reflect: true })\n labelFixed = false;\n\n /**\n * Adds help text\n */\n @property({ type: String, attribute: \"help-text\", reflect: true })\n helpText?: string;\n\n /**\n * Set custom error message\n */\n @property({ type: String, attribute: \"invalid-text\", reflect: true })\n customInvalidText?: string;\n\n /**\n * Views select all option in multiple select\n */\n @property({ type: Boolean, attribute: \"view-select-all\", converter: stringBooleanConverter() })\n viewSelectAll = false;\n\n /**\n * Sets select all text in multiple select\n */\n @property({ type: String, attribute: \"select-all-text\" })\n selectAllText?: string;\n\n /**\n * Enable search functionality for the options within the list\n */\n @property({ type: Boolean, attribute: \"search-bar\", reflect: true })\n searchBar = false;\n\n /**\n * Search for text variations such as \"search,\" \"searching,\" \"search by country,\" and so on\n */\n @property({ type: String, attribute: \"search-bar-placeholder\", reflect: true })\n searchBarPlaceholder?: string;\n\n /**\n * Display a loading icon in place of the search icon.\n */\n @property({\n type: Boolean,\n attribute: \"search-bar-loading-state\",\n converter: stringBooleanConverter(),\n })\n searchBarLoadingState = false;\n\n /**\n * Text to display when no search results are found.\n */\n @property({ type: String, attribute: \"search-not-found-text\", reflect: true })\n searchNotFoundText?: string;\n\n /**\n * Text to display on the clear search button.\n */\n @property({ type: String, attribute: \"popover-clear-search-text\", reflect: true })\n popoverClearSearchText?: string;\n\n /* Declare internal reactive properties */\n @state()\n private _isPopoverOpen = false;\n\n @state()\n private _additionalSelectedOptionCount = 0;\n\n @state()\n private _searchText = \"\";\n\n @query(\".selected-options\")\n private selectedOptionsContainer!: HTMLElement;\n\n @queryAll(\".selected-options li\")\n private selectedOptionsItems!: NodeListOf<HTMLElement>;\n\n @query(\".popover\")\n private _popover: HTMLElement;\n\n @query(\".select-input\")\n private _selectInput: HTMLElement;\n\n /**\n * Fires when selection changes\n */\n @event(\"bl-select\") private _onBlSelect: EventDispatcher<\n ISelectOption<ValueType>[] | ISelectOption<ValueType>\n >;\n\n /**\n * Fires when search text changes\n */\n @event(\"bl-search\") private _onBlSearch: EventDispatcher<string>;\n\n private _connectedOptions: BlSelectOption<ValueType>[] = [];\n\n private _cleanUpPopover: CleanUpFunction | null = null;\n\n private setOptionsSelected() {\n this._connectedOptions.forEach(\n option =>\n (option.selected =\n this.value === option.value ||\n (Array.isArray(this.value) && this.value.includes(option.value)))\n );\n\n this._selectedOptions = [...this.options.filter(option => option.selected)];\n }\n\n get options() {\n return this._connectedOptions;\n }\n\n get opened() {\n return this._isPopoverOpen;\n }\n\n get noResultFound() {\n return this._searchText !== \"\" && this._connectedOptions.every(option => option.hidden);\n }\n\n @state()\n private _selectedOptions: BlSelectOption<ValueType>[] = [];\n\n @state()\n private dirty = false;\n\n get selectedOptions(): BlSelectOption<ValueType>[] {\n return this._selectedOptions;\n }\n\n get additionalSelectedOptionCount() {\n return this._additionalSelectedOptionCount;\n }\n\n validityCallback(): string | void {\n if (this.customInvalidText) {\n return this.customInvalidText;\n }\n const select = document.createElement(\"select\");\n\n select.required = this.required;\n\n return select.validationMessage;\n }\n\n reportValidity() {\n this.dirty = true;\n return this.checkValidity();\n }\n\n resetFormControl(): void {\n this.value = this._initialValue;\n }\n\n @query(\".select-input\")\n validationTarget: HTMLElement;\n\n open() {\n if (this.searchBar) {\n setTimeout(() => {\n document.activeElement?.shadowRoot?.querySelector(\"input\")?.focus();\n }, 100);\n }\n\n this._isPopoverOpen = true;\n this._setupPopover();\n document.addEventListener(\"click\", this._interactOutsideHandler, true);\n document.addEventListener(\"focus\", this._interactOutsideHandler, true);\n }\n\n close() {\n this._handleSearchOptions({ target: { value: \"\" } } as InputEvent & {\n target: HTMLInputElement;\n });\n\n this._isPopoverOpen = false;\n this.focusedOptionIndex = -1;\n this._cleanUpPopover && this._cleanUpPopover();\n document.removeEventListener(\"click\", this._interactOutsideHandler, true);\n document.removeEventListener(\"focus\", this._interactOutsideHandler, true);\n }\n\n private _interactOutsideHandler = (event: MouseEvent | FocusEvent) => {\n const eventPath = event.composedPath() as HTMLElement[];\n\n if (!eventPath?.find(el => el.tagName === \"BL-SELECT\")?.contains(this)) {\n this.close();\n }\n };\n\n private _setupPopover() {\n this._cleanUpPopover = autoUpdate(this._selectInput, this._popover, () => {\n computePosition(this._selectInput, this._popover, {\n placement: \"bottom\",\n strategy: \"fixed\",\n middleware: [\n flip(),\n offset(8),\n size({\n apply(args: MiddlewareState) {\n Object.assign(args.elements.floating.style, {\n width: `${args.elements.reference.getBoundingClientRect().width}px`,\n });\n },\n }),\n ],\n }).then(({ x, y }) => {\n this._popover.style.setProperty(\"--left\", `${x}px`);\n this._popover.style.setProperty(\"--top\", `${y}px`);\n });\n });\n }\n\n connectedCallback(): void {\n super.connectedCallback();\n\n this.form?.addEventListener(\"submit\", (e: SubmitEvent) => {\n if (!this.reportValidity()) {\n e.preventDefault();\n }\n });\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n\n this._cleanUpPopover && this._cleanUpPopover();\n }\n\n private inputTemplate() {\n const inputSelectedOptions = html`<ul class=\"selected-options\">\n ${this._selectedOptions.map(\n item => html`<li>${item.getAttribute(\"label\") || item.textContent}</li>`\n )}\n </ul>`;\n\n const isAllSelectedDisabled =\n this._selectedOptions.length > 0 && this._selectedOptions.every(option => option.disabled);\n const isRemoveButtonShown = !isAllSelectedDisabled && (this.clearable || this.multiple);\n const removeButton = isRemoveButtonShown\n ? html`<bl-button\n class=\"remove-all\"\n size=\"small\"\n variant=\"tertiary\"\n kind=\"neutral\"\n icon=\"close\"\n @click=${this._onClickRemove}\n ></bl-button>`\n : \"\";\n\n const isSearchBarVisible = this.searchBar && this.opened;\n const isMultipleWithSelection = this.multiple && this._selectedOptions.length > 0;\n\n const isDividerShown = isSearchBarVisible || isMultipleWithSelection;\n\n const searchbarPlaceholderText =\n this.searchBarPlaceholder ?? msg(\"Search\", { desc: \"bl-select: search placeholder text\" });\n\n const searchMagIcon = html`<bl-icon\n class=\"search-mag-icon\"\n name=\"search\"\n style=\"color: var(--bl-color-primary);font-size: var(--bl-font-size-s)\"\n ></bl-icon>`;\n\n const searchLoadingIcon = html`<bl-icon\n class=\"search-loading-icon\"\n name=\"loading\"\n style=\"color: var(--bl-color-primary);font-size: var(--bl-font-size-s)\"\n ></bl-icon>`;\n\n const actionDivider = isDividerShown ? html`<div class=\"action-divider\"></div>` : \"\";\n\n const search = html`<fieldset\n class=${classMap({\n \"select-input\": true,\n \"has-overflowed-options\": this._additionalSelectedOptionCount > 0,\n })}\n tabindex=\"${this.disabled ? \"-1\" : 0}\"\n .autofocus=${this.autofocus}\n role=\"button\"\n aria-haspopup=\"listbox\"\n aria-expanded=\"${this.opened}\"\n aria-labelledby=\"label\"\n @click=${this.open}\n >\n <legend><span>${this.label}</span></legend>\n\n ${this._selectedOptions.length > 0 && !this.opened\n ? inputSelectedOptions\n : html`\n <input\n class=\"search-bar-input\"\n placeholder=${searchbarPlaceholderText}\n @input=${this._handleSearchOptions}\n .value=${this._searchText}\n />\n `}\n ${!this.opened\n ? html`<span class=\"additional-selection-count\"\n >+${this._additionalSelectedOptionCount}</span\n >`\n : \"\"}\n\n <div class=\"actions\">\n ${this.opened ? (this.searchBarLoadingState ? searchLoadingIcon : searchMagIcon) : \"\"}\n ${!this.opened ? removeButton : \"\"} ${actionDivider}\n\n <div @click=${this._togglePopover}>\n <bl-icon class=\"dropdown-icon open\" name=\"arrow_up\"></bl-icon>\n\n <bl-icon class=\"dropdown-icon closed\" name=\"arrow_down\"></bl-icon>\n </div>\n </div>\n </fieldset>`;\n\n return this.searchBar\n ? search\n : html`<fieldset\n class=${classMap({\n \"select-input\": true,\n \"has-overflowed-options\": this._additionalSelectedOptionCount > 0,\n })}\n tabindex=\"${ifDefined(this.disabled ? undefined : 0)}\"\n ?autofocus=${this.autofocus}\n @click=${this._togglePopover}\n role=\"button\"\n aria-haspopup=\"listbox\"\n aria-expanded=\"${this.opened}\"\n aria-labelledby=\"label\"\n >\n <legend><span>${this.label}</span></legend>\n <span class=\"placeholder\">${this.placeholder}</span>\n <span class=\"label\">${this.label}</span>\n ${inputSelectedOptions}\n <span class=\"additional-selection-count\">+${this._additionalSelectedOptionCount}</span>\n <div class=\"actions\">\n ${removeButton} ${actionDivider}\n <bl-icon class=\"dropdown-icon open\" name=\"arrow_up\"></bl-icon>\n\n <bl-icon class=\"dropdown-icon closed\" name=\"arrow_down\"></bl-icon>\n </div>\n </fieldset>`;\n }\n\n selectAllTemplate() {\n if (!this.multiple || !this.viewSelectAll || this.noResultFound) {\n return null;\n }\n\n const isAllRenderedOptionsSelected = this._connectedOptions\n .filter(option => !option.hidden)\n .every(option => option.selected);\n\n const isAnySelected = this._selectedOptions.filter(option => !option.hidden).length > 0;\n const selectAllText =\n this.selectAllText ?? msg(\"Select All\", { desc: \"bl-select: select all text\" });\n\n return html`<bl-checkbox\n class=\"select-all\"\n .checked=\"${isAllRenderedOptionsSelected}\"\n .indeterminate=\"${isAnySelected && !isAllRenderedOptionsSelected}\"\n role=\"option\"\n aria-selected=\"${isAllRenderedOptionsSelected}\"\n @bl-checkbox-change=\"${this._handleSelectAll}\"\n >\n ${selectAllText}\n </bl-checkbox>`;\n }\n\n render(): TemplateResult {\n const invalidMessage = !this.checkValidity()\n ? html`<p id=\"errorMessage\" aria-live=\"polite\" class=\"invalid-text\">\n ${this.validationMessage}\n </p>`\n : \"\";\n\n const helpMessage = this.helpText ? html`<p class=\"help-text\">${this.helpText}</p>` : \"\";\n\n const label = this.label ? html`<label id=\"label\">${this.label}</label>` : \"\";\n\n const noDataText =\n this.searchNotFoundText ?? msg(\"No Data Found\", { desc: \"bl-select: search no data text\" });\n\n const clearSearchText =\n this.popoverClearSearchText ??\n msg(\"Clear Search\", { desc: \"bl-select: clear search button text\" });\n\n return html`<div\n class=${classMap({\n \"select-wrapper\": true,\n \"select-open\": this.opened,\n \"selected\": this._selectedOptions.length > 0,\n \"invalid\": !this.validity.valid,\n \"dirty\": this.dirty,\n })}\n @keydown=${this.handleKeydown}\n >\n ${label} ${this.inputTemplate()}\n <div\n class=\"popover\"\n tabindex=\"${ifDefined(this._isPopoverOpen ? undefined : \"-1\")}\"\n @bl-select-option=${this._handleSelectOptionEvent}\n role=\"listbox\"\n aria-multiselectable=\"${this.multiple}\"\n aria-labelledby=\"label\"\n >\n ${this.selectAllTemplate()}\n <slot></slot>\n ${this.searchBar && this.noResultFound\n ? html`<div name=\"popover-clear-search-text\" class=\"popover-no-result\">\n <span>${noDataText}</span>\n <bl-button\n variant=\"tertiary\"\n @click=${() => {\n this._handleSearchOptions({ target: { value: \"\" } } as InputEvent & {\n target: HTMLInputElement;\n });\n }}\n >${clearSearchText}</bl-button\n >\n </div>`\n : \"\"}\n </div>\n <div class=\"hint\">${invalidMessage} ${helpMessage}</div>\n </div> `;\n }\n\n private focusedOptionIndex = -1;\n\n private handleKeydown(event: KeyboardEvent) {\n if (this.focusedOptionIndex === -1 && [\"Enter\", \"Space\"].includes(event.code)) {\n this._togglePopover();\n event.preventDefault();\n } else if (this._isPopoverOpen === false && [\"ArrowDown\", \"ArrowUp\"].includes(event.code)) {\n this.open();\n event.preventDefault();\n } else if (event.code === \"Escape\") {\n this.close();\n event.preventDefault();\n } else if (this._isPopoverOpen && [\"ArrowDown\", \"ArrowUp\"].includes(event.code)) {\n event.code === \"ArrowDown\" && this.focusedOptionIndex++;\n event.code === \"ArrowUp\" && this.focusedOptionIndex--;\n\n // Don't exceed array indexes\n this.focusedOptionIndex = Math.max(\n 0,\n Math.min(this.focusedOptionIndex, this.options.length - 1)\n );\n\n this.options[this.focusedOptionIndex].focus();\n\n event.preventDefault();\n }\n }\n\n private _togglePopover() {\n this._isPopoverOpen ? this.close() : this.open();\n }\n\n private _handleSelectEvent() {\n const options = this._selectedOptions.map(\n option =>\n ({\n value: option.value,\n selected: option.selected,\n text: option.textContent,\n } as ISelectOption<ValueType>)\n );\n\n if (!this.multiple) this._onBlSelect(options[0]);\n else this._onBlSelect(options);\n }\n\n private _handleSearchEvent() {\n this._onBlSearch(this._searchText);\n }\n\n private _handleSearchOptions(e: InputEvent): void {\n if (!this.searchBar) return;\n\n this._searchText = (e.target as HTMLInputElement).value;\n\n this._handleSearchEvent();\n\n this._connectedOptions.forEach(option => {\n const isVisible = option.textContent?.toLowerCase().includes(this._searchText.toLowerCase());\n\n option.hidden = !isVisible;\n });\n\n this._selectedOptions = this.options.filter(option => option.selected);\n\n this._handleLastVisibleSearchedOption();\n\n this.requestUpdate();\n }\n\n private _handleLastVisibleSearchedOption() {\n const lastVisibleOption = [...this.options].reverse().find(option => !option.hidden);\n\n if (lastVisibleOption) {\n lastVisibleOption?.shadowRoot?.querySelector(\"div\")?.classList.add(\"no-border-bottom\");\n }\n\n this.options.map(option => {\n if (!option.hidden && option !== lastVisibleOption) {\n option.shadowRoot?.querySelector(\"div\")?.classList.remove(\"no-border-bottom\");\n }\n });\n }\n\n private _handleSingleSelect(optionItem: BlSelectOption<ValueType>) {\n this.value = optionItem.value;\n\n this._handleSelectEvent();\n this._isPopoverOpen = false;\n }\n\n private _handleMultipleSelect() {\n this.value = this._connectedOptions\n .filter(option => option.selected)\n .map(option => option.value);\n\n this._handleSelectEvent();\n }\n\n private _handleSelectOptionEvent(e: CustomEvent) {\n const optionItem = e.target as BlSelectOption<ValueType>;\n\n this.dirty = true;\n\n if (this.multiple) {\n this._handleMultipleSelect();\n } else {\n this._handleSingleSelect(optionItem);\n }\n }\n\n private _handleSelectAll(e: CustomEvent) {\n const selectAllEl = this.shadowRoot?.querySelector(\".select-all\") as BlCheckbox;\n\n const checked = e.detail;\n const unselectedOptions = this._connectedOptions.filter(\n option => !option.selected && !option.hidden\n );\n const isAllUnselectedDisabled = unselectedOptions.every(option => option.disabled);\n\n // If all available options are selected, instead of checking, uncheck all options\n if (checked && isAllUnselectedDisabled) {\n setTimeout(() => {\n const checkbox = selectAllEl?.shadowRoot?.querySelector(\"input\");\n\n checkbox?.click();\n }, 0);\n return;\n }\n\n this._connectedOptions.forEach(option => {\n if (option.disabled || option.hidden) {\n return;\n }\n\n option.selected = checked;\n });\n\n this._handleMultipleSelect();\n }\n\n private _onClickRemove(e: MouseEvent) {\n e.stopPropagation();\n\n const selectedDisabledOptions = this._selectedOptions.filter(option => option.disabled);\n\n this._connectedOptions\n .filter(option => !option.disabled && option.selected)\n .forEach(option => {\n option.selected = false;\n });\n\n this.value = selectedDisabledOptions.length\n ? selectedDisabledOptions.map(option => option.value)\n : null;\n this._handleSelectEvent();\n }\n\n private _checkAdditionalItemCount() {\n if (!this.multiple || !this.selectedOptionsItems || this.selectedOptionsItems.length < 2) {\n this._additionalSelectedOptionCount = 0;\n return;\n }\n\n const firstNonVisibleItemIndex = [...this.selectedOptionsItems].findIndex(\n item => item.offsetLeft > this.selectedOptionsContainer.offsetWidth\n );\n\n if (firstNonVisibleItemIndex > -1) {\n this._additionalSelectedOptionCount =\n this.selectedOptionsItems.length - firstNonVisibleItemIndex;\n } else {\n this._additionalSelectedOptionCount = 0;\n }\n }\n\n protected firstUpdated(): void {\n if (this.value === undefined) {\n this.value = \"\" as ValueType;\n }\n\n this._initialValue = this._value;\n }\n\n protected updated(_changedProperties: PropertyValues) {\n if (\n _changedProperties.has(\"multiple\") &&\n typeof _changedProperties.get(\"multiple\") === \"boolean\"\n ) {\n this.value = null;\n }\n\n if (_changedProperties.has(\"_selectedOptions\")) {\n this._checkAdditionalItemCount();\n }\n }\n\n /**\n * This method is used by `bl-select-option` component to register itself to bl-select.\n * @param option BlSelectOption reference to be registered\n */\n registerOption(option: BlSelectOption<ValueType>) {\n this._connectedOptions.push(option);\n\n if (option.selected) {\n if (this.multiple) {\n if (!Array.isArray(this.value)) {\n this.value = [];\n }\n this.value = [...this.value, option.value];\n } else {\n this.value = option.value;\n }\n }\n\n this.setOptionsSelected();\n this.requestUpdate();\n }\n\n /**\n * This method is used by `bl-select-option` component to unregister itself from bl-select.\n * @param option BlSelectOption reference to be unregistered\n */\n unregisterOption(option: BlSelectOption<ValueType>) {\n this._connectedOptions.splice(this._connectedOptions.indexOf(option), 1);\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"bl-select\": BlSelect;\n }\n}\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host{width:200px;display:inline-block}.select-wrapper{width:100%;position:relative;display:grid;gap:var(--bl-size-3xs);--padding-vertical:var(--bl-size-2xs);--padding-horizontal:var(--bl-size-xs);--label-padding:var(--bl-size-3xs);--border-size:1px;--background-color:var(--bl-color-neutral-full);--border-color:var(--bl-color-neutral-lighter);--border-focus-color:var(--bl-color-primary-highlight);--icon-color:var(--bl-color-neutral-light);--text-color:var(--bl-color-neutral-darker);--label-color:var(--bl-color-neutral-dark);--placeholder-color:var(--bl-color-neutral-light);--height:var(--bl-size-2xl);--menu-padding:0 var(--bl-size-m);--menu-margin-top:var(--bl-size-2xs);--font-size:var(--bl-font-size-m);--disabled-color:var(--bl-color-neutral-lightest);--menu-height:250px;--popover-position:var(--bl-popover-position, fixed)}:host([multiple][view-select-all]) .select-wrapper{--menu-height:290px}:host([size=\"large\"]) .select-wrapper{--height:var(--bl-size-3xl);--padding-vertical:var(--bl-size-xs);--padding-horizontal:var(--bl-size-m)}:host([size=\"small\"]) .select-wrapper{--height:var(--bl-size-xl);--padding-vertical:var(--bl-size-3xs);--padding-horizontal:var(--bl-size-xs);--font-size:var(--bl-font-size-s)}:host([disabled]) .select-wrapper{--placeholder-color:var(--bl-color-neutral-light)}.dirty.invalid{--border-color:var(--bl-color-danger);--border-focus-color:var(--bl-color-danger-highlight);--label-color:var(--bl-color-danger)}.select-input{display:grid;align-items:center;justify-content:space-between;grid-template-columns:1fr max-content max-content;cursor:pointer;box-sizing:border-box;height:var(--height);border:solid 1px var(--border-color);font:var(--bl-font-title-3-regular);padding:0 calc(var(--padding-horizontal) - var(--label-padding) - var(--border-size));border-radius:var(--bl-border-radius-s);color:var(--text-color);background-color:var(--background-color);/* stylelint-disable-next-line property-no-vendor-prefix */-webkit-user-select:none;user-select:none;margin:0;width:auto;min-width:100%}.label,.placeholder{color:var(--placeholder-color);padding-left:var(--label-padding);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}:host(:not([placeholder])) .placeholder,.select-wrapper.selected .placeholder,:host([label]:not([label-fixed])) .select-wrapper:not(.select-open) .placeholder{display:none}:host([label-fixed]) .label,:host(:not([label])) .label{display:none}.remove-all{display:none}.selected .remove-all{display:block}:host([disabled]) .remove-all,:host([disabled]) .remove-all::after{display:none}.dropdown-icon{font-size:var(--bl-font-size-m)}.dropdown-icon.open{display:none}.select-open .dropdown-icon.open{display:inline-block}.select-open .dropdown-icon.closed{display:none}.selected .dropdown-icon{--icon-color:var(--bl-color-neutral-darker)}:host([disabled]) .dropdown-icon{--icon-color:var(--bl-color-neutral-light)}.select-open .select-input,.select-input:focus-visible{border:solid 1px var(--border-focus-color);outline:none}:host([disabled]){cursor:not-allowed}:host([disabled]) .select-input{pointer-events:none;background-color:var(--disabled-color)}.select-input .selected-options{padding:0;padding-left:var(--label-padding);margin:0;list-style:none;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host([disabled]) .select-input .selected-options{color:var(--bl-color-neutral-light)}.selected-options li{display:inline;font-size:var(--font-size);color:var(--text-color)}.selected-options li:not(:last-child)::after{content:\", \"}.select-input:not(.has-overflowed-options) .additional-selection-count{display:none}:host([disabled]) .additional-selection-count{color:var(--bl-color-neutral-light)}:host([disabled]) .selected-options li{color:var(--bl-color-neutral-light)}.select-input .actions{display:flex;align-items:center;justify-content:center;gap:var(--bl-size-4xs);margin-left:var(--bl-size-2xs)}.popover{--left:0;--top:0;position:var(--popover-position);border:solid 1px var(--border-color);background-color:var(--background-color);font:var(--bl-font-title-3-regular);border-radius:var(--bl-border-radius-s);padding:var(--menu-padding);outline:none;box-sizing:border-box;max-height:var(--menu-height);overflow-y:auto;display:none;flex-direction:column;z-index:var(--bl-index-popover);width:100%;top:var(--top);left:var(--left)}.popover-no-result{display:flex;flex-direction:column;gap:var(--bl-size-2xs);align-items:center;justify-content:center;height:80px}.select-open .popover{display:flex;border:solid 1px var(--border-focus-color)}bl-icon{color:var(--icon-color)}legend,label{padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}label{position:absolute;display:block;top:var(--padding-vertical);left:var(--padding-horizontal);right:calc(var(--bl-size-2xs) + var(--bl-size-m) + var(--bl-size-2xs));transition:all ease-in 0.1s;pointer-events:none;opacity:0;font:var(--bl-font-title-3-regular);font-size:var(--font-size);color:var(--placeholder-color)}legend{height:0;visibility:hidden;display:none}legend span{padding:0 var(--label-padding);display:inline-block;opacity:0;visibility:visible}:host([placeholder]) :where(.select-open, .selected) .label,:host(:not([placeholder])) .selected .label{display:none}:where(.select-open, .selected) label{top:0;transform:translateY(-50%);font:var(--bl-font-caption);color:var(--label-color);pointer-events:initial;right:var(--padding-horizontal);opacity:1}:host([label]) :where(.select-open, .selected) legend{max-width:100%;font:var(--bl-font-caption);display:block}:host([label-fixed]) label{position:static;padding:0;transition:none;transform:none;pointer-events:initial;font:var(--bl-font-caption);color:var(--label-color);opacity:1}:host([label-fixed]) legend{display:none}.hint{display:none;font:var(--bl-font-body-text-3)}.hint p{padding:0;margin:0}.error-icon,.invalid-text{display:none}.dirty.invalid label,.invalid-text,.error-icon{color:var(--bl-color-danger)}.help-text{color:var(--bl-color-neutral-dark)}.select-open .help-text,.select-open .invalid-text{visibility:hidden}:host([help-text]) .hint,.dirty.invalid .hint{display:block}.dirty.invalid .invalid-text{display:block}.dirty.invalid .help-text{display:none}.select-all{position:sticky;top:0;padding:var(--bl-size-xs) 0;background:var(--background-color);z-index:1;font:var(--bl-font-title-3-regular);/* Make sure option focus doesn't overflow */box-shadow:10px 0 0 var(--background-color),-10px 0 0 var(--background-color)}.select-all::after{position:absolute;content:\"\";width:100%;bottom:0;border-bottom:1px solid var(--bl-color-neutral-lighter)}.search-bar-input{font:var(--bl-font-title-3-regular);font-size:var(--font-size);color:var(--text-color);border:none;outline:none;background-color:transparent;width:100%;height:100%;padding:0;margin:0;box-sizing:border-box}.search-bar-input::placeholder{color:var(--placeholder-color)}.search-bar-input:focus-visible{outline:none}.search-loading-icon{animation:spin 1s linear infinite}.action-divider{display:none}.select-wrapper .action-divider{display:block;height:1rem;width:1px;background-color:var(--bl-color-neutral-lighter)}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.actions bl-icon{padding:4px}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, PropertyValues, TemplateResult } from \"lit\";\nimport { customElement, property, query, queryAll, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { autoUpdate, computePosition, flip, MiddlewareState, offset, size } from \"@floating-ui/dom\";\nimport { msg, localized } from \"@lit/localize\";\nimport { FormControlMixin, requiredValidator } from \"@open-wc/form-control\";\nimport { FormValue } from \"@open-wc/form-helpers\";\nimport \"element-internals-polyfill\";\nimport { event, EventDispatcher } from \"../../utilities/event\";\nimport { stringBooleanConverter } from \"../../utilities/string-boolean.converter\";\nimport \"../button/bl-button\";\nimport BlCheckbox from \"../checkbox-group/checkbox/bl-checkbox\";\nimport \"../checkbox-group/checkbox/bl-checkbox\";\nimport \"../icon/bl-icon\";\nimport style from \"../select/bl-select.css\";\nimport \"../select/option/bl-select-option\";\nimport type BlSelectOption from \"./option/bl-select-option\";\n\nexport interface ISelectOption<T = string> {\n value: T;\n text: string;\n selected: boolean;\n}\n\nexport type SelectSize = \"medium\" | \"large\" | \"small\";\n\nexport type CleanUpFunction = () => void;\n\n/**\n * @tag bl-select\n * @summary Baklava Select component\n *\n * @cssproperty [--bl-popover-position=fixed] Sets the positioning strategy of select popover. You can set it as `absolute` if you need to show popover relative to its trigger element.\n */\n@customElement(\"bl-select\")\n@localized()\nexport default class BlSelect<ValueType extends FormValue = string> extends FormControlMixin(\n LitElement\n) {\n static get styles(): CSSResultGroup {\n return [style];\n }\n static shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true };\n\n static formControlValidators = [requiredValidator];\n\n /**\n * Sets name of the select field\n */\n @property()\n name: string;\n\n private _value: ValueType | ValueType[] | null;\n\n private _initialValue: ValueType | ValueType[] | null;\n\n /**\n * Sets the value of the select\n */\n @property()\n get value(): ValueType | ValueType[] | null {\n return this._value;\n }\n\n set value(val: ValueType | ValueType[] | null) {\n this._value = val;\n\n if (Array.isArray(val)) {\n const formData = new FormData();\n\n val.forEach(option => formData.append(this.name, `${option}`));\n this.setValue(formData);\n } else {\n this.setValue(val);\n }\n\n this.setOptionsSelected();\n }\n\n shouldFormValueUpdate(): boolean {\n return this.value !== null && this.value !== \"\";\n }\n\n /* Declare reactive properties */\n /**\n * Sets the label value\n */\n @property({ reflect: true })\n label?: string;\n\n /**\n * Sets the placeholder value. If left blank, the label value (if specified) is set as placeholder.\n */\n @property({ reflect: true })\n placeholder?: string;\n\n /**\n * Sets the size value. Select component's height value will be changed accordingly\n */\n @property({ type: String, reflect: true })\n size: SelectSize = \"medium\";\n\n /**\n * When option is not selected, shows component in error state\n */\n @property({ type: Boolean, reflect: true })\n required = false;\n\n /**\n * Shows the component in disabled state.\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * Sets whether the selected option is clearable\n */\n @property({ type: Boolean, reflect: true })\n clearable = false;\n\n /**\n * Allows multiple options to be selected\n */\n @property({ type: Boolean, reflect: true })\n multiple = false;\n\n /**\n * Sets input to get keyboard focus automatically\n */\n @property({ type: Boolean, reflect: true })\n autofocus = false;\n\n /**\n * Makes label as fixed positioned\n */\n @property({ type: Boolean, attribute: \"label-fixed\", reflect: true })\n labelFixed = false;\n\n /**\n * Adds help text\n */\n @property({ type: String, attribute: \"help-text\", reflect: true })\n helpText?: string;\n\n /**\n * Set custom error message\n */\n @property({ type: String, attribute: \"invalid-text\", reflect: true })\n customInvalidText?: string;\n\n /**\n * Views select all option in multiple select\n */\n @property({ type: Boolean, attribute: \"view-select-all\", converter: stringBooleanConverter() })\n viewSelectAll = false;\n\n /**\n * Sets select all text in multiple select\n */\n @property({ type: String, attribute: \"select-all-text\" })\n selectAllText?: string;\n\n /**\n * Enable search functionality for the options within the list\n */\n @property({ type: Boolean, attribute: \"search-bar\", reflect: true })\n searchBar = false;\n\n /**\n * Search for text variations such as \"search,\" \"searching,\" \"search by country,\" and so on\n */\n @property({ type: String, attribute: \"search-bar-placeholder\", reflect: true })\n searchBarPlaceholder?: string;\n\n /**\n * Display a loading icon in place of the search icon.\n */\n @property({\n type: Boolean,\n attribute: \"search-bar-loading-state\",\n converter: stringBooleanConverter(),\n })\n searchBarLoadingState = false;\n\n /**\n * Text to display when no search results are found.\n */\n @property({ type: String, attribute: \"search-not-found-text\", reflect: true })\n searchNotFoundText?: string;\n\n /**\n * Text to display on the clear search button.\n */\n @property({ type: String, attribute: \"popover-clear-search-text\", reflect: true })\n popoverClearSearchText?: string;\n\n /* Declare internal reactive properties */\n @state()\n private _isPopoverOpen = false;\n\n @state()\n private _additionalSelectedOptionCount = 0;\n\n @state()\n private _searchText = \"\";\n\n @query(\".selected-options\")\n private selectedOptionsContainer!: HTMLElement;\n\n @queryAll(\".selected-options li\")\n private selectedOptionsItems!: NodeListOf<HTMLElement>;\n\n @query(\".popover\")\n private _popover: HTMLElement;\n\n @query(\".select-input\")\n private _selectInput: HTMLElement;\n\n /**\n * Fires when selection changes\n */\n @event(\"bl-select\") private _onBlSelect: EventDispatcher<\n ISelectOption<ValueType>[] | ISelectOption<ValueType>\n >;\n\n /**\n * Fires when search text changes\n */\n @event(\"bl-search\") private _onBlSearch: EventDispatcher<string>;\n\n private _connectedOptions: BlSelectOption<ValueType>[] = [];\n\n private _cleanUpPopover: CleanUpFunction | null = null;\n\n private setOptionsSelected() {\n this._connectedOptions.forEach(\n option =>\n (option.selected =\n this.value === option.value ||\n (Array.isArray(this.value) && this.value.includes(option.value)))\n );\n\n this._selectedOptions = [...this.options.filter(option => option.selected)];\n }\n\n get options() {\n return this._connectedOptions;\n }\n\n get opened() {\n return this._isPopoverOpen;\n }\n\n get noResultFound() {\n return this._searchText !== \"\" && this._connectedOptions.every(option => option.hidden);\n }\n\n @state()\n private _selectedOptions: BlSelectOption<ValueType>[] = [];\n\n @state()\n private dirty = false;\n\n get selectedOptions(): BlSelectOption<ValueType>[] {\n return this._selectedOptions;\n }\n\n get additionalSelectedOptionCount() {\n return this._additionalSelectedOptionCount;\n }\n\n validityCallback(): string | void {\n if (this.customInvalidText) {\n return this.customInvalidText;\n }\n const select = document.createElement(\"select\");\n\n select.required = this.required;\n\n return select.validationMessage;\n }\n\n reportValidity() {\n this.dirty = true;\n return this.checkValidity();\n }\n\n resetFormControl(): void {\n this.value = this._initialValue;\n }\n\n @query(\".select-input\")\n validationTarget: HTMLElement;\n\n open() {\n if (this.searchBar) {\n setTimeout(() => {\n document.activeElement?.shadowRoot?.querySelector(\"input\")?.focus();\n }, 100);\n }\n\n this._isPopoverOpen = true;\n this._setupPopover();\n document.addEventListener(\"click\", this._interactOutsideHandler, true);\n document.addEventListener(\"focus\", this._interactOutsideHandler, true);\n }\n\n close() {\n this._handleSearchOptions({ target: { value: \"\" } } as InputEvent & {\n target: HTMLInputElement;\n });\n\n this._isPopoverOpen = false;\n this.focusedOptionIndex = -1;\n this._cleanUpPopover && this._cleanUpPopover();\n document.removeEventListener(\"click\", this._interactOutsideHandler, true);\n document.removeEventListener(\"focus\", this._interactOutsideHandler, true);\n }\n\n private _interactOutsideHandler = (event: MouseEvent | FocusEvent) => {\n const eventPath = event.composedPath() as HTMLElement[];\n\n if (!eventPath?.find(el => el.tagName === \"BL-SELECT\")?.contains(this)) {\n this.close();\n }\n };\n\n private _setupPopover() {\n this._cleanUpPopover = autoUpdate(this._selectInput, this._popover, () => {\n computePosition(this._selectInput, this._popover, {\n placement: \"bottom\",\n strategy: \"fixed\",\n middleware: [\n flip(),\n offset(8),\n size({\n apply(args: MiddlewareState) {\n Object.assign(args.elements.floating.style, {\n width: `${args.elements.reference.getBoundingClientRect().width}px`,\n });\n },\n }),\n ],\n }).then(({ x, y }) => {\n this._popover.style.setProperty(\"--left\", `${x}px`);\n this._popover.style.setProperty(\"--top\", `${y}px`);\n });\n });\n }\n\n connectedCallback(): void {\n super.connectedCallback();\n\n this.form?.addEventListener(\"submit\", (e: SubmitEvent) => {\n if (!this.reportValidity()) {\n e.preventDefault();\n }\n });\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n\n this._cleanUpPopover && this._cleanUpPopover();\n }\n\n private inputTemplate() {\n const inputSelectedOptions = html`<ul class=\"selected-options\">\n ${this._selectedOptions.map(\n item => html`<li>${item.getAttribute(\"label\") || item.textContent}</li>`\n )}\n </ul>`;\n\n const isAllSelectedDisabled =\n this._selectedOptions.length > 0 && this._selectedOptions.every(option => option.disabled);\n const isRemoveButtonShown = !isAllSelectedDisabled && (this.clearable || this.multiple);\n const removeButton = isRemoveButtonShown\n ? html`<bl-button\n class=\"remove-all\"\n size=\"small\"\n variant=\"tertiary\"\n kind=\"neutral\"\n icon=\"close\"\n @click=${this._onClickRemove}\n ></bl-button>`\n : \"\";\n\n const isSearchBarVisible = this.searchBar && this.opened;\n const isMultipleWithSelection = this.multiple && this._selectedOptions.length > 0;\n\n const isDividerShown = isSearchBarVisible || isMultipleWithSelection;\n\n const searchbarPlaceholderText =\n this.searchBarPlaceholder ?? msg(\"Search\", { desc: \"bl-select: search placeholder text\" });\n\n const searchMagIcon = html`<bl-icon\n class=\"search-mag-icon\"\n name=\"search\"\n style=\"color: var(--bl-color-primary);font-size: var(--bl-font-size-s)\"\n ></bl-icon>`;\n\n const searchLoadingIcon = html`<bl-icon\n class=\"search-loading-icon\"\n name=\"loading\"\n style=\"color: var(--bl-color-primary);font-size: var(--bl-font-size-s)\"\n ></bl-icon>`;\n\n const actionDivider = isDividerShown ? html`<div class=\"action-divider\"></div>` : \"\";\n\n const search = html`<fieldset\n class=${classMap({\n \"select-input\": true,\n \"has-overflowed-options\": this._additionalSelectedOptionCount > 0,\n })}\n tabindex=\"${this.disabled ? \"-1\" : 0}\"\n .autofocus=${this.autofocus}\n role=\"button\"\n aria-haspopup=\"listbox\"\n aria-expanded=\"${this.opened}\"\n aria-labelledby=\"label\"\n @click=${this.open}\n >\n <legend><span>${this.label}</span></legend>\n\n ${this._selectedOptions.length > 0 && !this.opened\n ? inputSelectedOptions\n : html`\n <input\n class=\"search-bar-input\"\n placeholder=${searchbarPlaceholderText}\n @input=${this._handleSearchOptions}\n .value=${this._searchText}\n />\n `}\n ${!this.opened\n ? html`<span class=\"additional-selection-count\"\n >+${this._additionalSelectedOptionCount}</span\n >`\n : \"\"}\n\n <div class=\"actions\">\n ${this.opened ? (this.searchBarLoadingState ? searchLoadingIcon : searchMagIcon) : \"\"}\n ${!this.opened ? removeButton : \"\"} ${actionDivider}\n\n <div @click=${this._togglePopover}>\n <bl-icon class=\"dropdown-icon open\" name=\"arrow_up\"></bl-icon>\n\n <bl-icon class=\"dropdown-icon closed\" name=\"arrow_down\"></bl-icon>\n </div>\n </div>\n </fieldset>`;\n\n return this.searchBar\n ? search\n : html`<fieldset\n class=${classMap({\n \"select-input\": true,\n \"has-overflowed-options\": this._additionalSelectedOptionCount > 0,\n })}\n tabindex=\"${ifDefined(this.disabled ? undefined : 0)}\"\n ?autofocus=${this.autofocus}\n @click=${this._togglePopover}\n role=\"button\"\n aria-haspopup=\"listbox\"\n aria-expanded=\"${this.opened}\"\n aria-labelledby=\"label\"\n >\n <legend><span>${this.label}</span></legend>\n <span class=\"placeholder\">${this.placeholder}</span>\n <span class=\"label\">${this.label}</span>\n ${inputSelectedOptions}\n <span class=\"additional-selection-count\">+${this._additionalSelectedOptionCount}</span>\n <div class=\"actions\">\n ${removeButton} ${actionDivider}\n <bl-icon class=\"dropdown-icon open\" name=\"arrow_up\"></bl-icon>\n\n <bl-icon class=\"dropdown-icon closed\" name=\"arrow_down\"></bl-icon>\n </div>\n </fieldset>`;\n }\n\n selectAllTemplate() {\n if (!this.multiple || !this.viewSelectAll || this.noResultFound) {\n return null;\n }\n\n const isAllRenderedOptionsSelected = this._connectedOptions\n .filter(option => !option.hidden)\n .every(option => option.selected);\n\n const isAnySelected = this._selectedOptions.filter(option => !option.hidden).length > 0;\n const selectAllText =\n this.selectAllText ?? msg(\"Select All\", { desc: \"bl-select: select all text\" });\n\n return html`<bl-checkbox\n class=\"select-all\"\n .checked=\"${isAllRenderedOptionsSelected}\"\n .indeterminate=\"${isAnySelected && !isAllRenderedOptionsSelected}\"\n role=\"option\"\n aria-selected=\"${isAllRenderedOptionsSelected}\"\n @bl-checkbox-change=\"${this._handleSelectAll}\"\n >\n ${selectAllText}\n </bl-checkbox>`;\n }\n\n render(): TemplateResult {\n const invalidMessage = !this.checkValidity()\n ? html`<p id=\"errorMessage\" aria-live=\"polite\" class=\"invalid-text\">\n ${this.validationMessage}\n </p>`\n : \"\";\n\n const helpMessage = this.helpText ? html`<p class=\"help-text\">${this.helpText}</p>` : \"\";\n\n const label = this.label ? html`<label id=\"label\">${this.label}</label>` : \"\";\n\n const noDataText =\n this.searchNotFoundText ?? msg(\"No Data Found\", { desc: \"bl-select: search no data text\" });\n\n const clearSearchText =\n this.popoverClearSearchText ??\n msg(\"Clear Search\", { desc: \"bl-select: clear search button text\" });\n\n return html`<div\n class=${classMap({\n \"select-wrapper\": true,\n \"select-open\": this.opened,\n \"selected\": this._selectedOptions.length > 0,\n \"invalid\": !this.validity.valid,\n \"dirty\": this.dirty,\n })}\n @keydown=${this.handleKeydown}\n >\n ${label} ${this.inputTemplate()}\n ${this.options.length > 0\n ? html` <div\n class=\"popover\"\n tabindex=\"${ifDefined(this._isPopoverOpen ? undefined : \"-1\")}\"\n @bl-select-option=${this._handleSelectOptionEvent}\n role=\"listbox\"\n aria-multiselectable=\"${this.multiple}\"\n aria-labelledby=\"label\"\n >\n ${this.selectAllTemplate()}\n <slot></slot>\n ${this.searchBar && this.noResultFound\n ? html`<div name=\"popover-clear-search-text\" class=\"popover-no-result\">\n <span>${noDataText}</span>\n <bl-button\n variant=\"tertiary\"\n @click=${() => {\n this._handleSearchOptions({ target: { value: \"\" } } as InputEvent & {\n target: HTMLInputElement;\n });\n }}\n >${clearSearchText}</bl-button\n >\n </div>`\n : \"\"}\n </div>`\n : \"\"}\n <div class=\"hint\">${invalidMessage} ${helpMessage}</div>\n </div> `;\n }\n\n private focusedOptionIndex = -1;\n\n private handleKeydown(event: KeyboardEvent) {\n if (this.focusedOptionIndex === -1 && [\"Enter\", \"Space\"].includes(event.code)) {\n this._togglePopover();\n event.preventDefault();\n } else if (this._isPopoverOpen === false && [\"ArrowDown\", \"ArrowUp\"].includes(event.code)) {\n this.open();\n event.preventDefault();\n } else if (event.code === \"Escape\") {\n this.close();\n event.preventDefault();\n } else if (this._isPopoverOpen && [\"ArrowDown\", \"ArrowUp\"].includes(event.code)) {\n event.code === \"ArrowDown\" && this.focusedOptionIndex++;\n event.code === \"ArrowUp\" && this.focusedOptionIndex--;\n\n // Don't exceed array indexes\n this.focusedOptionIndex = Math.max(\n 0,\n Math.min(this.focusedOptionIndex, this.options.length - 1)\n );\n\n this.options[this.focusedOptionIndex].focus();\n\n event.preventDefault();\n }\n }\n\n private _togglePopover() {\n this._isPopoverOpen ? this.close() : this.open();\n }\n\n private _handleSelectEvent() {\n const options = this._selectedOptions.map(\n option =>\n ({\n value: option.value,\n selected: option.selected,\n text: option.textContent,\n } as ISelectOption<ValueType>)\n );\n\n if (!this.multiple) this._onBlSelect(options[0]);\n else this._onBlSelect(options);\n }\n\n private _handleSearchEvent() {\n this._onBlSearch(this._searchText);\n }\n\n private _handleSearchOptions(e: InputEvent): void {\n if (!this.searchBar) return;\n\n this._searchText = (e.target as HTMLInputElement).value;\n\n this._handleSearchEvent();\n\n this._connectedOptions.forEach(option => {\n const isVisible = option.textContent?.toLowerCase().includes(this._searchText.toLowerCase());\n\n option.hidden = !isVisible;\n });\n\n this._selectedOptions = this.options.filter(option => option.selected);\n\n this._handleLastVisibleSearchedOption();\n\n this.requestUpdate();\n }\n\n private _handleLastVisibleSearchedOption() {\n const lastVisibleOption = [...this.options].reverse().find(option => !option.hidden);\n\n if (lastVisibleOption) {\n lastVisibleOption?.shadowRoot?.querySelector(\"div\")?.classList.add(\"no-border-bottom\");\n }\n\n this.options.map(option => {\n if (!option.hidden && option !== lastVisibleOption) {\n option.shadowRoot?.querySelector(\"div\")?.classList.remove(\"no-border-bottom\");\n }\n });\n }\n\n private _handleSingleSelect(optionItem: BlSelectOption<ValueType>) {\n this.value = optionItem.value;\n\n this._handleSelectEvent();\n this._isPopoverOpen = false;\n }\n\n private _handleMultipleSelect() {\n this.value = this._connectedOptions\n .filter(option => option.selected)\n .map(option => option.value);\n\n this._handleSelectEvent();\n }\n\n private _handleSelectOptionEvent(e: CustomEvent) {\n const optionItem = e.target as BlSelectOption<ValueType>;\n\n this.dirty = true;\n\n if (this.multiple) {\n this._handleMultipleSelect();\n } else {\n this._handleSingleSelect(optionItem);\n }\n }\n\n private _handleSelectAll(e: CustomEvent) {\n const selectAllEl = this.shadowRoot?.querySelector(\".select-all\") as BlCheckbox;\n\n const checked = e.detail;\n const unselectedOptions = this._connectedOptions.filter(\n option => !option.selected && !option.hidden\n );\n const isAllUnselectedDisabled = unselectedOptions.every(option => option.disabled);\n\n // If all available options are selected, instead of checking, uncheck all options\n if (checked && isAllUnselectedDisabled) {\n setTimeout(() => {\n const checkbox = selectAllEl?.shadowRoot?.querySelector(\"input\");\n\n checkbox?.click();\n }, 0);\n return;\n }\n\n this._connectedOptions.forEach(option => {\n if (option.disabled || option.hidden) {\n return;\n }\n\n option.selected = checked;\n });\n\n this._handleMultipleSelect();\n }\n\n private _onClickRemove(e: MouseEvent) {\n e.stopPropagation();\n\n const selectedDisabledOptions = this._selectedOptions.filter(option => option.disabled);\n\n this._connectedOptions\n .filter(option => !option.disabled && option.selected)\n .forEach(option => {\n option.selected = false;\n });\n\n this.value = selectedDisabledOptions.length\n ? selectedDisabledOptions.map(option => option.value)\n : null;\n this._handleSelectEvent();\n }\n\n private _checkAdditionalItemCount() {\n if (!this.multiple || !this.selectedOptionsItems || this.selectedOptionsItems.length < 2) {\n this._additionalSelectedOptionCount = 0;\n return;\n }\n\n const firstNonVisibleItemIndex = [...this.selectedOptionsItems].findIndex(\n item => item.offsetLeft > this.selectedOptionsContainer.offsetWidth\n );\n\n if (firstNonVisibleItemIndex > -1) {\n this._additionalSelectedOptionCount =\n this.selectedOptionsItems.length - firstNonVisibleItemIndex;\n } else {\n this._additionalSelectedOptionCount = 0;\n }\n }\n\n protected firstUpdated(): void {\n if (this.value === undefined) {\n this.value = \"\" as ValueType;\n }\n\n this._initialValue = this._value;\n }\n\n protected updated(_changedProperties: PropertyValues) {\n if (\n _changedProperties.has(\"multiple\") &&\n typeof _changedProperties.get(\"multiple\") === \"boolean\"\n ) {\n this.value = null;\n }\n\n if (_changedProperties.has(\"_selectedOptions\")) {\n this._checkAdditionalItemCount();\n }\n }\n\n /**\n * This method is used by `bl-select-option` component to register itself to bl-select.\n * @param option BlSelectOption reference to be registered\n */\n registerOption(option: BlSelectOption<ValueType>) {\n this._connectedOptions.push(option);\n\n if (option.selected) {\n if (this.multiple) {\n if (!Array.isArray(this.value)) {\n this.value = [];\n }\n this.value = [...this.value, option.value];\n } else {\n this.value = option.value;\n }\n }\n\n this.setOptionsSelected();\n this.requestUpdate();\n }\n\n /**\n * This method is used by `bl-select-option` component to unregister itself from bl-select.\n * @param option BlSelectOption reference to be unregistered\n */\n unregisterOption(option: BlSelectOption<ValueType>) {\n this._connectedOptions.splice(this._connectedOptions.indexOf(option), 1);\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"bl-select\": BlSelect;\n }\n}\n"],
5
+ "mappings": "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",
6
6
  "names": ["styles", "i", "bl_select_default", "BlSelect", "FormControlMixin", "s", "event", "_a", "eventPath", "el", "bl_select_default", "val", "formData", "option", "select", "_b", "_c", "autoUpdate", "computePosition", "flip", "offset", "size", "args", "x", "y", "e", "inputSelectedOptions", "item", "removeButton", "isSearchBarVisible", "isMultipleWithSelection", "isDividerShown", "searchbarPlaceholderText", "msg", "searchMagIcon", "searchLoadingIcon", "actionDivider", "search", "o", "l", "isAllRenderedOptionsSelected", "isAnySelected", "selectAllText", "invalidMessage", "helpMessage", "label", "noDataText", "clearSearchText", "options", "isVisible", "lastVisibleOption", "optionItem", "selectAllEl", "checked", "isAllUnselectedDisabled", "checkbox", "selectedDisabledOptions", "firstNonVisibleItemIndex", "_changedProperties", "requiredValidator", "__decorateClass", "stringBooleanConverter", "t", "i", "localized"]
7
7
  }
@@ -0,0 +1,2 @@
1
+ import{a as i}from"./chunk-WJ2RNEDL.js";import{a as r,b as a}from"./chunk-X2KXJYXQ.js";import{a as o,b as l,f as s}from"./chunk-4OT5AMS5.js";import{d as e}from"./chunk-IZ2LK5GK.js";var n=o`:host{display:table-header-group}:host([sticky]){position:sticky;top:0;left:0;right:0;z-index:3;transition:top 0.05s ease;box-shadow:0 8px 16px 0 rgb(39 49 66 / 10%)}:host([sticky])::after{content:"";display:block;position:absolute;bottom:0;left:0;right:0;height:1px;background:var(--bl-color-neutral-lighter)}`,p=n;var b="bl-table-header",t=class extends s{constructor(){super(...arguments);this.sticky=!1}static get styles(){return[p]}connectedCallback(){super.connectedCallback(),this.closest(i)||console.warn("bl-table-header is designed to be used inside a bl-table",this)}render(){return l`<slot></slot> `}};e([a({type:Boolean,reflect:!0})],t.prototype,"sticky",2),t=e([r(b)],t);export{b as a,t as b};
2
+ //# sourceMappingURL=chunk-6DJUQN3S.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../src/components/table/table-header/bl-table-header.css", "../src/components/table/table-header/bl-table-header.ts"],
4
+ "sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host{display:table-header-group}:host([sticky]){position:sticky;top:0;left:0;right:0;z-index:3;transition:top 0.05s ease;box-shadow:0 8px 16px 0 rgb(39 49 66 / 10%)}:host([sticky])::after{content:\"\";display:block;position:absolute;bottom:0;left:0;right:0;height:1px;background:var(--bl-color-neutral-lighter)}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, TemplateResult } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport \"element-internals-polyfill\";\nimport { blTableTag } from \"../bl-table\";\nimport type BlTable from \"../bl-table\";\nimport style from \"../table-header/bl-table-header.css\";\n\nexport const blTableHeaderTag = \"bl-table-header\";\n\n/**\n * @tag bl-table-header\n * @summary Baklava Table component\n */\n@customElement(blTableHeaderTag)\nexport default class BlTableHeader extends LitElement {\n static get styles(): CSSResultGroup {\n return [style];\n }\n /**\n * Set table header as sticky\n */\n @property({ type: Boolean, reflect: true })\n sticky = false;\n\n connectedCallback(): void {\n super.connectedCallback();\n if (!this.closest<BlTable>(blTableTag)) {\n console.warn(\"bl-table-header is designed to be used inside a bl-table\", this);\n }\n }\n\n render(): TemplateResult {\n return html`<slot></slot> `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n [blTableHeaderTag]: BlTableHeader;\n }\n}\n"],
5
+ "mappings": "qLACO,IAAMA,EAASC,0TACfC,EAAQF,ECKR,IAAMG,EAAmB,kBAOXC,EAArB,cAA2C,CAAW,CAAtD,kCAQE,YAAS,GAPT,WAAW,QAAyB,CAClC,MAAO,CAACC,CAAK,CACf,CAOA,mBAA0B,CACxB,MAAM,kBAAkB,EACnB,KAAK,QAAiBC,CAAU,GACnC,QAAQ,KAAK,2DAA4D,IAAI,CAEjF,CAEA,QAAyB,CACvB,OAAOC,iBACT,CACF,EAZEC,EAAA,CADCC,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GAPvBL,EAQnB,sBARmBA,EAArBI,EAAA,CADCC,EAAcN,CAAgB,GACVC",
6
+ "names": ["styles", "i", "bl_table_header_default", "blTableHeaderTag", "BlTableHeader", "bl_table_header_default", "blTableTag", "x", "__decorateClass", "e"]
7
+ }
@@ -0,0 +1,16 @@
1
+ import{a as m}from"./chunk-HMDGICS5.js";import{a as u}from"./chunk-DINNT5P2.js";import{a as b,b as p}from"./chunk-X2KXJYXQ.js";import{a as d,b as i,f as h}from"./chunk-4OT5AMS5.js";import{d as a}from"./chunk-IZ2LK5GK.js";var f=d`:host{--header-cell-width:var(--bl-table-header-cell-width, auto);--header-cell-min-width:var(--bl-table-header-cell-min-width, auto);display:table-cell;border:1px solid var(--bl-color-neutral-lighter);background-color:var(--bl-color-neutral-lightest);padding:var(--bl-size-m);font:var(--bl-font-title-3-medium);color:var(--bl-color-neutral-darker);box-sizing:border-box;vertical-align:middle;white-space:normal;width:var(--header-cell-width);min-width:var(--header-cell-min-width);background-clip:padding-box}.table-header-cell{display:flex;align-items:center}.table-header-cell.shadow-right::before{content:"";position:absolute;right:-1px;top:0;width:16px;height:100%;z-index:-1;border-right:1px solid var(--bl-color-neutral-lighter);box-shadow:8px 0 16px 0 rgb(39 49 66 / 10%)}.table-header-cell.shadow-left::before{content:"";position:absolute;left:-1px;top:0;width:16px;height:100%;z-index:-1;border-left:1px solid var(--bl-color-neutral-lighter);box-shadow:-8px 0 16px 0 rgb(39 49 66 / 10%)}bl-checkbox{margin-right:var(--bl-size-m)}.sort-icons-wrapper{all:unset;width:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--bl-size-4xs);cursor:pointer}.sort-icons-wrapper:focus-visible{outline:2px solid var(--bl-color-primary);outline-offset:2px;border-radius:var(--bl-border-radius-xs)}.sort-icons-wrapper bl-icon{font-size:var(--bl-font-size-m);color:var(--bl-color-neutral-darker)}`,g=f;var x="bl-table-header-cell",r=class extends h{constructor(){super(...arguments);this.sortKey=""}static get styles(){return[g]}get _table(){return this.closest("bl-table")}get _tableRow(){return this.closest("bl-table-row")}get selectable(){var e;return this.index===0&&!!((e=this._table)!=null&&e.isSelectable(!0))}get sortable(){var e;return!!((e=this._table)!=null&&e.sortable)&&!!this.sortKey}get index(){let e=this.parentNode;return e?[...e.children].indexOf(this):-1}get checked(){var e;return!!((e=this._table)!=null&&e.isAllSelected())}get indeterminate(){var e;return!!((e=this._table)!=null&&e.isAnySelected())}get isAllUnselectedDisabled(){var e;return!!((e=this._table)!=null&&e.isAllUnselectedDisabled())}get sortDirection(){var e,t;return((e=this._table)==null?void 0:e.sortKey)===this.sortKey&&((t=this._table)==null?void 0:t.sortDirection)||""}get sortIconName(){return this.sortDirection==="asc"?"sorting_asc":this.sortDirection==="desc"?"sorting_desc":"sorting"}get shadowRight(){var e;return!!((e=this._tableRow)!=null&&e.stickyFirstColumn)&&this.index===0}get shadowLeft(){var e;return!!((e=this._tableRow)!=null&&e.stickyLastColumn)&&this.nextElementSibling===null}connectedCallback(){super.connectedCallback(),this.closest(m)||console.warn("bl-table-header-cell is designed to be used inside a bl-table-row",this)}onChange(e){var o,l;let t=(o=this.shadowRoot)==null?void 0:o.querySelector(".select-all");if(e.detail&&this.isAllUnselectedDisabled){setTimeout(()=>{var c;let s=(c=t==null?void 0:t.shadowRoot)==null?void 0:c.querySelector("input");s==null||s.click()},0);return}(l=this._table)==null||l.onSelectionChange(!0,e.detail,""),setTimeout(()=>{t.checked=this.checked,t.indeterminate=this.indeterminate})}onSort(){var t;let e="asc";this.sortDirection==="asc"?e="desc":this.sortDirection==="desc"&&(e=""),(t=this._table)==null||t.onSortChange(this.sortKey,e)}_renderCheckbox(){return this.selectable?i`<bl-checkbox
2
+ class="select-all"
3
+ value="all"
4
+ .indeterminate="${this.indeterminate}"
5
+ @bl-checkbox-change=${this.onChange}
6
+ role="option"
7
+ .checked="${this.checked}"
8
+ aria-selected="${this.checked}"
9
+ >
10
+ </bl-checkbox>`:null}render(){let e=this.sortDirection==="asc",t=this.sortDirection==="desc",n=e?"ascending":t?"descending":void 0,o=this.shadowRight?"shadow-right":this.shadowLeft?"shadow-left":"",l=this.sortable?i` <button class="sort-icons-wrapper" tabindex="0" @click=${this.onSort}>
11
+ <slot></slot>
12
+ <bl-icon name="${this.sortIconName}"></bl-icon>
13
+ </button>`:i` <slot></slot>`;return i`<div class="table-header-cell ${o}" aria-sort=${u(n)}>
14
+ ${this._renderCheckbox()} ${l}
15
+ </div> `}};a([p({type:String,reflect:!0,attribute:"sort-key"})],r.prototype,"sortKey",2),r=a([b(x)],r);export{x as a,r as b};
16
+ //# sourceMappingURL=chunk-6FHZDUYQ.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../src/components/table/table-header-cell/bl-table-header-cell.css", "../src/components/table/table-header-cell/bl-table-header-cell.ts"],
4
+ "sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host{--header-cell-width:var(--bl-table-header-cell-width, auto);--header-cell-min-width:var(--bl-table-header-cell-min-width, auto);display:table-cell;border:1px solid var(--bl-color-neutral-lighter);background-color:var(--bl-color-neutral-lightest);padding:var(--bl-size-m);font:var(--bl-font-title-3-medium);color:var(--bl-color-neutral-darker);box-sizing:border-box;vertical-align:middle;white-space:normal;width:var(--header-cell-width);min-width:var(--header-cell-min-width);background-clip:padding-box}.table-header-cell{display:flex;align-items:center}.table-header-cell.shadow-right::before{content:\"\";position:absolute;right:-1px;top:0;width:16px;height:100%;z-index:-1;border-right:1px solid var(--bl-color-neutral-lighter);box-shadow:8px 0 16px 0 rgb(39 49 66 / 10%)}.table-header-cell.shadow-left::before{content:\"\";position:absolute;left:-1px;top:0;width:16px;height:100%;z-index:-1;border-left:1px solid var(--bl-color-neutral-lighter);box-shadow:-8px 0 16px 0 rgb(39 49 66 / 10%)}bl-checkbox{margin-right:var(--bl-size-m)}.sort-icons-wrapper{all:unset;width:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--bl-size-4xs);cursor:pointer}.sort-icons-wrapper:focus-visible{outline:2px solid var(--bl-color-primary);outline-offset:2px;border-radius:var(--bl-border-radius-xs)}.sort-icons-wrapper bl-icon{font-size:var(--bl-font-size-m);color:var(--bl-color-neutral-darker)}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, TemplateResult } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport \"element-internals-polyfill\";\nimport \"../../checkbox-group/checkbox/bl-checkbox\";\nimport BlCheckbox from \"../../checkbox-group/checkbox/bl-checkbox\";\nimport \"../../icon/bl-icon\";\nimport { BaklavaIcon } from \"../../icon/icon-list\";\nimport { SortDirection } from \"../bl-table\";\nimport type BlTableRow from \"../table-row/bl-table-row\";\nimport { blTableRowTag } from \"../table-row/bl-table-row\";\nimport style from \"./bl-table-header-cell.css\";\n\nexport const blTableHeaderCellTag = \"bl-table-header-cell\";\n\n/**\n * @tag bl-table-header-cell\n * @summary Baklava Table component\n *\n * @cssproperty [--bl-table-header-cell-width] Set the column width\n * @cssproperty [--bl-table-header-cell-min-width] Set the column min width\n */\n@customElement(blTableHeaderCellTag)\nexport default class BlTableHeaderCell extends LitElement {\n static get styles(): CSSResultGroup {\n return [style];\n }\n /**\n * Set key value for column\n */\n @property({ type: String, reflect: true, attribute: \"sort-key\" })\n sortKey = \"\";\n\n private get _table() {\n return this.closest(\"bl-table\");\n }\n private get _tableRow() {\n return this.closest(\"bl-table-row\");\n }\n get selectable() {\n return this.index === 0 && !!this._table?.isSelectable(true);\n }\n get sortable() {\n return !!this._table?.sortable && !!this.sortKey;\n }\n get index() {\n const parent = this.parentNode;\n\n if (!parent) {\n return -1;\n }\n return [...parent.children].indexOf(this);\n }\n get checked() {\n return !!this._table?.isAllSelected();\n }\n get indeterminate() {\n return !!this._table?.isAnySelected();\n }\n get isAllUnselectedDisabled() {\n return !!this._table?.isAllUnselectedDisabled();\n }\n get sortDirection(): string {\n if (this._table?.sortKey === this.sortKey) {\n return this._table?.sortDirection || \"\";\n }\n\n return \"\";\n }\n get sortIconName(): BaklavaIcon {\n if (this.sortDirection === \"asc\") {\n return \"sorting_asc\";\n } else if (this.sortDirection === \"desc\") {\n return \"sorting_desc\";\n }\n\n return \"sorting\";\n }\n\n get shadowRight() {\n return !!this._tableRow?.stickyFirstColumn && this.index === 0;\n }\n get shadowLeft() {\n return !!this._tableRow?.stickyLastColumn && this.nextElementSibling === null;\n }\n\n connectedCallback(): void {\n super.connectedCallback();\n if (!this.closest<BlTableRow>(blTableRowTag)) {\n console.warn(\"bl-table-header-cell is designed to be used inside a bl-table-row\", this);\n }\n }\n\n onChange(event: CustomEvent) {\n const selectAllEl = this.shadowRoot?.querySelector(\".select-all\") as BlCheckbox;\n\n const checked = event.detail;\n\n // If all available rows are selected, instead of checking, uncheck all options\n if (checked && this.isAllUnselectedDisabled) {\n setTimeout(() => {\n const checkbox = selectAllEl?.shadowRoot?.querySelector(\"input\");\n\n checkbox?.click();\n }, 0);\n return;\n }\n this._table?.onSelectionChange(true, event.detail, \"\");\n setTimeout(() => {\n selectAllEl.checked = this.checked;\n selectAllEl.indeterminate = this.indeterminate;\n });\n }\n\n onSort() {\n let _sortDirection: SortDirection = \"asc\";\n\n if (this.sortDirection === \"asc\") {\n _sortDirection = \"desc\";\n } else if (this.sortDirection === \"desc\") {\n _sortDirection = \"\";\n }\n\n this._table?.onSortChange(this.sortKey, _sortDirection);\n }\n\n private _renderCheckbox() {\n return this.selectable\n ? html`<bl-checkbox\n class=\"select-all\"\n value=\"all\"\n .indeterminate=\"${this.indeterminate}\"\n @bl-checkbox-change=${this.onChange}\n role=\"option\"\n .checked=\"${this.checked}\"\n aria-selected=\"${this.checked}\"\n >\n </bl-checkbox>`\n : null;\n }\n\n render(): TemplateResult {\n const isAscending = this.sortDirection === \"asc\";\n const isDescending = this.sortDirection === \"desc\";\n const ariaSort = isAscending ? \"ascending\" : isDescending ? \"descending\" : undefined;\n\n const className = this.shadowRight ? \"shadow-right\" : this.shadowLeft ? \"shadow-left\" : \"\";\n const template = this.sortable\n ? html` <button class=\"sort-icons-wrapper\" tabindex=\"0\" @click=${this.onSort}>\n <slot></slot>\n <bl-icon name=\"${this.sortIconName}\"></bl-icon>\n </button>`\n : html` <slot></slot>`;\n\n return html`<div class=\"table-header-cell ${className}\" aria-sort=${ifDefined(ariaSort)}>\n ${this._renderCheckbox()} ${template}\n </div> `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n [blTableHeaderCellTag]: BlTableHeaderCell;\n }\n}\n"],
5
+ "mappings": "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",
6
+ "names": ["styles", "i", "bl_table_header_cell_default", "blTableHeaderCellTag", "BlTableHeaderCell", "s", "bl_table_header_cell_default", "_a", "parent", "_b", "blTableRowTag", "event", "selectAllEl", "checkbox", "_sortDirection", "x", "isAscending", "isDescending", "ariaSort", "className", "template", "l", "__decorateClass", "e"]
7
+ }
@@ -1,4 +1,4 @@
1
- import{a as v}from"./chunk-AAGDUS7G.js";import{a as d}from"./chunk-DJOD4BTL.js";import{a as f}from"./chunk-DINNT5P2.js";import{a as o}from"./chunk-GRL4DWKG.js";import{a as c,b as r,e as m}from"./chunk-X2KXJYXQ.js";import{a as s,b as a,f as n}from"./chunk-4OT5AMS5.js";import{d as t}from"./chunk-IZ2LK5GK.js";var E=s`:host{display:flex;flex-direction:row}fieldset{border:none;padding:0}legend{font:var(--bl-font-title-3-medium);color:var(--bl-color-neutral-darker)}.options{display:flex;flex-flow:var(--bl-checkbox-direction, column) wrap;gap:var(--bl-size-m);margin-block:var(--bl-size-xs)}`,g=E;var u="bl-checkbox-group",p="bl-checkbox-group-change",l=class extends d(n){constructor(){super(...arguments);this.value=[];this.required=!1;this.focusedOptionIndex=0}static get styles(){return[g]}get options(){return[...this.querySelectorAll(h)]}get checkedOptions(){return this.options.filter(e=>e.checked).map(e=>e.value)}get availableOptions(){return this.options.filter(e=>!e.disabled)}connectedCallback(){super.connectedCallback(),this.tabIndex=0,this.addEventListener("focus",this.handleFocus),this.addEventListener("keydown",this.handleKeyDown)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("focus",this.handleFocus),this.removeEventListener("keydown",this.handleKeyDown)}updated(e){e.has("value")&&(this.setValue(this.checkedOptions.join(",")),this.onChange(this.value))}handleOptionChecked(){this.value=this.checkedOptions}handleKeyDown(e){if(["ArrowDown","ArrowRight"].includes(e.key))this.focusedOptionIndex++;else if(["ArrowUp","ArrowLeft"].includes(e.key))this.focusedOptionIndex--;else if(e.key==="Tab"){if(e.shiftKey?this.focusedOptionIndex--:this.focusedOptionIndex++,this.focusedOptionIndex===this.availableOptions.length){this.tabIndex=0,this.focusedOptionIndex=0;return}}else return;this.focusedOptionIndex=Math.max(0,Math.min(this.focusedOptionIndex,this.availableOptions.length-1)),this.availableOptions[this.focusedOptionIndex].focus(),e.preventDefault()}handleFocus(){this.availableOptions[this.focusedOptionIndex].focus()}render(){return a`<fieldset role="group" aria-labelledby="label" aria-required=${this.required}>
1
+ import{a as v}from"./chunk-AAGDUS7G.js";import{a as d}from"./chunk-XDUIVR6I.js";import{a as f}from"./chunk-DINNT5P2.js";import{a as o}from"./chunk-GRL4DWKG.js";import{a as c,b as r,e as m}from"./chunk-X2KXJYXQ.js";import{a as s,b as a,f as n}from"./chunk-4OT5AMS5.js";import{d as t}from"./chunk-IZ2LK5GK.js";var E=s`:host{display:flex;flex-direction:row}fieldset{border:none;padding:0}legend{font:var(--bl-font-title-3-medium);color:var(--bl-color-neutral-darker)}.options{display:flex;flex-flow:var(--bl-checkbox-direction, column) wrap;gap:var(--bl-size-m);margin-block:var(--bl-size-xs)}`,g=E;var u="bl-checkbox-group",p="bl-checkbox-group-change",l=class extends d(n){constructor(){super(...arguments);this.value=[];this.required=!1;this.focusedOptionIndex=0}static get styles(){return[g]}get options(){return[...this.querySelectorAll(h)]}get checkedOptions(){return this.options.filter(e=>e.checked).map(e=>e.value)}get availableOptions(){return this.options.filter(e=>!e.disabled)}connectedCallback(){super.connectedCallback(),this.tabIndex=0,this.addEventListener("focus",this.handleFocus),this.addEventListener("keydown",this.handleKeyDown)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("focus",this.handleFocus),this.removeEventListener("keydown",this.handleKeyDown)}updated(e){e.has("value")&&(this.setValue(this.checkedOptions.join(",")),this.onChange(this.value))}handleOptionChecked(){this.value=this.checkedOptions}handleKeyDown(e){if(["ArrowDown","ArrowRight"].includes(e.key))this.focusedOptionIndex++;else if(["ArrowUp","ArrowLeft"].includes(e.key))this.focusedOptionIndex--;else if(e.key==="Tab"){if(e.shiftKey?this.focusedOptionIndex--:this.focusedOptionIndex++,this.focusedOptionIndex===this.availableOptions.length){this.tabIndex=0,this.focusedOptionIndex=0;return}}else return;this.focusedOptionIndex=Math.max(0,Math.min(this.focusedOptionIndex,this.availableOptions.length-1)),this.availableOptions[this.focusedOptionIndex].focus(),e.preventDefault()}handleFocus(){this.availableOptions[this.focusedOptionIndex].focus()}render(){return a`<fieldset role="group" aria-labelledby="label" aria-required=${this.required}>
2
2
  <legend id="label">${this.label}</legend>
3
3
  <div class="options" @bl-checkbox-change=${this.handleOptionChecked}>
4
4
  <slot></slot>
@@ -20,4 +20,4 @@ import{a as v}from"./chunk-AAGDUS7G.js";import{a as d}from"./chunk-DJOD4BTL.js";
20
20
  <slot class="label"></slot>
21
21
  </label>
22
22
  `}};i.shadowRootOptions={...n.shadowRootOptions,delegatesFocus:!0},t([r({type:Boolean,reflect:!0})],i.prototype,"checked",2),t([r()],i.prototype,"value",2),t([r({type:Boolean,reflect:!0})],i.prototype,"required",2),t([r({type:Boolean,reflect:!0})],i.prototype,"disabled",2),t([r({type:Boolean,reflect:!0})],i.prototype,"indeterminate",2),t([o("bl-checkbox-change")],i.prototype,"onChange",2),t([o("bl-focus")],i.prototype,"onFocus",2),t([o("bl-blur")],i.prototype,"onBlur",2),t([m("[type=checkbox]")],i.prototype,"checkboxElement",2),i=t([c(h)],i);export{h as a,i as b,u as c,p as d,l as e};
23
- //# sourceMappingURL=chunk-WPMIVZ4A.js.map
23
+ //# sourceMappingURL=chunk-DR4D2GMR.js.map
@@ -1,4 +1,4 @@
1
- import{b as k}from"./chunk-OSNB4BPE.js";import{a as $}from"./chunk-AAGDUS7G.js";import{a as z}from"./chunk-DJOD4BTL.js";import{a as w}from"./chunk-6LT7O7T2.js";import{a as s}from"./chunk-DINNT5P2.js";import{a as c}from"./chunk-GRL4DWKG.js";import{a as b,b as a,c as u,e as m}from"./chunk-X2KXJYXQ.js";import{a as f,b as y,c as x}from"./chunk-7GK5LKBV.js";import{a as v,b as d,c as g,f as p}from"./chunk-4OT5AMS5.js";import{d as r}from"./chunk-IZ2LK5GK.js";var C="important",I=" !"+C,S=y(class extends x{constructor(o){var l;if(super(o),o.type!==f.ATTRIBUTE||o.name!=="style"||((l=o.strings)===null||l===void 0?void 0:l.length)>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(o){return Object.keys(o).reduce((l,e)=>{let i=o[e];return i==null?l:l+`${e=e.includes("-")?e:e.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${i};`},"")}update(o,[l]){let{style:e}=o.element;if(this.ht===void 0){this.ht=new Set;for(let i in l)this.ht.add(i);return this.render(l)}this.ht.forEach(i=>{l[i]==null&&(this.ht.delete(i),i.includes("-")?e.removeProperty(i):e[i]="")});for(let i in l){let n=l[i];if(n!=null){this.ht.add(i);let h=typeof n=="string"&&n.endsWith(I);i.includes("-")||h?e.setProperty(i,h?n.slice(0,-11):n,h?C:""):e[i]=n}}return g}});var L=v`:host{display:inline-block;width:200px;position:relative}.wrapper{--row-count:1;--maxrow-count: ;--line-height:var(--bl-font-title-3-line-height);--scroll-height:var(--line-height);--padding-vertical:var(--bl-size-2xs);--padding-horizontal:var(--bl-size-xs);--label-padding:var(--bl-size-3xs);--border-size:1px;--default-scroll-height:calc((var(--row-count) * var(--line-height)) + var(--padding-vertical));--height:max(var(--scroll-height), var(--default-scroll-height));--input-font:var(--bl-font-body-text-2);--border-radius:var(--bl-size-3xs);--border-color:var(--bl-color-neutral-lighter);--background-color:var(--bl-color-neutral-full);display:flex;flex-direction:column;position:relative;gap:var(--bl-size-3xs)}.input-wrapper{border:solid var(--border-size) var(--border-color);border-radius:var(--border-radius);padding:0 calc(var(--padding-horizontal) - var(--label-padding) - var(--border-size));padding-top:var(--padding-vertical);display:flex;box-sizing:border-box;background-color:var(--background-color);margin:0;width:0;min-width:100%}textarea{--parent-padding:calc(var(--padding-horizontal) - var(--label-padding) - var(--border-size));width:100%;align-self:stretch;outline:none;font:var(--input-font);padding:0 calc(var(--padding-horizontal) - var(--border-size));padding-bottom:var(--padding-vertical);margin:0 calc(-1 * var(--parent-padding));border:none;border-radius:var(--border-radius);color:var(--bl-color-neutral-darker);resize:vertical;background-color:transparent;display:block}:host([size="large"]) .wrapper{--padding-vertical:var(--bl-size-xs);--padding-horizontal:var(--bl-size-m)}:host([size="small"]) .wrapper{--padding-vertical:var(--bl-size-3xs);--padding-horizontal:var(--bl-size-xs);--input-font:var(--bl-font-body-text-3);--line-height:var(--bl-font-title-4-line-height)}textarea:disabled{background-color:var(--bl-color-neutral-lightest);color:var(--bl-color-neutral-light);cursor:not-allowed}:host([disabled]) .wrapper{--background-color:var(--bl-color-neutral-lightest)}:host([expand]) textarea{overflow:hidden;resize:none;height:var(--height)}:host([expand][max-rows]) textarea{--maxrow-height:calc((var(--maxrow-count) * var(--line-height)) + var(--padding-vertical));overflow-y:scroll;height:min(var(--height), var(--maxrow-height))}.wrapper:focus-within{--border-color:var(--bl-color-primary)}.dirty.max-len-invalid,.dirty.invalid{--border-color:var(--bl-color-danger)}:host([label]) ::placeholder{color:transparent;transition:color ease-out 0.4s}.input-wrapper legend,label{padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}label{max-width:max-content;position:absolute;transition:all ease-in 0.1s;font:var(--bl-font-title-3-regular);top:var(--padding-vertical);left:var(--padding-horizontal);right:var(--padding-horizontal);pointer-events:none;color:var(--bl-color-neutral-light)}.input-wrapper legend{height:0;visibility:hidden;display:none}.input-wrapper legend span{padding:0 var(--label-padding);display:inline-block;opacity:0;visibility:visible}:where(.wrapper:focus-within, .wrapper.has-value) label{top:0;left:var(--padding-horizontal);transform:translateY(-50%);font:var(--bl-font-caption);color:var(--bl-color-neutral-dark);pointer-events:initial;z-index:var(--bl-index-base)}:host([label]) :where(.wrapper:focus-within, .wrapper.has-value) legend{max-width:100%;font:var(--bl-font-caption);display:block}:host ::placeholder,:host([label-fixed]) ::placeholder{color:var(--bl-color-neutral-light)}:host([label-fixed]) label{position:static;transition:none;transform:none;pointer-events:initial;font:var(--bl-font-caption);color:var(--bl-color-neutral-dark);background-color:initial;padding:0}:host([label-fixed]) legend{display:none}.hint{display:none;font:var(--bl-font-body-text-3)}:host([character-counter]) .hint,:host([help-text]) .hint,.dirty.invalid .hint{display:flex;gap:var(--bl-size-3xs)}.hint > *{margin:0;padding:0}.help-text,.invalid-text{flex:1}.counter-text{color:var(--bl-color-neutral-dark);margin-left:auto}:where(.max-len-invalid, .dirty.invalid) .hint > .counter-text{color:var(--bl-color-danger)}.dirty.invalid label{color:var(--bl-color-danger)}.invalid-text{display:none;color:var(--bl-color-danger)}.help-text{color:var(--bl-color-neutral-dark)}:where(.dirty.max-len-invalid, .dirty.invalid) .hint > .invalid-text{display:inline-block}.dirty.invalid .hint > .help-text{display:none}`,E=L;var t=class extends z(p){constructor(){super(...arguments);this.name="";this.required=!1;this.disabled=!1;this.expand=!1;this.size="medium";this.labelFixed=!1;this.characterCounter=!1;this.value="";this.rows=4;this.autofocus=!1;this.spellchecker="false";this.customScrollHeight=null;this.inputId=Math.random().toString(36).substring(2);this.onError=()=>{this.onInvalid(this.internals.validity)};this.dirty=!1}static get styles(){return[E]}connectedCallback(){var e;super.connectedCallback(),(e=this.internals.form)==null||e.addEventListener("submit",()=>{this.reportValidity()})}inputHandler(e){this.autoResize();let i=e.target.value;this.value=i,this.onInput(i)}changeHandler(e){let i=e.target.value;this.dirty=!0,this.value=i,this.onChange(i)}firstUpdated(){this.setValue(this.value),this.autoResize()}async updated(e){e.has("rows")&&this.autoResize(),e.has("value")&&(this.setValue(this.value),await this.validationComplete,this.requestUpdate())}reportValidity(){return this.dirty=!0,this.checkValidity()}valueChangedCallback(e){this.value=e}validityCallback(){var e;return this.customInvalidText||((e=this.validationTarget)==null?void 0:e.validationMessage)}autoResize(){if(!this.expand)return;this.validationTarget.style.height="auto";let e=this.validationTarget.scrollHeight;this.customScrollHeight=`${e}px`,this.validationTarget.style.removeProperty("height")}render(){let e=this.internals.validity.tooLong,i=this.checkValidity()?"":d`<p class="invalid-text">${this.validationMessage}</p>`,n=this.helpText?d`<p class="help-text">${this.helpText}</p>`:"",h=this.label?d`<label for="${this.inputId}">${this.label}</label>`:"",M=this.characterCounter&&this.maxlength?`${this.value.length}/${this.maxlength}`:this.characterCounter?`${this.value.length}`:"",R=this.characterCounter?d`<p class="counter-text">${M}</p>`:"",H={wrapper:!0,"has-value":this.value!==null&&this.value!=="",dirty:this.dirty,"max-len-invalid":e,invalid:!this.checkValidity()},V={"--row-count":`${this.rows}`,"--maxrow-count":this.maxRows?`${this.maxRows}`:null,"--scroll-height":this.customScrollHeight};return d`
1
+ import{b as k}from"./chunk-OSNB4BPE.js";import{a as $}from"./chunk-AAGDUS7G.js";import{a as z}from"./chunk-XDUIVR6I.js";import{a as w}from"./chunk-6LT7O7T2.js";import{a as s}from"./chunk-DINNT5P2.js";import{a as c}from"./chunk-GRL4DWKG.js";import{a as b,b as a,c as u,e as m}from"./chunk-X2KXJYXQ.js";import{a as f,b as y,c as x}from"./chunk-7GK5LKBV.js";import{a as v,b as d,c as g,f as p}from"./chunk-4OT5AMS5.js";import{d as r}from"./chunk-IZ2LK5GK.js";var C="important",I=" !"+C,S=y(class extends x{constructor(o){var l;if(super(o),o.type!==f.ATTRIBUTE||o.name!=="style"||((l=o.strings)===null||l===void 0?void 0:l.length)>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(o){return Object.keys(o).reduce((l,e)=>{let i=o[e];return i==null?l:l+`${e=e.includes("-")?e:e.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${i};`},"")}update(o,[l]){let{style:e}=o.element;if(this.ht===void 0){this.ht=new Set;for(let i in l)this.ht.add(i);return this.render(l)}this.ht.forEach(i=>{l[i]==null&&(this.ht.delete(i),i.includes("-")?e.removeProperty(i):e[i]="")});for(let i in l){let n=l[i];if(n!=null){this.ht.add(i);let h=typeof n=="string"&&n.endsWith(I);i.includes("-")||h?e.setProperty(i,h?n.slice(0,-11):n,h?C:""):e[i]=n}}return g}});var L=v`:host{display:inline-block;width:200px;position:relative}.wrapper{--row-count:1;--maxrow-count: ;--line-height:var(--bl-font-title-3-line-height);--scroll-height:var(--line-height);--padding-vertical:var(--bl-size-2xs);--padding-horizontal:var(--bl-size-xs);--label-padding:var(--bl-size-3xs);--border-size:1px;--default-scroll-height:calc((var(--row-count) * var(--line-height)) + var(--padding-vertical));--height:max(var(--scroll-height), var(--default-scroll-height));--input-font:var(--bl-font-body-text-2);--border-radius:var(--bl-size-3xs);--border-color:var(--bl-color-neutral-lighter);--background-color:var(--bl-color-neutral-full);display:flex;flex-direction:column;position:relative;gap:var(--bl-size-3xs)}.input-wrapper{border:solid var(--border-size) var(--border-color);border-radius:var(--border-radius);padding:0 calc(var(--padding-horizontal) - var(--label-padding) - var(--border-size));padding-top:var(--padding-vertical);display:flex;box-sizing:border-box;background-color:var(--background-color);margin:0;width:0;min-width:100%}textarea{--parent-padding:calc(var(--padding-horizontal) - var(--label-padding) - var(--border-size));width:100%;align-self:stretch;outline:none;font:var(--input-font);padding:0 calc(var(--padding-horizontal) - var(--border-size));padding-bottom:var(--padding-vertical);margin:0 calc(-1 * var(--parent-padding));border:none;border-radius:var(--border-radius);color:var(--bl-color-neutral-darker);resize:vertical;background-color:transparent;display:block}:host([size="large"]) .wrapper{--padding-vertical:var(--bl-size-xs);--padding-horizontal:var(--bl-size-m)}:host([size="small"]) .wrapper{--padding-vertical:var(--bl-size-3xs);--padding-horizontal:var(--bl-size-xs);--input-font:var(--bl-font-body-text-3);--line-height:var(--bl-font-title-4-line-height)}textarea:disabled{background-color:var(--bl-color-neutral-lightest);color:var(--bl-color-neutral-light);cursor:not-allowed}:host([disabled]) .wrapper{--background-color:var(--bl-color-neutral-lightest)}:host([expand]) textarea{overflow:hidden;resize:none;height:var(--height)}:host([expand][max-rows]) textarea{--maxrow-height:calc((var(--maxrow-count) * var(--line-height)) + var(--padding-vertical));overflow-y:scroll;height:min(var(--height), var(--maxrow-height))}.wrapper:focus-within{--border-color:var(--bl-color-primary)}.dirty.max-len-invalid,.dirty.invalid{--border-color:var(--bl-color-danger)}:host([label]) ::placeholder{color:transparent;transition:color ease-out 0.4s}.input-wrapper legend,label{padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}label{max-width:max-content;position:absolute;transition:all ease-in 0.1s;font:var(--bl-font-title-3-regular);top:var(--padding-vertical);left:var(--padding-horizontal);right:var(--padding-horizontal);pointer-events:none;color:var(--bl-color-neutral-light)}.input-wrapper legend{height:0;visibility:hidden;display:none}.input-wrapper legend span{padding:0 var(--label-padding);display:inline-block;opacity:0;visibility:visible}:where(.wrapper:focus-within, .wrapper.has-value) label{top:0;left:var(--padding-horizontal);transform:translateY(-50%);font:var(--bl-font-caption);color:var(--bl-color-neutral-dark);pointer-events:initial;z-index:var(--bl-index-base)}:host([label]) :where(.wrapper:focus-within, .wrapper.has-value) legend{max-width:100%;font:var(--bl-font-caption);display:block}:host ::placeholder,:host([label-fixed]) ::placeholder{color:var(--bl-color-neutral-light)}:host([label-fixed]) label{position:static;transition:none;transform:none;pointer-events:initial;font:var(--bl-font-caption);color:var(--bl-color-neutral-dark);background-color:initial;padding:0}:host([label-fixed]) legend{display:none}.hint{display:none;font:var(--bl-font-body-text-3)}:host([character-counter]) .hint,:host([help-text]) .hint,.dirty.invalid .hint{display:flex;gap:var(--bl-size-3xs)}.hint > *{margin:0;padding:0}.help-text,.invalid-text{flex:1}.counter-text{color:var(--bl-color-neutral-dark);margin-left:auto}:where(.max-len-invalid, .dirty.invalid) .hint > .counter-text{color:var(--bl-color-danger)}.dirty.invalid label{color:var(--bl-color-danger)}.invalid-text{display:none;color:var(--bl-color-danger)}.help-text{color:var(--bl-color-neutral-dark)}:where(.dirty.max-len-invalid, .dirty.invalid) .hint > .invalid-text{display:inline-block}.dirty.invalid .hint > .help-text{display:none}`,E=L;var t=class extends z(p){constructor(){super(...arguments);this.name="";this.required=!1;this.disabled=!1;this.expand=!1;this.size="medium";this.labelFixed=!1;this.characterCounter=!1;this.value="";this.rows=4;this.autofocus=!1;this.spellchecker="false";this.customScrollHeight=null;this.inputId=Math.random().toString(36).substring(2);this.onError=()=>{this.onInvalid(this.internals.validity)};this.dirty=!1}static get styles(){return[E]}connectedCallback(){var e;super.connectedCallback(),(e=this.internals.form)==null||e.addEventListener("submit",()=>{this.reportValidity()})}inputHandler(e){this.autoResize();let i=e.target.value;this.value=i,this.onInput(i)}changeHandler(e){let i=e.target.value;this.dirty=!0,this.value=i,this.onChange(i)}firstUpdated(){this.setValue(this.value),this.autoResize()}async updated(e){e.has("rows")&&this.autoResize(),e.has("value")&&(this.setValue(this.value),await this.validationComplete,this.requestUpdate())}reportValidity(){return this.dirty=!0,this.checkValidity()}valueChangedCallback(e){this.value=e}validityCallback(){var e;return this.customInvalidText||((e=this.validationTarget)==null?void 0:e.validationMessage)}autoResize(){if(!this.expand)return;this.validationTarget.style.height="auto";let e=this.validationTarget.scrollHeight;this.customScrollHeight=`${e}px`,this.validationTarget.style.removeProperty("height")}render(){let e=this.internals.validity.tooLong,i=this.checkValidity()?"":d`<p class="invalid-text">${this.validationMessage}</p>`,n=this.helpText?d`<p class="help-text">${this.helpText}</p>`:"",h=this.label?d`<label for="${this.inputId}">${this.label}</label>`:"",M=this.characterCounter&&this.maxlength?`${this.value.length}/${this.maxlength}`:this.characterCounter?`${this.value.length}`:"",R=this.characterCounter?d`<p class="counter-text">${M}</p>`:"",H={wrapper:!0,"has-value":this.value!==null&&this.value!=="",dirty:this.dirty,"max-len-invalid":e,invalid:!this.checkValidity()},V={"--row-count":`${this.rows}`,"--maxrow-count":this.maxRows?`${this.maxRows}`:null,"--scroll-height":this.customScrollHeight};return d`
2
2
  <div style=${S(V)} class=${w(H)}>
3
3
  ${h}
4
4
  <fieldset class="input-wrapper">
@@ -34,4 +34,4 @@ lit-html/directives/style-map.js:
34
34
  * SPDX-License-Identifier: BSD-3-Clause
35
35
  *)
36
36
  */
37
- //# sourceMappingURL=chunk-PWZJTYMH.js.map
37
+ //# sourceMappingURL=chunk-FPDUGGJ5.js.map
@@ -0,0 +1,2 @@
1
+ import{a as b}from"./chunk-K3IALLEI.js";import{a as d}from"./chunk-6DJUQN3S.js";import{a as i,b as a}from"./chunk-X2KXJYXQ.js";import{a as s,b as r,f as o}from"./chunk-4OT5AMS5.js";import{d as l}from"./chunk-IZ2LK5GK.js";var n=s`:host{display:table-row}:host([checked]),:host([checked]) ::slotted(bl-table-cell){background-color:var(--bl-color-primary-contrast)}:host([disabled]),:host([disabled]) ::slotted(bl-table-cell){background-color:var(--bl-color-neutral-lightest);color:var(--bl-color-neutral-light)}:host(:not([checked], [disabled]).__ONLY_FOR_STORYBOOK_DEMONSTRATION_HOVER__),:host(:not([checked], [disabled]):hover) ::slotted(bl-table-cell),:host(:not([checked], [disabled]):hover),:host(:not([checked], [disabled]):hover) ::slotted(bl-table-cell){background-color:var(--bl-color-tertiary-background)}:host ::slotted(*:first-child){border-left:none}:host ::slotted(*:last-child){border-right:none}:host(:first-child) ::slotted(bl-table-header-cell){border-top:none;border-right:none}:host(:first-child) ::slotted(bl-table-header-cell:first-child){border-top-left-radius:var(--bl-size-3xs)}:host(:first-child) ::slotted(bl-table-header-cell:last-child){border-top-right-radius:var(--bl-size-3xs);border-right:1px}:host(:last-child) ::slotted(bl-table-cell){border-bottom:none}:host(:first-child) ::slotted(bl-table-cell){border-top:none}:host(:last-child) ::slotted(bl-table-cell:first-child){border-bottom-left-radius:var(--bl-size-3xs)}:host(:last-child) ::slotted(bl-table-cell:last-child){border-bottom-right-radius:var(--bl-size-3xs)}:host([sticky-first-column]) ::slotted(bl-table-header-cell:first-child),:host([sticky-first-column]) ::slotted(bl-table-cell:first-child){position:sticky;z-index:2;left:0}:host([sticky-last-column]) ::slotted(bl-table-header-cell:last-child),:host([sticky-last-column]) ::slotted(bl-table-cell:last-child){position:sticky;z-index:2;right:0}`,c=n;var u="bl-table-row",e=class extends o{constructor(){super(...arguments);this.selectionKey=""}static get styles(){return[c]}connectedCallback(){super.connectedCallback(),!this.closest(d)&&!this.closest(b)&&console.warn("bl-table-row is designed to be used inside a bl-table-header or bl-table-body",this)}updated(t){super.updated(t),this.removeAttribute("checked"),this.removeAttribute("disabled"),this.removeAttribute("sticky-first-column"),this.removeAttribute("sticky-last-column"),this.stickyFirstColumn&&this.setAttribute("sticky-first-column","true"),this.stickyLastColumn&&this.setAttribute("sticky-last-column","true"),this.checked?this.setAttribute("checked","true"):this.disabled&&this.setAttribute("disabled","true"),t.has("selectionKey")&&this.updateComplete.then(()=>{Array.from(this.querySelectorAll("bl-table-header-cell,bl-table-cell")).map(h=>{h.requestUpdate()})})}get _table(){return this.closest("bl-table")}get _firstTableCell(){return this.querySelector("bl-table-cell")}get disabled(){var t;return!!((t=this._firstTableCell)!=null&&t.disabled)}get checked(){var t;return!!((t=this._table)!=null&&t.isRowSelected(this.selectionKey))}get stickyFirstColumn(){var t;return!!((t=this._table)!=null&&t.isFirstColumnSticky())}get stickyLastColumn(){var t;return!!((t=this._table)!=null&&t.isLastColumnSticky())}render(){return r`<slot></slot>`}};l([a({type:String,reflect:!0,attribute:"selection-key"})],e.prototype,"selectionKey",2),e=l([i(u)],e);export{u as a,e as b};
2
+ //# sourceMappingURL=chunk-HMDGICS5.js.map