@esri/calcite-components-react 3.0.0-next.98 → 3.0.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/README.md +3 -3
- package/dist/components.d.ts +11 -0
- package/dist/components.js +9 -0
- package/package.json +4 -4
package/README.md
CHANGED
|
@@ -16,7 +16,7 @@ There are two builds that are provided by the standard `calcite-components` pack
|
|
|
16
16
|
|
|
17
17
|
### Custom Elements build
|
|
18
18
|
|
|
19
|
-
[Custom Elements](
|
|
19
|
+
[Custom Elements](developers.arcgis.com/calcite-design-system/get-started#custom-elements) is the recommended build when using frontend frameworks, such as React. To use this build, you will need to set the path to the `calcite-components` assets. You can either use local assets, which will be explained in a subsequent step, or assets hosted on a CDN.
|
|
20
20
|
|
|
21
21
|
```jsx
|
|
22
22
|
import { setAssetPath } from "@esri/calcite-components/dist/components";
|
|
@@ -38,7 +38,7 @@ import { CalciteButton, CalciteIcon, CalciteSlider } from "@esri/calcite-compone
|
|
|
38
38
|
|
|
39
39
|
### Dist build
|
|
40
40
|
|
|
41
|
-
When using the [Dist](
|
|
41
|
+
When using the [Dist](developers.arcgis.com/calcite-design-system/get-started#distribution) build, you'll need to manually define the custom elements on the window. You can also choose between local and CDN hosted assets.
|
|
42
42
|
|
|
43
43
|
```jsx
|
|
44
44
|
import { defineCustomElements } from "@esri/calcite-components/dist/loader";
|
|
@@ -86,7 +86,7 @@ function onUpdate(event) {
|
|
|
86
86
|
}
|
|
87
87
|
|
|
88
88
|
// need to access the dom node to set custom event listeners for props that aren't strings / numbers
|
|
89
|
-
//
|
|
89
|
+
// lit.dev/docs/frameworks/react#why-are-wrappers-needed
|
|
90
90
|
useEffect(
|
|
91
91
|
(_) => {
|
|
92
92
|
sliderEl.current.addEventListener("calciteSliderUpdate", onUpdate);
|
package/dist/components.d.ts
CHANGED
|
@@ -62,8 +62,19 @@ export declare const CalciteBlock: import("@lit/react").ReactWebComponent<HTMLCa
|
|
|
62
62
|
onCalciteBlockBeforeOpen: EventName<HTMLCalciteBlockElement["calciteBlockBeforeOpen"]>;
|
|
63
63
|
onCalciteBlockClose: EventName<HTMLCalciteBlockElement["calciteBlockClose"]>;
|
|
64
64
|
onCalciteBlockOpen: EventName<HTMLCalciteBlockElement["calciteBlockOpen"]>;
|
|
65
|
+
onCalciteBlockSortHandleBeforeClose: EventName<HTMLCalciteBlockElement["calciteBlockSortHandleBeforeClose"]>;
|
|
66
|
+
onCalciteBlockSortHandleBeforeOpen: EventName<HTMLCalciteBlockElement["calciteBlockSortHandleBeforeOpen"]>;
|
|
67
|
+
onCalciteBlockSortHandleClose: EventName<HTMLCalciteBlockElement["calciteBlockSortHandleClose"]>;
|
|
68
|
+
onCalciteBlockSortHandleOpen: EventName<HTMLCalciteBlockElement["calciteBlockSortHandleOpen"]>;
|
|
65
69
|
onCalciteBlockToggle: EventName<HTMLCalciteBlockElement["calciteBlockToggle"]>;
|
|
66
70
|
}>;
|
|
71
|
+
export declare const CalciteBlockGroup: import("@lit/react").ReactWebComponent<HTMLCalciteBlockGroupElement & {
|
|
72
|
+
class?: string;
|
|
73
|
+
}, {
|
|
74
|
+
onCalciteBlockGroupDragEnd: EventName<HTMLCalciteBlockGroupElement["calciteBlockGroupDragEnd"]>;
|
|
75
|
+
onCalciteBlockGroupDragStart: EventName<HTMLCalciteBlockGroupElement["calciteBlockGroupDragStart"]>;
|
|
76
|
+
onCalciteBlockGroupOrderChange: EventName<HTMLCalciteBlockGroupElement["calciteBlockGroupOrderChange"]>;
|
|
77
|
+
}>;
|
|
67
78
|
export declare const CalciteBlockSection: import("@lit/react").ReactWebComponent<HTMLCalciteBlockSectionElement & {
|
|
68
79
|
class?: string;
|
|
69
80
|
}, {
|
package/dist/components.js
CHANGED
|
@@ -39,8 +39,17 @@ export const CalciteBlock = /*@__PURE__*/ createWrapper(getReactWrapperOptions("
|
|
|
39
39
|
onCalciteBlockBeforeOpen: "calciteBlockBeforeOpen",
|
|
40
40
|
onCalciteBlockClose: "calciteBlockClose",
|
|
41
41
|
onCalciteBlockOpen: "calciteBlockOpen",
|
|
42
|
+
onCalciteBlockSortHandleBeforeClose: "calciteBlockSortHandleBeforeClose",
|
|
43
|
+
onCalciteBlockSortHandleBeforeOpen: "calciteBlockSortHandleBeforeOpen",
|
|
44
|
+
onCalciteBlockSortHandleClose: "calciteBlockSortHandleClose",
|
|
45
|
+
onCalciteBlockSortHandleOpen: "calciteBlockSortHandleOpen",
|
|
42
46
|
onCalciteBlockToggle: "calciteBlockToggle",
|
|
43
47
|
}));
|
|
48
|
+
export const CalciteBlockGroup = /*@__PURE__*/ createWrapper(getReactWrapperOptions("calcite-block-group", {
|
|
49
|
+
onCalciteBlockGroupDragEnd: "calciteBlockGroupDragEnd",
|
|
50
|
+
onCalciteBlockGroupDragStart: "calciteBlockGroupDragStart",
|
|
51
|
+
onCalciteBlockGroupOrderChange: "calciteBlockGroupOrderChange",
|
|
52
|
+
}));
|
|
44
53
|
export const CalciteBlockSection = /*@__PURE__*/ createWrapper(getReactWrapperOptions("calcite-block-section", {
|
|
45
54
|
onCalciteBlockSectionToggle: "calciteBlockSectionToggle",
|
|
46
55
|
}));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@esri/calcite-components-react",
|
|
3
|
-
"version": "3.0.0
|
|
3
|
+
"version": "3.0.0",
|
|
4
4
|
"description": "A set of React components that wrap calcite components",
|
|
5
5
|
"homepage": "https://developers.arcgis.com/calcite-design-system/",
|
|
6
6
|
"repository": {
|
|
@@ -26,8 +26,8 @@
|
|
|
26
26
|
"tsc": "tsc"
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"@esri/calcite-components": "3.0.0
|
|
30
|
-
"@lit/react": "1.0.
|
|
29
|
+
"@esri/calcite-components": "3.0.0",
|
|
30
|
+
"@lit/react": "1.0.7"
|
|
31
31
|
},
|
|
32
32
|
"peerDependencies": {
|
|
33
33
|
"react": ">=18.3",
|
|
@@ -36,5 +36,5 @@
|
|
|
36
36
|
"volta": {
|
|
37
37
|
"extends": "../../package.json"
|
|
38
38
|
},
|
|
39
|
-
"gitHead": "
|
|
39
|
+
"gitHead": "e63242f9ee599ca587df864e4f85545746c1157c"
|
|
40
40
|
}
|