@@ -33,6 +33,8 @@ export default (): Rule => (host: Tree, context: SchematicContext) => {
3333 const update = new UpdateChanges ( __dirname , host , context ) ;
3434 const changes = new Map < string , FileChange [ ] > ( ) ;
3535 const htmlFiles = update . templateFiles ;
36+ const sassFiles = update . sassFiles ;
37+ let applyComment = false ;
3638
3739 const applyChanges = ( ) => {
3840 for ( const [ path , change ] of changes . entries ( ) ) {
@@ -43,6 +45,7 @@ export default (): Rule => (host: Tree, context: SchematicContext) => {
4345 . forEach ( c => buffer = c . apply ( buffer ) ) ;
4446
4547 host . overwrite ( path , buffer ) ;
48+ applyComment = true ;
4649 }
4750 } ;
4851
@@ -54,7 +57,7 @@ export default (): Rule => (host: Tree, context: SchematicContext) => {
5457 }
5558 } ;
5659
57- const isEmptyOrSpaces = ( str ) => str === null || str === '' || str === '\n' || str . match ( / ^ * $ / ) !== null ;
60+ const isEmptyOrSpaces = ( str ) => str === null || str === '' || str === '\n' || str === '\r\n' || str . match ( / ^ [ \r \n \t ] * * $ / ) !== null ;
5861
5962 // Replace the tabsType input with tabsAligment
6063 for ( const path of htmlFiles ) {
@@ -92,7 +95,6 @@ export default (): Rule => (host: Tree, context: SchematicContext) => {
9295 addChange ( file . url , new FileChange ( startTag . start , tabPanel , textToReplace , 'replace' ) ) ;
9396 } ) ;
9497
95-
9698 applyChanges ( ) ;
9799 changes . clear ( ) ;
98100
@@ -121,9 +123,15 @@ export default (): Rule => (host: Tree, context: SchematicContext) => {
121123 routerLinkText = ` ${ routerLink . name } ${ routerLink . value } ;
122124 }
123125
126+ let classText = '' ;
127+ if ( ( node . name === 'igx-tab-item' || node . name === 'igx-tab' ) && hasAttribute ( node , 'class' ) ) {
128+ const classAttr = getAttribute ( node , 'class' ) [ 0 ] . value ;
129+ classText = ! isEmptyOrSpaces ( classAttr ) ? ` class="${ classAttr } : '' ;
130+ }
131+
124132 if ( iconText || labelText || routerLinkText ) {
125133 // eslint-disable-next-line max-len
126- const tabHeader = `\n<${ comp . headerItem } ${ routerLinkText } ${ iconText } ${ labelText } ${ comp . headerItem } ;
134+ const tabHeader = `\n<${ comp . headerItem } ${ routerLinkText } ${ classText } ${ iconText } ${ labelText } ${ comp . headerItem } ;
127135 addChange ( file . url , new FileChange ( startTag . end , tabHeader ) ) ;
128136 }
129137 } ) ;
@@ -132,14 +140,26 @@ export default (): Rule => (host: Tree, context: SchematicContext) => {
132140 changes . clear ( ) ;
133141
134142 // Grab the content between <igx-tabs-group> and create a <igx-tab-content>
143+ // Also migrate class from igx-tabs-group to igx-tab-content, if any
135144 findElementNodes ( parseFile ( host , path ) , comp . tags )
136145 . map ( node => getSourceOffset ( node as Element ) )
137146 . forEach ( offset => {
138147 const tabHeader = offset . node . children . find ( c => ( c as Element ) . name === comp . headerItem ) ;
148+ let classAttrText = '' ;
149+ if ( offset . node . name === 'igx-tab-panel' || offset . node . name === 'igx-tabs-group' ) {
150+ const classAttr = hasAttribute ( offset . node , 'class' ) ? getAttribute ( offset . node , 'class' ) [ 0 ] . value : '' ;
151+ classAttrText = ! isEmptyOrSpaces ( classAttr ) ? ` class="${ classAttr } : '' ;
152+ }
153+
139154 if ( tabHeader ) {
140155 const content = offset . file . content . substring ( tabHeader . sourceSpan . end . offset , offset . endTag . start ) ;
141- if ( ! isEmptyOrSpaces ( content ) ) {
142- const tabPanel = `\n<${ comp . panelItem } ${ content } ${ comp . panelItem } ;
156+ // Since igx-tab-item tag is common for old and new igx-tabs
157+ // Check whether igx-tab-content is already present!
158+ const tabContentTag = new RegExp ( String . raw `${ comp . panelItem } ) ;
159+ const hasTabContent = content . match ( tabContentTag ) ;
160+
161+ if ( ( ! hasTabContent || hasTabContent . length === 0 ) && ! isEmptyOrSpaces ( content ) ) {
162+ const tabPanel = `\n<${ comp . panelItem } ${ classAttrText } ${ content } ${ comp . panelItem } ;
143163 addChange ( offset . file . url , new FileChange ( tabHeader . sourceSpan . end . offset , tabPanel , content , 'replace' ) ) ;
144164 }
145165 }
@@ -149,17 +169,51 @@ export default (): Rule => (host: Tree, context: SchematicContext) => {
149169 changes . clear ( ) ;
150170
151171 // Insert a comment indicating the change/replacement
152- findElementNodes ( parseFile ( host , path ) , comp . component ) .
153- map ( node => getSourceOffset ( node as Element ) ) .
154- forEach ( offset => {
155- const { startTag, file } = offset ;
156- // eslint-disable-next-line max-len
157- const commentText = `<!--NOTE: This component has been updated by Infragistics migration: v${ version } ;
158- addChange ( file . url , new FileChange ( startTag . start , commentText ) ) ;
159- } ) ;
172+ if ( applyComment ) {
173+ findElementNodes ( parseFile ( host , path ) , comp . component ) .
174+ map ( node => getSourceOffset ( node as Element ) ) .
175+ forEach ( offset => {
176+ const { startTag, file } = offset ;
177+ // eslint-disable-next-line max-len
178+ const commentText = `<!--NOTE: This component has been updated by Infragistics migration: v${ version } ;
179+ addChange ( file . url , new FileChange ( startTag . start , commentText ) ) ;
180+ } ) ;
160181
161- applyChanges ( ) ;
162- changes . clear ( ) ;
182+ applyChanges ( ) ;
183+ changes . clear ( ) ;
184+ }
185+ }
186+
187+ for ( const sassPath of sassFiles ) {
188+ const origContent = host . read ( sassPath ) . toString ( ) ;
189+ let newContent = origContent ;
190+ let changed = false ;
191+ for ( const item of comp . tags ) {
192+ const searchText = new RegExp ( String . raw `${ item } ) ;
193+ let replaceText = '' ;
194+ if ( comp . component === 'igx-tabs' ) {
195+ if ( item === 'igx-tab-item' ) {
196+ replaceText = comp . headerItem ;
197+ } else if ( item === 'igx-tabs-group' ) {
198+ replaceText = comp . panelItem ;
199+ }
200+ }
201+ if ( comp . component === 'igx-bottom-nav' ) {
202+ if ( item === 'igx-tab' ) {
203+ replaceText = comp . headerItem ;
204+ } else if ( item === 'igx-tab-panel' ) {
205+ replaceText = comp . panelItem ;
206+ }
207+ }
208+
209+ if ( searchText . test ( origContent ) ) {
210+ changed = true ;
211+ newContent = newContent . replace ( searchText , replaceText ) ;
212+ }
213+ }
214+ if ( changed ) {
215+ host . overwrite ( sassPath , newContent ) ;
216+ }
163217 }
164218 }
165219
0 commit comments