@pagedotapp/page-ui

The complete Page UI components bundle

Installation

npm install @pagedotapp/page-ui

Included Components

This bundle includes the following components:

• @pagedotapp/page-avatar
• @pagedotapp/page-avatar-select
• @pagedotapp/page-banner
• @pagedotapp/page-banner-select
• @pagedotapp/page-bottom-sheet
• @pagedotapp/page-button
• @pagedotapp/page-card
• @pagedotapp/page-checkbox
• @pagedotapp/page-data-card
• @pagedotapp/page-db-read
• @pagedotapp/page-db-write
• @pagedotapp/page-dialog
• @pagedotapp/page-icon
• @pagedotapp/page-icon-button
• @pagedotapp/page-image
• @pagedotapp/page-input
• @pagedotapp/page-loader
• @pagedotapp/page-media-preview
• @pagedotapp/page-menu
• @pagedotapp/page-pay-button
• @pagedotapp/page-select
• @pagedotapp/page-sidebar
• @pagedotapp/page-switch
• @pagedotapp/page-tabs
• @pagedotapp/page-text
• @pagedotapp/page-textarea
• @pagedotapp/page-toast
• @pagedotapp/page-tooltip

Usage

Import components from the bundle:

import {
	PageButton,
	PageInput,
	PageCard,
	PageText,
	PageImage,
	// ... other components
} from "@pagedotapp/page-ui"

function App() {
	return (
		<PageCard>
			<PageImage src="/logo.png" alt="Logo" width={200} height={100} />
			<PageText as="h1" variant="primary">
				Welcome
			</PageText>
			<PageInput placeholder="Enter text..." />
			<PageButton variant="primary">Submit</PageButton>
		</PageCard>
	)
}

Why Use This Bundle?

• Single dependency: Install once, use multiple components
• Consistent versions: All components work well together
• Smaller install: Shared dependencies are deduplicated
• Tree-shakable: Only the components you use are included in your application

Individual Component Docs

For detailed documentation on each component, see their individual packages:

• @pagedotapp/page-avatar
• @pagedotapp/page-avatar-select
• @pagedotapp/page-banner
• @pagedotapp/page-banner-select
• @pagedotapp/page-bottom-sheet
• @pagedotapp/page-button
• @pagedotapp/page-card
• @pagedotapp/page-checkbox
• @pagedotapp/page-conversation
• @pagedotapp/page-conversation-input
• @pagedotapp/page-db-read
• @pagedotapp/page-db-write
• @pagedotapp/page-dialog
• @pagedotapp/page-icon
• @pagedotapp/page-icon-button
• @pagedotapp/page-image
• @pagedotapp/page-input
• @pagedotapp/page-loader
• @pagedotapp/page-media-preview
• @pagedotapp/page-menu
• @pagedotapp/page-pay-button
• @pagedotapp/page-select
• @pagedotapp/page-sidebar
• @pagedotapp/page-switch
• @pagedotapp/page-tabs
• @pagedotapp/page-text
• @pagedotapp/page-textarea
• @pagedotapp/page-toast
• @pagedotapp/page-tooltip

License

MIT © PageStudio