Laravel EnsoLaravel Enso
Guide
Back End
Front End
GitHub
Guide
Back End
Front End
GitHub
  • Front End

    • Accessories
    • Addresses
    • Algolia
    • Audits
    • Auth
    • Bookmarks
    • Calendar
    • Card
    • Cargo Partner
    • Categories
    • Charts
    • Checkbox
    • Clipboard
    • Comments
    • Commercial
    • Companies
    • Confirmation
    • Currencies
    • Data Import
    • Date
    • Datepicker
    • Directives
    • Discounts
    • Divider
    • Documents
    • Dropdown
    • Dropdown Indicator
    • Eav
    • Emag
    • Emails
    • Enums
    • ERD
    • Facebook
    • Files
    • Filters
    • Financials
    • Forms
    • Frisbo
    • Google
    • Holidays
    • How to
    • Interactions
    • Inventory
    • IO
    • Laravel Validation
    • Loader
    • Localisation
    • Logs
    • Measurement Units
    • Meili Search
    • Menus
    • Mixins
    • Modal
    • Money
    • Monitored Emails
    • Notifications
    • Orderable Trees
    • Packaging Units
    • Pagination
    • People
    • Permissions
    • Product Lots
    • Products
    • Progress Bar
    • Progress Circle
    • Progress Indicator
    • Questionnaires
    • Quick View
    • Range Slider
    • Rating
    • Roles
    • Route Mapper
    • Sale Channels
    • Scroll to Top
    • Search Mode
    • Select
    • Sentry
    • Services
    • Smart Bill
    • SMS Advert
    • Strings
    • Switch
    • Tables
    • Tabs
    • Tasks
    • Teams
    • Textarea
    • Themes
    • Ticketing
    • Toastr
    • Transitions
    • Tree View
    • Tutorials
    • Typeahead
    • Typesense
    • UI
    • Uploader
    • UPS
    • User Groups
    • Users
    • Virtual Call Center
    • Vouchers
    • Webshop
    • WYSIWYG

Mixins

LicenseStableDownloadsVueJavaScriptSCSSnpmIssuesMerge Requests

Description

Mixins provides small reusable helper modules for file-type inspection and number formatting across Enso UI packages.

Installation

Install the package:

yarn add @enso-ui/mixins

The helpers can be consumed from any Vue application or Enso UI package.

Features

  • exports EnsoFile, numberFormat, and shortNumber from the package root
  • maps file extensions to Font Awesome icons and viewability helpers
  • formats decimal values with the current Enso locale preferences
  • compacts large numbers into SI-style suffixes such as k, M, and G

Usage

import { EnsoFile, numberFormat, shortNumber } from '@enso-ui/mixins';

const file = new EnsoFile({ extension: 'pdf' });
file.icon();
numberFormat(1234.567, 2);
shortNumber(128000);

API

Root exports

Import: @enso-ui/mixins

EnsoFile

Helper class for file extension inspection.

Constructor:

  • new EnsoFile({ extension })

Methods:

  • extension()
  • isImage()
  • isPdf()
  • isViewable()
  • icon()

numberFormat(value, decimals = 3)

Formats a decimal number with Intl.NumberFormat using the current Enso UI locale preferences.

shortNumber(number, precision = 2)

Compacts large numbers into SI-style suffixes and returns values such as 1.2k, 4.5M, or 9G.

Depends On

  • @enso-ui/ui ↗

Contributions

are welcome. Pull requests are great, but issues are good too.

Thank you to all the people who already contributed to Enso!

License

MIT

Edit this page on GitHub
Last Updated: 4/21/2026, 10:04:44 AM
Prev
Menus
Next
Modal