ninegrid2 6.785.0 → 6.786.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -120907,6 +120907,24 @@ class nxCollapse extends HTMLElement {
120907
120907
  box-shadow: 0 0 6px rgba(220, 20, 60, 0.4); /* 붉은빛 glow */
120908
120908
  transform: scale(1.2); /* 살짝 확대 */
120909
120909
  }
120910
+
120911
+ :host(.shrinking) {
120912
+ animation: collapseShrink 0.7s ease forwards;
120913
+ pointer-events: none; /* 클릭 방지 */
120914
+ }
120915
+
120916
+ @keyframes collapseShrink {
120917
+ 0% {
120918
+ opacity: 1;
120919
+ transform: scale(1);
120920
+ transform-origin: top right;
120921
+ }
120922
+ 100% {
120923
+ opacity: 0;
120924
+ transform: scale(0);
120925
+ transform-origin: top right;
120926
+ }
120927
+ }
120910
120928
  `;
120911
120929
 
120912
120930
  (shadowRoot || this.#target).appendChild(style);
@@ -120926,8 +120944,7 @@ class nxCollapse extends HTMLElement {
120926
120944
  this.#targetPrevDisplay = this.#target.style.display;
120927
120945
  this.#target.style.display = "none";
120928
120946
  this.style.display = "inline-block";
120929
- }, 1000); // transition 시간과 맞춰서 300ms 딜레이
120930
-
120947
+ }, 700); // transition 시간과 맞춰서 300ms 딜레이
120931
120948
  });
120932
120949
  }
120933
120950
 
@@ -120903,6 +120903,24 @@ class nxCollapse extends HTMLElement {
120903
120903
  box-shadow: 0 0 6px rgba(220, 20, 60, 0.4); /* 붉은빛 glow */
120904
120904
  transform: scale(1.2); /* 살짝 확대 */
120905
120905
  }
120906
+
120907
+ :host(.shrinking) {
120908
+ animation: collapseShrink 0.7s ease forwards;
120909
+ pointer-events: none; /* 클릭 방지 */
120910
+ }
120911
+
120912
+ @keyframes collapseShrink {
120913
+ 0% {
120914
+ opacity: 1;
120915
+ transform: scale(1);
120916
+ transform-origin: top right;
120917
+ }
120918
+ 100% {
120919
+ opacity: 0;
120920
+ transform: scale(0);
120921
+ transform-origin: top right;
120922
+ }
120923
+ }
120906
120924
  `;
120907
120925
 
120908
120926
  (shadowRoot || this.#target).appendChild(style);
@@ -120922,8 +120940,7 @@ class nxCollapse extends HTMLElement {
120922
120940
  this.#targetPrevDisplay = this.#target.style.display;
120923
120941
  this.#target.style.display = "none";
120924
120942
  this.style.display = "inline-block";
120925
- }, 1000); // transition 시간과 맞춰서 300ms 딜레이
120926
-
120943
+ }, 700); // transition 시간과 맞춰서 300ms 딜레이
120927
120944
  });
120928
120945
  }
120929
120946
 
@@ -62,6 +62,24 @@ class nxCollapse extends HTMLElement {
62
62
  box-shadow: 0 0 6px rgba(220, 20, 60, 0.4); /* 붉은빛 glow */
63
63
  transform: scale(1.2); /* 살짝 확대 */
64
64
  }
65
+
66
+ :host(.shrinking) {
67
+ animation: collapseShrink 0.7s ease forwards;
68
+ pointer-events: none; /* 클릭 방지 */
69
+ }
70
+
71
+ @keyframes collapseShrink {
72
+ 0% {
73
+ opacity: 1;
74
+ transform: scale(1);
75
+ transform-origin: top right;
76
+ }
77
+ 100% {
78
+ opacity: 0;
79
+ transform: scale(0);
80
+ transform-origin: top right;
81
+ }
82
+ }
65
83
  `;
66
84
 
67
85
  (shadowRoot || this.#target).appendChild(style);
@@ -81,8 +99,7 @@ class nxCollapse extends HTMLElement {
81
99
  this.#targetPrevDisplay = this.#target.style.display;
82
100
  this.#target.style.display = "none";
83
101
  this.style.display = "inline-block";
84
- }, 1000); // transition 시간과 맞춰서 300ms 딜레이
85
-
102
+ }, 700); // transition 시간과 맞춰서 300ms 딜레이
86
103
  });
87
104
  }
88
105
 
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "ninegrid2",
3
3
  "type": "module",
4
- "version": "6.785.0",
4
+ "version": "6.786.0",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
7
7
  "exports": {
@@ -62,6 +62,24 @@ class nxCollapse extends HTMLElement {
62
62
  box-shadow: 0 0 6px rgba(220, 20, 60, 0.4); /* 붉은빛 glow */
63
63
  transform: scale(1.2); /* 살짝 확대 */
64
64
  }
65
+
66
+ :host(.shrinking) {
67
+ animation: collapseShrink 0.7s ease forwards;
68
+ pointer-events: none; /* 클릭 방지 */
69
+ }
70
+
71
+ @keyframes collapseShrink {
72
+ 0% {
73
+ opacity: 1;
74
+ transform: scale(1);
75
+ transform-origin: top right;
76
+ }
77
+ 100% {
78
+ opacity: 0;
79
+ transform: scale(0);
80
+ transform-origin: top right;
81
+ }
82
+ }
65
83
  `;
66
84
 
67
85
  (shadowRoot || this.#target).appendChild(style);
@@ -81,8 +99,7 @@ class nxCollapse extends HTMLElement {
81
99
  this.#targetPrevDisplay = this.#target.style.display;
82
100
  this.#target.style.display = "none";
83
101
  this.style.display = "inline-block";
84
- }, 1000); // transition 시간과 맞춰서 300ms 딜레이
85
-
102
+ }, 700); // transition 시간과 맞춰서 300ms 딜레이
86
103
  });
87
104
  }
88
105