@react-native-reusables/cli 0.0.18 → 0.1.0

package/__generated/components/primitives/select/select.web.tsx

@@ -1,332 +0,0 @@
-import * as Select from '@radix-ui/react-select';
-import { useAugmentedRef, useControllableState } from '@rnr/hooks';
-import * as Slot from '@rnr/slot';
-import type {
-  ForceMountable,
-  PositionedContentProps,
-  PressableRef,
-  SlottablePressableProps,
-  SlottableTextProps,
-  SlottableViewProps,
-  TextRef,
-  ViewRef,
-} from '@rnr/types';
-import * as React from 'react';
-import { Pressable, Text, View } from 'react-native';
-import type {
-  RootContext,
-  SelectContentProps,
-  SelectItemProps,
-  SelectOverlayProps,
-  SelectPortalProps,
-  SelectRootProps,
-  SelectSeparatorProps,
-  SelectValueProps,
-} from './types';
-
-const SelectContext = React.createContext<
-  | (RootContext & {
-      open: boolean;
-      onOpenChange: (open: boolean) => void;
-    })
-  | null
->(null);
-
-/**
- * @web Parameter of `onValueChange` has the value of `value` for the `value` and the `label` of the selected Option
- * @ex When an Option with a label of Green Apple, the parameter passed to `onValueChange` is { value: 'green-apple', label: 'green-apple' }
- */
-const Root = React.forwardRef<ViewRef, SlottableViewProps & SelectRootProps>(
-  (
-    {
-      asChild,
-      value: valueProp,
-      defaultValue,
-      onValueChange: onValueChangeProp,
-      onOpenChange: onOpenChangeProp,
-      ...viewProps
-    },
-    ref
-  ) => {
-    const [value, onValueChange] = useControllableState({
-      prop: valueProp,
-      defaultProp: defaultValue,
-      onChange: onValueChangeProp,
-    });
-    const [open, setOpen] = React.useState(false);
-
-    function onOpenChange(value: boolean) {
-      setOpen(value);
-      onOpenChangeProp?.(value);
-    }
-
-    function onStrValueChange(val: string) {
-      onValueChange({ value: val, label: val });
-    }
-
-    const Component = asChild ? Slot.View : View;
-    return (
-      <SelectContext.Provider
-        value={{
-          value,
-          onValueChange,
-          open,
-          onOpenChange,
-        }}
-      >
-        <Select.Root
-          value={value?.value}
-          defaultValue={defaultValue?.value}
-          onValueChange={onStrValueChange}
-          open={open}
-          onOpenChange={onOpenChange}
-        >
-          <Component ref={ref} {...viewProps} />
-        </Select.Root>
-      </SelectContext.Provider>
-    );
-  }
-);
-
-Root.displayName = 'RootWebSelect';
-
-function useRootContext() {
-  const context = React.useContext(SelectContext);
-  if (!context) {
-    throw new Error('Select compound components cannot be rendered outside the Select component');
-  }
-  return context;
-}
-
-const Trigger = React.forwardRef<PressableRef, SlottablePressableProps>(
-  ({ asChild, role: _role, disabled, ...props }, ref) => {
-    const { open, onOpenChange } = useRootContext();
-    const augmentedRef = useAugmentedRef({
-      ref,
-      methods: {
-        open() {
-          onOpenChange(true);
-        },
-        close() {
-          onOpenChange(false);
-        },
-      },
-    });
-
-    React.useLayoutEffect(() => {
-      if (augmentedRef.current) {
-        const augRef = augmentedRef.current as unknown as HTMLButtonElement;
-        augRef.dataset.state = open ? 'open' : 'closed';
-        augRef.type = 'button';
-      }
-    }, [open]);
-
-    const Component = asChild ? Slot.Pressable : Pressable;
-    return (
-      <Select.Trigger disabled={disabled ?? undefined} asChild>
-        <Component ref={augmentedRef} role='button' disabled={disabled} {...props} />
-      </Select.Trigger>
-    );
-  }
-);
-
-Trigger.displayName = 'TriggerWebSelect';
-
-const Value = React.forwardRef<TextRef, SlottableTextProps & SelectValueProps>(
-  ({ asChild, placeholder, children, ...props }, ref) => {
-    return (
-      <Slot.Text ref={ref} {...props}>
-        <Select.Value placeholder={placeholder}>{children}</Select.Value>
-      </Slot.Text>
-    );
-  }
-);
-
-Value.displayName = 'ValueWebSelect';
-
-function Portal({ container, children }: SelectPortalProps) {
-  return <Select.Portal children={children} container={container} />;
-}
-
-const Overlay = React.forwardRef<PressableRef, SlottablePressableProps & SelectOverlayProps>(
-  ({ asChild, forceMount, ...props }, ref) => {
-    const Component = asChild ? Slot.Pressable : Pressable;
-    return <Component ref={ref} {...props} />;
-  }
-);
-
-Overlay.displayName = 'OverlayWebSelect';
-
-const Content = React.forwardRef<
-  ViewRef,
-  SlottableViewProps & PositionedContentProps & SelectContentProps
->(
-  (
-    {
-      asChild = false,
-      forceMount: _forceMount,
-      align = 'start',
-      side = 'bottom',
-      position = 'popper',
-      sideOffset = 0,
-      alignOffset = 0,
-      avoidCollisions = true,
-      disablePositioningStyle: _disablePositioningStyle,
-      onCloseAutoFocus,
-      onEscapeKeyDown,
-      onInteractOutside: _onInteractOutside,
-      onPointerDownOutside,
-      ...props
-    },
-    ref
-  ) => {
-    const Component = asChild ? Slot.View : View;
-    return (
-      <Select.Content
-        onCloseAutoFocus={onCloseAutoFocus}
-        onEscapeKeyDown={onEscapeKeyDown}
-        onPointerDownOutside={onPointerDownOutside}
-        align={align}
-        side={side}
-        sideOffset={sideOffset}
-        alignOffset={alignOffset}
-        avoidCollisions={avoidCollisions}
-        position={position}
-      >
-        <Component ref={ref} {...props} />
-      </Select.Content>
-    );
-  }
-);
-
-Content.displayName = 'ContentWebSelect';
-
-const ItemContext = React.createContext<{
-  itemValue: string;
-  label: string;
-} | null>(null);
-
-const Item = React.forwardRef<PressableRef, SlottablePressableProps & SelectItemProps>(
-  ({ asChild, closeOnPress = true, label, value, children, ...props }, ref) => {
-    return (
-      <ItemContext.Provider value={{ itemValue: value, label: label }}>
-        <Slot.Pressable ref={ref} {...props}>
-          <Select.Item textValue={label} value={value} disabled={props.disabled ?? undefined}>
-            <>{children}</>
-          </Select.Item>
-        </Slot.Pressable>
-      </ItemContext.Provider>
-    );
-  }
-);
-
-Item.displayName = 'ItemWebSelect';
-
-function useItemContext() {
-  const context = React.useContext(ItemContext);
-  if (!context) {
-    throw new Error('Item compound components cannot be rendered outside of an Item component');
-  }
-  return context;
-}
-
-const ItemText = React.forwardRef<TextRef, Omit<SlottableTextProps, 'children'>>(
-  ({ asChild, ...props }, ref) => {
-    const { label } = useItemContext();
-
-    const Component = asChild ? Slot.Text : Text;
-    return (
-      <Select.ItemText asChild>
-        <Component ref={ref} {...props}>
-          {label}
-        </Component>
-      </Select.ItemText>
-    );
-  }
-);
-
-ItemText.displayName = 'ItemTextWebSelect';
-
-const ItemIndicator = React.forwardRef<ViewRef, SlottableViewProps & ForceMountable>(
-  ({ asChild, forceMount: _forceMount, ...props }, ref) => {
-    const Component = asChild ? Slot.View : View;
-    return (
-      <Select.ItemIndicator asChild>
-        <Component ref={ref} {...props} />
-      </Select.ItemIndicator>
-    );
-  }
-);
-
-ItemIndicator.displayName = 'ItemIndicatorWebSelect';
-
-const Group = React.forwardRef<ViewRef, SlottableViewProps>(({ asChild, ...props }, ref) => {
-  const Component = asChild ? Slot.View : View;
-  return (
-    <Select.Group asChild>
-      <Component ref={ref} {...props} />
-    </Select.Group>
-  );
-});
-
-Group.displayName = 'GroupWebSelect';
-
-const Label = React.forwardRef<TextRef, SlottableTextProps>(({ asChild, ...props }, ref) => {
-  const Component = asChild ? Slot.Text : Text;
-  return (
-    <Select.Label asChild>
-      <Component ref={ref} {...props} />
-    </Select.Label>
-  );
-});
-
-Label.displayName = 'LabelWebSelect';
-
-const Separator = React.forwardRef<ViewRef, SlottableViewProps & SelectSeparatorProps>(
-  ({ asChild, decorative, ...props }, ref) => {
-    const Component = asChild ? Slot.View : View;
-    return (
-      <Select.Separator asChild>
-        <Component ref={ref} {...props} />
-      </Select.Separator>
-    );
-  }
-);
-
-Separator.displayName = 'SeparatorWebSelect';
-
-const ScrollUpButton = (props: React.ComponentPropsWithoutRef<typeof Select.ScrollUpButton>) => {
-  return <Select.ScrollUpButton {...props} />;
-};
-
-const ScrollDownButton = (
-  props: React.ComponentPropsWithoutRef<typeof Select.ScrollDownButton>
-) => {
-  return <Select.ScrollDownButton {...props} />;
-};
-
-const Viewport = (props: React.ComponentPropsWithoutRef<typeof Select.Viewport>) => {
-  return <Select.Viewport {...props} />;
-};
-
-export {
-  Content,
-  Group,
-  Item,
-  ItemIndicator,
-  ItemText,
-  Label,
-  Overlay,
-  Portal,
-  Root,
-  ScrollDownButton,
-  ScrollUpButton,
-  Separator,
-  Trigger,
-  Value,
-  Viewport,
-  useItemContext,
-  useRootContext,
-};
-
-export type { Option, SelectTriggerRef } from './types';

package/__generated/components/primitives/select/types.ts

@@ -1,89 +0,0 @@
-import type { ForceMountable, PressableRef } from '@rnr/types';
-
-type Option =
-  | {
-      value: string;
-      label: string;
-    }
-  | undefined;
-
-interface RootContext {
-  value: Option;
-  onValueChange: (option: Option) => void;
-  disabled?: boolean;
-}
-
-interface SelectRootProps {
-  value?: Option;
-  defaultValue?: Option;
-  onValueChange?: (option: Option) => void;
-  onOpenChange?: (open: boolean) => void;
-  disabled?: boolean;
-  /**
-   * Platform: WEB ONLY
-   */
-  dir?: 'ltr' | 'rtl';
-  /**
-   * Platform: WEB ONLY
-   */
-  name?: string;
-  /**
-   * Platform: WEB ONLY
-   */
-  required?: boolean;
-}
-
-interface SelectValueProps {
-  placeholder: string;
-}
-
-interface SelectPortalProps extends ForceMountable {
-  children: React.ReactNode;
-  /**
-   * Platform: NATIVE ONLY
-   */
-  hostName?: string;
-  /**
-   * Platform: WEB ONLY
-   */
-  container?: HTMLElement | null | undefined;
-}
-
-interface SelectOverlayProps extends ForceMountable {
-  closeOnPress?: boolean;
-}
-
-interface SelectContentProps {
-  /**
-   * Platform: WEB ONLY
-   */
-  position?: 'popper' | 'item-aligned' | undefined;
-}
-
-interface SelectItemProps {
-  value: string;
-  label: string;
-  closeOnPress?: boolean;
-}
-
-interface SelectSeparatorProps {
-  decorative?: boolean;
-}
-
-interface SelectTriggerRef extends PressableRef {
-  open: () => void;
-  close: () => void;
-}
-
-export type {
-  Option,
-  RootContext,
-  SelectContentProps,
-  SelectItemProps,
-  SelectOverlayProps,
-  SelectPortalProps,
-  SelectRootProps,
-  SelectSeparatorProps,
-  SelectTriggerRef,
-  SelectValueProps,
-};

package/__generated/components/primitives/separator/index.tsx

@@ -1,23 +0,0 @@
-import * as React from 'react';
-import { View } from 'react-native';
-import * as Slot from '@rnr/slot';
-import type { SlottableViewProps, ViewRef } from '@rnr/types';
-import type { SeparatorRootProps } from './types';
-
-const Root = React.forwardRef<ViewRef, SlottableViewProps & SeparatorRootProps>(
-  ({ asChild, decorative, orientation = 'horizontal', ...props }, ref) => {
-    const Component = asChild ? Slot.View : View;
-    return (
-      <Component
-        role={decorative ? 'presentation' : 'separator'}
-        aria-orientation={orientation}
-        ref={ref}
-        {...props}
-      />
-    );
-  }
-);
-
-Root.displayName = 'RootSeparator';
-
-export { Root };

package/__generated/components/primitives/separator/types.ts

@@ -1,6 +0,0 @@
-interface SeparatorRootProps {
-  orientation?: 'horizontal' | 'vertical';
-  decorative?: boolean;
-}
-
-export type { SeparatorRootProps };

package/__generated/components/primitives/slider/index.ts

@@ -1 +0,0 @@
-export * from './slider';

package/__generated/components/primitives/slider/slider.tsx

@@ -1,89 +0,0 @@
-import * as React from 'react';
-import { View } from 'react-native';
-import * as Slot from '@rnr/slot';
-import type {
-  SlottableViewProps,
-  ViewRef,
-} from '@rnr/types';
-import type { SliderRootProps } from './types';
-
-const RootContext = React.createContext<SliderRootProps | null>(null);
-
-const Root = React.forwardRef<ViewRef, SlottableViewProps & SliderRootProps>(
-  (
-    {
-      asChild,
-      value,
-      disabled,
-      min,
-      max,
-      dir: _dir,
-      inverted: _inverted,
-      step: _step,
-      onValueChange: _onValueChange,
-      ...props
-    },
-    ref
-  ) => {
-    const Component = asChild ? Slot.View : View;
-    return (
-      <RootContext.Provider value={{ value, disabled, min, max }}>
-        <Component ref={ref} role='group' {...props} />
-      </RootContext.Provider>
-    );
-  }
-);
-
-Root.displayName = 'RootNativeSlider';
-
-function useSliderContext() {
-  const context = React.useContext(RootContext);
-  if (context === null) {
-    throw new Error(
-      'Slider compound components cannot be rendered outside the Slider component'
-    );
-  }
-  return context;
-}
-
-const Track = React.forwardRef<ViewRef, SlottableViewProps>(
-  ({ asChild, ...props }, ref) => {
-    const { value, min, max, disabled } = useSliderContext();
-
-    const Component = asChild ? Slot.View : View;
-    return (
-      <Component
-        ref={ref}
-        aria-disabled={disabled}
-        role='slider'
-        aria-valuemin={min}
-        aria-valuemax={max}
-        aria-valuenow={value}
-        accessibilityValue={{ max, min, now: value }}
-        {...props}
-      />
-    );
-  }
-);
-
-Track.displayName = 'TrackNativeSlider';
-
-const Range = React.forwardRef<ViewRef, SlottableViewProps>(
-  ({ asChild, ...props }, ref) => {
-    const Component = asChild ? Slot.View : View;
-    return <Component ref={ref} role='presentation' {...props} />;
-  }
-);
-
-Range.displayName = 'RangeNativeSlider';
-
-const Thumb = React.forwardRef<ViewRef, SlottableViewProps>(
-  ({ asChild, ...props }, ref) => {
-    const Component = asChild ? Slot.View : View;
-    return <Component accessibilityRole='adjustable' ref={ref} {...props} />;
-  }
-);
-
-Thumb.displayName = 'ThumbNativeSlider';
-
-export { Range, Root, Thumb, Track };

package/__generated/components/primitives/slider/slider.web.tsx

@@ -1,67 +0,0 @@
-import * as Slider from '@radix-ui/react-slider';
-import * as React from 'react';
-import { View } from 'react-native';
-import * as Slot from '@rnr/slot';
-import type { SlottableViewProps, ViewRef } from '@rnr/types';
-import type { SliderRootProps } from './types';
-
-const Root = React.forwardRef<ViewRef, SlottableViewProps & SliderRootProps>(
-  (
-    { asChild, value, disabled, min, max, dir, inverted, step = 1, onValueChange, ...props },
-    ref
-  ) => {
-    const Component = asChild ? Slot.View : View;
-    return (
-      <Slider.Root
-        dir={dir}
-        inverted={inverted}
-        value={[value]}
-        disabled={disabled}
-        min={min}
-        max={max}
-        step={step}
-        onValueChange={onValueChange}
-        asChild
-      >
-        <Component ref={ref} {...props} />
-      </Slider.Root>
-    );
-  }
-);
-
-Root.displayName = 'RootWebSlider';
-
-const Track = React.forwardRef<ViewRef, SlottableViewProps>(({ asChild, ...props }, ref) => {
-  const Component = asChild ? Slot.View : View;
-  return (
-    <Slider.Track asChild>
-      <Component ref={ref} {...props} />
-    </Slider.Track>
-  );
-});
-
-Track.displayName = 'TrackWebSlider';
-
-const Range = React.forwardRef<ViewRef, SlottableViewProps>(({ asChild, ...props }, ref) => {
-  const Component = asChild ? Slot.View : View;
-  return (
-    <Slider.Range asChild>
-      <Component ref={ref} {...props} />
-    </Slider.Range>
-  );
-});
-
-Range.displayName = 'RangeWebSlider';
-
-const Thumb = React.forwardRef<ViewRef, SlottableViewProps>(({ asChild, ...props }, ref) => {
-  const Component = asChild ? Slot.View : View;
-  return (
-    <Slider.Thumb asChild>
-      <Component ref={ref} {...props} />
-    </Slider.Thumb>
-  );
-});
-
-Thumb.displayName = 'ThumbWebSlider';
-
-export { Range, Root, Thumb, Track };

package/__generated/components/primitives/slider/types.ts

@@ -1,24 +0,0 @@
-interface SliderRootProps {
-  value: number;
-  disabled?: boolean;
-  min?: number;
-  max?: number;
-  /**
-   * Platform: WEB ONLY
-   */
-  dir?: 'ltr' | 'rtl';
-  /**
-   * Platform: WEB ONLY
-   */
-  inverted?: boolean;
-  /**
-   * Platform: WEB ONLY
-   */
-  step?: number;
-  /**
-   * Platform: WEB ONLY
-   */
-  onValueChange?: (value: number[]) => void;
-}
-
-export type { SliderRootProps };