@wireservers-ui/react-natives 2.0.0 → 2.0.2-rc.0

package/src/tag/tag-close-button.tsx

@@ -1,26 +1,26 @@
-import React from 'react';
-import { Pressable, Text } from 'react-native';
-import { useTagContext } from './tag';
-import type { TagCloseButtonProps } from './types';
-import { tagCloseButtonStyle } from './styles';
-
-export const TagCloseButton = React.forwardRef<any, TagCloseButtonProps>(
-  ({ className, onPress, ...props }, ref) => {
-    const { size } = useTagContext();
-
-    return (
-      <Pressable
-        ref={ref}
-        onPress={onPress}
-        className={tagCloseButtonStyle({ size, class: className })}
-        accessibilityRole="button"
-        accessibilityLabel="Remove"
-        {...props}
-      >
-        <Text style={{ fontSize: 10, lineHeight: 12 }}>&#x2715;</Text>
-      </Pressable>
-    );
-  },
-);
-
-TagCloseButton.displayName = 'TagCloseButton';
+import React from 'react';
+import { Pressable, Text } from 'react-native';
+import { useTagContext } from './tag';
+import type { TagCloseButtonProps } from './types';
+import { tagCloseButtonStyle } from './styles';
+
+export const TagCloseButton = React.forwardRef<any, TagCloseButtonProps>(
+  ({ className, onPress, ...props }, ref) => {
+    const { size } = useTagContext();
+
+    return (
+      <Pressable
+        ref={ref}
+        onPress={onPress}
+        className={tagCloseButtonStyle({ size, class: className })}
+        accessibilityRole="button"
+        accessibilityLabel="Remove"
+        {...props}
+      >
+        <Text style={{ fontSize: 10, lineHeight: 12 }}>&#x2715;</Text>
+      </Pressable>
+    );
+  },
+);
+
+TagCloseButton.displayName = 'TagCloseButton';

package/src/tag/tag-icon.tsx

@@ -1,20 +1,20 @@
-import React from 'react';
-import { useTagContext } from './tag';
-import type { TagIconProps } from './types';
-import { tagIconStyle } from './styles';
-
-export const TagIcon = React.forwardRef<any, TagIconProps>(
-  ({ as: AsComp, className, ...props }, ref) => {
-    const { size } = useTagContext();
-
-    return (
-      <AsComp
-        ref={ref}
-        className={tagIconStyle({ size, class: className })}
-        {...props}
-      />
-    );
-  },
-);
-
-TagIcon.displayName = 'TagIcon';
+import React from 'react';
+import { useTagContext } from './tag';
+import type { TagIconProps } from './types';
+import { tagIconStyle } from './styles';
+
+export const TagIcon = React.forwardRef<any, TagIconProps>(
+  ({ as: AsComp, className, ...props }, ref) => {
+    const { size } = useTagContext();
+
+    return (
+      <AsComp
+        ref={ref}
+        className={tagIconStyle({ size, class: className })}
+        {...props}
+      />
+    );
+  },
+);
+
+TagIcon.displayName = 'TagIcon';

package/src/tag/tag-text.tsx

@@ -1,22 +1,22 @@
-import React from 'react';
-import { Text } from 'react-native';
-import { useTagContext } from './tag';
-import type { TagTextProps } from './types';
-import { tagTextStyle } from './styles';
-
-export const TagText = React.forwardRef<
-  React.ElementRef<typeof Text>,
-  TagTextProps
->(({ className, ...props }, ref) => {
-  const { action, variant, size } = useTagContext();
-
-  return (
-    <Text
-      ref={ref}
-      className={tagTextStyle({ action, variant, size, class: className })}
-      {...props}
-    />
-  );
-});
-
-TagText.displayName = 'TagText';
+import React from 'react';
+import { Text } from 'react-native';
+import { useTagContext } from './tag';
+import type { TagTextProps } from './types';
+import { tagTextStyle } from './styles';
+
+export const TagText = React.forwardRef<
+  React.ElementRef<typeof Text>,
+  TagTextProps
+>(({ className, ...props }, ref) => {
+  const { action, variant, size } = useTagContext();
+
+  return (
+    <Text
+      ref={ref}
+      className={tagTextStyle({ action, variant, size, class: className })}
+      {...props}
+    />
+  );
+});
+
+TagText.displayName = 'TagText';

package/src/tag/tag.tsx

@@ -1,40 +1,40 @@
-import React from 'react';
-import { View } from 'react-native';
-import { createComponentContext } from '../utils/create-context';
-import type { TagProps, TagContextValue } from './types';
-import { tagStyle } from './styles';
-
-export const [TagProvider, useTagContext] =
-  createComponentContext<TagContextValue>('Tag');
-
-export const Tag = React.forwardRef<
-  React.ElementRef<typeof View>,
-  TagProps
->(
-  (
-    {
-      action = 'info',
-      variant = 'subtle',
-      size = 'md',
-      isDisabled,
-      className,
-      children,
-      ...props
-    },
-    ref,
-  ) => {
-    return (
-      <TagProvider value={{ action, variant, size }}>
-        <View
-          ref={ref}
-          className={tagStyle({ action, variant, size, isDisabled, class: className })}
-          {...props}
-        >
-          {children}
-        </View>
-      </TagProvider>
-    );
-  },
-);
-
-Tag.displayName = 'Tag';
+import React from 'react';
+import { View } from 'react-native';
+import { createComponentContext } from '../utils/create-context';
+import type { TagProps, TagContextValue } from './types';
+import { tagStyle } from './styles';
+
+export const [TagProvider, useTagContext] =
+  createComponentContext<TagContextValue>('Tag');
+
+export const Tag = React.forwardRef<
+  React.ElementRef<typeof View>,
+  TagProps
+>(
+  (
+    {
+      action = 'info',
+      variant = 'subtle',
+      size = 'md',
+      isDisabled,
+      className,
+      children,
+      ...props
+    },
+    ref,
+  ) => {
+    return (
+      <TagProvider value={{ action, variant, size }}>
+        <View
+          ref={ref}
+          className={tagStyle({ action, variant, size, isDisabled, class: className })}
+          {...props}
+        >
+          {children}
+        </View>
+      </TagProvider>
+    );
+  },
+);
+
+Tag.displayName = 'Tag';

package/src/tag/types.ts

@@ -1,33 +1,33 @@
-import type { View, Text as RNText } from 'react-native';
-
-export type TagAction = 'primary' | 'secondary' | 'error' | 'success' | 'warning' | 'info' | 'muted';
-export type TagVariant = 'solid' | 'outline' | 'subtle';
-export type TagSize = 'sm' | 'md' | 'lg';
-
-export interface TagContextValue {
-  action: TagAction;
-  variant: TagVariant;
-  size: TagSize;
-}
-
-export interface TagProps extends React.ComponentPropsWithoutRef<typeof View> {
-  className?: string;
-  action?: TagAction;
-  variant?: TagVariant;
-  size?: TagSize;
-  isDisabled?: boolean;
-}
-
-export interface TagTextProps extends React.ComponentPropsWithoutRef<typeof RNText> {
-  className?: string;
-}
-
-export interface TagIconProps {
-  as: React.ElementType;
-  className?: string;
-}
-
-export interface TagCloseButtonProps extends React.ComponentPropsWithoutRef<typeof View> {
-  className?: string;
-  onPress?: () => void;
-}
+import type { View, Text as RNText } from 'react-native';
+
+export type TagAction = 'primary' | 'secondary' | 'error' | 'success' | 'warning' | 'info' | 'muted';
+export type TagVariant = 'solid' | 'outline' | 'subtle';
+export type TagSize = 'sm' | 'md' | 'lg';
+
+export interface TagContextValue {
+  action: TagAction;
+  variant: TagVariant;
+  size: TagSize;
+}
+
+export interface TagProps extends React.ComponentPropsWithoutRef<typeof View> {
+  className?: string;
+  action?: TagAction;
+  variant?: TagVariant;
+  size?: TagSize;
+  isDisabled?: boolean;
+}
+
+export interface TagTextProps extends React.ComponentPropsWithoutRef<typeof RNText> {
+  className?: string;
+}
+
+export interface TagIconProps {
+  as: React.ElementType;
+  className?: string;
+}
+
+export interface TagCloseButtonProps extends React.ComponentPropsWithoutRef<typeof View> {
+  className?: string;
+  onPress?: () => void;
+}

package/src/tags-input/index.ts

@@ -1,18 +1,18 @@
-export {
-  TagsInput,
-  TagsInputProvider,
-  useTagsInputContext,
-  TagsInputField,
-  TagsInputTag,
-  TagsInputTagText,
-  TagsInputTagCloseButton,
-} from './tags-input';
-export type {
-  TagsInputProps,
-  TagsInputFieldProps,
-  TagsInputTagProps,
-  TagsInputTagTextProps,
-  TagsInputTagCloseButtonProps,
-  TagsInputSize,
-  TagsInputContextValue,
-} from './types';
+export {
+  TagsInput,
+  TagsInputProvider,
+  useTagsInputContext,
+  TagsInputField,
+  TagsInputTag,
+  TagsInputTagText,
+  TagsInputTagCloseButton,
+} from './tags-input';
+export type {
+  TagsInputProps,
+  TagsInputFieldProps,
+  TagsInputTagProps,
+  TagsInputTagTextProps,
+  TagsInputTagCloseButtonProps,
+  TagsInputSize,
+  TagsInputContextValue,
+} from './types';

package/src/tags-input/styles.ts

@@ -1,29 +1,29 @@
-import { tv } from 'tailwind-variants';
-
-export const tagsInputStyle = tv({
-  base: 'flex-row flex-wrap items-center border border-outline-300 rounded-lg bg-background-0 p-1.5 gap-1.5',
-  variants: {
-    size: { sm: 'min-h-[32px]', md: 'min-h-[40px]', lg: 'min-h-[48px]' },
-    isDisabled: { true: 'opacity-50' },
-  },
-  defaultVariants: { size: 'md' },
-});
-export const tagsInputFieldStyle = tv({
-  base: 'flex-1 min-w-[80px] text-typography-900 px-1',
-  variants: {
-    size: { sm: 'text-sm', md: 'text-base', lg: 'text-lg' },
-  },
-  defaultVariants: { size: 'md' },
-});
-export const tagsInputTagStyle = tv({
-  base: 'flex-row items-center bg-primary-50 rounded-md px-2 py-0.5 gap-1',
-  variants: {},
-});
-export const tagsInputTagTextStyle = tv({
-  base: 'text-xs font-medium text-primary-700',
-  variants: {},
-});
-export const tagsInputTagCloseButtonStyle = tv({
-  base: 'rounded-full',
-  variants: {},
-});
+import { tv } from 'tailwind-variants';
+
+export const tagsInputStyle = tv({
+  base: 'flex-row flex-wrap items-center border border-outline-300 rounded-lg bg-background-0 p-1.5 gap-1.5',
+  variants: {
+    size: { sm: 'min-h-[32px]', md: 'min-h-[40px]', lg: 'min-h-[48px]' },
+    isDisabled: { true: 'opacity-50' },
+  },
+  defaultVariants: { size: 'md' },
+});
+export const tagsInputFieldStyle = tv({
+  base: 'flex-1 min-w-[80px] text-typography-900 px-1',
+  variants: {
+    size: { sm: 'text-sm', md: 'text-base', lg: 'text-lg' },
+  },
+  defaultVariants: { size: 'md' },
+});
+export const tagsInputTagStyle = tv({
+  base: 'flex-row items-center bg-primary-50 rounded-md px-2 py-0.5 gap-1',
+  variants: {},
+});
+export const tagsInputTagTextStyle = tv({
+  base: 'text-xs font-medium text-primary-700',
+  variants: {},
+});
+export const tagsInputTagCloseButtonStyle = tv({
+  base: 'rounded-full',
+  variants: {},
+});