rizzo-css 0.0.53 → 0.0.54

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 (39) hide show
  1. package/README.md +8 -7
  2. package/bin/rizzo-css.js +332 -85
  3. package/package.json +4 -3
  4. package/scaffold/astro-core/README-RIZZO.md +1 -1
  5. package/scaffold/minimal/index.html +13 -0
  6. package/scaffold/starter/index.html +13 -0
  7. package/scaffold/svelte-core/README-RIZZO.md +1 -1
  8. package/scaffold/vanilla/README-RIZZO.md +5 -5
  9. package/scaffold/vanilla/components/accordion.html +12 -0
  10. package/scaffold/vanilla/components/alert.html +12 -0
  11. package/scaffold/vanilla/components/avatar.html +12 -0
  12. package/scaffold/vanilla/components/back-to-top.html +12 -0
  13. package/scaffold/vanilla/components/badge.html +12 -0
  14. package/scaffold/vanilla/components/breadcrumb.html +12 -0
  15. package/scaffold/vanilla/components/button.html +12 -0
  16. package/scaffold/vanilla/components/cards.html +12 -0
  17. package/scaffold/vanilla/components/copy-to-clipboard.html +12 -0
  18. package/scaffold/vanilla/components/divider.html +12 -0
  19. package/scaffold/vanilla/components/docs-sidebar.html +12 -0
  20. package/scaffold/vanilla/components/dropdown.html +12 -0
  21. package/scaffold/vanilla/components/font-switcher.html +12 -0
  22. package/scaffold/vanilla/components/footer.html +12 -0
  23. package/scaffold/vanilla/components/forms.html +12 -0
  24. package/scaffold/vanilla/components/icons.html +12 -0
  25. package/scaffold/vanilla/components/index.html +12 -0
  26. package/scaffold/vanilla/components/modal.html +12 -0
  27. package/scaffold/vanilla/components/navbar.html +12 -0
  28. package/scaffold/vanilla/components/pagination.html +12 -0
  29. package/scaffold/vanilla/components/progress-bar.html +12 -0
  30. package/scaffold/vanilla/components/search.html +12 -0
  31. package/scaffold/vanilla/components/settings.html +12 -0
  32. package/scaffold/vanilla/components/sound-effects.html +12 -0
  33. package/scaffold/vanilla/components/spinner.html +12 -0
  34. package/scaffold/vanilla/components/table.html +12 -0
  35. package/scaffold/vanilla/components/tabs.html +12 -0
  36. package/scaffold/vanilla/components/theme-switcher.html +12 -0
  37. package/scaffold/vanilla/components/toast.html +12 -0
  38. package/scaffold/vanilla/components/tooltip.html +12 -0
  39. package/scaffold/vanilla/index.html +12 -0
package/README.md CHANGED
@@ -12,7 +12,7 @@ pnpm add rizzo-css
12
12
  yarn add rizzo-css
13
13
  ```
14
14
 
15
- **Quick start (no install):** `npx rizzo-css init` — choose **framework** (Vanilla, Astro, or Svelte), then **add to existing** or **create new**. **Existing** (or `npx rizzo-css add`) drop in CSS + hand-pick components; you must add the `<link>` yourself (CLI prints the exact tag). **New** choose **Core** (all 33 components) or **Manual** (pick which to include; all pre-selected), then package manager. Core includes all 33 components and required dependencies so every component works. Run `npx rizzo-css help components` for the dependency list. Non-interactive: `npx rizzo-css init --yes --framework vanilla|astro|svelte`. Optional **rizzo-css.json** and `add --install-package`. All get the **same CSS and component styles**. To use the **official Svelte or Astro create command** plus Rizzo, create the app first, then run `npx rizzo-css add`:
15
+ **Quick start (no install):** `npx rizzo-css init` — choose **framework** (Vanilla, Astro, or Svelte), then **add to existing** or **create new**. Both flows use the **same template choice**: **Minimal** (CSS + **RIZZO-SETUP.md** only; no overwrites), **Starter** (same + minimal index/layout only if missing), or **Full** (full app + 34 components or pick). We **never overwrite your existing files**; any skipped content is in **RIZZO-SETUP.md**. You must add the `<link>` yourself (CLI prints the exact tag). Non-interactive: `npx rizzo-css init --yes --framework vanilla|astro|svelte --template minimal|starter|full` or `npx rizzo-css add --template minimal|starter|full`. Optional **rizzo-css.json** and `add --install-package`. All get the **same CSS and component styles**. To use the **official Svelte or Astro create command** plus Rizzo, create the app first, then run `npx rizzo-css add`:
16
16
 
17
17
  ```bash
18
18
  npm create svelte@latest my-app && cd my-app && npx rizzo-css add
@@ -21,12 +21,13 @@ npm create astro@latest my-app && cd my-app && npx rizzo-css add
21
21
 
22
22
  **Running the CLI:** npm → `npx`; pnpm → `pnpm dlx`; yarn → `npx` (Yarn 1 has no `dlx`; works with Yarn 2+ too); bun → `bunx`. The [docs site](https://rizzo-css.vercel.app/docs/getting-started) tabs show the correct command for each manager.
23
23
 
24
- `add` writes **RIZZO-SNIPPET.txt** (link + theme) by default; use `--no-snippet` to skip. `npx rizzo-css doctor` checks config and CSS path. `npx rizzo-css theme` lists themes.
24
+ **Same flow for new and existing:** Both prompt for **Minimal** | **Starter** | **Full**. Minimal/Starter = CSS, fonts, icons, sfx + RIZZO-SETUP.md. Full = same assets + component picker (all 34 or pick); also writes **RIZZO-SNIPPET.txt** (link + theme) unless `--no-snippet`. `npx rizzo-css doctor` checks config and CSS path. `npx rizzo-css theme` lists themes.
25
25
 
26
26
  | | **Create new** (`init` → new) | **Add to existing** (`add` or `init` → existing) |
27
27
  |---|------------------------------|--------------------------------------------------|
28
- | Writes | Scaffold, CSS, config, LICENSE-RIZZO, README-RIZZO, .gitignore | CSS, components, config, optional RIZZO-SNIPPET.txt |
29
- | Link | Already in scaffold | You add it (CLI prints the tag) |
28
+ | Template | **Minimal** \| **Starter** \| **Full** (same for both) | **Minimal** \| **Starter** \| **Full** (same for both) |
29
+ | Writes | CSS, fonts, icons, sfx, RIZZO-SETUP.md; Full = + components, RIZZO-SNIPPET.txt; config, LICENSE-RIZZO, README-RIZZO, .gitignore | Same assets per template; Full = + components + RIZZO-SNIPPET.txt; config |
30
+ | Overwrites | **Never** — snippets in RIZZO-SETUP.md | **Never** — snippets in RIZZO-SETUP.md; CLI prints the link tag |
30
31
 
31
32
  ## One package, any framework
32
33
 
@@ -48,7 +49,7 @@ You install **the same package** for every framework: `npm install rizzo-css`. N
48
49
 
49
50
  With `npx rizzo-css add --path <dir>`, the CLI still suggests the correct href for your framework (e.g. Astro/Svelte get a leading `/` path).
50
51
 
51
- Scaffolds in the package: `scaffold/vanilla/` (Core or Manual), `scaffold/astro-core/`, `scaffold/svelte-core/`, plus `scaffold/astro/` and `scaffold/svelte/` (component templates for hand-pick), and `scaffold/config/` (font pairs for the Settings component). When you add **Settings** via the CLI (Astro or Svelte), the CLI also copies `scaffold/config/fonts.ts` into your project so the font-pair dropdown works (Astro: `src/components/config/fonts.ts`; Svelte: `src/lib/config/fonts.ts`). Use `npx rizzo-css init` and choose **Create new project**; **Core** includes all 33 components, **Manual** lets you pick (all interactive pre-selected). The stylesheet link is in the layout. **Add to existing** (or `add` command) drops in CSS + hand-pick components; **you must add the stylesheet `<link>` yourself** — the CLI prints the exact tag. Every scaffold includes LICENSE-RIZZO, README-RIZZO.md, and .gitignore (does not overwrite your project files); Astro/Svelte include package.json and .env.example.
52
+ Scaffolds in the package: `scaffold/vanilla/`, `scaffold/astro-core/`, `scaffold/svelte-core/`, plus `scaffold/astro/` and `scaffold/svelte/` (34 components), and `scaffold/config/` (font pairs for Settings). **New and existing use the same flow:** choose **Minimal**, **Starter**, or **Full**. Minimal/Starter = CSS, fonts, icons, sfx + RIZZO-SETUP.md. Full = same + component picker (all 34 or pick). **We never overwrite your existing files**; skipped content goes in **RIZZO-SETUP.md**. You must add the stylesheet `<link>` yourself (CLI prints the exact tag). Every scaffold includes LICENSE-RIZZO, README-RIZZO.md, and .gitignore; Astro/Svelte include package.json and .env.example.
52
53
 
53
54
  ## Use
54
55
 
@@ -63,7 +64,7 @@ import 'rizzo-css';
63
64
  **Without a bundler (plain HTML):** Use a CDN. Both unpkg and jsDelivr resolve the package root to the built CSS (via the `unpkg` / `jsdelivr` fields in this package). For reliability or to pin a version, use the explicit path:
64
65
 
65
66
  ```html
66
- <!-- unpkg (pin version: replace @latest with @0.0.53 or any version) -->
67
+ <!-- unpkg (pin version: replace @latest with @0.0.54 or any version) -->
67
68
  <link rel="stylesheet" href="https://unpkg.com/rizzo-css@latest/dist/rizzo.min.css" />
68
69
 
69
70
  <!-- or jsDelivr -->
@@ -72,7 +73,7 @@ import 'rizzo-css';
72
73
 
73
74
  Short URLs also work: `https://unpkg.com/rizzo-css@latest` and `https://cdn.jsdelivr.net/npm/rizzo-css@latest` (CDNs serve the default file from package.json). To verify after publish: open the URL in a browser or run `curl -I https://unpkg.com/rizzo-css@latest/dist/rizzo.min.css` and expect `200 OK`.
74
75
 
75
- Use the same class names and HTML structure as in the [component docs](https://rizzo-css.vercel.app/docs/components). **Vanilla JS**, Astro, and Svelte all use the same CSS and BEM markup; Astro/Svelte add framework component files when you hand-pick. Each scaffold has README-RIZZO.md; every install includes LICENSE-RIZZO. The **Navbar** component in the scaffold includes the default Cat logo in the brand link (optional `logo` prop for a custom image). The **Vanilla** Core includes a Settings panel and toast; **Astro** and **Svelte** Core scaffolds include theme persistence and toast (`showToast`, `removeToast`, `removeAllToasts`).
76
+ Use the same class names and HTML structure as in the [component docs](https://rizzo-css.vercel.app/docs/components). **Vanilla JS**, Astro, and Svelte all use the same CSS and BEM markup; choose **Full** to add framework component files via the component picker. Each scaffold has README-RIZZO.md; every install includes LICENSE-RIZZO. The **Navbar** component in the scaffold includes the default Cat logo in the brand link (optional `logo` prop for a custom image). The **Vanilla** Full template includes a Settings panel and toast; **Astro** and **Svelte** Full scaffolds include theme persistence and toast (`showToast`, `removeToast`, `removeAllToasts`).
76
77
 
77
78
  ## Themes
78
79