@j-solution/components 2.0.2 → 2.0.4

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 (54) hide show
  1. package/README.md +6 -5
  2. package/assets/jwms-portal-frontend-B5GA5JuZ.css +1 -0
  3. package/assets/styles/j-components.css +1 -1
  4. package/components/atoms/JBadge.vue.cjs +1 -1
  5. package/components/atoms/JBadge.vue.cjs.map +1 -1
  6. package/components/atoms/JBadge.vue.js +4 -4
  7. package/components/atoms/JBadge.vue.js.map +1 -1
  8. package/components/atoms/JGrid.vue.cjs +1 -1
  9. package/components/atoms/JGrid.vue.js +2 -2
  10. package/components/atoms/JGrid.vue2.cjs +1 -1
  11. package/components/atoms/JGrid.vue2.cjs.map +1 -1
  12. package/components/atoms/JGrid.vue2.js +16 -15
  13. package/components/atoms/JGrid.vue2.js.map +1 -1
  14. package/components/molecules/JCard.vue.cjs +1 -1
  15. package/components/molecules/JCard.vue.cjs.map +1 -1
  16. package/components/molecules/JCard.vue.js +28 -25
  17. package/components/molecules/JCard.vue.js.map +1 -1
  18. package/components/molecules/JFormField.vue.cjs +1 -1
  19. package/components/molecules/JFormField.vue.js +1 -1
  20. package/components/molecules/JFormField.vue2.cjs +1 -1
  21. package/components/molecules/JFormField.vue2.cjs.map +1 -1
  22. package/components/molecules/JFormField.vue2.js +124 -109
  23. package/components/molecules/JFormField.vue2.js.map +1 -1
  24. package/components/molecules/JTabs.vue.cjs +1 -1
  25. package/components/molecules/JTabs.vue.js +2 -2
  26. package/components/molecules/JTabs.vue2.cjs +1 -1
  27. package/components/molecules/JTabs.vue2.cjs.map +1 -1
  28. package/components/molecules/JTabs.vue2.js +108 -57
  29. package/components/molecules/JTabs.vue2.js.map +1 -1
  30. package/components/molecules/JTitlebar.vue.cjs +1 -1
  31. package/components/molecules/JTitlebar.vue.cjs.map +1 -1
  32. package/components/molecules/JTitlebar.vue.js +5 -5
  33. package/components/molecules/JTitlebar.vue.js.map +1 -1
  34. package/components/organisms/JFilterBar.vue.cjs +1 -1
  35. package/components/organisms/JFilterBar.vue.js +1 -1
  36. package/components/organisms/JFilterBar.vue2.cjs +1 -1
  37. package/components/organisms/JFilterBar.vue2.cjs.map +1 -1
  38. package/components/organisms/JFilterBar.vue2.js +14 -14
  39. package/components/organisms/JFilterBar.vue2.js.map +1 -1
  40. package/components/organisms/JPageContainer.vue.cjs +1 -1
  41. package/components/organisms/JPageContainer.vue.cjs.map +1 -1
  42. package/components/organisms/JPageContainer.vue.js +13 -13
  43. package/components/organisms/JPageContainer.vue.js.map +1 -1
  44. package/components/shadcn/FieldDescription.vue.cjs +1 -1
  45. package/components/shadcn/FieldDescription.vue.cjs.map +1 -1
  46. package/components/shadcn/FieldDescription.vue.js +1 -1
  47. package/components/shadcn/FieldDescription.vue.js.map +1 -1
  48. package/components/shadcn/FieldError.vue.cjs +1 -1
  49. package/components/shadcn/FieldError.vue.cjs.map +1 -1
  50. package/components/shadcn/FieldError.vue.js +7 -7
  51. package/components/shadcn/FieldError.vue.js.map +1 -1
  52. package/package.json +1 -1
  53. package/types/index.d.ts +9 -1
  54. package/assets/jwms-portal-frontend-DbH22gPh.css +0 -1
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),g=require("../shadcn/Badge.vue.cjs"),p=e.defineComponent({__name:"JBadge",props:{variant:{default:"default"},class:{},styletype:{default:"default"},size:{default:"sm"}},setup(n){const r=n,o={default:{class:""},primary:{variant:"default",class:"bg-blue-500 text-white hover:bg-blue-600"},success:{variant:"default",class:"bg-green-500 text-white hover:bg-green-600"},warning:{variant:"default",class:"bg-amber-500 text-white hover:bg-amber-600"},danger:{variant:"default",class:"bg-red-500 text-white hover:bg-red-600"}},i={xs:"text-[10px] px-1 py-0.5 leading-tight",sm:"text-xs px-1.5 py-0.5",md:"text-xs px-2 py-1",lg:"text-sm px-2.5 py-1"},u=e.computed(()=>{const t=o[r.styletype],l=i[r.size],s=r.variant||t.variant;let a="";s==="outline"?a=d(r.styletype):s==="secondary"?a="bg-gray-100 text-gray-800 hover:bg-gray-200":s==="destructive"?a="bg-red-500 text-white hover:bg-red-600":a=t.class;const c=[a,l,r.class].filter(Boolean).join(" ");return{variant:s,class:c}}),d=t=>({default:"border-gray-300 text-gray-700",primary:"border-blue-500 text-blue-600",success:"border-green-500 text-green-600",warning:"border-amber-500 text-amber-600",danger:"border-red-500 text-red-600"})[t]||"";return(t,l)=>(e.openBlock(),e.createBlock(g.default,e.normalizeProps(e.guardReactiveProps(u.value)),{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default")]),_:3},16))}});exports.default=p;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),g=require("../shadcn/Badge.vue.cjs"),p=e.defineComponent({__name:"JBadge",props:{variant:{default:"default"},class:{},styletype:{default:"default"},size:{default:"sm"}},setup(n){const r=n,o={default:{class:""},primary:{variant:"default",class:"bg-blue-500 text-white hover:bg-blue-600"},success:{variant:"default",class:"bg-green-500 text-white hover:bg-green-600"},warning:{variant:"default",class:"bg-amber-500 text-white hover:bg-amber-600"},danger:{variant:"default",class:"bg-red-500 text-white hover:bg-red-600"}},i={xs:"text-[10px] px-1 py-0.5 leading-tight",sm:"text-xs px-1.5 py-0.5",md:"text-sm px-2 py-1",lg:"text-sm px-2.5 py-1"},u=e.computed(()=>{const t=o[r.styletype],l=i[r.size],s=r.variant||t.variant;let a="";s==="outline"?a=d(r.styletype):s==="secondary"?a="bg-gray-100 text-gray-800 hover:bg-gray-200":s==="destructive"?a="bg-red-500 text-white hover:bg-red-600":a=t.class;const c=[a,l,r.class].filter(Boolean).join(" ");return{variant:s,class:c}}),d=t=>({default:"border-gray-300 text-gray-700",primary:"border-blue-500 text-blue-600",success:"border-green-500 text-green-600",warning:"border-amber-500 text-amber-600",danger:"border-red-500 text-red-600"})[t]||"";return(t,l)=>(e.openBlock(),e.createBlock(g.default,e.normalizeProps(e.guardReactiveProps(u.value)),{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default")]),_:3},16))}});exports.default=p;
2
2
  //# sourceMappingURL=JBadge.vue.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"JBadge.vue.cjs","sources":["../../../../src/components/atoms/JBadge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport Badge from '@/components/shadcn/Badge.vue'\n\ntype StyleType =\n | 'default' // 기본 스타일\n | 'primary' // 강조 스타일 (파랑)\n | 'success' // 성공 스타일 (초록)\n | 'warning' // 경고 스타일 (주황)\n | 'danger' // 위험 스타일 (빨강)\n\nconst props = withDefaults(\n defineProps<{\n variant?: 'default' | 'secondary' | 'destructive' | 'outline'\n class?: string\n /** 스타일 프리셋 */\n styletype?: StyleType\n /** 배지 크기 */\n size?: 'xs' | 'sm' | 'md' | 'lg'\n }>(),\n {\n variant: 'default',\n styletype: 'default',\n size: 'sm',\n },\n)\n\n/**\n * styletype -> variant, class 매핑\n */\nconst STYLE_PRESETS: Record<StyleType, { variant?: string; class: string }> = {\n default: { class: '' },\n primary: { \n variant: 'default',\n class: 'bg-blue-500 text-white hover:bg-blue-600',\n },\n success: { \n variant: 'default',\n class: 'bg-green-500 text-white hover:bg-green-600',\n },\n warning: { \n variant: 'default',\n class: 'bg-amber-500 text-white hover:bg-amber-600',\n },\n danger: { \n variant: 'default',\n class: 'bg-red-500 text-white hover:bg-red-600',\n },\n}\n\n/**\n * size -> class 매핑\n */\nconst SIZE_PRESETS: Record<'xs' | 'sm' | 'md' | 'lg', string> = {\n xs: 'text-[10px] px-1 py-0.5 leading-tight',\n sm: 'text-xs px-1.5 py-0.5',\n md: 'text-xs px-2 py-1',\n lg: 'text-sm px-2.5 py-1',\n}\n\n/** 최종 바인딩: 직접 넘긴 props가 있으면 styletype 기본값과 병합 */\nconst mapped = computed(() => {\n const preset = STYLE_PRESETS[props.styletype!]\n const sizeClass = SIZE_PRESETS[props.size!]\n \n const finalVariant = props.variant || preset.variant\n let styleClass = ''\n \n // variant에 따른 스타일 처리\n if (finalVariant === 'outline') {\n // outline: 테두리 색상만 적용 (styletype 색상 사용)\n styleClass = getOutlineStyleClass(props.styletype!)\n } else if (finalVariant === 'secondary') {\n // secondary: 고정된 회색 계열 스타일 (styletype 무시)\n styleClass = 'bg-gray-100 text-gray-800 hover:bg-gray-200'\n } else if (finalVariant === 'destructive') {\n // destructive: 고정된 빨간색 계열 스타일 (styletype 무시)\n styleClass = 'bg-red-500 text-white hover:bg-red-600'\n } else {\n // default: styletype의 배경색 스타일 적용\n styleClass = preset.class\n }\n \n const finalClass = [styleClass, sizeClass, props.class].filter(Boolean).join(' ')\n \n return {\n variant: finalVariant,\n class: finalClass,\n }\n})\n\n/**\n * outline variant용 스타일 클래스\n */\nconst getOutlineStyleClass = (styletype: StyleType): string => {\n const outlineStyles: Record<StyleType, string> = {\n default: 'border-gray-300 text-gray-700',\n primary: 'border-blue-500 text-blue-600',\n success: 'border-green-500 text-green-600',\n warning: 'border-amber-500 text-amber-600',\n danger: 'border-red-500 text-red-600',\n }\n return outlineStyles[styletype] || ''\n}\n</script>\n\n<template>\n <Badge v-bind=\"mapped\">\n <slot />\n </Badge>\n</template>\n"],"names":["props","__props","STYLE_PRESETS","SIZE_PRESETS","mapped","computed","preset","sizeClass","finalVariant","styleClass","getOutlineStyleClass","finalClass","styletype","_openBlock","_createBlock","Badge","_renderSlot","_ctx"],"mappings":"qTAWA,MAAMA,EAAQC,EAmBRC,EAAwE,CAC5E,QAAS,CAAE,MAAO,EAAA,EAClB,QAAS,CACP,QAAS,UACT,MAAO,0CAAA,EAET,QAAS,CACP,QAAS,UACT,MAAO,4CAAA,EAET,QAAS,CACP,QAAS,UACT,MAAO,4CAAA,EAET,OAAQ,CACN,QAAS,UACT,MAAO,wCAAA,CACT,EAMIC,EAA0D,CAC9D,GAAI,wCACJ,GAAI,wBACJ,GAAI,oBACJ,GAAI,qBAAA,EAIAC,EAASC,EAAAA,SAAS,IAAM,CAC5B,MAAMC,EAASJ,EAAcF,EAAM,SAAU,EACvCO,EAAYJ,EAAaH,EAAM,IAAK,EAEpCQ,EAAeR,EAAM,SAAWM,EAAO,QAC7C,IAAIG,EAAa,GAGbD,IAAiB,UAEnBC,EAAaC,EAAqBV,EAAM,SAAU,EACzCQ,IAAiB,YAE1BC,EAAa,8CACJD,IAAiB,cAE1BC,EAAa,yCAGbA,EAAaH,EAAO,MAGtB,MAAMK,EAAa,CAACF,EAAYF,EAAWP,EAAM,KAAK,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,EAEhF,MAAO,CACL,QAASQ,EACT,MAAOG,CAAA,CAEX,CAAC,EAKKD,EAAwBE,IACqB,CAC/C,QAAS,gCACT,QAAS,gCACT,QAAS,kCACT,QAAS,kCACT,OAAQ,6BAAA,GAEWA,CAAS,GAAK,iBAKnCC,EAAAA,UAAA,EAAAC,EAAAA,YAEQC,EAAAA,8CAFOX,EAAA,KAAM,CAAA,EAAA,mBACnB,IAAQ,CAARY,aAAQC,EAAA,OAAA,SAAA,CAAA"}
1
+ {"version":3,"file":"JBadge.vue.cjs","sources":["../../../../src/components/atoms/JBadge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport Badge from '@/components/shadcn/Badge.vue'\n\ntype StyleType =\n | 'default' // 기본 스타일\n | 'primary' // 강조 스타일 (파랑)\n | 'success' // 성공 스타일 (초록)\n | 'warning' // 경고 스타일 (주황)\n | 'danger' // 위험 스타일 (빨강)\n\nconst props = withDefaults(\n defineProps<{\n variant?: 'default' | 'secondary' | 'destructive' | 'outline'\n class?: string\n /** 스타일 프리셋 */\n styletype?: StyleType\n /** 배지 크기 */\n size?: 'xs' | 'sm' | 'md' | 'lg'\n }>(),\n {\n variant: 'default',\n styletype: 'default',\n size: 'sm',\n },\n)\n\n/**\n * styletype -> variant, class 매핑\n */\nconst STYLE_PRESETS: Record<StyleType, { variant?: string; class: string }> = {\n default: { class: '' },\n primary: { \n variant: 'default',\n class: 'bg-blue-500 text-white hover:bg-blue-600',\n },\n success: { \n variant: 'default',\n class: 'bg-green-500 text-white hover:bg-green-600',\n },\n warning: { \n variant: 'default',\n class: 'bg-amber-500 text-white hover:bg-amber-600',\n },\n danger: { \n variant: 'default',\n class: 'bg-red-500 text-white hover:bg-red-600',\n },\n}\n\n/**\n * size -> class 매핑\n */\nconst SIZE_PRESETS: Record<'xs' | 'sm' | 'md' | 'lg', string> = {\n xs: 'text-[10px] px-1 py-0.5 leading-tight',\n sm: 'text-xs px-1.5 py-0.5',\n md: 'text-sm px-2 py-1',\n lg: 'text-sm px-2.5 py-1',\n}\n\n/** 최종 바인딩: 직접 넘긴 props가 있으면 styletype 기본값과 병합 */\nconst mapped = computed(() => {\n const preset = STYLE_PRESETS[props.styletype!]\n const sizeClass = SIZE_PRESETS[props.size!]\n \n const finalVariant = props.variant || preset.variant\n let styleClass = ''\n \n // variant에 따른 스타일 처리\n if (finalVariant === 'outline') {\n // outline: 테두리 색상만 적용 (styletype 색상 사용)\n styleClass = getOutlineStyleClass(props.styletype!)\n } else if (finalVariant === 'secondary') {\n // secondary: 고정된 회색 계열 스타일 (styletype 무시)\n styleClass = 'bg-gray-100 text-gray-800 hover:bg-gray-200'\n } else if (finalVariant === 'destructive') {\n // destructive: 고정된 빨간색 계열 스타일 (styletype 무시)\n styleClass = 'bg-red-500 text-white hover:bg-red-600'\n } else {\n // default: styletype의 배경색 스타일 적용\n styleClass = preset.class\n }\n \n const finalClass = [styleClass, sizeClass, props.class].filter(Boolean).join(' ')\n \n return {\n variant: finalVariant,\n class: finalClass,\n }\n})\n\n/**\n * outline variant용 스타일 클래스\n */\nconst getOutlineStyleClass = (styletype: StyleType): string => {\n const outlineStyles: Record<StyleType, string> = {\n default: 'border-gray-300 text-gray-700',\n primary: 'border-blue-500 text-blue-600',\n success: 'border-green-500 text-green-600',\n warning: 'border-amber-500 text-amber-600',\n danger: 'border-red-500 text-red-600',\n }\n return outlineStyles[styletype] || ''\n}\n</script>\n\n<template>\n <Badge v-bind=\"mapped\">\n <slot />\n </Badge>\n</template>\n"],"names":["props","__props","STYLE_PRESETS","SIZE_PRESETS","mapped","computed","preset","sizeClass","finalVariant","styleClass","getOutlineStyleClass","finalClass","styletype","_openBlock","_createBlock","Badge","_renderSlot","_ctx"],"mappings":"qTAWA,MAAMA,EAAQC,EAmBRC,EAAwE,CAC5E,QAAS,CAAE,MAAO,EAAA,EAClB,QAAS,CACP,QAAS,UACT,MAAO,0CAAA,EAET,QAAS,CACP,QAAS,UACT,MAAO,4CAAA,EAET,QAAS,CACP,QAAS,UACT,MAAO,4CAAA,EAET,OAAQ,CACN,QAAS,UACT,MAAO,wCAAA,CACT,EAMIC,EAA0D,CAC9D,GAAI,wCACJ,GAAI,wBACJ,GAAI,oBACJ,GAAI,qBAAA,EAIAC,EAASC,EAAAA,SAAS,IAAM,CAC5B,MAAMC,EAASJ,EAAcF,EAAM,SAAU,EACvCO,EAAYJ,EAAaH,EAAM,IAAK,EAEpCQ,EAAeR,EAAM,SAAWM,EAAO,QAC7C,IAAIG,EAAa,GAGbD,IAAiB,UAEnBC,EAAaC,EAAqBV,EAAM,SAAU,EACzCQ,IAAiB,YAE1BC,EAAa,8CACJD,IAAiB,cAE1BC,EAAa,yCAGbA,EAAaH,EAAO,MAGtB,MAAMK,EAAa,CAACF,EAAYF,EAAWP,EAAM,KAAK,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,EAEhF,MAAO,CACL,QAASQ,EACT,MAAOG,CAAA,CAEX,CAAC,EAKKD,EAAwBE,IACqB,CAC/C,QAAS,gCACT,QAAS,gCACT,QAAS,kCACT,QAAS,kCACT,OAAQ,6BAAA,GAEWA,CAAS,GAAK,iBAKnCC,EAAAA,UAAA,EAAAC,EAAAA,YAEQC,EAAAA,8CAFOX,EAAA,KAAM,CAAA,EAAA,mBACnB,IAAQ,CAARY,aAAQC,EAAA,OAAA,SAAA,CAAA"}
@@ -1,4 +1,4 @@
1
- import { defineComponent as u, computed as g, createBlock as p, openBlock as b, normalizeProps as f, guardReactiveProps as x, withCtx as y, renderSlot as m } from "vue";
1
+ import { defineComponent as u, computed as g, createBlock as p, openBlock as b, normalizeProps as f, guardReactiveProps as x, withCtx as m, renderSlot as y } from "vue";
2
2
  import v from "../shadcn/Badge.vue.js";
3
3
  const _ = /* @__PURE__ */ u({
4
4
  __name: "JBadge",
@@ -30,7 +30,7 @@ const _ = /* @__PURE__ */ u({
30
30
  }, o = {
31
31
  xs: "text-[10px] px-1 py-0.5 leading-tight",
32
32
  sm: "text-xs px-1.5 py-0.5",
33
- md: "text-xs px-2 py-1",
33
+ md: "text-sm px-2 py-1",
34
34
  lg: "text-sm px-2.5 py-1"
35
35
  }, i = g(() => {
36
36
  const e = n[t.styletype], s = o[t.size], a = t.variant || e.variant;
@@ -49,8 +49,8 @@ const _ = /* @__PURE__ */ u({
49
49
  danger: "border-red-500 text-red-600"
50
50
  })[e] || "";
51
51
  return (e, s) => (b(), p(v, f(x(i.value)), {
52
- default: y(() => [
53
- m(e.$slots, "default")
52
+ default: m(() => [
53
+ y(e.$slots, "default")
54
54
  ]),
55
55
  _: 3
56
56
  }, 16));
@@ -1 +1 @@
1
- {"version":3,"file":"JBadge.vue.js","sources":["../../../../src/components/atoms/JBadge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport Badge from '@/components/shadcn/Badge.vue'\n\ntype StyleType =\n | 'default' // 기본 스타일\n | 'primary' // 강조 스타일 (파랑)\n | 'success' // 성공 스타일 (초록)\n | 'warning' // 경고 스타일 (주황)\n | 'danger' // 위험 스타일 (빨강)\n\nconst props = withDefaults(\n defineProps<{\n variant?: 'default' | 'secondary' | 'destructive' | 'outline'\n class?: string\n /** 스타일 프리셋 */\n styletype?: StyleType\n /** 배지 크기 */\n size?: 'xs' | 'sm' | 'md' | 'lg'\n }>(),\n {\n variant: 'default',\n styletype: 'default',\n size: 'sm',\n },\n)\n\n/**\n * styletype -> variant, class 매핑\n */\nconst STYLE_PRESETS: Record<StyleType, { variant?: string; class: string }> = {\n default: { class: '' },\n primary: { \n variant: 'default',\n class: 'bg-blue-500 text-white hover:bg-blue-600',\n },\n success: { \n variant: 'default',\n class: 'bg-green-500 text-white hover:bg-green-600',\n },\n warning: { \n variant: 'default',\n class: 'bg-amber-500 text-white hover:bg-amber-600',\n },\n danger: { \n variant: 'default',\n class: 'bg-red-500 text-white hover:bg-red-600',\n },\n}\n\n/**\n * size -> class 매핑\n */\nconst SIZE_PRESETS: Record<'xs' | 'sm' | 'md' | 'lg', string> = {\n xs: 'text-[10px] px-1 py-0.5 leading-tight',\n sm: 'text-xs px-1.5 py-0.5',\n md: 'text-xs px-2 py-1',\n lg: 'text-sm px-2.5 py-1',\n}\n\n/** 최종 바인딩: 직접 넘긴 props가 있으면 styletype 기본값과 병합 */\nconst mapped = computed(() => {\n const preset = STYLE_PRESETS[props.styletype!]\n const sizeClass = SIZE_PRESETS[props.size!]\n \n const finalVariant = props.variant || preset.variant\n let styleClass = ''\n \n // variant에 따른 스타일 처리\n if (finalVariant === 'outline') {\n // outline: 테두리 색상만 적용 (styletype 색상 사용)\n styleClass = getOutlineStyleClass(props.styletype!)\n } else if (finalVariant === 'secondary') {\n // secondary: 고정된 회색 계열 스타일 (styletype 무시)\n styleClass = 'bg-gray-100 text-gray-800 hover:bg-gray-200'\n } else if (finalVariant === 'destructive') {\n // destructive: 고정된 빨간색 계열 스타일 (styletype 무시)\n styleClass = 'bg-red-500 text-white hover:bg-red-600'\n } else {\n // default: styletype의 배경색 스타일 적용\n styleClass = preset.class\n }\n \n const finalClass = [styleClass, sizeClass, props.class].filter(Boolean).join(' ')\n \n return {\n variant: finalVariant,\n class: finalClass,\n }\n})\n\n/**\n * outline variant용 스타일 클래스\n */\nconst getOutlineStyleClass = (styletype: StyleType): string => {\n const outlineStyles: Record<StyleType, string> = {\n default: 'border-gray-300 text-gray-700',\n primary: 'border-blue-500 text-blue-600',\n success: 'border-green-500 text-green-600',\n warning: 'border-amber-500 text-amber-600',\n danger: 'border-red-500 text-red-600',\n }\n return outlineStyles[styletype] || ''\n}\n</script>\n\n<template>\n <Badge v-bind=\"mapped\">\n <slot />\n </Badge>\n</template>\n"],"names":["props","__props","STYLE_PRESETS","SIZE_PRESETS","mapped","computed","preset","sizeClass","finalVariant","styleClass","getOutlineStyleClass","finalClass","styletype","_openBlock","_createBlock","Badge","_renderSlot","_ctx"],"mappings":";;;;;;;;;;;AAWA,UAAMA,IAAQC,GAmBRC,IAAwE;AAAA,MAC5E,SAAS,EAAE,OAAO,GAAA;AAAA,MAClB,SAAS;AAAA,QACP,SAAS;AAAA,QACT,OAAO;AAAA,MAAA;AAAA,MAET,SAAS;AAAA,QACP,SAAS;AAAA,QACT,OAAO;AAAA,MAAA;AAAA,MAET,SAAS;AAAA,QACP,SAAS;AAAA,QACT,OAAO;AAAA,MAAA;AAAA,MAET,QAAQ;AAAA,QACN,SAAS;AAAA,QACT,OAAO;AAAA,MAAA;AAAA,IACT,GAMIC,IAA0D;AAAA,MAC9D,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA,GAIAC,IAASC,EAAS,MAAM;AAC5B,YAAMC,IAASJ,EAAcF,EAAM,SAAU,GACvCO,IAAYJ,EAAaH,EAAM,IAAK,GAEpCQ,IAAeR,EAAM,WAAWM,EAAO;AAC7C,UAAIG,IAAa;AAGjB,MAAID,MAAiB,YAEnBC,IAAaC,EAAqBV,EAAM,SAAU,IACzCQ,MAAiB,cAE1BC,IAAa,gDACJD,MAAiB,gBAE1BC,IAAa,2CAGbA,IAAaH,EAAO;AAGtB,YAAMK,IAAa,CAACF,GAAYF,GAAWP,EAAM,KAAK,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAEhF,aAAO;AAAA,QACL,SAASQ;AAAA,QACT,OAAOG;AAAA,MAAA;AAAA,IAEX,CAAC,GAKKD,IAAuB,CAACE,OACqB;AAAA,MAC/C,SAAS;AAAA,MACT,SAAS;AAAA,MACT,SAAS;AAAA,MACT,SAAS;AAAA,MACT,QAAQ;AAAA,IAAA,GAEWA,CAAS,KAAK;sBAKnCC,EAAA,GAAAC,EAEQC,OAFOX,EAAA,KAAM,CAAA,GAAA;AAAA,iBACnB,MAAQ;AAAA,QAARY,EAAQC,EAAA,QAAA,SAAA;AAAA,MAAA;;;;;"}
1
+ {"version":3,"file":"JBadge.vue.js","sources":["../../../../src/components/atoms/JBadge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport Badge from '@/components/shadcn/Badge.vue'\n\ntype StyleType =\n | 'default' // 기본 스타일\n | 'primary' // 강조 스타일 (파랑)\n | 'success' // 성공 스타일 (초록)\n | 'warning' // 경고 스타일 (주황)\n | 'danger' // 위험 스타일 (빨강)\n\nconst props = withDefaults(\n defineProps<{\n variant?: 'default' | 'secondary' | 'destructive' | 'outline'\n class?: string\n /** 스타일 프리셋 */\n styletype?: StyleType\n /** 배지 크기 */\n size?: 'xs' | 'sm' | 'md' | 'lg'\n }>(),\n {\n variant: 'default',\n styletype: 'default',\n size: 'sm',\n },\n)\n\n/**\n * styletype -> variant, class 매핑\n */\nconst STYLE_PRESETS: Record<StyleType, { variant?: string; class: string }> = {\n default: { class: '' },\n primary: { \n variant: 'default',\n class: 'bg-blue-500 text-white hover:bg-blue-600',\n },\n success: { \n variant: 'default',\n class: 'bg-green-500 text-white hover:bg-green-600',\n },\n warning: { \n variant: 'default',\n class: 'bg-amber-500 text-white hover:bg-amber-600',\n },\n danger: { \n variant: 'default',\n class: 'bg-red-500 text-white hover:bg-red-600',\n },\n}\n\n/**\n * size -> class 매핑\n */\nconst SIZE_PRESETS: Record<'xs' | 'sm' | 'md' | 'lg', string> = {\n xs: 'text-[10px] px-1 py-0.5 leading-tight',\n sm: 'text-xs px-1.5 py-0.5',\n md: 'text-sm px-2 py-1',\n lg: 'text-sm px-2.5 py-1',\n}\n\n/** 최종 바인딩: 직접 넘긴 props가 있으면 styletype 기본값과 병합 */\nconst mapped = computed(() => {\n const preset = STYLE_PRESETS[props.styletype!]\n const sizeClass = SIZE_PRESETS[props.size!]\n \n const finalVariant = props.variant || preset.variant\n let styleClass = ''\n \n // variant에 따른 스타일 처리\n if (finalVariant === 'outline') {\n // outline: 테두리 색상만 적용 (styletype 색상 사용)\n styleClass = getOutlineStyleClass(props.styletype!)\n } else if (finalVariant === 'secondary') {\n // secondary: 고정된 회색 계열 스타일 (styletype 무시)\n styleClass = 'bg-gray-100 text-gray-800 hover:bg-gray-200'\n } else if (finalVariant === 'destructive') {\n // destructive: 고정된 빨간색 계열 스타일 (styletype 무시)\n styleClass = 'bg-red-500 text-white hover:bg-red-600'\n } else {\n // default: styletype의 배경색 스타일 적용\n styleClass = preset.class\n }\n \n const finalClass = [styleClass, sizeClass, props.class].filter(Boolean).join(' ')\n \n return {\n variant: finalVariant,\n class: finalClass,\n }\n})\n\n/**\n * outline variant용 스타일 클래스\n */\nconst getOutlineStyleClass = (styletype: StyleType): string => {\n const outlineStyles: Record<StyleType, string> = {\n default: 'border-gray-300 text-gray-700',\n primary: 'border-blue-500 text-blue-600',\n success: 'border-green-500 text-green-600',\n warning: 'border-amber-500 text-amber-600',\n danger: 'border-red-500 text-red-600',\n }\n return outlineStyles[styletype] || ''\n}\n</script>\n\n<template>\n <Badge v-bind=\"mapped\">\n <slot />\n </Badge>\n</template>\n"],"names":["props","__props","STYLE_PRESETS","SIZE_PRESETS","mapped","computed","preset","sizeClass","finalVariant","styleClass","getOutlineStyleClass","finalClass","styletype","_openBlock","_createBlock","Badge","_renderSlot","_ctx"],"mappings":";;;;;;;;;;;AAWA,UAAMA,IAAQC,GAmBRC,IAAwE;AAAA,MAC5E,SAAS,EAAE,OAAO,GAAA;AAAA,MAClB,SAAS;AAAA,QACP,SAAS;AAAA,QACT,OAAO;AAAA,MAAA;AAAA,MAET,SAAS;AAAA,QACP,SAAS;AAAA,QACT,OAAO;AAAA,MAAA;AAAA,MAET,SAAS;AAAA,QACP,SAAS;AAAA,QACT,OAAO;AAAA,MAAA;AAAA,MAET,QAAQ;AAAA,QACN,SAAS;AAAA,QACT,OAAO;AAAA,MAAA;AAAA,IACT,GAMIC,IAA0D;AAAA,MAC9D,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA,GAIAC,IAASC,EAAS,MAAM;AAC5B,YAAMC,IAASJ,EAAcF,EAAM,SAAU,GACvCO,IAAYJ,EAAaH,EAAM,IAAK,GAEpCQ,IAAeR,EAAM,WAAWM,EAAO;AAC7C,UAAIG,IAAa;AAGjB,MAAID,MAAiB,YAEnBC,IAAaC,EAAqBV,EAAM,SAAU,IACzCQ,MAAiB,cAE1BC,IAAa,gDACJD,MAAiB,gBAE1BC,IAAa,2CAGbA,IAAaH,EAAO;AAGtB,YAAMK,IAAa,CAACF,GAAYF,GAAWP,EAAM,KAAK,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAEhF,aAAO;AAAA,QACL,SAASQ;AAAA,QACT,OAAOG;AAAA,MAAA;AAAA,IAEX,CAAC,GAKKD,IAAuB,CAACE,OACqB;AAAA,MAC/C,SAAS;AAAA,MACT,SAAS;AAAA,MACT,SAAS;AAAA,MACT,SAAS;AAAA,MACT,QAAQ;AAAA,IAAA,GAEWA,CAAS,KAAK;sBAKnCC,EAAA,GAAAC,EAEQC,OAFOX,EAAA,KAAM,CAAA,GAAA;AAAA,iBACnB,MAAQ;AAAA,QAARY,EAAQC,EAAA,QAAA,SAAA;AAAA,MAAA;;;;;"}
@@ -3,5 +3,5 @@
3
3
  for (const [t_key, t_val] of t_opts)
4
4
  t_merged[t_key] = t_val;
5
5
  return t_merged;
6
- };,u=t(e.default,[["__scopeId","data-v-0bf35c89"]]);exports.default=u;
6
+ };,u=t(e.default,[["__scopeId","data-v-6e7c5d76"]]);exports.default=u;
7
7
  //# sourceMappingURL=JGrid.vue.cjs.map
@@ -6,8 +6,8 @@ const r = (r_comp, r_opts) => {
6
6
  r_merged[r_key] = r_val;
7
7
  return r_merged;
8
8
  };
9
- const p = /* @__PURE__ */ r(o, [["__scopeId", "data-v-0bf35c89"]]);
9
+ const _ = /* @__PURE__ */ r(o, [["__scopeId", "data-v-6e7c5d76"]]);
10
10
  export {
11
- p as default
11
+ _ as default
12
12
  };
13
13
  //# sourceMappingURL=JGrid.vue.js.map
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("vue"),F=require("ag-grid-vue3"),M=require("../../lib/utils.cjs"),f=require("ag-grid-community"),N=require("ag-grid-enterprise"),T=l.defineComponent({__name:"JGrid",props:{class:{},rowData:{},columnDefs:{},pagination:{type:Boolean,default:!0},checkbox:{type:Boolean,default:!1},rowNumbers:{type:Boolean,default:!0},floatingFilters:{type:Boolean,default:!0},floatingFilter:{type:Boolean,default:void 0},rowNumberWidth:{default:38},actionButtons:{default:void 0},summaryColumn:{type:Boolean,default:!1},hiddenColumn:{type:Boolean,default:!1},enableGrouping:{type:Boolean,default:!0},enablePivot:{type:Boolean,default:!1},enableExcelExport:{type:Boolean,default:!1},enableTreeData:{type:Boolean,default:!1},getDataPath:{type:Function,default:void 0},autoGroupColumnDef:{default:void 0},selectedRows:{default:()=>[]},columnHover:{type:Boolean,default:!0},enableColumnsToolPanel:{type:Boolean,default:!0},statusBar:{type:Boolean,default:!0},compactFooter:{type:Boolean,default:!1},rowGroupPanelShow:{default:"never"},groupDefaultExpanded:{default:-1},pivotPanelShow:{default:"never"},pivotMode:{type:Boolean,default:!1}},emits:["rowClicked","rowDoubleClicked","cellClicked","selectionChanged","cellValueChanged","gridReady","update:selectedRows"],setup(m,{expose:w,emit:b}){f.ModuleRegistry.registerModules([f.AllCommunityModule,N.AllEnterpriseModule]);const y=f.themeQuartz.withParams({cellHorizontalPaddingScale:1,columnBorder:!0,fontSize:13,headerFontWeight:500,headerVerticalPaddingScale:.45,iconSize:14,rowVerticalPaddingScale:.4}).withParams({browserColorScheme:"light"},"light").withParams({browserColorScheme:"dark"},"dark"),u=l.ref(typeof document<"u"&&document.documentElement.classList.contains("dark")),c=l.ref(null);let d=null;l.watch(u,t=>{c.value?.setAttribute("data-ag-theme-mode",t?"dark":"light")}),l.onMounted(()=>{c.value?.setAttribute("data-ag-theme-mode",u.value?"dark":"light"),d=new MutationObserver(()=>{u.value=document.documentElement.classList.contains("dark")}),d.observe(document.documentElement,{attributes:!0,attributeFilter:["class"]})}),l.onUnmounted(()=>{d?.disconnect()});const e=m,i=b,n=l.ref(null),g=l.ref(null),P=t=>{const r=e.actionButtons||[],s=t.data,v=r.filter(o=>o.show?o.show(s):!0);if(v.length===0)return"";const p=document.createElement("div");return p.className="flex items-center gap-1",v.forEach(o=>{const a=document.createElement("button");a.className=o.styletype==="danger"?"j-action-btn j-action-btn-danger":"j-action-btn",o.tooltip&&(a.title=o.tooltip),o.label?a.textContent=o.label:o.icon&&(o.icon==="pencil"?a.textContent="수정":o.icon==="trash2"||o.icon==="trash"?a.textContent="삭제":o.icon==="eye"?a.textContent="보기":o.icon==="copy"?a.textContent="복사":o.icon==="download"?a.textContent="다운로드":o.icon==="circleX"?a.textContent="비활성화":o.icon==="circleCheckBig"?a.textContent="활성화":a.textContent=o.icon),a.addEventListener("click",R=>{R.stopPropagation(),o.onClick(s)}),p.appendChild(a)}),p},h=l.computed(()=>!e.actionButtons||e.actionButtons.length===0?null:{colId:"actionButtons",headerName:"작업",field:"_actions",width:120,minWidth:80,maxWidth:200,lockPosition:"left",sortable:!1,filter:!1,resizable:!0,suppressNavigable:!0,suppressHeaderMenuButton:!0,cellRenderer:P,cellStyle:{display:"flex",justifyContent:"center",alignItems:"center"}}),C=l.computed(()=>{const t=[];return e.checkbox&&t.push({colId:"rowSelection",headerName:"",width:40,minWidth:40,maxWidth:40,lockPosition:"left",checkboxSelection:!0,headerCheckboxSelection:!0,sortable:!1,filter:!1,resizable:!1,suppressNavigable:!0,suppressHeaderMenuButton:!0,cellStyle:{display:"flex",justifyContent:"center",alignItems:"center"},onCellClicked:r=>{const s=r.event?.target;s&&!s.closest(".ag-checkbox-input-wrapper")&&r.node.setSelected(!r.node.isSelected())}}),h.value&&t.push(h.value),t.push(...e.columnDefs),t}),x=l.computed(()=>{const t=e.floatingFilter??e.floatingFilters;return{theme:y,pagination:e.pagination,defaultColDef:{filter:!0,floatingFilter:t},rowSelection:e.checkbox?"multiple":void 0,suppressRowClickSelection:e.checkbox,rowNumbers:e.rowNumbers?{minWidth:e.rowNumberWidth,width:e.rowNumberWidth}:!1,columnHoverHighlight:e.columnHover,sideBar:e.enableColumnsToolPanel||e.enableGrouping||e.enablePivot?{toolPanels:[{id:"columns",labelDefault:"Columns",labelKey:"columns",iconKey:"columns",toolPanel:"agColumnsToolPanel",toolPanelParams:{suppressRowGroups:!e.enableGrouping,suppressValues:!e.enablePivot,suppressPivots:!e.enablePivot,suppressPivotMode:!e.enablePivot}}],defaultToolPanel:""}:void 0,statusBar:e.statusBar&&!e.compactFooter?{statusPanels:[{statusPanel:"agTotalAndFilteredRowCountComponent",align:"left"},{statusPanel:"agSelectedRowCountComponent",align:"left"},{statusPanel:"agAggregationComponent",align:"right"}]}:void 0,rowGroupPanelShow:e.rowGroupPanelShow!=="never"?e.rowGroupPanelShow:void 0,pivotPanelShow:e.pivotPanelShow!=="never"?e.pivotPanelShow:void 0,pivotMode:e.pivotMode,groupDefaultExpanded:e.groupDefaultExpanded,suppressAggFuncInHeader:!1,treeData:e.enableTreeData||void 0,getDataPath:e.enableTreeData?e.getDataPath||(s=>s.path||[]):void 0,autoGroupColumnDef:e.enableTreeData&&e.autoGroupColumnDef?e.autoGroupColumnDef:void 0}});w({gridApi:n,gridColumnApi:g,exportToExcel:()=>{n.value&&e.enableExcelExport&&n.value.exportDataAsExcel({fileName:"grid-export.xlsx"})}});const k=t=>{n.value=t.api,g.value=t.api,i("gridReady",t)},B=t=>{i("rowClicked",t)},D=t=>{i("rowDoubleClicked",t)},S=t=>{i("cellClicked",t)},E=t=>{i("selectionChanged",t),i("update:selectedRows",t.api.getSelectedRows())},G=t=>{i("cellValueChanged",t)};return l.watch(()=>e.columnDefs,()=>{n.value&&n.value.setGridOption("columnDefs",C.value)},{deep:!0}),l.watch(()=>e.rowData,()=>{n.value&&n.value.setGridOption("rowData",e.rowData)},{deep:!0}),(t,r)=>(l.openBlock(),l.createElementBlock("div",{ref_key:"gridContainerRef",ref:c,class:l.normalizeClass(l.unref(M.cn)("ag-grid-container",e.class))},[l.createVNode(l.unref(F.AgGridVue),{"column-defs":C.value,"row-data":m.rowData,"grid-options":x.value,style:{height:"100%",width:"100%"},onGridReady:k,onRowClicked:B,onRowDoubleClicked:D,onCellClicked:S,onSelectionChanged:E,onCellValueChanged:G},null,8,["column-defs","row-data","grid-options"])],2))}});exports.default=T;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("vue"),N=require("ag-grid-vue3"),F=require("../../lib/utils.cjs"),f=require("ag-grid-community"),M=require("ag-grid-enterprise"),T=l.defineComponent({__name:"JGrid",props:{class:{},rowData:{},columnDefs:{},pagination:{type:Boolean,default:!0},checkbox:{type:Boolean,default:!1},rowNumbers:{type:Boolean,default:!0},floatingFilters:{type:Boolean,default:!0},floatingFilter:{type:Boolean,default:void 0},rowNumberWidth:{default:38},actionButtons:{default:void 0},summaryColumn:{type:Boolean,default:!1},hiddenColumn:{type:Boolean,default:!1},enableGrouping:{type:Boolean,default:!0},enablePivot:{type:Boolean,default:!1},enableExcelExport:{type:Boolean,default:!1},enableTreeData:{type:Boolean,default:!1},getDataPath:{type:Function,default:void 0},autoGroupColumnDef:{default:void 0},selectedRows:{default:()=>[]},columnHover:{type:Boolean,default:!0},enableColumnsToolPanel:{type:Boolean,default:!0},statusBar:{type:Boolean,default:!0},compactFooter:{type:Boolean,default:!1},rowGroupPanelShow:{default:"never"},groupDefaultExpanded:{default:-1},pivotPanelShow:{default:"never"},pivotMode:{type:Boolean,default:!1}},emits:["rowClicked","rowDoubleClicked","cellClicked","selectionChanged","cellValueChanged","gridReady","update:selectedRows"],setup(m,{expose:w,emit:b}){f.ModuleRegistry.registerModules([f.AllCommunityModule,M.AllEnterpriseModule]);const y=f.themeQuartz.withParams({cellHorizontalPaddingScale:1,columnBorder:!0,fontSize:13,headerFontWeight:600,headerVerticalPaddingScale:.45,iconSize:14,rowVerticalPaddingScale:.4}).withParams({browserColorScheme:"light"},"light").withParams({browserColorScheme:"dark"},"dark"),u=l.ref(typeof document<"u"&&document.documentElement.classList.contains("dark")),c=l.ref(null);let d=null;l.watch(u,t=>{c.value?.setAttribute("data-ag-theme-mode",t?"dark":"light")}),l.onMounted(()=>{c.value?.setAttribute("data-ag-theme-mode",u.value?"dark":"light"),d=new MutationObserver(()=>{u.value=document.documentElement.classList.contains("dark")}),d.observe(document.documentElement,{attributes:!0,attributeFilter:["class"]})}),l.onUnmounted(()=>{d?.disconnect()});const e=m,i=b,n=l.ref(null),g=l.ref(null),P=t=>{const r=e.actionButtons||[],s=t.data,C=r.filter(o=>o.show?o.show(s):!0);if(C.length===0)return"";const p=document.createElement("div");return p.className="flex items-center gap-1",C.forEach(o=>{const a=document.createElement("button");a.className=o.styletype==="danger"?"j-action-btn j-action-btn-danger":"j-action-btn",o.tooltip&&(a.title=o.tooltip),o.label?a.textContent=o.label:o.icon&&(o.icon==="pencil"?a.textContent="수정":o.icon==="trash2"||o.icon==="trash"?a.textContent="삭제":o.icon==="eye"?a.textContent="보기":o.icon==="copy"?a.textContent="복사":o.icon==="download"?a.textContent="다운로드":o.icon==="circleX"?a.textContent="비활성화":o.icon==="circleCheckBig"?a.textContent="활성화":a.textContent=o.icon),a.addEventListener("click",R=>{R.stopPropagation(),o.onClick(s)}),p.appendChild(a)}),p},h=l.computed(()=>!e.actionButtons||e.actionButtons.length===0?null:{colId:"actionButtons",headerName:"작업",field:"_actions",width:120,minWidth:80,maxWidth:200,lockPosition:"left",sortable:!1,filter:!1,resizable:!0,suppressNavigable:!0,suppressHeaderMenuButton:!0,cellRenderer:P,cellStyle:{display:"flex",justifyContent:"center",alignItems:"center"}}),v=l.computed(()=>{const t=[];return e.checkbox&&t.push({colId:"rowSelection",headerName:"",width:40,minWidth:40,maxWidth:40,lockPosition:"left",checkboxSelection:!0,headerCheckboxSelection:!0,sortable:!1,filter:!1,resizable:!1,suppressNavigable:!0,suppressHeaderMenuButton:!0,cellStyle:{display:"flex",justifyContent:"center",alignItems:"center"},onCellClicked:r=>{const s=r.event?.target;s&&!s.closest(".ag-checkbox-input-wrapper")&&r.node.setSelected(!r.node.isSelected())}}),h.value&&t.push(h.value),t.push(...e.columnDefs),t}),x=l.computed(()=>{const t=e.floatingFilter??e.floatingFilters;return{theme:y,pagination:e.pagination,overlayNoRowsTemplate:'<span class="j-grid-no-rows">데이터가 없습니다</span>',defaultColDef:{filter:!0,floatingFilter:t},rowSelection:e.checkbox?"multiple":void 0,suppressRowClickSelection:e.checkbox,rowNumbers:e.rowNumbers?{minWidth:e.rowNumberWidth,width:e.rowNumberWidth}:!1,columnHoverHighlight:e.columnHover,sideBar:e.enableColumnsToolPanel||e.enableGrouping||e.enablePivot?{toolPanels:[{id:"columns",labelDefault:"Columns",labelKey:"columns",iconKey:"columns",toolPanel:"agColumnsToolPanel",toolPanelParams:{suppressRowGroups:!e.enableGrouping,suppressValues:!e.enablePivot,suppressPivots:!e.enablePivot,suppressPivotMode:!e.enablePivot}}],defaultToolPanel:""}:void 0,statusBar:e.statusBar&&!e.compactFooter?{statusPanels:[{statusPanel:"agTotalAndFilteredRowCountComponent",align:"left"},{statusPanel:"agSelectedRowCountComponent",align:"left"},{statusPanel:"agAggregationComponent",align:"right"}]}:void 0,rowGroupPanelShow:e.rowGroupPanelShow!=="never"?e.rowGroupPanelShow:void 0,pivotPanelShow:e.pivotPanelShow!=="never"?e.pivotPanelShow:void 0,pivotMode:e.pivotMode,groupDefaultExpanded:e.groupDefaultExpanded,suppressAggFuncInHeader:!1,treeData:e.enableTreeData||void 0,getDataPath:e.enableTreeData?e.getDataPath||(s=>s.path||[]):void 0,autoGroupColumnDef:e.enableTreeData&&e.autoGroupColumnDef?e.autoGroupColumnDef:void 0}});w({gridApi:n,gridColumnApi:g,exportToExcel:()=>{n.value&&e.enableExcelExport&&n.value.exportDataAsExcel({fileName:"grid-export.xlsx"})}});const k=t=>{n.value=t.api,g.value=t.api,i("gridReady",t)},B=t=>{i("rowClicked",t)},D=t=>{i("rowDoubleClicked",t)},S=t=>{i("cellClicked",t)},E=t=>{i("selectionChanged",t),i("update:selectedRows",t.api.getSelectedRows())},G=t=>{i("cellValueChanged",t)};return l.watch(()=>e.columnDefs,()=>{n.value&&n.value.setGridOption("columnDefs",v.value)},{deep:!0}),l.watch(()=>e.rowData,()=>{n.value&&n.value.setGridOption("rowData",e.rowData)},{deep:!0}),(t,r)=>(l.openBlock(),l.createElementBlock("div",{ref_key:"gridContainerRef",ref:c,class:l.normalizeClass(l.unref(F.cn)("ag-grid-container",e.class))},[l.createVNode(l.unref(N.AgGridVue),{"column-defs":v.value,"row-data":m.rowData,"grid-options":x.value,style:{height:"100%",width:"100%"},onGridReady:k,onRowClicked:B,onRowDoubleClicked:D,onCellClicked:S,onSelectionChanged:E,onCellValueChanged:G},null,8,["column-defs","row-data","grid-options"])],2))}});exports.default=T;
2
2
  //# sourceMappingURL=JGrid.vue2.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"JGrid.vue2.cjs","sources":["../../../../src/components/atoms/JGrid.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch, onMounted, onUnmounted } from 'vue'\nimport { AgGridVue } from 'ag-grid-vue3'\nimport { cn } from '@/lib/utils'\nimport type {\n ColDef,\n GridOptions,\n RowClickedEvent,\n CellClickedEvent,\n SelectionChangedEvent,\n CellValueChangedEvent,\n RowDoubleClickedEvent,\n GridReadyEvent,\n ICellRendererParams,\n} from 'ag-grid-community'\nimport { ModuleRegistry, AllCommunityModule, themeQuartz } from 'ag-grid-community'\n// Enterprise 모듈 import (Grouping, Pivot, Excel Export 등)\nimport { AllEnterpriseModule } from 'ag-grid-enterprise'\n\n// AG Grid 모듈 등록 (Community + Enterprise)\nModuleRegistry.registerModules([AllCommunityModule, AllEnterpriseModule])\n\n// ── 공식 권장: data-ag-theme-mode attribute 기반 다크모드 전환 ─────────────────\n// AG Grid v33 공식 패턴:\n// 1. themeQuartz.withParams({...}, 'light').withParams({...}, 'dark') 로 두 모드 정의\n// 2. data-ag-theme-mode attribute 전환으로 모드 스위칭 (theme 객체 재생성 불필요)\n// 3. CSS --ag-* 변수 오버라이드로 앱 CSS 변수 참조 (getCSSVar 우회 불필요)\nconst jTheme = themeQuartz\n .withParams({\n // 공통 사이즈 (라이트/다크 모두 적용)\n cellHorizontalPaddingScale: 1,\n columnBorder: true,\n fontSize: 13,\n headerFontWeight: 500,\n headerVerticalPaddingScale: 0.45,\n iconSize: 14,\n rowVerticalPaddingScale: 0.4,\n })\n .withParams({\n browserColorScheme: 'light',\n }, 'light')\n .withParams({\n browserColorScheme: 'dark',\n }, 'dark')\n\n// JLIS는 .dark class 기반 다크모드이므로 MutationObserver로 감지 후 attribute 동기화\nconst isDark = ref(typeof document !== 'undefined' && document.documentElement.classList.contains('dark'))\nconst gridContainerRef = ref<HTMLElement | null>(null)\nlet darkObserver: MutationObserver | null = null\n\n// isDark 변경 → data-ag-theme-mode 동기화 (AG Grid가 내부적으로 반응)\nwatch(isDark, (dark) => {\n gridContainerRef.value?.setAttribute('data-ag-theme-mode', dark ? 'dark' : 'light')\n})\n\nonMounted(() => {\n // 초기 attribute 설정\n gridContainerRef.value?.setAttribute('data-ag-theme-mode', isDark.value ? 'dark' : 'light')\n\n // 이후 변경 감지\n darkObserver = new MutationObserver(() => {\n isDark.value = document.documentElement.classList.contains('dark')\n })\n darkObserver.observe(document.documentElement, { attributes: true, attributeFilter: ['class'] })\n})\n\nonUnmounted(() => {\n darkObserver?.disconnect()\n})\n\n/**\n * Action Button 정의 타입\n */\nexport type ActionButton = {\n /** 버튼 아이콘 이름 (lucide) - label이 없을 때 기본 텍스트 생성에 사용 */\n icon?: string\n /** 버튼 라벨 */\n label?: string\n /** 툴팁 텍스트 */\n tooltip?: string\n /** 버튼 클릭 핸들러 (rowData 전달) */\n onClick: (rowData: any) => void\n /** 버튼 스타일 타입 */\n styletype?: 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger'\n /** 조건부 표시 함수 (rowData를 받아 boolean 반환) */\n show?: (rowData: any) => boolean\n}\n\nconst props = withDefaults(\n defineProps<{\n /** 추가 클래스 (외부 커스터마이징용) */\n class?: string\n /** 그리드에 표시할 데이터 배열 */\n rowData: any[]\n /** 컬럼 정의 배열 */\n columnDefs: ColDef[]\n /** 페이지네이션 활성화 여부 */\n pagination?: boolean\n /** 체크박스 선택 활성화 여부 */\n checkbox?: boolean\n /** 행 번호 표시 여부 (Enterprise) */\n rowNumbers?: boolean\n /** 플로팅 필터 표시 여부 */\n floatingFilters?: boolean\n /** 플로팅 필터 표시 여부 (하위호환 alias) */\n floatingFilter?: boolean\n /** 행 번호 컬럼 너비(px) */\n rowNumberWidth?: number\n /** 행별 액션 버튼 목록 */\n actionButtons?: ActionButton[]\n /** 요약 컬럼 표시 여부 */\n summaryColumn?: boolean\n /** 숨김 컬럼 관리 활성화 여부 */\n hiddenColumn?: boolean\n /** 그룹핑 기능 활성화 여부 (Enterprise) */\n enableGrouping?: boolean\n /** 피벗 기능 활성화 여부 (Enterprise) */\n enablePivot?: boolean\n /** Excel 내보내기 기능 활성화 여부 (Enterprise) */\n enableExcelExport?: boolean\n /** Tree Data 기능 활성화 여부 (Enterprise) */\n enableTreeData?: boolean\n /** Tree Data 계층 경로를 반환하는 함수 */\n getDataPath?: (data: any) => (string | number)[]\n /** Tree Data 그룹 컬럼 정의 */\n autoGroupColumnDef?: ColDef\n /** 선택된 행 데이터 배열 (v-model:selected-rows) */\n selectedRows?: any[]\n /** 컬럼 호버 하이라이트 활성화 여부 */\n columnHover?: boolean\n /** Columns Tool Panel 활성화 여부 (Enterprise) */\n enableColumnsToolPanel?: boolean\n /** Status Bar 활성화 여부 (Enterprise) */\n statusBar?: boolean\n /** 간소화된 Footer 모드 (Status Bar 제거, Pagination만 표시) */\n compactFooter?: boolean\n /** Row Group Panel 표시 여부 ('always' | 'onlyWhenGrouping' | 'never') */\n rowGroupPanelShow?: 'always' | 'onlyWhenGrouping' | 'never'\n /** 그룹 기본 확장 레벨 (-1: 모두 닫힘, 0: 첫 레벨만, 1: 2레벨까지...) */\n groupDefaultExpanded?: number\n /** Pivot Mode Panel 표시 여부 */\n pivotPanelShow?: 'always' | 'onlyWhenPivoting' | 'never'\n /** Pivot Mode 활성화 여부 */\n pivotMode?: boolean\n }>(),\n {\n pagination: true,\n checkbox: false,\n rowNumbers: true,\n floatingFilters: true,\n floatingFilter: undefined,\n rowNumberWidth: 38,\n actionButtons: undefined,\n summaryColumn: false,\n hiddenColumn: false,\n enableGrouping: true,\n enablePivot: false,\n enableExcelExport: false,\n enableTreeData: false,\n getDataPath: undefined,\n autoGroupColumnDef: undefined,\n selectedRows: () => [],\n columnHover: true,\n enableColumnsToolPanel: true,\n statusBar: true,\n compactFooter: false,\n rowGroupPanelShow: 'never',\n groupDefaultExpanded: -1,\n pivotPanelShow: 'never',\n pivotMode: false,\n },\n)\n\nconst emit = defineEmits<{\n /** 행 클릭 이벤트 */\n rowClicked: [event: RowClickedEvent]\n /** 행 더블클릭 이벤트 */\n rowDoubleClicked: [event: RowDoubleClickedEvent]\n /** 셀 클릭 이벤트 */\n cellClicked: [event: CellClickedEvent]\n /** 선택 변경 이벤트 (체크박스 등) */\n selectionChanged: [event: SelectionChangedEvent]\n /** 셀 값 변경 이벤트 */\n cellValueChanged: [event: CellValueChangedEvent]\n /** 그리드 준비 완료 이벤트 */\n gridReady: [event: GridReadyEvent]\n /** 선택된 행 변경 이벤트 (v-model:selected-rows) */\n 'update:selectedRows': [rows: any[]]\n}>()\n\n// ag-Grid 인스턴스 참조\nconst gridApi = ref<any>(null)\nconst gridColumnApi = ref<any>(null)\n\n// Action Buttons Cell Renderer - 함수형으로 DOM 직접 생성\nconst ActionButtonsCellRenderer = (params: ICellRendererParams) => {\n const buttons = props.actionButtons || []\n const rowData = params.data\n \n // 표시할 버튼 필터링\n const visibleButtons = buttons.filter(btn => {\n if (btn.show) {\n return btn.show(rowData)\n }\n return true\n })\n \n if (visibleButtons.length === 0) {\n return ''\n }\n \n // 컨테이너 div 생성\n const container = document.createElement('div')\n container.className = 'flex items-center gap-1'\n \n // 각 버튼 생성\n visibleButtons.forEach((btn) => {\n const button = document.createElement('button')\n button.className = btn.styletype === 'danger' ? 'j-action-btn j-action-btn-danger' : 'j-action-btn'\n \n // tooltip\n if (btn.tooltip) {\n button.title = btn.tooltip\n }\n \n // 라벨 추가 (텍스트 버튼)\n if (btn.label) {\n button.textContent = btn.label\n } else if (btn.icon) {\n // 라벨이 없으면 기본 텍스트 생성\n if (btn.icon === 'pencil') {\n button.textContent = '수정'\n } else if (btn.icon === 'trash2' || btn.icon === 'trash') {\n button.textContent = '삭제'\n } else if (btn.icon === 'eye') {\n button.textContent = '보기'\n } else if (btn.icon === 'copy') {\n button.textContent = '복사'\n } else if (btn.icon === 'download') {\n button.textContent = '다운로드'\n } else if (btn.icon === 'circleX') {\n button.textContent = '비활성화'\n } else if (btn.icon === 'circleCheckBig') {\n button.textContent = '활성화'\n } else {\n button.textContent = btn.icon\n }\n }\n \n // 클릭 이벤트\n button.addEventListener('click', (e) => {\n e.stopPropagation()\n btn.onClick(rowData)\n })\n \n container.appendChild(button)\n })\n \n return container\n}\n\n// Action Buttons 컬럼 정의\nconst actionButtonsColumn = computed<ColDef | null>(() => {\n if (!props.actionButtons || props.actionButtons.length === 0) {\n return null\n }\n \n return {\n colId: 'actionButtons',\n headerName: '작업',\n field: '_actions',\n width: 120,\n minWidth: 80,\n maxWidth: 200,\n lockPosition: 'left' as const,\n sortable: false,\n filter: false,\n resizable: true,\n suppressNavigable: true,\n suppressHeaderMenuButton: true,\n cellRenderer: ActionButtonsCellRenderer,\n cellStyle: { display: 'flex', justifyContent: 'center', alignItems: 'center' },\n }\n})\n\n// checkbox 활성화 및 추가 컬럼 처리\nconst processedColumnDefs = computed(() => {\n const columns: ColDef[] = []\n \n // 1. Checkbox 컬럼 (최우선)\n if (props.checkbox) {\n columns.push({\n colId: 'rowSelection',\n headerName: '',\n // field와 valueGetter 제거 - AG Grid 공식 방식\n width: 40,\n minWidth: 40,\n maxWidth: 40,\n lockPosition: 'left' as const,\n checkboxSelection: true,\n headerCheckboxSelection: true,\n sortable: false,\n filter: false,\n resizable: false,\n suppressNavigable: true,\n suppressHeaderMenuButton: true,\n cellStyle: { display: 'flex', justifyContent: 'center', alignItems: 'center' },\n // 체크박스 셀 클릭 시 토글 (checkbox 아이콘 클릭은 AG Grid 기본 처리)\n onCellClicked: (params: CellClickedEvent) => {\n const target = (params.event as MouseEvent)?.target as HTMLElement\n if (target && !target.closest('.ag-checkbox-input-wrapper')) {\n params.node.setSelected(!params.node.isSelected())\n }\n },\n })\n }\n \n // 2. Action Buttons 컬럼\n if (actionButtonsColumn.value) {\n columns.push(actionButtonsColumn.value)\n }\n \n // 3. 사용자 정의 컬럼들 (Row Numbers는 AG Grid가 자동으로 추가)\n columns.push(...props.columnDefs)\n \n return columns\n})\n\n// Grid 옵션 설정\nconst gridOptions = computed<GridOptions>(() => {\n const useFloatingFilters = props.floatingFilter ?? props.floatingFilters\n const options: GridOptions = {\n theme: jTheme,\n pagination: props.pagination,\n defaultColDef: {\n filter: true,\n floatingFilter: useFloatingFilters,\n },\n rowSelection: props.checkbox ? 'multiple' : undefined,\n // 체크박스 모드일 때 row 클릭으로 선택이 변경되지 않도록 설정\n // 체크박스만으로 선택을 제어하도록 함\n suppressRowClickSelection: props.checkbox,\n\n // Row Numbers (Enterprise) - AG Grid 표준 방식\n rowNumbers: props.rowNumbers\n ? ({\n minWidth: props.rowNumberWidth,\n width: props.rowNumberWidth,\n } as any)\n : false,\n\n // Column Hover Highlight\n columnHoverHighlight: props.columnHover,\n\n // Enterprise 기능 옵션\n sideBar: props.enableColumnsToolPanel || props.enableGrouping || props.enablePivot ? {\n toolPanels: [\n {\n id: 'columns',\n labelDefault: 'Columns',\n labelKey: 'columns',\n iconKey: 'columns',\n toolPanel: 'agColumnsToolPanel',\n toolPanelParams: {\n suppressRowGroups: !props.enableGrouping,\n suppressValues: !props.enablePivot,\n suppressPivots: !props.enablePivot,\n suppressPivotMode: !props.enablePivot,\n },\n },\n ],\n defaultToolPanel: '', // 초기에는 접힌 상태\n } : undefined,\n\n // Status Bar (Enterprise)\n // compactFooter 모드에서는 Status Bar 비활성화\n statusBar: (props.statusBar && !props.compactFooter) ? {\n statusPanels: [\n { statusPanel: 'agTotalAndFilteredRowCountComponent', align: 'left' as const },\n { statusPanel: 'agSelectedRowCountComponent', align: 'left' as const },\n { statusPanel: 'agAggregationComponent', align: 'right' as const },\n ],\n } : undefined,\n\n // Row Group Panel 설정 (Enterprise) - 그리드 상단에 드래그 영역 표시\n rowGroupPanelShow: props.rowGroupPanelShow !== 'never' ? props.rowGroupPanelShow : undefined,\n\n // Pivot Panel 설정 (Enterprise) - 피벗 모드용 드래그 영역\n pivotPanelShow: props.pivotPanelShow !== 'never' ? props.pivotPanelShow : undefined,\n \n // Pivot Mode 활성화\n pivotMode: props.pivotMode,\n\n // 그룹핑 기본 설정\n groupDefaultExpanded: props.groupDefaultExpanded,\n suppressAggFuncInHeader: false,\n\n // Tree Data 설정 (Enterprise)\n treeData: props.enableTreeData || undefined,\n getDataPath: props.enableTreeData\n ? (props.getDataPath || ((data: any) => data.path || []))\n : undefined,\n autoGroupColumnDef: props.enableTreeData && props.autoGroupColumnDef\n ? props.autoGroupColumnDef\n : undefined,\n }\n\n return options\n})\n\n// Excel 내보내기 함수 (외부에서 사용 가능하도록 expose)\nconst exportToExcel = () => {\n if (gridApi.value && props.enableExcelExport) {\n gridApi.value.exportDataAsExcel({\n fileName: 'grid-export.xlsx',\n })\n }\n}\n\n// 그리드 API를 외부에 노출\ndefineExpose({\n gridApi,\n gridColumnApi,\n exportToExcel,\n})\n\n// Grid ready 이벤트 핸들러\nconst onGridReady = (params: GridReadyEvent) => {\n gridApi.value = params.api\n gridColumnApi.value = params.api // v34에서 columnApi는 deprecated\n emit('gridReady', params)\n}\n\n// 행 클릭 이벤트 핸들러\nconst onRowClicked = (event: RowClickedEvent) => {\n emit('rowClicked', event)\n}\n\n// 행 더블클릭 이벤트 핸들러\nconst onRowDoubleClicked = (event: RowDoubleClickedEvent) => {\n emit('rowDoubleClicked', event)\n}\n\n// 셀 클릭 이벤트 핸들러\nconst onCellClicked = (event: CellClickedEvent) => {\n emit('cellClicked', event)\n}\n\n// 선택 변경 이벤트 핸들러\nconst onSelectionChanged = (event: SelectionChangedEvent) => {\n emit('selectionChanged', event)\n emit('update:selectedRows', event.api.getSelectedRows())\n}\n\n// 셀 값 변경 이벤트 핸들러\nconst onCellValueChanged = (event: CellValueChangedEvent) => {\n emit('cellValueChanged', event)\n}\n\n// columnDefs 변경 감지\nwatch(\n () => props.columnDefs,\n () => {\n if (gridApi.value) {\n gridApi.value.setGridOption('columnDefs', processedColumnDefs.value)\n }\n },\n { deep: true },\n)\n\n// rowData 변경 감지\nwatch(\n () => props.rowData,\n () => {\n if (gridApi.value) {\n gridApi.value.setGridOption('rowData', props.rowData)\n }\n },\n { deep: true },\n)\n</script>\n\n<template>\n <div ref=\"gridContainerRef\" :class=\"cn('ag-grid-container', props.class)\">\n <AgGridVue\n :column-defs=\"processedColumnDefs\"\n :row-data=\"rowData\"\n :grid-options=\"gridOptions\"\n style=\"height: 100%; width: 100%\"\n @grid-ready=\"onGridReady\"\n @row-clicked=\"onRowClicked\"\n @row-double-clicked=\"onRowDoubleClicked\"\n @cell-clicked=\"onCellClicked\"\n @selection-changed=\"onSelectionChanged\"\n @cell-value-changed=\"onCellValueChanged\"\n />\n </div>\n</template>\n\n<style scoped>\n.ag-grid-container {\n width: 100%;\n height: 100%;\n\n /*\n * App CSS 변수 → AG Grid CSS 변수 브릿지\n * CSS 변수는 런타임 해소 → .dark 클래스 전환 시 라이트/다크 자동 대응\n * AG Grid v33 공식 CSS variable 명칭 사용\n */\n --ag-background-color: hsl(var(--background));\n --ag-foreground-color: hsl(var(--foreground));\n --ag-border-color: hsl(var(--border));\n --ag-header-background-color: hsl(var(--muted));\n --ag-header-foreground-color: hsl(var(--foreground));\n --ag-odd-row-background-color: hsl(var(--card));\n --ag-row-hover-color: hsl(var(--accent));\n --ag-selected-row-background-color: hsl(var(--primary) / 0.12);\n --ag-accent-color: hsl(var(--primary));\n --ag-header-height: var(--j-grid-header-h);\n --ag-row-height: var(--j-grid-row-h);\n}\n\n/* ============================================\n COMPACT FOOTER: Status Bar + Pagination 통합\n ============================================ */\n\n/* Status Bar 높이 줄이기 */\n:deep(.ag-status-bar) {\n min-height: var(--j-grid-footer-h) !important;\n height: var(--j-grid-footer-h) !important;\n padding: 0 12px !important;\n border-top: 1px solid var(--ag-border-color);\n display: flex;\n align-items: center;\n justify-content: space-between;\n font-size: 0.8125rem;\n}\n\n/* Status Bar 컴포넌트들 높이 조정 */\n:deep(.ag-status-bar-left),\n:deep(.ag-status-bar-center),\n:deep(.ag-status-bar-right) {\n height: var(--j-grid-footer-h);\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n/* Status Bar 패널들 간격 조정 */\n:deep(.ag-status-panel) {\n padding: 0;\n height: var(--j-grid-footer-h);\n display: flex;\n align-items: center;\n}\n\n/* Pagination Panel 높이 줄이기 */\n:deep(.ag-paging-panel) {\n min-height: var(--j-grid-footer-h) !important;\n height: var(--j-grid-footer-h) !important;\n padding: 0 12px !important;\n border-top: 1px solid var(--ag-border-color);\n font-size: 0.8125rem;\n}\n\n/* Pagination 컴포넌트들 높이 조정 */\n:deep(.ag-paging-page-size),\n:deep(.ag-paging-row-summary-panel) {\n height: var(--j-grid-footer-h);\n display: flex;\n align-items: center;\n}\n\n/* Page Size Selector 높이 조정 */\n:deep(.ag-paging-page-size .ag-picker-field) {\n height: 24px;\n min-height: 24px;\n}\n\n:deep(.ag-paging-page-size .ag-picker-field-wrapper) {\n height: 24px;\n padding: 0 4px;\n}\n\n/* Pagination 버튼들 높이 조정 */\n:deep(.ag-paging-button) {\n height: 24px;\n width: 24px;\n padding: 2px;\n}\n\n/* Pagination 버튼 래퍼 */\n:deep(.ag-paging-button-wrapper) {\n height: var(--j-grid-footer-h);\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n/* Row summary 텍스트 */\n:deep(.ag-paging-row-summary-panel-number) {\n line-height: var(--j-grid-footer-h);\n}\n\n/* ========================================\n 패턴 9: AG-Grid 스타일 향상\n ======================================== */\n\n:deep(.ag-root-wrapper) {\n border: 1px solid hsl(var(--border));\n border-radius: 0.375rem;\n}\n\n/* ── Header ──────────────────────────────────────────────────────────── */\n:deep(.ag-header) {\n border-bottom: 1px solid hsl(var(--border));\n font-weight: 500;\n}\n\n:deep(.ag-header-row:not(.ag-floating-filter)) {\n min-height: var(--j-grid-header-h) !important;\n height: var(--j-grid-header-h) !important;\n}\n\n:deep(.ag-header-cell) {\n color: hsl(var(--foreground));\n font-size: 0.75rem;\n padding: 0 0.5rem;\n display: flex;\n align-items: center;\n}\n\n/* Floating Filter: 헤더와 명확히 구분되는 입력 영역 */\n:deep(.ag-header-row.ag-floating-filter) {\n min-height: var(--j-grid-filter-h) !important;\n height: var(--j-grid-filter-h) !important;\n background-color: hsl(var(--card));\n border-top: 1px solid hsl(var(--border) / 0.5);\n}\n\n:deep(.ag-floating-filter-body) {\n min-height: var(--j-grid-filter-h);\n}\n\n:deep(.ag-floating-filter-body input),\n:deep(.ag-floating-filter-body .ag-input-field-input),\n:deep(.ag-floating-filter-body .ag-picker-field-wrapper) {\n height: 20px !important;\n min-height: 20px !important;\n font-size: 0.75rem;\n background-color: hsl(var(--background)) !important;\n border: 1px solid hsl(var(--border)) !important;\n border-radius: 3px !important;\n padding: 0 4px !important;\n color: hsl(var(--foreground)) !important;\n}\n\n:deep(.ag-floating-filter-body input:focus),\n:deep(.ag-floating-filter-body .ag-input-field-input:focus) {\n border-color: hsl(var(--primary)) !important;\n outline: none !important;\n}\n\n/* ── Rows ────────────────────────────────────────────────────────────── */\n:deep(.ag-row) {\n min-height: var(--j-grid-row-h) !important;\n height: var(--j-grid-row-h) !important;\n transition: background-color 0.15s ease, box-shadow 0.15s ease;\n cursor: pointer;\n}\n\n/* 선택된 행: 왼쪽 accent 기둥으로 명확한 시각적 선택 표시 (라이트/다크 모두) */\n:deep(.ag-row-selected) {\n box-shadow: inset 3px 0 0 hsl(var(--primary));\n}\n\n/* ── Cells ───────────────────────────────────────────────────────────── */\n:deep(.ag-cell) {\n line-height: 1.2;\n padding: 0 0.5rem;\n font-size: 0.75rem;\n border-bottom: 1px solid hsl(var(--border) / 0.5);\n}\n\n:deep(.ag-cell-wrapper) {\n align-items: center;\n}\n\n:deep(.ag-cell-value) {\n display: flex;\n align-items: center;\n min-height: 100%;\n}\n\n/* 행 클릭 시 row number 셀에 보이는 강한 포커스 음영 제거 */\n:deep(.ag-cell.ag-row-number-cell.ag-cell-focus),\n:deep(.ag-cell.ag-row-number-cell:focus-within) {\n box-shadow: none !important;\n outline: none !important;\n}\n\n/* 셀 포커스 */\n:deep(.ag-cell.ag-cell-focus) {\n box-shadow: inset 0 0 0 1px hsl(var(--ring) / 0.5) !important;\n}\n\n/* 인라인 편집 셀 */\n:deep(.ag-cell-inline-editing) {\n padding: 0 !important;\n border: none !important;\n box-shadow: inset 0 0 0 1px hsl(var(--primary)) !important;\n background-color: hsl(var(--background)) !important;\n}\n\n:deep(.ag-cell-inline-editing .ag-cell-editor),\n:deep(.ag-cell-inline-editing .ag-text-field-input-wrapper),\n:deep(.ag-cell-inline-editing .ag-input-field) {\n height: 100% !important;\n border: none !important;\n outline: none !important;\n background: transparent !important;\n box-shadow: none !important;\n}\n\n:deep(.ag-cell-inline-editing input) {\n height: 100% !important;\n width: 100% !important;\n padding: 0 0.5rem !important;\n border: none !important;\n outline: none !important;\n background: transparent !important;\n box-shadow: none !important;\n font-size: 0.75rem !important;\n color: hsl(var(--foreground)) !important;\n}\n\n/* ── Checkbox 셀 중앙정렬 (col-id 속성 선택자 — 신뢰할 수 있는 접근) ── */\n:deep(.ag-cell[col-id=\"rowSelection\"]) {\n display: flex !important;\n justify-content: center !important;\n align-items: center !important;\n padding: 0 !important;\n}\n:deep(.ag-cell[col-id=\"rowSelection\"] .ag-cell-wrapper) {\n width: auto !important;\n flex: none !important;\n}\n:deep(.ag-header-cell[col-id=\"rowSelection\"] .ag-header-cell-comp-wrapper) {\n justify-content: center !important;\n}\n\n/* ── Action Buttons (JS 렌더러 — CSS variable 브릿지) ─────────────────── */\n:deep(.j-action-btn) {\n padding: 1px 8px;\n font-size: 0.75rem;\n border: 1px solid hsl(var(--border));\n border-radius: 3px;\n background-color: hsl(var(--card));\n color: hsl(var(--foreground));\n cursor: pointer;\n transition: background-color 0.15s ease;\n white-space: nowrap;\n}\n\n:deep(.j-action-btn:hover) {\n background-color: hsl(var(--accent));\n}\n\n:deep(.j-action-btn-danger) {\n border-color: hsl(var(--destructive) / 0.4);\n background-color: hsl(var(--destructive) / 0.06);\n color: hsl(var(--destructive));\n}\n\n:deep(.j-action-btn-danger:hover) {\n background-color: hsl(var(--destructive) / 0.15);\n}\n\n/* ── Pagination ──────────────────────────────────────────────────────── */\n:deep(.ag-paging-panel) {\n border-top: 1px solid hsl(var(--border));\n}\n</style>\n"],"names":["ModuleRegistry","AllCommunityModule","AllEnterpriseModule","jTheme","themeQuartz","isDark","ref","gridContainerRef","darkObserver","watch","dark","onMounted","onUnmounted","props","__props","emit","__emit","gridApi","gridColumnApi","ActionButtonsCellRenderer","params","buttons","rowData","visibleButtons","btn","container","button","e","actionButtonsColumn","computed","processedColumnDefs","columns","target","gridOptions","useFloatingFilters","data","__expose","onGridReady","onRowClicked","event","onRowDoubleClicked","onCellClicked","onSelectionChanged","onCellValueChanged","_createElementBlock","_normalizeClass","_unref","cn","_createVNode","AgGridVue"],"mappings":"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"}
1
+ {"version":3,"file":"JGrid.vue2.cjs","sources":["../../../../src/components/atoms/JGrid.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch, onMounted, onUnmounted } from 'vue'\nimport { AgGridVue } from 'ag-grid-vue3'\nimport { cn } from '@/lib/utils'\nimport type {\n ColDef,\n GridOptions,\n RowClickedEvent,\n CellClickedEvent,\n SelectionChangedEvent,\n CellValueChangedEvent,\n RowDoubleClickedEvent,\n GridReadyEvent,\n ICellRendererParams,\n} from 'ag-grid-community'\nimport { ModuleRegistry, AllCommunityModule, themeQuartz } from 'ag-grid-community'\n// Enterprise 모듈 import (Grouping, Pivot, Excel Export 등)\nimport { AllEnterpriseModule } from 'ag-grid-enterprise'\n\n// AG Grid 모듈 등록 (Community + Enterprise)\nModuleRegistry.registerModules([AllCommunityModule, AllEnterpriseModule])\n\n// ── 공식 권장: data-ag-theme-mode attribute 기반 다크모드 전환 ─────────────────\n// AG Grid v33 공식 패턴:\n// 1. themeQuartz.withParams({...}, 'light').withParams({...}, 'dark') 로 두 모드 정의\n// 2. data-ag-theme-mode attribute 전환으로 모드 스위칭 (theme 객체 재생성 불필요)\n// 3. CSS --ag-* 변수 오버라이드로 앱 CSS 변수 참조 (getCSSVar 우회 불필요)\nconst jTheme = themeQuartz\n .withParams({\n // 공통 사이즈 (라이트/다크 모두 적용)\n cellHorizontalPaddingScale: 1,\n columnBorder: true,\n fontSize: 13,\n headerFontWeight: 600,\n headerVerticalPaddingScale: 0.45,\n iconSize: 14,\n rowVerticalPaddingScale: 0.4,\n })\n .withParams({\n browserColorScheme: 'light',\n }, 'light')\n .withParams({\n browserColorScheme: 'dark',\n }, 'dark')\n\n// JLIS는 .dark class 기반 다크모드이므로 MutationObserver로 감지 후 attribute 동기화\nconst isDark = ref(typeof document !== 'undefined' && document.documentElement.classList.contains('dark'))\nconst gridContainerRef = ref<HTMLElement | null>(null)\nlet darkObserver: MutationObserver | null = null\n\n// isDark 변경 → data-ag-theme-mode 동기화 (AG Grid가 내부적으로 반응)\nwatch(isDark, (dark) => {\n gridContainerRef.value?.setAttribute('data-ag-theme-mode', dark ? 'dark' : 'light')\n})\n\nonMounted(() => {\n // 초기 attribute 설정\n gridContainerRef.value?.setAttribute('data-ag-theme-mode', isDark.value ? 'dark' : 'light')\n\n // 이후 변경 감지\n darkObserver = new MutationObserver(() => {\n isDark.value = document.documentElement.classList.contains('dark')\n })\n darkObserver.observe(document.documentElement, { attributes: true, attributeFilter: ['class'] })\n})\n\nonUnmounted(() => {\n darkObserver?.disconnect()\n})\n\n/**\n * Action Button 정의 타입\n */\nexport type ActionButton = {\n /** 버튼 아이콘 이름 (lucide) - label이 없을 때 기본 텍스트 생성에 사용 */\n icon?: string\n /** 버튼 라벨 */\n label?: string\n /** 툴팁 텍스트 */\n tooltip?: string\n /** 버튼 클릭 핸들러 (rowData 전달) */\n onClick: (rowData: any) => void\n /** 버튼 스타일 타입 */\n styletype?: 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger'\n /** 조건부 표시 함수 (rowData를 받아 boolean 반환) */\n show?: (rowData: any) => boolean\n}\n\nconst props = withDefaults(\n defineProps<{\n /** 추가 클래스 (외부 커스터마이징용) */\n class?: string\n /** 그리드에 표시할 데이터 배열 */\n rowData: any[]\n /** 컬럼 정의 배열 */\n columnDefs: ColDef[]\n /** 페이지네이션 활성화 여부 */\n pagination?: boolean\n /** 체크박스 선택 활성화 여부 */\n checkbox?: boolean\n /** 행 번호 표시 여부 (Enterprise) */\n rowNumbers?: boolean\n /** 플로팅 필터 표시 여부 */\n floatingFilters?: boolean\n /** 플로팅 필터 표시 여부 (하위호환 alias) */\n floatingFilter?: boolean\n /** 행 번호 컬럼 너비(px) */\n rowNumberWidth?: number\n /** 행별 액션 버튼 목록 */\n actionButtons?: ActionButton[]\n /** 요약 컬럼 표시 여부 */\n summaryColumn?: boolean\n /** 숨김 컬럼 관리 활성화 여부 */\n hiddenColumn?: boolean\n /** 그룹핑 기능 활성화 여부 (Enterprise) */\n enableGrouping?: boolean\n /** 피벗 기능 활성화 여부 (Enterprise) */\n enablePivot?: boolean\n /** Excel 내보내기 기능 활성화 여부 (Enterprise) */\n enableExcelExport?: boolean\n /** Tree Data 기능 활성화 여부 (Enterprise) */\n enableTreeData?: boolean\n /** Tree Data 계층 경로를 반환하는 함수 */\n getDataPath?: (data: any) => (string | number)[]\n /** Tree Data 그룹 컬럼 정의 */\n autoGroupColumnDef?: ColDef\n /** 선택된 행 데이터 배열 (v-model:selected-rows) */\n selectedRows?: any[]\n /** 컬럼 호버 하이라이트 활성화 여부 */\n columnHover?: boolean\n /** Columns Tool Panel 활성화 여부 (Enterprise) */\n enableColumnsToolPanel?: boolean\n /** Status Bar 활성화 여부 (Enterprise) */\n statusBar?: boolean\n /** 간소화된 Footer 모드 (Status Bar 제거, Pagination만 표시) */\n compactFooter?: boolean\n /** Row Group Panel 표시 여부 ('always' | 'onlyWhenGrouping' | 'never') */\n rowGroupPanelShow?: 'always' | 'onlyWhenGrouping' | 'never'\n /** 그룹 기본 확장 레벨 (-1: 모두 닫힘, 0: 첫 레벨만, 1: 2레벨까지...) */\n groupDefaultExpanded?: number\n /** Pivot Mode Panel 표시 여부 */\n pivotPanelShow?: 'always' | 'onlyWhenPivoting' | 'never'\n /** Pivot Mode 활성화 여부 */\n pivotMode?: boolean\n }>(),\n {\n pagination: true,\n checkbox: false,\n rowNumbers: true,\n floatingFilters: true,\n floatingFilter: undefined,\n rowNumberWidth: 38,\n actionButtons: undefined,\n summaryColumn: false,\n hiddenColumn: false,\n enableGrouping: true,\n enablePivot: false,\n enableExcelExport: false,\n enableTreeData: false,\n getDataPath: undefined,\n autoGroupColumnDef: undefined,\n selectedRows: () => [],\n columnHover: true,\n enableColumnsToolPanel: true,\n statusBar: true,\n compactFooter: false,\n rowGroupPanelShow: 'never',\n groupDefaultExpanded: -1,\n pivotPanelShow: 'never',\n pivotMode: false,\n },\n)\n\nconst emit = defineEmits<{\n /** 행 클릭 이벤트 */\n rowClicked: [event: RowClickedEvent]\n /** 행 더블클릭 이벤트 */\n rowDoubleClicked: [event: RowDoubleClickedEvent]\n /** 셀 클릭 이벤트 */\n cellClicked: [event: CellClickedEvent]\n /** 선택 변경 이벤트 (체크박스 등) */\n selectionChanged: [event: SelectionChangedEvent]\n /** 셀 값 변경 이벤트 */\n cellValueChanged: [event: CellValueChangedEvent]\n /** 그리드 준비 완료 이벤트 */\n gridReady: [event: GridReadyEvent]\n /** 선택된 행 변경 이벤트 (v-model:selected-rows) */\n 'update:selectedRows': [rows: any[]]\n}>()\n\n// ag-Grid 인스턴스 참조\nconst gridApi = ref<any>(null)\nconst gridColumnApi = ref<any>(null)\n\n// Action Buttons Cell Renderer - 함수형으로 DOM 직접 생성\nconst ActionButtonsCellRenderer = (params: ICellRendererParams) => {\n const buttons = props.actionButtons || []\n const rowData = params.data\n \n // 표시할 버튼 필터링\n const visibleButtons = buttons.filter(btn => {\n if (btn.show) {\n return btn.show(rowData)\n }\n return true\n })\n \n if (visibleButtons.length === 0) {\n return ''\n }\n \n // 컨테이너 div 생성\n const container = document.createElement('div')\n container.className = 'flex items-center gap-1'\n \n // 각 버튼 생성\n visibleButtons.forEach((btn) => {\n const button = document.createElement('button')\n button.className = btn.styletype === 'danger' ? 'j-action-btn j-action-btn-danger' : 'j-action-btn'\n \n // tooltip\n if (btn.tooltip) {\n button.title = btn.tooltip\n }\n \n // 라벨 추가 (텍스트 버튼)\n if (btn.label) {\n button.textContent = btn.label\n } else if (btn.icon) {\n // 라벨이 없으면 기본 텍스트 생성\n if (btn.icon === 'pencil') {\n button.textContent = '수정'\n } else if (btn.icon === 'trash2' || btn.icon === 'trash') {\n button.textContent = '삭제'\n } else if (btn.icon === 'eye') {\n button.textContent = '보기'\n } else if (btn.icon === 'copy') {\n button.textContent = '복사'\n } else if (btn.icon === 'download') {\n button.textContent = '다운로드'\n } else if (btn.icon === 'circleX') {\n button.textContent = '비활성화'\n } else if (btn.icon === 'circleCheckBig') {\n button.textContent = '활성화'\n } else {\n button.textContent = btn.icon\n }\n }\n \n // 클릭 이벤트\n button.addEventListener('click', (e) => {\n e.stopPropagation()\n btn.onClick(rowData)\n })\n \n container.appendChild(button)\n })\n \n return container\n}\n\n// Action Buttons 컬럼 정의\nconst actionButtonsColumn = computed<ColDef | null>(() => {\n if (!props.actionButtons || props.actionButtons.length === 0) {\n return null\n }\n \n return {\n colId: 'actionButtons',\n headerName: '작업',\n field: '_actions',\n width: 120,\n minWidth: 80,\n maxWidth: 200,\n lockPosition: 'left' as const,\n sortable: false,\n filter: false,\n resizable: true,\n suppressNavigable: true,\n suppressHeaderMenuButton: true,\n cellRenderer: ActionButtonsCellRenderer,\n cellStyle: { display: 'flex', justifyContent: 'center', alignItems: 'center' },\n }\n})\n\n// checkbox 활성화 및 추가 컬럼 처리\nconst processedColumnDefs = computed(() => {\n const columns: ColDef[] = []\n \n // 1. Checkbox 컬럼 (최우선)\n if (props.checkbox) {\n columns.push({\n colId: 'rowSelection',\n headerName: '',\n // field와 valueGetter 제거 - AG Grid 공식 방식\n width: 40,\n minWidth: 40,\n maxWidth: 40,\n lockPosition: 'left' as const,\n checkboxSelection: true,\n headerCheckboxSelection: true,\n sortable: false,\n filter: false,\n resizable: false,\n suppressNavigable: true,\n suppressHeaderMenuButton: true,\n cellStyle: { display: 'flex', justifyContent: 'center', alignItems: 'center' },\n // 체크박스 셀 클릭 시 토글 (checkbox 아이콘 클릭은 AG Grid 기본 처리)\n onCellClicked: (params: CellClickedEvent) => {\n const target = (params.event as MouseEvent)?.target as HTMLElement\n if (target && !target.closest('.ag-checkbox-input-wrapper')) {\n params.node.setSelected(!params.node.isSelected())\n }\n },\n })\n }\n \n // 2. Action Buttons 컬럼\n if (actionButtonsColumn.value) {\n columns.push(actionButtonsColumn.value)\n }\n \n // 3. 사용자 정의 컬럼들 (Row Numbers는 AG Grid가 자동으로 추가)\n columns.push(...props.columnDefs)\n \n return columns\n})\n\n// Grid 옵션 설정\nconst gridOptions = computed<GridOptions>(() => {\n const useFloatingFilters = props.floatingFilter ?? props.floatingFilters\n const options: GridOptions = {\n theme: jTheme,\n pagination: props.pagination,\n overlayNoRowsTemplate: '<span class=\"j-grid-no-rows\">데이터가 없습니다</span>',\n defaultColDef: {\n filter: true,\n floatingFilter: useFloatingFilters,\n },\n rowSelection: props.checkbox ? 'multiple' : undefined,\n // 체크박스 모드일 때 row 클릭으로 선택이 변경되지 않도록 설정\n // 체크박스만으로 선택을 제어하도록 함\n suppressRowClickSelection: props.checkbox,\n\n // Row Numbers (Enterprise) - AG Grid 표준 방식\n rowNumbers: props.rowNumbers\n ? ({\n minWidth: props.rowNumberWidth,\n width: props.rowNumberWidth,\n } as any)\n : false,\n\n // Column Hover Highlight\n columnHoverHighlight: props.columnHover,\n\n // Enterprise 기능 옵션\n sideBar: props.enableColumnsToolPanel || props.enableGrouping || props.enablePivot ? {\n toolPanels: [\n {\n id: 'columns',\n labelDefault: 'Columns',\n labelKey: 'columns',\n iconKey: 'columns',\n toolPanel: 'agColumnsToolPanel',\n toolPanelParams: {\n suppressRowGroups: !props.enableGrouping,\n suppressValues: !props.enablePivot,\n suppressPivots: !props.enablePivot,\n suppressPivotMode: !props.enablePivot,\n },\n },\n ],\n defaultToolPanel: '', // 초기에는 접힌 상태\n } : undefined,\n\n // Status Bar (Enterprise)\n // compactFooter 모드에서는 Status Bar 비활성화\n statusBar: (props.statusBar && !props.compactFooter) ? {\n statusPanels: [\n { statusPanel: 'agTotalAndFilteredRowCountComponent', align: 'left' as const },\n { statusPanel: 'agSelectedRowCountComponent', align: 'left' as const },\n { statusPanel: 'agAggregationComponent', align: 'right' as const },\n ],\n } : undefined,\n\n // Row Group Panel 설정 (Enterprise) - 그리드 상단에 드래그 영역 표시\n rowGroupPanelShow: props.rowGroupPanelShow !== 'never' ? props.rowGroupPanelShow : undefined,\n\n // Pivot Panel 설정 (Enterprise) - 피벗 모드용 드래그 영역\n pivotPanelShow: props.pivotPanelShow !== 'never' ? props.pivotPanelShow : undefined,\n \n // Pivot Mode 활성화\n pivotMode: props.pivotMode,\n\n // 그룹핑 기본 설정\n groupDefaultExpanded: props.groupDefaultExpanded,\n suppressAggFuncInHeader: false,\n\n // Tree Data 설정 (Enterprise)\n treeData: props.enableTreeData || undefined,\n getDataPath: props.enableTreeData\n ? (props.getDataPath || ((data: any) => data.path || []))\n : undefined,\n autoGroupColumnDef: props.enableTreeData && props.autoGroupColumnDef\n ? props.autoGroupColumnDef\n : undefined,\n }\n\n return options\n})\n\n// Excel 내보내기 함수 (외부에서 사용 가능하도록 expose)\nconst exportToExcel = () => {\n if (gridApi.value && props.enableExcelExport) {\n gridApi.value.exportDataAsExcel({\n fileName: 'grid-export.xlsx',\n })\n }\n}\n\n// 그리드 API를 외부에 노출\ndefineExpose({\n gridApi,\n gridColumnApi,\n exportToExcel,\n})\n\n// Grid ready 이벤트 핸들러\nconst onGridReady = (params: GridReadyEvent) => {\n gridApi.value = params.api\n gridColumnApi.value = params.api // v34에서 columnApi는 deprecated\n emit('gridReady', params)\n}\n\n// 행 클릭 이벤트 핸들러\nconst onRowClicked = (event: RowClickedEvent) => {\n emit('rowClicked', event)\n}\n\n// 행 더블클릭 이벤트 핸들러\nconst onRowDoubleClicked = (event: RowDoubleClickedEvent) => {\n emit('rowDoubleClicked', event)\n}\n\n// 셀 클릭 이벤트 핸들러\nconst onCellClicked = (event: CellClickedEvent) => {\n emit('cellClicked', event)\n}\n\n// 선택 변경 이벤트 핸들러\nconst onSelectionChanged = (event: SelectionChangedEvent) => {\n emit('selectionChanged', event)\n emit('update:selectedRows', event.api.getSelectedRows())\n}\n\n// 셀 값 변경 이벤트 핸들러\nconst onCellValueChanged = (event: CellValueChangedEvent) => {\n emit('cellValueChanged', event)\n}\n\n// columnDefs 변경 감지\nwatch(\n () => props.columnDefs,\n () => {\n if (gridApi.value) {\n gridApi.value.setGridOption('columnDefs', processedColumnDefs.value)\n }\n },\n { deep: true },\n)\n\n// rowData 변경 감지\nwatch(\n () => props.rowData,\n () => {\n if (gridApi.value) {\n gridApi.value.setGridOption('rowData', props.rowData)\n }\n },\n { deep: true },\n)\n</script>\n\n<template>\n <div ref=\"gridContainerRef\" :class=\"cn('ag-grid-container', props.class)\">\n <AgGridVue\n :column-defs=\"processedColumnDefs\"\n :row-data=\"rowData\"\n :grid-options=\"gridOptions\"\n style=\"height: 100%; width: 100%\"\n @grid-ready=\"onGridReady\"\n @row-clicked=\"onRowClicked\"\n @row-double-clicked=\"onRowDoubleClicked\"\n @cell-clicked=\"onCellClicked\"\n @selection-changed=\"onSelectionChanged\"\n @cell-value-changed=\"onCellValueChanged\"\n />\n </div>\n</template>\n\n<style scoped>\n.ag-grid-container {\n width: 100%;\n height: 100%;\n min-height: 200px;\n\n /*\n * App CSS 변수 → AG Grid CSS 변수 브릿지\n * CSS 변수는 런타임 해소 → .dark 클래스 전환 시 라이트/다크 자동 대응\n * AG Grid v33 공식 CSS variable 명칭 사용\n */\n --ag-background-color: hsl(var(--background));\n --ag-foreground-color: hsl(var(--foreground));\n --ag-border-color: hsl(var(--border));\n --ag-header-background-color: hsl(var(--muted));\n --ag-header-foreground-color: hsl(var(--foreground));\n --ag-odd-row-background-color: hsl(var(--card));\n --ag-row-hover-color: hsl(var(--accent));\n --ag-selected-row-background-color: hsl(var(--primary) / 0.18);\n --ag-accent-color: hsl(var(--primary));\n --ag-header-height: var(--j-grid-header-h);\n --ag-row-height: var(--j-grid-row-h);\n}\n\n/* ============================================\n COMPACT FOOTER: Status Bar + Pagination 통합\n ============================================ */\n\n/* Status Bar 높이 줄이기 */\n:deep(.ag-status-bar) {\n min-height: var(--j-grid-footer-h) !important;\n height: var(--j-grid-footer-h) !important;\n padding: 0 8px !important;\n border-top: 1px solid var(--ag-border-color);\n display: flex;\n align-items: center;\n justify-content: space-between;\n font-size: 0.6875rem;\n}\n\n/* Status Bar 컴포넌트들 높이 조정 */\n:deep(.ag-status-bar-left),\n:deep(.ag-status-bar-center),\n:deep(.ag-status-bar-right) {\n height: var(--j-grid-footer-h);\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n/* Status Bar 패널들 간격 조정 */\n:deep(.ag-status-panel) {\n padding: 0;\n height: var(--j-grid-footer-h);\n display: flex;\n align-items: center;\n}\n\n/* Pagination Panel 높이 줄이기 */\n:deep(.ag-paging-panel) {\n min-height: var(--j-grid-footer-h) !important;\n height: var(--j-grid-footer-h) !important;\n padding: 0 8px !important;\n border-top: 1px solid var(--ag-border-color);\n font-size: 0.6875rem;\n gap: 8px;\n}\n\n/* Pagination 컴포넌트들 높이 조정 */\n:deep(.ag-paging-page-size),\n:deep(.ag-paging-row-summary-panel) {\n height: var(--j-grid-footer-h);\n display: flex;\n align-items: center;\n}\n\n/* Page Size Selector 높이 조정 */\n:deep(.ag-paging-page-size .ag-picker-field) {\n height: 18px;\n min-height: 18px;\n}\n\n:deep(.ag-paging-page-size .ag-picker-field-wrapper) {\n height: 18px;\n padding: 0 4px;\n font-size: 0.6875rem;\n border-radius: 3px;\n}\n\n/* Pagination 버튼들 높이 조정 */\n:deep(.ag-paging-button) {\n height: 20px;\n width: 20px;\n padding: 2px;\n}\n\n/* Pagination 버튼 래퍼 */\n:deep(.ag-paging-button-wrapper) {\n height: var(--j-grid-footer-h);\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n/* Row summary 텍스트 — 숫자 간 미세 간격 */\n:deep(.ag-paging-row-summary-panel-number) {\n line-height: var(--j-grid-footer-h);\n padding: 0 1px;\n}\n\n/* ========================================\n 패턴 9: AG-Grid 스타일 향상\n ======================================== */\n\n:deep(.ag-root-wrapper) {\n border: 1px solid hsl(var(--border));\n border-radius: 0.375rem;\n}\n\n/* ── Header ──────────────────────────────────────────────────────────── */\n:deep(.ag-header) {\n border-bottom: 1px solid hsl(var(--border));\n font-weight: 600;\n}\n\n:deep(.ag-header-row:not(.ag-floating-filter)) {\n min-height: var(--j-grid-header-h) !important;\n height: var(--j-grid-header-h) !important;\n}\n\n:deep(.ag-header-cell) {\n color: hsl(var(--foreground));\n font-size: 0.75rem;\n padding: 0 0.5rem;\n display: flex;\n align-items: center;\n}\n\n/* Floating Filter: 헤더와 명확히 구분되는 입력 영역 */\n:deep(.ag-header-row.ag-floating-filter) {\n min-height: var(--j-grid-filter-h) !important;\n height: var(--j-grid-filter-h) !important;\n background-color: hsl(var(--card));\n border-top: 1px solid hsl(var(--border) / 0.5);\n}\n\n:deep(.ag-floating-filter-body) {\n min-height: var(--j-grid-filter-h);\n}\n\n:deep(.ag-floating-filter-body input),\n:deep(.ag-floating-filter-body .ag-input-field-input),\n:deep(.ag-floating-filter-body .ag-picker-field-wrapper) {\n height: 20px !important;\n min-height: 20px !important;\n font-size: 0.75rem;\n background-color: hsl(var(--background)) !important;\n border: 1px solid hsl(var(--border)) !important;\n border-radius: 3px !important;\n padding: 0 4px !important;\n color: hsl(var(--foreground)) !important;\n}\n\n:deep(.ag-floating-filter-body input:focus),\n:deep(.ag-floating-filter-body .ag-input-field-input:focus) {\n border-color: hsl(var(--primary)) !important;\n outline: none !important;\n}\n\n/* ── Rows ────────────────────────────────────────────────────────────── */\n:deep(.ag-row) {\n min-height: var(--j-grid-row-h) !important;\n height: var(--j-grid-row-h) !important;\n transition: background-color 0.15s ease, box-shadow 0.15s ease;\n cursor: pointer;\n}\n\n/* 선택된 행: 왼쪽 accent 기둥으로 명확한 시각적 선택 표시 (라이트/다크 모두) */\n:deep(.ag-row-selected) {\n box-shadow: inset 4px 0 0 hsl(var(--primary));\n}\n\n/* ── Cells ───────────────────────────────────────────────────────────── */\n:deep(.ag-cell) {\n line-height: 1.2;\n padding: 0 0.5rem;\n font-size: 0.75rem;\n border-bottom: 1px solid hsl(var(--border) / 0.5);\n}\n\n:deep(.ag-cell-wrapper) {\n align-items: center;\n}\n\n:deep(.ag-cell-value) {\n display: flex;\n align-items: center;\n min-height: 100%;\n}\n\n/* 행 클릭 시 row number 셀에 보이는 강한 포커스 음영 제거 */\n:deep(.ag-cell.ag-row-number-cell.ag-cell-focus),\n:deep(.ag-cell.ag-row-number-cell:focus-within) {\n box-shadow: none !important;\n outline: none !important;\n}\n\n/* 셀 포커스 */\n:deep(.ag-cell.ag-cell-focus) {\n box-shadow: inset 0 0 0 1px hsl(var(--ring) / 0.5) !important;\n}\n\n/* 인라인 편집 셀 */\n:deep(.ag-cell-inline-editing) {\n padding: 0 !important;\n border: none !important;\n box-shadow: inset 0 0 0 1px hsl(var(--primary)) !important;\n background-color: hsl(var(--background)) !important;\n}\n\n:deep(.ag-cell-inline-editing .ag-cell-editor),\n:deep(.ag-cell-inline-editing .ag-text-field-input-wrapper),\n:deep(.ag-cell-inline-editing .ag-input-field) {\n height: 100% !important;\n border: none !important;\n outline: none !important;\n background: transparent !important;\n box-shadow: none !important;\n}\n\n:deep(.ag-cell-inline-editing input) {\n height: 100% !important;\n width: 100% !important;\n padding: 0 0.5rem !important;\n border: none !important;\n outline: none !important;\n background: transparent !important;\n box-shadow: none !important;\n font-size: 0.75rem !important;\n color: hsl(var(--foreground)) !important;\n}\n\n/* ── Checkbox 셀 중앙정렬 (col-id 속성 선택자 — 신뢰할 수 있는 접근) ── */\n:deep(.ag-cell[col-id=\"rowSelection\"]) {\n display: flex !important;\n justify-content: center !important;\n align-items: center !important;\n padding: 0 !important;\n}\n:deep(.ag-cell[col-id=\"rowSelection\"] .ag-cell-wrapper) {\n width: auto !important;\n flex: none !important;\n}\n:deep(.ag-header-cell[col-id=\"rowSelection\"] .ag-header-cell-comp-wrapper) {\n justify-content: center !important;\n}\n\n/* ── Action Buttons (JS 렌더러 — CSS variable 브릿지) ─────────────────── */\n:deep(.j-action-btn) {\n padding: 1px 8px;\n font-size: 0.75rem;\n border: 1px solid hsl(var(--border));\n border-radius: 3px;\n background-color: hsl(var(--card));\n color: hsl(var(--foreground));\n cursor: pointer;\n transition: all 0.15s ease;\n white-space: nowrap;\n}\n\n:deep(.j-action-btn:hover) {\n background-color: hsl(var(--accent));\n border-color: hsl(var(--primary) / 0.3);\n}\n\n:deep(.j-action-btn-danger) {\n border-color: hsl(var(--destructive) / 0.4);\n background-color: hsl(var(--destructive) / 0.06);\n color: hsl(var(--destructive));\n}\n\n:deep(.j-action-btn-danger:hover) {\n background-color: hsl(var(--destructive) / 0.15);\n}\n\n/* ── Pagination ──────────────────────────────────────────────────────── */\n:deep(.ag-paging-panel) {\n border-top: 1px solid hsl(var(--border));\n}\n\n/* ── No-Rows 오버레이 (한글) ──────────────────────────────────────── */\n:deep(.j-grid-no-rows) {\n color: hsl(var(--muted-foreground));\n font-size: 0.75rem;\n}\n</style>\n"],"names":["ModuleRegistry","AllCommunityModule","AllEnterpriseModule","jTheme","themeQuartz","isDark","ref","gridContainerRef","darkObserver","watch","dark","onMounted","onUnmounted","props","__props","emit","__emit","gridApi","gridColumnApi","ActionButtonsCellRenderer","params","buttons","rowData","visibleButtons","btn","container","button","e","actionButtonsColumn","computed","processedColumnDefs","columns","target","gridOptions","useFloatingFilters","data","__expose","onGridReady","onRowClicked","event","onRowDoubleClicked","onCellClicked","onSelectionChanged","onCellValueChanged","_createElementBlock","_normalizeClass","_unref","cn","_createVNode","AgGridVue"],"mappings":"i3CAoBAA,EAAAA,eAAe,gBAAgB,CAACC,EAAAA,mBAAoBC,EAAAA,mBAAmB,CAAC,EAOxE,MAAMC,EAASC,EAAAA,YACZ,WAAW,CAEV,2BAA4B,EAC5B,aAAc,GACd,SAAU,GACV,iBAAkB,IAClB,2BAA4B,IAC5B,SAAU,GACV,wBAAyB,EAAA,CAC1B,EACA,WAAW,CACV,mBAAoB,OAAA,EACnB,OAAO,EACT,WAAW,CACV,mBAAoB,MAAA,EACnB,MAAM,EAGLC,EAASC,EAAAA,IAAI,OAAO,SAAa,KAAe,SAAS,gBAAgB,UAAU,SAAS,MAAM,CAAC,EACnGC,EAAmBD,EAAAA,IAAwB,IAAI,EACrD,IAAIE,EAAwC,KAG5CC,QAAMJ,EAASK,GAAS,CACtBH,EAAiB,OAAO,aAAa,qBAAsBG,EAAO,OAAS,OAAO,CACpF,CAAC,EAEDC,EAAAA,UAAU,IAAM,CAEdJ,EAAiB,OAAO,aAAa,qBAAsBF,EAAO,MAAQ,OAAS,OAAO,EAG1FG,EAAe,IAAI,iBAAiB,IAAM,CACxCH,EAAO,MAAQ,SAAS,gBAAgB,UAAU,SAAS,MAAM,CACnE,CAAC,EACDG,EAAa,QAAQ,SAAS,gBAAiB,CAAE,WAAY,GAAM,gBAAiB,CAAC,OAAO,EAAG,CACjG,CAAC,EAEDI,EAAAA,YAAY,IAAM,CAChBJ,GAAc,WAAA,CAChB,CAAC,EAoBD,MAAMK,EAAQC,EAqFRC,EAAOC,EAkBPC,EAAUX,EAAAA,IAAS,IAAI,EACvBY,EAAgBZ,EAAAA,IAAS,IAAI,EAG7Ba,EAA6BC,GAAgC,CACjE,MAAMC,EAAUR,EAAM,eAAiB,CAAA,EACjCS,EAAUF,EAAO,KAGjBG,EAAiBF,EAAQ,OAAOG,GAChCA,EAAI,KACCA,EAAI,KAAKF,CAAO,EAElB,EACR,EAED,GAAIC,EAAe,SAAW,EAC5B,MAAO,GAIT,MAAME,EAAY,SAAS,cAAc,KAAK,EAC9C,OAAAA,EAAU,UAAY,0BAGtBF,EAAe,QAASC,GAAQ,CAC9B,MAAME,EAAS,SAAS,cAAc,QAAQ,EAC9CA,EAAO,UAAYF,EAAI,YAAc,SAAW,mCAAqC,eAGjFA,EAAI,UACNE,EAAO,MAAQF,EAAI,SAIjBA,EAAI,MACNE,EAAO,YAAcF,EAAI,MAChBA,EAAI,OAETA,EAAI,OAAS,SACfE,EAAO,YAAc,KACZF,EAAI,OAAS,UAAYA,EAAI,OAAS,QAC/CE,EAAO,YAAc,KACZF,EAAI,OAAS,MACtBE,EAAO,YAAc,KACZF,EAAI,OAAS,OACtBE,EAAO,YAAc,KACZF,EAAI,OAAS,WACtBE,EAAO,YAAc,OACZF,EAAI,OAAS,UACtBE,EAAO,YAAc,OACZF,EAAI,OAAS,iBACtBE,EAAO,YAAc,MAErBA,EAAO,YAAcF,EAAI,MAK7BE,EAAO,iBAAiB,QAAUC,GAAM,CACtCA,EAAE,gBAAA,EACFH,EAAI,QAAQF,CAAO,CACrB,CAAC,EAEDG,EAAU,YAAYC,CAAM,CAC9B,CAAC,EAEMD,CACT,EAGMG,EAAsBC,EAAAA,SAAwB,IAC9C,CAAChB,EAAM,eAAiBA,EAAM,cAAc,SAAW,EAClD,KAGF,CACL,MAAO,gBACP,WAAY,KACZ,MAAO,WACP,MAAO,IACP,SAAU,GACV,SAAU,IACV,aAAc,OACd,SAAU,GACV,OAAQ,GACR,UAAW,GACX,kBAAmB,GACnB,yBAA0B,GAC1B,aAAcM,EACd,UAAW,CAAE,QAAS,OAAQ,eAAgB,SAAU,WAAY,QAAA,CAAS,CAEhF,EAGKW,EAAsBD,EAAAA,SAAS,IAAM,CACzC,MAAME,EAAoB,CAAA,EAG1B,OAAIlB,EAAM,UACRkB,EAAQ,KAAK,CACX,MAAO,eACP,WAAY,GAEZ,MAAO,GACP,SAAU,GACV,SAAU,GACV,aAAc,OACd,kBAAmB,GACnB,wBAAyB,GACzB,SAAU,GACV,OAAQ,GACR,UAAW,GACX,kBAAmB,GACnB,yBAA0B,GAC1B,UAAW,CAAE,QAAS,OAAQ,eAAgB,SAAU,WAAY,QAAA,EAEpE,cAAgBX,GAA6B,CAC3C,MAAMY,EAAUZ,EAAO,OAAsB,OACzCY,GAAU,CAACA,EAAO,QAAQ,4BAA4B,GACxDZ,EAAO,KAAK,YAAY,CAACA,EAAO,KAAK,YAAY,CAErD,CAAA,CACD,EAICQ,EAAoB,OACtBG,EAAQ,KAAKH,EAAoB,KAAK,EAIxCG,EAAQ,KAAK,GAAGlB,EAAM,UAAU,EAEzBkB,CACT,CAAC,EAGKE,EAAcJ,EAAAA,SAAsB,IAAM,CAC9C,MAAMK,EAAqBrB,EAAM,gBAAkBA,EAAM,gBA8EzD,MA7E6B,CAC3B,MAAOV,EACP,WAAYU,EAAM,WAClB,sBAAuB,gDACvB,cAAe,CACb,OAAQ,GACR,eAAgBqB,CAAA,EAElB,aAAcrB,EAAM,SAAW,WAAa,OAG5C,0BAA2BA,EAAM,SAGjC,WAAYA,EAAM,WACb,CACC,SAAUA,EAAM,eAChB,MAAOA,EAAM,cAAA,EAEf,GAGJ,qBAAsBA,EAAM,YAG5B,QAASA,EAAM,wBAA0BA,EAAM,gBAAkBA,EAAM,YAAc,CACnF,WAAY,CACV,CACE,GAAI,UACJ,aAAc,UACd,SAAU,UACV,QAAS,UACT,UAAW,qBACX,gBAAiB,CACf,kBAAmB,CAACA,EAAM,eAC1B,eAAgB,CAACA,EAAM,YACvB,eAAgB,CAACA,EAAM,YACvB,kBAAmB,CAACA,EAAM,WAAA,CAC5B,CACF,EAEF,iBAAkB,EAAA,EAChB,OAIJ,UAAYA,EAAM,WAAa,CAACA,EAAM,cAAiB,CACrD,aAAc,CACZ,CAAE,YAAa,sCAAuC,MAAO,MAAA,EAC7D,CAAE,YAAa,8BAA+B,MAAO,MAAA,EACrD,CAAE,YAAa,yBAA0B,MAAO,OAAA,CAAiB,CACnE,EACE,OAGJ,kBAAmBA,EAAM,oBAAsB,QAAUA,EAAM,kBAAoB,OAGnF,eAAgBA,EAAM,iBAAmB,QAAUA,EAAM,eAAiB,OAG1E,UAAWA,EAAM,UAGjB,qBAAsBA,EAAM,qBAC5B,wBAAyB,GAGzB,SAAUA,EAAM,gBAAkB,OAClC,YAAaA,EAAM,eACdA,EAAM,cAAiBsB,GAAcA,EAAK,MAAQ,CAAA,GACnD,OACJ,mBAAoBtB,EAAM,gBAAkBA,EAAM,mBAC9CA,EAAM,mBACN,MAAA,CAIR,CAAC,EAYDuB,EAAa,CACX,QAAAnB,EACA,cAAAC,EACA,cAZoB,IAAM,CACtBD,EAAQ,OAASJ,EAAM,mBACzBI,EAAQ,MAAM,kBAAkB,CAC9B,SAAU,kBAAA,CACX,CAEL,CAME,CACD,EAGD,MAAMoB,EAAejB,GAA2B,CAC9CH,EAAQ,MAAQG,EAAO,IACvBF,EAAc,MAAQE,EAAO,IAC7BL,EAAK,YAAaK,CAAM,CAC1B,EAGMkB,EAAgBC,GAA2B,CAC/CxB,EAAK,aAAcwB,CAAK,CAC1B,EAGMC,EAAsBD,GAAiC,CAC3DxB,EAAK,mBAAoBwB,CAAK,CAChC,EAGME,EAAiBF,GAA4B,CACjDxB,EAAK,cAAewB,CAAK,CAC3B,EAGMG,EAAsBH,GAAiC,CAC3DxB,EAAK,mBAAoBwB,CAAK,EAC9BxB,EAAK,sBAAuBwB,EAAM,IAAI,gBAAA,CAAiB,CACzD,EAGMI,EAAsBJ,GAAiC,CAC3DxB,EAAK,mBAAoBwB,CAAK,CAChC,EAGA9B,OAAAA,EAAAA,MACE,IAAMI,EAAM,WACZ,IAAM,CACAI,EAAQ,OACVA,EAAQ,MAAM,cAAc,aAAca,EAAoB,KAAK,CAEvE,EACA,CAAE,KAAM,EAAA,CAAK,EAIfrB,EAAAA,MACE,IAAMI,EAAM,QACZ,IAAM,CACAI,EAAQ,OACVA,EAAQ,MAAM,cAAc,UAAWJ,EAAM,OAAO,CAExD,EACA,CAAE,KAAM,EAAA,CAAK,wBAKb+B,EAAAA,mBAaM,MAAA,SAbG,mBAAJ,IAAIrC,EAAoB,MAAKsC,EAAAA,eAAEC,QAAAC,EAAAA,EAAA,EAAE,oBAAsBlC,EAAM,KAAK,CAAA,CAAA,GACrEmC,cAWEF,EAAAA,MAAAG,EAAAA,SAAA,EAAA,CAVC,cAAanB,EAAA,MACb,WAAUhB,EAAA,QACV,eAAcmB,EAAA,MACf,MAAA,CAAA,OAAA,OAAA,MAAA,MAAA,EACC,YAAAI,EACA,aAAAC,EACA,mBAAAE,EACA,cAAAC,EACA,mBAAAC,EACA,mBAAAC,CAAA"}
@@ -1,9 +1,9 @@
1
- import { defineComponent as A, ref as s, watch as f, onMounted as M, onUnmounted as T, computed as m, createElementBlock as W, openBlock as H, normalizeClass as V, unref as b, createVNode as z } from "vue";
2
- import { AgGridVue as j } from "ag-grid-vue3";
1
+ import { defineComponent as T, ref as s, watch as f, onMounted as A, onUnmounted as M, computed as m, createElementBlock as W, openBlock as H, normalizeClass as V, unref as b, createVNode as j } from "vue";
2
+ import { AgGridVue as z } from "ag-grid-vue3";
3
3
  import { cn as _ } from "../../lib/utils.js";
4
4
  import { ModuleRegistry as I, AllCommunityModule as O, themeQuartz as L } from "ag-grid-community";
5
5
  import { AllEnterpriseModule as K } from "ag-grid-enterprise";
6
- const Z = /* @__PURE__ */ A({
6
+ const Z = /* @__PURE__ */ T({
7
7
  __name: "JGrid",
8
8
  props: {
9
9
  class: {},
@@ -35,14 +35,14 @@ const Z = /* @__PURE__ */ A({
35
35
  pivotMode: { type: Boolean, default: !1 }
36
36
  },
37
37
  emits: ["rowClicked", "rowDoubleClicked", "cellClicked", "selectionChanged", "cellValueChanged", "gridReady", "update:selectedRows"],
38
- setup(g, { expose: x, emit: P }) {
38
+ setup(g, { expose: x, emit: y }) {
39
39
  I.registerModules([O, K]);
40
- const y = L.withParams({
40
+ const P = L.withParams({
41
41
  // 공통 사이즈 (라이트/다크 모두 적용)
42
42
  cellHorizontalPaddingScale: 1,
43
43
  columnBorder: !0,
44
44
  fontSize: 13,
45
- headerFontWeight: 500,
45
+ headerFontWeight: 600,
46
46
  headerVerticalPaddingScale: 0.45,
47
47
  iconSize: 14,
48
48
  rowVerticalPaddingScale: 0.4
@@ -54,22 +54,22 @@ const Z = /* @__PURE__ */ A({
54
54
  let d = null;
55
55
  f(u, (t) => {
56
56
  c.value?.setAttribute("data-ag-theme-mode", t ? "dark" : "light");
57
- }), M(() => {
57
+ }), A(() => {
58
58
  c.value?.setAttribute("data-ag-theme-mode", u.value ? "dark" : "light"), d = new MutationObserver(() => {
59
59
  u.value = document.documentElement.classList.contains("dark");
60
60
  }), d.observe(document.documentElement, { attributes: !0, attributeFilter: ["class"] });
61
- }), T(() => {
61
+ }), M(() => {
62
62
  d?.disconnect();
63
63
  });
64
- const e = g, n = P, a = s(null), h = s(null), k = (t) => {
64
+ const e = g, n = y, a = s(null), h = s(null), k = (t) => {
65
65
  const i = e.actionButtons || [], r = t.data, w = i.filter((o) => o.show ? o.show(r) : !0);
66
66
  if (w.length === 0)
67
67
  return "";
68
68
  const p = document.createElement("div");
69
69
  return p.className = "flex items-center gap-1", w.forEach((o) => {
70
70
  const l = document.createElement("button");
71
- l.className = o.styletype === "danger" ? "j-action-btn j-action-btn-danger" : "j-action-btn", o.tooltip && (l.title = o.tooltip), o.label ? l.textContent = o.label : o.icon && (o.icon === "pencil" ? l.textContent = "수정" : o.icon === "trash2" || o.icon === "trash" ? l.textContent = "삭제" : o.icon === "eye" ? l.textContent = "보기" : o.icon === "copy" ? l.textContent = "복사" : o.icon === "download" ? l.textContent = "다운로드" : o.icon === "circleX" ? l.textContent = "비활성화" : o.icon === "circleCheckBig" ? l.textContent = "활성화" : l.textContent = o.icon), l.addEventListener("click", (N) => {
72
- N.stopPropagation(), o.onClick(r);
71
+ l.className = o.styletype === "danger" ? "j-action-btn j-action-btn-danger" : "j-action-btn", o.tooltip && (l.title = o.tooltip), o.label ? l.textContent = o.label : o.icon && (o.icon === "pencil" ? l.textContent = "수정" : o.icon === "trash2" || o.icon === "trash" ? l.textContent = "삭제" : o.icon === "eye" ? l.textContent = "보기" : o.icon === "copy" ? l.textContent = "복사" : o.icon === "download" ? l.textContent = "다운로드" : o.icon === "circleX" ? l.textContent = "비활성화" : o.icon === "circleCheckBig" ? l.textContent = "활성화" : l.textContent = o.icon), l.addEventListener("click", (F) => {
72
+ F.stopPropagation(), o.onClick(r);
73
73
  }), p.appendChild(l);
74
74
  }), p;
75
75
  }, C = m(() => !e.actionButtons || e.actionButtons.length === 0 ? null : {
@@ -114,8 +114,9 @@ const Z = /* @__PURE__ */ A({
114
114
  }), B = m(() => {
115
115
  const t = e.floatingFilter ?? e.floatingFilters;
116
116
  return {
117
- theme: y,
117
+ theme: P,
118
118
  pagination: e.pagination,
119
+ overlayNoRowsTemplate: '<span class="j-grid-no-rows">데이터가 없습니다</span>',
119
120
  defaultColDef: {
120
121
  filter: !0,
121
122
  floatingFilter: t
@@ -194,7 +195,7 @@ const Z = /* @__PURE__ */ A({
194
195
  n("cellClicked", t);
195
196
  }, G = (t) => {
196
197
  n("selectionChanged", t), n("update:selectedRows", t.api.getSelectedRows());
197
- }, F = (t) => {
198
+ }, N = (t) => {
198
199
  n("cellValueChanged", t);
199
200
  };
200
201
  return f(
@@ -214,7 +215,7 @@ const Z = /* @__PURE__ */ A({
214
215
  ref: c,
215
216
  class: V(b(_)("ag-grid-container", e.class))
216
217
  }, [
217
- z(b(j), {
218
+ j(b(z), {
218
219
  "column-defs": v.value,
219
220
  "row-data": g.rowData,
220
221
  "grid-options": B.value,
@@ -224,7 +225,7 @@ const Z = /* @__PURE__ */ A({
224
225
  onRowDoubleClicked: E,
225
226
  onCellClicked: R,
226
227
  onSelectionChanged: G,
227
- onCellValueChanged: F
228
+ onCellValueChanged: N
228
229
  }, null, 8, ["column-defs", "row-data", "grid-options"])
229
230
  ], 2));
230
231
  }
@@ -1 +1 @@
1
- {"version":3,"file":"JGrid.vue2.js","sources":["../../../../src/components/atoms/JGrid.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch, onMounted, onUnmounted } from 'vue'\nimport { AgGridVue } from 'ag-grid-vue3'\nimport { cn } from '@/lib/utils'\nimport type {\n ColDef,\n GridOptions,\n RowClickedEvent,\n CellClickedEvent,\n SelectionChangedEvent,\n CellValueChangedEvent,\n RowDoubleClickedEvent,\n GridReadyEvent,\n ICellRendererParams,\n} from 'ag-grid-community'\nimport { ModuleRegistry, AllCommunityModule, themeQuartz } from 'ag-grid-community'\n// Enterprise 모듈 import (Grouping, Pivot, Excel Export 등)\nimport { AllEnterpriseModule } from 'ag-grid-enterprise'\n\n// AG Grid 모듈 등록 (Community + Enterprise)\nModuleRegistry.registerModules([AllCommunityModule, AllEnterpriseModule])\n\n// ── 공식 권장: data-ag-theme-mode attribute 기반 다크모드 전환 ─────────────────\n// AG Grid v33 공식 패턴:\n// 1. themeQuartz.withParams({...}, 'light').withParams({...}, 'dark') 로 두 모드 정의\n// 2. data-ag-theme-mode attribute 전환으로 모드 스위칭 (theme 객체 재생성 불필요)\n// 3. CSS --ag-* 변수 오버라이드로 앱 CSS 변수 참조 (getCSSVar 우회 불필요)\nconst jTheme = themeQuartz\n .withParams({\n // 공통 사이즈 (라이트/다크 모두 적용)\n cellHorizontalPaddingScale: 1,\n columnBorder: true,\n fontSize: 13,\n headerFontWeight: 500,\n headerVerticalPaddingScale: 0.45,\n iconSize: 14,\n rowVerticalPaddingScale: 0.4,\n })\n .withParams({\n browserColorScheme: 'light',\n }, 'light')\n .withParams({\n browserColorScheme: 'dark',\n }, 'dark')\n\n// JLIS는 .dark class 기반 다크모드이므로 MutationObserver로 감지 후 attribute 동기화\nconst isDark = ref(typeof document !== 'undefined' && document.documentElement.classList.contains('dark'))\nconst gridContainerRef = ref<HTMLElement | null>(null)\nlet darkObserver: MutationObserver | null = null\n\n// isDark 변경 → data-ag-theme-mode 동기화 (AG Grid가 내부적으로 반응)\nwatch(isDark, (dark) => {\n gridContainerRef.value?.setAttribute('data-ag-theme-mode', dark ? 'dark' : 'light')\n})\n\nonMounted(() => {\n // 초기 attribute 설정\n gridContainerRef.value?.setAttribute('data-ag-theme-mode', isDark.value ? 'dark' : 'light')\n\n // 이후 변경 감지\n darkObserver = new MutationObserver(() => {\n isDark.value = document.documentElement.classList.contains('dark')\n })\n darkObserver.observe(document.documentElement, { attributes: true, attributeFilter: ['class'] })\n})\n\nonUnmounted(() => {\n darkObserver?.disconnect()\n})\n\n/**\n * Action Button 정의 타입\n */\nexport type ActionButton = {\n /** 버튼 아이콘 이름 (lucide) - label이 없을 때 기본 텍스트 생성에 사용 */\n icon?: string\n /** 버튼 라벨 */\n label?: string\n /** 툴팁 텍스트 */\n tooltip?: string\n /** 버튼 클릭 핸들러 (rowData 전달) */\n onClick: (rowData: any) => void\n /** 버튼 스타일 타입 */\n styletype?: 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger'\n /** 조건부 표시 함수 (rowData를 받아 boolean 반환) */\n show?: (rowData: any) => boolean\n}\n\nconst props = withDefaults(\n defineProps<{\n /** 추가 클래스 (외부 커스터마이징용) */\n class?: string\n /** 그리드에 표시할 데이터 배열 */\n rowData: any[]\n /** 컬럼 정의 배열 */\n columnDefs: ColDef[]\n /** 페이지네이션 활성화 여부 */\n pagination?: boolean\n /** 체크박스 선택 활성화 여부 */\n checkbox?: boolean\n /** 행 번호 표시 여부 (Enterprise) */\n rowNumbers?: boolean\n /** 플로팅 필터 표시 여부 */\n floatingFilters?: boolean\n /** 플로팅 필터 표시 여부 (하위호환 alias) */\n floatingFilter?: boolean\n /** 행 번호 컬럼 너비(px) */\n rowNumberWidth?: number\n /** 행별 액션 버튼 목록 */\n actionButtons?: ActionButton[]\n /** 요약 컬럼 표시 여부 */\n summaryColumn?: boolean\n /** 숨김 컬럼 관리 활성화 여부 */\n hiddenColumn?: boolean\n /** 그룹핑 기능 활성화 여부 (Enterprise) */\n enableGrouping?: boolean\n /** 피벗 기능 활성화 여부 (Enterprise) */\n enablePivot?: boolean\n /** Excel 내보내기 기능 활성화 여부 (Enterprise) */\n enableExcelExport?: boolean\n /** Tree Data 기능 활성화 여부 (Enterprise) */\n enableTreeData?: boolean\n /** Tree Data 계층 경로를 반환하는 함수 */\n getDataPath?: (data: any) => (string | number)[]\n /** Tree Data 그룹 컬럼 정의 */\n autoGroupColumnDef?: ColDef\n /** 선택된 행 데이터 배열 (v-model:selected-rows) */\n selectedRows?: any[]\n /** 컬럼 호버 하이라이트 활성화 여부 */\n columnHover?: boolean\n /** Columns Tool Panel 활성화 여부 (Enterprise) */\n enableColumnsToolPanel?: boolean\n /** Status Bar 활성화 여부 (Enterprise) */\n statusBar?: boolean\n /** 간소화된 Footer 모드 (Status Bar 제거, Pagination만 표시) */\n compactFooter?: boolean\n /** Row Group Panel 표시 여부 ('always' | 'onlyWhenGrouping' | 'never') */\n rowGroupPanelShow?: 'always' | 'onlyWhenGrouping' | 'never'\n /** 그룹 기본 확장 레벨 (-1: 모두 닫힘, 0: 첫 레벨만, 1: 2레벨까지...) */\n groupDefaultExpanded?: number\n /** Pivot Mode Panel 표시 여부 */\n pivotPanelShow?: 'always' | 'onlyWhenPivoting' | 'never'\n /** Pivot Mode 활성화 여부 */\n pivotMode?: boolean\n }>(),\n {\n pagination: true,\n checkbox: false,\n rowNumbers: true,\n floatingFilters: true,\n floatingFilter: undefined,\n rowNumberWidth: 38,\n actionButtons: undefined,\n summaryColumn: false,\n hiddenColumn: false,\n enableGrouping: true,\n enablePivot: false,\n enableExcelExport: false,\n enableTreeData: false,\n getDataPath: undefined,\n autoGroupColumnDef: undefined,\n selectedRows: () => [],\n columnHover: true,\n enableColumnsToolPanel: true,\n statusBar: true,\n compactFooter: false,\n rowGroupPanelShow: 'never',\n groupDefaultExpanded: -1,\n pivotPanelShow: 'never',\n pivotMode: false,\n },\n)\n\nconst emit = defineEmits<{\n /** 행 클릭 이벤트 */\n rowClicked: [event: RowClickedEvent]\n /** 행 더블클릭 이벤트 */\n rowDoubleClicked: [event: RowDoubleClickedEvent]\n /** 셀 클릭 이벤트 */\n cellClicked: [event: CellClickedEvent]\n /** 선택 변경 이벤트 (체크박스 등) */\n selectionChanged: [event: SelectionChangedEvent]\n /** 셀 값 변경 이벤트 */\n cellValueChanged: [event: CellValueChangedEvent]\n /** 그리드 준비 완료 이벤트 */\n gridReady: [event: GridReadyEvent]\n /** 선택된 행 변경 이벤트 (v-model:selected-rows) */\n 'update:selectedRows': [rows: any[]]\n}>()\n\n// ag-Grid 인스턴스 참조\nconst gridApi = ref<any>(null)\nconst gridColumnApi = ref<any>(null)\n\n// Action Buttons Cell Renderer - 함수형으로 DOM 직접 생성\nconst ActionButtonsCellRenderer = (params: ICellRendererParams) => {\n const buttons = props.actionButtons || []\n const rowData = params.data\n \n // 표시할 버튼 필터링\n const visibleButtons = buttons.filter(btn => {\n if (btn.show) {\n return btn.show(rowData)\n }\n return true\n })\n \n if (visibleButtons.length === 0) {\n return ''\n }\n \n // 컨테이너 div 생성\n const container = document.createElement('div')\n container.className = 'flex items-center gap-1'\n \n // 각 버튼 생성\n visibleButtons.forEach((btn) => {\n const button = document.createElement('button')\n button.className = btn.styletype === 'danger' ? 'j-action-btn j-action-btn-danger' : 'j-action-btn'\n \n // tooltip\n if (btn.tooltip) {\n button.title = btn.tooltip\n }\n \n // 라벨 추가 (텍스트 버튼)\n if (btn.label) {\n button.textContent = btn.label\n } else if (btn.icon) {\n // 라벨이 없으면 기본 텍스트 생성\n if (btn.icon === 'pencil') {\n button.textContent = '수정'\n } else if (btn.icon === 'trash2' || btn.icon === 'trash') {\n button.textContent = '삭제'\n } else if (btn.icon === 'eye') {\n button.textContent = '보기'\n } else if (btn.icon === 'copy') {\n button.textContent = '복사'\n } else if (btn.icon === 'download') {\n button.textContent = '다운로드'\n } else if (btn.icon === 'circleX') {\n button.textContent = '비활성화'\n } else if (btn.icon === 'circleCheckBig') {\n button.textContent = '활성화'\n } else {\n button.textContent = btn.icon\n }\n }\n \n // 클릭 이벤트\n button.addEventListener('click', (e) => {\n e.stopPropagation()\n btn.onClick(rowData)\n })\n \n container.appendChild(button)\n })\n \n return container\n}\n\n// Action Buttons 컬럼 정의\nconst actionButtonsColumn = computed<ColDef | null>(() => {\n if (!props.actionButtons || props.actionButtons.length === 0) {\n return null\n }\n \n return {\n colId: 'actionButtons',\n headerName: '작업',\n field: '_actions',\n width: 120,\n minWidth: 80,\n maxWidth: 200,\n lockPosition: 'left' as const,\n sortable: false,\n filter: false,\n resizable: true,\n suppressNavigable: true,\n suppressHeaderMenuButton: true,\n cellRenderer: ActionButtonsCellRenderer,\n cellStyle: { display: 'flex', justifyContent: 'center', alignItems: 'center' },\n }\n})\n\n// checkbox 활성화 및 추가 컬럼 처리\nconst processedColumnDefs = computed(() => {\n const columns: ColDef[] = []\n \n // 1. Checkbox 컬럼 (최우선)\n if (props.checkbox) {\n columns.push({\n colId: 'rowSelection',\n headerName: '',\n // field와 valueGetter 제거 - AG Grid 공식 방식\n width: 40,\n minWidth: 40,\n maxWidth: 40,\n lockPosition: 'left' as const,\n checkboxSelection: true,\n headerCheckboxSelection: true,\n sortable: false,\n filter: false,\n resizable: false,\n suppressNavigable: true,\n suppressHeaderMenuButton: true,\n cellStyle: { display: 'flex', justifyContent: 'center', alignItems: 'center' },\n // 체크박스 셀 클릭 시 토글 (checkbox 아이콘 클릭은 AG Grid 기본 처리)\n onCellClicked: (params: CellClickedEvent) => {\n const target = (params.event as MouseEvent)?.target as HTMLElement\n if (target && !target.closest('.ag-checkbox-input-wrapper')) {\n params.node.setSelected(!params.node.isSelected())\n }\n },\n })\n }\n \n // 2. Action Buttons 컬럼\n if (actionButtonsColumn.value) {\n columns.push(actionButtonsColumn.value)\n }\n \n // 3. 사용자 정의 컬럼들 (Row Numbers는 AG Grid가 자동으로 추가)\n columns.push(...props.columnDefs)\n \n return columns\n})\n\n// Grid 옵션 설정\nconst gridOptions = computed<GridOptions>(() => {\n const useFloatingFilters = props.floatingFilter ?? props.floatingFilters\n const options: GridOptions = {\n theme: jTheme,\n pagination: props.pagination,\n defaultColDef: {\n filter: true,\n floatingFilter: useFloatingFilters,\n },\n rowSelection: props.checkbox ? 'multiple' : undefined,\n // 체크박스 모드일 때 row 클릭으로 선택이 변경되지 않도록 설정\n // 체크박스만으로 선택을 제어하도록 함\n suppressRowClickSelection: props.checkbox,\n\n // Row Numbers (Enterprise) - AG Grid 표준 방식\n rowNumbers: props.rowNumbers\n ? ({\n minWidth: props.rowNumberWidth,\n width: props.rowNumberWidth,\n } as any)\n : false,\n\n // Column Hover Highlight\n columnHoverHighlight: props.columnHover,\n\n // Enterprise 기능 옵션\n sideBar: props.enableColumnsToolPanel || props.enableGrouping || props.enablePivot ? {\n toolPanels: [\n {\n id: 'columns',\n labelDefault: 'Columns',\n labelKey: 'columns',\n iconKey: 'columns',\n toolPanel: 'agColumnsToolPanel',\n toolPanelParams: {\n suppressRowGroups: !props.enableGrouping,\n suppressValues: !props.enablePivot,\n suppressPivots: !props.enablePivot,\n suppressPivotMode: !props.enablePivot,\n },\n },\n ],\n defaultToolPanel: '', // 초기에는 접힌 상태\n } : undefined,\n\n // Status Bar (Enterprise)\n // compactFooter 모드에서는 Status Bar 비활성화\n statusBar: (props.statusBar && !props.compactFooter) ? {\n statusPanels: [\n { statusPanel: 'agTotalAndFilteredRowCountComponent', align: 'left' as const },\n { statusPanel: 'agSelectedRowCountComponent', align: 'left' as const },\n { statusPanel: 'agAggregationComponent', align: 'right' as const },\n ],\n } : undefined,\n\n // Row Group Panel 설정 (Enterprise) - 그리드 상단에 드래그 영역 표시\n rowGroupPanelShow: props.rowGroupPanelShow !== 'never' ? props.rowGroupPanelShow : undefined,\n\n // Pivot Panel 설정 (Enterprise) - 피벗 모드용 드래그 영역\n pivotPanelShow: props.pivotPanelShow !== 'never' ? props.pivotPanelShow : undefined,\n \n // Pivot Mode 활성화\n pivotMode: props.pivotMode,\n\n // 그룹핑 기본 설정\n groupDefaultExpanded: props.groupDefaultExpanded,\n suppressAggFuncInHeader: false,\n\n // Tree Data 설정 (Enterprise)\n treeData: props.enableTreeData || undefined,\n getDataPath: props.enableTreeData\n ? (props.getDataPath || ((data: any) => data.path || []))\n : undefined,\n autoGroupColumnDef: props.enableTreeData && props.autoGroupColumnDef\n ? props.autoGroupColumnDef\n : undefined,\n }\n\n return options\n})\n\n// Excel 내보내기 함수 (외부에서 사용 가능하도록 expose)\nconst exportToExcel = () => {\n if (gridApi.value && props.enableExcelExport) {\n gridApi.value.exportDataAsExcel({\n fileName: 'grid-export.xlsx',\n })\n }\n}\n\n// 그리드 API를 외부에 노출\ndefineExpose({\n gridApi,\n gridColumnApi,\n exportToExcel,\n})\n\n// Grid ready 이벤트 핸들러\nconst onGridReady = (params: GridReadyEvent) => {\n gridApi.value = params.api\n gridColumnApi.value = params.api // v34에서 columnApi는 deprecated\n emit('gridReady', params)\n}\n\n// 행 클릭 이벤트 핸들러\nconst onRowClicked = (event: RowClickedEvent) => {\n emit('rowClicked', event)\n}\n\n// 행 더블클릭 이벤트 핸들러\nconst onRowDoubleClicked = (event: RowDoubleClickedEvent) => {\n emit('rowDoubleClicked', event)\n}\n\n// 셀 클릭 이벤트 핸들러\nconst onCellClicked = (event: CellClickedEvent) => {\n emit('cellClicked', event)\n}\n\n// 선택 변경 이벤트 핸들러\nconst onSelectionChanged = (event: SelectionChangedEvent) => {\n emit('selectionChanged', event)\n emit('update:selectedRows', event.api.getSelectedRows())\n}\n\n// 셀 값 변경 이벤트 핸들러\nconst onCellValueChanged = (event: CellValueChangedEvent) => {\n emit('cellValueChanged', event)\n}\n\n// columnDefs 변경 감지\nwatch(\n () => props.columnDefs,\n () => {\n if (gridApi.value) {\n gridApi.value.setGridOption('columnDefs', processedColumnDefs.value)\n }\n },\n { deep: true },\n)\n\n// rowData 변경 감지\nwatch(\n () => props.rowData,\n () => {\n if (gridApi.value) {\n gridApi.value.setGridOption('rowData', props.rowData)\n }\n },\n { deep: true },\n)\n</script>\n\n<template>\n <div ref=\"gridContainerRef\" :class=\"cn('ag-grid-container', props.class)\">\n <AgGridVue\n :column-defs=\"processedColumnDefs\"\n :row-data=\"rowData\"\n :grid-options=\"gridOptions\"\n style=\"height: 100%; width: 100%\"\n @grid-ready=\"onGridReady\"\n @row-clicked=\"onRowClicked\"\n @row-double-clicked=\"onRowDoubleClicked\"\n @cell-clicked=\"onCellClicked\"\n @selection-changed=\"onSelectionChanged\"\n @cell-value-changed=\"onCellValueChanged\"\n />\n </div>\n</template>\n\n<style scoped>\n.ag-grid-container {\n width: 100%;\n height: 100%;\n\n /*\n * App CSS 변수 → AG Grid CSS 변수 브릿지\n * CSS 변수는 런타임 해소 → .dark 클래스 전환 시 라이트/다크 자동 대응\n * AG Grid v33 공식 CSS variable 명칭 사용\n */\n --ag-background-color: hsl(var(--background));\n --ag-foreground-color: hsl(var(--foreground));\n --ag-border-color: hsl(var(--border));\n --ag-header-background-color: hsl(var(--muted));\n --ag-header-foreground-color: hsl(var(--foreground));\n --ag-odd-row-background-color: hsl(var(--card));\n --ag-row-hover-color: hsl(var(--accent));\n --ag-selected-row-background-color: hsl(var(--primary) / 0.12);\n --ag-accent-color: hsl(var(--primary));\n --ag-header-height: var(--j-grid-header-h);\n --ag-row-height: var(--j-grid-row-h);\n}\n\n/* ============================================\n COMPACT FOOTER: Status Bar + Pagination 통합\n ============================================ */\n\n/* Status Bar 높이 줄이기 */\n:deep(.ag-status-bar) {\n min-height: var(--j-grid-footer-h) !important;\n height: var(--j-grid-footer-h) !important;\n padding: 0 12px !important;\n border-top: 1px solid var(--ag-border-color);\n display: flex;\n align-items: center;\n justify-content: space-between;\n font-size: 0.8125rem;\n}\n\n/* Status Bar 컴포넌트들 높이 조정 */\n:deep(.ag-status-bar-left),\n:deep(.ag-status-bar-center),\n:deep(.ag-status-bar-right) {\n height: var(--j-grid-footer-h);\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n/* Status Bar 패널들 간격 조정 */\n:deep(.ag-status-panel) {\n padding: 0;\n height: var(--j-grid-footer-h);\n display: flex;\n align-items: center;\n}\n\n/* Pagination Panel 높이 줄이기 */\n:deep(.ag-paging-panel) {\n min-height: var(--j-grid-footer-h) !important;\n height: var(--j-grid-footer-h) !important;\n padding: 0 12px !important;\n border-top: 1px solid var(--ag-border-color);\n font-size: 0.8125rem;\n}\n\n/* Pagination 컴포넌트들 높이 조정 */\n:deep(.ag-paging-page-size),\n:deep(.ag-paging-row-summary-panel) {\n height: var(--j-grid-footer-h);\n display: flex;\n align-items: center;\n}\n\n/* Page Size Selector 높이 조정 */\n:deep(.ag-paging-page-size .ag-picker-field) {\n height: 24px;\n min-height: 24px;\n}\n\n:deep(.ag-paging-page-size .ag-picker-field-wrapper) {\n height: 24px;\n padding: 0 4px;\n}\n\n/* Pagination 버튼들 높이 조정 */\n:deep(.ag-paging-button) {\n height: 24px;\n width: 24px;\n padding: 2px;\n}\n\n/* Pagination 버튼 래퍼 */\n:deep(.ag-paging-button-wrapper) {\n height: var(--j-grid-footer-h);\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n/* Row summary 텍스트 */\n:deep(.ag-paging-row-summary-panel-number) {\n line-height: var(--j-grid-footer-h);\n}\n\n/* ========================================\n 패턴 9: AG-Grid 스타일 향상\n ======================================== */\n\n:deep(.ag-root-wrapper) {\n border: 1px solid hsl(var(--border));\n border-radius: 0.375rem;\n}\n\n/* ── Header ──────────────────────────────────────────────────────────── */\n:deep(.ag-header) {\n border-bottom: 1px solid hsl(var(--border));\n font-weight: 500;\n}\n\n:deep(.ag-header-row:not(.ag-floating-filter)) {\n min-height: var(--j-grid-header-h) !important;\n height: var(--j-grid-header-h) !important;\n}\n\n:deep(.ag-header-cell) {\n color: hsl(var(--foreground));\n font-size: 0.75rem;\n padding: 0 0.5rem;\n display: flex;\n align-items: center;\n}\n\n/* Floating Filter: 헤더와 명확히 구분되는 입력 영역 */\n:deep(.ag-header-row.ag-floating-filter) {\n min-height: var(--j-grid-filter-h) !important;\n height: var(--j-grid-filter-h) !important;\n background-color: hsl(var(--card));\n border-top: 1px solid hsl(var(--border) / 0.5);\n}\n\n:deep(.ag-floating-filter-body) {\n min-height: var(--j-grid-filter-h);\n}\n\n:deep(.ag-floating-filter-body input),\n:deep(.ag-floating-filter-body .ag-input-field-input),\n:deep(.ag-floating-filter-body .ag-picker-field-wrapper) {\n height: 20px !important;\n min-height: 20px !important;\n font-size: 0.75rem;\n background-color: hsl(var(--background)) !important;\n border: 1px solid hsl(var(--border)) !important;\n border-radius: 3px !important;\n padding: 0 4px !important;\n color: hsl(var(--foreground)) !important;\n}\n\n:deep(.ag-floating-filter-body input:focus),\n:deep(.ag-floating-filter-body .ag-input-field-input:focus) {\n border-color: hsl(var(--primary)) !important;\n outline: none !important;\n}\n\n/* ── Rows ────────────────────────────────────────────────────────────── */\n:deep(.ag-row) {\n min-height: var(--j-grid-row-h) !important;\n height: var(--j-grid-row-h) !important;\n transition: background-color 0.15s ease, box-shadow 0.15s ease;\n cursor: pointer;\n}\n\n/* 선택된 행: 왼쪽 accent 기둥으로 명확한 시각적 선택 표시 (라이트/다크 모두) */\n:deep(.ag-row-selected) {\n box-shadow: inset 3px 0 0 hsl(var(--primary));\n}\n\n/* ── Cells ───────────────────────────────────────────────────────────── */\n:deep(.ag-cell) {\n line-height: 1.2;\n padding: 0 0.5rem;\n font-size: 0.75rem;\n border-bottom: 1px solid hsl(var(--border) / 0.5);\n}\n\n:deep(.ag-cell-wrapper) {\n align-items: center;\n}\n\n:deep(.ag-cell-value) {\n display: flex;\n align-items: center;\n min-height: 100%;\n}\n\n/* 행 클릭 시 row number 셀에 보이는 강한 포커스 음영 제거 */\n:deep(.ag-cell.ag-row-number-cell.ag-cell-focus),\n:deep(.ag-cell.ag-row-number-cell:focus-within) {\n box-shadow: none !important;\n outline: none !important;\n}\n\n/* 셀 포커스 */\n:deep(.ag-cell.ag-cell-focus) {\n box-shadow: inset 0 0 0 1px hsl(var(--ring) / 0.5) !important;\n}\n\n/* 인라인 편집 셀 */\n:deep(.ag-cell-inline-editing) {\n padding: 0 !important;\n border: none !important;\n box-shadow: inset 0 0 0 1px hsl(var(--primary)) !important;\n background-color: hsl(var(--background)) !important;\n}\n\n:deep(.ag-cell-inline-editing .ag-cell-editor),\n:deep(.ag-cell-inline-editing .ag-text-field-input-wrapper),\n:deep(.ag-cell-inline-editing .ag-input-field) {\n height: 100% !important;\n border: none !important;\n outline: none !important;\n background: transparent !important;\n box-shadow: none !important;\n}\n\n:deep(.ag-cell-inline-editing input) {\n height: 100% !important;\n width: 100% !important;\n padding: 0 0.5rem !important;\n border: none !important;\n outline: none !important;\n background: transparent !important;\n box-shadow: none !important;\n font-size: 0.75rem !important;\n color: hsl(var(--foreground)) !important;\n}\n\n/* ── Checkbox 셀 중앙정렬 (col-id 속성 선택자 — 신뢰할 수 있는 접근) ── */\n:deep(.ag-cell[col-id=\"rowSelection\"]) {\n display: flex !important;\n justify-content: center !important;\n align-items: center !important;\n padding: 0 !important;\n}\n:deep(.ag-cell[col-id=\"rowSelection\"] .ag-cell-wrapper) {\n width: auto !important;\n flex: none !important;\n}\n:deep(.ag-header-cell[col-id=\"rowSelection\"] .ag-header-cell-comp-wrapper) {\n justify-content: center !important;\n}\n\n/* ── Action Buttons (JS 렌더러 — CSS variable 브릿지) ─────────────────── */\n:deep(.j-action-btn) {\n padding: 1px 8px;\n font-size: 0.75rem;\n border: 1px solid hsl(var(--border));\n border-radius: 3px;\n background-color: hsl(var(--card));\n color: hsl(var(--foreground));\n cursor: pointer;\n transition: background-color 0.15s ease;\n white-space: nowrap;\n}\n\n:deep(.j-action-btn:hover) {\n background-color: hsl(var(--accent));\n}\n\n:deep(.j-action-btn-danger) {\n border-color: hsl(var(--destructive) / 0.4);\n background-color: hsl(var(--destructive) / 0.06);\n color: hsl(var(--destructive));\n}\n\n:deep(.j-action-btn-danger:hover) {\n background-color: hsl(var(--destructive) / 0.15);\n}\n\n/* ── Pagination ──────────────────────────────────────────────────────── */\n:deep(.ag-paging-panel) {\n border-top: 1px solid hsl(var(--border));\n}\n</style>\n"],"names":["ModuleRegistry","AllCommunityModule","AllEnterpriseModule","jTheme","themeQuartz","isDark","ref","gridContainerRef","darkObserver","watch","dark","onMounted","onUnmounted","props","__props","emit","__emit","gridApi","gridColumnApi","ActionButtonsCellRenderer","params","buttons","rowData","visibleButtons","btn","container","button","e","actionButtonsColumn","computed","processedColumnDefs","columns","target","gridOptions","useFloatingFilters","data","__expose","onGridReady","onRowClicked","event","onRowDoubleClicked","onCellClicked","onSelectionChanged","onCellValueChanged","_createElementBlock","_normalizeClass","_unref","cn","_createVNode","AgGridVue"],"mappings":"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"}
1
+ {"version":3,"file":"JGrid.vue2.js","sources":["../../../../src/components/atoms/JGrid.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch, onMounted, onUnmounted } from 'vue'\nimport { AgGridVue } from 'ag-grid-vue3'\nimport { cn } from '@/lib/utils'\nimport type {\n ColDef,\n GridOptions,\n RowClickedEvent,\n CellClickedEvent,\n SelectionChangedEvent,\n CellValueChangedEvent,\n RowDoubleClickedEvent,\n GridReadyEvent,\n ICellRendererParams,\n} from 'ag-grid-community'\nimport { ModuleRegistry, AllCommunityModule, themeQuartz } from 'ag-grid-community'\n// Enterprise 모듈 import (Grouping, Pivot, Excel Export 등)\nimport { AllEnterpriseModule } from 'ag-grid-enterprise'\n\n// AG Grid 모듈 등록 (Community + Enterprise)\nModuleRegistry.registerModules([AllCommunityModule, AllEnterpriseModule])\n\n// ── 공식 권장: data-ag-theme-mode attribute 기반 다크모드 전환 ─────────────────\n// AG Grid v33 공식 패턴:\n// 1. themeQuartz.withParams({...}, 'light').withParams({...}, 'dark') 로 두 모드 정의\n// 2. data-ag-theme-mode attribute 전환으로 모드 스위칭 (theme 객체 재생성 불필요)\n// 3. CSS --ag-* 변수 오버라이드로 앱 CSS 변수 참조 (getCSSVar 우회 불필요)\nconst jTheme = themeQuartz\n .withParams({\n // 공통 사이즈 (라이트/다크 모두 적용)\n cellHorizontalPaddingScale: 1,\n columnBorder: true,\n fontSize: 13,\n headerFontWeight: 600,\n headerVerticalPaddingScale: 0.45,\n iconSize: 14,\n rowVerticalPaddingScale: 0.4,\n })\n .withParams({\n browserColorScheme: 'light',\n }, 'light')\n .withParams({\n browserColorScheme: 'dark',\n }, 'dark')\n\n// JLIS는 .dark class 기반 다크모드이므로 MutationObserver로 감지 후 attribute 동기화\nconst isDark = ref(typeof document !== 'undefined' && document.documentElement.classList.contains('dark'))\nconst gridContainerRef = ref<HTMLElement | null>(null)\nlet darkObserver: MutationObserver | null = null\n\n// isDark 변경 → data-ag-theme-mode 동기화 (AG Grid가 내부적으로 반응)\nwatch(isDark, (dark) => {\n gridContainerRef.value?.setAttribute('data-ag-theme-mode', dark ? 'dark' : 'light')\n})\n\nonMounted(() => {\n // 초기 attribute 설정\n gridContainerRef.value?.setAttribute('data-ag-theme-mode', isDark.value ? 'dark' : 'light')\n\n // 이후 변경 감지\n darkObserver = new MutationObserver(() => {\n isDark.value = document.documentElement.classList.contains('dark')\n })\n darkObserver.observe(document.documentElement, { attributes: true, attributeFilter: ['class'] })\n})\n\nonUnmounted(() => {\n darkObserver?.disconnect()\n})\n\n/**\n * Action Button 정의 타입\n */\nexport type ActionButton = {\n /** 버튼 아이콘 이름 (lucide) - label이 없을 때 기본 텍스트 생성에 사용 */\n icon?: string\n /** 버튼 라벨 */\n label?: string\n /** 툴팁 텍스트 */\n tooltip?: string\n /** 버튼 클릭 핸들러 (rowData 전달) */\n onClick: (rowData: any) => void\n /** 버튼 스타일 타입 */\n styletype?: 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger'\n /** 조건부 표시 함수 (rowData를 받아 boolean 반환) */\n show?: (rowData: any) => boolean\n}\n\nconst props = withDefaults(\n defineProps<{\n /** 추가 클래스 (외부 커스터마이징용) */\n class?: string\n /** 그리드에 표시할 데이터 배열 */\n rowData: any[]\n /** 컬럼 정의 배열 */\n columnDefs: ColDef[]\n /** 페이지네이션 활성화 여부 */\n pagination?: boolean\n /** 체크박스 선택 활성화 여부 */\n checkbox?: boolean\n /** 행 번호 표시 여부 (Enterprise) */\n rowNumbers?: boolean\n /** 플로팅 필터 표시 여부 */\n floatingFilters?: boolean\n /** 플로팅 필터 표시 여부 (하위호환 alias) */\n floatingFilter?: boolean\n /** 행 번호 컬럼 너비(px) */\n rowNumberWidth?: number\n /** 행별 액션 버튼 목록 */\n actionButtons?: ActionButton[]\n /** 요약 컬럼 표시 여부 */\n summaryColumn?: boolean\n /** 숨김 컬럼 관리 활성화 여부 */\n hiddenColumn?: boolean\n /** 그룹핑 기능 활성화 여부 (Enterprise) */\n enableGrouping?: boolean\n /** 피벗 기능 활성화 여부 (Enterprise) */\n enablePivot?: boolean\n /** Excel 내보내기 기능 활성화 여부 (Enterprise) */\n enableExcelExport?: boolean\n /** Tree Data 기능 활성화 여부 (Enterprise) */\n enableTreeData?: boolean\n /** Tree Data 계층 경로를 반환하는 함수 */\n getDataPath?: (data: any) => (string | number)[]\n /** Tree Data 그룹 컬럼 정의 */\n autoGroupColumnDef?: ColDef\n /** 선택된 행 데이터 배열 (v-model:selected-rows) */\n selectedRows?: any[]\n /** 컬럼 호버 하이라이트 활성화 여부 */\n columnHover?: boolean\n /** Columns Tool Panel 활성화 여부 (Enterprise) */\n enableColumnsToolPanel?: boolean\n /** Status Bar 활성화 여부 (Enterprise) */\n statusBar?: boolean\n /** 간소화된 Footer 모드 (Status Bar 제거, Pagination만 표시) */\n compactFooter?: boolean\n /** Row Group Panel 표시 여부 ('always' | 'onlyWhenGrouping' | 'never') */\n rowGroupPanelShow?: 'always' | 'onlyWhenGrouping' | 'never'\n /** 그룹 기본 확장 레벨 (-1: 모두 닫힘, 0: 첫 레벨만, 1: 2레벨까지...) */\n groupDefaultExpanded?: number\n /** Pivot Mode Panel 표시 여부 */\n pivotPanelShow?: 'always' | 'onlyWhenPivoting' | 'never'\n /** Pivot Mode 활성화 여부 */\n pivotMode?: boolean\n }>(),\n {\n pagination: true,\n checkbox: false,\n rowNumbers: true,\n floatingFilters: true,\n floatingFilter: undefined,\n rowNumberWidth: 38,\n actionButtons: undefined,\n summaryColumn: false,\n hiddenColumn: false,\n enableGrouping: true,\n enablePivot: false,\n enableExcelExport: false,\n enableTreeData: false,\n getDataPath: undefined,\n autoGroupColumnDef: undefined,\n selectedRows: () => [],\n columnHover: true,\n enableColumnsToolPanel: true,\n statusBar: true,\n compactFooter: false,\n rowGroupPanelShow: 'never',\n groupDefaultExpanded: -1,\n pivotPanelShow: 'never',\n pivotMode: false,\n },\n)\n\nconst emit = defineEmits<{\n /** 행 클릭 이벤트 */\n rowClicked: [event: RowClickedEvent]\n /** 행 더블클릭 이벤트 */\n rowDoubleClicked: [event: RowDoubleClickedEvent]\n /** 셀 클릭 이벤트 */\n cellClicked: [event: CellClickedEvent]\n /** 선택 변경 이벤트 (체크박스 등) */\n selectionChanged: [event: SelectionChangedEvent]\n /** 셀 값 변경 이벤트 */\n cellValueChanged: [event: CellValueChangedEvent]\n /** 그리드 준비 완료 이벤트 */\n gridReady: [event: GridReadyEvent]\n /** 선택된 행 변경 이벤트 (v-model:selected-rows) */\n 'update:selectedRows': [rows: any[]]\n}>()\n\n// ag-Grid 인스턴스 참조\nconst gridApi = ref<any>(null)\nconst gridColumnApi = ref<any>(null)\n\n// Action Buttons Cell Renderer - 함수형으로 DOM 직접 생성\nconst ActionButtonsCellRenderer = (params: ICellRendererParams) => {\n const buttons = props.actionButtons || []\n const rowData = params.data\n \n // 표시할 버튼 필터링\n const visibleButtons = buttons.filter(btn => {\n if (btn.show) {\n return btn.show(rowData)\n }\n return true\n })\n \n if (visibleButtons.length === 0) {\n return ''\n }\n \n // 컨테이너 div 생성\n const container = document.createElement('div')\n container.className = 'flex items-center gap-1'\n \n // 각 버튼 생성\n visibleButtons.forEach((btn) => {\n const button = document.createElement('button')\n button.className = btn.styletype === 'danger' ? 'j-action-btn j-action-btn-danger' : 'j-action-btn'\n \n // tooltip\n if (btn.tooltip) {\n button.title = btn.tooltip\n }\n \n // 라벨 추가 (텍스트 버튼)\n if (btn.label) {\n button.textContent = btn.label\n } else if (btn.icon) {\n // 라벨이 없으면 기본 텍스트 생성\n if (btn.icon === 'pencil') {\n button.textContent = '수정'\n } else if (btn.icon === 'trash2' || btn.icon === 'trash') {\n button.textContent = '삭제'\n } else if (btn.icon === 'eye') {\n button.textContent = '보기'\n } else if (btn.icon === 'copy') {\n button.textContent = '복사'\n } else if (btn.icon === 'download') {\n button.textContent = '다운로드'\n } else if (btn.icon === 'circleX') {\n button.textContent = '비활성화'\n } else if (btn.icon === 'circleCheckBig') {\n button.textContent = '활성화'\n } else {\n button.textContent = btn.icon\n }\n }\n \n // 클릭 이벤트\n button.addEventListener('click', (e) => {\n e.stopPropagation()\n btn.onClick(rowData)\n })\n \n container.appendChild(button)\n })\n \n return container\n}\n\n// Action Buttons 컬럼 정의\nconst actionButtonsColumn = computed<ColDef | null>(() => {\n if (!props.actionButtons || props.actionButtons.length === 0) {\n return null\n }\n \n return {\n colId: 'actionButtons',\n headerName: '작업',\n field: '_actions',\n width: 120,\n minWidth: 80,\n maxWidth: 200,\n lockPosition: 'left' as const,\n sortable: false,\n filter: false,\n resizable: true,\n suppressNavigable: true,\n suppressHeaderMenuButton: true,\n cellRenderer: ActionButtonsCellRenderer,\n cellStyle: { display: 'flex', justifyContent: 'center', alignItems: 'center' },\n }\n})\n\n// checkbox 활성화 및 추가 컬럼 처리\nconst processedColumnDefs = computed(() => {\n const columns: ColDef[] = []\n \n // 1. Checkbox 컬럼 (최우선)\n if (props.checkbox) {\n columns.push({\n colId: 'rowSelection',\n headerName: '',\n // field와 valueGetter 제거 - AG Grid 공식 방식\n width: 40,\n minWidth: 40,\n maxWidth: 40,\n lockPosition: 'left' as const,\n checkboxSelection: true,\n headerCheckboxSelection: true,\n sortable: false,\n filter: false,\n resizable: false,\n suppressNavigable: true,\n suppressHeaderMenuButton: true,\n cellStyle: { display: 'flex', justifyContent: 'center', alignItems: 'center' },\n // 체크박스 셀 클릭 시 토글 (checkbox 아이콘 클릭은 AG Grid 기본 처리)\n onCellClicked: (params: CellClickedEvent) => {\n const target = (params.event as MouseEvent)?.target as HTMLElement\n if (target && !target.closest('.ag-checkbox-input-wrapper')) {\n params.node.setSelected(!params.node.isSelected())\n }\n },\n })\n }\n \n // 2. Action Buttons 컬럼\n if (actionButtonsColumn.value) {\n columns.push(actionButtonsColumn.value)\n }\n \n // 3. 사용자 정의 컬럼들 (Row Numbers는 AG Grid가 자동으로 추가)\n columns.push(...props.columnDefs)\n \n return columns\n})\n\n// Grid 옵션 설정\nconst gridOptions = computed<GridOptions>(() => {\n const useFloatingFilters = props.floatingFilter ?? props.floatingFilters\n const options: GridOptions = {\n theme: jTheme,\n pagination: props.pagination,\n overlayNoRowsTemplate: '<span class=\"j-grid-no-rows\">데이터가 없습니다</span>',\n defaultColDef: {\n filter: true,\n floatingFilter: useFloatingFilters,\n },\n rowSelection: props.checkbox ? 'multiple' : undefined,\n // 체크박스 모드일 때 row 클릭으로 선택이 변경되지 않도록 설정\n // 체크박스만으로 선택을 제어하도록 함\n suppressRowClickSelection: props.checkbox,\n\n // Row Numbers (Enterprise) - AG Grid 표준 방식\n rowNumbers: props.rowNumbers\n ? ({\n minWidth: props.rowNumberWidth,\n width: props.rowNumberWidth,\n } as any)\n : false,\n\n // Column Hover Highlight\n columnHoverHighlight: props.columnHover,\n\n // Enterprise 기능 옵션\n sideBar: props.enableColumnsToolPanel || props.enableGrouping || props.enablePivot ? {\n toolPanels: [\n {\n id: 'columns',\n labelDefault: 'Columns',\n labelKey: 'columns',\n iconKey: 'columns',\n toolPanel: 'agColumnsToolPanel',\n toolPanelParams: {\n suppressRowGroups: !props.enableGrouping,\n suppressValues: !props.enablePivot,\n suppressPivots: !props.enablePivot,\n suppressPivotMode: !props.enablePivot,\n },\n },\n ],\n defaultToolPanel: '', // 초기에는 접힌 상태\n } : undefined,\n\n // Status Bar (Enterprise)\n // compactFooter 모드에서는 Status Bar 비활성화\n statusBar: (props.statusBar && !props.compactFooter) ? {\n statusPanels: [\n { statusPanel: 'agTotalAndFilteredRowCountComponent', align: 'left' as const },\n { statusPanel: 'agSelectedRowCountComponent', align: 'left' as const },\n { statusPanel: 'agAggregationComponent', align: 'right' as const },\n ],\n } : undefined,\n\n // Row Group Panel 설정 (Enterprise) - 그리드 상단에 드래그 영역 표시\n rowGroupPanelShow: props.rowGroupPanelShow !== 'never' ? props.rowGroupPanelShow : undefined,\n\n // Pivot Panel 설정 (Enterprise) - 피벗 모드용 드래그 영역\n pivotPanelShow: props.pivotPanelShow !== 'never' ? props.pivotPanelShow : undefined,\n \n // Pivot Mode 활성화\n pivotMode: props.pivotMode,\n\n // 그룹핑 기본 설정\n groupDefaultExpanded: props.groupDefaultExpanded,\n suppressAggFuncInHeader: false,\n\n // Tree Data 설정 (Enterprise)\n treeData: props.enableTreeData || undefined,\n getDataPath: props.enableTreeData\n ? (props.getDataPath || ((data: any) => data.path || []))\n : undefined,\n autoGroupColumnDef: props.enableTreeData && props.autoGroupColumnDef\n ? props.autoGroupColumnDef\n : undefined,\n }\n\n return options\n})\n\n// Excel 내보내기 함수 (외부에서 사용 가능하도록 expose)\nconst exportToExcel = () => {\n if (gridApi.value && props.enableExcelExport) {\n gridApi.value.exportDataAsExcel({\n fileName: 'grid-export.xlsx',\n })\n }\n}\n\n// 그리드 API를 외부에 노출\ndefineExpose({\n gridApi,\n gridColumnApi,\n exportToExcel,\n})\n\n// Grid ready 이벤트 핸들러\nconst onGridReady = (params: GridReadyEvent) => {\n gridApi.value = params.api\n gridColumnApi.value = params.api // v34에서 columnApi는 deprecated\n emit('gridReady', params)\n}\n\n// 행 클릭 이벤트 핸들러\nconst onRowClicked = (event: RowClickedEvent) => {\n emit('rowClicked', event)\n}\n\n// 행 더블클릭 이벤트 핸들러\nconst onRowDoubleClicked = (event: RowDoubleClickedEvent) => {\n emit('rowDoubleClicked', event)\n}\n\n// 셀 클릭 이벤트 핸들러\nconst onCellClicked = (event: CellClickedEvent) => {\n emit('cellClicked', event)\n}\n\n// 선택 변경 이벤트 핸들러\nconst onSelectionChanged = (event: SelectionChangedEvent) => {\n emit('selectionChanged', event)\n emit('update:selectedRows', event.api.getSelectedRows())\n}\n\n// 셀 값 변경 이벤트 핸들러\nconst onCellValueChanged = (event: CellValueChangedEvent) => {\n emit('cellValueChanged', event)\n}\n\n// columnDefs 변경 감지\nwatch(\n () => props.columnDefs,\n () => {\n if (gridApi.value) {\n gridApi.value.setGridOption('columnDefs', processedColumnDefs.value)\n }\n },\n { deep: true },\n)\n\n// rowData 변경 감지\nwatch(\n () => props.rowData,\n () => {\n if (gridApi.value) {\n gridApi.value.setGridOption('rowData', props.rowData)\n }\n },\n { deep: true },\n)\n</script>\n\n<template>\n <div ref=\"gridContainerRef\" :class=\"cn('ag-grid-container', props.class)\">\n <AgGridVue\n :column-defs=\"processedColumnDefs\"\n :row-data=\"rowData\"\n :grid-options=\"gridOptions\"\n style=\"height: 100%; width: 100%\"\n @grid-ready=\"onGridReady\"\n @row-clicked=\"onRowClicked\"\n @row-double-clicked=\"onRowDoubleClicked\"\n @cell-clicked=\"onCellClicked\"\n @selection-changed=\"onSelectionChanged\"\n @cell-value-changed=\"onCellValueChanged\"\n />\n </div>\n</template>\n\n<style scoped>\n.ag-grid-container {\n width: 100%;\n height: 100%;\n min-height: 200px;\n\n /*\n * App CSS 변수 → AG Grid CSS 변수 브릿지\n * CSS 변수는 런타임 해소 → .dark 클래스 전환 시 라이트/다크 자동 대응\n * AG Grid v33 공식 CSS variable 명칭 사용\n */\n --ag-background-color: hsl(var(--background));\n --ag-foreground-color: hsl(var(--foreground));\n --ag-border-color: hsl(var(--border));\n --ag-header-background-color: hsl(var(--muted));\n --ag-header-foreground-color: hsl(var(--foreground));\n --ag-odd-row-background-color: hsl(var(--card));\n --ag-row-hover-color: hsl(var(--accent));\n --ag-selected-row-background-color: hsl(var(--primary) / 0.18);\n --ag-accent-color: hsl(var(--primary));\n --ag-header-height: var(--j-grid-header-h);\n --ag-row-height: var(--j-grid-row-h);\n}\n\n/* ============================================\n COMPACT FOOTER: Status Bar + Pagination 통합\n ============================================ */\n\n/* Status Bar 높이 줄이기 */\n:deep(.ag-status-bar) {\n min-height: var(--j-grid-footer-h) !important;\n height: var(--j-grid-footer-h) !important;\n padding: 0 8px !important;\n border-top: 1px solid var(--ag-border-color);\n display: flex;\n align-items: center;\n justify-content: space-between;\n font-size: 0.6875rem;\n}\n\n/* Status Bar 컴포넌트들 높이 조정 */\n:deep(.ag-status-bar-left),\n:deep(.ag-status-bar-center),\n:deep(.ag-status-bar-right) {\n height: var(--j-grid-footer-h);\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n/* Status Bar 패널들 간격 조정 */\n:deep(.ag-status-panel) {\n padding: 0;\n height: var(--j-grid-footer-h);\n display: flex;\n align-items: center;\n}\n\n/* Pagination Panel 높이 줄이기 */\n:deep(.ag-paging-panel) {\n min-height: var(--j-grid-footer-h) !important;\n height: var(--j-grid-footer-h) !important;\n padding: 0 8px !important;\n border-top: 1px solid var(--ag-border-color);\n font-size: 0.6875rem;\n gap: 8px;\n}\n\n/* Pagination 컴포넌트들 높이 조정 */\n:deep(.ag-paging-page-size),\n:deep(.ag-paging-row-summary-panel) {\n height: var(--j-grid-footer-h);\n display: flex;\n align-items: center;\n}\n\n/* Page Size Selector 높이 조정 */\n:deep(.ag-paging-page-size .ag-picker-field) {\n height: 18px;\n min-height: 18px;\n}\n\n:deep(.ag-paging-page-size .ag-picker-field-wrapper) {\n height: 18px;\n padding: 0 4px;\n font-size: 0.6875rem;\n border-radius: 3px;\n}\n\n/* Pagination 버튼들 높이 조정 */\n:deep(.ag-paging-button) {\n height: 20px;\n width: 20px;\n padding: 2px;\n}\n\n/* Pagination 버튼 래퍼 */\n:deep(.ag-paging-button-wrapper) {\n height: var(--j-grid-footer-h);\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n/* Row summary 텍스트 — 숫자 간 미세 간격 */\n:deep(.ag-paging-row-summary-panel-number) {\n line-height: var(--j-grid-footer-h);\n padding: 0 1px;\n}\n\n/* ========================================\n 패턴 9: AG-Grid 스타일 향상\n ======================================== */\n\n:deep(.ag-root-wrapper) {\n border: 1px solid hsl(var(--border));\n border-radius: 0.375rem;\n}\n\n/* ── Header ──────────────────────────────────────────────────────────── */\n:deep(.ag-header) {\n border-bottom: 1px solid hsl(var(--border));\n font-weight: 600;\n}\n\n:deep(.ag-header-row:not(.ag-floating-filter)) {\n min-height: var(--j-grid-header-h) !important;\n height: var(--j-grid-header-h) !important;\n}\n\n:deep(.ag-header-cell) {\n color: hsl(var(--foreground));\n font-size: 0.75rem;\n padding: 0 0.5rem;\n display: flex;\n align-items: center;\n}\n\n/* Floating Filter: 헤더와 명확히 구분되는 입력 영역 */\n:deep(.ag-header-row.ag-floating-filter) {\n min-height: var(--j-grid-filter-h) !important;\n height: var(--j-grid-filter-h) !important;\n background-color: hsl(var(--card));\n border-top: 1px solid hsl(var(--border) / 0.5);\n}\n\n:deep(.ag-floating-filter-body) {\n min-height: var(--j-grid-filter-h);\n}\n\n:deep(.ag-floating-filter-body input),\n:deep(.ag-floating-filter-body .ag-input-field-input),\n:deep(.ag-floating-filter-body .ag-picker-field-wrapper) {\n height: 20px !important;\n min-height: 20px !important;\n font-size: 0.75rem;\n background-color: hsl(var(--background)) !important;\n border: 1px solid hsl(var(--border)) !important;\n border-radius: 3px !important;\n padding: 0 4px !important;\n color: hsl(var(--foreground)) !important;\n}\n\n:deep(.ag-floating-filter-body input:focus),\n:deep(.ag-floating-filter-body .ag-input-field-input:focus) {\n border-color: hsl(var(--primary)) !important;\n outline: none !important;\n}\n\n/* ── Rows ────────────────────────────────────────────────────────────── */\n:deep(.ag-row) {\n min-height: var(--j-grid-row-h) !important;\n height: var(--j-grid-row-h) !important;\n transition: background-color 0.15s ease, box-shadow 0.15s ease;\n cursor: pointer;\n}\n\n/* 선택된 행: 왼쪽 accent 기둥으로 명확한 시각적 선택 표시 (라이트/다크 모두) */\n:deep(.ag-row-selected) {\n box-shadow: inset 4px 0 0 hsl(var(--primary));\n}\n\n/* ── Cells ───────────────────────────────────────────────────────────── */\n:deep(.ag-cell) {\n line-height: 1.2;\n padding: 0 0.5rem;\n font-size: 0.75rem;\n border-bottom: 1px solid hsl(var(--border) / 0.5);\n}\n\n:deep(.ag-cell-wrapper) {\n align-items: center;\n}\n\n:deep(.ag-cell-value) {\n display: flex;\n align-items: center;\n min-height: 100%;\n}\n\n/* 행 클릭 시 row number 셀에 보이는 강한 포커스 음영 제거 */\n:deep(.ag-cell.ag-row-number-cell.ag-cell-focus),\n:deep(.ag-cell.ag-row-number-cell:focus-within) {\n box-shadow: none !important;\n outline: none !important;\n}\n\n/* 셀 포커스 */\n:deep(.ag-cell.ag-cell-focus) {\n box-shadow: inset 0 0 0 1px hsl(var(--ring) / 0.5) !important;\n}\n\n/* 인라인 편집 셀 */\n:deep(.ag-cell-inline-editing) {\n padding: 0 !important;\n border: none !important;\n box-shadow: inset 0 0 0 1px hsl(var(--primary)) !important;\n background-color: hsl(var(--background)) !important;\n}\n\n:deep(.ag-cell-inline-editing .ag-cell-editor),\n:deep(.ag-cell-inline-editing .ag-text-field-input-wrapper),\n:deep(.ag-cell-inline-editing .ag-input-field) {\n height: 100% !important;\n border: none !important;\n outline: none !important;\n background: transparent !important;\n box-shadow: none !important;\n}\n\n:deep(.ag-cell-inline-editing input) {\n height: 100% !important;\n width: 100% !important;\n padding: 0 0.5rem !important;\n border: none !important;\n outline: none !important;\n background: transparent !important;\n box-shadow: none !important;\n font-size: 0.75rem !important;\n color: hsl(var(--foreground)) !important;\n}\n\n/* ── Checkbox 셀 중앙정렬 (col-id 속성 선택자 — 신뢰할 수 있는 접근) ── */\n:deep(.ag-cell[col-id=\"rowSelection\"]) {\n display: flex !important;\n justify-content: center !important;\n align-items: center !important;\n padding: 0 !important;\n}\n:deep(.ag-cell[col-id=\"rowSelection\"] .ag-cell-wrapper) {\n width: auto !important;\n flex: none !important;\n}\n:deep(.ag-header-cell[col-id=\"rowSelection\"] .ag-header-cell-comp-wrapper) {\n justify-content: center !important;\n}\n\n/* ── Action Buttons (JS 렌더러 — CSS variable 브릿지) ─────────────────── */\n:deep(.j-action-btn) {\n padding: 1px 8px;\n font-size: 0.75rem;\n border: 1px solid hsl(var(--border));\n border-radius: 3px;\n background-color: hsl(var(--card));\n color: hsl(var(--foreground));\n cursor: pointer;\n transition: all 0.15s ease;\n white-space: nowrap;\n}\n\n:deep(.j-action-btn:hover) {\n background-color: hsl(var(--accent));\n border-color: hsl(var(--primary) / 0.3);\n}\n\n:deep(.j-action-btn-danger) {\n border-color: hsl(var(--destructive) / 0.4);\n background-color: hsl(var(--destructive) / 0.06);\n color: hsl(var(--destructive));\n}\n\n:deep(.j-action-btn-danger:hover) {\n background-color: hsl(var(--destructive) / 0.15);\n}\n\n/* ── Pagination ──────────────────────────────────────────────────────── */\n:deep(.ag-paging-panel) {\n border-top: 1px solid hsl(var(--border));\n}\n\n/* ── No-Rows 오버레이 (한글) ──────────────────────────────────────── */\n:deep(.j-grid-no-rows) {\n color: hsl(var(--muted-foreground));\n font-size: 0.75rem;\n}\n</style>\n"],"names":["ModuleRegistry","AllCommunityModule","AllEnterpriseModule","jTheme","themeQuartz","isDark","ref","gridContainerRef","darkObserver","watch","dark","onMounted","onUnmounted","props","__props","emit","__emit","gridApi","gridColumnApi","ActionButtonsCellRenderer","params","buttons","rowData","visibleButtons","btn","container","button","e","actionButtonsColumn","computed","processedColumnDefs","columns","target","gridOptions","useFloatingFilters","data","__expose","onGridReady","onRowClicked","event","onRowDoubleClicked","onCellClicked","onSelectionChanged","onCellValueChanged","_createElementBlock","_normalizeClass","_unref","cn","_createVNode","AgGridVue"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue");require("../shadcn/index.cjs");const s=require("../../lib/utils.cjs"),l=require("../shadcn/Card.vue.cjs"),n=require("../shadcn/CardHeader.vue.cjs"),u=require("../shadcn/CardTitle.vue.cjs"),c=require("../shadcn/CardDescription.vue.cjs"),i=require("../shadcn/CardContent.vue.cjs"),d=require("../shadcn/CardFooter.vue.cjs"),_={class:"flex justify-between items-center gap-3"},f={class:"flex-1"},p={key:0,class:"flex gap-2 flex-shrink-0"},v=e.defineComponent({__name:"JCard",props:{class:{},title:{},description:{},footer:{},variant:{default:"default"}},setup(t){const o=t,a=e.computed(()=>({default:"shadow-sm",elevated:"shadow-md"})[o.variant]);return(r,m)=>(e.openBlock(),e.createBlock(e.unref(l.default),{class:e.normalizeClass(e.unref(s.cn)(a.value,o.class))},{default:e.withCtx(()=>[t.title||t.description||r.$slots.actions?(e.openBlock(),e.createBlock(e.unref(n.default),{key:0},{default:e.withCtx(()=>[e.createElementVNode("div",_,[e.createElementVNode("div",f,[t.title?(e.openBlock(),e.createBlock(e.unref(u.default),{key:0},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.title),1)]),_:1})):e.createCommentVNode("",!0),t.description?(e.openBlock(),e.createBlock(e.unref(c.default),{key:1},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.description),1)]),_:1})):e.createCommentVNode("",!0)]),r.$slots.actions?(e.openBlock(),e.createElementBlock("div",p,[e.renderSlot(r.$slots,"actions")])):e.createCommentVNode("",!0)])]),_:3})):e.createCommentVNode("",!0),e.createVNode(e.unref(i.default),null,{default:e.withCtx(()=>[e.renderSlot(r.$slots,"default")]),_:3}),r.$slots.footer||t.footer?(e.openBlock(),e.createBlock(e.unref(d.default),{key:1},{default:e.withCtx(()=>[e.renderSlot(r.$slots,"footer",{},()=>[e.createTextVNode(e.toDisplayString(t.footer),1)])]),_:3})):e.createCommentVNode("",!0)]),_:3},8,["class"]))}});exports.default=v;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue");require("../shadcn/index.cjs");const a=require("../../lib/utils.cjs"),n=require("../shadcn/Card.vue.cjs"),s=require("../shadcn/CardHeader.vue.cjs"),u=require("../shadcn/CardTitle.vue.cjs"),c=require("../shadcn/CardDescription.vue.cjs"),i=require("../shadcn/CardContent.vue.cjs"),d=require("../shadcn/CardFooter.vue.cjs"),f={class:"flex justify-between items-center gap-3"},_={class:"flex-1"},C={key:0,class:"flex gap-2 flex-shrink-0"},v=e.defineComponent({__name:"JCard",props:{class:{},title:{},description:{},footer:{},variant:{default:"default"},fillContent:{type:Boolean}},setup(t){const o=t,l=e.computed(()=>({default:"shadow-sm",elevated:"shadow-md"})[o.variant]);return(r,m)=>(e.openBlock(),e.createBlock(e.unref(n.default),{class:e.normalizeClass(e.unref(a.cn)(l.value,t.fillContent&&"flex flex-col",o.class))},{default:e.withCtx(()=>[t.title||t.description||r.$slots.actions?(e.openBlock(),e.createBlock(e.unref(s.default),{key:0},{default:e.withCtx(()=>[e.createElementVNode("div",f,[e.createElementVNode("div",_,[t.title?(e.openBlock(),e.createBlock(e.unref(u.default),{key:0},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.title),1)]),_:1})):e.createCommentVNode("",!0),t.description?(e.openBlock(),e.createBlock(e.unref(c.default),{key:1},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.description),1)]),_:1})):e.createCommentVNode("",!0)]),r.$slots.actions?(e.openBlock(),e.createElementBlock("div",C,[e.renderSlot(r.$slots,"actions")])):e.createCommentVNode("",!0)])]),_:3})):e.createCommentVNode("",!0),e.createVNode(e.unref(i.default),{class:e.normalizeClass(t.fillContent&&"flex-1 flex flex-col min-h-0")},{default:e.withCtx(()=>[e.renderSlot(r.$slots,"default")]),_:3},8,["class"]),r.$slots.footer||t.footer?(e.openBlock(),e.createBlock(e.unref(d.default),{key:1},{default:e.withCtx(()=>[e.renderSlot(r.$slots,"footer",{},()=>[e.createTextVNode(e.toDisplayString(t.footer),1)])]),_:3})):e.createCommentVNode("",!0)]),_:3},8,["class"]))}});exports.default=v;
2
2
  //# sourceMappingURL=JCard.vue.cjs.map