@dropi/ui 0.1.46 → 0.1.49

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dropi/ui",
-  "version": "0.1.46",
+  "version": "0.1.49",
   "description": "Dropi Design System — Web Components for Angular, React and Vue",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -51,7 +51,7 @@
     "packages/*"
   ],
   "scripts": {
-    "build": "stencil build && npm run build --workspace=packages/react && npm run build --workspace=packages/angular",
+    "build": "node scripts/generate-icon-map.js && stencil build && npm run build --workspace=packages/react && npm run build --workspace=packages/angular",
     "clear:cache": "node -e \"const fs=require('fs');['.stencil','node_modules/.cache'].forEach(p=>{try{fs.rmSync(p,{recursive:true,force:true})}catch(e){}})\"",
     "publish:react": "npm run build && npm publish --workspace=packages/react",
     "dev": "stencil build --dev --watch & npm run watch --workspace=packages/react",

package/scripts/generate-icon-map.js

@@ -0,0 +1,37 @@
+#!/usr/bin/env node
+const fs = require('fs');
+const path = require('path');
+
+const spriteFile = path.join(__dirname, '..', 'node_modules', 'dropi-lib-icons', 'dist', 'sprite.svg');
+const outFile = path.join(__dirname, '..', 'src', 'utils', 'icon-map.generated.ts');
+
+if (!fs.existsSync(spriteFile)) {
+  console.error('❌  sprite.svg not found — run: npm install dropi-lib-icons');
+  process.exit(1);
+}
+
+const svg = fs.readFileSync(spriteFile, 'utf8');
+const symbolRegex = /<symbol\s+id="([^"]+)"\s+viewBox="([^"]+)">([\s\S]*?)<\/symbol>/g;
+
+const entries = [];
+let match;
+
+while ((match = symbolRegex.exec(svg)) !== null) {
+  const [, id, viewBox, inner] = match;
+  // Minify inner content
+  const paths = inner.replace(/\s+/g, ' ').trim();
+  entries.push(`  '${id}': { viewBox: '${viewBox}', paths: \`${paths}\` }`);
+}
+
+const output = `// Auto-generated by scripts/generate-icon-map.js — DO NOT EDIT
+// Source: dropi-lib-icons/dist/sprite.svg (${entries.length} icons)
+export const ICON_MAP: Record<string, { viewBox: string; paths: string }> = {
+${entries.join(',\n')}
+};
+`;
+
+const dir = path.dirname(outFile);
+if (!fs.existsSync(dir)) fs.mkdirSync(dir, { recursive: true });
+
+fs.writeFileSync(outFile, output);
+console.log(`✅  Generated ${entries.length} icons → src/utils/icon-map.generated.ts`);

package/scripts/generate-illustration-map.js

@@ -0,0 +1,37 @@
+#!/usr/bin/env node
+// Generates src/utils/illustration-map.generated.ts from public/assets/icons/ilustration/
+const fs = require('fs');
+const path = require('path');
+
+const STATES = ['default', 'loading', 'sorry', 'love', 'success', 'error', 'warning', 'info'];
+const srcDir = path.join(__dirname, '..', 'public', 'assets', 'icons', 'ilustration');
+const outFile = path.join(__dirname, '..', 'src', 'utils', 'illustration-map.generated.ts');
+
+const entries = [];
+
+for (const state of STATES) {
+  const file = path.join(srcDir, `${state}.svg`);
+  if (!fs.existsSync(file)) {
+    console.warn(`⚠️  Missing illustration: ${state}.svg — skipping`);
+    continue;
+  }
+  const svg = fs.readFileSync(file, 'utf8').replace(/`/g, '\\`').replace(/\$/g, '\\$');
+  entries.push(`  '${state}': \`${svg}\``);
+}
+
+if (entries.length === 0) {
+  console.error('❌  No illustration files found in', srcDir);
+  process.exit(1);
+}
+
+const output = `// Auto-generated by scripts/generate-illustration-map.js — DO NOT EDIT
+// Source: public/assets/icons/ilustration/ (${entries.length} illustrations)
+export const ILLUSTRATION_MAP: Record<string, string> = {
+${entries.join(',\n')}
+};
+`;
+
+const dir = path.dirname(outFile);
+if (!fs.existsSync(dir)) fs.mkdirSync(dir, { recursive: true });
+fs.writeFileSync(outFile, output);
+console.log(`✅  Generated ${entries.length} illustrations → src/utils/illustration-map.generated.ts`);

package/scripts/generate-lottie-map.js

@@ -0,0 +1,49 @@
+#!/usr/bin/env node
+// Generates src/utils/lottie-map.generated.ts from public/assets/lottie-files/
+const fs = require('fs');
+const path = require('path');
+
+// Keys match dropi-alert-modal's lottieMap; values are the JSON file names
+const ENTRIES = [
+  { key: 'question', file: 'question.json' },
+  { key: 'warning',  file: 'warning.json'  },
+  { key: 'success',  file: 'success.json'  },
+  { key: 'error',    file: 'failure.json'  },
+  { key: 'loading',  file: 'loading.json'  },
+];
+
+const srcDir = path.join(__dirname, '..', 'public', 'assets', 'lottie-files');
+const outFile = path.join(__dirname, '..', 'src', 'utils', 'lottie-map.generated.ts');
+
+const lines = [];
+
+for (const { key, file } of ENTRIES) {
+  const filePath = path.join(srcDir, file);
+  if (!fs.existsSync(filePath)) {
+    console.warn(`⚠️  Missing lottie file: ${file} — skipping`);
+    continue;
+  }
+  // Store as a minified JSON string to avoid runtime JSON.stringify cost
+  const json = JSON.stringify(JSON.parse(fs.readFileSync(filePath, 'utf8')));
+  // Escape backticks and template literal dollar signs
+  const escaped = json.replace(/`/g, '\\`').replace(/\$/g, '\\$');
+  lines.push(`  '${key}': \`${escaped}\``);
+}
+
+if (lines.length === 0) {
+  console.error('❌  No lottie files found in', srcDir);
+  process.exit(1);
+}
+
+const output = `// Auto-generated by scripts/generate-lottie-map.js — DO NOT EDIT
+// Source: public/assets/lottie-files/ (${lines.length} animations)
+// Passed as JSON string to lottie-player's src attribute.
+export const LOTTIE_MAP: Record<string, string> = {
+${lines.join(',\n')}
+};
+`;
+
+const dir = path.dirname(outFile);
+if (!fs.existsSync(dir)) fs.mkdirSync(dir, { recursive: true });
+fs.writeFileSync(outFile, output);
+console.log(`✅  Generated ${lines.length} lottie animations → src/utils/lottie-map.generated.ts`);