diff --git a/src/helpers/__tests__/__snapshots__/getDtsSnapshot.test.ts.snap b/src/helpers/__tests__/__snapshots__/getDtsSnapshot.test.ts.snap index 92ae0af..ad5a79c 100644 --- a/src/helpers/__tests__/__snapshots__/getDtsSnapshot.test.ts.snap +++ b/src/helpers/__tests__/__snapshots__/getDtsSnapshot.test.ts.snap @@ -10,35 +10,30 @@ exports[`helpers / cssSnapshots with a custom renderer should process a file and `; exports[`helpers / cssSnapshots with allowUnknownClassnames enabled should return a dts file that allows any string value 1`] = ` -"declare let _classes: { - 'localClassInsideGlobal': string; - 'localClass': string; - 'localClass2': string; - 'localClassInsideLocal': string; - 'reservedWords': string; - 'default': string; - 'const': string; - 'nestedClassParent': string; - 'childClass': string; - 'nestedClassParentExtended': string; - 'section1': string; - 'section2': string; - 'section3': string; - 'section4': string; - 'section5': string; - 'section6': string; - 'section7': string; - 'section8': string; - 'section9': string; - 'classWithMixin': string; - 'appLogo': string; - 'appLogo': string; - 'myAnimation': string; - 'myFolderIndex': string; - [key: string]: string; -}; -export default _classes; -export let localClassInsideGlobal: string; +"interface classes { }; declare let _classes: classes; interface classes { 'localClassInsideGlobal': string; }; + interface classes { 'localClass': string; }; + interface classes { 'localClass2': string; }; + interface classes { 'localClassInsideLocal': string; }; + interface classes { 'reservedWords': string; }; + interface classes { 'default': string; }; + interface classes { 'const': string; }; + interface classes { 'nestedClassParent': string; }; + interface classes { 'childClass': string; }; + interface classes { 'nestedClassParentExtended': string; }; + interface classes { 'section1': string; }; + interface classes { 'section2': string; }; + interface classes { 'section3': string; }; + interface classes { 'section4': string; }; + interface classes { 'section5': string; }; + interface classes { 'section6': string; }; + interface classes { 'section7': string; }; + interface classes { 'section8': string; }; + interface classes { 'section9': string; }; + interface classes { 'classWithMixin': string; }; + interface classes { 'appLogo': string; }; + interface classes { 'appLogo': string; }; + interface classes { 'myAnimation': string; }; + interface classes { 'myFolderIndex': string; };export let localClassInsideGlobal: string; export let localClass: string; export let localClass2: string; export let localClassInsideLocal: string; @@ -60,7 +55,11 @@ export let appLogo: string; export let appLogo: string; export let myAnimation: string; export let myFolderIndex: string; -" + + interface classes { [key: string]: string }; + + export default _classes; + " `; exports[`helpers / cssSnapshots with baseUrl and paths in compilerOptions sass should find the files 1`] = ` @@ -72,105 +71,85 @@ exports[`helpers / cssSnapshots with baseUrl and paths in compilerOptions sass s `; exports[`helpers / cssSnapshots with file 'empty.module.less' createExports should create an exports file 1`] = ` -"declare let _classes: { - -}; -export default _classes; -" +"interface classes { }; declare let _classes: classes; + export default _classes; + " `; exports[`helpers / cssSnapshots with file 'empty.module.less' getCssExports should return an object matching expected CSS 1`] = `{}`; exports[`helpers / cssSnapshots with file 'empty.module.less' with a custom template should transform the generated dts 1`] = ` "/* eslint-disable */ -declare let _classes: { - -}; -export default _classes; - +interface classes { }; declare let _classes: classes; + export default _classes; + export const __cssModule: true; export type AllClassNames = '';" `; exports[`helpers / cssSnapshots with file 'empty.module.sass' createExports should create an exports file 1`] = ` -"declare let _classes: { - -}; -export default _classes; -" +"interface classes { }; declare let _classes: classes; + export default _classes; + " `; exports[`helpers / cssSnapshots with file 'empty.module.sass' getCssExports should return an object matching expected CSS 1`] = `{}`; exports[`helpers / cssSnapshots with file 'empty.module.sass' with a custom template should transform the generated dts 1`] = ` "/* eslint-disable */ -declare let _classes: { - -}; -export default _classes; - +interface classes { }; declare let _classes: classes; + export default _classes; + export const __cssModule: true; export type AllClassNames = '';" `; exports[`helpers / cssSnapshots with file 'empty.module.scss' createExports should create an exports file 1`] = ` -"declare let _classes: { - -}; -export default _classes; -" +"interface classes { }; declare let _classes: classes; + export default _classes; + " `; exports[`helpers / cssSnapshots with file 'empty.module.scss' getCssExports should return an object matching expected CSS 1`] = `{}`; exports[`helpers / cssSnapshots with file 'empty.module.scss' with a custom template should transform the generated dts 1`] = ` "/* eslint-disable */ -declare let _classes: { - -}; -export default _classes; - +interface classes { }; declare let _classes: classes; + export default _classes; + export const __cssModule: true; export type AllClassNames = '';" `; exports[`helpers / cssSnapshots with file 'empty.module.styl' createExports should create an exports file 1`] = ` -"declare let _classes: { - -}; -export default _classes; -" +"interface classes { }; declare let _classes: classes; + export default _classes; + " `; exports[`helpers / cssSnapshots with file 'empty.module.styl' getCssExports should return an object matching expected CSS 1`] = `{}`; exports[`helpers / cssSnapshots with file 'empty.module.styl' with a custom template should transform the generated dts 1`] = ` "/* eslint-disable */ -declare let _classes: { - -}; -export default _classes; - +interface classes { }; declare let _classes: classes; + export default _classes; + export const __cssModule: true; export type AllClassNames = '';" `; exports[`helpers / cssSnapshots with file 'import.module.css' createExports should create an exports file 1`] = ` -"declare let _classes: { - 'classA': string; - 'ClassB': string; - 'class-c': string; - 'class_d': string; - 'parent': string; - 'childA': string; - 'childB': string; - 'nestedChild': string; - 'composed': string; - 'composed-from-other-file': string; - 'fadeIn': string; -}; -export default _classes; -export let classA: string; +"interface classes { }; declare let _classes: classes; interface classes { 'classA': string; }; + interface classes { 'ClassB': string; }; + interface classes { 'class-c': string; }; + interface classes { 'class_d': string; }; + interface classes { 'parent': string; }; + interface classes { 'childA': string; }; + interface classes { 'childB': string; }; + interface classes { 'nestedChild': string; }; + interface classes { 'composed': string; }; + interface classes { 'composed-from-other-file': string; }; + interface classes { 'fadeIn': string; };export let classA: string; export let ClassB: string; export let class_d: string; export let parent: string; @@ -179,7 +158,9 @@ export let childB: string; export let nestedChild: string; export let composed: string; export let fadeIn: string; -" + + export default _classes; + " `; exports[`helpers / cssSnapshots with file 'import.module.css' getCssExports should return an object matching expected CSS 1`] = ` @@ -200,21 +181,17 @@ exports[`helpers / cssSnapshots with file 'import.module.css' getCssExports shou exports[`helpers / cssSnapshots with file 'import.module.css' with a custom template should transform the generated dts 1`] = ` "/* eslint-disable */ -declare let _classes: { - 'classA': string; - 'ClassB': string; - 'class-c': string; - 'class_d': string; - 'parent': string; - 'childA': string; - 'childB': string; - 'nestedChild': string; - 'composed': string; - 'composed-from-other-file': string; - 'fadeIn': string; -}; -export default _classes; -export let classA: string; +interface classes { }; declare let _classes: classes; interface classes { 'classA': string; }; + interface classes { 'ClassB': string; }; + interface classes { 'class-c': string; }; + interface classes { 'class_d': string; }; + interface classes { 'parent': string; }; + interface classes { 'childA': string; }; + interface classes { 'childB': string; }; + interface classes { 'nestedChild': string; }; + interface classes { 'composed': string; }; + interface classes { 'composed-from-other-file': string; }; + interface classes { 'fadeIn': string; };export let classA: string; export let ClassB: string; export let class_d: string; export let parent: string; @@ -224,25 +201,25 @@ export let nestedChild: string; export let composed: string; export let fadeIn: string; + export default _classes; + export const __cssModule: true; export type AllClassNames = 'classA' | 'ClassB' | 'class-c' | 'class_d' | 'parent' | 'childA' | 'childB' | 'nestedChild' | 'composed' | 'composed-from-other-file' | 'fadeIn';" `; exports[`helpers / cssSnapshots with file 'import.module.less' createExports should create an exports file 1`] = ` -"declare let _classes: { - 'nested-class-parent': string; - 'child-class': string; - 'selector-blue': string; - 'selector-green': string; - 'selector-red': string; - 'column-1': string; - 'column-2': string; - 'column-3': string; - 'column-4': string; - 'color-set': string; -}; -export default _classes; -" +"interface classes { }; declare let _classes: classes; interface classes { 'nested-class-parent': string; }; + interface classes { 'child-class': string; }; + interface classes { 'selector-blue': string; }; + interface classes { 'selector-green': string; }; + interface classes { 'selector-red': string; }; + interface classes { 'column-1': string; }; + interface classes { 'column-2': string; }; + interface classes { 'column-3': string; }; + interface classes { 'column-4': string; }; + interface classes { 'color-set': string; }; + export default _classes; + " `; exports[`helpers / cssSnapshots with file 'import.module.less' getCssExports should return an object matching expected CSS 1`] = ` @@ -262,42 +239,38 @@ exports[`helpers / cssSnapshots with file 'import.module.less' getCssExports sho exports[`helpers / cssSnapshots with file 'import.module.less' with a custom template should transform the generated dts 1`] = ` "/* eslint-disable */ -declare let _classes: { - 'nested-class-parent': string; - 'child-class': string; - 'selector-blue': string; - 'selector-green': string; - 'selector-red': string; - 'column-1': string; - 'column-2': string; - 'column-3': string; - 'column-4': string; - 'color-set': string; -}; -export default _classes; - +interface classes { }; declare let _classes: classes; interface classes { 'nested-class-parent': string; }; + interface classes { 'child-class': string; }; + interface classes { 'selector-blue': string; }; + interface classes { 'selector-green': string; }; + interface classes { 'selector-red': string; }; + interface classes { 'column-1': string; }; + interface classes { 'column-2': string; }; + interface classes { 'column-3': string; }; + interface classes { 'column-4': string; }; + interface classes { 'color-set': string; }; + export default _classes; + export const __cssModule: true; export type AllClassNames = 'nested-class-parent' | 'child-class' | 'selector-blue' | 'selector-green' | 'selector-red' | 'column-1' | 'column-2' | 'column-3' | 'column-4' | 'color-set';" `; exports[`helpers / cssSnapshots with file 'import.module.styl' createExports should create an exports file 1`] = ` -"declare let _classes: { - 'foo': string; - 'bar': string; - 'baz': string; - 'col-1': string; - 'col-2': string; - 'col-3': string; - 'local-class-1': string; - 'inside-local': string; - 'inside-1-name-2': string; - 'inside-2-name-1': string; -}; -export default _classes; -export let foo: string; +"interface classes { }; declare let _classes: classes; interface classes { 'foo': string; }; + interface classes { 'bar': string; }; + interface classes { 'baz': string; }; + interface classes { 'col-1': string; }; + interface classes { 'col-2': string; }; + interface classes { 'col-3': string; }; + interface classes { 'local-class-1': string; }; + interface classes { 'inside-local': string; }; + interface classes { 'inside-1-name-2': string; }; + interface classes { 'inside-2-name-1': string; };export let foo: string; export let bar: string; export let baz: string; -" + + export default _classes; + " `; exports[`helpers / cssSnapshots with file 'import.module.styl' getCssExports should return an object matching expected CSS 1`] = ` @@ -317,43 +290,39 @@ exports[`helpers / cssSnapshots with file 'import.module.styl' getCssExports sho exports[`helpers / cssSnapshots with file 'import.module.styl' with a custom template should transform the generated dts 1`] = ` "/* eslint-disable */ -declare let _classes: { - 'foo': string; - 'bar': string; - 'baz': string; - 'col-1': string; - 'col-2': string; - 'col-3': string; - 'local-class-1': string; - 'inside-local': string; - 'inside-1-name-2': string; - 'inside-2-name-1': string; -}; -export default _classes; -export let foo: string; +interface classes { }; declare let _classes: classes; interface classes { 'foo': string; }; + interface classes { 'bar': string; }; + interface classes { 'baz': string; }; + interface classes { 'col-1': string; }; + interface classes { 'col-2': string; }; + interface classes { 'col-3': string; }; + interface classes { 'local-class-1': string; }; + interface classes { 'inside-local': string; }; + interface classes { 'inside-1-name-2': string; }; + interface classes { 'inside-2-name-1': string; };export let foo: string; export let bar: string; export let baz: string; + export default _classes; + export const __cssModule: true; export type AllClassNames = 'foo' | 'bar' | 'baz' | 'col-1' | 'col-2' | 'col-3' | 'local-class-1' | 'inside-local' | 'inside-1-name-2' | 'inside-2-name-1';" `; exports[`helpers / cssSnapshots with file 'postcss.module.css' createExports should create an exports file 1`] = ` -"declare let _classes: { - 'classA': string; - 'nestedA': string; - 'nested_B': string; - 'deeplyNested': string; - 'nested-c': string; - 'parent': string; -}; -export default _classes; -export let classA: string; +"interface classes { }; declare let _classes: classes; interface classes { 'classA': string; }; + interface classes { 'nestedA': string; }; + interface classes { 'nested_B': string; }; + interface classes { 'deeplyNested': string; }; + interface classes { 'nested-c': string; }; + interface classes { 'parent': string; };export let classA: string; export let nestedA: string; export let nested_B: string; export let deeplyNested: string; export let parent: string; -" + + export default _classes; + " `; exports[`helpers / cssSnapshots with file 'postcss.module.css' getCssExports should return an object matching expected CSS 1`] = ` @@ -369,41 +338,35 @@ exports[`helpers / cssSnapshots with file 'postcss.module.css' getCssExports sho exports[`helpers / cssSnapshots with file 'postcss.module.css' with a custom template should transform the generated dts 1`] = ` "/* eslint-disable */ -declare let _classes: { - 'classA': string; - 'nestedA': string; - 'nested_B': string; - 'deeplyNested': string; - 'nested-c': string; - 'parent': string; -}; -export default _classes; -export let classA: string; +interface classes { }; declare let _classes: classes; interface classes { 'classA': string; }; + interface classes { 'nestedA': string; }; + interface classes { 'nested_B': string; }; + interface classes { 'deeplyNested': string; }; + interface classes { 'nested-c': string; }; + interface classes { 'parent': string; };export let classA: string; export let nestedA: string; export let nested_B: string; export let deeplyNested: string; export let parent: string; + export default _classes; + export const __cssModule: true; export type AllClassNames = 'classA' | 'nestedA' | 'nested_B' | 'deeplyNested' | 'nested-c' | 'parent';" `; exports[`helpers / cssSnapshots with file 'test.module.css' createExports should create an exports file 1`] = ` -"declare let _classes: { - 'classA': string; - 'ClassB': string; - 'class-c': string; - 'class_d': string; - 'parent': string; - 'childA': string; - 'childB': string; - 'nestedChild': string; - 'composed': string; - 'composed-from-other-file': string; - 'fadeIn': string; -}; -export default _classes; -export let classA: string; +"interface classes { }; declare let _classes: classes; interface classes { 'classA': string; }; + interface classes { 'ClassB': string; }; + interface classes { 'class-c': string; }; + interface classes { 'class_d': string; }; + interface classes { 'parent': string; }; + interface classes { 'childA': string; }; + interface classes { 'childB': string; }; + interface classes { 'nestedChild': string; }; + interface classes { 'composed': string; }; + interface classes { 'composed-from-other-file': string; }; + interface classes { 'fadeIn': string; };export let classA: string; export let ClassB: string; export let class_d: string; export let parent: string; @@ -412,7 +375,9 @@ export let childB: string; export let nestedChild: string; export let composed: string; export let fadeIn: string; -" + + export default _classes; + " `; exports[`helpers / cssSnapshots with file 'test.module.css' getCssExports should return an object matching expected CSS 1`] = ` @@ -433,21 +398,17 @@ exports[`helpers / cssSnapshots with file 'test.module.css' getCssExports should exports[`helpers / cssSnapshots with file 'test.module.css' with a custom template should transform the generated dts 1`] = ` "/* eslint-disable */ -declare let _classes: { - 'classA': string; - 'ClassB': string; - 'class-c': string; - 'class_d': string; - 'parent': string; - 'childA': string; - 'childB': string; - 'nestedChild': string; - 'composed': string; - 'composed-from-other-file': string; - 'fadeIn': string; -}; -export default _classes; -export let classA: string; +interface classes { }; declare let _classes: classes; interface classes { 'classA': string; }; + interface classes { 'ClassB': string; }; + interface classes { 'class-c': string; }; + interface classes { 'class_d': string; }; + interface classes { 'parent': string; }; + interface classes { 'childA': string; }; + interface classes { 'childB': string; }; + interface classes { 'nestedChild': string; }; + interface classes { 'composed': string; }; + interface classes { 'composed-from-other-file': string; }; + interface classes { 'fadeIn': string; };export let classA: string; export let ClassB: string; export let class_d: string; export let parent: string; @@ -457,25 +418,25 @@ export let nestedChild: string; export let composed: string; export let fadeIn: string; + export default _classes; + export const __cssModule: true; export type AllClassNames = 'classA' | 'ClassB' | 'class-c' | 'class_d' | 'parent' | 'childA' | 'childB' | 'nestedChild' | 'composed' | 'composed-from-other-file' | 'fadeIn';" `; exports[`helpers / cssSnapshots with file 'test.module.less' createExports should create an exports file 1`] = ` -"declare let _classes: { - 'nested-class-parent': string; - 'child-class': string; - 'selector-blue': string; - 'selector-green': string; - 'selector-red': string; - 'column-1': string; - 'column-2': string; - 'column-3': string; - 'column-4': string; - 'color-set': string; -}; -export default _classes; -" +"interface classes { }; declare let _classes: classes; interface classes { 'nested-class-parent': string; }; + interface classes { 'child-class': string; }; + interface classes { 'selector-blue': string; }; + interface classes { 'selector-green': string; }; + interface classes { 'selector-red': string; }; + interface classes { 'column-1': string; }; + interface classes { 'column-2': string; }; + interface classes { 'column-3': string; }; + interface classes { 'column-4': string; }; + interface classes { 'color-set': string; }; + export default _classes; + " `; exports[`helpers / cssSnapshots with file 'test.module.less' getCssExports should return an object matching expected CSS 1`] = ` @@ -495,49 +456,45 @@ exports[`helpers / cssSnapshots with file 'test.module.less' getCssExports shoul exports[`helpers / cssSnapshots with file 'test.module.less' with a custom template should transform the generated dts 1`] = ` "/* eslint-disable */ -declare let _classes: { - 'nested-class-parent': string; - 'child-class': string; - 'selector-blue': string; - 'selector-green': string; - 'selector-red': string; - 'column-1': string; - 'column-2': string; - 'column-3': string; - 'column-4': string; - 'color-set': string; -}; -export default _classes; - +interface classes { }; declare let _classes: classes; interface classes { 'nested-class-parent': string; }; + interface classes { 'child-class': string; }; + interface classes { 'selector-blue': string; }; + interface classes { 'selector-green': string; }; + interface classes { 'selector-red': string; }; + interface classes { 'column-1': string; }; + interface classes { 'column-2': string; }; + interface classes { 'column-3': string; }; + interface classes { 'column-4': string; }; + interface classes { 'color-set': string; }; + export default _classes; + export const __cssModule: true; export type AllClassNames = 'nested-class-parent' | 'child-class' | 'selector-blue' | 'selector-green' | 'selector-red' | 'column-1' | 'column-2' | 'column-3' | 'column-4' | 'color-set';" `; exports[`helpers / cssSnapshots with file 'test.module.sass' createExports should create an exports file 1`] = ` -"declare let _classes: { - 'local-class-inside-global': string; - 'local-class': string; - 'local-class-2': string; - 'local-class-inside-local': string; - 'reserved-words': string; - 'default': string; - 'const': string; - 'nested-class-parent': string; - 'child-class': string; - 'nested-class-parent--extended': string; - 'section-1': string; - 'section-2': string; - 'section-3': string; - 'section-4': string; - 'section-5': string; - 'section-6': string; - 'section-7': string; - 'section-8': string; - 'section-9': string; - 'class-with-mixin': string; -}; -export default _classes; -" +"interface classes { }; declare let _classes: classes; interface classes { 'local-class-inside-global': string; }; + interface classes { 'local-class': string; }; + interface classes { 'local-class-2': string; }; + interface classes { 'local-class-inside-local': string; }; + interface classes { 'reserved-words': string; }; + interface classes { 'default': string; }; + interface classes { 'const': string; }; + interface classes { 'nested-class-parent': string; }; + interface classes { 'child-class': string; }; + interface classes { 'nested-class-parent--extended': string; }; + interface classes { 'section-1': string; }; + interface classes { 'section-2': string; }; + interface classes { 'section-3': string; }; + interface classes { 'section-4': string; }; + interface classes { 'section-5': string; }; + interface classes { 'section-6': string; }; + interface classes { 'section-7': string; }; + interface classes { 'section-8': string; }; + interface classes { 'section-9': string; }; + interface classes { 'class-with-mixin': string; }; + export default _classes; + " `; exports[`helpers / cssSnapshots with file 'test.module.sass' getCssExports should return an object matching expected CSS 1`] = ` @@ -567,64 +524,60 @@ exports[`helpers / cssSnapshots with file 'test.module.sass' getCssExports shoul exports[`helpers / cssSnapshots with file 'test.module.sass' with a custom template should transform the generated dts 1`] = ` "/* eslint-disable */ -declare let _classes: { - 'local-class-inside-global': string; - 'local-class': string; - 'local-class-2': string; - 'local-class-inside-local': string; - 'reserved-words': string; - 'default': string; - 'const': string; - 'nested-class-parent': string; - 'child-class': string; - 'nested-class-parent--extended': string; - 'section-1': string; - 'section-2': string; - 'section-3': string; - 'section-4': string; - 'section-5': string; - 'section-6': string; - 'section-7': string; - 'section-8': string; - 'section-9': string; - 'class-with-mixin': string; -}; -export default _classes; - +interface classes { }; declare let _classes: classes; interface classes { 'local-class-inside-global': string; }; + interface classes { 'local-class': string; }; + interface classes { 'local-class-2': string; }; + interface classes { 'local-class-inside-local': string; }; + interface classes { 'reserved-words': string; }; + interface classes { 'default': string; }; + interface classes { 'const': string; }; + interface classes { 'nested-class-parent': string; }; + interface classes { 'child-class': string; }; + interface classes { 'nested-class-parent--extended': string; }; + interface classes { 'section-1': string; }; + interface classes { 'section-2': string; }; + interface classes { 'section-3': string; }; + interface classes { 'section-4': string; }; + interface classes { 'section-5': string; }; + interface classes { 'section-6': string; }; + interface classes { 'section-7': string; }; + interface classes { 'section-8': string; }; + interface classes { 'section-9': string; }; + interface classes { 'class-with-mixin': string; }; + export default _classes; + export const __cssModule: true; export type AllClassNames = 'local-class-inside-global' | 'local-class' | 'local-class-2' | 'local-class-inside-local' | 'reserved-words' | 'default' | 'const' | 'nested-class-parent' | 'child-class' | 'nested-class-parent--extended' | 'section-1' | 'section-2' | 'section-3' | 'section-4' | 'section-5' | 'section-6' | 'section-7' | 'section-8' | 'section-9' | 'class-with-mixin';" `; exports[`helpers / cssSnapshots with file 'test.module.scss' createExports should create an exports file 1`] = ` -"declare let _classes: { - 'local-class-inside-global': string; - 'local-class': string; - 'local-class-2': string; - 'local-class-inside-local': string; - 'reserved-words': string; - 'default': string; - 'const': string; - 'nested-class-parent': string; - 'child-class': string; - 'nested-class-parent--extended': string; - 'section-1': string; - 'section-2': string; - 'section-3': string; - 'section-4': string; - 'section-5': string; - 'section-6': string; - 'section-7': string; - 'section-8': string; - 'section-9': string; - 'class-with-mixin': string; - 'App_logo': string; - 'App-logo': string; - 'my-animation': string; - 'my-folder-index': string; -}; -export default _classes; -export let App_logo: string; -" +"interface classes { }; declare let _classes: classes; interface classes { 'local-class-inside-global': string; }; + interface classes { 'local-class': string; }; + interface classes { 'local-class-2': string; }; + interface classes { 'local-class-inside-local': string; }; + interface classes { 'reserved-words': string; }; + interface classes { 'default': string; }; + interface classes { 'const': string; }; + interface classes { 'nested-class-parent': string; }; + interface classes { 'child-class': string; }; + interface classes { 'nested-class-parent--extended': string; }; + interface classes { 'section-1': string; }; + interface classes { 'section-2': string; }; + interface classes { 'section-3': string; }; + interface classes { 'section-4': string; }; + interface classes { 'section-5': string; }; + interface classes { 'section-6': string; }; + interface classes { 'section-7': string; }; + interface classes { 'section-8': string; }; + interface classes { 'section-9': string; }; + interface classes { 'class-with-mixin': string; }; + interface classes { 'App_logo': string; }; + interface classes { 'App-logo': string; }; + interface classes { 'my-animation': string; }; + interface classes { 'my-folder-index': string; };export let App_logo: string; + + export default _classes; + " `; exports[`helpers / cssSnapshots with file 'test.module.scss' getCssExports should return an object matching expected CSS 1`] = ` @@ -658,57 +611,53 @@ exports[`helpers / cssSnapshots with file 'test.module.scss' getCssExports shoul exports[`helpers / cssSnapshots with file 'test.module.scss' with a custom template should transform the generated dts 1`] = ` "/* eslint-disable */ -declare let _classes: { - 'local-class-inside-global': string; - 'local-class': string; - 'local-class-2': string; - 'local-class-inside-local': string; - 'reserved-words': string; - 'default': string; - 'const': string; - 'nested-class-parent': string; - 'child-class': string; - 'nested-class-parent--extended': string; - 'section-1': string; - 'section-2': string; - 'section-3': string; - 'section-4': string; - 'section-5': string; - 'section-6': string; - 'section-7': string; - 'section-8': string; - 'section-9': string; - 'class-with-mixin': string; - 'App_logo': string; - 'App-logo': string; - 'my-animation': string; - 'my-folder-index': string; -}; -export default _classes; -export let App_logo: string; - +interface classes { }; declare let _classes: classes; interface classes { 'local-class-inside-global': string; }; + interface classes { 'local-class': string; }; + interface classes { 'local-class-2': string; }; + interface classes { 'local-class-inside-local': string; }; + interface classes { 'reserved-words': string; }; + interface classes { 'default': string; }; + interface classes { 'const': string; }; + interface classes { 'nested-class-parent': string; }; + interface classes { 'child-class': string; }; + interface classes { 'nested-class-parent--extended': string; }; + interface classes { 'section-1': string; }; + interface classes { 'section-2': string; }; + interface classes { 'section-3': string; }; + interface classes { 'section-4': string; }; + interface classes { 'section-5': string; }; + interface classes { 'section-6': string; }; + interface classes { 'section-7': string; }; + interface classes { 'section-8': string; }; + interface classes { 'section-9': string; }; + interface classes { 'class-with-mixin': string; }; + interface classes { 'App_logo': string; }; + interface classes { 'App-logo': string; }; + interface classes { 'my-animation': string; }; + interface classes { 'my-folder-index': string; };export let App_logo: string; + + export default _classes; + export const __cssModule: true; export type AllClassNames = 'local-class-inside-global' | 'local-class' | 'local-class-2' | 'local-class-inside-local' | 'reserved-words' | 'default' | 'const' | 'nested-class-parent' | 'child-class' | 'nested-class-parent--extended' | 'section-1' | 'section-2' | 'section-3' | 'section-4' | 'section-5' | 'section-6' | 'section-7' | 'section-8' | 'section-9' | 'class-with-mixin' | 'App_logo' | 'App-logo' | 'my-animation' | 'my-folder-index';" `; exports[`helpers / cssSnapshots with file 'test.module.styl' createExports should create an exports file 1`] = ` -"declare let _classes: { - 'foo': string; - 'bar': string; - 'baz': string; - 'col-1': string; - 'col-2': string; - 'col-3': string; - 'local-class-1': string; - 'inside-local': string; - 'inside-1-name-2': string; - 'inside-2-name-1': string; -}; -export default _classes; -export let foo: string; +"interface classes { }; declare let _classes: classes; interface classes { 'foo': string; }; + interface classes { 'bar': string; }; + interface classes { 'baz': string; }; + interface classes { 'col-1': string; }; + interface classes { 'col-2': string; }; + interface classes { 'col-3': string; }; + interface classes { 'local-class-1': string; }; + interface classes { 'inside-local': string; }; + interface classes { 'inside-1-name-2': string; }; + interface classes { 'inside-2-name-1': string; };export let foo: string; export let bar: string; export let baz: string; -" + + export default _classes; + " `; exports[`helpers / cssSnapshots with file 'test.module.styl' getCssExports should return an object matching expected CSS 1`] = ` @@ -728,57 +677,55 @@ exports[`helpers / cssSnapshots with file 'test.module.styl' getCssExports shoul exports[`helpers / cssSnapshots with file 'test.module.styl' with a custom template should transform the generated dts 1`] = ` "/* eslint-disable */ -declare let _classes: { - 'foo': string; - 'bar': string; - 'baz': string; - 'col-1': string; - 'col-2': string; - 'col-3': string; - 'local-class-1': string; - 'inside-local': string; - 'inside-1-name-2': string; - 'inside-2-name-1': string; -}; -export default _classes; -export let foo: string; +interface classes { }; declare let _classes: classes; interface classes { 'foo': string; }; + interface classes { 'bar': string; }; + interface classes { 'baz': string; }; + interface classes { 'col-1': string; }; + interface classes { 'col-2': string; }; + interface classes { 'col-3': string; }; + interface classes { 'local-class-1': string; }; + interface classes { 'inside-local': string; }; + interface classes { 'inside-1-name-2': string; }; + interface classes { 'inside-2-name-1': string; };export let foo: string; export let bar: string; export let baz: string; + export default _classes; + export const __cssModule: true; export type AllClassNames = 'foo' | 'bar' | 'baz' | 'col-1' | 'col-2' | 'col-3' | 'local-class-1' | 'inside-local' | 'inside-1-name-2' | 'inside-2-name-1';" `; exports[`helpers / cssSnapshots with goToDefinition enabled with CSS should return a line-accurate dts file 1`] = ` -"export let classA: string;export let composed: string;export let composedFromOtherFile: string; +"interface classes { }; declare let _classes: classes; export let classA: string;interface classes { 'classA': string; };export let composed: string;interface classes { 'composed': string; };export let composedFromOtherFile: string;interface classes { 'composedFromOtherFile': string; }; -export let classB: string; +export let classB: string;interface classes { 'classB': string; }; -export let classC: string; +export let classC: string;interface classes { 'classC': string; }; -export let classD: string; +export let classD: string;interface classes { 'classD': string; }; -export let parent: string;export let childA: string; +export let parent: string;interface classes { 'parent': string; };export let childA: string;interface classes { 'childA': string; }; -export let childB: string;export let nestedChild: string; +export let childB: string;interface classes { 'childB': string; };export let nestedChild: string;interface classes { 'nestedChild': string; }; -export let fadeIn: string; +export let fadeIn: string;interface classes { 'fadeIn': string; }; @@ -791,21 +738,9 @@ export let fadeIn: string; -declare let _classes: { - 'classA': string; - 'classB': string; - 'classC': string; - 'classD': string; - 'parent': string; - 'childA': string; - 'childB': string; - 'nestedChild': string; - 'composed': string; - 'composedFromOtherFile': string; - 'fadeIn': string; -}; -export default _classes; -" + + export default _classes; + " `; exports[`helpers / cssSnapshots with goToDefinition enabled with CSS should return an object with classes, css, and a source map 1`] = ` @@ -926,7 +861,8 @@ exports[`helpers / cssSnapshots with goToDefinition enabled with CSS should retu `; exports[`helpers / cssSnapshots with goToDefinition enabled with Less should return a line-accurate dts file 1`] = ` -"export let nestedClassParent: string;export let childClass: string; +"interface classes { }; declare let _classes: classes; export let nestedClassParent: string;interface classes { 'nestedClassParent': string; };export let childClass: string;interface classes { 'childClass': string; }; + @@ -936,14 +872,14 @@ exports[`helpers / cssSnapshots with goToDefinition enabled with Less should ret +export let selectorBlue: string;interface classes { 'selectorBlue': string; };export let selectorGreen: string;interface classes { 'selectorGreen': string; };export let selectorRed: string;interface classes { 'selectorRed': string; }; -export let selectorBlue: string;export let selectorGreen: string;export let selectorRed: string; +export let column1: string;interface classes { 'column1': string; };export let column2: string;interface classes { 'column2': string; };export let column3: string;interface classes { 'column3': string; };export let column4: string;interface classes { 'column4': string; }; -export let column1: string;export let column2: string;export let column3: string;export let column4: string; @@ -954,25 +890,13 @@ export let column1: string;export let column2: string;export let column3: string +export let colorSet: string;interface classes { 'colorSet': string; }; -export let colorSet: string; -declare let _classes: { - 'nestedClassParent': string; - 'childClass': string; - 'selectorBlue': string; - 'selectorGreen': string; - 'selectorRed': string; - 'column1': string; - 'column2': string; - 'column3': string; - 'column4': string; - 'colorSet': string; -}; -export default _classes; -" + export default _classes; + " `; exports[`helpers / cssSnapshots with goToDefinition enabled with Less should return an object with classes, css, and a source map 1`] = ` @@ -1037,66 +961,67 @@ exports[`helpers / cssSnapshots with goToDefinition enabled with Less should ret `; exports[`helpers / cssSnapshots with goToDefinition enabled with Sass should return a line-accurate dts file 1`] = ` -" +"interface classes { }; declare let _classes: classes; -export let myFolderIndex: string; +export let myFolderIndex: string;interface classes { 'myFolderIndex': string; }; -export let localClassInsideGlobal: string; +export let localClassInsideGlobal: string;interface classes { 'localClassInsideGlobal': string; }; -export let localClass: string; +export let localClass: string;interface classes { 'localClass': string; }; -export let localClass2: string;export let localClassInsideLocal: string; +export let localClass2: string;interface classes { 'localClass2': string; };export let localClassInsideLocal: string;interface classes { 'localClassInsideLocal': string; }; -export let reservedWords: string; +export let reservedWords: string;interface classes { 'reservedWords': string; };interface classes { 'default': string; }; +interface classes { 'const': string; }; +export let nestedClassParent: string;interface classes { 'nestedClassParent': string; };export let childClass: string;interface classes { 'childClass': string; }; -export let nestedClassParent: string;export let childClass: string; +export let nestedClassParentExtended: string;interface classes { 'nestedClassParentExtended': string; }; -export let nestedClassParentExtended: string; +export let section1: string;interface classes { 'section1': string; };export let section2: string;interface classes { 'section2': string; };export let section3: string;interface classes { 'section3': string; };export let section4: string;interface classes { 'section4': string; };export let section5: string;interface classes { 'section5': string; };export let section6: string;interface classes { 'section6': string; };export let section7: string;interface classes { 'section7': string; };export let section8: string;interface classes { 'section8': string; };export let section9: string;interface classes { 'section9': string; }; -export let section1: string;export let section2: string;export let section3: string;export let section4: string;export let section5: string;export let section6: string;export let section7: string;export let section8: string;export let section9: string; +export let classWithMixin: string;interface classes { 'classWithMixin': string; }; -export let classWithMixin: string; +export let appLogo: string;interface classes { 'appLogo': string; }; -export let appLogo: string; +export let appLogo: string;interface classes { 'appLogo': string; }; +export let myAnimation: string;interface classes { 'myAnimation': string; }; -export let appLogo: string; -export let myAnimation: string; @@ -1129,34 +1054,8 @@ export let myAnimation: string; -declare let _classes: { - 'localClassInsideGlobal': string; - 'localClass': string; - 'localClass2': string; - 'localClassInsideLocal': string; - 'reservedWords': string; - 'default': string; - 'const': string; - 'nestedClassParent': string; - 'childClass': string; - 'nestedClassParentExtended': string; - 'section1': string; - 'section2': string; - 'section3': string; - 'section4': string; - 'section5': string; - 'section6': string; - 'section7': string; - 'section8': string; - 'section9': string; - 'classWithMixin': string; - 'appLogo': string; - 'appLogo': string; - 'myAnimation': string; - 'myFolderIndex': string; -}; -export default _classes; -" + export default _classes; + " `; exports[`helpers / cssSnapshots with goToDefinition enabled with Sass should return an object with classes, css, and a source map 1`] = ` @@ -1310,34 +1209,30 @@ exports[`helpers / cssSnapshots with loadPaths in stylus options should find ext `; exports[`helpers / cssSnapshots with noUncheckedIndexedAccess enabled should return a dts file with only possibly undefined strings 1`] = ` -"declare let _classes: { - 'localClassInsideGlobal'?: string; - 'localClass'?: string; - 'localClass2'?: string; - 'localClassInsideLocal'?: string; - 'reservedWords'?: string; - 'default'?: string; - 'const'?: string; - 'nestedClassParent'?: string; - 'childClass'?: string; - 'nestedClassParentExtended'?: string; - 'section1'?: string; - 'section2'?: string; - 'section3'?: string; - 'section4'?: string; - 'section5'?: string; - 'section6'?: string; - 'section7'?: string; - 'section8'?: string; - 'section9'?: string; - 'classWithMixin'?: string; - 'appLogo'?: string; - 'appLogo'?: string; - 'myAnimation'?: string; - 'myFolderIndex'?: string; -}; -export default _classes; -export let localClassInsideGlobal: string | undefined; +"interface classes { }; declare let _classes: classes; interface classes { 'localClassInsideGlobal'?: string; }; + interface classes { 'localClass'?: string; }; + interface classes { 'localClass2'?: string; }; + interface classes { 'localClassInsideLocal'?: string; }; + interface classes { 'reservedWords'?: string; }; + interface classes { 'default'?: string; }; + interface classes { 'const'?: string; }; + interface classes { 'nestedClassParent'?: string; }; + interface classes { 'childClass'?: string; }; + interface classes { 'nestedClassParentExtended'?: string; }; + interface classes { 'section1'?: string; }; + interface classes { 'section2'?: string; }; + interface classes { 'section3'?: string; }; + interface classes { 'section4'?: string; }; + interface classes { 'section5'?: string; }; + interface classes { 'section6'?: string; }; + interface classes { 'section7'?: string; }; + interface classes { 'section8'?: string; }; + interface classes { 'section9'?: string; }; + interface classes { 'classWithMixin'?: string; }; + interface classes { 'appLogo'?: string; }; + interface classes { 'appLogo'?: string; }; + interface classes { 'myAnimation'?: string; }; + interface classes { 'myFolderIndex'?: string; };export let localClassInsideGlobal: string | undefined; export let localClass: string | undefined; export let localClass2: string | undefined; export let localClassInsideLocal: string | undefined; @@ -1359,7 +1254,9 @@ export let appLogo: string | undefined; export let appLogo: string | undefined; export let myAnimation: string | undefined; export let myFolderIndex: string | undefined; -" + + export default _classes; + " `; exports[`helpers / cssSnapshots with sass @use and a partial should find external file from loadPaths 1`] = ` diff --git a/src/helpers/createDtsExports.ts b/src/helpers/createDtsExports.ts index 23b5ffa..81709d2 100644 --- a/src/helpers/createDtsExports.ts +++ b/src/helpers/createDtsExports.ts @@ -29,7 +29,9 @@ export const createDtsExports = ({ const possiblyUndefined = Boolean(options.noUncheckedIndexedAccess); const classnameToProperty = (classname: string) => - `'${classname}'${possiblyUndefined ? '?' : ''}: string;`; + `interface classes { '${classname}'${ + possiblyUndefined ? '?' : '' + }: string; };`; const classnameToNamedExport = (classname: string) => `export let ${classname}: string${ possiblyUndefined ? ' | undefined' : '' @@ -55,16 +57,16 @@ export const createDtsExports = ({ const dtsLines = Array.from(Array(cssLines.length), () => ''); // Create a list of filtered classnames and hashed classnames. - const filteredClasses = Object.entries(cssExports.classes) - .map(([classname, originalClassname]) => [ + const transformedClasses = Object.entries(cssExports.classes).map( + ([classname, originalClassname]) => [ // TODO: Improve this. It may return multiple valid classnames and we // want to handle all of those. transformClasses(options.classnameTransform)(classname)[0], originalClassname, - ]) - .filter(([classname]) => isValidVariable(classname)); + ], + ); - filteredClasses.forEach(([classname, originalClassname]) => { + transformedClasses.forEach(([classname, originalClassname]) => { let matchedLine; let matchedColumn; @@ -91,30 +93,37 @@ export const createDtsExports = ({ column: matchedColumn ? matchedColumn : 0, }); + if (isValidVariable(classname)) { + dtsLines[lineNumber ? lineNumber - 1 : 0] += + classnameToNamedExport(classname); + } + dtsLines[lineNumber ? lineNumber - 1 : 0] += - classnameToNamedExport(classname); + classnameToProperty(classname); }); dts = dtsLines.join('\n'); + } else { + dts += processedClasses.map(classnameToProperty).join('\n '); + if ( + !options.goToDefinition && + options.namedExports !== false && + filteredClasses.length + ) { + dts += filteredClasses.join('\n') + '\n'; + } } - dts += `\ -declare let _classes: { - ${processedClasses.map(classnameToProperty).join('\n ')}${ - options.allowUnknownClassnames ? '\n [key: string]: string;' : '' - } -}; -export default _classes; -`; - - if ( - !options.goToDefinition && - options.namedExports !== false && - filteredClasses.length - ) { - dts += filteredClasses.join('\n') + '\n'; + if (options.allowUnknownClassnames) { + dts += ` + interface classes { [key: string]: string }; + `; } + dts = `interface classes { }; declare let _classes: classes; ${dts} + export default _classes; + `; + if (options.customTemplate) { // eslint-disable-next-line @typescript-eslint/no-var-requires const customTemplate = require(options.customTemplate) as CustomTemplate;