vueTools
vuetools
About
VueTools solves the problem of library duplication when using Vue 3 across multiple MODX components. Instead of each component bundling its own copy of Vue, Pinia, and PrimeVue, they all share common libraries provided by VueTools.
**Benefits**
1. Single library version — all components use the same versions of Vue, Pinia, and PrimeVue
2. Smaller download size — libraries are loaded once and cached by the browser
3. Isolated styles — PrimeVue styles don't conflict with the MODX ExtJS manager
4. Built-in composables — useLexicon, useApi, useModx, usePermission for working with MODX
**Package contents**
1. Vue 3 | 3.5.x | Reactive framework
2. Pinia | 3.0.x | State management
3. PrimeVue | 4.3.x | UI components
4. PrimeIcons | 7.0.x | Icons
**Architecture**
VueTools uses Import Maps — a native browser standard for resolving ES Module imports.
The VueTools plugin hooks into the OnManagerPageInit event and registers an Import Map in the manager ``:
```
{
"imports": {
"vue": "/assets/components/vuetools/vendor/vue.min.js",
"pinia": "/assets/components/vuetools/vendor/pinia.min.js",
"primevue": "/assets/components/vuetools/vendor/primevue.min.js",
"@vuetools/useApi": "/assets/components/vuetools/composables/useApi.min.js",
"@vuetools/useLexicon": "/assets/components/vuetools/composables/useLexicon.min.js",
"@vuetools/useModx": "/assets/components/vuetools/composables/useModx.min.js",
"@vuetools/usePermission": "/assets/components/vuetools/composables/usePermission.min.js",
"@vuetools/": "/assets/components/vuetools/composables/"
}
}
```
**How it works**
1. The VueTools plugin fires on OnManagerPageInit
2. Registers the Import Map in the manager (before any ES modules)
3. Loads PrimeVue CSS styles (scoped to .vueApp)
4. Your component loads its ES modules
5. The browser resolves imports through the Import Map
When a Vue component executes `import { ref } from 'vue',` the browser finds the vue key in the Import Map and loads the file from the specified path.
This package is a dependency for MiniShop3, mSearch, and other components that share a unified visual style in the manager.
At a glance
MODX 3 compatibility unknown. Based on our testing and community reports where available.
- Developer biz87
- Latest release October 9, 2026 (25 days ago)
- First seen in SiteDash October 7, 2026 (27 days ago)
- License GPLv2
- MODX support 3.0 – 100.0
| Changelog | |||
|---|---|---|---|
| MODX.com |
1.2.1-pl |
October 9, 2026
25 days ago |
|
|
## [1.2.1-pl] - 2026-09-24
### Changed - Modx theme follows the MODX 3 manager more closely (#46): a Button with no severity uses the green `.primary-button` fill (`#6CB24A`), same as `severity="success"`; navy `#234368` stays on tabs, links and selection - Modx theme: single-line fields are 32px (`modx.field.height`), buttons stay 36px (`modx.control.height`) (#46) - Modx theme: ToggleSwitch, Slider, ProgressBar, Checkbox, RadioButton, DatePicker, Dialog, DataTable, Paginator, Tabs, Tooltip, Toast and menus restyled to the manager (#46) - DEVELOPER_GUIDE: version-aware VueTools check for theming consumers (#25) - GitHub issue and pull request templates (#45) ### Fixed - Modx theme: DatePicker, Slider and ProgressBar light overrides follow `darkModeSelector`, including a `.p-dark` subtree (#48) - Line endings normalized to LF via `.gitattributes` (#48) ## [1.2.0-pl] - 2026-09-14 ### Added - Native MODX 3 manager theme `Modx` for PrimeVue 4 (Nora base, splash `#234368`, 3px radius, 13px body) - Helpers `ModxManagerTheme` (`darkModeSelector: 'none'`) and `ModxTheme` (class `.p-dark`) - Centralized theming (#22): system setting `vuetools.theme` (default `aura`), `window.VueTools` injection, `@vuetools/useTheme` / `getActiveTheme()` with Aura fallback - Preset registry (`aura`, `modx`) inside VueTools; new themes register only here - Import Map aliases `vuetools` and `vuetools/theme` (same bundle as `primevue`; `vuetools/theme` is the version-aware theming signal) - Theme showcase: `npm run demo` / `npm run build:demo` (`src/demo/`, `vite.config.demo.js`) - Asset `?v=` cache-bust via filemtime for vendor/composables - System setting combo `vuetools-combo-theme` (`aura` | `modx`) for `vuetools.theme` ### Fixed - One VueTools service under both `vuetools` and `vueTools` keys, so Import Map and CSS are not registered twice (#11) ### Changed - README and DEVELOPER_GUIDE: prefer `getActiveTheme()`; Save = `severity="success"`; token layers - Backward compatible: extras that hardcode `Aura` / `ModxManagerTheme` keep working unchanged ### Security - Consolidated build dependency bumps: `vite`, `postcss`, `nanoid`, `brace-expansion` (#21) |
|||
| modstore.pro |
1.2.1-pl |
September 24, 2026
1 month ago |
|
|
# Changelog<br /><br />
All notable changes to this project will be documented in this file.<br /><br /> The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),<br /> and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).<br /><br /> ## [1.2.1-pl] - 2026-09-24<br /><br /> ### Changed<br /> - Modx theme follows the MODX 3 manager more closely (#46): a Button with no severity uses the green `.primary-button` fill (`#6CB24A`), same as `severity="success"`; navy `#234368` stays on tabs, links and selection<br /> - Modx theme: single-line fields are 32px (`modx.field.height`), buttons stay 36px (`modx.control.height`) (#46)<br /> - Modx theme: ToggleSwitch, Slider, ProgressBar, Checkbox, RadioButton, DatePicker, Dialog, DataTable, Paginator, Tabs, Tooltip, Toast and menus restyled to the manager (#46)<br /> - DEVELOPER_GUIDE: version-aware VueTools check for theming consumers (#25)<br /> - GitHub issue and pull request templates (#45)<br /><br /> ### Fixed<br /> - Modx theme: DatePicker, Slider and ProgressBar light overrides follow `darkModeSelector`, including a `.p-dark` subtree (#48)<br /> - Line endings normalized to LF via `.gitattributes` (#48)<br /><br /> ## [1.2.0-pl] - 2026-09-14<br /><br /> ### Added<br /> - Native MODX 3 manager theme `Modx` for PrimeVue 4 (Nora base, splash `#234368`, 3px radius, 13px body)<br /> - Helpers `ModxManagerTheme` (`darkModeSelector: 'none'`) and `ModxTheme` (class `.p-dark`)<br /> - Centralized theming (#22): system setting `vuetools.theme` (default `aura`), `window.VueTools` injection, `@vuetools/useTheme` / `getActiveTheme()` with Aura fallback<br /> - Preset registry (`aura`, `modx`) inside VueTools; new themes register only here<br /> - Import Map aliases `vuetools` and `vuetools/theme` (same bundle as `primevue`; `vuetools/theme` is the version-aware theming signal)<br /> - Theme showcase: `npm run demo` / `npm run build:demo` (`src/demo/`, `vite.config.demo.js`)<br /> - Asset `?v=` cache-bust via filemtime for vendor/composables<br /> - System setting combo `vuetools-combo-theme` (`aura` | `modx`) for `vuetools.theme`<br /><br /> ### Fixed<br /> - One VueTools service under both `vuetools` and `vueTools` keys, so Import Map and CSS are not registered twice (#11)<br /><br /> ### Changed<br /> - README and DEVELOPER_GUIDE: prefer `getActiveTheme()`; Save = `severity="success"`; token layers<br /> - Backward compatible: extras that hardcode `Aura` / `ModxManagerTheme` keep working unchanged<br /><br /> ### Security<br /> - Consolidated build dependency bumps: `vite`, `postcss`, `nanoid`, `brace-expansion` (#21) |
|||
| modstore.pro |
1.2.0-pl |
September 14, 2026
1 month ago |
— |
| modstore.pro |
1.1.2-pl |
June 15, 2026
4 months ago |
— |
| MODX.com |
1.1.1-pl |
May 4, 2026
5 months ago |
— |
| modstore.pro |
1.1.1-pl |
February 10, 2026
8 months ago |
— |
| modstore.pro |
1.1.0-pl |
February 6, 2026
8 months ago |
— |
| modstore.pro |
1.0.1-pl |
January 26, 2026
9 months ago |
— |
| modstore.pro |
1.0.0-beta1 |
January 5, 2026
9 months ago |
— |
|
No matching releases. |
|||