AashTablist | Vue Components for AaSH (ARIA augmented Semantic HTML)

Generates a tab list element and its child tab elements with all required ARIA attributes. All tab elements have an aria-controls attribute that references the associated tab panel.

The tab panels controlled by the tab list are made known by objects of type Panel. Because the tab panels are referenced from the tab elements, the tab panel elements need only an id attribute and role=tabpanel tabindex=0.

Once created, a component provides the externally invocable methods described below.

Hierarchy

Vue
- AashTablist

Index

Constructors

constructor

Vue Component Properties

Other Properties

Accessors

isVertical

Methods

Constructors

constructor

new AashTablist(options?: ThisTypedComponentOptionsWithArrayProps<Vue, object, object, object, never>): AashTablist
new AashTablist(options?: ThisTypedComponentOptionsWithRecordProps<Vue, object, object, object, object>): AashTablist
new AashTablist(options?: ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Record<string, any>>, Record<string, any>>): AashTablist

- Defined in node_modules/vue/types/vue.d.ts:80
Parameters
- Optional options: ThisTypedComponentOptionsWithArrayProps<Vue, object, object, object, never>
Returns AashTablist
- Defined in node_modules/vue/types/vue.d.ts:81
Parameters
- Optional options: ThisTypedComponentOptionsWithRecordProps<Vue, object, object, object, object>
Returns AashTablist
- Defined in node_modules/vue/types/vue.d.ts:83
Parameters
- Optional options: ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Record<string, any>>, Record<string, any>>
Returns AashTablist

Vue Component Properties

Readonly id

id: string

The id attribute of the generated top level HTML element

initialPanels

initialPanels: Panel[]

The initial panels

l10n

l10n: undefined | ((label: string) => string)

A function invoked with a label as argument before the label is rendered

Other Properties

Readonly $attrs

$attrs: Record<string, string>

Readonly $children

$children: Vue[]

$createElement

$createElement: CreateElement

Readonly $data

$data: Record<string, any>

$delete

$delete: { (object: object, key: string | number): void; <T>(array: T[], key: number): void }

Type declaration

- (object: object, key: string | number): void
- <T>(array: T[], key: number): void
- Parameters
  - object: object
  - key: string | number
  Returns void
- Type parameters
  - T
  Parameters
  - array: T[]
  - key: number
  Returns void

Readonly $el

$el: Element

Readonly $isServer

$isServer: boolean

Readonly $listeners

$listeners: Record<string, Function | Function[]>

Readonly $options

$options: ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Record<string, any>>, Record<string, any>>

Readonly $parent

$parent: Vue

Readonly $props

$props: Record<string, any>

Readonly $refs

$refs: {}

Type declaration

[key: string]: Vue | Element | Vue[] | Element[]

Readonly $root

$root: Vue

Readonly $scopedSlots

$scopedSlots: {}

Type declaration

[key: string]: NormalizedScopedSlot | undefined

$set

$set: { <T>(object: object, key: string | number, value: T): T; <T>(array: T[], key: number, value: T): T }

Type declaration

- <T>(object: object, key: string | number, value: T): T
- <T>(array: T[], key: number, value: T): T
- Type parameters
  - T
  Parameters
  - object: object
  - key: string | number
  - value: T
  Returns T
- Type parameters
  - T
  Parameters
  - array: T[]
  - key: number
  - value: T
  Returns T

Readonly $slots

$slots: {}

Type declaration

[key: string]: VNode[] | undefined

Readonly $ssrContext

$ssrContext: any

Readonly $vnode

$vnode: VNode

config

config: VueConfiguration

panels

panels: Panel[] = ...

selected

selected: any = null

version

version: string

Accessors

isVertical

get isVertical(): boolean

- Defined in src/components/tablist/AashTablist.ts:46
Returns boolean

Methods

$destroy

$destroy(): void

- Defined in node_modules/vue/types/vue.d.ts:42
Returns void

$emit

$emit(event: string, ...args: any[]): AashTablist

- Defined in node_modules/vue/types/vue.d.ts:58
Parameters
- event: string
- Rest ...args: any[]
Returns AashTablist

$forceUpdate

$forceUpdate(): void

- Defined in node_modules/vue/types/vue.d.ts:41
Returns void

$mount

$mount(elementOrSelector?: string | Element, hydrating?: boolean): AashTablist

- Defined in node_modules/vue/types/vue.d.ts:40
Parameters
- Optional elementOrSelector: string | Element
- Optional hydrating: boolean
Returns AashTablist

$nextTick

$nextTick(callback: () => void): void
$nextTick(): Promise<void>

- Defined in node_modules/vue/types/vue.d.ts:59
Parameters
- callback: () => void
  - - (): void
    - Returns void
Returns void
- Defined in node_modules/vue/types/vue.d.ts:60
Returns Promise<void>

$off

$off(event?: string | string[], callback?: Function): AashTablist

- Defined in node_modules/vue/types/vue.d.ts:57
Parameters
- Optional event: string | string[]
- Optional callback: Function
Returns AashTablist

$on

$on(event: string | string[], callback: Function): AashTablist

- Defined in node_modules/vue/types/vue.d.ts:55
Parameters
- event: string | string[]
- callback: Function
Returns AashTablist

$once

$once(event: string | string[], callback: Function): AashTablist

- Defined in node_modules/vue/types/vue.d.ts:56
Parameters
- event: string | string[]
- callback: Function
Returns AashTablist

$watch

$watch(expOrFn: string, callback: (n: any, o: any) => void, options?: WatchOptions): () => void
$watch<T>(expOrFn: () => T, callback: (n: T, o: T) => void, options?: WatchOptions): () => void

- Defined in node_modules/vue/types/vue.d.ts:45
Parameters
- expOrFn: string
- callback: (n: any, o: any) => void
  - - (n: any, o: any): void
    - Parameters
      - n: any
      - o: any
      Returns void
- Optional options: WatchOptions
Returns () => void
- - (): void
  - Returns void
- Defined in node_modules/vue/types/vue.d.ts:50
Type parameters
- T
Parameters
- expOrFn: () => T
  - - (): T
    - Returns T
- callback: (n: T, o: T) => void
  - - (n: T, o: T): void
    - Parameters
      - n: T
      - o: T
      Returns void
- Optional options: WatchOptions
Returns () => void
- - (): void
  - Returns void

Private _label

_label(panel: Panel): any

- Defined in src/components/tablist/AashTablist.ts:96
Parameters
- panel: Panel
Returns any

Private _onKey

_onKey(event: KeyboardEvent): void

- Defined in src/components/tablist/AashTablist.ts:131
Parameters
- event: KeyboardEvent
Returns void

Private _selectedPanel

_selectedPanel(): [null | Panel, number]

- Defined in src/components/tablist/AashTablist.ts:121
Returns [null | Panel, number]

Private _setupTabpanel

_setupTabpanel(panel: Panel): void

- Defined in src/components/tablist/AashTablist.ts:106
Parameters
- panel: Panel
Returns void

addPanel

addPanel(panel: Panel): void

- Defined in src/components/tablist/AashTablist.ts:55
Adds another panel.

Parameters
- panel: Panel
  
  the panel to add
Returns void

compile

compile(template: string): { staticRenderFns: (() => VNode)[]; render: any }

- Defined in node_modules/vue/types/vue.d.ts:117
Parameters
- template: string
Returns { staticRenderFns: (() => VNode)[]; render: any }
- staticRenderFns: (() => VNode)[]
- render: function
  - render(createElement: any): VNode
  - - Defined in node_modules/vue/types/vue.d.ts:118
    Parameters
    - createElement: any
    Returns VNode

component

component(id: string): VueConstructor<Vue>
component<VC>(id: string, constructor: VC): VC
component<Data, Methods, Computed, Props>(id: string, definition: AsyncComponent<Data, Methods, Computed, Props>): ExtendedVue<Vue, Data, Methods, Computed, Props>
component<Data, Methods, Computed, PropNames>(id: string, definition?: ThisTypedComponentOptionsWithArrayProps<Vue, Data, Methods, Computed, PropNames>): ExtendedVue<Vue, Data, Methods, Computed, Record<PropNames, any>>
component<Data, Methods, Computed, Props>(id: string, definition?: ThisTypedComponentOptionsWithRecordProps<Vue, Data, Methods, Computed, Props>): ExtendedVue<Vue, Data, Methods, Computed, Props>
component<PropNames>(id: string, definition: FunctionalComponentOptions<Record<PropNames, any>, PropNames[]>): ExtendedVue<Vue, {}, {}, {}, Record<PropNames, any>>
component<Props>(id: string, definition: FunctionalComponentOptions<Props, RecordPropsDefinition<Props>>): ExtendedVue<Vue, {}, {}, {}, Props>
component(id: string, definition?: ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Record<string, any>>, Record<string, any>>): ExtendedVue<Vue, {}, {}, {}, {}>

- Defined in node_modules/vue/types/vue.d.ts:105
Parameters
- id: string
Returns VueConstructor<Vue>
- Defined in node_modules/vue/types/vue.d.ts:106
Type parameters
- VC: VueConstructor<Vue, VC>
Parameters
- id: string
- constructor: VC
Returns VC
- Defined in node_modules/vue/types/vue.d.ts:107
Type parameters
- Data
- Methods
- Computed
- Props
Parameters
- id: string
- definition: AsyncComponent<Data, Methods, Computed, Props>
Returns ExtendedVue<Vue, Data, Methods, Computed, Props>
- Defined in node_modules/vue/types/vue.d.ts:108
Type parameters
- Data
- Methods
- Computed
- PropNames: string = never
Parameters
- id: string
- Optional definition: ThisTypedComponentOptionsWithArrayProps<Vue, Data, Methods, Computed, PropNames>
Returns ExtendedVue<Vue, Data, Methods, Computed, Record<PropNames, any>>
- Defined in node_modules/vue/types/vue.d.ts:109
Type parameters
- Data
- Methods
- Computed
- Props
Parameters
- id: string
- Optional definition: ThisTypedComponentOptionsWithRecordProps<Vue, Data, Methods, Computed, Props>
Returns ExtendedVue<Vue, Data, Methods, Computed, Props>
- Defined in node_modules/vue/types/vue.d.ts:110
Type parameters
- PropNames: string
Parameters
- id: string
- definition: FunctionalComponentOptions<Record<PropNames, any>, PropNames[]>
Returns ExtendedVue<Vue, {}, {}, {}, Record<PropNames, any>>
- Defined in node_modules/vue/types/vue.d.ts:111
Type parameters
- Props
Parameters
- id: string
- definition: FunctionalComponentOptions<Props, RecordPropsDefinition<Props>>
Returns ExtendedVue<Vue, {}, {}, {}, Props>
- Defined in node_modules/vue/types/vue.d.ts:112
Parameters
- id: string
- Optional definition: ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Record<string, any>>, Record<string, any>>
Returns ExtendedVue<Vue, {}, {}, {}, {}>

delete

delete(object: object, key: string | number): void
delete<T>(array: T[], key: number): void

- Defined in node_modules/vue/types/vue.d.ts:96
Parameters
- object: object
- key: string | number
Returns void
- Defined in node_modules/vue/types/vue.d.ts:97
Type parameters
- T
Parameters
- array: T[]
- key: number
Returns void

directive

directive(id: string, definition?: DirectiveOptions | DirectiveFunction): DirectiveOptions

- Defined in node_modules/vue/types/vue.d.ts:99
Parameters
- id: string
- Optional definition: DirectiveOptions | DirectiveFunction
Returns DirectiveOptions

extend

extend<Data, Methods, Computed, PropNames>(options?: ThisTypedComponentOptionsWithArrayProps<Vue, Data, Methods, Computed, PropNames>): ExtendedVue<Vue, Data, Methods, Computed, Record<PropNames, any>>
extend<Data, Methods, Computed, Props>(options?: ThisTypedComponentOptionsWithRecordProps<Vue, Data, Methods, Computed, Props>): ExtendedVue<Vue, Data, Methods, Computed, Props>
extend<PropNames>(definition: FunctionalComponentOptions<Record<PropNames, any>, PropNames[]>): ExtendedVue<Vue, {}, {}, {}, Record<PropNames, any>>
extend<Props>(definition: FunctionalComponentOptions<Props, RecordPropsDefinition<Props>>): ExtendedVue<Vue, {}, {}, {}, Props>
extend(options?: ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Record<string, any>>, Record<string, any>>): ExtendedVue<Vue, {}, {}, {}, {}>

- Defined in node_modules/vue/types/vue.d.ts:86
Type parameters
- Data
- Methods
- Computed
- PropNames: string = never
Parameters
- Optional options: ThisTypedComponentOptionsWithArrayProps<Vue, Data, Methods, Computed, PropNames>
Returns ExtendedVue<Vue, Data, Methods, Computed, Record<PropNames, any>>
- Defined in node_modules/vue/types/vue.d.ts:87
Type parameters
- Data
- Methods
- Computed
- Props
Parameters
- Optional options: ThisTypedComponentOptionsWithRecordProps<Vue, Data, Methods, Computed, Props>
Returns ExtendedVue<Vue, Data, Methods, Computed, Props>
- Defined in node_modules/vue/types/vue.d.ts:88
Type parameters
- PropNames: string = never
Parameters
- definition: FunctionalComponentOptions<Record<PropNames, any>, PropNames[]>
Returns ExtendedVue<Vue, {}, {}, {}, Record<PropNames, any>>
- Defined in node_modules/vue/types/vue.d.ts:89
Type parameters
- Props
Parameters
- definition: FunctionalComponentOptions<Props, RecordPropsDefinition<Props>>
Returns ExtendedVue<Vue, {}, {}, {}, Props>
- Defined in node_modules/vue/types/vue.d.ts:90
Parameters
- Optional options: ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Record<string, any>>, Record<string, any>>
Returns ExtendedVue<Vue, {}, {}, {}, {}>

filter

filter(id: string, definition?: Function): Function

- Defined in node_modules/vue/types/vue.d.ts:103
Parameters
- id: string
- Optional definition: Function
Returns Function

mixin

mixin(mixin: VueConstructor<Vue> | ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Record<string, any>>, Record<string, any>>): VueConstructor<Vue>

- Defined in node_modules/vue/types/vue.d.ts:116
Parameters
- mixin: VueConstructor<Vue> | ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Record<string, any>>, Record<string, any>>
Returns VueConstructor<Vue>

mounted

mounted(): void

- Defined in src/components/tablist/AashTablist.ts:184
Returns void

nextTick

nextTick<T>(callback: () => void, context?: T): void
nextTick(): Promise<void>

- Defined in node_modules/vue/types/vue.d.ts:92
Type parameters
- T
Parameters
- callback: () => void
  - - (): void
    - Returns void
- Optional context: T
Returns void
- Defined in node_modules/vue/types/vue.d.ts:93
Returns Promise<void>

observable

observable<T>(obj: T): T

- Defined in node_modules/vue/types/vue.d.ts:122
Type parameters
- T
Parameters
- obj: T
Returns T

onPanelsChange

onPanelsChange(newValue: any): void

- Defined in src/components/tablist/AashTablist.ts:178
Parameters
- newValue: any
Returns void

removePanel

removePanel(panelId: string): void

- Defined in src/components/tablist/AashTablist.ts:64
Removes the panel with the given id.

Parameters
- panelId: string
  
  the panelId
Returns void

selectPanel

selectPanel(panelId: string): void

- Defined in src/components/tablist/AashTablist.ts:82
Activates the panel with the given id.

Parameters
- panelId: string
  
  the panelId
Returns void

set

set<T>(object: object, key: string | number, value: T): T
set<T>(array: T[], key: number, value: T): T

- Defined in node_modules/vue/types/vue.d.ts:94
Type parameters
- T
Parameters
- object: object
- key: string | number
- value: T
Returns T
- Defined in node_modules/vue/types/vue.d.ts:95
Type parameters
- T
Parameters
- array: T[]
- key: number
- value: T
Returns T

use

use<T>(plugin: PluginObject<T> | PluginFunction<T>, options?: T): VueConstructor<Vue>
use(plugin: PluginObject<any> | PluginFunction<any>, ...options: any[]): VueConstructor<Vue>

- Defined in node_modules/vue/types/vue.d.ts:114
Type parameters
- T
Parameters
- plugin: PluginObject<T> | PluginFunction<T>
- Optional options: T
Returns VueConstructor<Vue>
- Defined in node_modules/vue/types/vue.d.ts:115
Parameters
- plugin: PluginObject<any> | PluginFunction<any>
- Rest ...options: any[]
Returns VueConstructor<Vue>

Hierarchy

Index

Constructors

Vue Component Properties

Other Properties

Accessors

Methods

Constructors

constructor

Parameters

Optional options: ThisTypedComponentOptionsWithArrayProps<Vue, object, object, object, never>

Returns AashTablist

Parameters

Optional options: ThisTypedComponentOptionsWithRecordProps<Vue, object, object, object, object>

Returns AashTablist

Parameters

Optional options: ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Record<string, any>>, Record<string, any>>

Returns AashTablist

Vue Component Properties

Readonly id

initialPanels

l10n

Other Properties

Readonly $attrs

Readonly $children

$createElement

Readonly $data

$delete

Type declaration

Parameters

object: object

key: string | number

Returns void

Type parameters

T

Parameters

array: T[]

key: number

Returns void

Readonly $el

Readonly $isServer

Readonly $listeners

Readonly $options

Readonly $parent

Readonly $props

Readonly $refs

Type declaration

[key: string]: Vue | Element | Vue[] | Element[]

Readonly $root

Readonly $scopedSlots

Type declaration

[key: string]: NormalizedScopedSlot | undefined

$set

Type declaration

Type parameters

T

Parameters

object: object

key: string | number

value: T

Returns T

Type parameters

T

Parameters

array: T[]

key: number

value: T

Returns T

Readonly $slots

Type declaration

[key: string]: VNode[] | undefined

Readonly $ssrContext

Readonly $vnode

config

panels

selected

version

Accessors

isVertical

Returns boolean