create-ui0 0.1.5 → 0.1.7

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.
package/dist/index.js CHANGED
@@ -80,6 +80,28 @@ const onCancel = () => {
80
80
  console.log('aborted');
81
81
  process.exit(0);
82
82
  };
83
+ /** the @ui0 specs a template manifest carries (deps + devDeps merged) */
84
+ const ui0Specs = (manifest) => Object.entries({ ...manifest.dependencies, ...manifest.devDependencies }).filter(([name]) => name.startsWith('@ui0/'));
85
+ /**
86
+ * startup banner: own version + the @ui0 package specs the scaffold can
87
+ * pull (base template deps, per-feature deps, the nuxt host additions) -
88
+ * everything read from the manifests/FEATURES, never hardcoded
89
+ */
90
+ const showBanner = () => {
91
+ const own = JSON.parse(readFileSync(new URL('../package.json', import.meta.url), 'utf8'));
92
+ const base = JSON.parse(readFileSync(path.join(templateDir, 'package.json.tpl'), 'utf8'));
93
+ const nuxt = JSON.parse(readFileSync(path.join(templateNuxtDir, 'package.json.tpl'), 'utf8'));
94
+ const baseDeps = ui0Specs(base);
95
+ const nuxtExtra = ui0Specs(nuxt).filter(([name]) => !baseDeps.some(([baseName]) => baseName === name));
96
+ console.log(`\ncreate-ui0 v${own.version}\n`);
97
+ console.log(` always: ${baseDeps.map(([n, s]) => `${n} ${s}`).join(', ')}`);
98
+ for (const feature of FEATURES) {
99
+ console.log(` ${feature.id}: ${Object.entries(feature.deps).map(([n, s]) => `${n} ${s}`).join(', ')}`);
100
+ }
101
+ if (nuxtExtra.length)
102
+ console.log(` nuxt adds: ${nuxtExtra.map(([n, s]) => `${n} ${s}`).join(', ')}`);
103
+ console.log();
104
+ };
83
105
  /**
84
106
  * `create-ui0 component [Name]` - scaffolds a single component folder from
85
107
  * template-component/ into the project at cwd (src/components/<kebab>/).
@@ -139,6 +161,7 @@ const run = async () => {
139
161
  const argDir = process.argv[2];
140
162
  const argHost = process.argv[3];
141
163
  const argFeatures = process.argv[4]?.split(',').filter(Boolean);
164
+ showBanner();
142
165
  const { dir } = await prompts({
143
166
  type: argDir ? null : 'text',
144
167
  name: 'dir',
@@ -205,12 +228,13 @@ const run = async () => {
205
228
  const nuxtConfigPath = path.join(target, 'nuxt.config.ts');
206
229
  const withIcons = features.includes('icon');
207
230
  const configSrc = readFileSync(nuxtConfigPath, 'utf8')
208
- .replace('/* FEATURE_VITE_IMPORT */', withIcons ? "import { fileURLToPath } from 'node:url'\n\nimport ViteUi0Icon from '@ui0/icon/vite'\n" : '')
231
+ .replace('/* FEATURE_VITE_IMPORT */', withIcons ? "import ViteUi0Icon from '@ui0/icon/vite'\n" : '')
209
232
  .replace('/* FEATURE_VITE_PLUGINS */',
210
- // absolute on purpose: nuxt's vite root is the app/ dir, relative
211
- // dirs would resolve against it. dir is the scan root - an svg at
212
- // <dir>/icons/bookmark.svg is addressed 'assets/icons/bookmark'
213
- withIcons ? "ViteUi0Icon({ dir: fileURLToPath(new URL('./assets', import.meta.url)) })" : '')
233
+ // dir is the scan root - an svg at <dir>/icons/bookmark.svg is
234
+ // addressed 'assets/icons/bookmark'. Relative dirs resolve against
235
+ // the vite root, walking up to the project root when missing (nuxt
236
+ // roots vite at app/)
237
+ withIcons ? "ViteUi0Icon({ dir: './assets' })" : '')
214
238
  .replace('/* FEATURE_CSS */',
215
239
  // the placeholder trails the array's first entry - lead with a comma
216
240
  picked.length ? `,\n ${picked.flatMap((f) => f.cssLines ?? []).join(',\n ')}` : '');
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "create-ui0",
3
- "version": "0.1.5",
3
+ "version": "0.1.7",
4
4
  "description": "Scaffold a ui0 (Vue + @ui0) app - npm create ui0",
5
5
  "type": "module",
6
6
  "bin": {
@@ -1,17 +1,15 @@
1
1
  <template>
2
- <div
3
- data-0="{%kebab%}"
4
- :class="$styles.{%camel%}">
2
+ <div :class="$styles.{%camel%}">
5
3
  <slot />
6
4
  </div>
7
5
  </template>
8
6
 
9
7
  <script setup lang="ts">
10
- import { useCssModule } from 'vue'
8
+ import { useCssModule } from 'vue'
11
9
 
12
- import type { {%Pascal%}Props } from './{%kebab%}.types'
13
- import './{%kebab%}.module.css'
10
+ import type { {%Pascal%}Props } from './{%kebab%}.types'
11
+ import './{%kebab%}.module.css'
14
12
 
15
- const props = withDefaults(defineProps<{%Pascal%}Props>(), {})
16
- const $styles = useCssModule()
13
+ const props = withDefaults(defineProps<{%Pascal%}Props>(), {})
14
+ const $styles = useCssModule()
17
15
  </script>
@@ -10,7 +10,7 @@
10
10
  },
11
11
  "dependencies": {
12
12
  "@ui0/core": "^0.1.5",
13
- "@ui0/nuxt": "^0.1.2",
13
+ "@ui0/nuxt": "^0.1.3",
14
14
  "@ui0/theme": "^0.1.5",
15
15
  "nuxt": "^4.6.4",
16
16
  "vue": "^3.5.45"