@haloduck/ui

HaloDuck UI Library is a modern and reusable UI component library for Angular-based applications.

Installation

npm install @haloduck/ui

Post Installation

update angular.json

Update angular.json file.

"build": {
  "options": {
    "assets": [
      ...
      "node_modules/@haloduck/ui/src/tailwind.css"
    ]
  }
}

Copy i18n

Copy i18n files to public/i18n folder in the root folder.

npx haloduck-copy-i18n

Key Components

Control Components

• Button: Button components with various styles
• Input: Form input component
• Select: Dropdown selection component
• DatePicker: Date picker component
• DateRange: Date range selection component
• Calendar: Calendar component
• Toggle: Toggle switch component
• CopyButton: Text copy button
• LanguageSelector: Language selection component
• ImageUploader: Image upload component
• FileUploader: File upload component
• ImageViewer: Image viewer component
• STLViewer: 3D STL file viewer
• MapToAddress: Address mapping component
• DrawCanvas: Drawing canvas component
• Flip: Flip animation component
• ConfirmDialog: Confirmation dialog
• Table: Data table component

Layout Components

• Breadcrumb: Breadcrumb navigation
• DialogContainer: Dialog container
• Notification: Notification component
• SideMenu: Side menu component

Widget Components

• PictureName: Image and name display widget

Styling

This library is built on Tailwind CSS. Tailwind CSS must be installed in your project.

npm install tailwindcss

Dependencies

• Angular 19.2.0+
• RxJS 7.8.0+
• Angular Forms 19.2.10+
• Transloco 7.6.1+
• Angular CDK 19.2.15+
• NgRx Component Store 19.0.0+
• Three.js 0.175.0+ (for 3D components)

License

MIT License

Support

If you have any issues or questions, please register them in GitHub Issues