mirror of
https://github.com/Eugeny/tabby
synced 2024-11-14 17:07:15 +00:00
autocomplete profile colors - fixes #4231
This commit is contained in:
parent
8d5b0fe863
commit
70b6be7301
4 changed files with 28 additions and 14 deletions
|
@ -13,6 +13,7 @@ import { TabsService } from './services/tabs.service'
|
|||
import { HotkeysService } from './services/hotkeys.service'
|
||||
import { PromptModalComponent } from './components/promptModal.component'
|
||||
import { SplitLayoutProfilesService } from './profiles'
|
||||
import { TAB_COLORS } from './utils'
|
||||
|
||||
/** @hidden */
|
||||
@Injectable()
|
||||
|
@ -89,16 +90,6 @@ export class TabManagementContextMenu extends TabContextMenuItemProvider {
|
|||
}
|
||||
}
|
||||
|
||||
const COLORS = [
|
||||
{ name: 'No color', value: null },
|
||||
{ name: 'Blue', value: '#0275d8' },
|
||||
{ name: 'Green', value: '#5cb85c' },
|
||||
{ name: 'Orange', value: '#f0ad4e' },
|
||||
{ name: 'Purple', value: '#613d7c' },
|
||||
{ name: 'Red', value: '#d9534f' },
|
||||
{ name: 'Yellow', value: '#ffd500' },
|
||||
]
|
||||
|
||||
/** @hidden */
|
||||
@Injectable()
|
||||
export class CommonOptionsContextMenu extends TabContextMenuItemProvider {
|
||||
|
@ -127,8 +118,8 @@ export class CommonOptionsContextMenu extends TabContextMenuItemProvider {
|
|||
},
|
||||
{
|
||||
label: 'Color',
|
||||
sublabel: COLORS.find(x => x.value === tab.color)?.name,
|
||||
submenu: COLORS.map(color => ({
|
||||
sublabel: TAB_COLORS.find(x => x.value === tab.color)?.name,
|
||||
submenu: TAB_COLORS.map(color => ({
|
||||
label: color.name,
|
||||
type: 'radio',
|
||||
checked: tab.color === color.value,
|
||||
|
|
|
@ -54,3 +54,13 @@ export class ResettableTimeout {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
export const TAB_COLORS = [
|
||||
{ name: 'No color', value: null },
|
||||
{ name: 'Blue', value: '#0275d8' },
|
||||
{ name: 'Green', value: '#5cb85c' },
|
||||
{ name: 'Orange', value: '#f0ad4e' },
|
||||
{ name: 'Purple', value: '#613d7c' },
|
||||
{ name: 'Red', value: '#d9534f' },
|
||||
{ name: 'Yellow', value: '#ffd500' },
|
||||
]
|
||||
|
|
|
@ -46,7 +46,10 @@
|
|||
input.form-control.w-50(
|
||||
type='text',
|
||||
[(ngModel)]='profile.color',
|
||||
placeholder='#000000'
|
||||
placeholder='#000000',
|
||||
alwaysVisibleTypeahead,
|
||||
[ngbTypeahead]='colorsAutocomplete',
|
||||
[resultFormatter]='colorsFormatter'
|
||||
)
|
||||
|
||||
.form-line
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
import { Observable, OperatorFunction, debounceTime, map, distinctUntilChanged } from 'rxjs'
|
||||
import { Component, Input, ViewChild, ViewContainerRef, ComponentFactoryResolver, Injector } from '@angular/core'
|
||||
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'
|
||||
import { ConfigProxy, ConfigService, Profile, ProfileProvider, ProfileSettingsComponent, ProfilesService } from 'tabby-core'
|
||||
import { ConfigProxy, ConfigService, Profile, ProfileProvider, ProfileSettingsComponent, ProfilesService, TAB_COLORS } from 'tabby-core'
|
||||
|
||||
const iconsData = require('../../../tabby-core/src/icons.json')
|
||||
const iconsClassList = Object.keys(iconsData).map(
|
||||
|
@ -39,6 +39,16 @@ export class EditProfileModalComponent<P extends Profile> {
|
|||
)].sort() as string[]
|
||||
}
|
||||
|
||||
colorsAutocomplete = text$ => text$.pipe(
|
||||
debounceTime(200),
|
||||
distinctUntilChanged(),
|
||||
map((q: string) => TAB_COLORS.filter(x => !q || x.toString().startsWith(q)).map(x => x.value))
|
||||
)
|
||||
|
||||
colorsFormatter = value => {
|
||||
return TAB_COLORS.find(x => x.value === value)?.name ?? value
|
||||
}
|
||||
|
||||
ngOnInit () {
|
||||
this._profile = this.profile
|
||||
this.profile = this.profilesService.getConfigProxyForProfile(this.profile)
|
||||
|
|
Loading…
Reference in a new issue