@dashboardity/layout-core 1.0.0 → 1.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 (5) hide show
  1. package/dist/layout.d.ts +8 -0
  2. package/dist/layout.d.ts.map +1 -1
  3. package/dist/layout.js +13 -5
  4. package/package.json +1 -1
  5. package/src/layout.ts +21 -5
package/dist/layout.d.ts CHANGED
@@ -4,6 +4,14 @@ export type GridItem = {
4
4
  y: number;
5
5
  w: number;
6
6
  h: number;
7
+ /** 최소 너비(그리드 칸 수). 미지정 시 1 */
8
+ minW?: number;
9
+ /** 최대 너비(그리드 칸 수). 미지정 시 columns - x */
10
+ maxW?: number;
11
+ /** 최소 높이(그리드 칸 수). 미지정 시 1 */
12
+ minH?: number;
13
+ /** 최대 높이(그리드 칸 수). 미지정 시 제한 없음 */
14
+ maxH?: number;
7
15
  };
8
16
  export type LayoutAction = {
9
17
  type: "add";
package/dist/layout.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../src/layout.ts"],"names":[],"mappings":"AACA,MAAM,MAAM,QAAQ,GAAG;IACrB,EAAE,EAAE,MAAM,CAAC;IACX,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX,CAAC;AAEF,MAAM,MAAM,YAAY,GACpB;IAAE,IAAI,EAAE,KAAK,CAAC;IAAC,IAAI,EAAE,QAAQ,CAAA;CAAE,GAC/B;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,GAClD;IAAE,IAAI,EAAE,QAAQ,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,GACpD;IAAE,IAAI,EAAE,QAAQ,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,CAAC;AAEnC,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,MAAM,EAAE,YAAY,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,GAAG,QAAQ,EAAE,GAAG,QAAQ,KAAG,OAKnD,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAC5B,MAAM,QAAQ,EACd,OAAO,QAAQ,EAAE,KAChB,QAAQ,EAAoD,CAAC;AAYhE,eAAO,MAAM,QAAQ,GACnB,MAAM,QAAQ,EACd,OAAO,QAAQ,EAAE,EACjB,SAAS,MAAM,KACd,QAAQ,EAkCV,CAAC;AAGF,eAAO,MAAM,MAAM,GACjB,OAAO,QAAQ,EAAE,EACjB,WAAW,MAAM,EACjB,SAAS,MAAM,KACd,QAAQ,EAiBV,CAAC;AAcF,eAAO,MAAM,aAAa,GAAI,OAAO,kBAAkB,KAAG,QAAQ,EAoCjE,CAAC"}
1
+ {"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../src/layout.ts"],"names":[],"mappings":"AACA,MAAM,MAAM,QAAQ,GAAG;IACrB,EAAE,EAAE,MAAM,CAAC;IACX,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,8BAA8B;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,wCAAwC;IACxC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,8BAA8B;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,kCAAkC;IAClC,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,YAAY,GACpB;IAAE,IAAI,EAAE,KAAK,CAAC;IAAC,IAAI,EAAE,QAAQ,CAAA;CAAE,GAC/B;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,GAClD;IAAE,IAAI,EAAE,QAAQ,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,GACpD;IAAE,IAAI,EAAE,QAAQ,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,CAAC;AAEnC,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,MAAM,EAAE,YAAY,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,GAAG,QAAQ,EAAE,GAAG,QAAQ,KAAG,OAKnD,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAC5B,MAAM,QAAQ,EACd,OAAO,QAAQ,EAAE,KAChB,QAAQ,EAAoD,CAAC;AAgBhE,eAAO,MAAM,QAAQ,GACnB,MAAM,QAAQ,EACd,OAAO,QAAQ,EAAE,EACjB,SAAS,MAAM,KACd,QAAQ,EAkCV,CAAC;AAGF,eAAO,MAAM,MAAM,GACjB,OAAO,QAAQ,EAAE,EACjB,WAAW,MAAM,EACjB,SAAS,MAAM,KACd,QAAQ,EAiBV,CAAC;AAcF,eAAO,MAAM,aAAa,GAAI,OAAO,kBAAkB,KAAG,QAAQ,EAwCjE,CAAC"}
package/dist/layout.js CHANGED
@@ -13,12 +13,16 @@ exports.collides = collides;
13
13
  // getCollidingItems: 충돌 여부 확인
14
14
  const getCollidingItems = (item, items) => items.filter((other) => (0, exports.collides)(item, other));
15
15
  exports.getCollidingItems = getCollidingItems;
16
- // clampItem: 그리드 아이템 위치 제한
16
+ // clampItem: 그리드 아이템 위치·크기 제한 (minW/maxW/minH/maxH 반영)
17
17
  const clampItem = (item, columns) => {
18
18
  const x = Math.max(0, Math.min(item.x, columns - 1));
19
- const w = Math.max(1, Math.min(item.w, columns - x));
19
+ const minW = Math.max(1, item.minW ?? 1);
20
+ const maxW = Math.min(columns - x, item.maxW ?? columns - x);
21
+ const w = Math.max(minW, Math.min(maxW, item.w));
20
22
  const y = Math.max(0, item.y);
21
- const h = Math.max(1, item.h);
23
+ const minH = Math.max(1, item.minH ?? 1);
24
+ const maxH = item.maxH ?? Infinity;
25
+ const h = Math.max(minH, Math.min(maxH, item.h));
22
26
  return { ...item, x, y, w, h };
23
27
  };
24
28
  // pushDown: 그리드 아이템 이동
@@ -109,8 +113,12 @@ const computeLayout = (input) => {
109
113
  const target = items.find((i) => i.id === action.id);
110
114
  if (!target)
111
115
  return items;
112
- const w = Math.max(1, Math.min(action.w, columns - target.x));
113
- const h = Math.max(1, action.h);
116
+ const minW = Math.max(1, target.minW ?? 1);
117
+ const maxW = Math.min(columns - target.x, target.maxW ?? columns - target.x);
118
+ const w = Math.max(minW, Math.min(maxW, action.w));
119
+ const minH = Math.max(1, target.minH ?? 1);
120
+ const maxH = target.maxH ?? Infinity;
121
+ const h = Math.max(minH, Math.min(maxH, action.h));
114
122
  const resized = { ...target, w, h };
115
123
  const others = items.filter((i) => i.id !== action.id);
116
124
  return (0, exports.pushDown)(resized, others, columns);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dashboardity/layout-core",
3
- "version": "1.0.0",
3
+ "version": "1.1.0",
4
4
  "author": "Kim. MinHyuck <kimminhyug29@gmail.com>",
5
5
  "license": "MIT",
6
6
  "publishConfig": {
package/src/layout.ts CHANGED
@@ -5,6 +5,14 @@ export type GridItem = {
5
5
  y: number;
6
6
  w: number;
7
7
  h: number;
8
+ /** 최소 너비(그리드 칸 수). 미지정 시 1 */
9
+ minW?: number;
10
+ /** 최대 너비(그리드 칸 수). 미지정 시 columns - x */
11
+ maxW?: number;
12
+ /** 최소 높이(그리드 칸 수). 미지정 시 1 */
13
+ minH?: number;
14
+ /** 최대 높이(그리드 칸 수). 미지정 시 제한 없음 */
15
+ maxH?: number;
8
16
  };
9
17
  // LayoutAction: 그리드 아이템 추가, 이동, 크기 변경, 제거 등의 작업
10
18
  export type LayoutAction =
@@ -31,12 +39,16 @@ export const getCollidingItems = (
31
39
  items: GridItem[]
32
40
  ): GridItem[] => items.filter((other) => collides(item, other));
33
41
 
34
- // clampItem: 그리드 아이템 위치 제한
42
+ // clampItem: 그리드 아이템 위치·크기 제한 (minW/maxW/minH/maxH 반영)
35
43
  const clampItem = (item: GridItem, columns: number): GridItem => {
36
44
  const x = Math.max(0, Math.min(item.x, columns - 1));
37
- const w = Math.max(1, Math.min(item.w, columns - x));
45
+ const minW = Math.max(1, item.minW ?? 1);
46
+ const maxW = Math.min(columns - x, item.maxW ?? columns - x);
47
+ const w = Math.max(minW, Math.min(maxW, item.w));
38
48
  const y = Math.max(0, item.y);
39
- const h = Math.max(1, item.h);
49
+ const minH = Math.max(1, item.minH ?? 1);
50
+ const maxH = item.maxH ?? Infinity;
51
+ const h = Math.max(minH, Math.min(maxH, item.h));
40
52
  return { ...item, x, y, w, h };
41
53
  };
42
54
 
@@ -140,8 +152,12 @@ export const computeLayout = (input: ComputeLayoutInput): GridItem[] => {
140
152
  case "resize": {
141
153
  const target = items.find((i) => i.id === action.id);
142
154
  if (!target) return items;
143
- const w = Math.max(1, Math.min(action.w, columns - target.x));
144
- const h = Math.max(1, action.h);
155
+ const minW = Math.max(1, target.minW ?? 1);
156
+ const maxW = Math.min(columns - target.x, target.maxW ?? columns - target.x);
157
+ const w = Math.max(minW, Math.min(maxW, action.w));
158
+ const minH = Math.max(1, target.minH ?? 1);
159
+ const maxH = target.maxH ?? Infinity;
160
+ const h = Math.max(minH, Math.min(maxH, action.h));
145
161
  const resized = { ...target, w, h };
146
162
  const others = items.filter((i) => i.id !== action.id);
147
163
  return pushDown(resized, others, columns);