janisslsm/discord-decomp
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

yeet

Browse Source
This commit is contained in:
janisslsm committed 2026-11-01 12:12:55 +02:00
1 parent 1781d25a15
commit 732c0ad767
33051 files changed
+2591613 -3019689
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

design/animation/reanimated/AccessibilityPreferencesSharedValue.native.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 4192 (f4193).
import { makeMutable } from "../../../modules/reanimated/ReanimatedRexport";
const r14 = makeMutable({
reduceMotion: false,
prefersCrossfades: false,
screenReaderEnabled: false
});
export { r14 as accessibilityPreferencesSharedValue };
design/animation/reanimated/ReanimatedConstants.tsx
+12
View File
@@ -0,0 +1,12 @@
// Metro module 4191 (f4192).
import { ReduceMotion } from "../../../modules/reanimated/ReanimatedRexport";
const r17 = {
duration: 1,
reduceMotion: ReduceMotion.Always
};
const r18 = {
...r17,
reduceMotion: void 0
};
export { r17 as CONFIG_NEVER_ANIMATE };
export { r18 as CONFIG_NEVER_ANIMATE_TIMING };
design/animation/reanimated/spring/spring.tsx
+35
View File
@@ -0,0 +1,35 @@
// Metro module 4599 (f4600).
import { CONFIG_NEVER_ANIMATE } from "../ReanimatedConstants";
import * as _AccessibilityPreferencesSharedValue_native from "../AccessibilityPreferencesSharedValue.native";
import * as _ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
export function withSpring(a0, a1, r7 = "respect-motion-settings") {
let r1, r17;
L11: {
L6: {
const reduceMotion = _AccessibilityPreferencesSharedValue_native.accessibilityPreferencesSharedValue.get().reduceMotion;
r1 = r7 === "animate-always";
if (!r1) {
if (r7 === "respect-motion-settings" && !reduceMotion) {
break L6;
}
r17 = CONFIG_NEVER_ANIMATE;
break L11;
}
}
r17 = r1 ? {
...a1 == null ? {} : a1,
reduceMotion: _ReanimatedRexport.ReduceMotion.Never
} : a1;
}
return _ReanimatedRexport.withSpring(a0, r17, arguments[3]);
}
withSpring.__closure = {
accessibilityPreferencesSharedValue: _AccessibilityPreferencesSharedValue_native.accessibilityPreferencesSharedValue,
CONFIG_NEVER_ANIMATE,
ReduceMotion: _ReanimatedRexport.ReduceMotion,
REAwithSpring: _ReanimatedRexport.withSpring
};
withSpring.__workletHash = 14783154107972;
withSpring.__initData = {
code: "function withSpring_springTsx1(toValue,config,shouldAnimate='respect-motion-settings',callback){const{accessibilityPreferencesSharedValue,CONFIG_NEVER_ANIMATE,ReduceMotion,REAwithSpring}=this.__closure;const reducedMotionEnabled=accessibilityPreferencesSharedValue.get().reduceMotion;const animate=shouldAnimate==='animate-always'||shouldAnimate==='respect-motion-settings'&&!reducedMotionEnabled;const configForRea=!animate?CONFIG_NEVER_ANIMATE:shouldAnimate==='animate-always'?{...(config!==null&&config!==void 0?config:{}),reduceMotion:ReduceMotion.Never}:config;return REAwithSpring(toValue,configForRea,callback);}"
};
design/animation/reanimated/spring/springPresets.tsx
+33
View File
@@ -0,0 +1,33 @@
// Metro module 4603 (f4604).
export const SUBTLE_SPRING = {
mass: 1,
damping: 27,
stiffness: 300
};
export const ON_PRESS_SPRING = {
mass: 1,
overshootClamping: true,
damping: 27,
stiffness: 300
};
export const springSlow = {
mass: 1,
damping: 30,
stiffness: 380
};
export const springUnclamped = {
mass: 0.35,
damping: 13,
stiffness: 250
};
export const springUnclampedBounce = {
mass: 0.3,
damping: 13,
stiffness: 250
};
export const springStandard = {
mass: 0.35,
damping: 13,
stiffness: 250,
overshootClamping: true
};
design/animation/reanimated/timing/timing.tsx
+35
View File
@@ -0,0 +1,35 @@
// Metro module 4190 (f4191).
import { CONFIG_NEVER_ANIMATE_TIMING } from "../ReanimatedConstants";
import * as _AccessibilityPreferencesSharedValue_native from "../AccessibilityPreferencesSharedValue.native";
import * as _ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
export function withTiming(a0, a1, r7 = "respect-motion-settings") {
let r1, r17;
L11: {
L6: {
const reduceMotion = _AccessibilityPreferencesSharedValue_native.accessibilityPreferencesSharedValue.get().reduceMotion;
r1 = r7 === "animate-always";
if (!r1) {
if (r7 === "respect-motion-settings" && !reduceMotion) {
break L6;
}
r17 = CONFIG_NEVER_ANIMATE_TIMING;
break L11;
}
}
r17 = r1 ? {
...a1 == null ? {} : a1,
reduceMotion: _ReanimatedRexport.ReduceMotion.Never
} : a1;
}
return _ReanimatedRexport.withTiming(a0, r17, arguments[3]);
}
withTiming.__closure = {
accessibilityPreferencesSharedValue: _AccessibilityPreferencesSharedValue_native.accessibilityPreferencesSharedValue,
CONFIG_NEVER_ANIMATE_TIMING,
ReduceMotion: _ReanimatedRexport.ReduceMotion,
REAwithTiming: _ReanimatedRexport.withTiming
};
withTiming.__workletHash = 6710776253444;
withTiming.__initData = {
code: "function withTiming_timingTsx1(toValue,config,shouldAnimate='respect-motion-settings',callback){const{accessibilityPreferencesSharedValue,CONFIG_NEVER_ANIMATE_TIMING,ReduceMotion,REAwithTiming}=this.__closure;const reducedMotionEnabled=accessibilityPreferencesSharedValue.get().reduceMotion;const animate=shouldAnimate==='animate-always'||shouldAnimate==='respect-motion-settings'&&!reducedMotionEnabled;const configForRea=!animate?CONFIG_NEVER_ANIMATE_TIMING:shouldAnimate==='animate-always'?{...(config!==null&&config!==void 0?config:{}),reduceMotion:ReduceMotion.Never}:config;return REAwithTiming(toValue,configForRea,callback);}"
};
design/animation/reanimated/timing/timingPresets.tsx
+19
View File
@@ -0,0 +1,19 @@
// Metro module 4193 (f4194).
export const timingNone = {
duration: 0
};
export const timingInstant = {
duration: 1
};
export const timingSlowDuration = 600;
export const timingSlow = {
duration: 600
};
export const timingStandardDuration = 300;
export const timingStandard = {
duration: 300
};
export const timingFastDuration = 100;
export const timingFast = {
duration: 100
};
design/assets/native.tsx
+831
View File
@@ -0,0 +1,831 @@
// Metro module 6785 (f6786).
import * as _AccountAgeTier10LargeBadge_native from "../components/mana-assets/native/generated/AccountAgeTier10LargeBadge.native";
import * as _AccountAgeTier10SmallBadge_native from "../components/mana-assets/native/generated/AccountAgeTier10SmallBadge.native";
import * as _AccountAgeTier1LargeBadge_native from "../components/mana-assets/native/generated/AccountAgeTier1LargeBadge.native";
import * as _AccountAgeTier1SmallBadge_native from "../components/mana-assets/native/generated/AccountAgeTier1SmallBadge.native";
import * as _AccountAgeTier2LargeBadge_native from "../components/mana-assets/native/generated/AccountAgeTier2LargeBadge.native";
import * as _AccountAgeTier2SmallBadge_native from "../components/mana-assets/native/generated/AccountAgeTier2SmallBadge.native";
import * as _AccountAgeTier3LargeBadge_native from "../components/mana-assets/native/generated/AccountAgeTier3LargeBadge.native";
import * as _AccountAgeTier3SmallBadge_native from "../components/mana-assets/native/generated/AccountAgeTier3SmallBadge.native";
import * as _AccountAgeTier4LargeBadge_native from "../components/mana-assets/native/generated/AccountAgeTier4LargeBadge.native";
import * as _AccountAgeTier4SmallBadge_native from "../components/mana-assets/native/generated/AccountAgeTier4SmallBadge.native";
import * as _AccountAgeTier5LargeBadge_native from "../components/mana-assets/native/generated/AccountAgeTier5LargeBadge.native";
import * as _AccountAgeTier5SmallBadge_native from "../components/mana-assets/native/generated/AccountAgeTier5SmallBadge.native";
import * as _AccountAgeTier6LargeBadge_native from "../components/mana-assets/native/generated/AccountAgeTier6LargeBadge.native";
import * as _AccountAgeTier6SmallBadge_native from "../components/mana-assets/native/generated/AccountAgeTier6SmallBadge.native";
import * as _AccountAgeTier7LargeBadge_native from "../components/mana-assets/native/generated/AccountAgeTier7LargeBadge.native";
import * as _AccountAgeTier7SmallBadge_native from "../components/mana-assets/native/generated/AccountAgeTier7SmallBadge.native";
import * as _AccountAgeTier8LargeBadge_native from "../components/mana-assets/native/generated/AccountAgeTier8LargeBadge.native";
import * as _AccountAgeTier8SmallBadge_native from "../components/mana-assets/native/generated/AccountAgeTier8SmallBadge.native";
import * as _AccountAgeTier9LargeBadge_native from "../components/mana-assets/native/generated/AccountAgeTier9LargeBadge.native";
import * as _AccountAgeTier9SmallBadge_native from "../components/mana-assets/native/generated/AccountAgeTier9SmallBadge.native";
import * as _ActivatedGem3dIllustration_native from "../components/mana-assets/native/generated/ActivatedGem3dIllustration.native";
import * as _ActivitiesIllocon_native from "../components/mana-assets/native/generated/ActivitiesIllocon.native";
import * as _AgeVerificationSpotIllustration_native from "../components/mana-assets/native/generated/AgeVerificationSpotIllustration.native";
import * as _AnimatedAvatarsAbstractUI_native from "../components/mana-assets/native/generated/AnimatedAvatarsAbstractUI.native";
import * as _AnimatedBannersAbstractUI_native from "../components/mana-assets/native/generated/AnimatedBannersAbstractUI.native";
import * as _ApiIllocon_native from "../components/mana-assets/native/generated/ApiIllocon.native";
import * as _AppleIllocon_native from "../components/mana-assets/native/generated/AppleIllocon.native";
import * as _AppsButtonSpotIllustration_native from "../components/mana-assets/native/generated/AppsButtonSpotIllustration.native";
import * as _AvatarCapExample_native from "../components/mana-assets/native/generated/AvatarCapExample.native";
import * as _AvatarClydeExample_native from "../components/mana-assets/native/generated/AvatarClydeExample.native";
import * as _AvatarDannoExample_native from "../components/mana-assets/native/generated/AvatarDannoExample.native";
import * as _AvatarDecorationsAbstractUI_native from "../components/mana-assets/native/generated/AvatarDecorationsAbstractUI.native";
import * as _AvatarDefaultExample_native from "../components/mana-assets/native/generated/AvatarDefaultExample.native";
import * as _AvatarGraggleExample_native from "../components/mana-assets/native/generated/AvatarGraggleExample.native";
import * as _AvatarLockeExample_native from "../components/mana-assets/native/generated/AvatarLockeExample.native";
import * as _AvatarLokyExample_native from "../components/mana-assets/native/generated/AvatarLokyExample.native";
import * as _AvatarMallowExample_native from "../components/mana-assets/native/generated/AvatarMallowExample.native";
import * as _AvatarMoatmonsturrExample_native from "../components/mana-assets/native/generated/AvatarMoatmonsturrExample.native";
import * as _AvatarNellyExample_native from "../components/mana-assets/native/generated/AvatarNellyExample.native";
import * as _AvatarRoseExample_native from "../components/mana-assets/native/generated/AvatarRoseExample.native";
import * as _AvatarSpellcastExample_native from "../components/mana-assets/native/generated/AvatarSpellcastExample.native";
import * as _AvatarWumpusExample_native from "../components/mana-assets/native/generated/AvatarWumpusExample.native";
import * as _BadgePacksAbstractUI_native from "../components/mana-assets/native/generated/BadgePacksAbstractUI.native";
import * as _BananaSpotIllustration_native from "../components/mana-assets/native/generated/BananaSpotIllustration.native";
import * as _BeakerIllocon_native from "../components/mana-assets/native/generated/BeakerIllocon.native";
import * as _BeeIllocon_native from "../components/mana-assets/native/generated/BeeIllocon.native";
import * as _BellSpotIllustration_native from "../components/mana-assets/native/generated/BellSpotIllustration.native";
import * as _BlossomIllocon_native from "../components/mana-assets/native/generated/BlossomIllocon.native";
import * as _BookIllocon_native from "../components/mana-assets/native/generated/BookIllocon.native";
import * as _BoostGemIllocon_native from "../components/mana-assets/native/generated/BoostGemIllocon.native";
import * as _BotIllocon_native from "../components/mana-assets/native/generated/BotIllocon.native";
import * as _BountiesPosterIllocon_native from "../components/mana-assets/native/generated/BountiesPosterIllocon.native";
import * as _BountiesPosterSpotIllustration_native from "../components/mana-assets/native/generated/BountiesPosterSpotIllustration.native";
import * as _BrushAndSwordIllocon_native from "../components/mana-assets/native/generated/BrushAndSwordIllocon.native";
import * as _BrushIllocon_native from "../components/mana-assets/native/generated/BrushIllocon.native";
import * as _BugSpotIllustration_native from "../components/mana-assets/native/generated/BugSpotIllustration.native";
import * as _BuildingBlocksSpotIllustration_native from "../components/mana-assets/native/generated/BuildingBlocksSpotIllustration.native";
import * as _BumpingFistsSpotIllustration_native from "../components/mana-assets/native/generated/BumpingFistsSpotIllustration.native";
import * as _BunnyIllocon_native from "../components/mana-assets/native/generated/BunnyIllocon.native";
import * as _ButterflyIllocon_native from "../components/mana-assets/native/generated/ButterflyIllocon.native";
import * as _CampfireSceneSpotIllustration_native from "../components/mana-assets/native/generated/CampfireSceneSpotIllustration.native";
import * as _CampfireSpotIllustration_native from "../components/mana-assets/native/generated/CampfireSpotIllustration.native";
import * as _CandyIllocon_native from "../components/mana-assets/native/generated/CandyIllocon.native";
import * as _CatIllocon_native from "../components/mana-assets/native/generated/CatIllocon.native";
import * as _CaterpillarIllocon_native from "../components/mana-assets/native/generated/CaterpillarIllocon.native";
import * as _ChairIllocon_native from "../components/mana-assets/native/generated/ChairIllocon.native";
import * as _ChatControllersSpotIllustration_native from "../components/mana-assets/native/generated/ChatControllersSpotIllustration.native";
import * as _ChestAndGemSpotIllustration_native from "../components/mana-assets/native/generated/ChestAndGemSpotIllustration.native";
import * as _CloudKeypadSpotIllustration_native from "../components/mana-assets/native/generated/CloudKeypadSpotIllustration.native";
import * as _CloverIllocon_native from "../components/mana-assets/native/generated/CloverIllocon.native";
import * as _ClydeAngledSpotIllustration_native from "../components/mana-assets/native/generated/ClydeAngledSpotIllustration.native";
import * as _ClydeAnnouncementSpotIllustration_native from "../components/mana-assets/native/generated/ClydeAnnouncementSpotIllustration.native";
import * as _ClydeCoinsSpotIllustration_native from "../components/mana-assets/native/generated/ClydeCoinsSpotIllustration.native";
import * as _ClydeHeadsetSpotIllustration_native from "../components/mana-assets/native/generated/ClydeHeadsetSpotIllustration.native";
import * as _ClydeHologramSpotIllustration_native from "../components/mana-assets/native/generated/ClydeHologramSpotIllustration.native";
import * as _ClydeShieldSpotIllustration_native from "../components/mana-assets/native/generated/ClydeShieldSpotIllustration.native";
import * as _CoinBagSpotIllustration_native from "../components/mana-assets/native/generated/CoinBagSpotIllustration.native";
import * as _CoinSlotSpotIllustration_native from "../components/mana-assets/native/generated/CoinSlotSpotIllustration.native";
import * as _CompassIllocon_native from "../components/mana-assets/native/generated/CompassIllocon.native";
import * as _CompassSpotIllustration_native from "../components/mana-assets/native/generated/CompassSpotIllustration.native";
import * as _ConnectionCablesSpotIllustration_native from "../components/mana-assets/native/generated/ConnectionCablesSpotIllustration.native";
import * as _ControllerIllocon_native from "../components/mana-assets/native/generated/ControllerIllocon.native";
import * as _ControllerSpotIllustration_native from "../components/mana-assets/native/generated/ControllerSpotIllustration.native";
import * as _CouchSpotIllustration_native from "../components/mana-assets/native/generated/CouchSpotIllustration.native";
import * as _CrosshairIllocon_native from "../components/mana-assets/native/generated/CrosshairIllocon.native";
import * as _CrownIllocon_native from "../components/mana-assets/native/generated/CrownIllocon.native";
import * as _D20SpotIllustration_native from "../components/mana-assets/native/generated/D20SpotIllustration.native";
import * as _DevCommerceTallAbstractUI_native from "../components/mana-assets/native/generated/DevCommerceTallAbstractUI.native";
import * as _DevCommerceWideAbstractUI_native from "../components/mana-assets/native/generated/DevCommerceWideAbstractUI.native";
import * as _DevIdentityTallAbstractUI_native from "../components/mana-assets/native/generated/DevIdentityTallAbstractUI.native";
import * as _DevIdentityWideAbstractUI_native from "../components/mana-assets/native/generated/DevIdentityWideAbstractUI.native";
import * as _DevQuestsTallAbstractUI_native from "../components/mana-assets/native/generated/DevQuestsTallAbstractUI.native";
import * as _DevQuestsWideAbstractUI_native from "../components/mana-assets/native/generated/DevQuestsWideAbstractUI.native";
import * as _DevSdkTallAbstractUI_native from "../components/mana-assets/native/generated/DevSdkTallAbstractUI.native";
import * as _DevSdkWideAbstractUI_native from "../components/mana-assets/native/generated/DevSdkWideAbstractUI.native";
import * as _DiamondIllocon_native from "../components/mana-assets/native/generated/DiamondIllocon.native";
import * as _DiamondSpotIllustration_native from "../components/mana-assets/native/generated/DiamondSpotIllustration.native";
import * as _DiscordNitroLockupLogo_native from "../components/mana-assets/native/generated/DiscordNitroLockupLogo.native";
import * as _DiscordQuestsLockupLogo_native from "../components/mana-assets/native/generated/DiscordQuestsLockupLogo.native";
import * as _DiscordShopLockupLogo_native from "../components/mana-assets/native/generated/DiscordShopLockupLogo.native";
import * as _DiscordSupergraphicLogo_native from "../components/mana-assets/native/generated/DiscordSupergraphicLogo.native";
import * as _DiscordWordmarkLogo_native from "../components/mana-assets/native/generated/DiscordWordmarkLogo.native";
import * as _DiscountsMicrophoneSpotIllustration_native from "../components/mana-assets/native/generated/DiscountsMicrophoneSpotIllustration.native";
import * as _DisguiseSpotIllustration_native from "../components/mana-assets/native/generated/DisguiseSpotIllustration.native";
import * as _DisplayNameAbstractUI_native from "../components/mana-assets/native/generated/DisplayNameAbstractUI.native";
import * as _DisplayNameLockeAbstractUI_native from "../components/mana-assets/native/generated/DisplayNameLockeAbstractUI.native";
import * as _DisplayNameStylesAbstractUI_native from "../components/mana-assets/native/generated/DisplayNameStylesAbstractUI.native";
import * as _DisplayNameStylesV2AbstractUI_native from "../components/mana-assets/native/generated/DisplayNameStylesV2AbstractUI.native";
import * as _DogIllocon_native from "../components/mana-assets/native/generated/DogIllocon.native";
import * as _DollarSignIllocon_native from "../components/mana-assets/native/generated/DollarSignIllocon.native";
import * as _DownloadBarIllocon_native from "../components/mana-assets/native/generated/DownloadBarIllocon.native";
import * as _DownloadIllocon_native from "../components/mana-assets/native/generated/DownloadIllocon.native";
import * as _EmojiSlotsAbstractUI_native from "../components/mana-assets/native/generated/EmojiSlotsAbstractUI.native";
import * as _EnvelopeOpenSpotIllustration_native from "../components/mana-assets/native/generated/EnvelopeOpenSpotIllustration.native";
import * as _EnvelopeSpotIllustration_native from "../components/mana-assets/native/generated/EnvelopeSpotIllustration.native";
import * as _ExperimentalCustomUrlAbstractUI_native from "../components/mana-assets/native/generated/ExperimentalCustomUrlAbstractUI.native";
import * as _ExperimentalDiscordShopLockupExperiementLogo_native from "../components/mana-assets/native/generated/ExperimentalDiscordShopLockupExperiementLogo.native";
import * as _ExperimentalGameWidgetsAbstractUI_native from "../components/mana-assets/native/generated/ExperimentalGameWidgetsAbstractUI.native";
import * as _ExperimentalGiftEnvelopeIllocon_native from "../components/mana-assets/native/generated/ExperimentalGiftEnvelopeIllocon.native";
import * as _ExperimentalMarvelRivalsWidgetAbstractUI_native from "../components/mana-assets/native/generated/ExperimentalMarvelRivalsWidgetAbstractUI.native";
import * as _FamilyKeysSpotIllustration_native from "../components/mana-assets/native/generated/FamilyKeysSpotIllustration.native";
import * as _FamilyShieldSpotIllustration_native from "../components/mana-assets/native/generated/FamilyShieldSpotIllustration.native";
import * as _FamilySpotIllustration_native from "../components/mana-assets/native/generated/FamilySpotIllustration.native";
import * as _FavoritesSpotIllustration_native from "../components/mana-assets/native/generated/FavoritesSpotIllustration.native";
import * as _FileUploadSpotIllustration_native from "../components/mana-assets/native/generated/FileUploadSpotIllustration.native";
import * as _FireIllocon_native from "../components/mana-assets/native/generated/FireIllocon.native";
import * as _FistBumpSpotIllustration_native from "../components/mana-assets/native/generated/FistBumpSpotIllustration.native";
import * as _FlowerIllocon_native from "../components/mana-assets/native/generated/FlowerIllocon.native";
import * as _ForceIllocon_native from "../components/mana-assets/native/generated/ForceIllocon.native";
import * as _FrogIllocon_native from "../components/mana-assets/native/generated/FrogIllocon.native";
import * as _GameCartridgeSpotIllustration_native from "../components/mana-assets/native/generated/GameCartridgeSpotIllustration.native";
import * as _GameDataSpotIllustration_native from "../components/mana-assets/native/generated/GameDataSpotIllustration.native";
import * as _GameDepthTier10LargeBadge_native from "../components/mana-assets/native/generated/GameDepthTier10LargeBadge.native";
import * as _GameDepthTier10SmallBadge_native from "../components/mana-assets/native/generated/GameDepthTier10SmallBadge.native";
import * as _GameDepthTier1LargeBadge_native from "../components/mana-assets/native/generated/GameDepthTier1LargeBadge.native";
import * as _GameDepthTier1SmallBadge_native from "../components/mana-assets/native/generated/GameDepthTier1SmallBadge.native";
import * as _GameDepthTier2LargeBadge_native from "../components/mana-assets/native/generated/GameDepthTier2LargeBadge.native";
import * as _GameDepthTier2SmallBadge_native from "../components/mana-assets/native/generated/GameDepthTier2SmallBadge.native";
import * as _GameDepthTier3LargeBadge_native from "../components/mana-assets/native/generated/GameDepthTier3LargeBadge.native";
import * as _GameDepthTier3SmallBadge_native from "../components/mana-assets/native/generated/GameDepthTier3SmallBadge.native";
import * as _GameDepthTier4LargeBadge_native from "../components/mana-assets/native/generated/GameDepthTier4LargeBadge.native";
import * as _GameDepthTier4SmallBadge_native from "../components/mana-assets/native/generated/GameDepthTier4SmallBadge.native";
import * as _GameDepthTier5LargeBadge_native from "../components/mana-assets/native/generated/GameDepthTier5LargeBadge.native";
import * as _GameDepthTier5SmallBadge_native from "../components/mana-assets/native/generated/GameDepthTier5SmallBadge.native";
import * as _GameDepthTier6LargeBadge_native from "../components/mana-assets/native/generated/GameDepthTier6LargeBadge.native";
import * as _GameDepthTier6SmallBadge_native from "../components/mana-assets/native/generated/GameDepthTier6SmallBadge.native";
import * as _GameDepthTier7LargeBadge_native from "../components/mana-assets/native/generated/GameDepthTier7LargeBadge.native";
import * as _GameDepthTier7SmallBadge_native from "../components/mana-assets/native/generated/GameDepthTier7SmallBadge.native";
import * as _GameDepthTier8LargeBadge_native from "../components/mana-assets/native/generated/GameDepthTier8LargeBadge.native";
import * as _GameDepthTier8SmallBadge_native from "../components/mana-assets/native/generated/GameDepthTier8SmallBadge.native";
import * as _GameDepthTier9LargeBadge_native from "../components/mana-assets/native/generated/GameDepthTier9LargeBadge.native";
import * as _GameDepthTier9SmallBadge_native from "../components/mana-assets/native/generated/GameDepthTier9SmallBadge.native";
import * as _GameDiversityTier10LargeBadge_native from "../components/mana-assets/native/generated/GameDiversityTier10LargeBadge.native";
import * as _GameDiversityTier10SmallBadge_native from "../components/mana-assets/native/generated/GameDiversityTier10SmallBadge.native";
import * as _GameDiversityTier1LargeBadge_native from "../components/mana-assets/native/generated/GameDiversityTier1LargeBadge.native";
import * as _GameDiversityTier1SmallBadge_native from "../components/mana-assets/native/generated/GameDiversityTier1SmallBadge.native";
import * as _GameDiversityTier2LargeBadge_native from "../components/mana-assets/native/generated/GameDiversityTier2LargeBadge.native";
import * as _GameDiversityTier2SmallBadge_native from "../components/mana-assets/native/generated/GameDiversityTier2SmallBadge.native";
import * as _GameDiversityTier3LargeBadge_native from "../components/mana-assets/native/generated/GameDiversityTier3LargeBadge.native";
import * as _GameDiversityTier3SmallBadge_native from "../components/mana-assets/native/generated/GameDiversityTier3SmallBadge.native";
import * as _GameDiversityTier4LargeBadge_native from "../components/mana-assets/native/generated/GameDiversityTier4LargeBadge.native";
import * as _GameDiversityTier4SmallBadge_native from "../components/mana-assets/native/generated/GameDiversityTier4SmallBadge.native";
import * as _GameDiversityTier5LargeBadge_native from "../components/mana-assets/native/generated/GameDiversityTier5LargeBadge.native";
import * as _GameDiversityTier5SmallBadge_native from "../components/mana-assets/native/generated/GameDiversityTier5SmallBadge.native";
import * as _GameDiversityTier6LargeBadge_native from "../components/mana-assets/native/generated/GameDiversityTier6LargeBadge.native";
import * as _GameDiversityTier6SmallBadge_native from "../components/mana-assets/native/generated/GameDiversityTier6SmallBadge.native";
import * as _GameDiversityTier7LargeBadge_native from "../components/mana-assets/native/generated/GameDiversityTier7LargeBadge.native";
import * as _GameDiversityTier7SmallBadge_native from "../components/mana-assets/native/generated/GameDiversityTier7SmallBadge.native";
import * as _GameDiversityTier8LargeBadge_native from "../components/mana-assets/native/generated/GameDiversityTier8LargeBadge.native";
import * as _GameDiversityTier8SmallBadge_native from "../components/mana-assets/native/generated/GameDiversityTier8SmallBadge.native";
import * as _GameDiversityTier9LargeBadge_native from "../components/mana-assets/native/generated/GameDiversityTier9LargeBadge.native";
import * as _GameDiversityTier9SmallBadge_native from "../components/mana-assets/native/generated/GameDiversityTier9SmallBadge.native";
import * as _GamePresenceIllocon_native from "../components/mana-assets/native/generated/GamePresenceIllocon.native";
import * as _GameServerAbstractUI_native from "../components/mana-assets/native/generated/GameServerAbstractUI.native";
import * as _GameplayAbstractUI_native from "../components/mana-assets/native/generated/GameplayAbstractUI.native";
import * as _GemHero3dIllustration_native from "../components/mana-assets/native/generated/GemHero3dIllustration.native";
import * as _GemIllocon_native from "../components/mana-assets/native/generated/GemIllocon.native";
import * as _GemInHandSpotIllustration_native from "../components/mana-assets/native/generated/GemInHandSpotIllustration.native";
import * as _GemLeftForward3dIllustration_native from "../components/mana-assets/native/generated/GemLeftForward3dIllustration.native";
import * as _GemLeftUpwards3dIllustration_native from "../components/mana-assets/native/generated/GemLeftUpwards3dIllustration.native";
import * as _GemLevel1Illocon_native from "../components/mana-assets/native/generated/GemLevel1Illocon.native";
import * as _GemLevel1SpotIllustration_native from "../components/mana-assets/native/generated/GemLevel1SpotIllustration.native";
import * as _GemLevel2Illocon_native from "../components/mana-assets/native/generated/GemLevel2Illocon.native";
import * as _GemLevel2SpotIllustration_native from "../components/mana-assets/native/generated/GemLevel2SpotIllustration.native";
import * as _GemLevel3Illocon_native from "../components/mana-assets/native/generated/GemLevel3Illocon.native";
import * as _GemLevel3SpotIllustration_native from "../components/mana-assets/native/generated/GemLevel3SpotIllustration.native";
import * as _GemRightBackward3dIllustration_native from "../components/mana-assets/native/generated/GemRightBackward3dIllustration.native";
import * as _GemRightUpwards3dIllustration_native from "../components/mana-assets/native/generated/GemRightUpwards3dIllustration.native";
import * as _GemSpotIllustration_native from "../components/mana-assets/native/generated/GemSpotIllustration.native";
import * as _GiftBagFlyingSpotIllustration_native from "../components/mana-assets/native/generated/GiftBagFlyingSpotIllustration.native";
import * as _GiftBagGlowSpotIllustration_native from "../components/mana-assets/native/generated/GiftBagGlowSpotIllustration.native";
import * as _GiftBoxSpotIllustration_native from "../components/mana-assets/native/generated/GiftBoxSpotIllustration.native";
import * as _GiftCardAvatar3dIllustration_native from "../components/mana-assets/native/generated/GiftCardAvatar3dIllustration.native";
import * as _GiftCardFan3dIllustration_native from "../components/mana-assets/native/generated/GiftCardFan3dIllustration.native";
import * as _GiftCardLeft3dIllustration_native from "../components/mana-assets/native/generated/GiftCardLeft3dIllustration.native";
import * as _GiftCardRedeem3dIllustration_native from "../components/mana-assets/native/generated/GiftCardRedeem3dIllustration.native";
import * as _GiftCardRight3dIllustration_native from "../components/mana-assets/native/generated/GiftCardRight3dIllustration.native";
import * as _GiftCardSingle3dIllustration_native from "../components/mana-assets/native/generated/GiftCardSingle3dIllustration.native";
import * as _GiftCardStack3dIllustration_native from "../components/mana-assets/native/generated/GiftCardStack3dIllustration.native";
import * as _GiftCardTwoLeft3dIllustration_native from "../components/mana-assets/native/generated/GiftCardTwoLeft3dIllustration.native";
import * as _GiftCardTwoRight3dIllustration_native from "../components/mana-assets/native/generated/GiftCardTwoRight3dIllustration.native";
import * as _GiftCardWallet3dIllustration_native from "../components/mana-assets/native/generated/GiftCardWallet3dIllustration.native";
import * as _GiftTrollIllocon_native from "../components/mana-assets/native/generated/GiftTrollIllocon.native";
import * as _GiftingTier1LargeBadge_native from "../components/mana-assets/native/generated/GiftingTier1LargeBadge.native";
import * as _GiftingTier1SmallBadge_native from "../components/mana-assets/native/generated/GiftingTier1SmallBadge.native";
import * as _GiftingTier2LargeBadge_native from "../components/mana-assets/native/generated/GiftingTier2LargeBadge.native";
import * as _GiftingTier2SmallBadge_native from "../components/mana-assets/native/generated/GiftingTier2SmallBadge.native";
import * as _GiftingTier3LargeBadge_native from "../components/mana-assets/native/generated/GiftingTier3LargeBadge.native";
import * as _GiftingTier3SmallBadge_native from "../components/mana-assets/native/generated/GiftingTier3SmallBadge.native";
import * as _GiftingTier4LargeBadge_native from "../components/mana-assets/native/generated/GiftingTier4LargeBadge.native";
import * as _GiftingTier4SmallBadge_native from "../components/mana-assets/native/generated/GiftingTier4SmallBadge.native";
import * as _GiftingTier5LargeBadge_native from "../components/mana-assets/native/generated/GiftingTier5LargeBadge.native";
import * as _GiftingTier5SmallBadge_native from "../components/mana-assets/native/generated/GiftingTier5SmallBadge.native";
import * as _GiftingTier6LargeBadge_native from "../components/mana-assets/native/generated/GiftingTier6LargeBadge.native";
import * as _GiftingTier6SmallBadge_native from "../components/mana-assets/native/generated/GiftingTier6SmallBadge.native";
import * as _GoatIllocon_native from "../components/mana-assets/native/generated/GoatIllocon.native";
import * as _GroupGamingSpotIllustration_native from "../components/mana-assets/native/generated/GroupGamingSpotIllustration.native";
import * as _GuidelinesIllocon_native from "../components/mana-assets/native/generated/GuidelinesIllocon.native";
import * as _HandheldSpotIllustration_native from "../components/mana-assets/native/generated/HandheldSpotIllustration.native";
import * as _HdAudioSpotIllustration_native from "../components/mana-assets/native/generated/HdAudioSpotIllustration.native";
import * as _HdStreamAbstractUI_native from "../components/mana-assets/native/generated/HdStreamAbstractUI.native";
import * as _HeadphonesAndControllerSpotIllustration_native from "../components/mana-assets/native/generated/HeadphonesAndControllerSpotIllustration.native";
import * as _HeadsetSpotIllustration_native from "../components/mana-assets/native/generated/HeadsetSpotIllustration.native";
import * as _HeartHandsSpotIllustration_native from "../components/mana-assets/native/generated/HeartHandsSpotIllustration.native";
import * as _HeartIllocon_native from "../components/mana-assets/native/generated/HeartIllocon.native";
import * as _HeartJarSpotIllustration_native from "../components/mana-assets/native/generated/HeartJarSpotIllustration.native";
import * as _HelloWumpusSpotIllustration_native from "../components/mana-assets/native/generated/HelloWumpusSpotIllustration.native";
import * as _HeroIllocon_native from "../components/mana-assets/native/generated/HeroIllocon.native";
import * as _HighFiveSpotIllustration_native from "../components/mana-assets/native/generated/HighFiveSpotIllustration.native";
import * as _HoldingGemSpotIllustration_native from "../components/mana-assets/native/generated/HoldingGemSpotIllustration.native";
import * as _InkQuill3dIllustration_native from "../components/mana-assets/native/generated/InkQuill3dIllustration.native";
import * as _KeyRingSpotIllustration_native from "../components/mana-assets/native/generated/KeyRingSpotIllustration.native";
import * as _LanternSpotIllustration_native from "../components/mana-assets/native/generated/LanternSpotIllustration.native";
import * as _LaptopSpotIllustration_native from "../components/mana-assets/native/generated/LaptopSpotIllustration.native";
import * as _LavaIllocon_native from "../components/mana-assets/native/generated/LavaIllocon.native";
import * as _LeafIllocon_native from "../components/mana-assets/native/generated/LeafIllocon.native";
import * as _LightningIllocon_native from "../components/mana-assets/native/generated/LightningIllocon.native";
import * as _LongMessageSpotIllustration_native from "../components/mana-assets/native/generated/LongMessageSpotIllustration.native";
import * as _MagnifyingGlassSpotIllustration_native from "../components/mana-assets/native/generated/MagnifyingGlassSpotIllustration.native";
import * as _MailboxIllocon_native from "../components/mana-assets/native/generated/MailboxIllocon.native";
import * as _MailboxSpotIllustration_native from "../components/mana-assets/native/generated/MailboxSpotIllustration.native";
import * as _MapleIllocon_native from "../components/mana-assets/native/generated/MapleIllocon.native";
import * as _MicrophoneAndKeyboardSpotIllustration_native from "../components/mana-assets/native/generated/MicrophoneAndKeyboardSpotIllustration.native";
import * as _MicrophoneSpotIllustration_native from "../components/mana-assets/native/generated/MicrophoneSpotIllustration.native";
import * as _MiniaturesSpotIllustration_native from "../components/mana-assets/native/generated/MiniaturesSpotIllustration.native";
import * as _MissionScrollSpotIllustration_native from "../components/mana-assets/native/generated/MissionScrollSpotIllustration.native";
import * as _MoneyBagIllocon_native from "../components/mana-assets/native/generated/MoneyBagIllocon.native";
import * as _MoonIllocon_native from "../components/mana-assets/native/generated/MoonIllocon.native";
import * as _MushroomIllocon_native from "../components/mana-assets/native/generated/MushroomIllocon.native";
import * as _MushroomSpotIllustration_native from "../components/mana-assets/native/generated/MushroomSpotIllustration.native";
import * as _NitroBronzeBadgeLargeBadge_native from "../components/mana-assets/native/generated/NitroBronzeBadgeLargeBadge.native";
import * as _NitroBronzeBadgeSmallBadge_native from "../components/mana-assets/native/generated/NitroBronzeBadgeSmallBadge.native";
import * as _NitroCoinSpotIllustration_native from "../components/mana-assets/native/generated/NitroCoinSpotIllustration.native";
import * as _NitroCoinStackSpotIllustration_native from "../components/mana-assets/native/generated/NitroCoinStackSpotIllustration.native";
import * as _NitroDiamondBadgeLargeBadge_native from "../components/mana-assets/native/generated/NitroDiamondBadgeLargeBadge.native";
import * as _NitroDiamondBadgeSmallBadge_native from "../components/mana-assets/native/generated/NitroDiamondBadgeSmallBadge.native";
import * as _NitroEmeraldBadgeLargeBadge_native from "../components/mana-assets/native/generated/NitroEmeraldBadgeLargeBadge.native";
import * as _NitroEmeraldBadgeSmallBadge_native from "../components/mana-assets/native/generated/NitroEmeraldBadgeSmallBadge.native";
import * as _NitroFileUploadSpotIllustration_native from "../components/mana-assets/native/generated/NitroFileUploadSpotIllustration.native";
import * as _NitroGoldBadgeLargeBadge_native from "../components/mana-assets/native/generated/NitroGoldBadgeLargeBadge.native";
import * as _NitroGoldBadgeSmallBadge_native from "../components/mana-assets/native/generated/NitroGoldBadgeSmallBadge.native";
import * as _NitroGradientBackgroundAbstractUI_native from "../components/mana-assets/native/generated/NitroGradientBackgroundAbstractUI.native";
import * as _NitroLogoCardSpotIllustration_native from "../components/mana-assets/native/generated/NitroLogoCardSpotIllustration.native";
import * as _NitroOpalBadgeLargeBadge_native from "../components/mana-assets/native/generated/NitroOpalBadgeLargeBadge.native";
import * as _NitroOpalBadgeSmallBadge_native from "../components/mana-assets/native/generated/NitroOpalBadgeSmallBadge.native";
import * as _NitroPlatinumBadgeLargeBadge_native from "../components/mana-assets/native/generated/NitroPlatinumBadgeLargeBadge.native";
import * as _NitroPlatinumBadgeSmallBadge_native from "../components/mana-assets/native/generated/NitroPlatinumBadgeSmallBadge.native";
import * as _NitroRewardsLaptopSpotIllustration_native from "../components/mana-assets/native/generated/NitroRewardsLaptopSpotIllustration.native";
import * as _NitroRewardsMouseSpotIllustration_native from "../components/mana-assets/native/generated/NitroRewardsMouseSpotIllustration.native";
import * as _NitroRocketNameplateAbstractUI_native from "../components/mana-assets/native/generated/NitroRocketNameplateAbstractUI.native";
import * as _NitroRubyBadgeLargeBadge_native from "../components/mana-assets/native/generated/NitroRubyBadgeLargeBadge.native";
import * as _NitroRubyBadgeSmallBadge_native from "../components/mana-assets/native/generated/NitroRubyBadgeSmallBadge.native";
import * as _NitroSilverBadgeLargeBadge_native from "../components/mana-assets/native/generated/NitroSilverBadgeLargeBadge.native";
import * as _NitroSilverBadgeSmallBadge_native from "../components/mana-assets/native/generated/NitroSilverBadgeSmallBadge.native";
import * as _NitroStarterBadgeLargeBadge_native from "../components/mana-assets/native/generated/NitroStarterBadgeLargeBadge.native";
import * as _NitroStarterBadgeSmallBadge_native from "../components/mana-assets/native/generated/NitroStarterBadgeSmallBadge.native";
import * as _NitroSupergraphicLogo_native from "../components/mana-assets/native/generated/NitroSupergraphicLogo.native";
import * as _NitroTicketSpotIllustration_native from "../components/mana-assets/native/generated/NitroTicketSpotIllustration.native";
import * as _NitroWishlistTileAbstractUI_native from "../components/mana-assets/native/generated/NitroWishlistTileAbstractUI.native";
import * as _NitroWordmarkLogo_native from "../components/mana-assets/native/generated/NitroWordmarkLogo.native";
import * as _NitroWumpusExcitement3dIllustration_native from "../components/mana-assets/native/generated/NitroWumpusExcitement3dIllustration.native";
import * as _NitroWumpusFlightLeft3dIllustration_native from "../components/mana-assets/native/generated/NitroWumpusFlightLeft3dIllustration.native";
import * as _NitroWumpusFlightRight3dIllustration_native from "../components/mana-assets/native/generated/NitroWumpusFlightRight3dIllustration.native";
import * as _NitroWumpusFlightUpwards3dIllustration_native from "../components/mana-assets/native/generated/NitroWumpusFlightUpwards3dIllustration.native";
import * as _NitroWumpusGreenSpotIllustration_native from "../components/mana-assets/native/generated/NitroWumpusGreenSpotIllustration.native";
import * as _NitroWumpusHero3dIllustration_native from "../components/mana-assets/native/generated/NitroWumpusHero3dIllustration.native";
import * as _NitroWumpusOfferingLeft3dIllustration_native from "../components/mana-assets/native/generated/NitroWumpusOfferingLeft3dIllustration.native";
import * as _NitroWumpusOfferingRight3dIllustration_native from "../components/mana-assets/native/generated/NitroWumpusOfferingRight3dIllustration.native";
import * as _NitroWumpusPinkSpotIllustration_native from "../components/mana-assets/native/generated/NitroWumpusPinkSpotIllustration.native";
import * as _NitroWumpusThumbsUp3dIllustration_native from "../components/mana-assets/native/generated/NitroWumpusThumbsUp3dIllustration.native";
import * as _NitroWumpusWishlistingSpotIllustration_native from "../components/mana-assets/native/generated/NitroWumpusWishlistingSpotIllustration.native";
import * as _Orb3dIllustration_native from "../components/mana-assets/native/generated/Orb3dIllustration.native";
import * as _OrbNitroCardSpotIllustration_native from "../components/mana-assets/native/generated/OrbNitroCardSpotIllustration.native";
import * as _OrbNitroMultiplierSpotIllustration_native from "../components/mana-assets/native/generated/OrbNitroMultiplierSpotIllustration.native";
import * as _OrbNitroSpotIllustration_native from "../components/mana-assets/native/generated/OrbNitroSpotIllustration.native";
import * as _PaintIllocon_native from "../components/mana-assets/native/generated/PaintIllocon.native";
import * as _PaintPaletteSpotIllustration_native from "../components/mana-assets/native/generated/PaintPaletteSpotIllustration.native";
import * as _PasskeysSpotIllustration_native from "../components/mana-assets/native/generated/PasskeysSpotIllustration.native";
import * as _PencilIllocon_native from "../components/mana-assets/native/generated/PencilIllocon.native";
import * as _PingPongPaddleIllocon_native from "../components/mana-assets/native/generated/PingPongPaddleIllocon.native";
import * as _PlaneIllocon_native from "../components/mana-assets/native/generated/PlaneIllocon.native";
import * as _PortalSpotIllustration_native from "../components/mana-assets/native/generated/PortalSpotIllustration.native";
import * as _PotionBookGemSpotIllustration_native from "../components/mana-assets/native/generated/PotionBookGemSpotIllustration.native";
import * as _PotionSpotIllustration_native from "../components/mana-assets/native/generated/PotionSpotIllustration.native";
import * as _PottedPlantIllocon_native from "../components/mana-assets/native/generated/PottedPlantIllocon.native";
import * as _PowerupSpotIllustration_native from "../components/mana-assets/native/generated/PowerupSpotIllustration.native";
import * as _PrivacyShieldBannerSpotIllustration_native from "../components/mana-assets/native/generated/PrivacyShieldBannerSpotIllustration.native";
import * as _PrivacyShieldWithLaptopBannerSpotIllustration_native from "../components/mana-assets/native/generated/PrivacyShieldWithLaptopBannerSpotIllustration.native";
import * as _PrivacyShieldWithLaptopSpotIllustration_native from "../components/mana-assets/native/generated/PrivacyShieldWithLaptopSpotIllustration.native";
import * as _PrivateProfileAbstractUI_native from "../components/mana-assets/native/generated/PrivateProfileAbstractUI.native";
import * as _ProfileEffectsAbstractUI_native from "../components/mana-assets/native/generated/ProfileEffectsAbstractUI.native";
import * as _PsychicIllocon_native from "../components/mana-assets/native/generated/PsychicIllocon.native";
import * as _PuzzleCubeSpotIllustration_native from "../components/mana-assets/native/generated/PuzzleCubeSpotIllustration.native";
import * as _QrCodeLoginSpotIllustration_native from "../components/mana-assets/native/generated/QrCodeLoginSpotIllustration.native";
import * as _QrCodeSuccessSpotIllustration_native from "../components/mana-assets/native/generated/QrCodeSuccessSpotIllustration.native";
import * as _QuestsIllocon_native from "../components/mana-assets/native/generated/QuestsIllocon.native";
import * as _ReactionsSpotIllustration_native from "../components/mana-assets/native/generated/ReactionsSpotIllustration.native";
import * as _RocketshipSpotIllustration_native from "../components/mana-assets/native/generated/RocketshipSpotIllustration.native";
import * as _RubberDuckSpotIllustration_native from "../components/mana-assets/native/generated/RubberDuckSpotIllustration.native";
import * as _RulebookSpotIllustration_native from "../components/mana-assets/native/generated/RulebookSpotIllustration.native";
import * as _SafetyBookletEmailSpotIllustration_native from "../components/mana-assets/native/generated/SafetyBookletEmailSpotIllustration.native";
import * as _SafetyBookletSpotIllustration_native from "../components/mana-assets/native/generated/SafetyBookletSpotIllustration.native";
import * as _SafetyChatSpotIllustration_native from "../components/mana-assets/native/generated/SafetyChatSpotIllustration.native";
import * as _SafetyShieldCenter3dIllustration_native from "../components/mana-assets/native/generated/SafetyShieldCenter3dIllustration.native";
import * as _SafetyShieldIllocon_native from "../components/mana-assets/native/generated/SafetyShieldIllocon.native";
import * as _SafetyShieldLeft3dIllustration_native from "../components/mana-assets/native/generated/SafetyShieldLeft3dIllustration.native";
import * as _SafetyShieldRight3dIllustration_native from "../components/mana-assets/native/generated/SafetyShieldRight3dIllustration.native";
import * as _SecurityKeySpotIllustration_native from "../components/mana-assets/native/generated/SecurityKeySpotIllustration.native";
import * as _ServerBannerDefaultExample_native from "../components/mana-assets/native/generated/ServerBannerDefaultExample.native";
import * as _ServerBannerStaffServerExample_native from "../components/mana-assets/native/generated/ServerBannerStaffServerExample.native";
import * as _ServerBannerTheCrewExample_native from "../components/mana-assets/native/generated/ServerBannerTheCrewExample.native";
import * as _ServerBannerUnderboxExample_native from "../components/mana-assets/native/generated/ServerBannerUnderboxExample.native";
import * as _ServerIconBonkBonkExample_native from "../components/mana-assets/native/generated/ServerIconBonkBonkExample.native";
import * as _ServerIconBoomBGoneExample_native from "../components/mana-assets/native/generated/ServerIconBoomBGoneExample.native";
import * as _ServerIconCoincordExample_native from "../components/mana-assets/native/generated/ServerIconCoincordExample.native";
import * as _ServerIconDefaultExample_native from "../components/mana-assets/native/generated/ServerIconDefaultExample.native";
import * as _ServerIconEyespyExample_native from "../components/mana-assets/native/generated/ServerIconEyespyExample.native";
import * as _ServerIconGeargrindExample_native from "../components/mana-assets/native/generated/ServerIconGeargrindExample.native";
import * as _ServerIconLilQuackSPondverseExample_native from "../components/mana-assets/native/generated/ServerIconLilQuackSPondverseExample.native";
import * as _ServerIconShieldzordExample_native from "../components/mana-assets/native/generated/ServerIconShieldzordExample.native";
import * as _ServerIconSproutletSyndicateExample_native from "../components/mana-assets/native/generated/ServerIconSproutletSyndicateExample.native";
import * as _ServerIconStaffServerExample_native from "../components/mana-assets/native/generated/ServerIconStaffServerExample.native";
import * as _ServerIconStarblasterExample_native from "../components/mana-assets/native/generated/ServerIconStarblasterExample.native";
import * as _ServerIconTheCrewExample_native from "../components/mana-assets/native/generated/ServerIconTheCrewExample.native";
import * as _ServerIconUnderboxExample_native from "../components/mana-assets/native/generated/ServerIconUnderboxExample.native";
import * as _ServerTagAbstractUI_native from "../components/mana-assets/native/generated/ServerTagAbstractUI.native";
import * as _SeverHubAbstractUI_native from "../components/mana-assets/native/generated/SeverHubAbstractUI.native";
import * as _ShareNitroSpotIllustration_native from "../components/mana-assets/native/generated/ShareNitroSpotIllustration.native";
import * as _SharingGemSpotIllustration_native from "../components/mana-assets/native/generated/SharingGemSpotIllustration.native";
import * as _ShieldSpotIllustration_native from "../components/mana-assets/native/generated/ShieldSpotIllustration.native";
import * as _ShoesSpotIllustration_native from "../components/mana-assets/native/generated/ShoesSpotIllustration.native";
import * as _ShopIllocon_native from "../components/mana-assets/native/generated/ShopIllocon.native";
import * as _SkullIllocon_native from "../components/mana-assets/native/generated/SkullIllocon.native";
import * as _SleepingWumpusSpotIllustration_native from "../components/mana-assets/native/generated/SleepingWumpusSpotIllustration.native";
import * as _SmokeIllocon_native from "../components/mana-assets/native/generated/SmokeIllocon.native";
import * as _SnailIllocon_native from "../components/mana-assets/native/generated/SnailIllocon.native";
import * as _SnowIllocon_native from "../components/mana-assets/native/generated/SnowIllocon.native";
import * as _SocialMediaSpotIllustration_native from "../components/mana-assets/native/generated/SocialMediaSpotIllustration.native";
import * as _SocialSdkIllocon_native from "../components/mana-assets/native/generated/SocialSdkIllocon.native";
import * as _SoundIllocon_native from "../components/mana-assets/native/generated/SoundIllocon.native";
import * as _SoundboardSpotIllustration_native from "../components/mana-assets/native/generated/SoundboardSpotIllustration.native";
import * as _SpeakerSpotIllustration_native from "../components/mana-assets/native/generated/SpeakerSpotIllustration.native";
import * as _SpiderIllocon_native from "../components/mana-assets/native/generated/SpiderIllocon.native";
import * as _SpinningGem3dIllustration_native from "../components/mana-assets/native/generated/SpinningGem3dIllustration.native";
import * as _StickersSpotIllustration_native from "../components/mana-assets/native/generated/StickersSpotIllustration.native";
import * as _StreamSpotIllustration_native from "../components/mana-assets/native/generated/StreamSpotIllustration.native";
import * as _StreamingTier10LargeBadge_native from "../components/mana-assets/native/generated/StreamingTier10LargeBadge.native";
import * as _StreamingTier10SmallBadge_native from "../components/mana-assets/native/generated/StreamingTier10SmallBadge.native";
import * as _StreamingTier1LargeBadge_native from "../components/mana-assets/native/generated/StreamingTier1LargeBadge.native";
import * as _StreamingTier1SmallBadge_native from "../components/mana-assets/native/generated/StreamingTier1SmallBadge.native";
import * as _StreamingTier2LargeBadge_native from "../components/mana-assets/native/generated/StreamingTier2LargeBadge.native";
import * as _StreamingTier2SmallBadge_native from "../components/mana-assets/native/generated/StreamingTier2SmallBadge.native";
import * as _StreamingTier3LargeBadge_native from "../components/mana-assets/native/generated/StreamingTier3LargeBadge.native";
import * as _StreamingTier3SmallBadge_native from "../components/mana-assets/native/generated/StreamingTier3SmallBadge.native";
import * as _StreamingTier4LargeBadge_native from "../components/mana-assets/native/generated/StreamingTier4LargeBadge.native";
import * as _StreamingTier4SmallBadge_native from "../components/mana-assets/native/generated/StreamingTier4SmallBadge.native";
import * as _StreamingTier5LargeBadge_native from "../components/mana-assets/native/generated/StreamingTier5LargeBadge.native";
import * as _StreamingTier5SmallBadge_native from "../components/mana-assets/native/generated/StreamingTier5SmallBadge.native";
import * as _StreamingTier6LargeBadge_native from "../components/mana-assets/native/generated/StreamingTier6LargeBadge.native";
import * as _StreamingTier6SmallBadge_native from "../components/mana-assets/native/generated/StreamingTier6SmallBadge.native";
import * as _StreamingTier7LargeBadge_native from "../components/mana-assets/native/generated/StreamingTier7LargeBadge.native";
import * as _StreamingTier7SmallBadge_native from "../components/mana-assets/native/generated/StreamingTier7SmallBadge.native";
import * as _StreamingTier8LargeBadge_native from "../components/mana-assets/native/generated/StreamingTier8LargeBadge.native";
import * as _StreamingTier8SmallBadge_native from "../components/mana-assets/native/generated/StreamingTier8SmallBadge.native";
import * as _StreamingTier9LargeBadge_native from "../components/mana-assets/native/generated/StreamingTier9LargeBadge.native";
import * as _StreamingTier9SmallBadge_native from "../components/mana-assets/native/generated/StreamingTier9SmallBadge.native";
import * as _StudyGroupsSpotIllustration_native from "../components/mana-assets/native/generated/StudyGroupsSpotIllustration.native";
import * as _SunIllocon_native from "../components/mana-assets/native/generated/SunIllocon.native";
import * as _SwordAndChestSpotIllustration_native from "../components/mana-assets/native/generated/SwordAndChestSpotIllustration.native";
import * as _SwordAndStoneSpotIllustration_native from "../components/mana-assets/native/generated/SwordAndStoneSpotIllustration.native";
import * as _SwordIllocon_native from "../components/mana-assets/native/generated/SwordIllocon.native";
import * as _TabletSpotIllustration_native from "../components/mana-assets/native/generated/TabletSpotIllustration.native";
import * as _TeaKettleSpotIllustration_native from "../components/mana-assets/native/generated/TeaKettleSpotIllustration.native";
import * as _TentSpotIllustration_native from "../components/mana-assets/native/generated/TentSpotIllustration.native";
import * as _Tome3dIllustration_native from "../components/mana-assets/native/generated/Tome3dIllustration.native";
import * as _TrafficConeSpotIllustration_native from "../components/mana-assets/native/generated/TrafficConeSpotIllustration.native";
import * as _TreasureChestBannerSpotIllustration_native from "../components/mana-assets/native/generated/TreasureChestBannerSpotIllustration.native";
import * as _TreasureChestSpotIllustration_native from "../components/mana-assets/native/generated/TreasureChestSpotIllustration.native";
import * as _TrophyIllocon_native from "../components/mana-assets/native/generated/TrophyIllocon.native";
import * as _TypingIndicatorAbstractUI_native from "../components/mana-assets/native/generated/TypingIndicatorAbstractUI.native";
import * as _VibeWithWumpusSpotIllustration_native from "../components/mana-assets/native/generated/VibeWithWumpusSpotIllustration.native";
import * as _VideoCameraSpotIllustration_native from "../components/mana-assets/native/generated/VideoCameraSpotIllustration.native";
import * as _VoiceFiltersSpotIllustration_native from "../components/mana-assets/native/generated/VoiceFiltersSpotIllustration.native";
import * as _WasdSpotIllustration_native from "../components/mana-assets/native/generated/WasdSpotIllustration.native";
import * as _WaterIllocon_native from "../components/mana-assets/native/generated/WaterIllocon.native";
import * as _WateringCanSpotIllustration_native from "../components/mana-assets/native/generated/WateringCanSpotIllustration.native";
import * as _WhiteboardAbstractUI_native from "../components/mana-assets/native/generated/WhiteboardAbstractUI.native";
import * as _WiltedFlowerIllocon_native from "../components/mana-assets/native/generated/WiltedFlowerIllocon.native";
import * as _WindIllocon_native from "../components/mana-assets/native/generated/WindIllocon.native";
import * as _WizardHatAndBookSpotIllustration_native from "../components/mana-assets/native/generated/WizardHatAndBookSpotIllustration.native";
import * as _WordBalloonIllocon_native from "../components/mana-assets/native/generated/WordBalloonIllocon.native";
import * as _WorldIllocon_native from "../components/mana-assets/native/generated/WorldIllocon.native";
import * as _WumpusCouchSpotIllustration_native from "../components/mana-assets/native/generated/WumpusCouchSpotIllustration.native";
import * as _WumpusGearSpotIllustration_native from "../components/mana-assets/native/generated/WumpusGearSpotIllustration.native";
import * as _WumpusMahjongSpotIllustration_native from "../components/mana-assets/native/generated/WumpusMahjongSpotIllustration.native";
export const AccountAgeTier10LargeBadge = _AccountAgeTier10LargeBadge_native.AccountAgeTier10LargeBadge;
export const AccountAgeTier10SmallBadge = _AccountAgeTier10SmallBadge_native.AccountAgeTier10SmallBadge;
export const AccountAgeTier1LargeBadge = _AccountAgeTier1LargeBadge_native.AccountAgeTier1LargeBadge;
export const AccountAgeTier1SmallBadge = _AccountAgeTier1SmallBadge_native.AccountAgeTier1SmallBadge;
export const AccountAgeTier2LargeBadge = _AccountAgeTier2LargeBadge_native.AccountAgeTier2LargeBadge;
export const AccountAgeTier2SmallBadge = _AccountAgeTier2SmallBadge_native.AccountAgeTier2SmallBadge;
export const AccountAgeTier3LargeBadge = _AccountAgeTier3LargeBadge_native.AccountAgeTier3LargeBadge;
export const AccountAgeTier3SmallBadge = _AccountAgeTier3SmallBadge_native.AccountAgeTier3SmallBadge;
export const AccountAgeTier4LargeBadge = _AccountAgeTier4LargeBadge_native.AccountAgeTier4LargeBadge;
export const AccountAgeTier4SmallBadge = _AccountAgeTier4SmallBadge_native.AccountAgeTier4SmallBadge;
export const AccountAgeTier5LargeBadge = _AccountAgeTier5LargeBadge_native.AccountAgeTier5LargeBadge;
export const AccountAgeTier5SmallBadge = _AccountAgeTier5SmallBadge_native.AccountAgeTier5SmallBadge;
export const AccountAgeTier6LargeBadge = _AccountAgeTier6LargeBadge_native.AccountAgeTier6LargeBadge;
export const AccountAgeTier6SmallBadge = _AccountAgeTier6SmallBadge_native.AccountAgeTier6SmallBadge;
export const AccountAgeTier7LargeBadge = _AccountAgeTier7LargeBadge_native.AccountAgeTier7LargeBadge;
export const AccountAgeTier7SmallBadge = _AccountAgeTier7SmallBadge_native.AccountAgeTier7SmallBadge;
export const AccountAgeTier8LargeBadge = _AccountAgeTier8LargeBadge_native.AccountAgeTier8LargeBadge;
export const AccountAgeTier8SmallBadge = _AccountAgeTier8SmallBadge_native.AccountAgeTier8SmallBadge;
export const AccountAgeTier9LargeBadge = _AccountAgeTier9LargeBadge_native.AccountAgeTier9LargeBadge;
export const AccountAgeTier9SmallBadge = _AccountAgeTier9SmallBadge_native.AccountAgeTier9SmallBadge;
export const ActivatedGem3dIllustration = _ActivatedGem3dIllustration_native.ActivatedGem3dIllustration;
export const ActivitiesIllocon = _ActivitiesIllocon_native.ActivitiesIllocon;
export const AgeVerificationSpotIllustration = _AgeVerificationSpotIllustration_native.AgeVerificationSpotIllustration;
export const AnimatedAvatarsAbstractUI = _AnimatedAvatarsAbstractUI_native.AnimatedAvatarsAbstractUI;
export const AnimatedBannersAbstractUI = _AnimatedBannersAbstractUI_native.AnimatedBannersAbstractUI;
export const ApiIllocon = _ApiIllocon_native.ApiIllocon;
export const AppleIllocon = _AppleIllocon_native.AppleIllocon;
export const AppsButtonSpotIllustration = _AppsButtonSpotIllustration_native.AppsButtonSpotIllustration;
export const AvatarCapExample = _AvatarCapExample_native.AvatarCapExample;
export const AvatarClydeExample = _AvatarClydeExample_native.AvatarClydeExample;
export const AvatarDannoExample = _AvatarDannoExample_native.AvatarDannoExample;
export const AvatarDecorationsAbstractUI = _AvatarDecorationsAbstractUI_native.AvatarDecorationsAbstractUI;
export const AvatarDefaultExample = _AvatarDefaultExample_native.AvatarDefaultExample;
export const AvatarGraggleExample = _AvatarGraggleExample_native.AvatarGraggleExample;
export const AvatarLockeExample = _AvatarLockeExample_native.AvatarLockeExample;
export const AvatarLokyExample = _AvatarLokyExample_native.AvatarLokyExample;
export const AvatarMallowExample = _AvatarMallowExample_native.AvatarMallowExample;
export const AvatarMoatmonsturrExample = _AvatarMoatmonsturrExample_native.AvatarMoatmonsturrExample;
export const AvatarNellyExample = _AvatarNellyExample_native.AvatarNellyExample;
export const AvatarRoseExample = _AvatarRoseExample_native.AvatarRoseExample;
export const AvatarSpellcastExample = _AvatarSpellcastExample_native.AvatarSpellcastExample;
export const AvatarWumpusExample = _AvatarWumpusExample_native.AvatarWumpusExample;
export const BadgePacksAbstractUI = _BadgePacksAbstractUI_native.BadgePacksAbstractUI;
export const BananaSpotIllustration = _BananaSpotIllustration_native.BananaSpotIllustration;
export const BeakerIllocon = _BeakerIllocon_native.BeakerIllocon;
export const BeeIllocon = _BeeIllocon_native.BeeIllocon;
export const BellSpotIllustration = _BellSpotIllustration_native.BellSpotIllustration;
export const BlossomIllocon = _BlossomIllocon_native.BlossomIllocon;
export const BookIllocon = _BookIllocon_native.BookIllocon;
export const BoostGemIllocon = _BoostGemIllocon_native.BoostGemIllocon;
export const BotIllocon = _BotIllocon_native.BotIllocon;
export const BountiesPosterIllocon = _BountiesPosterIllocon_native.BountiesPosterIllocon;
export const BountiesPosterSpotIllustration = _BountiesPosterSpotIllustration_native.BountiesPosterSpotIllustration;
export const BrushAndSwordIllocon = _BrushAndSwordIllocon_native.BrushAndSwordIllocon;
export const BrushIllocon = _BrushIllocon_native.BrushIllocon;
export const BugSpotIllustration = _BugSpotIllustration_native.BugSpotIllustration;
export const BuildingBlocksSpotIllustration = _BuildingBlocksSpotIllustration_native.BuildingBlocksSpotIllustration;
export const BumpingFistsSpotIllustration = _BumpingFistsSpotIllustration_native.BumpingFistsSpotIllustration;
export const BunnyIllocon = _BunnyIllocon_native.BunnyIllocon;
export const ButterflyIllocon = _ButterflyIllocon_native.ButterflyIllocon;
export const CampfireSceneSpotIllustration = _CampfireSceneSpotIllustration_native.CampfireSceneSpotIllustration;
export const CampfireSpotIllustration = _CampfireSpotIllustration_native.CampfireSpotIllustration;
export const CandyIllocon = _CandyIllocon_native.CandyIllocon;
export const CatIllocon = _CatIllocon_native.CatIllocon;
export const CaterpillarIllocon = _CaterpillarIllocon_native.CaterpillarIllocon;
export const ChairIllocon = _ChairIllocon_native.ChairIllocon;
export const ChatControllersSpotIllustration = _ChatControllersSpotIllustration_native.ChatControllersSpotIllustration;
export const ChestAndGemSpotIllustration = _ChestAndGemSpotIllustration_native.ChestAndGemSpotIllustration;
export const CloudKeypadSpotIllustration = _CloudKeypadSpotIllustration_native.CloudKeypadSpotIllustration;
export const CloverIllocon = _CloverIllocon_native.CloverIllocon;
export const ClydeAngledSpotIllustration = _ClydeAngledSpotIllustration_native.ClydeAngledSpotIllustration;
export const ClydeAnnouncementSpotIllustration = _ClydeAnnouncementSpotIllustration_native.ClydeAnnouncementSpotIllustration;
export const ClydeCoinsSpotIllustration = _ClydeCoinsSpotIllustration_native.ClydeCoinsSpotIllustration;
export const ClydeHeadsetSpotIllustration = _ClydeHeadsetSpotIllustration_native.ClydeHeadsetSpotIllustration;
export const ClydeHologramSpotIllustration = _ClydeHologramSpotIllustration_native.ClydeHologramSpotIllustration;
export const ClydeShieldSpotIllustration = _ClydeShieldSpotIllustration_native.ClydeShieldSpotIllustration;
export const CoinBagSpotIllustration = _CoinBagSpotIllustration_native.CoinBagSpotIllustration;
export const CoinSlotSpotIllustration = _CoinSlotSpotIllustration_native.CoinSlotSpotIllustration;
export const CompassIllocon = _CompassIllocon_native.CompassIllocon;
export const CompassSpotIllustration = _CompassSpotIllustration_native.CompassSpotIllustration;
export const ConnectionCablesSpotIllustration = _ConnectionCablesSpotIllustration_native.ConnectionCablesSpotIllustration;
export const ControllerIllocon = _ControllerIllocon_native.ControllerIllocon;
export const ControllerSpotIllustration = _ControllerSpotIllustration_native.ControllerSpotIllustration;
export const CouchSpotIllustration = _CouchSpotIllustration_native.CouchSpotIllustration;
export const CrosshairIllocon = _CrosshairIllocon_native.CrosshairIllocon;
export const CrownIllocon = _CrownIllocon_native.CrownIllocon;
export const D20SpotIllustration = _D20SpotIllustration_native.D20SpotIllustration;
export const DevCommerceTallAbstractUI = _DevCommerceTallAbstractUI_native.DevCommerceTallAbstractUI;
export const DevCommerceWideAbstractUI = _DevCommerceWideAbstractUI_native.DevCommerceWideAbstractUI;
export const DevIdentityTallAbstractUI = _DevIdentityTallAbstractUI_native.DevIdentityTallAbstractUI;
export const DevIdentityWideAbstractUI = _DevIdentityWideAbstractUI_native.DevIdentityWideAbstractUI;
export const DevQuestsTallAbstractUI = _DevQuestsTallAbstractUI_native.DevQuestsTallAbstractUI;
export const DevQuestsWideAbstractUI = _DevQuestsWideAbstractUI_native.DevQuestsWideAbstractUI;
export const DevSdkTallAbstractUI = _DevSdkTallAbstractUI_native.DevSdkTallAbstractUI;
export const DevSdkWideAbstractUI = _DevSdkWideAbstractUI_native.DevSdkWideAbstractUI;
export const DiamondIllocon = _DiamondIllocon_native.DiamondIllocon;
export const DiamondSpotIllustration = _DiamondSpotIllustration_native.DiamondSpotIllustration;
export const DiscordNitroLockupLogo = _DiscordNitroLockupLogo_native.DiscordNitroLockupLogo;
export const DiscordQuestsLockupLogo = _DiscordQuestsLockupLogo_native.DiscordQuestsLockupLogo;
export const DiscordShopLockupLogo = _DiscordShopLockupLogo_native.DiscordShopLockupLogo;
export const DiscordSupergraphicLogo = _DiscordSupergraphicLogo_native.DiscordSupergraphicLogo;
export const DiscordWordmarkLogo = _DiscordWordmarkLogo_native.DiscordWordmarkLogo;
export const DiscountsMicrophoneSpotIllustration = _DiscountsMicrophoneSpotIllustration_native.DiscountsMicrophoneSpotIllustration;
export const DisguiseSpotIllustration = _DisguiseSpotIllustration_native.DisguiseSpotIllustration;
export const DisplayNameAbstractUI = _DisplayNameAbstractUI_native.DisplayNameAbstractUI;
export const DisplayNameLockeAbstractUI = _DisplayNameLockeAbstractUI_native.DisplayNameLockeAbstractUI;
export const DisplayNameStylesAbstractUI = _DisplayNameStylesAbstractUI_native.DisplayNameStylesAbstractUI;
export const DisplayNameStylesV2AbstractUI = _DisplayNameStylesV2AbstractUI_native.DisplayNameStylesV2AbstractUI;
export const DogIllocon = _DogIllocon_native.DogIllocon;
export const DollarSignIllocon = _DollarSignIllocon_native.DollarSignIllocon;
export const DownloadBarIllocon = _DownloadBarIllocon_native.DownloadBarIllocon;
export const DownloadIllocon = _DownloadIllocon_native.DownloadIllocon;
export const EmojiSlotsAbstractUI = _EmojiSlotsAbstractUI_native.EmojiSlotsAbstractUI;
export const EnvelopeOpenSpotIllustration = _EnvelopeOpenSpotIllustration_native.EnvelopeOpenSpotIllustration;
export const EnvelopeSpotIllustration = _EnvelopeSpotIllustration_native.EnvelopeSpotIllustration;
export const ExperimentalCustomUrlAbstractUI = _ExperimentalCustomUrlAbstractUI_native.ExperimentalCustomUrlAbstractUI;
export const ExperimentalDiscordShopLockupExperiementLogo = _ExperimentalDiscordShopLockupExperiementLogo_native.ExperimentalDiscordShopLockupExperiementLogo;
export const ExperimentalGameWidgetsAbstractUI = _ExperimentalGameWidgetsAbstractUI_native.ExperimentalGameWidgetsAbstractUI;
export const ExperimentalGiftEnvelopeIllocon = _ExperimentalGiftEnvelopeIllocon_native.ExperimentalGiftEnvelopeIllocon;
export const ExperimentalMarvelRivalsWidgetAbstractUI = _ExperimentalMarvelRivalsWidgetAbstractUI_native.ExperimentalMarvelRivalsWidgetAbstractUI;
export const FamilyKeysSpotIllustration = _FamilyKeysSpotIllustration_native.FamilyKeysSpotIllustration;
export const FamilyShieldSpotIllustration = _FamilyShieldSpotIllustration_native.FamilyShieldSpotIllustration;
export const FamilySpotIllustration = _FamilySpotIllustration_native.FamilySpotIllustration;
export const FavoritesSpotIllustration = _FavoritesSpotIllustration_native.FavoritesSpotIllustration;
export const FileUploadSpotIllustration = _FileUploadSpotIllustration_native.FileUploadSpotIllustration;
export const FireIllocon = _FireIllocon_native.FireIllocon;
export const FistBumpSpotIllustration = _FistBumpSpotIllustration_native.FistBumpSpotIllustration;
export const FlowerIllocon = _FlowerIllocon_native.FlowerIllocon;
export const ForceIllocon = _ForceIllocon_native.ForceIllocon;
export const FrogIllocon = _FrogIllocon_native.FrogIllocon;
export const GameCartridgeSpotIllustration = _GameCartridgeSpotIllustration_native.GameCartridgeSpotIllustration;
export const GameDataSpotIllustration = _GameDataSpotIllustration_native.GameDataSpotIllustration;
export const GameDepthTier10LargeBadge = _GameDepthTier10LargeBadge_native.GameDepthTier10LargeBadge;
export const GameDepthTier10SmallBadge = _GameDepthTier10SmallBadge_native.GameDepthTier10SmallBadge;
export const GameDepthTier1LargeBadge = _GameDepthTier1LargeBadge_native.GameDepthTier1LargeBadge;
export const GameDepthTier1SmallBadge = _GameDepthTier1SmallBadge_native.GameDepthTier1SmallBadge;
export const GameDepthTier2LargeBadge = _GameDepthTier2LargeBadge_native.GameDepthTier2LargeBadge;
export const GameDepthTier2SmallBadge = _GameDepthTier2SmallBadge_native.GameDepthTier2SmallBadge;
export const GameDepthTier3LargeBadge = _GameDepthTier3LargeBadge_native.GameDepthTier3LargeBadge;
export const GameDepthTier3SmallBadge = _GameDepthTier3SmallBadge_native.GameDepthTier3SmallBadge;
export const GameDepthTier4LargeBadge = _GameDepthTier4LargeBadge_native.GameDepthTier4LargeBadge;
export const GameDepthTier4SmallBadge = _GameDepthTier4SmallBadge_native.GameDepthTier4SmallBadge;
export const GameDepthTier5LargeBadge = _GameDepthTier5LargeBadge_native.GameDepthTier5LargeBadge;
export const GameDepthTier5SmallBadge = _GameDepthTier5SmallBadge_native.GameDepthTier5SmallBadge;
export const GameDepthTier6LargeBadge = _GameDepthTier6LargeBadge_native.GameDepthTier6LargeBadge;
export const GameDepthTier6SmallBadge = _GameDepthTier6SmallBadge_native.GameDepthTier6SmallBadge;
export const GameDepthTier7LargeBadge = _GameDepthTier7LargeBadge_native.GameDepthTier7LargeBadge;
export const GameDepthTier7SmallBadge = _GameDepthTier7SmallBadge_native.GameDepthTier7SmallBadge;
export const GameDepthTier8LargeBadge = _GameDepthTier8LargeBadge_native.GameDepthTier8LargeBadge;
export const GameDepthTier8SmallBadge = _GameDepthTier8SmallBadge_native.GameDepthTier8SmallBadge;
export const GameDepthTier9LargeBadge = _GameDepthTier9LargeBadge_native.GameDepthTier9LargeBadge;
export const GameDepthTier9SmallBadge = _GameDepthTier9SmallBadge_native.GameDepthTier9SmallBadge;
export const GameDiversityTier10LargeBadge = _GameDiversityTier10LargeBadge_native.GameDiversityTier10LargeBadge;
export const GameDiversityTier10SmallBadge = _GameDiversityTier10SmallBadge_native.GameDiversityTier10SmallBadge;
export const GameDiversityTier1LargeBadge = _GameDiversityTier1LargeBadge_native.GameDiversityTier1LargeBadge;
export const GameDiversityTier1SmallBadge = _GameDiversityTier1SmallBadge_native.GameDiversityTier1SmallBadge;
export const GameDiversityTier2LargeBadge = _GameDiversityTier2LargeBadge_native.GameDiversityTier2LargeBadge;
export const GameDiversityTier2SmallBadge = _GameDiversityTier2SmallBadge_native.GameDiversityTier2SmallBadge;
export const GameDiversityTier3LargeBadge = _GameDiversityTier3LargeBadge_native.GameDiversityTier3LargeBadge;
export const GameDiversityTier3SmallBadge = _GameDiversityTier3SmallBadge_native.GameDiversityTier3SmallBadge;
export const GameDiversityTier4LargeBadge = _GameDiversityTier4LargeBadge_native.GameDiversityTier4LargeBadge;
export const GameDiversityTier4SmallBadge = _GameDiversityTier4SmallBadge_native.GameDiversityTier4SmallBadge;
export const GameDiversityTier5LargeBadge = _GameDiversityTier5LargeBadge_native.GameDiversityTier5LargeBadge;
export const GameDiversityTier5SmallBadge = _GameDiversityTier5SmallBadge_native.GameDiversityTier5SmallBadge;
export const GameDiversityTier6LargeBadge = _GameDiversityTier6LargeBadge_native.GameDiversityTier6LargeBadge;
export const GameDiversityTier6SmallBadge = _GameDiversityTier6SmallBadge_native.GameDiversityTier6SmallBadge;
export const GameDiversityTier7LargeBadge = _GameDiversityTier7LargeBadge_native.GameDiversityTier7LargeBadge;
export const GameDiversityTier7SmallBadge = _GameDiversityTier7SmallBadge_native.GameDiversityTier7SmallBadge;
export const GameDiversityTier8LargeBadge = _GameDiversityTier8LargeBadge_native.GameDiversityTier8LargeBadge;
export const GameDiversityTier8SmallBadge = _GameDiversityTier8SmallBadge_native.GameDiversityTier8SmallBadge;
export const GameDiversityTier9LargeBadge = _GameDiversityTier9LargeBadge_native.GameDiversityTier9LargeBadge;
export const GameDiversityTier9SmallBadge = _GameDiversityTier9SmallBadge_native.GameDiversityTier9SmallBadge;
export const GamePresenceIllocon = _GamePresenceIllocon_native.GamePresenceIllocon;
export const GameServerAbstractUI = _GameServerAbstractUI_native.GameServerAbstractUI;
export const GameplayAbstractUI = _GameplayAbstractUI_native.GameplayAbstractUI;
export const GemHero3dIllustration = _GemHero3dIllustration_native.GemHero3dIllustration;
export const GemIllocon = _GemIllocon_native.GemIllocon;
export const GemInHandSpotIllustration = _GemInHandSpotIllustration_native.GemInHandSpotIllustration;
export const GemLeftForward3dIllustration = _GemLeftForward3dIllustration_native.GemLeftForward3dIllustration;
export const GemLeftUpwards3dIllustration = _GemLeftUpwards3dIllustration_native.GemLeftUpwards3dIllustration;
export const GemLevel1Illocon = _GemLevel1Illocon_native.GemLevel1Illocon;
export const GemLevel1SpotIllustration = _GemLevel1SpotIllustration_native.GemLevel1SpotIllustration;
export const GemLevel2Illocon = _GemLevel2Illocon_native.GemLevel2Illocon;
export const GemLevel2SpotIllustration = _GemLevel2SpotIllustration_native.GemLevel2SpotIllustration;
export const GemLevel3Illocon = _GemLevel3Illocon_native.GemLevel3Illocon;
export const GemLevel3SpotIllustration = _GemLevel3SpotIllustration_native.GemLevel3SpotIllustration;
export const GemRightBackward3dIllustration = _GemRightBackward3dIllustration_native.GemRightBackward3dIllustration;
export const GemRightUpwards3dIllustration = _GemRightUpwards3dIllustration_native.GemRightUpwards3dIllustration;
export const GemSpotIllustration = _GemSpotIllustration_native.GemSpotIllustration;
export const GiftBagFlyingSpotIllustration = _GiftBagFlyingSpotIllustration_native.GiftBagFlyingSpotIllustration;
export const GiftBagGlowSpotIllustration = _GiftBagGlowSpotIllustration_native.GiftBagGlowSpotIllustration;
export const GiftBoxSpotIllustration = _GiftBoxSpotIllustration_native.GiftBoxSpotIllustration;
export const GiftCardAvatar3dIllustration = _GiftCardAvatar3dIllustration_native.GiftCardAvatar3dIllustration;
export const GiftCardFan3dIllustration = _GiftCardFan3dIllustration_native.GiftCardFan3dIllustration;
export const GiftCardLeft3dIllustration = _GiftCardLeft3dIllustration_native.GiftCardLeft3dIllustration;
export const GiftCardRedeem3dIllustration = _GiftCardRedeem3dIllustration_native.GiftCardRedeem3dIllustration;
export const GiftCardRight3dIllustration = _GiftCardRight3dIllustration_native.GiftCardRight3dIllustration;
export const GiftCardSingle3dIllustration = _GiftCardSingle3dIllustration_native.GiftCardSingle3dIllustration;
export const GiftCardStack3dIllustration = _GiftCardStack3dIllustration_native.GiftCardStack3dIllustration;
export const GiftCardTwoLeft3dIllustration = _GiftCardTwoLeft3dIllustration_native.GiftCardTwoLeft3dIllustration;
export const GiftCardTwoRight3dIllustration = _GiftCardTwoRight3dIllustration_native.GiftCardTwoRight3dIllustration;
export const GiftCardWallet3dIllustration = _GiftCardWallet3dIllustration_native.GiftCardWallet3dIllustration;
export const GiftTrollIllocon = _GiftTrollIllocon_native.GiftTrollIllocon;
export const GiftingTier1LargeBadge = _GiftingTier1LargeBadge_native.GiftingTier1LargeBadge;
export const GiftingTier1SmallBadge = _GiftingTier1SmallBadge_native.GiftingTier1SmallBadge;
export const GiftingTier2LargeBadge = _GiftingTier2LargeBadge_native.GiftingTier2LargeBadge;
export const GiftingTier2SmallBadge = _GiftingTier2SmallBadge_native.GiftingTier2SmallBadge;
export const GiftingTier3LargeBadge = _GiftingTier3LargeBadge_native.GiftingTier3LargeBadge;
export const GiftingTier3SmallBadge = _GiftingTier3SmallBadge_native.GiftingTier3SmallBadge;
export const GiftingTier4LargeBadge = _GiftingTier4LargeBadge_native.GiftingTier4LargeBadge;
export const GiftingTier4SmallBadge = _GiftingTier4SmallBadge_native.GiftingTier4SmallBadge;
export const GiftingTier5LargeBadge = _GiftingTier5LargeBadge_native.GiftingTier5LargeBadge;
export const GiftingTier5SmallBadge = _GiftingTier5SmallBadge_native.GiftingTier5SmallBadge;
export const GiftingTier6LargeBadge = _GiftingTier6LargeBadge_native.GiftingTier6LargeBadge;
export const GiftingTier6SmallBadge = _GiftingTier6SmallBadge_native.GiftingTier6SmallBadge;
export const GoatIllocon = _GoatIllocon_native.GoatIllocon;
export const GroupGamingSpotIllustration = _GroupGamingSpotIllustration_native.GroupGamingSpotIllustration;
export const GuidelinesIllocon = _GuidelinesIllocon_native.GuidelinesIllocon;
export const HandheldSpotIllustration = _HandheldSpotIllustration_native.HandheldSpotIllustration;
export const HdAudioSpotIllustration = _HdAudioSpotIllustration_native.HdAudioSpotIllustration;
export const HdStreamAbstractUI = _HdStreamAbstractUI_native.HdStreamAbstractUI;
export const HeadphonesAndControllerSpotIllustration = _HeadphonesAndControllerSpotIllustration_native.HeadphonesAndControllerSpotIllustration;
export const HeadsetSpotIllustration = _HeadsetSpotIllustration_native.HeadsetSpotIllustration;
export const HeartHandsSpotIllustration = _HeartHandsSpotIllustration_native.HeartHandsSpotIllustration;
export const HeartIllocon = _HeartIllocon_native.HeartIllocon;
export const HeartJarSpotIllustration = _HeartJarSpotIllustration_native.HeartJarSpotIllustration;
export const HelloWumpusSpotIllustration = _HelloWumpusSpotIllustration_native.HelloWumpusSpotIllustration;
export const HeroIllocon = _HeroIllocon_native.HeroIllocon;
export const HighFiveSpotIllustration = _HighFiveSpotIllustration_native.HighFiveSpotIllustration;
export const HoldingGemSpotIllustration = _HoldingGemSpotIllustration_native.HoldingGemSpotIllustration;
export const InkQuill3dIllustration = _InkQuill3dIllustration_native.InkQuill3dIllustration;
export const KeyRingSpotIllustration = _KeyRingSpotIllustration_native.KeyRingSpotIllustration;
export const LanternSpotIllustration = _LanternSpotIllustration_native.LanternSpotIllustration;
export const LaptopSpotIllustration = _LaptopSpotIllustration_native.LaptopSpotIllustration;
export const LavaIllocon = _LavaIllocon_native.LavaIllocon;
export const LeafIllocon = _LeafIllocon_native.LeafIllocon;
export const LightningIllocon = _LightningIllocon_native.LightningIllocon;
export const LongMessageSpotIllustration = _LongMessageSpotIllustration_native.LongMessageSpotIllustration;
export const MagnifyingGlassSpotIllustration = _MagnifyingGlassSpotIllustration_native.MagnifyingGlassSpotIllustration;
export const MailboxIllocon = _MailboxIllocon_native.MailboxIllocon;
export const MailboxSpotIllustration = _MailboxSpotIllustration_native.MailboxSpotIllustration;
export const MapleIllocon = _MapleIllocon_native.MapleIllocon;
export const MicrophoneAndKeyboardSpotIllustration = _MicrophoneAndKeyboardSpotIllustration_native.MicrophoneAndKeyboardSpotIllustration;
export const MicrophoneSpotIllustration = _MicrophoneSpotIllustration_native.MicrophoneSpotIllustration;
export const MiniaturesSpotIllustration = _MiniaturesSpotIllustration_native.MiniaturesSpotIllustration;
export const MissionScrollSpotIllustration = _MissionScrollSpotIllustration_native.MissionScrollSpotIllustration;
export const MoneyBagIllocon = _MoneyBagIllocon_native.MoneyBagIllocon;
export const MoonIllocon = _MoonIllocon_native.MoonIllocon;
export const MushroomIllocon = _MushroomIllocon_native.MushroomIllocon;
export const MushroomSpotIllustration = _MushroomSpotIllustration_native.MushroomSpotIllustration;
export const NitroBronzeBadgeLargeBadge = _NitroBronzeBadgeLargeBadge_native.NitroBronzeBadgeLargeBadge;
export const NitroBronzeBadgeSmallBadge = _NitroBronzeBadgeSmallBadge_native.NitroBronzeBadgeSmallBadge;
export const NitroCoinSpotIllustration = _NitroCoinSpotIllustration_native.NitroCoinSpotIllustration;
export const NitroCoinStackSpotIllustration = _NitroCoinStackSpotIllustration_native.NitroCoinStackSpotIllustration;
export const NitroDiamondBadgeLargeBadge = _NitroDiamondBadgeLargeBadge_native.NitroDiamondBadgeLargeBadge;
export const NitroDiamondBadgeSmallBadge = _NitroDiamondBadgeSmallBadge_native.NitroDiamondBadgeSmallBadge;
export const NitroEmeraldBadgeLargeBadge = _NitroEmeraldBadgeLargeBadge_native.NitroEmeraldBadgeLargeBadge;
export const NitroEmeraldBadgeSmallBadge = _NitroEmeraldBadgeSmallBadge_native.NitroEmeraldBadgeSmallBadge;
export const NitroFileUploadSpotIllustration = _NitroFileUploadSpotIllustration_native.NitroFileUploadSpotIllustration;
export const NitroGoldBadgeLargeBadge = _NitroGoldBadgeLargeBadge_native.NitroGoldBadgeLargeBadge;
export const NitroGoldBadgeSmallBadge = _NitroGoldBadgeSmallBadge_native.NitroGoldBadgeSmallBadge;
export const NitroGradientBackgroundAbstractUI = _NitroGradientBackgroundAbstractUI_native.NitroGradientBackgroundAbstractUI;
export const NitroLogoCardSpotIllustration = _NitroLogoCardSpotIllustration_native.NitroLogoCardSpotIllustration;
export const NitroOpalBadgeLargeBadge = _NitroOpalBadgeLargeBadge_native.NitroOpalBadgeLargeBadge;
export const NitroOpalBadgeSmallBadge = _NitroOpalBadgeSmallBadge_native.NitroOpalBadgeSmallBadge;
export const NitroPlatinumBadgeLargeBadge = _NitroPlatinumBadgeLargeBadge_native.NitroPlatinumBadgeLargeBadge;
export const NitroPlatinumBadgeSmallBadge = _NitroPlatinumBadgeSmallBadge_native.NitroPlatinumBadgeSmallBadge;
export const NitroRewardsLaptopSpotIllustration = _NitroRewardsLaptopSpotIllustration_native.NitroRewardsLaptopSpotIllustration;
export const NitroRewardsMouseSpotIllustration = _NitroRewardsMouseSpotIllustration_native.NitroRewardsMouseSpotIllustration;
export const NitroRocketNameplateAbstractUI = _NitroRocketNameplateAbstractUI_native.NitroRocketNameplateAbstractUI;
export const NitroRubyBadgeLargeBadge = _NitroRubyBadgeLargeBadge_native.NitroRubyBadgeLargeBadge;
export const NitroRubyBadgeSmallBadge = _NitroRubyBadgeSmallBadge_native.NitroRubyBadgeSmallBadge;
export const NitroSilverBadgeLargeBadge = _NitroSilverBadgeLargeBadge_native.NitroSilverBadgeLargeBadge;
export const NitroSilverBadgeSmallBadge = _NitroSilverBadgeSmallBadge_native.NitroSilverBadgeSmallBadge;
export const NitroStarterBadgeLargeBadge = _NitroStarterBadgeLargeBadge_native.NitroStarterBadgeLargeBadge;
export const NitroStarterBadgeSmallBadge = _NitroStarterBadgeSmallBadge_native.NitroStarterBadgeSmallBadge;
export const NitroSupergraphicLogo = _NitroSupergraphicLogo_native.NitroSupergraphicLogo;
export const NitroTicketSpotIllustration = _NitroTicketSpotIllustration_native.NitroTicketSpotIllustration;
export const NitroWishlistTileAbstractUI = _NitroWishlistTileAbstractUI_native.NitroWishlistTileAbstractUI;
export const NitroWordmarkLogo = _NitroWordmarkLogo_native.NitroWordmarkLogo;
export const NitroWumpusExcitement3dIllustration = _NitroWumpusExcitement3dIllustration_native.NitroWumpusExcitement3dIllustration;
export const NitroWumpusFlightLeft3dIllustration = _NitroWumpusFlightLeft3dIllustration_native.NitroWumpusFlightLeft3dIllustration;
export const NitroWumpusFlightRight3dIllustration = _NitroWumpusFlightRight3dIllustration_native.NitroWumpusFlightRight3dIllustration;
export const NitroWumpusFlightUpwards3dIllustration = _NitroWumpusFlightUpwards3dIllustration_native.NitroWumpusFlightUpwards3dIllustration;
export const NitroWumpusGreenSpotIllustration = _NitroWumpusGreenSpotIllustration_native.NitroWumpusGreenSpotIllustration;
export const NitroWumpusHero3dIllustration = _NitroWumpusHero3dIllustration_native.NitroWumpusHero3dIllustration;
export const NitroWumpusOfferingLeft3dIllustration = _NitroWumpusOfferingLeft3dIllustration_native.NitroWumpusOfferingLeft3dIllustration;
export const NitroWumpusOfferingRight3dIllustration = _NitroWumpusOfferingRight3dIllustration_native.NitroWumpusOfferingRight3dIllustration;
export const NitroWumpusPinkSpotIllustration = _NitroWumpusPinkSpotIllustration_native.NitroWumpusPinkSpotIllustration;
export const NitroWumpusThumbsUp3dIllustration = _NitroWumpusThumbsUp3dIllustration_native.NitroWumpusThumbsUp3dIllustration;
export const NitroWumpusWishlistingSpotIllustration = _NitroWumpusWishlistingSpotIllustration_native.NitroWumpusWishlistingSpotIllustration;
export const Orb3dIllustration = _Orb3dIllustration_native.Orb3dIllustration;
export const OrbNitroCardSpotIllustration = _OrbNitroCardSpotIllustration_native.OrbNitroCardSpotIllustration;
export const OrbNitroMultiplierSpotIllustration = _OrbNitroMultiplierSpotIllustration_native.OrbNitroMultiplierSpotIllustration;
export const OrbNitroSpotIllustration = _OrbNitroSpotIllustration_native.OrbNitroSpotIllustration;
export const PaintIllocon = _PaintIllocon_native.PaintIllocon;
export const PaintPaletteSpotIllustration = _PaintPaletteSpotIllustration_native.PaintPaletteSpotIllustration;
export const PasskeysSpotIllustration = _PasskeysSpotIllustration_native.PasskeysSpotIllustration;
export const PencilIllocon = _PencilIllocon_native.PencilIllocon;
export const PingPongPaddleIllocon = _PingPongPaddleIllocon_native.PingPongPaddleIllocon;
export const PlaneIllocon = _PlaneIllocon_native.PlaneIllocon;
export const PortalSpotIllustration = _PortalSpotIllustration_native.PortalSpotIllustration;
export const PotionBookGemSpotIllustration = _PotionBookGemSpotIllustration_native.PotionBookGemSpotIllustration;
export const PotionSpotIllustration = _PotionSpotIllustration_native.PotionSpotIllustration;
export const PottedPlantIllocon = _PottedPlantIllocon_native.PottedPlantIllocon;
export const PowerupSpotIllustration = _PowerupSpotIllustration_native.PowerupSpotIllustration;
export const PrivacyShieldBannerSpotIllustration = _PrivacyShieldBannerSpotIllustration_native.PrivacyShieldBannerSpotIllustration;
export const PrivacyShieldWithLaptopBannerSpotIllustration = _PrivacyShieldWithLaptopBannerSpotIllustration_native.PrivacyShieldWithLaptopBannerSpotIllustration;
export const PrivacyShieldWithLaptopSpotIllustration = _PrivacyShieldWithLaptopSpotIllustration_native.PrivacyShieldWithLaptopSpotIllustration;
export const PrivateProfileAbstractUI = _PrivateProfileAbstractUI_native.PrivateProfileAbstractUI;
export const ProfileEffectsAbstractUI = _ProfileEffectsAbstractUI_native.ProfileEffectsAbstractUI;
export const PsychicIllocon = _PsychicIllocon_native.PsychicIllocon;
export const PuzzleCubeSpotIllustration = _PuzzleCubeSpotIllustration_native.PuzzleCubeSpotIllustration;
export const QrCodeLoginSpotIllustration = _QrCodeLoginSpotIllustration_native.QrCodeLoginSpotIllustration;
export const QrCodeSuccessSpotIllustration = _QrCodeSuccessSpotIllustration_native.QrCodeSuccessSpotIllustration;
export const QuestsIllocon = _QuestsIllocon_native.QuestsIllocon;
export const ReactionsSpotIllustration = _ReactionsSpotIllustration_native.ReactionsSpotIllustration;
export const RocketshipSpotIllustration = _RocketshipSpotIllustration_native.RocketshipSpotIllustration;
export const RubberDuckSpotIllustration = _RubberDuckSpotIllustration_native.RubberDuckSpotIllustration;
export const RulebookSpotIllustration = _RulebookSpotIllustration_native.RulebookSpotIllustration;
export const SafetyBookletEmailSpotIllustration = _SafetyBookletEmailSpotIllustration_native.SafetyBookletEmailSpotIllustration;
export const SafetyBookletSpotIllustration = _SafetyBookletSpotIllustration_native.SafetyBookletSpotIllustration;
export const SafetyChatSpotIllustration = _SafetyChatSpotIllustration_native.SafetyChatSpotIllustration;
export const SafetyShieldCenter3dIllustration = _SafetyShieldCenter3dIllustration_native.SafetyShieldCenter3dIllustration;
export const SafetyShieldIllocon = _SafetyShieldIllocon_native.SafetyShieldIllocon;
export const SafetyShieldLeft3dIllustration = _SafetyShieldLeft3dIllustration_native.SafetyShieldLeft3dIllustration;
export const SafetyShieldRight3dIllustration = _SafetyShieldRight3dIllustration_native.SafetyShieldRight3dIllustration;
export const SecurityKeySpotIllustration = _SecurityKeySpotIllustration_native.SecurityKeySpotIllustration;
export const ServerBannerDefaultExample = _ServerBannerDefaultExample_native.ServerBannerDefaultExample;
export const ServerBannerStaffServerExample = _ServerBannerStaffServerExample_native.ServerBannerStaffServerExample;
export const ServerBannerTheCrewExample = _ServerBannerTheCrewExample_native.ServerBannerTheCrewExample;
export const ServerBannerUnderboxExample = _ServerBannerUnderboxExample_native.ServerBannerUnderboxExample;
export const ServerIconBonkBonkExample = _ServerIconBonkBonkExample_native.ServerIconBonkBonkExample;
export const ServerIconBoomBGoneExample = _ServerIconBoomBGoneExample_native.ServerIconBoomBGoneExample;
export const ServerIconCoincordExample = _ServerIconCoincordExample_native.ServerIconCoincordExample;
export const ServerIconDefaultExample = _ServerIconDefaultExample_native.ServerIconDefaultExample;
export const ServerIconEyespyExample = _ServerIconEyespyExample_native.ServerIconEyespyExample;
export const ServerIconGeargrindExample = _ServerIconGeargrindExample_native.ServerIconGeargrindExample;
export const ServerIconLilQuackSPondverseExample = _ServerIconLilQuackSPondverseExample_native.ServerIconLilQuackSPondverseExample;
export const ServerIconShieldzordExample = _ServerIconShieldzordExample_native.ServerIconShieldzordExample;
export const ServerIconSproutletSyndicateExample = _ServerIconSproutletSyndicateExample_native.ServerIconSproutletSyndicateExample;
export const ServerIconStaffServerExample = _ServerIconStaffServerExample_native.ServerIconStaffServerExample;
export const ServerIconStarblasterExample = _ServerIconStarblasterExample_native.ServerIconStarblasterExample;
export const ServerIconTheCrewExample = _ServerIconTheCrewExample_native.ServerIconTheCrewExample;
export const ServerIconUnderboxExample = _ServerIconUnderboxExample_native.ServerIconUnderboxExample;
export const ServerTagAbstractUI = _ServerTagAbstractUI_native.ServerTagAbstractUI;
export const SeverHubAbstractUI = _SeverHubAbstractUI_native.SeverHubAbstractUI;
export const ShareNitroSpotIllustration = _ShareNitroSpotIllustration_native.ShareNitroSpotIllustration;
export const SharingGemSpotIllustration = _SharingGemSpotIllustration_native.SharingGemSpotIllustration;
export const ShieldSpotIllustration = _ShieldSpotIllustration_native.ShieldSpotIllustration;
export const ShoesSpotIllustration = _ShoesSpotIllustration_native.ShoesSpotIllustration;
export const ShopIllocon = _ShopIllocon_native.ShopIllocon;
export const SkullIllocon = _SkullIllocon_native.SkullIllocon;
export const SleepingWumpusSpotIllustration = _SleepingWumpusSpotIllustration_native.SleepingWumpusSpotIllustration;
export const SmokeIllocon = _SmokeIllocon_native.SmokeIllocon;
export const SnailIllocon = _SnailIllocon_native.SnailIllocon;
export const SnowIllocon = _SnowIllocon_native.SnowIllocon;
export const SocialMediaSpotIllustration = _SocialMediaSpotIllustration_native.SocialMediaSpotIllustration;
export const SocialSdkIllocon = _SocialSdkIllocon_native.SocialSdkIllocon;
export const SoundIllocon = _SoundIllocon_native.SoundIllocon;
export const SoundboardSpotIllustration = _SoundboardSpotIllustration_native.SoundboardSpotIllustration;
export const SpeakerSpotIllustration = _SpeakerSpotIllustration_native.SpeakerSpotIllustration;
export const SpiderIllocon = _SpiderIllocon_native.SpiderIllocon;
export const SpinningGem3dIllustration = _SpinningGem3dIllustration_native.SpinningGem3dIllustration;
export const StickersSpotIllustration = _StickersSpotIllustration_native.StickersSpotIllustration;
export const StreamSpotIllustration = _StreamSpotIllustration_native.StreamSpotIllustration;
export const StreamingTier10LargeBadge = _StreamingTier10LargeBadge_native.StreamingTier10LargeBadge;
export const StreamingTier10SmallBadge = _StreamingTier10SmallBadge_native.StreamingTier10SmallBadge;
export const StreamingTier1LargeBadge = _StreamingTier1LargeBadge_native.StreamingTier1LargeBadge;
export const StreamingTier1SmallBadge = _StreamingTier1SmallBadge_native.StreamingTier1SmallBadge;
export const StreamingTier2LargeBadge = _StreamingTier2LargeBadge_native.StreamingTier2LargeBadge;
export const StreamingTier2SmallBadge = _StreamingTier2SmallBadge_native.StreamingTier2SmallBadge;
export const StreamingTier3LargeBadge = _StreamingTier3LargeBadge_native.StreamingTier3LargeBadge;
export const StreamingTier3SmallBadge = _StreamingTier3SmallBadge_native.StreamingTier3SmallBadge;
export const StreamingTier4LargeBadge = _StreamingTier4LargeBadge_native.StreamingTier4LargeBadge;
export const StreamingTier4SmallBadge = _StreamingTier4SmallBadge_native.StreamingTier4SmallBadge;
export const StreamingTier5LargeBadge = _StreamingTier5LargeBadge_native.StreamingTier5LargeBadge;
export const StreamingTier5SmallBadge = _StreamingTier5SmallBadge_native.StreamingTier5SmallBadge;
export const StreamingTier6LargeBadge = _StreamingTier6LargeBadge_native.StreamingTier6LargeBadge;
export const StreamingTier6SmallBadge = _StreamingTier6SmallBadge_native.StreamingTier6SmallBadge;
export const StreamingTier7LargeBadge = _StreamingTier7LargeBadge_native.StreamingTier7LargeBadge;
export const StreamingTier7SmallBadge = _StreamingTier7SmallBadge_native.StreamingTier7SmallBadge;
export const StreamingTier8LargeBadge = _StreamingTier8LargeBadge_native.StreamingTier8LargeBadge;
export const StreamingTier8SmallBadge = _StreamingTier8SmallBadge_native.StreamingTier8SmallBadge;
export const StreamingTier9LargeBadge = _StreamingTier9LargeBadge_native.StreamingTier9LargeBadge;
export const StreamingTier9SmallBadge = _StreamingTier9SmallBadge_native.StreamingTier9SmallBadge;
export const StudyGroupsSpotIllustration = _StudyGroupsSpotIllustration_native.StudyGroupsSpotIllustration;
export const SunIllocon = _SunIllocon_native.SunIllocon;
export const SwordAndChestSpotIllustration = _SwordAndChestSpotIllustration_native.SwordAndChestSpotIllustration;
export const SwordAndStoneSpotIllustration = _SwordAndStoneSpotIllustration_native.SwordAndStoneSpotIllustration;
export const SwordIllocon = _SwordIllocon_native.SwordIllocon;
export const TabletSpotIllustration = _TabletSpotIllustration_native.TabletSpotIllustration;
export const TeaKettleSpotIllustration = _TeaKettleSpotIllustration_native.TeaKettleSpotIllustration;
export const TentSpotIllustration = _TentSpotIllustration_native.TentSpotIllustration;
export const Tome3dIllustration = _Tome3dIllustration_native.Tome3dIllustration;
export const TrafficConeSpotIllustration = _TrafficConeSpotIllustration_native.TrafficConeSpotIllustration;
export const TreasureChestBannerSpotIllustration = _TreasureChestBannerSpotIllustration_native.TreasureChestBannerSpotIllustration;
export const TreasureChestSpotIllustration = _TreasureChestSpotIllustration_native.TreasureChestSpotIllustration;
export const TrophyIllocon = _TrophyIllocon_native.TrophyIllocon;
export const TypingIndicatorAbstractUI = _TypingIndicatorAbstractUI_native.TypingIndicatorAbstractUI;
export const VibeWithWumpusSpotIllustration = _VibeWithWumpusSpotIllustration_native.VibeWithWumpusSpotIllustration;
export const VideoCameraSpotIllustration = _VideoCameraSpotIllustration_native.VideoCameraSpotIllustration;
export const VoiceFiltersSpotIllustration = _VoiceFiltersSpotIllustration_native.VoiceFiltersSpotIllustration;
export const WasdSpotIllustration = _WasdSpotIllustration_native.WasdSpotIllustration;
export const WaterIllocon = _WaterIllocon_native.WaterIllocon;
export const WateringCanSpotIllustration = _WateringCanSpotIllustration_native.WateringCanSpotIllustration;
export const WhiteboardAbstractUI = _WhiteboardAbstractUI_native.WhiteboardAbstractUI;
export const WiltedFlowerIllocon = _WiltedFlowerIllocon_native.WiltedFlowerIllocon;
export const WindIllocon = _WindIllocon_native.WindIllocon;
export const WizardHatAndBookSpotIllustration = _WizardHatAndBookSpotIllustration_native.WizardHatAndBookSpotIllustration;
export const WordBalloonIllocon = _WordBalloonIllocon_native.WordBalloonIllocon;
export const WorldIllocon = _WorldIllocon_native.WorldIllocon;
export const WumpusCouchSpotIllustration = _WumpusCouchSpotIllustration_native.WumpusCouchSpotIllustration;
export const WumpusGearSpotIllustration = _WumpusGearSpotIllustration_native.WumpusGearSpotIllustration;
export const WumpusMahjongSpotIllustration = _WumpusMahjongSpotIllustration_native.WumpusMahjongSpotIllustration;
design/components/AccessibilityView/AccessibilityView.native.tsx
+18
View File
@@ -0,0 +1,18 @@
// Metro module 4583 (f4584).
import { forwardRef } from "react";
import { View } from "react-native";
import useAccessibilityViewIsModalToggle_native from "./useAccessibilityViewIsModalToggle.native";
import ReanimatedRexport from "../../../modules/reanimated/ReanimatedRexport";
const r23 = forwardRef(function({ accessibilityViewIsModal = false, nativeID, collapsable, onAccessibilityEscape, ...props }, a1) {
if (accessibilityViewIsModal && onAccessibilityEscape == null) {
throw new Error("Must have a onAccessibilityEscape callback when accessibilityViewIsModal is enabled.");
}
useAccessibilityViewIsModalToggle_native({
accessibilityViewIsModal,
nativeID
});
return <View ref={a1} nativeID={nativeID} collapsable={nativeID == null && collapsable} onAccessibilityEscape={onAccessibilityEscape} accessibilityViewIsModal={accessibilityViewIsModal} {...props} />;
});
const AnimatedComponent = ReanimatedRexport.createAnimatedComponent(r23);
export { r23 as AccessibilityView };
export { AnimatedComponent as AccessibilityViewAnimated };
design/components/AccessibilityView/useAccessibilityViewIsModalToggle.native.tsx
+35
View File
@@ -0,0 +1,35 @@
// Metro module 4584 (f4585).
import { useRef, useCallback, useEffect } from "react";
import AccessibilityFocusLockManager from "../../../modules/a11y/native/AccessibilityFocusLockManager";
export default function useAccessibilityViewIsModalToggle(a0) {
let accessibilityViewIsModal = a0.accessibilityViewIsModal;
if (accessibilityViewIsModal === void 0) {
accessibilityViewIsModal = false;
}
let c14332_0 = accessibilityViewIsModal;
const nativeID = a0.nativeID;
const ref = useRef(void 0);
const callback = useCallback(function(r3 = c14332_0) {
if (r3) {
if (nativeID == null) {
throw new Error("Must have a unique nativeID when accessibilityViewIsModal is enabled.");
}
if (ref.current !== nativeID) {
ref.current = nativeID;
AccessibilityFocusLockManager.enableAccessibilityFocusLock([nativeID]);
}
} else {
const current = ref.current;
if (current != null) {
ref.current = void 0;
AccessibilityFocusLockManager.disableAccessibilityFocusLock([current]);
}
}
}, [accessibilityViewIsModal, nativeID]);
useEffect(() => {
callback();
return () => {
callback(false);
};
}, [callback]);
};
design/components/ActivityIndicator/native/ActivityIndicator.native.tsx
+13
View File
@@ -0,0 +1,13 @@
// Metro module 5637 (f5638).
import { ActivityIndicator as ActivityIndicator2 } from "react-native";
import { useToken } from "../../../tokens/native/useToken";
import Module712 from "../../../../_bundle/Module712";
export function ActivityIndicator(props) {
const { size = "large", animating = true, ...props2 } = props;
const token = useToken(Module712.colors.BACKGROUND_BRAND);
let color = props2.color;
if (color == null) {
color = token;
}
return <ActivityIndicator2 {...props2} size={size} animating={animating} color={color} />;
}
design/components/AlertModal/native/AlertModal.native.tsx
+457
View File
@@ -0,0 +1,457 @@
// Metro module 4533 (f4534).
import _slicedToArray from "../../../../_bundle/_slicedToArray";
import _toArray from "../../../../_bundle/_toArray";
import { useContext, useRef, useEffect, useLayoutEffect, useState, createContext, memo, useCallback, Suspense } from "react";
import { ScrollView, View, StyleSheet } from "react-native";
import { NOOP } from "../../../../_bundle/Module505";
import { jsx } from "react/jsx-runtime";
import { createStyles } from "../../Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import * as _TransitionGroup from "../../TransitionGroup/TransitionGroup";
import { TransitionGroup } from "../../TransitionGroup/TransitionGroup";
import { useAlertStore, dismissAlert, openAlert } from "./useAlertStore.native";
import * as _ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
import ReanimatedRexport, { useAnimatedStyle, useSharedValue, useAnimatedReaction } from "../../../../modules/reanimated/ReanimatedRexport";
import { dismissGlobalKeyboard } from "../../../../utils/native/KeyboardManagerUtils";
import OverlayView from "../../../void/OverlayView/native/OverlayView";
import { Dialog } from "../../Dialog/native/Dialog.native";
import { batchUpdates } from "../../../../_bundle/Module705";
import { Backdrop } from "../../Backdrop/native/Backdrop.native";
import * as _index_native from "../../../../intl/index.native";
import { intl } from "../../../../intl/index.native";
import { AccessibilityPreferencesContext } from "../../../../_bundle/Module3908";
import useSafeAreaInsets_native from "../../../../modules/safe_area/useSafeAreaInsets.native";
import { setAccessibilityFocus } from "../../../../modules/a11y/native/setAccessibilityFocus.android";
import useWindowDimensions_native from "../../../../modules/screen/useWindowDimensions.native";
import useBackPressHandler from "../../../../modules/routing/native/useBackPressHandler";
import { Stack } from "../../Stack/native/Stack.native";
import { Text } from "../../Text/native/Text";
import * as _spring from "../../../animation/reanimated/spring/spring";
import { Button } from "../../Button/native/Button.native";
function $mk74745($env) {
return () => {
const r1 = $env.$parent;
return (0, r1[0])(r1[2][10]).useAlertStore.setState({
alerts: $env[0]
});
};
}
let dismissTopAlert, AlertModalBackdrop, AlertModal, useSharedAnimationState, AlertActions, AlertActionButton, useStyles, c2739_14, c2739_15, c2739_16, c2739_17, c2739_18, c2739_19, c2739_22, c2739_24, withAlertModalSpring, c2739_27, c2739_28;
let env2739 = {};
const getAlertModalItemKey = function getAlertModalItemKey(a0) {
return a0.key;
};
dismissTopAlert = function dismissTopAlert() {
let env14309;
const r5 = env14309 = {
$parent: env2739
};
const r17 = _toArray(useAlertStore.getState().alerts);
const r11 = r17[0];
env14309[0] = r17.slice(1);
if (!(r11 != null && r11.dismissable === false)) {
dismissAlert(r11?.key);
batchUpdates($mk74745(r5));
}
};
AlertModalBackdrop = function AlertModalBackdrop() {
const context = useContext(c2739_16);
const [sharedTransitionState, sharedVisible] = useSharedAnimationState();
let c14310_1 = sharedTransitionState;
let c14310_2 = sharedVisible;
const alertStore = useAlertStore((a0) => a0.alerts[0]?.dismissable !== false);
const r26 = function t() {
return {
opacity: _spring.withSpring(c14310_2.get(), c2739_14, "animate-always", (a0) => {
if (a0 === true && c14310_2.get() === 0 && c14310_1.get() === _TransitionGroup.TransitionStates.YEETED) {
_ReanimatedRexport.runOnJS(context)();
}
})
};
};
r26.__closure = {
withAlertModalSpring,
sharedVisible,
sharedTransitionState,
TransitionStates: _TransitionGroup.TransitionStates,
runOnJS: _ReanimatedRexport.runOnJS,
cleanUp: context
};
r26.__workletHash = 4470729133936;
r26.__initData = c2739_22;
return <Backdrop blur="strong" style={useAnimatedStyle(r26)} onDismiss={alertStore ? dismissTopAlert : null} accessibilityLabel={intl.string(_index_native.t.Xkfav5)} />;
};
AlertModal = function AlertModal(props) {
let height;
const { header, title, content, actions, extraContent } = props;
height = void 0;
const context2 = useContext(c2739_16);
const context3 = useContext(c2739_17);
const styles = useStyles();
const context4 = useContext(c2739_19);
const enabled = useContext(AccessibilityPreferencesContext).reducedMotion.enabled;
const ref = useRef(null);
const sharedValue = useSharedValue(context3);
const [sharedTransitionState, sharedVisible] = useSharedAnimationState();
let c14311_6 = sharedTransitionState;
let c14311_7 = sharedVisible;
const safeAreaInsets_native = useSafeAreaInsets_native();
const { top, bottom } = safeAreaInsets_native;
useEffect(() => {
if (context3 === 0) {
setAccessibilityFocus({
ref,
delay: 300
});
}
}, [context3]);
height = useWindowDimensions_native().height;
const B = function B() {
let r75, transform;
const r0 = height - 32;
const r26 = 2 * Math.max(top, bottom);
const r16 = c14311_7.get();
const r17 = function(a0) {
if (a0 === true && c14311_7.get() === 0 && c14311_6.get() === _TransitionGroup.TransitionStates.YEETED) {
_ReanimatedRexport.runOnJS(context2)();
}
};
const r36 = {
position: "absolute",
opacity: _spring.withSpring(r16, c2739_14, "animate-always", r17),
zIndex: 10 - sharedValue.get(),
height: null,
maxHeight: null,
transform: null
};
const height2 = sharedValue.get() > 0 ? context4.get() : "auto";
const maxHeight = r0 - r26;
r36.height = height2;
r36.maxHeight = maxHeight;
if (enabled) {
transform = [];
} else {
transform = [{
scale: _spring.withSpring(c14311_7.get() === 1 ? 1 - 0.1 * sharedValue.get() : 0.7, c2739_14, "animate-always", void 0)
}, ,];
if (c14311_7.get() === 1) {
let r79 = [0, -20, -34][sharedValue.get()];
if (r79 == null) {
r79 = -12 * c14311_7.get();
}
r75 = r79;
} else {
r75 = 50 - 50 * sharedValue.get();
}
transform[1] = {
translateY: _spring.withSpring(r75, c2739_14, "animate-always", void 0)
};
}
r36.transform = transform;
return r36;
};
B.__closure = {
sharedVisible,
sharedTransitionState,
TransitionStates: _TransitionGroup.TransitionStates,
runOnJS: _ReanimatedRexport.runOnJS,
cleanUp: context2,
windowHeight: height,
ALERT_MODAL_MARGIN: 16,
safeAreaTop: top,
safeAreaBottom: bottom,
withAlertModalSpring,
sharedIndex: sharedValue,
sharedTopHeight: context4,
useReducedMotion: enabled
};
B.__workletHash = 655123755546;
B.__initData = c2739_24;
const animatedStyle = useAnimatedStyle(B);
useLayoutEffect(() => {
sharedValue.set(context3);
}, [context3, sharedValue]);
useBackPressHandler(() => {
let env25243;
const r5 = env25243 = {
$parent: env2739
};
const r17 = _toArray(useAlertStore.getState().alerts);
const r11 = r17[0];
env25243[0] = r17.slice(1);
if (!(r11 != null && r11.dismissable === false)) {
dismissAlert(r11?.key);
batchUpdates($mk74745(r5));
}
return true;
});
return <ReanimatedRexport.View importantForAccessibility={context3 === 0 ? "auto" : "no-hide-descendants"} accessibilityElementsHidden={context3 !== 0} style={[styles.content, animatedStyle]} onLayout={(event) => {
context4.set(event.nativeEvent.layout.height);
}}>
<ScrollView alwaysBounceVertical={false}>
<View style={styles.overflow}>
<Stack spacing={24}>
{header}
<Stack spacing={8} style={[styles.body]}>
<Text ref={ref} variant="heading-lg/bold" accessibilityRole="header" color="mobile-text-heading-primary">{title}</Text>
{content != null ? content !== "" ? <Text variant="text-md/medium" color="text-default" style={styles.contentText}>{content}</Text> : null : null}
</Stack>
{extraContent}
{actions != null ? <AlertActions>{actions}</AlertActions> : null}
</Stack>
</View>
</ScrollView>
</ReanimatedRexport.View>;
};
useSharedAnimationState = function useSharedAnimationState() {
const context5 = useContext(c2739_15);
const context6 = useContext(c2739_16);
const sharedValue2 = useSharedValue(context5 === _TransitionGroup.TransitionStates.MOUNTED ? 1 : 0);
const sharedValue3 = useSharedValue(context5);
useLayoutEffect(() => {
sharedValue3.set(context5);
}, [sharedValue2, context5, sharedValue3]);
const n = () => sharedValue3.get();
n.__closure = {
sharedTransitionState: sharedValue3
};
n.__workletHash = 14603144870585;
n.__initData = c2739_27;
const r38 = function t(a0) {
if (a0 === _TransitionGroup.TransitionStates.YEETED) {
if (sharedValue2.get() === 1) {
sharedValue2.set(0);
} else {
_ReanimatedRexport.runOnJS(context6)();
}
} else {
sharedValue2.set(1);
}
};
r38.__closure = {
TransitionStates: _TransitionGroup.TransitionStates,
sharedVisible: sharedValue2,
runOnJS: _ReanimatedRexport.runOnJS,
cleanUp: context6
};
r38.__workletHash = 9486923983340;
r38.__initData = c2739_28;
useAnimatedReaction(n, r38);
return [sharedValue3, sharedValue2];
};
AlertActions = function AlertActions(a0) {
return (0, jsx)(Stack, {
spacing: 12,
children: a0.children
});
};
AlertActionButton = function AlertActionButton(props) {
let env14313 = {
$parent: env2739
};
env14313[0] = props.onPress;
const { onPress, loading: _loading, ...props2 } = props;
let loading = props.loading;
env14313[1] = void 0;
env14313[2] = void 0;
const r18 = _slicedToArray(useState(false), 2);
const r10 = r18[0];
env14313[1] = r18[1];
env14313[2] = useContext(c2739_18);
if (loading == null) {
loading = r10;
}
let c14314_0 = async (c29409_0) => {
let c29409_3 = 0;
L16: {
L15: {
try {
const r27 = env14313[0];
const r28 = r27 == null ? void 0 : r27(c29409_0);
if (r28 != null && r28 instanceof Promise) {
(0, env14313[1])(true);
c29409_3 = 1;
await r28;
c29409_3 = 0;
dismissAlert(env14313[2]);
break L15;
}
dismissAlert(env14313[2]);
break L16;
} catch ($e) {
let r26 = $e;
if (c29409_3 !== 0) {
while (true) {
try {
c29409_3 = 0;
(0, env14313[1])(false);
} catch ($e) {
r26 = $e;
if (c29409_3 === 0) {
break;
}
continue;
}
return void 0;
}
}
throw r26;
}
}
return void 0;
}
};
return <Button {...props2} grow loading={loading} onPress={function() {
return c14314_0.apply(this, arguments);
}} />;
};
useStyles = createStyles({
root: {
flex: 1,
position: "relative",
justifyContent: "center",
alignItems: "center",
paddingHorizontal: 16
},
content: {
backgroundColor: Module712.colors.MOBILE_ALERT_BACKGROUND_DEFAULT,
margin: 16,
width: "100%",
maxWidth: 400,
height: "100%",
borderRadius: Module712.radii.xl,
borderWidth: 1,
borderColor: Module712.colors.BORDER_SUBTLE,
...Module712.shadows.SHADOW_TOP_HIGH
},
overflow: {
width: "100%",
height: "100%",
overflow: "hidden",
padding: 24,
position: "relative"
},
body: {
alignItems: "center"
},
contentText: {
textAlign: "center"
}
});
c2739_14 = {
overshootClamping: true,
damping: 35,
stiffness: 450,
mass: 0.5,
restDisplacementThreshold: 0.001
};
c2739_15 = createContext(_TransitionGroup.TransitionStates.YEETED);
c2739_16 = createContext(NOOP);
c2739_17 = createContext(0);
c2739_18 = createContext("");
c2739_19 = createContext(null);
const r90 = memo(function() {
let items;
let sharedValue4, c14315_2;
let c14316_0;
const styles = useStyles();
let c14315_0 = styles;
const alertStore = useAlertStore((a0) => a0.alerts);
sharedValue4 = useSharedValue(0);
c14316_0 = void 0;
if (alertStore.length === 0) {
items = [];
} else {
items = [{
type: "backdrop",
key: "backdrop"
}];
c14316_0 = items;
alertStore.slice(0, 3).forEach((item, a1) => {
c14316_0.push({
type: "alert",
alert: item,
key: item.key,
index: a1
});
});
}
c14315_2 = items;
useLayoutEffect(() => {
if (c14315_2.length > 0) {
dismissGlobalKeyboard();
}
}, [items]);
return (0, jsx)(TransitionGroup, {
wrapChildren: useCallback((a0) => <OverlayView style={StyleSheet.absoluteFillObject}>
<Dialog onDismiss={dismissTopAlert}>
<View style={c14315_0.root} pointerEvents="box-none">
{a0}
</View>
</Dialog>
</OverlayView>, [styles]),
items,
renderItem: useCallback((a0, a1, a2, a3) => (0, jsx)(c2739_19.Provider, {
value: sharedValue4,
children: (0, jsx)(c2739_16.Provider, {
value: a3,
children: (0, jsx)(c2739_15.Provider, {
value: a2,
children: (0, jsx)(c2739_17.Provider, {
value: a1.type === "alert" ? a1.index : -1,
children: (0, jsx)(c2739_18.Provider, {
value: a0,
children: (0, jsx)(Suspense, {
fallback: null,
children: a1.type === "alert" ? a1.alert.node : (0, jsx)(AlertModalBackdrop, {})
})
})
})
})
})
}, a0), [sharedValue4]),
getItemKey: getAlertModalItemKey
});
});
c2739_22 = {
code: "function AlertModalNativeTsx1(){const{withAlertModalSpring,sharedVisible,sharedTransitionState,TransitionStates,runOnJS,cleanUp}=this.__closure;return{opacity:withAlertModalSpring(sharedVisible.get(),function(finished){if(finished===true&&sharedVisible.get()===0&&sharedTransitionState.get()===TransitionStates.YEETED){runOnJS(cleanUp)();}})};}"
};
c2739_24 = {
code: "function AlertModalNativeTsx2(){const{sharedVisible,sharedTransitionState,TransitionStates,runOnJS,cleanUp,windowHeight,ALERT_MODAL_MARGIN,safeAreaTop,safeAreaBottom,withAlertModalSpring,sharedIndex,sharedTopHeight,useReducedMotion}=this.__closure;var _CARD_OFFSETS$sharedI;function onComplete(finished){if(finished===true&&sharedVisible.get()===0&&sharedTransitionState.get()===TransitionStates.YEETED){runOnJS(cleanUp)();}}const CARD_OFFSETS=[0,-20,-34];const maxHeight=windowHeight-ALERT_MODAL_MARGIN*2-Math.max(safeAreaTop,safeAreaBottom)*2;return{position:'absolute',opacity:withAlertModalSpring(sharedVisible.get(),onComplete),zIndex:10-sharedIndex.get(),height:sharedIndex.get()>0?sharedTopHeight.get():'auto',maxHeight:maxHeight,transform:useReducedMotion?[]:[{scale:withAlertModalSpring(sharedVisible.get()===1?1-sharedIndex.get()*0.1:0.7)},{translateY:withAlertModalSpring(sharedVisible.get()===1?(_CARD_OFFSETS$sharedI=CARD_OFFSETS[sharedIndex.get()])!==null&&_CARD_OFFSETS$sharedI!==void 0?_CARD_OFFSETS$sharedI:sharedVisible.get()*-12:50-sharedIndex.get()*50)}]};}"
};
const withAlertModalSpring2 = function withAlertModalSpring(a0, a1) {
return _spring.withSpring(a0, c2739_14, "animate-always", a1);
};
withAlertModalSpring2.__closure = {
withSpring: _spring.withSpring,
MODAL_SPRING: c2739_14
};
withAlertModalSpring2.__workletHash = 15556562210180;
withAlertModalSpring2.__initData = {
code: "function withAlertModalSpring_AlertModalNativeTsx3(value,callback){const{withSpring,MODAL_SPRING}=this.__closure;return withSpring(value,MODAL_SPRING,'animate-always',callback);}"
};
withAlertModalSpring = withAlertModalSpring2;
c2739_27 = {
code: "function AlertModalNativeTsx4(){const{sharedTransitionState}=this.__closure;return sharedTransitionState.get();}"
};
c2739_28 = {
code: "function AlertModalNativeTsx5(transitionState){const{TransitionStates,sharedVisible,runOnJS,cleanUp}=this.__closure;if(transitionState===TransitionStates.YEETED){if(sharedVisible.get()===1){sharedVisible.set(0);}else{runOnJS(cleanUp)();}}else{sharedVisible.set(1);}}"
};
export { r90 as AlertModalContainer };
export function useDismissModalCallback() {
const context7 = useContext(c2739_18);
return useCallback(() => {
dismissAlert(context7);
}, [context7]);
}
export { AlertModal };
export { AlertActions };
export { AlertActionButton };
export function showConfirmModal({ key, title, content, confirmText, cancelText = intl.string(_index_native.t["ETE/oC"]), extraContent, variant = "destructive", onConfirm, onCancel, onCloseCallback, dismissable }) {
openAlert(key, <AlertModal title={title} content={content} extraContent={extraContent} actions={<>
<AlertActionButton variant={variant} text={confirmText} onPress={onConfirm} />
<AlertActionButton variant="secondary" text={cancelText} onPress={onCancel} />
</>} />, onCloseCallback, {
dismissable
});
}
design/components/AlertModal/native/useAlertStore.native.tsx
+65
View File
@@ -0,0 +1,65 @@
// Metro module 4530 (f4531).
import { create } from "../../../../_bundle/Module644";
import { batchUpdates } from "../../../../_bundle/Module705";
import setAccessibilityFocusPrevious from "../../../../modules/a11y/native/setAccessibilityFocusPrevious";
import markAccessibilityFocus from "../../../../modules/a11y/native/markAccessibilityFocus";
let c2736_4 = create(() => ({
alerts: []
}));
export { c2736_4 as useAlertStore };
export function dismissAlerts() {
let c14306_0;
let [r19, alerts] = c2736_4.getState().alerts.reduce((acc, alert) => {
acc[alert.dismissable === false ? 1 : 0].push(alert);
return acc;
}, [[], []]);
c14306_0 = r19;
batchUpdates(() => {
c2736_4.setState({
alerts
});
c14306_0.forEach((item) => {
const onDismiss2 = item.onDismiss;
return onDismiss2 == null ? void 0 : onDismiss2.call(item);
});
});
if (alerts.length === 0 && r19.length > 0) {
setAccessibilityFocusPrevious();
}
}
export function dismissAlert(a0) {
let c14307_1;
const alerts2 = c2736_4.getState().alerts;
const r12 = alerts2.find((item) => item.key === a0);
c14307_1 = r12;
if (r12 != null) {
const r1 = alerts2.length === 1 && alerts2[0]?.key === a0;
batchUpdates(() => {
c2736_4.setState((state) => ({
alerts: state.alerts.filter((alert) => alert.key !== a0)
}));
const onDismiss2 = c14307_1.onDismiss;
if (onDismiss2 != null) {
onDismiss2.call(c14307_1);
}
});
if (r1) {
setAccessibilityFocusPrevious();
}
}
}
export function openAlert(key, node, onDismiss, c14308_3) {
if (c2736_4.getState().alerts.length === 0) {
markAccessibilityFocus();
}
batchUpdates(() => {
c2736_4.setState((state) => ({
alerts: [...state.alerts, {
key,
node,
onDismiss,
dismissable: c14308_3?.dismissable
}]
}));
});
}
design/components/AnimatedEnterExitItem/native/AnimatedEnterExitItem.tsx
+126
View File
@@ -0,0 +1,126 @@
// Metro module 8436 (f8437).
import { createElement, useEffect, useMemo } from "react";
import * as _ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
import { useSharedValue, useAnimatedStyle, useAnimatedReaction } from "../../../../modules/reanimated/ReanimatedRexport";
import * as _TransitionGroup from "../../TransitionGroup/TransitionGroup";
import { TransitionItem } from "../../TransitionGroup/TransitionGroup";
let __initData, __initData2, __initData3, renderAnimatedItem;
const AnimatedRenderItem = function AnimatedRenderItem(props) {
let c16571_7;
const { renderItem: renderItem2, item: item2, shouldAnimate, entering, exiting, state, cleanUp, useReducedMotion } = props;
c16571_7 = void 0;
const sharedValue = useSharedValue(state === _TransitionGroup.TransitionStates.MOUNTED ? 1 : 0);
useEffect(() => {
if (state === _TransitionGroup.TransitionStates.YEETED) {
sharedValue.set(0);
} else {
sharedValue.set(1);
}
}, [state, sharedValue]);
const T = function T() {
let r20;
L13: {
if (!useReducedMotion) {
if ((shouldAnimate == null ? void 0 : shouldAnimate.get()) !== false) {
if (state === _TransitionGroup.TransitionStates.YEETED && exiting != null) {
r20 = exiting(sharedValue.get(), (a0) => {
if (a0) {
_ReanimatedRexport.runOnJS(cleanUp)();
}
});
break L13;
}
if (entering != null) {
r20 = entering(sharedValue.get());
break L13;
}
r20 = {};
} else {
r20 = {};
}
} else {
r20 = {};
}
}
return r20;
};
T.__closure = {
useReducedMotion,
shouldAnimate,
state,
TransitionStates: _TransitionGroup.TransitionStates,
exiting,
visible: sharedValue,
runOnJS: _ReanimatedRexport.runOnJS,
cleanUp,
entering
};
T.__workletHash = 2197269661090;
T.__initData = __initData;
const animatedStyle = useAnimatedStyle(T);
const hasExiting = exiting != null;
c16571_7 = hasExiting;
const I = () => {
let r11 = state === _TransitionGroup.TransitionStates.YEETED && sharedValue.get() === 0;
if (r11) {
r11 = c16571_7 ? useReducedMotion : !c16571_7;
}
return r11;
};
I.__closure = {
state,
TransitionStates: _TransitionGroup.TransitionStates,
visible: sharedValue,
hasExiting,
useReducedMotion
};
I.__workletHash = 11984384474891;
I.__initData = __initData2;
const v = function v(a0, a1) {
if (a0 ? a0 !== a1 : a0) {
_ReanimatedRexport.runOnJS(cleanUp)();
}
};
v.__closure = {
runOnJS: _ReanimatedRexport.runOnJS,
cleanUp
};
v.__workletHash = 2105667466259;
v.__initData = __initData3;
useAnimatedReaction(I, v);
return <>
{renderItem2(item2, animatedStyle)}
</>;
};
renderAnimatedItem = function renderAnimatedItem(a0, a1, a2, a3) {
return createElement(AnimatedRenderItem, {
...a1,
key: a0,
state: a2,
cleanUp: a3
});
};
__initData = {
code: "function AnimatedEnterExitItemTsx1(){const{useReducedMotion,shouldAnimate,state,TransitionStates,exiting,visible,runOnJS,cleanUp,entering}=this.__closure;var _shouldAnimate;if(useReducedMotion)return{};if(((_shouldAnimate=shouldAnimate)===null||_shouldAnimate===void 0?void 0:_shouldAnimate.get())===false)return{};if(state===TransitionStates.YEETED&&exiting!=null){return exiting(visible.get(),function(finished){if(finished){runOnJS(cleanUp)();}});}if(entering!=null){return entering(visible.get());}return{};}"
};
__initData2 = {
code: "function AnimatedEnterExitItemTsx2(){const{state,TransitionStates,visible,hasExiting,useReducedMotion}=this.__closure;return state===TransitionStates.YEETED&&visible.get()===0&&(!hasExiting||useReducedMotion);}"
};
__initData3 = {
code: "function AnimatedEnterExitItemTsx3(hasExited,previous){const{runOnJS,cleanUp}=this.__closure;if(!hasExited||hasExited===previous)return;runOnJS(cleanUp)();}"
};
export default function AnimatedEnterExitItem(props) {
const { useReducedMotion: useReducedMotion2, shouldAnimate: shouldAnimate2, entering: entering2, exiting: exiting2, item, renderItem } = props;
return <TransitionItem item={useMemo(() => {
if (item != null) {
return {
shouldAnimate: shouldAnimate2,
entering: entering2,
exiting: exiting2,
renderItem,
item,
useReducedMotion: useReducedMotion2
};
}
}, [item, shouldAnimate2, entering2, exiting2, renderItem, useReducedMotion2])} renderItem={renderAnimatedItem} />;
};
design/components/Backdrop/native/Backdrop.native.tsx
+54
View File
@@ -0,0 +1,54 @@
// Metro module 4588 (f4589).
import { useMemo } from "react";
import { Pressable, StyleSheet } from "react-native";
import { createStyles } from "../../Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import { intl, t } from "../../../../intl/index.native";
import { useThemeContext } from "../../../../_bundle/Module3901";
import useSafeAreaInsets_native from "../../../../modules/safe_area/useSafeAreaInsets.native";
import { hexToRgbaString } from "../../../../utils/ColorUtils";
import ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
import VisualEffectViewAnimated from "../../../../modules/visual_effect_view/native/VisualEffectViewAnimated";
const animatedProps = {};
const useStyles = createStyles({
fill: StyleSheet.absoluteFillObject,
backdrop: {
backgroundColor: Module712.colors.BACKGROUND_SCRIM
},
backdropOpaque: {
backgroundColor: Module712.colors.MOBILE_BACKGROUND_SCRIM_OPAQUE
},
accessibilityDismiss: {
position: "absolute",
top: 0,
left: 0,
right: 0,
height: 16
}
});
export function Backdrop(props) {
const { style, accessibleDismissStyle, animatedProps: animatedProps2 = animatedProps, opaque = false, blur = "none", onDismiss, accessibilityLabel = intl.string(t.WAI6xu) } = props;
const r11 = props["aria-hidden"];
const styles = useStyles();
const theme = useThemeContext().theme;
const top = useSafeAreaInsets_native().top;
const backgroundColor = styles.backdrop.backgroundColor;
const memo = useMemo(() => hexToRgbaString(backgroundColor), [backgroundColor]);
const r18 = {
onPress: onDismiss,
"aria-hidden": true
};
return <ReanimatedRexport.View style={[styles.fill, style]} pointerEvents="box-none" animatedProps={animatedProps2}>
{onDismiss != null && <Pressable style={[styles.accessibilityDismiss, {
top
}, accessibleDismissStyle]} onPress={onDismiss} accessibilityRole="button" accessibilityLabel={accessibilityLabel} aria-hidden={r11} />}
<Pressable {...blur !== "none" ? {
...r18,
style: styles.fill,
children: <VisualEffectViewAnimated blurAmount={blur === "none" ? 0 : blur === "subtle" ? 0.05 : blur !== "strong" ? void 0 : 0.25} style={styles.fill} blurTheme={theme} blurTintRgba={memo} android_fallbackColor={styles.backdrop.backgroundColor} />
} : {
...r18,
style: [styles.fill, opaque ? styles.backdropOpaque : styles.backdrop]
}} />
</ReanimatedRexport.View>;
}
design/components/Backdrop/native/BackdropConstants.tsx
+2
View File
@@ -0,0 +1,2 @@
// Metro module 13172 (f13173).
export const BACKDROP_OPAQUE_MAX_OPACITY = 0.7;
design/components/Button/native/BaseButton.native.tsx
+101
View File
@@ -0,0 +1,101 @@
// Metro module 4607 (f4608).
import { forwardRef, useMemo } from "react";
import * as _Module17 from "react-native";
import { IOS_POINTER_STYLE } from "../../Styles/native/styleConstants";
import { useThemeContext, ThemeContextProvider } from "../../../../_bundle/Module3901";
import { createStyles } from "../../Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import { useButtonPressAnimationProps } from "./ButtonHooks.native";
import ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
import { isNotNullish } from "../../../../utils/GlobalUtils";
import { isAndroid } from "../../../../utils/PlatformUtils";
let AnimatedComponent, AnimatedComponent2;
const _excluded = ["style"];
const { Pressable, TouchableOpacity } = _Module17;
const useStyles = createStyles((a0) => ({
button: {
...a0 === "primary-overlay" ? Module712.shadows.SHADOW_BUTTON_OVERLAY : {}
},
disabled: {
opacity: 0.5
}
}));
AnimatedComponent = ReanimatedRexport.createAnimatedComponent(Pressable);
AnimatedComponent2 = ReanimatedRexport.createAnimatedComponent(TouchableOpacity);
const r43 = forwardRef(function(a0, a1) {
const { children, style, variant = "primary" } = a0;
let disabled2 = a0.disabled;
if (disabled2 === void 0) {
disabled2 = false;
}
let loading = a0.loading;
if (loading === void 0) {
loading = false;
}
const busy = loading;
const pressed = a0.pressed;
let onPress = a0.onPress;
const { onPressDisabled, onPressIn: onPressIn2, onPressOut: onPressOut2, onLongPress, onLayout, accessible } = a0;
let accessibilityRole = a0.accessibilityRole;
const { accessibilityLabel, accessibilityHint, accessibilityValue, accessibilityState, accessibilityActions, onAccessibilityAction, accessibilityElementsHidden, importantForAccessibility, pointerEvents, hitSlop, scaleAmountInPx } = a0;
const styles = useStyles(variant);
const disabled = disabled2 ? onPressDisabled == null : disabled2;
if (disabled2) {
onPress = onPressDisabled;
}
if (onPress == null) {
onPress = void 0;
}
const buttonPressAnimationProps = useButtonPressAnimationProps(pressed, scaleAmountInPx, onLayout, onPressIn2, onPressOut2);
const { style: style2, ...rest } = buttonPressAnimationProps;
const r52 = pressed == null ? {
animatedScaleStyles: void 0,
buttonAnimationProps: {
onLayout,
onPressIn: onPressIn2,
onPressOut: onPressOut2
}
} : {
animatedScaleStyles: style2,
buttonAnimationProps: rest
};
const { animatedScaleStyles, buttonAnimationProps } = r52;
const memo = useMemo(() => ({
...accessibilityState,
disabled,
busy
}), [accessibilityState, disabled, busy]);
const theme = useThemeContext().theme;
const theme2 = variant !== "primary-overlay" ? variant === "secondary-overlay" ? theme === "light" ? "dark" : void 0 : void 0 : "light";
const r72 = theme2 != null ? <ThemeContextProvider theme={theme2}>{children}</ThemeContextProvider> : children;
const style3 = [styles.button, style, , , ,];
if (disabled2) {
disabled2 = styles.disabled;
}
style3[2] = disabled2;
style3[3] = animatedScaleStyles;
style3[4] = IOS_POINTER_STYLE;
if (accessibilityRole !== "none") {
if (accessibilityRole == null) {
accessibilityRole = "button";
}
return <AnimatedComponent {...buttonAnimationProps} ref={a1} accessible={accessible} accessibilityRole={accessibilityRole} accessibilityLabel={accessibilityLabel} accessibilityHint={accessibilityHint} accessibilityValue={accessibilityValue} accessibilityState={memo} accessibilityActions={accessibilityActions} onAccessibilityAction={onAccessibilityAction} accessibilityElementsHidden={accessibilityElementsHidden} importantForAccessibility={importantForAccessibility} pointerEvents={pointerEvents} style={style3} onPress={onPress} onLongPress={onLongPress} disabled={disabled} hitSlop={hitSlop}>{r72}</AnimatedComponent>;
}
const accessibilityLabel2 = accessibilityElementsHidden ? "" : [accessibilityLabel, accessibilityHint].filter(isNotNullish).join(", ");
let r98 = accessible;
if (r98 == null) {
r98 = isAndroid();
}
return <AnimatedComponent2 {...buttonAnimationProps} ref={a1} accessible={r98 ? !r98 : void 0} accessibilityRole="none" accessibilityLabel={accessibilityLabel2} accessibilityElementsHidden={accessibilityElementsHidden} activeOpacity={1} importantForAccessibility={importantForAccessibility} style={style3} onPress={onPress} onPressIn={(event) => {
const onPressIn2 = buttonAnimationProps.onPressIn;
if (onPressIn2 != null) {
onPressIn2.call(buttonAnimationProps, event);
}
}} onPressOut={(event) => {
const onPressOut2 = buttonAnimationProps.onPressOut;
if (onPressOut2 != null) {
onPressOut2.call(buttonAnimationProps, event);
}
}} hitSlop={hitSlop}>{r72}</AnimatedComponent2>;
});
export { r43 as BaseButton };
design/components/Button/native/BaseIconButton.native.tsx
+50
View File
@@ -0,0 +1,50 @@
// Metro module 6683 (f6684).
import { forwardRef, isValidElement } from "react";
import { createStyles } from "../../Styles/native/createStyles";
import * as _ButtonConstants_native from "./ButtonConstants.native";
import { SMALL_BUTTON_PADDING, MEDIUM_BUTTON_PADDING, LARGE_BUTTON_PADDING, DEFAULT_BUTTON_SIZE, SMALL_BUTTON_HEIGHT, MEDIUM_BUTTON_HEIGHT, MINIMUM_HIT_AREA } from "./ButtonConstants.native";
import ReanimatedRexport, { useSharedValue } from "../../../../modules/reanimated/ReanimatedRexport";
import Icon from "../../../void/Icon/native/Icon";
import { useIconTintStyles, useIconSizeStyles } from "./ButtonHooks.native";
import { BaseButton } from "./BaseButton.native";
import { ButtonPill } from "./ButtonPill.native";
let AnimatedComponent;
const useStyles = createStyles((a0, a1) => ({
button: {
flexShrink: 0,
flexGrow: 0,
alignSelf: "center"
},
pill: {
...a1 === "sm" ? {
paddingHorizontal: SMALL_BUTTON_PADDING,
paddingVertical: SMALL_BUTTON_PADDING
} : a1 === "md" ? {
paddingHorizontal: MEDIUM_BUTTON_PADDING,
paddingVertical: MEDIUM_BUTTON_PADDING
} : a1 === "lg" ? {
paddingHorizontal: LARGE_BUTTON_PADDING,
paddingVertical: LARGE_BUTTON_PADDING
} : {}
}
}));
AnimatedComponent = ReanimatedRexport.createAnimatedComponent(Icon);
const r31 = forwardRef(function(a0, a1) {
const { style, pillStyle, variant: variant2 = "primary", size = DEFAULT_BUTTON_SIZE, maxFontSizeMultiplier, loading, icon, scaleAmountInPx: scaleAmountInPx2 = 4 } = a0;
const styles3 = useStyles(variant2, size);
const sharedValue = useSharedValue(0);
const styles2 = useIconTintStyles(variant2);
const styles = useIconSizeStyles(size, true, maxFontSizeMultiplier);
let LARGE_BUTTON_HEIGHT = _ButtonConstants_native.LARGE_BUTTON_HEIGHT;
if (size === "sm") {
LARGE_BUTTON_HEIGHT = SMALL_BUTTON_HEIGHT;
} else if (size === "md") {
LARGE_BUTTON_HEIGHT = MEDIUM_BUTTON_HEIGHT;
}
return <BaseButton {...a0} ref={a1} style={[styles3.button, style]} pressed={sharedValue} scaleAmountInPx={scaleAmountInPx2} hitSlop={Math.max((MINIMUM_HIT_AREA - LARGE_BUTTON_HEIGHT) / 2, 0)}>
<ButtonPill style={[styles3.pill, pillStyle]} variant={variant2} size={size} loading={loading} loaderSize={size === "lg" ? "sm" : "xs"} pressed={sharedValue}>
{isValidElement(icon) ? icon : <AnimatedComponent source={icon} style={[styles2, styles]} />}
</ButtonPill>
</BaseButton>;
});
export { r31 as BaseIconButton };
design/components/Button/native/BaseTextButton.native.tsx
+332
View File
@@ -0,0 +1,332 @@
// Metro module 4601 (f4602).
import { createContext, forwardRef, useContext, useRef, useState, useCallback, isValidElement } from "react";
import { Text, View, Platform } from "react-native";
import { createStyles } from "../../Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import ReanimatedRexport, { useSharedValue, useWorkletCallback, useAnimatedStyle } from "../../../../modules/reanimated/ReanimatedRexport";
import Icon from "../../../void/Icon/native/Icon";
import * as _spring from "../../../animation/reanimated/spring/spring";
import * as _springPresets from "../../../animation/reanimated/spring/springPresets";
import { LARGE_BUTTON_HEIGHT, MINIMUM_HIT_AREA, SMALL_BUTTON_HEIGHT, MEDIUM_BUTTON_HEIGHT, DEFAULT_BUTTON_SIZE, BUTTON_DEFAULT_MAX_FONT_SIZE_MULTIPLIER, getButtonDefaultTextVariant } from "./ButtonConstants.native";
import { useIconSizeStyles, useButtonTextColorStyles } from "./ButtonHooks.native";
import MobileVisualRefreshExperiment from "../../../../modules/themes/experiments/MobileVisualRefreshExperiment";
import { TextStyleSheet } from "../../Text/native/Text";
import { AccessibilityPreferencesContext } from "../../../../_bundle/Module3908";
import { triggerHapticFeedback, HapticFeedbackTypes } from "../../../../modules/haptics/HapticUtils.native";
import { BaseButton } from "./BaseButton.native";
import { getNodeText } from "../../../utils/native";
import { ButtonPill } from "./ButtonPill.native";
let useStyles, useStyles2, useStyles3, AnimatedComponent, context, __initData, __initData2, __initData3, useStyles4, c2803_19, getTextPlatformLineHeight, BaseTextButtonIcon;
const CollapsingText = function CollapsingText(props) {
let sharedValue2, collapseText;
let sharedValue3, collapseText2, textCollapsed;
const { children, collapseText: collapseText3 } = props;
const styles2 = useStyles2();
const sharedValue = useSharedValue(0);
const r20 = function({ nativeEvent }) {
if (sharedValue.get() === 0) {
sharedValue.set(nativeEvent.layout.width);
}
};
r20.__closure = {
containerWidth: sharedValue
};
r20.__workletHash = 5541458715155;
r20.__initData = __initData;
const workletCallback = useWorkletCallback(r20, [sharedValue]);
sharedValue2 = sharedValue;
collapseText = collapseText3;
const r30 = function() {
let r23;
if (sharedValue2.get() === 0) {
r23 = {};
} else {
const r16 = collapseText.get();
let r0 = 1;
r23 = {
width: _spring.withSpring(r16 !== 1 ? sharedValue2.get() : 0, _springPresets.SUBTLE_SPRING, "animate-always"),
opacity: null
};
if (collapseText.get() === 1) {
r0 = 0;
}
r23.opacity = _spring.withSpring(r0, _springPresets.SUBTLE_SPRING, "animate-always");
}
return r23;
};
r30.__closure = {
containerWidth: sharedValue,
withSpring: _spring.withSpring,
collapsed: collapseText,
SUBTLE_SPRING: _springPresets.SUBTLE_SPRING
};
r30.__workletHash = 493185281611;
r30.__initData = __initData2;
const animatedStyle = useAnimatedStyle(r30);
sharedValue3 = sharedValue;
collapseText2 = collapseText;
textCollapsed = void 0;
textCollapsed = useStyles2().textCollapsed;
const r45 = function() {
return collapseText2.get() === 0 ? {} : {
...textCollapsed,
width: sharedValue3.get()
};
};
r45.__closure = {
collapsed: collapseText,
textCollapsed,
containerWidth: sharedValue
};
r45.__workletHash = 5824483783888;
r45.__initData = __initData3;
return <ReanimatedRexport.View style={[styles2.container, animatedStyle]} onLayout={workletCallback}>
<ReanimatedRexport.View style={useAnimatedStyle(r45)}>{children}</ReanimatedRexport.View>
</ReanimatedRexport.View>;
};
BaseTextButtonIcon = function BaseTextButtonIcon(props) {
const { icon, size, iconPosition, iconOpticalOffsetMargin } = props;
return <AnimatedComponent source={icon} style={[props.style, useIconSizeStyles(size), useStyles4(iconPosition, iconOpticalOffsetMargin).offset]} />;
};
Platform;
useStyles = createStyles((a0, a1) => ({
grow: {
flexGrow: 1,
alignSelf: "stretch"
},
shrink: {
flexShrink: 1
},
buttonText: {
flexShrink: 1,
flexGrow: 0,
lineHeight: a1 != null ? ({
sm: a1,
md: a1 + 0.5,
lg: a1 + 1.9
})[a0] : void 0
},
icon: {
flexShrink: 0,
flexGrow: 0
},
iconLeft: {
paddingLeft: 4
},
iconRight: {
paddingRight: 4
},
expressiveButtonContainer: {
position: "relative"
}
}));
useStyles2 = createStyles({
container: {
flexDirection: "row",
alignItems: "center",
position: "relative"
},
textCollapsed: {
position: "absolute",
left: 0
}
});
useStyles3 = createStyles({
entityWrapper: {
borderWidth: 1,
borderRadius: Module712.radii.round,
borderColor: Module712.colors.BORDER_SUBTLE,
overflow: "hidden"
}
});
AnimatedComponent = ReanimatedRexport.createAnimatedComponent(Icon);
context = createContext("md");
__initData = {
code: "function BaseTextButtonNativeTsx1({nativeEvent:nativeEvent}){const{containerWidth}=this.__closure;if(containerWidth.get()!==0)return;const{width:width}=nativeEvent.layout;containerWidth.set(width);}"
};
__initData2 = {
code: "function BaseTextButtonNativeTsx2(){const{containerWidth,withSpring,collapsed,SUBTLE_SPRING}=this.__closure;if(containerWidth.get()===0)return{};return{width:withSpring(collapsed.get()===1?0:containerWidth.get(),SUBTLE_SPRING,'animate-always'),opacity:withSpring(collapsed.get()===1?0:1,SUBTLE_SPRING,'animate-always')};}"
};
__initData3 = {
code: "function BaseTextButtonNativeTsx3(){const{collapsed,textCollapsed,containerWidth}=this.__closure;if(collapsed.get()===0)return{};return{...textCollapsed,width:containerWidth.get()};}"
};
useStyles4 = createStyles((a0, a1) => {
if (a1 === 0) {
return {
offset: {}
};
}
if (a0 === "start") {
return {
offset: {
marginLeft: a1
}
};
}
if (a0 === "end") {
return {
offset: {
marginRight: a1
}
};
}
return {
offset: {}
};
});
LARGE_BUTTON_HEIGHT;
const top = Math.max((MINIMUM_HIT_AREA - SMALL_BUTTON_HEIGHT) / 2, 0);
LARGE_BUTTON_HEIGHT;
const top2 = Math.max((MINIMUM_HIT_AREA - MEDIUM_BUTTON_HEIGHT) / 2, 0);
const top3 = Math.max((MINIMUM_HIT_AREA - LARGE_BUTTON_HEIGHT) / 2, 0);
c2803_19 = {
sm: {
top,
left: void 0,
right: void 0,
bottom: top
},
md: {
top: top2,
left: void 0,
right: void 0,
bottom: top2
},
lg: {
top: top3,
left: void 0,
right: void 0,
bottom: top3
}
};
getTextPlatformLineHeight = (a0, a1) => {};
const r125 = {
...forwardRef(function(a0, a1) {
const { style, pillStyle, text } = a0;
let textElement = a0.textElement;
const { size = DEFAULT_BUTTON_SIZE, loading, icon, iconPosition: iconPosition2 = "start", iconOpticalOffsetMargin: iconOpticalOffsetMargin2 = 0, grow } = a0;
let r34 = grow !== void 0 && grow;
const shrink = a0.shrink;
let r33 = shrink !== void 0 && shrink;
const { collapseText: collapseText3, accessibilityRole: accessibilityRole2 = "button" } = a0;
let accessibilityLabel = a0.accessibilityLabel;
const { maxFontSizeMultiplier = BUTTON_DEFAULT_MAX_FONT_SIZE_MULTIPLIER, shiny: shiny2 = false, onPressIn, onPressOut, onLayout } = a0;
let r10 = MobileVisualRefreshExperiment("BaseTextButton");
const r40 = TextStyleSheet[a0.textVariant != null ? a0.textVariant : getButtonDefaultTextVariant(size)];
const styles = useStyles(size, r40.fontSize);
const hitSlop = c2803_19[size];
const enabled = useContext(AccessibilityPreferencesContext).reducedMotion.enabled;
let variant = a0.variant;
if (variant == null) {
variant = "primary";
}
if (r10) {
r10 = variant === "tertiary";
}
if (r10) {
variant = "secondary";
}
const sharedValue4 = useSharedValue(0);
const r88 = variant.startsWith("expressive");
let c14344_4 = r88;
const ref = useRef(null);
const ref2 = useRef({
width: 0,
height: 0
});
const [state, setState] = useState({
pressed: false,
posx: 0,
posy: 0
});
const callback = useCallback((a0) => {
if (onLayout != null) {
onLayout(a0);
}
if (c14344_4) {
const layout = a0.nativeEvent.layout;
ref2.current = {
width: layout.width,
height: layout.height
};
}
}, [onLayout, r88]);
const callback2 = useCallback((a0) => {
if (onPressIn != null) {
onPressIn(a0);
}
if (c14344_4) {
if (enabled) {
const current2 = ref.current;
if (current2 != null) {
current2.play();
}
} else {
const nativeEvent = a0.nativeEvent;
const { locationX, locationY } = nativeEvent;
const current = ref2.current;
setState({
pressed: true,
posx: locationX - current.width / 2,
posy: locationY - current.height / 2
});
}
triggerHapticFeedback(HapticFeedbackTypes.IMPACT_HEAVY);
}
}, [r88, onPressIn, enabled]);
const callback3 = useCallback((a0) => {
if (onPressOut != null) {
onPressOut(a0);
}
if (c14344_4) {
setState((prevState) => ({
...prevState,
pressed: false
}));
triggerHapticFeedback(HapticFeedbackTypes.IMPACT_MEDIUM);
}
}, [r88, onPressOut]);
const styles2 = useButtonTextColorStyles(variant);
const variant2 = variant;
const r115 = icon == null ? {} : iconPosition2 === "start" ? styles.iconLeft : styles.iconRight;
const r118 = icon != null ? isValidElement(icon) ? icon : <BaseTextButtonIcon icon={icon} size={size} style={[styles.icon, {
tintColor: styles2.color
}]} iconOpticalOffsetMargin={iconOpticalOffsetMargin2} iconPosition={iconPosition2} /> : <BaseTextButtonIcon icon={icon} size={size} style={[styles.icon, {
tintColor: styles2.color
}]} iconOpticalOffsetMargin={iconOpticalOffsetMargin2} iconPosition={iconPosition2} />;
if (textElement == null) {
textElement = <Text maxFontSizeMultiplier={maxFontSizeMultiplier} numberOfLines={1} style={[styles.buttonText, r40, styles2, r115]}>{text}</Text>;
}
if (r34) {
r34 = styles.grow;
}
const style2 = [r34, , , ,];
if (r33) {
r33 = styles.shrink;
}
style2[1] = r33;
style2[2] = style;
style2[3] = r88 && styles.expressiveButtonContainer;
const pointerEvents = r88 ? "box-only" : a0.pointerEvents;
if (accessibilityLabel == null) {
accessibilityLabel = getNodeText(text);
}
return <BaseButton ref={a1} {...a0} onPressIn={callback2} onPressOut={callback3} onLayout={callback} style={style2} pointerEvents={pointerEvents} pressed={sharedValue4} accessibilityRole={accessibilityRole2} accessibilityLabel={accessibilityLabel} hitSlop={hitSlop}>
<ButtonPill variant={variant2} size={size} loading={loading} pressed={sharedValue4} style={pillStyle} shiny={shiny2} expressiveRiveRef={r88 ? ref : void 0} expressivePressState={r88 ? state : void 0}>
<context.Provider value={size}>
{icon != null && iconPosition2 === "start" && r118}
{collapseText3 !== void 0 ? <CollapsingText collapseText={collapseText3}>{textElement}</CollapsingText> : textElement}
{icon != null && iconPosition2 === "end" && r118}
</context.Provider>
</ButtonPill>
</BaseButton>;
}),
Icon: function TextButtonIcon(props) {
const { source, variant = "icon", disableColor = true } = props;
const context2 = useContext(context);
const styles3 = useStyles3();
const r22 = <AnimatedComponent source={source} disableColor={disableColor} style={useIconSizeStyles(context2)} />;
return variant === "entity" ? <View style={styles3.entityWrapper}>{r22}</View> : r22;
}
};
export { r125 as BaseTextButton };
design/components/Button/native/Button.native.tsx
+3
View File
@@ -0,0 +1,3 @@
// Metro module 4600 (f4601).
import { BaseTextButton } from "./BaseTextButton.native";
export const Button = BaseTextButton;
design/components/Button/native/ButtonConstants.native.tsx
+37
View File
@@ -0,0 +1,37 @@
// Metro module 4604 (f4605).
import { IconSizes, getIconSize } from "../../../void/Icon/native/Icon";
import Module712 from "../../../../_bundle/Module712";
const SMALL = IconSizes.SMALL;
const SMALL_20 = IconSizes.SMALL_20;
const MEDIUM = IconSizes.MEDIUM;
const MEDIUM2 = IconSizes.MEDIUM;
const r2 = 32 - getIconSize(SMALL);
const r3 = 40 - getIconSize(SMALL_20);
const r1 = 48 - getIconSize(MEDIUM);
export const MINIMUM_HIT_AREA = 44;
export const SMALL_BUTTON_HEIGHT = 32;
export const MEDIUM_BUTTON_HEIGHT = 40;
export const LARGE_BUTTON_HEIGHT = 48;
export const FAB_BUTTON_SIZE = 56;
export const BUTTON_BORDER_WIDTH = 1;
export const DEFAULT_BUTTON_SIZE = "md";
export { SMALL as SMALL_BUTTON_ICON_SIZE };
export { SMALL_20 as MEDIUM_BUTTON_ICON_SIZE };
export { MEDIUM as LARGE_BUTTON_ICON_SIZE };
export { MEDIUM2 as FAB_BUTTON_ICON_SIZE };
export const SMALL_BUTTON_HORIZONTAL_PADDING = 12;
export const MEDIUM_BUTTON_HORIZONTAL_PADDING = 20;
export const LARGE_BUTTON_HORIZONTAL_PADDING = 24;
export const SMALL_BUTTON_PADDING = (r2 - 2) / 2;
export const MEDIUM_BUTTON_PADDING = (r3 - 2) / 2;
export const LARGE_BUTTON_PADDING = (r1 - 2) / 2;
export const BUTTON_DEFAULT_MAX_FONT_SIZE_MULTIPLIER = 3;
export function getButtonDefaultTextVariant(a0) {
return a0 === "lg" ? "text-md/semibold" : "text-sm/semibold";
}
export function getButtonPadding(a0, a1) {
return (a0 - getIconSize(a1) - 2) / 2;
}
export function getButtonBorderRadius(a0) {
return a0 === "lg" ? Module712.modules.button.BORDER_RADIUS_LG : Module712.modules.button.BORDER_RADIUS;
}
design/components/Button/native/ButtonEllipsis.native.tsx
+98
View File
@@ -0,0 +1,98 @@
// Metro module 4615 (f4616).
import * as _ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
import ReanimatedRexport, { useSharedValue, cancelAnimation, useAnimatedStyle, Easing } from "../../../../modules/reanimated/ReanimatedRexport";
import { createStyles } from "../../Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import * as _timing from "../../../animation/reanimated/timing/timing";
import { useForegroundColor } from "./ButtonHooks.native";
import { useMountLayoutEffect } from "../../../../hooks/useMountEffect";
let c2814_5, useStyles, withEllipsisAnimation, __initData;
const EllipsisCircle = function EllipsisCircle(props) {
const { variant, size, offset } = props;
const styles = useStyles(size, offset, useForegroundColor(variant));
const sharedValue = useSharedValue(0.4);
const sharedValue2 = useSharedValue(0.75);
useMountLayoutEffect(() => {
sharedValue.set(_ReanimatedRexport.withDelay(166.66666666666666 * offset, _ReanimatedRexport.withRepeat(_timing.withTiming(1, c2814_5, "animate-always"), -1, true)));
sharedValue2.set(_ReanimatedRexport.withDelay(166.66666666666666 * offset, _ReanimatedRexport.withRepeat(_timing.withTiming(1, c2814_5, "animate-always"), -1, true)));
return () => {
cancelAnimation(sharedValue);
cancelAnimation(sharedValue2);
};
});
const w = () => ({
opacity: sharedValue.get(),
transform: [{
scale: sharedValue2.get()
}]
});
w.__closure = {
opacity: sharedValue,
scale: sharedValue2
};
w.__workletHash = 13371762734705;
w.__initData = __initData;
return <ReanimatedRexport.View style={[styles.circle, useAnimatedStyle(w)]} />;
};
c2814_5 = {
duration: 500,
easing: Easing.inOut(Easing.quad)
};
useStyles = createStyles((a0, a1, a2) => {
let r0, width;
L7: {
if (a0 === "lg") {
r0 = 4;
width = 8;
} else {
if (a0 !== "md" && a0 !== "sm") {
r0 = 4;
width = void 0;
if (a0 !== "xs") {
break L7;
}
r0 = 3;
width = 5;
break L7;
}
r0 = 4;
width = 6;
}
}
return {
circle: {
width,
height: width,
borderRadius: Module712.radii.round,
marginEnd: a1 !== 2 ? r0 : 0,
backgroundColor: a2
}
};
});
const withEllipsisAnimation2 = function withEllipsisAnimation(a0, a1) {
return _ReanimatedRexport.withDelay(166.66666666666666 * a0, _ReanimatedRexport.withRepeat(_timing.withTiming(a1, c2814_5, "animate-always"), -1, true));
};
withEllipsisAnimation2.__closure = {
ELLIPSIS_APPEAR_DURATION: 500,
withDelay: _ReanimatedRexport.withDelay,
withRepeat: _ReanimatedRexport.withRepeat,
withTiming: _timing.withTiming,
ELLIPSIS_APPEAR_TIMING: c2814_5
};
withEllipsisAnimation2.__workletHash = 2181731162311;
withEllipsisAnimation2.__initData = {
code: "function withEllipsisAnimation_ButtonEllipsisNativeTsx1(offset,value){const{ELLIPSIS_APPEAR_DURATION,withDelay,withRepeat,withTiming,ELLIPSIS_APPEAR_TIMING}=this.__closure;const animationTimeMs=ELLIPSIS_APPEAR_DURATION;const animationStaggerTimeMs=animationTimeMs/3;return withDelay(offset*animationStaggerTimeMs,withRepeat(withTiming(value,ELLIPSIS_APPEAR_TIMING,'animate-always'),-1,true));}"
};
withEllipsisAnimation = withEllipsisAnimation2;
__initData = {
code: "function ButtonEllipsisNativeTsx2(){const{opacity,scale}=this.__closure;return{opacity:opacity.get(),transform:[{scale:scale.get()}]};}"
};
export function Ellipsis(props) {
return <ReanimatedRexport.View style={{
flexDirection: "row"
}}>
<EllipsisCircle offset={0} {...props} />
<EllipsisCircle offset={1} {...props} />
<EllipsisCircle offset={2} {...props} />
</ReanimatedRexport.View>;
}
design/components/Button/native/ButtonHooks.native.tsx
+419
View File
@@ -0,0 +1,419 @@
// Metro module 4605 (f4606).
import { useMemo, useCallback } from "react";
import { experimental_createToken, createStyleProperties } from "../../Styles/native/createStyles";
import { useThemeContext } from "../../../../_bundle/Module3901";
import Module712 from "../../../../_bundle/Module712";
import { useToken } from "../../../tokens/native/useToken";
import * as _ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
import { useAnimatedStyle, useSharedValue } from "../../../../modules/reanimated/ReanimatedRexport";
import * as _spring from "../../../animation/reanimated/spring/spring";
import * as _springPresets from "../../../animation/reanimated/spring/springPresets";
import * as _ButtonConstants_native from "./ButtonConstants.native";
import { MEDIUM_BUTTON_ICON_SIZE, SMALL_BUTTON_ICON_SIZE, LARGE_BUTTON_ICON_SIZE, getButtonDefaultTextVariant } from "./ButtonConstants.native";
import { useFontScale } from "../../../../modules/screen/native/useFontScale";
import { getIconSize } from "../../../void/Icon/native/Icon";
import { TextStyleSheet } from "../../Text/native/Text";
import { isAndroid } from "../../../../utils/PlatformUtils";
function $mk74814($env) {
return () => {
const r6 = $env;
const r8 = r6[1];
if (r8 == null) {
return null;
}
const r4 = r6[0];
if (r4 === "primary") {
const r83 = $env.$parent;
const WHITE = (0, r83[1])(r83[2][3]).unsafe_rawColors.WHITE;
const contrastingColor = (0, r83[0])(r83[2][2]).getContrastingColor(r8, {
base: WHITE,
contrastRatio: (0, r83[0])(r83[2][2]).WCAGContrastRatios.HighContrastText
});
const r110 = (0, r83[0])(r83[2][2]).darkenColor(contrastingColor, 0.5);
return {
backgroundColor: [contrastingColor, r110],
borderColor: [contrastingColor, r110],
color: WHITE
};
}
if (r4 === "secondary") {
const r46 = $env.$parent;
const r51 = (0, r46[0])(r46[2][4]);
const r53 = r6[2];
const isThemeLight3 = r51.isThemeLight(r53);
const r58 = (0, r46[0])(r46[2][2]);
const backgroundColor = [isThemeLight3 ? r58.setColorOpacity("white", 0.72) : r58.setColorOpacity("white", 0.24), ,];
const isThemeLight4 = (0, r46[0])(r46[2][4]).isThemeLight(r53);
const r74 = (0, r46[0])(r46[2][2]);
backgroundColor[1] = isThemeLight4 ? r74.setColorOpacity("white", 0.62) : r74.setColorOpacity("white", 0.34);
return {
backgroundColor,
borderColor: [r46[4], r46[4]],
color: void 0
};
}
if (r4 === "tertiary") {
const r5 = $env.$parent;
const r16 = (0, r5[0])(r5[2][4]);
const r9 = r6[2];
const isThemeLight = r16.isThemeLight(r9);
const r21 = (0, r5[0])(r5[2][2]);
const r10 = isThemeLight ? r21.setColorOpacity(r8, 0.4) : r21.setColorOpacity("white", 0.1);
const isThemeLight2 = (0, r5[0])(r5[2][4]).isThemeLight(r9);
const r35 = (0, r5[0])(r5[2][2]);
return {
backgroundColor: [r10, isThemeLight2 ? r35.darkenColor(r10, 0.3) : r35.setColorOpacity("white", 0.2)],
borderColor: [r5[4], r5[4]],
color: void 0
};
}
return null;
};
}
function $mk74815($env) {
return function n() {
const r9 = $env;
const r4 = r9[1];
const r6 = r4.get() > 0 ? (r4.get() - r9[2]) / r4.get() : 1;
const r19 = $env.$parent;
const r5 = r19[0];
const r20 = r19[2];
return {
transform: [{
scale: r5(r20[7]).withSpring(r5(r20[6]).interpolate(r9[0].get(), [0, 1], [1, r6]), r5(r20[8]).ON_PRESS_SPRING, "animate-always")
}]
};
};
}
let c2806_6, c2806_7, c2806_8, c2806_9, c2806_10;
let env2806 = {};
const c2806_4 = "rgba(0,0,0,0.001)";
const c2806_5 = experimental_createToken(() => "#161CBB");
c2806_6 = experimental_createToken(() => "#1318A0");
c2806_7 = {
primary: Module712.colors.CONTROL_PRIMARY_TEXT_DEFAULT,
"experimental_welcome-secondary": Module712.unsafe_rawColors.WHITE,
secondary: Module712.colors.CONTROL_SECONDARY_TEXT_DEFAULT,
tertiary: Module712.colors.REDESIGN_BUTTON_TERTIARY_TEXT,
destructive: Module712.colors.CONTROL_CRITICAL_PRIMARY_TEXT_DEFAULT,
"critical-primary": Module712.colors.CONTROL_CRITICAL_PRIMARY_TEXT_DEFAULT,
"critical-secondary": Module712.colors.CONTROL_CRITICAL_SECONDARY_TEXT_DEFAULT,
active: Module712.colors.CONTROL_CONNECTED_TEXT_DEFAULT,
"primary-overlay": Module712.colors.CONTROL_OVERLAY_PRIMARY_TEXT_DEFAULT,
"secondary-overlay": Module712.colors.CONTROL_OVERLAY_SECONDARY_TEXT_DEFAULT,
"experimental_premium-primary": Module712.colors.WHITE,
"experimental_premium-basic": Module712.colors.WHITE,
"experimental_premium-secondary": Module712.colors.TEXT_BRAND,
"icon-only": Module712.colors.CONTROL_ICON_ONLY_ICON_DEFAULT,
expressive: Module712.colors.CONTROL_EXPRESSIVE_TEXT_DEFAULT
};
const styleProperties = createStyleProperties((a0) => {
switch (a0) {
case "primary":
return {
backgroundInactive: Module712.colors.CONTROL_PRIMARY_BACKGROUND_DEFAULT,
backgroundPressed: Module712.colors.CONTROL_PRIMARY_BACKGROUND_ACTIVE,
borderInactive: Module712.colors.CONTROL_PRIMARY_BORDER_DEFAULT,
borderPressed: Module712.colors.CONTROL_PRIMARY_BORDER_ACTIVE
};
case "secondary":
return {
backgroundInactive: Module712.colors.CONTROL_SECONDARY_BACKGROUND_DEFAULT,
backgroundPressed: Module712.colors.CONTROL_SECONDARY_BACKGROUND_ACTIVE,
borderInactive: Module712.colors.CONTROL_SECONDARY_BORDER_DEFAULT,
borderPressed: Module712.colors.CONTROL_SECONDARY_BORDER_ACTIVE
};
case "tertiary":
return {
backgroundInactive: Module712.colors.REDESIGN_BUTTON_TERTIARY_BACKGROUND,
backgroundPressed: Module712.colors.REDESIGN_BUTTON_TERTIARY_PRESSED_BACKGROUND,
borderInactive: c2806_4,
borderPressed: c2806_4
};
case "critical-primary":
case "destructive":
return {
backgroundInactive: Module712.colors.CONTROL_CRITICAL_PRIMARY_BACKGROUND_DEFAULT,
backgroundPressed: Module712.colors.CONTROL_CRITICAL_PRIMARY_BACKGROUND_ACTIVE,
borderInactive: Module712.colors.CONTROL_CRITICAL_PRIMARY_BORDER_DEFAULT,
borderPressed: Module712.colors.CONTROL_CRITICAL_PRIMARY_BORDER_ACTIVE
};
case "critical-secondary":
return {
backgroundInactive: Module712.colors.CONTROL_CRITICAL_SECONDARY_BACKGROUND_DEFAULT,
backgroundPressed: Module712.colors.CONTROL_CRITICAL_SECONDARY_BACKGROUND_ACTIVE,
borderInactive: Module712.colors.CONTROL_CRITICAL_SECONDARY_BORDER_DEFAULT,
borderPressed: Module712.colors.CONTROL_CRITICAL_SECONDARY_BORDER_ACTIVE
};
case "active":
return {
backgroundInactive: Module712.colors.CONTROL_CONNECTED_BACKGROUND_DEFAULT,
backgroundPressed: Module712.colors.CONTROL_CONNECTED_BACKGROUND_ACTIVE,
borderInactive: Module712.colors.CONTROL_CONNECTED_BORDER_DEFAULT,
borderPressed: Module712.colors.CONTROL_CONNECTED_BORDER_ACTIVE
};
case "experimental_premium-secondary":
case "primary-overlay":
return {
backgroundInactive: Module712.colors.CONTROL_OVERLAY_PRIMARY_BACKGROUND_DEFAULT,
backgroundPressed: Module712.colors.CONTROL_OVERLAY_PRIMARY_BACKGROUND_ACTIVE,
borderInactive: c2806_4,
borderPressed: c2806_4
};
case "secondary-overlay":
return {
backgroundInactive: Module712.colors.CONTROL_OVERLAY_SECONDARY_BACKGROUND_DEFAULT,
backgroundPressed: Module712.colors.CONTROL_OVERLAY_SECONDARY_BACKGROUND_ACTIVE,
borderInactive: c2806_4,
borderPressed: c2806_4
};
case "experimental_welcome-secondary":
return {
backgroundInactive: c2806_5,
backgroundPressed: c2806_6,
borderInactive: c2806_4,
borderPressed: c2806_4
};
case "experimental_premium-primary":
case "experimental_premium-basic":
return {
backgroundInactive: c2806_4,
backgroundPressed: Module712.colors.REDESIGN_BUTTON_PREMIUM_PRIMARY_PRESSED_BACKGROUND,
borderInactive: c2806_4,
borderPressed: c2806_4
};
case "icon-only":
return {
backgroundInactive: c2806_4,
backgroundPressed: Module712.colors.CONTROL_ICON_ONLY_BACKGROUND_ACTIVE,
borderInactive: c2806_4,
borderPressed: c2806_4
};
case "expressive":
return {
backgroundInactive: c2806_4,
backgroundPressed: c2806_4,
borderInactive: c2806_4,
borderPressed: c2806_4
};
default:
return void 0;
}
});
c2806_8 = styleProperties;
c2806_9 = {
code: "function ButtonHooksNativeTsx1(){const{themedStyles,colors,interpolateColor,pressed}=this.__closure;var _themedStyles$backgro,_themedStyles,_themedStyles$borderC,_themedStyles2;const backgroundColor=(_themedStyles$backgro=(_themedStyles=themedStyles)===null||_themedStyles===void 0?void 0:_themedStyles.backgroundColor)!==null&&_themedStyles$backgro!==void 0?_themedStyles$backgro:[colors.backgroundInactive,colors.backgroundPressed];const borderColor=(_themedStyles$borderC=(_themedStyles2=themedStyles)===null||_themedStyles2===void 0?void 0:_themedStyles2.borderColor)!==null&&_themedStyles$borderC!==void 0?_themedStyles$borderC:[colors.borderInactive,colors.borderPressed];return{backgroundColor:interpolateColor(pressed.get(),[0,1],backgroundColor),borderColor:interpolateColor(pressed.get(),[0,1],borderColor)};}"
};
c2806_10 = {
code: "function ButtonHooksNativeTsx2(){const{width,scaleAmountInPx,withSpring,interpolate,pressed,ON_PRESS_SPRING}=this.__closure;const scale=width.get()>0?(width.get()-scaleAmountInPx)/width.get():1;return{transform:[{scale:withSpring(interpolate(pressed.get(),[0,1],[1,scale]),ON_PRESS_SPRING,'animate-always')}]};}"
};
export const SAFE_TRANSPARENT_COLOR = "rgba(0,0,0,0.001)";
export function useProfileThemedButtonStyles(a0) {
let env14345;
const r1 = env14345 = {
$parent: env2806
};
env14345[0] = a0;
const themeContext = useThemeContext();
const primaryColor = themeContext.primaryColor;
env14345[1] = primaryColor;
const theme = themeContext.theme;
env14345[2] = theme;
return useMemo($mk74814(r1), [theme, primaryColor, a0]);
}
export function useForegroundColor(a0) {
return useToken(c2806_7[a0]);
}
export { styleProperties as useButtonColorStyles };
export function useButtonTextColorStyles(a0) {
let env14346;
const r5 = env14346 = {
$parent: env2806
};
env14346[0] = a0;
const themeContext = useThemeContext();
const primaryColor = themeContext.primaryColor;
env14346[1] = primaryColor;
const theme = themeContext.theme;
env14346[2] = theme;
const memo2 = useMemo($mk74814(r5), [theme, primaryColor, a0]);
const token = useToken(c2806_7[a0]);
let color = memo2?.color;
if (color == null) {
color = token;
}
return {
color
};
}
export function useIconTintStyles(a0) {
let env14348;
const r5 = env14348 = {
$parent: env2806
};
env14348[0] = a0;
const themeContext = useThemeContext();
const primaryColor = themeContext.primaryColor;
env14348[1] = primaryColor;
const theme = themeContext.theme;
env14348[2] = theme;
const memo2 = useMemo($mk74814(r5), [theme, primaryColor, a0]);
const token = useToken(c2806_7[a0]);
let tintColor = memo2?.color;
if (tintColor == null) {
tintColor = token;
}
return {
tintColor
};
}
export function useGradientPillStyles(a0) {
return {
borderColor: c2806_8(a0).borderInactive
};
}
export function useButtonPillStyles(a0, a1) {
let env14350;
const r3 = env14350 = {
$parent: env2806
};
env14350[0] = a0;
const themeContext = useThemeContext();
const primaryColor = themeContext.primaryColor;
env14350[1] = primaryColor;
const theme = themeContext.theme;
env14350[2] = theme;
const memo = useMemo($mk74814(r3), [theme, primaryColor, a0]);
const colors = c2806_8(a0);
let c14349_2 = colors;
const r25 = function() {
let r12 = memo?.backgroundColor;
if (r12 == null) {
r12 = [c14349_2.backgroundInactive, c14349_2.backgroundPressed];
}
let r8 = memo?.borderColor;
if (r8 == null) {
r8 = [c14349_2.borderInactive, c14349_2.borderPressed];
}
return {
backgroundColor: _ReanimatedRexport.interpolateColor(a1.get(), [0, 1], r12),
borderColor: _ReanimatedRexport.interpolateColor(a1.get(), [0, 1], r8)
};
};
r25.__closure = {
themedStyles: memo,
colors,
interpolateColor: _ReanimatedRexport.interpolateColor,
pressed: a1
};
r25.__workletHash = 2383933325137;
r25.__initData = c2806_9;
return useAnimatedStyle(r25);
}
export function useButtonScaleStyles(a0, a1, a2) {
let env14347;
const r2 = env14347 = {
$parent: env2806
};
env14347[0] = a0;
env14347[1] = a1;
env14347[2] = a2;
const r13 = $mk74815(r2);
r13.__closure = {
width: a1,
scaleAmountInPx: a2,
withSpring: _spring.withSpring,
interpolate: _ReanimatedRexport.interpolate,
pressed: a0,
ON_PRESS_SPRING: _springPresets.ON_PRESS_SPRING
};
r13.__workletHash = 17256006845494;
r13.__initData = c2806_10;
return useAnimatedStyle(r13);
}
export function useButtonPressAnimationProps(a0, scaleAmountInPx = 8, r14) {
let c14351_0 = r14;
const r6 = arguments[3];
let c14351_1 = r6;
const r5 = arguments[4];
let c14351_2 = r5;
let pressed = useSharedValue(0);
if (a0 != null) {
pressed = a0;
}
let env14352;
let c14351_3 = pressed;
const sharedValue = useSharedValue(0);
const r25 = {
onPressIn: useCallback((a0) => {
c14351_3.set(1);
if (c14351_1 != null) {
c14351_1(a0);
}
}, [pressed, r6]),
onPressOut: useCallback((a0) => {
c14351_3.set(0);
if (c14351_2 != null) {
c14351_2(a0);
}
}, [pressed, r5]),
onLayout: useCallback((a0) => {
sharedValue.set(a0.nativeEvent.layout.width);
if (c14351_0 != null) {
c14351_0(a0);
}
}, [sharedValue, r14]),
style: null
};
const r34 = env14352 = {
$parent: env2806
};
env14352[0] = pressed;
env14352[1] = sharedValue;
env14352[2] = scaleAmountInPx;
const r38 = $mk74815(r34);
r38.__closure = {
width: sharedValue,
scaleAmountInPx,
withSpring: _spring.withSpring,
interpolate: _ReanimatedRexport.interpolate,
pressed,
ON_PRESS_SPRING: _springPresets.ON_PRESS_SPRING
};
r38.__workletHash = 17256006845494;
r38.__initData = c2806_10;
r25.style = useAnimatedStyle(r38);
return r25;
}
export const useIconSizeStyles = function(a0) {
let r8 = arguments[1];
if (r8 === void 0) {
r8 = false;
}
let c14353_1 = r8;
let r7 = arguments[2];
if (r7 === void 0) {
r7 = _ButtonConstants_native.BUTTON_DEFAULT_MAX_FONT_SIZE_MULTIPLIER;
}
const BUTTON_DEFAULT_MAX_FONT_SIZE_MULTIPLIER = r7;
const fontScale = useFontScale();
return useMemo(() => {
const iconSize = getIconSize(MEDIUM_BUTTON_ICON_SIZE);
let width = a0 === "sm" ? getIconSize(SMALL_BUTTON_ICON_SIZE) : a0 === "lg" ? getIconSize(LARGE_BUTTON_ICON_SIZE) : iconSize;
if (c14353_1) {
width = width;
if (fontScale > 1) {
const r39 = TextStyleSheet[getButtonDefaultTextVariant(a0)];
const r44 = isAndroid() ? r39.fontSize : r39.lineHeight;
width = width;
if (width != null) {
width = r44 != null ? Math.max(width, r44 * Math.min(fontScale, BUTTON_DEFAULT_MAX_FONT_SIZE_MULTIPLIER)) : width;
}
}
}
return {
width,
height: width
};
}, [a0, r8, BUTTON_DEFAULT_MAX_FONT_SIZE_MULTIPLIER, fontScale]);
};
design/components/Button/native/ButtonPill.native.tsx
+241
View File
@@ -0,0 +1,241 @@
// Metro module 4609 (f4610).
import { useRef, useState, useEffect, useContext } from "react";
import { StyleSheet, View } from "react-native";
import { Fragment } from "react/jsx-runtime";
import { DEFAULT_BUTTON_SIZE, getButtonPadding, SMALL_BUTTON_HEIGHT, SMALL_BUTTON_ICON_SIZE, MEDIUM_BUTTON_HEIGHT, MEDIUM_BUTTON_ICON_SIZE, LARGE_BUTTON_HEIGHT, LARGE_BUTTON_ICON_SIZE, SMALL_BUTTON_HORIZONTAL_PADDING, MEDIUM_BUTTON_HORIZONTAL_PADDING, LARGE_BUTTON_HORIZONTAL_PADDING, getButtonBorderRadius, BUTTON_BORDER_WIDTH } from "./ButtonConstants.native";
import { createStyles } from "../../Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import { useButtonPillStyles, useGradientPillStyles } from "./ButtonHooks.native";
import { useThemeContext, ExpressiveButtonRive } from "../../../../_bundle/Module3901";
import { useToken } from "../../../tokens/native/useToken";
import { ButtonShine } from "./ButtonShine.native";
import Module4611 from "../../../../_bundle/Module4611";
import * as _ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
import ReanimatedRexport, { useAnimatedStyle } from "../../../../modules/reanimated/ReanimatedRexport";
import { isThemeLight } from "../../../shared";
import { Ellipsis } from "./ButtonEllipsis.native";
import { AccessibilityPreferencesContext } from "../../../../_bundle/Module3908";
import * as _spring from "../../../animation/reanimated/spring/spring";
import * as _springPresets from "../../../animation/reanimated/spring/springPresets";
let FADE_DELAY, buttonPadding, buttonPadding2, buttonPadding3, useStyles, BasicButtonPill, LoadingButtonPill, __initData, __initData2, useLoadingStyles;
const PillWrapper = function PillWrapper(props) {
let props2;
const { children, variant, style, pressed, shiny = false, expressiveRiveRef, expressivePressState, size } = props;
const styles = useButtonPillStyles(variant, pressed);
const styles2 = useGradientPillStyles(variant);
const theme = useThemeContext().theme;
const styles3 = useStyles(variant, size);
let colors = [useToken(Module712.colors.REDESIGN_BUTTON_PREMIUM_PRIMARY_PURPLE_FOR_GRADIENT), useToken(Module712.colors.REDESIGN_BUTTON_PREMIUM_PRIMARY_PURPLE_FOR_GRADIENT_2), useToken(Module712.colors.REDESIGN_BUTTON_PREMIUM_PRIMARY_PINK_FOR_GRADIENT)];
const r66 = [Module712.unsafe_rawColors.PREMIUM_TIER_0_PURPLE_FOR_GRADIENTS, Module712.unsafe_rawColors.PREMIUM_TIER_0_BLUE_FOR_GRADIENTS_2, Module712.unsafe_rawColors.PREMIUM_TIER_0_BLUE_FOR_GRADIENTS];
const r10 = shiny ? <ButtonShine variant={variant} /> : null;
if (variant !== "experimental_premium-primary" && variant !== "experimental_premium-basic") {
props2 = {
children: [variant === "expressive" && <View style={[StyleSheet.absoluteFill, styles3.expressivePill]}>
<ExpressiveButtonRive withReducedMotion="short-loop" ref={expressiveRiveRef} fit="layout" artboard={isThemeLight(theme) ? "Mobile Expressive Button Lightmode" : "Mobile Expressive Button Dark Mode"} dataBinding={{
buttonColor: styles3.expressiveRiveFill.color,
cornerRadius: styles3.expressivePill.borderRadius,
...expressivePressState
}} />
</View>, <ReanimatedRexport.View style={[style, styles]}>
{children}
{r10}
</ReanimatedRexport.View>]
};
} else {
if (variant === "experimental_premium-basic") {
colors = r66;
}
props2 = {
children: [<Module4611 start={{
x: 0,
y: 0
}} end={{
x: 1,
y: 0
}} style={[style, styles2, StyleSheet.absoluteFill]} colors={colors} />, <ReanimatedRexport.View style={[style, styles]}>
{children}
{r10}
</ReanimatedRexport.View>]
};
}
return <Fragment {...props2} />;
};
BasicButtonPill = function BasicButtonPill(props) {
const { children, style, pressed, variant = "primary", size = DEFAULT_BUTTON_SIZE, shiny = false, expressiveRiveRef, expressivePressState } = props;
const styles = useStyles(variant, size);
return <PillWrapper variant={variant} size={size} style={[styles.pill, style]} pressed={pressed} shiny={shiny} expressiveRiveRef={expressiveRiveRef} expressivePressState={expressivePressState}>
<View style={styles.childContainer}>{children}</View>
</PillWrapper>;
};
LoadingButtonPill = function LoadingButtonPill(props) {
const { children, style, pressed, variant = "primary", size = DEFAULT_BUTTON_SIZE, loading = false } = props;
let c14356_0 = loading;
let loaderSize = props.loaderSize;
const { expressiveRiveRef, expressivePressState } = props;
const styles = useStyles(variant, size);
const ref = useRef(null);
let [state, setState] = useState(loading);
useEffect(() => {
if (ref.current != null) {
clearTimeout(ref.current);
}
if (c14356_0) {
setState(true);
} else {
ref.current = setTimeout(() => {
setState(false);
}, 500);
}
}, [loading]);
const [r20, r39] = useLoadingStyles(loading, size);
const r54 = [<ReanimatedRexport.View style={[styles.childContainer, r20]}>{children}</ReanimatedRexport.View>, ,];
if (state) {
if (loaderSize == null) {
loaderSize = size;
}
state = <Ellipsis variant={variant} size={loaderSize} />;
}
r54[1] = <ReanimatedRexport.View style={[styles.ellipsis, r39]}>{state}</ReanimatedRexport.View>;
return <PillWrapper variant={variant} size={size} style={[styles.pill, style]} pressed={pressed} expressiveRiveRef={expressiveRiveRef} expressivePressState={expressivePressState}>{r54}</PillWrapper>;
};
useLoadingStyles = function useLoadingStyles(a0, size) {
const enabled = useContext(AccessibilityPreferencesContext).reducedMotion.enabled;
const offsetY = size === "lg" ? 18 : 12;
let c14357_2 = offsetY;
const r24 = function() {
let r29;
const opacity = _spring.withSpring(a0 ? 0 : 1, _springPresets.SUBTLE_SPRING, "animate-always");
const r19 = {
opacity: null,
transform: null
};
if (enabled) {
r19.opacity = a0 ? opacity : _ReanimatedRexport.withDelay(FADE_DELAY, opacity);
r19.transform = [{
translateY: 0
}];
r29 = r19;
} else {
r19.opacity = opacity;
r19.transform = [{
translateY: _spring.withSpring(a0 ? -1 * c14357_2 : 0, _springPresets.SUBTLE_SPRING)
}];
r29 = r19;
}
return r29;
};
r24.__closure = {
withSpring: _spring.withSpring,
loading: a0,
SUBTLE_SPRING: _springPresets.SUBTLE_SPRING,
useReducedMotion: enabled,
withDelay: _ReanimatedRexport.withDelay,
FADE_DELAY,
offsetY
};
r24.__workletHash = 9388603334085;
r24.__initData = __initData;
const r35 = [useAnimatedStyle(r24), ,];
const l = function l() {
let r29;
const opacity = _spring.withSpring(a0 ? 1 : 0, _springPresets.SUBTLE_SPRING, "animate-always");
const r20 = {
opacity: null,
transform: null
};
if (enabled) {
r20.opacity = a0 ? _ReanimatedRexport.withDelay(FADE_DELAY, opacity) : opacity;
r20.transform = [{
translateY: 0
}];
r29 = r20;
} else {
r20.opacity = opacity;
r20.transform = [{
translateY: _spring.withSpring(a0 ? 0 : c14357_2, _springPresets.SUBTLE_SPRING)
}];
r29 = r20;
}
return r29;
};
l.__closure = {
withSpring: _spring.withSpring,
loading: a0,
SUBTLE_SPRING: _springPresets.SUBTLE_SPRING,
useReducedMotion: enabled,
withDelay: _ReanimatedRexport.withDelay,
FADE_DELAY,
offsetY
};
l.__workletHash = 8255420825872;
l.__initData = __initData2;
r35[1] = useAnimatedStyle(l);
return r35;
};
FADE_DELAY = 300;
buttonPadding = getButtonPadding(SMALL_BUTTON_HEIGHT, SMALL_BUTTON_ICON_SIZE);
buttonPadding2 = getButtonPadding(MEDIUM_BUTTON_HEIGHT, MEDIUM_BUTTON_ICON_SIZE);
buttonPadding3 = getButtonPadding(LARGE_BUTTON_HEIGHT, LARGE_BUTTON_ICON_SIZE);
useStyles = createStyles((a0, a1) => {
const r6 = a1 === "sm" ? {
minHeight: SMALL_BUTTON_HEIGHT,
minWidth: SMALL_BUTTON_HEIGHT,
paddingHorizontal: SMALL_BUTTON_HORIZONTAL_PADDING,
paddingVertical: buttonPadding
} : a1 === "md" ? {
minHeight: MEDIUM_BUTTON_HEIGHT,
minWidth: MEDIUM_BUTTON_HEIGHT,
paddingHorizontal: MEDIUM_BUTTON_HORIZONTAL_PADDING,
paddingVertical: buttonPadding2
} : a1 === "lg" ? {
minHeight: LARGE_BUTTON_HEIGHT,
minWidth: LARGE_BUTTON_HEIGHT,
paddingHorizontal: LARGE_BUTTON_HORIZONTAL_PADDING,
paddingVertical: buttonPadding3
} : {};
const buttonBorderRadius = getButtonBorderRadius(a1);
return {
pill: {
flexDirection: "row",
alignItems: "center",
justifyContent: "center",
overflow: "hidden",
borderWidth: BUTTON_BORDER_WIDTH,
borderRadius: buttonBorderRadius,
...r6
},
expressivePill: {
overflow: "hidden",
borderRadius: buttonBorderRadius
},
expressiveRiveFill: {
color: Module712.colors.CONTROL_EXPRESSIVE_BACKGROUND_DEFAULT
},
childContainer: {
flexDirection: "row",
alignItems: "center",
justifyContent: "center",
flexGrow: 1,
maxWidth: "100%"
},
ellipsis: {
position: "absolute",
height: "100%",
width: "100%",
justifyContent: "center",
alignItems: "center"
}
};
});
__initData = {
code: "function ButtonPillNativeTsx1(){const{withSpring,loading,SUBTLE_SPRING,useReducedMotion,withDelay,FADE_DELAY,offsetY}=this.__closure;const opacityTransition=withSpring(loading?0:1,SUBTLE_SPRING,'animate-always');if(useReducedMotion){return{opacity:loading?opacityTransition:withDelay(FADE_DELAY,opacityTransition),transform:[{translateY:0}]};}return{opacity:opacityTransition,transform:[{translateY:withSpring(loading?-1*offsetY:0,SUBTLE_SPRING)}]};}"
};
__initData2 = {
code: "function ButtonPillNativeTsx2(){const{withSpring,loading,SUBTLE_SPRING,useReducedMotion,withDelay,FADE_DELAY,offsetY}=this.__closure;const opacityTransition=withSpring(loading?1:0,SUBTLE_SPRING,'animate-always');if(useReducedMotion){return{opacity:loading?withDelay(FADE_DELAY,opacityTransition):opacityTransition,transform:[{translateY:0}]};}return{opacity:opacityTransition,transform:[{translateY:withSpring(loading?0:offsetY,SUBTLE_SPRING)}]};}"
};
export function ButtonPill(props) {
return props.loading == null ? <BasicButtonPill {...props} /> : <LoadingButtonPill {...props} />;
}
export { BasicButtonPill };
export { LoadingButtonPill };
export { useLoadingStyles };
design/components/Button/native/ButtonShine.native.tsx
+101
View File
@@ -0,0 +1,101 @@
// Metro module 4610 (f4611).
import { useContext, useState } from "react";
import { useButtonTextColorStyles } from "./ButtonHooks.native";
import Module689 from "../../../../_bundle/Module689";
import { AccessibilityPreferencesContext } from "../../../shared";
import * as _ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
import ReanimatedRexport, { useAnimatedStyle } from "../../../../modules/reanimated/ReanimatedRexport";
import * as _timing from "../../../animation/reanimated/timing/timing";
import { createStyles } from "../../Styles/native/createStyles";
let __initData;
const useShineEffectStyles = function useShineEffectStyles(state, variant) {
const backgroundColor = Module689(useButtonTextColorStyles(variant).color).alpha(0.1).hex();
const enabled = useContext(AccessibilityPreferencesContext).reducedMotion.enabled;
const r32 = function() {
let r40;
if (state == null) {
r40 = {
transform: [{
translateX: -120
}]
};
} else {
const r4 = {
transform: null
};
const r6 = {
translateX: null
};
if (enabled) {
r6.translateX = (state - 56) / 2;
r4.transform = [r6];
r40 = r4;
} else {
r6.translateX = _ReanimatedRexport.withRepeat(_ReanimatedRexport.withSequence(_timing.withTiming(-120, {
duration: 0
}, "animate-always"), _ReanimatedRexport.withDelay(750, _timing.withTiming(state + 120, {
duration: 2000
}, "animate-always"))), -1);
r4.transform = [r6];
r40 = r4;
}
}
return r40;
};
r32.__closure = {
width: state,
SHINE_OFFSCREEN_OFFSET: 120,
useReducedMotion: enabled,
SHINE_WIDTH: 56,
withRepeat: _ReanimatedRexport.withRepeat,
withSequence: _ReanimatedRexport.withSequence,
withTiming: _timing.withTiming,
withDelay: _ReanimatedRexport.withDelay,
SHINE_INITIAL_ANIMATION_DELAY: 750,
SHINE_ANIMATION_DURATION: 2000
};
r32.__workletHash = 15814138938406;
r32.__initData = __initData;
const animatedStyle = useAnimatedStyle(r32);
return {
shineStyles: createStyles({
shineContainer: {
width: "100%",
height: "200%",
position: "absolute",
overflow: "hidden"
},
shine: {
width: 56,
height: "500%",
transform: [{
rotate: "30deg"
}],
backgroundColor,
top: "-100%",
alignItems: "center"
},
shineInner: {
width: 16,
height: "100%",
backgroundColor
}
})(),
shineAnimatedStyle: animatedStyle
};
};
__initData = {
code: "function ButtonShineNativeTsx1(){const{width,SHINE_OFFSCREEN_OFFSET,useReducedMotion,SHINE_WIDTH,withRepeat,withSequence,withTiming,withDelay,SHINE_INITIAL_ANIMATION_DELAY,SHINE_ANIMATION_DURATION}=this.__closure;if(width==null){return{transform:[{translateX:-SHINE_OFFSCREEN_OFFSET}]};}if(useReducedMotion){const centerOffset=(width-SHINE_WIDTH)/2;return{transform:[{translateX:centerOffset}]};}return{transform:[{translateX:withRepeat(withSequence(withTiming(-SHINE_OFFSCREEN_OFFSET,{duration:0},'animate-always'),withDelay(SHINE_INITIAL_ANIMATION_DELAY,withTiming(width+SHINE_OFFSCREEN_OFFSET,{duration:SHINE_ANIMATION_DURATION},'animate-always'))),-1)}]};}"
};
export { useShineEffectStyles };
export function ButtonShine(props) {
const variant = props.variant;
const [state, setState] = useState(null);
const styles = useShineEffectStyles(state, variant);
const shineStyles = styles.shineStyles;
return <ReanimatedRexport.View onLayout={(event) => setState(event.nativeEvent.layout.width)} style={[shineStyles.shineContainer, styles.shineAnimatedStyle]}>
<ReanimatedRexport.View style={shineStyles.shine}>
<ReanimatedRexport.View style={shineStyles.shineInner} />
</ReanimatedRexport.View>
</ReanimatedRexport.View>;
}
design/components/Button/native/FloatingActionButton.native.tsx
+70
View File
@@ -0,0 +1,70 @@
// Metro module 8243 (f8244).
import { isValidElement, cloneElement } from "react";
import { createStyles } from "../../Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import { FAB_BUTTON_SIZE } from "./ButtonConstants.native";
import MobileVisualRefreshExperiment from "../../../../modules/themes/experiments/MobileVisualRefreshExperiment";
import ReanimatedRexport, { useAnimatedStyle } from "../../../../modules/reanimated/ReanimatedRexport";
import * as _spring from "../../../animation/reanimated/spring/spring";
import { BaseIconButton } from "./BaseIconButton.native";
let SPRING_CONFIG, __initData;
const useStyles = createStyles(function(r4 = false) {
return {
button: {
...Module712.shadows.SHADOW_HIGH
},
iconButtonPill: {
minWidth: FAB_BUTTON_SIZE,
minHeight: FAB_BUTTON_SIZE,
padding: 0,
...r4 ? {
borderRadius: Module712.radii.lg
} : {}
}
};
});
SPRING_CONFIG = {
mass: 0.5,
damping: 80,
stiffness: 320
};
__initData = {
code: "function FloatingActionButtonNativeTsx1(){const{withSpring,positionBottom,DEFAULT_POSITION_OFFSET,SPRING_CONFIG,positionRight}=this.__closure;var _positionBottom,_positionRight;return{position:'absolute',bottom:withSpring((_positionBottom=positionBottom)!==null&&_positionBottom!==void 0?_positionBottom:DEFAULT_POSITION_OFFSET,SPRING_CONFIG),right:withSpring((_positionRight=positionRight)!==null&&_positionRight!==void 0?_positionRight:DEFAULT_POSITION_OFFSET,SPRING_CONFIG)};}"
};
export const DEFAULT_POSITION_OFFSET = 16;
export { useStyles };
export function FloatingActionButton(props) {
const { icon, positionBottom, positionRight, accessibilityLabel, ...props2 } = props;
const styles = useStyles(MobileVisualRefreshExperiment("FloatingActionButton"));
const F = function F() {
let r8 = positionBottom;
if (positionBottom == null) {
r8 = 16;
}
const r13 = {
position: "absolute",
bottom: _spring.withSpring(r8, SPRING_CONFIG),
right: null
};
let r17 = positionRight;
if (positionRight == null) {
r17 = 16;
}
r13.right = _spring.withSpring(r17, SPRING_CONFIG);
return r13;
};
F.__closure = {
withSpring: _spring.withSpring,
positionBottom,
DEFAULT_POSITION_OFFSET: 16,
SPRING_CONFIG,
positionRight
};
F.__workletHash = 10762818944671;
F.__initData = __initData;
return <ReanimatedRexport.View style={useAnimatedStyle(F)}>
<BaseIconButton {...props2} accessibilityLabel={accessibilityLabel} size="lg" variant="primary" icon={isValidElement(icon) ? cloneElement(icon, {
color: Module712.colors.WHITE
}) : icon} style={styles.button} pillStyle={styles.iconButtonPill} />
</ReanimatedRexport.View>;
}
design/components/Button/native/IconButton.native.tsx
+27
View File
@@ -0,0 +1,27 @@
// Metro module 6682 (f6683).
import { forwardRef } from "react";
import { createStyles } from "../../Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import { BaseButton } from "./BaseButton.native";
import { BaseIconButton } from "./BaseIconButton.native";
import { Text } from "../../Text/native/Text";
const useStyles = createStyles((a0) => ({
labelPressable: {
paddingBottom: Module712.space.PX_4,
gap: Module712.space.PX_8,
alignItems: "center",
alignSelf: "center",
flexGrow: a0 ? 1 : 0
},
label: {
textAlign: "center"
}
}));
const r26 = forwardRef(function({ label, grow, accessibilityLabel, maxFontSizeMultiplier, accessibilityHint, ...props }, a1) {
const styles = useStyles(grow);
return label != null ? <BaseButton style={styles.labelPressable} {...props} variant="none" accessibilityLabel={accessibilityLabel} accessibilityHint={accessibilityHint}>
<BaseIconButton ref={a1} {...props} accessibilityRole="none" accessibilityLabel="" size="lg" maxFontSizeMultiplier={maxFontSizeMultiplier} />
<Text style={styles.label} variant="text-xs/medium" color="interactive-text-default" maxFontSizeMultiplier={maxFontSizeMultiplier}>{label}</Text>
</BaseButton> : <BaseIconButton ref={a1} {...props} accessibilityLabel={accessibilityLabel} accessibilityHint={accessibilityHint} maxFontSizeMultiplier={maxFontSizeMultiplier} />;
});
export { r26 as IconButton };
design/components/Button/native/ImageButton.native.tsx
+103
View File
@@ -0,0 +1,103 @@
// Metro module 12267 (f12268).
import { forwardRef, useCallback } from "react";
import { Image as Image2, View } from "react-native";
import { createStyles } from "../../Styles/native/createStyles";
import * as _ButtonConstants_native from "./ButtonConstants.native";
import { SMALL_BUTTON_PADDING, MEDIUM_BUTTON_PADDING, getButtonBorderRadius, BUTTON_BORDER_WIDTH } from "./ButtonConstants.native";
import Module712 from "../../../../_bundle/Module712";
import { useIconSizeStyles } from "./ButtonHooks.native";
import ReanimatedRexport, { useSharedValue, useAnimatedStyle } from "../../../../modules/reanimated/ReanimatedRexport";
import * as _spring from "../../../animation/reanimated/spring/spring";
import * as _springPresets from "../../../animation/reanimated/spring/springPresets";
import { BaseButton } from "./BaseButton.native";
import { BaseIconButton } from "./BaseIconButton.native";
import { Text } from "../../Text/native/Text";
let __initData;
const useStyles = createStyles((a0, a1, a2) => {
let LARGE_BUTTON_PADDING = _ButtonConstants_native.LARGE_BUTTON_PADDING;
if (a0 === "sm") {
LARGE_BUTTON_PADDING = SMALL_BUTTON_PADDING;
} else if (a0 === "md") {
LARGE_BUTTON_PADDING = MEDIUM_BUTTON_PADDING;
}
const minHeight = a1 + 2 * LARGE_BUTTON_PADDING;
const buttonBorderRadius = getButtonBorderRadius(a0);
return {
labelPressable: {
paddingBottom: Module712.space.PX_4,
gap: Module712.space.PX_8,
alignItems: "center",
alignSelf: "center",
flexGrow: a2 ? 1 : 0
},
pill: {
paddingHorizontal: 0,
paddingVertical: 0,
minHeight,
minWidth: minHeight,
borderRadius: buttonBorderRadius,
borderWidth: 0,
outlineWidth: BUTTON_BORDER_WIDTH,
outlineColor: Module712.colors.CONTROL_SECONDARY_BORDER_DEFAULT,
outlineStyle: "solid"
},
imageWrapper: {
width: minHeight,
height: minHeight,
position: "relative"
},
image: {
width: minHeight,
height: minHeight
},
imageDim: {
position: "absolute",
top: 0,
left: 0,
right: 0,
bottom: 0,
backgroundColor: Module712.colors.REDESIGN_IMAGE_BUTTON_PRESSED_BACKGROUND,
borderRadius: buttonBorderRadius
}
};
});
__initData = {
code: "function ImageButtonNativeTsx1(){const{withSpring,pressed,ON_PRESS_SPRING}=this.__closure;return{opacity:withSpring(pressed.get()===1?1:0,ON_PRESS_SPRING,'animate-always')};}"
};
const r31 = forwardRef(function({ size = "lg", label, grow, image, accessibilityLabel, maxFontSizeMultiplier, onPressIn, onPressOut, ...props }, a1) {
const styles = useStyles(size, useIconSizeStyles(size, true, maxFontSizeMultiplier).width, grow);
const sharedValue = useSharedValue(0);
const callback = useCallback((a0) => {
sharedValue.set(1);
if (onPressIn != null) {
onPressIn(a0);
}
}, [sharedValue, onPressIn]);
const callback2 = useCallback((a0) => {
sharedValue.set(0);
if (onPressOut != null) {
onPressOut(a0);
}
}, [sharedValue, onPressOut]);
const B = function B() {
return {
opacity: _spring.withSpring(sharedValue.get() === 1 ? 1 : 0, _springPresets.ON_PRESS_SPRING, "animate-always")
};
};
B.__closure = {
withSpring: _spring.withSpring,
pressed: sharedValue,
ON_PRESS_SPRING: _springPresets.ON_PRESS_SPRING
};
B.__workletHash = 17257158773379;
B.__initData = __initData;
const icon = <View style={styles.imageWrapper}>
<Image2 source={image} style={styles.image} />
<ReanimatedRexport.View style={[styles.imageDim, useAnimatedStyle(B)]} />
</View>;
return label != null ? <BaseButton style={styles.labelPressable} {...props} variant="none" accessibilityLabel={accessibilityLabel}>
<BaseIconButton ref={a1} {...props} icon={icon} accessibilityRole="none" accessibilityLabel="" size="lg" pillStyle={styles.pill} variant="secondary" onPressIn={callback} onPressOut={callback2} maxFontSizeMultiplier={maxFontSizeMultiplier} />
<Text variant="text-xs/medium" color="interactive-text-default" maxFontSizeMultiplier={maxFontSizeMultiplier}>{label}</Text>
</BaseButton> : <BaseIconButton ref={a1} {...props} size={size} icon={icon} accessibilityLabel={accessibilityLabel} pillStyle={styles.pill} variant="secondary" onPressIn={callback} onPressOut={callback2} />;
});
export { r31 as ImageButton };
design/components/Button/native/useToggleButtonProps.native.tsx
+19
View File
@@ -0,0 +1,19 @@
// Metro module 13208 (f13209).
export function useToggleButtonProps(a0, a1) {
return {
...a1 ? a0.on : a0.off,
accessibilityRole: "togglebutton",
accessibilityState: {
checked: a1
}
};
}
export function useToggleIconButtonProps(a0, a1) {
return {
...a1 ? a0.on : a0.off,
accessibilityRole: "togglebutton",
accessibilityState: {
checked: a1
}
};
}
design/components/ButtonGroup/native/ButtonGroup.native.tsx
+12
View File
@@ -0,0 +1,12 @@
// Metro module 5022 (f5023).
import { createStyles } from "../../Styles/native/createStyles";
import { Stack } from "../../Stack/native/Stack.native";
const useStyles = createStyles({
container: {
paddingVertical: 16
}
});
export function ButtonGroup(props) {
const { size = "md", children, style, ...rest } = props;
return <Stack {...rest} spacing={size === "sm" ? 12 : 8} style={[useStyles().container, style]}>{children}</Stack>;
}
design/components/Card/native/Card.native.tsx
+127
View File
@@ -0,0 +1,127 @@
// Metro module 5222 (f5223).
import _objectWithoutProperties from "../../../../_bundle/_objectWithoutProperties";
import { useMemo, useCallback } from "react";
import { View, Pressable } from "react-native";
import * as _ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
import ReanimatedRexport, { useSharedValue, useAnimatedStyle } from "../../../../modules/reanimated/ReanimatedRexport";
import Module712 from "../../../../_bundle/Module712";
import { createStyleProperties, createStyles } from "../../Styles/native/createStyles";
import { createCardShadowToken } from "./CardTokens.native";
import MobileVisualRefreshExperiment from "../../../../modules/themes/experiments/MobileVisualRefreshExperiment";
import { useToken } from "../../../tokens/native/useToken";
import { isAndroid } from "../../../../utils/PlatformUtils";
import * as _spring from "../../../animation/reanimated/spring/spring";
import * as _springPresets from "../../../animation/reanimated/spring/springPresets";
import { AnimatedPressableHighlight } from "../../experimental/Pressables/native/AnimatedPressableHighlight.native";
let _excluded, AnimatedComponent, styleProperties, useStyles, PressableCard, __initData;
export function Card(props) {
const { start: start2 = true, end: end2 = true, shadow = "none", border = "faint", variant = "primary", ...props2 } = props;
const isRefreshEnabled = MobileVisualRefreshExperiment("Card");
const token = useToken(Module712.modules.mobile.CARD_DEFAULT_RADIUS);
let radius2 = props2.radius;
if (radius2 == null) {
radius2 = token;
}
const styles = useStyles(start2, end2, variant, shadow, border, radius2);
const style = [styles.spacing, styles.card, props2.style];
const r2 = "onPress" in props2;
const radius3 = radius2;
if (r2 && props2.onPress != null) {
let accessibilityRole = props2.accessibilityRole;
const rest = _objectWithoutProperties(props2, _excluded);
if (accessibilityRole == null) {
accessibilityRole = "button";
}
return <PressableCard accessibilityRole={accessibilityRole} {...rest} start={start2} end={end2} style={style} variant={variant} isRefreshEnabled={isRefreshEnabled} radius={radius3} />;
}
return <View {...props2} style={style} />;
}
PressableCard = function PressableCard(props) {
let r67;
if (isAndroid()) {
const { children: children2, start, end, radius, isRefreshEnabled: _isRefreshEnabled, ...props3 } = props;
props.isRefreshEnabled;
r67 = <AnimatedPressableHighlight androidRippleConfig={useMemo(() => ({
cornerRadius: start ? radius : end ? radius : 0
}), [start, end, radius])} {...props3}>{children2}</AnimatedPressableHighlight>;
} else {
let backgroundColor, backgroundColorPressed;
const { children, style, variant, onPressIn, onPressOut, isRefreshEnabled, radius: _radius, start: _start, end: _end, ...props2 } = props;
props.radius;
props.start;
props.end;
backgroundColor = void 0;
backgroundColorPressed = void 0;
const sharedValue = useSharedValue(0);
const callback = useCallback((a0) => {
sharedValue.set(1);
if (onPressIn != null) {
onPressIn(a0);
}
}, [sharedValue, onPressIn]);
const callback2 = useCallback((a0) => {
sharedValue.set(0);
if (onPressOut != null) {
onPressOut(a0);
}
}, [sharedValue, onPressOut]);
const r40 = styleProperties(variant, isRefreshEnabled);
backgroundColor = r40.backgroundColor;
backgroundColorPressed = r40.backgroundColorPressed;
const B = function B() {
return {
backgroundColor: _spring.withSpring(_ReanimatedRexport.interpolateColor(sharedValue.get(), [0, 1], [backgroundColor, backgroundColorPressed]), _springPresets.ON_PRESS_SPRING, "animate-always")
};
};
B.__closure = {
withSpring: _spring.withSpring,
interpolateColor: _ReanimatedRexport.interpolateColor,
pressed: sharedValue,
backgroundColor,
backgroundColorPressed,
ON_PRESS_SPRING: _springPresets.ON_PRESS_SPRING
};
B.__workletHash = 14943431549291;
B.__initData = __initData;
r67 = <AnimatedComponent {...props2} onPressIn={callback} onPressOut={callback2} style={[style, useAnimatedStyle(B)]} unstable_pressDelay={130}>{children}</AnimatedComponent>;
}
return r67;
};
_excluded = ["accessibilityRole"];
AnimatedComponent = ReanimatedRexport.createAnimatedComponent(Pressable);
styleProperties = createStyleProperties(function(a0, r5 = false) {
const backgroundColor2 = a0 === "primary" ? Module712.colors.TABLEROW_BACKGROUND_DEFAULT : a0 === "secondary" ? Module712.colors.CARD_SECONDARY_BACKGROUND_DEFAULT : a0 === "muted" ? Module712.colors.CARD_MUTED_BG : a0 === "transparent" ? Module712.unsafe_rawColors.TRANSPARENT : a0 === "control-secondary" ? Module712.colors.CONTROL_SECONDARY_BACKGROUND_DEFAULT : a0 === "surface-high" ? Module712.colors.BACKGROUND_SURFACE_HIGH : void 0;
if (r5 === void 0) {
r5 = false;
}
return {
backgroundColor: backgroundColor2,
backgroundColorPressed: a0 === "primary" ? Module712.colors.TABLEROW_BACKGROUND_PRESSED : a0 === "secondary" ? Module712.colors.CARD_SECONDARY_BACKGROUND_ACTIVE : a0 === "muted" ? Module712.colors.CARD_MUTED_PRESSED_BG : a0 === "transparent" ? r5 ? Module712.colors.BACKGROUND_MOD_SUBTLE : Module712.unsafe_rawColors.TRANSPARENT : a0 === "control-secondary" ? Module712.colors.CONTROL_SECONDARY_BACKGROUND_ACTIVE : a0 === "surface-high" ? Module712.colors.BACKGROUND_BASE_LOW : void 0
};
});
useStyles = createStyles((a0, a1, a2, a3, a4, a5) => {
const backgroundColor2 = a2 === "primary" ? Module712.colors.TABLEROW_BACKGROUND_DEFAULT : a2 === "secondary" ? Module712.colors.CARD_SECONDARY_BACKGROUND_DEFAULT : a2 === "muted" ? Module712.colors.CARD_MUTED_BG : a2 === "transparent" ? Module712.unsafe_rawColors.TRANSPARENT : a2 === "control-secondary" ? Module712.colors.CONTROL_SECONDARY_BACKGROUND_DEFAULT : a2 === "surface-high" ? Module712.colors.BACKGROUND_SURFACE_HIGH : void 0;
let borderColor = a4 !== "none" ? a4 === "subtle" ? Module712.colors.BORDER_SUBTLE : a4 === "strong" ? Module712.colors.BORDER_STRONG : a4 === "faint" ? Module712.colors.BORDER_MUTED : a4 === "control-secondary" ? Module712.colors.CONTROL_SECONDARY_BORDER_DEFAULT : void 0 : null;
if (borderColor == null) {
borderColor = backgroundColor2;
}
return {
card: {
...createCardShadowToken(a3),
borderTopStartRadius: a0 ? a5 : void 0,
borderTopEndRadius: a0 ? a5 : void 0,
borderBottomStartRadius: a1 ? a5 : void 0,
borderBottomEndRadius: a1 ? a5 : void 0,
borderColor,
borderWidth: a4 !== "none" ? 1 : 0,
backgroundColor: backgroundColor2
},
spacing: {
padding: 16
}
};
});
__initData = {
code: "function CardNativeTsx1(){const{withSpring,interpolateColor,pressed,backgroundColor,backgroundColorPressed,ON_PRESS_SPRING}=this.__closure;const pressedColor=withSpring(interpolateColor(pressed.get(),[0,1],[backgroundColor,backgroundColorPressed]),ON_PRESS_SPRING,'animate-always');return{backgroundColor:pressedColor};}"
};
export { Card as InternalCard };
design/components/Card/native/CardTokens.native.tsx
+28
View File
@@ -0,0 +1,28 @@
// Metro module 5223 (f5224).
import { experimental_createToken } from "../../Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
export function createCardShadowToken(c14767_0) {
return experimental_createToken((a0) => {
if (a0.gradient == null) {
if (c14767_0 !== "none") {
if (c14767_0 === "border") {
return Module712.shadows.SHADOW_BORDER;
}
if (c14767_0 === "high") {
return Module712.shadows.SHADOW_HIGH;
}
if (c14767_0 === "ledge") {
return Module712.shadows.SHADOW_LEDGE;
}
if (c14767_0 === "low") {
return Module712.shadows.SHADOW_LOW;
}
if (c14767_0 === "medium") {
return Module712.shadows.SHADOW_MEDIUM;
}
return void 0;
}
}
return {};
});
}
design/components/Checkbox/native/Checkbox.native.tsx
+56
View File
@@ -0,0 +1,56 @@
// Metro module 9018 (f9019).
import { Pressable, View } from "react-native";
import { createStyles } from "../../Styles/native/createStyles";
import { useCheckboxA11yNative } from "../../../../_bundle/Module3907";
import { intl, t } from "../../../../intl/index.native";
import { Stack } from "../../Stack/native/Stack.native";
import { FormCheckbox } from "../../Forms/native/FormCheckbox.native";
import { Text } from "../../Text/native/Text";
const useStyles = createStyles({
textContainer: {
flex: 1
},
labelContainer: {
minHeight: 24,
justifyContent: "center"
}
});
export function Checkbox(props) {
const { label, description } = props;
let required = props.required;
const { checked, onToggle } = props;
const styles = useStyles();
const checkboxA11yNative = useCheckboxA11yNative({
checked
});
const { accessibilityRole, accessibilityState } = checkboxA11yNative;
let r11 = "";
const r42 = label + (required ? ` (${intl.string(t.EkokLy)})` : "");
if (description != null) {
r11 = `, ${description}`;
}
const props2 = {
accessibilityRole,
accessibilityLabel: r42 + r11,
accessibilityState,
onPress: () => onToggle(!checked),
children: null
};
const r58 = [<FormCheckbox checked={checked} />, ,];
const r67 = [label, ,];
if (required) {
required = <Text variant="text-md/bold" color="text-feedback-critical" aria-label={intl.string(t.EkokLy)}>
{" "}
*
</Text>;
}
r67[1] = required;
r58[1] = <View style={styles.textContainer}>
<View style={styles.labelContainer}>
<Text variant="text-md/medium">{r67}</Text>
</View>
{description != null && <Text variant="text-sm/normal" color="text-subtle">{description}</Text>}
</View>;
props2.children = <Stack direction="horizontal">{r58}</Stack>;
return <Pressable {...props2} />;
}
design/components/Coachmark/native/AnimatedCoachmark.native.tsx
+21
View File
@@ -0,0 +1,21 @@
// Metro module 8438 (f8439).
import { useContext, useState, useEffect } from "react";
import { StyleSheet } from "react-native";
import ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
import { CoachmarkContainer } from "./Coachmark.native";
import { AccessibilityPreferencesContext } from "../../../../_bundle/Module3908";
import { tooltipEnterExitAnimation } from "../../Tooltip/native/TooltipConstants.native";
import AnimatedEnterExitItem from "../../AnimatedEnterExitItem/native/AnimatedEnterExitItem";
const renderTooltipItem = (a0, a1) => <ReanimatedRexport.View style={[a1, StyleSheet.absoluteFill]} pointerEvents="box-none">
{a0 != null ? <CoachmarkContainer {...a0} enterExitAnimatedStyles={a1} /> : null}
</ReanimatedRexport.View>;
export function AnimatedCoachmark(props) {
const { visible, ...rest } = props;
const enabled = useContext(AccessibilityPreferencesContext).reducedMotion.enabled;
const [state, setState] = useState(visible);
const entering = tooltipEnterExitAnimation(rest.position);
useEffect(() => {
setState(visible);
}, [visible]);
return <AnimatedEnterExitItem useReducedMotion={enabled} item={state ? rest : void 0} entering={entering} exiting={entering} renderItem={renderTooltipItem} />;
}
design/components/Coachmark/native/Coachmark.native.tsx
+237
View File
@@ -0,0 +1,237 @@
// Metro module 8439 (f8440).
import { useRef, useState, useCallback, useMemo } from "react";
import { Image as Image2, Pressable, View } from "react-native";
import ReanimatedRexport, { useSharedValue } from "../../../../modules/reanimated/ReanimatedRexport";
import { createStyles } from "../../Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import useTooltipPosition_native from "../../Tooltip/native/useTooltipPosition.native";
import { useButtonPressAnimationProps } from "../../Button/native/ButtonHooks.native";
import { Graphic } from "../../Graphic/native/Graphic.native";
import MobileVisualRefreshExperiment from "../../../../modules/themes/experiments/MobileVisualRefreshExperiment";
import { setAccessibilityFocus } from "../../../../modules/a11y/native/setAccessibilityFocus.android";
import { Text } from "../../Text/native/Text";
import { Button } from "../../Button/native/Button.native";
import { intl, t } from "../../../../intl/index.native";
import { XSmallIcon } from "../../Icon/native/redesign/generated/XSmallIcon";
import { BackgroundBlurView } from "../../experimental/native";
import { ExpressiveGradient } from "../../ExpressiveGradient/native/ExpressiveGradient.native";
import { isIOS, isAndroid } from "../../../../utils/PlatformUtils";
import { useThemeContext, ThemeContextProvider } from "../../../../_bundle/Module3901";
let _excluded, AnimatedComponent, useStyles, c5404_15, Cursor;
const Coachmark = function Coachmark(props) {
let props2;
const { targetMeasurements, surfaceMeasurements, title, description, offsetY = 0, graphic, imgSource, position, onDismiss, buttonLabel } = props;
let buttonVariant = props.buttonVariant;
const { onButtonPress, gradientColor, experimental_withBlurBackground, renderImgComponent, enterExitAnimatedStyles } = props;
const styles = useStyles();
const ref = useRef(null);
const [state, setState] = useState(null);
const tooltipPosition_native = useTooltipPosition_native(state, surfaceMeasurements, targetMeasurements, position, -8 + offsetY);
const { adjustmentX, tooltipX, tooltipY } = tooltipPosition_native;
const sharedValue = useSharedValue(0);
const callback2 = useCallback(() => {
sharedValue.set(1);
}, [sharedValue]);
const callback = useCallback(() => {
sharedValue.set(0);
}, [sharedValue]);
const buttonPressAnimationProps = useButtonPressAnimationProps(sharedValue);
const { style, ...rest } = buttonPressAnimationProps;
const memo = useMemo(() => {
if (graphic != null) {
let aspectRatio = graphic.aspectRatio;
if (aspectRatio == null) {
aspectRatio = "1/1";
}
return <View style={[styles.bottomMargin]}>
<Graphic {...graphic} style={{
height: c5404_15[aspectRatio],
width: "auto"
}} />
</View>;
}
let r7 = renderImgComponent != null ? renderImgComponent() : null;
if (imgSource != null) {
r7 = <Image2 source={imgSource} style={styles.image} />;
}
return r7 == null ? null : <View style={styles.bottomMargin}>{r7}</View>;
}, [graphic, imgSource, renderImgComponent, styles]);
const r84 = MobileVisualRefreshExperiment("Coachmark");
const r109 = [<View ref={ref} accessibilityRole="alert" style={styles.center} accessible onLayout={() => {
setAccessibilityFocus({
ref,
delay: 100
});
}}>
{memo}
<View style={r84 ? styles.textGap : void 0}>
<Text style={[styles.text, graphic == null ? styles.textOnlyPadding : void 0]} variant={r84 ? "text-md/semibold" : "heading-md/bold"} color="mobile-text-heading-primary">{title}</Text>
<Text style={styles.text} variant="text-sm/medium" color={r84 ? "text-subtle" : "text-default"}>{description}</Text>
</View>
</View>, , ,];
const r110 = buttonLabel != null;
let r111 = null;
if (r110) {
const r112 = onButtonPress != null;
r111 = null;
if (r112) {
const r116 = [<View style={styles.buttonSpacing} />, ,];
if (experimental_withBlurBackground) {
props2 = {
variant: "secondary-overlay",
size: "lg",
text: buttonLabel,
onPress: onButtonPress,
grow: true
};
} else {
if (buttonVariant == null) {
buttonVariant = "secondary";
}
props2 = {
variant: buttonVariant,
size: r84 ? "sm" : "lg",
text: buttonLabel,
onPress: onButtonPress,
grow: true
};
}
r116[1] = <Button {...props2} />;
r111 = <>{r116}</>;
}
}
r109[1] = r111;
r109[2] = <Pressable accessibilityRole="button" accessibilityLabel={intl.string(t.cpT0Cq)} style={styles.closeButton} onPress={onDismiss} onPressIn={callback2} onPressOut={callback}>
<XSmallIcon {...r84 ? {
size: "xs",
color: Module712.colors.ICON_STRONG
} : {}} />
</Pressable>;
const r149 = <>{r109}</>;
const r166 = experimental_withBlurBackground ? <BackgroundBlurView style={styles.bodyContainer} blurTheme="dark" pressed={sharedValue}>{r149}</BackgroundBlurView> : <View style={[styles.bodyContainer, styles.bodyBgColor]}>
{r84 ? gradientColor != null ? <ExpressiveGradient style={styles.gradient} color={gradientColor} backgroundColor={Module712.colors.MOBILE_COACHMARK_BACKGROUND_DEFAULT} /> : null : null}
{r149}
</View>;
return <View onLayout={({ nativeEvent }) => {
setState({
width: nativeEvent.layout.width,
height: nativeEvent.layout.height
});
}} style={[styles.container, isIOS() ? styles.shadow : void 0, {
opacity: state != null ? 1 : 0,
top: tooltipY,
left: tooltipX
}]}>
{position === "bottom" && <Cursor position="bottom" adjustmentX={adjustmentX} />}
<AnimatedComponent {...rest} onAccessibilityEscape={onDismiss} accessible={false} onPress={onDismiss} style={[styles.body, ...isAndroid() ? [styles.shadow, enterExitAnimatedStyles] : [], style]}>{r166}</AnimatedComponent>
{position === "top" && <Cursor position="top" adjustmentX={adjustmentX} />}
</View>;
};
Cursor = function Cursor(props) {
const { position, adjustmentX } = props;
const styles2 = useStyles();
const r1 = position === "top";
return <View style={[styles2.cursorContainer, r1 ? {
marginTop: -6
} : {
marginBottom: -6
}, {
flexDirection: r1 ? "column-reverse" : "column",
left: -adjustmentX
}]}>
<View style={styles2.cursorHead} />
<View style={styles2.cursorSpine} />
</View>;
};
_excluded = ["style"];
AnimatedComponent = ReanimatedRexport.createAnimatedComponent(Pressable);
useStyles = createStyles({
container: {
position: "absolute",
alignItems: "center"
},
shadow: {
...Module712.shadows.SHADOW_BUTTON_OVERLAY
},
body: {
width: Module712.modules.mobile.COACHMARK_BODY_WIDTH,
borderRadius: Module712.radii.lg,
overflow: "hidden",
zIndex: 1
},
textGap: {
gap: 4
},
textOnlyPadding: {
paddingHorizontal: Module712.space.PX_24
},
bodyBgColor: {
borderWidth: 1,
borderColor: Module712.colors.MOBILE_COACHMARK_BORDER_DEFAULT,
backgroundColor: Module712.colors.MOBILE_COACHMARK_BACKGROUND_DEFAULT,
borderRadius: Module712.radii.lg
},
gradient: {
borderRadius: Module712.radii.lg,
overflow: "hidden"
},
bodyContainer: {
padding: Module712.space.PX_16,
alignItems: "center",
justifyContent: "center"
},
center: {
alignItems: "center",
justifyContent: "center"
},
buttonSpacing: {
height: Module712.modules.mobile.COACHMARK_BUTTON_SPACING
},
text: {
maxWidth: 200,
textAlign: "center"
},
cursorContainer: {
alignItems: "center",
zIndex: 0
},
cursorHead: {
height: 8,
width: 8,
borderRadius: Module712.radii.xs,
borderWidth: 2,
backgroundColor: "transparent",
borderColor: Module712.colors.INTERACTIVE_TEXT_ACTIVE
},
cursorSpine: {
width: 2,
height: 16,
backgroundColor: Module712.colors.INTERACTIVE_TEXT_ACTIVE
},
image: {
height: 40,
width: 40
},
bottomMargin: {
marginBottom: Module712.modules.mobile.COACHMARK_BUTTON_SPACING
},
closeButton: {
position: "absolute",
top: Module712.modules.mobile.COACHMARK_BUTTON_SPACING,
right: Module712.modules.mobile.COACHMARK_BUTTON_SPACING
}
});
c5404_15 = {
"21/9": 90,
"16/9": 90,
"6/4": 60,
"2/1": 40,
"1/1": 40
};
export { Coachmark };
export function CoachmarkContainer(props) {
const theme = useThemeContext().theme;
return <ThemeContextProvider theme={props.experimental_withBlurBackground ? "dark" : theme}>
<Coachmark {...props} />
</ThemeContextProvider>;
}
design/components/Coachmark/native/CoachmarkConstants.native.tsx
+2
View File
@@ -0,0 +1,2 @@
// Metro module 13214 (f13215).
design/components/Coachmark/native/useCoachmark.native.tsx
+14
View File
@@ -0,0 +1,14 @@
// Metro module 8430 (f8431).
import { useRef, useContext, useCallback } from "react";
import { v4 } from "../../../../_bundle/Module514";
import { useTooltipHelper } from "../../Tooltip/native/useTooltip.native";
import { LayerContext } from "../../Layers/native/LayerContext.native";
import { AnimatedCoachmark } from "./AnimatedCoachmark.native";
export function useCoachmark(a0, a1) {
const ref = useRef(v4());
let c16563_0 = a1;
const context = useContext(LayerContext);
return useTooltipHelper(ref, a0, useCallback((a0, a1, a2) => {
context.add(a0, <AnimatedCoachmark {...c16563_0} targetMeasurements={a1} surfaceMeasurements={a2} />);
}, [context, a1]));
}
design/components/ContextMenu/native/ContextMenu.native.tsx
+460
View File
@@ -0,0 +1,460 @@
// Metro module 9299 (f9300).
import { useEffect, useMemo, useRef, useLayoutEffect, useCallback } from "react";
import { isFabric } from "../../../../utils/native/FabricUtils";
import * as _PlatformUtils from "../../../../utils/PlatformUtils";
import { isAndroid } from "../../../../utils/PlatformUtils";
import * as _ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
import { useAnimatedRef, useSharedValue, runOnUI } from "../../../../modules/reanimated/ReanimatedRexport";
import useWindowDimensions_native from "../../../../modules/screen/useWindowDimensions.native";
import * as _ContextMenuState_native from "./ContextMenuState.native";
import { useContextMenuState, useActiveContextMenu, resetContextMenuState, hideContextMenu, showContextMenu } from "./ContextMenuState.native";
import { useFontScale } from "../../../../modules/screen/native/useFontScale";
import * as _ContextMenuConstants_native from "./ContextMenuConstants.native";
import { CONTEXT_MENU_ITEM_BASE_HEIGHT, CONTEXT_MENU_ITEM_PADDING, CONTEXT_MENU_LONG_PRESS_DURATION_MS } from "./ContextMenuConstants.native";
import { setAccessibilityFocus } from "../../../../modules/a11y/native/setAccessibilityFocus.android";
import { uid } from "../../../../modules/core/web/UID";
import { AccessibilityAnnouncer } from "../../../shared";
import * as _index_native from "../../../../intl/index.native";
import { intl } from "../../../../intl/index.native";
import * as _FWOMeasureUtils from "../../../../modules/screen/native/FWOMeasureUtils";
import { Gesture, GestureDetector } from "../../../../_bundle/Module5273";
import * as _HapticUtils_native from "../../../../modules/haptics/HapticUtils.native";
import { getIsScreenReaderEnabled } from "../../../../modules/a11y/native/useIsScreenReaderEnabled.native";
const isIOS = isFabric() && _PlatformUtils.isIOS();
const __initData = {
code: "function ContextMenuNativeTsx1(){const{_isFabricIOS,buttonTagSV,measureInWindowForFWO,measure,buttonRef,title,itemCount,dividerIndexes,approximateItemHeight,CONTEXT_MENU_DIVIDER_HEIGHT,CONTEXT_MENU_OFFSET,screenHeight,CONTEXT_MENU_EDGE_OFFSET,screenWidth,CONTEXT_MENU_MIN_WIDTH,menuAlign,runOnJS,showMenu}=this.__closure;let pageX;let pageY;let width;let height;if(_isFabricIOS){const tag=buttonTagSV.get();if(tag===-1)return;const m=measureInWindowForFWO(tag);if(m==null)return;pageX=m.x;pageY=m.y;width=m.width;height=m.height;}else{const m=measure(buttonRef);if(m==null)return;pageX=m.pageX;pageY=m.pageY;width=m.width;height=m.height;}const rowCount=title!=null?itemCount+1:itemCount;const dividerCount=(title!=null?1:0)+dividerIndexes.length;const menuHeight=approximateItemHeight.get()*rowCount+CONTEXT_MENU_DIVIDER_HEIGHT*dividerCount;const positionBelowOffset=pageY+height+CONTEXT_MENU_OFFSET;const positionAboveOffset=screenHeight-pageY+CONTEXT_MENU_OFFSET;const availableSpaceBelow=screenHeight-positionBelowOffset-CONTEXT_MENU_EDGE_OFFSET;const availableSpaceAbove=pageY-CONTEXT_MENU_EDGE_OFFSET;const wouldOverflowBelow=availableSpaceBelow<menuHeight;const wouldOverflowAbove=availableSpaceAbove<menuHeight;const minimumRightPosition=Math.max(screenWidth-pageX-width,CONTEXT_MENU_EDGE_OFFSET);function autoPositionVertical(offset){'worklet';let positionY='below';let y=pageY+height+CONTEXT_MENU_OFFSET;if(wouldOverflowBelow===wouldOverflowAbove){if(availableSpaceBelow>availableSpaceAbove){positionY='below';}else{positionY='above';}}else if(wouldOverflowBelow){positionY='above';}else{positionY='below';}y=(positionY==='above'?positionAboveOffset:positionBelowOffset)+(offset!==null&&offset!==void 0?offset:0);return{y:y,positionY:positionY};}function autoPositionHorizontal(){'worklet';const distanceFromLeftEdge=pageX-CONTEXT_MENU_EDGE_OFFSET;const distanceFromRightEdge=screenWidth-CONTEXT_MENU_EDGE_OFFSET-(pageX+CONTEXT_MENU_MIN_WIDTH);let positionX='left';let x=pageX;if(distanceFromLeftEdge>distanceFromRightEdge){positionX='right';x=minimumRightPosition;}return{x:x,positionX:positionX};}if(menuAlign==='auto'){const{y:y,positionY:positionY}=autoPositionVertical();const{x:x,positionX:positionX}=autoPositionHorizontal();runOnJS(showMenu)(x,y,positionX,positionY,menuHeight,width);}else if(menuAlign==='above'||menuAlign==='below'){const positionY=menuAlign;const y=positionY==='above'?positionAboveOffset:positionBelowOffset;const{x:x,positionX:positionX}=autoPositionHorizontal();runOnJS(showMenu)(x,y,positionX,positionY,menuHeight,width);}else{const positionX=menuAlign==='left'?'right':'left';const x=positionX==='left'?pageX+width+CONTEXT_MENU_OFFSET:minimumRightPosition+width+CONTEXT_MENU_OFFSET;const{y:y,positionY:positionY}=autoPositionVertical(-1*(CONTEXT_MENU_OFFSET+height));runOnJS(showMenu)(x,y,positionX,positionY,menuHeight,width);}}"
};
const __initData2 = {
code: "function autoPositionVertical_ContextMenuNativeTsx2(offset){const{pageY,height,CONTEXT_MENU_OFFSET,wouldOverflowBelow,wouldOverflowAbove,availableSpaceBelow,availableSpaceAbove,positionAboveOffset,positionBelowOffset}=this.__closure;let positionY='below';let y=pageY+height+CONTEXT_MENU_OFFSET;if(wouldOverflowBelow===wouldOverflowAbove){if(availableSpaceBelow>availableSpaceAbove){positionY='below';}else{positionY='above';}}else if(wouldOverflowBelow){positionY='above';}else{positionY='below';}y=(positionY==='above'?positionAboveOffset:positionBelowOffset)+(offset!==null&&offset!==void 0?offset:0);return{y:y,positionY:positionY};}"
};
const __initData3 = {
code: "function autoPositionHorizontal_ContextMenuNativeTsx3(){const{pageX,CONTEXT_MENU_EDGE_OFFSET,screenWidth,CONTEXT_MENU_MIN_WIDTH,minimumRightPosition}=this.__closure;const distanceFromLeftEdge=pageX-CONTEXT_MENU_EDGE_OFFSET;const distanceFromRightEdge=screenWidth-CONTEXT_MENU_EDGE_OFFSET-(pageX+CONTEXT_MENU_MIN_WIDTH);let positionX='left';let x=pageX;if(distanceFromLeftEdge>distanceFromRightEdge){positionX='right';x=minimumRightPosition;}return{x:x,positionX:positionX};}"
};
const __initData4 = {
code: "function onPanGestureEnd_ContextMenuNativeTsx4(){const{state,runOnJS,requestClose}=this.__closure;const{activeIndex:activeIndex}=state;const isDismiss=activeIndex.get()===-1;runOnJS(requestClose)(isDismiss);}"
};
const __initData5 = {
code: "function ContextMenuNativeTsx5(e){const{updateContextMenuState,state}=this.__closure;updateContextMenuState(e.absoluteX,e.absoluteY,state);}"
};
const __initData6 = {
code: "function ContextMenuNativeTsx6(){const{runOnJS,triggerHapticFeedback,CONTEXT_MENU_OPEN_HAPTIC,measureButtonAndShowMenu}=this.__closure;runOnJS(triggerHapticFeedback)(CONTEXT_MENU_OPEN_HAPTIC);measureButtonAndShowMenu();}"
};
const __initData7 = {
code: "function ContextMenuNativeTsx7(){const{measureButtonAndShowMenu}=this.__closure;measureButtonAndShowMenu();}"
};
const __initData8 = {
code: "function ContextMenuNativeTsx8(e){const{updateContextMenuState,state}=this.__closure;updateContextMenuState(e.absoluteX,e.absoluteY,state);}"
};
const __initData9 = {
code: "function ContextMenuNativeTsx9(){const{runOnJS,triggerHapticFeedback,CONTEXT_MENU_OPEN_HAPTIC,measureButtonAndShowMenu}=this.__closure;runOnJS(triggerHapticFeedback)(CONTEXT_MENU_OPEN_HAPTIC);measureButtonAndShowMenu();}"
};
export function ContextMenu(props) {
let items2, dividerIndexes, length, width, height, contextMenuState, activeIndex, activeContextMenu, sharedValue2, ref, callback, callback2, callback3, callback4;
const { children, items, triggerOnLongPress = false } = props;
let c17122_1 = triggerOnLongPress;
let triggerOnTap = props.triggerOnTap;
if (triggerOnTap === void 0) {
triggerOnTap = false;
}
let c17122_2 = triggerOnTap;
const { disableGesture = false, align = "auto" } = props;
let c17122_3 = align;
const { title, onOpen, onClose, keyboardShouldPersistTaps } = props;
let returnRef2 = props.returnRef;
let returnRef = returnRef2;
let enabled = props.enabled;
if (enabled === void 0) {
enabled = true;
}
let c17122_9 = enabled;
let buttonRef2 = props.buttonRef;
let buttonRef = buttonRef2;
items2 = void 0;
dividerIndexes = void 0;
length = void 0;
width = void 0;
height = void 0;
contextMenuState = void 0;
activeIndex = void 0;
activeContextMenu = void 0;
sharedValue2 = void 0;
ref = void 0;
callback = void 0;
callback2 = void 0;
callback3 = void 0;
callback4 = void 0;
const animatedRef = useAnimatedRef();
if (buttonRef2 == null) {
buttonRef2 = animatedRef;
}
buttonRef = buttonRef2;
const sharedValue = useSharedValue(-1);
useEffect(() => buttonRef.observe((a0) => {
if (a0 != null) {
sharedValue.set(a0);
}
}), [buttonRef2, sharedValue]);
const memo = useMemo(() => {
const isArray = Array.isArray(items[0]);
const items3 = isArray ? items.flat() : items;
let c26416_0 = items3;
const dividerIndexes2 = [];
let c26416_1 = dividerIndexes2;
if (isArray) {
items.forEach((item, index) => {
if (index > 0) {
c26416_1.push(c26416_0.indexOf(item[0]));
}
});
}
return {
items: items3,
dividerIndexes: dividerIndexes2
};
}, [items]);
items2 = memo.items;
dividerIndexes = memo.dividerIndexes;
length = items2.length;
const windowDimensions_native = useWindowDimensions_native({
ignoreKeyboard: isAndroid()
});
width = windowDimensions_native.width;
height = windowDimensions_native.height;
contextMenuState = useContextMenuState();
activeIndex = contextMenuState.activeIndex;
const fontScale = useFontScale();
if (returnRef2 === void 0) {
returnRef2 = buttonRef2;
}
returnRef = returnRef2;
activeContextMenu = useActiveContextMenu();
sharedValue2 = useSharedValue(Math.max((CONTEXT_MENU_ITEM_BASE_HEIGHT - 2 * CONTEXT_MENU_ITEM_PADDING) * fontScale + 2 * CONTEXT_MENU_ITEM_PADDING, CONTEXT_MENU_ITEM_BASE_HEIGHT));
ref = useRef(items2);
useLayoutEffect(() => {
ref.current = items2;
}, [items2]);
useLayoutEffect(() => {
if (activeContextMenu == null) {
resetContextMenuState(contextMenuState);
}
}, [activeContextMenu, contextMenuState]);
callback = useCallback((a0) => {
if (onClose != null) {
onClose(a0);
}
hideContextMenu();
const r17 = activeIndex.get();
if (r17 !== -1) {
const r20 = ref.current[r17];
if (r20 != null) {
r20.action();
}
}
}, [activeIndex, onClose]);
callback2 = useCallback(() => {
setAccessibilityFocus({
ref: returnRef
});
}, [returnRef2]);
callback3 = useCallback((a0, a1, a2, a3, a4, a5) => {
if (onOpen != null) {
onOpen();
}
showContextMenu({
key: uid(),
x: a0,
y: a1,
positionX: a2,
positionY: a3,
height: a4,
width: a5,
state: contextMenuState,
items: items2,
title,
keyboardShouldPersistTaps,
requestClose: callback,
onClose: callback2,
dividerIndexes
});
if (isAndroid()) {
AccessibilityAnnouncer.announce(intl.string(_index_native.t.ZqK0uI));
}
}, [onOpen, contextMenuState, items2, title, keyboardShouldPersistTaps, callback, callback2, dividerIndexes]);
const V = function V() {
let r12, r16, r20, r41, height2, pageX3, pageY, width2;
let pageX, c26417_1, c26417_2, c26417_3, c26417_4, c26417_5, c26417_6, c26417_7;
if (isIOS) {
const r15 = sharedValue.get();
if (r15 === -1) {
return void 0;
}
const r18 = _FWOMeasureUtils.measureInWindowForFWO(r15);
if (r18 == null) {
return void 0;
}
const r51 = r18.x;
pageX = r51;
pageY = r18.y;
width2 = r18.width;
height2 = r18.height;
r12 = r51;
pageX3 = r12;
r20 = height2;
r16 = pageY;
r41 = pageX3;
} else {
const r39 = _ReanimatedRexport.measure(buttonRef);
if (r39 == null) {
return void 0;
}
const pageX2 = r39.pageX;
pageX = pageX2;
pageY = r39.pageY;
width2 = r39.width;
height2 = r39.height;
r12 = pageX2;
pageX3 = r12;
r20 = height2;
r16 = pageY;
r41 = pageX3;
}
const r54 = title != null ? length + 1 : length;
const r58 = title != null ? 1 : 0;
L47: {
const r61 = r58 + dividerIndexes.length;
const r73 = sharedValue2.get() * r54 + _ContextMenuConstants_native.CONTEXT_MENU_DIVIDER_HEIGHT * r61;
let positionBelowOffset = r16 + r20 + _ContextMenuConstants_native.CONTEXT_MENU_OFFSET;
c26417_1 = positionBelowOffset;
const positionAboveOffset = height - r16 + _ContextMenuConstants_native.CONTEXT_MENU_OFFSET;
c26417_2 = positionAboveOffset;
const availableSpaceBelow = height - positionBelowOffset - _ContextMenuConstants_native.CONTEXT_MENU_EDGE_OFFSET;
c26417_3 = availableSpaceBelow;
const availableSpaceAbove = r16 - _ContextMenuConstants_native.CONTEXT_MENU_EDGE_OFFSET;
c26417_4 = availableSpaceAbove;
const wouldOverflowBelow = availableSpaceBelow < r73;
c26417_5 = wouldOverflowBelow;
const wouldOverflowAbove = availableSpaceAbove < r73;
c26417_6 = wouldOverflowAbove;
const minimumRightPosition = Math.max(width - r41 - width2, _ContextMenuConstants_native.CONTEXT_MENU_EDGE_OFFSET);
c26417_7 = minimumRightPosition;
const autoPositionVertical = function autoPositionVertical(a0) {
_ContextMenuConstants_native.CONTEXT_MENU_OFFSET;
const positionY = c26417_5 === c26417_6 ? c26417_3 > c26417_4 ? "below" : "above" : c26417_5 ? "above" : "below";
return {
y: (positionY === "above" ? c26417_2 : c26417_1) + (a0 == null ? 0 : a0),
positionY
};
};
autoPositionVertical.__closure = {
pageY,
height: height2,
CONTEXT_MENU_OFFSET: _ContextMenuConstants_native.CONTEXT_MENU_OFFSET,
wouldOverflowBelow,
wouldOverflowAbove,
availableSpaceBelow,
availableSpaceAbove,
positionAboveOffset,
positionBelowOffset
};
autoPositionVertical.__workletHash = 15309589830995;
autoPositionVertical.__initData = __initData2;
const autoPositionHorizontal = function autoPositionHorizontal() {
let r3 = pageX;
const r5 = r3 - _ContextMenuConstants_native.CONTEXT_MENU_EDGE_OFFSET;
const r20 = width - _ContextMenuConstants_native.CONTEXT_MENU_EDGE_OFFSET - (r3 + _ContextMenuConstants_native.CONTEXT_MENU_MIN_WIDTH);
let positionX = "left";
if (r5 > r20) {
r3 = c26417_7;
positionX = "right";
}
return {
x: r3,
positionX
};
};
autoPositionHorizontal.__closure = {
pageX: pageX3,
CONTEXT_MENU_EDGE_OFFSET: _ContextMenuConstants_native.CONTEXT_MENU_EDGE_OFFSET,
screenWidth: width,
CONTEXT_MENU_MIN_WIDTH: _ContextMenuConstants_native.CONTEXT_MENU_MIN_WIDTH,
minimumRightPosition
};
autoPositionHorizontal.__workletHash = 14761866330436;
autoPositionHorizontal.__initData = __initData3;
if (c17122_3 === "auto") {
_ContextMenuConstants_native.CONTEXT_MENU_OFFSET;
const r216 = wouldOverflowBelow === wouldOverflowAbove ? availableSpaceBelow > availableSpaceAbove ? "below" : "above" : wouldOverflowBelow ? "above" : "below";
if (r216 === "above") {
positionBelowOffset = positionAboveOffset;
}
const r219 = positionBelowOffset + 0;
const r225 = r12 - _ContextMenuConstants_native.CONTEXT_MENU_EDGE_OFFSET;
const r238 = width - _ContextMenuConstants_native.CONTEXT_MENU_EDGE_OFFSET - (r12 + _ContextMenuConstants_native.CONTEXT_MENU_MIN_WIDTH);
let r239 = "left";
if (r225 > r238) {
r239 = "right";
r12 = minimumRightPosition;
}
_ReanimatedRexport.runOnJS(callback3)(r12, r219, r239, r216, r73, width2);
} else {
const r5 = c17122_3 === "above";
if (!r5 && c17122_3 !== "below") {
const r136 = c17122_3 === "left" ? "right" : "left";
const r143 = r136 === "left" ? r41 + width2 + _ContextMenuConstants_native.CONTEXT_MENU_OFFSET : minimumRightPosition + width2 + _ContextMenuConstants_native.CONTEXT_MENU_OFFSET;
const r157 = -1 * (_ContextMenuConstants_native.CONTEXT_MENU_OFFSET + r20);
_ContextMenuConstants_native.CONTEXT_MENU_OFFSET;
const r163 = wouldOverflowBelow === wouldOverflowAbove ? availableSpaceBelow > availableSpaceAbove ? "below" : "above" : wouldOverflowBelow ? "above" : "below";
const r32 = (r163 === "above" ? positionAboveOffset : positionBelowOffset) + r157;
_ReanimatedRexport.runOnJS(callback3)(r143, r32, r136, r163, r73, width2);
break L47;
}
const r174 = r5 ? positionAboveOffset : positionBelowOffset;
const r180 = r12 - _ContextMenuConstants_native.CONTEXT_MENU_EDGE_OFFSET;
const r193 = width - _ContextMenuConstants_native.CONTEXT_MENU_EDGE_OFFSET - (r12 + _ContextMenuConstants_native.CONTEXT_MENU_MIN_WIDTH);
let r194 = "left";
let r195 = r12;
if (r180 > r193) {
r194 = "right";
r195 = minimumRightPosition;
}
_ReanimatedRexport.runOnJS(callback3)(r195, r174, r194, c17122_3, r73, width2);
}
}
};
V.__closure = {
_isFabricIOS: isIOS,
buttonTagSV: sharedValue,
measureInWindowForFWO: _FWOMeasureUtils.measureInWindowForFWO,
measure: _ReanimatedRexport.measure,
buttonRef: buttonRef2,
title,
itemCount: length,
dividerIndexes,
approximateItemHeight: sharedValue2,
CONTEXT_MENU_DIVIDER_HEIGHT: _ContextMenuConstants_native.CONTEXT_MENU_DIVIDER_HEIGHT,
CONTEXT_MENU_OFFSET: _ContextMenuConstants_native.CONTEXT_MENU_OFFSET,
screenHeight: height,
CONTEXT_MENU_EDGE_OFFSET: _ContextMenuConstants_native.CONTEXT_MENU_EDGE_OFFSET,
screenWidth: width,
CONTEXT_MENU_MIN_WIDTH: _ContextMenuConstants_native.CONTEXT_MENU_MIN_WIDTH,
menuAlign: align,
runOnJS: _ReanimatedRexport.runOnJS,
showMenu: callback3
};
V.__workletHash = 6408542373252;
V.__initData = __initData;
callback4 = useCallback(V, [buttonRef2, sharedValue, sharedValue2, title, length, height, align, callback3, width, dividerIndexes]);
const memo2 = useMemo(() => {
let r51;
const onPanGestureEnd = function onPanGestureEnd() {
const r8 = contextMenuState.activeIndex.get();
_ReanimatedRexport.runOnJS(callback)(r8 === -1);
};
onPanGestureEnd.__closure = {
state: contextMenuState,
runOnJS: _ReanimatedRexport.runOnJS,
requestClose: callback
};
onPanGestureEnd.__workletHash = 12851223476540;
onPanGestureEnd.__initData = __initData4;
if (c17122_1) {
const r67 = Gesture.Pan();
const r70 = r67.enabled(c17122_9);
const i = function i(a0) {
_ContextMenuState_native.updateContextMenuState(a0.absoluteX, a0.absoluteY, contextMenuState);
};
i.__closure = {
updateContextMenuState: _ContextMenuState_native.updateContextMenuState,
state: contextMenuState
};
i.__workletHash = 2460213213323;
i.__initData = __initData5;
const r81 = r70.onUpdate(i).onEnd(onPanGestureEnd);
const shouldCancelWhenOutside = Gesture.LongPress().enabled(c17122_9).minDuration(CONTEXT_MENU_LONG_PRESS_DURATION_MS).shouldCancelWhenOutside(false);
const n = function n() {
_ReanimatedRexport.runOnJS(_HapticUtils_native.triggerHapticFeedback)(_ContextMenuConstants_native.CONTEXT_MENU_OPEN_HAPTIC);
callback4();
};
n.__closure = {
runOnJS: _ReanimatedRexport.runOnJS,
triggerHapticFeedback: _HapticUtils_native.triggerHapticFeedback,
CONTEXT_MENU_OPEN_HAPTIC: _ContextMenuConstants_native.CONTEXT_MENU_OPEN_HAPTIC,
measureButtonAndShowMenu: callback4
};
n.__workletHash = 13919366908951;
n.__initData = __initData6;
return Gesture.Simultaneous(shouldCancelWhenOutside.onStart(n), r81);
}
if (c17122_2) {
const r56 = Gesture.Tap().enabled(c17122_9);
const r58 = function() {
callback4();
};
r58.__closure = {
measureButtonAndShowMenu: callback4
};
r58.__workletHash = 13410382812897;
r58.__initData = __initData7;
r51 = r56.onStart(r58);
} else {
const r26 = Gesture.Pan().enabled(c17122_9);
const t = function t() {
_ReanimatedRexport.runOnJS(_HapticUtils_native.triggerHapticFeedback)(_ContextMenuConstants_native.CONTEXT_MENU_OPEN_HAPTIC);
callback4();
};
t.__closure = {
runOnJS: _ReanimatedRexport.runOnJS,
triggerHapticFeedback: _HapticUtils_native.triggerHapticFeedback,
CONTEXT_MENU_OPEN_HAPTIC: _ContextMenuConstants_native.CONTEXT_MENU_OPEN_HAPTIC,
measureButtonAndShowMenu: callback4
};
t.__workletHash = 11906156003448;
t.__initData = __initData9;
const r40 = r26.onBegin(t);
const e = function e(a0) {
_ContextMenuState_native.updateContextMenuState(a0.absoluteX, a0.absoluteY, contextMenuState);
};
e.__closure = {
updateContextMenuState: _ContextMenuState_native.updateContextMenuState,
state: contextMenuState
};
e.__workletHash = 17473642675622;
e.__initData = __initData8;
r51 = r40.onUpdate(e).onEnd(onPanGestureEnd);
}
return r51;
}, [triggerOnLongPress, triggerOnTap, callback, enabled, contextMenuState, callback4]);
const memo3 = useMemo(() => items2.map((item) => ({
name: item.label,
label: item.label
})), [items2]);
const callback5 = useCallback((c26418_0) => {
const r7 = items2.find((item) => item.label === c26418_0.nativeEvent.actionName);
if (r7 != null) {
const action = r7.action;
if (action != null) {
action.call(r7);
}
}
}, [items2]);
const callback6 = useCallback(() => {
if (isAndroid() && getIsScreenReaderEnabled()) {
runOnUI(callback4)();
}
}, [callback4]);
const callback7 = useCallback(() => {
runOnUI(callback4)();
}, [callback4]);
const r162 = {
ref: buttonRef2,
onPress: callback6,
onLongPress: triggerOnLongPress ? disableGesture ? callback7 : void 0 : void 0,
accessibilityActions: memo3,
onAccessibilityAction: callback5
};
return disableGesture ? <>
{children(r162)}
</> : <GestureDetector gesture={memo2}>
{children(r162)}
</GestureDetector>;
}
design/components/ContextMenu/native/ContextMenuConstants.native.tsx
+20
View File
@@ -0,0 +1,20 @@
// Metro module 9301 (f9302).
import { isIOS } from "../../../../utils/PlatformUtils";
import { HapticFeedbackTypes } from "../../../../modules/haptics/HapticUtils.native";
const r19 = isIOS() ? HapticFeedbackTypes.IMPACT_HEAVY : HapticFeedbackTypes.IMPACT_MEDIUM;
export const CONTEXT_MENU_LONG_PRESS_DURATION_MS = 300;
export { r19 as CONTEXT_MENU_OPEN_HAPTIC };
export const CONTEXT_MENU_ITEM_PADDING = 12;
export const CONTEXT_MENU_ITEM_BASE_HEIGHT = 42;
export const CONTEXT_MENU_DIVIDER_HEIGHT = 4;
export const CONTEXT_MENU_EDGE_OFFSET = 12;
export const CONTEXT_MENU_MIN_WIDTH = 220;
export const CONTEXT_MENU_OFFSET = 10;
export const CONTEXT_MENU_MIN_SCALE = 0.5;
export const CONTEXT_MENU_SPRING = {
mass: 0.3,
damping: 20,
stiffness: 200,
overshootClamping: true,
restDisplacementThreshold: 0.001
};
design/components/ContextMenu/native/ContextMenuContainer.native.tsx
+51
View File
@@ -0,0 +1,51 @@
// Metro module 13210 (f13211).
import { useEffect, useCallback } from "react";
import { View, StyleSheet } from "react-native";
import { createStyles } from "../../Styles/native/createStyles";
import { ContextMenuPopout } from "./ContextMenuPopout.native";
import { useActiveContextMenu, hideContextMenu } from "./ContextMenuState.native";
import { KeyboardEvents } from "../../../../_bundle/Module1595";
import OverlayView from "../../../void/OverlayView/native/OverlayView";
import { Dialog } from "../../Dialog/native/Dialog.native";
import { TransitionGroup } from "../../TransitionGroup/TransitionGroup";
let useStyles, c9160_7, EMPTY_CALLBACK, renderItem;
const getItemKey = function getItemKey(a0) {
return a0.key;
};
useStyles = createStyles({
overlayView: {
...StyleSheet.absoluteFillObject,
zIndex: 99999
},
wrapperView: StyleSheet.absoluteFillObject
});
c9160_7 = [];
EMPTY_CALLBACK = () => {};
renderItem = (a0, a1, a2, a3) => <ContextMenuPopout key={a0} menu={a1} transitionState={a2} cleanUp={a3} />;
export function ContextMenuContainer() {
let callback;
const styles = useStyles();
const activeContextMenu = useActiveContextMenu();
const items = activeContextMenu != null ? [activeContextMenu] : c9160_7;
let r18 = activeContextMenu?.requestClose;
if (r18 == null) {
r18 = EMPTY_CALLBACK;
}
const EMPTY_CALLBACK2 = r18;
useEffect(() => {
let c27416_0 = KeyboardEvents.addListener("keyboardDidHide", hideContextMenu);
return () => {
c27416_0.remove();
};
}, []);
callback = useCallback(() => {
EMPTY_CALLBACK2(true);
}, [EMPTY_CALLBACK2]);
return <TransitionGroup wrapChildren={useCallback((a0, a1) => <OverlayView style={styles.overlayView}>
<View pointerEvents={a1.length === 0 ? "none" : "auto"} style={styles.wrapperView}>
<Dialog onDismiss={callback}>
{a0}
</Dialog>
</View>
</OverlayView>, [callback, styles.overlayView, styles.wrapperView])} items={items} renderItem={renderItem} getItemKey={getItemKey} />;
}
design/components/ContextMenu/native/ContextMenuItem.native.tsx
+160
View File
@@ -0,0 +1,160 @@
// Metro module 13209 (f13210).
import { useCallback } from "react";
import { Pressable } from "react-native";
import * as _ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
import ReanimatedRexport, { useAnimatedRef, useSharedValue, useAnimatedReaction, useAnimatedStyle } from "../../../../modules/reanimated/ReanimatedRexport";
import { createStyles } from "../../Styles/native/createStyles";
import { CONTEXT_MENU_ITEM_PADDING, CONTEXT_MENU_ITEM_BASE_HEIGHT } from "./ContextMenuConstants.native";
import Module712 from "../../../../_bundle/Module712";
import MobileVisualRefreshExperiment from "../../../../modules/themes/experiments/MobileVisualRefreshExperiment";
import * as _ContextMenuState_native from "./ContextMenuState.native";
import * as _spring from "../../../animation/reanimated/spring/spring";
import * as _springPresets from "../../../animation/reanimated/spring/springPresets";
import Icon from "../../../void/Icon/native/Icon";
import { Text } from "../../Text/native/Text";
let __initData, __initData2, __initData3;
const AnimatedComponent = ReanimatedRexport.createAnimatedComponent(Pressable);
const useStyles = createStyles((a0) => ({
container: {
padding: CONTEXT_MENU_ITEM_PADDING,
minHeight: CONTEXT_MENU_ITEM_BASE_HEIGHT,
flexDirection: "row",
justifyContent: "space-between",
alignItems: "center",
gap: 8
},
containerRefresh: {
justifyContent: "flex-start"
},
roundedTop: {
borderTopLeftRadius: Module712.radii.lg,
borderTopRightRadius: Module712.radii.lg
},
roundedBottom: {
borderBottomLeftRadius: Module712.radii.lg,
borderBottomRightRadius: Module712.radii.lg
},
border: {
borderBottomWidth: 1,
borderBottomColor: Module712.colors.BORDER_SUBTLE
},
pressed: {
backgroundColor: Module712.colors.BACKGROUND_MOD_SUBTLE
},
icon: {
width: 20,
height: 20,
tintColor: a0 === "destructive" ? Module712.colors.TEXT_FEEDBACK_CRITICAL : Module712.colors.TEXT_STRONG
},
label: {
flexShrink: 1
},
trailingIndicator: {
marginLeft: "auto"
}
}));
__initData = {
code: "function ContextMenuItemNativeTsx1(){const{pan}=this.__closure;return pan.get();}"
};
__initData2 = {
code: "function ContextMenuItemNativeTsx2(_current,previous){const{measure,ref,index,INDEX_BOUNDS_OFFSET,itemMeasurements,INDEX_BOUNDS_PAGE_X_OFFSET,INDEX_BOUNDS_PAGE_Y_OFFSET,INDEX_BOUNDS_WIDTH_OFFSET,INDEX_BOUNDS_HEIGHT_OFFSET}=this.__closure;if(previous==null||_current===previous)return;const measurements=measure(ref);if(measurements!=null){const{pageX:pageX,pageY:pageY,width:width,height:height}=measurements;const offset=index*INDEX_BOUNDS_OFFSET;itemMeasurements.get()[offset+INDEX_BOUNDS_PAGE_X_OFFSET]=pageX;itemMeasurements.get()[offset+INDEX_BOUNDS_PAGE_Y_OFFSET]=pageY;itemMeasurements.get()[offset+INDEX_BOUNDS_WIDTH_OFFSET]=width;itemMeasurements.get()[offset+INDEX_BOUNDS_HEIGHT_OFFSET]=height;}}"
};
__initData3 = {
code: "function ContextMenuItemNativeTsx3(){const{activeIndex,index,pressed,withSpring,backgroundColor,SUBTLE_SPRING}=this.__closure;const isActive=activeIndex.get()===index||pressed.get()===1;return{backgroundColor:withSpring(isActive?backgroundColor:'transparent',SUBTLE_SPRING,'animate-always')};}"
};
export function ContextMenuItem(props) {
let backgroundColor;
const { label, IconComponent, trailingIndicator: TrailingIndicator, iconSource } = props;
let start = props.start;
let end = props.end;
const { lastInSection, index, state, onPress, variant = "default", accessibilityRole = "button" } = props;
backgroundColor = void 0;
const animatedRef = useAnimatedRef();
const styles = useStyles(variant);
const r38 = MobileVisualRefreshExperiment("ContextMenuItem");
const { pan, itemMeasurements, activeIndex } = state;
const sharedValue = useSharedValue(0);
const U = () => pan.get();
U.__closure = {
pan
};
U.__workletHash = 11852115418144;
U.__initData = __initData;
const r47 = function(a0, a1) {
if (a1 != null && a0 !== a1) {
const r16 = _ReanimatedRexport.measure(animatedRef);
if (r16 != null) {
const { pageX, pageY, width, height } = r16;
const r22 = index * _ContextMenuState_native.INDEX_BOUNDS_OFFSET;
itemMeasurements.get()[r22 + _ContextMenuState_native.INDEX_BOUNDS_PAGE_X_OFFSET] = pageX;
itemMeasurements.get()[r22 + _ContextMenuState_native.INDEX_BOUNDS_PAGE_Y_OFFSET] = pageY;
itemMeasurements.get()[r22 + _ContextMenuState_native.INDEX_BOUNDS_WIDTH_OFFSET] = width;
itemMeasurements.get()[r22 + _ContextMenuState_native.INDEX_BOUNDS_HEIGHT_OFFSET] = height;
}
}
};
r47.__closure = {
measure: _ReanimatedRexport.measure,
ref: animatedRef,
index,
INDEX_BOUNDS_OFFSET: _ContextMenuState_native.INDEX_BOUNDS_OFFSET,
itemMeasurements,
INDEX_BOUNDS_PAGE_X_OFFSET: _ContextMenuState_native.INDEX_BOUNDS_PAGE_X_OFFSET,
INDEX_BOUNDS_PAGE_Y_OFFSET: _ContextMenuState_native.INDEX_BOUNDS_PAGE_Y_OFFSET,
INDEX_BOUNDS_WIDTH_OFFSET: _ContextMenuState_native.INDEX_BOUNDS_WIDTH_OFFSET,
INDEX_BOUNDS_HEIGHT_OFFSET: _ContextMenuState_native.INDEX_BOUNDS_HEIGHT_OFFSET
};
r47.__workletHash = 9571959267234;
r47.__initData = __initData2;
useAnimatedReaction(U, r47);
backgroundColor = styles.pressed.backgroundColor;
const R = function R() {
return {
backgroundColor: _spring.withSpring(activeIndex.get() === index || sharedValue.get() === 1 ? backgroundColor : "transparent", _springPresets.SUBTLE_SPRING, "animate-always")
};
};
R.__closure = {
activeIndex,
index,
pressed: sharedValue,
withSpring: _spring.withSpring,
backgroundColor,
SUBTLE_SPRING: _springPresets.SUBTLE_SPRING
};
R.__workletHash = 624481847983;
R.__initData = __initData3;
const animatedStyle = useAnimatedStyle(R);
const r85 = IconComponent != null ? <IconComponent size="sm" color={styles.icon.tintColor} /> : iconSource != null ? <Icon source={iconSource} style={styles.icon} /> : null;
const r96 = TrailingIndicator != null ? <TrailingIndicator size="sm" color={styles.icon.tintColor} /> : null;
const callback = useCallback((a0) => {
const layout = a0.nativeEvent.layout;
const { height, width } = layout;
if (height !== 0 && width !== 0) {
const r16 = index * _ContextMenuState_native.INDEX_BOUNDS_OFFSET;
itemMeasurements.get()[r16 + _ContextMenuState_native.INDEX_BOUNDS_HEIGHT_OFFSET] = height;
itemMeasurements.get()[r16 + _ContextMenuState_native.INDEX_BOUNDS_WIDTH_OFFSET] = width;
}
}, [index, itemMeasurements]);
const callback2 = useCallback(() => {
activeIndex.set(index);
}, [activeIndex, index]);
const callback3 = useCallback(() => {
activeIndex.set(-1);
}, [activeIndex]);
const style = [styles.container, r38 ? styles.containerRefresh : r38, (end ? !end : !lastInSection) && styles.border, , , ,];
if (start) {
start = styles.roundedTop;
}
style[3] = start;
if (end) {
end = styles.roundedBottom;
}
style[4] = end;
style[5] = animatedStyle;
return <AnimatedComponent ref={animatedRef} style={style} onLayout={callback} onPressIn={callback2} onPressOut={callback3} onPress={onPress} accessibilityRole={accessibilityRole}>
{r38 && <ReanimatedRexport.View>{r85}</ReanimatedRexport.View>}
<Text animated variant="text-md/medium" style={styles.label} color={variant === "destructive" ? "text-feedback-critical" : "text-strong"}>{label}</Text>
{r38 ? !r38 : <ReanimatedRexport.View>{r85}</ReanimatedRexport.View>}
{r96 != null && <ReanimatedRexport.View style={styles.trailingIndicator}>{r96}</ReanimatedRexport.View>}
</AnimatedComponent>;
}
design/components/ContextMenu/native/ContextMenuPopout.native.tsx
+235
View File
@@ -0,0 +1,235 @@
// Metro module 13211 (f13212).
import { useEffect, useState, useMemo, useCallback } from "react";
import { View, StyleSheet } from "react-native";
import { createStyles } from "../../Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import * as _ContextMenuConstants_native from "./ContextMenuConstants.native";
import { CONTEXT_MENU_ITEM_PADDING, CONTEXT_MENU_DIVIDER_HEIGHT, CONTEXT_MENU_EDGE_OFFSET } from "./ContextMenuConstants.native";
import * as _ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
import ReanimatedRexport, { useAnimatedStyle, useSharedValue } from "../../../../modules/reanimated/ReanimatedRexport";
import * as _TransitionGroup from "../../TransitionGroup/TransitionGroup";
import useSafeAreaInsetsKeyboardAware_native from "../../../../modules/safe_area/useSafeAreaInsetsKeyboardAware.native";
import useWindowDimensions_native from "../../../../modules/screen/useWindowDimensions.native";
import { isAndroid } from "../../../../utils/PlatformUtils";
import * as _spring from "../../../animation/reanimated/spring/spring";
import * as _ContextMenuState_native from "./ContextMenuState.native";
import { Gesture, GestureDetector } from "../../../../_bundle/Module5273";
import { Text } from "../../Text/native/Text";
import { ContextMenuItem } from "./ContextMenuItem.native";
import { getIsScreenReaderEnabled } from "../../../../modules/a11y/native/useIsScreenReaderEnabled.native";
import { Backdrop } from "../../Backdrop/native/Backdrop.native";
import * as _index_native from "../../../../intl/index.native";
import { intl } from "../../../../intl/index.native";
let useStyles, __initData, __initData2, __initData3, __initData4, useStyles2, __initData5, ContextMenuBackdrop;
const ContextMenuDivider = function ContextMenuDivider() {
return <View style={useStyles().divider} />;
};
ContextMenuBackdrop = function ContextMenuBackdrop(props) {
const { onPress: onPress2, visible } = props;
const styles2 = useStyles2();
const n = function n() {
return {
opacity: _spring.withSpring(visible.get(), _ContextMenuConstants_native.CONTEXT_MENU_SPRING)
};
};
n.__closure = {
withSpring: _spring.withSpring,
visible,
CONTEXT_MENU_SPRING: _ContextMenuConstants_native.CONTEXT_MENU_SPRING
};
n.__workletHash = 6862317967896;
n.__initData = __initData5;
return <Backdrop blur="none" style={useAnimatedStyle(n)} accessibleDismissStyle={styles2.accessibleDismiss} onDismiss={onPress2} accessibilityLabel={isAndroid() ? intl.string(_index_native.t.hPBScv) : intl.string(_index_native.t.xs0juG)} />;
};
useStyles = createStyles({
container: {
position: "absolute",
backgroundColor: Module712.colors.BACKGROUND_SURFACE_HIGHEST,
borderWidth: 1,
borderColor: Module712.colors.BORDER_SUBTLE,
borderRadius: Module712.radii.lg,
minWidth: _ContextMenuConstants_native.CONTEXT_MENU_MIN_WIDTH,
...Module712.shadows.SHADOW_HIGH
},
titleContainer: {
padding: CONTEXT_MENU_ITEM_PADDING
},
divider: {
borderBottomWidth: CONTEXT_MENU_DIVIDER_HEIGHT,
borderBottomColor: Module712.colors.BORDER_SUBTLE
}
});
__initData = {
code: "function ContextMenuPopoutNativeTsx1(){const{maxHeight,height,CONTEXT_MENU_MIN_WIDTH,positionY,positionX,CONTEXT_MENU_MIN_SCALE,withSpring,interpolate,visible,CONTEXT_MENU_SPRING,transitionState,TransitionStates,runOnJS,cleanUp,onClose}=this.__closure;const visibleHeight=Math.min(maxHeight,height);const halfHeight=visibleHeight/2;const halfWidth=CONTEXT_MENU_MIN_WIDTH/2;const translateYDirection=positionY==='below'?-1:1;const translateXDirection=positionX==='left'?-1:1;const translateY=translateYDirection*halfHeight+CONTEXT_MENU_MIN_SCALE*-translateYDirection*halfHeight;const translateX=translateXDirection*halfWidth+CONTEXT_MENU_MIN_SCALE*-translateXDirection*halfWidth;return{opacity:withSpring(interpolate(visible.get(),[0,1],[0,1]),CONTEXT_MENU_SPRING,'respect-motion-settings',function(finished){if(finished&&transitionState===TransitionStates.YEETED){runOnJS(cleanUp)();runOnJS(onClose)();}}),transform:[{translateX:withSpring(interpolate(visible.get(),[0,1],[translateX,0]),CONTEXT_MENU_SPRING)},{translateY:withSpring(interpolate(visible.get(),[0,1],[translateY,0]),CONTEXT_MENU_SPRING)},{scale:withSpring(interpolate(visible.get(),[0,1],[CONTEXT_MENU_MIN_SCALE,1]),CONTEXT_MENU_SPRING)}]};}"
};
__initData2 = {
code: "function ContextMenuPopoutNativeTsx2(finished){const{transitionState,TransitionStates,runOnJS,cleanUp,onClose}=this.__closure;if(finished&&transitionState===TransitionStates.YEETED){runOnJS(cleanUp)();runOnJS(onClose)();}}"
};
__initData3 = {
code: "function update_ContextMenuPopoutNativeTsx3(e){const{updateContextMenuState,state}=this.__closure;updateContextMenuState(e.absoluteX,e.absoluteY,state);}"
};
__initData4 = {
code: "function ContextMenuPopoutNativeTsx4(){const{state,runOnJS,requestClose}=this.__closure;const{activeIndex:activeIndex}=state;const isDismiss=activeIndex.get()===-1;runOnJS(requestClose)(isDismiss);}"
};
useStyles2 = createStyles({
accessibleDismiss: {
...StyleSheet.absoluteFillObject,
height: "auto"
}
});
__initData5 = {
code: "function ContextMenuPopoutNativeTsx5(){const{withSpring,visible,CONTEXT_MENU_SPRING}=this.__closure;return{opacity:withSpring(visible.get(),CONTEXT_MENU_SPRING)};}"
};
export function ContextMenuPopout(props) {
let c20412_9, state2, setState;
const { menu, transitionState, cleanUp } = props;
c20412_9 = void 0;
state2 = void 0;
setState = void 0;
const { x: r14, positionX, positionY, height, items: items2, state, requestClose, onClose, title: title2, keyboardShouldPersistTaps: keyboardShouldPersistTaps2 = "handled", dividerIndexes: dividerIndexes2, y: r18 } = menu;
const sharedValue = useSharedValue(transitionState === _TransitionGroup.TransitionStates.MOUNTED ? 1 : 0);
useEffect(() => {
if (transitionState === _TransitionGroup.TransitionStates.YEETED) {
sharedValue.set(0);
} else {
sharedValue.set(1);
}
}, [transitionState, sharedValue]);
const styles = useStyles();
const insets = useSafeAreaInsetsKeyboardAware_native({
includeKeyboardHeight: true
}).insets;
const { top, bottom } = insets;
const windowDimensions_native = useWindowDimensions_native({
ignoreKeyboard: isAndroid()
});
const { width, height: height2 } = windowDimensions_native;
const r4 = positionY === "below";
const r60 = height2 - r18;
const maxHeight = r4 ? r60 - bottom - CONTEXT_MENU_EDGE_OFFSET : r60 - top - CONTEXT_MENU_EDGE_OFFSET;
c20412_9 = maxHeight;
[state2, setState] = useState(height >= maxHeight);
const r77 = r4 ? "top" : "bottom";
const r78 = {};
r78[r77] = r18;
r78[positionX] = r14;
r78.maxHeight = maxHeight;
r78.maxWidth = width - CONTEXT_MENU_EDGE_OFFSET - r14;
const R = function R() {
const r5 = Math.min(c20412_9, height) / 2;
const r4 = _ContextMenuConstants_native.CONTEXT_MENU_MIN_WIDTH / 2;
const r1 = positionY === "below" ? -1 : 1;
const r2 = positionX === "left" ? -1 : 1;
const r41 = _ReanimatedRexport.interpolate(sharedValue.get(), [0, 1], [0, 1]);
const r44 = function t(a0) {
if (a0 ? transitionState === _TransitionGroup.TransitionStates.YEETED : a0) {
_ReanimatedRexport.runOnJS(cleanUp)();
_ReanimatedRexport.runOnJS(onClose)();
}
};
r44.__closure = {
transitionState,
TransitionStates: _TransitionGroup.TransitionStates,
runOnJS: _ReanimatedRexport.runOnJS,
cleanUp,
onClose
};
r44.__workletHash = 4025068986009;
r44.__initData = __initData2;
return {
opacity: _spring.withSpring(r41, _ContextMenuConstants_native.CONTEXT_MENU_SPRING, "respect-motion-settings", r44),
transform: [{
translateX: _spring.withSpring(_ReanimatedRexport.interpolate(sharedValue.get(), [0, 1], [r2 * r4 + _ContextMenuConstants_native.CONTEXT_MENU_MIN_SCALE * -r2 * r4, 0]), _ContextMenuConstants_native.CONTEXT_MENU_SPRING)
}, {
translateY: _spring.withSpring(_ReanimatedRexport.interpolate(sharedValue.get(), [0, 1], [r1 * r5 + _ContextMenuConstants_native.CONTEXT_MENU_MIN_SCALE * -r1 * r5, 0]), _ContextMenuConstants_native.CONTEXT_MENU_SPRING)
}, {
scale: _spring.withSpring(_ReanimatedRexport.interpolate(sharedValue.get(), [0, 1], [_ContextMenuConstants_native.CONTEXT_MENU_MIN_SCALE, 1]), _ContextMenuConstants_native.CONTEXT_MENU_SPRING)
}]
};
};
R.__closure = {
maxHeight,
height,
CONTEXT_MENU_MIN_WIDTH: _ContextMenuConstants_native.CONTEXT_MENU_MIN_WIDTH,
positionY,
positionX,
CONTEXT_MENU_MIN_SCALE: _ContextMenuConstants_native.CONTEXT_MENU_MIN_SCALE,
withSpring: _spring.withSpring,
interpolate: _ReanimatedRexport.interpolate,
visible: sharedValue,
CONTEXT_MENU_SPRING: _ContextMenuConstants_native.CONTEXT_MENU_SPRING,
transitionState,
TransitionStates: _TransitionGroup.TransitionStates,
runOnJS: _ReanimatedRexport.runOnJS,
cleanUp,
onClose
};
R.__workletHash = 16778623591634;
R.__initData = __initData;
const animatedStyle = useAnimatedStyle(R);
const memo = useMemo(() => {
const update = function update(a0) {
_ContextMenuState_native.updateContextMenuState(a0.absoluteX, a0.absoluteY, state);
};
update.__closure = {
updateContextMenuState: _ContextMenuState_native.updateContextMenuState,
state
};
update.__workletHash = 4218299258082;
update.__initData = __initData3;
const r25 = Gesture.Pan().enabled(!state2).onStart(update).onUpdate(update);
const r27 = function t() {
const r8 = state.activeIndex.get();
_ReanimatedRexport.runOnJS(requestClose)(r8 === -1);
};
r27.__closure = {
state,
runOnJS: _ReanimatedRexport.runOnJS,
requestClose
};
r27.__workletHash = 14495067009140;
r27.__initData = __initData4;
return r25.onEnd(r27);
}, [state, requestClose, state2]);
const callback2 = useCallback((a0) => {
setState(Math.round(a0.nativeEvent.layout.height) >= Math.round(c20412_9));
}, [maxHeight]);
const callback3 = useCallback(() => {
requestClose(true);
}, [requestClose]);
const callback4 = useCallback(() => {
requestClose(false);
}, [requestClose]);
const r135 = [<ContextMenuBackdrop onPress={callback3} visible={sharedValue} />, ,];
const r146 = title2 != null ? <>
<View style={styles.titleContainer}>
<Text variant="text-md/bold" color="mobile-text-heading-primary" accessibilityRole="header">{title2}</Text>
</View>
<ContextMenuDivider />
</> : null;
const items = items2;
const title = title2;
const state3 = state;
const callback = callback4;
const dividerIndexes = dividerIndexes2;
r135[1] = <GestureDetector gesture={memo}>
<ReanimatedRexport.ScrollView onLayout={callback2} bounces={false} style={[styles.container, r78, animatedStyle]} keyboardShouldPersistTaps={keyboardShouldPersistTaps2} accessibilityRole="list">
{r146}
{items.map(({ label, action, iconSource, IconComponent, trailingIndicator, variant, accessibilityRole }, a1) => {
const r41 = <ContextMenuItem key={`${label}-${a1}`} index={a1} label={label} start={a1 === 0 && title == null} end={a1 === items.length - 1} lastInSection={dividerIndexes.includes(a1 + 1)} iconSource={iconSource} IconComponent={IconComponent} trailingIndicator={trailingIndicator} state={state3} onPress={(event) => {
if (isAndroid() && getIsScreenReaderEnabled()) {
action();
}
if (callback != null) {
callback(event);
}
}} variant={variant} accessibilityRole={accessibilityRole} />;
return dividerIndexes.includes(a1) ? <>
<ContextMenuDivider key={`divider-${a1}`} />
{r41}
</> : r41;
})}
</ReanimatedRexport.ScrollView>
</GestureDetector>;
return <>{r135}</>;
}
design/components/ContextMenu/native/ContextMenuState.native.tsx
+87
View File
@@ -0,0 +1,87 @@
// Metro module 9300 (f9301).
import { useMemo } from "react";
import { create } from "../../../../_bundle/Module644";
import { batchUpdates } from "../../../../_bundle/Module705";
import * as _ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
import { useSharedValue } from "../../../../modules/reanimated/ReanimatedRexport";
import * as _HapticUtils_native from "../../../../modules/haptics/HapticUtils.native";
let c6123_3 = create(() => ({
menu: null
}));
export function updateContextMenuState(a0, a1, { pan, itemMeasurements, activeIndex }) {
pan.set(a1);
const r20 = itemMeasurements.get();
const r8 = 0 < r20.length;
let r1 = 0;
if (r8) {
do {
const r22 = r20[r1 + 2];
const r16 = r20[r1 + 3];
const r15 = r20[r1 + 1];
const r26 = r20[r1 + 0];
const r27 = r1;
if (a1 >= r15 && a1 <= r15 + r16 && a0 >= r26 && a0 <= r26 + r22) {
const r35 = r27 / 4;
if (activeIndex.get() !== r35) {
activeIndex.set(r35);
_ReanimatedRexport.runOnJS(_HapticUtils_native.triggerHapticFeedback)(_HapticUtils_native.HapticFeedbackTypes.IMPACT_LIGHT);
}
return void 0;
}
r1 = r27 + 4;
} while (r1 < r20.length);
}
activeIndex.set(-1);
}
updateContextMenuState.__closure = {
INDEX_BOUNDS_WIDTH_OFFSET: 2,
INDEX_BOUNDS_HEIGHT_OFFSET: 3,
INDEX_BOUNDS_PAGE_Y_OFFSET: 1,
INDEX_BOUNDS_PAGE_X_OFFSET: 0,
INDEX_BOUNDS_OFFSET: 4,
runOnJS: _ReanimatedRexport.runOnJS,
triggerHapticFeedback: _HapticUtils_native.triggerHapticFeedback,
HapticFeedbackTypes: _HapticUtils_native.HapticFeedbackTypes
};
updateContextMenuState.__workletHash = 10158111154044;
updateContextMenuState.__initData = {
code: "function updateContextMenuState_ContextMenuStateNativeTsx1(absoluteX,absoluteY,state){const{INDEX_BOUNDS_WIDTH_OFFSET,INDEX_BOUNDS_HEIGHT_OFFSET,INDEX_BOUNDS_PAGE_Y_OFFSET,INDEX_BOUNDS_PAGE_X_OFFSET,INDEX_BOUNDS_OFFSET,runOnJS,triggerHapticFeedback,HapticFeedbackTypes}=this.__closure;const{pan:pan,itemMeasurements:itemMeasurements,activeIndex:activeIndex}=state;pan.set(absoluteY);const bounds=itemMeasurements.get();let offset=0;while(offset<bounds.length){const width=bounds[offset+INDEX_BOUNDS_WIDTH_OFFSET];const height=bounds[offset+INDEX_BOUNDS_HEIGHT_OFFSET];const pageY=bounds[offset+INDEX_BOUNDS_PAGE_Y_OFFSET];const pageX=bounds[offset+INDEX_BOUNDS_PAGE_X_OFFSET];const lowerY=pageY;const upperY=pageY+height;const lowerX=pageX;const upperX=pageX+width;if(absoluteY>=lowerY&&absoluteY<=upperY&&absoluteX>=lowerX&&absoluteX<=upperX){const index=offset/INDEX_BOUNDS_OFFSET;if(activeIndex.get()!==index){activeIndex.set(index);runOnJS(triggerHapticFeedback)(HapticFeedbackTypes.IMPACT_LIGHT);}return;}offset+=INDEX_BOUNDS_OFFSET;}activeIndex.set(-1);}"
};
export const INDEX_BOUNDS_OFFSET = 4;
export const INDEX_BOUNDS_PAGE_X_OFFSET = 0;
export const INDEX_BOUNDS_PAGE_Y_OFFSET = 1;
export const INDEX_BOUNDS_WIDTH_OFFSET = 2;
export const INDEX_BOUNDS_HEIGHT_OFFSET = 3;
export { c6123_3 as ContextMenuStore };
export function showContextMenu(menu) {
batchUpdates(() => c6123_3.setState({
menu
}));
}
export function hideContextMenu() {
batchUpdates(() => {
c6123_3.setState((state) => state.menu != null ? {
menu: null
} : state);
});
}
export function useActiveContextMenu() {
return c6123_3((a0) => a0.menu);
}
export function useContextMenuState() {
const sharedValue = useSharedValue(-1);
const sharedValue2 = useSharedValue([]);
const sharedValue3 = useSharedValue(-1);
return useMemo(() => ({
pan: sharedValue,
itemMeasurements: sharedValue2,
activeIndex: sharedValue3
}), [sharedValue, sharedValue2, sharedValue3]);
}
export function resetContextMenuState({ activeIndex, pan, itemMeasurements }) {
activeIndex.set(-1);
pan.set(-1);
if (itemMeasurements.get().length > 0) {
itemMeasurements.set([]);
}
}
design/components/Dialog/native/Dialog.native.tsx
+15
View File
@@ -0,0 +1,15 @@
// Metro module 4582 (f4583).
import { useId } from "react";
import { StyleSheet } from "react-native";
import { AccessibilityView } from "../../AccessibilityView/AccessibilityView.native";
export function Dialog(props) {
const { dialogKey: _dialogKey, onDismiss, zIndex, ...props2 } = props;
let dialogKey = props.dialogKey;
const id = useId();
if (dialogKey == null) {
dialogKey = id;
}
return <AccessibilityView style={[StyleSheet.absoluteFill, {
zIndex
}]} accessibilityViewIsModal onAccessibilityEscape={onDismiss} nativeID={dialogKey} {...props2} />;
}
design/components/ErrorText/native/ErrorText.native.tsx
+20
View File
@@ -0,0 +1,20 @@
// Metro module 6729 (f6730).
import { useEffect } from "react";
import { getNodeText } from "../../../utils/native";
import { AccessibilityAnnouncer } from "../../../shared";
import { Stack } from "../../Stack/native/Stack.native";
import { CircleErrorIcon } from "../../Icon/native/redesign/generated/CircleErrorIcon";
import { Text } from "../../Text/native/Text";
export function ErrorText(props) {
const { children, style } = props;
const nodeText = getNodeText(children);
useEffect(() => {
if (nodeText != null && nodeText !== "") {
AccessibilityAnnouncer.announce(nodeText);
}
}, [nodeText]);
return <Stack direction="horizontal" spacing={4} align="flex-start" style={style}>
<CircleErrorIcon size="xs" color="text-feedback-critical" />
<Text variant="text-xs/medium" color="text-feedback-critical">{children}</Text>
</Stack>;
}
design/components/ExpressiveGradient/native/ExpressiveGradient.native.tsx
+72
View File
@@ -0,0 +1,72 @@
// Metro module 6657 (f6658).
import { StyleSheet, View } from "react-native";
import Module712 from "../../../../_bundle/Module712";
import { useToken } from "../../../tokens/native/useToken";
import Module689 from "../../../../_bundle/Module689";
import Module4611 from "../../../../_bundle/Module4611";
let c4259_7 = {
purple: {
start: Module712.colors.EXPRESSIVE_GRADIENT_PURPLE_START,
end: Module712.colors.EXPRESSIVE_GRADIENT_PURPLE_END
},
blue: {
start: Module712.colors.EXPRESSIVE_GRADIENT_BLUE_START,
end: Module712.colors.EXPRESSIVE_GRADIENT_BLUE_END
},
green: {
start: Module712.colors.EXPRESSIVE_GRADIENT_GREEN_START,
end: Module712.colors.EXPRESSIVE_GRADIENT_GREEN_END
},
pink: {
start: Module712.colors.EXPRESSIVE_GRADIENT_PINK_START,
end: Module712.colors.EXPRESSIVE_GRADIENT_PINK_END
},
"nitro-pink": {
start: Module712.colors.EXPRESSIVE_GRADIENT_NITRO_PINK_START,
end: Module712.colors.EXPRESSIVE_GRADIENT_NITRO_PINK_END
},
"nitro-green": {
start: Module712.colors.EXPRESSIVE_GRADIENT_NITRO_GREEN_START,
end: Module712.colors.EXPRESSIVE_GRADIENT_NITRO_GREEN_END
}
};
const start = {
x: 0,
y: 0.5
};
const end = {
x: 1,
y: 0.5
};
const start2 = {
x: 0.5,
y: 0
};
const end2 = {
x: 0.5,
y: 0.5
};
export function ExpressiveGradient(props) {
let r20;
const { color = "purple", offsetBottom = 0, backgroundColor, children, style } = props;
if (typeof color === "object") {
r20 = color;
if (r20 == null) {
r20 = c4259_7[color == null ? "purple" : color];
}
} else {
r20 = c4259_7[color == null ? "purple" : color];
}
const token3 = useToken(r20.start);
const token2 = useToken(r20.end);
const token = useToken(backgroundColor);
return <View style={[StyleSheet.absoluteFill, style]}>
<View style={[StyleSheet.absoluteFill, offsetBottom > 0 ? {
bottom: 100 * offsetBottom + "%"
} : void 0]}>
<Module4611 style={StyleSheet.absoluteFillObject} colors={[token3, token2]} start={start} end={end} pointerEvents="none" />
<Module4611 style={StyleSheet.absoluteFillObject} colors={[Module689(token).alpha(0).css(), token]} start={start2} end={end2} pointerEvents="none" />
</View>
{children}
</View>;
}
design/components/Forms/native/FormCheckbox.native.tsx
+90
View File
@@ -0,0 +1,90 @@
// Metro module 7636 (f7637).
import { useContext } from "react";
import { createStyles } from "../../Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import ReanimatedRexport, { useAnimatedStyle } from "../../../../modules/reanimated/ReanimatedRexport";
import Icon from "../../../void/Icon/native/Icon";
import MobileVisualRefreshExperiment from "../../../../modules/themes/experiments/MobileVisualRefreshExperiment";
import { AccessibilityPreferencesContext } from "../../../../_bundle/Module3908";
import Module5557 from "../../../../_bundle/Module5557";
import * as _spring from "../../../animation/reanimated/spring/spring";
import * as _springPresets from "../../../animation/reanimated/spring/springPresets";
const useStyles = createStyles({
checkbox: {
width: Module712.modules.mobile.CONTROL_CHECKBOX_SIZE_DEFAULT,
height: Module712.modules.mobile.CONTROL_CHECKBOX_SIZE_DEFAULT,
flexGrow: 0,
flexShrink: 0,
alignItems: "center",
justifyContent: "center",
borderRadius: Module712.modules.mobile.CONTROL_CHECKBOX_BORDER_RADIUS,
borderWidth: Module712.modules.mobile.CONTROL_CHECKBOX_BORDER_WIDTH,
borderColor: Module712.colors.CHECKBOX_BORDER_DEFAULT
},
unselected: {
backgroundColor: Module712.colors.CHECKBOX_BACKGROUND_DEFAULT,
borderColor: Module712.colors.CHECKBOX_BORDER_DEFAULT
},
selected: {
borderColor: Module712.colors.CHECKBOX_BORDER_SELECTED_DEFAULT,
backgroundColor: Module712.colors.CHECKBOX_BACKGROUND_SELECTED_DEFAULT
},
checkmark: {
tintColor: Module712.colors.CHECKBOX_ICON_ACTIVE
}
});
const AnimatedComponent = ReanimatedRexport.createAnimatedComponent(Icon);
const __initData = {
code: "function FormCheckboxNativeTsx1(){const{withSpring,checked,selected,unselected,SUBTLE_SPRING}=this.__closure;const defaultAnimation={borderColor:withSpring(checked?selected.borderColor:unselected.borderColor,SUBTLE_SPRING,'animate-always'),backgroundColor:withSpring(checked?selected.backgroundColor:unselected.backgroundColor,SUBTLE_SPRING,'animate-always')};return defaultAnimation;}"
};
const __initData2 = {
code: "function FormCheckboxNativeTsx2(){const{useReducedMotion,withSpring,checked,SUBTLE_SPRING}=this.__closure;const uncheckedScale=useReducedMotion?1:0.5;return{opacity:withSpring(checked?1:0,SUBTLE_SPRING,'animate-always'),transform:[{scale:withSpring(checked?1:uncheckedScale,SUBTLE_SPRING)}]};}"
};
export function FormCheckbox(props) {
let enabled, checked2;
const checked3 = props.checked;
const r9 = MobileVisualRefreshExperiment("FormCheckbox");
const styles = useStyles();
const enabled2 = useContext(AccessibilityPreferencesContext).reducedMotion.enabled;
const checked = checked3;
const styles2 = useStyles();
const { selected, unselected } = styles2;
const _ = function _() {
return {
borderColor: _spring.withSpring(checked ? selected.borderColor : unselected.borderColor, _springPresets.SUBTLE_SPRING, "animate-always"),
backgroundColor: _spring.withSpring(checked ? selected.backgroundColor : unselected.backgroundColor, _springPresets.SUBTLE_SPRING, "animate-always")
};
};
_.__closure = {
withSpring: _spring.withSpring,
checked,
selected,
unselected,
SUBTLE_SPRING: _springPresets.SUBTLE_SPRING
};
_.__workletHash = 11278373524374;
_.__initData = __initData;
const animatedStyle = useAnimatedStyle(_);
enabled = enabled2;
checked2 = checked;
const c = function c() {
const r1 = enabled ? 1 : 0.5;
return {
opacity: _spring.withSpring(checked2 ? 1 : 0, _springPresets.SUBTLE_SPRING, "animate-always"),
transform: [{
scale: _spring.withSpring(checked2 ? 1 : r1, _springPresets.SUBTLE_SPRING)
}]
};
};
c.__closure = {
useReducedMotion: enabled,
withSpring: _spring.withSpring,
checked,
SUBTLE_SPRING: _springPresets.SUBTLE_SPRING
};
c.__workletHash = 13939484082835;
c.__initData = __initData2;
return <ReanimatedRexport.View style={[styles.checkbox, animatedStyle]}>
<AnimatedComponent source={Module5557} size={r9 ? Icon.Sizes.SMALL_20 : Icon.Sizes.SMALL} style={[styles.checkmark, useAnimatedStyle(c)]} />
</ReanimatedRexport.View>;
}
design/components/Forms/native/FormRadio.native.tsx
+123
View File
@@ -0,0 +1,123 @@
// Metro module 7656 (f7657).
import { useContext, useEffect } from "react";
import { createStyles } from "../../Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import { AccessibilityPreferencesContext } from "../../../../_bundle/Module3908";
import ReanimatedRexport, { useSharedValue, useDerivedValue, useAnimatedStyle } from "../../../../modules/reanimated/ReanimatedRexport";
import * as _spring from "../../../animation/reanimated/spring/spring";
import * as _springPresets from "../../../animation/reanimated/spring/springPresets";
let __initData, __initData2, __initData3, __initData4;
const useStyles = createStyles(() => {
const CONTROL_RADIO_ICON_SIZE_DEFAULT = Module712.modules.mobile.CONTROL_RADIO_ICON_SIZE_DEFAULT;
const CONTROL_RADIO_ICON_DOT_SIZE_DEFAULT = Module712.modules.mobile.CONTROL_RADIO_ICON_DOT_SIZE_DEFAULT;
return {
radio: {
width: CONTROL_RADIO_ICON_SIZE_DEFAULT,
height: CONTROL_RADIO_ICON_SIZE_DEFAULT,
flexGrow: 0,
flexShrink: 0,
alignItems: "center",
justifyContent: "center",
borderRadius: Module712.radii.round,
borderWidth: Module712.modules.mobile.CONTROL_RADIO_ICON_BORDER_WIDTH,
borderColor: Module712.colors.RADIO_BORDER_DEFAULT
},
unselected: {
backgroundColor: "transparent",
borderColor: Module712.colors.RADIO_BORDER_DEFAULT
},
selected: {
borderColor: Module712.colors.REDESIGN_INPUT_CONTROL_SELECTED,
backgroundColor: Module712.colors.REDESIGN_INPUT_CONTROL_SELECTED
},
dot: {
width: CONTROL_RADIO_ICON_DOT_SIZE_DEFAULT,
height: CONTROL_RADIO_ICON_DOT_SIZE_DEFAULT,
backgroundColor: Module712.colors.WHITE,
borderRadius: Module712.radii.round
}
};
});
__initData = {
code: "function FormRadioNativeTsx1(){const{withSpring,selectedShared,selectedStyles,unselectedStyles,SUBTLE_SPRING}=this.__closure;return withSpring(selectedShared.get()?selectedStyles.borderColor:unselectedStyles.borderColor,SUBTLE_SPRING,'animate-always');}"
};
__initData2 = {
code: "function FormRadioNativeTsx2(){const{withSpring,selectedShared,selectedStyles,unselectedStyles,SUBTLE_SPRING}=this.__closure;return withSpring(selectedShared.get()?selectedStyles.backgroundColor:unselectedStyles.backgroundColor,SUBTLE_SPRING,'animate-always');}"
};
__initData3 = {
code: "function FormRadioNativeTsx3(){const{borderColor,backgroundColor}=this.__closure;return{borderColor:borderColor.get(),backgroundColor:backgroundColor.get()};}"
};
__initData4 = {
code: "function FormRadioNativeTsx4(){const{useReducedMotion,withSpring,selected,SUBTLE_SPRING}=this.__closure;const unselectedScale=useReducedMotion?1:0.5;return{opacity:withSpring(selected?1:0,SUBTLE_SPRING,'animate-always'),transform:[{scale:withSpring(selected?1:unselectedScale,SUBTLE_SPRING)}]};}"
};
export function FormRadio(props) {
let derivedValue, derivedValue2;
let enabled, selected3;
const selected4 = props.selected;
const styles = useStyles();
const enabled2 = useContext(AccessibilityPreferencesContext).reducedMotion.enabled;
const selected = selected4;
derivedValue = void 0;
derivedValue2 = void 0;
const styles2 = useStyles();
const { selected: selected2, unselected } = styles2;
const sharedValue = useSharedValue(selected);
useEffect(() => {
sharedValue.set(selected);
}, [selected, sharedValue]);
const T = () => _spring.withSpring(sharedValue.get() ? selected2.borderColor : unselected.borderColor, _springPresets.SUBTLE_SPRING, "animate-always");
T.__closure = {
withSpring: _spring.withSpring,
selectedShared: sharedValue,
selectedStyles: selected2,
unselectedStyles: unselected,
SUBTLE_SPRING: _springPresets.SUBTLE_SPRING
};
T.__workletHash = 12275577765341;
T.__initData = __initData;
derivedValue = useDerivedValue(T);
const C = () => _spring.withSpring(sharedValue.get() ? selected2.backgroundColor : unselected.backgroundColor, _springPresets.SUBTLE_SPRING, "animate-always");
C.__closure = {
withSpring: _spring.withSpring,
selectedShared: sharedValue,
selectedStyles: selected2,
unselectedStyles: unselected,
SUBTLE_SPRING: _springPresets.SUBTLE_SPRING
};
C.__workletHash = 7732795836606;
C.__initData = __initData2;
derivedValue2 = useDerivedValue(C);
const b = () => ({
borderColor: derivedValue.get(),
backgroundColor: derivedValue2.get()
});
b.__closure = {
borderColor: derivedValue,
backgroundColor: derivedValue2
};
b.__workletHash = 5670342272321;
b.__initData = __initData3;
const animatedStyle = useAnimatedStyle(b);
enabled = enabled2;
selected3 = selected;
const r68 = function() {
const r1 = enabled ? 1 : 0.5;
return {
opacity: _spring.withSpring(selected3 ? 1 : 0, _springPresets.SUBTLE_SPRING, "animate-always"),
transform: [{
scale: _spring.withSpring(selected3 ? 1 : r1, _springPresets.SUBTLE_SPRING)
}]
};
};
r68.__closure = {
useReducedMotion: enabled,
withSpring: _spring.withSpring,
selected,
SUBTLE_SPRING: _springPresets.SUBTLE_SPRING
};
r68.__workletHash = 15209729079449;
r68.__initData = __initData4;
return <ReanimatedRexport.View style={[styles.radio, animatedStyle]}>
<ReanimatedRexport.View style={[styles.dot, useAnimatedStyle(r68)]} />
</ReanimatedRexport.View>;
}
design/components/Forms/native/FormSwitch.native.tsx
+239
View File
@@ -0,0 +1,239 @@
// Metro module 5556 (f5557).
import _slicedToArray from "../../../../_bundle/_slicedToArray";
import { useContext, useState, useEffect } from "react";
import { Pressable } from "react-native";
import ReanimatedRexport, { useAnimatedStyle } from "../../../../modules/reanimated/ReanimatedRexport";
import { createStyles } from "../../Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import Icon from "../../../void/Icon/native/Icon";
import { AccessibilityPreferencesContext } from "../../../../_bundle/Module3908";
import MobileVisualRefreshExperiment from "../../../../modules/themes/experiments/MobileVisualRefreshExperiment";
import * as _spring from "../../../animation/reanimated/spring/spring";
import * as _springPresets from "../../../animation/reanimated/spring/springPresets";
import { useToken } from "../../../tokens/native/useToken";
import Module5557 from "../../../../_bundle/Module5557";
import Module5558 from "../../../../_bundle/Module5558";
import { triggerHapticFeedback } from "../../../../modules/haptics/HapticUtils.native";
import HapticFeedbackTypes from "../../../../modules/haptics/HapticFeedbackTypes";
function $mk104510($env) {
return function n() {
const r4 = $env;
const r6 = $env.$parent;
const r1 = r6[2] ? 1 : r6[3] ? r4[0] : r4[1];
const r12 = $env.$parent.$parent;
const r9 = r12[0];
const r13 = r12[2];
return {
opacity: r9(r13[10]).withSpring(r6[3] ? r4[0] : r4[1], r9(r13[11]).SUBTLE_SPRING, "animate-always"),
transform: [{
scale: r9(r13[10]).withSpring(r1, r9(r13[11]).SUBTLE_SPRING)
}]
};
};
}
let env3421 = {};
const Component2 = ReanimatedRexport.createAnimatedComponent(Pressable);
const useStyles = createStyles({
switch: {
width: Module712.modules.mobile.CONTROL_SWITCH_WIDTH,
height: Module712.modules.mobile.CONTROL_SWITCH_HEIGHT,
padding: Module712.space.PX_4 - 1,
flexGrow: 0,
flexShrink: 0,
borderRadius: Module712.radii.lg,
borderWidth: 1
},
unselectedBackground: {
tintColor: Module712.colors.SWITCH_BACKGROUND_DEFAULT,
borderColor: Module712.colors.SWITCH_BORDER_DEFAULT
},
unselectedIcon: {
tintColor: Module712.colors.SWITCH_THUMB_ICON_DEFAULT
},
selectedIcon: {
tintColor: Module712.colors.SWITCH_THUMB_ICON_ACTIVE
},
selected: {
tintColor: Module712.colors.SWITCH_BACKGROUND_SELECTED_DEFAULT,
borderColor: Module712.colors.SWITCH_BORDER_SELECTED_DEFAULT
},
knob: {
height: Module712.modules.mobile.CONTROL_SWITCH_KNOB_SIZE,
width: Module712.modules.mobile.CONTROL_SWITCH_KNOB_SIZE,
alignItems: "center",
justifyContent: "center",
borderRadius: Module712.radii.round
}
});
const Component = ReanimatedRexport.createAnimatedComponent(Icon);
const c3421_9 = {
code: "function FormSwitchNativeTsx1(){const{withSpring,checked,selected,unselectedBackground,SUBTLE_SPRING}=this.__closure;return{backgroundColor:withSpring(checked?selected.tintColor:unselectedBackground.tintColor,SUBTLE_SPRING,'animate-always'),borderColor:withSpring(checked?selected.borderColor:unselectedBackground.borderColor,SUBTLE_SPRING,'animate-always')};}"
};
const c3421_10 = {
code: "function FormSwitchNativeTsx2(){const{withSpring,checked,knobCheckedLeft,SUBTLE_SPRING,knobSelectedBackgroundColor,knobBackgroundColor}=this.__closure;return{left:withSpring(checked?knobCheckedLeft:0,SUBTLE_SPRING,'animate-always'),backgroundColor:withSpring(checked?knobSelectedBackgroundColor:knobBackgroundColor,SUBTLE_SPRING,'animate-always')};}"
};
const c3421_11 = {
code: "function FormSwitchNativeTsx3(){const{useReducedMotion,checked,on,off,withSpring,SUBTLE_SPRING}=this.__closure;const scale=useReducedMotion?1:checked?on:off;return{opacity:withSpring(checked?on:off,SUBTLE_SPRING,'animate-always'),transform:[{scale:withSpring(scale,SUBTLE_SPRING)}]};}"
};
export function FormSwitch(props) {
let r138;
let env14922;
let env14923;
let env14924;
const r13 = env14922 = {
$parent: env3421
};
const { disabled, value } = props;
env14922[0] = value;
env14922[1] = props.onValueChange;
const { accessibilityLabel, accessibilityHint } = props;
const r18 = props["aria-hidden"];
const context = useContext(AccessibilityPreferencesContext);
const enabled = context.reducedMotion.enabled;
env14922[2] = enabled;
const switchIconsEnabled = context.switchIconsEnabled;
const r37 = _slicedToArray(useState(value), 2);
const checked = r37[0];
env14922[3] = checked;
env14922[4] = r37[1];
useEffect(() => {
(0, env14922[4])(env14922[0]);
}, [value]);
const r22 = MobileVisualRefreshExperiment("FormSwitch");
env14922[5] = r22;
const styles = useStyles();
const selected = styles.selected;
env14922[6] = selected;
const unselectedBackground = styles.unselectedBackground;
env14922[7] = unselectedBackground;
const G = () => {
const r3 = env14922[3];
return {
backgroundColor: _spring.withSpring(r3 ? env14922[6].tintColor : env14922[7].tintColor, _springPresets.SUBTLE_SPRING, "animate-always"),
borderColor: _spring.withSpring(r3 ? env14922[6].borderColor : env14922[7].borderColor, _springPresets.SUBTLE_SPRING, "animate-always")
};
};
G.__closure = {
withSpring: _spring.withSpring,
checked,
selected,
unselectedBackground,
SUBTLE_SPRING: _springPresets.SUBTLE_SPRING
};
G.__workletHash = 2232234503354;
G.__initData = c3421_9;
const animatedStyle = useAnimatedStyle(G);
const token = useToken(Module712.modules.mobile.CONTROL_SWITCH_KNOB_CHECKED_OFFSET);
env14922[8] = token;
const token2 = useToken(Module712.colors.SWITCH_THUMB_BACKGROUND_DEFAULT);
env14922[9] = token2;
const token3 = useToken(Module712.colors.SWITCH_THUMB_BACKGROUND_SELECTED_DEFAULT);
env14922[10] = token3;
const f = () => {
const r3 = env14922[3];
return {
left: _spring.withSpring(r3 ? env14922[8] : 0, _springPresets.SUBTLE_SPRING, "animate-always"),
backgroundColor: _spring.withSpring(r3 ? env14922[10] : env14922[9], _springPresets.SUBTLE_SPRING, "animate-always")
};
};
f.__closure = {
withSpring: _spring.withSpring,
checked,
knobCheckedLeft: token,
SUBTLE_SPRING: _springPresets.SUBTLE_SPRING,
knobSelectedBackgroundColor: token3,
knobBackgroundColor: token2
};
f.__workletHash = 3687946563898;
f.__initData = c3421_10;
const animatedStyle2 = useAnimatedStyle(f);
const r97 = env14923 = {
$parent: r13
};
env14923[0] = 1;
env14923[1] = 0;
const r101 = $mk104510(r97);
r101.__closure = {
useReducedMotion: enabled,
checked,
on: 1,
off: 0,
withSpring: _spring.withSpring,
SUBTLE_SPRING: _springPresets.SUBTLE_SPRING
};
r101.__workletHash = 14329332652102;
const __initData = c3421_11;
r101.__initData = __initData;
const animatedStyle3 = useAnimatedStyle(r101);
const r112 = env14924 = {
$parent: r13
};
env14924[0] = 0;
env14924[1] = 1;
const r116 = $mk104510(r112);
r116.__closure = {
useReducedMotion: enabled,
checked,
on: 0,
off: 1,
withSpring: _spring.withSpring,
SUBTLE_SPRING: _springPresets.SUBTLE_SPRING
};
r116.__workletHash = 14329332652102;
r116.__initData = __initData;
const animatedStyle4 = useAnimatedStyle(r116);
const r125 = r22 && !switchIconsEnabled;
let r126 = null;
if (!r125) {
const r129 = {
source: null,
size: null,
style: null
};
if (checked) {
r129.source = Module5557;
r129.size = r22 ? Icon.Sizes.SMALL_20 : Icon.Sizes.SMALL;
r129.style = [styles.selectedIcon, animatedStyle3];
r138 = r129;
} else {
r129.source = Module5558;
r129.size = Icon.Sizes.SMALL;
r129.style = [styles.unselectedIcon, animatedStyle4];
r138 = r129;
}
r126 = <Component {...r138} />;
}
return <Component2 style={[styles.switch, animatedStyle]} onPress={() => {
if (env14922[5]) {
if (env14922[0]) {
triggerHapticFeedback(HapticFeedbackTypes.TOGGLE_OFF);
} else {
triggerHapticFeedback(HapticFeedbackTypes.TOGGLE_ON);
}
}
const r19 = env14922[1];
if (r19 != null) {
r19(!env14922[0]);
}
}} disabled={disabled} accessible aria-hidden={r18} accessibilityRole="switch" accessibilityLabel={accessibilityLabel} accessibilityHint={accessibilityHint} accessibilityState={{
disabled,
checked
}} onAccessibilityTap={function onAccessibilityTap() {
if (env14922[5]) {
if (env14922[0]) {
triggerHapticFeedback(HapticFeedbackTypes.TOGGLE_OFF);
} else {
triggerHapticFeedback(HapticFeedbackTypes.TOGGLE_ON);
}
}
(0, env14922[4])(!env14922[0]);
setTimeout(() => {
const r2 = env14922[1];
if (r2 != null) {
r2(!env14922[0]);
}
});
}}>
<ReanimatedRexport.View style={[styles.knob, animatedStyle2]}>{r126}</ReanimatedRexport.View>
</Component2>;
}
design/components/Graphic/native/Graphic.native.tsx
+49
View File
@@ -0,0 +1,49 @@
// Metro module 6658 (f6659).
import { useMemo } from "react";
import { View } from "react-native";
import { createStyles } from "../../Styles/native/createStyles";
import FastImage from "../../../../components_native/common/FastImage";
import { isImage } from "../../../../_bundle/Module3901";
import { isRive } from "../../../../_bundle/Module3999";
let c4260_6, useStyles, RiveGraphic;
const ImageGraphic = function ImageGraphic(props) {
return <FastImage source={props.src} style={useStyles().image} resizeMode="contain" accessibilityElementsHidden />;
};
RiveGraphic = function RiveGraphic(props) {
const { rive: Rive, riveProps = {} } = props;
const styles = useStyles();
return <View style={styles.image}>
<Rive {...riveProps} style={styles.image} />
</View>;
};
c4260_6 = {
"21/9": 2.3333333333333335,
"16/9": 1.7777777777777777,
"6/4": 1.5,
"2/1": 2,
"1/1": 1
};
useStyles = createStyles({
container: {
width: "100%",
justifyContent: "center",
alignItems: "center",
overflow: "hidden"
},
image: {
width: "100%",
height: "100%"
}
});
export function Graphic(props) {
const { aspectRatio = "16/9", style, ...rest } = props;
let c15818_0 = rest;
return <View style={[useStyles().container, {
aspectRatio: c4260_6[aspectRatio]
}, style]}>
{useMemo(() => {
const props = c15818_0;
return isImage(props) ? <ImageGraphic {...props} /> : isRive(props) ? <RiveGraphic {...props} /> : null;
}, [rest])}
</View>;
}
design/components/Icon/IconSize.tsx
+10
View File
@@ -0,0 +1,10 @@
// Metro module 5564 (f5565).
export const ICON_SIZE = {
xxs: 12,
xs: 16,
sm: 18,
md: 24,
lg: 32,
custom: void 0,
refresh_sm: 20
};
design/components/Icon/native/BaseIconImage.tsx
+42
View File
@@ -0,0 +1,42 @@
// Metro module 3892 (f3893).
import { Image as Image2 } from "react-native";
import { useToken } from "../../../tokens/native/useToken";
let c2211_4 = {
xxs: {
width: 12,
height: 12
},
xs: {
width: 16,
height: 16
},
sm: {
width: 18,
height: 18
},
md: {
width: 24,
height: 24
},
lg: {
width: 32,
height: 32
},
custom: {
width: void 0,
height: void 0
},
refresh_sm: {
width: 18,
height: 18
}
};
export function BaseIconImage(props) {
const { source, size = "md", color, resizeMode, style, accessible, accessibilityLabel } = props;
const token = useToken(color);
return <Image2 fadeDuration={0} source={source} resizeMode={resizeMode} style={[c2211_4[size], token != null ? {
tintColor: token
} : color != null && typeof color === "string" ? {
tintColor: color
} : void 0, style]} accessible={accessible} accessibilityLabel={accessibilityLabel} />;
}
design/components/Icon/native/ClipView.tsx
+74
View File
@@ -0,0 +1,74 @@
// Metro module 7970 (f7971).
import { View, StyleSheet } from "react-native";
import { useCutoutBackgroundColor } from "./CutoutBackgroundContext";
import Module7973 from "../../../../_bundle/Module7973";
import ReanimatedRexport from "../../../../modules/reanimated/ReanimatedRexport";
let c5036_6, cutouts, SolidCutoutOverlay, styles;
const SolidCutout = function SolidCutout(props) {
const { backgroundColor: backgroundColor2, cutout } = props;
const style = [styles.solidCutout];
if (cutout.shape === c5036_6.Circle) {
style.push({
backgroundColor: backgroundColor2,
borderRadius: cutout.size / 2,
height: cutout.size,
width: cutout.size,
left: cutout.x,
top: cutout.y
});
} else {
style.push({
backgroundColor: backgroundColor2,
borderRadius: cutout.cornerRadius,
height: cutout.height,
width: cutout.width,
left: cutout.x,
top: cutout.y
});
if (cutout.rotationDegrees != null) {
style.push({
transform: [{
rotate: `${cutout.rotationDegrees}deg`
}]
});
}
}
return <View style={style} />;
};
SolidCutoutOverlay = function SolidCutoutOverlay(props) {
const backgroundColor = props.backgroundColor;
return <View pointerEvents="none" style={styles.solidCutoutContainer}>
{props.cutouts.map((a0, index) => <SolidCutout key={index} backgroundColor={backgroundColor} cutout={a0} />)}
</View>;
};
c5036_6 = {
Circle: "circle",
RoundedRect: "rounded-rect"
};
cutouts = [];
styles = StyleSheet.create({
solidCutoutContainer: {
...StyleSheet.absoluteFillObject
},
solidCutout: {
position: "absolute"
}
});
const AnimatedComponent = ReanimatedRexport.createAnimatedComponent(Module7973);
export default function ClipView(props) {
const { children, cutouts: cutouts2, style, ...props2 } = props;
const cutoutBackgroundColor = useCutoutBackgroundColor();
const r1 = cutoutBackgroundColor != null;
let r24 = null;
let cutouts3 = cutouts2;
if (r1) {
r24 = cutouts2 != null && cutouts2.length > 0 ? <SolidCutoutOverlay backgroundColor={cutoutBackgroundColor} cutouts={cutouts2} /> : null;
cutouts3 = cutouts;
}
return <Module7973 {...props2} cutouts={cutouts3} style={style}>
{children}
{r24}
</Module7973>;
};
export { AnimatedComponent as ClipViewAnimated };
export { c5036_6 as CutoutShape };
design/components/Icon/native/CutoutBackgroundContext.tsx
+32
View File
@@ -0,0 +1,32 @@
// Metro module 7971 (f7972).
import { createContext, useContext } from "react";
import Module689 from "../../../../_bundle/Module689";
import { flattenColorOverOpaqueBackground } from "../../../utils/shared/colors";
import Module712 from "../../../../_bundle/Module712";
import { useToken } from "../../../tokens/native/useToken";
const context = createContext(void 0);
export function useCutoutBackgroundColor() {
return useContext(context);
}
export function CutoutBackgroundProvider(props) {
let value;
const { backgroundColor, children } = props;
const context2 = useContext(context);
const token = useToken(Module712.internal.isSemanticColor(backgroundColor) ? backgroundColor : void 0);
const r25 = backgroundColor !== null ? typeof backgroundColor === "string" ? backgroundColor : token : null;
L12: {
if (r25 != null) {
value = Module689(r25).alpha() !== 1 ? context2 != null ? flattenColorOverOpaqueBackground(r25, context2) : void 0 : r25;
} else {
if (r25 === void 0) {
value = context2;
if (value != null) {
break L12;
}
}
r25 == null;
value = void 0;
}
}
return <context.Provider value={value}>{children}</context.Provider>;
}
design/components/Icon/native/redesign/generated/AccessibilityIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 14343 (f14344).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module14344 from "../../../../../../_bundle/Module14344";
export function AccessibilityIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module14344} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/AchievementsIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 13650 (f13651).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module13651 from "../../../../../../_bundle/Module13651";
export function AchievementsIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module13651} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/AnalyticsIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 9616 (f9617).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module9617 from "../../../../../../_bundle/Module9617";
export function AnalyticsIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module9617} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/AnnouncementsIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 4708 (f4709).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module4657 from "../../../../../../_bundle/Module4657";
export function AnnouncementsIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module4657} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/AnnouncementsLockIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 4707 (f4708).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module4684 from "../../../../../../_bundle/Module4684";
export function AnnouncementsLockIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module4684} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/AnnouncementsSpoilerIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 4706 (f4707).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module4668 from "../../../../../../_bundle/Module4668";
export function AnnouncementsSpoilerIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module4668} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/AnnouncementsWarningIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 4705 (f4706).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module4667 from "../../../../../../_bundle/Module4667";
export function AnnouncementsWarningIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module4667} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/AppleNeutralIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 11932 (f11933).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module11933 from "../../../../../../_bundle/Module11933";
export function AppleNeutralIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module11933} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/AppsIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 6613 (f6614).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module6614 from "../../../../../../_bundle/Module6614";
export function AppsIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module6614} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/ArrowAngleLeftUpIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 9973 (f9974).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module9974 from "../../../../../../_bundle/Module9974";
export function ArrowAngleLeftUpIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module9974} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/ArrowAngleRightUpIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 9902 (f9903).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module9903 from "../../../../../../_bundle/Module9903";
export function ArrowAngleRightUpIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module9903} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/ArrowLargeLeftIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 5147 (f5148).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module5148 from "../../../../../../_bundle/Module5148";
export function ArrowLargeLeftIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module5148} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/ArrowSmallDownIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 14836 (f14837).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module14837 from "../../../../../../_bundle/Module14837";
export function ArrowSmallDownIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module14837} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/ArrowSmallLeftIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 10019 (f10020).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module10020 from "../../../../../../_bundle/Module10020";
export function ArrowSmallLeftIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module10020} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/ArrowSmallRightIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 10194 (f10195).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module10195 from "../../../../../../_bundle/Module10195";
export function ArrowSmallRightIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module10195} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/ArrowSmallUpIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 14082 (f14083).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module14083 from "../../../../../../_bundle/Module14083";
export function ArrowSmallUpIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module14083} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/ArrowsUpDownIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 11328 (f11329).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module11329 from "../../../../../../_bundle/Module11329";
export function ArrowsUpDownIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module11329} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/AtIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 4704 (f4705).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module4656 from "../../../../../../_bundle/Module4656";
export function AtIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module4656} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/AttachmentIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 9677 (f9678).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module9678 from "../../../../../../_bundle/Module9678";
export function AttachmentIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module9678} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BackspaceIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 9449 (f9450).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module9450 from "../../../../../../_bundle/Module9450";
export function BackspaceIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module9450} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BattlenetNeutralIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 8501 (f8502).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module8502 from "../../../../../../_bundle/Module8502";
export function BattlenetNeutralIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module8502} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BeakerIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 13644 (f13645).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module13645 from "../../../../../../_bundle/Module13645";
export function BeakerIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module13645} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BellIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 10229 (f10230).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module7732 from "../../../../../../_bundle/Module7732";
export function BellIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module7732} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BellSlashIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 10227 (f10228).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module10228 from "../../../../../../_bundle/Module10228";
export function BellSlashIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module10228} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BellZIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 14974 (f14975).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module14975 from "../../../../../../_bundle/Module14975";
export function BellZIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module14975} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BicycleIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 9437 (f9438).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module9438 from "../../../../../../_bundle/Module9438";
export function BicycleIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module9438} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BillIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 11313 (f11314).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module11314 from "../../../../../../_bundle/Module11314";
export function BillIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module11314} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BlueskyNeutralIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 11935 (f11936).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module11936 from "../../../../../../_bundle/Module11936";
export function BlueskyNeutralIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module11936} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BookCheckIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 4690 (f4691).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module4679 from "../../../../../../_bundle/Module4679";
export function BookCheckIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module4679} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BookmarkIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 9955 (f9956).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module9956 from "../../../../../../_bundle/Module9956";
export function BookmarkIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module9956} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BookmarkOutlineIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 9985 (f9986).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module9986 from "../../../../../../_bundle/Module9986";
export function BookmarkOutlineIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module9986} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BoostGemIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 6618 (f6619).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module6619 from "../../../../../../_bundle/Module6619";
export function BoostGemIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module6619} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BoostGemOutlineIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 16408 (f16409).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module16409 from "../../../../../../_bundle/Module16409";
export function BoostGemOutlineIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module16409} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BoostGemSlashIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 11676 (f11677).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module11677 from "../../../../../../_bundle/Module11677";
export function BoostGemSlashIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module11677} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BoostTier1Icon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 11674 (f11675).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module11675 from "../../../../../../_bundle/Module11675";
export function BoostTier1Icon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module11675} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BoostTier2Icon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 15184 (f15185).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module15185 from "../../../../../../_bundle/Module15185";
export function BoostTier2Icon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module15185} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BoostTier3Icon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 12555 (f12556).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module12556 from "../../../../../../_bundle/Module12556";
export function BoostTier3Icon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module12556} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BugIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 14539 (f14540).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module14540 from "../../../../../../_bundle/Module14540";
export function BugIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module14540} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/BurgerIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 13664 (f13665).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module13665 from "../../../../../../_bundle/Module13665";
export function BurgerIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module13665} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/CalendarIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 8327 (f8328).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module8328 from "../../../../../../_bundle/Module8328";
export function CalendarIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module8328} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/CalendarMinusIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 15468 (f15469).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module15469 from "../../../../../../_bundle/Module15469";
export function CalendarMinusIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module15469} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/CalendarPlusIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 15470 (f15471).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module15471 from "../../../../../../_bundle/Module15471";
export function CalendarPlusIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module15471} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/CameraIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 9691 (f9692).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module9692 from "../../../../../../_bundle/Module9692";
export function CameraIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module9692} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/CarIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 13656 (f13657).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module13657 from "../../../../../../_bundle/Module13657";
export function CarIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module13657} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/ChannelListIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 16355 (f16356).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module16356 from "../../../../../../_bundle/Module16356";
export function ChannelListIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module16356} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/ChannelListMagnifyingGlassIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 12983 (f12984).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module12984 from "../../../../../../_bundle/Module12984";
export function ChannelListMagnifyingGlassIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module12984} color={color} style={style} {...rest} />;
}
design/components/Icon/native/redesign/generated/ChannelNotificationIcon.tsx
+8
View File
@@ -0,0 +1,8 @@
// Metro module 10230 (f10231).
import Module712 from "../../../../../../_bundle/Module712";
import { BaseIconImage } from "../../BaseIconImage";
import * as _Module10231 from "../../../../../../_bundle/Module10231";
export function ChannelNotificationIcon(props) {
const { style, color = Module712.colors.INTERACTIVE_ICON_DEFAULT, ...rest } = props;
return <BaseIconImage source={_Module10231} color={color} style={style} {...rest} />;
}
Loaded 100 of 33051 files, more files were not shown because too many files have changed in this diff. Show more