@tuwaio/nova-connect 1.0.0-fix-test-alpha.57.ba01e3f → 1.0.0-fix-test-alpha.58.f75b213

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.cts CHANGED
@@ -1470,7 +1470,7 @@ type StatusIconCustomization = {
1470
1470
  reduceMotion?: boolean;
1471
1471
  };
1472
1472
  };
1473
- interface StatusIconProps extends Omit<HTMLMotionProps<'div'>, 'children' | 'initial' | 'animate' | 'exit' | 'variants' | 'transition'> {
1473
+ interface StatusIconProps$1 extends Omit<HTMLMotionProps<'div'>, 'children' | 'initial' | 'animate' | 'exit' | 'variants' | 'transition'> {
1474
1474
  /** Transaction status type */
1475
1475
  txStatus: 'succeed' | 'failed' | 'replaced';
1476
1476
  /** Color variable name (without --tuwa- prefix) */
@@ -1538,7 +1538,7 @@ interface StatusIconProps extends Omit<HTMLMotionProps<'div'>, 'children' | 'ini
1538
1538
  * </StatusIcon>
1539
1539
  * ```
1540
1540
  */
1541
- declare const StatusIcon: React$1.ForwardRefExoticComponent<Omit<StatusIconProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
1541
+ declare const StatusIcon: React$1.ForwardRefExoticComponent<Omit<StatusIconProps$1, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
1542
1542
 
1543
1543
  /**
1544
1544
  * @file ConnectedContent component displays wallet connection status with transaction monitoring and comprehensive customization options.
@@ -3596,7 +3596,7 @@ type BackButtonProps = {
3596
3596
  className?: string;
3597
3597
  style?: React__default.CSSProperties;
3598
3598
  };
3599
- type TitleProps$2 = {
3599
+ type TitleProps$4 = {
3600
3600
  title: string;
3601
3601
  className?: string;
3602
3602
  style?: React__default.CSSProperties;
@@ -3653,7 +3653,7 @@ type ConnectedModalCustomization = {
3653
3653
  /** Custom back button component */
3654
3654
  BackButton?: ComponentType<BackButtonProps>;
3655
3655
  /** Custom title component */
3656
- Title?: ComponentType<TitleProps$2>;
3656
+ Title?: ComponentType<TitleProps$4>;
3657
3657
  /** Custom close button component */
3658
3658
  CloseButton?: ComponentType<CloseButtonProps>;
3659
3659
  /** Custom main content component */
@@ -4145,18 +4145,343 @@ interface AboutWalletsProps {
4145
4145
  declare const AboutWallets: React__default.ForwardRefExoticComponent<AboutWalletsProps & React__default.RefAttributes<HTMLElement>>;
4146
4146
 
4147
4147
  /**
4148
- * Props for the NetworkIcons component
4148
+ * @file ConnectCard component with comprehensive customization options for wallet connection cards.
4149
4149
  */
4150
- interface NetworkIconsProps {
4151
- /** Array of network adapters to display as icons */
4150
+
4151
+ /**
4152
+ * Network data for display
4153
+ */
4154
+ interface NetworkData$1 {
4155
+ /** Network adapter */
4156
+ adapter: OrbitAdapter;
4157
+ /** Chain ID for icon display */
4158
+ chainId?: number | string;
4159
+ /** Network display name */
4160
+ name?: string;
4161
+ /** Network index in list */
4162
+ index: number;
4163
+ }
4164
+ /**
4165
+ * Connect card data
4166
+ */
4167
+ interface ConnectCardData {
4168
+ /** Primary title/name */
4169
+ title: string;
4170
+ /** Optional subtitle */
4171
+ subtitle?: string;
4172
+ /** Whether card is recent */
4173
+ isRecent: boolean;
4174
+ /** Whether touch device */
4175
+ isTouch: boolean;
4176
+ /** Info link URL */
4177
+ infoLink?: string;
4178
+ /** Network adapters */
4152
4179
  adapters?: OrbitAdapter[];
4153
- /** Whether only one network is available */
4180
+ /** Whether only one network */
4154
4181
  isOnlyOneNetwork?: boolean;
4182
+ /** Network count for overflow */
4183
+ networkCount: number;
4184
+ /** Visible networks */
4185
+ visibleNetworks: NetworkData$1[];
4186
+ /** Overflow count */
4187
+ overflowCount: number;
4155
4188
  }
4189
+ type NetworkIconsContainerProps = {
4190
+ className?: string;
4191
+ style?: React__default.CSSProperties;
4192
+ children: React__default.ReactNode;
4193
+ role?: string;
4194
+ 'aria-label'?: string;
4195
+ cardData: ConnectCardData;
4196
+ } & React__default.RefAttributes<HTMLDivElement>;
4197
+ type NetworkIconProps$1 = {
4198
+ className?: string;
4199
+ style?: React__default.CSSProperties;
4200
+ children: React__default.ReactNode;
4201
+ role?: string;
4202
+ 'aria-label'?: string;
4203
+ networkData: NetworkData$1;
4204
+ cardData: ConnectCardData;
4205
+ } & React__default.RefAttributes<HTMLDivElement>;
4206
+ type NetworkOverflowProps = {
4207
+ className?: string;
4208
+ style?: React__default.CSSProperties;
4209
+ children: React__default.ReactNode;
4210
+ role?: string;
4211
+ 'aria-label'?: string;
4212
+ overflowCount: number;
4213
+ cardData: ConnectCardData;
4214
+ } & React__default.RefAttributes<HTMLDivElement>;
4215
+ /**
4216
+ * NetworkIcons customization options
4217
+ */
4218
+ type NetworkIconsCustomization = {
4219
+ /** Custom components */
4220
+ components?: {
4221
+ /** Custom container wrapper */
4222
+ Container?: ComponentType<NetworkIconsContainerProps>;
4223
+ /** Custom network icon */
4224
+ NetworkIcon?: ComponentType<NetworkIconProps$1>;
4225
+ /** Custom overflow indicator */
4226
+ OverflowIndicator?: ComponentType<NetworkOverflowProps>;
4227
+ };
4228
+ /** Custom class name generators */
4229
+ classNames?: {
4230
+ /** Function to generate container classes */
4231
+ container?: (params: {
4232
+ cardData: ConnectCardData;
4233
+ }) => string;
4234
+ /** Function to generate network icon classes */
4235
+ networkIcon?: (params: {
4236
+ networkData: NetworkData$1;
4237
+ cardData: ConnectCardData;
4238
+ }) => string;
4239
+ /** Function to generate overflow indicator classes */
4240
+ overflowIndicator?: (params: {
4241
+ overflowCount: number;
4242
+ cardData: ConnectCardData;
4243
+ }) => string;
4244
+ };
4245
+ /** Custom style generators */
4246
+ styles?: {
4247
+ /** Function to generate container styles */
4248
+ container?: (params: {
4249
+ cardData: ConnectCardData;
4250
+ }) => React__default.CSSProperties;
4251
+ /** Function to generate network icon styles */
4252
+ networkIcon?: (params: {
4253
+ networkData: NetworkData$1;
4254
+ cardData: ConnectCardData;
4255
+ }) => React__default.CSSProperties;
4256
+ /** Function to generate overflow indicator styles */
4257
+ overflowIndicator?: (params: {
4258
+ overflowCount: number;
4259
+ cardData: ConnectCardData;
4260
+ }) => React__default.CSSProperties;
4261
+ };
4262
+ };
4263
+ type CardContainerProps = {
4264
+ className?: string;
4265
+ style?: React__default.CSSProperties;
4266
+ children: React__default.ReactNode;
4267
+ type?: 'button';
4268
+ onClick?: () => void;
4269
+ 'aria-label'?: string;
4270
+ 'aria-describedby'?: string;
4271
+ cardData: ConnectCardData;
4272
+ } & React__default.RefAttributes<HTMLButtonElement>;
4273
+ type CardContentProps = {
4274
+ className?: string;
4275
+ style?: React__default.CSSProperties;
4276
+ children: React__default.ReactNode;
4277
+ cardData: ConnectCardData;
4278
+ } & React__default.RefAttributes<HTMLDivElement>;
4279
+ type IconContainerProps$1 = {
4280
+ className?: string;
4281
+ style?: React__default.CSSProperties;
4282
+ children: React__default.ReactNode;
4283
+ role?: string;
4284
+ 'aria-label'?: string;
4285
+ cardData: ConnectCardData;
4286
+ } & React__default.RefAttributes<HTMLDivElement>;
4287
+ type IconWrapperProps = {
4288
+ className?: string;
4289
+ style?: React__default.CSSProperties;
4290
+ children: React__default.ReactNode;
4291
+ cardData: ConnectCardData;
4292
+ } & React__default.RefAttributes<HTMLDivElement>;
4293
+ type TextContainerProps = {
4294
+ className?: string;
4295
+ style?: React__default.CSSProperties;
4296
+ children: React__default.ReactNode;
4297
+ cardData: ConnectCardData;
4298
+ } & React__default.RefAttributes<HTMLDivElement>;
4299
+ type TitleProps$3 = {
4300
+ className?: string;
4301
+ style?: React__default.CSSProperties;
4302
+ children: React__default.ReactNode;
4303
+ role?: string;
4304
+ 'aria-level'?: number;
4305
+ cardData: ConnectCardData;
4306
+ } & React__default.RefAttributes<HTMLSpanElement>;
4307
+ type SubtitleProps = {
4308
+ className?: string;
4309
+ style?: React__default.CSSProperties;
4310
+ children: React__default.ReactNode;
4311
+ id?: string;
4312
+ role?: string;
4313
+ cardData: ConnectCardData;
4314
+ } & React__default.RefAttributes<HTMLSpanElement>;
4315
+ type InfoLinkProps = {
4316
+ className?: string;
4317
+ style?: React__default.CSSProperties;
4318
+ children: React__default.ReactNode;
4319
+ onClick?: (e: React__default.MouseEvent) => void;
4320
+ href?: string;
4321
+ target?: string;
4322
+ rel?: string;
4323
+ 'aria-label'?: string;
4324
+ cardData: ConnectCardData;
4325
+ } & React__default.RefAttributes<HTMLAnchorElement>;
4326
+ type RecentBadgeWrapperProps = {
4327
+ className?: string;
4328
+ style?: React__default.CSSProperties;
4329
+ children: React__default.ReactNode;
4330
+ 'aria-label'?: string;
4331
+ cardData: ConnectCardData;
4332
+ } & React__default.RefAttributes<HTMLDivElement>;
4333
+ type ChevronProps = {
4334
+ className?: string;
4335
+ style?: React__default.CSSProperties;
4336
+ children: React__default.ReactNode;
4337
+ 'aria-hidden'?: boolean;
4338
+ cardData: ConnectCardData;
4339
+ } & React__default.RefAttributes<HTMLDivElement>;
4340
+ /**
4341
+ * ConnectCard customization options
4342
+ */
4343
+ type ConnectCardCustomization = {
4344
+ /** Custom components */
4345
+ components?: {
4346
+ /** Custom card container */
4347
+ Container?: ComponentType<CardContainerProps>;
4348
+ /** Custom card content */
4349
+ Content?: ComponentType<CardContentProps>;
4350
+ /** Custom icon container */
4351
+ IconContainer?: ComponentType<IconContainerProps$1>;
4352
+ /** Custom icon wrapper */
4353
+ IconWrapper?: ComponentType<IconWrapperProps>;
4354
+ /** Custom text container */
4355
+ TextContainer?: ComponentType<TextContainerProps>;
4356
+ /** Custom title */
4357
+ Title?: ComponentType<TitleProps$3>;
4358
+ /** Custom subtitle */
4359
+ Subtitle?: ComponentType<SubtitleProps>;
4360
+ /** Custom info link */
4361
+ InfoLink?: ComponentType<InfoLinkProps>;
4362
+ /** Custom recent badge wrapper */
4363
+ RecentBadgeWrapper?: ComponentType<RecentBadgeWrapperProps>;
4364
+ /** Custom chevron */
4365
+ Chevron?: ComponentType<ChevronProps>;
4366
+ };
4367
+ /** Custom class name generators */
4368
+ classNames?: {
4369
+ /** Function to generate container classes */
4370
+ container?: (params: {
4371
+ cardData: ConnectCardData;
4372
+ }) => string;
4373
+ /** Function to generate content classes */
4374
+ content?: (params: {
4375
+ cardData: ConnectCardData;
4376
+ }) => string;
4377
+ /** Function to generate icon container classes */
4378
+ iconContainer?: (params: {
4379
+ cardData: ConnectCardData;
4380
+ }) => string;
4381
+ /** Function to generate icon wrapper classes */
4382
+ iconWrapper?: (params: {
4383
+ cardData: ConnectCardData;
4384
+ }) => string;
4385
+ /** Function to generate text container classes */
4386
+ textContainer?: (params: {
4387
+ cardData: ConnectCardData;
4388
+ }) => string;
4389
+ /** Function to generate title classes */
4390
+ title?: (params: {
4391
+ cardData: ConnectCardData;
4392
+ }) => string;
4393
+ /** Function to generate subtitle classes */
4394
+ subtitle?: (params: {
4395
+ cardData: ConnectCardData;
4396
+ }) => string;
4397
+ /** Function to generate info link classes */
4398
+ infoLink?: (params: {
4399
+ cardData: ConnectCardData;
4400
+ }) => string;
4401
+ /** Function to generate recent badge wrapper classes */
4402
+ recentBadgeWrapper?: (params: {
4403
+ cardData: ConnectCardData;
4404
+ }) => string;
4405
+ /** Function to generate chevron classes */
4406
+ chevron?: (params: {
4407
+ cardData: ConnectCardData;
4408
+ }) => string;
4409
+ };
4410
+ /** Custom style generators */
4411
+ styles?: {
4412
+ /** Function to generate container styles */
4413
+ container?: (params: {
4414
+ cardData: ConnectCardData;
4415
+ }) => React__default.CSSProperties;
4416
+ /** Function to generate content styles */
4417
+ content?: (params: {
4418
+ cardData: ConnectCardData;
4419
+ }) => React__default.CSSProperties;
4420
+ /** Function to generate icon container styles */
4421
+ iconContainer?: (params: {
4422
+ cardData: ConnectCardData;
4423
+ }) => React__default.CSSProperties;
4424
+ /** Function to generate icon wrapper styles */
4425
+ iconWrapper?: (params: {
4426
+ cardData: ConnectCardData;
4427
+ }) => React__default.CSSProperties;
4428
+ /** Function to generate text container styles */
4429
+ textContainer?: (params: {
4430
+ cardData: ConnectCardData;
4431
+ }) => React__default.CSSProperties;
4432
+ /** Function to generate title styles */
4433
+ title?: (params: {
4434
+ cardData: ConnectCardData;
4435
+ }) => React__default.CSSProperties;
4436
+ /** Function to generate subtitle styles */
4437
+ subtitle?: (params: {
4438
+ cardData: ConnectCardData;
4439
+ }) => React__default.CSSProperties;
4440
+ /** Function to generate info link styles */
4441
+ infoLink?: (params: {
4442
+ cardData: ConnectCardData;
4443
+ }) => React__default.CSSProperties;
4444
+ /** Function to generate recent badge wrapper styles */
4445
+ recentBadgeWrapper?: (params: {
4446
+ cardData: ConnectCardData;
4447
+ }) => React__default.CSSProperties;
4448
+ /** Function to generate chevron styles */
4449
+ chevron?: (params: {
4450
+ cardData: ConnectCardData;
4451
+ }) => React__default.CSSProperties;
4452
+ };
4453
+ /** Custom event handlers */
4454
+ handlers?: {
4455
+ /** Custom click handler */
4456
+ onClick?: (cardData: ConnectCardData, originalHandler: () => void) => void;
4457
+ /** Custom info link click handler */
4458
+ onInfoClick?: (cardData: ConnectCardData, event: React__default.MouseEvent) => void;
4459
+ /** Custom hover handler */
4460
+ onHover?: (cardData: ConnectCardData, isHovering: boolean) => void;
4461
+ };
4462
+ /** Configuration options */
4463
+ config?: {
4464
+ /** Custom ARIA labels */
4465
+ ariaLabels?: {
4466
+ card?: (cardData: ConnectCardData) => string;
4467
+ icon?: (cardData: ConnectCardData) => string;
4468
+ infoLink?: (cardData: ConnectCardData) => string;
4469
+ recentBadge?: (cardData: ConnectCardData) => string;
4470
+ };
4471
+ /** Custom animation settings */
4472
+ animation?: {
4473
+ hoverScale?: string;
4474
+ transitionDuration?: string;
4475
+ chevronTransform?: string;
4476
+ };
4477
+ };
4478
+ /** NetworkIcons customization */
4479
+ networkIcons?: NetworkIconsCustomization;
4480
+ };
4156
4481
  /**
4157
4482
  * Props for the ConnectCard component
4158
4483
  */
4159
- interface ConnectCardProps extends NetworkIconsProps {
4484
+ interface ConnectCardProps {
4160
4485
  /** Click handler for the connect card */
4161
4486
  onClick: () => void;
4162
4487
  /** Icon element to display for the wallet/connector */
@@ -4169,9 +4494,17 @@ interface ConnectCardProps extends NetworkIconsProps {
4169
4494
  infoLink?: string;
4170
4495
  /** Whether this connector was recently used */
4171
4496
  isRecent?: boolean;
4497
+ /** Array of network adapters to display as icons */
4498
+ adapters?: OrbitAdapter[];
4499
+ /** Whether only one network is available */
4500
+ isOnlyOneNetwork?: boolean;
4501
+ /** Custom CSS classes for styling the container */
4502
+ className?: string;
4503
+ /** Customization options */
4504
+ customization?: ConnectCardCustomization;
4172
4505
  }
4173
4506
  /**
4174
- * ConnectCard component - Interactive card for wallet connection options
4507
+ * ConnectCard component - Interactive card for wallet connection options with comprehensive customization
4175
4508
  *
4176
4509
  * This component provides a clickable card interface for wallet connectors with:
4177
4510
  * - Responsive design adapting to touch/mouse interfaces
@@ -4181,32 +4514,9 @@ interface ConnectCardProps extends NetworkIconsProps {
4181
4514
  * - Hover animations and visual feedback
4182
4515
  * - Full accessibility support with ARIA labels
4183
4516
  * - Keyboard navigation support
4517
+ * - Complete customization of all child components and styling
4184
4518
  *
4185
- * Visual features:
4186
- * - Touch devices: Square card layout optimized for mobile interaction
4187
- * - Mouse devices: Horizontal card layout with hover animations
4188
- * - Dynamic network icons display up to 3 supported networks
4189
- * - Smooth hover transitions with scale and color changes
4190
- * - Recent badge with fade-out on hover
4191
- *
4192
- * Accessibility features:
4193
- * - Proper ARIA labels for screen readers
4194
- * - Role attributes for semantic structure
4195
- * - Keyboard navigation support
4196
- * - Focus management with visual indicators
4197
- * - Screen reader announcements for state changes
4198
- *
4199
- * @param onClick - Handler function called when card is clicked
4200
- * @param title - Primary display name for the wallet/connector
4201
- * @param icon - React element containing the wallet icon
4202
- * @param adapters - Array of supported network adapters
4203
- * @param infoLink - Optional URL for additional information
4204
- * @param subtitle - Optional secondary description text
4205
- * @param isRecent - Whether to show recent usage badge
4206
- * @param isOnlyOneNetwork - Whether only one network is available
4207
- * @returns JSX element representing the interactive connect card
4208
- *
4209
- * @example
4519
+ * @example Basic usage
4210
4520
  * ```tsx
4211
4521
  * <ConnectCard
4212
4522
  * onClick={() => connect('metamask')}
@@ -4219,21 +4529,32 @@ interface ConnectCardProps extends NetworkIconsProps {
4219
4529
  * />
4220
4530
  * ```
4221
4531
  *
4222
- * @example
4532
+ * @example With full customization
4223
4533
  * ```tsx
4224
- * // Touch device optimized card
4225
4534
  * <ConnectCard
4226
4535
  * onClick={() => connect('walletconnect')}
4227
4536
  * title="WalletConnect"
4228
4537
  * icon={<WalletConnectIcon />}
4229
4538
  * adapters={[ethereum, polygon]}
4230
- * isOnlyOneNetwork={false}
4539
+ * customization={{
4540
+ * components: {
4541
+ * Container: CustomCardContainer,
4542
+ * Title: CustomTitle
4543
+ * },
4544
+ * classNames: {
4545
+ * container: ({ cardData }) => cardData.isTouch ? 'touch-card' : 'desktop-card'
4546
+ * },
4547
+ * handlers: {
4548
+ * onClick: (cardData, originalHandler) => {
4549
+ * analytics.track('card_clicked', { title: cardData.title });
4550
+ * originalHandler();
4551
+ * }
4552
+ * }
4553
+ * }}
4231
4554
  * />
4232
4555
  * ```
4233
- *
4234
- * @public
4235
4556
  */
4236
- declare function ConnectCard({ onClick, title, icon, adapters, infoLink, subtitle, isRecent, isOnlyOneNetwork, }: ConnectCardProps): react_jsx_runtime.JSX.Element;
4557
+ declare const ConnectCard: React__default.NamedExoticComponent<ConnectCardProps & React__default.RefAttributes<HTMLButtonElement>>;
4237
4558
 
4238
4559
  /**
4239
4560
  * Interface for grouped wallet connectors
@@ -4251,9 +4572,264 @@ interface GroupedConnector$1 {
4251
4572
  })[];
4252
4573
  }
4253
4574
 
4575
+ /**
4576
+ * @file Connecting component with comprehensive customization options and connection status display.
4577
+ */
4578
+
4579
+ /**
4580
+ * Connection states
4581
+ */
4582
+ type ConnectionState = 'connecting' | 'success' | 'error';
4583
+ /**
4584
+ * Connection status data
4585
+ */
4586
+ interface ConnectingStatusData {
4587
+ /** Connection state */
4588
+ state: ConnectionState;
4589
+ /** Display message */
4590
+ message: string;
4591
+ /** Error message if any */
4592
+ errorMessage: string | null;
4593
+ /** Currently active connector */
4594
+ activeConnector: string | undefined;
4595
+ /** Selected adapter */
4596
+ selectedAdapter: OrbitAdapter | undefined;
4597
+ /** Current connector configuration */
4598
+ currentConnector: GroupedConnector$1 | null;
4599
+ /** Whether to show detailed error */
4600
+ showDetailedError: boolean;
4601
+ /** Raw error object */
4602
+ rawError: unknown;
4603
+ }
4604
+ type ContainerProps$6 = {
4605
+ className?: string;
4606
+ style?: React__default.CSSProperties;
4607
+ children: React__default.ReactNode;
4608
+ role?: string;
4609
+ 'aria-label'?: string;
4610
+ 'aria-live'?: 'polite' | 'assertive' | 'off';
4611
+ 'aria-atomic'?: boolean;
4612
+ statusData: ConnectingStatusData;
4613
+ } & React__default.RefAttributes<HTMLElement>;
4614
+ type StatusContainerProps = {
4615
+ className?: string;
4616
+ style?: React__default.CSSProperties;
4617
+ children: React__default.ReactNode;
4618
+ statusData: ConnectingStatusData;
4619
+ } & React__default.RefAttributes<HTMLDivElement>;
4620
+ type SpinnerProps = {
4621
+ className?: string;
4622
+ style?: React__default.CSSProperties;
4623
+ role?: string;
4624
+ 'aria-label'?: string;
4625
+ 'aria-describedby'?: string;
4626
+ statusData: ConnectingStatusData;
4627
+ } & React__default.RefAttributes<HTMLDivElement>;
4628
+ type StatusIconProps = {
4629
+ className?: string;
4630
+ style?: React__default.CSSProperties;
4631
+ role?: string;
4632
+ 'aria-label'?: string;
4633
+ statusData: ConnectingStatusData;
4634
+ } & React__default.RefAttributes<HTMLDivElement>;
4635
+ type WalletIconContainerProps = {
4636
+ className?: string;
4637
+ style?: React__default.CSSProperties;
4638
+ children: React__default.ReactNode;
4639
+ statusData: ConnectingStatusData;
4640
+ } & React__default.RefAttributes<HTMLDivElement>;
4641
+ type MessageContainerProps = {
4642
+ className?: string;
4643
+ style?: React__default.CSSProperties;
4644
+ children: React__default.ReactNode;
4645
+ statusData: ConnectingStatusData;
4646
+ } & React__default.RefAttributes<HTMLDivElement>;
4647
+ type StatusMessageProps = {
4648
+ className?: string;
4649
+ style?: React__default.CSSProperties;
4650
+ children: React__default.ReactNode;
4651
+ id?: string;
4652
+ role?: string;
4653
+ 'aria-level'?: number;
4654
+ statusData: ConnectingStatusData;
4655
+ } & React__default.RefAttributes<HTMLHeadingElement>;
4656
+ type ErrorMessageProps$2 = {
4657
+ className?: string;
4658
+ style?: React__default.CSSProperties;
4659
+ children: React__default.ReactNode;
4660
+ role?: string;
4661
+ 'aria-describedby'?: string;
4662
+ statusData: ConnectingStatusData;
4663
+ } & React__default.RefAttributes<HTMLParagraphElement>;
4664
+ type ErrorDetailsProps = {
4665
+ className?: string;
4666
+ style?: React__default.CSSProperties;
4667
+ children: React__default.ReactNode;
4668
+ statusData: ConnectingStatusData;
4669
+ } & React__default.RefAttributes<HTMLDetailsElement>;
4670
+ type LoadingPlaceholderProps = {
4671
+ className?: string;
4672
+ style?: React__default.CSSProperties;
4673
+ role?: string;
4674
+ 'aria-label'?: string;
4675
+ statusData: ConnectingStatusData;
4676
+ } & React__default.RefAttributes<HTMLDivElement>;
4677
+ /**
4678
+ * Customization options for Connecting component
4679
+ */
4680
+ type ConnectingCustomization = {
4681
+ /** Custom components */
4682
+ components?: {
4683
+ /** Custom container wrapper */
4684
+ Container?: ComponentType<ContainerProps$6>;
4685
+ /** Custom status container */
4686
+ StatusContainer?: ComponentType<StatusContainerProps>;
4687
+ /** Custom loading spinner */
4688
+ Spinner?: ComponentType<SpinnerProps>;
4689
+ /** Custom status icon */
4690
+ StatusIcon?: ComponentType<StatusIconProps>;
4691
+ /** Custom wallet icon container */
4692
+ WalletIconContainer?: ComponentType<WalletIconContainerProps>;
4693
+ /** Custom message container */
4694
+ MessageContainer?: ComponentType<MessageContainerProps>;
4695
+ /** Custom status message */
4696
+ StatusMessage?: ComponentType<StatusMessageProps>;
4697
+ /** Custom error message */
4698
+ ErrorMessage?: ComponentType<ErrorMessageProps$2>;
4699
+ /** Custom error details */
4700
+ ErrorDetails?: ComponentType<ErrorDetailsProps>;
4701
+ /** Custom loading placeholder */
4702
+ LoadingPlaceholder?: ComponentType<LoadingPlaceholderProps>;
4703
+ };
4704
+ /** Custom class name generators */
4705
+ classNames?: {
4706
+ /** Function to generate container classes */
4707
+ container?: (params: {
4708
+ statusData: ConnectingStatusData;
4709
+ }) => string;
4710
+ /** Function to generate status container classes */
4711
+ statusContainer?: (params: {
4712
+ statusData: ConnectingStatusData;
4713
+ }) => string;
4714
+ /** Function to generate spinner classes */
4715
+ spinner?: (params: {
4716
+ statusData: ConnectingStatusData;
4717
+ }) => string;
4718
+ /** Function to generate status icon classes */
4719
+ statusIcon?: (params: {
4720
+ statusData: ConnectingStatusData;
4721
+ }) => string;
4722
+ /** Function to generate wallet icon container classes */
4723
+ walletIconContainer?: (params: {
4724
+ statusData: ConnectingStatusData;
4725
+ }) => string;
4726
+ /** Function to generate message container classes */
4727
+ messageContainer?: (params: {
4728
+ statusData: ConnectingStatusData;
4729
+ }) => string;
4730
+ /** Function to generate status message classes */
4731
+ statusMessage?: (params: {
4732
+ statusData: ConnectingStatusData;
4733
+ }) => string;
4734
+ /** Function to generate error message classes */
4735
+ errorMessage?: (params: {
4736
+ statusData: ConnectingStatusData;
4737
+ }) => string;
4738
+ /** Function to generate error details classes */
4739
+ errorDetails?: (params: {
4740
+ statusData: ConnectingStatusData;
4741
+ }) => string;
4742
+ /** Function to generate loading placeholder classes */
4743
+ loadingPlaceholder?: (params: {
4744
+ statusData: ConnectingStatusData;
4745
+ }) => string;
4746
+ };
4747
+ /** Custom style generators */
4748
+ styles?: {
4749
+ /** Function to generate container styles */
4750
+ container?: (params: {
4751
+ statusData: ConnectingStatusData;
4752
+ }) => React__default.CSSProperties;
4753
+ /** Function to generate status container styles */
4754
+ statusContainer?: (params: {
4755
+ statusData: ConnectingStatusData;
4756
+ }) => React__default.CSSProperties;
4757
+ /** Function to generate spinner styles */
4758
+ spinner?: (params: {
4759
+ statusData: ConnectingStatusData;
4760
+ }) => React__default.CSSProperties;
4761
+ /** Function to generate status icon styles */
4762
+ statusIcon?: (params: {
4763
+ statusData: ConnectingStatusData;
4764
+ }) => React__default.CSSProperties;
4765
+ /** Function to generate wallet icon container styles */
4766
+ walletIconContainer?: (params: {
4767
+ statusData: ConnectingStatusData;
4768
+ }) => React__default.CSSProperties;
4769
+ /** Function to generate message container styles */
4770
+ messageContainer?: (params: {
4771
+ statusData: ConnectingStatusData;
4772
+ }) => React__default.CSSProperties;
4773
+ /** Function to generate status message styles */
4774
+ statusMessage?: (params: {
4775
+ statusData: ConnectingStatusData;
4776
+ }) => React__default.CSSProperties;
4777
+ /** Function to generate error message styles */
4778
+ errorMessage?: (params: {
4779
+ statusData: ConnectingStatusData;
4780
+ }) => React__default.CSSProperties;
4781
+ /** Function to generate error details styles */
4782
+ errorDetails?: (params: {
4783
+ statusData: ConnectingStatusData;
4784
+ }) => React__default.CSSProperties;
4785
+ /** Function to generate loading placeholder styles */
4786
+ loadingPlaceholder?: (params: {
4787
+ statusData: ConnectingStatusData;
4788
+ }) => React__default.CSSProperties;
4789
+ };
4790
+ /** Custom event handlers */
4791
+ handlers?: {
4792
+ /** Custom handler for state change */
4793
+ onStateChange?: (state: ConnectionState, statusData: ConnectingStatusData) => void;
4794
+ /** Custom handler for error occurrence */
4795
+ onError?: (error: unknown, statusData: ConnectingStatusData) => void;
4796
+ /** Custom handler for successful connection */
4797
+ onSuccess?: (statusData: ConnectingStatusData) => void;
4798
+ /** Custom handler for connection start */
4799
+ onConnectingStart?: (statusData: ConnectingStatusData) => void;
4800
+ /** Custom cleanup handler called on unmount */
4801
+ onCleanup?: (statusData: ConnectingStatusData) => void;
4802
+ };
4803
+ /** Configuration options */
4804
+ config?: {
4805
+ /** Custom ARIA labels */
4806
+ ariaLabels?: {
4807
+ container?: string;
4808
+ spinner?: string;
4809
+ successIcon?: string;
4810
+ errorIcon?: string;
4811
+ loading?: string;
4812
+ };
4813
+ /** Custom animation settings */
4814
+ animation?: {
4815
+ spinnerDuration?: string;
4816
+ transitionDuration?: string;
4817
+ };
4818
+ /** Custom icon settings */
4819
+ icons?: {
4820
+ showSuccessIcon?: boolean;
4821
+ showErrorIcon?: boolean;
4822
+ customSuccessIcon?: ComponentType<{
4823
+ className?: string;
4824
+ }>;
4825
+ customErrorIcon?: ComponentType<{
4826
+ className?: string;
4827
+ }>;
4828
+ };
4829
+ };
4830
+ };
4254
4831
  /**
4255
4832
  * Connection status component props interface
4256
- * Defines the required data for displaying wallet connection progress
4257
4833
  */
4258
4834
  interface ConnectingProps {
4259
4835
  /** Currently active connector identifier */
@@ -4268,6 +4844,10 @@ interface ConnectingProps {
4268
4844
  customErrorMessage?: string;
4269
4845
  /** Whether to show detailed error information */
4270
4846
  showDetailedError?: boolean;
4847
+ /** Custom CSS classes for styling the container */
4848
+ className?: string;
4849
+ /** Customization options */
4850
+ customization?: ConnectingCustomization;
4271
4851
  }
4272
4852
  /**
4273
4853
  * Connection status display component for wallet connection flow
@@ -4329,7 +4909,7 @@ interface ConnectingProps {
4329
4909
  *
4330
4910
  * @public
4331
4911
  */
4332
- declare function Connecting({ activeConnector, selectedAdapter, connectors, isConnected, customErrorMessage, showDetailedError, }: ConnectingProps): react_jsx_runtime.JSX.Element;
4912
+ declare const Connecting: React__default.NamedExoticComponent<ConnectingProps & React__default.RefAttributes<HTMLDivElement>>;
4333
4913
 
4334
4914
  /**
4335
4915
  * Props for the ConnectorsSelections component
@@ -4537,7 +5117,7 @@ declare function ConnectorsBlock({ selectedAdapter, connectors, solanaRPCUrls, a
4537
5117
  * Can be either a URL string for external links or a callback function
4538
5118
  */
4539
5119
  type ButtonAction = string | (() => void);
4540
- type ContainerProps$4 = {
5120
+ type ContainerProps$5 = {
4541
5121
  className?: string;
4542
5122
  style?: React__default.CSSProperties;
4543
5123
  children: React__default.ReactNode;
@@ -4554,7 +5134,7 @@ type ContentSectionProps$1 = {
4554
5134
  role?: string;
4555
5135
  'aria-labelledby'?: string;
4556
5136
  };
4557
- type TitleProps$1 = {
5137
+ type TitleProps$2 = {
4558
5138
  id: string;
4559
5139
  className?: string;
4560
5140
  style?: React__default.CSSProperties;
@@ -4606,11 +5186,11 @@ type DisclaimerCustomization = {
4606
5186
  /** Custom components */
4607
5187
  components?: {
4608
5188
  /** Custom container wrapper */
4609
- Container?: ComponentType<ContainerProps$4>;
5189
+ Container?: ComponentType<ContainerProps$5>;
4610
5190
  /** Custom content section */
4611
5191
  ContentSection?: ComponentType<ContentSectionProps$1>;
4612
5192
  /** Custom title component */
4613
- Title?: ComponentType<TitleProps$1>;
5193
+ Title?: ComponentType<TitleProps$2>;
4614
5194
  /** Custom description component */
4615
5195
  Description?: ComponentType<DescriptionProps$1>;
4616
5196
  /** Custom additional content wrapper */
@@ -4836,7 +5416,7 @@ interface WalletIconConfig {
4836
5416
  /** ARIA label for the wallet icon */
4837
5417
  ariaLabel?: string;
4838
5418
  }
4839
- type ContainerProps$3 = {
5419
+ type ContainerProps$4 = {
4840
5420
  className?: string;
4841
5421
  style?: React__default.CSSProperties;
4842
5422
  children: React__default.ReactNode;
@@ -4884,7 +5464,7 @@ type ContentSectionProps = {
4884
5464
  children: React__default.ReactNode;
4885
5465
  role?: string;
4886
5466
  };
4887
- type TitleProps = {
5467
+ type TitleProps$1 = {
4888
5468
  className?: string;
4889
5469
  style?: React__default.CSSProperties;
4890
5470
  children: React__default.ReactNode;
@@ -4909,7 +5489,7 @@ type GetWalletCustomization = {
4909
5489
  /** Custom components */
4910
5490
  components?: {
4911
5491
  /** Custom container wrapper */
4912
- Container?: ComponentType<ContainerProps$3>;
5492
+ Container?: ComponentType<ContainerProps$4>;
4913
5493
  /** Custom animation section */
4914
5494
  AnimationSection?: ComponentType<AnimationSectionProps>;
4915
5495
  /** Custom stars background */
@@ -4923,7 +5503,7 @@ type GetWalletCustomization = {
4923
5503
  /** Custom content section */
4924
5504
  ContentSection?: ComponentType<ContentSectionProps>;
4925
5505
  /** Custom title component */
4926
- Title?: ComponentType<TitleProps>;
5506
+ Title?: ComponentType<TitleProps$1>;
4927
5507
  /** Custom description component */
4928
5508
  Description?: ComponentType<DescriptionProps>;
4929
5509
  /** Custom screen reader component */
@@ -5117,7 +5697,7 @@ interface ValidationConfig {
5117
5697
  /** Custom validation function */
5118
5698
  customValidator?: (address: string) => string | null;
5119
5699
  }
5120
- type ContainerProps$2 = {
5700
+ type ContainerProps$3 = {
5121
5701
  className?: string;
5122
5702
  style?: React__default.CSSProperties;
5123
5703
  children: React__default.ReactNode;
@@ -5143,7 +5723,7 @@ type InputProps = {
5143
5723
  spellCheck?: boolean;
5144
5724
  hasError: boolean;
5145
5725
  } & React__default.RefAttributes<HTMLInputElement>;
5146
- type ErrorMessageProps = {
5726
+ type ErrorMessageProps$1 = {
5147
5727
  className?: string;
5148
5728
  style?: React__default.CSSProperties;
5149
5729
  children: React__default.ReactNode;
@@ -5158,13 +5738,13 @@ type ImpersonateFormCustomization = {
5158
5738
  /** Custom components */
5159
5739
  components?: {
5160
5740
  /** Custom container wrapper */
5161
- Container?: ComponentType<ContainerProps$2>;
5741
+ Container?: ComponentType<ContainerProps$3>;
5162
5742
  /** Custom label component */
5163
5743
  Label?: ComponentType<LabelProps>;
5164
5744
  /** Custom input component */
5165
5745
  Input?: ComponentType<InputProps>;
5166
5746
  /** Custom error message component */
5167
- ErrorMessage?: ComponentType<ErrorMessageProps>;
5747
+ ErrorMessage?: ComponentType<ErrorMessageProps$1>;
5168
5748
  };
5169
5749
  /** Custom class name generators */
5170
5750
  classNames?: {
@@ -5320,6 +5900,250 @@ interface ImpersonateFormProps extends Pick<ConnectButtonProps, 'store'> {
5320
5900
  */
5321
5901
  declare const ImpersonateForm: React__default.ForwardRefExoticComponent<ImpersonateFormProps & React__default.RefAttributes<HTMLDivElement>>;
5322
5902
 
5903
+ /**
5904
+ * @file NetworkSelections component with comprehensive customization options for network selection.
5905
+ */
5906
+
5907
+ /**
5908
+ * Network data for display
5909
+ */
5910
+ interface NetworkData {
5911
+ /** Network adapter */
5912
+ adapter: OrbitAdapter;
5913
+ /** Chain ID for icon display */
5914
+ chainId?: number | string;
5915
+ /** Network display name */
5916
+ name: string;
5917
+ /** Network info link URL */
5918
+ infoLink?: string;
5919
+ /** Network index in list */
5920
+ index: number;
5921
+ }
5922
+ /**
5923
+ * Network selections data for customization context
5924
+ */
5925
+ interface NetworkSelectionsData {
5926
+ /** Currently active connector name */
5927
+ activeConnector?: string;
5928
+ /** Available grouped connectors */
5929
+ connectors: GroupedConnector$1[];
5930
+ /** Whether device is touch-enabled */
5931
+ isTouch: boolean;
5932
+ /** Whether in error state */
5933
+ isError: boolean;
5934
+ /** Available networks */
5935
+ networks: NetworkData[];
5936
+ }
5937
+ type ContainerProps$2 = {
5938
+ className?: string;
5939
+ style?: React__default.CSSProperties;
5940
+ children: React__default.ReactNode;
5941
+ role?: string;
5942
+ 'aria-labelledby'?: string;
5943
+ selectionsData: NetworkSelectionsData;
5944
+ } & React__default.RefAttributes<HTMLDivElement>;
5945
+ type TitleProps = {
5946
+ className?: string;
5947
+ style?: React__default.CSSProperties;
5948
+ children: React__default.ReactNode;
5949
+ id?: string;
5950
+ role?: string;
5951
+ 'aria-level'?: number;
5952
+ selectionsData: NetworkSelectionsData;
5953
+ } & React__default.RefAttributes<HTMLHeadingElement>;
5954
+ type NetworkListProps = {
5955
+ className?: string;
5956
+ style?: React__default.CSSProperties;
5957
+ children: React__default.ReactNode;
5958
+ role?: string;
5959
+ 'aria-label'?: string;
5960
+ selectionsData: NetworkSelectionsData;
5961
+ } & React__default.RefAttributes<HTMLDivElement>;
5962
+ type NetworkItemProps = {
5963
+ className?: string;
5964
+ style?: React__default.CSSProperties;
5965
+ children: React__default.ReactNode;
5966
+ role?: string;
5967
+ networkData: NetworkData;
5968
+ selectionsData: NetworkSelectionsData;
5969
+ } & React__default.RefAttributes<HTMLDivElement>;
5970
+ type NetworkIconProps = {
5971
+ className?: string;
5972
+ style?: React__default.CSSProperties;
5973
+ children: React__default.ReactNode;
5974
+ role?: string;
5975
+ 'aria-label'?: string;
5976
+ networkData: NetworkData;
5977
+ selectionsData: NetworkSelectionsData;
5978
+ } & React__default.RefAttributes<HTMLDivElement>;
5979
+ type ErrorContainerProps = {
5980
+ className?: string;
5981
+ style?: React__default.CSSProperties;
5982
+ children: React__default.ReactNode;
5983
+ role?: string;
5984
+ 'aria-live'?: 'polite' | 'assertive';
5985
+ selectionsData: NetworkSelectionsData;
5986
+ } & React__default.RefAttributes<HTMLDivElement>;
5987
+ type ErrorIconProps = {
5988
+ className?: string;
5989
+ style?: React__default.CSSProperties;
5990
+ children: React__default.ReactNode;
5991
+ 'aria-hidden'?: boolean;
5992
+ selectionsData: NetworkSelectionsData;
5993
+ } & React__default.RefAttributes<HTMLDivElement>;
5994
+ type ErrorTitleProps = {
5995
+ className?: string;
5996
+ style?: React__default.CSSProperties;
5997
+ children: React__default.ReactNode;
5998
+ role?: string;
5999
+ 'aria-level'?: number;
6000
+ selectionsData: NetworkSelectionsData;
6001
+ } & React__default.RefAttributes<HTMLHeadingElement>;
6002
+ type ErrorMessageProps = {
6003
+ className?: string;
6004
+ style?: React__default.CSSProperties;
6005
+ children: React__default.ReactNode;
6006
+ role?: string;
6007
+ selectionsData: NetworkSelectionsData;
6008
+ } & React__default.RefAttributes<HTMLParagraphElement>;
6009
+ /**
6010
+ * NetworkSelections customization options
6011
+ */
6012
+ type NetworkSelectionsCustomization = {
6013
+ /** Custom components */
6014
+ components?: {
6015
+ /** Custom container wrapper */
6016
+ Container?: ComponentType<ContainerProps$2>;
6017
+ /** Custom title */
6018
+ Title?: ComponentType<TitleProps>;
6019
+ /** Custom network list */
6020
+ NetworkList?: ComponentType<NetworkListProps>;
6021
+ /** Custom network item wrapper */
6022
+ NetworkItem?: ComponentType<NetworkItemProps>;
6023
+ /** Custom network icon wrapper */
6024
+ NetworkIcon?: ComponentType<NetworkIconProps>;
6025
+ /** Custom error container */
6026
+ ErrorContainer?: ComponentType<ErrorContainerProps>;
6027
+ /** Custom error icon wrapper */
6028
+ ErrorIcon?: ComponentType<ErrorIconProps>;
6029
+ /** Custom error title */
6030
+ ErrorTitle?: ComponentType<ErrorTitleProps>;
6031
+ /** Custom error message */
6032
+ ErrorMessage?: ComponentType<ErrorMessageProps>;
6033
+ };
6034
+ /** Custom class name generators */
6035
+ classNames?: {
6036
+ /** Function to generate container classes */
6037
+ container?: (params: {
6038
+ selectionsData: NetworkSelectionsData;
6039
+ }) => string;
6040
+ /** Function to generate title classes */
6041
+ title?: (params: {
6042
+ selectionsData: NetworkSelectionsData;
6043
+ }) => string;
6044
+ /** Function to generate network list classes */
6045
+ networkList?: (params: {
6046
+ selectionsData: NetworkSelectionsData;
6047
+ }) => string;
6048
+ /** Function to generate network item classes */
6049
+ networkItem?: (params: {
6050
+ networkData: NetworkData;
6051
+ selectionsData: NetworkSelectionsData;
6052
+ }) => string;
6053
+ /** Function to generate network icon classes */
6054
+ networkIcon?: (params: {
6055
+ networkData: NetworkData;
6056
+ selectionsData: NetworkSelectionsData;
6057
+ }) => string;
6058
+ /** Function to generate error container classes */
6059
+ errorContainer?: (params: {
6060
+ selectionsData: NetworkSelectionsData;
6061
+ }) => string;
6062
+ /** Function to generate error icon classes */
6063
+ errorIcon?: (params: {
6064
+ selectionsData: NetworkSelectionsData;
6065
+ }) => string;
6066
+ /** Function to generate error title classes */
6067
+ errorTitle?: (params: {
6068
+ selectionsData: NetworkSelectionsData;
6069
+ }) => string;
6070
+ /** Function to generate error message classes */
6071
+ errorMessage?: (params: {
6072
+ selectionsData: NetworkSelectionsData;
6073
+ }) => string;
6074
+ };
6075
+ /** Custom style generators */
6076
+ styles?: {
6077
+ /** Function to generate container styles */
6078
+ container?: (params: {
6079
+ selectionsData: NetworkSelectionsData;
6080
+ }) => React__default.CSSProperties;
6081
+ /** Function to generate title styles */
6082
+ title?: (params: {
6083
+ selectionsData: NetworkSelectionsData;
6084
+ }) => React__default.CSSProperties;
6085
+ /** Function to generate network list styles */
6086
+ networkList?: (params: {
6087
+ selectionsData: NetworkSelectionsData;
6088
+ }) => React__default.CSSProperties;
6089
+ /** Function to generate network item styles */
6090
+ networkItem?: (params: {
6091
+ networkData: NetworkData;
6092
+ selectionsData: NetworkSelectionsData;
6093
+ }) => React__default.CSSProperties;
6094
+ /** Function to generate network icon styles */
6095
+ networkIcon?: (params: {
6096
+ networkData: NetworkData;
6097
+ selectionsData: NetworkSelectionsData;
6098
+ }) => React__default.CSSProperties;
6099
+ /** Function to generate error container styles */
6100
+ errorContainer?: (params: {
6101
+ selectionsData: NetworkSelectionsData;
6102
+ }) => React__default.CSSProperties;
6103
+ /** Function to generate error icon styles */
6104
+ errorIcon?: (params: {
6105
+ selectionsData: NetworkSelectionsData;
6106
+ }) => React__default.CSSProperties;
6107
+ /** Function to generate error title styles */
6108
+ errorTitle?: (params: {
6109
+ selectionsData: NetworkSelectionsData;
6110
+ }) => React__default.CSSProperties;
6111
+ /** Function to generate error message styles */
6112
+ errorMessage?: (params: {
6113
+ selectionsData: NetworkSelectionsData;
6114
+ }) => React__default.CSSProperties;
6115
+ };
6116
+ /** Custom event handlers */
6117
+ handlers?: {
6118
+ /** Custom network click handler */
6119
+ onNetworkClick?: (networkData: NetworkData, selectionsData: NetworkSelectionsData, originalHandler: (network: OrbitAdapter) => void) => void;
6120
+ /** Custom error retry handler */
6121
+ onErrorRetry?: (selectionsData: NetworkSelectionsData) => void;
6122
+ };
6123
+ /** Configuration options */
6124
+ config?: {
6125
+ /** Custom ARIA labels */
6126
+ ariaLabels?: {
6127
+ container?: (selectionsData: NetworkSelectionsData) => string;
6128
+ networkList?: (selectionsData: NetworkSelectionsData) => string;
6129
+ networkIcon?: (networkData: NetworkData) => string;
6130
+ errorContainer?: (selectionsData: NetworkSelectionsData) => string;
6131
+ };
6132
+ /** Custom scroll behavior */
6133
+ scroll?: {
6134
+ touchMaxHeight?: string;
6135
+ mouseMaxHeight?: string;
6136
+ gap?: {
6137
+ touch?: string;
6138
+ mouse?: string;
6139
+ };
6140
+ };
6141
+ };
6142
+ /** ConnectCard customization for network cards */
6143
+ connectCard?: ConnectCardCustomization;
6144
+ /** Disclaimer customization */
6145
+ disclaimer?: DisclaimerCustomization;
6146
+ };
5323
6147
  /**
5324
6148
  * Props for the NetworkSelections component
5325
6149
  */
@@ -5330,9 +6154,11 @@ interface NetworkSelectionsProps {
5330
6154
  connectors: GroupedConnector$1[];
5331
6155
  /** Click handler for network selection */
5332
6156
  onClick: (adapter: OrbitAdapter, walletType: WalletType) => Promise<void>;
6157
+ /** Customization options */
6158
+ customization?: NetworkSelectionsCustomization;
5333
6159
  }
5334
6160
  /**
5335
- * NetworkSelections component - Network/blockchain selection interface for multi-network wallets
6161
+ * NetworkSelections component - Network/blockchain selection interface for multi-network wallets with full customization
5336
6162
  *
5337
6163
  * This component provides a network selection interface when a wallet supports multiple blockchains:
5338
6164
  * - Visual network cards with blockchain icons and names
@@ -5341,6 +6167,7 @@ interface NetworkSelectionsProps {
5341
6167
  * - Educational content about blockchain networks
5342
6168
  * - Full accessibility support with semantic structure
5343
6169
  * - External documentation links for each network
6170
+ * - Complete customization of all child components and styling
5344
6171
  *
5345
6172
  * Use cases:
5346
6173
  * - Multi-network wallets (e.g., MetaMask supporting EVM chains)
@@ -5367,12 +6194,7 @@ interface NetworkSelectionsProps {
5367
6194
  * - Keyboard navigation support for all interactive elements
5368
6195
  * - Error announcements with live regions
5369
6196
  *
5370
- * @param activeConnector - Name of the currently selected wallet connector
5371
- * @param connectors - Array of available wallet connectors with supported networks
5372
- * @param onClick - Async handler for network selection with adapter and wallet type
5373
- * @returns JSX element representing the network selection interface
5374
- *
5375
- * @example
6197
+ * @example Basic usage
5376
6198
  * ```tsx
5377
6199
  * <NetworkSelections
5378
6200
  * activeConnector="metamask"
@@ -5383,23 +6205,32 @@ interface NetworkSelectionsProps {
5383
6205
  * />
5384
6206
  * ```
5385
6207
  *
5386
- * @example
6208
+ * @example With customization
5387
6209
  * ```tsx
5388
- * // For cross-chain wallet selection
5389
6210
  * <NetworkSelections
5390
6211
  * activeConnector="phantom"
5391
- * connectors={[{
5392
- * name: "Phantom",
5393
- * adapters: [OrbitAdapter.SOLANA, OrbitAdapter.EVM],
5394
- * connectors: phantomConnectors
5395
- * }]}
6212
+ * connectors={crossChainConnectors}
5396
6213
  * onClick={(adapter, type) => handleNetworkConnection(adapter, type)}
6214
+ * customization={{
6215
+ * components: {
6216
+ * Container: CustomNetworkContainer,
6217
+ * NetworkIcon: CustomNetworkIcon
6218
+ * },
6219
+ * classNames: {
6220
+ * networkList: ({ selectionsData }) =>
6221
+ * selectionsData.isTouch ? 'touch-network-list' : 'desktop-network-list'
6222
+ * },
6223
+ * handlers: {
6224
+ * onNetworkClick: (networkData, selectionsData, originalHandler) => {
6225
+ * analytics.track('network_selected', { network: networkData.name });
6226
+ * originalHandler(networkData.adapter);
6227
+ * }
6228
+ * }
6229
+ * }}
5397
6230
  * />
5398
6231
  * ```
5399
- *
5400
- * @public
5401
6232
  */
5402
- declare function NetworkSelections({ connectors, onClick, activeConnector }: NetworkSelectionsProps): react_jsx_runtime.JSX.Element;
6233
+ declare const NetworkSelections: React__default.NamedExoticComponent<NetworkSelectionsProps & React__default.RefAttributes<HTMLDivElement>>;
5403
6234
 
5404
6235
  /**
5405
6236
  * Parameters for retrieving chain lists based on wallet configuration.
@@ -6926,4 +7757,4 @@ declare function initializeBlockchainSupport(): Promise<InitializationResult>;
6926
7757
  */
6927
7758
  declare function isAdapterSupported(adapter: OrbitAdapter): Promise<boolean>;
6928
7759
 
6929
- export { AboutWallets, type AboutWalletsCustomization, type AboutWalletsProps, type AdapterInfo, type AdapterLoadStatus, type AllChainConfigs, type AllConnectors, type AllWallets, type AnimationConfig, type BadgeAnimationConfig, type BadgeGradientConfig, type BlockchainUtilities, type BlockchainUtilityResult, type ChainAdapter, type ChainIdentifierArray, ChainListRenderer, type ChainListRendererCustomization, type ChainListRendererProps, ChainSelector, type ChainSelectorCustomization, type ChainSelectorProps, type ChainTriggerButtonCustomization, ConnectButton, type ConnectButtonProps, ConnectCard, ConnectedContent, type ConnectedContentCustomization, type ConnectedContentProps, ConnectedModal, type ConnectedModalCustomization, ConnectedModalFooter, type ConnectedModalFooterCustomization, type ConnectedModalFooterProps, ConnectedModalMainContent, type ConnectedModalMainContentCustomization, type ConnectedModalMainContentProps, ConnectedModalNameAndBalance, type ConnectedModalNameAndBalanceCustomization, type ConnectedModalNameAndBalanceProps, type ConnectedModalProps, ConnectedModalTxHistory, type ConnectedModalTxHistoryCustomization, type ConnectedModalTxHistoryProps, Connecting, type Connector, ConnectorsBlock, ConnectorsSelections, type ConnectorsSelectionsProps, Disclaimer, type DisclaimerCustomization, type DisclaimerProps, GetWallet, type GetWalletCustomization, type GetWalletProps, type GroupedConnector, IconButton, type IconButtonCustomization, type IconButtonProps, ImpersonateForm, type ImpersonateFormCustomization, type ImpersonateFormProps, type InitialChains, type InitializationResult, NetworkSelections, type NetworkTabData, NetworkTabs, type NetworkTabsCustomization, type NetworkTabsProps, type NovaConnectLabels, RecentBadge, type RecentBadgeCustomization, type RecentBadgeProps, ScrollableChainList, type ScrollableChainListCustomization, type ScrollableChainListProps, SelectContentAnimated, type SelectContentAnimatedProps, StatusIcon, type StatusIconCustomization, type StatusIconProps, ToBottomButton, type ToBottomButtonCustomization, type ToBottomButtonProps, ToTopButton, type ToTopButtonCustomization, type ToTopButtonProps, ToastError, type ToastErrorCustomization, type ToastErrorProps, type ValidationConfig, WaitForConnectionContent, type WaitForConnectionContentCustomization, type WaitForConnectionContentProps, type Wallet, WalletAvatar, type WalletAvatarCustomization, type WalletAvatarProps, type WalletAvatarSize, WalletIcon, type WalletIconConfig, type WalletIconCustomization, type WalletIconProps$1 as WalletIconProps, defaultLabels, getAdapterStatus, getAllAdaptersStatus, getAvailableChainIds, getAvailableSolanaClusters, getAvailableSolanaClusters$1 as getAvailableSolanaClustersAsync, getBlockchainUtilities, getChainsListByWalletTypeSync as getChainsListByWalletType, getChainsListByWalletType as getChainsListByWalletTypeAsync, getChainsListByWalletTypeSync, getConnectChainId, getEvmUtils, getFilteredConnectors, getGroupedConnectors, getNetworkIcon, getSolanaUtils, getWalletChains, hasAvailableConnectors, hasConnectorsForAdapter, initializeBlockchainSupport, isAdapterSupported, isEvmChainListSync as isEvmChainList, isEvmChainList as isEvmChainListAsync, isEvmChainListSync, isSolanaChainListSync as isSolanaChainList, isSolanaChainList as isSolanaChainListAsync, isSolanaChainListSync, isValidSolanaCluster, isValidSolanaCluster$1 as isValidSolanaClusterAsync, networksLinks, preloadChainAdapters, ukrainianLabels };
7760
+ export { AboutWallets, type AboutWalletsCustomization, type AboutWalletsProps, type AdapterInfo, type AdapterLoadStatus, type AllChainConfigs, type AllConnectors, type AllWallets, type AnimationConfig, type BadgeAnimationConfig, type BadgeGradientConfig, type BlockchainUtilities, type BlockchainUtilityResult, type ChainAdapter, type ChainIdentifierArray, ChainListRenderer, type ChainListRendererCustomization, type ChainListRendererProps, ChainSelector, type ChainSelectorCustomization, type ChainSelectorProps, type ChainTriggerButtonCustomization, ConnectButton, type ConnectButtonProps, ConnectCard, type ConnectCardCustomization, type ConnectCardData, ConnectedContent, type ConnectedContentCustomization, type ConnectedContentProps, ConnectedModal, type ConnectedModalCustomization, ConnectedModalFooter, type ConnectedModalFooterCustomization, type ConnectedModalFooterProps, ConnectedModalMainContent, type ConnectedModalMainContentCustomization, type ConnectedModalMainContentProps, ConnectedModalNameAndBalance, type ConnectedModalNameAndBalanceCustomization, type ConnectedModalNameAndBalanceProps, type ConnectedModalProps, ConnectedModalTxHistory, type ConnectedModalTxHistoryCustomization, type ConnectedModalTxHistoryProps, Connecting, type ConnectingCustomization, type ConnectingProps, type ConnectingStatusData, type ConnectionState, type Connector, ConnectorsBlock, ConnectorsSelections, type ConnectorsSelectionsProps, Disclaimer, type DisclaimerCustomization, type DisclaimerProps, GetWallet, type GetWalletCustomization, type GetWalletProps, type GroupedConnector, IconButton, type IconButtonCustomization, type IconButtonProps, ImpersonateForm, type ImpersonateFormCustomization, type ImpersonateFormProps, type InitialChains, type InitializationResult, type NetworkIconsCustomization, NetworkSelections, type NetworkSelectionsCustomization, type NetworkSelectionsData, type NetworkTabData, NetworkTabs, type NetworkTabsCustomization, type NetworkTabsProps, type NovaConnectLabels, RecentBadge, type RecentBadgeCustomization, type RecentBadgeProps, ScrollableChainList, type ScrollableChainListCustomization, type ScrollableChainListProps, SelectContentAnimated, type SelectContentAnimatedProps, StatusIcon, type StatusIconCustomization, type StatusIconProps$1 as StatusIconProps, ToBottomButton, type ToBottomButtonCustomization, type ToBottomButtonProps, ToTopButton, type ToTopButtonCustomization, type ToTopButtonProps, ToastError, type ToastErrorCustomization, type ToastErrorProps, type ValidationConfig, WaitForConnectionContent, type WaitForConnectionContentCustomization, type WaitForConnectionContentProps, type Wallet, WalletAvatar, type WalletAvatarCustomization, type WalletAvatarProps, type WalletAvatarSize, WalletIcon, type WalletIconConfig, type WalletIconCustomization, type WalletIconProps$1 as WalletIconProps, defaultLabels, getAdapterStatus, getAllAdaptersStatus, getAvailableChainIds, getAvailableSolanaClusters, getAvailableSolanaClusters$1 as getAvailableSolanaClustersAsync, getBlockchainUtilities, getChainsListByWalletTypeSync as getChainsListByWalletType, getChainsListByWalletType as getChainsListByWalletTypeAsync, getChainsListByWalletTypeSync, getConnectChainId, getEvmUtils, getFilteredConnectors, getGroupedConnectors, getNetworkIcon, getSolanaUtils, getWalletChains, hasAvailableConnectors, hasConnectorsForAdapter, initializeBlockchainSupport, isAdapterSupported, isEvmChainListSync as isEvmChainList, isEvmChainList as isEvmChainListAsync, isEvmChainListSync, isSolanaChainListSync as isSolanaChainList, isSolanaChainList as isSolanaChainListAsync, isSolanaChainListSync, isValidSolanaCluster, isValidSolanaCluster$1 as isValidSolanaClusterAsync, networksLinks, preloadChainAdapters, ukrainianLabels };