@qatar-navigation-milaha/ui

Shared React primitives, MILAHA brand tokens, Tailwind preset, and Storybook documentation for frontend teams.

Usage

import { Button } from "@qatar-navigation-milaha/ui";
import "@qatar-navigation-milaha/ui/styles.css";

export function SaveAction() {
  return <Button>Save changes</Button>;
}

Tailwind

Use the shared preset in a consuming app:

import companyPreset from "@qatar-navigation-milaha/ui/tailwind-preset";

export default {
  presets: [companyPreset],
  content: [
    "./app/**/*.{ts,tsx}",
    "./components/**/*.{ts,tsx}",
    "./node_modules/@qatar-navigation-milaha/ui/dist/**/*.js"
  ]
};

Prefer semantic classes like bg-primary, text-text, border-border, and bg-background-soft in app code.

Font

Neo Sans Pro remains the primary brand face. The package loads Poppins as the interim fallback through styles.css until licensed Neo Sans Pro web files are available.