@seed-design/react-collapsible 0.0.0 → 0.1.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.
Files changed (7) hide show
  1. package/lib/{Collapsible-12s-CzE3seHv.js → Collapsible-12s-DOxh1hw6.js} +4 -2
  2. package/lib/{Collapsible-12s-B5Klt2JP.cjs → Collapsible-12s-te4dDBqp.cjs} +4 -2
  3. package/lib/index.cjs +1 -1
  4. package/lib/index.d.ts +4 -4
  5. package/lib/index.js +2 -2
  6. package/package.json +1 -1
  7. package/src/useCollapsible.ts +2 -2
package/lib/{Collapsible-12s-CzE3seHv.js → Collapsible-12s-DOxh1hw6.js} RENAMED
@@ -36,13 +36,15 @@ function useCollapsible(props) {
36
36
  if (!contentRef.current) return;
37
37
  const updateHeight = ()=>{
38
38
  if (!contentRef.current) return;
39
- setHeight(contentRef.current.offsetHeight);
39
+ setHeight(contentRef.current.scrollHeight);
40
40
  };
41
41
  updateHeight();
42
42
  const observer = new ResizeObserver(updateHeight);
43
43
  observer.observe(contentRef.current);
44
44
  return ()=>observer.disconnect();
45
- }, []);
45
+ }, [
46
+ open
47
+ ]);
46
48
  useEffect(()=>{
47
49
  if (!open) return;
48
50
  // When expanded, immediately show to allow transition
package/lib/{Collapsible-12s-B5Klt2JP.cjs → Collapsible-12s-te4dDBqp.cjs} RENAMED
@@ -36,13 +36,15 @@ function useCollapsible(props) {
36
36
  if (!contentRef.current) return;
37
37
  const updateHeight = ()=>{
38
38
  if (!contentRef.current) return;
39
- setHeight(contentRef.current.offsetHeight);
39
+ setHeight(contentRef.current.scrollHeight);
40
40
  };
41
41
  updateHeight();
42
42
  const observer = new ResizeObserver(updateHeight);
43
43
  observer.observe(contentRef.current);
44
44
  return ()=>observer.disconnect();
45
- }, []);
45
+ }, [
46
+ open
47
+ ]);
46
48
  react.useEffect(()=>{
47
49
  if (!open) return;
48
50
  // When expanded, immediately show to allow transition
package/lib/index.cjs CHANGED
@@ -1,4 +1,4 @@
1
- var Collapsible12s = require('./Collapsible-12s-B5Klt2JP.cjs');
1
+ var Collapsible12s = require('./Collapsible-12s-te4dDBqp.cjs');
2
2
 
3
3
  var Collapsible_namespace = {
4
4
  __proto__: null,
package/lib/index.d.ts CHANGED
@@ -15,8 +15,8 @@ declare function useCollapsible(props: UseCollapsibleProps): {
15
15
  setOpen: (value: react.SetStateAction<boolean>) => void;
16
16
  disabled: boolean | undefined;
17
17
  stateProps: {
18
- defaultValue?: string | number | readonly string[] | undefined;
19
18
  defaultChecked?: boolean | undefined | undefined;
19
+ defaultValue?: string | number | readonly string[] | undefined;
20
20
  suppressContentEditableWarning?: boolean | undefined | undefined;
21
21
  suppressHydrationWarning?: boolean | undefined | undefined;
22
22
  accessKey?: string | undefined | undefined;
@@ -297,8 +297,8 @@ declare function useCollapsible(props: UseCollapsibleProps): {
297
297
  onTransitionStartCapture?: react.TransitionEventHandler<HTMLElement> | undefined;
298
298
  };
299
299
  triggerAriaProps: {
300
- defaultValue?: string | number | readonly string[] | undefined;
301
300
  defaultChecked?: boolean | undefined | undefined;
301
+ defaultValue?: string | number | readonly string[] | undefined;
302
302
  suppressContentEditableWarning?: boolean | undefined | undefined;
303
303
  suppressHydrationWarning?: boolean | undefined | undefined;
304
304
  accessKey?: string | undefined | undefined;
@@ -579,8 +579,8 @@ declare function useCollapsible(props: UseCollapsibleProps): {
579
579
  onTransitionStartCapture?: react.TransitionEventHandler<HTMLElement> | undefined;
580
580
  };
581
581
  triggerHandlers: {
582
- defaultValue?: string | number | readonly string[] | undefined;
583
582
  defaultChecked?: boolean | undefined | undefined;
583
+ defaultValue?: string | number | readonly string[] | undefined;
584
584
  suppressContentEditableWarning?: boolean | undefined | undefined;
585
585
  suppressHydrationWarning?: boolean | undefined | undefined;
586
586
  accessKey?: string | undefined | undefined;
@@ -861,8 +861,8 @@ declare function useCollapsible(props: UseCollapsibleProps): {
861
861
  onTransitionStartCapture?: react.TransitionEventHandler<HTMLElement> | undefined;
862
862
  };
863
863
  contentProps: {
864
- defaultValue?: string | number | readonly string[] | undefined;
865
864
  defaultChecked?: boolean | undefined | undefined;
865
+ defaultValue?: string | number | readonly string[] | undefined;
866
866
  suppressContentEditableWarning?: boolean | undefined | undefined;
867
867
  suppressHydrationWarning?: boolean | undefined | undefined;
868
868
  accessKey?: string | undefined | undefined;
package/lib/index.js CHANGED
@@ -1,5 +1,5 @@
1
- import { C as CollapsibleContent, a as CollapsibleRoot, b as CollapsibleTrigger } from './Collapsible-12s-CzE3seHv.js';
2
- export { c as CollapsibleProvider, d as useCollapsible, u as useCollapsibleContext } from './Collapsible-12s-CzE3seHv.js';
1
+ import { C as CollapsibleContent, a as CollapsibleRoot, b as CollapsibleTrigger } from './Collapsible-12s-DOxh1hw6.js';
2
+ export { c as CollapsibleProvider, d as useCollapsible, u as useCollapsibleContext } from './Collapsible-12s-DOxh1hw6.js';
3
3
 
4
4
  var Collapsible_namespace = {
5
5
  __proto__: null,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@seed-design/react-collapsible",
3
- "version": "0.0.0",
3
+ "version": "0.1.0",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/daangn/seed-design.git",
package/src/useCollapsible.ts CHANGED
@@ -45,7 +45,7 @@ export function useCollapsible(props: UseCollapsibleProps) {
45
45
  const updateHeight = () => {
46
46
  if (!contentRef.current) return;
47
47
 
48
- setHeight(contentRef.current.offsetHeight);
48
+ setHeight(contentRef.current.scrollHeight);
49
49
  };
50
50
 
51
51
  updateHeight();
@@ -54,7 +54,7 @@ export function useCollapsible(props: UseCollapsibleProps) {
54
54
  observer.observe(contentRef.current);
55
55
 
56
56
  return () => observer.disconnect();
57
- }, []);
57
+ }, [open]);
58
58
 
59
59
  useEffect(() => {
60
60
  if (!open) return;