ripple 0.3.17 → 0.3.19

package/tests/client/css/{global-classes-ids.test.rsrx → global-classes-ids.test.tsrx}

@@ -12,7 +12,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('.foo {');
 		expect(css).not.toMatch(/\.foo\.ripple-[a-z0-9]+/);
@@ -37,7 +37,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('.foo.bar {');
 		expect(css).toMatch(/\.foo\.bar\.ripple-[a-z0-9]+ {/);
@@ -61,7 +61,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/\.outer \.inner\.ripple-[a-z0-9]+ {/);
 		expect(css).toMatch(/\(unused\) :global\(div\) \.foo {/);
@@ -88,7 +88,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('#app {');
 		expect(css).not.toContain('#app #content {');
@@ -115,7 +115,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('#app.container {');
 		expect(css).toMatch(/\.container#app\.ripple-[a-z0-9]+ {/);
@@ -141,7 +141,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect((css.match(/\.a\.b\.c\.ripple-[a-z0-9]+ {/g) || []).length).toBe(2);
 		expect(css).toMatch(/\.a\.b\.ripple-[a-z0-9]+\.c {/);
@@ -170,7 +170,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/\.outer \.middle\.ripple-[a-z0-9]+ \.inner:where\(\.ripple-[a-z0-9]+\)/);
 		expect(css).toMatch(/\.outer\.ripple-[a-z0-9]+ \.middle \.inner {/);

package/tests/client/css/{global-combinators.test.rsrx → global-combinators.test.tsrx}

@@ -14,7 +14,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+ > span {/);
 		expect(css).not.toMatch(/span\.ripple-[a-z0-9]+/);
@@ -38,7 +38,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/span\.ripple-[a-z0-9]+ \+ span {/);
 		expect(css).toContain('(unused) :global(div) + span {');
@@ -62,7 +62,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('~');
 
@@ -90,7 +90,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+ > span > button {/);
 		expect(css).toMatch(/div > span\.ripple-[a-z0-9]+ \+ button:where\(\.ripple-[a-z0-9]+\) {/);
@@ -116,7 +116,7 @@ export component Test() {
 	</style>
 }`;
 
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+ span button {/);
 		expect(css).toMatch(/div span\.ripple-[a-z0-9]+ button:where\(\.ripple-[a-z0-9]+\) {/);

package/tests/client/css/{global-complex-nesting.test.rsrx → global-complex-nesting.test.tsrx}

@@ -24,7 +24,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).not.toMatch(/div\.ripple-[a-z0-9]+ {/);
 		expect(css).not.toMatch(/span\.ripple-[a-z0-9]+ {/);
@@ -52,7 +52,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+ {/);
 		expect(css).not.toMatch(/span\.ripple-[a-z0-9]+ {/);
@@ -78,7 +78,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('div {');
 		expect(css).toContain('.local {');
@@ -109,7 +109,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+ {/);
 		expect(css).toMatch(/button\.ripple-[a-z0-9]+ {/);
@@ -140,7 +140,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+ {/);
 		expect(css).toContain('span {');
@@ -172,7 +172,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/\.container\.ripple-[a-z0-9]+ {/);
 		expect(css).toMatch(/button\.ripple-[a-z0-9]+ {/);
@@ -207,7 +207,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+ {/);
 		expect(css).toMatch(/ul\.ripple-[a-z0-9]+ {/);

package/tests/client/css/{global-edge-cases.test.rsrx → global-edge-cases.test.tsrx}

@@ -12,7 +12,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('div, span ');
 		expect(css).toContain('(unused) p');
@@ -33,7 +33,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('[data-test] {');
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+\[data-foo="bar"\]/);
@@ -54,7 +54,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('* {');
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+ \* {/);
@@ -75,7 +75,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('#app {');
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+ #test {/);
@@ -98,7 +98,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('div::before {');
 		``;
@@ -118,7 +118,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('color: red');
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+ {/);
@@ -143,7 +143,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/div\.container > span.wrapper\.ripple-[a-z0-9]+ \+ button\[disabled\] {/);
 		expect(css).toMatch(/\.foo > \.bar span\.ripple-[a-z0-9]+ {/);
@@ -165,7 +165,7 @@ export component Test() {
 	</style>
 }`;
 
-		expect(() => compile(source, 'test.ripple')).toThrow(
+		expect(() => compile(source, 'test.tsrx')).toThrow(
 			':global(...) can be at the start or end of a selector sequence, but not in the middle',
 		);
 	});
@@ -191,7 +191,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/html div\.ripple-[a-z0-9]+ span:where\(\.ripple-[a-z0-9]+\) {/);
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+ span:where\(\.ripple-[a-z0-9]+\) strong {/);

package/tests/client/css/{global-keyframes.test.rsrx → global-keyframes.test.tsrx}

@@ -17,7 +17,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('@keyframes foo');
 		expect(css).not.toContain('-global-foo');
@@ -36,7 +36,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/@keyframes ripple-[a-z0-9]+-foo/);
 	});
@@ -67,7 +67,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('@keyframes fadeIn');
 		expect(css).not.toContain('-global-fadeIn');
@@ -93,7 +93,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('@keyframes foo');
 		expect(css).toContain('@keyframes bar');
@@ -134,7 +134,7 @@ component Child() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		// Parent should have scoped slideIn and global fadeIn
 		expect(css).toMatch(/@keyframes ripple-[a-z0-9]+-slideIn/);

package/tests/client/css/{global-nested.test.rsrx → global-nested.test.tsrx}

@@ -32,7 +32,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+ {/);
 		expect(css).toContain('.x {');
@@ -67,7 +67,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('&.x {');
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+\.x {/);
@@ -92,7 +92,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('div {');
 		expect(css).toContain('.y {');
@@ -118,7 +118,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('.whatever {');
 		expect(css).not.toMatch(/\.whatever\.ripple-[a-z0-9]+ {/);
@@ -142,7 +142,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+ :is\(span\) {/);
 		expect(css).toMatch(/\.foo :is\(div\.ripple-[a-z0-9]+\) {/);

package/tests/client/css/{global-pseudo.test.rsrx → global-pseudo.test.tsrx}

@@ -18,7 +18,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+:has\(span\)/);
 		expect(css).toContain('div:has(span)');
@@ -42,7 +42,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+ :is\(span, p:where\(\.ripple-[a-z0-9]+\)\) {/);
 		expect(css).not.toMatch(/span:where/);
@@ -68,7 +68,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+ :where\(span, p:where\(\.ripple-[a-z0-9]+\)\) {/);
 		expect(css).not.toMatch(/span:where/);
@@ -93,7 +93,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+:not\(span\)/);
 		expect(css).toContain('div:not(.foo)');
@@ -116,7 +116,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+:is\(:where\(\.ripple-[a-z0-9]+\):has\(span\)\) {/);
 		expect(css).toContain('div:where(:is(.foo))');
@@ -145,7 +145,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('span:nth-child(2) {');
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+ > span:first-child {/);

package/tests/client/css/{global-scoping.test.rsrx → global-scoping.test.tsrx}

@@ -12,7 +12,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/\.scoped\.ripple-[a-z0-9]+/);
 		expect(css).not.toContain('.scoped {');
@@ -29,7 +29,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('.global {');
 		expect(css).not.toMatch(/\.global\.ripple-[a-z0-9]+/);
@@ -64,7 +64,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/\.outer\.ripple-[a-z0-9]+ {/);
 		expect(css).toMatch(/\.outer {/);
@@ -98,7 +98,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toContain('div {');
 		expect(css).toContain('span {');
@@ -131,7 +131,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/div\.ripple-[a-z0-9]+/);
 		expect(css).toMatch(/span\.ripple-[a-z0-9]+/);
@@ -153,7 +153,7 @@ export component Test() {
 		}
 	</style>
 }`;
-		const { css } = compile(source, 'test.ripple');
+		const { css } = compile(source, 'test.tsrx');
 
 		expect(css).toMatch(/\.local\.ripple-[a-z0-9]+ \.global \.local {/);
 		expect(css).not.toMatch(/\.global\.ripple-[a-z0-9]+/);
@@ -180,8 +180,8 @@ export component Test2() {
 		}
 	</style>
 }`;
-		const { css: css1 } = compile(source1, 'test1.ripple');
-		const { css: css2 } = compile(source2, 'test2.ripple');
+		const { css: css1 } = compile(source1, 'test1.tsrx');
+		const { css: css2 } = compile(source2, 'test2.tsrx');
 
 		expect(css1).toMatch(/\.test\.ripple-[a-z0-9]+/);
 		expect(css2).toMatch(/\.test\.ripple-[a-z0-9]+/);
@@ -218,8 +218,8 @@ export component Test2() {
 		}
 	</style>
 }`;
-		const { css: css1 } = compile(source1, 'test1.ripple');
-		const { css: css2 } = compile(source2, 'test2.ripple');
+		const { css: css1 } = compile(source1, 'test1.tsrx');
+		const { css: css2 } = compile(source2, 'test2.tsrx');
 
 		expect(css1).toContain('.global {');
 		expect(css1).not.toMatch(/\.global\.ripple-[a-z0-9]+/);

package/tests/client/css/{style-identifier.test.rsrx → style-identifier.test.tsrx}

@@ -163,9 +163,7 @@ component App() {
 		}
 	</style>
 }`;
-			expect(() => compile(source, 'test.ripple')).toThrow(
-				/cannot be used directly on DOM elements/,
-			);
+			expect(() => compile(source, 'test.tsrx')).toThrow(/cannot be used directly on DOM elements/);
 		});
 
 		it('errors when #style bracket notation is used directly on a DOM element', () => {
@@ -179,9 +177,7 @@ component App() {
 		}
 	</style>
 }`;
-			expect(() => compile(source, 'test.ripple')).toThrow(
-				/cannot be used directly on DOM elements/,
-			);
+			expect(() => compile(source, 'test.tsrx')).toThrow(/cannot be used directly on DOM elements/);
 		});
 
 		it('errors when #style references a class in a compound selector passed to component', () => {
@@ -198,7 +194,7 @@ component App() {
 		}
 	</style>
 }`;
-			expect(() => compile(source, 'test.ripple')).toThrow(/does not exist as a stand-alone class/);
+			expect(() => compile(source, 'test.tsrx')).toThrow(/does not exist as a stand-alone class/);
 		});
 
 		it('errors if descendant class is attempted to be passed in to child component', () => {
@@ -224,7 +220,7 @@ component App() {
 				render(App);
 			`;
 
-			expect(() => compile(source, 'test.ripple')).toThrow(/does not exist as a stand-alone class/);
+			expect(() => compile(source, 'test.tsrx')).toThrow(/does not exist as a stand-alone class/);
 		});
 
 		it('errors if combinator class is attempted to be passed in to child component', () => {
@@ -251,7 +247,7 @@ component App() {
 
 				render(App);
 			`;
-			expect(() => compile(source, 'test.ripple')).toThrow(/does not exist as a stand-alone class/);
+			expect(() => compile(source, 'test.tsrx')).toThrow(/does not exist as a stand-alone class/);
 		});
 
 		it('errors if compound class is attempted to be passed in to child component', () => {
@@ -278,7 +274,7 @@ component App() {
 
 				render(App);
 			`;
-			expect(() => compile(source, 'test.ripple')).toThrow(/does not exist as a stand-alone class/);
+			expect(() => compile(source, 'test.tsrx')).toThrow(/does not exist as a stand-alone class/);
 		});
 
 		it('errors if descendant #style class is used on a dynamic component', () => {
@@ -303,7 +299,7 @@ component App() {
 
 				render(App);
 			`;
-			expect(() => compile(source, 'test.ripple')).toThrow(/does not exist as a stand-alone class/);
+			expect(() => compile(source, 'test.tsrx')).toThrow(/does not exist as a stand-alone class/);
 		});
 
 		it('errors when #style references a class that does not exist in the style block', () => {
@@ -320,7 +316,7 @@ component App() {
 		}
 	</style>
 }`;
-			expect(() => compile(source, 'test.ripple')).toThrow(/does not exist as a stand-alone class/);
+			expect(() => compile(source, 'test.tsrx')).toThrow(/does not exist as a stand-alone class/);
 		});
 
 		it('errors when #style is used with a dynamic expression', () => {
@@ -338,7 +334,7 @@ component App() {
 		}
 	</style>
 }`;
-			expect(() => compile(source, 'test.ripple')).toThrow(
+			expect(() => compile(source, 'test.tsrx')).toThrow(
 				/must use a dot property or static string/,
 			);
 		});
@@ -347,7 +343,7 @@ component App() {
 			const source = `function notAComponent() {
 	const cls = #style.foo;
 }`;
-			expect(() => compile(source, 'test.ripple')).toThrow(/can only be used within a component/);
+			expect(() => compile(source, 'test.tsrx')).toThrow(/can only be used within a component/);
 		});
 	});
 
@@ -366,7 +362,7 @@ export component App() {
 		}
 	</style>
 }`;
-			const { js } = compile(source, 'test.ripple');
+			const { js } = compile(source, 'test.tsrx');
 
 			expect(js.code).toContain('highlight');
 			expect(js.code).toMatch(/ripple-[a-z0-9]+/);
@@ -386,7 +382,7 @@ export component App() {
 		}
 	</style>
 }`;
-			const { js } = compile(source, 'test.ripple', { mode: 'server' });
+			const { js } = compile(source, 'test.tsrx', { mode: 'server' });
 
 			expect(js.code).toContain('highlight');
 			expect(js.code).toMatch(/ripple-[a-z0-9]+/);

package/tests/client/{function-overload.test.rsrx → function-overload.test.tsrx}

@@ -1,6 +1,6 @@
 import { describe, it, expect, beforeEach, afterEach } from 'vitest';
 import { mount, flushSync } from 'ripple';
-import { test } from './function-overload-import.rsrx';
+import { test } from './function-overload-import.tsrx';
 
 describe('function overload import tests', () => {
 	describe('function overloads', () => {