@lightsparkdev/ui 0.0.13 → 1.0.1

package/dist/chunk-5EIYTCCK.js

@@ -0,0 +1,49 @@
+// src/icons/Info.tsx
+import { jsx, jsxs } from "@emotion/react/jsx-runtime";
+function Info() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      width: "100%",
+      viewBox: "0 0 16 16",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M15.351 8.00008C15.351 12.0502 12.0677 15.3334 8.01766 15.3334C3.96757 15.3334 0.684326 12.0502 0.684326 8.00008C0.684326 3.94999 3.96757 0.666748 8.01766 0.666748C12.0677 0.666748 15.351 3.94999 15.351 8.00008Z",
+            stroke: "currentColor",
+            strokeWidth: "1.33333",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M8.01758 11.1429V8.00008M8.01758 4.85732V4.83276",
+            stroke: "currentColor",
+            strokeWidth: "1.66667",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M8.01758 4.85732V4.83276",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        )
+      ]
+    }
+  );
+}
+
+export {
+  Info
+};

package/dist/chunk-5GVDRJLI.js

@@ -0,0 +1,377 @@
+import {
+  smHeaderLogoMarginLeft
+} from "./chunk-VQVEZVAG.js";
+import {
+  Link
+} from "./chunk-4QVTXKRX.js";
+import {
+  z
+} from "./chunk-55OQPFLF.js";
+import {
+  UnstyledButton
+} from "./chunk-HGYVPOA7.js";
+import {
+  Icon
+} from "./chunk-UAFWDZRG.js";
+import {
+  overlaySurface,
+  standardBorderRadius,
+  standardFocusOutline
+} from "./chunk-52POF2W4.js";
+import {
+  themeOr
+} from "./chunk-ZFDYANKZ.js";
+import {
+  bp
+} from "./chunk-JSGRNWSB.js";
+import {
+  __spreadProps,
+  __spreadValues
+} from "./chunk-LOPKRCGI.js";
+
+// src/components/Dropdown.tsx
+import { css, useTheme } from "@emotion/react";
+import styled from "@emotion/styled";
+import {
+  useCallback,
+  useEffect,
+  useLayoutEffect,
+  useRef,
+  useState
+} from "react";
+import ReactDOM from "react-dom";
+import { jsx, jsxs } from "@emotion/react/jsx-runtime";
+function Dropdown({
+  button,
+  dropdownItems,
+  horizontalScrollRef,
+  onClickDropdownItems,
+  getCSS,
+  onOpen,
+  onClose,
+  closeOnScroll = false,
+  openOnHover = false,
+  minDropdownItemsWidth = 200,
+  maxDropdownItemsWidth = 300,
+  align = "center",
+  footer = null,
+  dropdownContent = null
+}) {
+  const theme = useTheme();
+  const [isOpen, setIsOpen] = useState(false);
+  const [dropdownButtonHeight, setDropdownButtonHeight] = useState(0);
+  const [dropdownButtonWidth, setDropdownButtonWidth] = useState(0);
+  const [dropdownCoords, setDropdownCoords] = useState({
+    top: 0,
+    left: 0,
+    right: 0
+  });
+  const dropdownRef = useRef(null);
+  const dropdownButtonRef = useRef(null);
+  const dropdownItemsRef = useRef(null);
+  const [dropdownItemsWidth, setDropdownItemsWidth] = useState(0);
+  const nodeRef = useRef(null);
+  const [nodeReady, setNodeReady] = useState(false);
+  useEffect(() => {
+    if (!nodeRef.current) {
+      nodeRef.current = document.createElement("div");
+      document.body.appendChild(nodeRef.current);
+    }
+    setNodeReady(true);
+    return () => {
+      if (nodeRef.current) {
+        document.body.removeChild(nodeRef.current);
+        nodeRef.current = null;
+      }
+    };
+  }, []);
+  const setOpen = useCallback(
+    (newValue) => {
+      setIsOpen(newValue);
+      if (newValue && onOpen) {
+        onOpen();
+      } else if (!newValue && onClose) {
+        onClose();
+      }
+    },
+    [onOpen, onClose]
+  );
+  function handleKeyDown(event) {
+    if (event.key === "Escape") {
+      event.preventDefault();
+      setOpen(false);
+    } else if (["Enter", "Return"].includes(event.key)) {
+      event.preventDefault();
+      setOpen(!isOpen);
+    }
+  }
+  function handleBlur(event) {
+    const targetOutsideDropdownItems = dropdownItemsRef.current && !dropdownItemsRef.current.contains(event.relatedTarget) && event.relatedTarget !== null;
+    if (targetOutsideDropdownItems) {
+      setOpen(false);
+    }
+  }
+  const handleRef = useCallback((ref) => {
+    if (ref && !dropdownButtonRef.current) {
+      dropdownButtonRef.current = ref;
+    }
+    return ref;
+  }, []);
+  useEffect(() => {
+    function handleClickOutside(event) {
+      const targetOutsideDropdownItems = dropdownItemsRef.current && !dropdownItemsRef.current.contains(event.target);
+      const targetOutsideDropdownButton = dropdownButtonRef.current && !dropdownButtonRef.current.contains(event.target);
+      if (isOpen && event.target && targetOutsideDropdownItems && targetOutsideDropdownButton) {
+        setOpen(false);
+      }
+    }
+    window.document.addEventListener("mousedown", handleClickOutside);
+    return () => {
+      window.document.removeEventListener("mousedown", handleClickOutside);
+    };
+  }, [isOpen, setOpen]);
+  const reposition = useCallback(() => {
+    if (dropdownButtonRef.current && dropdownItemsRef.current) {
+      const dropdownButtonRect = dropdownButtonRef.current.getBoundingClientRect();
+      setDropdownCoords({
+        top: dropdownButtonRect.top,
+        left: dropdownButtonRect.left,
+        right: dropdownButtonRect.right
+      });
+      setDropdownButtonHeight(dropdownButtonRect.height);
+      setDropdownButtonWidth(dropdownButtonRect.width);
+      const dropdownItemsRect = dropdownItemsRef.current.getBoundingClientRect();
+      setDropdownItemsWidth(dropdownItemsRect.width);
+    }
+  }, []);
+  useLayoutEffect(() => {
+    function onWindowResize() {
+      setOpen(false);
+      reposition();
+    }
+    function handleScroll() {
+      if (closeOnScroll) {
+        setOpen(false);
+      }
+      reposition();
+    }
+    reposition();
+    let dropdownButtonResizeObserver = null;
+    if (dropdownButtonRef.current) {
+      dropdownButtonResizeObserver = new ResizeObserver(reposition);
+      dropdownButtonResizeObserver.observe(dropdownButtonRef.current);
+    }
+    let dropdownResizeObserver = null;
+    if (dropdownButtonRef.current) {
+      dropdownResizeObserver = new ResizeObserver(reposition);
+      dropdownResizeObserver.observe(dropdownButtonRef.current);
+    }
+    window.addEventListener("resize", onWindowResize);
+    let navItemsResizeObserver = null;
+    window.addEventListener("scroll", handleScroll);
+    if (horizontalScrollRef == null ? void 0 : horizontalScrollRef.current) {
+      horizontalScrollRef.current.addEventListener("scroll", handleScroll);
+      navItemsResizeObserver = new ResizeObserver(reposition);
+      navItemsResizeObserver.observe(horizontalScrollRef.current);
+    }
+    return () => {
+      window.removeEventListener("resize", onWindowResize);
+      window.removeEventListener("scroll", handleScroll);
+      dropdownButtonResizeObserver == null ? void 0 : dropdownButtonResizeObserver.disconnect();
+      navItemsResizeObserver == null ? void 0 : navItemsResizeObserver.disconnect();
+      dropdownResizeObserver == null ? void 0 : dropdownResizeObserver.disconnect();
+    };
+  }, [setOpen, horizontalScrollRef, closeOnScroll, reposition]);
+  const handleClickDropdownItems = useCallback(() => {
+    setOpen(false);
+    onClickDropdownItems && onClickDropdownItems();
+  }, [onClickDropdownItems, setOpen]);
+  const dropdownTopMargin = 8;
+  const dropdownItemOffsetTop = dropdownCoords.top + dropdownButtonHeight + dropdownTopMargin;
+  let dropdownItemOffsetLeft = 0;
+  if (align === "center") {
+    dropdownItemOffsetLeft = dropdownCoords.left - (dropdownItemsWidth - dropdownButtonWidth) / 2;
+  } else if (align === "right") {
+    dropdownItemOffsetLeft = dropdownCoords.right - dropdownItemsWidth;
+  }
+  const buttonContent = button.label || button.getContent && button.getContent({ isOpen, theme });
+  const containerCSS = getCSS && getCSS({ isOpen, theme });
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      css: __spreadValues({ position: "relative", display: "inline-flex" }, containerCSS),
+      ref: dropdownRef,
+      children: [
+        /* @__PURE__ */ jsx(
+          DropdownButton,
+          {
+            id: button.id,
+            type: "button",
+            onMouseEnter: openOnHover ? () => {
+              reposition();
+              setOpen(true);
+            } : void 0,
+            onMouseLeave: openOnHover ? () => {
+              setOpen(false);
+            } : void 0,
+            onMouseDown: (e) => {
+              reposition();
+              setOpen(!isOpen);
+            },
+            onKeyDown: handleKeyDown,
+            onFocus: (e) => {
+              reposition();
+              setOpen(true);
+            },
+            onBlur: handleBlur,
+            ref: handleRef,
+            css: button.getCSS && button.getCSS({ isOpen, theme }),
+            children: buttonContent
+          }
+        ),
+        nodeReady && nodeRef.current ? ReactDOM.createPortal(
+          /* @__PURE__ */ jsxs(
+            DropdownItems,
+            {
+              isOpen,
+              left: dropdownItemOffsetLeft,
+              top: dropdownItemOffsetTop,
+              ref: dropdownItemsRef,
+              minWidth: minDropdownItemsWidth,
+              maxWidth: maxDropdownItemsWidth,
+              children: [
+                dropdownItems == null ? void 0 : dropdownItems.map((dropdownItem, i) => {
+                  return /* @__PURE__ */ jsx("li", { onBlur: handleBlur, children: /* @__PURE__ */ jsx(
+                    DropdownItem,
+                    {
+                      dropdownItem,
+                      onClick: handleClickDropdownItems
+                    }
+                  ) }, dropdownItem.label);
+                }),
+                dropdownContent,
+                footer && /* @__PURE__ */ jsx(DropdownFooter, { children: footer })
+              ]
+            }
+          ),
+          nodeRef.current
+        ) : null
+      ]
+    }
+  );
+}
+var DropdownFooter = styled.div`
+  padding: 24px 16px 0;
+  border-top: 1px solid ${({ theme }) => theme.c2Neutral};
+  margin-top: 16px;
+`;
+var DropdownItems = styled.ul`
+  ${overlaySurface}
+  color: ${({ theme }) => themeOr(theme.c6Neutral, theme.c8Neutral)};
+  ${standardBorderRadius(8)}
+  padding: 12px 0;
+  visibility: ${({ isOpen }) => isOpen ? "visible" : "hidden"};
+  position: fixed;
+  ${({ minWidth }) => minWidth ? `min-width: ${minWidth}px;` : ""}
+  ${({ maxWidth }) => maxWidth ? `max-width: ${maxWidth}px;` : ""}
+  left: ${({ left }) => left}px;
+  top: ${({ top }) => top}px;
+  z-index: ${z.dropdown};
+  list-style: none;
+  margin: 0;
+`;
+function DropdownItem({
+  dropdownItem,
+  onClick
+}) {
+  const theme = useTheme();
+  const dropdownItemIcon = dropdownItem.getIcon && dropdownItem.getIcon({ dropdownItem, theme });
+  const dropdownItemIconNode = dropdownItemIcon ? /* @__PURE__ */ jsx(
+    Icon,
+    {
+      name: dropdownItemIcon.name,
+      width: dropdownItemIcon.width || 12,
+      mr: 10
+    }
+  ) : null;
+  const cssProp2 = dropdownItem.getCSS && dropdownItem.getCSS({ theme, dropdownItem });
+  const onClickDropdownItem = useCallback(() => {
+    dropdownItem.onClick && dropdownItem.onClick(dropdownItem);
+    onClick && onClick();
+  }, [dropdownItem, onClick]);
+  if (dropdownItem.to !== void 0 || dropdownItem.externalLink) {
+    return /* @__PURE__ */ jsxs(
+      DropdownItemLink,
+      {
+        selected: Boolean(dropdownItem.selected),
+        to: dropdownItem.to,
+        externalLink: dropdownItem.externalLink,
+        params: dropdownItem.params,
+        onClick: onClickDropdownItem,
+        css: cssProp2,
+        hash: dropdownItem.hash,
+        children: [
+          dropdownItemIconNode,
+          dropdownItem.label
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    DropdownItemDiv,
+    {
+      selected: false,
+      css: cssProp2,
+      onClick: onClickDropdownItem,
+      children: [
+        dropdownItemIconNode,
+        dropdownItem.label
+      ]
+    }
+  );
+}
+var DropdownButton = styled(UnstyledButton)`
+  ${standardFocusOutline}
+`;
+var dropdownItemStyle = ({ selected, theme }) => `
+  background-color: ${selected ? theme.primary : "transparent"};
+  box-sizing: border-box;
+  cursor: pointer;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  height: 100%;
+  outline-color: ${selected ? theme.onPrimaryText : theme.hcNeutral} !important;
+  white-space: nowrap;
+
+  padding: 8px 16px;
+  ${bp.sm(`padding-left: ${smHeaderLogoMarginLeft};`)}
+
+  &:hover {
+    color: ${theme.hcNeutral} !important;
+  }
+`;
+var cssProp = ({
+  theme,
+  selected
+}) => css`
+  ${dropdownItemStyle({ theme, selected: Boolean(selected) })}
+  ${standardFocusOutline({ theme })}
+`;
+function DropdownItemLink(props) {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx(
+    Link,
+    __spreadProps(__spreadValues({}, props), {
+      css: cssProp({ theme, selected: Boolean(props.selected) })
+    })
+  );
+}
+var DropdownItemDiv = styled.div`
+  ${dropdownItemStyle}
+  ${standardFocusOutline}
+`;
+
+export {
+  Dropdown
+};

package/dist/chunk-5KSG5D3I.js

@@ -0,0 +1,264 @@
+// src/utils/countryCodesToNames.tsx
+import { invert } from "lodash-es";
+var countryCodesToNames = {
+  BD: "Bangladesh",
+  BE: "Belgium",
+  BF: "Burkina Faso",
+  BG: "Bulgaria",
+  BA: "Bosnia and Herzegovina",
+  BB: "Barbados",
+  WF: "Wallis and Futuna",
+  BL: "Saint Barthelemy",
+  BM: "Bermuda",
+  BN: "Brunei",
+  BO: "Bolivia",
+  BH: "Bahrain",
+  BI: "Burundi",
+  BJ: "Benin",
+  BT: "Bhutan",
+  JM: "Jamaica",
+  BV: "Bouvet Island",
+  BW: "Botswana",
+  WS: "Samoa",
+  BQ: "Bonaire, Saint Eustatius and Saba ",
+  BR: "Brazil",
+  BS: "Bahamas",
+  JE: "Jersey",
+  BY: "Belarus",
+  BZ: "Belize",
+  RU: "Russia",
+  RW: "Rwanda",
+  RS: "Serbia",
+  TL: "East Timor",
+  RE: "Reunion",
+  TM: "Turkmenistan",
+  TJ: "Tajikistan",
+  RO: "Romania",
+  TK: "Tokelau",
+  GW: "Guinea-Bissau",
+  GU: "Guam",
+  GT: "Guatemala",
+  GS: "South Georgia and the South Sandwich Islands",
+  GR: "Greece",
+  GQ: "Equatorial Guinea",
+  GP: "Guadeloupe",
+  JP: "Japan",
+  GY: "Guyana",
+  GG: "Guernsey",
+  GF: "French Guiana",
+  GE: "Georgia",
+  GD: "Grenada",
+  GB: "United Kingdom",
+  GA: "Gabon",
+  SV: "El Salvador",
+  GN: "Guinea",
+  GM: "Gambia",
+  GL: "Greenland",
+  GI: "Gibraltar",
+  GH: "Ghana",
+  OM: "Oman",
+  TN: "Tunisia",
+  JO: "Jordan",
+  HR: "Croatia",
+  HT: "Haiti",
+  HU: "Hungary",
+  HK: "Hong Kong",
+  HN: "Honduras",
+  HM: "Heard Island and McDonald Islands",
+  VE: "Venezuela",
+  PR: "Puerto Rico",
+  PS: "Palestinian Territory",
+  PW: "Palau",
+  PT: "Portugal",
+  SJ: "Svalbard and Jan Mayen",
+  PY: "Paraguay",
+  IQ: "Iraq",
+  PA: "Panama",
+  PF: "French Polynesia",
+  PG: "Papua New Guinea",
+  PE: "Peru",
+  PK: "Pakistan",
+  PH: "Philippines",
+  PN: "Pitcairn",
+  PL: "Poland",
+  PM: "Saint Pierre and Miquelon",
+  ZM: "Zambia",
+  EH: "Western Sahara",
+  EE: "Estonia",
+  EG: "Egypt",
+  ZA: "South Africa",
+  EC: "Ecuador",
+  IT: "Italy",
+  VN: "Vietnam",
+  SB: "Solomon Islands",
+  ET: "Ethiopia",
+  SO: "Somalia",
+  ZW: "Zimbabwe",
+  SA: "Saudi Arabia",
+  ES: "Spain",
+  ER: "Eritrea",
+  ME: "Montenegro",
+  MD: "Moldova",
+  MG: "Madagascar",
+  MF: "Saint Martin",
+  MA: "Morocco",
+  MC: "Monaco",
+  UZ: "Uzbekistan",
+  MM: "Myanmar",
+  ML: "Mali",
+  MO: "Macao",
+  MN: "Mongolia",
+  MH: "Marshall Islands",
+  MK: "Macedonia",
+  MU: "Mauritius",
+  MT: "Malta",
+  MW: "Malawi",
+  MV: "Maldives",
+  MQ: "Martinique",
+  MP: "Northern Mariana Islands",
+  MS: "Montserrat",
+  MR: "Mauritania",
+  IM: "Isle of Man",
+  UG: "Uganda",
+  TZ: "Tanzania",
+  MY: "Malaysia",
+  MX: "Mexico",
+  IL: "Israel",
+  FR: "France",
+  IO: "British Indian Ocean Territory",
+  SH: "Saint Helena",
+  AC: "Ascension Island",
+  TA: "Tristan da Cunha",
+  FI: "Finland",
+  FJ: "Fiji",
+  FK: "Falkland Islands",
+  FM: "Micronesia",
+  FO: "Faroe Islands",
+  NI: "Nicaragua",
+  NL: "Netherlands",
+  NO: "Norway",
+  NA: "Namibia",
+  VU: "Vanuatu",
+  NC: "New Caledonia",
+  NE: "Niger",
+  NF: "Norfolk Island",
+  NG: "Nigeria",
+  NZ: "New Zealand",
+  NP: "Nepal",
+  NR: "Nauru",
+  NU: "Niue",
+  CK: "Cook Islands",
+  XK: "Kosovo",
+  CI: "Ivory Coast",
+  CH: "Switzerland",
+  CO: "Colombia",
+  CN: "China",
+  CM: "Cameroon",
+  CL: "Chile",
+  CC: "Cocos Islands",
+  CA: "Canada",
+  CG: "Republic of the Congo",
+  CF: "Central African Republic",
+  CD: "Democratic Republic of the Congo",
+  CZ: "Czech Republic",
+  CY: "Cyprus",
+  CX: "Christmas Island",
+  CR: "Costa Rica",
+  CW: "Curacao",
+  CV: "Cape Verde",
+  CU: "Cuba",
+  SZ: "Swaziland",
+  SY: "Syria",
+  SX: "Sint Maarten",
+  KG: "Kyrgyzstan",
+  KE: "Kenya",
+  SS: "South Sudan",
+  SR: "Suriname",
+  KI: "Kiribati",
+  KH: "Cambodia",
+  KN: "Saint Kitts and Nevis",
+  KM: "Comoros",
+  ST: "Sao Tome and Principe",
+  SK: "Slovakia",
+  KR: "South Korea",
+  SI: "Slovenia",
+  KP: "North Korea",
+  KW: "Kuwait",
+  SN: "Senegal",
+  SM: "San Marino",
+  SL: "Sierra Leone",
+  SC: "Seychelles",
+  KZ: "Kazakhstan",
+  KY: "Cayman Islands",
+  SG: "Singapore",
+  SE: "Sweden",
+  SD: "Sudan",
+  DO: "Dominican Republic",
+  DM: "Dominica",
+  DJ: "Djibouti",
+  DK: "Denmark",
+  VG: "British Virgin Islands",
+  DE: "Germany",
+  YE: "Yemen",
+  DZ: "Algeria",
+  US: "United States",
+  UY: "Uruguay",
+  YT: "Mayotte",
+  UM: "United States Minor Outlying Islands",
+  LB: "Lebanon",
+  LC: "Saint Lucia",
+  LA: "Laos",
+  TV: "Tuvalu",
+  TW: "Taiwan",
+  TT: "Trinidad and Tobago",
+  TR: "Turkey",
+  LK: "Sri Lanka",
+  LI: "Liechtenstein",
+  LV: "Latvia",
+  TO: "Tonga",
+  LT: "Lithuania",
+  LU: "Luxembourg",
+  LR: "Liberia",
+  LS: "Lesotho",
+  TH: "Thailand",
+  TF: "French Southern Territories",
+  TG: "Togo",
+  TD: "Chad",
+  TC: "Turks and Caicos Islands",
+  LY: "Libya",
+  VA: "Vatican",
+  VC: "Saint Vincent and the Grenadines",
+  AE: "United Arab Emirates",
+  AD: "Andorra",
+  AG: "Antigua and Barbuda",
+  AF: "Afghanistan",
+  AI: "Anguilla",
+  VI: "U.S. Virgin Islands",
+  IS: "Iceland",
+  IR: "Iran",
+  AM: "Armenia",
+  AL: "Albania",
+  AO: "Angola",
+  AQ: "Antarctica",
+  AS: "American Samoa",
+  AR: "Argentina",
+  AU: "Australia",
+  AT: "Austria",
+  AW: "Aruba",
+  IN: "India",
+  AX: "Aland Islands",
+  AZ: "Azerbaijan",
+  IE: "Ireland",
+  ID: "Indonesia",
+  UA: "Ukraine",
+  QA: "Qatar",
+  MZ: "Mozambique"
+};
+var allCountryNames = Object.values(countryCodesToNames);
+var countryNamesToCodes = invert(countryCodesToNames);
+
+export {
+  countryCodesToNames,
+  allCountryNames,
+  countryNamesToCodes
+};

package/dist/chunk-5XTJZUMA.js

@@ -0,0 +1,27 @@
+// src/icons/Envelope.tsx
+import { jsx } from "@emotion/react/jsx-runtime";
+function Envelope() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      width: "100%",
+      viewBox: "0 0 40 40",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M35.0027 15.417C30.8238 18.5565 25.6293 20.417 20.0002 20.417C14.371 20.417 9.17645 18.5565 4.99773 15.417M4.5835 7.91699H35.4168V32.0837H4.5835V7.91699Z",
+          stroke: "currentColor",
+          strokeWidth: "3",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      )
+    }
+  );
+}
+
+export {
+  Envelope
+};