@idds/js 1.0.52 → 1.0.54

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 (3) hide show
  1. package/dist/index.iife.js +151 -88
  2. package/dist/index.js +151 -88
  3. package/package.json +1 -1
package/dist/index.iife.js CHANGED
@@ -82,103 +82,166 @@ var InaUI = (() => {
82
82
  });
83
83
  }
84
84
 
85
- // src/js/components/stateless/accordion.js
86
- function initAccordion(rootSelector = `.${PREFIX}-accordion-group`) {
87
- const accordionGroups = document.querySelectorAll(rootSelector);
88
- console.log(
89
- "[InaUI] initAccordion called. Selector:",
90
- rootSelector,
91
- "Found groups:",
92
- accordionGroups.length
93
- );
94
- accordionGroups.forEach((group) => {
95
- const isMultiple = group.getAttribute("data-multiple-open") === "true" || group.getAttribute("data-behavior") === "multiple";
96
- const accordions = group.querySelectorAll(`:scope > .${PREFIX}-accordion`);
97
- console.log("[InaUI] Found direct accordions in group:", accordions.length);
98
- accordions.forEach((accordion, _index) => {
99
- const toggle = accordion.querySelector(`.${PREFIX}-accordion__toggle`);
100
- const body = accordion.querySelector(`.${PREFIX}-accordion__content`);
101
- if (!toggle || !body) {
102
- console.warn(
103
- "[InaUI] Accordion item missing toggle or body",
104
- accordion
105
- );
106
- return;
85
+ // src/js/components/stateless/accordion-group.js
86
+ var AccordionGroup = class {
87
+ constructor(element) {
88
+ this.element = element;
89
+ this.items = /* @__PURE__ */ new Map();
90
+ this.itemsArray = [];
91
+ this.isMultiple = element.getAttribute("data-multiple-open") === "true" || element.getAttribute("data-behavior") === "multiple";
92
+ this.openIndexes = [];
93
+ this.element.__inaAccordionGroup = this;
94
+ }
95
+ registerItem(item) {
96
+ const index = this.items.size;
97
+ this.items.set(item.id, index);
98
+ this.itemsArray.push(item);
99
+ if (item.defaultOpen) {
100
+ if (this.isMultiple) {
101
+ if (!this.openIndexes.includes(index)) {
102
+ this.openIndexes.push(index);
103
+ }
104
+ } else {
105
+ if (this.openIndexes.length === 0) {
106
+ this.openIndexes.push(index);
107
+ }
107
108
  }
108
- toggle.addEventListener("click", (e) => {
109
- console.log("[InaUI] Accordion toggle clicked");
110
- e.stopPropagation();
111
- const isOpen = accordion.classList.contains(
112
- `${PREFIX}-accordion--open`
113
- );
114
- const nextState = !isOpen;
115
- if (isMultiple) {
116
- if (nextState) {
117
- openItem(accordion, toggle, body);
118
- } else {
119
- closeItem(accordion, toggle, body);
120
- }
109
+ }
110
+ return index;
111
+ }
112
+ unregisterItem(item) {
113
+ const index = this.items.get(item.id);
114
+ if (index !== void 0) {
115
+ this.items.delete(item.id);
116
+ this.itemsArray = this.itemsArray.filter((i) => i !== item);
117
+ this.openIndexes = this.openIndexes.filter((idx) => idx !== index).map((idx) => idx > index ? idx - 1 : idx);
118
+ const newMap = /* @__PURE__ */ new Map();
119
+ this.itemsArray.forEach((itm, newIdx) => {
120
+ newMap.set(itm.id, newIdx);
121
+ });
122
+ this.items = newMap;
123
+ }
124
+ }
125
+ handleItemToggle(index, isOpen) {
126
+ const prevIndexes = [...this.openIndexes];
127
+ let nextIndexes = [];
128
+ if (this.isMultiple) {
129
+ if (isOpen) {
130
+ if (!prevIndexes.includes(index)) {
131
+ nextIndexes = [...prevIndexes, index];
121
132
  } else {
122
- if (nextState) {
123
- accordions.forEach((otherAcc) => {
124
- if (otherAcc !== accordion) {
125
- const otherToggle = otherAcc.querySelector(
126
- `.${PREFIX}-accordion__toggle`
127
- );
128
- const otherBody = otherAcc.querySelector(
129
- `.${PREFIX}-accordion__content`
130
- );
131
- if (otherToggle && otherBody) {
132
- closeItem(otherAcc, otherToggle, otherBody);
133
- }
134
- }
135
- });
136
- openItem(accordion, toggle, body);
137
- } else {
138
- closeItem(accordion, toggle, body);
139
- }
133
+ nextIndexes = prevIndexes;
140
134
  }
141
- });
142
- });
143
- });
144
- const standaloneAccordions = document.querySelectorAll(
145
- `.${PREFIX}-accordion:not(.${PREFIX}-accordion-group .${PREFIX}-accordion)`
146
- );
147
- standaloneAccordions.forEach((accordion) => {
148
- const toggle = accordion.querySelector(`.${PREFIX}-accordion__toggle`);
149
- const body = accordion.querySelector(`.${PREFIX}-accordion__content`);
150
- if (!toggle || !body) return;
151
- toggle.addEventListener("click", (e) => {
152
- e.stopPropagation();
153
- const isOpen = accordion.classList.contains(`${PREFIX}-accordion--open`);
135
+ } else {
136
+ nextIndexes = prevIndexes.filter((idx) => idx !== index);
137
+ }
138
+ } else {
154
139
  if (isOpen) {
155
- closeItem(accordion, toggle, body);
140
+ nextIndexes = [index];
156
141
  } else {
157
- openItem(accordion, toggle, body);
142
+ nextIndexes = [];
158
143
  }
144
+ }
145
+ this.openIndexes = nextIndexes;
146
+ this.notifyItems();
147
+ }
148
+ isItemOpen(index) {
149
+ return this.openIndexes.includes(index);
150
+ }
151
+ getItemIndex(itemId) {
152
+ return this.items.get(itemId);
153
+ }
154
+ // Notify all children to update their visual state based on new openIndexes
155
+ notifyItems() {
156
+ this.itemsArray.forEach((item, index) => {
157
+ const isOpen = this.openIndexes.includes(index);
158
+ item.setOpenState(isOpen);
159
159
  });
160
- });
161
- }
162
- function openItem(accordion, toggle, body) {
163
- accordion.classList.add(`${PREFIX}-accordion--open`);
164
- toggle.setAttribute("aria-expanded", "true");
165
- const icon = toggle.querySelector(`.${PREFIX}-accordion__icon`);
166
- if (icon) icon.classList.add(`${PREFIX}-accordion__icon--open`);
167
- body.classList.add(`${PREFIX}-accordion__content--open`);
168
- if (body) {
169
- console.log("[InaUI] Setting maxHeight to", body.scrollHeight);
170
- body.style.maxHeight = `${body.scrollHeight}px`;
171
160
  }
172
- }
173
- function closeItem(accordion, toggle, body) {
174
- accordion.classList.remove(`${PREFIX}-accordion--open`);
175
- toggle.setAttribute("aria-expanded", "false");
176
- const icon = toggle.querySelector(`.${PREFIX}-accordion__icon`);
177
- if (icon) icon.classList.remove(`${PREFIX}-accordion__icon--open`);
178
- body.classList.remove(`${PREFIX}-accordion__content--open`);
179
- if (body) {
180
- body.style.maxHeight = null;
161
+ };
162
+
163
+ // src/js/components/stateless/accordion.js
164
+ var Accordion = class {
165
+ constructor(element) {
166
+ this.element = element;
167
+ this.toggle = element.querySelector(`.${PREFIX}-accordion__toggle`);
168
+ this.content = element.querySelector(`.${PREFIX}-accordion__content`);
169
+ this.body = element.querySelector(`.${PREFIX}-accordion__body`);
170
+ this.icon = element.querySelector(`.${PREFIX}-accordion__icon`);
171
+ if (!this.toggle || !this.content || !this.body) {
172
+ console.warn("[InaUI] Accordion missing required elements", element);
173
+ return;
174
+ }
175
+ this.id = element.id || `accordion-${Math.random().toString(36).substr(2, 9)}`;
176
+ this.defaultOpen = element.getAttribute("data-default-open") === "true" || element.classList.contains(`${PREFIX}-accordion--open`);
177
+ this.isDisabled = element.classList.contains(`${PREFIX}-accordion--disabled`) || this.toggle.hasAttribute("disabled");
178
+ this.group = this.findParentGroup();
179
+ this.index = -1;
180
+ if (this.group) {
181
+ this.index = this.group.registerItem(this);
182
+ }
183
+ this.toggle.addEventListener("click", (e) => this.handleClick(e));
184
+ if (this.group) {
185
+ const isOpen = this.group.isItemOpen(this.index);
186
+ this.setOpenState(isOpen);
187
+ } else {
188
+ this.setOpenState(this.defaultOpen);
189
+ }
181
190
  }
191
+ findParentGroup() {
192
+ let parent = this.element.parentElement;
193
+ while (parent) {
194
+ if (parent.classList.contains(`${PREFIX}-accordion-group`) && parent.__inaAccordionGroup) {
195
+ return parent.__inaAccordionGroup;
196
+ }
197
+ parent = parent.parentElement;
198
+ }
199
+ return null;
200
+ }
201
+ handleClick(e) {
202
+ if (this.isDisabled) return;
203
+ e.stopPropagation();
204
+ const isOpen = this.element.classList.contains(`${PREFIX}-accordion--open`);
205
+ const nextState = !isOpen;
206
+ if (this.group) {
207
+ this.group.handleItemToggle(this.index, nextState);
208
+ } else {
209
+ this.setOpenState(nextState);
210
+ }
211
+ }
212
+ setOpenState(isOpen) {
213
+ if (isOpen) {
214
+ this.element.classList.add(`${PREFIX}-accordion--open`);
215
+ this.toggle.setAttribute("aria-expanded", "true");
216
+ if (this.icon) this.icon.classList.add(`${PREFIX}-accordion__icon--open`);
217
+ this.content.classList.add(`${PREFIX}-accordion__content--open`);
218
+ this.body.classList.add(`${PREFIX}-accordion__body--open`);
219
+ this.body.style.maxHeight = `${this.body.scrollHeight}px`;
220
+ } else {
221
+ this.element.classList.remove(`${PREFIX}-accordion--open`);
222
+ this.toggle.setAttribute("aria-expanded", "false");
223
+ if (this.icon)
224
+ this.icon.classList.remove(`${PREFIX}-accordion__icon--open`);
225
+ this.content.classList.remove(`${PREFIX}-accordion__content--open`);
226
+ this.body.classList.remove(`${PREFIX}-accordion__body--open`);
227
+ this.body.style.maxHeight = null;
228
+ }
229
+ }
230
+ };
231
+ function initAccordion(rootSelector = `.${PREFIX}-accordion-group`) {
232
+ const accordionGroups = document.querySelectorAll(rootSelector);
233
+ accordionGroups.forEach((groupEl) => {
234
+ if (!groupEl.__inaAccordionGroup) {
235
+ new AccordionGroup(groupEl);
236
+ }
237
+ });
238
+ const accordions = document.querySelectorAll(`.${PREFIX}-accordion`);
239
+ accordions.forEach((accEl) => {
240
+ if (!accEl.__inaAccordion) {
241
+ const acc = new Accordion(accEl);
242
+ accEl.__inaAccordion = acc;
243
+ }
244
+ });
182
245
  }
183
246
 
184
247
  // src/js/components/stateful/datepicker.js
package/dist/index.js CHANGED
@@ -70,103 +70,166 @@ function initToggle(rootSelector = `.${PREFIX}-toggle`) {
70
70
  });
71
71
  }
72
72
 
73
- // src/js/components/stateless/accordion.js
74
- function initAccordion(rootSelector = `.${PREFIX}-accordion-group`) {
75
- const accordionGroups = document.querySelectorAll(rootSelector);
76
- console.log(
77
- "[InaUI] initAccordion called. Selector:",
78
- rootSelector,
79
- "Found groups:",
80
- accordionGroups.length
81
- );
82
- accordionGroups.forEach((group) => {
83
- const isMultiple = group.getAttribute("data-multiple-open") === "true" || group.getAttribute("data-behavior") === "multiple";
84
- const accordions = group.querySelectorAll(`:scope > .${PREFIX}-accordion`);
85
- console.log("[InaUI] Found direct accordions in group:", accordions.length);
86
- accordions.forEach((accordion, _index) => {
87
- const toggle = accordion.querySelector(`.${PREFIX}-accordion__toggle`);
88
- const body = accordion.querySelector(`.${PREFIX}-accordion__content`);
89
- if (!toggle || !body) {
90
- console.warn(
91
- "[InaUI] Accordion item missing toggle or body",
92
- accordion
93
- );
94
- return;
73
+ // src/js/components/stateless/accordion-group.js
74
+ var AccordionGroup = class {
75
+ constructor(element) {
76
+ this.element = element;
77
+ this.items = /* @__PURE__ */ new Map();
78
+ this.itemsArray = [];
79
+ this.isMultiple = element.getAttribute("data-multiple-open") === "true" || element.getAttribute("data-behavior") === "multiple";
80
+ this.openIndexes = [];
81
+ this.element.__inaAccordionGroup = this;
82
+ }
83
+ registerItem(item) {
84
+ const index = this.items.size;
85
+ this.items.set(item.id, index);
86
+ this.itemsArray.push(item);
87
+ if (item.defaultOpen) {
88
+ if (this.isMultiple) {
89
+ if (!this.openIndexes.includes(index)) {
90
+ this.openIndexes.push(index);
91
+ }
92
+ } else {
93
+ if (this.openIndexes.length === 0) {
94
+ this.openIndexes.push(index);
95
+ }
95
96
  }
96
- toggle.addEventListener("click", (e) => {
97
- console.log("[InaUI] Accordion toggle clicked");
98
- e.stopPropagation();
99
- const isOpen = accordion.classList.contains(
100
- `${PREFIX}-accordion--open`
101
- );
102
- const nextState = !isOpen;
103
- if (isMultiple) {
104
- if (nextState) {
105
- openItem(accordion, toggle, body);
106
- } else {
107
- closeItem(accordion, toggle, body);
108
- }
97
+ }
98
+ return index;
99
+ }
100
+ unregisterItem(item) {
101
+ const index = this.items.get(item.id);
102
+ if (index !== void 0) {
103
+ this.items.delete(item.id);
104
+ this.itemsArray = this.itemsArray.filter((i) => i !== item);
105
+ this.openIndexes = this.openIndexes.filter((idx) => idx !== index).map((idx) => idx > index ? idx - 1 : idx);
106
+ const newMap = /* @__PURE__ */ new Map();
107
+ this.itemsArray.forEach((itm, newIdx) => {
108
+ newMap.set(itm.id, newIdx);
109
+ });
110
+ this.items = newMap;
111
+ }
112
+ }
113
+ handleItemToggle(index, isOpen) {
114
+ const prevIndexes = [...this.openIndexes];
115
+ let nextIndexes = [];
116
+ if (this.isMultiple) {
117
+ if (isOpen) {
118
+ if (!prevIndexes.includes(index)) {
119
+ nextIndexes = [...prevIndexes, index];
109
120
  } else {
110
- if (nextState) {
111
- accordions.forEach((otherAcc) => {
112
- if (otherAcc !== accordion) {
113
- const otherToggle = otherAcc.querySelector(
114
- `.${PREFIX}-accordion__toggle`
115
- );
116
- const otherBody = otherAcc.querySelector(
117
- `.${PREFIX}-accordion__content`
118
- );
119
- if (otherToggle && otherBody) {
120
- closeItem(otherAcc, otherToggle, otherBody);
121
- }
122
- }
123
- });
124
- openItem(accordion, toggle, body);
125
- } else {
126
- closeItem(accordion, toggle, body);
127
- }
121
+ nextIndexes = prevIndexes;
128
122
  }
129
- });
130
- });
131
- });
132
- const standaloneAccordions = document.querySelectorAll(
133
- `.${PREFIX}-accordion:not(.${PREFIX}-accordion-group .${PREFIX}-accordion)`
134
- );
135
- standaloneAccordions.forEach((accordion) => {
136
- const toggle = accordion.querySelector(`.${PREFIX}-accordion__toggle`);
137
- const body = accordion.querySelector(`.${PREFIX}-accordion__content`);
138
- if (!toggle || !body) return;
139
- toggle.addEventListener("click", (e) => {
140
- e.stopPropagation();
141
- const isOpen = accordion.classList.contains(`${PREFIX}-accordion--open`);
123
+ } else {
124
+ nextIndexes = prevIndexes.filter((idx) => idx !== index);
125
+ }
126
+ } else {
142
127
  if (isOpen) {
143
- closeItem(accordion, toggle, body);
128
+ nextIndexes = [index];
144
129
  } else {
145
- openItem(accordion, toggle, body);
130
+ nextIndexes = [];
146
131
  }
132
+ }
133
+ this.openIndexes = nextIndexes;
134
+ this.notifyItems();
135
+ }
136
+ isItemOpen(index) {
137
+ return this.openIndexes.includes(index);
138
+ }
139
+ getItemIndex(itemId) {
140
+ return this.items.get(itemId);
141
+ }
142
+ // Notify all children to update their visual state based on new openIndexes
143
+ notifyItems() {
144
+ this.itemsArray.forEach((item, index) => {
145
+ const isOpen = this.openIndexes.includes(index);
146
+ item.setOpenState(isOpen);
147
147
  });
148
- });
149
- }
150
- function openItem(accordion, toggle, body) {
151
- accordion.classList.add(`${PREFIX}-accordion--open`);
152
- toggle.setAttribute("aria-expanded", "true");
153
- const icon = toggle.querySelector(`.${PREFIX}-accordion__icon`);
154
- if (icon) icon.classList.add(`${PREFIX}-accordion__icon--open`);
155
- body.classList.add(`${PREFIX}-accordion__content--open`);
156
- if (body) {
157
- console.log("[InaUI] Setting maxHeight to", body.scrollHeight);
158
- body.style.maxHeight = `${body.scrollHeight}px`;
159
148
  }
160
- }
161
- function closeItem(accordion, toggle, body) {
162
- accordion.classList.remove(`${PREFIX}-accordion--open`);
163
- toggle.setAttribute("aria-expanded", "false");
164
- const icon = toggle.querySelector(`.${PREFIX}-accordion__icon`);
165
- if (icon) icon.classList.remove(`${PREFIX}-accordion__icon--open`);
166
- body.classList.remove(`${PREFIX}-accordion__content--open`);
167
- if (body) {
168
- body.style.maxHeight = null;
149
+ };
150
+
151
+ // src/js/components/stateless/accordion.js
152
+ var Accordion = class {
153
+ constructor(element) {
154
+ this.element = element;
155
+ this.toggle = element.querySelector(`.${PREFIX}-accordion__toggle`);
156
+ this.content = element.querySelector(`.${PREFIX}-accordion__content`);
157
+ this.body = element.querySelector(`.${PREFIX}-accordion__body`);
158
+ this.icon = element.querySelector(`.${PREFIX}-accordion__icon`);
159
+ if (!this.toggle || !this.content || !this.body) {
160
+ console.warn("[InaUI] Accordion missing required elements", element);
161
+ return;
162
+ }
163
+ this.id = element.id || `accordion-${Math.random().toString(36).substr(2, 9)}`;
164
+ this.defaultOpen = element.getAttribute("data-default-open") === "true" || element.classList.contains(`${PREFIX}-accordion--open`);
165
+ this.isDisabled = element.classList.contains(`${PREFIX}-accordion--disabled`) || this.toggle.hasAttribute("disabled");
166
+ this.group = this.findParentGroup();
167
+ this.index = -1;
168
+ if (this.group) {
169
+ this.index = this.group.registerItem(this);
170
+ }
171
+ this.toggle.addEventListener("click", (e) => this.handleClick(e));
172
+ if (this.group) {
173
+ const isOpen = this.group.isItemOpen(this.index);
174
+ this.setOpenState(isOpen);
175
+ } else {
176
+ this.setOpenState(this.defaultOpen);
177
+ }
169
178
  }
179
+ findParentGroup() {
180
+ let parent = this.element.parentElement;
181
+ while (parent) {
182
+ if (parent.classList.contains(`${PREFIX}-accordion-group`) && parent.__inaAccordionGroup) {
183
+ return parent.__inaAccordionGroup;
184
+ }
185
+ parent = parent.parentElement;
186
+ }
187
+ return null;
188
+ }
189
+ handleClick(e) {
190
+ if (this.isDisabled) return;
191
+ e.stopPropagation();
192
+ const isOpen = this.element.classList.contains(`${PREFIX}-accordion--open`);
193
+ const nextState = !isOpen;
194
+ if (this.group) {
195
+ this.group.handleItemToggle(this.index, nextState);
196
+ } else {
197
+ this.setOpenState(nextState);
198
+ }
199
+ }
200
+ setOpenState(isOpen) {
201
+ if (isOpen) {
202
+ this.element.classList.add(`${PREFIX}-accordion--open`);
203
+ this.toggle.setAttribute("aria-expanded", "true");
204
+ if (this.icon) this.icon.classList.add(`${PREFIX}-accordion__icon--open`);
205
+ this.content.classList.add(`${PREFIX}-accordion__content--open`);
206
+ this.body.classList.add(`${PREFIX}-accordion__body--open`);
207
+ this.body.style.maxHeight = `${this.body.scrollHeight}px`;
208
+ } else {
209
+ this.element.classList.remove(`${PREFIX}-accordion--open`);
210
+ this.toggle.setAttribute("aria-expanded", "false");
211
+ if (this.icon)
212
+ this.icon.classList.remove(`${PREFIX}-accordion__icon--open`);
213
+ this.content.classList.remove(`${PREFIX}-accordion__content--open`);
214
+ this.body.classList.remove(`${PREFIX}-accordion__body--open`);
215
+ this.body.style.maxHeight = null;
216
+ }
217
+ }
218
+ };
219
+ function initAccordion(rootSelector = `.${PREFIX}-accordion-group`) {
220
+ const accordionGroups = document.querySelectorAll(rootSelector);
221
+ accordionGroups.forEach((groupEl) => {
222
+ if (!groupEl.__inaAccordionGroup) {
223
+ new AccordionGroup(groupEl);
224
+ }
225
+ });
226
+ const accordions = document.querySelectorAll(`.${PREFIX}-accordion`);
227
+ accordions.forEach((accEl) => {
228
+ if (!accEl.__inaAccordion) {
229
+ const acc = new Accordion(accEl);
230
+ accEl.__inaAccordion = acc;
231
+ }
232
+ });
170
233
  }
171
234
 
172
235
  // src/js/components/stateful/datepicker.js
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@idds/js",
3
- "version": "1.0.52",
3
+ "version": "1.0.54",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },