@epam/ai-dial-navigation-panel 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 (8) hide show
  1. package/components/NavigationPanel/NavigationPanel.d.ts.map +1 -1
  2. package/components/NavigationSheet/NavigationMenuPage.d.ts.map +1 -1
  3. package/components/NavigationSheet/ProfilePage.d.ts.map +1 -1
  4. package/components/UserMenu/UserMenu.d.ts.map +1 -1
  5. package/components/common/MenuItemLabel.d.ts.map +1 -1
  6. package/index.css +1 -1
  7. package/index.js +186 -183
  8. package/package.json +3 -3
package/components/NavigationPanel/NavigationPanel.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"NavigationPanel.d.ts","sourceRoot":"","sources":["../../../src/components/NavigationPanel/NavigationPanel.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA2B,KAAK,EAAE,EAAkB,MAAM,OAAO,CAAC;AAKzE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,qCAAqC,CAAC;AAYhF;;;GAGG;AACH,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CA2EpD,CAAC"}
1
+ {"version":3,"file":"NavigationPanel.d.ts","sourceRoot":"","sources":["../../../src/components/NavigationPanel/NavigationPanel.tsx"],"names":[],"mappings":"AAMA,OAAO,EAA2B,KAAK,EAAE,EAAkB,MAAM,OAAO,CAAC;AAKzE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,qCAAqC,CAAC;AAYhF;;;GAGG;AACH,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CAgFpD,CAAC"}
package/components/NavigationSheet/NavigationMenuPage.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"NavigationMenuPage.d.ts","sourceRoot":"","sources":["../../../src/components/NavigationSheet/NavigationMenuPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAQ,KAAK,EAAE,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AACxE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AACxE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAIvE,sCAAsC;AACtC,MAAM,WAAW,uBAAuB;IACtC,uDAAuD;IACvD,KAAK,EAAE,mBAAmB,EAAE,CAAC;IAC7B,iEAAiE;IACjE,YAAY,EAAE,CAAC,IAAI,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAClD,yEAAyE;IACzE,YAAY,EAAE,MAAM,CAAC;IACrB,oDAAoD;IACpD,WAAW,EAAE,MAAM,CAAC;IACpB,+DAA+D;IAC/D,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,qEAAqE;IACrE,OAAO,CAAC,EAAE,qBAAqB,CAAC;IAChC,4EAA4E;IAC5E,MAAM,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAC/B,gEAAgE;IAChE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,yFAAyF;IACzF,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,mFAAmF;AACnF,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,uBAAuB,CA4D1D,CAAC"}
1
+ {"version":3,"file":"NavigationMenuPage.d.ts","sourceRoot":"","sources":["../../../src/components/NavigationSheet/NavigationMenuPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAQ,KAAK,EAAE,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AACxE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AACxE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAIvE,sCAAsC;AACtC,MAAM,WAAW,uBAAuB;IACtC,uDAAuD;IACvD,KAAK,EAAE,mBAAmB,EAAE,CAAC;IAC7B,iEAAiE;IACjE,YAAY,EAAE,CAAC,IAAI,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAClD,yEAAyE;IACzE,YAAY,EAAE,MAAM,CAAC;IACrB,oDAAoD;IACpD,WAAW,EAAE,MAAM,CAAC;IACpB,+DAA+D;IAC/D,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,qEAAqE;IACrE,OAAO,CAAC,EAAE,qBAAqB,CAAC;IAChC,4EAA4E;IAC5E,MAAM,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAC/B,gEAAgE;IAChE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,yFAAyF;IACzF,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,mFAAmF;AACnF,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,uBAAuB,CAuE1D,CAAC"}
package/components/NavigationSheet/ProfilePage.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ProfilePage.d.ts","sourceRoot":"","sources":["../../../src/components/NavigationSheet/ProfilePage.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAQ,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAEtC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AACxE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAMvE,+BAA+B;AAC/B,MAAM,WAAW,gBAAgB;IAC/B,wDAAwD;IACxD,OAAO,EAAE,qBAAqB,CAAC;IAC/B,gCAAgC;IAChC,WAAW,EAAE,MAAM,CAAC;IACpB,mEAAmE;IACnE,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,8EAA8E;IAC9E,MAAM,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAC/B,yFAAyF;IACzF,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;GAGG;AACH,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CAmF5C,CAAC"}
1
+ {"version":3,"file":"ProfilePage.d.ts","sourceRoot":"","sources":["../../../src/components/NavigationSheet/ProfilePage.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAQ,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAEtC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AACxE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAMvE,+BAA+B;AAC/B,MAAM,WAAW,gBAAgB;IAC/B,wDAAwD;IACxD,OAAO,EAAE,qBAAqB,CAAC;IAC/B,gCAAgC;IAChC,WAAW,EAAE,MAAM,CAAC;IACpB,mEAAmE;IACnE,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,8EAA8E;IAC9E,MAAM,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAC/B,yFAAyF;IACzF,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;GAGG;AACH,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CAyF5C,CAAC"}
package/components/UserMenu/UserMenu.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"UserMenu.d.ts","sourceRoot":"","sources":["../../../src/components/UserMenu/UserMenu.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAiB,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAMlE;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CA2HtC,CAAC"}
1
+ {"version":3,"file":"UserMenu.d.ts","sourceRoot":"","sources":["../../../src/components/UserMenu/UserMenu.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAiB,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAMlE;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CAuItC,CAAC"}
package/components/common/MenuItemLabel.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MenuItemLabel.d.ts","sourceRoot":"","sources":["../../../src/components/common/MenuItemLabel.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAQ,KAAK,EAAE,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGtD,iCAAiC;AACjC,MAAM,WAAW,kBAAkB;IACjC,+BAA+B;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,8EAA8E;IAC9E,QAAQ,EAAE,OAAO,CAAC;IAClB,6BAA6B;IAC7B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,qFAAqF;IACrF,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,iFAAiF;AACjF,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CA4BhD,CAAC"}
1
+ {"version":3,"file":"MenuItemLabel.d.ts","sourceRoot":"","sources":["../../../src/components/common/MenuItemLabel.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAQ,KAAK,EAAE,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGtD,iCAAiC;AACjC,MAAM,WAAW,kBAAkB;IACjC,+BAA+B;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,8EAA8E;IAC9E,QAAQ,EAAE,OAAO,CAAC;IAClB,6BAA6B;IAC7B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,qFAAqF;IACrF,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,iFAAiF;AACjF,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CA6BhD,CAAC"}
package/index.css CHANGED
@@ -1,2 +1,2 @@
1
- ._rail_1flg4_1{background:var(--np-bg,var(--bg-layer-raised,#fcfcfc));font-family:var(--np-font-family,inherit)}._item_1flg4_6{color:var(--np-item-text,var(--text-secondary,#57647a))}._item_1flg4_6:hover{background:var(--np-item-hover-bg,var(--bg-control-accent-alpha-hover,#2764d924))}._item_1flg4_6:active{background:var(--np-item-active-bg,var(--bg-control-accent-alpha-active,#2764d933))}a:focus-visible>._item_1flg4_6{background:var(--np-item-hover-bg,var(--bg-control-accent-alpha-hover,#2764d924))}._itemActive_1flg4_19{background:var(--np-item-selected-bg,var(--bg-control-accent-alpha-hover,#2764d924));color:var(--np-item-active-text,var(--text-accent,#1d4ed8))}._avatar_15lbd_1{background:var(--np-avatar-bg,var(--bg-control-accent,#1d4ed8));color:var(--np-avatar-text,var(--text-control-permanent,#fcfcfc))}._label_15lbd_6{color:var(--np-menu-text,var(--text-primary,#161b2d))}._activeIcon_15lbd_10{color:var(--np-menu-active-icon,var(--text-accent,#1d4ed8))}._wrapper_1nw3p_1{font-family:var(--np-font-family,inherit)}._trigger_1nw3p_5:hover{background:var(--np-trigger-hover-bg,var(--bg-control-accent-alpha-hover,#2764d924))}._trigger_1nw3p_5:focus-visible{background:var(--np-trigger-hover-bg,var(--bg-control-accent-alpha-hover,#2764d924));outline:1px solid var(--np-focus-outline,var(--stroke-focus-black,#161b2d));outline-offset:-1px}._identityText_1nw3p_14{color:var(--np-menu-text,var(--text-primary,#161b2d))}._sheet_3xav0_1{font-family:var(--np-font-family,inherit)}._row_3xav0_5{color:var(--np-sheet-text,var(--text-primary,#161b2d))}._row_3xav0_5:hover,._row_3xav0_5:focus-visible{background:var(--np-sheet-item-hover,var(--bg-control-accent-alpha-hover,#2764d924))}._row_3xav0_5:active{background:var(--np-sheet-item-active,var(--bg-control-neutral-active,#d1dbea))}._rowIcon_3xav0_15{color:var(--np-sheet-icon,var(--text-secondary,#57647a))}._divider_3xav0_19{border-color:var(--np-sheet-divider,var(--stroke-secondary,#d1dbea))}._mutedText_3xav0_23{color:var(--np-sheet-muted-text,var(--text-secondary,#57647a))}._activeIcon_3xav0_27{color:var(--np-menu-active-icon,var(--text-accent,#1d4ed8))}
1
+ ._rail_h528m_1{background:var(--np-bg,var(--bg-layer-raised,#fcfcfc));font-family:var(--np-font-family,inherit)}._item_h528m_6{color:var(--np-item-text,var(--text-secondary,#57647a))}._item_h528m_6:hover{background:var(--np-item-hover-bg,var(--bg-control-accent-alpha-hover,#2764d924))}._item_h528m_6:active{background:var(--np-item-active-bg,var(--bg-control-accent-alpha-active,#2764d933))}a:focus-visible>._item_h528m_6{background:var(--np-item-hover-bg,var(--bg-control-accent-alpha-hover,#2764d924))}._itemActive_h528m_19{background:var(--np-item-selected-bg,var(--bg-control-accent-alpha,#2764d90f));color:var(--np-item-active-text,var(--text-accent,#1d4ed8))}._avatar_15lbd_1{background:var(--np-avatar-bg,var(--bg-control-accent,#1d4ed8));color:var(--np-avatar-text,var(--text-control-permanent,#fcfcfc))}._label_15lbd_6{color:var(--np-menu-text,var(--text-primary,#161b2d))}._activeIcon_15lbd_10{color:var(--np-menu-active-icon,var(--text-accent,#1d4ed8))}._wrapper_1nw3p_1{font-family:var(--np-font-family,inherit)}._trigger_1nw3p_5:hover{background:var(--np-trigger-hover-bg,var(--bg-control-accent-alpha-hover,#2764d924))}._trigger_1nw3p_5:focus-visible{background:var(--np-trigger-hover-bg,var(--bg-control-accent-alpha-hover,#2764d924));outline:1px solid var(--np-focus-outline,var(--stroke-focus-black,#161b2d));outline-offset:-1px}._identityText_1nw3p_14{color:var(--np-menu-text,var(--text-primary,#161b2d))}._sheet_3xav0_1{font-family:var(--np-font-family,inherit)}._row_3xav0_5{color:var(--np-sheet-text,var(--text-primary,#161b2d))}._row_3xav0_5:hover,._row_3xav0_5:focus-visible{background:var(--np-sheet-item-hover,var(--bg-control-accent-alpha-hover,#2764d924))}._row_3xav0_5:active{background:var(--np-sheet-item-active,var(--bg-control-neutral-active,#d1dbea))}._rowIcon_3xav0_15{color:var(--np-sheet-icon,var(--text-secondary,#57647a))}._divider_3xav0_19{border-color:var(--np-sheet-divider,var(--stroke-secondary,#d1dbea))}._mutedText_3xav0_23{color:var(--np-sheet-muted-text,var(--text-secondary,#57647a))}._activeIcon_3xav0_27{color:var(--np-menu-active-icon,var(--text-accent,#1d4ed8))}
2
2
  /*$vite$:1*/
package/index.js CHANGED
@@ -1,117 +1,118 @@
1
1
  import { buildCssVars as e, mergeClasses as t } from "@epam/ai-dial-chat-shared";
2
- import { BASE_ICON_SIZE as n, DIAL_ICON_SIZE as r, Dropdown as i, DropdownItemType as a, EllipsisTooltip as o, IconButton as s, Tooltip as c } from "@epam/ai-dial-ui-kit";
3
- import { Fragment as l, createContext as u, memo as d, useCallback as f, useContext as p, useEffect as m, useMemo as h, useState as g } from "react";
4
- import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
5
- import { IconCheck as b, IconChevronRight as x, IconLogout as S, IconSettings as C, IconUser as w } from "@tabler/icons-react";
6
- import { BottomSheetShell as T } from "@epam/ai-dial-conversation-input";
7
- var E = {
8
- rail: "_rail_1flg4_1",
9
- item: "_item_1flg4_6",
10
- itemActive: "_itemActive_1flg4_19"
11
- }, D = (e, t) => /* @__PURE__ */ v("a", {
2
+ import { BASE_ICON_SIZE as n, DIAL_ICON_SIZE as r, DIAL_KIT_ICON_STROKE as i, Dropdown as a, DropdownItemType as o, EllipsisTooltip as s, IconButton as c, Tooltip as l } from "@epam/ai-dial-ui-kit";
3
+ import { Fragment as u, createContext as d, memo as f, useCallback as p, useContext as m, useEffect as h, useMemo as g, useState as _ } from "react";
4
+ import { Fragment as v, jsx as y, jsxs as b } from "react/jsx-runtime";
5
+ import { IconCheck as x, IconChevronRight as S, IconLogout as C, IconSettings as w, IconUser as T } from "@tabler/icons-react";
6
+ import { BottomSheetShell as E } from "@epam/ai-dial-conversation-input";
7
+ var D = {
8
+ rail: "_rail_h528m_1",
9
+ item: "_item_h528m_6",
10
+ itemActive: "_itemActive_h528m_19"
11
+ }, O = (e, t) => /* @__PURE__ */ y("a", {
12
12
  href: e.href,
13
13
  className: "contents",
14
14
  children: t
15
- }), O = d(({ items: n, labels: i, logo: a, footer: o, renderLink: c = D, styles: u }) => {
16
- let { colors: d, typography: f, className: p, cssVars: m } = u ?? {}, g = h(() => e({
17
- "--np-bg": d?.background,
18
- "--np-item-text": d?.itemText,
19
- "--np-item-active-text": d?.itemActiveText,
20
- "--np-item-selected-bg": d?.itemSelectedBackground,
21
- "--np-item-hover-bg": d?.itemHoverBackground,
22
- "--np-item-active-bg": d?.itemActiveBackground,
23
- "--np-font-family": f?.fontFamily
24
- }), [d, f?.fontFamily]);
25
- return /* @__PURE__ */ y("nav", {
26
- "aria-label": i.ariaLabel,
15
+ }), k = f(({ items: n, labels: a, logo: o, footer: s, renderLink: l = O, styles: d }) => {
16
+ let { colors: f, typography: p, className: m, cssVars: h } = d ?? {}, _ = g(() => e({
17
+ "--np-bg": f?.background,
18
+ "--np-item-text": f?.itemText,
19
+ "--np-item-active-text": f?.itemActiveText,
20
+ "--np-item-selected-bg": f?.itemSelectedBackground,
21
+ "--np-item-hover-bg": f?.itemHoverBackground,
22
+ "--np-item-active-bg": f?.itemActiveBackground,
23
+ "--np-font-family": p?.fontFamily
24
+ }), [f, p?.fontFamily]);
25
+ return /* @__PURE__ */ b("nav", {
26
+ "aria-label": a.ariaLabel,
27
27
  style: {
28
- ...m,
29
- ...g
28
+ ...h,
29
+ ..._
30
30
  },
31
- className: t(E.rail, "relative z-10 flex h-full w-[60px] flex-col justify-between shadow-md", f?.fontClassName, p),
32
- children: [/* @__PURE__ */ y("div", {
31
+ className: t(D.rail, "relative z-10 flex h-full w-[60px] flex-col justify-between shadow-sm", p?.fontClassName, m),
32
+ children: [/* @__PURE__ */ b("div", {
33
33
  className: "flex flex-col items-center",
34
- children: [a && /* @__PURE__ */ v("a", {
35
- href: a.href ?? "/",
36
- "aria-label": a.ariaLabel,
34
+ children: [o && /* @__PURE__ */ y("a", {
35
+ href: o.href ?? "/",
36
+ "aria-label": o.ariaLabel,
37
37
  className: "flex h-16 w-full shrink-0 items-center justify-center",
38
- children: /* @__PURE__ */ v("span", {
39
- style: { backgroundImage: `url(${a.iconUrl})` },
38
+ children: /* @__PURE__ */ y("span", {
39
+ style: { backgroundImage: `url(${o.iconUrl})` },
40
40
  className: "h-6 w-6 bg-contain bg-center bg-no-repeat"
41
41
  })
42
- }), /* @__PURE__ */ v("div", {
42
+ }), /* @__PURE__ */ y("div", {
43
43
  className: "flex flex-col items-center gap-2 p-2",
44
- children: n.map((e) => /* @__PURE__ */ v(l, { children: c(e, /* @__PURE__ */ v(s, {
45
- icon: /* @__PURE__ */ v(e.icon, {
44
+ children: n.map((e) => /* @__PURE__ */ y(u, { children: l(e, /* @__PURE__ */ y(c, {
45
+ icon: /* @__PURE__ */ y(e.icon, {
46
46
  size: r.LG,
47
- stroke: 1.5
47
+ stroke: i
48
48
  }),
49
49
  "aria-label": e.label,
50
50
  "aria-current": e.isActive ? "page" : void 0,
51
51
  tooltipProps: { tooltip: e.label },
52
52
  tabIndex: -1,
53
- className: t(E.item, "rounded-xl", e.isActive && E.itemActive)
53
+ className: t(D.item, "rounded-xl", e.isActive && D.itemActive)
54
54
  })) }, e.id))
55
55
  })]
56
- }), o]
56
+ }), s]
57
57
  });
58
- }), k = {
58
+ }), A = {
59
59
  avatar: "_avatar_15lbd_1",
60
60
  label: "_label_15lbd_6",
61
61
  activeIcon: "_activeIcon_15lbd_10"
62
- }, A = d(({ shortName: e, className: n, textClassName: r = "dial-tiny-text" }) => /* @__PURE__ */ v("div", {
63
- className: t(k.avatar, "flex size-[28px] flex-shrink-0 items-center justify-center rounded-full", r, n),
62
+ }, j = f(({ shortName: e, className: n, textClassName: r = "dial-tiny-text" }) => /* @__PURE__ */ y("div", {
63
+ className: t(A.avatar, "flex size-[28px] flex-shrink-0 items-center justify-center rounded-full", r, n),
64
64
  children: e
65
- })), j = d(({ label: e, isActive: n, icon: i, textClassName: a = "dial-small-text" }) => {
66
- let o = /* @__PURE__ */ v("span", {
67
- className: t(k.label, "truncate", a),
65
+ })), M = f(({ label: e, isActive: n, icon: a, textClassName: o = "dial-small-text" }) => {
66
+ let s = /* @__PURE__ */ y("span", {
67
+ className: t(A.label, "truncate", o),
68
68
  children: e
69
69
  });
70
- return /* @__PURE__ */ y("span", {
70
+ return /* @__PURE__ */ b("span", {
71
71
  className: "flex items-center justify-between gap-4",
72
- children: [i ? /* @__PURE__ */ y("span", {
72
+ children: [a ? /* @__PURE__ */ b("span", {
73
73
  className: "flex items-center gap-2",
74
- children: [i, o]
75
- }) : o, n && /* @__PURE__ */ v(b, {
74
+ children: [a, s]
75
+ }) : s, n && /* @__PURE__ */ y(x, {
76
76
  size: r.SM,
77
77
  "aria-hidden": !0,
78
- className: k.activeIcon
78
+ className: A.activeIcon,
79
+ stroke: i
79
80
  })]
80
81
  });
81
- }), M = d(({ profile: e, alt: t }) => e.isFallbackShown || !e.imageUrl ? /* @__PURE__ */ v(A, { shortName: e.shortName }) : /* @__PURE__ */ v("img", {
82
+ }), N = f(({ profile: e, alt: t }) => e.isFallbackShown || !e.imageUrl ? /* @__PURE__ */ y(j, { shortName: e.shortName }) : /* @__PURE__ */ y("img", {
82
83
  className: "rounded-full",
83
84
  src: e.imageUrl,
84
85
  width: 28,
85
86
  height: 28,
86
87
  alt: t,
87
88
  onError: e.onImageError
88
- })), N = {
89
+ })), P = {
89
90
  wrapper: "_wrapper_1nw3p_1",
90
91
  trigger: "_trigger_1nw3p_5",
91
92
  identityText: "_identityText_1nw3p_14"
92
- }, P = d(({ profile: n, labels: s, groups: l, onLogout: u, onSettings: d, isTooltipHidden: f, styles: p }) => {
93
- let { colors: m, typography: g, className: _, cssVars: b } = p ?? {}, x = g?.fontClassName ?? "dial-small-text", w = h(() => e({
94
- "--np-avatar-bg": m?.avatarBackground,
95
- "--np-avatar-text": m?.avatarText,
96
- "--np-menu-text": m?.text,
97
- "--np-menu-active-icon": m?.activeIcon,
98
- "--np-trigger-hover-bg": m?.triggerHoverBackground,
99
- "--np-font-family": g?.fontFamily
100
- }), [m, g?.fontFamily]), T = h(() => {
101
- let e = (l ?? []).filter(({ options: e }) => e.length > 0).map(({ id: e, label: t, icon: n, options: r }) => ({
93
+ }, F = f(({ profile: n, labels: c, groups: u, onLogout: d, onSettings: f, isTooltipHidden: p, styles: m }) => {
94
+ let { colors: h, typography: _, className: v, cssVars: x } = m ?? {}, S = _?.fontClassName ?? "dial-small-text", T = g(() => e({
95
+ "--np-avatar-bg": h?.avatarBackground,
96
+ "--np-avatar-text": h?.avatarText,
97
+ "--np-menu-text": h?.text,
98
+ "--np-menu-active-icon": h?.activeIcon,
99
+ "--np-trigger-hover-bg": h?.triggerHoverBackground,
100
+ "--np-font-family": _?.fontFamily
101
+ }), [h, _?.fontFamily]), E = g(() => {
102
+ let e = (u ?? []).filter(({ options: e }) => e.length > 0).map(({ id: e, label: t, icon: n, options: r }) => ({
102
103
  key: e,
103
- label: /* @__PURE__ */ v("span", {
104
- className: x,
104
+ label: /* @__PURE__ */ y("span", {
105
+ className: S,
105
106
  children: t
106
107
  }),
107
108
  icon: n,
108
109
  children: r.map((e) => ({
109
110
  key: e.id,
110
- label: /* @__PURE__ */ v(j, {
111
+ label: /* @__PURE__ */ y(M, {
111
112
  label: e.label,
112
113
  isActive: e.isActive,
113
114
  icon: e.icon,
114
- textClassName: x
115
+ textClassName: S
115
116
  }),
116
117
  onClick: e.onSelect
117
118
  }))
@@ -119,247 +120,249 @@ var E = {
119
120
  return [
120
121
  {
121
122
  key: "identity",
122
- type: a.PlainText,
123
- label: /* @__PURE__ */ y("div", {
123
+ type: o.PlainText,
124
+ label: /* @__PURE__ */ b("div", {
124
125
  className: "flex h-[40px] min-w-0 items-center gap-3",
125
- children: [/* @__PURE__ */ v(A, { shortName: n.shortName }), /* @__PURE__ */ v(o, {
126
+ children: [/* @__PURE__ */ y(j, { shortName: n.shortName }), /* @__PURE__ */ y(s, {
126
127
  text: n.displayName,
127
- className: t(N.identityText, x, "min-w-0 flex-1 truncate")
128
+ className: t(P.identityText, S, "min-w-0 flex-1 truncate")
128
129
  })]
129
130
  })
130
131
  },
131
132
  ...e,
132
133
  {
133
134
  key: "divider-1",
134
- type: a.Divider
135
+ type: o.Divider
135
136
  },
136
- ...d ? [{
137
+ ...f ? [{
137
138
  key: "settings",
138
- label: /* @__PURE__ */ v("span", {
139
- className: x,
140
- children: s.settings
139
+ label: /* @__PURE__ */ y("span", {
140
+ className: S,
141
+ children: c.settings
141
142
  }),
142
- icon: /* @__PURE__ */ v(C, {
143
+ icon: /* @__PURE__ */ y(w, {
143
144
  size: r.SM,
144
- "aria-hidden": !0
145
+ "aria-hidden": !0,
146
+ stroke: i
145
147
  }),
146
- onClick: d
148
+ onClick: f
147
149
  }] : [],
148
150
  {
149
151
  key: "logout",
150
- label: /* @__PURE__ */ v("span", {
151
- className: x,
152
- children: s.logOut
152
+ label: /* @__PURE__ */ y("span", {
153
+ className: S,
154
+ children: c.logOut
153
155
  }),
154
- icon: /* @__PURE__ */ v(S, {
156
+ icon: /* @__PURE__ */ y(C, {
155
157
  size: r.SM,
156
- "aria-hidden": !0
158
+ "aria-hidden": !0,
159
+ stroke: i
157
160
  }),
158
- onClick: u
161
+ onClick: d
159
162
  }
160
163
  ];
161
164
  }, [
162
- l,
163
- x,
164
- s.logOut,
165
- s.settings,
166
165
  u,
166
+ S,
167
+ c.logOut,
168
+ c.settings,
167
169
  d,
170
+ f,
168
171
  n.displayName,
169
172
  n.shortName
170
173
  ]);
171
- return /* @__PURE__ */ v("div", {
174
+ return /* @__PURE__ */ y("div", {
172
175
  style: {
173
- ...b,
174
- ...w
176
+ ...x,
177
+ ...T
175
178
  },
176
- className: t(N.wrapper, "flex size-[60px] items-center justify-center", _),
177
- children: /* @__PURE__ */ v(i, {
179
+ className: t(P.wrapper, "flex size-[60px] items-center justify-center", v),
180
+ children: /* @__PURE__ */ y(a, {
178
181
  placement: "top-end",
179
182
  matchReferenceWidth: !1,
180
- items: T,
181
- children: /* @__PURE__ */ v("button", {
183
+ items: E,
184
+ children: /* @__PURE__ */ y("button", {
182
185
  type: "button",
183
- className: t(N.trigger, "flex size-[44px] items-center justify-center rounded-full border border-transparent"),
184
- "aria-label": s.trigger,
185
- children: /* @__PURE__ */ v(c, {
186
+ className: t(P.trigger, "flex size-[44px] items-center justify-center rounded-full border border-transparent"),
187
+ "aria-label": c.trigger,
188
+ children: /* @__PURE__ */ y(l, {
186
189
  tooltip: n.email,
187
- hideTooltip: f,
188
- children: /* @__PURE__ */ v(M, {
190
+ hideTooltip: p,
191
+ children: /* @__PURE__ */ y(N, {
189
192
  profile: n,
190
- alt: s.avatarAlt
193
+ alt: c.avatarAlt
191
194
  })
192
195
  })
193
196
  })
194
197
  })
195
198
  });
196
- }), F = u(void 0), I = d(({ isOpen: e, onClose: t, children: n, title: r, closeLabel: i, backLabel: a, className: o, style: s }) => {
197
- let [c, l] = g([]);
198
- m(() => {
199
+ }), I = d(void 0), L = f(({ isOpen: e, onClose: t, children: n, title: r, closeLabel: i, backLabel: a, className: o, style: s }) => {
200
+ let [c, l] = _([]);
201
+ h(() => {
199
202
  e || l([]);
200
203
  }, [e]);
201
- let u = f((e) => {
204
+ let u = p((e) => {
202
205
  l((t) => [...t, e]);
203
- }, []), d = f(() => {
206
+ }, []), d = p(() => {
204
207
  l((e) => e.slice(0, -1));
205
- }, []), p = f(() => {
208
+ }, []), f = p(() => {
206
209
  l([]), t();
207
- }, [t]), _ = h(() => ({
210
+ }, [t]), m = g(() => ({
208
211
  push: u,
209
212
  pop: d,
210
- close: p
213
+ close: f
211
214
  }), [
212
215
  u,
213
216
  d,
214
- p
215
- ]), y = c[c.length - 1];
216
- return /* @__PURE__ */ v(F.Provider, {
217
- value: _,
218
- children: /* @__PURE__ */ v(T, {
217
+ f
218
+ ]), v = c[c.length - 1];
219
+ return /* @__PURE__ */ y(I.Provider, {
220
+ value: m,
221
+ children: /* @__PURE__ */ y(E, {
219
222
  isOpen: e,
220
- onClose: p,
221
- title: y?.title ?? r,
223
+ onClose: f,
224
+ title: v?.title ?? r,
222
225
  closeLabel: i,
223
- onBack: y ? d : void 0,
224
- backLabel: y ? a : void 0,
226
+ onBack: v ? d : void 0,
227
+ backLabel: v ? a : void 0,
225
228
  className: o,
226
229
  style: s,
227
- children: y ? y.content : n
230
+ children: v ? v.content : n
228
231
  })
229
232
  });
230
- }), L = () => {
231
- let e = p(F);
233
+ }), R = () => {
234
+ let e = m(I);
232
235
  if (!e) throw Error("useSheetNavigation must be used within a NavigableBottomSheet");
233
236
  return e;
234
- }, R = {
237
+ }, z = {
235
238
  sheet: "_sheet_3xav0_1",
236
239
  row: "_row_3xav0_5",
237
240
  rowIcon: "_rowIcon_3xav0_15",
238
241
  divider: "_divider_3xav0_19",
239
242
  mutedText: "_mutedText_3xav0_23",
240
243
  activeIcon: "_activeIcon_3xav0_27"
241
- }, z = d(({ label: e, onClick: n, icon: r, trailing: i, textClassName: a = "dial-small-text" }) => /* @__PURE__ */ v("li", { children: /* @__PURE__ */ y("button", {
244
+ }, B = f(({ label: e, onClick: n, icon: r, trailing: i, textClassName: a = "dial-small-text" }) => /* @__PURE__ */ y("li", { children: /* @__PURE__ */ b("button", {
242
245
  type: "button",
243
- className: t(R.row, "flex w-full items-center gap-3 px-4 py-[10px] text-start"),
246
+ className: t(z.row, "flex w-full items-center gap-3 px-4 py-[10px] text-start"),
244
247
  onClick: n,
245
248
  children: [
246
- r && /* @__PURE__ */ v("span", {
247
- className: R.rowIcon,
249
+ r && /* @__PURE__ */ y("span", {
250
+ className: z.rowIcon,
248
251
  children: r
249
252
  }),
250
- /* @__PURE__ */ v("span", {
253
+ /* @__PURE__ */ y("span", {
251
254
  className: t(a, "flex-1"),
252
255
  children: e
253
256
  }),
254
257
  i
255
258
  ]
256
- }) })), B = d(({ options: e, textClassName: t }) => {
257
- let { pop: n } = L();
258
- return /* @__PURE__ */ v("ul", {
259
+ }) })), V = f(({ options: e, textClassName: t }) => {
260
+ let { pop: n } = R();
261
+ return /* @__PURE__ */ y("ul", {
259
262
  className: "flex flex-col pb-4",
260
- children: e.map((e) => /* @__PURE__ */ v(z, {
263
+ children: e.map((e) => /* @__PURE__ */ y(B, {
261
264
  label: e.label,
262
265
  icon: e.icon,
263
266
  textClassName: t,
264
- trailing: e.isActive ? /* @__PURE__ */ v(b, {
267
+ trailing: e.isActive ? /* @__PURE__ */ y(x, {
265
268
  size: r.SM,
266
- stroke: 2,
269
+ stroke: i,
267
270
  "aria-hidden": !0,
268
- className: R.activeIcon
271
+ className: z.activeIcon
269
272
  }) : void 0,
270
273
  onClick: () => {
271
274
  e.onSelect(), n();
272
275
  }
273
276
  }, e.id))
274
277
  });
275
- }), V = d(({ profile: e, logOutLabel: r, onLogout: i, groups: a, textClassName: s = "dial-small-text" }) => {
276
- let { push: c, close: l } = L(), u = (a ?? []).filter(({ options: e }) => e.length > 0);
277
- return /* @__PURE__ */ y(_, { children: [
278
- /* @__PURE__ */ y("div", {
278
+ }), H = f(({ profile: e, logOutLabel: r, onLogout: a, groups: o, textClassName: c = "dial-small-text" }) => {
279
+ let { push: l, close: u } = R(), d = (o ?? []).filter(({ options: e }) => e.length > 0);
280
+ return /* @__PURE__ */ b(v, { children: [
281
+ /* @__PURE__ */ b("div", {
279
282
  className: "flex h-[56px] items-center gap-3 px-4 py-2",
280
- children: [/* @__PURE__ */ v(M, {
283
+ children: [/* @__PURE__ */ y(N, {
281
284
  profile: e,
282
285
  alt: ""
283
- }), /* @__PURE__ */ v(o, {
286
+ }), /* @__PURE__ */ y(s, {
284
287
  text: e.displayName,
285
- className: t(R.mutedText, s, "min-w-0 flex-1 truncate")
288
+ className: t(z.mutedText, c, "min-w-0 flex-1 truncate")
286
289
  })]
287
290
  }),
288
- u.length > 0 && /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ v("ul", {
291
+ d.length > 0 && /* @__PURE__ */ b(v, { children: [/* @__PURE__ */ y("ul", {
289
292
  className: "flex flex-col",
290
- children: u.map((e) => /* @__PURE__ */ v(z, {
293
+ children: d.map((e) => /* @__PURE__ */ y(B, {
291
294
  label: e.label,
292
295
  icon: e.icon,
293
- textClassName: s,
294
- trailing: /* @__PURE__ */ v(x, {
296
+ textClassName: c,
297
+ trailing: /* @__PURE__ */ y(S, {
295
298
  size: n,
296
- stroke: 1.5,
299
+ stroke: i,
297
300
  "aria-hidden": !0,
298
- className: t(R.rowIcon, "rtl:scale-x-[-1]")
301
+ className: t(z.rowIcon, "rtl:scale-x-[-1]")
299
302
  }),
300
- onClick: () => c({
303
+ onClick: () => l({
301
304
  title: e.label,
302
- content: /* @__PURE__ */ v(B, {
305
+ content: /* @__PURE__ */ y(V, {
303
306
  options: e.options,
304
- textClassName: s
307
+ textClassName: c
305
308
  })
306
309
  })
307
310
  }, e.id))
308
- }), /* @__PURE__ */ v("hr", { className: R.divider })] }),
309
- /* @__PURE__ */ v("ul", {
311
+ }), /* @__PURE__ */ y("hr", { className: z.divider })] }),
312
+ /* @__PURE__ */ y("ul", {
310
313
  className: "flex flex-col pb-4",
311
- children: /* @__PURE__ */ v(z, {
314
+ children: /* @__PURE__ */ y(B, {
312
315
  label: r,
313
- textClassName: s,
314
- icon: /* @__PURE__ */ v(S, {
316
+ textClassName: c,
317
+ icon: /* @__PURE__ */ y(C, {
315
318
  size: n,
316
- stroke: 1.5,
319
+ stroke: i,
317
320
  "aria-hidden": !0
318
321
  }),
319
322
  onClick: () => {
320
- l(), i();
323
+ u(), a();
321
324
  }
322
325
  })
323
326
  })
324
327
  ] });
325
- }), H = d(({ items: e, onSelectItem: t, profileLabel: r, logOutLabel: i, onLogout: a, profile: o, groups: s, footer: c, textClassName: l }) => {
326
- let { push: u, close: d } = L(), f = (e) => {
327
- d(), t(e);
328
+ }), U = f(({ items: e, onSelectItem: t, profileLabel: r, logOutLabel: a, onLogout: o, profile: s, groups: c, footer: l, textClassName: u }) => {
329
+ let { push: d, close: f } = R(), p = (e) => {
330
+ f(), t(e);
328
331
  };
329
- return /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ y("ul", {
332
+ return /* @__PURE__ */ b(v, { children: [/* @__PURE__ */ b("ul", {
330
333
  className: "flex flex-col pb-4",
331
- children: [e.map((e) => /* @__PURE__ */ v(z, {
334
+ children: [e.map((e) => /* @__PURE__ */ y(B, {
332
335
  label: e.label,
333
- textClassName: l,
334
- icon: /* @__PURE__ */ v(e.icon, {
336
+ textClassName: u,
337
+ icon: /* @__PURE__ */ y(e.icon, {
335
338
  size: n,
336
- stroke: 1.5
339
+ stroke: i
337
340
  }),
338
- onClick: () => f(e)
339
- }, e.id)), o && /* @__PURE__ */ v(z, {
341
+ onClick: () => p(e)
342
+ }, e.id)), s && /* @__PURE__ */ y(B, {
340
343
  label: r,
341
- textClassName: l,
342
- icon: /* @__PURE__ */ v(w, {
344
+ textClassName: u,
345
+ icon: /* @__PURE__ */ y(T, {
343
346
  size: n,
344
- stroke: 1.5,
347
+ stroke: i,
345
348
  "aria-hidden": !0
346
349
  }),
347
350
  onClick: () => {
348
- o && u({
351
+ s && d({
349
352
  title: r,
350
- content: /* @__PURE__ */ v(V, {
351
- profile: o,
352
- groups: s,
353
- logOutLabel: i,
354
- onLogout: a,
355
- textClassName: l
353
+ content: /* @__PURE__ */ y(H, {
354
+ profile: s,
355
+ groups: c,
356
+ logOutLabel: a,
357
+ onLogout: o,
358
+ textClassName: u
356
359
  })
357
360
  });
358
361
  }
359
362
  })]
360
- }), c] });
361
- }), U = d(({ isOpen: n, onClose: r, items: i, onSelectItem: a, labels: o, profile: s, groups: c, onLogout: l, footer: u, styles: d }) => {
362
- let { colors: f, typography: p, className: m, cssVars: g } = d ?? {}, _ = h(() => e({
363
+ }), l] });
364
+ }), W = f(({ isOpen: n, onClose: r, items: i, onSelectItem: a, labels: o, profile: s, groups: c, onLogout: l, footer: u, styles: d }) => {
365
+ let { colors: f, typography: p, className: m, cssVars: h } = d ?? {}, _ = g(() => e({
363
366
  "--np-sheet-text": f?.text,
364
367
  "--np-sheet-item-hover": f?.itemHoverBackground,
365
368
  "--np-sheet-item-active": f?.itemActiveBackground,
@@ -370,18 +373,18 @@ var E = {
370
373
  "--np-menu-active-icon": f?.activeIcon,
371
374
  "--np-font-family": p?.fontFamily
372
375
  }), [f, p?.fontFamily]);
373
- return /* @__PURE__ */ v(I, {
376
+ return /* @__PURE__ */ y(L, {
374
377
  isOpen: n,
375
378
  onClose: r,
376
379
  title: o.title,
377
380
  closeLabel: o.close,
378
381
  backLabel: o.back,
379
- className: t(R.sheet, m),
382
+ className: t(z.sheet, m),
380
383
  style: {
381
- ...g,
384
+ ...h,
382
385
  ..._
383
386
  },
384
- children: /* @__PURE__ */ v(H, {
387
+ children: /* @__PURE__ */ y(U, {
385
388
  items: i,
386
389
  onSelectItem: a,
387
390
  profileLabel: o.profile,
@@ -395,4 +398,4 @@ var E = {
395
398
  });
396
399
  });
397
400
  //#endregion
398
- export { A as AvatarInitials, j as MenuItemLabel, I as NavigableBottomSheet, H as NavigationMenuPage, O as NavigationPanel, U as NavigationSheet, B as OptionListPage, V as ProfilePage, z as SheetRow, M as UserAvatar, P as UserMenu, L as useSheetNavigation };
401
+ export { j as AvatarInitials, M as MenuItemLabel, L as NavigableBottomSheet, U as NavigationMenuPage, k as NavigationPanel, W as NavigationSheet, V as OptionListPage, H as ProfilePage, B as SheetRow, N as UserAvatar, F as UserMenu, R as useSheetNavigation };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@epam/ai-dial-navigation-panel",
3
3
  "description": "Primary application navigation — desktop nav rail, user menu, and mobile navigation bottom sheet",
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",
@@ -19,8 +19,8 @@
19
19
  "peerDependencies": {
20
20
  "react": "^19.0.0",
21
21
  "@tabler/icons-react": "^3.44.0",
22
- "@epam/ai-dial-chat-shared": "1.1.0-dev.298",
23
- "@epam/ai-dial-conversation-input": "1.1.0-dev.298",
22
+ "@epam/ai-dial-chat-shared": "1.1.0-dev.300",
23
+ "@epam/ai-dial-conversation-input": "1.1.0-dev.300",
24
24
  "@epam/ai-dial-ui-kit": "*"
25
25
  },
26
26
  "repository": {