@stack-spot/ai-chat-widget 1.0.0-dev.1768423745486 → 1.0.0-dev.1768480603636

package/dist/components/FadingOverflow.js

@@ -0,0 +1,224 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon } from '@stack-spot/citric-icons';
+import { listToClass, theme } from '@stack-spot/portal-theme';
+import { debounce } from 'lodash';
+import { useEffect, useRef } from 'react';
+import { styled } from 'styled-components';
+// Scrolling can be very fast, this sets a lower limit for us to run listeners without impacting performance.
+const MIN_CHECK_INTERVAL_MS = 20;
+// The interval which to scroll the content when a scroll arrow is hovered.
+const SCROLL_INTERVAL_MS = 20;
+// This sets the speed of the scroll when the user hovers a scroll arrow.
+const SCROLL_PX = 4;
+// Fade masks
+const masks = {
+    right: 'linear-gradient(to left, rgb(0, 0, 0, 0) 0%, rgb(0, 0, 0) min(30%, 100px), rgba(0, 0, 0) 100%)',
+    left: 'linear-gradient(to right, rgb(0, 0, 0, 0) 0%, rgb(0, 0, 0) min(30%, 100px), rgba(0, 0, 0) 100%)',
+    top: 'linear-gradient(to top, rgb(0, 0, 0, 0) 0%, rgb(0, 0, 0) min(30%, 100px), rgba(0, 0, 0) 100%)',
+    bottom: 'linear-gradient(to bottom, rgb(0, 0, 0, 0) 0%, rgb(0, 0, 0) min(30%, 100px), rgba(0, 0, 0) 100%)',
+    horizontal: 'linear-gradient(to left, rgb(0, 0, 0, 0) 0%, rgb(0, 0, 0) min(30%, 100px), rgb(0, 0, 0) max(70%, calc(100% - 100px)), rgba(0, 0, 0, 0) 100%)',
+    vertical: 'linear-gradient(to top, rgb(0, 0, 0, 0) 0%, rgb(0, 0, 0) min(30%, 100px), rgb(0, 0, 0) max(70%, calc(100% - 100px)), rgba(0, 0, 0, 0) 100%)',
+};
+const OverflowBox = styled.div `
+  &.hidden-scroll-bars::-webkit-scrollbar, &.scroll-arrows ::-webkit-scrollbar {
+    width: 0;
+    height: 0;
+  }
+
+  &.scroll-arrows {
+    position: relative;
+
+    > .content {
+      width: 100%;
+    }
+  }
+
+  .scroll-to-left, .scroll-to-right, .scroll-to-top, .scroll-to-bottom {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    width: 30px;
+    height: 30px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    opacity: 0;
+    pointer-events: none;
+    transition: opacity 0.3s;
+
+    .citric-icon {
+      background-color: ${theme.color.light[300]};
+      border-radius: 50%;
+      width: 16px;
+      height: 16px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    &.visible {
+      opacity: 0.6;
+      pointer-events: auto;
+
+      &:hover {
+        opacity: 1;
+      }
+    }
+  }
+
+  .scroll-to-left {
+    right: unset;
+    height: unset;
+  }
+  
+  .scroll-to-right {
+    left: unset;
+    height: unset;
+  }
+  
+  .scroll-to-top {
+    bottom: unset;
+    width: unset;
+  }
+  
+  .scroll-to-bottom {
+    top: unset;
+    width: unset;
+  }
+`;
+/**
+ * This component applies a fading graphical effect to its content if it overflows in any of the sides specified by the props.
+ *
+ * This also controls how this overflow is scrolled, introducing a new scrolling technique, which applies arrows to the overflowing side.
+ */
+export const FadingOverflow = ({ children, scroll = 'none', sides, enableHorizontalScrollWithVerticalWheel, className, ...props }) => {
+    const ref = useRef(null);
+    useEffect(() => {
+        if (!ref.current)
+            return;
+        const element = ref.current;
+        const fadeTop = !sides || sides.includes('top');
+        const fadeRight = !sides || sides.includes('right');
+        const fadeBottom = !sides || sides.includes('bottom');
+        const fadeLeft = !sides || sides.includes('left');
+        let intervalId;
+        const overflow = scroll === 'none' ? 'clip' : 'auto';
+        element.style.overflowX = (fadeLeft || fadeRight) ? overflow : '';
+        element.style.overflowY = (fadeTop || fadeBottom) ? overflow : '';
+        if (scroll === 'arrows' || scroll === 'wheel')
+            element.classList.add('hidden-scroll-bars');
+        function stopScrolling() {
+            clearInterval(intervalId);
+        }
+        function checkOverflow() {
+            // masking (fading)
+            const overflowsRight = element.clientWidth < element.scrollWidth && element.scrollLeft < (element.scrollWidth - element.clientWidth);
+            const overflowsLeft = element.scrollLeft > 0;
+            const overflowsTop = element.clientHeight < element.scrollHeight && element.scrollTop < (element.scrollHeight - element.clientHeight);
+            const overflowsBottom = element.scrollTop > 0;
+            const masksToApply = [];
+            if (overflowsLeft && fadeLeft && overflowsRight && fadeRight)
+                masksToApply.push(masks.horizontal);
+            else {
+                if (overflowsRight && fadeRight)
+                    masksToApply.push(masks.right);
+                if (overflowsLeft && fadeLeft)
+                    masksToApply.push(masks.left);
+            }
+            if (overflowsTop && fadeTop && overflowsBottom && fadeBottom)
+                masksToApply.push(masks.vertical);
+            else {
+                if (overflowsTop && fadeTop)
+                    masksToApply.push(masks.top);
+                if (overflowsBottom && fadeBottom)
+                    masksToApply.push(masks.bottom);
+            }
+            element.style.maskImage = masksToApply.join(', ');
+            // arrow buttons
+            if (scroll !== 'arrows')
+                return;
+            function startScrolling(side) {
+                stopScrolling();
+                const direction = side === 'bottom' || side === 'top' ? 'scrollTop' : 'scrollLeft';
+                const multiplier = side === 'bottom' || side === 'right' ? 1 : -1;
+                intervalId = window.setInterval(() => {
+                    element[direction] += SCROLL_PX * multiplier;
+                }, SCROLL_INTERVAL_MS);
+            }
+            const startScrollingBySide = {
+                left: () => startScrolling('left'),
+                right: () => startScrolling('right'),
+                top: () => startScrolling('top'),
+                bottom: () => startScrolling('bottom'),
+            };
+            const scrollToMaxBySide = {
+                left: () => element.scrollLeft = 0,
+                right: () => element.scrollLeft = element.scrollWidth - element.clientWidth,
+                top: () => element.scrollTop = 0,
+                bottom: () => element.scrollTop = element.scrollHeight - element.clientHeight,
+            };
+            function enableArrowButton(side) {
+                const button = element.parentNode?.querySelector(`.scroll-to-${side}`);
+                if (button?.classList.contains('visible'))
+                    return;
+                button?.classList.add('visible');
+                button?.addEventListener('mouseenter', startScrollingBySide[side]);
+                button?.addEventListener('mouseleave', stopScrolling);
+                button?.addEventListener('click', scrollToMaxBySide[side]);
+            }
+            function disableArrowButton(side) {
+                const button = element.parentNode?.querySelector(`.scroll-to-${side}`);
+                if (!button?.classList.contains('visible'))
+                    return;
+                button?.classList.remove('visible');
+                stopScrolling();
+                button?.removeEventListener('mouseenter', startScrollingBySide[side]);
+                button?.removeEventListener('mouseleave', stopScrolling);
+                button?.removeEventListener('click', scrollToMaxBySide[side]);
+            }
+            if (overflowsRight && fadeRight)
+                enableArrowButton('right');
+            else
+                disableArrowButton('right');
+            if (overflowsLeft && fadeLeft)
+                enableArrowButton('left');
+            else
+                disableArrowButton('left');
+            if (overflowsTop && fadeTop)
+                enableArrowButton('top');
+            else
+                disableArrowButton('top');
+            if (overflowsBottom && fadeBottom)
+                enableArrowButton('bottom');
+            else
+                disableArrowButton('bottom');
+        }
+        const debouncedCheck = debounce(checkOverflow, MIN_CHECK_INTERVAL_MS);
+        const resizeObserver = new ResizeObserver(debouncedCheck);
+        resizeObserver.observe(element);
+        element.addEventListener('scroll', debouncedCheck);
+        return () => {
+            stopScrolling();
+            resizeObserver.disconnect();
+            element.removeEventListener('scroll', debouncedCheck);
+        };
+    }, [sides, ref.current, scroll]);
+    useEffect(() => {
+        if (!enableHorizontalScrollWithVerticalWheel || !ref.current)
+            return;
+        const element = ref.current;
+        function scrollWithWheel(event) {
+            if (event.deltaY) {
+                element.scrollLeft += event.deltaY;
+                event.preventDefault();
+                event.stopPropagation();
+            }
+        }
+        element.addEventListener('wheel', scrollWithWheel);
+        return () => element.removeEventListener('wheel', scrollWithWheel);
+    }, [ref.current, enableHorizontalScrollWithVerticalWheel]);
+    return scroll === 'arrows' ? (_jsxs(OverflowBox, { ...props, className: listToClass(['scroll-arrows', className]), children: [_jsx("div", { className: "content", ref: ref, children: children }), _jsx("div", { className: "scroll-to-left", "aria-hidden": true, children: _jsx(Icon, { icon: "ChevronLeft", size: "xs" }) }), _jsx("div", { className: "scroll-to-right", "aria-hidden": true, children: _jsx(Icon, { icon: "ChevronRight", size: "xs" }) }), _jsx("div", { className: "scroll-to-top", "aria-hidden": true, children: _jsx(Icon, { icon: "ChevronUp", size: "xs" }) }), _jsx("div", { className: "scroll-to-bottom", "aria-hidden": true, children: _jsx(Icon, { icon: "ChevronDown", size: "xs" }) })] })) : _jsx(OverflowBox, { ...props, className: className, ref: ref, children: children });
+};
+//# sourceMappingURL=FadingOverflow.js.map

package/dist/components/FadingOverflow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FadingOverflow.js","sourceRoot":"","sources":["../../src/components/FadingOverflow.tsx"],"names":[],"mappings":"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"}

package/dist/components/FileDescription.d.ts

@@ -0,0 +1,10 @@
+import { FileUploadStatus } from '../utils/upload/types.js';
+export interface FileDescriptionProps {
+    fileName: string;
+    icon?: React.ReactNode;
+    status?: FileUploadStatus;
+    onRemove?: () => void;
+    onRetry?: () => void;
+}
+export declare const FileDescription: ({ fileName, icon, status, onRemove, onRetry }: FileDescriptionProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=FileDescription.d.ts.map

package/dist/components/FileDescription.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileDescription.d.ts","sourceRoot":"","sources":["../../src/components/FileDescription.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAA;AAExD,MAAM,WAAW,oBAAoB;IACnC,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAC1B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AA6DD,eAAO,MAAM,eAAe,kDAAmD,oBAAoB,4CA4BlG,CAAA"}

package/dist/components/FileDescription.js

@@ -0,0 +1,84 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon } from '@stack-spot/citric-icons';
+import { IconButton, ProgressCircular, Text } from '@stack-spot/citric-react';
+import { theme } from '@stack-spot/portal-theme';
+import { useTranslate } from '@stack-spot/portal-translate';
+import { styled } from 'styled-components';
+const Styled = styled.div `
+  padding: 4px;
+  border-radius: 4px;
+  display: flex;
+  gap: 8px;
+  background-color: ${theme.color.light[600]};
+  box-sizing: border-box;
+  &.error {
+    border: 1px solid ${theme.color.danger[500]};
+  }
+  &.pending .status {
+    cursor: progress;
+  }
+  .image {
+    border-radius: 4px;
+    overflow: hidden;
+    background-color: ${theme.color.light[500]};
+    width: 28px;
+    aspect-ratio: 1;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    position: relative;
+    img {
+      width: 100%;
+    }
+    .status {
+      position: absolute;
+      background-color: rgba(0, 0, 0, 0.5);
+      top: 0;
+      left: 0;
+      bottom: 0;
+      right: 0;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      button {
+        padding: 2px;
+      }
+    }
+  }
+  .details {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    small {
+      max-width: 100px;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+      overflow: hidden;
+      line-height: 1;
+    }
+  }
+  button {
+    padding: 0;
+    margin: -2px -2px 0 0;
+  }
+`;
+export const FileDescription = ({ fileName, icon, status, onRemove, onRetry }) => {
+    const t = useTranslate(dictionary);
+    const [, name, extension] = fileName.match(/(.+)\.([^.]+)$/) ?? ['', 'Unknown', 'Unknown'];
+    return (_jsxs(Styled, { className: status, "aria-busy": status === 'pending', children: [_jsxs("div", { className: "image", children: [icon ?? _jsx(Icon, { icon: "Document" }), status === 'pending' && _jsx("div", { className: "status", "aria-label": t.loading, children: _jsx(ProgressCircular, { size: "xs" }) }), status === 'error' && _jsx("div", { className: "status", "aria-label": t.error, children: _jsx(IconButton, { icon: "Sync", appearance: "circle", color: "danger", title: t.retry, "aria-label": t.retry, onClick: onRetry }) })] }), _jsxs("div", { className: "details", children: [_jsx(Text, { appearance: "microtext1", className: "name", title: name, children: name }), _jsx(Text, { appearance: "microtext1", color: "light.700", children: extension.toUpperCase() })] }), onRemove && _jsx(IconButton, { icon: "TimesMini", onClick: onRemove, title: t.remove, "arial-label": `${t.remove} ${name}`, style: { alignSelf: 'start' }, size: "xs" })] }));
+};
+const dictionary = {
+    en: {
+        loading: 'Uploading file',
+        retry: 'Retry failed upload',
+        remove: 'Remove',
+        error: 'Error while uploading file',
+    },
+    pt: {
+        loading: 'Carregando arquivo',
+        retry: 'Tentar subir novamente o arquivo com falha',
+        remove: 'Remover',
+        error: 'Erro ao carregar o arquivo',
+    },
+};
+//# sourceMappingURL=FileDescription.js.map

package/dist/components/FileDescription.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileDescription.js","sourceRoot":"","sources":["../../src/components/FileDescription.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,0BAA0B,CAAA;AAC/C,OAAO,EAAE,UAAU,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,0BAA0B,CAAA;AAC7E,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;AAChD,OAAO,EAAc,YAAY,EAAE,MAAM,8BAA8B,CAAA;AACvE,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAW1C,MAAM,MAAM,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;sBAKH,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;wBAGpB,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC;;;;;;;;wBAQvB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyC7C,CAAA;AAED,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAwB,EAAE,EAAE;IACrG,MAAM,CAAC,GAAG,YAAY,CAAC,UAAU,CAAC,CAAA;IAClC,MAAM,CAAC,EAAE,IAAI,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,EAAE,SAAS,EAAE,SAAS,CAAC,CAAA;IAC1F,OAAO,CACL,MAAC,MAAM,IAAC,SAAS,EAAE,MAAM,eAAa,MAAM,KAAK,SAAS,aACxD,eAAK,SAAS,EAAC,OAAO,aACnB,IAAI,IAAI,KAAC,IAAI,IAAC,IAAI,EAAC,UAAU,GAAG,EAChC,MAAM,KAAK,SAAS,IAAI,cAAK,SAAS,EAAC,QAAQ,gBAAa,CAAC,CAAC,OAAO,YACpE,KAAC,gBAAgB,IAAC,IAAI,EAAC,IAAI,GAAG,GAC1B,EACL,MAAM,KAAK,OAAO,IAAI,cAAK,SAAS,EAAC,QAAQ,gBAAa,CAAC,CAAC,KAAK,YAChE,KAAC,UAAU,IAAC,IAAI,EAAC,MAAM,EAAC,UAAU,EAAC,QAAQ,EAAC,KAAK,EAAC,QAAQ,EAAC,KAAK,EAAE,CAAC,CAAC,KAAK,gBAAc,CAAC,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,GAAI,GAChH,IACF,EACN,eAAK,SAAS,EAAC,SAAS,aACtB,KAAC,IAAI,IAAC,UAAU,EAAC,YAAY,EAAC,SAAS,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,YAAG,IAAI,GAAQ,EACzE,KAAC,IAAI,IAAC,UAAU,EAAC,YAAY,EAAC,KAAK,EAAC,WAAW,YAAE,SAAS,CAAC,WAAW,EAAE,GAAQ,IAC5E,EACL,QAAQ,IAAI,KAAC,UAAU,IACtB,IAAI,EAAC,WAAW,EAChB,OAAO,EAAE,QAAQ,EACjB,KAAK,EAAE,CAAC,CAAC,MAAM,iBACF,GAAG,CAAC,CAAC,MAAM,IAAI,IAAI,EAAE,EAClC,KAAK,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,EAC7B,IAAI,EAAC,IAAI,GACT,IACK,CACV,CAAA;AACH,CAAC,CAAA;AAED,MAAM,UAAU,GAAG;IACjB,EAAE,EAAE;QACF,OAAO,EAAE,gBAAgB;QACzB,KAAK,EAAE,qBAAqB;QAC5B,MAAM,EAAE,QAAQ;QAChB,KAAK,EAAE,4BAA4B;KACpC;IACD,EAAE,EAAE;QACF,OAAO,EAAE,oBAAoB;QAC7B,KAAK,EAAE,4CAA4C;QACnD,MAAM,EAAE,SAAS;QACjB,KAAK,EAAE,4BAA4B;KACpC;CACmB,CAAA"}

package/dist/components/HistoryList.d.ts

@@ -0,0 +1,25 @@
+import { WithStyle } from '@stack-spot/portal-theme';
+interface Props<T> extends WithStyle {
+    /**
+     * The items in the history.
+     */
+    items: T[];
+    /**
+     * A function to render an item.
+     */
+    renderItem: (item: T) => React.ReactNode;
+    /**
+     * A function that returns the date of the item.
+     */
+    getDate: (item: T) => Date;
+    /**
+     * A function that returns a unique id for the item.
+     */
+    keygen: (item: T) => React.Key;
+}
+/**
+ * Renders a history list, where the items are combined into sections according to their dates.
+ */
+export declare function HistoryList<T>({ getDate, items, keygen, className, style, renderItem }: Props<T>): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=HistoryList.d.ts.map

package/dist/components/HistoryList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HistoryList.d.ts","sourceRoot":"","sources":["../../src/components/HistoryList.tsx"],"names":[],"mappings":"AACA,OAAO,EAAS,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAU3D,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,2CAiBhG"}

package/dist/components/HistoryList.js

@@ -0,0 +1,76 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Text } from '@stack-spot/citric-react';
+import { theme } from '@stack-spot/portal-theme';
+import { useTranslate } from '@stack-spot/portal-translate';
+import { groupBy, map } from 'lodash';
+import { useMemo } from 'react';
+import { styled } from 'styled-components';
+import { useMidnightUpdateView } from '../hooks/midnight-update-view.js';
+import { subtractDays } from '../utils/date.js';
+const HistoryBox = styled.div `
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+
+  > section {
+    > header {
+      background-color: ${theme.color.light[500]};
+      padding: 8px;
+      border-radius: 4px;
+      color: ${theme.color.light[700]};
+      margin-bottom: 4px;
+    }
+
+    > ul {
+      margin: 0;
+      padding: 0;
+      list-style: none;
+      display: flex;
+      flex-direction: column;
+      gap: 2px;
+    }
+  }
+`;
+function dateToSectionName(date) {
+    const now = new Date();
+    if (date.toDateString() === now.toDateString())
+        return 'today';
+    const yesterday = subtractDays(now, 1);
+    if (date.toDateString() === yesterday.toDateString())
+        return 'yesterday';
+    const todayAtMidnight = new Date(now.toDateString());
+    const last7Days = subtractDays(todayAtMidnight, 7);
+    if (date.getTime() >= last7Days.getTime())
+        return 'last7';
+    const last30Days = subtractDays(todayAtMidnight, 30);
+    return date.getTime() >= last30Days.getTime() ? 'last30' : 'older';
+}
+/**
+ * Renders a history list, where the items are combined into sections according to their dates.
+ */
+export function HistoryList({ getDate, items, keygen, className, style, renderItem }) {
+    const t = useTranslate(dictionary);
+    useMidnightUpdateView();
+    const sections = useMemo(() => {
+        const byDate = groupBy(items, item => dateToSectionName(getDate(item)));
+        return map(byDate, (value, key) => (_jsxs("section", { children: [_jsx("header", { children: _jsx(Text, { children: t[key] }) }), _jsx("ul", { children: value.map(item => _jsx("li", { children: renderItem(item) }, keygen(item))) })] }, key)));
+    }, [items]);
+    return _jsx(HistoryBox, { className: className, style: style, children: sections });
+}
+const dictionary = {
+    en: {
+        today: 'Today',
+        yesterday: 'Yesterday',
+        last7: 'Last 7 days',
+        last30: 'Last 30 days',
+        older: 'Older',
+    },
+    pt: {
+        today: 'Hoje',
+        yesterday: 'Ontem',
+        last7: 'Últimos 7 dias',
+        last30: 'Últimos 30 dias',
+        older: 'Mais antigo',
+    },
+};
+//# sourceMappingURL=HistoryList.js.map

package/dist/components/HistoryList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HistoryList.js","sourceRoot":"","sources":["../../src/components/HistoryList.tsx"],"names":[],"mappings":"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"}

package/dist/components/ListResource.d.ts

@@ -0,0 +1,29 @@
+import { WithStyle } from '@stack-spot/portal-theme';
+/**
+ *
+ * @template T Type of list item.
+ */
+interface ListGroupProps<T> extends WithStyle {
+    /** Items to show. */
+    list: T[];
+    /** Render the label for an item. */
+    renderLabel: (item: T) => React.ReactNode;
+    /** Optional: element before label. */
+    renderBeforeElement?: (item: T) => React.ReactNode;
+    /** Optional: element after label. */
+    renderAfterElement?: (item: T) => React.ReactNode;
+    /** Optional: custom class name per item. */
+    optionClassName?: (item: T) => string | undefined;
+    /** Optional: custom style per item. */
+    optionStyle?: (item: T) => React.CSSProperties | undefined;
+    /** Unique key for each item. */
+    keygen: (item: T) => React.Key;
+}
+/**
+ * Renders a customizable list of items.
+ *
+ * @template T Type of list item.
+ */
+export declare function ListResource<T>({ list, renderLabel, renderBeforeElement, renderAfterElement, className, keygen, style }: ListGroupProps<T>): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=ListResource.d.ts.map

package/dist/components/ListResource.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListResource.d.ts","sourceRoot":"","sources":["../../src/components/ListResource.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAGpD;;;GAGG;AACH,UAAU,cAAc,CAAC,CAAC,CAAE,SAAQ,SAAS;IAE3C,qBAAqB;IACrB,IAAI,EAAE,CAAC,EAAE,CAAC;IAEV,oCAAoC;IACpC,WAAW,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IAE1C,sCAAsC;IACtC,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IAEnD,qCAAqC;IACrC,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IAElD,4CAA4C;IAC5C,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,GAAG,SAAS,CAAC;IAElD,uCAAuC;IACvC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,aAAa,GAAG,SAAS,CAAC;IAE3D,gCAAgC;IAChC,MAAM,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,GAAG,CAAC;CAChC;AAED;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,CAAC,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,EACpH,cAAc,CAAC,CAAC,CAAC,2CAqBpB"}

package/dist/components/ListResource.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Row, Text } from '@stack-spot/citric-react';
+import { useMemo } from 'react';
+/**
+ * Renders a customizable list of items.
+ *
+ * @template T Type of list item.
+ */
+export function ListResource({ list, renderLabel, renderBeforeElement, renderAfterElement, className, keygen, style }) {
+    const items = useMemo(() => list.map((listItem) => {
+        const label = renderLabel(listItem);
+        const content = typeof label === 'string' ? _jsx(Text, { children: label }) : label;
+        return (_jsx("li", { children: _jsxs(Row, { children: [renderBeforeElement?.(listItem), content, renderAfterElement?.(listItem)] }) }, keygen(listItem)));
+    }), [list]);
+    return (_jsx("ul", { style: { margin: 0, padding: 0, width: '100%', ...style }, className: className, children: items }));
+}
+//# sourceMappingURL=ListResource.js.map

package/dist/components/ListResource.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListResource.js","sourceRoot":"","sources":["../../src/components/ListResource.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,0BAA0B,CAAA;AAEpD,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AA8B/B;;;;GAIG;AACH,MAAM,UAAU,YAAY,CAAI,EAAE,IAAI,EAAE,WAAW,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EACjG;IACnB,MAAM,KAAK,GAAG,OAAO,CAAC,GAAG,EAAE,CACzB,IAAI,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE;QACpB,MAAM,KAAK,GAAG,WAAW,CAAC,QAAQ,CAAC,CAAA;QACnC,MAAM,OAAO,GAAG,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAC,IAAI,cAAE,KAAK,GAAQ,CAAC,CAAC,CAAC,KAAK,CAAA;QACxE,OAAO,CACL,uBACE,MAAC,GAAG,eACD,mBAAmB,EAAE,CAAC,QAAQ,CAAC,EAC/B,OAAO,EACP,kBAAkB,EAAE,CAAC,QAAQ,CAAC,IAC3B,IALC,MAAM,CAAC,QAAQ,CAAC,CAMpB,CACN,CAAA;IACH,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAA;IAEb,OAAO,CACL,aAAI,KAAK,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,EAAE,SAAS,YAChF,KAAK,GACH,CACN,CAAA;AACH,CAAC"}

package/dist/components/Markdown.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Copied from the extension's webview.
+ */
+import { WithChildren } from '../types.js';
+import { Props as CodeProps } from './Code.js';
+type Props = Omit<CodeProps, 'language'> & WithChildren<string>;
+export declare const Markdown: ({ onInsertCode, onNewFile, onCopyCode, children, }: Props) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Markdown.d.ts.map

package/dist/components/Markdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Markdown.d.ts","sourceRoot":"","sources":["../../src/components/Markdown.tsx"],"names":[],"mappings":"AAAA;;GAEG;AAKH,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AACvC,OAAO,EAAQ,KAAK,IAAI,SAAS,EAAE,MAAM,QAAQ,CAAA;AAEjD,KAAK,KAAK,GAAG,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,GAAG,YAAY,CAAC,MAAM,CAAC,CAAA;AAc/D,eAAO,MAAM,QAAQ,uDAMhB,KAAK,4CAuBT,CAAA"}

package/dist/components/Markdown.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * Copied from the extension's webview.
+ */
+import { Children, Fragment } from 'react';
+import ReactMarkdown from 'react-markdown';
+import remarkGfm from 'remark-gfm';
+import { Code } from './Code.js';
+const renderP = (child, key) => (_jsx(Fragment, { children: typeof child === 'string'
+        ? child.split('\n').map((content, subKey, array) => (_jsxs(Fragment, { children: [content, subKey < array.length - 1 ? _jsx("br", {}) : null] }, subKey))) : child }, key));
+export const Markdown = ({ onInsertCode, onNewFile, onCopyCode, children, }) => (_jsx(_Fragment, { children: _jsx(ReactMarkdown, { className: "markdown apply-citric", remarkPlugins: [[remarkGfm]], components: {
+            a: props => _jsx("a", { target: "_blank", rel: "noopener noreferrer", style: { textDecoration: 'underline' }, ...props }),
+            code: props => _jsx(Code, { ...props, onInsertCode: onInsertCode, onNewFile: onNewFile, onCopyCode: onCopyCode, showActionBar: true }),
+            pre: ({ children }) => _jsx(_Fragment, { children: children }),
+            p: ({ children }) => _jsx("p", { children: Children.map(children, renderP) }),
+        }, children: children }) }));
+//# sourceMappingURL=Markdown.js.map

package/dist/components/Markdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Markdown.js","sourceRoot":"","sources":["../../src/components/Markdown.tsx"],"names":[],"mappings":";AAAA;;GAEG;AAEH,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAC1C,OAAO,aAAa,MAAM,gBAAgB,CAAA;AAC1C,OAAO,SAAS,MAAM,YAAY,CAAA;AAElC,OAAO,EAAE,IAAI,EAAsB,MAAM,QAAQ,CAAA;AAIjD,MAAM,OAAO,GAAG,CAAC,KAAU,EAAE,GAAW,EAAE,EAAE,CAAC,CAC3C,KAAC,QAAQ,cACN,OAAO,KAAK,KAAK,QAAQ;QACxB,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,CAClD,MAAC,QAAQ,eACN,OAAO,EACP,MAAM,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,cAAM,CAAC,CAAC,CAAC,IAAI,KAF7B,MAAM,CAGV,CACZ,CAAC,CAAC,CAAC,CAAC,KAAK,IAPC,GAAG,CAQP,CACZ,CAAA;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,CACtB,EACE,YAAY,EACZ,SAAS,EACT,UAAU,EACV,QAAQ,GACF,EACR,EAAE,CAAC,CACH,4BACE,KAAC,aAAa,IACZ,SAAS,EAAC,uBAAuB,EACjC,aAAa,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAC5B,UAAU,EAAE;YACV,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,YAAG,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,qBAAqB,EAAC,KAAK,EAAE,EAAE,cAAc,EAAE,WAAW,EAAE,KAAM,KAAK,GAAI;YAC9G,IAAI,EAAE,KAAK,CAAC,EAAE,CACZ,KAAC,IAAI,OACC,KAAK,EACT,YAAY,EAAE,YAAY,EAC1B,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,aAAa,SACb;YACJ,GAAG,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,4BAAG,QAAQ,GAAI;YACtC,CAAC,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,sBAAI,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,OAAO,CAAC,GAAK;SAC9D,YAEA,QAAQ,GACK,GACf,CACJ,CAAA"}

package/dist/components/Modal.d.ts

@@ -0,0 +1,9 @@
+interface Props {
+    children: React.ReactNode | React.ReactNode[];
+    title: React.ReactNode;
+    open: boolean;
+    onClose?: () => void;
+}
+export declare const Modal: ({ title, onClose, open, children }: Props) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Modal.d.ts.map

package/dist/components/Modal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../src/components/Modal.tsx"],"names":[],"mappings":"AAMA,UAAU,KAAK;IACb,QAAQ,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,EAAE,CAAC;IAC9C,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAeD,eAAO,MAAM,KAAK,uCAAwC,KAAK,4CAiD9D,CAAA"}

package/dist/components/Modal.js

@@ -0,0 +1,56 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { IconButton, Text } from '@stack-spot/citric-react';
+import { useTranslate } from '@stack-spot/portal-translate';
+import { useEffect, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+import { AnimatedOpacity } from './AnimatedOpacity.js';
+const ModalContent = ({ title, children, onClose }) => {
+    const t = useTranslate(dictionary);
+    return (_jsxs("div", { className: "chat-modal", children: [_jsxs("header", { children: [typeof title === 'string' ? _jsx(Text, { appearance: "h6", children: title }) : title, _jsx(IconButton, { icon: "Times", "aria-label": t.close, title: t.close, onClick: onClose })] }), _jsx("article", { children: children })] }));
+};
+export const Modal = ({ title, onClose, open, children }) => {
+    const ref = useRef(null);
+    const [closestChat, setClosestChat] = useState();
+    useEffect(() => {
+        if (!closestChat) {
+            const chat = ref.current?.closest('.ai-chat-widget');
+            if (!chat)
+                throw new Error('Could not find the chat widget (.ai-chat-widget) in the HTML tree.');
+            return setClosestChat(chat);
+        }
+        if (!open)
+            return;
+        const chatWindow = closestChat?.querySelector('.chat-window');
+        const rightPanel = closestChat?.querySelector('.chat-right-panel');
+        function closeOnClickOutside(event) {
+            const modal = closestChat?.querySelector('.chat-modal');
+            if (modal?.contains(event.target))
+                return;
+            onClose?.();
+        }
+        function onPressEsc(event) {
+            if (event.key === 'Escape')
+                onClose?.();
+        }
+        chatWindow?.setAttribute('inert', '');
+        rightPanel?.setAttribute('inert', '');
+        closestChat?.addEventListener('click', closeOnClickOutside);
+        document.addEventListener('keydown', onPressEsc);
+        return () => {
+            chatWindow?.removeAttribute('inert');
+            rightPanel?.removeAttribute('inert');
+            closestChat?.removeEventListener('click', closeOnClickOutside);
+            document.removeEventListener('keydown', onPressEsc);
+        };
+    }, [open]);
+    return (_jsx("div", { ref: ref, children: closestChat && createPortal(_jsx(AnimatedOpacity, { visible: open, children: _jsx(ModalContent, { title: title, onClose: onClose, children: children }) }), closestChat) }));
+};
+const dictionary = {
+    en: {
+        close: 'Close',
+    },
+    pt: {
+        close: 'Fechar',
+    },
+};
+//# sourceMappingURL=Modal.js.map

package/dist/components/Modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../src/components/Modal.tsx"],"names":[],"mappings":"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"}

package/dist/components/QuickStartButton.d.ts

@@ -0,0 +1,6 @@
+import { WithStyle } from '@stack-spot/portal-theme';
+import { ButtonAction } from '../types.js';
+type Props = ButtonAction & WithStyle;
+export declare const QuickStartButton: ({ label, onClick, className, group, icon, style }: Props) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=QuickStartButton.d.ts.map