@mlightcad/cad-viewer 1.4.8 → 1.4.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -21
- package/README.md +380 -380
- package/dist/composable/useHover.d.ts.map +1 -1
- package/dist/index.css +1 -1
- package/dist/index.js +26 -26
- package/package.json +4 -4
package/LICENSE
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
MIT License
|
|
2
|
-
|
|
3
|
-
Copyright (c) 2025 mlight-lee
|
|
4
|
-
|
|
5
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
-
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
-
in the Software without restriction, including without limitation the rights
|
|
8
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
-
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
-
furnished to do so, subject to the following conditions:
|
|
11
|
-
|
|
12
|
-
The above copyright notice and this permission notice shall be included in all
|
|
13
|
-
copies or substantial portions of the Software.
|
|
14
|
-
|
|
15
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
-
SOFTWARE.
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2025 mlight-lee
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
CHANGED
|
@@ -1,381 +1,381 @@
|
|
|
1
|
-
# CAD Viewer Component
|
|
2
|
-
|
|
3
|
-
CAD Viewer is a **high-performance** Vue 3 component for viewing and editing CAD files (DXF, DWG) **entirely in the browser without requiring any backend server**. It provides a modern user interface, state management, and seamless integration with optimized rendering engines for smooth browser-based CAD workflows with exceptional performance.
|
|
4
|
-
|
|
5
|
-
## Key Features
|
|
6
|
-
|
|
7
|
-
- **High-performance** CAD editing and viewing with smooth 60+ FPS rendering
|
|
8
|
-
- **No backend required** - Files are parsed and processed entirely in the browser
|
|
9
|
-
- **Enhanced data security** - Files never leave your device, ensuring complete privacy
|
|
10
|
-
- **Local file support** - Load DWG/DXF files directly from your computer via file dialog or drag & drop
|
|
11
|
-
- **Remote file support** - Load CAD files from URLs automatically
|
|
12
|
-
- **Easy integration** - No server setup or backend infrastructure needed for third-party integration
|
|
13
|
-
- **Customizable UI** - Control visibility of toolbars, command line, coordinates, and performance stats
|
|
14
|
-
- **Customizable Resources** - Set custom base URLs for fonts, templates, and example files
|
|
15
|
-
- Modern UI optimized for large CAD file handling
|
|
16
|
-
- State management for layers, entities, and settings
|
|
17
|
-
- Integration with optimized SVG and THREE.js renderers
|
|
18
|
-
- Dialogs, toolbars, and command line interface
|
|
19
|
-
- Vue 3 component for embedding high-performance CAD viewers in your own apps
|
|
20
|
-
|
|
21
|
-
## When Should You Choose cad-viewer?
|
|
22
|
-
|
|
23
|
-
Use `cad-viewer` if you want a **ready-to-use Vue 3 component** for viewing and editing CAD files with a modern UI, dialogs, toolbars, and state management. This package is ideal if:
|
|
24
|
-
|
|
25
|
-
- You want to quickly embed a high-performance CAD viewer/editor into your Vue application with minimal setup.
|
|
26
|
-
- You need support for both local file loading (from user's computer) and remote file loading (from URLs).
|
|
27
|
-
- You need a solution that handles file loading, rendering, layer/entity management, and user interactions out of the box.
|
|
28
|
-
- You want seamless integration with optimized SVG and THREE.js renderers, internationalization, and theming.
|
|
29
|
-
- You do **not** want to build your own UI from scratch.
|
|
30
|
-
|
|
31
|
-
**Recommended for:** Most web applications, dashboards, or platforms that need to display CAD files with a polished user interface.
|
|
32
|
-
|
|
33
|
-
## Browser-Only Architecture
|
|
34
|
-
|
|
35
|
-
This Vue 3 component operates entirely in the browser with **no backend dependencies**. DWG/DXF files are parsed and processed locally using WebAssembly and JavaScript, providing:
|
|
36
|
-
|
|
37
|
-
- **Zero server requirements** - Deploy the component anywhere with just static file hosting
|
|
38
|
-
- **Complete data privacy** - CAD files never leave the user's device, whether loaded locally or from URLs
|
|
39
|
-
- **Local file support** - Users can load files directly from their computer using the built-in file dialog
|
|
40
|
-
- **Remote file support** - Automatically load files from URLs when provided
|
|
41
|
-
- **Instant integration** - No complex backend setup or API configuration needed
|
|
42
|
-
- **Offline capability** - Works without internet connectivity once loaded
|
|
43
|
-
- **Third-party friendly** - Easy to embed in any Vue 3 application without server-side concerns
|
|
44
|
-
|
|
45
|
-
## File Loading Methods
|
|
46
|
-
|
|
47
|
-
The MlCadViewer component supports multiple ways to load CAD files:
|
|
48
|
-
|
|
49
|
-
### 1. Local File Loading
|
|
50
|
-
Users can load files directly from their computer:
|
|
51
|
-
- **File Dialog**: Click the main menu (☰) and select "Open" to browse and select local DWG/DXF files
|
|
52
|
-
- **Drag & Drop**: Drag and drop CAD files directly onto the viewer (if implemented in your application)
|
|
53
|
-
- **File Input**: Use the built-in file reader component for programmatic file selection
|
|
54
|
-
- **Component Prop**: Pass a File object directly to the `localFile` prop for automatic loading
|
|
55
|
-
|
|
56
|
-
#### Example: Using localFile prop with file input
|
|
57
|
-
```vue
|
|
58
|
-
<template>
|
|
59
|
-
<div>
|
|
60
|
-
<input
|
|
61
|
-
type="file"
|
|
62
|
-
accept=".dwg,.dxf"
|
|
63
|
-
@change="handleFileSelect"
|
|
64
|
-
/>
|
|
65
|
-
<MlCadViewer
|
|
66
|
-
:local-file="selectedFile"
|
|
67
|
-
/>
|
|
68
|
-
</div>
|
|
69
|
-
</template>
|
|
70
|
-
|
|
71
|
-
<script setup lang="ts">
|
|
72
|
-
import { ref } from 'vue'
|
|
73
|
-
import { MlCadViewer } from '@mlightcad/cad-viewer'
|
|
74
|
-
|
|
75
|
-
const selectedFile = ref<File | undefined>()
|
|
76
|
-
|
|
77
|
-
const handleFileSelect = (event: Event) => {
|
|
78
|
-
const target = event.target as HTMLInputElement
|
|
79
|
-
selectedFile.value = target.files?.[0]
|
|
80
|
-
}
|
|
81
|
-
</script>
|
|
82
|
-
```
|
|
83
|
-
|
|
84
|
-
### 2. Remote File Loading
|
|
85
|
-
Automatically load files from URLs:
|
|
86
|
-
- **URL Prop**: Provide a `url` prop to automatically load a file when the component mounts
|
|
87
|
-
- **Dynamic Loading**: Change the `url` prop to load different files without remounting the component
|
|
88
|
-
|
|
89
|
-
### 3. Supported File Formats
|
|
90
|
-
- **DWG files**: Binary AutoCAD drawing format (read as ArrayBuffer)
|
|
91
|
-
- **DXF files**: ASCII/binary AutoCAD drawing exchange format (read as text)
|
|
92
|
-
|
|
93
|
-
## Directory Structure (partial)
|
|
94
|
-
|
|
95
|
-
- `src/app/` – Application entry, store, and main logic
|
|
96
|
-
- `src/component/` – UI components (dialogs, toolbars, status bar, etc.)
|
|
97
|
-
- `src/composable/` – Vue composables for state and logic
|
|
98
|
-
- `src/locale/` – Internationalization files
|
|
99
|
-
- `src/style/` – Stylesheets
|
|
100
|
-
- `src/svg/` – SVG assets
|
|
101
|
-
|
|
102
|
-
## Installation
|
|
103
|
-
|
|
104
|
-
```bash
|
|
105
|
-
npm install @mlightcad/cad-viewer
|
|
106
|
-
```
|
|
107
|
-
|
|
108
|
-
## Usage
|
|
109
|
-
|
|
110
|
-
Please refer to sub-package `cad-viewer-example` as one example.
|
|
111
|
-
|
|
112
|
-
### Basic Usage
|
|
113
|
-
|
|
114
|
-
Firstly, add the following dependencies into your package.json.
|
|
115
|
-
|
|
116
|
-
- @element-plus/icons-vue
|
|
117
|
-
- @mlightcad/cad-simple-viewer
|
|
118
|
-
- @mlightcad/cad-viewer
|
|
119
|
-
- @mlightcad/data-model
|
|
120
|
-
- @vueuse/core
|
|
121
|
-
- element-plus
|
|
122
|
-
- vue
|
|
123
|
-
- vue-i18n
|
|
124
|
-
|
|
125
|
-
Then create one vue component as follows.
|
|
126
|
-
|
|
127
|
-
```vue
|
|
128
|
-
<template>
|
|
129
|
-
<div>
|
|
130
|
-
<!-- For local file loading (users can open files via menu) -->
|
|
131
|
-
<MlCADViewer :background="0x808080" />
|
|
132
|
-
|
|
133
|
-
<!-- For remote file loading (automatically loads from URL) -->
|
|
134
|
-
<!-- <MlCADViewer
|
|
135
|
-
:background="0x808080"
|
|
136
|
-
:url="'https://example.com/drawing.dwg'"
|
|
137
|
-
/> -->
|
|
138
|
-
|
|
139
|
-
<!-- For local file loading (automatically loads from File object) -->
|
|
140
|
-
<!-- <MlCADViewer
|
|
141
|
-
:background="0x808080"
|
|
142
|
-
:local-file="selectedFile"
|
|
143
|
-
/> -->
|
|
144
|
-
|
|
145
|
-
<!-- With custom base URL for fonts and templates -->
|
|
146
|
-
<!-- <MlCADViewer
|
|
147
|
-
:background="0x808080"
|
|
148
|
-
:base-url="'https://my-cdn.com/cad-data/'"
|
|
149
|
-
/> -->
|
|
150
|
-
</div>
|
|
151
|
-
</template>
|
|
152
|
-
|
|
153
|
-
<script setup lang="ts">
|
|
154
|
-
import 'uno.css'
|
|
155
|
-
import 'element-plus/dist/index.css'
|
|
156
|
-
import 'element-plus/dist/index.css'
|
|
157
|
-
|
|
158
|
-
import {
|
|
159
|
-
i18n,
|
|
160
|
-
MlCadViewer
|
|
161
|
-
} from '@mlightcad/cad-viewer'
|
|
162
|
-
import ElementPlus from 'element-plus'
|
|
163
|
-
import { createApp } from 'vue'
|
|
164
|
-
|
|
165
|
-
const initApp = () => {
|
|
166
|
-
const app = createApp(MlCadViewer)
|
|
167
|
-
app.use(i18n)
|
|
168
|
-
app.use(ElementPlus)
|
|
169
|
-
app.mount('#app')
|
|
170
|
-
}
|
|
171
|
-
|
|
172
|
-
initApp()
|
|
173
|
-
</script>
|
|
174
|
-
```
|
|
175
|
-
|
|
176
|
-
## MlCadViewer Component
|
|
177
|
-
|
|
178
|
-
The `MlCadViewer` is the main Vue 3 component that provides a complete CAD viewing and editing interface. It includes toolbars, layer management, command line, status bar, and various dialogs for a full-featured CAD experience.
|
|
179
|
-
|
|
180
|
-
### Component Properties
|
|
181
|
-
|
|
182
|
-
The `MlCadViewer` component accepts the following props:
|
|
183
|
-
|
|
184
|
-
| Property | Type | Default | Description |
|
|
185
|
-
|----------|------|---------|-------------|
|
|
186
|
-
| `locale` | `'en' \| 'zh' \| 'default'` | `'default'` | Sets the language for the component interface. Use `'en'` for English, `'zh'` for Chinese, or `'default'` to use the browser's default language. |
|
|
187
|
-
| `url` | `string` | `undefined` | Optional URL to automatically load a CAD file when the component mounts. The file will be fetched and opened automatically. **Note**: If not provided, users can still load local files using the main menu "Open" option. |
|
|
188
|
-
| `localFile` | `File` | `undefined` | Optional local File object to automatically load a CAD file when the component mounts. The file will be read and opened automatically. **Note**: This takes precedence over the `url` prop if both are provided. |
|
|
189
|
-
| `background` | `number` | `undefined` | Background color as 24-bit hexadecimal RGB (e.g., `0x000000` for black, `0x808080` for gray). |
|
|
190
|
-
| `baseUrl` | `string` | `undefined` | Base URL for loading fonts, templates, and example files. This URL is used by the CAD viewer to load resources like fonts and drawing templates. **Note**: If not provided, uses the default URL. |
|
|
191
|
-
| `useMainThreadDraw` | `boolean` | `false` | Optional flag whether to use main thread or webwork to render drawing. The true value means using main thread to render drawing. This approach take less memory and take longer time to show rendering results. The false value means using web worker to render drawing. This approach take more memory and take shorter time to show rendering results. |
|
|
192
|
-
| `theme` | `'light' \| 'dark'` | `'dark'` | Initial theme of the CAD viewer. `'light'` applies the light theme (`ml-theme-light` class) and `'dark'` applies the dark theme (`ml-theme-dark` class). The theme can also be toggled at runtime using the status bar theme button. |
|
|
193
|
-
| `mode` | `AcEdOpenMode` | `'AcEdOpenMode.Write'` | Access mode for opening CAD files. `'AcEdOpenMode.Read'` means read-only access. `'AcEdOpenMode.Review'` means review access, compatible with read. `'AcEdOpenMode.Write'` means full read/write access, compatible with review and read. |
|
|
194
|
-
### UI Settings
|
|
195
|
-
|
|
196
|
-
The `MlCadViewer` reads its UI visibility from the global `AcApSettingManager` (provided by `@mlightcad/cad-simple-viewer`). Configure these flags anywhere before rendering the viewer to customize the UI.
|
|
197
|
-
|
|
198
|
-
| Setting | Type | Default | Description |
|
|
199
|
-
|---------|------|---------|-------------|
|
|
200
|
-
| `isShowToolbar` | `boolean` | `true` | Controls toolbar visibility |
|
|
201
|
-
| `isShowCommandLine` | `boolean` | `true` | Controls command line visibility |
|
|
202
|
-
| `isShowCoordinate` | `boolean` | `true` | Controls coordinate display visibility |
|
|
203
|
-
| `isShowEntityInfo` | `boolean` | `false` | Controls entity info card visibility |
|
|
204
|
-
| `isShowLanguageSelector` | `boolean` | `true` | Controls language selector visibility |
|
|
205
|
-
| `isShowMainMenu` | `boolean` | `true` | Controls main menu visibility |
|
|
206
|
-
| `isShowStats` | `boolean` | `false` | Controls performance statistics display |
|
|
207
|
-
|
|
208
|
-
#### Example (recommended)
|
|
209
|
-
```vue
|
|
210
|
-
<template>
|
|
211
|
-
<!-- Local file loading - users can open files via main menu -->
|
|
212
|
-
<MlCadViewer locale="en" />
|
|
213
|
-
|
|
214
|
-
<!-- Remote file loading - automatically loads from URL -->
|
|
215
|
-
<!-- <MlCadViewer
|
|
216
|
-
locale="en"
|
|
217
|
-
:url="'https://example.com/drawing.dwg'"
|
|
218
|
-
/> -->
|
|
219
|
-
|
|
220
|
-
<!-- Local file loading - automatically loads from File object -->
|
|
221
|
-
<!-- <MlCadViewer
|
|
222
|
-
locale="en"
|
|
223
|
-
:local-file="selectedFile"
|
|
224
|
-
/> -->
|
|
225
|
-
|
|
226
|
-
<!-- Custom baseUrl for fonts and templates -->
|
|
227
|
-
<!-- <MlCadViewer
|
|
228
|
-
locale="en"
|
|
229
|
-
:base-url="'https://my-cdn.com/cad-data/'"
|
|
230
|
-
/> -->
|
|
231
|
-
</template>
|
|
232
|
-
|
|
233
|
-
<script setup lang="ts">
|
|
234
|
-
import { MlCadViewer } from '@mlightcad/cad-viewer'
|
|
235
|
-
import { AcApSettingManager } from '@mlightcad/cad-simple-viewer'
|
|
236
|
-
|
|
237
|
-
// Configure global UI flags before the viewer mounts
|
|
238
|
-
AcApSettingManager.instance.isShowCommandLine = false
|
|
239
|
-
// Optional toggles
|
|
240
|
-
// AcApSettingManager.instance.isShowToolbar = false
|
|
241
|
-
// AcApSettingManager.instance.isShowStats = true
|
|
242
|
-
// AcApSettingManager.instance.isShowCoordinate = false
|
|
243
|
-
// AcApSettingManager.instance.isShowEntityInfo = false
|
|
244
|
-
</script>
|
|
245
|
-
```
|
|
246
|
-
|
|
247
|
-
#### Notes
|
|
248
|
-
|
|
249
|
-
- Settings are global and immediately reflected by `MlCadViewer`.
|
|
250
|
-
- You can change them at runtime using the same `AcApSettingManager.instance` reference.
|
|
251
|
-
|
|
252
|
-
### Base URL Configuration
|
|
253
|
-
|
|
254
|
-
The `baseUrl` property allows you to customize where the CAD viewer loads fonts, templates, and example files from. This is particularly useful for:
|
|
255
|
-
|
|
256
|
-
- **Self-hosted resources**: Host your own fonts and templates on your CDN or server
|
|
257
|
-
- **Corporate environments**: Use internal servers for CAD resources
|
|
258
|
-
- **Offline deployments**: Serve resources from local file systems
|
|
259
|
-
- **Custom branding**: Use your own templates and fonts
|
|
260
|
-
|
|
261
|
-
#### Default Behavior
|
|
262
|
-
If no `baseUrl` is provided, the viewer uses the default URL: `https://mlightcad.gitlab.io/cad-data/`
|
|
263
|
-
|
|
264
|
-
#### Resource Structure
|
|
265
|
-
When using a custom `baseUrl`, ensure your server has the following structure:
|
|
266
|
-
```
|
|
267
|
-
your-base-url/
|
|
268
|
-
├── fonts/ # Font files for text rendering
|
|
269
|
-
├── templates/ # Drawing templates (e.g., acadiso.dxf)
|
|
270
|
-
└── examples/ # Example CAD files
|
|
271
|
-
```
|
|
272
|
-
|
|
273
|
-
#### Example: Custom Base URL
|
|
274
|
-
```vue
|
|
275
|
-
<template>
|
|
276
|
-
<MlCadViewer
|
|
277
|
-
:base-url="'https://my-company.com/cad-resources/'"
|
|
278
|
-
:url="'https://my-company.com/drawings/project.dwg'"
|
|
279
|
-
/>
|
|
280
|
-
</template>
|
|
281
|
-
```
|
|
282
|
-
|
|
283
|
-
This configuration will:
|
|
284
|
-
- Load fonts from `https://my-company.com/cad-resources/fonts/`
|
|
285
|
-
- Load templates from `https://my-company.com/cad-resources/templates/`
|
|
286
|
-
- Use the custom base URL for any "Quick New" operations
|
|
287
|
-
|
|
288
|
-
### Component Features
|
|
289
|
-
|
|
290
|
-
The `MlCadViewer` component includes:
|
|
291
|
-
|
|
292
|
-
- **Main Menu** - File operations (including local file opening), view controls, and settings
|
|
293
|
-
- **Toolbars** - Drawing tools, zoom controls, and selection tools
|
|
294
|
-
- **Layer Manager** - Layer visibility and property management
|
|
295
|
-
- **Command Line** - AutoCAD-style command input
|
|
296
|
-
- **Status Bar** - Current position, zoom level, and system status
|
|
297
|
-
- **Dialog Manager** - Modal dialogs for various operations
|
|
298
|
-
- **File Reader** - Local file loading via file dialog and drag-and-drop support
|
|
299
|
-
- **Entity Info** - Detailed information about selected entities
|
|
300
|
-
- **Language Selector** - UI language switching
|
|
301
|
-
- **Theme Support** - Dark/light mode toggle
|
|
302
|
-
|
|
303
|
-
### Event Handling
|
|
304
|
-
|
|
305
|
-
The component automatically handles various events:
|
|
306
|
-
|
|
307
|
-
- **File Loading** - Supports local file loading (via file dialog), drag-and-drop, and URL-based file loading
|
|
308
|
-
- **Error Messages** - Displays user-friendly error messages for failed operations
|
|
309
|
-
- **Font Loading** - Handles missing fonts with appropriate notifications
|
|
310
|
-
- **System Messages** - Shows status updates and operation feedback
|
|
311
|
-
|
|
312
|
-
### Advanced Usage
|
|
313
|
-
|
|
314
|
-
Please refer to [readme of cad-simple-viewer](../cad-simple-viewer/README.md) to learn the following advanced usage.
|
|
315
|
-
|
|
316
|
-
- Register DWG converter to display drawings in DWG format
|
|
317
|
-
- Define your own font loader to load fonts from your own server
|
|
318
|
-
- Create drawing or modify drawing
|
|
319
|
-
|
|
320
|
-
## Available Exports
|
|
321
|
-
|
|
322
|
-
### Main Component
|
|
323
|
-
|
|
324
|
-
- `MlCADViewer` - The main CAD viewer component
|
|
325
|
-
|
|
326
|
-
### Commands
|
|
327
|
-
|
|
328
|
-
- `AcApLayerStateCmd` - Layer state command
|
|
329
|
-
- `AcApLogCmd` - Log command
|
|
330
|
-
- `AcApMissedDataCmd` - Missed data command
|
|
331
|
-
- `AcApPointStyleCmd` - Point style command
|
|
332
|
-
|
|
333
|
-
### Components
|
|
334
|
-
|
|
335
|
-
- `MlPointStyleDlg` - Point style dialog
|
|
336
|
-
- `MlReplacementDlg` - Replacement dialog
|
|
337
|
-
- Various layout and UI components
|
|
338
|
-
|
|
339
|
-
### Composables
|
|
340
|
-
|
|
341
|
-
- `useCommands` - Command management
|
|
342
|
-
- `useCurrentPos` - Current position tracking
|
|
343
|
-
- `useDark` - Dark mode support
|
|
344
|
-
- `useDialogManager` - Dialog management
|
|
345
|
-
- `useFileTypes` - File type utilities
|
|
346
|
-
- `useLayers` - Layer management
|
|
347
|
-
- `useLayouts` - Layout management
|
|
348
|
-
- `useMissedData` - Missed data handling
|
|
349
|
-
- `useSettings` - Settings management
|
|
350
|
-
- `useSystemVars` - System variables
|
|
351
|
-
|
|
352
|
-
### Locale
|
|
353
|
-
|
|
354
|
-
- `i18n` - Internationalization instance
|
|
355
|
-
- Language files for English and Chinese
|
|
356
|
-
|
|
357
|
-
### Styles
|
|
358
|
-
|
|
359
|
-
- CSS and SCSS files for styling
|
|
360
|
-
- Dark mode support
|
|
361
|
-
- Element Plus integration
|
|
362
|
-
|
|
363
|
-
## Development
|
|
364
|
-
|
|
365
|
-
```bash
|
|
366
|
-
# Install dependencies
|
|
367
|
-
pnpm install
|
|
368
|
-
|
|
369
|
-
# Start development server
|
|
370
|
-
pnpm dev
|
|
371
|
-
|
|
372
|
-
# Build the library
|
|
373
|
-
pnpm build
|
|
374
|
-
|
|
375
|
-
# Preview the build
|
|
376
|
-
pnpm preview
|
|
377
|
-
```
|
|
378
|
-
|
|
379
|
-
## License
|
|
380
|
-
|
|
1
|
+
# CAD Viewer Component
|
|
2
|
+
|
|
3
|
+
CAD Viewer is a **high-performance** Vue 3 component for viewing and editing CAD files (DXF, DWG) **entirely in the browser without requiring any backend server**. It provides a modern user interface, state management, and seamless integration with optimized rendering engines for smooth browser-based CAD workflows with exceptional performance.
|
|
4
|
+
|
|
5
|
+
## Key Features
|
|
6
|
+
|
|
7
|
+
- **High-performance** CAD editing and viewing with smooth 60+ FPS rendering
|
|
8
|
+
- **No backend required** - Files are parsed and processed entirely in the browser
|
|
9
|
+
- **Enhanced data security** - Files never leave your device, ensuring complete privacy
|
|
10
|
+
- **Local file support** - Load DWG/DXF files directly from your computer via file dialog or drag & drop
|
|
11
|
+
- **Remote file support** - Load CAD files from URLs automatically
|
|
12
|
+
- **Easy integration** - No server setup or backend infrastructure needed for third-party integration
|
|
13
|
+
- **Customizable UI** - Control visibility of toolbars, command line, coordinates, and performance stats
|
|
14
|
+
- **Customizable Resources** - Set custom base URLs for fonts, templates, and example files
|
|
15
|
+
- Modern UI optimized for large CAD file handling
|
|
16
|
+
- State management for layers, entities, and settings
|
|
17
|
+
- Integration with optimized SVG and THREE.js renderers
|
|
18
|
+
- Dialogs, toolbars, and command line interface
|
|
19
|
+
- Vue 3 component for embedding high-performance CAD viewers in your own apps
|
|
20
|
+
|
|
21
|
+
## When Should You Choose cad-viewer?
|
|
22
|
+
|
|
23
|
+
Use `cad-viewer` if you want a **ready-to-use Vue 3 component** for viewing and editing CAD files with a modern UI, dialogs, toolbars, and state management. This package is ideal if:
|
|
24
|
+
|
|
25
|
+
- You want to quickly embed a high-performance CAD viewer/editor into your Vue application with minimal setup.
|
|
26
|
+
- You need support for both local file loading (from user's computer) and remote file loading (from URLs).
|
|
27
|
+
- You need a solution that handles file loading, rendering, layer/entity management, and user interactions out of the box.
|
|
28
|
+
- You want seamless integration with optimized SVG and THREE.js renderers, internationalization, and theming.
|
|
29
|
+
- You do **not** want to build your own UI from scratch.
|
|
30
|
+
|
|
31
|
+
**Recommended for:** Most web applications, dashboards, or platforms that need to display CAD files with a polished user interface.
|
|
32
|
+
|
|
33
|
+
## Browser-Only Architecture
|
|
34
|
+
|
|
35
|
+
This Vue 3 component operates entirely in the browser with **no backend dependencies**. DWG/DXF files are parsed and processed locally using WebAssembly and JavaScript, providing:
|
|
36
|
+
|
|
37
|
+
- **Zero server requirements** - Deploy the component anywhere with just static file hosting
|
|
38
|
+
- **Complete data privacy** - CAD files never leave the user's device, whether loaded locally or from URLs
|
|
39
|
+
- **Local file support** - Users can load files directly from their computer using the built-in file dialog
|
|
40
|
+
- **Remote file support** - Automatically load files from URLs when provided
|
|
41
|
+
- **Instant integration** - No complex backend setup or API configuration needed
|
|
42
|
+
- **Offline capability** - Works without internet connectivity once loaded
|
|
43
|
+
- **Third-party friendly** - Easy to embed in any Vue 3 application without server-side concerns
|
|
44
|
+
|
|
45
|
+
## File Loading Methods
|
|
46
|
+
|
|
47
|
+
The MlCadViewer component supports multiple ways to load CAD files:
|
|
48
|
+
|
|
49
|
+
### 1. Local File Loading
|
|
50
|
+
Users can load files directly from their computer:
|
|
51
|
+
- **File Dialog**: Click the main menu (☰) and select "Open" to browse and select local DWG/DXF files
|
|
52
|
+
- **Drag & Drop**: Drag and drop CAD files directly onto the viewer (if implemented in your application)
|
|
53
|
+
- **File Input**: Use the built-in file reader component for programmatic file selection
|
|
54
|
+
- **Component Prop**: Pass a File object directly to the `localFile` prop for automatic loading
|
|
55
|
+
|
|
56
|
+
#### Example: Using localFile prop with file input
|
|
57
|
+
```vue
|
|
58
|
+
<template>
|
|
59
|
+
<div>
|
|
60
|
+
<input
|
|
61
|
+
type="file"
|
|
62
|
+
accept=".dwg,.dxf"
|
|
63
|
+
@change="handleFileSelect"
|
|
64
|
+
/>
|
|
65
|
+
<MlCadViewer
|
|
66
|
+
:local-file="selectedFile"
|
|
67
|
+
/>
|
|
68
|
+
</div>
|
|
69
|
+
</template>
|
|
70
|
+
|
|
71
|
+
<script setup lang="ts">
|
|
72
|
+
import { ref } from 'vue'
|
|
73
|
+
import { MlCadViewer } from '@mlightcad/cad-viewer'
|
|
74
|
+
|
|
75
|
+
const selectedFile = ref<File | undefined>()
|
|
76
|
+
|
|
77
|
+
const handleFileSelect = (event: Event) => {
|
|
78
|
+
const target = event.target as HTMLInputElement
|
|
79
|
+
selectedFile.value = target.files?.[0]
|
|
80
|
+
}
|
|
81
|
+
</script>
|
|
82
|
+
```
|
|
83
|
+
|
|
84
|
+
### 2. Remote File Loading
|
|
85
|
+
Automatically load files from URLs:
|
|
86
|
+
- **URL Prop**: Provide a `url` prop to automatically load a file when the component mounts
|
|
87
|
+
- **Dynamic Loading**: Change the `url` prop to load different files without remounting the component
|
|
88
|
+
|
|
89
|
+
### 3. Supported File Formats
|
|
90
|
+
- **DWG files**: Binary AutoCAD drawing format (read as ArrayBuffer)
|
|
91
|
+
- **DXF files**: ASCII/binary AutoCAD drawing exchange format (read as text)
|
|
92
|
+
|
|
93
|
+
## Directory Structure (partial)
|
|
94
|
+
|
|
95
|
+
- `src/app/` – Application entry, store, and main logic
|
|
96
|
+
- `src/component/` – UI components (dialogs, toolbars, status bar, etc.)
|
|
97
|
+
- `src/composable/` – Vue composables for state and logic
|
|
98
|
+
- `src/locale/` – Internationalization files
|
|
99
|
+
- `src/style/` – Stylesheets
|
|
100
|
+
- `src/svg/` – SVG assets
|
|
101
|
+
|
|
102
|
+
## Installation
|
|
103
|
+
|
|
104
|
+
```bash
|
|
105
|
+
npm install @mlightcad/cad-viewer
|
|
106
|
+
```
|
|
107
|
+
|
|
108
|
+
## Usage
|
|
109
|
+
|
|
110
|
+
Please refer to sub-package `cad-viewer-example` as one example.
|
|
111
|
+
|
|
112
|
+
### Basic Usage
|
|
113
|
+
|
|
114
|
+
Firstly, add the following dependencies into your package.json.
|
|
115
|
+
|
|
116
|
+
- @element-plus/icons-vue
|
|
117
|
+
- @mlightcad/cad-simple-viewer
|
|
118
|
+
- @mlightcad/cad-viewer
|
|
119
|
+
- @mlightcad/data-model
|
|
120
|
+
- @vueuse/core
|
|
121
|
+
- element-plus
|
|
122
|
+
- vue
|
|
123
|
+
- vue-i18n
|
|
124
|
+
|
|
125
|
+
Then create one vue component as follows.
|
|
126
|
+
|
|
127
|
+
```vue
|
|
128
|
+
<template>
|
|
129
|
+
<div>
|
|
130
|
+
<!-- For local file loading (users can open files via menu) -->
|
|
131
|
+
<MlCADViewer :background="0x808080" />
|
|
132
|
+
|
|
133
|
+
<!-- For remote file loading (automatically loads from URL) -->
|
|
134
|
+
<!-- <MlCADViewer
|
|
135
|
+
:background="0x808080"
|
|
136
|
+
:url="'https://example.com/drawing.dwg'"
|
|
137
|
+
/> -->
|
|
138
|
+
|
|
139
|
+
<!-- For local file loading (automatically loads from File object) -->
|
|
140
|
+
<!-- <MlCADViewer
|
|
141
|
+
:background="0x808080"
|
|
142
|
+
:local-file="selectedFile"
|
|
143
|
+
/> -->
|
|
144
|
+
|
|
145
|
+
<!-- With custom base URL for fonts and templates -->
|
|
146
|
+
<!-- <MlCADViewer
|
|
147
|
+
:background="0x808080"
|
|
148
|
+
:base-url="'https://my-cdn.com/cad-data/'"
|
|
149
|
+
/> -->
|
|
150
|
+
</div>
|
|
151
|
+
</template>
|
|
152
|
+
|
|
153
|
+
<script setup lang="ts">
|
|
154
|
+
import 'uno.css'
|
|
155
|
+
import 'element-plus/dist/index.css'
|
|
156
|
+
import 'element-plus/dist/index.css'
|
|
157
|
+
|
|
158
|
+
import {
|
|
159
|
+
i18n,
|
|
160
|
+
MlCadViewer
|
|
161
|
+
} from '@mlightcad/cad-viewer'
|
|
162
|
+
import ElementPlus from 'element-plus'
|
|
163
|
+
import { createApp } from 'vue'
|
|
164
|
+
|
|
165
|
+
const initApp = () => {
|
|
166
|
+
const app = createApp(MlCadViewer)
|
|
167
|
+
app.use(i18n)
|
|
168
|
+
app.use(ElementPlus)
|
|
169
|
+
app.mount('#app')
|
|
170
|
+
}
|
|
171
|
+
|
|
172
|
+
initApp()
|
|
173
|
+
</script>
|
|
174
|
+
```
|
|
175
|
+
|
|
176
|
+
## MlCadViewer Component
|
|
177
|
+
|
|
178
|
+
The `MlCadViewer` is the main Vue 3 component that provides a complete CAD viewing and editing interface. It includes toolbars, layer management, command line, status bar, and various dialogs for a full-featured CAD experience.
|
|
179
|
+
|
|
180
|
+
### Component Properties
|
|
181
|
+
|
|
182
|
+
The `MlCadViewer` component accepts the following props:
|
|
183
|
+
|
|
184
|
+
| Property | Type | Default | Description |
|
|
185
|
+
|----------|------|---------|-------------|
|
|
186
|
+
| `locale` | `'en' \| 'zh' \| 'default'` | `'default'` | Sets the language for the component interface. Use `'en'` for English, `'zh'` for Chinese, or `'default'` to use the browser's default language. |
|
|
187
|
+
| `url` | `string` | `undefined` | Optional URL to automatically load a CAD file when the component mounts. The file will be fetched and opened automatically. **Note**: If not provided, users can still load local files using the main menu "Open" option. |
|
|
188
|
+
| `localFile` | `File` | `undefined` | Optional local File object to automatically load a CAD file when the component mounts. The file will be read and opened automatically. **Note**: This takes precedence over the `url` prop if both are provided. |
|
|
189
|
+
| `background` | `number` | `undefined` | Background color as 24-bit hexadecimal RGB (e.g., `0x000000` for black, `0x808080` for gray). |
|
|
190
|
+
| `baseUrl` | `string` | `undefined` | Base URL for loading fonts, templates, and example files. This URL is used by the CAD viewer to load resources like fonts and drawing templates. **Note**: If not provided, uses the default URL. |
|
|
191
|
+
| `useMainThreadDraw` | `boolean` | `false` | Optional flag whether to use main thread or webwork to render drawing. The true value means using main thread to render drawing. This approach take less memory and take longer time to show rendering results. The false value means using web worker to render drawing. This approach take more memory and take shorter time to show rendering results. |
|
|
192
|
+
| `theme` | `'light' \| 'dark'` | `'dark'` | Initial theme of the CAD viewer. `'light'` applies the light theme (`ml-theme-light` class) and `'dark'` applies the dark theme (`ml-theme-dark` class). The theme can also be toggled at runtime using the status bar theme button. |
|
|
193
|
+
| `mode` | `AcEdOpenMode` | `'AcEdOpenMode.Write'` | Access mode for opening CAD files. `'AcEdOpenMode.Read'` means read-only access. `'AcEdOpenMode.Review'` means review access, compatible with read. `'AcEdOpenMode.Write'` means full read/write access, compatible with review and read. |
|
|
194
|
+
### UI Settings
|
|
195
|
+
|
|
196
|
+
The `MlCadViewer` reads its UI visibility from the global `AcApSettingManager` (provided by `@mlightcad/cad-simple-viewer`). Configure these flags anywhere before rendering the viewer to customize the UI.
|
|
197
|
+
|
|
198
|
+
| Setting | Type | Default | Description |
|
|
199
|
+
|---------|------|---------|-------------|
|
|
200
|
+
| `isShowToolbar` | `boolean` | `true` | Controls toolbar visibility |
|
|
201
|
+
| `isShowCommandLine` | `boolean` | `true` | Controls command line visibility |
|
|
202
|
+
| `isShowCoordinate` | `boolean` | `true` | Controls coordinate display visibility |
|
|
203
|
+
| `isShowEntityInfo` | `boolean` | `false` | Controls entity info card visibility |
|
|
204
|
+
| `isShowLanguageSelector` | `boolean` | `true` | Controls language selector visibility |
|
|
205
|
+
| `isShowMainMenu` | `boolean` | `true` | Controls main menu visibility |
|
|
206
|
+
| `isShowStats` | `boolean` | `false` | Controls performance statistics display |
|
|
207
|
+
|
|
208
|
+
#### Example (recommended)
|
|
209
|
+
```vue
|
|
210
|
+
<template>
|
|
211
|
+
<!-- Local file loading - users can open files via main menu -->
|
|
212
|
+
<MlCadViewer locale="en" />
|
|
213
|
+
|
|
214
|
+
<!-- Remote file loading - automatically loads from URL -->
|
|
215
|
+
<!-- <MlCadViewer
|
|
216
|
+
locale="en"
|
|
217
|
+
:url="'https://example.com/drawing.dwg'"
|
|
218
|
+
/> -->
|
|
219
|
+
|
|
220
|
+
<!-- Local file loading - automatically loads from File object -->
|
|
221
|
+
<!-- <MlCadViewer
|
|
222
|
+
locale="en"
|
|
223
|
+
:local-file="selectedFile"
|
|
224
|
+
/> -->
|
|
225
|
+
|
|
226
|
+
<!-- Custom baseUrl for fonts and templates -->
|
|
227
|
+
<!-- <MlCadViewer
|
|
228
|
+
locale="en"
|
|
229
|
+
:base-url="'https://my-cdn.com/cad-data/'"
|
|
230
|
+
/> -->
|
|
231
|
+
</template>
|
|
232
|
+
|
|
233
|
+
<script setup lang="ts">
|
|
234
|
+
import { MlCadViewer } from '@mlightcad/cad-viewer'
|
|
235
|
+
import { AcApSettingManager } from '@mlightcad/cad-simple-viewer'
|
|
236
|
+
|
|
237
|
+
// Configure global UI flags before the viewer mounts
|
|
238
|
+
AcApSettingManager.instance.isShowCommandLine = false
|
|
239
|
+
// Optional toggles
|
|
240
|
+
// AcApSettingManager.instance.isShowToolbar = false
|
|
241
|
+
// AcApSettingManager.instance.isShowStats = true
|
|
242
|
+
// AcApSettingManager.instance.isShowCoordinate = false
|
|
243
|
+
// AcApSettingManager.instance.isShowEntityInfo = false
|
|
244
|
+
</script>
|
|
245
|
+
```
|
|
246
|
+
|
|
247
|
+
#### Notes
|
|
248
|
+
|
|
249
|
+
- Settings are global and immediately reflected by `MlCadViewer`.
|
|
250
|
+
- You can change them at runtime using the same `AcApSettingManager.instance` reference.
|
|
251
|
+
|
|
252
|
+
### Base URL Configuration
|
|
253
|
+
|
|
254
|
+
The `baseUrl` property allows you to customize where the CAD viewer loads fonts, templates, and example files from. This is particularly useful for:
|
|
255
|
+
|
|
256
|
+
- **Self-hosted resources**: Host your own fonts and templates on your CDN or server
|
|
257
|
+
- **Corporate environments**: Use internal servers for CAD resources
|
|
258
|
+
- **Offline deployments**: Serve resources from local file systems
|
|
259
|
+
- **Custom branding**: Use your own templates and fonts
|
|
260
|
+
|
|
261
|
+
#### Default Behavior
|
|
262
|
+
If no `baseUrl` is provided, the viewer uses the default URL: `https://mlightcad.gitlab.io/cad-data/`
|
|
263
|
+
|
|
264
|
+
#### Resource Structure
|
|
265
|
+
When using a custom `baseUrl`, ensure your server has the following structure:
|
|
266
|
+
```
|
|
267
|
+
your-base-url/
|
|
268
|
+
├── fonts/ # Font files for text rendering
|
|
269
|
+
├── templates/ # Drawing templates (e.g., acadiso.dxf)
|
|
270
|
+
└── examples/ # Example CAD files
|
|
271
|
+
```
|
|
272
|
+
|
|
273
|
+
#### Example: Custom Base URL
|
|
274
|
+
```vue
|
|
275
|
+
<template>
|
|
276
|
+
<MlCadViewer
|
|
277
|
+
:base-url="'https://my-company.com/cad-resources/'"
|
|
278
|
+
:url="'https://my-company.com/drawings/project.dwg'"
|
|
279
|
+
/>
|
|
280
|
+
</template>
|
|
281
|
+
```
|
|
282
|
+
|
|
283
|
+
This configuration will:
|
|
284
|
+
- Load fonts from `https://my-company.com/cad-resources/fonts/`
|
|
285
|
+
- Load templates from `https://my-company.com/cad-resources/templates/`
|
|
286
|
+
- Use the custom base URL for any "Quick New" operations
|
|
287
|
+
|
|
288
|
+
### Component Features
|
|
289
|
+
|
|
290
|
+
The `MlCadViewer` component includes:
|
|
291
|
+
|
|
292
|
+
- **Main Menu** - File operations (including local file opening), view controls, and settings
|
|
293
|
+
- **Toolbars** - Drawing tools, zoom controls, and selection tools
|
|
294
|
+
- **Layer Manager** - Layer visibility and property management
|
|
295
|
+
- **Command Line** - AutoCAD-style command input
|
|
296
|
+
- **Status Bar** - Current position, zoom level, and system status
|
|
297
|
+
- **Dialog Manager** - Modal dialogs for various operations
|
|
298
|
+
- **File Reader** - Local file loading via file dialog and drag-and-drop support
|
|
299
|
+
- **Entity Info** - Detailed information about selected entities
|
|
300
|
+
- **Language Selector** - UI language switching
|
|
301
|
+
- **Theme Support** - Dark/light mode toggle
|
|
302
|
+
|
|
303
|
+
### Event Handling
|
|
304
|
+
|
|
305
|
+
The component automatically handles various events:
|
|
306
|
+
|
|
307
|
+
- **File Loading** - Supports local file loading (via file dialog), drag-and-drop, and URL-based file loading
|
|
308
|
+
- **Error Messages** - Displays user-friendly error messages for failed operations
|
|
309
|
+
- **Font Loading** - Handles missing fonts with appropriate notifications
|
|
310
|
+
- **System Messages** - Shows status updates and operation feedback
|
|
311
|
+
|
|
312
|
+
### Advanced Usage
|
|
313
|
+
|
|
314
|
+
Please refer to [readme of cad-simple-viewer](../cad-simple-viewer/README.md) to learn the following advanced usage.
|
|
315
|
+
|
|
316
|
+
- Register DWG converter to display drawings in DWG format
|
|
317
|
+
- Define your own font loader to load fonts from your own server
|
|
318
|
+
- Create drawing or modify drawing
|
|
319
|
+
|
|
320
|
+
## Available Exports
|
|
321
|
+
|
|
322
|
+
### Main Component
|
|
323
|
+
|
|
324
|
+
- `MlCADViewer` - The main CAD viewer component
|
|
325
|
+
|
|
326
|
+
### Commands
|
|
327
|
+
|
|
328
|
+
- `AcApLayerStateCmd` - Layer state command
|
|
329
|
+
- `AcApLogCmd` - Log command
|
|
330
|
+
- `AcApMissedDataCmd` - Missed data command
|
|
331
|
+
- `AcApPointStyleCmd` - Point style command
|
|
332
|
+
|
|
333
|
+
### Components
|
|
334
|
+
|
|
335
|
+
- `MlPointStyleDlg` - Point style dialog
|
|
336
|
+
- `MlReplacementDlg` - Replacement dialog
|
|
337
|
+
- Various layout and UI components
|
|
338
|
+
|
|
339
|
+
### Composables
|
|
340
|
+
|
|
341
|
+
- `useCommands` - Command management
|
|
342
|
+
- `useCurrentPos` - Current position tracking
|
|
343
|
+
- `useDark` - Dark mode support
|
|
344
|
+
- `useDialogManager` - Dialog management
|
|
345
|
+
- `useFileTypes` - File type utilities
|
|
346
|
+
- `useLayers` - Layer management
|
|
347
|
+
- `useLayouts` - Layout management
|
|
348
|
+
- `useMissedData` - Missed data handling
|
|
349
|
+
- `useSettings` - Settings management
|
|
350
|
+
- `useSystemVars` - System variables
|
|
351
|
+
|
|
352
|
+
### Locale
|
|
353
|
+
|
|
354
|
+
- `i18n` - Internationalization instance
|
|
355
|
+
- Language files for English and Chinese
|
|
356
|
+
|
|
357
|
+
### Styles
|
|
358
|
+
|
|
359
|
+
- CSS and SCSS files for styling
|
|
360
|
+
- Dark mode support
|
|
361
|
+
- Element Plus integration
|
|
362
|
+
|
|
363
|
+
## Development
|
|
364
|
+
|
|
365
|
+
```bash
|
|
366
|
+
# Install dependencies
|
|
367
|
+
pnpm install
|
|
368
|
+
|
|
369
|
+
# Start development server
|
|
370
|
+
pnpm dev
|
|
371
|
+
|
|
372
|
+
# Build the library
|
|
373
|
+
pnpm build
|
|
374
|
+
|
|
375
|
+
# Preview the build
|
|
376
|
+
pnpm preview
|
|
377
|
+
```
|
|
378
|
+
|
|
379
|
+
## License
|
|
380
|
+
|
|
381
381
|
MIT
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useHover.d.ts","sourceRoot":"","sources":["../../src/composable/useHover.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AAGhE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0DG;AACH,wBAAgB,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"useHover.d.ts","sourceRoot":"","sources":["../../src/composable/useHover.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AAGhE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0DG;AACH,wBAAgB,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iGAqD2yM,eAAgB,aAAY,eAAgB,cAAa,eAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iGAAzE,eAAgB,aAAY,eAAgB,cAAa,eAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAD34M"}
|
package/dist/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";body{margin:0;display:flex}body,html{height:100%}html.dark{color-scheme:dark;--el-color-primary: #409eff;--el-color-primary-light-3: rgb(51, 117, 185);--el-color-primary-light-5: rgb(42, 89, 138);--el-color-primary-light-7: rgb(33, 61, 91);--el-color-primary-light-8: rgb(29, 48, 67);--el-color-primary-light-9: rgb(24, 34, 43);--el-color-primary-dark-2: rgb(102, 177, 255);--el-color-success: #67c23a;--el-color-success-light-3: rgb(78, 142, 47);--el-color-success-light-5: rgb(62, 107, 39);--el-color-success-light-7: rgb(45, 72, 31);--el-color-success-light-8: rgb(37, 55, 28);--el-color-success-light-9: rgb(28, 37, 24);--el-color-success-dark-2: rgb(133, 206, 97);--el-color-warning: #e6a23c;--el-color-warning-light-3: rgb(167, 119, 48);--el-color-warning-light-5: rgb(125, 91, 40);--el-color-warning-light-7: rgb(83, 63, 32);--el-color-warning-light-8: rgb(62, 48, 28);--el-color-warning-light-9: rgb(41, 34, 24);--el-color-warning-dark-2: rgb(235, 181, 99);--el-color-danger: #f56c6c;--el-color-danger-light-3: rgb(178, 82, 82);--el-color-danger-light-5: rgb(133, 64, 64);--el-color-danger-light-7: rgb(88, 46, 46);--el-color-danger-light-8: rgb(65, 38, 38);--el-color-danger-light-9: rgb(42, 29, 29);--el-color-danger-dark-2: rgb(247, 137, 137);--el-color-error: #f56c6c;--el-color-error-light-3: rgb(178, 82, 82);--el-color-error-light-5: rgb(133, 64, 64);--el-color-error-light-7: rgb(88, 46, 46);--el-color-error-light-8: rgb(65, 38, 38);--el-color-error-light-9: rgb(42, 29, 29);--el-color-error-dark-2: rgb(247, 137, 137);--el-color-info: #909399;--el-color-info-light-3: rgb(107, 109, 113);--el-color-info-light-5: rgb(82, 84, 87);--el-color-info-light-7: rgb(57, 58, 60);--el-color-info-light-8: rgb(45, 45, 47);--el-color-info-light-9: rgb(32, 33, 33);--el-color-info-dark-2: rgb(166, 169, 173);--el-box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, .36), 0px 8px 20px rgba(0, 0, 0, .72);--el-box-shadow-light: 0px 0px 12px rgba(0, 0, 0, .72);--el-box-shadow-lighter: 0px 0px 6px rgba(0, 0, 0, .72);--el-box-shadow-dark: 0px 16px 48px 16px rgba(0, 0, 0, .72), 0px 12px 32px #000000, 0px 8px 16px -8px #000000;--el-bg-color-page: #0a0a0a;--el-bg-color: #141414;--el-bg-color-overlay: #1d1e1f;--el-text-color-primary: #E5EAF3;--el-text-color-regular: #CFD3DC;--el-text-color-secondary: #A3A6AD;--el-text-color-placeholder: #8D9095;--el-text-color-disabled: #6C6E72;--el-border-color-darker: #636466;--el-border-color-dark: #58585B;--el-border-color: #4C4D4F;--el-border-color-light: #414243;--el-border-color-lighter: #363637;--el-border-color-extra-light: #2B2B2C;--el-fill-color-darker: #424243;--el-fill-color-dark: #39393A;--el-fill-color: #303030;--el-fill-color-light: #262727;--el-fill-color-lighter: #1D1D1D;--el-fill-color-extra-light: #191919;--el-fill-color-blank: #141414;--el-mask-color: rgba(0, 0, 0, .8);--el-mask-color-extra-light: rgba(0, 0, 0, .3)}html.dark .el-button{--el-button-disabled-text-color: rgba(255, 255, 255, .5)}html.dark .el-card{--el-card-bg-color: var(--el-bg-color-overlay)}html.dark .el-empty{--el-empty-fill-color-0: var(--el-color-black);--el-empty-fill-color-1: #4b4b52;--el-empty-fill-color-2: #36383d;--el-empty-fill-color-3: #1e1e20;--el-empty-fill-color-4: #262629;--el-empty-fill-color-5: #202124;--el-empty-fill-color-6: #212224;--el-empty-fill-color-7: #1b1c1f;--el-empty-fill-color-8: #1c1d1f;--el-empty-fill-color-9: #18181a}:root{--ml-status-bar-height: 30px}body{font-family:Inter,system-ui,Avenir,Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,微软雅黑,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0}a{color:var(--el-color-primary)}code{border-radius:2px;padding:2px 4px;background-color:var(--el-color-primary-light-9);color:var(--elcolor-primary)}.ml-base-dialog[data-v-a16d1a97]{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2100;display:flex;align-items:center;justify-content:center}.ml-base-dialog-overlay[data-v-a16d1a97]{position:absolute;top:0;right:0;bottom:0;left:0;background-color:#0006}.ml-base-dialog-container[data-v-a16d1a97]{position:relative;z-index:1;--ml-dialog-font-size: 12px;--el-font-size-base: 12px;background:var(--el-bg-color);border:1px solid var(--el-border-color);border-radius:8px;box-shadow:0 4px 12px #00000026;display:flex;flex-direction:column;max-height:90vh;overflow:hidden}.ml-base-dialog-header[data-v-a16d1a97]{display:flex;align-items:center;justify-content:space-between;padding:2px 6px;height:24px;border-bottom:1px solid var(--el-border-color);background:var(--el-fill-color-light);position:relative}.ml-base-dialog-title[data-v-a16d1a97]{display:flex;align-items:center;gap:8px;font-weight:600;font-size:var(--ml-dialog-font-size);color:var(--el-text-color-primary)}.ml-base-dialog-icon-wrapper[data-v-a16d1a97]{display:flex;align-items:center;justify-content:center;width:16px;height:16px}.ml-base-dialog-icon[data-v-a16d1a97]{width:20px;height:20px;color:var(--el-color-primary)}.ml-base-dialog-actions[data-v-a16d1a97]{display:flex;align-items:center}.ml-base-dialog-close[data-v-a16d1a97]{position:absolute;top:50%;right:8px;transform:translateY(-50%);width:28px;height:28px;display:flex;align-items:center;justify-content:center}.ml-base-dialog-body[data-v-a16d1a97]{padding:16px;overflow-y:auto;flex:1;font-size:var(--ml-dialog-font-size)}.ml-base-dialog-footer[data-v-a16d1a97]{display:flex;justify-content:flex-end;gap:8px;border-top:1px solid var(--el-border-color);background:var(--el-bg-color);padding:4px 8px}.ml-base-dialog-footer[data-v-a16d1a97] .el-button{min-width:72px}.ml-base-draw-style-toolbar[data-v-dee39ae6]{display:inline-flex}.ml-base-draw-style-color-indicator[data-v-dee39ae6]{width:14px;height:14px;border-radius:50%;border:1px solid #666;display:inline-block}.ml-base-input-number[data-v-5628dd65]{display:flex;align-items:center;gap:.5rem}.ml-base-input-number__input[data-v-5628dd65]{flex:1}.ml-base-input-number__select[data-v-5628dd65]{width:80px}.ml-color-picker-dlg-panel-body[data-v-7a7eb144]{display:flex;flex-direction:column;margin-top:12px}.ml-color-dropdown-color-item[data-v-993864b4]{display:flex;align-items:center;gap:6px}.ml-color-dropdown-color-preview[data-v-993864b4]{width:14px;height:14px;border:1px solid #aaa}.ml-color-dropdown-custom-icon[data-v-993864b4]{font-size:16px}.ml-color-dropdown-color-name[data-v-993864b4]{font-size:13px}.ml-aci-picker[data-v-2e0d03e3]{font-size:12px;font-family:Arial}.ml-aci-palette[data-v-2e0d03e3]{margin-bottom:6px}.ml-aci-palette-large[data-v-2e0d03e3]{display:grid;grid-template-columns:repeat(24,1fr);gap:1px}.ml-aci-palette-gray[data-v-2e0d03e3]{display:flex;align-items:center;justify-content:flex-start;gap:4px}.ml-aci-palette-small[data-v-2e0d03e3]{display:grid;grid-template-columns:repeat(9,1fr);gap:1px}.ml-aci-small-row[data-v-2e0d03e3]{display:flex;align-items:center;justify-content:space-between;gap:8px}.ml-aci-small-actions[data-v-2e0d03e3]{display:flex;flex-direction:row;gap:4px;margin-left:auto}.ml-aci-small-actions button[data-v-2e0d03e3]{font-size:11px;padding:2px 6px}.ml-aci-color-cell[data-v-2e0d03e3]{width:10px;height:10px;border:1px solid #999;cursor:pointer}.ml-aci-color-cell[data-v-2e0d03e3]:hover{outline:1px solid #00a8ff}.ml-aci-info-row[data-v-2e0d03e3]{display:flex;align-items:center;justify-content:space-between;margin:4px 0}.ml-aci-info-left[data-v-2e0d03e3]{text-align:left}.ml-aci-info-right[data-v-2e0d03e3]{text-align:right}.ml-aci-bottom-row[data-v-2e0d03e3]{display:flex;align-items:stretch;justify-content:flex-start;gap:8px;margin-top:4px}.ml-aci-bottom-left[data-v-2e0d03e3]{flex:1;display:flex;flex-direction:column;gap:2px}.ml-aci-input-row[data-v-2e0d03e3]{margin-top:4px;display:flex;align-items:center;gap:6px}.ml-aci-preview-box[data-v-2e0d03e3]{width:32px;min-width:32px;margin-left:auto;align-self:stretch;border:1px solid #666}.ml-lineweight-btn[data-v-5637ac7c]{display:flex;align-items:center;gap:6px}.ml-lineweight-caret[data-v-5637ac7c]{font-size:12px}.ml-lineweight-menu[data-v-5637ac7c]{padding:4px 0;max-height:260px;overflow-y:auto}.ml-lineweight-item[data-v-5637ac7c]{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:160px}.ml-lineweight-text[data-v-5637ac7c],.ml-lineweight-label[data-v-5637ac7c]{font-size:13px}.ml-lineweight-preview[data-v-5637ac7c]{width:40px;background-color:currentColor;border-radius:2px}.ml-lineweight-preview--btn[data-v-5637ac7c]{width:32px}.ml-toggle-button[data-v-48d6b055]{border:none;padding:0;cursor:pointer;width:var(--a97b120a);height:var(--a97b120a)}[data-v-be6589c2] .el-table__placeholder{width:0px}[data-v-be6589c2] .el-table .cell{display:flex}[data-v-be6589c2] .ml-cell-value>*{width:100%}.ml-entity-properties[data-v-be6589c2]{padding:5px}.ml-entity-properties-table[data-v-be6589c2]{width:100%}.ml-cell-container[data-v-be6589c2]{display:flex;align-items:center;line-height:1}.ml-cell-label[data-v-be6589c2]{font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ml-group-row[data-v-be6589c2]{font-weight:600}.ml-cell-value[data-v-be6589c2]{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ml-readonly-value[data-v-be6589c2]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ml-no-entity-selected[data-v-be6589c2]{display:flex;justify-content:center;align-items:center;text-align:center;font-style:italic;font-size:.875rem;padding:.5rem}.ml-layer-list{width:100%;font-size:small;min-width:100%}.ml-layer-list .el-table__cell{padding-top:2px;padding-bottom:2px}.ml-layer-list .el-table__header .el-table__cell{padding-top:4px;padding-bottom:4px}.ml-layer-list .el-table__header,.ml-layer-list .el-table__body{border-bottom:1px solid var(--el-border-color)}.ml-layer-list-cell{display:flex;align-items:center;justify-content:center}.ml-layer-list-color{width:20px;height:20px}.ml-layer-manager[data-v-18adcdd0]{left:2px;top:55px;width:400px;height:500px}.ml-layer-list-wrapper[data-v-18adcdd0]{overflow:auto;width:100%;display:flex;align-items:flex-start;justify-content:flex-start}.ml-entity-info[data-v-d0b7631d]{position:fixed;left:var(--3e47cda4);top:var(--0741074e);width:180px;margin:0;transition:none!important}.ml-entity-info-title[data-v-d0b7631d]{font-weight:700}.ml-entity-info-text[data-v-d0b7631d]{margin-bottom:6px;margin-top:6px}.ml-language-selector[data-v-22a7d15f]{position:fixed;right:40px;top:20px;z-index:1000}.ml-layer-draw-style-layer-button[data-v-40670552]{min-width:100px;display:flex;align-items:center}.ml-layer-draw-style-layer-name[data-v-40670552]{flex:1;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ml-dropdown-caret[data-v-40670552]{margin-left:8px;font-size:12px;opacity:.7}.ml-layer-draw-style-layer-dropdown[data-v-40670552]{max-height:260px;overflow-y:auto}.ml-layer-draw-style-layer-item-name[data-v-40670552]{vertical-align:middle}.el-dropdown-menu__item.is-active[data-v-40670552]{font-weight:600;background-color:var(--el-fill-color-light)}.ml-main-menu-container[data-v-01dfd285]{position:fixed;left:40px;top:20px;z-index:1000}.ml-main-menu-icon[data-v-01dfd285],.ml-main-menu-icon[data-v-01dfd285]:hover{outline:none;border:none}.ml-vertical-toolbar-container{position:fixed;right:30px;top:50%;transform:translateY(-50%)}.ml-notification-item[data-v-e1dde915]{display:flex;gap:12px;padding:12px 16px;border-bottom:1px solid var(--el-border-color-lighter);transition:background-color .2s ease}.ml-notification-item[data-v-e1dde915]:hover{background-color:var(--el-fill-color-light)}.ml-notification-item[data-v-e1dde915]:last-child{border-bottom:none}.ml-notification-item-icon[data-v-e1dde915]{flex-shrink:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center;margin-top:2px}.ml-notification-item--info .ml-notification-item-icon[data-v-e1dde915]{color:var(--el-color-info)}.ml-notification-item--warning .ml-notification-item-icon[data-v-e1dde915]{color:var(--el-color-warning)}.ml-notification-item--error .ml-notification-item-icon[data-v-e1dde915]{color:var(--el-color-danger)}.ml-notification-item--success .ml-notification-item-icon[data-v-e1dde915]{color:var(--el-color-success)}.ml-notification-item-content[data-v-e1dde915]{flex:1;min-width:0}.ml-notification-item-header[data-v-e1dde915]{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:4px}.ml-notification-item-title[data-v-e1dde915]{margin:0;font-size:14px;font-weight:600;color:var(--el-text-color-primary);line-height:1.4;flex:1}.ml-notification-item-actions[data-v-e1dde915]{display:flex;align-items:center;gap:8px;flex-shrink:0}.ml-notification-item-message[data-v-e1dde915]{margin:0 0 8px;font-size:13px;color:var(--el-text-color-regular);line-height:1.4;word-wrap:break-word}.ml-notification-item-footer[data-v-e1dde915]{display:flex;align-items:center;justify-content:flex-end}.ml-notification-item-time[data-v-e1dde915]{font-size:12px;color:var(--el-text-color-secondary)}.dark .ml-notification-item[data-v-e1dde915]:hover{background-color:var(--el-fill-color-darker)}.ml-notification-center[data-v-bdd67bed]{position:fixed;bottom:calc(var(--ml-status-bar-height) + 20px);right:0;width:400px;max-width:100vw;box-sizing:border-box;max-height:500px;background:var(--el-bg-color);border:1px solid var(--el-border-color);border-radius:8px;box-shadow:0 4px 12px #00000026;z-index:2000;display:flex;flex-direction:column;overflow:hidden}.ml-notification-center-header[data-v-bdd67bed]{display:flex;align-items:center;justify-content:space-between;padding:5px;height:30px;border-bottom:1px solid var(--el-border-color);background:var(--el-fill-color-light);position:relative}.ml-notification-center-title[data-v-bdd67bed]{display:flex;align-items:center;gap:8px;font-weight:600;font-size:14px;color:var(--el-text-color-primary)}.ml-notification-center-icon[data-v-bdd67bed]{color:var(--el-color-primary)}.ml-notification-center-actions[data-v-bdd67bed]{display:flex;align-items:center;gap:8px;margin-right:36px}.ml-notification-center-close[data-v-bdd67bed]{position:absolute;top:50%;right:8px;transform:translateY(-50%);padding:4px;min-width:auto;width:28px;height:28px;display:flex;align-items:center;justify-content:center}.ml-notification-center-clear[data-v-bdd67bed]{width:28px;height:28px;padding:0;display:flex;align-items:center;justify-content:center}.ml-notification-center-clear[data-v-bdd67bed] .el-icon{font-size:16px}.ml-notification-center-content[data-v-bdd67bed]{flex:1;overflow-y:auto;max-height:400px}.ml-notification-center-empty[data-v-bdd67bed]{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center;color:var(--el-text-color-secondary)}.ml-notification-center-empty-icon[data-v-bdd67bed]{font-size:48px;margin-bottom:16px;opacity:.5}.ml-notification-center-empty p[data-v-bdd67bed]{margin:0;font-size:14px}.ml-notification-list[data-v-bdd67bed]{padding:8px 0}.dark .ml-notification-center[data-v-bdd67bed]{background:var(--el-bg-color-page);border-color:var(--el-border-color)}.dark .ml-notification-center-header[data-v-bdd67bed]{background:var(--el-fill-color-darker)}.ml-notification-button[data-v-48c740b7]{border:none;padding:0;cursor:pointer;width:30px;position:relative}.ml-notification-badge[data-v-48c740b7]{position:absolute;top:-2px;right:-2px}.ml-notification-badge[data-v-48c740b7] .el-badge__content{font-size:10px;min-width:16px;height:16px;line-height:16px;padding:0 4px}.ml-osnap-setting-button[data-v-6ab77080],.ml-point-style-button[data-v-29692d7d]{border:none;padding:0;cursor:pointer;width:30px}.ml-progress[data-v-7513492f]{width:100px}.ml-setting-button[data-v-4e9dc111],.ml-warning-button[data-v-3411a3ec]{border:none;padding:0;cursor:pointer;width:30px}.ml-status-bar[data-v-2dc891d2]{box-sizing:border-box}.ml-status-bar-left-button-group[data-v-2dc891d2]{border:none;box-sizing:border-box;height:var(--ml-status-bar-height)}.ml-status-bar-layout-button[data-v-2dc891d2]{box-sizing:border-box}.ml-status-bar-right-button-group[data-v-2dc891d2]{border:none;padding:0;height:var(--ml-status-bar-height)}.ml-status-bar-current-pos[data-v-2dc891d2]{border:none;height:100%}.ml-cad-container{position:absolute;top:0;left:0;height:calc(100vh - var(--ml-status-bar-height));width:100%;display:block;outline:none;z-index:1;pointer-events:auto}.ml-cad-viewer-container{position:relative;width:100vw;z-index:2;pointer-events:auto}.ml-file-name{position:absolute;top:0;left:50%;color:var(--el-text-color-regular);transform:translate(-50%);text-align:center;width:100%;margin-top:20px;pointer-events:none;z-index:1}.ml-rev-tool-bar{position:absolute;top:0;left:50%;transform:translate(-50%);margin-top:20px;z-index:2}
|
|
1
|
+
@charset "UTF-8";body{margin:0;display:flex}body,html{height:100%}html.dark{color-scheme:dark;--el-color-primary: #409eff;--el-color-primary-light-3: rgb(51, 117, 185);--el-color-primary-light-5: rgb(42, 89, 138);--el-color-primary-light-7: rgb(33, 61, 91);--el-color-primary-light-8: rgb(29, 48, 67);--el-color-primary-light-9: rgb(24, 34, 43);--el-color-primary-dark-2: rgb(102, 177, 255);--el-color-success: #67c23a;--el-color-success-light-3: rgb(78, 142, 47);--el-color-success-light-5: rgb(62, 107, 39);--el-color-success-light-7: rgb(45, 72, 31);--el-color-success-light-8: rgb(37, 55, 28);--el-color-success-light-9: rgb(28, 37, 24);--el-color-success-dark-2: rgb(133, 206, 97);--el-color-warning: #e6a23c;--el-color-warning-light-3: rgb(167, 119, 48);--el-color-warning-light-5: rgb(125, 91, 40);--el-color-warning-light-7: rgb(83, 63, 32);--el-color-warning-light-8: rgb(62, 48, 28);--el-color-warning-light-9: rgb(41, 34, 24);--el-color-warning-dark-2: rgb(235, 181, 99);--el-color-danger: #f56c6c;--el-color-danger-light-3: rgb(178, 82, 82);--el-color-danger-light-5: rgb(133, 64, 64);--el-color-danger-light-7: rgb(88, 46, 46);--el-color-danger-light-8: rgb(65, 38, 38);--el-color-danger-light-9: rgb(42, 29, 29);--el-color-danger-dark-2: rgb(247, 137, 137);--el-color-error: #f56c6c;--el-color-error-light-3: rgb(178, 82, 82);--el-color-error-light-5: rgb(133, 64, 64);--el-color-error-light-7: rgb(88, 46, 46);--el-color-error-light-8: rgb(65, 38, 38);--el-color-error-light-9: rgb(42, 29, 29);--el-color-error-dark-2: rgb(247, 137, 137);--el-color-info: #909399;--el-color-info-light-3: rgb(107, 109, 113);--el-color-info-light-5: rgb(82, 84, 87);--el-color-info-light-7: rgb(57, 58, 60);--el-color-info-light-8: rgb(45, 45, 47);--el-color-info-light-9: rgb(32, 33, 33);--el-color-info-dark-2: rgb(166, 169, 173);--el-box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, .36), 0px 8px 20px rgba(0, 0, 0, .72);--el-box-shadow-light: 0px 0px 12px rgba(0, 0, 0, .72);--el-box-shadow-lighter: 0px 0px 6px rgba(0, 0, 0, .72);--el-box-shadow-dark: 0px 16px 48px 16px rgba(0, 0, 0, .72), 0px 12px 32px #000000, 0px 8px 16px -8px #000000;--el-bg-color-page: #0a0a0a;--el-bg-color: #141414;--el-bg-color-overlay: #1d1e1f;--el-text-color-primary: #E5EAF3;--el-text-color-regular: #CFD3DC;--el-text-color-secondary: #A3A6AD;--el-text-color-placeholder: #8D9095;--el-text-color-disabled: #6C6E72;--el-border-color-darker: #636466;--el-border-color-dark: #58585B;--el-border-color: #4C4D4F;--el-border-color-light: #414243;--el-border-color-lighter: #363637;--el-border-color-extra-light: #2B2B2C;--el-fill-color-darker: #424243;--el-fill-color-dark: #39393A;--el-fill-color: #303030;--el-fill-color-light: #262727;--el-fill-color-lighter: #1D1D1D;--el-fill-color-extra-light: #191919;--el-fill-color-blank: #141414;--el-mask-color: rgba(0, 0, 0, .8);--el-mask-color-extra-light: rgba(0, 0, 0, .3)}html.dark .el-button{--el-button-disabled-text-color: rgba(255, 255, 255, .5)}html.dark .el-card{--el-card-bg-color: var(--el-bg-color-overlay)}html.dark .el-empty{--el-empty-fill-color-0: var(--el-color-black);--el-empty-fill-color-1: #4b4b52;--el-empty-fill-color-2: #36383d;--el-empty-fill-color-3: #1e1e20;--el-empty-fill-color-4: #262629;--el-empty-fill-color-5: #202124;--el-empty-fill-color-6: #212224;--el-empty-fill-color-7: #1b1c1f;--el-empty-fill-color-8: #1c1d1f;--el-empty-fill-color-9: #18181a}:root{--ml-status-bar-height: 30px}body{font-family:Inter,system-ui,Avenir,Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,微软雅黑,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0}a{color:var(--el-color-primary)}code{border-radius:2px;padding:2px 4px;background-color:var(--el-color-primary-light-9);color:var(--elcolor-primary)}.ml-base-dialog[data-v-23bef8c6]{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2100;display:flex;align-items:center;justify-content:center}.ml-base-dialog-overlay[data-v-23bef8c6]{position:absolute;top:0;right:0;bottom:0;left:0;background-color:#0006}.ml-base-dialog-container[data-v-23bef8c6]{position:relative;z-index:1;--ml-dialog-font-size: 12px;--el-font-size-base: 12px;background:var(--el-bg-color);border:1px solid var(--el-border-color);border-radius:8px;box-shadow:0 4px 12px #00000026;display:flex;flex-direction:column;max-height:90vh;overflow:hidden}.ml-base-dialog-header[data-v-23bef8c6]{display:flex;align-items:center;justify-content:space-between;padding:2px 6px;height:24px;border-bottom:1px solid var(--el-border-color);background:var(--el-fill-color-light);position:relative}.ml-base-dialog-title[data-v-23bef8c6]{display:flex;align-items:center;gap:8px;font-weight:600;font-size:var(--ml-dialog-font-size);color:var(--el-text-color-primary)}.ml-base-dialog-icon-wrapper[data-v-23bef8c6]{display:flex;align-items:center;justify-content:center;width:16px;height:16px}.ml-base-dialog-icon[data-v-23bef8c6]{width:20px;height:20px;color:var(--el-color-primary)}.ml-base-dialog-actions[data-v-23bef8c6]{display:flex;align-items:center}.ml-base-dialog-close[data-v-23bef8c6]{position:absolute;top:50%;right:8px;transform:translateY(-50%);width:28px;height:28px;display:flex;align-items:center;justify-content:center}.ml-base-dialog-body[data-v-23bef8c6]{padding:16px;overflow-y:auto;flex:1;font-size:var(--ml-dialog-font-size)}.ml-base-dialog-footer[data-v-23bef8c6]{display:flex;justify-content:flex-end;gap:8px;border-top:1px solid var(--el-border-color);background:var(--el-bg-color);padding:4px 8px}.ml-base-dialog-footer[data-v-23bef8c6] .el-button{min-width:72px}.ml-base-draw-style-toolbar[data-v-9fba3d6f]{display:inline-flex}.ml-base-draw-style-color-indicator[data-v-9fba3d6f]{width:14px;height:14px;border-radius:50%;border:1px solid #666;display:inline-block}.ml-base-input-number[data-v-a79684a5]{display:flex;align-items:center;gap:.5rem}.ml-base-input-number__input[data-v-a79684a5]{flex:1}.ml-base-input-number__select[data-v-a79684a5]{width:80px}.ml-color-picker-dlg-panel-body[data-v-2f90d4a7]{display:flex;flex-direction:column;margin-top:12px}.ml-color-dropdown-color-item[data-v-694c38cc]{display:flex;align-items:center;gap:6px}.ml-color-dropdown-color-preview[data-v-694c38cc]{width:14px;height:14px;border:1px solid #aaa}.ml-color-dropdown-custom-icon[data-v-694c38cc]{font-size:16px}.ml-color-dropdown-color-name[data-v-694c38cc]{font-size:13px}.ml-aci-picker[data-v-1cb688ad]{font-size:12px;font-family:Arial}.ml-aci-palette[data-v-1cb688ad]{margin-bottom:6px}.ml-aci-palette-large[data-v-1cb688ad]{display:grid;grid-template-columns:repeat(24,1fr);gap:1px}.ml-aci-palette-gray[data-v-1cb688ad]{display:flex;align-items:center;justify-content:flex-start;gap:4px}.ml-aci-palette-small[data-v-1cb688ad]{display:grid;grid-template-columns:repeat(9,1fr);gap:1px}.ml-aci-small-row[data-v-1cb688ad]{display:flex;align-items:center;justify-content:space-between;gap:8px}.ml-aci-small-actions[data-v-1cb688ad]{display:flex;flex-direction:row;gap:4px;margin-left:auto}.ml-aci-small-actions button[data-v-1cb688ad]{font-size:11px;padding:2px 6px}.ml-aci-color-cell[data-v-1cb688ad]{width:10px;height:10px;border:1px solid #999;cursor:pointer}.ml-aci-color-cell[data-v-1cb688ad]:hover{outline:1px solid #00a8ff}.ml-aci-info-row[data-v-1cb688ad]{display:flex;align-items:center;justify-content:space-between;margin:4px 0}.ml-aci-info-left[data-v-1cb688ad]{text-align:left}.ml-aci-info-right[data-v-1cb688ad]{text-align:right}.ml-aci-bottom-row[data-v-1cb688ad]{display:flex;align-items:stretch;justify-content:flex-start;gap:8px;margin-top:4px}.ml-aci-bottom-left[data-v-1cb688ad]{flex:1;display:flex;flex-direction:column;gap:2px}.ml-aci-input-row[data-v-1cb688ad]{margin-top:4px;display:flex;align-items:center;gap:6px}.ml-aci-preview-box[data-v-1cb688ad]{width:32px;min-width:32px;margin-left:auto;align-self:stretch;border:1px solid #666}.ml-lineweight-btn[data-v-43c8202f]{display:flex;align-items:center;gap:6px}.ml-lineweight-caret[data-v-43c8202f]{font-size:12px}.ml-lineweight-menu[data-v-43c8202f]{padding:4px 0;max-height:260px;overflow-y:auto}.ml-lineweight-item[data-v-43c8202f]{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:160px}.ml-lineweight-text[data-v-43c8202f],.ml-lineweight-label[data-v-43c8202f]{font-size:13px}.ml-lineweight-preview[data-v-43c8202f]{width:40px;background-color:currentColor;border-radius:2px}.ml-lineweight-preview--btn[data-v-43c8202f]{width:32px}.ml-toggle-button[data-v-5879105c]{border:none;padding:0;cursor:pointer;width:var(--c171ad2e);height:var(--c171ad2e)}[data-v-568da396] .el-table__placeholder{width:0px}[data-v-568da396] .el-table .cell{display:flex}[data-v-568da396] .ml-cell-value>*{width:100%}.ml-entity-properties[data-v-568da396]{padding:5px}.ml-entity-properties-table[data-v-568da396]{width:100%}.ml-cell-container[data-v-568da396]{display:flex;align-items:center;line-height:1}.ml-cell-label[data-v-568da396]{font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ml-group-row[data-v-568da396]{font-weight:600}.ml-cell-value[data-v-568da396]{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ml-readonly-value[data-v-568da396]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ml-no-entity-selected[data-v-568da396]{display:flex;justify-content:center;align-items:center;text-align:center;font-style:italic;font-size:.875rem;padding:.5rem}.ml-layer-list{width:100%;font-size:small;min-width:100%}.ml-layer-list .el-table__cell{padding-top:2px;padding-bottom:2px}.ml-layer-list .el-table__header .el-table__cell{padding-top:4px;padding-bottom:4px}.ml-layer-list .el-table__header,.ml-layer-list .el-table__body{border-bottom:1px solid var(--el-border-color)}.ml-layer-list-cell{display:flex;align-items:center;justify-content:center}.ml-layer-list-color{width:20px;height:20px}.ml-layer-manager[data-v-c34cbb81]{left:2px;top:55px;width:400px;height:500px}.ml-layer-list-wrapper[data-v-c34cbb81]{overflow:auto;width:100%;display:flex;align-items:flex-start;justify-content:flex-start}.ml-entity-info[data-v-6c80b27c]{position:fixed;left:var(--92de4484);top:var(--46cd1e84);width:180px;margin:0;transition:none!important}.ml-entity-info-title[data-v-6c80b27c]{font-weight:700}.ml-entity-info-text[data-v-6c80b27c]{margin-bottom:6px;margin-top:6px}.ml-language-selector[data-v-5219aeaa]{position:fixed;right:40px;top:20px;z-index:1000}.ml-layer-draw-style-layer-button[data-v-3391211d]{min-width:100px;display:flex;align-items:center}.ml-layer-draw-style-layer-name[data-v-3391211d]{flex:1;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ml-dropdown-caret[data-v-3391211d]{margin-left:8px;font-size:12px;opacity:.7}.ml-layer-draw-style-layer-dropdown[data-v-3391211d]{max-height:260px;overflow-y:auto}.ml-layer-draw-style-layer-item-name[data-v-3391211d]{vertical-align:middle}.el-dropdown-menu__item.is-active[data-v-3391211d]{font-weight:600;background-color:var(--el-fill-color-light)}.ml-main-menu-container[data-v-8b2d5d95]{position:fixed;left:40px;top:20px;z-index:1000}.ml-main-menu-icon[data-v-8b2d5d95],.ml-main-menu-icon[data-v-8b2d5d95]:hover{outline:none;border:none}.ml-vertical-toolbar-container{position:fixed;right:30px;top:50%;transform:translateY(-50%)}.ml-notification-item[data-v-8ce88f8a]{display:flex;gap:12px;padding:12px 16px;border-bottom:1px solid var(--el-border-color-lighter);transition:background-color .2s ease}.ml-notification-item[data-v-8ce88f8a]:hover{background-color:var(--el-fill-color-light)}.ml-notification-item[data-v-8ce88f8a]:last-child{border-bottom:none}.ml-notification-item-icon[data-v-8ce88f8a]{flex-shrink:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center;margin-top:2px}.ml-notification-item--info .ml-notification-item-icon[data-v-8ce88f8a]{color:var(--el-color-info)}.ml-notification-item--warning .ml-notification-item-icon[data-v-8ce88f8a]{color:var(--el-color-warning)}.ml-notification-item--error .ml-notification-item-icon[data-v-8ce88f8a]{color:var(--el-color-danger)}.ml-notification-item--success .ml-notification-item-icon[data-v-8ce88f8a]{color:var(--el-color-success)}.ml-notification-item-content[data-v-8ce88f8a]{flex:1;min-width:0}.ml-notification-item-header[data-v-8ce88f8a]{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:4px}.ml-notification-item-title[data-v-8ce88f8a]{margin:0;font-size:14px;font-weight:600;color:var(--el-text-color-primary);line-height:1.4;flex:1}.ml-notification-item-actions[data-v-8ce88f8a]{display:flex;align-items:center;gap:8px;flex-shrink:0}.ml-notification-item-message[data-v-8ce88f8a]{margin:0 0 8px;font-size:13px;color:var(--el-text-color-regular);line-height:1.4;word-wrap:break-word}.ml-notification-item-footer[data-v-8ce88f8a]{display:flex;align-items:center;justify-content:flex-end}.ml-notification-item-time[data-v-8ce88f8a]{font-size:12px;color:var(--el-text-color-secondary)}.dark .ml-notification-item[data-v-8ce88f8a]:hover{background-color:var(--el-fill-color-darker)}.ml-notification-center[data-v-cd4c651f]{position:fixed;bottom:calc(var(--ml-status-bar-height) + 20px);right:0;width:400px;max-width:100vw;box-sizing:border-box;max-height:500px;background:var(--el-bg-color);border:1px solid var(--el-border-color);border-radius:8px;box-shadow:0 4px 12px #00000026;z-index:2000;display:flex;flex-direction:column;overflow:hidden}.ml-notification-center-header[data-v-cd4c651f]{display:flex;align-items:center;justify-content:space-between;padding:5px;height:30px;border-bottom:1px solid var(--el-border-color);background:var(--el-fill-color-light);position:relative}.ml-notification-center-title[data-v-cd4c651f]{display:flex;align-items:center;gap:8px;font-weight:600;font-size:14px;color:var(--el-text-color-primary)}.ml-notification-center-icon[data-v-cd4c651f]{color:var(--el-color-primary)}.ml-notification-center-actions[data-v-cd4c651f]{display:flex;align-items:center;gap:8px;margin-right:36px}.ml-notification-center-close[data-v-cd4c651f]{position:absolute;top:50%;right:8px;transform:translateY(-50%);padding:4px;min-width:auto;width:28px;height:28px;display:flex;align-items:center;justify-content:center}.ml-notification-center-clear[data-v-cd4c651f]{width:28px;height:28px;padding:0;display:flex;align-items:center;justify-content:center}.ml-notification-center-clear[data-v-cd4c651f] .el-icon{font-size:16px}.ml-notification-center-content[data-v-cd4c651f]{flex:1;overflow-y:auto;max-height:400px}.ml-notification-center-empty[data-v-cd4c651f]{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center;color:var(--el-text-color-secondary)}.ml-notification-center-empty-icon[data-v-cd4c651f]{font-size:48px;margin-bottom:16px;opacity:.5}.ml-notification-center-empty p[data-v-cd4c651f]{margin:0;font-size:14px}.ml-notification-list[data-v-cd4c651f]{padding:8px 0}.dark .ml-notification-center[data-v-cd4c651f]{background:var(--el-bg-color-page);border-color:var(--el-border-color)}.dark .ml-notification-center-header[data-v-cd4c651f]{background:var(--el-fill-color-darker)}.ml-notification-button[data-v-46fa6383]{border:none;padding:0;cursor:pointer;width:30px;position:relative}.ml-notification-badge[data-v-46fa6383]{position:absolute;top:-2px;right:-2px}.ml-notification-badge[data-v-46fa6383] .el-badge__content{font-size:10px;min-width:16px;height:16px;line-height:16px;padding:0 4px}.ml-osnap-setting-button[data-v-372c3649],.ml-point-style-button[data-v-fa98355b]{border:none;padding:0;cursor:pointer;width:30px}.ml-progress[data-v-6b45cf71]{width:100px}.ml-setting-button[data-v-1e137e77],.ml-warning-button[data-v-53fa8f43]{border:none;padding:0;cursor:pointer;width:30px}.ml-status-bar[data-v-b5230a4b]{box-sizing:border-box}.ml-status-bar-left-button-group[data-v-b5230a4b]{border:none;box-sizing:border-box;height:var(--ml-status-bar-height)}.ml-status-bar-layout-button[data-v-b5230a4b]{box-sizing:border-box}.ml-status-bar-right-button-group[data-v-b5230a4b]{border:none;padding:0;height:var(--ml-status-bar-height)}.ml-status-bar-current-pos[data-v-b5230a4b]{border:none;height:100%}.ml-cad-container{position:absolute;top:0;left:0;height:calc(100vh - var(--ml-status-bar-height));width:100%;display:block;outline:none;z-index:1;pointer-events:auto}.ml-cad-viewer-container{position:relative;width:100vw;z-index:2;pointer-events:auto}.ml-file-name{position:absolute;top:0;left:50%;color:var(--el-text-color-regular);transform:translate(-50%);text-align:center;width:100%;margin-top:20px;pointer-events:none;z-index:1}.ml-rev-tool-bar{position:absolute;top:0;left:50%;transform:translate(-50%);margin-top:20px;z-index:2}
|
package/dist/index.js
CHANGED
|
@@ -845,7 +845,7 @@ const fl = { render: gl }, hl = {
|
|
|
845
845
|
for (const [l, o] of e)
|
|
846
846
|
t[l] = o;
|
|
847
847
|
return t;
|
|
848
|
-
}, De = /* @__PURE__ */ q(Cl, [["__scopeId", "data-v-
|
|
848
|
+
}, De = /* @__PURE__ */ q(Cl, [["__scopeId", "data-v-23bef8c6"]]), Ml = /* @__PURE__ */ I({
|
|
849
849
|
__name: "MlBaseDrawStyleToolbar",
|
|
850
850
|
props: {
|
|
851
851
|
colorIndex: {},
|
|
@@ -908,7 +908,7 @@ const fl = { render: gl }, hl = {
|
|
|
908
908
|
});
|
|
909
909
|
};
|
|
910
910
|
}
|
|
911
|
-
}), ot = /* @__PURE__ */ q(Ml, [["__scopeId", "data-v-
|
|
911
|
+
}), ot = /* @__PURE__ */ q(Ml, [["__scopeId", "data-v-9fba3d6f"]]), Ll = { class: "ml-base-input-number" }, Sl = /* @__PURE__ */ I({
|
|
912
912
|
__name: "MlBaseInputNumber",
|
|
913
913
|
props: {
|
|
914
914
|
modelValue: {},
|
|
@@ -979,7 +979,7 @@ const fl = { render: gl }, hl = {
|
|
|
979
979
|
}, 8, ["modelValue"])
|
|
980
980
|
]));
|
|
981
981
|
}
|
|
982
|
-
}), us = /* @__PURE__ */ q(Sl, [["__scopeId", "data-v-
|
|
982
|
+
}), us = /* @__PURE__ */ q(Sl, [["__scopeId", "data-v-a79684a5"]]), Tl = {
|
|
983
983
|
ACAD: {
|
|
984
984
|
la: {
|
|
985
985
|
description: "Layer properties manager"
|
|
@@ -2081,7 +2081,7 @@ const ce = zt({
|
|
|
2081
2081
|
}, 8, ["modelValue", "title"]);
|
|
2082
2082
|
};
|
|
2083
2083
|
}
|
|
2084
|
-
}), it = /* @__PURE__ */ q(Hl, [["__scopeId", "data-v-
|
|
2084
|
+
}), it = /* @__PURE__ */ q(Hl, [["__scopeId", "data-v-2f90d4a7"]]);
|
|
2085
2085
|
function ds() {
|
|
2086
2086
|
const n = te([]), e = F.instance.commandManager.iterator();
|
|
2087
2087
|
for (const t of e)
|
|
@@ -2910,7 +2910,7 @@ const na = /* @__PURE__ */ I({
|
|
|
2910
2910
|
]);
|
|
2911
2911
|
};
|
|
2912
2912
|
}
|
|
2913
|
-
}), Re = /* @__PURE__ */ q(ua, [["__scopeId", "data-v-
|
|
2913
|
+
}), Re = /* @__PURE__ */ q(ua, [["__scopeId", "data-v-694c38cc"]]), da = { class: "ml-aci-picker" }, ma = { class: "ml-aci-palette ml-aci-palette-large" }, pa = ["onMouseenter", "onClick"], va = { class: "ml-aci-small-row" }, ga = { class: "ml-aci-palette ml-aci-palette-small" }, fa = ["onMouseenter", "onClick"], ha = { class: "ml-aci-small-actions" }, _a = { class: "ml-aci-palette ml-aci-palette-gray" }, wa = ["onMouseenter", "onClick"], ya = { class: "ml-aci-bottom-row" }, ba = { class: "ml-aci-bottom-left" }, xa = { class: "ml-aci-info-row" }, ka = { class: "ml-aci-info-left" }, Ca = { class: "ml-aci-info-right" }, Ma = { class: "ml-aci-input-row" }, La = ["placeholder"], Sa = /* @__PURE__ */ I({
|
|
2914
2914
|
__name: "MlColorIndexPicker",
|
|
2915
2915
|
props: {
|
|
2916
2916
|
modelValue: { type: Number, default: 256 }
|
|
@@ -3031,7 +3031,7 @@ const na = /* @__PURE__ */ I({
|
|
|
3031
3031
|
])
|
|
3032
3032
|
]));
|
|
3033
3033
|
}
|
|
3034
|
-
}), dt = /* @__PURE__ */ q(Sa, [["__scopeId", "data-v-
|
|
3034
|
+
}), dt = /* @__PURE__ */ q(Sa, [["__scopeId", "data-v-1cb688ad"]]), Ta = /* @__PURE__ */ I({
|
|
3035
3035
|
__name: "MlDialogManager",
|
|
3036
3036
|
setup(n, { expose: e }) {
|
|
3037
3037
|
const { dialogs: t, toggleDialog: l, registerDialog: o } = xe();
|
|
@@ -3143,7 +3143,7 @@ const na = /* @__PURE__ */ I({
|
|
|
3143
3143
|
});
|
|
3144
3144
|
};
|
|
3145
3145
|
}
|
|
3146
|
-
}), za = /* @__PURE__ */ q($a, [["__scopeId", "data-v-
|
|
3146
|
+
}), za = /* @__PURE__ */ q($a, [["__scopeId", "data-v-43c8202f"]]), Va = ["accept"], Ia = /* @__PURE__ */ I({
|
|
3147
3147
|
__name: "MlFileReader",
|
|
3148
3148
|
emits: ["file-read"],
|
|
3149
3149
|
setup(n, { emit: e }) {
|
|
@@ -3195,7 +3195,7 @@ const na = /* @__PURE__ */ I({
|
|
|
3195
3195
|
emits: /* @__PURE__ */ ve(["click"], ["update:modelValue"]),
|
|
3196
3196
|
setup(n, { emit: e }) {
|
|
3197
3197
|
Ze((w) => ({
|
|
3198
|
-
|
|
3198
|
+
c171ad2e: r.value
|
|
3199
3199
|
}));
|
|
3200
3200
|
const t = n, l = ye(n, "modelValue"), o = e, a = z(() => l.value ? t.data.onIcon : t.data.offIcon), r = z(() => t.size + "px"), u = z(() => l.value ? t.data.onTooltip : t.data.offTooltip), i = () => {
|
|
3201
3201
|
o("click", l.value);
|
|
@@ -3217,7 +3217,7 @@ const na = /* @__PURE__ */ I({
|
|
|
3217
3217
|
}, 8, ["content"]);
|
|
3218
3218
|
};
|
|
3219
3219
|
}
|
|
3220
|
-
}), mt = /* @__PURE__ */ q(Aa, [["__scopeId", "data-v-
|
|
3220
|
+
}), mt = /* @__PURE__ */ q(Aa, [["__scopeId", "data-v-5879105c"]]);
|
|
3221
3221
|
(function() {
|
|
3222
3222
|
try {
|
|
3223
3223
|
if (typeof document < "u") {
|
|
@@ -4264,7 +4264,7 @@ const hi = (n) => (Xe("data-v-cd1a3c67"), n = n(), je(), n), _i = /* @__PURE__ *
|
|
|
4264
4264
|
]);
|
|
4265
4265
|
};
|
|
4266
4266
|
}
|
|
4267
|
-
}), Vi = /* @__PURE__ */ q(zi, [["__scopeId", "data-v-
|
|
4267
|
+
}), Vi = /* @__PURE__ */ q(zi, [["__scopeId", "data-v-568da396"]]), Ii = { class: "ml-layer-list-cell" }, Ai = { class: "ml-layer-list-cell" }, Ei = /* @__PURE__ */ I({
|
|
4268
4268
|
__name: "MlLayerList",
|
|
4269
4269
|
props: {
|
|
4270
4270
|
editor: {}
|
|
@@ -4406,7 +4406,7 @@ const hi = (n) => (Xe("data-v-cd1a3c67"), n = n(), je(), n), _i = /* @__PURE__ *
|
|
|
4406
4406
|
});
|
|
4407
4407
|
};
|
|
4408
4408
|
}
|
|
4409
|
-
}), Fi = /* @__PURE__ */ q(Ni, [["__scopeId", "data-v-
|
|
4409
|
+
}), Fi = /* @__PURE__ */ q(Ni, [["__scopeId", "data-v-c34cbb81"]]), Ri = /* @__PURE__ */ I({
|
|
4410
4410
|
__name: "MlEntityDrawStyleToolbar",
|
|
4411
4411
|
props: {
|
|
4412
4412
|
editor: {}
|
|
@@ -4449,8 +4449,8 @@ const hi = (n) => (Xe("data-v-cd1a3c67"), n = n(), je(), n), _i = /* @__PURE__ *
|
|
|
4449
4449
|
__name: "MlEntityInfo",
|
|
4450
4450
|
setup(n) {
|
|
4451
4451
|
Ze((v) => ({
|
|
4452
|
-
"
|
|
4453
|
-
"
|
|
4452
|
+
"92de4484": i.value,
|
|
4453
|
+
"46cd1e84": w.value
|
|
4454
4454
|
}));
|
|
4455
4455
|
const { t: e } = Z(), t = L(null), { hovered: l, entity: o, mouse: a } = jl(), r = L(180), u = L(120), i = z(
|
|
4456
4456
|
() => `${Math.min(Math.max(a.value.x, we), window.innerWidth - r.value - we)}px`
|
|
@@ -4588,7 +4588,7 @@ const hi = (n) => (Xe("data-v-cd1a3c67"), n = n(), je(), n), _i = /* @__PURE__ *
|
|
|
4588
4588
|
}, 512)) : W("", !0);
|
|
4589
4589
|
};
|
|
4590
4590
|
}
|
|
4591
|
-
}), Hi = /* @__PURE__ */ q(Oi, [["__scopeId", "data-v-
|
|
4591
|
+
}), Hi = /* @__PURE__ */ q(Oi, [["__scopeId", "data-v-6c80b27c"]]), Wi = /* @__PURE__ */ I({
|
|
4592
4592
|
__name: "MlLanguageSelector",
|
|
4593
4593
|
props: {
|
|
4594
4594
|
currentLocale: { default: void 0 }
|
|
@@ -4614,7 +4614,7 @@ const hi = (n) => (Xe("data-v-cd1a3c67"), n = n(), je(), n), _i = /* @__PURE__ *
|
|
|
4614
4614
|
onClick: r
|
|
4615
4615
|
}, null, 8, ["languages", "current"])) : W("", !0);
|
|
4616
4616
|
}
|
|
4617
|
-
}), Yi = /* @__PURE__ */ q(Wi, [["__scopeId", "data-v-
|
|
4617
|
+
}), Yi = /* @__PURE__ */ q(Wi, [["__scopeId", "data-v-5219aeaa"]]), Gi = { class: "ml-layer-draw-style-layer-name" }, qi = { class: "ml-layer-draw-style-layer-item-name" }, Ui = /* @__PURE__ */ I({
|
|
4618
4618
|
__name: "MlLayerDrawStyleToolbar",
|
|
4619
4619
|
props: {
|
|
4620
4620
|
editor: {}
|
|
@@ -4713,7 +4713,7 @@ const hi = (n) => (Xe("data-v-cd1a3c67"), n = n(), je(), n), _i = /* @__PURE__ *
|
|
|
4713
4713
|
}, 8, ["color-index", "css-color", "line-weight", "disabled"]);
|
|
4714
4714
|
};
|
|
4715
4715
|
}
|
|
4716
|
-
}), ps = /* @__PURE__ */ q(Ui, [["__scopeId", "data-v-
|
|
4716
|
+
}), ps = /* @__PURE__ */ q(Ui, [["__scopeId", "data-v-3391211d"]]), Zi = /* @__PURE__ */ I({
|
|
4717
4717
|
__name: "MlMainMenu",
|
|
4718
4718
|
setup(n) {
|
|
4719
4719
|
const { t: e } = Z(), t = ue(), l = (o) => {
|
|
@@ -4761,7 +4761,7 @@ const hi = (n) => (Xe("data-v-cd1a3c67"), n = n(), je(), n), _i = /* @__PURE__ *
|
|
|
4761
4761
|
})) : W("", !0);
|
|
4762
4762
|
};
|
|
4763
4763
|
}
|
|
4764
|
-
}), Xi = /* @__PURE__ */ q(Zi, [["__scopeId", "data-v-
|
|
4764
|
+
}), Xi = /* @__PURE__ */ q(Zi, [["__scopeId", "data-v-8b2d5d95"]]), ji = {
|
|
4765
4765
|
key: 0,
|
|
4766
4766
|
class: "ml-vertical-toolbar-container"
|
|
4767
4767
|
}, Ki = /* @__PURE__ */ I({
|
|
@@ -4954,7 +4954,7 @@ const hi = (n) => (Xe("data-v-cd1a3c67"), n = n(), je(), n), _i = /* @__PURE__ *
|
|
|
4954
4954
|
], 2);
|
|
4955
4955
|
};
|
|
4956
4956
|
}
|
|
4957
|
-
}), rr = /* @__PURE__ */ q(ir, [["__scopeId", "data-v-
|
|
4957
|
+
}), rr = /* @__PURE__ */ q(ir, [["__scopeId", "data-v-8ce88f8a"]]), sr = { class: "ml-notification-center" }, cr = { class: "ml-notification-center-header" }, ur = { class: "ml-notification-center-title" }, dr = { class: "ml-notification-center-actions" }, mr = { class: "ml-notification-center-content" }, pr = {
|
|
4958
4958
|
key: 0,
|
|
4959
4959
|
class: "ml-notification-center-empty"
|
|
4960
4960
|
}, vr = {
|
|
@@ -5051,7 +5051,7 @@ const hi = (n) => (Xe("data-v-cd1a3c67"), n = n(), je(), n), _i = /* @__PURE__ *
|
|
|
5051
5051
|
]);
|
|
5052
5052
|
};
|
|
5053
5053
|
}
|
|
5054
|
-
}), fr = /* @__PURE__ */ q(gr, [["__scopeId", "data-v-
|
|
5054
|
+
}), fr = /* @__PURE__ */ q(gr, [["__scopeId", "data-v-cd4c651f"]]), hr = /* @__PURE__ */ I({
|
|
5055
5055
|
__name: "MlFullScreenButton",
|
|
5056
5056
|
setup(n) {
|
|
5057
5057
|
const { t: e } = Z(), { isFullscreen: t, toggle: l } = Lt(), o = z(() => ({
|
|
@@ -5101,7 +5101,7 @@ const hi = (n) => (Xe("data-v-cd1a3c67"), n = n(), je(), n), _i = /* @__PURE__ *
|
|
|
5101
5101
|
}, 8, ["content"]);
|
|
5102
5102
|
};
|
|
5103
5103
|
}
|
|
5104
|
-
}), wr = /* @__PURE__ */ q(_r, [["__scopeId", "data-v-
|
|
5104
|
+
}), wr = /* @__PURE__ */ q(_r, [["__scopeId", "data-v-46fa6383"]]), yr = /* @__PURE__ */ I({
|
|
5105
5105
|
__name: "MlOsnapButton",
|
|
5106
5106
|
setup(n) {
|
|
5107
5107
|
const { t: e } = Z(), t = ue(), l = [
|
|
@@ -5159,7 +5159,7 @@ const hi = (n) => (Xe("data-v-cd1a3c67"), n = n(), je(), n), _i = /* @__PURE__ *
|
|
|
5159
5159
|
}, 8, ["content"]);
|
|
5160
5160
|
};
|
|
5161
5161
|
}
|
|
5162
|
-
}), br = /* @__PURE__ */ q(yr, [["__scopeId", "data-v-
|
|
5162
|
+
}), br = /* @__PURE__ */ q(yr, [["__scopeId", "data-v-372c3649"]]), xr = /* @__PURE__ */ I({
|
|
5163
5163
|
__name: "MlPointStyleButton",
|
|
5164
5164
|
setup(n) {
|
|
5165
5165
|
const { t: e } = Z(), t = () => {
|
|
@@ -5182,7 +5182,7 @@ const hi = (n) => (Xe("data-v-cd1a3c67"), n = n(), je(), n), _i = /* @__PURE__ *
|
|
|
5182
5182
|
}, 8, ["content"]);
|
|
5183
5183
|
};
|
|
5184
5184
|
}
|
|
5185
|
-
}), kr = /* @__PURE__ */ q(xr, [["__scopeId", "data-v-
|
|
5185
|
+
}), kr = /* @__PURE__ */ q(xr, [["__scopeId", "data-v-fa98355b"]]), Cr = {
|
|
5186
5186
|
key: 0,
|
|
5187
5187
|
class: "ml-progress"
|
|
5188
5188
|
}, Mr = /* @__PURE__ */ I({
|
|
@@ -5213,7 +5213,7 @@ const hi = (n) => (Xe("data-v-cd1a3c67"), n = n(), je(), n), _i = /* @__PURE__ *
|
|
|
5213
5213
|
}, null, 8, ["percentage"])
|
|
5214
5214
|
])) : W("", !0);
|
|
5215
5215
|
}
|
|
5216
|
-
}), Lr = /* @__PURE__ */ q(Mr, [["__scopeId", "data-v-
|
|
5216
|
+
}), Lr = /* @__PURE__ */ q(Mr, [["__scopeId", "data-v-6b45cf71"]]), Sr = /* @__PURE__ */ I({
|
|
5217
5217
|
__name: "MlSettingButton",
|
|
5218
5218
|
setup(n) {
|
|
5219
5219
|
const { t: e } = Z(), t = ue(), l = (o) => {
|
|
@@ -5322,7 +5322,7 @@ const hi = (n) => (Xe("data-v-cd1a3c67"), n = n(), je(), n), _i = /* @__PURE__ *
|
|
|
5322
5322
|
}, 8, ["content"]);
|
|
5323
5323
|
};
|
|
5324
5324
|
}
|
|
5325
|
-
}), Tr = /* @__PURE__ */ q(Sr, [["__scopeId", "data-v-
|
|
5325
|
+
}), Tr = /* @__PURE__ */ q(Sr, [["__scopeId", "data-v-1e137e77"]]), Br = /* @__PURE__ */ I({
|
|
5326
5326
|
__name: "MlThemeButton",
|
|
5327
5327
|
props: {
|
|
5328
5328
|
isDark: { type: Boolean },
|
|
@@ -5358,7 +5358,7 @@ const hi = (n) => (Xe("data-v-cd1a3c67"), n = n(), je(), n), _i = /* @__PURE__ *
|
|
|
5358
5358
|
}, null, 8, ["icon"])) : W("", !0);
|
|
5359
5359
|
};
|
|
5360
5360
|
}
|
|
5361
|
-
}), $r = /* @__PURE__ */ q(Dr, [["__scopeId", "data-v-
|
|
5361
|
+
}), $r = /* @__PURE__ */ q(Dr, [["__scopeId", "data-v-53fa8f43"]]), zr = /* @__PURE__ */ I({
|
|
5362
5362
|
__name: "MlStatusBar",
|
|
5363
5363
|
props: {
|
|
5364
5364
|
isDark: { type: Boolean },
|
|
@@ -5425,7 +5425,7 @@ const hi = (n) => (Xe("data-v-cd1a3c67"), n = n(), je(), n), _i = /* @__PURE__ *
|
|
|
5425
5425
|
});
|
|
5426
5426
|
};
|
|
5427
5427
|
}
|
|
5428
|
-
}), Vr = /* @__PURE__ */ q(zr, [["__scopeId", "data-v-
|
|
5428
|
+
}), Vr = /* @__PURE__ */ q(zr, [["__scopeId", "data-v-b5230a4b"]]), Ir = {
|
|
5429
5429
|
key: 0,
|
|
5430
5430
|
class: "ml-file-name"
|
|
5431
5431
|
}, vs = /* @__PURE__ */ I({
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mlightcad/cad-viewer",
|
|
3
|
-
"version": "1.4.
|
|
3
|
+
"version": "1.4.9",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"repository": {
|
|
@@ -42,8 +42,8 @@
|
|
|
42
42
|
"vite-svg-loader": "^5.1.0",
|
|
43
43
|
"vue-eslint-parser": "^9.4.3",
|
|
44
44
|
"vue-tsc": "^2.1.6",
|
|
45
|
-
"@mlightcad/
|
|
46
|
-
"@mlightcad/
|
|
45
|
+
"@mlightcad/svg-renderer": "1.4.9",
|
|
46
|
+
"@mlightcad/three-renderer": "1.4.9"
|
|
47
47
|
},
|
|
48
48
|
"dependencies": {
|
|
49
49
|
"@element-plus/icons-vue": "^2.3.1",
|
|
@@ -57,7 +57,7 @@
|
|
|
57
57
|
"element-plus": "^2.12.0",
|
|
58
58
|
"vue": "^3.4.21",
|
|
59
59
|
"vue-i18n": "^10.0.1",
|
|
60
|
-
"@mlightcad/cad-simple-viewer": "1.4.
|
|
60
|
+
"@mlightcad/cad-simple-viewer": "1.4.9"
|
|
61
61
|
},
|
|
62
62
|
"scripts": {
|
|
63
63
|
"analyze": "vite build --mode analyze",
|