libs/components/src/select/select.component.html

<ng-select
  [(ngModel)]="selectedOption"
  (ngModelChange)="onChange($event)"
  [disabled]="disabled"
  [placeholder]="placeholder"
  [items]="items"
  (blur)="onBlur()"
  [labelForId]="labelForId"
  [clearable]="false"
  (close)="onClose()"
  appendTo="body"
  [keyDownFn]="onKeyDown"
>
  <ng-template ng-option-tmp let-item="item">
    <div class="tw-flex" [title]="item.label">
      <div class="tw-me-2 tw-flex-initial">
        @if (item.icon != null) {
          <i class="bwi bwi-fw {{ item.icon }}" aria-hidden="true"></i>
        }
      </div>
      <div class="tw-flex-1 tw-text-ellipsis tw-overflow-hidden">
        {{ item.label }}
      </div>
    </div>
  </ng-template>
</ng-select>
[EC-667] Collection modal add search function (#4291) * [EC-667] feat: scaffold new select component * [EC-667] feat: sort of working implementation * [EC-667] feat: support for using in forms * [EC-667] feat: add bit-select example to full form * [EC-667] fix: broken aria label connetion * [EC-667] fix: web not building * [EC-667] fix: dropdown getting trapped in dialog * [EC-667] fix: select not emitting correct value * [EC-667] feat: add collection icon to options * [EC-667] feat: add default select placeholder translation * [EC-667] fix: undefined handling * [EC-667] fix: value vs options race condition * [EC-667] feat: remove x and add "no collection" option * [EC-667] chore: add country list disclaimer * chore: clean up comments * [EC-667] chore: cleanup commented import * [EC-667] fix: input text color not applying to single-select 2023-02-06 15:54:23 +01:00			`<ng-select`
			`[(ngModel)]="selectedOption"`
			`(ngModelChange)="onChange($event)"`
			`[disabled]="disabled"`
			`[placeholder]="placeholder"`
			`[items]="items"`
			`(blur)="onBlur()"`
			`[labelForId]="labelForId"`
			`[clearable]="false"`
[PM-13818] Allow user to edit self-hosted url during registration (#11790) * Trigger self hosted settings dialog on select close * Simplify triggering self hosted env config dialog * Always emit selected value * Update variable naming of lastSelectedValue to userSelectedValue to better reflect purpose * Add comment for userSelectedValue variable * Remove userSelectedValue and simply emit a closed event * Remove passing selectedRegion in closed event 2024-11-06 13:17:59 -06:00			`(close)="onClose()"`
[EC-667] Collection modal add search function (#4291) * [EC-667] feat: scaffold new select component * [EC-667] feat: sort of working implementation * [EC-667] feat: support for using in forms * [EC-667] feat: add bit-select example to full form * [EC-667] fix: broken aria label connetion * [EC-667] fix: web not building * [EC-667] fix: dropdown getting trapped in dialog * [EC-667] fix: select not emitting correct value * [EC-667] feat: add collection icon to options * [EC-667] feat: add default select placeholder translation * [EC-667] fix: undefined handling * [EC-667] fix: value vs options race condition * [EC-667] feat: remove x and add "no collection" option * [EC-667] chore: add country list disclaimer * chore: clean up comments * [EC-667] chore: cleanup commented import * [EC-667] fix: input text color not applying to single-select 2023-02-06 15:54:23 +01:00			`appendTo="body"`
[PM-16291] Prevent parent components from closing when esc key is pressed on select and menu (#15214) 2025-06-30 11:03:24 -04:00			`[keyDownFn]="onKeyDown"`
[EC-667] Collection modal add search function (#4291) * [EC-667] feat: scaffold new select component * [EC-667] feat: sort of working implementation * [EC-667] feat: support for using in forms * [EC-667] feat: add bit-select example to full form * [EC-667] fix: broken aria label connetion * [EC-667] fix: web not building * [EC-667] fix: dropdown getting trapped in dialog * [EC-667] fix: select not emitting correct value * [EC-667] feat: add collection icon to options * [EC-667] feat: add default select placeholder translation * [EC-667] fix: undefined handling * [EC-667] fix: value vs options race condition * [EC-667] feat: remove x and add "no collection" option * [EC-667] chore: add country list disclaimer * chore: clean up comments * [EC-667] chore: cleanup commented import * [EC-667] fix: input text color not applying to single-select 2023-02-06 15:54:23 +01:00			`>`
			`<ng-template ng-option-tmp let-item="item">`
[PM-9952][PM-9954] Minor assign collection fixes (#10190) * disable organization selector when only one org is selected * break long org names in assign collections copy - applicable more in the browser implementation * add `title` to each select option so a mouse over presents the name - more applicable to the browser extension where names can overflow * truncate options that overflow a select * set max width of form fields to 100% 2024-07-22 09:26:38 -05:00			`<div class="tw-flex" [title]="item.label">`
[CL-703] Use logical css properties in CL components (#14951) * update usage of margin-right with margin-inline-end * update usage of margin-left with margin-inline-start * update usage of paddiing-right with padding-inline-end * update usage of paddiing-left with padding-inline-start * update usage of radius to use logical properties 2025-06-02 12:05:30 -04:00			`<div class="tw-me-2 tw-flex-initial">`
[CL-553] Migrate CL to Control Flow syntax (#12390) 2025-02-03 20:11:59 +01:00			`@if (item.icon != null) {`
			`<i class="bwi bwi-fw {{ item.icon }}" aria-hidden="true"></i>`
			`}`
[EC-667] Collection modal add search function (#4291) * [EC-667] feat: scaffold new select component * [EC-667] feat: sort of working implementation * [EC-667] feat: support for using in forms * [EC-667] feat: add bit-select example to full form * [EC-667] fix: broken aria label connetion * [EC-667] fix: web not building * [EC-667] fix: dropdown getting trapped in dialog * [EC-667] fix: select not emitting correct value * [EC-667] feat: add collection icon to options * [EC-667] feat: add default select placeholder translation * [EC-667] fix: undefined handling * [EC-667] fix: value vs options race condition * [EC-667] feat: remove x and add "no collection" option * [EC-667] chore: add country list disclaimer * chore: clean up comments * [EC-667] chore: cleanup commented import * [EC-667] fix: input text color not applying to single-select 2023-02-06 15:54:23 +01:00			`</div>`
[PM-9952][PM-9954] Minor assign collection fixes (#10190) * disable organization selector when only one org is selected * break long org names in assign collections copy - applicable more in the browser implementation * add `title` to each select option so a mouse over presents the name - more applicable to the browser extension where names can overflow * truncate options that overflow a select * set max width of form fields to 100% 2024-07-22 09:26:38 -05:00			`<div class="tw-flex-1 tw-text-ellipsis tw-overflow-hidden">`
[EC-667] Collection modal add search function (#4291) * [EC-667] feat: scaffold new select component * [EC-667] feat: sort of working implementation * [EC-667] feat: support for using in forms * [EC-667] feat: add bit-select example to full form * [EC-667] fix: broken aria label connetion * [EC-667] fix: web not building * [EC-667] fix: dropdown getting trapped in dialog * [EC-667] fix: select not emitting correct value * [EC-667] feat: add collection icon to options * [EC-667] feat: add default select placeholder translation * [EC-667] fix: undefined handling * [EC-667] fix: value vs options race condition * [EC-667] feat: remove x and add "no collection" option * [EC-667] chore: add country list disclaimer * chore: clean up comments * [EC-667] chore: cleanup commented import * [EC-667] fix: input text color not applying to single-select 2023-02-06 15:54:23 +01:00			`{{ item.label }}`
			`</div>`
			`</div>`
			`</ng-template>`
			`</ng-select>`