@coze-arch/cli 0.0.10 → 0.0.11

package/lib/__templates__/expo/client/heroui/primitives/radio/radio.tsx

@@ -0,0 +1,133 @@
+import { createContext, forwardRef, useContext } from 'react';
+import { type GestureResponderEvent, Pressable, View } from 'react-native';
+import type {
+  PressableRef,
+  SlottablePressableProps,
+} from '../../helpers/internal/types';
+import * as Slot from '../slot';
+import type {
+  IndicatorProps,
+  IndicatorRef,
+  RootContext,
+  RootProps,
+  RootRef,
+} from './radio.types';
+
+const RadioContext = createContext<RootContext | null>(null);
+
+/**
+ * Radio Root primitive component.
+ * Provides context for child compound components and renders a Trigger.
+ */
+const Root = forwardRef<RootRef, RootProps>(
+  (
+    {
+      isDisabled = false,
+      isSelected,
+      onSelectedChange,
+      isInvalid = false,
+      variant,
+      nativeID,
+      ...props
+    },
+    ref
+  ) => {
+    return (
+      <RadioContext.Provider
+        value={{
+          isDisabled,
+          isSelected,
+          onSelectedChange,
+          isInvalid,
+          variant,
+          nativeID,
+        }}
+      >
+        <Trigger ref={ref} {...props} />
+      </RadioContext.Provider>
+    );
+  }
+);
+
+Root.displayName = 'HeroUINative.Primitive.Radio.Root';
+
+/**
+ * Hook to access radio context values within compound components.
+ * Throws if used outside of a Radio component.
+ */
+function useRadioContext() {
+  const context = useContext(RadioContext);
+  if (!context) {
+    throw new Error(
+      'Radio compound components cannot be rendered outside the Radio component'
+    );
+  }
+  return context;
+}
+
+// --------------------------------------------------
+
+/**
+ * Internal Trigger component that handles press events and accessibility.
+ */
+const Trigger = forwardRef<PressableRef, SlottablePressableProps>(
+  ({ asChild, onPress: onPressProp, ...props }, ref) => {
+    const { isDisabled, isSelected, onSelectedChange, nativeID } =
+      useRadioContext();
+
+    /** Handle press by toggling selected state when not disabled */
+    function onPress(ev: GestureResponderEvent) {
+      if (isDisabled) return;
+      onSelectedChange?.(!isSelected);
+      onPressProp?.(ev);
+    }
+
+    const Component = asChild ? Slot.Pressable : Pressable;
+
+    return (
+      <Component
+        ref={ref}
+        nativeID={nativeID}
+        aria-disabled={isDisabled}
+        role="radio"
+        aria-checked={isSelected}
+        onPress={onPress}
+        accessibilityState={{
+          checked: isSelected,
+          disabled: isDisabled,
+        }}
+        disabled={isDisabled}
+        {...props}
+      />
+    );
+  }
+);
+
+Trigger.displayName = 'HeroUINative.Primitive.Radio.Trigger';
+
+// --------------------------------------------------
+
+/**
+ * Radio Indicator primitive component.
+ * Renders a visual indicator for the radio selection state.
+ */
+const Indicator = forwardRef<IndicatorRef, IndicatorProps>(
+  ({ asChild, ...props }, ref) => {
+    const { isSelected, isDisabled } = useRadioContext();
+
+    const Component = asChild ? Slot.View : View;
+    return (
+      <Component
+        ref={ref}
+        aria-disabled={isDisabled}
+        aria-hidden={!isSelected}
+        role="presentation"
+        {...props}
+      />
+    );
+  }
+);
+
+Indicator.displayName = 'HeroUINative.Primitive.Radio.Indicator';
+
+export { Indicator, Root, useRadioContext };

package/lib/__templates__/expo/client/heroui/primitives/radio/radio.types.ts

@@ -0,0 +1,47 @@
+import type {
+  PressableRef,
+  SlottablePressableProps,
+  SlottableViewProps,
+  ViewRef,
+} from '../../helpers/internal/types';
+
+/**
+ * Internal context interface extending RootProps with nativeID
+ */
+export interface RootContext extends RootProps {
+  /** Native ID for the radio element */
+  nativeID?: string;
+}
+
+/**
+ * Props for the radio root component.
+ *
+ * @extends SlottablePressableProps Inherits pressable props except 'disabled'
+ */
+type RootProps = Omit<SlottablePressableProps, 'disabled'> & {
+  /** Whether the radio is currently selected */
+  isSelected?: boolean;
+  /** Callback fired when the radio selection state changes */
+  onSelectedChange?: (isSelected: boolean) => void;
+  /** Whether the radio is disabled and cannot be interacted with */
+  isDisabled?: boolean;
+  /** Whether the radio is in an invalid state @default false */
+  isInvalid?: boolean;
+  /** Variant style for the radio */
+  variant?: 'primary' | 'secondary';
+};
+
+/**
+ * Props for the radio indicator component.
+ *
+ * @extends SlottableViewProps Inherits view props except 'disabled'
+ */
+type IndicatorProps = Omit<SlottableViewProps, 'disabled'>;
+
+/** Reference type for the radio root component */
+type RootRef = PressableRef;
+
+/** Reference type for the radio indicator component */
+type IndicatorRef = ViewRef;
+
+export type { IndicatorProps, IndicatorRef, RootProps, RootRef };

package/lib/__templates__/expo/client/heroui/primitives/radio-group/index.ts

@@ -0,0 +1,2 @@
+export * from './radio-group';
+export * from './radio-group.types';

package/lib/__templates__/expo/client/heroui/primitives/radio-group/radio-group.tsx

@@ -0,0 +1,114 @@
+import { createContext, forwardRef, useContext } from 'react';
+import { Pressable, View, type GestureResponderEvent } from 'react-native';
+import * as Slot from '../slot';
+import type {
+  IndicatorProps,
+  IndicatorRef,
+  ItemProps,
+  ItemRef,
+  RootProps,
+  RootRef,
+} from './radio-group.types';
+
+const RadioGroupContext = createContext<RootProps | null>(null);
+
+const Root = forwardRef<RootRef, RootProps>(
+  (
+    {
+      asChild,
+      value,
+      onValueChange,
+      isDisabled = false,
+      isInvalid = false,
+      variant,
+      ...viewProps
+    },
+    ref
+  ) => {
+    const Component = asChild ? Slot.View : View;
+
+    return (
+      <RadioGroupContext.Provider
+        value={{
+          value,
+          isDisabled,
+          onValueChange,
+          isInvalid,
+          variant,
+        }}
+      >
+        <Component ref={ref} role="radiogroup" {...viewProps} />
+      </RadioGroupContext.Provider>
+    );
+  }
+);
+
+Root.displayName = 'HeroUINative.Primitive.RadioGroup.Root';
+
+function useRadioGroupContext() {
+  const context = useContext(RadioGroupContext);
+
+  if (!context) {
+    throw new Error(
+      'RadioGroup compound components cannot be rendered outside the RadioGroup component'
+    );
+  }
+
+  return context;
+}
+
+// --------------------------------------------------
+
+const Item = forwardRef<ItemRef, ItemProps>(
+  (
+    {
+      asChild,
+      value: itemValue,
+      isDisabled: disabledProp = false,
+      onPress: onPressProp,
+      ...props
+    },
+    ref
+  ) => {
+    const { isDisabled, value, onValueChange } = useRadioGroupContext();
+
+    function onPress(ev: GestureResponderEvent) {
+      if (isDisabled || disabledProp) return;
+      onValueChange(itemValue);
+      onPressProp?.(ev);
+    }
+
+    const Component = asChild ? Slot.Pressable : Pressable;
+
+    return (
+      <Component
+        ref={ref}
+        role="radio"
+        onPress={onPress}
+        aria-checked={value === itemValue}
+        disabled={(isDisabled || disabledProp) ?? false}
+        accessibilityState={{
+          disabled: (isDisabled || disabledProp) ?? false,
+          checked: value === itemValue,
+        }}
+        {...props}
+      />
+    );
+  }
+);
+
+Item.displayName = 'HeroUINative.Primitive.RadioGroup.Item';
+
+// --------------------------------------------------
+
+const Indicator = forwardRef<IndicatorRef, IndicatorProps>(
+  ({ asChild, ...props }, ref) => {
+    const Component = asChild ? Slot.View : View;
+
+    return <Component ref={ref} role="presentation" {...props} />;
+  }
+);
+
+Indicator.displayName = 'HeroUINative.Primitive.RadioGroup.Indicator';
+
+export { Indicator, Item, Root, useRadioGroupContext };

package/lib/__templates__/expo/client/heroui/primitives/radio-group/radio-group.types.ts

@@ -0,0 +1,65 @@
+import {
+  type ForceMountable,
+  type PressableRef,
+  type SlottablePressableProps,
+  type SlottableViewProps,
+  type ViewRef,
+} from '../../helpers/internal/types';
+
+/**
+ * Props for the radio group root component.
+ *
+ * @extends SlottableViewProps Inherits view props except 'disabled'
+ */
+type RootProps = Omit<SlottableViewProps, 'disabled'> & {
+  /** The currently selected value of the radio group */
+  value: string | undefined;
+  /** Callback fired when the selected value changes */
+  onValueChange: (val: string) => void;
+  /** Whether the entire radio group is disabled */
+  isDisabled?: boolean;
+  /** Whether the radio group is invalid @default false */
+  isInvalid?: boolean;
+  /** Variant style for the radio group */
+  variant?: 'primary' | 'secondary';
+};
+
+/**
+ * Props for the radio group item component.
+ *
+ * @extends SlottablePressableProps Inherits pressable props except 'disabled'
+ */
+type ItemProps = Omit<SlottablePressableProps, 'disabled'> & {
+  /** Whether this specific radio item is disabled */
+  'isDisabled'?: boolean;
+  /** The value associated with this radio item */
+  'value': string;
+  /** ID of the element that labels this radio item */
+  'aria-labelledby'?: string;
+};
+
+/**
+ * Props for the radio group indicator component.
+ *
+ * @extends SlottableViewProps Inherits view props
+ * @extends ForceMountable Supports forced mounting behavior
+ */
+type IndicatorProps = SlottableViewProps & ForceMountable;
+
+/** Reference type for the radio group root component */
+type RootRef = ViewRef;
+
+/** Reference type for the radio group item component */
+type ItemRef = PressableRef;
+
+/** Reference type for the radio group indicator component */
+type IndicatorRef = ViewRef;
+
+export type {
+  IndicatorProps,
+  IndicatorRef,
+  ItemProps,
+  ItemRef,
+  RootProps,
+  RootRef,
+};

package/lib/__templates__/expo/client/heroui/primitives/select/index.ts

@@ -0,0 +1,2 @@
+export * from './select';
+export * from './select.types';