@helpwave/hightide 0.0.15 → 0.0.17

package/dist/components/examples/SelectExample.mjs

@@ -1,145 +0,0 @@
-// src/components/examples/SelectExample.tsx
-import { useEffect, useState } from "react";
-
-// src/components/user-input/Select.tsx
-import { Menu } from "@headlessui/react";
-import { ChevronDown, ChevronUp } from "lucide-react";
-import clsx from "clsx";
-
-// src/components/user-input/Label.tsx
-import { jsx } from "react/jsx-runtime";
-var styleMapping = {
-  labelSmall: "textstyle-label-sm",
-  labelMedium: "textstyle-label-md",
-  labelBig: "textstyle-label-lg"
-};
-var Label = ({
-  children,
-  name,
-  labelType = "labelSmall",
-  ...props
-}) => {
-  return /* @__PURE__ */ jsx("label", { ...props, children: children ? children : /* @__PURE__ */ jsx("span", { className: styleMapping[labelType], children: name }) });
-};
-
-// src/components/user-input/Select.tsx
-import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
-var Select = ({
-  value,
-  label,
-  options,
-  onChange,
-  isHidingCurrentValue = true,
-  hintText = "",
-  showDisabledOptions = true,
-  isDisabled,
-  className,
-  textColor = "text-menu-text",
-  hoverColor = "hover:brightness-90",
-  additionalItems,
-  selectedDisplayOverwrite
-}) => {
-  let filteredOptions = isHidingCurrentValue ? options.filter((option) => option.value !== value) : options;
-  if (!showDisabledOptions) {
-    filteredOptions = filteredOptions.filter((value2) => !value2.disabled);
-  }
-  const selectedOption = options.find((option) => option.value === value);
-  if (value !== void 0 && selectedOption === void 0 && selectedDisplayOverwrite === void 0) {
-    console.warn("The selected value is not found in the options list. This might be an error on your part or default behavior if it is complex data type on which === does not work. In case of the latter use selectedDisplayOverwrite to set your selected text or component");
-  }
-  const borderColor = "border-menu-border";
-  return /* @__PURE__ */ jsxs("div", { className: clsx(className), children: [
-    label && /* @__PURE__ */ jsx2(Label, { ...label, labelType: label.labelType ?? "labelBig", className: clsx("mb-1", label.className) }),
-    /* @__PURE__ */ jsx2(Menu, { as: "div", className: "relative text-menu-text", children: ({ open }) => /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsxs(
-        Menu.Button,
-        {
-          className: clsx(
-            "inline-flex w-full justify-between items-center rounded-t-lg border-2 px-4 py-2 font-medium bg-menu-background text-menu-text",
-            textColor,
-            borderColor,
-            {
-              "rounded-b-lg": !open,
-              [hoverColor]: !isDisabled,
-              "bg-disabled-background cursor-not-allowed text-disabled": isDisabled
-            }
-          ),
-          disabled: isDisabled,
-          children: [
-            /* @__PURE__ */ jsx2("span", { children: selectedDisplayOverwrite ?? selectedOption?.label ?? hintText }),
-            open ? /* @__PURE__ */ jsx2(ChevronUp, {}) : /* @__PURE__ */ jsx2(ChevronDown, {})
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsxs(
-        Menu.Items,
-        {
-          className: "absolute w-full z-10 rounded-b-lg bg-menu-background text-menu-text shadow-lg max-h-[500px] overflow-y-auto",
-          children: [
-            (additionalItems ?? []).map((item, index) => /* @__PURE__ */ jsx2(
-              "div",
-              {
-                className: clsx(borderColor, "px-4 py-2 overflow-hidden whitespace-nowrap text-ellipsis border-2 border-t-0", {
-                  "border-b-0 rounded-b-lg": filteredOptions.length === 0 && index === (additionalItems?.length ?? 1) - 1
-                }),
-                children: item
-              },
-              `additionalItems${index}`
-            )),
-            filteredOptions.map((option, index) => /* @__PURE__ */ jsx2(Menu.Item, { children: /* @__PURE__ */ jsx2(
-              "div",
-              {
-                className: clsx(
-                  "px-4 py-2 overflow-hidden whitespace-nowrap text-ellipsis border-2 border-t-0 cursor-pointer",
-                  option.className,
-                  borderColor,
-                  {
-                    "brightness-90": option.value === value,
-                    "brightness-95": index % 2 === 1,
-                    "text-disabled bg-disabled-background cursor-not-allowed": !!option.disabled,
-                    "bg-menu-background text-menu-text hover:brightness-90 cursor-pointer": !option.disabled,
-                    "rounded-b-lg": index === filteredOptions.length - 1
-                  }
-                ),
-                onClick: () => {
-                  if (!option.disabled) {
-                    onChange(option.value);
-                  }
-                },
-                children: option.label
-              }
-            ) }, `item${index}`))
-          ]
-        }
-      )
-    ] }) })
-  ] });
-};
-
-// src/components/examples/SelectExample.tsx
-import { jsx as jsx3 } from "react/jsx-runtime";
-var SelectExample = ({ options, value, hintText, ...props }) => {
-  const [selected, setSelected] = useState(value);
-  useEffect(() => {
-    if (options.find((options2) => options2.value === value)) {
-      setSelected(value);
-    }
-  }, [options, value]);
-  useEffect(() => {
-    setSelected(void 0);
-  }, [hintText]);
-  return /* @__PURE__ */ jsx3(
-    Select,
-    {
-      value: selected,
-      options,
-      onChange: (value2) => setSelected(value2),
-      hintText,
-      ...props
-    }
-  );
-};
-export {
-  SelectExample
-};
-//# sourceMappingURL=SelectExample.mjs.map

package/dist/components/examples/SelectExample.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/components/examples/SelectExample.tsx","../../../src/components/user-input/Select.tsx","../../../src/components/user-input/Label.tsx"],"sourcesContent":["import { useEffect, useState } from 'react'\nimport { Select, type SelectProps } from '../user-input/Select'\n\ntype SelectExampleProps<T> = Omit<SelectProps<T>, 'onChange' | 'additionalItems' | 'selectedDisplayOverwrite'>\n\nexport const SelectExample = <T, >({ options, value, hintText, ...props }: SelectExampleProps<T>) => {\n  const [selected, setSelected] = useState(value)\n\n  useEffect(() => {\n    if (options.find(options => options.value === value)) {\n      setSelected(value)\n    }\n  }, [options, value])\n\n  useEffect(() => {\n    setSelected(undefined)\n  }, [hintText])\n\n  return (\n    <Select\n      value={selected}\n      options={options}\n      onChange={value => setSelected(value)}\n      hintText={hintText}\n      {...props}\n    />\n  )\n}\n","import { Menu } from '@headlessui/react'\nimport { ChevronDown, ChevronUp } from 'lucide-react'\nimport type { ReactNode } from 'react'\nimport clsx from 'clsx'\nimport type { LabelProps } from './Label'\nimport { Label } from './Label'\n\nexport type SelectOption<T> = {\n  label: ReactNode,\n  value: T,\n  disabled?: boolean,\n  className?: string,\n}\n\nexport type SelectProps<T> = {\n  value?: T,\n  label?: LabelProps,\n  options: SelectOption<T>[],\n  onChange: (value: T) => void,\n  isHidingCurrentValue?: boolean,\n  hintText?: string,\n  showDisabledOptions?: boolean,\n  className?: string,\n  isDisabled?: boolean,\n  textColor?: string,\n  hoverColor?: string,\n  /**\n   * The items will be at the start of the select and aren't selectable\n   */\n  additionalItems?: ReactNode[],\n  selectedDisplayOverwrite?: ReactNode,\n};\n\n/**\n * A Select Component for selecting form a list of options\n *\n * The State is managed by the parent\n */\nexport const Select = <T, >({\n                              value,\n                              label,\n                              options,\n                              onChange,\n                              isHidingCurrentValue = true,\n                              hintText = '',\n                              showDisabledOptions = true,\n                              isDisabled,\n                              className,\n                              textColor = 'text-menu-text',\n                              hoverColor = 'hover:brightness-90',\n                              additionalItems,\n                              selectedDisplayOverwrite,\n                            }: SelectProps<T>) => {\n  // Notice: for more complex types this check here might need an additional compare method\n  let filteredOptions = isHidingCurrentValue ? options.filter(option => option.value !== value) : options\n  if (!showDisabledOptions) {\n    filteredOptions = filteredOptions.filter(value => !value.disabled)\n  }\n  const selectedOption = options.find(option => option.value === value)\n  if (value !== undefined && selectedOption === undefined && selectedDisplayOverwrite === undefined) {\n    console.warn('The selected value is not found in the options list. This might be an error on your part or' +\n      ' default behavior if it is complex data type on which === does not work. In case of the latter' +\n      ' use selectedDisplayOverwrite to set your selected text or component')\n  }\n\n  const borderColor = 'border-menu-border'\n\n  return (\n    <div className={clsx(className)}>\n      {label && (\n        <Label {...label} labelType={label.labelType ?? 'labelBig'} className={clsx('mb-1', label.className)}/>\n      )}\n      <Menu as=\"div\" className=\"relative text-menu-text\">\n        {({ open }) => (\n          <>\n            <Menu.Button\n              className={clsx(\n                'inline-flex w-full justify-between items-center rounded-t-lg border-2 px-4 py-2 font-medium bg-menu-background text-menu-text',\n                textColor, borderColor,\n                {\n                  'rounded-b-lg': !open,\n                  [hoverColor]: !isDisabled,\n                  'bg-disabled-background cursor-not-allowed text-disabled': isDisabled\n                }\n              )}\n              disabled={isDisabled}\n            >\n              <span>{selectedDisplayOverwrite ?? selectedOption?.label ?? hintText}</span>\n              {open ? <ChevronUp/> : <ChevronDown/>}\n            </Menu.Button>\n            <Menu.Items\n              className=\"absolute w-full z-10 rounded-b-lg bg-menu-background text-menu-text shadow-lg max-h-[500px] overflow-y-auto\"\n            >\n              {(additionalItems ?? []).map((item, index) => (\n                <div key={`additionalItems${index}`}\n                     className={clsx(borderColor, 'px-4 py-2 overflow-hidden whitespace-nowrap text-ellipsis border-2 border-t-0', {\n                       'border-b-0 rounded-b-lg': filteredOptions.length === 0 && index === (additionalItems?.length ?? 1) - 1,\n                     })}\n                >\n                  {item}\n                </div>\n              ))}\n              {filteredOptions.map((option, index) => (\n                <Menu.Item key={`item${index}`}>\n                  {\n                    <div\n                      className={clsx('px-4 py-2 overflow-hidden whitespace-nowrap text-ellipsis border-2 border-t-0 cursor-pointer',\n                        option.className, borderColor, {\n                          'brightness-90': option.value === value,\n                          'brightness-95': index % 2 === 1,\n                          'text-disabled bg-disabled-background cursor-not-allowed': !!option.disabled,\n                          'bg-menu-background text-menu-text hover:brightness-90 cursor-pointer': !option.disabled,\n                          'rounded-b-lg': index === filteredOptions.length - 1,\n                        })}\n                      onClick={() => {\n                        if (!option.disabled) {\n                          onChange(option.value)\n                        }\n                      }}\n                    >\n                      {option.label}\n                    </div>\n                  }\n                </Menu.Item>\n              ))}\n            </Menu.Items>\n          </>\n        )}\n      </Menu>\n    </div>\n  )\n}\n","import type { LabelHTMLAttributes } from 'react'\n\nexport type LabelType = 'labelSmall' | 'labelMedium' | 'labelBig'\nconst styleMapping: Record<LabelType, string> = {\n  labelSmall: 'textstyle-label-sm',\n  labelMedium: 'textstyle-label-md',\n  labelBig: 'textstyle-label-lg',\n}\n\n\nexport type LabelProps = {\n  /** The text for the label */\n  name?: string,\n  /** The styling for the label */\n  labelType?: LabelType,\n} & LabelHTMLAttributes<HTMLLabelElement>\n\n/**\n * A Label component\n */\nexport const Label = ({\n  children,\n  name,\n  labelType = 'labelSmall',\n  ...props\n}: LabelProps) => {\n  return (\n    <label {...props}>\n      {children ? children : (<span className={styleMapping[labelType]}>{name}</span>)}\n    </label>\n  )\n}\n"],"mappings":"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","names":["jsx","value","jsx","options","value"]}

package/dist/components/examples/StackingModals.d.mts

@@ -1,8 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-
-/**
- * An Example Component for Stacking Modals
- */
-declare const StackingModals: () => react_jsx_runtime.JSX.Element;
-
-export { StackingModals };

package/dist/components/examples/StackingModals.d.ts

@@ -1,8 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-
-/**
- * An Example Component for Stacking Modals
- */
-declare const StackingModals: () => react_jsx_runtime.JSX.Element;
-
-export { StackingModals };

package/dist/components/examples/StackingModals.js

@@ -1,498 +0,0 @@
-"use strict";
-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/examples/StackingModals.tsx
-var StackingModals_exports = {};
-__export(StackingModals_exports, {
-  StackingModals: () => StackingModals
-});
-module.exports = __toCommonJS(StackingModals_exports);
-var import_react6 = require("react");
-
-// src/components/modals/ModalRegister.tsx
-var import_react = require("react");
-
-// src/util/noop.ts
-var noop = () => void 0;
-
-// src/components/modals/ModalRegister.tsx
-var import_jsx_runtime = require("react/jsx-runtime");
-var ModalContext = (0, import_react.createContext)({
-  register: [],
-  addToRegister: noop,
-  removeFromRegister: noop
-});
-var ModalRegister = ({
-  children
-}) => {
-  const [register, setRegister] = (0, import_react.useState)([]);
-  const inRegister = (id) => {
-    return !!register.find((value) => value === id);
-  };
-  const addToRegister = (id) => {
-    if (!inRegister(id)) {
-      setRegister([...register, id]);
-    }
-  };
-  const removeFromRegister = (id) => {
-    if (inRegister(id)) {
-      setRegister(register.filter((value) => value !== id));
-    }
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ModalContext.Provider, { value: { register, addToRegister, removeFromRegister }, children });
-};
-
-// src/components/Button.tsx
-var import_clsx = __toESM(require("clsx"));
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var ButtonSizePaddings = {
-  small: "btn-sm",
-  medium: "btn-md",
-  large: "btn-lg"
-};
-var SolidButton = ({
-  children,
-  disabled = false,
-  color = "primary",
-  size = "medium",
-  startIcon,
-  endIcon,
-  onClick,
-  className,
-  ...restProps
-}) => {
-  const colorClasses = {
-    primary: "bg-button-solid-primary-background text-button-solid-primary-text",
-    secondary: "bg-button-solid-secondary-background text-button-solid-secondary-text",
-    tertiary: "bg-button-solid-tertiary-background text-button-solid-tertiary-text",
-    positive: "bg-button-solid-positive-background text-button-solid-positive-text",
-    warning: "bg-button-solid-warning-background text-button-solid-warning-text",
-    negative: "bg-button-solid-negative-background text-button-solid-negative-text"
-  }[color];
-  const iconColorClasses = {
-    primary: "text-button-solid-primary-icon",
-    secondary: "text-button-solid-secondary-icon",
-    tertiary: "text-button-solid-tertiary-icon",
-    positive: "text-button-solid-positive-icon",
-    warning: "text-button-solid-warning-icon",
-    negative: "text-button-solid-negative-icon"
-  }[color];
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
-    "button",
-    {
-      onClick: disabled ? void 0 : onClick,
-      disabled: disabled || onClick === void 0,
-      className: (0, import_clsx.default)(
-        className,
-        {
-          "text-disabled-text bg-disabled-background": disabled,
-          [(0, import_clsx.default)(colorClasses, "hover:brightness-90")]: !disabled
-        },
-        ButtonSizePaddings[size]
-      ),
-      ...restProps,
-      children: [
-        startIcon && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-          "span",
-          {
-            className: (0, import_clsx.default)({
-              [iconColorClasses]: !disabled,
-              [`text-disabled-icon`]: disabled
-            }),
-            children: startIcon
-          }
-        ),
-        children,
-        endIcon && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-          "span",
-          {
-            className: (0, import_clsx.default)({
-              [iconColorClasses]: !disabled,
-              [`text-disabled-icon`]: disabled
-            }),
-            children: endIcon
-          }
-        )
-      ]
-    }
-  );
-};
-
-// src/hooks/useLanguage.tsx
-var import_react3 = require("react");
-
-// src/hooks/useLocalStorage.tsx
-var import_react2 = require("react");
-
-// src/hooks/useLanguage.tsx
-var import_jsx_runtime3 = require("react/jsx-runtime");
-var DEFAULT_LANGUAGE = "en";
-var LanguageContext = (0, import_react3.createContext)({ language: DEFAULT_LANGUAGE, setLanguage: (v) => v });
-var useLanguage = () => (0, import_react3.useContext)(LanguageContext);
-
-// src/hooks/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/modals/Modal.tsx
-var import_react5 = require("react");
-var import_react_dom = __toESM(require("react-dom"));
-var import_lucide_react = require("lucide-react");
-var import_clsx3 = __toESM(require("clsx"));
-
-// src/hooks/useHoverState.ts
-var import_react4 = require("react");
-var defaultUseHoverStateProps = {
-  closingDelay: 200,
-  isDisabled: false
-};
-var useHoverState = (props = void 0) => {
-  const { closingDelay, isDisabled } = { ...defaultUseHoverStateProps, ...props };
-  const [isHovered, setIsHovered] = (0, import_react4.useState)(false);
-  const [timer, setTimer] = (0, import_react4.useState)();
-  const onMouseEnter = () => {
-    if (isDisabled) {
-      return;
-    }
-    clearTimeout(timer);
-    setIsHovered(true);
-  };
-  const onMouseLeave = () => {
-    if (isDisabled) {
-      return;
-    }
-    setTimer(setTimeout(() => {
-      setIsHovered(false);
-    }, closingDelay));
-  };
-  (0, import_react4.useEffect)(() => {
-    if (timer) {
-      return () => {
-        clearTimeout(timer);
-      };
-    }
-  });
-  (0, import_react4.useEffect)(() => {
-    if (timer) {
-      clearTimeout(timer);
-    }
-  }, [isDisabled]);
-  return {
-    isHovered,
-    setIsHovered,
-    handlers: { onMouseEnter, onMouseLeave }
-  };
-};
-
-// src/components/Tooltip.tsx
-var import_clsx2 = require("clsx");
-var import_jsx_runtime4 = require("react/jsx-runtime");
-var Tooltip = ({
-  tooltip,
-  children,
-  animationDelay = 650,
-  tooltipClassName = "",
-  containerClassName = "",
-  position = "bottom",
-  zIndex = 10
-}) => {
-  const { isHovered, handlers } = useHoverState();
-  const positionClasses = {
-    top: `bottom-full left-1/2 -translate-x-1/2 mb-[6px]`,
-    bottom: `top-full left-1/2 -translate-x-1/2 mt-[6px]`,
-    left: `right-full top-1/2 -translate-y-1/2 mr-[6px]`,
-    right: `left-full top-1/2 -translate-y-1/2 ml-[6px]`
-  };
-  const triangleSize = 6;
-  const triangleClasses = {
-    top: `top-full left-1/2 -translate-x-1/2 border-t-gray-600 border-l-transparent border-r-transparent`,
-    bottom: `bottom-full left-1/2 -translate-x-1/2 border-b-gray-600 border-l-transparent border-r-transparent`,
-    left: `left-full top-1/2 -translate-y-1/2 border-l-gray-600 border-t-transparent border-b-transparent`,
-    right: `right-full top-1/2 -translate-y-1/2 border-r-gray-600 border-t-transparent border-b-transparent`
-  };
-  const triangleStyle = {
-    top: { borderWidth: `${triangleSize}px ${triangleSize}px 0 ${triangleSize}px` },
-    bottom: { borderWidth: `0 ${triangleSize}px ${triangleSize}px ${triangleSize}px` },
-    left: { borderWidth: `${triangleSize}px 0 ${triangleSize}px ${triangleSize}px` },
-    right: { borderWidth: `${triangleSize}px ${triangleSize}px ${triangleSize}px 0` }
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-    "div",
-    {
-      className: (0, import_clsx2.clsx)("relative inline-block", containerClassName),
-      ...handlers,
-      children: [
-        children,
-        isHovered && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-          "div",
-          {
-            className: (0, import_clsx2.clsx)(`opacity-0 absolute text-black text-xs font-semibold text-gray-600 px-2 py-1 rounded whitespace-nowrap border-2 border-gray-600
-           animate-tooltip-fade-in shadow-lg bg-gray-100`, positionClasses[position], tooltipClassName),
-            style: { zIndex, animationDelay: animationDelay + "ms" },
-            children: [
-              tooltip,
-              /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-                "div",
-                {
-                  className: (0, import_clsx2.clsx)(`absolute w-0 h-0`, triangleClasses[position]),
-                  style: { ...triangleStyle[position], zIndex }
-                }
-              )
-            ]
-          }
-        )
-      ]
-    }
-  );
-};
-
-// src/components/modals/Modal.tsx
-var import_jsx_runtime5 = require("react/jsx-runtime");
-var defaultModalHeaderTranslation = {
-  en: {
-    close: "Close"
-  },
-  de: {
-    close: "Schlie\xDFen"
-  }
-};
-var ModalHeader = ({
-  overwriteTranslation,
-  onCloseClick,
-  title,
-  titleText = "",
-  description,
-  descriptionText = ""
-}) => {
-  const translation = useTranslation(defaultModalHeaderTranslation, overwriteTranslation);
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "col", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "row justify-between items-start gap-x-8", children: [
-      title ?? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: (0, import_clsx3.default)("textstyle-title-lg", {
-        "mb-1": description || descriptionText
-      }), children: titleText }),
-      !!onCloseClick && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Tooltip, { tooltip: translation.close, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("button", { className: "row bg-gray-200 hover:bg-gray-300 rounded-md p-1", onClick: onCloseClick, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react.X, {}) }) })
-    ] }),
-    description ?? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "textstyle-description", children: descriptionText })
-  ] });
-};
-var modalRootName = "modal-root";
-var Modal = ({
-  children,
-  id,
-  isOpen,
-  onBackgroundClick,
-  backgroundClassName = "",
-  modalClassName = "",
-  containerClassName = "",
-  ...modalHeaderProps
-}) => {
-  const modalRoot = typeof window !== "undefined" ? document.getElementById(modalRootName) : null;
-  const {
-    register,
-    addToRegister,
-    removeFromRegister
-  } = (0, import_react5.useContext)(ModalContext);
-  if (!id) {
-    console.error("the id cannot be empty");
-  }
-  (0, import_react5.useEffect)(() => {
-    if (isOpen) {
-      addToRegister(id);
-    } else {
-      removeFromRegister(id);
-    }
-  }, [addToRegister, id, removeFromRegister, isOpen]);
-  if (modalRoot === null || !isOpen) return null;
-  const isLast = register.length < 1 || register[register.length - 1] === id;
-  const isSecondLast = register.length < 2 || register[register.length - 2] === id;
-  return import_react_dom.default.createPortal(
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: (0, import_clsx3.default)("fixed inset-0 overflow-y-auto z-[99]", containerClassName), id, children: [
-      isLast && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-        "div",
-        {
-          className: (0, import_clsx3.default)("fixed inset-0 h-screen w-screen", backgroundClassName, {
-            "bg-black/70": isLast && register.length === 1
-          }),
-          onClick: onBackgroundClick
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
-        "div",
-        {
-          className: (0, import_clsx3.default)("fixed left-1/2 top-1/2 -translate-y-1/2 -translate-x-1/2 col p-4 bg-white text-black rounded-xl shadow-xl", modalClassName),
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ModalHeader, { ...modalHeaderProps }),
-            children
-          ]
-        }
-      ),
-      !isLast && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-        "div",
-        {
-          className: (0, import_clsx3.default)("fixed inset-0 h-screen w-screen", backgroundClassName, {
-            "bg-black/70": isSecondLast && register.length > 1
-          })
-        }
-      )
-    ] }),
-    modalRoot,
-    id
-  );
-};
-
-// src/components/modals/ConfirmDialog.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
-var defaultConfirmDialogTranslation = {
-  en: {
-    confirm: "Confirm",
-    cancel: "Cancel",
-    decline: "Decline"
-  },
-  de: {
-    confirm: "Best\xE4tigen",
-    cancel: "Abbrechen",
-    decline: "Ablehnen"
-  }
-};
-var ConfirmDialog = ({
-  overwriteTranslation,
-  children,
-  onCancel,
-  onConfirm,
-  onDecline,
-  confirmType = "positive",
-  buttonOverwrites,
-  ...restProps
-}) => {
-  const translation = useTranslation(defaultConfirmDialogTranslation, overwriteTranslation);
-  const mapping = {
-    neutral: "primary",
-    negative: "negative",
-    positive: "positive"
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Modal, { ...restProps, children: [
-    children,
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "row mt-3 gap-x-4 justify-end", children: [
-      onCancel && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-        SolidButton,
-        {
-          color: buttonOverwrites?.[0].color ?? "primary",
-          onClick: onCancel,
-          disabled: buttonOverwrites?.[0].disabled ?? false,
-          children: buttonOverwrites?.[0].text ?? translation.cancel
-        }
-      ),
-      onDecline && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-        SolidButton,
-        {
-          color: buttonOverwrites?.[1].color ?? "negative",
-          onClick: onDecline,
-          disabled: buttonOverwrites?.[1].disabled ?? false,
-          children: buttonOverwrites?.[1].text ?? translation.decline
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-        SolidButton,
-        {
-          autoFocus: true,
-          color: buttonOverwrites?.[2].color ?? mapping[confirmType],
-          onClick: onConfirm,
-          disabled: buttonOverwrites?.[2].disabled ?? false,
-          children: buttonOverwrites?.[2].text ?? translation.confirm
-        }
-      )
-    ] })
-  ] });
-};
-
-// src/components/examples/StackingModals.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
-var StackingModals = () => {
-  const [modal1, setModal1] = (0, import_react6.useState)(false);
-  const [modal2, setModal2] = (0, import_react6.useState)(false);
-  const [modal3, setModal3] = (0, import_react6.useState)(false);
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(ModalRegister, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
-      ConfirmDialog,
-      {
-        id: "1",
-        isOpen: modal1,
-        onConfirm: () => setModal1(false),
-        onBackgroundClick: () => setModal1(false),
-        onCloseClick: () => setModal1(false),
-        modalClassName: "!bg-yellow-200 min-h-[300px]",
-        children: [
-          "I'm Modal 1",
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SolidButton, { onClick: () => setModal2(true), children: "Open Modal 2" })
-        ]
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
-      ConfirmDialog,
-      {
-        id: "2",
-        isOpen: modal2,
-        onConfirm: () => setModal2(false),
-        onBackgroundClick: () => setModal2(false),
-        onCloseClick: () => setModal2(false),
-        modalClassName: "!bg-green-200 min-w-[300px]",
-        children: [
-          "The next layer of Modals!",
-          "This is Modal 2",
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SolidButton, { onClick: () => setModal3(true), children: "Open Modal 3" })
-        ]
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-      ConfirmDialog,
-      {
-        id: "3",
-        isOpen: modal3,
-        onConfirm: () => setModal3(false),
-        onBackgroundClick: () => setModal3(false),
-        onCloseClick: () => setModal3(false),
-        children: "This is Modal 3!"
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "row items-center justify-center min-h-[400px]", id: modalRootName, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SolidButton, { onClick: () => setModal1(true), children: "Open Modal 1" }) })
-  ] });
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  StackingModals
-});
-//# sourceMappingURL=StackingModals.js.map