@byeolnaerim/flex-layout 0.0.9 → 0.0.10

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 (122) hide show
  1. package/dist/flex-layout/components/FlexLayout.cjs +1 -110
  2. package/dist/flex-layout/components/FlexLayout.js +1 -85
  3. package/dist/flex-layout/components/FlexLayoutContainer.cjs +1 -262
  4. package/dist/flex-layout/components/FlexLayoutContainer.js +1 -232
  5. package/dist/flex-layout/components/FlexLayoutIFramePane.cjs +1 -68
  6. package/dist/flex-layout/components/FlexLayoutIFramePane.js +1 -44
  7. package/dist/flex-layout/components/FlexLayoutResizePanel.cjs +1 -246
  8. package/dist/flex-layout/components/FlexLayoutResizePanel.js +1 -216
  9. package/dist/flex-layout/components/FlexLayoutSplitScreen.cjs +1 -1252
  10. package/dist/flex-layout/components/FlexLayoutSplitScreen.js +1 -1236
  11. package/dist/flex-layout/components/FlexLayoutSplitScreenDragBox.cjs +1 -532
  12. package/dist/flex-layout/components/FlexLayoutSplitScreenDragBox.js +1 -509
  13. package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxContainer.cjs +1 -55
  14. package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxContainer.js +1 -25
  15. package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxItem.cjs +1 -63
  16. package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxItem.js +1 -33
  17. package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxTitleMore.cjs +1 -53
  18. package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxTitleMore.js +1 -23
  19. package/dist/flex-layout/components/FlexLayoutSplitScreenScrollBox.cjs +1 -133
  20. package/dist/flex-layout/components/FlexLayoutSplitScreenScrollBox.js +1 -107
  21. package/dist/flex-layout/components/FlexLayoutStickyBox.cjs +1 -245
  22. package/dist/flex-layout/components/FlexLayoutStickyBox.js +1 -229
  23. package/dist/flex-layout/components/index.cjs +1 -57
  24. package/dist/flex-layout/components/index.js +1 -17
  25. package/dist/flex-layout/hooks/index.cjs +1 -25
  26. package/dist/flex-layout/hooks/index.js +1 -3
  27. package/dist/flex-layout/hooks/useDrag.cjs +1 -289
  28. package/dist/flex-layout/hooks/useDrag.d.ts +15 -0
  29. package/dist/flex-layout/hooks/useDrag.js +1 -258
  30. package/dist/flex-layout/hooks/useFlexLayoutSplitScreen.cjs +1 -139
  31. package/dist/flex-layout/hooks/useFlexLayoutSplitScreen.js +1 -118
  32. package/dist/flex-layout/hooks/useListPaging.cjs +1 -212
  33. package/dist/flex-layout/hooks/useListPaging.js +1 -191
  34. package/dist/flex-layout/hooks/useSizes.cjs +1 -126
  35. package/dist/flex-layout/hooks/useSizes.js +1 -101
  36. package/dist/flex-layout/index.cjs +1 -31
  37. package/dist/flex-layout/index.js +1 -6
  38. package/dist/flex-layout/providers/FlexLayoutContext.cjs +1 -49
  39. package/dist/flex-layout/providers/FlexLayoutContext.js +1 -24
  40. package/dist/flex-layout/providers/FlexLayoutHooks.cjs +1 -276
  41. package/dist/flex-layout/providers/FlexLayoutHooks.d.ts +5 -1
  42. package/dist/flex-layout/providers/FlexLayoutHooks.js +1 -263
  43. package/dist/flex-layout/providers/index.cjs +1 -23
  44. package/dist/flex-layout/providers/index.js +1 -2
  45. package/dist/flex-layout/store/FlexLayoutContainerStore.cjs +1 -257
  46. package/dist/flex-layout/store/FlexLayoutContainerStore.js +1 -206
  47. package/dist/flex-layout/store/index.cjs +1 -23
  48. package/dist/flex-layout/store/index.js +1 -2
  49. package/dist/flex-layout/styles/FlexLayout.module.css +473 -416
  50. package/dist/flex-layout/types/FlexDirectionTypes.cjs +1 -17
  51. package/dist/flex-layout/types/FlexDirectionTypes.js +0 -1
  52. package/dist/flex-layout/types/FlexLayoutTypes.cjs +1 -17
  53. package/dist/flex-layout/types/FlexLayoutTypes.js +0 -1
  54. package/dist/flex-layout/utils/FlexLayoutUtils.cjs +1 -245
  55. package/dist/flex-layout/utils/FlexLayoutUtils.js +1 -211
  56. package/dist/flex-layout/utils/index.cjs +1 -23
  57. package/dist/flex-layout/utils/index.js +1 -2
  58. package/dist/index.cjs +1 -23
  59. package/dist/index.js +1 -2
  60. package/dist/types/css.d.cjs +0 -1
  61. package/dist/types/css.d.js +0 -1
  62. package/package.json +116 -113
  63. package/dist/flex-layout/components/FlexLayout.cjs.map +0 -1
  64. package/dist/flex-layout/components/FlexLayout.js.map +0 -1
  65. package/dist/flex-layout/components/FlexLayoutContainer.cjs.map +0 -1
  66. package/dist/flex-layout/components/FlexLayoutContainer.js.map +0 -1
  67. package/dist/flex-layout/components/FlexLayoutIFramePane.cjs.map +0 -1
  68. package/dist/flex-layout/components/FlexLayoutIFramePane.js.map +0 -1
  69. package/dist/flex-layout/components/FlexLayoutResizePanel.cjs.map +0 -1
  70. package/dist/flex-layout/components/FlexLayoutResizePanel.js.map +0 -1
  71. package/dist/flex-layout/components/FlexLayoutSplitScreen.cjs.map +0 -1
  72. package/dist/flex-layout/components/FlexLayoutSplitScreen.js.map +0 -1
  73. package/dist/flex-layout/components/FlexLayoutSplitScreenDragBox.cjs.map +0 -1
  74. package/dist/flex-layout/components/FlexLayoutSplitScreenDragBox.js.map +0 -1
  75. package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxContainer.cjs.map +0 -1
  76. package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxContainer.js.map +0 -1
  77. package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxItem.cjs.map +0 -1
  78. package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxItem.js.map +0 -1
  79. package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxTitleMore.cjs.map +0 -1
  80. package/dist/flex-layout/components/FlexLayoutSplitScreenDragBoxTitleMore.js.map +0 -1
  81. package/dist/flex-layout/components/FlexLayoutSplitScreenScrollBox.cjs.map +0 -1
  82. package/dist/flex-layout/components/FlexLayoutSplitScreenScrollBox.js.map +0 -1
  83. package/dist/flex-layout/components/FlexLayoutStickyBox.cjs.map +0 -1
  84. package/dist/flex-layout/components/FlexLayoutStickyBox.js.map +0 -1
  85. package/dist/flex-layout/components/index.cjs.map +0 -1
  86. package/dist/flex-layout/components/index.js.map +0 -1
  87. package/dist/flex-layout/hooks/index.cjs.map +0 -1
  88. package/dist/flex-layout/hooks/index.js.map +0 -1
  89. package/dist/flex-layout/hooks/useDrag.cjs.map +0 -1
  90. package/dist/flex-layout/hooks/useDrag.js.map +0 -1
  91. package/dist/flex-layout/hooks/useFlexLayoutSplitScreen.cjs.map +0 -1
  92. package/dist/flex-layout/hooks/useFlexLayoutSplitScreen.js.map +0 -1
  93. package/dist/flex-layout/hooks/useListPaging.cjs.map +0 -1
  94. package/dist/flex-layout/hooks/useListPaging.js.map +0 -1
  95. package/dist/flex-layout/hooks/useSizes.cjs.map +0 -1
  96. package/dist/flex-layout/hooks/useSizes.js.map +0 -1
  97. package/dist/flex-layout/index.cjs.map +0 -1
  98. package/dist/flex-layout/index.js.map +0 -1
  99. package/dist/flex-layout/providers/FlexLayoutContext.cjs.map +0 -1
  100. package/dist/flex-layout/providers/FlexLayoutContext.js.map +0 -1
  101. package/dist/flex-layout/providers/FlexLayoutHooks.cjs.map +0 -1
  102. package/dist/flex-layout/providers/FlexLayoutHooks.js.map +0 -1
  103. package/dist/flex-layout/providers/index.cjs.map +0 -1
  104. package/dist/flex-layout/providers/index.js.map +0 -1
  105. package/dist/flex-layout/store/FlexLayoutContainerStore.cjs.map +0 -1
  106. package/dist/flex-layout/store/FlexLayoutContainerStore.js.map +0 -1
  107. package/dist/flex-layout/store/index.cjs.map +0 -1
  108. package/dist/flex-layout/store/index.js.map +0 -1
  109. package/dist/flex-layout/types/FlexDirectionTypes.cjs.map +0 -1
  110. package/dist/flex-layout/types/FlexDirectionTypes.js.map +0 -1
  111. package/dist/flex-layout/types/FlexLayoutTypes.cjs.map +0 -1
  112. package/dist/flex-layout/types/FlexLayoutTypes.js.map +0 -1
  113. package/dist/flex-layout/utils/FlexLayoutUtils.cjs.map +0 -1
  114. package/dist/flex-layout/utils/FlexLayoutUtils.js.map +0 -1
  115. package/dist/flex-layout/utils/index.cjs.map +0 -1
  116. package/dist/flex-layout/utils/index.js.map +0 -1
  117. package/dist/index.cjs.map +0 -1
  118. package/dist/index.js.map +0 -1
  119. package/dist/metafile-cjs.json +0 -1
  120. package/dist/metafile-esm.json +0 -1
  121. package/dist/types/css.d.cjs.map +0 -1
  122. package/dist/types/css.d.js.map +0 -1
@@ -1,212 +1 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
- var useListPaging_exports = {};
20
- __export(useListPaging_exports, {
21
- useListPagingForSentinel: () => useListPagingForSentinel,
22
- usePaginationViewNumber: () => usePaginationViewNumber,
23
- usePagingHandler: () => usePagingHandler
24
- });
25
- module.exports = __toCommonJS(useListPaging_exports);
26
- var import_react = require("react");
27
- const useListPagingForSentinel = ({
28
- //initPageNumber,
29
- //initPageSize,
30
- onReachTerminal
31
- }) => {
32
- const [firstChildNode, setFirstChildNode] = (0, import_react.useState)(null);
33
- const [lastChildNode, setLastChildNode] = (0, import_react.useState)(null);
34
- const observerRef = (0, import_react.useRef)(null);
35
- const firstChildRef = (0, import_react.useCallback)((node) => {
36
- setFirstChildNode(node);
37
- }, []);
38
- const lastChildRef = (0, import_react.useCallback)((node) => {
39
- setLastChildNode(node);
40
- }, []);
41
- (0, import_react.useEffect)(() => {
42
- if (firstChildNode && observerRef.current)
43
- observerRef.current.unobserve(firstChildNode);
44
- if (lastChildNode && observerRef.current)
45
- observerRef.current.unobserve(lastChildNode);
46
- const handleIntersect = (entries, observer2) => {
47
- entries.forEach((entry) => {
48
- if (entry.isIntersecting) {
49
- if (entry.target === firstChildNode) {
50
- if (onReachTerminal)
51
- onReachTerminal({
52
- isFirst: true,
53
- isLast: false,
54
- observer: observer2
55
- });
56
- }
57
- if (entry.target === lastChildNode) {
58
- if (onReachTerminal)
59
- onReachTerminal({
60
- isFirst: false,
61
- isLast: true,
62
- observer: observer2
63
- });
64
- }
65
- }
66
- });
67
- };
68
- const observer = new IntersectionObserver(handleIntersect, {
69
- threshold: 0.1
70
- });
71
- observerRef.current = observer;
72
- if (firstChildNode) observer.observe(firstChildNode);
73
- if (lastChildNode) observer.observe(lastChildNode);
74
- return () => {
75
- if (observerRef.current) {
76
- observerRef.current.disconnect();
77
- }
78
- };
79
- }, [firstChildNode, lastChildNode]);
80
- return {
81
- firstChildRef,
82
- lastChildRef
83
- };
84
- };
85
- const usePaginationViewNumber = ({
86
- initPageNumber
87
- }) => {
88
- const [showCurrentPageNumber, setShowCurrentPageNumber] = (0, import_react.useState)(initPageNumber);
89
- const observerRef = (0, import_react.useRef)(null);
90
- const showCurrentPageObserveTarget = (0, import_react.useCallback)(
91
- (node) => {
92
- if (!node) return;
93
- if (!observerRef.current) {
94
- observerRef.current = new IntersectionObserver(
95
- (entries) => {
96
- entries.forEach((entry) => {
97
- if (entry.isIntersecting) {
98
- const pageIndexAttr = entry.target.getAttribute(
99
- "data-page-index"
100
- );
101
- if (!pageIndexAttr) return;
102
- const pageIndex = parseInt(pageIndexAttr, 10);
103
- setShowCurrentPageNumber(pageIndex);
104
- }
105
- });
106
- },
107
- {
108
- threshold: 0.1
109
- // 예: 10% 이상 보여야 intersect로 판단
110
- }
111
- );
112
- }
113
- observerRef.current.observe(node);
114
- },
115
- []
116
- );
117
- (0, import_react.useEffect)(() => {
118
- const currentObserver = observerRef.current;
119
- return () => {
120
- if (currentObserver) {
121
- currentObserver.disconnect();
122
- }
123
- };
124
- }, []);
125
- return {
126
- showCurrentPageNumber,
127
- showCurrentPageObserveTarget
128
- };
129
- };
130
- const usePagingHandler = ({
131
- lastCallPageNumber,
132
- dataListRef
133
- }) => {
134
- const jumpingPageNumberRef = (0, import_react.useRef)(lastCallPageNumber);
135
- const paginationScrollIntoViewTarget = (0, import_react.useRef)({});
136
- const pageNumberRef = (0, import_react.useRef)(lastCallPageNumber);
137
- const resetJumpTimerIdRef = (0, import_react.useRef)(
138
- null
139
- );
140
- const clearResetTimer = (0, import_react.useCallback)(() => {
141
- if (resetJumpTimerIdRef.current !== null) {
142
- window.clearTimeout(resetJumpTimerIdRef.current);
143
- resetJumpTimerIdRef.current = null;
144
- }
145
- }, []);
146
- const armResetTimer = (0, import_react.useCallback)(() => {
147
- clearResetTimer();
148
- resetJumpTimerIdRef.current = window.setTimeout(() => {
149
- jumpingPageNumberRef.current = null;
150
- resetJumpTimerIdRef.current = null;
151
- }, 1e3);
152
- }, [clearResetTimer]);
153
- (0, import_react.useEffect)(() => {
154
- return () => {
155
- clearResetTimer();
156
- };
157
- }, [clearResetTimer]);
158
- const setPaginationRef = (0, import_react.useCallback)(
159
- (i) => (node) => {
160
- if (!node) return;
161
- paginationScrollIntoViewTarget.current[i] = node;
162
- if (jumpingPageNumberRef.current !== null && i === jumpingPageNumberRef.current) {
163
- node.scrollIntoView({
164
- behavior: "instant",
165
- // 필요한 경우 'smooth' 등으로 수정 가능
166
- block: "start"
167
- });
168
- jumpingPageNumberRef.current = null;
169
- }
170
- },
171
- []
172
- );
173
- const handleReachTerminal = ({ isFirst, isLast, observer }, dataCallFetch) => {
174
- if (dataListRef.current.length === 0) return;
175
- if (jumpingPageNumberRef.current != null) return;
176
- if (!isFirst && !isLast) return;
177
- const callPageNumber = isFirst ? Math.max(pageNumberRef.current - 1, 0) : pageNumberRef.current + 1;
178
- if (dataListRef.current[callPageNumber] != null && (dataListRef.current[callPageNumber]?.length || 0) > 0)
179
- return;
180
- jumpingPageNumberRef.current = callPageNumber;
181
- armResetTimer();
182
- dataCallFetch(callPageNumber);
183
- };
184
- const handleClickPageChange = (page, dataCallFetch) => {
185
- const pageData = dataListRef.current[page];
186
- if (pageData != null && Array.isArray(pageData) && pageData.length > 0) {
187
- paginationScrollIntoViewTarget.current[page]?.scrollIntoView({
188
- behavior: "smooth",
189
- block: "start"
190
- });
191
- return;
192
- }
193
- jumpingPageNumberRef.current = page;
194
- armResetTimer();
195
- dataCallFetch(page);
196
- };
197
- return {
198
- jumpingPageNumberRef,
199
- paginationScrollIntoViewTarget,
200
- pageNumberRef,
201
- setPaginationRef,
202
- handleReachTerminal,
203
- handleClickPageChange
204
- };
205
- };
206
- // Annotate the CommonJS export names for ESM import in node:
207
- 0 && (module.exports = {
208
- useListPagingForSentinel,
209
- usePaginationViewNumber,
210
- usePagingHandler
211
- });
212
- //# sourceMappingURL=useListPaging.cjs.map
1
+ "use strict";var h=Object.defineProperty;var T=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var R=Object.prototype.hasOwnProperty;var I=(u,e)=>{for(var l in e)h(u,l,{get:e[l],enumerable:!0})},P=(u,e,l,t)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of p(e))!R.call(u,s)&&s!==l&&h(u,s,{get:()=>e[s],enumerable:!(t=T(e,s))||t.enumerable});return u};var C=u=>P(h({},"__esModule",{value:!0}),u);var O={};I(O,{useListPagingForSentinel:()=>E,usePaginationViewNumber:()=>w,usePagingHandler:()=>N});module.exports=C(O);var r=require("react");const E=({onReachTerminal:u})=>{const[e,l]=(0,r.useState)(null),[t,s]=(0,r.useState)(null),n=(0,r.useRef)(null),a=(0,r.useCallback)(o=>{l(o)},[]),b=(0,r.useCallback)(o=>{s(o)},[]);return(0,r.useEffect)(()=>{e&&n.current&&n.current.unobserve(e),t&&n.current&&n.current.unobserve(t);const o=(d,i)=>{d.forEach(c=>{c.isIntersecting&&(c.target===e&&u&&u({isFirst:!0,isLast:!1,observer:i}),c.target===t&&u&&u({isFirst:!1,isLast:!0,observer:i}))})},f=new IntersectionObserver(o,{threshold:.1});return n.current=f,e&&f.observe(e),t&&f.observe(t),()=>{n.current&&n.current.disconnect()}},[e,t]),{firstChildRef:a,lastChildRef:b}},w=({initPageNumber:u})=>{const[e,l]=(0,r.useState)(u),t=(0,r.useRef)(null),s=(0,r.useCallback)(n=>{n&&(t.current||(t.current=new IntersectionObserver(a=>{a.forEach(b=>{if(b.isIntersecting){const o=b.target.getAttribute("data-page-index");if(!o)return;const f=parseInt(o,10);l(f)}})},{threshold:.1})),t.current.observe(n))},[]);return(0,r.useEffect)(()=>{const n=t.current;return()=>{n&&n.disconnect()}},[]),{showCurrentPageNumber:e,showCurrentPageObserveTarget:s}},N=({lastCallPageNumber:u,dataListRef:e})=>{const l=(0,r.useRef)(u),t=(0,r.useRef)({}),s=(0,r.useRef)(u),n=(0,r.useRef)(null),a=(0,r.useCallback)(()=>{n.current!==null&&(window.clearTimeout(n.current),n.current=null)},[]),b=(0,r.useCallback)(()=>{a(),n.current=window.setTimeout(()=>{l.current=null,n.current=null},1e3)},[a]);(0,r.useEffect)(()=>()=>{a()},[a]);const o=(0,r.useCallback)(i=>c=>{c&&(t.current[i]=c,l.current!==null&&i===l.current&&(c.scrollIntoView({behavior:"instant",block:"start"}),l.current=null))},[]);return{jumpingPageNumberRef:l,paginationScrollIntoViewTarget:t,pageNumberRef:s,setPaginationRef:o,handleReachTerminal:({isFirst:i,isLast:c,observer:m},v)=>{if(e.current.length===0||l.current!=null||!i&&!c)return;const g=i?Math.max(s.current-1,0):s.current+1;e.current[g]!=null&&(e.current[g]?.length||0)>0||(l.current=g,b(),v(g))},handleClickPageChange:(i,c)=>{const m=e.current[i];if(m!=null&&Array.isArray(m)&&m.length>0){t.current[i]?.scrollIntoView({behavior:"smooth",block:"start"});return}l.current=i,b(),c(i)}}};0&&(module.exports={useListPagingForSentinel,usePaginationViewNumber,usePagingHandler});
@@ -1,191 +1 @@
1
- import {
2
- useCallback,
3
- useEffect,
4
- useRef,
5
- useState
6
- } from "react";
7
- const useListPagingForSentinel = ({
8
- //initPageNumber,
9
- //initPageSize,
10
- onReachTerminal
11
- }) => {
12
- const [firstChildNode, setFirstChildNode] = useState(null);
13
- const [lastChildNode, setLastChildNode] = useState(null);
14
- const observerRef = useRef(null);
15
- const firstChildRef = useCallback((node) => {
16
- setFirstChildNode(node);
17
- }, []);
18
- const lastChildRef = useCallback((node) => {
19
- setLastChildNode(node);
20
- }, []);
21
- useEffect(() => {
22
- if (firstChildNode && observerRef.current)
23
- observerRef.current.unobserve(firstChildNode);
24
- if (lastChildNode && observerRef.current)
25
- observerRef.current.unobserve(lastChildNode);
26
- const handleIntersect = (entries, observer2) => {
27
- entries.forEach((entry) => {
28
- if (entry.isIntersecting) {
29
- if (entry.target === firstChildNode) {
30
- if (onReachTerminal)
31
- onReachTerminal({
32
- isFirst: true,
33
- isLast: false,
34
- observer: observer2
35
- });
36
- }
37
- if (entry.target === lastChildNode) {
38
- if (onReachTerminal)
39
- onReachTerminal({
40
- isFirst: false,
41
- isLast: true,
42
- observer: observer2
43
- });
44
- }
45
- }
46
- });
47
- };
48
- const observer = new IntersectionObserver(handleIntersect, {
49
- threshold: 0.1
50
- });
51
- observerRef.current = observer;
52
- if (firstChildNode) observer.observe(firstChildNode);
53
- if (lastChildNode) observer.observe(lastChildNode);
54
- return () => {
55
- if (observerRef.current) {
56
- observerRef.current.disconnect();
57
- }
58
- };
59
- }, [firstChildNode, lastChildNode]);
60
- return {
61
- firstChildRef,
62
- lastChildRef
63
- };
64
- };
65
- const usePaginationViewNumber = ({
66
- initPageNumber
67
- }) => {
68
- const [showCurrentPageNumber, setShowCurrentPageNumber] = useState(initPageNumber);
69
- const observerRef = useRef(null);
70
- const showCurrentPageObserveTarget = useCallback(
71
- (node) => {
72
- if (!node) return;
73
- if (!observerRef.current) {
74
- observerRef.current = new IntersectionObserver(
75
- (entries) => {
76
- entries.forEach((entry) => {
77
- if (entry.isIntersecting) {
78
- const pageIndexAttr = entry.target.getAttribute(
79
- "data-page-index"
80
- );
81
- if (!pageIndexAttr) return;
82
- const pageIndex = parseInt(pageIndexAttr, 10);
83
- setShowCurrentPageNumber(pageIndex);
84
- }
85
- });
86
- },
87
- {
88
- threshold: 0.1
89
- // 예: 10% 이상 보여야 intersect로 판단
90
- }
91
- );
92
- }
93
- observerRef.current.observe(node);
94
- },
95
- []
96
- );
97
- useEffect(() => {
98
- const currentObserver = observerRef.current;
99
- return () => {
100
- if (currentObserver) {
101
- currentObserver.disconnect();
102
- }
103
- };
104
- }, []);
105
- return {
106
- showCurrentPageNumber,
107
- showCurrentPageObserveTarget
108
- };
109
- };
110
- const usePagingHandler = ({
111
- lastCallPageNumber,
112
- dataListRef
113
- }) => {
114
- const jumpingPageNumberRef = useRef(lastCallPageNumber);
115
- const paginationScrollIntoViewTarget = useRef({});
116
- const pageNumberRef = useRef(lastCallPageNumber);
117
- const resetJumpTimerIdRef = useRef(
118
- null
119
- );
120
- const clearResetTimer = useCallback(() => {
121
- if (resetJumpTimerIdRef.current !== null) {
122
- window.clearTimeout(resetJumpTimerIdRef.current);
123
- resetJumpTimerIdRef.current = null;
124
- }
125
- }, []);
126
- const armResetTimer = useCallback(() => {
127
- clearResetTimer();
128
- resetJumpTimerIdRef.current = window.setTimeout(() => {
129
- jumpingPageNumberRef.current = null;
130
- resetJumpTimerIdRef.current = null;
131
- }, 1e3);
132
- }, [clearResetTimer]);
133
- useEffect(() => {
134
- return () => {
135
- clearResetTimer();
136
- };
137
- }, [clearResetTimer]);
138
- const setPaginationRef = useCallback(
139
- (i) => (node) => {
140
- if (!node) return;
141
- paginationScrollIntoViewTarget.current[i] = node;
142
- if (jumpingPageNumberRef.current !== null && i === jumpingPageNumberRef.current) {
143
- node.scrollIntoView({
144
- behavior: "instant",
145
- // 필요한 경우 'smooth' 등으로 수정 가능
146
- block: "start"
147
- });
148
- jumpingPageNumberRef.current = null;
149
- }
150
- },
151
- []
152
- );
153
- const handleReachTerminal = ({ isFirst, isLast, observer }, dataCallFetch) => {
154
- if (dataListRef.current.length === 0) return;
155
- if (jumpingPageNumberRef.current != null) return;
156
- if (!isFirst && !isLast) return;
157
- const callPageNumber = isFirst ? Math.max(pageNumberRef.current - 1, 0) : pageNumberRef.current + 1;
158
- if (dataListRef.current[callPageNumber] != null && (dataListRef.current[callPageNumber]?.length || 0) > 0)
159
- return;
160
- jumpingPageNumberRef.current = callPageNumber;
161
- armResetTimer();
162
- dataCallFetch(callPageNumber);
163
- };
164
- const handleClickPageChange = (page, dataCallFetch) => {
165
- const pageData = dataListRef.current[page];
166
- if (pageData != null && Array.isArray(pageData) && pageData.length > 0) {
167
- paginationScrollIntoViewTarget.current[page]?.scrollIntoView({
168
- behavior: "smooth",
169
- block: "start"
170
- });
171
- return;
172
- }
173
- jumpingPageNumberRef.current = page;
174
- armResetTimer();
175
- dataCallFetch(page);
176
- };
177
- return {
178
- jumpingPageNumberRef,
179
- paginationScrollIntoViewTarget,
180
- pageNumberRef,
181
- setPaginationRef,
182
- handleReachTerminal,
183
- handleClickPageChange
184
- };
185
- };
186
- export {
187
- useListPagingForSentinel,
188
- usePaginationViewNumber,
189
- usePagingHandler
190
- };
191
- //# sourceMappingURL=useListPaging.js.map
1
+ import{useCallback as f,useEffect as d,useRef as m,useState as v}from"react";const P=({onReachTerminal:i})=>{const[n,u]=v(null),[r,o]=v(null),e=m(null),c=f(s=>{u(s)},[]),a=f(s=>{o(s)},[]);return d(()=>{n&&e.current&&e.current.unobserve(n),r&&e.current&&e.current.unobserve(r);const s=(T,t)=>{T.forEach(l=>{l.isIntersecting&&(l.target===n&&i&&i({isFirst:!0,isLast:!1,observer:t}),l.target===r&&i&&i({isFirst:!1,isLast:!0,observer:t}))})},b=new IntersectionObserver(s,{threshold:.1});return e.current=b,n&&b.observe(n),r&&b.observe(r),()=>{e.current&&e.current.disconnect()}},[n,r]),{firstChildRef:c,lastChildRef:a}},C=({initPageNumber:i})=>{const[n,u]=v(i),r=m(null),o=f(e=>{e&&(r.current||(r.current=new IntersectionObserver(c=>{c.forEach(a=>{if(a.isIntersecting){const s=a.target.getAttribute("data-page-index");if(!s)return;const b=parseInt(s,10);u(b)}})},{threshold:.1})),r.current.observe(e))},[]);return d(()=>{const e=r.current;return()=>{e&&e.disconnect()}},[]),{showCurrentPageNumber:n,showCurrentPageObserveTarget:o}},E=({lastCallPageNumber:i,dataListRef:n})=>{const u=m(i),r=m({}),o=m(i),e=m(null),c=f(()=>{e.current!==null&&(window.clearTimeout(e.current),e.current=null)},[]),a=f(()=>{c(),e.current=window.setTimeout(()=>{u.current=null,e.current=null},1e3)},[c]);d(()=>()=>{c()},[c]);const s=f(t=>l=>{l&&(r.current[t]=l,u.current!==null&&t===u.current&&(l.scrollIntoView({behavior:"instant",block:"start"}),u.current=null))},[]);return{jumpingPageNumberRef:u,paginationScrollIntoViewTarget:r,pageNumberRef:o,setPaginationRef:s,handleReachTerminal:({isFirst:t,isLast:l,observer:g},p)=>{if(n.current.length===0||u.current!=null||!t&&!l)return;const h=t?Math.max(o.current-1,0):o.current+1;n.current[h]!=null&&(n.current[h]?.length||0)>0||(u.current=h,a(),p(h))},handleClickPageChange:(t,l)=>{const g=n.current[t];if(g!=null&&Array.isArray(g)&&g.length>0){r.current[t]?.scrollIntoView({behavior:"smooth",block:"start"});return}u.current=t,a(),l(t)}}};export{P as useListPagingForSentinel,C as usePaginationViewNumber,E as usePagingHandler};
@@ -1,126 +1 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
- var useSizes_exports = {};
20
- __export(useSizes_exports, {
21
- useFirstChildSize: () => useFirstChildSize,
22
- useSize: () => useSize
23
- });
24
- module.exports = __toCommonJS(useSizes_exports);
25
- var import_react = require("react");
26
- var import_rxjs = require("rxjs");
27
- const useSize = (sizeName) => {
28
- const ref = (0, import_react.useRef)(null);
29
- const [size, setSize] = (0, import_react.useState)(void 0);
30
- (0, import_react.useLayoutEffect)(() => {
31
- if (!ref.current) return;
32
- const handleResize = () => {
33
- if (ref.current) {
34
- const newSize = ref.current.getBoundingClientRect()[sizeName];
35
- setSize(newSize);
36
- }
37
- };
38
- handleResize();
39
- const resizeObserver = new ResizeObserver(() => {
40
- handleResize();
41
- });
42
- resizeObserver.observe(ref.current);
43
- window.addEventListener("resize", handleResize);
44
- return () => {
45
- resizeObserver.disconnect();
46
- window.removeEventListener("resize", handleResize);
47
- };
48
- }, [sizeName]);
49
- return { ref, size };
50
- };
51
- const useFirstChildSize = (sizeName) => {
52
- const ref = (0, import_react.useRef)(null);
53
- const [sizes, setSizes] = (0, import_react.useState)();
54
- (0, import_react.useEffect)(() => {
55
- if (!ref.current || !ref.current.children[0]) return;
56
- if (!sizes || sizes.length === 0) {
57
- setSizes([
58
- ref.current.getBoundingClientRect()[sizeName],
59
- ref.current.children[0].getBoundingClientRect()[sizeName]
60
- ]);
61
- }
62
- }, []);
63
- (0, import_react.useEffect)(() => {
64
- if (!ref.current || !ref.current.children[0]) return;
65
- const childrenChangeObserver = new MutationObserver(
66
- (mutationList, observer) => {
67
- mutationList.forEach((mutation) => {
68
- if (!ref.current || !sizes || !ref.current.children[0])
69
- return;
70
- const newSize = ref.current.getBoundingClientRect()[sizeName];
71
- setSizes([
72
- newSize,
73
- ref.current.children[0].getBoundingClientRect()[sizeName]
74
- ]);
75
- });
76
- }
77
- );
78
- childrenChangeObserver.observe(ref.current, {
79
- childList: true,
80
- subtree: true
81
- });
82
- let isFocus = false;
83
- const windowResizeSubscribe = (0, import_rxjs.fromEvent)(window, "resize").pipe(
84
- (0, import_rxjs.distinctUntilChanged)(),
85
- (0, import_rxjs.filter)(
86
- () => document.activeElement?.tagName !== "INPUT" && !isFocus
87
- )
88
- ).subscribe((ev) => {
89
- if (!ref.current || !ref.current.children[0]) return;
90
- setSizes([
91
- ref.current.getBoundingClientRect()[sizeName],
92
- ref.current.children[0].getBoundingClientRect()[sizeName]
93
- ]);
94
- });
95
- const documentFocusoutSubscribe = (0, import_rxjs.fromEvent)(
96
- document,
97
- "focusout"
98
- ).pipe(
99
- (0, import_rxjs.auditTime)(1e3),
100
- (0, import_rxjs.filter)((ev) => document.activeElement?.tagName !== "INPUT")
101
- ).subscribe({
102
- next: () => {
103
- if (isFocus) isFocus = false;
104
- }
105
- });
106
- const documentFocusinSubscribe = (0, import_rxjs.fromEvent)(
107
- document,
108
- "focusin"
109
- ).subscribe({
110
- next: (ev) => isFocus = ev.target.tagName === "INPUT"
111
- });
112
- return () => {
113
- windowResizeSubscribe.unsubscribe();
114
- documentFocusoutSubscribe.unsubscribe();
115
- documentFocusinSubscribe.unsubscribe();
116
- childrenChangeObserver.disconnect();
117
- };
118
- }, [sizeName, sizes]);
119
- return { ref, sizes };
120
- };
121
- // Annotate the CommonJS export names for ESM import in node:
122
- 0 && (module.exports = {
123
- useFirstChildSize,
124
- useSize
125
- });
126
- //# sourceMappingURL=useSizes.cjs.map
1
+ "use strict";var b=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var v=Object.prototype.hasOwnProperty;var h=(n,e)=>{for(var r in e)b(n,r,{get:e[r],enumerable:!0})},R=(n,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of g(e))!v.call(n,t)&&t!==r&&b(n,t,{get:()=>e[t],enumerable:!(i=m(e,t))||i.enumerable});return n};var E=n=>R(b({},"__esModule",{value:!0}),n);var C={};h(C,{useFirstChildSize:()=>O,useSize:()=>w});module.exports=E(C);var u=require("react"),c=require("rxjs");const w=n=>{const e=(0,u.useRef)(null),[r,i]=(0,u.useState)(void 0);return(0,u.useLayoutEffect)(()=>{if(!e.current)return;const t=()=>{if(e.current){const d=e.current.getBoundingClientRect()[n];i(d)}};t();const s=new ResizeObserver(()=>{t()});return s.observe(e.current),window.addEventListener("resize",t),()=>{s.disconnect(),window.removeEventListener("resize",t)}},[n]),{ref:e,size:r}},O=n=>{const e=(0,u.useRef)(null),[r,i]=(0,u.useState)();return(0,u.useEffect)(()=>{!e.current||!e.current.children[0]||(!r||r.length===0)&&i([e.current.getBoundingClientRect()[n],e.current.children[0].getBoundingClientRect()[n]])},[]),(0,u.useEffect)(()=>{if(!e.current||!e.current.children[0])return;const t=new MutationObserver((o,M)=>{o.forEach(S=>{if(!e.current||!r||!e.current.children[0])return;const a=e.current.getBoundingClientRect()[n];i([a,e.current.children[0].getBoundingClientRect()[n]])})});t.observe(e.current,{childList:!0,subtree:!0});let s=!1;const d=(0,c.fromEvent)(window,"resize").pipe((0,c.distinctUntilChanged)(),(0,c.filter)(()=>document.activeElement?.tagName!=="INPUT"&&!s)).subscribe(o=>{!e.current||!e.current.children[0]||i([e.current.getBoundingClientRect()[n],e.current.children[0].getBoundingClientRect()[n]])}),f=(0,c.fromEvent)(document,"focusout").pipe((0,c.auditTime)(1e3),(0,c.filter)(o=>document.activeElement?.tagName!=="INPUT")).subscribe({next:()=>{s&&(s=!1)}}),l=(0,c.fromEvent)(document,"focusin").subscribe({next:o=>s=o.target.tagName==="INPUT"});return()=>{d.unsubscribe(),f.unsubscribe(),l.unsubscribe(),t.disconnect()}},[n,r]),{ref:e,sizes:r}};0&&(module.exports={useFirstChildSize,useSize});
@@ -1,101 +1 @@
1
- import { useEffect, useLayoutEffect, useRef, useState } from "react";
2
- import { auditTime, distinctUntilChanged, filter, fromEvent } from "rxjs";
3
- const useSize = (sizeName) => {
4
- const ref = useRef(null);
5
- const [size, setSize] = useState(void 0);
6
- useLayoutEffect(() => {
7
- if (!ref.current) return;
8
- const handleResize = () => {
9
- if (ref.current) {
10
- const newSize = ref.current.getBoundingClientRect()[sizeName];
11
- setSize(newSize);
12
- }
13
- };
14
- handleResize();
15
- const resizeObserver = new ResizeObserver(() => {
16
- handleResize();
17
- });
18
- resizeObserver.observe(ref.current);
19
- window.addEventListener("resize", handleResize);
20
- return () => {
21
- resizeObserver.disconnect();
22
- window.removeEventListener("resize", handleResize);
23
- };
24
- }, [sizeName]);
25
- return { ref, size };
26
- };
27
- const useFirstChildSize = (sizeName) => {
28
- const ref = useRef(null);
29
- const [sizes, setSizes] = useState();
30
- useEffect(() => {
31
- if (!ref.current || !ref.current.children[0]) return;
32
- if (!sizes || sizes.length === 0) {
33
- setSizes([
34
- ref.current.getBoundingClientRect()[sizeName],
35
- ref.current.children[0].getBoundingClientRect()[sizeName]
36
- ]);
37
- }
38
- }, []);
39
- useEffect(() => {
40
- if (!ref.current || !ref.current.children[0]) return;
41
- const childrenChangeObserver = new MutationObserver(
42
- (mutationList, observer) => {
43
- mutationList.forEach((mutation) => {
44
- if (!ref.current || !sizes || !ref.current.children[0])
45
- return;
46
- const newSize = ref.current.getBoundingClientRect()[sizeName];
47
- setSizes([
48
- newSize,
49
- ref.current.children[0].getBoundingClientRect()[sizeName]
50
- ]);
51
- });
52
- }
53
- );
54
- childrenChangeObserver.observe(ref.current, {
55
- childList: true,
56
- subtree: true
57
- });
58
- let isFocus = false;
59
- const windowResizeSubscribe = fromEvent(window, "resize").pipe(
60
- distinctUntilChanged(),
61
- filter(
62
- () => document.activeElement?.tagName !== "INPUT" && !isFocus
63
- )
64
- ).subscribe((ev) => {
65
- if (!ref.current || !ref.current.children[0]) return;
66
- setSizes([
67
- ref.current.getBoundingClientRect()[sizeName],
68
- ref.current.children[0].getBoundingClientRect()[sizeName]
69
- ]);
70
- });
71
- const documentFocusoutSubscribe = fromEvent(
72
- document,
73
- "focusout"
74
- ).pipe(
75
- auditTime(1e3),
76
- filter((ev) => document.activeElement?.tagName !== "INPUT")
77
- ).subscribe({
78
- next: () => {
79
- if (isFocus) isFocus = false;
80
- }
81
- });
82
- const documentFocusinSubscribe = fromEvent(
83
- document,
84
- "focusin"
85
- ).subscribe({
86
- next: (ev) => isFocus = ev.target.tagName === "INPUT"
87
- });
88
- return () => {
89
- windowResizeSubscribe.unsubscribe();
90
- documentFocusoutSubscribe.unsubscribe();
91
- documentFocusinSubscribe.unsubscribe();
92
- childrenChangeObserver.disconnect();
93
- };
94
- }, [sizeName, sizes]);
95
- return { ref, sizes };
96
- };
97
- export {
98
- useFirstChildSize,
99
- useSize
100
- };
101
- //# sourceMappingURL=useSizes.js.map
1
+ import{useEffect as d,useLayoutEffect as v,useRef as b,useState as f}from"react";import{auditTime as h,distinctUntilChanged as R,filter as l,fromEvent as o}from"rxjs";const M=n=>{const e=b(null),[t,u]=f(void 0);return v(()=>{if(!e.current)return;const r=()=>{if(e.current){const s=e.current.getBoundingClientRect()[n];u(s)}};r();const c=new ResizeObserver(()=>{r()});return c.observe(e.current),window.addEventListener("resize",r),()=>{c.disconnect(),window.removeEventListener("resize",r)}},[n]),{ref:e,size:t}},S=n=>{const e=b(null),[t,u]=f();return d(()=>{!e.current||!e.current.children[0]||(!t||t.length===0)&&u([e.current.getBoundingClientRect()[n],e.current.children[0].getBoundingClientRect()[n]])},[]),d(()=>{if(!e.current||!e.current.children[0])return;const r=new MutationObserver((i,E)=>{i.forEach(w=>{if(!e.current||!t||!e.current.children[0])return;const g=e.current.getBoundingClientRect()[n];u([g,e.current.children[0].getBoundingClientRect()[n]])})});r.observe(e.current,{childList:!0,subtree:!0});let c=!1;const s=o(window,"resize").pipe(R(),l(()=>document.activeElement?.tagName!=="INPUT"&&!c)).subscribe(i=>{!e.current||!e.current.children[0]||u([e.current.getBoundingClientRect()[n],e.current.children[0].getBoundingClientRect()[n]])}),a=o(document,"focusout").pipe(h(1e3),l(i=>document.activeElement?.tagName!=="INPUT")).subscribe({next:()=>{c&&(c=!1)}}),m=o(document,"focusin").subscribe({next:i=>c=i.target.tagName==="INPUT"});return()=>{s.unsubscribe(),a.unsubscribe(),m.unsubscribe(),r.disconnect()}},[n,t]),{ref:e,sizes:t}};export{S as useFirstChildSize,M as useSize};
@@ -1,31 +1 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __copyProps = (to, from, except, desc) => {
7
- if (from && typeof from === "object" || typeof from === "function") {
8
- for (let key of __getOwnPropNames(from))
9
- if (!__hasOwnProp.call(to, key) && key !== except)
10
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
11
- }
12
- return to;
13
- };
14
- var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
15
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
16
- var flex_layout_exports = {};
17
- module.exports = __toCommonJS(flex_layout_exports);
18
- __reExport(flex_layout_exports, require("./components"), module.exports);
19
- __reExport(flex_layout_exports, require("./hooks"), module.exports);
20
- __reExport(flex_layout_exports, require("./providers"), module.exports);
21
- __reExport(flex_layout_exports, require("./utils"), module.exports);
22
- __reExport(flex_layout_exports, require("./store"), module.exports);
23
- // Annotate the CommonJS export names for ESM import in node:
24
- 0 && (module.exports = {
25
- ...require("./components"),
26
- ...require("./hooks"),
27
- ...require("./providers"),
28
- ...require("./utils"),
29
- ...require("./store")
30
- });
31
- //# sourceMappingURL=index.cjs.map
1
+ "use strict";var a=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var c=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var t=(f,e,p,x)=>{if(e&&typeof e=="object"||typeof e=="function")for(let m of c(e))!d.call(f,m)&&m!==p&&a(f,m,{get:()=>e[m],enumerable:!(x=b(e,m))||x.enumerable});return f},r=(f,e,p)=>(t(f,e,"default"),p&&t(p,e,"default"));var g=f=>t(a({},"__esModule",{value:!0}),f);var o={};module.exports=g(o);r(o,require("./components"),module.exports);r(o,require("./hooks"),module.exports);r(o,require("./providers"),module.exports);r(o,require("./utils"),module.exports);r(o,require("./store"),module.exports);0&&(module.exports={...require("./components"),...require("./hooks"),...require("./providers"),...require("./utils"),...require("./store")});
@@ -1,6 +1 @@
1
- export * from "./components";
2
- export * from "./hooks";
3
- export * from "./providers";
4
- export * from "./utils";
5
- export * from "./store";
6
- //# sourceMappingURL=index.js.map
1
+ export*from"./components";export*from"./hooks";export*from"./providers";export*from"./utils";export*from"./store";