@logosphere-ui/core 0.0.0-alpha.12 → 0.0.0-alpha.14

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 (77) hide show
  1. package/dist/atoms/FormField/formfield.d.ts +7 -0
  2. package/dist/{badge-DVvdodRb.cjs → badge-7IIatiRv.cjs} +1 -1
  3. package/dist/{badge-CHWTCGQG.js → badge-B2chRYGd.js} +1 -1
  4. package/dist/badge.cjs +1 -1
  5. package/dist/badge.js +1 -1
  6. package/dist/{button-BqOMevro.js → button-BFq8AmDc.js} +1 -1
  7. package/dist/{button-CDRccsk9.cjs → button-Bx870pUi.cjs} +1 -1
  8. package/dist/button.cjs +1 -1
  9. package/dist/button.js +1 -1
  10. package/dist/calendar-DF3q_dcG.cjs +88 -0
  11. package/dist/calendar-WZ_GQvnn.js +652 -0
  12. package/dist/calendar.cjs +1 -0
  13. package/dist/calendar.js +4 -0
  14. package/dist/{card-KiNHfEi2.cjs → card-BmW0sPDb.cjs} +1 -1
  15. package/dist/{card-CNoTUaJC.js → card-D0OT4Kuq.js} +1 -1
  16. package/dist/card.cjs +1 -1
  17. package/dist/card.js +1 -1
  18. package/dist/chatbot-CBDEFak3.cjs +183 -0
  19. package/dist/{chatbot-xaFF5RNV.js → chatbot-Ddl3Txqv.js} +190 -127
  20. package/dist/chatbot.cjs +1 -1
  21. package/dist/chatbot.js +1 -1
  22. package/dist/combobox-C6zoQopK.cjs +113 -0
  23. package/dist/combobox-LBU6VHLi.js +376 -0
  24. package/dist/combobox.cjs +1 -1
  25. package/dist/combobox.js +1 -1
  26. package/dist/datepicker-BLv_G9Yb.cjs +85 -0
  27. package/dist/datepicker-SwKsdw3S.js +375 -0
  28. package/dist/datepicker.cjs +1 -1
  29. package/dist/datepicker.js +1 -1
  30. package/dist/formfield-BFOIEicR.cjs +33 -0
  31. package/dist/formfield-CNh4mBSs.js +147 -0
  32. package/dist/formfield.cjs +1 -1
  33. package/dist/formfield.js +1 -1
  34. package/dist/index.cjs +1 -1
  35. package/dist/index.d.ts +3 -0
  36. package/dist/index.js +34 -27
  37. package/dist/index.umd.js +465 -232
  38. package/dist/input-JpAWN-M1.cjs +59 -0
  39. package/dist/{input-CxBP0i-3.js → input-jmbvgWEq.js} +100 -82
  40. package/dist/input.cjs +1 -1
  41. package/dist/input.js +1 -1
  42. package/dist/left-menu.cjs +1 -0
  43. package/dist/left-menu.js +5 -0
  44. package/dist/leftmenu-Bgqfmoe5.cjs +74 -0
  45. package/dist/leftmenu-GsoBxkeJ.js +291 -0
  46. package/dist/molecules/Input/input.d.ts +3 -1
  47. package/dist/molecules/Textarea/text-area.d.ts +0 -1
  48. package/dist/organisms/Calendar/calendar.d.ts +54 -0
  49. package/dist/organisms/Calendar/index.d.ts +1 -0
  50. package/dist/organisms/Calendar/shared.d.ts +9 -0
  51. package/dist/organisms/Chatbot/chatbot.d.ts +7 -0
  52. package/dist/organisms/Combobox/combobox.d.ts +16 -0
  53. package/dist/organisms/DatePicker/datepicker.d.ts +31 -31
  54. package/dist/organisms/LeftMenu/index.d.ts +2 -0
  55. package/dist/organisms/LeftMenu/leftmenu-item.d.ts +14 -0
  56. package/dist/organisms/LeftMenu/leftmenu.d.ts +44 -0
  57. package/dist/organisms/TreeMenu/index.d.ts +1 -0
  58. package/dist/organisms/TreeMenu/tree-menu.d.ts +41 -0
  59. package/dist/{text-area-eT-oCnqZ.cjs → text-area-CZDdxbrN.cjs} +5 -3
  60. package/dist/{text-area-Dw4CUBcz.js → text-area-Dec_k4rs.js} +18 -19
  61. package/dist/textarea.cjs +1 -1
  62. package/dist/textarea.js +1 -1
  63. package/dist/tree-menu-B1iwfHyd.cjs +47 -0
  64. package/dist/tree-menu-BbX8GK_z.js +154 -0
  65. package/dist/tree-menu.cjs +1 -0
  66. package/dist/tree-menu.js +4 -0
  67. package/dist/{ui-icon-ltkJROhR.js → ui-icon-Bys4HYSQ.js} +24 -18
  68. package/dist/{ui-icon-CVEyvL5D.cjs → ui-icon-DWh1MhBa.cjs} +4 -4
  69. package/package.json +16 -1
  70. package/dist/chatbot-BF4TQnlG.cjs +0 -160
  71. package/dist/combobox-CeK7yW2F.cjs +0 -99
  72. package/dist/combobox-DTUSFw9V.js +0 -270
  73. package/dist/datepicker-BQOVo1Pr.cjs +0 -115
  74. package/dist/datepicker-ChdQsc_l.js +0 -751
  75. package/dist/formfield-BOgRugzm.js +0 -118
  76. package/dist/formfield-D_7NFFoe.cjs +0 -27
  77. package/dist/input-CoY1ZcPF.cjs +0 -46
@@ -0,0 +1,375 @@
1
+ import { unsafeCSS as c, css as g, LitElement as f, nothing as _, html as d } from "lit";
2
+ import { property as a, state as l, query as u, customElement as m } from "lit/decorators.js";
3
+ import { live as y } from "lit/directives/live.js";
4
+ import { createPopper as b } from "@popperjs/core";
5
+ import "./formfield-CNh4mBSs.js";
6
+ import { s as v, D as E } from "./calendar-WZ_GQvnn.js";
7
+ import "./ui-icon-Bys4HYSQ.js";
8
+ import D from "dayjs";
9
+ const S = ".dp{display:block;position:relative;width:100%;font-family:var(--font-family-base)}.dp__field,.dp__reference{width:100%}.dp__input{width:100%;border:none;outline:none;background:transparent;font-size:var(--font-size-sm);font-family:var(--font-family-base);color:var(--color-body-text);line-height:1.5}.dp__input::placeholder{color:var(--color-tertiary)}.dp__input:disabled{cursor:not-allowed}.dp__icon-btn{border:none;background:transparent;color:var(--color-gray-400);cursor:pointer;padding:0;display:inline-flex;align-items:center;justify-content:center;line-height:1;transition:color var(--transition-speed-fast) var(--transition-timing)}.dp__icon-btn_suffix{padding-right:var(--spacing-1)}.dp__icon-btn:hover{color:var(--color-gray-600)}.dp__icon-btn:disabled{cursor:not-allowed;opacity:.5}.dp__popup{background-color:var(--color-body-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);z-index:var(--z-index-dropdown);padding:var(--spacing-4);box-sizing:border-box;overflow:hidden;max-height:calc(100vh - 16px)}";
10
+ var C = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, i = (t, e, n, s) => {
11
+ for (var o = s > 1 ? void 0 : s ? $(e, n) : e, p = t.length - 1, h; p >= 0; p--)
12
+ (h = t[p]) && (o = (s ? h(e, n, o) : h(o)) || o);
13
+ return s && o && C(e, n, o), o;
14
+ };
15
+ let w = 0;
16
+ const Y = () => `dp-${++w}`;
17
+ let r = class extends f {
18
+ constructor() {
19
+ super(...arguments), this.value = null, this.min = null, this.max = null, this.required = !1, this.disabled = !1, this.readonly = !1, this.expandFactor = 1.05, this.placeholder = "GG/AA/YYYY veya GG.AA.YYYY", this.label = "", this.helper = "", this.error = "", this.size = "default", this.variant = "default", this.rangeMode = !1, this.disabledDays = [], this.rangeStart = null, this.rangeEnd = null, this._open = !1, this._rangeStart = null, this._rangeEnd = null, this._hasError = !1, this._errorMsg = "", this._inputDraft = null, this._errorTimer = null, this.inputId = Y(), this._outsideClick = (t) => {
20
+ this._open && (t.composedPath().includes(this) || (this._parseAndSetDate(), this._toggleOpen(!1)));
21
+ }, this._openDropdown = () => {
22
+ this._toggleOpen(!0);
23
+ }, this._onBlur = () => {
24
+ this._parseAndSetDate();
25
+ };
26
+ }
27
+ willUpdate(t) {
28
+ t.has("rangeStart") && (this._rangeStart = this.rangeStart), t.has("rangeEnd") && (this._rangeEnd = this.rangeEnd), t.has("value") && !this._isInputFocused() && (this._inputDraft = null);
29
+ }
30
+ connectedCallback() {
31
+ super.connectedCallback(), window.addEventListener("click", this._outsideClick, !0);
32
+ }
33
+ disconnectedCallback() {
34
+ window.removeEventListener("click", this._outsideClick, !0), this._destroyPopper(), this._errorTimer && clearTimeout(this._errorTimer), super.disconnectedCallback();
35
+ }
36
+ updated(t) {
37
+ if (super.updated(t), t.has("_open")) {
38
+ this._open ? this._updatePopper() : this._destroyPopper();
39
+ return;
40
+ }
41
+ this._open && this._updatePopper();
42
+ }
43
+ _safeDay(t) {
44
+ return v(t);
45
+ }
46
+ _isInputFocused() {
47
+ return this.shadowRoot?.activeElement === this._inputElement;
48
+ }
49
+ _withinBounds(t) {
50
+ const e = this._safeDay(this.min), n = this._safeDay(this.max);
51
+ return !(e && t.isBefore(e, "day") || n && t.isAfter(n, "day") || this.disabledDays.includes(t.day()));
52
+ }
53
+ _displayValue() {
54
+ if (this.rangeMode && this._rangeStart && this._rangeEnd) {
55
+ const e = this._safeDay(this._rangeStart), n = this._safeDay(this._rangeEnd);
56
+ if (e && n) return `${e.format("DD/MM/YYYY")} - ${n.format("DD/MM/YYYY")}`;
57
+ }
58
+ const t = this._safeDay(this.value);
59
+ return t ? t.format("DD/MM/YYYY") : "";
60
+ }
61
+ _inputValue() {
62
+ return this._inputDraft ?? this._displayValue();
63
+ }
64
+ _emitChange(t) {
65
+ this.value = t, this.dispatchEvent(new CustomEvent("change", { detail: { value: t } })), this.onChange?.(t);
66
+ }
67
+ _emitRangeChange() {
68
+ if (!this._rangeStart || !this._rangeEnd) return;
69
+ const t = { start: this._rangeStart, end: this._rangeEnd };
70
+ this.dispatchEvent(new CustomEvent("rangeChange", { detail: t })), this.onRangeChange?.(t);
71
+ }
72
+ _showInputError(t) {
73
+ this._errorTimer && clearTimeout(this._errorTimer), this._hasError = !0, this._errorMsg = t, this._errorTimer = setTimeout(() => this._clearInputError(), 3e3);
74
+ }
75
+ _clearInputError() {
76
+ this._hasError = !1, this._errorMsg = "", this._errorTimer && (clearTimeout(this._errorTimer), this._errorTimer = null);
77
+ }
78
+ _toggleOpen(t) {
79
+ if (this.disabled) return;
80
+ const e = t ?? !this._open;
81
+ this._open = e, e && this.updateComplete.then(() => this._updatePopper());
82
+ }
83
+ _onInput(t) {
84
+ const e = t.target.value;
85
+ this._inputDraft = e, e.trim() || (this._emitChange(null), this.rangeMode && (this._rangeStart = null, this._rangeEnd = null)), this._clearInputError();
86
+ }
87
+ _parseSingleDate(t) {
88
+ for (const e of E) {
89
+ const n = D(t, e, !0);
90
+ if (n.isValid()) return n;
91
+ }
92
+ return this._safeDay(t);
93
+ }
94
+ _parseRangeInput(t) {
95
+ const e = t.split(/\s+-\s+/);
96
+ if (e.length !== 2) return null;
97
+ const n = this._parseSingleDate(e[0].trim()), s = this._parseSingleDate(e[1].trim());
98
+ return !n || !s ? null : n.isAfter(s, "day") ? { start: s, end: n } : { start: n, end: s };
99
+ }
100
+ _onKeydown(t) {
101
+ (t.key === "Tab" || t.key === "Enter") && this._parseAndSetDate();
102
+ }
103
+ _parseAndSetDate() {
104
+ const t = this._inputElement;
105
+ if (!t) return;
106
+ const e = t.value.trim();
107
+ if (!e) {
108
+ if (this.rangeMode && this._rangeStart && !this._rangeEnd) return;
109
+ this._emitChange(null), this.rangeMode && (this._rangeStart = null, this._rangeEnd = null), this._inputDraft = null;
110
+ return;
111
+ }
112
+ if (this.rangeMode) {
113
+ const s = this._parseRangeInput(e);
114
+ if (s) {
115
+ if (this._withinBounds(s.start) && this._withinBounds(s.end)) {
116
+ this._rangeStart = s.start.format("YYYY-MM-DD"), this._rangeEnd = s.end.format("YYYY-MM-DD"), this._inputDraft = null, this._clearInputError(), this._emitRangeChange();
117
+ return;
118
+ }
119
+ this._showInputError("Seçilen aralık sınırlar dışında.");
120
+ return;
121
+ }
122
+ const o = this._parseSingleDate(e);
123
+ if (o && this._withinBounds(o)) {
124
+ this._rangeStart = o.format("YYYY-MM-DD"), this._rangeEnd = null, this._inputDraft = null, this._clearInputError();
125
+ return;
126
+ }
127
+ this._showInputError("Geçersiz aralık formatı. Örnek: 19/09/2025 - 25/09/2025");
128
+ return;
129
+ }
130
+ const n = this._parseSingleDate(e);
131
+ n && this._withinBounds(n) ? (this._emitChange(n.format("YYYY-MM-DD")), this._inputDraft = null, this._clearInputError()) : this._showInputError("Geçersiz tarih formatı. Örnek: 19/09/2025");
132
+ }
133
+ _updatePopper() {
134
+ if (!this._open || !this.isConnected) return;
135
+ const t = this._referenceElement, e = this._popupElement;
136
+ if (!t || !e) return;
137
+ const n = Math.max(
138
+ 270,
139
+ Math.round(t.getBoundingClientRect().width * (this.expandFactor || 1))
140
+ );
141
+ if (e.style.width = `${n}px`, this._popperInstance) {
142
+ this._popperInstance.setOptions({
143
+ placement: "bottom",
144
+ strategy: "fixed",
145
+ modifiers: this._getPopperModifiers()
146
+ }), this._popperInstance.update();
147
+ return;
148
+ }
149
+ this._popperInstance = b(t, e, {
150
+ placement: "bottom",
151
+ strategy: "fixed",
152
+ modifiers: this._getPopperModifiers()
153
+ });
154
+ }
155
+ _getPopperModifiers() {
156
+ return [
157
+ { name: "offset", options: { offset: [0, 8] } },
158
+ { name: "preventOverflow", options: { padding: 8 } },
159
+ {
160
+ name: "flip",
161
+ options: {
162
+ padding: 8,
163
+ fallbackPlacements: [
164
+ "top-start",
165
+ "right-start",
166
+ "left-start",
167
+ "bottom-end",
168
+ "top-end",
169
+ "right-end",
170
+ "left-end"
171
+ ]
172
+ }
173
+ }
174
+ ];
175
+ }
176
+ _destroyPopper() {
177
+ this._popperInstance && (this._popperInstance.destroy(), this._popperInstance = void 0);
178
+ }
179
+ _handleCalendarChange(t) {
180
+ this._emitChange(t.detail.value), this._inputDraft = null, this._toggleOpen(!1);
181
+ }
182
+ _handleCalendarRangeChange(t) {
183
+ this._rangeStart = t.detail.start, this._rangeEnd = t.detail.end, this._inputDraft = null, this._emitRangeChange(), this._toggleOpen(!1);
184
+ }
185
+ _handleCalendarStateChange(t) {
186
+ this._rangeStart = t.detail.rangeStart, this._rangeEnd = t.detail.rangeEnd;
187
+ }
188
+ _handleSuffixClick(t) {
189
+ t.stopPropagation(), this._openDropdown(), this._inputElement?.focus();
190
+ }
191
+ _handleClearClick(t) {
192
+ t.stopPropagation(), this._emitChange(null), this._rangeStart = null, this._rangeEnd = null, this._inputDraft = null, this._clearInputError(), this._inputElement?.focus();
193
+ }
194
+ render() {
195
+ const t = this.error || (this._hasError ? this._errorMsg : ""), e = !!this._displayValue();
196
+ return d`
197
+ <div class="dp">
198
+ <div class="dp__reference">
199
+ <logosphere-formfield
200
+ class="dp__field"
201
+ .label=${this.label}
202
+ .helper=${this.helper}
203
+ .error=${t}
204
+ .required=${this.required}
205
+ .disabled=${this.disabled}
206
+ .readonly=${this.readonly}
207
+ .placeholder=${this.placeholder}
208
+ .size=${this.size}
209
+ .variant=${this.variant}
210
+ @click=${this._openDropdown}
211
+ >
212
+ <input
213
+ id=${this.inputId}
214
+ class="dp__input"
215
+ .value=${y(this._inputValue())}
216
+ ?disabled=${this.disabled}
217
+ ?readonly=${this.readonly}
218
+ placeholder=${this.placeholder}
219
+ aria-label="Tarih girin"
220
+ aria-invalid=${t ? "true" : "false"}
221
+ @focus=${this._openDropdown}
222
+ @input=${this._onInput}
223
+ @keydown=${this._onKeydown}
224
+ @blur=${this._onBlur}
225
+ />
226
+ ${e ? d`
227
+ <button
228
+ slot="clear"
229
+ class="dp__icon-btn dp__icon-btn_suffix"
230
+ type="button"
231
+ aria-label="Temizle"
232
+ @click=${this._handleClearClick}
233
+ >
234
+ <ui-icon name="uil-times" size="14"></ui-icon>
235
+ </button>
236
+ ` : _}
237
+ <button
238
+ id=${this.inputId + "-ico"}
239
+ slot="suffix"
240
+ class="dp__icon-btn"
241
+ type="button"
242
+ aria-label=${this._open ? "Takvimi kapat" : "Takvimi aç"}
243
+ aria-expanded=${this._open ? "true" : "false"}
244
+ aria-haspopup="dialog"
245
+ @click=${this._handleSuffixClick}
246
+ >
247
+ <ui-icon name="uil-calendar" size="16"></ui-icon>
248
+ </button>
249
+ </logosphere-formfield>
250
+ </div>
251
+
252
+ ${this._open ? d`
253
+ <div
254
+ data-datepicker-popper
255
+ class="dp__popup"
256
+ role="dialog"
257
+ aria-modal="true"
258
+ aria-label="Tarih seçici"
259
+ >
260
+ <logosphere-calendar
261
+ .value=${this.value}
262
+ .min=${this.min}
263
+ .max=${this.max}
264
+ .disabled=${this.disabled}
265
+ .rangeMode=${this.rangeMode}
266
+ .disabledDays=${this.disabledDays}
267
+ .rangeStart=${this._rangeStart}
268
+ .rangeEnd=${this._rangeEnd}
269
+ .closable=${!0}
270
+ @change=${this._handleCalendarChange}
271
+ @rangeChange=${this._handleCalendarRangeChange}
272
+ @calendar-state-change=${this._handleCalendarStateChange}
273
+ @close-request=${() => this._toggleOpen(!1)}
274
+ ></logosphere-calendar>
275
+ </div>
276
+ ` : _}
277
+ </div>
278
+ `;
279
+ }
280
+ };
281
+ r.styles = [
282
+ g`
283
+ ${c(S)}
284
+ `
285
+ ];
286
+ i([
287
+ a({ type: String })
288
+ ], r.prototype, "value", 2);
289
+ i([
290
+ a({ type: String })
291
+ ], r.prototype, "min", 2);
292
+ i([
293
+ a({ type: String })
294
+ ], r.prototype, "max", 2);
295
+ i([
296
+ a({ type: Boolean })
297
+ ], r.prototype, "required", 2);
298
+ i([
299
+ a({ type: Boolean })
300
+ ], r.prototype, "disabled", 2);
301
+ i([
302
+ a({ type: Boolean })
303
+ ], r.prototype, "readonly", 2);
304
+ i([
305
+ a({ type: Number })
306
+ ], r.prototype, "expandFactor", 2);
307
+ i([
308
+ a({ type: String })
309
+ ], r.prototype, "placeholder", 2);
310
+ i([
311
+ a({ type: String })
312
+ ], r.prototype, "label", 2);
313
+ i([
314
+ a({ type: String })
315
+ ], r.prototype, "helper", 2);
316
+ i([
317
+ a({ type: String })
318
+ ], r.prototype, "error", 2);
319
+ i([
320
+ a({ type: String })
321
+ ], r.prototype, "size", 2);
322
+ i([
323
+ a({ type: String })
324
+ ], r.prototype, "variant", 2);
325
+ i([
326
+ a({ type: Boolean })
327
+ ], r.prototype, "rangeMode", 2);
328
+ i([
329
+ a({ type: Array })
330
+ ], r.prototype, "disabledDays", 2);
331
+ i([
332
+ a({ type: String })
333
+ ], r.prototype, "rangeStart", 2);
334
+ i([
335
+ a({ type: String })
336
+ ], r.prototype, "rangeEnd", 2);
337
+ i([
338
+ a({ attribute: !1 })
339
+ ], r.prototype, "onChange", 2);
340
+ i([
341
+ a({ attribute: !1 })
342
+ ], r.prototype, "onRangeChange", 2);
343
+ i([
344
+ l()
345
+ ], r.prototype, "_open", 2);
346
+ i([
347
+ l()
348
+ ], r.prototype, "_rangeStart", 2);
349
+ i([
350
+ l()
351
+ ], r.prototype, "_rangeEnd", 2);
352
+ i([
353
+ l()
354
+ ], r.prototype, "_hasError", 2);
355
+ i([
356
+ l()
357
+ ], r.prototype, "_errorMsg", 2);
358
+ i([
359
+ l()
360
+ ], r.prototype, "_inputDraft", 2);
361
+ i([
362
+ u(".dp__reference")
363
+ ], r.prototype, "_referenceElement", 2);
364
+ i([
365
+ u("[data-datepicker-popper]")
366
+ ], r.prototype, "_popupElement", 2);
367
+ i([
368
+ u("input")
369
+ ], r.prototype, "_inputElement", 2);
370
+ r = i([
371
+ m("logosphere-datepicker")
372
+ ], r);
373
+ export {
374
+ r as L
375
+ };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./datepicker-BQOVo1Pr.cjs");Object.defineProperty(exports,"LedsDatePicker",{enumerable:!0,get:()=>e.LedsDatePicker});
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./datepicker-BLv_G9Yb.cjs");Object.defineProperty(exports,"LedsDatePicker",{enumerable:!0,get:()=>e.LedsDatePicker});
@@ -1,4 +1,4 @@
1
- import { L as a } from "./datepicker-ChdQsc_l.js";
1
+ import { L as a } from "./datepicker-SwKsdw3S.js";
2
2
  export {
3
3
  a as LedsDatePicker
4
4
  };
@@ -0,0 +1,33 @@
1
+ "use strict";const s=require("lit"),t=require("lit/decorators.js"),f=":host{display:block}.formfield{position:relative;font-family:var(--font-family-base)}.formfield__label{display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-body-text);margin-bottom:var(--spacing-2)}.formfield__required{color:var(--color-danger);margin-left:var(--spacing-1)}.formfield__container{position:relative;display:flex;align-items:center;box-sizing:border-box;border-radius:var(--radius-base);border:1px solid var(--color-border);padding:0 var(--spacing-2) 0 var(--spacing-3);background-color:var(--color-body-bg);cursor:text;transition:border-color var(--transition-speed-base) var(--transition-timing),background-color var(--transition-speed-base) var(--transition-timing)}.formfield__container--cursor-text{cursor:text}.formfield__container--cursor-pointer{cursor:pointer}.formfield__container--cursor-default{cursor:default}.formfield__container--default{min-height:32px}.formfield__container--large{min-height:40px}.formfield__container--focused{border-color:var(--color-secondary-hover);background-color:var(--color-body-bg)}.formfield__container--hovered:not(.formfield__container--focused):not(.formfield__container--error):not(.formfield__container--disabled){background-color:var(--color-tertiary-bg)}.formfield__container--error{border-color:var(--color-danger);background-color:var(--color-danger-bg-subtle)}.formfield__container--disabled{background-color:var(--color-tertiary-bg);opacity:.4;cursor:not-allowed}.formfield__container--subtle:not(.formfield__container--focused):not(.formfield__container--error){border-color:transparent}.formfield__input-area{flex:1;min-width:0;display:flex;align-items:center}.formfield__prefix,.formfield__clear,.formfield__suffix{display:flex;align-items:center;flex-shrink:0;align-self:stretch}.formfield__prefix{margin-right:var(--spacing-2)}.formfield__clear,.formfield__suffix{margin-left:var(--spacing-2)}.formfield__container--has-prefix .formfield__prefix{border-right:1px solid var(--color-border);padding-right:var(--spacing-2)}.formfield__container--has-suffix .formfield__suffix{border-left:1px solid var(--color-border);padding-left:var(--spacing-2)}.formfield__prefix:empty,.formfield__clear:empty,.formfield__suffix:empty{display:none}.formfield__helper{font-size:var(--font-size-sm);color:var(--color-tertiary);margin-top:var(--spacing-1)}.formfield__error{font-size:var(--font-size-sm);color:var(--color-danger);margin-top:var(--spacing-1)}::slotted(input),::slotted(textarea){width:100%;border:none;outline:none;background:transparent;font-size:14px;line-height:1.5}::slotted(input:disabled),::slotted(textarea:disabled){cursor:not-allowed}";var c=Object.defineProperty,h=Object.getOwnPropertyDescriptor,o=(n,e,r,l)=>{for(var i=l>1?void 0:l?h(e,r):e,a=n.length-1,d;a>=0;a--)(d=n[a])&&(i=(l?d(e,r,i):d(i))||i);return l&&i&&c(e,r,i),i};exports.FormField=class extends s.LitElement{constructor(){super(...arguments),this.label="",this.helper="",this.error="",this.placeholder="",this.size="default",this.variant="default",this.cursor="text",this.required=!1,this.disabled=!1,this.readonly=!1,this._focused=!1,this._hovered=!1,this._hasPrefix=!1,this._hasSuffix=!1,this.handleSlotFocus=e=>{const r=e.target;["INPUT","TEXTAREA","SELECT"].includes(r.tagName)&&(this._focused=!0,this.dispatchEvent(new CustomEvent("field-focus",{bubbles:!0,composed:!0,detail:{originalEvent:e}})))},this.handleSlotBlur=e=>{const r=e.target;["INPUT","TEXTAREA","SELECT"].includes(r.tagName)&&(this._focused=!1,this.dispatchEvent(new CustomEvent("field-blur",{bubbles:!0,composed:!0,detail:{originalEvent:e}})))},this.handleMouseEnter=()=>{this._hovered=!0},this.handleMouseLeave=()=>{this._hovered=!1},this.handleContainerClick=e=>{const r=e.target;if(["INPUT","TEXTAREA","SELECT","BUTTON"].includes(r.tagName))return;this.shadowRoot?.querySelector("slot:not([name])")?.assignedElements({flatten:!0}).find(a=>["INPUT","TEXTAREA","SELECT"].includes(a.tagName))?.focus()},this.handlePrefixSlotChange=e=>{const r=e.target;this._hasPrefix=r.assignedElements({flatten:!0}).length>0},this.handleSuffixSlotChange=e=>{const r=e.target;this._hasSuffix=r.assignedElements({flatten:!0}).length>0}}connectedCallback(){super.connectedCallback(),this.addEventListener("focus",this.handleSlotFocus,!0),this.addEventListener("blur",this.handleSlotBlur,!0)}firstUpdated(){const e=this.shadowRoot?.querySelector('slot[name="prefix"]'),r=this.shadowRoot?.querySelector('slot[name="suffix"]');e&&(this._hasPrefix=e.assignedElements({flatten:!0}).length>0),r&&(this._hasSuffix=r.assignedElements({flatten:!0}).length>0)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("focus",this.handleSlotFocus,!0),this.removeEventListener("blur",this.handleSlotBlur,!0)}render(){const e=!!this.error,r=!e&&!!this.helper,l=["formfield__container",`formfield__container--${this.size}`,`formfield__container--cursor-${this.cursor}`,this._hasPrefix?"formfield__container--has-prefix":"",this._hasSuffix?"formfield__container--has-suffix":"",e?"formfield__container--error":"",this._focused?"formfield__container--focused":"",this._hovered?"formfield__container--hovered":"",this.disabled?"formfield__container--disabled":"",this.variant==="subtle"?"formfield__container--subtle":""].filter(Boolean).join(" ");return s.html`
2
+ <div class="formfield">
3
+ ${this.label?s.html`
4
+ <label class="formfield__label">
5
+ ${this.label}
6
+ ${this.required?s.html`<span class="formfield__required">*</span>`:""}
7
+ </label>
8
+ `:""}
9
+
10
+ <div
11
+ class="${l}"
12
+ @mouseenter=${this.handleMouseEnter}
13
+ @mouseleave=${this.handleMouseLeave}
14
+ @click=${this.handleContainerClick}
15
+ >
16
+ <div class="formfield__prefix">
17
+ <slot name="prefix" @slotchange=${this.handlePrefixSlotChange}></slot>
18
+ </div>
19
+ <div class="formfield__input-area">
20
+ <slot></slot>
21
+ </div>
22
+ <div class="formfield__clear">
23
+ <slot name="clear"></slot>
24
+ </div>
25
+ <div class="formfield__suffix">
26
+ <slot name="suffix" @slotchange=${this.handleSuffixSlotChange}></slot>
27
+ </div>
28
+ </div>
29
+
30
+ ${r?s.html`<div class="formfield__helper">${this.helper}</div>`:""}
31
+ ${e?s.html`<div class="formfield__error">${this.error}</div>`:""}
32
+ </div>
33
+ `}};exports.FormField.styles=[s.css`${s.unsafeCSS(f)}`];o([t.property({type:String})],exports.FormField.prototype,"label",2);o([t.property({type:String})],exports.FormField.prototype,"helper",2);o([t.property({type:String})],exports.FormField.prototype,"error",2);o([t.property({type:String})],exports.FormField.prototype,"placeholder",2);o([t.property({type:String})],exports.FormField.prototype,"size",2);o([t.property({type:String})],exports.FormField.prototype,"variant",2);o([t.property({type:String})],exports.FormField.prototype,"cursor",2);o([t.property({type:Boolean})],exports.FormField.prototype,"required",2);o([t.property({type:Boolean})],exports.FormField.prototype,"disabled",2);o([t.property({type:Boolean})],exports.FormField.prototype,"readonly",2);o([t.state()],exports.FormField.prototype,"_focused",2);o([t.state()],exports.FormField.prototype,"_hovered",2);o([t.state()],exports.FormField.prototype,"_hasPrefix",2);o([t.state()],exports.FormField.prototype,"_hasSuffix",2);exports.FormField=o([t.customElement("logosphere-formfield")],exports.FormField);
@@ -0,0 +1,147 @@
1
+ import { unsafeCSS as h, css as _, LitElement as u, html as n } from "lit";
2
+ import { property as i, state as f, customElement as p } from "lit/decorators.js";
3
+ const m = ":host{display:block}.formfield{position:relative;font-family:var(--font-family-base)}.formfield__label{display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-body-text);margin-bottom:var(--spacing-2)}.formfield__required{color:var(--color-danger);margin-left:var(--spacing-1)}.formfield__container{position:relative;display:flex;align-items:center;box-sizing:border-box;border-radius:var(--radius-base);border:1px solid var(--color-border);padding:0 var(--spacing-2) 0 var(--spacing-3);background-color:var(--color-body-bg);cursor:text;transition:border-color var(--transition-speed-base) var(--transition-timing),background-color var(--transition-speed-base) var(--transition-timing)}.formfield__container--cursor-text{cursor:text}.formfield__container--cursor-pointer{cursor:pointer}.formfield__container--cursor-default{cursor:default}.formfield__container--default{min-height:32px}.formfield__container--large{min-height:40px}.formfield__container--focused{border-color:var(--color-secondary-hover);background-color:var(--color-body-bg)}.formfield__container--hovered:not(.formfield__container--focused):not(.formfield__container--error):not(.formfield__container--disabled){background-color:var(--color-tertiary-bg)}.formfield__container--error{border-color:var(--color-danger);background-color:var(--color-danger-bg-subtle)}.formfield__container--disabled{background-color:var(--color-tertiary-bg);opacity:.4;cursor:not-allowed}.formfield__container--subtle:not(.formfield__container--focused):not(.formfield__container--error){border-color:transparent}.formfield__input-area{flex:1;min-width:0;display:flex;align-items:center}.formfield__prefix,.formfield__clear,.formfield__suffix{display:flex;align-items:center;flex-shrink:0;align-self:stretch}.formfield__prefix{margin-right:var(--spacing-2)}.formfield__clear,.formfield__suffix{margin-left:var(--spacing-2)}.formfield__container--has-prefix .formfield__prefix{border-right:1px solid var(--color-border);padding-right:var(--spacing-2)}.formfield__container--has-suffix .formfield__suffix{border-left:1px solid var(--color-border);padding-left:var(--spacing-2)}.formfield__prefix:empty,.formfield__clear:empty,.formfield__suffix:empty{display:none}.formfield__helper{font-size:var(--font-size-sm);color:var(--color-tertiary);margin-top:var(--spacing-1)}.formfield__error{font-size:var(--font-size-sm);color:var(--color-danger);margin-top:var(--spacing-1)}::slotted(input),::slotted(textarea){width:100%;border:none;outline:none;background:transparent;font-size:14px;line-height:1.5}::slotted(input:disabled),::slotted(textarea:disabled){cursor:not-allowed}";
4
+ var g = Object.defineProperty, v = Object.getOwnPropertyDescriptor, o = (e, r, l, a) => {
5
+ for (var s = a > 1 ? void 0 : a ? v(r, l) : r, d = e.length - 1, c; d >= 0; d--)
6
+ (c = e[d]) && (s = (a ? c(r, l, s) : c(s)) || s);
7
+ return a && s && g(r, l, s), s;
8
+ };
9
+ let t = class extends u {
10
+ constructor() {
11
+ super(...arguments), this.label = "", this.helper = "", this.error = "", this.placeholder = "", this.size = "default", this.variant = "default", this.cursor = "text", this.required = !1, this.disabled = !1, this.readonly = !1, this._focused = !1, this._hovered = !1, this._hasPrefix = !1, this._hasSuffix = !1, this.handleSlotFocus = (e) => {
12
+ const r = e.target;
13
+ ["INPUT", "TEXTAREA", "SELECT"].includes(r.tagName) && (this._focused = !0, this.dispatchEvent(new CustomEvent("field-focus", {
14
+ bubbles: !0,
15
+ composed: !0,
16
+ detail: { originalEvent: e }
17
+ })));
18
+ }, this.handleSlotBlur = (e) => {
19
+ const r = e.target;
20
+ ["INPUT", "TEXTAREA", "SELECT"].includes(r.tagName) && (this._focused = !1, this.dispatchEvent(new CustomEvent("field-blur", {
21
+ bubbles: !0,
22
+ composed: !0,
23
+ detail: { originalEvent: e }
24
+ })));
25
+ }, this.handleMouseEnter = () => {
26
+ this._hovered = !0;
27
+ }, this.handleMouseLeave = () => {
28
+ this._hovered = !1;
29
+ }, this.handleContainerClick = (e) => {
30
+ const r = e.target;
31
+ if (["INPUT", "TEXTAREA", "SELECT", "BUTTON"].includes(r.tagName)) return;
32
+ this.shadowRoot?.querySelector("slot:not([name])")?.assignedElements({ flatten: !0 }).find((s) => ["INPUT", "TEXTAREA", "SELECT"].includes(s.tagName))?.focus();
33
+ }, this.handlePrefixSlotChange = (e) => {
34
+ const r = e.target;
35
+ this._hasPrefix = r.assignedElements({ flatten: !0 }).length > 0;
36
+ }, this.handleSuffixSlotChange = (e) => {
37
+ const r = e.target;
38
+ this._hasSuffix = r.assignedElements({ flatten: !0 }).length > 0;
39
+ };
40
+ }
41
+ connectedCallback() {
42
+ super.connectedCallback(), this.addEventListener("focus", this.handleSlotFocus, !0), this.addEventListener("blur", this.handleSlotBlur, !0);
43
+ }
44
+ firstUpdated() {
45
+ const e = this.shadowRoot?.querySelector('slot[name="prefix"]'), r = this.shadowRoot?.querySelector('slot[name="suffix"]');
46
+ e && (this._hasPrefix = e.assignedElements({ flatten: !0 }).length > 0), r && (this._hasSuffix = r.assignedElements({ flatten: !0 }).length > 0);
47
+ }
48
+ disconnectedCallback() {
49
+ super.disconnectedCallback(), this.removeEventListener("focus", this.handleSlotFocus, !0), this.removeEventListener("blur", this.handleSlotBlur, !0);
50
+ }
51
+ render() {
52
+ const e = !!this.error, r = !e && !!this.helper, l = [
53
+ "formfield__container",
54
+ `formfield__container--${this.size}`,
55
+ `formfield__container--cursor-${this.cursor}`,
56
+ this._hasPrefix ? "formfield__container--has-prefix" : "",
57
+ this._hasSuffix ? "formfield__container--has-suffix" : "",
58
+ e ? "formfield__container--error" : "",
59
+ this._focused ? "formfield__container--focused" : "",
60
+ this._hovered ? "formfield__container--hovered" : "",
61
+ this.disabled ? "formfield__container--disabled" : "",
62
+ this.variant === "subtle" ? "formfield__container--subtle" : ""
63
+ ].filter(Boolean).join(" ");
64
+ return n`
65
+ <div class="formfield">
66
+ ${this.label ? n`
67
+ <label class="formfield__label">
68
+ ${this.label}
69
+ ${this.required ? n`<span class="formfield__required">*</span>` : ""}
70
+ </label>
71
+ ` : ""}
72
+
73
+ <div
74
+ class="${l}"
75
+ @mouseenter=${this.handleMouseEnter}
76
+ @mouseleave=${this.handleMouseLeave}
77
+ @click=${this.handleContainerClick}
78
+ >
79
+ <div class="formfield__prefix">
80
+ <slot name="prefix" @slotchange=${this.handlePrefixSlotChange}></slot>
81
+ </div>
82
+ <div class="formfield__input-area">
83
+ <slot></slot>
84
+ </div>
85
+ <div class="formfield__clear">
86
+ <slot name="clear"></slot>
87
+ </div>
88
+ <div class="formfield__suffix">
89
+ <slot name="suffix" @slotchange=${this.handleSuffixSlotChange}></slot>
90
+ </div>
91
+ </div>
92
+
93
+ ${r ? n`<div class="formfield__helper">${this.helper}</div>` : ""}
94
+ ${e ? n`<div class="formfield__error">${this.error}</div>` : ""}
95
+ </div>
96
+ `;
97
+ }
98
+ };
99
+ t.styles = [_`${h(m)}`];
100
+ o([
101
+ i({ type: String })
102
+ ], t.prototype, "label", 2);
103
+ o([
104
+ i({ type: String })
105
+ ], t.prototype, "helper", 2);
106
+ o([
107
+ i({ type: String })
108
+ ], t.prototype, "error", 2);
109
+ o([
110
+ i({ type: String })
111
+ ], t.prototype, "placeholder", 2);
112
+ o([
113
+ i({ type: String })
114
+ ], t.prototype, "size", 2);
115
+ o([
116
+ i({ type: String })
117
+ ], t.prototype, "variant", 2);
118
+ o([
119
+ i({ type: String })
120
+ ], t.prototype, "cursor", 2);
121
+ o([
122
+ i({ type: Boolean })
123
+ ], t.prototype, "required", 2);
124
+ o([
125
+ i({ type: Boolean })
126
+ ], t.prototype, "disabled", 2);
127
+ o([
128
+ i({ type: Boolean })
129
+ ], t.prototype, "readonly", 2);
130
+ o([
131
+ f()
132
+ ], t.prototype, "_focused", 2);
133
+ o([
134
+ f()
135
+ ], t.prototype, "_hovered", 2);
136
+ o([
137
+ f()
138
+ ], t.prototype, "_hasPrefix", 2);
139
+ o([
140
+ f()
141
+ ], t.prototype, "_hasSuffix", 2);
142
+ t = o([
143
+ p("logosphere-formfield")
144
+ ], t);
145
+ export {
146
+ t as F
147
+ };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./formfield-D_7NFFoe.cjs");Object.defineProperty(exports,"FormField",{enumerable:!0,get:()=>e.FormField});
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./formfield-BFOIEicR.cjs");Object.defineProperty(exports,"FormField",{enumerable:!0,get:()=>e.FormField});
package/dist/formfield.js CHANGED
@@ -1,4 +1,4 @@
1
- import { F } from "./formfield-BOgRugzm.js";
1
+ import { F } from "./formfield-CNh4mBSs.js";
2
2
  export {
3
3
  F as FormField
4
4
  };
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./button-CDRccsk9.cjs"),r=require("./badge-DVvdodRb.cjs"),t=require("./checkbox-CdDTRdKV.cjs"),o=require("./formfield-D_7NFFoe.cjs"),n=require("./switch-Rnnn10bn.cjs"),u=require("./breadcrumb-Cop-B1J7.cjs"),b=require("./card-KiNHfEi2.cjs"),a=require("./input-CoY1ZcPF.cjs"),c=require("./popover-C2p5Pmts.cjs"),i=require("./text-area-eT-oCnqZ.cjs"),d=require("./chatbot-BF4TQnlG.cjs"),p=require("./combobox-CeK7yW2F.cjs"),g=require("./datepicker-BQOVo1Pr.cjs"),s=require("./download-manager-BSIMTGaK.cjs"),l=require("./modal-DQ8VFL-P.cjs"),m=require("./tab-DcjAlXzU.cjs");Object.defineProperty(exports,"Button",{enumerable:!0,get:()=>e.Button});Object.defineProperty(exports,"LogosphereBadge",{enumerable:!0,get:()=>r.LogosphereBadge});Object.defineProperty(exports,"Checkbox",{enumerable:!0,get:()=>t.Checkbox});Object.defineProperty(exports,"FormField",{enumerable:!0,get:()=>o.FormField});Object.defineProperty(exports,"Switch",{enumerable:!0,get:()=>n.Switch});Object.defineProperty(exports,"Breadcrumb",{enumerable:!0,get:()=>u.Breadcrumb});Object.defineProperty(exports,"Card",{enumerable:!0,get:()=>b.Card});Object.defineProperty(exports,"LogosphereInput",{enumerable:!0,get:()=>a.LogosphereInput});Object.defineProperty(exports,"Popover",{enumerable:!0,get:()=>c.Popover});Object.defineProperty(exports,"TextArea",{enumerable:!0,get:()=>i.TextArea});Object.defineProperty(exports,"LedsUiChatbot",{enumerable:!0,get:()=>d.LedsUiChatbot});Object.defineProperty(exports,"Combobox",{enumerable:!0,get:()=>p.Combobox});Object.defineProperty(exports,"LedsDatePicker",{enumerable:!0,get:()=>g.LedsDatePicker});Object.defineProperty(exports,"DownloadManager",{enumerable:!0,get:()=>s.DownloadManager});Object.defineProperty(exports,"Modal",{enumerable:!0,get:()=>l.Modal});Object.defineProperty(exports,"LogosphereTab",{enumerable:!0,get:()=>m.LogosphereTab});
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./button-Bx870pUi.cjs"),t=require("./badge-7IIatiRv.cjs"),o=require("./checkbox-CdDTRdKV.cjs"),n=require("./formfield-BFOIEicR.cjs"),u=require("./switch-Rnnn10bn.cjs"),b=require("./breadcrumb-Cop-B1J7.cjs"),a=require("./card-BmW0sPDb.cjs"),c=require("./input-JpAWN-M1.cjs"),i=require("./popover-C2p5Pmts.cjs"),d=require("./text-area-CZDdxbrN.cjs"),l=require("./chatbot-CBDEFak3.cjs"),m=require("./calendar-DF3q_dcG.cjs"),p=require("./combobox-C6zoQopK.cjs"),g=require("./datepicker-BLv_G9Yb.cjs"),s=require("./download-manager-BSIMTGaK.cjs"),e=require("./leftmenu-Bgqfmoe5.cjs"),f=require("./modal-DQ8VFL-P.cjs"),P=require("./tab-DcjAlXzU.cjs"),y=require("./tree-menu-B1iwfHyd.cjs");Object.defineProperty(exports,"Button",{enumerable:!0,get:()=>r.Button});Object.defineProperty(exports,"LogosphereBadge",{enumerable:!0,get:()=>t.LogosphereBadge});Object.defineProperty(exports,"Checkbox",{enumerable:!0,get:()=>o.Checkbox});Object.defineProperty(exports,"FormField",{enumerable:!0,get:()=>n.FormField});Object.defineProperty(exports,"Switch",{enumerable:!0,get:()=>u.Switch});Object.defineProperty(exports,"Breadcrumb",{enumerable:!0,get:()=>b.Breadcrumb});Object.defineProperty(exports,"Card",{enumerable:!0,get:()=>a.Card});Object.defineProperty(exports,"LogosphereInput",{enumerable:!0,get:()=>c.LogosphereInput});Object.defineProperty(exports,"Popover",{enumerable:!0,get:()=>i.Popover});Object.defineProperty(exports,"TextArea",{enumerable:!0,get:()=>d.TextArea});Object.defineProperty(exports,"LedsUiChatbot",{enumerable:!0,get:()=>l.LedsUiChatbot});Object.defineProperty(exports,"LedsCalendar",{enumerable:!0,get:()=>m.LedsCalendar});Object.defineProperty(exports,"Combobox",{enumerable:!0,get:()=>p.Combobox});Object.defineProperty(exports,"LedsDatePicker",{enumerable:!0,get:()=>g.LedsDatePicker});Object.defineProperty(exports,"DownloadManager",{enumerable:!0,get:()=>s.DownloadManager});Object.defineProperty(exports,"LeftMenu",{enumerable:!0,get:()=>e.LeftMenu});Object.defineProperty(exports,"LeftMenuItemElement",{enumerable:!0,get:()=>e.LeftMenuItemElement});Object.defineProperty(exports,"Modal",{enumerable:!0,get:()=>f.Modal});Object.defineProperty(exports,"LogosphereTab",{enumerable:!0,get:()=>P.LogosphereTab});Object.defineProperty(exports,"TreeMenu",{enumerable:!0,get:()=>y.TreeMenu});
package/dist/index.d.ts CHANGED
@@ -9,8 +9,11 @@ export * from "./molecules/Input/index.js";
9
9
  export * from "./molecules/Popover/index.js";
10
10
  export * from "./molecules/Textarea/index.js";
11
11
  export * from "./organisms/Chatbot/index.js";
12
+ export * from "./organisms/Calendar/index.js";
12
13
  export * from "./organisms/Combobox/index.js";
13
14
  export * from "./organisms/DatePicker/index.js";
14
15
  export * from "./organisms/DownloadManager/index.js";
16
+ export * from "./organisms/LeftMenu/index.js";
15
17
  export * from "./organisms/Modal/index.js";
16
18
  export * from "./organisms/Tab/index.js";
19
+ export * from "./organisms/TreeMenu/index.js";