Skip to content

Commit caf7f4a

Browse files
Austin1serbAustin1serb
committed
fix: tailwind variants generate without useUI hook in file
1 parent a535aaa commit caf7f4a

24 files changed

+984
-1072
lines changed

‎.github/workflows/release.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
name: Release
22

33
on:
4-
workflow_dispatch: # manual “Run workflow”
4+
workflow_dispatch: # manual "Run workflow"
55

66
permissions:
77
contents: write

‎docs/assets/internal.md‎

Lines changed: 112 additions & 107 deletions
Large diffs are not rendered by default.

‎packages/core/__tests__/e2e/next.spec.js‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -74,6 +74,16 @@ const scenarios = [
7474
initialText: 'White',
7575
toggledText: 'Black',
7676
},
77+
{
78+
name: 'Child Component Toggle',
79+
toggle: 'child-toggle',
80+
container: 'child-container',
81+
attr: 'data-child',
82+
initialValue: 'closed',
83+
toggledValue: 'open',
84+
initialText: 'Closed',
85+
toggledText: 'Open',
86+
},
7787
];
7888

7989
test.describe.configure({ mode: 'serial' });

‎packages/core/__tests__/fixtures/next/.zero-ui/attributes.d.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
/* AUTO-GENERATED - DO NOT EDIT */
22
export declare const bodyAttributes: {
3+
"data-child": "closed" | "open";
34
"data-faq": "closed" | "open";
45
"data-mobile": "false" | "true";
56
"data-number": "1" | "2";

‎packages/core/__tests__/fixtures/next/.zero-ui/attributes.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
/* AUTO-GENERATED - DO NOT EDIT */
22
export const bodyAttributes = {
3+
"data-child": "closed",
34
"data-faq": "closed",
45
"data-mobile": "false",
56
"data-number": "1",

‎packages/core/__tests__/fixtures/next/app/ChildComponent.tsx‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import { type UISetterFn } from '@react-zero-ui/core';
2+
3+
export function ChildComponent({ setIsOpen }: { setIsOpen: UISetterFn }) {
4+
return (
5+
<div
6+
className="child-closed:bg-gray-100 child-open:bg-gray-900 child-open:text-white"
7+
data-testid="child-container">
8+
<button
9+
type="button"
10+
onClick={() => setIsOpen((prev) => (prev === 'closed' ? 'open' : 'closed'))}
11+
className="border-2 border-red-500"
12+
data-testid="child-toggle">
13+
Toggle Child
14+
</button>
15+
<div className="child-closed:bg-gray-100 child-open:bg-gray-900 flex">
16+
Child: <span className="child-open:block child-closed:hidden">Open</span> <span className="child-closed:block child-open:hidden">Closed</span>
17+
</div>
18+
</div>
19+
);
20+
}

‎packages/core/__tests__/fixtures/next/app/ChildWithoutSetter.tsx‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
export function ChildComponent() {
2+
return (
3+
<div
4+
className="child-closed:bg-gray-100 child-open:bg-gray-900 child-open:text-white"
5+
data-testid="child-container">
6+
<div
7+
className="border-2 border-blue-500"
8+
data-testid="child-toggle">
9+
No Setter Child
10+
</div>
11+
<div className="child-closed:bg-gray-100 child-open:bg-gray-900 flex">
12+
Child: <span className="child-open:block child-closed:hidden">Open</span> <span className="child-closed:block child-open:hidden">Closed</span>
13+
</div>
14+
</div>
15+
);
16+
}

‎packages/core/__tests__/fixtures/next/app/layout.tsx‎

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,13 @@
1-
import { bodyAttributes } from "@zero-ui/attributes";
2-
import './globals.css';
3-
export default function RootLayout({
4-
children
5-
}) {
6-
return <html lang="en">
7-
<body {...bodyAttributes} className="bg-red test-ww this is to test the body tag" id="88">
1+
import { bodyAttributes } from "@zero-ui/attributes";import './globals.css';
2+
3+
export default function RootLayout({ children }) {
4+
return (
5+
<html lang="en">
6+
<body {...bodyAttributes}
7+
className="bg-red test-ww this is to test the body tag"
8+
id="88">
89
{children}
910
</body>
10-
</html>;
11+
</html>);
12+
1113
}

‎packages/core/__tests__/fixtures/next/app/page.tsx‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
import { useUI } from '@react-zero-ui/core';
33
import UseEffectComponent from './UseEffectComponent';
44
import FAQ from './FAQ';
5+
import { ChildComponent } from './ChildComponent';
56

67
export default function Page() {
78
const [, setTheme] = useUI<'light' | 'dark'>('theme', 'light');
@@ -12,6 +13,7 @@ export default function Page() {
1213
const [, setOpen] = useUI<'open' | 'closed'>('faq', 'closed'); // Same key everywhere!
1314
const [, setScope] = useUI<'off' | 'on'>('scope', 'off');
1415
const [, setMobile] = useUI<'true' | 'false'>('mobile', 'false');
16+
const [, setChildOpen] = useUI<'open' | 'closed'>('child', 'closed');
1517

1618
const [, setToggleFunction] = useUI<'white' | 'black'>('toggle-function', 'white');
1719

@@ -128,9 +130,13 @@ export default function Page() {
128130
Function: <span className="toggle-function-white:block hidden">White</span> <span className="toggle-function-black:block hidden">Black</span>
129131
</div>
130132
</div>
133+
<hr />
134+
<ChildComponent setIsOpen={setChildOpen} />
131135
</div>
132136
<hr />
137+
133138
<h1 className="text-2xl font-bold py-5">Scoped Style Tests</h1>
139+
134140
<hr />
135141

136142
<div className="border-2 border-blue-500">
@@ -151,6 +157,7 @@ export default function Page() {
151157
<span className="scope-on:block scope-off:hidden">True</span>
152158
</div>
153159
</div>
160+
154161
<hr />
155162

156163
<div
@@ -183,6 +190,8 @@ export default function Page() {
183190
</div>
184191
</div>
185192

193+
<hr />
194+
186195
<div ref={setOpen.ref}>
187196
<button
188197
className="bg-blue-500 text-white p-2 rounded-md m-5"

‎packages/core/__tests__/unit/ast.test.cjs‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ const path = require('path');
55
const os = require('os');
66
const { performance } = require('node:perf_hooks');
77
const { findAllSourceFiles } = require('../../dist/postcss/helpers.cjs');
8-
const { collectUseUISetters, extractVariants } = require('../../dist/postcss/ast-parsing.cjs');
8+
const { collectUseUIHooks, extractVariants } = require('../../dist/postcss/ast-parsing.cjs');
99

1010
const ComponentImports = readFile(path.join(__dirname, './fixtures/test-components.jsx'));
1111
const AllPatternsComponent = readFile(path.join(__dirname, './fixtures/ts-test-components.tsx'));
@@ -62,7 +62,7 @@ test('findAllSourceFiles', async () => {
6262
);
6363
});
6464

65-
test('collectUseUISetters - basic functionality', async () => {
65+
test('collectUseUIHooks - basic functionality', async () => {
6666
const sourceCode = `
6767
import { useUI } from '@react-zero-ui/core';
6868
@@ -77,7 +77,7 @@ test('collectUseUISetters - basic functionality', async () => {
7777
`;
7878

7979
const ast = parse(sourceCode, { sourceType: 'module', plugins: ['jsx', 'typescript'] });
80-
const setters = collectUseUISetters(ast);
80+
const setters = collectUseUIHooks(ast);
8181

8282
assert.strictEqual(setters[0].stateKey, 'theme');
8383
assert.strictEqual(setters[0].initialValue, 'light');
@@ -118,15 +118,15 @@ export function ComponentSimple() {
118118
test('Extract Variant with imports and throw error', async () => {
119119
await runTest({ 'src/app/Component.jsx': ComponentImports }, async () => {
120120
assert.throws(() => {
121-
collectUseUISetters(parse(ComponentImports, { sourceType: 'module', plugins: ['jsx', 'typescript'] }), ComponentImports);
121+
collectUseUIHooks(parse(ComponentImports, { sourceType: 'module', plugins: ['jsx', 'typescript'] }), ComponentImports);
122122
// tests that the error message contains the correct text
123123
}, /const VARSLocal = VARS/);
124124
});
125125
});
126126

127127
test('testKeyInitialValue', async () => {
128128
await runTest({ 'src/app/Component.jsx': AllPatternsComponent }, async () => {
129-
const setters = collectUseUISetters(parse(AllPatternsComponent, { sourceType: 'module', plugins: ['jsx', 'typescript'] }), AllPatternsComponent);
129+
const setters = collectUseUIHooks(parse(AllPatternsComponent, { sourceType: 'module', plugins: ['jsx', 'typescript'] }), AllPatternsComponent);
130130
assert.strictEqual(setters[0].stateKey, 'theme');
131131
assert.strictEqual(setters[0].initialValue, 'light');
132132
assert.strictEqual(setters[1].stateKey, 'altTheme');

0 commit comments

Comments
 (0)