ninegrid2 6.888.0 → 6.890.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.
@@ -121080,9 +121080,6 @@ class nxTab extends HTMLElement {
121080
121080
  });
121081
121081
 
121082
121082
  const activeButton = this.shadowRoot.querySelector('.tab-button:not([style*="display: none"])');
121083
- console.log(activeButton);
121084
- console.log(activeButton.getAttribute('data-target'), activeButton.data);
121085
- //const tabPage = this.shadowRoot.querySelector(`#${activeButton.data}`);
121086
121083
 
121087
121084
  if (activeButton) {
121088
121085
  activeButton.click(); // 자동으로 탭 전환
@@ -121126,6 +121123,9 @@ class nxTab extends HTMLElement {
121126
121123
 
121127
121124
  #switchTab(event) {
121128
121125
  const target = event.target;
121126
+
121127
+ console.log(event);
121128
+
121129
121129
  if (!target.classList.contains('tab-button')) return;
121130
121130
 
121131
121131
  const targetId = target.getAttribute('data-target');
@@ -121133,7 +121133,10 @@ class nxTab extends HTMLElement {
121133
121133
  const activeContent = this.shadowRoot.querySelector('.tab-page.active');
121134
121134
  const newContent = this.shadowRoot.getElementById(targetId);
121135
121135
 
121136
+ console.log(targetId, activeTab, activeContent, newContent);
121137
+
121136
121138
  if (activeTab === target) return; // 현재 탭을 클릭했을 때 아무런 변화가 없도록 함
121139
+ console.log("*******");
121137
121140
 
121138
121141
  if (activeTab && activeContent) {
121139
121142
  activeTab.classList.remove('active');
@@ -121154,6 +121157,17 @@ class nxTab extends HTMLElement {
121154
121157
 
121155
121158
  newContent.classList.remove('exit-left','exit-right');
121156
121159
  }
121160
+ else if (activeContent && newContent) {
121161
+ activeTab.classList.remove('active');
121162
+ activeContent.classList.remove('active','exit-left','exit-right');
121163
+ //newContent.classList.remove('exit-left','exit-right');
121164
+ activeContent.style.left = '';
121165
+
121166
+ newContent.classList.add('active');
121167
+ newContent.style.left = '';
121168
+
121169
+ newContent.classList.remove('exit-left','exit-right');
121170
+ }
121157
121171
 
121158
121172
  target.classList.add('active');
121159
121173
  //newContent.classList.add('active');
@@ -121076,9 +121076,6 @@ class nxTab extends HTMLElement {
121076
121076
  });
121077
121077
 
121078
121078
  const activeButton = this.shadowRoot.querySelector('.tab-button:not([style*="display: none"])');
121079
- console.log(activeButton);
121080
- console.log(activeButton.getAttribute('data-target'), activeButton.data);
121081
- //const tabPage = this.shadowRoot.querySelector(`#${activeButton.data}`);
121082
121079
 
121083
121080
  if (activeButton) {
121084
121081
  activeButton.click(); // 자동으로 탭 전환
@@ -121122,6 +121119,9 @@ class nxTab extends HTMLElement {
121122
121119
 
121123
121120
  #switchTab(event) {
121124
121121
  const target = event.target;
121122
+
121123
+ console.log(event);
121124
+
121125
121125
  if (!target.classList.contains('tab-button')) return;
121126
121126
 
121127
121127
  const targetId = target.getAttribute('data-target');
@@ -121129,7 +121129,10 @@ class nxTab extends HTMLElement {
121129
121129
  const activeContent = this.shadowRoot.querySelector('.tab-page.active');
121130
121130
  const newContent = this.shadowRoot.getElementById(targetId);
121131
121131
 
121132
+ console.log(targetId, activeTab, activeContent, newContent);
121133
+
121132
121134
  if (activeTab === target) return; // 현재 탭을 클릭했을 때 아무런 변화가 없도록 함
121135
+ console.log("*******");
121133
121136
 
121134
121137
  if (activeTab && activeContent) {
121135
121138
  activeTab.classList.remove('active');
@@ -121150,6 +121153,17 @@ class nxTab extends HTMLElement {
121150
121153
 
121151
121154
  newContent.classList.remove('exit-left','exit-right');
121152
121155
  }
121156
+ else if (activeContent && newContent) {
121157
+ activeTab.classList.remove('active');
121158
+ activeContent.classList.remove('active','exit-left','exit-right');
121159
+ //newContent.classList.remove('exit-left','exit-right');
121160
+ activeContent.style.left = '';
121161
+
121162
+ newContent.classList.add('active');
121163
+ newContent.style.left = '';
121164
+
121165
+ newContent.classList.remove('exit-left','exit-right');
121166
+ }
121153
121167
 
121154
121168
  target.classList.add('active');
121155
121169
  //newContent.classList.add('active');
package/dist/nx/nxTab.js CHANGED
@@ -57,9 +57,6 @@ class nxTab extends HTMLElement {
57
57
  });
58
58
 
59
59
  const activeButton = this.shadowRoot.querySelector('.tab-button:not([style*="display: none"])');
60
- console.log(activeButton);
61
- console.log(activeButton.getAttribute('data-target'), activeButton.data);
62
- //const tabPage = this.shadowRoot.querySelector(`#${activeButton.data}`);
63
60
 
64
61
  if (activeButton) {
65
62
  activeButton.click(); // 자동으로 탭 전환
@@ -103,6 +100,9 @@ class nxTab extends HTMLElement {
103
100
 
104
101
  #switchTab(event) {
105
102
  const target = event.target;
103
+
104
+ console.log(event);
105
+
106
106
  if (!target.classList.contains('tab-button')) return;
107
107
 
108
108
  const targetId = target.getAttribute('data-target');
@@ -110,7 +110,10 @@ class nxTab extends HTMLElement {
110
110
  const activeContent = this.shadowRoot.querySelector('.tab-page.active');
111
111
  const newContent = this.shadowRoot.getElementById(targetId);
112
112
 
113
+ console.log(targetId, activeTab, activeContent, newContent);
114
+
113
115
  if (activeTab === target) return; // 현재 탭을 클릭했을 때 아무런 변화가 없도록 함
116
+ console.log("*******");
114
117
 
115
118
  if (activeTab && activeContent) {
116
119
  activeTab.classList.remove('active');
@@ -131,6 +134,17 @@ class nxTab extends HTMLElement {
131
134
 
132
135
  newContent.classList.remove('exit-left','exit-right');
133
136
  }
137
+ else if (activeContent && newContent) {
138
+ activeTab.classList.remove('active');
139
+ activeContent.classList.remove('active','exit-left','exit-right');
140
+ //newContent.classList.remove('exit-left','exit-right');
141
+ activeContent.style.left = '';
142
+
143
+ newContent.classList.add('active');
144
+ newContent.style.left = '';
145
+
146
+ newContent.classList.remove('exit-left','exit-right');
147
+ }
134
148
 
135
149
  target.classList.add('active');
136
150
  //newContent.classList.add('active');
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "ninegrid2",
3
3
  "type": "module",
4
- "version": "6.888.0",
4
+ "version": "6.890.0",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
7
7
  "exports": {
package/src/nx/nxTab.js CHANGED
@@ -57,9 +57,6 @@ class nxTab extends HTMLElement {
57
57
  });
58
58
 
59
59
  const activeButton = this.shadowRoot.querySelector('.tab-button:not([style*="display: none"])');
60
- console.log(activeButton);
61
- console.log(activeButton.getAttribute('data-target'), activeButton.data);
62
- //const tabPage = this.shadowRoot.querySelector(`#${activeButton.data}`);
63
60
 
64
61
  if (activeButton) {
65
62
  activeButton.click(); // 자동으로 탭 전환
@@ -103,6 +100,9 @@ class nxTab extends HTMLElement {
103
100
 
104
101
  #switchTab(event) {
105
102
  const target = event.target;
103
+
104
+ console.log(event);
105
+
106
106
  if (!target.classList.contains('tab-button')) return;
107
107
 
108
108
  const targetId = target.getAttribute('data-target');
@@ -110,7 +110,10 @@ class nxTab extends HTMLElement {
110
110
  const activeContent = this.shadowRoot.querySelector('.tab-page.active');
111
111
  const newContent = this.shadowRoot.getElementById(targetId);
112
112
 
113
+ console.log(targetId, activeTab, activeContent, newContent);
114
+
113
115
  if (activeTab === target) return; // 현재 탭을 클릭했을 때 아무런 변화가 없도록 함
116
+ console.log("*******");
114
117
 
115
118
  if (activeTab && activeContent) {
116
119
  activeTab.classList.remove('active');
@@ -131,6 +134,17 @@ class nxTab extends HTMLElement {
131
134
 
132
135
  newContent.classList.remove('exit-left','exit-right');
133
136
  }
137
+ else if (activeContent && newContent) {
138
+ activeTab.classList.remove('active');
139
+ activeContent.classList.remove('active','exit-left','exit-right');
140
+ //newContent.classList.remove('exit-left','exit-right');
141
+ activeContent.style.left = '';
142
+
143
+ newContent.classList.add('active');
144
+ newContent.style.left = '';
145
+
146
+ newContent.classList.remove('exit-left','exit-right');
147
+ }
134
148
 
135
149
  target.classList.add('active');
136
150
  //newContent.classList.add('active');