@abgov/react-components 7.2.0-dev.20 → 7.2.0-dev.22
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/index.d.ts +1 -0
- package/index.js +92 -4
- package/index.js.map +1 -1
- package/index.mjs +93 -5
- package/index.mjs.map +1 -1
- package/lib/app-header/app-header.d.ts +12 -4
- package/lib/app-header-menu/app-header-menu.d.ts +1 -1
- package/lib/dropdown/dropdown-item.d.ts +5 -2
- package/lib/dropdown-multiselect/dropdown-multiselect.d.ts +66 -0
- package/package.json +1 -1
package/index.mjs
CHANGED
|
@@ -9,7 +9,7 @@ var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot
|
|
|
9
9
|
var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
|
|
10
10
|
var _PublicFormController_instances, updateObjectListState_fn, dispatchError_fn;
|
|
11
11
|
import { jsxs, jsx } from "react/jsx-runtime";
|
|
12
|
-
import { useRef, useEffect, useLayoutEffect, useState, useCallback, createContext, useContext } from "react";
|
|
12
|
+
import { useRef, useEffect, Children, isValidElement, Fragment, cloneElement, useLayoutEffect, useState, useCallback, createContext, useContext } from "react";
|
|
13
13
|
const lowercase = (input) => input.toLowerCase();
|
|
14
14
|
const kebab = (input) => input.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
|
|
15
15
|
function transformProps(props, transform = lowercase) {
|
|
@@ -63,10 +63,26 @@ function GoabAccordion({
|
|
|
63
63
|
}
|
|
64
64
|
);
|
|
65
65
|
}
|
|
66
|
+
function renderSlottedItems(children, slot) {
|
|
67
|
+
return Children.map(children, (child) => {
|
|
68
|
+
if (!isValidElement(child)) {
|
|
69
|
+
return child;
|
|
70
|
+
}
|
|
71
|
+
if (child.type === Fragment) {
|
|
72
|
+
const fragment = child;
|
|
73
|
+
return renderSlottedItems(fragment.props.children, slot);
|
|
74
|
+
}
|
|
75
|
+
return cloneElement(child, { slot });
|
|
76
|
+
});
|
|
77
|
+
}
|
|
66
78
|
function GoabAppHeader({
|
|
67
79
|
onMenuClick,
|
|
68
80
|
children,
|
|
69
81
|
secondaryText,
|
|
82
|
+
banner,
|
|
83
|
+
phase,
|
|
84
|
+
navigation,
|
|
85
|
+
utilities,
|
|
70
86
|
...rest
|
|
71
87
|
}) {
|
|
72
88
|
const el = useRef(null);
|
|
@@ -87,7 +103,7 @@ function GoabAppHeader({
|
|
|
87
103
|
current.removeEventListener("_menuClick", listener);
|
|
88
104
|
};
|
|
89
105
|
}, [el, onMenuClick]);
|
|
90
|
-
return /* @__PURE__ */
|
|
106
|
+
return /* @__PURE__ */ jsxs(
|
|
91
107
|
"goa-app-header",
|
|
92
108
|
{
|
|
93
109
|
ref: el,
|
|
@@ -95,7 +111,13 @@ function GoabAppHeader({
|
|
|
95
111
|
secondarytext: secondaryText,
|
|
96
112
|
..._props,
|
|
97
113
|
version: "2",
|
|
98
|
-
children
|
|
114
|
+
children: [
|
|
115
|
+
children,
|
|
116
|
+
banner && /* @__PURE__ */ jsx("div", { slot: "banner", children: banner }),
|
|
117
|
+
phase && /* @__PURE__ */ jsx("div", { slot: "phase", children: phase }),
|
|
118
|
+
navigation && renderSlottedItems(navigation, "navigation"),
|
|
119
|
+
utilities && renderSlottedItems(utilities, "utilities")
|
|
120
|
+
]
|
|
99
121
|
}
|
|
100
122
|
);
|
|
101
123
|
}
|
|
@@ -2855,7 +2877,8 @@ function GoabDropdownItem({
|
|
|
2855
2877
|
label,
|
|
2856
2878
|
filter,
|
|
2857
2879
|
name,
|
|
2858
|
-
mountType = "append"
|
|
2880
|
+
mountType = "append",
|
|
2881
|
+
children
|
|
2859
2882
|
}) {
|
|
2860
2883
|
return /* @__PURE__ */ jsx(
|
|
2861
2884
|
"goa-dropdown-item",
|
|
@@ -2864,7 +2887,71 @@ function GoabDropdownItem({
|
|
|
2864
2887
|
label,
|
|
2865
2888
|
filter,
|
|
2866
2889
|
name,
|
|
2867
|
-
mount: mountType
|
|
2890
|
+
mount: mountType,
|
|
2891
|
+
children
|
|
2892
|
+
}
|
|
2893
|
+
);
|
|
2894
|
+
}
|
|
2895
|
+
function GoabDropdownMultiselect({
|
|
2896
|
+
name,
|
|
2897
|
+
value = [],
|
|
2898
|
+
placeholder,
|
|
2899
|
+
disabled,
|
|
2900
|
+
error,
|
|
2901
|
+
filterable,
|
|
2902
|
+
leadingIcon,
|
|
2903
|
+
showSelectAll,
|
|
2904
|
+
testId,
|
|
2905
|
+
ariaLabel,
|
|
2906
|
+
ariaLabelledBy,
|
|
2907
|
+
maxHeight,
|
|
2908
|
+
width,
|
|
2909
|
+
size = "default",
|
|
2910
|
+
labelFormat,
|
|
2911
|
+
children,
|
|
2912
|
+
onChange,
|
|
2913
|
+
mt,
|
|
2914
|
+
mr,
|
|
2915
|
+
mb,
|
|
2916
|
+
ml
|
|
2917
|
+
}) {
|
|
2918
|
+
const el = useRef(null);
|
|
2919
|
+
useEffect(() => {
|
|
2920
|
+
if (!el.current) return;
|
|
2921
|
+
const current = el.current;
|
|
2922
|
+
const listener = (e) => {
|
|
2923
|
+
const detail = e.detail;
|
|
2924
|
+
onChange == null ? void 0 : onChange({ ...detail, event: e });
|
|
2925
|
+
};
|
|
2926
|
+
current.addEventListener("_change", listener);
|
|
2927
|
+
return () => {
|
|
2928
|
+
current.removeEventListener("_change", listener);
|
|
2929
|
+
};
|
|
2930
|
+
}, [onChange]);
|
|
2931
|
+
return /* @__PURE__ */ jsx(
|
|
2932
|
+
"goa-dropdown-multiselect",
|
|
2933
|
+
{
|
|
2934
|
+
ref: el,
|
|
2935
|
+
name,
|
|
2936
|
+
value,
|
|
2937
|
+
placeholder,
|
|
2938
|
+
disabled: disabled ? "true" : void 0,
|
|
2939
|
+
error: error ? "true" : void 0,
|
|
2940
|
+
filterable: filterable ? "true" : void 0,
|
|
2941
|
+
"leading-icon": leadingIcon,
|
|
2942
|
+
testid: testId,
|
|
2943
|
+
"aria-label": ariaLabel,
|
|
2944
|
+
"aria-labelledby": ariaLabelledBy,
|
|
2945
|
+
"max-height": maxHeight,
|
|
2946
|
+
width,
|
|
2947
|
+
size,
|
|
2948
|
+
"label-format": labelFormat ? labelFormat : void 0,
|
|
2949
|
+
"show-select-all": showSelectAll ? "true" : void 0,
|
|
2950
|
+
mt,
|
|
2951
|
+
mr,
|
|
2952
|
+
mb,
|
|
2953
|
+
ml,
|
|
2954
|
+
children
|
|
2868
2955
|
}
|
|
2869
2956
|
);
|
|
2870
2957
|
}
|
|
@@ -4673,6 +4760,7 @@ export {
|
|
|
4673
4760
|
GoabDrawer,
|
|
4674
4761
|
GoabDropdown,
|
|
4675
4762
|
GoabDropdownItem,
|
|
4763
|
+
GoabDropdownMultiselect,
|
|
4676
4764
|
GoabDropdownOption,
|
|
4677
4765
|
GoabFieldset,
|
|
4678
4766
|
GoabFileUploadCard,
|