@empoweredvote/ev-ui 0.8.9 → 0.8.10

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.js CHANGED
@@ -3750,6 +3750,7 @@ function SocialLinks({
3750
3750
  linkedin,
3751
3751
  extraLinks = [],
3752
3752
  size = "md",
3753
+ darkMode = false,
3753
3754
  style = {}
3754
3755
  }) {
3755
3756
  const iconSizes = {
@@ -3773,14 +3774,14 @@ function SocialLinks({
3773
3774
  ...style
3774
3775
  },
3775
3776
  link: {
3776
- color: "#6A7282",
3777
+ color: darkMode ? "#9ca3af" : "#6A7282",
3777
3778
  transition: "color 0.2s ease, border-color 0.2s ease",
3778
3779
  display: "flex",
3779
3780
  alignItems: "center",
3780
3781
  justifyContent: "center",
3781
3782
  width: boxSize,
3782
3783
  height: boxSize,
3783
- border: "1px solid #E5E7EB",
3784
+ border: `1px solid ${darkMode ? "rgba(255,255,255,0.15)" : "#E5E7EB"}`,
3784
3785
  borderRadius: "10px"
3785
3786
  },
3786
3787
  icon: {
@@ -3906,8 +3907,8 @@ function SocialLinks({
3906
3907
  e.currentTarget.style.borderColor = colors.evTeal;
3907
3908
  },
3908
3909
  onMouseLeave: (e) => {
3909
- e.currentTarget.style.color = "#6A7282";
3910
- e.currentTarget.style.borderColor = "#E5E7EB";
3910
+ e.currentTarget.style.color = darkMode ? "#9ca3af" : "#6A7282";
3911
+ e.currentTarget.style.borderColor = darkMode ? "rgba(255,255,255,0.15)" : "#E5E7EB";
3911
3912
  }
3912
3913
  },
3913
3914
  link.icon
@@ -4454,7 +4455,17 @@ function getTierLabel(districtType, officeTitle) {
4454
4455
  }
4455
4456
  return "LOCAL";
4456
4457
  }
4457
- function getTierColors(tier) {
4458
+ function getTierColors(tier, darkMode) {
4459
+ if (darkMode) {
4460
+ switch (tier) {
4461
+ case "FEDERAL":
4462
+ return { bg: "rgba(30,64,175,0.25)", text: "#93c5fd" };
4463
+ case "STATE":
4464
+ return { bg: "rgba(22,101,52,0.25)", text: "#86efac" };
4465
+ default:
4466
+ return { bg: "rgba(126,34,206,0.25)", text: "#d8b4fe" };
4467
+ }
4468
+ }
4458
4469
  switch (tier) {
4459
4470
  case "FEDERAL":
4460
4471
  return { bg: "#EFF6FF", text: "#1E40AF" };
@@ -4549,7 +4560,8 @@ function PoliticianProfile({
4549
4560
  judicialRecord,
4550
4561
  politicianId,
4551
4562
  onNavigateToRecord,
4552
- imageFocalPoint
4563
+ imageFocalPoint,
4564
+ darkMode = false
4553
4565
  }) {
4554
4566
  const isMobile = useMediaQuery("(max-width: 768px)");
4555
4567
  const pol = politician;
@@ -4582,7 +4594,7 @@ function PoliticianProfile({
4582
4594
  const instagram = getSocialHandle("INSTAGRAM");
4583
4595
  const { linkedinUrl, personWebsites } = extractLinkedIn(pol);
4584
4596
  const tier = getTierLabel(pol.district_type, pol.office_title);
4585
- const tierColors2 = tier ? getTierColors(tier) : null;
4597
+ const tierColors2 = tier ? getTierColors(tier, darkMode) : null;
4586
4598
  const { title: roleTitle, subtitle: roleSubtitle } = buildTitleAndSubtitle(pol);
4587
4599
  const roleLine = [roleTitle, roleSubtitle].filter(Boolean).join(" \u2013 ");
4588
4600
  const termLine = getTermLine(pol);
@@ -4644,7 +4656,7 @@ function PoliticianProfile({
4644
4656
  const hasContactInfo = hasAddresses || hasPhones || hasEmails || hasWebsitesCol;
4645
4657
  const hasSocial = twitter || facebook || instagram || linkedinUrl;
4646
4658
  const divider = {
4647
- borderTop: "1px solid #E5E7EB",
4659
+ borderTop: `1px solid ${darkMode ? "#374151" : "#E5E7EB"}`,
4648
4660
  margin: `${spacing[6]} 0`
4649
4661
  };
4650
4662
  const sectionHeading = {
@@ -4654,7 +4666,7 @@ function PoliticianProfile({
4654
4666
  fontFamily: fonts.primary,
4655
4667
  fontWeight: fontWeights.semibold,
4656
4668
  fontSize: "18px",
4657
- color: "#101828",
4669
+ color: darkMode ? "#f3f4f6" : "#101828",
4658
4670
  margin: 0,
4659
4671
  marginBottom: spacing[4]
4660
4672
  };
@@ -4679,7 +4691,7 @@ function PoliticianProfile({
4679
4691
  padding: 0
4680
4692
  },
4681
4693
  card: {
4682
- background: colors.bgWhite,
4694
+ background: darkMode ? "#1a2235" : colors.bgWhite,
4683
4695
  borderRadius: borderRadius.lg,
4684
4696
  boxShadow: shadows.lg,
4685
4697
  padding: isMobile ? spacing[4] : spacing[8],
@@ -4738,7 +4750,7 @@ function PoliticianProfile({
4738
4750
  fontFamily: fonts.primary,
4739
4751
  fontWeight: fontWeights.bold,
4740
4752
  fontSize: isMobile ? fontSizes["2xl"] : "30px",
4741
- color: "#101828",
4753
+ color: darkMode ? "#f3f4f6" : "#101828",
4742
4754
  margin: 0,
4743
4755
  marginBottom: spacing[1],
4744
4756
  lineHeight: 1.2
@@ -4747,14 +4759,14 @@ function PoliticianProfile({
4747
4759
  fontFamily: fonts.primary,
4748
4760
  fontWeight: fontWeights.regular,
4749
4761
  fontSize: isMobile ? fontSizes.base : fontSizes.lg,
4750
- color: "#364153",
4762
+ color: darkMode ? "#d1d5db" : "#364153",
4751
4763
  margin: 0,
4752
4764
  marginBottom: spacing[1]
4753
4765
  },
4754
4766
  officeDesc: {
4755
4767
  fontFamily: fonts.primary,
4756
4768
  fontSize: fontSizes.base,
4757
- color: "#6A7282",
4769
+ color: darkMode ? "#9ca3af" : "#6A7282",
4758
4770
  margin: 0,
4759
4771
  marginBottom: spacing[3],
4760
4772
  lineHeight: 1.5
@@ -4762,7 +4774,7 @@ function PoliticianProfile({
4762
4774
  bioText: {
4763
4775
  fontFamily: fonts.primary,
4764
4776
  fontSize: fontSizes.sm,
4765
- color: "#6A7282",
4777
+ color: darkMode ? "#9ca3af" : "#6A7282",
4766
4778
  margin: 0,
4767
4779
  marginTop: spacing[1],
4768
4780
  marginBottom: spacing[3],
@@ -4782,7 +4794,7 @@ function PoliticianProfile({
4782
4794
  gap: spacing[1],
4783
4795
  fontFamily: fonts.primary,
4784
4796
  fontSize: fontSizes.sm,
4785
- color: "#6A7282"
4797
+ color: darkMode ? "#9ca3af" : "#6A7282"
4786
4798
  },
4787
4799
  submitBtn: {
4788
4800
  display: "inline-flex",
@@ -4823,7 +4835,7 @@ function PoliticianProfile({
4823
4835
  fontSize: "11px",
4824
4836
  letterSpacing: "0.05em",
4825
4837
  textTransform: "uppercase",
4826
- color: "#6A7282",
4838
+ color: darkMode ? "#9ca3af" : "#6A7282",
4827
4839
  margin: 0,
4828
4840
  marginBottom: spacing[1],
4829
4841
  display: "flex",
@@ -4833,13 +4845,13 @@ function PoliticianProfile({
4833
4845
  contactValue: {
4834
4846
  fontFamily: fonts.primary,
4835
4847
  fontSize: fontSizes.sm,
4836
- color: "#364153",
4848
+ color: darkMode ? "#d1d5db" : "#364153",
4837
4849
  lineHeight: 1.6,
4838
4850
  margin: 0,
4839
4851
  marginBottom: spacing[2]
4840
4852
  },
4841
4853
  contactLink: {
4842
- color: "#364153",
4854
+ color: darkMode ? "#59b0c4" : "#364153",
4843
4855
  textDecoration: "none",
4844
4856
  wordBreak: "break-all"
4845
4857
  },
@@ -4847,7 +4859,7 @@ function PoliticianProfile({
4847
4859
  fontFamily: fonts.primary,
4848
4860
  fontWeight: fontWeights.medium,
4849
4861
  fontSize: "12px",
4850
- color: "#9CA3AF",
4862
+ color: darkMode ? "#6b7280" : "#9CA3AF",
4851
4863
  margin: 0,
4852
4864
  marginBottom: spacing[1]
4853
4865
  },
@@ -4953,6 +4965,7 @@ function PoliticianProfile({
4953
4965
  linkedin: linkedinUrl,
4954
4966
  extraLinks: socialWebsiteUrls,
4955
4967
  size: "sm",
4968
+ darkMode,
4956
4969
  style: { marginTop: allWebsites.length > 0 ? "8px" : 0 }
4957
4970
  }
4958
4971
  )))), committees.length > 0 && /* @__PURE__ */ import_react24.default.createElement(import_react24.default.Fragment, null, /* @__PURE__ */ import_react24.default.createElement("div", { style: divider }), /* @__PURE__ */ import_react24.default.createElement(CommitteeTable, { committees })), pol.is_judicial ? /* @__PURE__ */ import_react24.default.createElement(