@hortiview/shared-components 0.0.11176 → 0.0.11587

package/dist/components/ModulePadding/ModulePadding.d.ts

@@ -0,0 +1,7 @@
+import { PropsWithChildren } from 'react';
+
+/**
+ * Provides a responsive padding component for modules according to the HV platform UI guidelines, based on the Bayer Element padding component.
+ * @param children - The module content to be rendered in the module padding
+ */
+export declare const ModulePadding: ({ children }: PropsWithChildren) => import("react/jsx-runtime").JSX.Element;

package/dist/components/ModulePadding/ModulePadding.js

@@ -0,0 +1,28 @@
+import { jsx as i } from "react/jsx-runtime";
+import { P as r } from "../../index.es-D-CKRzIB.js";
+import '../../assets/main.css';/* empty css                  */
+import { u as m } from "../../useBreakpoints-MzTZ0tCT.js";
+import "react";
+import "../../isEmpty-B4GG2s-V.js";
+import "../../react-tooltip.min-DSY6KDqS.js";
+import "../../orderBy-Bd48bw88.js";
+import "../../uniqueId-NU3-C36A.js";
+import "react-hook-form";
+import "../../get-DFv1gXfq.js";
+import "../../isArray-Dub1wGJM.js";
+import "../../isString-BW9UHONv.js";
+const x = ({ children: o }) => {
+  const { isDesktop: t } = m();
+  return /* @__PURE__ */ i(
+    r,
+    {
+      id: "module-padding",
+      "data-testid": "module-padding",
+      variant: t ? "standard" : "dense",
+      children: o
+    }
+  );
+};
+export {
+  x as ModulePadding
+};

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

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

package/dist/components/ModulePadding/ModulePadding.test.js

@@ -0,0 +1,22 @@
+import { jsx as t } from "react/jsx-runtime";
+import { a as o, s as e } from "../../react.esm-DNwojocF.js";
+import { a } from "../../useBreakpoints-MzTZ0tCT.js";
+import { ModulePadding as d } from "./ModulePadding.js";
+import { d as r, t as i, v as n, g as s } from "../../vi.CjhMlMwf-BCJNwXvu.js";
+r("ModulePadding Test", () => {
+  i("should render with padding of 16px for desktop", () => {
+    n.spyOn(a, "useBreakpoints").mockReturnValue({
+      isMobile: !1,
+      isTablet: !1,
+      isDesktop: !0,
+      isDesktopNavbar: !0
+    }), o(/* @__PURE__ */ t(d, { children: "Content" })), e.debug(), s(e.getByText("Content")).toBeInTheDocument(), s(e.getByTestId("module-padding")).toHaveClass("lmnt-padding--standard");
+  }), i("should render with padding of 8px for mobile", () => {
+    n.spyOn(a, "useBreakpoints").mockReturnValue({
+      isMobile: !0,
+      isTablet: !1,
+      isDesktop: !1,
+      isDesktopNavbar: !1
+    }), o(/* @__PURE__ */ t(d, { children: "Content" })), s(e.getByTestId("module-padding")).toHaveClass("lmnt-padding--dense");
+  });
+});

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 { jsxs as a, Fragment as m, jsx as s } from "react/jsx-runtime";
+import { b as p } from "../../index.es-CF_xy2ns.js";
 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-DSY6KDqS.js";
 import { hasChildWithGreaterWidth as W } from "./OverflowTooltipService.js";
-const u = "_truncate_wgwcv_1", v = {
+import '../../assets/OverflowTooltip.css';const u = "_truncate_wgwcv_1", b = {
   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}`
+      className: `${b.truncate} ${e.props.className}`
     }),
     [e, o]
   );
-  return /* @__PURE__ */ m(a, { children: [
-    n,
+  return /* @__PURE__ */ a(m, { children: [
+    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 { T as n } from "../../index.es-CF_xy2ns.js";
+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,27 @@
-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 { I as c } from "../../index.es-0lQcz8m1.js";
+import { T as i } from "../../index.es-25EARqhH.js";
+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: s
 }) => /* @__PURE__ */ r(
   i,
   {
     "data-testid": "search-bar-input",
-    className: `${n ?? ""} ${u.searchbar}`,
-    dense: e,
+    className: `${o ?? ""} ${u.searchbar}`,
+    dense: n,
     variant: "outlined",
-    placeholder: o,
+    placeholder: s,
     value: a,
-    onChange: (c) => t(c.target.value),
+    onChange: (e) => t(e.target.value),
     fullWidth: !0,
     trailingIcon: /* @__PURE__ */ r(
-      s,
+      c,
       {
         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-select';
+
+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 { S as d } from "../../index.es-UHKFl8Da.js";
+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: n = "15rem",
+  portalClassName: e,
+  className: r,
+  hoisted: o,
+  ...l
+}) => {
+  const t = `custom-portal-${e ?? "default"}`;
+  return a(() => {
+    if (o && !document.getElementById(t)) {
+      const c = document.createElement("div");
+      c.id = t, c.className = `${s.customPortal} ${e ?? ""}`, document.body.appendChild(c);
+    }
+  }, [o, t, e]), /* @__PURE__ */ m(u, { children: /* @__PURE__ */ m(
+    d,
+    {
+      "data-testid": "custom-select",
+      menuMaxHeight: n,
+      hoisted: o,
+      portalContainer: document.getElementById(t) ? `#${t}` : void 0,
+      className: `${s.customSelect} ${r ?? ""}`,
+      ...l
+    }
+  ) });
+};
+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, {}));