@nuralogix.ai/web-ui/lib/index.mjs

Nuralogix Web UI

import React, { createContext, useContext, useState, useRef, useEffect, useCallback, Suspense } from 'react';
import * as stylex from '@stylexjs/stylex';
import stylex__default from '@stylexjs/stylex';

const ThemeContext = createContext(null);
const useTheme = () => {
  const tokens = useContext(ThemeContext);
  if (!tokens) {
    throw new Error("useThemeTokens must be used within a ThemeProvider");
  }
  return tokens;
};

const styles$9 = {
  base: {
    transformOrigin: "nura1g0ag68",
    cursor: "nura1ypdohk",
    $$css: true
  },
  up: {
    transform: "nura7p49u4",
    $$css: true
  },
  right: {
    transform: "nura1iffjtl",
    $$css: true
  },
  down: {
    transform: "nura19jd1h0",
    $$css: true
  },
  left: {
    transform: "nura9tu13d",
    $$css: true
  },
  animate: (transition) => [{
    transition: `transform ${transition}` == null ? null : "nura10nilei",
    transitionBehavior: null,
    transitionDelay: null,
    transitionDuration: null,
    transitionProperty: null,
    transitionTimingFunction: null,
    $$css: true
  }, {
    "--transition": `transform ${transition}` != null ? `transform ${transition}` : void 0
  }],
  disabled: {
    cursor: "nura1h6gzvc",
    $$css: true
  }
};
const Chevron = ({
  width = "48px",
  height = "48px",
  strokeColor,
  direction = "right",
  animate,
  disabled
}) => {
  const {
    theme
  } = useTheme();
  const {
    transitionTokens
  } = theme;
  return /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width, height, viewBox: "0 0 24 24", fill: "none", ...stylex__default.props(styles$9.base, styles$9[direction], animate && styles$9.animate(transitionTokens.slow), disabled && styles$9.disabled) }, /* @__PURE__ */ React.createElement("rect", { width: "24", height: "24", fill: "none" }), /* @__PURE__ */ React.createElement("path", { d: "M17 14.5L12 9.5L7 14.5", stroke: strokeColor ?? theme.colorTokens.textPrimary, strokeLinecap: "round", strokeLinejoin: "round" }));
};

const Accordion = ({
  title,
  children,
  defaultOpen = false,
  width = "100%"
}) => {
  const {
    theme,
    base
  } = useTheme();
  const {
    functionStyles
  } = base;
  const {
    fontSizeTokens,
    colorTokens,
    spaceTokens,
    transitionTokens
  } = theme;
  const [isOpen, setIsOpen] = useState(defaultOpen ?? false);
  const [contentHeight, setContentHeight] = useState(0);
  const contentRef = useRef(null);
  useEffect(() => {
    if (contentRef.current) {
      setContentHeight(contentRef.current.scrollHeight);
    }
  }, []);
  const toggleAccordion = () => {
    setIsOpen((prev) => !prev);
  };
  return /* @__PURE__ */ React.createElement("div", { ...stylex.props(functionStyles.container(width, colorTokens.backgroundSecondary)) }, /* @__PURE__ */ React.createElement("div", { onClick: toggleAccordion, ...stylex.props(functionStyles.header(spaceTokens[2])), "data-testid": "header" }, /* @__PURE__ */ React.createElement("span", { ...stylex.props(functionStyles.title(fontSizeTokens.m, transitionTokens.slow)) }, title), /* @__PURE__ */ React.createElement(Chevron, { width: "24px", height: "24px", direction: isOpen ? "up" : "down", animate: true })), /* @__PURE__ */ React.createElement("div", { ...stylex.props(functionStyles.contentWrapper(isOpen ? `${contentHeight}px` : "0", transitionTokens.slow)) }, /* @__PURE__ */ React.createElement("div", { ref: contentRef, ...stylex.props(functionStyles.contentInner(spaceTokens[3])) }, children)));
};

const baseInputStyles = {
  label: (color, fontSize) => [{
    color: color == null ? null : "nurafx01vb",
    fontSize: fontSize == null ? null : "nura6zurak",
    $$css: true
  }, {
    "--color": color != null ? color : void 0,
    "--fontSize": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(fontSize)
  }]
};
const BaseInput = ({
  icon,
  unit,
  onFocus,
  onBlur,
  onChange,
  readOnly,
  disabled,
  invalid,
  className,
  invalidMessage,
  label,
  inputRef: inputRefFromProps,
  blurOnEnterKeyPress,
  ...restProps
}) => {
  const {
    theme,
    base
  } = useTheme();
  const {
    functionStyles
  } = base;
  const {
    borderRadiusTokens,
    colorTokens,
    fontSizeTokens,
    sizeTokens,
    spaceTokens,
    fontTokens,
    transitionTokens,
    leadingTokens
  } = theme;
  const inputRefInternal = useRef(null);
  const inputRef = inputRefFromProps || inputRefInternal;
  const [focused, setFocusedState] = useState(false);
  const handleBlur = useCallback((e) => {
    if (onBlur)
      onBlur(e);
    setFocusedState(false);
  }, [onBlur, setFocusedState]);
  const handleFocus = useCallback((e) => {
    if (onFocus)
      onFocus(e);
    setFocusedState(true);
  }, [onFocus, setFocusedState]);
  const handleKeyDown = (e) => {
    if (!blurOnEnterKeyPress) {
      return;
    }
    if (e.key === "Enter") {
      e.preventDefault();
      if (typeof inputRef === "object" && inputRef && inputRef.current) {
        inputRef.current.blur();
      }
    }
  };
  const handleChange = (e) => {
    if (!onChange) {
      return;
    }
    onChange(e);
  };
  return /* @__PURE__ */ React.createElement(React.Fragment, null, label && /* @__PURE__ */ React.createElement("div", { ...stylex.props(functionStyles.setMarginBottom(spaceTokens[1]), baseInputStyles.label(colorTokens.textPrimary, fontSizeTokens.m)) }, label), /* @__PURE__ */ React.createElement("label", { ...stylex.props(functionStyles.baseInputWrapper(colorTokens.placeholder, borderRadiusTokens.normal, colorTokens.textPrimary, sizeTokens.xl, colorTokens.backgroundPrimary), readOnly && functionStyles.baseInputReadonly(colorTokens.secondary, colorTokens.secondary, colorTokens.textPrimary), disabled && functionStyles.baseInputDisabled(colorTokens.secondary, colorTokens.secondary), focused && functionStyles.setBorderColor(colorTokens.primary), invalid && functionStyles.setBorderColor(colorTokens.danger)) }, icon && /* @__PURE__ */ React.createElement("i", { ...stylex.props(functionStyles.baseInputIcon(spaceTokens["5"])) }, icon), /* @__PURE__ */ React.createElement("input", { ...stylex.props(functionStyles.baseInputBase(`${spaceTokens["0"]} ${spaceTokens["4"]}`, spaceTokens["0.5"], spaceTokens["0.5"], colorTokens.placeholder, fontSizeTokens.base, fontTokens.family, leadingTokens.loose, transitionTokens.slow)), ref: inputRef, disabled, readOnly, onFocus: handleFocus, onBlur: handleBlur, onChange: handleChange, onKeyDown: handleKeyDown, ...restProps })), invalid && invalidMessage && /* @__PURE__ */ React.createElement("div", { ...stylex.props(functionStyles.baseInputInvalidMsg(colorTokens.danger, spaceTokens[1])) }, invalidMessage));
};

const sanitizeProp = (value, validValues, defaultValue) => {
  if (validValues.includes(value)) {
    return value;
  }
  return defaultValue;
};

const btnStyles = {
  base: (fontFamily, fontSize, fontWeight, radius, paddingX, paddingY, bg, fg, transition) => [{
    fontFamily: fontFamily == null ? null : "nurat1x0nq",
    fontSize: fontSize == null ? null : "nura6zurak",
    fontWeight: fontWeight == null ? null : "nura1oq5gaa",
    borderRadius: radius == null ? null : "nura1kptayx",
    borderStartStartRadius: null,
    borderStartEndRadius: null,
    borderEndStartRadius: null,
    borderEndEndRadius: null,
    borderTopLeftRadius: null,
    borderTopRightRadius: null,
    borderBottomLeftRadius: null,
    borderBottomRightRadius: null,
    padding: `${paddingY} ${paddingX}` == null ? null : "nura6rcfto",
    paddingInline: null,
    paddingStart: null,
    paddingLeft: null,
    paddingEnd: null,
    paddingRight: null,
    paddingBlock: null,
    paddingTop: null,
    paddingBottom: null,
    backgroundColor: bg == null ? null : "nurar5ldyu",
    color: fg == null ? null : "nurafx01vb",
    border: "nura1gs6z28",
    borderWidth: null,
    borderInlineWidth: null,
    borderInlineStartWidth: null,
    borderLeftWidth: null,
    borderInlineEndWidth: null,
    borderRightWidth: null,
    borderBlockWidth: null,
    borderTopWidth: null,
    borderBottomWidth: null,
    borderStyle: null,
    borderInlineStyle: null,
    borderInlineStartStyle: null,
    borderLeftStyle: null,
    borderInlineEndStyle: null,
    borderRightStyle: null,
    borderBlockStyle: null,
    borderTopStyle: null,
    borderBottomStyle: null,
    borderColor: null,
    borderInlineColor: null,
    borderInlineStartColor: null,
    borderLeftColor: null,
    borderInlineEndColor: null,
    borderRightColor: null,
    borderBlockColor: null,
    borderTopColor: null,
    borderBottomColor: null,
    display: "nura3nfvp2",
    alignItems: "nura6s0dn4",
    justifyContent: "nural56j7k",
    gap: "nura13z6uf9",
    rowGap: null,
    columnGap: null,
    lineHeight: "nura1uo3zyz",
    transition: transition == null ? null : "nura10nilei",
    transitionBehavior: null,
    transitionDelay: null,
    transitionDuration: null,
    transitionProperty: null,
    transitionTimingFunction: null,
    textDecoration: "nura1hl2dhg",
    textDecorationColor: null,
    textDecorationLine: null,
    textDecorationStyle: null,
    textDecorationThickness: null,
    $$css: true
  }, {
    "--fontFamily": fontFamily != null ? fontFamily : void 0,
    "--fontSize": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(fontSize),
    "--fontWeight": fontWeight != null ? fontWeight : void 0,
    "--borderRadius": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(radius),
    "--padding": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(`${paddingY} ${paddingX}`),
    "--backgroundColor": bg != null ? bg : void 0,
    "--color": fg != null ? fg : void 0,
    "--transition": transition != null ? transition : void 0
  }],
  outline: (fontFamily, fontSize, fontWeight, radius, paddingX, paddingY, fg, borderColor, transition) => [{
    fontFamily: fontFamily == null ? null : "nurat1x0nq",
    fontSize: fontSize == null ? null : "nura6zurak",
    fontWeight: fontWeight == null ? null : "nura1oq5gaa",
    borderRadius: radius == null ? null : "nura1kptayx",
    borderStartStartRadius: null,
    borderStartEndRadius: null,
    borderEndStartRadius: null,
    borderEndEndRadius: null,
    borderTopLeftRadius: null,
    borderTopRightRadius: null,
    borderBottomLeftRadius: null,
    borderBottomRightRadius: null,
    padding: `${paddingY} ${paddingX}` == null ? null : "nura6rcfto",
    paddingInline: null,
    paddingStart: null,
    paddingLeft: null,
    paddingEnd: null,
    paddingRight: null,
    paddingBlock: null,
    paddingTop: null,
    paddingBottom: null,
    backgroundColor: "nurajbqb8w",
    color: fg == null ? null : "nurafx01vb",
    border: `1px solid ${borderColor}` == null ? null : "nuraoyue30",
    borderWidth: null,
    borderInlineWidth: null,
    borderInlineStartWidth: null,
    borderLeftWidth: null,
    borderInlineEndWidth: null,
    borderRightWidth: null,
    borderBlockWidth: null,
    borderTopWidth: null,
    borderBottomWidth: null,
    borderStyle: null,
    borderInlineStyle: null,
    borderInlineStartStyle: null,
    borderLeftStyle: null,
    borderInlineEndStyle: null,
    borderRightStyle: null,
    borderBlockStyle: null,
    borderTopStyle: null,
    borderBottomStyle: null,
    borderColor: null,
    borderInlineColor: null,
    borderInlineStartColor: null,
    borderLeftColor: null,
    borderInlineEndColor: null,
    borderRightColor: null,
    borderBlockColor: null,
    borderTopColor: null,
    borderBottomColor: null,
    display: "nura3nfvp2",
    alignItems: "nura6s0dn4",
    justifyContent: "nural56j7k",
    gap: "nura13z6uf9",
    rowGap: null,
    columnGap: null,
    lineHeight: "nura1uo3zyz",
    transition: transition == null ? null : "nura10nilei",
    transitionBehavior: null,
    transitionDelay: null,
    transitionDuration: null,
    transitionProperty: null,
    transitionTimingFunction: null,
    $$css: true
  }, {
    "--fontFamily": fontFamily != null ? fontFamily : void 0,
    "--fontSize": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(fontSize),
    "--fontWeight": fontWeight != null ? fontWeight : void 0,
    "--borderRadius": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(radius),
    "--padding": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(`${paddingY} ${paddingX}`),
    "--color": fg != null ? fg : void 0,
    "--border": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(`1px solid ${borderColor}`),
    "--transition": transition != null ? transition : void 0
  }],
  link: (fontFamily, fontSize, fontWeight, fg, transition) => [{
    fontFamily: fontFamily == null ? null : "nurat1x0nq",
    fontSize: fontSize == null ? null : "nura6zurak",
    fontWeight: fontWeight == null ? null : "nura1oq5gaa",
    backgroundColor: "nurajbqb8w",
    color: fg == null ? null : "nurafx01vb",
    border: "nura1gs6z28",
    borderWidth: null,
    borderInlineWidth: null,
    borderInlineStartWidth: null,
    borderLeftWidth: null,
    borderInlineEndWidth: null,
    borderRightWidth: null,
    borderBlockWidth: null,
    borderTopWidth: null,
    borderBottomWidth: null,
    borderStyle: null,
    borderInlineStyle: null,
    borderInlineStartStyle: null,
    borderLeftStyle: null,
    borderInlineEndStyle: null,
    borderRightStyle: null,
    borderBlockStyle: null,
    borderTopStyle: null,
    borderBottomStyle: null,
    borderColor: null,
    borderInlineColor: null,
    borderInlineStartColor: null,
    borderLeftColor: null,
    borderInlineEndColor: null,
    borderRightColor: null,
    borderBlockColor: null,
    borderTopColor: null,
    borderBottomColor: null,
    padding: "nura1717udv",
    paddingInline: null,
    paddingStart: null,
    paddingLeft: null,
    paddingEnd: null,
    paddingRight: null,
    paddingBlock: null,
    paddingTop: null,
    paddingBottom: null,
    lineHeight: "nura1uo3zyz",
    display: "nura3nfvp2",
    alignItems: "nura6s0dn4",
    justifyContent: "nural56j7k",
    transition: transition == null ? null : "nura10nilei",
    transitionBehavior: null,
    transitionDelay: null,
    transitionDuration: null,
    transitionProperty: null,
    transitionTimingFunction: null,
    ":hover_textDecoration": "nurat0b8zv",
    ":hover_textDecorationColor": null,
    ":hover_textDecorationLine": null,
    ":hover_textDecorationStyle": null,
    ":hover_textDecorationThickness": null,
    $$css: true
  }, {
    "--fontFamily": fontFamily != null ? fontFamily : void 0,
    "--fontSize": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(fontSize),
    "--fontWeight": fontWeight != null ? fontWeight : void 0,
    "--color": fg != null ? fg : void 0,
    "--transition": transition != null ? transition : void 0
  }],
  hover: {
    ":hover_filter": "nurakapau0",
    ":hover_cursor": "nura1277o0a",
    $$css: true
  },
  active: {
    ":active_filter": "nura19y0ph4",
    $$css: true
  },
  disabled: {
    cursor: "nura1h6gzvc",
    opacity: "nura197sbye",
    $$css: true
  },
  iconOnly: (size) => [{
    width: size == null ? null : "nura1bl4301",
    height: size == null ? null : "nura1f5funs",
    padding: "nura1717udv",
    paddingInline: null,
    paddingStart: null,
    paddingLeft: null,
    paddingEnd: null,
    paddingRight: null,
    paddingBlock: null,
    paddingTop: null,
    paddingBottom: null,
    justifyContent: "nural56j7k",
    $$css: true
  }, {
    "--width": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(size),
    "--height": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(size)
  }]
};
const Button = ({
  variant = "primary",
  size = "md",
  type = "button",
  icon,
  iconOnly,
  onClick,
  width,
  children,
  disabled
}) => {
  const {
    base,
    theme
  } = useTheme();
  const {
    fontSizeTokens,
    fontTokens,
    borderRadiusTokens,
    transitionTokens,
    colorTokens,
    sizeTokens
  } = theme;
  const isOutline = variant === "outline";
  const isLink = variant === "link";
  const sizes = {
    sm: {
      px: sizeTokens.xs,
      py: sizeTokens.xs,
      fontSize: fontSizeTokens.s
    },
    md: {
      px: sizeTokens.s,
      py: sizeTokens.xs,
      fontSize: fontSizeTokens.base
    },
    lg: {
      px: sizeTokens.m,
      py: sizeTokens.s,
      fontSize: fontSizeTokens.m
    }
  };
  const safeSize = sanitizeProp(size, ["sm", "md", "lg"], "md");
  const chosen = sizes[safeSize];
  const bgVariant = sanitizeProp(variant, ["success", "danger", "warning", "primary"], "primary");
  const backgroundColor = isOutline || isLink ? "transparent" : colorTokens[bgVariant];
  const textColor = isOutline ? colorTokens.textPrimary : colorTokens.textSecondary;
  const transition = transitionTokens.slow;
  let variantStyles;
  if (isLink) {
    variantStyles = btnStyles.link(fontTokens.family, chosen.fontSize, fontTokens.weightMedium, colorTokens.textPrimary, transition);
  } else if (isOutline) {
    variantStyles = btnStyles.outline(fontTokens.family, chosen.fontSize, fontTokens.weightMedium, borderRadiusTokens.extraLarge, chosen.px, chosen.py, textColor, colorTokens.outline, transition);
  } else {
    variantStyles = btnStyles.base(fontTokens.family, chosen.fontSize, fontTokens.weightMedium, borderRadiusTokens.extraLarge, chosen.px, chosen.py, backgroundColor, textColor, transition);
  }
  return /* @__PURE__ */ React.createElement("button", { "data-testid": "Button", type, onClick, disabled, ...stylex.props(base.functionStyles.setWidth(width), variantStyles, !disabled && btnStyles.hover, !disabled && btnStyles.active, disabled && btnStyles.disabled, iconOnly && btnStyles.iconOnly(chosen.px)), ...iconOnly ? {
    "aria-label": typeof children === "string" ? children : "Icon button"
  } : {} }, /* @__PURE__ */ React.createElement("div", { ...{
    className: "nura78zum5 nura6s0dn4 nural56j7k nurah8yej3 nura13z6uf9"
  } }, icon && /* @__PURE__ */ React.createElement("span", { ...{
    className: "nura3nfvp2 nura6s0dn4"
  } }, icon), !iconOnly && children));
};

const styles$8 = {
  track: (transition, transform) => [{
    display: "nura78zum5",
    transition: "nuran3wb8y",
    transitionBehavior: null,
    transitionDelay: null,
    transitionDuration: null,
    transitionProperty: null,
    transitionTimingFunction: null,
    willChange: "nura1so62im",
    transform: transform == null ? null : "nura1uosm7l",
    $$css: true
  }, {
    "--transform": transform != null ? transform : void 0
  }],
  trackDragging: {
    transition: "nuraq2gx43",
    transitionBehavior: null,
    transitionDelay: null,
    transitionDuration: null,
    transitionProperty: null,
    transitionTimingFunction: null,
    $$css: true
  },
  arrowsContainer: (marginTop) => [{
    marginTop: marginTop == null ? null : "nura17zef60",
    width: "nurah8yej3",
    display: "nura78zum5",
    justifyContent: "nural56j7k",
    alignItems: "nura6s0dn4",
    position: "nura1n2onr6",
    $$css: true
  }, {
    "--marginTop": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(marginTop)
  }],
  arrowsInner: (width) => [{
    display: "nura78zum5",
    justifyContent: "nura1qughib",
    position: "nura1n2onr6",
    width: width == null ? null : "nura1bl4301",
    $$css: true
  }, {
    "--width": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(width)
  }],
  button: (backgroundColor, borderRadius, transition, width, height) => [{
    backgroundColor: backgroundColor == null ? null : "nurar5ldyu",
    border: "nura1gs6z28",
    borderWidth: null,
    borderInlineWidth: null,
    borderInlineStartWidth: null,
    borderLeftWidth: null,
    borderInlineEndWidth: null,
    borderRightWidth: null,
    borderBlockWidth: null,
    borderTopWidth: null,
    borderBottomWidth: null,
    borderStyle: null,
    borderInlineStyle: null,
    borderInlineStartStyle: null,
    borderLeftStyle: null,
    borderInlineEndStyle: null,
    borderRightStyle: null,
    borderBlockStyle: null,
    borderTopStyle: null,
    borderBottomStyle: null,
    borderColor: null,
    borderInlineColor: null,
    borderInlineStartColor: null,
    borderLeftColor: null,
    borderInlineEndColor: null,
    borderRightColor: null,
    borderBlockColor: null,
    borderTopColor: null,
    borderBottomColor: null,
    borderRadius: borderRadius == null ? null : "nura1kptayx",
    borderStartStartRadius: null,
    borderStartEndRadius: null,
    borderEndStartRadius: null,
    borderEndEndRadius: null,
    borderTopLeftRadius: null,
    borderTopRightRadius: null,
    borderBottomLeftRadius: null,
    borderBottomRightRadius: null,
    cursor: "nura1ypdohk",
    transition: `all ${transition}` == null ? null : "nura10nilei",
    transitionBehavior: null,
    transitionDelay: null,
    transitionDuration: null,
    transitionProperty: null,
    transitionTimingFunction: null,
    display: "nura78zum5",
    alignItems: "nura6s0dn4",
    justifyContent: "nural56j7k",
    width: width == null ? null : "nura1bl4301",
    height: height == null ? null : "nura1f5funs",
    ":hover_transform": "nura1lcra6a",
    $$css: true
  }, {
    "--backgroundColor": backgroundColor != null ? backgroundColor : void 0,
    "--borderRadius": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(borderRadius),
    "--transition": `all ${transition}` != null ? `all ${transition}` : void 0,
    "--width": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(width),
    "--height": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(height)
  }],
  buttonDisabled: {
    opacity: "nurabyyjgo",
    cursor: "nura1h6gzvc",
    ":hover_transform": "nura1t7rm6y",
    $$css: true
  },
  dotsContainer: (marginTop, gap) => [{
    marginTop: marginTop == null ? null : "nura17zef60",
    display: "nura78zum5",
    gap: gap == null ? null : "nura9ctp7s",
    rowGap: null,
    columnGap: null,
    justifyContent: "nural56j7k",
    alignItems: "nura6s0dn4",
    $$css: true
  }, {
    "--marginTop": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(marginTop),
    "--gap": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(gap)
  }],
  dot: (width, height, borderRadius, backgroundColor) => [{
    width: width == null ? null : "nura1bl4301",
    height: height == null ? null : "nura1f5funs",
    borderRadius: borderRadius == null ? null : "nura1kptayx",
    borderStartStartRadius: null,
    borderStartEndRadius: null,
    borderEndStartRadius: null,
    borderEndEndRadius: null,
    borderTopLeftRadius: null,
    borderTopRightRadius: null,
    borderBottomLeftRadius: null,
    borderBottomRightRadius: null,
    backgroundColor: backgroundColor == null ? null : "nurar5ldyu",
    cursor: "nura1ypdohk",
    transition: "nuradr7xzh",
    transitionBehavior: null,
    transitionDelay: null,
    transitionDuration: null,
    transitionProperty: null,
    transitionTimingFunction: null,
    $$css: true
  }, {
    "--width": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(width),
    "--height": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(height),
    "--borderRadius": ((val) => typeof val === "number" ? val + "px" : val != null ? val : void 0)(borderRadius),
    "--backgroundColor": backgroundColor != null ? backgroundColor : void 0
  }],
  dotActive: {
    filter: "nuraatzp2",
    transform: "nura4zgh4k",
    $$css: true
  }
};
const Carousel = ({
  children,
  showArrows = true,
  showNav = true
}) => {
  const {
    theme
  } = useTheme();
  const {
    sizeTokens,
    spaceTokens
  } = theme;
  const [currentIndex, setCurrentIndex] = useState(0);
  const [dragOffset, setDragOffset] = useState(0);
  const [isDragging, setIsDragging] = useState(false);
  const [slideWidth, setSlideWidth] = useState(0);
  const touchStartX = useRef(null);
  const slideCount = React.Children.count(children);
  const viewportRef = useRef(null);
  const firstSlideRef = useRef(null);
  useEffect(() => {
    const measureSlideWidth = () => {
      if (firstSlideRef.current) {
        const width = firstSlideRef.current.offsetWidth;
        setSlideWidth(width);
        if (viewportRef.current) {
          viewportRef.current.style.width = `${width}px`;
        }
      }
    };
    measureSlideWidth();
    window.addEventListener("resize", measureSlideWidth);
    return () => window.removeEventListener("resize", measureSlideWidth);
  }, [children]);
  const next = () => {
    if (currentIndex < slideCount - 1) {
      setCurrentIndex((prev2) => prev2 + 1);
    }
  };
  const prev = () => {
    if (currentIndex > 0) {
      setCurrentIndex((prev2) => prev2 - 1);
    }
  };
  const handleTouchStart = (e) => {
    touchStartX.current = e.touches[0].clientX;
    setIsDragging(true);
  };
  const handleTouchMove = (e) => {
    if (touchStartX.current !== null) {
      const delta = e.touches[0].clientX - touchStartX.current;
      setDragOffset(delta);
    }
  };
  const handleTouchEnd = () => {
    setIsDragging(false);
    if (Math.abs(dragOffset) > 50) {
      if (dragOffset < 0 && currentIndex < slideCount - 1) {
        setCurrentIndex((prev2) => prev2 + 1);
      } else if (dragOffset > 0 && currentIndex > 0) {
        setCurrentIndex((prev2) => prev2 - 1);
      }
    }
    setDragOffset(0);
    touchStartX.current = null;
  };
  const getTranslateX = () => {
    return `translateX(${-currentIndex * slideWidth + dragOffset}px)`;
  };
  return /* @__PURE__ */ React.createElement("div", { ...{
    className: "nura78zum5 nuradt5ytf nura6s0dn4 nura1n2onr6 nurah8yej3"
  } }, /* @__PURE__ */ React.createElement("div", { ref: viewportRef, ...{
    className: "nurab3r6kr nura1n2onr6 nurax69xxh"
  }, onTouchStart: handleTouchStart, onTouchMove: handleTouchMove, onTouchEnd: handleTouchEnd }, /* @__PURE__ */ React.createElement("div", { ...stylex.props(styles$8.track(theme.transitionTokens.slow, getTranslateX()), isDragging && styles$8.trackDragging) }, React.Children.map(children, (child, index) => /* @__PURE__ */ React.createElement("div", { key: index, ref: index === 0 ? firstSlideRef : void 0 }, child)))), showArrows && slideCount > 1 && /* @__PURE__ */ React.createElement("div", { ...stylex.props(styles$8.arrowsContainer(theme.spaceTokens[3])) }, /* @__PURE__ */ React.createElement("div", { ...stylex.props(styles$8.arrowsInner(slideWidth)) }, /* @__PURE__ */ React.createElement("button", { onClick: prev, disabled: currentIndex === 0, ...stylex.props(styles$8.button(theme.colorTokens.backgroundSecondary, theme.borderRadiusTokens.full, theme.transitionTokens.slow, sizeTokens.xl, sizeTokens.xl), currentIndex === 0 && styles$8.buttonDisabled) }, /* @__PURE__ */ React.createElement(Chevron, { direction: "left", disabled: currentIndex === 0 })), /* @__PURE__ */ React.createElement("button", { onClick: next, disabled: currentIndex === slideCount - 1, ...stylex.props(styles$8.button(theme.colorTokens.backgroundSecondary, theme.borderRadiusTokens.full, theme.transitionTokens.slow, sizeTokens.xl, sizeTokens.xl), currentIndex === slideCount - 1 && styles$8.buttonDisabled) }, /* @__PURE__ */ React.createElement(Chevron, { direction: "right", disabled: currentIndex === slideCount - 1 })))), showNav && slideCount > 1 && /* @__PURE__ */ React.createElement("div", { ...stylex.props(styles$8.dotsContainer(spaceTokens[3], spaceTokens[2])) }, Array.from({
    length: slideCount
  }).map((_, index) => /* @__PURE__ */ React.createElement("div", { key: index, role: "button", onClick: () => setCurrentIndex(index), ...stylex.props(styles$8.dot(theme.sizeTokens.xs, theme.sizeTokens.xs, theme.borderRadiusTokens.full, theme.colorTokens.backgroundSecondary), currentIndex === index && styles$8.dotActive) }))));
};

const BloodPressure = ({
  width = "48",
  height = "48",
  strokeColor
}) => {
  const {
    theme
  } = useTheme();
  const fill = strokeColor ?? theme.colorTokens.textPrimary;
  return /* @__PURE__ */ React.createElement("svg", { width, height, viewBox: "0 0 48 48", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M36.9228 21C37.4751 21 37.9228 21.4477 37.9228 22C37.9228 23.3228 37.9425 24.692 37.962 26.0465C37.9843 27.5925 38.0062 26.1193 37.9983 27.536C37.9831 30.2549 37.8624 32.8418 37.4203 35.0818C36.9793 37.3163 36.1986 39.3134 34.7794 40.7537C33.3307 42.2238 31.3311 43 28.7032 43C24.3102 43 21.8273 41.3632 20.4727 39.5782C19.8121 38.7078 19.4478 37.8388 19.2478 37.1859C19.1476 36.8585 19.0876 36.582 19.0522 36.3816C19.0344 36.2813 19.0227 36.1995 19.0152 36.1395C19.0115 36.1095 19.0087 36.0849 19.0068 36.066L19.0045 36.042L19.0037 36.0334L19.0035 36.0299L19.0033 36.0284C19.0033 36.0284 19.0032 36.027 20 35.9474L19.0032 36.027L18.9236 35.0302L20.9172 34.8709L20.9963 35.8615L20.9965 35.8635C20.9969 35.8675 20.9979 35.8769 20.9997 35.8912C21.0033 35.9198 21.0101 35.9681 21.0216 36.0333C21.0447 36.1638 21.0867 36.3602 21.1602 36.6003C21.3078 37.0822 21.578 37.7264 22.0658 38.3692C23.0079 39.6105 24.8765 41 28.7032 41C30.9103 41 32.3556 40.3639 33.3548 39.3499C34.3833 38.3061 35.0531 36.7473 35.4582 34.6945C35.8622 32.6473 35.9833 30.2155 35.9984 27.5248C36.0065 26.071 35.9849 27.6161 35.9628 26.122C35.943 24.7884 35.9228 23.4235 35.9228 22C35.9228 21.4477 36.3705 21 36.9228 21Z", fill }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M23.0033 11.4695C23.0036 11.4695 23.0032 11.4729 23.0011 11.4797C23.0019 11.4729 23.003 11.4695 23.0033 11.4695ZM22.9934 11.5C22.9726 11.4519 22.9117 11.3471 22.7451 11.186C22.4319 10.883 21.8739 10.5181 21.0209 10.1691C19.3247 9.47522 16.8435 9 14 9C11.1565 9 8.67526 9.47522 6.97909 10.1691C6.12611 10.5181 5.5681 10.883 5.25487 11.186C5.08832 11.3471 5.02743 11.4519 5.0066 11.5C5.02743 11.5481 5.08832 11.6529 5.25487 11.814C5.5681 12.117 6.12611 12.4819 6.97909 12.8309C8.67526 13.5248 11.1565 14 14 14C16.8435 14 19.3247 13.5248 21.0209 12.8309C21.8739 12.4819 22.4319 12.117 22.7451 11.814C22.9117 11.6529 22.9726 11.5481 22.9934 11.5ZM4.9967 11.4695C4.99702 11.4695 4.99807 11.4729 4.99891 11.4797C4.9968 11.4729 4.99638 11.4695 4.9967 11.4695ZM4.9967 11.5305C4.99638 11.5305 4.9968 11.5271 4.99891 11.5203C4.99807 11.5271 4.99702 11.5305 4.9967 11.5305ZM23.0011 11.5203C23.0032 11.5271 23.0036 11.5305 23.0033 11.5305C23.003 11.5305 23.0019 11.5271 23.0011 11.5203ZM14 16C20.0751 16 25 13.9853 25 11.5C25 9.01472 20.0751 7 14 7C7.92487 7 3 9.01472 3 11.5C3 13.9853 7.92487 16 14 16Z", fill }), /* @__PURE__ */ React.createElement("path", { d: "M4 14L13 16.3158V36L4 33.6842V14Z", fill }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M25 12C25 12 24.306 12.5138 23 13.1161C21.1501 13.9692 18.0724 15 14 15C9.84407 15 6.815 13.9958 5 13.1494C3.6779 12.5328 3 12 3 12V34C3 34 6.47368 37 14 37C21.5263 37 25 34 25 34V31.9381C24.6724 31.979 24.3387 32 24 32C23.6613 32 23.3276 31.979 23 31.9381V32.9432C22.651 33.1473 22.1712 33.3976 21.5565 33.6525C19.9799 34.306 17.4896 35 14 35C10.5104 35 8.02005 34.306 6.44352 33.6525C5.82878 33.3976 5.34902 33.1473 5 32.9432V15.3312L5.05561 15.3538C7.11934 16.1895 10.1236 17 14 17C17.7658 17 20.7672 16.1864 22.8458 15.3578C22.8978 15.3371 22.9492 15.3164 23 15.2957V16.0619C23.3276 16.021 23.6613 16 24 16C24.3387 16 24.6724 16.021 25 16.0619V12Z", fill }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M24 30C27.3137 30 30 27.3137 30 24C30 20.6863 27.3137 18 24 18C20.6863 18 18 20.6863 18 24C18 27.3137 20.6863 30 24 30ZM24 32C28.4183 32 32 28.4183 32 24C32 19.5817 28.4183 16 24 16C19.5817 16 16 19.5817 16 24C16 28.4183 19.5817 32 24 32Z", fill }), /* @__PURE__ */ React.createElement("path", { d: "M26 24C26 25.1046 25.1046 26 24 26C22.8954 26 22 25.1046 22 24C22 22.8954 22.8954 22 24 22C25.1046 22 26 22.8954 26 24Z", fill }), /* @__PURE__ */ React.createElement("path", { d: "M23 20C23 19.4477 23.4477 19 24 19C24.5523 19 25 19.4477 25 20V23C25 23.5523 24.5523 24 24 24C23.4477 24 23 23.5523 23 23V20Z", fill }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M38.0396 19.7624C38.5973 18.6469 39 16.966 39 15C39 13.034 38.5973 11.3531 38.0396 10.2376C37.761 9.68039 37.4809 9.33804 37.2653 9.15562C37.1621 9.06834 37.0881 9.02968 37.0486 9.01352C37.0291 9.00555 37.0168 9.00248 37.0109 9.00128C37.0052 9.00013 37.0021 9 37 9C36.9979 9 36.9948 9.00013 36.9891 9.00128C36.9832 9.00248 36.9709 9.00555 36.9514 9.01352C36.9119 9.02968 36.8379 9.06834 36.7347 9.15562C36.5191 9.33804 36.239 9.68039 35.9604 10.2376C35.4027 11.3531 35 13.034 35 15C35 16.966 35.4027 18.6469 35.9604 19.7624C36.239 20.3196 36.5191 20.662 36.7347 20.8444C36.8379 20.9317 36.9119 20.9703 36.9514 20.9865C36.9709 20.9945 36.9832 20.9975 36.9891 20.9987C36.9948 20.9999 36.9979 21 37 21C37.0021 21 37.0052 20.9999 37.0109 20.9987C37.0168 20.9975 37.0291 20.9945 37.0486 20.9865C37.0881 20.9703 37.1621 20.9317 37.2653 20.8444C37.4809 20.662 37.761 20.3196 38.0396 19.7624ZM37 23C39.2091 23 41 19.4183 41 15C41 10.5817 39.2091 7 37 7C34.7909 7 33 10.5817 33 15C33 19.4183 34.7909 23 37 23Z", fill }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M38.0396 19.7624C38.5973 18.6469 39 16.966 39 15C39 13.034 38.5973 11.3531 38.0396 10.2376C37.761 9.68039 37.4809 9.33804 37.2653 9.15562C37.1621 9.06834 37.0881 9.02968 37.0486 9.01352C37.0291 9.00555 37.0168 9.00248 37.0109 9.00128C37.0052 9.00013 37.0021 9 37 9C36.9979 9 36.9948 9.00013 36.9891 9.00128C36.9832 9.00248 36.9709 9.00555 36.9514 9.01352C36.9119 9.02968 36.8379 9.06834 36.7347 9.15562C36.5191 9.33804 36.239 9.68039 35.9604 10.2376C35.4027 11.3531 35 13.034 35 15C35 16.966 35.4027 18.6469 35.9604 19.7624C36.239 20.3196 36.5191 20.662 36.7347 20.8444C36.8379 20.9317 36.9119 20.9703 36.9514 20.9865C36.9709 20.9945 36.9832 20.9975 36.9891 20.9987C36.9948 20.9999 36.9979 21 37 21C37.0021 21 37.0052 20.9999 37.0109 20.9987C37.0168 20.9975 37.0291 20.9945 37.0486 20.9865C37.0881 20.9703 37.1621 20.9317 37.2653 20.8444C37.4809 20.662 37.761 20.3196 38.0396 19.7624ZM37 23C39.2091 23 41 19.4183 41 15C41 10.5817 39.2091 7 37 7C34.7909 7 33 10.5817 33 15C33 19.4183 34.7909 23 37 23Z", fill }));
};

const BodyMassIndex = ({
  width = 100,
  height = 100,
  strokeColor
}) => {
  const {
    theme
  } = useTheme();
  return /* @__PURE__ */ React.createElement("svg", { width, height, viewBox: "0 0 100 100", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React.createElement("path", { d: "M87.5 12.5H74.8047C68.9453 5.07813 60.1562 0 50 0C39.6484 0 30.8594 5.07813 25 12.5H12.5C5.46875 12.5 0 18.1641 0 25V87.5C0 94.5312 5.46875 100 12.5 100H87.5C94.3359 100 100 94.5312 100 87.5V25C100 18.1641 94.3359 12.5 87.5 12.5ZM50 9.375C61.9141 9.375 71.875 19.3359 71.875 31.25C71.875 43.3594 61.9141 53.125 50 53.125C37.8906 53.125 28.125 43.3594 28.125 31.25C28.125 19.3359 37.8906 9.375 50 9.375ZM91.625 89.5C91.625 91.2578 90.0625 92.625 88.5 92.625H11.5C9.74219 92.625 8.375 91.2578 8.375 89.5V25C8.375 23.4375 9.74219 21.875 11.5 21.875H20.3125C19.3359 25 18.75 28.125 18.75 31.25C18.75 48.6328 32.6172 62.5 50 62.5C67.1875 62.5 81.25 48.6328 81.25 31.25C81.25 28.125 80.4688 25 79.4922 21.875H88.5C90.0625 21.875 91.625 23.4375 91.625 25V89.5ZM50 46.875C53.3203 46.875 56.25 44.1406 56.25 40.625C56.25 39.0625 55.4687 37.6953 54.4922 36.7188L59.1797 23.0469C60.3516 18.9453 54.4922 16.9922 53.125 20.8984L48.6328 34.7656C45.7031 35.3516 43.75 37.6953 43.75 40.625C43.75 44.1406 46.4844 46.875 50 46.875Z", fill: strokeColor ?? theme.colorTokens.textPrimary }));
};

const BodyShapeIndex = ({
  width = 120,
  height = 110,
  strokeColor
}) => {
  const {
    theme
  } = useTheme();
  const fill = strokeColor ?? theme.colorTokens.textPrimary;
  return /* @__PURE__ */ React.createElement("svg", { width, height, viewBox: "0 0 120 110", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React.createElement("path", { d: "M30 25.0005H10C4.5 25.0005 0 29.5005 0 35.0005V60.0005C0 65.5005 4.5 70.0005 10 70.0005V105C10 107.75 12.25 110 15 110H25C27.75 110 30 107.75 30 105V70.0005C35.5 70.0005 40 65.5005 40 60.0005V35.0005C40 29.5005 35.5 25.0005 30 25.0005Z", fill }), /* @__PURE__ */ React.createElement("path", { d: "M65.0005 34.9997H55.0005C49.5005 34.9997 45.0005 39.4997 45.0005 44.9997V69.9997C45.0005 73.6697 47.0305 76.8647 50.0005 78.6047V105C50.0005 107.75 52.2505 110 55.0005 110H65.0005C67.7505 110 70.0005 107.75 70.0005 105V78.6047C72.9706 76.8597 75.0005 73.6747 75.0005 69.9997V44.9997C75.0005 39.4997 70.5005 34.9997 65.0005 34.9997Z", fill }), /* @__PURE__ */ React.createElement("path", { d: "M20.0009 20C25.5237 20 30.0009 15.5228 30.0009 10C30.0009 4.47715 25.5237 0 20.0009 0C14.478 0 10.0009 4.47715 10.0009 10C10.0009 15.5228 14.478 20 20.0009 20Z", fill }), /* @__PURE__ */ React.createElement("path", { d: "M59.9993 30.0009C65.5222 30.0009 69.9993 25.5237 69.9993 20.0009C69.9993 14.478 65.5222 10.0009 59.9993 10.0009C54.4765 10.0009 49.9993 14.478 49.9993 20.0009C49.9993 25.5237 54.4765 30.0009 59.9993 30.0009Z", fill }), /* @__PURE__ */ React.createElement("path", { d: "M99.9995 40.0001C105.522 40.0001 109.999 35.5229 109.999 30.0001C109.999 24.4772 105.522 20.0001 99.9995 20.0001C94.4766 20.0001 89.9995 24.4772 89.9995 30.0001C89.9995 35.5229 94.4766 40.0001 99.9995 40.0001Z", fill }), /* @__PURE__ */ React.createElement("path", { d: "M120 67.5005C120 55.0756 111.045 45.0005 100 45.0005C88.9552 45.0005 80.0003 55.0756 80.0003 67.5005C80.0003 75.8055 84.0502 82.9855 90.0003 86.8805V105.001C90.0003 107.751 92.2503 110.001 95.0003 110.001H105C107.75 110.001 110 107.751 110 105.001V86.8805C115.95 82.9855 120 75.8055 120 67.5005Z", fill }));
};

const BodyTemperature = ({
  width = 128,
  height = 128,
  strokeColor
}) => {
  const {
    theme
  } = useTheme();
  return /* @__PURE__ */ React.createElement("svg", { width, height, viewBox: "0 0 128 128", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React.createElement("g", { clipPath: "url(#clip0_1_271)" }, /* @__PURE__ */ React.createElement("path", { d: "M57.1696 123.518C72.5982 123.518 85.134 110.982 85.134 95.5536C85.134 87.4107 81.7591 80.2857 75.384 74.5001C74.2055 73.4286 73.9374 72.8393 73.9374 71.2322L74.0446 23.125C74.0446 11.9285 67.2412 4.48206 57.1696 4.48206C47.0446 4.48206 40.2412 11.9285 40.2412 23.125L40.2947 71.2322C40.2947 72.8393 40.0268 73.4286 38.902 74.5001C32.4732 80.2857 29.1518 87.4107 29.1518 95.5536C29.1518 110.982 41.6341 123.518 57.1696 123.518ZM57.1696 115.75C46.0268 115.75 36.9733 106.643 36.9733 95.5536C36.9733 88.8571 40.134 82.8036 45.8126 79C47.4734 77.875 48.1161 76.8571 48.1161 74.6608V23.4464C48.1161 16.6965 51.8126 12.3573 57.1696 12.3573C62.4732 12.3573 66.1161 16.6965 66.1161 23.4464V74.6608C66.1161 76.8571 66.7589 77.875 68.4197 79C74.0983 82.8036 77.259 88.8571 77.259 95.5536C77.259 106.643 68.259 115.75 57.1696 115.75ZM84.0089 24.1429H95.6876C97.5625 24.1429 98.8483 22.6965 98.8483 21.0357C98.8483 19.3751 97.5625 17.9287 95.6876 17.9287H84.0089C82.134 17.9287 80.8483 19.3751 80.8483 21.0357C80.8483 22.6965 82.134 24.1429 84.0089 24.1429ZM84.0089 39.1966H95.6876C97.5625 39.1966 98.8483 37.7499 98.8483 36.0894C98.8483 34.4286 97.5625 32.9822 95.6876 32.9822H84.0089C82.134 32.9822 80.8483 34.4286 80.8483 36.0894C80.8483 37.7499 82.134 39.1966 84.0089 39.1966ZM57.1161 108.518C64.2947 108.518 70.0805 102.732 70.0805 95.5001C70.0805 90.4642 67.2412 86.3392 63.1161 84.0894C61.4019 83.1787 60.8126 82.5358 60.8126 79.9106V51.4642C60.8126 48.6786 59.2053 47.0178 57.1161 47.0178C55.0803 47.0178 53.4197 48.6786 53.4197 51.4642V79.9106C53.4197 82.5358 52.8304 83.1787 51.1161 84.0894C46.9911 86.3392 44.1518 90.4642 44.1518 95.5001C44.1518 102.732 49.9374 108.518 57.1161 108.518ZM84.0089 54.2501H95.6876C97.5625 54.2501 98.8483 52.8037 98.8483 51.1429C98.8483 49.4823 97.5625 47.9822 95.6876 47.9822H84.0089C82.134 47.9822 80.8483 49.4823 80.8483 51.1429C80.8483 52.8037 82.134 54.2501 84.0089 54.2501ZM84.0089 69.3035H95.6876C97.5625 69.3035 98.8483 67.8037 98.8483 66.1429C98.8483 64.4821 97.5625 63.0359 95.6876 63.0359H84.0089C82.134 63.0359 80.8483 64.4821 80.8483 66.1429C80.8483 67.8037 82.134 69.3035 84.0089 69.3035Z", fill: strokeColor ?? theme.colorTokens.textPrimary })), /* @__PURE__ */ React.createElement("defs", null, /* @__PURE__ */ React.createElement("clipPath", { id: "clip0_1_271" }, /* @__PURE__ */ React.createElement("rect", { width: "128", height: "128", fill: "white" }))));
};

const Breathing = ({
  width = 102,
  height = 103,
  strokeColor
}) => {
  const {
    theme
  } = useTheme();
  const fill = strokeColor ?? theme.colorTokens.textPrimary;
  return /* @__PURE__ */ React.createElement("svg", { width, height, viewBox: "0 0 102 103", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M50.9996 10.8039C47.1513 10.8039 44.1368 8.65131 44.1368 5.90196C44.1368 3.15261 47.1513 1 50.9996 1C54.8478 1 57.8623 3.15261 57.8623 5.90196C57.8623 8.65131 54.8478 10.8039 50.9996 10.8039ZM50.9981 4.26881C48.9031 4.26881 47.5663 5.23542 47.5663 5.90261C47.5663 6.56922 48.9031 7.5364 50.9981 7.5364C53.0922 7.5364 54.429 6.56922 54.429 5.90261C54.429 5.23542 53.0908 4.26881 50.9981 4.26881Z", fill }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M11.0249 102C10.8147 102 10.6038 101.989 10.3905 101.969C7.85485 101.731 5.61512 100.113 4.54115 97.7453C-0.193879 87.2821 -0.180767 73.4447 4.58303 56.6141C8.09497 44.2052 12.894 34.9532 13.0981 34.5664C19.3498 20.7824 25.8251 12.8329 32.3014 11.0185C35.6466 10.0836 37.859 11.142 38.5139 11.5288C42.0288 13.0399 44.1762 16.2603 44.829 20.932C45.4008 16.583 45.2104 11.5628 44.8969 7.74415C44.8351 6.99899 45.2685 6.30266 45.9595 6.03385C46.6513 5.76365 47.4349 5.99155 47.8828 6.5853C48.3286 7.17965 49.4668 7.77656 51.001 7.77656C52.5353 7.77656 53.6734 7.17965 54.1184 6.58668C54.5656 5.99293 55.3453 5.76603 56.0402 6.03543C56.7319 6.30266 57.1646 6.99899 57.1028 7.74652C56.7901 11.566 56.5997 16.5868 57.1715 20.936C57.8228 16.2603 59.9717 13.0415 63.4871 11.5288C64.1431 11.142 66.3584 10.0836 69.6991 11.0169C76.1683 12.8298 82.6394 20.7654 88.9261 34.6081C89.3364 35.3987 93.9905 44.503 97.4173 56.6141C102.18 73.4447 102.195 87.2836 97.4586 97.7453C96.3854 100.113 94.1462 101.731 91.6114 101.969C89.221 102.184 86.9736 101.149 85.6006 99.1777L85.4678 98.98C84.7599 97.8951 83.6668 97.2511 82.4674 97.2041C77.318 97.0104 67.6214 95.3758 60.5548 86.6189C52.5703 76.7238 50.3314 60.7818 53.9012 39.2306C54.0862 38.1079 53.8294 36.9598 53.1934 36.082L51.001 33.0516L48.8087 36.082C48.174 36.9598 47.9157 38.1079 48.1008 39.2306C51.6707 60.7818 49.4339 76.7238 41.4486 86.6189C34.3822 95.3758 24.6854 97.0104 19.5347 97.2041C18.3353 97.2497 17.2437 97.8951 16.5411 98.9723L16.3975 99.1846C15.15 100.974 13.1738 102 11.0249 102ZM36.1803 16.9989C35.6882 16.9989 35.0976 17.0716 34.4172 17.28C31.5913 18.1397 25.8075 21.8886 18.8037 37.3176C18.59 37.7341 1.23597 71.4309 10.9539 92.8912C11.4853 94.0668 12.5899 94.8689 13.8356 94.9863C14.9436 95.0874 15.9482 94.627 16.5817 93.7181C17.8408 91.7954 19.7877 90.6631 21.8678 90.5833C26.1002 90.4225 34.0578 89.0918 39.8105 81.9662C46.5909 73.568 48.4357 59.7038 45.2955 40.7585C44.9881 38.9068 45.4265 36.9953 46.4966 35.5159L49.7596 31.0089C50.3368 30.2084 51.6614 30.2084 52.2401 31.0089L55.5031 35.5159C56.5739 36.9968 57.0103 38.9068 56.7049 40.7585C53.5647 59.7038 55.4095 73.568 62.1906 81.9662C67.9434 89.0918 75.9002 90.4225 80.1311 90.5833C82.2105 90.6631 84.1604 91.7917 85.3423 93.6064C86.0508 94.627 87.0574 95.0845 88.1641 94.9863C89.4103 94.8704 90.5136 94.0668 91.0451 92.8912C100.764 71.4309 83.4102 37.7341 83.2334 37.396C83.2214 37.369 83.2072 37.344 83.1967 37.3176C76.1061 21.6978 70.2701 18.0286 67.4224 17.2315C65.2899 16.6331 64.0932 17.3681 64.084 17.3774C63.9952 17.4394 63.8999 17.4906 63.7999 17.5327C60.2457 19.0058 59.5372 23.2642 59.5697 26.5783C59.583 27.9689 58.6089 29.1217 57.2541 29.3139C55.9225 29.5046 54.703 28.6841 54.3435 27.3689C53.2615 23.4009 53.1642 18.3091 53.368 14C51.8918 14.4633 50.1071 14.4633 48.6303 14C48.8355 18.3091 48.7382 23.4009 47.6555 27.3689C47.296 28.6841 46.0757 29.4995 44.7456 29.3139C43.3908 29.1217 42.4167 27.971 42.4307 26.5783C42.463 23.2642 41.7547 19.0058 38.1998 17.5327C38.1005 17.492 38.0052 17.4394 37.9165 17.3774C37.8995 17.3681 37.2912 16.9989 36.1803 16.9989Z", fill }), /* @__PURE__ */ React.createElement("path", { d: "M84.6498 87.4291C84.9166 87.9658 85.4487 88.2747 86.0022 88.2747C86.2294 88.2747 86.4588 88.2218 86.6784 88.111C87.4224 87.7317 87.7246 86.8098 87.3518 86.0516C87.2224 85.7928 84.453 80.2561 79.9153 79.2201C80.1595 77.8845 81.332 76.8689 82.7373 76.8689C83.5298 76.8689 84.1722 76.228 84.1722 75.4349C84.1722 74.6411 83.5298 74 82.7373 74C79.8199 74 77.4041 76.189 77.0458 79.0105C73.6134 78.79 71.2166 77.7314 69.9097 75.8554C67.5562 72.4766 69.2875 67.321 69.3153 67.2441C70.3142 64.1888 70.1099 61.6344 68.7062 59.6518C66.1504 56.0415 60.5696 56 60.3326 56C59.4992 56 58.8229 56.6868 58.8229 57.5367C58.8229 58.3872 59.4992 59.0742 60.3326 59.0742C60.3748 59.0742 64.6206 59.1385 66.257 61.4495C67.0608 62.5843 67.1259 64.2092 66.4601 66.244C66.3659 66.5127 64.1827 72.9258 67.4349 77.6151C69.5092 80.6111 73.2166 82.1283 78.4509 82.1283C81.3831 82.1283 83.9194 85.9536 84.6498 87.4291Z", fill }), /* @__PURE__ */ React.createElement("path", { d: "M89.7985 72.5485C85.2478 72.5485 81.8036 71.2381 79.56 68.6525C76.493 65.1153 76.8527 60.4541 76.9485 59.6012V51.6681C76.947 51.4106 76.8588 45.2984 72.1939 45.2434C71.5945 48.6383 69.2546 51.1782 66.4684 51.1782C65.6578 51.1782 65 50.4947 65 49.6482C65 48.8024 65.6578 48.1186 66.4684 48.1186C67.888 48.1186 69.1114 46.4468 69.3593 44.3204C67.6203 43.2257 65.7054 40.8332 65.7054 35.6052C65.7054 34.7178 66.4249 34 67.3115 34C68.1982 34 68.9182 34.7178 68.9182 35.6052C68.9182 41.6993 71.8334 42.014 72.1657 42.0303C78.1814 42.0303 79.9908 47.7487 80.1496 51.1726C83.5912 51.9176 86.1782 54.9868 86.1782 58.6488C86.1782 59.4946 85.4932 60.1782 84.6482 60.1782C83.8036 60.1782 83.1186 59.4946 83.1186 58.6488C83.1186 56.6924 81.8884 55.018 80.1613 54.3587V59.6993C80.1613 59.7744 80.1562 59.8518 80.1451 59.9271L80.1444 59.9332C80.1243 60.1099 79.6906 63.9199 82.0055 66.5688C83.6116 68.4062 86.2333 69.338 89.7985 69.338C90.6852 69.338 91.4044 70.0558 91.4044 70.9447C91.4044 71.8323 90.6852 72.5485 89.7985 72.5485Z", fill }), /* @__PURE__ */ React.createElement("path", { d: "M17.7546 87.4291C17.4879 87.9658 16.9558 88.2747 16.4022 88.2747C16.175 88.2747 15.9457 88.2218 15.7261 88.111C14.982 87.7317 14.6798 86.8098 15.0526 86.0516C15.182 85.7928 17.9514 80.2561 22.4892 79.2201C22.2449 77.8845 21.0724 76.8689 19.6672 76.8689C18.8746 76.8689 18.2323 76.228 18.2323 75.4349C18.2323 74.6411 18.8746 74 19.6672 74C22.5846 74 25.0003 76.189 25.3586 79.0105C28.7911 78.79 31.1878 77.7314 32.4948 75.8554C34.8483 72.4766 33.117 67.321 33.0891 67.2441C32.0902 64.1888 32.2945 61.6344 33.6982 59.6518C36.2541 56.0415 41.8349 56 42.0718 56C42.9053 56 43.5816 56.6868 43.5816 57.5367C43.5816 58.3872 42.9053 59.0742 42.0718 59.0742C42.0296 59.0742 37.7838 59.1385 36.1475 61.4495C35.3436 62.5843 35.2785 64.2092 35.9444 66.244C36.0386 66.5127 38.2218 72.9258 34.9696 77.6151C32.8953 80.6111 29.1878 82.1283 23.9536 82.1283C21.0213 82.1283 18.485 85.9536 17.7546 87.4291Z", fill }), /* @__PURE__ */ React.createElement("path", { d: "M12.6059 72.5485C17.1567 72.5485 20.6008 71.2381 22.8445 68.6525C25.9114 65.1153 25.5518 60.4541 25.4559 59.6012V51.6681C25.4574 51.4106 25.5457 45.2984 30.2106 45.2434C30.8099 48.6383 33.1498 51.1782 35.936 51.1782C36.7467 51.1782 37.4044 50.4947 37.4044 49.6482C37.4044 48.8024 36.7467 48.1186 35.936 48.1186C34.5165 48.1186 33.293 46.4468 33.0451 44.3204C34.7842 43.2257 36.699 40.8332 36.699 35.6052C36.699 34.7178 35.9796 34 35.0929 34C34.2063 34 33.4863 34.7178 33.4863 35.6052C33.4863 41.6993 30.571 42.014 30.2388 42.0303C24.223 42.0303 22.4136 47.7487 22.2549 51.1726C18.8133 51.9176 16.2262 54.9868 16.2262 58.6488C16.2262 59.4946 16.9112 60.1782 17.7563 60.1782C18.6008 60.1782 19.2858 59.4946 19.2858 58.6488C19.2858 56.6924 20.5161 55.018 22.2431 54.3587V59.6993C22.2431 59.7744 22.2482 59.8518 22.2594 59.9271L22.26 59.9332C22.2801 60.1099 22.7139 63.9199 20.3989 66.5688C18.7928 68.4062 16.1712 69.338 12.6059 69.338C11.7193 69.338 11 70.0558 11 70.9447C11 71.8323 11.7193 72.5485 12.6059 72.5485Z", fill }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M50.9996 10.8039C47.1513 10.8039 44.1368 8.65131 44.1368 5.90196C44.1368 3.15261 47.1513 1 50.9996 1C54.8478 1 57.8623 3.15261 57.8623 5.90196C57.8623 8.65131 54.8478 10.8039 50.9996 10.8039ZM50.9981 4.26881C48.9031 4.26881 47.5663 5.23542 47.5663 5.90261C47.5663 6.56922 48.9031 7.5364 50.9981 7.5364C53.0922 7.5364 54.429 6.56922 54.429 5.90261C54.429 5.23542 53.0908 4.26881 50.9981 4.26881Z", stroke: fill }), /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M11.0249 102C10.8147 102 10.6038 101.989 10.3905 101.969C7.85485 101.731 5.61512 100.113 4.54115 97.7453C-0.193879 87.2821 -0.180767 73.4447 4.58303 56.6141C8.09497 44.2052 12.894 34.9532 13.0981 34.5664C19.3498 20.7824 25.8251 12.8329 32.3014 11.0185C35.6466 10.0836 37.859 11.142 38.5139 11.5288C42.0288 13.0399 44.1762 16.2603 44.829 20.932C45.4008 16.583 45.2104 11.5628 44.8969 7.74415C44.8351 6.99899 45.2685 6.30266 45.9595 6.03385C46.6513 5