@coze-arch/cli 0.0.10-alpha.11b7ea → 0.0.10-alpha.954690

package/lib/__templates__/expo/client/heroui/components/accordion/accordion.tsx

@@ -1,340 +0,0 @@
-import { Children, forwardRef, useMemo } from 'react';
-import { View } from 'react-native';
-import Animated from 'react-native-reanimated';
-import { useThemeColor } from '../../helpers/external/hooks';
-import { ChevronDownIcon } from '../../helpers/internal/components';
-import { AnimationSettingsProvider } from '../../helpers/internal/contexts';
-import type { ViewRef } from '../../helpers/internal/types';
-import { createContext } from '../../helpers/internal/utils';
-import * as AccordionPrimitive from '../../primitives/accordion';
-import {
-  AccordionAnimationProvider,
-  useAccordionAnimation,
-  useAccordionContentAnimation,
-  useAccordionIndicatorAnimation,
-  useAccordionRootAnimation,
-} from './accordion.animation';
-import { DEFAULT_ICON_SIZE, DISPLAY_NAME } from './accordion.constants';
-import { accordionClassNames, accordionStyleSheet } from './accordion.styles';
-import type {
-  AccordionContentProps,
-  AccordionContextValue,
-  AccordionIndicatorProps,
-  AccordionItemProps,
-  AccordionItemRenderProps,
-  AccordionRootProps,
-  AccordionTriggerProps,
-} from './accordion.types';
-
-const AnimatedRootView = Animated.createAnimatedComponent(
-  AccordionPrimitive.Root
-);
-
-const AnimatedItemView = Animated.createAnimatedComponent(
-  AccordionPrimitive.Item
-);
-
-const AnimatedIndicator = Animated.createAnimatedComponent(
-  AccordionPrimitive.Indicator
-);
-
-// ------------------------------------------------------------------------------
-
-const [AccordionInnerProvider, useAccordionInnerContext] =
-  createContext<AccordionContextValue>({
-    name: 'AccordionInnerContext',
-  });
-
-const useAccordion = AccordionPrimitive.useRootContext;
-const useAccordionItem = AccordionPrimitive.useItemContext;
-
-// ------------------------------------------------------------------------------
-
-const Root = forwardRef<View, AccordionRootProps>((props, ref) => {
-  const {
-    children,
-    variant = 'default',
-    hideSeparator = false,
-    className,
-    classNames,
-    styles,
-    style,
-    animation,
-    ...restProps
-  } = props;
-
-  const { container, separator } = accordionClassNames.root({ variant });
-
-  const containerClassName = container({
-    className: [className, classNames?.container],
-  });
-
-  const separatorClassName = separator({ className: classNames?.separator });
-
-  const { layoutTransition, isAllAnimationsDisabled } =
-    useAccordionRootAnimation({
-      animation,
-    });
-
-  const contextValue: AccordionContextValue = useMemo(
-    () => ({
-      variant,
-    }),
-    [variant]
-  );
-
-  const animationSettingsContextValue = useMemo(
-    () => ({
-      isAllAnimationsDisabled,
-    }),
-    [isAllAnimationsDisabled]
-  );
-
-  const animationContextValue = useMemo(
-    () => ({
-      layoutTransition,
-    }),
-    [layoutTransition]
-  );
-
-  return (
-    <AnimationSettingsProvider value={animationSettingsContextValue}>
-      <AccordionAnimationProvider value={animationContextValue}>
-        <AccordionInnerProvider value={contextValue}>
-          <AnimatedRootView
-            ref={ref}
-            className={containerClassName}
-            style={[accordionStyleSheet.root, style, styles?.container]}
-            layout={layoutTransition}
-            {...restProps}
-          >
-            {Children.map(children, (child, index) => (
-              <>
-                {child}
-                {!hideSeparator && index < Children.count(children) - 1 && (
-                  <Animated.View
-                    className={separatorClassName}
-                    style={styles?.separator}
-                    layout={layoutTransition}
-                  />
-                )}
-              </>
-            ))}
-          </AnimatedRootView>
-        </AccordionInnerProvider>
-      </AccordionAnimationProvider>
-    </AnimationSettingsProvider>
-  );
-});
-
-// ------------------------------------------------------------------------------
-
-const Item = forwardRef<View, AccordionItemProps>((props, ref) => {
-  const {
-    children,
-    value,
-    layout: layoutProp,
-    className,
-    isDisabled: isDisabledProp,
-    ...restProps
-  } = props;
-
-  const itemClassName = accordionClassNames.item({ className });
-
-  const { layoutTransition } = useAccordionAnimation();
-  const { value: rootValue } = useAccordion();
-
-  const itemValue = value as string;
-
-  const isExpanded = Array.isArray(rootValue)
-    ? rootValue.includes(itemValue)
-    : rootValue === itemValue;
-
-  const renderProps: AccordionItemRenderProps = useMemo(
-    () => ({
-      isExpanded,
-      value: itemValue,
-    }),
-    [isExpanded, itemValue]
-  );
-
-  const content =
-    typeof children === 'function' ? children(renderProps) : children;
-
-  return (
-    <AnimatedItemView
-      ref={ref}
-      layout={layoutProp || layoutTransition}
-      value={value}
-      className={itemClassName}
-      isDisabled={isDisabledProp}
-      {...restProps}
-    >
-      {content}
-    </AnimatedItemView>
-  );
-});
-
-// ------------------------------------------------------------------------------
-
-const Trigger = forwardRef<View, AccordionTriggerProps>((props, ref) => {
-  const { children, className, ...restProps } = props;
-
-  const { variant } = useAccordionInnerContext();
-
-  const triggerClassName = accordionClassNames.trigger({
-    variant,
-    className,
-  });
-
-  return (
-    <AccordionPrimitive.Header>
-      <AccordionPrimitive.Trigger
-        ref={ref}
-        className={triggerClassName}
-        {...restProps}
-      >
-        {children}
-      </AccordionPrimitive.Trigger>
-    </AccordionPrimitive.Header>
-  );
-});
-
-// ------------------------------------------------------------------------------
-
-const Indicator = forwardRef<ViewRef, AccordionIndicatorProps>((props, ref) => {
-  const {
-    children,
-    className,
-    iconProps,
-    animation,
-    isAnimatedStyleActive = true,
-    style,
-    ...restProps
-  } = props;
-
-  const { isExpanded } = useAccordionItem();
-
-  const themeColorForeground = useThemeColor('foreground');
-
-  const indicatorClassName = accordionClassNames.indicator({ className });
-
-  const { rContainerStyle } = useAccordionIndicatorAnimation({
-    animation,
-    isExpanded,
-  });
-
-  const indicatorStyle = isAnimatedStyleActive
-    ? [rContainerStyle, style]
-    : style;
-
-  if (children) {
-    return (
-      <AnimatedIndicator
-        ref={ref}
-        className={indicatorClassName}
-        style={style}
-        {...restProps}
-      >
-        {children}
-      </AnimatedIndicator>
-    );
-  }
-
-  return (
-    <AnimatedIndicator
-      ref={ref}
-      className={indicatorClassName}
-      style={indicatorStyle}
-      {...restProps}
-    >
-      <ChevronDownIcon
-        size={iconProps?.size ?? DEFAULT_ICON_SIZE}
-        color={iconProps?.color ?? themeColorForeground}
-      />
-    </AnimatedIndicator>
-  );
-});
-
-// ------------------------------------------------------------------------------
-
-const Content = forwardRef<View, AccordionContentProps>((props, ref) => {
-  const { children, className, animation, ...restProps } = props;
-
-  const { variant } = useAccordionInnerContext();
-
-  const { isExpanded } = useAccordionItem();
-
-  const contentClassName = accordionClassNames.content({ variant, className });
-
-  const { entering: animatedEntering, exiting: animatedExiting } =
-    useAccordionContentAnimation({
-      animation,
-    });
-
-  if (!isExpanded) {
-    return null;
-  }
-
-  return (
-    <Animated.View entering={animatedEntering} exiting={animatedExiting}>
-      <AccordionPrimitive.Content
-        ref={ref}
-        className={contentClassName}
-        {...restProps}
-      >
-        {children}
-      </AccordionPrimitive.Content>
-    </Animated.View>
-  );
-});
-
-// ------------------------------------------------------------------------------
-
-Root.displayName = DISPLAY_NAME.ROOT;
-Item.displayName = DISPLAY_NAME.ITEM;
-Trigger.displayName = DISPLAY_NAME.TRIGGER;
-Indicator.displayName = DISPLAY_NAME.INDICATOR;
-Content.displayName = DISPLAY_NAME.CONTENT;
-
-/**
- * Compound Accordion component with sub-components
- *
- * @component Accordion - Main container that manages the accordion state and behavior.
- * Controls expansion/collapse of items, supports single or multiple selection modes,
- * and provides variant styling (default or surface).
- *
- * @component Accordion.Item - Container for individual accordion items.
- * Wraps the trigger and content, managing the expanded state for each item.
- * Supports render function children that receive expansion state.
- *
- * @component Accordion.Trigger - Interactive element that toggles item expansion.
- * Built on Header and Trigger primitives.
- *
- * @component Accordion.Indicator - Optional visual indicator showing expansion state.
- * Defaults to an animated chevron icon that rotates based on item state.
- * Supports custom animation configuration.
- *
- * @component Accordion.Content - Container for expandable content.
- * Animated with layout transitions for smooth expand/collapse effects.
- * Supports custom entering and exiting animations.
- *
- * Props flow from Accordion to sub-components via context (variant).
- * Animation state flows via AccordionAnimationProvider.
- * Item expansion state is managed by the primitive accordion context.
- *
- * @see Full documentation: https://v3.heroui.com/docs/native/components/accordion
- */
-const CompoundAccordion = Object.assign(Root, {
-  /** @required Container for individual accordion items */
-  Item,
-  /** @required Interactive trigger element */
-  Trigger,
-  /** @optional Visual indicator showing expansion state (defaults to chevron) */
-  Indicator,
-  /** @required Container for expandable content with animations */
-  Content,
-});
-
-export default CompoundAccordion;
-export { useAccordion, useAccordionItem };

package/lib/__templates__/expo/client/heroui/components/accordion/accordion.types.ts

@@ -1,267 +0,0 @@
-import type { ViewStyle } from 'react-native';
-import type {
-  AnimatedProps,
-  EntryOrExitLayoutType,
-  WithSpringConfig,
-} from 'react-native-reanimated';
-import type {
-  Animation,
-  AnimationRoot,
-  AnimationValue,
-  ElementSlots,
-  LayoutTransition,
-} from '../../helpers/internal/types';
-import type {
-  ContentProps as PrimitiveContentProps,
-  IndicatorProps as PrimitiveIndicatorProps,
-  ItemProps as PrimitiveItemProps,
-  RootProps as PrimitiveRootProps,
-  TriggerProps as PrimitiveTriggerProps,
-} from '../../primitives/accordion';
-import type { RootSlots } from './accordion.styles';
-
-/**
- * Variant types for the Accordion component
- */
-export type AccordionVariant = 'default' | 'surface';
-
-/**
- * Icon props for the Accordion.Indicator component
- */
-export interface AccordionIndicatorIconProps {
-  /**
-   * Size of the icon
-   * @default 16
-   */
-  size?: number;
-  /**
-   * Color of the icon
-   * @default foreground
-   */
-  color?: string;
-}
-
-/**
- * Animation configuration for accordion root component
- */
-export type AccordionRootAnimation = AnimationRoot<{
-  layout?: AnimationValue<{
-    /**
-     * Custom layout animation for accordion transitions
-     * @default LinearTransition.springify().damping(140).stiffness(1600).mass(4)
-     */
-    value?: LayoutTransition;
-  }>;
-}>;
-
-/**
- * Props for the Accordion root component
- */
-export type AccordionRootProps = Omit<
-  AnimatedProps<PrimitiveRootProps>,
-  'layout'
-> & {
-  /**
-   * Children elements to be rendered inside the accordion
-   */
-  children?: React.ReactNode;
-  /**
-   * Visual variant of the accordion
-   * @default 'default'
-   */
-  variant?: AccordionVariant;
-  /**
-   * Whether to hide the separator between accordion items
-   * @default false
-   */
-  hideSeparator?: boolean;
-  /**
-   * Additional CSS classes for the container
-   */
-  className?: string;
-  /**
-   * Additional CSS classes for the slots
-   */
-  classNames?: ElementSlots<RootSlots>;
-  /**
-   * Styles for different parts of the accordion root
-   */
-  styles?: Partial<Record<RootSlots, ViewStyle>>;
-  /**
-   * Animation configuration for accordion
-   * - `false` or `"disabled"`: Disable only root animations
-   * - `"disable-all"`: Disable all animations including children
-   * - `true` or `undefined`: Use default animations
-   * - `object`: Custom animation configuration
-   */
-  animation?: AccordionRootAnimation;
-};
-
-/**
- * Render function props for accordion item children
- */
-export type AccordionItemRenderProps = {
-  /**
-   * Whether the accordion item is currently expanded
-   */
-  isExpanded: boolean;
-  /**
-   * Unique value identifier for this accordion item
-   */
-  value: string;
-};
-
-/**
- * Props for the Accordion.Item component
- */
-export interface AccordionItemProps
-  extends Omit<AnimatedProps<PrimitiveItemProps>, 'children'> {
-  /**
-   * Children elements to be rendered inside the accordion item, or a render function
-   */
-  children?:
-    | React.ReactNode
-    | ((props: AccordionItemRenderProps) => React.ReactNode);
-  /**
-   * Additional CSS classes
-   */
-  className?: string;
-}
-
-/**
- * Props for the Accordion.Trigger component
- */
-export interface AccordionTriggerProps extends PrimitiveTriggerProps {
-  /**
-   * Children elements to be rendered inside the trigger
-   */
-  children?: React.ReactNode;
-  /**
-   * Additional CSS classes
-   */
-  className?: string;
-}
-
-/**
- * Animation configuration for accordion indicator component
- */
-export type AccordionIndicatorAnimation = Animation<{
-  rotation?: AnimationValue<{
-    /**
-     * Rotation values [collapsed, expanded] in degrees
-     * @default [0, -180]
-     */
-    value?: [number, number];
-    /**
-     * Spring animation configuration for rotation
-     * @default { damping: 140, stiffness: 1000, mass: 4 }
-     */
-    springConfig?: WithSpringConfig;
-  }>;
-}>;
-
-/**
- * Props for the Accordion.Indicator component
- */
-export interface AccordionIndicatorProps
-  extends AnimatedProps<PrimitiveIndicatorProps> {
-  /**
-   * Custom indicator content, if not provided defaults to animated chevron
-   */
-  children?: React.ReactNode;
-  /**
-   * Additional CSS classes
-   *
-   * @note The following style properties are occupied by animations and cannot be set via className:
-   * - `transform` (specifically `rotate`) - Animated for expand/collapse rotation transitions
-   *
-   * To customize this property, use the `animation` prop:
-   * ```tsx
-   * <Accordion.Indicator
-   *   animation={{
-   *     rotation: { value: [0, -180], springConfig: { damping: 140, stiffness: 1000, mass: 4 } }
-   *   }}
-   * />
-   * ```
-   *
-   * To completely disable animated styles and use your own via className or style prop, set `isAnimatedStyleActive={false}`.
-   */
-  className?: string;
-  /**
-   * Icon configuration
-   */
-  iconProps?: AccordionIndicatorIconProps;
-  /**
-   * Animation configuration for indicator
-   * - `false` or `"disabled"`: Disable all animations
-   * - `true` or `undefined`: Use default animations
-   * - `object`: Custom animation configuration
-   */
-  animation?: AccordionIndicatorAnimation;
-  /**
-   * Whether animated styles (react-native-reanimated) are active
-   * When `false`, the animated style is removed and you can implement custom logic
-   * This prop should only be used when you want to write custom styling logic instead of the default animated styles
-   * @default true
-   */
-  isAnimatedStyleActive?: boolean;
-}
-
-/**
- * Animation configuration for accordion content component
- */
-export type AccordionContentAnimation = Animation<{
-  entering?: AnimationValue<{
-    /**
-     * Custom entering animation for content
-     */
-    value?: EntryOrExitLayoutType;
-  }>;
-  exiting?: AnimationValue<{
-    /**
-     * Custom exiting animation for content
-     */
-    value?: EntryOrExitLayoutType;
-  }>;
-}>;
-
-/**
- * Props for the Accordion.Content component
- */
-export interface AccordionContentProps extends PrimitiveContentProps {
-  /**
-   * Children elements to be rendered inside the content
-   */
-  children?: React.ReactNode;
-  /**
-   * Additional CSS classes
-   */
-  className?: string;
-  /**
-   * Animation configuration for content
-   * - `false` or `"disabled"`: Disable all animations
-   * - `true` or `undefined`: Use default animations
-   * - `object`: Custom animation configuration
-   */
-  animation?: AccordionContentAnimation;
-}
-
-/**
- * Context values shared between Accordion components (extends primitive context)
- */
-export interface AccordionContextValue {
-  /**
-   * Visual variant of the accordion
-   */
-  variant: AccordionVariant;
-}
-
-/**
- * Context value for accordion animation state
- */
-export interface AccordionAnimationContextValue {
-  /**
-   * Custom layout animation for accordion transitions
-   */
-  layoutTransition?: LayoutTransition;
-}

package/lib/__templates__/expo/client/heroui/components/accordion/index.ts

@@ -1,17 +0,0 @@
-export {
-  default as Accordion,
-  useAccordion,
-  useAccordionItem,
-} from './accordion';
-export { ACCORDION_LAYOUT_TRANSITION as AccordionLayoutTransition } from './accordion.constants';
-export { accordionClassNames } from './accordion.styles';
-
-export type {
-  AccordionContentProps,
-  AccordionContextValue,
-  AccordionIndicatorProps,
-  AccordionItemProps,
-  AccordionRootProps,
-  AccordionTriggerProps,
-  AccordionVariant,
-} from './accordion.types';

package/lib/__templates__/expo/client/heroui/components/alert/alert.constants.ts

@@ -1,13 +0,0 @@
-/**
- * Display names for Alert components
- */
-export const DISPLAY_NAME = {
-  ROOT: 'HeroUINative.Alert',
-  INDICATOR: 'HeroUINative.Alert.Indicator',
-  CONTENT: 'HeroUINative.Alert.Content',
-  TITLE: 'HeroUINative.Alert.Title',
-  DESCRIPTION: 'HeroUINative.Alert.Description',
-};
-
-/** Default icon size in pixels */
-export const DEFAULT_ICON_SIZE = 18;

package/lib/__templates__/expo/client/heroui/components/alert/alert.hooks.ts

@@ -1,28 +0,0 @@
-import { useThemeColor } from '../../helpers/external/hooks';
-import type { AlertStatus } from '../../primitives/alert/alert.types';
-
-/**
- * Resolves the default icon color based on the current alert status.
- */
-export function useStatusColor(status: AlertStatus): string {
-  const [foreground, accent, success, warning, danger] = useThemeColor([
-    'foreground',
-    'accent',
-    'success',
-    'warning',
-    'danger',
-  ]);
-
-  switch (status) {
-    case 'accent':
-      return accent;
-    case 'success':
-      return success;
-    case 'warning':
-      return warning;
-    case 'danger':
-      return danger;
-    default:
-      return foreground;
-  }
-}