@logosphere-ui/core 0.0.0-alpha.4 → 0.0.0-alpha.42

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 (176) hide show
  1. package/AGENTS.md +1123 -0
  2. package/dist/AGENTS.md +1123 -0
  3. package/dist/atoms/Badge/badge.d.ts +1 -1
  4. package/dist/atoms/Button/button.d.ts +5 -3
  5. package/dist/atoms/Checkbox/checkbox.d.ts +2 -1
  6. package/dist/atoms/FormField/formfield.d.ts +10 -0
  7. package/dist/atoms/Slider/index.d.ts +1 -0
  8. package/dist/atoms/Slider/slider.d.ts +54 -0
  9. package/dist/badge-DsDxWEHx.js +72 -0
  10. package/dist/badge-DvaKpUHe.cjs +13 -0
  11. package/dist/badge.cjs +1 -1
  12. package/dist/badge.js +1 -1
  13. package/dist/{breadcrumb-B-4yqoJZ.js → breadcrumb-BB61Xt0s.js} +3 -3
  14. package/dist/breadcrumb.js +1 -1
  15. package/dist/button-DRZ4sG4T.cjs +10 -0
  16. package/dist/button-Uu9oaieg.js +58 -0
  17. package/dist/button.cjs +1 -1
  18. package/dist/button.js +1 -1
  19. package/dist/calendar-CIgyrv3U.cjs +88 -0
  20. package/dist/calendar-CZ_IN2TF.js +652 -0
  21. package/dist/calendar.cjs +1 -0
  22. package/dist/calendar.js +4 -0
  23. package/dist/card-BOCW7gad.cjs +43 -0
  24. package/dist/{card-CUhlTJyJ.js → card-MDwFGplY.js} +27 -26
  25. package/dist/card.cjs +1 -1
  26. package/dist/card.js +1 -1
  27. package/dist/chatbot-B-NiZIYK.cjs +183 -0
  28. package/dist/chatbot-CHgiUY4h.js +564 -0
  29. package/dist/chatbot.cjs +1 -1
  30. package/dist/chatbot.js +2 -2
  31. package/dist/checkbox-CX0LgsWP.js +148 -0
  32. package/dist/checkbox-DpbKHANK.cjs +53 -0
  33. package/dist/checkbox.cjs +1 -1
  34. package/dist/checkbox.js +1 -1
  35. package/dist/chip-group-BUL2H8rr.js +89 -0
  36. package/dist/chip-group-CpcjGoRm.cjs +26 -0
  37. package/dist/chip-group.cjs +1 -0
  38. package/dist/chip-group.js +4 -0
  39. package/dist/combobox-BmIFPk8X.cjs +113 -0
  40. package/dist/combobox-jak7Ac1m.js +437 -0
  41. package/dist/combobox.cjs +1 -1
  42. package/dist/combobox.js +1 -1
  43. package/dist/datepicker-BgysIOZI.js +375 -0
  44. package/dist/datepicker-DOBmbxlo.cjs +85 -0
  45. package/dist/datepicker.cjs +1 -1
  46. package/dist/datepicker.js +2 -2
  47. package/dist/{download-manager-A4fOxGWJ.js → download-manager-BPg-6Qfg.js} +4 -4
  48. package/dist/download-manager-DDeTYRPs.cjs +97 -0
  49. package/dist/download-manager.cjs +1 -1
  50. package/dist/download-manager.js +1 -1
  51. package/dist/drawer-3nyjAkcS.cjs +32 -0
  52. package/dist/drawer-CE9zzllI.js +114 -0
  53. package/dist/drawer.cjs +1 -0
  54. package/dist/drawer.js +4 -0
  55. package/dist/formfield-CRcyUMvQ.cjs +33 -0
  56. package/dist/formfield-O327HYt0.js +154 -0
  57. package/dist/formfield.cjs +1 -1
  58. package/dist/formfield.js +1 -1
  59. package/dist/index.cjs +291 -1
  60. package/dist/index.d.ts +14 -0
  61. package/dist/index.js +908 -32
  62. package/dist/index.umd.js +1544 -521
  63. package/dist/input-CQS0LzF-.cjs +59 -0
  64. package/dist/input-CeF3YJk-.js +257 -0
  65. package/dist/input.cjs +1 -1
  66. package/dist/input.js +1 -1
  67. package/dist/left-menu.cjs +1 -0
  68. package/dist/left-menu.js +5 -0
  69. package/dist/leftmenu-CmWvnA6L.js +301 -0
  70. package/dist/leftmenu-p9aR2QTy.cjs +83 -0
  71. package/dist/modal-DUIv_yoo.js +250 -0
  72. package/dist/modal-dUnnHe8u.cjs +84 -0
  73. package/dist/modal.cjs +1 -1
  74. package/dist/modal.js +1 -1
  75. package/dist/molecules/Accordion/accordion.d.ts +42 -0
  76. package/dist/molecules/Accordion/index.d.ts +2 -0
  77. package/dist/molecules/Chip/chip-group.d.ts +29 -0
  78. package/dist/molecules/Chip/index.d.ts +2 -0
  79. package/dist/molecules/Collapse/collapse.d.ts +42 -0
  80. package/dist/molecules/Collapse/index.d.ts +2 -0
  81. package/dist/molecules/Input/input.d.ts +7 -1
  82. package/dist/molecules/InputGroup/index.d.ts +1 -0
  83. package/dist/molecules/InputGroup/input-group.d.ts +40 -0
  84. package/dist/molecules/Pagination/index.d.ts +1 -0
  85. package/dist/molecules/Pagination/pagination.d.ts +60 -0
  86. package/dist/molecules/Popover/popover.d.ts +1 -0
  87. package/dist/molecules/SplitButton/index.d.ts +2 -0
  88. package/dist/molecules/SplitButton/split-button.d.ts +53 -0
  89. package/dist/molecules/Stepper/index.d.ts +2 -0
  90. package/dist/molecules/Stepper/stepper.d.ts +34 -0
  91. package/dist/molecules/Textarea/text-area.d.ts +5 -2
  92. package/dist/molecules/TimePicker/index.d.ts +2 -0
  93. package/dist/molecules/TimePicker/timepicker.d.ts +62 -0
  94. package/dist/organisms/Calendar/calendar.d.ts +54 -0
  95. package/dist/organisms/Calendar/index.d.ts +1 -0
  96. package/dist/organisms/Calendar/shared.d.ts +9 -0
  97. package/dist/organisms/Chatbot/chatbot.d.ts +10 -1
  98. package/dist/organisms/Chatbot/index.d.ts +1 -1
  99. package/dist/organisms/Combobox/combobox.d.ts +30 -0
  100. package/dist/organisms/DatePicker/datepicker.d.ts +33 -33
  101. package/dist/organisms/Drawer/drawer.d.ts +30 -0
  102. package/dist/organisms/Drawer/index.d.ts +1 -0
  103. package/dist/organisms/LeftMenu/index.d.ts +2 -0
  104. package/dist/organisms/LeftMenu/leftmenu-item.d.ts +14 -0
  105. package/dist/organisms/LeftMenu/leftmenu.d.ts +45 -0
  106. package/dist/organisms/Modal/modal.d.ts +29 -4
  107. package/dist/organisms/Tab/tab.d.ts +13 -1
  108. package/dist/organisms/Toast/index.d.ts +2 -0
  109. package/dist/organisms/Toast/toast-container.d.ts +42 -0
  110. package/dist/organisms/Toast/toast.d.ts +48 -0
  111. package/dist/organisms/TreeMenu/index.d.ts +1 -0
  112. package/dist/organisms/TreeMenu/tree-menu.d.ts +41 -0
  113. package/dist/pagination-B7jknoOz.js +360 -0
  114. package/dist/pagination-BkqbWBOn.cjs +169 -0
  115. package/dist/pagination.cjs +1 -0
  116. package/dist/pagination.js +4 -0
  117. package/dist/popover-CYDoeLKp.cjs +30 -0
  118. package/dist/{popover-B7tCqk3R.js → popover-DDaG8MSj.js} +21 -18
  119. package/dist/popover.cjs +1 -1
  120. package/dist/popover.js +1 -1
  121. package/dist/shared/types/button.types.d.ts +7 -0
  122. package/dist/styles/main.css +186 -182
  123. package/dist/switch-8RGGesy5.cjs +17 -0
  124. package/dist/switch-DNqPqH-R.js +64 -0
  125. package/dist/switch.cjs +1 -1
  126. package/dist/switch.js +1 -1
  127. package/dist/tab-CDMcFHvP.cjs +41 -0
  128. package/dist/tab-CuBCFGoO.js +204 -0
  129. package/dist/tab.cjs +1 -1
  130. package/dist/tab.js +1 -1
  131. package/dist/text-area-C73JxnqH.js +235 -0
  132. package/dist/text-area-Cprb-azV.cjs +51 -0
  133. package/dist/textarea.cjs +1 -1
  134. package/dist/textarea.js +1 -1
  135. package/dist/timepicker-CLJKWWGm.cjs +119 -0
  136. package/dist/timepicker-DMzGYd0p.js +316 -0
  137. package/dist/timepicker.cjs +1 -0
  138. package/dist/timepicker.js +4 -0
  139. package/dist/toast-container-6t6yEP9Y.cjs +64 -0
  140. package/dist/toast-container-B5v74b_5.js +274 -0
  141. package/dist/toast.cjs +1 -0
  142. package/dist/toast.js +6 -0
  143. package/dist/tree-menu-CkOPxr-W.js +154 -0
  144. package/dist/tree-menu-WNwZMreD.cjs +47 -0
  145. package/dist/tree-menu.cjs +1 -0
  146. package/dist/tree-menu.js +4 -0
  147. package/dist/ui-icon-BMJNdIOq.js +71 -0
  148. package/dist/ui-icon-DIucAQC_.cjs +22 -0
  149. package/package.json +99 -12
  150. package/dist/badge-BbhaO73N.cjs +0 -13
  151. package/dist/badge-DE7Tgd8Z.js +0 -71
  152. package/dist/button-C1EwOosO.js +0 -58
  153. package/dist/button-CDRccsk9.cjs +0 -10
  154. package/dist/card-n8ka8Zk-.cjs +0 -43
  155. package/dist/chatbot-Da_itUdJ.cjs +0 -160
  156. package/dist/chatbot-zkxngMRH.js +0 -481
  157. package/dist/checkbox-7Rb3WKGx.js +0 -119
  158. package/dist/checkbox-CdDTRdKV.cjs +0 -37
  159. package/dist/combobox-BJbI-Tgi.js +0 -268
  160. package/dist/combobox-pmE7bgEL.cjs +0 -99
  161. package/dist/datepicker-DFJx45C-.js +0 -750
  162. package/dist/datepicker-b9JGTTMx.cjs +0 -115
  163. package/dist/download-manager-BSIMTGaK.cjs +0 -97
  164. package/dist/formfield-D_7NFFoe.cjs +0 -27
  165. package/dist/formfield-d8fp9FTV.js +0 -118
  166. package/dist/input-BcnI1w3_.cjs +0 -46
  167. package/dist/input-Bj_7u8Iv.js +0 -192
  168. package/dist/modal-Bfc6WQSL.js +0 -110
  169. package/dist/modal-DQ8VFL-P.cjs +0 -39
  170. package/dist/popover-C2p5Pmts.cjs +0 -30
  171. package/dist/switch-Cpl53nRW.js +0 -64
  172. package/dist/switch-Rnnn10bn.cjs +0 -17
  173. package/dist/tab-BKdN4xAz.js +0 -176
  174. package/dist/tab-DcjAlXzU.cjs +0 -40
  175. package/dist/text-area-BkHdLnZj.cjs +0 -44
  176. package/dist/text-area-CC24lj8v.js +0 -204
@@ -0,0 +1,45 @@
1
+ import { LitElement } from "lit";
2
+ import "../../atoms/Button/button";
3
+ import "../../molecules/Input/input";
4
+ import "../../shared/icons/ui-icon";
5
+ import "../TreeMenu/tree-menu";
6
+ import "./leftmenu-item";
7
+ export declare class LeftMenu extends LitElement {
8
+ static styles: import("lit").CSSResult[];
9
+ open: boolean;
10
+ pinned: boolean;
11
+ closedWidth: number;
12
+ openWidth: number;
13
+ storageKey: string;
14
+ private _nodes;
15
+ private _expandedIds;
16
+ private _search;
17
+ private _searchExpandedIds;
18
+ private _hasCustomOpen;
19
+ private _hasCustomClosed;
20
+ private _isHydratingState;
21
+ connectedCallback(): void;
22
+ protected updated(changed: Map<string, unknown>): void;
23
+ private _loadPersistedState;
24
+ private _persistState;
25
+ private _onSlotChange;
26
+ private _onCustomOpenSlotChange;
27
+ private _onCustomClosedSlotChange;
28
+ private _mapItemElement;
29
+ private _setSearch;
30
+ private _handleSearchInput;
31
+ private _filterNodes;
32
+ private _toggleOpen;
33
+ private _togglePin;
34
+ private _toTreeItems;
35
+ private _effectiveExpandedIds;
36
+ private _handleTreeToggle;
37
+ private _handleTreeNodeClick;
38
+ private _handleTreeItemClick;
39
+ render(): import("lit-html").TemplateResult<1>;
40
+ }
41
+ declare global {
42
+ interface HTMLElementTagNameMap {
43
+ "logosphere-leftmenu": LeftMenu;
44
+ }
45
+ }
@@ -1,21 +1,46 @@
1
- import { LitElement } from "lit";
1
+ import { LitElement, nothing } from "lit";
2
+ import "../../shared/icons/ui-icon";
3
+ import "../../atoms/Button/button";
4
+ export type ModalSize = "sm" | "md" | "lg" | "xl" | "full";
2
5
  export declare class Modal extends LitElement {
3
6
  static styles: import("lit").CSSResult[];
4
7
  open: boolean;
5
8
  title: string;
9
+ size: ModalSize;
6
10
  closeOnEsc: boolean;
7
11
  closeOnBackdrop: boolean;
8
12
  showBack: boolean;
9
13
  showClose: boolean;
10
- hasFooterContent: boolean;
14
+ showIcon: boolean;
15
+ footer: boolean;
16
+ okLabel: string;
17
+ cancelLabel: string;
18
+ showCancel: boolean;
19
+ onOk?: () => void;
20
+ onCancel?: () => void;
21
+ private hasFooterSlot;
22
+ private hasHeaderSlot;
23
+ private dialogElement;
24
+ private previousActiveElement;
25
+ private focusableElements;
11
26
  connectedCallback(): void;
12
27
  disconnectedCallback(): void;
13
28
  openModal(): void;
14
29
  closeModal(): void;
15
30
  private setOpen;
31
+ private lockBodyScroll;
32
+ private unlockBodyScroll;
33
+ private trapFocus;
16
34
  private onKeyDown;
35
+ private handleTabKey;
17
36
  private onBackdropClick;
18
- private checkFooterContent;
37
+ private checkSlotContent;
38
+ private handleOk;
39
+ private handleCancel;
19
40
  updated(changedProperties: Map<string | number | symbol, unknown>): void;
20
- render(): import("lit-html").TemplateResult<1>;
41
+ private get modalId();
42
+ private get sizeClass();
43
+ private get showHeader();
44
+ render(): import("lit-html").TemplateResult<1> | typeof nothing;
45
+ private renderFooter;
21
46
  }
@@ -13,14 +13,26 @@ export declare class LogosphereTab extends LitElement {
13
13
  tabs: TabItem[];
14
14
  activeTab: string;
15
15
  lazy: boolean;
16
- variant: "default" | "card";
16
+ variant: "default" | "card" | "segmented";
17
17
  private _focusedIndex;
18
18
  private _renderedTabs;
19
19
  private tablist?;
20
+ private _pillInitialized;
21
+ private _pillResizeObserver?;
20
22
  connectedCallback(): void;
23
+ disconnectedCallback(): void;
21
24
  protected willUpdate(changedProperties: PropertyValues): void;
22
25
  private handleTabClick;
23
26
  private handleKeyDown;
27
+ protected updated(changedProperties: PropertyValues): void;
28
+ /**
29
+ * Observe the tablist so the pill is repositioned whenever the list gains or
30
+ * changes size — this covers the cases where the first render happens while
31
+ * the tab is hidden (nested/lazy panels) or before web fonts load, when
32
+ * layout measurements would otherwise be 0 / stale.
33
+ */
34
+ private _ensurePillObserver;
35
+ private _updateSegmentPill;
24
36
  private scrollTabIntoView;
25
37
  private renderTabButton;
26
38
  private renderTabPanel;
@@ -0,0 +1,2 @@
1
+ export * from "./toast";
2
+ export * from "./toast-container";
@@ -0,0 +1,42 @@
1
+ import { LitElement } from "lit";
2
+ import "./toast";
3
+ import type { ToastActionConfig, ToastType } from "./toast";
4
+ export type ToastOptions = {
5
+ id?: string;
6
+ type?: ToastType;
7
+ title?: string;
8
+ text: string;
9
+ icon?: string;
10
+ closeable?: boolean;
11
+ autoDismiss?: boolean;
12
+ duration?: number;
13
+ action?: ToastActionConfig;
14
+ };
15
+ export declare class LogosphereToastContainer extends LitElement {
16
+ static styles: import("lit").CSSResult[];
17
+ private visibleToasts;
18
+ private queuedToasts;
19
+ show(options: ToastOptions): string;
20
+ close(id: string): void;
21
+ clear(): void;
22
+ private dequeue;
23
+ private toToast;
24
+ private createId;
25
+ render(): import("lit-html").TemplateResult<1>;
26
+ }
27
+ export declare class ToastService {
28
+ private static container?;
29
+ static show(options: ToastOptions): string;
30
+ static success(options: Omit<ToastOptions, "type">): string;
31
+ static danger(options: Omit<ToastOptions, "type">): string;
32
+ static warning(options: Omit<ToastOptions, "type">): string;
33
+ static info(options: Omit<ToastOptions, "type">): string;
34
+ static close(id: string): void;
35
+ static clear(): void;
36
+ private static getContainer;
37
+ }
38
+ declare global {
39
+ interface HTMLElementTagNameMap {
40
+ "logosphere-toast-container": LogosphereToastContainer;
41
+ }
42
+ }
@@ -0,0 +1,48 @@
1
+ import { LitElement } from "lit";
2
+ import "../../shared/icons/ui-icon";
3
+ import "../../atoms/Button/button";
4
+ export type ToastType = "success" | "danger" | "warning" | "info";
5
+ export type ToastActionConfig = {
6
+ okayLabel?: string;
7
+ cancelLabel?: string;
8
+ onOkay?: () => void;
9
+ onCancel?: () => void;
10
+ closeOnAction?: boolean;
11
+ };
12
+ export declare class LogosphereToast extends LitElement {
13
+ static styles: import("lit").CSSResult[];
14
+ type: ToastType;
15
+ title: string;
16
+ text: string;
17
+ icon: string;
18
+ closeable: boolean;
19
+ duration: number;
20
+ autoDismiss: boolean;
21
+ action?: ToastActionConfig;
22
+ private isClosing;
23
+ private remainingMs;
24
+ private startedAt;
25
+ private timerId?;
26
+ private closeTimerId?;
27
+ connectedCallback(): void;
28
+ disconnectedCallback(): void;
29
+ updated(changedProperties: Map<string | number | symbol, unknown>): void;
30
+ close(reason?: "manual" | "auto"): void;
31
+ private get canAutoDismiss();
32
+ private get resolvedTitle();
33
+ private get resolvedText();
34
+ private get resolvedIcon();
35
+ private get hasActions();
36
+ private onActionClick;
37
+ private clearTimer;
38
+ private startTimer;
39
+ private pauseTimer;
40
+ private resumeTimer;
41
+ private restartTimer;
42
+ render(): import("lit-html").TemplateResult<1>;
43
+ }
44
+ declare global {
45
+ interface HTMLElementTagNameMap {
46
+ "logosphere-toast": LogosphereToast;
47
+ }
48
+ }
@@ -0,0 +1 @@
1
+ export * from "./tree-menu";
@@ -0,0 +1,41 @@
1
+ import { LitElement, type TemplateResult } from "lit";
2
+ import "../../shared/icons/ui-icon";
3
+ export interface TreeMenuItem {
4
+ id: string;
5
+ label: string;
6
+ disabled?: boolean;
7
+ active?: boolean;
8
+ iconName?: string;
9
+ iconHtml?: string | null;
10
+ children?: TreeMenuItem[];
11
+ onClick?: (item: TreeMenuItem) => void;
12
+ data?: unknown;
13
+ }
14
+ export declare class TreeMenu extends LitElement {
15
+ static styles: import("lit").CSSResult[];
16
+ items: TreeMenuItem[];
17
+ expandedIds: string[];
18
+ expandOnLabelClick: boolean;
19
+ chevronPosition: "left" | "right";
20
+ showLabels: boolean;
21
+ iconSize: number;
22
+ private _expandedSet;
23
+ protected willUpdate(changed: Map<string, unknown>): void;
24
+ private _isExpanded;
25
+ private _emitToggle;
26
+ private _emitItemClick;
27
+ private _emitNodeClick;
28
+ private _setExpanded;
29
+ private _toggle;
30
+ private _handleItemClick;
31
+ private _handleRowKeydown;
32
+ private _renderIcon;
33
+ private _renderChevron;
34
+ private _renderNode;
35
+ render(): TemplateResult<1>;
36
+ }
37
+ declare global {
38
+ interface HTMLElementTagNameMap {
39
+ "logosphere-tree-menu": TreeMenu;
40
+ }
41
+ }
@@ -0,0 +1,360 @@
1
+ import { LitElement as h, unsafeCSS as b, css as v, html as i, nothing as p } from "lit";
2
+ import { property as o, state as f, query as _ } from "lit/decorators.js";
3
+ import { live as y } from "lit/directives/live.js";
4
+ import "./ui-icon-BMJNdIOq.js";
5
+ import "./combobox-jak7Ac1m.js";
6
+ const x = ":host{display:block;width:100%}.pagination{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-4) var(--spacing-6);background-color:var(--color-body-bg);border-top:1px solid var(--color-border);font-family:var(--font-family-base);gap:var(--spacing-4)}.pagination--justify-end{justify-content:flex-end}.pagination--justify-start{justify-content:flex-start}.pagination--justify-center{justify-content:center}.pagination__nav{display:flex;align-items:center;gap:var(--spacing-1)}.pagination__nav-group{display:flex;align-items:center}.pagination__btn{display:flex;align-items:center;justify-content:center;padding:var(--spacing-2);border:none;background:transparent;border-radius:var(--radius-base);cursor:pointer;color:var(--color-secondary);transition:background-color .15s ease,color .15s ease,opacity .15s ease}.pagination__btn:hover:not(:disabled){background-color:var(--color-body-bg-hover)}.pagination__btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.pagination__btn:disabled{opacity:.4;cursor:not-allowed}.pagination__btn--icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:var(--spacing-2);border:1px solid var(--color-border);background-color:var(--color-body-bg);border-radius:var(--radius-base);cursor:pointer;color:var(--color-secondary);transition:background-color .15s ease,border-color .15s ease,opacity .15s ease}.pagination__btn--icon:hover:not(:disabled){background-color:var(--color-body-bg-hover);border-color:var(--color-border-hover)}.pagination__btn--icon:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.pagination__btn--icon:disabled{opacity:.4;cursor:not-allowed}.pagination__btn--text{display:flex;align-items:center;justify-content:center;gap:var(--spacing-1);height:32px;min-width:100px;padding:var(--spacing-1) var(--spacing-3);border:1px solid var(--color-border);background-color:var(--color-body-bg);border-radius:var(--radius-base);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-secondary);cursor:pointer;transition:all .15s ease}.pagination__btn--text:hover:not(:disabled){background-color:var(--color-body-bg-hover);border-color:var(--color-border-hover)}.pagination__btn--text:disabled{color:var(--color-secondary-disabled);cursor:not-allowed}.pagination__btn--number{display:flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:var(--spacing-1) var(--spacing-3);border:1px solid var(--color-border);background-color:var(--color-body-bg);border-radius:var(--radius-base);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-secondary);cursor:pointer;transition:all .15s ease}.pagination__btn--number:hover:not(:disabled):not(.pagination__btn--active){background-color:var(--color-body-bg-hover)}.pagination__btn--active{background-color:var(--color-secondary);border-color:var(--color-secondary);color:#fff;font-weight:var(--font-weight-semibold)}.pagination__btn--ellipsis{border:none;background:transparent;cursor:default;min-width:32px}.pagination__btn--ellipsis:hover{background:transparent}.pagination__input-container{display:flex;align-items:center;justify-content:center;min-width:32px;height:32px}.pagination__input{width:100%;height:100%;min-width:32px;padding:0;border:1px solid var(--color-border);border-radius:var(--radius-base);background-color:var(--color-body-bg);font-size:var(--font-size-sm);font-weight:var(--font-weight-regular);color:var(--color-body-text);text-align:center;outline:none;transition:border-color .15s ease}.pagination__input:focus{border-color:var(--color-primary)}.pagination__input::-webkit-outer-spin-button,.pagination__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.pagination__input[type=number]{-moz-appearance:textfield}.pagination__separator{font-size:var(--font-size-xs);font-weight:var(--font-weight-regular);color:var(--color-tertiary);line-height:18px;letter-spacing:-.12px;margin-right:var(--spacing-1)}.pagination__info{display:flex;align-items:center;gap:var(--spacing-2)}.pagination__page-info{display:flex;align-items:center;gap:var(--spacing-1);font-size:var(--font-size-xs);line-height:18px;letter-spacing:-.12px}.pagination__page-info-text{color:var(--color-secondary)}.pagination__page-info-separator{color:var(--color-tertiary)}.pagination__total{display:flex;align-items:center;gap:var(--spacing-1);font-size:var(--font-size-xs);line-height:18px;letter-spacing:-.12px}.pagination__total-separator{color:var(--color-tertiary)}.pagination__total-text{color:var(--color-secondary)}.pagination__page-size{display:flex;align-items:center}@media(max-width:768px){.pagination{flex-wrap:wrap;gap:var(--spacing-3);padding:var(--spacing-3) var(--spacing-4)}.pagination__btn--text{min-width:80px;font-size:var(--font-size-xs)}}@media(max-width:480px){.pagination__nav,.pagination__info{flex-wrap:wrap;justify-content:center}}";
7
+ var m = Object.defineProperty, n = (u, t, e, r) => {
8
+ for (var s = void 0, l = u.length - 1, g; l >= 0; l--)
9
+ (g = u[l]) && (s = g(t, e, s) || s);
10
+ return s && m(t, e, s), s;
11
+ };
12
+ const c = class c extends h {
13
+ constructor() {
14
+ super(...arguments), this.variant = "default", this.page = 1, this.pageSize = 25, this.total = 0, this.pageSizeOptions = [10, 25, 50, 100], this.showPageSize = !0, this.showTotal = !0, this.disabled = !1, this.prevLabel = "Önceki", this.nextLabel = "Sonraki", this.pageLabel = "Sayfa", this.perPageLabel = "/ sayfa", this.totalLabel = "kayıt", this.inputValue = "1", this.goFirst = () => {
15
+ this.canGoPrev && this.goToPage(1);
16
+ }, this.goPrev = () => {
17
+ this.canGoPrev && this.goToPage(this.page - 1);
18
+ }, this.goNext = () => {
19
+ this.canGoNext && this.goToPage(this.page + 1);
20
+ }, this.goLast = () => {
21
+ this.canGoNext && this.goToPage(this.totalPages);
22
+ }, this.handleInputChange = (t) => {
23
+ const e = t.target;
24
+ this.inputValue = e.value;
25
+ }, this.handleInputBlur = () => {
26
+ const t = parseInt(this.inputValue, 10);
27
+ isNaN(t) ? this.inputValue = String(this.page) : this.goToPage(t);
28
+ }, this.handleInputKeydown = (t) => {
29
+ t.key === "Enter" && t.target.blur();
30
+ }, this.handlePageSizeChange = (t) => {
31
+ const e = t.detail?.value?.[0];
32
+ if (e) {
33
+ const r = e.value;
34
+ r !== this.pageSize && (this.pageSize = r, this.page = 1, this.emitPageChange());
35
+ }
36
+ };
37
+ }
38
+ get totalPages() {
39
+ return Math.max(1, Math.ceil(this.total / this.pageSize));
40
+ }
41
+ get canGoPrev() {
42
+ return this.page > 1 && !this.disabled;
43
+ }
44
+ get canGoNext() {
45
+ return this.page < this.totalPages && !this.disabled;
46
+ }
47
+ firstUpdated() {
48
+ this.updateComboboxSelection();
49
+ }
50
+ updated(t) {
51
+ super.updated(t), t.has("page") && (this.inputValue = String(this.page)), t.has("pageSize") && this.updateComboboxSelection();
52
+ }
53
+ updateComboboxSelection() {
54
+ this._combobox && this.showPageSize && this._combobox.setSelected(this.selectedPageSizeItem);
55
+ }
56
+ emitPageChange() {
57
+ this.dispatchEvent(new CustomEvent("page-change", {
58
+ bubbles: !0,
59
+ composed: !0,
60
+ detail: {
61
+ page: this.page,
62
+ pageSize: this.pageSize,
63
+ totalPages: this.totalPages
64
+ }
65
+ }));
66
+ }
67
+ goToPage(t) {
68
+ const e = Math.max(1, Math.min(t, this.totalPages));
69
+ e !== this.page && (this.page = e, this.emitPageChange());
70
+ }
71
+ get pageSizeItems() {
72
+ return this.pageSizeOptions.map((t) => ({
73
+ label: `${t} ${this.perPageLabel}`,
74
+ value: t
75
+ }));
76
+ }
77
+ get selectedPageSizeItem() {
78
+ return [{ label: `${this.pageSize} ${this.perPageLabel}`, value: this.pageSize }];
79
+ }
80
+ getPageNumbers() {
81
+ const t = [], e = this.totalPages, r = this.page, s = 1;
82
+ if (e <= 7)
83
+ for (let l = 1; l <= e; l++) t.push(l);
84
+ else {
85
+ t.push(1), r > 3 && t.push("ellipsis");
86
+ const l = Math.max(2, r - s), g = Math.min(e - 1, r + s);
87
+ for (let d = l; d <= g; d++)
88
+ t.includes(d) || t.push(d);
89
+ r < e - 2 && t.push("ellipsis"), t.includes(e) || t.push(e);
90
+ }
91
+ return t;
92
+ }
93
+ renderNavButtons(t = !1) {
94
+ const e = t ? "pagination__btn--icon" : "pagination__btn";
95
+ return i`
96
+ <div class="pagination__nav-group">
97
+ <button
98
+ type="button"
99
+ class="${e}"
100
+ ?disabled=${!this.canGoPrev}
101
+ @click=${this.goFirst}
102
+ aria-label="İlk sayfa"
103
+ >
104
+ <ui-icon name="uil-angle-double-left" size="16"></ui-icon>
105
+ </button>
106
+ <button
107
+ type="button"
108
+ class="${e}"
109
+ ?disabled=${!this.canGoPrev}
110
+ @click=${this.goPrev}
111
+ aria-label="Önceki sayfa"
112
+ >
113
+ <ui-icon name="uil-angle-left" size="16"></ui-icon>
114
+ </button>
115
+ </div>
116
+ `;
117
+ }
118
+ renderNavButtonsAfter(t = !1) {
119
+ const e = t ? "pagination__btn--icon" : "pagination__btn";
120
+ return i`
121
+ <div class="pagination__nav-group">
122
+ <button
123
+ type="button"
124
+ class="${e}"
125
+ ?disabled=${!this.canGoNext}
126
+ @click=${this.goNext}
127
+ aria-label="Sonraki sayfa"
128
+ >
129
+ <ui-icon name="uil-angle-right" size="16"></ui-icon>
130
+ </button>
131
+ <button
132
+ type="button"
133
+ class="${e}"
134
+ ?disabled=${!this.canGoNext}
135
+ @click=${this.goLast}
136
+ aria-label="Son sayfa"
137
+ >
138
+ <ui-icon name="uil-angle-double-right" size="16"></ui-icon>
139
+ </button>
140
+ </div>
141
+ `;
142
+ }
143
+ renderPageInput() {
144
+ return i`
145
+ <div class="pagination__input-container">
146
+ <input
147
+ type="number"
148
+ class="pagination__input"
149
+ .value=${y(this.inputValue)}
150
+ min="1"
151
+ max=${this.totalPages}
152
+ ?disabled=${this.disabled}
153
+ @input=${this.handleInputChange}
154
+ @blur=${this.handleInputBlur}
155
+ @keydown=${this.handleInputKeydown}
156
+ aria-label="Sayfa numarası"
157
+ />
158
+ </div>
159
+ <span class="pagination__separator">/ ${this.totalPages}</span>
160
+ `;
161
+ }
162
+ renderPrevNextButtons() {
163
+ return i`
164
+ <button
165
+ type="button"
166
+ class="pagination__btn--text"
167
+ ?disabled=${!this.canGoPrev}
168
+ @click=${this.goPrev}
169
+ >
170
+ <ui-icon name="uil-angle-left" size="16"></ui-icon>
171
+ ${this.prevLabel}
172
+ </button>
173
+ <button
174
+ type="button"
175
+ class="pagination__btn--text"
176
+ ?disabled=${!this.canGoNext}
177
+ @click=${this.goNext}
178
+ >
179
+ ${this.nextLabel}
180
+ <ui-icon name="uil-angle-right" size="16"></ui-icon>
181
+ </button>
182
+ `;
183
+ }
184
+ renderPageInfo() {
185
+ return i`
186
+ <div class="pagination__page-info">
187
+ <span class="pagination__page-info-text">${this.pageLabel} ${this.page}</span>
188
+ <span class="pagination__page-info-separator">/</span>
189
+ <span class="pagination__page-info-text">${this.totalPages}</span>
190
+ </div>
191
+ `;
192
+ }
193
+ renderNumberButtons() {
194
+ const t = this.getPageNumbers();
195
+ return i`
196
+ ${t.map(
197
+ (e, r) => e === "ellipsis" ? i`
198
+ <span
199
+ class="pagination__btn--number pagination__btn--ellipsis"
200
+ key="ellipsis-${r}"
201
+ >...</span>
202
+ ` : i`
203
+ <button
204
+ type="button"
205
+ class="pagination__btn--number ${e === this.page ? "pagination__btn--active" : ""}"
206
+ ?disabled=${this.disabled}
207
+ @click=${() => this.goToPage(e)}
208
+ aria-label="Sayfa ${e}"
209
+ aria-current=${e === this.page ? "page" : p}
210
+ >
211
+ ${e}
212
+ </button>
213
+ `
214
+ )}
215
+ `;
216
+ }
217
+ renderPageSizeDropdown() {
218
+ return this.showPageSize ? i`
219
+ <div class="pagination__page-size">
220
+ <logosphere-combobox
221
+ .items=${this.pageSizeItems}
222
+ .disabled=${this.disabled}
223
+ .clearable=${!1}
224
+ optionLabel="label"
225
+ optionValue="value"
226
+ placeholder=""
227
+ @change=${this.handlePageSizeChange}
228
+ ></logosphere-combobox>
229
+ </div>
230
+ ` : p;
231
+ }
232
+ renderTotalInfo() {
233
+ return this.showTotal ? i`
234
+ <div class="pagination__total">
235
+ <span class="pagination__total-separator">/</span>
236
+ <span class="pagination__total-text">${this.total} ${this.totalLabel}</span>
237
+ </div>
238
+ ` : p;
239
+ }
240
+ renderDefault() {
241
+ return i`
242
+ <div class="pagination__nav">
243
+ ${this.renderNavButtons()}
244
+ ${this.renderPageInput()}
245
+ ${this.renderNavButtonsAfter()}
246
+ </div>
247
+ <div class="pagination__info">
248
+ ${this.renderPageSizeDropdown()}
249
+ ${this.renderTotalInfo()}
250
+ </div>
251
+ `;
252
+ }
253
+ renderPrevNext() {
254
+ return i`
255
+ <div class="pagination__nav" style="gap: 8px;">
256
+ ${this.renderPrevNextButtons()}
257
+ </div>
258
+ <div class="pagination__info">
259
+ ${this.renderPageInfo()}
260
+ </div>
261
+ `;
262
+ }
263
+ renderPrevNextInverted() {
264
+ return i`
265
+ <div class="pagination__info">
266
+ ${this.renderPageInfo()}
267
+ </div>
268
+ <div class="pagination__nav" style="gap: 8px;">
269
+ ${this.renderPrevNextButtons()}
270
+ </div>
271
+ `;
272
+ }
273
+ renderPrevNextOnly() {
274
+ return i`
275
+ <div class="pagination__nav" style="gap: 8px; margin-left: auto;">
276
+ ${this.renderPrevNextButtons()}
277
+ </div>
278
+ `;
279
+ }
280
+ renderNumberButtonsVariant() {
281
+ return i`
282
+ <div class="pagination__nav">
283
+ ${this.renderNavButtons(!0)}
284
+ ${this.renderNumberButtons()}
285
+ ${this.renderNavButtonsAfter(!0)}
286
+ </div>
287
+ <div class="pagination__info">
288
+ ${this.renderPageSizeDropdown()}
289
+ ${this.renderTotalInfo()}
290
+ </div>
291
+ `;
292
+ }
293
+ render() {
294
+ const t = this.variant === "prev-next-only" ? "pagination--justify-end" : "";
295
+ return i`
296
+ <nav
297
+ class="pagination ${t}"
298
+ role="navigation"
299
+ aria-label="Sayfalama"
300
+ >
301
+ ${this.variant === "default" ? this.renderDefault() : p}
302
+ ${this.variant === "prev-next" ? this.renderPrevNext() : p}
303
+ ${this.variant === "prev-next-inverted" ? this.renderPrevNextInverted() : p}
304
+ ${this.variant === "prev-next-only" ? this.renderPrevNextOnly() : p}
305
+ ${this.variant === "number-buttons" ? this.renderNumberButtonsVariant() : p}
306
+ </nav>
307
+ `;
308
+ }
309
+ };
310
+ c.styles = [v`${b(x)}`];
311
+ let a = c;
312
+ n([
313
+ o({ type: String })
314
+ ], a.prototype, "variant");
315
+ n([
316
+ o({ type: Number })
317
+ ], a.prototype, "page");
318
+ n([
319
+ o({ type: Number })
320
+ ], a.prototype, "pageSize");
321
+ n([
322
+ o({ type: Number })
323
+ ], a.prototype, "total");
324
+ n([
325
+ o({ type: Array })
326
+ ], a.prototype, "pageSizeOptions");
327
+ n([
328
+ o({ type: Boolean })
329
+ ], a.prototype, "showPageSize");
330
+ n([
331
+ o({ type: Boolean })
332
+ ], a.prototype, "showTotal");
333
+ n([
334
+ o({ type: Boolean })
335
+ ], a.prototype, "disabled");
336
+ n([
337
+ o({ type: String })
338
+ ], a.prototype, "prevLabel");
339
+ n([
340
+ o({ type: String })
341
+ ], a.prototype, "nextLabel");
342
+ n([
343
+ o({ type: String })
344
+ ], a.prototype, "pageLabel");
345
+ n([
346
+ o({ type: String })
347
+ ], a.prototype, "perPageLabel");
348
+ n([
349
+ o({ type: String })
350
+ ], a.prototype, "totalLabel");
351
+ n([
352
+ f()
353
+ ], a.prototype, "inputValue");
354
+ n([
355
+ _("logosphere-combobox")
356
+ ], a.prototype, "_combobox");
357
+ customElements.get("logosphere-pagination") || customElements.define("logosphere-pagination", a);
358
+ export {
359
+ a as P
360
+ };