@mono-lit/utility
Mono Utils
A comprehensive utility library for Vue.js applications built around DevExtreme UI components, providing powerful data management, validation, and export capabilities.
Features
- 🔧 OData Integration - Sophisticated OData client with batch operations, caching, and error handling
- 🎛️ DevExtreme Helpers - Utilities for data grids, lookups, and form components
- ✅ Schema Validation - Yup or Valibot (any Standard Schema) validation with nested object support
- 📊 Excel Export - Advanced Excel export capabilities with custom formatting and formulas
- 🔔 Notification System - Notivue-based notification management
- 🚨 Error Handling - Comprehensive HTTP and OData error handling
- 🔄 Data Manipulation - Powerful utilities for data transformation and operations
Installation
From npmjs (public):
pnpm add @mono-lit/utility
From the Netlify registry: add this to your project's .npmrc, then run the same pnpm add:
@mono-lit:registry=https://mono-libs.netlify.app/npm/
//mono-libs.netlify.app/npm/:_authToken=<REGISTRY_DOWNLOAD_TOKEN>
See the repository README for details.
Dependencies
Core Dependencies
These are the essential dependencies required for core functionality:
npm install notivue valibot exceljs file-saver-es @odata2ts/http-client-fetch json-server change-case chokidar
Note: The additional dependencies (json-server, change-case, chokidar) are recommended for development and should be installed as devDependencies:
npm install --save-dev json-server change-case chokidar
Optional DevExtreme Dependencies
For DevExtreme UI Components: If you're using DevExtreme components, you'll also need:
npm install devextreme devextreme-vue
Note: The core data fetching, validation, and Excel export utilities work independently of any UI framework. You can use this library with Vue, React, Angular, or vanilla JavaScript.
Quick Start
Basic Setup
<script setup>
import { useUtils } from '@mono-lit/utility/runtime'
const utils = useUtils()
// Destructure the utilities you need
const {
notif,
validateAllSchema,
validateSchema,
replacerData,
exportExcel,
useFetchOData,
createFetcher,
advanceExportExcel
} = utils
</script>
Usage Without DevExtreme
For users working with other UI frameworks (React, Angular, or vanilla JavaScript), you can still use the core data fetching, validation, and export utilities:
import { useUtils } from '@mono-lit/utility/runtime'
const { useFetchOData, notif, advanceExportExcel } = useUtils()
// Fetch data
const { data, error } = await useFetchOData({
url: '/Users',
baseUrl: 'https://your-api.com/odata',
type: 'data'
})
if (error) {
notif({
message: error.message,
type: 'error'
})
}
// Export to Excel
await advanceExportExcel({
title: 'User Report',
items: data,
config: {
columns: [
{ key: 'Id', title: 'ID', width: 10 },
{ key: 'Name', title: 'Name', width: 30 },
{ key: 'Email', title: 'Email', width: 40 }
]
}
})
Documentation
- Data Fetching - OData integration, HTTP client, data manipulation
- Excel Export - Advanced Excel export with formatting and formulas
- Validation - Schema validation with Yup or Valibot
- Notifications - Notivue-based notification system
- DevExtreme Integration - DevExtreme UI helpers and components
API Reference
useUtils Return Object
The main useUtils() function returns an object with the following utilities:
Core Utilities
notif- Notification systemvalidateAllSchema- Validate entire form (Yup or Valibot)validateSchema- Validate single field (Yup or Valibot)validateAllSchemaCheck- Check if any validation errors existclearSchemaValidation- Clear all validation errors
Data Utilities
replacerData- Add/update/remove items from arrays or DataSourcesfilterOrIn- Create OData filter expressions
UI Components
exportExcel- Basic Excel exportadvanceExportExcel- Advanced Excel export with formulas
OData & HTTP
useFetchOData- Main OData fetching utilitycreateFetcher- Create reusable fetchersuseNormalFetch- Simple HTTP fetch utilitycreateUniqueFetcher- Fetch unique records
License
This project is licensed under the MIT License.
Related Packages
Add import define props type support for Vue3 script-setup and lang is typescrip...
Storybook for Nuxt and Vite: Develop Vue3 components in isolation with Hot Reloa...
Storybook for Nuxt and Vite: Develop Vue3 components in isolation with Hot Reloa...
Version History
| Version | Released | Vue | License |
|---|---|---|---|
| 0.0.5 | 3.5.44 | MIT | |
| 0.0.4 | 3.5.44 | MIT | |
| 0.0.3 | 3.5.44 | MIT | |
| 0.0.2 | 3.5.44 | MIT | |
| 0.0.1 | 3.5.24 | MIT |
Pre-releases (1)
| Version | Released | License |
|---|---|---|
| 0.0.0-stage |