@hitachivantara/uikit-react-core 5.73.1 → 5.74.0
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/dist/cjs/Accordion/Accordion.cjs +23 -55
- package/dist/cjs/Accordion/Accordion.styles.cjs +2 -27
- package/dist/cjs/ActionsGeneric/ActionsGeneric.styles.cjs +4 -8
- package/dist/cjs/Badge/Badge.styles.cjs +1 -1
- package/dist/cjs/Banner/BannerContent/ActionContainer/ActionContainer.cjs +0 -1
- package/dist/cjs/BaseDropdown/BaseDropdown.cjs +4 -0
- package/dist/cjs/BaseDropdown/BaseDropdownContext/BaseDropdownContext.cjs +1 -2
- package/dist/cjs/BreadCrumb/BreadCrumb.cjs +6 -10
- package/dist/cjs/ButtonBase/ButtonBase.cjs +53 -0
- package/dist/cjs/ButtonBase/ButtonBase.styles.cjs +34 -0
- package/dist/cjs/Calendar/CalendarNavigation/MonthSelector/MonthSelector.cjs +6 -22
- package/dist/cjs/Calendar/CalendarNavigation/MonthSelector/MonthSelector.styles.cjs +6 -38
- package/dist/cjs/Calendar/SingleCalendar/CalendarCell.cjs +4 -10
- package/dist/cjs/Calendar/SingleCalendar/CalendarCell.styles.cjs +1 -20
- package/dist/cjs/ColorPicker/SavedColors/SavedColors.cjs +0 -1
- package/dist/cjs/DatePicker/DatePicker.cjs +2 -1
- package/dist/cjs/DatePicker/DatePicker.styles.cjs +2 -1
- package/dist/cjs/InlineEditor/InlineEditor.cjs +2 -1
- package/dist/cjs/Loading/Loading.cjs +12 -7
- package/dist/cjs/Loading/Loading.styles.cjs +33 -82
- package/dist/cjs/LoadingContainer/LoadingContainer.cjs +4 -2
- package/dist/cjs/LoadingContainer/LoadingContainer.styles.cjs +1 -1
- package/dist/cjs/Section/Section.cjs +10 -14
- package/dist/cjs/Table/hooks/useBulkActions.cjs +1 -2
- package/dist/cjs/Table/hooks/useFilters.cjs +1 -2
- package/dist/cjs/Table/hooks/useGlobalFilter.cjs +1 -2
- package/dist/cjs/Table/hooks/useHeaderGroups.cjs +1 -2
- package/dist/cjs/Table/hooks/usePagination.cjs +1 -2
- package/dist/cjs/Table/hooks/useResizeColumns.cjs +1 -2
- package/dist/cjs/Table/hooks/useRowExpand.cjs +1 -2
- package/dist/cjs/Table/hooks/useRowSelection.cjs +1 -2
- package/dist/cjs/Table/hooks/useRowState.cjs +1 -2
- package/dist/cjs/Table/hooks/useSortBy.cjs +1 -2
- package/dist/cjs/Table/hooks/useSticky.cjs +1 -2
- package/dist/cjs/Table/hooks/useTableStyles.cjs +1 -2
- package/dist/cjs/TextArea/TextArea.styles.cjs +1 -1
- package/dist/cjs/hooks/useExpandable.cjs +32 -0
- package/dist/cjs/hooks/useUniqueId.cjs +2 -1
- package/dist/cjs/index.cjs +41 -37
- package/dist/esm/Accordion/Accordion.js +24 -56
- package/dist/esm/Accordion/Accordion.js.map +1 -1
- package/dist/esm/Accordion/Accordion.styles.js +2 -27
- package/dist/esm/Accordion/Accordion.styles.js.map +1 -1
- package/dist/esm/ActionsGeneric/ActionsGeneric.styles.js +4 -8
- package/dist/esm/ActionsGeneric/ActionsGeneric.styles.js.map +1 -1
- package/dist/esm/Badge/Badge.styles.js +1 -1
- package/dist/esm/Badge/Badge.styles.js.map +1 -1
- package/dist/esm/Banner/BannerContent/ActionContainer/ActionContainer.js +0 -1
- package/dist/esm/Banner/BannerContent/ActionContainer/ActionContainer.js.map +1 -1
- package/dist/esm/BaseDropdown/BaseDropdown.js +4 -0
- package/dist/esm/BaseDropdown/BaseDropdown.js.map +1 -1
- package/dist/esm/BaseDropdown/BaseDropdownContext/BaseDropdownContext.js +1 -2
- package/dist/esm/BaseDropdown/BaseDropdownContext/BaseDropdownContext.js.map +1 -1
- package/dist/esm/BreadCrumb/BreadCrumb.js +6 -10
- package/dist/esm/BreadCrumb/BreadCrumb.js.map +1 -1
- package/dist/esm/ButtonBase/ButtonBase.js +54 -0
- package/dist/esm/ButtonBase/ButtonBase.js.map +1 -0
- package/dist/esm/ButtonBase/ButtonBase.styles.js +34 -0
- package/dist/esm/ButtonBase/ButtonBase.styles.js.map +1 -0
- package/dist/esm/Calendar/CalendarNavigation/MonthSelector/MonthSelector.js +6 -22
- package/dist/esm/Calendar/CalendarNavigation/MonthSelector/MonthSelector.js.map +1 -1
- package/dist/esm/Calendar/CalendarNavigation/MonthSelector/MonthSelector.styles.js +6 -38
- package/dist/esm/Calendar/CalendarNavigation/MonthSelector/MonthSelector.styles.js.map +1 -1
- package/dist/esm/Calendar/SingleCalendar/CalendarCell.js +4 -10
- package/dist/esm/Calendar/SingleCalendar/CalendarCell.js.map +1 -1
- package/dist/esm/Calendar/SingleCalendar/CalendarCell.styles.js +1 -20
- package/dist/esm/Calendar/SingleCalendar/CalendarCell.styles.js.map +1 -1
- package/dist/esm/ColorPicker/SavedColors/SavedColors.js +0 -1
- package/dist/esm/ColorPicker/SavedColors/SavedColors.js.map +1 -1
- package/dist/esm/DatePicker/DatePicker.js +2 -1
- package/dist/esm/DatePicker/DatePicker.js.map +1 -1
- package/dist/esm/DatePicker/DatePicker.styles.js +2 -1
- package/dist/esm/DatePicker/DatePicker.styles.js.map +1 -1
- package/dist/esm/InlineEditor/InlineEditor.js +3 -2
- package/dist/esm/InlineEditor/InlineEditor.js.map +1 -1
- package/dist/esm/Loading/Loading.js +13 -8
- package/dist/esm/Loading/Loading.js.map +1 -1
- package/dist/esm/Loading/Loading.styles.js +33 -82
- package/dist/esm/Loading/Loading.styles.js.map +1 -1
- package/dist/esm/LoadingContainer/LoadingContainer.js +4 -2
- package/dist/esm/LoadingContainer/LoadingContainer.js.map +1 -1
- package/dist/esm/LoadingContainer/LoadingContainer.styles.js +1 -1
- package/dist/esm/LoadingContainer/LoadingContainer.styles.js.map +1 -1
- package/dist/esm/Section/Section.js +11 -15
- package/dist/esm/Section/Section.js.map +1 -1
- package/dist/esm/Table/hooks/useBulkActions.js +1 -2
- package/dist/esm/Table/hooks/useBulkActions.js.map +1 -1
- package/dist/esm/Table/hooks/useFilters.js +1 -2
- package/dist/esm/Table/hooks/useFilters.js.map +1 -1
- package/dist/esm/Table/hooks/useGlobalFilter.js +1 -2
- package/dist/esm/Table/hooks/useGlobalFilter.js.map +1 -1
- package/dist/esm/Table/hooks/useHeaderGroups.js +1 -2
- package/dist/esm/Table/hooks/useHeaderGroups.js.map +1 -1
- package/dist/esm/Table/hooks/usePagination.js +1 -2
- package/dist/esm/Table/hooks/usePagination.js.map +1 -1
- package/dist/esm/Table/hooks/useResizeColumns.js +1 -2
- package/dist/esm/Table/hooks/useResizeColumns.js.map +1 -1
- package/dist/esm/Table/hooks/useRowExpand.js +1 -2
- package/dist/esm/Table/hooks/useRowExpand.js.map +1 -1
- package/dist/esm/Table/hooks/useRowSelection.js +1 -2
- package/dist/esm/Table/hooks/useRowSelection.js.map +1 -1
- package/dist/esm/Table/hooks/useRowState.js +1 -2
- package/dist/esm/Table/hooks/useRowState.js.map +1 -1
- package/dist/esm/Table/hooks/useSortBy.js +1 -2
- package/dist/esm/Table/hooks/useSortBy.js.map +1 -1
- package/dist/esm/Table/hooks/useSticky.js +1 -2
- package/dist/esm/Table/hooks/useSticky.js.map +1 -1
- package/dist/esm/Table/hooks/useTable.js +2 -2
- package/dist/esm/Table/hooks/useTable.js.map +1 -1
- package/dist/esm/Table/hooks/useTableStyles.js +1 -2
- package/dist/esm/Table/hooks/useTableStyles.js.map +1 -1
- package/dist/esm/TextArea/TextArea.styles.js +1 -1
- package/dist/esm/TextArea/TextArea.styles.js.map +1 -1
- package/dist/esm/hooks/useExpandable.js +32 -0
- package/dist/esm/hooks/useExpandable.js.map +1 -0
- package/dist/esm/hooks/useUniqueId.js +2 -1
- package/dist/esm/hooks/useUniqueId.js.map +1 -1
- package/dist/esm/index.js +254 -250
- package/dist/esm/index.js.map +1 -1
- package/dist/types/index.d.ts +2167 -2107
- package/package.json +7 -7
|
@@ -1,102 +1,53 @@
|
|
|
1
|
-
import { keyframes } from "@emotion/react";
|
|
2
1
|
import { createClasses } from "@hitachivantara/uikit-react-utils";
|
|
3
2
|
import { theme } from "@hitachivantara/uikit-styles";
|
|
4
|
-
const interval = 0.11;
|
|
5
|
-
const bars = {
|
|
6
|
-
"&:nth-of-type(1)": {
|
|
7
|
-
animationDelay: "0"
|
|
8
|
-
},
|
|
9
|
-
"&:nth-of-type(2)": {
|
|
10
|
-
animationDelay: `${interval * 2}s`
|
|
11
|
-
},
|
|
12
|
-
"&:nth-of-type(3)": {
|
|
13
|
-
animationDelay: `${interval * 4}s`
|
|
14
|
-
}
|
|
15
|
-
};
|
|
16
|
-
const small = {
|
|
17
|
-
width: "2px",
|
|
18
|
-
height: "18px",
|
|
19
|
-
margin: "0px 2px",
|
|
20
|
-
...bars
|
|
21
|
-
};
|
|
22
|
-
const regular = {
|
|
23
|
-
width: "4px",
|
|
24
|
-
height: "30px",
|
|
25
|
-
margin: "0 3px",
|
|
26
|
-
...bars
|
|
27
|
-
};
|
|
28
|
-
const regularAnimation = keyframes`
|
|
29
|
-
0% {
|
|
30
|
-
transform: scale(1);
|
|
31
|
-
background-color: ${theme.colors.brand};
|
|
32
|
-
}
|
|
33
|
-
50% {
|
|
34
|
-
transform: scale(1, 0.6);
|
|
35
|
-
background-color: ${theme.colors.secondary};
|
|
36
|
-
}
|
|
37
|
-
`;
|
|
38
|
-
const regularColorAnimation = keyframes`
|
|
39
|
-
0% {
|
|
40
|
-
transform: scale(1);
|
|
41
|
-
}
|
|
42
|
-
50% {
|
|
43
|
-
transform: scale(1, 0.6);
|
|
44
|
-
}
|
|
45
|
-
`;
|
|
46
|
-
const smallAnimation = keyframes`
|
|
47
|
-
0% {
|
|
48
|
-
transform: scale(1);
|
|
49
|
-
}
|
|
50
|
-
50% {
|
|
51
|
-
transform: scale(1, 0.223);
|
|
52
|
-
}
|
|
53
|
-
100%: {},
|
|
54
|
-
`;
|
|
55
|
-
const smallColorAnimation = keyframes`
|
|
56
|
-
0% {
|
|
57
|
-
transform: scale(1);
|
|
58
|
-
}
|
|
59
|
-
50% {
|
|
60
|
-
transform: scale(1, 0.223);
|
|
61
|
-
}
|
|
62
|
-
`;
|
|
63
3
|
const { staticClasses, useClasses } = createClasses("HvLoading", {
|
|
64
4
|
root: {
|
|
65
5
|
display: "flex",
|
|
66
6
|
flexDirection: "column",
|
|
67
7
|
alignItems: "center",
|
|
68
|
-
justifyContent: "center"
|
|
8
|
+
justifyContent: "center",
|
|
9
|
+
gap: theme.space.xs
|
|
10
|
+
},
|
|
11
|
+
barContainer: {
|
|
12
|
+
display: "flex",
|
|
13
|
+
justifyContent: "space-around",
|
|
14
|
+
":has($regular)": {
|
|
15
|
+
width: 30,
|
|
16
|
+
height: 30
|
|
17
|
+
},
|
|
18
|
+
":has($small)": {
|
|
19
|
+
"--scaleY": "0.223",
|
|
20
|
+
width: 18,
|
|
21
|
+
height: 18
|
|
22
|
+
}
|
|
69
23
|
},
|
|
70
|
-
barContainer: { display: "flex" },
|
|
71
24
|
loadingBar: {
|
|
25
|
+
backgroundColor: "currentcolor",
|
|
72
26
|
display: "inline-block",
|
|
73
|
-
"
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
27
|
+
animation: "loading 1s ease-in-out infinite",
|
|
28
|
+
// TODO: make this the default when it has better support
|
|
29
|
+
width: "round(up, 0.11em, 2px)",
|
|
30
|
+
"@keyframes loading": {
|
|
77
31
|
"50%": {
|
|
78
|
-
transform: "scale(1,0.
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
}
|
|
32
|
+
transform: "scale(1, var(--scaleY, 0.6))",
|
|
33
|
+
backgroundColor: `var(--customColor, ${theme.colors.secondary})`
|
|
34
|
+
}
|
|
35
|
+
},
|
|
36
|
+
":nth-of-type(2)": { animationDelay: "0.22s" },
|
|
37
|
+
":nth-of-type(3)": { animationDelay: "0.44s" }
|
|
82
38
|
},
|
|
83
|
-
label: {
|
|
39
|
+
label: {},
|
|
84
40
|
overlay: {},
|
|
85
41
|
blur: {},
|
|
86
42
|
hidden: { display: "none" },
|
|
87
|
-
small: {
|
|
88
|
-
|
|
89
|
-
animation: `${regularAnimation} 1s ease-in-out infinite`,
|
|
90
|
-
...regular
|
|
43
|
+
small: {
|
|
44
|
+
width: 2
|
|
91
45
|
},
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
...small
|
|
46
|
+
regular: {
|
|
47
|
+
width: 4
|
|
95
48
|
},
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
...regular
|
|
99
|
-
}
|
|
49
|
+
smallColor: {},
|
|
50
|
+
regularColor: {}
|
|
100
51
|
});
|
|
101
52
|
export {
|
|
102
53
|
staticClasses,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Loading.styles.js","sources":["../../../src/Loading/Loading.styles.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"Loading.styles.js","sources":["../../../src/Loading/Loading.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvLoading\", {\n root: {\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"center\",\n justifyContent: \"center\",\n gap: theme.space.xs,\n },\n barContainer: {\n display: \"flex\",\n justifyContent: \"space-around\",\n\n \":has($regular)\": {\n width: 30,\n height: 30,\n },\n\n \":has($small)\": {\n \"--scaleY\": \"0.223\",\n width: 18,\n height: 18,\n },\n },\n loadingBar: {\n backgroundColor: \"currentcolor\",\n display: \"inline-block\",\n animation: \"loading 1s ease-in-out infinite\",\n // TODO: make this the default when it has better support\n width: \"round(up, 0.11em, 2px)\",\n\n \"@keyframes loading\": {\n \"50%\": {\n transform: \"scale(1, var(--scaleY, 0.6))\",\n backgroundColor: `var(--customColor, ${theme.colors.secondary})`,\n },\n },\n\n \":nth-of-type(2)\": { animationDelay: \"0.22s\" },\n \":nth-of-type(3)\": { animationDelay: \"0.44s\" },\n },\n label: {},\n overlay: {},\n blur: {},\n hidden: { display: \"none\" },\n small: {\n width: 2,\n },\n regular: {\n width: 4,\n },\n smallColor: {},\n regularColor: {},\n});\n"],"names":[],"mappings":";;AAGO,MAAM,EAAE,eAAe,eAAe,cAAc,aAAa;AAAA,EACtE,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,KAAK,MAAM,MAAM;AAAA,EACnB;AAAA,EACA,cAAc;AAAA,IACZ,SAAS;AAAA,IACT,gBAAgB;AAAA,IAEhB,kBAAkB;AAAA,MAChB,OAAO;AAAA,MACP,QAAQ;AAAA,IACV;AAAA,IAEA,gBAAgB;AAAA,MACd,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,iBAAiB;AAAA,IACjB,SAAS;AAAA,IACT,WAAW;AAAA;AAAA,IAEX,OAAO;AAAA,IAEP,sBAAsB;AAAA,MACpB,OAAO;AAAA,QACL,WAAW;AAAA,QACX,iBAAiB,sBAAsB,MAAM,OAAO,SAAS;AAAA,MAC/D;AAAA,IACF;AAAA,IAEA,mBAAmB,EAAE,gBAAgB,QAAQ;AAAA,IAC7C,mBAAmB,EAAE,gBAAgB,QAAQ;AAAA,EAC/C;AAAA,EACA,OAAO,CAAC;AAAA,EACR,SAAS,CAAC;AAAA,EACV,MAAM,CAAC;AAAA,EACP,QAAQ,EAAE,SAAS,OAAO;AAAA,EAC1B,OAAO;AAAA,IACL,OAAO;AAAA,EACT;AAAA,EACA,SAAS;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA,YAAY,CAAC;AAAA,EACb,cAAc,CAAC;AACjB,CAAC;"}
|
|
@@ -16,7 +16,7 @@ const HvLoadingContainer = (props) => {
|
|
|
16
16
|
...others
|
|
17
17
|
} = useDefaultProps("HvLoadingContainer", props);
|
|
18
18
|
const { classes, cx } = useClasses(classesProp);
|
|
19
|
-
const ariaLabel = ariaLabelProp || typeof label === "string" && label
|
|
19
|
+
const ariaLabel = ariaLabelProp || typeof label === "string" && label || "Loading";
|
|
20
20
|
return /* @__PURE__ */ jsxs("div", { className: cx(classes.root, className), ...others, children: [
|
|
21
21
|
/* @__PURE__ */ jsx(
|
|
22
22
|
HvLoading,
|
|
@@ -27,7 +27,9 @@ const HvLoadingContainer = (props) => {
|
|
|
27
27
|
label,
|
|
28
28
|
hidden,
|
|
29
29
|
"aria-label": ariaLabel,
|
|
30
|
-
style: mergeStyles(
|
|
30
|
+
style: mergeStyles(void 0, {
|
|
31
|
+
"--opacity": opacity && `${opacity * 100}%`
|
|
32
|
+
})
|
|
31
33
|
}
|
|
32
34
|
),
|
|
33
35
|
children
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LoadingContainer.js","sources":["../../../src/LoadingContainer/LoadingContainer.tsx"],"sourcesContent":["import {\n mergeStyles,\n useDefaultProps,\n type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport { HvLoading, HvLoadingProps } from \"../Loading\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { staticClasses, useClasses } from \"./LoadingContainer.styles\";\n\nexport { staticClasses as loadingContainerClasses };\n\nexport type HvLoadingContainerClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLoadingContainerProps\n extends HvBaseProps<HTMLDivElement>,\n Pick<HvLoadingProps, \"label\" | \"small\" | \"hidden\"> {\n opacity?: number;\n classes?: HvLoadingContainerClasses;\n}\n\n/**\n * A component that wraps `children` with an `HvLoading` component and\n * and an overlay background with opacity.\n *\n * @example\n * <HvLoadingContainer label=\"Loading...\" hidden={!isLoading}>\n * <MyComponent>\n * </HvLoadingContainer>\n * */\nexport const HvLoadingContainer = (props: HvLoadingContainerProps) => {\n const {\n children,\n className,\n classes: classesProp,\n hidden,\n small,\n label,\n \"aria-label\": ariaLabelProp,\n opacity,\n ...others\n } = useDefaultProps(\"HvLoadingContainer\", props);\n const { classes, cx } = useClasses(classesProp);\n\n const ariaLabel =\n ariaLabelProp || (typeof label === \"string\" && label)
|
|
1
|
+
{"version":3,"file":"LoadingContainer.js","sources":["../../../src/LoadingContainer/LoadingContainer.tsx"],"sourcesContent":["import {\n mergeStyles,\n useDefaultProps,\n type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport { HvLoading, HvLoadingProps } from \"../Loading\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { staticClasses, useClasses } from \"./LoadingContainer.styles\";\n\nexport { staticClasses as loadingContainerClasses };\n\nexport type HvLoadingContainerClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLoadingContainerProps\n extends HvBaseProps<HTMLDivElement>,\n Pick<HvLoadingProps, \"label\" | \"small\" | \"hidden\"> {\n opacity?: number;\n classes?: HvLoadingContainerClasses;\n}\n\n/**\n * A component that wraps `children` with an `HvLoading` component and\n * and an overlay background with opacity.\n *\n * @example\n * <HvLoadingContainer label=\"Loading...\" hidden={!isLoading}>\n * <MyComponent>\n * </HvLoadingContainer>\n * */\nexport const HvLoadingContainer = (props: HvLoadingContainerProps) => {\n const {\n children,\n className,\n classes: classesProp,\n hidden,\n small,\n label,\n \"aria-label\": ariaLabelProp,\n opacity,\n ...others\n } = useDefaultProps(\"HvLoadingContainer\", props);\n const { classes, cx } = useClasses(classesProp);\n\n const ariaLabel =\n ariaLabelProp || (typeof label === \"string\" && label) || \"Loading\";\n\n return (\n <div className={cx(classes.root, className)} {...others}>\n <HvLoading\n className={classes.loading}\n role=\"progressbar\"\n small={small}\n label={label}\n hidden={hidden}\n aria-label={ariaLabel}\n style={mergeStyles(undefined, {\n \"--opacity\": opacity && `${opacity * 100}%`,\n })}\n />\n {children}\n </div>\n );\n};\n"],"names":[],"mappings":";;;;;AA8Ba,MAAA,qBAAqB,CAAC,UAAmC;AAC9D,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,sBAAsB,KAAK;AAC/C,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,QAAM,YACJ,iBAAkB,OAAO,UAAU,YAAY,SAAU;AAGzD,SAAA,qBAAC,SAAI,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,QAC/C,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,QAAQ;AAAA,QACnB,MAAK;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QACZ,OAAO,YAAY,QAAW;AAAA,UAC5B,aAAa,WAAW,GAAG,UAAU,GAAG;AAAA,QAAA,CACzC;AAAA,MAAA;AAAA,IACH;AAAA,IACC;AAAA,EACH,EAAA,CAAA;AAEJ;"}
|
|
@@ -11,7 +11,7 @@ const { staticClasses, useClasses } = createClasses("HvLoadingContainer", {
|
|
|
11
11
|
inset: 0,
|
|
12
12
|
zIndex: theme.zIndices.overlay,
|
|
13
13
|
transition: "background-color .2s ease",
|
|
14
|
-
backgroundColor: theme.alpha("atmo1", "var(--opacity,
|
|
14
|
+
backgroundColor: theme.alpha("atmo1", "var(--opacity, 80%)")
|
|
15
15
|
}
|
|
16
16
|
});
|
|
17
17
|
export {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LoadingContainer.styles.js","sources":["../../../src/LoadingContainer/LoadingContainer.styles.ts"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nconst { staticClasses, useClasses } = createClasses(\"HvLoadingContainer\", {\n root: {\n position: \"relative\",\n height: \"inherit\",\n },\n loading: {\n position: \"absolute\",\n userSelect: \"none\",\n inset: 0,\n zIndex: theme.zIndices.overlay,\n transition: \"background-color .2s ease\",\n backgroundColor: theme.alpha(\"atmo1\", \"var(--opacity,
|
|
1
|
+
{"version":3,"file":"LoadingContainer.styles.js","sources":["../../../src/LoadingContainer/LoadingContainer.styles.ts"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nconst { staticClasses, useClasses } = createClasses(\"HvLoadingContainer\", {\n root: {\n position: \"relative\",\n height: \"inherit\",\n },\n loading: {\n position: \"absolute\",\n userSelect: \"none\",\n inset: 0,\n zIndex: theme.zIndices.overlay,\n transition: \"background-color .2s ease\",\n backgroundColor: theme.alpha(\"atmo1\", \"var(--opacity, 80%)\"),\n },\n});\n\nexport { staticClasses, useClasses };\n"],"names":[],"mappings":";;AAGA,MAAM,EAAE,eAAe,eAAe,cAAc,sBAAsB;AAAA,EACxE,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,QAAQ;AAAA,EACV;AAAA,EACA,SAAS;AAAA,IACP,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,OAAO;AAAA,IACP,QAAQ,MAAM,SAAS;AAAA,IACvB,YAAY;AAAA,IACZ,iBAAiB,MAAM,MAAM,SAAS,qBAAqB;AAAA,EAC7D;AACF,CAAC;"}
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
import { jsxs, jsx } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef } from "react";
|
|
3
|
-
import {
|
|
3
|
+
import { Down } from "@hitachivantara/uikit-react-icons";
|
|
4
4
|
import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
|
|
5
|
-
import {
|
|
6
|
-
import { useUniqueId } from "../hooks/useUniqueId.js";
|
|
7
|
-
import { setId } from "../utils/setId.js";
|
|
5
|
+
import { useExpandable } from "../hooks/useExpandable.js";
|
|
8
6
|
import { useClasses } from "./Section.styles.js";
|
|
9
7
|
import { staticClasses } from "./Section.styles.js";
|
|
10
8
|
import { HvButton } from "../Button/Button.js";
|
|
@@ -27,18 +25,17 @@ const HvSection = forwardRef(
|
|
|
27
25
|
...others
|
|
28
26
|
} = useDefaultProps("HvSection", props);
|
|
29
27
|
const { classes, cx } = useClasses(classesProp);
|
|
30
|
-
const
|
|
28
|
+
const { isOpen, toggleOpen, buttonProps, regionProps } = useExpandable({
|
|
29
|
+
id,
|
|
31
30
|
expanded,
|
|
32
|
-
|
|
33
|
-
);
|
|
34
|
-
const elementId = useUniqueId(id);
|
|
35
|
-
const contentId = setId(elementId, "content");
|
|
31
|
+
defaultExpanded
|
|
32
|
+
});
|
|
36
33
|
const showContent = expandable ? !!isOpen : true;
|
|
37
34
|
return /* @__PURE__ */ jsxs(
|
|
38
35
|
"div",
|
|
39
36
|
{
|
|
40
37
|
ref,
|
|
41
|
-
id
|
|
38
|
+
id,
|
|
42
39
|
className: cx(classes.root, className),
|
|
43
40
|
...others,
|
|
44
41
|
children: [
|
|
@@ -54,14 +51,13 @@ const HvSection = forwardRef(
|
|
|
54
51
|
{
|
|
55
52
|
icon: true,
|
|
56
53
|
onClick: (event) => {
|
|
57
|
-
|
|
54
|
+
toggleOpen();
|
|
58
55
|
onToggle?.(event, !isOpen);
|
|
59
56
|
},
|
|
60
|
-
"aria-expanded": isOpen,
|
|
61
|
-
"aria-controls": contentId,
|
|
62
57
|
"aria-label": isOpen ? "Collapse" : "Expand",
|
|
58
|
+
...buttonProps,
|
|
63
59
|
...expandButtonProps,
|
|
64
|
-
children:
|
|
60
|
+
children: /* @__PURE__ */ jsx(Down, { style: { rotate: isOpen ? "180deg" : void 0 } })
|
|
65
61
|
}
|
|
66
62
|
),
|
|
67
63
|
title,
|
|
@@ -73,12 +69,12 @@ const HvSection = forwardRef(
|
|
|
73
69
|
"div",
|
|
74
70
|
{
|
|
75
71
|
ref: contentRef,
|
|
76
|
-
id: contentId,
|
|
77
72
|
hidden: !isOpen,
|
|
78
73
|
className: cx(classes.content, {
|
|
79
74
|
[classes.hidden]: !showContent,
|
|
80
75
|
[classes.spaceTop]: !(title || actions || expandable)
|
|
81
76
|
}),
|
|
77
|
+
...expandable && regionProps,
|
|
82
78
|
children
|
|
83
79
|
}
|
|
84
80
|
)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Section.js","sources":["../../../src/Section/Section.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Down
|
|
1
|
+
{"version":3,"file":"Section.js","sources":["../../../src/Section/Section.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Down } from \"@hitachivantara/uikit-react-icons\";\nimport {\n useDefaultProps,\n type ExtractNames,\n} from \"@hitachivantara/uikit-react-utils\";\n\nimport { HvButton, HvButtonProps } from \"../Button\";\nimport { useExpandable } from \"../hooks/useExpandable\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { staticClasses, useClasses } from \"./Section.styles\";\n\nexport { staticClasses as sectionClasses };\n\nexport type HvSectionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSectionProps\n extends Omit<HvBaseProps<HTMLDivElement>, \"title\" | \"onToggle\"> {\n /** The title of the section */\n title?: React.ReactNode;\n /** Whether or not the section is expandable. */\n expandable?: boolean;\n /** Whether the section is open or not, if this property is defined the accordion must be fully controlled. */\n expanded?: boolean;\n /** When uncontrolled, defines the initial expanded state. */\n defaultExpanded?: boolean;\n /** Section actions */\n actions?: React.ReactNode;\n /** Section onExpand callback */\n onToggle?: (\n event: React.MouseEvent<HTMLButtonElement>,\n open: boolean,\n ) => void;\n /** Props to be passed to the expand button */\n expandButtonProps?: HvButtonProps;\n /** Determines whether or not the header has a shadow on the bottom border. */\n raisedHeader?: boolean;\n /** A Jss Object used to override or extend the styles applied to the empty state component. */\n classes?: HvSectionClasses;\n /** Content container ref. */\n contentRef?: React.Ref<HTMLDivElement>;\n}\n\n/**\n * Sections allow grouping information on a page under the same topic.\n */\nexport const HvSection = forwardRef<HTMLDivElement, HvSectionProps>(\n (props, ref) => {\n const {\n id,\n classes: classesProp,\n className,\n title,\n expandable,\n expanded,\n defaultExpanded = true,\n actions,\n onToggle,\n expandButtonProps,\n raisedHeader,\n contentRef,\n children,\n ...others\n } = useDefaultProps(\"HvSection\", props);\n const { classes, cx } = useClasses(classesProp);\n\n const { isOpen, toggleOpen, buttonProps, regionProps } = useExpandable({\n id,\n expanded,\n defaultExpanded,\n });\n\n const showContent = expandable ? !!isOpen : true;\n\n return (\n <div\n ref={ref}\n id={id}\n className={cx(classes.root, className)}\n {...others}\n >\n {(title || actions || expandable) && (\n <div\n className={cx(classes.header, {\n [classes.raisedHeader]: raisedHeader && isOpen,\n })}\n >\n {expandable && (\n <HvButton\n icon\n onClick={(event) => {\n toggleOpen();\n onToggle?.(event, !isOpen);\n }}\n aria-label={isOpen ? \"Collapse\" : \"Expand\"}\n {...buttonProps}\n {...expandButtonProps}\n >\n <Down style={{ rotate: isOpen ? \"180deg\" : undefined }} />\n </HvButton>\n )}\n {title}\n <div className={classes.actions}>{actions}</div>\n </div>\n )}\n <div\n ref={contentRef}\n hidden={!isOpen}\n className={cx(classes.content, {\n [classes.hidden]: !showContent,\n [classes.spaceTop]: !(title || actions || expandable),\n })}\n {...(expandable && regionProps)}\n >\n {children}\n </div>\n </div>\n );\n },\n);\n"],"names":[],"mappings":";;;;;;;;AA8CO,MAAM,YAAY;AAAA,EACvB,CAAC,OAAO,QAAQ;AACR,UAAA;AAAA,MACJ;AAAA,MACA,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,kBAAkB;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IAAA,IACD,gBAAgB,aAAa,KAAK;AACtC,UAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,UAAM,EAAE,QAAQ,YAAY,aAAa,YAAA,IAAgB,cAAc;AAAA,MACrE;AAAA,MACA;AAAA,MACA;AAAA,IAAA,CACD;AAED,UAAM,cAAc,aAAa,CAAC,CAAC,SAAS;AAG1C,WAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,QACpC,GAAG;AAAA,QAEF,UAAA;AAAA,WAAA,SAAS,WAAW,eACpB;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW,GAAG,QAAQ,QAAQ;AAAA,gBAC5B,CAAC,QAAQ,YAAY,GAAG,gBAAgB;AAAA,cAAA,CACzC;AAAA,cAEA,UAAA;AAAA,gBACC,cAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,MAAI;AAAA,oBACJ,SAAS,CAAC,UAAU;AACP;AACA,iCAAA,OAAO,CAAC,MAAM;AAAA,oBAC3B;AAAA,oBACA,cAAY,SAAS,aAAa;AAAA,oBACjC,GAAG;AAAA,oBACH,GAAG;AAAA,oBAEJ,UAAA,oBAAC,QAAK,OAAO,EAAE,QAAQ,SAAS,WAAW,UAAa;AAAA,kBAAA;AAAA,gBAC1D;AAAA,gBAED;AAAA,gBACA,oBAAA,OAAA,EAAI,WAAW,QAAQ,SAAU,UAAQ,SAAA;AAAA,cAAA;AAAA,YAAA;AAAA,UAC5C;AAAA,UAEF;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,KAAK;AAAA,cACL,QAAQ,CAAC;AAAA,cACT,WAAW,GAAG,QAAQ,SAAS;AAAA,gBAC7B,CAAC,QAAQ,MAAM,GAAG,CAAC;AAAA,gBACnB,CAAC,QAAQ,QAAQ,GAAG,EAAE,SAAS,WAAW;AAAA,cAAA,CAC3C;AAAA,cACA,GAAI,cAAc;AAAA,cAElB;AAAA,YAAA;AAAA,UACH;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;"}
|
|
@@ -89,8 +89,7 @@ const useBulkActions = (hooks) => {
|
|
|
89
89
|
hooks.useInstance.push(useInstanceHook);
|
|
90
90
|
};
|
|
91
91
|
useBulkActions.pluginName = "useHvBulkActions";
|
|
92
|
-
const useBulkActions$1 = useBulkActions;
|
|
93
92
|
export {
|
|
94
|
-
useBulkActions
|
|
93
|
+
useBulkActions as default,
|
|
95
94
|
defaultgetHvBulkActionsProps
|
|
96
95
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useBulkActions.js","sources":["../../../../src/Table/hooks/useBulkActions.ts"],"sourcesContent":["import { useCallback } from \"react\";\nimport {\n ensurePluginOrder,\n Hooks,\n makePropGetter,\n PropGetter,\n TableCommonProps,\n useGetLatest,\n} from \"react-table\";\n\n// #region ##### TYPES #####\n\n// TODO: fix typo in v6\nexport interface HvTAbleBulkActionsProps extends TableCommonProps {\n numTotal: number;\n numSelected: number;\n showSelectAllPages: boolean;\n onSelectAll: () => void;\n onSelectAllPages: () => void;\n labels?: Record<string, string>;\n}\n\nexport type HvBulkActionsPropGetter<D extends object> = PropGetter<\n D,\n HvTAbleBulkActionsProps\n>;\n\nexport interface UseHvBulkActionsHooks<D extends object> {\n getHvBulkActionsProps: Array<HvBulkActionsPropGetter<D>>;\n}\n\nexport type UseHvBulkActionsTableOptions = {\n // TODO: fix typo in v6\n /** Controls whether the \"Select all\" should _select_ or _unselect_ the rows, in a partial selection state. */\n aditivePageBulkSelection?: boolean;\n /** Controls whether _only the current page_ or _all pages_ should be unselected */\n subtractivePageBulkDeselection?: boolean;\n showSelectAllPages?: boolean;\n};\n\nexport interface UseHvBulkActionsTableInstanceProps<D extends object> {\n getHvBulkActionsProps: (\n propGetter?: HvBulkActionsPropGetter<D>,\n ) => HvTAbleBulkActionsProps;\n invertedToggleAllRowsSelected: () => void;\n}\n\nexport type UseBulkActionsProps = (<D extends object = Record<string, unknown>>(\n hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useInstanceHook = (instance: any) => {\n const { plugins, page, toggleAllPageRowsSelected, toggleAllRowsSelected } =\n instance;\n\n ensurePluginOrder(plugins, [\"useHvRowSelection\"], \"useHvBulkActions\");\n\n const getInstance = useGetLatest(instance);\n\n const getHvBulkActionsProps = makePropGetter(\n instance.getHooks().getHvBulkActionsProps,\n {\n instance: getInstance(),\n },\n );\n\n const isPaginated = !!page;\n\n const invertedToggleAllRowsSelected = useCallback(() => {\n if (!isPaginated) return toggleAllRowsSelected();\n\n const {\n aditivePageBulkSelection: additivePageBulkSelection,\n subtractivePageBulkDeselection,\n isNoRowsSelected,\n isNoPageRowsSelected,\n isAllSelectablePageRowsSelected,\n isAllSelectablePageRowsUnselected,\n } = getInstance();\n\n if (additivePageBulkSelection && subtractivePageBulkDeselection) {\n return toggleAllPageRowsSelected(!isAllSelectablePageRowsSelected);\n }\n\n if (additivePageBulkSelection && !subtractivePageBulkDeselection) {\n if (!isAllSelectablePageRowsSelected) {\n return toggleAllPageRowsSelected(true);\n }\n\n return toggleAllRowsSelected(false);\n }\n\n if (!additivePageBulkSelection && !subtractivePageBulkDeselection) {\n if (isNoRowsSelected) {\n return toggleAllPageRowsSelected(true);\n }\n\n return toggleAllRowsSelected(false);\n }\n\n if (!additivePageBulkSelection && subtractivePageBulkDeselection) {\n if (isNoRowsSelected) {\n return toggleAllPageRowsSelected(true);\n }\n if (!isAllSelectablePageRowsUnselected) {\n return toggleAllPageRowsSelected(false);\n }\n if (!isNoPageRowsSelected) {\n return toggleAllPageRowsSelected(false);\n }\n\n return toggleAllRowsSelected(false);\n }\n\n return toggleAllPageRowsSelected();\n }, [\n getInstance,\n isPaginated,\n toggleAllPageRowsSelected,\n toggleAllRowsSelected,\n ]);\n\n Object.assign(instance, {\n getHvBulkActionsProps,\n invertedToggleAllRowsSelected,\n aditivePageBulkSelection: !!instance.aditivePageBulkSelection,\n subtractivePageBulkDeselection: !!instance.subtractivePageBulkDeselection,\n });\n};\n\n// TODO: fix typo in v6\nexport const defaultgetHvBulkActionsProps = (props: any, { instance }: any) => {\n const {\n rows,\n initialRows,\n selectedFlatRows,\n state: { selectedRowIds = {} } = {},\n page,\n toggleAllRowsSelected,\n invertedToggleAllRowsSelected,\n showSelectAllPages = true,\n applyToggleAllRowsSelectedToPrefilteredRows,\n } = instance;\n\n const isPaginated = !!page;\n\n const nextProps: HvTAbleBulkActionsProps = {\n numTotal: applyToggleAllRowsSelectedToPrefilteredRows\n ? initialRows.length\n : rows.length,\n numSelected: applyToggleAllRowsSelectedToPrefilteredRows\n ? Object.keys(selectedRowIds).length\n : selectedFlatRows.length,\n showSelectAllPages: showSelectAllPages && isPaginated,\n onSelectAll: invertedToggleAllRowsSelected,\n onSelectAllPages: toggleAllRowsSelected,\n };\n\n return [props, nextProps];\n};\n\nconst useBulkActions: UseBulkActionsProps = (hooks) => {\n hooks.getHvBulkActionsProps = [defaultgetHvBulkActionsProps];\n\n hooks.useInstance.push(useInstanceHook);\n};\n\nuseBulkActions.pluginName = \"useHvBulkActions\";\n\nexport default useBulkActions;\n"],"names":[],"mappings":";;AAqDA,MAAM,kBAAkB,CAAC,aAAkB;AACzC,QAAM,EAAE,SAAS,MAAM,2BAA2B,0BAChD;AAEF,oBAAkB,SAAS,CAAC,mBAAmB,GAAG,kBAAkB;AAE9D,QAAA,cAAc,aAAa,QAAQ;AAEzC,QAAM,wBAAwB;AAAA,IAC5B,SAAS,WAAW;AAAA,IACpB;AAAA,MACE,UAAU,YAAY;AAAA,IACxB;AAAA,EAAA;AAGI,QAAA,cAAc,CAAC,CAAC;AAEhB,QAAA,gCAAgC,YAAY,MAAM;AAClD,QAAA,CAAC,YAAa,QAAO;AAEnB,UAAA;AAAA,MACJ,0BAA0B;AAAA,MAC1B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,QACE,YAAY;AAEhB,QAAI,6BAA6B,gCAAgC;AACxD,aAAA,0BAA0B,CAAC,+BAA+B;AAAA,IACnE;AAEI,QAAA,6BAA6B,CAAC,gCAAgC;AAChE,UAAI,CAAC,iCAAiC;AACpC,eAAO,0BAA0B,IAAI;AAAA,MACvC;AAEA,aAAO,sBAAsB,KAAK;AAAA,IACpC;AAEI,QAAA,CAAC,6BAA6B,CAAC,gCAAgC;AACjE,UAAI,kBAAkB;AACpB,eAAO,0BAA0B,IAAI;AAAA,MACvC;AAEA,aAAO,sBAAsB,KAAK;AAAA,IACpC;AAEI,QAAA,CAAC,6BAA6B,gCAAgC;AAChE,UAAI,kBAAkB;AACpB,eAAO,0BAA0B,IAAI;AAAA,MACvC;AACA,UAAI,CAAC,mCAAmC;AACtC,eAAO,0BAA0B,KAAK;AAAA,MACxC;AACA,UAAI,CAAC,sBAAsB;AACzB,eAAO,0BAA0B,KAAK;AAAA,MACxC;AAEA,aAAO,sBAAsB,KAAK;AAAA,IACpC;AAEA,WAAO,0BAA0B;AAAA,EAAA,GAChC;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,CACD;AAED,SAAO,OAAO,UAAU;AAAA,IACtB;AAAA,IACA;AAAA,IACA,0BAA0B,CAAC,CAAC,SAAS;AAAA,IACrC,gCAAgC,CAAC,CAAC,SAAS;AAAA,EAAA,CAC5C;AACH;AAGO,MAAM,+BAA+B,CAAC,OAAY,EAAE,eAAoB;AACvE,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,EAAE,iBAAiB,CAAC,EAAA,IAAM,CAAC;AAAA,IAClC;AAAA,IACA;AAAA,IACA;AAAA,IACA,qBAAqB;AAAA,IACrB;AAAA,EACE,IAAA;AAEE,QAAA,cAAc,CAAC,CAAC;AAEtB,QAAM,YAAqC;AAAA,IACzC,UAAU,8CACN,YAAY,SACZ,KAAK;AAAA,IACT,aAAa,8CACT,OAAO,KAAK,cAAc,EAAE,SAC5B,iBAAiB;AAAA,IACrB,oBAAoB,sBAAsB;AAAA,IAC1C,aAAa;AAAA,IACb,kBAAkB;AAAA,EAAA;AAGb,SAAA,CAAC,OAAO,SAAS;AAC1B;
|
|
1
|
+
{"version":3,"file":"useBulkActions.js","sources":["../../../../src/Table/hooks/useBulkActions.ts"],"sourcesContent":["import { useCallback } from \"react\";\nimport {\n ensurePluginOrder,\n Hooks,\n makePropGetter,\n PropGetter,\n TableCommonProps,\n useGetLatest,\n} from \"react-table\";\n\n// #region ##### TYPES #####\n\n// TODO: fix typo in v6\nexport interface HvTAbleBulkActionsProps extends TableCommonProps {\n numTotal: number;\n numSelected: number;\n showSelectAllPages: boolean;\n onSelectAll: () => void;\n onSelectAllPages: () => void;\n labels?: Record<string, string>;\n}\n\nexport type HvBulkActionsPropGetter<D extends object> = PropGetter<\n D,\n HvTAbleBulkActionsProps\n>;\n\nexport interface UseHvBulkActionsHooks<D extends object> {\n getHvBulkActionsProps: Array<HvBulkActionsPropGetter<D>>;\n}\n\nexport type UseHvBulkActionsTableOptions = {\n // TODO: fix typo in v6\n /** Controls whether the \"Select all\" should _select_ or _unselect_ the rows, in a partial selection state. */\n aditivePageBulkSelection?: boolean;\n /** Controls whether _only the current page_ or _all pages_ should be unselected */\n subtractivePageBulkDeselection?: boolean;\n showSelectAllPages?: boolean;\n};\n\nexport interface UseHvBulkActionsTableInstanceProps<D extends object> {\n getHvBulkActionsProps: (\n propGetter?: HvBulkActionsPropGetter<D>,\n ) => HvTAbleBulkActionsProps;\n invertedToggleAllRowsSelected: () => void;\n}\n\nexport type UseBulkActionsProps = (<D extends object = Record<string, unknown>>(\n hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useInstanceHook = (instance: any) => {\n const { plugins, page, toggleAllPageRowsSelected, toggleAllRowsSelected } =\n instance;\n\n ensurePluginOrder(plugins, [\"useHvRowSelection\"], \"useHvBulkActions\");\n\n const getInstance = useGetLatest(instance);\n\n const getHvBulkActionsProps = makePropGetter(\n instance.getHooks().getHvBulkActionsProps,\n {\n instance: getInstance(),\n },\n );\n\n const isPaginated = !!page;\n\n const invertedToggleAllRowsSelected = useCallback(() => {\n if (!isPaginated) return toggleAllRowsSelected();\n\n const {\n aditivePageBulkSelection: additivePageBulkSelection,\n subtractivePageBulkDeselection,\n isNoRowsSelected,\n isNoPageRowsSelected,\n isAllSelectablePageRowsSelected,\n isAllSelectablePageRowsUnselected,\n } = getInstance();\n\n if (additivePageBulkSelection && subtractivePageBulkDeselection) {\n return toggleAllPageRowsSelected(!isAllSelectablePageRowsSelected);\n }\n\n if (additivePageBulkSelection && !subtractivePageBulkDeselection) {\n if (!isAllSelectablePageRowsSelected) {\n return toggleAllPageRowsSelected(true);\n }\n\n return toggleAllRowsSelected(false);\n }\n\n if (!additivePageBulkSelection && !subtractivePageBulkDeselection) {\n if (isNoRowsSelected) {\n return toggleAllPageRowsSelected(true);\n }\n\n return toggleAllRowsSelected(false);\n }\n\n if (!additivePageBulkSelection && subtractivePageBulkDeselection) {\n if (isNoRowsSelected) {\n return toggleAllPageRowsSelected(true);\n }\n if (!isAllSelectablePageRowsUnselected) {\n return toggleAllPageRowsSelected(false);\n }\n if (!isNoPageRowsSelected) {\n return toggleAllPageRowsSelected(false);\n }\n\n return toggleAllRowsSelected(false);\n }\n\n return toggleAllPageRowsSelected();\n }, [\n getInstance,\n isPaginated,\n toggleAllPageRowsSelected,\n toggleAllRowsSelected,\n ]);\n\n Object.assign(instance, {\n getHvBulkActionsProps,\n invertedToggleAllRowsSelected,\n aditivePageBulkSelection: !!instance.aditivePageBulkSelection,\n subtractivePageBulkDeselection: !!instance.subtractivePageBulkDeselection,\n });\n};\n\n// TODO: fix typo in v6\nexport const defaultgetHvBulkActionsProps = (props: any, { instance }: any) => {\n const {\n rows,\n initialRows,\n selectedFlatRows,\n state: { selectedRowIds = {} } = {},\n page,\n toggleAllRowsSelected,\n invertedToggleAllRowsSelected,\n showSelectAllPages = true,\n applyToggleAllRowsSelectedToPrefilteredRows,\n } = instance;\n\n const isPaginated = !!page;\n\n const nextProps: HvTAbleBulkActionsProps = {\n numTotal: applyToggleAllRowsSelectedToPrefilteredRows\n ? initialRows.length\n : rows.length,\n numSelected: applyToggleAllRowsSelectedToPrefilteredRows\n ? Object.keys(selectedRowIds).length\n : selectedFlatRows.length,\n showSelectAllPages: showSelectAllPages && isPaginated,\n onSelectAll: invertedToggleAllRowsSelected,\n onSelectAllPages: toggleAllRowsSelected,\n };\n\n return [props, nextProps];\n};\n\nconst useBulkActions: UseBulkActionsProps = (hooks) => {\n hooks.getHvBulkActionsProps = [defaultgetHvBulkActionsProps];\n\n hooks.useInstance.push(useInstanceHook);\n};\n\nuseBulkActions.pluginName = \"useHvBulkActions\";\n\nexport default useBulkActions;\n"],"names":[],"mappings":";;AAqDA,MAAM,kBAAkB,CAAC,aAAkB;AACzC,QAAM,EAAE,SAAS,MAAM,2BAA2B,0BAChD;AAEF,oBAAkB,SAAS,CAAC,mBAAmB,GAAG,kBAAkB;AAE9D,QAAA,cAAc,aAAa,QAAQ;AAEzC,QAAM,wBAAwB;AAAA,IAC5B,SAAS,WAAW;AAAA,IACpB;AAAA,MACE,UAAU,YAAY;AAAA,IACxB;AAAA,EAAA;AAGI,QAAA,cAAc,CAAC,CAAC;AAEhB,QAAA,gCAAgC,YAAY,MAAM;AAClD,QAAA,CAAC,YAAa,QAAO;AAEnB,UAAA;AAAA,MACJ,0BAA0B;AAAA,MAC1B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,QACE,YAAY;AAEhB,QAAI,6BAA6B,gCAAgC;AACxD,aAAA,0BAA0B,CAAC,+BAA+B;AAAA,IACnE;AAEI,QAAA,6BAA6B,CAAC,gCAAgC;AAChE,UAAI,CAAC,iCAAiC;AACpC,eAAO,0BAA0B,IAAI;AAAA,MACvC;AAEA,aAAO,sBAAsB,KAAK;AAAA,IACpC;AAEI,QAAA,CAAC,6BAA6B,CAAC,gCAAgC;AACjE,UAAI,kBAAkB;AACpB,eAAO,0BAA0B,IAAI;AAAA,MACvC;AAEA,aAAO,sBAAsB,KAAK;AAAA,IACpC;AAEI,QAAA,CAAC,6BAA6B,gCAAgC;AAChE,UAAI,kBAAkB;AACpB,eAAO,0BAA0B,IAAI;AAAA,MACvC;AACA,UAAI,CAAC,mCAAmC;AACtC,eAAO,0BAA0B,KAAK;AAAA,MACxC;AACA,UAAI,CAAC,sBAAsB;AACzB,eAAO,0BAA0B,KAAK;AAAA,MACxC;AAEA,aAAO,sBAAsB,KAAK;AAAA,IACpC;AAEA,WAAO,0BAA0B;AAAA,EAAA,GAChC;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,CACD;AAED,SAAO,OAAO,UAAU;AAAA,IACtB;AAAA,IACA;AAAA,IACA,0BAA0B,CAAC,CAAC,SAAS;AAAA,IACrC,gCAAgC,CAAC,CAAC,SAAS;AAAA,EAAA,CAC5C;AACH;AAGO,MAAM,+BAA+B,CAAC,OAAY,EAAE,eAAoB;AACvE,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,EAAE,iBAAiB,CAAC,EAAA,IAAM,CAAC;AAAA,IAClC;AAAA,IACA;AAAA,IACA;AAAA,IACA,qBAAqB;AAAA,IACrB;AAAA,EACE,IAAA;AAEE,QAAA,cAAc,CAAC,CAAC;AAEtB,QAAM,YAAqC;AAAA,IACzC,UAAU,8CACN,YAAY,SACZ,KAAK;AAAA,IACT,aAAa,8CACT,OAAO,KAAK,cAAc,EAAE,SAC5B,iBAAiB;AAAA,IACrB,oBAAoB,sBAAsB;AAAA,IAC1C,aAAa;AAAA,IACb,kBAAkB;AAAA,EAAA;AAGb,SAAA,CAAC,OAAO,SAAS;AAC1B;AAEM,MAAA,iBAAsC,CAAC,UAAU;AAC/C,QAAA,wBAAwB,CAAC,4BAA4B;AAErD,QAAA,YAAY,KAAK,eAAe;AACxC;AAEA,eAAe,aAAa;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useFilters.js","sources":["../../../../src/Table/hooks/useFilters.ts"],"sourcesContent":["import { Hooks, useFilters } from \"react-table\";\n\nexport type UseFiltersProps = (<D extends object = Record<string, unknown>>(\n hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useHvFilters = useFilters.bind({});\n(useHvFilters.pluginName as string) = \"useHvFilters\";\n\nexport default useHvFilters as UseFiltersProps;\n"],"names":[],"mappings":";AAQA,MAAM,eAAe,WAAW,KAAK,
|
|
1
|
+
{"version":3,"file":"useFilters.js","sources":["../../../../src/Table/hooks/useFilters.ts"],"sourcesContent":["import { Hooks, useFilters } from \"react-table\";\n\nexport type UseFiltersProps = (<D extends object = Record<string, unknown>>(\n hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useHvFilters = useFilters.bind({});\n(useHvFilters.pluginName as string) = \"useHvFilters\";\n\nexport default useHvFilters as UseFiltersProps;\n"],"names":[],"mappings":";AAQA,MAAM,eAAe,WAAW,KAAK,EAAE;AACtC,aAAa,aAAwB;"}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { useGlobalFilter } from "react-table";
|
|
2
2
|
const useHvGlobalFilter = useGlobalFilter.bind({});
|
|
3
3
|
useHvGlobalFilter.pluginName = "useHvGlobalFilter";
|
|
4
|
-
const useHvGlobalFilter$1 = useHvGlobalFilter;
|
|
5
4
|
export {
|
|
6
|
-
useHvGlobalFilter
|
|
5
|
+
useHvGlobalFilter as default
|
|
7
6
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useGlobalFilter.js","sources":["../../../../src/Table/hooks/useGlobalFilter.ts"],"sourcesContent":["import { Hooks, useGlobalFilter } from \"react-table\";\n\nexport type UseGlobalFilterProps = (<\n D extends object = Record<string, unknown>,\n>(\n hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useHvGlobalFilter = useGlobalFilter.bind({});\n(useHvGlobalFilter.pluginName as string) = \"useHvGlobalFilter\";\n\nexport default useHvGlobalFilter as UseGlobalFilterProps;\n"],"names":[],"mappings":";AAUA,MAAM,oBAAoB,gBAAgB,KAAK,
|
|
1
|
+
{"version":3,"file":"useGlobalFilter.js","sources":["../../../../src/Table/hooks/useGlobalFilter.ts"],"sourcesContent":["import { Hooks, useGlobalFilter } from \"react-table\";\n\nexport type UseGlobalFilterProps = (<\n D extends object = Record<string, unknown>,\n>(\n hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useHvGlobalFilter = useGlobalFilter.bind({});\n(useHvGlobalFilter.pluginName as string) = \"useHvGlobalFilter\";\n\nexport default useHvGlobalFilter as UseGlobalFilterProps;\n"],"names":[],"mappings":";AAUA,MAAM,oBAAoB,gBAAgB,KAAK,EAAE;AAChD,kBAAkB,aAAwB;"}
|
|
@@ -85,7 +85,6 @@ const useHeaderGroups = (hooks) => {
|
|
|
85
85
|
hooks.getCellProps.push(getCellPropsHook);
|
|
86
86
|
};
|
|
87
87
|
useHeaderGroups.pluginName = "useHvHeaderGroups";
|
|
88
|
-
const useHeaderGroups$1 = useHeaderGroups;
|
|
89
88
|
export {
|
|
90
|
-
useHeaderGroups
|
|
89
|
+
useHeaderGroups as default
|
|
91
90
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useHeaderGroups.js","sources":["../../../../src/Table/hooks/useHeaderGroups.ts"],"sourcesContent":["import { Hooks } from \"react-table\";\n\n// #region ##### TYPES #####\n\nexport interface UseHvHeaderGroupsInstance {\n hasGroupedColumns?: boolean;\n}\n\n// props target: <table><thead><tr><th>\nexport interface UseHvHeaderGroupsColumnProps {\n style?: React.CSSProperties;\n groupColumnMostLeft?: boolean;\n groupColumnMostRight?: boolean;\n}\n\n// props target: <table><tbody><tr><td>\nexport interface UseHvHeaderGroupsCellProps {\n groupColumnMostLeft?: boolean;\n groupColumnMostRight?: boolean;\n}\n\nexport type UseHvHeaderGroupsProps = (<\n D extends object = Record<string, unknown>,\n>(\n hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\n/**\n * Moving non grouped headers to the top level,\n * by placing them in the position of their top level placeholder.\n *\n * By default the header groups are built bottom top,\n * that results in non grouped headers to be placed\n * at the bottom row in the table head.\n *\n * @param {Array.<Object>} headerGroups - table header groups\n */\nconst replaceHeaderPlaceholders = (headerGroups: any) => {\n const [headerGroup] = headerGroups;\n\n const hasPlaceholderHeaders = headerGroup.headers.some(\n (h: any) => h.placeholderOf != null,\n );\n if (!hasPlaceholderHeaders) {\n return; // no placeholder header found to replace\n }\n\n const maxDepth = headerGroups.length - 1;\n const leafGroup = headerGroups[maxDepth];\n\n headerGroup.headers.forEach((header: any, position: any) => {\n const { placeholderOf } = header;\n\n const isPlaceholderHeader = placeholderOf != null;\n if (isPlaceholderHeader) {\n // is placeholder header\n const leafIndex =\n leafGroup.headers\n .slice(position)\n .findIndex(({ id }: any) => id === placeholderOf.id) + position;\n\n // store leaf placeholder header\n header.variant = placeholderOf.variant;\n header.depth = maxDepth;\n leafGroup.headers[leafIndex] = header;\n\n // replace placeholder with leaf header\n placeholderOf.rowSpan = maxDepth + 1;\n headerGroup.headers[position] = placeholderOf;\n }\n });\n};\n\nconst getCellProps = (column: any, isHeaderCell = false) => ({\n groupColumnMostLeft: column.isGroupLeftColumn,\n groupColumnMostRight: column.isGroupRightColumn,\n rowSpan: isHeaderCell && column.rowSpan != null ? column.rowSpan : 1,\n});\n\n// props target: <table><thead><tr><th>\nconst getHeaderPropsHook = (props: any, { instance, column }: any) => {\n const nextProps: UseHvHeaderGroupsColumnProps = instance.hasGroupedColumns\n ? getCellProps(column, true)\n : {};\n\n if (instance.hasGroupedColumns) {\n const isPlaceholder = column.placeholderOf != null;\n\n nextProps.style = {\n display: isPlaceholder ? \"none\" : props.style?.display,\n };\n\n if (instance.hasStickyColumns) {\n if (isPlaceholder) {\n nextProps.style.display = \"inline-flex\";\n nextProps.style.visibility = \"hidden\";\n }\n\n if (column.parent || isPlaceholder) {\n nextProps.style.marginTop = `calc(var(--cell-height) * -1)`;\n }\n\n if (column.rowSpan > 1) {\n // rowSpan doesn't work with flex, so we need to simulate it by adjusting the height value manually\n nextProps.style.height = `calc(var(--first-row-cell-height) + var(--cell-height) * ${\n column.rowSpan - 1\n })`;\n }\n }\n }\n\n return [props, nextProps];\n};\n\n// props target: <table><tbody><tr><td>\nconst getCellPropsHook = (props: any, { instance, cell }: any) => {\n const nextProps: UseHvHeaderGroupsCellProps = instance.hasGroupedColumns\n ? getCellProps(cell.column)\n : {};\n\n return [props, nextProps];\n};\n\nconst visibleColumnsHook = (visibleColumns: any, { instance }: any) => {\n const parentList = new Set();\n\n visibleColumns.forEach(({ parent }: { parent: any }) => {\n if (parent != null && !parentList.has(parent)) {\n parentList.add(parent);\n }\n });\n\n const hasGroupedColumns = parentList.size > 0;\n if (hasGroupedColumns) {\n parentList.forEach((parent: any) => {\n parent.align = \"center\";\n parent.isGroupLeftColumn = true;\n parent.isGroupRightColumn = true;\n\n const { columns } = parent;\n columns[0].isGroupLeftColumn = true;\n columns[columns.length - 1].isGroupRightColumn = true;\n });\n }\n\n Object.assign(instance, { hasGroupedColumns });\n\n return visibleColumns;\n};\n\nconst useInstanceHook = (instance: any) => {\n if (instance.hasGroupedColumns) {\n replaceHeaderPlaceholders(instance.headerGroups);\n }\n};\n\nconst useHeaderGroups: UseHvHeaderGroupsProps = (hooks) => {\n hooks.visibleColumns.push(visibleColumnsHook);\n hooks.useInstance.push(useInstanceHook);\n\n // props target: <table><thead><tr><th>\n hooks.getHeaderProps.push(getHeaderPropsHook);\n // props target: <table><tbody><tr><td>\n hooks.getCellProps.push(getCellPropsHook);\n};\n\nuseHeaderGroups.pluginName = \"useHvHeaderGroups\";\n\nexport default useHeaderGroups;\n"],"names":[],"mappings":"AAuCA,MAAM,4BAA4B,CAAC,iBAAsB;AACjD,QAAA,CAAC,WAAW,IAAI;AAEhB,QAAA,wBAAwB,YAAY,QAAQ;AAAA,IAChD,CAAC,MAAW,EAAE,iBAAiB;AAAA,EAAA;AAEjC,MAAI,CAAC,uBAAuB;AAC1B;AAAA,EACF;AAEM,QAAA,WAAW,aAAa,SAAS;AACjC,QAAA,YAAY,aAAa,QAAQ;AAEvC,cAAY,QAAQ,QAAQ,CAAC,QAAa,aAAkB;AACpD,UAAA,EAAE,cAAkB,IAAA;AAE1B,UAAM,sBAAsB,iBAAiB;AAC7C,QAAI,qBAAqB;AAEvB,YAAM,YACJ,UAAU,QACP,MAAM,QAAQ,EACd,UAAU,CAAC,EAAE,GAAG,MAAW,OAAO,cAAc,EAAE,IAAI;AAG3D,aAAO,UAAU,cAAc;AAC/B,aAAO,QAAQ;AACL,gBAAA,QAAQ,SAAS,IAAI;AAG/B,oBAAc,UAAU,WAAW;AACvB,kBAAA,QAAQ,QAAQ,IAAI;AAAA,IAClC;AAAA,EAAA,CACD;AACH;AAEA,MAAM,eAAe,CAAC,QAAa,eAAe,WAAW;AAAA,EAC3D,qBAAqB,OAAO;AAAA,EAC5B,sBAAsB,OAAO;AAAA,EAC7B,SAAS,gBAAgB,OAAO,WAAW,OAAO,OAAO,UAAU;AACrE;AAGA,MAAM,qBAAqB,CAAC,OAAY,EAAE,UAAU,aAAkB;AACpE,QAAM,YAA0C,SAAS,oBACrD,aAAa,QAAQ,IAAI,IACzB;AAEJ,MAAI,SAAS,mBAAmB;AACxB,UAAA,gBAAgB,OAAO,iBAAiB;AAE9C,cAAU,QAAQ;AAAA,MAChB,SAAS,gBAAgB,SAAS,MAAM,OAAO;AAAA,IAAA;AAGjD,QAAI,SAAS,kBAAkB;AAC7B,UAAI,eAAe;AACjB,kBAAU,MAAM,UAAU;AAC1B,kBAAU,MAAM,aAAa;AAAA,MAC/B;AAEI,UAAA,OAAO,UAAU,eAAe;AAClC,kBAAU,MAAM,YAAY;AAAA,MAC9B;AAEI,UAAA,OAAO,UAAU,GAAG;AAEtB,kBAAU,MAAM,SAAS,4DACvB,OAAO,UAAU,CACnB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEO,SAAA,CAAC,OAAO,SAAS;AAC1B;AAGA,MAAM,mBAAmB,CAAC,OAAY,EAAE,UAAU,WAAgB;AAChE,QAAM,YAAwC,SAAS,oBACnD,aAAa,KAAK,MAAM,IACxB;AAEG,SAAA,CAAC,OAAO,SAAS;AAC1B;AAEA,MAAM,qBAAqB,CAAC,gBAAqB,EAAE,eAAoB;AAC/D,QAAA,iCAAiB;AAEvB,iBAAe,QAAQ,CAAC,EAAE,aAA8B;AACtD,QAAI,UAAU,QAAQ,CAAC,WAAW,IAAI,MAAM,GAAG;AAC7C,iBAAW,IAAI,MAAM;AAAA,IACvB;AAAA,EAAA,CACD;AAEK,QAAA,oBAAoB,WAAW,OAAO;AAC5C,MAAI,mBAAmB;AACV,eAAA,QAAQ,CAAC,WAAgB;AAClC,aAAO,QAAQ;AACf,aAAO,oBAAoB;AAC3B,aAAO,qBAAqB;AAEtB,YAAA,EAAE,QAAY,IAAA;AACZ,cAAA,CAAC,EAAE,oBAAoB;AAC/B,cAAQ,QAAQ,SAAS,CAAC,EAAE,qBAAqB;AAAA,IAAA,CAClD;AAAA,EACH;AAEA,SAAO,OAAO,UAAU,EAAE,kBAAmB,CAAA;AAEtC,SAAA;AACT;AAEA,MAAM,kBAAkB,CAAC,aAAkB;AACzC,MAAI,SAAS,mBAAmB;AAC9B,8BAA0B,SAAS,YAAY;AAAA,EACjD;AACF;
|
|
1
|
+
{"version":3,"file":"useHeaderGroups.js","sources":["../../../../src/Table/hooks/useHeaderGroups.ts"],"sourcesContent":["import { Hooks } from \"react-table\";\n\n// #region ##### TYPES #####\n\nexport interface UseHvHeaderGroupsInstance {\n hasGroupedColumns?: boolean;\n}\n\n// props target: <table><thead><tr><th>\nexport interface UseHvHeaderGroupsColumnProps {\n style?: React.CSSProperties;\n groupColumnMostLeft?: boolean;\n groupColumnMostRight?: boolean;\n}\n\n// props target: <table><tbody><tr><td>\nexport interface UseHvHeaderGroupsCellProps {\n groupColumnMostLeft?: boolean;\n groupColumnMostRight?: boolean;\n}\n\nexport type UseHvHeaderGroupsProps = (<\n D extends object = Record<string, unknown>,\n>(\n hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\n/**\n * Moving non grouped headers to the top level,\n * by placing them in the position of their top level placeholder.\n *\n * By default the header groups are built bottom top,\n * that results in non grouped headers to be placed\n * at the bottom row in the table head.\n *\n * @param {Array.<Object>} headerGroups - table header groups\n */\nconst replaceHeaderPlaceholders = (headerGroups: any) => {\n const [headerGroup] = headerGroups;\n\n const hasPlaceholderHeaders = headerGroup.headers.some(\n (h: any) => h.placeholderOf != null,\n );\n if (!hasPlaceholderHeaders) {\n return; // no placeholder header found to replace\n }\n\n const maxDepth = headerGroups.length - 1;\n const leafGroup = headerGroups[maxDepth];\n\n headerGroup.headers.forEach((header: any, position: any) => {\n const { placeholderOf } = header;\n\n const isPlaceholderHeader = placeholderOf != null;\n if (isPlaceholderHeader) {\n // is placeholder header\n const leafIndex =\n leafGroup.headers\n .slice(position)\n .findIndex(({ id }: any) => id === placeholderOf.id) + position;\n\n // store leaf placeholder header\n header.variant = placeholderOf.variant;\n header.depth = maxDepth;\n leafGroup.headers[leafIndex] = header;\n\n // replace placeholder with leaf header\n placeholderOf.rowSpan = maxDepth + 1;\n headerGroup.headers[position] = placeholderOf;\n }\n });\n};\n\nconst getCellProps = (column: any, isHeaderCell = false) => ({\n groupColumnMostLeft: column.isGroupLeftColumn,\n groupColumnMostRight: column.isGroupRightColumn,\n rowSpan: isHeaderCell && column.rowSpan != null ? column.rowSpan : 1,\n});\n\n// props target: <table><thead><tr><th>\nconst getHeaderPropsHook = (props: any, { instance, column }: any) => {\n const nextProps: UseHvHeaderGroupsColumnProps = instance.hasGroupedColumns\n ? getCellProps(column, true)\n : {};\n\n if (instance.hasGroupedColumns) {\n const isPlaceholder = column.placeholderOf != null;\n\n nextProps.style = {\n display: isPlaceholder ? \"none\" : props.style?.display,\n };\n\n if (instance.hasStickyColumns) {\n if (isPlaceholder) {\n nextProps.style.display = \"inline-flex\";\n nextProps.style.visibility = \"hidden\";\n }\n\n if (column.parent || isPlaceholder) {\n nextProps.style.marginTop = `calc(var(--cell-height) * -1)`;\n }\n\n if (column.rowSpan > 1) {\n // rowSpan doesn't work with flex, so we need to simulate it by adjusting the height value manually\n nextProps.style.height = `calc(var(--first-row-cell-height) + var(--cell-height) * ${\n column.rowSpan - 1\n })`;\n }\n }\n }\n\n return [props, nextProps];\n};\n\n// props target: <table><tbody><tr><td>\nconst getCellPropsHook = (props: any, { instance, cell }: any) => {\n const nextProps: UseHvHeaderGroupsCellProps = instance.hasGroupedColumns\n ? getCellProps(cell.column)\n : {};\n\n return [props, nextProps];\n};\n\nconst visibleColumnsHook = (visibleColumns: any, { instance }: any) => {\n const parentList = new Set();\n\n visibleColumns.forEach(({ parent }: { parent: any }) => {\n if (parent != null && !parentList.has(parent)) {\n parentList.add(parent);\n }\n });\n\n const hasGroupedColumns = parentList.size > 0;\n if (hasGroupedColumns) {\n parentList.forEach((parent: any) => {\n parent.align = \"center\";\n parent.isGroupLeftColumn = true;\n parent.isGroupRightColumn = true;\n\n const { columns } = parent;\n columns[0].isGroupLeftColumn = true;\n columns[columns.length - 1].isGroupRightColumn = true;\n });\n }\n\n Object.assign(instance, { hasGroupedColumns });\n\n return visibleColumns;\n};\n\nconst useInstanceHook = (instance: any) => {\n if (instance.hasGroupedColumns) {\n replaceHeaderPlaceholders(instance.headerGroups);\n }\n};\n\nconst useHeaderGroups: UseHvHeaderGroupsProps = (hooks) => {\n hooks.visibleColumns.push(visibleColumnsHook);\n hooks.useInstance.push(useInstanceHook);\n\n // props target: <table><thead><tr><th>\n hooks.getHeaderProps.push(getHeaderPropsHook);\n // props target: <table><tbody><tr><td>\n hooks.getCellProps.push(getCellPropsHook);\n};\n\nuseHeaderGroups.pluginName = \"useHvHeaderGroups\";\n\nexport default useHeaderGroups;\n"],"names":[],"mappings":"AAuCA,MAAM,4BAA4B,CAAC,iBAAsB;AACjD,QAAA,CAAC,WAAW,IAAI;AAEhB,QAAA,wBAAwB,YAAY,QAAQ;AAAA,IAChD,CAAC,MAAW,EAAE,iBAAiB;AAAA,EAAA;AAEjC,MAAI,CAAC,uBAAuB;AAC1B;AAAA,EACF;AAEM,QAAA,WAAW,aAAa,SAAS;AACjC,QAAA,YAAY,aAAa,QAAQ;AAEvC,cAAY,QAAQ,QAAQ,CAAC,QAAa,aAAkB;AACpD,UAAA,EAAE,cAAkB,IAAA;AAE1B,UAAM,sBAAsB,iBAAiB;AAC7C,QAAI,qBAAqB;AAEvB,YAAM,YACJ,UAAU,QACP,MAAM,QAAQ,EACd,UAAU,CAAC,EAAE,GAAG,MAAW,OAAO,cAAc,EAAE,IAAI;AAG3D,aAAO,UAAU,cAAc;AAC/B,aAAO,QAAQ;AACL,gBAAA,QAAQ,SAAS,IAAI;AAG/B,oBAAc,UAAU,WAAW;AACvB,kBAAA,QAAQ,QAAQ,IAAI;AAAA,IAClC;AAAA,EAAA,CACD;AACH;AAEA,MAAM,eAAe,CAAC,QAAa,eAAe,WAAW;AAAA,EAC3D,qBAAqB,OAAO;AAAA,EAC5B,sBAAsB,OAAO;AAAA,EAC7B,SAAS,gBAAgB,OAAO,WAAW,OAAO,OAAO,UAAU;AACrE;AAGA,MAAM,qBAAqB,CAAC,OAAY,EAAE,UAAU,aAAkB;AACpE,QAAM,YAA0C,SAAS,oBACrD,aAAa,QAAQ,IAAI,IACzB;AAEJ,MAAI,SAAS,mBAAmB;AACxB,UAAA,gBAAgB,OAAO,iBAAiB;AAE9C,cAAU,QAAQ;AAAA,MAChB,SAAS,gBAAgB,SAAS,MAAM,OAAO;AAAA,IAAA;AAGjD,QAAI,SAAS,kBAAkB;AAC7B,UAAI,eAAe;AACjB,kBAAU,MAAM,UAAU;AAC1B,kBAAU,MAAM,aAAa;AAAA,MAC/B;AAEI,UAAA,OAAO,UAAU,eAAe;AAClC,kBAAU,MAAM,YAAY;AAAA,MAC9B;AAEI,UAAA,OAAO,UAAU,GAAG;AAEtB,kBAAU,MAAM,SAAS,4DACvB,OAAO,UAAU,CACnB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEO,SAAA,CAAC,OAAO,SAAS;AAC1B;AAGA,MAAM,mBAAmB,CAAC,OAAY,EAAE,UAAU,WAAgB;AAChE,QAAM,YAAwC,SAAS,oBACnD,aAAa,KAAK,MAAM,IACxB;AAEG,SAAA,CAAC,OAAO,SAAS;AAC1B;AAEA,MAAM,qBAAqB,CAAC,gBAAqB,EAAE,eAAoB;AAC/D,QAAA,iCAAiB;AAEvB,iBAAe,QAAQ,CAAC,EAAE,aAA8B;AACtD,QAAI,UAAU,QAAQ,CAAC,WAAW,IAAI,MAAM,GAAG;AAC7C,iBAAW,IAAI,MAAM;AAAA,IACvB;AAAA,EAAA,CACD;AAEK,QAAA,oBAAoB,WAAW,OAAO;AAC5C,MAAI,mBAAmB;AACV,eAAA,QAAQ,CAAC,WAAgB;AAClC,aAAO,QAAQ;AACf,aAAO,oBAAoB;AAC3B,aAAO,qBAAqB;AAEtB,YAAA,EAAE,QAAY,IAAA;AACZ,cAAA,CAAC,EAAE,oBAAoB;AAC/B,cAAQ,QAAQ,SAAS,CAAC,EAAE,qBAAqB;AAAA,IAAA,CAClD;AAAA,EACH;AAEA,SAAO,OAAO,UAAU,EAAE,kBAAmB,CAAA;AAEtC,SAAA;AACT;AAEA,MAAM,kBAAkB,CAAC,aAAkB;AACzC,MAAI,SAAS,mBAAmB;AAC9B,8BAA0B,SAAS,YAAY;AAAA,EACjD;AACF;AAEM,MAAA,kBAA0C,CAAC,UAAU;AACnD,QAAA,eAAe,KAAK,kBAAkB;AACtC,QAAA,YAAY,KAAK,eAAe;AAGhC,QAAA,eAAe,KAAK,kBAAkB;AAEtC,QAAA,aAAa,KAAK,gBAAgB;AAC1C;AAEA,gBAAgB,aAAa;"}
|
|
@@ -50,8 +50,7 @@ const usePagination = (hooks) => {
|
|
|
50
50
|
hooks.useInstance.push(useInstanceHook);
|
|
51
51
|
};
|
|
52
52
|
usePagination.pluginName = "useHvPagination";
|
|
53
|
-
const usePagination$1 = usePagination;
|
|
54
53
|
export {
|
|
55
|
-
usePagination
|
|
54
|
+
usePagination as default,
|
|
56
55
|
defaultGetHvPaginationProps
|
|
57
56
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePagination.js","sources":["../../../../src/Table/hooks/usePagination.ts"],"sourcesContent":["import {\n ensurePluginOrder,\n Hooks,\n makePropGetter,\n PropGetter,\n TableCommonProps,\n useGetLatest,\n} from \"react-table\";\n\n// #region ##### TYPES #####\n\nexport interface HvTablePaginationProps extends TableCommonProps {\n canPrevious: boolean;\n canNext: boolean;\n pages: number;\n page: number;\n pageSize: number;\n onPageChange?: (updater: ((pageIndex: number) => number) | number) => void;\n onPageSizeChange?: (pageSize: number) => void;\n labels?: Record<string, string>;\n}\n\nexport type HvPaginationPropGetter<D extends object> = PropGetter<\n D,\n HvTablePaginationProps\n>;\n\nexport interface UseHvPaginationHooks<D extends object> {\n getHvPaginationProps: Array<HvPaginationPropGetter<D>>;\n}\n\nexport interface UseHvPaginationTableInstance<D extends object> {\n getHvPaginationProps: (\n propGetter?: HvPaginationPropGetter<D>,\n ) => HvTablePaginationProps;\n}\n\nexport type UsePaginationProps = (<D extends object = Record<string, unknown>>(\n hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useInstanceHook = (instance: any) => {\n ensurePluginOrder(\n instance.plugins,\n [\n \"usePagination\",\n \"useHvGlobalFilter\",\n \"useHvFilters\",\n \"useGroupBy\",\n \"useHvSortBy\",\n \"useHvRowExpand\",\n ],\n \"useHvPagination\",\n );\n\n const getInstance = useGetLatest(instance);\n const getHvPaginationProps = makePropGetter(\n instance.getHooks().getHvPaginationProps,\n {\n instance: getInstance(),\n },\n );\n\n Object.assign(instance, {\n getHvPaginationProps,\n });\n};\n\nexport const defaultGetHvPaginationProps = (props: any, { instance }: any) => {\n const {\n canPreviousPage,\n canNextPage,\n pageOptions,\n gotoPage,\n setPageSize,\n state: { pageSize, pageIndex },\n labels,\n } = instance;\n\n const nextProps: HvTablePaginationProps = {\n canPrevious: canPreviousPage,\n canNext: canNextPage,\n pages: pageOptions.length,\n page: pageIndex,\n pageSize,\n onPageChange: gotoPage,\n onPageSizeChange: setPageSize,\n labels,\n };\n\n return [props, nextProps];\n};\n\nconst usePagination: UsePaginationProps = (hooks) => {\n hooks.getHvPaginationProps = [defaultGetHvPaginationProps];\n\n hooks.useInstance.push(useInstanceHook);\n};\n\nusePagination.pluginName = \"useHvPagination\";\n\nexport default usePagination;\n"],"names":[],"mappings":";AA2CA,MAAM,kBAAkB,CAAC,aAAkB;AACzC;AAAA,IACE,SAAS;AAAA,IACT;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,EAAA;AAGI,QAAA,cAAc,aAAa,QAAQ;AACzC,QAAM,uBAAuB;AAAA,IAC3B,SAAS,WAAW;AAAA,IACpB;AAAA,MACE,UAAU,YAAY;AAAA,IACxB;AAAA,EAAA;AAGF,SAAO,OAAO,UAAU;AAAA,IACtB;AAAA,EAAA,CACD;AACH;AAEO,MAAM,8BAA8B,CAAC,OAAY,EAAE,eAAoB;AACtE,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,EAAE,UAAU,UAAU;AAAA,IAC7B;AAAA,EACE,IAAA;AAEJ,QAAM,YAAoC;AAAA,IACxC,aAAa;AAAA,IACb,SAAS;AAAA,IACT,OAAO,YAAY;AAAA,IACnB,MAAM;AAAA,IACN;AAAA,IACA,cAAc;AAAA,IACd,kBAAkB;AAAA,IAClB;AAAA,EAAA;AAGK,SAAA,CAAC,OAAO,SAAS;AAC1B;
|
|
1
|
+
{"version":3,"file":"usePagination.js","sources":["../../../../src/Table/hooks/usePagination.ts"],"sourcesContent":["import {\n ensurePluginOrder,\n Hooks,\n makePropGetter,\n PropGetter,\n TableCommonProps,\n useGetLatest,\n} from \"react-table\";\n\n// #region ##### TYPES #####\n\nexport interface HvTablePaginationProps extends TableCommonProps {\n canPrevious: boolean;\n canNext: boolean;\n pages: number;\n page: number;\n pageSize: number;\n onPageChange?: (updater: ((pageIndex: number) => number) | number) => void;\n onPageSizeChange?: (pageSize: number) => void;\n labels?: Record<string, string>;\n}\n\nexport type HvPaginationPropGetter<D extends object> = PropGetter<\n D,\n HvTablePaginationProps\n>;\n\nexport interface UseHvPaginationHooks<D extends object> {\n getHvPaginationProps: Array<HvPaginationPropGetter<D>>;\n}\n\nexport interface UseHvPaginationTableInstance<D extends object> {\n getHvPaginationProps: (\n propGetter?: HvPaginationPropGetter<D>,\n ) => HvTablePaginationProps;\n}\n\nexport type UsePaginationProps = (<D extends object = Record<string, unknown>>(\n hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useInstanceHook = (instance: any) => {\n ensurePluginOrder(\n instance.plugins,\n [\n \"usePagination\",\n \"useHvGlobalFilter\",\n \"useHvFilters\",\n \"useGroupBy\",\n \"useHvSortBy\",\n \"useHvRowExpand\",\n ],\n \"useHvPagination\",\n );\n\n const getInstance = useGetLatest(instance);\n const getHvPaginationProps = makePropGetter(\n instance.getHooks().getHvPaginationProps,\n {\n instance: getInstance(),\n },\n );\n\n Object.assign(instance, {\n getHvPaginationProps,\n });\n};\n\nexport const defaultGetHvPaginationProps = (props: any, { instance }: any) => {\n const {\n canPreviousPage,\n canNextPage,\n pageOptions,\n gotoPage,\n setPageSize,\n state: { pageSize, pageIndex },\n labels,\n } = instance;\n\n const nextProps: HvTablePaginationProps = {\n canPrevious: canPreviousPage,\n canNext: canNextPage,\n pages: pageOptions.length,\n page: pageIndex,\n pageSize,\n onPageChange: gotoPage,\n onPageSizeChange: setPageSize,\n labels,\n };\n\n return [props, nextProps];\n};\n\nconst usePagination: UsePaginationProps = (hooks) => {\n hooks.getHvPaginationProps = [defaultGetHvPaginationProps];\n\n hooks.useInstance.push(useInstanceHook);\n};\n\nusePagination.pluginName = \"useHvPagination\";\n\nexport default usePagination;\n"],"names":[],"mappings":";AA2CA,MAAM,kBAAkB,CAAC,aAAkB;AACzC;AAAA,IACE,SAAS;AAAA,IACT;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,EAAA;AAGI,QAAA,cAAc,aAAa,QAAQ;AACzC,QAAM,uBAAuB;AAAA,IAC3B,SAAS,WAAW;AAAA,IACpB;AAAA,MACE,UAAU,YAAY;AAAA,IACxB;AAAA,EAAA;AAGF,SAAO,OAAO,UAAU;AAAA,IACtB;AAAA,EAAA,CACD;AACH;AAEO,MAAM,8BAA8B,CAAC,OAAY,EAAE,eAAoB;AACtE,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,EAAE,UAAU,UAAU;AAAA,IAC7B;AAAA,EACE,IAAA;AAEJ,QAAM,YAAoC;AAAA,IACxC,aAAa;AAAA,IACb,SAAS;AAAA,IACT,OAAO,YAAY;AAAA,IACnB,MAAM;AAAA,IACN;AAAA,IACA,cAAc;AAAA,IACd,kBAAkB;AAAA,IAClB;AAAA,EAAA;AAGK,SAAA,CAAC,OAAO,SAAS;AAC1B;AAEM,MAAA,gBAAoC,CAAC,UAAU;AAC7C,QAAA,uBAAuB,CAAC,2BAA2B;AAEnD,QAAA,YAAY,KAAK,eAAe;AACxC;AAEA,cAAc,aAAa;"}
|
|
@@ -32,7 +32,6 @@ const useResizeColumns = (hooks) => {
|
|
|
32
32
|
hooks.useInstance.push(useInstanceHook);
|
|
33
33
|
};
|
|
34
34
|
useResizeColumns.pluginName = "useHvResizeColumns";
|
|
35
|
-
const useResizeColumns$1 = useResizeColumns;
|
|
36
35
|
export {
|
|
37
|
-
useResizeColumns
|
|
36
|
+
useResizeColumns as default
|
|
38
37
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useResizeColumns.js","sources":["../../../../src/Table/hooks/useResizeColumns.ts"],"sourcesContent":["import { ensurePluginOrder, Hooks } from \"react-table\";\n\n// #region ##### TYPES #####\n\n// getHeaderProps:\nexport interface UseHvResizeColumnProps {\n resizable?: boolean;\n resizing?: boolean;\n resizerProps?: React.HTMLAttributes<HTMLDivElement>;\n}\n\n// getCellProps:\nexport interface UseHvResizeTableCellProps {\n resizable?: boolean;\n resizing?: boolean;\n}\n\nexport type UseHvResizeColumnsProps = (<\n D extends object = Record<string, unknown>,\n>(\n hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\n// props target: <table><thead><tr><th>\nconst getHeaderPropsHook = (props: any, { column }: any) => {\n const resizerProps: NonNullable<UseHvResizeColumnProps[\"resizerProps\"]> =\n column.getResizerProps?.() || {};\n\n resizerProps.onClick = (e) => {\n e.preventDefault();\n e.stopPropagation();\n };\n\n const nextProps = {\n resizable: column.canResize,\n resizing: column.isResizing,\n resizerProps,\n };\n\n return [props, nextProps];\n};\n\n// props target: <table><tbody><tr><td>\nconst getCellPropsHook = (props: any, { cell }: any) => {\n const nextProps: UseHvResizeTableCellProps = {\n resizable: cell.column.canResize,\n resizing: cell.column.isResizing,\n };\n\n return [props, nextProps];\n};\n\nconst useInstanceHook = (instance: any) => {\n ensurePluginOrder(\n instance.plugins,\n [\"useResizeColumns\"],\n \"useHvResizeColumns\",\n );\n};\n\nconst useResizeColumns: UseHvResizeColumnsProps = (hooks) => {\n // props target: <table><thead><tr><th>\n hooks.getHeaderProps.push(getHeaderPropsHook);\n // props target: <table><tbody><tr><td>\n hooks.getCellProps.push(getCellPropsHook);\n\n hooks.useInstance.push(useInstanceHook);\n};\n\nuseResizeColumns.pluginName = \"useHvResizeColumns\";\n\nexport default useResizeColumns;\n"],"names":[],"mappings":";AA0BA,MAAM,qBAAqB,CAAC,OAAY,EAAE,aAAkB;AAC1D,QAAM,eACJ,OAAO,kBAAkB,KAAK,CAAA;AAEnB,eAAA,UAAU,CAAC,MAAM;AAC5B,MAAE,eAAe;AACjB,MAAE,gBAAgB;AAAA,EAAA;AAGpB,QAAM,YAAY;AAAA,IAChB,WAAW,OAAO;AAAA,IAClB,UAAU,OAAO;AAAA,IACjB;AAAA,EAAA;AAGK,SAAA,CAAC,OAAO,SAAS;AAC1B;AAGA,MAAM,mBAAmB,CAAC,OAAY,EAAE,WAAgB;AACtD,QAAM,YAAuC;AAAA,IAC3C,WAAW,KAAK,OAAO;AAAA,IACvB,UAAU,KAAK,OAAO;AAAA,EAAA;AAGjB,SAAA,CAAC,OAAO,SAAS;AAC1B;AAEA,MAAM,kBAAkB,CAAC,aAAkB;AACzC;AAAA,IACE,SAAS;AAAA,IACT,CAAC,kBAAkB;AAAA,IACnB;AAAA,EAAA;AAEJ;
|
|
1
|
+
{"version":3,"file":"useResizeColumns.js","sources":["../../../../src/Table/hooks/useResizeColumns.ts"],"sourcesContent":["import { ensurePluginOrder, Hooks } from \"react-table\";\n\n// #region ##### TYPES #####\n\n// getHeaderProps:\nexport interface UseHvResizeColumnProps {\n resizable?: boolean;\n resizing?: boolean;\n resizerProps?: React.HTMLAttributes<HTMLDivElement>;\n}\n\n// getCellProps:\nexport interface UseHvResizeTableCellProps {\n resizable?: boolean;\n resizing?: boolean;\n}\n\nexport type UseHvResizeColumnsProps = (<\n D extends object = Record<string, unknown>,\n>(\n hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\n// props target: <table><thead><tr><th>\nconst getHeaderPropsHook = (props: any, { column }: any) => {\n const resizerProps: NonNullable<UseHvResizeColumnProps[\"resizerProps\"]> =\n column.getResizerProps?.() || {};\n\n resizerProps.onClick = (e) => {\n e.preventDefault();\n e.stopPropagation();\n };\n\n const nextProps = {\n resizable: column.canResize,\n resizing: column.isResizing,\n resizerProps,\n };\n\n return [props, nextProps];\n};\n\n// props target: <table><tbody><tr><td>\nconst getCellPropsHook = (props: any, { cell }: any) => {\n const nextProps: UseHvResizeTableCellProps = {\n resizable: cell.column.canResize,\n resizing: cell.column.isResizing,\n };\n\n return [props, nextProps];\n};\n\nconst useInstanceHook = (instance: any) => {\n ensurePluginOrder(\n instance.plugins,\n [\"useResizeColumns\"],\n \"useHvResizeColumns\",\n );\n};\n\nconst useResizeColumns: UseHvResizeColumnsProps = (hooks) => {\n // props target: <table><thead><tr><th>\n hooks.getHeaderProps.push(getHeaderPropsHook);\n // props target: <table><tbody><tr><td>\n hooks.getCellProps.push(getCellPropsHook);\n\n hooks.useInstance.push(useInstanceHook);\n};\n\nuseResizeColumns.pluginName = \"useHvResizeColumns\";\n\nexport default useResizeColumns;\n"],"names":[],"mappings":";AA0BA,MAAM,qBAAqB,CAAC,OAAY,EAAE,aAAkB;AAC1D,QAAM,eACJ,OAAO,kBAAkB,KAAK,CAAA;AAEnB,eAAA,UAAU,CAAC,MAAM;AAC5B,MAAE,eAAe;AACjB,MAAE,gBAAgB;AAAA,EAAA;AAGpB,QAAM,YAAY;AAAA,IAChB,WAAW,OAAO;AAAA,IAClB,UAAU,OAAO;AAAA,IACjB;AAAA,EAAA;AAGK,SAAA,CAAC,OAAO,SAAS;AAC1B;AAGA,MAAM,mBAAmB,CAAC,OAAY,EAAE,WAAgB;AACtD,QAAM,YAAuC;AAAA,IAC3C,WAAW,KAAK,OAAO;AAAA,IACvB,UAAU,KAAK,OAAO;AAAA,EAAA;AAGjB,SAAA,CAAC,OAAO,SAAS;AAC1B;AAEA,MAAM,kBAAkB,CAAC,aAAkB;AACzC;AAAA,IACE,SAAS;AAAA,IACT,CAAC,kBAAkB;AAAA,IACnB;AAAA,EAAA;AAEJ;AAEM,MAAA,mBAA4C,CAAC,UAAU;AAErD,QAAA,eAAe,KAAK,kBAAkB;AAEtC,QAAA,aAAa,KAAK,gBAAgB;AAElC,QAAA,YAAY,KAAK,eAAe;AACxC;AAEA,iBAAiB,aAAa;"}
|
|
@@ -71,8 +71,7 @@ const useRowExpand = (hooks) => {
|
|
|
71
71
|
hooks.getRowProps.push(getRowPropsHook);
|
|
72
72
|
};
|
|
73
73
|
useRowExpand.pluginName = "useHvRowExpand";
|
|
74
|
-
const useRowExpand$1 = useRowExpand;
|
|
75
74
|
export {
|
|
76
75
|
CellWithExpandButton,
|
|
77
|
-
useRowExpand
|
|
76
|
+
useRowExpand as default
|
|
78
77
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useRowExpand.js","sources":["../../../../src/Table/hooks/useRowExpand.tsx"],"sourcesContent":["import {\n Hooks,\n TableExpandedToggleProps,\n UseExpandedRowProps,\n} from \"react-table\";\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvButton } from \"../../Button\";\nimport { useLabels } from \"../../hooks/useLabels\";\nimport { HvTypography } from \"../../Typography\";\n\n// #region ##### TYPES #####\n\nexport interface UseHvRowExpandTableRowProps {\n expanded?: boolean;\n}\n\nexport type UseHvRowExpandTableOptions = {\n disableCreateExpandButton?: boolean;\n};\n\nexport interface UseHvRowExpandRowToggleProps extends TableExpandedToggleProps {\n onClick?: React.MouseEventHandler<unknown>;\n}\n\nexport interface UseHvRowExpandRowInstance<\n D extends object = Record<string, unknown>,\n> extends UseExpandedRowProps<D> {\n getToggleRowExpandedProps: (\n props?: Partial<TableExpandedToggleProps>,\n ) => UseHvRowExpandRowToggleProps;\n}\n\nexport type UseRowExpandProps = (<D extends object = Record<string, unknown>>(\n hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst DEFAULT_LABELS = {\n expandRowButtonAriaLabel: \"Expand this row\",\n collapseRowButtonAriaLabel: \"Collapse this row\",\n};\n\nexport const CellWithExpandButton = ({\n row,\n cell,\n labels: labelsProp,\n}: any) => {\n const labels = useLabels(DEFAULT_LABELS, labelsProp);\n\n const { onClick } = row.getToggleRowExpandedProps();\n\n return (\n <>\n <HvButton\n icon\n aria-label={\n row.isExpanded\n ? labels.collapseRowButtonAriaLabel\n : labels.expandRowButtonAriaLabel\n }\n aria-expanded={row.isExpanded}\n onClick={onClick}\n >\n {row.isExpanded ? <DropDownXS /> : <DropUpXS />}\n </HvButton>\n {cell?.value && (\n <HvTypography variant=\"label\" component=\"span\">\n {cell.value}\n </HvTypography>\n )}\n </>\n );\n};\n\nconst visibleColumnsHook = (columns: any, { instance }: any) => {\n if (instance.disableCreateExpandButton) {\n return columns;\n }\n\n // add a button to first data column, unless it has a custom renderer\n // if so, add an extra column instead\n const firstDataColumnIndex = columns.findIndex(\n (c: any) => c.id?.indexOf(\"_hv_\") !== 0,\n );\n\n if (firstDataColumnIndex !== -1) {\n const firstDataColumn = columns[firstDataColumnIndex];\n\n if (firstDataColumn.Cell == null) {\n firstDataColumn.Cell = CellWithExpandButton;\n firstDataColumn.variant = \"expand\";\n\n return columns;\n }\n }\n\n const expandColumn = {\n id: \"_hv_expand\",\n variant: \"none\",\n\n width: 32,\n\n // this will only work when using useHvTableSticky\n // but ensures it stays left of any sticky column\n sticky: \"left\",\n\n Cell: CellWithExpandButton,\n };\n\n const columnsCopy = [...columns];\n columnsCopy.splice(\n firstDataColumnIndex !== -1 ? firstDataColumnIndex : 0,\n 0,\n expandColumn,\n );\n\n return columnsCopy;\n};\n\nconst getRowPropsHook = (props: any, { row }: any) => {\n const nextProps: UseHvRowExpandTableRowProps = {\n expanded: row.isExpanded,\n };\n\n return [props, nextProps];\n};\n\nconst useRowExpand: UseRowExpandProps = (hooks) => {\n hooks.visibleColumns.push(visibleColumnsHook);\n hooks.getRowProps.push(getRowPropsHook);\n};\nuseRowExpand.pluginName = \"useHvRowExpand\";\n\nexport default useRowExpand;\n"],"names":[],"mappings":";;;;;AAuCA,MAAM,iBAAiB;AAAA,EACrB,0BAA0B;AAAA,EAC1B,4BAA4B;AAC9B;AAEO,MAAM,uBAAuB,CAAC;AAAA,EACnC;AAAA,EACA;AAAA,EACA,QAAQ;AACV,MAAW;AACH,QAAA,SAAS,UAAU,gBAAgB,UAAU;AAEnD,QAAM,EAAE,QAAA,IAAY,IAAI,0BAA0B;AAElD,SAEI,qBAAA,UAAA,EAAA,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAI;AAAA,QACJ,cACE,IAAI,aACA,OAAO,6BACP,OAAO;AAAA,QAEb,iBAAe,IAAI;AAAA,QACnB;AAAA,QAEC,cAAI,aAAa,oBAAC,YAAW,CAAA,CAAA,wBAAM,UAAS,EAAA;AAAA,MAAA;AAAA,IAC/C;AAAA,IACC,MAAM,SACJ,oBAAA,cAAA,EAAa,SAAQ,SAAQ,WAAU,QACrC,UAAA,KAAK,MACR,CAAA;AAAA,EAEJ,EAAA,CAAA;AAEJ;AAEA,MAAM,qBAAqB,CAAC,SAAc,EAAE,eAAoB;AAC9D,MAAI,SAAS,2BAA2B;AAC/B,WAAA;AAAA,EACT;AAIA,QAAM,uBAAuB,QAAQ;AAAA,IACnC,CAAC,MAAW,EAAE,IAAI,QAAQ,MAAM,MAAM;AAAA,EAAA;AAGxC,MAAI,yBAAyB,IAAI;AACzB,UAAA,kBAAkB,QAAQ,oBAAoB;AAEhD,QAAA,gBAAgB,QAAQ,MAAM;AAChC,sBAAgB,OAAO;AACvB,sBAAgB,UAAU;AAEnB,aAAA;AAAA,IACT;AAAA,EACF;AAEA,QAAM,eAAe;AAAA,IACnB,IAAI;AAAA,IACJ,SAAS;AAAA,IAET,OAAO;AAAA;AAAA;AAAA,IAIP,QAAQ;AAAA,IAER,MAAM;AAAA,EAAA;AAGF,QAAA,cAAc,CAAC,GAAG,OAAO;AACnB,cAAA;AAAA,IACV,yBAAyB,KAAK,uBAAuB;AAAA,IACrD;AAAA,IACA;AAAA,EAAA;AAGK,SAAA;AACT;AAEA,MAAM,kBAAkB,CAAC,OAAY,EAAE,UAAe;AACpD,QAAM,YAAyC;AAAA,IAC7C,UAAU,IAAI;AAAA,EAAA;AAGT,SAAA,CAAC,OAAO,SAAS;AAC1B;
|
|
1
|
+
{"version":3,"file":"useRowExpand.js","sources":["../../../../src/Table/hooks/useRowExpand.tsx"],"sourcesContent":["import {\n Hooks,\n TableExpandedToggleProps,\n UseExpandedRowProps,\n} from \"react-table\";\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvButton } from \"../../Button\";\nimport { useLabels } from \"../../hooks/useLabels\";\nimport { HvTypography } from \"../../Typography\";\n\n// #region ##### TYPES #####\n\nexport interface UseHvRowExpandTableRowProps {\n expanded?: boolean;\n}\n\nexport type UseHvRowExpandTableOptions = {\n disableCreateExpandButton?: boolean;\n};\n\nexport interface UseHvRowExpandRowToggleProps extends TableExpandedToggleProps {\n onClick?: React.MouseEventHandler<unknown>;\n}\n\nexport interface UseHvRowExpandRowInstance<\n D extends object = Record<string, unknown>,\n> extends UseExpandedRowProps<D> {\n getToggleRowExpandedProps: (\n props?: Partial<TableExpandedToggleProps>,\n ) => UseHvRowExpandRowToggleProps;\n}\n\nexport type UseRowExpandProps = (<D extends object = Record<string, unknown>>(\n hooks: Hooks<D>,\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst DEFAULT_LABELS = {\n expandRowButtonAriaLabel: \"Expand this row\",\n collapseRowButtonAriaLabel: \"Collapse this row\",\n};\n\nexport const CellWithExpandButton = ({\n row,\n cell,\n labels: labelsProp,\n}: any) => {\n const labels = useLabels(DEFAULT_LABELS, labelsProp);\n\n const { onClick } = row.getToggleRowExpandedProps();\n\n return (\n <>\n <HvButton\n icon\n aria-label={\n row.isExpanded\n ? labels.collapseRowButtonAriaLabel\n : labels.expandRowButtonAriaLabel\n }\n aria-expanded={row.isExpanded}\n onClick={onClick}\n >\n {row.isExpanded ? <DropDownXS /> : <DropUpXS />}\n </HvButton>\n {cell?.value && (\n <HvTypography variant=\"label\" component=\"span\">\n {cell.value}\n </HvTypography>\n )}\n </>\n );\n};\n\nconst visibleColumnsHook = (columns: any, { instance }: any) => {\n if (instance.disableCreateExpandButton) {\n return columns;\n }\n\n // add a button to first data column, unless it has a custom renderer\n // if so, add an extra column instead\n const firstDataColumnIndex = columns.findIndex(\n (c: any) => c.id?.indexOf(\"_hv_\") !== 0,\n );\n\n if (firstDataColumnIndex !== -1) {\n const firstDataColumn = columns[firstDataColumnIndex];\n\n if (firstDataColumn.Cell == null) {\n firstDataColumn.Cell = CellWithExpandButton;\n firstDataColumn.variant = \"expand\";\n\n return columns;\n }\n }\n\n const expandColumn = {\n id: \"_hv_expand\",\n variant: \"none\",\n\n width: 32,\n\n // this will only work when using useHvTableSticky\n // but ensures it stays left of any sticky column\n sticky: \"left\",\n\n Cell: CellWithExpandButton,\n };\n\n const columnsCopy = [...columns];\n columnsCopy.splice(\n firstDataColumnIndex !== -1 ? firstDataColumnIndex : 0,\n 0,\n expandColumn,\n );\n\n return columnsCopy;\n};\n\nconst getRowPropsHook = (props: any, { row }: any) => {\n const nextProps: UseHvRowExpandTableRowProps = {\n expanded: row.isExpanded,\n };\n\n return [props, nextProps];\n};\n\nconst useRowExpand: UseRowExpandProps = (hooks) => {\n hooks.visibleColumns.push(visibleColumnsHook);\n hooks.getRowProps.push(getRowPropsHook);\n};\nuseRowExpand.pluginName = \"useHvRowExpand\";\n\nexport default useRowExpand;\n"],"names":[],"mappings":";;;;;AAuCA,MAAM,iBAAiB;AAAA,EACrB,0BAA0B;AAAA,EAC1B,4BAA4B;AAC9B;AAEO,MAAM,uBAAuB,CAAC;AAAA,EACnC;AAAA,EACA;AAAA,EACA,QAAQ;AACV,MAAW;AACH,QAAA,SAAS,UAAU,gBAAgB,UAAU;AAEnD,QAAM,EAAE,QAAA,IAAY,IAAI,0BAA0B;AAElD,SAEI,qBAAA,UAAA,EAAA,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAI;AAAA,QACJ,cACE,IAAI,aACA,OAAO,6BACP,OAAO;AAAA,QAEb,iBAAe,IAAI;AAAA,QACnB;AAAA,QAEC,cAAI,aAAa,oBAAC,YAAW,CAAA,CAAA,wBAAM,UAAS,EAAA;AAAA,MAAA;AAAA,IAC/C;AAAA,IACC,MAAM,SACJ,oBAAA,cAAA,EAAa,SAAQ,SAAQ,WAAU,QACrC,UAAA,KAAK,MACR,CAAA;AAAA,EAEJ,EAAA,CAAA;AAEJ;AAEA,MAAM,qBAAqB,CAAC,SAAc,EAAE,eAAoB;AAC9D,MAAI,SAAS,2BAA2B;AAC/B,WAAA;AAAA,EACT;AAIA,QAAM,uBAAuB,QAAQ;AAAA,IACnC,CAAC,MAAW,EAAE,IAAI,QAAQ,MAAM,MAAM;AAAA,EAAA;AAGxC,MAAI,yBAAyB,IAAI;AACzB,UAAA,kBAAkB,QAAQ,oBAAoB;AAEhD,QAAA,gBAAgB,QAAQ,MAAM;AAChC,sBAAgB,OAAO;AACvB,sBAAgB,UAAU;AAEnB,aAAA;AAAA,IACT;AAAA,EACF;AAEA,QAAM,eAAe;AAAA,IACnB,IAAI;AAAA,IACJ,SAAS;AAAA,IAET,OAAO;AAAA;AAAA;AAAA,IAIP,QAAQ;AAAA,IAER,MAAM;AAAA,EAAA;AAGF,QAAA,cAAc,CAAC,GAAG,OAAO;AACnB,cAAA;AAAA,IACV,yBAAyB,KAAK,uBAAuB;AAAA,IACrD;AAAA,IACA;AAAA,EAAA;AAGK,SAAA;AACT;AAEA,MAAM,kBAAkB,CAAC,OAAY,EAAE,UAAe;AACpD,QAAM,YAAyC;AAAA,IAC7C,UAAU,IAAI;AAAA,EAAA;AAGT,SAAA,CAAC,OAAO,SAAS;AAC1B;AAEM,MAAA,eAAkC,CAAC,UAAU;AAC3C,QAAA,eAAe,KAAK,kBAAkB;AACtC,QAAA,YAAY,KAAK,eAAe;AACxC;AACA,aAAa,aAAa;"}
|
|
@@ -437,10 +437,9 @@ const useRowSelection = (hooks) => {
|
|
|
437
437
|
hooks.prepareRow.push(prepareRow);
|
|
438
438
|
};
|
|
439
439
|
useRowSelection.pluginName = "useHvRowSelection";
|
|
440
|
-
const useRowSelection$1 = useRowSelection;
|
|
441
440
|
export {
|
|
442
441
|
CellWithCheckBox,
|
|
443
|
-
useRowSelection
|
|
442
|
+
useRowSelection as default,
|
|
444
443
|
defaultGetToggleAllPageRowsSelectedProps,
|
|
445
444
|
defaultGetToggleAllRowsSelectedProps,
|
|
446
445
|
defaultGetToggleRowSelectedProps,
|