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

package/src/hover-card/hover-card.tsx

@@ -1,9 +1,9 @@
-import * as React from "react";
+import { createContext, forwardRef, useContext, useEffect, useId, useState } from "react";
 import { BackHandler, Pressable, View, type GestureResponderEvent, type LayoutChangeEvent, type LayoutRectangle } from "react-native";
 
 import { useAugmentedRef, useRelativePosition, type LayoutPosition } from "../hooks";
 import { Portal as RNPPortal } from "../portal";
-import * as Slot from "../slot";
+import * as Render from "../render";
 
 import type {
   ContentProps,
@@ -28,52 +28,50 @@ interface RootContextInterface extends SharedRootContext {
   nativeID: string;
 }
 
-const RootContext = React.createContext<RootContextInterface | null>(null);
+const RootContext = createContext<RootContextInterface | null>(null);
 
-const Root = React.forwardRef<RootRef, RootProps>(
-  ({ render, openDelay: _openDelay, closeDelay: _closeDelay, onOpenChange: onOpenChangeProp, ...viewProps }, ref) => {
-    const nativeID = React.useId();
-    const [triggerPosition, setTriggerPosition] = React.useState<LayoutPosition | null>(null);
-    const [contentLayout, setContentLayout] = React.useState<LayoutRectangle | null>(null);
-    const [open, setOpen] = React.useState(false);
+const Root = forwardRef<RootRef, RootProps>(({ render, openDelay: _openDelay, closeDelay: _closeDelay, onOpenChange: onOpenChangeProp, ...viewProps }, ref) => {
+  const nativeID = useId();
+  const [triggerPosition, setTriggerPosition] = useState<LayoutPosition | null>(null);
+  const [contentLayout, setContentLayout] = useState<LayoutRectangle | null>(null);
+  const [open, setOpen] = useState(false);
 
-    function onOpenChange(value: boolean) {
-      setOpen(value);
-      onOpenChangeProp?.(value);
-    }
+  function onOpenChange(value: boolean) {
+    setOpen(value);
+    onOpenChangeProp?.(value);
+  }
 
-    return (
-      <RootContext.Provider
-        value={{
-          open,
-          onOpenChange,
-          contentLayout,
-          nativeID,
-          setContentLayout,
-          setTriggerPosition,
-          triggerPosition,
-        }}
-      >
-        <Component
-          ref={ref}
-          {...viewProps}
-        />
-      </RootContext.Provider>
-    );
-  },
-);
+  return (
+    <RootContext.Provider
+      value={{
+        open,
+        onOpenChange,
+        contentLayout,
+        nativeID,
+        setContentLayout,
+        setTriggerPosition,
+        triggerPosition,
+      }}
+    >
+      <Component
+        ref={ref}
+        {...viewProps}
+      />
+    </RootContext.Provider>
+  );
+});
 
 Root.displayName = "RootNativeHoverCard";
 
 function useRootContext() {
-  const context = React.useContext(RootContext);
+  const context = useContext(RootContext);
   if (!context) {
     throw new Error("HoverCard compound components cannot be rendered outside the HoverCard component");
   }
   return context;
 }
 
-const Trigger = React.forwardRef<TriggerRef, TriggerProps>(({ onPress: onPressProp, disabled = false, ...props }, ref) => {
+const Trigger = forwardRef<TriggerRef, TriggerProps>(({ onPress: onPressProp, disabled = false, ...props }, ref) => {
   const { open, onOpenChange, setTriggerPosition } = useRootContext();
 
   const augmentedRef = useAugmentedRef({
@@ -92,14 +90,14 @@ const Trigger = React.forwardRef<TriggerRef, TriggerProps>(({ onPress: onPressPr
     },
   });
 
-  function onPress(ev: GestureResponderEvent) {
+  function onPress(event: GestureResponderEvent) {
     if (disabled) return;
     augmentedRef.current?.measure((_x, _y, width, height, pageX, pageY) => {
       setTriggerPosition({ width, pageX, pageY: pageY, height });
     });
 
     onOpenChange(!open);
-    onPressProp?.(ev);
+    onPressProp?.(event);
   }
 
   return (
@@ -142,16 +140,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, setTriggerPosition, setContentLayout } = useRootContext();
 
-  function onPress(ev: GestureResponderEvent) {
+  function onPress(event: GestureResponderEvent) {
     if (closeOnPress) {
       setTriggerPosition(null);
       setContentLayout(null);
       onOpenChange(false);
     }
-    OnPressProp?.(ev);
+    onPressProp?.(event);
   }
 
   if (!keepMounted) {
@@ -174,7 +172,7 @@ Backdrop.displayName = "BackdropNativeHoverCard";
 /**
  * @info `position`, `top`, `left`, and `maxWidth` style properties are controlled internally. Opt out of this behavior by setting `disablePositioningStyle` to `true`.
  */
-const Content = React.forwardRef<ContentRef, ContentProps>(
+const Content = forwardRef<ContentRef, ContentProps>(
   (
     {
       render = false,
@@ -194,7 +192,7 @@ const Content = React.forwardRef<ContentRef, ContentProps>(
   ) => {
     const { open, onOpenChange, contentLayout, nativeID, setContentLayout, setTriggerPosition, triggerPosition } = useRootContext();
 
-    React.useEffect(() => {
+    useEffect(() => {
       const backHandler = BackHandler.addEventListener("hardwareBackPress", () => {
         setTriggerPosition(null);
         setContentLayout(null);

package/src/hover-card/hover-card.web.tsx

@@ -1,9 +1,9 @@
 // import * as HoverCard from "@radix-ui/react-hover-card";
-// import * as React from "react";
+//
 // import { Pressable, View } from "react-native";
 
 // import { useAugmentedRef } from "../hooks";
-// import * as Slot from "../slot";
+// import * as Render from "../render";
 
 // import type {
 //   ContentProps,
@@ -18,10 +18,10 @@
 //   TriggerRef,
 // } from "./types";
 
-// const HoverCardContext = React.createContext<SharedRootContext | null>(null);
+// const HoverCardContext = createContext<SharedRootContext | null>(null);
 
-// const Root = React.forwardRef<RootRef, RootProps>(({ openDelay, closeDelay, onOpenChange: onOpenChangeProp, ...viewProps }, ref) => {
-//   const [open, setOpen] = React.useState(false);
+// const Root = forwardRef<RootRef, RootProps>(({ openDelay, closeDelay, onOpenChange: onOpenChangeProp, ...viewProps }, ref) => {
+//   const [open, setOpen] = useState(false);
 
 //   function onOpenChange(value: boolean) {
 //     setOpen(value);
@@ -49,14 +49,14 @@
 // Root.displayName = "RootWebHoverCard";
 
 // function useRootContext() {
-//   const context = React.useContext(HoverCardContext);
+//   const context = useContext(HoverCardContext);
 //   if (!context) {
 //     throw new Error("HoverCard compound components cannot be rendered outside the HoverCard component");
 //   }
 //   return context;
 // }
 
-// const Trigger = React.forwardRef<TriggerRef, TriggerProps>(({ ...props }, ref) => {
+// const Trigger = forwardRef<TriggerRef, TriggerProps>(({ ...props }, ref) => {
 //   const { onOpenChange } = useRootContext();
 //   const augmentedRef = useAugmentedRef({
 //     ref,
@@ -93,7 +93,7 @@
 //   );
 // }
 
-// const Backdrop = React.forwardRef<BackdropRef, BackdropProps>(({ ...props }, ref) => {
+// const Backdrop = forwardRef<BackdropRef, BackdropProps>(({ ...props }, ref) => {
 //
 //   return (
 //     <Component
@@ -105,7 +105,7 @@
 
 // Backdrop.displayName = "BackdropWebHoverCard";
 
-// const Content = React.forwardRef<ContentRef, ContentProps>(
+// const Content = forwardRef<ContentRef, ContentProps>(
 //   (
 //     {
 //       render = false,

package/src/label/label.tsx

@@ -1,14 +1,13 @@
-import * as React from "react";
 import { Pressable, Text as ReactNativeText } from "react-native";
 
-import * as Slot from "../slot";
+import * as Render from "../render";
 
 import type { RootProps, TextProps } from "./types";
 
 const Root = ({ render, ...props }: RootProps) => {
   if (render) {
     return (
-      <Slot.Pressable
+      <Render.Pressable
         render={render}
         {...props}
       />
@@ -22,7 +21,7 @@ Root.displayName = "RootNativeLabel";
 const Text = ({ render, ...props }: TextProps) => {
   if (render) {
     return (
-      <Slot.Text
+      <Render.Text
         render={render}
         {...props}
       />

package/src/label/label.web.tsx

@@ -1,12 +1,12 @@
 // import * as Label from "@radix-ui/react-label";
-// import * as React from "react";
+//
 // import { Pressable, Text as RNText } from "react-native";
 
-// import * as Slot from "../slot";
+// import * as Render from "../render";
 
 // import type { RootProps, RootRef, TextProps, TextRef } from "./types";
 
-// const Root = React.forwardRef<RootRef, RootProps>(({ tabIndex = -1, ...props }, ref) => {
+// const Root = forwardRef<RootRef, RootProps>(({ tabIndex = -1, ...props }, ref) => {
 //
 //   return (
 //     <Component
@@ -18,8 +18,8 @@
 // });
 // Root.displayName = "RootWebLabel";
 
-// const Text = React.forwardRef<TextRef, TextProps>(({ nativeID, htmlFor, ...props }, ref) => {
-//   const Component = render ? Slot.Text : RNText;
+// const Text = forwardRef<TextRef, TextProps>(({ nativeID, htmlFor, ...props }, ref) => {
+//   const Component = render ? Render.Text : RNText;
 //   return (
 //     <Label.Root
 //       render={!htmlFor}

package/src/menubar/menubar.tsx

@@ -1,9 +1,9 @@
-import * as React from "react";
+import { createContext, forwardRef, useId, useState, useContext, useEffect } from "react";
 import { BackHandler, Pressable, Text, View, type GestureResponderEvent, type LayoutChangeEvent, type LayoutRectangle } from "react-native";
 
 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,
@@ -49,12 +49,12 @@ interface IMenuContext extends RootProps {
   nativeID: string;
 }
 
-const RootContext = React.createContext<IMenuContext | null>(null);
+const RootContext = createContext<IMenuContext | null>(null);
 
-const Root = React.forwardRef<RootRef, RootProps>(({ value, onValueChange, ...viewProps }, ref) => {
-  const nativeID = React.useId();
-  const [triggerPosition, setTriggerPosition] = React.useState<LayoutPosition | null>(null);
-  const [contentLayout, setContentLayout] = React.useState<LayoutRectangle | null>(null);
+const Root = forwardRef<RootRef, RootProps>(({ value, onValueChange, ...viewProps }, ref) => {
+  const nativeID = useId();
+  const [triggerPosition, setTriggerPosition] = useState<LayoutPosition | null>(null);
+  const [contentLayout, setContentLayout] = useState<LayoutRectangle | null>(null);
 
   return (
     <RootContext.Provider
@@ -79,16 +79,16 @@ const Root = React.forwardRef<RootRef, RootProps>(({ value, onValueChange, ...vi
 Root.displayName = "RootMenubar";
 
 function useRootContext() {
-  const context = React.useContext(RootContext);
+  const context = useContext(RootContext);
   if (!context) {
     throw new Error("Menubar compound components cannot be rendered outside the Menubar component");
   }
   return context;
 }
 
-const MenuContext = React.createContext<MenuProps | null>(null);
+const MenuContext = createContext<MenuProps | null>(null);
 
-const Menu = React.forwardRef<MenuRef, MenuProps>(({ value, ...viewProps }, ref) => {
+const Menu = forwardRef<MenuRef, MenuProps>(({ value, ...viewProps }, ref) => {
   return (
     <MenuContext.Provider
       value={{
@@ -107,26 +107,26 @@ const Menu = React.forwardRef<MenuRef, MenuProps>(({ value, ...viewProps }, ref)
 Menu.displayName = "MenuMenubar";
 
 function useMenuContext() {
-  const context = React.useContext(MenuContext);
+  const context = useContext(MenuContext);
   if (!context) {
     throw new Error("Menubar compound components cannot be rendered outside the Menubar component");
   }
   return context;
 }
 
-const Trigger = React.forwardRef<TriggerRef, TriggerProps>(({ onPress: onPressProp, disabled = false, ...props }, ref) => {
+const Trigger = forwardRef<TriggerRef, TriggerProps>(({ onPress: onPressProp, disabled = false, ...props }, ref) => {
   const triggerRef = useAugmentedRef({ ref });
   const { value, onValueChange, setTriggerPosition } = useRootContext();
   const { value: menuValue } = useMenuContext();
 
-  function onPress(ev: GestureResponderEvent) {
+  function onPress(event: GestureResponderEvent) {
     if (disabled) return;
     triggerRef.current?.measure((_x, _y, width, height, pageX, pageY) => {
       setTriggerPosition({ width, pageX, pageY, height });
     });
 
     onValueChange(menuValue === value ? undefined : menuValue);
-    onPressProp?.(ev);
+    onPressProp?.(event);
   }
 
   return (
@@ -181,16 +181,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 { value, onValueChange, setContentLayout, setTriggerPosition } = useRootContext();
 
-  function onPress(ev: GestureResponderEvent) {
+  function onPress(event: GestureResponderEvent) {
     if (closeOnPress) {
       setTriggerPosition(null);
       setContentLayout(null);
       onValueChange(undefined);
     }
-    OnPressProp?.(ev);
+    onPressProp?.(event);
   }
 
   if (!keepMounted) {
@@ -213,7 +213,7 @@ Backdrop.displayName = "BackdropMenubar";
 /**
  * @info `position`, `top`, `left`, and `maxWidth` style properties are controlled internally. Opt out of this behavior by setting `disablePositioningStyle` to `true`.
  */
-const Content = React.forwardRef<ContentRef, ContentProps>(
+const Content = forwardRef<ContentRef, ContentProps>(
   (
     {
       render = false,
@@ -234,7 +234,7 @@ const Content = React.forwardRef<ContentRef, ContentProps>(
     const { value, onValueChange, triggerPosition, contentLayout, setContentLayout, nativeID, setTriggerPosition } = useRootContext();
     const { value: menuValue } = useMenuContext();
 
-    React.useEffect(() => {
+    useEffect(() => {
       const backHandler = BackHandler.addEventListener("hardwareBackPress", () => {
         setTriggerPosition(null);
         setContentLayout(null);
@@ -288,16 +288,16 @@ const Content = React.forwardRef<ContentRef, ContentProps>(
 
 Content.displayName = "ContentMenubar";
 
-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 { onValueChange, setContentLayout, setTriggerPosition } = useRootContext();
 
-  function onPress(ev: GestureResponderEvent) {
+  function onPress(event: GestureResponderEvent) {
     if (closeOnPress) {
       setTriggerPosition(null);
       setContentLayout(null);
       onValueChange(undefined);
     }
-    onPressProp?.(ev);
+    onPressProp?.(event);
   }
 
   return (
@@ -316,7 +316,7 @@ const Item = React.forwardRef<ItemRef, ItemProps>(({ textValue, onPress: onPress
 
 Item.displayName = "ItemMenubar";
 
-const Group = React.forwardRef<GroupRef, GroupProps>(({ ...props }, ref) => {
+const Group = forwardRef<GroupRef, GroupProps>(({ ...props }, ref) => {
   return (
     <Component
       ref={ref}
@@ -328,7 +328,7 @@ const Group = React.forwardRef<GroupRef, GroupProps>(({ ...props }, ref) => {
 
 Group.displayName = "GroupMenubar";
 
-const Label = React.forwardRef<LabelRef, LabelProps>(({ ...props }, ref) => {
+const Label = forwardRef<LabelRef, LabelProps>(({ ...props }, ref) => {
   return (
     <Component
       ref={ref}
@@ -346,20 +346,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 { onValueChange, setTriggerPosition, setContentLayout } = useRootContext();
 
-    function onPress(ev: GestureResponderEvent) {
+    function onPress(event: GestureResponderEvent) {
       onCheckedChange(!checked);
       if (closeOnPress) {
         setTriggerPosition(null);
         setContentLayout(null);
         onValueChange(undefined);
       }
-      onPressProp?.(ev);
+      onPressProp?.(event);
     }
 
     return (
@@ -383,14 +383,14 @@ const CheckboxItem = React.forwardRef<CheckboxItemRef, CheckboxItemProps>(
 CheckboxItem.displayName = "CheckboxItemMenubar";
 
 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
@@ -408,21 +408,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 { onValueChange: onRootValueChange, setTriggerPosition, setContentLayout } = useRootContext();
 
     const { value, onValueChange } = useFormItemContext() as BothFormItemContext;
-    function onPress(ev: GestureResponderEvent) {
+    function onPress(event: GestureResponderEvent) {
       onValueChange(itemValue);
       if (closeOnPress) {
         setTriggerPosition(null);
         setContentLayout(null);
         onRootValueChange(undefined);
       }
-      onPressProp?.(ev);
+      onPressProp?.(event);
     }
 
     return (
@@ -448,10 +448,10 @@ const RadioItem = React.forwardRef<RadioItemRef, RadioItemProps>(
 RadioItem.displayName = "RadioItemMenubar";
 
 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;
 
@@ -475,7 +475,7 @@ const ItemIndicator = React.forwardRef<ItemIndicatorRef, ItemIndicatorProps>(({
 
 ItemIndicator.displayName = "ItemIndicatorMenubar";
 
-const Separator = React.forwardRef<SeparatorRef, SeparatorProps>(({ decorative, ...props }, ref) => {
+const Separator = forwardRef<SeparatorRef, SeparatorProps>(({ decorative, ...props }, ref) => {
   return (
     <Component
       role={decorative ? "presentation" : "separator"}
@@ -487,14 +487,14 @@ const Separator = React.forwardRef<SeparatorRef, SeparatorProps>(({ decorative,
 
 Separator.displayName = "SeparatorMenubar";
 
-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,
@@ -520,19 +520,19 @@ const Sub = React.forwardRef<SubRef, SubProps>(({ defaultOpen, open: openProp, o
 Sub.displayName = "SubMenubar";
 
 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 (
@@ -553,7 +553,7 @@ const SubTrigger = React.forwardRef<SubTriggerRef, SubTriggerProps>(({ textValue
 
 SubTrigger.displayName = "SubTriggerMenubar";
 
-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) {