framepexls-ui-lib 2.2.6 → 2.2.8

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 (31) hide show
  1. package/dist/AccessibilityFab.d.mts +2 -1
  2. package/dist/AccessibilityFab.d.ts +2 -1
  3. package/dist/AccessibilityFab.js +12 -8
  4. package/dist/AccessibilityFab.mjs +13 -9
  5. package/dist/AppTopbar.js +1 -1
  6. package/dist/AppTopbar.mjs +1 -1
  7. package/dist/ComboSelect.js +4 -3
  8. package/dist/ComboSelect.mjs +4 -3
  9. package/dist/DateTimeField.js +2 -1
  10. package/dist/DateTimeField.mjs +2 -1
  11. package/dist/Dropdown.js +3 -0
  12. package/dist/Dropdown.mjs +3 -0
  13. package/dist/Select.js +2 -0
  14. package/dist/Select.mjs +2 -0
  15. package/dist/Sidebar.js +3 -3
  16. package/dist/Sidebar.mjs +3 -3
  17. package/dist/SupportChatWidget.d.mts +2 -0
  18. package/dist/SupportChatWidget.d.ts +2 -0
  19. package/dist/SupportChatWidget.js +5 -3
  20. package/dist/SupportChatWidget.mjs +5 -3
  21. package/dist/TimePanel.js +2 -1
  22. package/dist/TimePanel.mjs +2 -1
  23. package/dist/TimePopover.js +4 -3
  24. package/dist/TimePopover.mjs +4 -3
  25. package/dist/TimeRangeField.js +3 -2
  26. package/dist/TimeRangeField.mjs +3 -2
  27. package/dist/theme/FontSizeController.js +1 -1
  28. package/dist/theme/FontSizeController.mjs +1 -1
  29. package/dist/theme/ThemeController.js +2 -1
  30. package/dist/theme/ThemeController.mjs +2 -1
  31. package/package.json +1 -1
package/dist/AccessibilityFab.d.mts CHANGED
@@ -18,10 +18,11 @@ type AccessibilityFabProps = {
18
18
  className?: string;
19
19
  fontFamilyControl?: React__default.ReactNode;
20
20
  labels?: AccessibilityFabLabels;
21
+ position?: "bottom-left" | "bottom-right";
21
22
  showDescriptions?: boolean;
22
23
  themeToggleProps?: Omit<ThemeToggleProps, "className">;
23
24
  fontSizeProps?: Omit<FontSizeControllerProps, "className">;
24
25
  };
25
- declare function AccessibilityFab({ className, fontFamilyControl, labels, showDescriptions, themeToggleProps, fontSizeProps, }: AccessibilityFabProps): React__default.JSX.Element;
26
+ declare function AccessibilityFab({ className, fontFamilyControl, labels, position, showDescriptions, themeToggleProps, fontSizeProps, }: AccessibilityFabProps): React__default.JSX.Element;
26
27
 
27
28
  export { type AccessibilityFabLabels, type AccessibilityFabProps, AccessibilityFab as default };
package/dist/AccessibilityFab.d.ts CHANGED
@@ -18,10 +18,11 @@ type AccessibilityFabProps = {
18
18
  className?: string;
19
19
  fontFamilyControl?: React__default.ReactNode;
20
20
  labels?: AccessibilityFabLabels;
21
+ position?: "bottom-left" | "bottom-right";
21
22
  showDescriptions?: boolean;
22
23
  themeToggleProps?: Omit<ThemeToggleProps, "className">;
23
24
  fontSizeProps?: Omit<FontSizeControllerProps, "className">;
24
25
  };
25
- declare function AccessibilityFab({ className, fontFamilyControl, labels, showDescriptions, themeToggleProps, fontSizeProps, }: AccessibilityFabProps): React__default.JSX.Element;
26
+ declare function AccessibilityFab({ className, fontFamilyControl, labels, position, showDescriptions, themeToggleProps, fontSizeProps, }: AccessibilityFabProps): React__default.JSX.Element;
26
27
 
27
28
  export { type AccessibilityFabLabels, type AccessibilityFabProps, AccessibilityFab as default };
package/dist/AccessibilityFab.js CHANGED
@@ -43,6 +43,7 @@ function AccessibilityFab({
43
43
  className,
44
44
  fontFamilyControl,
45
45
  labels,
46
+ position = "bottom-right",
46
47
  showDescriptions = false,
47
48
  themeToggleProps,
48
49
  fontSizeProps
@@ -77,6 +78,8 @@ function AccessibilityFab({
77
78
  const path = typeof event.composedPath === "function" ? event.composedPath() : [];
78
79
  if (popRef.current && path.includes(popRef.current)) return;
79
80
  if (btnRef.current && path.includes(btnRef.current)) return;
81
+ const target = event.target;
82
+ if (target == null ? void 0 : target.closest("[data-fx-keep-open], [data-fx-overlay]")) return;
80
83
  setOpen(false);
81
84
  };
82
85
  window.addEventListener("keydown", onKeyDown);
@@ -86,7 +89,8 @@ function AccessibilityFab({
86
89
  window.removeEventListener("pointerdown", onPointerDown, true);
87
90
  };
88
91
  }, [open]);
89
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: ["fixed bottom-5 right-5 z-[70] flex items-end gap-3", className != null ? className : ""].join(" "), children: [
92
+ const positionClass = position === "bottom-left" ? "fixed bottom-5 left-5 z-[2147483645] flex flex-row-reverse items-end gap-3" : "fixed bottom-5 right-5 z-[2147483645] flex items-end gap-3";
93
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: [positionClass, className != null ? className : ""].join(" "), children: [
90
94
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_framer_motion.LazyMotion, { features: import_framer_motion.domAnimation, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_framer_motion.AnimatePresence, { children: open ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
91
95
  import_framer_motion.m.div,
92
96
  {
@@ -95,7 +99,7 @@ function AccessibilityFab({
95
99
  animate: reduceMotion ? { opacity: 1 } : { opacity: 1, y: 0, scale: 1 },
96
100
  exit: reduceMotion ? { opacity: 0 } : { opacity: 0, y: 10, scale: 0.98 },
97
101
  transition: reduceMotion ? { duration: 0 } : { duration: 0.18, ease: "easeOut" },
98
- className: "w-[min(360px,calc(100vw-1.5rem))] overflow-hidden rounded-[1.75rem] border border-[color-mix(in_oklab,var(--border)_72%,transparent)] bg-[color-mix(in_oklab,var(--surface)_84%,transparent)] shadow-[0_30px_90px_rgba(2,12,27,0.24)] backdrop-blur-xl",
102
+ className: "w-[min(21rem,calc(100vw-4.8rem))] overflow-hidden rounded-2xl border border-[var(--border)] bg-[color-mix(in_oklab,var(--card)_94%,transparent)] shadow-[0_24px_58px_rgba(6,19,22,0.14)] backdrop-blur-xl dark:shadow-[0_24px_58px_rgba(0,0,0,0.3)]",
99
103
  children: [
100
104
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-3 border-b border-[color-mix(in_oklab,var(--border)_70%,transparent)] px-4 py-3", children: [
101
105
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
@@ -108,7 +112,7 @@ function AccessibilityFab({
108
112
  unstyled: true,
109
113
  type: "button",
110
114
  onClick: () => setOpen(false),
111
- className: "grid size-9 place-items-center rounded-2xl border border-[color-mix(in_oklab,var(--border)_70%,transparent)] bg-[color-mix(in_oklab,var(--card)_55%,transparent)] text-[var(--foreground)] transition hover:bg-[color-mix(in_oklab,var(--card)_65%,transparent)]",
115
+ className: "grid size-9 place-items-center rounded-2xl border border-[var(--border)] bg-[color-mix(in_oklab,var(--card)_80%,transparent)] text-[var(--foreground)] transition hover:border-[color-mix(in_oklab,var(--primary)_36%,var(--border))] hover:bg-[var(--surface)]",
112
116
  "aria-label": text.close,
113
117
  title: text.close,
114
118
  children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_iconos.CloseIcon, { className: "size-4", "aria-hidden": true })
@@ -116,21 +120,21 @@ function AccessibilityFab({
116
120
  )
117
121
  ] }),
118
122
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-3 p-4", children: [
119
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-3 rounded-2xl border border-[color-mix(in_oklab,var(--border)_70%,transparent)] bg-[color-mix(in_oklab,var(--card)_55%,transparent)] p-3", children: [
123
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-3 rounded-2xl border border-[var(--border)] bg-[color-mix(in_oklab,var(--card)_72%,transparent)] p-3", children: [
120
124
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0", children: [
121
125
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-sm font-semibold text-[var(--foreground)]", children: text.appearanceTitle }),
122
126
  showDescriptions ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "mt-0.5 text-xs text-[var(--muted)]", children: text.appearanceDescription }) : null
123
127
  ] }),
124
128
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ThemeToggle.default, { cycle: ["light", "dark"], ...themeToggleProps })
125
129
  ] }),
126
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-3 rounded-2xl border border-[color-mix(in_oklab,var(--border)_70%,transparent)] bg-[color-mix(in_oklab,var(--card)_55%,transparent)] p-3", children: [
130
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-3 rounded-2xl border border-[var(--border)] bg-[color-mix(in_oklab,var(--card)_72%,transparent)] p-3", children: [
127
131
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0", children: [
128
132
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-sm font-semibold text-[var(--foreground)]", children: text.fontSizeTitle }),
129
133
  showDescriptions ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "mt-0.5 text-xs text-[var(--muted)]", children: text.fontSizeDescription }) : null
130
134
  ] }),
131
135
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_FontSizeController.default, { ...fontSizeProps })
132
136
  ] }),
133
- fontFamilyControl ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-3 rounded-2xl border border-[color-mix(in_oklab,var(--border)_70%,transparent)] bg-[color-mix(in_oklab,var(--card)_55%,transparent)] p-3", children: [
137
+ fontFamilyControl ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-3 rounded-2xl border border-[var(--border)] bg-[color-mix(in_oklab,var(--card)_72%,transparent)] p-3", children: [
134
138
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0", children: [
135
139
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-sm font-semibold text-[var(--foreground)]", children: text.fontFamilyTitle }),
136
140
  showDescriptions ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "mt-0.5 text-xs text-[var(--muted)]", children: text.fontFamilyDescription }) : null
@@ -148,10 +152,10 @@ function AccessibilityFab({
148
152
  ref: btnRef,
149
153
  type: "button",
150
154
  onClick: () => setOpen((value) => !value),
151
- className: "group grid size-12 place-items-center rounded-2xl border border-[color-mix(in_oklab,var(--border)_70%,transparent)] bg-[color-mix(in_oklab,var(--surface)_84%,transparent)] text-[var(--foreground)] shadow-[0_24px_60px_rgba(15,23,42,0.22)] backdrop-blur-xl transition hover:scale-[1.02] hover:bg-[color-mix(in_oklab,var(--surface)_92%,transparent)]",
155
+ className: "group grid size-12 place-items-center rounded-2xl border border-[var(--border)] bg-[color-mix(in_oklab,var(--card)_94%,transparent)] text-[var(--primary)] shadow-[0_20px_48px_rgba(6,19,22,0.13)] backdrop-blur-xl transition duration-200 hover:-translate-y-0.5 hover:border-[color-mix(in_oklab,var(--primary)_38%,var(--border))] hover:bg-[var(--surface)] hover:text-[var(--foreground)] hover:shadow-[0_24px_58px_rgba(6,19,22,0.18)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[color-mix(in_oklab,var(--primary)_42%,transparent)] dark:shadow-[0_20px_48px_rgba(0,0,0,0.28)] dark:hover:shadow-[0_24px_58px_rgba(0,0,0,0.36)]",
152
156
  "aria-label": open ? text.close : text.open,
153
157
  title: open ? text.close : text.title,
154
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_iconos.TextAaIcon, { className: "size-5 opacity-90 transition group-hover:opacity-100", "aria-hidden": true })
158
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_iconos.PersonArmsSpreadIcon, { className: "size-5 opacity-95 transition group-hover:scale-105 group-hover:opacity-100", "aria-hidden": true })
155
159
  }
156
160
  )
157
161
  ] });
package/dist/AccessibilityFab.mjs CHANGED
@@ -11,11 +11,12 @@ import {
11
11
  import Button from "./Button.mjs";
12
12
  import FontSizeController from "./theme/FontSizeController.mjs";
13
13
  import ThemeToggle from "./theme/ThemeToggle.mjs";
14
- import { CloseIcon, TextAaIcon } from "./iconos/index.mjs";
14
+ import { CloseIcon, PersonArmsSpreadIcon } from "./iconos/index.mjs";
15
15
  function AccessibilityFab({
16
16
  className,
17
17
  fontFamilyControl,
18
18
  labels,
19
+ position = "bottom-right",
19
20
  showDescriptions = false,
20
21
  themeToggleProps,
21
22
  fontSizeProps
@@ -50,6 +51,8 @@ function AccessibilityFab({
50
51
  const path = typeof event.composedPath === "function" ? event.composedPath() : [];
51
52
  if (popRef.current && path.includes(popRef.current)) return;
52
53
  if (btnRef.current && path.includes(btnRef.current)) return;
54
+ const target = event.target;
55
+ if (target == null ? void 0 : target.closest("[data-fx-keep-open], [data-fx-overlay]")) return;
53
56
  setOpen(false);
54
57
  };
55
58
  window.addEventListener("keydown", onKeyDown);
@@ -59,7 +62,8 @@ function AccessibilityFab({
59
62
  window.removeEventListener("pointerdown", onPointerDown, true);
60
63
  };
61
64
  }, [open]);
62
- return /* @__PURE__ */ jsxs("div", { className: ["fixed bottom-5 right-5 z-[70] flex items-end gap-3", className != null ? className : ""].join(" "), children: [
65
+ const positionClass = position === "bottom-left" ? "fixed bottom-5 left-5 z-[2147483645] flex flex-row-reverse items-end gap-3" : "fixed bottom-5 right-5 z-[2147483645] flex items-end gap-3";
66
+ return /* @__PURE__ */ jsxs("div", { className: [positionClass, className != null ? className : ""].join(" "), children: [
63
67
  /* @__PURE__ */ jsx(LazyMotion, { features: domAnimation, children: /* @__PURE__ */ jsx(AnimatePresence, { children: open ? /* @__PURE__ */ jsxs(
64
68
  m.div,
65
69
  {
@@ -68,7 +72,7 @@ function AccessibilityFab({
68
72
  animate: reduceMotion ? { opacity: 1 } : { opacity: 1, y: 0, scale: 1 },
69
73
  exit: reduceMotion ? { opacity: 0 } : { opacity: 0, y: 10, scale: 0.98 },
70
74
  transition: reduceMotion ? { duration: 0 } : { duration: 0.18, ease: "easeOut" },
71
- className: "w-[min(360px,calc(100vw-1.5rem))] overflow-hidden rounded-[1.75rem] border border-[color-mix(in_oklab,var(--border)_72%,transparent)] bg-[color-mix(in_oklab,var(--surface)_84%,transparent)] shadow-[0_30px_90px_rgba(2,12,27,0.24)] backdrop-blur-xl",
75
+ className: "w-[min(21rem,calc(100vw-4.8rem))] overflow-hidden rounded-2xl border border-[var(--border)] bg-[color-mix(in_oklab,var(--card)_94%,transparent)] shadow-[0_24px_58px_rgba(6,19,22,0.14)] backdrop-blur-xl dark:shadow-[0_24px_58px_rgba(0,0,0,0.3)]",
72
76
  children: [
73
77
  /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 border-b border-[color-mix(in_oklab,var(--border)_70%,transparent)] px-4 py-3", children: [
74
78
  /* @__PURE__ */ jsxs("div", { children: [
@@ -81,7 +85,7 @@ function AccessibilityFab({
81
85
  unstyled: true,
82
86
  type: "button",
83
87
  onClick: () => setOpen(false),
84
- className: "grid size-9 place-items-center rounded-2xl border border-[color-mix(in_oklab,var(--border)_70%,transparent)] bg-[color-mix(in_oklab,var(--card)_55%,transparent)] text-[var(--foreground)] transition hover:bg-[color-mix(in_oklab,var(--card)_65%,transparent)]",
88
+ className: "grid size-9 place-items-center rounded-2xl border border-[var(--border)] bg-[color-mix(in_oklab,var(--card)_80%,transparent)] text-[var(--foreground)] transition hover:border-[color-mix(in_oklab,var(--primary)_36%,var(--border))] hover:bg-[var(--surface)]",
85
89
  "aria-label": text.close,
86
90
  title: text.close,
87
91
  children: /* @__PURE__ */ jsx(CloseIcon, { className: "size-4", "aria-hidden": true })
@@ -89,21 +93,21 @@ function AccessibilityFab({
89
93
  )
90
94
  ] }),
91
95
  /* @__PURE__ */ jsxs("div", { className: "space-y-3 p-4", children: [
92
- /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 rounded-2xl border border-[color-mix(in_oklab,var(--border)_70%,transparent)] bg-[color-mix(in_oklab,var(--card)_55%,transparent)] p-3", children: [
96
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 rounded-2xl border border-[var(--border)] bg-[color-mix(in_oklab,var(--card)_72%,transparent)] p-3", children: [
93
97
  /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
94
98
  /* @__PURE__ */ jsx("div", { className: "text-sm font-semibold text-[var(--foreground)]", children: text.appearanceTitle }),
95
99
  showDescriptions ? /* @__PURE__ */ jsx("div", { className: "mt-0.5 text-xs text-[var(--muted)]", children: text.appearanceDescription }) : null
96
100
  ] }),
97
101
  /* @__PURE__ */ jsx(ThemeToggle, { cycle: ["light", "dark"], ...themeToggleProps })
98
102
  ] }),
99
- /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 rounded-2xl border border-[color-mix(in_oklab,var(--border)_70%,transparent)] bg-[color-mix(in_oklab,var(--card)_55%,transparent)] p-3", children: [
103
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 rounded-2xl border border-[var(--border)] bg-[color-mix(in_oklab,var(--card)_72%,transparent)] p-3", children: [
100
104
  /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
101
105
  /* @__PURE__ */ jsx("div", { className: "text-sm font-semibold text-[var(--foreground)]", children: text.fontSizeTitle }),
102
106
  showDescriptions ? /* @__PURE__ */ jsx("div", { className: "mt-0.5 text-xs text-[var(--muted)]", children: text.fontSizeDescription }) : null
103
107
  ] }),
104
108
  /* @__PURE__ */ jsx(FontSizeController, { ...fontSizeProps })
105
109
  ] }),
106
- fontFamilyControl ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 rounded-2xl border border-[color-mix(in_oklab,var(--border)_70%,transparent)] bg-[color-mix(in_oklab,var(--card)_55%,transparent)] p-3", children: [
110
+ fontFamilyControl ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 rounded-2xl border border-[var(--border)] bg-[color-mix(in_oklab,var(--card)_72%,transparent)] p-3", children: [
107
111
  /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
108
112
  /* @__PURE__ */ jsx("div", { className: "text-sm font-semibold text-[var(--foreground)]", children: text.fontFamilyTitle }),
109
113
  showDescriptions ? /* @__PURE__ */ jsx("div", { className: "mt-0.5 text-xs text-[var(--muted)]", children: text.fontFamilyDescription }) : null
@@ -121,10 +125,10 @@ function AccessibilityFab({
121
125
  ref: btnRef,
122
126
  type: "button",
123
127
  onClick: () => setOpen((value) => !value),
124
- className: "group grid size-12 place-items-center rounded-2xl border border-[color-mix(in_oklab,var(--border)_70%,transparent)] bg-[color-mix(in_oklab,var(--surface)_84%,transparent)] text-[var(--foreground)] shadow-[0_24px_60px_rgba(15,23,42,0.22)] backdrop-blur-xl transition hover:scale-[1.02] hover:bg-[color-mix(in_oklab,var(--surface)_92%,transparent)]",
128
+ className: "group grid size-12 place-items-center rounded-2xl border border-[var(--border)] bg-[color-mix(in_oklab,var(--card)_94%,transparent)] text-[var(--primary)] shadow-[0_20px_48px_rgba(6,19,22,0.13)] backdrop-blur-xl transition duration-200 hover:-translate-y-0.5 hover:border-[color-mix(in_oklab,var(--primary)_38%,var(--border))] hover:bg-[var(--surface)] hover:text-[var(--foreground)] hover:shadow-[0_24px_58px_rgba(6,19,22,0.18)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[color-mix(in_oklab,var(--primary)_42%,transparent)] dark:shadow-[0_20px_48px_rgba(0,0,0,0.28)] dark:hover:shadow-[0_24px_58px_rgba(0,0,0,0.36)]",
125
129
  "aria-label": open ? text.close : text.open,
126
130
  title: open ? text.close : text.title,
127
- children: /* @__PURE__ */ jsx(TextAaIcon, { className: "size-5 opacity-90 transition group-hover:opacity-100", "aria-hidden": true })
131
+ children: /* @__PURE__ */ jsx(PersonArmsSpreadIcon, { className: "size-5 opacity-95 transition group-hover:scale-105 group-hover:opacity-100", "aria-hidden": true })
128
132
  }
129
133
  )
130
134
  ] });
package/dist/AppTopbar.js CHANGED
@@ -48,7 +48,7 @@ function AppTopbar({ title, subtitle, secondary, primary, actions, color, loadin
48
48
  {
49
49
  className: "sticky top-0 z-30 border-b border-[var(--border)] bg-[var(--card)] shadow-sm",
50
50
  "aria-busy": showLoading ? "true" : void 0,
51
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "px-4 sm:px-6 xl:px-8 xl:pl-20", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex h-16 items-center justify-between", children: [
51
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "px-4 sm:px-6 xl:px-8", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex h-16 items-center justify-between", children: [
52
52
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex items-center gap-3", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: showLoading ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-2", children: [
53
53
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "fx-skeleton", style: { width: titleW, height: 18, borderRadius: 10 } }),
54
54
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "fx-skeleton", style: { width: subtitleW, height: 12, borderRadius: 10 } })
package/dist/AppTopbar.mjs CHANGED
@@ -15,7 +15,7 @@ function AppTopbar({ title, subtitle, secondary, primary, actions, color, loadin
15
15
  {
16
16
  className: "sticky top-0 z-30 border-b border-[var(--border)] bg-[var(--card)] shadow-sm",
17
17
  "aria-busy": showLoading ? "true" : void 0,
18
- children: /* @__PURE__ */ jsx("div", { className: "px-4 sm:px-6 xl:px-8 xl:pl-20", children: /* @__PURE__ */ jsxs("div", { className: "flex h-16 items-center justify-between", children: [
18
+ children: /* @__PURE__ */ jsx("div", { className: "px-4 sm:px-6 xl:px-8", children: /* @__PURE__ */ jsxs("div", { className: "flex h-16 items-center justify-between", children: [
19
19
  /* @__PURE__ */ jsx("div", { className: "flex items-center gap-3", children: /* @__PURE__ */ jsx("div", { children: showLoading ? /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
20
20
  /* @__PURE__ */ jsx("div", { className: "fx-skeleton", style: { width: titleW, height: 18, borderRadius: 10 } }),
21
21
  /* @__PURE__ */ jsx("div", { className: "fx-skeleton", style: { width: subtitleW, height: 12, borderRadius: 10 } })
package/dist/ComboSelect.js CHANGED
@@ -42,6 +42,7 @@ var import_framer_motion = require("framer-motion");
42
42
  var import_animations = require("./animations");
43
43
  var import_iconos = require("./iconos");
44
44
  const cx = (...a) => a.filter(Boolean).join(" ");
45
+ const PORTAL_OVERLAY_Z_INDEX = 2147483647;
45
46
  const controlShell = "relative w-full rounded-2xl border border-slate-200 bg-white text-sm text-slate-900 placeholder:text-slate-400 shadow-sm outline-none transition focus-within:ring-1 focus-within:border-[color-mix(in_oklab,var(--ring)_35%,var(--border))] disabled:opacity-60 disabled:cursor-not-allowed dark:border-[var(--border)] dark:bg-[var(--fx-surface)] dark:text-[var(--foreground)] dark:placeholder:text-[var(--muted)] dark:shadow-[0_0_0_1px_rgba(0,0,0,0.55)]";
46
47
  const isFocusableOrInteractive = (el) => {
47
48
  if (!el) return false;
@@ -248,8 +249,7 @@ function ComboSelect({
248
249
  left: r.left,
249
250
  width: r.width,
250
251
  maxHeight: maxH,
251
- // Keep above Dialog (3000) and other overlays.
252
- zIndex: 3600
252
+ zIndex: PORTAL_OVERLAY_Z_INDEX
253
253
  });
254
254
  }, []);
255
255
  import_react.default.useLayoutEffect(() => {
@@ -316,7 +316,7 @@ function ComboSelect({
316
316
  "div",
317
317
  {
318
318
  className: "fixed inset-0",
319
- style: { zIndex: 3599 },
319
+ style: { zIndex: PORTAL_OVERLAY_Z_INDEX - 1 },
320
320
  onMouseDown: () => {
321
321
  closeDropdown();
322
322
  },
@@ -331,6 +331,7 @@ function ComboSelect({
331
331
  ref: dropRef,
332
332
  role: "listbox",
333
333
  id: listId,
334
+ "data-fx-overlay": "combo-select",
334
335
  style: { ...dropStyle, willChange: "transform, opacity" },
335
336
  variants: import_animations.popOver,
336
337
  initial: "initial",
package/dist/ComboSelect.mjs CHANGED
@@ -9,6 +9,7 @@ import { AnimatePresence, motion } from "framer-motion";
9
9
  import { popOver, menuTransition } from "./animations.mjs";
10
10
  import { CheckIcon, ChevronDownIcon, CloseIcon } from "./iconos/index.mjs";
11
11
  const cx = (...a) => a.filter(Boolean).join(" ");
12
+ const PORTAL_OVERLAY_Z_INDEX = 2147483647;
12
13
  const controlShell = "relative w-full rounded-2xl border border-slate-200 bg-white text-sm text-slate-900 placeholder:text-slate-400 shadow-sm outline-none transition focus-within:ring-1 focus-within:border-[color-mix(in_oklab,var(--ring)_35%,var(--border))] disabled:opacity-60 disabled:cursor-not-allowed dark:border-[var(--border)] dark:bg-[var(--fx-surface)] dark:text-[var(--foreground)] dark:placeholder:text-[var(--muted)] dark:shadow-[0_0_0_1px_rgba(0,0,0,0.55)]";
13
14
  const isFocusableOrInteractive = (el) => {
14
15
  if (!el) return false;
@@ -215,8 +216,7 @@ function ComboSelect({
215
216
  left: r.left,
216
217
  width: r.width,
217
218
  maxHeight: maxH,
218
- // Keep above Dialog (3000) and other overlays.
219
- zIndex: 3600
219
+ zIndex: PORTAL_OVERLAY_Z_INDEX
220
220
  });
221
221
  }, []);
222
222
  React.useLayoutEffect(() => {
@@ -283,7 +283,7 @@ function ComboSelect({
283
283
  "div",
284
284
  {
285
285
  className: "fixed inset-0",
286
- style: { zIndex: 3599 },
286
+ style: { zIndex: PORTAL_OVERLAY_Z_INDEX - 1 },
287
287
  onMouseDown: () => {
288
288
  closeDropdown();
289
289
  },
@@ -298,6 +298,7 @@ function ComboSelect({
298
298
  ref: dropRef,
299
299
  role: "listbox",
300
300
  id: listId,
301
+ "data-fx-overlay": "combo-select",
301
302
  style: { ...dropStyle, willChange: "transform, opacity" },
302
303
  variants: popOver,
303
304
  initial: "initial",
package/dist/DateTimeField.js CHANGED
@@ -126,6 +126,7 @@ const formatDisplayValue = (value, mode) => {
126
126
  return fmtISODateTimeLocal(parsed);
127
127
  }
128
128
  };
129
+ const PORTAL_OVERLAY_Z_INDEX = 2147483647;
129
130
  function DateTimeField({
130
131
  type = "datetime-local",
131
132
  value,
@@ -190,7 +191,7 @@ function DateTimeField({
190
191
  left = Math.max(MARGIN, Math.min(left, window.innerWidth - (W + MARGIN)));
191
192
  let top = anchorRect.top - GAP - H;
192
193
  if (top < MARGIN) top = Math.max(MARGIN, anchorRect.bottom + GAP);
193
- return { position: "fixed", top, left, zIndex: 1e5 };
194
+ return { position: "fixed", top, left, zIndex: PORTAL_OVERLAY_Z_INDEX };
194
195
  })();
195
196
  const parsed = (0, import_react.useMemo)(() => value ? parseValueByType(value, type) : null, [value, type]);
196
197
  const [cursor, setCursor] = (0, import_react.useState)(() => parsed != null ? parsed : /* @__PURE__ */ new Date());
package/dist/DateTimeField.mjs CHANGED
@@ -93,6 +93,7 @@ const formatDisplayValue = (value, mode) => {
93
93
  return fmtISODateTimeLocal(parsed);
94
94
  }
95
95
  };
96
+ const PORTAL_OVERLAY_Z_INDEX = 2147483647;
96
97
  function DateTimeField({
97
98
  type = "datetime-local",
98
99
  value,
@@ -157,7 +158,7 @@ function DateTimeField({
157
158
  left = Math.max(MARGIN, Math.min(left, window.innerWidth - (W + MARGIN)));
158
159
  let top = anchorRect.top - GAP - H;
159
160
  if (top < MARGIN) top = Math.max(MARGIN, anchorRect.bottom + GAP);
160
- return { position: "fixed", top, left, zIndex: 1e5 };
161
+ return { position: "fixed", top, left, zIndex: PORTAL_OVERLAY_Z_INDEX };
161
162
  })();
162
163
  const parsed = useMemo(() => value ? parseValueByType(value, type) : null, [value, type]);
163
164
  const [cursor, setCursor] = useState(() => parsed != null ? parsed : /* @__PURE__ */ new Date());
package/dist/Dropdown.js CHANGED
@@ -46,6 +46,7 @@ var import_framer_motion = require("framer-motion");
46
46
  var import_animations = require("./animations");
47
47
  var import_iconos = require("./iconos/index");
48
48
  var import_Button = __toESM(require("./Button"));
49
+ const PORTAL_OVERLAY_Z_INDEX = 2147483647;
49
50
  const DropdownCtx = (0, import_react.createContext)(null);
50
51
  const useDropdown = () => {
51
52
  const ctx = (0, import_react.useContext)(DropdownCtx);
@@ -289,6 +290,7 @@ function Content({
289
290
  "aria-labelledby": labelId,
290
291
  ref: menuRef,
291
292
  onKeyDown,
293
+ "data-fx-overlay": "dropdown",
292
294
  variants: import_animations.popOver,
293
295
  initial: "initial",
294
296
  animate: "animate",
@@ -300,6 +302,7 @@ function Content({
300
302
  left: pos.left,
301
303
  maxHeight: pos.maxH,
302
304
  maxWidth: "calc(100vw - 16px)",
305
+ zIndex: PORTAL_OVERLAY_Z_INDEX,
303
306
  willChange: "transform, opacity"
304
307
  },
305
308
  className: [
package/dist/Dropdown.mjs CHANGED
@@ -15,6 +15,7 @@ import { AnimatePresence, motion } from "framer-motion";
15
15
  import { popOver, menuTransition } from "./animations.mjs";
16
16
  import { MenuPuntosVerticalIcon } from "./iconos/index.mjs";
17
17
  import Button from "./Button.mjs";
18
+ const PORTAL_OVERLAY_Z_INDEX = 2147483647;
18
19
  const DropdownCtx = createContext(null);
19
20
  const useDropdown = () => {
20
21
  const ctx = useContext(DropdownCtx);
@@ -258,6 +259,7 @@ function Content({
258
259
  "aria-labelledby": labelId,
259
260
  ref: menuRef,
260
261
  onKeyDown,
262
+ "data-fx-overlay": "dropdown",
261
263
  variants: popOver,
262
264
  initial: "initial",
263
265
  animate: "animate",
@@ -269,6 +271,7 @@ function Content({
269
271
  left: pos.left,
270
272
  maxHeight: pos.maxH,
271
273
  maxWidth: "calc(100vw - 16px)",
274
+ zIndex: PORTAL_OVERLAY_Z_INDEX,
272
275
  willChange: "transform, opacity"
273
276
  },
274
277
  className: [
package/dist/Select.js CHANGED
@@ -44,6 +44,7 @@ const S = {
44
44
  md: { h: "h-10", text: "text-sm", radius: "rounded-2xl", padX: "px-3.5", itemPad: "px-3.5 py-2" },
45
45
  lg: { h: "h-11", text: "text-base", radius: "rounded-2xl", padX: "px-4", itemPad: "px-4 py-2.5" }
46
46
  };
47
+ const PORTAL_OVERLAY_Z_INDEX = 2147483647;
47
48
  function ModernSelect({
48
49
  value,
49
50
  onChange,
@@ -266,6 +267,7 @@ function ModernSelect({
266
267
  left: menuPos.left,
267
268
  width: menuPos.width,
268
269
  maxWidth: "calc(100vw - 24px)",
270
+ zIndex: PORTAL_OVERLAY_Z_INDEX,
269
271
  willChange: "transform, opacity"
270
272
  },
271
273
  children: [
package/dist/Select.mjs CHANGED
@@ -11,6 +11,7 @@ const S = {
11
11
  md: { h: "h-10", text: "text-sm", radius: "rounded-2xl", padX: "px-3.5", itemPad: "px-3.5 py-2" },
12
12
  lg: { h: "h-11", text: "text-base", radius: "rounded-2xl", padX: "px-4", itemPad: "px-4 py-2.5" }
13
13
  };
14
+ const PORTAL_OVERLAY_Z_INDEX = 2147483647;
14
15
  function ModernSelect({
15
16
  value,
16
17
  onChange,
@@ -233,6 +234,7 @@ function ModernSelect({
233
234
  left: menuPos.left,
234
235
  width: menuPos.width,
235
236
  maxWidth: "calc(100vw - 24px)",
237
+ zIndex: PORTAL_OVERLAY_Z_INDEX,
236
238
  willChange: "transform, opacity"
237
239
  },
238
240
  children: [
package/dist/Sidebar.js CHANGED
@@ -2191,7 +2191,7 @@ function SidebarInner({
2191
2191
  ] });
2192
2192
  };
2193
2193
  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: ["flex h-full flex-col", loading ? "pointer-events-none select-none" : ""].join(" "), "aria-busy": loading ? "true" : void 0, children: [
2194
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: collapsed ? "px-3 pt-4" : "px-5 pt-5", children: loading ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2", children: [
2194
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: collapsed ? "px-3 pt-4" : "px-4 pt-5", children: loading ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2", children: [
2195
2195
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: ["flex min-w-0 flex-1 items-center gap-3", collapsed ? "justify-center" : ""].join(" "), children: [
2196
2196
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "fx-skeleton", style: { width: collapsed ? 44 : 40, height: collapsed ? 44 : 40, borderRadius: 16 } }),
2197
2197
  !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-2", children: [
@@ -2293,7 +2293,7 @@ function SidebarInner({
2293
2293
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: ["min-w-0 flex-1 text-sm font-semibold text-[var(--muted)]", collapsed ? "text-center" : ""].join(" "), children: "Navegaci\xF3n" }),
2294
2294
  renderCollapseToggle()
2295
2295
  ] }) }),
2296
- showTopPanel || loading && skShowTopPanel ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: cx("mt-4", collapsed ? "px-4" : "px-5"), children: loading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: collapsed ? cx("rounded-3xl p-2", TOP_PANEL_SURFACE) : topPanelClass, children: collapsed ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col items-center justify-center gap-2", children: [
2296
+ showTopPanel || loading && skShowTopPanel ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "mt-4 px-4", children: loading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: collapsed ? cx("rounded-3xl p-2", TOP_PANEL_SURFACE) : topPanelClass, children: collapsed ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col items-center justify-center gap-2", children: [
2297
2297
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "fx-skeleton", style: { width: 44, height: 44, borderRadius: 16 } }),
2298
2298
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "fx-skeleton", style: { width: 56, height: 12, borderRadius: 10 } })
2299
2299
  ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "px-2 py-2", children: [
@@ -2393,7 +2393,7 @@ function SidebarInner({
2393
2393
  ref: navRef,
2394
2394
  className: cx(
2395
2395
  "mt-5 flex-1 space-y-6 overflow-y-auto overflow-x-hidden py-2",
2396
- "px-5"
2396
+ collapsed ? "px-5" : "px-3.5"
2397
2397
  ),
2398
2398
  children: loading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "space-y-7", children: Array.from({ length: skGroups }).map((_, g) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
2399
2399
  !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "mb-3 px-1", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "fx-skeleton", style: { width: g % 2 === 0 ? "6.5rem" : "7.5rem", height: 10, borderRadius: 10 } }) }) : null,
package/dist/Sidebar.mjs CHANGED
@@ -2170,7 +2170,7 @@ function SidebarInner({
2170
2170
  ] });
2171
2171
  };
2172
2172
  return /* @__PURE__ */ jsxs("div", { className: ["flex h-full flex-col", loading ? "pointer-events-none select-none" : ""].join(" "), "aria-busy": loading ? "true" : void 0, children: [
2173
- /* @__PURE__ */ jsx("div", { className: collapsed ? "px-3 pt-4" : "px-5 pt-5", children: loading ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
2173
+ /* @__PURE__ */ jsx("div", { className: collapsed ? "px-3 pt-4" : "px-4 pt-5", children: loading ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
2174
2174
  /* @__PURE__ */ jsxs("div", { className: ["flex min-w-0 flex-1 items-center gap-3", collapsed ? "justify-center" : ""].join(" "), children: [
2175
2175
  /* @__PURE__ */ jsx("div", { className: "fx-skeleton", style: { width: collapsed ? 44 : 40, height: collapsed ? 44 : 40, borderRadius: 16 } }),
2176
2176
  !collapsed ? /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
@@ -2272,7 +2272,7 @@ function SidebarInner({
2272
2272
  /* @__PURE__ */ jsx("div", { className: ["min-w-0 flex-1 text-sm font-semibold text-[var(--muted)]", collapsed ? "text-center" : ""].join(" "), children: "Navegaci\xF3n" }),
2273
2273
  renderCollapseToggle()
2274
2274
  ] }) }),
2275
- showTopPanel || loading && skShowTopPanel ? /* @__PURE__ */ jsx("div", { className: cx("mt-4", collapsed ? "px-4" : "px-5"), children: loading ? /* @__PURE__ */ jsx("div", { className: collapsed ? cx("rounded-3xl p-2", TOP_PANEL_SURFACE) : topPanelClass, children: collapsed ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center gap-2", children: [
2275
+ showTopPanel || loading && skShowTopPanel ? /* @__PURE__ */ jsx("div", { className: "mt-4 px-4", children: loading ? /* @__PURE__ */ jsx("div", { className: collapsed ? cx("rounded-3xl p-2", TOP_PANEL_SURFACE) : topPanelClass, children: collapsed ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center gap-2", children: [
2276
2276
  /* @__PURE__ */ jsx("div", { className: "fx-skeleton", style: { width: 44, height: 44, borderRadius: 16 } }),
2277
2277
  /* @__PURE__ */ jsx("div", { className: "fx-skeleton", style: { width: 56, height: 12, borderRadius: 10 } })
2278
2278
  ] }) : /* @__PURE__ */ jsxs("div", { className: "px-2 py-2", children: [
@@ -2372,7 +2372,7 @@ function SidebarInner({
2372
2372
  ref: navRef,
2373
2373
  className: cx(
2374
2374
  "mt-5 flex-1 space-y-6 overflow-y-auto overflow-x-hidden py-2",
2375
- "px-5"
2375
+ collapsed ? "px-5" : "px-3.5"
2376
2376
  ),
2377
2377
  children: loading ? /* @__PURE__ */ jsx("div", { className: "space-y-7", children: Array.from({ length: skGroups }).map((_, g) => /* @__PURE__ */ jsxs("div", { children: [
2378
2378
  !collapsed ? /* @__PURE__ */ jsx("div", { className: "mb-3 px-1", children: /* @__PURE__ */ jsx("div", { className: "fx-skeleton", style: { width: g % 2 === 0 ? "6.5rem" : "7.5rem", height: 10, borderRadius: 10 } }) }) : null,
package/dist/SupportChatWidget.d.mts CHANGED
@@ -59,6 +59,8 @@ type SupportChatTranscriptConfig = {
59
59
  type SupportChatSendResult = string | void | SupportChatMessage[] | {
60
60
  reply?: string;
61
61
  messages?: SupportChatMessage[];
62
+ suggestedReplies?: string[];
63
+ serviceSuggestions?: SupportChatServiceSuggestion[];
62
64
  };
63
65
  type SupportChatWidgetLabels = {
64
66
  trigger?: string;
package/dist/SupportChatWidget.d.ts CHANGED
@@ -59,6 +59,8 @@ type SupportChatTranscriptConfig = {
59
59
  type SupportChatSendResult = string | void | SupportChatMessage[] | {
60
60
  reply?: string;
61
61
  messages?: SupportChatMessage[];
62
+ suggestedReplies?: string[];
63
+ serviceSuggestions?: SupportChatServiceSuggestion[];
62
64
  };
63
65
  type SupportChatWidgetLabels = {
64
66
  trigger?: string;
package/dist/SupportChatWidget.js CHANGED
@@ -178,7 +178,7 @@ function buildHtmlTranscript(messages, title, brandName) {
178
178
  }
179
179
  function SupportChatWidget({
180
180
  mode = "bot",
181
- brandName = "Kontestalo",
181
+ brandName = "Heliip Support",
182
182
  assistant,
183
183
  agent,
184
184
  open: openProp,
@@ -268,7 +268,7 @@ function SupportChatWidget({
268
268
  const labelSaveRecentTranscript = (_q = labels == null ? void 0 : labels.saveRecentTranscript) != null ? _q : "Guardar extracto";
269
269
  const labelSaveFullTranscript = (_r = labels == null ? void 0 : labels.saveFullTranscript) != null ? _r : "Guardar HTML";
270
270
  const labelRating = (_s = labels == null ? void 0 : labels.ratingLabel) != null ? _s : "Calificacion";
271
- const labelPoweredBy = (_t = labels == null ? void 0 : labels.poweredBy) != null ? _t : "Kontestalo";
271
+ const labelPoweredBy = (_t = labels == null ? void 0 : labels.poweredBy) != null ? _t : "Heliip Support";
272
272
  const labelWelcomeTitle = (_v = labels == null ? void 0 : labels.defaultWelcomeTitle) != null ? _v : `Hola, soy ${(_u = assistant == null ? void 0 : assistant.name) != null ? _u : brandName}`;
273
273
  const labelWelcomeMessage = (_w = labels == null ? void 0 : labels.defaultWelcomeMessage) != null ? _w : "Puedo ayudarte con servicios, horarios, contacto y dudas frecuentes.";
274
274
  const labelError = (_x = labels == null ? void 0 : labels.errorMessage) != null ? _x : "No se pudo enviar el mensaje. Intenta de nuevo.";
@@ -325,7 +325,9 @@ function SupportChatWidget({
325
325
  content: result.reply,
326
326
  createdAt: /* @__PURE__ */ new Date(),
327
327
  state: "complete",
328
- actor: currentActor
328
+ actor: currentActor,
329
+ suggestedReplies: result.suggestedReplies,
330
+ serviceSuggestions: result.serviceSuggestions
329
331
  });
330
332
  }
331
333
  if (Array.isArray(result.messages)) next.push(...result.messages);
package/dist/SupportChatWidget.mjs CHANGED
@@ -157,7 +157,7 @@ function buildHtmlTranscript(messages, title, brandName) {
157
157
  }
158
158
  function SupportChatWidget({
159
159
  mode = "bot",
160
- brandName = "Kontestalo",
160
+ brandName = "Heliip Support",
161
161
  assistant,
162
162
  agent,
163
163
  open: openProp,
@@ -247,7 +247,7 @@ function SupportChatWidget({
247
247
  const labelSaveRecentTranscript = (_q = labels == null ? void 0 : labels.saveRecentTranscript) != null ? _q : "Guardar extracto";
248
248
  const labelSaveFullTranscript = (_r = labels == null ? void 0 : labels.saveFullTranscript) != null ? _r : "Guardar HTML";
249
249
  const labelRating = (_s = labels == null ? void 0 : labels.ratingLabel) != null ? _s : "Calificacion";
250
- const labelPoweredBy = (_t = labels == null ? void 0 : labels.poweredBy) != null ? _t : "Kontestalo";
250
+ const labelPoweredBy = (_t = labels == null ? void 0 : labels.poweredBy) != null ? _t : "Heliip Support";
251
251
  const labelWelcomeTitle = (_v = labels == null ? void 0 : labels.defaultWelcomeTitle) != null ? _v : `Hola, soy ${(_u = assistant == null ? void 0 : assistant.name) != null ? _u : brandName}`;
252
252
  const labelWelcomeMessage = (_w = labels == null ? void 0 : labels.defaultWelcomeMessage) != null ? _w : "Puedo ayudarte con servicios, horarios, contacto y dudas frecuentes.";
253
253
  const labelError = (_x = labels == null ? void 0 : labels.errorMessage) != null ? _x : "No se pudo enviar el mensaje. Intenta de nuevo.";
@@ -304,7 +304,9 @@ function SupportChatWidget({
304
304
  content: result.reply,
305
305
  createdAt: /* @__PURE__ */ new Date(),
306
306
  state: "complete",
307
- actor: currentActor
307
+ actor: currentActor,
308
+ suggestedReplies: result.suggestedReplies,
309
+ serviceSuggestions: result.serviceSuggestions
308
310
  });
309
311
  }
310
312
  if (Array.isArray(result.messages)) next.push(...result.messages);
package/dist/TimePanel.js CHANGED
@@ -36,6 +36,7 @@ var import_jsx_runtime = require("react/jsx-runtime");
36
36
  var import_react = require("react");
37
37
  var import_Button = __toESM(require("./Button"));
38
38
  const pad2 = (n) => n < 10 ? `0${n}` : String(n);
39
+ const PORTAL_OVERLAY_Z_INDEX = 2147483647;
39
40
  function TimePopover({
40
41
  anchorRef,
41
42
  hh,
@@ -54,7 +55,7 @@ function TimePopover({
54
55
  left = Math.max(M, Math.min(left, window.innerWidth - (W + M)));
55
56
  let top = r.bottom + GAP;
56
57
  if (top + H > window.innerHeight) top = Math.max(M, r.top - GAP - H);
57
- return { position: "fixed", top, left, width: W, zIndex: 100001 };
58
+ return { position: "fixed", top, left, width: W, zIndex: PORTAL_OVERLAY_Z_INDEX };
58
59
  }, [anchorRef]);
59
60
  (0, import_react.useEffect)(() => {
60
61
  const stopInside = (e) => {
package/dist/TimePanel.mjs CHANGED
@@ -3,6 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
3
3
  import { useEffect, useMemo, useRef } from "react";
4
4
  import Button from "./Button.mjs";
5
5
  const pad2 = (n) => n < 10 ? `0${n}` : String(n);
6
+ const PORTAL_OVERLAY_Z_INDEX = 2147483647;
6
7
  function TimePopover({
7
8
  anchorRef,
8
9
  hh,
@@ -21,7 +22,7 @@ function TimePopover({
21
22
  left = Math.max(M, Math.min(left, window.innerWidth - (W + M)));
22
23
  let top = r.bottom + GAP;
23
24
  if (top + H > window.innerHeight) top = Math.max(M, r.top - GAP - H);
24
- return { position: "fixed", top, left, width: W, zIndex: 100001 };
25
+ return { position: "fixed", top, left, width: W, zIndex: PORTAL_OVERLAY_Z_INDEX };
25
26
  }, [anchorRef]);
26
27
  useEffect(() => {
27
28
  const stopInside = (e) => {
package/dist/TimePopover.js CHANGED
@@ -42,6 +42,7 @@ var import_animations = require("./animations");
42
42
  var import_Button = __toESM(require("./Button"));
43
43
  var import_Input = __toESM(require("./Input"));
44
44
  const pad2 = (n) => n < 10 ? `0${n}` : String(n);
45
+ const PORTAL_OVERLAY_Z_INDEX = 2147483647;
45
46
  function TimePopover({
46
47
  anchorEl,
47
48
  hh,
@@ -142,7 +143,7 @@ function TimePopover({
142
143
  "data-dtf-pop": true,
143
144
  onPointerDownCapture: (e) => e.stopPropagation(),
144
145
  onKeyDown,
145
- style: { position: "fixed", top: pos.top, left: pos.left, zIndex: 1e5, willChange: "transform, opacity" },
146
+ style: { position: "fixed", top: pos.top, left: pos.left, zIndex: PORTAL_OVERLAY_Z_INDEX, willChange: "transform, opacity" },
146
147
  className: "w-64 rounded-2xl border border-slate-200 bg-white p-3 shadow-xl dark:border-white/10 dark:bg-[var(--fx-surface)]",
147
148
  children: [
148
149
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "mb-2 text-sm font-medium text-slate-700 dark:text-slate-200", children: "Selecciona hora" }),
@@ -361,7 +362,7 @@ function WeekPopover({ anchorEl, cursor, value, onCursorChange, onPick, onClose
361
362
  import_framer_motion.motion.div,
362
363
  {
363
364
  ref: popRef,
364
- style: { position: "fixed", top: pos.top, left: pos.left, zIndex: 1e5, willChange: "transform, opacity" },
365
+ style: { position: "fixed", top: pos.top, left: pos.left, zIndex: PORTAL_OVERLAY_Z_INDEX, willChange: "transform, opacity" },
365
366
  variants: import_animations.popOver,
366
367
  initial: "initial",
367
368
  animate: "animate",
@@ -480,7 +481,7 @@ function MonthPopover({ anchorEl, cursor, value, onCursorChange, onPick, onClose
480
481
  import_framer_motion.motion.div,
481
482
  {
482
483
  ref: popRef,
483
- style: { position: "fixed", top: pos.top, left: pos.left, zIndex: 1e5, willChange: "transform, opacity" },
484
+ style: { position: "fixed", top: pos.top, left: pos.left, zIndex: PORTAL_OVERLAY_Z_INDEX, willChange: "transform, opacity" },
484
485
  variants: import_animations.popOver,
485
486
  initial: "initial",
486
487
  animate: "animate",
package/dist/TimePopover.mjs CHANGED
@@ -7,6 +7,7 @@ import { popOver, menuTransition } from "./animations.mjs";
7
7
  import Button from "./Button.mjs";
8
8
  import Input from "./Input.mjs";
9
9
  const pad2 = (n) => n < 10 ? `0${n}` : String(n);
10
+ const PORTAL_OVERLAY_Z_INDEX = 2147483647;
10
11
  function TimePopover({
11
12
  anchorEl,
12
13
  hh,
@@ -107,7 +108,7 @@ function TimePopover({
107
108
  "data-dtf-pop": true,
108
109
  onPointerDownCapture: (e) => e.stopPropagation(),
109
110
  onKeyDown,
110
- style: { position: "fixed", top: pos.top, left: pos.left, zIndex: 1e5, willChange: "transform, opacity" },
111
+ style: { position: "fixed", top: pos.top, left: pos.left, zIndex: PORTAL_OVERLAY_Z_INDEX, willChange: "transform, opacity" },
111
112
  className: "w-64 rounded-2xl border border-slate-200 bg-white p-3 shadow-xl dark:border-white/10 dark:bg-[var(--fx-surface)]",
112
113
  children: [
113
114
  /* @__PURE__ */ jsx("div", { className: "mb-2 text-sm font-medium text-slate-700 dark:text-slate-200", children: "Selecciona hora" }),
@@ -326,7 +327,7 @@ function WeekPopover({ anchorEl, cursor, value, onCursorChange, onPick, onClose
326
327
  motion.div,
327
328
  {
328
329
  ref: popRef,
329
- style: { position: "fixed", top: pos.top, left: pos.left, zIndex: 1e5, willChange: "transform, opacity" },
330
+ style: { position: "fixed", top: pos.top, left: pos.left, zIndex: PORTAL_OVERLAY_Z_INDEX, willChange: "transform, opacity" },
330
331
  variants: popOver,
331
332
  initial: "initial",
332
333
  animate: "animate",
@@ -445,7 +446,7 @@ function MonthPopover({ anchorEl, cursor, value, onCursorChange, onPick, onClose
445
446
  motion.div,
446
447
  {
447
448
  ref: popRef,
448
- style: { position: "fixed", top: pos.top, left: pos.left, zIndex: 1e5, willChange: "transform, opacity" },
449
+ style: { position: "fixed", top: pos.top, left: pos.left, zIndex: PORTAL_OVERLAY_Z_INDEX, willChange: "transform, opacity" },
449
450
  variants: popOver,
450
451
  initial: "initial",
451
452
  animate: "animate",
package/dist/TimeRangeField.js CHANGED
@@ -41,6 +41,7 @@ var import_TimePopover = __toESM(require("./TimePopover"));
41
41
  var import_ActionIconButton = __toESM(require("./ActionIconButton"));
42
42
  var import_iconos = require("./iconos");
43
43
  const pad2 = (n) => n < 10 ? `0${n}` : String(n);
44
+ const PORTAL_OVERLAY_Z_INDEX = 2147483647;
44
45
  function parseHHmm(v) {
45
46
  if (!v) return null;
46
47
  const [hh, mm] = String(v).split(":").map((x) => parseInt(x, 10));
@@ -142,10 +143,10 @@ function TimeRangeField({ value, onValueChange, portal = true, portalId, clearab
142
143
  const placeAbove = spaceAbove >= spaceBelow;
143
144
  if (placeAbove) {
144
145
  const top2 = Math.max(MARGIN, anchorRect.top - GAP);
145
- return { position: "fixed", width: W, top: top2, left, zIndex: 1e5, transform: "translateY(-100%)" };
146
+ return { position: "fixed", width: W, top: top2, left, zIndex: PORTAL_OVERLAY_Z_INDEX, transform: "translateY(-100%)" };
146
147
  }
147
148
  const top = Math.max(MARGIN, anchorRect.bottom + GAP);
148
- return { position: "fixed", width: W, top, left, zIndex: 1e5 };
149
+ return { position: "fixed", width: W, top, left, zIndex: PORTAL_OVERLAY_Z_INDEX };
149
150
  })();
150
151
  const commit = (f, t) => {
151
152
  let f2 = f, t2 = t;
package/dist/TimeRangeField.mjs CHANGED
@@ -8,6 +8,7 @@ import TimePopover from "./TimePopover.mjs";
8
8
  import ActionIconButton from "./ActionIconButton.mjs";
9
9
  import { ClockIcon } from "./iconos/index.mjs";
10
10
  const pad2 = (n) => n < 10 ? `0${n}` : String(n);
11
+ const PORTAL_OVERLAY_Z_INDEX = 2147483647;
11
12
  function parseHHmm(v) {
12
13
  if (!v) return null;
13
14
  const [hh, mm] = String(v).split(":").map((x) => parseInt(x, 10));
@@ -109,10 +110,10 @@ function TimeRangeField({ value, onValueChange, portal = true, portalId, clearab
109
110
  const placeAbove = spaceAbove >= spaceBelow;
110
111
  if (placeAbove) {
111
112
  const top2 = Math.max(MARGIN, anchorRect.top - GAP);
112
- return { position: "fixed", width: W, top: top2, left, zIndex: 1e5, transform: "translateY(-100%)" };
113
+ return { position: "fixed", width: W, top: top2, left, zIndex: PORTAL_OVERLAY_Z_INDEX, transform: "translateY(-100%)" };
113
114
  }
114
115
  const top = Math.max(MARGIN, anchorRect.bottom + GAP);
115
- return { position: "fixed", width: W, top, left, zIndex: 1e5 };
116
+ return { position: "fixed", width: W, top, left, zIndex: PORTAL_OVERLAY_Z_INDEX };
116
117
  })();
117
118
  const commit = (f, t) => {
118
119
  let f2 = f, t2 = t;
package/dist/theme/FontSizeController.js CHANGED
@@ -54,7 +54,7 @@ function FontSizeController({
54
54
  labels
55
55
  }) {
56
56
  var _a, _b, _c, _d, _e;
57
- const POPOVER_Z_INDEX = 10050;
57
+ const POPOVER_Z_INDEX = 2147483647;
58
58
  const [mounted, setMounted] = import_react.default.useState(false);
59
59
  import_react.default.useEffect(() => setMounted(true), []);
60
60
  const { fontScale, setFontScale, increaseFont, decreaseFont, resetFont } = (0, import_ThemeProvider.useTheme)();
package/dist/theme/FontSizeController.mjs CHANGED
@@ -21,7 +21,7 @@ function FontSizeController({
21
21
  labels
22
22
  }) {
23
23
  var _a, _b, _c, _d, _e;
24
- const POPOVER_Z_INDEX = 10050;
24
+ const POPOVER_Z_INDEX = 2147483647;
25
25
  const [mounted, setMounted] = React.useState(false);
26
26
  React.useEffect(() => setMounted(true), []);
27
27
  const { fontScale, setFontScale, increaseFont, decreaseFont, resetFont } = useTheme();
package/dist/theme/ThemeController.js CHANGED
@@ -82,7 +82,7 @@ function ThemeController({
82
82
  labels
83
83
  }) {
84
84
  var _a, _b, _c, _d, _e, _f, _g;
85
- const POPOVER_Z_INDEX = 10050;
85
+ const POPOVER_Z_INDEX = 2147483647;
86
86
  const [mounted, setMounted] = import_react.default.useState(false);
87
87
  import_react.default.useEffect(() => setMounted(true), []);
88
88
  const { theme, setTheme, accent, setAccent } = (0, import_ThemeProvider.useTheme)();
@@ -269,6 +269,7 @@ function ThemeController({
269
269
  style: popStyle,
270
270
  role: "dialog",
271
271
  "aria-label": (_g = labels == null ? void 0 : labels.accentGroup) != null ? _g : "Color",
272
+ "data-fx-keep-open": true,
272
273
  className: [
273
274
  "rounded-2xl border border-[var(--border)] bg-[var(--card)] shadow-2xl ring-1 ring-black/5",
274
275
  "dark:ring-white/10",
package/dist/theme/ThemeController.mjs CHANGED
@@ -49,7 +49,7 @@ function ThemeController({
49
49
  labels
50
50
  }) {
51
51
  var _a, _b, _c, _d, _e, _f, _g;
52
- const POPOVER_Z_INDEX = 10050;
52
+ const POPOVER_Z_INDEX = 2147483647;
53
53
  const [mounted, setMounted] = React.useState(false);
54
54
  React.useEffect(() => setMounted(true), []);
55
55
  const { theme, setTheme, accent, setAccent } = useTheme();
@@ -236,6 +236,7 @@ function ThemeController({
236
236
  style: popStyle,
237
237
  role: "dialog",
238
238
  "aria-label": (_g = labels == null ? void 0 : labels.accentGroup) != null ? _g : "Color",
239
+ "data-fx-keep-open": true,
239
240
  className: [
240
241
  "rounded-2xl border border-[var(--border)] bg-[var(--card)] shadow-2xl ring-1 ring-black/5",
241
242
  "dark:ring-white/10",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "framepexls-ui-lib",
3
- "version": "2.2.6",
3
+ "version": "2.2.8",
4
4
  "private": false,
5
5
  "license": "MIT",
6
6
  "description": "Componentes UI de Framepexls para React/Next.",