Fix typings (#443)

Author: ota-meshi

packages/cheetah-grid/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cheetah-grid",
-  "version": "1.16.2",
+  "version": "1.16.4",
   "description": "Cheetah Grid is a high performance grid engine that works on canvas",
   "keywords": [
     "spreadsheet",

packages/cheetah-grid/src/js/themes.ts

@@ -14,6 +14,8 @@ const builtin: { [key: string]: Theme } = {
 };
 let defTheme = MATERIAL_DESIGN;
 
+export type { Theme };
+
 export const theme = { Theme };
 export function of(
   value: ThemeDefine | string | undefined | null

packages/cheetah-grid/src/js/ts-types/grid.ts

@@ -12,7 +12,7 @@ export interface CellRange {
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 export type FieldGetter<T> = (record: T) => any;
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-export type FieldSetter<T> = (record: T, value: any) => void;
+export type FieldSetter<T> = (record: T, value: any) => boolean;
 export interface FieldAssessor<T> {
   get: FieldGetter<T>;
   set: FieldSetter<T>;

packages/vue-cheetah-grid/lib/CGrid.vue

@@ -6,7 +6,7 @@
       >
         <!--
           Use this slot to set the simple header definition.
-          The definition is set to `header` property described in [Define Headers and Columns]
+          The definition is set to `header` property described in [Define Headers and Columns](https://future-architect.github.io/cheetah-grid/documents/api/js/headers_columns.html)
         -->
         <slot />
       </div>
@@ -16,7 +16,7 @@
         <!--
           Use this slot to set the layout header definition.
           Use this slot in combination with the `layout-body` slot.
-          The definition is set to `layout.header` property described in [Advanced Layout].
+          The definition is set to `layout.header` property described in [Advanced Layout](https://future-architect.github.io/cheetah-grid/documents/api/vue/advanced_layout/).
         -->
         <slot name="layout-header" />
       </div>
@@ -26,7 +26,7 @@
         <!--
           Use this slot to set the layout body definition.
           Use this slot in combination with the `layout-header` slot.
-          The definition is set to `layout.body` property described in [Advanced Layout].
+          The definition is set to `layout.body` property described in [Advanced Layout](https://future-architect.github.io/cheetah-grid/documents/api/vue/advanced_layout/).
         -->
         <slot name="layout-body" />
       </div>

packages/vue-cheetah-grid/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-cheetah-grid",
-  "version": "1.16.3",
+  "version": "1.16.4",
   "description": "Cheetah Grid for Vue.js",
   "main": "lib/index.js",
   "unpkg": "dist/vueCheetahGrid.js",

packages/vue-cheetah-grid/scripts/lib/metadata.js

@@ -25,13 +25,19 @@ const merge = require('./merge')
  * @property {string[]} args
  * @property {unknown} return
  */
+/**
+ * @typedef {object} ComponentSlotMetadata
+ * @property {string} name
+ * @property {string} description
+ */
 /**
  * @typedef {object} ComponentMetadata
  * @property {string} name
  * @property {string} description
  * @property {Keyword[]} keywords
  * @property {ComponentPropMetadata[]} props
  * @property {ComponentMethodMetadata[]} methods
+ * @property {ComponentSlotMetadata[]} slots
  */
 
 module.exports = {

packages/vue-cheetah-grid/scripts/vue3-types.js

@@ -10,6 +10,11 @@ const vue3Emits = Object.keys(EVENT_TYPE)
     return r
   }, {})
 
+const additionalProperties = {
+  CGrid:
+      'rawGrid: cheetahGrid.ListGrid<unknown>;'
+}
+
 async function main () {
   const allMetadata = await getAllVueComponentMetadata()
 
@@ -25,17 +30,27 @@ async function main () {
 ${camelCase(prop.name)}${isRequiredProp(prop) ? '' : '?'}: ${normalizePropType(prop)};
 `.trim()
     })
-    const methods = component.methods
-      .filter(method => method.visibility === 'public')
-      .map(method => {
-        return `
+    const propertyTypes =
+    [
+      ...component.methods
+        .filter(method => method.visibility === 'public')
+        .map(method => {
+          return `
 /** ${method.description} */
 ${method.name}: ${getMethodSignature(method)};
 `.trim()
-      })
+        }),
+      ...additionalProperties[componentName] ? [additionalProperties[componentName]] : []
+    ]
     const emits = Object.keys(vue3Emits).map(emitName => {
       return `
 on${pascalCase(emitName)}?: Function;
+`.trim()
+    })
+    const slots = component.slots.map(prop => {
+      return `
+/** ${prop.description} */
+"${prop.name}"?: Slot<{} | undefined>;
 `.trim()
     })
     componentTypes.push(`
@@ -45,7 +60,10 @@ export const ${componentName}: ComponentConstructor<
     ${indent([...props, ...emits].join('\n'), 4)}
   },
   {
-    ${indent(methods.join('\n'), 4)}
+    ${indent(propertyTypes.join('\n'), 4)}
+  },
+  {
+    ${indent(slots.join('\n'), 4)}
   }
 >;
 `.trim())
@@ -62,17 +80,18 @@ ${componentName}: typeof ${componentName};
     fs.mkdirSync(typeDir)
   }
   fs.writeFileSync(typePath, `${`
-import type { PublicProps, ComponentPublicInstance } from "vue";
-export * as cheetahGrid from 'cheetah-grid'
+import type { PublicProps, ComponentPublicInstance, Slot } from "vue";
+import * as cheetahGrid from 'cheetah-grid'
+export { cheetahGrid }
 export function storeElement (vm: ComponentPublicInstance): void;
 export function removeElement (vm: ComponentPublicInstance): void;
 export function getComponentFromElement (element: HTMLElement): ComponentPublicInstance | undefined;
 
-type ComponentConstructor<Props = {}, Methods = {}, Slots = {}> = {
+type ComponentConstructor<Props = {}, Properties = {}, Slots = {}> = {
   new (): {
     $props: PublicProps & Props
     $slots: Slots
-  } & Methods
+  } & Properties
 }
 
 ${componentTypes.join('\n')}
@@ -83,6 +102,8 @@ ${indent(components.join('\n'), 4)}
   }
 }
 
+export default CGrid;
+
 export declare function install (Vue: any /* Vue 2 Vue object or Vue 3 App instance */): void;
 `.trim()}\n`)