@sibipro/sprinkles-native 0.1.8 → 0.1.17

package/package.json

@@ -1,9 +1,13 @@
 {
   "name": "@sibipro/sprinkles-native",
-  "version": "0.1.8",
+  "version": "0.1.17",
   "description": "React Native UI component library with Tailwind theming",
   "type": "module",
   "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/sibipro/sprinkles-react-native.git"
+  },
   "packageManager": "pnpm@10.6.2",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/README.md

@@ -1,101 +0,0 @@
-# @sibipro/sprinkles-native
-
-A React Native component library with Tailwind-style theming via [Uniwind](https://github.com/nickshanks347/uniwind).
-
-## Install
-
-```bash
-pnpm add @sibipro/sprinkles-native
-```
-
-Peer dependencies: `react >= 18`, `react-native >= 0.74`, and optionally `uniwind >= 1.0.0`.
-
-## Components
-
-### Layout & Containers
-
-- **Card** — `variant: "default" | "outline"`
-- **Banner** — `variant: "info" | "warn" | "danger" | "success"`
-- **Separator** — horizontal or vertical divider
-- **EmptyState** — centered placeholder with title, description, icon, and action slot
-
-### Text & Typography
-
-- **Text** — `variant: "body" | "caption" | "label" | "heading"`, `size: "xs" | "sm" | "md" | "lg" | "xl" | "2xl"`, `weight: "normal" | "medium" | "semibold" | "bold"`
-
-### Form Controls
-
-- **Input** — `variant: "default" | "search" | "ghost"`, `girth: "sm" | "md" | "lg"`
-- **InputWithExtras** — Input with leading/trailing adornments
-- **InputWithLabel** — Input with an attached label
-- **Checkbox** — custom checkbox with label and disabled state
-- **Switch** — toggle with `checked` / `onCheckedChange`
-- **Label** — semantic label wrapper
-
-### Buttons & Actions
-
-- **Button** — `variant: "primary" | "secondary" | "tertiary" | "tertiary-brand" | "tertiary-danger" | "danger" | "ghost" | "link"`, `size: "sm" | "md" | "lg"`
-- **Chip** — dismissible chip with optional `onDismiss`
-
-### Data Display
-
-- **Badge** — `variant: "default" | "brand" | "danger" | "success" | "warn" | "info" | "outline"`
-- **Avatar** — auto-generates initials from `name`, `size: "sm" | "md" | "lg" | "xl"`
-- **ProgressBar** — `value` / `max` progress indicator
-- **Skeleton** — animated loading placeholder
-
-## Usage
-
-```tsx
-import { Button, Card, Text, Badge } from "@sibipro/sprinkles-native"
-
-const Example = () => (
-  <Card variant="outline">
-    <Text variant="heading" size="lg">Order #1234</Text>
-    <Badge variant="success">Delivered</Badge>
-    <Button variant="primary" size="md" onPress={() => {}}>
-      View Details
-    </Button>
-  </Card>
-)
-```
-
-All components accept a `className` prop for Tailwind-style overrides (requires Uniwind):
-
-```tsx
-<Button className="mt-4 w-full" variant="primary">Submit</Button>
-```
-
-## Theming
-
-Import the global stylesheet in your app entry:
-
-```tsx
-import "@sibipro/sprinkles-native/styles.css"
-```
-
-This provides color tokens, font definitions, and light/dark mode support via CSS custom properties.
-
-### Color Palettes
-
-| Palette   | Usage                          |
-|-----------|--------------------------------|
-| Neutral   | Backgrounds, borders, text     |
-| Purple    | Brand / primary actions        |
-| Emerald   | Success states                 |
-| Amber     | Warnings                       |
-| Blue      | Informational                  |
-| Magenta   | Danger / destructive actions   |
-
-## Development
-
-```bash
-pnpm install
-pnpm build        # compile TypeScript to dist/
-pnpm test         # type-check with tsc --noEmit
-pnpm release      # bump patch, tag, and push
-```
-
-### Kitchen Sink
-
-An Expo app lives in `kitchen-sink/` for previewing components during development.

package/src/components/Avatar.tsx

@@ -1,58 +0,0 @@
-import React from 'react';
-import { View, type ViewProps } from 'react-native';
-import { cn } from '../utils/cn';
-import { Text } from './Text';
-
-export type AvatarSize = 'sm' | 'md' | 'lg' | 'xl';
-
-const sizeClasses: Record<AvatarSize, string> = {
-  sm: 'h-8 w-8',
-  md: 'h-10 w-10',
-  lg: 'h-12 w-12',
-  xl: 'h-16 w-16',
-};
-
-const textSizeClasses: Record<AvatarSize, string> = {
-  sm: 'text-xs',
-  md: 'text-sm',
-  lg: 'text-base',
-  xl: 'text-xl',
-};
-
-function getInitials(name: string): string {
-  const parts = name.trim().split(/\s+/);
-  if (parts.length === 1) return parts[0][0]?.toUpperCase() ?? '';
-  return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();
-}
-
-export interface AvatarProps extends ViewProps {
-  name: string;
-  size?: AvatarSize;
-  className?: string;
-}
-
-export function Avatar({
-  name,
-  size = 'md',
-  className,
-  ...props
-}: AvatarProps) {
-  const initials = getInitials(name);
-
-  return (
-    <View
-      className={cn(
-        'rounded-full bg-brand-100 items-center justify-center',
-        sizeClasses[size],
-        className,
-      )}
-      accessibilityRole="image"
-      accessibilityLabel={name}
-      {...props}
-    >
-      <Text weight="semibold" className={cn('text-brand-700', textSizeClasses[size])}>
-        {initials}
-      </Text>
-    </View>
-  );
-}

package/src/components/Badge.tsx

@@ -1,70 +0,0 @@
-import React from 'react';
-import { View, type ViewProps } from 'react-native';
-import { cn } from '../utils/cn';
-import { Text } from './Text';
-
-export type BadgeVariant =
-  | 'default'
-  | 'brand'
-  | 'danger'
-  | 'success'
-  | 'warn'
-  | 'info'
-  | 'outline';
-
-const variantClasses: Record<BadgeVariant, string> = {
-  default: 'bg-background-tertiary',
-  brand: 'bg-brand-50 dark:bg-brand-900',
-  danger: 'bg-danger-50 dark:bg-danger-900',
-  success: 'bg-success-50 dark:bg-success-900',
-  warn: 'bg-warn-50 dark:bg-warn-900',
-  info: 'bg-info-50 dark:bg-info-900',
-  outline: 'border border-border',
-};
-
-const textClasses: Record<BadgeVariant, string> = {
-  default: 'text-foreground',
-  brand: 'text-brand-700',
-  danger: 'text-danger-700',
-  success: 'text-success-700',
-  warn: 'text-warn-700',
-  info: 'text-info-700',
-  outline: 'text-foreground',
-};
-
-export interface BadgeProps extends ViewProps {
-  variant?: BadgeVariant;
-  className?: string;
-  children: React.ReactNode;
-}
-
-export function Badge({
-  variant = 'default',
-  className,
-  children,
-  ...props
-}: BadgeProps) {
-  return (
-    <View
-      className={cn(
-        'rounded-lg py-1.5 px-2.5 flex-row items-center gap-1.5',
-        variantClasses[variant],
-        className,
-      )}
-      {...props}
-    >
-      {typeof children === 'string' ? (
-        <Text
-          size="xs"
-          weight="semibold"
-          className={textClasses[variant]}
-          numberOfLines={1}
-        >
-          {children}
-        </Text>
-      ) : (
-        children
-      )}
-    </View>
-  );
-}

package/src/components/Banner.tsx

@@ -1,34 +0,0 @@
-import React from 'react';
-import { View, type ViewProps } from 'react-native';
-import { cn } from '../utils/cn';
-
-export type BannerVariant = 'info' | 'warn' | 'danger' | 'success';
-
-const variantClasses: Record<BannerVariant, string> = {
-  info: 'bg-info-50 dark:bg-info-900',
-  warn: 'bg-warn-50 dark:bg-warn-900',
-  danger: 'bg-danger-50 dark:bg-danger-900',
-  success: 'bg-success-50 dark:bg-success-900',
-};
-
-export interface BannerProps extends ViewProps {
-  variant?: BannerVariant;
-  className?: string;
-}
-
-export function Banner({
-  variant = 'info',
-  className,
-  ...props
-}: BannerProps) {
-  return (
-    <View
-      className={cn(
-        'rounded-2xl p-4 flex-row items-start gap-2.5',
-        variantClasses[variant],
-        className,
-      )}
-      {...props}
-    />
-  );
-}

package/src/components/Button.tsx

@@ -1,96 +0,0 @@
-import React from 'react';
-import { Pressable, type PressableProps } from 'react-native';
-import { cn } from '../utils/cn';
-import { Text } from './Text';
-
-export type ButtonVariant =
-  | 'primary'
-  | 'secondary'
-  | 'tertiary'
-  | 'tertiary-brand'
-  | 'tertiary-danger'
-  | 'danger'
-  | 'ghost'
-  | 'link';
-
-export type ButtonSize = 'sm' | 'md' | 'lg';
-
-const variantClasses: Record<ButtonVariant, string> = {
-  primary: 'bg-button-primary',
-  secondary: 'bg-button-secondary border border-border',
-  tertiary: 'bg-transparent',
-  'tertiary-brand': 'bg-transparent',
-  'tertiary-danger': 'bg-transparent',
-  danger: 'bg-danger-500',
-  ghost: 'bg-transparent',
-  link: 'bg-transparent',
-};
-
-const pressedClasses: Record<ButtonVariant, string> = {
-  primary: 'bg-button-primary-hover',
-  secondary: 'bg-button-secondary-hover',
-  tertiary: 'bg-button-tertiary-hover',
-  'tertiary-brand': 'bg-brand-25',
-  'tertiary-danger': 'bg-danger-25',
-  danger: 'bg-danger-600',
-  ghost: 'bg-accent',
-  link: 'opacity-70',
-};
-
-const textClasses: Record<ButtonVariant, string> = {
-  primary: 'text-button-primary-foreground',
-  secondary: 'text-button-secondary-foreground',
-  tertiary: 'text-button-tertiary-foreground',
-  'tertiary-brand': 'text-brand-500',
-  'tertiary-danger': 'text-danger-500',
-  danger: 'text-white',
-  ghost: 'text-foreground',
-  link: 'text-brand-500 underline',
-};
-
-const sizeClasses: Record<ButtonSize, string> = {
-  sm: 'h-8 px-3',
-  md: 'h-10 px-4',
-  lg: 'h-12 px-5',
-};
-
-export interface ButtonProps extends Omit<PressableProps, 'children'> {
-  variant?: ButtonVariant;
-  size?: ButtonSize;
-  className?: string;
-  children: React.ReactNode;
-}
-
-export function Button({
-  variant = 'secondary',
-  size = 'md',
-  className,
-  disabled,
-  children,
-  ...props
-}: ButtonProps) {
-  return (
-    <Pressable
-      className={({ pressed }) =>
-        cn(
-          'rounded-lg flex-row items-center justify-center gap-2',
-          variantClasses[variant],
-          sizeClasses[size],
-          pressed && pressedClasses[variant],
-          disabled && 'opacity-50',
-          className,
-        )
-      }
-      disabled={disabled}
-      {...props}
-    >
-      {typeof children === 'string' ? (
-        <Text size="sm" weight="bold" className={textClasses[variant]}>
-          {children}
-        </Text>
-      ) : (
-        children
-      )}
-    </Pressable>
-  );
-}

package/src/components/Card.tsx

@@ -1,28 +0,0 @@
-import React from 'react';
-import { View, type ViewProps } from 'react-native';
-import { cn } from '../utils/cn';
-
-export type CardVariant = 'default' | 'outline';
-
-const variantClasses: Record<CardVariant, string> = {
-  default: 'bg-background shadow-md',
-  outline: 'bg-background border border-border',
-};
-
-export interface CardProps extends ViewProps {
-  variant?: CardVariant;
-  className?: string;
-}
-
-export function Card({
-  variant = 'default',
-  className,
-  ...props
-}: CardProps) {
-  return (
-    <View
-      className={cn('rounded-xl p-4', variantClasses[variant], className)}
-      {...props}
-    />
-  );
-}

package/src/components/Checkbox.tsx

@@ -1,43 +0,0 @@
-import React from 'react';
-import { Pressable, View } from 'react-native';
-import { cn } from '../utils/cn';
-import { Text } from './Text';
-
-export interface CheckboxProps {
-  checked?: boolean;
-  onCheckedChange?: (checked: boolean) => void;
-  disabled?: boolean;
-  label?: string;
-  className?: string;
-}
-
-export function Checkbox({
-  checked = false,
-  onCheckedChange,
-  disabled,
-  label,
-  className,
-}: CheckboxProps) {
-  return (
-    <Pressable
-      onPress={() => !disabled && onCheckedChange?.(!checked)}
-      className={cn('flex-row items-center gap-2', disabled && 'opacity-50', className)}
-      accessibilityRole="checkbox"
-      accessibilityState={{ checked, disabled }}
-    >
-      <View
-        className={cn(
-          'h-5 w-5 rounded border items-center justify-center',
-          checked
-            ? 'bg-brand-500 border-brand-500'
-            : 'bg-background border-border',
-        )}
-      >
-        {checked && (
-          <Text className="text-white text-xs">✓</Text>
-        )}
-      </View>
-      {label && <Text className="text-foreground">{label}</Text>}
-    </Pressable>
-  );
-}

package/src/components/Chip.tsx

@@ -1,38 +0,0 @@
-import React from 'react';
-import { View, Pressable, type ViewProps } from 'react-native';
-import { cn } from '../utils/cn';
-import { Text } from './Text';
-
-export interface ChipProps extends ViewProps {
-  label: string;
-  onDismiss?: () => void;
-  className?: string;
-}
-
-export function Chip({ label, onDismiss, className, ...props }: ChipProps) {
-  return (
-    <View
-      className={cn(
-        'h-7 rounded-full bg-background-tertiary px-2.5 flex-row items-center gap-1',
-        className,
-      )}
-      {...props}
-    >
-      <Text size="sm" className="text-foreground">
-        {label}
-      </Text>
-      {onDismiss && (
-        <Pressable
-          onPress={onDismiss}
-          className="ml-0.5"
-          accessibilityRole="button"
-          accessibilityLabel={`Remove ${label}`}
-        >
-          <Text size="sm" className="text-foreground-label">
-            ✕
-          </Text>
-        </Pressable>
-      )}
-    </View>
-  );
-}

package/src/components/EmptyState.tsx

@@ -1,41 +0,0 @@
-import React from 'react';
-import { View, type ViewProps } from 'react-native';
-import { cn } from '../utils/cn';
-import { Text } from './Text';
-
-export interface EmptyStateProps extends ViewProps {
-  title: string;
-  description?: string;
-  icon?: React.ReactNode;
-  action?: React.ReactNode;
-  className?: string;
-}
-
-export function EmptyState({
-  title,
-  description,
-  icon,
-  action,
-  className,
-  ...props
-}: EmptyStateProps) {
-  return (
-    <View
-      className={cn('items-center py-12 px-4 gap-3', className)}
-      {...props}
-    >
-      {icon}
-      <View className="items-center gap-1">
-        <Text variant="heading" className="text-2xl text-center">
-          {title}
-        </Text>
-        {description && (
-          <Text className="text-lg text-foreground text-center">
-            {description}
-          </Text>
-        )}
-      </View>
-      {action}
-    </View>
-  );
-}

package/src/components/Input.tsx

@@ -1,123 +0,0 @@
-import React, { useRef } from 'react';
-import {
-  TextInput,
-  View,
-  Pressable,
-  type TextInputProps,
-  type ViewProps,
-} from 'react-native';
-import { cn } from '../utils/cn';
-import { Text } from './Text';
-
-export type InputVariant = 'default' | 'search' | 'ghost';
-export type InputGirth = 'sm' | 'md' | 'lg';
-
-const variantClasses: Record<InputVariant, string> = {
-  default: 'border border-border bg-background',
-  search: 'border-0 bg-background-secondary',
-  ghost: 'border-0 bg-transparent',
-};
-
-const girthClasses: Record<InputGirth, string> = {
-  sm: 'h-8',
-  md: 'h-10',
-  lg: 'min-h-[48px] py-3',
-};
-
-export interface InputProps extends TextInputProps {
-  variant?: InputVariant;
-  girth?: InputGirth;
-  error?: boolean;
-  className?: string;
-}
-
-export const Input = React.forwardRef<TextInput, InputProps>(
-  ({ variant = 'default', girth = 'md', error, className, ...props }, ref) => {
-    return (
-      <TextInput
-        ref={ref}
-        className={cn(
-          'w-full rounded-xl px-4 text-base text-foreground',
-          variantClasses[variant],
-          girthClasses[girth],
-          error && 'border-2 border-danger-500',
-          props.editable === false && 'opacity-60',
-          className,
-        )}
-        {...props}
-      />
-    );
-  },
-);
-
-export interface InputWithExtrasProps extends InputProps {
-  before?: React.ReactNode;
-  after?: React.ReactNode;
-  containerClassName?: string;
-}
-
-export const InputWithExtras = React.forwardRef<TextInput, InputWithExtrasProps>(
-  ({ before, after, containerClassName, variant = 'default', girth = 'md', error, className, ...props }, ref) => {
-    const innerRef = useRef<TextInput>(null);
-    const inputRef = (ref as React.RefObject<TextInput>) ?? innerRef;
-
-    return (
-      <Pressable onPress={() => inputRef.current?.focus()}>
-        <View
-          className={cn(
-            'flex-row items-center gap-1',
-            variantClasses[variant],
-            girthClasses[girth],
-            'rounded-xl px-4',
-            error && 'border-2 border-danger-500',
-            containerClassName,
-          )}
-        >
-          {before}
-          <Input
-            ref={inputRef}
-            variant="ghost"
-            girth={girth}
-            className={cn('flex-1 h-full px-0', className)}
-            {...props}
-          />
-          {after}
-        </View>
-      </Pressable>
-    );
-  },
-);
-
-export interface InputWithLabelProps extends InputProps {
-  label?: string;
-  description?: string;
-  errorMessage?: string;
-  containerClassName?: string;
-}
-
-export const InputWithLabel = React.forwardRef<TextInput, InputWithLabelProps>(
-  ({ label, description, errorMessage, containerClassName, error, ...props }, ref) => {
-    const hasError = error || !!errorMessage;
-
-    return (
-      <View className={cn('gap-1 w-full', containerClassName)}>
-        {label && (
-          <Text size="sm" weight="semibold" className="text-foreground">
-            {label}
-          </Text>
-        )}
-        <Input ref={ref} error={hasError} {...props} />
-        {description && !errorMessage && (
-          <Text size="xs" className="text-foreground-label">
-            {description}
-          </Text>
-        )}
-        {errorMessage && (
-          <Text size="xs" weight="semibold" className="text-danger-700">
-            {errorMessage}
-          </Text>
-        )}
-      </View>
-    );
-  },
-);

package/src/components/Label.tsx

@@ -1,16 +0,0 @@
-import React from 'react';
-import { Text as RNText, type TextProps } from 'react-native';
-import { cn } from '../utils/cn';
-
-export interface LabelProps extends TextProps {
-  className?: string;
-}
-
-export function Label({ className, ...props }: LabelProps) {
-  return (
-    <RNText
-      className={cn('text-sm font-semibold text-foreground', className)}
-      {...props}
-    />
-  );
-}

package/src/components/ProgressBar.tsx

@@ -1,32 +0,0 @@
-import React from 'react';
-import { View, type ViewProps } from 'react-native';
-import { cn } from '../utils/cn';
-
-export interface ProgressBarProps extends ViewProps {
-  value: number;
-  max?: number;
-  className?: string;
-}
-
-export function ProgressBar({
-  value,
-  max = 100,
-  className,
-  ...props
-}: ProgressBarProps) {
-  const percentage = Math.min(100, Math.max(0, (value / max) * 100));
-
-  return (
-    <View
-      className={cn('h-2 w-full rounded-full bg-background-tertiary', className)}
-      accessibilityRole="progressbar"
-      accessibilityValue={{ min: 0, max, now: value }}
-      {...props}
-    >
-      <View
-        className="h-full rounded-full bg-brand-500"
-        style={{ width: `${percentage}%` }}
-      />
-    </View>
-  );
-}

package/src/components/Separator.tsx

@@ -1,25 +0,0 @@
-import React from 'react';
-import { View, type ViewProps } from 'react-native';
-import { cn } from '../utils/cn';
-
-export interface SeparatorProps extends ViewProps {
-  orientation?: 'horizontal' | 'vertical';
-  className?: string;
-}
-
-export function Separator({
-  orientation = 'horizontal',
-  className,
-  ...props
-}: SeparatorProps) {
-  return (
-    <View
-      className={cn(
-        'bg-border',
-        orientation === 'horizontal' ? 'h-px w-full' : 'w-px h-full',
-        className,
-      )}
-      {...props}
-    />
-  );
-}

package/src/components/Skeleton.tsx

@@ -1,38 +0,0 @@
-import React, { useEffect, useRef } from 'react';
-import { Animated, View, type ViewProps } from 'react-native';
-import { cn } from '../utils/cn';
-
-export interface SkeletonProps extends ViewProps {
-  className?: string;
-}
-
-export function Skeleton({ className, style, ...props }: SkeletonProps) {
-  const opacity = useRef(new Animated.Value(1)).current;
-
-  useEffect(() => {
-    const animation = Animated.loop(
-      Animated.sequence([
-        Animated.timing(opacity, {
-          toValue: 0.5,
-          duration: 1000,
-          useNativeDriver: true,
-        }),
-        Animated.timing(opacity, {
-          toValue: 1,
-          duration: 1000,
-          useNativeDriver: true,
-        }),
-      ]),
-    );
-    animation.start();
-    return () => animation.stop();
-  }, [opacity]);
-
-  return (
-    <Animated.View
-      className={cn('rounded-md bg-background-tertiary', className)}
-      style={[{ opacity }, style]}
-      {...props}
-    />
-  );
-}

package/src/components/Switch.tsx

@@ -1,32 +0,0 @@
-import React from 'react';
-import {
-  Switch as RNSwitch,
-  type SwitchProps as RNSwitchProps,
-} from 'react-native';
-import { palettes } from '../theming/color-palettes';
-
-export interface SwitchProps extends RNSwitchProps {
-  checked?: boolean;
-  onCheckedChange?: (value: boolean) => void;
-}
-
-export function Switch({
-  checked,
-  onCheckedChange,
-  value,
-  onValueChange,
-  ...props
-}: SwitchProps) {
-  return (
-    <RNSwitch
-      value={checked ?? value}
-      onValueChange={onCheckedChange ?? onValueChange}
-      trackColor={{
-        false: palettes.neutral[300],
-        true: palettes.purple[500],
-      }}
-      thumbColor={palettes.white}
-      {...props}
-    />
-  );
-}

package/src/components/Text.tsx

@@ -1,57 +0,0 @@
-import React from 'react';
-import { Text as RNText, type TextProps as RNTextProps } from 'react-native';
-import { cn } from '../utils/cn';
-
-export type TextVariant = 'body' | 'caption' | 'label' | 'heading';
-export type TextSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
-export type TextWeight = 'normal' | 'medium' | 'semibold' | 'bold';
-
-const variantClasses: Record<TextVariant, string> = {
-  body: 'text-base text-foreground',
-  caption: 'text-xs text-foreground-label',
-  label: 'text-sm text-foreground-label',
-  heading: 'text-lg font-bold text-foreground-heading',
-};
-
-const sizeClasses: Record<TextSize, string> = {
-  xs: 'text-xs',
-  sm: 'text-sm',
-  md: 'text-base',
-  lg: 'text-lg',
-  xl: 'text-xl',
-  '2xl': 'text-2xl',
-};
-
-const weightClasses: Record<TextWeight, string> = {
-  normal: 'font-normal',
-  medium: 'font-medium',
-  semibold: 'font-semibold',
-  bold: 'font-bold',
-};
-
-export interface TextProps extends RNTextProps {
-  variant?: TextVariant;
-  size?: TextSize;
-  weight?: TextWeight;
-  className?: string;
-}
-
-export function Text({
-  variant = 'body',
-  size,
-  weight,
-  className,
-  ...props
-}: TextProps) {
-  return (
-    <RNText
-      className={cn(
-        variantClasses[variant],
-        size && sizeClasses[size],
-        weight && weightClasses[weight],
-        className,
-      )}
-      {...props}
-    />
-  );
-}

package/src/index.ts

@@ -1,52 +0,0 @@
-// Components
-export { Text } from './components/Text';
-export type { TextProps, TextVariant, TextSize, TextWeight } from './components/Text';
-
-export { Badge } from './components/Badge';
-export type { BadgeProps, BadgeVariant } from './components/Badge';
-
-export { Button } from './components/Button';
-export type { ButtonProps, ButtonVariant, ButtonSize } from './components/Button';
-
-export { Input, InputWithExtras, InputWithLabel } from './components/Input';
-export type { InputProps, InputWithExtrasProps, InputWithLabelProps, InputVariant, InputGirth } from './components/Input';
-
-export { Card } from './components/Card';
-export type { CardProps, CardVariant } from './components/Card';
-
-export { Banner } from './components/Banner';
-export type { BannerProps, BannerVariant } from './components/Banner';
-
-export { Separator } from './components/Separator';
-export type { SeparatorProps } from './components/Separator';
-
-export { Skeleton } from './components/Skeleton';
-export type { SkeletonProps } from './components/Skeleton';
-
-export { ProgressBar } from './components/ProgressBar';
-export type { ProgressBarProps } from './components/ProgressBar';
-
-export { Chip } from './components/Chip';
-export type { ChipProps } from './components/Chip';
-
-export { EmptyState } from './components/EmptyState';
-export type { EmptyStateProps } from './components/EmptyState';
-
-export { Avatar } from './components/Avatar';
-export type { AvatarProps, AvatarSize } from './components/Avatar';
-
-export { Switch } from './components/Switch';
-export type { SwitchProps } from './components/Switch';
-
-export { Checkbox } from './components/Checkbox';
-export type { CheckboxProps } from './components/Checkbox';
-
-export { Label } from './components/Label';
-export type { LabelProps } from './components/Label';
-
-// Utilities
-export { cn } from './utils/cn';
-
-// Theming
-export { palettes } from './theming/color-palettes';
-export type { SprinklesTheme, SprinklesColorPalette, Tone } from './theming/types';

package/src/theming/color-palettes.ts

@@ -1,81 +0,0 @@
-export const palettes = {
-  white: '#ffffff',
-  neutral: {
-    25: '#fcfcff',
-    50: '#f8f9ff',
-    100: '#f1f5f9',
-    200: '#e2e8f0',
-    300: '#cbd5e1',
-    400: '#a9b6c9',
-    500: '#64748b',
-    600: '#475569',
-    700: '#334155',
-    800: '#1e293b',
-    900: '#0f172a',
-  },
-  purple: {
-    25: '#f0f1fd',
-    50: '#dddff9',
-    100: '#c1c4ee',
-    200: '#a2a6e5',
-    300: '#8388dd',
-    400: '#646bd4',
-    500: '#454dcc',
-    600: '#3a40aa',
-    700: '#2e3388',
-    800: '#232766',
-    900: '#171a44',
-  },
-  magenta: {
-    25: '#ffe7f1',
-    50: '#fbd5e5',
-    100: '#f9b9d4',
-    200: '#f696be',
-    300: '#f374a9',
-    400: '#f05193',
-    500: '#ef3f89',
-    600: '#cf4880',
-    700: '#a1285b',
-    800: '#791e44',
-    900: '#51142d',
-  },
-  emerald: {
-    25: '#e4f9f2',
-    50: '#d3f4e9',
-    100: '#b5ecda',
-    200: '#90e2c7',
-    300: '#6bd9b4',
-    400: '#46d0a2',
-    500: '#21c68f',
-    600: '#1ca577',
-    700: '#16845f',
-    800: '#106347',
-    900: '#0b4230',
-  },
-  amber: {
-    25: '#fff7eb',
-    50: '#fef1db',
-    100: '#fee7c2',
-    200: '#ffe1b1',
-    300: '#ffd797',
-    400: '#ffcd7d',
-    500: '#ffc363',
-    600: '#D29D49',
-    700: '#806131',
-    800: '#6C4B15',
-    900: '#554121',
-  },
-  blue: {
-    25: '#ebf2ff',
-    50: '#d8e6fd',
-    100: '#bed5fc',
-    200: '#9dc0fb',
-    300: '#7cacf9',
-    400: '#5c97f8',
-    500: '#3b82f6',
-    600: '#316ccd',
-    700: '#2757a4',
-    800: '#1d417b',
-    900: '#142b52',
-  },
-};

package/src/theming/types.ts

@@ -1,82 +0,0 @@
-export interface SprinklesColorPalette {
-  DEFAULT: string;
-  background: {
-    DEFAULT: string;
-    hover: string;
-    alt: string;
-  };
-  foreground: {
-    DEFAULT: string;
-    heading: string;
-    label: string;
-    inverted: string;
-  };
-  outline: string;
-}
-
-export interface SprinklesTheme {
-  background: {
-    DEFAULT: string;
-    secondary: string;
-    tertiary: string;
-    quaternary: string;
-  };
-  foreground: {
-    DEFAULT: string;
-    heading: string;
-    label: string;
-  };
-  border: {
-    DEFAULT: string;
-    alt: string;
-    secondary: string;
-    tertiary: string;
-  };
-  popover: {
-    DEFAULT: string;
-    foreground: string;
-  };
-  tooltip: {
-    DEFAULT: string;
-    foreground: string;
-  };
-  toast: {
-    DEFAULT: string;
-    foreground: string;
-    danger: {
-      DEFAULT: string;
-      foreground: string;
-    };
-  };
-  actionbar: {
-    DEFAULT: string;
-    foreground: string;
-  };
-  dialog: {
-    DEFAULT: string;
-    foreground: string;
-    backdrop: string;
-  };
-  ring: string;
-  shadow: string;
-  outline: string;
-  accent: {
-    DEFAULT: string;
-    foreground: string;
-  };
-  primary: SprinklesColorPalette;
-  brand: SprinklesColorPalette;
-  success: SprinklesColorPalette;
-  info: SprinklesColorPalette;
-  warn: SprinklesColorPalette;
-  danger: SprinklesColorPalette;
-  stock: {
-    available: string;
-    substitution: string;
-    unavailable: string;
-    unknown: string;
-  };
-}
-
-export const TONES = [25, 50, 100, 200, 300, 400, 500, 600, 700, 800, 900] as const;
-export type Tone = (typeof TONES)[number];

package/src/types/react-native.d.ts

@@ -1,31 +0,0 @@
-/**
- * Augment React Native component props with className support.
- * At build time, uniwind resolves className to style objects via its metro plugin.
- * This declaration ensures TypeScript accepts className on RN primitives
- * even when building this library without a metro/uniwind context.
- */
-import 'react-native';
-
-declare module 'react-native' {
-  interface ViewProps {
-    className?: string;
-  }
-  interface TextProps {
-    className?: string;
-  }
-  interface TextInputProps {
-    className?: string;
-  }
-  interface PressableProps {
-    className?: string | ((state: { pressed: boolean }) => string);
-  }
-  interface ImageProps {
-    className?: string;
-  }
-  interface ScrollViewProps {
-    className?: string;
-  }
-  interface FlatListProps<ItemT> {
-    className?: string;
-  }
-}

package/src/utils/cn.ts

@@ -1,6 +0,0 @@
-import { clsx, type ClassValue } from 'clsx';
-import { twMerge } from 'tailwind-merge';
-
-export function cn(...inputs: ClassValue[]) {
-  return twMerge(clsx(inputs));
-}

package/src/utils/index.ts

@@ -1 +0,0 @@
-export { cn } from './cn';