create-bestax 3.6.0 → 3.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/constants.d.ts.map +1 -1
  2. package/dist/constants.js +3 -0
  3. package/package.json +3 -3
  4. package/templates/skills/bestax-layout-scaffold/SKILL.md +8 -3
  5. package/templates/skills/bestax-layout-scaffold/examples/landing.tsx +42 -2
  6. package/templates/skills/bestax-layout-scaffold/references/archetypes.md +35 -3
package/dist/constants.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,QAAQ;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,OAAO,KAAK,CAAC,MAAM,CAAC;CAC5B;AAED,eAAO,MAAM,SAAS,EAAE,QAAQ,EAG/B,CAAC;AAEF,eAAO,MAAM,oBAAoB,kBAAkB,CAAC;AACpD,eAAO,MAAM,uBAAuB,MAAM,CAAC;AAC3C,eAAO,MAAM,kBAAkB,QAAsB,CAAC;AAEtD,eAAO,MAAM,QAAQ;;;;;;;wCAaQ,MAAM;uCAEP,MAAM;sCACP,MAAM;4CAEA,MAAM;;;;;CAM7B,CAAC;AASX,eAAO,MAAM,WAAW,QAed,CAAC;AAEX,eAAO,MAAM,OAAO;;;;;;CAOV,CAAC;AAOX,eAAO,MAAM,2BAA2B,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAK9D,CAAC;AAKF,MAAM,WAAW,eAAe;IAC9B,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,SAAS,GACpB,aAAa,MAAM,EACnB,8BAA8B,eAAe,KAC5C,MAwEF,CAAC;AAEF,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,OAAO,KAAK,CAAC,MAAM,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IAIrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,eAAO,MAAM,cAAc,EAAE,WAAW,EA6CvC,CAAC;AAEF,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,OAAO,KAAK,CAAC,MAAM,CAAC;IAC3B,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,eAAO,MAAM,aAAa,EAAE,WAAW,EA4CtC,CAAC"}
1
+ {"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,QAAQ;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,OAAO,KAAK,CAAC,MAAM,CAAC;CAC5B;AAED,eAAO,MAAM,SAAS,EAAE,QAAQ,EAG/B,CAAC;AAEF,eAAO,MAAM,oBAAoB,kBAAkB,CAAC;AACpD,eAAO,MAAM,uBAAuB,MAAM,CAAC;AAC3C,eAAO,MAAM,kBAAkB,QAAsB,CAAC;AAEtD,eAAO,MAAM,QAAQ;;;;;;;wCAaQ,MAAM;uCAEP,MAAM;sCACP,MAAM;4CAEA,MAAM;;;;;CAM7B,CAAC;AASX,eAAO,MAAM,WAAW,QAed,CAAC;AAEX,eAAO,MAAM,OAAO;;;;;;CAOV,CAAC;AAOX,eAAO,MAAM,2BAA2B,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAK9D,CAAC;AAKF,MAAM,WAAW,eAAe;IAC9B,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,SAAS,GACpB,aAAa,MAAM,EACnB,8BAA8B,eAAe,KAC5C,MA2EF,CAAC;AAEF,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,OAAO,KAAK,CAAC,MAAM,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IAIrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,eAAO,MAAM,cAAc,EAAE,WAAW,EA6CvC,CAAC;AAEF,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,OAAO,KAAK,CAAC,MAAM,CAAC;IAC3B,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,eAAO,MAAM,aAAa,EAAE,WAAW,EA4CtC,CAAC"}
package/dist/constants.js CHANGED
@@ -99,6 +99,9 @@ ${setupLines.join('\n')}
99
99
  take a \`gap\` prop, so prefer that there).
100
100
  - Compose existing components before writing custom CSS; theme via \`Theme\` and \`--bulma-*\`
101
101
  variables, never hardcoded colors.
102
+ - \`Navbar.Burger\`/\`Navbar.Menu\` are controlled — wire \`active\` via state on both, and pair
103
+ \`Navbar fixed="top"\` with the \`has-navbar-fixed-top\` class on \`<html>\` (never an inline
104
+ padding offset).
102
105
  - There is no test runner or Storybook in this app — don't assume one.
103
106
  - \`index.html\`'s \`<title>\` starts as the project name and \`README.md\` is stock template
104
107
  boilerplate — once this app has a real identity, set the title (and any meta tags) to match
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "create-bestax",
3
- "version": "3.6.0",
3
+ "version": "3.7.0",
4
4
  "description": "Create a new bestax-bulma project",
5
5
  "type": "module",
6
6
  "bin": {
@@ -64,13 +64,13 @@
64
64
  "@playwright/test": "^1.57.0",
65
65
  "@types/fs-extra": "^11.0.4",
66
66
  "@types/jest": "^30.0.0",
67
- "@types/node": "^26.0.1",
67
+ "@types/node": "^26.1.1",
68
68
  "@types/prompts": "^2.4.9",
69
69
  "@types/wait-on": "^5.3.4",
70
70
  "jest": "^30.2.0",
71
71
  "ts-jest": "^29.4.6",
72
72
  "typescript": "^6.0.3",
73
- "wait-on": "^9.0.10"
73
+ "wait-on": "^9.1.0"
74
74
  },
75
75
  "publishConfig": {
76
76
  "access": "public",
package/templates/skills/bestax-layout-scaffold/SKILL.md CHANGED
@@ -45,8 +45,12 @@ Centered; a collection of items → Card grid. For mixed requests, pick the domi
45
45
  `height: 100%` on the card doesn't help — the column's height is auto).
46
46
  - Rely on Bulma's responsive defaults: `Columns` sit side by side on tablet and up and stack on
47
47
  mobile. Add responsive `size*` props only to tune the breakpoints.
48
- - For a `fixed="top"` `Navbar`, add the `has-navbar-fixed-top` class to `<html>` so content is not
49
- hidden behind it — the library does not do this automatically.
48
+ - `Navbar.Burger`/`Navbar.Menu` are **controlled** — wire the same `active` state to both:
49
+ `active` on `Navbar.Menu` shows/hides the mobile menu, while `active` + `onClick` on
50
+ `Navbar.Burger` make the burger toggle it and animate. Left unwired, clicking the burger
51
+ does nothing (no error, silent failure). For a `fixed="top"` `Navbar`, add the
52
+ `has-navbar-fixed-top` class to `<html>` so content is not hidden behind it — the library
53
+ does not do this automatically, and an inline padding offset is not a substitute.
50
54
  - **Style with helper props, not inline `style`.** Use `m`/`p` spacing (`mt="4"` = 1rem),
51
55
  `textAlign="centered"`, and `textColor`/`bgColor` instead of `style={{ marginTop, textAlign,
52
56
  color }}`. Set the app-wide icon library once with `<ConfigProvider iconLibrary="…">` at the root
@@ -69,7 +73,7 @@ color }}`. Set the app-wide icon library once with `<ConfigProvider iconLibrary=
69
73
  ## Examples
70
74
 
71
75
  - `examples/app-shell.tsx` — fixed `Navbar` + sidebar `Menu` + content (dashboard).
72
- - `examples/landing.tsx` — `Hero` + `Section`s + `Footer`.
76
+ - `examples/landing.tsx` — fixed `Navbar` (controlled burger) + `Hero` + `Section`s + `Footer`.
73
77
  - `examples/centered.tsx` — centered single column (auth/settings).
74
78
  - `examples/card-grid.tsx` — multiline `Columns` of `Card`s (catalog).
75
79
  - `examples/content-page.tsx` — hero + feature cards + CTA styled with helper props (no inline
@@ -82,6 +86,7 @@ color }}`. Set the app-wide icon library once with `<ConfigProvider iconLibrary=
82
86
  - [ ] Use `Grid`/`Cell` for uniform grids (equal heights per row, free); `Columns`/`Column`
83
87
  for proportional or per-breakpoint side-by-side layout — with the flex recipe when its
84
88
  cards must match height.
89
+ - [ ] Wire `active` state to **both** `Navbar.Burger` and `Navbar.Menu` (they are controlled).
85
90
  - [ ] For a fixed navbar, add `has-navbar-fixed-top` to `<html>`.
86
91
  - [ ] Do not use `Tile` — it is not shipped.
87
92
  - [ ] Style with helper props (`mt`/`p`, `textAlign`, `textColor`), not inline `style`.
package/templates/skills/bestax-layout-scaffold/examples/landing.tsx CHANGED
@@ -1,8 +1,18 @@
1
- // Marketing / landing page — Hero + stacked Sections + Footer.
1
+ // Marketing / landing page — fixed top Navbar + Hero + stacked Sections + Footer.
2
2
  // Each Section stacks vertically; the feature Columns collapse to one per row on
3
3
  // mobile (Bulma columns stack below the tablet breakpoint).
4
- import React from 'react';
4
+ //
5
+ // The Navbar's burger/menu is CONTROLLED: `active` on Navbar.Menu shows/hides
6
+ // the mobile menu, while `active` + `onClick` on Navbar.Burger make the burger
7
+ // toggle it and animate. Wire the same state to both — left unwired, clicking
8
+ // the burger does nothing; desktop looks fine and nothing errors, so the
9
+ // failure is silent. A fixed-top navbar
10
+ // also needs the `has-navbar-fixed-top` class on <html> so the page is padded
11
+ // below it (never an inline padding offset) — Bulma requires this and the
12
+ // library does NOT add it for you.
13
+ import React, { useEffect, useState } from 'react';
5
14
  import {
15
+ Navbar,
6
16
  Hero,
7
17
  Section,
8
18
  Container,
@@ -24,8 +34,38 @@ const FEATURES = [
24
34
  ];
25
35
 
26
36
  export default function LandingPage() {
37
+ const [menuOpen, setMenuOpen] = useState(false);
38
+
39
+ useEffect(() => {
40
+ document.documentElement.classList.add('has-navbar-fixed-top');
41
+ return () => {
42
+ document.documentElement.classList.remove('has-navbar-fixed-top');
43
+ };
44
+ }, []);
45
+
27
46
  return (
28
47
  <>
48
+ <Navbar fixed="top">
49
+ <Navbar.Brand>
50
+ <Navbar.Item href="#">Acme</Navbar.Item>
51
+ <Navbar.Burger
52
+ active={menuOpen}
53
+ onClick={() => setMenuOpen(open => !open)}
54
+ aria-label="menu"
55
+ aria-expanded={menuOpen}
56
+ />
57
+ </Navbar.Brand>
58
+ <Navbar.Menu active={menuOpen}>
59
+ <Navbar.Start>
60
+ <Navbar.Item href="#">Features</Navbar.Item>
61
+ <Navbar.Item href="#">Pricing</Navbar.Item>
62
+ </Navbar.Start>
63
+ <Navbar.End>
64
+ <Navbar.Item href="#">Sign in</Navbar.Item>
65
+ </Navbar.End>
66
+ </Navbar.Menu>
67
+ </Navbar>
68
+
29
69
  <Hero color="primary" size="medium">
30
70
  <Hero.Body>
31
71
  <Container textAlign="centered">
package/templates/skills/bestax-layout-scaffold/references/archetypes.md CHANGED
@@ -19,6 +19,8 @@ app".
19
19
  **Skeleton:**
20
20
 
21
21
  ```tsx
22
+ const [open, setOpen] = useState(false); // controls the burger + mobile menu
23
+
22
24
  <>
23
25
  <Navbar fixed="top" color="dark">
24
26
  <Navbar.Brand>
@@ -54,7 +56,7 @@ app".
54
56
  </Column>
55
57
  </Columns>
56
58
  </Container>
57
- </>
59
+ </>;
58
60
  ```
59
61
 
60
62
  **Required:** add `has-navbar-fixed-top` to `<html>` (see `examples/app-shell.tsx`) so content is
@@ -74,7 +76,29 @@ pricing page. The default for "build me a site/page".
74
76
  **Skeleton:**
75
77
 
76
78
  ```tsx
79
+ const [open, setOpen] = useState(false); // controls the burger + mobile menu
80
+
77
81
  <>
82
+ <Navbar fixed="top">
83
+ <Navbar.Brand>
84
+ <Navbar.Item href="#">Brand</Navbar.Item>
85
+ <Navbar.Burger
86
+ active={open}
87
+ onClick={() => setOpen(o => !o)}
88
+ aria-label="menu"
89
+ />
90
+ </Navbar.Brand>
91
+ <Navbar.Menu active={open}>
92
+ <Navbar.Start>
93
+ <Navbar.Item href="#">Features</Navbar.Item>
94
+ <Navbar.Item href="#">Pricing</Navbar.Item>
95
+ </Navbar.Start>
96
+ <Navbar.End>
97
+ <Navbar.Item href="#">Sign in</Navbar.Item>
98
+ </Navbar.End>
99
+ </Navbar.Menu>
100
+ </Navbar>
101
+
78
102
  <Hero color="primary" size="medium">
79
103
  <Hero.Body>
80
104
  <Container textAlign="centered">
@@ -110,10 +134,18 @@ pricing page. The default for "build me a site/page".
110
134
  <Content textAlign="centered">{/* footer */}</Content>
111
135
  </Container>
112
136
  </Footer>
113
- </>
137
+ </>;
114
138
  ```
115
139
 
116
- **Responsive:** `Section`s already stack vertically. The feature `Columns` collapse to one feature
140
+ **Required:** `Navbar.Burger`/`Navbar.Menu` are **controlled** — wire the same `active` state to
141
+ both: `active` on `Navbar.Menu` shows/hides the mobile menu, and `active` + `onClick` on
142
+ `Navbar.Burger` make the burger toggle it and animate (a bare `<Navbar.Burger />` does nothing
143
+ when clicked, with no error). And add
144
+ `has-navbar-fixed-top` to `<html>` (see `examples/landing.tsx`) so content is not hidden behind
145
+ the fixed navbar — never an inline padding offset.
146
+
147
+ **Responsive:** the navbar collapses to a burger on mobile (`Navbar.Burger` + `Navbar.Menu active`).
148
+ `Section`s already stack vertically. The feature `Columns` collapse to one feature
117
149
  per row on mobile. Use `Hero size="large"` / `"fullheight"` for a taller hero.
118
150
 
119
151
  **Hero CTAs:** on a colored hero use **filled** buttons only — `color="light"` for the primary