@epam/ai-dial-prompts 1.1.0-dev.298 → 1.1.0-dev.300

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 (3) hide show
  1. package/components/PromptParametersPopup/PromptParametersPopup.d.ts.map +1 -1
  2. package/index.js +94 -93
  3. package/package.json +3 -3
package/components/PromptParametersPopup/PromptParametersPopup.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"PromptParametersPopup.d.ts","sourceRoot":"","sources":["../../../src/components/PromptParametersPopup/PromptParametersPopup.tsx"],"names":[],"mappings":"AAeA,OAAO,EAA4B,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAC1D,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,4CAA4C,CAAC;AAG7F;;;;GAIG;AACH,eAAO,MAAM,qBAAqB,EAAE,EAAE,CAAC,0BAA0B,CA8HhE,CAAC"}
1
+ {"version":3,"file":"PromptParametersPopup.d.ts","sourceRoot":"","sources":["../../../src/components/PromptParametersPopup/PromptParametersPopup.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAA4B,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAC1D,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,4CAA4C,CAAC;AAG7F;;;;GAIG;AACH,eAAO,MAAM,qBAAqB,EAAE,EAAE,CAAC,0BAA0B,CAoIhE,CAAC"}
package/index.js CHANGED
@@ -1,10 +1,10 @@
1
1
  import { CatalogEntityType as e, DeploymentIcon as t, buildCssVars as n, mergeClasses as r } from "@epam/ai-dial-chat-shared";
2
- import { DIAL_ICON_SIZE as i, GhostButton as a, GhostIconButton as o, NeutralButton as s, Popup as c, PopupSize as l, PrimaryButton as u, Textarea as d, ToggleIconButton as f, Tooltip as p } from "@epam/ai-dial-ui-kit";
3
- import { IconChevronLeft as m, IconStarFilled as h } from "@tabler/icons-react";
4
- import { useEffect as g, useId as _, useLayoutEffect as v, useMemo as y, useRef as b, useState as x } from "react";
5
- import { jsx as S, jsxs as C } from "react/jsx-runtime";
6
- import { AppIdentity as w, ContentTab as T, DeploymentSize as E } from "@epam/ai-dial-catalog";
7
- var D = {
2
+ import { DIAL_ICON_SIZE as i, DIAL_KIT_ICON_STROKE as a, GhostButton as o, GhostIconButton as s, NeutralButton as c, Popup as l, PopupSize as u, PrimaryButton as d, Textarea as f, ToggleIconButton as p, Tooltip as m } from "@epam/ai-dial-ui-kit";
3
+ import { IconChevronLeft as h, IconStarFilled as g } from "@tabler/icons-react";
4
+ import { useEffect as _, useId as v, useLayoutEffect as y, useMemo as b, useRef as x, useState as S } from "react";
5
+ import { jsx as C, jsxs as w } from "react/jsx-runtime";
6
+ import { AppIdentity as T, ContentTab as E, DeploymentSize as D } from "@epam/ai-dial-catalog";
7
+ var O = {
8
8
  row: "_row_fggl0_1",
9
9
  header: "_header_fggl0_5",
10
10
  emptyHint: "_emptyHint_fggl0_9",
@@ -15,26 +15,26 @@ var D = {
15
15
  rowLeaving: "_rowLeaving_fggl0_29",
16
16
  rowFadeOut: "_rowFadeOut_fggl0_1",
17
17
  listContent: "_listContent_fggl0_57"
18
- }, O = "px-3 pb-0.5 pt-2", k = 180, A = 288, j = ({ favorites: e, onSelect: o, onToggleFavorite: s, onBrowse: c, labels: l = {}, colors: u, nameClassName: d = "dial-small-text", headerClassName: m = "dial-tiny-lead-semi-text", emptyHintClassName: _ = "dial-small-text" }) => {
19
- let { myCollectionLabel: y = "My Collection", emptyHintLabel: w = "Star a prompt to pin it here", browseLabel: T = "Browse", removeFromFavoritesLabel: E = "Remove from favorites" } = l, j = n({
18
+ }, k = "px-3 pb-0.5 pt-2", A = 180, j = 288, M = ({ favorites: e, onSelect: a, onToggleFavorite: s, onBrowse: c, labels: l = {}, colors: u, nameClassName: d = "dial-small-text", headerClassName: f = "dial-tiny-lead-semi-text", emptyHintClassName: h = "dial-small-text" }) => {
19
+ let { myCollectionLabel: v = "My Collection", emptyHintLabel: b = "Star a prompt to pin it here", browseLabel: T = "Browse", removeFromFavoritesLabel: E = "Remove from favorites" } = l, D = n({
20
20
  "--fp-row-hover-bg": u?.rowHoverBackground,
21
21
  "--fp-header-text": u?.headerText,
22
22
  "--fp-empty-hint-text": u?.emptyHintText,
23
23
  "--fp-star-color": u?.starColor,
24
24
  "--fp-footer-border": u?.footerBorder
25
- }), [M, N] = x(/* @__PURE__ */ new Set()), P = b(/* @__PURE__ */ new Map());
26
- g(() => {
25
+ }), [M, N] = S(/* @__PURE__ */ new Set()), P = x(/* @__PURE__ */ new Map());
26
+ _(() => {
27
27
  let e = P.current;
28
28
  return () => {
29
29
  e.forEach((e) => clearTimeout(e)), e.clear();
30
30
  };
31
31
  }, []);
32
- let F = b(null), [I, L] = x();
33
- v(() => {
34
- F.current && L(Math.min(F.current.scrollHeight, A));
32
+ let F = x(null), [I, L] = S();
33
+ y(() => {
34
+ F.current && L(Math.min(F.current.scrollHeight, j));
35
35
  }, [e]);
36
36
  let R = (e, t) => {
37
- e.target === e.currentTarget && (e.key === "Enter" || e.key === " ") && (e.preventDefault(), o(t));
37
+ e.target === e.currentTarget && (e.key === "Enter" || e.key === " ") && (e.preventDefault(), a(t));
38
38
  }, z = (e) => {
39
39
  N((t) => new Set(t).add(e));
40
40
  let t = setTimeout(() => {
@@ -42,44 +42,44 @@ var D = {
42
42
  let n = new Set(t);
43
43
  return n.delete(e), n;
44
44
  }), P.current.delete(e);
45
- }, k);
45
+ }, A);
46
46
  P.current.set(e, t);
47
47
  };
48
- return /* @__PURE__ */ C("div", {
48
+ return /* @__PURE__ */ w("div", {
49
49
  className: "flex min-w-[240px] flex-col",
50
- style: j,
50
+ style: D,
51
51
  children: [
52
- /* @__PURE__ */ S("p", {
53
- className: r(m, O, D.header),
54
- children: y
52
+ /* @__PURE__ */ C("p", {
53
+ className: r(f, k, O.header),
54
+ children: v
55
55
  }),
56
- /* @__PURE__ */ S("div", {
57
- className: r("max-h-72 min-h-0 flex-1 overflow-y-auto", D.listContent),
56
+ /* @__PURE__ */ C("div", {
57
+ className: r("max-h-72 min-h-0 flex-1 overflow-y-auto", O.listContent),
58
58
  style: { maxHeight: I },
59
- children: /* @__PURE__ */ S("div", {
59
+ children: /* @__PURE__ */ C("div", {
60
60
  ref: F,
61
- children: e.length > 0 ? /* @__PURE__ */ S("ul", {
61
+ children: e.length > 0 ? /* @__PURE__ */ C("ul", {
62
62
  className: "flex flex-col gap-1 px-1 pb-1",
63
63
  children: e.map((e) => {
64
- let n = /* @__PURE__ */ C("div", {
64
+ let n = /* @__PURE__ */ w("div", {
65
65
  role: "button",
66
66
  tabIndex: 0,
67
- className: r("flex cursor-pointer items-center gap-2 rounded-lg border border-transparent px-2 py-1.5 transition-colors", D.row),
68
- onClick: () => o(e),
67
+ className: r("flex cursor-pointer items-center gap-2 rounded-lg border border-transparent px-2 py-1.5 transition-colors", O.row),
68
+ onClick: () => a(e),
69
69
  onKeyDown: (t) => R(t, e),
70
70
  children: [
71
- /* @__PURE__ */ S(t, {
71
+ /* @__PURE__ */ C(t, {
72
72
  size: i.MD,
73
73
  initialsName: e.name
74
74
  }),
75
- /* @__PURE__ */ S("span", {
75
+ /* @__PURE__ */ C("span", {
76
76
  className: r(d, "min-w-0 flex-1 truncate text-start"),
77
77
  children: e.name
78
78
  }),
79
- /* @__PURE__ */ S(f, {
80
- icon: /* @__PURE__ */ S(h, {
79
+ /* @__PURE__ */ C(p, {
80
+ icon: /* @__PURE__ */ C(g, {
81
81
  size: i.SM,
82
- className: D.star,
82
+ className: O.star,
83
83
  "aria-hidden": !0
84
84
  }),
85
85
  "aria-label": E,
@@ -89,25 +89,25 @@ var D = {
89
89
  }
90
90
  })
91
91
  ]
92
- }), a = e.description != null && e.description !== "";
93
- return /* @__PURE__ */ S("li", {
94
- className: M.has(e.id) ? D.rowLeaving : D.rowEnter,
95
- children: a ? /* @__PURE__ */ S(p, {
92
+ }), o = e.description != null && e.description !== "";
93
+ return /* @__PURE__ */ C("li", {
94
+ className: M.has(e.id) ? O.rowLeaving : O.rowEnter,
95
+ children: o ? /* @__PURE__ */ C(m, {
96
96
  tooltip: e.description,
97
97
  triggerClassName: "block",
98
98
  children: n
99
99
  }) : n
100
100
  }, e.id);
101
101
  })
102
- }) : /* @__PURE__ */ S("p", {
103
- className: r(_, "px-4 py-4 text-start", D.emptyHint),
104
- children: w
102
+ }) : /* @__PURE__ */ C("p", {
103
+ className: r(h, "px-4 py-4 text-start", O.emptyHint),
104
+ children: b
105
105
  })
106
106
  })
107
107
  }),
108
- /* @__PURE__ */ S("div", {
109
- className: r("border-t px-2 py-3", D.footer),
110
- children: /* @__PURE__ */ S(a, {
108
+ /* @__PURE__ */ C("div", {
109
+ className: r("border-t px-2 py-3", O.footer),
110
+ children: /* @__PURE__ */ C(o, {
111
111
  label: T,
112
112
  className: "w-full justify-center",
113
113
  onClick: c
@@ -115,88 +115,89 @@ var D = {
115
115
  })
116
116
  ]
117
117
  });
118
- }, M = { card: "_card_p8vwa_1" }, N = ({ open: t, promptName: i, content: a, description: f, parameters: p, onBack: h, onClose: g, onSubmit: v, onCancel: b, labels: D = {}, colors: O, titleClassName: k = "dial-h2-text", parametersLabelClassName: A = "dial-h2-text", detailsLabelClassName: j = "dial-h2-text" }) => {
119
- let { title: N = "Prompt parameters", closeLabel: P = "Close", backLabel: F = "Back", parametersLabel: I = "Parameters", detailsLabel: L = "Details", enterValuePlaceholder: R = "Enter value", cancelLabel: z = "Cancel", submitLabel: B = "Confirm" } = D, [V, H] = x({}), U = _(), W = n({
120
- "--pp-card-bg": O?.cardBackground,
121
- "--pp-card-border": O?.cardBorder
122
- }), G = y(() => p.some((e) => !V[e]?.trim()), [p, V]);
123
- return /* @__PURE__ */ S(c, {
118
+ }, N = { card: "_card_p8vwa_1" }, P = ({ open: t, promptName: i, content: o, description: p, parameters: m, onBack: g, onClose: _, onSubmit: y, onCancel: x, labels: O = {}, colors: k, titleClassName: A = "dial-h2-text", parametersLabelClassName: j = "dial-h2-text", detailsLabelClassName: M = "dial-h2-text" }) => {
119
+ let { title: P = "Prompt parameters", closeLabel: F = "Close", backLabel: I = "Back", parametersLabel: L = "Parameters", detailsLabel: R = "Details", enterValuePlaceholder: z = "Enter value", cancelLabel: B = "Cancel", submitLabel: V = "Confirm" } = O, [H, U] = S({}), W = v(), G = n({
120
+ "--pp-card-bg": k?.cardBackground,
121
+ "--pp-card-border": k?.cardBorder
122
+ }), K = b(() => m.some((e) => !H[e]?.trim()), [m, H]);
123
+ return /* @__PURE__ */ C(l, {
124
124
  open: t,
125
- header: /* @__PURE__ */ C("div", {
125
+ header: /* @__PURE__ */ w("div", {
126
126
  className: "flex items-center gap-2",
127
- children: [h != null && /* @__PURE__ */ S(o, {
128
- icon: /* @__PURE__ */ S(m, {
127
+ children: [g != null && /* @__PURE__ */ C(s, {
128
+ icon: /* @__PURE__ */ C(h, {
129
129
  className: "rtl:scale-x-[-1]",
130
- "aria-hidden": !0
130
+ "aria-hidden": !0,
131
+ stroke: a
131
132
  }),
132
- "aria-label": F,
133
- onClick: h
134
- }), /* @__PURE__ */ S("span", {
135
- className: k,
136
- children: N
133
+ "aria-label": I,
134
+ onClick: g
135
+ }), /* @__PURE__ */ C("span", {
136
+ className: A,
137
+ children: P
137
138
  })]
138
139
  }),
139
- ariaLabel: N,
140
- size: l.Lg,
141
- closeAriaLabel: P,
142
- onClose: g,
143
- footer: /* @__PURE__ */ C("div", {
140
+ ariaLabel: P,
141
+ size: u.Lg,
142
+ closeAriaLabel: F,
143
+ onClose: _,
144
+ footer: /* @__PURE__ */ w("div", {
144
145
  className: "flex justify-end gap-2 px-6 py-4",
145
- children: [/* @__PURE__ */ S(s, {
146
- label: z,
147
- onClick: b
148
- }), /* @__PURE__ */ S(u, {
146
+ children: [/* @__PURE__ */ C(c, {
149
147
  label: B,
150
- disabled: G,
148
+ onClick: x
149
+ }), /* @__PURE__ */ C(d, {
150
+ label: V,
151
+ disabled: K,
151
152
  onClick: () => {
152
- G || v(V);
153
+ K || y(H);
153
154
  }
154
155
  })]
155
156
  }),
156
- children: /* @__PURE__ */ C("div", {
157
+ children: /* @__PURE__ */ w("div", {
157
158
  className: "flex flex-col gap-4 px-6 pb-4 pt-2",
158
- children: [/* @__PURE__ */ S("div", {
159
- className: r("flex h-[72px] w-full items-center rounded-lg border px-3", M.card),
160
- style: W,
161
- children: /* @__PURE__ */ S(w, {
159
+ children: [/* @__PURE__ */ C("div", {
160
+ className: r("flex h-[72px] w-full items-center rounded-lg border px-3", N.card),
161
+ style: G,
162
+ children: /* @__PURE__ */ C(T, {
162
163
  type: e.Prompt,
163
164
  name: i,
164
- size: E.LG,
165
+ size: D.LG,
165
166
  className: "w-full"
166
167
  })
167
- }), /* @__PURE__ */ C("div", {
168
+ }), /* @__PURE__ */ w("div", {
168
169
  className: "grid grid-cols-2 gap-4",
169
- children: [/* @__PURE__ */ C("div", {
170
+ children: [/* @__PURE__ */ w("div", {
170
171
  className: "flex flex-col gap-3",
171
- children: [/* @__PURE__ */ S("h2", {
172
- className: r(A, "m-0"),
173
- children: I
174
- }), p.map((e) => {
175
- let t = `${U}-${e}`;
176
- return /* @__PURE__ */ S(d, {
172
+ children: [/* @__PURE__ */ C("h2", {
173
+ className: r(j, "m-0"),
174
+ children: L
175
+ }), m.map((e) => {
176
+ let t = `${W}-${e}`;
177
+ return /* @__PURE__ */ C(f, {
177
178
  id: t,
178
179
  "aria-label": e,
179
- value: V[e] ?? "",
180
+ value: H[e] ?? "",
180
181
  labelProps: {
181
182
  htmlFor: t,
182
183
  label: e,
183
184
  required: !0
184
185
  },
185
- placeholder: R,
186
- onChange: (t) => H((n) => ({
186
+ placeholder: z,
187
+ onChange: (t) => U((n) => ({
187
188
  ...n,
188
189
  [e]: t
189
190
  }))
190
191
  }, e);
191
192
  })]
192
- }), /* @__PURE__ */ C("div", {
193
+ }), /* @__PURE__ */ w("div", {
193
194
  className: "flex min-h-0 flex-col gap-3",
194
- children: [/* @__PURE__ */ S("h2", {
195
- className: r(j, "m-0"),
196
- children: L
197
- }), /* @__PURE__ */ S(T, {
198
- content: a,
199
- description: f
195
+ children: [/* @__PURE__ */ C("h2", {
196
+ className: r(M, "m-0"),
197
+ children: R
198
+ }), /* @__PURE__ */ C(E, {
199
+ content: o,
200
+ description: p
200
201
  })]
201
202
  })]
202
203
  })]
@@ -204,4 +205,4 @@ var D = {
204
205
  });
205
206
  };
206
207
  //#endregion
207
- export { j as FavoritePromptsPanel, N as PromptParametersPopup };
208
+ export { M as FavoritePromptsPanel, P as PromptParametersPopup };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@epam/ai-dial-prompts",
3
3
  "description": "Host-agnostic UI for picking a favorite prompt and resolving its {{parameter}} placeholders before it is inserted into a chat message",
4
- "version": "1.1.0-dev.298",
4
+ "version": "1.1.0-dev.300",
5
5
  "license": "Apache-2.0",
6
6
  "type": "module",
7
7
  "main": "./index.js",
@@ -16,8 +16,8 @@
16
16
  }
17
17
  },
18
18
  "peerDependencies": {
19
- "@epam/ai-dial-catalog": "1.1.0-dev.298",
20
- "@epam/ai-dial-chat-shared": "1.1.0-dev.298",
19
+ "@epam/ai-dial-catalog": "1.1.0-dev.300",
20
+ "@epam/ai-dial-chat-shared": "1.1.0-dev.300",
21
21
  "@epam/ai-dial-ui-kit": "*",
22
22
  "@tabler/icons-react": "^3.0.0",
23
23
  "react": "^19.0.0"