@helpwave/hightide 0.1.6 → 0.1.7

package/dist/components/loading-states/LoadingAnimation.js

@@ -1,8 +1,43 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/loading-states/LoadingAnimation.tsx
+var LoadingAnimation_exports = {};
+__export(LoadingAnimation_exports, {
+  LoadingAnimation: () => LoadingAnimation
+});
+module.exports = __toCommonJS(LoadingAnimation_exports);
+
 // src/localization/LanguageProvider.tsx
-import { createContext, useContext, useEffect as useEffect2, useState as useState2 } from "react";
+var import_react2 = require("react");
 
 // src/hooks/useLocalStorage.ts
-import { useCallback, useEffect, useState } from "react";
+var import_react = require("react");
 
 // src/localization/util.ts
 var languages = ["en", "de"];
@@ -18,12 +53,12 @@ var LanguageUtil = {
 };
 
 // src/localization/LanguageProvider.tsx
-import { jsx } from "react/jsx-runtime";
-var LanguageContext = createContext({
+var import_jsx_runtime = require("react/jsx-runtime");
+var LanguageContext = (0, import_react2.createContext)({
   language: LanguageUtil.DEFAULT_LANGUAGE,
   setLanguage: (v) => v
 });
-var useLanguage = () => useContext(LanguageContext);
+var useLanguage = () => (0, import_react2.useContext)(LanguageContext);
 
 // src/localization/useTranslation.ts
 var useTranslation = (defaults, translationOverwrite = {}) => {
@@ -38,11 +73,11 @@ var useTranslation = (defaults, translationOverwrite = {}) => {
 };
 
 // src/components/loading-states/LoadingAnimation.tsx
-import clsx2 from "clsx";
+var import_clsx2 = __toESM(require("clsx"));
 
 // src/components/icons-and-geometry/Helpwave.tsx
-import { clsx } from "clsx";
-import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+var import_clsx = require("clsx");
+var import_jsx_runtime2 = require("react/jsx-runtime");
 var Helpwave = ({
   color = "currentColor",
   animate = "none",
@@ -60,7 +95,7 @@ var Helpwave = ({
     console.error("size cannot be less than 0");
     size = 64;
   }
-  return /* @__PURE__ */ jsx2(
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
     "svg",
     {
       width: size,
@@ -70,38 +105,38 @@ var Helpwave = ({
       strokeLinecap: "round",
       strokeWidth: 48,
       ...props,
-      children: /* @__PURE__ */ jsxs("g", { className: clsx(svgAnimationKey), children: [
-        /* @__PURE__ */ jsx2(
+      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("g", { className: (0, import_clsx.clsx)(svgAnimationKey), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
           "path",
           {
-            className: clsx({ "animate-wave-big-left-up": isLoadingAnimation }),
+            className: (0, import_clsx.clsx)({ "animate-wave-big-left-up": isLoadingAnimation }),
             d: "M144 543.235C144 423.259 232.164 326 340.92 326",
             stroke: color,
             strokeDasharray: "1000"
           }
         ),
-        /* @__PURE__ */ jsx2(
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
           "path",
           {
-            className: clsx({ "animate-wave-big-right-down": isLoadingAnimation }),
+            className: (0, import_clsx.clsx)({ "animate-wave-big-right-down": isLoadingAnimation }),
             d: "M537.84 544.104C429.084 544.104 340.92 446.844 340.92 326.869",
             stroke: color,
             strokeDasharray: "1000"
           }
         ),
-        /* @__PURE__ */ jsx2(
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
           "path",
           {
-            className: clsx({ "animate-wave-small-left-up": isLoadingAnimation }),
+            className: (0, import_clsx.clsx)({ "animate-wave-small-left-up": isLoadingAnimation }),
             d: "M462.223 518.035C462.223 432.133 525.348 362.495 603.217 362.495",
             stroke: color,
             strokeDasharray: "1000"
           }
         ),
-        /* @__PURE__ */ jsx2(
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
           "path",
           {
-            className: clsx({ "animate-wave-small-right-down": isLoadingAnimation }),
+            className: (0, import_clsx.clsx)({ "animate-wave-small-right-down": isLoadingAnimation }),
             d: "M745.001 519.773C666.696 519.773 603.218 450.136 603.218 364.233",
             stroke: color,
             strokeDasharray: "1000"
@@ -113,7 +148,7 @@ var Helpwave = ({
 };
 
 // src/components/loading-states/LoadingAnimation.tsx
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+var import_jsx_runtime3 = require("react/jsx-runtime");
 var defaultLoadingAnimationTranslation = {
   en: {
     loading: "Loading data"
@@ -128,12 +163,13 @@ var LoadingAnimation = ({
   classname
 }) => {
   const translation = useTranslation(defaultLoadingAnimationTranslation, overwriteTranslation);
-  return /* @__PURE__ */ jsxs2("div", { className: clsx2("col items-center justify-center w-full h-24", classname), children: [
-    /* @__PURE__ */ jsx3(Helpwave, { animate: "loading" }),
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: (0, import_clsx2.default)("col items-center justify-center w-full h-24", classname), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Helpwave, { animate: "loading" }),
     loadingText ?? `${translation.loading}...`
   ] });
 };
-export {
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
   LoadingAnimation
-};
+});
 //# sourceMappingURL=LoadingAnimation.js.map

package/dist/components/loading-states/LoadingAnimation.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/localization/LanguageProvider.tsx","../../../src/hooks/useLocalStorage.ts","../../../src/localization/util.ts","../../../src/localization/useTranslation.ts","../../../src/components/loading-states/LoadingAnimation.tsx","../../../src/components/icons-and-geometry/Helpwave.tsx"],"sourcesContent":["import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useState } from 'react'\nimport { useLocalStorage } from '@/hooks/useLocalStorage'\nimport type { Language } from './util'\nimport { LanguageUtil } from './util'\n\nexport type LanguageContextValue = {\n  language: Language,\n  setLanguage: Dispatch<SetStateAction<Language>>,\n}\n\nexport const LanguageContext = createContext<LanguageContextValue>({\n  language: LanguageUtil.DEFAULT_LANGUAGE,\n  setLanguage: (v) => v\n})\n\nexport const useLanguage = () => useContext(LanguageContext)\n\nexport const useLocale = (overWriteLanguage?: Language) => {\n  const { language } = useLanguage()\n  const mapping: Record<Language, string> = {\n    en: 'en-US',\n    de: 'de-DE'\n  }\n  return mapping[overWriteLanguage ?? language]\n}\n\ntype LanguageProviderProps = {\n  initialLanguage?: Language,\n}\n\nexport const LanguageProvider = ({ initialLanguage, children }: PropsWithChildren<LanguageProviderProps>) => {\n  const [language, setLanguage] = useState<Language>(initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n  const [storedLanguage, setStoredLanguage] = useLocalStorage<Language>('language', initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n\n  useEffect(() => {\n    if (language !== initialLanguage && initialLanguage) {\n      console.warn('LanguageProvider initial state changed: Prefer using languageProvider\\'s setLanguage instead')\n      setLanguage(initialLanguage)\n    }\n  }, [initialLanguage]) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    // TODO set locale of html tag here as well\n    setStoredLanguage(language)\n  }, [language, setStoredLanguage])\n\n  useEffect(() => {\n    if (storedLanguage !== null) {\n      setLanguage(storedLanguage)\n      return\n    }\n\n    const LanguageToTestAgainst = Object.values(LanguageUtil.languages)\n\n    const matchingBrowserLanguage = window.navigator.languages\n      .map(language => LanguageToTestAgainst.find((test) => language === test || language.split('-')[0] === test))\n      .filter(entry => entry !== undefined)\n\n    if (matchingBrowserLanguage.length === 0) return\n\n    const firstMatch = matchingBrowserLanguage[0] as Language\n    setLanguage(firstMatch)\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return (\n    <LanguageContext.Provider value={{\n      language,\n      setLanguage\n    }}>\n      {children}\n    </LanguageContext.Provider>\n  )\n}","import type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { LocalStorageService } from '../util/storage'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\nexport const useLocalStorage = <T>(key: string, initValue: T): [T, SetValue<T>] => {\n  const get = useCallback((): T => {\n    if (typeof window === 'undefined') {\n      return initValue\n    }\n    const storageService = new LocalStorageService()\n    const value = storageService.get<T>(key)\n    return value || initValue\n  }, [initValue, key])\n\n  const [storedValue, setStoredValue] = useState<T>(get)\n\n  const setValue: SetValue<T> = useCallback(value => {\n    const newValue = value instanceof Function ? value(storedValue) : value\n    const storageService = new LocalStorageService()\n    storageService.set(key, value)\n\n    setStoredValue(newValue)\n  }, [storedValue, setStoredValue, key])\n\n  useEffect(() => {\n    setStoredValue(get())\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return [storedValue, setValue]\n}","/**\n * The supported languages\n */\nconst languages = ['en', 'de'] as const\n\n/**\n * The supported languages\n */\nexport type Language = typeof languages[number]\n\n/**\n * The supported languages' names in their respective language\n */\nconst languagesLocalNames: Record<Language, string> = {\n  en: 'English',\n  de: 'Deutsch',\n}\n\n/**\n * The default language\n */\nconst DEFAULT_LANGUAGE: Language = 'en'\n\n/**\n * A constant definition for holding data regarding languages\n */\nexport const LanguageUtil = {\n  languages,\n  DEFAULT_LANGUAGE,\n  languagesLocalNames,\n}","import { useLanguage } from './LanguageProvider'\nimport type { Language } from './util'\n\nexport type Translation<T> = Record<Language, T>\n\ntype OverwriteTranslationType<Translation extends Record<string, unknown>> = {\n  language?: Language,\n  translation?: Partial<Record<Language, Partial<Translation>>>,\n}\n\n/**\n * Adds the `language` prop to the component props.\n *\n * @param Translation the type of the translation object\n *\n * @param Props the type of the component props, defaults to `Record<string, never>`,\n *              if you don't expect any other props other than `language` and get an\n *              error when using your component (because it uses `forwardRef` etc.)\n *              you can try out `Record<string, unknown>`, this might resolve your\n *              problem as `SomeType & never` is still `never` but `SomeType & unknown`\n *              is `SomeType` which means that adding back props (like `ref` etc.)\n *              works properly\n */\nexport type PropsForTranslation<\n  Translation extends Record<string, unknown>,\n  Props = Record<string, never>\n> = Props & {\n  overwriteTranslation?: OverwriteTranslationType<Translation>,\n};\n\nexport const useTranslation = <Translation extends Record<string, unknown>>(\n  defaults: Record<Language, Translation>,\n  translationOverwrite: OverwriteTranslationType<Translation> = {}\n): Translation => {\n  const { language: languageProp, translation: overwrite } = translationOverwrite\n  const { language: inferredLanguage } = useLanguage()\n  const usedLanguage = languageProp ?? inferredLanguage\n  let defaultValues: Translation = defaults[usedLanguage]\n  if (overwrite && overwrite[usedLanguage]) {\n    defaultValues = { ...defaultValues, ...overwrite[usedLanguage] }\n  }\n  return defaultValues\n}\n","import type { Language } from '../../localization/util'\nimport type { PropsForTranslation } from '../../localization/useTranslation'\nimport { useTranslation } from '../../localization/useTranslation'\nimport clsx from 'clsx'\nimport { Helpwave } from '../icons-and-geometry/Helpwave'\n\ntype LoadingAnimationTranslation = {\n  loading: string,\n}\n\nconst defaultLoadingAnimationTranslation: Record<Language, LoadingAnimationTranslation> = {\n  en: {\n    loading: 'Loading data'\n  },\n  de: {\n    loading: 'Lade Daten'\n  }\n}\n\nexport type LoadingAnimationProps = {\n  loadingText?: string,\n  classname?: string,\n}\n\n/**\n * A Component to show when loading data\n */\nexport const LoadingAnimation = ({\n                                   overwriteTranslation,\n                                   loadingText,\n                                   classname\n                                 }: PropsForTranslation<LoadingAnimationTranslation, LoadingAnimationProps>) => {\n  const translation = useTranslation(defaultLoadingAnimationTranslation, overwriteTranslation)\n  return (\n    <div className={clsx('col items-center justify-center w-full h-24', classname)}>\n      <Helpwave animate=\"loading\"/>\n      {loadingText ?? `${translation.loading}...`}\n    </div>\n  )\n}\n","import type { SVGProps } from 'react'\nimport { clsx } from 'clsx'\n\nexport type HelpwaveProps = SVGProps<SVGSVGElement> & {\n  color?: string,\n  animate?: 'none' | 'loading' | 'pulse' | 'bounce',\n  size?: number,\n}\n\n/**\n * The helpwave loading spinner based on the svg logo.\n */\nexport const Helpwave = ({\n                           color = 'currentColor',\n                           animate = 'none',\n                           size = 64,\n                           ...props\n                         }: HelpwaveProps) => {\n  const isLoadingAnimation = animate === 'loading'\n  let svgAnimationKey = ''\n\n  if (animate === 'pulse') {\n    svgAnimationKey = 'animate-pulse'\n  } else if (animate === 'bounce') {\n    svgAnimationKey = 'animate-bounce'\n  }\n\n  if (size < 0) {\n    console.error('size cannot be less than 0')\n    size = 64\n  }\n\n  return (\n    <svg\n      width={size}\n      height={size}\n      viewBox=\"0 0 888 888\"\n      fill=\"none\"\n      strokeLinecap=\"round\"\n      strokeWidth={48}\n      {...props}\n    >\n      <g className={clsx(svgAnimationKey)}>\n        <path className={clsx({ 'animate-wave-big-left-up': isLoadingAnimation })}\n              d=\"M144 543.235C144 423.259 232.164 326 340.92 326\" stroke={color} strokeDasharray=\"1000\"/>\n        <path className={clsx({ 'animate-wave-big-right-down': isLoadingAnimation })}\n              d=\"M537.84 544.104C429.084 544.104 340.92 446.844 340.92 326.869\" stroke={color} strokeDasharray=\"1000\"/>\n        <path className={clsx({ 'animate-wave-small-left-up': isLoadingAnimation })}\n              d=\"M462.223 518.035C462.223 432.133 525.348 362.495 603.217 362.495\" stroke={color}\n              strokeDasharray=\"1000\"/>\n        <path className={clsx({ 'animate-wave-small-right-down': isLoadingAnimation })}\n              d=\"M745.001 519.773C666.696 519.773 603.218 450.136 603.218 364.233\" stroke={color}\n              strokeDasharray=\"1000\"/>\n      </g>\n    </svg>\n  )\n}\n"],"mappings":"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","names":["useEffect","useState","clsx","jsx","jsx","jsxs","clsx"]}
+{"version":3,"sources":["../../../src/components/loading-states/LoadingAnimation.tsx","../../../src/localization/LanguageProvider.tsx","../../../src/hooks/useLocalStorage.ts","../../../src/localization/util.ts","../../../src/localization/useTranslation.ts","../../../src/components/icons-and-geometry/Helpwave.tsx"],"sourcesContent":["import type { Language } from '../../localization/util'\nimport type { PropsForTranslation } from '../../localization/useTranslation'\nimport { useTranslation } from '../../localization/useTranslation'\nimport clsx from 'clsx'\nimport { Helpwave } from '../icons-and-geometry/Helpwave'\n\ntype LoadingAnimationTranslation = {\n  loading: string,\n}\n\nconst defaultLoadingAnimationTranslation: Record<Language, LoadingAnimationTranslation> = {\n  en: {\n    loading: 'Loading data'\n  },\n  de: {\n    loading: 'Lade Daten'\n  }\n}\n\nexport type LoadingAnimationProps = {\n  loadingText?: string,\n  classname?: string,\n}\n\n/**\n * A Component to show when loading data\n */\nexport const LoadingAnimation = ({\n                                   overwriteTranslation,\n                                   loadingText,\n                                   classname\n                                 }: PropsForTranslation<LoadingAnimationTranslation, LoadingAnimationProps>) => {\n  const translation = useTranslation(defaultLoadingAnimationTranslation, overwriteTranslation)\n  return (\n    <div className={clsx('col items-center justify-center w-full h-24', classname)}>\n      <Helpwave animate=\"loading\"/>\n      {loadingText ?? `${translation.loading}...`}\n    </div>\n  )\n}\n","import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useState } from 'react'\nimport { useLocalStorage } from '../hooks/useLocalStorage'\nimport type { Language } from './util'\nimport { LanguageUtil } from './util'\n\nexport type LanguageContextValue = {\n  language: Language,\n  setLanguage: Dispatch<SetStateAction<Language>>,\n}\n\nexport const LanguageContext = createContext<LanguageContextValue>({\n  language: LanguageUtil.DEFAULT_LANGUAGE,\n  setLanguage: (v) => v\n})\n\nexport const useLanguage = () => useContext(LanguageContext)\n\nexport const useLocale = (overWriteLanguage?: Language) => {\n  const { language } = useLanguage()\n  const mapping: Record<Language, string> = {\n    en: 'en-US',\n    de: 'de-DE'\n  }\n  return mapping[overWriteLanguage ?? language]\n}\n\ntype LanguageProviderProps = {\n  initialLanguage?: Language,\n}\n\nexport const LanguageProvider = ({ initialLanguage, children }: PropsWithChildren<LanguageProviderProps>) => {\n  const [language, setLanguage] = useState<Language>(initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n  const [storedLanguage, setStoredLanguage] = useLocalStorage<Language>('language', initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n\n  useEffect(() => {\n    if (language !== initialLanguage && initialLanguage) {\n      console.warn('LanguageProvider initial state changed: Prefer using languageProvider\\'s setLanguage instead')\n      setLanguage(initialLanguage)\n    }\n  }, [initialLanguage]) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    // TODO set locale of html tag here as well\n    setStoredLanguage(language)\n  }, [language, setStoredLanguage])\n\n  useEffect(() => {\n    if (storedLanguage !== null) {\n      setLanguage(storedLanguage)\n      return\n    }\n\n    const LanguageToTestAgainst = Object.values(LanguageUtil.languages)\n\n    const matchingBrowserLanguage = window.navigator.languages\n      .map(language => LanguageToTestAgainst.find((test) => language === test || language.split('-')[0] === test))\n      .filter(entry => entry !== undefined)\n\n    if (matchingBrowserLanguage.length === 0) return\n\n    const firstMatch = matchingBrowserLanguage[0] as Language\n    setLanguage(firstMatch)\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return (\n    <LanguageContext.Provider value={{\n      language,\n      setLanguage\n    }}>\n      {children}\n    </LanguageContext.Provider>\n  )\n}","import type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { LocalStorageService } from '../util/storage'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\nexport const useLocalStorage = <T>(key: string, initValue: T): [T, SetValue<T>] => {\n  const get = useCallback((): T => {\n    if (typeof window === 'undefined') {\n      return initValue\n    }\n    const storageService = new LocalStorageService()\n    const value = storageService.get<T>(key)\n    return value || initValue\n  }, [initValue, key])\n\n  const [storedValue, setStoredValue] = useState<T>(get)\n\n  const setValue: SetValue<T> = useCallback(value => {\n    const newValue = value instanceof Function ? value(storedValue) : value\n    const storageService = new LocalStorageService()\n    storageService.set(key, value)\n\n    setStoredValue(newValue)\n  }, [storedValue, setStoredValue, key])\n\n  useEffect(() => {\n    setStoredValue(get())\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return [storedValue, setValue]\n}","/**\n * The supported languages\n */\nconst languages = ['en', 'de'] as const\n\n/**\n * The supported languages\n */\nexport type Language = typeof languages[number]\n\n/**\n * The supported languages' names in their respective language\n */\nconst languagesLocalNames: Record<Language, string> = {\n  en: 'English',\n  de: 'Deutsch',\n}\n\n/**\n * The default language\n */\nconst DEFAULT_LANGUAGE: Language = 'en'\n\n/**\n * A constant definition for holding data regarding languages\n */\nexport const LanguageUtil = {\n  languages,\n  DEFAULT_LANGUAGE,\n  languagesLocalNames,\n}","import { useLanguage } from './LanguageProvider'\nimport type { Language } from './util'\n\nexport type Translation<T> = Record<Language, T>\n\ntype OverwriteTranslationType<Translation extends Record<string, unknown>> = {\n  language?: Language,\n  translation?: Partial<Record<Language, Partial<Translation>>>,\n}\n\n/**\n * Adds the `language` prop to the component props.\n *\n * @param Translation the type of the translation object\n *\n * @param Props the type of the component props, defaults to `Record<string, never>`,\n *              if you don't expect any other props other than `language` and get an\n *              error when using your component (because it uses `forwardRef` etc.)\n *              you can try out `Record<string, unknown>`, this might resolve your\n *              problem as `SomeType & never` is still `never` but `SomeType & unknown`\n *              is `SomeType` which means that adding back props (like `ref` etc.)\n *              works properly\n */\nexport type PropsForTranslation<\n  Translation extends Record<string, unknown>,\n  Props = Record<string, never>\n> = Props & {\n  overwriteTranslation?: OverwriteTranslationType<Translation>,\n};\n\nexport const useTranslation = <Translation extends Record<string, unknown>>(\n  defaults: Record<Language, Translation>,\n  translationOverwrite: OverwriteTranslationType<Translation> = {}\n): Translation => {\n  const { language: languageProp, translation: overwrite } = translationOverwrite\n  const { language: inferredLanguage } = useLanguage()\n  const usedLanguage = languageProp ?? inferredLanguage\n  let defaultValues: Translation = defaults[usedLanguage]\n  if (overwrite && overwrite[usedLanguage]) {\n    defaultValues = { ...defaultValues, ...overwrite[usedLanguage] }\n  }\n  return defaultValues\n}\n","import type { SVGProps } from 'react'\nimport { clsx } from 'clsx'\n\nexport type HelpwaveProps = SVGProps<SVGSVGElement> & {\n  color?: string,\n  animate?: 'none' | 'loading' | 'pulse' | 'bounce',\n  size?: number,\n}\n\n/**\n * The helpwave loading spinner based on the svg logo.\n */\nexport const Helpwave = ({\n                           color = 'currentColor',\n                           animate = 'none',\n                           size = 64,\n                           ...props\n                         }: HelpwaveProps) => {\n  const isLoadingAnimation = animate === 'loading'\n  let svgAnimationKey = ''\n\n  if (animate === 'pulse') {\n    svgAnimationKey = 'animate-pulse'\n  } else if (animate === 'bounce') {\n    svgAnimationKey = 'animate-bounce'\n  }\n\n  if (size < 0) {\n    console.error('size cannot be less than 0')\n    size = 64\n  }\n\n  return (\n    <svg\n      width={size}\n      height={size}\n      viewBox=\"0 0 888 888\"\n      fill=\"none\"\n      strokeLinecap=\"round\"\n      strokeWidth={48}\n      {...props}\n    >\n      <g className={clsx(svgAnimationKey)}>\n        <path className={clsx({ 'animate-wave-big-left-up': isLoadingAnimation })}\n              d=\"M144 543.235C144 423.259 232.164 326 340.92 326\" stroke={color} strokeDasharray=\"1000\"/>\n        <path className={clsx({ 'animate-wave-big-right-down': isLoadingAnimation })}\n              d=\"M537.84 544.104C429.084 544.104 340.92 446.844 340.92 326.869\" stroke={color} strokeDasharray=\"1000\"/>\n        <path className={clsx({ 'animate-wave-small-left-up': isLoadingAnimation })}\n              d=\"M462.223 518.035C462.223 432.133 525.348 362.495 603.217 362.495\" stroke={color}\n              strokeDasharray=\"1000\"/>\n        <path className={clsx({ 'animate-wave-small-right-down': isLoadingAnimation })}\n              d=\"M745.001 519.773C666.696 519.773 603.218 450.136 603.218 364.233\" stroke={color}\n              strokeDasharray=\"1000\"/>\n      </g>\n    </svg>\n  )\n}\n"],"mappings":"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","names":["import_react","import_clsx","import_jsx_runtime","import_jsx_runtime","clsx"]}

package/dist/components/loading-states/LoadingAnimation.mjs

@@ -0,0 +1,139 @@
+// src/localization/LanguageProvider.tsx
+import { createContext, useContext, useEffect as useEffect2, useState as useState2 } from "react";
+
+// src/hooks/useLocalStorage.ts
+import { useCallback, useEffect, useState } from "react";
+
+// src/localization/util.ts
+var languages = ["en", "de"];
+var languagesLocalNames = {
+  en: "English",
+  de: "Deutsch"
+};
+var DEFAULT_LANGUAGE = "en";
+var LanguageUtil = {
+  languages,
+  DEFAULT_LANGUAGE,
+  languagesLocalNames
+};
+
+// src/localization/LanguageProvider.tsx
+import { jsx } from "react/jsx-runtime";
+var LanguageContext = createContext({
+  language: LanguageUtil.DEFAULT_LANGUAGE,
+  setLanguage: (v) => v
+});
+var useLanguage = () => useContext(LanguageContext);
+
+// src/localization/useTranslation.ts
+var useTranslation = (defaults, translationOverwrite = {}) => {
+  const { language: languageProp, translation: overwrite } = translationOverwrite;
+  const { language: inferredLanguage } = useLanguage();
+  const usedLanguage = languageProp ?? inferredLanguage;
+  let defaultValues = defaults[usedLanguage];
+  if (overwrite && overwrite[usedLanguage]) {
+    defaultValues = { ...defaultValues, ...overwrite[usedLanguage] };
+  }
+  return defaultValues;
+};
+
+// src/components/loading-states/LoadingAnimation.tsx
+import clsx2 from "clsx";
+
+// src/components/icons-and-geometry/Helpwave.tsx
+import { clsx } from "clsx";
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+var Helpwave = ({
+  color = "currentColor",
+  animate = "none",
+  size = 64,
+  ...props
+}) => {
+  const isLoadingAnimation = animate === "loading";
+  let svgAnimationKey = "";
+  if (animate === "pulse") {
+    svgAnimationKey = "animate-pulse";
+  } else if (animate === "bounce") {
+    svgAnimationKey = "animate-bounce";
+  }
+  if (size < 0) {
+    console.error("size cannot be less than 0");
+    size = 64;
+  }
+  return /* @__PURE__ */ jsx2(
+    "svg",
+    {
+      width: size,
+      height: size,
+      viewBox: "0 0 888 888",
+      fill: "none",
+      strokeLinecap: "round",
+      strokeWidth: 48,
+      ...props,
+      children: /* @__PURE__ */ jsxs("g", { className: clsx(svgAnimationKey), children: [
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            className: clsx({ "animate-wave-big-left-up": isLoadingAnimation }),
+            d: "M144 543.235C144 423.259 232.164 326 340.92 326",
+            stroke: color,
+            strokeDasharray: "1000"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            className: clsx({ "animate-wave-big-right-down": isLoadingAnimation }),
+            d: "M537.84 544.104C429.084 544.104 340.92 446.844 340.92 326.869",
+            stroke: color,
+            strokeDasharray: "1000"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            className: clsx({ "animate-wave-small-left-up": isLoadingAnimation }),
+            d: "M462.223 518.035C462.223 432.133 525.348 362.495 603.217 362.495",
+            stroke: color,
+            strokeDasharray: "1000"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            className: clsx({ "animate-wave-small-right-down": isLoadingAnimation }),
+            d: "M745.001 519.773C666.696 519.773 603.218 450.136 603.218 364.233",
+            stroke: color,
+            strokeDasharray: "1000"
+          }
+        )
+      ] })
+    }
+  );
+};
+
+// src/components/loading-states/LoadingAnimation.tsx
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+var defaultLoadingAnimationTranslation = {
+  en: {
+    loading: "Loading data"
+  },
+  de: {
+    loading: "Lade Daten"
+  }
+};
+var LoadingAnimation = ({
+  overwriteTranslation,
+  loadingText,
+  classname
+}) => {
+  const translation = useTranslation(defaultLoadingAnimationTranslation, overwriteTranslation);
+  return /* @__PURE__ */ jsxs2("div", { className: clsx2("col items-center justify-center w-full h-24", classname), children: [
+    /* @__PURE__ */ jsx3(Helpwave, { animate: "loading" }),
+    loadingText ?? `${translation.loading}...`
+  ] });
+};
+export {
+  LoadingAnimation
+};
+//# sourceMappingURL=LoadingAnimation.mjs.map

package/dist/components/loading-states/LoadingAnimation.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/localization/LanguageProvider.tsx","../../../src/hooks/useLocalStorage.ts","../../../src/localization/util.ts","../../../src/localization/useTranslation.ts","../../../src/components/loading-states/LoadingAnimation.tsx","../../../src/components/icons-and-geometry/Helpwave.tsx"],"sourcesContent":["import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useState } from 'react'\nimport { useLocalStorage } from '../hooks/useLocalStorage'\nimport type { Language } from './util'\nimport { LanguageUtil } from './util'\n\nexport type LanguageContextValue = {\n  language: Language,\n  setLanguage: Dispatch<SetStateAction<Language>>,\n}\n\nexport const LanguageContext = createContext<LanguageContextValue>({\n  language: LanguageUtil.DEFAULT_LANGUAGE,\n  setLanguage: (v) => v\n})\n\nexport const useLanguage = () => useContext(LanguageContext)\n\nexport const useLocale = (overWriteLanguage?: Language) => {\n  const { language } = useLanguage()\n  const mapping: Record<Language, string> = {\n    en: 'en-US',\n    de: 'de-DE'\n  }\n  return mapping[overWriteLanguage ?? language]\n}\n\ntype LanguageProviderProps = {\n  initialLanguage?: Language,\n}\n\nexport const LanguageProvider = ({ initialLanguage, children }: PropsWithChildren<LanguageProviderProps>) => {\n  const [language, setLanguage] = useState<Language>(initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n  const [storedLanguage, setStoredLanguage] = useLocalStorage<Language>('language', initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n\n  useEffect(() => {\n    if (language !== initialLanguage && initialLanguage) {\n      console.warn('LanguageProvider initial state changed: Prefer using languageProvider\\'s setLanguage instead')\n      setLanguage(initialLanguage)\n    }\n  }, [initialLanguage]) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    // TODO set locale of html tag here as well\n    setStoredLanguage(language)\n  }, [language, setStoredLanguage])\n\n  useEffect(() => {\n    if (storedLanguage !== null) {\n      setLanguage(storedLanguage)\n      return\n    }\n\n    const LanguageToTestAgainst = Object.values(LanguageUtil.languages)\n\n    const matchingBrowserLanguage = window.navigator.languages\n      .map(language => LanguageToTestAgainst.find((test) => language === test || language.split('-')[0] === test))\n      .filter(entry => entry !== undefined)\n\n    if (matchingBrowserLanguage.length === 0) return\n\n    const firstMatch = matchingBrowserLanguage[0] as Language\n    setLanguage(firstMatch)\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return (\n    <LanguageContext.Provider value={{\n      language,\n      setLanguage\n    }}>\n      {children}\n    </LanguageContext.Provider>\n  )\n}","import type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { LocalStorageService } from '../util/storage'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\nexport const useLocalStorage = <T>(key: string, initValue: T): [T, SetValue<T>] => {\n  const get = useCallback((): T => {\n    if (typeof window === 'undefined') {\n      return initValue\n    }\n    const storageService = new LocalStorageService()\n    const value = storageService.get<T>(key)\n    return value || initValue\n  }, [initValue, key])\n\n  const [storedValue, setStoredValue] = useState<T>(get)\n\n  const setValue: SetValue<T> = useCallback(value => {\n    const newValue = value instanceof Function ? value(storedValue) : value\n    const storageService = new LocalStorageService()\n    storageService.set(key, value)\n\n    setStoredValue(newValue)\n  }, [storedValue, setStoredValue, key])\n\n  useEffect(() => {\n    setStoredValue(get())\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return [storedValue, setValue]\n}","/**\n * The supported languages\n */\nconst languages = ['en', 'de'] as const\n\n/**\n * The supported languages\n */\nexport type Language = typeof languages[number]\n\n/**\n * The supported languages' names in their respective language\n */\nconst languagesLocalNames: Record<Language, string> = {\n  en: 'English',\n  de: 'Deutsch',\n}\n\n/**\n * The default language\n */\nconst DEFAULT_LANGUAGE: Language = 'en'\n\n/**\n * A constant definition for holding data regarding languages\n */\nexport const LanguageUtil = {\n  languages,\n  DEFAULT_LANGUAGE,\n  languagesLocalNames,\n}","import { useLanguage } from './LanguageProvider'\nimport type { Language } from './util'\n\nexport type Translation<T> = Record<Language, T>\n\ntype OverwriteTranslationType<Translation extends Record<string, unknown>> = {\n  language?: Language,\n  translation?: Partial<Record<Language, Partial<Translation>>>,\n}\n\n/**\n * Adds the `language` prop to the component props.\n *\n * @param Translation the type of the translation object\n *\n * @param Props the type of the component props, defaults to `Record<string, never>`,\n *              if you don't expect any other props other than `language` and get an\n *              error when using your component (because it uses `forwardRef` etc.)\n *              you can try out `Record<string, unknown>`, this might resolve your\n *              problem as `SomeType & never` is still `never` but `SomeType & unknown`\n *              is `SomeType` which means that adding back props (like `ref` etc.)\n *              works properly\n */\nexport type PropsForTranslation<\n  Translation extends Record<string, unknown>,\n  Props = Record<string, never>\n> = Props & {\n  overwriteTranslation?: OverwriteTranslationType<Translation>,\n};\n\nexport const useTranslation = <Translation extends Record<string, unknown>>(\n  defaults: Record<Language, Translation>,\n  translationOverwrite: OverwriteTranslationType<Translation> = {}\n): Translation => {\n  const { language: languageProp, translation: overwrite } = translationOverwrite\n  const { language: inferredLanguage } = useLanguage()\n  const usedLanguage = languageProp ?? inferredLanguage\n  let defaultValues: Translation = defaults[usedLanguage]\n  if (overwrite && overwrite[usedLanguage]) {\n    defaultValues = { ...defaultValues, ...overwrite[usedLanguage] }\n  }\n  return defaultValues\n}\n","import type { Language } from '../../localization/util'\nimport type { PropsForTranslation } from '../../localization/useTranslation'\nimport { useTranslation } from '../../localization/useTranslation'\nimport clsx from 'clsx'\nimport { Helpwave } from '../icons-and-geometry/Helpwave'\n\ntype LoadingAnimationTranslation = {\n  loading: string,\n}\n\nconst defaultLoadingAnimationTranslation: Record<Language, LoadingAnimationTranslation> = {\n  en: {\n    loading: 'Loading data'\n  },\n  de: {\n    loading: 'Lade Daten'\n  }\n}\n\nexport type LoadingAnimationProps = {\n  loadingText?: string,\n  classname?: string,\n}\n\n/**\n * A Component to show when loading data\n */\nexport const LoadingAnimation = ({\n                                   overwriteTranslation,\n                                   loadingText,\n                                   classname\n                                 }: PropsForTranslation<LoadingAnimationTranslation, LoadingAnimationProps>) => {\n  const translation = useTranslation(defaultLoadingAnimationTranslation, overwriteTranslation)\n  return (\n    <div className={clsx('col items-center justify-center w-full h-24', classname)}>\n      <Helpwave animate=\"loading\"/>\n      {loadingText ?? `${translation.loading}...`}\n    </div>\n  )\n}\n","import type { SVGProps } from 'react'\nimport { clsx } from 'clsx'\n\nexport type HelpwaveProps = SVGProps<SVGSVGElement> & {\n  color?: string,\n  animate?: 'none' | 'loading' | 'pulse' | 'bounce',\n  size?: number,\n}\n\n/**\n * The helpwave loading spinner based on the svg logo.\n */\nexport const Helpwave = ({\n                           color = 'currentColor',\n                           animate = 'none',\n                           size = 64,\n                           ...props\n                         }: HelpwaveProps) => {\n  const isLoadingAnimation = animate === 'loading'\n  let svgAnimationKey = ''\n\n  if (animate === 'pulse') {\n    svgAnimationKey = 'animate-pulse'\n  } else if (animate === 'bounce') {\n    svgAnimationKey = 'animate-bounce'\n  }\n\n  if (size < 0) {\n    console.error('size cannot be less than 0')\n    size = 64\n  }\n\n  return (\n    <svg\n      width={size}\n      height={size}\n      viewBox=\"0 0 888 888\"\n      fill=\"none\"\n      strokeLinecap=\"round\"\n      strokeWidth={48}\n      {...props}\n    >\n      <g className={clsx(svgAnimationKey)}>\n        <path className={clsx({ 'animate-wave-big-left-up': isLoadingAnimation })}\n              d=\"M144 543.235C144 423.259 232.164 326 340.92 326\" stroke={color} strokeDasharray=\"1000\"/>\n        <path className={clsx({ 'animate-wave-big-right-down': isLoadingAnimation })}\n              d=\"M537.84 544.104C429.084 544.104 340.92 446.844 340.92 326.869\" stroke={color} strokeDasharray=\"1000\"/>\n        <path className={clsx({ 'animate-wave-small-left-up': isLoadingAnimation })}\n              d=\"M462.223 518.035C462.223 432.133 525.348 362.495 603.217 362.495\" stroke={color}\n              strokeDasharray=\"1000\"/>\n        <path className={clsx({ 'animate-wave-small-right-down': isLoadingAnimation })}\n              d=\"M745.001 519.773C666.696 519.773 603.218 450.136 603.218 364.233\" stroke={color}\n              strokeDasharray=\"1000\"/>\n      </g>\n    </svg>\n  )\n}\n"],"mappings":"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","names":["useEffect","useState","clsx","jsx","jsx","jsxs","clsx"]}

package/dist/components/loading-states/{LoadingButton.d.cts → LoadingButton.d.mts}

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { SolidButtonProps } from '../user-action/Button.cjs';
+import { SolidButtonProps } from '../user-action/Button.mjs';
 import 'react';
 
 type LoadingButtonProps = {

package/dist/components/loading-states/LoadingButton.js

@@ -1,9 +1,42 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
 // src/components/loading-states/LoadingButton.tsx
-import clsx3 from "clsx";
+var LoadingButton_exports = {};
+__export(LoadingButton_exports, {
+  LoadingButton: () => LoadingButton
+});
+module.exports = __toCommonJS(LoadingButton_exports);
+var import_clsx3 = __toESM(require("clsx"));
 
 // src/components/user-action/Button.tsx
-import clsx from "clsx";
-import { jsx, jsxs } from "react/jsx-runtime";
+var import_clsx = __toESM(require("clsx"));
+var import_jsx_runtime = require("react/jsx-runtime");
 var paddingMapping = {
   small: "btn-sm",
   medium: "btn-md",
@@ -47,25 +80,25 @@ var SolidButton = ({
     negative: "text-button-solid-negative-icon",
     neutral: "text-button-solid-neutral-icon"
   }[color];
-  return /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     "button",
     {
       onClick: disabled ? void 0 : onClick,
       disabled: disabled || onClick === void 0,
-      className: clsx(
+      className: (0, import_clsx.default)(
         {
           "text-disabled-text bg-disabled-background cursor-not-allowed": disabled,
-          [clsx(colorClasses, "hover:brightness-90")]: !disabled
+          [(0, import_clsx.default)(colorClasses, "hover:brightness-90")]: !disabled
         },
         ButtonUtil.paddingMapping[size],
         className
       ),
       ...restProps,
       children: [
-        startIcon && /* @__PURE__ */ jsx(
+        startIcon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           "span",
           {
-            className: clsx({
+            className: (0, import_clsx.default)({
               [iconColorClasses]: !disabled,
               [`text-disabled-icon`]: disabled
             }),
@@ -73,10 +106,10 @@ var SolidButton = ({
           }
         ),
         children,
-        endIcon && /* @__PURE__ */ jsx(
+        endIcon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           "span",
           {
-            className: clsx({
+            className: (0, import_clsx.default)({
               [iconColorClasses]: !disabled,
               [`text-disabled-icon`]: disabled
             }),
@@ -92,8 +125,8 @@ var SolidButton = ({
 var noop = () => void 0;
 
 // src/components/icons-and-geometry/Helpwave.tsx
-import { clsx as clsx2 } from "clsx";
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var import_clsx2 = require("clsx");
+var import_jsx_runtime2 = require("react/jsx-runtime");
 var Helpwave = ({
   color = "currentColor",
   animate = "none",
@@ -111,7 +144,7 @@ var Helpwave = ({
     console.error("size cannot be less than 0");
     size = 64;
   }
-  return /* @__PURE__ */ jsx2(
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
     "svg",
     {
       width: size,
@@ -121,38 +154,38 @@ var Helpwave = ({
       strokeLinecap: "round",
       strokeWidth: 48,
       ...props,
-      children: /* @__PURE__ */ jsxs2("g", { className: clsx2(svgAnimationKey), children: [
-        /* @__PURE__ */ jsx2(
+      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("g", { className: (0, import_clsx2.clsx)(svgAnimationKey), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
           "path",
           {
-            className: clsx2({ "animate-wave-big-left-up": isLoadingAnimation }),
+            className: (0, import_clsx2.clsx)({ "animate-wave-big-left-up": isLoadingAnimation }),
             d: "M144 543.235C144 423.259 232.164 326 340.92 326",
             stroke: color,
             strokeDasharray: "1000"
           }
         ),
-        /* @__PURE__ */ jsx2(
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
           "path",
           {
-            className: clsx2({ "animate-wave-big-right-down": isLoadingAnimation }),
+            className: (0, import_clsx2.clsx)({ "animate-wave-big-right-down": isLoadingAnimation }),
             d: "M537.84 544.104C429.084 544.104 340.92 446.844 340.92 326.869",
             stroke: color,
             strokeDasharray: "1000"
           }
         ),
-        /* @__PURE__ */ jsx2(
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
           "path",
           {
-            className: clsx2({ "animate-wave-small-left-up": isLoadingAnimation }),
+            className: (0, import_clsx2.clsx)({ "animate-wave-small-left-up": isLoadingAnimation }),
             d: "M462.223 518.035C462.223 432.133 525.348 362.495 603.217 362.495",
             stroke: color,
             strokeDasharray: "1000"
           }
         ),
-        /* @__PURE__ */ jsx2(
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
           "path",
           {
-            className: clsx2({ "animate-wave-small-right-down": isLoadingAnimation }),
+            className: (0, import_clsx2.clsx)({ "animate-wave-small-right-down": isLoadingAnimation }),
             d: "M745.001 519.773C666.696 519.773 603.218 450.136 603.218 364.233",
             stroke: color,
             strokeDasharray: "1000"
@@ -164,15 +197,16 @@ var Helpwave = ({
 };
 
 // src/components/loading-states/LoadingButton.tsx
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var import_jsx_runtime3 = require("react/jsx-runtime");
 var LoadingButton = ({ isLoading = false, size = "medium", onClick, ...rest }) => {
   const paddingClass = ButtonUtil.paddingMapping[size];
-  return /* @__PURE__ */ jsxs3("div", { className: "inline-block relative", children: [
-    isLoading && /* @__PURE__ */ jsx3("div", { className: clsx3("absolute inset-0 row items-center justify-center bg-white/40", paddingClass), children: /* @__PURE__ */ jsx3(Helpwave, { animate: "loading", className: "text-white" }) }),
-    /* @__PURE__ */ jsx3(SolidButton, { ...rest, disabled: rest.disabled, onClick: isLoading ? noop : onClick })
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "inline-block relative", children: [
+    isLoading && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: (0, import_clsx3.default)("absolute inset-0 row items-center justify-center bg-white/40", paddingClass), children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Helpwave, { animate: "loading", className: "text-white" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(SolidButton, { ...rest, disabled: rest.disabled, onClick: isLoading ? noop : onClick })
   ] });
 };
-export {
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
   LoadingButton
-};
+});
 //# sourceMappingURL=LoadingButton.js.map