@logosphere-ui/core 0.0.0-alpha.5 → 0.0.0-alpha.51

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 (208) hide show
  1. package/AGENTS.md +1204 -0
  2. package/dist/AGENTS.md +1204 -0
  3. package/dist/accordion-CYuCj7nB.cjs +21 -0
  4. package/dist/accordion-cDabqwu6.js +96 -0
  5. package/dist/accordion.cjs +1 -0
  6. package/dist/accordion.js +4 -0
  7. package/dist/atoms/Badge/badge.d.ts +1 -1
  8. package/dist/atoms/Button/button.d.ts +5 -3
  9. package/dist/atoms/Checkbox/checkbox.d.ts +13 -3
  10. package/dist/atoms/FormField/formfield.d.ts +12 -0
  11. package/dist/atoms/Slider/index.d.ts +1 -0
  12. package/dist/atoms/Slider/slider.d.ts +54 -0
  13. package/dist/badge-BhINg1p5.js +72 -0
  14. package/dist/badge-CKSG_MyA.cjs +13 -0
  15. package/dist/badge.cjs +1 -1
  16. package/dist/badge.js +1 -1
  17. package/dist/breadcrumb-BOuCLUJh.cjs +12 -0
  18. package/dist/breadcrumb-BeJqq-5C.js +41 -0
  19. package/dist/breadcrumb.cjs +1 -1
  20. package/dist/breadcrumb.js +1 -1
  21. package/dist/button-CVkIa7M0.js +58 -0
  22. package/dist/button-vdNReBMi.cjs +10 -0
  23. package/dist/button.cjs +1 -1
  24. package/dist/button.js +1 -1
  25. package/dist/calendar-C71sj3Ki.js +652 -0
  26. package/dist/calendar-DZJM5Tyu.cjs +88 -0
  27. package/dist/calendar.cjs +1 -0
  28. package/dist/calendar.js +4 -0
  29. package/dist/{card-CUhlTJyJ.js → card-C7xXMV3h.js} +26 -25
  30. package/dist/card-DmQRNKtk.cjs +43 -0
  31. package/dist/card.cjs +1 -1
  32. package/dist/card.js +1 -1
  33. package/dist/chatbot-BAou4THb.cjs +183 -0
  34. package/dist/chatbot-BRfqXYYt.js +564 -0
  35. package/dist/chatbot.cjs +1 -1
  36. package/dist/chatbot.js +2 -2
  37. package/dist/checkbox-BAbPDN6x.cjs +53 -0
  38. package/dist/checkbox-CTfbav6M.js +152 -0
  39. package/dist/checkbox.cjs +1 -1
  40. package/dist/checkbox.js +1 -1
  41. package/dist/chip-group-D4DwnC37.cjs +26 -0
  42. package/dist/chip-group-DzfOd6Vw.js +89 -0
  43. package/dist/chip-group.cjs +1 -0
  44. package/dist/chip-group.js +4 -0
  45. package/dist/collapse-CbRE8ABx.cjs +47 -0
  46. package/dist/collapse-DY6SJ9jS.js +141 -0
  47. package/dist/collapse.cjs +1 -0
  48. package/dist/collapse.js +4 -0
  49. package/dist/combobox-BAa3UAQs.cjs +113 -0
  50. package/dist/combobox-BR05Tgfd.js +460 -0
  51. package/dist/combobox.cjs +1 -1
  52. package/dist/combobox.js +1 -1
  53. package/dist/datepicker-BFYWQRrJ.js +382 -0
  54. package/dist/datepicker-BWE4qDJM.cjs +85 -0
  55. package/dist/datepicker.cjs +1 -1
  56. package/dist/datepicker.js +2 -2
  57. package/dist/{download-manager-A4fOxGWJ.js → download-manager-BPg-6Qfg.js} +4 -4
  58. package/dist/download-manager-DDeTYRPs.cjs +97 -0
  59. package/dist/download-manager.cjs +1 -1
  60. package/dist/download-manager.js +1 -1
  61. package/dist/drawer-CRu4G2zu.cjs +32 -0
  62. package/dist/drawer-DhuBPWHP.js +114 -0
  63. package/dist/drawer.cjs +1 -0
  64. package/dist/drawer.js +4 -0
  65. package/dist/formfield-JXiv9mvJ.cjs +33 -0
  66. package/dist/formfield-ss2mFweu.js +161 -0
  67. package/dist/formfield.cjs +1 -1
  68. package/dist/formfield.js +1 -1
  69. package/dist/icon.cjs +1 -0
  70. package/dist/icon.js +4 -0
  71. package/dist/index.cjs +1 -1
  72. package/dist/index.d.ts +15 -0
  73. package/dist/index.js +65 -32
  74. package/dist/index.umd.js +1613 -521
  75. package/dist/input-DyLKo7h6.cjs +60 -0
  76. package/dist/input-N3Z8D7q1.js +278 -0
  77. package/dist/input-group-C6sA1lzj.cjs +5 -0
  78. package/dist/input-group-DUPlrpug.js +66 -0
  79. package/dist/input-group.cjs +1 -0
  80. package/dist/input-group.js +4 -0
  81. package/dist/input.cjs +1 -1
  82. package/dist/input.js +1 -1
  83. package/dist/left-menu.cjs +1 -0
  84. package/dist/left-menu.js +5 -0
  85. package/dist/leftmenu-DiKo8iud.cjs +120 -0
  86. package/dist/leftmenu-DlU_G4Sj.js +373 -0
  87. package/dist/modal-g3KbWncV.cjs +84 -0
  88. package/dist/modal-vSjEpYrG.js +250 -0
  89. package/dist/modal.cjs +1 -1
  90. package/dist/modal.js +1 -1
  91. package/dist/molecules/Accordion/accordion.d.ts +42 -0
  92. package/dist/molecules/Accordion/index.d.ts +2 -0
  93. package/dist/molecules/Chip/chip-group.d.ts +29 -0
  94. package/dist/molecules/Chip/index.d.ts +2 -0
  95. package/dist/molecules/Collapse/collapse.d.ts +42 -0
  96. package/dist/molecules/Collapse/index.d.ts +2 -0
  97. package/dist/molecules/Input/input.d.ts +24 -1
  98. package/dist/molecules/InputGroup/index.d.ts +1 -0
  99. package/dist/molecules/InputGroup/input-group.d.ts +40 -0
  100. package/dist/molecules/Pagination/index.d.ts +1 -0
  101. package/dist/molecules/Pagination/pagination.d.ts +60 -0
  102. package/dist/molecules/Popover/popover.d.ts +5 -0
  103. package/dist/molecules/SplitButton/index.d.ts +2 -0
  104. package/dist/molecules/SplitButton/split-button.d.ts +53 -0
  105. package/dist/molecules/Stepper/index.d.ts +2 -0
  106. package/dist/molecules/Stepper/stepper.d.ts +34 -0
  107. package/dist/molecules/Textarea/text-area.d.ts +5 -2
  108. package/dist/molecules/TimePicker/index.d.ts +2 -0
  109. package/dist/molecules/TimePicker/timepicker.d.ts +62 -0
  110. package/dist/organisms/Calendar/calendar.d.ts +54 -0
  111. package/dist/organisms/Calendar/index.d.ts +1 -0
  112. package/dist/organisms/Calendar/shared.d.ts +9 -0
  113. package/dist/organisms/Chatbot/chatbot.d.ts +10 -1
  114. package/dist/organisms/Chatbot/index.d.ts +1 -1
  115. package/dist/organisms/Combobox/combobox.d.ts +39 -0
  116. package/dist/organisms/DatePicker/datepicker.d.ts +35 -33
  117. package/dist/organisms/Drawer/drawer.d.ts +30 -0
  118. package/dist/organisms/Drawer/index.d.ts +1 -0
  119. package/dist/organisms/LeftMenu/index.d.ts +2 -0
  120. package/dist/organisms/LeftMenu/leftmenu-types.d.ts +24 -0
  121. package/dist/organisms/LeftMenu/leftmenu.d.ts +60 -0
  122. package/dist/organisms/Modal/modal.d.ts +29 -4
  123. package/dist/organisms/Tab/tab.d.ts +13 -1
  124. package/dist/organisms/Toast/index.d.ts +2 -0
  125. package/dist/organisms/Toast/toast-container.d.ts +42 -0
  126. package/dist/organisms/Toast/toast.d.ts +48 -0
  127. package/dist/organisms/TreeMenu/index.d.ts +1 -0
  128. package/dist/organisms/TreeMenu/tree-menu.d.ts +59 -0
  129. package/dist/pagination-CjXvpE2j.js +360 -0
  130. package/dist/pagination-Nnzacqdo.cjs +169 -0
  131. package/dist/pagination.cjs +1 -0
  132. package/dist/pagination.js +4 -0
  133. package/dist/popover-CrXUbUR-.cjs +30 -0
  134. package/dist/popover-M5ZcS5rj.js +161 -0
  135. package/dist/popover.cjs +1 -1
  136. package/dist/popover.js +1 -1
  137. package/dist/shared/icons/index.d.ts +1 -0
  138. package/dist/shared/types/button.types.d.ts +7 -0
  139. package/dist/slider-DSRs5uhl.cjs +108 -0
  140. package/dist/slider-ntLRajQa.js +280 -0
  141. package/dist/slider.cjs +1 -0
  142. package/dist/slider.js +4 -0
  143. package/dist/split-button-BdBweoip.js +177 -0
  144. package/dist/split-button-BpffPlVg.cjs +63 -0
  145. package/dist/split-button.cjs +1 -0
  146. package/dist/split-button.js +4 -0
  147. package/dist/stepper-CZhwgLNp.js +122 -0
  148. package/dist/stepper-ZOMaU6aZ.cjs +52 -0
  149. package/dist/stepper.cjs +1 -0
  150. package/dist/stepper.js +4 -0
  151. package/dist/styles/main.css +186 -182
  152. package/dist/switch-Do6SCkPJ.cjs +17 -0
  153. package/dist/switch-uYVuohJ-.js +68 -0
  154. package/dist/switch.cjs +1 -1
  155. package/dist/switch.js +1 -1
  156. package/dist/tab-BvRVHpWs.cjs +41 -0
  157. package/dist/tab-Byh4UgFB.js +204 -0
  158. package/dist/tab.cjs +1 -1
  159. package/dist/tab.js +1 -1
  160. package/dist/text-area-1rALZ0iy.js +239 -0
  161. package/dist/text-area-D_TYL4_q.cjs +51 -0
  162. package/dist/textarea.cjs +1 -1
  163. package/dist/textarea.js +1 -1
  164. package/dist/timepicker-B9l6HN-d.js +320 -0
  165. package/dist/timepicker-Bpf2d4Nn.cjs +119 -0
  166. package/dist/timepicker.cjs +1 -0
  167. package/dist/timepicker.js +4 -0
  168. package/dist/toast-container-C5qYjInG.js +274 -0
  169. package/dist/toast-container-D2dyP20J.cjs +64 -0
  170. package/dist/toast.cjs +1 -0
  171. package/dist/toast.js +6 -0
  172. package/dist/tree-menu-BZ7aBC7R.js +237 -0
  173. package/dist/tree-menu-DDQ_DYl7.cjs +78 -0
  174. package/dist/tree-menu.cjs +1 -0
  175. package/dist/tree-menu.js +4 -0
  176. package/dist/ui-icon-BeR-PaPg.js +75 -0
  177. package/dist/ui-icon-DWl7I5BQ.cjs +22 -0
  178. package/package.json +104 -15
  179. package/dist/badge-BbhaO73N.cjs +0 -13
  180. package/dist/badge-DE7Tgd8Z.js +0 -71
  181. package/dist/breadcrumb-B-4yqoJZ.js +0 -41
  182. package/dist/breadcrumb-Cop-B1J7.cjs +0 -12
  183. package/dist/button-C1EwOosO.js +0 -58
  184. package/dist/button-CDRccsk9.cjs +0 -10
  185. package/dist/card-n8ka8Zk-.cjs +0 -43
  186. package/dist/chatbot-Da_itUdJ.cjs +0 -160
  187. package/dist/chatbot-zkxngMRH.js +0 -481
  188. package/dist/checkbox-7Rb3WKGx.js +0 -119
  189. package/dist/checkbox-CdDTRdKV.cjs +0 -37
  190. package/dist/combobox-BJbI-Tgi.js +0 -268
  191. package/dist/combobox-pmE7bgEL.cjs +0 -99
  192. package/dist/datepicker-DFJx45C-.js +0 -750
  193. package/dist/datepicker-b9JGTTMx.cjs +0 -115
  194. package/dist/download-manager-BSIMTGaK.cjs +0 -97
  195. package/dist/formfield-D_7NFFoe.cjs +0 -27
  196. package/dist/formfield-d8fp9FTV.js +0 -118
  197. package/dist/input-BcnI1w3_.cjs +0 -46
  198. package/dist/input-Bj_7u8Iv.js +0 -192
  199. package/dist/modal-Bfc6WQSL.js +0 -110
  200. package/dist/modal-DQ8VFL-P.cjs +0 -39
  201. package/dist/popover-B7tCqk3R.js +0 -140
  202. package/dist/popover-C2p5Pmts.cjs +0 -30
  203. package/dist/switch-Cpl53nRW.js +0 -64
  204. package/dist/switch-Rnnn10bn.cjs +0 -17
  205. package/dist/tab-BKdN4xAz.js +0 -176
  206. package/dist/tab-DcjAlXzU.cjs +0 -40
  207. package/dist/text-area-BkHdLnZj.cjs +0 -44
  208. package/dist/text-area-CC24lj8v.js +0 -204
@@ -1,481 +0,0 @@
1
- import { LitElement as m, html as a, unsafeCSS as v, css as _ } from "lit";
2
- import { property as d, state as c, query as b, customElement as y } from "lit/decorators.js";
3
- import { unsafeHTML as w } from "lit/directives/unsafe-html.js";
4
- const x = ":host{display:block;z-index:9999}.chatbot{font-family:var(--font-family-base)}.chatbot__overlay{position:fixed;inset:0;background-color:#0003;z-index:var(--z-index-modal-backdrop)}.chatbot__launcher{position:fixed;z-index:var(--z-index-modal);display:flex;align-items:center;gap:var(--spacing-4);padding-left:var(--spacing-4);padding-right:var(--spacing-4);height:66px;color:#fff;border-radius:var(--radius-xl);cursor:pointer;box-shadow:var(--shadow-base);background-color:var(--color-body-bg);overflow:hidden;transition:box-shadow var(--transition-speed-fast) var(--transition-timing)}.chatbot__launcher:hover{box-shadow:var(--shadow-md)}.chatbot__launcher--draggable{cursor:move}.chatbot__launcher--hidden{visibility:hidden;width:72px;height:66px;justify-content:center;padding:0}.chatbot__launcher-icon{width:40px;height:34px;flex-shrink:0}.chatbot__launcher-text{display:flex;flex-direction:column}.chatbot__launcher-title{font-weight:var(--font-weight-semibold);font-size:var(--font-size-xl);margin:0;line-height:24px;white-space:nowrap;color:var(--color-body-text)}.chatbot__launcher-subtitle{font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);margin:0;line-height:20px;white-space:nowrap;color:var(--color-tertiary)}.chatbot__window{position:fixed;z-index:var(--z-index-modal);display:flex;flex-direction:column;box-shadow:var(--shadow-xl);border-radius:var(--radius-md);overflow:hidden;background-color:var(--color-body-bg)}.chatbot__window--hidden{display:none}.chatbot__window--fullscreen{inset:80px 50px;width:auto;height:auto}.chatbot__resize-top{position:absolute;top:0;left:0;right:0;height:8px;cursor:ns-resize;z-index:50;transition:background-color var(--transition-speed-fast) var(--transition-timing)}.chatbot__resize-top:hover{background-color:#0000000d}.chatbot__resize-side{position:absolute;top:0;bottom:0;width:8px;cursor:ew-resize;z-index:50;transition:background-color var(--transition-speed-fast) var(--transition-timing)}.chatbot__resize-side:hover{background-color:#0000000d}.chatbot__resize-side--left{left:0}.chatbot__resize-side--right{right:0}.chatbot__resize-corner{position:absolute;top:0;width:16px;height:16px;z-index:50;transition:background-color var(--transition-speed-fast) var(--transition-timing)}.chatbot__resize-corner:hover{background-color:#0000001a}.chatbot__resize-corner--nwse{left:0;cursor:nwse-resize}.chatbot__resize-corner--nesw{right:0;cursor:nesw-resize}.chatbot__header{height:74px;display:flex;align-items:center;justify-content:space-between;padding-left:var(--spacing-5);padding-right:var(--spacing-4);gap:var(--spacing-4);flex-shrink:0;background-color:var(--color-body-bg);border-bottom:1px solid var(--color-border)}.chatbot__header-info{display:flex;align-items:center;gap:var(--spacing-4)}.chatbot__header-logo{width:50px;height:41px}.chatbot__header-title{font-weight:var(--font-weight-semibold);font-size:var(--font-size-xl);margin:0;line-height:24px;color:var(--color-body-text)}.chatbot__header-subtitle{font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);margin:0;line-height:20px;color:var(--color-tertiary)}.chatbot__header-actions{display:flex;align-items:center;gap:var(--spacing-2)}.chatbot__body{flex:1;display:flex;flex-direction:column;background-color:var(--color-body-bg);position:relative;overflow:hidden}.chatbot__product{padding:var(--spacing-3);padding-bottom:0;flex-shrink:0;margin:0 var(--spacing-3)}.chatbot__messages{flex:1;display:flex;flex-direction:column;gap:var(--spacing-3);margin-top:var(--spacing-4);padding:var(--spacing-4);overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.chatbot__messages::-webkit-scrollbar{display:none}.chatbot__message{display:flex}.chatbot__message--user{justify-content:flex-end}.chatbot__message--assistant,.chatbot__message--system{justify-content:flex-start}.chatbot__bubble{position:relative;color:var(--color-body-text);max-width:85%;border-radius:var(--radius-md);padding:var(--spacing-4);font-size:var(--font-size-sm);line-height:20px;font-weight:var(--font-weight-medium)}.chatbot__bubble--user{background-color:var(--color-primary);color:#fff;border-bottom-right-radius:0;border-top-right-radius:var(--radius-xl);border-top-left-radius:var(--radius-xl);border-bottom-left-radius:var(--radius-xl)}.chatbot__bubble--user a{color:#ffffffe6}.chatbot__bubble--assistant,.chatbot__bubble--system{background-color:var(--color-tertiary-bg);border-bottom-left-radius:0;border-top-right-radius:var(--radius-xl);border-top-left-radius:var(--radius-xl);border-bottom-right-radius:var(--radius-xl)}.chatbot__message-content p{margin:0}.chatbot__message-content ol{list-style-type:decimal;margin:0;padding-left:var(--spacing-5)}.chatbot__message-content ul{list-style-type:disc;margin:0;padding-left:var(--spacing-5)}.chatbot__message-content li{padding-left:var(--spacing-1)}.chatbot__message-content a{color:var(--color-primary);text-decoration:underline;transition:color var(--transition-speed-fast) var(--transition-timing)}.chatbot__message-content a:hover{color:var(--color-primary-hover)}.chatbot__feedback{display:flex;align-items:center;gap:var(--spacing-2);padding-top:var(--spacing-2)}.chatbot__typing-wrapper{display:flex;justify-content:flex-start}.chatbot__typing{background-color:var(--color-tertiary-bg);padding:var(--spacing-3);border-radius:var(--radius-xl);border-bottom-left-radius:0;display:inline-flex;align-items:center;gap:2px}.chatbot__typing-dot{display:inline-block;width:6px;height:6px;background-color:var(--color-gray-300);border-radius:var(--radius-full);animation:chatbot-typing 1.4s infinite ease-in-out both;margin:0 2px}.chatbot__typing-dot:nth-child(1){animation-delay:-.32s}.chatbot__typing-dot:nth-child(2){animation-delay:-.16s}@keyframes chatbot-typing{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}.chatbot__input-area{padding:var(--spacing-4);padding-top:var(--spacing-2);padding-bottom:var(--spacing-1);background-color:var(--color-body-bg)}.chatbot__input-wrapper{position:relative;display:flex;align-items:center;gap:var(--spacing-2);background-color:var(--color-tertiary-bg);border-radius:var(--radius-md);padding:var(--spacing-2);border:1px solid transparent;transition:background-color var(--transition-speed-fast) var(--transition-timing),border-color var(--transition-speed-fast) var(--transition-timing)}.chatbot__input-wrapper:focus-within{background-color:var(--color-body-bg);border-color:var(--color-border)}.chatbot__input{flex:1;background:transparent;border:none;outline:none;font-family:var(--font-family-base);font-size:var(--font-size-sm);color:var(--color-body-text)}.chatbot__input::placeholder{color:var(--color-tertiary)}.chatbot__input:disabled{opacity:.5;cursor:not-allowed}.chatbot__footer{display:flex;align-items:center;justify-content:center;padding-bottom:var(--spacing-2)}.chatbot__footer-text{margin:0;padding:0;color:var(--color-secondary);font-size:var(--font-size-xs);font-family:var(--font-family-base)}";
5
- var z = Object.defineProperty, C = Object.getOwnPropertyDescriptor, s = (t, e, n, i) => {
6
- for (var r = i > 1 ? void 0 : i ? C(e, n) : e, l = t.length - 1, h; l >= 0; l--)
7
- (h = t[l]) && (r = (i ? h(e, n, r) : h(r)) || r);
8
- return i && r && z(e, n, r), r;
9
- };
10
- let o = class extends m {
11
- constructor() {
12
- super(...arguments), this.returnUri = "", this.questionPrompt = "", this.minimizedIconOnly = !1, this.draggable = !1, this.resizable = !1, this.products = [], this.openInitially = !1, this.showFeedbackButtons = !1, this.open = !1, this.fullscreen = !1, this.messages = [], this.isLoading = !1, this.inputText = "", this.selectedProductId = "", this.windowWidth = 440, this.windowHeight = Math.min(700, window.innerHeight - 40), this.position = { right: 20, bottom: 20 }, this.isDragging = !1, this.screenWidth = window.innerWidth, this.dragStartPos = { x: 0, y: 0 }, this.initialPosition = { right: 0, bottom: 0 }, this.isResizing = !1, this.resizeDirection = "horizontal", this.resizeStartWidth = 0, this.resizeStartHeight = 0, this.onWindowResize = () => {
13
- this.screenWidth = window.innerWidth;
14
- const t = window.innerHeight - 40;
15
- this.windowHeight > t && (this.windowHeight = t);
16
- }, this.onToggle = () => {
17
- this.open = !this.open, this.scrollToBottom();
18
- }, this.onClose = () => {
19
- this.open = !1, this.fullscreen = !1;
20
- }, this.onToggleFullscreen = () => {
21
- this.fullscreen = !this.fullscreen;
22
- }, this.onMouseMove = (t) => {
23
- if (this.isDragging) {
24
- const e = this.dragStartPos.x - t.clientX, n = this.dragStartPos.y - t.clientY, r = this.shadowRoot?.querySelector(".chatbot__launcher")?.getBoundingClientRect(), l = r?.width || 72, h = r?.height || 66;
25
- this.position = {
26
- right: Math.max(0, Math.min(window.innerWidth - l, this.initialPosition.right + e)),
27
- bottom: Math.max(0, Math.min(window.innerHeight - h, this.initialPosition.bottom + n))
28
- };
29
- } else if (this.isResizing) {
30
- const e = this.dragStartPos.x - t.clientX, n = this.dragStartPos.y - t.clientY;
31
- if (this.resizeDirection === "horizontal" || this.resizeDirection === "both") {
32
- const i = this.position.right < this.screenWidth / 2;
33
- this.windowWidth = Math.max(300, this.resizeStartWidth + (i ? e : -e));
34
- }
35
- (this.resizeDirection === "vertical" || this.resizeDirection === "both") && (this.windowHeight = Math.max(400, this.resizeStartHeight + n));
36
- }
37
- }, this.onMouseUp = (t) => {
38
- this.isDragging ? (this.isDragging = !1, window.removeEventListener("mousemove", this.onMouseMove), window.removeEventListener("mouseup", this.onMouseUp), Math.hypot(t.clientX - this.dragStartPos.x, t.clientY - this.dragStartPos.y) < 5 && this.onToggle()) : this.isResizing && (this.isResizing = !1, window.removeEventListener("mousemove", this.onMouseMove), window.removeEventListener("mouseup", this.onMouseUp));
39
- }, this.handleKeyDown = (t) => {
40
- t.key === "Enter" && !t.shiftKey && (t.preventDefault(), this.sendMessage());
41
- }, this.onInput = (t) => {
42
- const e = t.target;
43
- this.inputText = e ? e.value : t.detail;
44
- }, this.onCopyMessage = (t) => {
45
- navigator.clipboard.writeText(t);
46
- };
47
- }
48
- connectedCallback() {
49
- super.connectedCallback(), window.addEventListener("resize", this.onWindowResize);
50
- }
51
- disconnectedCallback() {
52
- super.disconnectedCallback(), window.removeEventListener("resize", this.onWindowResize), window.removeEventListener("mousemove", this.onMouseMove), window.removeEventListener("mouseup", this.onMouseUp);
53
- }
54
- async firstUpdated() {
55
- this.products.length === 1 && (this.selectedProductId = this.products[0].id), this.open = this.openInitially, this.open && await this.initConversation();
56
- }
57
- updated(t) {
58
- t.has("products") && this.handleProductUpdate(), t.has("messages") && this.scrollToBottom(), t.has("open") && this.open && !this.conversationId && this.initConversation();
59
- }
60
- // ==================== PRODUCT ====================
61
- handleProductUpdate() {
62
- if (!this.products.length) return;
63
- const t = this.products.some((e) => e.id === this.selectedProductId);
64
- this.products.length === 1 && (this.selectedProductId = this.products[0].id), t || (this.messages = [], this.conversationId = void 0, this.open && this.initConversation()), requestAnimationFrame(() => this.updateComboboxItems());
65
- }
66
- updateComboboxItems() {
67
- const t = this.productEl;
68
- if (!t || this.products?.length <= 1) return;
69
- const e = this.products.map((i) => ({ value: i.id, label: i.name }));
70
- t.items = e;
71
- const n = t.selectedItems?.() || [];
72
- if (n.length > 0) {
73
- const i = n[0]?.value;
74
- !this.products.some((l) => l.id === i) && t.setSelected && t.setSelected([]);
75
- }
76
- }
77
- async onProductChange(t) {
78
- const e = t.detail?.selected?.[0]?.value;
79
- e && e !== this.selectedProductId && (this.selectedProductId = e);
80
- }
81
- // ==================== DRAG ====================
82
- onMouseDown(t) {
83
- this.draggable && (t.preventDefault(), this.isDragging = !0, this.dragStartPos = { x: t.clientX, y: t.clientY }, this.initialPosition = { ...this.position }, window.addEventListener("mousemove", this.onMouseMove), window.addEventListener("mouseup", this.onMouseUp));
84
- }
85
- startResize(t, e) {
86
- this.resizable && (t.preventDefault(), t.stopPropagation(), this.isResizing = !0, this.resizeDirection = e, this.dragStartPos = { x: t.clientX, y: t.clientY }, this.resizeStartWidth = this.windowWidth, this.resizeStartHeight = this.windowHeight, window.addEventListener("mousemove", this.onMouseMove), window.addEventListener("mouseup", this.onMouseUp));
87
- }
88
- // ==================== CHAT API ====================
89
- async ensureToken(t = !1) {
90
- const e = "logosphere_chatbot_token";
91
- if (t && (this.assertionToken = void 0, localStorage.removeItem(e)), !t) {
92
- const r = localStorage.getItem(e);
93
- if (r) {
94
- this.assertionToken = r;
95
- return;
96
- }
97
- }
98
- const i = await (await fetch(`${this.returnUri}/api/chat/start`)).json();
99
- if (!i.Success || !i.Data?.Token) throw new Error("Token alınamadı");
100
- this.assertionToken = i.Data.Token, localStorage.setItem(e, this.assertionToken);
101
- }
102
- async postChat(t) {
103
- await this.ensureToken();
104
- const e = `${this.returnUri}/api/chat/completions`, n = () => fetch(e, {
105
- method: "POST",
106
- headers: {
107
- "Content-Type": "application/json",
108
- client_assertion: this.assertionToken,
109
- client_assertion_type: "urn:ietf:params:oauth:client-assertion-type:jwt-bearer"
110
- },
111
- body: JSON.stringify(t)
112
- });
113
- let i = await n();
114
- if (i.status === 401 && (await this.ensureToken(!0), i = await n()), !i.ok) throw new Error(`HTTP ${i.status}`);
115
- return i.json();
116
- }
117
- async initConversation() {
118
- if (!this.isLoading) {
119
- this.isLoading = !0;
120
- try {
121
- await this.ensureToken();
122
- const t = await this.postChat({
123
- ChatCompletionType: "NewConversation",
124
- Context: this.selectedProductId,
125
- QuestionPrompt: this.questionPrompt
126
- });
127
- this.conversationId = t.Data.ConversationId;
128
- const e = t.Data.Choices?.[0]?.Message?.Content;
129
- e && this.addMessage(e, "assistant");
130
- } catch {
131
- this.addMessage("Bir hata oluştu, lütfen tekrar deneyiniz.", "system");
132
- } finally {
133
- this.isLoading = !1;
134
- }
135
- }
136
- }
137
- async sendMessage() {
138
- const t = this.inputText.trim();
139
- if (!(!t || !this.conversationId || this.isLoading)) {
140
- if (!this.selectedProductId) {
141
- this.addMessage("Lütfen önce bir ürün seçiniz.", "system");
142
- return;
143
- }
144
- this.addMessage(t, "user"), this.inputText = "", this.isLoading = !0;
145
- try {
146
- const n = (await this.postChat({
147
- ChatCompletionType: "ConversationUpdate",
148
- Content: t,
149
- Context: this.selectedProductId,
150
- ConversationId: this.conversationId,
151
- QuestionPrompt: this.questionPrompt
152
- })).Data?.Choices?.[0]?.Message?.Content;
153
- this.addMessage(n || "Cevap alınamadı.", "assistant");
154
- } catch {
155
- this.addMessage("Bağlantı hatası.", "system");
156
- } finally {
157
- this.isLoading = !1;
158
- }
159
- }
160
- }
161
- addMessage(t, e) {
162
- this.messages = [...this.messages, { content: t, role: e, timestamp: Date.now() }];
163
- }
164
- scrollToBottom() {
165
- setTimeout(() => {
166
- this.chatContainer && (this.chatContainer.scrollTop = this.chatContainer.scrollHeight);
167
- }, 0);
168
- }
169
- // ==================== CONTENT FORMATTER ====================
170
- formatContent(t) {
171
- if (!t) return "";
172
- const n = t.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").split(`
173
- `);
174
- let i = "", r = !1, l = "";
175
- for (const h of n) {
176
- const f = h.trim() === "", p = h.match(/^\s*\d+\.\s+(.*)/), g = h.match(/^\s*[-*]\s+(.*)/);
177
- if (p || g) {
178
- const u = p ? "ol" : "ul";
179
- (!r || l !== u) && (r && (i += `</${l}>`), i += `<${u}>`, r = !0, l = u), i += `<li>${p ? p[1] : g[1]}</li>`;
180
- } else
181
- f ? r || (i += "<br>") : (r && (i += `</${l}>`, r = !1, l = ""), i += `<p>${h}</p>`);
182
- }
183
- return r && (i += `</${l}>`), i.replace(/\*\*(.*?)\*\*/g, "<strong>$1</strong>").replace(/\*(.*?)\*/g, "<em>$1</em>").replace(
184
- /\[([^\]]+)\]\(([^)]+)\)/g,
185
- '<a href="$2" target="_blank" rel="noopener noreferrer">$1</a>'
186
- );
187
- }
188
- // ==================== RENDER ====================
189
- render() {
190
- const t = this.position.right < this.screenWidth / 2;
191
- return a`
192
- <div class="chatbot">
193
- ${this.renderOverlay()}
194
- ${this.renderLauncher()}
195
- ${this.renderWindow(t)}
196
- </div>
197
- `;
198
- }
199
- renderOverlay() {
200
- return this.open || this.fullscreen ? a`<div class="chatbot__overlay" @click=${this.onToggle}></div>` : "";
201
- }
202
- renderLauncher() {
203
- const t = [
204
- "chatbot__launcher",
205
- this.draggable ? "chatbot__launcher--draggable" : "",
206
- this.open ? "chatbot__launcher--hidden" : ""
207
- ].filter(Boolean).join(" ");
208
- return a`
209
- <div
210
- class="${t}"
211
- style="right: ${this.position.right}px; bottom: ${this.position.bottom}px;"
212
- @mousedown=${this.onMouseDown}
213
- @click=${this.draggable ? null : this.onToggle}
214
- aria-expanded=${this.open ? "true" : "false"}
215
- >
216
- <img class="chatbot__launcher-icon" src="${o.ICONS.launcher}" alt="chatbot" />
217
- ${!this.open && !this.minimizedIconOnly ? a`
218
- <div class="chatbot__launcher-text">
219
- <p class="chatbot__launcher-title">Logo</p>
220
- <p class="chatbot__launcher-subtitle">Dijital Danışman</p>
221
- </div>
222
- ` : ""}
223
- </div>
224
- `;
225
- }
226
- renderWindow(t) {
227
- const e = [
228
- "chatbot__window",
229
- this.open ? "" : "chatbot__window--hidden",
230
- this.fullscreen ? "chatbot__window--fullscreen" : ""
231
- ].filter(Boolean).join(" "), n = this.fullscreen ? "" : `bottom: 20px; height: ${this.windowHeight}px; width: ${this.windowWidth}px; ${t ? "right: 20px;" : "left: 20px;"}`;
232
- return a`
233
- <div class="${e}" style="${n}">
234
- ${this.renderResizeHandles(t)}
235
- ${this.renderHeader()}
236
- <div class="chatbot__body">
237
- ${this.renderProductSelector()}
238
- ${this.renderChatArea()}
239
- ${this.renderInputArea()}
240
- </div>
241
- </div>
242
- `;
243
- }
244
- renderResizeHandles(t) {
245
- return this.fullscreen || !this.resizable ? "" : a`
246
- <div class="chatbot__resize-top"
247
- @mousedown=${(e) => this.startResize(e, "vertical")}></div>
248
- <div class="chatbot__resize-side ${t ? "chatbot__resize-side--left" : "chatbot__resize-side--right"}"
249
- @mousedown=${(e) => this.startResize(e, "horizontal")}></div>
250
- <div class="chatbot__resize-corner ${t ? "chatbot__resize-corner--nwse" : "chatbot__resize-corner--nesw"}"
251
- @mousedown=${(e) => this.startResize(e, "both")}></div>
252
- `;
253
- }
254
- renderHeader() {
255
- return a`
256
- <div class="chatbot__header">
257
- <div class="chatbot__header-info">
258
- <img class="chatbot__header-logo" alt="logo" src="${o.ICONS.launcher}" />
259
- <div>
260
- <p class="chatbot__header-title">Logo</p>
261
- <p class="chatbot__header-subtitle">Dijital Danışman</p>
262
- </div>
263
- </div>
264
- <div class="chatbot__header-actions">
265
- <logosphere-button
266
- iconOnly="true"
267
- size="sm"
268
- variant="text"
269
- theme="--color-light-rgb"
270
- title=${this.fullscreen ? "Küçült" : "Tam Ekran"}
271
- @click=${this.onToggleFullscreen}
272
- >
273
- <ui-icon name="${this.fullscreen ? "uil-compress-alt" : "uil-expand-alt"}" size="16"></ui-icon>
274
- </logosphere-button>
275
- <logosphere-button
276
- iconOnly="true"
277
- size="sm"
278
- variant="text"
279
- theme="--color-light"
280
- title="Kapat"
281
- @click=${this.onClose}
282
- >
283
- <ui-icon name="uil-times" size="16"></ui-icon>
284
- </logosphere-button>
285
- </div>
286
- </div>
287
- `;
288
- }
289
- renderProductSelector() {
290
- return a`
291
- <div class="chatbot__product">
292
- ${this.products.length > 1 ? a`
293
- <logosphere-combobox
294
- id="product"
295
- .items=${this.products.map((t) => ({ value: t.id, label: t.name }))}
296
- optionValue="value"
297
- optionLabel="label"
298
- placeholder="Ürün seçiniz"
299
- @selected=${this.onProductChange}
300
- ></logosphere-combobox>
301
- ` : a`
302
- <logosphere-input
303
- id="product"
304
- placeholder="Ürün seçiniz"
305
- .value=${this.products.length === 1 ? this.products[0].name : ""}
306
- readOnly="true"
307
- ></logosphere-input>
308
- `}
309
- </div>
310
- `;
311
- }
312
- renderChatArea() {
313
- return a`
314
- <div id="chat-container" class="chatbot__messages">
315
- ${this.messages.map((t) => this.renderMessage(t))}
316
- ${this.isLoading ? this.renderTypingIndicator() : ""}
317
- </div>
318
- `;
319
- }
320
- renderMessage(t) {
321
- const e = [
322
- "chatbot__bubble",
323
- `chatbot__bubble--${t.role}`
324
- ].join(" ");
325
- return a`
326
- <div class="chatbot__message chatbot__message--${t.role}">
327
- <div class="${e}">
328
- <div class="chatbot__message-content">
329
- ${w(this.formatContent(t.content))}
330
- </div>
331
- ${this.showFeedbackButtons && t.role === "assistant" ? this.renderFeedbackButtons(t) : ""}
332
- </div>
333
- </div>
334
- `;
335
- }
336
- renderFeedbackButtons(t) {
337
- return a`
338
- <div class="chatbot__feedback">
339
- <logosphere-button
340
- @click=${() => this.onCopyMessage(t.content)}
341
- title="Kopyala"
342
- iconOnly="true"
343
- size="sm"
344
- theme="--color-light-rgb"
345
- >
346
- <ui-icon name="uil-copy" size="14"></ui-icon>
347
- </logosphere-button>
348
- <logosphere-button title="Like" iconOnly="true" size="sm" theme="--color-light-rgb">
349
- <ui-icon name="uil-thumbs-up" size="14"></ui-icon>
350
- </logosphere-button>
351
- <logosphere-button title="Dislike" iconOnly="true" size="sm" theme="--color-light-rgb">
352
- <ui-icon name="uil-thumbs-down" size="14"></ui-icon>
353
- </logosphere-button>
354
- </div>
355
- `;
356
- }
357
- renderTypingIndicator() {
358
- return a`
359
- <div class="chatbot__typing-wrapper">
360
- <div class="chatbot__typing">
361
- <span class="chatbot__typing-dot"></span>
362
- <span class="chatbot__typing-dot"></span>
363
- <span class="chatbot__typing-dot"></span>
364
- </div>
365
- </div>
366
- `;
367
- }
368
- renderInputArea() {
369
- return a`
370
- <div class="chatbot__input-area">
371
- <div class="chatbot__input-wrapper">
372
- <input
373
- class="chatbot__input"
374
- placeholder=${this.selectedProductId ? "Bir şeyler yazın..." : "Lütfen ürün seçiniz..."}
375
- .value=${this.inputText}
376
- @input=${this.onInput}
377
- @keydown=${this.handleKeyDown}
378
- ?disabled=${!this.selectedProductId}
379
- />
380
- <logosphere-button
381
- iconOnly="true"
382
- size="lg"
383
- variant="text"
384
- theme="--color-light"
385
- title="Gönder"
386
- @click=${this.sendMessage}
387
- ?disabled=${!this.selectedProductId || !this.inputText.trim()}
388
- >
389
- <ui-icon name="uil-arrow-circle-right" size="20"></ui-icon>
390
- </logosphere-button>
391
- </div>
392
- </div>
393
- <div class="chatbot__footer">
394
- <p class="chatbot__footer-text">İçerik Yapay Zeka ile Üretilmiştir</p>
395
- </div>
396
- `;
397
- }
398
- };
399
- o.styles = [_`${v(x)}`];
400
- o.ICONS = {
401
- launcher: "data:image/svg+xml,%3Csvg%20width%3D%2251%22%20height%3D%2242%22%20viewBox%3D%220%200%2051%2042%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M38.457%200C40.0338%200%2041.542%200.293293%2042.9302%200.8283L49.15%206.07675C50.2611%207.93912%2050.8994%2010.1162%2050.8994%2012.4424V23.084C50.8994%2024.4858%2050.6676%2025.8334%2050.2402%2027.0907L43.1534%2034.6096C41.7043%2035.2006%2040.1187%2035.5264%2038.457%2035.5264H30.7605L38.5805%2027.2296C40.814%2027.1643%2042.6045%2025.3332%2042.6045%2023.084V12.4424C42.6045%2010.1518%2040.7476%208.29492%2038.457%208.29492H12.4424C10.1518%208.29492%208.29492%2010.1518%208.29492%2012.4424V23.084C8.29492%2025.3746%2010.1518%2027.2314%2012.4424%2027.2314H33.5078L20.4487%2041.0866C17.7992%2042.5379%2014.3381%2040.2741%2014.7842%2036.7803C14.8402%2036.3421%2014.9629%2035.9194%2015.1416%2035.5264H12.4424C10.9217%2035.5264%209.46472%2035.2536%208.11774%2034.7542L0.610679%2026.945C0.214298%2025.7295%200%2024.4318%200%2023.084V12.4424C0%2010.8011%200.317794%209.23402%200.895207%207.79935L7.12424%201.19058C8.73679%200.427072%2010.5397%200%2012.4424%200H38.457ZM23.1357%2017.7881C23.1357%2015.4815%2021.2656%2013.6113%2018.959%2013.6113C16.6525%2013.6114%2014.7822%2015.4815%2014.7822%2017.7881C14.7824%2020.0945%2016.6526%2021.9638%2018.959%2021.9639C21.2655%2021.9639%2023.1356%2020.0945%2023.1357%2017.7881ZM36.2344%2017.7881C36.2344%2015.4815%2034.3642%2013.6113%2032.0576%2013.6113C29.7511%2013.6114%2027.8809%2015.4815%2027.8809%2017.7881C27.881%2020.0945%2029.7512%2021.9638%2032.0576%2021.9639C34.3641%2021.9639%2036.2342%2020.0945%2036.2344%2017.7881Z%22%20fill%3D%22url(%23paint0_linear_97_4585)%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22paint0_linear_97_4585%22%20x1%3D%2231.662%22%20y1%3D%224.88016%22%20x2%3D%2214.4119%22%20y2%3D%2237.9167%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23F22727%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23CA0D0D%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E"
402
- };
403
- s([
404
- d({ type: String, attribute: "return-uri" })
405
- ], o.prototype, "returnUri", 2);
406
- s([
407
- d({ type: String, attribute: "question-prompt" })
408
- ], o.prototype, "questionPrompt", 2);
409
- s([
410
- d({ type: Boolean, attribute: "minimized-icon-only" })
411
- ], o.prototype, "minimizedIconOnly", 2);
412
- s([
413
- d({ type: Boolean, attribute: "draggable" })
414
- ], o.prototype, "draggable", 2);
415
- s([
416
- d({ type: Boolean, attribute: "resizable" })
417
- ], o.prototype, "resizable", 2);
418
- s([
419
- d({
420
- type: Array,
421
- hasChanged: (t, e) => t === e ? !1 : !e || !t || t.length !== e.length ? !0 : JSON.stringify(t) !== JSON.stringify(e)
422
- }),
423
- d({ type: Array })
424
- ], o.prototype, "products", 2);
425
- s([
426
- d({ type: Boolean, attribute: "open-initially" })
427
- ], o.prototype, "openInitially", 2);
428
- s([
429
- d({ type: Boolean, attribute: "show-feedback-buttons" })
430
- ], o.prototype, "showFeedbackButtons", 2);
431
- s([
432
- c()
433
- ], o.prototype, "open", 2);
434
- s([
435
- c()
436
- ], o.prototype, "fullscreen", 2);
437
- s([
438
- c()
439
- ], o.prototype, "messages", 2);
440
- s([
441
- c()
442
- ], o.prototype, "conversationId", 2);
443
- s([
444
- c()
445
- ], o.prototype, "assertionToken", 2);
446
- s([
447
- c()
448
- ], o.prototype, "isLoading", 2);
449
- s([
450
- c()
451
- ], o.prototype, "inputText", 2);
452
- s([
453
- c()
454
- ], o.prototype, "selectedProductId", 2);
455
- s([
456
- c()
457
- ], o.prototype, "windowWidth", 2);
458
- s([
459
- c()
460
- ], o.prototype, "windowHeight", 2);
461
- s([
462
- c()
463
- ], o.prototype, "position", 2);
464
- s([
465
- c()
466
- ], o.prototype, "isDragging", 2);
467
- s([
468
- c()
469
- ], o.prototype, "screenWidth", 2);
470
- s([
471
- b("#chat-container")
472
- ], o.prototype, "chatContainer", 2);
473
- s([
474
- b("#product")
475
- ], o.prototype, "productEl", 2);
476
- o = s([
477
- y("logosphere-chatbot")
478
- ], o);
479
- export {
480
- o as L
481
- };
@@ -1,119 +0,0 @@
1
- import { LitElement as b, nothing as d, html as a, unsafeCSS as k, css as f } from "lit";
2
- import { property as n, state as u, customElement as m } from "lit/decorators.js";
3
- import { ref as p } from "lit/directives/ref.js";
4
- const v = '.checkbox-wrapper{display:inline-flex;align-items:center;gap:var(--spacing-2);cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-base)}.checkbox-wrapper--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.checkbox-input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}.checkbox-control{width:16px;height:16px;flex-shrink:0;position:relative;border:1.5px solid var(--color-border);border-radius:var(--radius-sm);background-color:var(--color-body-bg);transition:background-color var(--transition-speed-fast) var(--transition-timing),border-color var(--transition-speed-fast) var(--transition-timing)}.checkbox-control--checked{background-color:var(--color-primary);border-color:var(--color-primary)}.checkbox-control--checked:after{content:"";position:absolute;top:50%;left:50%;width:9px;height:5px;border-left:2px solid #ffffff;border-bottom:2px solid #ffffff;transform:translate(-50%,-65%) rotate(-45deg)}.checkbox-control--indeterminate{background-color:var(--color-primary);border-color:var(--color-primary)}.checkbox-control--indeterminate:after{content:"";position:absolute;top:50%;left:50%;width:8px;height:2px;background-color:#fff;border-radius:1px;transform:translate(-50%,-50%)}.checkbox-label{font-size:var(--font-size-sm);line-height:var(--line-height-normal);color:var(--color-body-text)}.switch-wrapper{display:inline-flex;align-items:center;gap:var(--spacing-2);cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-base)}.switch-wrapper--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.switch-track{width:36px;height:20px;flex-shrink:0;border-radius:var(--radius-full);background-color:var(--color-border);position:relative;transition:background-color var(--transition-speed-fast) var(--transition-timing)}.switch-track--checked{background-color:var(--color-primary)}.switch-thumb{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:var(--radius-full);background-color:#fff;box-shadow:var(--shadow-xs);transition:transform var(--transition-speed-fast) var(--transition-timing)}.switch-track--checked .switch-thumb{transform:translate(16px)}';
5
- var x = Object.defineProperty, g = Object.getOwnPropertyDescriptor, r = (t, o, c, s) => {
6
- for (var i = s > 1 ? void 0 : s ? g(o, c) : o, l = t.length - 1, h; l >= 0; l--)
7
- (h = t[l]) && (i = (s ? h(o, c, i) : h(i)) || i);
8
- return s && i && x(o, c, i), i;
9
- };
10
- let e = class extends b {
11
- constructor() {
12
- super(...arguments), this.label = "", this.value = "", this.checked = !1, this.type = "checkbox", this.disabled = !1, this.indeterminate = !1, this.internalChecked = !1;
13
- }
14
- connectedCallback() {
15
- super.connectedCallback(), this.internalChecked = this.checked;
16
- }
17
- firstUpdated() {
18
- this.setIndeterminate();
19
- }
20
- updated(t) {
21
- t.has("indeterminate") && this.setIndeterminate(), t.has("checked") && (this.internalChecked = this.checked);
22
- }
23
- setIndeterminate() {
24
- this.inputElement && (this.inputElement.indeterminate = this.indeterminate);
25
- }
26
- toggleChecked() {
27
- this.disabled || (this.indeterminate ? (this.indeterminate = !1, this.internalChecked = !0) : this.internalChecked = !this.internalChecked, this.dispatchEvent(
28
- new CustomEvent("lgsChange", {
29
- detail: {
30
- checked: this.internalChecked,
31
- indeterminate: this.indeterminate,
32
- value: this.value
33
- },
34
- bubbles: !0,
35
- composed: !0
36
- })
37
- ));
38
- }
39
- renderCheckbox() {
40
- const t = [
41
- "checkbox-control",
42
- this.internalChecked ? "checkbox-control--checked" : "",
43
- this.indeterminate ? "checkbox-control--indeterminate" : ""
44
- ].filter(Boolean).join(" ");
45
- return a`
46
- <div
47
- class="checkbox-wrapper ${this.disabled ? "checkbox-wrapper--disabled" : ""}"
48
- @click=${this.toggleChecked}
49
- >
50
- <input
51
- type="checkbox"
52
- class="checkbox-input"
53
- .checked=${this.internalChecked}
54
- ?disabled=${this.disabled}
55
- .value=${this.value}
56
- ${p((o) => this.inputElement = o)}
57
- />
58
- <span class="${t}"></span>
59
- ${this.label ? a`<span class="checkbox-label">${this.label}</span>` : d}
60
- </div>
61
- `;
62
- }
63
- renderSwitch() {
64
- return a`
65
- <div
66
- class="switch-wrapper ${this.disabled ? "switch-wrapper--disabled" : ""}"
67
- @click=${this.toggleChecked}
68
- >
69
- <input
70
- type="checkbox"
71
- class="checkbox-input"
72
- .checked=${this.internalChecked}
73
- ?disabled=${this.disabled}
74
- .value=${this.value}
75
- ${p((t) => this.inputElement = t)}
76
- />
77
- <div class="switch-track ${this.internalChecked ? "switch-track--checked" : ""}">
78
- <div class="switch-thumb"></div>
79
- </div>
80
- ${this.label ? a`<span class="checkbox-label">${this.label}</span>` : d}
81
- </div>
82
- `;
83
- }
84
- render() {
85
- return this.type === "switch" ? this.renderSwitch() : this.renderCheckbox();
86
- }
87
- };
88
- e.styles = [
89
- f`
90
- ${k(v)}
91
- `
92
- ];
93
- r([
94
- n({ type: String })
95
- ], e.prototype, "label", 2);
96
- r([
97
- n({ type: String })
98
- ], e.prototype, "value", 2);
99
- r([
100
- n({ type: Boolean })
101
- ], e.prototype, "checked", 2);
102
- r([
103
- n({ type: String })
104
- ], e.prototype, "type", 2);
105
- r([
106
- n({ type: Boolean })
107
- ], e.prototype, "disabled", 2);
108
- r([
109
- n({ type: Boolean })
110
- ], e.prototype, "indeterminate", 2);
111
- r([
112
- u()
113
- ], e.prototype, "internalChecked", 2);
114
- e = r([
115
- m("logosphere-checkbox")
116
- ], e);
117
- export {
118
- e as C
119
- };
@@ -1,37 +0,0 @@
1
- "use strict";const t=require("lit"),r=require("lit/decorators.js"),h=require("lit/directives/ref.js"),d='.checkbox-wrapper{display:inline-flex;align-items:center;gap:var(--spacing-2);cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-base)}.checkbox-wrapper--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.checkbox-input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}.checkbox-control{width:16px;height:16px;flex-shrink:0;position:relative;border:1.5px solid var(--color-border);border-radius:var(--radius-sm);background-color:var(--color-body-bg);transition:background-color var(--transition-speed-fast) var(--transition-timing),border-color var(--transition-speed-fast) var(--transition-timing)}.checkbox-control--checked{background-color:var(--color-primary);border-color:var(--color-primary)}.checkbox-control--checked:after{content:"";position:absolute;top:50%;left:50%;width:9px;height:5px;border-left:2px solid #ffffff;border-bottom:2px solid #ffffff;transform:translate(-50%,-65%) rotate(-45deg)}.checkbox-control--indeterminate{background-color:var(--color-primary);border-color:var(--color-primary)}.checkbox-control--indeterminate:after{content:"";position:absolute;top:50%;left:50%;width:8px;height:2px;background-color:#fff;border-radius:1px;transform:translate(-50%,-50%)}.checkbox-label{font-size:var(--font-size-sm);line-height:var(--line-height-normal);color:var(--color-body-text)}.switch-wrapper{display:inline-flex;align-items:center;gap:var(--spacing-2);cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-base)}.switch-wrapper--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.switch-track{width:36px;height:20px;flex-shrink:0;border-radius:var(--radius-full);background-color:var(--color-border);position:relative;transition:background-color var(--transition-speed-fast) var(--transition-timing)}.switch-track--checked{background-color:var(--color-primary)}.switch-thumb{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:var(--radius-full);background-color:#fff;box-shadow:var(--shadow-xs);transition:transform var(--transition-speed-fast) var(--transition-timing)}.switch-track--checked .switch-thumb{transform:translate(16px)}';var p=Object.defineProperty,b=Object.getOwnPropertyDescriptor,i=(a,e,s,n)=>{for(var o=n>1?void 0:n?b(e,s):e,c=a.length-1,l;c>=0;c--)(l=a[c])&&(o=(n?l(e,s,o):l(o))||o);return n&&o&&p(e,s,o),o};exports.Checkbox=class extends t.LitElement{constructor(){super(...arguments),this.label="",this.value="",this.checked=!1,this.type="checkbox",this.disabled=!1,this.indeterminate=!1,this.internalChecked=!1}connectedCallback(){super.connectedCallback(),this.internalChecked=this.checked}firstUpdated(){this.setIndeterminate()}updated(e){e.has("indeterminate")&&this.setIndeterminate(),e.has("checked")&&(this.internalChecked=this.checked)}setIndeterminate(){this.inputElement&&(this.inputElement.indeterminate=this.indeterminate)}toggleChecked(){this.disabled||(this.indeterminate?(this.indeterminate=!1,this.internalChecked=!0):this.internalChecked=!this.internalChecked,this.dispatchEvent(new CustomEvent("lgsChange",{detail:{checked:this.internalChecked,indeterminate:this.indeterminate,value:this.value},bubbles:!0,composed:!0})))}renderCheckbox(){const e=["checkbox-control",this.internalChecked?"checkbox-control--checked":"",this.indeterminate?"checkbox-control--indeterminate":""].filter(Boolean).join(" ");return t.html`
2
- <div
3
- class="checkbox-wrapper ${this.disabled?"checkbox-wrapper--disabled":""}"
4
- @click=${this.toggleChecked}
5
- >
6
- <input
7
- type="checkbox"
8
- class="checkbox-input"
9
- .checked=${this.internalChecked}
10
- ?disabled=${this.disabled}
11
- .value=${this.value}
12
- ${h.ref(s=>this.inputElement=s)}
13
- />
14
- <span class="${e}"></span>
15
- ${this.label?t.html`<span class="checkbox-label">${this.label}</span>`:t.nothing}
16
- </div>
17
- `}renderSwitch(){return t.html`
18
- <div
19
- class="switch-wrapper ${this.disabled?"switch-wrapper--disabled":""}"
20
- @click=${this.toggleChecked}
21
- >
22
- <input
23
- type="checkbox"
24
- class="checkbox-input"
25
- .checked=${this.internalChecked}
26
- ?disabled=${this.disabled}
27
- .value=${this.value}
28
- ${h.ref(e=>this.inputElement=e)}
29
- />
30
- <div class="switch-track ${this.internalChecked?"switch-track--checked":""}">
31
- <div class="switch-thumb"></div>
32
- </div>
33
- ${this.label?t.html`<span class="checkbox-label">${this.label}</span>`:t.nothing}
34
- </div>
35
- `}render(){return this.type==="switch"?this.renderSwitch():this.renderCheckbox()}};exports.Checkbox.styles=[t.css`
36
- ${t.unsafeCSS(d)}
37
- `];i([r.property({type:String})],exports.Checkbox.prototype,"label",2);i([r.property({type:String})],exports.Checkbox.prototype,"value",2);i([r.property({type:Boolean})],exports.Checkbox.prototype,"checked",2);i([r.property({type:String})],exports.Checkbox.prototype,"type",2);i([r.property({type:Boolean})],exports.Checkbox.prototype,"disabled",2);i([r.property({type:Boolean})],exports.Checkbox.prototype,"indeterminate",2);i([r.state()],exports.Checkbox.prototype,"internalChecked",2);exports.Checkbox=i([r.customElement("logosphere-checkbox")],exports.Checkbox);