Компоненты/Apple Intelligence

Apple Intelligence

Pro
22 февраля 2026

Оверлей в духе Apple Intelligence

Установка

import { useEffect, useMemo } from "react";
import Animated, { useSharedValue } from "react-native-reanimated";
import { StyleSheet, View } from "react-native";

Установка через CLIPro

Команда станет доступна после оформления Pro.

Оформить ProВойти

Файлы

index.tsx
НазадРамка Apple IntelligenceДалееКарточка подтверждения

Вручную

Поставьте зависимости:

npm install @shopify/react-native-skia react-native-reanimated react-native-worklets
pnpm add @shopify/react-native-skia react-native-reanimated react-native-worklets
yarn add @shopify/react-native-skia react-native-reanimated react-native-worklets
bun add @shopify/react-native-skia react-native-reanimated react-native-worklets

Скопируйте эти файлы в src/shared/components/organisms/apple-intelligence/:

index.tsx
import { useEffect, useMemo } from "react";
import Animated, { useSharedValue } from "react-native-reanimated";
import { StyleSheet, View } from "react-native";
 
// Полный исходник открывается с подпиской Pro
export interface AppleIntelligenceProps {
  speed?: number;
  intensity?: number;
  palette?: "aurora" | "mono";
  interactive?: boolean;
}
 
export function AppleIntelligence({
  speed = 1,
  intensity = 0.6,
  interactive = true,
}: AppleIntelligenceProps) {
  const progress = useSharedValue(0);
  const frame = useMemo(() => createFrame(speed), [speed]);
 
  useEffect(() => {
    // …

Код доступен по подпискеPro

Исходник «Apple Intelligence» открывается с подпиской Pro. Уже оформили? Войдите в аккаунт.

Оформить ProВойти

Проверьте алиас путей. Импорты в коде выше записаны так, как их пишет astra-rn add: @/shared/components, @/shared/utils и @/shared/hooks. Нужен алиас "@/*": ["./src/*"] в tsconfig.json — или поправьте импорты под свои пути.

Использование

usage.tsx
import { useEffect, useMemo } from "react";
import Animated, { useSharedValue } from "react-native-reanimated";
import { StyleSheet, View } from "react-native";
 
// Полный исходник открывается с подпиской Pro
export interface AppleIntelligenceProps {
  speed?: number;
  intensity?: number;
  palette?: "aurora" | "mono";
  interactive?: boolean;
}
 
export function AppleIntelligence({
  speed = 1,
  intensity = 0.6,
  interactive = true,
}: AppleIntelligenceProps) {
  const progress = useSharedValue(0);
  const frame = useMemo(() => createFrame(speed), [speed]);
 
  useEffect(() => {
    // …

Код доступен по подпискеPro

Исходник «Apple Intelligence» открывается с подпиской Pro. Уже оформили? Войдите в аккаунт.

Оформить ProВойти

Пропсы

Пропс
Описание
children

Тип ReactNode

introDuration?

Тип number

outroDuration?

Тип number

wave?

Тип ISiriWaveConfig

noise?

Тип ISiriNoiseConfig

glow?

Тип ISiriGlowConfig

shimmer?

Тип ISiriShimmerConfig

border?

Тип ISiriBorderConfig

ISiriToggleOptions

Пропс
Описание
wave?

Тип ISiriWaveConfig

noise?

Тип ISiriNoiseConfig

glow?

Тип ISiriGlowConfig

shimmer?

Тип ISiriShimmerConfig

border?

Тип ISiriBorderConfig