@homecode/ui 5.16.1 → 5.17.0
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/dist/esm/index.js +0 -1
- package/dist/esm/src/components/Autocomplete/Autocomplete.js +0 -1
- package/dist/esm/src/components/InputFile/InputFile.js +0 -1
- package/dist/esm/src/components/NestedMenu/NestedMenu.js +20 -6
- package/dist/esm/src/components/NestedMenu/NestedMenu.styl.js +2 -2
- package/dist/esm/src/components/Popup/Popup.styl.js +1 -1
- package/dist/esm/src/components/ThinkingOutline/ThinkingOutline.js +2 -2
- package/dist/esm/src/components/ThinkingOutline/ThinkingOutline.styl.js +1 -1
- package/dist/esm/types/src/components/Input/Input.d.ts +1 -1
- package/dist/esm/types/src/components/NestedMenu/NestedMenu.d.ts +1 -1
- package/dist/esm/types/src/components/NestedMenu/NestedMenu.types.d.ts +2 -1
- package/dist/esm/types/src/components/Select/Select.d.ts +1 -1
- package/dist/esm/types/src/components/ThinkingOutline/ThinkingOutline.d.ts +1 -1
- package/dist/esm/types/src/components/index.d.ts +0 -1
- package/package.json +1 -1
- package/dist/esm/src/components/PopupMenu/PopupMenu.js +0 -15
- package/dist/esm/src/components/PopupMenu/PopupMenu.styl.js +0 -7
- package/dist/esm/types/src/components/PopupMenu/PopupMenu.d.ts +0 -2
- package/dist/esm/types/src/components/PopupMenu/PopupMenu.types.d.ts +0 -13
package/dist/esm/index.js
CHANGED
|
@@ -42,7 +42,6 @@ export { Nudge, NudgeError, NudgeText } from './src/components/Nudge/Nudge.js';
|
|
|
42
42
|
export { Paranja } from './src/components/Paranja/Paranja.js';
|
|
43
43
|
export { ANIMATION_DURATION, Popup } from './src/components/Popup/Popup.js';
|
|
44
44
|
export { Portal } from './src/components/Portal/Portal.js';
|
|
45
|
-
export { PopupMenu } from './src/components/PopupMenu/PopupMenu.js';
|
|
46
45
|
export { Progress } from './src/components/Progress/Progress.js';
|
|
47
46
|
export { ProgressCircular } from './src/components/ProgressCircular/ProgressCircular.js';
|
|
48
47
|
export { PromptComposer } from './src/components/PromptComposer/PromptComposer.js';
|
|
@@ -75,7 +75,6 @@ import '../NestedMenu/NestedMenu.js';
|
|
|
75
75
|
import '../Notifications/store.js';
|
|
76
76
|
import '../Notifications/Notifications.styl.js';
|
|
77
77
|
import '../Nudge/Nudge.styl.js';
|
|
78
|
-
import '../PopupMenu/PopupMenu.styl.js';
|
|
79
78
|
import '../Progress/Progress.styl.js';
|
|
80
79
|
import '@tiptap/extensions';
|
|
81
80
|
import '@tiptap/starter-kit';
|
|
@@ -70,7 +70,6 @@ import '../NestedMenu/NestedMenu.js';
|
|
|
70
70
|
import '../Notifications/store.js';
|
|
71
71
|
import '../Notifications/Notifications.styl.js';
|
|
72
72
|
import '../Nudge/Nudge.styl.js';
|
|
73
|
-
import '../PopupMenu/PopupMenu.styl.js';
|
|
74
73
|
import '../Progress/Progress.styl.js';
|
|
75
74
|
import '@tiptap/extensions';
|
|
76
75
|
import '@tiptap/react';
|
|
@@ -29,7 +29,7 @@ function NestedMenuItemRow({ children, className, danger, disabled, href, target
|
|
|
29
29
|
}
|
|
30
30
|
return (jsx("button", { type: "button", className: classes, disabled: disabled, onClick: onClick, children: children }));
|
|
31
31
|
}
|
|
32
|
-
function NestedMenuComponent({ trigger, items, open, onOpenChange, align = 'end', size = 'm', className, popupProps, }) {
|
|
32
|
+
function NestedMenuComponent({ trigger, items, open, onOpenChange, align = 'end', size = 'm', className, popupProps, onItemClick, }) {
|
|
33
33
|
const [activeId, setActiveId] = useState(null);
|
|
34
34
|
const stacked = useMedia(MOBILE_MQ);
|
|
35
35
|
const canHover = useMedia(HOVER_MQ);
|
|
@@ -58,7 +58,8 @@ function NestedMenuComponent({ trigger, items, open, onOpenChange, align = 'end'
|
|
|
58
58
|
document.addEventListener('keydown', onKey);
|
|
59
59
|
return () => document.removeEventListener('keydown', onKey);
|
|
60
60
|
}, [open]);
|
|
61
|
-
function
|
|
61
|
+
function handleItemClick(id, e) {
|
|
62
|
+
onItemClick?.(id);
|
|
62
63
|
const item = items.find(entry => entry.id === id);
|
|
63
64
|
if (!item || item.disabled)
|
|
64
65
|
return;
|
|
@@ -68,8 +69,11 @@ function NestedMenuComponent({ trigger, items, open, onOpenChange, align = 'end'
|
|
|
68
69
|
close();
|
|
69
70
|
return;
|
|
70
71
|
}
|
|
71
|
-
if (!item.submenu)
|
|
72
|
+
if (!item.submenu) {
|
|
73
|
+
if (item.closeOnClick !== false)
|
|
74
|
+
close();
|
|
72
75
|
return;
|
|
76
|
+
}
|
|
73
77
|
if (activeId === id && !stacked && !canHover) {
|
|
74
78
|
setActiveId(null);
|
|
75
79
|
return;
|
|
@@ -77,10 +81,17 @@ function NestedMenuComponent({ trigger, items, open, onOpenChange, align = 'end'
|
|
|
77
81
|
openSub(id, true);
|
|
78
82
|
}
|
|
79
83
|
function renderItemButton(item) {
|
|
80
|
-
return (jsxs("button", { type: "button", className: cn(S.item, activeId === item.id && S.itemActive, item.danger && S.itemDanger, item.disabled && S.itemDisabled, item.wrap && S.
|
|
84
|
+
return (jsxs("button", { type: "button", className: cn(S.item, activeId === item.id && S.itemActive, item.danger && S.itemDanger, item.disabled && S.itemDisabled, item.wrap && S.wrap, item.className), role: "menuitem", disabled: item.disabled, "aria-haspopup": item.submenu ? 'menu' : undefined, "aria-expanded": item.submenu ? activeId === item.id : undefined, onPointerDown: e => {
|
|
81
85
|
// Keep focus off underlying inputs (e.g. ChatSelector search).
|
|
82
86
|
e.preventDefault();
|
|
83
|
-
|
|
87
|
+
if (e.button === 0)
|
|
88
|
+
handleItemClick(item.id, e);
|
|
89
|
+
}, onKeyDown: e => {
|
|
90
|
+
if (e.key !== 'Enter' && e.key !== ' ')
|
|
91
|
+
return;
|
|
92
|
+
e.preventDefault();
|
|
93
|
+
handleItemClick(item.id, e);
|
|
94
|
+
}, children: [item.icon && (jsx("span", { className: S.icon, "aria-hidden": true, children: item.icon })), item.hint != null && item.hint !== '' ? (jsxs("span", { className: S.text, children: [jsx("span", { className: S.label, children: item.label }), jsx("span", { className: S.hint, children: item.hint })] })) : (jsx("span", { className: S.label, children: item.label })), item.submenu && (jsx(Icon, { className: S.chevron, type: "chevronRight", size: iconSize }))] }));
|
|
84
95
|
}
|
|
85
96
|
function renderItems() {
|
|
86
97
|
return items.map(item => {
|
|
@@ -101,10 +112,13 @@ function NestedMenuComponent({ trigger, items, open, onOpenChange, align = 'end'
|
|
|
101
112
|
}, children: renderItemButton(item) }, item.id));
|
|
102
113
|
});
|
|
103
114
|
}
|
|
115
|
+
if (items.length === 0)
|
|
116
|
+
return null;
|
|
104
117
|
return (jsx(Popup, { ...popupProps, className: cn(S.root, className, popupProps?.className), size: size, isOpen: open, onOpen: () => onOpenChange(true), onClose: () => {
|
|
105
118
|
onOpenChange(false);
|
|
106
119
|
setActiveId(null);
|
|
107
|
-
}, direction:
|
|
120
|
+
}, direction: popupProps?.direction ??
|
|
121
|
+
(align === 'end' ? 'bottom-left' : 'bottom-right'), trigger: trigger, triggerProps: {
|
|
108
122
|
...popupProps?.triggerProps,
|
|
109
123
|
className: cn(S.trigger, popupProps?.triggerProps?.className),
|
|
110
124
|
onClick: () => onOpenChange(!open),
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = ".NestedMenu_root__ybyGA,.NestedMenu_trigger__zBeNI{display:inline-flex}.NestedMenu_content__OyLXN{box-sizing:border-box;max-width:min(100vw - 16px,360px);min-width:0;padding:4px;width:-moz-fit-content;width:fit-content}.NestedMenu_list__Q55Aa{display:flex;flex-direction:column;gap:1px}.NestedMenu_itemPopup__kMaxU{display:block;width:100%}.NestedMenu_itemTrigger__a7XHw{cursor:inherit;display:block;width:100%}.NestedMenu_itemWrap__Qmc0B{position:relative}.NestedMenu_back__dNsDV,.NestedMenu_item__tgbZm,.NestedMenu_row__48g5c{align-items:center;background:none;border:none;color:inherit;cursor:pointer;display:flex;font:inherit;font-weight:500;gap:8px;letter-spacing:.01em;line-height:1.3;text-align:left;text-decoration:none;width:100%}.NestedMenu_back__dNsDV:hover,.NestedMenu_item__tgbZm:hover,.NestedMenu_row__48g5c:hover{background:var(--accent-color-alpha-50)}.NestedMenu_back__dNsDV.NestedMenu_itemActive__RfPZH,.NestedMenu_item__tgbZm.NestedMenu_itemActive__RfPZH,.NestedMenu_row__48g5c.NestedMenu_itemActive__RfPZH{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}.
|
|
4
|
-
var S = {"root":"NestedMenu_root__ybyGA","trigger":"NestedMenu_trigger__zBeNI","content":"NestedMenu_content__OyLXN","list":"NestedMenu_list__Q55Aa","itemPopup":"NestedMenu_itemPopup__kMaxU","itemTrigger":"NestedMenu_itemTrigger__a7XHw","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","
|
|
3
|
+
var css_248z = ".NestedMenu_root__ybyGA,.NestedMenu_trigger__zBeNI{display:inline-flex}.NestedMenu_content__OyLXN{box-sizing:border-box;max-width:min(100vw - 16px,360px);min-width:0;padding:4px;width:-moz-fit-content;width:fit-content}.NestedMenu_list__Q55Aa{display:flex;flex-direction:column;gap:1px}.NestedMenu_itemPopup__kMaxU{display:block;width:100%}.NestedMenu_itemTrigger__a7XHw{cursor:inherit;display:block;width:100%}.NestedMenu_itemWrap__Qmc0B{position:relative}.NestedMenu_back__dNsDV,.NestedMenu_item__tgbZm,.NestedMenu_row__48g5c{align-items:center;background:none;border:none;color:inherit;cursor:pointer;display:flex;font:inherit;font-weight:500;gap:8px;letter-spacing:.01em;line-height:1.3;text-align:left;text-decoration:none;width:100%}.NestedMenu_back__dNsDV:hover,.NestedMenu_item__tgbZm:hover,.NestedMenu_row__48g5c:hover{background:var(--accent-color-alpha-50)}.NestedMenu_back__dNsDV.NestedMenu_itemActive__RfPZH,.NestedMenu_item__tgbZm.NestedMenu_itemActive__RfPZH,.NestedMenu_row__48g5c.NestedMenu_itemActive__RfPZH{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_text__0iCNy{display:flex;flex:1 1 auto;flex-direction:column;gap:0;justify-content:center;min-width:-moz-min-content;min-width:min-content}.NestedMenu_text__0iCNy .NestedMenu_label__Jnm6l{flex:none}.NestedMenu_hint__hotNP{flex-shrink:0;font-weight:400;line-height:1.2;margin:0;opacity:.5;white-space:nowrap}.NestedMenu_label__Jnm6l{flex:1;line-height:1.2;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.NestedMenu_wrap__3b6E1 .NestedMenu_text__0iCNy{min-width:0}.NestedMenu_wrap__3b6E1 .NestedMenu_label__Jnm6l{overflow:visible;text-overflow:clip;white-space:normal}.NestedMenu_wrap__3b6E1 .NestedMenu_hint__hotNP{min-width:0;white-space:normal}.NestedMenu_chevron__8i-Po{flex-shrink:0;opacity:.45}.NestedMenu_row__48g5c svg{color:var(--active-color);flex-shrink:0}.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}.NestedMenu_size-s__2n2te .NestedMenu_back__dNsDV,.NestedMenu_size-s__2n2te .NestedMenu_item__tgbZm,.NestedMenu_size-s__2n2te .NestedMenu_row__48g5c,.NestedMenu_size-xs__yUJ0q .NestedMenu_back__dNsDV,.NestedMenu_size-xs__yUJ0q .NestedMenu_item__tgbZm,.NestedMenu_size-xs__yUJ0q .NestedMenu_row__48g5c{border-radius:6px;font-size:12px;gap:6px;padding:4px 8px}.NestedMenu_size-s__2n2te.NestedMenu_content__OyLXN,.NestedMenu_size-xs__yUJ0q.NestedMenu_content__OyLXN{padding:3px}.NestedMenu_size-s__2n2te .NestedMenu_back__dNsDV svg,.NestedMenu_size-s__2n2te .NestedMenu_chevron__8i-Po,.NestedMenu_size-s__2n2te .NestedMenu_icon__4g2Yp svg,.NestedMenu_size-s__2n2te .NestedMenu_row__48g5c svg,.NestedMenu_size-xs__yUJ0q .NestedMenu_back__dNsDV svg,.NestedMenu_size-xs__yUJ0q .NestedMenu_chevron__8i-Po,.NestedMenu_size-xs__yUJ0q .NestedMenu_icon__4g2Yp svg,.NestedMenu_size-xs__yUJ0q .NestedMenu_row__48g5c svg{height:10px;width:10px}.NestedMenu_size-m__B8zm5 .NestedMenu_back__dNsDV,.NestedMenu_size-m__B8zm5 .NestedMenu_item__tgbZm,.NestedMenu_size-m__B8zm5 .NestedMenu_row__48g5c{border-radius:9px;font-size:13px;padding:6px 10px}.NestedMenu_size-l__1FrvQ .NestedMenu_back__dNsDV,.NestedMenu_size-l__1FrvQ .NestedMenu_item__tgbZm,.NestedMenu_size-l__1FrvQ .NestedMenu_row__48g5c{border-radius:12px;font-size:16px;gap:10px;padding:10px 14px}.NestedMenu_size-l__1FrvQ.NestedMenu_content__OyLXN{max-width:320px;padding:6px}.NestedMenu_size-l__1FrvQ .NestedMenu_back__dNsDV svg,.NestedMenu_size-l__1FrvQ .NestedMenu_chevron__8i-Po,.NestedMenu_size-l__1FrvQ .NestedMenu_icon__4g2Yp svg,.NestedMenu_size-l__1FrvQ .NestedMenu_row__48g5c svg{height:18px;width:18px}.NestedMenu_size-xl__jiXmT .NestedMenu_back__dNsDV,.NestedMenu_size-xl__jiXmT .NestedMenu_item__tgbZm,.NestedMenu_size-xl__jiXmT .NestedMenu_row__48g5c{border-radius:15px;font-size:18px;gap:12px;padding:12px 16px}.NestedMenu_size-xl__jiXmT.NestedMenu_content__OyLXN{max-width:360px;padding:8px}.NestedMenu_size-xl__jiXmT .NestedMenu_back__dNsDV svg,.NestedMenu_size-xl__jiXmT .NestedMenu_chevron__8i-Po,.NestedMenu_size-xl__jiXmT .NestedMenu_icon__4g2Yp svg,.NestedMenu_size-xl__jiXmT .NestedMenu_row__48g5c svg{height:22px;width:22px}";
|
|
4
|
+
var S = {"root":"NestedMenu_root__ybyGA","trigger":"NestedMenu_trigger__zBeNI","content":"NestedMenu_content__OyLXN","list":"NestedMenu_list__Q55Aa","itemPopup":"NestedMenu_itemPopup__kMaxU","itemTrigger":"NestedMenu_itemTrigger__a7XHw","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","text":"NestedMenu_text__0iCNy","label":"NestedMenu_label__Jnm6l","hint":"NestedMenu_hint__hotNP","wrap":"NestedMenu_wrap__3b6E1","chevron":"NestedMenu_chevron__8i-Po","stacked":"NestedMenu_stacked__rMiOi","stackedBody":"NestedMenu_stackedBody__Fbkma","size-xs":"NestedMenu_size-xs__yUJ0q","size-s":"NestedMenu_size-s__2n2te","size-m":"NestedMenu_size-m__B8zm5","size-l":"NestedMenu_size-l__1FrvQ","size-xl":"NestedMenu_size-xl__jiXmT"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { S as default };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = ".Popup_root__uQ-fP{display:inline-block;position:relative}.Popup_contentWrapper__2yi-2{opacity:0;pointer-events:none;position:absolute}.Popup_contentWrapper__2yi-2.Popup_animating__kR0qF{transition:opacity .1s ease-out}.Popup_contentWrapper__2yi-2.Popup_isOpen__BRIdP{opacity:1;z-index:11}.Popup_contentWrapper__2yi-2.Popup_inline__1-l1S.Popup_isOpen__BRIdP{position:relative}.Popup_contentWrapper__2yi-2:not(.Popup_inline__1-l1S),.Popup_contentWrapper__2yi-2:not(.Popup_inline__1-l1S)>.Popup_content__e8Qyu{position:absolute}.Popup_trigger__jQNaQ{cursor:pointer}.Popup_trigger__jQNaQ.Popup_isOpen__BRIdP{position:relative;z-index:11}.Popup_trigger__jQNaQ.Popup_disabled__DlE9y{opacity:.4;pointer-events:none}.Popup_content__e8Qyu{-webkit-backface-visibility:hidden;backface-visibility:hidden;background-color:var(--decent-color);box-shadow:inset 0 0 0 1px var(--accent-color-alpha-50);box-sizing:border-box;max-width:min(min(560px,70vw),calc(100svw - 16px));min-width:100%;overflow:hidden;position:relative;transform-origin:top center;z-index:11}.Popup_content__e8Qyu:before{background-color:var(--accent-color-alpha-50);bottom:0;content:\"\";left:0;pointer-events:none;position:absolute;right:0;top:0}.Popup_content__e8Qyu.Popup_blur__1hfU8{-webkit-backdrop-filter:blur(50px);backdrop-filter:blur(50px);background-color:var(--decent-color-alpha-500)}.Popup_content__e8Qyu.Popup_size-xs__7QR-d{border-radius:
|
|
3
|
+
var css_248z = ".Popup_root__uQ-fP{display:inline-block;position:relative}.Popup_contentWrapper__2yi-2{opacity:0;pointer-events:none;position:absolute}.Popup_contentWrapper__2yi-2.Popup_animating__kR0qF{transition:opacity .1s ease-out}.Popup_contentWrapper__2yi-2.Popup_isOpen__BRIdP{opacity:1;z-index:11}.Popup_contentWrapper__2yi-2.Popup_inline__1-l1S.Popup_isOpen__BRIdP{position:relative}.Popup_contentWrapper__2yi-2:not(.Popup_inline__1-l1S),.Popup_contentWrapper__2yi-2:not(.Popup_inline__1-l1S)>.Popup_content__e8Qyu{position:absolute}.Popup_trigger__jQNaQ{cursor:pointer}.Popup_trigger__jQNaQ.Popup_isOpen__BRIdP{position:relative;z-index:11}.Popup_trigger__jQNaQ.Popup_disabled__DlE9y{opacity:.4;pointer-events:none}.Popup_content__e8Qyu{-webkit-backface-visibility:hidden;backface-visibility:hidden;background-color:var(--decent-color);box-shadow:inset 0 0 0 1px var(--accent-color-alpha-50);box-sizing:border-box;max-width:min(min(560px,70vw),calc(100svw - 16px));min-width:100%;overflow:hidden;position:relative;transform-origin:top center;z-index:11}.Popup_content__e8Qyu:before{background-color:var(--accent-color-alpha-50);bottom:0;content:\"\";left:0;pointer-events:none;position:absolute;right:0;top:0}.Popup_content__e8Qyu.Popup_blur__1hfU8{-webkit-backdrop-filter:blur(50px);backdrop-filter:blur(50px);background-color:var(--decent-color-alpha-500)}.Popup_content__e8Qyu.Popup_size-xs__7QR-d{border-radius:8.4px}.Popup_content__e8Qyu.Popup_size-xs__7QR-d.Popup_round__7rD1m{border-radius:12px}.Popup_content__e8Qyu.Popup_size-s__UmixP{border-radius:8.4px}.Popup_content__e8Qyu.Popup_size-s__UmixP.Popup_round__7rD1m{border-radius:16px}.Popup_content__e8Qyu.Popup_size-m__FYpTL{border-radius:12.6px}.Popup_content__e8Qyu.Popup_size-m__FYpTL.Popup_round__7rD1m{border-radius:20px}.Popup_content__e8Qyu.Popup_size-l__BTS57{border-radius:16.8px}.Popup_content__e8Qyu.Popup_size-l__BTS57.Popup_round__7rD1m{border-radius:24px}.Popup_content__e8Qyu.Popup_size-xl__fSfCc{border-radius:21px}.Popup_content__e8Qyu.Popup_size-xl__fSfCc.Popup_round__7rD1m{border-radius:28px}.Popup_content__e8Qyu.Popup_elevation-1__vmP3e{box-shadow:inset 0 0 0 1px var(--accent-color-alpha-50),0 0 var(--p-3) 2px var(--decent-color-alpha-500)}.Popup_content__e8Qyu.Popup_elevation-2__Ci4sI{box-shadow:inset 0 0 0 1px var(--accent-color-alpha-50),0 0 var(--p-5) 2px var(--decent-color-alpha-500)}.Popup_content__e8Qyu.Popup_outlined__g3cJV:after{border-radius:inherit;bottom:0;content:\"\";left:0;pointer-events:none;position:absolute;right:0;top:0}.Popup_isOpen__BRIdP .Popup_content__e8Qyu{opacity:1;pointer-events:all;transform:scaleX(1)}.Popup_animating__kR0qF{transition:70ms ease-out;transition-property:transform,opacity,margin}.Popup_axis-top__BaLgG{bottom:100%}.Popup_axis-bottom__hZwwr{top:100%}.Popup_axis-right__LMYVy{left:100%}.Popup_axis-left__SFKm-{right:100%}.Popup_float-top__8SQAu{bottom:0}.Popup_float-right__mdm-3{left:0}.Popup_float-bottom__7flve{top:0}.Popup_float-left__tz7fX{right:0}.Popup_axis-bottom__hZwwr,.Popup_axis-top__BaLgG{transform:scaleY(.5)}.Popup_axis-bottom__hZwwr.Popup_float-middle__Dmnn1,.Popup_axis-top__BaLgG.Popup_float-middle__Dmnn1{left:50%;transform:translateX(-50%) scaleY(.5)}.Popup_isOpen__BRIdP .Popup_axis-bottom__hZwwr.Popup_float-middle__Dmnn1,.Popup_isOpen__BRIdP .Popup_axis-top__BaLgG.Popup_float-middle__Dmnn1{transform:translateX(-50%) scaleX(1)}.Popup_axis-left__SFKm-,.Popup_axis-right__LMYVy{transform:scaleX(.5)}.Popup_axis-left__SFKm-.Popup_float-middle__Dmnn1,.Popup_axis-right__LMYVy.Popup_float-middle__Dmnn1{top:50%;transform:translateY(-50%) scaleX(.5)}.Popup_isOpen__BRIdP .Popup_axis-left__SFKm-.Popup_float-middle__Dmnn1,.Popup_isOpen__BRIdP .Popup_axis-right__LMYVy.Popup_float-middle__Dmnn1{transform:translateY(-50%) scaleX(1)}.Popup_axis-top__BaLgG.Popup_float-middle__Dmnn1{transform-origin:bottom center}.Popup_axis-top__BaLgG.Popup_float-right__mdm-3{transform-origin:bottom left}.Popup_axis-top__BaLgG.Popup_float-left__tz7fX{transform-origin:bottom right}.Popup_axis-bottom__hZwwr.Popup_float-middle__Dmnn1{transform-origin:top center}.Popup_axis-bottom__hZwwr.Popup_float-right__mdm-3{transform-origin:top left}.Popup_axis-bottom__hZwwr.Popup_float-left__tz7fX{transform-origin:top right}.Popup_axis-right__LMYVy.Popup_float-middle__Dmnn1{transform-origin:center left}.Popup_axis-right__LMYVy.Popup_float-top__8SQAu{transform-origin:bottom left}.Popup_axis-right__LMYVy.Popup_float-bottom__7flve{transform-origin:top left}.Popup_axis-left__SFKm-.Popup_float-middle__Dmnn1{transform-origin:center right}.Popup_axis-left__SFKm-.Popup_float-top__8SQAu{transform-origin:bottom right}.Popup_axis-left__SFKm-.Popup_float-bottom__7flve{transform-origin:top right}";
|
|
4
4
|
var S = {"root":"Popup_root__uQ-fP","contentWrapper":"Popup_contentWrapper__2yi-2","animating":"Popup_animating__kR0qF","isOpen":"Popup_isOpen__BRIdP","inline":"Popup_inline__1-l1S","content":"Popup_content__e8Qyu","trigger":"Popup_trigger__jQNaQ","disabled":"Popup_disabled__DlE9y","blur":"Popup_blur__1hfU8","size-xs":"Popup_size-xs__7QR-d","round":"Popup_round__7rD1m","size-s":"Popup_size-s__UmixP","size-m":"Popup_size-m__FYpTL","size-l":"Popup_size-l__BTS57","size-xl":"Popup_size-xl__fSfCc","elevation-1":"Popup_elevation-1__vmP3e","elevation-2":"Popup_elevation-2__Ci4sI","outlined":"Popup_outlined__g3cJV","axis-top":"Popup_axis-top__BaLgG","axis-bottom":"Popup_axis-bottom__hZwwr","axis-right":"Popup_axis-right__LMYVy","axis-left":"Popup_axis-left__SFKm-","float-top":"Popup_float-top__8SQAu","float-right":"Popup_float-right__mdm-3","float-bottom":"Popup_float-bottom__7flve","float-left":"Popup_float-left__tz7fX","float-middle":"Popup_float-middle__Dmnn1"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import cn from 'classnames';
|
|
3
2
|
import S from './ThinkingOutline.styl.js';
|
|
3
|
+
import cn from 'classnames';
|
|
4
4
|
|
|
5
|
-
function ThinkingOutline({ active, className }) {
|
|
5
|
+
function ThinkingOutline({ active = false, className, }) {
|
|
6
6
|
return (jsx("div", { className: cn(S.root, active && S.active, className), children: jsx("div", { className: S.bloom }) }));
|
|
7
7
|
}
|
|
8
8
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "@property --promptGlowAngle{syntax:\"<angle>\";inherits:true;initial-value:0deg}.ThinkingOutline_root__rvvBG{animation:ThinkingOutline_orbitGlow__3bK-F 3.5s linear infinite;border-radius:inherit;inset:0;opacity:0;pointer-events:none;position:absolute;transition:opacity .5s ease-out}.ThinkingOutline_root__rvvBG.ThinkingOutline_active__-66iV{opacity:1}.ThinkingOutline_root__rvvBG:before{background:conic-gradient(from var(--promptGlowAngle),var(--active-color) 0deg,var(--active-color-alpha-300) 48deg,transparent 80deg,transparent 100deg,var(--active-color-alpha-300) 132deg,var(--active-color) 180deg,var(--active-color-alpha-300) 228deg,transparent 260deg,transparent 280deg,var(--active-color-alpha-300) 312deg,var(--active-color) 1turn);border-radius:inherit;content:\"\";inset:0;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:1.5px;position:absolute}.ThinkingOutline_bloom__XKYD5{border-radius:inherit;filter:blur(20px);inset:0;opacity:.55;position:absolute}.ThinkingOutline_bloom__XKYD5:before{background:conic-gradient(from var(--promptGlowAngle),var(--active-color) 0deg,var(--active-color-alpha-300) 48deg,transparent 80deg,transparent 100deg,var(--active-color-alpha-300) 132deg,var(--active-color) 180deg,var(--active-color-alpha-300) 228deg,transparent 260deg,transparent 280deg,var(--active-color-alpha-300) 312deg,var(--active-color) 1turn);border-radius:inherit;content:\"\";inset:0;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:6px;position:absolute}@media (prefers-reduced-motion:reduce){.ThinkingOutline_root__rvvBG{animation:none}}@keyframes ThinkingOutline_orbitGlow__3bK-F{0%{--promptGlowAngle:-30deg}25%{--promptGlowAngle:30deg}50%{--promptGlowAngle:150deg}75%{--promptGlowAngle:210deg}to{--promptGlowAngle:330deg}}";
|
|
3
|
+
var css_248z = "@property --promptGlowAngle{syntax:\"<angle>\";inherits:true;initial-value:0deg}.ThinkingOutline_root__rvvBG{animation:ThinkingOutline_orbitGlow__3bK-F 3.5s linear infinite;animation-play-state:paused;border-radius:inherit;inset:0;opacity:0;pointer-events:none;position:absolute;transition:opacity .5s ease-out}.ThinkingOutline_root__rvvBG.ThinkingOutline_active__-66iV,:hover>.ThinkingOutline_root__rvvBG{animation-play-state:running;opacity:1}.ThinkingOutline_root__rvvBG:before{background:conic-gradient(from var(--promptGlowAngle),var(--active-color) 0deg,var(--active-color-alpha-300) 48deg,transparent 80deg,transparent 100deg,var(--active-color-alpha-300) 132deg,var(--active-color) 180deg,var(--active-color-alpha-300) 228deg,transparent 260deg,transparent 280deg,var(--active-color-alpha-300) 312deg,var(--active-color) 1turn);border-radius:inherit;content:\"\";inset:0;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:1.5px;position:absolute}.ThinkingOutline_bloom__XKYD5{border-radius:inherit;filter:blur(20px);inset:0;opacity:.55;position:absolute}.ThinkingOutline_bloom__XKYD5:before{background:conic-gradient(from var(--promptGlowAngle),var(--active-color) 0deg,var(--active-color-alpha-300) 48deg,transparent 80deg,transparent 100deg,var(--active-color-alpha-300) 132deg,var(--active-color) 180deg,var(--active-color-alpha-300) 228deg,transparent 260deg,transparent 280deg,var(--active-color-alpha-300) 312deg,var(--active-color) 1turn);border-radius:inherit;content:\"\";inset:0;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:6px;position:absolute}@media (prefers-reduced-motion:reduce){.ThinkingOutline_root__rvvBG{animation:none}}@keyframes ThinkingOutline_orbitGlow__3bK-F{0%{--promptGlowAngle:-30deg}25%{--promptGlowAngle:30deg}50%{--promptGlowAngle:150deg}75%{--promptGlowAngle:210deg}to{--promptGlowAngle:330deg}}";
|
|
4
4
|
var S = {"root":"ThinkingOutline_root__rvvBG","orbitGlow":"ThinkingOutline_orbitGlow__3bK-F","active":"ThinkingOutline_active__-66iV","bloom":"ThinkingOutline_bloom__XKYD5"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as T from './Input.types';
|
|
2
2
|
export type InputProps = T.Props;
|
|
3
|
-
export declare const Input: import("react").ForwardRefExoticComponent<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "onChange"> & Omit<T.ControlProps, "onChange" | "ref"> & import("../../types").FormControl<T.Value, HTMLInputElement> & {
|
|
3
|
+
export declare const Input: import("react").ForwardRefExoticComponent<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "onChange" | "size"> & Omit<T.ControlProps, "onChange" | "size" | "ref"> & import("../../types").FormControl<T.Value, HTMLInputElement> & {
|
|
4
4
|
name?: string;
|
|
5
5
|
step?: number;
|
|
6
6
|
size?: import("../../types").Size;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as T from './NestedMenu.types';
|
|
2
2
|
export declare function NestedMenuLabel({ children, className, }: T.NestedMenuLabelProps): import("react").JSX.Element;
|
|
3
3
|
export declare function NestedMenuItemRow({ children, className, danger, disabled, href, target, rel, onClick, }: T.NestedMenuRowProps): import("react").JSX.Element;
|
|
4
|
-
declare function NestedMenuComponent({ trigger, items, open, onOpenChange, align, size, className, popupProps, }: T.Props): import("react").JSX.Element;
|
|
4
|
+
declare function NestedMenuComponent({ trigger, items, open, onOpenChange, align, size, className, popupProps, onItemClick, }: T.Props): import("react").JSX.Element;
|
|
5
5
|
export declare const NestedMenu: typeof NestedMenuComponent & {
|
|
6
6
|
Item: typeof NestedMenuItemRow;
|
|
7
7
|
Label: typeof NestedMenuLabel;
|
|
@@ -6,7 +6,7 @@ export type NestedMenuItem = {
|
|
|
6
6
|
label: ReactNode;
|
|
7
7
|
icon?: ReactNode;
|
|
8
8
|
hint?: ReactNode;
|
|
9
|
-
/**
|
|
9
|
+
/** Allow long hint/label text to wrap inside the text column. */
|
|
10
10
|
wrap?: boolean;
|
|
11
11
|
submenu?: ReactNode;
|
|
12
12
|
onSubmenuOpen?: () => void;
|
|
@@ -22,6 +22,7 @@ export type Props = {
|
|
|
22
22
|
items: NestedMenuItem[];
|
|
23
23
|
open: boolean;
|
|
24
24
|
onOpenChange: (open: boolean) => void;
|
|
25
|
+
onItemClick?: (id: string) => void;
|
|
25
26
|
align?: 'start' | 'end';
|
|
26
27
|
size?: Size;
|
|
27
28
|
className?: string;
|
|
@@ -4,7 +4,7 @@ import { Component, ReactNode } from 'react';
|
|
|
4
4
|
export declare const SelectHelpers: typeof H;
|
|
5
5
|
export declare class Select extends Component<T.Props, T.State> {
|
|
6
6
|
store: any;
|
|
7
|
-
inputRef: import("react").RefObject<import("react").ForwardRefExoticComponent<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "onChange"> & Omit<import("../Input/Input.types").ControlProps, "onChange" | "ref"> & import("../../types").FormControl<import("../Input/Input.types").Value, HTMLInputElement> & {
|
|
7
|
+
inputRef: import("react").RefObject<import("react").ForwardRefExoticComponent<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "onChange" | "size"> & Omit<import("../Input/Input.types").ControlProps, "onChange" | "size" | "ref"> & import("../../types").FormControl<import("../Input/Input.types").Value, HTMLInputElement> & {
|
|
8
8
|
name?: string;
|
|
9
9
|
step?: number;
|
|
10
10
|
size?: import("../../types").Size;
|
|
@@ -2,4 +2,4 @@ export type ThinkingOutlineProps = {
|
|
|
2
2
|
active?: boolean;
|
|
3
3
|
className?: string;
|
|
4
4
|
};
|
|
5
|
-
export declare function ThinkingOutline({ active, className }: ThinkingOutlineProps): import("react").JSX.Element;
|
|
5
|
+
export declare function ThinkingOutline({ active, className, }: ThinkingOutlineProps): import("react").JSX.Element;
|
|
@@ -38,7 +38,6 @@ export * from './Nudge';
|
|
|
38
38
|
export * from './Paranja/Paranja';
|
|
39
39
|
export * from './Popup/Popup';
|
|
40
40
|
export * from './Portal/Portal';
|
|
41
|
-
export * from './PopupMenu/PopupMenu';
|
|
42
41
|
export * from './Progress/Progress';
|
|
43
42
|
export * from './ProgressCircular/ProgressCircular';
|
|
44
43
|
export * from './PromptComposer';
|
package/package.json
CHANGED
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { createElement } from 'react';
|
|
3
|
-
import cn from 'classnames';
|
|
4
|
-
import { Button } from '../Button/Button.js';
|
|
5
|
-
import { Popup } from '../Popup/Popup.js';
|
|
6
|
-
import S from './PopupMenu.styl.js';
|
|
7
|
-
|
|
8
|
-
function PopupMenu({ items, ...props }) {
|
|
9
|
-
if (items.length === 0)
|
|
10
|
-
return null;
|
|
11
|
-
const { size } = props;
|
|
12
|
-
return (jsx(Popup, { ...props, content: jsx("div", { className: S.list, children: items.map(({ id, title, className, ...rest }) => (createElement(Button, { variant: "clear", size: size, ...rest, className: cn(S.item, className), key: id }, title))) }) }));
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
export { PopupMenu };
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
|
|
2
|
-
|
|
3
|
-
var css_248z = ".PopupMenu_list__G7xP3{align-items:stretch;border-radius:inherit;display:flex;flex-direction:column;padding:2px}.PopupMenu_item__wxay-{gap:var(--p-2);justify-content:flex-start;text-align:left;white-space:nowrap}.PopupMenu_item__wxay-+.PopupMenu_item__wxay-{margin-top:2px}.PopupMenu_item__wxay-:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}.PopupMenu_item__wxay-:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}";
|
|
4
|
-
var S = {"list":"PopupMenu_list__G7xP3","item":"PopupMenu_item__wxay-"};
|
|
5
|
-
styleInject(css_248z);
|
|
6
|
-
|
|
7
|
-
export { S as default };
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
2
|
-
import type { Props as ButtonProps } from '../Button/Button.types';
|
|
3
|
-
import type { Props as PopupProps } from '../Popup/Popup.types';
|
|
4
|
-
export type Item = Pick<ButtonProps, 'onClick'> & {
|
|
5
|
-
id: string;
|
|
6
|
-
title: ReactNode;
|
|
7
|
-
className?: string;
|
|
8
|
-
};
|
|
9
|
-
export type Props = Omit<PopupProps, 'content'> & {
|
|
10
|
-
trigger: ReactNode;
|
|
11
|
-
items: Item[];
|
|
12
|
-
onClose?: () => void;
|
|
13
|
-
};
|