@lightsparkdev/ui 1.0.7 → 1.0.9

package/dist/chunk-JX6HEEEQ.cjs

@@ -0,0 +1,542 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+
+var _chunkSDDC5AVTcjs = require('./chunk-SDDC5AVT.cjs');
+
+
+
+var _chunk73EJLMPTcjs = require('./chunk-73EJLMPT.cjs');
+
+
+var _chunkDCQM7IVKcjs = require('./chunk-DCQM7IVK.cjs');
+
+
+var _chunkKW3JYLRIcjs = require('./chunk-KW3JYLRI.cjs');
+
+
+
+
+
+var _chunkO7USIZI6cjs = require('./chunk-O7USIZI6.cjs');
+
+
+
+var _chunkYM5JDZDQcjs = require('./chunk-YM5JDZDQ.cjs');
+
+// src/styles/themes.tsx
+var _react = require('@emotion/react');
+var _deepmerge = require('deepmerge'); var _deepmerge2 = _interopRequireDefault(_deepmerge);
+var Themes = /* @__PURE__ */ ((Themes2) => {
+  Themes2["Light"] = "light";
+  Themes2["Dark"] = "dark";
+  Themes2["LightsparkDocsLight"] = "lightsparkDocsLight";
+  Themes2["LightsparkDocsDark"] = "lightsparkDocsDark";
+  Themes2["UmaAuthSdkLight"] = "umaAuthSdkLight";
+  Themes2["UmaAuthSdkDark"] = "umaAuthSdkDark";
+  Themes2["UmameDocsLight"] = "umameDocsLight";
+  Themes2["UmameDocsDark"] = "umameDocsDark";
+  Themes2["BridgeLight"] = "bridgeLight";
+  Themes2["BridgeDark"] = "bridgeDark";
+  return Themes2;
+})(Themes || {});
+var baseThemeColors = {
+  bg: _chunkO7USIZI6cjs.colors.white,
+  smBg: _chunkO7USIZI6cjs.colors.white,
+  c05Neutral: _chunkO7USIZI6cjs.colors.gray95,
+  c1Neutral: _chunkO7USIZI6cjs.colors.gray90,
+  c15Neutral: _chunkO7USIZI6cjs.colors.gray85,
+  c2Neutral: _chunkO7USIZI6cjs.colors.gray80,
+  c25Neutral: _chunkO7USIZI6cjs.colors.gray75,
+  c3Neutral: _chunkO7USIZI6cjs.colors.gray70,
+  c4Neutral: _chunkO7USIZI6cjs.colors.gray60,
+  c5Neutral: _chunkO7USIZI6cjs.colors.gray50,
+  c6Neutral: _chunkO7USIZI6cjs.colors.gray40,
+  c7Neutral: _chunkO7USIZI6cjs.colors.gray30,
+  c8Neutral: _chunkO7USIZI6cjs.colors.gray20,
+  c9Neutral: _chunkO7USIZI6cjs.colors.gray10,
+  danger: _chunkO7USIZI6cjs.colors.danger,
+  hcNeutral: _chunkO7USIZI6cjs.colors.black,
+  info: _chunkO7USIZI6cjs.colors.blue43,
+  lcNeutral: _chunkO7USIZI6cjs.colors.gray80,
+  link: _chunkO7USIZI6cjs.colors.blue43,
+  mcNeutral: _chunkO7USIZI6cjs.colors.gray40,
+  onInfoText: _chunkO7USIZI6cjs.colors.white,
+  onPrimaryText: _chunkO7USIZI6cjs.colors.black,
+  onSuccessText: _chunkO7USIZI6cjs.colors.white,
+  primary: _chunkO7USIZI6cjs.colors.primary,
+  secondary: _chunkO7USIZI6cjs.colors.secondary,
+  tertiary: _chunkO7USIZI6cjs.colors.black,
+  success: _chunkO7USIZI6cjs.colors.success,
+  text: _chunkO7USIZI6cjs.colors.black,
+  vlcNeutral: _chunkO7USIZI6cjs.colors.gray95,
+  warning: _chunkO7USIZI6cjs.colors.warning
+};
+var themeOrColorKeyValues = [
+  ...Object.keys(baseThemeColors),
+  ...Object.keys(_chunkO7USIZI6cjs.colors)
+];
+var baseTheme = _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, baseThemeColors), {
+  // base type should be Themes but default to Light
+  type: "light" /* Light */,
+  typography: _chunkDCQM7IVKcjs.getTypography.call(void 0, "Lightspark" /* Lightspark */),
+  hcNeutralFromBg: (bgHex) => _chunkO7USIZI6cjs.hcNeutralFromBg.call(void 0, bgHex, _chunkO7USIZI6cjs.colors.black, _chunkO7USIZI6cjs.colors.white),
+  buttons: _chunkSDDC5AVTcjs.defaultButtonsTheme,
+  loading: _chunk73EJLMPTcjs.defaultLoadingTheme,
+  badge: {
+    bg: "c05Neutral"
+  },
+  inputBackground: _chunkO7USIZI6cjs.colors.white
+});
+var lightBaseTheme = baseTheme;
+var darkBaseTheme = {
+  type: "dark" /* Dark */,
+  bg: _chunkO7USIZI6cjs.colors.black,
+  smBg: _chunkO7USIZI6cjs.colors.black,
+  c05Neutral: _chunkO7USIZI6cjs.colors.gray5,
+  c1Neutral: _chunkO7USIZI6cjs.colors.gray10,
+  c15Neutral: _chunkO7USIZI6cjs.colors.gray15,
+  c2Neutral: _chunkO7USIZI6cjs.colors.gray20,
+  c25Neutral: _chunkO7USIZI6cjs.colors.gray25,
+  c3Neutral: _chunkO7USIZI6cjs.colors.gray30,
+  c4Neutral: _chunkO7USIZI6cjs.colors.gray40,
+  c5Neutral: _chunkO7USIZI6cjs.colors.gray50,
+  c6Neutral: _chunkO7USIZI6cjs.colors.gray60,
+  c7Neutral: _chunkO7USIZI6cjs.colors.gray70,
+  c8Neutral: _chunkO7USIZI6cjs.colors.gray80,
+  c9Neutral: _chunkO7USIZI6cjs.colors.gray90,
+  danger: _chunkO7USIZI6cjs.colors.danger,
+  hcNeutral: _chunkO7USIZI6cjs.colors.white,
+  hcNeutralFromBg: (bgHex) => _chunkO7USIZI6cjs.hcNeutralFromBg.call(void 0, bgHex, _chunkO7USIZI6cjs.colors.white, _chunkO7USIZI6cjs.colors.black),
+  info: _chunkO7USIZI6cjs.colors.white,
+  lcNeutral: _chunkO7USIZI6cjs.colors.gray40,
+  link: _chunkO7USIZI6cjs.colors.blue43,
+  mcNeutral: _chunkO7USIZI6cjs.colors.gray60,
+  onInfoText: _chunkO7USIZI6cjs.colors.white,
+  onPrimaryText: _chunkO7USIZI6cjs.colors.black,
+  onSuccessText: _chunkO7USIZI6cjs.colors.white,
+  primary: _chunkO7USIZI6cjs.colors.primary,
+  secondary: _chunkO7USIZI6cjs.colors.secondary,
+  tertiary: _chunkO7USIZI6cjs.colors.white,
+  success: _chunkO7USIZI6cjs.colors.success,
+  text: _chunkO7USIZI6cjs.colors.white,
+  typography: _chunkDCQM7IVKcjs.getTypography.call(void 0, "Lightspark" /* Lightspark */),
+  vlcNeutral: _chunkO7USIZI6cjs.colors.gray20,
+  warning: _chunkO7USIZI6cjs.colors.warning,
+  buttons: _chunkSDDC5AVTcjs.defaultButtonsTheme,
+  loading: _chunk73EJLMPTcjs.defaultLoadingTheme,
+  inputBackground: _chunkO7USIZI6cjs.colors.black,
+  badge: {
+    bg: "c15Neutral"
+  }
+};
+var lightTheme = extend(lightBaseTheme, {
+  header: extendBase(lightBaseTheme, {
+    text: _chunkO7USIZI6cjs.colors.gray60
+  }),
+  nav: extendBase(lightBaseTheme, {
+    text: _chunkO7USIZI6cjs.colors.gray10,
+    secondary: _chunkO7USIZI6cjs.colors.gray40
+  }),
+  content: extendBase(lightBaseTheme, {
+    bg: _chunkO7USIZI6cjs.colors.white,
+    smBg: _chunkO7USIZI6cjs.colors.white
+  }),
+  controls: extendBase(lightBaseTheme, {
+    bg: _chunkO7USIZI6cjs.colors.gray95,
+    smBg: _chunkO7USIZI6cjs.colors.gray95,
+    text: _chunkO7USIZI6cjs.colors.gray60,
+    secondary: _chunkO7USIZI6cjs.colors.secondary
+  })
+});
+var darkTheme = extend(darkBaseTheme, {
+  header: extendBase(darkBaseTheme, {}),
+  nav: extendBase(darkBaseTheme, {}),
+  content: extendBase(darkBaseTheme, {}),
+  controls: extendBase(darkBaseTheme, {
+    bg: _chunkO7USIZI6cjs.colors.gray40,
+    smBg: _chunkO7USIZI6cjs.colors.gray40,
+    text: _chunkO7USIZI6cjs.colors.white,
+    secondary: _chunkO7USIZI6cjs.colors.secondary
+  })
+});
+var umaAuthSdkLightTheme = extend(lightTheme, {
+  type: "umaAuthSdkLight" /* UmaAuthSdkLight */,
+  bg: _chunkO7USIZI6cjs.colors.gray98,
+  smBg: _chunkO7USIZI6cjs.colors.gray98,
+  secondary: _chunkO7USIZI6cjs.colors.grayBlue43,
+  tertiary: _chunkO7USIZI6cjs.colors.grayBlue9,
+  text: _chunkO7USIZI6cjs.colors.grayBlue9,
+  link: _chunkO7USIZI6cjs.colors.blue39,
+  inputBackground: _chunkO7USIZI6cjs.colors.white,
+  typography: _chunkDCQM7IVKcjs.getTypography.call(void 0, "UmaAuthSdk" /* UmaAuthSdk */, {
+    main: "Manrope",
+    code: "Monaco"
+  }),
+  content: extendBase(lightBaseTheme, {
+    bg: _chunkO7USIZI6cjs.colors.gray98,
+    smBg: _chunkO7USIZI6cjs.colors.gray98,
+    text: _chunkO7USIZI6cjs.colors.grayBlue9,
+    secondary: _chunkO7USIZI6cjs.colors.grayBlue43
+  }),
+  controls: extendBase(lightBaseTheme, {
+    text: _chunkO7USIZI6cjs.colors.grayBlue9,
+    secondary: _chunkO7USIZI6cjs.colors.grayBlue43,
+    bg: _chunkO7USIZI6cjs.colors.grayBlue94
+  }),
+  buttons: _deepmerge2.default.call(void 0, _chunkSDDC5AVTcjs.buttonsThemeBase, {
+    defaultTypographyType: "Title",
+    defaultSize: "Medium",
+    defaultBorderRadius: 999,
+    defaultBorderWidth: 0,
+    defaultPaddingsY: {
+      ExtraSmall: 16,
+      Small: 16,
+      Schmedium: 16,
+      Medium: 16,
+      Mlarge: 16,
+      Large: 16
+    },
+    kinds: {
+      primary: {
+        defaultColor: "bg",
+        defaultBackgroundColor: "blue39",
+        defaultHoverBackgroundColor: "blue37"
+      },
+      ghost: {
+        defaultColor: "secondary",
+        defaultBackgroundColor: "transparent",
+        defaultBorderWidth: 0,
+        defaultHoverBackgroundColor: "transparent",
+        defaultHoverBorderColor: "transparent"
+      },
+      secondary: {
+        defaultBackgroundColor: "grayBlue94",
+        defaultHoverBackgroundColor: "grayBlue80",
+        defaultBorderColor: "grayBlue80"
+      },
+      tertiary: {
+        defaultColor: "bg",
+        defaultHoverBackgroundColor: "grayBlue18"
+      }
+    }
+  })
+});
+var umaAuthSdkDarkTheme = extend(darkTheme, {
+  type: "umaAuthSdkDark" /* UmaAuthSdkDark */,
+  bg: _chunkO7USIZI6cjs.colors.gray5,
+  smBg: _chunkO7USIZI6cjs.colors.gray5,
+  secondary: _chunkO7USIZI6cjs.colors.grayBlue57,
+  tertiary: _chunkO7USIZI6cjs.colors.gray98,
+  text: _chunkO7USIZI6cjs.colors.gray98,
+  link: _chunkO7USIZI6cjs.colors.blue39,
+  inputBackground: _chunkO7USIZI6cjs.colors.gray5,
+  typography: _chunkDCQM7IVKcjs.getTypography.call(void 0, "UmaAuthSdk" /* UmaAuthSdk */, {
+    main: "Manrope",
+    code: "Monaco"
+  }),
+  content: extendBase(lightBaseTheme, {
+    bg: _chunkO7USIZI6cjs.colors.gray5,
+    smBg: _chunkO7USIZI6cjs.colors.gray5,
+    text: _chunkO7USIZI6cjs.colors.grayBlue94,
+    secondary: _chunkO7USIZI6cjs.colors.grayBlue43
+  }),
+  controls: extendBase(lightBaseTheme, {
+    text: _chunkO7USIZI6cjs.colors.grayBlue94,
+    secondary: _chunkO7USIZI6cjs.colors.grayBlue43,
+    bg: _chunkO7USIZI6cjs.colors.grayBlue9
+  }),
+  buttons: _deepmerge2.default.call(void 0, _chunkSDDC5AVTcjs.buttonsThemeBase, {
+    defaultTypographyType: "Title",
+    defaultSize: "Medium",
+    defaultBorderRadius: 999,
+    defaultBorderWidth: 0,
+    defaultPaddingsY: {
+      ExtraSmall: 16,
+      Small: 16,
+      Schmedium: 16,
+      Medium: 16,
+      Mlarge: 16,
+      Large: 16
+    },
+    kinds: {
+      primary: {
+        defaultColor: "bg",
+        defaultBackgroundColor: "blue39",
+        defaultHoverBackgroundColor: "blue37"
+      },
+      ghost: {
+        defaultColor: "secondary",
+        defaultBackgroundColor: "transparent",
+        defaultBorderWidth: 0,
+        defaultHoverBackgroundColor: "transparent",
+        defaultHoverBorderColor: "transparent"
+      },
+      secondary: {
+        defaultBackgroundColor: "grayBlue80",
+        defaultHoverBackgroundColor: "grayBlue94",
+        defaultBorderColor: "grayBlue80"
+      },
+      tertiary: {
+        defaultColor: "bg",
+        defaultHoverBackgroundColor: "grayBlue80"
+      }
+    }
+  })
+});
+var umameDocsLightTheme = extend(lightTheme, {
+  type: "umameDocsLight" /* UmameDocsLight */,
+  bg: _chunkO7USIZI6cjs.colors.gray98,
+  smBg: _chunkO7USIZI6cjs.colors.gray98,
+  secondary: _chunkO7USIZI6cjs.colors.grayBlue43,
+  text: _chunkO7USIZI6cjs.colors.grayBlue9,
+  link: _chunkO7USIZI6cjs.colors.blue39,
+  inputBackground: _chunkO7USIZI6cjs.colors.white,
+  typography: _chunkDCQM7IVKcjs.getTypography.call(void 0, "UmameDocs" /* UmameDocs */, {
+    main: "Manrope",
+    code: "Monaco"
+  }),
+  content: extendBase(lightBaseTheme, {
+    bg: _chunkO7USIZI6cjs.colors.gray98,
+    smBg: _chunkO7USIZI6cjs.colors.gray98,
+    text: _chunkO7USIZI6cjs.colors.grayBlue9,
+    secondary: _chunkO7USIZI6cjs.colors.grayBlue43
+  }),
+  controls: extendBase(lightBaseTheme, {
+    text: _chunkO7USIZI6cjs.colors.grayBlue9,
+    secondary: _chunkO7USIZI6cjs.colors.grayBlue43,
+    bg: _chunkO7USIZI6cjs.colors.grayBlue94
+  })
+});
+var umameDocsDarkTheme = extend(darkTheme, {
+  type: "umameDocsDark" /* UmameDocsDark */,
+  bg: _chunkO7USIZI6cjs.colors.gray98,
+  smBg: _chunkO7USIZI6cjs.colors.gray98,
+  secondary: _chunkO7USIZI6cjs.colors.grayBlue43,
+  text: _chunkO7USIZI6cjs.colors.grayBlue9,
+  link: _chunkO7USIZI6cjs.colors.blue39,
+  typography: _chunkDCQM7IVKcjs.getTypography.call(void 0, "UmameDocs" /* UmameDocs */, {
+    main: "Manrope",
+    code: "Monaco"
+  })
+});
+var lightsparkDocsLightTheme = extend(lightTheme, {
+  type: "lightsparkDocsLight" /* LightsparkDocsLight */,
+  typography: _chunkDCQM7IVKcjs.getTypography.call(void 0, "LightsparkDocs" /* LightsparkDocs */)
+});
+var lightsparkDocsDarkTheme = extend(darkTheme, {
+  type: "lightsparkDocsDark" /* LightsparkDocsDark */,
+  typography: _chunkDCQM7IVKcjs.getTypography.call(void 0, "LightsparkDocs" /* LightsparkDocs */)
+});
+var bridgeBaseSettings = {
+  secondary: _chunkO7USIZI6cjs.colors.grayBlue43,
+  mcNeutral: _chunkO7USIZI6cjs.colors.grayBlue43,
+  typography: _chunkDCQM7IVKcjs.getTypography.call(void 0, "Bridge" /* Bridge */, {
+    main: "Manrope",
+    code: "Monaco"
+  }),
+  buttons: _deepmerge2.default.call(void 0, _chunkSDDC5AVTcjs.buttonsThemeBase, {
+    defaultTypographyType: "Title",
+    defaultSize: "Medium",
+    defaultBorderRadius: 8,
+    defaultBorderWidth: 0,
+    defaultPaddingsY: {
+      ExtraSmall: 14,
+      Small: 14,
+      Schmedium: 14,
+      Medium: 14,
+      Mlarge: 14,
+      Large: 14
+    },
+    kinds: {
+      primary: {
+        defaultColor: "bg",
+        defaultBackgroundColor: "blue39",
+        defaultHoverBackgroundColor: "blue37"
+      },
+      ghost: {
+        defaultColor: "secondary",
+        defaultBackgroundColor: "transparent",
+        defaultBorderWidth: 0,
+        defaultHoverBackgroundColor: "transparent",
+        defaultHoverBorderColor: "transparent"
+      },
+      secondary: {
+        defaultBackgroundColor: "transparent",
+        defaultHoverBackgroundColor: "grayBlue94",
+        defaultBorderColor: "grayBlue80",
+        defaultBorderWidth: 1
+      }
+    }
+  }),
+  loading: _deepmerge2.default.call(void 0, _chunk73EJLMPTcjs.loadingThemeBase, {
+    defaultIconName: "UmaBridgeLoading",
+    kinds: {
+      primary: {
+        defaultIconName: "UmaBridgeLoading"
+      },
+      secondary: {
+        defaultIconName: "UmaBridgeLoadingTransparent"
+      }
+    }
+  }),
+  badge: {
+    bg: "grayBlue94"
+  }
+};
+var bridgeLightTheme = extend(lightTheme, _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, bridgeBaseSettings), {
+  type: "bridgeLight" /* BridgeLight */,
+  bg: _chunkO7USIZI6cjs.colors.gray98,
+  smBg: _chunkO7USIZI6cjs.colors.gray98,
+  text: _chunkO7USIZI6cjs.colors.grayBlue9,
+  secondary: _chunkO7USIZI6cjs.colors.grayBlue43,
+  inputBackground: _chunkO7USIZI6cjs.colors.white
+}));
+var bridgeDarkTheme = extend(darkTheme, _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, bridgeBaseSettings), {
+  type: "bridgeDark" /* BridgeDark */
+}));
+var themes = {
+  ["light" /* Light */]: lightTheme,
+  ["dark" /* Dark */]: darkTheme,
+  ["lightsparkDocsLight" /* LightsparkDocsLight */]: lightsparkDocsLightTheme,
+  ["lightsparkDocsDark" /* LightsparkDocsDark */]: lightsparkDocsDarkTheme,
+  ["umaAuthSdkLight" /* UmaAuthSdkLight */]: umaAuthSdkLightTheme,
+  ["umaAuthSdkDark" /* UmaAuthSdkDark */]: umaAuthSdkDarkTheme,
+  ["umameDocsLight" /* UmameDocsLight */]: umameDocsLightTheme,
+  ["umameDocsDark" /* UmameDocsDark */]: umameDocsDarkTheme,
+  ["bridgeLight" /* BridgeLight */]: bridgeLightTheme,
+  ["bridgeDark" /* BridgeDark */]: bridgeDarkTheme
+};
+function extend(obj, rest) {
+  return _chunkYM5JDZDQcjs.__spreadValues.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, obj), rest);
+}
+function extendBase(obj, rest) {
+  return _chunkYM5JDZDQcjs.__spreadValues.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, obj), rest);
+}
+function setFonts(theme, fontFamilies) {
+  return _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, theme), {
+    typography: _chunkDCQM7IVKcjs.getTypography.call(void 0, theme.typography.group, fontFamilies)
+  });
+}
+function isThemeColorKey(key) {
+  return Boolean(key && typeof key === "string" && key in baseThemeColors);
+}
+function isThemeOrColorKey(key) {
+  return Boolean(
+    typeof key === "string" && (isThemeColorKey(key) || _chunkO7USIZI6cjs.isColorKey.call(void 0, key) || Array.isArray(key) && key.length === 2 && isThemeColorKey(key[1]))
+  );
+}
+function getColor(theme, key) {
+  if (key && isThemeColorKey(key)) {
+    return theme[key];
+  } else if (key && Array.isArray(key)) {
+    const [surface, colorKey] = key;
+    const surfaceTheme = theme[surface];
+    const color = surfaceTheme[colorKey];
+    return color;
+  } else if (key && _chunkO7USIZI6cjs.isColorKey.call(void 0, key)) {
+    return _chunkO7USIZI6cjs.colors[key];
+  }
+  return theme.text;
+}
+function getFontColor(theme, key, defaultColor = "inherit") {
+  if (key === "inherit" || !key && defaultColor === "inherit") {
+    return "inherit";
+  }
+  return getColor(theme, key);
+}
+function isBackgroundColorKey(key) {
+  return key === "transparent" || isThemeOrColorKey(key);
+}
+function isBackgroundColorKeyTuple(key) {
+  return Array.isArray(key) && key.length === 2 && isBackgroundColorKey(key[0]) && isBackgroundColorKey(key[1]);
+}
+function getBackgroundColor(theme, key, defaultColor = "transparent") {
+  if (isBackgroundColorKeyTuple(key)) {
+    key = isLight(theme) ? key[0] : key[1];
+  }
+  if (isBackgroundColorKeyTuple(defaultColor)) {
+    defaultColor = isLight(theme) ? defaultColor[0] : defaultColor[1];
+  }
+  if (key === "transparent") {
+    return "transparent";
+  } else if (!key) {
+    if (defaultColor === "transparent") {
+      return "transparent";
+    }
+    return getColor(theme, defaultColor);
+  }
+  return getColor(theme, key);
+}
+var isDark = (theme) => [
+  "dark" /* Dark */,
+  "bridgeDark" /* BridgeDark */,
+  "lightsparkDocsDark" /* LightsparkDocsDark */,
+  "umameDocsDark" /* UmameDocsDark */,
+  "umaAuthSdkDark" /* UmaAuthSdkDark */
+].includes(theme.type);
+var isLight = (theme) => [
+  "light" /* Light */,
+  "bridgeLight" /* BridgeLight */,
+  "lightsparkDocsLight" /* LightsparkDocsLight */,
+  "umameDocsLight" /* UmameDocsLight */,
+  "umaAuthSdkLight" /* UmaAuthSdkLight */
+].includes(theme.type);
+var themeOr = (lightValue, darkValue) => ({ theme }) => {
+  return isLight(theme) ? lightValue : darkValue;
+};
+var themeOrWithKey = (lightValue, darkValue) => ({ theme }) => {
+  if (isLight(theme)) {
+    return getColor(theme, lightValue);
+  }
+  return getColor(theme, darkValue);
+};
+function ifLight(style) {
+  return function({ theme }) {
+    if (theme.type === "light" /* Light */) {
+      return _react.css`
+        ${style}
+      `;
+    }
+    return "";
+  };
+}
+function ifDark(style) {
+  return function({ theme }) {
+    if (theme.type === "dark" /* Dark */) {
+      return _react.css`
+        ${style}
+      `;
+    }
+    return "";
+  };
+}
+function useThemeBg() {
+  const theme = _react.useTheme.call(void 0, );
+  const bp = _chunkKW3JYLRIcjs.useBreakpoints.call(void 0, );
+  const isSm = bp.current("sm" /* sm */);
+  if (isDark(theme)) {
+    return _chunkO7USIZI6cjs.darkGradient;
+  }
+  return isSm ? theme.smBg : theme.bg;
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+exports.Themes = Themes; exports.themeOrColorKeyValues = themeOrColorKeyValues; exports.themes = themes; exports.setFonts = setFonts; exports.isThemeColorKey = isThemeColorKey; exports.isThemeOrColorKey = isThemeOrColorKey; exports.getColor = getColor; exports.getFontColor = getFontColor; exports.isBackgroundColorKey = isBackgroundColorKey; exports.isBackgroundColorKeyTuple = isBackgroundColorKeyTuple; exports.getBackgroundColor = getBackgroundColor; exports.isDark = isDark; exports.isLight = isLight; exports.themeOr = themeOr; exports.themeOrWithKey = themeOrWithKey; exports.ifLight = ifLight; exports.ifDark = ifDark; exports.useThemeBg = useThemeBg;

package/dist/{chunk-UACBVBBE.js → chunk-K3DMPJSX.js}

@@ -1,19 +1,19 @@
-import {
-  isString
-} from "./chunk-EDN2QDCB.js";
 import {
   icons_exports
-} from "./chunk-Y6Q37DGW.js";
+} from "./chunk-FQNP43IR.js";
 import {
   invertFillColor,
   invertStrokeColor
 } from "./chunk-VI6WTKMV.js";
 import {
   rootFontSizePx
-} from "./chunk-GMM3LRXY.js";
+} from "./chunk-ZMK4RE5I.js";
 import {
   getFontColor
-} from "./chunk-I4NIA4SD.js";
+} from "./chunk-GZW6KBUI.js";
+import {
+  isString
+} from "./chunk-EDN2QDCB.js";
 
 // src/components/Icon/Icon.tsx
 import styled from "@emotion/styled";
@@ -23,6 +23,7 @@ function Icon({
   name,
   width,
   tutorialStep,
+  id,
   mr = 0,
   ml = 0,
   color = void 0,
@@ -36,6 +37,7 @@ function Icon({
   return /* @__PURE__ */ jsx(
     IconContainer,
     {
+      id,
       className,
       w,
       mr: mrRems,

package/dist/{chunk-7NAL5XO6.cjs → chunk-KM26ZJYZ.cjs}

@@ -1,13 +1,13 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunkANP2OU53cjs = require('./chunk-ANP2OU53.cjs');
+var _chunkUGGHTD3Vcjs = require('./chunk-UGGHTD3V.cjs');
 
 
 
-var _chunkQR6XKKRKcjs = require('./chunk-QR6XKKRK.cjs');
+var _chunkNVVAOGNLcjs = require('./chunk-NVVAOGNL.cjs');
 
 
-var _chunkCB3IFR2Xcjs = require('./chunk-CB3IFR2X.cjs');
+var _chunkI6Y7IHF5cjs = require('./chunk-I6Y7IHF5.cjs');
 
 // src/components/FileInput.tsx
 var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
@@ -59,7 +59,7 @@ function FileInput({
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, StyledFileInputContainer, { children: [
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, StyledFileInput, { hasValidFileSet: Boolean(fileName && fileContent), children: [
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { htmlFor: name, children: fileName && fileContent ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        _chunkANP2OU53cjs.Pill,
+        _chunkUGGHTD3Vcjs.Pill,
         {
           text: fileName,
           cursor: "pointer",
@@ -67,7 +67,7 @@ function FileInput({
           onDeleteFromKeyboard: handleRemoveFile
         }
       ) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _react.Fragment, { children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkCB3IFR2Xcjs.Icon, { name: "Upload", width: 26, tutorialStep: 6 }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkI6Y7IHF5cjs.Icon, { name: "Upload", width: 26, tutorialStep: 6 }),
         "Upload ",
         filePurpose || "",
         " file"
@@ -82,7 +82,7 @@ function FileInput({
         }
       )
     ] }),
-    fileErrorMsg ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkQR6XKKRKcjs.InputSubtext, { text: fileErrorMsg, hasError: true }) : null
+    fileErrorMsg ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNVVAOGNLcjs.InputSubtext, { text: fileErrorMsg, hasError: true }) : null
   ] });
 }
 var StyledFileInputContainer = _styled2.default.div``;
@@ -94,7 +94,7 @@ var StyledFileInput = _styled2.default.div`
   label {
     display: block;
     cursor: pointer;
-    ${({ theme, hasValidFileSet }) => _chunkQR6XKKRKcjs.inputBlockStyle.call(void 0, { theme, hasValue: hasValidFileSet, hasError: false })}
+    ${({ theme, hasValidFileSet }) => _chunkNVVAOGNLcjs.inputBlockStyle.call(void 0, { theme, hasValue: hasValidFileSet, hasError: false })}
   }
 `;