@hortiview/shared-components 0.0.11176 → 0.0.11528

package/dist/components/ListArea/ListArea.test.js

@@ -1,9 +1,9 @@
 import { jsx as r, Fragment as i } from "react/jsx-runtime";
-import { TypoButton as p } from "@element/react-components";
-import { a as s, s as a, f as u } from "../../react.esm-FR1-H8iU.js";
+import { TypoButton as p } from "@element-public/react-components";
+import { a as s, s as a, f as u } from "../../react.esm-DNwojocF.js";
 import { ListArea as c } from "./ListArea.js";
-import { g as d } from "../../ListAreaService-CRX4eEUJ.js";
-import { d as m, t as n, g as t } from "../../vi.CjhMlMwf-DWv7vrn7.js";
+import { g as h } from "../../ListAreaService-YS_UUPh5.js";
+import { d as m, t as n, g as t } from "../../vi.CjhMlMwf-BCJNwXvu.js";
 m("ListArea Test", () => {
   const o = [
     {
@@ -99,7 +99,7 @@ m("ListAreaService Test", () => {
     }
   ];
   n("should return grouped items", () => {
-    const e = d(o, "", "", void 0);
+    const e = h(o, "", "", void 0);
     t(e.length).toBe(2), t(e[0].groupName).toStrictEqual(/* @__PURE__ */ r(p, { tag: "span", children: "farm-1" })), t(e[0].items.length).toBe(2), t(e[1].groupName).toStrictEqual(/* @__PURE__ */ r(p, { tag: "span", children: "farm-2" })), t(e[1].items.length).toBe(1);
   });
 });

package/dist/components/ListArea/ListAreaService.d.ts

@@ -1,6 +1,7 @@
 import { ChangeEvent } from 'react';
 import { ListElement } from '../../types/ListElement';
 import { LinkProps } from '../../types/internal/ReactRouterTypes';
+
 /**
  * Groups items by groupName property and maps them to the schema of Bayer's List component
  * @param items the items to group
@@ -27,18 +28,18 @@ export declare const getListedItems: (items: ListElement[], pathname: string, it
     primaryText: string;
     secondaryText: import("react/jsx-runtime").JSX.Element;
     overlineText: import("react/jsx-runtime").JSX.Element | undefined;
-    trailingBlock: string | number | boolean | JSX.Element | Iterable<import("react").ReactNode>;
+    trailingBlock: string | number | boolean | JSX.Element | Iterable<import('react').ReactNode>;
     leadingBlock: string | JSX.Element | undefined;
     value: string | undefined;
     componentProps: {
         id: string;
         'data-testid': string;
         key: string;
-        leadingBlockType: "icon" | "badge" | "image" | "meta" | "checkbox" | "radio" | "switch" | "avatar" | "lgImage" | "thumbnail";
-        trailingBlockType: "icon" | "badge" | "image" | "meta" | "checkbox" | "radio" | "switch" | "avatar" | "lgImage" | "thumbnail";
+        leadingBlockType: "checkbox" | "radio" | "switch" | "meta" | "image" | "icon" | "badge" | "avatar" | "lgImage" | "thumbnail";
+        trailingBlockType: "checkbox" | "radio" | "switch" | "meta" | "image" | "icon" | "badge" | "avatar" | "lgImage" | "thumbnail";
         className: string;
         onClick: (_: ChangeEvent, value: string) => void | undefined;
-        tag: string | import("react").ForwardRefExoticComponent<LinkProps & import("react").RefAttributes<HTMLAnchorElement>> | undefined;
+        tag: string | import('react').ForwardRefExoticComponent<LinkProps & import('react').RefAttributes<HTMLAnchorElement>> | undefined;
         to: string | undefined;
         disabled: boolean | undefined;
     };
@@ -57,18 +58,18 @@ export declare const mapListElement: (element: ListElement, pathname: string | u
     primaryText: string;
     secondaryText: import("react/jsx-runtime").JSX.Element;
     overlineText: import("react/jsx-runtime").JSX.Element | undefined;
-    trailingBlock: string | number | boolean | JSX.Element | Iterable<import("react").ReactNode>;
+    trailingBlock: string | number | boolean | JSX.Element | Iterable<import('react').ReactNode>;
     leadingBlock: string | JSX.Element | undefined;
     value: string | undefined;
     componentProps: {
         id: string;
         'data-testid': string;
         key: string;
-        leadingBlockType: "icon" | "badge" | "image" | "meta" | "checkbox" | "radio" | "switch" | "avatar" | "lgImage" | "thumbnail";
-        trailingBlockType: "icon" | "badge" | "image" | "meta" | "checkbox" | "radio" | "switch" | "avatar" | "lgImage" | "thumbnail";
+        leadingBlockType: "checkbox" | "radio" | "switch" | "meta" | "image" | "icon" | "badge" | "avatar" | "lgImage" | "thumbnail";
+        trailingBlockType: "checkbox" | "radio" | "switch" | "meta" | "image" | "icon" | "badge" | "avatar" | "lgImage" | "thumbnail";
         className: string;
         onClick: (_: ChangeEvent, value: string) => void | undefined;
-        tag: string | import("react").ForwardRefExoticComponent<LinkProps & import("react").RefAttributes<HTMLAnchorElement>> | undefined;
+        tag: string | import('react').ForwardRefExoticComponent<LinkProps & import('react').RefAttributes<HTMLAnchorElement>> | undefined;
         to: string | undefined;
         disabled: boolean | undefined;
     };

package/dist/components/ListArea/ListAreaService.js

@@ -1,8 +1,8 @@
 import "react/jsx-runtime";
-import "@element/react-components";
+import "@element-public/react-components";
 import "../Iconify/Iconify.js";
 import "../../enums/AvailableCustomIcons.js";
-import { g as s, a as i, m as a } from "../../ListAreaService-CRX4eEUJ.js";
+import { g as s, a as i, m as a } from "../../ListAreaService-YS_UUPh5.js";
 export {
   s as getGroupedItems,
   i as getListedItems,

package/dist/components/LoadingSpinner/Big/BigLoadingSpinner.js

@@ -1,6 +1,6 @@
 import "react/jsx-runtime";
-import "@element/react-components";
-import { B as t } from "../../../BigLoadingSpinner-C3wTbTD0.js";
+import "@element-public/react-components";
+import { B as t } from "../../../BigLoadingSpinner-D7H28pr5.js";
 import "../../Iconify/Iconify.js";
 export {
   t as BigLoadingSpinner

package/dist/components/LoadingSpinner/Big/BigLoadingSpinner.test.js

@@ -1,7 +1,7 @@
 import { jsx as o } from "react/jsx-runtime";
-import { s as r, B as n } from "../../../BigLoadingSpinner-C3wTbTD0.js";
-import { a as i, s as e } from "../../../react.esm-FR1-H8iU.js";
-import { d as g, t as a, g as t } from "../../../vi.CjhMlMwf-DWv7vrn7.js";
+import { s as r, B as n } from "../../../BigLoadingSpinner-D7H28pr5.js";
+import { a as i, s as e } from "../../../react.esm-DNwojocF.js";
+import { d as g, t as a, g as t } from "../../../vi.CjhMlMwf-BCJNwXvu.js";
 g("BigLoadingSpinner Test", () => {
   a("render BigLoadingSpinner with custom loading text", () => {
     i(/* @__PURE__ */ o(n, { text: "Please wait..." })), t(e.getByText("Please wait...")).toBeInTheDocument(), t(e.getByRole("progressbar")).toBeInTheDocument();

package/dist/components/LoadingSpinner/Default/LoadingSpinner.js

@@ -1,11 +1,10 @@
-import "../../../assets/LoadingSpinner.css";
 import { jsx as n, jsxs as u } from "react/jsx-runtime";
-import { CircularProgress as s, Padding as h, Group as S, TypoBody as x } from "@element/react-components";
+import { CircularProgress as s, Padding as h, Group as S, TypoBody as x } from "@element-public/react-components";
 import { useState as C, useEffect as y, useMemo as v } from "react";
-import { B as b } from "../../../BigLoadingSpinner-C3wTbTD0.js";
-const A = "_loadingSpinnerContainer_1f3ss_1", B = {
+import { B as b } from "../../../BigLoadingSpinner-D7H28pr5.js";
+import '../../../assets/LoadingSpinner.css';const A = "_loadingSpinnerContainer_1f3ss_1", B = {
   loadingSpinnerContainer: A
-}, I = ({
+}, k = ({
   size: r,
   center: l = !1,
   text: i,
@@ -61,5 +60,5 @@ const A = "_loadingSpinnerContainer_1f3ss_1", B = {
   );
 };
 export {
-  I as LoadingSpinner
+  k as LoadingSpinner
 };

package/dist/components/LoadingSpinner/Default/LoadingSpinner.test.js

@@ -1,7 +1,7 @@
 import { jsx as n } from "react/jsx-runtime";
-import { a, s as e, b as s } from "../../../react.esm-FR1-H8iU.js";
+import { a, s as e, b as s } from "../../../react.esm-DNwojocF.js";
 import { LoadingSpinner as i } from "./LoadingSpinner.js";
-import { d as m, b as d, t as o, g as t, a as r } from "../../../vi.CjhMlMwf-DWv7vrn7.js";
+import { d as m, b as d, t as o, g as t, a as r } from "../../../vi.CjhMlMwf-BCJNwXvu.js";
 m("LoadingSpinner Test", () => {
   d(() => {
     r.useFakeTimers();

package/dist/components/Modal/Modal.d.ts

@@ -1,2 +1,3 @@
-import { ModalProps } from '@element/react-components';
+import { ModalProps } from '@element-public/react-components';
+
 export declare const Modal: (props: ModalProps & React.HTMLProps<HTMLElement> & React.DOMAttributes<HTMLElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Modal/Modal.js

@@ -1,16 +1,15 @@
-import "../../assets/Modal.css";
 import { jsx as o } from "react/jsx-runtime";
-import { Modal as l } from "@element/react-components";
-const m = "_modal_a4n3a_1", t = {
+import { Modal as l } from "@element-public/react-components";
+import '../../assets/Modal.css';const m = "_modal_a4n3a_1", d = {
   modal: m
-}, r = (a) => /* @__PURE__ */ o(
+}, e = (a) => /* @__PURE__ */ o(
   l,
   {
     ...a,
     "data-testid": "modal",
-    className: `${a.className ?? ""} ${a.modalSize === "fullscreen" ? t.modal : ""}`
+    className: `${a.className ?? ""} ${a.modalSize === "fullscreen" ? d.modal : ""}`
   }
 );
 export {
-  r as Modal
+  e as Modal
 };

package/dist/components/OverflowTooltip/OverflowTooltip.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 type OverflowTooltipProps = {
     /**
      * the id of the tooltip

package/dist/components/OverflowTooltip/OverflowTooltip.js

@@ -1,25 +1,24 @@
-import "../../assets/OverflowTooltip.css";
 import { jsxs as m, Fragment as a, jsx as s } from "react/jsx-runtime";
-import { TypoBody as p } from "@element/react-components";
+import { TypoBody as p } from "@element-public/react-components";
 import { useState as h, useMemo as d, cloneElement as f } from "react";
-import { H as w } from "../../react-tooltip.min-c2wVkjF2.js";
+import { M as w } from "../../react-tooltip.min-Czs4RGD1.js";
 import { hasChildWithGreaterWidth as W } from "./OverflowTooltipService.js";
-const u = "_truncate_wgwcv_1", v = {
+import '../../assets/OverflowTooltip.css';const u = "_truncate_wgwcv_1", v = {
   truncate: u
-}, H = ({ id: o, text: i, children: e }) => {
-  const [l, r] = h(!1), n = d(
+}, E = ({ id: o, text: l, children: e }) => {
+  const [i, n] = h(!1), r = d(
     () => f(e, {
       "data-tooltip-id": o,
       onMouseEnter: ({ currentTarget: t }) => {
         const c = t.clientWidth < t.scrollWidth || t.clientHeight < t.scrollHeight || W(t, t.parentElement?.clientWidth);
-        r(c);
+        n(c);
       },
       className: `${v.truncate} ${e.props.className}`
     }),
     [e, o]
   );
   return /* @__PURE__ */ m(a, { children: [
-    n,
+    r,
     /* @__PURE__ */ s(
       w,
       {
@@ -27,17 +26,17 @@ const u = "_truncate_wgwcv_1", v = {
         noArrow: !0,
         place: "bottom",
         clickable: !0,
-        hidden: !l,
+        hidden: !i,
         style: {
           whiteSpace: "normal",
           maxWidth: "90%",
           wordBreak: "break-word"
         },
-        children: /* @__PURE__ */ s(p, { level: 2, children: i })
+        children: /* @__PURE__ */ s(p, { level: 2, children: l })
       }
     )
   ] });
 };
 export {
-  H as OverflowTooltip
+  E as OverflowTooltip
 };

package/dist/components/OverflowTooltip/OverflowTooltip.test.js

@@ -1,9 +1,9 @@
 import { jsx as t } from "react/jsx-runtime";
-import { TypoDisplay as n } from "@element/react-components";
-import { a as i, s as e, w as s } from "../../react.esm-FR1-H8iU.js";
-import { u as a } from "../../index-DzM8o582.js";
+import { TypoDisplay as n } from "@element-public/react-components";
+import { a as i, s as e, w as s } from "../../react.esm-DNwojocF.js";
+import { u as a } from "../../index-CrcXCSzI.js";
 import { OverflowTooltip as c } from "./OverflowTooltip.js";
-import { d as u, t as p, g as r } from "../../vi.CjhMlMwf-DWv7vrn7.js";
+import { d as u, t as p, g as r } from "../../vi.CjhMlMwf-BCJNwXvu.js";
 u("OverflowTooltip Test", () => {
   p("should render OverflowTooltip on hover", async () => {
     Object.defineProperty(HTMLElement.prototype, "clientWidth", {

package/dist/components/Scrollbar/Scrollbar.js

@@ -1,9 +1,8 @@
-import "../../assets/Scrollbar.css";
-const l = "_scrollbarY_1m6g8_1", o = "_scrollbarX_1m6g8_5", r = {
-  scrollbarY: l,
+import '../../assets/Scrollbar.css';const r = "_scrollbarY_1m6g8_1", o = "_scrollbarX_1m6g8_5", l = {
+  scrollbarY: r,
   scrollbarX: o
-}, s = r.scrollbarY, a = r.scrollbarX;
+}, c = l.scrollbarY, s = l.scrollbarX;
 export {
-  a as ScrollbarX,
-  s as ScrollbarY
+  s as ScrollbarX,
+  c as ScrollbarY
 };

package/dist/components/Scrollbar/scrollbar.test.js

@@ -1,7 +1,7 @@
 import { jsx as s } from "react/jsx-runtime";
-import { a, s as e } from "../../react.esm-FR1-H8iU.js";
+import { a, s as e } from "../../react.esm-DNwojocF.js";
 import { ScrollbarY as d, ScrollbarX as l } from "./Scrollbar.js";
-import { d as c, t, g as o } from "../../vi.CjhMlMwf-DWv7vrn7.js";
+import { d as c, t, g as o } from "../../vi.CjhMlMwf-BCJNwXvu.js";
 c("Scrollbar", () => {
   t("should render Y correctly", () => {
     a(/* @__PURE__ */ s("div", { "data-testid": "div", className: d }));

package/dist/components/SearchBar/SearchBar.js

@@ -1,27 +1,26 @@
-import "../../assets/SearchBar.css";
 import { jsx as r } from "react/jsx-runtime";
-import { Textfield as i, IconButton as s } from "@element/react-components";
-const l = "_searchbar_gnvwc_1", u = {
+import { Textfield as s, IconButton as i } from "@element-public/react-components";
+import '../../assets/SearchBar.css';const l = "_searchbar_gnvwc_1", u = {
   searchbar: l
 }, b = ({
-  className: n = "",
-  dense: e = !1,
+  className: o = "",
+  dense: n = !1,
   searchTerm: a,
   setSearchTerm: t,
-  placeholder: o
+  placeholder: e
 }) => /* @__PURE__ */ r(
-  i,
+  s,
   {
     "data-testid": "search-bar-input",
-    className: `${n ?? ""} ${u.searchbar}`,
-    dense: e,
+    className: `${o ?? ""} ${u.searchbar}`,
+    dense: n,
     variant: "outlined",
-    placeholder: o,
+    placeholder: e,
     value: a,
     onChange: (c) => t(c.target.value),
     fullWidth: !0,
     trailingIcon: /* @__PURE__ */ r(
-      s,
+      i,
       {
         icon: a ? "close" : "search",
         onClick: () => a ? t("") : void 0

package/dist/components/SearchBar/SearchBar.test.js

@@ -1,7 +1,7 @@
 import { jsx as a } from "react/jsx-runtime";
-import { a as r, s as t, f as h, b as l } from "../../react.esm-FR1-H8iU.js";
+import { a as r, s as t, f as h, b as l } from "../../react.esm-DNwojocF.js";
 import { SearchBar as s } from "./SearchBar.js";
-import { d as m, t as o, v as n, g as e } from "../../vi.CjhMlMwf-DWv7vrn7.js";
+import { d as m, t as o, v as n, g as e } from "../../vi.CjhMlMwf-BCJNwXvu.js";
 m("SearchBar Test", () => {
   o("renders SearchBar component", () => {
     r(

package/dist/components/Select/Select.d.ts

@@ -0,0 +1,14 @@
+import { SelectProps } from '@element-public/react-components';
+
+export type ExtendedSelectProps = SelectProps & {
+    'data-testid'?: string;
+    /** Custom class name for the portal. Only works if portalContainer is not set. */
+    portalClassName?: string;
+};
+/**
+ * Provides the normal element select with some presets and the possibility to pass a custom portal class name
+ * @param menuMaxHeight Default: 15rem
+ * @param portalClassName Custom class name for the portal. Only works if portalContainer is not set.
+ * @param props Element Select props
+ */
+export declare const Select: ({ menuMaxHeight, portalClassName, className, hoisted, ...props }: ExtendedSelectProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Select/Select.js

@@ -0,0 +1,34 @@
+import { jsx as m, Fragment as u } from "react/jsx-runtime";
+import { Select as d } from "@element-public/react-components";
+import { useEffect as a } from "react";
+import '../../assets/Select.css';const i = "_customPortal_8wq49_1", f = "_customSelect_8wq49_7", s = {
+  customPortal: i,
+  customSelect: f
+}, _ = ({
+  menuMaxHeight: l = "15rem",
+  portalClassName: e,
+  className: n,
+  hoisted: c,
+  ...r
+}) => {
+  const t = `custom-portal-${e ?? "default"}`;
+  return a(() => {
+    if (c && !document.getElementById(t)) {
+      const o = document.createElement("div");
+      o.id = t, o.className = `${s.customPortal} ${e ?? ""}`, document.body.appendChild(o);
+    }
+  }, [c, t, e]), /* @__PURE__ */ m(u, { children: /* @__PURE__ */ m(
+    d,
+    {
+      "data-testid": "custom-select",
+      menuMaxHeight: l,
+      hoisted: c,
+      portalContainer: document.getElementById(t) ? `#${t}` : void 0,
+      className: `${s.customSelect} ${n ?? ""}`,
+      ...r
+    }
+  ) });
+};
+export {
+  _ as Select
+};

package/dist/components/Select/Select.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/Select/Select.test.js

@@ -0,0 +1,28 @@
+import { jsx as s } from "react/jsx-runtime";
+import { a, s as c } from "../../react.esm-DNwojocF.js";
+import { Select as n } from "./Select.js";
+import { d as l, t as m, g as e } from "../../vi.CjhMlMwf-BCJNwXvu.js";
+l("Select", () => {
+  const o = [
+    { value: "1", text: "Option 1" },
+    { value: "2", text: "Option 2" },
+    { value: "3", text: "Option 3" }
+  ];
+  m("render select without portal when not hoisted and with default data-testid", () => {
+    a(/* @__PURE__ */ s(n, { options: o })), e(c.getByTestId("custom-select")).toBeInTheDocument();
+    const t = c.queryByTestId("custom-portal");
+    e(t).not.toBeInTheDocument();
+  }), m("render select with custom data-testid", () => {
+    a(/* @__PURE__ */ s(n, { options: o, "data-testid": "custom-test-id" })), e(c.getByTestId("custom-test-id")).toBeInTheDocument();
+    const t = c.queryByTestId("custom-select");
+    e(t).not.toBeInTheDocument();
+  }), m("render select with default portal class name", () => {
+    a(/* @__PURE__ */ s(n, { hoisted: !0, options: o }));
+    const t = document.getElementById("custom-portal-default");
+    e(t).toBeInTheDocument();
+  }), m("render select with custom portal class name", () => {
+    a(/* @__PURE__ */ s(n, { hoisted: !0, options: o, portalClassName: "test-custom-portal-class-name" }));
+    const t = document.getElementById("custom-portal-test-custom-portal-class-name");
+    e(t).toBeInTheDocument();
+  });
+});

package/dist/components/VerticalDivider/VerticalDivider.js

@@ -1,8 +1,7 @@
-import "../../assets/VerticalDivider.css";
-import { jsx as e } from "react/jsx-runtime";
-const d = "_divider_opvom_1", t = {
+import { jsx as r } from "react/jsx-runtime";
+import '../../assets/VerticalDivider.css';const d = "_divider_opvom_1", s = {
   divider: d
-}, v = ({ height: i = "2rem", className: r = "" }) => /* @__PURE__ */ e("div", { className: `${t.divider} ${r}`, style: { height: i } });
+}, o = ({ height: i = "2rem", className: e = "" }) => /* @__PURE__ */ r("div", { className: `${s.divider} ${e}`, style: { height: i } });
 export {
-  v as VerticalDivider
+  o as VerticalDivider
 };

package/dist/components/VerticalDivider/VerticalDivider.test.js

@@ -1,7 +1,7 @@
 import { jsx as e } from "react/jsx-runtime";
-import { a as r } from "../../react.esm-FR1-H8iU.js";
+import { a as r } from "../../react.esm-DNwojocF.js";
 import { VerticalDivider as s } from "./VerticalDivider.js";
-import { d as o, t as l, g as i } from "../../vi.CjhMlMwf-DWv7vrn7.js";
+import { d as o, t as l, g as i } from "../../vi.CjhMlMwf-BCJNwXvu.js";
 o("VerticalDivider Test", () => {
   l("it should render with basic styling", () => {
     r(/* @__PURE__ */ e(s, {}));

package/dist/hooks/useBreakpoints.test.js

@@ -1,6 +1,6 @@
-import { r as t, w as s } from "../react.esm-FR1-H8iU.js";
+import { r as t, w as s } from "../react.esm-DNwojocF.js";
 import { u as o } from "../useBreakpoints-MzTZ0tCT.js";
-import { d as a, t as i, g as r } from "../vi.CjhMlMwf-DWv7vrn7.js";
+import { d as a, t as i, g as r } from "../vi.CjhMlMwf-BCJNwXvu.js";
 a("useBreakpoint Test", () => {
   i("returns object", () => {
     const { result: e } = t(() => o());

package/dist/hooks/useHelperText.d.ts

@@ -1,4 +1,5 @@
 import { FieldValues, Path } from 'react-hook-form';
+
 type HelperTextProps<T> = {
     propertyName: Path<T>;
     helperText: string | null;