@activecollab/components 1.0.33 → 1.0.34
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/components/Accordion/AccordionItemBody.js +2 -2
- package/dist/cjs/components/Accordion/AccordionItemBody.js.map +1 -1
- package/dist/cjs/hooks/useHeight.js +2 -3
- package/dist/cjs/hooks/useHeight.js.map +1 -1
- package/dist/esm/components/Accordion/AccordionItemBody.js +1 -1
- package/dist/esm/components/Accordion/AccordionItemBody.js.map +1 -1
- package/dist/esm/hooks/useHeight.d.ts +1 -2
- package/dist/esm/hooks/useHeight.d.ts.map +1 -1
- package/dist/esm/hooks/useHeight.js +1 -4
- package/dist/esm/hooks/useHeight.js.map +1 -1
- package/dist/index.js +2 -3
- package/dist/index.js.map +1 -1
- package/dist/index.min.js +1 -1
- package/dist/index.min.js.map +1 -1
- package/package.json +1 -1
|
@@ -15,7 +15,7 @@ var _reactTransitionGroup = require("react-transition-group");
|
|
|
15
15
|
|
|
16
16
|
var _AccordionItem = require("./AccordionItem");
|
|
17
17
|
|
|
18
|
-
var _useHeight =
|
|
18
|
+
var _useHeight = require("../../hooks/useHeight");
|
|
19
19
|
|
|
20
20
|
var _Styles = require("./Styles");
|
|
21
21
|
|
|
@@ -37,7 +37,7 @@ var AccordionItemBody = function AccordionItemBody(_ref) {
|
|
|
37
37
|
var itemContext = (0, _react.useContext)(_AccordionItem.ItemContext);
|
|
38
38
|
var divRef = (0, _react.useRef)(null);
|
|
39
39
|
var duration = 200;
|
|
40
|
-
var height = (0, _useHeight.
|
|
40
|
+
var height = (0, _useHeight.useHeight)(divRef);
|
|
41
41
|
var defaultStyle = {
|
|
42
42
|
transition: "max-height ".concat(duration, "ms linear"),
|
|
43
43
|
maxHeight: 0
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Accordion/AccordionItemBody.tsx"],"names":["AccordionItemBody","children","className","itemContext","ItemContext","divRef","duration","height","defaultStyle","transition","maxHeight","transitionStyles","entering","entered","exiting","exited","isItemExpanded","state","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;AASO,IAAMA,iBAAyC,GAAG,SAA5CA,iBAA4C,OAGnD;AAAA,MAFJC,QAEI,QAFJA,QAEI;AAAA,MADJC,SACI,QADJA,SACI;AACJ,MAAMC,WAAW,GAAG,uBAAgCC,0BAAhC,CAApB;AACA,MAAMC,MAAM,GAAG,mBAAO,IAAP,CAAf;AACA,MAAMC,QAAQ,GAAG,GAAjB;AACA,MAAMC,MAAM,GAAG,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Accordion/AccordionItemBody.tsx"],"names":["AccordionItemBody","children","className","itemContext","ItemContext","divRef","duration","height","defaultStyle","transition","maxHeight","transitionStyles","entering","entered","exiting","exited","isItemExpanded","state","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;AASO,IAAMA,iBAAyC,GAAG,SAA5CA,iBAA4C,OAGnD;AAAA,MAFJC,QAEI,QAFJA,QAEI;AAAA,MADJC,SACI,QADJA,SACI;AACJ,MAAMC,WAAW,GAAG,uBAAgCC,0BAAhC,CAApB;AACA,MAAMC,MAAM,GAAG,mBAAO,IAAP,CAAf;AACA,MAAMC,QAAQ,GAAG,GAAjB;AACA,MAAMC,MAAM,GAAG,0BAAUF,MAAV,CAAf;AAEA,MAAMG,YAAY,GAAG;AACnBC,IAAAA,UAAU,uBAAgBH,QAAhB,cADS;AAEnBI,IAAAA,SAAS,EAAE;AAFQ,GAArB;AAKA,MAAMC,gBAAgB,GAAG;AACvBC,IAAAA,QAAQ,EAAE;AAAEF,MAAAA,SAAS,EAAEH;AAAb,KADa;AAEvBM,IAAAA,OAAO,EAAE;AAAEH,MAAAA,SAAS,EAAEH;AAAb,KAFc;AAGvBO,IAAAA,OAAO,EAAE;AAAEJ,MAAAA,SAAS,EAAE;AAAb,KAHc;AAIvBK,IAAAA,MAAM,EAAE;AAAEL,MAAAA,SAAS,EAAE;AAAb;AAJe,GAAzB;AAOA,sBACE,6BAAC,gCAAD;AAAY,IAAA,OAAO,EAAE,GAArB;AAA0B,IAAA,EAAE,EAAEP,WAAF,aAAEA,WAAF,uBAAEA,WAAW,CAAEa;AAA3C,KACG,UAACC,KAAD;AAAA,wBACC,6BAAC,+BAAD;AACE,MAAA,GAAG,EAAEZ,MADP;AAEE,MAAA,SAAS,EAAE,yBAAW,mBAAX,EAAgCH,SAAhC,CAFb;AAGE,MAAA,KAAK,kCACAM,YADA,GAEAG,gBAAgB,CAACM,KAAD,CAFhB;AAHP,OAQGhB,QARH,CADD;AAAA,GADH,CADF;AAgBD,CArCM;;;AAuCPD,iBAAiB,CAACkB,WAAlB,GAAgC,mBAAhC","sourcesContent":["import React, { ReactNode, FC, useContext, useRef, ReactElement } from \"react\";\nimport classnames from \"classnames\";\nimport { Transition } from \"react-transition-group\";\nimport { ItemContext, IItemContext } from \"./AccordionItem\";\nimport { useHeight } from \"../../hooks/useHeight\";\nimport { StyledAccordionItemBody } from \"./Styles\";\n\ninterface IAccordionItemBody {\n /** Children type of node or string */\n children: ReactNode | string;\n /** ClassName */\n className?: string;\n}\n\nexport const AccordionItemBody: FC<IAccordionItemBody> = ({\n children,\n className,\n}) => {\n const itemContext = useContext<IItemContext | null>(ItemContext);\n const divRef = useRef(null);\n const duration = 200;\n const height = useHeight(divRef);\n\n const defaultStyle = {\n transition: `max-height ${duration}ms linear`,\n maxHeight: 0,\n };\n\n const transitionStyles = {\n entering: { maxHeight: height },\n entered: { maxHeight: height },\n exiting: { maxHeight: 0 },\n exited: { maxHeight: 0 },\n };\n\n return (\n <Transition timeout={200} in={itemContext?.isItemExpanded}>\n {(state): ReactElement => (\n <StyledAccordionItemBody\n ref={divRef}\n className={classnames(\"accordionItemBody\", className)}\n style={{\n ...defaultStyle,\n ...transitionStyles[state],\n }}\n >\n {children}\n </StyledAccordionItemBody>\n )}\n </Transition>\n );\n};\n\nAccordionItemBody.displayName = \"AccordionItemBody\";\n"],"file":"AccordionItemBody.js"}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.useHeight = void 0;
|
|
7
7
|
|
|
8
8
|
var _react = require("react");
|
|
9
9
|
|
|
@@ -41,6 +41,5 @@ var useHeight = function useHeight(ref) {
|
|
|
41
41
|
return height;
|
|
42
42
|
};
|
|
43
43
|
|
|
44
|
-
|
|
45
|
-
exports.default = _default;
|
|
44
|
+
exports.useHeight = useHeight;
|
|
46
45
|
//# sourceMappingURL=useHeight.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/hooks/useHeight.tsx"],"names":["useHeight","ref","height","setHeight","current","element","prevMaxHeight","style","maxHeight","prevVisibility","visibility","elementHeight","clientHeight"],"mappings":";;;;;;;AAAA;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"sources":["../../../src/hooks/useHeight.tsx"],"names":["useHeight","ref","height","setHeight","current","element","prevMaxHeight","style","maxHeight","prevVisibility","visibility","elementHeight","clientHeight"],"mappings":";;;;;;;AAAA;;;;;;;;;;;;;;AAEO,IAAMA,SAAS,GAAG,SAAZA,SAAY,CAACC,GAAD,EAAyC;AAChE,kBAA4B,qBAAS,CAAT,CAA5B;AAAA;AAAA,MAAOC,MAAP;AAAA,MAAeC,SAAf;;AAEA,wBAAU,YAAM;AACd,QAAIF,GAAG,IAAIA,GAAG,CAACG,OAAf,EAAwB;AACtB,UAAMC,OAAO,GAAGJ,GAAG,CAACG,OAApB;AACA,UAAME,aAAa,GAAGD,OAAO,CAACE,KAAR,CAAcC,SAApC;AACA,UAAMC,cAAc,GAAGJ,OAAO,CAACE,KAAR,CAAcG,UAArC;AAEAL,MAAAA,OAAO,CAACE,KAAR,CAAcG,UAAd,GAA2B,QAA3B;AACAL,MAAAA,OAAO,CAACE,KAAR,CAAcC,SAAd,GAA0B,MAA1B;AAEA,UAAMG,aAAa,GAAGN,OAAO,CAACO,YAA9B;AAEAP,MAAAA,OAAO,CAACE,KAAR,CAAcG,UAAd,GAA2BD,cAA3B;AACAJ,MAAAA,OAAO,CAACE,KAAR,CAAcC,SAAd,GAA0BF,aAA1B;AAEA,aAAOH,SAAS,CAACQ,aAAD,CAAhB;AACD;AACF,GAhBD,EAgBG,CAACV,GAAD,CAhBH;AAkBA,SAAOC,MAAP;AACD,CAtBM","sourcesContent":["import { RefObject, useEffect, useState } from \"react\";\n\nexport const useHeight = (ref: RefObject<HTMLElement>): number => {\n const [height, setHeight] = useState(0);\n\n useEffect(() => {\n if (ref && ref.current) {\n const element = ref.current;\n const prevMaxHeight = element.style.maxHeight;\n const prevVisibility = element.style.visibility;\n\n element.style.visibility = \"hidden\";\n element.style.maxHeight = \"none\";\n\n const elementHeight = element.clientHeight;\n\n element.style.visibility = prevVisibility;\n element.style.maxHeight = prevMaxHeight;\n\n return setHeight(elementHeight);\n }\n }, [ref]);\n\n return height;\n};\n"],"file":"useHeight.js"}
|
|
@@ -3,7 +3,7 @@ import React, { useContext, useRef } from "react";
|
|
|
3
3
|
import classnames from "classnames";
|
|
4
4
|
import { Transition } from "react-transition-group";
|
|
5
5
|
import { ItemContext } from "./AccordionItem";
|
|
6
|
-
import useHeight from "../../hooks/useHeight";
|
|
6
|
+
import { useHeight } from "../../hooks/useHeight";
|
|
7
7
|
import { StyledAccordionItemBody } from "./Styles";
|
|
8
8
|
export var AccordionItemBody = function AccordionItemBody(_ref) {
|
|
9
9
|
var children = _ref.children,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Accordion/AccordionItemBody.tsx"],"names":["React","useContext","useRef","classnames","Transition","ItemContext","useHeight","StyledAccordionItemBody","AccordionItemBody","children","className","itemContext","divRef","duration","height","defaultStyle","transition","maxHeight","transitionStyles","entering","entered","exiting","exited","isItemExpanded","state","displayName"],"mappings":";AAAA,OAAOA,KAAP,IAA+BC,UAA/B,EAA2CC,MAA3C,QAAuE,OAAvE;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAASC,UAAT,QAA2B,wBAA3B;AACA,SAASC,WAAT,QAA0C,iBAA1C;AACA,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Accordion/AccordionItemBody.tsx"],"names":["React","useContext","useRef","classnames","Transition","ItemContext","useHeight","StyledAccordionItemBody","AccordionItemBody","children","className","itemContext","divRef","duration","height","defaultStyle","transition","maxHeight","transitionStyles","entering","entered","exiting","exited","isItemExpanded","state","displayName"],"mappings":";AAAA,OAAOA,KAAP,IAA+BC,UAA/B,EAA2CC,MAA3C,QAAuE,OAAvE;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAASC,UAAT,QAA2B,wBAA3B;AACA,SAASC,WAAT,QAA0C,iBAA1C;AACA,SAASC,SAAT,QAA0B,uBAA1B;AACA,SAASC,uBAAT,QAAwC,UAAxC;AASA,OAAO,IAAMC,iBAAyC,GAAG,SAA5CA,iBAA4C,OAGnD;AAAA,MAFJC,QAEI,QAFJA,QAEI;AAAA,MADJC,SACI,QADJA,SACI;AACJ,MAAMC,WAAW,GAAGV,UAAU,CAAsBI,WAAtB,CAA9B;AACA,MAAMO,MAAM,GAAGV,MAAM,CAAC,IAAD,CAArB;AACA,MAAMW,QAAQ,GAAG,GAAjB;AACA,MAAMC,MAAM,GAAGR,SAAS,CAACM,MAAD,CAAxB;AAEA,MAAMG,YAAY,GAAG;AACnBC,IAAAA,UAAU,kBAAgBH,QAAhB,cADS;AAEnBI,IAAAA,SAAS,EAAE;AAFQ,GAArB;AAKA,MAAMC,gBAAgB,GAAG;AACvBC,IAAAA,QAAQ,EAAE;AAAEF,MAAAA,SAAS,EAAEH;AAAb,KADa;AAEvBM,IAAAA,OAAO,EAAE;AAAEH,MAAAA,SAAS,EAAEH;AAAb,KAFc;AAGvBO,IAAAA,OAAO,EAAE;AAAEJ,MAAAA,SAAS,EAAE;AAAb,KAHc;AAIvBK,IAAAA,MAAM,EAAE;AAAEL,MAAAA,SAAS,EAAE;AAAb;AAJe,GAAzB;AAOA,sBACE,oBAAC,UAAD;AAAY,IAAA,OAAO,EAAE,GAArB;AAA0B,IAAA,EAAE,EAAEN,WAAF,oBAAEA,WAAW,CAAEY;AAA3C,KACG,UAACC,KAAD;AAAA,wBACC,oBAAC,uBAAD;AACE,MAAA,GAAG,EAAEZ,MADP;AAEE,MAAA,SAAS,EAAET,UAAU,CAAC,mBAAD,EAAsBO,SAAtB,CAFvB;AAGE,MAAA,KAAK,eACAK,YADA,EAEAG,gBAAgB,CAACM,KAAD,CAFhB;AAHP,OAQGf,QARH,CADD;AAAA,GADH,CADF;AAgBD,CArCM;AAuCPD,iBAAiB,CAACiB,WAAlB,GAAgC,mBAAhC","sourcesContent":["import React, { ReactNode, FC, useContext, useRef, ReactElement } from \"react\";\nimport classnames from \"classnames\";\nimport { Transition } from \"react-transition-group\";\nimport { ItemContext, IItemContext } from \"./AccordionItem\";\nimport { useHeight } from \"../../hooks/useHeight\";\nimport { StyledAccordionItemBody } from \"./Styles\";\n\ninterface IAccordionItemBody {\n /** Children type of node or string */\n children: ReactNode | string;\n /** ClassName */\n className?: string;\n}\n\nexport const AccordionItemBody: FC<IAccordionItemBody> = ({\n children,\n className,\n}) => {\n const itemContext = useContext<IItemContext | null>(ItemContext);\n const divRef = useRef(null);\n const duration = 200;\n const height = useHeight(divRef);\n\n const defaultStyle = {\n transition: `max-height ${duration}ms linear`,\n maxHeight: 0,\n };\n\n const transitionStyles = {\n entering: { maxHeight: height },\n entered: { maxHeight: height },\n exiting: { maxHeight: 0 },\n exited: { maxHeight: 0 },\n };\n\n return (\n <Transition timeout={200} in={itemContext?.isItemExpanded}>\n {(state): ReactElement => (\n <StyledAccordionItemBody\n ref={divRef}\n className={classnames(\"accordionItemBody\", className)}\n style={{\n ...defaultStyle,\n ...transitionStyles[state],\n }}\n >\n {children}\n </StyledAccordionItemBody>\n )}\n </Transition>\n );\n};\n\nAccordionItemBody.displayName = \"AccordionItemBody\";\n"],"file":"AccordionItemBody.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useHeight.d.ts","sourceRoot":"","sources":["../../../src/hooks/useHeight.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAuB,MAAM,OAAO,CAAC;AAEvD,
|
|
1
|
+
{"version":3,"file":"useHeight.d.ts","sourceRoot":"","sources":["../../../src/hooks/useHeight.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAuB,MAAM,OAAO,CAAC;AAEvD,eAAO,MAAM,SAAS,QAAS,UAAU,WAAW,CAAC,KAAG,MAsBvD,CAAC"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { useEffect, useState } from "react";
|
|
2
|
-
|
|
3
|
-
var useHeight = function useHeight(ref) {
|
|
2
|
+
export var useHeight = function useHeight(ref) {
|
|
4
3
|
var _useState = useState(0),
|
|
5
4
|
height = _useState[0],
|
|
6
5
|
setHeight = _useState[1];
|
|
@@ -20,6 +19,4 @@ var useHeight = function useHeight(ref) {
|
|
|
20
19
|
}, [ref]);
|
|
21
20
|
return height;
|
|
22
21
|
};
|
|
23
|
-
|
|
24
|
-
export default useHeight;
|
|
25
22
|
//# sourceMappingURL=useHeight.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/hooks/useHeight.tsx"],"names":["useEffect","useState","useHeight","ref","height","setHeight","current","element","prevMaxHeight","style","maxHeight","prevVisibility","visibility","elementHeight","clientHeight"],"mappings":"AAAA,SAAoBA,SAApB,EAA+BC,QAA/B,QAA+C,OAA/C
|
|
1
|
+
{"version":3,"sources":["../../../src/hooks/useHeight.tsx"],"names":["useEffect","useState","useHeight","ref","height","setHeight","current","element","prevMaxHeight","style","maxHeight","prevVisibility","visibility","elementHeight","clientHeight"],"mappings":"AAAA,SAAoBA,SAApB,EAA+BC,QAA/B,QAA+C,OAA/C;AAEA,OAAO,IAAMC,SAAS,GAAG,SAAZA,SAAY,CAACC,GAAD,EAAyC;AAChE,kBAA4BF,QAAQ,CAAC,CAAD,CAApC;AAAA,MAAOG,MAAP;AAAA,MAAeC,SAAf;;AAEAL,EAAAA,SAAS,CAAC,YAAM;AACd,QAAIG,GAAG,IAAIA,GAAG,CAACG,OAAf,EAAwB;AACtB,UAAMC,OAAO,GAAGJ,GAAG,CAACG,OAApB;AACA,UAAME,aAAa,GAAGD,OAAO,CAACE,KAAR,CAAcC,SAApC;AACA,UAAMC,cAAc,GAAGJ,OAAO,CAACE,KAAR,CAAcG,UAArC;AAEAL,MAAAA,OAAO,CAACE,KAAR,CAAcG,UAAd,GAA2B,QAA3B;AACAL,MAAAA,OAAO,CAACE,KAAR,CAAcC,SAAd,GAA0B,MAA1B;AAEA,UAAMG,aAAa,GAAGN,OAAO,CAACO,YAA9B;AAEAP,MAAAA,OAAO,CAACE,KAAR,CAAcG,UAAd,GAA2BD,cAA3B;AACAJ,MAAAA,OAAO,CAACE,KAAR,CAAcC,SAAd,GAA0BF,aAA1B;AAEA,aAAOH,SAAS,CAACQ,aAAD,CAAhB;AACD;AACF,GAhBQ,EAgBN,CAACV,GAAD,CAhBM,CAAT;AAkBA,SAAOC,MAAP;AACD,CAtBM","sourcesContent":["import { RefObject, useEffect, useState } from \"react\";\n\nexport const useHeight = (ref: RefObject<HTMLElement>): number => {\n const [height, setHeight] = useState(0);\n\n useEffect(() => {\n if (ref && ref.current) {\n const element = ref.current;\n const prevMaxHeight = element.style.maxHeight;\n const prevVisibility = element.style.visibility;\n\n element.style.visibility = \"hidden\";\n element.style.maxHeight = \"none\";\n\n const elementHeight = element.clientHeight;\n\n element.style.visibility = prevVisibility;\n element.style.maxHeight = prevMaxHeight;\n\n return setHeight(elementHeight);\n }\n }, [ref]);\n\n return height;\n};\n"],"file":"useHeight.js"}
|
package/dist/index.js
CHANGED
|
@@ -4142,8 +4142,6 @@
|
|
|
4142
4142
|
return height;
|
|
4143
4143
|
};
|
|
4144
4144
|
|
|
4145
|
-
var useHeight$1 = useHeight;
|
|
4146
|
-
|
|
4147
4145
|
var _excluded$q = ["as", "className", "invert"];
|
|
4148
4146
|
var ScrollElement = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
4149
4147
|
var _ref$as = _ref.as,
|
|
@@ -8075,7 +8073,7 @@
|
|
|
8075
8073
|
var itemContext = React.useContext(ItemContext);
|
|
8076
8074
|
var divRef = React.useRef(null);
|
|
8077
8075
|
var duration = 200;
|
|
8078
|
-
var height = useHeight
|
|
8076
|
+
var height = useHeight(divRef);
|
|
8079
8077
|
var defaultStyle = {
|
|
8080
8078
|
transition: "max-height ".concat(duration, "ms linear"),
|
|
8081
8079
|
maxHeight: 0
|
|
@@ -10251,6 +10249,7 @@
|
|
|
10251
10249
|
exports.WorkloadIcon = WorkloadIcon$1;
|
|
10252
10250
|
exports.YearMonthPicker = YearMonthPicker;
|
|
10253
10251
|
exports.signifierTypes = signifierTypes;
|
|
10252
|
+
exports.useHeight = useHeight;
|
|
10254
10253
|
exports.useInitScrollRef = useInitScrollRef;
|
|
10255
10254
|
exports.useLayerContext = useLayerContext;
|
|
10256
10255
|
exports.useMenuContext = useMenuContext;
|