@logosphere-ui/core 0.0.0-alpha.32 → 0.0.0-alpha.35

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.
package/dist/index.js CHANGED
@@ -1,49 +1,846 @@
1
- import { B as e } from "./button-Uu9oaieg.js";
2
- import { L as t } from "./badge-BJqUgXZD.js";
3
- import { C as p } from "./checkbox-g6kl2jGR.js";
4
- import { F as x } from "./formfield-O327HYt0.js";
5
- import { S as L } from "./switch-DNqPqH-R.js";
6
- import { B as n } from "./breadcrumb-BB61Xt0s.js";
7
- import { C as g } from "./card-CAAhjIjf.js";
8
- import { L as d } from "./input-BUX_2G5m.js";
9
- import { P as c } from "./popover-BSfKsQni.js";
10
- import { T as B } from "./text-area-coWx4Xn-.js";
11
- import { T as b } from "./timepicker-rNyKCfN3.js";
12
- import { L as D } from "./chatbot-p4CmxSdZ.js";
13
- import { L as k } from "./calendar-B7bSuIt4.js";
14
- import { C as F } from "./combobox-CTqEZUg6.js";
15
- import { L as v } from "./datepicker-tJbIvNpy.js";
16
- import { D as A } from "./drawer-CRB8UUAo.js";
17
- import { D as j } from "./download-manager-BPg-6Qfg.js";
18
- import { L as y, a as z } from "./leftmenu-Cf2gC2J0.js";
19
- import { M as H } from "./modal-Cfa0imdF.js";
20
- import { L as K, a as N, T as O } from "./toast-container-Cb0MduXt.js";
21
- import { L as R } from "./tab-Ca_OyNqQ.js";
22
- import { T as V } from "./tree-menu-CufITiv_.js";
1
+ import { B as J } from "./button-Uu9oaieg.js";
2
+ import { L as W } from "./badge-BJqUgXZD.js";
3
+ import { C as tt } from "./checkbox-g6kl2jGR.js";
4
+ import { F as ot } from "./formfield-O327HYt0.js";
5
+ import { unsafeCSS as m, css as y, LitElement as w, html as n, nothing as d } from "lit";
6
+ import { property as s, state as S, customElement as x, query as C } from "lit/decorators.js";
7
+ import { S as rt } from "./switch-DNqPqH-R.js";
8
+ import { B as nt } from "./breadcrumb-BB61Xt0s.js";
9
+ import { C as lt } from "./card-CAAhjIjf.js";
10
+ import { L as dt } from "./input-BUX_2G5m.js";
11
+ import { P as bt } from "./pagination-BLNrwUSO.js";
12
+ import { P as ht } from "./popover-BSfKsQni.js";
13
+ import "./ui-icon-Ctn4nGFa.js";
14
+ import { createPopper as E } from "@popperjs/core";
15
+ import { T as vt } from "./text-area-coWx4Xn-.js";
16
+ import { T as ft } from "./timepicker-rNyKCfN3.js";
17
+ import { L as yt } from "./chatbot-p4CmxSdZ.js";
18
+ import { L as xt } from "./calendar-B7bSuIt4.js";
19
+ import { C as kt } from "./combobox-CTqEZUg6.js";
20
+ import { L as Ct } from "./datepicker-tJbIvNpy.js";
21
+ import { D as Et } from "./drawer-CRB8UUAo.js";
22
+ import { D as Dt } from "./download-manager-BPg-6Qfg.js";
23
+ import { L as Ot, a as Bt } from "./leftmenu-Cf2gC2J0.js";
24
+ import { M as Mt } from "./modal-Cfa0imdF.js";
25
+ import { L as It, a as jt, T as Ft } from "./toast-container-Cb0MduXt.js";
26
+ import { L as Kt } from "./tab-Ca_OyNqQ.js";
27
+ import { T as qt } from "./tree-menu-CufITiv_.js";
28
+ const z = ':host{display:block}.slider{position:relative;width:100%;font-family:var(--font-family-base)}.slider--has-tooltip .slider__track-area{margin-top:var(--spacing-8)}.slider__track-area{position:relative;height:20px;display:flex;align-items:center}.slider__track{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);height:6px;border-radius:var(--radius-full);background:var(--color-border);pointer-events:none}.slider__fill{position:absolute;top:50%;transform:translateY(-50%);height:6px;border-radius:var(--radius-full);background:var(--color-primary);pointer-events:none}.slider__input{position:absolute;top:50%;transform:translateY(-50%);left:0;width:100%;height:6px;margin:0;padding:0;-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer;pointer-events:none;outline:none}.slider__input::-webkit-slider-runnable-track{background:transparent;height:6px}.slider__input::-moz-range-track{background:transparent;height:6px}.slider__input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;margin-top:-5px;border-radius:50%;background:var(--color-body-bg);border:2px solid var(--color-border);pointer-events:all;cursor:pointer;box-shadow:var(--shadow-sm)}.slider__input::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--color-body-bg);border:2px solid var(--color-border);pointer-events:all;cursor:pointer;box-shadow:var(--shadow-sm)}.slider__input:not(:disabled):focus-visible::-webkit-slider-thumb{outline:none;box-shadow:0 0 0 4px var(--color-primary-bg-subtle)}.slider__input:not(:disabled):focus-visible::-moz-range-thumb{box-shadow:0 0 0 4px var(--color-primary-bg-subtle)}.slider--disabled .slider__track{background:var(--color-border)}.slider--disabled .slider__fill{background:var(--color-primary-disabled)}.slider--disabled .slider__input{cursor:not-allowed}.slider--disabled .slider__input::-webkit-slider-thumb{background:var(--color-body-bg);border-color:var(--color-border);pointer-events:all;cursor:not-allowed;box-shadow:none}.slider--disabled .slider__input::-moz-range-thumb{background:var(--color-body-bg);border-color:var(--color-secondary-disabled);cursor:not-allowed;box-shadow:none}.slider--disabled .slider__scale-item{color:var(--color-secondary-disabled)}.slider--disabled .slider__scale-item:before{background:var(--color-secondary-disabled)}.slider--disabled .slider__tooltip{color:var(--color-secondary-disabled);border-color:var(--color-secondary-disabled)}.slider__tooltip{position:absolute;top:-34px;transform:translate(-50%);background:var(--color-body-bg);border:1px solid var(--color-border);color:var(--color-body-color);padding:var(--spacing-1) var(--spacing-2);border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);font-family:var(--font-family-base);white-space:nowrap;pointer-events:none;z-index:var(--z-index-tooltip);line-height:var(--line-height-normal)}.slider__scale{position:relative;height:26px;margin-top:var(--spacing-1)}.slider__scale-item{position:absolute;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:var(--spacing-1);font-size:var(--font-size-xs);color:var(--color-tertiary);font-family:var(--font-family-base);font-weight:var(--font-weight-regular);white-space:nowrap;line-height:1;-webkit-user-select:none;user-select:none}.slider__scale-item:before{content:"";display:block;width:1px;height:6px;background:var(--color-border);flex-shrink:0}.slider__input--start,.slider__input--end{position:absolute;pointer-events:none}.slider__input--start::-webkit-slider-thumb,.slider__input--end::-webkit-slider-thumb{pointer-events:all}.slider__input--start::-moz-range-thumb,.slider__input--end::-moz-range-thumb{pointer-events:all}';
29
+ var D = Object.defineProperty, L = Object.getOwnPropertyDescriptor, c = (t, e, o, r) => {
30
+ for (var i = r > 1 ? void 0 : r ? L(e, o) : e, a = t.length - 1, l; a >= 0; a--)
31
+ (l = t[a]) && (i = (r ? l(e, o, i) : l(i)) || i);
32
+ return r && i && D(e, o, i), i;
33
+ };
34
+ let p = class extends w {
35
+ constructor() {
36
+ super(...arguments), this.value = 50, this.min = 0, this.max = 100, this.step = 1, this.disabled = !1, this.range = !1, this.rangeStart = 25, this.rangeEnd = 75, this.minDistance = 0, this.tooltip = "never", this.showScale = !1, this.percentage = !1, this.labels = [], this._hoverStart = !1, this._hoverEnd = !1;
37
+ }
38
+ // ── Computed helpers ─────────────────────────────────────────────────────────
39
+ get _isLabeled() {
40
+ return this.labels.length > 0;
41
+ }
42
+ get _effectiveStep() {
43
+ return this._isLabeled && this.labels.length > 1 ? (this.max - this.min) / (this.labels.length - 1) : this.step;
44
+ }
45
+ get _valuePct() {
46
+ return (this.value - this.min) / (this.max - this.min) * 100;
47
+ }
48
+ get _startPct() {
49
+ return (this.rangeStart - this.min) / (this.max - this.min) * 100;
50
+ }
51
+ get _endPct() {
52
+ return (this.rangeEnd - this.min) / (this.max - this.min) * 100;
53
+ }
54
+ get _displayValue() {
55
+ if (this._isLabeled) {
56
+ const t = Math.round((this.value - this.min) / this._effectiveStep);
57
+ return this.labels[Math.min(t, this.labels.length - 1)] ?? String(this.value);
58
+ }
59
+ return this.percentage ? `${Math.round(this.value)}%` : String(this.value);
60
+ }
61
+ get _displayStart() {
62
+ return this.percentage ? `${Math.round(this.rangeStart)}%` : String(this.rangeStart);
63
+ }
64
+ get _displayEnd() {
65
+ return this.percentage ? `${Math.round(this.rangeEnd)}%` : String(this.rangeEnd);
66
+ }
67
+ /** CSS left value that correctly follows the native thumb position (accounts for thumb radius offset). */
68
+ _thumbLeft(t) {
69
+ return `calc(${t}% + ${(0.5 - t / 100) * 16}px)`;
70
+ }
71
+ // ── Event handlers ───────────────────────────────────────────────────────────
72
+ _onSingleChange(t) {
73
+ const e = t.target;
74
+ this.value = Number(e.value), this._emit("change", { value: this.value });
75
+ }
76
+ _onStartChange(t) {
77
+ const e = t.target, o = Math.min(Number(e.value), this.rangeEnd - this.minDistance);
78
+ this.rangeStart = o, this._emit("change", { rangeStart: this.rangeStart, rangeEnd: this.rangeEnd });
79
+ }
80
+ _onEndChange(t) {
81
+ const e = t.target, o = Math.max(Number(e.value), this.rangeStart + this.minDistance);
82
+ this.rangeEnd = o, this._emit("change", { rangeStart: this.rangeStart, rangeEnd: this.rangeEnd });
83
+ }
84
+ _emit(t, e) {
85
+ this.dispatchEvent(new CustomEvent(t, { detail: e, bubbles: !0, composed: !0 }));
86
+ }
87
+ // ── Render parts ─────────────────────────────────────────────────────────────
88
+ _renderFill() {
89
+ return this.range ? n`
90
+ <div
91
+ class="slider__fill"
92
+ style="left: ${this._startPct}%; width: ${this._endPct - this._startPct}%"
93
+ ></div>
94
+ ` : n`<div class="slider__fill" style="width: ${this._valuePct}%"></div>`;
95
+ }
96
+ _renderTooltip(t, e, o) {
97
+ return this.tooltip === "never" ? d : this.tooltip === "hover" && !o ? d : n`
98
+ <div class="slider__tooltip" style="left: ${this._thumbLeft(e)}">${t}</div>
99
+ `;
100
+ }
101
+ _renderScale() {
102
+ if (!this.showScale) return d;
103
+ const t = this.max - this.min, e = Math.min(Math.round(t / this.step) + 1, 11), o = Array.from({ length: e }, (r, i) => {
104
+ const a = e > 1 ? i / (e - 1) * 100 : 0, l = this.min + a / 100 * t, P = this.percentage ? `${Math.round(l)}%` : String(Math.round(l));
105
+ return { pct: a, display: P };
106
+ });
107
+ return n`
108
+ <div class="slider__scale">
109
+ ${o.map(({ pct: r, display: i }) => n`
110
+ <span class="slider__scale-item" style="left: ${this._thumbLeft(r)}">${i}</span>
111
+ `)}
112
+ </div>
113
+ `;
114
+ }
115
+ _renderLabels() {
116
+ if (!this._isLabeled) return d;
117
+ const t = this.labels.length;
118
+ return n`
119
+ <div class="slider__scale">
120
+ ${this.labels.map((e, o) => {
121
+ const r = t > 1 ? o / (t - 1) * 100 : 0;
122
+ return n`
123
+ <span class="slider__scale-item" style="left: ${this._thumbLeft(r)}">${e}</span>
124
+ `;
125
+ })}
126
+ </div>
127
+ `;
128
+ }
129
+ _renderSingleInput() {
130
+ const t = this.tooltip === "always" || this.tooltip === "hover" && this._hoverStart;
131
+ return n`
132
+ <div class="slider__track-area">
133
+ <div class="slider__track"></div>
134
+ ${this._renderFill()}
135
+ ${this._renderTooltip(this._displayValue, this._valuePct, t)}
136
+ <input
137
+ type="range"
138
+ class="slider__input"
139
+ .value=${String(this.value)}
140
+ min=${this.min}
141
+ max=${this.max}
142
+ step=${this._effectiveStep}
143
+ ?disabled=${this.disabled}
144
+ @input=${this._onSingleChange}
145
+ @mouseenter=${() => {
146
+ this._hoverStart = !0;
147
+ }}
148
+ @mouseleave=${() => {
149
+ this._hoverStart = !1;
150
+ }}
151
+ @focus=${() => {
152
+ this._hoverStart = !0;
153
+ }}
154
+ @blur=${() => {
155
+ this._hoverStart = !1;
156
+ }}
157
+ aria-label="Slider"
158
+ aria-valuemin=${this.min}
159
+ aria-valuemax=${this.max}
160
+ aria-valuenow=${this.value}
161
+ aria-valuetext=${this._displayValue}
162
+ aria-disabled=${this.disabled}
163
+ />
164
+ </div>
165
+ `;
166
+ }
167
+ _renderRangeInputs() {
168
+ const t = this.tooltip === "always" || this.tooltip === "hover" && this._hoverStart, e = this.tooltip === "always" || this.tooltip === "hover" && this._hoverEnd, o = this._startPct >= 100 ? 4 : 3, r = this._startPct >= 100 ? 3 : 4;
169
+ return n`
170
+ <div class="slider__track-area">
171
+ <div class="slider__track"></div>
172
+ ${this._renderFill()}
173
+ ${this._renderTooltip(this._displayStart, this._startPct, t)}
174
+ ${this._renderTooltip(this._displayEnd, this._endPct, e)}
175
+ <input
176
+ type="range"
177
+ class="slider__input slider__input--start"
178
+ style="z-index: ${o}"
179
+ .value=${String(this.rangeStart)}
180
+ min=${this.min}
181
+ max=${this.max}
182
+ step=${this._effectiveStep}
183
+ ?disabled=${this.disabled}
184
+ @input=${this._onStartChange}
185
+ @mouseenter=${() => {
186
+ this._hoverStart = !0;
187
+ }}
188
+ @mouseleave=${() => {
189
+ this._hoverStart = !1;
190
+ }}
191
+ @focus=${() => {
192
+ this._hoverStart = !0;
193
+ }}
194
+ @blur=${() => {
195
+ this._hoverStart = !1;
196
+ }}
197
+ aria-label="Range start"
198
+ aria-valuemin=${this.min}
199
+ aria-valuemax=${this.max}
200
+ aria-valuenow=${this.rangeStart}
201
+ aria-valuetext=${this._displayStart}
202
+ aria-disabled=${this.disabled}
203
+ />
204
+ <input
205
+ type="range"
206
+ class="slider__input slider__input--end"
207
+ style="z-index: ${r}"
208
+ .value=${String(this.rangeEnd)}
209
+ min=${this.min}
210
+ max=${this.max}
211
+ step=${this._effectiveStep}
212
+ ?disabled=${this.disabled}
213
+ @input=${this._onEndChange}
214
+ @mouseenter=${() => {
215
+ this._hoverEnd = !0;
216
+ }}
217
+ @mouseleave=${() => {
218
+ this._hoverEnd = !1;
219
+ }}
220
+ @focus=${() => {
221
+ this._hoverEnd = !0;
222
+ }}
223
+ @blur=${() => {
224
+ this._hoverEnd = !1;
225
+ }}
226
+ aria-label="Range end"
227
+ aria-valuemin=${this.min}
228
+ aria-valuemax=${this.max}
229
+ aria-valuenow=${this.rangeEnd}
230
+ aria-valuetext=${this._displayEnd}
231
+ aria-disabled=${this.disabled}
232
+ />
233
+ </div>
234
+ `;
235
+ }
236
+ render() {
237
+ const t = this.tooltip !== "never", e = this.showScale || this._isLabeled;
238
+ return n`
239
+ <div
240
+ class="slider
241
+ ${this.disabled ? "slider--disabled" : ""}
242
+ ${t ? "slider--has-tooltip" : ""}
243
+ ${e ? "slider--has-below" : ""}
244
+ "
245
+ role="presentation"
246
+ >
247
+ ${this.range ? this._renderRangeInputs() : this._renderSingleInput()}
248
+ ${this._renderScale()}
249
+ ${this._renderLabels()}
250
+ </div>
251
+ `;
252
+ }
253
+ };
254
+ p.styles = [y`${m(z)}`];
255
+ c([
256
+ s({ type: Number })
257
+ ], p.prototype, "value", 2);
258
+ c([
259
+ s({ type: Number })
260
+ ], p.prototype, "min", 2);
261
+ c([
262
+ s({ type: Number })
263
+ ], p.prototype, "max", 2);
264
+ c([
265
+ s({ type: Number })
266
+ ], p.prototype, "step", 2);
267
+ c([
268
+ s({ type: Boolean })
269
+ ], p.prototype, "disabled", 2);
270
+ c([
271
+ s({ type: Boolean })
272
+ ], p.prototype, "range", 2);
273
+ c([
274
+ s({ type: Number })
275
+ ], p.prototype, "rangeStart", 2);
276
+ c([
277
+ s({ type: Number })
278
+ ], p.prototype, "rangeEnd", 2);
279
+ c([
280
+ s({ type: Number })
281
+ ], p.prototype, "minDistance", 2);
282
+ c([
283
+ s({ type: String })
284
+ ], p.prototype, "tooltip", 2);
285
+ c([
286
+ s({ type: Boolean })
287
+ ], p.prototype, "showScale", 2);
288
+ c([
289
+ s({ type: Boolean })
290
+ ], p.prototype, "percentage", 2);
291
+ c([
292
+ s({ type: Array })
293
+ ], p.prototype, "labels", 2);
294
+ c([
295
+ S()
296
+ ], p.prototype, "_hoverStart", 2);
297
+ c([
298
+ S()
299
+ ], p.prototype, "_hoverEnd", 2);
300
+ p = c([
301
+ x("logosphere-slider")
302
+ ], p);
303
+ const O = ":host{display:block}.stepper{display:flex;font-family:var(--font-family-base)}.stepper--horizontal{flex-direction:row;align-items:flex-start}.stepper--horizontal .stepper__step{display:flex;flex-direction:column;align-items:center;flex:1;position:relative;min-width:0}.stepper--horizontal .stepper__step-header{display:flex;flex-direction:column;align-items:center;width:100%;position:relative}.stepper--horizontal .stepper__connector{position:absolute;top:10px;left:calc(50% + 18px);right:calc(-50% + 18px);height:2px;z-index:0}.stepper--horizontal .stepper__labels{display:flex;flex-direction:column;align-items:center;text-align:center;margin-top:var(--spacing-2);padding:0 var(--spacing-1)}.stepper--vertical{flex-direction:column;align-items:stretch}.stepper--vertical .stepper__step{display:flex;flex-direction:column;position:relative}.stepper--vertical .stepper__step-header{display:flex;flex-direction:row;align-items:flex-start;gap:var(--spacing-3)}.stepper--vertical .stepper__labels{display:flex;flex-direction:column;padding-top:var(--spacing-1);padding-bottom:var(--spacing-4)}.stepper--vertical .stepper__connector{position:absolute;top:28px;left:9px;width:2px;bottom:0}.stepper__indicator{width:20px;height:20px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;z-index:1;transition:background-color var(--transition-speed-base) var(--transition-timing),border-color var(--transition-speed-base) var(--transition-timing)}.stepper__indicator-number{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);line-height:1}.stepper__indicator-dot{width:10px;height:10px;border-radius:var(--radius-full);background-color:var(--color-primary);flex-shrink:0}.stepper__indicator--completed{background-color:var(--color-primary);border:2px solid var(--color-primary);color:#fff}.stepper__indicator--current{background-color:var(--color-body-bg);border:2px solid var(--color-primary)}.stepper__indicator--upcoming{background-color:var(--color-body-bg);border:2px solid var(--color-border);color:var(--color-tertiary)}.stepper__indicator--disabled{background-color:var(--color-light-bg);border:2px solid var(--color-secondary-disabled);color:var(--color-secondary-disabled)}.stepper__connector--completed{background-color:var(--color-primary)}.stepper__connector--upcoming{background-color:var(--color-border)}.stepper__title{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-tight);color:var(--color-body-color);white-space:nowrap}.stepper__description{font-size:var(--font-size-xs);font-weight:var(--font-weight-regular);line-height:var(--line-height-normal);color:var(--color-tertiary);margin-top:var(--spacing-0-5);white-space:normal}.stepper__step--current .stepper__title{color:var(--color-primary);font-weight:var(--font-weight-semibold)}.stepper__step--upcoming .stepper__title{color:var(--color-tertiary)}.stepper__step--disabled .stepper__title,.stepper__step--disabled .stepper__description{color:var(--color-secondary-disabled)}.stepper__step--clickable{cursor:pointer}.stepper__step--clickable:hover .stepper__indicator--upcoming,.stepper__step--clickable:hover .stepper__indicator--completed{box-shadow:0 0 0 4px var(--color-primary-bg-subtle)}.stepper__step--clickable:focus-visible{outline:none}.stepper__step--clickable:focus-visible .stepper__indicator{box-shadow:0 0 0 4px var(--color-primary-bg-subtle)}";
304
+ var B = Object.defineProperty, T = Object.getOwnPropertyDescriptor, $ = (t, e, o, r) => {
305
+ for (var i = r > 1 ? void 0 : r ? T(e, o) : e, a = t.length - 1, l; a >= 0; a--)
306
+ (l = t[a]) && (i = (r ? l(e, o, i) : l(i)) || i);
307
+ return r && i && B(e, o, i), i;
308
+ };
309
+ let f = class extends w {
310
+ constructor() {
311
+ super(...arguments), this.steps = [], this.activeStep = 0, this.orientation = "horizontal", this.clickable = !1;
312
+ }
313
+ // ── Computed state ──────────────────────────────────────────────────────────
314
+ _resolveState(t, e) {
315
+ return t.state ? t.state : t.disabled ? "disabled" : e < this.activeStep ? "completed" : e === this.activeStep ? "current" : "upcoming";
316
+ }
317
+ // ── Event handlers ──────────────────────────────────────────────────────────
318
+ _onStepClick(t, e) {
319
+ !this.clickable || e === "disabled" || e === "upcoming" || (this.activeStep = t, this.dispatchEvent(
320
+ new CustomEvent("step-change", {
321
+ detail: { index: t, step: this.steps[t] },
322
+ bubbles: !0,
323
+ composed: !0
324
+ })
325
+ ));
326
+ }
327
+ _onStepKeydown(t, e, o) {
328
+ (t.key === "Enter" || t.key === " ") && (t.preventDefault(), this._onStepClick(e, o)), (t.key === "ArrowRight" || t.key === "ArrowDown") && (t.preventDefault(), this._focusStep(e + 1)), (t.key === "ArrowLeft" || t.key === "ArrowUp") && (t.preventDefault(), this._focusStep(e - 1));
329
+ }
330
+ _focusStep(t) {
331
+ const e = Math.max(0, Math.min(this.steps.length - 1, t));
332
+ this.shadowRoot?.querySelector(
333
+ `[data-step-index="${e}"]`
334
+ )?.focus();
335
+ }
336
+ // ── Render helpers ──────────────────────────────────────────────────────────
337
+ _renderIndicator(t, e) {
338
+ let o;
339
+ return t === "completed" ? o = n`<ui-icon name="uil-check" size="12"></ui-icon>` : t === "current" ? o = n`<span class="stepper__indicator-dot"></span>` : o = n`<span class="stepper__indicator-number">${e + 1}</span>`, n`
340
+ <div
341
+ class="stepper__indicator stepper__indicator--${t}"
342
+ aria-hidden="true"
343
+ >
344
+ ${o}
345
+ </div>
346
+ `;
347
+ }
348
+ _renderConnector(t, e) {
349
+ return e ? d : n`
350
+ <div
351
+ class="stepper__connector stepper__connector--${t === "completed" ? "completed" : "upcoming"}"
352
+ aria-hidden="true"
353
+ ></div>
354
+ `;
355
+ }
356
+ _renderStep(t, e) {
357
+ const o = this._resolveState(t, e), r = e === this.steps.length - 1, i = this.clickable && (o === "completed" || o === "current");
358
+ return n`
359
+ <div
360
+ class="stepper__step stepper__step--${o} ${i ? "stepper__step--clickable" : ""}"
361
+ data-step-index=${e}
362
+ role=${this.clickable ? "button" : "listitem"}
363
+ tabindex=${i ? "0" : "-1"}
364
+ aria-current=${o === "current" ? "step" : d}
365
+ aria-disabled=${o === "disabled" ? "true" : d}
366
+ aria-label="${t.title}${t.description ? `, ${t.description}` : ""}, ${o}"
367
+ @click=${() => this._onStepClick(e, o)}
368
+ @keydown=${(a) => this._onStepKeydown(a, e, o)}
369
+ >
370
+ <div class="stepper__step-header">
371
+ ${this._renderIndicator(o, e)}
372
+ ${this.orientation === "vertical" ? n`
373
+ <div class="stepper__labels">
374
+ <span class="stepper__title">${t.title}</span>
375
+ ${t.description ? n`<span class="stepper__description">${t.description}</span>` : d}
376
+ </div>
377
+ ` : d}
378
+ </div>
379
+
380
+ ${this.orientation === "horizontal" ? n`
381
+ <div class="stepper__labels">
382
+ <span class="stepper__title">${t.title}</span>
383
+ ${t.description ? n`<span class="stepper__description">${t.description}</span>` : d}
384
+ </div>
385
+ ` : d}
386
+
387
+ ${this._renderConnector(o, r)}
388
+ </div>
389
+ `;
390
+ }
391
+ render() {
392
+ return n`
393
+ <div
394
+ class="stepper stepper--${this.orientation}"
395
+ role="list"
396
+ aria-label="Progress steps"
397
+ >
398
+ ${this.steps.map((t, e) => this._renderStep(t, e))}
399
+ </div>
400
+ `;
401
+ }
402
+ };
403
+ f.styles = [y`${m(O)}`];
404
+ $([
405
+ s({ attribute: !1 })
406
+ ], f.prototype, "steps", 2);
407
+ $([
408
+ s({ type: Number })
409
+ ], f.prototype, "activeStep", 2);
410
+ $([
411
+ s({ type: String })
412
+ ], f.prototype, "orientation", 2);
413
+ $([
414
+ s({ type: Boolean })
415
+ ], f.prototype, "clickable", 2);
416
+ f = $([
417
+ x("logosphere-stepper")
418
+ ], f);
419
+ const M = ":host{display:inline-block;position:relative}.split-button{display:inline-flex;align-items:stretch;gap:1px;font-family:var(--font-family-base);border-radius:var(--radius-base);overflow:hidden}.split-button__action,.split-button__dropdown{display:inline-flex;align-items:center;justify-content:center;border:none;cursor:pointer;font-family:inherit;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);line-height:1.25rem;letter-spacing:-.14px;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:background-color var(--transition-speed-base) var(--transition-timing);outline:none}.split-button__action:focus-visible,.split-button__dropdown:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;position:relative;z-index:1}.split-button__action:disabled,.split-button__dropdown:disabled{cursor:not-allowed;pointer-events:none}.split-button__action{gap:var(--spacing-1)}.split-button__chevron{transition:transform var(--transition-speed-base) var(--transition-timing);display:inline-flex}.split-button__chevron--open{transform:rotate(180deg)}.split-button--sm .split-button__action{padding:var(--spacing-0-5) var(--spacing-2)}.split-button--sm .split-button__dropdown{padding:var(--spacing-0-5) var(--spacing-1-5)}.split-button--md .split-button__action{padding:var(--spacing-1-5) var(--spacing-3)}.split-button--md .split-button__dropdown{padding:var(--spacing-1-5) var(--spacing-2)}.split-button--lg .split-button__action{padding:var(--spacing-2-5) var(--spacing-3)}.split-button--lg .split-button__dropdown{padding:var(--spacing-2-5) var(--spacing-2)}.split-button{background-color:#fff6}.split-button--primary .split-button__action,.split-button--primary .split-button__dropdown{background-color:var(--color-primary);color:#fff}.split-button--primary .split-button__action:hover:not(:disabled),.split-button--primary .split-button__dropdown:hover:not(:disabled){background-color:var(--color-primary-hover)}.split-button--primary .split-button__action:active:not(:disabled),.split-button--primary .split-button__dropdown:active:not(:disabled){background-color:var(--color-primary-active)}.split-button--primary.split-button--disabled,.split-button--primary .split-button__action:disabled,.split-button--primary .split-button__dropdown:disabled{background-color:var(--color-primary-disabled)}.split-button--primary.split-button--disabled .split-button__action,.split-button--primary.split-button--disabled .split-button__dropdown{background-color:var(--color-primary-disabled)}.split-button--secondary .split-button__action,.split-button--secondary .split-button__dropdown{background-color:var(--color-secondary);color:#fff}.split-button--secondary .split-button__action:hover:not(:disabled),.split-button--secondary .split-button__dropdown:hover:not(:disabled){background-color:var(--color-secondary-hover)}.split-button--secondary .split-button__action:active:not(:disabled),.split-button--secondary .split-button__dropdown:active:not(:disabled){background-color:var(--color-secondary-active)}.split-button--secondary.split-button--disabled .split-button__action,.split-button--secondary.split-button--disabled .split-button__dropdown,.split-button--secondary .split-button__action:disabled,.split-button--secondary .split-button__dropdown:disabled{background-color:var(--color-secondary-disabled)}.split-button--success .split-button__action,.split-button--success .split-button__dropdown{background-color:var(--color-success);color:#fff}.split-button--success .split-button__action:hover:not(:disabled),.split-button--success .split-button__dropdown:hover:not(:disabled){background-color:var(--color-success-hover)}.split-button--success .split-button__action:active:not(:disabled),.split-button--success .split-button__dropdown:active:not(:disabled){background-color:var(--color-success-active)}.split-button--success.split-button--disabled .split-button__action,.split-button--success.split-button--disabled .split-button__dropdown,.split-button--success .split-button__action:disabled,.split-button--success .split-button__dropdown:disabled{background-color:var(--color-success-disabled)}.split-button--danger .split-button__action,.split-button--danger .split-button__dropdown{background-color:var(--color-danger);color:#fff}.split-button--danger .split-button__action:hover:not(:disabled),.split-button--danger .split-button__dropdown:hover:not(:disabled){background-color:var(--color-danger-hover)}.split-button--danger .split-button__action:active:not(:disabled),.split-button--danger .split-button__dropdown:active:not(:disabled){background-color:var(--color-danger-active)}.split-button--danger.split-button--disabled .split-button__action,.split-button--danger.split-button--disabled .split-button__dropdown,.split-button--danger .split-button__action:disabled,.split-button--danger .split-button__dropdown:disabled{background-color:var(--color-danger-disabled)}.split-button--info .split-button__action,.split-button--info .split-button__dropdown{background-color:var(--color-info);color:#fff}.split-button--info .split-button__action:hover:not(:disabled),.split-button--info .split-button__dropdown:hover:not(:disabled){background-color:var(--color-info-hover)}.split-button--info .split-button__action:active:not(:disabled),.split-button--info .split-button__dropdown:active:not(:disabled){background-color:var(--color-info-active)}.split-button--info.split-button--disabled .split-button__action,.split-button--info.split-button--disabled .split-button__dropdown,.split-button--info .split-button__action:disabled,.split-button--info .split-button__dropdown:disabled{background-color:var(--color-info-disabled)}.split-button--warning .split-button__action,.split-button--warning .split-button__dropdown{background-color:var(--color-warning);color:var(--color-warning-emphasis)}.split-button--warning .split-button__action:hover:not(:disabled),.split-button--warning .split-button__dropdown:hover:not(:disabled){background-color:var(--color-warning-hover)}.split-button--warning .split-button__action:active:not(:disabled),.split-button--warning .split-button__dropdown:active:not(:disabled){background-color:var(--color-warning-active)}.split-button--warning.split-button--disabled .split-button__action,.split-button--warning.split-button--disabled .split-button__dropdown,.split-button--warning .split-button__action:disabled,.split-button--warning .split-button__dropdown:disabled{background-color:var(--color-warning-disabled)}.split-button__panel{position:fixed;z-index:var(--z-index-dropdown);min-width:160px;background-color:var(--color-body-bg);border:1px solid var(--color-border);border-radius:var(--radius-base);box-shadow:var(--shadow-lg);padding:var(--spacing-1) 0;outline:none}.split-button__panel-item{display:flex;align-items:center;gap:var(--spacing-2);width:100%;padding:var(--spacing-2) var(--spacing-3);background:none;border:none;cursor:pointer;font-family:var(--font-family-base);font-size:var(--font-size-sm);font-weight:var(--font-weight-regular);color:var(--color-body-color);text-align:left;white-space:nowrap;transition:background-color var(--transition-speed-fast) var(--transition-timing);box-sizing:border-box}.split-button__panel-item:hover:not(:disabled){background-color:var(--color-body-bg-hover)}.split-button__panel-item:active:not(:disabled){background-color:var(--color-body-bg-active)}.split-button__panel-item--disabled,.split-button__panel-item:disabled{color:var(--color-secondary-disabled);cursor:not-allowed;pointer-events:none}.split-button__panel-divider{height:1px;background-color:var(--color-border);margin:var(--spacing-1) 0}";
420
+ var A = Object.defineProperty, I = Object.getOwnPropertyDescriptor, _ = (t, e, o, r) => {
421
+ for (var i = r > 1 ? void 0 : r ? I(e, o) : e, a = t.length - 1, l; a >= 0; a--)
422
+ (l = t[a]) && (i = (r ? l(e, o, i) : l(i)) || i);
423
+ return r && i && A(e, o, i), i;
424
+ };
425
+ let b = class extends w {
426
+ constructor() {
427
+ super(...arguments), this.label = "Button", this.size = "md", this.theme = "primary", this.disabled = !1, this.dropdownDisabled = !1, this.items = [], this._open = !1, this._onDocClick = (t) => {
428
+ this._open && (t.composedPath().includes(this) || this._setOpen(!1));
429
+ }, this._onDocKeydown = (t) => {
430
+ t.key === "Escape" && this._open && this._setOpen(!1);
431
+ };
432
+ }
433
+ // ── Lifecycle ────────────────────────────────────────────────────────────
434
+ connectedCallback() {
435
+ super.connectedCallback(), document.addEventListener("click", this._onDocClick, { capture: !0 }), document.addEventListener("keydown", this._onDocKeydown);
436
+ }
437
+ disconnectedCallback() {
438
+ super.disconnectedCallback(), document.removeEventListener("click", this._onDocClick, { capture: !0 }), document.removeEventListener("keydown", this._onDocKeydown), this._destroyPopper();
439
+ }
440
+ updated(t) {
441
+ super.updated(t), t.has("_open") && (this._open ? this._initPopper() : this._destroyPopper());
442
+ }
443
+ // ── Popper ───────────────────────────────────────────────────────────────
444
+ _initPopper() {
445
+ !this._dropdownBtn || !this._panel || (this._popper = E(this._dropdownBtn, this._panel, {
446
+ placement: "bottom-end",
447
+ strategy: "fixed",
448
+ modifiers: [
449
+ { name: "offset", options: { offset: [0, 4] } },
450
+ { name: "preventOverflow", options: { padding: 8 } },
451
+ { name: "flip", options: { padding: 8 } }
452
+ ]
453
+ }));
454
+ }
455
+ _destroyPopper() {
456
+ this._popper?.destroy(), this._popper = void 0;
457
+ }
458
+ _setOpen(t) {
459
+ this._open !== t && (this._open = t, this.dispatchEvent(
460
+ new CustomEvent(t ? "dropdown-open" : "dropdown-close", {
461
+ bubbles: !0,
462
+ composed: !0
463
+ })
464
+ ));
465
+ }
466
+ // ── Event handlers ────────────────────────────────────────────────────────
467
+ _onActionClick(t) {
468
+ t.stopPropagation(), !this.disabled && this.dispatchEvent(new CustomEvent("action", { bubbles: !0, composed: !0 }));
469
+ }
470
+ _onDropdownClick(t) {
471
+ t.stopPropagation(), !(this.disabled || this.dropdownDisabled) && this._setOpen(!this._open);
472
+ }
473
+ _onItemClick(t) {
474
+ t.disabled || (this.dispatchEvent(
475
+ new CustomEvent("item-select", {
476
+ detail: { value: t.value, item: t },
477
+ bubbles: !0,
478
+ composed: !0
479
+ })
480
+ ), this._setOpen(!1));
481
+ }
482
+ _onKeydown(t, e) {
483
+ (t.key === "Enter" || t.key === " ") && (t.preventDefault(), e === "action" ? this._onActionClick(t) : this._onDropdownClick(t));
484
+ }
485
+ // ── Render ────────────────────────────────────────────────────────────────
486
+ _renderPanel() {
487
+ if (!this._open) return d;
488
+ const t = this.items.length > 0;
489
+ return n`
490
+ <div
491
+ class="split-button__panel"
492
+ role="menu"
493
+ aria-label="${this.label} options"
494
+ >
495
+ ${t ? this.items.map((e) => n`
496
+ ${e.divider ? n`<div class="split-button__panel-divider" role="separator"></div>` : d}
497
+ <button
498
+ class="split-button__panel-item ${e.disabled ? "split-button__panel-item--disabled" : ""}"
499
+ role="menuitem"
500
+ ?disabled=${e.disabled}
501
+ @click=${() => this._onItemClick(e)}
502
+ >
503
+ ${e.icon ? n`<ui-icon name=${e.icon} size="16"></ui-icon>` : d}
504
+ <span>${e.label}</span>
505
+ </button>
506
+ `) : n`<slot name="dropdown"></slot>`}
507
+ </div>
508
+ `;
509
+ }
510
+ render() {
511
+ const t = this.disabled, e = this.disabled || this.dropdownDisabled;
512
+ return n`
513
+ <div
514
+ class="split-button split-button--${this.size} split-button--${this.theme}
515
+ ${this.disabled ? "split-button--disabled" : ""}
516
+ ${this._open ? "split-button--open" : ""}"
517
+ role="group"
518
+ >
519
+ <!-- Main action -->
520
+ <button
521
+ class="split-button__action"
522
+ ?disabled=${t}
523
+ aria-label=${this.label}
524
+ @click=${this._onActionClick}
525
+ @keydown=${(o) => this._onKeydown(o, "action")}
526
+ type="button"
527
+ >
528
+ <slot name="prefix"></slot>
529
+ <span class="split-button__label">
530
+ <slot>${this.label}</slot>
531
+ </span>
532
+ </button>
533
+
534
+ <!-- Dropdown trigger -->
535
+ <button
536
+ class="split-button__dropdown"
537
+ ?disabled=${e}
538
+ aria-label="Open dropdown"
539
+ aria-haspopup="menu"
540
+ aria-expanded=${this._open ? "true" : "false"}
541
+ @click=${this._onDropdownClick}
542
+ @keydown=${(o) => this._onKeydown(o, "dropdown")}
543
+ type="button"
544
+ >
545
+ <ui-icon
546
+ name="uil-angle-down"
547
+ size="16"
548
+ class="split-button__chevron ${this._open ? "split-button__chevron--open" : ""}"
549
+ ></ui-icon>
550
+ </button>
551
+
552
+ <!-- Dropdown panel -->
553
+ ${this._renderPanel()}
554
+ </div>
555
+ `;
556
+ }
557
+ };
558
+ b.styles = [y`${m(M)}`];
559
+ _([
560
+ s({ type: String })
561
+ ], b.prototype, "label", 2);
562
+ _([
563
+ s({ type: String })
564
+ ], b.prototype, "size", 2);
565
+ _([
566
+ s({ type: String })
567
+ ], b.prototype, "theme", 2);
568
+ _([
569
+ s({ type: Boolean })
570
+ ], b.prototype, "disabled", 2);
571
+ _([
572
+ s({ type: Boolean })
573
+ ], b.prototype, "dropdownDisabled", 2);
574
+ _([
575
+ s({ attribute: !1 })
576
+ ], b.prototype, "items", 2);
577
+ _([
578
+ S()
579
+ ], b.prototype, "_open", 2);
580
+ _([
581
+ C(".split-button__dropdown")
582
+ ], b.prototype, "_dropdownBtn", 2);
583
+ _([
584
+ C(".split-button__panel")
585
+ ], b.prototype, "_panel", 2);
586
+ b = _([
587
+ x("logosphere-split-button")
588
+ ], b);
589
+ const j = ":host{display:block}.collapse{font-family:var(--font-family-base);background-color:var(--color-body-bg);overflow:hidden}.collapse--full{border:1px solid var(--color-border);border-radius:var(--radius-base)}.collapse--bottom{border-bottom:1px solid var(--color-border);border-radius:0}.collapse__header{display:flex;align-items:center;gap:var(--spacing-4);padding:var(--spacing-4) var(--spacing-4);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color var(--transition-speed-fast) var(--transition-timing);outline:none}.collapse--small .collapse__header{padding:var(--spacing-2) var(--spacing-4)}.collapse--full .collapse__header{border-radius:calc(var(--radius-base) - 1px)}.collapse--full.collapse--expanded .collapse__header{border-radius:calc(var(--radius-base) - 1px) calc(var(--radius-base) - 1px) 0 0}.collapse--full .collapse__header:hover:not(.collapse--disabled .collapse__header){background-color:var(--color-body-bg-hover)}.collapse--bottom .collapse__header:hover:not(.collapse--disabled .collapse__header){background-color:var(--color-body-bg-hover)}.collapse__header:focus-visible{outline:2px solid var(--color-primary);outline-offset:-2px;border-radius:calc(var(--radius-base) - 1px)}.collapse__title{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);line-height:1.2;letter-spacing:-.16px;color:var(--color-body-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.collapse__header-extra:empty{display:none}.collapse__header-extra{display:flex;align-items:center;gap:var(--spacing-2);flex-shrink:0}.collapse__header-spacer{flex:1}.collapse__icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--color-secondary);transition:transform var(--transition-speed-base) var(--transition-timing)}.collapse__icon--expanded{transform:rotate(180deg)}.collapse__body{height:0;overflow:hidden;transition:height var(--transition-speed-slow) var(--transition-timing)}.collapse__body-inner{padding:0 var(--spacing-4) var(--spacing-4);font-size:var(--font-size-sm);font-weight:var(--font-weight-regular);line-height:var(--line-height-normal);color:var(--color-body-color)}.collapse--bottom .collapse__body-inner{padding-top:var(--spacing-2)}.collapse--disabled .collapse__header{cursor:not-allowed;pointer-events:none}.collapse--disabled .collapse__title,.collapse--disabled .collapse__icon{color:var(--color-secondary-disabled)}.collapse--disabled.collapse--full{border-color:var(--color-secondary-disabled);background-color:var(--color-light-bg)}.collapse--disabled.collapse--bottom{border-bottom-color:var(--color-secondary-disabled);background-color:transparent}";
590
+ var F = Object.defineProperty, N = Object.getOwnPropertyDescriptor, v = (t, e, o, r) => {
591
+ for (var i = r > 1 ? void 0 : r ? N(e, o) : e, a = t.length - 1, l; a >= 0; a--)
592
+ (l = t[a]) && (i = (r ? l(e, o, i) : l(i)) || i);
593
+ return r && i && F(e, o, i), i;
594
+ };
595
+ const k = typeof requestAnimationFrame < "u" ? requestAnimationFrame.bind(window) : (t) => setTimeout(() => t(Date.now()), 16);
596
+ let u = class extends w {
597
+ constructor() {
598
+ super(...arguments), this.title = "", this.expanded = !1, this.disabled = !1, this.iconPosition = "right", this.border = "full", this.size = "default";
599
+ }
600
+ // ── Toggle ────────────────────────────────────────────────────────────────
601
+ _toggle() {
602
+ this.disabled || (this.expanded = !this.expanded, this.dispatchEvent(
603
+ new CustomEvent("toggle", {
604
+ detail: { expanded: this.expanded },
605
+ bubbles: !0,
606
+ composed: !0
607
+ })
608
+ ));
609
+ }
610
+ _onKeydown(t) {
611
+ (t.key === "Enter" || t.key === " ") && (t.preventDefault(), this._toggle());
612
+ }
613
+ // ── Animated height ───────────────────────────────────────────────────────
614
+ /**
615
+ * CLOSING: Called inside willUpdate — BEFORE Lit re-renders — so we can
616
+ * capture and lock the current height before the CSS class is removed.
617
+ */
618
+ _lockHeightForClose() {
619
+ const t = this._body;
620
+ if (!t) return;
621
+ const e = t.getBoundingClientRect().height;
622
+ t.style.height = `${e}px`, t.style.overflow = "hidden";
623
+ }
624
+ willUpdate(t) {
625
+ super.willUpdate(t), t.has("expanded") && !this.expanded && this._lockHeightForClose();
626
+ }
627
+ updated(t) {
628
+ if (super.updated(t), !t.has("expanded") || !this._body || !this._inner) return;
629
+ const e = this._body, o = this._inner;
630
+ this.expanded ? (e.style.height = "0px", e.style.overflow = "hidden", k(() => {
631
+ k(() => {
632
+ e.style.height = `${o.scrollHeight}px`, e.addEventListener("transitionend", function r() {
633
+ e.style.height = "auto", e.style.overflow = "", e.removeEventListener("transitionend", r);
634
+ }, { once: !0 });
635
+ });
636
+ })) : (e.getBoundingClientRect(), k(() => {
637
+ k(() => {
638
+ e.style.height = "0px";
639
+ });
640
+ }));
641
+ }
642
+ // ── Render ────────────────────────────────────────────────────────────────
643
+ _renderIcon() {
644
+ return n`
645
+ <span class="collapse__icon ${this.expanded ? "collapse__icon--expanded" : ""}">
646
+ <ui-icon name="uil-angle-down" size="22"></ui-icon>
647
+ </span>
648
+ `;
649
+ }
650
+ render() {
651
+ return n`
652
+ <div
653
+ class="collapse
654
+ collapse--${this.border}
655
+ collapse--${this.size}
656
+ ${this.expanded ? "collapse--expanded" : ""}
657
+ ${this.disabled ? "collapse--disabled" : ""}"
658
+ >
659
+ <!-- Header -->
660
+ <div
661
+ class="collapse__header"
662
+ role="button"
663
+ tabindex=${this.disabled ? "-1" : "0"}
664
+ aria-expanded=${this.expanded ? "true" : "false"}
665
+ aria-disabled=${this.disabled ? "true" : d}
666
+ @click=${this._toggle}
667
+ @keydown=${this._onKeydown}
668
+ >
669
+ ${this.iconPosition === "left" ? this._renderIcon() : d}
670
+
671
+ <div class="collapse__title">
672
+ <slot name="title">${this.title}</slot>
673
+ </div>
674
+
675
+ <div class="collapse__header-extra">
676
+ <slot name="extra"></slot>
677
+ </div>
678
+
679
+ <!-- pushes extra to title side, icon stays at far right -->
680
+ <span class="collapse__header-spacer"></span>
681
+
682
+ ${this.iconPosition === "right" ? this._renderIcon() : d}
683
+ </div>
684
+
685
+ <!-- Body (animated) -->
686
+ <div class="collapse__body ${this.expanded ? "collapse__body--visible" : ""}">
687
+ <div class="collapse__body-inner">
688
+ <!-- slot="body" for explicit usage; default slot as fallback -->
689
+ <slot name="body"><slot></slot></slot>
690
+ </div>
691
+ </div>
692
+ </div>
693
+ `;
694
+ }
695
+ };
696
+ u.styles = [y`${m(j)}`];
697
+ v([
698
+ s({ type: String })
699
+ ], u.prototype, "title", 2);
700
+ v([
701
+ s({ type: Boolean, reflect: !0 })
702
+ ], u.prototype, "expanded", 2);
703
+ v([
704
+ s({ type: Boolean, reflect: !0 })
705
+ ], u.prototype, "disabled", 2);
706
+ v([
707
+ s({ type: String })
708
+ ], u.prototype, "iconPosition", 2);
709
+ v([
710
+ s({ type: String })
711
+ ], u.prototype, "border", 2);
712
+ v([
713
+ s({ type: String })
714
+ ], u.prototype, "size", 2);
715
+ v([
716
+ C(".collapse__body-inner")
717
+ ], u.prototype, "_inner", 2);
718
+ v([
719
+ C(".collapse__body")
720
+ ], u.prototype, "_body", 2);
721
+ u = v([
722
+ x("logosphere-collapse")
723
+ ], u);
724
+ const K = ":host{display:block}.accordion{display:flex;flex-direction:column}.accordion--full{gap:var(--spacing-2)}.accordion--bottom{gap:0}.accordion--full ::slotted(logosphere-collapse),.accordion--full logosphere-collapse{width:100%}";
725
+ var R = Object.defineProperty, q = Object.getOwnPropertyDescriptor, g = (t, e, o, r) => {
726
+ for (var i = r > 1 ? void 0 : r ? q(e, o) : e, a = t.length - 1, l; a >= 0; a--)
727
+ (l = t[a]) && (i = (r ? l(e, o, i) : l(i)) || i);
728
+ return r && i && R(e, o, i), i;
729
+ };
730
+ let h = class extends w {
731
+ constructor() {
732
+ super(...arguments), this.items = [], this.multiple = !1, this.defaultOpen = [], this.border = "full", this.iconPosition = "right", this.size = "default", this._openSet = /* @__PURE__ */ new Set(), this._onSlottedToggle = (t) => {
733
+ if (this.items.length > 0 || this.multiple) return;
734
+ const e = t.target;
735
+ t.detail.expanded && this.querySelectorAll("logosphere-collapse").forEach((o) => {
736
+ o !== e && o.expanded && (o.expanded = !1);
737
+ });
738
+ };
739
+ }
740
+ // ── Lifecycle ────────────────────────────────────────────────────────────
741
+ connectedCallback() {
742
+ super.connectedCallback();
743
+ const t = Array.isArray(this.defaultOpen) ? this.defaultOpen : [this.defaultOpen];
744
+ this._openSet = new Set(t), this.addEventListener("toggle", this._onSlottedToggle);
745
+ }
746
+ disconnectedCallback() {
747
+ super.disconnectedCallback(), this.removeEventListener("toggle", this._onSlottedToggle);
748
+ }
749
+ // ── Items-based mode ──────────────────────────────────────────────────────
750
+ _toggle(t) {
751
+ const e = new Set(this._openSet);
752
+ e.has(t) ? e.delete(t) : (this.multiple || e.clear(), e.add(t));
753
+ const o = this._openSet.has(t);
754
+ this._openSet = e, this.dispatchEvent(
755
+ new CustomEvent("accordion-change", {
756
+ detail: { index: t, expanded: !o, openIndices: [...this._openSet] },
757
+ bubbles: !0,
758
+ composed: !0
759
+ })
760
+ );
761
+ }
762
+ // ── Render ────────────────────────────────────────────────────────────────
763
+ render() {
764
+ return this.items.length === 0 ? n`
765
+ <div class="accordion accordion--${this.border}">
766
+ <slot></slot>
767
+ </div>
768
+ ` : n`
769
+ <div class="accordion accordion--${this.border}">
770
+ ${this.items.map((t, e) => n`
771
+ <logosphere-collapse
772
+ title=${t.title}
773
+ .expanded=${this._openSet.has(e)}
774
+ .disabled=${t.disabled ?? !1}
775
+ border=${this.border}
776
+ iconPosition=${this.iconPosition}
777
+ size=${this.size}
778
+ @toggle=${(o) => {
779
+ o.stopPropagation(), this._toggle(e);
780
+ }}
781
+ >
782
+ <span slot="body">${t.content}</span>
783
+ </logosphere-collapse>
784
+ `)}
785
+ </div>
786
+ `;
787
+ }
788
+ };
789
+ h.styles = [y`${m(K)}`];
790
+ g([
791
+ s({ attribute: !1 })
792
+ ], h.prototype, "items", 2);
793
+ g([
794
+ s({ type: Boolean })
795
+ ], h.prototype, "multiple", 2);
796
+ g([
797
+ s({ attribute: !1 })
798
+ ], h.prototype, "defaultOpen", 2);
799
+ g([
800
+ s({ type: String })
801
+ ], h.prototype, "border", 2);
802
+ g([
803
+ s({ type: String })
804
+ ], h.prototype, "iconPosition", 2);
805
+ g([
806
+ s({ type: String })
807
+ ], h.prototype, "size", 2);
808
+ g([
809
+ S()
810
+ ], h.prototype, "_openSet", 2);
811
+ h = g([
812
+ x("logosphere-accordion")
813
+ ], h);
23
814
  export {
24
- n as Breadcrumb,
25
- e as Button,
26
- g as Card,
27
- p as Checkbox,
28
- F as Combobox,
29
- j as DownloadManager,
30
- A as Drawer,
31
- x as FormField,
32
- y as LeftMenu,
33
- z as LeftMenuItemElement,
34
- t as LogosphereBadge,
35
- k as LogosphereCalendar,
36
- D as LogosphereChatBot,
37
- v as LogosphereDatePicker,
38
- d as LogosphereInput,
39
- R as LogosphereTab,
40
- K as LogosphereToast,
41
- N as LogosphereToastContainer,
42
- H as Modal,
43
- c as Popover,
44
- L as Switch,
45
- B as TextArea,
46
- b as TimePicker,
47
- O as ToastService,
48
- V as TreeMenu
815
+ h as Accordion,
816
+ nt as Breadcrumb,
817
+ J as Button,
818
+ lt as Card,
819
+ tt as Checkbox,
820
+ u as Collapse,
821
+ kt as Combobox,
822
+ Dt as DownloadManager,
823
+ Et as Drawer,
824
+ ot as FormField,
825
+ Ot as LeftMenu,
826
+ Bt as LeftMenuItemElement,
827
+ W as LogosphereBadge,
828
+ xt as LogosphereCalendar,
829
+ yt as LogosphereChatBot,
830
+ Ct as LogosphereDatePicker,
831
+ dt as LogosphereInput,
832
+ Kt as LogosphereTab,
833
+ It as LogosphereToast,
834
+ jt as LogosphereToastContainer,
835
+ Mt as Modal,
836
+ bt as Pagination,
837
+ ht as Popover,
838
+ p as Slider,
839
+ b as SplitButton,
840
+ f as Stepper,
841
+ rt as Switch,
842
+ vt as TextArea,
843
+ ft as TimePicker,
844
+ Ft as ToastService,
845
+ qt as TreeMenu
49
846
  };