@ammarkhalidfarooq/dashboard-package 0.3.7 → 0.3.9

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.es.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import React, { Suspense, lazy, useState, useEffect } from 'react';
2
- import { Box, Button, Menu, MenuItem, Grid, Card, CardContent, Typography, IconButton, ThemeProvider, CircularProgress, LinearProgress, Divider, TableContainer, Table, TableHead, TableRow, TableCell, TableBody, Avatar } from '@mui/material';
3
- import { MoreHoriz, PaidOutlined, Adjust, FavoriteOutlined, SearchOutlined, PeopleAltOutlined, HighlightOff, NearMe, Email, IndeterminateCheckBoxOutlined, NotInterested, InfoOutlined, MoreVert, Check, Settings, TrendingUp, TrendingDown, PersonOutlined } from '@mui/icons-material';
2
+ import { Box, Button, Menu, MenuItem, Grid, Card, CardContent, Typography, IconButton, ThemeProvider, CircularProgress, LinearProgress, TableContainer, Table, TableHead, TableRow, TableCell, TableBody, Avatar } from '@mui/material';
3
+ import { MoreHoriz, PaidOutlined, Adjust, FavoriteOutlined, SearchOutlined, PeopleAltOutlined, HighlightOff, NearMe, Email, IndeterminateCheckBoxOutlined, NotInterested, MoreVert, Check, InfoOutlined, Settings, TrendingUp, TrendingDown, PersonOutlined } from '@mui/icons-material';
4
4
  import { createTheme, useTheme } from '@mui/material/styles';
5
5
  import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
6
6
  import ReactApexChart from 'react-apexcharts';
@@ -1983,12 +1983,12 @@ var OrganicSection = function OrganicSection(_ref) {
1983
1983
  }), /*#__PURE__*/jsx(Grid, {
1984
1984
  item: true,
1985
1985
  xs: 12,
1986
- md: 8,
1986
+ md: 6,
1987
1987
  children: /*#__PURE__*/jsx(LandingPagesCard, {})
1988
1988
  }), /*#__PURE__*/jsx(Grid, {
1989
1989
  item: true,
1990
1990
  xs: 12,
1991
- md: 4,
1991
+ md: 6,
1992
1992
  children: /*#__PURE__*/jsx(DonorMixCard, {
1993
1993
  title: "Spend allocation",
1994
1994
  subtitle: "Where $80.3K went this month",
@@ -2546,7 +2546,8 @@ var PerformanceSection = function PerformanceSection(_ref) {
2546
2546
  return /*#__PURE__*/jsx(RenderChartCard, {
2547
2547
  item: item,
2548
2548
  index: index,
2549
- md: 6
2549
+ md: 6,
2550
+ isPremium: true
2550
2551
  });
2551
2552
  })
2552
2553
  }), /*#__PURE__*/jsx(Grid$1, {
@@ -2559,7 +2560,8 @@ var PerformanceSection = function PerformanceSection(_ref) {
2559
2560
  return /*#__PURE__*/jsx(RenderChartCard, {
2560
2561
  item: item,
2561
2562
  index: index,
2562
- md: 6
2563
+ md: 6,
2564
+ isPremium: true
2563
2565
  });
2564
2566
  })
2565
2567
  }), /*#__PURE__*/jsx(Grid$1, {
@@ -2572,7 +2574,8 @@ var PerformanceSection = function PerformanceSection(_ref) {
2572
2574
  return /*#__PURE__*/jsx(RenderChartCard, {
2573
2575
  item: item,
2574
2576
  index: index,
2575
- md: 6
2577
+ md: 6,
2578
+ isPremium: true
2576
2579
  });
2577
2580
  })
2578
2581
  }), /*#__PURE__*/jsx(Grid$1, {
@@ -2585,7 +2588,8 @@ var PerformanceSection = function PerformanceSection(_ref) {
2585
2588
  return /*#__PURE__*/jsx(RenderChartCard, {
2586
2589
  item: item,
2587
2590
  index: index,
2588
- md: 12
2591
+ md: 12,
2592
+ isPremium: true
2589
2593
  });
2590
2594
  })
2591
2595
  })]
@@ -2616,165 +2620,88 @@ var data$1 = [{
2616
2620
  var RecurringDonationAmounts = function RecurringDonationAmounts() {
2617
2621
  return /*#__PURE__*/jsx(Card, {
2618
2622
  sx: {
2619
- width: '100%',
2620
- display: 'flex',
2621
- flexDirection: 'column',
2622
- boxShadow: '0 4px 24px rgba(0,0,0,0.06)',
2623
+ width: "100%",
2624
+ display: "flex",
2625
+ flexDirection: "column",
2626
+ boxShadow: "0 4px 24px rgba(0,0,0,0.06)",
2623
2627
  borderRadius: 4,
2624
- border: '1px solid #f0f0f0',
2625
- height: '100%'
2628
+ border: "1px solid #f0f0f0",
2629
+ height: "100%"
2626
2630
  },
2627
2631
  children: /*#__PURE__*/jsxs(CardContent, {
2628
2632
  sx: {
2629
- p: 3,
2630
- '&:last-child': {
2631
- pb: 3
2632
- }
2633
+ p: 3
2633
2634
  },
2634
- children: [/*#__PURE__*/jsxs(Box, {
2635
+ children: [/*#__PURE__*/jsx(Typography, {
2636
+ variant: "subtitle2",
2635
2637
  sx: {
2636
- display: 'flex',
2637
- alignItems: 'center',
2638
- mb: 3
2638
+ color: "#000000",
2639
+ fontWeight: 700,
2640
+ fontSize: "16px",
2641
+ mb: 0.5,
2642
+ textAlign: "left"
2639
2643
  },
2640
- children: [/*#__PURE__*/jsx(Typography, {
2641
- variant: "subtitle2",
2642
- sx: {
2643
- fontWeight: 600,
2644
- color: '#000000',
2645
- textTransform: 'uppercase',
2646
- letterSpacing: '0.5px'
2647
- },
2648
- children: "Recurring donation amounts"
2649
- }), /*#__PURE__*/jsx(InfoOutlined, {
2650
- sx: {
2651
- ml: 1,
2652
- fontSize: '1rem',
2653
- color: '#9e9e9e'
2654
- }
2655
- })]
2656
- }), /*#__PURE__*/jsxs(Grid, {
2657
- container: true,
2644
+ children: "Recurring donation amounts"
2645
+ }), /*#__PURE__*/jsx(Typography, {
2658
2646
  sx: {
2659
- mb: 1,
2660
- px: 1
2647
+ color: "rgba(0, 0, 0, 0.4)",
2648
+ fontSize: "13px",
2649
+ mb: 3,
2650
+ textAlign: "left"
2661
2651
  },
2662
- children: [/*#__PURE__*/jsx(Grid, {
2663
- item: true,
2664
- xs: 4,
2665
- children: /*#__PURE__*/jsx(Typography, {
2666
- variant: "caption",
2667
- sx: {
2668
- color: '#9e9e9e',
2669
- fontWeight: 600,
2670
- alignItems: 'left'
2671
- },
2672
- children: "Amount"
2673
- })
2674
- }), /*#__PURE__*/jsx(Grid, {
2675
- item: true,
2676
- xs: 4,
2677
- sx: {
2678
- textAlign: 'right'
2679
- },
2680
- children: /*#__PURE__*/jsx(Typography, {
2681
- variant: "caption",
2682
- sx: {
2683
- color: '#9e9e9e',
2684
- fontWeight: 600
2685
- },
2686
- children: "Plans"
2687
- })
2688
- }), /*#__PURE__*/jsx(Grid, {
2689
- item: true,
2690
- xs: 4,
2691
- sx: {
2692
- textAlign: 'right'
2693
- },
2694
- children: /*#__PURE__*/jsx(Typography, {
2695
- variant: "caption",
2696
- sx: {
2697
- color: '#9e9e9e',
2698
- fontWeight: 600
2699
- },
2700
- children: "Shares"
2701
- })
2702
- })]
2703
- }), /*#__PURE__*/jsx(Divider, {
2652
+ children: "Overview of recurring donation plans by amount"
2653
+ }), /*#__PURE__*/jsx(Box, {
2704
2654
  sx: {
2705
- mb: 1
2706
- }
2707
- }), data$1.map(function (item, index) {
2708
- return /*#__PURE__*/jsxs(React.Fragment, {
2709
- children: [/*#__PURE__*/jsx(Box, {
2655
+ display: "flex",
2656
+ flexDirection: "column",
2657
+ gap: 2
2658
+ },
2659
+ children: data$1.map(function (item, index) {
2660
+ return /*#__PURE__*/jsxs(Box, {
2710
2661
  sx: {
2711
- py: 1.5,
2712
- px: 1
2713
- },
2714
- children: /*#__PURE__*/jsxs(Grid, {
2715
- container: true,
2662
+ display: "flex",
2716
2663
  alignItems: "center",
2717
- children: [/*#__PURE__*/jsx(Grid, {
2718
- item: true,
2719
- xs: 3,
2720
- children: /*#__PURE__*/jsx(Typography, {
2721
- variant: "body2",
2722
- sx: {
2723
- fontWeight: 500,
2724
- color: '#333'
2725
- },
2726
- children: item.range
2727
- })
2728
- }), /*#__PURE__*/jsx(Grid, {
2729
- item: true,
2730
- xs: 5,
2664
+ gap: 2,
2665
+ py: 0.5
2666
+ },
2667
+ children: [/*#__PURE__*/jsx(Typography, {
2668
+ sx: {
2669
+ fontSize: "13px",
2670
+ fontWeight: 500,
2671
+ color: "rgba(0, 0, 0, 0.4)",
2672
+ minWidth: "100px",
2673
+ textAlign: "left"
2674
+ },
2675
+ children: item.range
2676
+ }), /*#__PURE__*/jsx(Box, {
2677
+ sx: {
2678
+ flexGrow: 1
2679
+ },
2680
+ children: /*#__PURE__*/jsx(LinearProgress, {
2681
+ variant: "determinate",
2682
+ value: item.share,
2731
2683
  sx: {
2732
- px: 2
2733
- },
2734
- children: /*#__PURE__*/jsx(LinearProgress, {
2735
- variant: "determinate",
2736
- value: item.share,
2737
- sx: {
2738
- height: 8,
2684
+ height: 15,
2685
+ borderRadius: 4,
2686
+ bgcolor: "#F3F4F6",
2687
+ "& .MuiLinearProgress-bar": {
2739
2688
  borderRadius: 4,
2740
- bgcolor: '#f0f0f0',
2741
- '& .MuiLinearProgress-bar': {
2742
- borderRadius: 4,
2743
- bgcolor: '#6363e6'
2744
- }
2689
+ bgcolor: "#6366F1"
2745
2690
  }
2746
- })
2747
- }), /*#__PURE__*/jsx(Grid, {
2748
- item: true,
2749
- xs: 2,
2750
- sx: {
2751
- textAlign: 'right'
2752
- },
2753
- children: /*#__PURE__*/jsx(Typography, {
2754
- variant: "body2",
2755
- sx: {
2756
- fontWeight: 600,
2757
- color: '#333'
2758
- },
2759
- children: item.plans
2760
- })
2761
- }), /*#__PURE__*/jsx(Grid, {
2762
- item: true,
2763
- xs: 2,
2764
- sx: {
2765
- textAlign: 'right'
2766
- },
2767
- children: /*#__PURE__*/jsxs(Typography, {
2768
- variant: "body2",
2769
- sx: {
2770
- color: '#9e9e9e'
2771
- },
2772
- children: [item.share, "%"]
2773
- })
2774
- })]
2775
- })
2776
- }), index < data$1.length - 1 && /*#__PURE__*/jsx(Divider, {})]
2777
- }, index);
2691
+ }
2692
+ })
2693
+ }), /*#__PURE__*/jsx(Typography, {
2694
+ sx: {
2695
+ fontSize: "13px",
2696
+ fontWeight: 700,
2697
+ color: "#111",
2698
+ minWidth: "60px",
2699
+ textAlign: "right"
2700
+ },
2701
+ children: "".concat(item.plans, " \xB7 ").concat(item.share, "%")
2702
+ })]
2703
+ }, index);
2704
+ })
2778
2705
  })]
2779
2706
  })
2780
2707
  });
@@ -2844,7 +2771,8 @@ var RecurringRevenueSection = function RecurringRevenueSection() {
2844
2771
  return /*#__PURE__*/jsx(RenderChartCard, {
2845
2772
  item: item,
2846
2773
  index: index,
2847
- md: 6
2774
+ md: 6,
2775
+ isPremium: true
2848
2776
  });
2849
2777
  })
2850
2778
  }), /*#__PURE__*/jsxs(Grid, {
@@ -2857,7 +2785,8 @@ var RecurringRevenueSection = function RecurringRevenueSection() {
2857
2785
  return /*#__PURE__*/jsx(RenderChartCard, {
2858
2786
  item: item,
2859
2787
  index: index,
2860
- md: 6
2788
+ md: 6,
2789
+ isPremium: true
2861
2790
  });
2862
2791
  }), /*#__PURE__*/jsx(Grid, {
2863
2792
  item: true,
@@ -2878,7 +2807,8 @@ var RecurringRevenueSection = function RecurringRevenueSection() {
2878
2807
  return /*#__PURE__*/jsx(RenderChartCard, {
2879
2808
  item: item,
2880
2809
  index: index,
2881
- md: 6
2810
+ md: 6,
2811
+ isPremium: true
2882
2812
  });
2883
2813
  })
2884
2814
  })]
@@ -3285,98 +3215,78 @@ var DropOffPoints = function DropOffPoints() {
3285
3215
  },
3286
3216
  children: /*#__PURE__*/jsxs(CardContent, {
3287
3217
  sx: {
3288
- p: 3,
3289
- "&:last-child": {
3290
- pb: 3
3291
- }
3218
+ p: 3
3292
3219
  },
3293
- children: [/*#__PURE__*/jsxs(Box, {
3220
+ children: [/*#__PURE__*/jsx(Typography, {
3221
+ variant: "subtitle2",
3222
+ sx: {
3223
+ color: "#000000",
3224
+ fontWeight: 700,
3225
+ fontSize: "16px",
3226
+ mb: 0.5,
3227
+ textAlign: "left"
3228
+ },
3229
+ children: "Drop off points in donation flow"
3230
+ }), /*#__PURE__*/jsx(Typography, {
3231
+ sx: {
3232
+ color: "rgba(0, 0, 0, 0.4)",
3233
+ fontSize: "13px",
3234
+ mb: 3,
3235
+ textAlign: "left"
3236
+ },
3237
+ children: "Points where donors exit the donation flow"
3238
+ }), /*#__PURE__*/jsx(Box, {
3294
3239
  sx: {
3295
3240
  display: "flex",
3296
- justifyContent: "space-between",
3297
- alignItems: "center",
3298
- mb: 3
3241
+ flexDirection: "column",
3242
+ gap: 2
3299
3243
  },
3300
- children: [/*#__PURE__*/jsx(Box, {
3301
- sx: {
3302
- display: "flex",
3303
- alignItems: "center",
3304
- gap: 1
3305
- },
3306
- children: /*#__PURE__*/jsx(Typography, {
3307
- variant: "subtitle2",
3244
+ children: data.map(function (item, index) {
3245
+ return /*#__PURE__*/jsxs(Box, {
3308
3246
  sx: {
3309
- fontWeight: 600,
3310
- color: "#000000",
3311
- letterSpacing: "0.5px"
3312
- },
3313
- children: "Drop off points in donation flow"
3314
- })
3315
- }), /*#__PURE__*/jsx(IconButton, {
3316
- sx: {
3317
- border: "1px solid #E9E9EB",
3318
- borderRadius: "8px",
3319
- color: "#000",
3320
- height: "36px",
3321
- width: "36px",
3322
- "&:hover": {
3323
- borderColor: "primary.main",
3324
- bgcolor: "rgba(99, 99, 230, 0.04)"
3325
- }
3326
- },
3327
- children: /*#__PURE__*/jsx(MoreHoriz, {
3328
- sx: {
3329
- fontSize: "1.2rem"
3330
- }
3331
- })
3332
- })]
3333
- }), data.map(function (item, index) {
3334
- return /*#__PURE__*/jsxs(React.Fragment, {
3335
- children: [/*#__PURE__*/jsxs(Box, {
3336
- sx: {
3337
- py: 1.5
3247
+ display: "flex",
3248
+ alignItems: "center",
3249
+ gap: 2,
3250
+ py: 0.5
3338
3251
  },
3339
- children: [/*#__PURE__*/jsxs(Box, {
3252
+ children: [/*#__PURE__*/jsx(Typography, {
3340
3253
  sx: {
3341
- display: "flex",
3342
- justifyContent: "space-between",
3343
- alignItems: "center",
3344
- mb: 1
3254
+ fontSize: "13px",
3255
+ fontWeight: 500,
3256
+ color: "rgba(0, 0, 0, 0.4)",
3257
+ minWidth: "160px",
3258
+ textAlign: "left"
3345
3259
  },
3346
- children: [/*#__PURE__*/jsx(Typography, {
3347
- variant: "body2",
3348
- sx: {
3349
- fontWeight: 500,
3350
- color: "#333"
3351
- },
3352
- children: item.step
3353
- }), /*#__PURE__*/jsxs(Typography, {
3354
- variant: "body2",
3355
- sx: {
3356
- fontWeight: 600,
3357
- color: "#333"
3358
- },
3359
- children: [item.share, "%"]
3360
- })]
3260
+ children: item.step
3361
3261
  }), /*#__PURE__*/jsx(Box, {
3362
3262
  sx: {
3363
- width: "100%",
3364
- height: "6px",
3365
- bgcolor: "#f0f0f0",
3366
- borderRadius: "4px",
3367
- overflow: "hidden"
3263
+ flexGrow: 1
3368
3264
  },
3369
- children: /*#__PURE__*/jsx(Box, {
3265
+ children: /*#__PURE__*/jsx(LinearProgress, {
3266
+ variant: "determinate",
3267
+ value: item.share,
3370
3268
  sx: {
3371
- width: "".concat(item.share * 1.5, "%"),
3372
- height: "100%",
3373
- bgcolor: "#6363e6",
3374
- borderRadius: "4px"
3269
+ height: 15,
3270
+ borderRadius: 4,
3271
+ bgcolor: "#F3F4F6",
3272
+ "& .MuiLinearProgress-bar": {
3273
+ borderRadius: 4,
3274
+ bgcolor: "#6366F1"
3275
+ }
3375
3276
  }
3376
3277
  })
3278
+ }), /*#__PURE__*/jsxs(Typography, {
3279
+ sx: {
3280
+ fontSize: "13px",
3281
+ fontWeight: 700,
3282
+ color: "#111",
3283
+ minWidth: "40px",
3284
+ textAlign: "right"
3285
+ },
3286
+ children: [item.share, "%"]
3377
3287
  })]
3378
- }), index < data.length - 1]
3379
- }, index);
3288
+ }, index);
3289
+ })
3380
3290
  })]
3381
3291
  })
3382
3292
  });
@@ -3452,7 +3362,8 @@ var DonorBehavior = function DonorBehavior() {
3452
3362
  return /*#__PURE__*/jsx(RenderChartCard, {
3453
3363
  item: item,
3454
3364
  index: index,
3455
- md: 6
3365
+ md: 6,
3366
+ isPremium: true
3456
3367
  });
3457
3368
  })
3458
3369
  }), /*#__PURE__*/jsxs(Grid, {
@@ -3473,7 +3384,8 @@ var DonorBehavior = function DonorBehavior() {
3473
3384
  return /*#__PURE__*/jsx(RenderChartCard, {
3474
3385
  item: item,
3475
3386
  index: index,
3476
- md: 6
3387
+ md: 6,
3388
+ isPremium: true
3477
3389
  });
3478
3390
  })]
3479
3391
  }), /*#__PURE__*/jsx(Grid, {
@@ -3486,7 +3398,8 @@ var DonorBehavior = function DonorBehavior() {
3486
3398
  return /*#__PURE__*/jsx(RenderChartCard, {
3487
3399
  item: item,
3488
3400
  index: index,
3489
- md: 6
3401
+ md: 6,
3402
+ isPremium: true
3490
3403
  });
3491
3404
  })
3492
3405
  })]
@@ -4338,7 +4251,7 @@ var DonationTypeBarChart = function DonationTypeBarChart() {
4338
4251
  colors: ["transparent"]
4339
4252
  },
4340
4253
  xaxis: {
4341
- categories: ["Wk 1", "Wk 2", "Wk 3", "Wk 4", "May 3-4"],
4254
+ categories: ["Wk 1", "Wk 2", "Wk 3", "Wk 4"],
4342
4255
  axisBorder: {
4343
4256
  show: false
4344
4257
  },
@@ -4392,10 +4305,10 @@ var DonationTypeBarChart = function DonationTypeBarChart() {
4392
4305
  };
4393
4306
  var series = [{
4394
4307
  name: "Recurring",
4395
- data: [9.2, 11.8, 13.4, 15.6, 4.9]
4308
+ data: [9.2, 11.8, 13.4, 15.6]
4396
4309
  }, {
4397
4310
  name: "One-time",
4398
- data: [32.4, 41.2, 46.8, 51.3, 14.3]
4311
+ data: [32.4, 41.2, 46.8, 51.3]
4399
4312
  }];
4400
4313
  return /*#__PURE__*/jsxs(Card, {
4401
4314
  sx: {
@@ -4857,8 +4770,8 @@ var OverallSection = function OverallSection(_ref) {
4857
4770
  };
4858
4771
  var metricInfo = {
4859
4772
  "Total Raised": {
4860
- value: (apiData === null || apiData === void 0 ? void 0 : apiData.totalRaised) || "$240.9K",
4861
- subValue: (apiData === null || apiData === void 0 ? void 0 : apiData.totalRaisedTrend) || "18% vs last month",
4773
+ value: (apiData === null || apiData === void 0 ? void 0 : apiData.totalRaisedCard) || "$240.9K",
4774
+ subValue: (apiData === null || apiData === void 0 ? void 0 : apiData.totalRaisedPrev) || "18% vs last month",
4862
4775
  label: "Total Revenue",
4863
4776
  icon: PaidOutlined
4864
4777
  },
@@ -5185,7 +5098,7 @@ var PaidSection = function PaidSection() {
5185
5098
  children: [/*#__PURE__*/jsx(Grid, {
5186
5099
  item: true,
5187
5100
  xs: 12,
5188
- md: 8,
5101
+ md: 6,
5189
5102
  children: /*#__PURE__*/jsx(ActiveCampaignsCard, {
5190
5103
  title: "Channel performance",
5191
5104
  subtitle: "Ad platforms ranked by ROAS",
@@ -5261,7 +5174,7 @@ var PaidSection = function PaidSection() {
5261
5174
  }), /*#__PURE__*/jsx(Grid, {
5262
5175
  item: true,
5263
5176
  xs: 12,
5264
- md: 4,
5177
+ md: 6,
5265
5178
  children: /*#__PURE__*/jsx(DonorMixCard, {
5266
5179
  title: "Spend allocation",
5267
5180
  subtitle: "Where $80.3K went this month",
@@ -5304,12 +5217,12 @@ var PaidSection = function PaidSection() {
5304
5217
  children: [/*#__PURE__*/jsx(Grid, {
5305
5218
  item: true,
5306
5219
  xs: 12,
5307
- md: 7,
5220
+ md: 6,
5308
5221
  children: /*#__PURE__*/jsx(TopPerformingCampaignsCard, {})
5309
5222
  }), /*#__PURE__*/jsx(Grid, {
5310
5223
  item: true,
5311
5224
  xs: 12,
5312
- md: 5,
5225
+ md: 6,
5313
5226
  children: /*#__PURE__*/jsx(PaidDonorGeographyCard, {})
5314
5227
  })]
5315
5228
  })]