spark-grid-vue3 0.0.4 → 0.0.6

package/package.json

@@ -1,25 +1,31 @@
 {
     "name": "spark-grid-vue3",
-    "version": "0.0.4",
+    "version": "0.0.6",
     "description": "",
-    "main": "index.ts",
-    "types": "index.d.ts",
+    "files": [
+        "src"
+    ],
+    "main": "./src/index.ts",
+    "types": "./src/types/index.d.ts",
     "author": "",
     "license": "ISC",
     "dependencies": {
         "vue": "^3.4.37"
     },
     "scripts": {
-        "build": "vite build",
+        "build": "vite build && tsc --noEmit",
         "playground": "vite --config playground/vite.config.ts"
     },
     "devDependencies": {
+        "@types/node": "^22.7.4",
         "@vitejs/plugin-vue": "^5.1.4",
         "@vue/compiler-sfc": "^3.5.10",
+        "@vue/tsconfig": "^0.5.1",
         "mitt": "^3.0.1",
         "rollup-plugin-typescript2": "^0.36.0",
         "sass": "^1.79.4",
         "sass-embedded": "^1.79.4",
+        "terser": "^5.34.1",
         "typescript": "^5.6.2",
         "vite": "^5.4.8"
     },

package/src/assets/DataTable.ts

@@ -5,9 +5,9 @@ import GridBody from "../components/GridBody.vue"
 import GridContentWrapper from "../components/GridContentWrapper.vue"
 import GridSummarizer from "../components/GridSummarizer.vue"
 import type {Component} from "@vue/runtime-core"
-import type {SparkGridConfig, Props} from "../definition/types"
-import {DataFetcher} from "../utils/DataFetcher"
-import {EventHandler} from "../utils/EventHandler"
+import type {Props, SparkGridConfig} from "@/types"
+import {DataFetcher} from "@/utils/DataFetcher"
+import {EventHandler} from "@/utils/EventHandler"
 // @ts-ignore
 import {v4 as uuidV4} from "uuid"
 

package/src/components/GridBody.vue

@@ -10,7 +10,7 @@
 
 <script setup lang="ts">
 import GridRow from "./GridRow.vue"
-import type {GridComponent} from "../definition/types"
+import type {GridComponent} from "../types/types"
 import {computed} from "vue"
 
 const props = defineProps<{

package/src/components/GridCheckbox.vue

@@ -18,7 +18,7 @@
 
 <script setup lang="ts">
 import {GridStyler} from "../utils/GridStyler"
-import type {Row} from "../definition/types"
+import type {Row} from "../types/types"
 
 const props = defineProps<{
     row: Row,

package/src/components/GridContentWrapper.vue

@@ -5,7 +5,7 @@
 </template>
 
 <script setup lang="ts">
-import type {GridComponent} from "../definition/types"
+import type {GridComponent} from "../types/types"
 import {computed} from "vue"
 
 const props = defineProps<{ grid: GridComponent }>()

package/src/components/GridFooter.vue

@@ -43,7 +43,7 @@
 </template>
 
 <script setup lang="ts">
-import type {GridComponent} from "../definition/types"
+import type {GridComponent} from "../types/types"
 import {computed} from "vue"
 
 const props = defineProps<{ grid: GridComponent }>()

package/src/components/GridHeader.vue

@@ -35,7 +35,7 @@
 import RuntimeRenderer from "./RuntimeRenderer.vue"
 import GridHeaderCheckbox from "./GridHeaderCheckbox.vue"
 import {GridStyler} from "../utils/GridStyler"
-import type {Column, GridComponent} from "../definition/types"
+import type {Column, GridComponent} from "../types/types"
 import {computed} from "vue"
 
 const props = defineProps<{ grid: GridComponent }>()

package/src/components/GridHeaderCheckbox.vue

@@ -17,7 +17,7 @@
 
 <script setup lang="ts">
 import {GridStyler} from "../utils/GridStyler"
-import type {GridComponent, Row} from "../definition/types"
+import type {GridComponent, Row} from "../types/types"
 import {computed} from "vue"
 
 const props = defineProps<{

package/src/components/GridRadioButton.vue

@@ -19,7 +19,7 @@
 
 <script setup lang="ts">
 import {GridStyler} from "../utils/GridStyler"
-import type {Row, GridComponent} from "../definition/types"
+import type {Row, GridComponent} from "../types/types"
 
 const props = defineProps<{
     row: Row,

package/src/components/GridRow.vue

@@ -41,7 +41,7 @@
 <script setup lang="ts">
 import GridCheckbox from "./GridCheckbox.vue"
 import RuntimeRenderer from "./RuntimeRenderer.vue"
-import type {Column, GridComponent, Row} from "../definition/types"
+import type {Column, GridComponent, Row} from "../types/types"
 import {GridStyler} from "../utils/GridStyler"
 import {computed, onUnmounted} from "vue"
 import {CellValueGetter} from "../utils/CellValueGetter"

package/src/components/GridSearchField.vue

@@ -59,7 +59,7 @@
 <script setup lang="ts">
 import _ from "lodash"
 import {ref, watch, computed, onMounted, onUnmounted} from "vue"
-import {GridSearchType} from "../definition/enums"
+import {GridSearchType} from "../types/enums"
 import {EventEmitter} from "../utils/EventEmitter";
 
 const filterValue = ref<any>(null)

package/src/components/GridSearchRow.vue

@@ -24,7 +24,7 @@
 </template>
 
 <script setup lang="ts">
-import type {GridComponent, Column} from "../definition/types"
+import type {GridComponent, Column} from "../types/types"
 import GridSearchField from "./GridSearchField.vue"
 import {computed} from "vue"
 import {GridStyler} from "../utils/GridStyler"

package/src/components/GridSummarizer.vue

@@ -17,7 +17,7 @@
 </template>
 
 <script setup lang="ts">
-import type {GridComponent, Column} from "../definition/types"
+import type {GridComponent, Column} from "../types/types"
 import {GridStyler} from "../utils/GridStyler"
 import RuntimeRenderer from "../components/RuntimeRenderer.vue"
 

package/src/index.ts

@@ -1,11 +1,11 @@
 import type {App} from "vue";
-import DynaGrid from "./SparkGrid.vue";
-import type {InstallOptions} from "./definition/install";
+import SparkGridComponent from "./SparkGrid.vue";
+import type {InstallOptions} from "./types";
 import {EventEmitter} from "./utils/EventEmitter";
 
 export const SparkGrid: any = {
     install(app: App, options: InstallOptions) {
-        app.component("SparkGrid", DynaGrid)
+        app.component("SparkGrid", SparkGridComponent)
         EventEmitter.eventProxy = options.eventProxy
     }
 }

package/src/types/index.d.ts

@@ -0,0 +1,3 @@
+export * from './types'
+export * from './install'
+export * from './enums'

package/src/{definition → types}/install.d.ts

@@ -1,4 +1,4 @@
-type EventReceived = (data: any) => void;
+export type EventReceived = (data: any) => void;
 
 export type EventProxy = {
     emit: (name: string, data: any) => void,

package/src/{definition → types}/types.d.ts

@@ -1,6 +1,6 @@
 import type {Component} from "@vue/runtime-core"
-import {GridColumnType, GridSearchType} from "./enums"
 import {ComponentPublicInstance} from "@vue/runtime-core";
+import {GridColumnType, GridSearchType} from "./enums"
 
 export type OrderBy = {
     name: string,
@@ -69,7 +69,7 @@ export type UniqueKeyIdentifier = (row: Row) => string
 
 export type SparkGridConfig = {
     url?: string | function,
-    datasource: (params: any) => any[],
+    datasource?: (params: any) => any[],
     height?: number,
     rowsPerPage?: number,
     cellMinWidth?: number | string,

package/src/utils/CellValueGetter.ts

@@ -1,4 +1,4 @@
-import type {Row, Column, GridComponent} from "../definition/types"
+import type {Row, Column, GridComponent} from "../types/types"
 // @ts-ignore
 import getValue from 'get-value'
 

package/src/utils/CheckboxSelectedMapper.ts

@@ -1,4 +1,4 @@
-import type {Row, GridComponent} from "../definition/types"
+import type {Row, GridComponent} from "../types/types"
 
 export class CheckboxSelectedMapper {
     static map(row: Row, grid: GridComponent) {

package/src/utils/DataFetcher.ts

@@ -1,7 +1,7 @@
 import {EventEmitter} from "../utils/EventEmitter"
 import {UrlBuilder} from "../utils/UrlBuilder"
 import Axios from "axios"
-import type {GridComponent} from "../definition/types"
+import type {GridComponent} from "../types/types"
 
 export class DataFetcher {
     static async fetch(this: GridComponent): Promise<void> {

package/src/utils/EventEmitter.ts

@@ -1,5 +1,5 @@
-import type {GridComponent} from "../definition/types"
-import type {EventProxy, EventReceived} from "../definition/install";
+import type {GridComponent} from "../types/types"
+import type {EventProxy, EventReceived} from "../types/install";
 
 export class EventEmitter {
     static eventProxy: EventProxy|null|undefined = null;

package/src/utils/EventHandler.ts

@@ -1,10 +1,10 @@
-import type {Column, GridComponent, OrderBy, Row} from "../definition/types"
+import type {Column, GridComponent, OrderBy, Row} from "../types/types"
 import {UuidMapper} from "./UuidMapper"
 // @ts-ignore
 import {v4 as uuid} from "uuid"
 import {isEmpty} from "./Conditionals"
 import {CheckboxSelectedMapper} from "./CheckboxSelectedMapper"
-import {GridColumnType} from "../definition/enums"
+import {GridColumnType} from "../types/enums"
 // @ts-ignore
 import getValue from 'get-value'
 import type {ComponentPublicInstance} from "@vue/runtime-core";

package/src/utils/GridStyler.ts

@@ -1,4 +1,4 @@
-import type {Column, GridComponent} from "../definition/types"
+import type {Column, GridComponent} from "../types/types"
 
 export class GridStyler {
     static getCheckboxColumnStyles(): object {

package/src/utils/RadioButtonSelectedMapper.ts

@@ -1,4 +1,4 @@
-import type {GridComponent, Row} from "../definition/types"
+import type {GridComponent, Row} from "../types/types"
 
 export class RadioButtonSelectedMapper {
     static map(row: Row, grid: GridComponent) {

package/src/utils/UrlBuilder.ts

@@ -1,4 +1,4 @@
-import type {GridComponent} from "../definition/types"
+import type {GridComponent} from "../types/types"
 
 export class UrlBuilder {
     static getParams(grid: GridComponent): any {

package/src/utils/UuidMapper.ts

@@ -1,4 +1,4 @@
-import type {Row} from "../definition/types"
+import type {Row} from "../types/types"
 // @ts-ignore
 import {v4 as uuidV4} from "uuid"
 

package/src/{types.d.ts → vue-shim.d.ts}

@@ -1,5 +1,5 @@
 declare module '*.vue' {
-    import { DefineComponent } from 'vue';
+    import {DefineComponent} from 'vue';
     const component: DefineComponent<{}, {}, any>;
     export default component;
 }

package/index.html

@@ -1,11 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8"/>
-    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
-    <title>Spark Grid - Vue3</title>
-</head>
-<body>
-</body>
-</html>

package/jsconfig.json

@@ -1,8 +0,0 @@
-{
-  "compilerOptions": {
-    "paths": {
-      "@/*": ["./src/*"]
-    }
-  },
-  "exclude": ["node_modules", "dist"]
-}

package/playground/App.vue

@@ -1,35 +0,0 @@
-<template>
-    <DynaGrid
-        :config="grid"
-    />
-</template>
-
-<style scoped>
-#app {
-    padding: 20px;
-}
-</style>
-
-<script lang="ts">
-import {Component} from "@vue/runtime-core";
-import type {SparkGridConfig} from "../src/definition/types";
-
-export default {
-    computed: {
-        grid(): SparkGridConfig {
-            return {
-                datasource: (params: any) => {
-                    return [
-                        {id: 1, name: "John Doe"},
-                    ]
-                },
-
-                columns: [
-                    {name: "id", label: "ID"}
-                ]
-            }
-        }
-    }
-} as Component
-</script>
-

package/playground/index.html

@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8"/>
-    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
-    <title>Dyna Grid Playground</title>
-</head>
-<body>
-    <div id="app"></div>
-    <script type="module" src="./main.ts"></script>
-</body>
-</html>

package/playground/main.ts

@@ -1,17 +0,0 @@
-import {createApp} from 'vue';
-import App from './App.vue';
-import {DataTable} from '../src/index';
-import mitt from "mitt";
-
-const app = createApp(App);
-const emitter = mitt()
-
-app.use(DataTable, {
-    eventProxy: {
-        emit: emitter.emit,
-        on: emitter.on,
-        off: emitter.off,
-    }
-})
-
-app.mount('#app');

package/playground/vite.config.ts

@@ -1,23 +0,0 @@
-import {defineConfig} from 'vite';
-import vue from '@vitejs/plugin-vue';
-import path from 'path';
-
-export default defineConfig({
-    root: path.resolve(__dirname), // Set the playground folder as the root
-    plugins: [vue()],
-    resolve: {
-        alias: {
-            // Alias to your plugin's src directory
-            '@': path.resolve(__dirname, '../src')
-        }
-    },
-    server: {
-        open: true, // Automatically open the browser
-        port: 3000  // Port for the playground server
-    },
-    build: {
-        rollupOptions: {
-            input: path.resolve(__dirname, 'index.html') // Specify the HTML entry
-        }
-    }
-});

package/src/index.d.ts

@@ -1 +0,0 @@
-export * from 'definition/types'

package/tsconfig.json

@@ -1,19 +0,0 @@
-{
-    "compilerOptions": {
-        "target": "ESNext",
-        "module": "ESNext",
-        "moduleResolution": "Node",
-        "strict": true,
-        "jsx": "preserve",
-        "esModuleInterop": true,
-        "skipLibCheck": true,
-        "forceConsistentCasingInFileNames": true,
-        "declaration": true,
-        "declarationDir": "dist/types",
-        "emitDeclarationOnly": true,
-        "outDir": "dist"
-    },
-    "include": [
-        "src"
-    ]
-}

package/vite.config.js

@@ -1,16 +0,0 @@
-import { fileURLToPath, URL } from 'node:url'
-
-import { defineConfig } from 'vite'
-import vue from '@vitejs/plugin-vue'
-
-// https://vitejs.dev/config/
-export default defineConfig({
-  plugins: [
-    vue(),
-  ],
-  resolve: {
-    alias: {
-      '@': fileURLToPath(new URL('./src', import.meta.url))
-    }
-  }
-})

package/vite.config.ts

@@ -1,29 +0,0 @@
-import {defineConfig} from 'vite';
-import vue from '@vitejs/plugin-vue';
-import typescript from 'rollup-plugin-typescript2';
-
-export default defineConfig({
-    plugins: [vue()],
-    resolve: {
-        alias: {
-            // Alias to your plugin's src directory
-            '@': path.resolve(__dirname, '../src')
-        }
-    },
-    build: {
-        lib: {
-            entry: 'src/index.ts',
-            name: 'DynaGrid',
-            fileName: (format) => `dyna-grid.${format}.js`
-        },
-        rollupOptions: {
-            external: ['vue'],
-            output: {
-                globals: {
-                    vue: 'Vue'
-                }
-            },
-            plugins: [typescript()]
-        }
-    }
-});