@angular/cdk-experimental 20.0.0-next.9 → 20.0.0-rc.1

package/ui-patterns/index.d.ts

@@ -1,4 +1,4 @@
 export { L as ListboxInputs, a as ListboxPattern, O as OptionInputs, b as OptionPattern } from '../listbox.d-QWPLmxRe.js';
 export { S as SignalLike, W as WritableSignalLike, c as convertGetterSetterToWritableSignalLike } from '../list-navigation.d-DfOSxsSp.js';
-export { T as TabInputs, b as TabListInputs, e as TabListPattern, c as TabPanelInputs, d as TabPanelPattern, a as TabPattern } from '../tabs.d-BAo141mw.js';
+export { T as TabInputs, d as TabListInputs, e as TabListPattern, b as TabPanelInputs, c as TabPanelPattern, a as TabPattern } from '../tabs.d-DooGD7Uk.js';
 import '@angular/core';

package/fesm2022/tabs-BunANY1M.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"tabs-BunANY1M.mjs","sources":["../../../../../darwin_arm64-fastbuild-ST-46c76129e412/bin/src/cdk-experimental/ui-patterns/tabs/tabs.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {computed, signal} from '@angular/core';\n\nimport {KeyboardEventManager} from '../behaviors/event-manager/keyboard-event-manager';\nimport {PointerEventManager} from '../behaviors/event-manager/pointer-event-manager';\nimport {ListFocus, ListFocusInputs, ListFocusItem} from '../behaviors/list-focus/list-focus';\nimport {\n  ListNavigation,\n  ListNavigationInputs,\n  ListNavigationItem,\n} from '../behaviors/list-navigation/list-navigation';\nimport {\n  ListSelection,\n  ListSelectionInputs,\n  ListSelectionItem,\n} from '../behaviors/list-selection/list-selection';\nimport {SignalLike} from '../behaviors/signal-like/signal-like';\n\n/** The required inputs to tabs. */\nexport interface TabInputs extends ListNavigationItem, ListSelectionItem<string>, ListFocusItem {\n  tablist: SignalLike<TabListPattern>;\n  tabpanel: SignalLike<TabPanelPattern | undefined>;\n}\n\n/** A tab in a tablist. */\nexport class TabPattern {\n  /** A global unique identifier for the tab. */\n  id: SignalLike<string>;\n\n  /** A local unique identifier for the tab. */\n  value: SignalLike<string>;\n\n  /** Whether the tab is active. */\n  active = computed(() => this.tablist()?.focusManager.activeItem() === this);\n\n  /** Whether the tab is selected. */\n  selected = computed(() => this.tablist().selection.inputs.value().includes(this.value()));\n\n  /** A Tabpanel Id controlled by the tab. */\n  controls = computed(() => this.tabpanel()?.id());\n\n  /** Whether the tab is disabled. */\n  disabled: SignalLike<boolean>;\n\n  /** A reference to the parent tablist. */\n  tablist: SignalLike<TabListPattern>;\n\n  /** A reference to the corresponding tabpanel. */\n  tabpanel: SignalLike<TabPanelPattern | undefined>;\n\n  /** The tabindex of the tab. */\n  tabindex = computed(() => this.tablist().focusManager.getItemTabindex(this));\n\n  /** The html element that should receive focus. */\n  element: SignalLike<HTMLElement>;\n\n  constructor(inputs: TabInputs) {\n    this.id = inputs.id;\n    this.value = inputs.value;\n    this.tablist = inputs.tablist;\n    this.tabpanel = inputs.tabpanel;\n    this.element = inputs.element;\n    this.disabled = inputs.disabled;\n  }\n}\n\n/** The selection operations that the tablist can perform. */\ninterface SelectOptions {\n  select?: boolean;\n  toggle?: boolean;\n  toggleOne?: boolean;\n  selectOne?: boolean;\n}\n\n/** The required inputs for the tablist. */\nexport type TabListInputs = ListNavigationInputs<TabPattern> &\n  Omit<ListSelectionInputs<TabPattern, string>, 'multi'> &\n  ListFocusInputs<TabPattern> & {\n    disabled: SignalLike<boolean>;\n  };\n\n/** The required inputs for the tabpanel. */\nexport interface TabPanelInputs {\n  id: SignalLike<string>;\n  tab: SignalLike<TabPattern | undefined>;\n  value: SignalLike<string>;\n}\n\n/** A tabpanel associated with a tab. */\nexport class TabPanelPattern {\n  /** A global unique identifier for the tabpanel. */\n  id: SignalLike<string>;\n\n  /** A local unique identifier for the tabpanel. */\n  value: SignalLike<string>;\n\n  /** A reference to the corresponding tab. */\n  tab: SignalLike<TabPattern | undefined>;\n\n  /** Whether the tabpanel is hidden. */\n  hidden = computed(() => !this.tab()?.selected());\n\n  constructor(inputs: TabPanelInputs) {\n    this.id = inputs.id;\n    this.value = inputs.value;\n    this.tab = inputs.tab;\n  }\n}\n\n/** Controls the state of a tablist. */\nexport class TabListPattern {\n  /** Controls navigation for the tablist. */\n  navigation: ListNavigation<TabPattern>;\n\n  /** Controls selection for the tablist. */\n  selection: ListSelection<TabPattern, string>;\n\n  /** Controls focus for the tablist. */\n  focusManager: ListFocus<TabPattern>;\n\n  /** Whether the tablist is vertically or horizontally oriented. */\n  orientation: SignalLike<'vertical' | 'horizontal'>;\n\n  /** Whether the tablist is disabled. */\n  disabled: SignalLike<boolean>;\n\n  /** The tabindex of the tablist. */\n  tabindex = computed(() => this.focusManager.getListTabindex());\n\n  /** The id of the current active tab. */\n  activedescendant = computed(() => this.focusManager.getActiveDescendant());\n\n  /** Whether selection should follow focus. */\n  followFocus = computed(() => this.inputs.selectionMode() === 'follow');\n\n  /** The key used to navigate to the previous tab in the tablist. */\n  prevKey = computed(() => {\n    if (this.inputs.orientation() === 'vertical') {\n      return 'ArrowUp';\n    }\n    return this.inputs.textDirection() === 'rtl' ? 'ArrowRight' : 'ArrowLeft';\n  });\n\n  /** The key used to navigate to the next item in the list. */\n  nextKey = computed(() => {\n    if (this.inputs.orientation() === 'vertical') {\n      return 'ArrowDown';\n    }\n    return this.inputs.textDirection() === 'rtl' ? 'ArrowLeft' : 'ArrowRight';\n  });\n\n  /** The keydown event manager for the tablist. */\n  keydown = computed(() => {\n    const manager = new KeyboardEventManager()\n      .on(this.prevKey, () => this.prev({selectOne: this.followFocus()}))\n      .on(this.nextKey, () => this.next({selectOne: this.followFocus()}))\n      .on('Home', () => this.first({selectOne: this.followFocus()}))\n      .on('End', () => this.last({selectOne: this.followFocus()}))\n      .on(' ', () => this.selection.selectOne())\n      .on('Enter', () => this.selection.selectOne());\n\n    return manager;\n  });\n\n  /** The pointerdown event manager for the tablist. */\n  pointerdown = computed(() => {\n    return new PointerEventManager().on(e => this.goto(e, {selectOne: true}));\n  });\n\n  constructor(readonly inputs: TabListInputs) {\n    this.disabled = inputs.disabled;\n    this.orientation = inputs.orientation;\n\n    this.focusManager = new ListFocus(inputs);\n    this.navigation = new ListNavigation({...inputs, focusManager: this.focusManager});\n    this.selection = new ListSelection({\n      ...inputs,\n      multi: signal(false),\n      focusManager: this.focusManager,\n    });\n  }\n\n  /** Handles keydown events for the tablist. */\n  onKeydown(event: KeyboardEvent) {\n    if (!this.disabled()) {\n      this.keydown().handle(event);\n    }\n  }\n\n  /** The pointerdown event manager for the tablist. */\n  onPointerdown(event: PointerEvent) {\n    if (!this.disabled()) {\n      this.pointerdown().handle(event);\n    }\n  }\n\n  /** Navigates to the first option in the tablist. */\n  first(opts?: SelectOptions) {\n    this.navigation.first();\n    this._updateSelection(opts);\n  }\n\n  /** Navigates to the last option in the tablist. */\n  last(opts?: SelectOptions) {\n    this.navigation.last();\n    this._updateSelection(opts);\n  }\n\n  /** Navigates to the next option in the tablist. */\n  next(opts?: SelectOptions) {\n    this.navigation.next();\n    this._updateSelection(opts);\n  }\n\n  /** Navigates to the previous option in the tablist. */\n  prev(opts?: SelectOptions) {\n    this.navigation.prev();\n    this._updateSelection(opts);\n  }\n\n  /** Navigates to the given item in the tablist. */\n  goto(event: PointerEvent, opts?: SelectOptions) {\n    const item = this._getItem(event);\n\n    if (item) {\n      this.navigation.goto(item);\n      this._updateSelection(opts);\n    }\n  }\n\n  /** Handles updating selection for the tablist. */\n  private _updateSelection(opts?: SelectOptions) {\n    if (opts?.select) {\n      this.selection.select();\n    }\n    if (opts?.toggle) {\n      this.selection.toggle();\n    }\n    if (opts?.toggleOne) {\n      this.selection.toggleOne();\n    }\n    if (opts?.selectOne) {\n      this.selection.selectOne();\n    }\n  }\n\n  private _getItem(e: PointerEvent) {\n    if (!(e.target instanceof HTMLElement)) {\n      return;\n    }\n\n    const element = e.target.closest('[role=\"tab\"]');\n    return this.inputs.items().find(i => i.element() === element);\n  }\n}\n"],"names":[],"mappings":"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"}