juxscript 1.1.36 → 1.1.38

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/lib/components/tabs.d.ts +1 -1
  2. package/lib/components/tabs.d.ts.map +1 -1
  3. package/lib/components/tabs.js +16 -10
  4. package/lib/components/tabs.ts +18 -10
  5. package/package.json +1 -1
package/lib/components/tabs.d.ts CHANGED
@@ -33,7 +33,7 @@ export declare class Tabs extends BaseComponent<TabsState> {
33
33
  /**
34
34
  * Update content of a specific tab by ID
35
35
  */
36
- updateTabContent(tabId: string, content: string): this;
36
+ updateTabContent(tabId: string, content: string | BaseComponent<any>): this;
37
37
  /**
38
38
  * Get tab by ID
39
39
  */
package/lib/components/tabs.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["tabs.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAMnE,MAAM,WAAW,GAAG;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,WAAW;IAC1B,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,WAAW,CAAC;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,KAAK,SAAS,GAAG,SAAS,GAAG;IAC3B,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,qBAAa,IAAK,SAAQ,aAAa,CAAC,SAAS,CAAC;IAChD,OAAO,CAAC,YAAY,CAA4B;gBAEpC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB;IAUjD,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAQhD,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI;IAuBtC,OAAO,CAAC,gBAAgB;IAsBxB,OAAO,CAAC,YAAY;IAmEpB,IAAI,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI;IAKxB,MAAM,CAAC,GAAG,EAAE,GAAG,GAAG,IAAI;IAKtB,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAW9B,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK9B,OAAO,CAAC,KAAK,EAAE,SAAS,GAAG,OAAO,GAAG,WAAW,GAAG,IAAI;IAKvD;;OAEG;IACH,gBAAgB,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,IAAI;IAetD;;OAEG;IACH,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,GAAG,GAAG,SAAS;IAItC;;OAEG;IACH,aAAa,IAAI,GAAG,GAAG,SAAS;IAQhC,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,IAAI;CA4EnE;AAED,wBAAgB,IAAI,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB,GAAG,IAAI,CAEhE"}
1
+ {"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["tabs.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAMnE,MAAM,WAAW,GAAG;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,WAAW;IAC1B,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,WAAW,CAAC;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,KAAK,SAAS,GAAG,SAAS,GAAG;IAC3B,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,qBAAa,IAAK,SAAQ,aAAa,CAAC,SAAS,CAAC;IAChD,OAAO,CAAC,YAAY,CAA4B;gBAEpC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB;IAUjD,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAQhD,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI;IAuBtC,OAAO,CAAC,gBAAgB;IAsBxB,OAAO,CAAC,YAAY;IAoEpB,IAAI,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI;IAKxB,MAAM,CAAC,GAAG,EAAE,GAAG,GAAG,IAAI;IAKtB,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAW9B,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK9B,OAAO,CAAC,KAAK,EAAE,SAAS,GAAG,OAAO,GAAG,WAAW,GAAG,IAAI;IAKvD;;OAEG;IACH,gBAAgB,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,IAAI;IAqB3E;;OAEG;IACH,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,GAAG,GAAG,SAAS;IAItC;;OAEG;IACH,aAAa,IAAI,GAAG,GAAG,SAAS;IAQhC,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,IAAI;CA6EnE;AAED,wBAAgB,IAAI,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB,GAAG,IAAI,CAEhE"}
package/lib/components/tabs.js CHANGED
@@ -95,8 +95,7 @@ export class Tabs extends BaseComponent {
95
95
  tabList.appendChild(tabButton);
96
96
  // Panel with unique ID
97
97
  const tabPanel = document.createElement('div');
98
- const tabId = `${this._id}-${tab.id}-panel`;
99
- tabPanel.id = tabId;
98
+ tabPanel.id = `${this._id}-${tab.id}-panel`;
100
99
  tabPanel.className = 'jux-tabs-panel';
101
100
  tabPanel.setAttribute('data-tab-id', tab.id);
102
101
  if (tab.id === this.state.activeTab) {
@@ -105,13 +104,15 @@ export class Tabs extends BaseComponent {
105
104
  else {
106
105
  tabPanel.style.display = 'none';
107
106
  }
107
+ // ✅ Append panel to DOM FIRST
108
+ tabPanels.appendChild(tabPanel);
109
+ // THEN render content into it
108
110
  if (typeof tab.content === 'string') {
109
111
  tabPanel.innerHTML = tab.content;
110
112
  }
111
113
  else if (tab.content instanceof BaseComponent) {
112
- tabPanel.innerHTML = tab.content.render(tabId).container?.outerHTML || '';
114
+ tab.content.render(`#${tabPanel.id}`);
113
115
  }
114
- tabPanels.appendChild(tabPanel);
115
116
  });
116
117
  }
117
118
  /* ═════════════════════════════════════════════════════════════════
@@ -152,7 +153,13 @@ export class Tabs extends BaseComponent {
152
153
  // Update DOM if rendered
153
154
  const panel = document.getElementById(`${this._id}-${tabId}-panel`);
154
155
  if (panel) {
155
- panel.innerHTML = content;
156
+ panel.innerHTML = ''; // Clear existing content
157
+ if (typeof content === 'string') {
158
+ panel.innerHTML = content;
159
+ }
160
+ else if (content instanceof BaseComponent) {
161
+ content.render(`#${panel.id}`);
162
+ }
156
163
  }
157
164
  return this;
158
165
  }
@@ -217,16 +224,15 @@ export class Tabs extends BaseComponent {
217
224
  else {
218
225
  tabPanel.style.display = 'none';
219
226
  }
227
+ // ✅ Append panel to DOM FIRST
228
+ tabPanels.appendChild(tabPanel);
229
+ // ✅ THEN render content into it
220
230
  if (typeof tab.content === 'string') {
221
231
  tabPanel.innerHTML = tab.content;
222
232
  }
223
233
  else if (tab.content instanceof BaseComponent) {
224
- tabPanel.innerHTML = tab.content.render(tabPanel.id).container?.outerHTML || '';
225
- }
226
- else {
227
- tabPanel.innerHTML = '';
234
+ tab.content.render(`#${tabPanel.id}`);
228
235
  }
229
- tabPanels.appendChild(tabPanel);
230
236
  });
231
237
  wrapper.appendChild(tabList);
232
238
  wrapper.appendChild(tabPanels);
package/lib/components/tabs.ts CHANGED
@@ -137,8 +137,7 @@ export class Tabs extends BaseComponent<TabsState> {
137
137
 
138
138
  // Panel with unique ID
139
139
  const tabPanel = document.createElement('div');
140
- const tabId = `${this._id}-${tab.id}-panel`;
141
- tabPanel.id = tabId;
140
+ tabPanel.id = `${this._id}-${tab.id}-panel`;
142
141
  tabPanel.className = 'jux-tabs-panel';
143
142
  tabPanel.setAttribute('data-tab-id', tab.id);
144
143
 
@@ -148,13 +147,15 @@ export class Tabs extends BaseComponent<TabsState> {
148
147
  tabPanel.style.display = 'none';
149
148
  }
150
149
 
150
+ // ✅ Append panel to DOM FIRST
151
+ tabPanels.appendChild(tabPanel);
151
152
 
153
+ // THEN render content into it
152
154
  if (typeof tab.content === 'string') {
153
155
  tabPanel.innerHTML = tab.content;
154
156
  } else if (tab.content instanceof BaseComponent) {
155
- tabPanel.innerHTML = tab.content.render(tabId).container?.outerHTML || '';
157
+ tab.content.render(`#${tabPanel.id}`);
156
158
  }
157
- tabPanels.appendChild(tabPanel);
158
159
  });
159
160
  }
160
161
 
@@ -196,7 +197,7 @@ export class Tabs extends BaseComponent<TabsState> {
196
197
  /**
197
198
  * Update content of a specific tab by ID
198
199
  */
199
- updateTabContent(tabId: string, content: string): this {
200
+ updateTabContent(tabId: string, content: string | BaseComponent<any>): this {
200
201
  const tab = this.state.tabs.find(t => t.id === tabId);
201
202
  if (!tab) return this;
202
203
 
@@ -205,7 +206,13 @@ export class Tabs extends BaseComponent<TabsState> {
205
206
  // Update DOM if rendered
206
207
  const panel = document.getElementById(`${this._id}-${tabId}-panel`);
207
208
  if (panel) {
208
- panel.innerHTML = content;
209
+ panel.innerHTML = ''; // Clear existing content
210
+
211
+ if (typeof content === 'string') {
212
+ panel.innerHTML = content;
213
+ } else if (content instanceof BaseComponent) {
214
+ content.render(`#${panel.id}`);
215
+ }
209
216
  }
210
217
 
211
218
  return this;
@@ -284,14 +291,15 @@ export class Tabs extends BaseComponent<TabsState> {
284
291
  tabPanel.style.display = 'none';
285
292
  }
286
293
 
294
+ // ✅ Append panel to DOM FIRST
295
+ tabPanels.appendChild(tabPanel);
296
+
297
+ // ✅ THEN render content into it
287
298
  if (typeof tab.content === 'string') {
288
299
  tabPanel.innerHTML = tab.content;
289
300
  } else if (tab.content instanceof BaseComponent) {
290
- tabPanel.innerHTML = tab.content.render(tabPanel.id).container?.outerHTML || '';
291
- } else {
292
- tabPanel.innerHTML = '';
301
+ tab.content.render(`#${tabPanel.id}`);
293
302
  }
294
- tabPanels.appendChild(tabPanel);
295
303
  });
296
304
 
297
305
  wrapper.appendChild(tabList);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "juxscript",
3
- "version": "1.1.36",
3
+ "version": "1.1.38",
4
4
  "type": "module",
5
5
  "description": "A JavaScript UX authorship platform",
6
6
  "main": "index.js",