@homecode/ui 5.7.6 → 5.8.0

package/dist/esm/index.js

@@ -28,6 +28,7 @@ export { LangSelector } from './src/components/LangSelector/LangSelector.js';
 export { Lazy } from './src/components/Lazy/Lazy.js';
 export { LightBox } from './src/components/LightBox/LightBox.js';
 export { Menu } from './src/components/Menu/Menu.js';
+export { NestedMenu, NestedMenuItemRow, NestedMenuLabel } from './src/components/NestedMenu/NestedMenu.js';
 export { Notifications, NotificationsStore } from './src/components/Notifications/Notifications.js';
 export { Paranja } from './src/components/Paranja/Paranja.js';
 export { ANIMATION_DURATION, Popup } from './src/components/Popup/Popup.js';

package/dist/esm/src/components/Autocomplete/Autocomplete.js

@@ -59,6 +59,7 @@ import '../../services/i18n.js';
 import '../Portal/Portal.js';
 import '../Paranja/Paranja.styl.js';
 import '../LightBox/LightBox.styl.js';
+import '../NestedMenu/NestedMenu.js';
 import '../Notifications/store.js';
 import '../Notifications/Notifications.styl.js';
 import '../PopupMenu/PopupMenu.styl.js';

package/dist/esm/src/components/Card/Card.js

@@ -8,8 +8,8 @@ const SCROLL_OFFSET = 300;
 const Card = forwardRef(function Card({ className, paddingSize = 'm', blur = false, ...props }, ref) {
     return (jsx("div", { ref: ref, className: cn(S.root, S[`padding-${paddingSize}`], blur && S.blur, className), ...props }));
 });
-function LinkCard({ className, ...props }) {
-    return (jsx("a", { target: "_blank", rel: "noopener noreferrer", "data-slot": "link-card", className: cn(S.root, className), ...props }));
+function LinkCard({ className, paddingSize = 'm', blur = false, ...props }) {
+    return (jsx("a", { target: "_blank", rel: "noopener noreferrer", "data-slot": "link-card", className: cn(S.root, S[`padding-${paddingSize}`], blur && S.blur, className), ...props }));
 }
 function CardHeader({ className, icon, iconWithBackground = false, textsClassName, title, titleClassName, titleId, description, descriptionClassName, descriptionId, children, ...props }) {
     return (jsxs("div", { "data-slot": "card-header", className: cn(S.header, className), ...props, children: [icon && (jsx("div", { className: cn(S.icon, iconWithBackground && S.withBackground), children: icon })), children, (title || description) && (jsxs("div", { className: cn(S.headerText, textsClassName), children: [title && (jsx(CardTitle, { id: titleId, className: titleClassName, children: title })), description && (jsx(CardDescription, { id: descriptionId, className: descriptionClassName, children: description }))] }))] }));

package/dist/esm/src/components/Card/Card.styl.js

@@ -1,6 +1,6 @@
 import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
 
-var css_248z = ".Card_root__khJ4u{background-color:var(--surface-color);border-radius:var(--border-radius-l);display:flex;flex-direction:column;gap:var(--p-5);max-height:100%;position:relative}.Card_root__khJ4u.Card_blur__VbZXN{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background-color:var(--decent-color-alpha-500)}.Card_root__khJ4u.Card_padding-xs__dd13Q{border-radius:var(--p-3);padding:var(--p-2)}.Card_root__khJ4u.Card_padding-s__S7iiZ{border-radius:var(--p-4);padding:var(--p-3)}.Card_root__khJ4u.Card_padding-m__thC3O{border-radius:var(--p-6);padding:var(--p-5)}.Card_root__khJ4u.Card_padding-l__gtTEF{border-radius:var(--p-8);padding:var(--p-8)}.Card_root__khJ4u.Card_padding-xl__y01o1{border-radius:var(--p-11);padding:var(--p-10)}.Card_header__LDTGV{align-items:flex-start;display:flex;gap:var(--p-5);justify-content:space-between}.Card_header__LDTGV:has([data-slot=card-action]){grid-template-columns:1fr auto}.Card_icon__aRlE5{align-items:center;border-radius:var(--p-2);box-shadow:inset 0 0 0 1px var(--decent-color-alpha-200);display:flex;flex-shrink:0;height:48px;justify-content:center;width:48px}.Card_icon__aRlE5.Card_withBackground__lIrjx{background-color:var(--accent-color-alpha-100);box-shadow:none}.Card_icon__aRlE5>img,.Card_icon__aRlE5>svg{height:20px;width:20px}.Card_headerText__hawuL{flex-grow:1;overflow:hidden}.Card_scroll__uDcXL{max-height:100%;overflow:hidden;padding-right:var(--p-5);width:calc(100% + var(--p-5))}.Card_scroll__uDcXL [data-slot=card-content]{padding-right:1px}.Card_centered__0YX4F,.Card_fullHeight__i3n8e{display:flex;flex-direction:column}.Card_centered__0YX4F{align-items:center;justify-content:center}.Card_fullHeight__i3n8e{flex-grow:1}.Card_description__RTQTR,.Card_title__Z1SQz{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.Card_title__Z1SQz{font-size:120%;font-weight:500;line-height:1}.Card_description__RTQTR{color:var(--accent-color-alpha-500);max-width:100%;word-break:break-word}.Card_action__viIuL{grid-row-span:2;align-self:start;grid-column-start:2;grid-row-start:1;justify-self:end}.Card_footer__T0DXA{align-items:center;display:flex;flex-shrink:0;justify-content:space-between;overflow:hidden}";
+var css_248z = ".Card_root__khJ4u{background-color:var(--surface-color);border-radius:var(--border-radius-l);display:flex;flex-direction:column;gap:var(--p-5);max-height:100%;position:relative}.Card_root__khJ4u.Card_blur__VbZXN{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background-color:var(--decent-color-alpha-500)}.Card_root__khJ4u.Card_padding-xs__dd13Q{border-radius:var(--p-3);padding:var(--p-2)}.Card_root__khJ4u.Card_padding-s__S7iiZ{border-radius:var(--p-4);padding:var(--p-3)}.Card_root__khJ4u.Card_padding-m__thC3O{border-radius:var(--p-6);padding:var(--p-5)}.Card_root__khJ4u.Card_padding-l__gtTEF{border-radius:var(--p-8);padding:var(--p-8)}.Card_root__khJ4u.Card_padding-xl__y01o1{border-radius:var(--p-11);padding:var(--p-10)}.Card_header__LDTGV{align-items:flex-start;display:flex;gap:var(--p-5);justify-content:space-between}.Card_header__LDTGV:has([data-slot=card-action]){grid-template-columns:1fr auto}.Card_icon__aRlE5{align-items:center;border-radius:var(--p-2);box-shadow:inset 0 0 0 1px var(--decent-color-alpha-200);display:flex;flex-shrink:0;height:48px;justify-content:center;width:48px}.Card_icon__aRlE5.Card_withBackground__lIrjx{background-color:var(--accent-color-alpha-100);box-shadow:none}.Card_icon__aRlE5>img,.Card_icon__aRlE5>svg{height:20px;width:20px}.Card_headerText__hawuL{flex-grow:1;overflow:hidden}.Card_scroll__uDcXL{max-height:100%;overflow:hidden;padding-right:var(--p-5);width:calc(100% + var(--p-5))}.Card_scroll__uDcXL [data-slot=card-content]{padding-right:1px}.Card_centered__0YX4F,.Card_fullHeight__i3n8e{display:flex;flex-direction:column}.Card_centered__0YX4F{align-items:center;justify-content:center}.Card_fullHeight__i3n8e{flex-grow:1}.Card_description__RTQTR,.Card_title__Z1SQz{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.Card_title__Z1SQz{font-size:120%;font-weight:500;line-height:1.2}.Card_description__RTQTR{color:var(--accent-color-alpha-500);max-width:100%;word-break:break-word}.Card_action__viIuL{grid-row-span:2;align-self:start;grid-column-start:2;grid-row-start:1;justify-self:end}.Card_footer__T0DXA{align-items:center;display:flex;flex-shrink:0;justify-content:space-between;overflow:hidden}";
 var S = {"root":"Card_root__khJ4u","blur":"Card_blur__VbZXN","padding-xs":"Card_padding-xs__dd13Q","padding-s":"Card_padding-s__S7iiZ","padding-m":"Card_padding-m__thC3O","padding-l":"Card_padding-l__gtTEF","padding-xl":"Card_padding-xl__y01o1","header":"Card_header__LDTGV","icon":"Card_icon__aRlE5","withBackground":"Card_withBackground__lIrjx","headerText":"Card_headerText__hawuL","scroll":"Card_scroll__uDcXL","centered":"Card_centered__0YX4F","fullHeight":"Card_fullHeight__i3n8e","title":"Card_title__Z1SQz","description":"Card_description__RTQTR","action":"Card_action__viIuL","footer":"Card_footer__T0DXA"};
 styleInject(css_248z);
 

package/dist/esm/src/components/Chip/Chip.styl.js

@@ -1,7 +1,7 @@
 import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
 
-var css_248z = ".Chip_chip__DXD0C{align-items:center;background:var(--accent-color-alpha-100);cursor:pointer;display:inline-flex;gap:2px;transition:background .2s ease}.Chip_chip__DXD0C:hover{background:var(--accent-color-alpha-200)}.Chip_size_xs__IbN1f{border-radius:var(--p-1);font-size:14px;padding-left:var(--p-1)}.Chip_size_s__ERE3z{border-radius:var(--p-3);font-size:18px;padding-left:var(--p-3)}.Chip_size_m__F2Bbw{border-radius:var(--p-5);font-size:22px;padding-left:var(--p-5)}.Chip_size_l__YgtcF{border-radius:var(--p-8);font-size:26px;padding-left:var(--p-8)}.Chip_size_xl__-sKg7{border-radius:var(--p-10);font-size:26px;padding-left:var(--p-10)}.Chip_selected__UcBat,.Chip_selected__UcBat:hover{background:var(--accent-color-alpha-300)}.Chip_content__2xloA,.Chip_remove__vqyOL{align-items:center;display:flex}.Chip_remove__vqyOL{justify-content:center;opacity:.3;transform:scale(.6);transition:opacity .2s ease,transform .1s ease}.Chip_remove__vqyOL:hover{background-color:var(--danger-color-alpha-300);transform:scale(.8)}.Chip_remove__vqyOL svg{transform:scale(.8)}.Chip_chip__DXD0C:hover .Chip_remove__vqyOL{opacity:1}";
-var S = {"chip":"Chip_chip__DXD0C","size_xs":"Chip_size_xs__IbN1f","size_s":"Chip_size_s__ERE3z","size_m":"Chip_size_m__F2Bbw","size_l":"Chip_size_l__YgtcF","size_xl":"Chip_size_xl__-sKg7","selected":"Chip_selected__UcBat","content":"Chip_content__2xloA","remove":"Chip_remove__vqyOL"};
+var css_248z = ".Chip_chip__DXD0C{align-items:center;background:var(--accent-color-alpha-100);cursor:pointer;display:inline-flex;gap:2px;transition:background .2s ease}.Chip_chip__DXD0C:hover{background:var(--accent-color-alpha-200)}.Chip_chip__DXD0C:not(:has(.Chip_remove__vqyOL)){padding-right:var(--chip-pad)}.Chip_size_xs__IbN1f{--chip-pad:var(--p-1);border-radius:var(--p-1);font-size:14px;padding-left:var(--chip-pad)}.Chip_size_s__ERE3z{--chip-pad:var(--p-3);border-radius:var(--p-3);font-size:18px;padding-left:var(--chip-pad)}.Chip_size_m__F2Bbw{--chip-pad:var(--p-5);border-radius:var(--p-5);font-size:22px;padding-left:var(--chip-pad)}.Chip_size_l__YgtcF{--chip-pad:var(--p-8);border-radius:var(--p-8)}.Chip_size_l__YgtcF,.Chip_size_xl__-sKg7{font-size:26px;padding-left:var(--chip-pad)}.Chip_size_xl__-sKg7{--chip-pad:var(--p-10);border-radius:var(--p-10)}.Chip_selected__UcBat,.Chip_selected__UcBat:hover{background:var(--accent-color-alpha-300)}.Chip_content__2xloA,.Chip_remove__vqyOL{align-items:center;display:flex}.Chip_remove__vqyOL{justify-content:center;opacity:.3;transform:scale(.6);transition:opacity .2s ease,transform .1s ease}.Chip_remove__vqyOL:hover{background-color:var(--danger-color-alpha-300);transform:scale(.8)}.Chip_remove__vqyOL svg{transform:scale(.8)}.Chip_chip__DXD0C:hover .Chip_remove__vqyOL{opacity:1}";
+var S = {"chip":"Chip_chip__DXD0C","remove":"Chip_remove__vqyOL","size_xs":"Chip_size_xs__IbN1f","size_s":"Chip_size_s__ERE3z","size_m":"Chip_size_m__F2Bbw","size_l":"Chip_size_l__YgtcF","size_xl":"Chip_size_xl__-sKg7","selected":"Chip_selected__UcBat","content":"Chip_content__2xloA"};
 styleInject(css_248z);
 
 export { S as default };

package/dist/esm/src/components/Dialogue/Dialogue.styl.js

@@ -1,7 +1,7 @@
 import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
 
-var css_248z = ".Dialogue_dialogOverlay__jjBIa{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background-color:var(--decent-color-alpha-900);inset:0;opacity:0;position:fixed;transition:opacity .2s ease-out;z-index:50}.Dialogue_dialogOverlay__jjBIa.Dialogue_isOpen__gISMb{animation-duration:.2s;animation-fill-mode:forwards;animation-name:Dialogue_fadeIn__RSEB2;animation-timing-function:ease-out;opacity:1}.Dialogue_dialogContent__-Lxde{border-radius:var(--border-radius-l);box-shadow:0 10px 20px rgba(0,0,0,.3),0 0 0 2px var(--decent-color-alpha-800);display:flex;flex-direction:column;left:50%;max-height:calc(100% - var(--p-5));opacity:0;position:fixed;top:50%;transform:translateX(-50%) translateY(-50%) scale(.95);transition:opacity .2s ease-out,transform .2s ease-out;width:-moz-fit-content;width:fit-content;z-index:50}.Dialogue_dialogContent__-Lxde.Dialogue_isOpen__gISMb{animation-duration:.2s;animation-fill-mode:forwards;animation-name:Dialogue_dialogueIn__M0tLL;animation-timing-function:ease-out;opacity:1;transform:translateX(-50%) translateY(-50%) scale(1)}.Dialogue_dialogContent__-Lxde.Dialogue_isClosed__lHYyZ{animation-duration:.2s;animation-fill-mode:forwards;animation-name:Dialogue_dialogueOut__6bLTY;animation-timing-function:ease-in;opacity:0;pointer-events:none;transform:translateX(-50%) translateY(-50%) scale(.95)}@media (max-width:700px){.Dialogue_dialogContent__-Lxde{max-width:calc(100% - var(--p-5));width:calc(100% - var(--p-5))}}.Dialogue_size-default__X1sdB{max-width:40rem}.Dialogue_size-login__GyixB{max-width:24rem}.Dialogue_size-wide__HQbiX{max-width:calc(100% - var(--p-5))}@media (min-width:700px){.Dialogue_size-wide__HQbiX{max-width:80rem}}.Dialogue_dialogClose__5q12n{align-items:center;background-color:transparent;border:none;border-radius:var(--border-radius-s);box-shadow:inset 0 0 0 2px none;color:var(--accent-color);cursor:pointer;display:flex;height:2rem;justify-content:center;opacity:.7;position:absolute;right:var(--p-3);top:var(--p-3);transform-origin:center;transition:opacity .2s ease,transform .2s ease;width:2rem;z-index:10}.Dialogue_dialogClose__5q12n:hover{opacity:1;transform:scale(1.1)}.Dialogue_dialogClose__5q12n:focus-visible{box-shadow:0 0 0 2px var(--active-color)}.Dialogue_dialogClose__5q12n:disabled{pointer-events:none}.Dialogue_footerAlignLeft__xQUD8{justify-content:flex-start}.Dialogue_footerAlignCenter__yq9Mu{justify-content:center}.Dialogue_footerAlignRight__Yo7hG{justify-content:flex-end}@keyframes Dialogue_fadeIn__RSEB2{0%{opacity:0}to{opacity:1}}@keyframes Dialogue_dialogueIn__M0tLL{0%{opacity:0;transform:translateX(-50%) translateY(-50%) scale(.95)}to{opacity:1;transform:translateX(-50%) translateY(-50%) scale(1)}}@keyframes Dialogue_dialogueOut__6bLTY{0%{opacity:1;transform:translateX(-50%) translateY(-50%) scale(1)}to{opacity:0;transform:translateX(-50%) translateY(-50%) scale(.95)}}";
-var S = {"dialogOverlay":"Dialogue_dialogOverlay__jjBIa","isOpen":"Dialogue_isOpen__gISMb","fadeIn":"Dialogue_fadeIn__RSEB2","dialogContent":"Dialogue_dialogContent__-Lxde","dialogueIn":"Dialogue_dialogueIn__M0tLL","isClosed":"Dialogue_isClosed__lHYyZ","dialogueOut":"Dialogue_dialogueOut__6bLTY","size-default":"Dialogue_size-default__X1sdB","size-login":"Dialogue_size-login__GyixB","size-wide":"Dialogue_size-wide__HQbiX","dialogClose":"Dialogue_dialogClose__5q12n","footerAlignLeft":"Dialogue_footerAlignLeft__xQUD8","footerAlignCenter":"Dialogue_footerAlignCenter__yq9Mu","footerAlignRight":"Dialogue_footerAlignRight__Yo7hG"};
+var css_248z = ".Dialogue_dialogOverlay__jjBIa{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background-color:var(--decent-color-alpha-900);inset:0;opacity:0;position:fixed;transition:opacity .2s ease-out;z-index:50}.Dialogue_dialogOverlay__jjBIa.Dialogue_isOpen__gISMb{animation-duration:.2s;animation-fill-mode:forwards;animation-name:Dialogue_fadeIn__RSEB2;animation-timing-function:ease-out;opacity:1}.Dialogue_dialogContent__-Lxde{border-radius:var(--border-radius-l);box-shadow:0 10px 20px rgba(0,0,0,.3),0 0 0 2px var(--decent-color-alpha-800);display:flex;flex-direction:column;left:50%;max-height:calc(100% - var(--p-5));opacity:0;position:fixed;top:50%;transform:translateX(-50%) translateY(-50%) scale(.95);transition:opacity .2s ease-out,transform .2s ease-out;width:-moz-fit-content;width:fit-content;z-index:50}.Dialogue_dialogContent__-Lxde.Dialogue_isOpen__gISMb{animation-duration:.2s;animation-fill-mode:forwards;animation-name:Dialogue_dialogueIn__M0tLL;animation-timing-function:ease-out;opacity:1;transform:translateX(-50%) translateY(-50%) scale(1)}.Dialogue_dialogContent__-Lxde.Dialogue_isClosed__lHYyZ{animation-duration:.2s;animation-fill-mode:forwards;animation-name:Dialogue_dialogueOut__6bLTY;animation-timing-function:ease-in;opacity:0;pointer-events:none;transform:translateX(-50%) translateY(-50%) scale(.95)}@media (max-width:700px){.Dialogue_dialogContent__-Lxde{max-width:calc(100% - var(--p-5));width:calc(100% - var(--p-5))}}.Dialogue_dialogContent__-Lxde:has(.Dialogue_dialogClose__5q12n) [data-slot=card-header]{padding-right:calc(2rem + var(--p-3))}.Dialogue_size-default__X1sdB{max-width:40rem}.Dialogue_size-login__GyixB{max-width:24rem}.Dialogue_size-wide__HQbiX{max-width:calc(100% - var(--p-5))}@media (min-width:700px){.Dialogue_size-wide__HQbiX{max-width:80rem}}.Dialogue_dialogClose__5q12n{align-items:center;background-color:transparent;border:none;border-radius:var(--border-radius-s);box-shadow:inset 0 0 0 2px none;color:var(--accent-color);cursor:pointer;display:flex;height:2rem;justify-content:center;opacity:.7;position:absolute;right:var(--p-3);top:var(--p-3);transform-origin:center;transition:opacity .2s ease,transform .2s ease;width:2rem;z-index:10}.Dialogue_dialogClose__5q12n:hover{opacity:1;transform:scale(1.1)}.Dialogue_dialogClose__5q12n:focus-visible{box-shadow:0 0 0 2px var(--active-color)}.Dialogue_dialogClose__5q12n:disabled{pointer-events:none}.Dialogue_footerAlignLeft__xQUD8{justify-content:flex-start}.Dialogue_footerAlignCenter__yq9Mu{justify-content:center}.Dialogue_footerAlignRight__Yo7hG{justify-content:flex-end}@keyframes Dialogue_fadeIn__RSEB2{0%{opacity:0}to{opacity:1}}@keyframes Dialogue_dialogueIn__M0tLL{0%{opacity:0;transform:translateX(-50%) translateY(-50%) scale(.95)}to{opacity:1;transform:translateX(-50%) translateY(-50%) scale(1)}}@keyframes Dialogue_dialogueOut__6bLTY{0%{opacity:1;transform:translateX(-50%) translateY(-50%) scale(1)}to{opacity:0;transform:translateX(-50%) translateY(-50%) scale(.95)}}";
+var S = {"dialogOverlay":"Dialogue_dialogOverlay__jjBIa","isOpen":"Dialogue_isOpen__gISMb","fadeIn":"Dialogue_fadeIn__RSEB2","dialogContent":"Dialogue_dialogContent__-Lxde","dialogueIn":"Dialogue_dialogueIn__M0tLL","isClosed":"Dialogue_isClosed__lHYyZ","dialogueOut":"Dialogue_dialogueOut__6bLTY","dialogClose":"Dialogue_dialogClose__5q12n","size-default":"Dialogue_size-default__X1sdB","size-login":"Dialogue_size-login__GyixB","size-wide":"Dialogue_size-wide__HQbiX","footerAlignLeft":"Dialogue_footerAlignLeft__xQUD8","footerAlignCenter":"Dialogue_footerAlignCenter__yq9Mu","footerAlignRight":"Dialogue_footerAlignRight__Yo7hG"};
 styleInject(css_248z);
 
 export { S as default };

package/dist/esm/src/components/Icon/icons/index.js

@@ -54,6 +54,7 @@ export { default as layers } from './layers.svg.js';
 export { default as link } from './link.svg.js';
 export { default as linkedin } from './linkedin.svg.js';
 export { default as loader } from './loader.svg.js';
+export { default as logout } from './logout.svg.js';
 export { default as lock } from './lock.svg.js';
 export { default as lockOpen } from './lockOpen.svg.js';
 export { default as map } from './map.svg.js';

package/dist/esm/src/components/Icon/icons/logout.svg.js

@@ -0,0 +1,15 @@
+import * as React from 'react';
+
+var _path;
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+var SvgLogout = function SvgLogout(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "currentColor",
+    viewBox: "0 0 24 24"
+  }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "m17 7-1.41 1.41L18.17 11H8v2h10.17l-2.58 2.58L17 17l5-5zM4 5h8V3H4c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h8v-2H4V5z"
+  })));
+};
+
+export { SvgLogout as default };

package/dist/esm/src/components/InputFile/InputFile.js

@@ -54,6 +54,7 @@ import '../Heading/Heading.js';
 import '../../services/i18n.js';
 import '../LightBox/LightBox.styl.js';
 import '../Menu/Menu.js';
+import '../NestedMenu/NestedMenu.js';
 import '../Notifications/store.js';
 import '../Notifications/Notifications.styl.js';
 import '../PopupMenu/PopupMenu.styl.js';

package/dist/esm/src/components/NestedMenu/NestedMenu.js

@@ -0,0 +1,118 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import cn from 'classnames';
+import { useRef, useState, useEffect, useLayoutEffect } from 'react';
+import { Icon } from '../Icon/Icon.js';
+import S from './NestedMenu.styl.js';
+
+const MOBILE_MQ = '(max-width: 720px)';
+const HOVER_MQ = '(hover: hover) and (pointer: fine)';
+function useMedia(query) {
+    const [matches, setMatches] = useState(() => typeof window !== 'undefined' && window.matchMedia(query).matches);
+    useEffect(() => {
+        const mq = window.matchMedia(query);
+        const sync = () => setMatches(mq.matches);
+        sync();
+        mq.addEventListener('change', sync);
+        return () => mq.removeEventListener('change', sync);
+    }, [query]);
+    return matches;
+}
+function NestedMenuLabel({ children, className }) {
+    return jsx("span", { className: cn(S.label, className), children: children });
+}
+function NestedMenuItemRow({ children, className, danger, disabled, href, target, rel, onClick, }) {
+    const classes = cn(S.row, danger && S.itemDanger, className);
+    if (href) {
+        return (jsx("a", { className: classes, href: href, target: target, rel: rel, onClick: onClick, children: children }));
+    }
+    return (jsx("button", { type: "button", className: classes, disabled: disabled, onClick: onClick, children: children }));
+}
+function NestedMenuComponent({ trigger, items, open, onOpenChange, align = 'end', className, }) {
+    const rootRef = useRef(null);
+    const [activeId, setActiveId] = useState(null);
+    const [flipLeft, setFlipLeft] = useState(false);
+    const hoverTimer = useRef(0);
+    const stacked = useMedia(MOBILE_MQ);
+    const canHover = useMedia(HOVER_MQ);
+    const active = items.find(item => item.id === activeId);
+    function close() {
+        onOpenChange(false);
+        setActiveId(null);
+    }
+    function openSub(id, announce = false) {
+        setActiveId(id);
+        if (announce) {
+            items.find(item => item.id === id)?.onSubmenuOpen?.();
+        }
+    }
+    useEffect(() => {
+        if (!open) {
+            setActiveId(null);
+            return undefined;
+        }
+        const onKey = (e) => {
+            if (e.key === 'Escape')
+                close();
+        };
+        const onPointer = (e) => {
+            if (!rootRef.current?.contains(e.target))
+                close();
+        };
+        document.addEventListener('keydown', onKey);
+        document.addEventListener('pointerdown', onPointer);
+        return () => {
+            document.removeEventListener('keydown', onKey);
+            document.removeEventListener('pointerdown', onPointer);
+        };
+    }, [open]);
+    useLayoutEffect(() => {
+        if (!open || !rootRef.current)
+            return;
+        const rect = rootRef.current.getBoundingClientRect();
+        setFlipLeft(window.innerWidth - rect.right < 280);
+    }, [open, activeId]);
+    useEffect(() => () => window.clearTimeout(hoverTimer.current), []);
+    function onItemEnter(id) {
+        if (!canHover || stacked)
+            return;
+        window.clearTimeout(hoverTimer.current);
+        const item = items.find(entry => entry.id === id);
+        if (item?.disabled || !item?.submenu) {
+            setActiveId(null);
+            return;
+        }
+        openSub(id, false);
+    }
+    function onItemLeave() {
+        if (!canHover || stacked)
+            return;
+        hoverTimer.current = window.setTimeout(() => setActiveId(null), 160);
+    }
+    function onItemClick(id) {
+        const item = items.find(entry => entry.id === id);
+        if (!item || item.disabled)
+            return;
+        if (item.onClick && !item.submenu) {
+            item.onClick();
+            close();
+            return;
+        }
+        if (activeId === id && !stacked) {
+            setActiveId(null);
+            return;
+        }
+        openSub(id, true);
+    }
+    function renderItems() {
+        return items.map(item => (jsxs("div", { className: S.itemWrap, onMouseEnter: () => onItemEnter(item.id), onMouseLeave: onItemLeave, children: [jsxs("button", { type: "button", className: cn(S.item, activeId === item.id && S.itemActive, item.danger && S.itemDanger, item.disabled && S.itemDisabled, item.className), role: "menuitem", disabled: item.disabled, "aria-haspopup": item.submenu ? 'menu' : undefined, "aria-expanded": item.submenu ? activeId === item.id : undefined, onClick: () => onItemClick(item.id), children: [item.icon && (jsx("span", { className: S.icon, "aria-hidden": true, children: item.icon })), jsx("span", { className: S.label, children: item.label }), item.hint != null && item.hint !== '' && (jsx("span", { className: S.hint, children: item.hint })), item.submenu && (jsx(Icon, { className: S.chevron, type: "chevronRight", size: "xs" }))] }), !stacked && activeId === item.id && item.submenu && (jsx("div", { className: cn(S.submenu, flipLeft && S.submenuLeft), role: "menu", onMouseEnter: () => {
+                        window.clearTimeout(hoverTimer.current);
+                    }, children: item.submenu }))] }, item.id)));
+    }
+    return (jsxs("div", { ref: rootRef, className: cn(S.root, className), children: [jsx("div", { className: S.trigger, onClick: () => onOpenChange(!open), children: trigger }), open && (jsxs("div", { className: cn(S.popup, align === 'end' && S.alignEnd), role: "menu", children: [stacked && active && (jsxs("div", { className: S.stacked, children: [jsxs("button", { type: "button", className: S.back, onClick: () => setActiveId(null), children: [jsx(Icon, { type: "chevronLeft", size: "xs" }), jsx("span", { className: S.label, children: active.label })] }), jsx("div", { className: S.stackedBody, children: active.submenu })] })), (!stacked || !active) && renderItems()] }))] }));
+}
+const NestedMenu = Object.assign(NestedMenuComponent, {
+    Item: NestedMenuItemRow,
+    Label: NestedMenuLabel,
+});
+
+export { NestedMenu, NestedMenuItemRow, NestedMenuLabel };

package/dist/esm/src/components/NestedMenu/NestedMenu.styl.js

@@ -0,0 +1,7 @@
+import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".NestedMenu_root__ybyGA{display:inline-flex;position:relative}.NestedMenu_trigger__zBeNI{display:inline-flex}.NestedMenu_popup__q0uYO{background:var(--decent-color);border:1px solid var(--accent-color-alpha-200);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.45);left:0;max-width:260px;min-width:200px;padding:4px;position:absolute;top:calc(100% + 6px);z-index:20}.NestedMenu_alignEnd__L4AZi{left:auto;right:0}.NestedMenu_itemWrap__Qmc0B{position:relative}.NestedMenu_back__dNsDV,.NestedMenu_item__tgbZm,.NestedMenu_row__48g5c{align-items:center;background:none;border:none;border-radius:6px;color:inherit;cursor:pointer;display:flex;font:inherit;font-size:13px;font-weight:500;gap:8px;letter-spacing:.01em;line-height:1.3;padding:6px 10px;text-align:left;text-decoration:none;width:100%}.NestedMenu_back__dNsDV.NestedMenu_itemActive__RfPZH,.NestedMenu_back__dNsDV:hover,.NestedMenu_item__tgbZm.NestedMenu_itemActive__RfPZH,.NestedMenu_item__tgbZm:hover,.NestedMenu_row__48g5c.NestedMenu_itemActive__RfPZH,.NestedMenu_row__48g5c:hover{background:var(--accent-color-alpha-100)}.NestedMenu_back__dNsDV.NestedMenu_itemDisabled__evVk1,.NestedMenu_back__dNsDV:disabled,.NestedMenu_item__tgbZm.NestedMenu_itemDisabled__evVk1,.NestedMenu_item__tgbZm:disabled,.NestedMenu_row__48g5c.NestedMenu_itemDisabled__evVk1,.NestedMenu_row__48g5c:disabled{cursor:default;opacity:.55;pointer-events:none}.NestedMenu_itemDanger__oAJbP{color:var(--active-color)}.NestedMenu_itemDanger__oAJbP .NestedMenu_icon__4g2Yp{color:inherit;opacity:1}.NestedMenu_icon__4g2Yp{display:inline-flex;flex-shrink:0;opacity:.55}.NestedMenu_icon__4g2Yp svg{display:block}.NestedMenu_label__Jnm6l{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.NestedMenu_hint__hotNP{flex-shrink:0;font-weight:400;opacity:.5}.NestedMenu_chevron__8i-Po{flex-shrink:0;opacity:.45}.NestedMenu_row__48g5c svg{color:var(--active-color);flex-shrink:0}.NestedMenu_submenu__Tx1Ll{background:var(--decent-color);border:1px solid var(--accent-color-alpha-200);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.45);left:calc(100% + 6px);max-height:min(360px,calc(100vh - 24px));max-width:280px;min-width:220px;overflow-x:hidden;overflow-y:auto;padding:4px;position:absolute;top:-4px;z-index:21}.NestedMenu_submenu__Tx1Ll:before{bottom:0;content:\"\";left:-6px;position:absolute;top:0;width:6px}.NestedMenu_submenuLeft__y18Nb{left:auto;right:calc(100% + 6px)}.NestedMenu_submenuLeft__y18Nb:before{left:auto;right:-6px}.NestedMenu_stacked__rMiOi{display:flex;flex-direction:column;max-height:min(360px,calc(100vh - 24px));overflow-y:auto}.NestedMenu_back__dNsDV{font-weight:650;margin-bottom:2px}.NestedMenu_stackedBody__Fbkma{min-width:0}";
+var S = {"root":"NestedMenu_root__ybyGA","trigger":"NestedMenu_trigger__zBeNI","popup":"NestedMenu_popup__q0uYO","alignEnd":"NestedMenu_alignEnd__L4AZi","itemWrap":"NestedMenu_itemWrap__Qmc0B","item":"NestedMenu_item__tgbZm","row":"NestedMenu_row__48g5c","back":"NestedMenu_back__dNsDV","itemActive":"NestedMenu_itemActive__RfPZH","itemDisabled":"NestedMenu_itemDisabled__evVk1","itemDanger":"NestedMenu_itemDanger__oAJbP","icon":"NestedMenu_icon__4g2Yp","label":"NestedMenu_label__Jnm6l","hint":"NestedMenu_hint__hotNP","chevron":"NestedMenu_chevron__8i-Po","submenu":"NestedMenu_submenu__Tx1Ll","submenuLeft":"NestedMenu_submenuLeft__y18Nb","stacked":"NestedMenu_stacked__rMiOi","stackedBody":"NestedMenu_stackedBody__Fbkma"};
+styleInject(css_248z);
+
+export { S as default };

package/dist/esm/src/tiptap/slash-mention/SlashSuggestionList.js

@@ -1,5 +1,6 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useState, useEffect, useCallback, useImperativeHandle } from 'react';
+import { Icon } from '../../components/Icon/Icon.js';
 import { Menu } from '../../components/Menu/Menu.js';
 import S from './SlashSuggestionList.styl.js';
 import cn from 'classnames';
@@ -47,7 +48,7 @@ function SlashSuggestionListInner({ items, command, listHandleRef, }) {
     useImperativeHandle(listHandleRef, () => ({ onKeyboardEvent }), [
         onKeyboardEvent,
     ]);
-    return (jsx("div", { className: S.root, children: jsx(Menu, { className: S.menu, role: "listbox", "aria-label": "Slash commands", children: items.map((item, idx) => (jsxs(Menu.Item, { role: "option", "aria-selected": idx === safeSel, className: cn(S.item, idx === safeSel && S.itemHighlighted, item.className), onMouseDown: e => e.preventDefault(), onMouseEnter: () => setSelected(idx), onClick: () => onPick(idx), textOverflow: true, children: [jsx("span", { className: S.itemLabel, children: item.label }), item.description ? (jsx("span", { className: S.itemDesc, children: item.description })) : null] }, `${item.id}-${idx}`))) }) }));
+    return (jsx("div", { className: S.root, children: jsx(Menu, { className: S.menu, role: "listbox", "aria-label": "Slash commands", children: items.map((item, idx) => (jsxs(Menu.Item, { role: "option", "aria-selected": idx === safeSel, className: cn(S.item, idx === safeSel && S.itemHighlighted, item.className), onMouseDown: e => e.preventDefault(), onMouseEnter: () => setSelected(idx), onClick: () => onPick(idx), textOverflow: true, children: [item.icon && (jsx(Icon, { type: item.icon, size: "s", className: S.itemIcon })), jsxs("span", { className: S.itemText, children: [jsx("span", { className: S.itemLabel, children: item.label }), item.description && (jsx("span", { className: S.itemDesc, children: item.description }))] })] }, `${item.id}-${idx}`))) }) }));
 }
 function SlashSuggestionList(props) {
     if (props.items.length === 0)

package/dist/esm/src/tiptap/slash-mention/SlashSuggestionList.styl.js

@@ -1,7 +1,7 @@
 import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
 
-var css_248z = ".SlashSuggestionList_root__9KCb1{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:var(--decent-color-alpha-700);border-radius:8px;border-radius:var(--radius-lg,8px);box-shadow:inset 0 0 0 1px var(--accent-color-alpha-50),0 8px 24px rgba(0,0,0,.2);color:var(--foreground);max-width:90vw;min-width:220px;overflow:hidden;position:relative}.SlashSuggestionList_root__9KCb1:before{background-color:var(--accent-color-alpha-50);bottom:0;content:\"\";left:0;pointer-events:none;position:absolute;right:0;top:0}.dark .SlashSuggestionList_root__9KCb1{box-shadow:inset 0 0 0 1px var(--accent-color-alpha-50),0 8px 24px rgba(0,0,0,.5)}.SlashSuggestionList_menu__s-jK3{margin:0;max-height:40vh}.SlashSuggestionList_item__9JBeY{align-items:flex-start;border-radius:var(--p-2);display:flex;flex-direction:column;height:auto!important;justify-content:center;min-height:0;overflow:visible!important;padding:var(--p-1) var(--p-2)!important;position:relative;text-overflow:clip!important;white-space:normal!important;width:100%}.SlashSuggestionList_item__9JBeY:hover{background-color:var(--accent-color-alpha-50)}.SlashSuggestionList_itemHighlighted__cStZr,.SlashSuggestionList_item__9JBeY:hover{box-shadow:inset 100vw 0 0 0 var(--accent-color-alpha-200)}.SlashSuggestionList_itemLabel__OMaov{font-weight:600}.SlashSuggestionList_itemDesc__fAdcA{color:var(--accent-color-alpha-600);font-size:80%;white-space:normal}.SlashSuggestionList_mention__aT45p{align-items:center;background:var(--muted);border-radius:var(--p-1);display:inline-flex;line-height:1.4;margin:0 var(--p-1);padding:0 var(--p-1);-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:baseline;white-space:nowrap}";
-var S = {"root":"SlashSuggestionList_root__9KCb1","menu":"SlashSuggestionList_menu__s-jK3","item":"SlashSuggestionList_item__9JBeY","itemHighlighted":"SlashSuggestionList_itemHighlighted__cStZr","itemLabel":"SlashSuggestionList_itemLabel__OMaov","itemDesc":"SlashSuggestionList_itemDesc__fAdcA","mention":"SlashSuggestionList_mention__aT45p"};
+var css_248z = ".SlashSuggestionList_root__9KCb1{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:var(--decent-color-alpha-700);border-radius:8px;border-radius:var(--radius-lg,8px);box-shadow:inset 0 0 0 1px var(--accent-color-alpha-50),0 8px 24px rgba(0,0,0,.2);color:var(--foreground);max-width:90vw;min-width:220px;overflow:hidden;position:relative}.SlashSuggestionList_root__9KCb1:before{background-color:var(--accent-color-alpha-50);bottom:0;content:\"\";left:0;pointer-events:none;position:absolute;right:0;top:0}.dark .SlashSuggestionList_root__9KCb1{box-shadow:inset 0 0 0 1px var(--accent-color-alpha-50),0 8px 24px rgba(0,0,0,.5)}.SlashSuggestionList_menu__s-jK3{margin:0;max-height:40vh}.SlashSuggestionList_item__9JBeY{align-items:center;border-radius:var(--p-2);display:flex;flex-direction:row;gap:var(--p-2);height:auto!important;justify-content:flex-start;min-height:0;overflow:visible!important;padding:var(--p-1) var(--p-2)!important;position:relative;text-overflow:clip!important;white-space:normal!important;width:100%}.SlashSuggestionList_itemHighlighted__cStZr{box-shadow:inset 100vw 0 0 0 var(--accent-color-alpha-200)}.SlashSuggestionList_itemIcon__hTtxe{color:var(--accent-color-alpha-800);flex-shrink:0}.SlashSuggestionList_itemText__uwNbZ{align-items:flex-start;display:flex;flex-direction:column;min-width:0}.SlashSuggestionList_itemLabel__OMaov{font-weight:600}.SlashSuggestionList_itemDesc__fAdcA{color:var(--accent-color-alpha-600);font-size:80%;white-space:normal}.SlashSuggestionList_mention__aT45p{align-items:center;background:var(--muted);border-radius:var(--p-1);display:inline-flex;line-height:1.4;margin:0 var(--p-1);padding:0 var(--p-1);transition:background-color .1s ease-in-out;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:baseline;white-space:nowrap}.SlashSuggestionList_mention__aT45p:hover{background-color:var(--accent-color-alpha-200)}";
+var S = {"root":"SlashSuggestionList_root__9KCb1","menu":"SlashSuggestionList_menu__s-jK3","item":"SlashSuggestionList_item__9JBeY","itemHighlighted":"SlashSuggestionList_itemHighlighted__cStZr","itemIcon":"SlashSuggestionList_itemIcon__hTtxe","itemText":"SlashSuggestionList_itemText__uwNbZ","itemLabel":"SlashSuggestionList_itemLabel__OMaov","itemDesc":"SlashSuggestionList_itemDesc__fAdcA","mention":"SlashSuggestionList_mention__aT45p"};
 styleInject(css_248z);
 
 export { S as default };

package/dist/esm/types/src/components/Card/Card.d.ts

@@ -3,7 +3,7 @@ declare const Card: import("react").ForwardRefExoticComponent<Omit<import("react
     paddingSize?: "s" | "xs" | "m" | "l" | "xl";
     blur?: boolean;
 } & import("react").RefAttributes<HTMLDivElement>>;
-declare function LinkCard({ className, ...props }: LinkCardProps): import("react").JSX.Element;
+declare function LinkCard({ className, paddingSize, blur, ...props }: LinkCardProps): import("react").JSX.Element;
 declare function CardHeader({ className, icon, iconWithBackground, textsClassName, title, titleClassName, titleId, description, descriptionClassName, descriptionId, children, ...props }: CardHeaderProps): import("react").JSX.Element;
 declare function CardTitle({ className, ...props }: CardTitleProps): import("react").JSX.Element;
 declare function CardDescription({ className, ...props }: CardDescriptionProps): import("react").JSX.Element;

package/dist/esm/types/src/components/Icon/icons/index.d.ts

@@ -54,6 +54,7 @@ export { default as layers } from './layers.svg';
 export { default as link } from './link.svg';
 export { default as linkedin } from './linkedin.svg';
 export { default as loader } from './loader.svg';
+export { default as logout } from './logout.svg';
 export { default as lock } from './lock.svg';
 export { default as lockOpen } from './lockOpen.svg';
 export { default as map } from './map.svg';

package/dist/esm/types/src/components/NestedMenu/NestedMenu.d.ts

@@ -0,0 +1,9 @@
+import * as T from './NestedMenu.types';
+export type { NestedMenuItem, Props as NestedMenuProps, } from './NestedMenu.types';
+export declare function NestedMenuLabel({ children, className }: T.NestedMenuLabelProps): import("react").JSX.Element;
+export declare function NestedMenuItemRow({ children, className, danger, disabled, href, target, rel, onClick, }: T.NestedMenuRowProps): import("react").JSX.Element;
+declare function NestedMenuComponent({ trigger, items, open, onOpenChange, align, className, }: T.Props): import("react").JSX.Element;
+export declare const NestedMenu: typeof NestedMenuComponent & {
+    Item: typeof NestedMenuItemRow;
+    Label: typeof NestedMenuLabel;
+};

package/dist/esm/types/src/components/NestedMenu/NestedMenu.types.d.ts

@@ -0,0 +1,35 @@
+import { ReactNode } from 'react';
+export type NestedMenuItem = {
+    id: string;
+    label: ReactNode;
+    icon?: ReactNode;
+    hint?: ReactNode;
+    submenu?: ReactNode;
+    onSubmenuOpen?: () => void;
+    onClick?: () => void;
+    danger?: boolean;
+    disabled?: boolean;
+    className?: string;
+};
+export type Props = {
+    trigger: ReactNode;
+    items: NestedMenuItem[];
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    align?: 'start' | 'end';
+    className?: string;
+};
+export type NestedMenuRowProps = {
+    children: ReactNode;
+    className?: string;
+    danger?: boolean;
+    disabled?: boolean;
+    href?: string;
+    target?: string;
+    rel?: string;
+    onClick?: () => void;
+};
+export type NestedMenuLabelProps = {
+    children: ReactNode;
+    className?: string;
+};

package/dist/esm/types/src/components/index.d.ts

@@ -28,6 +28,7 @@ export * from './LangSelector/LangSelector';
 export * from './Lazy/Lazy';
 export * from './LightBox/LightBox';
 export * from './Menu/Menu';
+export * from './NestedMenu/NestedMenu';
 export * from './Notifications/Notifications';
 export * from './Paranja/Paranja';
 export * from './Popup/Popup';

package/dist/esm/types/src/tiptap/slash-mention/types.d.ts

@@ -1,8 +1,11 @@
 import type { Editor, Range } from '@tiptap/core';
+import type { IconType } from '../../components/Icon/Icon.types';
 export type SlashCommandItem = {
     id: string;
     label: string;
     description?: string;
+    /** Left icon in the slash suggestion list (`<Icon type={icon} />`). */
+    icon?: IconType;
     /** Extra class on inserted mention chip (merged with `slash-mention`). */
     className?: string;
     /** CSS color for chip text; background uses 30% color blend. */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homecode/ui",
-  "version": "5.7.6",
+  "version": "5.8.0",
   "description": "React UI components library",
   "scripts": {
     "tests": "jest",