@@ -21,12 +21,6 @@ import {ClassInfo, classMap} from 'lit/directives/class-map.js';
2121import { EASING } from '../../internal/motion/animation.js' ;
2222import { mixinFocusable } from '../../labs/behaviors/focusable.js' ;
2323
24- /**
25- * Symbol for tabs to use to animate their indicators based off another tab's
26- * indicator.
27- */
28- const INDICATOR = Symbol ( 'indicator' ) ;
29-
3024/**
3125 * Symbol used by the tab bar to request a tab to animate its indicator from a
3226 * previously selected tab.
@@ -74,7 +68,7 @@ export class Tab extends tabBaseClass {
7468 */
7569 @property ( { type : Boolean , attribute : 'icon-only' } ) iconOnly = false ;
7670
77- @query ( '.indicator' ) readonly [ INDICATOR ] ! : HTMLElement | null ;
71+ @query ( '.indicator' ) private readonly indicator ! : HTMLElement | null ;
7872 @state ( ) protected fullWidthIndicator = false ;
7973 @queryAssignedNodes ( { flatten : true } )
8074 private readonly assignedDefaultNodes ! : Node [ ] ;
@@ -145,16 +139,16 @@ export class Tab extends tabBaseClass {
145139 }
146140
147141 [ ANIMATE_INDICATOR ] ( previousTab : Tab ) {
148- if ( ! this [ INDICATOR ] ) {
142+ if ( ! this . indicator ) {
149143 return ;
150144 }
151145
152- this [ INDICATOR ] . getAnimations ( ) . forEach ( ( a ) => {
146+ this . indicator . getAnimations ( ) . forEach ( ( a ) => {
153147 a . cancel ( ) ;
154148 } ) ;
155149 const frames = this . getKeyframes ( previousTab ) ;
156150 if ( frames !== null ) {
157- this [ INDICATOR ] . animate ( frames , {
151+ this . indicator . animate ( frames , {
158152 duration : 250 ,
159153 easing : EASING . EMPHASIZED ,
160154 } ) ;
@@ -169,10 +163,10 @@ export class Tab extends tabBaseClass {
169163
170164 const from : Keyframe = { } ;
171165 const fromRect =
172- previousTab [ INDICATOR ] ?. getBoundingClientRect ( ) ?? ( { } as DOMRect ) ;
166+ previousTab . indicator ?. getBoundingClientRect ( ) ?? ( { } as DOMRect ) ;
173167 const fromPos = fromRect . left ;
174168 const fromExtent = fromRect . width ;
175- const toRect = this [ INDICATOR ] ! . getBoundingClientRect ( ) ;
169+ const toRect = this . indicator ! . getBoundingClientRect ( ) ;
176170 const toPos = toRect . left ;
177171 const toExtent = toRect . width ;
178172 const scale = fromExtent / toExtent ;
0 commit comments