@selfxyz/euclid

A production-ready React Native component library built with TypeScript.

Installation

``bash
npm install @selfxyz/euclid


or


yarn add @selfxyz/euclid
`

Peer Dependencies

This library requires the following peer dependencies:

`json
{
"react": ">=18.2.0",
"react-native": ">=0.72.0"
}
`

Usage

`tsx
import { Button, Card } from '@selfxyz/euclid';

const App = () => {
return (

title="Click Me"
onPress={() => console.log('Pressed')}
variant="primary"
size="medium"
/>

);
};
`

Components

$3

A versatile button component with multiple variants and sizes.

Props:

- title (string, required) - Button text
- onPress (function, required) - Press handler
- variant ('primary' | 'secondary' | 'outline') - Visual variant
- size ('small' | 'medium' | 'large') - Button size
- disabled (boolean) - Disabled state
- fullWidth (boolean) - Full width button

$3

A container component for grouping related content.

Props:

- children (ReactNode, required) - Card content
- variant ('elevated' | 'outlined' | 'filled') - Visual variant
- padding (SpacingKey) - Internal padding

Theme

Access design tokens:

`tsx
import { colors, spacing, typography, borderRadius } from '@selfxyz/euclid';

const styles = StyleSheet.create({
container: {
backgroundColor: colors.primary,
padding: spacing.md,
borderRadius: borderRadius.lg,
},
text: {
fontSize: typography.fontSize.md,
fontWeight: typography.fontWeight.semibold,
},
});
``

TypeScript

This library is written in TypeScript and includes type definitions.

Dependencies

We aim to have zero dependencies. First to keep the package light and second to reduce complications.

Where a certain library is needed for a UI/visiaul reason (bluring, svg) add it as a peer dependency and then as a dependency on main app. This prevents React Native "tried to register two views with same name" errors.

License

Business Source License 1.1
See LICENSE.MD