@wireservers-ui/react-natives 1.0.0 → 1.0.1-rc1

package/src/portal/styles.ts

@@ -1,2 +1,2 @@
-// Portal has no visual styles
-export {};
+// Portal has no visual styles
+export {};

package/src/portal/types.ts

@@ -1,3 +1,3 @@
-export interface PortalProps {
-  children: React.ReactNode;
-}
+export interface PortalProps {
+  children: React.ReactNode;
+}

package/src/pressable/index.ts

@@ -1,2 +1,2 @@
-export { Pressable } from './pressable';
-export type { PressableProps } from './types';
+export { Pressable } from './pressable';
+export type { PressableProps } from './types';

package/src/pressable/pressable.tsx

@@ -1,20 +1,20 @@
-import React from 'react';
-import { Pressable as RNPressable } from 'react-native';
-import type { PressableProps } from './types';
-import { pressableStyle } from './styles';
-
-export const Pressable = React.forwardRef<
-  React.ElementRef<typeof RNPressable>,
-  PressableProps
->(({ className, disabled, ...props }, ref) => {
-  return (
-    <RNPressable
-      ref={ref}
-      disabled={disabled}
-      className={pressableStyle({ isDisabled: !!disabled, class: className })}
-      {...props}
-    />
-  );
-});
-
-Pressable.displayName = 'Pressable';
+import React from 'react';
+import { Pressable as RNPressable } from 'react-native';
+import type { PressableProps } from './types';
+import { pressableStyle } from './styles';
+
+export const Pressable = React.forwardRef<
+  React.ElementRef<typeof RNPressable>,
+  PressableProps
+>(({ className, disabled, ...props }, ref) => {
+  return (
+    <RNPressable
+      ref={ref}
+      disabled={disabled}
+      className={pressableStyle({ isDisabled: !!disabled, class: className })}
+      {...props}
+    />
+  );
+});
+
+Pressable.displayName = 'Pressable';

package/src/pressable/styles.ts

@@ -1,10 +1,10 @@
-import { tv } from 'tailwind-variants';
-
-export const pressableStyle = tv({
-  base: 'self-start',
-  variants: {
-    isDisabled: {
-      true: 'opacity-50',
-    },
-  },
-});
+import { tv } from 'tailwind-variants';
+
+export const pressableStyle = tv({
+  base: 'self-start',
+  variants: {
+    isDisabled: {
+      true: 'opacity-50',
+    },
+  },
+});

package/src/pressable/types.ts

@@ -1,6 +1,6 @@
-import type { Pressable as RNPressable } from 'react-native';
-
-export interface PressableProps
-  extends React.ComponentPropsWithoutRef<typeof RNPressable> {
-  className?: string;
-}
+import type { Pressable as RNPressable } from 'react-native';
+
+export interface PressableProps
+  extends React.ComponentPropsWithoutRef<typeof RNPressable> {
+  className?: string;
+}

package/src/progress/index.ts

@@ -1,9 +1,9 @@
-export { Progress } from './progress';
-export { ProgressFilledTrack } from './progress-filled-track';
-
-export type {
-  ProgressProps,
-  ProgressFilledTrackProps,
-  ProgressSize,
-  ProgressContextValue,
-} from './types';
+export { Progress } from './progress';
+export { ProgressFilledTrack } from './progress-filled-track';
+
+export type {
+  ProgressProps,
+  ProgressFilledTrackProps,
+  ProgressSize,
+  ProgressContextValue,
+} from './types';

package/src/progress/progress-filled-track.tsx

@@ -1,26 +1,26 @@
-import React from 'react';
-import { View } from 'react-native';
-import { useProgressContext } from './progress';
-import type { ProgressFilledTrackProps } from './types';
-import { progressFilledTrackStyle } from './styles';
-
-export const ProgressFilledTrack = React.forwardRef<
-  React.ElementRef<typeof View>,
-  ProgressFilledTrackProps
->(({ className, ...props }, ref) => {
-  const { colorScheme, percentage } = useProgressContext();
-
-  return (
-    <View
-      ref={ref}
-      className={progressFilledTrackStyle({
-        colorScheme,
-        class: className,
-      })}
-      style={{ width: `${percentage}%` }}
-      {...props}
-    />
-  );
-});
-
-ProgressFilledTrack.displayName = 'ProgressFilledTrack';
+import React from 'react';
+import { View } from 'react-native';
+import { useProgressContext } from './progress';
+import type { ProgressFilledTrackProps } from './types';
+import { progressFilledTrackStyle } from './styles';
+
+export const ProgressFilledTrack = React.forwardRef<
+  React.ElementRef<typeof View>,
+  ProgressFilledTrackProps
+>(({ className, ...props }, ref) => {
+  const { colorScheme, percentage } = useProgressContext();
+
+  return (
+    <View
+      ref={ref}
+      className={progressFilledTrackStyle({
+        colorScheme,
+        class: className,
+      })}
+      style={{ width: `${percentage}%` }}
+      {...props}
+    />
+  );
+});
+
+ProgressFilledTrack.displayName = 'ProgressFilledTrack';

package/src/progress/progress.tsx

@@ -1,52 +1,52 @@
-import React, { useMemo } from 'react';
-import { View } from 'react-native';
-import { createComponentContext } from '../utils/create-context';
-import type { ProgressProps, ProgressContextValue } from './types';
-import { progressStyle } from './styles';
-
-export const [ProgressProvider, useProgressContext] =
-  createComponentContext<ProgressContextValue>('Progress');
-
-export const Progress = React.forwardRef<
-  React.ElementRef<typeof View>,
-  ProgressProps
->(
-  (
-    {
-      className,
-      value = 0,
-      min = 0,
-      max = 100,
-      size = 'md',
-      colorScheme = 'primary',
-      children,
-      ...props
-    },
-    ref,
-  ) => {
-    const percentage = useMemo(() => {
-      const clamped = Math.min(Math.max(value, min), max);
-      return ((clamped - min) / (max - min)) * 100;
-    }, [value, min, max]);
-
-    return (
-      <ProgressProvider
-        value={{ value, min, max, size, colorScheme, percentage }}
-      >
-        <View
-          ref={ref}
-          role="progressbar"
-          aria-valuemin={min}
-          aria-valuemax={max}
-          aria-valuenow={value}
-          className={progressStyle({ size, class: className })}
-          {...props}
-        >
-          {children}
-        </View>
-      </ProgressProvider>
-    );
-  },
-);
-
-Progress.displayName = 'Progress';
+import React, { useMemo } from 'react';
+import { View } from 'react-native';
+import { createComponentContext } from '../utils/create-context';
+import type { ProgressProps, ProgressContextValue } from './types';
+import { progressStyle } from './styles';
+
+export const [ProgressProvider, useProgressContext] =
+  createComponentContext<ProgressContextValue>('Progress');
+
+export const Progress = React.forwardRef<
+  React.ElementRef<typeof View>,
+  ProgressProps
+>(
+  (
+    {
+      className,
+      value = 0,
+      min = 0,
+      max = 100,
+      size = 'md',
+      colorScheme = 'primary',
+      children,
+      ...props
+    },
+    ref,
+  ) => {
+    const percentage = useMemo(() => {
+      const clamped = Math.min(Math.max(value, min), max);
+      return ((clamped - min) / (max - min)) * 100;
+    }, [value, min, max]);
+
+    return (
+      <ProgressProvider
+        value={{ value, min, max, size, colorScheme, percentage }}
+      >
+        <View
+          ref={ref}
+          role="progressbar"
+          aria-valuemin={min}
+          aria-valuemax={max}
+          aria-valuenow={value}
+          className={progressStyle({ size, class: className })}
+          {...props}
+        >
+          {children}
+        </View>
+      </ProgressProvider>
+    );
+  },
+);
+
+Progress.displayName = 'Progress';

package/src/progress/styles.ts

@@ -1,34 +1,34 @@
-import { tv } from 'tailwind-variants';
-
-export const progressStyle = tv({
-  base: 'w-full bg-background-200 rounded-full overflow-hidden',
-  variants: {
-    size: {
-      xs: 'h-1',
-      sm: 'h-1.5',
-      md: 'h-2',
-      lg: 'h-3',
-    },
-  },
-  defaultVariants: {
-    size: 'md',
-  },
-});
-
-export const progressFilledTrackStyle = tv({
-  base: 'h-full rounded-full',
-  variants: {
-    colorScheme: {
-      primary: 'bg-primary-500',
-      secondary: 'bg-secondary-500',
-      tertiary: 'bg-tertiary-500',
-      error: 'bg-error-500',
-      success: 'bg-success-500',
-      warning: 'bg-warning-500',
-      info: 'bg-info-500',
-    },
-  },
-  defaultVariants: {
-    colorScheme: 'primary',
-  },
-});
+import { tv } from 'tailwind-variants';
+
+export const progressStyle = tv({
+  base: 'w-full bg-background-200 rounded-full overflow-hidden',
+  variants: {
+    size: {
+      xs: 'h-1',
+      sm: 'h-1.5',
+      md: 'h-2',
+      lg: 'h-3',
+    },
+  },
+  defaultVariants: {
+    size: 'md',
+  },
+});
+
+export const progressFilledTrackStyle = tv({
+  base: 'h-full rounded-full',
+  variants: {
+    colorScheme: {
+      primary: 'bg-primary-500',
+      secondary: 'bg-secondary-500',
+      tertiary: 'bg-tertiary-500',
+      error: 'bg-error-500',
+      success: 'bg-success-500',
+      warning: 'bg-warning-500',
+      info: 'bg-info-500',
+    },
+  },
+  defaultVariants: {
+    colorScheme: 'primary',
+  },
+});

package/src/progress/types.ts

@@ -1,28 +1,28 @@
-import type { View } from 'react-native';
-import type { SemanticColor } from '../utils/types';
-
-export type ProgressSize = 'xs' | 'sm' | 'md' | 'lg';
-
-export interface ProgressContextValue {
-  value: number;
-  min: number;
-  max: number;
-  size: ProgressSize;
-  colorScheme: SemanticColor;
-  percentage: number;
-}
-
-export interface ProgressProps
-  extends React.ComponentPropsWithoutRef<typeof View> {
-  className?: string;
-  value?: number;
-  min?: number;
-  max?: number;
-  size?: ProgressSize;
-  colorScheme?: SemanticColor;
-}
-
-export interface ProgressFilledTrackProps
-  extends React.ComponentPropsWithoutRef<typeof View> {
-  className?: string;
-}
+import type { View } from 'react-native';
+import type { SemanticColor } from '../utils/types';
+
+export type ProgressSize = 'xs' | 'sm' | 'md' | 'lg';
+
+export interface ProgressContextValue {
+  value: number;
+  min: number;
+  max: number;
+  size: ProgressSize;
+  colorScheme: SemanticColor;
+  percentage: number;
+}
+
+export interface ProgressProps
+  extends React.ComponentPropsWithoutRef<typeof View> {
+  className?: string;
+  value?: number;
+  min?: number;
+  max?: number;
+  size?: ProgressSize;
+  colorScheme?: SemanticColor;
+}
+
+export interface ProgressFilledTrackProps
+  extends React.ComponentPropsWithoutRef<typeof View> {
+  className?: string;
+}

package/src/radio/index.ts

@@ -1,14 +1,14 @@
-export { RadioGroup } from './radio-group';
-export { Radio } from './radio';
-export { RadioIndicator } from './radio-indicator';
-export { RadioIcon } from './radio-icon';
-export { RadioLabel } from './radio-label';
-export type {
-  RadioGroupProps,
-  RadioGroupContextValue,
-  RadioProps,
-  RadioContextValue,
-  RadioIndicatorProps,
-  RadioIconProps,
-  RadioLabelProps,
-} from './types';
+export { RadioGroup } from './radio-group';
+export { Radio } from './radio';
+export { RadioIndicator } from './radio-indicator';
+export { RadioIcon } from './radio-icon';
+export { RadioLabel } from './radio-label';
+export type {
+  RadioGroupProps,
+  RadioGroupContextValue,
+  RadioProps,
+  RadioContextValue,
+  RadioIndicatorProps,
+  RadioIconProps,
+  RadioLabelProps,
+} from './types';

package/src/radio/radio-group.tsx

@@ -1,61 +1,61 @@
-import React, { createContext, useContext, useState } from 'react';
-import { View } from 'react-native';
-import type { RadioGroupProps, RadioGroupContextValue } from './types';
-import { radioGroupStyle } from './styles';
-
-export const RadioGroupContext =
-  createContext<RadioGroupContextValue | null>(null);
-
-export function useRadioGroupContext(): RadioGroupContextValue | null {
-  return useContext(RadioGroupContext);
-}
-
-export const RadioGroup = React.forwardRef<
-  React.ElementRef<typeof View>,
-  RadioGroupProps
->(
-  (
-    {
-      className,
-      value: valueProp,
-      defaultValue = undefined,
-      onChange,
-      isDisabled,
-      isInvalid,
-      size = 'md',
-      children,
-      ...props
-    },
-    ref,
-  ) => {
-    const [internalValue, setInternalValue] = useState<string | null>(
-      defaultValue ?? null,
-    );
-    const isControlled = valueProp !== undefined;
-    const value = isControlled ? valueProp : internalValue;
-
-    const handleChange = (radioValue: string) => {
-      if (!isControlled) {
-        setInternalValue(radioValue);
-      }
-      onChange?.(radioValue);
-    };
-
-    return (
-      <RadioGroupContext.Provider
-        value={{ value, onChange: handleChange, isDisabled, isInvalid, size }}
-      >
-        <View
-          ref={ref}
-          role="radiogroup"
-          className={radioGroupStyle({ class: className })}
-          {...props}
-        >
-          {children}
-        </View>
-      </RadioGroupContext.Provider>
-    );
-  },
-);
-
-RadioGroup.displayName = 'RadioGroup';
+import React, { createContext, useContext, useState } from 'react';
+import { View } from 'react-native';
+import type { RadioGroupProps, RadioGroupContextValue } from './types';
+import { radioGroupStyle } from './styles';
+
+export const RadioGroupContext =
+  createContext<RadioGroupContextValue | null>(null);
+
+export function useRadioGroupContext(): RadioGroupContextValue | null {
+  return useContext(RadioGroupContext);
+}
+
+export const RadioGroup = React.forwardRef<
+  React.ElementRef<typeof View>,
+  RadioGroupProps
+>(
+  (
+    {
+      className,
+      value: valueProp,
+      defaultValue = undefined,
+      onChange,
+      isDisabled,
+      isInvalid,
+      size = 'md',
+      children,
+      ...props
+    },
+    ref,
+  ) => {
+    const [internalValue, setInternalValue] = useState<string | null>(
+      defaultValue ?? null,
+    );
+    const isControlled = valueProp !== undefined;
+    const value = isControlled ? valueProp : internalValue;
+
+    const handleChange = (radioValue: string) => {
+      if (!isControlled) {
+        setInternalValue(radioValue);
+      }
+      onChange?.(radioValue);
+    };
+
+    return (
+      <RadioGroupContext.Provider
+        value={{ value, onChange: handleChange, isDisabled, isInvalid, size }}
+      >
+        <View
+          ref={ref}
+          role="radiogroup"
+          className={radioGroupStyle({ class: className })}
+          {...props}
+        >
+          {children}
+        </View>
+      </RadioGroupContext.Provider>
+    );
+  },
+);
+
+RadioGroup.displayName = 'RadioGroup';

package/src/radio/radio-icon.tsx

@@ -1,24 +1,24 @@
-import React from 'react';
-import { View } from 'react-native';
-import { useRadioContext } from './radio';
-import type { RadioIconProps } from './types';
-import { radioIconStyle } from './styles';
-
-export const RadioIcon = React.forwardRef<
-  React.ElementRef<typeof View>,
-  RadioIconProps
->(({ className, ...props }, ref) => {
-  const { isSelected, size } = useRadioContext();
-
-  if (!isSelected) return null;
-
-  return (
-    <View
-      ref={ref}
-      className={radioIconStyle({ size, class: className })}
-      {...props}
-    />
-  );
-});
-
-RadioIcon.displayName = 'RadioIcon';
+import React from 'react';
+import { View } from 'react-native';
+import { useRadioContext } from './radio';
+import type { RadioIconProps } from './types';
+import { radioIconStyle } from './styles';
+
+export const RadioIcon = React.forwardRef<
+  React.ElementRef<typeof View>,
+  RadioIconProps
+>(({ className, ...props }, ref) => {
+  const { isSelected, size } = useRadioContext();
+
+  if (!isSelected) return null;
+
+  return (
+    <View
+      ref={ref}
+      className={radioIconStyle({ size, class: className })}
+      {...props}
+    />
+  );
+});
+
+RadioIcon.displayName = 'RadioIcon';

package/src/radio/radio-indicator.tsx

@@ -1,30 +1,30 @@
-import React from 'react';
-import { View } from 'react-native';
-import { useRadioContext } from './radio';
-import type { RadioIndicatorProps } from './types';
-import { radioIndicatorStyle } from './styles';
-
-export const RadioIndicator = React.forwardRef<
-  React.ElementRef<typeof View>,
-  RadioIndicatorProps
->(({ className, children, ...props }, ref) => {
-  const { isSelected, isDisabled, isInvalid, size } = useRadioContext();
-
-  return (
-    <View
-      ref={ref}
-      className={radioIndicatorStyle({
-        size,
-        isSelected,
-        isInvalid,
-        isDisabled,
-        class: className,
-      })}
-      {...props}
-    >
-      {children}
-    </View>
-  );
-});
-
-RadioIndicator.displayName = 'RadioIndicator';
+import React from 'react';
+import { View } from 'react-native';
+import { useRadioContext } from './radio';
+import type { RadioIndicatorProps } from './types';
+import { radioIndicatorStyle } from './styles';
+
+export const RadioIndicator = React.forwardRef<
+  React.ElementRef<typeof View>,
+  RadioIndicatorProps
+>(({ className, children, ...props }, ref) => {
+  const { isSelected, isDisabled, isInvalid, size } = useRadioContext();
+
+  return (
+    <View
+      ref={ref}
+      className={radioIndicatorStyle({
+        size,
+        isSelected,
+        isInvalid,
+        isDisabled,
+        class: className,
+      })}
+      {...props}
+    >
+      {children}
+    </View>
+  );
+});
+
+RadioIndicator.displayName = 'RadioIndicator';