@brand-map/primitives 0.0.0-broken.0 → 0.0.0-broken.2

package/src/checkbox/checkbox.tsx

@@ -1,7 +1,7 @@
-import * as React from "react";
+import { createContext, forwardRef, useContext, Component } from "react";
 import { GestureResponderEvent, Pressable, View } from "react-native";
 
-import * as Slot from "../slot";
+import * as Render from "../render";
 import type { PressableRef, RenderPressableProps } from "../types";
 
 import type { IndicatorProps, IndicatorRef, RootProps, RootRef } from "./types";
@@ -10,9 +10,9 @@ interface RootContext extends RootProps {
   nativeID?: string;
 }
 
-const CheckboxContext = React.createContext<RootContext | null>(null);
+const CheckboxContext = createContext<RootContext | null>(null);
 
-const Root = React.forwardRef<RootRef, RootProps>(({ disabled = false, checked, onCheckedChange, nativeID, ...props }, ref) => {
+const Root = forwardRef<RootRef, RootProps>(({ disabled = false, checked, onCheckedChange, nativeID, ...props }, ref) => {
   return (
     <CheckboxContext.Provider
       value={{
@@ -33,21 +33,21 @@ const Root = React.forwardRef<RootRef, RootProps>(({ disabled = false, checked,
 Root.displayName = "RootNativeCheckbox";
 
 function useCheckboxContext() {
-  const context = React.useContext(CheckboxContext);
+  const context = useContext(CheckboxContext);
   if (!context) {
     throw new Error("Checkbox compound components cannot be rendered outside the Checkbox component");
   }
   return context;
 }
 
-const Trigger = React.forwardRef<PressableRef, RenderPressableProps>(({ onPress: onPressProp, ...props }, ref) => {
+const Trigger = forwardRef<PressableRef, RenderPressableProps>(({ onPress: onPressProp, ...props }, ref) => {
   const { disabled, checked, onCheckedChange, nativeID } = useCheckboxContext();
 
-  function onPress(ev: GestureResponderEvent) {
+  function onPress(event: GestureResponderEvent) {
     if (disabled) return;
     const newValue = !checked;
     onCheckedChange(newValue);
-    onPressProp?.(ev);
+    onPressProp?.(event);
   }
 
   return (
@@ -70,7 +70,7 @@ const Trigger = React.forwardRef<PressableRef, RenderPressableProps>(({ onPress:
 
 Trigger.displayName = "TriggerNativeCheckbox";
 
-const Indicator = React.forwardRef<IndicatorRef, IndicatorProps>(({ keepMounted, ...props }, ref) => {
+const Indicator = forwardRef<IndicatorRef, IndicatorProps>(({ keepMounted, ...props }, ref) => {
   const { checked, disabled } = useCheckboxContext();
 
   if (!keepMounted) {

package/src/checkbox/checkbox.web.tsx

@@ -1,19 +1,19 @@
 // import * as Checkbox from "@radix-ui/react-checkbox";
-// import * as React from "react";
+//
 // import { GestureResponderEvent, Pressable, View } from "react-native";
 
 // import { useAugmentedRef, useIsomorphicLayoutEffect } from "../hooks";
-// import * as Slot from "../slot";
+// import * as Render from "../render";
 
 // import type { IndicatorProps, IndicatorRef, RootProps, RootRef } from "./types";
 
-// const CheckboxContext = React.createContext<RootProps | null>(null);
+// const CheckboxContext = createContext<RootProps | null>(null);
 
-// const Root = React.forwardRef<RootRef, RootProps>(({ disabled, checked, onCheckedChange, onPress: onPressProp, role: _role, ...props }, ref) => {
+// const Root = forwardRef<RootRef, RootProps>(({ disabled, checked, onCheckedChange, onPress: onPressProp, role: _role, ...props }, ref) => {
 //   const augmentedRef = useAugmentedRef({ ref });
 
-//   function onPress(ev: GestureResponderEvent) {
-//     onPressProp?.(ev);
+//   function onPress(event: GestureResponderEvent) {
+//     onPressProp?.(event);
 //     onCheckedChange(!checked);
 //   }
 
@@ -63,14 +63,14 @@
 // Root.displayName = "RootWebCheckbox";
 
 // function useCheckboxContext() {
-//   const context = React.useContext(CheckboxContext);
+//   const context = useContext(CheckboxContext);
 //   if (context === null) {
 //     throw new Error("Checkbox compound components cannot be rendered outside the Checkbox component");
 //   }
 //   return context;
 // }
 
-// const Indicator = React.forwardRef<IndicatorRef, IndicatorProps>(({ keepMounted, ...props }, ref) => {
+// const Indicator = forwardRef<IndicatorRef, IndicatorProps>(({ keepMounted, ...props }, ref) => {
 //   const { checked, disabled } = useCheckboxContext();
 //   const augmentedRef = useAugmentedRef({ ref });
 

package/src/collapsible/collapsible.tsx

@@ -1,57 +1,55 @@
-import * as React from "react";
+import { createContext, forwardRef, useContext, useId } from "react";
 import { Pressable, View, type GestureResponderEvent } from "react-native";
 
 import { useControllableState } from "../hooks";
-import * as Slot from "../slot";
+import * as Render from "../render";
 
 import type { ContentProps, ContentRef, RootContext, RootProps, RootRef, TriggerProps, TriggerRef } from "./types";
 
-const CollapsibleContext = React.createContext<(RootContext & { nativeID: string }) | null>(null);
-
-const Root = React.forwardRef<RootRef, RootProps>(
-  ({ render, disabled = false, open: openProp, defaultOpen, onOpenChange: onOpenChangeProp, ...viewProps }, ref) => {
-    const nativeID = React.useId();
-    const [open = false, onOpenChange] = useControllableState({
-      prop: openProp,
-      defaultProp: defaultOpen,
-      onChange: onOpenChangeProp,
-    });
-
-    return (
-      <CollapsibleContext.Provider
-        value={{
-          disabled,
-          open,
-          onOpenChange,
-          nativeID,
-        }}
-      >
-        <Component
-          ref={ref}
-          {...viewProps}
-        />
-      </CollapsibleContext.Provider>
-    );
-  },
-);
+const CollapsibleContext = createContext<(RootContext & { nativeID: string }) | null>(null);
+
+const Root = forwardRef<RootRef, RootProps>(({ render, disabled = false, open: openProp, defaultOpen, onOpenChange: onOpenChangeProp, ...viewProps }, ref) => {
+  const nativeID = useId();
+  const [open = false, onOpenChange] = useControllableState({
+    prop: openProp,
+    defaultProp: defaultOpen,
+    onChange: onOpenChangeProp,
+  });
+
+  return (
+    <CollapsibleContext.Provider
+      value={{
+        disabled,
+        open,
+        onOpenChange,
+        nativeID,
+      }}
+    >
+      <Component
+        ref={ref}
+        {...viewProps}
+      />
+    </CollapsibleContext.Provider>
+  );
+});
 
 Root.displayName = "RootNativeCollapsible";
 
 function useCollapsibleContext() {
-  const context = React.useContext(CollapsibleContext);
+  const context = useContext(CollapsibleContext);
   if (!context) {
     throw new Error("Collapsible compound components cannot be rendered outside the Collapsible component");
   }
   return context;
 }
 
-const Trigger = React.forwardRef<TriggerRef, TriggerProps>(({ onPress: onPressProp, disabled: disabledProp = false, ...props }, ref) => {
+const Trigger = forwardRef<TriggerRef, TriggerProps>(({ onPress: onPressProp, disabled: disabledProp = false, ...props }, ref) => {
   const { disabled, open, onOpenChange, nativeID } = useCollapsibleContext();
 
-  function onPress(ev: GestureResponderEvent) {
+  function onPress(event: GestureResponderEvent) {
     if (disabled || disabledProp) return;
     onOpenChange(!open);
-    onPressProp?.(ev);
+    onPressProp?.(event);
   }
 
   return (
@@ -73,7 +71,7 @@ const Trigger = React.forwardRef<TriggerRef, TriggerProps>(({ onPress: onPressPr
 
 Trigger.displayName = "TriggerNativeCollapsible";
 
-const Content = React.forwardRef<ContentRef, ContentProps>(({ keepMounted, ...props }, ref) => {
+const Content = forwardRef<ContentRef, ContentProps>(({ keepMounted, ...props }, ref) => {
   const { nativeID, open } = useCollapsibleContext();
 
   if (!keepMounted) {

package/src/collapsible/collapsible.web.tsx

@@ -1,15 +1,15 @@
 // import * as Collapsible from "@radix-ui/react-collapsible";
-// import * as React from "react";
+//
 // import { Pressable, View, type GestureResponderEvent } from "react-native";
 
 // import { useAugmentedRef, useControllableState, useIsomorphicLayoutEffect } from "../hooks";
-// import * as Slot from "../slot";
+// import * as Render from "../render";
 
 // import type { ContentProps, ContentRef, RootContext, RootProps, RootRef, TriggerProps, TriggerRef } from "./types";
 
-// const CollapsibleContext = React.createContext<RootContext | null>(null);
+// const CollapsibleContext = createContext<RootContext | null>(null);
 
-// const Root = React.forwardRef<RootRef, RootProps>(
+// const Root = forwardRef<RootRef, RootProps>(
 //   ({ render, disabled = false, open: openProp, defaultOpen, onOpenChange: onOpenChangeProp, ...viewProps }, ref) => {
 //     const [open = false, onOpenChange] = useControllableState({
 //       prop: openProp,
@@ -64,14 +64,14 @@
 // Root.displayName = "RootWebCollapsible";
 
 // function useCollapsibleContext() {
-//   const context = React.useContext(CollapsibleContext);
+//   const context = useContext(CollapsibleContext);
 //   if (!context) {
 //     throw new Error("Collapsible compound components cannot be rendered outside the Collapsible component");
 //   }
 //   return context;
 // }
 
-// const Trigger = React.forwardRef<TriggerRef, TriggerProps>(({ onPress: onPressProp, disabled: disabledProp = false, ...props }, ref) => {
+// const Trigger = forwardRef<TriggerRef, TriggerProps>(({ onPress: onPressProp, disabled: disabledProp = false, ...props }, ref) => {
 //   const { disabled, open, onOpenChange } = useCollapsibleContext();
 //   const augmentedRef = useAugmentedRef({ ref });
 
@@ -95,8 +95,8 @@
 //     }
 //   }, [disabled]);
 
-//   function onPress(ev: GestureResponderEvent) {
-//     onPressProp?.(ev);
+//   function onPress(event: GestureResponderEvent) {
+//     onPressProp?.(event);
 //     onOpenChange(!open);
 //   }
 
@@ -119,7 +119,7 @@
 
 // Trigger.displayName = "TriggerWebCollapsible";
 
-// const Content = React.forwardRef<ContentRef, ContentProps>(({ keepMounted, ...props }, ref) => {
+// const Content = forwardRef<ContentRef, ContentProps>(({ keepMounted, ...props }, ref) => {
 //   const augmentedRef = useAugmentedRef({ ref });
 //   const { open } = useCollapsibleContext();
 

package/src/context-menu/context-menu.tsx

@@ -1,4 +1,4 @@
-import * as React from "react";
+import { createContext, forwardRef, useId, useState, useContext, useEffect } from "react";
 import {
   BackHandler,
   Pressable,
@@ -12,7 +12,7 @@ import {
 
 import { useAugmentedRef, useControllableState, useRelativePosition, type LayoutPosition } from "../hooks";
 import { Portal as RNPPortal } from "../portal";
-import * as Slot from "../slot";
+import * as Render from "../render";
 
 import type {
   CheckboxItemProps,
@@ -58,13 +58,13 @@ interface RootContextInterface extends RootProps {
   nativeID: string;
 }
 
-const RootContext = React.createContext<RootContextInterface | null>(null);
+const RootContext = createContext<RootContextInterface | null>(null);
 
-const Root = React.forwardRef<RootRef, RootProps>(({ relativeTo = "longPress", onOpenChange: onOpenChangeProp, ...viewProps }, ref) => {
-  const nativeID = React.useId();
-  const [pressPosition, setPressPosition] = React.useState<LayoutPosition | null>(null);
-  const [contentLayout, setContentLayout] = React.useState<LayoutRectangle | null>(null);
-  const [open, setOpen] = React.useState(false);
+const Root = forwardRef<RootRef, RootProps>(({ relativeTo = "longPress", onOpenChange: onOpenChangeProp, ...viewProps }, ref) => {
+  const nativeID = useId();
+  const [pressPosition, setPressPosition] = useState<LayoutPosition | null>(null);
+  const [contentLayout, setContentLayout] = useState<LayoutRectangle | null>(null);
+  const [open, setOpen] = useState(false);
 
   function onOpenChange(value: boolean) {
     setOpen(value);
@@ -95,7 +95,7 @@ const Root = React.forwardRef<RootRef, RootProps>(({ relativeTo = "longPress", o
 Root.displayName = "RootNativeContextMenu";
 
 function useRootContext() {
-  const context = React.useContext(RootContext);
+  const context = useContext(RootContext);
   if (!context) {
     throw new Error("ContextMenu compound components cannot be rendered outside the ContextMenu component");
   }
@@ -104,7 +104,7 @@ function useRootContext() {
 
 const accessibilityActions = [{ name: "longpress" }];
 
-const Trigger = React.forwardRef<TriggerRef, TriggerProps>(
+const Trigger = forwardRef<TriggerRef, TriggerProps>(
   ({ render, onLongPress: onLongPressProp, disabled = false, onAccessibilityAction: onAccessibilityActionProp, ...props }, ref) => {
     const { open, onOpenChange, relativeTo, setPressPosition } = useRootContext();
     const augmentedRef = useAugmentedRef({
@@ -123,13 +123,13 @@ const Trigger = React.forwardRef<TriggerRef, TriggerProps>(
       },
     });
 
-    function onLongPress(ev: GestureResponderEvent) {
+    function onLongPress(event: GestureResponderEvent) {
       if (disabled) return;
       if (relativeTo === "longPress") {
         setPressPosition({
           width: 0,
-          pageX: ev.nativeEvent.pageX,
-          pageY: ev.nativeEvent.pageY,
+          pageX: event.nativeEvent.pageX,
+          pageY: event.nativeEvent.pageY,
           height: 0,
         });
       }
@@ -139,7 +139,7 @@ const Trigger = React.forwardRef<TriggerRef, TriggerProps>(
         });
       }
       onOpenChange(!open);
-      onLongPressProp?.(ev);
+      onLongPressProp?.(event);
     }
 
     function onAccessibilityAction(event: AccessibilityActionEvent) {
@@ -201,16 +201,16 @@ function Portal({ keepMounted, hostName, children }: PortalProps) {
   );
 }
 
-const Backdrop = React.forwardRef<BackdropRef, BackdropProps>(({ keepMounted, onPress: OnPressProp, closeOnPress = true, ...props }, ref) => {
+const Backdrop = forwardRef<BackdropRef, BackdropProps>(({ keepMounted, onPress: onPressProp, closeOnPress = true, ...props }, ref) => {
   const { open, onOpenChange, setContentLayout, setPressPosition } = useRootContext();
 
-  function onPress(ev: GestureResponderEvent) {
+  function onPress(event: GestureResponderEvent) {
     if (closeOnPress) {
       setPressPosition(null);
       setContentLayout(null);
       onOpenChange(false);
     }
-    OnPressProp?.(ev);
+    onPressProp?.(event);
   }
 
   if (!keepMounted) {
@@ -230,7 +230,7 @@ const Backdrop = React.forwardRef<BackdropRef, BackdropProps>(({ keepMounted, on
 
 Backdrop.displayName = "BackdropNativeContextMenu";
 
-const Content = React.forwardRef<ContentRef, ContentProps>(
+const Content = forwardRef<ContentRef, ContentProps>(
   (
     {
       render = false,
@@ -250,7 +250,7 @@ const Content = React.forwardRef<ContentRef, ContentProps>(
   ) => {
     const { open, onOpenChange, contentLayout, nativeID, pressPosition, setContentLayout, setPressPosition } = useRootContext();
 
-    React.useEffect(() => {
+    useEffect(() => {
       const backHandler = BackHandler.addEventListener("hardwareBackPress", () => {
         setPressPosition(null);
         setContentLayout(null);
@@ -304,16 +304,16 @@ const Content = React.forwardRef<ContentRef, ContentProps>(
 
 Content.displayName = "ContentNativeContextMenu";
 
-const Item = React.forwardRef<ItemRef, ItemProps>(({ textValue, onPress: onPressProp, disabled = false, closeOnPress = true, ...props }, ref) => {
+const Item = forwardRef<ItemRef, ItemProps>(({ textValue, onPress: onPressProp, disabled = false, closeOnPress = true, ...props }, ref) => {
   const { onOpenChange, setContentLayout, setPressPosition } = useRootContext();
 
-  function onPress(ev: GestureResponderEvent) {
+  function onPress(event: GestureResponderEvent) {
     if (closeOnPress) {
       setPressPosition(null);
       setContentLayout(null);
       onOpenChange(false);
     }
-    onPressProp?.(ev);
+    onPressProp?.(event);
   }
 
   return (
@@ -332,7 +332,7 @@ const Item = React.forwardRef<ItemRef, ItemProps>(({ textValue, onPress: onPress
 
 Item.displayName = "ItemNativeContextMenu";
 
-const Group = React.forwardRef<GroupRef, GroupProps>(({ ...props }, ref) => {
+const Group = forwardRef<GroupRef, GroupProps>(({ ...props }, ref) => {
   return (
     <Component
       ref={ref}
@@ -344,7 +344,7 @@ const Group = React.forwardRef<GroupRef, GroupProps>(({ ...props }, ref) => {
 
 Group.displayName = "GroupNativeContextMenu";
 
-const Label = React.forwardRef<LabelRef, LabelProps>(({ ...props }, ref) => {
+const Label = forwardRef<LabelRef, LabelProps>(({ ...props }, ref) => {
   return (
     <Component
       ref={ref}
@@ -362,20 +362,20 @@ type FormItemContext =
       onValueChange: (value: string) => void;
     };
 
-const FormItemContext = React.createContext<FormItemContext | null>(null);
+const FormItemContext = createContext<FormItemContext | null>(null);
 
-const CheckboxItem = React.forwardRef<CheckboxItemRef, CheckboxItemProps>(
+const CheckboxItem = forwardRef<CheckboxItemRef, CheckboxItemProps>(
   ({ render, checked, onCheckedChange, textValue, onPress: onPressProp, closeOnPress = true, disabled = false, ...props }, ref) => {
     const { onOpenChange, setContentLayout, setPressPosition } = useRootContext();
 
-    function onPress(ev: GestureResponderEvent) {
+    function onPress(event: GestureResponderEvent) {
       onCheckedChange(!checked);
       if (closeOnPress) {
         setPressPosition(null);
         setContentLayout(null);
         onOpenChange(false);
       }
-      onPressProp?.(ev);
+      onPressProp?.(event);
     }
 
     return (
@@ -399,14 +399,14 @@ const CheckboxItem = React.forwardRef<CheckboxItemRef, CheckboxItemProps>(
 CheckboxItem.displayName = "CheckboxItemNativeContextMenu";
 
 function useFormItemContext() {
-  const context = React.useContext(FormItemContext);
+  const context = useContext(FormItemContext);
   if (!context) {
     throw new Error("CheckboxItem or RadioItem compound components cannot be rendered outside of a CheckboxItem or RadioItem component");
   }
   return context;
 }
 
-const RadioGroup = React.forwardRef<RadioGroupRef, RadioGroupProps>(({ value, onValueChange, ...props }, ref) => {
+const RadioGroup = forwardRef<RadioGroupRef, RadioGroupProps>(({ value, onValueChange, ...props }, ref) => {
   return (
     <FormItemContext.Provider value={{ value, onValueChange }}>
       <Component
@@ -424,21 +424,21 @@ type BothFormItemContext = Exclude<FormItemContext, { checked: boolean }> & {
   checked: boolean;
 };
 
-const RadioItemContext = React.createContext({} as { itemValue: string });
+const RadioItemContext = createContext({} as { itemValue: string });
 
-const RadioItem = React.forwardRef<RadioItemRef, RadioItemProps>(
+const RadioItem = forwardRef<RadioItemRef, RadioItemProps>(
   ({ render, value: itemValue, textValue, onPress: onPressProp, disabled = false, closeOnPress = true, ...props }, ref) => {
     const { onOpenChange, setContentLayout, setPressPosition } = useRootContext();
 
     const { value, onValueChange } = useFormItemContext() as BothFormItemContext;
-    function onPress(ev: GestureResponderEvent) {
+    function onPress(event: GestureResponderEvent) {
       onValueChange(itemValue);
       if (closeOnPress) {
         setPressPosition(null);
         setContentLayout(null);
         onOpenChange(false);
       }
-      onPressProp?.(ev);
+      onPressProp?.(event);
     }
 
     return (
@@ -464,10 +464,10 @@ const RadioItem = React.forwardRef<RadioItemRef, RadioItemProps>(
 RadioItem.displayName = "RadioItemNativeContextMenu";
 
 function useItemIndicatorContext() {
-  return React.useContext(RadioItemContext);
+  return useContext(RadioItemContext);
 }
 
-const ItemIndicator = React.forwardRef<ItemIndicatorRef, ItemIndicatorProps>(({ keepMounted, ...props }, ref) => {
+const ItemIndicator = forwardRef<ItemIndicatorRef, ItemIndicatorProps>(({ keepMounted, ...props }, ref) => {
   const { itemValue } = useItemIndicatorContext();
   const { checked, value } = useFormItemContext() as BothFormItemContext;
 
@@ -491,7 +491,7 @@ const ItemIndicator = React.forwardRef<ItemIndicatorRef, ItemIndicatorProps>(({
 
 ItemIndicator.displayName = "ItemIndicatorNativeContextMenu";
 
-const Separator = React.forwardRef<SeparatorRef, SeparatorProps>(({ decorative, ...props }, ref) => {
+const Separator = forwardRef<SeparatorRef, SeparatorProps>(({ decorative, ...props }, ref) => {
   return (
     <Component
       role={decorative ? "presentation" : "separator"}
@@ -503,14 +503,14 @@ const Separator = React.forwardRef<SeparatorRef, SeparatorProps>(({ decorative,
 
 Separator.displayName = "SeparatorNativeContextMenu";
 
-const SubContext = React.createContext<{
+const SubContext = createContext<{
   nativeID: string;
   open: boolean;
   onOpenChange: (value: boolean) => void;
 } | null>(null);
 
-const Sub = React.forwardRef<SubRef, SubProps>(({ defaultOpen, open: openProp, onOpenChange: onOpenChangeProp, ...props }, ref) => {
-  const nativeID = React.useId();
+const Sub = forwardRef<SubRef, SubProps>(({ defaultOpen, open: openProp, onOpenChange: onOpenChangeProp, ...props }, ref) => {
+  const nativeID = useId();
   const [open = false, onOpenChange] = useControllableState({
     prop: openProp,
     defaultProp: defaultOpen,
@@ -536,19 +536,19 @@ const Sub = React.forwardRef<SubRef, SubProps>(({ defaultOpen, open: openProp, o
 Sub.displayName = "SubNativeContextMenu";
 
 function useSubContext() {
-  const context = React.useContext(SubContext);
+  const context = useContext(SubContext);
   if (!context) {
     throw new Error("Sub compound components cannot be rendered outside of a Sub component");
   }
   return context;
 }
 
-const SubTrigger = React.forwardRef<SubTriggerRef, SubTriggerProps>(({ textValue, onPress: onPressProp, disabled = false, ...props }, ref) => {
+const SubTrigger = forwardRef<SubTriggerRef, SubTriggerProps>(({ textValue, onPress: onPressProp, disabled = false, ...props }, ref) => {
   const { nativeID, open, onOpenChange } = useSubContext();
 
-  function onPress(ev: GestureResponderEvent) {
+  function onPress(event: GestureResponderEvent) {
     onOpenChange(!open);
-    onPressProp?.(ev);
+    onPressProp?.(event);
   }
 
   return (
@@ -569,7 +569,7 @@ const SubTrigger = React.forwardRef<SubTriggerRef, SubTriggerProps>(({ textValue
 
 SubTrigger.displayName = "SubTriggerNativeContextMenu";
 
-const SubContent = React.forwardRef<SubContentRef, SubContentProps>(({ render = false, keepMounted, ...props }, ref) => {
+const SubContent = forwardRef<SubContentRef, SubContentProps>(({ render = false, keepMounted, ...props }, ref) => {
   const { open, nativeID } = useSubContext();
 
   if (!keepMounted) {