@openfin/here-ui-css

@here/here-ui-css

CSS-only distribution of @openfin/ui-library components.

Purpose

This package provides compiled CSS styles from @openfin/ui-library as a standalone distribution. It allows you to use the component styles without the React component implementations, making it ideal for:

• Non-React applications
• Custom implementations using the same visual design
• Static HTML projects

Installation

npm install @here/here-ui-css

Import Patterns

All-in (Default)

Import all component styles at once:

@import '@here/here-ui-css';

import '@here/here-ui-css';

Per-file Subpaths

Import individual component styles using any path under dist/:

@import '@here/here-ui-css/styles/enterpriseTab.css';

import '@here/here-ui-css/styles/enterpriseTab.css';

The package uses subpath patterns, so you can import any CSS file from the dist/ directory without needing to manually maintain exports in package.json. As new CSS files are added to the UI library, they automatically become importable!

Versioning

This package's version tracks @openfin/ui-library. When @openfin/ui-library is published, this package is published with the same version number to ensure style compatibility.

Building

This package's build process depends on a completed @openfin/ui-library build:

# 1. Build the UI Library first (from workspace root)
npm run build:ui

# 2. Then build the CSS package (from packages/here-ui-css)
npm run build

The build script will:

• Clean the dist/ directory
• Copy all CSS files from @openfin/ui-library/dist/ to dist/
• Generate dist/index.css that imports all CSS files in deterministic order

If the UI Library hasn't been built yet, the build will fail with a clear error message.

Source

The CSS files in this package are compiled outputs. The source SCSS/CSS files live in the @openfin/ui-library package at packages/ui-library/src/styles/. Any modifications should be made there.

License

SEE LICENSE IN LICENSE.MD