@hortiview/shared-components 2.28.0-alpha.4cc3c312.1 → 2.28.0-alpha.fb31ea7e.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/BaseView/BaseView.js +1 -1
- package/components/BasicHeading/BasicHeading.js +1 -1
- package/components/BlockView/BlockView.js +1 -1
- package/components/ConfirmationModal/ConfirmationModal.js +5 -5
- package/components/ContextMenu/ContextMenu.js +1 -1
- package/components/DeleteModal/DeleteModal.js +2 -2
- package/components/EmptyView/EmptyView.js +1 -1
- package/components/Filter/Filter.js +2 -2
- package/components/FloatingActionButton/FloatingActionButton.js +1 -1
- package/components/FormComponents/FormNumber/CustomTextField.js +4 -4
- package/components/FormComponents/FormSelect/FormSelect.js +1 -1
- package/components/GenericTable/GenericTable.js +2 -2
- package/components/HashTabView/HashTabView.js +1 -1
- package/components/InfoGroup/InfoGroup.js +1 -1
- package/components/ModulePadding/ModulePadding.js +4 -4
- package/components/OnboardingBanner/OnboardingBanner.js +1 -1
- package/components/Select/Select.js +1 -1
- package/components/Stepper/components/StepperHeader.js +1 -1
- package/hooks/useBreakpoints.d.ts +7 -19
- package/hooks/useBreakpoints.js +4 -38
- package/hooks/useDesktopBreakpoints.d.ts +19 -0
- package/hooks/useDesktopBreakpoints.js +4 -0
- package/main.d.ts +9 -6
- package/main.js +60 -59
- package/package.json +3 -2
- package/{react.esm-uOZB-qPu.js → react.esm-B3AK8zW1.js} +1787 -1801
- package/services/UtilService.js +1 -1
- package/test-utils.js +1 -1
- package/useBreakpoints-DDrM9Cfx.js +42 -0
|
@@ -7,7 +7,7 @@ import { useMemo as d } from "react";
|
|
|
7
7
|
import { BasicHeading as D } from "../BasicHeading/BasicHeading.js";
|
|
8
8
|
import { EmptyView as P } from "../EmptyView/EmptyView.js";
|
|
9
9
|
import { ListArea as T } from "../ListArea/ListArea.js";
|
|
10
|
-
import {
|
|
10
|
+
import { u as q } from "../../useBreakpoints-DDrM9Cfx.js";
|
|
11
11
|
import { OfflineView as z } from "../OfflineView/OfflineView.js";
|
|
12
12
|
import { useScrollableInfo as J } from "./BaseView.service.js";
|
|
13
13
|
import '../../assets/BaseView.css';const K = "_fullHeight_1yui7_1", O = "_fullWidth_1yui7_5", Q = "_heading_1yui7_9", U = "_list_1yui7_18", X = "_desktopList_1yui7_27", Y = "_noRoundedCorners_1yui7_32", Z = "_detail_1yui7_36", tt = "_desktopDetail_1yui7_44", i = {
|
|
@@ -5,7 +5,7 @@ import { c as I, T as z } from "../../index.es-CdZp67J9.js";
|
|
|
5
5
|
import { c as m } from "../../index-_-9ybP20.js";
|
|
6
6
|
import { Iconify as H } from "../Iconify/Iconify.js";
|
|
7
7
|
import { AvailableCustomIcons as q } from "../../enums/AvailableCustomIcons.js";
|
|
8
|
-
import {
|
|
8
|
+
import { u as w } from "../../useBreakpoints-DDrM9Cfx.js";
|
|
9
9
|
import { OverflowTooltip as x } from "../OverflowTooltip/OverflowTooltip.js";
|
|
10
10
|
import '../../assets/BasicHeading.css';const C = "_basicHeading_14qaz_1", N = "_inList_14qaz_13", T = "_actions_14qaz_17", B = "_invisible_14qaz_25", L = "_leadingIcon_14qaz_29", W = "_withAvatar_14qaz_33", j = "_iconContainer_14qaz_39", e = {
|
|
11
11
|
basicHeading: C,
|
|
@@ -3,7 +3,7 @@ import { b as A, c as F, a as M } from "../../index.es-CdZp67J9.js";
|
|
|
3
3
|
import { c as h } from "../../index-_-9ybP20.js";
|
|
4
4
|
import { useState as V, useEffect as $, useMemo as G } from "react";
|
|
5
5
|
import { getBlockNumberByDto as H } from "../../services/BlockService.js";
|
|
6
|
-
import {
|
|
6
|
+
import { u as I } from "../../useBreakpoints-DDrM9Cfx.js";
|
|
7
7
|
import '../../assets/BlockView.css';const J = "_grid_otqrz_1", K = "_blockLayout_otqrz_13", O = "_absoluteSize_otqrz_22", P = "_relativeSize_otqrz_27", Q = "_mobile_otqrz_38", U = "_blockRow_otqrz_46", W = "_block_otqrz_13", X = "_clickable_otqrz_70", Y = "_empty_otqrz_74", Z = "_active_otqrz_79", j = "_error_otqrz_83", tt = "_hoverEffects_otqrz_87", ot = "_blockText_otqrz_99", et = "_emptyLayout_otqrz_109", t = {
|
|
8
8
|
grid: J,
|
|
9
9
|
blockLayout: K,
|
|
@@ -2,7 +2,7 @@ import { jsx as e, jsxs as i } from "react/jsx-runtime";
|
|
|
2
2
|
import { B as s } from "../../index.es-B9C7vzr4.js";
|
|
3
3
|
import { G as o } from "../../index.es-BE1XL1dD.js";
|
|
4
4
|
import { T as c } from "../../index.es-CdZp67J9.js";
|
|
5
|
-
import {
|
|
5
|
+
import { u as C } from "../../useBreakpoints-DDrM9Cfx.js";
|
|
6
6
|
import { Iconify as B } from "../Iconify/Iconify.js";
|
|
7
7
|
import { Modal as H } from "../Modal/Modal.js";
|
|
8
8
|
import '../../assets/ConfirmationModal.css';const N = "_bulletPoint_v4va9_1", P = "_modal_v4va9_7", S = "_primary_v4va9_11", j = "_secondary_v4va9_15", z = "_success_v4va9_19", A = "_danger_v4va9_23", G = "_fullHeight_v4va9_27", t = {
|
|
@@ -18,9 +18,9 @@ import '../../assets/ConfirmationModal.css';const N = "_bulletPoint_v4va9_1", P
|
|
|
18
18
|
confirmButtonLabel: d,
|
|
19
19
|
cancelButtonLabel: m,
|
|
20
20
|
label: u,
|
|
21
|
-
content:
|
|
21
|
+
content: a,
|
|
22
22
|
showBulletPoints: p,
|
|
23
|
-
icon:
|
|
23
|
+
icon: n,
|
|
24
24
|
iconColor: v = "primary",
|
|
25
25
|
confirmButtonVariant: _ = "filled",
|
|
26
26
|
isOpen: f,
|
|
@@ -28,7 +28,7 @@ import '../../assets/ConfirmationModal.css';const N = "_bulletPoint_v4va9_1", P
|
|
|
28
28
|
onCancel: l,
|
|
29
29
|
isConfirmationDisabled: g
|
|
30
30
|
}) => {
|
|
31
|
-
const { isDesktop: h } = C(), b = () =>
|
|
31
|
+
const { isDesktop: h } = C(), b = () => a ? /* @__PURE__ */ e(o, { direction: "vertical", gap: "none", children: a.map((x, k) => /* @__PURE__ */ e(
|
|
32
32
|
c,
|
|
33
33
|
{
|
|
34
34
|
level: 2,
|
|
@@ -74,7 +74,7 @@ import '../../assets/ConfirmationModal.css';const N = "_bulletPoint_v4va9_1", P
|
|
|
74
74
|
primaryAlign: "center",
|
|
75
75
|
secondaryAlign: "center",
|
|
76
76
|
children: [
|
|
77
|
-
|
|
77
|
+
n && /* @__PURE__ */ e(B, { icon: n, iconSize: "xlarge", className: t[v] }),
|
|
78
78
|
/* @__PURE__ */ i(o, { direction: "vertical", children: [
|
|
79
79
|
/* @__PURE__ */ e(c, { level: 1, themeColor: "text-primary-on-background", children: u }),
|
|
80
80
|
b()
|
|
@@ -6,7 +6,7 @@ import { c as V } from "../../index-_-9ybP20.js";
|
|
|
6
6
|
import { u as z } from "../../uniqueId-CJo-XRQb.js";
|
|
7
7
|
import { OfflineView as H } from "../OfflineView/OfflineView.js";
|
|
8
8
|
import { useIsAllowed as N } from "../PermissionChecks/PermissionService.js";
|
|
9
|
-
import {
|
|
9
|
+
import { u as O } from "../../useBreakpoints-DDrM9Cfx.js";
|
|
10
10
|
import '../../assets/ContextMenu.css';const E = "_menu_52omh_1", R = "_mobile_52omh_7", S = "_desktop_52omh_11", $ = "_icon_52omh_15", j = "_listItem_52omh_19", q = "_offlineViewMargin_52omh_51", D = "_primaryTextTruncated_52omh_55", n = {
|
|
11
11
|
menu: E,
|
|
12
12
|
mobile: R,
|
|
@@ -5,7 +5,7 @@ import { I as S } from "../../index.es-LckFzDz-.js";
|
|
|
5
5
|
import { T as i } from "../../index.es-CdZp67J9.js";
|
|
6
6
|
import { u as N } from "../../uniqueId-CJo-XRQb.js";
|
|
7
7
|
import { AvailableCustomIcons as O } from "../../enums/AvailableCustomIcons.js";
|
|
8
|
-
import {
|
|
8
|
+
import { u as x } from "../../useBreakpoints-DDrM9Cfx.js";
|
|
9
9
|
import { Iconify as z } from "../Iconify/Iconify.js";
|
|
10
10
|
import "react";
|
|
11
11
|
import "../../react-tooltip.min-DKaGxvdz.js";
|
|
@@ -21,7 +21,7 @@ import "../../isArray-olhCpv2e.js";
|
|
|
21
21
|
import "../../isString-LDbI4UeI.js";
|
|
22
22
|
import "../../omit-DUqu4lDk.js";
|
|
23
23
|
import "../../types/Time.js";
|
|
24
|
-
import "../../react.esm-
|
|
24
|
+
import "../../react.esm-B3AK8zW1.js";
|
|
25
25
|
import '../../assets/DeleteModal.css';const j = "_bulletPoint_bd412_1", A = "_modal_bd412_7", G = "_colorDanger_bd412_11", q = "_crossedOut_bd412_15", e = {
|
|
26
26
|
bulletPoint: j,
|
|
27
27
|
modal: A,
|
|
@@ -17,7 +17,7 @@ import "../../isArray-olhCpv2e.js";
|
|
|
17
17
|
import "../../isString-LDbI4UeI.js";
|
|
18
18
|
import "../../omit-DUqu4lDk.js";
|
|
19
19
|
import "../../types/Time.js";
|
|
20
|
-
import "../../react.esm-
|
|
20
|
+
import "../../react.esm-B3AK8zW1.js";
|
|
21
21
|
import '../../assets/EmptyView.css';const C = "_emptyViewContainer_19inl_1", V = "_full_19inl_7", x = "_medium_19inl_11", N = "_small_19inl_15", g = "_title_19inl_20", i = {
|
|
22
22
|
emptyViewContainer: C,
|
|
23
23
|
full: V,
|
|
@@ -7,7 +7,7 @@ import { S as j } from "../../index.es-DCWPAtXu.js";
|
|
|
7
7
|
import { c as G } from "../../index-_-9ybP20.js";
|
|
8
8
|
import { useState as b } from "react";
|
|
9
9
|
import { Iconify as H } from "../Iconify/Iconify.js";
|
|
10
|
-
import {
|
|
10
|
+
import { u as F } from "../../useBreakpoints-DDrM9Cfx.js";
|
|
11
11
|
import "../../react-tooltip.min-DKaGxvdz.js";
|
|
12
12
|
import "../../orderBy-Ce85KqD6.js";
|
|
13
13
|
import { SearchBar as I } from "../SearchBar/SearchBar.js";
|
|
@@ -23,7 +23,7 @@ import "../../isArray-olhCpv2e.js";
|
|
|
23
23
|
import "../../isString-LDbI4UeI.js";
|
|
24
24
|
import "../../omit-DUqu4lDk.js";
|
|
25
25
|
import "../../types/Time.js";
|
|
26
|
-
import "../../react.esm-
|
|
26
|
+
import "../../react.esm-B3AK8zW1.js";
|
|
27
27
|
import '../../assets/Filter.css';const T = "_filterButton_1qtzn_1", V = "_relativeParent_1qtzn_21", E = "_iconColor_1qtzn_25", J = "_filterBadge_1qtzn_29", Q = "_dense_1qtzn_36", U = "_filterModal_1qtzn_41", X = "_borderRadius_1qtzn_45", s = {
|
|
28
28
|
filterButton: T,
|
|
29
29
|
relativeParent: V,
|
|
@@ -4,7 +4,7 @@ import { M as j, L as D, a as k, b as H } from "../../index.es-BIgjyLDa.js";
|
|
|
4
4
|
import { c as r } from "../../index-_-9ybP20.js";
|
|
5
5
|
import { useState as E, useCallback as w, useEffect as G, useMemo as f, Fragment as J } from "react";
|
|
6
6
|
import { createPortal as d } from "react-dom";
|
|
7
|
-
import {
|
|
7
|
+
import { u as K } from "../../useBreakpoints-DDrM9Cfx.js";
|
|
8
8
|
import { OfflineView as O } from "../OfflineView/OfflineView.js";
|
|
9
9
|
import { useIsAllowed as Q } from "../PermissionChecks/PermissionService.js";
|
|
10
10
|
import '../../assets/FloatingActionButton.css';const R = "_menu_1bdpq_1", T = "_icon_1bdpq_6", U = "_listItem_1bdpq_10", W = "_offlineViewMargin_1bdpq_20", X = "_fabContainer_1bdpq_24", Y = "_buttonAppBar_1bdpq_29", Z = "_fullScreen_1bdpq_34", P = "_fabIcon_1bdpq_39", ee = "_fabMenu_1bdpq_43", te = "_scrim_1bdpq_47", ne = "_scrimVisible_1bdpq_60", ie = "_fabSpacer_1bdpq_65", t = {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as m } from "react/jsx-runtime";
|
|
2
2
|
import { T as u } from "../../../index.es-CJIPOFSz.js";
|
|
3
|
-
import { g } from "../../../get-CBFiuc3f.js";
|
|
4
|
-
import { o as
|
|
3
|
+
import { g as f } from "../../../get-CBFiuc3f.js";
|
|
4
|
+
import { o as g } from "../../../omit-DUqu4lDk.js";
|
|
5
5
|
import { useMemo as v } from "react";
|
|
6
6
|
import { useFormContext as s } from "react-hook-form";
|
|
7
7
|
import '../../../assets/CustomTextField.css';const c = "_invalid_142hx_1", h = "_borderRadius_142hx_5", o = {
|
|
@@ -20,7 +20,7 @@ import '../../../assets/CustomTextField.css';const c = "_invalid_142hx_1", h = "
|
|
|
20
20
|
return /* @__PURE__ */ m(
|
|
21
21
|
u,
|
|
22
22
|
{
|
|
23
|
-
...
|
|
23
|
+
...g(e, ["propertyName", "formOnBlur", "additionalTrigger"]),
|
|
24
24
|
value: d,
|
|
25
25
|
"data-testid": `numeric-field-${e.propertyName}`,
|
|
26
26
|
fullWidth: !0,
|
|
@@ -33,7 +33,7 @@ import '../../../assets/CustomTextField.css';const c = "_invalid_142hx_1", h = "
|
|
|
33
33
|
e.onChange?.(r), e.additionalTrigger === "onChange" && i(e.propertyName);
|
|
34
34
|
},
|
|
35
35
|
valid: !t(e.propertyName).invalid,
|
|
36
|
-
helperTextPersistent:
|
|
36
|
+
helperTextPersistent: f(n, e.propertyName) !== void 0 || e.helperTextPersistent,
|
|
37
37
|
className: `${t(e.propertyName).invalid ? o.invalid : ""} ${o.borderRadius}`
|
|
38
38
|
}
|
|
39
39
|
);
|
|
@@ -4,7 +4,7 @@ import { g as C } from "../../../get-CBFiuc3f.js";
|
|
|
4
4
|
import { useMemo as w } from "react";
|
|
5
5
|
import { useFormContext as L, Controller as b } from "react-hook-form";
|
|
6
6
|
import { M as Q } from "../../../react-tooltip.min-DKaGxvdz.js";
|
|
7
|
-
import {
|
|
7
|
+
import { u as R } from "../../../useBreakpoints-DDrM9Cfx.js";
|
|
8
8
|
import { useHelperText as U } from "../../../hooks/useHelperText.js";
|
|
9
9
|
import { Select as W } from "../../Select/Select.js";
|
|
10
10
|
import { isGroupedOptions as X } from "./FormSelectService.js";
|
|
@@ -28,7 +28,7 @@ import { M as Cs, a as Rs } from "../../component-By6nyiBU.js";
|
|
|
28
28
|
import { c as Qi } from "../../component-9vrShqiY.js";
|
|
29
29
|
import { a as qu } from "../../util-CBo-ipCE.js";
|
|
30
30
|
import "../../isEmpty-l2xQKl4x.js";
|
|
31
|
-
import {
|
|
31
|
+
import { u as Xu } from "../../useBreakpoints-DDrM9Cfx.js";
|
|
32
32
|
import "../../react-tooltip.min-DKaGxvdz.js";
|
|
33
33
|
import "../../orderBy-Ce85KqD6.js";
|
|
34
34
|
import { OfflineView as Zi } from "../OfflineView/OfflineView.js";
|
|
@@ -41,7 +41,7 @@ import "../../isArray-olhCpv2e.js";
|
|
|
41
41
|
import "../../isString-LDbI4UeI.js";
|
|
42
42
|
import "../../omit-DUqu4lDk.js";
|
|
43
43
|
import "../../types/Time.js";
|
|
44
|
-
import "../../react.esm-
|
|
44
|
+
import "../../react.esm-B3AK8zW1.js";
|
|
45
45
|
import { useGenerateColumns as Ku, useGenerateTableData as Yu } from "./GenericTableService.js";
|
|
46
46
|
import { GenericCardList as Ju } from "./Mobile/GenericCardList.js";
|
|
47
47
|
import '../../assets/GenericTable.css';function Qu(e, t) {
|
|
@@ -9,7 +9,7 @@ import { I as Mt } from "../../index.es-LckFzDz-.js";
|
|
|
9
9
|
import { b as T, c as D, a as Wt } from "../../tslib.es6-BDCynO9F.js";
|
|
10
10
|
import { M as et, a as rt } from "../../component-By6nyiBU.js";
|
|
11
11
|
import { b as xt, M as mt, a as R, m as wt } from "../../component-9vrShqiY.js";
|
|
12
|
-
import {
|
|
12
|
+
import { u as Kt } from "../../useBreakpoints-DDrM9Cfx.js";
|
|
13
13
|
import '../../assets/HashTabView.css';var $t = {
|
|
14
14
|
ACTIVE: "mdc-tab-indicator--active",
|
|
15
15
|
FADE: "mdc-tab-indicator--fade",
|
|
@@ -3,7 +3,7 @@ import { D as d } from "../../index.es-0SkNh4dU.js";
|
|
|
3
3
|
import { G as c } from "../../index.es-BE1XL1dD.js";
|
|
4
4
|
import { a as g, b as _ } from "../../index.es-CdZp67J9.js";
|
|
5
5
|
import { useMemo as f, Fragment as C } from "react";
|
|
6
|
-
import {
|
|
6
|
+
import { u as m } from "../../useBreakpoints-DDrM9Cfx.js";
|
|
7
7
|
import '../../assets/InfoGroup.css';const y = "_dividerContainer_1bd14_1", D = "_mainGroup_1bd14_6", b = "_centerDefaultComponent_1bd14_19", A = "_verticalDivider_1bd14_23", G = "_textAlignRight_1bd14_31", N = "_typoColor_1bd14_35", a = {
|
|
8
8
|
dividerContainer: y,
|
|
9
9
|
mainGroup: D,
|
|
@@ -2,7 +2,7 @@ import { jsx as o } from "react/jsx-runtime";
|
|
|
2
2
|
import { P as r } from "../../index.es-C8AExypY.js";
|
|
3
3
|
import "../../isEmpty-l2xQKl4x.js";
|
|
4
4
|
import "react";
|
|
5
|
-
import {
|
|
5
|
+
import { u as m } from "../../useBreakpoints-DDrM9Cfx.js";
|
|
6
6
|
import "../../react-tooltip.min-DKaGxvdz.js";
|
|
7
7
|
import "../../orderBy-Ce85KqD6.js";
|
|
8
8
|
import "../../index-CuHybtft.js";
|
|
@@ -15,8 +15,8 @@ import "../../isArray-olhCpv2e.js";
|
|
|
15
15
|
import "../../isString-LDbI4UeI.js";
|
|
16
16
|
import "../../omit-DUqu4lDk.js";
|
|
17
17
|
import "../../types/Time.js";
|
|
18
|
-
import "../../react.esm-
|
|
19
|
-
import '../../assets/ModulePadding.css';const p = "_fullHeight_80ifl_1",
|
|
18
|
+
import "../../react.esm-B3AK8zW1.js";
|
|
19
|
+
import '../../assets/ModulePadding.css';const p = "_fullHeight_80ifl_1", s = {
|
|
20
20
|
fullHeight: p
|
|
21
21
|
}, B = ({ children: t }) => {
|
|
22
22
|
const { isDesktop: i } = m();
|
|
@@ -26,7 +26,7 @@ import '../../assets/ModulePadding.css';const p = "_fullHeight_80ifl_1", d = {
|
|
|
26
26
|
id: "module-padding",
|
|
27
27
|
"data-testid": "module-padding",
|
|
28
28
|
variant: i ? "standard" : "dense",
|
|
29
|
-
className:
|
|
29
|
+
className: s.fullHeight,
|
|
30
30
|
children: t
|
|
31
31
|
}
|
|
32
32
|
);
|
|
@@ -6,7 +6,7 @@ import { G as i } from "../../index.es-BE1XL1dD.js";
|
|
|
6
6
|
import { I as f } from "../../index.es-LckFzDz-.js";
|
|
7
7
|
import { I as y } from "../../index.es-BwhRJBEH.js";
|
|
8
8
|
import { c as v, T as _ } from "../../index.es-CdZp67J9.js";
|
|
9
|
-
import {
|
|
9
|
+
import { u as C } from "../../useBreakpoints-DDrM9Cfx.js";
|
|
10
10
|
import '../../assets/OnboardingBanner.css';const G = "_elevation_7z8y8_1", k = "_color_7z8y8_5", B = "_buttons_7z8y8_9", l = {
|
|
11
11
|
elevation: G,
|
|
12
12
|
color: k,
|
|
@@ -14,7 +14,7 @@ import { flattenObjectToString as S } from "../../services/UtilService.js";
|
|
|
14
14
|
import "../../omit-DUqu4lDk.js";
|
|
15
15
|
import "../../isArray-olhCpv2e.js";
|
|
16
16
|
import "../../types/Time.js";
|
|
17
|
-
import "../../react.esm-
|
|
17
|
+
import "../../react.esm-B3AK8zW1.js";
|
|
18
18
|
import '../../assets/Select.css';const $ = "_customPortal_1u11g_1", g = "_customSelect_1u11g_8", n = {
|
|
19
19
|
customPortal: $,
|
|
20
20
|
customSelect: g
|
|
@@ -2,7 +2,7 @@ import { jsx as r, jsxs as n } from "react/jsx-runtime";
|
|
|
2
2
|
import { G as i } from "../../../index.es-BE1XL1dD.js";
|
|
3
3
|
import { T as o } from "../../../index.es-CdZp67J9.js";
|
|
4
4
|
import { useMemo as f, Fragment as A } from "react";
|
|
5
|
-
import {
|
|
5
|
+
import { u as v } from "../../../useBreakpoints-DDrM9Cfx.js";
|
|
6
6
|
import { s as t } from "../../../stepper.module-C_EMu-Fl.js";
|
|
7
7
|
import { StepperItem as h } from "./StepperItem.js";
|
|
8
8
|
import { StepperStyle as c } from "../stepperStyles.js";
|
|
@@ -1,3 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Custom hook that tells you whether a given media query is active.
|
|
3
|
+
*
|
|
4
|
+
* Inspired by https://usehooks.com/useMedia/
|
|
5
|
+
* https://gist.github.com/gragland/ed8cac563f5df71d78f4a1fefa8c5633
|
|
6
|
+
*/
|
|
7
|
+
export declare const useMediaQuery: (query: string) => boolean;
|
|
1
8
|
/**
|
|
2
9
|
* Hook that returns the current breakpoint. It uses the following breakpoints:
|
|
3
10
|
* - xs: 0-599px
|
|
@@ -25,22 +32,3 @@ export declare const useBreakpoints: () => {
|
|
|
25
32
|
isDesktop: boolean;
|
|
26
33
|
isDesktopNavbar: boolean;
|
|
27
34
|
};
|
|
28
|
-
/**
|
|
29
|
-
* a hook that returns all breakpoints that are in the range of the desktop size (greater than 840px)
|
|
30
|
-
* - lg: 840-1023px
|
|
31
|
-
* - xl: 1024-1439px
|
|
32
|
-
* - xxl: 1440px and up
|
|
33
|
-
* - lg-nav: (840 + 256) - (1023 + 256)px
|
|
34
|
-
* - xl-nav: (1024 + 256) - (1439 + 256)px
|
|
35
|
-
* - xxl-nav: (1440 + 256)px and up
|
|
36
|
-
* @param navBarWidth
|
|
37
|
-
* @returns
|
|
38
|
-
*/
|
|
39
|
-
export declare const useDesktopBreakpoints: (navBarWidth?: number) => {
|
|
40
|
-
isLgNavbar: boolean;
|
|
41
|
-
isXlNavbar: boolean;
|
|
42
|
-
isXxlNavbar: boolean;
|
|
43
|
-
isLg: boolean;
|
|
44
|
-
isXl: boolean;
|
|
45
|
-
isXxl: boolean;
|
|
46
|
-
};
|
package/hooks/useBreakpoints.js
CHANGED
|
@@ -1,40 +1,6 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
const [a, n] = m(!1);
|
|
4
|
-
return p(
|
|
5
|
-
() => {
|
|
6
|
-
const i = window.matchMedia(s);
|
|
7
|
-
n(i.matches);
|
|
8
|
-
const e = (o) => n(o.matches);
|
|
9
|
-
return i.addEventListener("change", e), () => i.removeEventListener("change", e);
|
|
10
|
-
},
|
|
11
|
-
[]
|
|
12
|
-
// Empty array ensures effect is only run on mount and unmount
|
|
13
|
-
), a;
|
|
14
|
-
}, w = () => {
|
|
15
|
-
const { isLgNavbar: s, isXlNavbar: a, isXxlNavbar: n, isLg: i, isXl: e, isXxl: o } = r(), x = t("(max-width: 599px)"), d = t("(min-width: 600px) and (max-width: 719px)"), c = t("(min-width: 720px) and (max-width: 839px)");
|
|
16
|
-
return {
|
|
17
|
-
isMobile: x,
|
|
18
|
-
isTablet: d || c,
|
|
19
|
-
isDesktop: i || e || o,
|
|
20
|
-
isDesktopNavbar: s || a || n
|
|
21
|
-
};
|
|
22
|
-
}, r = (s = 256) => {
|
|
23
|
-
const a = t(
|
|
24
|
-
`(min-width: ${840 + s}px) and (max-width: ${1023 + s}px)`
|
|
25
|
-
), n = t(
|
|
26
|
-
`(min-width: ${1024 + s}px) and (max-width: ${1439 + s}px)`
|
|
27
|
-
), i = t(`(min-width: ${1440 + s}px)`), e = t("(min-width: 840px) and (max-width: 1023px)"), o = t("(min-width: 1024px) and (max-width: 1439px)"), x = t("(min-width: 1440px)");
|
|
28
|
-
return {
|
|
29
|
-
isLgNavbar: a,
|
|
30
|
-
isXlNavbar: n,
|
|
31
|
-
isXxlNavbar: i,
|
|
32
|
-
isLg: e,
|
|
33
|
-
isXl: o,
|
|
34
|
-
isXxl: x
|
|
35
|
-
};
|
|
36
|
-
};
|
|
1
|
+
import "react";
|
|
2
|
+
import { u as a, b as o } from "../useBreakpoints-DDrM9Cfx.js";
|
|
37
3
|
export {
|
|
38
|
-
|
|
39
|
-
|
|
4
|
+
a as useBreakpoints,
|
|
5
|
+
o as useMediaQuery
|
|
40
6
|
};
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* a hook that returns all breakpoints that are in the range of the desktop size (greater than 840px)
|
|
3
|
+
* - lg: 840-1023px
|
|
4
|
+
* - xl: 1024-1439px
|
|
5
|
+
* - xxl: 1440px and up
|
|
6
|
+
* - lg-nav: (840 + 256) - (1023 + 256)px
|
|
7
|
+
* - xl-nav: (1024 + 256) - (1439 + 256)px
|
|
8
|
+
* - xxl-nav: (1440 + 256)px and up
|
|
9
|
+
* @param navBarWidth
|
|
10
|
+
* @returns
|
|
11
|
+
*/
|
|
12
|
+
export declare const useDesktopBreakpoints: (navBarWidth?: number) => {
|
|
13
|
+
isLgNavbar: boolean;
|
|
14
|
+
isXlNavbar: boolean;
|
|
15
|
+
isXxlNavbar: boolean;
|
|
16
|
+
isLg: boolean;
|
|
17
|
+
isXl: boolean;
|
|
18
|
+
isXxl: boolean;
|
|
19
|
+
};
|
package/main.d.ts
CHANGED
|
@@ -47,28 +47,31 @@ export { AvailableCustomIcons } from './enums/AvailableCustomIcons';
|
|
|
47
47
|
export { ThemeColor } from './enums/ThemeColor';
|
|
48
48
|
export { useBreakpoints } from './hooks/useBreakpoints';
|
|
49
49
|
export { useContainerWidth } from './hooks/useContainerWidth';
|
|
50
|
-
export {
|
|
50
|
+
export { useDesktopBreakpoints } from './hooks/useDesktopBreakpoints';
|
|
51
|
+
export { capitalizeFirstLetters, flattenObjectToString, getFormattedDateTime, getNumberAsLocaleString, trimLeadingAndTrailingSpaces } from './services/UtilService';
|
|
52
|
+
export type { AllowedButtonProps } from './components/AllowedButton/AllowedButton';
|
|
53
|
+
export type { AllowedIconButtonProps } from './components/AllowedIconButton/AllowedIconButton';
|
|
51
54
|
export type { ActionProps } from './components/ContextMenu/ContextMenu';
|
|
52
|
-
export type { FormSelectOption, FormSelectProps
|
|
55
|
+
export type { FormSelectOption, FormSelectProps } from './components/FormComponents/FormSelect/FormSelect';
|
|
53
56
|
export type { FormTextProps } from './components/FormComponents/FormText/FormText';
|
|
54
57
|
export type { InfoCardProps } from './components/InfoCard/InfoCard';
|
|
55
58
|
export type { FieldItem } from './components/InfoGroup/InfoGroup';
|
|
56
59
|
export type { LoadingSpinnerProps } from './components/LoadingSpinner/Default/LoadingSpinner';
|
|
57
60
|
export { StepperStyle } from './components/Stepper/stepperStyles';
|
|
58
|
-
export type { Step, StepperBaseProps, StepperButtonProps, StepperProps
|
|
61
|
+
export type { Step, StepperBaseProps, StepperButtonProps, StepperProps } from './components/Stepper/stepperTypes';
|
|
59
62
|
export type { FilterData, FilterOption, FilterSelection } from './types/Filter';
|
|
60
63
|
export type { CellTemplate, CellTemplateProps, TableLayoutProps } from './types/GenericTable';
|
|
61
64
|
export type { HashTab } from './types/HashTab';
|
|
62
65
|
export type { BaseListElement, ListElement } from './types/ListElement';
|
|
63
66
|
export { DATE_FORMAT, DATE_TIME_FORMAT, TIME_FORMAT } from './types/Time';
|
|
64
|
-
export { AVAILABLE_COUNTRY_KEYS, AVAILABLE_LOCALES, ENGLISH_LANGUAGE_ID, GERMAN_LANGUAGE_ID, LANGUAGE_CODES_MAPPER, LANGUAGE_ID_MAPPER, SPANISH_LANGUAGE_ID, TURKISH_LANGUAGE_ID
|
|
67
|
+
export { AVAILABLE_COUNTRY_KEYS, AVAILABLE_LOCALES, ENGLISH_LANGUAGE_ID, GERMAN_LANGUAGE_ID, LANGUAGE_CODES_MAPPER, LANGUAGE_ID_MAPPER, SPANISH_LANGUAGE_ID, TURKISH_LANGUAGE_ID } from './types/Languages';
|
|
65
68
|
export type { AVAILABLE_LANGUAGE_CODES, LANGUAGE_COUNTRY_CODES } from './types/Languages';
|
|
66
69
|
export { Allowed } from './components/Allowed/Allowed';
|
|
67
70
|
export { AllowedButton } from './components/AllowedButton/AllowedButton';
|
|
68
71
|
export { AllowedIconButton } from './components/AllowedIconButton/AllowedIconButton';
|
|
69
|
-
export { getPermissionsFromModulePermissionToken, useIsAllowed
|
|
72
|
+
export { getPermissionsFromModulePermissionToken, useIsAllowed } from './components/PermissionChecks/PermissionService';
|
|
70
73
|
export type { IsAllowedProps } from './components/PermissionChecks/PermissionService';
|
|
71
74
|
export { SharedComponentsPermissionProvider } from './components/SharedComponentsPermissionProvider/SharedComponentsPermissionProvider';
|
|
72
75
|
export { createPermissionWrapper, renderWithPermissions } from './test-utils';
|
|
73
76
|
export { HVMainPermissions } from './types/Permission';
|
|
74
|
-
export type { HVPermissions, ModulePermissionTokenParsed, PermissionsByEntity
|
|
77
|
+
export type { HVPermissions, ModulePermissionTokenParsed, PermissionsByEntity } from './types/Permission';
|
package/main.js
CHANGED
|
@@ -3,21 +3,21 @@ import { LinkBanner as m } from "./components/AlertBanner/LinkBanner.js";
|
|
|
3
3
|
import { BaseView as f } from "./components/BaseView/BaseView.js";
|
|
4
4
|
import { BasicHeading as x } from "./components/BasicHeading/BasicHeading.js";
|
|
5
5
|
import { BlockView as n } from "./components/BlockView/BlockView.js";
|
|
6
|
-
import { ButtonCard as
|
|
6
|
+
import { ButtonCard as s } from "./components/ButtonCard/ButtonCard.js";
|
|
7
7
|
import { ChipCard as d } from "./components/ChipCard/ChipCard.js";
|
|
8
8
|
import { ConfirmationModal as c } from "./components/ConfirmationModal/ConfirmationModal.js";
|
|
9
9
|
import { ContextMenu as T } from "./components/ContextMenu/ContextMenu.js";
|
|
10
10
|
import { DeleteModal as L } from "./components/DeleteModal/DeleteModal.js";
|
|
11
|
-
import { DetailContentWrapper as
|
|
12
|
-
import { Disclaimer as
|
|
13
|
-
import { EmptyView as
|
|
11
|
+
import { DetailContentWrapper as B } from "./components/DetailContentWrapper/DetailContentWrapper.js";
|
|
12
|
+
import { Disclaimer as u } from "./components/Disclaimer/Disclaimer.js";
|
|
13
|
+
import { EmptyView as G } from "./components/EmptyView/EmptyView.js";
|
|
14
14
|
import { Filter as M } from "./components/Filter/Filter.js";
|
|
15
15
|
import { FloatingActionButton as P } from "./components/FloatingActionButton/FloatingActionButton.js";
|
|
16
16
|
import { FormattedNumberDisplay as b } from "./components/FormattedNumberDisplay/FormattedNumberDisplay.js";
|
|
17
17
|
import { GenericTable as O } from "./components/GenericTable/GenericTable.js";
|
|
18
18
|
import { HashTabView as V } from "./components/HashTabView/HashTabView.js";
|
|
19
|
-
import { HeaderFilter as
|
|
20
|
-
import { Iconify as
|
|
19
|
+
import { HeaderFilter as k } from "./components/HeaderFilter/HeaderFilter.js";
|
|
20
|
+
import { Iconify as U } from "./components/Iconify/Iconify.js";
|
|
21
21
|
import { InfoCard as y } from "./components/InfoCard/InfoCard.js";
|
|
22
22
|
import { InfoGroup as Y } from "./components/InfoGroup/InfoGroup.js";
|
|
23
23
|
import { ListArea as j } from "./components/ListArea/ListArea.js";
|
|
@@ -30,77 +30,77 @@ import { OverflowTooltip as mr } from "./components/OverflowTooltip/OverflowTool
|
|
|
30
30
|
import { ScrollbarX as fr, ScrollbarY as ir } from "./components/Scrollbar/Scrollbar.js";
|
|
31
31
|
import { SearchBar as ar } from "./components/SearchBar/SearchBar.js";
|
|
32
32
|
import { Select as lr } from "./components/Select/Select.js";
|
|
33
|
-
import { StepperHeader as
|
|
33
|
+
import { StepperHeader as Ar } from "./components/Stepper/components/StepperHeader.js";
|
|
34
34
|
import { Stepper as Sr } from "./components/Stepper/Stepper.js";
|
|
35
35
|
import { TopBarBanner as Er } from "./components/TopBarBanner/TopBarBanner.js";
|
|
36
36
|
import { VerticalDivider as Fr } from "./components/VerticalDivider/VerticalDivider.js";
|
|
37
37
|
import { FormCheckBox as _r } from "./components/FormComponents/FormCheckBox/FormCheckBox.js";
|
|
38
|
-
import { FormDatePicker as
|
|
39
|
-
import { FormNumber as
|
|
40
|
-
import { FormRadio as
|
|
38
|
+
import { FormDatePicker as Ir } from "./components/FormComponents/FormDatePicker/FormDatePicker.js";
|
|
39
|
+
import { FormNumber as Dr } from "./components/FormComponents/FormNumber/FormNumber.js";
|
|
40
|
+
import { FormRadio as Cr } from "./components/FormComponents/FormRadio/FormRadio.js";
|
|
41
41
|
import { FormSelect as gr } from "./components/FormComponents/FormSelect/FormSelect.js";
|
|
42
42
|
import { FormSlider as Nr } from "./components/FormComponents/FormSlider/FormSlider.js";
|
|
43
43
|
import { FormText as wr } from "./components/FormComponents/FormText/FormText.js";
|
|
44
44
|
import { FormToggle as Rr } from "./components/FormComponents/FormToggle/FormToggle.js";
|
|
45
45
|
import { SafeForm as hr } from "./components/SafeForm/SafeForm.js";
|
|
46
|
-
import { AvailableCustomIcons as
|
|
46
|
+
import { AvailableCustomIcons as Hr } from "./enums/AvailableCustomIcons.js";
|
|
47
47
|
import { ThemeColor as vr } from "./enums/ThemeColor.js";
|
|
48
|
-
import {
|
|
49
|
-
import { useContainerWidth as
|
|
50
|
-
import { capitalizeFirstLetters as
|
|
51
|
-
import { StepperStyle as
|
|
52
|
-
import { DATE_FORMAT as
|
|
53
|
-
import { AVAILABLE_COUNTRY_KEYS as
|
|
54
|
-
import { Allowed as
|
|
55
|
-
import { AllowedButton as
|
|
56
|
-
import { AllowedIconButton as
|
|
57
|
-
import { getPermissionsFromModulePermissionToken as
|
|
58
|
-
import { SharedComponentsPermissionProvider as
|
|
59
|
-
import { createPermissionWrapper as Co, renderWithPermissions as
|
|
60
|
-
import { HVMainPermissions as
|
|
48
|
+
import { u as Wr, a as Yr } from "./useBreakpoints-DDrM9Cfx.js";
|
|
49
|
+
import { useContainerWidth as jr } from "./hooks/useContainerWidth.js";
|
|
50
|
+
import { capitalizeFirstLetters as Xr, flattenObjectToString as qr, getFormattedDateTime as Jr, getNumberAsLocaleString as Qr, trimLeadingAndTrailingSpaces as Zr } from "./services/UtilService.js";
|
|
51
|
+
import { StepperStyle as ro } from "./components/Stepper/stepperStyles.js";
|
|
52
|
+
import { DATE_FORMAT as eo, DATE_TIME_FORMAT as to, TIME_FORMAT as mo } from "./types/Time.js";
|
|
53
|
+
import { AVAILABLE_COUNTRY_KEYS as fo, AVAILABLE_LOCALES as io, ENGLISH_LANGUAGE_ID as xo, GERMAN_LANGUAGE_ID as ao, LANGUAGE_CODES_MAPPER as no, LANGUAGE_ID_MAPPER as lo, SPANISH_LANGUAGE_ID as so, TURKISH_LANGUAGE_ID as Ao } from "./types/Languages.js";
|
|
54
|
+
import { Allowed as co } from "./components/Allowed/Allowed.js";
|
|
55
|
+
import { AllowedButton as To } from "./components/AllowedButton/AllowedButton.js";
|
|
56
|
+
import { AllowedIconButton as Lo } from "./components/AllowedIconButton/AllowedIconButton.js";
|
|
57
|
+
import { getPermissionsFromModulePermissionToken as Bo, useIsAllowed as Io } from "./components/PermissionChecks/PermissionService.js";
|
|
58
|
+
import { SharedComponentsPermissionProvider as Do } from "./components/SharedComponentsPermissionProvider/SharedComponentsPermissionProvider.js";
|
|
59
|
+
import { createPermissionWrapper as Co, renderWithPermissions as Mo } from "./test-utils.js";
|
|
60
|
+
import { HVMainPermissions as Po } from "./types/Permission.js";
|
|
61
61
|
export {
|
|
62
|
-
|
|
63
|
-
|
|
62
|
+
fo as AVAILABLE_COUNTRY_KEYS,
|
|
63
|
+
io as AVAILABLE_LOCALES,
|
|
64
64
|
e as AlertBanner,
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
65
|
+
co as Allowed,
|
|
66
|
+
To as AllowedButton,
|
|
67
|
+
Lo as AllowedIconButton,
|
|
68
|
+
Hr as AvailableCustomIcons,
|
|
69
69
|
f as BaseView,
|
|
70
70
|
x as BasicHeading,
|
|
71
71
|
n as BlockView,
|
|
72
|
-
|
|
72
|
+
s as ButtonCard,
|
|
73
73
|
d as ChipCard,
|
|
74
74
|
c as ConfirmationModal,
|
|
75
75
|
T as ContextMenu,
|
|
76
|
-
|
|
77
|
-
|
|
76
|
+
eo as DATE_FORMAT,
|
|
77
|
+
to as DATE_TIME_FORMAT,
|
|
78
78
|
L as DeleteModal,
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
79
|
+
B as DetailContentWrapper,
|
|
80
|
+
u as Disclaimer,
|
|
81
|
+
xo as ENGLISH_LANGUAGE_ID,
|
|
82
|
+
G as EmptyView,
|
|
83
83
|
M as Filter,
|
|
84
84
|
P as FloatingActionButton,
|
|
85
85
|
_r as FormCheckBox,
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
86
|
+
Ir as FormDatePicker,
|
|
87
|
+
Dr as FormNumber,
|
|
88
|
+
Cr as FormRadio,
|
|
89
89
|
gr as FormSelect,
|
|
90
90
|
Nr as FormSlider,
|
|
91
91
|
wr as FormText,
|
|
92
92
|
Rr as FormToggle,
|
|
93
93
|
b as FormattedNumberDisplay,
|
|
94
|
-
|
|
94
|
+
ao as GERMAN_LANGUAGE_ID,
|
|
95
95
|
O as GenericTable,
|
|
96
|
-
|
|
96
|
+
Po as HVMainPermissions,
|
|
97
97
|
V as HashTabView,
|
|
98
|
-
|
|
99
|
-
|
|
98
|
+
k as HeaderFilter,
|
|
99
|
+
U as Iconify,
|
|
100
100
|
y as InfoCard,
|
|
101
101
|
Y as InfoGroup,
|
|
102
|
-
|
|
103
|
-
|
|
102
|
+
no as LANGUAGE_CODES_MAPPER,
|
|
103
|
+
lo as LANGUAGE_ID_MAPPER,
|
|
104
104
|
m as LinkBanner,
|
|
105
105
|
j as ListArea,
|
|
106
106
|
X as LoadingSpinner,
|
|
@@ -109,30 +109,31 @@ export {
|
|
|
109
109
|
rr as OfflineView,
|
|
110
110
|
er as OnboardingBanner,
|
|
111
111
|
mr as OverflowTooltip,
|
|
112
|
-
|
|
112
|
+
so as SPANISH_LANGUAGE_ID,
|
|
113
113
|
hr as SafeForm,
|
|
114
114
|
fr as ScrollbarX,
|
|
115
115
|
ir as ScrollbarY,
|
|
116
116
|
ar as SearchBar,
|
|
117
117
|
lr as Select,
|
|
118
|
-
|
|
118
|
+
Do as SharedComponentsPermissionProvider,
|
|
119
119
|
Sr as Stepper,
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
120
|
+
Ar as StepperHeader,
|
|
121
|
+
ro as StepperStyle,
|
|
122
|
+
mo as TIME_FORMAT,
|
|
123
123
|
Ao as TURKISH_LANGUAGE_ID,
|
|
124
124
|
vr as ThemeColor,
|
|
125
125
|
Er as TopBarBanner,
|
|
126
126
|
Fr as VerticalDivider,
|
|
127
|
-
|
|
127
|
+
Xr as capitalizeFirstLetters,
|
|
128
128
|
Co as createPermissionWrapper,
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
129
|
+
qr as flattenObjectToString,
|
|
130
|
+
Jr as getFormattedDateTime,
|
|
131
|
+
Qr as getNumberAsLocaleString,
|
|
132
|
+
Bo as getPermissionsFromModulePermissionToken,
|
|
133
|
+
Mo as renderWithPermissions,
|
|
134
|
+
Zr as trimLeadingAndTrailingSpaces,
|
|
135
135
|
Wr as useBreakpoints,
|
|
136
|
-
|
|
136
|
+
jr as useContainerWidth,
|
|
137
|
+
Yr as useDesktopBreakpoints,
|
|
137
138
|
Io as useIsAllowed
|
|
138
139
|
};
|