@epam/ai-dial-navigation-panel 1.3.0-dev.130 → 1.3.0-dev.133
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.
- package/components/UserMenu/UserMenu.d.ts.map +1 -1
- package/index.css +1 -1
- package/index.js +97 -96
- package/package.json +3 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UserMenu.d.ts","sourceRoot":"","sources":["../../../src/components/UserMenu/UserMenu.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAA2B,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAMlE;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,
|
|
1
|
+
{"version":3,"file":"UserMenu.d.ts","sourceRoot":"","sources":["../../../src/components/UserMenu/UserMenu.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAA2B,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAMlE;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CA6NtC,CAAC"}
|
package/index.css
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
._rail_1hxk4_1{background:var(--np-bg,var(--bg-layer-raised,#fcfcfc));font-family:var(--np-font-family,inherit)}._item_1hxk4_6{color:var(--np-item-text,var(--text-primary,#161b2d))}._item_1hxk4_6 svg{transition:transform .2s cubic-bezier(.34,1.56,.64,1)}._item_1hxk4_6:hover svg,a:focus-visible>._item_1hxk4_6 svg{transform:translateY(-2px)}._item_1hxk4_6:active svg{transition-duration:.1s;transform:translateY(0)}@media (prefers-reduced-motion:reduce){._item_1hxk4_6 svg{transition:none}._item_1hxk4_6:hover svg,a:focus-visible>._item_1hxk4_6 svg{transform:none}}._item_1hxk4_6:not(._itemActive_1hxk4_33):hover{background:var(--np-item-hover-bg,transparent)}._item_1hxk4_6:not(._itemActive_1hxk4_33):hover svg,a:focus-visible>._item_1hxk4_6:not(._itemActive_1hxk4_33) svg{stroke:var(--np-item-hover-icon,currentColor)}._item_1hxk4_6:active{background:var(--np-item-active-bg,var(--bg-control-accent-alpha-active,#2764d933))}a:focus-visible>._item_1hxk4_6:not(._itemActive_1hxk4_33){background:var(--np-item-hover-bg,var(--bg-control-accent-alpha-hover,#2764d924))}a:focus-visible>._item_1hxk4_6._itemActive_1hxk4_33{outline:2px solid var(--np-item-active-text,var(--text-accent,#1d4ed8));outline-offset:-2px}._item_1hxk4_6._itemActive_1hxk4_33{background:var(--np-item-selected-bg,var(--bg-control-accent-alpha-active,#2764d933));color:var(--np-item-active-text,var(--text-accent,#1d4ed8))}._item_1hxk4_6._itemActive_1hxk4_33 svg{stroke:var(--np-item-active-icon,currentColor)}._item_1hxk4_6._itemFilled_1hxk4_38 svg{fill:var(--np-item-active-icon,currentColor);stroke:none}._item_1hxk4_6._itemFilledOutline_1hxk4_79 svg{fill:var(--np-item-active-icon,currentColor)}._stopStart_8i550_1{stop-color:var(--np-sidebar-gradient-start,#1d4ed8)}._stopEnd_8i550_5{stop-color:var(--np-sidebar-gradient-end,#885df2)}._sidebar_1w4pz_1{background:var(--np-sidebar-bg,var(--bg-layer-raised,#fcfcfc));font-family:var(--np-sidebar-font-family,inherit)}._sidebarColumn_1w4pz_7{transition:width .2s}@media (prefers-reduced-motion:reduce){._sidebarColumn_1w4pz_7{transition:none}}._item_1w4pz_16{color:var(--np-sidebar-item-text,var(--text-primary,#161b2d));cursor:pointer}._item_1w4pz_16:not(._itemActive_1w4pz_21):hover,._item_1w4pz_16:not(._itemActive_1w4pz_21):focus-visible{background:var(--np-sidebar-item-hover-bg,var(--bg-control-accent-alpha-hover-subtle,#2764d90a))}._item_1w4pz_16:focus-visible{outline:1px solid var(--np-sidebar-focus-outline,var(--stroke-focus,#161b2d));outline-offset:2px}._item_1w4pz_16._itemActive_1w4pz_21{background:var(--np-sidebar-item-selected-bg,var(--bg-control-accent-alpha-active-subtle,#2764d914))}._item_1w4pz_16._itemActive_1w4pz_21 svg{stroke:var(--np-sidebar-item-active-icon,currentColor)}._item_1w4pz_16._itemFilled_1w4pz_38 svg{fill:var(--np-sidebar-item-active-icon,currentColor);stroke:none}._item_1w4pz_16._itemFilledOutline_1w4pz_45 svg{fill:var(--np-sidebar-item-active-icon,currentColor)}._itemIcon_1w4pz_49{color:var(--np-sidebar-item-text,var(--text-primary,#161b2d))}._footer_1w4pz_55{background:var(--np-sidebar-bg,var(--bg-layer-raised,#fcfcfc))}._avatar_4hc9t_4._avatar_4hc9t_4{background:var(--np-avatar-bg,var(--bg-control-accent,#1d4ed8));color:var(--np-avatar-text,var(--text-control-permanent,#fcfcfc))}._wrapper_11e9t_1{font-family:var(--np-font-family,inherit)}._trigger_11e9t_5:hover{background:var(--np-trigger-hover-bg,var(--bg-control-accent-alpha-hover,#2764d924))}._trigger_11e9t_5._trigger_11e9t_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,#161b2d));outline-offset:-1px}._triggerOpen_11e9t_18{background:var(--np-trigger-open-bg,var(--bg-control-accent-alpha-active-subtle,#2764d914))}._identityText_11e9t_22,._menuLabel_11e9t_26{color:var(--np-menu-text,var(--text-primary,#161b2d))}._sheet_1k0ml_1{font-family:var(--np-font-family,inherit)}li>._row_1k0ml_12{color:var(--np-sheet-text,var(--text-primary,#161b2d))}li>._row_1k0ml_12:hover,li>._row_1k0ml_12:focus-visible{background:var(--np-sheet-item-hover,var(--bg-control-accent-alpha-hover,#2764d924))}li>._row_1k0ml_12:active{background:var(--np-sheet-item-active,var(--bg-control-neutral-active,#d1dbea))}li>._rowActive_1k0ml_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_1k0ml_24:hover,li>._rowActive_1k0ml_24:focus-visible{background:var(--np-sheet-row-active-bg-hover,var(--bg-control-accent-alpha-hover,#2764d924))}li>._rowActive_1k0ml_24 ._rowIcon_1k0ml_31{color:inherit}li>._rowActive_1k0ml_24 ._rowIcon_1k0ml_31 svg[fill=none]{fill:currentColor}._rowIcon_1k0ml_31{color:var(--np-sheet-icon,var(--text-secondary,#57647a))}._divider_1k0ml_46{border-color:var(--np-sheet-divider,var(--stroke-secondary,#d1dbea))}._mutedText_1k0ml_50{color:var(--np-sheet-muted-text,var(--text-secondary,#57647a))}._activeIcon_1k0ml_54{color:var(--np-menu-active-icon,var(--text-accent,#1d4ed8))}
|
|
2
2
|
/*$vite$:1*//*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
|
|
3
|
-
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-border-style:solid;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-duration:initial;--tw-ease:initial;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1}}}.collapse{visibility:collapse}.invisible{visibility:hidden}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.inset-0{inset:0}.inset-y-0{inset-block:0}.start-0{inset-inline-start:0}.z-10{z-index:10}.z-50{z-index:50}.m-0{margin:0}.block{display:block}.contents{display:contents}.flex{display:flex}.hidden{display:none}.inline{display:inline}.\!size-10{width:2.5rem!important;height:2.5rem!important}.size-0{width:0;height:0}.size-6{width:1.5rem;height:1.5rem}.size-10{width:2.5rem;height:2.5rem}.size-10\!{width:2.5rem!important;height:2.5rem!important}.size-\[44px\]{width:44px;height:44px}.size-\[60px\]{width:60px;height:60px}.\!h-10{height:2.5rem!important}.h-6{height:1.5rem}.h-10{height:2.5rem}.h-16{height:4rem}.h-\[40px\]{height:40px}.h-\[56px\]{height:56px}.h-auto{height:auto}.h-full{height:100%}.\!min-h-0{min-height:0!important}.min-h-0{min-height:0}.min-h-0\!{min-height:0!important}.w-6{width:1.5rem}.w-\[60px\]{width:60px}.w-\[72px\]{width:72px}.w-\[320px\]{width:320px}.w-\[336px\]{width:336px}.w-full{width:100%}.max-w-full{max-width:100%}.\!min-w-0{min-width:0!important}.min-w-0{min-width:0}.min-w-0\!{min-width:0!important}.min-w-\[116px\]{min-width:116px}.flex-1{flex:1}.shrink-0{flex-shrink:0}.translate-x-0{--tw-translate-x:0px;translate:var(--tw-translate-x) var(--tw-translate-y)}.list-none{list-style-type:none}.flex-col{flex-direction:column}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-0{gap:0}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.\!rounded-full{border-radius:3.40282e38px!important}.rounded-full{border-radius:3.40282e38px}.rounded-full\!{border-radius:3.40282e38px!important}.rounded-none{border-radius:0}.rounded-xl{border-radius:.75rem}.\!border-0{border-style:var(--tw-border-style)!important;border-width:0!important}.bg-contain{background-size:contain}.bg-center{background-position:50%}.bg-no-repeat{background-repeat:no-repeat}.\!p-2{padding:.5rem!important}.p-0{padding:0}.p-2{padding:.5rem}.p-2\!{padding:.5rem!important}.p-4{padding:1rem}.px-4{padding-inline:1rem}.py-2{padding-block:.5rem}.py-3{padding-block:.75rem}.py-\[10px\]{padding-block:10px}.ps-2{padding-inline-start:.5rem}.ps-4{padding-inline-start:1rem}.pe-2{padding-inline-end:.5rem}.pt-3{padding-top:.75rem}.pb-2{padding-bottom:.5rem}.pb-4{padding-bottom:1rem}.no-underline{text-decoration-line:none}.opacity-0{opacity:0}.shadow-lg{--tw-shadow:0 8px 44px 0 var(--tw-shadow-color,var(--shadow-lg,#2764d914));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:4px 9px 16px 1px var(--tw-shadow-color,var(--shadow-sm-2,var(--shadow-sm,#2764d90f))), 0 -2px 4px 2px var(--tw-shadow-color,var(--shadow-sm-1,#2764d90a));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.transition-\[transform\,visibility\]{transition-property:transform,visibility;transition-timing-function:var(--tw-ease,cubic-bezier(.4, 0, .2, 1));transition-duration:var(--tw-duration,.15s)}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,cubic-bezier(.4, 0, .2, 1));transition-duration:var(--tw-duration,.15s)}.duration-200{--tw-duration:.2s;transition-duration:.2s}.ease-in-out{--tw-ease:cubic-bezier(.4, 0, .2, 1);transition-timing-function:cubic-bezier(.4,0,.2,1)}.outline-none{--tw-outline-style:none;outline-style:none}@media (hover:hover){.group-hover\/toggle\:opacity-0:is(:where(.group\/toggle):hover *){opacity:0}.group-hover\/toggle\:opacity-100:is(:where(.group\/toggle):hover *){opacity:1}}.group-focus-visible\/toggle\:opacity-0:is(:where(.group\/toggle):focus-visible *){opacity:0}.group-focus-visible\/toggle\:opacity-100:is(:where(.group\/toggle):focus-visible *){opacity:1}@media (prefers-reduced-motion:reduce){.motion-reduce\:transition-none{transition-property:none}}.ltr\:-translate-x-full:where(:dir(ltr),[dir=ltr],[dir=ltr] *){--tw-translate-x:-100%;translate:var(--tw-translate-x) var(--tw-translate-y)}.rtl\:translate-x-full:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-translate-x:100%;translate:var(--tw-translate-x) var(--tw-translate-y)}.rtl\:scale-x-\[-1\]:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-scale-x:-1;scale:var(--tw-scale-x) var(--tw-scale-y)}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}
|
|
3
|
+
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-border-style:solid;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-duration:initial;--tw-ease:initial;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1}}}.collapse{visibility:collapse}.invisible{visibility:hidden}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.inset-0{inset:0}.inset-y-0{inset-block:0}.start-0{inset-inline-start:0}.z-10{z-index:10}.z-50{z-index:50}.m-0{margin:0}.block{display:block}.contents{display:contents}.flex{display:flex}.hidden{display:none}.inline{display:inline}.\!size-10{width:2.5rem!important;height:2.5rem!important}.size-0{width:0;height:0}.size-6{width:1.5rem;height:1.5rem}.size-10{width:2.5rem;height:2.5rem}.size-10\!{width:2.5rem!important;height:2.5rem!important}.size-\[44px\]{width:44px;height:44px}.size-\[60px\]{width:60px;height:60px}.\!h-10{height:2.5rem!important}.h-6{height:1.5rem}.h-10{height:2.5rem}.h-16{height:4rem}.h-\[40px\]{height:40px}.h-\[56px\]{height:56px}.h-auto{height:auto}.h-full{height:100%}.\!min-h-0{min-height:0!important}.min-h-0{min-height:0}.min-h-0\!{min-height:0!important}.w-6{width:1.5rem}.w-\[60px\]{width:60px}.w-\[72px\]{width:72px}.w-\[320px\]{width:320px}.w-\[336px\]{width:336px}.w-full{width:100%}.max-w-full{max-width:100%}.\!min-w-0{min-width:0!important}.min-w-0{min-width:0}.min-w-0\!{min-width:0!important}.min-w-\[116px\]{min-width:116px}.flex-1{flex:1}.shrink{flex-shrink:1}.shrink-0{flex-shrink:0}.translate-x-0{--tw-translate-x:0px;translate:var(--tw-translate-x) var(--tw-translate-y)}.list-none{list-style-type:none}.flex-col{flex-direction:column}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-0{gap:0}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.\!rounded-full{border-radius:3.40282e38px!important}.rounded-full{border-radius:3.40282e38px}.rounded-full\!{border-radius:3.40282e38px!important}.rounded-none{border-radius:0}.rounded-xl{border-radius:.75rem}.\!border-0{border-style:var(--tw-border-style)!important;border-width:0!important}.bg-contain{background-size:contain}.bg-center{background-position:50%}.bg-no-repeat{background-repeat:no-repeat}.\!p-2{padding:.5rem!important}.p-0{padding:0}.p-2{padding:.5rem}.p-2\!{padding:.5rem!important}.p-4{padding:1rem}.px-4{padding-inline:1rem}.py-2{padding-block:.5rem}.py-3{padding-block:.75rem}.py-\[10px\]{padding-block:10px}.ps-2{padding-inline-start:.5rem}.ps-4{padding-inline-start:1rem}.pe-2{padding-inline-end:.5rem}.pt-3{padding-top:.75rem}.pb-2{padding-bottom:.5rem}.pb-4{padding-bottom:1rem}.no-underline{text-decoration-line:none}.opacity-0{opacity:0}.shadow-lg{--tw-shadow:0 8px 44px 0 var(--tw-shadow-color,var(--shadow-lg,#2764d914));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:4px 9px 16px 1px var(--tw-shadow-color,var(--shadow-sm-2,var(--shadow-sm,#2764d90f))), 0 -2px 4px 2px var(--tw-shadow-color,var(--shadow-sm-1,#2764d90a));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.transition-\[transform\,visibility\]{transition-property:transform,visibility;transition-timing-function:var(--tw-ease,cubic-bezier(.4, 0, .2, 1));transition-duration:var(--tw-duration,.15s)}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,cubic-bezier(.4, 0, .2, 1));transition-duration:var(--tw-duration,.15s)}.duration-200{--tw-duration:.2s;transition-duration:.2s}.ease-in-out{--tw-ease:cubic-bezier(.4, 0, .2, 1);transition-timing-function:cubic-bezier(.4,0,.2,1)}.outline-none{--tw-outline-style:none;outline-style:none}@media (hover:hover){.group-hover\/toggle\:opacity-0:is(:where(.group\/toggle):hover *){opacity:0}.group-hover\/toggle\:opacity-100:is(:where(.group\/toggle):hover *){opacity:1}}.group-focus-visible\/toggle\:opacity-0:is(:where(.group\/toggle):focus-visible *){opacity:0}.group-focus-visible\/toggle\:opacity-100:is(:where(.group\/toggle):focus-visible *){opacity:1}@media (prefers-reduced-motion:reduce){.motion-reduce\:transition-none{transition-property:none}}.ltr\:-translate-x-full:where(:dir(ltr),[dir=ltr],[dir=ltr] *){--tw-translate-x:-100%;translate:var(--tw-translate-x) var(--tw-translate-y)}.rtl\:translate-x-full:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-translate-x:100%;translate:var(--tw-translate-x) var(--tw-translate-y)}.rtl\:scale-x-\[-1\]:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-scale-x:-1;scale:var(--tw-scale-x) var(--tw-scale-y)}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}
|
package/index.js
CHANGED
|
@@ -1,28 +1,28 @@
|
|
|
1
1
|
import { buildCssVars as e, mergeClasses as t } from "@epam/ai-dial-chat-shared";
|
|
2
2
|
import { Avatar as n, BASE_ICON_SIZE as r, Button as i, DIAL_ICON_SIZE as a, DIAL_KIT_ICON_STROKE as o, Dropdown as s, DropdownItemType as c, ElementSize as l, EllipsisTooltip as u, GhostIconButton as d, IconButton as f, MenuItem as p, MenuItemMark as m, Tooltip as h } from "@epam/ai-dial-ui-kit";
|
|
3
|
-
import { Fragment as g, createContext as _, memo as v, useCallback as y, useContext as b, useEffect as x, useId as
|
|
3
|
+
import { Fragment as g, createContext as _, memo as v, useCallback as y, useContext as b, useEffect as x, useId as ee, useMemo as S, useRef as C, useState as w } from "react";
|
|
4
4
|
import { Fragment as T, jsx as E, jsxs as D } from "react/jsx-runtime";
|
|
5
|
-
import { IconCheck as O, IconChevronDown as k, IconChevronRight as A, IconChevronUp as te, IconLayoutSidebar as j, IconLogout as
|
|
6
|
-
import { BottomSheetShell as
|
|
5
|
+
import { IconCheck as O, IconChevronDown as k, IconChevronRight as A, IconChevronUp as te, IconLayoutSidebar as j, IconLogout as ne, IconSettings as M, IconUser as N, IconX as P } from "@tabler/icons-react";
|
|
6
|
+
import { BottomSheetShell as F } from "@epam/ai-dial-conversation-input";
|
|
7
7
|
//#region src/constants/public-class-names.ts
|
|
8
|
-
var
|
|
8
|
+
var I = {
|
|
9
9
|
rail: "dial-navigation-panel-rail",
|
|
10
10
|
item: "dial-navigation-panel-item",
|
|
11
11
|
sidebar: "dial-navigation-panel-sidebar",
|
|
12
12
|
sidebarItem: "dial-navigation-panel-sidebar-item",
|
|
13
13
|
sidebarFooter: "dial-navigation-panel-sidebar-footer"
|
|
14
|
-
},
|
|
14
|
+
}, L = {
|
|
15
15
|
rail: "_rail_1hxk4_1",
|
|
16
16
|
item: "_item_1hxk4_6",
|
|
17
17
|
itemActive: "_itemActive_1hxk4_33",
|
|
18
18
|
itemFilled: "_itemFilled_1hxk4_38",
|
|
19
19
|
itemFilledOutline: "_itemFilledOutline_1hxk4_79"
|
|
20
|
-
},
|
|
20
|
+
}, R = (e, t) => /* @__PURE__ */ E("a", {
|
|
21
21
|
href: e.href,
|
|
22
22
|
className: "contents",
|
|
23
23
|
children: t
|
|
24
|
-
}),
|
|
25
|
-
let { colors: u, typography: d, className: p, cssVars: m } = l ?? {}, h =
|
|
24
|
+
}), z = v(({ items: n, labels: r, logo: i, footer: s, renderLink: c = R, styles: l }) => {
|
|
25
|
+
let { colors: u, typography: d, className: p, cssVars: m } = l ?? {}, h = ee().replace(/[^\w-]/g, ""), _ = `np-hover-gradient-${h}`, v = `np-active-gradient-${h}`, y = S(() => e({
|
|
26
26
|
"--np-bg": u?.background,
|
|
27
27
|
"--np-item-text": u?.itemText,
|
|
28
28
|
"--np-item-active-text": u?.itemActiveText,
|
|
@@ -44,7 +44,7 @@ var L = {
|
|
|
44
44
|
...m,
|
|
45
45
|
...y
|
|
46
46
|
},
|
|
47
|
-
className: t(
|
|
47
|
+
className: t(L.rail, "relative z-10 flex h-full w-[60px] flex-col justify-between shadow-sm", d?.fontClassName, p, I.rail),
|
|
48
48
|
children: [
|
|
49
49
|
/* @__PURE__ */ E("svg", {
|
|
50
50
|
"aria-hidden": !0,
|
|
@@ -103,7 +103,7 @@ var L = {
|
|
|
103
103
|
"aria-current": e.isActive ? "page" : void 0,
|
|
104
104
|
tooltipProps: { tooltip: e.label },
|
|
105
105
|
tabIndex: -1,
|
|
106
|
-
className: t(
|
|
106
|
+
className: t(L.item, "rounded-xl", e.isActive && L.itemActive, n && L.itemFilled, e.isActive && !n && L.itemFilledOutline, I.item)
|
|
107
107
|
})) }, e.id);
|
|
108
108
|
})
|
|
109
109
|
})]
|
|
@@ -111,12 +111,12 @@ var L = {
|
|
|
111
111
|
s
|
|
112
112
|
]
|
|
113
113
|
});
|
|
114
|
-
}),
|
|
114
|
+
}), B = /* @__PURE__ */ function(e) {
|
|
115
115
|
return e.Sidebar = "sidebar", e.Drawer = "drawer", e;
|
|
116
|
-
}({}),
|
|
116
|
+
}({}), V = {
|
|
117
117
|
stopStart: "_stopStart_8i550_1",
|
|
118
118
|
stopEnd: "_stopEnd_8i550_5"
|
|
119
|
-
},
|
|
119
|
+
}, re = ({ activeGradientId: e }) => /* @__PURE__ */ E("svg", {
|
|
120
120
|
"aria-hidden": !0,
|
|
121
121
|
className: "absolute size-0",
|
|
122
122
|
focusable: "false",
|
|
@@ -129,13 +129,13 @@ var L = {
|
|
|
129
129
|
y2: "20.4",
|
|
130
130
|
children: [/* @__PURE__ */ E("stop", {
|
|
131
131
|
offset: "0",
|
|
132
|
-
className:
|
|
132
|
+
className: V.stopStart
|
|
133
133
|
}), /* @__PURE__ */ E("stop", {
|
|
134
134
|
offset: "1",
|
|
135
|
-
className:
|
|
135
|
+
className: V.stopEnd
|
|
136
136
|
})]
|
|
137
137
|
}) })
|
|
138
|
-
}),
|
|
138
|
+
}), H = {
|
|
139
139
|
sidebar: "_sidebar_1w4pz_1",
|
|
140
140
|
sidebarColumn: "_sidebarColumn_1w4pz_7",
|
|
141
141
|
item: "_item_1w4pz_16",
|
|
@@ -144,19 +144,19 @@ var L = {
|
|
|
144
144
|
itemFilledOutline: "_itemFilledOutline_1w4pz_45",
|
|
145
145
|
itemIcon: "_itemIcon_1w4pz_49",
|
|
146
146
|
footer: "_footer_1w4pz_55"
|
|
147
|
-
},
|
|
147
|
+
}, ie = (e, t, n) => /* @__PURE__ */ E("a", {
|
|
148
148
|
href: e.href,
|
|
149
149
|
...n,
|
|
150
150
|
children: t
|
|
151
|
-
}),
|
|
152
|
-
let { colors: O, typography: k, className: A, cssVars: te } =
|
|
151
|
+
}), ae = (e, t) => e ? "w-[320px] max-w-full" : t ? "w-[72px]" : "w-[336px]", oe = (e, n) => e ? t("fixed inset-y-0 start-0 z-50 flex flex-col overflow-hidden shadow-sm outline-none", "transition-[transform,visibility] duration-200 ease-in-out motion-reduce:transition-none", n ? "visible translate-x-0" : "invisible ltr:-translate-x-full rtl:translate-x-full") : t(H.sidebarColumn, "relative z-10 flex h-full shrink-0 flex-col overflow-hidden shadow-sm"), U = v(({ items: n, labels: r, variant: i = B.Sidebar, isCollapsed: s = !1, onToggleCollapse: c, isOpen: u = !1, onClose: f, id: p, logo: m, renderLink: _ = ie, children: v, userMenu: y, footerActions: b, styles: w }) => {
|
|
152
|
+
let { colors: O, typography: k, className: A, cssVars: te } = w ?? {}, ne = k?.fontClassName ?? "dial-small-text", M = i === B.Drawer, N = !M && s, F = ee(), L = p ?? F, R = `np-sidebar-gradient-${F.replace(/[^\w-]/g, "")}`, z = C(null), V = C(null), U = C(u);
|
|
153
153
|
x(() => {
|
|
154
|
-
let e =
|
|
155
|
-
|
|
156
|
-
}, [
|
|
157
|
-
let
|
|
154
|
+
let e = U.current;
|
|
155
|
+
U.current = u, M && (u && !e ? (V.current = document.activeElement instanceof HTMLElement ? document.activeElement : null, z.current?.focus()) : !u && e && (V.current?.focus(), V.current = null));
|
|
156
|
+
}, [M, u]);
|
|
157
|
+
let W = (e) => {
|
|
158
158
|
e.currentTarget.contains(e.target) && e.key === "Escape" && f?.();
|
|
159
|
-
},
|
|
159
|
+
}, G = S(() => e({
|
|
160
160
|
"--np-sidebar-bg": O?.background,
|
|
161
161
|
"--np-sidebar-item-text": O?.itemText,
|
|
162
162
|
"--np-sidebar-item-hover-bg": O?.itemHoverBackground,
|
|
@@ -164,86 +164,86 @@ var L = {
|
|
|
164
164
|
"--np-sidebar-focus-outline": O?.focusOutline,
|
|
165
165
|
"--np-sidebar-gradient-start": O?.itemActiveGradientStart,
|
|
166
166
|
"--np-sidebar-gradient-end": O?.itemActiveGradientEnd,
|
|
167
|
-
"--np-sidebar-item-active-icon": O?.itemActiveIcon ?? `url(#${
|
|
167
|
+
"--np-sidebar-item-active-icon": O?.itemActiveIcon ?? `url(#${R})`,
|
|
168
168
|
"--np-sidebar-font-family": k?.fontFamily
|
|
169
169
|
}), [
|
|
170
170
|
O,
|
|
171
171
|
k?.fontFamily,
|
|
172
|
-
|
|
173
|
-
]),
|
|
172
|
+
R
|
|
173
|
+
]), K = N ? r.expand ?? "Expand sidebar" : r.collapse ?? "Collapse sidebar", q = r.toggle ?? "Sidebar", J = r.close ?? "Close", Y = (e, n) => /* @__PURE__ */ E("span", {
|
|
174
174
|
style: { backgroundImage: `url("${e}")` },
|
|
175
175
|
className: t("bg-contain bg-center bg-no-repeat", n)
|
|
176
176
|
}), se = () => /* @__PURE__ */ E(d, {
|
|
177
177
|
icon: /* @__PURE__ */ D("span", {
|
|
178
178
|
className: "relative block size-6 shrink-0",
|
|
179
|
-
children: [
|
|
179
|
+
children: [N && m && Y(m.iconUrl, "absolute inset-0 transition-opacity group-focus-visible/toggle:opacity-0 group-hover/toggle:opacity-0"), /* @__PURE__ */ E(j, {
|
|
180
180
|
size: a.LG,
|
|
181
181
|
stroke: o,
|
|
182
|
-
className: t("absolute inset-0 rtl:scale-x-[-1]",
|
|
182
|
+
className: t("absolute inset-0 rtl:scale-x-[-1]", N && m && "opacity-0 group-hover/toggle:opacity-100 group-focus-visible/toggle:opacity-100"),
|
|
183
183
|
"aria-hidden": !0
|
|
184
184
|
})]
|
|
185
185
|
}),
|
|
186
186
|
size: l.Large,
|
|
187
|
-
"aria-label":
|
|
188
|
-
"aria-expanded": !
|
|
189
|
-
"aria-controls":
|
|
190
|
-
tooltipProps: { tooltip:
|
|
187
|
+
"aria-label": q,
|
|
188
|
+
"aria-expanded": !N,
|
|
189
|
+
"aria-controls": L,
|
|
190
|
+
tooltipProps: { tooltip: K },
|
|
191
191
|
onClick: c,
|
|
192
192
|
className: "group/toggle size-10! min-h-0! min-w-0! shrink-0 rounded-full! p-2!"
|
|
193
193
|
}), ce = () => /* @__PURE__ */ E(d, {
|
|
194
|
-
icon: /* @__PURE__ */ E(
|
|
194
|
+
icon: /* @__PURE__ */ E(P, {
|
|
195
195
|
size: a.LG,
|
|
196
196
|
stroke: o,
|
|
197
197
|
"aria-hidden": !0
|
|
198
198
|
}),
|
|
199
199
|
size: l.Large,
|
|
200
|
-
"aria-label":
|
|
201
|
-
tooltipProps: { tooltip:
|
|
200
|
+
"aria-label": J,
|
|
201
|
+
tooltipProps: { tooltip: J },
|
|
202
202
|
onClick: f,
|
|
203
203
|
className: "size-10! min-h-0! min-w-0! shrink-0 rounded-full! p-2!"
|
|
204
204
|
}), X = () => m && /* @__PURE__ */ E("a", {
|
|
205
205
|
href: m.href ?? "/",
|
|
206
206
|
"aria-label": m.ariaLabel,
|
|
207
|
-
className: t("flex h-10 items-center", !
|
|
208
|
-
children:
|
|
207
|
+
className: t("flex h-10 items-center", !M && "ps-2"),
|
|
208
|
+
children: Y(N ? m.iconUrl : m.logoUrl ?? m.iconUrl, N ? "size-6" : "h-6 min-w-[116px]")
|
|
209
209
|
}), Z = () => /* @__PURE__ */ D("div", {
|
|
210
210
|
className: "flex shrink-0 items-center justify-between ps-4 pe-2 pt-3 pb-2",
|
|
211
211
|
children: [X(), f && ce()]
|
|
212
|
-
}), Q = () => /* @__PURE__ */ D(T, { children: [!(
|
|
212
|
+
}), Q = () => /* @__PURE__ */ D(T, { children: [!(N && c) && X(), c && se()] }), $ = (e) => {
|
|
213
213
|
let n = !!e.isActive && !!e.activeIcon, r = n && e.activeIcon || e.icon, i = /* @__PURE__ */ E("span", {
|
|
214
|
-
className: t("flex size-6 shrink-0 items-center justify-center",
|
|
214
|
+
className: t("flex size-6 shrink-0 items-center justify-center", H.itemIcon),
|
|
215
215
|
children: /* @__PURE__ */ E(r, {
|
|
216
216
|
size: a.LG,
|
|
217
217
|
stroke: o
|
|
218
218
|
})
|
|
219
219
|
}), s = _(e, /* @__PURE__ */ D(T, { children: [i, /* @__PURE__ */ E("span", {
|
|
220
|
-
className:
|
|
220
|
+
className: N ? "sr-only" : ne,
|
|
221
221
|
children: e.label
|
|
222
222
|
})] }), {
|
|
223
|
-
className: t("flex items-center rounded-full p-2 no-underline",
|
|
223
|
+
className: t("flex items-center rounded-full p-2 no-underline", N ? "size-10 justify-center" : "h-10 w-full gap-2", H.item, e.isActive && H.itemActive, n && H.itemFilled, e.isActive && !n && H.itemFilledOutline, I.sidebarItem),
|
|
224
224
|
"aria-current": e.isActive ? "page" : void 0
|
|
225
225
|
});
|
|
226
|
-
return /* @__PURE__ */ E("li", { children:
|
|
226
|
+
return /* @__PURE__ */ E("li", { children: N ? /* @__PURE__ */ E(h, {
|
|
227
227
|
tooltip: e.label,
|
|
228
228
|
asChild: !0,
|
|
229
229
|
children: s
|
|
230
230
|
}) : s }, e.id);
|
|
231
|
-
}, le =
|
|
231
|
+
}, le = N ? /* @__PURE__ */ D(g, { children: [b, y] }) : /* @__PURE__ */ D(g, { children: [y, b] });
|
|
232
232
|
return /* @__PURE__ */ D("nav", {
|
|
233
|
-
ref:
|
|
234
|
-
id:
|
|
233
|
+
ref: z,
|
|
234
|
+
id: L,
|
|
235
235
|
"aria-label": r.ariaLabel,
|
|
236
|
-
tabIndex:
|
|
237
|
-
inert:
|
|
238
|
-
onKeyDown:
|
|
236
|
+
tabIndex: M ? -1 : void 0,
|
|
237
|
+
inert: M && !u,
|
|
238
|
+
onKeyDown: M ? W : void 0,
|
|
239
239
|
style: {
|
|
240
240
|
...te,
|
|
241
|
-
...
|
|
241
|
+
...G
|
|
242
242
|
},
|
|
243
|
-
className: t(
|
|
243
|
+
className: t(H.sidebar, oe(M, u), ae(M, N), A, I.sidebar),
|
|
244
244
|
children: [
|
|
245
|
-
!O?.itemActiveIcon && /* @__PURE__ */ E(
|
|
246
|
-
|
|
245
|
+
!O?.itemActiveIcon && /* @__PURE__ */ E(re, { activeGradientId: R }),
|
|
246
|
+
M ? /* @__PURE__ */ D("div", {
|
|
247
247
|
className: "flex shrink-0 flex-col",
|
|
248
248
|
children: [Z(), /* @__PURE__ */ E("ul", {
|
|
249
249
|
className: "m-0 flex list-none flex-col gap-1 p-2",
|
|
@@ -260,28 +260,28 @@ var L = {
|
|
|
260
260
|
})]
|
|
261
261
|
}),
|
|
262
262
|
/* @__PURE__ */ E("div", {
|
|
263
|
-
inert:
|
|
264
|
-
className: t("min-h-0 flex-1 overflow-hidden",
|
|
263
|
+
inert: N,
|
|
264
|
+
className: t("min-h-0 flex-1 overflow-hidden", N && "invisible"),
|
|
265
265
|
children: /* @__PURE__ */ E("div", {
|
|
266
|
-
className: t("flex h-full flex-col",
|
|
266
|
+
className: t("flex h-full flex-col", M ? "w-full" : "w-[336px]"),
|
|
267
267
|
children: v
|
|
268
268
|
})
|
|
269
269
|
}),
|
|
270
270
|
/* @__PURE__ */ E("div", {
|
|
271
|
-
className: t("flex shrink-0 px-4 py-3 shadow-lg",
|
|
271
|
+
className: t("flex shrink-0 px-4 py-3 shadow-lg", H.footer, N ? "flex-col items-start gap-2" : "items-center justify-between gap-2", I.sidebarFooter),
|
|
272
272
|
children: le
|
|
273
273
|
})
|
|
274
274
|
]
|
|
275
275
|
});
|
|
276
|
-
}),
|
|
276
|
+
}), W = /* @__PURE__ */ function(e) {
|
|
277
277
|
return e.Avatar = "avatar", e.Profile = "profile", e.Compact = "compact", e;
|
|
278
|
-
}({}),
|
|
278
|
+
}({}), G = { avatar: "_avatar_4hc9t_4" }, K = v(({ shortName: e, className: r, textClassName: i = "dial-tiny-text" }) => /* @__PURE__ */ E(n, {
|
|
279
279
|
name: e ?? "",
|
|
280
280
|
initials: e ?? "",
|
|
281
281
|
size: 28,
|
|
282
282
|
textClassName: i,
|
|
283
|
-
className: t(
|
|
284
|
-
})),
|
|
283
|
+
className: t(G.avatar, r)
|
|
284
|
+
})), q = v(({ profile: e, alt: t, size: r = 28 }) => {
|
|
285
285
|
let i = e.isFallbackShown || !e.imageUrl;
|
|
286
286
|
return /* @__PURE__ */ E(n, {
|
|
287
287
|
name: e.displayName,
|
|
@@ -290,35 +290,35 @@ var L = {
|
|
|
290
290
|
alt: i ? "" : t,
|
|
291
291
|
size: r,
|
|
292
292
|
textClassName: "dial-tiny-text",
|
|
293
|
-
className:
|
|
293
|
+
className: G.avatar,
|
|
294
294
|
onImageError: e.onImageError
|
|
295
295
|
});
|
|
296
|
-
}),
|
|
296
|
+
}), J = {
|
|
297
297
|
wrapper: "_wrapper_11e9t_1",
|
|
298
298
|
trigger: "_trigger_11e9t_5",
|
|
299
299
|
triggerOpen: "_triggerOpen_11e9t_18",
|
|
300
300
|
identityText: "_identityText_11e9t_22",
|
|
301
301
|
menuLabel: "_menuLabel_11e9t_26"
|
|
302
|
-
},
|
|
303
|
-
let { colors: _, typography: v, className: y, cssVars: b } = g ?? {}, [x,
|
|
302
|
+
}, Y = v(({ profile: n, labels: r, groups: l, onLogout: d, onSettings: f, triggerVariant: p = W.Avatar, isTooltipHidden: h, styles: g }) => {
|
|
303
|
+
let { colors: _, typography: v, className: y, cssVars: b } = g ?? {}, [x, ee] = w(!1), C = p === W.Profile, O = p === W.Compact, A = C || O, j = v?.fontClassName ?? "dial-small-text", N = S(() => e({
|
|
304
304
|
"--np-avatar-bg": _?.avatarBackground,
|
|
305
305
|
"--np-avatar-text": _?.avatarText,
|
|
306
306
|
"--np-menu-text": _?.text,
|
|
307
307
|
"--np-trigger-hover-bg": _?.triggerHoverBackground,
|
|
308
308
|
"--np-trigger-open-bg": _?.triggerOpenBackground,
|
|
309
309
|
"--np-font-family": v?.fontFamily
|
|
310
|
-
}), [_, v?.fontFamily]),
|
|
310
|
+
}), [_, v?.fontFamily]), P = S(() => t(J.menuLabel, j), [j]), F = S(() => {
|
|
311
311
|
let e = (l ?? []).filter(({ options: e }) => e.length > 0).map(({ id: e, label: t, icon: n, options: r }) => ({
|
|
312
312
|
key: e,
|
|
313
313
|
label: /* @__PURE__ */ E("span", {
|
|
314
|
-
className:
|
|
314
|
+
className: P,
|
|
315
315
|
children: t
|
|
316
316
|
}),
|
|
317
317
|
icon: n,
|
|
318
318
|
children: r.map((e) => ({
|
|
319
319
|
key: e.id,
|
|
320
320
|
label: /* @__PURE__ */ E("span", {
|
|
321
|
-
className:
|
|
321
|
+
className: P,
|
|
322
322
|
children: e.label
|
|
323
323
|
}),
|
|
324
324
|
icon: e.icon,
|
|
@@ -333,9 +333,9 @@ var L = {
|
|
|
333
333
|
type: c.PlainText,
|
|
334
334
|
label: /* @__PURE__ */ D("div", {
|
|
335
335
|
className: "flex h-[40px] min-w-0 items-center gap-3",
|
|
336
|
-
children: [/* @__PURE__ */ E(
|
|
336
|
+
children: [/* @__PURE__ */ E(K, { shortName: n.shortName }), /* @__PURE__ */ E(u, {
|
|
337
337
|
text: n.displayName,
|
|
338
|
-
className: t(
|
|
338
|
+
className: t(J.identityText, j, "min-w-0 flex-1 truncate")
|
|
339
339
|
})]
|
|
340
340
|
})
|
|
341
341
|
},
|
|
@@ -347,10 +347,10 @@ var L = {
|
|
|
347
347
|
...f ? [{
|
|
348
348
|
key: "settings",
|
|
349
349
|
label: /* @__PURE__ */ E("span", {
|
|
350
|
-
className:
|
|
350
|
+
className: P,
|
|
351
351
|
children: r.settings
|
|
352
352
|
}),
|
|
353
|
-
icon: /* @__PURE__ */ E(
|
|
353
|
+
icon: /* @__PURE__ */ E(M, {
|
|
354
354
|
size: a.SM,
|
|
355
355
|
"aria-hidden": !0,
|
|
356
356
|
stroke: o
|
|
@@ -360,10 +360,10 @@ var L = {
|
|
|
360
360
|
{
|
|
361
361
|
key: "logout",
|
|
362
362
|
label: /* @__PURE__ */ E("span", {
|
|
363
|
-
className:
|
|
363
|
+
className: P,
|
|
364
364
|
children: r.logOut
|
|
365
365
|
}),
|
|
366
|
-
icon: /* @__PURE__ */ E(
|
|
366
|
+
icon: /* @__PURE__ */ E(ne, {
|
|
367
367
|
size: a.SM,
|
|
368
368
|
"aria-hidden": !0,
|
|
369
369
|
stroke: o
|
|
@@ -374,26 +374,26 @@ var L = {
|
|
|
374
374
|
}, [
|
|
375
375
|
l,
|
|
376
376
|
j,
|
|
377
|
-
|
|
377
|
+
P,
|
|
378
378
|
r.logOut,
|
|
379
379
|
r.settings,
|
|
380
380
|
d,
|
|
381
381
|
f,
|
|
382
382
|
n.displayName,
|
|
383
383
|
n.shortName
|
|
384
|
-
]),
|
|
385
|
-
if (!
|
|
384
|
+
]), I = () => {
|
|
385
|
+
if (!C) return /* @__PURE__ */ E(i, {
|
|
386
386
|
"aria-label": r.trigger,
|
|
387
387
|
tooltipProps: {
|
|
388
388
|
tooltip: n.email,
|
|
389
389
|
hideTooltip: h
|
|
390
390
|
},
|
|
391
|
-
iconBefore: /* @__PURE__ */ E(
|
|
391
|
+
iconBefore: /* @__PURE__ */ E(q, {
|
|
392
392
|
profile: n,
|
|
393
393
|
alt: r.avatarAlt,
|
|
394
394
|
size: O ? 24 : void 0
|
|
395
395
|
}),
|
|
396
|
-
className: t(O ? "!size-10 !min-h-0 !min-w-0 gap-0 !rounded-full !border-0 !p-2" : "size-[44px] gap-0 !rounded-full p-0",
|
|
396
|
+
className: t(O ? "!size-10 !min-h-0 !min-w-0 gap-0 !rounded-full !border-0 !p-2" : "size-[44px] gap-0 !rounded-full p-0", J.trigger, O && x && J.triggerOpen)
|
|
397
397
|
});
|
|
398
398
|
let e = x ? te : k;
|
|
399
399
|
return /* @__PURE__ */ E(i, {
|
|
@@ -401,14 +401,14 @@ var L = {
|
|
|
401
401
|
tooltip: n.email,
|
|
402
402
|
hideTooltip: h
|
|
403
403
|
},
|
|
404
|
-
iconBefore: /* @__PURE__ */ E(
|
|
404
|
+
iconBefore: /* @__PURE__ */ E(q, {
|
|
405
405
|
profile: n,
|
|
406
406
|
alt: "",
|
|
407
407
|
size: 24
|
|
408
408
|
}),
|
|
409
409
|
label: /* @__PURE__ */ D(T, { children: [/* @__PURE__ */ E(u, {
|
|
410
410
|
text: n.displayName,
|
|
411
|
-
className: t(
|
|
411
|
+
className: t(J.identityText, j, "min-w-0 truncate")
|
|
412
412
|
}), /* @__PURE__ */ E("span", {
|
|
413
413
|
className: "sr-only",
|
|
414
414
|
children: r.trigger
|
|
@@ -419,25 +419,26 @@ var L = {
|
|
|
419
419
|
"aria-hidden": !0
|
|
420
420
|
}),
|
|
421
421
|
textClassName: "min-w-0",
|
|
422
|
-
className: t("!h-10 !min-h-0 max-w-full !min-w-0 gap-2 !rounded-full !border-0 !p-2",
|
|
422
|
+
className: t("!h-10 !min-h-0 max-w-full !min-w-0 gap-2 !rounded-full !border-0 !p-2", J.trigger, x && J.triggerOpen)
|
|
423
423
|
});
|
|
424
424
|
};
|
|
425
425
|
return /* @__PURE__ */ E("div", {
|
|
426
426
|
style: {
|
|
427
427
|
...b,
|
|
428
|
-
...
|
|
428
|
+
...N
|
|
429
429
|
},
|
|
430
|
-
className: t(
|
|
430
|
+
className: t(J.wrapper, A ? "flex min-w-0 items-center" : "flex size-[60px] items-center justify-center", C && "flex-1", y),
|
|
431
431
|
children: /* @__PURE__ */ E(s, {
|
|
432
|
+
className: A ? "max-w-full min-w-0" : void 0,
|
|
432
433
|
placement: A ? "top-start" : "top-end",
|
|
433
434
|
matchReferenceWidth: !1,
|
|
434
|
-
items:
|
|
435
|
-
onOpenChange:
|
|
436
|
-
children:
|
|
435
|
+
items: F,
|
|
436
|
+
onOpenChange: ee,
|
|
437
|
+
children: I()
|
|
437
438
|
})
|
|
438
439
|
});
|
|
439
440
|
}), se = _(void 0), ce = v(({ isOpen: e, onClose: t, children: n, title: r, closeLabel: i, backLabel: a, className: o, style: s }) => {
|
|
440
|
-
let [c, l] =
|
|
441
|
+
let [c, l] = w([]);
|
|
441
442
|
x(() => {
|
|
442
443
|
e || l([]);
|
|
443
444
|
}, [e]);
|
|
@@ -447,7 +448,7 @@ var L = {
|
|
|
447
448
|
l((e) => e.slice(0, -1));
|
|
448
449
|
}, []), f = y(() => {
|
|
449
450
|
l([]), t();
|
|
450
|
-
}, [t]), p =
|
|
451
|
+
}, [t]), p = S(() => ({
|
|
451
452
|
push: u,
|
|
452
453
|
pop: d,
|
|
453
454
|
close: f
|
|
@@ -458,7 +459,7 @@ var L = {
|
|
|
458
459
|
]), m = c[c.length - 1];
|
|
459
460
|
return /* @__PURE__ */ E(se.Provider, {
|
|
460
461
|
value: p,
|
|
461
|
-
children: /* @__PURE__ */ E(
|
|
462
|
+
children: /* @__PURE__ */ E(F, {
|
|
462
463
|
isOpen: e,
|
|
463
464
|
onClose: f,
|
|
464
465
|
title: m?.title ?? r,
|
|
@@ -520,7 +521,7 @@ var L = {
|
|
|
520
521
|
return /* @__PURE__ */ D(T, { children: [
|
|
521
522
|
/* @__PURE__ */ D("div", {
|
|
522
523
|
className: "flex h-[56px] items-center gap-3 px-4 py-2",
|
|
523
|
-
children: [/* @__PURE__ */ E(
|
|
524
|
+
children: [/* @__PURE__ */ E(q, {
|
|
524
525
|
profile: e,
|
|
525
526
|
alt: ""
|
|
526
527
|
}), /* @__PURE__ */ E(u, {
|
|
@@ -554,7 +555,7 @@ var L = {
|
|
|
554
555
|
children: [s && a && /* @__PURE__ */ E(Q, {
|
|
555
556
|
label: a,
|
|
556
557
|
textClassName: l,
|
|
557
|
-
icon: /* @__PURE__ */ E(
|
|
558
|
+
icon: /* @__PURE__ */ E(M, {
|
|
558
559
|
size: r,
|
|
559
560
|
stroke: o,
|
|
560
561
|
"aria-hidden": !0
|
|
@@ -565,7 +566,7 @@ var L = {
|
|
|
565
566
|
}), /* @__PURE__ */ E(Q, {
|
|
566
567
|
label: n,
|
|
567
568
|
textClassName: l,
|
|
568
|
-
icon: /* @__PURE__ */ E(
|
|
569
|
+
icon: /* @__PURE__ */ E(ne, {
|
|
569
570
|
size: r,
|
|
570
571
|
stroke: o,
|
|
571
572
|
"aria-hidden": !0
|
|
@@ -598,7 +599,7 @@ var L = {
|
|
|
598
599
|
}), l && /* @__PURE__ */ E(Q, {
|
|
599
600
|
label: n,
|
|
600
601
|
textClassName: f,
|
|
601
|
-
icon: /* @__PURE__ */ E(
|
|
602
|
+
icon: /* @__PURE__ */ E(N, {
|
|
602
603
|
size: r,
|
|
603
604
|
stroke: o,
|
|
604
605
|
"aria-hidden": !0
|
|
@@ -620,7 +621,7 @@ var L = {
|
|
|
620
621
|
})]
|
|
621
622
|
}), d] });
|
|
622
623
|
}), de = v(({ isOpen: n, onClose: r, items: i, onSelectItem: a, labels: o, profile: s, groups: c, onLogout: l, onSettings: u, footer: d, styles: f }) => {
|
|
623
|
-
let { colors: p, typography: m, className: h, cssVars: g } = f ?? {}, _ =
|
|
624
|
+
let { colors: p, typography: m, className: h, cssVars: g } = f ?? {}, _ = S(() => e({
|
|
624
625
|
"--np-sheet-text": p?.text,
|
|
625
626
|
"--np-sheet-item-hover": p?.itemHoverBackground,
|
|
626
627
|
"--np-sheet-item-active": p?.itemActiveBackground,
|
|
@@ -661,4 +662,4 @@ var L = {
|
|
|
661
662
|
});
|
|
662
663
|
});
|
|
663
664
|
//#endregion
|
|
664
|
-
export {
|
|
665
|
+
export { K as AvatarInitials, I as NAVIGATION_PANEL_CLASS, ce as NavigableBottomSheet, ue as NavigationMenuPage, z as NavigationPanel, de as NavigationSheet, U as NavigationSidebar, B as NavigationSidebarVariant, $ as OptionListPage, le as ProfilePage, Q as SheetRow, q as UserAvatar, Y as UserMenu, W as UserMenuTriggerVariant, X 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.3.0-dev.
|
|
4
|
+
"version": "1.3.0-dev.133",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "./index.js",
|
|
@@ -18,11 +18,11 @@
|
|
|
18
18
|
},
|
|
19
19
|
"dependencies": {
|
|
20
20
|
"@tabler/icons-react": "^3.44.0",
|
|
21
|
-
"@epam/ai-dial-conversation-input": "1.3.0-dev.
|
|
21
|
+
"@epam/ai-dial-conversation-input": "1.3.0-dev.133"
|
|
22
22
|
},
|
|
23
23
|
"peerDependencies": {
|
|
24
24
|
"react": "^19.2.8",
|
|
25
|
-
"@epam/ai-dial-chat-shared": "1.3.0-dev.
|
|
25
|
+
"@epam/ai-dial-chat-shared": "1.3.0-dev.133",
|
|
26
26
|
"@epam/ai-dial-ui-kit": "^0.16.0-dev.22"
|
|
27
27
|
},
|
|
28
28
|
"repository": {
|