@stack-spot/ai-chat-widget 1.0.0 → 1.1.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/CHANGELOG.md +9 -0
- package/dist/StackspotAIWidget.d.ts +20 -0
- package/dist/StackspotAIWidget.d.ts.map +1 -1
- package/dist/StackspotAIWidget.js +7 -3
- package/dist/StackspotAIWidget.js.map +1 -1
- package/dist/chat-interceptors/CustomInputs.d.ts +4 -1
- package/dist/chat-interceptors/CustomInputs.d.ts.map +1 -1
- package/dist/chat-interceptors/CustomInputs.js +10 -1
- package/dist/chat-interceptors/CustomInputs.js.map +1 -1
- package/dist/chat-interceptors/quick-command-questions.d.ts +10 -0
- package/dist/chat-interceptors/quick-command-questions.d.ts.map +1 -1
- package/dist/chat-interceptors/quick-command-questions.js +12 -2
- package/dist/chat-interceptors/quick-command-questions.js.map +1 -1
- package/dist/chat-interceptors/quick-commands.d.ts +11 -0
- package/dist/chat-interceptors/quick-commands.d.ts.map +1 -1
- package/dist/chat-interceptors/quick-commands.js +42 -3
- package/dist/chat-interceptors/quick-commands.js.map +1 -1
- package/dist/chat-interceptors/send-message.d.ts +10 -0
- package/dist/chat-interceptors/send-message.d.ts.map +1 -1
- package/dist/chat-interceptors/send-message.js +18 -0
- package/dist/chat-interceptors/send-message.js.map +1 -1
- package/dist/components/Accordion.d.ts +10 -0
- package/dist/components/Accordion.d.ts.map +1 -1
- package/dist/components/Accordion.js +3 -0
- package/dist/components/Accordion.js.map +1 -1
- package/dist/components/AdaptiveTextArea.d.ts +12 -0
- package/dist/components/AdaptiveTextArea.d.ts.map +1 -1
- package/dist/components/AdaptiveTextArea.js +3 -0
- package/dist/components/AdaptiveTextArea.js.map +1 -1
- package/dist/components/AutoFocus.d.ts +17 -0
- package/dist/components/AutoFocus.d.ts.map +1 -1
- package/dist/components/AutoFocus.js +6 -5
- package/dist/components/AutoFocus.js.map +1 -1
- package/dist/components/Fading.d.ts +19 -2
- package/dist/components/Fading.d.ts.map +1 -1
- package/dist/components/Fading.js +6 -4
- package/dist/components/Fading.js.map +1 -1
- package/dist/components/FadingOverflow.d.ts +25 -0
- package/dist/components/FadingOverflow.d.ts.map +1 -1
- package/dist/components/FadingOverflow.js +11 -2
- package/dist/components/FadingOverflow.js.map +1 -1
- package/dist/components/FallbackBoundary/index.d.ts +6 -0
- package/dist/components/FallbackBoundary/index.d.ts.map +1 -1
- package/dist/components/FallbackBoundary/index.js.map +1 -1
- package/dist/components/HistoryList.d.ts +15 -0
- package/dist/components/HistoryList.d.ts.map +1 -1
- package/dist/components/HistoryList.js +3 -1
- package/dist/components/HistoryList.js.map +1 -1
- package/dist/components/IconInput.d.ts +3 -0
- package/dist/components/IconInput.d.ts.map +1 -1
- package/dist/components/IconInput.js +3 -0
- package/dist/components/IconInput.js.map +1 -1
- package/dist/components/OverlayMenu.d.ts +11 -0
- package/dist/components/OverlayMenu.d.ts.map +1 -1
- package/dist/components/OverlayMenu.js +5 -1
- package/dist/components/OverlayMenu.js.map +1 -1
- package/dist/components/ProgressBar.d.ts +22 -0
- package/dist/components/ProgressBar.d.ts.map +1 -1
- package/dist/components/ProgressBar.js +5 -0
- package/dist/components/ProgressBar.js.map +1 -1
- package/dist/components/QuickStartButton.d.ts.map +1 -1
- package/dist/components/QuickStartButton.js +3 -0
- package/dist/components/QuickStartButton.js.map +1 -1
- package/dist/components/RightPanelForm.d.ts +3 -0
- package/dist/components/RightPanelForm.d.ts.map +1 -1
- package/dist/components/RightPanelForm.js +3 -0
- package/dist/components/RightPanelForm.js.map +1 -1
- package/dist/components/RightPanelTabs.d.ts +3 -0
- package/dist/components/RightPanelTabs.d.ts.map +1 -1
- package/dist/components/RightPanelTabs.js +3 -0
- package/dist/components/RightPanelTabs.js.map +1 -1
- package/dist/components/TabManager.d.ts +6 -0
- package/dist/components/TabManager.d.ts.map +1 -1
- package/dist/components/TabManager.js +8 -0
- package/dist/components/TabManager.js.map +1 -1
- package/dist/components/Tooltip/Tooltip.d.ts +23 -0
- package/dist/components/Tooltip/Tooltip.d.ts.map +1 -1
- package/dist/components/Tooltip/Tooltip.js +4 -0
- package/dist/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/components/Tooltip/TooltipAPI.d.ts +16 -0
- package/dist/components/Tooltip/TooltipAPI.d.ts.map +1 -1
- package/dist/components/Tooltip/TooltipAPI.js +17 -0
- package/dist/components/Tooltip/TooltipAPI.js.map +1 -1
- package/dist/components/Tooltip/types.d.ts +13 -0
- package/dist/components/Tooltip/types.d.ts.map +1 -1
- package/dist/components/form/DescribedCheckboxGroup.d.ts +4 -0
- package/dist/components/form/DescribedCheckboxGroup.d.ts.map +1 -1
- package/dist/components/form/DescribedCheckboxGroup.js +4 -0
- package/dist/components/form/DescribedCheckboxGroup.js.map +1 -1
- package/dist/components/form/DescribedRadioGroup.d.ts +4 -0
- package/dist/components/form/DescribedRadioGroup.d.ts.map +1 -1
- package/dist/components/form/DescribedRadioGroup.js +4 -0
- package/dist/components/form/DescribedRadioGroup.js.map +1 -1
- package/dist/components/form/types.d.ts +34 -0
- package/dist/components/form/types.d.ts.map +1 -1
- package/dist/context/AIWidgetProvider.d.ts +19 -0
- package/dist/context/AIWidgetProvider.d.ts.map +1 -1
- package/dist/context/AIWidgetProvider.js +19 -0
- package/dist/context/AIWidgetProvider.js.map +1 -1
- package/dist/context/hooks.d.ts +56 -0
- package/dist/context/hooks.d.ts.map +1 -1
- package/dist/context/hooks.js +56 -1
- package/dist/context/hooks.js.map +1 -1
- package/dist/features.d.ts +28 -0
- package/dist/features.d.ts.map +1 -1
- package/dist/features.js +1 -0
- package/dist/features.js.map +1 -1
- package/dist/right-panel/DefaultPanel.d.ts +3 -0
- package/dist/right-panel/DefaultPanel.d.ts.map +1 -1
- package/dist/right-panel/DefaultPanel.js +4 -3
- package/dist/right-panel/DefaultPanel.js.map +1 -1
- package/dist/right-panel/RightPanel.d.ts +3 -0
- package/dist/right-panel/RightPanel.d.ts.map +1 -1
- package/dist/right-panel/RightPanel.js +3 -0
- package/dist/right-panel/RightPanel.js.map +1 -1
- package/dist/right-panel/RightPanelProvider.d.ts +15 -0
- package/dist/right-panel/RightPanelProvider.d.ts.map +1 -1
- package/dist/right-panel/RightPanelProvider.js.map +1 -1
- package/dist/right-panel/hooks.d.ts +6 -0
- package/dist/right-panel/hooks.d.ts.map +1 -1
- package/dist/right-panel/hooks.js +6 -0
- package/dist/right-panel/hooks.js.map +1 -1
- package/dist/state/ChatEntry.d.ts +58 -2
- package/dist/state/ChatEntry.d.ts.map +1 -1
- package/dist/state/ChatEntry.js +20 -1
- package/dist/state/ChatEntry.js.map +1 -1
- package/dist/state/ChatState.d.ts +73 -8
- package/dist/state/ChatState.d.ts.map +1 -1
- package/dist/state/ChatState.js +24 -7
- package/dist/state/ChatState.js.map +1 -1
- package/dist/state/ChatTabsController.d.ts +31 -0
- package/dist/state/ChatTabsController.d.ts.map +1 -1
- package/dist/state/ChatTabsController.js +31 -0
- package/dist/state/ChatTabsController.js.map +1 -1
- package/dist/state/ObservableState.d.ts +14 -0
- package/dist/state/ObservableState.d.ts.map +1 -1
- package/dist/state/ObservableState.js +14 -0
- package/dist/state/ObservableState.js.map +1 -1
- package/dist/state/WidgetState.d.ts +5 -0
- package/dist/state/WidgetState.d.ts.map +1 -1
- package/dist/state/WidgetState.js +5 -0
- package/dist/state/WidgetState.js.map +1 -1
- package/dist/types.d.ts +10 -0
- package/dist/types.d.ts.map +1 -1
- package/dist/utils/chat.d.ts +13 -0
- package/dist/utils/chat.d.ts.map +1 -1
- package/dist/utils/chat.js +14 -0
- package/dist/utils/chat.js.map +1 -1
- package/dist/utils/date.d.ts +25 -0
- package/dist/utils/date.d.ts.map +1 -1
- package/dist/utils/date.js +25 -0
- package/dist/utils/date.js.map +1 -1
- package/dist/utils/download.d.ts +5 -0
- package/dist/utils/download.d.ts.map +1 -1
- package/dist/utils/download.js +5 -0
- package/dist/utils/download.js.map +1 -1
- package/dist/utils/knowledge-source.d.ts +10 -0
- package/dist/utils/knowledge-source.d.ts.map +1 -1
- package/dist/utils/knowledge-source.js +16 -0
- package/dist/utils/knowledge-source.js.map +1 -1
- package/dist/utils/string.d.ts +5 -0
- package/dist/utils/string.d.ts.map +1 -1
- package/dist/utils/string.js +5 -1
- package/dist/utils/string.js.map +1 -1
- package/dist/views/Agents.js +3 -0
- package/dist/views/Agents.js.map +1 -1
- package/dist/views/Chat/AgentInfo.d.ts +3 -0
- package/dist/views/Chat/AgentInfo.d.ts.map +1 -1
- package/dist/views/Chat/AgentInfo.js +3 -0
- package/dist/views/Chat/AgentInfo.js.map +1 -1
- package/dist/views/Chat/ChatMessage.d.ts +17 -2
- package/dist/views/Chat/ChatMessage.d.ts.map +1 -1
- package/dist/views/Chat/ChatMessage.js +6 -32
- package/dist/views/Chat/ChatMessage.js.map +1 -1
- package/dist/views/Chat/ChatMessages.d.ts +3 -0
- package/dist/views/Chat/ChatMessages.d.ts.map +1 -1
- package/dist/views/Chat/ChatMessages.js +3 -0
- package/dist/views/Chat/ChatMessages.js.map +1 -1
- package/dist/views/Chat/chat-scroll.d.ts +1 -1
- package/dist/views/Chat/chat-scroll.js +1 -1
- package/dist/views/Chat/events.d.ts +22 -0
- package/dist/views/Chat/events.d.ts.map +1 -0
- package/dist/views/Chat/events.js +66 -0
- package/dist/views/Chat/events.js.map +1 -0
- package/dist/views/Chat/index.d.ts +6 -0
- package/dist/views/Chat/index.d.ts.map +1 -1
- package/dist/views/Chat/index.js +3 -0
- package/dist/views/Chat/index.js.map +1 -1
- package/dist/views/ChatHistory/ChatHistoryPanel.d.ts +3 -0
- package/dist/views/ChatHistory/ChatHistoryPanel.d.ts.map +1 -1
- package/dist/views/ChatHistory/ChatHistoryPanel.js +3 -0
- package/dist/views/ChatHistory/ChatHistoryPanel.js.map +1 -1
- package/dist/views/ChatHistory/HistoryItem.d.ts +3 -0
- package/dist/views/ChatHistory/HistoryItem.d.ts.map +1 -1
- package/dist/views/ChatHistory/HistoryItem.js +3 -0
- package/dist/views/ChatHistory/HistoryItem.js.map +1 -1
- package/dist/views/ChatHistory/index.d.ts +10 -2
- package/dist/views/ChatHistory/index.d.ts.map +1 -1
- package/dist/views/ChatHistory/index.js +3 -0
- package/dist/views/ChatHistory/index.js.map +1 -1
- package/dist/views/ChatHistory/utils.d.ts +14 -0
- package/dist/views/ChatHistory/utils.d.ts.map +1 -1
- package/dist/views/ChatHistory/utils.js +14 -0
- package/dist/views/ChatHistory/utils.js.map +1 -1
- package/dist/views/ChatTabSelection.d.ts +3 -0
- package/dist/views/ChatTabSelection.d.ts.map +1 -1
- package/dist/views/ChatTabSelection.js +3 -0
- package/dist/views/ChatTabSelection.js.map +1 -1
- package/dist/views/Editor.d.ts +3 -0
- package/dist/views/Editor.d.ts.map +1 -1
- package/dist/views/Editor.js +4 -0
- package/dist/views/Editor.js.map +1 -1
- package/dist/views/Home.d.ts +8 -0
- package/dist/views/Home.d.ts.map +1 -1
- package/dist/views/Home.js +5 -0
- package/dist/views/Home.js.map +1 -1
- package/dist/views/KSDocument.d.ts +3 -0
- package/dist/views/KSDocument.d.ts.map +1 -1
- package/dist/views/KSDocument.js +3 -0
- package/dist/views/KSDocument.js.map +1 -1
- package/dist/views/KnowledgeSources.js +3 -0
- package/dist/views/KnowledgeSources.js.map +1 -1
- package/dist/views/MessageInput/ButtonGroup.d.ts +22 -0
- package/dist/views/MessageInput/ButtonGroup.d.ts.map +1 -1
- package/dist/views/MessageInput/ButtonGroup.js +4 -0
- package/dist/views/MessageInput/ButtonGroup.js.map +1 -1
- package/dist/views/MessageInput/InfoBar.d.ts +7 -0
- package/dist/views/MessageInput/InfoBar.d.ts.map +1 -1
- package/dist/views/MessageInput/InfoBar.js +7 -0
- package/dist/views/MessageInput/InfoBar.js.map +1 -1
- package/dist/views/MessageInput/QuickCommandSelector.d.ts +7 -0
- package/dist/views/MessageInput/QuickCommandSelector.d.ts.map +1 -1
- package/dist/views/MessageInput/QuickCommandSelector.js +4 -0
- package/dist/views/MessageInput/QuickCommandSelector.js.map +1 -1
- package/dist/views/MessageInput/index.d.ts +8 -0
- package/dist/views/MessageInput/index.d.ts.map +1 -1
- package/dist/views/MessageInput/index.js +5 -0
- package/dist/views/MessageInput/index.js.map +1 -1
- package/dist/views/MinimizedHeader.d.ts +4 -0
- package/dist/views/MinimizedHeader.d.ts.map +1 -1
- package/dist/views/MinimizedHeader.js +4 -0
- package/dist/views/MinimizedHeader.js.map +1 -1
- package/dist/views/Stacks.d.ts +3 -0
- package/dist/views/Stacks.d.ts.map +1 -1
- package/dist/views/Stacks.js +3 -0
- package/dist/views/Stacks.js.map +1 -1
- package/dist/views/Workspaces.d.ts +3 -0
- package/dist/views/Workspaces.d.ts.map +1 -1
- package/dist/views/Workspaces.js +3 -0
- package/dist/views/Workspaces.js.map +1 -1
- package/package.json +6 -6
- package/src/StackspotAIWidget.tsx +23 -2
- package/src/chat-interceptors/CustomInputs.ts +14 -1
- package/src/chat-interceptors/quick-command-questions.ts +12 -2
- package/src/chat-interceptors/quick-commands.ts +42 -3
- package/src/chat-interceptors/send-message.ts +18 -0
- package/src/components/Accordion.tsx +10 -0
- package/src/components/AdaptiveTextArea.tsx +12 -0
- package/src/components/AutoFocus.tsx +19 -5
- package/src/components/Fading.tsx +25 -5
- package/src/components/FadingOverflow.tsx +31 -3
- package/src/components/FallbackBoundary/index.tsx +6 -0
- package/src/components/HistoryList.tsx +15 -1
- package/src/components/IconInput.tsx +3 -0
- package/src/components/OverlayMenu.tsx +17 -1
- package/src/components/ProgressBar.tsx +23 -0
- package/src/components/QuickStartButton.tsx +3 -0
- package/src/components/RightPanelForm.tsx +3 -0
- package/src/components/RightPanelTabs.tsx +3 -0
- package/src/components/TabManager.tsx +8 -0
- package/src/components/Tooltip/Tooltip.tsx +23 -0
- package/src/components/Tooltip/TooltipAPI.ts +17 -0
- package/src/components/Tooltip/types.ts +13 -0
- package/src/components/form/DescribedCheckboxGroup.tsx +4 -0
- package/src/components/form/DescribedRadioGroup.tsx +4 -0
- package/src/components/form/types.ts +34 -0
- package/src/context/AIWidgetProvider.tsx +19 -0
- package/src/context/hooks.ts +56 -1
- package/src/features.ts +29 -0
- package/src/right-panel/DefaultPanel.tsx +12 -13
- package/src/right-panel/RightPanel.tsx +3 -0
- package/src/right-panel/RightPanelProvider.tsx +15 -0
- package/src/right-panel/hooks.tsx +6 -0
- package/src/state/ChatEntry.ts +60 -2
- package/src/state/ChatState.ts +74 -9
- package/src/state/ChatTabsController.ts +31 -0
- package/src/state/ObservableState.ts +14 -0
- package/src/state/WidgetState.ts +5 -0
- package/src/types.ts +10 -0
- package/src/utils/chat.ts +14 -0
- package/src/utils/date.ts +25 -1
- package/src/utils/download.ts +5 -0
- package/src/utils/knowledge-source.ts +16 -0
- package/src/utils/string.ts +5 -1
- package/src/views/Agents.tsx +3 -0
- package/src/views/Chat/AgentInfo.tsx +3 -0
- package/src/views/Chat/ChatMessage.tsx +21 -32
- package/src/views/Chat/ChatMessages.tsx +3 -0
- package/src/views/Chat/chat-scroll.ts +1 -1
- package/src/views/Chat/events.ts +69 -0
- package/src/views/Chat/index.tsx +6 -0
- package/src/views/ChatHistory/ChatHistoryPanel.tsx +3 -0
- package/src/views/ChatHistory/HistoryItem.tsx +3 -0
- package/src/views/ChatHistory/index.tsx +11 -1
- package/src/views/ChatHistory/utils.ts +14 -0
- package/src/views/ChatTabSelection.tsx +3 -0
- package/src/views/Editor.tsx +4 -0
- package/src/views/Home.tsx +8 -0
- package/src/views/KSDocument.tsx +3 -0
- package/src/views/KnowledgeSources.tsx +3 -0
- package/src/views/MessageInput/ButtonGroup.tsx +22 -0
- package/src/views/MessageInput/InfoBar.tsx +7 -0
- package/src/views/MessageInput/QuickCommandSelector.tsx +7 -0
- package/src/views/MessageInput/index.tsx +8 -0
- package/src/views/MinimizedHeader.tsx +4 -0
- package/src/views/Stacks.tsx +3 -0
- package/src/views/Workspaces.tsx +3 -0
|
@@ -1,14 +1,31 @@
|
|
|
1
1
|
import { WithStyle } from '@stack-spot/portal-theme';
|
|
2
2
|
import { WithChildren } from '../types.js';
|
|
3
3
|
interface Props extends WithChildren, WithStyle {
|
|
4
|
+
/**
|
|
5
|
+
* Whether or not the content is visible.
|
|
6
|
+
*/
|
|
4
7
|
visible: boolean;
|
|
5
8
|
/**
|
|
6
9
|
* Duration of the animation in ms.
|
|
7
10
|
* @default 300
|
|
8
11
|
*/
|
|
9
12
|
duration?: number;
|
|
10
|
-
|
|
11
|
-
|
|
13
|
+
/**
|
|
14
|
+
* Function to run right before animation to show the content starts.
|
|
15
|
+
*/
|
|
16
|
+
beforeFadeIn?: () => void;
|
|
17
|
+
/**
|
|
18
|
+
* Function to run right before animation to hide the content starts.
|
|
19
|
+
*/
|
|
20
|
+
beforeFadeOut?: () => void;
|
|
21
|
+
/**
|
|
22
|
+
* Function to run right after the animation to show the content ends.
|
|
23
|
+
*/
|
|
24
|
+
afterFadeIn?: () => void;
|
|
25
|
+
/**
|
|
26
|
+
* Function to run right after the animation to hide the content ends.
|
|
27
|
+
*/
|
|
28
|
+
afterFadeOut?: () => void;
|
|
12
29
|
}
|
|
13
30
|
export declare const Fading: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<HTMLDivElement>>;
|
|
14
31
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Fading.d.ts","sourceRoot":"","sources":["../../src/components/Fading.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAEpD,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,UAAU,KAAM,SAAQ,YAAY,EAAE,SAAS;IAC7C,OAAO,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,
|
|
1
|
+
{"version":3,"file":"Fading.d.ts","sourceRoot":"","sources":["../../src/components/Fading.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAEpD,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,UAAU,KAAM,SAAQ,YAAY,EAAE,SAAS;IAC7C;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED,eAAO,MAAM,MAAM,kGAgCjB,CAAA"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef, useEffect, useRef, useState } from 'react';
|
|
3
|
-
export const Fading = forwardRef(({ visible, children, duration = 300,
|
|
3
|
+
export const Fading = forwardRef(({ visible, children, duration = 300, afterFadeIn, afterFadeOut, beforeFadeIn, beforeFadeOut, className, style }, ref) => {
|
|
4
4
|
const [isOpaque, setOpaque] = useState(visible);
|
|
5
5
|
const [isRendered, setRendered] = useState(visible);
|
|
6
6
|
const previous = useRef(visible);
|
|
@@ -13,15 +13,17 @@ export const Fading = forwardRef(({ visible, children, duration = 300, onFadeIn,
|
|
|
13
13
|
timeout.current = [];
|
|
14
14
|
if (visible) {
|
|
15
15
|
setRendered(true);
|
|
16
|
+
if (afterFadeIn)
|
|
17
|
+
timeout.current.push(window.setTimeout(afterFadeIn, duration));
|
|
18
|
+
beforeFadeIn?.();
|
|
16
19
|
timeout.current.push(window.setTimeout(() => setOpaque(true), 0));
|
|
17
|
-
if (onFadeIn)
|
|
18
|
-
timeout.current.push(window.setTimeout(onFadeIn, duration));
|
|
19
20
|
}
|
|
20
21
|
else {
|
|
21
22
|
setOpaque(false);
|
|
23
|
+
beforeFadeOut?.();
|
|
22
24
|
timeout.current.push(window.setTimeout(() => {
|
|
23
25
|
setRendered(false);
|
|
24
|
-
|
|
26
|
+
afterFadeOut?.();
|
|
25
27
|
}, duration));
|
|
26
28
|
}
|
|
27
29
|
previous.current = visible;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Fading.js","sourceRoot":"","sources":["../../src/components/Fading.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"Fading.js","sourceRoot":"","sources":["../../src/components/Fading.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AA+B/D,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAAwB,CACtD,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,GAAG,GAAG,EAAE,WAAW,EAAE,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,SAAS,EAAE,KAAK,EAAE,EAC/G,GAAG,EACH,EAAE;IACF,MAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAA;IAC/C,MAAM,CAAC,UAAU,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAA;IACnD,MAAM,QAAQ,GAAG,MAAM,CAAC,OAAO,CAAC,CAAA;IAChC,MAAM,OAAO,GAAG,MAAM,CAAW,EAAE,CAAC,CAAA;IACpC,MAAM,OAAO,GAAwB,EAAE,UAAU,EAAE,WAAW,QAAQ,GAAG,IAAI,GAAG,EAAE,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAA;IAE7G,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,QAAQ,CAAC,OAAO,KAAK,OAAO;YAAE,OAAM;QACxC,OAAO,CAAC,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,YAAY,CAAC,CAAA;QAC5C,OAAO,CAAC,OAAO,GAAG,EAAE,CAAA;QACpB,IAAI,OAAO,EAAE,CAAC;YACZ,WAAW,CAAC,IAAI,CAAC,CAAA;YACjB,IAAI,WAAW;gBAAE,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAA;YAC/E,YAAY,EAAE,EAAE,CAAA;YAChB,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,CAAA;QAEnE,CAAC;aAAM,CAAC;YACN,SAAS,CAAC,KAAK,CAAC,CAAA;YAChB,aAAa,EAAE,EAAE,CAAA;YACjB,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE;gBAC1C,WAAW,CAAC,KAAK,CAAC,CAAA;gBAClB,YAAY,EAAE,EAAE,CAAA;YAClB,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAA;QACf,CAAC;QACD,QAAQ,CAAC,OAAO,GAAG,OAAO,CAAA;IAC5B,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAA;IAEb,OAAO,UAAU,CAAC,CAAC,CAAC,cAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,GAAG,KAAK,EAAE,GAAG,OAAO,EAAE,YAAG,QAAQ,GAAO,CAAC,CAAC,CAAC,IAAI,CAAA;AACnH,CAAC,CAAC,CAAA"}
|
|
@@ -3,10 +3,35 @@ import { WithChildren } from '../types.js';
|
|
|
3
3
|
type Side = 'top' | 'right' | 'left' | 'bottom';
|
|
4
4
|
type ScrollType = 'none' | 'wheel' | 'bar' | 'arrows';
|
|
5
5
|
interface Props extends WithChildren, WithStyle {
|
|
6
|
+
/**
|
|
7
|
+
* How to scroll the content.
|
|
8
|
+
* - none: overflow is hidden. No scrolling.
|
|
9
|
+
* - wheel: the content is solely scrollable through the mouse wheel and keyboard arrows, no scroll bars are rendered.
|
|
10
|
+
* - bar: this is the normal browser scroll. The content will be scrollable through the mouse wheel, keyboard and scrollbar.
|
|
11
|
+
* - arrows: arrows will be placed in the far edges of the sides that must be scrolled. The content is scrolled through the mouse wheel,
|
|
12
|
+
* keyboard and these arrows. Hovering an arrow slowly scrolls the content, clicking the arrow fully scrolls the content in its direction.
|
|
13
|
+
* There are no scrollbars in this scenario.
|
|
14
|
+
* @default 'none'
|
|
15
|
+
*/
|
|
6
16
|
scroll?: ScrollType;
|
|
17
|
+
/**
|
|
18
|
+
* If true, a horizontal scroll can be performed by using the vertical mouse wheel.
|
|
19
|
+
* @default false
|
|
20
|
+
*/
|
|
7
21
|
enableHorizontalScrollWithVerticalWheel?: boolean;
|
|
22
|
+
/**
|
|
23
|
+
* Which sides to fade when the content overflows.
|
|
24
|
+
*
|
|
25
|
+
* Important: it seems the current solution doesn't support mixing vertical and horizontal scrolls. I'm not sure if this is possible, I
|
|
26
|
+
* believed combining linear gradients would work, but it doesn't.
|
|
27
|
+
*/
|
|
8
28
|
sides?: Side[];
|
|
9
29
|
}
|
|
30
|
+
/**
|
|
31
|
+
* This component applies a fading graphical effect to its content if it overflows in any of the sides specified by the props.
|
|
32
|
+
*
|
|
33
|
+
* This also controls how this overflow is scrolled, introducing a new scrolling technique, which applies arrows to the overflowing side.
|
|
34
|
+
*/
|
|
10
35
|
export declare const FadingOverflow: ({ children, scroll, sides, enableHorizontalScrollWithVerticalWheel, className, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
11
36
|
export {};
|
|
12
37
|
//# sourceMappingURL=FadingOverflow.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FadingOverflow.d.ts","sourceRoot":"","sources":["../../src/components/FadingOverflow.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAsB,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAIxE,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,KAAK,IAAI,GAAG,KAAK,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAA;AAC/C,KAAK,UAAU,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAA;AAErD,UAAU,KAAM,SAAQ,YAAY,EAAE,SAAS;IAC7C,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,uCAAuC,CAAC,EAAE,OAAO,CAAC;IAClD,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC;CAChB;
|
|
1
|
+
{"version":3,"file":"FadingOverflow.d.ts","sourceRoot":"","sources":["../../src/components/FadingOverflow.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAsB,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAIxE,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,KAAK,IAAI,GAAG,KAAK,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAA;AAC/C,KAAK,UAAU,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAA;AAErD,UAAU,KAAM,SAAQ,YAAY,EAAE,SAAS;IAC7C;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB;;;OAGG;IACH,uCAAuC,CAAC,EAAE,OAAO,CAAC;IAClD;;;;;OAKG;IACH,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC;CAChB;AAwFD;;;;GAIG;AACH,eAAO,MAAM,cAAc,8FAC2E,KAAK,4CAoI1G,CAAA"}
|
|
@@ -5,7 +5,13 @@ import { listToClass, theme } from '@stack-spot/portal-theme';
|
|
|
5
5
|
import { debounce } from 'lodash';
|
|
6
6
|
import { useEffect, useRef } from 'react';
|
|
7
7
|
import { styled } from 'styled-components';
|
|
8
|
+
// Scrolling can be very fast, this sets a lower limit for us to run listeners without impacting performance.
|
|
8
9
|
const MIN_CHECK_INTERVAL_MS = 20;
|
|
10
|
+
// The interval which to scroll the content when a scroll arrow is hovered.
|
|
11
|
+
const SCROLL_INTERVAL_MS = 20;
|
|
12
|
+
// This sets the speed of the scroll when the user hovers a scroll arrow.
|
|
13
|
+
const SCROLL_PX = 4;
|
|
14
|
+
// Fade masks
|
|
9
15
|
const masks = {
|
|
10
16
|
right: 'linear-gradient(to left, rgb(0, 0, 0, 0) 0%, rgb(0, 0, 0) min(30%, 100px), rgba(0, 0, 0) 100%)',
|
|
11
17
|
left: 'linear-gradient(to right, rgb(0, 0, 0, 0) 0%, rgb(0, 0, 0) min(30%, 100px), rgba(0, 0, 0) 100%)',
|
|
@@ -83,8 +89,11 @@ const OverflowBox = styled.div `
|
|
|
83
89
|
width: unset;
|
|
84
90
|
}
|
|
85
91
|
`;
|
|
86
|
-
|
|
87
|
-
|
|
92
|
+
/**
|
|
93
|
+
* This component applies a fading graphical effect to its content if it overflows in any of the sides specified by the props.
|
|
94
|
+
*
|
|
95
|
+
* This also controls how this overflow is scrolled, introducing a new scrolling technique, which applies arrows to the overflowing side.
|
|
96
|
+
*/
|
|
88
97
|
export const FadingOverflow = ({ children, scroll = 'none', sides, enableHorizontalScrollWithVerticalWheel, className, ...props }) => {
|
|
89
98
|
const ref = useRef(null);
|
|
90
99
|
useEffect(() => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FadingOverflow.js","sourceRoot":"","sources":["../../src/components/FadingOverflow.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AACtC,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACjF,OAAO,EAAE,WAAW,EAAE,KAAK,EAAa,MAAM,0BAA0B,CAAA;AACxE,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACjC,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;
|
|
1
|
+
{"version":3,"file":"FadingOverflow.js","sourceRoot":"","sources":["../../src/components/FadingOverflow.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AACtC,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACjF,OAAO,EAAE,WAAW,EAAE,KAAK,EAAa,MAAM,0BAA0B,CAAA;AACxE,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACjC,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAgC1C,6GAA6G;AAC7G,MAAM,qBAAqB,GAAG,EAAE,CAAA;AAChC,2EAA2E;AAC3E,MAAM,kBAAkB,GAAG,EAAE,CAAA;AAC7B,yEAAyE;AACzE,MAAM,SAAS,GAAG,CAAC,CAAA;AACnB,aAAa;AACb,MAAM,KAAK,GAAG;IACZ,KAAK,EAAE,gGAAgG;IACvG,IAAI,EAAE,iGAAiG;IACvG,GAAG,EAAE,kGAAkG;IACvG,MAAM,EAAE,+FAA+F;IACvG,UAAU,EAAE,8IAA8I;IAC1J,QAAQ,EAAE,6IAA6I;CACxJ,CAAA;AAED,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MA6BxB,OAAO;0BACa,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsC/C,CAAA;AAED;;;;GAIG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAC5B,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,EAAE,KAAK,EAAE,uCAAuC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAS,EACzG,EAAE;IACF,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAExC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,GAAG,CAAC,OAAO;YAAE,OAAM;QACxB,MAAM,OAAO,GAAG,GAAG,CAAC,OAAO,CAAA;QAC3B,MAAM,OAAO,GAAG,CAAC,KAAK,IAAI,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAA;QAC/C,MAAM,SAAS,GAAG,CAAC,KAAK,IAAI,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAA;QACnD,MAAM,UAAU,GAAG,CAAC,KAAK,IAAI,KAAK,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAA;QACrD,MAAM,QAAQ,GAAG,CAAC,KAAK,IAAI,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAA;QACjD,IAAI,UAA8B,CAAA;QAClC,MAAM,QAAQ,GAAG,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAA;QACpD,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,CAAC,QAAQ,IAAI,SAAS,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAA;QACjE,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,CAAC,OAAO,IAAI,UAAU,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAA;QACjE,IAAI,MAAM,KAAK,QAAQ,IAAI,MAAM,KAAK,OAAO;YAAE,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,oBAAoB,CAAC,CAAA;QAE1F,SAAS,aAAa;YACpB,aAAa,CAAC,UAAU,CAAC,CAAA;QAC3B,CAAC;QAED,SAAS,aAAa;YACpB,mBAAmB;YACnB,MAAM,cAAc,GAAG,OAAO,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW,IAAI,OAAO,CAAC,UAAU,GAAG,CAAC,OAAO,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW,CAAC,CAAA;YACpI,MAAM,aAAa,GAAG,OAAO,CAAC,UAAU,GAAG,CAAC,CAAA;YAC5C,MAAM,YAAY,GAAG,OAAO,CAAC,YAAY,GAAG,OAAO,CAAC,YAAY,IAAI,OAAO,CAAC,SAAS,GAAG,CAAC,OAAO,CAAC,YAAY,GAAG,OAAO,CAAC,YAAY,CAAC,CAAA;YACrI,MAAM,eAAe,GAAG,OAAO,CAAC,SAAS,GAAG,CAAC,CAAA;YAC7C,MAAM,YAAY,GAAa,EAAE,CAAA;YACjC,IAAI,aAAa,IAAI,QAAQ,IAAI,cAAc,IAAI,SAAS;gBAAE,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,CAAA;iBAC5F,CAAC;gBACJ,IAAI,cAAc,IAAI,SAAS;oBAAE,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;gBAC/D,IAAI,aAAa,IAAI,QAAQ;oBAAE,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAA;YAC9D,CAAC;YACD,IAAI,YAAY,IAAI,OAAO,IAAI,eAAe,IAAI,UAAU;gBAAE,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAA;iBAC1F,CAAC;gBACJ,IAAI,YAAY,IAAI,OAAO;oBAAE,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAA;gBACzD,IAAI,eAAe,IAAI,UAAU;oBAAE,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAA;YACpE,CAAC;YACD,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;YAEjD,gBAAgB;YAChB,IAAI,MAAM,KAAK,QAAQ;gBAAE,OAAM;YAE/B,SAAS,cAAc,CAAC,IAAU;gBAChC,aAAa,EAAE,CAAA;gBACf,MAAM,SAAS,GAAG,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,YAAY,CAAA;gBAClF,MAAM,UAAU,GAAG,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;gBACjE,UAAU,GAAG,MAAM,CAAC,WAAW,CAAC,GAAG,EAAE;oBACnC,OAAO,CAAC,SAAS,CAAC,IAAI,SAAS,GAAG,UAAU,CAAA;gBAC9C,CAAC,EAAE,kBAAkB,CAAC,CAAA;YACxB,CAAC;YAED,MAAM,oBAAoB,GAAG;gBAC3B,IAAI,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,MAAM,CAAC;gBAClC,KAAK,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,OAAO,CAAC;gBACpC,GAAG,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,KAAK,CAAC;gBAChC,MAAM,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,QAAQ,CAAC;aACvC,CAAA;YAED,MAAM,iBAAiB,GAAG;gBACxB,IAAI,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,UAAU,GAAG,CAAC;gBAClC,KAAK,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,UAAU,GAAG,OAAO,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW;gBAC3E,GAAG,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,SAAS,GAAG,CAAC;gBAChC,MAAM,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,SAAS,GAAG,OAAO,CAAC,YAAY,GAAG,OAAO,CAAC,YAAY;aAC9E,CAAA;YAED,SAAS,iBAAiB,CAAC,IAAU;gBACnC,MAAM,MAAM,GAAG,OAAO,CAAC,UAAU,EAAE,aAAa,CAAC,cAAc,IAAI,EAAE,CAAC,CAAA;gBACtE,IAAI,MAAM,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC;oBAAE,OAAM;gBACjD,MAAM,EAAE,SAAS,CAAC,GAAG,CAAC,SAAS,CAAC,CAAA;gBAChC,MAAM,EAAE,gBAAgB,CAAC,YAAY,EAAE,oBAAoB,CAAC,IAAI,CAAC,CAAC,CAAA;gBAClE,MAAM,EAAE,gBAAgB,CAAC,YAAY,EAAE,aAAa,CAAC,CAAA;gBACrD,MAAM,EAAE,gBAAgB,CAAC,OAAO,EAAE,iBAAiB,CAAC,IAAI,CAAC,CAAC,CAAA;YAC5D,CAAC;YAED,SAAS,kBAAkB,CAAC,IAAU;gBACpC,MAAM,MAAM,GAAG,OAAO,CAAC,UAAU,EAAE,aAAa,CAAC,cAAc,IAAI,EAAE,CAAC,CAAA;gBACtE,IAAI,CAAC,MAAM,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC;oBAAE,OAAM;gBAClD,MAAM,EAAE,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAA;gBACnC,aAAa,EAAE,CAAA;gBACf,MAAM,EAAE,mBAAmB,CAAC,YAAY,EAAE,oBAAoB,CAAC,IAAI,CAAC,CAAC,CAAA;gBACrE,MAAM,EAAE,mBAAmB,CAAC,YAAY,EAAE,aAAa,CAAC,CAAA;gBACxD,MAAM,EAAE,mBAAmB,CAAC,OAAO,EAAE,iBAAiB,CAAC,IAAI,CAAC,CAAC,CAAA;YAC/D,CAAC;YAED,IAAI,cAAc,IAAI,SAAS;gBAAE,iBAAiB,CAAC,OAAO,CAAC,CAAA;;gBACtD,kBAAkB,CAAC,OAAO,CAAC,CAAA;YAChC,IAAI,aAAa,IAAI,QAAQ;gBAAE,iBAAiB,CAAC,MAAM,CAAC,CAAA;;gBACnD,kBAAkB,CAAC,MAAM,CAAC,CAAA;YAC/B,IAAI,YAAY,IAAI,OAAO;gBAAE,iBAAiB,CAAC,KAAK,CAAC,CAAA;;gBAChD,kBAAkB,CAAC,KAAK,CAAC,CAAA;YAC9B,IAAI,eAAe,IAAI,UAAU;gBAAE,iBAAiB,CAAC,QAAQ,CAAC,CAAA;;gBACzD,kBAAkB,CAAC,QAAQ,CAAC,CAAA;QACnC,CAAC;QAED,MAAM,cAAc,GAAG,QAAQ,CAAC,aAAa,EAAE,qBAAqB,CAAC,CAAA;QACrE,MAAM,cAAc,GAAG,IAAI,cAAc,CAAC,cAAc,CAAC,CAAA;QACzD,cAAc,CAAC,OAAO,CAAC,OAAO,CAAC,CAAA;QAC/B,OAAO,CAAC,gBAAgB,CAAC,QAAQ,EAAE,cAAc,CAAC,CAAA;QAElD,OAAO,GAAG,EAAE;YACV,aAAa,EAAE,CAAA;YACf,cAAc,CAAC,UAAU,EAAE,CAAA;YAC3B,OAAO,CAAC,mBAAmB,CAAC,QAAQ,EAAE,cAAc,CAAC,CAAA;QACvD,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC,CAAA;IAEhC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,uCAAuC,IAAI,CAAC,GAAG,CAAC,OAAO;YAAE,OAAM;QACpE,MAAM,OAAO,GAAG,GAAG,CAAC,OAAO,CAAA;QAE3B,SAAS,eAAe,CAAC,KAAiB;YACxC,IAAI,KAAK,CAAC,MAAM,EAAE,CAAC;gBACjB,OAAO,CAAC,UAAU,IAAI,KAAK,CAAC,MAAM,CAAA;gBAClC,KAAK,CAAC,cAAc,EAAE,CAAA;gBACtB,KAAK,CAAC,eAAe,EAAE,CAAA;YACzB,CAAC;QACH,CAAC;QAED,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,eAAe,CAAC,CAAA;QAClD,OAAO,GAAG,EAAE,CAAC,OAAO,CAAC,mBAAmB,CAAC,OAAO,EAAE,eAAe,CAAC,CAAA;IACpE,CAAC,EAAE,CAAC,GAAG,CAAC,OAAO,EAAE,uCAAuC,CAAC,CAAC,CAAA;IAE1D,OAAO,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,CAC3B,MAAC,WAAW,OAAK,KAAK,EAAE,SAAS,EAAE,WAAW,CAAC,CAAC,eAAe,EAAE,SAAS,CAAC,CAAC,aAC1E,cAAK,SAAS,EAAC,SAAS,EAAC,GAAG,EAAE,GAAG,YAAG,QAAQ,GAAO,EACnD,cAAK,SAAS,EAAC,gBAAgB,iCAAa,KAAC,OAAO,IAAC,IAAI,EAAC,IAAI,YAAC,KAAC,WAAW,KAAG,GAAU,GAAM,EAC9F,cAAK,SAAS,EAAC,iBAAiB,iCAAa,KAAC,OAAO,IAAC,IAAI,EAAC,IAAI,YAAC,KAAC,YAAY,KAAG,GAAU,GAAM,EAChG,cAAK,SAAS,EAAC,eAAe,iCAAa,KAAC,OAAO,IAAC,IAAI,EAAC,IAAI,YAAC,KAAC,SAAS,KAAG,GAAU,GAAM,EAC3F,cAAK,SAAS,EAAC,kBAAkB,iCAAa,KAAC,OAAO,IAAC,IAAI,EAAC,IAAI,YAAC,KAAC,WAAW,KAAG,GAAU,GAAM,IACpF,CACf,CAAC,CAAC,CAAC,KAAC,WAAW,OAAK,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,YAAG,QAAQ,GAAe,CAAA;AACtF,CAAC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FallbackBoundary/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AAI1C,UAAU,KAAM,SAAQ,YAAY;IAClC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;GAEG;AACH,eAAO,MAAM,gBAAgB,gCAAiC,KAAK,4CAMlE,CAAA"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FallbackBoundary/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AAI1C,UAAU,KAAM,SAAQ,YAAY;IAClC;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;GAEG;AACH,eAAO,MAAM,gBAAgB,gCAAiC,KAAK,4CAMlE,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/FallbackBoundary/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEhC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/FallbackBoundary/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEhC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AAanC;;GAEG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAS,EAAE,EAAE,CAAC,CACtE,KAAC,aAAa,IAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,YACzC,KAAC,QAAQ,IAAC,QAAQ,EAAE,KAAC,OAAO,KAAG,YAC5B,QAAQ,GACA,GACG,CACjB,CAAA"}
|
|
@@ -1,10 +1,25 @@
|
|
|
1
1
|
import { WithStyle } from '@stack-spot/portal-theme';
|
|
2
2
|
interface Props<T> extends WithStyle {
|
|
3
|
+
/**
|
|
4
|
+
* The items in the history.
|
|
5
|
+
*/
|
|
3
6
|
items: T[];
|
|
7
|
+
/**
|
|
8
|
+
* A function to render an item.
|
|
9
|
+
*/
|
|
4
10
|
renderItem: (item: T) => React.ReactNode;
|
|
11
|
+
/**
|
|
12
|
+
* A function that returns the date of the item.
|
|
13
|
+
*/
|
|
5
14
|
getDate: (item: T) => Date;
|
|
15
|
+
/**
|
|
16
|
+
* A function that returns a unique id for the item.
|
|
17
|
+
*/
|
|
6
18
|
keygen: (item: T) => React.Key;
|
|
7
19
|
}
|
|
20
|
+
/**
|
|
21
|
+
* Renders a history list, where the items are combined into sections according to their dates.
|
|
22
|
+
*/
|
|
8
23
|
export declare function HistoryList<T>({ getDate, items, keygen, className, style, renderItem }: Props<T>): import("react/jsx-runtime").JSX.Element;
|
|
9
24
|
export {};
|
|
10
25
|
//# sourceMappingURL=HistoryList.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HistoryList.d.ts","sourceRoot":"","sources":["../../src/components/HistoryList.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"HistoryList.d.ts","sourceRoot":"","sources":["../../src/components/HistoryList.tsx"],"names":[],"mappings":"AACA,OAAO,EAAS,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAS3D,UAAU,KAAK,CAAC,CAAC,CAAE,SAAQ,SAAS;IAClC;;OAEG;IACH,KAAK,EAAE,CAAC,EAAE,CAAC;IACX;;OAEG;IACH,UAAU,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IACzC;;OAEG;IACH,OAAO,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IAC3B;;OAEG;IACH,MAAM,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,GAAG,CAAC;CAChC;AAuCD;;GAEG;AACH,wBAAgB,WAAW,CAAC,CAAC,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,UAAU,EAAE,EAAE,KAAK,CAAC,CAAC,CAAC,2CAehG"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
/* eslint-disable no-empty-pattern */
|
|
3
2
|
import { Text } from '@citric/core';
|
|
4
3
|
import { theme } from '@stack-spot/portal-theme';
|
|
5
4
|
import { useTranslate } from '@stack-spot/portal-translate';
|
|
@@ -45,6 +44,9 @@ function dateToSectionName(date) {
|
|
|
45
44
|
const last30Days = subtractDays(todayAtMidnight, 30);
|
|
46
45
|
return date.getTime() >= last30Days.getTime() ? 'last30' : 'older';
|
|
47
46
|
}
|
|
47
|
+
/**
|
|
48
|
+
* Renders a history list, where the items are combined into sections according to their dates.
|
|
49
|
+
*/
|
|
48
50
|
export function HistoryList({ getDate, items, keygen, className, style, renderItem }) {
|
|
49
51
|
const t = useTranslate(dictionary);
|
|
50
52
|
const sections = useMemo(() => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HistoryList.js","sourceRoot":"","sources":["../../src/components/HistoryList.tsx"],"names":[],"mappings":";AAAA,
|
|
1
|
+
{"version":3,"file":"HistoryList.js","sourceRoot":"","sources":["../../src/components/HistoryList.tsx"],"names":[],"mappings":"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"}
|
|
@@ -2,6 +2,9 @@ interface Props extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onCha
|
|
|
2
2
|
icon: React.ReactElement;
|
|
3
3
|
onChange?: (value: string) => void;
|
|
4
4
|
}
|
|
5
|
+
/**
|
|
6
|
+
* A text input with an icon at the left side.
|
|
7
|
+
*/
|
|
5
8
|
export declare const IconInput: ({ icon, onChange, style, className, disabled, onFocus, onBlur, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
6
9
|
export {};
|
|
7
10
|
//# sourceMappingURL=IconInput.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconInput.d.ts","sourceRoot":"","sources":["../../src/components/IconInput.tsx"],"names":[],"mappings":"AAKA,UAAU,KAAM,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,UAAU,CAAC;IACnF,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC;IACzB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAyCD,eAAO,MAAM,SAAS,8EAA+E,KAAK,4CAoBzG,CAAA"}
|
|
1
|
+
{"version":3,"file":"IconInput.d.ts","sourceRoot":"","sources":["../../src/components/IconInput.tsx"],"names":[],"mappings":"AAKA,UAAU,KAAM,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,UAAU,CAAC;IACnF,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC;IACzB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAyCD;;GAEG;AACH,eAAO,MAAM,SAAS,8EAA+E,KAAK,4CAoBzG,CAAA"}
|
|
@@ -41,6 +41,9 @@ const InputBox = styled.div `
|
|
|
41
41
|
}
|
|
42
42
|
}
|
|
43
43
|
`;
|
|
44
|
+
/**
|
|
45
|
+
* A text input with an icon at the left side.
|
|
46
|
+
*/
|
|
44
47
|
export const IconInput = ({ icon, onChange, style, className, disabled, onFocus, onBlur, ...props }) => {
|
|
45
48
|
const [focused, setFocused] = useState(false);
|
|
46
49
|
const { focus, blur } = useMemo(() => ({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconInput.js","sourceRoot":"","sources":["../../src/components/IconInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AACtC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;AAC7D,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAO1C,MAAM,QAAQ,GAAG,MAAM,CAAC,GAAG,CAAA;;;;sBAIL,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;sBAEtB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;oBAKxB,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;4BAChB,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;;;;0BAI1B,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;IAG5C,OAAO;;;;wBAIa,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;aAQjC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,YAAY;;;;;;CAM1C,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,KAAK,EAAS,EAAE,EAAE;IAC5G,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAE7C,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC;QACrC,KAAK,EAAE,CAAC,CAA8C,EAAE,EAAE;YACxD,UAAU,CAAC,IAAI,CAAC,CAAA;YAChB,OAAO,EAAE,CAAC,CAAC,CAAC,CAAA;QACd,CAAC;QACD,IAAI,EAAE,CAAC,CAA8C,EAAE,EAAE;YACvD,UAAU,CAAC,KAAK,CAAC,CAAA;YACjB,MAAM,EAAE,CAAC,CAAC,CAAC,CAAA;QACb,CAAC;KACF,CAAC,EAAE,EAAE,CAAC,CAAA;IAEP,OAAO,CACL,MAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,CAAC,CAAC,SAAS,EAAE,OAAO,IAAI,CAAC,QAAQ,IAAI,SAAS,EAAE,QAAQ,IAAI,UAAU,CAAC,CAAC,aACpH,KAAC,OAAO,cAAE,IAAI,GAAW,EACzB,mBAAW,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,GAAI,IACxG,CACZ,CAAA;AACH,CAAC,CAAA"}
|
|
1
|
+
{"version":3,"file":"IconInput.js","sourceRoot":"","sources":["../../src/components/IconInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AACtC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;AAC7D,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAO1C,MAAM,QAAQ,GAAG,MAAM,CAAC,GAAG,CAAA;;;;sBAIL,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;sBAEtB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;oBAKxB,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;4BAChB,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;;;;0BAI1B,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;IAG5C,OAAO;;;;wBAIa,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;aAQjC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,YAAY;;;;;;CAM1C,CAAA;AAED;;GAEG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,KAAK,EAAS,EAAE,EAAE;IAC5G,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAE7C,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC;QACrC,KAAK,EAAE,CAAC,CAA8C,EAAE,EAAE;YACxD,UAAU,CAAC,IAAI,CAAC,CAAA;YAChB,OAAO,EAAE,CAAC,CAAC,CAAC,CAAA;QACd,CAAC;QACD,IAAI,EAAE,CAAC,CAA8C,EAAE,EAAE;YACvD,UAAU,CAAC,KAAK,CAAC,CAAA;YACjB,MAAM,EAAE,CAAC,CAAC,CAAC,CAAA;QACb,CAAC;KACF,CAAC,EAAE,EAAE,CAAC,CAAA;IAEP,OAAO,CACL,MAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,CAAC,CAAC,SAAS,EAAE,OAAO,IAAI,CAAC,QAAQ,IAAI,SAAS,EAAE,QAAQ,IAAI,UAAU,CAAC,CAAC,aACpH,KAAC,OAAO,cAAE,IAAI,GAAW,EACzB,mBAAW,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,GAAI,IACxG,CACZ,CAAA;AACH,CAAC,CAAA"}
|
|
@@ -2,9 +2,20 @@ import { WithStyle } from '@stack-spot/portal-theme';
|
|
|
2
2
|
import { ButtonAction, WithChildren } from '../types.js';
|
|
3
3
|
import { TooltipPosition } from './Tooltip/types.js';
|
|
4
4
|
interface Props extends WithStyle, WithChildren {
|
|
5
|
+
/**
|
|
6
|
+
* The position of the menu relative to its children.
|
|
7
|
+
*/
|
|
5
8
|
position?: TooltipPosition;
|
|
9
|
+
/**
|
|
10
|
+
* The actions of the menu.
|
|
11
|
+
*/
|
|
6
12
|
actions: ButtonAction[];
|
|
7
13
|
}
|
|
14
|
+
/**
|
|
15
|
+
* A floating menu that shows up when the user clicks the children.
|
|
16
|
+
*
|
|
17
|
+
* This uses the tooltip component to build the menu.
|
|
18
|
+
*/
|
|
8
19
|
export declare const OverlayMenu: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<HTMLDivElement>>;
|
|
9
20
|
export {};
|
|
10
21
|
//# sourceMappingURL=OverlayMenu.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OverlayMenu.d.ts","sourceRoot":"","sources":["../../src/components/OverlayMenu.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"OverlayMenu.d.ts","sourceRoot":"","sources":["../../src/components/OverlayMenu.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAS,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAG3D,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAGrD,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAEjD,UAAU,KAAM,SAAQ,SAAS,EAAE,YAAY;IAC7C;;OAEG;IACH,QAAQ,CAAC,EAAE,eAAe,CAAC;IAC3B;;OAEG;IACH,OAAO,EAAE,YAAY,EAAE,CAAC;CACzB;AAoFD;;;;GAIG;AACH,eAAO,MAAM,WAAW,kGAuBtB,CAAA"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
/* eslint-disable react/display-name */
|
|
3
|
-
/* eslint-disable no-empty-pattern */
|
|
4
3
|
import { IconBox, Text } from '@citric/core';
|
|
5
4
|
import { useKeyboardControls } from '@stack-spot/portal-components';
|
|
6
5
|
import { theme } from '@stack-spot/portal-theme';
|
|
@@ -63,6 +62,11 @@ const Menu = ({ actions, trigger }) => {
|
|
|
63
62
|
tooltip.hide();
|
|
64
63
|
}, children: [_jsx(IconBox, { children: icon }), _jsx(Text, { children: label })] }) }, label))) }));
|
|
65
64
|
};
|
|
65
|
+
/**
|
|
66
|
+
* A floating menu that shows up when the user clicks the children.
|
|
67
|
+
*
|
|
68
|
+
* This uses the tooltip component to build the menu.
|
|
69
|
+
*/
|
|
66
70
|
export const OverlayMenu = forwardRef(({ actions, children, className, position, style }, externalRef) => {
|
|
67
71
|
const localRef = useRef(null);
|
|
68
72
|
const ref = externalRef ?? localRef;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OverlayMenu.js","sourceRoot":"","sources":["../../src/components/OverlayMenu.tsx"],"names":[],"mappings":";AAAA,uCAAuC;AACvC,
|
|
1
|
+
{"version":3,"file":"OverlayMenu.js","sourceRoot":"","sources":["../../src/components/OverlayMenu.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,11 +1,33 @@
|
|
|
1
1
|
import { WithStyle } from '@stack-spot/portal-theme';
|
|
2
2
|
interface Props extends WithStyle {
|
|
3
|
+
/**
|
|
4
|
+
* Whether or not the progress bar is visible.
|
|
5
|
+
*/
|
|
3
6
|
visible?: boolean;
|
|
7
|
+
/**
|
|
8
|
+
* When true, the progress bar becomes very colorful and bright.
|
|
9
|
+
*/
|
|
4
10
|
shimmer?: boolean;
|
|
11
|
+
/**
|
|
12
|
+
* Color to use in the progress bar that appears in the foreground. Arrays create linear gradients.
|
|
13
|
+
* @default primary.500 if shimmer is false, white otherwise.
|
|
14
|
+
*/
|
|
5
15
|
foregroundColor?: string | string[];
|
|
16
|
+
/**
|
|
17
|
+
* Color to use in the progress bar that appears in the background. Arrays create linear gradients.
|
|
18
|
+
* @default light.500 if shimmer is false, a transparent white otherwise.
|
|
19
|
+
*/
|
|
6
20
|
backgroundColor?: string | string[];
|
|
21
|
+
/**
|
|
22
|
+
* Only useful if `shimmer` is true. This allows to customize the colors in the shimmering effect. Arrays create linear gradients.
|
|
23
|
+
* @default ['#ff6633', '#d668cd', '#ff6633', '#FFF8', '#299cf4']
|
|
24
|
+
*/
|
|
7
25
|
shimmerColor?: string | string[];
|
|
8
26
|
}
|
|
27
|
+
/**
|
|
28
|
+
* A progress bar with indefinite progress report. This renders a narrower bar on top of larger one that animates from the left to the
|
|
29
|
+
* right.
|
|
30
|
+
*/
|
|
9
31
|
export declare const ProgressBar: ({ visible, shimmer, backgroundColor, foregroundColor, shimmerColor, className, style, }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
10
32
|
export {};
|
|
11
33
|
//# sourceMappingURL=ProgressBar.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressBar.d.ts","sourceRoot":"","sources":["../../src/components/ProgressBar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsB,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAGxE,UAAU,KAAM,SAAQ,SAAS;IAC/B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,eAAe,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACpC,eAAe,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACpC,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;CAClC;
|
|
1
|
+
{"version":3,"file":"ProgressBar.d.ts","sourceRoot":"","sources":["../../src/components/ProgressBar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsB,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAGxE,UAAU,KAAM,SAAQ,SAAS;IAC/B;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACpC;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACpC;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;CAClC;AAqHD;;;GAGG;AACH,eAAO,MAAM,WAAW,4FAQrB,KAAK,4CAmBP,CAAA"}
|
|
@@ -13,6 +13,7 @@ function gradientFromColorArray(colors) {
|
|
|
13
13
|
}
|
|
14
14
|
return `linear-gradient(to right, ${partials.join(', ')})`;
|
|
15
15
|
}
|
|
16
|
+
// the shimmering effect requires more space
|
|
16
17
|
const SHIMMER_PADDING = '10px';
|
|
17
18
|
const Styled = styled.div `
|
|
18
19
|
margin: 7px 0;
|
|
@@ -113,6 +114,10 @@ const Styled = styled.div `
|
|
|
113
114
|
}
|
|
114
115
|
}
|
|
115
116
|
`;
|
|
117
|
+
/**
|
|
118
|
+
* A progress bar with indefinite progress report. This renders a narrower bar on top of larger one that animates from the left to the
|
|
119
|
+
* right.
|
|
120
|
+
*/
|
|
116
121
|
export const ProgressBar = ({ visible = true, shimmer, backgroundColor = shimmer ? 'rgba(255, 255, 255, 0.4)' : theme.color.light[500], foregroundColor = shimmer ? ['#FFF0', '#FFF', '#FFF0'] : theme.color.primary[500], shimmerColor = ['#ff6633', '#d668cd', '#ff6633', '#FFF8', '#299cf4'], className, style, }) => {
|
|
117
122
|
const $bg = Array.isArray(backgroundColor) ? backgroundColor : [backgroundColor];
|
|
118
123
|
const $fg = Array.isArray(foregroundColor) ? foregroundColor : [...$bg, foregroundColor, ...$bg];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressBar.js","sourceRoot":"","sources":["../../src/components/ProgressBar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,KAAK,EAAa,MAAM,0BAA0B,CAAA;AACxE,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;
|
|
1
|
+
{"version":3,"file":"ProgressBar.js","sourceRoot":"","sources":["../../src/components/ProgressBar.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"QuickStartButton.d.ts","sourceRoot":"","sources":["../../src/components/QuickStartButton.tsx"],"names":[],"mappings":"AACA,OAAO,EAAS,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAE3D,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,UAAU,KAAM,SAAQ,YAAY,EAAE,SAAS;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;
|
|
1
|
+
{"version":3,"file":"QuickStartButton.d.ts","sourceRoot":"","sources":["../../src/components/QuickStartButton.tsx"],"names":[],"mappings":"AACA,OAAO,EAAS,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAE3D,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,UAAU,KAAM,SAAQ,YAAY,EAAE,SAAS;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAyCD,eAAO,MAAM,gBAAgB,kEAAmE,KAAK,4CAKpG,CAAA"}
|
|
@@ -2,6 +2,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { IconBox, Text } from '@citric/core';
|
|
3
3
|
import { theme } from '@stack-spot/portal-theme';
|
|
4
4
|
import { styled } from 'styled-components';
|
|
5
|
+
/**
|
|
6
|
+
* A button for quick starting a conversation.
|
|
7
|
+
*/
|
|
5
8
|
const QuickButton = styled.button `
|
|
6
9
|
display: flex;
|
|
7
10
|
flex-direction: column;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"QuickStartButton.js","sourceRoot":"","sources":["../../src/components/QuickStartButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAC5C,OAAO,EAAE,KAAK,EAAa,MAAM,0BAA0B,CAAA;AAC3D,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAO1C,MAAM,WAAW,GAAG,MAAM,CAAC,MAAM,CAAmC;;;;;sBAK9C,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;kBAM1B,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;oBAMpB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;wBAQlB,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,CAAC,GAAG,IAAI,aAAa;MACnD,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,MAAM;IACxB,CAAC,CAAC;;gBAEU,MAAM;QACd;IACJ,CAAC,CAAC,EACN;;CAEC,CAAA;AAED,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAS,EAAE,EAAE,CAAC,CACxG,MAAC,WAAW,IAAC,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,YAAU,KAAK,SAAO,UAAU,aAC/F,KAAC,OAAO,mCAAc,IAAI,GAAW,EACrC,KAAC,IAAI,cAAE,KAAK,GAAQ,IACR,CACf,CAAA"}
|
|
1
|
+
{"version":3,"file":"QuickStartButton.js","sourceRoot":"","sources":["../../src/components/QuickStartButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAC5C,OAAO,EAAE,KAAK,EAAa,MAAM,0BAA0B,CAAA;AAC3D,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAO1C;;GAEG;AACH,MAAM,WAAW,GAAG,MAAM,CAAC,MAAM,CAAmC;;;;;sBAK9C,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;kBAM1B,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;oBAMpB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;wBAQlB,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,CAAC,GAAG,IAAI,aAAa;MACnD,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,MAAM;IACxB,CAAC,CAAC;;gBAEU,MAAM;QACd;IACJ,CAAC,CAAC,EACN;;CAEC,CAAA;AAED,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAS,EAAE,EAAE,CAAC,CACxG,MAAC,WAAW,IAAC,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,YAAU,KAAK,SAAO,UAAU,aAC/F,KAAC,OAAO,mCAAc,IAAI,GAAW,EACrC,KAAC,IAAI,cAAE,KAAK,GAAQ,IACR,CACf,CAAA"}
|
|
@@ -1,5 +1,8 @@
|
|
|
1
1
|
import { PropsOf } from '../types.js';
|
|
2
2
|
declare const Form: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").FormHTMLAttributes<HTMLFormElement>, HTMLFormElement>, never>> & string;
|
|
3
|
+
/**
|
|
4
|
+
* A form that goes into a right panel. This controls style, errors, loading focus and form submission.
|
|
5
|
+
*/
|
|
3
6
|
export declare const RightPanelForm: ({ children, onSubmit, ...props }: PropsOf<typeof Form>) => import("react/jsx-runtime").JSX.Element;
|
|
4
7
|
export {};
|
|
5
8
|
//# sourceMappingURL=RightPanelForm.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RightPanelForm.d.ts","sourceRoot":"","sources":["../../src/components/RightPanelForm.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAA;AAIlC,QAAA,MAAM,IAAI,8OAmCT,CAAA;AAED,eAAO,MAAM,cAAc,qCAAsC,OAAO,CAAC,OAAO,IAAI,CAAC,4CAcpF,CAAA"}
|
|
1
|
+
{"version":3,"file":"RightPanelForm.d.ts","sourceRoot":"","sources":["../../src/components/RightPanelForm.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAA;AAIlC,QAAA,MAAM,IAAI,8OAmCT,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,cAAc,qCAAsC,OAAO,CAAC,OAAO,IAAI,CAAC,4CAcpF,CAAA"}
|
|
@@ -39,6 +39,9 @@ const Form = styled.form `
|
|
|
39
39
|
fill: transparent;
|
|
40
40
|
}
|
|
41
41
|
`;
|
|
42
|
+
/**
|
|
43
|
+
* A form that goes into a right panel. This controls style, errors, loading focus and form submission.
|
|
44
|
+
*/
|
|
42
45
|
export const RightPanelForm = ({ children, onSubmit, ...props }) => (_jsx(FallbackBoundary, { children: _jsx(AutoFocus, { children: _jsx(Form, { ...props, onSubmit: (e) => {
|
|
43
46
|
e.preventDefault();
|
|
44
47
|
onSubmit?.(e);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RightPanelForm.js","sourceRoot":"","sources":["../../src/components/RightPanelForm.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAE1C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAErD,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAgCpB,IAAI;;;CAGP,CAAA;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAwB,EAAE,EAAE,CAAC,CACxF,KAAC,gBAAgB,cACf,KAAC,SAAS,cACR,KAAC,IAAI,OACC,KAAK,EACT,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;gBACd,CAAC,CAAC,cAAc,EAAE,CAAA;gBAClB,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAA;YACf,CAAC,YAEA,QAAQ,GACJ,GACG,GACK,CACpB,CAAA"}
|
|
1
|
+
{"version":3,"file":"RightPanelForm.js","sourceRoot":"","sources":["../../src/components/RightPanelForm.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAE1C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAErD,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAgCpB,IAAI;;;CAGP,CAAA;AAED;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAwB,EAAE,EAAE,CAAC,CACxF,KAAC,gBAAgB,cACf,KAAC,SAAS,cACR,KAAC,IAAI,OACC,KAAK,EACT,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;gBACd,CAAC,CAAC,cAAc,EAAE,CAAA;gBAClB,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAA;YACf,CAAC,YAEA,QAAQ,GACJ,GACG,GACK,CACpB,CAAA"}
|
|
@@ -5,6 +5,9 @@ interface Tab {
|
|
|
5
5
|
interface Props {
|
|
6
6
|
tabs: Tab[];
|
|
7
7
|
}
|
|
8
|
+
/**
|
|
9
|
+
* Tabs for the right panel content.
|
|
10
|
+
*/
|
|
8
11
|
export declare const RightPanelTabs: ({ tabs }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
9
12
|
export {};
|
|
10
13
|
//# sourceMappingURL=RightPanelTabs.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RightPanelTabs.d.ts","sourceRoot":"","sources":["../../src/components/RightPanelTabs.tsx"],"names":[],"mappings":"AAKA,UAAU,GAAG;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B;AAED,UAAU,KAAK;IACb,IAAI,EAAE,GAAG,EAAE,CAAC;CACb;AAcD,eAAO,MAAM,cAAc,aAAc,KAAK,4CAa7C,CAAA"}
|
|
1
|
+
{"version":3,"file":"RightPanelTabs.d.ts","sourceRoot":"","sources":["../../src/components/RightPanelTabs.tsx"],"names":[],"mappings":"AAKA,UAAU,GAAG;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B;AAED,UAAU,KAAK;IACb,IAAI,EAAE,GAAG,EAAE,CAAC;CACb;AAcD;;GAEG;AACH,eAAO,MAAM,cAAc,aAAc,KAAK,4CAa7C,CAAA"}
|
|
@@ -13,6 +13,9 @@ const StyledTabsItem = styled(TabsItem) `
|
|
|
13
13
|
flex: 1;
|
|
14
14
|
overflow: hidden;
|
|
15
15
|
`;
|
|
16
|
+
/**
|
|
17
|
+
* Tabs for the right panel content.
|
|
18
|
+
*/
|
|
16
19
|
export const RightPanelTabs = ({ tabs }) => {
|
|
17
20
|
const [currentTab, setCurrentTab] = useState(0);
|
|
18
21
|
const tabItems = useMemo(() => tabs.map(({ content, title }) => (_jsx(StyledTabsItem, { title: title, children: _jsx(RightPanelForm, { children: content }) }, title))), [tabs]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RightPanelTabs.js","sourceRoot":"","sources":["../../src/components/RightPanelTabs.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAC3C,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAWjD,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;;;;CAK9B,CAAA;AAED,MAAM,cAAc,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAA;;;CAGtC,CAAA;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,IAAI,EAAS,EAAE,EAAE;IAChD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAA;IAC/C,MAAM,QAAQ,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAC9D,KAAC,cAAc,IAAa,KAAK,EAAE,KAAK,YACtC,KAAC,cAAc,cAAE,OAAO,GAAkB,IADvB,KAAK,CAET,CAClB,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAA;IAEX,OAAO,CACL,KAAC,UAAU,IAAC,WAAW,EAAE,UAAU,EAAE,QAAQ,EAAE,aAAa,YACzD,QAAQ,GACE,CACd,CAAA;AACH,CAAC,CAAA"}
|
|
1
|
+
{"version":3,"file":"RightPanelTabs.js","sourceRoot":"","sources":["../../src/components/RightPanelTabs.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAC3C,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAWjD,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;;;;CAK9B,CAAA;AAED,MAAM,cAAc,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAA;;;CAGtC,CAAA;AAED;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,IAAI,EAAS,EAAE,EAAE;IAChD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAA;IAC/C,MAAM,QAAQ,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAC9D,KAAC,cAAc,IAAa,KAAK,EAAE,KAAK,YACtC,KAAC,cAAc,cAAE,OAAO,GAAkB,IADvB,KAAK,CAET,CAClB,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAA;IAEX,OAAO,CACL,KAAC,UAAU,IAAC,WAAW,EAAE,UAAU,EAAE,QAAQ,EAAE,aAAa,YACzD,QAAQ,GACE,CACd,CAAA;AACH,CAAC,CAAA"}
|
|
@@ -29,6 +29,12 @@ interface Props<T, Key extends React.Key> {
|
|
|
29
29
|
*/
|
|
30
30
|
renderLabel: (tab: T) => React.ReactElement;
|
|
31
31
|
}
|
|
32
|
+
/**
|
|
33
|
+
* Renders and manages a list of tabs. With this, tabs can be selected and removed. Furthermore, extra buttons can be placed after all tabs,
|
|
34
|
+
* e.g. a button to add more tabs.
|
|
35
|
+
*
|
|
36
|
+
* Used for the chat tabs.
|
|
37
|
+
*/
|
|
32
38
|
export declare function TabManager<T, Key extends React.Key>({ active, tabs, keygen, onRemove, onSelect, renderLabel, buttons }: Props<T, Key>): import("react/jsx-runtime").JSX.Element;
|
|
33
39
|
export {};
|
|
34
40
|
//# sourceMappingURL=TabManager.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabManager.d.ts","sourceRoot":"","sources":["../../src/components/TabManager.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAGvC,UAAU,KAAK,CAAC,CAAC,EAAE,GAAG,SAAS,KAAK,CAAC,GAAG;IACtC;;OAEG;IACH,IAAI,EAAE,CAAC,EAAE,CAAC;IACV;;OAEG;IACH,MAAM,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,GAAG,CAAC;IACxB;;OAEG;IACH,MAAM,EAAE,GAAG,CAAC;IACZ;;OAEG;IACH,QAAQ,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,IAAI,CAAC;IAC3B;;OAEG;IACH,QAAQ,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,IAAI,CAAC;IAC3B;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,EAAE,CAAC;IACzB;;OAEG;IACH,WAAW,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,KAAK,CAAC,YAAY,CAAC;CAC7C;
|
|
1
|
+
{"version":3,"file":"TabManager.d.ts","sourceRoot":"","sources":["../../src/components/TabManager.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAGvC,UAAU,KAAK,CAAC,CAAC,EAAE,GAAG,SAAS,KAAK,CAAC,GAAG;IACtC;;OAEG;IACH,IAAI,EAAE,CAAC,EAAE,CAAC;IACV;;OAEG;IACH,MAAM,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,GAAG,CAAC;IACxB;;OAEG;IACH,MAAM,EAAE,GAAG,CAAC;IACZ;;OAEG;IACH,QAAQ,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,IAAI,CAAC;IAC3B;;OAEG;IACH,QAAQ,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,IAAI,CAAC;IAC3B;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,EAAE,CAAC;IACzB;;OAEG;IACH,WAAW,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,KAAK,CAAC,YAAY,CAAC;CAC7C;AA4HD;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,CAAC,EAAE,GAAG,SAAS,KAAK,CAAC,GAAG,EACjD,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,WAAW,EAAE,OAAY,EAAE,EAAE,KAAK,CAAC,CAAC,EAAE,GAAG,CAAC,2CAgDvF"}
|
|
@@ -8,7 +8,9 @@ import { last } from 'lodash';
|
|
|
8
8
|
import { useCallback, useEffect, useMemo, useRef } from 'react';
|
|
9
9
|
import { styled } from 'styled-components';
|
|
10
10
|
import { FadingOverflow } from './FadingOverflow.js';
|
|
11
|
+
// The size of extra buttons placed after the tabs.
|
|
11
12
|
const EXTRA_BTN_SIZE = 24;
|
|
13
|
+
// The margin of extra buttons placed after the tabs.
|
|
12
14
|
const EXTRA_BTN_MARGIN = 8;
|
|
13
15
|
const Tabs = styled.nav `
|
|
14
16
|
width: 100%;
|
|
@@ -126,6 +128,12 @@ const Tabs = styled.nav `
|
|
|
126
128
|
}
|
|
127
129
|
}
|
|
128
130
|
`;
|
|
131
|
+
/**
|
|
132
|
+
* Renders and manages a list of tabs. With this, tabs can be selected and removed. Furthermore, extra buttons can be placed after all tabs,
|
|
133
|
+
* e.g. a button to add more tabs.
|
|
134
|
+
*
|
|
135
|
+
* Used for the chat tabs.
|
|
136
|
+
*/
|
|
129
137
|
export function TabManager({ active, tabs, keygen, onRemove, onSelect, renderLabel, buttons = [] }) {
|
|
130
138
|
const t = useTranslate(dictionary);
|
|
131
139
|
const tabList = useRef(null);
|