@darajs/ui-components 0.4.8

package/dist/button/button.js

@@ -0,0 +1,169 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Copyright 2023 Impulse Innovations Limited
+ *
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { transparentize } from 'polished';
+import { forwardRef } from 'react';
+import styled, { useTheme } from '@darajs/styled-components';
+import Spinner from '../spinner/spinner';
+export const BaseButton = styled.button `
+    cursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};
+    user-select: none;
+
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    height: 2.5rem;
+    padding: ${(props) => (props.$hasAnchor ? 0 : '0 1rem')};
+    padding: 0 1rem;
+
+    font-size: 1rem;
+    font-weight: 600;
+
+    border: none;
+    border-radius: 0.25rem;
+`;
+/**
+ * Gets outline style for button
+ *
+ * @param buttonColor outline and text color for button
+ * @param disabled whether button is disabled
+ * @param theme the current theme being used by the app
+ */
+function getOutlinedButtonStyle(buttonColor, disabled, theme) {
+    return `
+        color: ${disabled ? theme.colors.grey2 : buttonColor};
+
+        background-color: transparent;
+        border: 1px solid
+            ${disabled ? theme.colors.grey2 : buttonColor};
+
+        :hover:not(:disabled) {
+            background-color: ${theme.themeType === 'dark' ? transparentize(0.85, buttonColor) : transparentize(0.9, buttonColor)};
+        }
+
+        :active:not(:disabled) {
+            background-color: ${theme.themeType === 'dark' ? transparentize(0.7, buttonColor) : transparentize(0.8, buttonColor)};
+        }
+    `;
+}
+/**
+ * Gets style for default button
+ *
+ * @param buttonColor background color for button
+ * @param hoverColor background color when hovering
+ * @param clickColor background color when clicking
+ * @param disabled whether button is disabled
+ * @param theme the current theme being used by the app
+ * @param textColor optional text color to use instead of the default
+ */
+function getFilledButtonStyle(buttonColor, hoverColor, clickColor, disabled, theme, textColor) {
+    const color = textColor !== null && textColor !== void 0 ? textColor : theme.colors.blue1;
+    return `
+        color: ${color};
+
+        background-color: ${disabled ? theme.colors.grey2 : buttonColor};
+
+        :hover:not(:disabled) {
+            background-color: ${hoverColor};
+        }
+
+        :active:not(:disabled) {
+            background-color: ${clickColor};
+        }
+    `;
+}
+const PrimaryButton = styled(BaseButton) `
+    ${(props) => props.outline ?
+    getOutlinedButtonStyle(props.theme.colors.primary, props.disabled, props.theme)
+    : getFilledButtonStyle(props.theme.colors.primary, props.theme.colors.primaryHover, props.theme.colors.primaryDown, props.disabled, props.theme)}
+`;
+const SecondaryButton = styled(BaseButton) `
+    ${(props) => props.outline ?
+    getOutlinedButtonStyle(props.theme.colors.secondary, props.disabled, props.theme)
+    : getFilledButtonStyle(props.theme.colors.secondary, props.theme.colors.secondaryHover, props.theme.colors.secondaryDown, props.disabled, props.theme)}
+`;
+const GhostButton = styled(BaseButton) `
+    ${(props) => getFilledButtonStyle('transparent', props.theme.colors.grey2, props.theme.colors.grey2, props.disabled, props.theme, props.theme.colors.grey4)}
+`;
+const ErrorButton = styled(BaseButton) `
+    ${(props) => props.outline ?
+    getOutlinedButtonStyle(props.theme.colors.error, props.disabled, props.theme)
+    : getFilledButtonStyle(props.theme.colors.error, props.theme.colors.errorHover, props.theme.colors.errorDown, props.disabled, props.theme)}
+`;
+const PlainButton = styled(BaseButton) `
+    ${(props) => props.outline ?
+    getOutlinedButtonStyle(props.theme.colors.grey6, props.disabled, props.theme)
+    : getFilledButtonStyle('transparent', props.theme.colors.grey1, props.theme.colors.grey2, props.disabled, props.theme, props.theme.colors.grey6)}
+`;
+const AnchorWrapper = styled.a `
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    width: 100%;
+    height: 100%;
+    padding: 0 1rem;
+
+    color: inherit;
+
+    :hover,
+    :active {
+        color: inherit;
+        text-decoration: none;
+    }
+`;
+const StyledLoading = styled(Spinner) `
+    padding: 1rem 2rem;
+`;
+/** Map of styling -> Button subclass */
+const stylingMap = {
+    error: ErrorButton,
+    ghost: GhostButton,
+    plain: PlainButton,
+    primary: PrimaryButton,
+    secondary: SecondaryButton,
+};
+/**
+ * A simple button component, accepts a styling prop to switch between the available styles: primary, secondary,
+ * error, success, ghost.
+ *
+ * @param {ButtonProps} props - the component props
+ */
+function Button(_a, ref) {
+    var { autoFocus, children, className, disabled, download, href, loading, id, onClick, outline = false, style, styling = 'primary', type = 'button' } = _a, props = __rest(_a, ["autoFocus", "children", "className", "disabled", "download", "href", "loading", "id", "onClick", "outline", "style", "styling", "type"]);
+    const currentTheme = useTheme();
+    const Component = stylingMap[styling];
+    const content = loading ? _jsx(StyledLoading, { color: outline ? currentTheme.colors.grey2 : currentTheme.colors.blue1 }) : children;
+    const wrappedContent = href ?
+        _jsx(AnchorWrapper, { download: download, href: href, children: content })
+        : content;
+    return (_jsx(Component, Object.assign({ "$hasAnchor": !!href, autoFocus: autoFocus, className: className, disabled: disabled || loading, id: id, onClick: onClick, outline: outline, style: style, type: type }, props, { ref: ref, children: wrappedContent })));
+}
+export default forwardRef(Button);
+//# sourceMappingURL=button.js.map

package/dist/button/button.js.map

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

package/dist/button-bar/button-bar.d.ts

@@ -0,0 +1,19 @@
+import { InteractiveComponentProps, Item } from '../types';
+export interface ButtonProps extends InteractiveComponentProps<Item> {
+    /** Component id */
+    id?: string;
+    /** The items to choose from */
+    items: Array<Item>;
+    /** Optional onClick handler, will be called when the button is pressed */
+    onSelect?: (option: Item) => void | Promise<void>;
+    /** The style of the button, accepts: primary, secondary. Defaults to primary */
+    styling?: 'primary' | 'secondary';
+}
+/**
+ * A button bar component that has radio group type behavior for selecting from different options
+ *
+ * @param {ButtonProps} props - the component props
+ */
+declare function ButtonBar({ className, disabled, id, value, initialValue, items, onSelect, style, styling, }: ButtonProps): JSX.Element;
+export default ButtonBar;
+//# sourceMappingURL=button-bar.d.ts.map

package/dist/button-bar/button-bar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-bar.d.ts","sourceRoot":"","sources":["../../src/button-bar/button-bar.tsx"],"names":[],"mappings":"AAsBA,OAAO,EAAE,yBAAyB,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAmG3D,MAAM,WAAW,WAAY,SAAQ,yBAAyB,CAAC,IAAI,CAAC;IAChE,mBAAmB;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,+BAA+B;IAC/B,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC;IACnB,0EAA0E;IAC1E,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,IAAI,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAClD,gFAAgF;IAChF,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAC;CACrC;AAED;;;;GAIG;AACH,iBAAS,SAAS,CAAC,EACf,SAAS,EACT,QAAQ,EACR,EAAE,EACF,KAAK,EACL,YAAY,EACZ,KAAK,EACL,QAAQ,EACR,KAAK,EACL,OAAmB,GACtB,EAAE,WAAW,GAAG,GAAG,CAAC,OAAO,CAuC3B;AAED,eAAe,SAAS,CAAC"}

package/dist/button-bar/button-bar.js

@@ -0,0 +1,124 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Copyright 2023 Impulse Innovations Limited
+ *
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { transparentize } from 'polished';
+import { useCallback, useEffect, useState } from 'react';
+import styled from '@darajs/styled-components';
+import { BaseButton } from '../button/button';
+const ButtonBarWrapper = styled.div `
+    overflow: hidden;
+    display: flex;
+    flex: 1 1 auto;
+
+    height: 2.5rem;
+
+    border: 1px solid ${(props) => { var _a; return (props.disabled ? props.theme.colors.grey2 : (_a = props.theme.colors) === null || _a === void 0 ? void 0 : _a[props.styling]); }};
+    border-radius: 0.25rem;
+
+    button:not(:last-child) {
+        border-right: 1px solid
+            ${(props) => { var _a; return (props.disabled ? props.theme.colors.grey2 : (_a = props.theme.colors) === null || _a === void 0 ? void 0 : _a[props.styling]); }};
+    }
+`;
+// Prevents the enabled prop being added to the dom element
+const shouldForwardProp = (prop) => !['selected'].includes(prop);
+/**
+ * Gets style for default button
+ *
+ * @param buttonColor background color for button
+ * @param disabled whether button is disabled
+ * @param theme the current theme being used by the app
+ */
+function getButtonStyle(buttonColor, disabled, selected, theme) {
+    let color = buttonColor;
+    let backgroundColor = 'transparent';
+    if (selected) {
+        color = theme.colors.background;
+        backgroundColor = buttonColor;
+    }
+    if (disabled) {
+        color = theme.colors.grey2;
+        backgroundColor = theme.colors.blue1;
+    }
+    if (disabled && selected) {
+        color = theme.colors.blue1;
+        backgroundColor = theme.colors.grey2;
+    }
+    return `
+    flex: 1 1 auto;
+
+    margin: 0px;
+
+    color: ${color};
+
+    background-color: ${backgroundColor};
+    border-radius: 0px;
+    height: 100%;
+
+    ${!selected &&
+        (theme.themeType === 'dark' ?
+            `
+        :hover:not(:disabled) {
+            background-color: ${transparentize(0.8, buttonColor)};
+        }
+
+
+        :active:not(:disabled) {
+            background-color: ${transparentize(0.6, buttonColor)};
+        }
+    `
+            : `
+        :hover:not(:disabled) {
+            background-color: ${transparentize(0.9, buttonColor)};
+        }
+
+
+        :active:not(:disabled) {
+            background-color: ${transparentize(0.8, buttonColor)};
+        }
+    `)}
+    `;
+}
+const PrimaryButton = styled(BaseButton).withConfig({ shouldForwardProp }) `
+    ${(props) => getButtonStyle(props.theme.colors.primary, props.disabled, props.selected, props.theme)}
+`;
+const SecondaryButton = styled(BaseButton).withConfig({ shouldForwardProp }) `
+    ${(props) => getButtonStyle(props.theme.colors.secondary, props.disabled, props.selected, props.theme)}
+`;
+/**
+ * A button bar component that has radio group type behavior for selecting from different options
+ *
+ * @param {ButtonProps} props - the component props
+ */
+function ButtonBar({ className, disabled, id, value, initialValue, items, onSelect, style, styling = 'primary', }) {
+    const [selected, setSelected] = useState(value || initialValue || items[0]);
+    const ButtonComponent = styling === 'secondary' ? SecondaryButton : PrimaryButton;
+    const onClick = useCallback((item) => {
+        onSelect === null || onSelect === void 0 ? void 0 : onSelect(item);
+        if (value === undefined) {
+            setSelected(item);
+        }
+    }, [value, onSelect]);
+    // Update selection based on value prop changes
+    useEffect(() => {
+        setSelected(value || initialValue || items[0]);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [value]);
+    return (_jsx(ButtonBarWrapper, { className: className, disabled: disabled, style: style, styling: styling, children: items.map((item) => (_jsx(ButtonComponent, { "$hasAnchor": false, "aria-selected": selected.value === item.value, disabled: disabled, id: id, onClick: () => onClick(item), selected: selected.value === item.value, type: "button", children: item.label }, `option-${String(item.value)}`))) }));
+}
+export default ButtonBar;
+//# sourceMappingURL=button-bar.js.map

package/dist/button-bar/button-bar.js.map

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

package/dist/carousel/carousel.d.ts

@@ -0,0 +1,23 @@
+import { CarouselItem } from '../types';
+export interface CarouselProps {
+    /** Standard react className property */
+    className?: string;
+    /** The initial value of the carousel */
+    initialValue?: number;
+    /** The items to display, each should have a label and a value */
+    items: Array<CarouselItem>;
+    /** Callback function that is called when the value changes */
+    onChange?: (value: number) => void | Promise<void>;
+    /** Pass through of style property to the root element */
+    style?: React.CSSProperties;
+    /** The value of the carousel */
+    value?: number;
+}
+/**
+ * A simple carousel component that wraps a list of items to be displayed and animates the translation between them.
+ *
+ * @param {CarouselProps} props - the props of the component
+ */
+declare function Carousel(props: CarouselProps): JSX.Element;
+export default Carousel;
+//# sourceMappingURL=carousel.d.ts.map

package/dist/carousel/carousel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel.d.ts","sourceRoot":"","sources":["../../src/carousel/carousel.tsx"],"names":[],"mappings":"AAqBA,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAkKxC,MAAM,WAAW,aAAa;IAC1B,wCAAwC;IACxC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wCAAwC;IACxC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iEAAiE;IACjE,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC;IAC3B,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACnD,yDAAyD;IACzD,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,gCAAgC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;;;GAIG;AACH,iBAAS,QAAQ,CAAC,KAAK,EAAE,aAAa,GAAG,GAAG,CAAC,OAAO,CAuEnD;AAED,eAAe,QAAQ,CAAC"}

package/dist/carousel/carousel.js

@@ -0,0 +1,178 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Copyright 2023 Impulse Innovations Limited
+ *
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { useCallback, useEffect, useState } from 'react';
+import styled from '@darajs/styled-components';
+import { ChevronLeft, ChevronRight, Circle } from '@darajs/ui-icons';
+const CarouselComponent = styled.div `
+    position: relative;
+
+    overflow: hidden;
+    display: flex;
+    flex: 1 1 auto;
+    flex-direction: column;
+    justify-content: center;
+
+    max-height: 100%;
+    padding: 0 0.5rem;
+`;
+const CarouselItemsContainer = styled.div `
+    display: inline-flex;
+    max-height: calc(100% - 1.625rem);
+    white-space: nowrap;
+    transition: transform 0.3s;
+`;
+const CarouselItemWrapper = styled.div `
+    display: flex;
+    flex: 1 0 auto;
+    justify-content: center;
+
+    width: 100%;
+    min-height: 5rem;
+    max-height: 100%;
+`;
+const CarouselIndicators = styled.div `
+    display: flex;
+    gap: 0.2rem;
+    justify-content: center;
+`;
+const Button = styled.button `
+    cursor: pointer;
+    user-select: none;
+
+    position: absolute;
+    z-index: 3;
+    top: calc(50% - 0.5rem);
+    transform: translateY(-50%);
+
+    display: flex;
+    align-items: center;
+
+    padding: 0;
+
+    color: ${(props) => props.theme.colors.grey4};
+
+    background-color: inherit;
+    border: none;
+
+    :hover {
+        color: ${(props) => props.theme.colors.grey5};
+    }
+`;
+const CircleSelect = styled.button `
+    cursor: pointer;
+    user-select: none;
+
+    z-index: 3;
+
+    padding: 0;
+
+    color: ${(props) => (props.selected ? props.theme.colors.grey4 : props.theme.colors.grey3)};
+
+    background-color: inherit;
+    border: none;
+
+    :hover {
+        color: ${(props) => props.theme.colors.grey4};
+    }
+
+    svg {
+        width: 0.5rem;
+        height: 0.5rem;
+    }
+`;
+const ImageWrapper = styled.div `
+    display: flex;
+    flex: 0 0 auto;
+    align-items: center;
+    justify-content: center;
+`;
+const TextWrapper = styled.div `
+    overflow: auto;
+    display: flex;
+    flex: 1 1 auto;
+    flex-direction: column;
+
+    box-sizing: border-box;
+    margin: 1rem 0;
+    padding: 0 1.5rem;
+
+    color: ${(props) => props.theme.colors.text};
+`;
+const Title = styled.div `
+    display: flex;
+    flex: 0 0 auto;
+    font-weight: bold;
+    color: ${(props) => props.theme.colors.text};
+`;
+const CarouselItemContainer = (props) => {
+    return (_jsx(CarouselItemWrapper, { children: _jsxs("div", { style: {
+                display: 'flex',
+                flexDirection: 'column',
+                margin: '0rem 1rem',
+                overflow: 'auto',
+                whiteSpace: 'normal',
+            }, children: [props.item.image && (_jsx(ImageWrapper, { children: _jsx("img", { alt: props.item.imageAlt, src: props.item.image, style: {
+                            height: props.item.imageHeight,
+                            width: props.item.imageWidth,
+                        } }) })), (props.item.title || props.item.subtitle) && (_jsxs(TextWrapper, { style: {
+                        gap: `${props.item.title && props.item.subtitle ? '0.5rem' : '0'}`,
+                        maxWidth: '100%',
+                    }, children: [_jsx(Title, { children: props.item.title }), _jsx("span", { children: props.item.subtitle })] })), props.item.component && props.item.component] }) }));
+};
+/**
+ * A simple carousel component that wraps a list of items to be displayed and animates the translation between them.
+ *
+ * @param {CarouselProps} props - the props of the component
+ */
+function Carousel(props) {
+    const [activeIndex, setActiveIndex] = useState(props.value || props.initialValue || 0);
+    const updateIndex = useCallback((newIndex) => {
+        var _a;
+        let _newIndex = newIndex;
+        if (newIndex < 0) {
+            _newIndex = props.items.length - 1;
+        }
+        else if (newIndex >= props.items.length) {
+            _newIndex = 0;
+        }
+        (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, _newIndex);
+        // uncontrolled component
+        if (props.value === undefined) {
+            setActiveIndex(_newIndex);
+        }
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [props.onChange, props.items, props.value]);
+    useEffect(() => {
+        setActiveIndex(props.value || props.initialValue || 0);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [props.value]);
+    return (_jsxs(CarouselComponent, { className: props.className, style: props.style, children: [_jsx(Button, { "data-testid": "carousel-left-button", onClick: () => {
+                    updateIndex(activeIndex - 1);
+                }, style: { left: '0.5rem' }, type: "button", children: _jsx(ChevronLeft, {}) }), _jsx(CarouselItemsContainer, { style: { transform: `translateX(-${activeIndex * 100}%)` }, children: props.items.map((item, index) => {
+                    return _jsx(CarouselItemContainer, { item: item }, `carousel-item-${index}`);
+                }) }), _jsx(Button, { "data-testid": "carousel-right-button", onClick: () => {
+                    updateIndex(activeIndex + 1);
+                }, style: { right: '0.5rem' }, type: "button", children: _jsx(ChevronRight, {}) }), _jsx(CarouselIndicators, { children: props.items.map((item, index) => {
+                    return (_jsx(CircleSelect, { onClick: () => {
+                            updateIndex(index);
+                        }, selected: index === activeIndex, type: "button", children: _jsx(Circle, {}) }, `carousel-select-${index}`));
+                }) })] }));
+}
+export default Carousel;
+//# sourceMappingURL=carousel.js.map

package/dist/carousel/carousel.js.map

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

package/dist/chat/chat.d.ts

@@ -0,0 +1,28 @@
+import * as React from 'react';
+import { InteractiveComponentProps, Message, UserData } from '../types';
+export interface ChatProps extends InteractiveComponentProps<Message[]> {
+    /** Event triggered when the chat sidebar is closed */
+    onClose?: () => void | Promise<void>;
+    /** Event triggered when the chat is changed */
+    onUpdate?: (value: Message[]) => void | Promise<void>;
+    /** The user who is currently active in the chat */
+    activeUser: UserData;
+    /** The title to appear at the top of the chat */
+    chatTitle?: string;
+    /** The placeholder text for the reply field */
+    placeholder?: string;
+    /** Whether the chat is in a popup and should be styled as such */
+    isPopup?: boolean;
+    /** A component showing the loading state of the chat, it appears above the input area, when not loading the caller can set it to null */
+    loadingComponent?: React.ReactNode;
+    /** Whether the user can edit/delete previous messages */
+    isHistoryReadonly?: boolean;
+}
+/**
+ * A chat component
+ *
+ * @param {ChatProps} props - the component props
+ */
+declare function Chat(props: ChatProps): JSX.Element;
+export default Chat;
+//# sourceMappingURL=chat.d.ts.map

package/dist/chat/chat.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat.d.ts","sourceRoot":"","sources":["../../src/chat/chat.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,EAAE,yBAAyB,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAkExE,MAAM,WAAW,SAAU,SAAQ,yBAAyB,CAAC,OAAO,EAAE,CAAC;IACnE,sDAAsD;IACtD,OAAO,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACrC,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACtD,mDAAmD;IACnD,UAAU,EAAE,QAAQ,CAAC;IACrB,iDAAiD;IACjD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,+CAA+C;IAC/C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kEAAkE;IAClE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,yIAAyI;IACzI,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACnC,yDAAyD;IACzD,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC/B;AA0BD;;;;GAIG;AACH,iBAAS,IAAI,CAAC,KAAK,EAAE,SAAS,GAAG,GAAG,CAAC,OAAO,CAqH3C;AAED,eAAe,IAAI,CAAC"}