Skip to content

Commit 3af8108

Browse files
m0ksemm0ksem
committed
Merge branch 'develop' into feat/compiler-components
2 parents d971cac + 16459e2 commit 3af8108

File tree

145 files changed

+4902
-1311
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

145 files changed

+4902
-1311
lines changed

‎.nvmrc‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
v18.20.2
1+
v22.12

‎package.json‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,10 @@
3737
"release": "yarn workspace deploy release",
3838
"serve:formkit": "yarn workspace @vuestic/formkit serve:storybook",
3939
"build:formkit": "yarn workspace @vuestic/formkit build:storybook",
40-
"start:formkit": "yarn workspace @vuestic/formkit start:storybook"
40+
"start:formkit": "yarn workspace @vuestic/formkit start:storybook",
41+
"serve:vueform": "yarn workspace @vuestic/vueform serve:storybook",
42+
"build:vueform": "yarn workspace @vuestic/vueform build:storybook",
43+
"start:vueform": "yarn workspace @vuestic/vueform start:storybook"
4144
},
4245
"workspaces": {
4346
"packages": [

‎packages/compiler/auto-import/index.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export * from './plugin'

‎packages/compiler/auto-import/plugin.ts‎

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
import { transform } from '@vue/compiler-core'
2+
import Components from 'unplugin-vue-components/vite'
3+
import { isEntryFile } from '../shared/plugin/is-entry-file'
4+
import { Plugin } from 'vite'
5+
import { addImport, addVuePlugin, hasImport, hasVuePlugin } from '../shared/plugin/js'
6+
import { MagicString } from '@vue/compiler-sfc'
7+
import { logger } from '../logger'
8+
import { formatString } from '../shared/color'
9+
10+
function installVuesticEssentialPlugin(ms: MagicString) {
11+
// Install vuestic essential plugin if not already installed
12+
if (!hasImport(ms, { named: 'createVuesticEssential', from: 'vuestic-ui' })) {
13+
addImport(ms, `import { createVuesticEssential } from 'vuestic-ui'`)
14+
}
15+
16+
if (!hasVuePlugin(ms, 'createVuesticEssential')) {
17+
addVuePlugin(ms, 'createVuesticEssential()')
18+
}
19+
20+
return ms
21+
}
22+
23+
function installVuesticEssentialStyles(ms: MagicString) {
24+
// Add styles if not already imported
25+
if (!hasImport(ms, 'vuestic-ui/css')) {
26+
addImport(ms, `import 'vuestic-ui/css'`)
27+
}
28+
29+
return ms
30+
}
31+
32+
export const vuesticAutoImport = (options: { prefix?: string } = { prefix: 'Va' }) => {
33+
const prefix = options.prefix || 'Va'
34+
35+
return [
36+
{
37+
name: 'vuestic:auto-import',
38+
39+
enforce: 'pre',
40+
41+
transform(code, id) {
42+
if (!isEntryFile(id)) {
43+
return
44+
}
45+
46+
const ms = new MagicString(code)
47+
48+
installVuesticEssentialPlugin(ms)
49+
installVuesticEssentialStyles(ms)
50+
51+
return {
52+
code: ms.toString(),
53+
map: ms.generateMap({ hires: true }),
54+
}
55+
}
56+
} satisfies Plugin,
57+
Components({
58+
dts: 'node_modules/.vuestic/components.d.ts',
59+
resolvers: [
60+
(componentName) => {
61+
if (componentName.startsWith(prefix))
62+
return { name: componentName, from: 'vuestic-ui' }
63+
},
64+
],
65+
}) as Plugin
66+
]
67+
}

‎packages/compiler/devtools/client/ui/Devtools.vue‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,9 @@
11
<template>
2+
<Teleport to="body" v-if="!isEditMode">
3+
<div class="vuestic-devtools">
4+
<OpenDevtoolsButton @click="isEditMode = true" />
5+
</div>
6+
</Teleport>
27
<Teleport to="body" v-if="isEditMode">
38
<div :style="colorsToCSSVariable(colors)" class="vuestic-devtools">
49
<Overlay
@@ -66,6 +71,7 @@ import { EDIT_MODE_CLASS } from '../../shared/CONST'
6671
import { useEvent } from './composables/base/useEvent'
6772
import { useComponent } from './composables/useComponent'
6873
import { useAppTree } from './composables/useAppTree/index'
74+
import OpenDevtoolsButton from './components/OpenDevtoolsButton.vue'
6975
7076
const { selectAppTreeItem, selectedAppTreeItem } = useAppTree()
7177

‎packages/compiler/devtools/client/ui/components/OpenDevtoolsButton.vue‎

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
<script setup lang="ts">
2+
import { ref } from 'vue';
3+
import { useModal } from 'vuestic-ui';
4+
5+
const doShow = ref(localStorage.getItem('vuestic-devtools') !== 'false')
6+
7+
const { confirm } = useModal()
8+
9+
async function toggleDevtools() {
10+
const res = await confirm({
11+
title: 'Remove toggle devtools button',
12+
message: `Are you sure you want to remove the toggle Vuestic Devtools button? You can set 'vuestic-devtools' in localStorage to 'true' to show it again.`,
13+
})
14+
15+
if (res) {
16+
const currentState = localStorage.getItem('vuestic-devtools')
17+
localStorage.setItem('vuestic-devtools', currentState === 'false' ? 'true' : 'false')
18+
doShow.value = !doShow.value
19+
}
20+
}
21+
</script>
22+
23+
<template>
24+
<div v-if="doShow" class="va-open-devtools-button">
25+
<img src="https://ui.vuestic.dev/favicon.ico" height="16px" />
26+
<div class="va-open-devtools-button__close">
27+
<VaIcon name="va-close" @click.stop="toggleDevtools" color="textPrimary" />
28+
</div>
29+
</div>
30+
</template>
31+
32+
<style lang="scss" scoped>
33+
.va-open-devtools-button {
34+
display: flex;
35+
align-items: center;
36+
flex-direction: column;
37+
justify-content: center;
38+
cursor: pointer;
39+
position: fixed;
40+
top: 90%;
41+
right: 0px;
42+
background-color: var(--va-background-secondary);
43+
color: var(--va-on-primary);
44+
padding: 0.75rem 0.75rem;
45+
white-space: nowrap;
46+
border-top-left-radius: 0.5rem;
47+
border-bottom-left-radius: 0.5rem;
48+
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
49+
transition: right 0.3s ease-in-out;
50+
51+
&__close {
52+
transition: height 0.3s ease-in-out, margin-top 0.3s ease-in-out;
53+
height: 0;
54+
overflow: hidden;
55+
}
56+
57+
&:hover {
58+
.va-open-devtools-button__close {
59+
height: 1rem;
60+
margin-top: 1rem;
61+
}
62+
}
63+
}
64+
</style>

‎packages/compiler/devtools/client/ui/components/base/DraggableWindow.vue‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ const windowSize = useWindowSize()
2525
const boxSize = useElementRect(box)
2626
2727
const props = defineProps<{
28-
defaultPosition: 'top-left' | 'top-right' | 'bottom-center' | 'bottom-left',
28+
defaultPosition: 'top-left' | 'top-right' | 'bottom-center' | 'bottom-left' | 'bottom-right',
2929
offsetY?: number,
3030
offsetX?: number,
3131
}>()
@@ -110,6 +110,7 @@ const updateLeftAndTop = () => {
110110
'top-right': { top: PADDING, left: windowSize.width },
111111
'bottom-center': { top: windowSize.height, left: windowSize.width / 2 },
112112
'bottom-left': { top: windowSize.height, left: PADDING },
113+
'bottom-right': { top: windowSize.height, left: windowSize.width },
113114
}
114115
115116
top.value = positions[props.defaultPosition].top

‎packages/compiler/devtools/client/vite.config.ts‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,19 @@
22
import { fileURLToPath, URL } from 'node:url'
33
import { defineConfig } from 'vite'
44
import vue from '@vitejs/plugin-vue'
5-
import { appendStyle } from './build/append-style'
5+
import { appendStyle } from './build/append-style'
66

77
// https://vitejs.dev/config/
88
export default defineConfig({
99
plugins: [
10-
vue(),
10+
vue() as any,
1111
appendStyle('vuestic-devtools.es.js')
1212
],
1313

14+
optimizeDeps: {
15+
include: ["oniguruma-to-es"],
16+
},
17+
1418
build: {
1519
minify: false,
1620
sourcemap: false,

‎packages/compiler/logger.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import { createLogger } from "vite";
2+
3+
export const logger = createLogger('info', {
4+
prefix: '[vuestic:compiler]'
5+
})

‎packages/compiler/package.json‎

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
{
22
"name": "@vuestic/compiler",
3-
"version": "0.1.0",
3+
"version": "0.2.4",
4+
"type": "module",
45
"dependencies": {
56
"@rollup/pluginutils": "^5.1.0",
67
"acorn": "^8.12.1",
78
"shiki": "^1.10.1",
8-
"typescript": "^5.8.2"
9+
"unplugin-vue-components": "^28.8.0"
910
},
1011
"scripts": {
1112
"build": "rm -rf ./dist && yarn build:vite && yarn build:devtools:client",
@@ -23,15 +24,15 @@
2324
},
2425
"exports": {
2526
"./vite": {
26-
"import": "./dist/vite/index.mjs",
27-
"require": "./dist/vite/index.js",
2827
"types": {
2928
"import": "./dist/vite/index.d.ts",
3029
"require": "./dist/vite/index.d.ts",
3130
"default": "./dist/vite/index.d.ts"
3231
},
33-
"default": "./dist/vite/index.mjs",
34-
"node": "./dist/vite/index.mjs"
32+
"node": "./dist/vite/index.js",
33+
"import": "./dist/vite/index.js",
34+
"require": "./dist/vite/index.cjs",
35+
"default": "./dist/vite/index.js"
3536
},
3637
"./devtools": "./dist/devtools/client/vuestic-devtools.es.js"
3738
},
@@ -46,6 +47,9 @@
4647
"Readme.md"
4748
],
4849
"devDependencies": {
50+
"@vitejs/plugin-vue": "^6.0.0",
51+
"tsup": "^8.5.0",
52+
"vite": "5.3.3",
4953
"vitest": "^3.0.8"
5054
}
5155
}

0 commit comments

Comments
 (0)