Package Exports

adya-ui-react
adya-ui-react/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (adya-ui-react) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

adya-ui-react

React wrapper components for AdyaUI - providing a clean, React-style API for AdyaUI Web Components.

Installation

# Install both packages (required)
npm install adya-ui-core adya-ui-react

# or with pnpm
pnpm add adya-ui-core adya-ui-react

# or with yarn
yarn add adya-ui-core adya-ui-react

Note: adya-ui-core is required as it contains the actual Web Components that adya-ui-react wraps.

Usage

// Import React components
import { Button, TextField, Card, Alert } from 'adya-ui-react';
// Import core package to register Web Components
import 'adya-ui-core';
// Import theme CSS
import 'adya-ui-core/dist/theme.css';

function App() {
  return (
    <Card>
      <Alert severity="success">Welcome to AdyaUI!</Alert>
      
      <TextField 
        label="Email" 
        type="email"
        placeholder="Enter your email"
      />
      
      <Button variant="primary" size="large">
        Submit
      </Button>
    </Card>
  );
}

Available Components

<Button> - Button component with multiple variants
<TextField> - Input field with label and validation
<Card> - Container component with elevation
<Alert> - Alert/notification component
<Checkbox> - Checkbox input

Features

✅ Clean React API: Use <Button> instead of <aui-button>
✅ TypeScript Support: Full type definitions included
✅ Ref Forwarding: All components support React refs
✅ Props Interface: Proper TypeScript interfaces for all props
✅ Tree Shakeable: Import only what you need

TypeScript

All components are fully typed:

import { Button, ButtonProps } from 'adya-ui-react';

const MyButton: React.FC<ButtonProps> = (props) => {
  return <Button {...props} />;
};

License

MIT