@hortiview/shared-components 0.0.6829 → 0.0.6849

package/dist/components/HashTabView/HashTabView.js

@@ -1,55 +1,55 @@
 import "../../assets/HashTabView.css";
-import { jsx as a, jsxs as d, Fragment as w } from "react/jsx-runtime";
-import { Elevation as T, Group as i, TabBar as C, Tab as k, Padding as A } from "@element/react-components";
-import { useState as I, useEffect as L } from "react";
-import { a as N } from "../../useBreakpoint-DROHPVxO.js";
-const x = "_elevation_1rcw6_1", y = "_themeBackground_1rcw6_6", W = "_tabBar_1rcw6_10", $ = "_tabWrapper_1rcw6_16", j = "_tabButton_1rcw6_20", E = "_childContainer_1rcw6_24", z = "_childContainerLg_1rcw6_28", t = {
-  elevation: x,
-  themeBackground: y,
-  tabBar: W,
-  tabWrapper: $,
+import { jsx as a, jsxs as d, Fragment as T } from "react/jsx-runtime";
+import { Elevation as C, Group as i, TabBar as k, Tab as A, Padding as I } from "@element/react-components";
+import { useState as N, useEffect as P } from "react";
+import { u as x } from "../../useBreakpoint-2MH8ICuE.js";
+const y = "_elevation_16c7u_1", W = "_themeBackground_16c7u_6", $ = "_tabBar_16c7u_10", w = "_tabWrapper_16c7u_16", j = "_tabButton_16c7u_20", E = "_childContainer_16c7u_24", z = "_childContainerPhone_16c7u_28", t = {
+  elevation: y,
+  themeBackground: W,
+  tabBar: $,
+  tabWrapper: w,
   tabButton: j,
   childContainer: E,
-  childContainerLg: z
-}, p = (n, r) => !r || !n ? 0 : n.findIndex((c) => c.hash === r.replace("#", "")) ?? 0, q = ({
+  childContainerPhone: z
+}, p = (n, r) => !r || !n ? 0 : n.findIndex((o) => o.hash === r.replace("#", "")) ?? 0, q = ({
   tabs: n,
   hasHash: r = !0,
-  hash: c = "",
-  clusterAlign: _ = "start",
-  hasClusteredTabs: u,
+  hash: o = "",
+  clusterAlign: m = "start",
+  hasClusteredTabs: _,
   children: s,
   verticalGap: g = "none",
   elevation: B = 0,
   backgroundColor: v = "themeBackground",
   onChange: b
 }) => {
-  const [h, m] = I(p(n, c)), { isLg: l } = N();
-  L(() => {
-    const e = p(n, c);
-    m(e);
-  }, [c, n, r]);
+  const [u, h] = N(p(n, o)), { isDesktop: l } = x();
+  P(() => {
+    const e = p(n, o);
+    h(e);
+  }, [o, n, r]);
   const f = (e) => {
-    const o = n[e].hash;
-    o != null && r && (window.location.hash = o), m(e), b?.(e);
+    const c = n[e].hash;
+    c != null && r && (window.location.hash = c), h(e), b?.(e);
   };
   return /* @__PURE__ */ a(
-    T,
+    C,
     {
       elevation: B,
       className: `${t.elevation} ${v === "none" ? "" : t.themeBackground}`,
       children: /* @__PURE__ */ d(i, { direction: "vertical", gap: g, secondaryAlign: "stretch", children: [
         /* @__PURE__ */ d(i, { direction: l ? "horizontal" : "vertical", className: t.tabWrapper, children: [
           /* @__PURE__ */ a(
-            C,
+            k,
             {
               className: t.tabBar,
-              clustered: l ? u : !1,
-              clusterAlign: _,
+              clustered: l ? _ : !1,
+              clusterAlign: m,
               variant: "surface",
-              activeTabIndex: h,
+              activeTabIndex: u,
               onTabActivated: f,
-              children: n.map((e, o) => /* @__PURE__ */ a(
-                k,
+              children: n.map((e, c) => /* @__PURE__ */ a(
+                A,
                 {
                   icon: e.leadingIcon,
                   className: s ? t.tabButton : "",
@@ -58,20 +58,20 @@ const x = "_elevation_1rcw6_1", y = "_themeBackground_1rcw6_6", W = "_tabBar_1rc
                     e.trailingIcon
                   ] })
                 },
-                `${o}_${e.hash}`
+                `${c}_${e.hash}`
               ))
             }
           ),
           s ? /* @__PURE__ */ a(
-            A,
+            I,
             {
               variant: "dense",
-              className: l ? t.childContainer : t.childContainerLg,
+              className: l ? t.childContainer : t.childContainerPhone,
               children: /* @__PURE__ */ a(i, { gap: "dense", primaryAlign: "center", secondaryAlign: "center", children: s })
             }
-          ) : /* @__PURE__ */ a(w, {})
+          ) : /* @__PURE__ */ a(T, {})
         ] }),
-        n[h]?.component
+        n[u]?.component
       ] })
     }
   );

package/dist/components/HashTabView/HashTabView.test.js

@@ -1,5 +1,5 @@
 import { jsx as n, Fragment as o } from "react/jsx-runtime";
-import { r as a, s as e, f as r } from "../../react.esm-BBemCHUU.js";
+import { a, s as e, f as r } from "../../react.esm-DoZanrUz.js";
 import { HashTabView as c } from "./HashTabView.js";
 import { d as h, t as l, g as t } from "../../vi.JYQecGiw-BbUbJcT8.js";
 const m = [

package/dist/components/HeaderFilter/HeaderFilter.test.js

@@ -1,5 +1,5 @@
 import { jsx as n } from "react/jsx-runtime";
-import { r as i, s as t, f as T } from "../../react.esm-BBemCHUU.js";
+import { a as i, s as t, f as T } from "../../react.esm-DoZanrUz.js";
 import { HeaderFilter as s } from "./HeaderFilter.js";
 import { d as c, t as o, v as l, g as e } from "../../vi.JYQecGiw-BbUbJcT8.js";
 c("HeaderFilter-Test", () => {

package/dist/components/Iconify/Iconify.test.js

@@ -1,7 +1,7 @@
 import { jsx as n } from "react/jsx-runtime";
 import { Iconify as c } from "./Iconify.js";
 import { AvailableCustomIcons as l } from "../../enums/AvailableCustomIcons.js";
-import { r, w as s, s as i } from "../../react.esm-BBemCHUU.js";
+import { a as r, w as s, s as i } from "../../react.esm-DoZanrUz.js";
 import { d as f, t as a, g as o } from "../../vi.JYQecGiw-BbUbJcT8.js";
 f("Iconify Test", async () => {
   const m = Object.keys(l).filter((e) => isNaN(Number(e)));

package/dist/components/InfoGroup/InfoGroup.js

@@ -1,8 +1,8 @@
 import "../../assets/InfoGroup.css";
 import { jsxs as c, jsx as e, Fragment as _ } from "react/jsx-runtime";
 import { Divider as d, Group as s, TypoCaption as v, TypoSubtitle as h } from "@element/react-components";
-import { a as g } from "../../useBreakpoint-DROHPVxO.js";
 import { Fragment as p } from "react";
+import { u as g } from "../../useBreakpoint-2MH8ICuE.js";
 import { VerticalDivider as b } from "../VerticalDivider/VerticalDivider.js";
 const f = "_container_egebs_1", C = "_dividerContainer_egebs_10", y = "_mainGroup_egebs_16", w = "_row_egebs_21", G = "_valueText_egebs_46", N = "_component_egebs_54", x = "_componentContainer_egebs_87", A = "_field_egebs_95", r = {
   container: f,
@@ -13,14 +13,14 @@ const f = "_container_egebs_1", C = "_dividerContainer_egebs_10", y = "_mainGrou
   component: N,
   componentContainer: x,
   field: A
-}, S = ({ fields: n, bold: i }) => {
+}, I = ({ fields: n, bold: i }) => {
   const t = n.length > 1 && Array.isArray(n.at(0)) ? n.map((o, a) => /* @__PURE__ */ c(p, { children: [
     a != 0 && /* @__PURE__ */ e("div", { "data-testid": "test-divider", className: r.dividerContainer, children: /* @__PURE__ */ e(d, {}) }),
     /* @__PURE__ */ e(m, { fields: o, bold: i })
   ] }, `row_${a}`)) : /* @__PURE__ */ e(m, { fields: n, bold: i });
   return /* @__PURE__ */ e(s, { direction: "vertical", fullWidth: !0, className: r.mainGroup, children: t });
 }, m = ({ fields: n, bold: i }) => {
-  const { isLg: l } = g();
+  const { isDesktop: l } = g();
   return /* @__PURE__ */ e(
     s,
     {
@@ -72,5 +72,5 @@ const f = "_container_egebs_1", C = "_dividerContainer_egebs_10", y = "_mainGrou
 };
 export {
   T as Cell,
-  S as InfoGroup
+  I as InfoGroup
 };

package/dist/components/InfoGroup/InfoGroup.test.js

@@ -1,5 +1,5 @@
 import { jsx as o } from "react/jsx-runtime";
-import { r as l, s as t } from "../../react.esm-BBemCHUU.js";
+import { a as l, s as t } from "../../react.esm-DoZanrUz.js";
 import { InfoGroup as r } from "./InfoGroup.js";
 import { d as s, t as i, g as e } from "../../vi.JYQecGiw-BbUbJcT8.js";
 s("InfoGroup Test", () => {

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

@@ -1,6 +1,6 @@
 import { jsx as r, Fragment as i } from "react/jsx-runtime";
 import { TypoButton as p } from "@element/react-components";
-import { r as s, s as a, f as u } from "../../react.esm-BBemCHUU.js";
+import { a as s, s as a, f as u } from "../../react.esm-DoZanrUz.js";
 import { ListArea as c } from "./ListArea.js";
 import { g as h } from "../../ListAreaService-DDlsV9UD.js";
 import { d as m, t as n, g as t } from "../../vi.JYQecGiw-BbUbJcT8.js";

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

@@ -1,15 +1,15 @@
 import { jsx as o } from "react/jsx-runtime";
 import { s as r, B as n } from "../../../BigLoadingSpinner-Df2k3xOD.js";
-import { r as i, s as e } from "../../../react.esm-BBemCHUU.js";
-import { d as g, t as s, g as t } from "../../../vi.JYQecGiw-BbUbJcT8.js";
+import { a as i, s as e } from "../../../react.esm-DoZanrUz.js";
+import { d as g, t as a, g as t } from "../../../vi.JYQecGiw-BbUbJcT8.js";
 g("BigLoadingSpinner Test", () => {
-  s("render BigLoadingSpinner with custom loading text", () => {
+  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();
-  }), s("renders BigLoadingSpinner with default loading text", () => {
+  }), a("renders BigLoadingSpinner with default loading text", () => {
     i(/* @__PURE__ */ o(n, { text: "loadingtext" })), t(e.getByText("loadingtext")).toBeInTheDocument();
-  }), s('Icon component contains className attribute "logo"', () => {
+  }), a('Icon component contains className attribute "logo"', () => {
     i(/* @__PURE__ */ o(n, {}));
-    const a = e.getByTestId("logo-icon");
-    t(a).toHaveClass(r.logo);
+    const s = e.getByTestId("logo-icon");
+    t(s).toHaveClass(r.logo);
   });
 });

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

@@ -1,5 +1,5 @@
 import { jsx as t } from "react/jsx-runtime";
-import { r as o, s as e } from "../../../react.esm-BBemCHUU.js";
+import { a as o, s as e } from "../../../react.esm-DoZanrUz.js";
 import { LoadingSpinner as r } from "./LoadingSpinner.js";
 import { d as a, t as i, g as n } from "../../../vi.JYQecGiw-BbUbJcT8.js";
 a("LoadingSpinner Test", () => {

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

@@ -1,7 +1,7 @@
 import { jsx as t } from "react/jsx-runtime";
 import { TypoDisplay as n } from "@element/react-components";
-import { r as i, s as e, w as s } from "../../react.esm-BBemCHUU.js";
-import { u as a } from "../../index-DfbRag7b.js";
+import { a as i, s as e, w as s } from "../../react.esm-DoZanrUz.js";
+import { u as a } from "../../index-DP2ENnrX.js";
 import { OverflowTooltip as c } from "./OverflowTooltip.js";
 import { d as u, t as p, g as r } from "../../vi.JYQecGiw-BbUbJcT8.js";
 u("OverflowTooltip Test", () => {

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

@@ -1,15 +1,15 @@
 import { jsx as s } from "react/jsx-runtime";
-import { r as e, s as t } from "../../react.esm-BBemCHUU.js";
+import { a, s as e } from "../../react.esm-DoZanrUz.js";
 import { ScrollbarY as d, ScrollbarX as l } from "./Scrollbar.js";
-import { d as c, t as a, g as o } from "../../vi.JYQecGiw-BbUbJcT8.js";
+import { d as c, t, g as o } from "../../vi.JYQecGiw-BbUbJcT8.js";
 c("Scrollbar", () => {
-  a("should render Y correctly", () => {
-    e(/* @__PURE__ */ s("div", { "data-testid": "div", className: d }));
-    const r = t.getByTestId("div");
+  t("should render Y correctly", () => {
+    a(/* @__PURE__ */ s("div", { "data-testid": "div", className: d }));
+    const r = e.getByTestId("div");
     o(r).toHaveClass(/scrollbarY/);
-  }), a("should render X correctly", () => {
-    e(/* @__PURE__ */ s("div", { "data-testid": "div", className: l }));
-    const r = t.getByTestId("div");
+  }), t("should render X correctly", () => {
+    a(/* @__PURE__ */ s("div", { "data-testid": "div", className: l }));
+    const r = e.getByTestId("div");
     o(r).toHaveClass(/scrollbarX/);
   });
 });

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

@@ -1,5 +1,5 @@
 import { jsx as a } from "react/jsx-runtime";
-import { r, s as t, f as h, a as l } from "../../react.esm-BBemCHUU.js";
+import { a as r, s as t, f as h, b as l } from "../../react.esm-DoZanrUz.js";
 import { SearchBar as s } from "./SearchBar.js";
 import { d as m, t as o, v as n, g as e } from "../../vi.JYQecGiw-BbUbJcT8.js";
 m("SearchBar Test", () => {

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

@@ -1,5 +1,5 @@
 import { jsx as e } from "react/jsx-runtime";
-import { r } from "../../react.esm-BBemCHUU.js";
+import { a as r } from "../../react.esm-DoZanrUz.js";
 import { VerticalDivider as s } from "./VerticalDivider.js";
 import { d as o, t as l, g as i } from "../../vi.JYQecGiw-BbUbJcT8.js";
 o("VerticalDivider Test", () => {

package/dist/hooks/useBreakpoint.d.ts

@@ -1,15 +1,20 @@
 /**
- * Custom hook that tells you whether a given media query is active.
+ * Hook that returns the current breakpoint. It uses the following breakpoints:
+ * - xs: 0-599px
+ * - sm: 600-719px
+ * - md: 720-839px
+ * - lg: 840-1023px
+ * - xl: 1024-1439px
+ * - xxl: 1440px and up
  *
- * Inspired by https://usehooks.com/useMedia/
- * https://gist.github.com/gragland/ed8cac563f5df71d78f4a1fefa8c5633
+ * They are combined as follows:
+ * - isMobile: xs
+ * - isTablet: sm, md
+ * - isDesktop: lg, xl, xxl
+ * @returns {Object} An object with the current breakpoint
  */
-export declare function useMediaQuery(query: string): boolean;
-export declare function useBreakpoints(): {
-    isXs: boolean;
-    isSm: boolean;
-    isMd: boolean;
-    isLg: boolean;
-    isXlg: boolean;
-    active: string;
+export declare const useBreakpoints: () => {
+    isMobile: boolean;
+    isTablet: boolean;
+    isDesktop: boolean;
 };

package/dist/hooks/useBreakpoint.js

@@ -1,6 +1,5 @@
 import "react";
-import { a as s, b as o } from "../useBreakpoint-DROHPVxO.js";
+import { u as p } from "../useBreakpoint-2MH8ICuE.js";
 export {
-  s as useBreakpoints,
-  o as useMediaQuery
+  p as useBreakpoints
 };

package/dist/hooks/useBreakpoints.test.d.ts

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

package/dist/hooks/useBreakpoints.test.js

@@ -0,0 +1,11 @@
+import { r as t, w as s } from "../react.esm-DoZanrUz.js";
+import { u as o } from "../useBreakpoint-2MH8ICuE.js";
+import { d as a, t as i, g as r } from "../vi.JYQecGiw-BbUbJcT8.js";
+a("useBreakpoint Test", () => {
+  i("returns object", () => {
+    const { result: e } = t(() => o());
+    s(() => {
+      r(e.current.isDesktop).toBe(!1), r(e.current.isTablet).toBe(!1), r(e.current.isMobile).toBe(!1);
+    });
+  });
+});

package/dist/{index-DfbRag7b.js → index-DP2ENnrX.js}

@@ -1,4 +1,4 @@
-import { g as L } from "./react.esm-BBemCHUU.js";
+import { g as L } from "./react.esm-DoZanrUz.js";
 function d(e, t, n) {
   return e.namespaceURI && e.namespaceURI !== "http://www.w3.org/1999/xhtml" || (t = Array.isArray(t) ? t : [
     t

package/dist/main.js

@@ -2,13 +2,13 @@ import "./assets/main.css";
 import { AlertBanner as t } from "./components/AlertBanner/AlertBanner.js";
 import { BaseView as p } from "./components/BaseView/BaseView.js";
 import { BasicHeading as f } from "./components/BasicHeading/BasicHeading.js";
-import { BlockView as i } from "./components/BlockView/BlockView.js";
+import { BlockView as a } from "./components/BlockView/BlockView.js";
 import { ContextMenu as c } from "./components/ContextMenu/ContextMenu.js";
 import { DeleteModal as s } from "./components/DeleteModal/DeleteModal.js";
 import { Disclaimer as d } from "./components/Disclaimer/Disclaimer.js";
 import { EmptyView as S } from "./components/EmptyView/EmptyView.js";
-import { GenericTable as V } from "./components/GenericTable/GenericTable.js";
-import { HashTabView as u } from "./components/HashTabView/HashTabView.js";
+import { GenericTable as u } from "./components/GenericTable/GenericTable.js";
+import { HashTabView as k } from "./components/HashTabView/HashTabView.js";
 import { HeaderFilter as D } from "./components/HeaderFilter/HeaderFilter.js";
 import { Iconify as A } from "./components/Iconify/Iconify.js";
 import { InfoGroup as H } from "./components/InfoGroup/InfoGroup.js";
@@ -24,14 +24,14 @@ import { FormSelect as N } from "./components/FormComponents/FormSelect/FormSele
 import { FormSlider as Q } from "./components/FormComponents/FormSlider/FormSlider.js";
 import { FormText as W } from "./components/FormComponents/FormText/FormText.js";
 import { AvailableCustomIcons as _ } from "./enums/AvailableCustomIcons.js";
-import { a as rr } from "./useBreakpoint-DROHPVxO.js";
+import { u as rr } from "./useBreakpoint-2MH8ICuE.js";
 import { capitalizeFirstLetters as er } from "./services/UtilService.js";
 export {
   t as AlertBanner,
   _ as AvailableCustomIcons,
   p as BaseView,
   f as BasicHeading,
-  i as BlockView,
+  a as BlockView,
   c as ContextMenu,
   s as DeleteModal,
   d as Disclaimer,
@@ -42,8 +42,8 @@ export {
   N as FormSelect,
   Q as FormSlider,
   W as FormText,
-  V as GenericTable,
-  u as HashTabView,
+  u as GenericTable,
+  k as HashTabView,
   D as HeaderFilter,
   A as Iconify,
   H as InfoGroup,