Machine UI

Machine UI is Vention's component library for building applications and Human-Machine Interfaces (HMIs). This is the same library that Vention uses internally to build our own applications, now available for you to build custom applications for your Vention machines.

📚 Documentation

Complete documentation, including component examples, design system guidelines, and usage instructions, can be found at:

https://assets.vention.com/machine-ui-storybook/

🚀 Installation

Install Machine UI via npm:

npm install @vention/machine-ui

For the latest version and release notes, visit the npm package page.

📖 Quick Start

import { VentionButton } from "@vention/machine-ui"

function App() {
  return (
    <VentionButton variant="contained" color="primary">
      Hello World
    </VentionButton>
  )
}

For detailed installation instructions, including font setup and prerequisites, see the Installation and Usage guide.

📋 Versioning Policy

Starting with version 1.0.0, Machine UI follows strict semantic versioning:

• Major versions (e.g., 1.x.x → 2.x.x): Breaking changes to component contracts, APIs, or behavior
• Minor versions (e.g., 1.1.x → 1.2.x): New features with backward compatibility
• Patch versions (e.g., 1.1.1 → 1.1.2): Bug fixes and internal improvements

Any breaking change, no matter how small, will require a major version bump. This ensures you can confidently upgrade patch and minor versions without unexpected breaking changes.

🏭 Building HMIs

Machine UI components work exceptionally well for industrial HMI applications. For guidelines on building touch-screen interfaces optimized for industrial environments, see our documentation on:

• Touch target sizing and spacing
• Readability at distance
• Color contrast requirements
• Simplified interactions for gloved operation

🛠️ Tech Stack

• React: UI framework
• TypeScript: Type safety
• Material-UI (MUI v5): Base component library
• TSS: Styling solution

📄 License

This library is provided for use with Vention machines and applications.