From af0fc107301aee491c8f35c696a3260cdbbd2c04 Mon Sep 17 00:00:00 2001 From: WebDevNerdStuff Date: Wed, 6 Dec 2023 13:01:29 -0800 Subject: [PATCH 01/80] Fix and improve typescript support --- .eslintrc.js | 5 - src/documentation/sections/UsageSection.vue | 57 +++++- src/index.ts | 25 --- src/main.ts | 7 +- src/playground/configs/playground.ts | 22 ++- .../configs/templates/PlaygroundPage.vue | 172 ++++++++++++++---- src/plugin/VInlineCheckbox.vue | 6 +- src/plugin/VInlineCustomField.vue | 6 +- src/plugin/VInlineSelect.vue | 6 +- src/plugin/VInlineSwitch.vue | 6 +- src/plugin/VInlineTextField.vue | 6 +- src/plugin/VInlineTextarea.vue | 6 +- src/plugin/components/BooleanIcons.vue | 2 +- src/plugin/components/DisplayedValue.vue | 2 +- src/plugin/components/SaveFieldButtons.vue | 2 +- src/plugin/composables/classes.ts | 2 +- src/plugin/composables/colors.ts | 2 +- src/plugin/composables/helpers.ts | 2 +- src/plugin/composables/icons.ts | 2 +- src/plugin/composables/methods.ts | 2 +- src/plugin/composables/styles.ts | 2 +- src/plugin/index.ts | 26 +++ src/{ => plugin}/types/auto-imports.d.ts | 0 src/{ => plugin}/types/index.ts | 0 src/plugin/types/inline-fields.d.ts | 21 +++ src/{ => plugin}/types/vite-env.d.ts | 0 src/{ => plugin}/types/vue-shim.d.ts | 0 tsconfig.json | 10 +- vite.build.config.ts | 15 +- 29 files changed, 298 insertions(+), 116 deletions(-) delete mode 100644 src/index.ts rename src/{ => plugin}/types/auto-imports.d.ts (100%) rename src/{ => plugin}/types/index.ts (100%) create mode 100644 src/plugin/types/inline-fields.d.ts rename src/{ => plugin}/types/vite-env.d.ts (100%) rename src/{ => plugin}/types/vue-shim.d.ts (100%) diff --git a/.eslintrc.js b/.eslintrc.js index d2f0308..ce1228e 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -40,11 +40,6 @@ module.exports = { 'vue', ], root: true, - settings: { - 'import/resolver': { - 'babel-module': {}, - }, - }, rules: { '@typescript-eslint/ban-ts-comment': 0, '@typescript-eslint/ban-types': [ diff --git a/src/documentation/sections/UsageSection.vue b/src/documentation/sections/UsageSection.vue index a5e9574..026e446 100644 --- a/src/documentation/sections/UsageSection.vue +++ b/src/documentation/sections/UsageSection.vue @@ -12,12 +12,30 @@ Usage + + + + + + + + + + + + + props.codeBlockOptions); const classes = inject('classes'); +const usageGlobalPlugin = `import { createApp } from 'vue'; +import App from './App.vue'; +import { createVInlineFields } from '@wdns/vuetify-inline-fields'; + +const VInlineFields = createVInlineFields({ + // See Shared Props section for available options +}); + +const app = createApp(App); + +app.plugin(VInlineFields); + +app.mount('#app');`; + const usageAll = `import { createApp } from 'vue'; import App from './App.vue'; import * as VInlineFields from '@wdns/vuetify-inline-fields'; @@ -86,4 +130,13 @@ app.component('VInlineTextField', VInlineTextField); app.component('VInlineTextarea', VInlineTextarea); app.mount('#app');`; + +const usageLocal = `import { + VInlineCheckbox, + VInlineSelect, + VInlineSwitch, + VInlineTextField, + VInlineTextarea, +} from '@wdns/vuetify-inline-fields'; +`; diff --git a/src/index.ts b/src/index.ts deleted file mode 100644 index 096225b..0000000 --- a/src/index.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { App, Plugin } from 'vue'; -import VInlineFields from './plugin'; -import './plugin/styles/main.scss'; - -const install = (app: App) => { - for (const prop in VInlineFields) { - const component = VInlineFields[prop]; - app.component(component.name, component); - } -}; - -for (const prop in VInlineFields) { - const component = VInlineFields[prop]; - component.install = install; -} - -export const VInlineCheckbox = VInlineFields.VInlineCheckbox; -export const VInlineCustomField = VInlineFields.VInlineCustomField; -export const VInlineSelect = VInlineFields.VInlineSelect; -export const VInlineSwitch = VInlineFields.VInlineSwitch; -export const VInlineTextField = VInlineFields.VInlineTextField; -export const VInlineTextarea = VInlineFields.VInlineTextarea; - -export default { VInlineFields } as unknown as Plugin; - diff --git a/src/main.ts b/src/main.ts index 3d19a8f..e8001f5 100644 --- a/src/main.ts +++ b/src/main.ts @@ -5,21 +5,18 @@ import { createApp } from 'vue'; import { createPinia } from 'pinia'; import { registerPlugins } from './plugins'; import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'; -import * as VInlineFields from './index'; import { makeServer } from './server'; +import { createVInlineFields } from './plugin/index'; makeServer({ environment: 'demo' }); const app = createApp(App); app.component('CodeBlock', CodeBlock); +app.use(createVInlineFields()); app.use(createPinia()); app.component('font-awesome-icon', FontAwesomeIcon); app.component('FaIcon', FontAwesomeIcon); -for (const prop in VInlineFields) { - app.component(prop, VInlineFields[prop]); -} - registerPlugins(app); app.mount('#app'); diff --git a/src/playground/configs/playground.ts b/src/playground/configs/playground.ts index 6bcfe1f..a02040d 100644 --- a/src/playground/configs/playground.ts +++ b/src/playground/configs/playground.ts @@ -5,18 +5,32 @@ import { createPinia } from 'pinia'; import { registerPlugins } from '../../plugins'; import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'; import { makeServer } from '../../server'; -import * as VInlineFields from '../../index'; +import { createVInlineFields } from '../../plugin/index'; +// import { +// VInlineCheckbox, +// VInlineCustomField, +// VInlineSelect, +// VInlineSwitch, +// VInlineTextField, +// VInlineTextarea, +// } from '../../plugin/index'; makeServer({ environment: 'playground' }); const app = createApp(PlaygroundApp); +app.use(createVInlineFields({ + // cell: true, +})); app.use(createPinia()); app.component('font-awesome-icon', FontAwesomeIcon); app.component('FaIcon', FontAwesomeIcon); -for (const prop in VInlineFields) { - app.component(prop, VInlineFields[prop]); -} +// app.component('VInlineCheckbox', VInlineCheckbox); +// app.component('VInlineCustomField', VInlineCustomField); +// app.component('VInlineSelect', VInlineSelect); +// app.component('VInlineSwitch', VInlineSwitch); +// app.component('VInlineTextField', VInlineTextField); +// app.component('VInlineTextarea', VInlineTextarea); registerPlugins(app); diff --git a/src/playground/configs/templates/PlaygroundPage.vue b/src/playground/configs/templates/PlaygroundPage.vue index 1b16c4d..5991f78 100644 --- a/src/playground/configs/templates/PlaygroundPage.vue +++ b/src/playground/configs/templates/PlaygroundPage.vue @@ -1,8 +1,20 @@ + +