@j-solution/components 1.7.0 → 1.8.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 (176) hide show
  1. package/README.md +8 -8
  2. package/assets/jwms-portal-frontend-BtHTA-UF.css +1 -0
  3. package/assets/styles/global-utilities.css +34 -0
  4. package/assets/styles/j-components.css +1 -1
  5. package/assets/styles/themes.css +21 -21
  6. package/components/atoms/JButton.vue.cjs +6 -1
  7. package/components/atoms/JButton.vue.cjs.map +1 -1
  8. package/components/atoms/JButton.vue.js +10 -85
  9. package/components/atoms/JButton.vue.js.map +1 -1
  10. package/components/atoms/JButton.vue2.cjs +1 -1
  11. package/components/atoms/JButton.vue2.cjs.map +1 -1
  12. package/components/atoms/JButton.vue2.js +85 -2
  13. package/components/atoms/JButton.vue2.js.map +1 -1
  14. package/components/atoms/JGrid.vue.cjs +1 -1
  15. package/components/atoms/JGrid.vue.js +1 -1
  16. package/components/atoms/JGrid.vue2.cjs +1 -1
  17. package/components/atoms/JGrid.vue2.cjs.map +1 -1
  18. package/components/atoms/JGrid.vue2.js +39 -35
  19. package/components/atoms/JGrid.vue2.js.map +1 -1
  20. package/components/atoms/JLabel.vue.cjs +1 -1
  21. package/components/atoms/JLabel.vue.cjs.map +1 -1
  22. package/components/atoms/JLabel.vue.js +26 -22
  23. package/components/atoms/JLabel.vue.js.map +1 -1
  24. package/components/atoms/JSectionTitle.vue.cjs +7 -0
  25. package/components/atoms/JSectionTitle.vue.cjs.map +1 -0
  26. package/components/atoms/JSectionTitle.vue.js +13 -0
  27. package/components/atoms/JSectionTitle.vue.js.map +1 -0
  28. package/components/atoms/JSectionTitle.vue2.cjs +2 -0
  29. package/components/atoms/JSectionTitle.vue2.cjs.map +1 -0
  30. package/components/atoms/JSectionTitle.vue2.js +67 -0
  31. package/components/atoms/JSectionTitle.vue2.js.map +1 -0
  32. package/components/atoms/JSplitter.vue.cjs +6 -1
  33. package/components/atoms/JSplitter.vue.cjs.map +1 -1
  34. package/components/atoms/JSplitter.vue.js +10 -59
  35. package/components/atoms/JSplitter.vue.js.map +1 -1
  36. package/components/atoms/JSplitter.vue2.cjs +1 -1
  37. package/components/atoms/JSplitter.vue2.cjs.map +1 -1
  38. package/components/atoms/JSplitter.vue2.js +59 -2
  39. package/components/atoms/JSplitter.vue2.js.map +1 -1
  40. package/components/examples/ExampleCrudPage.vue.cjs +1 -1
  41. package/components/examples/ExampleCrudPage.vue.cjs.map +1 -1
  42. package/components/examples/ExampleCrudPage.vue.js +228 -208
  43. package/components/examples/ExampleCrudPage.vue.js.map +1 -1
  44. package/components/examples/ExampleTabMappingPage.vue.cjs +1 -1
  45. package/components/examples/ExampleTabMappingPage.vue.cjs.map +1 -1
  46. package/components/examples/ExampleTabMappingPage.vue.js +341 -368
  47. package/components/examples/ExampleTabMappingPage.vue.js.map +1 -1
  48. package/components/molecules/JAlert.vue.cjs +1 -1
  49. package/components/molecules/JAlert.vue.cjs.map +1 -1
  50. package/components/molecules/JAlert.vue.js +18 -16
  51. package/components/molecules/JAlert.vue.js.map +1 -1
  52. package/components/molecules/JCard.vue.cjs +1 -1
  53. package/components/molecules/JCard.vue.cjs.map +1 -1
  54. package/components/molecules/JCard.vue.js +55 -39
  55. package/components/molecules/JCard.vue.js.map +1 -1
  56. package/components/molecules/JEmptyState.vue.cjs +7 -0
  57. package/components/molecules/JEmptyState.vue.cjs.map +1 -0
  58. package/components/molecules/JEmptyState.vue.js +13 -0
  59. package/components/molecules/JEmptyState.vue.js.map +1 -0
  60. package/components/molecules/JEmptyState.vue2.cjs +2 -0
  61. package/components/molecules/JEmptyState.vue2.cjs.map +1 -0
  62. package/components/molecules/JEmptyState.vue2.js +127 -0
  63. package/components/molecules/JEmptyState.vue2.js.map +1 -0
  64. package/components/molecules/JFormField.vue.cjs +6 -1
  65. package/components/molecules/JFormField.vue.cjs.map +1 -1
  66. package/components/molecules/JFormField.vue.js +10 -264
  67. package/components/molecules/JFormField.vue.js.map +1 -1
  68. package/components/molecules/JFormField.vue2.cjs +2 -0
  69. package/components/molecules/JFormField.vue2.cjs.map +1 -0
  70. package/components/molecules/JFormField.vue2.js +271 -0
  71. package/components/molecules/JFormField.vue2.js.map +1 -0
  72. package/components/molecules/JTabs.vue.cjs +1 -1
  73. package/components/molecules/JTabs.vue.js +1 -1
  74. package/components/molecules/JTabs.vue2.cjs +1 -1
  75. package/components/molecules/JTabs.vue2.cjs.map +1 -1
  76. package/components/molecules/JTabs.vue2.js +44 -50
  77. package/components/molecules/JTabs.vue2.js.map +1 -1
  78. package/components/molecules/JTitlebar.vue.cjs +1 -1
  79. package/components/molecules/JTitlebar.vue.cjs.map +1 -1
  80. package/components/molecules/JTitlebar.vue.js +23 -20
  81. package/components/molecules/JTitlebar.vue.js.map +1 -1
  82. package/components/organisms/JDynamicForm.vue2.cjs +1 -1
  83. package/components/organisms/JDynamicForm.vue2.cjs.map +1 -1
  84. package/components/organisms/JDynamicForm.vue2.js +35 -32
  85. package/components/organisms/JDynamicForm.vue2.js.map +1 -1
  86. package/components/organisms/JDynamicTabs.vue.cjs +1 -1
  87. package/components/organisms/JDynamicTabs.vue.cjs.map +1 -1
  88. package/components/organisms/JDynamicTabs.vue.js +47 -52
  89. package/components/organisms/JDynamicTabs.vue.js.map +1 -1
  90. package/components/organisms/JFilterBar.vue.cjs +6 -1
  91. package/components/organisms/JFilterBar.vue.cjs.map +1 -1
  92. package/components/organisms/JFilterBar.vue.js +10 -137
  93. package/components/organisms/JFilterBar.vue.js.map +1 -1
  94. package/components/organisms/JFilterBar.vue2.cjs +1 -1
  95. package/components/organisms/JFilterBar.vue2.cjs.map +1 -1
  96. package/components/organisms/JFilterBar.vue2.js +141 -2
  97. package/components/organisms/JFilterBar.vue2.js.map +1 -1
  98. package/components/organisms/JFormModal.vue.cjs +1 -1
  99. package/components/organisms/JFormModal.vue.cjs.map +1 -1
  100. package/components/organisms/JFormModal.vue.js +54 -49
  101. package/components/organisms/JFormModal.vue.js.map +1 -1
  102. package/components/organisms/JHeader.vue.cjs +1 -1
  103. package/components/organisms/JHeader.vue.cjs.map +1 -1
  104. package/components/organisms/JHeader.vue.js +191 -190
  105. package/components/organisms/JHeader.vue.js.map +1 -1
  106. package/components/organisms/JModal.vue.cjs +1 -1
  107. package/components/organisms/JModal.vue.cjs.map +1 -1
  108. package/components/organisms/JModal.vue.js +47 -45
  109. package/components/organisms/JModal.vue.js.map +1 -1
  110. package/components/organisms/JPageContainer.vue.cjs +1 -1
  111. package/components/organisms/JPageContainer.vue.cjs.map +1 -1
  112. package/components/organisms/JPageContainer.vue.js +22 -22
  113. package/components/organisms/JPageContainer.vue.js.map +1 -1
  114. package/components/organisms/JSearchPanel.vue2.cjs +1 -1
  115. package/components/organisms/JSearchPanel.vue2.cjs.map +1 -1
  116. package/components/organisms/JSearchPanel.vue2.js +34 -32
  117. package/components/organisms/JSearchPanel.vue2.js.map +1 -1
  118. package/components/organisms/JShuttle.vue.cjs +7 -0
  119. package/components/organisms/JShuttle.vue.cjs.map +1 -0
  120. package/components/organisms/JShuttle.vue.js +13 -0
  121. package/components/organisms/JShuttle.vue.js.map +1 -0
  122. package/components/organisms/JShuttle.vue2.cjs +2 -0
  123. package/components/organisms/JShuttle.vue2.cjs.map +1 -0
  124. package/components/organisms/JShuttle.vue2.js +216 -0
  125. package/components/organisms/JShuttle.vue2.js.map +1 -0
  126. package/components/organisms/JSidebarSimple/JDynamicMenuItem.vue.cjs +1 -1
  127. package/components/organisms/JSidebarSimple/JDynamicMenuItem.vue.cjs.map +1 -1
  128. package/components/organisms/JSidebarSimple/JDynamicMenuItem.vue.js +52 -52
  129. package/components/organisms/JSidebarSimple/JDynamicMenuItem.vue.js.map +1 -1
  130. package/components/shadcn/Card.vue.cjs +1 -1
  131. package/components/shadcn/Card.vue.cjs.map +1 -1
  132. package/components/shadcn/Card.vue.js +1 -1
  133. package/components/shadcn/Card.vue.js.map +1 -1
  134. package/components/shadcn/CardContent.vue.cjs +1 -1
  135. package/components/shadcn/CardContent.vue.cjs.map +1 -1
  136. package/components/shadcn/CardContent.vue.js +4 -4
  137. package/components/shadcn/CardContent.vue.js.map +1 -1
  138. package/components/shadcn/CardHeader.vue.cjs +1 -1
  139. package/components/shadcn/CardHeader.vue.cjs.map +1 -1
  140. package/components/shadcn/CardHeader.vue.js +5 -5
  141. package/components/shadcn/CardHeader.vue.js.map +1 -1
  142. package/components/shadcn/Input.vue.cjs +1 -1
  143. package/components/shadcn/Input.vue.cjs.map +1 -1
  144. package/components/shadcn/Input.vue.js +3 -3
  145. package/components/shadcn/Input.vue.js.map +1 -1
  146. package/components/shadcn/SelectTrigger.vue.cjs +1 -1
  147. package/components/shadcn/SelectTrigger.vue.cjs.map +1 -1
  148. package/components/shadcn/SelectTrigger.vue.js +1 -1
  149. package/components/shadcn/SelectTrigger.vue.js.map +1 -1
  150. package/components/shadcn/TabsContent.vue.cjs +1 -1
  151. package/components/shadcn/TabsContent.vue.cjs.map +1 -1
  152. package/components/shadcn/TabsContent.vue.js +1 -1
  153. package/components/shadcn/TabsContent.vue.js.map +1 -1
  154. package/components/shadcn/TabsList.vue.cjs +1 -1
  155. package/components/shadcn/TabsList.vue.cjs.map +1 -1
  156. package/components/shadcn/TabsList.vue.js +10 -10
  157. package/components/shadcn/TabsList.vue.js.map +1 -1
  158. package/components/shadcn/Textarea.vue.cjs +1 -1
  159. package/components/shadcn/Textarea.vue.cjs.map +1 -1
  160. package/components/shadcn/Textarea.vue.js +1 -1
  161. package/components/shadcn/Textarea.vue.js.map +1 -1
  162. package/components/shadcn/index.cjs +1 -1
  163. package/components/shadcn/index.cjs.map +1 -1
  164. package/components/shadcn/index.js +4 -4
  165. package/components/shadcn/index.js.map +1 -1
  166. package/components/templates/JLayout.vue.cjs.map +1 -1
  167. package/components/templates/JLayout.vue.js.map +1 -1
  168. package/index.cjs +1 -1
  169. package/index.js +73 -67
  170. package/package.json +1 -1
  171. package/types/index.d.ts +920 -777
  172. package/assets/jwms-portal-frontend-CwxPfHfa.css +0 -1
  173. package/components/molecules/JFormField.vue3.cjs +0 -2
  174. package/components/molecules/JFormField.vue3.cjs.map +0 -1
  175. package/components/molecules/JFormField.vue3.js +0 -6
  176. package/components/molecules/JFormField.vue3.js.map +0 -1
@@ -1,6 +1,5 @@
1
- import { defineComponent as X, reactive as Z, watch as _, computed as ee, createElementBlock as c, openBlock as i, normalizeClass as p, withModifiers as te, createCommentVNode as D, Fragment as g, renderList as h, normalizeStyle as q, createVNode as z, unref as w, mergeProps as U, createBlock as oe, withCtx as le, createElementVNode as W, toDisplayString as M } from "vue";
1
+ import { defineComponent as X, reactive as Z, watch as q, computed as ee, createElementBlock as c, openBlock as i, normalizeClass as p, withModifiers as te, createCommentVNode as D, Fragment as g, renderList as h, normalizeStyle as z, createVNode as _, unref as w, mergeProps as U, createBlock as oe, withCtx as le, createElementVNode as W, toDisplayString as M } from "vue";
2
2
  import B from "../molecules/JFormField.vue.js";
3
- /* empty css */
4
3
  import "../shadcn/index.js";
5
4
  import "@vueuse/core";
6
5
  import "reka-ui";
@@ -11,6 +10,7 @@ import "lucide-vue-next";
11
10
  /* empty css */
12
11
  /* empty css */
13
12
  import re from "../molecules/JCard.vue.js";
13
+ /* empty css */
14
14
  import "@internationalized/date";
15
15
  import "md-editor-v3";
16
16
  /* empty css */
@@ -27,7 +27,10 @@ import "ag-grid-enterprise";
27
27
  /* empty css */
28
28
  /* empty css */
29
29
  /* empty css */
30
+ /* empty css */
31
+ /* empty css */
30
32
  import "vue-sonner";
33
+ /* empty css */
31
34
  import { resolveGlobalStyle as se } from "../../lib/styleTypePreset.js";
32
35
  const ae = {
33
36
  key: 1,
@@ -38,7 +41,7 @@ const ae = {
38
41
  }, ie = { class: "font-semibold text-lg" }, ce = {
39
42
  key: 0,
40
43
  class: "text-muted-foreground text-sm mb-2"
41
- }, Re = /* @__PURE__ */ X({
44
+ }, Ye = /* @__PURE__ */ X({
42
45
  __name: "JDynamicForm",
43
46
  props: {
44
47
  schema: {},
@@ -47,7 +50,7 @@ const ae = {
47
50
  emits: ["update:modelValue", "submit", "change", "error"],
48
51
  setup(u, { expose: Y, emit: j }) {
49
52
  const r = u, b = j, y = ["checkbox", "switch"], s = Z({});
50
- _(
53
+ q(
51
54
  () => r.modelValue,
52
55
  (e) => {
53
56
  e && Object.assign(s, e);
@@ -63,7 +66,7 @@ const ae = {
63
66
  function v(e) {
64
67
  return e.isRequired !== void 0 ? e.isRequired : e.required || !1;
65
68
  }
66
- _(
69
+ q(
67
70
  () => r.schema,
68
71
  (e) => {
69
72
  const o = [];
@@ -86,14 +89,14 @@ const ae = {
86
89
  });
87
90
  },
88
91
  { immediate: !0 }
89
- ), _(s, (e) => b("update:modelValue", e), { deep: !0 });
92
+ ), q(s, (e) => b("update:modelValue", e), { deep: !0 });
90
93
  function P() {
91
94
  b("submit", { ...s }), typeof r.schema.events?.onSubmit == "function" && r.schema.events.onSubmit({ ...s });
92
95
  }
93
96
  function G(e, o) {
94
97
  b("change", { field: e, value: o }), typeof r.schema.events?.onChange == "function" && r.schema.events.onChange(e, o);
95
98
  }
96
- function H(e) {
99
+ function J(e) {
97
100
  b("error", e), typeof r.schema.events?.onError == "function" && r.schema.events.onError(e);
98
101
  }
99
102
  function A(e) {
@@ -105,7 +108,7 @@ const ae = {
105
108
  });
106
109
  }
107
110
  const S = ee(() => {
108
- const e = r.schema.globalStyle?.colCount || (r.schema.layout?.columns ? `row-${r.schema.layout.columns}` : "row-1"), o = I(e);
111
+ const e = r.schema.globalStyle?.colCount || (r.schema.layout?.columns ? `row-${r.schema.layout.columns}` : "row-1"), o = H(e);
109
112
  let t = "";
110
113
  switch (e) {
111
114
  case "row-1":
@@ -162,7 +165,7 @@ const ae = {
162
165
  return 1;
163
166
  }
164
167
  }
165
- function I(e) {
168
+ function H(e) {
166
169
  switch (e) {
167
170
  case "row-1":
168
171
  return "gap-6";
@@ -189,10 +192,10 @@ const ae = {
189
192
  const e = r.schema.globalStyle?.colCount || (r.schema.layout?.columns ? `row-${r.schema.layout.columns}` : "row-1"), o = E(e);
190
193
  return o >= 6 ? "6rem" : o >= 5 ? "7rem" : "8rem";
191
194
  }
192
- function $() {
195
+ function N() {
193
196
  return r.schema.globalStyle?.labelPosition || "horizontal";
194
197
  }
195
- function N() {
198
+ function $() {
196
199
  return r.schema.globalStyle?.labelAlign || "left";
197
200
  }
198
201
  function L(e) {
@@ -202,13 +205,13 @@ const ae = {
202
205
  };
203
206
  }
204
207
  function T(e) {
205
- const o = x(e), t = e.isDisabled !== void 0 ? e.isDisabled : e.disabled || !1, l = e.isReadonly !== void 0 ? e.isReadonly : e.readonly || !1, n = y.includes(e.type) ? "inline-flex items-center gap-2 w-auto" : "w-full", f = se(r.schema.globalStyle), K = r.schema.globalStyle?.colCount || (r.schema.layout?.columns ? `row-${r.schema.layout.columns}` : "row-1"), O = E(K);
208
+ const o = x(e), t = e.isDisabled !== void 0 ? e.isDisabled : e.disabled || !1, l = e.isReadonly !== void 0 ? e.isReadonly : e.readonly || !1, n = y.includes(e.type) ? "inline-flex items-center gap-2 w-auto" : "w-full", f = se(r.schema.globalStyle), K = r.schema.globalStyle?.colCount || (r.schema.layout?.columns ? `row-${r.schema.layout.columns}` : "row-1"), F = E(K);
206
209
  let m = f.controlSize;
207
- O >= 6 || O >= 5 ? m = "sm" : O >= 4 && f.controlSize === "lg" && (m = "md");
208
- const d = (a, F) => {
209
- if (o && (s[o] = F, G(o, F)), e.events?.[a]) {
210
+ F >= 6 || F >= 5 ? m = "sm" : F >= 4 && f.controlSize === "lg" && (m = "md");
211
+ const d = (a, O) => {
212
+ if (o && (s[o] = O, G(o, O)), e.events?.[a]) {
210
213
  const Q = e.events[a];
211
- console.log(`Event ${a}: Calling handler "${Q}" with value:`, F);
214
+ console.log(`Event ${a}: Calling handler "${Q}" with value:`, O);
212
215
  }
213
216
  };
214
217
  return y.includes(e.type) ? {
@@ -288,7 +291,7 @@ const ae = {
288
291
  label: o ? "전체" : "선택"
289
292
  }, ...e.options || []];
290
293
  }
291
- function J() {
294
+ function I() {
292
295
  Object.keys(s).forEach((o) => {
293
296
  delete s[o];
294
297
  });
@@ -314,8 +317,8 @@ const ae = {
314
317
  return Y({
315
318
  formState: s,
316
319
  submit: P,
317
- reset: J,
318
- handleError: H
320
+ reset: I,
321
+ handleError: J
319
322
  }), (e, o) => (i(), c("form", {
320
323
  onSubmit: te(P, ["prevent"]),
321
324
  class: p(S.value)
@@ -323,13 +326,13 @@ const ae = {
323
326
  u.schema.type === "simple" ? (i(!0), c(g, { key: 0 }, h(A(u.schema.fields || []), (t, l) => (i(), c("div", {
324
327
  key: C(t, l),
325
328
  class: p(k(t)),
326
- style: q(L(t))
329
+ style: z(L(t))
327
330
  }, [
328
- z(w(B), U({
331
+ _(w(B), U({
329
332
  label: t.label,
330
333
  required: v(t),
331
- orientation: $(),
332
- labelAlign: N(),
334
+ orientation: N(),
335
+ labelAlign: $(),
333
336
  labelWidth: V(),
334
337
  type: t.type === "searchcombo" ? "searchCombo" : t.type,
335
338
  "input-type": t.inputType,
@@ -350,13 +353,13 @@ const ae = {
350
353
  (i(!0), c(g, null, h(A(t.fields || []), (l, n) => (i(), c("div", {
351
354
  key: C(l, n),
352
355
  class: p(k(l)),
353
- style: q(L(l))
356
+ style: z(L(l))
354
357
  }, [
355
- z(w(B), U({
358
+ _(w(B), U({
356
359
  label: l.label,
357
360
  required: v(l),
358
- orientation: $(),
359
- labelAlign: N(),
361
+ orientation: N(),
362
+ labelAlign: $(),
360
363
  labelWidth: V(),
361
364
  type: l.type === "searchcombo" ? "searchCombo" : l.type,
362
365
  "input-type": l.inputType,
@@ -381,13 +384,13 @@ const ae = {
381
384
  (i(!0), c(g, null, h(A(t.fields || []), (l, n) => (i(), c("div", {
382
385
  key: C(l, n),
383
386
  class: p(k(l)),
384
- style: q(L(l))
387
+ style: z(L(l))
385
388
  }, [
386
- z(w(B), U({
389
+ _(w(B), U({
387
390
  label: l.label,
388
391
  required: v(l),
389
- orientation: $(),
390
- labelAlign: N(),
392
+ orientation: N(),
393
+ labelAlign: $(),
391
394
  labelWidth: V(),
392
395
  type: l.type === "searchcombo" ? "searchCombo" : l.type,
393
396
  "input-type": l.inputType,
@@ -402,6 +405,6 @@ const ae = {
402
405
  }
403
406
  });
404
407
  export {
405
- Re as default
408
+ Ye as default
406
409
  };
407
410
  //# sourceMappingURL=JDynamicForm.vue2.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"JDynamicForm.vue2.js","sources":["../../../../src/components/organisms/JDynamicForm.vue"],"sourcesContent":["<template>\n <form @submit.prevent=\"handleSubmit\" :class=\"formClasses\">\n <!-- 🧱 단순형 폼 -->\n <template v-if=\"schema.type === 'simple'\">\n <div\n v-for=\"(field, index) in getOrderedFields(schema.fields || [])\"\n :key=\"getFieldKey(field, index)\"\n :class=\"fieldBaseClass(field)\"\n :style=\"getFieldStyle(field)\"\n >\n <JFormField\n :label=\"field.label\"\n :required=\"getFieldRequired(field)\"\n :orientation=\"getLabelPosition()\"\n :labelAlign=\"getLabelAlign()\"\n :labelWidth=\"getLabelWidth()\"\n :type=\"(field.type === 'searchcombo' ? 'searchCombo' : field.type) as any\"\n :input-type=\"field.inputType\"\n :description=\"field.description\"\n :inline-label=\"field.inlineLabel\"\n v-bind=\"getFieldProps(field)\"\n />\n </div>\n </template>\n\n <!-- 📦 섹션형 폼 -->\n <template v-else-if=\"schema.type === 'sectioned'\">\n <div class=\"space-y-6\">\n <JCard\n v-for=\"section in schema.sections\"\n :key=\"section.id\"\n :title=\"section.title\"\n :collapsible=\"section.collapsible\"\n :default-collapsed=\"section.defaultCollapsed\"\n >\n <div :class=\"formClasses\">\n <div\n v-for=\"(field, index) in getOrderedFields(section.fields || [])\"\n :key=\"getFieldKey(field, index)\"\n :class=\"fieldBaseClass(field)\"\n :style=\"getFieldStyle(field)\"\n >\n <JFormField\n :label=\"field.label\"\n :required=\"getFieldRequired(field)\"\n :orientation=\"getLabelPosition()\"\n :labelAlign=\"getLabelAlign()\"\n :labelWidth=\"getLabelWidth()\"\n :type=\"(field.type === 'searchcombo' ? 'searchCombo' : field.type) as any\"\n :input-type=\"field.inputType\"\n :description=\"field.description\"\n :inline-label=\"field.inlineLabel\"\n v-bind=\"getFieldProps(field)\"\n />\n </div>\n </div>\n </JCard>\n </div>\n </template>\n\n <!-- 🪜 스텝형 (Wizard) -->\n <template v-else-if=\"schema.type === 'wizard'\">\n <div class=\"space-y-4\">\n <div\n v-for=\"step in schema.steps\"\n :key=\"step.id\"\n class=\"p-4 border rounded-xl\"\n >\n <h3 class=\"font-semibold text-lg\">{{ step.title }}</h3>\n <p v-if=\"step.description\" class=\"text-muted-foreground text-sm mb-2\">\n {{ step.description }}\n </p>\n <div :class=\"formClasses\">\n <div\n v-for=\"(field, index) in getOrderedFields(step.fields || [])\"\n :key=\"getFieldKey(field, index)\"\n :class=\"fieldBaseClass(field)\"\n :style=\"getFieldStyle(field)\"\n >\n <JFormField\n :label=\"field.label\"\n :required=\"getFieldRequired(field)\"\n :orientation=\"getLabelPosition()\"\n :labelAlign=\"getLabelAlign()\"\n :labelWidth=\"getLabelWidth()\"\n :type=\"(field.type === 'searchcombo' ? 'searchCombo' : field.type) as any\"\n :input-type=\"field.inputType\"\n :description=\"field.description\"\n :inline-label=\"field.inlineLabel\"\n v-bind=\"getFieldProps(field)\"\n />\n </div>\n </div>\n </div>\n </div>\n </template>\n\n </form>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, reactive, watch } from 'vue';\nimport { JFormField, JCard } from '@/components/molecules';\nimport type { FormSchema, DynamicFormField } from '@/types/dynamic-form';\nimport { resolveGlobalStyle } from '@/lib/styleTypePreset';\n\n// props\nconst props = defineProps<{\n schema: FormSchema;\n modelValue?: Record<string, any>;\n}>();\n\nconst emit = defineEmits(['update:modelValue', 'submit', 'change', 'error']);\n\nconst BOOLEAN_TYPES: Array<DynamicFormField['type']> = ['checkbox', 'switch'];\n\n// 폼 상태 관리\nconst formState = reactive<Record<string, any>>({});\n\n// 초기값 설정\nwatch(\n () => props.modelValue,\n (newValues) => {\n if (newValues) {\n Object.assign(formState, newValues);\n }\n },\n { immediate: true, deep: true }\n);\n\n// 필드 키 가져오기 (controlId > controlName > name > label 순서)\nfunction getFieldKey(field: DynamicFormField, index: number): string {\n return field.controlId || field.controlName || (field as any).name || field.label || `field-${index}`;\n}\n\n// 필드 이름 가져오기 (controlName > name 순서)\nfunction getFieldName(field: DynamicFormField): string {\n return field.controlName || (field as any).name || '';\n}\n\n// 필드 required 가져오기 (isRequired > required 순서)\nfunction getFieldRequired(field: DynamicFormField): boolean {\n return field.isRequired !== undefined ? field.isRequired : ((field as any).required || false);\n}\n\n// 필드 초기화\nwatch(\n () => props.schema,\n (newSchema) => {\n const allFields: DynamicFormField[] = [];\n \n if (newSchema.type === 'simple' && newSchema.fields) {\n allFields.push(...newSchema.fields);\n } else if (newSchema.type === 'sectioned' && newSchema.sections) {\n newSchema.sections.forEach(section => {\n if (section.fields) allFields.push(...section.fields);\n });\n } else if (newSchema.type === 'wizard' && newSchema.steps) {\n newSchema.steps.forEach(step => {\n if (step.fields) allFields.push(...step.fields);\n });\n }\n \n allFields.forEach((field) => {\n const fieldName = getFieldName(field);\n if (fieldName && formState[fieldName] === undefined) {\n if (BOOLEAN_TYPES.includes(field.type)) {\n formState[fieldName] = 'N';\n } else if (field.type === 'radio') {\n formState[fieldName] = field.options?.[0]?.value ?? '';\n } else if (field.type === 'select' || field.type === 'searchcombo') {\n const addAll = field.addAll !== undefined ? field.addAll : ((field as any).allowAll || false);\n formState[fieldName] = addAll ? 'ALL' : 'SELECT';\n } else {\n formState[fieldName] = '';\n }\n }\n });\n },\n { immediate: true }\n);\n\n// 값 변경 감지 → 상위 emit\nwatch(formState, (val) => emit('update:modelValue', val), { deep: true });\n\n// 이벤트 핸들러\nfunction handleSubmit() {\n emit('submit', { ...formState });\n if (typeof props.schema.events?.onSubmit === 'function') {\n props.schema.events.onSubmit({ ...formState });\n }\n}\n\nfunction handleChange(field: string, value: any) {\n emit('change', { field, value });\n if (typeof props.schema.events?.onChange === 'function') {\n props.schema.events.onChange(field, value);\n }\n}\n\nfunction handleError(errs: any) {\n emit('error', errs);\n if (typeof props.schema.events?.onError === 'function') {\n props.schema.events.onError(errs);\n }\n}\n\n// 정렬된 필드 가져오기\nfunction getOrderedFields(fields: DynamicFormField[]): DynamicFormField[] {\n const visibleFields = fields.filter((field) => field.isVisible !== false);\n return visibleFields.sort((a, b) => {\n // sortOrder 기준으로 정렬\n if (a.sortOrder !== undefined && b.sortOrder !== undefined) {\n if (a.sortOrder !== b.sortOrder) {\n return a.sortOrder - b.sortOrder;\n }\n }\n const aName = a.controlName || (a as any).name || a.label || '';\n const bName = b.controlName || (b as any).name || b.label || '';\n return aName.localeCompare(bName);\n });\n}\n\n// 폼 클래스 계산\nconst formClasses = computed(() => {\n const colCount = props.schema.globalStyle?.colCount || \n (props.schema.layout?.columns ? `row-${props.schema.layout.columns}` : 'row-1');\n const gapClass = getGapClass(colCount);\n \n // 반응형: 화면 크기에 따라 열 수 자동 조정\n let classes = '';\n switch (colCount) {\n case 'row-1':\n classes = `flex flex-col ${gapClass}`;\n break;\n case 'row':\n case 'row-2':\n classes = `flex flex-col md:grid md:grid-flow-row md:items-start ${gapClass} md:grid-cols-2 auto-rows-min`;\n break;\n case 'row-3':\n classes = `flex flex-col md:grid md:grid-flow-row md:items-start ${gapClass} md:grid-cols-2 lg:grid-cols-3 auto-rows-min`;\n break;\n case 'row-4':\n classes = `flex flex-col md:grid md:grid-flow-row md:items-start ${gapClass} md:grid-cols-2 lg:grid-cols-4 auto-rows-min`;\n break;\n case 'row-5':\n classes = `flex flex-col md:grid md:grid-flow-row md:items-start ${gapClass} md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-5 auto-rows-min`;\n break;\n case 'row-6':\n classes = `flex flex-col md:grid md:grid-flow-row md:items-start ${gapClass} md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-6 auto-rows-min`;\n break;\n case 'row-7':\n classes = `flex flex-col md:grid md:grid-flow-row md:items-start ${gapClass} md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-7 auto-rows-min`;\n break;\n case 'row-8':\n classes = `flex flex-col md:grid md:grid-flow-row md:items-start ${gapClass} md:grid-cols-2 lg:grid-cols-4 xl:grid-cols-8 auto-rows-min`;\n break;\n default:\n classes = `flex flex-col ${gapClass}`;\n }\n \n return classes;\n});\n\n// 필드 기본 클래스\nfunction fieldBaseClass(field: DynamicFormField): string {\n return BOOLEAN_TYPES.includes(field.type)\n ? 'min-w-0 w-auto inline-flex items-center'\n : 'min-w-0 w-full';\n}\n\n// 최대 열 수 계산\nfunction getMaxCols(colCount?: string): number {\n switch (colCount) {\n case 'row':\n case 'row-2': return 2;\n case 'row-3': return 3;\n case 'row-4': return 4;\n case 'row-5': return 5;\n case 'row-6': return 6;\n case 'row-7': return 7;\n case 'row-8': return 8;\n default: return 1;\n }\n}\n\n// 열 수에 따른 gap 계산\nfunction getGapClass(colCount: string): string {\n switch (colCount) {\n case 'row-1': return 'gap-6';\n case 'row':\n case 'row-2': return 'gap-4';\n case 'row-3': return 'gap-4';\n case 'row-4': return 'gap-3';\n case 'row-5': return 'gap-2';\n case 'row-6': return 'gap-2';\n case 'row-7': return 'gap-2';\n case 'row-8': return 'gap-2';\n default: return 'gap-6';\n }\n}\n\n// 열 수에 따른 라벨 너비 계산\nfunction getLabelWidth(): string {\n const colCount = props.schema.globalStyle?.colCount || \n (props.schema.layout?.columns ? `row-${props.schema.layout.columns}` : 'row-1');\n const maxCols = getMaxCols(colCount);\n if (maxCols >= 6) return '6rem';\n if (maxCols >= 5) return '7rem';\n return '8rem';\n}\n\n// 라벨 위치 가져오기\nfunction getLabelPosition(): 'horizontal' | 'vertical' {\n return props.schema.globalStyle?.labelPosition || 'horizontal';\n}\n\n// 라벨 정렬 가져오기\nfunction getLabelAlign(): 'left' | 'middle' | 'right' {\n return props.schema.globalStyle?.labelAlign || 'left';\n}\n\n// 필드 스타일 계산\nfunction getFieldStyle(field: DynamicFormField): Record<string, string> {\n const colCount = props.schema.globalStyle?.colCount || \n (props.schema.layout?.columns ? `row-${props.schema.layout.columns}` : 'row-1');\n const maxCols = getMaxCols(colCount);\n const span = Math.min(maxCols, Math.max(1, field.colSpan || 1));\n return {\n gridColumn: `span ${span}`\n };\n}\n\n// 필드 props 생성\nfunction getFieldProps(field: DynamicFormField) {\n const fieldName = getFieldName(field);\n const disabled = field.isDisabled !== undefined ? field.isDisabled : ((field as any).disabled || false);\n const readonly = field.isReadonly !== undefined ? field.isReadonly : ((field as any).readonly || false);\n \n // baseClass 조정\n const baseClass = BOOLEAN_TYPES.includes(field.type)\n ? 'inline-flex items-center gap-2 w-auto'\n : 'w-full';\n \n // 전역 스타일 해결\n const resolvedStyle = resolveGlobalStyle(props.schema.globalStyle);\n \n // 열 수에 따라 컨트롤 크기 동적 조정\n const colCount = props.schema.globalStyle?.colCount || \n (props.schema.layout?.columns ? `row-${props.schema.layout.columns}` : 'row-1');\n const maxCols = getMaxCols(colCount);\n let finalSize = resolvedStyle.controlSize;\n \n // 4열 이상일 때 컨트롤 크기를 작게 조정\n if (maxCols >= 6) {\n finalSize = 'sm';\n } else if (maxCols >= 5) {\n finalSize = 'sm';\n } else if (maxCols >= 4) {\n if (resolvedStyle.controlSize === 'lg') {\n finalSize = 'md';\n }\n }\n\n const createEventHandler = (eventType: string, value: any) => {\n if (fieldName) {\n formState[fieldName] = value;\n handleChange(fieldName, value);\n }\n \n if (field.events?.[eventType as keyof typeof field.events]) {\n const handlerName = field.events[eventType as keyof typeof field.events];\n console.log(`Event ${eventType}: Calling handler \"${handlerName}\" with value:`, value);\n }\n };\n\n if (BOOLEAN_TYPES.includes(field.type)) {\n return {\n modelValue: formState[fieldName] === 'Y' ? 'Y' : 'N',\n disabled,\n styleType: finalSize,\n class: baseClass,\n 'onUpdate:modelValue': (value: string) => {\n if (fieldName) {\n formState[fieldName] = value;\n }\n createEventHandler('onChange', value === 'Y');\n }\n };\n }\n\n if (field.type === 'radio') {\n return {\n modelValue: String(formState[fieldName] ?? ''),\n options: field.options ?? [],\n multiple: field.multiple,\n disabled,\n styleType: finalSize,\n class: baseClass,\n 'onUpdate:modelValue': (value: string) => {\n createEventHandler('onChange', value);\n }\n };\n }\n\n if (field.type === 'select' || field.type === 'combo') {\n return {\n modelValue: String(formState[fieldName] ?? ''),\n options: getSelectOptions(field),\n multiple: field.multiple,\n disabled,\n styleType: finalSize,\n class: baseClass,\n 'onUpdate:modelValue': (value: string) => {\n createEventHandler('onChange', value);\n }\n };\n }\n\n if (field.type === 'searchcombo') {\n return {\n modelValue: String(formState[fieldName] ?? ''),\n options: getSelectOptions(field),\n disabled,\n styleType: finalSize,\n class: baseClass,\n 'onUpdate:modelValue': (value: string) => {\n createEventHandler('onChange', value);\n }\n };\n }\n\n if (field.type === 'textarea') {\n return {\n modelValue: String(formState[fieldName] ?? ''),\n placeholder: field.placeholder ?? '',\n disabled,\n readonly,\n styleType: finalSize,\n class: baseClass,\n 'onUpdate:modelValue': (value: string) => {\n createEventHandler('onChange', value);\n }\n };\n }\n\n if (field.type === 'datepicker') {\n return {\n modelValue: String(formState[fieldName] ?? ''),\n placeholder: field.placeholder ?? '',\n disabled,\n readonly,\n styleType: finalSize,\n class: baseClass,\n 'onUpdate:modelValue': (value: string) => {\n createEventHandler('onChange', value);\n }\n };\n }\n\n // 기본 input\n return {\n modelValue: String(formState[fieldName] ?? ''),\n inputType: field.inputType || (field.dataType === 'number' ? 'number' : 'text'),\n placeholder: field.placeholder ?? '',\n disabled,\n readonly,\n styleType: finalSize,\n class: baseClass,\n 'onUpdate:modelValue': (value: string | number) => {\n createEventHandler('onChange', value);\n }\n };\n}\n\n// Select 옵션 생성\nfunction getSelectOptions(field: DynamicFormField) {\n const addAll = field.addAll !== undefined ? field.addAll : ((field as any).allowAll || false);\n const defaultOption = {\n value: addAll ? 'ALL' : 'SELECT',\n label: addAll ? '전체' : '선택'\n };\n return [defaultOption, ...(field.options || [])];\n}\n\n// 폼 리셋\nfunction reset() {\n Object.keys(formState).forEach(key => {\n delete formState[key];\n });\n \n // 모든 필드 수집\n const allFields: DynamicFormField[] = [];\n \n if (props.schema.type === 'simple' && props.schema.fields) {\n allFields.push(...props.schema.fields);\n } else if (props.schema.type === 'sectioned' && props.schema.sections) {\n props.schema.sections.forEach(section => {\n if (section.fields) allFields.push(...section.fields);\n });\n } else if (props.schema.type === 'wizard' && props.schema.steps) {\n props.schema.steps.forEach(step => {\n if (step.fields) allFields.push(...step.fields);\n });\n }\n \n // 초기값으로 재설정\n allFields.forEach((field) => {\n const fieldName = getFieldName(field);\n if (fieldName) {\n if (BOOLEAN_TYPES.includes(field.type)) {\n formState[fieldName] = 'N';\n } else if (field.type === 'radio') {\n formState[fieldName] = field.options?.[0]?.value ?? '';\n } else if (field.type === 'select' || field.type === 'searchcombo') {\n const addAll = field.addAll !== undefined ? field.addAll : ((field as any).allowAll || false);\n formState[fieldName] = addAll ? 'ALL' : 'SELECT';\n } else {\n formState[fieldName] = '';\n }\n }\n });\n}\n\n// 폼 상태 노출\ndefineExpose({\n formState,\n submit: handleSubmit,\n reset,\n handleError\n});\n</script>\n\n<style scoped>\nform {\n width: 100%;\n}\n</style>\n"],"names":["props","__props","emit","__emit","BOOLEAN_TYPES","formState","reactive","watch","newValues","getFieldKey","field","index","getFieldName","getFieldRequired","newSchema","allFields","section","step","fieldName","addAll","val","handleSubmit","handleChange","value","handleError","errs","getOrderedFields","fields","a","b","aName","bName","formClasses","computed","colCount","gapClass","getGapClass","classes","fieldBaseClass","getMaxCols","getLabelWidth","maxCols","getLabelPosition","getLabelAlign","getFieldStyle","getFieldProps","disabled","readonly","baseClass","resolvedStyle","resolveGlobalStyle","finalSize","createEventHandler","eventType","handlerName","getSelectOptions","reset","key","__expose","_createElementBlock","_Fragment","_renderList","_normalizeClass","_normalizeStyle","_createVNode","_unref","_mergeProps","_openBlock","_hoisted_1","_createBlock","JCard","_createElementVNode","_hoisted_2","_hoisted_3","_toDisplayString","_hoisted_4"],"mappings":"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"}
1
+ {"version":3,"file":"JDynamicForm.vue2.js","sources":["../../../../src/components/organisms/JDynamicForm.vue"],"sourcesContent":["<template>\n <form @submit.prevent=\"handleSubmit\" :class=\"formClasses\">\n <!-- 🧱 단순형 폼 -->\n <template v-if=\"schema.type === 'simple'\">\n <div\n v-for=\"(field, index) in getOrderedFields(schema.fields || [])\"\n :key=\"getFieldKey(field, index)\"\n :class=\"fieldBaseClass(field)\"\n :style=\"getFieldStyle(field)\"\n >\n <JFormField\n :label=\"field.label\"\n :required=\"getFieldRequired(field)\"\n :orientation=\"getLabelPosition()\"\n :labelAlign=\"getLabelAlign()\"\n :labelWidth=\"getLabelWidth()\"\n :type=\"(field.type === 'searchcombo' ? 'searchCombo' : field.type) as any\"\n :input-type=\"field.inputType\"\n :description=\"field.description\"\n :inline-label=\"field.inlineLabel\"\n v-bind=\"getFieldProps(field)\"\n />\n </div>\n </template>\n\n <!-- 📦 섹션형 폼 -->\n <template v-else-if=\"schema.type === 'sectioned'\">\n <div class=\"space-y-6\">\n <JCard\n v-for=\"section in schema.sections\"\n :key=\"section.id\"\n :title=\"section.title\"\n :collapsible=\"section.collapsible\"\n :default-collapsed=\"section.defaultCollapsed\"\n >\n <div :class=\"formClasses\">\n <div\n v-for=\"(field, index) in getOrderedFields(section.fields || [])\"\n :key=\"getFieldKey(field, index)\"\n :class=\"fieldBaseClass(field)\"\n :style=\"getFieldStyle(field)\"\n >\n <JFormField\n :label=\"field.label\"\n :required=\"getFieldRequired(field)\"\n :orientation=\"getLabelPosition()\"\n :labelAlign=\"getLabelAlign()\"\n :labelWidth=\"getLabelWidth()\"\n :type=\"(field.type === 'searchcombo' ? 'searchCombo' : field.type) as any\"\n :input-type=\"field.inputType\"\n :description=\"field.description\"\n :inline-label=\"field.inlineLabel\"\n v-bind=\"getFieldProps(field)\"\n />\n </div>\n </div>\n </JCard>\n </div>\n </template>\n\n <!-- 🪜 스텝형 (Wizard) -->\n <template v-else-if=\"schema.type === 'wizard'\">\n <div class=\"space-y-4\">\n <div\n v-for=\"step in schema.steps\"\n :key=\"step.id\"\n class=\"p-4 border rounded-xl\"\n >\n <h3 class=\"font-semibold text-lg\">{{ step.title }}</h3>\n <p v-if=\"step.description\" class=\"text-muted-foreground text-sm mb-2\">\n {{ step.description }}\n </p>\n <div :class=\"formClasses\">\n <div\n v-for=\"(field, index) in getOrderedFields(step.fields || [])\"\n :key=\"getFieldKey(field, index)\"\n :class=\"fieldBaseClass(field)\"\n :style=\"getFieldStyle(field)\"\n >\n <JFormField\n :label=\"field.label\"\n :required=\"getFieldRequired(field)\"\n :orientation=\"getLabelPosition()\"\n :labelAlign=\"getLabelAlign()\"\n :labelWidth=\"getLabelWidth()\"\n :type=\"(field.type === 'searchcombo' ? 'searchCombo' : field.type) as any\"\n :input-type=\"field.inputType\"\n :description=\"field.description\"\n :inline-label=\"field.inlineLabel\"\n v-bind=\"getFieldProps(field)\"\n />\n </div>\n </div>\n </div>\n </div>\n </template>\n\n </form>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, reactive, watch } from 'vue';\nimport { JFormField, JCard } from '@/components/molecules';\nimport type { FormSchema, DynamicFormField } from '@/types/dynamic-form';\nimport { resolveGlobalStyle } from '@/lib/styleTypePreset';\n\n// props\nconst props = defineProps<{\n schema: FormSchema;\n modelValue?: Record<string, any>;\n}>();\n\nconst emit = defineEmits(['update:modelValue', 'submit', 'change', 'error']);\n\nconst BOOLEAN_TYPES: Array<DynamicFormField['type']> = ['checkbox', 'switch'];\n\n// 폼 상태 관리\nconst formState = reactive<Record<string, any>>({});\n\n// 초기값 설정\nwatch(\n () => props.modelValue,\n (newValues) => {\n if (newValues) {\n Object.assign(formState, newValues);\n }\n },\n { immediate: true, deep: true }\n);\n\n// 필드 키 가져오기 (controlId > controlName > name > label 순서)\nfunction getFieldKey(field: DynamicFormField, index: number): string {\n return field.controlId || field.controlName || (field as any).name || field.label || `field-${index}`;\n}\n\n// 필드 이름 가져오기 (controlName > name 순서)\nfunction getFieldName(field: DynamicFormField): string {\n return field.controlName || (field as any).name || '';\n}\n\n// 필드 required 가져오기 (isRequired > required 순서)\nfunction getFieldRequired(field: DynamicFormField): boolean {\n return field.isRequired !== undefined ? field.isRequired : ((field as any).required || false);\n}\n\n// 필드 초기화\nwatch(\n () => props.schema,\n (newSchema) => {\n const allFields: DynamicFormField[] = [];\n \n if (newSchema.type === 'simple' && newSchema.fields) {\n allFields.push(...newSchema.fields);\n } else if (newSchema.type === 'sectioned' && newSchema.sections) {\n newSchema.sections.forEach(section => {\n if (section.fields) allFields.push(...section.fields);\n });\n } else if (newSchema.type === 'wizard' && newSchema.steps) {\n newSchema.steps.forEach(step => {\n if (step.fields) allFields.push(...step.fields);\n });\n }\n \n allFields.forEach((field) => {\n const fieldName = getFieldName(field);\n if (fieldName && formState[fieldName] === undefined) {\n if (BOOLEAN_TYPES.includes(field.type)) {\n formState[fieldName] = 'N';\n } else if (field.type === 'radio') {\n formState[fieldName] = field.options?.[0]?.value ?? '';\n } else if (field.type === 'select' || field.type === 'searchcombo') {\n const addAll = field.addAll !== undefined ? field.addAll : ((field as any).allowAll || false);\n formState[fieldName] = addAll ? 'ALL' : 'SELECT';\n } else {\n formState[fieldName] = '';\n }\n }\n });\n },\n { immediate: true }\n);\n\n// 값 변경 감지 → 상위 emit\nwatch(formState, (val) => emit('update:modelValue', val), { deep: true });\n\n// 이벤트 핸들러\nfunction handleSubmit() {\n emit('submit', { ...formState });\n if (typeof props.schema.events?.onSubmit === 'function') {\n props.schema.events.onSubmit({ ...formState });\n }\n}\n\nfunction handleChange(field: string, value: any) {\n emit('change', { field, value });\n if (typeof props.schema.events?.onChange === 'function') {\n props.schema.events.onChange(field, value);\n }\n}\n\nfunction handleError(errs: any) {\n emit('error', errs);\n if (typeof props.schema.events?.onError === 'function') {\n props.schema.events.onError(errs);\n }\n}\n\n// 정렬된 필드 가져오기\nfunction getOrderedFields(fields: DynamicFormField[]): DynamicFormField[] {\n const visibleFields = fields.filter((field) => field.isVisible !== false);\n return visibleFields.sort((a, b) => {\n // sortOrder 기준으로 정렬\n if (a.sortOrder !== undefined && b.sortOrder !== undefined) {\n if (a.sortOrder !== b.sortOrder) {\n return a.sortOrder - b.sortOrder;\n }\n }\n const aName = a.controlName || (a as any).name || a.label || '';\n const bName = b.controlName || (b as any).name || b.label || '';\n return aName.localeCompare(bName);\n });\n}\n\n// 폼 클래스 계산\nconst formClasses = computed(() => {\n const colCount = props.schema.globalStyle?.colCount || \n (props.schema.layout?.columns ? `row-${props.schema.layout.columns}` : 'row-1');\n const gapClass = getGapClass(colCount);\n \n // 반응형: 화면 크기에 따라 열 수 자동 조정\n let classes = '';\n switch (colCount) {\n case 'row-1':\n classes = `flex flex-col ${gapClass}`;\n break;\n case 'row':\n case 'row-2':\n classes = `flex flex-col md:grid md:grid-flow-row md:items-start ${gapClass} md:grid-cols-2 auto-rows-min`;\n break;\n case 'row-3':\n classes = `flex flex-col md:grid md:grid-flow-row md:items-start ${gapClass} md:grid-cols-2 lg:grid-cols-3 auto-rows-min`;\n break;\n case 'row-4':\n classes = `flex flex-col md:grid md:grid-flow-row md:items-start ${gapClass} md:grid-cols-2 lg:grid-cols-4 auto-rows-min`;\n break;\n case 'row-5':\n classes = `flex flex-col md:grid md:grid-flow-row md:items-start ${gapClass} md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-5 auto-rows-min`;\n break;\n case 'row-6':\n classes = `flex flex-col md:grid md:grid-flow-row md:items-start ${gapClass} md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-6 auto-rows-min`;\n break;\n case 'row-7':\n classes = `flex flex-col md:grid md:grid-flow-row md:items-start ${gapClass} md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-7 auto-rows-min`;\n break;\n case 'row-8':\n classes = `flex flex-col md:grid md:grid-flow-row md:items-start ${gapClass} md:grid-cols-2 lg:grid-cols-4 xl:grid-cols-8 auto-rows-min`;\n break;\n default:\n classes = `flex flex-col ${gapClass}`;\n }\n \n return classes;\n});\n\n// 필드 기본 클래스\nfunction fieldBaseClass(field: DynamicFormField): string {\n return BOOLEAN_TYPES.includes(field.type)\n ? 'min-w-0 w-auto inline-flex items-center'\n : 'min-w-0 w-full';\n}\n\n// 최대 열 수 계산\nfunction getMaxCols(colCount?: string): number {\n switch (colCount) {\n case 'row':\n case 'row-2': return 2;\n case 'row-3': return 3;\n case 'row-4': return 4;\n case 'row-5': return 5;\n case 'row-6': return 6;\n case 'row-7': return 7;\n case 'row-8': return 8;\n default: return 1;\n }\n}\n\n// 열 수에 따른 gap 계산\nfunction getGapClass(colCount: string): string {\n switch (colCount) {\n case 'row-1': return 'gap-6';\n case 'row':\n case 'row-2': return 'gap-4';\n case 'row-3': return 'gap-4';\n case 'row-4': return 'gap-3';\n case 'row-5': return 'gap-2';\n case 'row-6': return 'gap-2';\n case 'row-7': return 'gap-2';\n case 'row-8': return 'gap-2';\n default: return 'gap-6';\n }\n}\n\n// 열 수에 따른 라벨 너비 계산\nfunction getLabelWidth(): string {\n const colCount = props.schema.globalStyle?.colCount || \n (props.schema.layout?.columns ? `row-${props.schema.layout.columns}` : 'row-1');\n const maxCols = getMaxCols(colCount);\n if (maxCols >= 6) return '6rem';\n if (maxCols >= 5) return '7rem';\n return '8rem';\n}\n\n// 라벨 위치 가져오기\nfunction getLabelPosition(): 'horizontal' | 'vertical' {\n return props.schema.globalStyle?.labelPosition || 'horizontal';\n}\n\n// 라벨 정렬 가져오기\nfunction getLabelAlign(): 'left' | 'middle' | 'right' {\n return props.schema.globalStyle?.labelAlign || 'left';\n}\n\n// 필드 스타일 계산\nfunction getFieldStyle(field: DynamicFormField): Record<string, string> {\n const colCount = props.schema.globalStyle?.colCount || \n (props.schema.layout?.columns ? `row-${props.schema.layout.columns}` : 'row-1');\n const maxCols = getMaxCols(colCount);\n const span = Math.min(maxCols, Math.max(1, field.colSpan || 1));\n return {\n gridColumn: `span ${span}`\n };\n}\n\n// 필드 props 생성\nfunction getFieldProps(field: DynamicFormField) {\n const fieldName = getFieldName(field);\n const disabled = field.isDisabled !== undefined ? field.isDisabled : ((field as any).disabled || false);\n const readonly = field.isReadonly !== undefined ? field.isReadonly : ((field as any).readonly || false);\n \n // baseClass 조정\n const baseClass = BOOLEAN_TYPES.includes(field.type)\n ? 'inline-flex items-center gap-2 w-auto'\n : 'w-full';\n \n // 전역 스타일 해결\n const resolvedStyle = resolveGlobalStyle(props.schema.globalStyle);\n \n // 열 수에 따라 컨트롤 크기 동적 조정\n const colCount = props.schema.globalStyle?.colCount || \n (props.schema.layout?.columns ? `row-${props.schema.layout.columns}` : 'row-1');\n const maxCols = getMaxCols(colCount);\n let finalSize = resolvedStyle.controlSize;\n \n // 4열 이상일 때 컨트롤 크기를 작게 조정\n if (maxCols >= 6) {\n finalSize = 'sm';\n } else if (maxCols >= 5) {\n finalSize = 'sm';\n } else if (maxCols >= 4) {\n if (resolvedStyle.controlSize === 'lg') {\n finalSize = 'md';\n }\n }\n\n const createEventHandler = (eventType: string, value: any) => {\n if (fieldName) {\n formState[fieldName] = value;\n handleChange(fieldName, value);\n }\n \n if (field.events?.[eventType as keyof typeof field.events]) {\n const handlerName = field.events[eventType as keyof typeof field.events];\n console.log(`Event ${eventType}: Calling handler \"${handlerName}\" with value:`, value);\n }\n };\n\n if (BOOLEAN_TYPES.includes(field.type)) {\n return {\n modelValue: formState[fieldName] === 'Y' ? 'Y' : 'N',\n disabled,\n styleType: finalSize,\n class: baseClass,\n 'onUpdate:modelValue': (value: string) => {\n if (fieldName) {\n formState[fieldName] = value;\n }\n createEventHandler('onChange', value === 'Y');\n }\n };\n }\n\n if (field.type === 'radio') {\n return {\n modelValue: String(formState[fieldName] ?? ''),\n options: field.options ?? [],\n multiple: field.multiple,\n disabled,\n styleType: finalSize,\n class: baseClass,\n 'onUpdate:modelValue': (value: string) => {\n createEventHandler('onChange', value);\n }\n };\n }\n\n if (field.type === 'select' || field.type === 'combo') {\n return {\n modelValue: String(formState[fieldName] ?? ''),\n options: getSelectOptions(field),\n multiple: field.multiple,\n disabled,\n styleType: finalSize,\n class: baseClass,\n 'onUpdate:modelValue': (value: string) => {\n createEventHandler('onChange', value);\n }\n };\n }\n\n if (field.type === 'searchcombo') {\n return {\n modelValue: String(formState[fieldName] ?? ''),\n options: getSelectOptions(field),\n disabled,\n styleType: finalSize,\n class: baseClass,\n 'onUpdate:modelValue': (value: string) => {\n createEventHandler('onChange', value);\n }\n };\n }\n\n if (field.type === 'textarea') {\n return {\n modelValue: String(formState[fieldName] ?? ''),\n placeholder: field.placeholder ?? '',\n disabled,\n readonly,\n styleType: finalSize,\n class: baseClass,\n 'onUpdate:modelValue': (value: string) => {\n createEventHandler('onChange', value);\n }\n };\n }\n\n if (field.type === 'datepicker') {\n return {\n modelValue: String(formState[fieldName] ?? ''),\n placeholder: field.placeholder ?? '',\n disabled,\n readonly,\n styleType: finalSize,\n class: baseClass,\n 'onUpdate:modelValue': (value: string) => {\n createEventHandler('onChange', value);\n }\n };\n }\n\n // 기본 input\n return {\n modelValue: String(formState[fieldName] ?? ''),\n inputType: field.inputType || (field.dataType === 'number' ? 'number' : 'text'),\n placeholder: field.placeholder ?? '',\n disabled,\n readonly,\n styleType: finalSize,\n class: baseClass,\n 'onUpdate:modelValue': (value: string | number) => {\n createEventHandler('onChange', value);\n }\n };\n}\n\n// Select 옵션 생성\nfunction getSelectOptions(field: DynamicFormField) {\n const addAll = field.addAll !== undefined ? field.addAll : ((field as any).allowAll || false);\n const defaultOption = {\n value: addAll ? 'ALL' : 'SELECT',\n label: addAll ? '전체' : '선택'\n };\n return [defaultOption, ...(field.options || [])];\n}\n\n// 폼 리셋\nfunction reset() {\n Object.keys(formState).forEach(key => {\n delete formState[key];\n });\n \n // 모든 필드 수집\n const allFields: DynamicFormField[] = [];\n \n if (props.schema.type === 'simple' && props.schema.fields) {\n allFields.push(...props.schema.fields);\n } else if (props.schema.type === 'sectioned' && props.schema.sections) {\n props.schema.sections.forEach(section => {\n if (section.fields) allFields.push(...section.fields);\n });\n } else if (props.schema.type === 'wizard' && props.schema.steps) {\n props.schema.steps.forEach(step => {\n if (step.fields) allFields.push(...step.fields);\n });\n }\n \n // 초기값으로 재설정\n allFields.forEach((field) => {\n const fieldName = getFieldName(field);\n if (fieldName) {\n if (BOOLEAN_TYPES.includes(field.type)) {\n formState[fieldName] = 'N';\n } else if (field.type === 'radio') {\n formState[fieldName] = field.options?.[0]?.value ?? '';\n } else if (field.type === 'select' || field.type === 'searchcombo') {\n const addAll = field.addAll !== undefined ? field.addAll : ((field as any).allowAll || false);\n formState[fieldName] = addAll ? 'ALL' : 'SELECT';\n } else {\n formState[fieldName] = '';\n }\n }\n });\n}\n\n// 폼 상태 노출\ndefineExpose({\n formState,\n submit: handleSubmit,\n reset,\n handleError\n});\n</script>\n\n<style scoped>\nform {\n width: 100%;\n}\n</style>\n"],"names":["props","__props","emit","__emit","BOOLEAN_TYPES","formState","reactive","watch","newValues","getFieldKey","field","index","getFieldName","getFieldRequired","newSchema","allFields","section","step","fieldName","addAll","val","handleSubmit","handleChange","value","handleError","errs","getOrderedFields","fields","a","b","aName","bName","formClasses","computed","colCount","gapClass","getGapClass","classes","fieldBaseClass","getMaxCols","getLabelWidth","maxCols","getLabelPosition","getLabelAlign","getFieldStyle","getFieldProps","disabled","readonly","baseClass","resolvedStyle","resolveGlobalStyle","finalSize","createEventHandler","eventType","handlerName","getSelectOptions","reset","key","__expose","_createElementBlock","_Fragment","_renderList","_normalizeClass","_normalizeStyle","_createVNode","_unref","_mergeProps","_openBlock","_hoisted_1","_createBlock","JCard","_createElementVNode","_hoisted_2","_hoisted_3","_toDisplayString","_hoisted_4"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("vue"),C=require("../molecules/JTabs.vue.cjs"),_={key:1,class:"flex items-center justify-center h-full w-full"},N={class:"text-center"},k={class:"text-muted-foreground text-lg"},B=a.defineComponent({__name:"JDynamicTabs",props:{initialTabs:{default:()=>[]},defaultActiveId:{},maxTabs:{default:0},emptyMessage:{default:"탭을 추가해주세요."},className:{},contentClassName:{},styletype:{default:"default"}},emits:["tabChange","tabClose","tabAdd"],setup(d,{expose:v,emit:f}){const s=d,i=f,t=a.ref(Array.isArray(s.initialTabs)?[...s.initialTabs]:[]),r=a.ref(s.defaultActiveId||(Array.isArray(s.initialTabs)&&s.initialTabs.length>0?s.initialTabs[0]?.id:"")||"");a.watch(()=>s.initialTabs,e=>{if(!e){t.value=[];return}Array.isArray(e)&&e.length>0?(t.value=[...e],!r.value&&e[0]&&(r.value=e[0].id)):Array.isArray(e)?t.value=[]:t.value=[]},{immediate:!0});const m=e=>{if(Array.isArray(t.value)||(t.value=[]),t.value.find(n=>n.id===e.id)){u(e.id);return}if(s.maxTabs>0&&t.value.length>=s.maxTabs){console.warn(`최대 ${s.maxTabs}개의 탭만 열 수 있습니다.`);return}t.value.push({...e,closable:e.closable!==!1}),u(e.id),i("tabAdd",e)},o=e=>{if(!Array.isArray(t.value))return;const l=t.value.findIndex(n=>n.id===e);if(l!==-1){if(t.value.splice(l,1),r.value===e)if(t.value.length>0){const n=Math.min(l,t.value.length-1);r.value=t.value[n]?.id||""}else r.value="";i("tabClose",e)}},u=e=>{if(!Array.isArray(t.value))return;t.value.find(n=>n.id===e)&&(r.value=e)},b=e=>{if(Array.isArray(t.value))return t.value.find(l=>l.id===e)},y=()=>{if(!Array.isArray(t.value))return;t.value.filter(l=>l.closable).forEach(l=>o(l.id))},p=e=>{r.value=e,i("tabChange",e)},A=e=>{o(e)};v({addTab:m,closeTab:o,activateTab:u,findTab:b,closeAllTabs:y});const c=a.computed(()=>Array.isArray(t.value)?t.value:[]),h=a.computed(()=>c.value.length>0),T=a.computed(()=>{const e=["w-full","h-full"];return s.className&&e.push(s.className),e.join(" ")}),g=a.computed(()=>{const e=[];return s.contentClassName&&e.push(s.contentClassName),e.join(" ")});return(e,l)=>(a.openBlock(),a.createElementBlock("div",{class:a.normalizeClass(T.value)},[h.value?(a.openBlock(),a.createBlock(C.default,{key:0,tabs:c.value,"active-tab-id":r.value,styletype:s.styletype,class:a.normalizeClass(g.value),onTabChange:p,onTabClose:A},a.createSlots({_:2},[a.renderList(c.value,n=>({name:`content-${n.id}`,fn:a.withCtx(x=>[a.renderSlot(e.$slots,`content-${n.id}`,a.normalizeProps(a.guardReactiveProps(x)))])}))]),1032,["tabs","active-tab-id","styletype","class"])):(a.openBlock(),a.createElementBlock("div",_,[a.createElementVNode("div",N,[a.createElementVNode("p",k,a.toDisplayString(d.emptyMessage),1),l[0]||(l[0]=a.createElementVNode("p",{class:"text-muted-foreground/60 text-sm mt-2"}," 메뉴를 클릭하여 탭을 추가하세요. ",-1))])]))],2))}});exports.default=B;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("vue"),C=require("../molecules/JTabs.vue.cjs"),_=require("../../lib/utils.cjs"),k={key:1,class:"flex items-center justify-center h-full w-full"},B={class:"text-center"},E={class:"text-muted-foreground text-lg"},I=a.defineComponent({__name:"JDynamicTabs",props:{initialTabs:{default:()=>[]},defaultActiveId:{},maxTabs:{default:0},emptyMessage:{default:"탭을 추가해주세요."},class:{},contentClass:{},styletype:{default:"default"}},emits:["tabChange","tabClose","tabAdd"],setup(d,{expose:v,emit:f}){const s=d,i=f,t=a.ref(Array.isArray(s.initialTabs)?[...s.initialTabs]:[]),n=a.ref(s.defaultActiveId||(Array.isArray(s.initialTabs)&&s.initialTabs.length>0?s.initialTabs[0]?.id:"")||"");a.watch(()=>s.initialTabs,e=>{if(!e){t.value=[];return}Array.isArray(e)&&e.length>0?(t.value=[...e],!n.value&&e[0]&&(n.value=e[0].id)):Array.isArray(e)?t.value=[]:t.value=[]},{immediate:!0});const b=e=>{if(Array.isArray(t.value)||(t.value=[]),t.value.find(r=>r.id===e.id)){u(e.id);return}if(s.maxTabs>0&&t.value.length>=s.maxTabs){console.warn(`최대 ${s.maxTabs}개의 탭만 열 수 있습니다.`);return}t.value.push({...e,closable:e.closable!==!1}),u(e.id),i("tabAdd",e)},o=e=>{if(!Array.isArray(t.value))return;const l=t.value.findIndex(r=>r.id===e);if(l!==-1){if(t.value.splice(l,1),n.value===e)if(t.value.length>0){const r=Math.min(l,t.value.length-1);n.value=t.value[r]?.id||""}else n.value="";i("tabClose",e)}},u=e=>{if(!Array.isArray(t.value))return;t.value.find(r=>r.id===e)&&(n.value=e)},y=e=>{if(Array.isArray(t.value))return t.value.find(l=>l.id===e)},m=()=>{if(!Array.isArray(t.value))return;t.value.filter(l=>l.closable).forEach(l=>o(l.id))},p=e=>{n.value=e,i("tabChange",e)},A=e=>{o(e)};v({addTab:b,closeTab:o,activateTab:u,findTab:y,closeAllTabs:m});const c=a.computed(()=>Array.isArray(t.value)?t.value:[]),T=a.computed(()=>c.value.length>0),h=a.computed(()=>_.cn("w-full h-full",s.class)),g=a.computed(()=>s.contentClass||"");return(e,l)=>(a.openBlock(),a.createElementBlock("div",{class:a.normalizeClass(h.value)},[T.value?(a.openBlock(),a.createBlock(C.default,{key:0,tabs:c.value,"active-tab-id":n.value,styletype:s.styletype,class:a.normalizeClass(g.value),onTabChange:p,onTabClose:A},a.createSlots({_:2},[a.renderList(c.value,r=>({name:`content-${r.id}`,fn:a.withCtx(x=>[a.renderSlot(e.$slots,`content-${r.id}`,a.normalizeProps(a.guardReactiveProps(x)))])}))]),1032,["tabs","active-tab-id","styletype","class"])):(a.openBlock(),a.createElementBlock("div",k,[a.createElementVNode("div",B,[a.createElementVNode("p",E,a.toDisplayString(d.emptyMessage),1),l[0]||(l[0]=a.createElementVNode("p",{class:"text-muted-foreground/60 text-sm mt-2"}," 메뉴를 클릭하여 탭을 추가하세요. ",-1))])]))],2))}});exports.default=I;
2
2
  //# sourceMappingURL=JDynamicTabs.vue.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"JDynamicTabs.vue.cjs","sources":["../../../../src/components/organisms/JDynamicTabs.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { ref, computed, watch } from 'vue'\r\nimport JTabs from '@/components/molecules/JTabs.vue'\r\nimport type { \r\n JDynamicTabsProps, \r\n JDynamicTabsEmits, \r\n JDynamicTabsMethods,\r\n DynamicTab \r\n} from '@/types/dynamic-tabs.types'\r\n\r\n/**\r\n * JDynamicTabs - 동적 탭 컴포넌트 (organisms)\r\n * Dynamic Tabs Component\r\n * \r\n * @description\r\n * 사이드 메뉴 클릭으로 탭을 동적으로 추가/제거할 수 있는 탭 컴포넌트입니다.\r\n * \r\n * Features:\r\n * - 탭 동적 추가/제거\r\n * - 중복 탭 방지 (이미 있으면 활성화)\r\n * - 닫기 버튼으로 탭 제거\r\n * - 활성 탭 자동 재설정\r\n * - 최대 탭 개수 제한\r\n * \r\n * @example\r\n * const tabsRef = ref()\r\n * \r\n * const handleMenuClick = (menuItem) => {\r\n * tabsRef.value?.addTab({\r\n * id: menuItem.id,\r\n * label: menuItem.label,\r\n * component: menuItem.component,\r\n * closable: true\r\n * })\r\n * }\r\n */\r\n\r\nconst props = withDefaults(defineProps<JDynamicTabsProps>(), {\r\n initialTabs: () => [],\r\n maxTabs: 0, // 0 = unlimited\r\n emptyMessage: '탭을 추가해주세요.',\r\n styletype: 'default',\r\n})\r\n\r\nconst emit = defineEmits<JDynamicTabsEmits>()\r\n\r\n/**\r\n * 탭 목록 (내부 상태)\r\n * Tabs list (internal state)\r\n */\r\nconst tabs = ref<DynamicTab[]>(Array.isArray(props.initialTabs) ? [...props.initialTabs] : [])\r\n\r\n/**\r\n * 현재 활성화된 탭 ID (내부 상태)\r\n * Current active tab ID (internal state)\r\n */\r\nconst activeTabId = ref<string>(\r\n props.defaultActiveId || (Array.isArray(props.initialTabs) && props.initialTabs.length > 0 ? props.initialTabs[0]?.id : '') || ''\r\n)\r\n\r\n/**\r\n * initialTabs가 변경되면 내부 상태 업데이트\r\n * Update internal state when initialTabs changes\r\n */\r\nwatch(() => props.initialTabs, (newTabs) => {\r\n if (!newTabs) {\r\n tabs.value = []\r\n return\r\n }\r\n \r\n if (Array.isArray(newTabs) && newTabs.length > 0) {\r\n tabs.value = [...newTabs]\r\n if (!activeTabId.value && newTabs[0]) {\r\n activeTabId.value = newTabs[0].id\r\n }\r\n } else if (Array.isArray(newTabs)) {\r\n // 빈 배열인 경우\r\n tabs.value = []\r\n } else {\r\n // 배열이 아닌 경우\r\n tabs.value = []\r\n }\r\n}, { immediate: true })\r\n\r\n/**\r\n * 탭 추가\r\n * Add tab (if exists, activate it; otherwise, add to array and activate)\r\n * \r\n * @param tab - 추가할 탭 정보\r\n */\r\nconst addTab = (tab: DynamicTab) => {\r\n // tabs.value가 배열이 아니면 초기화\r\n if (!Array.isArray(tabs.value)) {\r\n tabs.value = []\r\n }\r\n \r\n // 이미 존재하는 탭인지 확인\r\n const existingTab = tabs.value.find(t => t.id === tab.id)\r\n \r\n if (existingTab) {\r\n // 이미 있으면 해당 탭 활성화\r\n activateTab(tab.id)\r\n return\r\n }\r\n \r\n // 최대 탭 개수 체크\r\n if (props.maxTabs > 0 && tabs.value.length >= props.maxTabs) {\r\n console.warn(`최대 ${props.maxTabs}개의 탭만 열 수 있습니다.`)\r\n return\r\n }\r\n \r\n // 새 탭 추가\r\n tabs.value.push({\r\n ...tab,\r\n closable: tab.closable !== false, // 기본값 true\r\n })\r\n \r\n // 새로 추가된 탭 활성화\r\n activateTab(tab.id)\r\n \r\n // 이벤트 발생\r\n emit('tabAdd', tab)\r\n}\r\n\r\n/**\r\n * 탭 닫기\r\n * Close tab (remove from array and reset active tab)\r\n * \r\n * @param id - 닫을 탭 ID\r\n */\r\nconst closeTab = (id: string) => {\r\n if (!Array.isArray(tabs.value)) {\r\n return\r\n }\r\n \r\n const tabIndex = tabs.value.findIndex(t => t.id === id)\r\n \r\n if (tabIndex === -1) return\r\n \r\n // 탭 제거\r\n tabs.value.splice(tabIndex, 1)\r\n \r\n // 활성 탭 재설정\r\n if (activeTabId.value === id) {\r\n if (tabs.value.length > 0) {\r\n // 이전 탭이 있으면 이전 탭 활성화, 없으면 다음 탭 활성화\r\n const newIndex = Math.min(tabIndex, tabs.value.length - 1)\r\n activeTabId.value = tabs.value[newIndex]?.id || ''\r\n } else {\r\n activeTabId.value = ''\r\n }\r\n }\r\n \r\n // 이벤트 발생\r\n emit('tabClose', id)\r\n}\r\n\r\n/**\r\n * 탭 활성화\r\n * Activate tab\r\n * \r\n * @param id - 활성화할 탭 ID\r\n */\r\nconst activateTab = (id: string) => {\r\n if (!Array.isArray(tabs.value)) {\r\n return\r\n }\r\n const tab = tabs.value.find(t => t.id === id)\r\n if (tab) {\r\n activeTabId.value = id\r\n }\r\n}\r\n\r\n/**\r\n * 특정 탭 찾기\r\n * Find specific tab\r\n * \r\n * @param id - 찾을 탭 ID\r\n */\r\nconst findTab = (id: string): DynamicTab | undefined => {\r\n if (!Array.isArray(tabs.value)) {\r\n return undefined\r\n }\r\n return tabs.value.find(t => t.id === id)\r\n}\r\n\r\n/**\r\n * 모든 탭 닫기 (closable이 true인 탭만)\r\n * Close all tabs (only closable tabs)\r\n */\r\nconst closeAllTabs = () => {\r\n if (!Array.isArray(tabs.value)) {\r\n return\r\n }\r\n const closableTabs = tabs.value.filter(t => t.closable)\r\n closableTabs.forEach(tab => closeTab(tab.id))\r\n}\r\n\r\n/**\r\n * 탭 변경 핸들러\r\n * Tab change handler\r\n */\r\nconst handleTabChange = (id: string) => {\r\n activeTabId.value = id\r\n emit('tabChange', id)\r\n}\r\n\r\n/**\r\n * 탭 닫기 핸들러\r\n * Tab close handler\r\n */\r\nconst handleTabClose = (id: string) => {\r\n closeTab(id)\r\n}\r\n\r\n/**\r\n * 외부에서 호출 가능한 메서드 노출\r\n * Expose methods for external use\r\n */\r\ndefineExpose<JDynamicTabsMethods>({\r\n addTab,\r\n closeTab,\r\n activateTab,\r\n findTab,\r\n closeAllTabs,\r\n})\r\n\r\n/**\r\n * 안전한 tabs 배열\r\n * Safe tabs array\r\n */\r\nconst safeTabs = computed(() => {\r\n return Array.isArray(tabs.value) ? tabs.value : []\r\n})\r\n\r\n/**\r\n * 탭이 있는지 여부\r\n * Whether there are tabs\r\n */\r\nconst hasTabs = computed(() => safeTabs.value.length > 0)\r\n\r\n/**\r\n * 루트 클래스\r\n * Root classes\r\n */\r\nconst rootClasses = computed(() => {\r\n const classes = ['w-full', 'h-full']\r\n \r\n if (props.className) {\r\n classes.push(props.className)\r\n }\r\n \r\n return classes.join(' ')\r\n})\r\n\r\n/**\r\n * 콘텐츠 클래스\r\n * Content classes\r\n */\r\nconst contentClasses = computed(() => {\r\n const classes = []\r\n \r\n if (props.contentClassName) {\r\n classes.push(props.contentClassName)\r\n }\r\n \r\n return classes.join(' ')\r\n})\r\n</script>\r\n\r\n<template>\r\n <div :class=\"rootClasses\">\r\n <!-- 탭이 있을 경우 / When there are tabs -->\r\n <JTabs\r\n v-if=\"hasTabs\"\r\n :tabs=\"safeTabs\"\r\n :active-tab-id=\"activeTabId\"\r\n :styletype=\"props.styletype\"\r\n :class=\"contentClasses\"\r\n @tab-change=\"handleTabChange\"\r\n @tab-close=\"handleTabClose\"\r\n >\r\n <!-- 각 탭 콘텐츠 슬롯 전달 / Forward slots for each tab content -->\r\n <template\r\n v-for=\"tab in safeTabs\"\r\n :key=\"tab.id\"\r\n #[`content-${tab.id}`]=\"slotProps\"\r\n >\r\n <slot :name=\"`content-${tab.id}`\" v-bind=\"slotProps\" />\r\n </template>\r\n </JTabs>\r\n \r\n <!-- 탭이 없을 경우 / When there are no tabs -->\r\n <div\r\n v-else\r\n class=\"flex items-center justify-center h-full w-full\"\r\n >\r\n <div class=\"text-center\">\r\n <p class=\"text-muted-foreground text-lg\">{{ emptyMessage }}</p>\r\n <p class=\"text-muted-foreground/60 text-sm mt-2\">\r\n 메뉴를 클릭하여 탭을 추가하세요.\r\n </p>\r\n </div>\r\n </div>\r\n </div>\r\n</template>\r\n"],"names":["props","__props","emit","__emit","tabs","ref","activeTabId","watch","newTabs","addTab","tab","t","activateTab","closeTab","id","tabIndex","newIndex","findTab","closeAllTabs","handleTabChange","handleTabClose","__expose","safeTabs","computed","hasTabs","rootClasses","classes","contentClasses","_createElementBlock","_createBlock","JTabs","_renderList","_withCtx","slotProps","_renderSlot","_ctx","_openBlock","_hoisted_1","_createElementVNode","_hoisted_2","_hoisted_3","_toDisplayString","_cache"],"mappings":"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"}
1
+ {"version":3,"file":"JDynamicTabs.vue.cjs","sources":["../../../../src/components/organisms/JDynamicTabs.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { ref, computed, watch } from 'vue'\r\nimport JTabs from '@/components/molecules/JTabs.vue'\r\nimport { cn } from '@/lib/utils'\r\nimport type {\r\n JDynamicTabsProps, \r\n JDynamicTabsEmits, \r\n JDynamicTabsMethods,\r\n DynamicTab \r\n} from '@/types/dynamic-tabs.types'\r\n\r\n/**\r\n * JDynamicTabs - 동적 탭 컴포넌트 (organisms)\r\n * Dynamic Tabs Component\r\n * \r\n * @description\r\n * 사이드 메뉴 클릭으로 탭을 동적으로 추가/제거할 수 있는 탭 컴포넌트입니다.\r\n * \r\n * Features:\r\n * - 탭 동적 추가/제거\r\n * - 중복 탭 방지 (이미 있으면 활성화)\r\n * - 닫기 버튼으로 탭 제거\r\n * - 활성 탭 자동 재설정\r\n * - 최대 탭 개수 제한\r\n * \r\n * @example\r\n * const tabsRef = ref()\r\n * \r\n * const handleMenuClick = (menuItem) => {\r\n * tabsRef.value?.addTab({\r\n * id: menuItem.id,\r\n * label: menuItem.label,\r\n * component: menuItem.component,\r\n * closable: true\r\n * })\r\n * }\r\n */\r\n\r\nconst props = withDefaults(defineProps<JDynamicTabsProps>(), {\r\n initialTabs: () => [],\r\n maxTabs: 0, // 0 = unlimited\r\n emptyMessage: '탭을 추가해주세요.',\r\n styletype: 'default',\r\n})\r\n\r\nconst emit = defineEmits<JDynamicTabsEmits>()\r\n\r\n/**\r\n * 탭 목록 (내부 상태)\r\n * Tabs list (internal state)\r\n */\r\nconst tabs = ref<DynamicTab[]>(Array.isArray(props.initialTabs) ? [...props.initialTabs] : [])\r\n\r\n/**\r\n * 현재 활성화된 탭 ID (내부 상태)\r\n * Current active tab ID (internal state)\r\n */\r\nconst activeTabId = ref<string>(\r\n props.defaultActiveId || (Array.isArray(props.initialTabs) && props.initialTabs.length > 0 ? props.initialTabs[0]?.id : '') || ''\r\n)\r\n\r\n/**\r\n * initialTabs가 변경되면 내부 상태 업데이트\r\n * Update internal state when initialTabs changes\r\n */\r\nwatch(() => props.initialTabs, (newTabs) => {\r\n if (!newTabs) {\r\n tabs.value = []\r\n return\r\n }\r\n \r\n if (Array.isArray(newTabs) && newTabs.length > 0) {\r\n tabs.value = [...newTabs]\r\n if (!activeTabId.value && newTabs[0]) {\r\n activeTabId.value = newTabs[0].id\r\n }\r\n } else if (Array.isArray(newTabs)) {\r\n // 빈 배열인 경우\r\n tabs.value = []\r\n } else {\r\n // 배열이 아닌 경우\r\n tabs.value = []\r\n }\r\n}, { immediate: true })\r\n\r\n/**\r\n * 탭 추가\r\n * Add tab (if exists, activate it; otherwise, add to array and activate)\r\n * \r\n * @param tab - 추가할 탭 정보\r\n */\r\nconst addTab = (tab: DynamicTab) => {\r\n // tabs.value가 배열이 아니면 초기화\r\n if (!Array.isArray(tabs.value)) {\r\n tabs.value = []\r\n }\r\n \r\n // 이미 존재하는 탭인지 확인\r\n const existingTab = tabs.value.find(t => t.id === tab.id)\r\n \r\n if (existingTab) {\r\n // 이미 있으면 해당 탭 활성화\r\n activateTab(tab.id)\r\n return\r\n }\r\n \r\n // 최대 탭 개수 체크\r\n if (props.maxTabs > 0 && tabs.value.length >= props.maxTabs) {\r\n console.warn(`최대 ${props.maxTabs}개의 탭만 열 수 있습니다.`)\r\n return\r\n }\r\n \r\n // 새 탭 추가\r\n tabs.value.push({\r\n ...tab,\r\n closable: tab.closable !== false, // 기본값 true\r\n })\r\n \r\n // 새로 추가된 탭 활성화\r\n activateTab(tab.id)\r\n \r\n // 이벤트 발생\r\n emit('tabAdd', tab)\r\n}\r\n\r\n/**\r\n * 탭 닫기\r\n * Close tab (remove from array and reset active tab)\r\n * \r\n * @param id - 닫을 탭 ID\r\n */\r\nconst closeTab = (id: string) => {\r\n if (!Array.isArray(tabs.value)) {\r\n return\r\n }\r\n \r\n const tabIndex = tabs.value.findIndex(t => t.id === id)\r\n \r\n if (tabIndex === -1) return\r\n \r\n // 탭 제거\r\n tabs.value.splice(tabIndex, 1)\r\n \r\n // 활성 탭 재설정\r\n if (activeTabId.value === id) {\r\n if (tabs.value.length > 0) {\r\n // 이전 탭이 있으면 이전 탭 활성화, 없으면 다음 탭 활성화\r\n const newIndex = Math.min(tabIndex, tabs.value.length - 1)\r\n activeTabId.value = tabs.value[newIndex]?.id || ''\r\n } else {\r\n activeTabId.value = ''\r\n }\r\n }\r\n \r\n // 이벤트 발생\r\n emit('tabClose', id)\r\n}\r\n\r\n/**\r\n * 탭 활성화\r\n * Activate tab\r\n * \r\n * @param id - 활성화할 탭 ID\r\n */\r\nconst activateTab = (id: string) => {\r\n if (!Array.isArray(tabs.value)) {\r\n return\r\n }\r\n const tab = tabs.value.find(t => t.id === id)\r\n if (tab) {\r\n activeTabId.value = id\r\n }\r\n}\r\n\r\n/**\r\n * 특정 탭 찾기\r\n * Find specific tab\r\n * \r\n * @param id - 찾을 탭 ID\r\n */\r\nconst findTab = (id: string): DynamicTab | undefined => {\r\n if (!Array.isArray(tabs.value)) {\r\n return undefined\r\n }\r\n return tabs.value.find(t => t.id === id)\r\n}\r\n\r\n/**\r\n * 모든 탭 닫기 (closable이 true인 탭만)\r\n * Close all tabs (only closable tabs)\r\n */\r\nconst closeAllTabs = () => {\r\n if (!Array.isArray(tabs.value)) {\r\n return\r\n }\r\n const closableTabs = tabs.value.filter(t => t.closable)\r\n closableTabs.forEach(tab => closeTab(tab.id))\r\n}\r\n\r\n/**\r\n * 탭 변경 핸들러\r\n * Tab change handler\r\n */\r\nconst handleTabChange = (id: string) => {\r\n activeTabId.value = id\r\n emit('tabChange', id)\r\n}\r\n\r\n/**\r\n * 탭 닫기 핸들러\r\n * Tab close handler\r\n */\r\nconst handleTabClose = (id: string) => {\r\n closeTab(id)\r\n}\r\n\r\n/**\r\n * 외부에서 호출 가능한 메서드 노출\r\n * Expose methods for external use\r\n */\r\ndefineExpose<JDynamicTabsMethods>({\r\n addTab,\r\n closeTab,\r\n activateTab,\r\n findTab,\r\n closeAllTabs,\r\n})\r\n\r\n/**\r\n * 안전한 tabs 배열\r\n * Safe tabs array\r\n */\r\nconst safeTabs = computed(() => {\r\n return Array.isArray(tabs.value) ? tabs.value : []\r\n})\r\n\r\n/**\r\n * 탭이 있는지 여부\r\n * Whether there are tabs\r\n */\r\nconst hasTabs = computed(() => safeTabs.value.length > 0)\r\n\r\n/**\r\n * 루트 클래스\r\n * Root classes\r\n */\r\nconst rootClasses = computed(() => {\r\n return cn('w-full h-full', props.class)\r\n})\r\n\r\n/**\r\n * 콘텐츠 클래스\r\n * Content classes\r\n */\r\nconst contentClasses = computed(() => {\r\n return props.contentClass || ''\r\n})\r\n</script>\r\n\r\n<template>\r\n <div :class=\"rootClasses\">\r\n <!-- 탭이 있을 경우 / When there are tabs -->\r\n <JTabs\r\n v-if=\"hasTabs\"\r\n :tabs=\"safeTabs\"\r\n :active-tab-id=\"activeTabId\"\r\n :styletype=\"props.styletype\"\r\n :class=\"contentClasses\"\r\n @tab-change=\"handleTabChange\"\r\n @tab-close=\"handleTabClose\"\r\n >\r\n <!-- 각 탭 콘텐츠 슬롯 전달 / Forward slots for each tab content -->\r\n <template\r\n v-for=\"tab in safeTabs\"\r\n :key=\"tab.id\"\r\n #[`content-${tab.id}`]=\"slotProps\"\r\n >\r\n <slot :name=\"`content-${tab.id}`\" v-bind=\"slotProps\" />\r\n </template>\r\n </JTabs>\r\n \r\n <!-- 탭이 없을 경우 / When there are no tabs -->\r\n <div\r\n v-else\r\n class=\"flex items-center justify-center h-full w-full\"\r\n >\r\n <div class=\"text-center\">\r\n <p class=\"text-muted-foreground text-lg\">{{ emptyMessage }}</p>\r\n <p class=\"text-muted-foreground/60 text-sm mt-2\">\r\n 메뉴를 클릭하여 탭을 추가하세요.\r\n </p>\r\n </div>\r\n </div>\r\n </div>\r\n</template>\r\n"],"names":["props","__props","emit","__emit","tabs","ref","activeTabId","watch","newTabs","addTab","tab","t","activateTab","closeTab","id","tabIndex","newIndex","findTab","closeAllTabs","handleTabChange","handleTabClose","__expose","safeTabs","computed","hasTabs","rootClasses","cn","contentClasses","_createElementBlock","_createBlock","JTabs","_renderList","_withCtx","slotProps","_renderSlot","_ctx","_openBlock","_hoisted_1","_createElementVNode","_hoisted_2","_hoisted_3","_toDisplayString","_cache"],"mappings":"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"}
@@ -1,116 +1,111 @@
1
- import { defineComponent as $, ref as m, watch as j, computed as n, createElementBlock as b, openBlock as d, normalizeClass as y, createBlock as B, createSlots as E, renderList as M, withCtx as S, renderSlot as z, normalizeProps as D, guardReactiveProps as J, createElementVNode as f, toDisplayString as P } from "vue";
2
- import L from "../molecules/JTabs.vue.js";
3
- const R = {
1
+ import { defineComponent as B, ref as b, watch as E, computed as i, createElementBlock as y, openBlock as d, normalizeClass as m, createBlock as M, createSlots as S, renderList as z, withCtx as D, renderSlot as J, normalizeProps as P, guardReactiveProps as j, createElementVNode as v, toDisplayString as L } from "vue";
2
+ import N from "../molecules/JTabs.vue.js";
3
+ import { cn as R } from "../../lib/utils.js";
4
+ const V = {
4
5
  key: 1,
5
6
  class: "flex items-center justify-center h-full w-full"
6
- }, V = { class: "text-center" }, q = { class: "text-muted-foreground text-lg" }, G = /* @__PURE__ */ $({
7
+ }, q = { class: "text-center" }, w = { class: "text-muted-foreground text-lg" }, K = /* @__PURE__ */ B({
7
8
  __name: "JDynamicTabs",
8
9
  props: {
9
10
  initialTabs: { default: () => [] },
10
11
  defaultActiveId: {},
11
12
  maxTabs: { default: 0 },
12
13
  emptyMessage: { default: "탭을 추가해주세요." },
13
- className: {},
14
- contentClassName: {},
14
+ class: {},
15
+ contentClass: {},
15
16
  styletype: { default: "default" }
16
17
  },
17
18
  emits: ["tabChange", "tabClose", "tabAdd"],
18
- setup(v, { expose: p, emit: A }) {
19
- const t = v, r = A, a = m(Array.isArray(t.initialTabs) ? [...t.initialTabs] : []), i = m(
20
- t.defaultActiveId || (Array.isArray(t.initialTabs) && t.initialTabs.length > 0 ? t.initialTabs[0]?.id : "") || ""
19
+ setup(f, { expose: A, emit: p }) {
20
+ const s = f, n = p, a = b(Array.isArray(s.initialTabs) ? [...s.initialTabs] : []), r = b(
21
+ s.defaultActiveId || (Array.isArray(s.initialTabs) && s.initialTabs.length > 0 ? s.initialTabs[0]?.id : "") || ""
21
22
  );
22
- j(() => t.initialTabs, (e) => {
23
+ E(() => s.initialTabs, (e) => {
23
24
  if (!e) {
24
25
  a.value = [];
25
26
  return;
26
27
  }
27
- Array.isArray(e) && e.length > 0 ? (a.value = [...e], !i.value && e[0] && (i.value = e[0].id)) : Array.isArray(e) ? a.value = [] : a.value = [];
28
+ Array.isArray(e) && e.length > 0 ? (a.value = [...e], !r.value && e[0] && (r.value = e[0].id)) : Array.isArray(e) ? a.value = [] : a.value = [];
28
29
  }, { immediate: !0 });
29
- const h = (e) => {
30
+ const T = (e) => {
30
31
  if (Array.isArray(a.value) || (a.value = []), a.value.find((l) => l.id === e.id)) {
31
32
  u(e.id);
32
33
  return;
33
34
  }
34
- if (t.maxTabs > 0 && a.value.length >= t.maxTabs) {
35
- console.warn(`최대 ${t.maxTabs}개의 탭만 열 수 있습니다.`);
35
+ if (s.maxTabs > 0 && a.value.length >= s.maxTabs) {
36
+ console.warn(`최대 ${s.maxTabs}개의 탭만 열 수 있습니다.`);
36
37
  return;
37
38
  }
38
39
  a.value.push({
39
40
  ...e,
40
41
  closable: e.closable !== !1
41
42
  // 기본값 true
42
- }), u(e.id), r("tabAdd", e);
43
+ }), u(e.id), n("tabAdd", e);
43
44
  }, o = (e) => {
44
45
  if (!Array.isArray(a.value))
45
46
  return;
46
- const s = a.value.findIndex((l) => l.id === e);
47
- if (s !== -1) {
48
- if (a.value.splice(s, 1), i.value === e)
47
+ const t = a.value.findIndex((l) => l.id === e);
48
+ if (t !== -1) {
49
+ if (a.value.splice(t, 1), r.value === e)
49
50
  if (a.value.length > 0) {
50
- const l = Math.min(s, a.value.length - 1);
51
- i.value = a.value[l]?.id || "";
51
+ const l = Math.min(t, a.value.length - 1);
52
+ r.value = a.value[l]?.id || "";
52
53
  } else
53
- i.value = "";
54
- r("tabClose", e);
54
+ r.value = "";
55
+ n("tabClose", e);
55
56
  }
56
57
  }, u = (e) => {
57
58
  if (!Array.isArray(a.value))
58
59
  return;
59
- a.value.find((l) => l.id === e) && (i.value = e);
60
- }, T = (e) => {
60
+ a.value.find((l) => l.id === e) && (r.value = e);
61
+ }, h = (e) => {
61
62
  if (Array.isArray(a.value))
62
- return a.value.find((s) => s.id === e);
63
+ return a.value.find((t) => t.id === e);
63
64
  }, g = () => {
64
65
  if (!Array.isArray(a.value))
65
66
  return;
66
- a.value.filter((s) => s.closable).forEach((s) => o(s.id));
67
+ a.value.filter((t) => t.closable).forEach((t) => o(t.id));
67
68
  }, x = (e) => {
68
- i.value = e, r("tabChange", e);
69
+ r.value = e, n("tabChange", e);
69
70
  }, C = (e) => {
70
71
  o(e);
71
72
  };
72
- p({
73
- addTab: h,
73
+ A({
74
+ addTab: T,
74
75
  closeTab: o,
75
76
  activateTab: u,
76
- findTab: T,
77
+ findTab: h,
77
78
  closeAllTabs: g
78
79
  });
79
- const c = n(() => Array.isArray(a.value) ? a.value : []), _ = n(() => c.value.length > 0), N = n(() => {
80
- const e = ["w-full", "h-full"];
81
- return t.className && e.push(t.className), e.join(" ");
82
- }), I = n(() => {
83
- const e = [];
84
- return t.contentClassName && e.push(t.contentClassName), e.join(" ");
85
- });
86
- return (e, s) => (d(), b("div", {
87
- class: y(N.value)
80
+ const c = i(() => Array.isArray(a.value) ? a.value : []), _ = i(() => c.value.length > 0), I = i(() => R("w-full h-full", s.class)), k = i(() => s.contentClass || "");
81
+ return (e, t) => (d(), y("div", {
82
+ class: m(I.value)
88
83
  }, [
89
- _.value ? (d(), B(L, {
84
+ _.value ? (d(), M(N, {
90
85
  key: 0,
91
86
  tabs: c.value,
92
- "active-tab-id": i.value,
93
- styletype: t.styletype,
94
- class: y(I.value),
87
+ "active-tab-id": r.value,
88
+ styletype: s.styletype,
89
+ class: m(k.value),
95
90
  onTabChange: x,
96
91
  onTabClose: C
97
- }, E({ _: 2 }, [
98
- M(c.value, (l) => ({
92
+ }, S({ _: 2 }, [
93
+ z(c.value, (l) => ({
99
94
  name: `content-${l.id}`,
100
- fn: S((k) => [
101
- z(e.$slots, `content-${l.id}`, D(J(k)))
95
+ fn: D(($) => [
96
+ J(e.$slots, `content-${l.id}`, P(j($)))
102
97
  ])
103
98
  }))
104
- ]), 1032, ["tabs", "active-tab-id", "styletype", "class"])) : (d(), b("div", R, [
105
- f("div", V, [
106
- f("p", q, P(v.emptyMessage), 1),
107
- s[0] || (s[0] = f("p", { class: "text-muted-foreground/60 text-sm mt-2" }, " 메뉴를 클릭하여 탭을 추가하세요. ", -1))
99
+ ]), 1032, ["tabs", "active-tab-id", "styletype", "class"])) : (d(), y("div", V, [
100
+ v("div", q, [
101
+ v("p", w, L(f.emptyMessage), 1),
102
+ t[0] || (t[0] = v("p", { class: "text-muted-foreground/60 text-sm mt-2" }, " 메뉴를 클릭하여 탭을 추가하세요. ", -1))
108
103
  ])
109
104
  ]))
110
105
  ], 2));
111
106
  }
112
107
  });
113
108
  export {
114
- G as default
109
+ K as default
115
110
  };
116
111
  //# sourceMappingURL=JDynamicTabs.vue.js.map