@ehfuse/forma 3.0.1 → 3.0.3

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 (11) hide show
  1. package/dist/esm/src/hooks/useBreakpoint.d.ts.map +1 -1
  2. package/dist/esm/src/hooks/useBreakpoint.js +68 -2
  3. package/dist/esm/src/hooks/useBreakpoint.js.map +1 -1
  4. package/dist/esm/src/types/breakpoint.d.ts +50 -4
  5. package/dist/esm/src/types/breakpoint.d.ts.map +1 -1
  6. package/dist/src/hooks/useBreakpoint.d.ts.map +1 -1
  7. package/dist/src/hooks/useBreakpoint.js +68 -2
  8. package/dist/src/hooks/useBreakpoint.js.map +1 -1
  9. package/dist/src/types/breakpoint.d.ts +50 -4
  10. package/dist/src/types/breakpoint.d.ts.map +1 -1
  11. package/package.json +1 -1
package/dist/esm/src/hooks/useBreakpoint.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useBreakpoint.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useBreakpoint.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAGH,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAe/D;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,aAAa,QAAO,mBA8EhC,CAAC"}
1
+ {"version":3,"file":"useBreakpoint.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useBreakpoint.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAGH,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AA0B/D;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,aAAa,QAAO,mBA0IhC,CAAC"}
package/dist/esm/src/hooks/useBreakpoint.js CHANGED
@@ -22,7 +22,7 @@
22
22
  * SOFTWARE.
23
23
  */
24
24
  import { useState, useEffect } from "react";
25
- // 브레이크포인트 정의 (픽셀 단위)
25
+ // 가로 브레이크포인트 정의 (픽셀 단위)
26
26
  const breakpoints = {
27
27
  xxxxs: 224, // 14rem
28
28
  xxxs: 256, // 16rem
@@ -34,6 +34,16 @@ const breakpoints = {
34
34
  xl: 1280, // 80rem
35
35
  xxl: 1536, // 96rem
36
36
  };
37
+ // 세로 브레이크포인트 정의 (픽셀 단위)
38
+ const heightBreakpoints = {
39
+ hxxs: 400,
40
+ hxs: 500,
41
+ hsm: 600,
42
+ hmd: 768,
43
+ hlg: 900,
44
+ hxl: 1080,
45
+ hxxl: 1080, // hxl과 동일
46
+ };
37
47
  /**
38
48
  * useBreakpoint Hook
39
49
  *
@@ -61,16 +71,18 @@ const breakpoints = {
61
71
  */
62
72
  export const useBreakpoint = () => {
63
73
  const [windowWidth, setWindowWidth] = useState(typeof window !== "undefined" ? window.innerWidth : 0);
74
+ const [windowHeight, setWindowHeight] = useState(typeof window !== "undefined" ? window.innerHeight : 0);
64
75
  useEffect(() => {
65
76
  if (typeof window === "undefined")
66
77
  return;
67
78
  const handleResize = () => {
68
79
  setWindowWidth(window.innerWidth);
80
+ setWindowHeight(window.innerHeight);
69
81
  };
70
82
  window.addEventListener("resize", handleResize);
71
83
  return () => window.removeEventListener("resize", handleResize);
72
84
  }, []);
73
- // 각 브레이크포인트별 미디어쿼리 결과 (해당 브레이크포인트 이하인지)
85
+ // 가로 브레이크포인트별 미디어쿼리 결과 (해당 브레이크포인트 이하인지)
74
86
  const xxxxs = windowWidth < breakpoints.xxxs;
75
87
  const xxxs = windowWidth < breakpoints.xxs;
76
88
  const xxs = windowWidth < breakpoints.xs;
@@ -89,8 +101,24 @@ export const useBreakpoint = () => {
89
101
  const lgUp = windowWidth >= breakpoints.lg;
90
102
  const xlUp = windowWidth >= breakpoints.xl;
91
103
  const xxlUp = windowWidth >= breakpoints.xxl;
104
+ // 세로 브레이크포인트별 미디어쿼리 결과 (해당 브레이크포인트 이하인지)
105
+ const hxxs = windowHeight < heightBreakpoints.hxs;
106
+ const hxs = windowHeight < heightBreakpoints.hsm;
107
+ const hsm = windowHeight < heightBreakpoints.hmd;
108
+ const hmd = windowHeight < heightBreakpoints.hlg;
109
+ const hlg = windowHeight < heightBreakpoints.hxl;
110
+ const hxl = windowHeight < heightBreakpoints.hxxl;
111
+ const hxxl = windowHeight >= heightBreakpoints.hxxl;
112
+ const hxxsUp = windowHeight >= heightBreakpoints.hxxs;
113
+ const hxsUp = windowHeight >= heightBreakpoints.hxs;
114
+ const hsmUp = windowHeight >= heightBreakpoints.hsm;
115
+ const hmdUp = windowHeight >= heightBreakpoints.hmd;
116
+ const hlgUp = windowHeight >= heightBreakpoints.hlg;
117
+ const hxlUp = windowHeight >= heightBreakpoints.hxl;
118
+ const hxxlUp = windowHeight >= heightBreakpoints.hxxl;
92
119
  // 객체 형태로 반환하여 breakpoint.sm 식으로 접근 가능
93
120
  return {
121
+ // 가로 브레이크포인트
94
122
  xxxxs,
95
123
  xxxs,
96
124
  xxs,
@@ -109,6 +137,28 @@ export const useBreakpoint = () => {
109
137
  lgUp,
110
138
  xlUp,
111
139
  xxlUp,
140
+ // 세로 브레이크포인트
141
+ hxxs,
142
+ hxs,
143
+ hsm,
144
+ hmd,
145
+ hlg,
146
+ hxl,
147
+ hxxl,
148
+ hxxsUp,
149
+ hxsUp,
150
+ hsmUp,
151
+ hmdUp,
152
+ hlgUp,
153
+ hxlUp,
154
+ hxxlUp,
155
+ // 현재 크기
156
+ width: windowWidth,
157
+ height: windowHeight,
158
+ // 화면 방향 (가로/세로 모드)
159
+ landscape: windowWidth > windowHeight,
160
+ portrait: windowHeight >= windowWidth,
161
+ // 객체 형태
112
162
  breakpoint: {
113
163
  xxxxs,
114
164
  xxxs,
@@ -129,6 +179,22 @@ export const useBreakpoint = () => {
129
179
  xlUp,
130
180
  xxlUp,
131
181
  },
182
+ heightBreakpoint: {
183
+ hxxs,
184
+ hxs,
185
+ hsm,
186
+ hmd,
187
+ hlg,
188
+ hxl,
189
+ hxxl,
190
+ hxxsUp,
191
+ hxsUp,
192
+ hsmUp,
193
+ hmdUp,
194
+ hlgUp,
195
+ hxlUp,
196
+ hxxlUp,
197
+ },
132
198
  };
133
199
  };
134
200
  //# sourceMappingURL=useBreakpoint.js.map
package/dist/esm/src/hooks/useBreakpoint.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useBreakpoint.js","sourceRoot":"","sources":["../../../../src/hooks/useBreakpoint.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"useBreakpoint.js","sourceRoot":"","sources":["../../../../src/hooks/useBreakpoint.ts"],"names":[],"mappings":"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"}
package/dist/esm/src/types/breakpoint.d.ts CHANGED
@@ -22,8 +22,8 @@
22
22
  * SOFTWARE.
23
23
  */
24
24
  /**
25
- * Breakpoint state object
26
- * 브레이크포인트 상태 객체
25
+ * Breakpoint state object (width-based)
26
+ * 브레이크포인트 상태 객체 (가로 기준)
27
27
  */
28
28
  export interface BreakpointState {
29
29
  /** 4x Extra small: < 256px (14rem) */
@@ -63,12 +63,58 @@ export interface BreakpointState {
63
63
  /** >= 1536px (96rem) */
64
64
  xxlUp: boolean;
65
65
  }
66
+ /**
67
+ * Height breakpoint state object (height-based)
68
+ * 세로 브레이크포인트 상태 객체 (높이 기준)
69
+ */
70
+ export interface HeightBreakpointState {
71
+ /** Height < 400px */
72
+ hxxs: boolean;
73
+ /** Height < 500px */
74
+ hxs: boolean;
75
+ /** Height < 600px */
76
+ hsm: boolean;
77
+ /** Height < 768px */
78
+ hmd: boolean;
79
+ /** Height < 900px */
80
+ hlg: boolean;
81
+ /** Height < 1080px */
82
+ hxl: boolean;
83
+ /** Height >= 1080px */
84
+ hxxl: boolean;
85
+ /** Height >= 400px */
86
+ hxxsUp: boolean;
87
+ /** Height >= 500px */
88
+ hxsUp: boolean;
89
+ /** Height >= 600px */
90
+ hsmUp: boolean;
91
+ /** Height >= 768px */
92
+ hmdUp: boolean;
93
+ /** Height >= 900px */
94
+ hlgUp: boolean;
95
+ /** Height >= 1080px */
96
+ hxlUp: boolean;
97
+ /** Height >= 1080px (same as hxlUp) */
98
+ hxxlUp: boolean;
99
+ }
66
100
  /**
67
101
  * Return type of useBreakpoint hook
68
102
  * useBreakpoint 훅의 반환 타입
69
103
  */
70
- export interface UseBreakpointReturn extends BreakpointState {
71
- /** Breakpoint state object (same as root level) */
104
+ export interface UseBreakpointReturn extends BreakpointState, HeightBreakpointState {
105
+ /** Width breakpoint state object (same as root level) */
72
106
  breakpoint: BreakpointState;
107
+ /** Height breakpoint state object */
108
+ heightBreakpoint: HeightBreakpointState;
109
+ /** Current window width in pixels */
110
+ width: number;
111
+ /** Current window height in pixels */
112
+ height: number;
113
+ /** Whether the screen is in landscape mode (width > height) */
114
+ /** 화면이 가로모드인지 여부 (width > height) */
115
+ landscape: boolean;
116
+ /** Whether the screen is in portrait mode (height >= width) */
117
+ /** 화면이 세로모드인지 여부 (height >= width) */
118
+ portrait: boolean;
73
119
  }
74
120
  //# sourceMappingURL=breakpoint.d.ts.map
package/dist/esm/src/types/breakpoint.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"breakpoint.d.ts","sourceRoot":"","sources":["../../../../src/types/breakpoint.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAEH;;;GAGG;AACH,MAAM,WAAW,eAAe;IAC5B,sCAAsC;IACtC,KAAK,EAAE,OAAO,CAAC;IACf,sCAAsC;IACtC,IAAI,EAAE,OAAO,CAAC;IACd,sCAAsC;IACtC,GAAG,EAAE,OAAO,CAAC;IACb,mCAAmC;IACnC,EAAE,EAAE,OAAO,CAAC;IACZ,6BAA6B;IAC7B,EAAE,EAAE,OAAO,CAAC;IACZ,+BAA+B;IAC/B,EAAE,EAAE,OAAO,CAAC;IACZ,8BAA8B;IAC9B,EAAE,EAAE,OAAO,CAAC;IACZ,oCAAoC;IACpC,EAAE,EAAE,OAAO,CAAC;IACZ,2CAA2C;IAC3C,GAAG,EAAE,OAAO,CAAC;IACb,uBAAuB;IACvB,OAAO,EAAE,OAAO,CAAC;IACjB,uBAAuB;IACvB,MAAM,EAAE,OAAO,CAAC;IAChB,uBAAuB;IACvB,KAAK,EAAE,OAAO,CAAC;IACf,uBAAuB;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,uBAAuB;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,uBAAuB;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,wBAAwB;IACxB,IAAI,EAAE,OAAO,CAAC;IACd,wBAAwB;IACxB,IAAI,EAAE,OAAO,CAAC;IACd,wBAAwB;IACxB,KAAK,EAAE,OAAO,CAAC;CAClB;AAED;;;GAGG;AACH,MAAM,WAAW,mBAAoB,SAAQ,eAAe;IACxD,mDAAmD;IACnD,UAAU,EAAE,eAAe,CAAC;CAC/B"}
1
+ {"version":3,"file":"breakpoint.d.ts","sourceRoot":"","sources":["../../../../src/types/breakpoint.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAEH;;;GAGG;AACH,MAAM,WAAW,eAAe;IAC5B,sCAAsC;IACtC,KAAK,EAAE,OAAO,CAAC;IACf,sCAAsC;IACtC,IAAI,EAAE,OAAO,CAAC;IACd,sCAAsC;IACtC,GAAG,EAAE,OAAO,CAAC;IACb,mCAAmC;IACnC,EAAE,EAAE,OAAO,CAAC;IACZ,6BAA6B;IAC7B,EAAE,EAAE,OAAO,CAAC;IACZ,+BAA+B;IAC/B,EAAE,EAAE,OAAO,CAAC;IACZ,8BAA8B;IAC9B,EAAE,EAAE,OAAO,CAAC;IACZ,oCAAoC;IACpC,EAAE,EAAE,OAAO,CAAC;IACZ,2CAA2C;IAC3C,GAAG,EAAE,OAAO,CAAC;IACb,uBAAuB;IACvB,OAAO,EAAE,OAAO,CAAC;IACjB,uBAAuB;IACvB,MAAM,EAAE,OAAO,CAAC;IAChB,uBAAuB;IACvB,KAAK,EAAE,OAAO,CAAC;IACf,uBAAuB;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,uBAAuB;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,uBAAuB;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,wBAAwB;IACxB,IAAI,EAAE,OAAO,CAAC;IACd,wBAAwB;IACxB,IAAI,EAAE,OAAO,CAAC;IACd,wBAAwB;IACxB,KAAK,EAAE,OAAO,CAAC;CAClB;AAED;;;GAGG;AACH,MAAM,WAAW,qBAAqB;IAClC,qBAAqB;IACrB,IAAI,EAAE,OAAO,CAAC;IACd,qBAAqB;IACrB,GAAG,EAAE,OAAO,CAAC;IACb,qBAAqB;IACrB,GAAG,EAAE,OAAO,CAAC;IACb,qBAAqB;IACrB,GAAG,EAAE,OAAO,CAAC;IACb,qBAAqB;IACrB,GAAG,EAAE,OAAO,CAAC;IACb,sBAAsB;IACtB,GAAG,EAAE,OAAO,CAAC;IACb,uBAAuB;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,sBAAsB;IACtB,MAAM,EAAE,OAAO,CAAC;IAChB,sBAAsB;IACtB,KAAK,EAAE,OAAO,CAAC;IACf,sBAAsB;IACtB,KAAK,EAAE,OAAO,CAAC;IACf,sBAAsB;IACtB,KAAK,EAAE,OAAO,CAAC;IACf,sBAAsB;IACtB,KAAK,EAAE,OAAO,CAAC;IACf,uBAAuB;IACvB,KAAK,EAAE,OAAO,CAAC;IACf,uCAAuC;IACvC,MAAM,EAAE,OAAO,CAAC;CACnB;AAED;;;GAGG;AACH,MAAM,WAAW,mBACb,SAAQ,eAAe,EACnB,qBAAqB;IACzB,yDAAyD;IACzD,UAAU,EAAE,eAAe,CAAC;IAC5B,qCAAqC;IACrC,gBAAgB,EAAE,qBAAqB,CAAC;IACxC,qCAAqC;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,sCAAsC;IACtC,MAAM,EAAE,MAAM,CAAC;IACf,+DAA+D;IAC/D,qCAAqC;IACrC,SAAS,EAAE,OAAO,CAAC;IACnB,+DAA+D;IAC/D,sCAAsC;IACtC,QAAQ,EAAE,OAAO,CAAC;CACrB"}
package/dist/src/hooks/useBreakpoint.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useBreakpoint.d.ts","sourceRoot":"","sources":["../../../src/hooks/useBreakpoint.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAGH,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAe/D;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,aAAa,QAAO,mBA8EhC,CAAC"}
1
+ {"version":3,"file":"useBreakpoint.d.ts","sourceRoot":"","sources":["../../../src/hooks/useBreakpoint.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAGH,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AA0B/D;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,aAAa,QAAO,mBA0IhC,CAAC"}
package/dist/src/hooks/useBreakpoint.js CHANGED
@@ -25,7 +25,7 @@
25
25
  Object.defineProperty(exports, "__esModule", { value: true });
26
26
  exports.useBreakpoint = void 0;
27
27
  const react_1 = require("react");
28
- // 브레이크포인트 정의 (픽셀 단위)
28
+ // 가로 브레이크포인트 정의 (픽셀 단위)
29
29
  const breakpoints = {
30
30
  xxxxs: 224, // 14rem
31
31
  xxxs: 256, // 16rem
@@ -37,6 +37,16 @@ const breakpoints = {
37
37
  xl: 1280, // 80rem
38
38
  xxl: 1536, // 96rem
39
39
  };
40
+ // 세로 브레이크포인트 정의 (픽셀 단위)
41
+ const heightBreakpoints = {
42
+ hxxs: 400,
43
+ hxs: 500,
44
+ hsm: 600,
45
+ hmd: 768,
46
+ hlg: 900,
47
+ hxl: 1080,
48
+ hxxl: 1080, // hxl과 동일
49
+ };
40
50
  /**
41
51
  * useBreakpoint Hook
42
52
  *
@@ -64,16 +74,18 @@ const breakpoints = {
64
74
  */
65
75
  const useBreakpoint = () => {
66
76
  const [windowWidth, setWindowWidth] = (0, react_1.useState)(typeof window !== "undefined" ? window.innerWidth : 0);
77
+ const [windowHeight, setWindowHeight] = (0, react_1.useState)(typeof window !== "undefined" ? window.innerHeight : 0);
67
78
  (0, react_1.useEffect)(() => {
68
79
  if (typeof window === "undefined")
69
80
  return;
70
81
  const handleResize = () => {
71
82
  setWindowWidth(window.innerWidth);
83
+ setWindowHeight(window.innerHeight);
72
84
  };
73
85
  window.addEventListener("resize", handleResize);
74
86
  return () => window.removeEventListener("resize", handleResize);
75
87
  }, []);
76
- // 각 브레이크포인트별 미디어쿼리 결과 (해당 브레이크포인트 이하인지)
88
+ // 가로 브레이크포인트별 미디어쿼리 결과 (해당 브레이크포인트 이하인지)
77
89
  const xxxxs = windowWidth < breakpoints.xxxs;
78
90
  const xxxs = windowWidth < breakpoints.xxs;
79
91
  const xxs = windowWidth < breakpoints.xs;
@@ -92,8 +104,24 @@ const useBreakpoint = () => {
92
104
  const lgUp = windowWidth >= breakpoints.lg;
93
105
  const xlUp = windowWidth >= breakpoints.xl;
94
106
  const xxlUp = windowWidth >= breakpoints.xxl;
107
+ // 세로 브레이크포인트별 미디어쿼리 결과 (해당 브레이크포인트 이하인지)
108
+ const hxxs = windowHeight < heightBreakpoints.hxs;
109
+ const hxs = windowHeight < heightBreakpoints.hsm;
110
+ const hsm = windowHeight < heightBreakpoints.hmd;
111
+ const hmd = windowHeight < heightBreakpoints.hlg;
112
+ const hlg = windowHeight < heightBreakpoints.hxl;
113
+ const hxl = windowHeight < heightBreakpoints.hxxl;
114
+ const hxxl = windowHeight >= heightBreakpoints.hxxl;
115
+ const hxxsUp = windowHeight >= heightBreakpoints.hxxs;
116
+ const hxsUp = windowHeight >= heightBreakpoints.hxs;
117
+ const hsmUp = windowHeight >= heightBreakpoints.hsm;
118
+ const hmdUp = windowHeight >= heightBreakpoints.hmd;
119
+ const hlgUp = windowHeight >= heightBreakpoints.hlg;
120
+ const hxlUp = windowHeight >= heightBreakpoints.hxl;
121
+ const hxxlUp = windowHeight >= heightBreakpoints.hxxl;
95
122
  // 객체 형태로 반환하여 breakpoint.sm 식으로 접근 가능
96
123
  return {
124
+ // 가로 브레이크포인트
97
125
  xxxxs,
98
126
  xxxs,
99
127
  xxs,
@@ -112,6 +140,28 @@ const useBreakpoint = () => {
112
140
  lgUp,
113
141
  xlUp,
114
142
  xxlUp,
143
+ // 세로 브레이크포인트
144
+ hxxs,
145
+ hxs,
146
+ hsm,
147
+ hmd,
148
+ hlg,
149
+ hxl,
150
+ hxxl,
151
+ hxxsUp,
152
+ hxsUp,
153
+ hsmUp,
154
+ hmdUp,
155
+ hlgUp,
156
+ hxlUp,
157
+ hxxlUp,
158
+ // 현재 크기
159
+ width: windowWidth,
160
+ height: windowHeight,
161
+ // 화면 방향 (가로/세로 모드)
162
+ landscape: windowWidth > windowHeight,
163
+ portrait: windowHeight >= windowWidth,
164
+ // 객체 형태
115
165
  breakpoint: {
116
166
  xxxxs,
117
167
  xxxs,
@@ -132,6 +182,22 @@ const useBreakpoint = () => {
132
182
  xlUp,
133
183
  xxlUp,
134
184
  },
185
+ heightBreakpoint: {
186
+ hxxs,
187
+ hxs,
188
+ hsm,
189
+ hmd,
190
+ hlg,
191
+ hxl,
192
+ hxxl,
193
+ hxxsUp,
194
+ hxsUp,
195
+ hsmUp,
196
+ hmdUp,
197
+ hlgUp,
198
+ hxlUp,
199
+ hxxlUp,
200
+ },
135
201
  };
136
202
  };
137
203
  exports.useBreakpoint = useBreakpoint;
package/dist/src/hooks/useBreakpoint.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useBreakpoint.js","sourceRoot":"","sources":["../../../src/hooks/useBreakpoint.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"useBreakpoint.js","sourceRoot":"","sources":["../../../src/hooks/useBreakpoint.ts"],"names":[],"mappings":"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"}
package/dist/src/types/breakpoint.d.ts CHANGED
@@ -22,8 +22,8 @@
22
22
  * SOFTWARE.
23
23
  */
24
24
  /**
25
- * Breakpoint state object
26
- * 브레이크포인트 상태 객체
25
+ * Breakpoint state object (width-based)
26
+ * 브레이크포인트 상태 객체 (가로 기준)
27
27
  */
28
28
  export interface BreakpointState {
29
29
  /** 4x Extra small: < 256px (14rem) */
@@ -63,12 +63,58 @@ export interface BreakpointState {
63
63
  /** >= 1536px (96rem) */
64
64
  xxlUp: boolean;
65
65
  }
66
+ /**
67
+ * Height breakpoint state object (height-based)
68
+ * 세로 브레이크포인트 상태 객체 (높이 기준)
69
+ */
70
+ export interface HeightBreakpointState {
71
+ /** Height < 400px */
72
+ hxxs: boolean;
73
+ /** Height < 500px */
74
+ hxs: boolean;
75
+ /** Height < 600px */
76
+ hsm: boolean;
77
+ /** Height < 768px */
78
+ hmd: boolean;
79
+ /** Height < 900px */
80
+ hlg: boolean;
81
+ /** Height < 1080px */
82
+ hxl: boolean;
83
+ /** Height >= 1080px */
84
+ hxxl: boolean;
85
+ /** Height >= 400px */
86
+ hxxsUp: boolean;
87
+ /** Height >= 500px */
88
+ hxsUp: boolean;
89
+ /** Height >= 600px */
90
+ hsmUp: boolean;
91
+ /** Height >= 768px */
92
+ hmdUp: boolean;
93
+ /** Height >= 900px */
94
+ hlgUp: boolean;
95
+ /** Height >= 1080px */
96
+ hxlUp: boolean;
97
+ /** Height >= 1080px (same as hxlUp) */
98
+ hxxlUp: boolean;
99
+ }
66
100
  /**
67
101
  * Return type of useBreakpoint hook
68
102
  * useBreakpoint 훅의 반환 타입
69
103
  */
70
- export interface UseBreakpointReturn extends BreakpointState {
71
- /** Breakpoint state object (same as root level) */
104
+ export interface UseBreakpointReturn extends BreakpointState, HeightBreakpointState {
105
+ /** Width breakpoint state object (same as root level) */
72
106
  breakpoint: BreakpointState;
107
+ /** Height breakpoint state object */
108
+ heightBreakpoint: HeightBreakpointState;
109
+ /** Current window width in pixels */
110
+ width: number;
111
+ /** Current window height in pixels */
112
+ height: number;
113
+ /** Whether the screen is in landscape mode (width > height) */
114
+ /** 화면이 가로모드인지 여부 (width > height) */
115
+ landscape: boolean;
116
+ /** Whether the screen is in portrait mode (height >= width) */
117
+ /** 화면이 세로모드인지 여부 (height >= width) */
118
+ portrait: boolean;
73
119
  }
74
120
  //# sourceMappingURL=breakpoint.d.ts.map
package/dist/src/types/breakpoint.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"breakpoint.d.ts","sourceRoot":"","sources":["../../../src/types/breakpoint.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAEH;;;GAGG;AACH,MAAM,WAAW,eAAe;IAC5B,sCAAsC;IACtC,KAAK,EAAE,OAAO,CAAC;IACf,sCAAsC;IACtC,IAAI,EAAE,OAAO,CAAC;IACd,sCAAsC;IACtC,GAAG,EAAE,OAAO,CAAC;IACb,mCAAmC;IACnC,EAAE,EAAE,OAAO,CAAC;IACZ,6BAA6B;IAC7B,EAAE,EAAE,OAAO,CAAC;IACZ,+BAA+B;IAC/B,EAAE,EAAE,OAAO,CAAC;IACZ,8BAA8B;IAC9B,EAAE,EAAE,OAAO,CAAC;IACZ,oCAAoC;IACpC,EAAE,EAAE,OAAO,CAAC;IACZ,2CAA2C;IAC3C,GAAG,EAAE,OAAO,CAAC;IACb,uBAAuB;IACvB,OAAO,EAAE,OAAO,CAAC;IACjB,uBAAuB;IACvB,MAAM,EAAE,OAAO,CAAC;IAChB,uBAAuB;IACvB,KAAK,EAAE,OAAO,CAAC;IACf,uBAAuB;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,uBAAuB;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,uBAAuB;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,wBAAwB;IACxB,IAAI,EAAE,OAAO,CAAC;IACd,wBAAwB;IACxB,IAAI,EAAE,OAAO,CAAC;IACd,wBAAwB;IACxB,KAAK,EAAE,OAAO,CAAC;CAClB;AAED;;;GAGG;AACH,MAAM,WAAW,mBAAoB,SAAQ,eAAe;IACxD,mDAAmD;IACnD,UAAU,EAAE,eAAe,CAAC;CAC/B"}
1
+ {"version":3,"file":"breakpoint.d.ts","sourceRoot":"","sources":["../../../src/types/breakpoint.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAEH;;;GAGG;AACH,MAAM,WAAW,eAAe;IAC5B,sCAAsC;IACtC,KAAK,EAAE,OAAO,CAAC;IACf,sCAAsC;IACtC,IAAI,EAAE,OAAO,CAAC;IACd,sCAAsC;IACtC,GAAG,EAAE,OAAO,CAAC;IACb,mCAAmC;IACnC,EAAE,EAAE,OAAO,CAAC;IACZ,6BAA6B;IAC7B,EAAE,EAAE,OAAO,CAAC;IACZ,+BAA+B;IAC/B,EAAE,EAAE,OAAO,CAAC;IACZ,8BAA8B;IAC9B,EAAE,EAAE,OAAO,CAAC;IACZ,oCAAoC;IACpC,EAAE,EAAE,OAAO,CAAC;IACZ,2CAA2C;IAC3C,GAAG,EAAE,OAAO,CAAC;IACb,uBAAuB;IACvB,OAAO,EAAE,OAAO,CAAC;IACjB,uBAAuB;IACvB,MAAM,EAAE,OAAO,CAAC;IAChB,uBAAuB;IACvB,KAAK,EAAE,OAAO,CAAC;IACf,uBAAuB;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,uBAAuB;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,uBAAuB;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,wBAAwB;IACxB,IAAI,EAAE,OAAO,CAAC;IACd,wBAAwB;IACxB,IAAI,EAAE,OAAO,CAAC;IACd,wBAAwB;IACxB,KAAK,EAAE,OAAO,CAAC;CAClB;AAED;;;GAGG;AACH,MAAM,WAAW,qBAAqB;IAClC,qBAAqB;IACrB,IAAI,EAAE,OAAO,CAAC;IACd,qBAAqB;IACrB,GAAG,EAAE,OAAO,CAAC;IACb,qBAAqB;IACrB,GAAG,EAAE,OAAO,CAAC;IACb,qBAAqB;IACrB,GAAG,EAAE,OAAO,CAAC;IACb,qBAAqB;IACrB,GAAG,EAAE,OAAO,CAAC;IACb,sBAAsB;IACtB,GAAG,EAAE,OAAO,CAAC;IACb,uBAAuB;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,sBAAsB;IACtB,MAAM,EAAE,OAAO,CAAC;IAChB,sBAAsB;IACtB,KAAK,EAAE,OAAO,CAAC;IACf,sBAAsB;IACtB,KAAK,EAAE,OAAO,CAAC;IACf,sBAAsB;IACtB,KAAK,EAAE,OAAO,CAAC;IACf,sBAAsB;IACtB,KAAK,EAAE,OAAO,CAAC;IACf,uBAAuB;IACvB,KAAK,EAAE,OAAO,CAAC;IACf,uCAAuC;IACvC,MAAM,EAAE,OAAO,CAAC;CACnB;AAED;;;GAGG;AACH,MAAM,WAAW,mBACb,SAAQ,eAAe,EACnB,qBAAqB;IACzB,yDAAyD;IACzD,UAAU,EAAE,eAAe,CAAC;IAC5B,qCAAqC;IACrC,gBAAgB,EAAE,qBAAqB,CAAC;IACxC,qCAAqC;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,sCAAsC;IACtC,MAAM,EAAE,MAAM,CAAC;IACf,+DAA+D;IAC/D,qCAAqC;IACrC,SAAS,EAAE,OAAO,CAAC;IACnB,+DAA+D;IAC/D,sCAAsC;IACtC,QAAQ,EAAE,OAAO,CAAC;CACrB"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ehfuse/forma",
3
- "version": "3.0.1",
3
+ "version": "3.0.3",
4
4
  "description": "Advanced React state management library with individual field subscriptions - supports both forms and general state management with useFormaState",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/esm/index.js",