nativescript-web-adapter 0.1.1 → 0.1.3

package/tools/modules/appPatch.cjs

@@ -0,0 +1,27 @@
+const fs = require('fs');
+const path = require('path');
+
+function patchAppForWeb(webDir) {
+  try {
+    const appPath = path.join(webDir, 'src', 'app.ts');
+    if (!fs.existsSync(appPath)) {
+      console.warn('[web-adapter] 未找到 app.ts，跳过 app 修补');
+      return;
+    }
+
+    // 动态扫描 websfc 组件目录，生成 import 与注册语句
+    const websfcDir = path.join(webDir, 'src', 'components', 'websfc');
+    const entries = fs.existsSync(websfcDir) ? fs.readdirSync(websfcDir) : [];
+    const vueFiles = entries.filter(f => f.endsWith('.vue'));
+    const imports = vueFiles.map(f => `import ${path.basename(f, '.vue')} from './components/websfc/${f}';`).join('\n');
+    const registers = vueFiles.map(f => `app.component("${path.basename(f, '.vue')}", ${path.basename(f, '.vue')});`).join('\n');
+    const content = `${imports}\nimport * as ns from './composables/websfc/index.ts';\nimport { createApp } from 'vue';\nimport { initGlobals } from "./globals";\nimport router from './router';\nimport App from './App.vue';\nimport './app.css';\n\ninitGlobals();\n\nconst app = createApp(App);\n\n// Register web components\n${registers}\n\n// Register global composables for dialogs, frame, page, etc.\napp.config.globalProperties.$ns = ns;\n\napp.use(router);\napp.mount('#app');`;
+
+    fs.writeFileSync(appPath, content, 'utf8');
+    console.log('[web-adapter] 已修补 app.ts');
+  } catch (err) {
+    console.error('[web-adapter] 修补 app.ts 时出错:', err);
+  }
+}
+
+module.exports = { patchAppForWeb };

package/tools/modules/copy.cjs

@@ -0,0 +1,84 @@
+const fs = require('fs');
+const path = require('path');
+
+function copyAdapterComponents(srcDir, destDir) {
+  if (!fs.existsSync(srcDir)) {
+    console.warn('[web-adapter] 适配器组件目录不存在:', srcDir);
+    return;
+  }
+  if (!fs.existsSync(destDir)) {
+    fs.mkdirSync(destDir, { recursive: true });
+  }
+  const entries = fs.readdirSync(srcDir, { withFileTypes: true });
+  for (const entry of entries) {
+    const srcPath = path.join(srcDir, entry.name);
+    const destPath = path.join(destDir, entry.name);
+    if (entry.isDirectory()) {
+      if (!fs.existsSync(destPath)) fs.mkdirSync(destPath, { recursive: true });
+      copyAdapterComponents(srcPath, destPath);
+    } else {
+      try {
+        fs.copyFileSync(srcPath, destPath);
+      } catch (err) {
+        console.error('[web-adapter] 复制组件失败:', srcPath, err);
+      }
+    }
+  }
+}
+
+function copyAdapterComposables(srcDir, destDir) {
+  if (!fs.existsSync(srcDir)) {
+    console.warn('[web-adapter] 适配器 composables 目录不存在:', srcDir);
+    return;
+  }
+  if (!fs.existsSync(destDir)) {
+    fs.mkdirSync(destDir, { recursive: true });
+  }
+  const entries = fs.readdirSync(srcDir, { withFileTypes: true });
+  for (const entry of entries) {
+    const srcPath = path.join(srcDir, entry.name);
+    const destPath = path.join(destDir, entry.name);
+    if (entry.isDirectory()) {
+      if (!fs.existsSync(destPath)) fs.mkdirSync(destPath, { recursive: true });
+      copyAdapterComposables(srcPath, destPath);
+    } else {
+      try {
+        fs.copyFileSync(srcPath, destPath);
+      } catch (err) {
+        console.error('[web-adapter] 复制 composable 文件失败:', srcPath, err);
+      }
+    }
+  }
+}
+
+function copySourceFiles(src, dest, transformContent) {
+  if (!fs.existsSync(src)) {
+    console.warn('[web-adapter] 源代码目录不存在:', src);
+    return;
+  }
+  if (!fs.existsSync(dest)) {
+    fs.mkdirSync(dest, { recursive: true });
+  }
+  const entries = fs.readdirSync(src, { withFileTypes: true });
+  for (const entry of entries) {
+    const srcPath = path.join(src, entry.name);
+    const destPath = path.join(dest, entry.name);
+    if (entry.isDirectory()) {
+      copySourceFiles(srcPath, destPath, transformContent);
+    } else {
+      try {
+        let content = fs.readFileSync(srcPath, 'utf8');
+        content = transformContent ? transformContent(content, srcPath) : content;
+        fs.writeFileSync(destPath, content);
+      } catch (err) {
+        console.error('[web-adapter] 复制文件失败:', srcPath, err);
+      }
+    }
+  }
+}
+
+module.exports = {
+  copyAdapterComponents,
+  copyAdapterComposables,
+  copySourceFiles,
+};

package/tools/modules/router.cjs

@@ -0,0 +1,46 @@
+const fs = require('fs');
+const path = require('path');
+
+function buildRouterFromPages(webDir) {
+  const pagesDir = path.join(webDir, 'src', 'pages');
+  const lines = [];
+  lines.push(`import { createRouter, createWebHistory } from 'vue-router'`);
+  let routes = [];
+  if (fs.existsSync(pagesDir)) {
+    const entries = fs.readdirSync(pagesDir, { withFileTypes: true });
+    for (const entry of entries) {
+      if (!entry.isFile()) continue;
+      if (!/\.vue$/i.test(entry.name)) continue;
+      const base = entry.name.replace(/\.vue$/i, '');
+      const importName = toIdentifier(base);
+      lines.push(`import ${importName} from '../pages/${entry.name}'`);
+      const routePath = base.toLowerCase() === 'index' ? '/' : `/${base}`;
+      routes.push(`  { path: '${routePath}', name: '${base}', component: ${importName} }`);
+    }
+  }
+  if (routes.length === 0) {
+    lines.push(`import Home from '../components/Home.vue'`);
+    routes.push(`  { path: '/', name: 'Home', component: Home }`);
+  }
+  lines.push('');
+  lines.push('const routes = [');
+  lines.push(routes.join(',\n'));
+  lines.push(']');
+  lines.push('');
+  lines.push('const router = createRouter({');
+  lines.push('  history: createWebHistory(),');
+  lines.push('  routes');
+  lines.push('})');
+  lines.push('');
+  lines.push('export default router');
+  return lines.join('\n');
+}
+
+function toIdentifier(name) {
+  let id = name.replace(/[^a-zA-Z0-9_$]/g, '_');
+  if (/^[0-9]/.test(id)) id = '_' + id;
+  id = id.replace(/(^|_)([a-z])/g, (m, p1, p2) => p1 + p2.toUpperCase());
+  return id;
+}
+
+module.exports = { buildRouterFromPages, toIdentifier };

package/tools/modules/templates.cjs

@@ -0,0 +1,130 @@
+const fs = require('fs');
+const path = require('path');
+
+function createWebPlatformFiles(webDir) {
+  const projectRoot = path.dirname(path.dirname(webDir));
+  // 创建或更新 package.json
+  fs.writeFileSync(path.join(webDir, 'package.json'), JSON.stringify({
+    "name": "web-platform",
+    "version": "1.0.0",
+    "private": true,
+    "scripts": {
+      "dev": "vite",
+      "build": "vue-tsc --noEmit && vite build",
+      "preview": "vite preview"
+    },
+    "dependencies": {
+      "vue": "^3.3.4",
+      "vue-router": "^4.2.5"
+    },
+    "devDependencies": {
+      "@vitejs/plugin-vue": "^4.2.3",
+      "typescript": "^5.0.2",
+      "vite": "^4.4.5",
+      "vue-tsc": "^1.8.5",
+      "autoprefixer": "^10.4.16",
+      "postcss": "^8.4.31",
+      "tailwindcss": "^3.4.0"
+    }
+  }, null, 2));
+
+  // index.html
+  fs.writeFileSync(path.join(webDir, 'index.html'), `<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>NS Vue Web</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/app.ts"></script>
+  </body>
+</html>`);
+
+  // vite.config.ts
+  const packageJson = { 
+    name: "ns-vue-web-platform",
+    private: true,
+    scripts: {
+      dev: "vite",
+      build: "vite build"
+    },
+    dependencies: {
+      "vue": "^3.4.0",
+      "vue-router": "^4.2.5"
+    },
+    devDependencies: {
+      "@vitejs/plugin-vue": "^5.0.0",
+      "typescript": "^5.0.0",
+      "vite": "^5.0.0",
+      "autoprefixer": "^10.4.16",
+      "postcss": "^8.4.31",
+      "tailwindcss": "^3.4.0"
+    }
+  };
+  fs.writeFileSync(
+    path.join(webDir, 'package.json'),
+    JSON.stringify(packageJson, null, 2)
+  );
+  const viteConfig = `import { defineConfig } from 'vite';
+import vue from '@vitejs/plugin-vue';
+import path from 'path';
+
+export default defineConfig({
+  plugins: [vue()],
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, './src')
+    }
+  },
+  server: {
+    port: 3005,
+    strictPort: false
+  }
+});`;
+  fs.writeFileSync(path.join(webDir, 'vite.config.ts'), viteConfig);
+
+  // postcss & tailwind configs: 复用根配置（如果存在），否则写默认
+  const rootPostcss = path.join(projectRoot, 'postcss.config.js');
+  const rootTailwind = path.join(projectRoot, 'tailwind.config.js');
+  try {
+    if (fs.existsSync(rootPostcss)) {
+      fs.copyFileSync(rootPostcss, path.join(webDir, 'postcss.config.js'));
+    } else {
+      const postcssConfig = `module.exports = {\n  plugins: {\n    tailwindcss: {},\n    autoprefixer: {},\n  },\n};`;
+      fs.writeFileSync(path.join(webDir, 'postcss.config.js'), postcssConfig);
+    }
+  } catch (e) {
+    console.warn('[web-adapter] 复制 postcss 配置失败，使用默认:', e?.message);
+    const postcssConfig = `module.exports = {\n  plugins: {\n    tailwindcss: {},\n    autoprefixer: {},\n  },\n};`;
+    fs.writeFileSync(path.join(webDir, 'postcss.config.js'), postcssConfig);
+  }
+  try {
+    if (fs.existsSync(rootTailwind)) {
+      fs.copyFileSync(rootTailwind, path.join(webDir, 'tailwind.config.js'));
+    } else {
+      const tailwindConfig = `/** @type {import('tailwindcss').Config} */\nmodule.exports = {\n  content: [\n    "./index.html",\n    "./src/**/*.{vue,js,ts,jsx,tsx}",\n  ],\n  theme: {\n    extend: {},\n  },\n  plugins: [],\n};`;
+      fs.writeFileSync(path.join(webDir, 'tailwind.config.js'), tailwindConfig);
+    }
+  } catch (e) {
+    console.warn('[web-adapter] 复制 tailwind 配置失败，使用默认:', e?.message);
+    const tailwindConfig = `/** @type {import('tailwindcss').Config} */\nmodule.exports = {\n  content: [\n    "./index.html",\n    "./src/**/*.{vue,js,ts,jsx,tsx}",\n  ],\n  theme: {\n    extend: {},\n  },\n  plugins: [],\n};`;
+    fs.writeFileSync(path.join(webDir, 'tailwind.config.js'), tailwindConfig);
+  }
+
+  // App.vue（根组件占位，仅渲染 <router-view/>）
+  const appVueContent = `<template>
+  <router-view></router-view>
+</template>
+
+<script setup lang="ts">
+// App root component
+</script>`;
+  const appVuePath = path.join(webDir, 'src', 'App.vue');
+  const srcDir = path.join(webDir, 'src');
+  if (!fs.existsSync(srcDir)) fs.mkdirSync(srcDir, { recursive: true });
+  fs.writeFileSync(appVuePath, appVueContent, 'utf8');
+}
+
+module.exports = { createWebPlatformFiles };

package/tools/modules/transform.cjs

@@ -0,0 +1,93 @@
+// Transform module: handle script-level transformations only
+// - Replace 'nativescript-vue' imports with 'vue'
+// - Remove '@nativescript/core' and adapter imports
+// - Clean platform-specific globals and handlers
+// - Keep template tags intact for custom web components to handle
+
+function transformContent(content, srcPath) {
+  // globals.ts shim for web
+  if (srcPath && /globals\.ts$/.test(srcPath)) {
+    return "export function initGlobals() { /* web shim: no-op */ }\n";
+  }
+
+  // Import replacements
+  content = content.replace(/from\s+['\"](nativescript-vue)['\"]/g, "from 'vue'");
+  content = content.replace(/import\s+.*@nativescript\/core.*;?\n?/g, '');
+  content = content.replace(/import\s+.*nativescript-web-adapter.*;?\n?/g, '');
+
+  // Platform/global cleanup
+  content = content.replace(/declare\s+var\s+com[:\s\w]*;?\n?/g, '');
+
+  // Demo-specific native function replacement
+  content = content.replace(/function\s+enterNow\([^\)]*\)\s*\{[\s\S]*?\}\n?/g, "function enterNow() { window.open(\"https://viteconf.amsterdam\", '_blank'); }\n");
+  content = content.replace(/function\s+enterNow\([^\)]*\)\s*\{[\s\S]*?\}\s*[\s\S]*?let interval/g, 'function enterNow() { window.open("https://viteconf.amsterdam", \'_blank\'); }\n\nlet interval');
+
+  // Navigation: compile-time transform for web
+  // $navigateTo(Test) -> router.push('/Test')
+  // $navigateBack()   -> router.go(-1)
+  // Frame.navigate(...) -> router.push('/...')
+  // Frame.goBack()      -> router.go(-1)
+  if (srcPath && /\.vue$/i.test(srcPath)) {
+    const hasNavigateTo = /\$navigateTo\(\s*[A-Za-z_][A-Za-z0-9_]*\s*\)/.test(content);
+    const hasNavigateBack = /\$navigateBack\(\s*\)/.test(content);
+    const hasFrameNav = /Frame\.(navigate|goBack)\(/.test(content);
+    const hasFrameTopmost = /Frame\.topmost\(\)\.(navigate|goBack)\(/.test(content);
+    if (hasNavigateTo || hasNavigateBack || hasFrameNav || hasFrameTopmost) {
+      // Replace any property chain ending with $navigateTo(Symbol) -> router.push('/Symbol')
+      content = content.replace(/(?:this\.|[A-Za-z_$]+\?\.|[A-Za-z_$]+\.)*\$navigateTo\(\s*([A-Za-z_][A-Za-z0-9_]*)\s*\)/g, "router.push('/$1')");
+      // Replace any property chain ending with $navigateBack() -> router.go(-1)
+      content = content.replace(/(?:this\.|[A-Za-z_$]+\?\.|[A-Za-z_$]+\.)*\$navigateBack\(\s*\)/g, 'router.go(-1)');
+      // Replace Frame.goBack() -> router.go(-1)
+      content = content.replace(/Frame\.goBack\(\s*\)/g, 'router.go(-1)');
+      // Replace Frame.navigate(Identifier) -> router.push('/Identifier')
+      content = content.replace(/Frame\.navigate\(\s*([A-Za-z_][A-Za-z0-9_]*)\s*\)/g, "router.push('/$1')");
+      // Replace Frame.navigate('pages/Test') or module path -> router.push('/Test')
+      content = content.replace(/Frame\.navigate\(\s*['\"]([^'\"]+)['\"]\s*\)/g, (m, p1) => {
+        const base = String(p1).split('/')?.pop()?.replace(/\.vue$/i, '') || p1;
+        return `router.push('/${base}')`;
+      });
+      // Replace Frame.navigate({ moduleName: 'pages/Test' }) -> router.push('/Test')
+      content = content.replace(/Frame\.navigate\(\s*\{[\s\S]*?moduleName\s*:\s*['\"]([^'\"]+)['\"][\s\S]*?\}\s*\)/g, (m, p1) => {
+        const base = String(p1).split('/')?.pop()?.replace(/\.vue$/i, '') || p1;
+        return `router.push('/${base}')`;
+      });
+      // Replace Frame.topmost().goBack() -> router.go(-1)
+      content = content.replace(/Frame\.topmost\(\)\.goBack\(\s*\)/g, 'router.go(-1)');
+      // Replace Frame.topmost().navigate(Identifier) -> router.push('/Identifier')
+      content = content.replace(/Frame\.topmost\(\)\.navigate\(\s*([A-Za-z_][A-Za-z0-9_]*)\s*\)/g, "router.push('/$1')");
+      // Replace Frame.topmost().navigate('pages/Test') -> router.push('/Test')
+      content = content.replace(/Frame\.topmost\(\)\.navigate\(\s*['\"]([^'\"]+)['\"]\s*\)/g, (m, p1) => {
+        const base = String(p1).split('/')?.pop()?.replace(/\.vue$/i, '') || p1;
+        return `router.push('/${base}')`;
+      });
+      // Replace Frame.topmost().navigate({ moduleName: 'pages/Test' }) -> router.push('/Test')
+      content = content.replace(/Frame\.topmost\(\)\.navigate\(\s*\{[\s\S]*?moduleName\s*:\s*['\"]([^'\"]+)['\"][\s\S]*?\}\s*\)/g, (m, p1) => {
+        const base = String(p1).split('/')?.pop()?.replace(/\.vue$/i, '') || p1;
+        return `router.push('/${base}')`;
+      });
+      // Ensure router import inside <script> block
+      if (!/import\s+router\s+from\s+['\"]@\/router['\"]/.test(content)) {
+        content = content.replace(/(<script[^>]*>)/i, "$1\nimport router from '@/router';\n");
+      }
+    }
+  }
+
+  // Remove platform residual lines and blocks
+  content = content.replace(/.*(nativeApp|android\.|UIApplication|NSURL|NSDictionary|com\.tns|intent|startActivity|android\.content).*/g, '');
+  content = content.replace(/else\s*\{[\s\S]*?\}/g, '');
+
+  // Fix markup formatting artifacts
+  content = content.replace(/\/\s+\/>/g, '\/>');
+
+  // Remove registerElement
+  content = content.replace(/registerElement\([^)]+\);?\n?/g, '// registerElement removed for web\n');
+
+  // Remove Application.on handlers if present
+  if (content.includes('__ANDROID__') || content.includes('Application.launchEvent')) {
+    content = content.replace(/Application\.on[\s\S]*?}\);/g, '');
+  }
+
+  return content;
+}
+
+module.exports = { transformContent };

package/dist/core.cjs

@@ -1,3 +0,0 @@
-'use strict';
-
-//# sourceMappingURL=core.cjs.map

package/dist/core.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"core.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/dist/core.js

@@ -1,2 +0,0 @@
-
-//# sourceMappingURL=core.js.map

package/dist/core.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"core.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/index.cjs

@@ -1,240 +0,0 @@
-'use strict';
-
-var vue = require('vue');
-
-const Label = vue.defineComponent({
-    name: 'NSLabel',
-    props: {
-        text: { type: String, default: '' },
-        horizontalAlignment: { type: String, default: undefined }
-    },
-    emits: ['tap'],
-    setup(props, { slots, attrs, emit }) {
-        var _a;
-        const style = {};
-        if (props.horizontalAlignment) {
-            const map = { center: 'center', left: 'left', right: 'right' };
-            style.textAlign = (_a = map[String(props.horizontalAlignment).toLowerCase()]) !== null && _a !== void 0 ? _a : undefined;
-        }
-        const onClick = (e) => emit('tap', { eventName: 'tap', object: e.currentTarget });
-        return () => vue.h('span', { style, onClick, ...attrs }, slots.default ? slots.default() : props.text);
-    }
-});
-
-const Button = vue.defineComponent({
-    name: 'NSButton',
-    props: {
-        text: { type: String, default: '' },
-        horizontalAlignment: { type: String, default: undefined }
-    },
-    emits: ['tap'],
-    setup(props, { emit, slots, attrs }) {
-        var _a;
-        const onClick = (e) => emit('tap', { eventName: 'tap', object: e.currentTarget });
-        const style = {};
-        if (props.horizontalAlignment) {
-            const map = {
-                center: 'center',
-                left: 'start',
-                right: 'end',
-                stretch: 'stretch'
-            };
-            style.justifySelf = (_a = map[String(props.horizontalAlignment).toLowerCase()]) !== null && _a !== void 0 ? _a : undefined;
-        }
-        return () => vue.h('button', { onClick, style, ...attrs }, slots.default ? slots.default() : props.text);
-    }
-});
-
-const StackLayout = vue.defineComponent({
-    name: 'NSStackLayout',
-    emits: ['tap'],
-    setup(_, { slots, attrs, emit }) {
-        const onClick = (e) => emit('tap', { eventName: 'tap', object: e.currentTarget });
-        return () => { var _a; return vue.h('div', { style: { display: 'flex', flexDirection: 'column' }, onClick, ...attrs }, (_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots)); };
-    }
-});
-
-const FlexboxLayout = vue.defineComponent({
-    name: 'NSFlexboxLayout',
-    props: {
-        flexDirection: { type: String, default: 'row' },
-        justifyContent: { type: String, default: 'flex-start' },
-        alignItems: { type: String, default: 'stretch' }
-    },
-    emits: ['tap'],
-    setup(props, { slots, attrs, emit }) {
-        const onClick = (e) => emit('tap', { eventName: 'tap', object: e.currentTarget });
-        return () => { var _a; return vue.h('div', { style: { display: 'flex', flexDirection: props.flexDirection, justifyContent: props.justifyContent, alignItems: props.alignItems }, onClick, ...attrs }, (_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots)); };
-    }
-});
-
-function parseTracks(tracks) {
-    if (!tracks)
-        return undefined;
-    return tracks.split(',').map(s => s.trim()).map(t => {
-        if (t === '*' || t === 'auto')
-            return t === '*' ? '1fr' : 'auto';
-        if (/^\d+$/.test(t))
-            return `${t}px`;
-        return t;
-    }).join(' ');
-}
-const GridLayout = vue.defineComponent({
-    name: 'NSGridLayout',
-    props: {
-        rows: { type: String, default: undefined },
-        columns: { type: String, default: undefined }
-    },
-    emits: ['tap'],
-    setup(props, { slots, attrs, emit }) {
-        var _a, _b;
-        const containerStyle = {
-            display: 'grid',
-            // NS 默认一列：确保子项按行堆叠，而不是同一行多列并排
-            gridTemplateColumns: (_a = parseTracks(props.columns)) !== null && _a !== void 0 ? _a : '1fr',
-            // 行可选；若未指定，默认自适应内容
-            gridTemplateRows: (_b = parseTracks(props.rows)) !== null && _b !== void 0 ? _b : undefined,
-            // 以“按行”自动布局，默认逐行堆叠
-            gridAutoFlow: 'row',
-            width: '100%',
-            height: '100%'
-        };
-        const mapChild = (child) => {
-            var _a, _b, _c, _d, _e, _f, _g, _h, _j;
-            if (!vue.isVNode(child))
-                return child;
-            const cprops = { ...(child.props || {}) };
-            const style = { ...(cprops.style || {}) };
-            // Row/Column placement: NativeScript uses 0-based indices; CSS Grid is 1-based
-            const row = (_a = cprops.row) !== null && _a !== void 0 ? _a : cprops['row'];
-            const col = (_c = (_b = cprops.col) !== null && _b !== void 0 ? _b : cprops['col']) !== null && _c !== void 0 ? _c : cprops.column;
-            if (row != null) {
-                const r = Number(row);
-                if (!isNaN(r))
-                    style.gridRowStart = r + 1;
-            }
-            if (col != null) {
-                const c = Number(col);
-                if (!isNaN(c))
-                    style.gridColumnStart = c + 1;
-            }
-            else {
-                // 未声明列时，强制放在第 1 列，避免隐式多列导致并排
-                style.gridColumnStart = 1;
-            }
-            // Horizontal alignment mapping
-            const ha = (_d = cprops.horizontalAlignment) !== null && _d !== void 0 ? _d : cprops['horizontalAlignment'];
-            if (ha) {
-                const map = {
-                    center: 'center',
-                    left: 'start',
-                    right: 'end',
-                    stretch: 'stretch'
-                };
-                style.justifySelf = (_e = map[String(ha).toLowerCase()]) !== null && _e !== void 0 ? _e : style.justifySelf;
-            }
-            // Vertical alignment mapping
-            const va = (_f = cprops.verticalAlignment) !== null && _f !== void 0 ? _f : cprops['verticalAlignment'];
-            if (va) {
-                const map = {
-                    center: 'center',
-                    top: 'start',
-                    bottom: 'end',
-                    stretch: 'stretch'
-                };
-                style.alignSelf = (_g = map[String(va).toLowerCase()]) !== null && _g !== void 0 ? _g : style.alignSelf;
-            }
-            // Row/Column span mapping
-            const rowSpan = (_h = cprops.rowSpan) !== null && _h !== void 0 ? _h : cprops['rowSpan'];
-            if (rowSpan != null) {
-                const rs = Number(rowSpan);
-                if (!isNaN(rs) && rs > 1)
-                    style.gridRowEnd = `span ${rs}`;
-            }
-            const colSpan = (_j = cprops.colSpan) !== null && _j !== void 0 ? _j : cprops['colSpan'];
-            if (colSpan != null) {
-                const cs = Number(colSpan);
-                if (!isNaN(cs) && cs > 1)
-                    style.gridColumnEnd = `span ${cs}`;
-            }
-            cprops.style = style;
-            return vue.h(child.type, cprops, child.children);
-        };
-        const onClick = (e) => emit('tap', { eventName: 'tap', object: e.currentTarget });
-        return () => {
-            var _a, _b;
-            const children = (_b = (_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots)) !== null && _b !== void 0 ? _b : [];
-            const mapped = children.map(mapChild);
-            return vue.h('div', { style: containerStyle, onClick, ...attrs }, mapped);
-        };
-    }
-});
-
-const Page = vue.defineComponent({
-    name: 'NSPage',
-    emits: ['tap'],
-    setup(_, { slots, attrs, emit }) {
-        const onClick = (e) => emit('tap', { eventName: 'tap', object: e.currentTarget });
-        return () => { var _a; return vue.h('main', { onClick, ...attrs }, (_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots)); };
-    }
-});
-
-const Frame = vue.defineComponent({
-    name: 'NSFrame',
-    setup(_, { slots, attrs }) {
-        return () => { var _a; return vue.h('div', { ...attrs }, (_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots)); };
-    }
-});
-
-const ActionBar = vue.defineComponent({
-    name: 'NSActionBar',
-    emits: ['tap'],
-    setup(_, { slots, attrs, emit }) {
-        const onClick = (e) => emit('tap', { eventName: 'tap', object: e.currentTarget });
-        return () => { var _a; return vue.h('header', { onClick, ...attrs }, (_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots)); };
-    }
-});
-
-const ImageCacheIt = vue.defineComponent({
-    name: 'ImageCacheIt',
-    props: {
-        src: { type: String, required: true },
-        stretch: { type: String, default: 'aspectFill' }
-    },
-    setup(props, { attrs }) {
-        const style = { width: '100%', display: 'block', objectPosition: 'center' };
-        if (props.stretch === 'aspectFill') {
-            style.objectFit = 'cover';
-        }
-        else if (props.stretch === 'aspectFit') {
-            style.objectFit = 'contain';
-        }
-        return () => vue.h('img', { src: props.src, style, ...attrs });
-    }
-});
-
-const NativeScriptWebPlugin = {
-    install(app) {
-        app.component('Label', Label);
-        app.component('Button', Button);
-        app.component('StackLayout', StackLayout);
-        app.component('FlexboxLayout', FlexboxLayout);
-        app.component('GridLayout', GridLayout);
-        app.component('Page', Page);
-        app.component('Frame', Frame);
-        app.component('ActionBar', ActionBar);
-        app.component('ImageCacheIt', ImageCacheIt);
-    }
-};
-
-exports.ActionBar = ActionBar;
-exports.Button = Button;
-exports.FlexboxLayout = FlexboxLayout;
-exports.Frame = Frame;
-exports.GridLayout = GridLayout;
-exports.ImageCacheIt = ImageCacheIt;
-exports.Label = Label;
-exports.NativeScriptWebPlugin = NativeScriptWebPlugin;
-exports.Page = Page;
-exports.StackLayout = StackLayout;
-//# sourceMappingURL=index.cjs.map