Nowo UiKit Bundle

⭐ Found this useful? Install from Packagist · Give it a star on GitHub so more developers can find it.

Canonical admin UI kit for Nowo Symfony bundles and host apps: Twig macros, semantic nowo-ui-* CSS, pagination/tabs/modals/toasts/confirm/loader, cards/filters, shell chrome (aside / nested nav / burger / avatar / user menu / footer / width toggle), theme/locale/kebab helpers, Thinking Orbs (local canvas, no CDN), and multi-framework class helpers (bootstrap5, tailwind, foundation, custom, …) per REQ-UI-001.

Compatible with Symfony 6.x, 7.4+, and 8.x (PHP 8.1+; Symfony 8 requires PHP 8.4+).

This bundle is FrankenPHP worker mode friendly.

Table of contents

• What this is / is not
• Features
• Installation
• Quick start
• Demos
• Documentation
• Tests and coverage
• License
• Contributing

What this is / is not

Is	Is not
Buttons, toolbars, tables, lists, pagination, tabs, flashes/toasts, empty states, modal/confirm, cards/filters, icons, aside (nested) / burger / avatar / user menu / footer, theme/locale/kebab/width, Thinking Orbs	DashboardMenu / BreadcrumbKit navigation chrome
Shared nowo-ui-* look-and-feel	Domain CRUD pages / manage routes
Multi-framework class macros	Form widget themes (use FormKit)

Features

• Twig macros (@NowoUiKitBundle/macros/ui.html.twig) with optional per-call framework override
• Semantic stylesheet css/nowo-ui.css (asset package nowo_ui_kit), including dark [data-theme="dark"] tokens
• TypeScript → IIFEs: modal, shell, toast, confirm, page-loader, theme, orb
• Thinking Orbs: _thinking_orb + nowo-ui-orb.js; page loader visual: orb|spinner (THIRD_PARTY.md)
• Config: css_framework, icon_set; i18n domain NowoUiKitBundle (en, es, it, fr, pt, de, nl)
• Twig namespace overrides under templates/bundles/NowoUiKitBundle/
• Adoption + Stimulus contracts: docs/ADOPTION.md, docs/STIMULUS.md

Installation

composer require nowo-tech/ui-kit-bundle
php bin/console assets:install

With Flex, the recipe creates config/packages/nowo_ui_kit.yaml. See docs/INSTALLATION.md and docs/RECIPE.md.

Quick start

# config/packages/nowo_ui_kit.yaml
nowo_ui_kit:
    css_framework: bootstrap5   # or: tailwind | foundation | custom
    icon_set: bootstrap-icons

{% import '@NowoUiKitBundle/macros/ui.html.twig' as ui %}

<link rel="stylesheet" href="{{ asset('css/nowo-ui.css', 'nowo_ui_kit') }}">

<button type="button" class="{{ ui.btn('primary') }}">Save</button>

See docs/USAGE.md and docs/CONFIGURATION.md.

Demos

FrankenPHP demos (Caddy + PHP). Runtime mode: FRANKENPHP_MODE (worker default; classic for per-request PHP). See docs/DEMO-FRANKENPHP.md.

Demo	Port	Notes
demo/symfony8	8092	Bootstrap 5 kitchen sink
demo/symfony8-tailwind	8093	Tailwind kitchen sink

make -C demo up-symfony8
# open http://localhost:8092/

Documentation

Developer-facing docs are English only (Contributing — Language policy).

• Installation
• Configuration
• Usage
• Adoption (Beacon + bundles)
• Stimulus / data contracts
• Third-party notices
• Roadmap
• Flex recipe
• FrankenPHP demos
• Contributing
• Code of Conduct
• Security
• Changelog
• Upgrading
• Release
• Coverage
• GitHub Actions CI
• Spec-driven development
• Spec Kit

Tests and coverage

Suite	Coverage
PHP (PHPUnit)	100% lines (fail under 99% in CI)
TypeScript (Vitest)	≥90% lines (Vitest thresholds)
Python	N/A

composer install
make test
make test-coverage
make test-ts
pnpm install && pnpm run build

See docs/COVERAGE.md.

License

MIT — see LICENSE.

Contributing

See docs/CONTRIBUTING.md. Install hooks with make setup-hooks (REQ-GIT-001).