tera-system-ui 0.0.2 → 0.0.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tera-system-ui",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "scripts": {
     "dev": "vite dev",
     "build": "vite build && npm run package",
@@ -13,7 +13,8 @@
     "build-storybook": "storybook build"
   },
   "bin": {
-    "npm publisui": "./scripts/add-component-template.js"
+    "ui": "./scripts/add-component-template.js",
+    "gen": "./scripts/generate-ts-index.js"
   },
   "files": [
     "dist",
@@ -32,13 +33,30 @@
       "svelte": "./dist/index.js",
       "default": "./dist/index.js"
     },
-    "./themes/tw-preset": "./dist/themes/tw-preset.cjs"
+    "./i18n": {
+      "types": "./dist/i18n/index.d.ts",
+      "svelte": "./dist/i18n/index.js",
+      "default": "./dist/i18n/index.js"
+    },
+    "./icons": {
+      "types": "./dist/components/icons/index.d.ts",
+      "svelte": "./dist/components/icons/index.js",
+      "default": "./dist/components/icons/index.js"
+    },
+    "./command": {
+      "types": "./dist/components/command/index.d.ts",
+      "svelte": "./dist/components/command/index.js",
+      "default": "./dist/components/command/index.js"
+    },
+    "./themes/tw-preset": "./dist/themes/tw-preset.cjs",
+    "./themes/tera-ui-base": "./dist/themes/tera-ui-base.css"
   },
   "peerDependencies": {
     "svelte": "^5.0.0"
   },
   "devDependencies": {
-    "@chromatic-com/storybook": "^1.9.0",
+    "@chromatic-com/storybook": "^3.2.1",
+    "@inlang/paraglide-js": "1.11.3",
     "@storybook/addon-essentials": "^8.3.6",
     "@storybook/addon-interactions": "^8.3.6",
     "@storybook/addon-links": "^8.3.6",
@@ -50,24 +68,26 @@
     "@storybook/svelte": "^8.3.6",
     "@storybook/sveltekit": "^8.3.6",
     "@storybook/test": "^8.3.6",
-    "@sveltejs/adapter-auto": "^3.0.0",
-    "@sveltejs/kit": "^2.0.0",
-    "@sveltejs/package": "^2.0.0",
+    "@sveltejs/adapter-auto": "^3.3.1",
+    "@sveltejs/kit": "^2.7.3",
+    "@sveltejs/package": "^2.3.7",
     "@sveltejs/vite-plugin-svelte": "^4.0.0",
+    "@tabler/icons-svelte": "^3.21.0",
     "autoprefixer": "^10.4.20",
-    "publint": "^0.2.0",
-    "sass-embedded": "^1.80.4",
+    "clsx": "^2.1.1",
+    "npx": "^10.2.2",
+    "publint": "^0.2.12",
+    "sass-embedded": "^1.80.5",
     "storybook": "^8.3.6",
-    "svelte": "^5.0.0",
-    "svelte-check": "^4.0.0",
-    "tailwindcss": "^3.4.9",
-    "typescript": "^5.0.0",
-    "vite": "^5.0.11",
-    "npx": "^10.2.2"
+    "svelte": "^5.1.6",
+    "svelte-check": "^4.0.5",
+    "tailwind-variants": "^0.2.1",
+    "tailwindcss": "^3.4.14",
+    "typescript": "^5.6.3",
+    "vite": "^5.4.10"
   },
   "dependencies": {
-    "@tabler/icons-svelte": "^3.20.0",
-    "tailwind-variants": "^0.2.1",
-    "clsx": "^2.1.1"
+    "@floating-ui/dom": "^1.6.12",
+    "@inlang/paraglide-sveltekit": "0.11.5"
   }
 }

package/scripts/generate-ts-index.js

@@ -0,0 +1,137 @@
+import fs from "fs";
+
+import path from "path";
+
+
+/**
+ * Recursively finds all "index.ts" files in the given folder path.
+ * @param {string} folderPath - The root directory to start the search.
+ * @returns {Array} - List of objects containing `filePath` and `content` of each "index.ts" file.
+ */
+function findIndexFiles(folderPath) {
+    const result = [];
+
+    function searchFolder(currentPath) {
+        const filesAndDirs = fs.readdirSync(currentPath);
+
+        for (const item of filesAndDirs) {
+            const itemPath = path.join(currentPath, item);
+            const stats = fs.statSync(itemPath);
+
+            if (stats.isDirectory()) {
+                // Recursively search in subdirectories
+                searchFolder(itemPath);
+            } else if (item === "index.ts") {
+                // Read file content if the file is "index.ts"
+                const content = fs.readFileSync(itemPath, "utf-8");
+                result.push({filePath: itemPath, content});
+            }
+        }
+    }
+
+    searchFolder(folderPath);
+    return result;
+}
+
+
+/**
+ * Extracts export names from a given JavaScript file content.
+ * @param {string} filePath - The path to the JavaScript file.
+ * @returns {Array} - An array of export names.
+ */
+function extractExportNames(filePath) {
+    const fileContent = fs.readFileSync(filePath, "utf-8");
+    const exportNames = [];
+
+    // Regular expressions to match the export names
+    const defaultExportRegex = /export\s*{\s*default\s+as\s+(\w+)/g;
+    const namedExportRegex = /export\s*{(\w+)\s*}/g;
+
+    let match;
+
+    // Find all matches for `export { default as ... }`
+    while ((match = defaultExportRegex.exec(fileContent)) !== null) {
+        exportNames.push(match[1]);
+    }
+
+    // Find all matches for `export { namedExport }`
+    while ((match = namedExportRegex.exec(fileContent)) !== null) {
+        exportNames.push(match[1]);
+    }
+
+    return exportNames;
+}
+
+
+/**
+ * Recursively finds all files in a given folder path that match the name pattern.
+ * @param {string} folderPath - The root directory to start the search.
+ * @param {RegExp} namePattern - The regular expression pattern to match file names.
+ * @returns {Array} - List of file names that match the pattern.
+ */
+function findFilesByPattern(folderPath, namePattern) {
+    const result = [];
+
+    function searchFolder(currentPath) {
+        const filesAndDirs = fs.readdirSync(currentPath);
+
+        for (const item of filesAndDirs) {
+            const itemPath = path.join(currentPath, item);
+            const stats = fs.statSync(itemPath);
+
+            if (stats.isDirectory()) {
+                // Recursively search in subdirectories
+                searchFolder(itemPath);
+            } else if (namePattern.test(item)) {
+                // If the file name matches the pattern, add to result
+                result.push(item);
+            }
+        }
+    }
+
+    searchFolder(folderPath);
+    return result;
+}
+
+const GLOBAL_INDEX_PATH = "../src/lib/index.ts"
+const COMPONENTS_PATH = "../src/lib/components"
+const ICON_COMPONENTS_PATH = "../src/lib/components/icons"
+
+const iconComponentsFileList = findFilesByPattern(ICON_COMPONENTS_PATH, /^Icon\w*\.svelte$/);
+
+// generate icon index
+const importSvelteComponentTemplate = `export {default as Component} from './Component.svelte'`;
+const importComponentTemplate = `export {Component} from 'path'`;
+
+
+(() => {
+    let content = ''
+    iconComponentsFileList.forEach(file => {
+        let componentName = file.replace('.svelte', '')
+        content += importSvelteComponentTemplate.replaceAll('Component', componentName);
+        content += `\n`
+    })
+
+    fs.writeFileSync(ICON_COMPONENTS_PATH + '/index.ts', content, 'utf8');
+})();
+
+
+(() => {
+    const indexFileList = findIndexFiles(COMPONENTS_PATH);
+    let content = ''
+
+    indexFileList.forEach(file => {
+        let components = extractExportNames(file.filePath)
+        if (components.length === 0) return
+
+        let importFromPath = './components/' + file.filePath.split(`\\components\\`)[1].replace('\\index.ts', '');
+
+        content += importComponentTemplate.replace('path', importFromPath)
+            .replace('Component', components.join(', '));
+        content += '\n';
+    });
+
+    console.log(content)
+    fs.writeFileSync(GLOBAL_INDEX_PATH, content, 'utf8');
+
+})()

package/dist/components/input/input.d.ts

@@ -1,49 +0,0 @@
-import { type VariantProps } from "tailwind-variants";
-export declare const styles: import("tailwind-variants").TVReturnType<{
-    size: {
-        sm: string;
-        md: string;
-        lg: string;
-    };
-}, undefined, "border rounded focus:outline-none focus:ring-2 transition-shadow", import("tailwind-variants/dist/config").TVConfig<{
-    size: {
-        sm: string;
-        md: string;
-        lg: string;
-    };
-}, {
-    size: {
-        sm: string;
-        md: string;
-        lg: string;
-    };
-}>, {
-    size: {
-        sm: string;
-        md: string;
-        lg: string;
-    };
-}, undefined, import("tailwind-variants").TVReturnType<{
-    size: {
-        sm: string;
-        md: string;
-        lg: string;
-    };
-}, undefined, "border rounded focus:outline-none focus:ring-2 transition-shadow", import("tailwind-variants/dist/config").TVConfig<{
-    size: {
-        sm: string;
-        md: string;
-        lg: string;
-    };
-}, {
-    size: {
-        sm: string;
-        md: string;
-        lg: string;
-    };
-}>, unknown, unknown, undefined>>;
-type InputVariants = VariantProps<typeof styles>;
-export interface InputProps extends InputVariants {
-    children: any;
-}
-export {};

package/dist/components/input/input.js

@@ -1,14 +0,0 @@
-import { tv } from "tailwind-variants";
-export const styles = tv({
-    base: 'border rounded focus:outline-none focus:ring-2 transition-shadow', // Base styles
-    variants: {
-        size: {
-            sm: 'px-2 py-1 text-sm', // Small size styles
-            md: 'px-3 py-2 text-base', // Medium size styles
-            lg: 'px-4 py-3 text-lg', // Large size styles
-        },
-    },
-    defaultVariants: {
-        size: 'md',
-    },
-});

package/dist/components/side-navigation/clickOutside.d.ts

@@ -1,4 +0,0 @@
-/** Dispatch event on click outside of node */
-export declare function clickOutside(node: any): {
-    destroy(): void;
-};