Fix memory leak in SSR docs

package.json

@@ -5,6 +5,7 @@
  "repository": "https://github.com/epicmaxco/vuestic-ui",
  "devDependencies": {
  "lerna": "^3.20.2",
+ "syncpack": "^9.8.6",
  "yorkie": "^2.0.0"
  },
  "private": true,
@@ -39,12 +40,5 @@
  },
  "gitHooks": {
  "pre-commit": "lerna run --concurrency 1 --stream precommit --since HEAD"
- },
- "resolutions": {
- "nuxt": "3.1.1",
- "vue": "3.2.37",
- "vite": "^4",
- "vue-router": "4.1.6",
- "@nuxt/schema": "3.0.0"
  }
 }

packages/ag-grid-theme/package.json

@@ -17,7 +17,7 @@
  "@ag-grid-community/vue3": "^29.0.0"
  },
  "peerDependencies": {
- "vuestic-ui": "^1.3.0"
+ "vuestic-ui": "1.6.4"
  },
  "devDependencies": {
  "sass": "^1.57.1",

packages/deploy/package.json

@@ -6,10 +6,10 @@
  "release": "tsx release-script/release-script.ts"
  },
  "devDependencies": {
- "tsx": "^3.5.0",
+ "tsx": "^3.12.1",
  "inquirer": "^9.0.0",
- "typescript": "^4.3.2",
- "chalk": "^5.0.1"
+ "typescript": "4.7.4",
+ "chalk": "^5.2.0"
  },
  "exports": {
  "./execute": "./execute/index.ts"

packages/docs/modules/markdown/index.ts

@@ -7,8 +7,7 @@ export default defineNuxtModule({
  },
 
  setup(_, nuxt) {
- nuxt.options.plugins.push(resolve(__dirname, 'runtime/plugin.ts'))
-
+ // nuxt.options.plugins.push(resolve(__dirname, 'runtime/plugin.ts'))
 
  addImports({
  name: 'useMarkdownIt',

packages/docs/modules/markdown/runtime/useMarkdownIt.ts

@@ -1,5 +1,12 @@
-export const useMarkdownProvideKey = 'vuestic:markdown'
+import { InjectionKey } from "vue"
+import { marked } from 'marked';
+
+export const useMarkdownProvideKey = 'vuestic:markdown' as unknown as InjectionKey<ReturnType<typeof marked>>
 
 export const useMarkdownIt = () => {
- return inject(useMarkdownProvideKey)
+ const parse = (markdown: string) => {
+ return (marked(markdown)).toString()
+ }
+
+ return { parse }
 }

packages/docs/modules/page-config/blocks/shared/markdown/MarkdownView.vue

@@ -31,17 +31,18 @@ const props = defineProps({
 
 const { locale } = useI18n();
 
-const md = useMarkdownIt();
+const { parse } = useMarkdownIt();
 
 const text = computed(() => {
+ // return props.content
  try {
  if (!props.content) { return '' }
 
  if (props.text) {
- return md.render(props.content).match(/<p>(.*)<\/p>/)?.[1]
+ return (parse(props.content)).match(/<p>(.*)<\/p>/)?.[1] || ''
  }
 
- return md.render(props.content);
+ return (parse(props.content));
  } catch (e) {
  console.error(e, props.content)
  return ''

packages/docs/nuxt.config.ts

@@ -177,6 +177,12 @@ export default defineNuxtConfig({
  '@/assets/css/tailwind.css',
  ],
 
+ build: {
+ transpile: [
+ 'markdown-it',
+ ]
+ },
+
  vite: {
  define: {
  __VUE_I18N_FULL_INSTALL__: true,

packages/docs/package.json

@@ -7,7 +7,7 @@
  "build:ci": "yarn build:analysis && nuxt build --max_old_space_size=4096",
  "build:analysis": "yarn workspace sandbox build:analysis ../docs/page-config/getting-started/tree-shaking",
  "serve": "yarn build:analysis --use-cache && nuxt dev",
- "generate": "nuxt generate",
+ "generate": "yarn build:analysis && nuxt generate --max_old_space_size=4096",
  "preview": "npx serve ./.output/public",
  "test": "vitest",
  "lint": "eslint --ext .js,.ts,.vue .",
@@ -27,24 +27,27 @@
  "escodegen": "^2.0.0",
  "eslint": "7",
  "nuxt": "^3.1.1",
- "postcss": "^7",
+ "postcss": "^8.2.1",
  "postcss-custom-properties": "^13.1.1",
+ "serve": "^14.2.0",
  "stylelint": "^13.13.1",
  "stylelint-config-standard": "^22.0.0",
  "vitest": "^0.18.1",
  "vue-component-meta": "^1.2.0",
  "vue-i18n": "^9.2.2",
  "vue-router": "^4.1.6",
- "vue-tsc": "^1.0.24"
+ "vue-tsc": "^1.2.0"
  },
  "dependencies": {
  "@docsearch/js": "^3.2.1",
  "@nuxtjs/google-fonts": "^3.0.0-1",
  "@types/acorn": "^6.0.0",
+ "@types/marked": "^4.3.0",
  "acorn": "^8.8.1",
  "codesandbox": "^2.2.3",
  "highlight.js": "^11.7.0",
  "markdown-it": "^12.3.2",
- "markdown-it-attrs": "^4.0.0"
+ "markdown-it-attrs": "^4.0.0",
+ "marked": "^4.3.0"
  }
 }

packages/nuxt/package.json

@@ -29,9 +29,9 @@
  "dependencies": {
  "@nuxt/kit": "^3.0.0",
  "chokidar": "*",
- "nuxt": "^3.0.0",
+ "nuxt": "^3.1.1",
  "pathe": "^0.3.5",
- "vuestic-ui": "^1.4.10"
+ "vuestic-ui": "1.6.4"
  },
  "devDependencies": {
  "@nuxt/module-builder": "latest",

packages/sandbox/package.json

@@ -31,21 +31,21 @@
  "vue": "*"
  },
  "devDependencies": {
- "@vitejs/plugin-vue": "^1.3.0",
+ "@vitejs/plugin-vue": "^4.1.0",
  "@vue/test-utils": "^2.0.2",
  "lodash": "^4.17.21",
- "nuxt": "3.0.0",
+ "nuxt": "^3.1.1",
  "rollup-plugin-analyzer": "^4.0.0",
- "sass": "^1.54.4",
- "serve": "^12.0.0",
+ "sass": "^1.57.1",
+ "serve": "^14.2.0",
  "ts-loader": "^9.3.0",
  "ts-node": "^10.8.1",
- "typescript": "^4.3.2",
+ "typescript": "4.7.4",
  "vite": "^4.2.1",
  "vitest": "*",
  "vue-bundle-renderer": "0.4.1",
  "vue-tsc": "^1.2.0",
- "webpack": "5",
+ "webpack": "^5.4.1",
  "webpack-cli": "^4.9.2",
  "when-dependencies-installed": "^1.0.1"
  },

packages/ui/package.json

@@ -45,7 +45,8 @@
  "@types/lodash": "^4.14.161",
  "cleave.js": "^1.6.0",
  "colortranslator": "^1.9.2",
- "lodash": "^4.17.21"
+ "lodash": "^4.17.21",
+ "typescript": "^5"
  },
  "devDependencies": {
  "@babel/core": "^7.12.3",
@@ -96,19 +97,19 @@
  "postcss": "^8.2.1",
  "postcss-import": "^14.0.2",
  "postcss-loader": "^4.1.0",
- "rollup": "^2.53.1",
+ "rollup": "^3.15.0",
  "rollup-plugin-copy": "^3.4.0",
  "rollup-plugin-postcss": "^4.0.0",
  "rollup-plugin-terser": "^7.0.2",
  "rollup-plugin-typescript2": "^0.30.0",
  "rollup-plugin-vue": "^6.0.0",
- "sass": "^1.26.5",
+ "sass": "^1.57.1",
  "sass-loader": "^10.1.0",
  "semver": "^7.3.5",
  "style-loader": "^2.0.0",
  "stylelint": "^13.13.1",
  "stylelint-config-standard": "^22.0.0",
- "ts-loader": "^8.0.14",
+ "ts-loader": "^9.3.0",
  "typescript": "4.7.4",
  "vite": "^4.2.1",
  "vite-plugin-chunk-split": "^0.4.7",
@@ -120,7 +121,7 @@
  "vuelidate": "^0.7.5",
  "webpack": "^5.4.1",
  "webpack-bundle-analyzer": "^4.1.0",
- "webpack-cli": "^4.4.0",
+ "webpack-cli": "^4.9.2",
  "webpack-merge": "^5.5.0",
  "yargs": "^17.5.1"
  },
@@ -170,4 +171,4 @@
  ]
  }
  }
-}
+}

packages/ui/src/components/va-accordion/VaAccordion.vue

@@ -12,7 +12,7 @@ import { useAccordion } from './hooks/useAccordion'
 
 export default defineComponent({
  name: 'VaAccordion',
- emits: useStatefulEmits,
+ emits: [...useStatefulEmits],
  props: {
  ...useStatefulProps,
  ...useComponentPresetProp,

packages/ui/src/components/va-alert/VaAlert.vue

@@ -95,7 +95,7 @@ import { VaIcon } from '../va-icon'
 export default defineComponent({
  name: 'VaAlert',
  components: { VaIcon },
- emits: useStatefulEmits,
+ emits: [...useStatefulEmits], // useStatefulEmits,
  props: {
  ...useStatefulProps,
  ...useComponentPresetProp,

packages/ui/src/components/va-avatar-group/VaAvatarGroup.vue

@@ -13,7 +13,6 @@
  />
  <slot name="rest" v-bind="avatarProps">
  <va-avatar
- color="secondary"
  v-bind="avatarProps"
  role="listitem"
  >

packages/ui/src/components/va-carousel/VaCarousel.vue

@@ -162,7 +162,7 @@ export default defineComponent({
  ariaSlideOfLabel: { type: String, default: '$t:slideOf' },
  },
 
- emits: useStatefulEmits,
+ emits: [...useStatefulEmits],
 
  setup (props, { emit }) {
  const { valueComputed: currentSlide } = useStateful(props, emit, 'modelValue', { defaultValue: 0 })

packages/ui/src/components/va-color-indicator/VaColorIndicator.vue

@@ -29,7 +29,7 @@ import {
 
 export default defineComponent({
  name: 'VaColorIndicator',
- emits: useStatefulEmits,
+ emits: [...useStatefulEmits],
  props: {
  ...useStatefulProps,
  ...useComponentPresetProp,

packages/ui/src/components/va-color-input/VaColorInput.vue

@@ -46,7 +46,7 @@ export default defineComponent({
  VaInput,
  VaColorIndicator,
  },
- emits: useStatefulEmits,
+ emits: [...useStatefulEmits],
  props: {
  ...useStatefulProps,
  ...useComponentPresetProp,

packages/ui/src/components/va-color-palette/VaColorPalette.vue

@@ -29,7 +29,7 @@ import { VaColorIndicator } from '../va-color-indicator'
 export default defineComponent({
  name: 'VaColorPalette',
  components: { VaColorIndicator },
- emits: useStatefulEmits,
+ emits: [...useStatefulEmits],
  props: {
  ...useStatefulProps,
  ...useComponentPresetProp,

packages/ui/src/components/va-date-picker/VaDatePicker.vue

@@ -123,7 +123,7 @@ export default defineComponent({
  const { syncView } = useView(props, emit, { type: props.type })
 
  const classComputed = computed(() => ({
- 'va-date-picker_without-week-days': props.hideWeekDays,
+ // 'va-date-picker_without-week-days': props.hideWeekDays,
  'va-date-picker_disabled': props.disabled,
  }))
 

packages/ui/src/components/va-dropdown/VaDropdown.vue

@@ -78,7 +78,7 @@ export default defineComponent({
  ariaLabel: { type: String, default: '$t:toggleDropdown' },
  },
 
- emits: [...useStatefulEmits, 'anchor-click', 'anchor-right-click', 'content-click', 'click-outside', 'close', 'open'],
+ emits: [...useStatefulEmits, 'anchor-click', 'anchor-right-click', 'content-click', 'click-outside', 'close', 'open', 'anchor-dblclick'],
 
  setup (props, { emit, slots, attrs }) {
  const contentRef = shallowRef<HTMLElement>()
@@ -119,7 +119,7 @@ export default defineComponent({
  cancelHoverDebounce()
  }
 
- const emitAndClose = (eventName: string, close?: boolean, e?: Event) => {
+ const emitAndClose = (eventName: Parameters<typeof emit>[0], close?: boolean, e?: Event) => {
  emit(eventName, e)
  if (close && props.trigger !== 'none') { valueComputed.value = false }
  }