Preline Essentials SDK

Website sections and page elements for modern web applications.

Published by PublicAI UX organization.

Installation

npm install @publicai-ux/preline-essentials

Usage

JavaScript/Node.js

const { components, categories, getComponent } = require('@publicai-ux/preline-essentials');

// Get all components
console.log(`Total components: ${components.length}`);

// Get a specific component
const hero = getComponent('hero-sections', 'hero-with-image');
console.log(hero);

// Get components by category
const heroComponents = getCategoryComponents('hero-sections');

ES Modules

import { components, categories, getComponent } from '@publicai-ux/preline-essentials';

const hero = getComponent('hero-sections', 'hero-with-image');

Categories

Admin

Administrative dashboard interfaces and control panels for backend management and system oversight

• Components: 3
• Icon: Shield
• Path: admin

AI Prompt

AI-powered interfaces including chat interfaces, prompt builders, and intelligent assistance components

• Components: 5
• Icon: Bot
• Path: ai-prompt

Announcement Banners

Eye-catching banner components for promotions, notifications, and important site-wide announcements

• Components: 15
• Icon: Megaphone
• Path: announcement-banners

Application

Complete application layouts including sidebars, headers, and full-page interface structures

• Components: 13
• Icon: AppWindow
• Path: application

Authentication

Login, signup, password recovery, and user verification interface components for secure access

• Components: 7
• Icon: Lock
• Path: authentication

Basic

Fundamental layout components including basic pages, containers, and simple structural elements

• Components: 7
• Icon: Square
• Path: basic

Blog Articles

Individual blog post layouts with typography, metadata, and reading experience optimizations

• Components: 3
• Icon: FileEdit
• Path: blog-articles

Blog Sections

Blog homepage layouts, article grids, category pages, and blog navigation structures

• Components: 13
• Icon: BookOpen
• Path: blog-sections

Button Groups

Grouped button components for related actions, toggle groups, and segmented controls

• Components: 2
• Icon: MoreHorizontal
• Path: button-groups-new

Card Sections

Card-based layout sections for features, services, and content organization with modern styling

• Components: 7
• Icon: RectangleHorizontal
• Path: card-sections

Charts

Data visualization components including bar charts, line graphs, and interactive chart elements

• Components: 3
• Icon: BarChart3
• Path: charts

Client Sections

Client showcase layouts, logos grids, testimonial collections, and partner display components

• Components: 7
• Icon: Users
• Path: clients-sections

Contacts

Contact forms, information displays, team member cards, and communication interface elements

• Components: 6
• Icon: Contact
• Path: contacts

Cookie Banners

GDPR compliant cookie consent banners and privacy notification components

• Components: 0
• Icon: Cookie
• Path: cookie-banners

Description Lists

Structured content layouts for displaying key-value pairs, specifications, and detailed information

• Components: 2
• Icon: List
• Path: description-lists

Dropdowns

Modern dropdown menus, select components, and contextual menu interfaces with enhanced styling

• Components: 5
• Icon: ChevronDown
• Path: dropdowns-new

FAQ Sections

Frequently asked questions layouts with collapsible sections and search functionality

• Components: 5
• Icon: HelpCircle
• Path: faq-sections

Features General

Product feature showcases, benefit highlights, and general feature presentation layouts

• Components: 8
• Icon: Star
• Path: features-general

Features Navigation

Feature-focused navigation components and interactive feature exploration interfaces

• Components: 3
• Icon: Compass
• Path: features-navs

Features Statistics

Statistical feature presentations combining data visualization with feature highlights

• Components: 4
• Icon: TrendingUp
• Path: features-stats

Feedback

User feedback forms, rating systems, review components, and survey interfaces for gathering input

• Components: 7
• Icon: MessageSquare
• Path: feedback

Footers

Website footer components with links, social media, contact information, and site navigation

• Components: 17
• Icon: Minus
• Path: footers

Form Layouts

Complete form page layouts and structured form arrangements for various use cases

• Components: 5
• Icon: Layout
• Path: form-layouts

Galleries

Image galleries, photo grids, portfolio showcases, and media display components

• Components: 7
• Icon: Images
• Path: galleries

Hero Forms

Prominent hero sections featuring integrated forms for lead capture and user engagement

• Components: 9
• Icon: Zap
• Path: hero-forms

Hero Sections

Impactful hero sections with compelling headlines, call-to-action buttons, and visual elements

• Components: 21
• Icon: Rocket
• Path: hero-sections

Icon Sections

Icon-based feature sections, service showcases, and benefit presentations with visual icons

• Components: 21
• Icon: Sparkles
• Path: icon-sections

Invoice

Professional invoice layouts, billing statements, and payment documentation components

• Components: 5
• Icon: Receipt
• Path: invoice

Masonry Sections

Pinterest-style masonry layouts for dynamic content arrangement and visual interest

• Components: 3
• Icon: Grid3x3
• Path: masonry-sections

Mega Menu

Large dropdown navigation menus with multiple columns, categories, and rich content

• Components: 7
• Icon: Menu
• Path: mega-menu

Miscellaneous

Various utility components and specialized elements that don't fit into other categories

• Components: 3
• Icon: Package
• Path: miscellaneous

Modals

Modal dialogs, popup windows, lightboxes, and overlay interfaces for focused interactions

• Components: 25
• Icon: Square
• Path: modals

Navigation Bars

Simple navigation bars and header components for basic site navigation

• Components: 9
• Icon: Navigation2
• Path: navbars

Header Navigation

Advanced header navigation components with complex layouts and interactive elements

• Components: 23
• Icon: AlignJustify
• Path: navbars-(headers)

Pricing

Pricing tables, plan comparisons, and subscription interface components

• Components: 3
• Icon: DollarSign
• Path: pricing

Pricing Sections

Complete pricing page sections with multiple plans, feature comparisons, and billing options

• Components: 9
• Icon: CreditCard
• Path: pricing-sections

Product Listings

Product grid layouts, catalog displays, and e-commerce listing interfaces

• Components: 3
• Icon: ShoppingBag
• Path: product-listings-grid-layout

Select Components

Modern select dropdowns and choice selectors with enhanced user experience

• Components: 2
• Icon: ChevronDownSquare
• Path: selects-new

Statistics

Statistical displays, metrics showcases, and data presentation components

• Components: 8
• Icon: BarChart
• Path: stats

Subscribe

Newsletter signup forms, subscription interfaces, and email capture components

• Components: 7
• Icon: Mail
• Path: subscribe

Tables

Data tables with advanced features like sorting, filtering, and responsive design

• Components: 11
• Icon: Table2
• Path: tables

Team Sections

Team member showcases, staff profiles, and organizational structure displays

• Components: 7
• Icon: Users2
• Path: team-sections

Testimonials

Customer testimonials, reviews, and social proof components with various layouts

• Components: 17
• Icon: Quote
• Path: testimonials

Textarea Input

Multi-line text input components with various styles and validation options

• Components: 7
• Icon: Type
• Path: textarea-input

Timeline

Chronological timeline components for displaying events, history, and progress

• Components: 3
• Icon: Clock
• Path: timeline

User Profiles

User profile cards, account displays, and personal information layouts

• Components: 3
• Icon: User
• Path: user-profiles

Component Structure

Each component includes:

• HTML: Ready-to-use HTML markup
• Preview: Preview HTML for demonstrations
• JSX: React component version (when available)
• JavaScript: Interactive functionality
• CSS: Tailwind CSS styles
• Schema: Data structure definitions
• Manifest: Component metadata

Build Info

• Version: 1.0.0
• Total Components: 360
• Categories: 46
• Build Date: 2025-09-26T08:42:27.911Z

License

MIT License - see LICENSE file for details.