@epam/ai-dial-navigation-panel 1.2.0-dev.20 → 1.2.0-dev.201

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.
@@ -1 +1 @@
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"}
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;AAMzE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,qCAAqC,CAAC;AAYhF;;;GAGG;AACH,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CAkFpD,CAAC"}
@@ -14,6 +14,10 @@ export interface NavigationMenuPageProps {
14
14
  logOutLabel: string;
15
15
  /** Called when the user taps "Log out" on the profile page. */
16
16
  onLogout: () => void;
17
+ /** Label of the settings row on the profile page; required when `onSettings` is provided. */
18
+ settingsLabel?: string;
19
+ /** Called when the user taps the profile page's settings row; omit to hide the row. */
20
+ onSettings?: () => void;
17
21
  /** Signed-in user details; omit to hide the profile row entirely. */
18
22
  profile?: NavigationUserProfile;
19
23
  /** Settings groups listed on the profile page; empty groups are skipped. */
@@ -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,CAyE1D,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,6FAA6F;IAC7F,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,uFAAuF;IACvF,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,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,CA6E1D,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"NavigationSheet.d.ts","sourceRoot":"","sources":["../../../src/components/NavigationSheet/NavigationSheet.tsx"],"names":[],"mappings":"AACA,OAAO,EAAiB,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,qCAAqC,CAAC;AAKhF;;;GAGG;AACH,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CA0DpD,CAAC"}
1
+ {"version":3,"file":"NavigationSheet.d.ts","sourceRoot":"","sources":["../../../src/components/NavigationSheet/NavigationSheet.tsx"],"names":[],"mappings":"AACA,OAAO,EAAiB,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,qCAAqC,CAAC;AAKhF;;;GAGG;AACH,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CA6DpD,CAAC"}
@@ -9,6 +9,10 @@ export interface ProfilePageProps {
9
9
  logOutLabel: string;
10
10
  /** Called when the user taps "Log out"; the sheet closes first. */
11
11
  onLogout: () => void;
12
+ /** Label of the settings row; required when `onSettings` is provided. */
13
+ settingsLabel?: string;
14
+ /** Called when the user taps the settings row; the sheet closes first. Omit to hide the row. */
15
+ onSettings?: () => void;
12
16
  /** Settings groups listed above the log-out row; empty groups are skipped. */
13
17
  groups?: NavigationMenuGroup[];
14
18
  /** CSS class controlling the row labels' type scale. Defaults to `'dial-small-text'`. */
@@ -16,7 +20,7 @@ export interface ProfilePageProps {
16
20
  }
17
21
  /**
18
22
  * Sheet page showing the signed-in user, their settings groups (each pushing an
19
- * `OptionListPage`), and a log-out row.
23
+ * `OptionListPage`), an optional settings row, and a log-out row.
20
24
  */
21
25
  export declare const ProfilePage: FC<ProfilePageProps>;
22
26
  //# sourceMappingURL=ProfilePage.d.ts.map
@@ -1 +1 @@
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"}
1
+ {"version":3,"file":"ProfilePage.d.ts","sourceRoot":"","sources":["../../../src/components/NavigationSheet/ProfilePage.tsx"],"names":[],"mappings":"AAWA,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,yEAAyE;IACzE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gGAAgG;IAChG,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,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,CA8G5C,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"SheetRow.d.ts","sourceRoot":"","sources":["../../../src/components/NavigationSheet/SheetRow.tsx"],"names":[],"mappings":"AACA,OAAO,EAAQ,KAAK,EAAE,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGtD,4BAA4B;AAC5B,MAAM,WAAW,aAAa;IAC5B,4BAA4B;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,yBAAyB;IACzB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,sDAAsD;IACtD,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,qFAAqF;IACrF,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,iFAAiF;AACjF,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CA2BtC,CAAC"}
1
+ {"version":3,"file":"SheetRow.d.ts","sourceRoot":"","sources":["../../../src/components/NavigationSheet/SheetRow.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAQ,KAAK,EAAE,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGtD,4BAA4B;AAC5B,MAAM,WAAW,aAAa;IAC5B,4BAA4B;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,yBAAyB;IACzB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,sDAAsD;IACtD,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,qFAAqF;IACrF,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,iFAAiF;AACjF,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CA+BtC,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"UserMenu.d.ts","sourceRoot":"","sources":["../../../src/components/UserMenu/UserMenu.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAiB,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAKlE;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CA0ItC,CAAC"}
1
+ {"version":3,"file":"UserMenu.d.ts","sourceRoot":"","sources":["../../../src/components/UserMenu/UserMenu.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAiB,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAKlE;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CA6ItC,CAAC"}
@@ -0,0 +1,7 @@
1
+ export declare const NAVIGATION_PANEL_CLASS: {
2
+ /** The `nav` rail itself. */
3
+ readonly rail: "dial-navigation-panel-rail";
4
+ /** Every item in the rail, whether or not it is the active one. */
5
+ readonly item: "dial-navigation-panel-item";
6
+ };
7
+ //# sourceMappingURL=public-class-names.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"public-class-names.d.ts","sourceRoot":"","sources":["../../src/constants/public-class-names.ts"],"names":[],"mappings":"AAWA,eAAO,MAAM,sBAAsB;IACjC,6BAA6B;;IAE7B,mEAAmE;;CAE3D,CAAC"}
package/index.css CHANGED
@@ -1,2 +1,2 @@
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_htyg8_1{background:var(--np-avatar-bg,var(--bg-control-accent,#1d4ed8));color:var(--np-avatar-text,var(--text-control-permanent,#fcfcfc))}._wrapper_1coa8_1{font-family:var(--np-font-family,inherit)}._trigger_1coa8_5:hover{background:var(--np-trigger-hover-bg,var(--bg-control-accent-alpha-hover,#2764d924))}._trigger_1coa8_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_1coa8_14,._menuLabel_1coa8_18{color:var(--np-menu-text,var(--text-primary,#161b2d))}._sheet_1oucc_1{font-family:var(--np-font-family,inherit)}._row_1oucc_5{color:var(--np-sheet-text,var(--text-primary,#161b2d))}._row_1oucc_5:hover,._row_1oucc_5:focus-visible{background:var(--np-sheet-item-hover,var(--bg-control-accent-alpha-hover,#2764d924))}._row_1oucc_5:active{background:var(--np-sheet-item-active,var(--bg-control-neutral-active,#d1dbea))}._rowActive_1oucc_17{color:var(--np-sheet-row-active-text,var(--text-accent,#1d4ed8));background:var(--np-sheet-row-active-bg,var(--bg-control-accent-alpha,#2764d90f))}._rowActive_1oucc_17:hover,._rowActive_1oucc_17:focus-visible{background:var(--np-sheet-row-active-bg-hover,var(--bg-control-accent-alpha-hover,#2764d924))}._rowActive_1oucc_17 ._rowIcon_1oucc_24{color:inherit}._rowIcon_1oucc_24{color:var(--np-sheet-icon,var(--text-secondary,#57647a))}._divider_1oucc_32{border-color:var(--np-sheet-divider,var(--stroke-secondary,#d1dbea))}._mutedText_1oucc_36{color:var(--np-sheet-muted-text,var(--text-secondary,#57647a))}._activeIcon_1oucc_40{color:var(--np-menu-active-icon,var(--text-accent,#1d4ed8))}
2
- /*$vite$:1*/
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_htyg8_1{background:var(--np-avatar-bg,var(--bg-control-accent,#1d4ed8));color:var(--np-avatar-text,var(--text-control-permanent,#fcfcfc))}._wrapper_1uzro_1{font-family:var(--np-font-family,inherit)}._trigger_1uzro_5:hover{background:var(--np-trigger-hover-bg,var(--bg-control-accent-alpha-hover,#2764d924))}._trigger_1uzro_5._trigger_1uzro_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_1uzro_18,._menuLabel_1uzro_22{color:var(--np-menu-text,var(--text-primary,#161b2d))}._sheet_wbw5h_1{font-family:var(--np-font-family,inherit)}li>._row_wbw5h_12{color:var(--np-sheet-text,var(--text-primary,#161b2d))}li>._row_wbw5h_12:hover,li>._row_wbw5h_12:focus-visible{background:var(--np-sheet-item-hover,var(--bg-control-accent-alpha-hover,#2764d924))}li>._row_wbw5h_12:active{background:var(--np-sheet-item-active,var(--bg-control-neutral-active,#d1dbea))}li>._rowActive_wbw5h_24{color:var(--np-sheet-row-active-text,var(--text-accent,#1d4ed8));background:var(--np-sheet-row-active-bg,var(--bg-control-accent-alpha,#2764d90f))}li>._rowActive_wbw5h_24:hover,li>._rowActive_wbw5h_24:focus-visible{background:var(--np-sheet-row-active-bg-hover,var(--bg-control-accent-alpha-hover,#2764d924))}li>._rowActive_wbw5h_24 ._rowIcon_wbw5h_31{color:inherit}._rowIcon_wbw5h_31{color:var(--np-sheet-icon,var(--text-secondary,#57647a))}._divider_wbw5h_39{border-color:var(--np-sheet-divider,var(--stroke-secondary,#d1dbea))}._mutedText_wbw5h_43{color:var(--np-sheet-muted-text,var(--text-secondary,#57647a))}._activeIcon_wbw5h_47{color:var(--np-menu-active-icon,var(--text-accent,#1d4ed8))}
2
+ /*$vite$:1*/.relative{position:relative}.z-10{z-index:10}.flex{display:flex}.contents{display:contents}.size-\[28px\]{height:28px;width:28px}.size-\[44px\]{height:44px;width:44px}.size-\[60px\]{height:60px;width:60px}.h-16{height:4rem}.h-6{height:1.5rem}.h-\[40px\]{height:40px}.h-\[56px\]{height:56px}.h-auto{height:auto}.h-full{height:100%}.w-6{width:1.5rem}.w-\[60px\]{width:60px}.w-full{width:100%}.min-w-0{min-width:0}.flex-1{flex:1 1 0%}.flex-shrink-0,.shrink-0{flex-shrink:0}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-0{gap:0}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.\!rounded-full{border-radius:9999px!important}.rounded-full{border-radius:9999px}.rounded-none{border-radius:0}.rounded-xl{border-radius:.75rem}.bg-contain{background-size:contain}.bg-center{background-position:50%}.bg-no-repeat{background-repeat:no-repeat}.p-0{padding:0}.p-2{padding:.5rem}.px-4{padding-left:1rem;padding-right:1rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.py-\[10px\]{padding-bottom:10px;padding-top:10px}.pb-4{padding-bottom:1rem}.shadow-sm{--tw-shadow:0 8px 10px 0 var(--shadow-sm,#2764d914);--tw-shadow-colored:0 8px 10px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.rtl\:scale-x-\[-1\]:where([dir=rtl],[dir=rtl] *){--tw-scale-x:-1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}
package/index.d.ts CHANGED
@@ -23,4 +23,5 @@ export type { NavigationMenuPageProps } from './components/NavigationSheet/Navig
23
23
  export type { OptionListPageProps } from './components/NavigationSheet/OptionListPage';
24
24
  export type { ProfilePageProps } from './components/NavigationSheet/ProfilePage';
25
25
  export type { SheetRowProps } from './components/NavigationSheet/SheetRow';
26
+ export { NAVIGATION_PANEL_CLASS } from './constants/public-class-names';
26
27
  //# sourceMappingURL=index.d.ts.map
package/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,8CAA8C,CAAC;AAC/E,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAC1D,OAAO,EAAE,eAAe,EAAE,MAAM,8CAA8C,CAAC;AAC/E,OAAO,EAAE,oBAAoB,EAAE,MAAM,mDAAmD,CAAC;AACzF,OAAO,EAAE,kBAAkB,EAAE,MAAM,iDAAiD,CAAC;AACrF,OAAO,EAAE,WAAW,EAAE,MAAM,0CAA0C,CAAC;AACvE,OAAO,EAAE,cAAc,EAAE,MAAM,6CAA6C,CAAC;AAC7E,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AACjE,OAAO,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;AACpE,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAE5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE,YAAY,EACV,kBAAkB,EAClB,sBAAsB,EACtB,mBAAmB,GACpB,MAAM,0BAA0B,CAAC;AAClC,YAAY,EACV,mBAAmB,EACnB,oBAAoB,GACrB,MAAM,0BAA0B,CAAC;AAClC,YAAY,EACV,qBAAqB,EACrB,qBAAqB,EACrB,mBAAmB,EACnB,oBAAoB,EACpB,qBAAqB,EACrB,yBAAyB,GAC1B,MAAM,iCAAiC,CAAC;AACzC,YAAY,EACV,qBAAqB,EACrB,qBAAqB,EACrB,oBAAoB,EACpB,qBAAqB,EACrB,yBAAyB,GAC1B,MAAM,iCAAiC,CAAC;AACzC,YAAY,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAC5E,YAAY,EACV,cAAc,EACd,cAAc,EACd,aAAa,EACb,cAAc,EACd,kBAAkB,GACnB,MAAM,0BAA0B,CAAC;AAClC,YAAY,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AACnE,YAAY,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AAC9E,YAAY,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAC;AACtE,YAAY,EAAE,yBAAyB,EAAE,MAAM,mDAAmD,CAAC;AACnG,YAAY,EAAE,uBAAuB,EAAE,MAAM,iDAAiD,CAAC;AAC/F,YAAY,EAAE,mBAAmB,EAAE,MAAM,6CAA6C,CAAC;AACvF,YAAY,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AACjF,YAAY,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,8CAA8C,CAAC;AAC/E,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAC1D,OAAO,EAAE,eAAe,EAAE,MAAM,8CAA8C,CAAC;AAC/E,OAAO,EAAE,oBAAoB,EAAE,MAAM,mDAAmD,CAAC;AACzF,OAAO,EAAE,kBAAkB,EAAE,MAAM,iDAAiD,CAAC;AACrF,OAAO,EAAE,WAAW,EAAE,MAAM,0CAA0C,CAAC;AACvE,OAAO,EAAE,cAAc,EAAE,MAAM,6CAA6C,CAAC;AAC7E,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AACjE,OAAO,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;AACpE,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAE5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE,YAAY,EACV,kBAAkB,EAClB,sBAAsB,EACtB,mBAAmB,GACpB,MAAM,0BAA0B,CAAC;AAClC,YAAY,EACV,mBAAmB,EACnB,oBAAoB,GACrB,MAAM,0BAA0B,CAAC;AAClC,YAAY,EACV,qBAAqB,EACrB,qBAAqB,EACrB,mBAAmB,EACnB,oBAAoB,EACpB,qBAAqB,EACrB,yBAAyB,GAC1B,MAAM,iCAAiC,CAAC;AACzC,YAAY,EACV,qBAAqB,EACrB,qBAAqB,EACrB,oBAAoB,EACpB,qBAAqB,EACrB,yBAAyB,GAC1B,MAAM,iCAAiC,CAAC;AACzC,YAAY,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAC5E,YAAY,EACV,cAAc,EACd,cAAc,EACd,aAAa,EACb,cAAc,EACd,kBAAkB,GACnB,MAAM,0BAA0B,CAAC;AAClC,YAAY,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AACnE,YAAY,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AAC9E,YAAY,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAC;AACtE,YAAY,EAAE,yBAAyB,EAAE,MAAM,mDAAmD,CAAC;AACnG,YAAY,EAAE,uBAAuB,EAAE,MAAM,iDAAiD,CAAC;AAC/F,YAAY,EAAE,mBAAmB,EAAE,MAAM,6CAA6C,CAAC;AACvF,YAAY,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AACjF,YAAY,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AAC3E,OAAO,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC"}
package/index.js CHANGED
@@ -1,98 +1,102 @@
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, DIAL_KIT_ICON_STROKE as i, Dropdown as a, DropdownItemType as o, EllipsisTooltip as s, IconButton as c, MenuItemMark as l, Tooltip as u } from "@epam/ai-dial-ui-kit";
3
- import { Fragment as d, createContext as f, memo as p, useCallback as m, useContext as h, useEffect as g, useMemo as _, useState as v } from "react";
4
- import { Fragment as y, jsx as b, jsxs as x } from "react/jsx-runtime";
5
- import { IconCheck as S, IconChevronRight as C, IconLogout as w, IconSettings as T, IconUser as E } from "@tabler/icons-react";
6
- import { BottomSheetShell as D } from "@epam/ai-dial-conversation-input";
7
- var O = {
2
+ import { BASE_ICON_SIZE as n, Button as r, DIAL_ICON_SIZE as i, DIAL_KIT_ICON_STROKE as a, Dropdown as o, DropdownItemType as s, EllipsisTooltip as c, IconButton as l, MenuItem as u, MenuItemMark as d } from "@epam/ai-dial-ui-kit";
3
+ import { Fragment as f, createContext as p, memo as m, useCallback as h, useContext as g, useEffect as _, useMemo as v, useState as y } from "react";
4
+ import { Fragment as b, jsx as x, jsxs as S } from "react/jsx-runtime";
5
+ import { IconCheck as C, IconChevronRight as w, IconLogout as T, IconSettings as E, IconUser as D } from "@tabler/icons-react";
6
+ import { BottomSheetShell as O } from "@epam/ai-dial-conversation-input";
7
+ //#region src/constants/public-class-names.ts
8
+ var k = {
9
+ rail: "dial-navigation-panel-rail",
10
+ item: "dial-navigation-panel-item"
11
+ }, A = {
8
12
  rail: "_rail_h528m_1",
9
13
  item: "_item_h528m_6",
10
14
  itemActive: "_itemActive_h528m_19"
11
- }, k = (e, t) => /* @__PURE__ */ b("a", {
15
+ }, j = (e, t) => /* @__PURE__ */ x("a", {
12
16
  href: e.href,
13
17
  className: "contents",
14
18
  children: t
15
- }), A = p(({ items: n, labels: a, logo: o, footer: s, renderLink: l = k, styles: u }) => {
16
- let { colors: f, typography: p, className: m, cssVars: h } = u ?? {}, 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,
19
+ }), M = m(({ items: n, labels: r, logo: o, footer: s, renderLink: c = j, styles: u }) => {
20
+ let { colors: d, typography: p, className: m, cssVars: h } = u ?? {}, g = v(() => e({
21
+ "--np-bg": d?.background,
22
+ "--np-item-text": d?.itemText,
23
+ "--np-item-active-text": d?.itemActiveText,
24
+ "--np-item-selected-bg": d?.itemSelectedBackground,
25
+ "--np-item-hover-bg": d?.itemHoverBackground,
26
+ "--np-item-active-bg": d?.itemActiveBackground,
23
27
  "--np-font-family": p?.fontFamily
24
- }), [f, p?.fontFamily]);
25
- return /* @__PURE__ */ x("nav", {
26
- "aria-label": a.ariaLabel,
28
+ }), [d, p?.fontFamily]);
29
+ return /* @__PURE__ */ S("nav", {
30
+ "aria-label": r.ariaLabel,
27
31
  style: {
28
32
  ...h,
29
33
  ...g
30
34
  },
31
- className: t(O.rail, "relative z-10 flex h-full w-[60px] flex-col justify-between shadow-sm", p?.fontClassName, m),
32
- children: [/* @__PURE__ */ x("div", {
35
+ className: t(A.rail, "relative z-10 flex h-full w-[60px] flex-col justify-between shadow-sm", p?.fontClassName, m, k.rail),
36
+ children: [/* @__PURE__ */ S("div", {
33
37
  className: "flex flex-col items-center",
34
- children: [o && /* @__PURE__ */ b("a", {
38
+ children: [o && /* @__PURE__ */ x("a", {
35
39
  href: o.href ?? "/",
36
40
  "aria-label": o.ariaLabel,
37
41
  className: "flex h-16 w-full shrink-0 items-center justify-center",
38
- children: /* @__PURE__ */ b("span", {
42
+ children: /* @__PURE__ */ x("span", {
39
43
  style: { backgroundImage: `url(${o.iconUrl})` },
40
44
  className: "h-6 w-6 bg-contain bg-center bg-no-repeat"
41
45
  })
42
- }), /* @__PURE__ */ b("div", {
46
+ }), /* @__PURE__ */ x("div", {
43
47
  className: "flex flex-col items-center gap-2 p-2",
44
- children: n.map((e) => /* @__PURE__ */ b(d, { children: l(e, /* @__PURE__ */ b(c, {
45
- icon: /* @__PURE__ */ b(e.icon, {
46
- size: r.LG,
47
- stroke: i
48
+ children: n.map((e) => /* @__PURE__ */ x(f, { children: c(e, /* @__PURE__ */ x(l, {
49
+ icon: /* @__PURE__ */ x(e.icon, {
50
+ size: i.LG,
51
+ stroke: a
48
52
  }),
49
53
  "aria-label": e.label,
50
54
  "aria-current": e.isActive ? "page" : void 0,
51
55
  tooltipProps: { tooltip: e.label },
52
56
  tabIndex: -1,
53
- className: t(O.item, "rounded-xl", e.isActive && O.itemActive)
57
+ className: t(A.item, "rounded-xl", e.isActive && A.itemActive, k.item)
54
58
  })) }, e.id))
55
59
  })]
56
60
  }), s]
57
61
  });
58
- }), j = { avatar: "_avatar_htyg8_1" }, M = p(({ shortName: e, className: n, textClassName: r = "dial-tiny-text" }) => /* @__PURE__ */ b("div", {
59
- className: t(j.avatar, "flex size-[28px] flex-shrink-0 items-center justify-center rounded-full", r, n),
62
+ }), N = { avatar: "_avatar_htyg8_1" }, P = m(({ shortName: e, className: n, textClassName: r = "dial-tiny-text" }) => /* @__PURE__ */ x("div", {
63
+ className: t(N.avatar, "flex size-[28px] flex-shrink-0 items-center justify-center rounded-full", r, n),
60
64
  children: e
61
- })), N = p(({ profile: e, alt: t }) => e.isFallbackShown || !e.imageUrl ? /* @__PURE__ */ b(M, { shortName: e.shortName }) : /* @__PURE__ */ b("img", {
65
+ })), F = m(({ profile: e, alt: t }) => e.isFallbackShown || !e.imageUrl ? /* @__PURE__ */ x(P, { shortName: e.shortName }) : /* @__PURE__ */ x("img", {
62
66
  className: "rounded-full",
63
67
  src: e.imageUrl,
64
68
  width: 28,
65
69
  height: 28,
66
70
  alt: t,
67
71
  onError: e.onImageError
68
- })), P = {
69
- wrapper: "_wrapper_1coa8_1",
70
- trigger: "_trigger_1coa8_5",
71
- identityText: "_identityText_1coa8_14",
72
- menuLabel: "_menuLabel_1coa8_18"
73
- }, F = p(({ profile: n, labels: c, groups: d, onLogout: f, onSettings: p, isTooltipHidden: m, styles: h }) => {
74
- let { colors: g, typography: v, className: y, cssVars: S } = h ?? {}, C = v?.fontClassName ?? "dial-small-text", E = _(() => e({
72
+ })), I = {
73
+ wrapper: "_wrapper_1uzro_1",
74
+ trigger: "_trigger_1uzro_5",
75
+ identityText: "_identityText_1uzro_18",
76
+ menuLabel: "_menuLabel_1uzro_22"
77
+ }, L = m(({ profile: n, labels: l, groups: u, onLogout: f, onSettings: p, isTooltipHidden: m, styles: h }) => {
78
+ let { colors: g, typography: _, className: y, cssVars: b } = h ?? {}, C = _?.fontClassName ?? "dial-small-text", w = v(() => e({
75
79
  "--np-avatar-bg": g?.avatarBackground,
76
80
  "--np-avatar-text": g?.avatarText,
77
81
  "--np-menu-text": g?.text,
78
82
  "--np-trigger-hover-bg": g?.triggerHoverBackground,
79
- "--np-font-family": v?.fontFamily
80
- }), [g, v?.fontFamily]), D = _(() => t(P.menuLabel, C), [C]), O = _(() => {
81
- let e = (d ?? []).filter(({ options: e }) => e.length > 0).map(({ id: e, label: t, icon: n, options: r }) => ({
83
+ "--np-font-family": _?.fontFamily
84
+ }), [g, _?.fontFamily]), D = v(() => t(I.menuLabel, C), [C]), O = v(() => {
85
+ let e = (u ?? []).filter(({ options: e }) => e.length > 0).map(({ id: e, label: t, icon: n, options: r }) => ({
82
86
  key: e,
83
- label: /* @__PURE__ */ b("span", {
87
+ label: /* @__PURE__ */ x("span", {
84
88
  className: D,
85
89
  children: t
86
90
  }),
87
91
  icon: n,
88
92
  children: r.map((e) => ({
89
93
  key: e.id,
90
- label: /* @__PURE__ */ b("span", {
94
+ label: /* @__PURE__ */ x("span", {
91
95
  className: D,
92
96
  children: e.label
93
97
  }),
94
98
  icon: e.icon,
95
- mark: l.Check,
99
+ mark: d.Check,
96
100
  checked: e.isActive,
97
101
  onClick: e.onSelect
98
102
  }))
@@ -100,95 +104,94 @@ var O = {
100
104
  return [
101
105
  {
102
106
  key: "identity",
103
- type: o.PlainText,
104
- label: /* @__PURE__ */ x("div", {
107
+ type: s.PlainText,
108
+ label: /* @__PURE__ */ S("div", {
105
109
  className: "flex h-[40px] min-w-0 items-center gap-3",
106
- children: [/* @__PURE__ */ b(M, { shortName: n.shortName }), /* @__PURE__ */ b(s, {
110
+ children: [/* @__PURE__ */ x(P, { shortName: n.shortName }), /* @__PURE__ */ x(c, {
107
111
  text: n.displayName,
108
- className: t(P.identityText, C, "min-w-0 flex-1 truncate")
112
+ className: t(I.identityText, C, "min-w-0 flex-1 truncate")
109
113
  })]
110
114
  })
111
115
  },
112
116
  ...e,
113
117
  {
114
118
  key: "divider-1",
115
- type: o.Divider
119
+ type: s.Divider
116
120
  },
117
121
  ...p ? [{
118
122
  key: "settings",
119
- label: /* @__PURE__ */ b("span", {
123
+ label: /* @__PURE__ */ x("span", {
120
124
  className: D,
121
- children: c.settings
125
+ children: l.settings
122
126
  }),
123
- icon: /* @__PURE__ */ b(T, {
124
- size: r.SM,
127
+ icon: /* @__PURE__ */ x(E, {
128
+ size: i.SM,
125
129
  "aria-hidden": !0,
126
- stroke: i
130
+ stroke: a
127
131
  }),
128
132
  onClick: p
129
133
  }] : [],
130
134
  {
131
135
  key: "logout",
132
- label: /* @__PURE__ */ b("span", {
136
+ label: /* @__PURE__ */ x("span", {
133
137
  className: D,
134
- children: c.logOut
138
+ children: l.logOut
135
139
  }),
136
- icon: /* @__PURE__ */ b(w, {
137
- size: r.SM,
140
+ icon: /* @__PURE__ */ x(T, {
141
+ size: i.SM,
138
142
  "aria-hidden": !0,
139
- stroke: i
143
+ stroke: a
140
144
  }),
141
145
  onClick: f
142
146
  }
143
147
  ];
144
148
  }, [
145
- d,
149
+ u,
146
150
  C,
147
151
  D,
148
- c.logOut,
149
- c.settings,
152
+ l.logOut,
153
+ l.settings,
150
154
  f,
151
155
  p,
152
156
  n.displayName,
153
157
  n.shortName
154
158
  ]);
155
- return /* @__PURE__ */ b("div", {
159
+ return /* @__PURE__ */ x("div", {
156
160
  style: {
157
- ...S,
158
- ...E
161
+ ...b,
162
+ ...w
159
163
  },
160
- className: t(P.wrapper, "flex size-[60px] items-center justify-center", y),
161
- children: /* @__PURE__ */ b(a, {
164
+ className: t(I.wrapper, "flex size-[60px] items-center justify-center", y),
165
+ children: /* @__PURE__ */ x(o, {
162
166
  placement: "top-end",
163
167
  matchReferenceWidth: !1,
164
168
  items: O,
165
- children: /* @__PURE__ */ b("button", {
166
- type: "button",
167
- className: t(P.trigger, "flex size-[44px] items-center justify-center rounded-full border border-transparent"),
168
- "aria-label": c.trigger,
169
- children: /* @__PURE__ */ b(u, {
169
+ children: /* @__PURE__ */ x(r, {
170
+ "aria-label": l.trigger,
171
+ tooltipProps: {
170
172
  tooltip: n.email,
171
- hideTooltip: m,
172
- children: /* @__PURE__ */ b(N, {
173
- profile: n,
174
- alt: c.avatarAlt
175
- })
176
- })
173
+ hideTooltip: m
174
+ },
175
+ iconBefore: /* @__PURE__ */ x(F, {
176
+ profile: n,
177
+ alt: l.avatarAlt
178
+ }),
179
+ className: t("size-[44px] gap-0 !rounded-full p-0", I.trigger)
177
180
  })
178
181
  })
179
182
  });
180
- }), I = f(void 0), L = p(({ isOpen: e, onClose: t, children: n, title: r, closeLabel: i, backLabel: a, className: o, style: s }) => {
181
- let [c, l] = v([]);
182
- g(() => {
183
+ }), R = p(void 0), z = m(({ isOpen: e, onClose: t, children: n, title: r, closeLabel: i, backLabel: a, className: o, style: s }) => {
184
+ let [c, l] = y([]);
185
+ _(() => {
183
186
  e || l([]);
184
187
  }, [e]);
185
- let u = m((e) => {
188
+ let u = h((e) => {
186
189
  l((t) => [...t, e]);
187
- }, []), d = m(() => {
190
+ }, []), d = h(() => {
188
191
  l((e) => e.slice(0, -1));
189
- }, []), f = m(() => {
192
+ }, []), f = h(() => {
190
193
  l([]), t();
191
- }, [t]), p = _(() => ({
194
+ }, [t]), p = v(() => ({
192
195
  push: u,
193
196
  pop: d,
194
197
  close: f
@@ -196,195 +199,207 @@ var O = {
196
199
  u,
197
200
  d,
198
201
  f
199
- ]), h = c[c.length - 1];
200
- return /* @__PURE__ */ b(I.Provider, {
202
+ ]), m = c[c.length - 1];
203
+ return /* @__PURE__ */ x(R.Provider, {
201
204
  value: p,
202
- children: /* @__PURE__ */ b(D, {
205
+ children: /* @__PURE__ */ x(O, {
203
206
  isOpen: e,
204
207
  onClose: f,
205
- title: h?.title ?? r,
208
+ title: m?.title ?? r,
206
209
  closeLabel: i,
207
- onBack: h ? d : void 0,
208
- backLabel: h ? a : void 0,
210
+ onBack: m ? d : void 0,
211
+ backLabel: m ? a : void 0,
209
212
  className: o,
210
213
  style: s,
211
- children: h ? h.content : n
214
+ children: m ? m.content : n
212
215
  })
213
216
  });
214
- }), R = () => {
215
- let e = h(I);
217
+ }), B = () => {
218
+ let e = g(R);
216
219
  if (!e) throw Error("useSheetNavigation must be used within a NavigableBottomSheet");
217
220
  return e;
218
- }, z = {
219
- sheet: "_sheet_1oucc_1",
220
- row: "_row_1oucc_5",
221
- rowActive: "_rowActive_1oucc_17",
222
- rowIcon: "_rowIcon_1oucc_24",
223
- divider: "_divider_1oucc_32",
224
- mutedText: "_mutedText_1oucc_36",
225
- activeIcon: "_activeIcon_1oucc_40"
226
- }, B = p(({ label: e, onClick: n, icon: r, trailing: i, isCurrent: a = !1, isHighlighted: o = !1, textClassName: s = "dial-small-text" }) => /* @__PURE__ */ b("li", { children: /* @__PURE__ */ x("button", {
227
- type: "button",
221
+ }, V = {
222
+ sheet: "_sheet_wbw5h_1",
223
+ row: "_row_wbw5h_12",
224
+ rowActive: "_rowActive_wbw5h_24",
225
+ rowIcon: "_rowIcon_wbw5h_31",
226
+ divider: "_divider_wbw5h_39",
227
+ mutedText: "_mutedText_wbw5h_43",
228
+ activeIcon: "_activeIcon_wbw5h_47"
229
+ }, H = m(({ label: e, onClick: n, icon: r, trailing: i, isCurrent: a = !1, isHighlighted: o = !1, textClassName: s = "dial-small-text" }) => /* @__PURE__ */ x("li", { children: /* @__PURE__ */ x(u, {
230
+ label: e,
231
+ labelClassName: s,
232
+ icon: r && /* @__PURE__ */ x("span", {
233
+ className: V.rowIcon,
234
+ children: r
235
+ }),
236
+ trailing: i,
237
+ mark: d.Highlight,
238
+ selected: o,
228
239
  "aria-current": a ? "true" : void 0,
229
- className: t(z.row, o && z.rowActive, "flex w-full items-center gap-3 px-4 py-[10px] text-start"),
230
- onClick: n,
231
- children: [
232
- r && /* @__PURE__ */ b("span", {
233
- className: z.rowIcon,
234
- children: r
235
- }),
236
- /* @__PURE__ */ b("span", {
237
- className: t(s, "flex-1"),
238
- children: e
239
- }),
240
- i
241
- ]
242
- }) })), V = p(({ options: e, textClassName: t }) => {
243
- let { pop: n } = R();
244
- return /* @__PURE__ */ b("ul", {
240
+ className: t("h-auto gap-3 rounded-none px-4 py-[10px]", V.row, o && V.rowActive),
241
+ onClick: n
242
+ }) })), U = m(({ options: e, textClassName: t }) => {
243
+ let { pop: n } = B();
244
+ return /* @__PURE__ */ x("ul", {
245
245
  className: "flex flex-col pb-4",
246
- children: e.map((e) => /* @__PURE__ */ b(B, {
246
+ children: e.map((e) => /* @__PURE__ */ x(H, {
247
247
  label: e.label,
248
248
  icon: e.icon,
249
249
  textClassName: t,
250
250
  isCurrent: e.isActive,
251
- trailing: e.isActive ? /* @__PURE__ */ b(S, {
252
- size: r.SM,
253
- stroke: i,
251
+ trailing: e.isActive ? /* @__PURE__ */ x(C, {
252
+ size: i.SM,
253
+ stroke: a,
254
254
  "aria-hidden": !0,
255
- className: z.activeIcon
255
+ className: V.activeIcon
256
256
  }) : void 0,
257
257
  onClick: () => {
258
258
  e.onSelect(), n();
259
259
  }
260
260
  }, e.id))
261
261
  });
262
- }), H = p(({ profile: e, logOutLabel: r, onLogout: a, groups: o, textClassName: c = "dial-small-text" }) => {
263
- let { push: l, close: u } = R(), d = (o ?? []).filter(({ options: e }) => e.length > 0);
264
- return /* @__PURE__ */ x(y, { children: [
265
- /* @__PURE__ */ x("div", {
262
+ }), W = m(({ profile: e, logOutLabel: r, onLogout: i, settingsLabel: o, onSettings: s, groups: l, textClassName: u = "dial-small-text" }) => {
263
+ let { push: d, close: f } = B(), p = (l ?? []).filter(({ options: e }) => e.length > 0);
264
+ return /* @__PURE__ */ S(b, { children: [
265
+ /* @__PURE__ */ S("div", {
266
266
  className: "flex h-[56px] items-center gap-3 px-4 py-2",
267
- children: [/* @__PURE__ */ b(N, {
267
+ children: [/* @__PURE__ */ x(F, {
268
268
  profile: e,
269
269
  alt: ""
270
- }), /* @__PURE__ */ b(s, {
270
+ }), /* @__PURE__ */ x(c, {
271
271
  text: e.displayName,
272
- className: t(z.mutedText, c, "min-w-0 flex-1 truncate")
272
+ className: t(V.mutedText, u, "min-w-0 flex-1 truncate")
273
273
  })]
274
274
  }),
275
- d.length > 0 && /* @__PURE__ */ x(y, { children: [/* @__PURE__ */ b("ul", {
275
+ p.length > 0 && /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x("ul", {
276
276
  className: "flex flex-col",
277
- children: d.map((e) => /* @__PURE__ */ b(B, {
277
+ children: p.map((e) => /* @__PURE__ */ x(H, {
278
278
  label: e.label,
279
279
  icon: e.icon,
280
- textClassName: c,
281
- trailing: /* @__PURE__ */ b(C, {
280
+ textClassName: u,
281
+ trailing: /* @__PURE__ */ x(w, {
282
282
  size: n,
283
- stroke: i,
283
+ stroke: a,
284
284
  "aria-hidden": !0,
285
- className: t(z.rowIcon, "rtl:scale-x-[-1]")
285
+ className: t(V.rowIcon, "rtl:scale-x-[-1]")
286
286
  }),
287
- onClick: () => l({
287
+ onClick: () => d({
288
288
  title: e.label,
289
- content: /* @__PURE__ */ b(V, {
289
+ content: /* @__PURE__ */ x(U, {
290
290
  options: e.options,
291
- textClassName: c
291
+ textClassName: u
292
292
  })
293
293
  })
294
294
  }, e.id))
295
- }), /* @__PURE__ */ b("hr", { className: z.divider })] }),
296
- /* @__PURE__ */ b("ul", {
295
+ }), /* @__PURE__ */ x("hr", { className: V.divider })] }),
296
+ /* @__PURE__ */ S("ul", {
297
297
  className: "flex flex-col pb-4",
298
- children: /* @__PURE__ */ b(B, {
298
+ children: [s && o && /* @__PURE__ */ x(H, {
299
+ label: o,
300
+ textClassName: u,
301
+ icon: /* @__PURE__ */ x(E, {
302
+ size: n,
303
+ stroke: a,
304
+ "aria-hidden": !0
305
+ }),
306
+ onClick: () => {
307
+ f(), s?.();
308
+ }
309
+ }), /* @__PURE__ */ x(H, {
299
310
  label: r,
300
- textClassName: c,
301
- icon: /* @__PURE__ */ b(w, {
311
+ textClassName: u,
312
+ icon: /* @__PURE__ */ x(T, {
302
313
  size: n,
303
- stroke: i,
314
+ stroke: a,
304
315
  "aria-hidden": !0
305
316
  }),
306
317
  onClick: () => {
307
- u(), a();
318
+ f(), i();
308
319
  }
309
- })
320
+ })]
310
321
  })
311
322
  ] });
312
- }), U = p(({ items: e, onSelectItem: t, profileLabel: r, logOutLabel: a, onLogout: o, profile: s, groups: c, footer: l, textClassName: u }) => {
313
- let { push: d, close: f } = R(), p = (e) => {
314
- f(), t(e);
323
+ }), G = m(({ items: e, onSelectItem: t, profileLabel: r, logOutLabel: i, onLogout: o, settingsLabel: s, onSettings: c, profile: l, groups: u, footer: d, textClassName: f }) => {
324
+ let { push: p, close: m } = B(), h = (e) => {
325
+ m(), t(e);
315
326
  };
316
- return /* @__PURE__ */ x(y, { children: [/* @__PURE__ */ x("ul", {
327
+ return /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ S("ul", {
317
328
  className: "flex flex-col pb-4",
318
- children: [e.map((e) => /* @__PURE__ */ b(B, {
329
+ children: [e.map((e) => /* @__PURE__ */ x(H, {
319
330
  label: e.label,
320
- textClassName: u,
331
+ textClassName: f,
321
332
  isCurrent: e.isActive,
322
333
  isHighlighted: e.isActive,
323
- icon: /* @__PURE__ */ b(e.icon, {
334
+ icon: /* @__PURE__ */ x(e.icon, {
324
335
  size: n,
325
- stroke: i
336
+ stroke: a
326
337
  }),
327
- onClick: () => p(e)
328
- }, e.id)), s && /* @__PURE__ */ b(B, {
338
+ onClick: () => h(e)
339
+ }, e.id)), l && /* @__PURE__ */ x(H, {
329
340
  label: r,
330
- textClassName: u,
331
- icon: /* @__PURE__ */ b(E, {
341
+ textClassName: f,
342
+ icon: /* @__PURE__ */ x(D, {
332
343
  size: n,
333
- stroke: i,
344
+ stroke: a,
334
345
  "aria-hidden": !0
335
346
  }),
336
347
  onClick: () => {
337
- s && d({
348
+ l && p({
338
349
  title: r,
339
- content: /* @__PURE__ */ b(H, {
340
- profile: s,
341
- groups: c,
342
- logOutLabel: a,
350
+ content: /* @__PURE__ */ x(W, {
351
+ profile: l,
352
+ groups: u,
353
+ logOutLabel: i,
343
354
  onLogout: o,
344
- textClassName: u
355
+ settingsLabel: s,
356
+ onSettings: c,
357
+ textClassName: f
345
358
  })
346
359
  });
347
360
  }
348
361
  })]
349
- }), l] });
350
- }), W = p(({ isOpen: n, onClose: r, items: i, onSelectItem: a, labels: o, profile: s, groups: c, onLogout: l, footer: u, styles: d }) => {
351
- let { colors: f, typography: p, className: m, cssVars: h } = d ?? {}, g = _(() => e({
352
- "--np-sheet-text": f?.text,
353
- "--np-sheet-item-hover": f?.itemHoverBackground,
354
- "--np-sheet-item-active": f?.itemActiveBackground,
355
- "--np-sheet-row-active-text": f?.activeRowText,
356
- "--np-sheet-row-active-bg": f?.activeRowBackground,
357
- "--np-sheet-row-active-bg-hover": f?.activeRowBackgroundHover,
358
- "--np-sheet-icon": f?.icon,
359
- "--np-sheet-divider": f?.divider,
360
- "--np-avatar-bg": f?.avatarBackground,
361
- "--np-avatar-text": f?.avatarText,
362
- "--np-menu-active-icon": f?.activeIcon,
363
- "--np-font-family": p?.fontFamily
364
- }), [f, p?.fontFamily]);
365
- return /* @__PURE__ */ b(L, {
362
+ }), d] });
363
+ }), K = m(({ isOpen: n, onClose: r, items: i, onSelectItem: a, labels: o, profile: s, groups: c, onLogout: l, onSettings: u, footer: d, styles: f }) => {
364
+ let { colors: p, typography: m, className: h, cssVars: g } = f ?? {}, _ = v(() => e({
365
+ "--np-sheet-text": p?.text,
366
+ "--np-sheet-item-hover": p?.itemHoverBackground,
367
+ "--np-sheet-item-active": p?.itemActiveBackground,
368
+ "--np-sheet-row-active-text": p?.activeRowText,
369
+ "--np-sheet-row-active-bg": p?.activeRowBackground,
370
+ "--np-sheet-row-active-bg-hover": p?.activeRowBackgroundHover,
371
+ "--np-sheet-icon": p?.icon,
372
+ "--np-sheet-divider": p?.divider,
373
+ "--np-avatar-bg": p?.avatarBackground,
374
+ "--np-avatar-text": p?.avatarText,
375
+ "--np-menu-active-icon": p?.activeIcon,
376
+ "--np-font-family": m?.fontFamily
377
+ }), [p, m?.fontFamily]);
378
+ return /* @__PURE__ */ x(z, {
366
379
  isOpen: n,
367
380
  onClose: r,
368
381
  title: o.title,
369
382
  closeLabel: o.close,
370
383
  backLabel: o.back,
371
- className: t(z.sheet, m),
384
+ className: t(V.sheet, h),
372
385
  style: {
373
- ...h,
374
- ...g
386
+ ...g,
387
+ ..._
375
388
  },
376
- children: /* @__PURE__ */ b(U, {
389
+ children: /* @__PURE__ */ x(G, {
377
390
  items: i,
378
391
  onSelectItem: a,
379
392
  profileLabel: o.profile,
380
393
  logOutLabel: o.logOut,
381
394
  onLogout: l,
395
+ settingsLabel: o.settings,
396
+ onSettings: u,
382
397
  profile: s,
383
398
  groups: c,
384
- footer: u,
385
- textClassName: p?.fontClassName
399
+ footer: d,
400
+ textClassName: m?.fontClassName
386
401
  })
387
402
  });
388
403
  });
389
404
  //#endregion
390
- export { M as AvatarInitials, L as NavigableBottomSheet, U as NavigationMenuPage, A as NavigationPanel, W as NavigationSheet, V as OptionListPage, H as ProfilePage, B as SheetRow, N as UserAvatar, F as UserMenu, R as useSheetNavigation };
405
+ export { P as AvatarInitials, k as NAVIGATION_PANEL_CLASS, z as NavigableBottomSheet, G as NavigationMenuPage, M as NavigationPanel, K as NavigationSheet, U as OptionListPage, W as ProfilePage, H as SheetRow, F as UserAvatar, L as UserMenu, B as useSheetNavigation };
@@ -57,6 +57,8 @@ export interface NavigationSheetLabels {
57
57
  profile: string;
58
58
  /** Label of the log-out row. */
59
59
  logOut: string;
60
+ /** Label of the settings row on the profile page; required when `onSettings` is provided. */
61
+ settings?: string;
60
62
  }
61
63
  /** Props accepted by `NavigationSheet`. */
62
64
  export interface NavigationSheetProps {
@@ -76,6 +78,11 @@ export interface NavigationSheetProps {
76
78
  groups?: NavigationMenuGroup[];
77
79
  /** Called when the user taps "Log out"; the host owns the confirmation flow. */
78
80
  onLogout: () => void;
81
+ /**
82
+ * Called when the user taps the profile page's settings row, after the sheet
83
+ * closes; the host performs the navigation. Omit to hide the row.
84
+ */
85
+ onSettings?: () => void;
79
86
  /** Rendered at the end of the root page — typically a footer message. */
80
87
  footer?: ReactNode;
81
88
  /** Style overrides for colors, typography, and class names. */
@@ -1 +1 @@
1
- {"version":3,"file":"navigation-sheet-props.d.ts","sourceRoot":"","sources":["../../src/models/navigation-sheet-props.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAC;AAE5D,qEAAqE;AACrE,MAAM,WAAW,qBAAqB;IACpC,4BAA4B;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,+BAA+B;IAC/B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,oCAAoC;IACpC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,iEAAiE;IACjE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,uDAAuD;IACvD,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,iEAAiE;IACjE,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,8BAA8B;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,wCAAwC;IACxC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,wCAAwC;IACxC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kCAAkC;IAClC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,kDAAkD;IAClD,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,4DAA4D;AAC5D,MAAM,WAAW,yBAAyB;IACxC,wEAAwE;IACxE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,kDAAkD;IAClD,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,gEAAgE;AAChE,MAAM,WAAW,qBAAqB;IACpC,wDAAwD;IACxD,MAAM,CAAC,EAAE,qBAAqB,CAAC;IAC/B,kDAAkD;IAClD,UAAU,CAAC,EAAE,yBAAyB,CAAC;IACvC,2DAA2D;IAC3D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,aAAa,CAAC;CACzB;AAED,uDAAuD;AACvD,MAAM,WAAW,qBAAqB;IACpC,6CAA6C;IAC7C,KAAK,EAAE,MAAM,CAAC;IACd,gDAAgD;IAChD,KAAK,EAAE,MAAM,CAAC;IACd,iEAAiE;IACjE,IAAI,EAAE,MAAM,CAAC;IACb,yEAAyE;IACzE,OAAO,EAAE,MAAM,CAAC;IAChB,gCAAgC;IAChC,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,2CAA2C;AAC3C,MAAM,WAAW,oBAAoB;IACnC,iCAAiC;IACjC,MAAM,EAAE,OAAO,CAAC;IAChB,kFAAkF;IAClF,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,wEAAwE;IACxE,KAAK,EAAE,mBAAmB,EAAE,CAAC;IAC7B,4EAA4E;IAC5E,YAAY,EAAE,CAAC,IAAI,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAClD,sEAAsE;IACtE,MAAM,EAAE,qBAAqB,CAAC;IAC9B,sFAAsF;IACtF,OAAO,CAAC,EAAE,qBAAqB,CAAC;IAChC,0FAA0F;IAC1F,MAAM,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAC/B,gFAAgF;IAChF,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,yEAAyE;IACzE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,qBAAqB,CAAC;CAChC"}
1
+ {"version":3,"file":"navigation-sheet-props.d.ts","sourceRoot":"","sources":["../../src/models/navigation-sheet-props.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAC;AAE5D,qEAAqE;AACrE,MAAM,WAAW,qBAAqB;IACpC,4BAA4B;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,+BAA+B;IAC/B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,oCAAoC;IACpC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,iEAAiE;IACjE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,uDAAuD;IACvD,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,iEAAiE;IACjE,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,8BAA8B;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,wCAAwC;IACxC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,wCAAwC;IACxC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kCAAkC;IAClC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,kDAAkD;IAClD,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,4DAA4D;AAC5D,MAAM,WAAW,yBAAyB;IACxC,wEAAwE;IACxE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,kDAAkD;IAClD,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,gEAAgE;AAChE,MAAM,WAAW,qBAAqB;IACpC,wDAAwD;IACxD,MAAM,CAAC,EAAE,qBAAqB,CAAC;IAC/B,kDAAkD;IAClD,UAAU,CAAC,EAAE,yBAAyB,CAAC;IACvC,2DAA2D;IAC3D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,aAAa,CAAC;CACzB;AAED,uDAAuD;AACvD,MAAM,WAAW,qBAAqB;IACpC,6CAA6C;IAC7C,KAAK,EAAE,MAAM,CAAC;IACd,gDAAgD;IAChD,KAAK,EAAE,MAAM,CAAC;IACd,iEAAiE;IACjE,IAAI,EAAE,MAAM,CAAC;IACb,yEAAyE;IACzE,OAAO,EAAE,MAAM,CAAC;IAChB,gCAAgC;IAChC,MAAM,EAAE,MAAM,CAAC;IACf,6FAA6F;IAC7F,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,2CAA2C;AAC3C,MAAM,WAAW,oBAAoB;IACnC,iCAAiC;IACjC,MAAM,EAAE,OAAO,CAAC;IAChB,kFAAkF;IAClF,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,wEAAwE;IACxE,KAAK,EAAE,mBAAmB,EAAE,CAAC;IAC7B,4EAA4E;IAC5E,YAAY,EAAE,CAAC,IAAI,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAClD,sEAAsE;IACtE,MAAM,EAAE,qBAAqB,CAAC;IAC9B,sFAAsF;IACtF,OAAO,CAAC,EAAE,qBAAqB,CAAC;IAChC,0FAA0F;IAC1F,MAAM,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAC/B,gFAAgF;IAChF,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,yEAAyE;IACzE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,qBAAqB,CAAC;CAChC"}
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.2.0-dev.20",
4
+ "version": "1.2.0-dev.201",
5
5
  "license": "Apache-2.0",
6
6
  "type": "module",
7
7
  "main": "./index.js",
@@ -18,12 +18,12 @@
18
18
  },
19
19
  "dependencies": {
20
20
  "@tabler/icons-react": "^3.44.0",
21
- "@epam/ai-dial-conversation-input": "1.2.0-dev.20"
21
+ "@epam/ai-dial-conversation-input": "1.2.0-dev.201"
22
22
  },
23
23
  "peerDependencies": {
24
24
  "react": "^19.2.8",
25
- "@epam/ai-dial-chat-shared": "1.2.0-dev.20",
26
- "@epam/ai-dial-ui-kit": "^0.14.2"
25
+ "@epam/ai-dial-chat-shared": "1.2.0-dev.201",
26
+ "@epam/ai-dial-ui-kit": "^0.15.0-dev.23"
27
27
  },
28
28
  "repository": {
29
29
  "type": "git",